diff --git a/.dockerignore b/.dockerignore
index 72943ddcc0..ee5c23bed8 100644
--- a/.dockerignore
+++ b/.dockerignore
@@ -65,6 +65,7 @@ README*
 .env
 .env.*
 !.env.example
+!engine/.env
 
 # Misc
 *.swp
diff --git a/.editorconfig b/.editorconfig
index 872fe6c2ca..665a74a09a 100644
--- a/.editorconfig
+++ b/.editorconfig
@@ -15,6 +15,7 @@ max_line_length = 100
 
 [*.py]
 indent_size = 4
+max_line_length = 120
 
 [*.gradle]
 indent_size = 4
diff --git a/.github/aur/stirling-pdf-bin/PKGBUILD b/.github/aur/stirling-pdf-bin/PKGBUILD
new file mode 100644
index 0000000000..bc6f59cea3
--- /dev/null
+++ b/.github/aur/stirling-pdf-bin/PKGBUILD
@@ -0,0 +1,29 @@
+# Maintainer: Stirling PDF Inc <contact@stirlingpdf.com>
+pkgname=stirling-pdf-bin
+pkgver=2.7.3
+pkgrel=1
+pkgdesc="Locally hosted, web-based PDF manipulation tool (desktop app, prebuilt binary)"
+arch=('x86_64')
+url="https://www.stirling.com"
+license=('MIT' 'LicenseRef-Stirling-PDF-Proprietary')
+depends=('gtk3' 'webkit2gtk' 'libappindicator-gtk3')
+provides=('stirling-pdf')
+conflicts=('stirling-pdf' 'stirling-pdf-git')
+options=('!strip')
+
+source_x86_64=("${pkgname}-${pkgver}.deb::https://github.com/Stirling-Tools/Stirling-PDF/releases/download/v${pkgver}/Stirling-PDF-linux-x86_64.deb")
+sha256sums_x86_64=('PLACEHOLDER_DEB_SHA256')
+
+package() {
+    # Extract the .deb archive
+    bsdtar -xf data.tar* -C "${pkgdir}"
+
+    # Fix permissions
+    find "${pkgdir}" -type d -exec chmod 755 {} \;
+
+    # Install license
+    install -Dm644 /dev/stdin "${pkgdir}/usr/share/licenses/${pkgname}/LICENSE" <<EOF
+Copyright (c) 2025 Stirling PDF Inc
+All rights reserved. See https://github.com/Stirling-Tools/Stirling-PDF/blob/main/LICENSE
+EOF
+}
diff --git a/.github/aur/stirling-pdf-server-bin/PKGBUILD b/.github/aur/stirling-pdf-server-bin/PKGBUILD
new file mode 100644
index 0000000000..3e0119e10e
--- /dev/null
+++ b/.github/aur/stirling-pdf-server-bin/PKGBUILD
@@ -0,0 +1,90 @@
+# Maintainer: Stirling PDF Inc <contact@stirlingpdf.com>
+pkgname=stirling-pdf-server-bin
+pkgver=2.7.3
+pkgrel=1
+pkgdesc="Locally hosted, web-based PDF manipulation tool (server JAR, prebuilt)"
+arch=('any')
+url="https://www.stirling.com"
+license=('MIT' 'LicenseRef-Stirling-PDF-Proprietary')
+depends=('java-runtime>=21')
+provides=('stirling-pdf-server')
+conflicts=('stirling-pdf-server' 'stirling-pdf-server-git')
+backup=('etc/stirling-pdf-server/settings.yml')
+
+source=("Stirling-PDF-with-login-${pkgver}.jar::https://github.com/Stirling-Tools/Stirling-PDF/releases/download/v${pkgver}/Stirling-PDF-with-login.jar"
+        "stirling-pdf-server.service"
+        "stirling-pdf-server.sysusers"
+        "stirling-pdf-server.tmpfiles")
+sha256sums=('PLACEHOLDER_JAR_SHA256'
+            'PLACEHOLDER_SERVICE_SHA256'
+            'PLACEHOLDER_SYSUSERS_SHA256'
+            'PLACEHOLDER_TMPFILES_SHA256')
+
+prepare() {
+    cat > stirling-pdf-server.service << 'EOF'
+[Unit]
+Description=Stirling-PDF Server
+After=network.target
+
+[Service]
+Type=simple
+User=stirling-pdf
+Group=stirling-pdf
+WorkingDirectory=/var/lib/stirling-pdf-server
+ExecStart=/usr/bin/java -jar /usr/share/stirling-pdf-server/stirling-pdf-server.jar
+Restart=on-failure
+RestartSec=5
+StandardOutput=journal
+StandardError=journal
+SyslogIdentifier=stirling-pdf-server
+Environment=JAVA_OPTS=-Xmx512m
+
+[Install]
+WantedBy=multi-user.target
+EOF
+
+    cat > stirling-pdf-server.sysusers << 'EOF'
+u stirling-pdf - "Stirling-PDF Server" /var/lib/stirling-pdf-server -
+EOF
+
+    cat > stirling-pdf-server.tmpfiles << 'EOF'
+d /var/lib/stirling-pdf-server 0750 stirling-pdf stirling-pdf -
+d /var/log/stirling-pdf-server 0750 stirling-pdf stirling-pdf -
+EOF
+}
+
+package() {
+    # JAR
+    install -Dm644 "Stirling-PDF-with-login-${pkgver}.jar" \
+        "${pkgdir}/usr/share/stirling-pdf-server/stirling-pdf-server.jar"
+
+    # Wrapper script
+    install -Dm755 /dev/stdin "${pkgdir}/usr/bin/stirling-pdf-server" << 'EOF'
+#!/bin/sh
+exec java $JAVA_OPTS -jar /usr/share/stirling-pdf-server/stirling-pdf-server.jar "$@"
+EOF
+
+    # systemd unit
+    install -Dm644 stirling-pdf-server.service \
+        "${pkgdir}/usr/lib/systemd/system/stirling-pdf-server.service"
+
+    # sysusers / tmpfiles
+    install -Dm644 stirling-pdf-server.sysusers \
+        "${pkgdir}/usr/lib/sysusers.d/stirling-pdf-server.conf"
+    install -Dm644 stirling-pdf-server.tmpfiles \
+        "${pkgdir}/usr/lib/tmpfiles.d/stirling-pdf-server.conf"
+
+    # Default config stub
+    install -dm755 "${pkgdir}/etc/stirling-pdf-server"
+    install -Dm644 /dev/stdin "${pkgdir}/etc/stirling-pdf-server/settings.yml" << 'EOF'
+# Stirling-PDF Server configuration
+# See https://github.com/Stirling-Tools/Stirling-PDF for all options
+server:
+  port: 8080
+EOF
+
+    # License
+    install -Dm644 /dev/stdin "${pkgdir}/usr/share/licenses/${pkgname}/LICENSE" << 'EOF'
+MIT License — see https://github.com/Stirling-Tools/Stirling-PDF/blob/main/LICENSE
+EOF
+}
diff --git a/.github/config/.files.yaml b/.github/config/.files.yaml
index 7d73e47137..48d03bfc73 100644
--- a/.github/config/.files.yaml
+++ b/.github/config/.files.yaml
@@ -46,8 +46,7 @@ frontend: &frontend
   - testing/**
   - docker/**
   - scripts/translations/*.py
-  - scripts/build-tauri-jlink.bat
-  - scripts/build-tauri-jlink.sh
+  - .taskfiles/desktop.yml
   - scripts/convert_cff_to_ttf.py
   - scripts/harvest_type3_fonts.py
   - scripts/ignore_translation.toml
diff --git a/.github/pull_request_template.md b/.github/pull_request_template.md
index d1287c0117..d9eb6dbe10 100644
--- a/.github/pull_request_template.md
+++ b/.github/pull_request_template.md
@@ -17,7 +17,7 @@ Closes #(issue_number)
 ### General
 
 - [ ] I have read the [Contribution Guidelines](https://github.com/Stirling-Tools/Stirling-PDF/blob/main/CONTRIBUTING.md)
-- [ ] I have read the [Stirling-PDF Developer Guide](https://github.com/Stirling-Tools/Stirling-PDF/blob/main/devGuide/DeveloperGuide.md) (if applicable)
+- [ ] I have read the [Stirling-PDF Developer Guide](https://github.com/Stirling-Tools/Stirling-PDF/blob/main/DeveloperGuide.md) (if applicable)
 - [ ] I have read the [How to add new languages to Stirling-PDF](https://github.com/Stirling-Tools/Stirling-PDF/blob/main/devGuide/HowToAddNewLanguage.md) (if applicable)
 - [ ] I have performed a self-review of my own code
 - [ ] My changes generate no new warnings
@@ -37,4 +37,5 @@ Closes #(issue_number)
 
 ### Testing (if applicable)
 
-- [ ] I have tested my changes locally. Refer to the [Testing Guide](https://github.com/Stirling-Tools/Stirling-PDF/blob/main/devGuide/DeveloperGuide.md#6-testing) for more details.
+- [ ] I have run `task check` to verify linters, typechecks, and tests pass
+- [ ] I have tested my changes locally. Refer to the [Testing Guide](https://github.com/Stirling-Tools/Stirling-PDF/blob/main/DeveloperGuide.md#7-testing) for more details.
diff --git a/.github/workflows/PR-Demo-Comment-with-react.yml b/.github/workflows/PR-Demo-Comment-with-react.yml
index 2fc00080af..9762af9822 100644
--- a/.github/workflows/PR-Demo-Comment-with-react.yml
+++ b/.github/workflows/PR-Demo-Comment-with-react.yml
@@ -3,6 +3,31 @@ name: PR Deployment via Comment
 on:
   issue_comment:
     types: [created]
+  workflow_dispatch:
+    inputs:
+      pr_number:
+        description: "PR number to deploy"
+        required: true
+      enable_prototypes:
+        description: "Build with prototypes frontend"
+        required: false
+        type: boolean
+        default: false
+      enable_pro:
+        description: "Enable pro features"
+        required: false
+        type: boolean
+        default: false
+      enable_enterprise:
+        description: "Enable enterprise features"
+        required: false
+        type: boolean
+        default: false
+      disable_security:
+        description: "Disable security/login"
+        required: false
+        type: boolean
+        default: true
 
 permissions:
   contents: read
@@ -14,23 +39,27 @@ jobs:
     permissions:
       issues: write
     if: |
-      vars.CI_PROFILE != 'lite' &&
-      github.event.issue.pull_request &&
-      (
-        contains(github.event.comment.body, 'prdeploy') ||
-        contains(github.event.comment.body, 'deploypr')
-      )
-      &&
-      (
-        github.event.comment.user.login == 'frooodle' ||
-        github.event.comment.user.login == 'sf298' ||
-        github.event.comment.user.login == 'Ludy87' ||
-        github.event.comment.user.login == 'balazs-szucs' ||
-        github.event.comment.user.login == 'reecebrowne' ||
-        github.event.comment.user.login == 'DarioGii' ||
-        github.event.comment.user.login == 'EthanHealy01' ||
-        github.event.comment.user.login == 'jbrunton96' ||
-        github.event.comment.user.login == 'ConnorYoh'
+      vars.CI_PROFILE != 'lite' && (
+        github.event_name == 'workflow_dispatch' ||
+        (
+          github.event.issue.pull_request &&
+          (
+            contains(github.event.comment.body, 'prdeploy') ||
+            contains(github.event.comment.body, 'deploypr')
+          )
+          &&
+          (
+            github.event.comment.user.login == 'frooodle' ||
+            github.event.comment.user.login == 'sf298' ||
+            github.event.comment.user.login == 'Ludy87' ||
+            github.event.comment.user.login == 'balazs-szucs' ||
+            github.event.comment.user.login == 'reecebrowne' ||
+            github.event.comment.user.login == 'DarioGii' ||
+            github.event.comment.user.login == 'EthanHealy01' ||
+            github.event.comment.user.login == 'jbrunton96' ||
+            github.event.comment.user.login == 'ConnorYoh'
+          )
+        )
       )
     outputs:
       pr_number: ${{ steps.get-pr.outputs.pr_number }}
@@ -38,6 +67,7 @@ jobs:
       disable_security: ${{ steps.check-security-flag.outputs.disable_security }}
       enable_pro: ${{ steps.check-pro-flag.outputs.enable_pro }}
       enable_enterprise: ${{ steps.check-pro-flag.outputs.enable_enterprise }}
+      enable_prototypes: ${{ steps.check-prototypes-flag.outputs.enable_prototypes }}
     steps:
       - name: Harden Runner
         uses: step-security/harden-runner@58077d3c7e43986b6b15fba718e8ea69e387dfcc # v2.15.1
@@ -61,7 +91,9 @@ jobs:
         uses: actions/github-script@ed597411d8f924073f98dfc5c65a23a2325f34cd # v8.0.0
         with:
           script: |
-            const prNumber = context.payload.issue.number;
+            const prNumber = context.eventName === 'workflow_dispatch'
+              ? context.payload.inputs.pr_number
+              : context.payload.issue.number;
             console.log(`PR Number: ${prNumber}`);
             core.setOutput('pr_number', prNumber);
 
@@ -69,12 +101,14 @@ jobs:
         id: check-security-flag
         env:
           COMMENT_BODY: ${{ github.event.comment.body }}
+          IS_DISPATCH: ${{ github.event_name == 'workflow_dispatch' }}
+          DISPATCH_DISABLE_SECURITY: ${{ inputs.disable_security }}
         run: |
-          if [[ "$COMMENT_BODY" == *"security"* ]] || [[ "$COMMENT_BODY" == *"login"* ]]; then
-            echo "Security flags detected in comment"
+          if [[ "$IS_DISPATCH" == "true" ]]; then
+            echo "disable_security=$DISPATCH_DISABLE_SECURITY" >> $GITHUB_OUTPUT
+          elif [[ "$COMMENT_BODY" == *"security"* ]] || [[ "$COMMENT_BODY" == *"login"* ]]; then
             echo "disable_security=false" >> $GITHUB_OUTPUT
           else
-            echo "No security flags detected in comment"
             echo "disable_security=true" >> $GITHUB_OUTPUT
           fi
 
@@ -82,22 +116,43 @@ jobs:
         id: check-pro-flag
         env:
           COMMENT_BODY: ${{ github.event.comment.body }}
+          IS_DISPATCH: ${{ github.event_name == 'workflow_dispatch' }}
+          DISPATCH_PRO: ${{ inputs.enable_pro }}
+          DISPATCH_ENTERPRISE: ${{ inputs.enable_enterprise }}
         run: |
-          if [[ "$COMMENT_BODY" == *"pro"* ]] || [[ "$COMMENT_BODY" == *"premium"* ]]; then
-            echo "pro flags detected in comment"
+          if [[ "$IS_DISPATCH" == "true" ]]; then
+            echo "enable_pro=$DISPATCH_PRO" >> $GITHUB_OUTPUT
+            echo "enable_enterprise=$DISPATCH_ENTERPRISE" >> $GITHUB_OUTPUT
+          elif [[ "$COMMENT_BODY" == *"pro"* ]] || [[ "$COMMENT_BODY" == *"premium"* ]]; then
             echo "enable_pro=true" >> $GITHUB_OUTPUT
             echo "enable_enterprise=false" >> $GITHUB_OUTPUT
           elif [[ "$COMMENT_BODY" == *"enterprise"* ]]; then
-            echo "enterprise flags detected in comment"
             echo "enable_enterprise=true" >> $GITHUB_OUTPUT
             echo "enable_pro=true" >> $GITHUB_OUTPUT
           else
-            echo "No pro or enterprise flags detected in comment"
             echo "enable_pro=false" >> $GITHUB_OUTPUT
             echo "enable_enterprise=false" >> $GITHUB_OUTPUT
           fi
 
+      - name: Check for prototypes flag
+        id: check-prototypes-flag
+        env:
+          COMMENT_BODY: ${{ github.event.comment.body }}
+          IS_DISPATCH: ${{ github.event_name == 'workflow_dispatch' }}
+          DISPATCH_PROTOTYPES: ${{ inputs.enable_prototypes }}
+        run: |
+          if [[ "$IS_DISPATCH" == "true" ]]; then
+            echo "enable_prototypes=$DISPATCH_PROTOTYPES" >> $GITHUB_OUTPUT
+          elif [[ "$COMMENT_BODY" == *"prototypes"* ]]; then
+            echo "Prototypes flag detected in comment"
+            echo "enable_prototypes=true" >> $GITHUB_OUTPUT
+          else
+            echo "No prototypes flag detected in comment"
+            echo "enable_prototypes=false" >> $GITHUB_OUTPUT
+          fi
+
       - name: Add 'in_progress' reaction to comment
+        if: github.event_name == 'issue_comment'
         id: add-eyes-reaction
         uses: actions/github-script@ed597411d8f924073f98dfc5c65a23a2325f34cd # v8.0.0
         with:
@@ -161,6 +216,8 @@ jobs:
         with:
           gradle-version: 9.3.1
 
+      - name: Install Task
+        uses: go-task/setup-task@3be4020d41929789a01026e0e427a4321ce0ad44 # v2.0.0
       - name: Run Gradle Command
         run: |
           if [ "${{ needs.check-comment.outputs.disable_security }}" == "true" ]; then
@@ -168,7 +225,7 @@ jobs:
           else
             export DISABLE_ADDITIONAL_FEATURES=false
           fi
-          ./gradlew build
+          task backend:build
         env:
           MAVEN_USER: ${{ secrets.MAVEN_USER }}
           MAVEN_PASSWORD: ${{ secrets.MAVEN_PASSWORD }}
@@ -193,7 +250,21 @@ jobs:
           cache-from: type=gha,scope=stirling-pdf-latest
           cache-to: type=gha,mode=max,scope=stirling-pdf-latest
           tags: ${{ secrets.DOCKER_HUB_USERNAME }}/test:pr-${{ needs.check-comment.outputs.pr_number }}
-          build-args: VERSION_TAG=alpha
+          build-args: |
+            VERSION_TAG=alpha
+            PROTOTYPES_BUILD=${{ needs.check-comment.outputs.enable_prototypes }}
+          platforms: linux/amd64
+
+      - name: Build and push engine image
+        if: needs.check-comment.outputs.enable_prototypes == 'true'
+        uses: docker/build-push-action@263435318d21b8e681c14492fe198d362a7d2c83 # v6.18.0
+        with:
+          context: ./engine
+          file: ./engine/Dockerfile
+          push: true
+          cache-from: type=gha,scope=stirling-pdf-engine
+          cache-to: type=gha,mode=max,scope=stirling-pdf-engine
+          tags: ${{ secrets.DOCKER_HUB_USERNAME }}/test:engine-pr-${{ needs.check-comment.outputs.pr_number }}
           platforms: linux/amd64
 
       - name: Set up SSH
@@ -231,33 +302,64 @@ jobs:
             PREMIUM_PROFEATURES_AUDIT_ENABLED="false"
           fi
 
+          ENABLE_PROTOTYPES="${{ needs.check-comment.outputs.enable_prototypes }}"
+          PR_NUMBER="${{ needs.check-comment.outputs.pr_number }}"
+          DOCKER_USER="${{ secrets.DOCKER_HUB_USERNAME }}"
+
+          # Build engine env vars for backend (only set when prototypes enabled)
+          if [ "$ENABLE_PROTOTYPES" == "true" ]; then
+            AI_ENGINE_VARS="
+                SYSTEM_AIENGINE_ENABLED: \"true\"
+                SYSTEM_AIENGINE_URL: \"http://stirling-pdf-engine-pr-${PR_NUMBER}:5001\""
+            ENGINE_SERVICE="
+            stirling-pdf-engine:
+              container_name: stirling-pdf-engine-pr-${PR_NUMBER}
+              image: ${DOCKER_USER}/test:engine-pr-${PR_NUMBER}
+              environment:
+                ANTHROPIC_API_KEY: \"${{ secrets.ANTHROPIC_API_KEY }}\"
+              networks:
+                - pr-network
+              restart: on-failure:5"
+            NETWORK_SECTION="
+          networks:
+            pr-network:"
+            BACKEND_NETWORK="
+              networks:
+                - pr-network"
+          else
+            AI_ENGINE_VARS=""
+            ENGINE_SERVICE=""
+            NETWORK_SECTION=""
+            BACKEND_NETWORK=""
+          fi
+
           # First create the docker-compose content locally
           cat > docker-compose.yml << EOF
           version: '3.3'
           services:
             stirling-pdf:
-              container_name: stirling-pdf-pr-${{ needs.check-comment.outputs.pr_number }}
-              image: ${{ secrets.DOCKER_HUB_USERNAME }}/test:pr-${{ needs.check-comment.outputs.pr_number }}
+              container_name: stirling-pdf-pr-${PR_NUMBER}
+              image: ${DOCKER_USER}/test:pr-${PR_NUMBER}
               ports:
-                - "${{ needs.check-comment.outputs.pr_number }}:8080"
+                - "${PR_NUMBER}:8080"
               volumes:
-                - /stirling/PR-${{ needs.check-comment.outputs.pr_number }}/data:/usr/share/tessdata:rw
-                - /stirling/PR-${{ needs.check-comment.outputs.pr_number }}/config:/configs:rw
-                - /stirling/PR-${{ needs.check-comment.outputs.pr_number }}/logs:/logs:rw
+                - /stirling/PR-${PR_NUMBER}/data:/usr/share/tessdata:rw
+                - /stirling/PR-${PR_NUMBER}/config:/configs:rw
+                - /stirling/PR-${PR_NUMBER}/logs:/logs:rw
               environment:
                 DISABLE_ADDITIONAL_FEATURES: "${DISABLE_ADDITIONAL_FEATURES}"
                 SECURITY_ENABLELOGIN: "${LOGIN_SECURITY}"
                 SYSTEM_DEFAULTLOCALE: en-GB
-                UI_APPNAME: "Stirling-PDF PR#${{ needs.check-comment.outputs.pr_number }}"
-                UI_HOMEDESCRIPTION: "PR#${{ needs.check-comment.outputs.pr_number }} for Stirling-PDF Latest"
-                UI_APPNAMENAVBAR: "PR#${{ needs.check-comment.outputs.pr_number }}"
+                UI_APPNAME: "Stirling-PDF PR#${PR_NUMBER}"
+                UI_HOMEDESCRIPTION: "PR#${PR_NUMBER} for Stirling-PDF Latest"
+                UI_APPNAMENAVBAR: "PR#${PR_NUMBER}"
                 SYSTEM_MAXFILESIZE: "100"
                 METRICS_ENABLED: "true"
                 SYSTEM_GOOGLEVISIBILITY: "false"
                 PREMIUM_KEY:                         "${PREMIUM_KEY}"
                 PREMIUM_ENABLED:                     "${PREMIUM_ENABLED}"
-                PREMIUM_PROFEATURES_AUDIT_ENABLED:   "${PREMIUM_PROFEATURES_AUDIT_ENABLED}"
-              restart: on-failure:5
+                PREMIUM_PROFEATURES_AUDIT_ENABLED:   "${PREMIUM_PROFEATURES_AUDIT_ENABLED}"${AI_ENGINE_VARS}
+              restart: on-failure:5${BACKEND_NETWORK}${ENGINE_SERVICE}${NETWORK_SECTION}
           EOF
 
           # Then copy the file and execute commands
@@ -265,13 +367,13 @@ jobs:
 
           ssh -i ../private.key -o StrictHostKeyChecking=no -o UserKnownHostsFile=/dev/null -T ${{ secrets.NEW_VPS_USERNAME }}@${{ secrets.NEW_VPS_HOST }} << ENDSSH
             # Create PR-specific directories
-            mkdir -p /stirling/PR-${{ needs.check-comment.outputs.pr_number }}/{data,config,logs}
+            mkdir -p /stirling/PR-${PR_NUMBER}/{data,config,logs}
 
             # Move docker-compose file to correct location
-            mv /tmp/docker-compose.yml /stirling/PR-${{ needs.check-comment.outputs.pr_number }}/docker-compose.yml
+            mv /tmp/docker-compose.yml /stirling/PR-${PR_NUMBER}/docker-compose.yml
 
             # Start or restart the container
-            cd /stirling/PR-${{ needs.check-comment.outputs.pr_number }}
+            cd /stirling/PR-${PR_NUMBER}
             docker-compose pull
             docker-compose up -d
           ENDSSH
@@ -280,7 +382,7 @@ jobs:
           echo "security_status=${SECURITY_STATUS}" >> $GITHUB_ENV
 
       - name: Add success reaction to comment
-        if: success()
+        if: success() && github.event_name == 'issue_comment'
         uses: actions/github-script@ed597411d8f924073f98dfc5c65a23a2325f34cd # v8.0.0
         with:
           github-token: ${{ steps.setup-bot.outputs.token }}
@@ -315,7 +417,7 @@ jobs:
             }
 
       - name: Add failure reaction to comment
-        if: failure()
+        if: failure() && github.event_name == 'issue_comment'
         uses: actions/github-script@ed597411d8f924073f98dfc5c65a23a2325f34cd # v8.0.0
         with:
           github-token: ${{ steps.setup-bot.outputs.token }}
diff --git a/.github/workflows/PR-Demo-cleanup.yml b/.github/workflows/PR-Demo-cleanup.yml
index ced43f37f8..cc72cc024c 100644
--- a/.github/workflows/PR-Demo-cleanup.yml
+++ b/.github/workflows/PR-Demo-cleanup.yml
@@ -121,8 +121,9 @@ jobs:
               # Remove PR-specific directories
               rm -rf /stirling/PR-${{ github.event.pull_request.number }}
 
-              # Remove the Docker image
+              # Remove the Docker images
               docker rmi --no-prune ${{ secrets.DOCKER_HUB_USERNAME }}/test:pr-${{ github.event.pull_request.number }} || true
+              docker rmi --no-prune ${{ secrets.DOCKER_HUB_USERNAME }}/test:engine-pr-${{ github.event.pull_request.number }} || true
 
               echo "PERFORMED_CLEANUP"
             else
diff --git a/.github/workflows/ai-engine.yml b/.github/workflows/ai-engine.yml
index ed0569c312..a90246f887 100644
--- a/.github/workflows/ai-engine.yml
+++ b/.github/workflows/ai-engine.yml
@@ -11,10 +11,6 @@ jobs:
     permissions:
       contents: read
       pull-requests: write
-    defaults:
-      run:
-        working-directory: engine
-
     steps:
       - name: Checkout code
         uses: actions/checkout@v4
@@ -24,60 +20,85 @@ jobs:
         with:
           enable-cache: true
 
-      - name: Install dependencies
-        run: make install
-
-      - name: Run fixers
-        # Ignore errors here because we're going to add comments for them in the following steps before actually failing
-        run: make fix || true
-
-      - name: Check for fixer changes
-        id: fixer_changes
-        run: |
-          if git diff --quiet; then
-            echo "changed=false" >> "$GITHUB_OUTPUT"
-          else
-            echo "changed=true" >> "$GITHUB_OUTPUT"
-          fi
-
-      - name: Post fixer suggestions
-        if: steps.fixer_changes.outputs.changed == 'true' && github.event_name == 'pull_request'
-        uses: reviewdog/action-suggester@v1
-        continue-on-error: true
+      - name: Set up JDK 25
+        uses: actions/setup-java@be666c2fcd27ec809703dec50e508c2fdc7f6654 # v5.2.0
         with:
-          tool_name: engine-make-fix
-          github_token: ${{ secrets.GITHUB_TOKEN }}
-          filter_mode: file
-          fail_level: any
-          level: info
+          java-version: "25"
+          distribution: "temurin"
 
-      - name: Comment on fixer suggestions
-        if: steps.fixer_changes.outputs.changed == 'true' && github.event_name == 'pull_request'
-        uses: actions/github-script@v7
+      - name: Setup Gradle
+        uses: gradle/actions/setup-gradle@f29f5a9d7b09a7c6b29859002d29d24e1674c884 # v5.0.1
         with:
-          script: |
-            await github.rest.issues.createComment({
-              owner: context.repo.owner,
-              repo: context.repo.repo,
-              issue_number: context.issue.number,
-              body: "The Python code in your PR has formatting/linting issues. Consider running `make fix` locally or setting up your editor's Ruff integration to auto-format and lint your files as you go, or commit the suggested changes on this PR.",
-            });
+          gradle-version: 9.3.1
 
-      - name: Verify fixer changes are committed
-        if: steps.fixer_changes.outputs.changed == 'true'
+      - name: Install Task
+        uses: go-task/setup-task@3be4020d41929789a01026e0e427a4321ce0ad44 # v2.0.0
+
+      - name: Regenerate tool models
+        run: task engine:tool-models
+
+      - name: Verify tool models are up to date
         run: |
-          if ! git diff --exit-code; then
-            echo "Fixes are out of date."
-            echo "Apply the reviewdog suggestions or run 'make fix' from engine/ and commit the updated files."
-            git --no-pager diff --stat
+          if ! git diff --exit-code engine/src/stirling/models/tool_models.py; then
+            echo "tool_models.py is out of date."
+            echo "Run 'task engine:tool-models' locally and commit the updated file."
             exit 1
           fi
 
+      - name: Run fixers
+        run: task engine:fix
+
+      - name: Verify fixes are committed
+        id: fixer_changes
+        run: |
+          if ! git diff --quiet; then
+            git --no-pager diff --stat
+            echo "::error::There are issues with your Python code that will need to be fixed before they can be merged in. Run 'task engine:fix' to auto-fix what can be fixed automatically, then run 'task engine:check' to see what still needs fixing manually."
+            exit 1
+          fi
+
+      - name: Comment on fixer failures
+        if: steps.fixer_changes.outcome == 'failure' && github.event_name == 'pull_request'
+        continue-on-error: true
+        uses: actions/github-script@v7
+        with:
+          script: |
+            const marker = '<!-- engine-check -->';
+            const body = [
+              marker,
+              '### Engine Check Failed',
+              '',
+              'There are issues with your Python code that will need to be fixed before they can be merged in.',
+              '',
+              'Run `task engine:fix` to auto-fix what can be fixed automatically, then run `task engine:check` to see what still needs fixing manually.',
+            ].join('\n');
+            const { data: comments } = await github.rest.issues.listComments({
+              owner: context.repo.owner,
+              repo: context.repo.repo,
+              issue_number: context.issue.number,
+            });
+            const existing = comments.find(c => c.body.includes(marker));
+            if (existing) {
+              await github.rest.issues.updateComment({
+                owner: context.repo.owner,
+                repo: context.repo.repo,
+                comment_id: existing.id,
+                body,
+              });
+            } else {
+              await github.rest.issues.createComment({
+                owner: context.repo.owner,
+                repo: context.repo.repo,
+                issue_number: context.issue.number,
+                body,
+              });
+            }
+
       - name: Run linting
-        run: make lint
+        run: task engine:lint
 
       - name: Run type checking
-        run: make typecheck
+        run: task engine:typecheck
 
       - name: Run tests
-        run: make test
+        run: task engine:test
diff --git a/.github/workflows/aur-publish.yml b/.github/workflows/aur-publish.yml
new file mode 100644
index 0000000000..935e58ffe0
--- /dev/null
+++ b/.github/workflows/aur-publish.yml
@@ -0,0 +1,128 @@
+name: Publish to AUR
+
+on:
+  release:
+    types: [released]
+  workflow_dispatch:
+    inputs:
+      version:
+        description: "Version to publish (e.g. 2.9.2 — no v prefix)"
+        required: true
+        type: string
+      dry_run:
+        description: "Skip the AUR push (safe test)"
+        type: boolean
+        default: true
+
+permissions:
+  contents: read
+
+jobs:
+  get-release-info:
+    runs-on: ubuntu-latest
+    outputs:
+      version: ${{ steps.info.outputs.version }}
+      deb_sha256: ${{ steps.hashes.outputs.deb_sha256 }}
+      jar_sha256: ${{ steps.hashes.outputs.jar_sha256 }}
+    steps:
+      - name: Harden Runner
+        uses: step-security/harden-runner@6c3c2f2c1c457b00c10c4848d6f5491db3b629df # v2.18.0
+        with:
+          egress-policy: audit
+
+      - name: Extract version from tag or manual input
+        id: info
+        env:
+          DISPATCH_VERSION: ${{ inputs.version }}
+          RELEASE_TAG: ${{ github.event.release.tag_name }}
+        run: |
+          if [ "${{ github.event_name }}" = "workflow_dispatch" ]; then
+            VERSION="$DISPATCH_VERSION"
+          else
+            VERSION="$RELEASE_TAG"
+          fi
+          VERSION="${VERSION#v}"
+          echo "version=$VERSION" >> "$GITHUB_OUTPUT"
+
+      - name: Download release assets and compute SHA256
+        id: hashes
+        env:
+          VERSION: ${{ steps.info.outputs.version }}
+        run: |
+          BASE="https://github.com/Stirling-Tools/Stirling-PDF/releases/download/v${VERSION}"
+
+          download_sha256() {
+            local url="$1"
+            local file
+            file=$(basename "$url")
+            curl -fsSL --retry 3 -o "$file" "$url"
+            sha256sum "$file" | awk '{print $1}'
+          }
+
+          DEB_SHA=$(download_sha256 "${BASE}/Stirling-PDF-linux-x86_64.deb")
+          JAR_SHA=$(download_sha256 "${BASE}/Stirling-PDF-with-login.jar")
+
+          echo "deb_sha256=$DEB_SHA" >> "$GITHUB_OUTPUT"
+          echo "jar_sha256=$JAR_SHA" >> "$GITHUB_OUTPUT"
+
+  publish-aur:
+    needs: get-release-info
+    runs-on: ubuntu-latest
+    steps:
+      - name: Harden Runner
+        uses: step-security/harden-runner@v2
+        with:
+          egress-policy: audit
+
+      - name: Checkout repository (for PKGBUILD templates)
+        uses: actions/checkout@v4
+
+      - name: Update stirling-pdf-bin PKGBUILD
+        env:
+          VERSION: ${{ needs.get-release-info.outputs.version }}
+          DEB_SHA: ${{ needs.get-release-info.outputs.deb_sha256 }}
+        run: |
+          PKGBUILD=".github/aur/stirling-pdf-bin/PKGBUILD"
+          sed -i "s/^pkgver=.*/pkgver=${VERSION}/" "$PKGBUILD"
+          sed -i "s/^pkgrel=.*/pkgrel=1/" "$PKGBUILD"
+          sed -i "s/'PLACEHOLDER_DEB_SHA256'/'${DEB_SHA}'/" "$PKGBUILD"
+
+      - name: Update stirling-pdf-server-bin PKGBUILD
+        env:
+          VERSION: ${{ needs.get-release-info.outputs.version }}
+          JAR_SHA: ${{ needs.get-release-info.outputs.jar_sha256 }}
+        run: |
+          PKGBUILD=".github/aur/stirling-pdf-server-bin/PKGBUILD"
+          sed -i "s/^pkgver=.*/pkgver=${VERSION}/" "$PKGBUILD"
+          sed -i "s/^pkgrel=.*/pkgrel=1/" "$PKGBUILD"
+          sed -i "s/'PLACEHOLDER_JAR_SHA256'/'${JAR_SHA}'/" "$PKGBUILD"
+
+      - name: Show updated PKGBUILDs (for dry-run visibility)
+        run: |
+          echo "--- stirling-pdf-bin PKGBUILD ---"
+          cat .github/aur/stirling-pdf-bin/PKGBUILD
+          echo ""
+          echo "--- stirling-pdf-server-bin PKGBUILD ---"
+          cat .github/aur/stirling-pdf-server-bin/PKGBUILD
+
+      - name: Publish stirling-pdf-bin to AUR
+        if: ${{ github.event_name == 'release' || inputs.dry_run == false }}
+        uses: KSXGitHub/github-actions-deploy-aur@2ac5a4c1d7035885d46b10e3193393be8460b6f1 # v4.1.1
+        with:
+          pkgname: stirling-pdf-bin
+          pkgbuild: .github/aur/stirling-pdf-bin/PKGBUILD
+          commit_username: Stirling PDF Inc
+          commit_email: contact@stirlingpdf.com
+          ssh_private_key: ${{ secrets.AUR_SSH_PRIVATE_KEY }}
+          commit_message: "Update to v${{ needs.get-release-info.outputs.version }}"
+
+      - name: Publish stirling-pdf-server-bin to AUR
+        if: ${{ github.event_name == 'release' || inputs.dry_run == false }}
+        uses: KSXGitHub/github-actions-deploy-aur@v4.1.1
+        with:
+          pkgname: stirling-pdf-server-bin
+          pkgbuild: .github/aur/stirling-pdf-server-bin/PKGBUILD
+          commit_username: Stirling PDF Inc
+          commit_email: contact@stirlingpdf.com
+          ssh_private_key: ${{ secrets.AUR_SSH_PRIVATE_KEY }}
+          commit_message: "Update to v${{ needs.get-release-info.outputs.version }}"
diff --git a/.github/workflows/build.yml b/.github/workflows/build.yml
index d5c8285d45..78efa46cc6 100644
--- a/.github/workflows/build.yml
+++ b/.github/workflows/build.yml
@@ -50,6 +50,7 @@ jobs:
     permissions:
       actions: read
       security-events: write
+      pull-requests: write
     strategy:
       fail-fast: false
       matrix:
@@ -84,8 +85,77 @@ jobs:
           gradle-version: 9.3.1
           cache-disabled: true
 
+      - name: Install Task
+        uses: go-task/setup-task@3be4020d41929789a01026e0e427a4321ce0ad44 # v2.0.0
+      - name: Check Java formatting (Spotless)
+        if: matrix.jdk-version == 25 && matrix.spring-security == false
+        id: spotless-check
+        run: task backend:format:check
+        continue-on-error: true
+        env:
+          MAVEN_USER: ${{ secrets.MAVEN_USER }}
+          MAVEN_PASSWORD: ${{ secrets.MAVEN_PASSWORD }}
+          MAVEN_PUBLIC_URL: ${{ secrets.MAVEN_PUBLIC_URL }}
+
+      - name: Comment on Java formatting failure
+        if: steps.spotless-check.outcome == 'failure'
+        continue-on-error: true
+        uses: actions/github-script@ed597411d8f924073f98dfc5c65a23a2325f34cd # v8.0.0
+        with:
+          script: |
+            const marker = '<!-- java-formatting-check -->';
+            const body = [
+              marker,
+              '### Java Formatting Check Failed',
+              '',
+              'Your code has formatting issues. Run the following command to fix them:',
+              '',
+              '```bash',
+              'task backend:format',
+              '```',
+              '',
+              'Then commit and push the changes.',
+            ].join('\n');
+            const { data: comments } = await github.rest.issues.listComments({
+              owner: context.repo.owner,
+              repo: context.repo.repo,
+              issue_number: context.issue.number,
+            });
+            const existing = comments.find(c => c.body.includes(marker));
+            if (existing) {
+              await github.rest.issues.updateComment({
+                owner: context.repo.owner,
+                repo: context.repo.repo,
+                comment_id: existing.id,
+                body,
+              });
+            } else {
+              await github.rest.issues.createComment({
+                owner: context.repo.owner,
+                repo: context.repo.repo,
+                issue_number: context.issue.number,
+                body,
+              });
+            }
+
+      - name: Fail if Java formatting issues found
+        if: steps.spotless-check.outcome == 'failure'
+        run: |
+          echo "============================================"
+          echo "  Java Formatting Check Failed"
+          echo "============================================"
+          echo ""
+          echo "Your code has formatting issues."
+          echo "Run the following command to fix them:"
+          echo ""
+          echo "  task backend:format"
+          echo ""
+          echo "Then commit and push the changes."
+          echo "============================================"
+          exit 1
+
       - name: Build with Gradle and spring security ${{ matrix.spring-security }}
-        run: ./gradlew build -PnoSpotless
+        run: task backend:build:ci
         env:
           MAVEN_USER: ${{ secrets.MAVEN_USER }}
           MAVEN_PASSWORD: ${{ secrets.MAVEN_PASSWORD }}
@@ -169,8 +239,10 @@ jobs:
           gradle-version: 9.3.1
           cache-disabled: true
 
+      - name: Install Task
+        uses: go-task/setup-task@3be4020d41929789a01026e0e427a4321ce0ad44 # v2.0.0
       - name: Generate OpenAPI documentation
-        run: ./gradlew :stirling-pdf:generateOpenApiDocs
+        run: task backend:swagger
         env:
           MAVEN_USER: ${{ secrets.MAVEN_USER }}
           MAVEN_PASSWORD: ${{ secrets.MAVEN_PASSWORD }}
@@ -187,6 +259,9 @@ jobs:
     if: needs.files-changed.outputs.frontend == 'true'
     needs: files-changed
     runs-on: ubuntu-latest
+    permissions:
+      contents: read
+      pull-requests: write
     steps:
       - name: Harden Runner
         uses: step-security/harden-runner@58077d3c7e43986b6b15fba718e8ea69e387dfcc # v2.15.1
@@ -200,16 +275,63 @@ jobs:
           node-version: "22"
           cache: "npm"
           cache-dependency-path: frontend/package-lock.json
-      - name: Install frontend dependencies
-        run: cd frontend && npm ci
-      - name: Type-check frontend
-        run: cd frontend && npm run prep && npm run typecheck:all
-      - name: Lint frontend
-        run: cd frontend && npm run lint
-      - name: Build frontend
-        run: cd frontend && npm run build
-      - name: Run frontend tests
-        run: cd frontend && npm run test -- --run
+      - name: Install Task
+        uses: go-task/setup-task@3be4020d41929789a01026e0e427a4321ce0ad44 # v2.0.0
+      - name: Quality-check frontend
+        id: frontend-check
+        run: task frontend:check:all
+        continue-on-error: true
+      - name: Comment on frontend check failure
+        if: steps.frontend-check.outcome == 'failure'
+        continue-on-error: true
+        uses: actions/github-script@ed597411d8f924073f98dfc5c65a23a2325f34cd # v8.0.0
+        with:
+          script: |
+            const marker = '<!-- frontend-check -->';
+            const body = [
+              marker,
+              '### Frontend Check Failed',
+              '',
+              'There are issues with your frontend code that will need to be fixed before they can be merged in.',
+              '',
+              'Run `task frontend:fix` to auto-fix what can be fixed automatically, then run `task frontend:check:all` to see what still needs fixing manually.',
+            ].join('\n');
+            const { data: comments } = await github.rest.issues.listComments({
+              owner: context.repo.owner,
+              repo: context.repo.repo,
+              issue_number: context.issue.number,
+            });
+            const existing = comments.find(c => c.body.includes(marker));
+            if (existing) {
+              await github.rest.issues.updateComment({
+                owner: context.repo.owner,
+                repo: context.repo.repo,
+                comment_id: existing.id,
+                body,
+              });
+            } else {
+              await github.rest.issues.createComment({
+                owner: context.repo.owner,
+                repo: context.repo.repo,
+                issue_number: context.issue.number,
+                body,
+              });
+            }
+      - name: Fail if frontend check failed
+        if: steps.frontend-check.outcome == 'failure'
+        run: |
+          echo "============================================"
+          echo "  Frontend Check Failed"
+          echo "============================================"
+          echo ""
+          echo "There are issues with your frontend code that"
+          echo "will need to be fixed before they can be merged in."
+          echo ""
+          echo "Run 'task frontend:fix' to auto-fix what can be"
+          echo "fixed automatically, then run 'task frontend:check:all'"
+          echo "to see what still needs fixing manually."
+          echo "============================================"
+          exit 1
       - name: Upload frontend build artifacts
         uses: actions/upload-artifact@bbbca2ddaa5d8feaa63e36b76fdaad77386f024f # v7.0.0
         with:
@@ -234,14 +356,12 @@ jobs:
           node-version: "22"
           cache: "npm"
           cache-dependency-path: frontend/package-lock.json
-      - name: Install frontend dependencies
-        run: cd frontend && npm ci
-      - name: Generate icons
-        run: cd frontend && node scripts/generate-icons.js
+      - name: Install Task
+        uses: go-task/setup-task@3be4020d41929789a01026e0e427a4321ce0ad44 # v2.0.0
       - name: Install Playwright (chromium only)
-        run: cd frontend && npx playwright install chromium --with-deps
+        run: task frontend:test:e2e:install -- chromium
       - name: Run E2E tests (chromium)
-        run: cd frontend && npx playwright test --project=chromium
+        run: task frontend:test:e2e -- --project=chromium
       - name: Upload Playwright report
         if: always()
         uses: actions/upload-artifact@bbbca2ddaa5d8feaa63e36b76fdaad77386f024f # v7.0.0
@@ -284,13 +404,10 @@ jobs:
           gradle-version: 9.3.1
           cache-disabled: true
 
-      - name: check the licenses for compatibility
-        # NOTE: --no-parallel is intentional here. Running the checkLicense task in parallel with other
-        # Gradle tasks has been observed to cause intermittent failures with the dependency license
-        # checking plugin on this Gradle version. Disabling parallel execution trades some build speed
-        # for more reliable, deterministic license checks. If upgrading Gradle or the plugin, consider
-        # re-evaluating whether this flag is still required before removing it.
-        run: ./gradlew checkLicense --no-parallel
+      - name: Install Task
+        uses: go-task/setup-task@3be4020d41929789a01026e0e427a4321ce0ad44 # v2.0.0
+      - name: Check licenses for compatibility
+        run: task backend:licenses:check
         env:
           MAVEN_USER: ${{ secrets.MAVEN_USER }}
           MAVEN_PASSWORD: ${{ secrets.MAVEN_PASSWORD }}
@@ -485,8 +602,10 @@ jobs:
           gradle-version: 9.3.1
           cache-disabled: true
 
+      - name: Install Task
+        uses: go-task/setup-task@3be4020d41929789a01026e0e427a4321ce0ad44 # v2.0.0
       - name: Build application
-        run: ./gradlew build
+        run: task backend:build
         env:
           MAVEN_USER: ${{ secrets.MAVEN_USER }}
           MAVEN_PASSWORD: ${{ secrets.MAVEN_PASSWORD }}
@@ -513,7 +632,7 @@ jobs:
             echo "base_image=stirling-pdf-base:pr-test" >> $GITHUB_OUTPUT
             echo "platforms=linux/amd64" >> $GITHUB_OUTPUT
           else
-            echo "base_image=ghcr.io/${{ steps.repoowner.outputs.lowercase }}/stirling-pdf-base:latest" >> $GITHUB_OUTPUT
+            echo "base_image=stirlingtools/stirling-pdf-base:latest" >> $GITHUB_OUTPUT
             echo "platforms=linux/amd64,linux/arm64/v8" >> $GITHUB_OUTPUT
           fi
 
diff --git a/.github/workflows/frontend-backend-licenses-update.yml b/.github/workflows/frontend-backend-licenses-update.yml
index a7e10dd4fe..be7c0f1148 100644
--- a/.github/workflows/frontend-backend-licenses-update.yml
+++ b/.github/workflows/frontend-backend-licenses-update.yml
@@ -89,12 +89,13 @@ jobs:
           NPM_CONFIG_IGNORE_SCRIPTS: "true"
         run: npm ci --ignore-scripts --audit=false --fund=false
 
+      - name: Install Task
+        uses: go-task/setup-task@3be4020d41929789a01026e0e427a4321ce0ad44 # v2.0.0
       - name: Generate frontend license report (internal PR)
         if: github.event_name == 'pull_request' && github.event.pull_request.head.repo.fork == false
-        working-directory: frontend
         env:
           PR_IS_FORK: "false"
-        run: npm run generate-licenses
+        run: task frontend:licenses:generate
 
       - name: Generate frontend license report (fork PRs, pinned)
         if: github.event_name == 'pull_request' && github.event.pull_request.head.repo.fork == true
@@ -341,15 +342,11 @@ jobs:
         with:
           gradle-version: 9.3.1
 
+      - name: Install Task
+        uses: go-task/setup-task@3be4020d41929789a01026e0e427a4321ce0ad44 # v2.0.0
       - name: Check licenses and generate report
         id: license-check
-        run: |
-          # NOTE: --no-parallel is intentional here. Running the license-checking tasks in parallel has
-          # previously caused intermittent concurrency issues in CI (e.g. flaky failures in the license
-          # plugin/Gradle when multiple projects are evaluated concurrently). Disabling parallelism trades
-          # some build speed for more reliable license reports. If the underlying issues are resolved in
-          # future Gradle or plugin versions, this flag can be reconsidered.
-          ./gradlew checkLicense generateLicenseReport --no-parallel || echo "LICENSE_CHECK_FAILED=true" >> $GITHUB_ENV
+        run: task backend:licenses:generate || echo "LICENSE_CHECK_FAILED=true" >> $GITHUB_ENV
         env:
           MAVEN_USER: ${{ secrets.MAVEN_USER }}
           MAVEN_PASSWORD: ${{ secrets.MAVEN_PASSWORD }}
diff --git a/.github/workflows/multiOSReleases.yml b/.github/workflows/multiOSReleases.yml
index b1ee6c8c88..024cccd441 100644
--- a/.github/workflows/multiOSReleases.yml
+++ b/.github/workflows/multiOSReleases.yml
@@ -21,6 +21,14 @@ on:
           - windows
           - macos
           - linux
+      sign:
+        description: "Code sign the binaries (requires signing secrets)"
+        required: false
+        default: "true"
+        type: choice
+        options:
+          - "true"
+          - "false"
   release:
     types: [created]
 
@@ -63,11 +71,11 @@ jobs:
         with:
           gradle-version: 9.3.1
 
+      - name: Install Task
+        uses: go-task/setup-task@3be4020d41929789a01026e0e427a4321ce0ad44 # v2.0.0
       - name: Get version number
         id: versionNumber
         run: |
-          echo "Running gradlew printVersion..."
-          ./gradlew printVersion --quiet
           VERSION=$(./gradlew printVersion --quiet | tail -1)
           echo "Extracted version: $VERSION"
           echo "versionNumber=$VERSION" >> $GITHUB_OUTPUT
@@ -144,6 +152,9 @@ jobs:
           cache: "npm"
           cache-dependency-path: frontend/package-lock.json
 
+      - name: Install Task
+        uses: go-task/setup-task@3be4020d41929789a01026e0e427a4321ce0ad44 # v2.0.0
+
       - name: Build JAR
         run: ./gradlew build ${{ matrix.variant.build_frontend && '-PbuildWithFrontend=true' || '' }} -x spotlessApply -x spotlessCheck -x test -x sonarqube
         env:
@@ -219,89 +230,21 @@ jobs:
         with:
           gradle-version: 9.3.1
 
-      - name: Build Java backend with JLink
-        working-directory: ./
-        shell: bash
-        run: |
-          chmod +x ./gradlew
-          echo "🔧 Building Stirling-PDF JAR..."
-          ./gradlew build -x spotlessApply -x spotlessCheck -x test -x sonarqube
+      - name: Install Task
+        uses: go-task/setup-task@3be4020d41929789a01026e0e427a4321ce0ad44 # v2.0.0
 
-          # Find the built JAR
-          STIRLING_JAR=$(ls app/core/build/libs/stirling-pdf-*.jar | head -n 1)
-          echo "✅ Built JAR: $STIRLING_JAR"
-
-          # Create Tauri directories
-          mkdir -p ./frontend/src-tauri/libs
-          mkdir -p ./frontend/src-tauri/runtime
-
-          # Copy JAR to Tauri libs
-          cp "$STIRLING_JAR" ./frontend/src-tauri/libs/
-          echo "✅ JAR copied to Tauri libs"
-
-          # Analyze JAR dependencies for jlink modules
-          echo "� Analyzing JAR dependencies..."
-          if command -v jdeps &> /dev/null; then
-            DETECTED_MODULES=$(jdeps --print-module-deps --ignore-missing-deps "$STIRLING_JAR" 2>/dev/null || echo "")
-            if [ -n "$DETECTED_MODULES" ]; then
-              echo "📋 jdeps detected modules: $DETECTED_MODULES"
-              MODULES="$DETECTED_MODULES,java.compiler,java.instrument,java.management,java.naming,java.net.http,java.prefs,java.rmi,java.scripting,java.security.jgss,java.security.sasl,java.sql,java.transaction.xa,java.xml.crypto,jdk.crypto.ec,jdk.crypto.cryptoki,jdk.unsupported"
-            else
-              echo "⚠� jdeps analysis failed, using predefined modules"
-              MODULES="java.base,java.compiler,java.desktop,java.instrument,java.logging,java.management,java.naming,java.net.http,java.prefs,java.rmi,java.scripting,java.security.jgss,java.security.sasl,java.sql,java.transaction.xa,java.xml,java.xml.crypto,jdk.crypto.ec,jdk.crypto.cryptoki,jdk.unsupported"
-            fi
-          else
-            echo "⚠� jdeps not available, using predefined modules"
-            MODULES="java.base,java.compiler,java.desktop,java.instrument,java.logging,java.management,java.naming,java.net.http,java.prefs,java.rmi,java.scripting,java.security.jgss,java.security.sasl,java.sql,java.transaction.xa,java.xml,java.xml.crypto,jdk.crypto.ec,jdk.crypto.cryptoki,jdk.unsupported"
-          fi
-
-          # Create custom JRE with jlink
-          echo "🔧 Creating custom JRE with jlink..."
-          echo "📋 Using modules: $MODULES"
-
-          # Remove any existing JRE
-          rm -rf ./frontend/src-tauri/runtime/jre
-
-          # Create the custom JRE
-          jlink \
-            --add-modules "$MODULES" \
-            --strip-debug \
-            --compress=2 \
-            --no-header-files \
-            --no-man-pages \
-            --output ./frontend/src-tauri/runtime/jre
-
-          if [ ! -d "./frontend/src-tauri/runtime/jre" ]; then
-            echo "� Failed to create JLink runtime"
-            exit 1
-          fi
-
-          # Test the bundled runtime
-          if [ -f "./frontend/src-tauri/runtime/jre/bin/java" ]; then
-            RUNTIME_VERSION=$(./frontend/src-tauri/runtime/jre/bin/java --version 2>&1 | head -n 1)
-            echo "✅ Custom JRE created successfully: $RUNTIME_VERSION"
-          else
-            echo "� Custom JRE executable not found"
-            exit 1
-          fi
-
-          # Calculate runtime size
-          RUNTIME_SIZE=$(du -sh ./frontend/src-tauri/runtime/jre | cut -f1)
-          echo "📊 Custom JRE size: $RUNTIME_SIZE"
+      - name: Prepare desktop build
+        run: task desktop:prepare
         env:
           MAVEN_USER: ${{ secrets.MAVEN_USER }}
           MAVEN_PASSWORD: ${{ secrets.MAVEN_PASSWORD }}
           MAVEN_PUBLIC_URL: ${{ secrets.MAVEN_PUBLIC_URL }}
           DISABLE_ADDITIONAL_FEATURES: true
 
-      - name: Install frontend dependencies
-        working-directory: ./frontend
-        run: npm ci
-
       # DigiCert KeyLocker Setup (Cloud HSM)
       - name: Setup DigiCert KeyLocker
         id: digicert-setup
-        if: ${{ matrix.platform == 'windows-latest' && env.SM_API_KEY != '' && (github.event_name == 'release' || github.ref == 'refs/heads/V2-master') }}
+        if: ${{ matrix.platform == 'windows-latest' && env.SM_API_KEY != '' && (github.event_name == 'release' || (github.event_name == 'workflow_dispatch' && github.event.inputs.sign != 'false') || github.ref == 'refs/heads/V2-master') }}
         uses: digicert/ssm-code-signing@1d820463733701cf1484c7eb5d7d24a15ca2c454 # v1.2.1
         env:
           SM_API_KEY: ${{ secrets.SM_API_KEY }}
@@ -311,7 +254,7 @@ jobs:
           SM_HOST: ${{ secrets.SM_HOST }}
 
       - name: Setup DigiCert KeyLocker Certificate
-        if: ${{ matrix.platform == 'windows-latest' && env.SM_API_KEY != '' && (github.event_name == 'release' || github.ref == 'refs/heads/V2-master') }}
+        if: ${{ matrix.platform == 'windows-latest' && env.SM_API_KEY != '' && (github.event_name == 'release' || (github.event_name == 'workflow_dispatch' && github.event.inputs.sign != 'false') || github.ref == 'refs/heads/V2-master') }}
         shell: pwsh
         run: |
           Write-Host "Setting up DigiCert KeyLocker environment..."
@@ -346,7 +289,7 @@ jobs:
 
       # Traditional PFX Certificate Import (fallback if KeyLocker not configured)
       - name: Import Windows Code Signing Certificate
-        if: ${{ matrix.platform == 'windows-latest' && env.SM_API_KEY == '' && (github.event_name == 'release' || github.ref == 'refs/heads/V2-master') }}
+        if: ${{ matrix.platform == 'windows-latest' && env.SM_API_KEY == '' && (github.event_name == 'release' || (github.event_name == 'workflow_dispatch' && github.event.inputs.sign != 'false') || github.ref == 'refs/heads/V2-master') }}
         env:
           WINDOWS_CERTIFICATE: ${{ secrets.WINDOWS_CERTIFICATE }}
           WINDOWS_CERTIFICATE_PASSWORD: ${{ secrets.WINDOWS_CERTIFICATE_PASSWORD }}
@@ -377,7 +320,7 @@ jobs:
           }
 
       - name: Import Apple Developer Certificate
-        if: (matrix.platform == 'macos-15' || matrix.platform == 'macos-15-intel') && (github.event_name == 'release' || github.ref == 'refs/heads/V2-master')
+        if: (matrix.platform == 'macos-15' || matrix.platform == 'macos-15-intel') && (github.event_name == 'release' || (github.event_name == 'workflow_dispatch' && github.event.inputs.sign != 'false') || github.ref == 'refs/heads/V2-master')
         env:
           APPLE_CERTIFICATE: ${{ secrets.APPLE_CERTIFICATE }}
           APPLE_CERTIFICATE_PASSWORD: ${{ secrets.APPLE_CERTIFICATE_PASSWORD }}
@@ -398,7 +341,7 @@ jobs:
           rm certificate.p12
 
       - name: Verify Certificate
-        if: (matrix.platform == 'macos-15' || matrix.platform == 'macos-15-intel') && (github.event_name == 'release' || github.ref == 'refs/heads/V2-master')
+        if: (matrix.platform == 'macos-15' || matrix.platform == 'macos-15-intel') && (github.event_name == 'release' || (github.event_name == 'workflow_dispatch' && github.event.inputs.sign != 'false') || github.ref == 'refs/heads/V2-master')
         run: |
           echo "Verifying Apple Developer Certificate..."
           KEYCHAIN_PATH=$RUNNER_TEMP/app-signing.keychain-db
@@ -409,6 +352,82 @@ jobs:
           echo "APPLE_SIGNING_IDENTITY=$CERT_ID" >> $GITHUB_ENV
           echo "Certificate imported successfully."
 
+      # Pre-flight: verify smctl can talk to DigiCert and sync cert before we sign.
+      # Mirrors the setup from working public Tauri+KeyLocker repos (Labric, Meetily).
+      # Without this, signCommand failures are opaque (Tauri captures but drops
+      # smctl's stderr) - running these loudly surfaces auth/env/keypair issues.
+      - name: Preflight smctl
+        if: ${{ matrix.platform == 'windows-latest' && env.SM_API_KEY != '' && (github.event_name == 'release' || (github.event_name == 'workflow_dispatch' && github.event.inputs.sign != 'false') || github.ref == 'refs/heads/V2-master') }}
+        shell: pwsh
+        env:
+          KEYPAIR_ALIAS: ${{ secrets.SM_KEYPAIR_ALIAS }}
+        run: |
+          & smctl healthcheck
+          if ($LASTEXITCODE -ne 0) { Write-Host "[ERROR] smctl healthcheck failed"; exit 1 }
+          & smctl keypair ls
+          if ($LASTEXITCODE -ne 0) { Write-Host "[ERROR] smctl keypair ls failed"; exit 1 }
+          & smctl windows certsync --keypair-alias "$env:KEYPAIR_ALIAS"
+          if ($LASTEXITCODE -ne 0) { Write-Host "[WARN] smctl windows certsync returned non-zero - continuing" }
+          Write-Host "[SUCCESS] smctl preflight passed"
+
+      # Write platform-specific Tauri config that adds signCommand for Windows.
+      # Tauri auto-merges tauri.windows.conf.json with tauri.conf.json (RFC 7396).
+      # Tauri calls this command on every binary BEFORE bundling into the MSI,
+      # substituting %1 with the file path.
+      #
+      # Why OBJECT form (cmd + args) instead of string:
+      # Tauri's string-form parser does a naive split(' ') with no shell/quote handling.
+      # Args with spaces or quote characters get mangled. The object form passes each
+      # arg directly to Rust's Command::arg which handles Windows CreateProcess quoting.
+      #
+      # Why --keypair-alias instead of --fingerprint:
+      # --fingerprint requires smctl windows certsync to have synced the cert to the
+      # Windows cert store first. --keypair-alias goes direct through PKCS11 and works
+      # without certsync. All real-world working Tauri+smctl examples use this flag.
+      #
+      # smctl reads SM_HOST, SM_API_KEY, SM_CLIENT_CERT_FILE, SM_CLIENT_CERT_PASSWORD
+      # from env (set by prior DigiCert setup step). No --config-file needed.
+      - name: Configure Windows code signing
+        if: ${{ matrix.platform == 'windows-latest' && env.SM_API_KEY != '' && (github.event_name == 'release' || (github.event_name == 'workflow_dispatch' && github.event.inputs.sign != 'false') || github.ref == 'refs/heads/V2-master') }}
+        shell: bash
+        env:
+          KEYPAIR_ALIAS: ${{ secrets.SM_KEYPAIR_ALIAS }}
+        run: |
+          cat > ./frontend/src-tauri/tauri.windows.conf.json <<EOF
+          {
+            "bundle": {
+              "windows": {
+                "signCommand": {
+                  "cmd": "smctl",
+                  "args": ["sign", "--keypair-alias", "${KEYPAIR_ALIAS}", "--input", "%1", "--verbose"]
+                }
+              }
+            }
+          }
+          EOF
+          echo "Generated tauri.windows.conf.json (alias masked):"
+          sed "s/${KEYPAIR_ALIAS}/***/g" ./frontend/src-tauri/tauri.windows.conf.json
+
+      - name: Import release GPG signing key (Linux)
+        if: matrix.platform == 'ubuntu-22.04'
+        env:
+          RELEASE_GPG_PRIVATE_KEY: ${{ secrets.RELEASE_GPG_PRIVATE_KEY }}
+        run: |
+          echo "$RELEASE_GPG_PRIVATE_KEY" | gpg --batch --import
+          gpg --list-secret-keys --keyid-format=long
+
+      - name: Make libjvm discoverable for linuxdeploy (Linux AppImage)
+        if: matrix.platform == 'ubuntu-22.04'
+        run: |
+          JAVA_LIBJVM="$JAVA_HOME/lib/server/libjvm.so"
+          if [ -f "$JAVA_LIBJVM" ]; then
+            sudo ln -sf "$JAVA_LIBJVM" /usr/lib/libjvm.so
+            echo "Linked libjvm from $JAVA_LIBJVM -> /usr/lib/libjvm.so"
+          else
+            echo "libjvm not found at $JAVA_LIBJVM"
+            exit 1
+          fi
+
       - name: Build Tauri app
         uses: tauri-apps/tauri-action@51a9f1156b33df106d827c3a78f8f894946c5faa # v0.5.25
         env:
@@ -419,114 +438,115 @@ jobs:
           APPLE_ID: ${{ secrets.APPLE_ID }}
           APPLE_PASSWORD: ${{ secrets.APPLE_ID_PASSWORD }}
           APPLE_TEAM_ID: ${{ secrets.APPLE_TEAM_ID }}
-          APPIMAGETOOL_SIGN_PASSPHRASE: ${{ secrets.APPIMAGETOOL_SIGN_PASSPHRASE }}
+          # AppImage signing — three env vars work together:
+          #   SIGN=1                        tells linuxdeploy-plugin-appimage to forward --sign to appimagetool
+          #   APPIMAGETOOL_SIGN_PASSPHRASE  appimagetool uses this to unlock the GPG key non-interactively
+          #   SIGN_KEY                      appimagetool picks the key matching this fingerprint
+          # Without SIGN=1, the other two are ignored and the AppImage is built unsigned even if a key is present.
+          SIGN: "1"
+          APPIMAGETOOL_SIGN_PASSPHRASE: ${{ secrets.RELEASE_GPG_PASSPHRASE }}
+          SIGN_KEY: ${{ vars.RELEASE_GPG_FINGERPRINT }}
           TAURI_SIGNING_PRIVATE_KEY: ${{ secrets.TAURI_SIGNING_PRIVATE_KEY }}
           TAURI_SIGNING_PRIVATE_KEY_PASSWORD: ${{ secrets.TAURI_SIGNING_PRIVATE_KEY_PASSWORD }}
           VITE_SUPABASE_PUBLISHABLE_DEFAULT_KEY: ${{ secrets.VITE_SUPABASE_PUBLISHABLE_DEFAULT_KEY || 'sb_publishable_UHz2SVRF5mvdrPHWkRteyA_yNlZTkYb' }}
           VITE_SAAS_SERVER_URL: ${{ secrets.VITE_SAAS_SERVER_URL || 'https://app.stirlingpdf.com' }}
           VITE_SAAS_BACKEND_API_URL: ${{ secrets.VITE_SAAS_BACKEND_API_URL || 'https://api.stirlingpdf.com' }}
-          # Only enable Windows signing in Tauri when on release or V2-master
-          SIGN: ${{ (github.event_name == 'release' || github.ref == 'refs/heads/V2-master') && (env.SM_API_KEY == '' && env.WINDOWS_CERTIFICATE != '') && '1' || '0' }}
+          # DigiCert KeyLocker env vars consumed by smctl during signCommand
+          SM_CODE_SIGNING_CERT_SHA1_HASH: ${{ secrets.SM_CODE_SIGNING_CERT_SHA1_HASH }}
           CI: true
         with:
           projectPath: ./frontend
           tauriScript: npx tauri
           args: ${{ matrix.args }}
 
-      # Sign with DigiCert KeyLocker (post-build)
-      - name: Sign Windows binaries with DigiCert KeyLocker
-        if: ${{ matrix.platform == 'windows-latest' && env.SM_API_KEY != '' && (github.event_name == 'release' || github.ref == 'refs/heads/V2-master') }}
+      - name: Clear release GPG key from runner keyring (Linux)
+        if: always() && matrix.platform == 'ubuntu-22.04'
+        env:
+          RELEASE_GPG_FINGERPRINT: ${{ vars.RELEASE_GPG_FINGERPRINT }}
+        run: |
+          if [ -n "$RELEASE_GPG_FINGERPRINT" ]; then
+            gpg --batch --yes --delete-secret-keys "$RELEASE_GPG_FINGERPRINT" || true
+            gpg --batch --yes --delete-keys "$RELEASE_GPG_FINGERPRINT" || true
+          fi
+
+      # Verify the MSI (outer wrapper users download) AND the inner exe extracted
+      # from it (what actually gets installed and what AV scans). We don't check
+      # target/.../release/stirling-pdf.exe - that's Tauri's intermediate build
+      # artifact. Tauri signs a COPY when bundling into the MSI and leaves the raw
+      # cargo output unsigned, so checking it produces false negatives.
+      - name: Verify Windows Code Signature
+        if: ${{ matrix.platform == 'windows-latest' && env.SM_API_KEY != '' && (github.event_name == 'release' || (github.event_name == 'workflow_dispatch' && github.event.inputs.sign != 'false') || github.ref == 'refs/heads/V2-master') }}
         shell: pwsh
         run: |
-          Write-Host "=== DigiCert KeyLocker Signing ==="
+          $allSigned = $true
 
-          # Test smctl connectivity first
-          Write-Host "Testing smctl connection..."
-          $healthCheck = & smctl healthcheck 2>&1
-          if ($LASTEXITCODE -eq 0) {
-            Write-Host "[SUCCESS] Connected to DigiCert KeyLocker"
-          } else {
-            Write-Host "[ERROR] Failed to connect to DigiCert KeyLocker"
-            Write-Host $healthCheck
-            exit 1
-          }
-          Write-Host ""
-
-          # Sync certificates to Windows certificate store
-          Write-Host "Syncing certificates to Windows certificate store..."
-          $syncOutput = & smctl windows certsync 2>&1
-          Write-Host "Cert sync result: $syncOutput"
-          Write-Host ""
-
-          # Find only the files we need to sign
-          $filesToSign = @()
-
-          # Main application executable
-          $mainExe = Get-ChildItem -Path "./frontend/src-tauri/target/x86_64-pc-windows-msvc/release" -Filter "stirling-pdf.exe" -File -ErrorAction SilentlyContinue
-          if ($mainExe) { $filesToSign += $mainExe }
-
-          # MSI installer
+          # Check MSI installer (outer wrapper - what users download)
           $msiFiles = Get-ChildItem -Path "./frontend/src-tauri/target" -Filter "*.msi" -Recurse -File
-          $filesToSign += $msiFiles
-
-          if ($filesToSign.Count -eq 0) {
-            Write-Host "[ERROR] No files found to sign"
+          if ($msiFiles.Count -eq 0) {
+            Write-Host "[ERROR] No MSI found under target/"
             exit 1
           }
-
-          Write-Host "Found $($filesToSign.Count) files to sign:"
-          foreach ($f in $filesToSign) { Write-Host "  - $($f.Name)" }
-          Write-Host ""
-
-          $signedCount = 0
-          foreach ($file in $filesToSign) {
-            Write-Host "Signing: $($file.Name)"
-
-            # Get PKCS11 config file path
-            $pkcs11Config = $env:PKCS11_CONFIG
-            if (-not $pkcs11Config) {
-              Write-Host "[ERROR] PKCS11_CONFIG environment variable not set"
-              exit 1
+          foreach ($msi in $msiFiles) {
+            $sig = Get-AuthenticodeSignature -FilePath $msi.FullName
+            Write-Host "MSI: Status=$($sig.Status), Signer=$($sig.SignerCertificate.Subject)"
+            if ($sig.Status -ne "Valid") {
+              Write-Host "[ERROR] MSI is not signed"
+              $allSigned = $false
             }
-
-            Write-Host "Using PKCS11 config: $pkcs11Config"
-
-            # Try signing with certificate fingerprint first (if available)
-            $fingerprint = "${{ secrets.SM_CODE_SIGNING_CERT_SHA1_HASH }}"
-            if ($fingerprint -and $fingerprint -ne "") {
-              Write-Host "Attempting to sign with certificate fingerprint..."
-              $output = & smctl sign --fingerprint "$fingerprint" --input "$($file.FullName)" --config-file "$pkcs11Config" --verbose 2>&1
-              $exitCode = $LASTEXITCODE
-            } else {
-              Write-Host "No fingerprint provided, using keypair alias..."
-              $output = & smctl sign --keypair-alias "${{ secrets.SM_KEYPAIR_ALIAS }}" --input "$($file.FullName)" --config-file "$pkcs11Config" --verbose 2>&1
-              $exitCode = $LASTEXITCODE
-            }
-
-            Write-Host "Exit code: $exitCode"
-            Write-Host "Output: $output"
-
-            if ($output -match "FAILED" -or $output -match "error" -or $output -match "Error") {
-              Write-Host "[ERROR] Signing failed for $($file.Name)"
-              exit 1
-            }
-
-            if ($exitCode -ne 0) {
-              Write-Host "[ERROR] Failed to sign $($file.Name)"
-              Write-Host "Full error output:"
-              Write-Host $output
-              exit 1
-            }
-
-            $signedCount++
-            Write-Host "[SUCCESS] Signed: $($file.Name)"
-            Write-Host ""
           }
 
-          Write-Host "=== Summary ==="
-          Write-Host "[SUCCESS] Signed $signedCount/$($filesToSign.Count) files successfully"
+          # Extract MSI and verify the inner exe (the file that actually gets installed).
+          # This is the critical check - AV flags the installed exe at runtime.
+          $msi = $msiFiles[0].FullName
+          $extractDir = Join-Path $env:RUNNER_TEMP "msi-verify"
+          if (Test-Path $extractDir) { Remove-Item $extractDir -Recurse -Force }
+          $proc = Start-Process msiexec.exe -ArgumentList '/a', $msi, '/qn', "TARGETDIR=$extractDir" -Wait -PassThru -NoNewWindow
+          if ($proc.ExitCode -eq 0) {
+            $innerExe = Get-ChildItem -Path $extractDir -Filter "stirling-pdf.exe" -Recurse -File | Select-Object -First 1
+            if ($innerExe) {
+              $sig = Get-AuthenticodeSignature -FilePath $innerExe.FullName
+              Write-Host "Inner EXE (from MSI): Status=$($sig.Status), Signer=$($sig.SignerCertificate.Subject)"
+              if ($sig.Status -ne "Valid") {
+                Write-Host "[ERROR] Inner exe extracted from MSI is NOT signed - AV will flag this at runtime"
+                $allSigned = $false
+              }
+            } else {
+              Write-Host "[ERROR] Could not find stirling-pdf.exe inside MSI"
+              $allSigned = $false
+            }
+          } else {
+            Write-Host "[ERROR] Failed to extract MSI for verification (exit code: $($proc.ExitCode))"
+            $allSigned = $false
+          }
 
+          if (-not $allSigned) {
+            Write-Host "[ERROR] Signature verification failed"
+            exit 1
+          }
+          Write-Host "[SUCCESS] MSI and installed exe are properly signed"
+
+      # Dump smctl log files on failure. Tauri's signCommand captures smctl output
+      # but drops stderr when the command exits non-zero, making failures opaque.
+      # The real errors live in smctl's log files - surface them here for debugging.
+      - name: Dump smctl logs on failure
+        if: ${{ failure() && matrix.platform == 'windows-latest' && env.SM_API_KEY != '' }}
+        shell: pwsh
+        run: |
+          $logDir = "$env:USERPROFILE\.signingmanager\logs"
+          if (Test-Path $logDir) {
+            Get-ChildItem $logDir | ForEach-Object {
+              Write-Host "=== $($_.FullName) ==="
+              Get-Content $_.FullName -Tail 200
+              Write-Host ""
+            }
+          } else {
+            Write-Host "smctl log directory not found at $logDir"
+          }
+
+      # Rename + Upload: use always() so artifacts are still collected when verify
+      # fails - we need them to manually inspect what actually came out of the build.
       - name: Rename artifacts
+        if: always() && steps.digicert-setup.conclusion != 'failure'
         shell: bash
         run: |
           mkdir -p ./dist
@@ -534,17 +554,20 @@ jobs:
 
           # Find and rename artifacts based on platform
           if [ "${{ matrix.platform }}" = "windows-latest" ]; then
-            find . -name "*.exe" -exec cp {} "../../../dist/Stirling-PDF-${{ matrix.name }}.exe" \;
+            # Only ship the MSI installer on Windows. The loose exe and WiX toolset exes
+            # are not the user-facing installer - the MSI contains the signed inner exe.
             find . -name "*.msi" -exec cp {} "../../../dist/Stirling-PDF-${{ matrix.name }}.msi" \;
           elif [ "${{ matrix.platform }}" = "macos-15" ] || [ "${{ matrix.platform }}" = "macos-15-intel" ]; then
             find . -name "*.dmg" -exec cp {} "../../../dist/Stirling-PDF-${{ matrix.name }}.dmg" \;
             find . -name "*.app" -exec cp -r {} "../../../dist/Stirling-PDF-${{ matrix.name }}.app" \;
           else
             find . -name "*.deb" -exec cp {} "../../../dist/Stirling-PDF-${{ matrix.name }}.deb" \;
+            find . -name "*.rpm" -exec cp {} "../../../dist/Stirling-PDF-${{ matrix.name }}.rpm" \;
             find . -name "*.AppImage" -exec cp {} "../../../dist/Stirling-PDF-${{ matrix.name }}.AppImage" \;
           fi
 
       - name: Upload build artifacts
+        if: always() && steps.digicert-setup.conclusion != 'failure'
         uses: actions/upload-artifact@bbbca2ddaa5d8feaa63e36b76fdaad77386f024f # v7.0.0
         with:
           name: Stirling-PDF-${{ matrix.name }}
@@ -600,6 +623,7 @@ jobs:
             ./artifacts/**/*.msi
             ./artifacts/**/*.dmg
             ./artifacts/**/*.deb
+            ./artifacts/**/*.rpm
             ./artifacts/**/*.AppImage
           draft: false
           prerelease: false
diff --git a/.github/workflows/nightly.yml b/.github/workflows/nightly.yml
index b3a13e233d..ce7b000475 100644
--- a/.github/workflows/nightly.yml
+++ b/.github/workflows/nightly.yml
@@ -32,17 +32,13 @@ jobs:
           cache: "npm"
           cache-dependency-path: frontend/package-lock.json
 
-      - name: Install frontend dependencies
-        run: cd frontend && npm ci
-
-      - name: Generate icons
-        run: cd frontend && node scripts/generate-icons.js
-
+      - name: Install Task
+        uses: go-task/setup-task@3be4020d41929789a01026e0e427a4321ce0ad44 # v2.0.0
       - name: Install all Playwright browsers
-        run: cd frontend && npx playwright install --with-deps
+        run: task frontend:test:e2e:install
 
       - name: Run E2E tests (all browsers)
-        run: cd frontend && npx playwright test
+        run: task frontend:test:e2e
 
       - name: Upload Playwright report
         if: always()
diff --git a/.github/workflows/package-managers.yml b/.github/workflows/package-managers.yml
new file mode 100644
index 0000000000..a1c3de0227
--- /dev/null
+++ b/.github/workflows/package-managers.yml
@@ -0,0 +1,197 @@
+name: Update Package Manager Manifests
+
+on:
+  # release:
+  #   types: [released]
+  workflow_dispatch:
+    inputs:
+      version:
+        description: "Version to test (e.g. 2.9.2 — no v prefix)"
+        required: true
+        type: string
+      dry_run:
+        description: "Skip the git push at the end (safe test)"
+        type: boolean
+        default: true
+
+permissions:
+  contents: read
+
+jobs:
+  get-release-info:
+    runs-on: ubuntu-latest
+    outputs:
+      version: ${{ steps.info.outputs.version }}
+      dmg_arm64_sha256: ${{ steps.hashes.outputs.dmg_arm64_sha256 }}
+      dmg_x86_64_sha256: ${{ steps.hashes.outputs.dmg_x86_64_sha256 }}
+      msi_sha256: ${{ steps.hashes.outputs.msi_sha256 }}
+      deb_sha256: ${{ steps.hashes.outputs.deb_sha256 }}
+      jar_sha256: ${{ steps.hashes.outputs.jar_sha256 }}
+    steps:
+      - name: Harden Runner
+        uses: step-security/harden-runner@v2
+        with:
+          egress-policy: audit
+
+      - name: Extract version from tag or manual input
+        id: info
+        env:
+          DISPATCH_VERSION: ${{ inputs.version }}
+          RELEASE_TAG: ${{ github.event.release.tag_name }}
+        run: |
+          if [ "${{ github.event_name }}" = "workflow_dispatch" ]; then
+            VERSION="$DISPATCH_VERSION"
+          else
+            VERSION="$RELEASE_TAG"
+          fi
+          VERSION="${VERSION#v}"
+          echo "version=$VERSION" >> "$GITHUB_OUTPUT"
+
+      - name: Download release assets and compute SHA256
+        id: hashes
+        env:
+          VERSION: ${{ steps.info.outputs.version }}
+          GH_TOKEN: ${{ github.token }}
+        run: |
+          BASE="https://github.com/Stirling-Tools/Stirling-PDF/releases/download/v${VERSION}"
+
+          download_sha256() {
+            local url="$1"
+            local file
+            file=$(basename "$url")
+            curl -fsSL --retry 3 -o "$file" "$url"
+            sha256sum "$file" | awk '{print $1}'
+          }
+
+          DMG_ARM64_SHA=$(download_sha256 "${BASE}/Stirling-PDF-macos-aarch64.dmg")
+          DMG_X64_SHA=$(download_sha256 "${BASE}/Stirling-PDF-macos-x86_64.dmg")
+          MSI_SHA=$(download_sha256 "${BASE}/Stirling-PDF-windows-x86_64.msi")
+          DEB_SHA=$(download_sha256 "${BASE}/Stirling-PDF-linux-x86_64.deb")
+          JAR_SHA=$(download_sha256 "${BASE}/Stirling-PDF-with-login.jar")
+
+          echo "dmg_arm64_sha256=$DMG_ARM64_SHA" >> "$GITHUB_OUTPUT"
+          echo "dmg_x86_64_sha256=$DMG_X64_SHA"  >> "$GITHUB_OUTPUT"
+          echo "msi_sha256=$MSI_SHA"              >> "$GITHUB_OUTPUT"
+          echo "deb_sha256=$DEB_SHA"              >> "$GITHUB_OUTPUT"
+          echo "jar_sha256=$JAR_SHA"              >> "$GITHUB_OUTPUT"
+
+  update-homebrew:
+    needs: get-release-info
+    runs-on: ubuntu-latest
+    permissions:
+      contents: write
+    steps:
+      - name: Harden Runner
+        uses: step-security/harden-runner@v2
+        with:
+          egress-policy: audit
+
+      - name: Checkout homebrew tap
+        uses: actions/checkout@v4
+        with:
+          repository: Stirling-Tools/homebrew-stirling-pdf
+          token: ${{ secrets.HOMEBREW_TAP_TOKEN }}
+          path: homebrew-tap
+
+      - name: Update cask (stirling-pdf.rb)
+        env:
+          VERSION: ${{ needs.get-release-info.outputs.version }}
+          ARM64_SHA: ${{ needs.get-release-info.outputs.dmg_arm64_sha256 }}
+          X64_SHA: ${{ needs.get-release-info.outputs.dmg_x86_64_sha256 }}
+        run: |
+          CASK="homebrew-tap/Casks/stirling-pdf.rb"
+          sed -i "s/version \".*\"/version \"${VERSION}\"/" "$CASK"
+          # Update ARM64 sha256 (line following on_arm block)
+          awk -v arm="$ARM64_SHA" -v x64="$X64_SHA" '
+            /on_arm/     { in_arm=1 }
+            /on_intel/   { in_arm=0; in_intel=1 }
+            /end/        { in_arm=0; in_intel=0 }
+            in_arm  && /sha256/ { sub(/sha256 ".*"/, "sha256 \"" arm "\"") }
+            in_intel && /sha256/ { sub(/sha256 ".*"/, "sha256 \"" x64 "\"") }
+            { print }
+          ' "$CASK" > tmp && mv tmp "$CASK"
+
+      - name: Update formula (stirling-pdf-server.rb)
+        env:
+          VERSION: ${{ needs.get-release-info.outputs.version }}
+          JAR_SHA: ${{ needs.get-release-info.outputs.jar_sha256 }}
+        run: |
+          FORMULA="homebrew-tap/Formula/stirling-pdf-server.rb"
+          sed -i "s/version \".*\"/version \"${VERSION}\"/" "$FORMULA"
+          sed -i "s/sha256 \".*\"/sha256 \"${JAR_SHA}\"/" "$FORMULA"
+
+      - name: Show homebrew tap diff (for dry-run visibility)
+        working-directory: homebrew-tap
+        run: |
+          echo "--- diff --stat ---"
+          git diff --stat
+          echo "--- full diff ---"
+          git diff
+
+      - name: Commit and push homebrew tap updates
+        if: ${{ github.event_name == 'release' || inputs.dry_run == false }}
+        working-directory: homebrew-tap
+        run: |
+          git config user.name  "github-actions[bot]"
+          git config user.email "github-actions[bot]@users.noreply.github.com"
+          git add Casks/stirling-pdf.rb Formula/stirling-pdf-server.rb
+          git diff --cached --quiet && echo "No changes" && exit 0
+          git commit -m "chore: bump Stirling-PDF to v${{ needs.get-release-info.outputs.version }}"
+          git push
+
+  update-scoop:
+    needs: get-release-info
+    runs-on: ubuntu-latest
+    permissions:
+      contents: write
+    steps:
+      - name: Harden Runner
+        uses: step-security/harden-runner@v2
+        with:
+          egress-policy: audit
+
+      - name: Checkout Scoop bucket (shared with Homebrew tap)
+        uses: actions/checkout@v4
+        with:
+          repository: Stirling-Tools/homebrew-stirling-pdf
+          token: ${{ secrets.SCOOP_BUCKET_TOKEN }}
+          path: scoop-bucket
+
+      - name: Update stirling-pdf.json
+        env:
+          VERSION: ${{ needs.get-release-info.outputs.version }}
+          MSI_SHA: ${{ needs.get-release-info.outputs.msi_sha256 }}
+        run: |
+          MANIFEST="scoop-bucket/scoop/stirling-pdf.json"
+          jq --arg v "$VERSION" --arg h "$MSI_SHA" \
+            '.version = $v | .architecture["64bit"].url = "https://github.com/Stirling-Tools/Stirling-PDF/releases/download/v\($v)/Stirling-PDF-windows-x86_64.msi" | .architecture["64bit"].hash = $h' \
+            "$MANIFEST" > tmp.json && mv tmp.json "$MANIFEST"
+
+      - name: Update stirling-pdf-server.json
+        env:
+          VERSION: ${{ needs.get-release-info.outputs.version }}
+          JAR_SHA: ${{ needs.get-release-info.outputs.jar_sha256 }}
+        run: |
+          MANIFEST="scoop-bucket/scoop/stirling-pdf-server.json"
+          jq --arg v "$VERSION" --arg h "$JAR_SHA" \
+            '.version = $v | .url = "https://github.com/Stirling-Tools/Stirling-PDF/releases/download/v\($v)/Stirling-PDF-with-login.jar" | .hash = $h' \
+            "$MANIFEST" > tmp.json && mv tmp.json "$MANIFEST"
+
+      - name: Show Scoop bucket diff (for dry-run visibility)
+        working-directory: scoop-bucket
+        run: |
+          echo "--- diff --stat ---"
+          git diff --stat
+          echo "--- full diff ---"
+          git diff
+
+      - name: Commit and push Scoop bucket updates
+        if: ${{ github.event_name == 'release' || inputs.dry_run == false }}
+        working-directory: scoop-bucket
+        run: |
+          git config user.name  "github-actions[bot]"
+          git config user.email "github-actions[bot]@users.noreply.github.com"
+          git add scoop/stirling-pdf.json scoop/stirling-pdf-server.json
+          git diff --cached --quiet && echo "No changes" && exit 0
+          git commit -m "chore: bump Stirling-PDF to v${{ needs.get-release-info.outputs.version }}"
+          git push
diff --git a/.github/workflows/pre_commit.yml b/.github/workflows/pre_commit.yml
index 764f748d44..9e4d5d574f 100644
--- a/.github/workflows/pre_commit.yml
+++ b/.github/workflows/pre_commit.yml
@@ -2,7 +2,7 @@ name: Pre-commit
 
 on:
   workflow_dispatch:
-  push:
+  pull_request:
     branches:
       - main
 
@@ -16,9 +16,6 @@ jobs:
       # Prevents sdist builds → no tar extraction
       PIP_ONLY_BINARY: ":all:"
       PIP_DISABLE_PIP_VERSION_CHECK: "1"
-    permissions:
-      contents: write
-      pull-requests: write
     steps:
       - name: Harden Runner
         uses: step-security/harden-runner@58077d3c7e43986b6b15fba718e8ea69e387dfcc # v2.15.1
@@ -31,13 +28,6 @@ jobs:
           fetch-depth: 0
           persist-credentials: false
 
-      - name: Setup GitHub App Bot
-        id: setup-bot
-        uses: ./.github/actions/setup-bot
-        with:
-          app-id: ${{ secrets.GH_APP_ID }}
-          private-key: ${{ secrets.GH_APP_PRIVATE_KEY }}
-
       - name: Set up Python
         uses: actions/setup-python@a309ff8b426b58ec0e2a45f0f869d46889d02405 # v6.2.0
         with:
@@ -57,47 +47,4 @@ jobs:
           pre-commit run gitleaks --all-files -c .pre-commit-config.yaml
           pre-commit run end-of-file-fixer --all-files -c .pre-commit-config.yaml
           pre-commit run trailing-whitespace --all-files -c .pre-commit-config.yaml
-        continue-on-error: true
-
-      - name: Set up JDK 25
-        uses: actions/setup-java@be666c2fcd27ec809703dec50e508c2fdc7f6654 # v5.2.0
-        with:
-          java-version: "25"
-          distribution: "temurin"
-
-      - name: Setup Gradle
-        uses: gradle/actions/setup-gradle@f29f5a9d7b09a7c6b29859002d29d24e1674c884 # v5.0.1
-        with:
-          gradle-version: 9.3.1
-
-      - name: Build with Gradle
-        run: ./gradlew build
-        env:
-          MAVEN_USER: ${{ secrets.MAVEN_USER }}
-          MAVEN_PASSWORD: ${{ secrets.MAVEN_PASSWORD }}
-          MAVEN_PUBLIC_URL: ${{ secrets.MAVEN_PUBLIC_URL }}
-
-      - name: git add
-        run: |
-          git add .
-          git diff --staged --quiet || echo "CHANGES_DETECTED=true" >> $GITHUB_ENV
-
-      - name: Create Pull Request
-        if: env.CHANGES_DETECTED == 'true'
-        uses: peter-evans/create-pull-request@c0f553fe549906ede9cf27b5156039d195d2ece0 # v8.1.0
-        with:
-          token: ${{ steps.setup-bot.outputs.token }}
-          commit-message: ":file_folder: pre-commit"
-          committer: ${{ steps.setup-bot.outputs.committer }}
-          author: ${{ steps.setup-bot.outputs.committer }}
-          signoff: true
-          branch: pre-commit
-          title: "🤖 format everything with pre-commit by ${{ steps.setup-bot.outputs.app-slug }}"
-          body: |
-            Auto-generated by [create-pull-request][1] with **${{ steps.setup-bot.outputs.app-slug }}**
-
-            [1]: https://github.com/peter-evans/create-pull-request
-          draft: false
-          delete-branch: true
-          labels: github-actions
-          sign-commits: true
+          git diff --exit-code
diff --git a/.github/workflows/push-docker-base.yml b/.github/workflows/push-docker-base.yml
index 59561ed0df..699eb4708c 100644
--- a/.github/workflows/push-docker-base.yml
+++ b/.github/workflows/push-docker-base.yml
@@ -4,6 +4,7 @@ on:
   push:
     branches:
       - baseDockerImage
+      - accessIssueFix
   workflow_dispatch:
     inputs:
       version:
@@ -34,6 +35,8 @@ jobs:
         run: |
           if [ "${{ github.event_name }}" == "workflow_dispatch" ]; then
             VERSION="${{ github.event.inputs.version }}"
+          elif [ "${{ github.ref_name }}" == "accessIssueFix" ]; then
+            VERSION="1.0.3"
           else
             VERSION="1.0.0"
           fi
diff --git a/.github/workflows/push-docker.yml b/.github/workflows/push-docker.yml
index 11151557ea..244c044bd8 100644
--- a/.github/workflows/push-docker.yml
+++ b/.github/workflows/push-docker.yml
@@ -64,6 +64,8 @@ jobs:
         id: buildx
         uses: docker/setup-buildx-action@8d2750c68a42422c14e847fe6c8ac0403b4cbd6f # v3.12.0
 
+      - name: Install Task
+        uses: go-task/setup-task@3be4020d41929789a01026e0e427a4321ce0ad44 # v2.0.0
       - name: Get version number
         id: versionNumber
         run: echo "versionNumber=$(./gradlew printVersion --quiet | tail -1)" >> $GITHUB_OUTPUT
diff --git a/.github/workflows/rollback-latest.yml b/.github/workflows/rollback-latest.yml
new file mode 100644
index 0000000000..21027cc762
--- /dev/null
+++ b/.github/workflows/rollback-latest.yml
@@ -0,0 +1,93 @@
+name: Rollback Latest Tags to Version
+
+on:
+  workflow_dispatch:
+    inputs:
+      version:
+        description: "Version to rollback to (e.g. 2.8.0)"
+        required: true
+        type: string
+
+permissions:
+  contents: read
+
+jobs:
+  rollback:
+    runs-on: ubuntu-latest
+    permissions:
+      packages: write
+    steps:
+      - name: Harden Runner
+        uses: step-security/harden-runner@58077d3c7e43986b6b15fba718e8ea69e387dfcc # v2.15.1
+        with:
+          egress-policy: audit
+
+      - name: Install crane
+        uses: imjasonh/setup-crane@31b88afe9de28ae0ffa220711af4b60be9435f6e # v0.4
+
+      - name: Login to Docker Hub
+        uses: docker/login-action@c94ce9fb468520275223c153574b00df6fe4bcc9 # v3.7.0
+        with:
+          username: ${{ secrets.DOCKER_HUB_USERNAME }}
+          password: ${{ secrets.DOCKER_HUB_API }}
+
+      - name: Login to GitHub Container Registry
+        uses: docker/login-action@c94ce9fb468520275223c153574b00df6fe4bcc9 # v3.7.0
+        with:
+          registry: ghcr.io
+          username: ${{ github.actor }}
+          password: ${{ github.token }}
+
+      - name: Convert repository owner to lowercase
+        id: repoowner
+        run: echo "lowercase=$(echo ${{ github.repository_owner }} | awk '{print tolower($0)}')" >> $GITHUB_OUTPUT
+
+      - name: Rollback all latest tags to v${{ inputs.version }}
+        env:
+          VERSION: ${{ inputs.version }}
+          DOCKER_HUB_USERNAME: ${{ secrets.DOCKER_HUB_USERNAME }}
+          DOCKER_HUB_ORG_USERNAME: ${{ secrets.DOCKER_HUB_ORG_USERNAME }}
+          REPO_OWNER: ${{ steps.repoowner.outputs.lowercase }}
+        run: |
+          set -euo pipefail
+
+          IMAGES=(
+            "${DOCKER_HUB_USERNAME}/s-pdf"
+            "ghcr.io/${REPO_OWNER}/s-pdf"
+            "ghcr.io/${REPO_OWNER}/stirling-pdf"
+            "${DOCKER_HUB_ORG_USERNAME}/stirling-pdf"
+          )
+
+          VARIANTS=(
+            "${VERSION}:latest"
+            "${VERSION}-fat:latest-fat"
+            "${VERSION}-ultra-lite:latest-ultra-lite"
+          )
+
+          FAILED=0
+
+          for image in "${IMAGES[@]}"; do
+            for variant in "${VARIANTS[@]}"; do
+              SOURCE_TAG="${variant%%:*}"
+              TARGET_TAG="${variant##*:}"
+
+              echo "::group::${image} — ${SOURCE_TAG} → ${TARGET_TAG}"
+
+              if crane manifest "${image}:${SOURCE_TAG}" > /dev/null 2>&1; then
+                crane cp "${image}:${SOURCE_TAG}" "${image}:${TARGET_TAG}"
+                echo "✅ ${image}:${TARGET_TAG} now points to ${SOURCE_TAG}"
+              else
+                echo "::warning::⚠� ${image}:${SOURCE_TAG} not found, skipping"
+                FAILED=1
+              fi
+
+              echo "::endgroup::"
+            done
+          done
+
+          if [ "$FAILED" -ne 0 ]; then
+            echo "::warning::Some source tags were not found. This is expected if not all variants exist for this version."
+          fi
+
+          echo ""
+          echo "🎉 Rollback to ${VERSION} complete!"
diff --git a/.github/workflows/swagger.yml b/.github/workflows/swagger.yml
index 78195183ad..2b34ab9ca6 100644
--- a/.github/workflows/swagger.yml
+++ b/.github/workflows/swagger.yml
@@ -56,6 +56,8 @@ jobs:
           SWAGGERHUB_API_KEY: ${{ secrets.SWAGGERHUB_API_KEY }}
           SWAGGERHUB_USER: "Frooodle"
 
+      - name: Install Task
+        uses: go-task/setup-task@3be4020d41929789a01026e0e427a4321ce0ad44 # v2.0.0
       - name: Get version number
         id: versionNumber
         run: echo "versionNumber=$(./gradlew printVersion --quiet | tail -1)" >> $GITHUB_OUTPUT
diff --git a/.github/workflows/tauri-build.yml b/.github/workflows/tauri-build.yml
index d7ca66b2e0..b03f5bfee4 100644
--- a/.github/workflows/tauri-build.yml
+++ b/.github/workflows/tauri-build.yml
@@ -128,86 +128,16 @@ jobs:
         with:
           gradle-version: 9.3.1
 
-      - name: Build Java backend with JLink
-        working-directory: ./
-        shell: bash
-        run: |
-          chmod +x ./gradlew
-          echo "🔧 Building Stirling-PDF JAR..."
-          # STIRLING_PDF_DESKTOP_UI=false ./gradlew bootJar --no-daemon
-          ./gradlew build -x spotlessApply -x spotlessCheck -x test -x sonarqube
-
-          # Find the built JAR
-          STIRLING_JAR=$(ls app/core/build/libs/stirling-pdf-*.jar | head -n 1)
-          echo "✅ Built JAR: $STIRLING_JAR"
-
-          # Create Tauri directories
-          mkdir -p ./frontend/src-tauri/libs
-          mkdir -p ./frontend/src-tauri/runtime
-
-          # Copy JAR to Tauri libs
-          cp "$STIRLING_JAR" ./frontend/src-tauri/libs/
-          echo "✅ JAR copied to Tauri libs"
-
-          # Analyze JAR dependencies for jlink modules
-          echo "� Analyzing JAR dependencies..."
-          if command -v jdeps &> /dev/null; then
-            DETECTED_MODULES=$(jdeps --print-module-deps --ignore-missing-deps "$STIRLING_JAR" 2>/dev/null || echo "")
-            if [ -n "$DETECTED_MODULES" ]; then
-              echo "📋 jdeps detected modules: $DETECTED_MODULES"
-              MODULES="$DETECTED_MODULES,java.compiler,java.instrument,java.management,java.naming,java.net.http,java.prefs,java.rmi,java.scripting,java.security.jgss,java.security.sasl,java.sql,java.transaction.xa,java.xml.crypto,jdk.crypto.ec,jdk.crypto.cryptoki,jdk.unsupported"
-            else
-              echo "⚠� jdeps analysis failed, using predefined modules"
-              MODULES="java.base,java.compiler,java.desktop,java.instrument,java.logging,java.management,java.naming,java.net.http,java.prefs,java.rmi,java.scripting,java.security.jgss,java.security.sasl,java.sql,java.transaction.xa,java.xml,java.xml.crypto,jdk.crypto.ec,jdk.crypto.cryptoki,jdk.unsupported"
-            fi
-          else
-            echo "⚠� jdeps not available, using predefined modules"
-            MODULES="java.base,java.compiler,java.desktop,java.instrument,java.logging,java.management,java.naming,java.net.http,java.prefs,java.rmi,java.scripting,java.security.jgss,java.security.sasl,java.sql,java.transaction.xa,java.xml,java.xml.crypto,jdk.crypto.ec,jdk.crypto.cryptoki,jdk.unsupported"
-          fi
-
-          # Create custom JRE with jlink (always rebuild)
-          echo "🔧 Creating custom JRE with jlink..."
-          echo "📋 Using modules: $MODULES"
-
-          # Remove any existing JRE
-          rm -rf ./frontend/src-tauri/runtime/jre
-
-          # Create the custom JRE
-          jlink \
-            --add-modules "$MODULES" \
-            --strip-debug \
-            --compress=2 \
-            --no-header-files \
-            --no-man-pages \
-            --output ./frontend/src-tauri/runtime/jre
-
-          if [ ! -d "./frontend/src-tauri/runtime/jre" ]; then
-            echo "� Failed to create JLink runtime"
-            exit 1
-          fi
-
-          # Test the bundled runtime
-          if [ -f "./frontend/src-tauri/runtime/jre/bin/java" ]; then
-            RUNTIME_VERSION=$(./frontend/src-tauri/runtime/jre/bin/java --version 2>&1 | head -n 1)
-            echo "✅ Custom JRE created successfully: $RUNTIME_VERSION"
-          else
-            echo "� Custom JRE executable not found"
-            exit 1
-          fi
-
-          # Calculate runtime size
-          RUNTIME_SIZE=$(du -sh ./frontend/src-tauri/runtime/jre | cut -f1)
-          echo "📊 Custom JRE size: $RUNTIME_SIZE"
+      - name: Setup Task
+        uses: go-task/setup-task@3be4020d41929789a01026e0e427a4321ce0ad44 # v2.0.0
+      - name: Prepare desktop build
+        run: task desktop:prepare
         env:
           MAVEN_USER: ${{ secrets.MAVEN_USER }}
           MAVEN_PASSWORD: ${{ secrets.MAVEN_PASSWORD }}
           MAVEN_PUBLIC_URL: ${{ secrets.MAVEN_PUBLIC_URL }}
           DISABLE_ADDITIONAL_FEATURES: true
 
-      - name: Install frontend dependencies
-        working-directory: ./frontend
-        run: npm ci
-
       # DigiCert KeyLocker Setup (Cloud HSM)
       - name: Setup DigiCert KeyLocker
         id: digicert-setup
@@ -330,6 +260,58 @@ jobs:
           echo "Available tools:"
           ls -la /usr/bin/hd* || echo "No hd* tools found"
 
+      - name: Preflight smctl
+        if: ${{ matrix.platform == 'windows-latest' && env.SM_API_KEY != '' && github.ref == 'refs/heads/main' }}
+        shell: pwsh
+        env:
+          KEYPAIR_ALIAS: ${{ secrets.SM_KEYPAIR_ALIAS }}
+        run: |
+          & smctl healthcheck
+          if ($LASTEXITCODE -ne 0) { Write-Host "[ERROR] smctl healthcheck failed"; exit 1 }
+          & smctl keypair ls
+          if ($LASTEXITCODE -ne 0) { Write-Host "[ERROR] smctl keypair ls failed"; exit 1 }
+          & smctl windows certsync --keypair-alias "$env:KEYPAIR_ALIAS"
+          if ($LASTEXITCODE -ne 0) { Write-Host "[WARN] smctl windows certsync returned non-zero - continuing" }
+
+      - name: Configure Windows code signing
+        if: ${{ matrix.platform == 'windows-latest' && env.SM_API_KEY != '' && github.ref == 'refs/heads/main' }}
+        shell: bash
+        env:
+          KEYPAIR_ALIAS: ${{ secrets.SM_KEYPAIR_ALIAS }}
+        run: |
+          cat > ./frontend/src-tauri/tauri.windows.conf.json <<EOF
+          {
+            "bundle": {
+              "windows": {
+                "signCommand": {
+                  "cmd": "smctl",
+                  "args": ["sign", "--keypair-alias", "${KEYPAIR_ALIAS}", "--input", "%1", "--verbose"]
+                }
+              }
+            }
+          }
+          EOF
+
+      - name: Import release GPG signing key (Linux)
+        if: matrix.platform == 'ubuntu-22.04'
+        env:
+          RELEASE_GPG_PRIVATE_KEY: ${{ secrets.RELEASE_GPG_PRIVATE_KEY }}
+        run: |
+          echo "$RELEASE_GPG_PRIVATE_KEY" | gpg --batch --import
+          gpg --list-secret-keys --keyid-format=long
+
+      - name: Make libjvm discoverable for linuxdeploy (Linux AppImage)
+        if: matrix.platform == 'ubuntu-22.04'
+        run: |
+          JAVA_LIBJVM="$JAVA_HOME/lib/server/libjvm.so"
+          if [ -f "$JAVA_LIBJVM" ]; then
+            sudo ln -sf "$JAVA_LIBJVM" /usr/lib/libjvm.so
+            echo "Linked libjvm from $JAVA_LIBJVM -> /usr/lib/libjvm.so"
+          else
+            echo "libjvm not found at $JAVA_LIBJVM"
+            exit 1
+          fi
+
       - name: Build Tauri app
         uses: tauri-apps/tauri-action@51a9f1156b33df106d827c3a78f8f894946c5faa # v0.5.25
         env:
@@ -340,178 +322,35 @@ jobs:
           APPLE_ID: ${{ secrets.APPLE_ID }}
           APPLE_PASSWORD: ${{ secrets.APPLE_ID_PASSWORD }}
           APPLE_TEAM_ID: ${{ secrets.APPLE_TEAM_ID }}
-          APPIMAGETOOL_SIGN_PASSPHRASE: ${{ secrets.APPIMAGETOOL_SIGN_PASSPHRASE }}
+          # AppImage signing — three env vars work together:
+          #   SIGN=1                        tells linuxdeploy-plugin-appimage to forward --sign to appimagetool
+          #   APPIMAGETOOL_SIGN_PASSPHRASE  appimagetool uses this to unlock the GPG key non-interactively
+          #   SIGN_KEY                      appimagetool picks the key matching this fingerprint
+          # Without SIGN=1, the other two are ignored and the AppImage is built unsigned even if a key is present.
+          SIGN: "1"
+          APPIMAGETOOL_SIGN_PASSPHRASE: ${{ secrets.RELEASE_GPG_PASSPHRASE }}
+          SIGN_KEY: ${{ vars.RELEASE_GPG_FINGERPRINT }}
           TAURI_SIGNING_PRIVATE_KEY: ${{ secrets.TAURI_SIGNING_PRIVATE_KEY }}
           TAURI_SIGNING_PRIVATE_KEY_PASSWORD: ${{ secrets.TAURI_SIGNING_PRIVATE_KEY_PASSWORD }}
           VITE_SUPABASE_PUBLISHABLE_DEFAULT_KEY: ${{ secrets.VITE_SUPABASE_PUBLISHABLE_DEFAULT_KEY || 'sb_publishable_UHz2SVRF5mvdrPHWkRteyA_yNlZTkYb' }}
           VITE_SAAS_SERVER_URL: ${{ secrets.VITE_SAAS_SERVER_URL || 'https://app.stirlingpdf.com' }}
           VITE_SAAS_BACKEND_API_URL: ${{ secrets.VITE_SAAS_BACKEND_API_URL || 'https://api.stirlingpdf.com' }}
-          # Only enable Windows signing in Tauri when on main
-          SIGN: ${{ github.ref == 'refs/heads/main' && (env.SM_API_KEY == '' && env.WINDOWS_CERTIFICATE != '') && '1' || '0' }}
+          SM_CODE_SIGNING_CERT_SHA1_HASH: ${{ secrets.SM_CODE_SIGNING_CERT_SHA1_HASH }}
           CI: true
         with:
           projectPath: ./frontend
           tauriScript: npx tauri
           args: ${{ matrix.args }}
 
-      # Sign with DigiCert KeyLocker (post-build)
-      - name: Sign Windows binaries with DigiCert KeyLocker
-        if: ${{ matrix.platform == 'windows-latest' && env.SM_API_KEY != '' && github.ref == 'refs/heads/main' }}
-        shell: pwsh
+      - name: Clear release GPG key from runner keyring (Linux)
+        if: always() && matrix.platform == 'ubuntu-22.04'
+        env:
+          RELEASE_GPG_FINGERPRINT: ${{ vars.RELEASE_GPG_FINGERPRINT }}
         run: |
-          Write-Host "=== DigiCert KeyLocker Signing ==="
-
-          # Test smctl connectivity first
-          Write-Host "Testing smctl connection..."
-          $healthCheck = & smctl healthcheck 2>&1
-          if ($LASTEXITCODE -eq 0) {
-            Write-Host "[SUCCESS] Connected to DigiCert KeyLocker"
-          } else {
-            Write-Host "[ERROR] Failed to connect to DigiCert KeyLocker"
-            Write-Host $healthCheck
-            exit 1
-          }
-          Write-Host ""
-
-          # Sync certificates to Windows certificate store
-          Write-Host "Syncing certificates to Windows certificate store..."
-          $syncOutput = & smctl windows certsync 2>&1
-          Write-Host "Cert sync result: $syncOutput"
-          Write-Host ""
-
-          # List available certificates and check if they have certificates attached
-          Write-Host "Checking for available certificates..."
-          $certList = & smctl keypair ls 2>&1
-          Write-Host "Keypair list output:"
-          Write-Host $certList
-          Write-Host ""
-
-          # Parse the output to check certificate status
-          $lines = $certList -split "`n"
-          $foundKeypair = $false
-          $hasCertificate = $false
-
-          foreach ($line in $lines) {
-            if ($line -match "${{ secrets.SM_KEYPAIR_ALIAS }}") {
-              $foundKeypair = $true
-              Write-Host "[SUCCESS] Found keypair in list"
-
-              # Check if this line has certificate info (not just empty spaces after alias)
-              $parts = $line -split "\s+"
-              if ($parts.Count -gt 2 -and $parts[1] -ne "" -and $parts[1] -ne "CERTIFICATE") {
-                $hasCertificate = $true
-                Write-Host "[SUCCESS] Certificate is associated with keypair"
-              }
-            }
-          }
-
-          if (-not $foundKeypair) {
-            Write-Host "[ERROR] Keypair not found: ${{ secrets.SM_KEYPAIR_ALIAS }}"
-            Write-Host "Available keypairs are listed above"
-            Write-Host ""
-            Write-Host "Please verify:"
-            Write-Host "  1. Keypair alias is correct in GitHub secret"
-            Write-Host "  2. API key has access to this keypair"
-            exit 1
-          }
-
-          if (-not $hasCertificate) {
-            Write-Host "[ERROR] No certificate associated with keypair"
-            Write-Host "This usually means:"
-            Write-Host "  1. Certificate not yet synced to KeyLocker (run sync manually)"
-            Write-Host "  2. Certificate is pending approval"
-            Write-Host "  3. Certificate needs to be attached to the keypair"
-            Write-Host ""
-            Write-Host "Try running in DigiCert ONE portal:"
-            Write-Host "  smctl keypair sync"
-            exit 1
-          }
-
-          Write-Host "[SUCCESS] Certificate check passed"
-          Write-Host ""
-
-          # Find only the files we need to sign (not build scripts)
-          $filesToSign = @()
-
-          # Main application executable
-          $mainExe = Get-ChildItem -Path "./frontend/src-tauri/target/x86_64-pc-windows-msvc/release" -Filter "stirling-pdf.exe" -File -ErrorAction SilentlyContinue
-          if ($mainExe) { $filesToSign += $mainExe }
-
-          # MSI installer
-          $msiFiles = Get-ChildItem -Path "./frontend/src-tauri/target" -Filter "*.msi" -Recurse -File
-          $filesToSign += $msiFiles
-
-          if ($filesToSign.Count -eq 0) {
-            Write-Host "[ERROR] No files found to sign"
-            exit 1
-          }
-
-          Write-Host "Found $($filesToSign.Count) files to sign:"
-          foreach ($f in $filesToSign) { Write-Host "  - $($f.Name)" }
-          Write-Host ""
-
-          $signedCount = 0
-          foreach ($file in $filesToSign) {
-            Write-Host "Signing: $($file.Name)"
-
-            # Get PKCS11 config file path (set by DigiCert action)
-            $pkcs11Config = $env:PKCS11_CONFIG
-            if (-not $pkcs11Config) {
-              Write-Host "[ERROR] PKCS11_CONFIG environment variable not set"
-              Write-Host "DigiCert KeyLocker action may not have run correctly"
-              exit 1
-            }
-
-            Write-Host "Using PKCS11 config: $pkcs11Config"
-
-            # Try signing with certificate fingerprint first (if available)
-            $fingerprint = "${{ secrets.SM_CODE_SIGNING_CERT_SHA1_HASH }}"
-            if ($fingerprint -and $fingerprint -ne "") {
-              Write-Host "Attempting to sign with certificate fingerprint..."
-              $output = & smctl sign --fingerprint "$fingerprint" --input "$($file.FullName)" --config-file "$pkcs11Config" --verbose 2>&1
-              $exitCode = $LASTEXITCODE
-            } else {
-              Write-Host "No fingerprint provided, using keypair alias..."
-              # Use smctl to sign with keypair alias
-              $output = & smctl sign --keypair-alias "${{ secrets.SM_KEYPAIR_ALIAS }}" --input "$($file.FullName)" --config-file "$pkcs11Config" --verbose 2>&1
-              $exitCode = $LASTEXITCODE
-            }
-
-            Write-Host "Exit code: $exitCode"
-            Write-Host "Output: $output"
-
-            # Check if output contains "FAILED" even with exit code 0
-            if ($output -match "FAILED" -or $output -match "error" -or $output -match "Error") {
-              Write-Host ""
-              Write-Host "[ERROR] Signing failed for $($file.Name)"
-              Write-Host "[ERROR] smctl returned success but output indicates failure"
-              Write-Host ""
-              Write-Host "Possible issues:"
-              Write-Host "  1. Certificate not fully synced to KeyLocker (wait a few minutes)"
-              Write-Host "  2. Incorrect keypair alias"
-              Write-Host "  3. API key lacks signing permissions"
-              Write-Host ""
-              Write-Host "Please verify in DigiCert ONE portal:"
-              Write-Host "  - Certificate status is 'Issued' (not Pending)"
-              Write-Host "  - Keypair status is 'Online'"
-              Write-Host "  - 'Can sign' is set to 'Yes'"
-              exit 1
-            }
-
-            if ($exitCode -ne 0) {
-              Write-Host "[ERROR] Failed to sign $($file.Name)"
-              Write-Host "Full error output:"
-              Write-Host $output
-              exit 1
-            }
-
-            $signedCount++
-            Write-Host "[SUCCESS] Signed: $($file.Name)"
-            Write-Host ""
-          }
-
-          Write-Host "=== Summary ==="
-          Write-Host "[SUCCESS] Signed $signedCount/$($filesToSign.Count) files successfully"
+          if [ -n "$RELEASE_GPG_FINGERPRINT" ]; then
+            gpg --batch --yes --delete-secret-keys "$RELEASE_GPG_FINGERPRINT" || true
+            gpg --batch --yes --delete-keys "$RELEASE_GPG_FINGERPRINT" || true
+          fi
 
       - name: Verify notarization (macOS only)
         if: matrix.platform == 'macos-15' || matrix.platform == 'macos-15-intel'
@@ -536,73 +375,80 @@ jobs:
 
           # Find and rename artifacts based on platform
           if [ "${{ matrix.platform }}" = "windows-latest" ]; then
-            find . -name "*.exe" -exec cp {} "../../../dist/Stirling-PDF-${{ matrix.name }}.exe" \;
+            # Only ship the MSI installer. The loose exe and WiX toolset exes
+            # are not the user-facing installer - the MSI contains the signed inner exe.
             find . -name "*.msi" -exec cp {} "../../../dist/Stirling-PDF-${{ matrix.name }}.msi" \;
           elif [ "${{ matrix.platform }}" = "macos-15" ] || [ "${{ matrix.platform }}" = "macos-15-intel" ]; then
             find . -name "*.dmg" -exec cp {} "../../../dist/Stirling-PDF-${{ matrix.name }}.dmg" \;
           else
             find . -name "*.deb" -exec cp {} "../../../dist/Stirling-PDF-${{ matrix.name }}.deb" \;
+            find . -name "*.rpm" -exec cp {} "../../../dist/Stirling-PDF-${{ matrix.name }}.rpm" \;
             find . -name "*.AppImage" -exec cp {} "../../../dist/Stirling-PDF-${{ matrix.name }}.AppImage" \;
           fi
 
+      # Verify the MSI AND the inner exe extracted from it are signed.
+      # The inner exe is what gets installed on users' machines and what AV scans.
       - name: Verify Windows Code Signature
-        if: matrix.platform == 'windows-latest' && github.ref == 'refs/heads/main'
+        if: matrix.platform == 'windows-latest' && env.SM_API_KEY != '' && github.ref == 'refs/heads/main'
         shell: pwsh
         run: |
-          Write-Host "Verifying Windows code signatures..."
-
-          $exePath = "./dist/Stirling-PDF-${{ matrix.name }}.exe"
+          $allSigned = $true
           $msiPath = "./dist/Stirling-PDF-${{ matrix.name }}.msi"
 
-          $allSigned = $true
-          $usingKeyLocker = "${{ env.SM_API_KEY }}" -ne ""
-          $usingPfx = "${{ env.WINDOWS_CERTIFICATE }}" -ne ""
-
-          # Check EXE signature
-          if (Test-Path $exePath) {
-            $exeSig = Get-AuthenticodeSignature -FilePath $exePath
-            Write-Host "EXE Signature Status: $($exeSig.Status)"
-            Write-Host "EXE Signer: $($exeSig.SignerCertificate.Subject)"
-            Write-Host "EXE Timestamp: $($exeSig.TimeStamperCertificate.NotAfter)"
-
-            if ($exeSig.Status -ne "Valid") {
-              Write-Host "[WARNING] EXE is not properly signed (Status: $($exeSig.Status))"
-              if ($usingKeyLocker -or $usingPfx) {
-                Write-Host "[ERROR] Certificate was provided but signing failed"
-                $allSigned = $false
-              } else {
-                Write-Host "[INFO] Building unsigned binary (no certificate provided)"
-              }
-            } else {
-              Write-Host "[SUCCESS] EXE is properly signed"
-            }
-          }
-
-          # Check MSI signature
+          # Check MSI (outer wrapper)
           if (Test-Path $msiPath) {
-            $msiSig = Get-AuthenticodeSignature -FilePath $msiPath
-            Write-Host "MSI Signature Status: $($msiSig.Status)"
-            Write-Host "MSI Signer: $($msiSig.SignerCertificate.Subject)"
-            Write-Host "MSI Timestamp: $($msiSig.TimeStamperCertificate.NotAfter)"
+            $sig = Get-AuthenticodeSignature -FilePath $msiPath
+            Write-Host "MSI: Status=$($sig.Status), Signer=$($sig.SignerCertificate.Subject)"
+            if ($sig.Status -ne "Valid") {
+              Write-Host "[ERROR] MSI is not signed"
+              $allSigned = $false
+            }
 
-            if ($msiSig.Status -ne "Valid") {
-              Write-Host "[WARNING] MSI is not properly signed (Status: $($msiSig.Status))"
-              if ($usingKeyLocker -or $usingPfx) {
-                Write-Host "[ERROR] Certificate was provided but signing failed"
-                $allSigned = $false
+            # Extract MSI and verify inner exe
+            $extractDir = Join-Path $env:RUNNER_TEMP "msi-verify"
+            if (Test-Path $extractDir) { Remove-Item $extractDir -Recurse -Force }
+            $proc = Start-Process msiexec.exe -ArgumentList '/a', $msiPath, '/qn', "TARGETDIR=$extractDir" -Wait -PassThru -NoNewWindow
+            if ($proc.ExitCode -eq 0) {
+              $innerExe = Get-ChildItem -Path $extractDir -Filter "stirling-pdf.exe" -Recurse -File | Select-Object -First 1
+              if ($innerExe) {
+                $sig = Get-AuthenticodeSignature -FilePath $innerExe.FullName
+                Write-Host "Inner EXE: Status=$($sig.Status), Signer=$($sig.SignerCertificate.Subject)"
+                if ($sig.Status -ne "Valid") {
+                  Write-Host "[ERROR] Inner exe is NOT signed - AV will flag this at runtime"
+                  $allSigned = $false
+                }
               } else {
-                Write-Host "[INFO] Building unsigned binary (no certificate provided)"
+                Write-Host "[ERROR] Could not find stirling-pdf.exe inside MSI"
+                $allSigned = $false
               }
             } else {
-              Write-Host "[SUCCESS] MSI is properly signed"
+              Write-Host "[ERROR] MSI extraction failed (exit code: $($proc.ExitCode))"
+              $allSigned = $false
             }
+          } else {
+            Write-Host "[ERROR] MSI not found at $msiPath"
+            $allSigned = $false
           }
 
-          if (($usingKeyLocker -or $usingPfx) -and -not $allSigned) {
-            Write-Host "[ERROR] Code signing verification failed"
+          if (-not $allSigned) {
+            Write-Host "[ERROR] Signature verification failed"
             exit 1
+          }
+          Write-Host "[SUCCESS] MSI and inner exe are properly signed"
+
+      - name: Dump smctl logs on failure
+        if: ${{ failure() && matrix.platform == 'windows-latest' && env.SM_API_KEY != '' }}
+        shell: pwsh
+        run: |
+          $logDir = "$env:USERPROFILE\.signingmanager\logs"
+          if (Test-Path $logDir) {
+            Get-ChildItem $logDir | ForEach-Object {
+              Write-Host "=== $($_.FullName) ==="
+              Get-Content $_.FullName -Tail 200
+              Write-Host ""
+            }
           } else {
-            Write-Host "[SUCCESS] Code signature verification completed"
+            Write-Host "smctl log directory not found at $logDir"
           }
 
       - name: Upload artifacts
@@ -634,8 +480,8 @@ jobs:
             fi
           else
             echo "Checking for Linux artifacts..."
-            find . -name "*.deb" -o -name "*.AppImage" | head -5
-            if [ $(find . -name "*.deb" -o -name "*.AppImage" | wc -l) -eq 0 ]; then
+            find . -name "*.deb" -o -name "*.rpm" -o -name "*.AppImage" | head -5
+            if [ $(find . -name "*.deb" -o -name "*.rpm" -o -name "*.AppImage" | wc -l) -eq 0 ]; then
               echo "� No Linux artifacts found"
               exit 1
             fi
@@ -648,7 +494,7 @@ jobs:
         run: |
           cd ./frontend/src-tauri/target
           echo "Artifact sizes for ${{ matrix.name }}:"
-          find . -name "*.exe" -o -name "*.dmg" -o -name "*.deb" -o -name "*.AppImage" -o -name "*.msi" | while read file; do
+          find . -name "*.exe" -o -name "*.dmg" -o -name "*.deb" -o -name "*.rpm" -o -name "*.AppImage" -o -name "*.msi" | while read file; do
             if [ -f "$file" ]; then
               size=$(stat -c%s "$file" 2>/dev/null || stat -f%z "$file" 2>/dev/null || echo "unknown")
               echo "$file: $size bytes"
@@ -692,7 +538,7 @@ jobs:
               'Stirling-PDF-windows-x86_64': { icon: '🪟', platform: 'Windows x64', files: '.exe, .msi' },
               'Stirling-PDF-macos-aarch64': { icon: '�', platform: 'macOS ARM64', files: '.dmg' },
               'Stirling-PDF-macos-x86_64': { icon: '�', platform: 'macOS Intel', files: '.dmg' },
-              'Stirling-PDF-linux-x86_64': { icon: '�', platform: 'Linux x64', files: '.deb, .AppImage' }
+              'Stirling-PDF-linux-x86_64': { icon: '�', platform: 'Linux x64', files: '.deb, .rpm, .AppImage' }
             };
 
             let commentBody = `## 📦 Tauri Desktop Builds Ready!\n\n`;
diff --git a/.github/workflows/testdriver.yml b/.github/workflows/testdriver.yml
index 5d2466013b..4d61ce5df0 100644
--- a/.github/workflows/testdriver.yml
+++ b/.github/workflows/testdriver.yml
@@ -167,9 +167,9 @@ jobs:
         with:
           key: ${{secrets.TESTDRIVER_API_KEY}}
           prerun: |
+            choco install go-task -y
+            task frontend:build
             cd frontend
-            npm install
-            npm run build
             npm install dashcam-chrome --save
             Start-Process "C:/Program Files/Google/Chrome/Application/chrome.exe" -ArgumentList "--start-maximized", "--load-extension=$(pwd)/node_modules/dashcam-chrome/build", "http://${{ secrets.NEW_VPS_HOST }}:1337"
             Start-Sleep -Seconds 20
diff --git a/.gitignore b/.gitignore
index b5025f1b4f..d6dc4826ca 100644
--- a/.gitignore
+++ b/.gitignore
@@ -165,6 +165,7 @@ __pycache__/
 # Virtual environments
 .env*
 !.env*.example
+!engine/.env
 .venv*
 env*/
 venv*/
@@ -181,6 +182,7 @@ venv.bak/
 .idea/
 *.iml
 out/
+.junie/
 
 # Ignore Mac DS_Store files
 .DS_Store
@@ -216,8 +218,14 @@ id_ecdsa.pub
 id_ed25519
 id_ed25519.pub
 .ssh/
+
+# Allow the published GPG release signing public key (safe to share)
+!docs/security/signing-key.pub
 *ssh
 
+# Taskfile checksum cache
+.task/
+
 # cache
 .cache
 .ruff_cache
@@ -254,3 +262,6 @@ docs/type3/signatures/
 
 # Type3 sample PDFs (development only)
 **/type3/samples/
+
+# Claude
+.claude/
diff --git a/.pre-commit-config.yaml b/.pre-commit-config.yaml
index 928602fdda..5279547522 100644
--- a/.pre-commit-config.yaml
+++ b/.pre-commit-config.yaml
@@ -16,7 +16,7 @@ repos:
     hooks:
       - id: codespell
         args:
-          - --ignore-words-list=thirdParty,tabEl,tabEls,Sie,ist
+          - --ignore-words-list=thirdParty,tabEl,tabEls,Sie,ist,fulfilment
           - --skip="./.*,*.csv,*.json,*.ambr"
           - --quiet-level=2
         files: \.(html|css|js|py|md)$
diff --git a/.taskfiles/backend.yml b/.taskfiles/backend.yml
new file mode 100644
index 0000000000..7e487d092c
--- /dev/null
+++ b/.taskfiles/backend.yml
@@ -0,0 +1,117 @@
+version: '3'
+
+tasks:
+  dev:
+    desc: "Start backend dev server"
+    ignore_error: true
+    cmds:
+      - cmd: cmd /c gradlew.bat :stirling-pdf:bootRun
+        platforms: [windows]
+      - cmd: ./gradlew :stirling-pdf:bootRun
+        platforms: [linux, darwin]
+
+  build:
+    desc: "Full backend build"
+    cmds:
+      - cmd: cmd /c gradlew.bat clean build
+        platforms: [windows]
+      - cmd: ./gradlew clean build
+        platforms: [linux, darwin]
+
+  build:fast:
+    desc: "Build without tests"
+    cmds:
+      - cmd: cmd /c gradlew.bat clean build -x test
+        platforms: [windows]
+      - cmd: ./gradlew clean build -x test
+        platforms: [linux, darwin]
+
+  build:ci:
+    desc: "Build for CI (formatting checked separately)"
+    cmds:
+      - cmd: cmd /c gradlew.bat build -PnoSpotless
+        platforms: [windows]
+      - cmd: ./gradlew build -PnoSpotless
+        platforms: [linux, darwin]
+
+  test:
+    desc: "Run backend tests"
+    cmds:
+      - cmd: cmd /c gradlew.bat test
+        platforms: [windows]
+      - cmd: ./gradlew test
+        platforms: [linux, darwin]
+
+  format:
+    desc: "Auto-fix code formatting"
+    cmds:
+      - cmd: cmd /c gradlew.bat spotlessApply
+        platforms: [windows]
+      - cmd: ./gradlew spotlessApply
+        platforms: [linux, darwin]
+
+  format:check:
+    desc: "Check code formatting"
+    cmds:
+      - cmd: cmd /c gradlew.bat spotlessCheck
+        platforms: [windows]
+      - cmd: ./gradlew spotlessCheck
+        platforms: [linux, darwin]
+
+  fix:
+    desc: "Auto-fix backend"
+    cmds:
+      - task: format
+
+  swagger:
+    desc: "Generate OpenAPI docs"
+    cmds:
+      - cmd: cmd /c gradlew.bat :stirling-pdf:copySwaggerDoc
+        platforms: [windows]
+      - cmd: ./gradlew :stirling-pdf:copySwaggerDoc
+        platforms: [linux, darwin]
+    sources:
+      - app/core/src/main/java/**/*.java
+      - app/proprietary/src/main/java/**/*.java
+      - app/common/src/main/java/**/*.java
+    generates:
+      - SwaggerDoc.json
+
+  check:
+    desc: "Backend quality gate"
+    cmds:
+      - task: format:check
+      - task: test
+
+  version:
+    desc: "Print project version"
+    silent: true
+    cmds:
+      - cmd: cmd /c gradlew.bat printVersion --quiet | tail -1
+        platforms: [windows]
+      - cmd: ./gradlew printVersion --quiet | tail -1
+        platforms: [linux, darwin]
+
+  licenses:check:
+    desc: "Check dependency licenses"
+    cmds:
+      - cmd: cmd /c gradlew.bat checkLicense --no-parallel
+        platforms: [windows]
+      - cmd: ./gradlew checkLicense --no-parallel
+        platforms: [linux, darwin]
+
+  licenses:generate:
+    desc: "Check and generate dependency license report"
+    cmds:
+      - cmd: cmd /c gradlew.bat checkLicense generateLicenseReport --no-parallel
+        platforms: [windows]
+      - cmd: ./gradlew checkLicense generateLicenseReport --no-parallel
+        platforms: [linux, darwin]
+
+  clean:
+    desc: "Clean build artifacts"
+    cmds:
+      - cmd: cmd /c gradlew.bat clean
+        platforms: [windows]
+      - cmd: ./gradlew clean
+        platforms: [linux, darwin]
diff --git a/.taskfiles/desktop.yml b/.taskfiles/desktop.yml
new file mode 100644
index 0000000000..0bf938e806
--- /dev/null
+++ b/.taskfiles/desktop.yml
@@ -0,0 +1,105 @@
+version: '3'
+
+vars:
+  JLINK_MODULES: "java.base,java.compiler,java.desktop,java.instrument,java.logging,java.management,java.naming,java.net.http,java.prefs,java.rmi,java.scripting,java.security.jgss,java.security.sasl,java.sql,java.transaction.xa,java.xml,java.xml.crypto,jdk.crypto.ec,jdk.crypto.cryptoki,jdk.unsupported"
+
+tasks:
+  prepare:
+    desc: "Prepare desktop build dependencies"
+    deps: [jlink, ":frontend:prepare:desktop", provisioner]
+
+  provisioner:
+    desc: "Build installer provisioner"
+    platforms: [windows]
+    cmds:
+      - node scripts/build-provisioner.mjs
+
+  dev:
+    desc: "Start Tauri desktop dev mode"
+    deps: [prepare]
+    ignore_error: true
+    cmds:
+      - npx tauri dev --no-watch
+
+  build:
+    desc: "Build Tauri desktop app (production)"
+    deps: [prepare]
+    cmds:
+      - npx tauri build
+
+  build:dev:
+    desc: "Build Tauri desktop app (dev, no bundling)"
+    deps: [prepare]
+    cmds:
+      - npx tauri build --no-bundle
+
+  build:dev:mac:
+    desc: "Build Tauri desktop .app bundle (macOS)"
+    deps: [prepare]
+    cmds:
+      - npx tauri build --bundles app
+
+  build:dev:windows:
+    desc: "Build Tauri desktop NSIS installer (Windows)"
+    deps: [prepare]
+    cmds:
+      - npx tauri build --bundles nsis
+
+  build:dev:linux:
+    desc: "Build Tauri desktop AppImage (Linux)"
+    deps: [prepare]
+    cmds:
+      - npx tauri build --bundles appimage
+
+  clean:
+    desc: "Clean Tauri/Cargo build artifacts"
+    cmds:
+      - task: jlink:clean
+      - cd src-tauri && cargo clean
+      - rm -rf dist build
+
+  # ============================================================
+  # JLink — Build bundled Java runtime for Tauri
+  # ============================================================
+
+  jlink:
+    desc: "Build backend JAR and create JLink runtime for Tauri"
+    deps: [jlink:jar, jlink:runtime]
+
+  jlink:jar:
+    desc: "Build backend JAR for Tauri bundling"
+    run: once
+    dir: ..
+    env:
+      DISABLE_ADDITIONAL_FEATURES: "true"
+    cmds:
+      - cmd: cmd /c gradlew.bat bootJar --no-daemon
+        platforms: [windows]
+      - cmd: ./gradlew bootJar --no-daemon
+        platforms: [linux, darwin]
+      - mkdir -p frontend/src-tauri/libs
+      - cp app/core/build/libs/stirling-pdf-*.jar frontend/src-tauri/libs/
+    status:
+      - test -f frontend/src-tauri/libs/stirling-pdf-*.jar
+
+  jlink:runtime:
+    desc: "Create custom JRE with jlink"
+    deps: [jlink:jar]
+    cmds:
+      - rm -rf src-tauri/runtime/jre
+      - mkdir -p src-tauri/runtime
+      - >-
+        jlink
+        --add-modules {{.JLINK_MODULES}}
+        --strip-debug
+        --compress=2
+        --no-header-files
+        --no-man-pages
+        --output src-tauri/runtime/jre
+    status:
+      - test -d src-tauri/runtime/jre
+
+  jlink:clean:
+    desc: "Remove JLink runtime and bundled JARs"
+    cmds:
+      - rm -rf src-tauri/libs src-tauri/runtime
diff --git a/.taskfiles/docker.yml b/.taskfiles/docker.yml
new file mode 100644
index 0000000000..eca54f4a85
--- /dev/null
+++ b/.taskfiles/docker.yml
@@ -0,0 +1,57 @@
+version: '3'
+
+vars:
+  COMPOSE_DIR: docker/compose
+  EMBEDDED_DIR: docker/embedded
+
+tasks:
+  build:
+    desc: "Build standard Docker image"
+    cmds:
+      - docker build -t stirling-pdf -f {{.EMBEDDED_DIR}}/Dockerfile .
+
+  build:fat:
+    desc: "Build fat Docker image (all features)"
+    cmds:
+      - docker build -t stirling-pdf-fat -f {{.EMBEDDED_DIR}}/Dockerfile.fat .
+
+  build:ultra-lite:
+    desc: "Build ultra-lite Docker image"
+    cmds:
+      - docker build -t stirling-pdf-ultra-lite -f {{.EMBEDDED_DIR}}/Dockerfile.ultra-lite .
+
+  build:frontend:
+    desc: "Build frontend-only Docker image"
+    cmds:
+      - docker build -t stirling-pdf-frontend -f docker/frontend/Dockerfile .
+
+  build:engine:
+    desc: "Build engine Docker image"
+    dir: engine
+    cmds:
+      - docker build -t stirling-pdf-engine .
+
+  up:
+    desc: "Start standard docker compose stack"
+    cmds:
+      - docker compose -f {{.COMPOSE_DIR}}/docker-compose.yml up -d
+
+  up:fat:
+    desc: "Start fat docker compose stack"
+    cmds:
+      - docker compose -f {{.COMPOSE_DIR}}/docker-compose.fat.yml up -d
+
+  up:ultra-lite:
+    desc: "Start ultra-lite docker compose stack"
+    cmds:
+      - docker compose -f {{.COMPOSE_DIR}}/docker-compose.ultra-lite.yml up -d
+
+  down:
+    desc: "Stop all running docker compose stacks"
+    cmds:
+      - docker compose -f {{.COMPOSE_DIR}}/docker-compose.yml down
+
+  logs:
+    desc: "Tail docker compose logs"
+    cmds:
+      - docker compose -f {{.COMPOSE_DIR}}/docker-compose.yml logs -f
diff --git a/.taskfiles/engine.yml b/.taskfiles/engine.yml
new file mode 100644
index 0000000000..9d830e0808
--- /dev/null
+++ b/.taskfiles/engine.yml
@@ -0,0 +1,127 @@
+version: '3'
+
+tasks:
+  install:
+    desc: "Install engine dependencies"
+    run: once
+    cmds:
+      - uv python install 3.13.8
+      - uv sync
+    sources:
+      - uv.lock
+      - pyproject.toml
+    status:
+      - test -d .venv
+
+  prepare:
+    desc: "Set up engine .env from template"
+    deps: [install]
+    cmds:
+      - uv run scripts/setup_env.py
+    sources:
+      - scripts/setup_env.py
+    generates:
+      - .env.local
+
+  run:
+    desc: "Run engine server"
+    deps: [prepare]
+    ignore_error: true
+    dir: src
+    env:
+      PYTHONUNBUFFERED: "1"
+    cmds:
+      - uv run uvicorn stirling.api.app:app --host 0.0.0.0 --port 5001
+
+  dev:
+    desc: "Start engine dev server with hot reload"
+    deps: [prepare]
+    ignore_error: true
+    dir: src
+    env:
+      PYTHONUNBUFFERED: "1"
+    cmds:
+      - uv run uvicorn stirling.api.app:app --host 0.0.0.0 --port 5001 --reload
+
+  lint:
+    desc: "Run linting"
+    deps: [install]
+    cmds:
+      - uv run ruff check .
+
+  lint:fix:
+    desc: "Auto-fix lint issues"
+    deps: [install]
+    cmds:
+      - uv run ruff check . --fix
+
+  format:
+    desc: "Auto-fix code formatting"
+    deps: [install]
+    cmds:
+      - uv run ruff format .
+
+  format:check:
+    desc: "Check code formatting"
+    deps: [install]
+    cmds:
+      - uv run ruff format . --diff
+
+  typecheck:
+    desc: "Run type checking"
+    deps: [install]
+    cmds:
+      - uv run pyright . --warnings
+
+  test:
+    desc: "Run tests"
+    deps: [prepare]
+    cmds:
+      - uv run pytest tests
+
+  fix:
+    desc: "Auto-fix lint + format"
+    cmds:
+      - task: lint:fix
+      - task: format
+
+  check:
+    desc: "Full engine quality gate"
+    cmds:
+      - task: typecheck
+      - task: lint
+      - task: format:check
+      - task: test
+
+  tool-models:
+    desc: "Generate tool_models.py from Java OpenAPI spec (SwaggerDoc.json)"
+    deps: [install, ":backend:swagger"]
+    cmds:
+      - uv run python scripts/generate_tool_models.py --spec ../SwaggerDoc.json --output src/stirling/models/tool_models.py
+    sources:
+      - ../SwaggerDoc.json
+      - scripts/generate_tool_models.py
+    generates:
+      - src/stirling/models/tool_models.py
+
+  clean:
+    desc: "Clean build artifacts"
+    cmds:
+      - task: '{{if eq .OS "Windows_NT"}}clean-windows{{else}}clean-unix{{end}}'
+
+  clean-unix:
+    internal: true
+    desc: "Clean build artifacts"
+    cmds:
+      - rm -rf .venv data logs output
+
+  # On Windows, use PowerShell as bash failed to delete some dependencies
+  clean-windows:
+    internal: true
+    desc: "Clean build artifacts"
+    ignore_error: true
+    cmds:
+      - powershell rm -Recurse -Force -ErrorAction SilentlyContinue .venv
+      - powershell rm -Recurse -Force -ErrorAction SilentlyContinue data
+      - powershell rm -Recurse -Force -ErrorAction SilentlyContinue logs
+      - powershell rm -Recurse -Force -ErrorAction SilentlyContinue output
diff --git a/.taskfiles/frontend.yml b/.taskfiles/frontend.yml
new file mode 100644
index 0000000000..4156a34f1c
--- /dev/null
+++ b/.taskfiles/frontend.yml
@@ -0,0 +1,313 @@
+version: '3'
+
+tasks:
+  install:
+    desc: "Install dependencies"
+    run: once
+    cmds:
+      - '{{ if eq .CI "true" }}npm ci{{ else }}npm install{{ end }}'
+    sources:
+      - package-lock.json
+      - package.json
+    status:
+      - test -d node_modules
+    env:
+      CI: '{{ .CI | default "false" }}'
+
+  prepare:env:
+    desc: "Generate .env from example if missing"
+    run: once
+    deps: [install]
+    cmds:
+      - npx tsx scripts/setup-env.ts
+    sources:
+      - scripts/setup-env.ts
+      - config/.env.example
+    generates:
+      - .env
+
+  prepare:env:saas:
+    desc: "Generate .env and .env.saas from examples if missing"
+    run: once
+    deps: [install]
+    cmds:
+      - npx tsx scripts/setup-env.ts --saas
+    sources:
+      - scripts/setup-env.ts
+      - config/.env.example
+      - config/.env.saas.example
+    generates:
+      - .env
+      - .env.saas
+
+  prepare:env:desktop:
+    desc: "Generate .env and .env.desktop from examples if missing"
+    run: once
+    deps: [install]
+    cmds:
+      - npx tsx scripts/setup-env.ts --desktop
+    sources:
+      - scripts/setup-env.ts
+      - config/.env.example
+      - config/.env.desktop.example
+    generates:
+      - .env
+      - .env.desktop
+
+  prepare:icons:
+    desc: "Generate icon bundle from source references"
+    run: once
+    deps: [install]
+    cmds:
+      - node scripts/generate-icons.js
+
+  prepare:
+    desc: "Set up dev environment"
+    run: once
+    deps: [prepare:env, prepare:icons]
+
+  prepare:saas:
+    desc: "Prepare for SaaS mode"
+    run: once
+    deps: [prepare:env:saas, prepare:icons]
+
+  prepare:desktop:
+    desc: "Prepare for desktop mode"
+    run: once
+    deps: [prepare:env:desktop, prepare:icons]
+
+  # ============================================================
+  # Development
+  # ============================================================
+
+  dev:
+    desc: "Start frontend dev server"
+    deps: [prepare]
+    ignore_error: true
+    cmds:
+      - npx vite
+
+  dev:core:
+    desc: "Start frontend dev server in core mode"
+    deps: [prepare]
+    ignore_error: true
+    cmds:
+      - npx vite --mode core
+
+  dev:proprietary:
+    desc: "Start frontend dev server in proprietary mode"
+    deps: [prepare]
+    ignore_error: true
+    cmds:
+      - npx vite --mode proprietary
+
+  dev:saas:
+    desc: "Start frontend dev server in SaaS mode"
+    deps: [prepare:saas]
+    ignore_error: true
+    cmds:
+      - npx vite --mode saas
+
+  dev:desktop:
+    desc: "Start frontend dev server in desktop mode"
+    deps: [prepare:desktop]
+    ignore_error: true
+    cmds:
+      - npx vite --mode desktop
+
+  dev:prototypes:
+    desc: "Start frontend dev server in prototypes mode"
+    deps: [prepare]
+    ignore_error: true
+    cmds:
+      - npx vite --mode prototypes
+
+  # ============================================================
+  # Build
+  # ============================================================
+
+  build:
+    desc: "Production build (default mode)"
+    deps: [prepare]
+    cmds:
+      - npx vite build
+
+  build:core:
+    desc: "Build for core mode"
+    deps: [prepare]
+    cmds:
+      - npx vite build --mode core
+
+  build:proprietary:
+    desc: "Build for proprietary mode"
+    deps: [prepare]
+    cmds:
+      - npx vite build --mode proprietary
+
+  build:saas:
+    desc: "Build for SaaS mode"
+    deps: [prepare:saas]
+    cmds:
+      - npx vite build --mode saas
+
+  build:desktop:
+    desc: "Build for desktop mode"
+    deps: [prepare:desktop]
+    cmds:
+      - npx vite build --mode desktop
+
+  build:prototypes:
+    desc: "Build for prototypes mode"
+    deps: [prepare]
+    cmds:
+      - npx vite build --mode prototypes
+
+  # ============================================================
+  # Code quality
+  # ============================================================
+
+  lint:
+    desc: "Run linting"
+    deps: [install]
+    cmds:
+      - npx eslint --max-warnings=0
+      - npx dpdm src --circular --no-warning --no-tree --exit-code circular:1
+
+  lint:fix:
+    desc: "Auto-fix lint issues"
+    deps: [install]
+    cmds:
+      - npx eslint --fix
+
+  format:
+    desc: "Auto-fix code formatting"
+    deps: [install]
+    cmds:
+      - npx prettier --write .
+
+  format:check:
+    desc: "Check code formatting"
+    deps: [install]
+    cmds:
+      - npx prettier --check .
+
+  fix:
+    desc: "Auto-fix lint and format"
+    cmds:
+      - task: format
+      - task: lint:fix
+
+  typecheck:
+    desc: "Typecheck default build of the app"
+    cmds:
+      - task: typecheck:proprietary
+
+  typecheck:core:
+    desc: "Typecheck core build variant"
+    deps: [prepare]
+    cmds:
+      - npx tsc --noEmit --project src/core/tsconfig.json
+
+  typecheck:proprietary:
+    desc: "Typecheck proprietary build variant"
+    deps: [prepare]
+    cmds:
+      - npx tsc --noEmit --project src/proprietary/tsconfig.json
+
+  typecheck:saas:
+    desc: "Typecheck SaaS build variant"
+    deps: [prepare:saas]
+    cmds:
+      - npx tsc --noEmit --project src/saas/tsconfig.json
+
+  typecheck:desktop:
+    desc: "Typecheck desktop build variant"
+    deps: [prepare:desktop]
+    cmds:
+      - npx tsc --noEmit --project src/desktop/tsconfig.json
+
+  typecheck:scripts:
+    desc: "Typecheck scripts"
+    deps: [prepare]
+    cmds:
+      - npx tsc --noEmit --project scripts/tsconfig.json
+
+  typecheck:prototypes:
+    desc: "Typecheck prototypes build variant"
+    deps: [prepare]
+    cmds:
+      - npx tsc --noEmit --project src/prototypes/tsconfig.json
+
+  typecheck:all:
+    desc: "Typecheck all build variants"
+    cmds:
+      - task: typecheck:core
+      - task: typecheck:proprietary
+      - task: typecheck:saas
+      - task: typecheck:desktop
+      - task: typecheck:scripts
+
+  # ============================================================
+  # Quality Gate
+  # ============================================================
+
+  check:
+    desc: "Quick quality gate for local development"
+    cmds:
+      - task: typecheck
+      - task: lint
+      - task: format:check
+      - task: test
+
+  check:all:
+    desc: "Full CI quality gate"
+    cmds:
+      - task: typecheck:all
+      - task: lint
+      - task: format:check
+      - task: build
+      - task: test
+
+  # ============================================================
+  # Test
+  # ============================================================
+
+  test:
+    desc: "Run tests"
+    deps: [install]
+    cmds:
+      - npx vitest run
+
+  test:watch:
+    desc: "Run tests in watch mode"
+    deps: [install]
+    cmds:
+      - npx vitest --watch
+
+  test:coverage:
+    desc: "Run tests with coverage"
+    deps: [install]
+    cmds:
+      - npx vitest --coverage
+
+  test:e2e:
+    desc: "Run E2E tests"
+    deps: [prepare]
+    cmds:
+      - npx playwright test {{.CLI_ARGS}}
+
+  test:e2e:install:
+    desc: "Install E2E test browsers"
+    deps: [install]
+    cmds:
+      - npx playwright install {{.CLI_ARGS}} --with-deps
+
+  # ============================================================
+  # Code Generation
+  # ============================================================
+
+  licenses:generate:
+    desc: "Generate frontend license report"
+    deps: [install]
+    cmds:
+      - node scripts/generate-licenses.js
diff --git a/AGENTS.md b/AGENTS.md
index 0e46552a21..6fe3cacc99 100644
--- a/AGENTS.md
+++ b/AGENTS.md
@@ -2,18 +2,42 @@
 
 This file provides guidance to AI Agents when working with code in this repository.
 
+## Taskfile (Recommended)
+
+This project uses [Task](https://taskfile.dev/) as a unified command runner. All build, dev, test, lint, and docker commands can be run from the repo root via `task <command>`. Run `task --list` to see all available commands.
+
+### Quick Reference
+- `task install` — install all dependencies
+- `task dev` — start backend + frontend concurrently
+- `task dev:all` — start backend + frontend + engine concurrently
+- `task build` — build all components
+- `task test` — run all tests (backend + frontend + engine)
+- `task lint` — run all linters
+- `task format` — auto-fix formatting across all components
+- `task check` — full quality gate (lint + typecheck + test)
+- `task clean` — clean all build artifacts
+- `task docker:build` — build standard Docker image
+- `task docker:up` — start Docker compose stack
+
 ## Common Development Commands
 
 ### Build and Test
-- **Build project**: `./gradlew clean build`
-- **Run locally**: `./gradlew bootRun`
-- **Full test suite**: `./test.sh` (builds all Docker variants and runs comprehensive tests)
-- **Code formatting**: `./gradlew spotlessApply` (runs automatically before compilation)
+- **Build project**: `task build`
+- **Run backend locally**: `task backend:dev`
+- **Run all tests**: `task test` (or individually: `task backend:test`, `task frontend:test`, `task engine:test`)
+- **Docker integration tests**: `./test.sh` (builds all Docker variants and runs comprehensive tests)
+- **Code formatting**: `task format` (or `task backend:format` for Java only)
+- **Full quality gate**: `task check` (runs lint + typecheck + test across all components)
+
+After modifying any files in the project, you must run the relevant `task check` command that covers that area of the code. For example, when editing frontend files run `task frontend:check`; for Python engine files run `task engine:check`; for Java backend files run `task backend:check`.
 
 ### Docker Development
-- **Build ultra-lite**: `docker build -t stirlingtools/stirling-pdf:latest-ultra-lite -f ./Dockerfile.ultra-lite .`
-- **Build standard**: `docker build -t stirlingtools/stirling-pdf:latest -f ./Dockerfile .`
-- **Build fat version**: `docker build -t stirlingtools/stirling-pdf:latest-fat -f ./Dockerfile.fat .`
+- **Build standard**: `task docker:build` (or `docker build -t stirling-pdf -f docker/embedded/Dockerfile .`)
+- **Build fat version**: `task docker:build:fat`
+- **Build ultra-lite**: `task docker:build:ultra-lite`
+- **Start compose stack**: `task docker:up` (or `task docker:up:fat`, `task docker:up:ultra-lite`)
+- **Stop compose stack**: `task docker:down`
+- **View logs**: `task docker:logs`
 - **Example compose files**: Located in `exampleYmlFiles/` directory
 
 ### Security Mode Development
@@ -23,20 +47,22 @@ Set `DOCKER_ENABLE_SECURITY=true` environment variable to enable security featur
 Development for the AI engine happens in the `engine/` folder. The frontend calls the Python via Java as a proxy.
 
 - Follow the engine-specific guidance in [engine/AGENTS.md](engine/AGENTS.md) for Python architecture, code style, and AI usage.
-- Use Makefile commands for Python work:
-  - From `engine/`: `make check` to lint, type-check, test, etc. and `make fix` to fix easily fixable linting and formatting issues.
-- The project structure is defined in `engine/pyproject.toml`. Any new dependencies should be listed there, followed by running `make install`.
+- Use Task commands from the repo root:
+  - `task engine:check` — lint, type-check, test
+  - `task engine:fix` — auto-fix linting and formatting
+  - `task engine:install` — install dependencies
+- The project structure is defined in `engine/pyproject.toml`. Any new dependencies should be listed there, followed by running `task engine:install`.
 
 ### Frontend Development
-- **Frontend dev server**: `cd frontend && npm run dev` (requires backend on localhost:8080)
+- **Frontend dev server**: `task frontend:dev` — requires backend on localhost:8080
 - **Tech Stack**: Vite + React + TypeScript + Mantine UI + TailwindCSS
 - **Proxy Configuration**: Vite proxies `/api/*` calls to backend (localhost:8080)
 - **Build Process**: DO NOT run build scripts manually - builds are handled by CI/CD pipelines
-- **Package Installation**: DO NOT run npm install commands - package management handled separately
+- **Package Installation**: `task frontend:install`
 - **Deployment Options**:
-  - **Desktop App**: `npm run tauri-build` (native desktop application)
-  - **Web Server**: `npm run build` then serve dist/ folder
-  - **Development**: `npm run tauri-dev` for desktop dev mode
+  - **Desktop App**: `task desktop:build`
+  - **Web Server**: `task frontend:build` then serve dist/ folder
+  - **Development**: `task desktop:dev` for desktop dev mode
 
 #### Environment Variables
 - All `VITE_*` variables must be declared in the appropriate example file:
@@ -44,8 +70,8 @@ Development for the AI engine happens in the `engine/` folder. The frontend call
   - `frontend/config/.env.saas.example` — SaaS-only vars
   - `frontend/config/.env.desktop.example` — desktop (Tauri)-only vars
 - Never use `|| 'hardcoded-fallback'` inline — put defaults in the example files
-- `npm run prep` / `prep:saas` / `prep:desktop` auto-create the env files from examples on first run, and error if any required keys are missing
-- These prep scripts run automatically at the start of all `dev*`, `build*`, and `tauri*` commands
+- `task frontend:prepare` / `prepare:saas` / `prepare:desktop` auto-create the env files from examples on first run, and error if any required keys are missing
+- Prepare runs automatically as a dependency of all `dev*`, `build*`, and `desktop*` tasks
 - See `frontend/README.md#environment-variables` for full documentation
 
 #### Import Paths - CRITICAL
@@ -299,15 +325,17 @@ The frontend is organized with a clear separation of concerns:
 
 ## Development Workflow
 
-1. **Local Development**:
-   - Backend: `./gradlew bootRun` (runs on localhost:8080)
-   - Frontend: `cd frontend && npm run dev` (runs on localhost:5173, proxies to backend)
-2. **Docker Testing**: Use `./test.sh` before submitting PRs
-3. **Code Style**: Spotless enforces Google Java Format automatically
-4. **Translations**:
+1. **Local Development** (using Taskfile):
+   - Backend + frontend: `task dev`
+   - All services (including AI engine): `task dev:all`
+   - Or individually: `task backend:dev` (localhost:8080), `task frontend:dev` (localhost:5173), `task engine:dev` (localhost:5001)
+2. **Quality Gate**: Run `task check` before submitting PRs
+3. **Docker Testing**: Use `./test.sh` for full Docker integration tests
+4. **Code Style**: Spotless enforces Google Java Format automatically (`task backend:format`)
+5. **Translations**:
    - Backend: Use helper scripts in `/scripts` for multi-language updates
    - Frontend: Update JSON files in `frontend/public/locales/` or use conversion script
-5. **Documentation**: API docs auto-generated and available at `/swagger-ui/index.html`
+6. **Documentation**: API docs auto-generated and available at `/swagger-ui/index.html`
 
 ## Frontend Architecture Status
 
diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md
index d9828c4096..79eb43f645 100644
--- a/CONTRIBUTING.md
+++ b/CONTRIBUTING.md
@@ -15,6 +15,19 @@ Before you start working on an issue, please comment on (or create) the issue an
 Once you have been assigned an issue, you can start working on it. When you are ready to submit your changes, open a pull request.
 For a detailed pull request tutorial, see [this guide](https://www.digitalocean.com/community/tutorials/how-to-create-a-pull-request-on-github).
 
+## Development Quick Start
+
+This project uses [Task](https://taskfile.dev/) as a unified command runner. After cloning:
+
+1. Install the `task` CLI: https://taskfile.dev/installation/
+2. Run `task install` to install all dependencies
+3. Run `task dev` to start backend + frontend
+4. Run `task check` before submitting a PR
+
+Run `task --list` to see all available commands.
+
+## Pull Request Guidelines
+
 Please make sure your Pull Request adheres to the following guidelines:
 
 - Use the PR template provided.
@@ -39,9 +52,10 @@ If, at any point in time, you have a question, please feel free to ask in the sa
 
 ## Developer Documentation
 
-For technical guides, setup instructions, and development resources, please see our [Developer Documentation](devGuide/) which includes:
+For technical guides, setup instructions, and development resources:
 
-- [Developer Guide](devGuide/DeveloperGuide.md) - Main setup and architecture guide
+- [Developer Guide](DeveloperGuide.md) - Main setup and architecture guide
+- [Taskfile.yml](Taskfile.yml) - Unified task runner for all build/dev/test/lint commands
 - [Exception Handling Guide](devGuide/EXCEPTION_HANDLING_GUIDE.md) - Error handling patterns and i18n
 - [Translation Guide](devGuide/HowToAddNewLanguage.md) - Adding new languages
 - And more in the [devGuide folder](devGuide/)
diff --git a/DeveloperGuide.md b/DeveloperGuide.md
index d67429437a..fdfab20c5e 100644
--- a/DeveloperGuide.md
+++ b/DeveloperGuide.md
@@ -42,11 +42,13 @@ This guide focuses on developing for Stirling 2.0, including both the React fron
 
 ### Prerequisites
 
+- [Task](https://taskfile.dev/installation/) — unified command runner (recommended)
 - Docker
 - Git
 - Java JDK 21 or later (JDK 25 recommended)
 - Node.js 18+ and npm (required for frontend development)
 - Gradle 7.0 or later (Included within the repo)
+- [uv](https://docs.astral.sh/uv/) — Python package manager (required for engine development)
 - Rust and Cargo (required for Tauri desktop app development)
 - Tauri CLI (install with `cargo install tauri-cli`)
 
@@ -82,13 +84,29 @@ For local testing, you should generally be testing the full 'Security' version o
 5. **Frontend Setup (Required for Stirling 2.0)**
    Navigate to the frontend directory and install dependencies using npm.
 
+### Verify Setup
+
+Run `task install` to install all project dependencies (frontend npm packages, engine Python packages). Gradle manages its own dependencies automatically. Then run `task check` to verify everything builds and passes.
+
 ## 4. Stirling 2.0 Development Workflow
 
+### Using Taskfile (Recommended)
+
+The fastest way to start developing:
+
+1. **Start developing**: `task dev` (runs backend + frontend concurrently — Ctrl+C to stop)
+2. **Or start services individually** in separate terminals:
+   - `task backend:dev` — Spring Boot on localhost:8080
+   - `task frontend:dev` — Vite on localhost:5173
+   - `task engine:dev` — FastAPI on localhost:5001
+
+Run `task --list` to see all available commands.
+
 ### Frontend Development (React)
 The frontend is a React SPA that runs independently during development:
 
-1. **Start the backend**: Run the Spring Boot application (serves API endpoints on localhost:8080)
-2. **Start the frontend dev server**: Navigate to the frontend directory and run the development server (serves UI on localhost:5173)
+1. **Start the backend**: `task backend:dev` (serves API endpoints on localhost:8080)
+2. **Start the frontend dev server**: `task frontend:dev` (serves UI on localhost:5173)
 3. **Development flow**: The Vite dev server automatically proxies API calls to the backend
 
 ### File Storage Architecture
@@ -99,7 +117,10 @@ Stirling 2.0 uses client-side file storage:
 
 ### Tauri Desktop App Development
 Stirling-PDF can be packaged as a cross-platform desktop application using Tauri with PDF file association support and bundled JRE.
-See [the frontend README](frontend/README.md#tauri) for build instructions.
+
+Using Taskfile: `task desktop:dev` (development) or `task desktop:build` (production build).
+
+See [the frontend README](frontend/README.md#tauri) for detailed build instructions.
 
 ## 5. Project Structure
 
@@ -187,7 +208,7 @@ services:
         limits:
           memory: 4G
     healthcheck:
-      test: ["CMD-SHELL", "curl -f http://localhost:8080/api/v1/info/status | grep -q 'UP' && curl -fL http://localhost:8080/ | grep -q 'Please sign in'"]
+      test: ["CMD-SHELL", "curl -f http://localhost:8080$${SYSTEM_ROOTURIPATH:-''}/api/v1/info/status | grep -q 'UP' && curl -fL http://localhost:8080/ | grep -q 'Please sign in'"]
       interval: 5s
       timeout: 10s
       retries: 16
@@ -222,6 +243,20 @@ docker-compose -f exampleYmlFiles/docker-compose-latest-security.yml up
 
 ### Building Docker Images
 
+#### Using Taskfile (Recommended)
+
+```bash
+task docker:build            # standard image
+task docker:build:fat        # fat image (all features)
+task docker:build:ultra-lite # ultra-lite image
+task docker:up               # start standard compose stack
+task docker:up:fat           # start fat compose stack
+task docker:down             # stop all stacks
+task docker:logs             # tail logs
+```
+
+#### Manual Docker Builds
+
 Stirling-PDF uses different Docker images for various configurations. The build process is controlled by environment variables and uses specific Dockerfile variants. Here's how to build the Docker images:
 
 1. Set the security environment variable:
@@ -230,10 +265,10 @@ Stirling-PDF uses different Docker images for various configurations. The build
    export DISABLE_ADDITIONAL_FEATURES=true  # or false for to enable login and security features for builds
    ```
 
-2. Build the project with Gradle:
+2. Build the project:
 
    ```bash
-   ./gradlew clean build
+   task backend:build
    ```
 
 3. Build the Docker images:
@@ -261,9 +296,18 @@ Note: The `--no-cache` and `--pull` flags ensure that the build process uses the
 
 ## 7. Testing
 
+### Quick Testing with Taskfile
+
+Run all unit/integration tests across all components:
+
+```bash
+task test    # run all tests (backend + frontend + engine)
+task check   # full quality gate: lint + typecheck + test
+```
+
 ### Comprehensive Testing Script
 
-Stirling-PDF provides a `test.sh` script in the root directory. This script builds all versions of Stirling-PDF, checks that each version works, and runs Cucumber tests. It's recommended to run this script before submitting a final pull request.
+Stirling-PDF also provides a `test.sh` script in the root directory for Docker integration tests. This script builds all versions of Stirling-PDF, checks that each version works, and runs Cucumber tests. It's recommended to run this script before submitting a final pull request.
 
 To run the test script:
 
@@ -289,10 +333,11 @@ Note: The `test.sh` script will run automatically when you raise a PR. However,
 
 For React frontend development:
 
-1. Start the backend: Run the Spring Boot application to serve API endpoints on localhost:8080
-2. Start the frontend dev server: Navigate to the frontend directory and run the development server on localhost:5173
+1. Start the backend: `task backend:dev` (serves API endpoints on localhost:8080)
+2. Start the frontend dev server: `task frontend:dev` (serves UI on localhost:5173)
 3. The Vite dev server automatically proxies API calls to the backend
-4. Test React components, UI interactions, and IndexedDB file operations using browser developer tools
+4. Run frontend tests: `task frontend:test` (or `task frontend:test:watch` for watch mode)
+5. Test React components, UI interactions, and IndexedDB file operations using browser developer tools
 
 ### Local Testing (Java and UI Components)
 
@@ -308,7 +353,7 @@ To run Stirling-PDF locally:
 1. Compile and run the project using built-in IDE methods or by running:
 
    ```bash
-   ./gradlew bootRun
+   task backend:dev
    ```
 
 2. Access the application at `http://localhost:8080` in your web browser.
@@ -329,10 +374,11 @@ Important notes:
 2. Create a new branch for your feature or bug fix.
 3. Make your changes and commit them with clear, descriptive messages and ensure any documentation is updated related to your changes.
 4. Test your changes thoroughly in the Docker environment.
-5. Run the `test.sh` script to ensure all versions build correctly and pass the Cucumber tests:
+5. Run the quality gate and integration tests:
 
    ```bash
-   ./test.sh
+   task check   # lint + typecheck + test across all components
+   ./test.sh    # Docker integration tests (builds all variants + Cucumber)
    ```
 
 6. Push your changes to your fork.
diff --git a/LICENSE b/LICENSE
index e7a8034e41..ea74278a4e 100644
--- a/LICENSE
+++ b/LICENSE
@@ -14,6 +14,8 @@ if that directory exists, is licensed under the license defined in "frontend/src
 if that directory exists, is licensed under the license defined in "frontend/src/desktop/LICENSE".
 * All content that resides under the "frontend/src/saas/" directory of this repository,
 if that directory exists, is licensed under the license defined in "frontend/src/saas/LICENSE".
+* All content that resides under the "frontend/src/prototypes/" directory of this repository,
+if that directory exists, is licensed under the license defined in "frontend/src/prototypes/LICENSE".
 * Content outside of the above mentioned directories or restrictions above is
 available under the MIT License as defined below.
 
diff --git a/README.md b/README.md
index d9e0d5a418..9329b20eed 100644
--- a/README.md
+++ b/README.md
@@ -60,7 +60,7 @@ For full installation options (including desktop and Kubernetes), see our [Docum
 
 We welcome contributions! Please see [CONTRIBUTING.md](CONTRIBUTING.md) for guidelines.
 
-For development setup, see the [Developer Guide](DeveloperGuide.md).
+This project uses [Task](https://taskfile.dev/) as a unified command runner for all build, dev, and test commands. Run `task install` to get started, or see the [Developer Guide](DeveloperGuide.md) for full details.
 
 For adding translations, see the [Translation Guide](devGuide/HowToAddNewLanguage.md).
 
diff --git a/Taskfile.yml b/Taskfile.yml
new file mode 100644
index 0000000000..4840a82697
--- /dev/null
+++ b/Taskfile.yml
@@ -0,0 +1,128 @@
+version: '3'
+
+output: prefixed
+
+includes:
+  backend:
+    taskfile: .taskfiles/backend.yml
+    dir: .
+  frontend:
+    taskfile: .taskfiles/frontend.yml
+    dir: frontend
+  engine:
+    taskfile: .taskfiles/engine.yml
+    dir: engine
+  docker:
+    taskfile: .taskfiles/docker.yml
+    dir: .
+  desktop:
+    taskfile: .taskfiles/desktop.yml
+    dir: frontend
+
+tasks:
+  # ============================================================
+  # Setup & Prerequisites
+  # ============================================================
+
+  install:
+    desc: "Install all project dependencies"
+    cmds:
+      - task: frontend:install
+      - task: engine:install
+
+  # ============================================================
+  # Development
+  # ============================================================
+
+  dev:
+    desc: "Start backend + frontend concurrently"
+    deps:
+      - backend:dev
+      - frontend:dev
+
+  dev:all:
+    desc: "Start backend + frontend + engine concurrently"
+    deps:
+      - backend:dev
+      - frontend:dev:prototypes
+      - engine:dev
+
+  # ============================================================
+  # Build
+  # ============================================================
+
+  build:
+    desc: "Build all components"
+    cmds:
+      - task: backend:build
+      - task: frontend:build
+
+  # ============================================================
+  # Test
+  # ============================================================
+
+  test:
+    desc: "Run ALL tests (backend + frontend + engine)"
+    cmds:
+      - task: backend:test
+      - task: frontend:test
+      - task: engine:test
+
+  # ============================================================
+  # Lint & Format
+  # ============================================================
+
+  lint:
+    desc: "Run all linters"
+    cmds:
+      - task: frontend:lint
+      - task: engine:lint
+
+  fix:
+    desc: "Auto-fix all components"
+    cmds:
+      - task: backend:fix
+      - task: frontend:fix
+      - task: engine:fix
+
+  format:
+    desc: "Auto-fix formatting across all components"
+    cmds:
+      - task: backend:format
+      - task: frontend:format
+      - task: engine:format
+
+  format:check:
+    desc: "Check formatting across all components"
+    cmds:
+      - task: backend:format:check
+      - task: frontend:format:check
+      - task: engine:format:check
+
+  # ============================================================
+  # Quality Gate
+  # ============================================================
+
+  check:
+    desc: "Quick quality gate for local development"
+    cmds:
+      - task: backend:check
+      - task: frontend:check
+      - task: engine:check
+
+  check:all:
+    desc: "Full CI quality gate"
+    cmds:
+      - task: backend:check
+      - task: frontend:check:all
+      - task: engine:check
+
+  # ============================================================
+  # Clean
+  # ============================================================
+
+  clean:
+    desc: "Clean all build artifacts"
+    cmds:
+      - task: backend:clean
+      - task: engine:clean
diff --git a/app/common/build.gradle b/app/common/build.gradle
index e19b36d466..41d17273f5 100644
--- a/app/common/build.gradle
+++ b/app/common/build.gradle
@@ -7,6 +7,8 @@ spotless {
         target 'src/**/java/**/*.java'
         targetExclude 'src/main/java/org/apache/**'
         googleJavaFormat(googleJavaFormatVersion).aosp().reorderImports(false)
+        // google-java-format 1.28.0 bundles Guava 32.x which crashes Spotless lint on JDK 24/25
+        suppressLintsFor { setStep('google-java-format') }
 
         importOrder("java", "javax", "org", "com", "net", "io", "jakarta", "lombok", "me", "stirling")
         trimTrailingWhitespace()
@@ -27,10 +29,10 @@ spotless {
     }
 }
 dependencies {
-    api 'com.google.guava:guava:33.4.8-jre'
+    api 'com.google.guava:guava:33.5.0-jre'
     api 'org.springframework.boot:spring-boot-starter-webmvc'
     api 'org.springframework.boot:spring-boot-starter-aspectj'
-    api 'com.googlecode.owasp-java-html-sanitizer:owasp-java-html-sanitizer:20260102.1'
+    api 'com.googlecode.owasp-java-html-sanitizer:owasp-java-html-sanitizer:20260313.1'
     api 'com.fathzer:javaluator:3.0.6'
     api 'com.posthog.java:posthog:1.2.0'
     api 'org.apache.commons:commons-lang3:3.20.0'
@@ -43,7 +45,7 @@ dependencies {
     api 'com.github.junrar:junrar:7.5.8' // RAR archive support for CBR files
     api 'jakarta.servlet:jakarta.servlet-api:6.1.0'
     api 'org.snakeyaml:snakeyaml-engine:3.0.1'
-    api "org.springdoc:springdoc-openapi-starter-webmvc-ui:3.0.1"
+    api "org.springdoc:springdoc-openapi-starter-webmvc-ui:3.0.2"
     // Simple Java Mail for EML/MSG parsing (replaces direct Angus Mail usage)
     api 'org.simplejavamail:simple-java-mail:8.12.6'
     api 'org.simplejavamail:outlook-module:8.12.6' // MSG file support
diff --git a/app/common/src/main/java/stirling/software/common/model/ApplicationProperties.java b/app/common/src/main/java/stirling/software/common/model/ApplicationProperties.java
index fa36998e7f..dba7deca22 100644
--- a/app/common/src/main/java/stirling/software/common/model/ApplicationProperties.java
+++ b/app/common/src/main/java/stirling/software/common/model/ApplicationProperties.java
@@ -75,6 +75,7 @@ public class ApplicationProperties {
     private AutoPipeline autoPipeline = new AutoPipeline();
     private ProcessExecutor processExecutor = new ProcessExecutor();
     private PdfEditor pdfEditor = new PdfEditor();
+    private AiEngine aiEngine = new AiEngine();
 
     @Bean
     public PropertySource<?> dynamicYamlPropertySource(ConfigurableEnvironment environment)
@@ -231,6 +232,13 @@ public class ApplicationProperties {
         }
     }
 
+    @Data
+    public static class AiEngine {
+        private boolean enabled = false;
+        private String url = "http://localhost:5001";
+        private int timeoutSeconds = 120;
+    }
+
     @Data
     public static class Legal {
         private String termsAndConditions;
diff --git a/app/common/src/main/java/stirling/software/common/service/FileStorage.java b/app/common/src/main/java/stirling/software/common/service/FileStorage.java
index 46b4a57082..8b0f3a53a2 100644
--- a/app/common/src/main/java/stirling/software/common/service/FileStorage.java
+++ b/app/common/src/main/java/stirling/software/common/service/FileStorage.java
@@ -1,8 +1,10 @@
 package stirling.software.common.service;
 
 import java.io.BufferedInputStream;
+import java.io.BufferedOutputStream;
 import java.io.IOException;
 import java.io.InputStream;
+import java.io.OutputStream;
 import java.nio.file.Files;
 import java.nio.file.Path;
 import java.util.UUID;
@@ -10,6 +12,7 @@ import java.util.UUID;
 import org.springframework.beans.factory.annotation.Value;
 import org.springframework.stereotype.Service;
 import org.springframework.web.multipart.MultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import lombok.RequiredArgsConstructor;
 import lombok.extern.slf4j.Slf4j;
@@ -143,6 +146,24 @@ public class FileStorage {
         return new StoredFile(fileId, size);
     }
 
+    public String storeFromStreamingBody(StreamingResponseBody body, String originalName)
+            throws IOException {
+        String fileId = generateFileId();
+        Path filePath = getFilePath(fileId);
+        Files.createDirectories(filePath.getParent());
+        boolean success = false;
+        try (OutputStream os = new BufferedOutputStream(Files.newOutputStream(filePath))) {
+            body.writeTo(os);
+            success = true;
+        } finally {
+            if (!success) {
+                Files.deleteIfExists(filePath);
+            }
+        }
+        log.debug("Stored StreamingResponseBody with ID: {}", fileId);
+        return fileId;
+    }
+
     /**
      * Delete a file by its ID
      *
diff --git a/app/common/src/main/java/stirling/software/common/service/InternalApiClient.java b/app/common/src/main/java/stirling/software/common/service/InternalApiClient.java
new file mode 100644
index 0000000000..ba53e7fdef
--- /dev/null
+++ b/app/common/src/main/java/stirling/software/common/service/InternalApiClient.java
@@ -0,0 +1,184 @@
+package stirling.software.common.service;
+
+import java.io.IOException;
+import java.io.UncheckedIOException;
+import java.net.URLDecoder;
+import java.nio.charset.StandardCharsets;
+import java.nio.file.Files;
+import java.util.regex.Pattern;
+
+import org.springframework.beans.factory.annotation.Autowired;
+import org.springframework.core.env.Environment;
+import org.springframework.core.io.FileSystemResource;
+import org.springframework.core.io.Resource;
+import org.springframework.http.*;
+import org.springframework.stereotype.Service;
+import org.springframework.util.MultiValueMap;
+import org.springframework.web.client.RequestCallback;
+import org.springframework.web.client.RestTemplate;
+
+import jakarta.servlet.ServletContext;
+
+import lombok.extern.slf4j.Slf4j;
+
+import stirling.software.common.model.enumeration.Role;
+import stirling.software.common.util.TempFile;
+import stirling.software.common.util.TempFileManager;
+
+/**
+ * Dispatches HTTP POST requests to internal Stirling API endpoints via loopback. Used by
+ * PipelineProcessor and AiWorkflowService to execute tool operations programmatically without
+ * leaving the JVM network stack.
+ */
+@Service
+@Slf4j
+public class InternalApiClient {
+
+    // Allowlist for internal dispatch. Matches a fixed namespace prefix,
+    // but rejects traversal (..), URL-encoding (%), query/fragment, backslashes, and any other
+    // character that could alter the resolved endpoint on the local Spring server.
+    private static final Pattern ALLOWED_ENDPOINT_PATH =
+            Pattern.compile("^/api/v1/(general|misc|security|convert|filter)(/[A-Za-z0-9_-]+)+$");
+
+    private final ServletContext servletContext;
+    private final UserServiceInterface userService;
+    private final TempFileManager tempFileManager;
+    private final Environment environment;
+
+    public InternalApiClient(
+            ServletContext servletContext,
+            @Autowired(required = false) UserServiceInterface userService,
+            TempFileManager tempFileManager,
+            Environment environment) {
+        this.servletContext = servletContext;
+        this.userService = userService;
+        this.tempFileManager = tempFileManager;
+        this.environment = environment;
+    }
+
+    /**
+     * POST to an internal API endpoint. The endpointPath must start with one of the allowed
+     * prefixes (e.g. {@code /api/v1/misc/compress-pdf}).
+     *
+     * @param endpointPath API path (e.g. {@code /api/v1/general/rotate-pdf})
+     * @param body multipart form body (fileInput + parameters)
+     * @return response with the result file as a {@link TempFileResource} body
+     */
+    public ResponseEntity<Resource> post(String endpointPath, MultiValueMap<String, Object> body) {
+        validateUrl(endpointPath);
+        String url = getBaseUrl() + endpointPath;
+
+        RestTemplate restTemplate = new RestTemplate();
+        HttpHeaders headers = new HttpHeaders();
+        String apiKey = getApiKeyForUser();
+        if (apiKey != null && !apiKey.isEmpty()) {
+            headers.add("X-API-KEY", apiKey);
+        }
+
+        HttpEntity<MultiValueMap<String, Object>> entity = new HttpEntity<>(body, headers);
+        RequestCallback requestCallback = restTemplate.httpEntityCallback(entity, Resource.class);
+
+        return restTemplate.execute(
+                url,
+                HttpMethod.POST,
+                requestCallback,
+                response -> {
+                    try {
+                        TempFile tempFile = tempFileManager.createManagedTempFile("internal-api");
+                        Files.copy(
+                                response.getBody(),
+                                tempFile.getPath(),
+                                java.nio.file.StandardCopyOption.REPLACE_EXISTING);
+                        String filename = extractFilename(response.getHeaders());
+                        TempFileResource resource = new TempFileResource(tempFile, filename);
+                        return ResponseEntity.status(response.getStatusCode())
+                                .headers(response.getHeaders())
+                                .body(resource);
+                    } catch (IOException e) {
+                        throw new UncheckedIOException(e);
+                    }
+                });
+    }
+
+    /**
+     * Extract the filename from a response's {@code Content-Disposition} header. Returns {@code
+     * null} if the header is missing or has no filename.
+     */
+    private static String extractFilename(HttpHeaders headers) {
+        String contentDisposition = headers.getFirst(HttpHeaders.CONTENT_DISPOSITION);
+        if (contentDisposition == null || contentDisposition.isBlank()) {
+            return null;
+        }
+        for (String part : contentDisposition.split(";")) {
+            String trimmed = part.trim();
+            if (trimmed.startsWith("filename")) {
+                String[] kv = trimmed.split("=", 2);
+                if (kv.length != 2) {
+                    continue;
+                }
+                String value = kv[1].trim().replace("\"", "");
+                return URLDecoder.decode(value, StandardCharsets.UTF_8);
+            }
+        }
+        return null;
+    }
+
+    private String getBaseUrl() {
+        // Resolve the port lazily so desktop mode (server.port=0, OS-assigned) dispatches to the
+        // actual bound port. Spring publishes local.server.port once the web server is up; fall
+        // back to the configured server.port for early calls (tests, non-web contexts).
+        String port = environment.getProperty("local.server.port");
+        if (port == null) {
+            port = environment.getProperty("server.port", "8080");
+        }
+        return "http://localhost:" + port + servletContext.getContextPath();
+    }
+
+    private String getApiKeyForUser() {
+        if (userService == null) return "";
+        String username = userService.getCurrentUsername();
+        if (username != null && !username.equals("anonymousUser")) {
+            return userService.getApiKeyForUser(username);
+        }
+        return userService.getApiKeyForUser(Role.INTERNAL_API_USER.getRoleId());
+    }
+
+    private void validateUrl(String endpointPath) {
+        if (endpointPath == null || !ALLOWED_ENDPOINT_PATH.matcher(endpointPath).matches()) {
+            log.warn("Blocked internal API request to disallowed path: {}", endpointPath);
+            throw new SecurityException(
+                    "Internal API dispatch not permitted for endpoint: " + endpointPath);
+        }
+    }
+
+    /**
+     * A {@link FileSystemResource} that holds a reference to its backing {@link TempFile}.
+     *
+     * <p>If a display filename is supplied (typically parsed from the upstream response's {@code
+     * Content-Disposition} header), it is returned from {@link #getFilename()} instead of the
+     * underlying temp file's path-based name.
+     */
+    public static class TempFileResource extends FileSystemResource {
+        private final TempFile tempFile;
+        private final String displayFilename;
+
+        public TempFileResource(TempFile tempFile) {
+            this(tempFile, null);
+        }
+
+        public TempFileResource(TempFile tempFile, String displayFilename) {
+            super(tempFile.getFile());
+            this.tempFile = tempFile;
+            this.displayFilename = displayFilename;
+        }
+
+        public TempFile getTempFile() {
+            return tempFile;
+        }
+
+        @Override
+        public String getFilename() {
+            return displayFilename != null ? displayFilename : super.getFilename();
+        }
+    }
+}
diff --git a/app/common/src/main/java/stirling/software/common/service/JobExecutorService.java b/app/common/src/main/java/stirling/software/common/service/JobExecutorService.java
index 459e77c0fa..dd53eef3c1 100644
--- a/app/common/src/main/java/stirling/software/common/service/JobExecutorService.java
+++ b/app/common/src/main/java/stirling/software/common/service/JobExecutorService.java
@@ -16,6 +16,7 @@ import org.springframework.http.MediaType;
 import org.springframework.http.ResponseEntity;
 import org.springframework.stereotype.Service;
 import org.springframework.web.multipart.MultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import jakarta.servlet.http.HttpServletRequest;
 
@@ -305,33 +306,21 @@ public class JobExecutorService {
                 Object body = response.getBody();
 
                 if (body instanceof byte[]) {
-                    // Extract filename from content-disposition header if available
-                    String filename = "result.pdf";
-                    String contentType = MediaType.APPLICATION_PDF_VALUE;
+                    String filename = extractResponseFilename(response);
+                    String contentType = extractResponseContentType(response);
 
-                    if (response.getHeaders().getContentDisposition() != null) {
-                        String disposition =
-                                response.getHeaders().getContentDisposition().toString();
-                        if (disposition.contains("filename=")) {
-                            filename =
-                                    disposition.substring(
-                                            disposition.indexOf("filename=") + 9,
-                                            disposition.lastIndexOf('"'));
-                        }
-                    }
-
-                    MediaType mediaType = response.getHeaders().getContentType();
-
-                    if (mediaType != null) {
-                        contentType = mediaType.toString();
-                    }
-
-                    // Store byte array directly to disk
                     String fileId = fileStorage.storeBytes((byte[]) body, filename);
                     taskManager.setFileResult(jobId, fileId, filename, contentType);
                     log.debug("Stored ResponseEntity<byte[]> result with fileId: {}", fileId);
+                } else if (body instanceof StreamingResponseBody streamingBody) {
+                    String filename = extractResponseFilename(response);
+                    String contentType = extractResponseContentType(response);
 
-                    // Let the GC handle the memory naturally
+                    String fileId = fileStorage.storeFromStreamingBody(streamingBody, filename);
+                    taskManager.setFileResult(jobId, fileId, filename, contentType);
+                    log.debug(
+                            "Stored ResponseEntity<StreamingResponseBody> result with fileId: {}",
+                            fileId);
                 } else {
                     // Check if the response body contains a fileId
                     if (body != null && body.toString().contains("fileId")) {
@@ -481,6 +470,21 @@ public class JobExecutorService {
         }
     }
 
+    private static String extractResponseFilename(ResponseEntity<?> response) {
+        if (response.getHeaders().getContentDisposition() != null) {
+            String filename = response.getHeaders().getContentDisposition().getFilename();
+            if (filename != null && !filename.isEmpty()) {
+                return filename;
+            }
+        }
+        return "result.pdf";
+    }
+
+    private static String extractResponseContentType(ResponseEntity<?> response) {
+        MediaType mediaType = response.getHeaders().getContentType();
+        return mediaType != null ? mediaType.toString() : MediaType.APPLICATION_PDF_VALUE;
+    }
+
     /**
      * Parse session timeout string (e.g., "30m", "1h") to milliseconds
      *
diff --git a/app/common/src/main/java/stirling/software/common/service/JobQueue.java b/app/common/src/main/java/stirling/software/common/service/JobQueue.java
index 595cc6e395..28d94baced 100644
--- a/app/common/src/main/java/stirling/software/common/service/JobQueue.java
+++ b/app/common/src/main/java/stirling/software/common/service/JobQueue.java
@@ -401,7 +401,7 @@ public class JobQueue implements SmartLifecycle {
      * @throws Exception If there is an execution error
      */
     private <T> T executeWithTimeout(Supplier<T> supplier, long timeoutMs) throws Exception {
-        CompletableFuture<T> future = CompletableFuture.supplyAsync(supplier);
+        CompletableFuture<T> future = CompletableFuture.supplyAsync(supplier, jobExecutor);
 
         try {
             if (timeoutMs <= 0) {
diff --git a/app/common/src/main/java/stirling/software/common/service/PostHogService.java b/app/common/src/main/java/stirling/software/common/service/PostHogService.java
index 1ec3e87946..92093762fc 100644
--- a/app/common/src/main/java/stirling/software/common/service/PostHogService.java
+++ b/app/common/src/main/java/stirling/software/common/service/PostHogService.java
@@ -7,11 +7,8 @@ import java.lang.management.MemoryMXBean;
 import java.lang.management.OperatingSystemMXBean;
 import java.lang.management.RuntimeMXBean;
 import java.lang.management.ThreadMXBean;
-import java.net.InetAddress;
-import java.net.NetworkInterface;
 import java.nio.file.Files;
 import java.nio.file.Paths;
-import java.util.Enumeration;
 import java.util.HashMap;
 import java.util.Locale;
 import java.util.Map;
@@ -94,21 +91,12 @@ public class PostHogService {
             metrics.put("os_name", System.getProperty("os.name"));
             metrics.put("os_version", System.getProperty("os.version"));
             metrics.put("java_version", System.getProperty("java.version"));
-            metrics.put("user_name", System.getProperty("user.name"));
-            metrics.put("user_home", System.getProperty("user.home"));
-            metrics.put("user_dir", System.getProperty("user.dir"));
 
             // CPU and Memory
             metrics.put("cpu_cores", Runtime.getRuntime().availableProcessors());
             metrics.put("total_memory", Runtime.getRuntime().totalMemory());
             metrics.put("free_memory", Runtime.getRuntime().freeMemory());
 
-            // Network and Server Identity
-            InetAddress localHost = InetAddress.getLocalHost();
-            metrics.put("ip_address", localHost.getHostAddress());
-            metrics.put("hostname", localHost.getHostName());
-            metrics.put("mac_address", getMacAddress());
-
             // JVM info
             metrics.put("jvm_vendor", System.getProperty("java.vendor"));
             metrics.put("jvm_version", System.getProperty("java.vm.version"));
@@ -153,9 +141,6 @@ public class PostHogService {
                 metrics.put("gc_" + gcBean.getName() + "_time", gcBean.getCollectionTime());
             }
 
-            // Network interfaces
-            metrics.put("network_interfaces", getNetworkInterfacesInfo());
-
             // Docker detection and stats
             boolean isDocker = isRunningInDocker();
             if (isDocker) {
@@ -353,30 +338,6 @@ public class PostHogService {
                             .getProFeatures()
                             .getCustomMetadata()
                             .isAutoUpdateMetadata());
-            addIfNotEmpty(
-                    properties,
-                    "enterpriseEdition_customMetadata_author",
-                    applicationProperties
-                            .getPremium()
-                            .getProFeatures()
-                            .getCustomMetadata()
-                            .getAuthor());
-            addIfNotEmpty(
-                    properties,
-                    "enterpriseEdition_customMetadata_creator",
-                    applicationProperties
-                            .getPremium()
-                            .getProFeatures()
-                            .getCustomMetadata()
-                            .getCreator());
-            addIfNotEmpty(
-                    properties,
-                    "enterpriseEdition_customMetadata_producer",
-                    applicationProperties
-                            .getPremium()
-                            .getProFeatures()
-                            .getCustomMetadata()
-                            .getProducer());
         }
         // Capture AutoPipeline properties
         addIfNotEmpty(
@@ -386,39 +347,4 @@ public class PostHogService {
 
         return properties;
     }
-
-    private String getMacAddress() {
-        try {
-            Enumeration<NetworkInterface> networkInterfaces =
-                    NetworkInterface.getNetworkInterfaces();
-            while (networkInterfaces.hasMoreElements()) {
-                NetworkInterface ni = networkInterfaces.nextElement();
-                byte[] hardwareAddress = ni.getHardwareAddress();
-                if (hardwareAddress != null) {
-                    String[] hexadecimal = new String[hardwareAddress.length];
-                    for (int i = 0; i < hardwareAddress.length; i++) {
-                        hexadecimal[i] = String.format("%02X", hardwareAddress[i]);
-                    }
-                    return String.join("-", hexadecimal);
-                }
-            }
-        } catch (Exception e) {
-            // Handle exception
-        }
-        return "Unknown";
-    }
-
-    private Map<String, String> getNetworkInterfacesInfo() {
-        Map<String, String> interfacesInfo = new HashMap<>();
-        try {
-            Enumeration<NetworkInterface> nets = NetworkInterface.getNetworkInterfaces();
-            while (nets.hasMoreElements()) {
-                NetworkInterface netint = nets.nextElement();
-                interfacesInfo.put(netint.getName(), netint.getDisplayName());
-            }
-        } catch (Exception e) {
-            interfacesInfo.put("error", e.getMessage());
-        }
-        return interfacesInfo;
-    }
 }
diff --git a/app/common/src/main/java/stirling/software/common/service/ToolMetadataService.java b/app/common/src/main/java/stirling/software/common/service/ToolMetadataService.java
new file mode 100644
index 0000000000..662878b741
--- /dev/null
+++ b/app/common/src/main/java/stirling/software/common/service/ToolMetadataService.java
@@ -0,0 +1,18 @@
+package stirling.software.common.service;
+
+/** Provides metadata about tool endpoints for internal dispatch. */
+public interface ToolMetadataService {
+
+    /** Returns true if the given operation path accepts multiple input files. */
+    boolean isMultiInput(String operationPath);
+
+    /**
+     * Returns true when the endpoint's ZIP response is a transport for multiple typed results and
+     * should be unpacked: multi-output endpoints (Type:SIMO / Type:MIMO) and wrapper declarations
+     * such as {@code Output:ZIP-PDF} or {@code Output:IMAGE/ZIP}.
+     *
+     * <p>Returns false for a bare {@code Output:ZIP} (e.g. {@code get-attachments}), where the
+     * archive itself is the deliverable and should be kept packed.
+     */
+    boolean shouldUnpackZipResponse(String operationPath);
+}
diff --git a/app/common/src/main/java/stirling/software/common/service/UserServiceInterface.java b/app/common/src/main/java/stirling/software/common/service/UserServiceInterface.java
index 074f422000..9649696567 100644
--- a/app/common/src/main/java/stirling/software/common/service/UserServiceInterface.java
+++ b/app/common/src/main/java/stirling/software/common/service/UserServiceInterface.java
@@ -5,6 +5,8 @@ public interface UserServiceInterface {
 
     String getCurrentUsername();
 
+    String getCurrentUserApiKey();
+
     long getTotalUsersCount();
 
     boolean isCurrentUserAdmin();
diff --git a/app/common/src/main/java/stirling/software/common/util/FileMonitor.java b/app/common/src/main/java/stirling/software/common/util/FileMonitor.java
index 09caccdb50..dc0362b356 100644
--- a/app/common/src/main/java/stirling/software/common/util/FileMonitor.java
+++ b/app/common/src/main/java/stirling/software/common/util/FileMonitor.java
@@ -112,8 +112,6 @@ public class FileMonitor {
          All files observed changes in the last iteration will be considered as staging files.
          If those files are not modified in current iteration, they will be considered as ready for processing.
         */
-        stagingFiles = new HashSet<>(newlyDiscoveredFiles);
-        readyForProcessingFiles.clear();
 
         if (path2KeyMapping.isEmpty()) {
             log.warn("Not monitoring any directories; attempting to re-register root paths.");
@@ -129,8 +127,19 @@ public class FileMonitor {
             }
         }
 
-        WatchKey key;
-        while ((key = watchService.poll()) != null) {
+        // Skip expensive collection work when there is nothing to track
+        WatchKey firstKey = watchService.poll();
+        if (firstKey == null
+                && newlyDiscoveredFiles.isEmpty()
+                && readyForProcessingFiles.isEmpty()) {
+            return;
+        }
+
+        stagingFiles = new HashSet<>(newlyDiscoveredFiles);
+        readyForProcessingFiles.clear();
+
+        WatchKey key = firstKey;
+        while (key != null) {
             final Path watchingDir = (Path) key.watchable();
             key.pollEvents()
                     .forEach(
@@ -167,6 +176,7 @@ public class FileMonitor {
             if (!isKeyValid) { // key is invalid when the directory itself is no longer exists
                 path2KeyMapping.remove((Path) key.watchable());
             }
+            key = watchService.poll();
         }
         readyForProcessingFiles.addAll(stagingFiles);
     }
diff --git a/app/common/src/main/java/stirling/software/common/util/FileToPdf.java b/app/common/src/main/java/stirling/software/common/util/FileToPdf.java
index 3f8c3aa5c3..83bc0e35bc 100644
--- a/app/common/src/main/java/stirling/software/common/util/FileToPdf.java
+++ b/app/common/src/main/java/stirling/software/common/util/FileToPdf.java
@@ -1,6 +1,5 @@
 package stirling.software.common.util;
 
-import java.io.ByteArrayInputStream;
 import java.io.FileOutputStream;
 import java.io.IOException;
 import java.io.UncheckedIOException;
@@ -66,16 +65,7 @@ public class FileToPdf {
                         ProcessExecutor.getInstance(ProcessExecutor.Processes.WEASYPRINT)
                                 .runCommandWithOutputHandling(command);
 
-                byte[] pdfBytes = Files.readAllBytes(tempOutputFile.getPath());
-                try {
-                    return pdfBytes;
-                } catch (Exception e) {
-                    pdfBytes = Files.readAllBytes(tempOutputFile.getPath());
-                    if (pdfBytes.length < 1) {
-                        throw e;
-                    }
-                    return pdfBytes;
-                }
+                return Files.readAllBytes(tempOutputFile.getPath());
             } // tempInputFile auto-closed
         } // tempOutputFile auto-closed
     }
@@ -92,8 +82,7 @@ public class FileToPdf {
             throws IOException {
         try (TempDirectory tempUnzippedDir = new TempDirectory(tempFileManager)) {
             try (ZipInputStream zipIn =
-                    ZipSecurity.createHardenedInputStream(
-                            new ByteArrayInputStream(Files.readAllBytes(zipFilePath)))) {
+                    ZipSecurity.createHardenedInputStream(Files.newInputStream(zipFilePath))) {
                 ZipEntry entry = zipIn.getNextEntry();
                 while (entry != null) {
                     Path filePath =
diff --git a/app/common/src/main/java/stirling/software/common/util/FormUtils.java b/app/common/src/main/java/stirling/software/common/util/FormUtils.java
index c3b009efa7..2ae5ace9e9 100644
--- a/app/common/src/main/java/stirling/software/common/util/FormUtils.java
+++ b/app/common/src/main/java/stirling/software/common/util/FormUtils.java
@@ -629,11 +629,12 @@ public class FormUtils {
             }
             log.debug("Skipping form fill because document has no AcroForm");
             if (flatten) {
-                flattenEntireDocument(document, null);
+                flattenEntireDocument(document, null, false);
             }
             return;
         }
 
+        boolean valuesApplied = false;
         if (values != null && !values.isEmpty()) {
             acroForm.setCacheFields(true);
 
@@ -667,18 +668,26 @@ public class FormUtils {
                 Object rawValue = entry.getValue();
                 String value = rawValue == null ? null : Objects.toString(rawValue, null);
                 applyValueToField(field, value, strict);
+                valuesApplied = true;
             }
 
-            ensureAppearances(acroForm);
+            if (valuesApplied) {
+                ensureAppearances(acroForm);
+            }
         }
 
         repairWidgetGeometry(document, acroForm);
 
         if (flatten) {
-            flattenEntireDocument(document, acroForm);
+            flattenEntireDocument(document, acroForm, valuesApplied);
         }
     }
 
+    // Cap the fallback rendering DPI. This path only runs when acroForm.flatten()
+    // throws, and the goal is a readable flattened document — not print quality —
+    // so clamping avoids runaway memory/CPU on pathological inputs.
+    private static final int FLATTEN_FALLBACK_MAX_DPI = 200;
+
     private void flattenViaRendering(PDDocument document, PDAcroForm acroForm) throws IOException {
         if (document == null) {
             return;
@@ -704,28 +713,34 @@ public class FormUtils {
                 properties != null && properties.getSystem() != null
                         ? properties.getSystem().getMaxDPI()
                         : 300;
+        int effectiveDpi = Math.min(requestedDpi, FLATTEN_FALLBACK_MAX_DPI);
 
-        rebuildDocumentFromImages(document, renderer, requestedDpi);
+        rebuildDocumentFromImages(document, renderer, effectiveDpi);
     }
 
-    // note: this implementation suffers from:
-    // https://issues.apache.org/jira/browse/PDFBOX-5962
-    private void flattenEntireDocument(PDDocument document, PDAcroForm acroForm)
-            throws IOException {
-        if (document == null) {
+    // Use PDFBox's built-in field flattening which bakes form field values
+    // into the page content stream as static text/graphics, removing the
+    // interactive form structure but preserving all other document content
+    // (images, text, annotations, etc.) at full quality.
+    //
+    // Forcing appearance regeneration via setNeedAppearances(true) drives
+    // PDFBox into refreshAppearances inside flatten(), where it can hang on
+    // certain documents (PDFBOX-5962). We therefore only regenerate when we
+    // actually wrote new values, or when some widgets are missing appearance
+    // streams and would otherwise flatten blank.
+    private void flattenEntireDocument(
+            PDDocument document, PDAcroForm acroForm, boolean valuesWritten) throws IOException {
+        if (document == null || acroForm == null) {
             return;
         }
 
-        if (acroForm == null) {
-            return;
-        }
-
-        // Use PDFBox's built-in field flattening which bakes form field values
-        // into the page content stream as static text/graphics, removing the
-        // interactive form structure but preserving all other document content
-        // (images, text, annotations, etc.) at full quality.
-        try {
+        if (valuesWritten || hasWidgetWithoutAppearance(acroForm)) {
             ensureAppearances(acroForm);
+        } else {
+            acroForm.setNeedAppearances(false);
+        }
+
+        try {
             acroForm.flatten();
         } catch (Exception e) {
             log.warn(
@@ -736,6 +751,28 @@ public class FormUtils {
         }
     }
 
+    private boolean hasWidgetWithoutAppearance(PDAcroForm acroForm) {
+        for (PDField field : acroForm.getFieldTree()) {
+            if (!(field instanceof PDTerminalField terminalField)) {
+                continue;
+            }
+            List<PDAnnotationWidget> widgets = terminalField.getWidgets();
+            if (widgets == null) {
+                continue;
+            }
+            for (PDAnnotationWidget widget : widgets) {
+                if (widget == null) {
+                    continue;
+                }
+                PDAppearanceDictionary appearance = widget.getAppearance();
+                if (appearance == null || appearance.getNormalAppearance() == null) {
+                    return true;
+                }
+            }
+        }
+        return false;
+    }
+
     private void rebuildDocumentFromImages(PDDocument document, PDFRenderer renderer, int dpi)
             throws IOException {
         int pageCount = document.getNumberOfPages();
diff --git a/app/common/src/main/java/stirling/software/common/util/GeneralUtils.java b/app/common/src/main/java/stirling/software/common/util/GeneralUtils.java
index a0086ea346..61ba8670fd 100644
--- a/app/common/src/main/java/stirling/software/common/util/GeneralUtils.java
+++ b/app/common/src/main/java/stirling/software/common/util/GeneralUtils.java
@@ -1183,4 +1183,25 @@ public class GeneralUtils {
             }
         }
     }
+
+    public String getLocalNetworkIp() {
+        try {
+            Enumeration<NetworkInterface> interfaces = NetworkInterface.getNetworkInterfaces();
+            if (interfaces == null) return null;
+            while (interfaces.hasMoreElements()) {
+                NetworkInterface iface = interfaces.nextElement();
+                if (!iface.isUp() || iface.isLoopback() || iface.isVirtual()) continue;
+                Enumeration<InetAddress> addresses = iface.getInetAddresses();
+                while (addresses.hasMoreElements()) {
+                    InetAddress addr = addresses.nextElement();
+                    if (addr instanceof Inet4Address && addr.isSiteLocalAddress()) {
+                        return addr.getHostAddress();
+                    }
+                }
+            }
+        } catch (Exception e) {
+            log.warn("Failed to detect local network IP", e);
+        }
+        return null;
+    }
 }
diff --git a/app/common/src/main/java/stirling/software/common/util/PDFToFile.java b/app/common/src/main/java/stirling/software/common/util/PDFToFile.java
index 680eb50d62..1300e165ff 100644
--- a/app/common/src/main/java/stirling/software/common/util/PDFToFile.java
+++ b/app/common/src/main/java/stirling/software/common/util/PDFToFile.java
@@ -1,9 +1,9 @@
 package stirling.software.common.util;
 
-import java.io.ByteArrayOutputStream;
 import java.io.File;
 import java.io.FileInputStream;
 import java.io.IOException;
+import java.io.OutputStream;
 import java.nio.file.Files;
 import java.nio.file.Path;
 import java.util.ArrayList;
@@ -20,6 +20,7 @@ import org.springframework.http.HttpStatus;
 import org.springframework.http.MediaType;
 import org.springframework.http.ResponseEntity;
 import org.springframework.web.multipart.MultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import com.vladsch.flexmark.html2md.converter.FlexmarkHtmlConverter;
 import com.vladsch.flexmark.util.data.MutableDataSet;
@@ -48,7 +49,7 @@ public class PDFToFile {
         this.runtimePathConfig = runtimePathConfig;
     }
 
-    public ResponseEntity<byte[]> processPdfToMarkdown(MultipartFile inputFile)
+    public ResponseEntity<StreamingResponseBody> processPdfToMarkdown(MultipartFile inputFile)
             throws IOException, InterruptedException {
         if (!MediaType.APPLICATION_PDF_VALUE.equals(inputFile.getContentType())) {
             return new ResponseEntity<>(HttpStatus.BAD_REQUEST);
@@ -85,78 +86,77 @@ public class PDFToFile {
             pdfBaseName = originalPdfFileName.substring(0, originalPdfFileName.lastIndexOf('.'));
         }
 
-        byte[] fileBytes;
-        String fileName;
+        String fileName = pdfBaseName + "ToMarkdown.zip";
+        TempFile finalOut = tempFileManager.createManagedTempFile(".zip");
+        try {
+            try (TempFile tempInputFile = new TempFile(tempFileManager, ".pdf");
+                    TempDirectory tempOutputDir = new TempDirectory(tempFileManager)) {
+                inputFile.transferTo(tempInputFile.getFile());
 
-        try (TempFile tempInputFile = new TempFile(tempFileManager, ".pdf");
-                TempDirectory tempOutputDir = new TempDirectory(tempFileManager)) {
-            inputFile.transferTo(tempInputFile.getFile());
+                List<String> command =
+                        new ArrayList<>(
+                                Arrays.asList(
+                                        "pdftohtml",
+                                        "-s",
+                                        "-noframes",
+                                        "-c",
+                                        tempInputFile.getAbsolutePath(),
+                                        pdfBaseName));
 
-            List<String> command =
-                    new ArrayList<>(
-                            Arrays.asList(
-                                    "pdftohtml",
-                                    "-s",
-                                    "-noframes",
-                                    "-c",
-                                    tempInputFile.getAbsolutePath(),
-                                    pdfBaseName));
+                ProcessExecutorResult returnCode =
+                        ProcessExecutor.getInstance(ProcessExecutor.Processes.PDFTOHTML)
+                                .runCommandWithOutputHandling(
+                                        command, tempOutputDir.getPath().toFile());
+                // Process HTML files to Markdown
+                File[] outputFiles =
+                        Objects.requireNonNull(tempOutputDir.getPath().toFile().listFiles());
+                List<File> markdownFiles = new ArrayList<>();
+                List<File> imageFiles = new ArrayList<>();
 
-            ProcessExecutorResult returnCode =
-                    ProcessExecutor.getInstance(ProcessExecutor.Processes.PDFTOHTML)
-                            .runCommandWithOutputHandling(
-                                    command, tempOutputDir.getPath().toFile());
-            // Process HTML files to Markdown
-            File[] outputFiles =
-                    Objects.requireNonNull(tempOutputDir.getPath().toFile().listFiles());
-            List<File> markdownFiles = new ArrayList<>();
-            List<File> imageFiles = new ArrayList<>();
+                // Convert HTML files to Markdown and collect image files
+                for (File outputFile : outputFiles) {
+                    if (outputFile.getName().endsWith(".html")) {
+                        String html = Files.readString(outputFile.toPath());
+                        String markdown = htmlToMarkdownConverter.convert(html);
 
-            // Convert HTML files to Markdown and collect image files
-            for (File outputFile : outputFiles) {
-                if (outputFile.getName().endsWith(".html")) {
-                    String html = Files.readString(outputFile.toPath());
-                    String markdown = htmlToMarkdownConverter.convert(html);
+                        // Update image references to point to images/ folder
+                        markdown = updateImageReferences(markdown);
 
-                    // Update image references to point to images/ folder
-                    markdown = updateImageReferences(markdown);
+                        String mdFileName = outputFile.getName().replace(".html", ".md");
+                        File mdFile = new File(tempOutputDir.getPath().toFile(), mdFileName);
+                        Files.writeString(mdFile.toPath(), markdown);
+                        markdownFiles.add(mdFile);
+                    } else if (!outputFile.getName().endsWith(".md")) {
+                        // Collect non-HTML, non-MD files as images/assets
+                        imageFiles.add(outputFile);
+                    }
+                }
 
-                    String mdFileName = outputFile.getName().replace(".html", ".md");
-                    File mdFile = new File(tempOutputDir.getPath().toFile(), mdFileName);
-                    Files.writeString(mdFile.toPath(), markdown);
-                    markdownFiles.add(mdFile);
-                } else if (!outputFile.getName().endsWith(".md")) {
-                    // Collect non-HTML, non-MD files as images/assets
-                    imageFiles.add(outputFile);
+                try (OutputStream fos = Files.newOutputStream(finalOut.getPath());
+                        ZipOutputStream zipOutputStream = new ZipOutputStream(fos)) {
+                    // Add markdown files to root of ZIP
+                    for (File mdFile : markdownFiles) {
+                        ZipEntry mdEntry = new ZipEntry(mdFile.getName());
+                        zipOutputStream.putNextEntry(mdEntry);
+                        Files.copy(mdFile.toPath(), zipOutputStream);
+                        zipOutputStream.closeEntry();
+                    }
+
+                    // Add images and other assets to images/ folder
+                    for (File imageFile : imageFiles) {
+                        ZipEntry assetEntry = new ZipEntry("images/" + imageFile.getName());
+                        zipOutputStream.putNextEntry(assetEntry);
+                        Files.copy(imageFile.toPath(), zipOutputStream);
+                        zipOutputStream.closeEntry();
+                    }
                 }
             }
-
-            // Always create a ZIP file
-            fileName = pdfBaseName + "ToMarkdown.zip";
-            ByteArrayOutputStream byteArrayOutputStream = new ByteArrayOutputStream();
-
-            try (ZipOutputStream zipOutputStream = new ZipOutputStream(byteArrayOutputStream)) {
-                // Add markdown files to root of ZIP
-                for (File mdFile : markdownFiles) {
-                    ZipEntry mdEntry = new ZipEntry(mdFile.getName());
-                    zipOutputStream.putNextEntry(mdEntry);
-                    Files.copy(mdFile.toPath(), zipOutputStream);
-                    zipOutputStream.closeEntry();
-                }
-
-                // Add images and other assets to images/ folder
-                for (File imageFile : imageFiles) {
-                    ZipEntry assetEntry = new ZipEntry("images/" + imageFile.getName());
-                    zipOutputStream.putNextEntry(assetEntry);
-                    Files.copy(imageFile.toPath(), zipOutputStream);
-                    zipOutputStream.closeEntry();
-                }
-            }
-
-            fileBytes = byteArrayOutputStream.toByteArray();
+        } catch (Exception e) {
+            finalOut.close();
+            throw e;
         }
-        return WebResponseUtils.bytesToWebResponse(
-                fileBytes, fileName, MediaType.APPLICATION_OCTET_STREAM);
+        return WebResponseUtils.fileToWebResponse(
+                finalOut, fileName, MediaType.APPLICATION_OCTET_STREAM);
     }
 
     /**
@@ -169,7 +169,7 @@ public class PDFToFile {
         return PATTERN.matcher(markdown).replaceAll("$1(images/$2)");
     }
 
-    public ResponseEntity<byte[]> processPdfToHtml(MultipartFile inputFile)
+    public ResponseEntity<StreamingResponseBody> processPdfToHtml(MultipartFile inputFile)
             throws IOException, InterruptedException {
         if (!MediaType.APPLICATION_PDF_VALUE.equals(inputFile.getContentType())) {
             return new ResponseEntity<>(HttpStatus.BAD_REQUEST);
@@ -182,56 +182,57 @@ public class PDFToFile {
             pdfBaseName = originalPdfFileName.substring(0, originalPdfFileName.lastIndexOf('.'));
         }
 
-        byte[] fileBytes;
-        String fileName;
+        String fileName = pdfBaseName + "ToHtml.zip";
+        TempFile finalOut = tempFileManager.createManagedTempFile(".zip");
+        try {
+            try (TempFile inputFileTemp = new TempFile(tempFileManager, ".pdf");
+                    TempDirectory outputDirTemp = new TempDirectory(tempFileManager)) {
 
-        try (TempFile inputFileTemp = new TempFile(tempFileManager, ".pdf");
-                TempDirectory outputDirTemp = new TempDirectory(tempFileManager)) {
+                Path tempInputFile = inputFileTemp.getPath();
+                Path tempOutputDir = outputDirTemp.getPath();
 
-            Path tempInputFile = inputFileTemp.getPath();
-            Path tempOutputDir = outputDirTemp.getPath();
+                // Save the uploaded file to a temporary location
+                inputFile.transferTo(tempInputFile);
 
-            // Save the uploaded file to a temporary location
-            inputFile.transferTo(tempInputFile);
+                // Run the pdftohtml command with complex output
+                List<String> command =
+                        new ArrayList<>(
+                                Arrays.asList(
+                                        "pdftohtml", "-c", tempInputFile.toString(), pdfBaseName));
 
-            // Run the pdftohtml command with complex output
-            List<String> command =
-                    new ArrayList<>(
-                            Arrays.asList(
-                                    "pdftohtml", "-c", tempInputFile.toString(), pdfBaseName));
+                ProcessExecutorResult returnCode =
+                        ProcessExecutor.getInstance(ProcessExecutor.Processes.PDFTOHTML)
+                                .runCommandWithOutputHandling(command, tempOutputDir.toFile());
 
-            ProcessExecutorResult returnCode =
-                    ProcessExecutor.getInstance(ProcessExecutor.Processes.PDFTOHTML)
-                            .runCommandWithOutputHandling(command, tempOutputDir.toFile());
+                // Get output files
+                File[] outputFiles = Objects.requireNonNull(tempOutputDir.toFile().listFiles());
 
-            // Get output files
-            File[] outputFiles = Objects.requireNonNull(tempOutputDir.toFile().listFiles());
-
-            // Return output files in a ZIP archive
-            fileName = pdfBaseName + "ToHtml.zip";
-            ByteArrayOutputStream byteArrayOutputStream = new ByteArrayOutputStream();
-            try (ZipOutputStream zipOutputStream = new ZipOutputStream(byteArrayOutputStream)) {
-                for (File outputFile : outputFiles) {
-                    ZipEntry entry = new ZipEntry(outputFile.getName());
-                    zipOutputStream.putNextEntry(entry);
-                    try (FileInputStream fis = new FileInputStream(outputFile)) {
-                        IOUtils.copy(fis, zipOutputStream);
-                    } catch (IOException e) {
-                        log.error("Exception writing zip entry", e);
+                try (OutputStream fos = Files.newOutputStream(finalOut.getPath());
+                        ZipOutputStream zipOutputStream = new ZipOutputStream(fos)) {
+                    for (File outputFile : outputFiles) {
+                        ZipEntry entry = new ZipEntry(outputFile.getName());
+                        zipOutputStream.putNextEntry(entry);
+                        try (FileInputStream fis = new FileInputStream(outputFile)) {
+                            IOUtils.copy(fis, zipOutputStream);
+                        } catch (IOException e) {
+                            log.error("Exception writing zip entry", e);
+                        }
+                        zipOutputStream.closeEntry();
                     }
-                    zipOutputStream.closeEntry();
+                } catch (IOException e) {
+                    log.error("Exception writing zip", e);
                 }
-            } catch (IOException e) {
-                log.error("Exception writing zip", e);
             }
-            fileBytes = byteArrayOutputStream.toByteArray();
+        } catch (Exception e) {
+            finalOut.close();
+            throw e;
         }
 
-        return WebResponseUtils.bytesToWebResponse(
-                fileBytes, fileName, MediaType.APPLICATION_OCTET_STREAM);
+        return WebResponseUtils.fileToWebResponse(
+                finalOut, fileName, MediaType.APPLICATION_OCTET_STREAM);
     }
 
-    public ResponseEntity<byte[]> processPdfToOfficeFormat(
+    public ResponseEntity<StreamingResponseBody> processPdfToOfficeFormat(
             MultipartFile inputFile, String outputFormat, String libreOfficeFilter)
             throws IOException, InterruptedException {
 
@@ -257,109 +258,115 @@ public class PDFToFile {
             return new ResponseEntity<>(HttpStatus.BAD_REQUEST);
         }
 
-        byte[] fileBytes;
         String fileName;
-
+        TempFile finalOut =
+                tempFileManager.createManagedTempFile("." + resolvePrimaryExtension(outputFormat));
         Path libreOfficeProfile = null;
-        try (TempFile inputFileTemp = new TempFile(tempFileManager, ".pdf");
-                TempDirectory outputDirTemp = new TempDirectory(tempFileManager)) {
+        try {
+            try (TempFile inputFileTemp = new TempFile(tempFileManager, ".pdf");
+                    TempDirectory outputDirTemp = new TempDirectory(tempFileManager)) {
 
-            Path tempInputFile = inputFileTemp.getPath();
-            Path tempOutputDir = outputDirTemp.getPath();
-            Path unoOutputFile =
-                    tempOutputDir.resolve(
-                            pdfBaseName + "." + resolvePrimaryExtension(outputFormat));
+                Path tempInputFile = inputFileTemp.getPath();
+                Path tempOutputDir = outputDirTemp.getPath();
+                Path unoOutputFile =
+                        tempOutputDir.resolve(
+                                pdfBaseName + "." + resolvePrimaryExtension(outputFormat));
 
-            // Save the uploaded file to a temporary location
-            inputFile.transferTo(tempInputFile);
+                // Save the uploaded file to a temporary location
+                inputFile.transferTo(tempInputFile);
 
-            // Run the LibreOffice command
-            ProcessExecutorResult returnCode = null;
-            IOException unoconvertException = null;
+                // Run the LibreOffice command
+                ProcessExecutorResult returnCode = null;
+                IOException unoconvertException = null;
 
-            if (isUnoConvertEnabled()) {
-                try {
-                    List<String> unoCommand =
-                            buildUnoConvertCommand(
-                                    tempInputFile, unoOutputFile, outputFormat, libreOfficeFilter);
-                    returnCode =
-                            ProcessExecutor.getInstance(ProcessExecutor.Processes.LIBRE_OFFICE)
-                                    .runCommandWithOutputHandling(unoCommand);
-                } catch (IOException e) {
-                    unoconvertException = e;
-                    log.warn(
-                            "Unoconvert command failed ({}). Falling back to soffice command.",
-                            e.getMessage());
-                }
-            }
-
-            if (returnCode == null) {
-                // Run the LibreOffice command as a fallback
-                libreOfficeProfile = Files.createTempDirectory("libreoffice_profile_");
-                List<String> command = new ArrayList<>();
-                command.add(runtimePathConfig.getSOfficePath());
-                command.add("-env:UserInstallation=" + libreOfficeProfile.toUri().toString());
-                command.add("--headless");
-                command.add("--nologo");
-                command.add("--infilter=" + libreOfficeFilter);
-                command.add("--convert-to");
-                command.add(outputFormat);
-                command.add("--outdir");
-                command.add(tempOutputDir.toString());
-                command.add(tempInputFile.toString());
-
-                try {
-                    returnCode =
-                            ProcessExecutor.getInstance(ProcessExecutor.Processes.LIBRE_OFFICE)
-                                    .runCommandWithOutputHandling(command);
-                } catch (IOException e) {
-                    if (unoconvertException != null) {
-                        e.addSuppressed(unoconvertException);
+                if (isUnoConvertEnabled()) {
+                    try {
+                        List<String> unoCommand =
+                                buildUnoConvertCommand(
+                                        tempInputFile,
+                                        unoOutputFile,
+                                        outputFormat,
+                                        libreOfficeFilter);
+                        returnCode =
+                                ProcessExecutor.getInstance(ProcessExecutor.Processes.LIBRE_OFFICE)
+                                        .runCommandWithOutputHandling(unoCommand);
+                    } catch (IOException e) {
+                        unoconvertException = e;
+                        log.warn(
+                                "Unoconvert command failed ({}). Falling back to soffice command.",
+                                e.getMessage());
                     }
-                    throw e;
                 }
-            }
 
-            // Get output files
-            List<File> outputFiles = Arrays.asList(tempOutputDir.toFile().listFiles());
+                if (returnCode == null) {
+                    // Run the LibreOffice command as a fallback
+                    libreOfficeProfile = Files.createTempDirectory("libreoffice_profile_");
+                    List<String> command = new ArrayList<>();
+                    command.add(runtimePathConfig.getSOfficePath());
+                    command.add("-env:UserInstallation=" + libreOfficeProfile.toUri().toString());
+                    command.add("--headless");
+                    command.add("--nologo");
+                    command.add("--infilter=" + libreOfficeFilter);
+                    command.add("--convert-to");
+                    command.add(outputFormat);
+                    command.add("--outdir");
+                    command.add(tempOutputDir.toString());
+                    command.add(tempInputFile.toString());
 
-            if (outputFiles.size() == 1) {
-                // Return single output file
-                File outputFile = outputFiles.get(0);
-                if ("txt:Text".equals(outputFormat)) {
-                    outputFormat = "txt";
-                }
-                fileName = pdfBaseName + "." + outputFormat;
-                fileBytes = FileUtils.readFileToByteArray(outputFile);
-            } else {
-                // Return output files in a ZIP archive
-                fileName = pdfBaseName + "To" + outputFormat + ".zip";
-                ByteArrayOutputStream byteArrayOutputStream = new ByteArrayOutputStream();
-                try (ZipOutputStream zipOutputStream = new ZipOutputStream(byteArrayOutputStream)) {
-                    for (File outputFile : outputFiles) {
-                        ZipEntry entry = new ZipEntry(outputFile.getName());
-                        zipOutputStream.putNextEntry(entry);
-                        try (FileInputStream fis = new FileInputStream(outputFile)) {
-                            IOUtils.copy(fis, zipOutputStream);
-                        } catch (IOException e) {
-                            log.error("Exception writing zip entry", e);
+                    try {
+                        returnCode =
+                                ProcessExecutor.getInstance(ProcessExecutor.Processes.LIBRE_OFFICE)
+                                        .runCommandWithOutputHandling(command);
+                    } catch (IOException e) {
+                        if (unoconvertException != null) {
+                            e.addSuppressed(unoconvertException);
                         }
-
-                        zipOutputStream.closeEntry();
+                        throw e;
                     }
-                } catch (IOException e) {
-                    log.error("Exception writing zip", e);
                 }
 
-                fileBytes = byteArrayOutputStream.toByteArray();
+                // Get output files
+                List<File> outputFiles = Arrays.asList(tempOutputDir.toFile().listFiles());
+
+                if (outputFiles.size() == 1) {
+                    // Return single output file
+                    File outputFile = outputFiles.get(0);
+                    if ("txt:Text".equals(outputFormat)) {
+                        outputFormat = "txt";
+                    }
+                    fileName = pdfBaseName + "." + outputFormat;
+                    FileUtils.copyFile(outputFile, finalOut.getFile());
+                } else {
+                    // Return output files in a ZIP archive
+                    fileName = pdfBaseName + "To" + outputFormat + ".zip";
+                    try (OutputStream fos = Files.newOutputStream(finalOut.getPath());
+                            ZipOutputStream zipOutputStream = new ZipOutputStream(fos)) {
+                        for (File outputFile : outputFiles) {
+                            ZipEntry entry = new ZipEntry(outputFile.getName());
+                            zipOutputStream.putNextEntry(entry);
+                            try (FileInputStream fis = new FileInputStream(outputFile)) {
+                                IOUtils.copy(fis, zipOutputStream);
+                            } catch (IOException e) {
+                                log.error("Exception writing zip entry", e);
+                            }
+
+                            zipOutputStream.closeEntry();
+                        }
+                    } catch (IOException e) {
+                        log.error("Exception writing zip", e);
+                    }
+                }
             }
+        } catch (Exception e) {
+            finalOut.close();
+            throw e;
         } finally {
             if (libreOfficeProfile != null) {
                 FileUtils.deleteQuietly(libreOfficeProfile.toFile());
             }
         }
-        return WebResponseUtils.bytesToWebResponse(
-                fileBytes, fileName, MediaType.APPLICATION_OCTET_STREAM);
+        return WebResponseUtils.fileToWebResponse(
+                finalOut, fileName, MediaType.APPLICATION_OCTET_STREAM);
     }
 
     private boolean isUnoConvertEnabled() {
diff --git a/app/common/src/main/java/stirling/software/common/util/ProcessExecutor.java b/app/common/src/main/java/stirling/software/common/util/ProcessExecutor.java
index 0e48628d8a..99d25838be 100644
--- a/app/common/src/main/java/stirling/software/common/util/ProcessExecutor.java
+++ b/app/common/src/main/java/stirling/software/common/util/ProcessExecutor.java
@@ -282,8 +282,9 @@ public class ProcessExecutor {
             boolean finished = process.waitFor(timeoutDuration, TimeUnit.MINUTES);
 
             if (!finished) {
-                // Terminate the process
-                process.destroy();
+                // Kill the entire process tree (descendants first, then the process itself)
+                process.descendants().forEach(ProcessHandle::destroyForcibly);
+                process.destroyForcibly();
                 // Interrupt the reader threads
                 errorReaderThread.interrupt();
                 outputReaderThread.interrupt();
diff --git a/app/common/src/main/java/stirling/software/common/util/RegexPatternUtils.java b/app/common/src/main/java/stirling/software/common/util/RegexPatternUtils.java
index de59f09c64..48e419a0ae 100644
--- a/app/common/src/main/java/stirling/software/common/util/RegexPatternUtils.java
+++ b/app/common/src/main/java/stirling/software/common/util/RegexPatternUtils.java
@@ -538,9 +538,9 @@ public final class RegexPatternUtils {
         getPattern("[^a-zA-Z0-9 ]"); // Input sanitization
         getPattern("[^a-zA-Z0-9]"); // Filename sanitization
         // API doc patterns
-        getPattern("Output:(\\w+)"); // precompiled single-escaped for runtime regex \w
-        getPattern("Input:(\\w+)");
-        getPattern("Type:(\\w+)");
+        getPattern("Output:\\s*(\\w+)");
+        getPattern("Input:\\s*(\\w+)");
+        getPattern("Type:\\s*(\\w+)");
         log.debug("Pre-compiled {} common regex patterns", patternCache.size());
     }
 
@@ -552,19 +552,19 @@ public final class RegexPatternUtils {
 
     /* Pattern for matching Output:<TYPE> in API descriptions */
     public Pattern getApiDocOutputTypePattern() {
-        return getPattern("Output:(\\w+)");
+        return getPattern("Output:\\s*(\\w+)");
     }
 
     /* Pattern for matching Input:<TYPE> in API descriptions */
     public Pattern getApiDocInputTypePattern() {
-        return getPattern("Input:(\\w+)");
+        return getPattern("Input:\\s*(\\w+)");
     }
 
     /**
      * Pattern for matching Type:<CODE> in API descriptions
      */
     public Pattern getApiDocTypePattern() {
-        return getPattern("Type:(\\w+)");
+        return getPattern("Type:\\s*(\\w+)");
     }
 
     /* Pattern for validating file extensions (2-4 alphanumeric, case-insensitive) */
diff --git a/app/common/src/main/java/stirling/software/common/util/WebResponseUtils.java b/app/common/src/main/java/stirling/software/common/util/WebResponseUtils.java
index a5132e2a19..ab8311dd4e 100644
--- a/app/common/src/main/java/stirling/software/common/util/WebResponseUtils.java
+++ b/app/common/src/main/java/stirling/software/common/util/WebResponseUtils.java
@@ -73,6 +73,19 @@ public class WebResponseUtils {
         return baosToWebResponse(baos, docName);
     }
 
+    public static ResponseEntity<StreamingResponseBody> pdfDocToWebResponse(
+            PDDocument document, String docName, TempFileManager tempFileManager)
+            throws IOException {
+        TempFile tempFile = tempFileManager.createManagedTempFile(".pdf");
+        try {
+            document.save(tempFile.getFile());
+        } catch (IOException e) {
+            tempFile.close();
+            throw e;
+        }
+        return pdfFileToWebResponse(tempFile, docName);
+    }
+
     /**
      * Convert a File to a web response (PDF default).
      *
@@ -108,23 +121,37 @@ public class WebResponseUtils {
     public static ResponseEntity<StreamingResponseBody> fileToWebResponse(
             TempFile outputTempFile, String docName, MediaType mediaType) throws IOException {
 
-        Path path = outputTempFile.getFile().toPath().normalize();
-        long len = Files.size(path);
-        HttpHeaders headers = new HttpHeaders();
-        headers.setContentType(mediaType);
-        headers.setContentLength(len);
-        headers.add(HttpHeaders.CONTENT_DISPOSITION, "attachment; filename=\"" + docName + "\"");
+        try {
+            Path path = outputTempFile.getFile().toPath().normalize();
+            long len = Files.size(path);
+            HttpHeaders headers = new HttpHeaders();
+            headers.setContentType(mediaType);
+            headers.setContentLength(len);
+            String encodedDocName =
+                    RegexPatternUtils.getInstance()
+                            .getPlusSignPattern()
+                            .matcher(URLEncoder.encode(docName, StandardCharsets.UTF_8))
+                            .replaceAll("%20");
+            headers.setContentDispositionFormData("attachment", encodedDocName);
 
-        StreamingResponseBody body =
-                os -> {
-                    try (os) {
-                        Files.copy(path, os);
-                        os.flush();
-                    } finally {
-                        outputTempFile.close();
-                    }
-                };
+            StreamingResponseBody body =
+                    os -> {
+                        try (os) {
+                            Files.copy(path, os);
+                            os.flush();
+                        } finally {
+                            outputTempFile.close();
+                        }
+                    };
 
-        return new ResponseEntity<>(body, headers, HttpStatus.OK);
+            return new ResponseEntity<>(body, headers, HttpStatus.OK);
+        } catch (IOException | RuntimeException e) {
+            try {
+                outputTempFile.close();
+            } catch (Exception closeEx) {
+                e.addSuppressed(closeEx);
+            }
+            throw e;
+        }
     }
 }
diff --git a/app/common/src/main/java/stirling/software/common/util/ZipExtractionUtils.java b/app/common/src/main/java/stirling/software/common/util/ZipExtractionUtils.java
new file mode 100644
index 0000000000..b49d1d2106
--- /dev/null
+++ b/app/common/src/main/java/stirling/software/common/util/ZipExtractionUtils.java
@@ -0,0 +1,142 @@
+package stirling.software.common.util;
+
+import java.io.IOException;
+import java.io.InputStream;
+import java.io.OutputStream;
+import java.nio.file.Files;
+import java.util.ArrayList;
+import java.util.List;
+import java.util.function.Consumer;
+import java.util.zip.ZipEntry;
+import java.util.zip.ZipInputStream;
+
+import org.springframework.core.io.FileSystemResource;
+import org.springframework.core.io.Resource;
+
+import io.github.pixee.security.ZipSecurity;
+
+import lombok.experimental.UtilityClass;
+import lombok.extern.slf4j.Slf4j;
+
+/**
+ * Helpers for detecting and extracting ZIP-formatted responses returned from Stirling API
+ * endpoints. Shared between {@code PipelineProcessor} and {@code AiWorkflowService} so both callers
+ * unpack ZIPs consistently (hardened against zip-slip, depth-limited, backed by managed temp
+ * files).
+ */
+@Slf4j
+@UtilityClass
+public class ZipExtractionUtils {
+
+    private static final int MAX_UNZIP_DEPTH = 10;
+    private static final byte[] ZIP_MAGIC = {0x50, 0x4B, 0x03, 0x04};
+
+    /**
+     * Returns true if the resource starts with the standard ZIP magic bytes. CBZ files are
+     * explicitly treated as non-ZIP.
+     */
+    public static boolean isZip(Resource data) throws IOException {
+        return isZip(data, null);
+    }
+
+    /**
+     * Returns true if the resource starts with the standard ZIP magic bytes. Files named with the
+     * {@code .cbz} extension are excluded (handled separately by the comic viewer).
+     */
+    public static boolean isZip(Resource data, String filename) throws IOException {
+        if (data == null || data.contentLength() < ZIP_MAGIC.length) {
+            return false;
+        }
+        if (filename != null && filename.toLowerCase().endsWith(".cbz")) {
+            return false;
+        }
+        try (InputStream is = data.getInputStream()) {
+            byte[] header = new byte[ZIP_MAGIC.length];
+            if (is.read(header) < ZIP_MAGIC.length) {
+                return false;
+            }
+            for (int i = 0; i < ZIP_MAGIC.length; i++) {
+                if (header[i] != ZIP_MAGIC[i]) {
+                    return false;
+                }
+            }
+            return true;
+        }
+    }
+
+    /**
+     * Extract a ZIP resource into a flat list of resources, one per file entry. Nested ZIPs are
+     * recursively extracted up to {@link #MAX_UNZIP_DEPTH}. Each entry is materialized as a
+     * hardened-extracted managed temp file so downstream consumers can stream the bytes.
+     */
+    public static List<Resource> extractZip(Resource zip, TempFileManager tempFileManager)
+            throws IOException {
+        return extractZip(zip, tempFileManager, null);
+    }
+
+    /**
+     * Extract a ZIP resource into a flat list of resources. Each created {@link TempFile} is also
+     * passed to {@code tempFileConsumer} when non-null, giving callers the option to register the
+     * temp files with an auxiliary lifecycle (e.g. {@code PipelineResult}).
+     */
+    public static List<Resource> extractZip(
+            Resource zip, TempFileManager tempFileManager, Consumer<TempFile> tempFileConsumer)
+            throws IOException {
+        return extractZipInternal(zip, tempFileManager, tempFileConsumer, 0);
+    }
+
+    private static List<Resource> extractZipInternal(
+            Resource zip,
+            TempFileManager tempFileManager,
+            Consumer<TempFile> tempFileConsumer,
+            int depth)
+            throws IOException {
+        if (depth > MAX_UNZIP_DEPTH) {
+            log.warn(
+                    "ZIP nesting depth {} exceeds limit {}, treating as file",
+                    depth,
+                    MAX_UNZIP_DEPTH);
+            return List.of(zip);
+        }
+        log.debug("Unzipping data of length: {}", zip.contentLength());
+        List<Resource> extracted = new ArrayList<>();
+        try (InputStream bais = zip.getInputStream();
+                ZipInputStream zis = ZipSecurity.createHardenedInputStream(bais)) {
+            ZipEntry entry;
+            while ((entry = zis.getNextEntry()) != null) {
+                if (entry.isDirectory()) {
+                    continue;
+                }
+                TempFile tempFile = tempFileManager.createManagedTempFile("unzip");
+                if (tempFileConsumer != null) {
+                    tempFileConsumer.accept(tempFile);
+                }
+                try (OutputStream os = Files.newOutputStream(tempFile.getPath())) {
+                    byte[] buffer = new byte[4096];
+                    int count;
+                    while ((count = zis.read(buffer)) != -1) {
+                        os.write(buffer, 0, count);
+                    }
+                }
+                final String filename = entry.getName();
+                Resource fileResource =
+                        new FileSystemResource(tempFile.getFile()) {
+                            @Override
+                            public String getFilename() {
+                                return filename;
+                            }
+                        };
+                if (isZip(fileResource, filename)) {
+                    log.debug("Nested ZIP entry {} — recursing", filename);
+                    extracted.addAll(
+                            extractZipInternal(
+                                    fileResource, tempFileManager, tempFileConsumer, depth + 1));
+                } else {
+                    extracted.add(fileResource);
+                }
+            }
+        }
+        log.debug("Unzipping completed. {} files extracted.", extracted.size());
+        return extracted;
+    }
+}
diff --git a/app/common/src/test/java/stirling/software/common/service/InternalApiClientTest.java b/app/common/src/test/java/stirling/software/common/service/InternalApiClientTest.java
new file mode 100644
index 0000000000..f815e92e71
--- /dev/null
+++ b/app/common/src/test/java/stirling/software/common/service/InternalApiClientTest.java
@@ -0,0 +1,159 @@
+package stirling.software.common.service;
+
+import static org.junit.jupiter.api.Assertions.*;
+import static org.mockito.ArgumentMatchers.*;
+import static org.mockito.Mockito.*;
+
+import java.io.ByteArrayInputStream;
+import java.nio.charset.StandardCharsets;
+import java.nio.file.Files;
+import java.nio.file.Path;
+
+import org.junit.jupiter.api.BeforeEach;
+import org.junit.jupiter.api.Test;
+import org.junit.jupiter.api.extension.ExtendWith;
+import org.mockito.Mock;
+import org.mockito.junit.jupiter.MockitoExtension;
+import org.springframework.core.io.ByteArrayResource;
+import org.springframework.core.io.Resource;
+import org.springframework.http.*;
+import org.springframework.http.client.ClientHttpResponse;
+import org.springframework.mock.env.MockEnvironment;
+import org.springframework.util.LinkedMultiValueMap;
+import org.springframework.util.MultiValueMap;
+import org.springframework.web.client.RequestCallback;
+import org.springframework.web.client.ResponseExtractor;
+import org.springframework.web.client.RestTemplate;
+
+import jakarta.servlet.ServletContext;
+
+import stirling.software.common.util.TempFile;
+import stirling.software.common.util.TempFileManager;
+
+@ExtendWith(MockitoExtension.class)
+class InternalApiClientTest {
+
+    @Mock ServletContext servletContext;
+    @Mock UserServiceInterface userService;
+    @Mock TempFileManager tempFileManager;
+
+    InternalApiClient client;
+
+    @BeforeEach
+    void setUp() {
+        lenient().when(servletContext.getContextPath()).thenReturn("");
+        MockEnvironment environment = new MockEnvironment().withProperty("server.port", "8080");
+        client = new InternalApiClient(servletContext, userService, tempFileManager, environment);
+    }
+
+    @Test
+    void postDoesNotForceContentType() throws Exception {
+        MultiValueMap<String, Object> body = new LinkedMultiValueMap<>();
+        body.add("fileInput", namedResource("input.pdf", "data"));
+
+        Path tempPath = Files.createTempFile("internal-api-test", ".tmp");
+        TempFile tempFile = mock(TempFile.class);
+        when(tempFile.getPath()).thenReturn(tempPath);
+        when(tempFile.getFile()).thenReturn(tempPath.toFile());
+        when(tempFileManager.createManagedTempFile("internal-api")).thenReturn(tempFile);
+
+        HttpHeaders[] captured = {null};
+
+        try (var ignored =
+                mockConstruction(
+                        RestTemplate.class,
+                        (rt, ctx) -> {
+                            when(rt.httpEntityCallback(any(), eq(Resource.class)))
+                                    .thenAnswer(
+                                            inv -> {
+                                                HttpEntity<?> entity = inv.getArgument(0);
+                                                captured[0] = entity.getHeaders();
+                                                return (RequestCallback) req -> {};
+                                            });
+
+                            when(rt.execute(anyString(), eq(HttpMethod.POST), any(), any()))
+                                    .thenAnswer(inv -> fakeOkResponse(inv.getArgument(3)));
+                        })) {
+
+            ResponseEntity<Resource> response = client.post("/api/v1/general/merge-pdfs", body);
+
+            assertNotNull(response);
+            assertEquals(HttpStatus.OK, response.getStatusCode());
+            assertNotNull(response.getBody());
+            assertNull(captured[0].getContentType(), "Content-Type should not be forced");
+        } finally {
+            Files.deleteIfExists(tempPath);
+        }
+    }
+
+    @Test
+    void postRejectsDisallowedPath() {
+        MultiValueMap<String, Object> body = new LinkedMultiValueMap<>();
+        assertThrows(SecurityException.class, () -> client.post("/api/v1/admin/settings", body));
+    }
+
+    @Test
+    void postRejectsPathTraversal() {
+        MultiValueMap<String, Object> body = new LinkedMultiValueMap<>();
+        assertThrows(
+                SecurityException.class,
+                () -> client.post("/api/v1/misc/../../actuator/env", body));
+    }
+
+    @Test
+    void postRejectsUrlEncodedCharacters() {
+        MultiValueMap<String, Object> body = new LinkedMultiValueMap<>();
+        assertThrows(
+                SecurityException.class, () -> client.post("/api/v1/misc/%2e%2e/actuator", body));
+    }
+
+    @Test
+    void postRejectsQueryString() {
+        MultiValueMap<String, Object> body = new LinkedMultiValueMap<>();
+        assertThrows(
+                SecurityException.class,
+                () -> client.post("/api/v1/misc/compress-pdf?redirect=evil", body));
+    }
+
+    @Test
+    void postRejectsEmptySegment() {
+        MultiValueMap<String, Object> body = new LinkedMultiValueMap<>();
+        assertThrows(SecurityException.class, () -> client.post("/api/v1/misc//foo", body));
+    }
+
+    @Test
+    void postRejectsTrailingSlash() {
+        MultiValueMap<String, Object> body = new LinkedMultiValueMap<>();
+        assertThrows(SecurityException.class, () -> client.post("/api/v1/misc/foo/", body));
+    }
+
+    @Test
+    void postRejectsNullPath() {
+        MultiValueMap<String, Object> body = new LinkedMultiValueMap<>();
+        assertThrows(SecurityException.class, () -> client.post(null, body));
+    }
+
+    /** Create a ByteArrayResource with a filename (required for multipart). */
+    private static Resource namedResource(String filename, String content) {
+        return new ByteArrayResource(content.getBytes(StandardCharsets.UTF_8)) {
+            @Override
+            public String getFilename() {
+                return filename;
+            }
+        };
+    }
+
+    /** Simulate a successful HTTP response through a RestTemplate ResponseExtractor. */
+    @SuppressWarnings("unchecked")
+    private static ResponseEntity<Resource> fakeOkResponse(Object extractorArg) throws Exception {
+        var extractor = (ResponseExtractor<ResponseEntity<Resource>>) extractorArg;
+        ClientHttpResponse response = mock(ClientHttpResponse.class);
+        when(response.getBody())
+                .thenReturn(new ByteArrayInputStream("ok".getBytes(StandardCharsets.UTF_8)));
+        HttpHeaders headers = new HttpHeaders();
+        headers.add(HttpHeaders.CONTENT_DISPOSITION, "attachment; filename=\"out.pdf\"");
+        when(response.getHeaders()).thenReturn(headers);
+        lenient().when(response.getStatusCode()).thenReturn(HttpStatus.OK);
+        return extractor.extractData(response);
+    }
+}
diff --git a/app/common/src/test/java/stirling/software/common/util/FormUtilsAdditionalTest.java b/app/common/src/test/java/stirling/software/common/util/FormUtilsAdditionalTest.java
index 266639f690..5a605af353 100644
--- a/app/common/src/test/java/stirling/software/common/util/FormUtilsAdditionalTest.java
+++ b/app/common/src/test/java/stirling/software/common/util/FormUtilsAdditionalTest.java
@@ -3,6 +3,7 @@ package stirling.software.common.util;
 import static org.junit.jupiter.api.Assertions.*;
 
 import java.io.IOException;
+import java.time.Duration;
 import java.util.ArrayList;
 import java.util.Collections;
 import java.util.List;
@@ -249,6 +250,60 @@ class FormUtilsAdditionalTest {
         }
     }
 
+    // Regression: PDFBOX-5962. Flattening with an empty values map used to force
+    // setNeedAppearances(true), triggering PDFBox's refreshAppearances loop which
+    // could hang indefinitely. The call must complete quickly and clear form fields.
+    @Test
+    void testApplyFieldValues_emptyValuesWithFlatten_completesAndFlattens() throws IOException {
+        try (PDDocument doc = new PDDocument()) {
+            SetupDocument setup = createBasicDocument(doc);
+            PDTextField textField = new PDTextField(setup.acroForm);
+            textField.setPartialName("company");
+            attachWidget(setup, textField, new PDRectangle(60, 720, 220, 20));
+
+            assertTrue(setup.acroForm.getNeedAppearances());
+
+            assertTimeoutPreemptively(
+                    Duration.ofSeconds(10),
+                    () -> FormUtils.applyFieldValues(doc, Map.of(), true, false));
+
+            PDAcroForm after = doc.getDocumentCatalog().getAcroForm();
+            assertTrue(after == null || after.getFields().isEmpty());
+        }
+    }
+
+    @Test
+    void testApplyFieldValues_nullValuesWithFlatten_completesAndFlattens() throws IOException {
+        try (PDDocument doc = new PDDocument()) {
+            SetupDocument setup = createBasicDocument(doc);
+            PDTextField textField = new PDTextField(setup.acroForm);
+            textField.setPartialName("company");
+            attachWidget(setup, textField, new PDRectangle(60, 720, 220, 20));
+
+            assertTimeoutPreemptively(
+                    Duration.ofSeconds(10),
+                    () -> FormUtils.applyFieldValues(doc, null, true, false));
+
+            PDAcroForm after = doc.getDocumentCatalog().getAcroForm();
+            assertTrue(after == null || after.getFields().isEmpty());
+        }
+    }
+
+    @Test
+    void testApplyFieldValues_valuesWithFlatten_appliesValueAndFlattens() throws IOException {
+        try (PDDocument doc = new PDDocument()) {
+            SetupDocument setup = createBasicDocument(doc);
+            PDTextField textField = new PDTextField(setup.acroForm);
+            textField.setPartialName("company");
+            attachWidget(setup, textField, new PDRectangle(60, 720, 220, 20));
+
+            FormUtils.applyFieldValues(doc, Map.of("company", "Stirling"), true, false);
+
+            PDAcroForm after = doc.getDocumentCatalog().getAcroForm();
+            assertTrue(after == null || after.getFields().isEmpty());
+        }
+    }
+
     // --- filterSingleChoiceSelection ---
 
     @Test
diff --git a/app/common/src/test/java/stirling/software/common/util/PDFToFileTest.java b/app/common/src/test/java/stirling/software/common/util/PDFToFileTest.java
index 459b64a45c..69db94c34b 100644
--- a/app/common/src/test/java/stirling/software/common/util/PDFToFileTest.java
+++ b/app/common/src/test/java/stirling/software/common/util/PDFToFileTest.java
@@ -9,6 +9,7 @@ import static org.mockito.Mockito.lenient;
 import static org.mockito.Mockito.mockStatic;
 import static org.mockito.Mockito.when;
 
+import java.io.ByteArrayOutputStream;
 import java.io.File;
 import java.io.IOException;
 import java.nio.file.Files;
@@ -29,6 +30,7 @@ import org.springframework.http.MediaType;
 import org.springframework.http.ResponseEntity;
 import org.springframework.mock.web.MockMultipartFile;
 import org.springframework.web.multipart.MultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import io.github.pixee.security.ZipSecurity;
 
@@ -59,6 +61,19 @@ class PDFToFileTest {
                 .thenAnswer(
                         invocation ->
                                 Files.createTempFile("test", invocation.getArgument(0)).toFile());
+        lenient()
+                .when(mockTempFileManager.createManagedTempFile(anyString()))
+                .thenAnswer(
+                        invocation -> {
+                            File f =
+                                    Files.createTempFile("test", invocation.<String>getArgument(0))
+                                            .toFile();
+                            TempFile tf = org.mockito.Mockito.mock(TempFile.class);
+                            lenient().when(tf.getFile()).thenReturn(f);
+                            lenient().when(tf.getPath()).thenReturn(f.toPath());
+                            lenient().when(tf.getAbsolutePath()).thenReturn(f.getAbsolutePath());
+                            return tf;
+                        });
         lenient()
                 .when(mockTempFileManager.createTempDirectory())
                 .thenAnswer(invocation -> Files.createTempDirectory("test"));
@@ -68,6 +83,12 @@ class PDFToFileTest {
         pdfToFile = new PDFToFile(mockTempFileManager, mockRuntimePathConfig);
     }
 
+    private static byte[] drain(ResponseEntity<StreamingResponseBody> response) throws IOException {
+        ByteArrayOutputStream baos = new ByteArrayOutputStream();
+        response.getBody().writeTo(baos);
+        return baos.toByteArray();
+    }
+
     @Test
     void testProcessPdfToMarkdown_InvalidContentType() throws IOException, InterruptedException {
         // Prepare
@@ -79,7 +100,7 @@ class PDFToFileTest {
                         "This is not a PDF".getBytes());
 
         // Execute
-        ResponseEntity<byte[]> response = pdfToFile.processPdfToMarkdown(nonPdfFile);
+        ResponseEntity<StreamingResponseBody> response = pdfToFile.processPdfToMarkdown(nonPdfFile);
 
         // Verify
         assertEquals(HttpStatus.BAD_REQUEST, response.getStatusCode());
@@ -96,7 +117,7 @@ class PDFToFileTest {
                         "This is not a PDF".getBytes());
 
         // Execute
-        ResponseEntity<byte[]> response = pdfToFile.processPdfToHtml(nonPdfFile);
+        ResponseEntity<StreamingResponseBody> response = pdfToFile.processPdfToHtml(nonPdfFile);
 
         // Verify
         assertEquals(HttpStatus.BAD_REQUEST, response.getStatusCode());
@@ -114,7 +135,7 @@ class PDFToFileTest {
                         "This is not a PDF".getBytes());
 
         // Execute
-        ResponseEntity<byte[]> response =
+        ResponseEntity<StreamingResponseBody> response =
                 pdfToFile.processPdfToOfficeFormat(nonPdfFile, "docx", "draw_pdf_import");
 
         // Verify
@@ -133,7 +154,7 @@ class PDFToFileTest {
                         "Fake PDF content".getBytes());
 
         // Execute with invalid format
-        ResponseEntity<byte[]> response =
+        ResponseEntity<StreamingResponseBody> response =
                 pdfToFile.processPdfToOfficeFormat(pdfFile, "invalid_format", "draw_pdf_import");
 
         // Verify
@@ -184,12 +205,14 @@ class PDFToFileTest {
                             });
 
             // Execute the method
-            ResponseEntity<byte[]> response = pdfToFile.processPdfToMarkdown(pdfFile);
+            ResponseEntity<StreamingResponseBody> response =
+                    pdfToFile.processPdfToMarkdown(pdfFile);
 
             // Verify - should now return a ZIP file instead of plain markdown
             assertEquals(HttpStatus.OK, response.getStatusCode());
-            assertNotNull(response.getBody());
-            assertTrue(response.getBody().length > 0);
+            byte[] bodyBytes = drain(response);
+            assertNotNull(bodyBytes);
+            assertTrue(bodyBytes.length > 0);
 
             // Verify content disposition indicates a ZIP file
             assertTrue(
@@ -201,7 +224,7 @@ class PDFToFileTest {
             // Verify the content by unzipping it
             try (ZipInputStream zipStream =
                     ZipSecurity.createHardenedInputStream(
-                            new java.io.ByteArrayInputStream(response.getBody()))) {
+                            new java.io.ByteArrayInputStream(bodyBytes))) {
                 ZipEntry entry;
                 boolean foundMdFile = false;
                 boolean foundImageInFolder = false;
@@ -275,12 +298,14 @@ class PDFToFileTest {
                             });
 
             // Execute the method
-            ResponseEntity<byte[]> response = pdfToFile.processPdfToMarkdown(pdfFile);
+            ResponseEntity<StreamingResponseBody> response =
+                    pdfToFile.processPdfToMarkdown(pdfFile);
 
             // Verify
             assertEquals(HttpStatus.OK, response.getStatusCode());
-            assertNotNull(response.getBody());
-            assertTrue(response.getBody().length > 0);
+            byte[] bodyBytes = drain(response);
+            assertNotNull(bodyBytes);
+            assertTrue(bodyBytes.length > 0);
 
             // Verify content disposition indicates a zip file
             assertTrue(
@@ -292,7 +317,7 @@ class PDFToFileTest {
             // Verify the content by unzipping it
             try (ZipInputStream zipStream =
                     ZipSecurity.createHardenedInputStream(
-                            new java.io.ByteArrayInputStream(response.getBody()))) {
+                            new java.io.ByteArrayInputStream(bodyBytes))) {
                 ZipEntry entry;
                 boolean foundMdFiles = false;
                 boolean foundImage = false;
@@ -352,12 +377,13 @@ class PDFToFileTest {
                             });
 
             // Execute the method
-            ResponseEntity<byte[]> response = pdfToFile.processPdfToHtml(pdfFile);
+            ResponseEntity<StreamingResponseBody> response = pdfToFile.processPdfToHtml(pdfFile);
 
             // Verify
             assertEquals(HttpStatus.OK, response.getStatusCode());
-            assertNotNull(response.getBody());
-            assertTrue(response.getBody().length > 0);
+            byte[] bodyBytes = drain(response);
+            assertNotNull(bodyBytes);
+            assertTrue(bodyBytes.length > 0);
 
             // Verify content disposition indicates a zip file
             assertTrue(
@@ -369,7 +395,7 @@ class PDFToFileTest {
             // Verify the content by unzipping it
             try (ZipInputStream zipStream =
                     ZipSecurity.createHardenedInputStream(
-                            new java.io.ByteArrayInputStream(response.getBody()))) {
+                            new java.io.ByteArrayInputStream(bodyBytes))) {
                 ZipEntry entry;
                 boolean foundMainHtml = false;
                 boolean foundIndexHtml = false;
@@ -437,13 +463,14 @@ class PDFToFileTest {
                             });
 
             // Execute the method with docx format
-            ResponseEntity<byte[]> response =
+            ResponseEntity<StreamingResponseBody> response =
                     pdfToFile.processPdfToOfficeFormat(pdfFile, "docx", "draw_pdf_import");
 
             // Verify
             assertEquals(HttpStatus.OK, response.getStatusCode());
-            assertNotNull(response.getBody());
-            assertTrue(response.getBody().length > 0);
+            byte[] bodyBytes = drain(response);
+            assertNotNull(bodyBytes);
+            assertTrue(bodyBytes.length > 0);
 
             // Verify content disposition has correct filename
             assertTrue(
@@ -508,13 +535,14 @@ class PDFToFileTest {
                             });
 
             // Execute the method with ODP format
-            ResponseEntity<byte[]> response =
+            ResponseEntity<StreamingResponseBody> response =
                     pdfToFile.processPdfToOfficeFormat(pdfFile, "odp", "draw_pdf_import");
 
             // Verify
             assertEquals(HttpStatus.OK, response.getStatusCode());
-            assertNotNull(response.getBody());
-            assertTrue(response.getBody().length > 0);
+            byte[] bodyBytes = drain(response);
+            assertNotNull(bodyBytes);
+            assertTrue(bodyBytes.length > 0);
 
             // Verify content disposition for zip file
             assertTrue(
@@ -526,7 +554,7 @@ class PDFToFileTest {
             // Verify the content by unzipping it
             try (ZipInputStream zipStream =
                     ZipSecurity.createHardenedInputStream(
-                            new java.io.ByteArrayInputStream(response.getBody()))) {
+                            new java.io.ByteArrayInputStream(bodyBytes))) {
                 ZipEntry entry;
                 boolean foundMainFile = false;
                 boolean foundMediaFiles = false;
@@ -592,13 +620,14 @@ class PDFToFileTest {
                             });
 
             // Execute the method with text format
-            ResponseEntity<byte[]> response =
+            ResponseEntity<StreamingResponseBody> response =
                     pdfToFile.processPdfToOfficeFormat(pdfFile, "txt:Text", "draw_pdf_import");
 
             // Verify
             assertEquals(HttpStatus.OK, response.getStatusCode());
-            assertNotNull(response.getBody());
-            assertTrue(response.getBody().length > 0);
+            byte[] bodyBytes = drain(response);
+            assertNotNull(bodyBytes);
+            assertTrue(bodyBytes.length > 0);
 
             // Verify content disposition has txt extension
             assertTrue(
@@ -650,13 +679,14 @@ class PDFToFileTest {
                             });
 
             // Execute the method
-            ResponseEntity<byte[]> response =
+            ResponseEntity<StreamingResponseBody> response =
                     pdfToFile.processPdfToOfficeFormat(pdfFile, "docx", "draw_pdf_import");
 
             // Verify
             assertEquals(HttpStatus.OK, response.getStatusCode());
-            assertNotNull(response.getBody());
-            assertTrue(response.getBody().length > 0);
+            byte[] bodyBytes = drain(response);
+            assertNotNull(bodyBytes);
+            assertTrue(bodyBytes.length > 0);
 
             // Verify content disposition contains output.docx
             assertTrue(
@@ -696,12 +726,13 @@ class PDFToFileTest {
                                 return mockExecutorResult;
                             });
 
-            ResponseEntity<byte[]> response =
+            ResponseEntity<StreamingResponseBody> response =
                     pdfToFileWithUno.processPdfToOfficeFormat(pdfFile, "docx", "writer_pdf_import");
 
             assertEquals(HttpStatus.OK, response.getStatusCode());
-            assertNotNull(response.getBody());
-            assertTrue(response.getBody().length > 0);
+            byte[] bodyBytes = drain(response);
+            assertNotNull(bodyBytes);
+            assertTrue(bodyBytes.length > 0);
             assertTrue(
                     response.getHeaders()
                             .getContentDisposition()
@@ -759,12 +790,13 @@ class PDFToFileTest {
                                 return mockExecutorResult;
                             });
 
-            ResponseEntity<byte[]> response =
+            ResponseEntity<StreamingResponseBody> response =
                     pdfToFileWithUno.processPdfToOfficeFormat(pdfFile, "docx", "writer_pdf_import");
 
             assertEquals(HttpStatus.OK, response.getStatusCode());
-            assertNotNull(response.getBody());
-            assertTrue(response.getBody().length > 0);
+            byte[] bodyBytes = drain(response);
+            assertNotNull(bodyBytes);
+            assertTrue(bodyBytes.length > 0);
             assertTrue(
                     response.getHeaders()
                             .getContentDisposition()
diff --git a/app/core/build.gradle b/app/core/build.gradle
index 48d488b9ab..202351a650 100644
--- a/app/core/build.gradle
+++ b/app/core/build.gradle
@@ -14,6 +14,8 @@ spotless {
         target 'src/**/java/**/*.java'
         targetExclude 'src/main/resources/static/**', 'src/main/java/org/apache/**'
         googleJavaFormat(googleJavaFormatVersion).aosp().reorderImports(false)
+        // google-java-format 1.28.0 bundles Guava 32.x which crashes Spotless lint on JDK 24/25
+        suppressLintsFor { setStep('google-java-format') }
 
         importOrder("java", "javax", "org", "com", "net", "io", "jakarta", "lombok", "me", "stirling")
         trimTrailingWhitespace()
@@ -66,7 +68,7 @@ dependencies {
     implementation 'commons-io:commons-io:2.21.0'
     implementation "org.bouncycastle:bcprov-jdk18on:$bouncycastleVersion"
     implementation "org.bouncycastle:bcpkix-jdk18on:$bouncycastleVersion"
-    implementation 'io.micrometer:micrometer-core:1.16.2'
+    implementation 'io.micrometer:micrometer-core'
     implementation 'com.google.zxing:core:3.5.4'
     implementation "org.commonmark:commonmark:$commonmarkVersion" // https://mvnrepository.com/artifact/org.commonmark/commonmark
     implementation "org.commonmark:commonmark-ext-gfm-tables:$commonmarkVersion"
@@ -82,7 +84,7 @@ dependencies {
     // veraPDF still uses javax.xml.bind, not the new jakarta namespace
     implementation 'javax.xml.bind:jaxb-api:2.3.1'
     implementation 'com.sun.xml.bind:jaxb-impl:2.3.9'
-    implementation 'com.sun.xml.bind:jaxb-core:4.0.6'
+    implementation 'com.sun.xml.bind:jaxb-core:4.0.7'
     implementation 'org.apache.poi:poi-ooxml:5.5.1'
 
     // https://mvnrepository.com/artifact/technology.tabula/tabula
@@ -176,6 +178,7 @@ springBoot {
 
 // Frontend build tasks - only enabled with -PbuildWithFrontend=true
 def buildWithFrontend = project.hasProperty('buildWithFrontend') && project.property('buildWithFrontend') == 'true'
+def buildPrototypes = project.hasProperty('prototypesMode') && project.property('prototypesMode') == 'true'
 def frontendDir = file('../../frontend')
 def frontendDistDir = file('../../frontend/dist')
 def resourcesStaticDir = file('src/main/resources/static')
@@ -243,9 +246,8 @@ tasks.register('npmBuild', Exec) {
     enabled = buildWithFrontend
     group = 'frontend'
     description = 'Build frontend application'
-    workingDir frontendDir
-    commandLine = Os.isFamily(Os.FAMILY_WINDOWS) ? ['cmd', '/c', 'npm', 'run', 'build'] : ['npm', 'run', 'build']
-    dependsOn npmInstall
+    workingDir file('../..')
+    commandLine = buildPrototypes ? ['task', 'frontend:build:prototypes'] : ['task', 'frontend:build']
     inputs.dir(new File(frontendDir, 'src'))
     inputs.dir(new File(frontendDir, 'public'))
     inputs.file(new File(frontendDir, 'package.json'))
diff --git a/app/core/src/main/java/stirling/software/SPDF/config/ExternalAppDepConfig.java b/app/core/src/main/java/stirling/software/SPDF/config/ExternalAppDepConfig.java
index 1a75c60f31..c08e53e1ab 100644
--- a/app/core/src/main/java/stirling/software/SPDF/config/ExternalAppDepConfig.java
+++ b/app/core/src/main/java/stirling/software/SPDF/config/ExternalAppDepConfig.java
@@ -73,7 +73,8 @@ public class ExternalAppDepConfig {
         tmp.put("tesseract", List.of("tesseract"));
         tmp.put("rar", List.of("rar")); // Required for real CBR output
         tmp.put(calibrePath, List.of("Calibre"));
-        tmp.put("ffmpeg", List.of("FFmpeg"));
+        // ffmpeg disabled due to raised CVEs
+        // tmp.put("ffmpeg", List.of("FFmpeg"));
         tmp.put("magick", List.of("ImageMagick"));
         this.commandToGroupMapping = Collections.unmodifiableMap(tmp);
     }
diff --git a/app/core/src/main/java/stirling/software/SPDF/config/OpenApiConfig.java b/app/core/src/main/java/stirling/software/SPDF/config/OpenApiConfig.java
index a3712bf975..205a0d5734 100644
--- a/app/core/src/main/java/stirling/software/SPDF/config/OpenApiConfig.java
+++ b/app/core/src/main/java/stirling/software/SPDF/config/OpenApiConfig.java
@@ -47,7 +47,7 @@ public class OpenApiConfig {
                         .version(version)
                         .license(
                                 new License()
-                                        .name("MIT")
+                                        .name("Open-Core - MIT Licensed")
                                         .url(
                                                 "https://raw.githubusercontent.com/Stirling-Tools/Stirling-PDF/refs/heads/main/LICENSE"))
                         .termsOfService("https://www.stirlingpdf.com/terms")
diff --git a/app/core/src/main/java/stirling/software/SPDF/config/SpringDocConfig.java b/app/core/src/main/java/stirling/software/SPDF/config/SpringDocConfig.java
index 6733eb22dc..42c9e97b35 100644
--- a/app/core/src/main/java/stirling/software/SPDF/config/SpringDocConfig.java
+++ b/app/core/src/main/java/stirling/software/SPDF/config/SpringDocConfig.java
@@ -28,7 +28,17 @@ public class SpringDocConfig {
                         "/api/v1/proprietary/ui-data/**",
                         "/api/v1/info/**",
                         "/api/v1/general/job/**",
-                        "/api/v1/general/files/**")
+                        "/api/v1/general/files/**",
+                        "/api/v1/general/signatures/**",
+                        "/api/v1/database/**",
+                        "/api/v1/storage/**",
+                        "/api/v1/proprietary/signatures/**",
+                        "/api/v1/workflow/participant/**",
+                        "/api/v1/security/cert-sign/sessions",
+                        "/api/v1/security/cert-sign/sessions/**",
+                        "/api/v1/security/cert-sign/sign-requests",
+                        "/api/v1/security/cert-sign/sign-requests/**",
+                        "/api/v1/security/cert-sign/validate-certificate")
                 .addOpenApiCustomizer(pdfFileOneOfCustomizer)
                 .addOpenApiCustomizer(
                         openApi -> {
@@ -53,7 +63,16 @@ public class SpringDocConfig {
                         "/api/v1/team/**",
                         "/api/v1/auth/**",
                         "/api/v1/invite/**",
-                        "/api/v1/audit/**")
+                        "/api/v1/audit/**",
+                        "/api/v1/database/**",
+                        "/api/v1/storage/**",
+                        "/api/v1/proprietary/signatures/**",
+                        "/api/v1/workflow/participant/**",
+                        "/api/v1/security/cert-sign/sessions",
+                        "/api/v1/security/cert-sign/sessions/**",
+                        "/api/v1/security/cert-sign/sign-requests",
+                        "/api/v1/security/cert-sign/sign-requests/**",
+                        "/api/v1/security/cert-sign/validate-certificate")
                 .addOpenApiCustomizer(
                         openApi -> {
                             openApi.info(
@@ -75,7 +94,8 @@ public class SpringDocConfig {
                         "/api/v1/proprietary/ui-data/**",
                         "/api/v1/info/**",
                         "/api/v1/general/job/**",
-                        "/api/v1/general/files/**")
+                        "/api/v1/general/files/**",
+                        "/api/v1/general/signatures/**")
                 .addOpenApiCustomizer(
                         openApi -> {
                             openApi.info(
diff --git a/app/core/src/main/java/stirling/software/SPDF/config/TauriProcessMonitor.java b/app/core/src/main/java/stirling/software/SPDF/config/TauriProcessMonitor.java
index 9ec1bb37e6..2d5ca8b17c 100644
--- a/app/core/src/main/java/stirling/software/SPDF/config/TauriProcessMonitor.java
+++ b/app/core/src/main/java/stirling/software/SPDF/config/TauriProcessMonitor.java
@@ -1,7 +1,6 @@
 package stirling.software.SPDF.config;
 
 import java.lang.management.ManagementFactory;
-import java.util.concurrent.CompletableFuture;
 import java.util.concurrent.Executors;
 import java.util.concurrent.ScheduledExecutorService;
 import java.util.concurrent.TimeUnit;
@@ -106,25 +105,27 @@ public class TauriProcessMonitor {
         logger.info("Orphaned Java backend detected. Shutting down gracefully...");
 
         // Shutdown asynchronously to avoid blocking the monitor thread
-        CompletableFuture.runAsync(
-                () -> {
-                    try {
-                        // Give a small delay to ensure logging completes
-                        Thread.sleep(1000);
+        Thread.ofVirtual()
+                .name("tauri-graceful-shutdown")
+                .start(
+                        () -> {
+                            try {
+                                // Give a small delay to ensure logging completes
+                                Thread.sleep(1000);
 
-                        if (applicationContext instanceof ConfigurableApplicationContext) {
-                            ((ConfigurableApplicationContext) applicationContext).close();
-                        } else {
-                            // Fallback to system exit
-                            logger.warn(
-                                    "Unable to shutdown Spring context gracefully, using System.exit");
-                            System.exit(0);
-                        }
-                    } catch (Exception e) {
-                        logger.error("Error during graceful shutdown", e);
-                        System.exit(1);
-                    }
-                });
+                                if (applicationContext instanceof ConfigurableApplicationContext) {
+                                    ((ConfigurableApplicationContext) applicationContext).close();
+                                } else {
+                                    // Fallback to system exit
+                                    logger.warn(
+                                            "Unable to shutdown Spring context gracefully, using System.exit");
+                                    System.exit(0);
+                                }
+                            } catch (Exception e) {
+                                logger.error("Error during graceful shutdown", e);
+                                System.exit(1);
+                            }
+                        });
     }
 
     @PreDestroy
diff --git a/app/core/src/main/java/stirling/software/SPDF/controller/api/BookletImpositionController.java b/app/core/src/main/java/stirling/software/SPDF/controller/api/BookletImpositionController.java
index fdf3c716f2..8a3313e881 100644
--- a/app/core/src/main/java/stirling/software/SPDF/controller/api/BookletImpositionController.java
+++ b/app/core/src/main/java/stirling/software/SPDF/controller/api/BookletImpositionController.java
@@ -1,7 +1,6 @@
 package stirling.software.SPDF.controller.api;
 
 import java.awt.*;
-import java.io.ByteArrayOutputStream;
 import java.io.IOException;
 import java.util.ArrayList;
 import java.util.List;
@@ -19,6 +18,7 @@ import org.springframework.web.bind.annotation.ModelAttribute;
 import org.springframework.web.bind.annotation.RequestMapping;
 import org.springframework.web.bind.annotation.RestController;
 import org.springframework.web.multipart.MultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import io.github.pixee.security.Filenames;
 import io.swagger.v3.oas.annotations.Operation;
@@ -30,6 +30,7 @@ import stirling.software.SPDF.model.api.general.BookletImpositionRequest;
 import stirling.software.common.annotations.AutoJobPostMapping;
 import stirling.software.common.service.CustomPDFDocumentFactory;
 import stirling.software.common.util.GeneralUtils;
+import stirling.software.common.util.TempFileManager;
 import stirling.software.common.util.WebResponseUtils;
 
 @RestController
@@ -39,6 +40,7 @@ import stirling.software.common.util.WebResponseUtils;
 public class BookletImpositionController {
 
     private final CustomPDFDocumentFactory pdfDocumentFactory;
+    private final TempFileManager tempFileManager;
 
     @AutoJobPostMapping(
             value = "/booklet-imposition",
@@ -49,7 +51,7 @@ public class BookletImpositionController {
                     "This operation combines page reordering for booklet printing with multi-page layout. "
                             + "It rearranges pages in the correct order for booklet printing and places multiple pages "
                             + "on each sheet for proper folding and binding. Input:PDF Output:PDF Type:SISO")
-    public ResponseEntity<byte[]> createBookletImposition(
+    public ResponseEntity<StreamingResponseBody> createBookletImposition(
             @ModelAttribute BookletImpositionRequest request) throws IOException {
 
         MultipartFile file = request.getFileInput();
@@ -85,15 +87,12 @@ public class BookletImpositionController {
                             duplexPass,
                             flipOnShortEdge)) {
 
-                ByteArrayOutputStream baos = new ByteArrayOutputStream();
-                newDocument.save(baos);
-
-                byte[] result = baos.toByteArray();
-                return WebResponseUtils.bytesToWebResponse(
-                        result,
+                return WebResponseUtils.pdfDocToWebResponse(
+                        newDocument,
                         GeneralUtils.generateFilename(
                                 Filenames.toSimpleFileName(file.getOriginalFilename()),
-                                "_booklet.pdf"));
+                                "_booklet.pdf"),
+                        tempFileManager);
             }
         }
     }
diff --git a/app/core/src/main/java/stirling/software/SPDF/controller/api/CropController.java b/app/core/src/main/java/stirling/software/SPDF/controller/api/CropController.java
index 5e9eca5510..845d3519cd 100644
--- a/app/core/src/main/java/stirling/software/SPDF/controller/api/CropController.java
+++ b/app/core/src/main/java/stirling/software/SPDF/controller/api/CropController.java
@@ -1,10 +1,7 @@
 package stirling.software.SPDF.controller.api;
 
 import java.awt.image.BufferedImage;
-import java.io.ByteArrayOutputStream;
 import java.io.IOException;
-import java.nio.file.Files;
-import java.nio.file.Path;
 import java.util.List;
 
 import org.apache.pdfbox.multipdf.LayerUtility;
@@ -18,6 +15,7 @@ import org.apache.pdfbox.rendering.PDFRenderer;
 import org.springframework.http.MediaType;
 import org.springframework.http.ResponseEntity;
 import org.springframework.web.bind.annotation.ModelAttribute;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import io.swagger.v3.oas.annotations.Operation;
 
@@ -32,6 +30,8 @@ import stirling.software.common.service.CustomPDFDocumentFactory;
 import stirling.software.common.util.ExceptionUtils;
 import stirling.software.common.util.GeneralUtils;
 import stirling.software.common.util.ProcessExecutor;
+import stirling.software.common.util.TempFile;
+import stirling.software.common.util.TempFileManager;
 import stirling.software.common.util.WebResponseUtils;
 
 @GeneralApi
@@ -46,6 +46,7 @@ public class CropController {
     private static final String PDF_EXTENSION = ".pdf";
 
     private final CustomPDFDocumentFactory pdfDocumentFactory;
+    private final TempFileManager tempFileManager;
 
     private static int[] detectContentBounds(BufferedImage image) {
         int width = image.getWidth();
@@ -131,7 +132,8 @@ public class CropController {
             description =
                     "This operation takes an input PDF file and crops it according to the given"
                             + " coordinates. Input:PDF Output:PDF Type:SISO")
-    public ResponseEntity<byte[]> cropPdf(@ModelAttribute CropPdfForm request) throws IOException {
+    public ResponseEntity<StreamingResponseBody> cropPdf(@ModelAttribute CropPdfForm request)
+            throws IOException {
         if (request.isAutoCrop()) {
             return cropWithAutomaticDetection(request);
         }
@@ -151,8 +153,8 @@ public class CropController {
         }
     }
 
-    private ResponseEntity<byte[]> cropWithAutomaticDetection(@ModelAttribute CropPdfForm request)
-            throws IOException {
+    private ResponseEntity<StreamingResponseBody> cropWithAutomaticDetection(
+            @ModelAttribute CropPdfForm request) throws IOException {
         try (PDDocument sourceDocument = pdfDocumentFactory.load(request)) {
 
             try (PDDocument newDocument =
@@ -196,20 +198,17 @@ public class CropController {
                                     cropBounds.height));
                 }
 
-                ByteArrayOutputStream baos = new ByteArrayOutputStream();
-                newDocument.save(baos);
-                byte[] pdfContent = baos.toByteArray();
-
-                return WebResponseUtils.bytesToWebResponse(
-                        pdfContent,
+                return WebResponseUtils.pdfDocToWebResponse(
+                        newDocument,
                         GeneralUtils.generateFilename(
-                                request.getFileInput().getOriginalFilename(), "_cropped.pdf"));
+                                request.getFileInput().getOriginalFilename(), "_cropped.pdf"),
+                        tempFileManager);
             }
         }
     }
 
-    private ResponseEntity<byte[]> cropWithPDFBox(@ModelAttribute CropPdfForm request)
-            throws IOException {
+    private ResponseEntity<StreamingResponseBody> cropWithPDFBox(
+            @ModelAttribute CropPdfForm request) throws IOException {
         try (PDDocument sourceDocument = pdfDocumentFactory.load(request)) {
 
             try (PDDocument newDocument =
@@ -255,22 +254,19 @@ public class CropController {
                                     request.getHeight()));
                 }
 
-                ByteArrayOutputStream baos = new ByteArrayOutputStream();
-                newDocument.save(baos);
-
-                byte[] pdfContent = baos.toByteArray();
-                return WebResponseUtils.bytesToWebResponse(
-                        pdfContent,
+                return WebResponseUtils.pdfDocToWebResponse(
+                        newDocument,
                         GeneralUtils.generateFilename(
-                                request.getFileInput().getOriginalFilename(), "_cropped.pdf"));
+                                request.getFileInput().getOriginalFilename(), "_cropped.pdf"),
+                        tempFileManager);
             }
         }
     }
 
-    private ResponseEntity<byte[]> cropWithGhostscript(@ModelAttribute CropPdfForm request)
-            throws IOException {
-        Path tempInputFile = null;
-        Path tempOutputFile = null;
+    private ResponseEntity<StreamingResponseBody> cropWithGhostscript(
+            @ModelAttribute CropPdfForm request) throws IOException {
+        TempFile tempInputFile = null;
+        TempFile tempOutputFile = null;
 
         try (PDDocument sourceDocument = pdfDocumentFactory.load(request)) {
             for (int i = 0; i < sourceDocument.getNumberOfPages(); i++) {
@@ -284,11 +280,11 @@ public class CropController {
                 page.setCropBox(cropBox);
             }
 
-            tempInputFile = Files.createTempFile(TEMP_INPUT_PREFIX, PDF_EXTENSION);
-            tempOutputFile = Files.createTempFile(TEMP_OUTPUT_PREFIX, PDF_EXTENSION);
+            tempInputFile = tempFileManager.createManagedTempFile(PDF_EXTENSION);
+            tempOutputFile = tempFileManager.createManagedTempFile(PDF_EXTENSION);
 
             // Save the source document with crop boxes
-            sourceDocument.save(tempInputFile.toFile());
+            sourceDocument.save(tempInputFile.getFile());
 
             // Execute Ghostscript to process the crop boxes
             ProcessExecutor processExecutor =
@@ -299,15 +295,15 @@ public class CropController {
                             "-sDEVICE=pdfwrite",
                             "-dUseCropBox",
                             "-o",
-                            tempOutputFile.toString(),
-                            tempInputFile.toString());
+                            tempOutputFile.getAbsolutePath(),
+                            tempInputFile.getAbsolutePath());
 
             processExecutor.runCommandWithOutputHandling(command);
 
-            byte[] pdfContent = Files.readAllBytes(tempOutputFile);
-
-            return WebResponseUtils.bytesToWebResponse(
-                    pdfContent,
+            TempFile out = tempOutputFile;
+            tempOutputFile = null; // ownership transferred to StreamingResponseBody
+            return WebResponseUtils.pdfFileToWebResponse(
+                    out,
                     GeneralUtils.generateFilename(
                             request.getFileInput().getOriginalFilename(), "_cropped.pdf"));
 
@@ -316,10 +312,10 @@ public class CropController {
             throw ExceptionUtils.createProcessingInterruptedException("Ghostscript", e);
         } finally {
             if (tempInputFile != null) {
-                Files.deleteIfExists(tempInputFile);
+                tempInputFile.close();
             }
             if (tempOutputFile != null) {
-                Files.deleteIfExists(tempOutputFile);
+                tempOutputFile.close();
             }
         }
     }
diff --git a/app/core/src/main/java/stirling/software/SPDF/controller/api/EditTableOfContentsController.java b/app/core/src/main/java/stirling/software/SPDF/controller/api/EditTableOfContentsController.java
index c97ca11256..bd51dfbd16 100644
--- a/app/core/src/main/java/stirling/software/SPDF/controller/api/EditTableOfContentsController.java
+++ b/app/core/src/main/java/stirling/software/SPDF/controller/api/EditTableOfContentsController.java
@@ -1,6 +1,5 @@
 package stirling.software.SPDF.controller.api;
 
-import java.io.ByteArrayOutputStream;
 import java.util.ArrayList;
 import java.util.HashMap;
 import java.util.List;
@@ -14,6 +13,7 @@ import org.springframework.http.MediaType;
 import org.springframework.http.ResponseEntity;
 import org.springframework.web.bind.annotation.*;
 import org.springframework.web.multipart.MultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import io.swagger.v3.oas.annotations.Operation;
 
@@ -27,6 +27,7 @@ import stirling.software.common.annotations.AutoJobPostMapping;
 import stirling.software.common.annotations.api.GeneralApi;
 import stirling.software.common.service.CustomPDFDocumentFactory;
 import stirling.software.common.util.GeneralUtils;
+import stirling.software.common.util.TempFileManager;
 import stirling.software.common.util.WebResponseUtils;
 
 import tools.jackson.core.type.TypeReference;
@@ -39,6 +40,7 @@ public class EditTableOfContentsController {
 
     private final CustomPDFDocumentFactory pdfDocumentFactory;
     private final ObjectMapper objectMapper;
+    private final TempFileManager tempFileManager;
 
     @AutoJobPostMapping(
             value = "/extract-bookmarks",
@@ -149,12 +151,11 @@ public class EditTableOfContentsController {
     @Operation(
             summary = "Edit Table of Contents",
             description = "Add or edit bookmarks/table of contents in a PDF document.")
-    public ResponseEntity<byte[]> editTableOfContents(
+    public ResponseEntity<StreamingResponseBody> editTableOfContents(
             @ModelAttribute EditTableOfContentsRequest request) throws Exception {
         MultipartFile file = request.getFileInput();
 
-        try (PDDocument document = pdfDocumentFactory.load(file);
-                ByteArrayOutputStream baos = new ByteArrayOutputStream()) {
+        try (PDDocument document = pdfDocumentFactory.load(file)) {
 
             // Parse the bookmark data from JSON
             List<BookmarkItem> bookmarks =
@@ -168,13 +169,10 @@ public class EditTableOfContentsController {
             // Add bookmarks to the outline
             addBookmarksToOutline(document, outline, bookmarks);
 
-            // Save the document to a byte array
-            document.save(baos);
-
-            return WebResponseUtils.bytesToWebResponse(
-                    baos.toByteArray(),
+            return WebResponseUtils.pdfDocToWebResponse(
+                    document,
                     GeneralUtils.generateFilename(file.getOriginalFilename(), "_with_toc.pdf"),
-                    MediaType.APPLICATION_PDF);
+                    tempFileManager);
         }
     }
 
diff --git a/app/core/src/main/java/stirling/software/SPDF/controller/api/MergeController.java b/app/core/src/main/java/stirling/software/SPDF/controller/api/MergeController.java
index 7a4f12d697..3a7718fe8e 100644
--- a/app/core/src/main/java/stirling/software/SPDF/controller/api/MergeController.java
+++ b/app/core/src/main/java/stirling/software/SPDF/controller/api/MergeController.java
@@ -3,7 +3,6 @@ package stirling.software.SPDF.controller.api;
 import java.io.File;
 import java.io.IOException;
 import java.io.InputStream;
-import java.nio.file.Files;
 import java.util.ArrayList;
 import java.util.Arrays;
 import java.util.Comparator;
@@ -29,6 +28,7 @@ import org.springframework.http.ResponseEntity;
 import org.springframework.web.bind.annotation.ModelAttribute;
 import org.springframework.web.bind.annotation.RequestParam;
 import org.springframework.web.multipart.MultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import io.swagger.v3.oas.annotations.Operation;
 
@@ -279,7 +279,7 @@ public class MergeController {
                     "This endpoint merges multiple PDF files into a single PDF file. The merged"
                             + " file will contain all pages from the input files in the order they were"
                             + " provided. Input:PDF Output:PDF Type:MISO")
-    public ResponseEntity<byte[]> mergePdfs(
+    public ResponseEntity<StreamingResponseBody> mergePdfs(
             @ModelAttribute MergePdfsRequest request,
             @RequestParam(value = "fileOrder", required = false) String fileOrder)
             throws IOException {
@@ -399,12 +399,6 @@ public class MergeController {
         String mergedFileName =
                 GeneralUtils.generateFilename(firstFilename, "_merged_unsigned.pdf");
 
-        byte[] pdfBytes;
-        try {
-            pdfBytes = Files.readAllBytes(outputTempFile.getPath());
-        } finally {
-            outputTempFile.close();
-        }
-        return WebResponseUtils.bytesToWebResponse(pdfBytes, mergedFileName);
+        return WebResponseUtils.pdfFileToWebResponse(outputTempFile, mergedFileName);
     }
 }
diff --git a/app/core/src/main/java/stirling/software/SPDF/controller/api/MultiPageLayoutController.java b/app/core/src/main/java/stirling/software/SPDF/controller/api/MultiPageLayoutController.java
index 7066a47c9a..4fad2c5b1b 100644
--- a/app/core/src/main/java/stirling/software/SPDF/controller/api/MultiPageLayoutController.java
+++ b/app/core/src/main/java/stirling/software/SPDF/controller/api/MultiPageLayoutController.java
@@ -1,7 +1,6 @@
 package stirling.software.SPDF.controller.api;
 
 import java.awt.Color;
-import java.io.ByteArrayOutputStream;
 import java.io.IOException;
 
 import org.apache.pdfbox.multipdf.LayerUtility;
@@ -15,6 +14,7 @@ import org.springframework.http.MediaType;
 import org.springframework.http.ResponseEntity;
 import org.springframework.web.bind.annotation.ModelAttribute;
 import org.springframework.web.multipart.MultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import io.swagger.v3.oas.annotations.Operation;
 
@@ -28,6 +28,7 @@ import stirling.software.common.service.CustomPDFDocumentFactory;
 import stirling.software.common.util.ExceptionUtils;
 import stirling.software.common.util.GeneralFormCopyUtils;
 import stirling.software.common.util.GeneralUtils;
+import stirling.software.common.util.TempFileManager;
 import stirling.software.common.util.WebResponseUtils;
 
 @GeneralApi
@@ -36,6 +37,7 @@ import stirling.software.common.util.WebResponseUtils;
 public class MultiPageLayoutController {
 
     private final CustomPDFDocumentFactory pdfDocumentFactory;
+    private final TempFileManager tempFileManager;
 
     @AutoJobPostMapping(
             value = "/multi-page-layout",
@@ -45,7 +47,7 @@ public class MultiPageLayoutController {
             description =
                     "This operation takes an input PDF file and the number of pages to merge into a"
                             + " single sheet in the output PDF file. Input:PDF Output:PDF Type:SISO")
-    public ResponseEntity<byte[]> mergeMultiplePagesIntoOne(
+    public ResponseEntity<StreamingResponseBody> mergeMultiplePagesIntoOne(
             @ModelAttribute MergeMultiplePagesRequest request) throws IOException {
 
         int MAX_PAGES = 100000;
@@ -338,13 +340,11 @@ public class MultiPageLayoutController {
                     }
                 }
 
-                ByteArrayOutputStream baos = new ByteArrayOutputStream();
-                newDocument.save(baos);
-                byte[] result = baos.toByteArray();
-                return WebResponseUtils.bytesToWebResponse(
-                        result,
+                return WebResponseUtils.pdfDocToWebResponse(
+                        newDocument,
                         GeneralUtils.generateFilename(
-                                file.getOriginalFilename(), "_multi_page_layout.pdf"));
+                                file.getOriginalFilename(), "_multi_page_layout.pdf"),
+                        tempFileManager);
             } // newDocument is closed here
         } // sourceDocument is closed here
     }
diff --git a/app/core/src/main/java/stirling/software/SPDF/controller/api/PdfOverlayController.java b/app/core/src/main/java/stirling/software/SPDF/controller/api/PdfOverlayController.java
index df146ea9a0..826ffcb1fb 100644
--- a/app/core/src/main/java/stirling/software/SPDF/controller/api/PdfOverlayController.java
+++ b/app/core/src/main/java/stirling/software/SPDF/controller/api/PdfOverlayController.java
@@ -1,6 +1,5 @@
 package stirling.software.SPDF.controller.api;
 
-import java.io.ByteArrayOutputStream;
 import java.io.File;
 import java.io.IOException;
 import java.nio.file.Files;
@@ -16,6 +15,7 @@ import org.springframework.http.MediaType;
 import org.springframework.http.ResponseEntity;
 import org.springframework.web.bind.annotation.ModelAttribute;
 import org.springframework.web.multipart.MultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import io.swagger.v3.oas.annotations.Operation;
 
@@ -28,6 +28,8 @@ import stirling.software.common.annotations.api.GeneralApi;
 import stirling.software.common.service.CustomPDFDocumentFactory;
 import stirling.software.common.util.ExceptionUtils;
 import stirling.software.common.util.GeneralUtils;
+import stirling.software.common.util.TempFile;
+import stirling.software.common.util.TempFileManager;
 import stirling.software.common.util.WebResponseUtils;
 
 @GeneralApi
@@ -35,6 +37,7 @@ import stirling.software.common.util.WebResponseUtils;
 public class PdfOverlayController {
 
     private final CustomPDFDocumentFactory pdfDocumentFactory;
+    private final TempFileManager tempFileManager;
 
     @AutoJobPostMapping(value = "/overlay-pdfs", consumes = MediaType.MULTIPART_FORM_DATA_VALUE)
     @StandardPdfResponse
@@ -43,8 +46,8 @@ public class PdfOverlayController {
             description =
                     "Overlay PDF files onto a base PDF with different modes: Sequential,"
                             + " Interleaved, or Fixed Repeat. Input:PDF Output:PDF Type:MIMO")
-    public ResponseEntity<byte[]> overlayPdfs(@ModelAttribute OverlayPdfsRequest request)
-            throws IOException {
+    public ResponseEntity<StreamingResponseBody> overlayPdfs(
+            @ModelAttribute OverlayPdfsRequest request) throws IOException {
         MultipartFile baseFile = request.getFileInput();
         int overlayPos = request.getOverlayPosition();
 
@@ -52,6 +55,7 @@ public class PdfOverlayController {
         File[] overlayPdfFiles = new File[overlayFiles.length];
         List<File> tempFiles = new ArrayList<>(); // List to keep track of temporary files
 
+        TempFile tempOut = null;
         try {
             for (int i = 0; i < overlayFiles.length; i++) {
                 overlayPdfFiles[i] = GeneralUtils.multipartToFile(overlayFiles[i]);
@@ -62,8 +66,7 @@ public class PdfOverlayController {
             int[] counts = request.getCounts(); // Used for FixedRepeatOverlay mode
 
             try (PDDocument basePdf = pdfDocumentFactory.load(baseFile);
-                    Overlay overlay = new Overlay();
-                    ByteArrayOutputStream outputStream = new ByteArrayOutputStream()) {
+                    Overlay overlay = new Overlay()) {
                 Map<Integer, String> overlayGuide =
                         prepareOverlayGuide(
                                 basePdf.getNumberOfPages(),
@@ -79,15 +82,21 @@ public class PdfOverlayController {
                     overlay.setOverlayPosition(Overlay.Position.BACKGROUND);
                 }
 
-                overlay.overlay(overlayGuide).save(outputStream);
-                byte[] data = outputStream.toByteArray();
+                tempOut = tempFileManager.createManagedTempFile(".pdf");
+                overlay.overlay(overlayGuide).save(tempOut.getFile());
                 String outputFilename =
                         GeneralUtils.generateFilename(
                                 baseFile.getOriginalFilename(), "_overlayed.pdf");
 
-                return WebResponseUtils.bytesToWebResponse(
-                        data, outputFilename, MediaType.APPLICATION_PDF);
+                TempFile out = tempOut;
+                tempOut = null; // ownership transferred to StreamingResponseBody
+                return WebResponseUtils.pdfFileToWebResponse(out, outputFilename);
             }
+        } catch (Exception e) {
+            if (tempOut != null) {
+                tempOut.close();
+            }
+            throw e;
         } finally {
             for (File overlayPdfFile : overlayPdfFiles) {
                 if (overlayPdfFile != null) {
diff --git a/app/core/src/main/java/stirling/software/SPDF/controller/api/RearrangePagesPDFController.java b/app/core/src/main/java/stirling/software/SPDF/controller/api/RearrangePagesPDFController.java
index 9ad66a2dd6..de58a882c8 100644
--- a/app/core/src/main/java/stirling/software/SPDF/controller/api/RearrangePagesPDFController.java
+++ b/app/core/src/main/java/stirling/software/SPDF/controller/api/RearrangePagesPDFController.java
@@ -12,6 +12,7 @@ import org.springframework.http.MediaType;
 import org.springframework.http.ResponseEntity;
 import org.springframework.web.bind.annotation.ModelAttribute;
 import org.springframework.web.multipart.MultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import io.swagger.v3.oas.annotations.Operation;
 
@@ -27,6 +28,7 @@ import stirling.software.common.annotations.api.GeneralApi;
 import stirling.software.common.service.CustomPDFDocumentFactory;
 import stirling.software.common.util.ExceptionUtils;
 import stirling.software.common.util.GeneralUtils;
+import stirling.software.common.util.TempFileManager;
 import stirling.software.common.util.WebResponseUtils;
 
 @GeneralApi
@@ -35,6 +37,7 @@ import stirling.software.common.util.WebResponseUtils;
 public class RearrangePagesPDFController {
 
     private final CustomPDFDocumentFactory pdfDocumentFactory;
+    private final TempFileManager tempFileManager;
 
     @AutoJobPostMapping(consumes = MediaType.MULTIPART_FORM_DATA_VALUE, value = "/remove-pages")
     @StandardPdfResponse
@@ -44,8 +47,8 @@ public class RearrangePagesPDFController {
                     "This endpoint removes specified pages from a given PDF file. Users can provide"
                             + " a comma-separated list of page numbers or ranges to delete. Input:PDF"
                             + " Output:PDF Type:SISO")
-    public ResponseEntity<byte[]> deletePages(@ModelAttribute PDFWithPageNums request)
-            throws IOException {
+    public ResponseEntity<StreamingResponseBody> deletePages(
+            @ModelAttribute PDFWithPageNums request) throws IOException {
 
         MultipartFile pdfFile = request.getFileInput();
         String pagesToDelete = request.getPageNumbers();
@@ -67,7 +70,8 @@ public class RearrangePagesPDFController {
             return WebResponseUtils.pdfDocToWebResponse(
                     document,
                     GeneralUtils.generateFilename(
-                            pdfFile.getOriginalFilename(), "_removed_pages.pdf"));
+                            pdfFile.getOriginalFilename(), "_removed_pages.pdf"),
+                    tempFileManager);
         }
     }
 
@@ -224,8 +228,8 @@ public class RearrangePagesPDFController {
                             + " order or custom mode. Users can provide a page order as a"
                             + " comma-separated list of page numbers or page ranges, or a custom mode."
                             + " Input:PDF Output:PDF")
-    public ResponseEntity<byte[]> rearrangePages(@ModelAttribute RearrangePagesRequest request)
-            throws IOException {
+    public ResponseEntity<StreamingResponseBody> rearrangePages(
+            @ModelAttribute RearrangePagesRequest request) throws IOException {
         MultipartFile pdfFile = request.getFileInput();
         String pageOrder = request.getPageNumbers();
         String sortType = request.getCustomMode();
@@ -264,7 +268,8 @@ public class RearrangePagesPDFController {
                     return WebResponseUtils.pdfDocToWebResponse(
                             rearrangedDocument,
                             GeneralUtils.generateFilename(
-                                    pdfFile.getOriginalFilename(), "_rearranged.pdf"));
+                                    pdfFile.getOriginalFilename(), "_rearranged.pdf"),
+                            tempFileManager);
                 }
             }
         } catch (IOException e) {
diff --git a/app/core/src/main/java/stirling/software/SPDF/controller/api/RotationController.java b/app/core/src/main/java/stirling/software/SPDF/controller/api/RotationController.java
index 9b305fdc5c..9049595cb2 100644
--- a/app/core/src/main/java/stirling/software/SPDF/controller/api/RotationController.java
+++ b/app/core/src/main/java/stirling/software/SPDF/controller/api/RotationController.java
@@ -9,6 +9,7 @@ import org.springframework.http.MediaType;
 import org.springframework.http.ResponseEntity;
 import org.springframework.web.bind.annotation.ModelAttribute;
 import org.springframework.web.multipart.MultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import io.swagger.v3.oas.annotations.Operation;
 
@@ -21,6 +22,7 @@ import stirling.software.common.annotations.api.GeneralApi;
 import stirling.software.common.service.CustomPDFDocumentFactory;
 import stirling.software.common.util.ExceptionUtils;
 import stirling.software.common.util.GeneralUtils;
+import stirling.software.common.util.TempFileManager;
 import stirling.software.common.util.WebResponseUtils;
 
 @GeneralApi
@@ -28,6 +30,7 @@ import stirling.software.common.util.WebResponseUtils;
 public class RotationController {
 
     private final CustomPDFDocumentFactory pdfDocumentFactory;
+    private final TempFileManager tempFileManager;
 
     @AutoJobPostMapping(consumes = MediaType.MULTIPART_FORM_DATA_VALUE, value = "/rotate-pdf")
     @StandardPdfResponse
@@ -36,7 +39,7 @@ public class RotationController {
             description =
                     "This endpoint rotates a given PDF file by a specified angle. The angle must be"
                             + " a multiple of 90. Input:PDF Output:PDF Type:SISO")
-    public ResponseEntity<byte[]> rotatePDF(@ModelAttribute RotatePDFRequest request)
+    public ResponseEntity<StreamingResponseBody> rotatePDF(@ModelAttribute RotatePDFRequest request)
             throws IOException {
         MultipartFile pdfFile = request.getFileInput();
         Integer angle = request.getAngle();
@@ -60,7 +63,8 @@ public class RotationController {
             // Return the rotated PDF as a response
             return WebResponseUtils.pdfDocToWebResponse(
                     document,
-                    GeneralUtils.generateFilename(pdfFile.getOriginalFilename(), "_rotated.pdf"));
+                    GeneralUtils.generateFilename(pdfFile.getOriginalFilename(), "_rotated.pdf"),
+                    tempFileManager);
         }
     }
 }
diff --git a/app/core/src/main/java/stirling/software/SPDF/controller/api/ScalePagesController.java b/app/core/src/main/java/stirling/software/SPDF/controller/api/ScalePagesController.java
index 06053274cc..1cc77452d9 100644
--- a/app/core/src/main/java/stirling/software/SPDF/controller/api/ScalePagesController.java
+++ b/app/core/src/main/java/stirling/software/SPDF/controller/api/ScalePagesController.java
@@ -1,6 +1,5 @@
 package stirling.software.SPDF.controller.api;
 
-import java.io.ByteArrayOutputStream;
 import java.io.IOException;
 import java.util.HashMap;
 import java.util.Map;
@@ -16,6 +15,7 @@ import org.springframework.http.MediaType;
 import org.springframework.http.ResponseEntity;
 import org.springframework.web.bind.annotation.ModelAttribute;
 import org.springframework.web.multipart.MultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import io.swagger.v3.oas.annotations.Operation;
 
@@ -28,6 +28,7 @@ import stirling.software.common.annotations.api.GeneralApi;
 import stirling.software.common.service.CustomPDFDocumentFactory;
 import stirling.software.common.util.ExceptionUtils;
 import stirling.software.common.util.GeneralUtils;
+import stirling.software.common.util.TempFileManager;
 import stirling.software.common.util.WebResponseUtils;
 
 @GeneralApi
@@ -36,6 +37,7 @@ import stirling.software.common.util.WebResponseUtils;
 public class ScalePagesController {
 
     private final CustomPDFDocumentFactory pdfDocumentFactory;
+    private final TempFileManager tempFileManager;
 
     private static PDRectangle getTargetSize(String targetPDRectangle, PDDocument sourceDocument) {
         if ("KEEP".equals(targetPDRectangle)) {
@@ -118,16 +120,15 @@ public class ScalePagesController {
             description =
                     "This operation takes an input PDF file and the size to scale the pages to in"
                             + " the output PDF file. Input:PDF Output:PDF Type:SISO")
-    public ResponseEntity<byte[]> scalePages(@ModelAttribute ScalePagesRequest request)
-            throws IOException {
+    public ResponseEntity<StreamingResponseBody> scalePages(
+            @ModelAttribute ScalePagesRequest request) throws IOException {
         MultipartFile file = request.getFileInput();
         String targetPDRectangle = request.getPageSize();
         float scaleFactor = request.getScaleFactor();
 
         try (PDDocument sourceDocument = pdfDocumentFactory.load(file);
                 PDDocument outputDocument =
-                        pdfDocumentFactory.createNewDocumentBasedOnOldDocument(sourceDocument);
-                ByteArrayOutputStream baos = new ByteArrayOutputStream()) {
+                        pdfDocumentFactory.createNewDocumentBasedOnOldDocument(sourceDocument)) {
 
             PDRectangle targetSize = getTargetSize(targetPDRectangle, sourceDocument);
 
@@ -168,11 +169,10 @@ public class ScalePagesController {
                 }
             }
 
-            outputDocument.save(baos);
-
-            return WebResponseUtils.bytesToWebResponse(
-                    baos.toByteArray(),
-                    GeneralUtils.generateFilename(file.getOriginalFilename(), "_scaled.pdf"));
+            return WebResponseUtils.pdfDocToWebResponse(
+                    outputDocument,
+                    GeneralUtils.generateFilename(file.getOriginalFilename(), "_scaled.pdf"),
+                    tempFileManager);
         }
     }
 }
diff --git a/app/core/src/main/java/stirling/software/SPDF/controller/api/SplitPdfByChaptersController.java b/app/core/src/main/java/stirling/software/SPDF/controller/api/SplitPdfByChaptersController.java
index 784754b44c..e623cb6bdf 100644
--- a/app/core/src/main/java/stirling/software/SPDF/controller/api/SplitPdfByChaptersController.java
+++ b/app/core/src/main/java/stirling/software/SPDF/controller/api/SplitPdfByChaptersController.java
@@ -124,7 +124,9 @@ public class SplitPdfByChaptersController {
     @MultiFileResponse
     @Operation(
             summary = "Split PDFs by Chapters",
-            description = "Splits a PDF into chapters and returns a ZIP file.")
+            description =
+                    "Splits a PDF into chapters and returns a ZIP file. Input:PDF Output:ZIP-PDF"
+                            + " Type:SISO")
     public ResponseEntity<StreamingResponseBody> splitPdf(
             @ModelAttribute SplitPdfByChaptersRequest request) throws Exception {
         MultipartFile file = request.getFileInput();
diff --git a/app/core/src/main/java/stirling/software/SPDF/controller/api/SplitPdfBySectionsController.java b/app/core/src/main/java/stirling/software/SPDF/controller/api/SplitPdfBySectionsController.java
index 216c618c40..58c150aa37 100644
--- a/app/core/src/main/java/stirling/software/SPDF/controller/api/SplitPdfBySectionsController.java
+++ b/app/core/src/main/java/stirling/software/SPDF/controller/api/SplitPdfBySectionsController.java
@@ -1,6 +1,5 @@
 package stirling.software.SPDF.controller.api;
 
-import java.io.ByteArrayOutputStream;
 import java.io.IOException;
 import java.nio.file.Files;
 import java.util.*;
@@ -20,6 +19,7 @@ import org.springframework.http.MediaType;
 import org.springframework.http.ResponseEntity;
 import org.springframework.web.bind.annotation.ModelAttribute;
 import org.springframework.web.multipart.MultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import io.swagger.v3.oas.annotations.Operation;
 
@@ -59,8 +59,8 @@ public class SplitPdfBySectionsController {
                             + " which page to split, and how to split"
                             + " ( halves, thirds, quarters, etc.), both vertically and horizontally."
                             + " Input:PDF Output:ZIP-PDF Type:SISO")
-    public ResponseEntity<byte[]> splitPdf(@Valid @ModelAttribute SplitPdfBySectionsRequest request)
-            throws Exception {
+    public ResponseEntity<StreamingResponseBody> splitPdf(
+            @Valid @ModelAttribute SplitPdfBySectionsRequest request) throws Exception {
         MultipartFile file = request.getFileInput();
         String pageNumbers = request.getPageNumbers();
         SplitTypes splitMode =
@@ -80,9 +80,7 @@ public class SplitPdfBySectionsController {
 
             if (merge) {
                 try (PDDocument mergedDoc =
-                                pdfDocumentFactory.createNewDocumentBasedOnOldDocument(
-                                        sourceDocument);
-                        ByteArrayOutputStream baos = new ByteArrayOutputStream()) {
+                        pdfDocumentFactory.createNewDocumentBasedOnOldDocument(sourceDocument)) {
                     LayerUtility layerUtility = new LayerUtility(mergedDoc);
                     for (int pageIndex = 0;
                             pageIndex < sourceDocument.getNumberOfPages();
@@ -99,11 +97,12 @@ public class SplitPdfBySectionsController {
                             addPageToTarget(sourceDocument, pageIndex, mergedDoc, layerUtility);
                         }
                     }
-                    mergedDoc.save(baos);
-                    return WebResponseUtils.baosToWebResponse(baos, filename + ".pdf");
+                    return WebResponseUtils.pdfDocToWebResponse(
+                            mergedDoc, filename + ".pdf", tempFileManager);
                 }
             } else {
-                try (TempFile zipTempFile = new TempFile(tempFileManager, ".zip")) {
+                TempFile zipTempFile = tempFileManager.createManagedTempFile(".zip");
+                try {
                     try (ZipOutputStream zipOut =
                             new ZipOutputStream(Files.newOutputStream(zipTempFile.getPath()))) {
                         for (int pageIndex = 0;
@@ -161,9 +160,10 @@ public class SplitPdfBySectionsController {
                         log.error("Error creating ZIP file with split PDF sections", e);
                         throw e;
                     }
-                    byte[] zipBytes = Files.readAllBytes(zipTempFile.getPath());
-                    return WebResponseUtils.bytesToWebResponse(
-                            zipBytes, filename + ".zip", MediaType.APPLICATION_OCTET_STREAM);
+                    return WebResponseUtils.zipFileToWebResponse(zipTempFile, filename + ".zip");
+                } catch (Exception ex) {
+                    zipTempFile.close();
+                    throw ex;
                 }
             }
         } catch (Exception e) {
diff --git a/app/core/src/main/java/stirling/software/SPDF/controller/api/ToSinglePageController.java b/app/core/src/main/java/stirling/software/SPDF/controller/api/ToSinglePageController.java
index 2cf2517747..da6322a087 100644
--- a/app/core/src/main/java/stirling/software/SPDF/controller/api/ToSinglePageController.java
+++ b/app/core/src/main/java/stirling/software/SPDF/controller/api/ToSinglePageController.java
@@ -1,7 +1,6 @@
 package stirling.software.SPDF.controller.api;
 
 import java.awt.geom.AffineTransform;
-import java.io.ByteArrayOutputStream;
 import java.io.IOException;
 
 import org.apache.pdfbox.multipdf.LayerUtility;
@@ -12,6 +11,7 @@ import org.apache.pdfbox.pdmodel.graphics.form.PDFormXObject;
 import org.springframework.http.MediaType;
 import org.springframework.http.ResponseEntity;
 import org.springframework.web.bind.annotation.ModelAttribute;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import io.swagger.v3.oas.annotations.Operation;
 
@@ -23,6 +23,7 @@ import stirling.software.common.annotations.api.GeneralApi;
 import stirling.software.common.model.api.PDFFile;
 import stirling.software.common.service.CustomPDFDocumentFactory;
 import stirling.software.common.util.GeneralUtils;
+import stirling.software.common.util.TempFileManager;
 import stirling.software.common.util.WebResponseUtils;
 
 @GeneralApi
@@ -30,6 +31,7 @@ import stirling.software.common.util.WebResponseUtils;
 public class ToSinglePageController {
 
     private final CustomPDFDocumentFactory pdfDocumentFactory;
+    private final TempFileManager tempFileManager;
 
     @AutoJobPostMapping(
             consumes = MediaType.MULTIPART_FORM_DATA_VALUE,
@@ -42,7 +44,7 @@ public class ToSinglePageController {
                             + " document. The width of the single page will be same as the input's"
                             + " width, but the height will be the sum of all the pages' heights."
                             + " Input:PDF Output:PDF Type:SISO")
-    public ResponseEntity<byte[]> pdfToSinglePage(@ModelAttribute PDFFile request)
+    public ResponseEntity<StreamingResponseBody> pdfToSinglePage(@ModelAttribute PDFFile request)
             throws IOException {
 
         // Load the source document
@@ -85,14 +87,11 @@ public class ToSinglePageController {
                     pageIndex++;
                 }
 
-                ByteArrayOutputStream baos = new ByteArrayOutputStream();
-                newDocument.save(baos);
-
-                byte[] result = baos.toByteArray();
-                return WebResponseUtils.bytesToWebResponse(
-                        result,
+                return WebResponseUtils.pdfDocToWebResponse(
+                        newDocument,
                         GeneralUtils.generateFilename(
-                                request.getFileInput().getOriginalFilename(), "_singlePage.pdf"));
+                                request.getFileInput().getOriginalFilename(), "_singlePage.pdf"),
+                        tempFileManager);
             }
         }
     }
diff --git a/app/core/src/main/java/stirling/software/SPDF/controller/api/UIDataController.java b/app/core/src/main/java/stirling/software/SPDF/controller/api/UIDataController.java
index b9af74ddbf..c1afe8c406 100644
--- a/app/core/src/main/java/stirling/software/SPDF/controller/api/UIDataController.java
+++ b/app/core/src/main/java/stirling/software/SPDF/controller/api/UIDataController.java
@@ -95,9 +95,8 @@ public class UIDataController {
         Resource resource = new ClassPathResource("static/3rdPartyLicenses.json");
 
         try (InputStream is = resource.getInputStream()) {
-            String json = new String(is.readAllBytes(), StandardCharsets.UTF_8);
             Map<String, List<Dependency>> licenseData =
-                    objectMapper.readValue(json, new TypeReference<>() {});
+                    objectMapper.readValue(is, new TypeReference<>() {});
             data.setDependencies(licenseData.get("dependencies"));
         } catch (IOException e) {
             log.error("Failed to load licenses data", e);
diff --git a/app/core/src/main/java/stirling/software/SPDF/controller/api/converters/ConvertEbookToPDFController.java b/app/core/src/main/java/stirling/software/SPDF/controller/api/converters/ConvertEbookToPDFController.java
index 50157aa970..136eba30ef 100644
--- a/app/core/src/main/java/stirling/software/SPDF/controller/api/converters/ConvertEbookToPDFController.java
+++ b/app/core/src/main/java/stirling/software/SPDF/controller/api/converters/ConvertEbookToPDFController.java
@@ -16,6 +16,7 @@ import org.springframework.http.MediaType;
 import org.springframework.http.ResponseEntity;
 import org.springframework.web.bind.annotation.ModelAttribute;
 import org.springframework.web.multipart.MultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import io.github.pixee.security.Filenames;
 import io.swagger.v3.oas.annotations.Operation;
@@ -31,6 +32,7 @@ import stirling.software.common.service.CustomPDFDocumentFactory;
 import stirling.software.common.util.GeneralUtils;
 import stirling.software.common.util.ProcessExecutor;
 import stirling.software.common.util.ProcessExecutor.ProcessExecutorResult;
+import stirling.software.common.util.TempFile;
 import stirling.software.common.util.TempFileManager;
 import stirling.software.common.util.WebResponseUtils;
 
@@ -60,7 +62,7 @@ public class ConvertEbookToPDFController {
             description =
                     "This endpoint converts common eBook formats (EPUB, MOBI, AZW3, FB2, TXT, DOCX)"
                             + " to PDF using Calibre. Input:BOOK Output:PDF Type:SISO")
-    public ResponseEntity<byte[]> convertEbookToPdf(
+    public ResponseEntity<StreamingResponseBody> convertEbookToPdf(
             @ModelAttribute ConvertEbookToPdfRequest request) throws Exception {
         if (!isCalibreEnabled()) {
             throw new IllegalStateException("Calibre support is disabled");
@@ -140,24 +142,35 @@ public class ConvertEbookToPDFController {
         String outputFilename =
                 GeneralUtils.generateFilename(originalFilename, "_convertedToPDF.pdf");
 
+        TempFile tempOut = null;
         try {
+            tempOut = tempFileManager.createManagedTempFile(".pdf");
             if (optimizeForEbook) {
                 byte[] pdfBytes = Files.readAllBytes(outputPath);
                 try {
                     byte[] optimizedPdf = GeneralUtils.optimizePdfWithGhostscript(pdfBytes);
-                    return WebResponseUtils.bytesToWebResponse(optimizedPdf, outputFilename);
+                    Files.write(tempOut.getPath(), optimizedPdf);
                 } catch (IOException e) {
                     log.warn(
                             "Ghostscript optimization failed for ebook conversion, returning"
                                     + " original PDF",
                             e);
-                    return WebResponseUtils.bytesToWebResponse(pdfBytes, outputFilename);
+                    Files.write(tempOut.getPath(), pdfBytes);
+                }
+            } else {
+                try (PDDocument document = pdfDocumentFactory.load(outputPath.toFile())) {
+                    document.save(tempOut.getFile());
                 }
             }
-
-            try (PDDocument document = pdfDocumentFactory.load(outputPath.toFile())) {
-                return WebResponseUtils.pdfDocToWebResponse(document, outputFilename);
+            ResponseEntity<StreamingResponseBody> response =
+                    WebResponseUtils.pdfFileToWebResponse(tempOut, outputFilename);
+            tempOut = null;
+            return response;
+        } catch (Exception e) {
+            if (tempOut != null) {
+                tempOut.close();
             }
+            throw e;
         } finally {
             cleanupTempFiles(workingDirectory, inputPath, outputPath);
         }
diff --git a/app/core/src/main/java/stirling/software/SPDF/controller/api/converters/ConvertEmlToPDF.java b/app/core/src/main/java/stirling/software/SPDF/controller/api/converters/ConvertEmlToPDF.java
index 5cf98556f3..42bbe6b020 100644
--- a/app/core/src/main/java/stirling/software/SPDF/controller/api/converters/ConvertEmlToPDF.java
+++ b/app/core/src/main/java/stirling/software/SPDF/controller/api/converters/ConvertEmlToPDF.java
@@ -2,6 +2,7 @@ package stirling.software.SPDF.controller.api.converters;
 
 import java.io.IOException;
 import java.nio.charset.StandardCharsets;
+import java.nio.file.Files;
 import java.util.Locale;
 
 import org.jetbrains.annotations.NotNull;
@@ -10,6 +11,7 @@ import org.springframework.http.MediaType;
 import org.springframework.http.ResponseEntity;
 import org.springframework.web.bind.annotation.ModelAttribute;
 import org.springframework.web.multipart.MultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 import org.springframework.web.util.HtmlUtils;
 
 import io.github.pixee.security.Filenames;
@@ -26,6 +28,7 @@ import stirling.software.common.model.api.converters.EmlToPdfRequest;
 import stirling.software.common.service.CustomPDFDocumentFactory;
 import stirling.software.common.util.CustomHtmlSanitizer;
 import stirling.software.common.util.EmlToPdf;
+import stirling.software.common.util.TempFile;
 import stirling.software.common.util.TempFileManager;
 import stirling.software.common.util.WebResponseUtils;
 
@@ -48,7 +51,8 @@ public class ConvertEmlToPDF {
                             + " with extensive customization options. Features include font settings,"
                             + " image constraints, display modes, attachment handling, and HTML debug"
                             + " output. Input: EML or MSG file, Output: PDF or HTML file. Type: SISO")
-    public ResponseEntity<byte[]> convertEmlToPdf(@ModelAttribute EmlToPdfRequest request) {
+    public ResponseEntity<StreamingResponseBody> convertEmlToPdf(
+            @ModelAttribute EmlToPdfRequest request) {
 
         MultipartFile inputFile = request.getFileInput();
         String originalFilename = inputFile.getOriginalFilename();
@@ -56,22 +60,19 @@ public class ConvertEmlToPDF {
         // Validate input
         if (inputFile.isEmpty()) {
             log.error("No file provided for EML/MSG to PDF conversion.");
-            return ResponseEntity.badRequest()
-                    .body("No file provided".getBytes(StandardCharsets.UTF_8));
+            return errorResponse(HttpStatus.BAD_REQUEST, "No file provided");
         }
 
         if (originalFilename == null || originalFilename.trim().isEmpty()) {
             log.error("Filename is null or empty.");
-            return ResponseEntity.badRequest()
-                    .body("Please provide a valid filename".getBytes(StandardCharsets.UTF_8));
+            return errorResponse(HttpStatus.BAD_REQUEST, "Please provide a valid filename");
         }
 
         // Validate file type - support EML and MSG (Outlook) files
         String lowerFilename = originalFilename.toLowerCase(Locale.ROOT);
         if (!lowerFilename.endsWith(".eml") && !lowerFilename.endsWith(".msg")) {
             log.error("Invalid file type for EML/MSG to PDF: {}", originalFilename);
-            return ResponseEntity.badRequest()
-                    .body("Please upload a valid EML or MSG file".getBytes(StandardCharsets.UTF_8));
+            return errorResponse(HttpStatus.BAD_REQUEST, "Please upload a valid EML or MSG file");
         }
 
         String baseFilename = Filenames.toSimpleFileName(originalFilename); // Use Filenames utility
@@ -84,16 +85,20 @@ public class ConvertEmlToPDF {
                     String htmlContent =
                             EmlToPdf.convertEmlToHtml(fileBytes, request, customHtmlSanitizer);
                     log.info("Successfully converted email to HTML: {}", originalFilename);
-                    return WebResponseUtils.bytesToWebResponse(
-                            htmlContent.getBytes(StandardCharsets.UTF_8),
-                            baseFilename + ".html",
-                            MediaType.TEXT_HTML);
+                    TempFile tempOut = tempFileManager.createManagedTempFile(".html");
+                    try {
+                        Files.writeString(tempOut.getPath(), htmlContent, StandardCharsets.UTF_8);
+                    } catch (Exception ex) {
+                        tempOut.close();
+                        throw ex;
+                    }
+                    return WebResponseUtils.fileToWebResponse(
+                            tempOut, baseFilename + ".html", MediaType.TEXT_HTML);
                 } catch (IOException | IllegalArgumentException e) {
                     log.error("HTML conversion failed for {}", originalFilename, e);
-                    return ResponseEntity.status(HttpStatus.INTERNAL_SERVER_ERROR)
-                            .body(
-                                    ("HTML conversion failed: " + e.getMessage())
-                                            .getBytes(StandardCharsets.UTF_8));
+                    return errorResponse(
+                            HttpStatus.INTERNAL_SERVER_ERROR,
+                            "HTML conversion failed: " + e.getMessage());
                 }
             }
 
@@ -111,20 +116,25 @@ public class ConvertEmlToPDF {
 
                 if (pdfBytes == null || pdfBytes.length == 0) {
                     log.error("PDF conversion failed - empty output for {}", originalFilename);
-                    return ResponseEntity.status(HttpStatus.INTERNAL_SERVER_ERROR)
-                            .body(
-                                    "PDF conversion failed - empty output"
-                                            .getBytes(StandardCharsets.UTF_8));
+                    return errorResponse(
+                            HttpStatus.INTERNAL_SERVER_ERROR,
+                            "PDF conversion failed - empty output");
                 }
                 log.info("Successfully converted email to PDF: {}", originalFilename);
-                return WebResponseUtils.bytesToWebResponse(
-                        pdfBytes, baseFilename + ".pdf", MediaType.APPLICATION_PDF);
+                TempFile tempOut = tempFileManager.createManagedTempFile(".pdf");
+                try {
+                    Files.write(tempOut.getPath(), pdfBytes);
+                } catch (Exception ex) {
+                    tempOut.close();
+                    throw ex;
+                }
+                return WebResponseUtils.pdfFileToWebResponse(tempOut, baseFilename + ".pdf");
 
             } catch (InterruptedException e) {
                 Thread.currentThread().interrupt();
                 log.error("Email to PDF conversion was interrupted for {}", originalFilename, e);
-                return ResponseEntity.status(HttpStatus.INTERNAL_SERVER_ERROR)
-                        .body("Conversion was interrupted".getBytes(StandardCharsets.UTF_8));
+                return errorResponse(
+                        HttpStatus.INTERNAL_SERVER_ERROR, "Conversion was interrupted");
             } catch (IllegalArgumentException e) {
                 String errorMessage = buildErrorMessage(e, originalFilename);
                 log.error(
@@ -132,8 +142,7 @@ public class ConvertEmlToPDF {
                         originalFilename,
                         errorMessage,
                         e);
-                return ResponseEntity.status(HttpStatus.INTERNAL_SERVER_ERROR)
-                        .body(errorMessage.getBytes(StandardCharsets.UTF_8));
+                return errorResponse(HttpStatus.INTERNAL_SERVER_ERROR, errorMessage);
             } catch (RuntimeException e) {
                 String errorMessage = buildErrorMessage(e, originalFilename);
                 log.error(
@@ -141,17 +150,25 @@ public class ConvertEmlToPDF {
                         originalFilename,
                         errorMessage,
                         e);
-                return ResponseEntity.status(HttpStatus.INTERNAL_SERVER_ERROR)
-                        .body(errorMessage.getBytes(StandardCharsets.UTF_8));
+                return errorResponse(HttpStatus.INTERNAL_SERVER_ERROR, errorMessage);
             }
 
         } catch (IOException e) {
             log.error("File processing error for email to PDF: {}", originalFilename, e);
-            return ResponseEntity.status(HttpStatus.INTERNAL_SERVER_ERROR)
-                    .body("File processing error".getBytes(StandardCharsets.UTF_8));
+            return errorResponse(HttpStatus.INTERNAL_SERVER_ERROR, "File processing error");
         }
     }
 
+    private ResponseEntity<StreamingResponseBody> errorResponse(HttpStatus status, String message) {
+        byte[] body = message.getBytes(StandardCharsets.UTF_8);
+        StreamingResponseBody streaming =
+                os -> {
+                    os.write(body);
+                    os.flush();
+                };
+        return ResponseEntity.status(status).body(streaming);
+    }
+
     private static @NotNull String buildErrorMessage(Exception e, String originalFilename) {
         String safeFilename = HtmlUtils.htmlEscape(originalFilename);
         String exceptionMessage = e.getMessage();
diff --git a/app/core/src/main/java/stirling/software/SPDF/controller/api/converters/ConvertHtmlToPDF.java b/app/core/src/main/java/stirling/software/SPDF/controller/api/converters/ConvertHtmlToPDF.java
index 85ef34313d..7d09eeb3b5 100644
--- a/app/core/src/main/java/stirling/software/SPDF/controller/api/converters/ConvertHtmlToPDF.java
+++ b/app/core/src/main/java/stirling/software/SPDF/controller/api/converters/ConvertHtmlToPDF.java
@@ -1,9 +1,12 @@
 package stirling.software.SPDF.controller.api.converters;
 
+import java.nio.file.Files;
+
 import org.springframework.http.MediaType;
 import org.springframework.http.ResponseEntity;
 import org.springframework.web.bind.annotation.ModelAttribute;
 import org.springframework.web.multipart.MultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import io.github.pixee.security.Filenames;
 import io.swagger.v3.oas.annotations.Operation;
@@ -37,7 +40,7 @@ public class ConvertHtmlToPDF {
             description =
                     "This endpoint takes an HTML or ZIP file input and converts it to a PDF format."
                             + " Input:HTML Output:PDF Type:SISO")
-    public ResponseEntity<byte[]> HtmlToPdf(@ModelAttribute HTMLToPdfRequest request)
+    public ResponseEntity<StreamingResponseBody> HtmlToPdf(@ModelAttribute HTMLToPdfRequest request)
             throws Exception {
         MultipartFile fileInput = request.getFileInput();
 
@@ -65,6 +68,13 @@ public class ConvertHtmlToPDF {
 
         String outputFilename = GeneralUtils.generateFilename(originalFilename, ".pdf");
 
-        return WebResponseUtils.bytesToWebResponse(pdfBytes, outputFilename);
+        TempFile tempOut = tempFileManager.createManagedTempFile(".pdf");
+        try {
+            Files.write(tempOut.getPath(), pdfBytes);
+        } catch (Exception e) {
+            tempOut.close();
+            throw e;
+        }
+        return WebResponseUtils.pdfFileToWebResponse(tempOut, outputFilename);
     }
 }
diff --git a/app/core/src/main/java/stirling/software/SPDF/controller/api/converters/ConvertMarkdownToPdf.java b/app/core/src/main/java/stirling/software/SPDF/controller/api/converters/ConvertMarkdownToPdf.java
index f96e17f95a..83384a21ed 100644
--- a/app/core/src/main/java/stirling/software/SPDF/controller/api/converters/ConvertMarkdownToPdf.java
+++ b/app/core/src/main/java/stirling/software/SPDF/controller/api/converters/ConvertMarkdownToPdf.java
@@ -1,5 +1,6 @@
 package stirling.software.SPDF.controller.api.converters;
 
+import java.nio.charset.StandardCharsets;
 import java.util.List;
 import java.util.Map;
 
@@ -14,6 +15,7 @@ import org.springframework.http.MediaType;
 import org.springframework.http.ResponseEntity;
 import org.springframework.web.bind.annotation.ModelAttribute;
 import org.springframework.web.multipart.MultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import io.github.pixee.security.Filenames;
 import io.swagger.v3.oas.annotations.Operation;
@@ -46,8 +48,8 @@ public class ConvertMarkdownToPdf {
             description =
                     "This endpoint takes a Markdown file or ZIP (containing Markdown + images) input, converts it to HTML, and then to"
                             + " PDF format. Input:MARKDOWN Output:PDF Type:SISO")
-    public ResponseEntity<byte[]> markdownToPdf(@ModelAttribute GeneralFile generalFile)
-            throws Exception {
+    public ResponseEntity<StreamingResponseBody> markdownToPdf(
+            @ModelAttribute GeneralFile generalFile) throws Exception {
         MultipartFile fileInput = generalFile.getFileInput();
 
         if (fileInput == null) {
@@ -79,7 +81,7 @@ public class ConvertMarkdownToPdf {
                 java.nio.file.Path tempDirPath = tempDir.getPath();
                 try (java.util.zip.ZipInputStream zipIn =
                         io.github.pixee.security.ZipSecurity.createHardenedInputStream(
-                                new java.io.ByteArrayInputStream(fileInput.getBytes()))) {
+                                fileInput.getInputStream())) {
                     java.util.zip.ZipEntry entry;
                     while ((entry = zipIn.getNextEntry()) != null) {
                         if (!entry.isDirectory()) {
@@ -141,7 +143,7 @@ public class ConvertMarkdownToPdf {
             List<Extension> extensions = List.of(TablesExtension.create());
             Parser parser = Parser.builder().extensions(extensions).build();
 
-            Node document = parser.parse(new String(fileInput.getBytes()));
+            Node document = parser.parse(new String(fileInput.getBytes(), StandardCharsets.UTF_8));
             HtmlRenderer renderer =
                     HtmlRenderer.builder()
                             .attributeProviderFactory(context -> new TableAttributeProvider())
@@ -154,7 +156,7 @@ public class ConvertMarkdownToPdf {
                     FileToPdf.convertHtmlToPdf(
                             runtimePathConfig.getWeasyPrintPath(),
                             null,
-                            htmlContent.getBytes(),
+                            htmlContent.getBytes(StandardCharsets.UTF_8),
                             "converted.html",
                             tempFileManager,
                             customHtmlSanitizer);
@@ -163,7 +165,15 @@ public class ConvertMarkdownToPdf {
         }
 
         pdfBytes = pdfDocumentFactory.createNewBytesBasedOnOldDocument(pdfBytes);
-        return WebResponseUtils.bytesToWebResponse(pdfBytes, outputFilename);
+
+        TempFile tempOut = tempFileManager.createManagedTempFile(".pdf");
+        try {
+            java.nio.file.Files.write(tempOut.getPath(), pdfBytes);
+        } catch (Exception e) {
+            tempOut.close();
+            throw e;
+        }
+        return WebResponseUtils.pdfFileToWebResponse(tempOut, outputFilename);
     }
 
     /**
diff --git a/app/core/src/main/java/stirling/software/SPDF/controller/api/converters/ConvertOfficeController.java b/app/core/src/main/java/stirling/software/SPDF/controller/api/converters/ConvertOfficeController.java
index 492febc496..ba4be7b8ea 100644
--- a/app/core/src/main/java/stirling/software/SPDF/controller/api/converters/ConvertOfficeController.java
+++ b/app/core/src/main/java/stirling/software/SPDF/controller/api/converters/ConvertOfficeController.java
@@ -17,6 +17,7 @@ import org.springframework.http.MediaType;
 import org.springframework.http.ResponseEntity;
 import org.springframework.web.bind.annotation.ModelAttribute;
 import org.springframework.web.multipart.MultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import io.github.pixee.security.Filenames;
 import io.swagger.v3.oas.annotations.Operation;
@@ -36,6 +37,8 @@ import stirling.software.common.util.GeneralUtils;
 import stirling.software.common.util.ProcessExecutor;
 import stirling.software.common.util.ProcessExecutor.ProcessExecutorResult;
 import stirling.software.common.util.RegexPatternUtils;
+import stirling.software.common.util.TempFile;
+import stirling.software.common.util.TempFileManager;
 import stirling.software.common.util.WebResponseUtils;
 
 @ConvertApi
@@ -47,6 +50,7 @@ public class ConvertOfficeController {
     private final RuntimePathConfig runtimePathConfig;
     private final CustomHtmlSanitizer customHtmlSanitizer;
     private final EndpointConfiguration endpointConfiguration;
+    private final TempFileManager tempFileManager;
 
     private boolean isUnoconvertAvailable() {
         return endpointConfiguration.isGroupEnabled("Unoconvert")
@@ -202,21 +206,32 @@ public class ConvertOfficeController {
             description =
                     "This endpoint converts a given file to a PDF using LibreOffice API  Input:ANY"
                             + " Output:PDF Type:SISO")
-    public ResponseEntity<byte[]> processFileToPDF(@ModelAttribute GeneralFile generalFile)
-            throws Exception {
+    public ResponseEntity<StreamingResponseBody> processFileToPDF(
+            @ModelAttribute GeneralFile generalFile) throws Exception {
         MultipartFile inputFile = generalFile.getFileInput();
         // unused but can start server instance if startup time is to long
         // LibreOfficeListener.getInstance().start();
         File file = null;
+        TempFile tempOut = null;
         try {
             file = convertToPdf(inputFile);
 
+            tempOut = tempFileManager.createManagedTempFile(".pdf");
             try (PDDocument doc = pdfDocumentFactory.load(file)) {
-                return WebResponseUtils.pdfDocToWebResponse(
-                        doc,
-                        GeneralUtils.generateFilename(
-                                inputFile.getOriginalFilename(), "_convertedToPDF.pdf"));
+                doc.save(tempOut.getFile());
             }
+            String filename =
+                    GeneralUtils.generateFilename(
+                            inputFile.getOriginalFilename(), "_convertedToPDF.pdf");
+            ResponseEntity<StreamingResponseBody> response =
+                    WebResponseUtils.pdfFileToWebResponse(tempOut, filename);
+            tempOut = null;
+            return response;
+        } catch (Exception e) {
+            if (tempOut != null) {
+                tempOut.close();
+            }
+            throw e;
         } finally {
             if (file != null && file.getParent() != null) {
                 FileUtils.deleteDirectory(file.getParentFile());
diff --git a/app/core/src/main/java/stirling/software/SPDF/controller/api/converters/ConvertPDFToEpubController.java b/app/core/src/main/java/stirling/software/SPDF/controller/api/converters/ConvertPDFToEpubController.java
index 61faf63677..3fd8c46dba 100644
--- a/app/core/src/main/java/stirling/software/SPDF/controller/api/converters/ConvertPDFToEpubController.java
+++ b/app/core/src/main/java/stirling/software/SPDF/controller/api/converters/ConvertPDFToEpubController.java
@@ -13,6 +13,7 @@ import org.springframework.http.MediaType;
 import org.springframework.http.ResponseEntity;
 import org.springframework.web.bind.annotation.ModelAttribute;
 import org.springframework.web.multipart.MultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import io.github.pixee.security.Filenames;
 import io.swagger.v3.oas.annotations.Operation;
@@ -29,6 +30,7 @@ import stirling.software.common.annotations.api.ConvertApi;
 import stirling.software.common.util.GeneralUtils;
 import stirling.software.common.util.ProcessExecutor;
 import stirling.software.common.util.ProcessExecutor.ProcessExecutorResult;
+import stirling.software.common.util.TempFile;
 import stirling.software.common.util.TempFileManager;
 import stirling.software.common.util.WebResponseUtils;
 
@@ -85,8 +87,8 @@ public class ConvertPDFToEpubController {
             description =
                     "Convert a PDF file to a high-quality EPUB or AZW3 ebook using Calibre. Input:PDF"
                             + " Output:EPUB/AZW3 Type:SISO")
-    public ResponseEntity<byte[]> convertPdfToEpub(@ModelAttribute ConvertPdfToEpubRequest request)
-            throws Exception {
+    public ResponseEntity<StreamingResponseBody> convertPdfToEpub(
+            @ModelAttribute ConvertPdfToEpubRequest request) throws Exception {
 
         if (!endpointConfiguration.isGroupEnabled(CALIBRE_GROUP)) {
             throw new IllegalStateException(
@@ -170,9 +172,16 @@ public class ConvertPDFToEpubController {
                                     + "."
                                     + outputFormat.getExtension());
 
-            byte[] outputBytes = Files.readAllBytes(outputPath);
             MediaType mediaType = MediaType.valueOf(outputFormat.getMediaType());
-            return WebResponseUtils.bytesToWebResponse(outputBytes, outputFilename, mediaType);
+            TempFile tempOut =
+                    tempFileManager.createManagedTempFile("." + outputFormat.getExtension());
+            try {
+                Files.copy(outputPath, tempOut.getPath(), StandardCopyOption.REPLACE_EXISTING);
+            } catch (Exception e) {
+                tempOut.close();
+                throw e;
+            }
+            return WebResponseUtils.fileToWebResponse(tempOut, outputFilename, mediaType);
         } finally {
             cleanupTempFiles(workingDirectory, inputPath, outputPath);
         }
diff --git a/app/core/src/main/java/stirling/software/SPDF/controller/api/converters/ConvertPDFToExcelController.java b/app/core/src/main/java/stirling/software/SPDF/controller/api/converters/ConvertPDFToExcelController.java
index bafaf86310..974e5451f7 100644
--- a/app/core/src/main/java/stirling/software/SPDF/controller/api/converters/ConvertPDFToExcelController.java
+++ b/app/core/src/main/java/stirling/software/SPDF/controller/api/converters/ConvertPDFToExcelController.java
@@ -1,6 +1,7 @@
 package stirling.software.SPDF.controller.api.converters;
 
-import java.io.ByteArrayOutputStream;
+import java.io.OutputStream;
+import java.nio.file.Files;
 import java.util.List;
 import java.util.Locale;
 
@@ -11,11 +12,10 @@ import org.apache.poi.ss.usermodel.Sheet;
 import org.apache.poi.ss.usermodel.Workbook;
 import org.apache.poi.ss.util.WorkbookUtil;
 import org.apache.poi.xssf.usermodel.XSSFWorkbook;
-import org.springframework.http.ContentDisposition;
-import org.springframework.http.HttpHeaders;
 import org.springframework.http.MediaType;
 import org.springframework.http.ResponseEntity;
 import org.springframework.web.bind.annotation.ModelAttribute;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import io.swagger.v3.oas.annotations.Operation;
 
@@ -27,6 +27,9 @@ import stirling.software.common.annotations.AutoJobPostMapping;
 import stirling.software.common.annotations.api.ConvertApi;
 import stirling.software.common.service.CustomPDFDocumentFactory;
 import stirling.software.common.util.GeneralUtils;
+import stirling.software.common.util.TempFile;
+import stirling.software.common.util.TempFileManager;
+import stirling.software.common.util.WebResponseUtils;
 
 import technology.tabula.ObjectExtractor;
 import technology.tabula.Page;
@@ -40,6 +43,7 @@ import technology.tabula.extractors.SpreadsheetExtractionAlgorithm;
 public class ConvertPDFToExcelController {
 
     private final CustomPDFDocumentFactory pdfDocumentFactory;
+    private final TempFileManager tempFileManager;
 
     @AutoJobPostMapping(value = "/pdf/xlsx", consumes = MediaType.MULTIPART_FORM_DATA_VALUE)
     @Operation(
@@ -47,11 +51,12 @@ public class ConvertPDFToExcelController {
             description =
                     "Extracts tabular data from each page of a PDF and writes it into an Excel"
                             + " workbook, one sheet per table. Input:PDF Output:XLSX Type:SISO")
-    public ResponseEntity<byte[]> pdfToExcel(@ModelAttribute PDFWithPageNums request)
+    public ResponseEntity<StreamingResponseBody> pdfToExcel(@ModelAttribute PDFWithPageNums request)
             throws Exception {
         String baseName =
                 GeneralUtils.removeExtension(request.getFileInput().getOriginalFilename());
 
+        TempFile tempOut = tempFileManager.createManagedTempFile(".xlsx");
         try (PDDocument document = pdfDocumentFactory.load(request);
                 XSSFWorkbook workbook = new XSSFWorkbook();
                 ObjectExtractor extractor = new ObjectExtractor(document)) {
@@ -89,21 +94,22 @@ public class ConvertPDFToExcelController {
             }
 
             if (sheetCount == 0) {
+                tempOut.close();
                 return ResponseEntity.noContent().build();
             }
 
-            ByteArrayOutputStream baos = new ByteArrayOutputStream();
-            workbook.write(baos);
-
-            HttpHeaders headers = new HttpHeaders();
-            headers.setContentDisposition(
-                    ContentDisposition.builder("attachment").filename(baseName + ".xlsx").build());
-            headers.setContentType(
-                    MediaType.parseMediaType(
-                            "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"));
-
-            return ResponseEntity.ok().headers(headers).body(baos.toByteArray());
+            try (OutputStream os = Files.newOutputStream(tempOut.getPath())) {
+                workbook.write(os);
+            }
+        } catch (Exception e) {
+            tempOut.close();
+            throw e;
         }
+
+        MediaType mediaType =
+                MediaType.parseMediaType(
+                        "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet");
+        return WebResponseUtils.fileToWebResponse(tempOut, baseName + ".xlsx", mediaType);
     }
 
     private String getUniqueSheetName(Workbook workbook, String baseName) {
diff --git a/app/core/src/main/java/stirling/software/SPDF/controller/api/converters/ConvertPDFToHtml.java b/app/core/src/main/java/stirling/software/SPDF/controller/api/converters/ConvertPDFToHtml.java
index 849e0af84b..13558d61aa 100644
--- a/app/core/src/main/java/stirling/software/SPDF/controller/api/converters/ConvertPDFToHtml.java
+++ b/app/core/src/main/java/stirling/software/SPDF/controller/api/converters/ConvertPDFToHtml.java
@@ -4,6 +4,7 @@ import org.springframework.http.MediaType;
 import org.springframework.http.ResponseEntity;
 import org.springframework.web.bind.annotation.ModelAttribute;
 import org.springframework.web.multipart.MultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import io.swagger.v3.oas.annotations.Operation;
 
@@ -28,7 +29,8 @@ public class ConvertPDFToHtml {
             summary = "Convert PDF to HTML",
             description =
                     "This endpoint converts a PDF file to HTML format. Input:PDF Output:HTML Type:SISO")
-    public ResponseEntity<byte[]> processPdfToHTML(@ModelAttribute PDFFile file) throws Exception {
+    public ResponseEntity<StreamingResponseBody> processPdfToHTML(@ModelAttribute PDFFile file)
+            throws Exception {
         MultipartFile inputFile = file.getFileInput();
         PDFToFile pdfToFile = new PDFToFile(tempFileManager, runtimePathConfig);
         return pdfToFile.processPdfToHtml(inputFile);
diff --git a/app/core/src/main/java/stirling/software/SPDF/controller/api/converters/ConvertPDFToOffice.java b/app/core/src/main/java/stirling/software/SPDF/controller/api/converters/ConvertPDFToOffice.java
index 950a9600d6..391ce52398 100644
--- a/app/core/src/main/java/stirling/software/SPDF/controller/api/converters/ConvertPDFToOffice.java
+++ b/app/core/src/main/java/stirling/software/SPDF/controller/api/converters/ConvertPDFToOffice.java
@@ -1,6 +1,8 @@
 package stirling.software.SPDF.controller.api.converters;
 
 import java.io.IOException;
+import java.nio.charset.StandardCharsets;
+import java.nio.file.Files;
 
 import org.apache.pdfbox.pdmodel.PDDocument;
 import org.apache.pdfbox.text.PDFTextStripper;
@@ -8,6 +10,7 @@ import org.springframework.http.MediaType;
 import org.springframework.http.ResponseEntity;
 import org.springframework.web.bind.annotation.ModelAttribute;
 import org.springframework.web.multipart.MultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import io.swagger.v3.oas.annotations.Operation;
 
@@ -23,6 +26,7 @@ import stirling.software.common.model.api.PDFFile;
 import stirling.software.common.service.CustomPDFDocumentFactory;
 import stirling.software.common.util.GeneralUtils;
 import stirling.software.common.util.PDFToFile;
+import stirling.software.common.util.TempFile;
 import stirling.software.common.util.TempFileManager;
 import stirling.software.common.util.WebResponseUtils;
 
@@ -40,7 +44,7 @@ public class ConvertPDFToOffice {
             description =
                     "This endpoint converts a given PDF file to a Presentation format. Input:PDF"
                             + " Output:PPT Type:SISO")
-    public ResponseEntity<byte[]> processPdfToPresentation(
+    public ResponseEntity<StreamingResponseBody> processPdfToPresentation(
             @ModelAttribute PdfToPresentationRequest request)
             throws IOException, InterruptedException {
         MultipartFile inputFile = request.getFileInput();
@@ -55,20 +59,24 @@ public class ConvertPDFToOffice {
             description =
                     "This endpoint converts a given PDF file to Text or RTF format. Input:PDF"
                             + " Output:TXT Type:SISO")
-    public ResponseEntity<byte[]> processPdfToRTForTXT(
+    public ResponseEntity<StreamingResponseBody> processPdfToRTForTXT(
             @ModelAttribute PdfToTextOrRTFRequest request)
             throws IOException, InterruptedException {
         MultipartFile inputFile = request.getFileInput();
         String outputFormat = request.getOutputFormat();
         if ("txt".equals(request.getOutputFormat())) {
+            String fileName =
+                    GeneralUtils.generateFilename(inputFile.getOriginalFilename(), ".txt");
+            TempFile finalOut = tempFileManager.createManagedTempFile(".txt");
             try (PDDocument document = pdfDocumentFactory.load(inputFile)) {
                 PDFTextStripper stripper = new PDFTextStripper();
                 String text = stripper.getText(document);
-                return WebResponseUtils.bytesToWebResponse(
-                        text.getBytes(),
-                        GeneralUtils.generateFilename(inputFile.getOriginalFilename(), ".txt"),
-                        MediaType.TEXT_PLAIN);
+                Files.writeString(finalOut.getPath(), text, StandardCharsets.UTF_8);
+            } catch (Exception e) {
+                finalOut.close();
+                throw e;
             }
+            return WebResponseUtils.fileToWebResponse(finalOut, fileName, MediaType.TEXT_PLAIN);
         } else {
             PDFToFile pdfToFile = new PDFToFile(tempFileManager, runtimePathConfig);
             return pdfToFile.processPdfToOfficeFormat(inputFile, outputFormat, "writer_pdf_import");
@@ -81,8 +89,8 @@ public class ConvertPDFToOffice {
             description =
                     "This endpoint converts a given PDF file to a Word document format. Input:PDF"
                             + " Output:WORD Type:SISO")
-    public ResponseEntity<byte[]> processPdfToWord(@ModelAttribute PdfToWordRequest request)
-            throws IOException, InterruptedException {
+    public ResponseEntity<StreamingResponseBody> processPdfToWord(
+            @ModelAttribute PdfToWordRequest request) throws IOException, InterruptedException {
         MultipartFile inputFile = request.getFileInput();
         String outputFormat = request.getOutputFormat();
         PDFToFile pdfToFile = new PDFToFile(tempFileManager, runtimePathConfig);
@@ -95,7 +103,8 @@ public class ConvertPDFToOffice {
             description =
                     "This endpoint converts a PDF file to an XML file. Input:PDF Output:XML"
                             + " Type:SISO")
-    public ResponseEntity<byte[]> processPdfToXML(@ModelAttribute PDFFile file) throws Exception {
+    public ResponseEntity<StreamingResponseBody> processPdfToXML(@ModelAttribute PDFFile file)
+            throws Exception {
         MultipartFile inputFile = file.getFileInput();
 
         PDFToFile pdfToFile = new PDFToFile(tempFileManager, runtimePathConfig);
diff --git a/app/core/src/main/java/stirling/software/SPDF/controller/api/converters/ConvertPDFToPDFA.java b/app/core/src/main/java/stirling/software/SPDF/controller/api/converters/ConvertPDFToPDFA.java
index d544d6ddab..98706bc98f 100644
--- a/app/core/src/main/java/stirling/software/SPDF/controller/api/converters/ConvertPDFToPDFA.java
+++ b/app/core/src/main/java/stirling/software/SPDF/controller/api/converters/ConvertPDFToPDFA.java
@@ -77,6 +77,7 @@ import org.springframework.http.ResponseEntity;
 import org.springframework.web.bind.annotation.ModelAttribute;
 import org.springframework.web.multipart.MultipartFile;
 import org.springframework.web.server.ResponseStatusException;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import io.github.pixee.security.Filenames;
 import io.swagger.v3.oas.annotations.Operation;
@@ -92,6 +93,8 @@ import stirling.software.common.configuration.RuntimePathConfig;
 import stirling.software.common.util.ExceptionUtils;
 import stirling.software.common.util.ProcessExecutor;
 import stirling.software.common.util.ProcessExecutor.ProcessExecutorResult;
+import stirling.software.common.util.TempFile;
+import stirling.software.common.util.TempFileManager;
 import stirling.software.common.util.WebResponseUtils;
 
 @ConvertApi
@@ -102,6 +105,7 @@ public class ConvertPDFToPDFA {
     private static final Pattern NON_PRINTABLE_ASCII = Pattern.compile("[^\\x20-\\x7E]");
     private final RuntimePathConfig runtimePathConfig;
     private final stirling.software.SPDF.service.VeraPDFService veraPDFService;
+    private final TempFileManager tempFileManager;
 
     private static final String ICC_RESOURCE_PATH = "/icc/sRGB2014.icc";
     private static final int PDFA_COMPATIBILITY_POLICY = 1;
@@ -573,7 +577,7 @@ public class ConvertPDFToPDFA {
             summary = "Convert a PDF to a PDF/A or PDF/X",
             description =
                     "This endpoint converts a PDF file to a PDF/A or PDF/X file using Ghostscript (preferred) or PDFBox/LibreOffice (fallback). PDF/A is a format designed for long-term archiving, while PDF/X is optimized for print production. Input:PDF Output:PDF Type:SISO")
-    public ResponseEntity<byte[]> pdfToPdfA(@ModelAttribute PdfToPdfARequest request)
+    public ResponseEntity<StreamingResponseBody> pdfToPdfA(@ModelAttribute PdfToPdfARequest request)
             throws Exception {
         MultipartFile inputFile = request.getFileInput();
         String outputFormat = request.getOutputFormat();
@@ -609,7 +613,7 @@ public class ConvertPDFToPDFA {
         return missing;
     }
 
-    private ResponseEntity<byte[]> handlePdfXConversion(
+    private ResponseEntity<StreamingResponseBody> handlePdfXConversion(
             MultipartFile inputFile, String outputFormat) throws Exception {
         PdfXProfile profile = PdfXProfile.fromRequest(outputFormat);
 
@@ -640,8 +644,14 @@ public class ConvertPDFToPDFA {
 
             log.info("PDF/X conversion completed successfully to {}", profile.getDisplayName());
 
-            return WebResponseUtils.bytesToWebResponse(
-                    converted, outputFilename, MediaType.APPLICATION_PDF);
+            TempFile tempOut = tempFileManager.createManagedTempFile(".pdf");
+            try {
+                Files.write(tempOut.getPath(), converted);
+            } catch (Exception ex) {
+                tempOut.close();
+                throw ex;
+            }
+            return WebResponseUtils.pdfFileToWebResponse(tempOut, outputFilename);
 
         } catch (IOException | InterruptedException e) {
             log.error("PDF/X conversion failed", e);
@@ -1796,7 +1806,7 @@ public class ConvertPDFToPDFA {
         return Files.readAllBytes(outputPdf);
     }
 
-    private ResponseEntity<byte[]> handlePdfAConversion(
+    private ResponseEntity<StreamingResponseBody> handlePdfAConversion(
             MultipartFile inputFile, String outputFormat, boolean strict) throws Exception {
         PdfaProfile profile = PdfaProfile.fromRequest(outputFormat);
 
@@ -1830,8 +1840,14 @@ public class ConvertPDFToPDFA {
                         verifyStrictCompliance(converted);
                     }
 
-                    return WebResponseUtils.bytesToWebResponse(
-                            converted, outputFilename, MediaType.APPLICATION_PDF);
+                    TempFile tempOut = tempFileManager.createManagedTempFile(".pdf");
+                    try {
+                        Files.write(tempOut.getPath(), converted);
+                    } catch (Exception ex) {
+                        tempOut.close();
+                        throw ex;
+                    }
+                    return WebResponseUtils.pdfFileToWebResponse(tempOut, outputFilename);
                 } catch (IOException | InterruptedException e) {
                     log.warn(
                             "Ghostscript conversion failed, falling back to PDFBox/LibreOffice method",
@@ -1851,8 +1867,14 @@ public class ConvertPDFToPDFA {
                 verifyStrictCompliance(converted);
             }
 
-            return WebResponseUtils.bytesToWebResponse(
-                    converted, outputFilename, MediaType.APPLICATION_PDF);
+            TempFile tempOut = tempFileManager.createManagedTempFile(".pdf");
+            try {
+                Files.write(tempOut.getPath(), converted);
+            } catch (Exception ex) {
+                tempOut.close();
+                throw ex;
+            }
+            return WebResponseUtils.pdfFileToWebResponse(tempOut, outputFilename);
         } finally {
             deleteQuietly(workingDir);
         }
diff --git a/app/core/src/main/java/stirling/software/SPDF/controller/api/converters/ConvertPdfJsonController.java b/app/core/src/main/java/stirling/software/SPDF/controller/api/converters/ConvertPdfJsonController.java
index 2ab4a32798..7b7924ba3c 100644
--- a/app/core/src/main/java/stirling/software/SPDF/controller/api/converters/ConvertPdfJsonController.java
+++ b/app/core/src/main/java/stirling/software/SPDF/controller/api/converters/ConvertPdfJsonController.java
@@ -1,6 +1,7 @@
 package stirling.software.SPDF.controller.api.converters;
 
 import java.nio.charset.StandardCharsets;
+import java.nio.file.Files;
 import java.util.Optional;
 import java.util.UUID;
 import java.util.regex.Pattern;
@@ -14,6 +15,7 @@ import org.springframework.web.bind.annotation.PathVariable;
 import org.springframework.web.bind.annotation.RequestBody;
 import org.springframework.web.bind.annotation.RequestParam;
 import org.springframework.web.multipart.MultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import io.github.pixee.security.Filenames;
 import io.swagger.v3.oas.annotations.Operation;
@@ -31,6 +33,8 @@ import stirling.software.common.model.api.GeneralFile;
 import stirling.software.common.model.api.PDFFile;
 import stirling.software.common.service.JobOwnershipService;
 import stirling.software.common.util.ExceptionUtils;
+import stirling.software.common.util.TempFile;
+import stirling.software.common.util.TempFileManager;
 import stirling.software.common.util.WebResponseUtils;
 
 @Slf4j
@@ -42,6 +46,7 @@ public class ConvertPdfJsonController {
     private static final Pattern WHITESPACE_PATTERN = Pattern.compile("[\\r\\n\\t]+");
     private static final Pattern NON_PRINTABLE_PATTERN = Pattern.compile("[^\\x20-\\x7E]");
     private final PdfJsonConversionService pdfJsonConversionService;
+    private final TempFileManager tempFileManager;
 
     @Autowired(required = false)
     private JobOwnershipService jobOwnershipService;
@@ -51,7 +56,7 @@ public class ConvertPdfJsonController {
             summary = "Convert PDF to Text Editor Format",
             description =
                     "Extracts PDF text, fonts, and metadata into an editable JSON structure for the text editor tool. Input:PDF Output:JSON Type:SISO")
-    public ResponseEntity<byte[]> convertPdfToJson(
+    public ResponseEntity<StreamingResponseBody> convertPdfToJson(
             @ModelAttribute PDFFile request,
             @RequestParam(value = "lightweight", defaultValue = "false") boolean lightweight)
             throws Exception {
@@ -60,6 +65,8 @@ public class ConvertPdfJsonController {
             throw ExceptionUtils.createNullArgumentException("fileInput");
         }
 
+        // TODO: Refactor PdfJsonConversionService to write directly to an OutputStream
+        // instead of returning byte[], avoiding the intermediate heap allocation + temp file write
         byte[] jsonBytes = pdfJsonConversionService.convertPdfToJson(inputFile, lightweight);
         logJsonResponse("pdf/text-editor", jsonBytes);
         String originalName = inputFile.getOriginalFilename();
@@ -70,7 +77,14 @@ public class ConvertPdfJsonController {
                                 .replaceFirst("")
                         : "document";
         String docName = baseName + ".json";
-        return WebResponseUtils.bytesToWebResponse(jsonBytes, docName, MediaType.APPLICATION_JSON);
+        TempFile tempOut = tempFileManager.createManagedTempFile(".json");
+        try {
+            Files.write(tempOut.getPath(), jsonBytes);
+        } catch (Exception e) {
+            tempOut.close();
+            throw e;
+        }
+        return WebResponseUtils.fileToWebResponse(tempOut, docName, MediaType.APPLICATION_JSON);
     }
 
     @AutoJobPostMapping(consumes = "multipart/form-data", value = "/text-editor/pdf")
@@ -79,8 +93,8 @@ public class ConvertPdfJsonController {
             summary = "Convert Text Editor Format to PDF",
             description =
                     "Rebuilds a PDF from the editable JSON structure generated by the text editor tool. Input:JSON Output:PDF Type:SISO")
-    public ResponseEntity<byte[]> convertJsonToPdf(@ModelAttribute GeneralFile request)
-            throws Exception {
+    public ResponseEntity<StreamingResponseBody> convertJsonToPdf(
+            @ModelAttribute GeneralFile request) throws Exception {
         MultipartFile jsonFile = request.getFileInput();
         if (jsonFile == null) {
             throw ExceptionUtils.createNullArgumentException("fileInput");
@@ -95,7 +109,14 @@ public class ConvertPdfJsonController {
                                 .replaceFirst("")
                         : "document";
         String docName = baseName.endsWith(".pdf") ? baseName : baseName + ".pdf";
-        return WebResponseUtils.bytesToWebResponse(pdfBytes, docName);
+        TempFile tempOut = tempFileManager.createManagedTempFile(".pdf");
+        try {
+            Files.write(tempOut.getPath(), pdfBytes);
+        } catch (Exception e) {
+            tempOut.close();
+            throw e;
+        }
+        return WebResponseUtils.pdfFileToWebResponse(tempOut, docName);
     }
 
     @AutoJobPostMapping(consumes = "multipart/form-data", value = "/pdf/text-editor/metadata")
@@ -105,17 +126,15 @@ public class ConvertPdfJsonController {
                     "Extracts document metadata, fonts, and page dimensions for the text editor tool. Caches the document for"
                             + " subsequent page requests. Returns a server-generated jobId scoped to the"
                             + " authenticated user. Input:PDF Output:JSON Type:SISO")
-    public ResponseEntity<byte[]> extractPdfMetadata(@ModelAttribute PDFFile request)
+    public ResponseEntity<StreamingResponseBody> extractPdfMetadata(@ModelAttribute PDFFile request)
             throws Exception {
         MultipartFile inputFile = request.getFileInput();
         if (inputFile == null) {
             throw ExceptionUtils.createNullArgumentException("fileInput");
         }
 
-        // Generate server-side UUID for job
         String baseJobId = UUID.randomUUID().toString();
 
-        // Scope job to authenticated user if security is enabled
         String scopedJobKey = getScopedJobKey(baseJobId);
 
         log.debug("Extracting metadata for PDF, assigned jobId: {}", scopedJobKey);
@@ -123,20 +142,27 @@ public class ConvertPdfJsonController {
         byte[] jsonBytes =
                 pdfJsonConversionService.extractDocumentMetadata(inputFile, scopedJobKey);
         logJsonResponse("pdf/text-editor/metadata", jsonBytes);
-        String originalName = inputFile.getOriginalFilename();
-        String baseName =
-                (originalName != null && !originalName.isBlank())
-                        ? FILE_EXTENSION_PATTERN
-                                .matcher(Filenames.toSimpleFileName(originalName))
-                                .replaceFirst("")
-                        : "document";
-        String docName = baseName + "_metadata.json";
 
-        // Return jobId in response header for client
+        TempFile tempOut = tempFileManager.createManagedTempFile(".json");
+        try {
+            Files.write(tempOut.getPath(), jsonBytes);
+        } catch (Exception e) {
+            tempOut.close();
+            throw e;
+        }
         return ResponseEntity.ok()
                 .header("X-Job-Id", scopedJobKey)
                 .contentType(MediaType.APPLICATION_JSON)
-                .body(jsonBytes);
+                .contentLength(java.nio.file.Files.size(tempOut.getPath()))
+                .body(
+                        os -> {
+                            try (os) {
+                                Files.copy(tempOut.getPath(), os);
+                                os.flush();
+                            } finally {
+                                tempOut.close();
+                            }
+                        });
     }
 
     @AutoJobPostMapping(
@@ -149,7 +175,7 @@ public class ConvertPdfJsonController {
                     "Applies edits for the specified pages of a cached PDF and returns an updated PDF."
                             + " Requires the PDF to have been previously cached via the text editor metadata endpoint."
                             + " The jobId must be obtained from the metadata extraction endpoint.")
-    public ResponseEntity<byte[]> exportPartialPdf(
+    public ResponseEntity<StreamingResponseBody> exportPartialPdf(
             @PathVariable String jobId,
             @RequestBody PdfJsonDocument document,
             @RequestParam(value = "filename", required = false) String filename)
@@ -158,7 +184,6 @@ public class ConvertPdfJsonController {
             throw ExceptionUtils.createNullArgumentException("document");
         }
 
-        // Validate job ownership
         validateJobAccess(jobId);
 
         byte[] pdfBytes = pdfJsonConversionService.exportUpdatedPages(jobId, document);
@@ -173,7 +198,14 @@ public class ConvertPdfJsonController {
                                 .filter(title -> title != null && !title.isBlank())
                                 .orElse("document");
         String docName = baseName.endsWith(".pdf") ? baseName : baseName + ".pdf";
-        return WebResponseUtils.bytesToWebResponse(pdfBytes, docName);
+        TempFile tempOut = tempFileManager.createManagedTempFile(".pdf");
+        try {
+            Files.write(tempOut.getPath(), pdfBytes);
+        } catch (Exception e) {
+            tempOut.close();
+            throw e;
+        }
+        return WebResponseUtils.pdfFileToWebResponse(tempOut, docName);
     }
 
     @GetMapping(value = "/pdf/text-editor/page/{jobId}/{pageNumber}")
@@ -183,16 +215,22 @@ public class ConvertPdfJsonController {
                     "Retrieves a single page's content from a previously cached PDF document for the text editor tool."
                             + " Requires prior call to /pdf/text-editor/metadata. The jobId must belong to the"
                             + " authenticated user. Output:JSON")
-    public ResponseEntity<byte[]> extractSinglePage(
+    public ResponseEntity<StreamingResponseBody> extractSinglePage(
             @PathVariable String jobId, @PathVariable int pageNumber) throws Exception {
 
-        // Validate job ownership
         validateJobAccess(jobId);
 
         byte[] jsonBytes = pdfJsonConversionService.extractSinglePage(jobId, pageNumber);
         logJsonResponse("pdf/text-editor/page", jsonBytes);
         String docName = "page_" + pageNumber + ".json";
-        return WebResponseUtils.bytesToWebResponse(jsonBytes, docName, MediaType.APPLICATION_JSON);
+        TempFile tempOut = tempFileManager.createManagedTempFile(".json");
+        try {
+            Files.write(tempOut.getPath(), jsonBytes);
+        } catch (Exception e) {
+            tempOut.close();
+            throw e;
+        }
+        return WebResponseUtils.fileToWebResponse(tempOut, docName, MediaType.APPLICATION_JSON);
     }
 
     @GetMapping(value = "/pdf/text-editor/fonts/{jobId}/{pageNumber}")
@@ -202,16 +240,22 @@ public class ConvertPdfJsonController {
                     "Retrieves the font payloads used by a single page from a previously cached PDF document."
                             + " Requires prior call to /pdf/text-editor/metadata. The jobId must belong to the"
                             + " authenticated user. Output:JSON")
-    public ResponseEntity<byte[]> extractPageFonts(
+    public ResponseEntity<StreamingResponseBody> extractPageFonts(
             @PathVariable String jobId, @PathVariable int pageNumber) throws Exception {
 
-        // Validate job ownership
         validateJobAccess(jobId);
 
         byte[] jsonBytes = pdfJsonConversionService.extractPageFonts(jobId, pageNumber);
         logJsonResponse("pdf/text-editor/fonts/page", jsonBytes);
         String docName = "page_fonts_" + pageNumber + ".json";
-        return WebResponseUtils.bytesToWebResponse(jsonBytes, docName, MediaType.APPLICATION_JSON);
+        TempFile tempOut = tempFileManager.createManagedTempFile(".json");
+        try {
+            Files.write(tempOut.getPath(), jsonBytes);
+        } catch (Exception e) {
+            tempOut.close();
+            throw e;
+        }
+        return WebResponseUtils.fileToWebResponse(tempOut, docName, MediaType.APPLICATION_JSON);
     }
 
     @AutoJobPostMapping(
@@ -225,24 +269,16 @@ public class ConvertPdfJsonController {
                             + " authenticated user.")
     public ResponseEntity<Void> clearCache(@PathVariable String jobId) {
 
-        // Validate job ownership
         validateJobAccess(jobId);
 
         pdfJsonConversionService.clearCachedDocument(jobId);
         return ResponseEntity.ok().build();
     }
 
-    /**
-     * Get a scoped job key that includes user ownership when security is enabled.
-     *
-     * @param baseJobId the base job identifier
-     * @return scoped job key, or just baseJobId if no ownership service available
-     */
     private String getScopedJobKey(String baseJobId) {
         if (jobOwnershipService != null) {
             return jobOwnershipService.createScopedJobKey(baseJobId);
         }
-        // Security disabled, return unsecured job key
         return baseJobId;
     }
 
@@ -252,7 +288,6 @@ public class ConvertPdfJsonController {
             return;
         }
 
-        // Only perform expensive tail extraction if debug logging is enabled
         if (log.isDebugEnabled()) {
             int length = jsonBytes.length;
             boolean endsWithJson =
@@ -431,16 +466,9 @@ public class ConvertPdfJsonController {
         return WHITESPACE_PATTERN.matcher(value.substring(0, max)).replaceAll(" ") + "...";
     }
 
-    /**
-     * Validate that the current user has access to the given job.
-     *
-     * @param jobId the job identifier to validate
-     * @throws SecurityException if current user does not own the job
-     */
     private void validateJobAccess(String jobId) {
         if (jobOwnershipService != null) {
             jobOwnershipService.validateJobAccess(jobId);
         }
-        // If jobOwnershipService is null (security disabled), allow all access
     }
 }
diff --git a/app/core/src/main/java/stirling/software/SPDF/controller/api/converters/ConvertPdfToVideoController.java b/app/core/src/main/java/stirling/software/SPDF/controller/api/converters/ConvertPdfToVideoController.java
index 56780fa901..001e09305e 100644
--- a/app/core/src/main/java/stirling/software/SPDF/controller/api/converters/ConvertPdfToVideoController.java
+++ b/app/core/src/main/java/stirling/software/SPDF/controller/api/converters/ConvertPdfToVideoController.java
@@ -8,10 +8,7 @@ import java.awt.Graphics2D;
 import java.awt.geom.AffineTransform;
 import java.awt.image.BufferedImage;
 import java.io.IOException;
-import java.nio.file.Files;
 import java.nio.file.Path;
-import java.text.DecimalFormat;
-import java.text.DecimalFormatSymbols;
 import java.util.ArrayList;
 import java.util.List;
 import java.util.Locale;
@@ -23,31 +20,17 @@ import javax.imageio.ImageIO;
 import org.apache.pdfbox.pdmodel.PDDocument;
 import org.apache.pdfbox.rendering.ImageType;
 import org.apache.pdfbox.rendering.PDFRenderer;
-import org.springframework.http.HttpStatus;
 import org.springframework.http.MediaType;
-import org.springframework.http.ResponseEntity;
-import org.springframework.web.bind.annotation.ModelAttribute;
-import org.springframework.web.multipart.MultipartFile;
-
-import io.github.pixee.security.Filenames;
-import io.swagger.v3.oas.annotations.Operation;
 
 import lombok.RequiredArgsConstructor;
 
-import stirling.software.SPDF.model.api.converters.PdfToVideoRequest;
-import stirling.software.common.annotations.AutoJobPostMapping;
 import stirling.software.common.annotations.api.ConvertApi;
 import stirling.software.common.model.ApplicationProperties;
 import stirling.software.common.service.CustomPDFDocumentFactory;
 import stirling.software.common.util.ApplicationContextProvider;
-import stirling.software.common.util.CheckProgramInstall;
 import stirling.software.common.util.ExceptionUtils;
-import stirling.software.common.util.ProcessExecutor;
-import stirling.software.common.util.ProcessExecutor.ProcessExecutorResult;
-import stirling.software.common.util.TempDirectory;
 import stirling.software.common.util.TempFile;
 import stirling.software.common.util.TempFileManager;
-import stirling.software.common.util.WebResponseUtils;
 
 @ConvertApi
 @RequiredArgsConstructor
@@ -64,6 +47,8 @@ public class ConvertPdfToVideoController {
     private final CustomPDFDocumentFactory pdfDocumentFactory;
     private final TempFileManager tempFileManager;
 
+    // ffmpeg disabled due to raised CVEs
+    /*
     @AutoJobPostMapping(consumes = MediaType.MULTIPART_FORM_DATA_VALUE, value = "/pdf/video")
     @Operation(
             summary = "Convert PDF to Video Slideshow",
@@ -163,6 +148,7 @@ public class ConvertPdfToVideoController {
             return WebResponseUtils.bytesToWebResponse(videoBytes, outputName, mediaType);
         }
     }
+    */
 
     private void generateFrames(
             Path inputPdf,
diff --git a/app/core/src/main/java/stirling/software/SPDF/controller/api/converters/ConvertSvgToPDF.java b/app/core/src/main/java/stirling/software/SPDF/controller/api/converters/ConvertSvgToPDF.java
index 0e90f01f53..dc79805236 100644
--- a/app/core/src/main/java/stirling/software/SPDF/controller/api/converters/ConvertSvgToPDF.java
+++ b/app/core/src/main/java/stirling/software/SPDF/controller/api/converters/ConvertSvgToPDF.java
@@ -14,6 +14,7 @@ import org.springframework.http.MediaType;
 import org.springframework.http.ResponseEntity;
 import org.springframework.web.bind.annotation.ModelAttribute;
 import org.springframework.web.multipart.MultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import io.github.pixee.security.Filenames;
 import io.swagger.v3.oas.annotations.Operation;
@@ -53,7 +54,8 @@ public class ConvertSvgToPDF {
                             + "SVG dimensions (width/height) determine the PDF page size; defaults to A4 if not specified. "
                             + "SVG content is sanitized to prevent XSS attacks. "
                             + "Input: SVG file(s), Output: PDF file(s) or ZIP. Type: MIMO")
-    public ResponseEntity<byte[]> convertSvgToPdf(@ModelAttribute SvgToPdfRequest request) {
+    public ResponseEntity<StreamingResponseBody> convertSvgToPdf(
+            @ModelAttribute SvgToPdfRequest request) {
 
         MultipartFile[] inputFiles = request.getFileInput();
         boolean combineIntoSinglePdf = Boolean.TRUE.equals(request.getCombineIntoSinglePdf());
@@ -61,8 +63,7 @@ public class ConvertSvgToPDF {
         // Validate input
         if (inputFiles == null || inputFiles.length == 0) {
             log.error("No files provided for SVG to PDF conversion.");
-            return ResponseEntity.badRequest()
-                    .body("No files provided".getBytes(StandardCharsets.UTF_8));
+            return errorResponse(HttpStatus.BAD_REQUEST, "No files provided");
         }
 
         try {
@@ -103,8 +104,7 @@ public class ConvertSvgToPDF {
 
             if (sanitizedSvgs.isEmpty()) {
                 log.error("No valid SVG files were found");
-                return ResponseEntity.status(HttpStatus.BAD_REQUEST)
-                        .body("No valid SVG files were found".getBytes(StandardCharsets.UTF_8));
+                return errorResponse(HttpStatus.BAD_REQUEST, "No valid SVG files were found");
             }
 
             if (combineIntoSinglePdf) {
@@ -115,14 +115,23 @@ public class ConvertSvgToPDF {
 
         } catch (Exception e) {
             log.error("Unexpected error during SVG to PDF conversion", e);
-            return ResponseEntity.status(HttpStatus.INTERNAL_SERVER_ERROR)
-                    .body(
-                            "An unexpected error occurred during conversion"
-                                    .getBytes(StandardCharsets.UTF_8));
+            return errorResponse(
+                    HttpStatus.INTERNAL_SERVER_ERROR,
+                    "An unexpected error occurred during conversion");
         }
     }
 
-    private ResponseEntity<byte[]> handleCombinedConversion(
+    private ResponseEntity<StreamingResponseBody> errorResponse(HttpStatus status, String message) {
+        byte[] body = message.getBytes(StandardCharsets.UTF_8);
+        StreamingResponseBody streaming =
+                os -> {
+                    os.write(body);
+                    os.flush();
+                };
+        return ResponseEntity.status(status).body(streaming);
+    }
+
+    private ResponseEntity<StreamingResponseBody> handleCombinedConversion(
             List<byte[]> sanitizedSvgs, List<String> filenames) {
         try {
             log.info("Combining {} SVG files into single PDF", sanitizedSvgs.size());
@@ -131,10 +140,8 @@ public class ConvertSvgToPDF {
 
             if (pdfBytes == null || pdfBytes.length == 0) {
                 log.error("PDF conversion failed - empty output");
-                return ResponseEntity.status(HttpStatus.INTERNAL_SERVER_ERROR)
-                        .body(
-                                "PDF conversion failed - empty output"
-                                        .getBytes(StandardCharsets.UTF_8));
+                return errorResponse(
+                        HttpStatus.INTERNAL_SERVER_ERROR, "PDF conversion failed - empty output");
             }
 
             pdfBytes = pdfDocumentFactory.createNewBytesBasedOnOldDocument(pdfBytes);
@@ -146,19 +153,23 @@ public class ConvertSvgToPDF {
 
             log.info("Successfully combined {} SVGs into single PDF", sanitizedSvgs.size());
 
-            return WebResponseUtils.bytesToWebResponse(
-                    pdfBytes, outputFilename, MediaType.APPLICATION_PDF);
+            TempFile tempOut = tempFileManager.createManagedTempFile(".pdf");
+            try {
+                Files.write(tempOut.getPath(), pdfBytes);
+            } catch (Exception e) {
+                tempOut.close();
+                throw e;
+            }
+            return WebResponseUtils.pdfFileToWebResponse(tempOut, outputFilename);
 
         } catch (IOException e) {
             log.error("Error combining SVGs into PDF", e);
-            return ResponseEntity.status(HttpStatus.INTERNAL_SERVER_ERROR)
-                    .body(
-                            ("Conversion failed: " + e.getMessage())
-                                    .getBytes(StandardCharsets.UTF_8));
+            return errorResponse(
+                    HttpStatus.INTERNAL_SERVER_ERROR, "Conversion failed: " + e.getMessage());
         }
     }
 
-    private ResponseEntity<byte[]> handleSeparateConversion(
+    private ResponseEntity<StreamingResponseBody> handleSeparateConversion(
             List<byte[]> sanitizedSvgs, List<String> filenames) {
         List<ConvertedPdf> convertedPdfs = new ArrayList<>();
 
@@ -188,15 +199,21 @@ public class ConvertSvgToPDF {
 
         if (convertedPdfs.isEmpty()) {
             log.error("No files were successfully converted");
-            return ResponseEntity.status(HttpStatus.INTERNAL_SERVER_ERROR)
-                    .body("No files were successfully converted".getBytes(StandardCharsets.UTF_8));
+            return errorResponse(
+                    HttpStatus.INTERNAL_SERVER_ERROR, "No files were successfully converted");
         }
 
         try {
             if (convertedPdfs.size() == 1) {
                 ConvertedPdf pdf = convertedPdfs.get(0);
-                return WebResponseUtils.bytesToWebResponse(
-                        pdf.content, pdf.filename, MediaType.APPLICATION_PDF);
+                TempFile tempOut = tempFileManager.createManagedTempFile(".pdf");
+                try {
+                    Files.write(tempOut.getPath(), pdf.content);
+                } catch (Exception e) {
+                    tempOut.close();
+                    throw e;
+                }
+                return WebResponseUtils.pdfFileToWebResponse(tempOut, pdf.filename);
             }
 
             String zipFilename =
@@ -204,22 +221,18 @@ public class ConvertSvgToPDF {
                             ? "converted_svgs.zip"
                             : GeneralUtils.generateFilename(
                                     filenames.get(0), "_converted_svgs.zip");
-            byte[] zipBytes = createZipFromPdfs(convertedPdfs);
-
-            return WebResponseUtils.bytesToWebResponse(
-                    zipBytes, zipFilename, MediaType.APPLICATION_OCTET_STREAM);
+            TempFile zipFile = createZipFromPdfs(convertedPdfs);
+            return WebResponseUtils.zipFileToWebResponse(zipFile, zipFilename);
         } catch (IOException e) {
             log.error("Failed to create response", e);
-            return ResponseEntity.status(HttpStatus.INTERNAL_SERVER_ERROR)
-                    .body("Failed to create response".getBytes(StandardCharsets.UTF_8));
+            return errorResponse(HttpStatus.INTERNAL_SERVER_ERROR, "Failed to create response");
         }
     }
 
-    private byte[] createZipFromPdfs(List<ConvertedPdf> pdfs) throws IOException {
-        try (TempFile tempZipFile = new TempFile(tempFileManager, ".zip");
-                ZipOutputStream zipOut =
-                        new ZipOutputStream(Files.newOutputStream(tempZipFile.getPath()))) {
-
+    private TempFile createZipFromPdfs(List<ConvertedPdf> pdfs) throws IOException {
+        TempFile tempZipFile = tempFileManager.createManagedTempFile(".zip");
+        try (ZipOutputStream zipOut =
+                new ZipOutputStream(Files.newOutputStream(tempZipFile.getPath()))) {
             for (ConvertedPdf pdf : pdfs) {
                 ZipEntry pdfEntry = new ZipEntry(pdf.filename);
                 zipOut.putNextEntry(pdfEntry);
@@ -227,9 +240,11 @@ public class ConvertSvgToPDF {
                 zipOut.closeEntry();
                 log.debug("Added {} to ZIP", pdf.filename);
             }
-
-            return Files.readAllBytes(tempZipFile.getPath());
+        } catch (IOException e) {
+            tempZipFile.close();
+            throw e;
         }
+        return tempZipFile;
     }
 
     private static class ConvertedPdf {
diff --git a/app/core/src/main/java/stirling/software/SPDF/controller/api/converters/ConvertWebsiteToPDF.java b/app/core/src/main/java/stirling/software/SPDF/controller/api/converters/ConvertWebsiteToPDF.java
index 00f5762858..1fa927c113 100644
--- a/app/core/src/main/java/stirling/software/SPDF/controller/api/converters/ConvertWebsiteToPDF.java
+++ b/app/core/src/main/java/stirling/software/SPDF/controller/api/converters/ConvertWebsiteToPDF.java
@@ -1,6 +1,5 @@
 package stirling.software.SPDF.controller.api.converters;
 
-import java.io.ByteArrayOutputStream;
 import java.io.IOException;
 import java.net.URI;
 import java.net.http.HttpClient;
@@ -39,6 +38,8 @@ import stirling.software.common.util.ExceptionUtils;
 import stirling.software.common.util.GeneralUtils;
 import stirling.software.common.util.ProcessExecutor;
 import stirling.software.common.util.RegexPatternUtils;
+import stirling.software.common.util.TempFile;
+import stirling.software.common.util.TempFileManager;
 import stirling.software.common.util.WebResponseUtils;
 
 @ConvertApi
@@ -49,6 +50,7 @@ public class ConvertWebsiteToPDF {
     private final CustomPDFDocumentFactory pdfDocumentFactory;
     private final RuntimePathConfig runtimePathConfig;
     private final ApplicationProperties applicationProperties;
+    private final TempFileManager tempFileManager;
 
     private static final Pattern FILE_SCHEME_PATTERN =
             Pattern.compile("(?<![a-z0-9_])file\\s*:(?:/{1,3}|%2f|%5c|%3a|&#x2f;|&#47;)");
@@ -136,14 +138,15 @@ public class ConvertWebsiteToPDF {
                     .runCommandWithOutputHandling(command);
 
             // Load the PDF using pdfDocumentFactory
-            try (PDDocument doc = pdfDocumentFactory.load(tempOutputFile.toFile());
-                    ByteArrayOutputStream baos = new ByteArrayOutputStream()) {
-                // Convert URL to a safe filename
-                String outputFilename = convertURLToFileName(URL);
-
-                doc.save(baos);
-                return WebResponseUtils.baosToWebResponse(baos, outputFilename);
+            String outputFilename = convertURLToFileName(URL);
+            TempFile tempOut = tempFileManager.createManagedTempFile(".pdf");
+            try (PDDocument doc = pdfDocumentFactory.load(tempOutputFile.toFile())) {
+                doc.save(tempOut.getFile());
+            } catch (Exception e) {
+                tempOut.close();
+                throw e;
             }
+            return WebResponseUtils.pdfFileToWebResponse(tempOut, outputFilename);
         } finally {
             if (tempHtmlInput != null) {
                 try {
diff --git a/app/core/src/main/java/stirling/software/SPDF/controller/api/converters/ExtractCSVController.java b/app/core/src/main/java/stirling/software/SPDF/controller/api/converters/ExtractCSVController.java
index f986c11ed1..8603cec9f7 100644
--- a/app/core/src/main/java/stirling/software/SPDF/controller/api/converters/ExtractCSVController.java
+++ b/app/core/src/main/java/stirling/software/SPDF/controller/api/converters/ExtractCSVController.java
@@ -1,7 +1,6 @@
 package stirling.software.SPDF.controller.api.converters;
 
 import java.io.ByteArrayOutputStream;
-import java.io.IOException;
 import java.io.StringWriter;
 import java.nio.charset.StandardCharsets;
 import java.util.ArrayList;
@@ -32,6 +31,7 @@ import stirling.software.common.annotations.AutoJobPostMapping;
 import stirling.software.common.annotations.api.ConvertApi;
 import stirling.software.common.service.CustomPDFDocumentFactory;
 import stirling.software.common.util.GeneralUtils;
+import stirling.software.common.util.WebResponseUtils;
 
 import technology.tabula.ObjectExtractor;
 import technology.tabula.Page;
@@ -90,7 +90,7 @@ public class ExtractCSVController {
     }
 
     private ResponseEntity<byte[]> createZipResponse(List<CsvEntry> entries, String baseName)
-            throws IOException {
+            throws Exception {
         ByteArrayOutputStream baos = new ByteArrayOutputStream();
         try (ZipOutputStream zipOut = new ZipOutputStream(baos)) {
             for (CsvEntry entry : entries) {
@@ -101,14 +101,10 @@ public class ExtractCSVController {
             }
         }
 
-        HttpHeaders headers = new HttpHeaders();
-        headers.setContentDisposition(
-                ContentDisposition.builder("attachment")
-                        .filename(baseName + "_extracted.zip")
-                        .build());
-        headers.setContentType(MediaType.parseMediaType("application/zip"));
-
-        return ResponseEntity.ok().headers(headers).body(baos.toByteArray());
+        return WebResponseUtils.bytesToWebResponse(
+                baos.toByteArray(),
+                baseName + "_extracted.zip",
+                MediaType.APPLICATION_OCTET_STREAM);
     }
 
     private ResponseEntity<String> createCsvResponse(CsvEntry entry, String baseName) {
diff --git a/app/core/src/main/java/stirling/software/SPDF/controller/api/converters/PdfVectorExportController.java b/app/core/src/main/java/stirling/software/SPDF/controller/api/converters/PdfVectorExportController.java
index ce5549c9f4..fcee92f025 100644
--- a/app/core/src/main/java/stirling/software/SPDF/controller/api/converters/PdfVectorExportController.java
+++ b/app/core/src/main/java/stirling/software/SPDF/controller/api/converters/PdfVectorExportController.java
@@ -13,6 +13,7 @@ import org.apache.commons.io.FilenameUtils;
 import org.springframework.http.MediaType;
 import org.springframework.http.ResponseEntity;
 import org.springframework.web.bind.annotation.ModelAttribute;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import io.swagger.v3.oas.annotations.Operation;
 
@@ -38,7 +39,6 @@ import stirling.software.common.util.WebResponseUtils;
 @RequiredArgsConstructor
 public class PdfVectorExportController {
 
-    private static final MediaType PDF_MEDIA_TYPE = MediaType.APPLICATION_PDF;
     private static final Set<String> GHOSTSCRIPT_INPUTS =
             Set.of("ps", "eps", "epsf"); // PCL/PXL/XPS require GhostPDL (gpcl6/gxps)
 
@@ -51,7 +51,7 @@ public class PdfVectorExportController {
             description =
                     "Converts PostScript vector inputs (PS, EPS, EPSF) to PDF using Ghostscript."
                             + " Input:PS/EPS Output:PDF Type:SISO")
-    public ResponseEntity<byte[]> convertGhostscriptInputsToPdf(
+    public ResponseEntity<StreamingResponseBody> convertGhostscriptInputsToPdf(
             @Valid @ModelAttribute PdfVectorExportRequest request) throws Exception {
 
         String originalName =
@@ -63,9 +63,9 @@ public class PdfVectorExportController {
                         ? FilenameUtils.getExtension(originalName).toLowerCase(Locale.ROOT)
                         : "";
 
+        TempFile outputTemp = tempFileManager.createManagedTempFile(".pdf");
         try (TempFile inputTemp =
-                        new TempFile(tempFileManager, extension.isEmpty() ? "" : "." + extension);
-                TempFile outputTemp = new TempFile(tempFileManager, ".pdf")) {
+                new TempFile(tempFileManager, extension.isEmpty() ? "" : "." + extension)) {
 
             request.getFileInput().transferTo(inputTemp.getFile());
 
@@ -83,11 +83,13 @@ public class PdfVectorExportController {
                         "Unsupported Ghostscript input format {0}",
                         extension);
             }
-
-            byte[] pdfBytes = Files.readAllBytes(outputTemp.getPath());
-            String outputName = GeneralUtils.generateFilename(originalName, "_converted.pdf");
-            return WebResponseUtils.bytesToWebResponse(pdfBytes, outputName, PDF_MEDIA_TYPE);
+        } catch (Exception e) {
+            outputTemp.close();
+            throw e;
         }
+
+        String outputName = GeneralUtils.generateFilename(originalName, "_converted.pdf");
+        return WebResponseUtils.pdfFileToWebResponse(outputTemp, outputName);
     }
 
     @AutoJobPostMapping(consumes = MediaType.MULTIPART_FORM_DATA_VALUE, value = "/pdf/vector")
@@ -96,7 +98,7 @@ public class PdfVectorExportController {
             description =
                     "Converts PDF to Ghostscript vector formats (EPS, PS, PCL, or XPS)."
                             + " Input:PDF Output:VECTOR Type:SISO")
-    public ResponseEntity<byte[]> convertPdfToVector(
+    public ResponseEntity<StreamingResponseBody> convertPdfToVector(
             @Valid @ModelAttribute PdfVectorExportRequest request) throws Exception {
 
         String originalName =
@@ -110,35 +112,37 @@ public class PdfVectorExportController {
         }
         outputFormat = outputFormat.toLowerCase(Locale.ROOT);
 
-        try (TempFile inputTemp = new TempFile(tempFileManager, ".pdf");
-                TempFile outputTemp = new TempFile(tempFileManager, "." + outputFormat)) {
+        TempFile outputTemp = tempFileManager.createManagedTempFile("." + outputFormat);
+        try (TempFile inputTemp = new TempFile(tempFileManager, ".pdf")) {
 
             request.getFileInput().transferTo(inputTemp.getFile());
 
             runGhostscriptPdfToVector(inputTemp.getPath(), outputTemp.getPath(), outputFormat);
-
-            byte[] vectorBytes = Files.readAllBytes(outputTemp.getPath());
-            String outputName =
-                    GeneralUtils.generateFilename(originalName, "_converted." + outputFormat);
-
-            MediaType mediaType;
-            switch (outputFormat.toLowerCase(Locale.ROOT)) {
-                case "eps":
-                case "ps":
-                    mediaType = MediaType.parseMediaType("application/postscript");
-                    break;
-                case "pcl":
-                    mediaType = MediaType.parseMediaType("application/vnd.hp-PCL");
-                    break;
-                case "xps":
-                    mediaType = MediaType.parseMediaType("application/vnd.ms-xpsdocument");
-                    break;
-                default:
-                    mediaType = MediaType.APPLICATION_OCTET_STREAM;
-            }
-
-            return WebResponseUtils.bytesToWebResponse(vectorBytes, outputName, mediaType);
+        } catch (Exception e) {
+            outputTemp.close();
+            throw e;
         }
+
+        String outputName =
+                GeneralUtils.generateFilename(originalName, "_converted." + outputFormat);
+
+        MediaType mediaType;
+        switch (outputFormat.toLowerCase(Locale.ROOT)) {
+            case "eps":
+            case "ps":
+                mediaType = MediaType.parseMediaType("application/postscript");
+                break;
+            case "pcl":
+                mediaType = MediaType.parseMediaType("application/vnd.hp-PCL");
+                break;
+            case "xps":
+                mediaType = MediaType.parseMediaType("application/vnd.ms-xpsdocument");
+                break;
+            default:
+                mediaType = MediaType.APPLICATION_OCTET_STREAM;
+        }
+
+        return WebResponseUtils.fileToWebResponse(outputTemp, outputName, mediaType);
     }
 
     private void runGhostscriptPdfToVector(Path inputPath, Path outputPath, String outputFormat)
diff --git a/app/core/src/main/java/stirling/software/SPDF/controller/api/filters/FilterController.java b/app/core/src/main/java/stirling/software/SPDF/controller/api/filters/FilterController.java
index 795151970a..514d028c6b 100644
--- a/app/core/src/main/java/stirling/software/SPDF/controller/api/filters/FilterController.java
+++ b/app/core/src/main/java/stirling/software/SPDF/controller/api/filters/FilterController.java
@@ -9,6 +9,7 @@ import org.springframework.http.MediaType;
 import org.springframework.http.ResponseEntity;
 import org.springframework.web.bind.annotation.ModelAttribute;
 import org.springframework.web.multipart.MultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import io.github.pixee.security.Filenames;
 import io.swagger.v3.oas.annotations.Operation;
@@ -29,6 +30,7 @@ import stirling.software.common.annotations.api.FilterApi;
 import stirling.software.common.service.CustomPDFDocumentFactory;
 import stirling.software.common.util.ExceptionUtils;
 import stirling.software.common.util.PdfUtils;
+import stirling.software.common.util.TempFileManager;
 import stirling.software.common.util.WebResponseUtils;
 
 @FilterApi
@@ -36,6 +38,7 @@ import stirling.software.common.util.WebResponseUtils;
 public class FilterController {
 
     private final CustomPDFDocumentFactory pdfDocumentFactory;
+    private final TempFileManager tempFileManager;
 
     @AutoJobPostMapping(
             consumes = MediaType.MULTIPART_FORM_DATA_VALUE,
@@ -53,8 +56,8 @@ public class FilterController {
                 description = "PDF did not pass filter",
                 content = @Content())
     })
-    public ResponseEntity<byte[]> containsText(@ModelAttribute ContainsTextRequest request)
-            throws IOException, InterruptedException {
+    public ResponseEntity<StreamingResponseBody> containsText(
+            @ModelAttribute ContainsTextRequest request) throws IOException, InterruptedException {
         MultipartFile inputFile = request.getFileInput();
         String text = request.getText();
         String pageNumber = request.getPageNumbers();
@@ -62,7 +65,9 @@ public class FilterController {
         try (PDDocument pdfDocument = pdfDocumentFactory.load(inputFile)) {
             if (PdfUtils.hasText(pdfDocument, pageNumber, text)) {
                 return WebResponseUtils.pdfDocToWebResponse(
-                        pdfDocument, Filenames.toSimpleFileName(inputFile.getOriginalFilename()));
+                        pdfDocument,
+                        Filenames.toSimpleFileName(inputFile.getOriginalFilename()),
+                        tempFileManager);
             }
         }
         return ResponseEntity.noContent().build();
@@ -84,15 +89,17 @@ public class FilterController {
                 description = "PDF did not pass filter",
                 content = @Content())
     })
-    public ResponseEntity<byte[]> containsImage(@ModelAttribute PDFWithPageNums request)
-            throws IOException, InterruptedException {
+    public ResponseEntity<StreamingResponseBody> containsImage(
+            @ModelAttribute PDFWithPageNums request) throws IOException, InterruptedException {
         MultipartFile inputFile = request.getFileInput();
         String pageNumber = request.getPageNumbers();
 
         try (PDDocument pdfDocument = pdfDocumentFactory.load(inputFile)) {
             if (PdfUtils.hasImages(pdfDocument, pageNumber)) {
                 return WebResponseUtils.pdfDocToWebResponse(
-                        pdfDocument, Filenames.toSimpleFileName(inputFile.getOriginalFilename()));
+                        pdfDocument,
+                        Filenames.toSimpleFileName(inputFile.getOriginalFilename()),
+                        tempFileManager);
             }
         }
         return ResponseEntity.noContent().build();
diff --git a/app/core/src/main/java/stirling/software/SPDF/controller/api/form/FormFillController.java b/app/core/src/main/java/stirling/software/SPDF/controller/api/form/FormFillController.java
index 5c96c7030a..8692b04bcc 100644
--- a/app/core/src/main/java/stirling/software/SPDF/controller/api/form/FormFillController.java
+++ b/app/core/src/main/java/stirling/software/SPDF/controller/api/form/FormFillController.java
@@ -18,6 +18,7 @@ import org.springframework.web.bind.annotation.RequestParam;
 import org.springframework.web.bind.annotation.RequestPart;
 import org.springframework.web.bind.annotation.RestController;
 import org.springframework.web.multipart.MultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import com.opencsv.CSVWriter;
 
@@ -34,6 +35,7 @@ import stirling.software.common.model.FormFieldWithCoordinates;
 import stirling.software.common.service.CustomPDFDocumentFactory;
 import stirling.software.common.util.ExceptionUtils;
 import stirling.software.common.util.FormUtils;
+import stirling.software.common.util.TempFileManager;
 import stirling.software.common.util.WebResponseUtils;
 
 import tools.jackson.core.type.TypeReference;
@@ -59,12 +61,11 @@ public class FormFillController {
 
     private final CustomPDFDocumentFactory pdfDocumentFactory;
     private final ObjectMapper objectMapper;
+    private final TempFileManager tempFileManager;
 
-    private static ResponseEntity<byte[]> saveDocument(PDDocument document, String baseName)
+    private ResponseEntity<StreamingResponseBody> saveDocument(PDDocument document, String baseName)
             throws IOException {
-        ByteArrayOutputStream baos = new ByteArrayOutputStream();
-        document.save(baos);
-        return WebResponseUtils.bytesToWebResponse(baos.toByteArray(), baseName + ".pdf");
+        return WebResponseUtils.pdfDocToWebResponse(document, baseName + ".pdf", tempFileManager);
     }
 
     private static String buildBaseName(MultipartFile file, String suffix) {
@@ -261,7 +262,7 @@ public class FormFillController {
             summary = "Modify existing form fields",
             description =
                     "Updates existing fields in the provided PDF and returns the updated file")
-    public ResponseEntity<byte[]> modifyFields(
+    public ResponseEntity<StreamingResponseBody> modifyFields(
             @Parameter(
                             description = "The input PDF file",
                             required = true,
@@ -292,7 +293,7 @@ public class FormFillController {
     @Operation(
             summary = "Delete form fields",
             description = "Removes the specified fields from the PDF and returns the updated file")
-    public ResponseEntity<byte[]> deleteFields(
+    public ResponseEntity<StreamingResponseBody> deleteFields(
             @Parameter(
                             description = "The input PDF file",
                             required = true,
@@ -328,7 +329,7 @@ public class FormFillController {
             description =
                     "Populates the supplied PDF form using values from the provided JSON payload"
                             + " and returns the filled PDF")
-    public ResponseEntity<byte[]> fillForm(
+    public ResponseEntity<StreamingResponseBody> fillForm(
             @Parameter(
                             description = "The input PDF file",
                             required = true,
@@ -355,7 +356,7 @@ public class FormFillController {
                 document -> FormUtils.applyFieldValues(document, values, flatten, true));
     }
 
-    private ResponseEntity<byte[]> processSingleFile(
+    private ResponseEntity<StreamingResponseBody> processSingleFile(
             MultipartFile file, String suffix, DocumentProcessor processor) throws IOException {
         requirePdf(file);
 
diff --git a/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/AttachmentController.java b/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/AttachmentController.java
index 197a9f52db..9ee659c35c 100644
--- a/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/AttachmentController.java
+++ b/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/AttachmentController.java
@@ -1,7 +1,7 @@
 package stirling.software.SPDF.controller.api.misc;
 
-import java.io.ByteArrayOutputStream;
 import java.io.IOException;
+import java.nio.file.Files;
 import java.util.List;
 import java.util.Optional;
 
@@ -10,6 +10,7 @@ import org.springframework.http.MediaType;
 import org.springframework.http.ResponseEntity;
 import org.springframework.web.bind.annotation.ModelAttribute;
 import org.springframework.web.multipart.MultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import io.github.pixee.security.Filenames;
 import io.swagger.v3.oas.annotations.Operation;
@@ -30,6 +31,8 @@ import stirling.software.common.annotations.api.MiscApi;
 import stirling.software.common.service.CustomPDFDocumentFactory;
 import stirling.software.common.util.ExceptionUtils;
 import stirling.software.common.util.GeneralUtils;
+import stirling.software.common.util.TempFile;
+import stirling.software.common.util.TempFileManager;
 import stirling.software.common.util.WebResponseUtils;
 
 @MiscApi
@@ -43,14 +46,16 @@ public class AttachmentController {
 
     private final ConvertPDFToPDFA convertPDFToPDFA;
 
+    private final TempFileManager tempFileManager;
+
     @AutoJobPostMapping(consumes = MediaType.MULTIPART_FORM_DATA_VALUE, value = "/add-attachments")
     @StandardPdfResponse
     @Operation(
             summary = "Add attachments to PDF",
             description =
                     "This endpoint adds attachments to a PDF. Input:PDF, Output:PDF Type:MISO")
-    public ResponseEntity<byte[]> addAttachments(@ModelAttribute AddAttachmentRequest request)
-            throws Exception {
+    public ResponseEntity<StreamingResponseBody> addAttachments(
+            @ModelAttribute AddAttachmentRequest request) throws Exception {
         MultipartFile fileInput = request.getFileInput();
         List<MultipartFile> attachments = request.getAttachments();
         boolean convertToPdfA3b = request.isConvertToPdfA3b();
@@ -79,13 +84,9 @@ public class AttachmentController {
 
                 ConvertPDFToPDFA.fixType1FontCharSet(pdfaDocument);
 
-                ByteArrayOutputStream baos = new ByteArrayOutputStream();
-                pdfaDocument.save(baos);
-                byte[] resultBytes = baos.toByteArray();
-
                 String outputFilename = baseFileName + "_with_attachments_PDFA-3b.pdf";
-                return WebResponseUtils.bytesToWebResponse(
-                        resultBytes, outputFilename, MediaType.APPLICATION_PDF);
+                return WebResponseUtils.pdfDocToWebResponse(
+                        pdfaDocument, outputFilename, tempFileManager);
             }
         } else {
             try (PDDocument document = pdfDocumentFactory.load(request, false)) {
@@ -94,7 +95,8 @@ public class AttachmentController {
                         document,
                         GeneralUtils.generateFilename(
                                 Filenames.toSimpleFileName(fileInput.getOriginalFilename()),
-                                "_with_attachments.pdf"));
+                                "_with_attachments.pdf"),
+                        tempFileManager);
             }
         }
     }
@@ -141,7 +143,7 @@ public class AttachmentController {
             description =
                     "This endpoint extracts all embedded attachments from a PDF into a ZIP archive."
                             + " Input:PDF Output:ZIP Type:SISO")
-    public ResponseEntity<byte[]> extractAttachments(
+    public ResponseEntity<StreamingResponseBody> extractAttachments(
             @ModelAttribute ExtractAttachmentsRequest request) throws IOException {
         try (PDDocument document = pdfDocumentFactory.load(request, true)) {
             Optional<byte[]> extracted = pdfAttachmentService.extractAttachments(document);
@@ -159,8 +161,14 @@ public class AttachmentController {
                     Filenames.toSimpleFileName(
                             GeneralUtils.generateFilename(sourceName, "_attachments.zip"));
 
-            return WebResponseUtils.bytesToWebResponse(
-                    extracted.get(), outputName, MediaType.APPLICATION_OCTET_STREAM);
+            TempFile tempOut = tempFileManager.createManagedTempFile(".zip");
+            try {
+                Files.write(tempOut.getFile().toPath(), extracted.get());
+            } catch (IOException e) {
+                tempOut.close();
+                throw e;
+            }
+            return WebResponseUtils.zipFileToWebResponse(tempOut, outputName);
         }
     }
 
@@ -187,8 +195,8 @@ public class AttachmentController {
             summary = "Rename attachment in PDF",
             description =
                     "This endpoint renames an embedded attachment in a PDF. Input:PDF Output:PDF Type:MISO")
-    public ResponseEntity<byte[]> renameAttachment(@ModelAttribute RenameAttachmentRequest request)
-            throws Exception {
+    public ResponseEntity<StreamingResponseBody> renameAttachment(
+            @ModelAttribute RenameAttachmentRequest request) throws Exception {
         MultipartFile fileInput = request.getFileInput();
         String attachmentName = request.getAttachmentName();
         String newName = request.getNewName();
@@ -209,7 +217,8 @@ public class AttachmentController {
                     document,
                     GeneralUtils.generateFilename(
                             Filenames.toSimpleFileName(fileInput.getOriginalFilename()),
-                            "_attachment_renamed.pdf"));
+                            "_attachment_renamed.pdf"),
+                    tempFileManager);
         }
     }
 
@@ -221,8 +230,8 @@ public class AttachmentController {
             summary = "Delete attachment from PDF",
             description =
                     "This endpoint deletes an embedded attachment from a PDF. Input:PDF Output:PDF Type:MISO")
-    public ResponseEntity<byte[]> deleteAttachment(@ModelAttribute DeleteAttachmentRequest request)
-            throws Exception {
+    public ResponseEntity<StreamingResponseBody> deleteAttachment(
+            @ModelAttribute DeleteAttachmentRequest request) throws Exception {
         MultipartFile fileInput = request.getFileInput();
         String attachmentName = request.getAttachmentName();
 
@@ -238,7 +247,8 @@ public class AttachmentController {
                     document,
                     GeneralUtils.generateFilename(
                             Filenames.toSimpleFileName(fileInput.getOriginalFilename()),
-                            "_attachment_deleted.pdf"));
+                            "_attachment_deleted.pdf"),
+                    tempFileManager);
         }
     }
 }
diff --git a/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/AutoRenameController.java b/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/AutoRenameController.java
index 32eef1a1e9..58fd995f6d 100644
--- a/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/AutoRenameController.java
+++ b/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/AutoRenameController.java
@@ -12,6 +12,7 @@ import org.springframework.http.MediaType;
 import org.springframework.http.ResponseEntity;
 import org.springframework.web.bind.annotation.ModelAttribute;
 import org.springframework.web.multipart.MultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import io.github.pixee.security.Filenames;
 import io.swagger.v3.oas.annotations.Operation;
@@ -24,6 +25,7 @@ import stirling.software.common.annotations.AutoJobPostMapping;
 import stirling.software.common.annotations.api.MiscApi;
 import stirling.software.common.service.CustomPDFDocumentFactory;
 import stirling.software.common.util.RegexPatternUtils;
+import stirling.software.common.util.TempFileManager;
 import stirling.software.common.util.WebResponseUtils;
 
 @MiscApi
@@ -35,6 +37,7 @@ public class AutoRenameController {
     private static final int LINE_LIMIT = 200;
 
     private final CustomPDFDocumentFactory pdfDocumentFactory;
+    private final TempFileManager tempFileManager;
 
     @AutoJobPostMapping(consumes = MediaType.MULTIPART_FORM_DATA_VALUE, value = "/auto-rename")
     @Operation(
@@ -42,8 +45,8 @@ public class AutoRenameController {
             description =
                     "This endpoint accepts a PDF file and attempts to extract its title or header"
                             + " based on heuristics. Input:PDF Output:PDF Type:SISO")
-    public ResponseEntity<byte[]> extractHeader(@ModelAttribute ExtractHeaderRequest request)
-            throws Exception {
+    public ResponseEntity<StreamingResponseBody> extractHeader(
+            @ModelAttribute ExtractHeaderRequest request) throws Exception {
         MultipartFile file = request.getFileInput();
         boolean useFirstTextAsFallback = Boolean.TRUE.equals(request.getUseFirstTextAsFallback());
 
@@ -140,11 +143,14 @@ public class AutoRenameController {
                                 .matcher(header)
                                 .replaceAll("")
                                 .trim();
-                return WebResponseUtils.pdfDocToWebResponse(document, header + ".pdf");
+                return WebResponseUtils.pdfDocToWebResponse(
+                        document, header + ".pdf", tempFileManager);
             } else {
                 log.info("File has no good title to be found");
                 return WebResponseUtils.pdfDocToWebResponse(
-                        document, Filenames.toSimpleFileName(file.getOriginalFilename()));
+                        document,
+                        Filenames.toSimpleFileName(file.getOriginalFilename()),
+                        tempFileManager);
             }
         }
     }
diff --git a/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/AutoSplitPdfController.java b/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/AutoSplitPdfController.java
index eec08ba9b6..d771df580a 100644
--- a/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/AutoSplitPdfController.java
+++ b/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/AutoSplitPdfController.java
@@ -1,26 +1,31 @@
 package stirling.software.SPDF.controller.api.misc;
 
+import java.awt.Graphics2D;
 import java.awt.image.BufferedImage;
-import java.awt.image.DataBufferByte;
-import java.awt.image.DataBufferInt;
-import java.io.ByteArrayOutputStream;
 import java.io.IOException;
+import java.io.OutputStream;
 import java.nio.file.Files;
 import java.util.ArrayList;
-import java.util.HashSet;
+import java.util.EnumMap;
 import java.util.List;
+import java.util.Map;
 import java.util.Set;
 import java.util.zip.ZipEntry;
 import java.util.zip.ZipOutputStream;
 
+import org.apache.pdfbox.cos.COSName;
 import org.apache.pdfbox.pdmodel.PDDocument;
+import org.apache.pdfbox.pdmodel.PDPage;
+import org.apache.pdfbox.pdmodel.graphics.image.PDImageXObject;
 import org.apache.pdfbox.rendering.PDFRenderer;
 import org.springframework.http.MediaType;
 import org.springframework.http.ResponseEntity;
 import org.springframework.web.bind.annotation.ModelAttribute;
 import org.springframework.web.multipart.MultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import com.google.zxing.*;
+import com.google.zxing.common.GlobalHistogramBinarizer;
 import com.google.zxing.common.HybridBinarizer;
 
 import io.github.pixee.security.Filenames;
@@ -35,7 +40,6 @@ import stirling.software.common.annotations.AutoJobPostMapping;
 import stirling.software.common.annotations.api.MiscApi;
 import stirling.software.common.model.ApplicationProperties;
 import stirling.software.common.service.CustomPDFDocumentFactory;
-import stirling.software.common.util.ApplicationContextProvider;
 import stirling.software.common.util.ExceptionUtils;
 import stirling.software.common.util.GeneralUtils;
 import stirling.software.common.util.TempFile;
@@ -48,61 +52,219 @@ import stirling.software.common.util.WebResponseUtils;
 public class AutoSplitPdfController {
 
     private static final Set<String> VALID_QR_CONTENTS =
-            new HashSet<>(
-                    Set.of(
-                            "https://github.com/Stirling-Tools/Stirling-PDF",
-                            "https://github.com/Frooodle/Stirling-PDF",
-                            "https://stirlingpdf.com"));
+            Set.of(
+                    "https://github.com/Stirling-Tools/Stirling-PDF",
+                    "https://github.com/Frooodle/Stirling-PDF",
+                    "https://stirlingpdf.com");
+
+    private static final int MAX_IMAGES_FOR_DIRECT_EXTRACTION = 3;
+
+    // 150 DPI is sufficient for QR code detection — higher wastes memory and CPU
+    private static final int QR_DETECTION_DPI = 150;
+
+    // Max total pixels before we downscale to avoid OOM on getRGB() allocation
+    private static final long MAX_IMAGE_PIXELS = 100_000_000L; // ~10000x10000
+
+    // Number of evenly-spaced pixel samples used for the blank image check
+    private static final int BLANK_CHECK_SAMPLES = 20;
+
+    private static final Map<DecodeHintType, Object> DECODE_HINTS;
+
+    static {
+        DECODE_HINTS = new EnumMap<>(DecodeHintType.class);
+        DECODE_HINTS.put(DecodeHintType.TRY_HARDER, Boolean.TRUE);
+        DECODE_HINTS.put(DecodeHintType.ALSO_INVERTED, Boolean.TRUE);
+        DECODE_HINTS.put(DecodeHintType.POSSIBLE_FORMATS, List.of(BarcodeFormat.QR_CODE));
+    }
 
     private final CustomPDFDocumentFactory pdfDocumentFactory;
     private final TempFileManager tempFileManager;
+    private final ApplicationProperties applicationProperties;
 
-    private static String decodeQRCode(BufferedImage bufferedImage) {
-        LuminanceSource source;
-
-        if (bufferedImage.getRaster().getDataBuffer() instanceof DataBufferByte dataBufferByte) {
-            byte[] pixels = dataBufferByte.getData();
-            source =
-                    new PlanarYUVLuminanceSource(
-                            pixels,
-                            bufferedImage.getWidth(),
-                            bufferedImage.getHeight(),
-                            0,
-                            0,
-                            bufferedImage.getWidth(),
-                            bufferedImage.getHeight(),
-                            false);
-        } else if (bufferedImage.getRaster().getDataBuffer()
-                instanceof DataBufferInt dataBufferInt) {
-            int[] pixels = dataBufferInt.getData();
-            byte[] newPixels = new byte[pixels.length];
-            for (int i = 0; i < pixels.length; i++) {
-                newPixels[i] = (byte) (pixels[i] & 0xff);
-            }
-            source =
-                    new PlanarYUVLuminanceSource(
-                            newPixels,
-                            bufferedImage.getWidth(),
-                            bufferedImage.getHeight(),
-                            0,
-                            0,
-                            bufferedImage.getWidth(),
-                            bufferedImage.getHeight(),
-                            false);
-        } else {
-            throw new IllegalArgumentException(
-                    "BufferedImage must have 8-bit gray scale, 24-bit RGB, 32-bit ARGB (packed"
-                            + " int), byte gray, or 3-byte/4-byte RGB image data");
+    /**
+     * Downscale an image if it exceeds the maximum pixel count. Scales uniformly based on the
+     * pixel-count ratio so both portrait and landscape images are handled correctly.
+     */
+    private static BufferedImage downscaleIfNeeded(BufferedImage image) {
+        long totalPixels = (long) image.getWidth() * image.getHeight();
+        if (totalPixels <= MAX_IMAGE_PIXELS) {
+            return image;
         }
+        double scale = Math.sqrt((double) MAX_IMAGE_PIXELS / totalPixels);
+        int newWidth = Math.max(1, (int) (image.getWidth() * scale));
+        int newHeight = Math.max(1, (int) (image.getHeight() * scale));
+        log.debug(
+                "Downscaling image from {}x{} to {}x{} for QR detection",
+                image.getWidth(),
+                image.getHeight(),
+                newWidth,
+                newHeight);
+        BufferedImage scaled = new BufferedImage(newWidth, newHeight, BufferedImage.TYPE_INT_RGB);
+        Graphics2D g = scaled.createGraphics();
+        g.drawImage(image, 0, 0, newWidth, newHeight, null);
+        g.dispose();
+        return scaled;
+    }
 
-        BinaryBitmap bitmap = new BinaryBitmap(new HybridBinarizer(source));
+    /**
+     * Quick check whether an image appears to be blank (single solid colour). Samples pixels at
+     * evenly-spaced positions — if all samples match the first pixel the image is almost certainly
+     * blank (e.g. a masked image that returned solid white).
+     */
+    private static boolean isBlankImage(int[] pixels) {
+        if (pixels.length == 0) return true;
+        int first = pixels[0];
+        int step = Math.max(1, pixels.length / BLANK_CHECK_SAMPLES);
+        for (int i = step; i < pixels.length; i += step) {
+            if (pixels[i] != first) {
+                return false;
+            }
+        }
+        return true;
+    }
 
+    /**
+     * Try to decode a QR code from pre-extracted RGB pixel data using multiple binarization
+     * strategies. Returns the decoded text or null.
+     *
+     * <p>Strategy 1: HybridBinarizer — good for variable brightness (digital PDFs).
+     *
+     * <p>Strategy 2: GlobalHistogramBinarizer — better for scanned/noisy images with uniform
+     * lighting, and for QR codes with embedded logos that confuse the hybrid approach.
+     */
+    private static String tryDecodeQR(int[] pixels, int width, int height) {
+        RGBLuminanceSource source = new RGBLuminanceSource(width, height, pixels);
+        MultiFormatReader reader = new MultiFormatReader();
+
+        // Strategy 1: HybridBinarizer — good for variable brightness (digital PDFs)
         try {
-            Result result = new MultiFormatReader().decode(bitmap);
+            BinaryBitmap bitmap = new BinaryBitmap(new HybridBinarizer(source));
+            Result result = reader.decode(bitmap, DECODE_HINTS);
+            log.debug("QR detected via HybridBinarizer: '{}'", result.getText());
             return result.getText();
         } catch (NotFoundException e) {
-            return null; // there is no QR code in the image
+            // continue
         }
+
+        // Strategy 2: GlobalHistogramBinarizer — better for scanned/noisy images
+        try {
+            BinaryBitmap bitmap = new BinaryBitmap(new GlobalHistogramBinarizer(source));
+            Result result = reader.decode(bitmap, DECODE_HINTS);
+            log.debug("QR detected via GlobalHistogramBinarizer: '{}'", result.getText());
+            return result.getText();
+        } catch (NotFoundException e) {
+            return null;
+        }
+    }
+
+    /**
+     * Attempt to decode a QR code from a BufferedImage. Handles downscaling for oversized images
+     * and skips blank images early.
+     */
+    private static String decodeQRCode(BufferedImage bufferedImage) {
+        bufferedImage = downscaleIfNeeded(bufferedImage);
+
+        int width = bufferedImage.getWidth();
+        int height = bufferedImage.getHeight();
+        int[] pixels = new int[width * height];
+        bufferedImage.getRGB(0, 0, width, height, pixels, 0, width);
+
+        // Skip blank images early (e.g. masked images that decode to solid white)
+        if (isBlankImage(pixels)) {
+            log.debug("Skipping blank {}x{} image", width, height);
+            return null;
+        }
+
+        return tryDecodeQR(pixels, width, height);
+    }
+
+    /** Count the number of images embedded in a page's resources. */
+    private static int countPageImages(PDPage page) {
+        if (page.getResources() == null || page.getResources().getXObjectNames() == null) {
+            return 0;
+        }
+        int count = 0;
+        for (COSName name : page.getResources().getXObjectNames()) {
+            if (page.getResources().isImageXObject(name)) {
+                count++;
+            }
+        }
+        return count;
+    }
+
+    /**
+     * Extract images directly from a page's resources and check each for a QR code. Returns the QR
+     * code text if found, null otherwise.
+     */
+    private static String checkPageImagesDirect(PDPage page) throws IOException {
+        if (page.getResources() == null || page.getResources().getXObjectNames() == null) {
+            return null;
+        }
+        for (COSName name : page.getResources().getXObjectNames()) {
+            if (!page.getResources().isImageXObject(name)) {
+                continue;
+            }
+            PDImageXObject imageObject = (PDImageXObject) page.getResources().getXObject(name);
+
+            BufferedImage image;
+            try {
+                image = imageObject.getImage();
+            } catch (OutOfMemoryError e) {
+                log.warn(
+                        "Skipping oversized embedded image '{}' ({}x{}) - out of memory",
+                        name.getName(),
+                        imageObject.getWidth(),
+                        imageObject.getHeight());
+                continue;
+            }
+
+            String result = decodeQRCode(image);
+            if (result != null) {
+                return result;
+            }
+        }
+        return null;
+    }
+
+    /**
+     * Render the full page to an image and scan it for a QR code. Tries a low DPI first (fast, low
+     * memory) and only retries at the system's maxDPI if detection fails. The first rendered image
+     * is released before the retry to allow GC to reclaim it.
+     */
+    private String checkPageByRendering(PDFRenderer pdfRenderer, int pageNum) throws IOException {
+        log.debug("Rendering page {} at {} DPI for QR detection", pageNum + 1, QR_DETECTION_DPI);
+
+        BufferedImage bim =
+                ExceptionUtils.handleOomRendering(
+                        pageNum + 1,
+                        QR_DETECTION_DPI,
+                        () -> pdfRenderer.renderImageWithDPI(pageNum, QR_DETECTION_DPI));
+        String result = decodeQRCode(bim);
+        bim = null; // allow GC before potential high-DPI retry
+
+        if (result == null) {
+            int maxDpi = getSystemMaxDpi();
+            if (maxDpi > QR_DETECTION_DPI) {
+                log.debug(
+                        "Retrying page {} at {} DPI (low-DPI detection failed)",
+                        pageNum + 1,
+                        maxDpi);
+                BufferedImage highRes =
+                        ExceptionUtils.handleOomRendering(
+                                pageNum + 1,
+                                maxDpi,
+                                () -> pdfRenderer.renderImageWithDPI(pageNum, maxDpi));
+                result = decodeQRCode(highRes);
+            }
+        }
+        return result;
+    }
+
+    private int getSystemMaxDpi() {
+        if (applicationProperties != null && applicationProperties.getSystem() != null) {
+            return applicationProperties.getSystem().getMaxDPI();
+        }
+        return QR_DETECTION_DPI;
     }
 
     @AutoJobPostMapping(value = "/auto-split-pdf", consumes = MediaType.MULTIPART_FORM_DATA_VALUE)
@@ -111,42 +273,56 @@ public class AutoSplitPdfController {
             summary = "Auto split PDF pages into separate documents",
             description =
                     "This endpoint accepts a PDF file, scans each page for a specific QR code, and"
-                            + " splits the document at the QR code boundaries. The output is a zip file"
-                            + " containing each separate PDF document. Input:PDF Output:ZIP-PDF"
+                            + " splits the document at the QR code boundaries. The output is a zip"
+                            + " file containing each separate PDF document. Input:PDF Output:ZIP-PDF"
                             + " Type:SISO")
-    public ResponseEntity<byte[]> autoSplitPdf(@ModelAttribute AutoSplitPdfRequest request)
-            throws IOException {
+    public ResponseEntity<StreamingResponseBody> autoSplitPdf(
+            @ModelAttribute AutoSplitPdfRequest request) throws IOException {
         MultipartFile file = request.getFileInput();
         boolean duplexMode = Boolean.TRUE.equals(request.getDuplexMode());
 
+        log.info(
+                "Auto-split starting: filename='{}', size={} bytes, duplexMode={}",
+                file.getOriginalFilename(),
+                file.getSize(),
+                duplexMode);
+
         List<PDDocument> splitDocuments = new ArrayList<>();
-        try (TempFile outputTempFile = new TempFile(tempFileManager, ".zip");
-                PDDocument document = pdfDocumentFactory.load(file.getInputStream())) {
+        TempFile outputTempFile = new TempFile(tempFileManager, ".zip");
+        try (PDDocument document = pdfDocumentFactory.load(file.getInputStream())) {
+            int totalPages = document.getNumberOfPages();
+            log.info("PDF loaded, totalPages={}", totalPages);
+
             PDFRenderer pdfRenderer = new PDFRenderer(document);
             pdfRenderer.setSubsamplingAllowed(true);
 
-            for (int page = 0; page < document.getNumberOfPages(); ++page) {
-                BufferedImage bim;
+            for (int page = 0; page < totalPages; ++page) {
+                PDPage pdPage = document.getPage(page);
+                int imageCount = countPageImages(pdPage);
 
-                // Use global maximum DPI setting, fallback to 300 if not set
-                int renderDpi = 150; // Default fallback
-                ApplicationProperties properties =
-                        ApplicationContextProvider.getBean(ApplicationProperties.class);
-                if (properties != null && properties.getSystem() != null) {
-                    renderDpi = properties.getSystem().getMaxDPI();
+                String qrResult;
+                if (imageCount > 0 && imageCount <= MAX_IMAGES_FOR_DIRECT_EXTRACTION) {
+                    // Try extracting images directly from the PDF (faster, avoids rendering)
+                    qrResult = checkPageImagesDirect(pdPage);
+                    if (qrResult == null) {
+                        // Fall back to rendering — the image may use masking/compositing
+                        // that getImage() doesn't resolve, or the QR may be vector-drawn
+                        qrResult = checkPageByRendering(pdfRenderer, page);
+                    }
+                } else {
+                    // Too many images or no images — render the full page
+                    qrResult = checkPageByRendering(pdfRenderer, page);
                 }
-                final int dpi = renderDpi;
-                final int pageNum = page;
 
-                bim =
-                        ExceptionUtils.handleOomRendering(
-                                pageNum + 1,
-                                dpi,
-                                () -> pdfRenderer.renderImageWithDPI(pageNum, dpi));
-                String result = decodeQRCode(bim);
+                boolean isValidQrCode = qrResult != null && VALID_QR_CONTENTS.contains(qrResult);
+                if (isValidQrCode) {
+                    log.info(
+                            "Page {}/{} contains QR divider ('{}')",
+                            page + 1,
+                            totalPages,
+                            qrResult);
+                }
 
-                boolean isValidQrCode = VALID_QR_CONTENTS.contains(result);
-                log.debug("detected qr code {}, code is vale={}", result, isValidQrCode);
                 if (isValidQrCode && page != 0) {
                     splitDocuments.add(new PDDocument());
                 }
@@ -159,45 +335,36 @@ public class AutoSplitPdfController {
                     splitDocuments.add(firstDocument);
                 }
 
-                // If duplexMode is true and current page is a divider, then skip next page
                 if (duplexMode && isValidQrCode) {
-                    page++;
+                    page++; // skip back of divider page
                 }
             }
 
-            // Remove split documents that have no pages
             splitDocuments.removeIf(pdDocument -> pdDocument.getNumberOfPages() == 0);
+            log.info("Split complete, {} output documents", splitDocuments.size());
 
             String filename =
                     GeneralUtils.removeExtension(
                             Filenames.toSimpleFileName(file.getOriginalFilename()));
 
-            try (ZipOutputStream zipOut =
-                    new ZipOutputStream(Files.newOutputStream(outputTempFile.getPath()))) {
+            // Stream split documents directly into zip — avoids holding all PDFs in memory
+            try (OutputStream fileOut = Files.newOutputStream(outputTempFile.getPath());
+                    ZipOutputStream zipOut = new ZipOutputStream(fileOut)) {
                 for (int i = 0; i < splitDocuments.size(); i++) {
                     String fileName = filename + "_" + (i + 1) + ".pdf";
-                    PDDocument splitDocument = splitDocuments.get(i);
-
-                    ByteArrayOutputStream baos = new ByteArrayOutputStream();
-                    splitDocument.save(baos);
-                    byte[] pdf = baos.toByteArray();
-
-                    ZipEntry pdfEntry = new ZipEntry(fileName);
-                    zipOut.putNextEntry(pdfEntry);
-                    zipOut.write(pdf);
+                    zipOut.putNextEntry(new ZipEntry(fileName));
+                    splitDocuments.get(i).save(zipOut);
                     zipOut.closeEntry();
                 }
             }
 
-            byte[] data = Files.readAllBytes(outputTempFile.getPath());
-            return WebResponseUtils.bytesToWebResponse(
-                    data, filename + ".zip", MediaType.APPLICATION_OCTET_STREAM);
+            return WebResponseUtils.zipFileToWebResponse(outputTempFile, filename + ".zip");
 
         } catch (Exception e) {
+            outputTempFile.close();
             log.error("Error in auto split", e);
             throw e;
         } finally {
-            // Clean up split documents
             for (PDDocument splitDoc : splitDocuments) {
                 try {
                     splitDoc.close();
diff --git a/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/BlankPageController.java b/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/BlankPageController.java
index 486e9d1176..98364d9c2f 100644
--- a/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/BlankPageController.java
+++ b/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/BlankPageController.java
@@ -1,8 +1,9 @@
 package stirling.software.SPDF.controller.api.misc;
 
 import java.awt.image.BufferedImage;
-import java.io.ByteArrayOutputStream;
 import java.io.IOException;
+import java.io.OutputStream;
+import java.nio.file.Files;
 import java.util.ArrayList;
 import java.util.List;
 import java.util.Locale;
@@ -19,6 +20,7 @@ import org.springframework.http.MediaType;
 import org.springframework.http.ResponseEntity;
 import org.springframework.web.bind.annotation.ModelAttribute;
 import org.springframework.web.multipart.MultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import io.github.pixee.security.Filenames;
 import io.swagger.v3.oas.annotations.Operation;
@@ -35,6 +37,8 @@ import stirling.software.common.util.ApplicationContextProvider;
 import stirling.software.common.util.ExceptionUtils;
 import stirling.software.common.util.GeneralUtils;
 import stirling.software.common.util.PdfUtils;
+import stirling.software.common.util.TempFile;
+import stirling.software.common.util.TempFileManager;
 import stirling.software.common.util.WebResponseUtils;
 
 @MiscApi
@@ -43,6 +47,7 @@ import stirling.software.common.util.WebResponseUtils;
 public class BlankPageController {
 
     private final CustomPDFDocumentFactory pdfDocumentFactory;
+    private final TempFileManager tempFileManager;
 
     public static boolean isBlankImage(
             BufferedImage image, int threshold, double whitePercent, int blurSize) {
@@ -83,7 +88,8 @@ public class BlankPageController {
                     "This endpoint removes blank pages from a given PDF file. Users can specify the"
                             + " threshold and white percentage to tune the detection of blank pages."
                             + " Input:PDF Output:PDF Type:SISO")
-    public ResponseEntity<byte[]> removeBlankPages(@ModelAttribute RemoveBlankPagesRequest request)
+    public ResponseEntity<StreamingResponseBody> removeBlankPages(
+            @ModelAttribute RemoveBlankPagesRequest request)
             throws IOException, InterruptedException {
         MultipartFile inputFile = request.getFileInput();
         int threshold = request.getThreshold();
@@ -149,28 +155,29 @@ public class BlankPageController {
                 pageIndex++;
             }
 
-            ByteArrayOutputStream baos = new ByteArrayOutputStream();
-            ZipOutputStream zos = new ZipOutputStream(baos);
-
             String filename =
                     GeneralUtils.removeExtension(
                             Filenames.toSimpleFileName(inputFile.getOriginalFilename()));
 
-            if (!nonBlankPages.isEmpty()) {
-                createZipEntry(zos, nonBlankPages, filename + "_nonBlankPages.pdf");
-            } else {
-                createZipEntry(zos, blankPages, filename + "_allBlankPages.pdf");
-            }
+            TempFile tempOut = tempFileManager.createManagedTempFile(".zip");
+            try (OutputStream fos = Files.newOutputStream(tempOut.getFile().toPath());
+                    ZipOutputStream zos = new ZipOutputStream(fos)) {
+                if (!nonBlankPages.isEmpty()) {
+                    createZipEntry(zos, nonBlankPages, filename + "_nonBlankPages.pdf");
+                } else {
+                    createZipEntry(zos, blankPages, filename + "_allBlankPages.pdf");
+                }
 
-            if (!nonBlankPages.isEmpty() && !blankPages.isEmpty()) {
-                createZipEntry(zos, blankPages, filename + "_blankPages.pdf");
+                if (!nonBlankPages.isEmpty() && !blankPages.isEmpty()) {
+                    createZipEntry(zos, blankPages, filename + "_blankPages.pdf");
+                }
+            } catch (IOException e) {
+                tempOut.close();
+                throw e;
             }
 
-            zos.close();
-
             log.info("Returning ZIP file: {}", filename + "_processed.zip");
-            return WebResponseUtils.baosToWebResponse(
-                    baos, filename + "_processed.zip", MediaType.APPLICATION_OCTET_STREAM);
+            return WebResponseUtils.zipFileToWebResponse(tempOut, filename + "_processed.zip");
 
         } catch (ExceptionUtils.OutOfMemoryDpiException e) {
             throw e;
diff --git a/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/CompressController.java b/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/CompressController.java
index 0a321ff3b8..d4ad134ece 100644
--- a/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/CompressController.java
+++ b/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/CompressController.java
@@ -38,6 +38,7 @@ import org.springframework.http.ResponseEntity;
 import org.springframework.web.bind.annotation.ModelAttribute;
 import org.springframework.web.multipart.MultipartFile;
 import org.springframework.web.server.ResponseStatusException;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import io.swagger.v3.oas.annotations.Operation;
 
@@ -328,7 +329,8 @@ public class CompressController {
                                     + "_"
                                     + image.getBitsPerComponent();
 
-                    return bytesToHexString(generateMD5(enhancedData.getBytes()));
+                    return bytesToHexString(
+                            generateMD5(enhancedData.getBytes(StandardCharsets.UTF_8)));
                 }
                 return "empty-stream";
             }
@@ -727,7 +729,8 @@ public class CompressController {
                 params.append("_").append(image.getDecode().toString());
             }
 
-            return bytesToHexString(generateMD5(params.toString().getBytes()));
+            return bytesToHexString(
+                    generateMD5(params.toString().getBytes(StandardCharsets.UTF_8)));
         } catch (Exception e) {
             return "fallback-decode-" + System.identityHashCode(image);
         }
@@ -798,7 +801,8 @@ public class CompressController {
                     metadata.append("_softmask");
                 }
 
-                return bytesToHexString(generateMD5(metadata.toString().getBytes()));
+                return bytesToHexString(
+                        generateMD5(metadata.toString().getBytes(StandardCharsets.UTF_8)));
             } catch (Exception e) {
                 return "fallback-meta-" + System.identityHashCode(image);
             }
@@ -924,8 +928,8 @@ public class CompressController {
             description =
                     "This endpoint accepts a PDF file and optimizes it based on the provided"
                             + " parameters. Input:PDF Output:PDF Type:SISO")
-    public ResponseEntity<byte[]> optimizePdf(@ModelAttribute OptimizePdfRequest request)
-            throws Exception {
+    public ResponseEntity<StreamingResponseBody> optimizePdf(
+            @ModelAttribute OptimizePdfRequest request) throws Exception {
         MultipartFile inputFile = request.getFileInput();
 
         // Validate input file
@@ -1097,7 +1101,8 @@ public class CompressController {
 
             try {
                 try (PDDocument document = pdfDocumentFactory.load(currentFile.toFile())) {
-                    return WebResponseUtils.pdfDocToWebResponse(document, outputFilename);
+                    return WebResponseUtils.pdfDocToWebResponse(
+                            document, outputFilename, tempFileManager);
                 }
             } catch (IOException e) {
                 throw ExceptionUtils.handlePdfException(e, "PDF optimization");
diff --git a/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/ConfigController.java b/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/ConfigController.java
index 439436a44c..1ea0ddd0aa 100644
--- a/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/ConfigController.java
+++ b/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/ConfigController.java
@@ -23,6 +23,7 @@ import stirling.software.common.configuration.AppConfig;
 import stirling.software.common.model.ApplicationProperties;
 import stirling.software.common.service.ServerCertificateServiceInterface;
 import stirling.software.common.service.UserServiceInterface;
+import stirling.software.common.util.GeneralUtils;
 
 @ConfigApi
 @Hidden
@@ -122,8 +123,17 @@ public class ConfigController {
             configData.put("contextPath", appConfig.getContextPath());
             configData.put("serverPort", appConfig.getServerPort());
 
-            // Add frontendUrl for mobile scanner QR codes
             String frontendUrl = applicationProperties.getSystem().getFrontendUrl();
+            if ((frontendUrl == null || frontendUrl.isBlank())
+                    && Boolean.parseBoolean(
+                            System.getProperty("STIRLING_PDF_TAURI_MODE", "false"))) {
+                String localIp = GeneralUtils.getLocalNetworkIp();
+                if (localIp != null) {
+                    String scheme =
+                            appConfig.getBackendUrl().startsWith("https") ? "https" : "http";
+                    frontendUrl = scheme + "://" + localIp + ":" + appConfig.getServerPort();
+                }
+            }
             configData.put("frontendUrl", frontendUrl != null ? frontendUrl : "");
 
             // Add mobile scanner settings
diff --git a/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/DecompressPdfController.java b/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/DecompressPdfController.java
index 2abfaa8af6..9afe8ba235 100644
--- a/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/DecompressPdfController.java
+++ b/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/DecompressPdfController.java
@@ -1,6 +1,5 @@
 package stirling.software.SPDF.controller.api.misc;
 
-import java.io.ByteArrayOutputStream;
 import java.io.IOException;
 import java.io.OutputStream;
 import java.util.HashSet;
@@ -14,6 +13,7 @@ import org.springframework.http.MediaType;
 import org.springframework.http.ResponseEntity;
 import org.springframework.web.bind.annotation.ModelAttribute;
 import org.springframework.web.multipart.MultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import io.swagger.v3.oas.annotations.Operation;
 
@@ -26,6 +26,8 @@ import stirling.software.common.model.api.PDFFile;
 import stirling.software.common.service.CustomPDFDocumentFactory;
 import stirling.software.common.util.ExceptionUtils;
 import stirling.software.common.util.GeneralUtils;
+import stirling.software.common.util.TempFile;
+import stirling.software.common.util.TempFileManager;
 import stirling.software.common.util.WebResponseUtils;
 
 @MiscApi
@@ -34,12 +36,13 @@ import stirling.software.common.util.WebResponseUtils;
 public class DecompressPdfController {
 
     private final CustomPDFDocumentFactory pdfDocumentFactory;
+    private final TempFileManager tempFileManager;
 
     @AutoJobPostMapping(value = "/decompress-pdf", consumes = MediaType.MULTIPART_FORM_DATA_VALUE)
     @Operation(
             summary = "Decompress PDF streams",
             description = "Fully decompresses all PDF streams including text content")
-    public ResponseEntity<byte[]> decompressPdf(@ModelAttribute PDFFile request)
+    public ResponseEntity<StreamingResponseBody> decompressPdf(@ModelAttribute PDFFile request)
             throws IOException {
 
         MultipartFile file = request.getFileInput();
@@ -48,13 +51,18 @@ public class DecompressPdfController {
             // Process all objects in document
             processAllObjects(document);
 
-            // Save with explicit no compression
-            ByteArrayOutputStream baos = new ByteArrayOutputStream();
-            document.save(baos, CompressParameters.NO_COMPRESSION);
+            // Save with explicit no compression to a temp file
+            TempFile tempOut = tempFileManager.createManagedTempFile(".pdf");
+            try {
+                document.save(tempOut.getFile(), CompressParameters.NO_COMPRESSION);
+            } catch (IOException e) {
+                tempOut.close();
+                throw e;
+            }
 
-            // Return the PDF as a response
-            return WebResponseUtils.bytesToWebResponse(
-                    baos.toByteArray(),
+            // Return the PDF as a streaming response
+            return WebResponseUtils.pdfFileToWebResponse(
+                    tempOut,
                     GeneralUtils.generateFilename(file.getOriginalFilename(), "_decompressed.pdf"));
         }
     }
diff --git a/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/ExtractImageScansController.java b/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/ExtractImageScansController.java
index bcf57d17a9..c5cfef2c79 100644
--- a/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/ExtractImageScansController.java
+++ b/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/ExtractImageScansController.java
@@ -1,8 +1,8 @@
 package stirling.software.SPDF.controller.api.misc;
 
 import java.awt.image.BufferedImage;
-import java.io.FileOutputStream;
 import java.io.IOException;
+import java.io.OutputStream;
 import java.nio.file.Files;
 import java.nio.file.Path;
 import java.util.ArrayList;
@@ -21,6 +21,7 @@ import org.springframework.http.MediaType;
 import org.springframework.http.ResponseEntity;
 import org.springframework.web.bind.annotation.ModelAttribute;
 import org.springframework.web.multipart.MultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import io.swagger.v3.oas.annotations.Operation;
 
@@ -39,6 +40,8 @@ import stirling.software.common.util.ExceptionUtils;
 import stirling.software.common.util.GeneralUtils;
 import stirling.software.common.util.ProcessExecutor;
 import stirling.software.common.util.ProcessExecutor.ProcessExecutorResult;
+import stirling.software.common.util.TempFile;
+import stirling.software.common.util.TempFileManager;
 import stirling.software.common.util.WebResponseUtils;
 
 @MiscApi
@@ -49,6 +52,7 @@ public class ExtractImageScansController {
     private static final String REPLACEFIRST = "[.][^.]+$";
 
     private final CustomPDFDocumentFactory pdfDocumentFactory;
+    private final TempFileManager tempFileManager;
 
     @AutoJobPostMapping(
             consumes = MediaType.MULTIPART_FORM_DATA_VALUE,
@@ -61,7 +65,7 @@ public class ExtractImageScansController {
                             + " parameters. Users can specify angle threshold, tolerance, minimum area,"
                             + " minimum contour area, and border size. Input:PDF Output:IMAGE/ZIP"
                             + " Type:SIMO")
-    public ResponseEntity<byte[]> extractImageScans(
+    public ResponseEntity<StreamingResponseBody> extractImageScans(
             @ModelAttribute ExtractImageScansRequest request)
             throws IOException, InterruptedException {
         MultipartFile inputFile = request.getFileInput();
@@ -71,9 +75,8 @@ public class ExtractImageScansController {
 
         List<String> images = new ArrayList<>();
 
-        List<Path> tempImageFiles = new ArrayList<>();
-        Path tempInputFile;
-        Path tempZipFile = null;
+        List<TempFile> tempImageFiles = new ArrayList<>();
+        TempFile tempInputFile = null;
         List<Path> tempDirs = new ArrayList<>();
 
         if (!CheckProgramInstall.isPythonAvailable()) {
@@ -83,6 +86,8 @@ public class ExtractImageScansController {
 
         String pythonVersion = CheckProgramInstall.getAvailablePythonCommand();
         Path splitPhotosScript = GeneralUtils.extractScript("split_photos.py");
+        TempFile finalOutput = null;
+        boolean finalOutputOwnershipTransferred = false;
         try {
             // Check if input file is a PDF
             if ("pdf".equalsIgnoreCase(extension)) {
@@ -96,7 +101,8 @@ public class ExtractImageScansController {
                     // Create images of all pages
                     for (int i = 0; i < pageCount; i++) {
                         // Create temp file to save the image
-                        Path tempFile = Files.createTempFile("image_", ".png");
+                        TempFile tempImage = tempFileManager.createManagedTempFile(".png");
+                        tempImageFiles.add(tempImage);
 
                         // Render image and save as temp file
                         BufferedImage image;
@@ -116,18 +122,17 @@ public class ExtractImageScansController {
                                         pageIndex + 1,
                                         dpi,
                                         () -> pdfRenderer.renderImageWithDPI(pageIndex, dpi));
-                        ImageIO.write(image, "png", tempFile.toFile());
+                        ImageIO.write(image, "png", tempImage.getFile());
 
                         // Add temp file path to images list
-                        images.add(tempFile.toString());
-                        tempImageFiles.add(tempFile);
+                        images.add(tempImage.getAbsolutePath());
                     }
                 }
             } else {
-                tempInputFile = Files.createTempFile("input_", "." + extension);
-                inputFile.transferTo(tempInputFile);
+                tempInputFile = tempFileManager.createManagedTempFile("." + extension);
+                inputFile.transferTo(tempInputFile.getFile());
                 // Add input file path to images list
-                images.add(tempInputFile.toString());
+                images.add(tempInputFile.getAbsolutePath());
             }
 
             List<byte[]> processedImageBytes = new ArrayList<>();
@@ -177,10 +182,10 @@ public class ExtractImageScansController {
             if (processedImageBytes.size() > 1) {
                 String outputZipFilename =
                         GeneralUtils.generateFilename(fileName, "_processed.zip");
-                tempZipFile = Files.createTempFile("output_", ".zip");
+                finalOutput = tempFileManager.createManagedTempFile(".zip");
 
                 try (ZipOutputStream zipOut =
-                        new ZipOutputStream(new FileOutputStream(tempZipFile.toFile()))) {
+                        new ZipOutputStream(Files.newOutputStream(finalOutput.getPath()))) {
                     // Add processed images to the zip
                     for (int i = 0; i < processedImageBytes.size(); i++) {
                         ZipEntry entry =
@@ -193,13 +198,10 @@ public class ExtractImageScansController {
                     }
                 }
 
-                byte[] zipBytes = Files.readAllBytes(tempZipFile);
-
-                // Clean up the temporary zip file
-                Files.deleteIfExists(tempZipFile);
-
-                return WebResponseUtils.bytesToWebResponse(
-                        zipBytes, outputZipFilename, MediaType.APPLICATION_OCTET_STREAM);
+                ResponseEntity<StreamingResponseBody> response =
+                        WebResponseUtils.zipFileToWebResponse(finalOutput, outputZipFilename);
+                finalOutputOwnershipTransferred = true;
+                return response;
             }
             if (processedImageBytes.isEmpty()) {
                 throw ExceptionUtils.createIllegalArgumentException(
@@ -208,28 +210,28 @@ public class ExtractImageScansController {
 
                 // Return the processed image as a response
                 byte[] imageBytes = processedImageBytes.get(0);
-                return WebResponseUtils.bytesToWebResponse(
-                        imageBytes,
-                        GeneralUtils.generateFilename(fileName, ".png"),
-                        MediaType.IMAGE_PNG);
+                finalOutput = tempFileManager.createManagedTempFile(".png");
+                try (OutputStream out = Files.newOutputStream(finalOutput.getPath())) {
+                    out.write(imageBytes);
+                }
+
+                ResponseEntity<StreamingResponseBody> response =
+                        WebResponseUtils.fileToWebResponse(
+                                finalOutput,
+                                GeneralUtils.generateFilename(fileName, ".png"),
+                                MediaType.IMAGE_PNG);
+                finalOutputOwnershipTransferred = true;
+                return response;
             }
         } finally {
+            if (finalOutput != null && !finalOutputOwnershipTransferred) {
+                finalOutput.close();
+            }
             // Cleanup logic for all temporary files and directories
-            tempImageFiles.forEach(
-                    path -> {
-                        try {
-                            Files.deleteIfExists(path);
-                        } catch (IOException e) {
-                            log.error("Failed to delete temporary image file: {}", path, e);
-                        }
-                    });
+            tempImageFiles.forEach(TempFile::close);
 
-            if (tempZipFile != null && Files.exists(tempZipFile)) {
-                try {
-                    Files.deleteIfExists(tempZipFile);
-                } catch (IOException e) {
-                    log.error("Failed to delete temporary zip file: {}", tempZipFile, e);
-                }
+            if (tempInputFile != null) {
+                tempInputFile.close();
             }
 
             tempDirs.forEach(
diff --git a/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/FlattenController.java b/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/FlattenController.java
index eecf1269f9..7eac5c2b83 100644
--- a/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/FlattenController.java
+++ b/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/FlattenController.java
@@ -15,6 +15,7 @@ import org.springframework.http.MediaType;
 import org.springframework.http.ResponseEntity;
 import org.springframework.web.bind.annotation.ModelAttribute;
 import org.springframework.web.multipart.MultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import io.github.pixee.security.Filenames;
 import io.swagger.v3.oas.annotations.Operation;
@@ -30,6 +31,7 @@ import stirling.software.common.model.ApplicationProperties;
 import stirling.software.common.service.CustomPDFDocumentFactory;
 import stirling.software.common.util.ApplicationContextProvider;
 import stirling.software.common.util.ExceptionUtils;
+import stirling.software.common.util.TempFileManager;
 import stirling.software.common.util.WebResponseUtils;
 
 @MiscApi
@@ -38,6 +40,7 @@ import stirling.software.common.util.WebResponseUtils;
 public class FlattenController {
 
     private final CustomPDFDocumentFactory pdfDocumentFactory;
+    private final TempFileManager tempFileManager;
 
     @AutoJobPostMapping(consumes = MediaType.MULTIPART_FORM_DATA_VALUE, value = "/flatten")
     @StandardPdfResponse
@@ -46,7 +49,8 @@ public class FlattenController {
             description =
                     "Flattening just PDF form fields or converting each page to images to make text"
                             + " unselectable. Input:PDF, Output:PDF. Type:SISO")
-    public ResponseEntity<byte[]> flatten(@ModelAttribute FlattenRequest request) throws Exception {
+    public ResponseEntity<StreamingResponseBody> flatten(@ModelAttribute FlattenRequest request)
+            throws Exception {
         MultipartFile file = request.getFileInput();
 
         try (PDDocument document = pdfDocumentFactory.load(file)) {
@@ -58,7 +62,9 @@ public class FlattenController {
                     acroForm.flatten();
                 }
                 return WebResponseUtils.pdfDocToWebResponse(
-                        document, Filenames.toSimpleFileName(file.getOriginalFilename()));
+                        document,
+                        Filenames.toSimpleFileName(file.getOriginalFilename()),
+                        tempFileManager);
             } else {
                 // flatten whole page aka convert each page to image and re-add it (making text
                 // unselectable)
@@ -143,7 +149,9 @@ public class FlattenController {
                         }
                     }
                     return WebResponseUtils.pdfDocToWebResponse(
-                            newDocument, Filenames.toSimpleFileName(file.getOriginalFilename()));
+                            newDocument,
+                            Filenames.toSimpleFileName(file.getOriginalFilename()),
+                            tempFileManager);
                 }
             }
         }
diff --git a/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/MetadataController.java b/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/MetadataController.java
index 1eb8f92681..9a7f7dcb24 100644
--- a/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/MetadataController.java
+++ b/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/MetadataController.java
@@ -13,6 +13,7 @@ import org.springframework.http.ResponseEntity;
 import org.springframework.web.bind.WebDataBinder;
 import org.springframework.web.bind.annotation.*;
 import org.springframework.web.multipart.MultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import io.github.pixee.security.Filenames;
 import io.swagger.v3.oas.annotations.Operation;
@@ -28,6 +29,7 @@ import stirling.software.common.service.CustomPDFDocumentFactory;
 import stirling.software.common.service.PdfMetadataService;
 import stirling.software.common.util.GeneralUtils;
 import stirling.software.common.util.RegexPatternUtils;
+import stirling.software.common.util.TempFileManager;
 import stirling.software.common.util.WebResponseUtils;
 import stirling.software.common.util.propertyeditor.StringToMapPropertyEditor;
 
@@ -37,6 +39,7 @@ import stirling.software.common.util.propertyeditor.StringToMapPropertyEditor;
 public class MetadataController {
 
     private final CustomPDFDocumentFactory pdfDocumentFactory;
+    private final TempFileManager tempFileManager;
 
     private String checkUndefined(String entry) {
         // Check if the string is "undefined"
@@ -61,7 +64,7 @@ public class MetadataController {
                     "This endpoint allows you to update the metadata of a given PDF file. You can"
                             + " add, modify, or delete standard and custom metadata fields. Input:PDF"
                             + " Output:PDF Type:SISO")
-    public ResponseEntity<byte[]> metadata(@ModelAttribute MetadataRequest request)
+    public ResponseEntity<StreamingResponseBody> metadata(@ModelAttribute MetadataRequest request)
             throws IOException {
 
         // Extract PDF file from the request object
@@ -179,7 +182,8 @@ public class MetadataController {
                     document,
                     GeneralUtils.removeExtension(
                                     Filenames.toSimpleFileName(pdfFile.getOriginalFilename()))
-                            + "_metadata.pdf");
+                            + "_metadata.pdf",
+                    tempFileManager);
         }
     }
 }
diff --git a/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/OCRController.java b/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/OCRController.java
index 22cf60dcbf..990f6dd982 100644
--- a/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/OCRController.java
+++ b/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/OCRController.java
@@ -25,6 +25,7 @@ import org.springframework.http.MediaType;
 import org.springframework.http.ResponseEntity;
 import org.springframework.web.bind.annotation.ModelAttribute;
 import org.springframework.web.multipart.MultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import io.github.pixee.security.Filenames;
 import io.swagger.v3.oas.annotations.Operation;
@@ -89,7 +90,7 @@ public class OCRController {
                             + " specify languages, sidecar, deskew, clean, cleanFinal, ocrType, ocrRenderType,"
                             + " and removeImagesAfter options. Uses OCRmyPDF if available, falls back to"
                             + " Tesseract. Input:PDF Output:PDF Type:SI-Conditional")
-    public ResponseEntity<byte[]> processPdfWithOCR(
+    public ResponseEntity<StreamingResponseBody> processPdfWithOCR(
             @ModelAttribute ProcessPdfWithOcrRequest request)
             throws IOException, InterruptedException {
         MultipartFile inputFile = request.getFileInput();
@@ -121,9 +122,11 @@ public class OCRController {
             throw ExceptionUtils.createOcrInvalidLanguagesException();
         }
 
-        // Use try-with-resources for proper temp file management
+        TempFile tempOutputFile = new TempFile(tempFileManager, ".pdf");
+        TempFile tempZipFile = null;
+        boolean pdfOwnershipTransferred = false;
+        boolean zipOwnershipTransferred = false;
         try (TempFile tempInputFile = new TempFile(tempFileManager, ".pdf");
-                TempFile tempOutputFile = new TempFile(tempFileManager, ".pdf");
                 TempFile sidecarTextFile = sidecar ? new TempFile(tempFileManager, ".txt") : null) {
 
             inputFile.transferTo(tempInputFile.getFile());
@@ -156,9 +159,6 @@ public class OCRController {
                 throw ExceptionUtils.createOcrToolsUnavailableException();
             }
 
-            // Read the processed PDF file
-            byte[] pdfBytes = Files.readAllBytes(tempOutputFile.getPath());
-
             // Return the OCR processed PDF as a response
             String outputFilename =
                     GeneralUtils.removeExtension(
@@ -172,14 +172,14 @@ public class OCRController {
                                         Filenames.toSimpleFileName(inputFile.getOriginalFilename()))
                                 + "_OCR.zip";
 
-                try (TempFile tempZipFile = new TempFile(tempFileManager, ".zip");
-                        ZipOutputStream zipOut =
-                                new ZipOutputStream(Files.newOutputStream(tempZipFile.getPath()))) {
+                tempZipFile = new TempFile(tempFileManager, ".zip");
+                try (ZipOutputStream zipOut =
+                        new ZipOutputStream(Files.newOutputStream(tempZipFile.getPath()))) {
 
                     // Add PDF file to the zip
                     ZipEntry pdfEntry = new ZipEntry(outputFilename);
                     zipOut.putNextEntry(pdfEntry);
-                    zipOut.write(pdfBytes);
+                    Files.copy(tempOutputFile.getPath(), zipOut);
                     zipOut.closeEntry();
 
                     // Add text file to the zip
@@ -189,16 +189,28 @@ public class OCRController {
                     zipOut.closeEntry();
 
                     zipOut.finish();
-
-                    byte[] zipBytes = Files.readAllBytes(tempZipFile.getPath());
-
-                    // Return the zip file containing both the PDF and the text file
-                    return WebResponseUtils.bytesToWebResponse(
-                            zipBytes, outputZipFilename, MediaType.APPLICATION_OCTET_STREAM);
                 }
+
+                // The intermediate PDF temp file is no longer needed; only the zip is streamed.
+                tempOutputFile.close();
+                pdfOwnershipTransferred = true;
+                ResponseEntity<StreamingResponseBody> response =
+                        WebResponseUtils.fileToWebResponse(
+                                tempZipFile, outputZipFilename, MediaType.APPLICATION_OCTET_STREAM);
+                zipOwnershipTransferred = true;
+                return response;
             } else {
-                // Return the OCR processed PDF as a response
-                return WebResponseUtils.bytesToWebResponse(pdfBytes, outputFilename);
+                ResponseEntity<StreamingResponseBody> response =
+                        WebResponseUtils.pdfFileToWebResponse(tempOutputFile, outputFilename);
+                pdfOwnershipTransferred = true;
+                return response;
+            }
+        } finally {
+            if (!pdfOwnershipTransferred) {
+                tempOutputFile.close();
+            }
+            if (tempZipFile != null && !zipOwnershipTransferred) {
+                tempZipFile.close();
             }
         }
     }
diff --git a/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/OverlayImageController.java b/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/OverlayImageController.java
index 3b893c17ab..f7e36340c7 100644
--- a/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/OverlayImageController.java
+++ b/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/OverlayImageController.java
@@ -1,6 +1,5 @@
 package stirling.software.SPDF.controller.api.misc;
 
-import java.io.ByteArrayOutputStream;
 import java.io.IOException;
 
 import org.apache.pdfbox.pdmodel.PDDocument;
@@ -12,6 +11,7 @@ import org.springframework.http.MediaType;
 import org.springframework.http.ResponseEntity;
 import org.springframework.web.bind.annotation.ModelAttribute;
 import org.springframework.web.multipart.MultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import io.swagger.v3.oas.annotations.Operation;
 
@@ -24,6 +24,8 @@ import stirling.software.common.annotations.AutoJobPostMapping;
 import stirling.software.common.annotations.api.MiscApi;
 import stirling.software.common.service.CustomPDFDocumentFactory;
 import stirling.software.common.util.GeneralUtils;
+import stirling.software.common.util.TempFile;
+import stirling.software.common.util.TempFileManager;
 import stirling.software.common.util.WebResponseUtils;
 
 @MiscApi
@@ -32,6 +34,7 @@ import stirling.software.common.util.WebResponseUtils;
 public class OverlayImageController {
 
     private final CustomPDFDocumentFactory pdfDocumentFactory;
+    private final TempFileManager tempFileManager;
 
     @AutoJobPostMapping(consumes = MediaType.MULTIPART_FORM_DATA_VALUE, value = "/add-image")
     @Operation(
@@ -42,7 +45,8 @@ public class OverlayImageController {
                             + "SVG files are rendered as vector graphics for crisp output at any resolution. "
                             + "The image can be overlaid on every page of the PDF if specified. "
                             + "Input:PDF/IMAGE/SVG Output:PDF Type:SISO")
-    public ResponseEntity<byte[]> overlayImage(@ModelAttribute OverlayImageRequest request) {
+    public ResponseEntity<StreamingResponseBody> overlayImage(
+            @ModelAttribute OverlayImageRequest request) {
         MultipartFile pdfFile = request.getFileInput();
         MultipartFile imageFile = request.getImageFile();
         float x = request.getX();
@@ -82,14 +86,17 @@ public class OverlayImageController {
                     }
                 }
 
-                ByteArrayOutputStream baos = new ByteArrayOutputStream();
-                document.save(baos);
-
-                byte[] result = baos.toByteArray();
+                TempFile tempOut = tempFileManager.createManagedTempFile(".pdf");
+                try {
+                    document.save(tempOut.getFile());
+                } catch (IOException e) {
+                    tempOut.close();
+                    throw e;
+                }
                 log.info("PDF with overlaid image successfully created");
 
-                return WebResponseUtils.bytesToWebResponse(
-                        result,
+                return WebResponseUtils.pdfFileToWebResponse(
+                        tempOut,
                         GeneralUtils.generateFilename(
                                 pdfFile.getOriginalFilename(), "_overlayed.pdf"));
             }
diff --git a/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/PageNumbersController.java b/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/PageNumbersController.java
index 6d0d05a28d..4e12a694a3 100644
--- a/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/PageNumbersController.java
+++ b/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/PageNumbersController.java
@@ -1,7 +1,6 @@
 package stirling.software.SPDF.controller.api.misc;
 
 import java.awt.Color;
-import java.io.ByteArrayOutputStream;
 import java.io.IOException;
 import java.util.List;
 import java.util.Locale;
@@ -16,6 +15,7 @@ import org.springframework.http.MediaType;
 import org.springframework.http.ResponseEntity;
 import org.springframework.web.bind.annotation.ModelAttribute;
 import org.springframework.web.multipart.MultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import io.github.pixee.security.Filenames;
 import io.swagger.v3.oas.annotations.Operation;
@@ -28,6 +28,8 @@ import stirling.software.common.annotations.AutoJobPostMapping;
 import stirling.software.common.annotations.api.MiscApi;
 import stirling.software.common.service.CustomPDFDocumentFactory;
 import stirling.software.common.util.GeneralUtils;
+import stirling.software.common.util.TempFile;
+import stirling.software.common.util.TempFileManager;
 import stirling.software.common.util.WebResponseUtils;
 
 @MiscApi
@@ -35,6 +37,7 @@ import stirling.software.common.util.WebResponseUtils;
 public class PageNumbersController {
 
     private final CustomPDFDocumentFactory pdfDocumentFactory;
+    private final TempFileManager tempFileManager;
 
     @AutoJobPostMapping(value = "/add-page-numbers", consumes = MediaType.MULTIPART_FORM_DATA_VALUE)
     @StandardPdfResponse
@@ -43,8 +46,8 @@ public class PageNumbersController {
             description =
                     "This operation takes an input PDF file and adds page numbers to it. Input:PDF"
                             + " Output:PDF Type:SISO")
-    public ResponseEntity<byte[]> addPageNumbers(@ModelAttribute AddPageNumbersRequest request)
-            throws IOException {
+    public ResponseEntity<StreamingResponseBody> addPageNumbers(
+            @ModelAttribute AddPageNumbersRequest request) throws IOException {
 
         MultipartFile file = request.getFileInput();
         String customMargin = request.getCustomMargin();
@@ -175,11 +178,16 @@ public class PageNumbersController {
                 pageNumber++;
             }
 
-            ByteArrayOutputStream baos = new ByteArrayOutputStream();
-            document.save(baos);
+            TempFile tempOut = tempFileManager.createManagedTempFile(".pdf");
+            try {
+                document.save(tempOut.getFile());
+            } catch (IOException e) {
+                tempOut.close();
+                throw e;
+            }
 
-            return WebResponseUtils.bytesToWebResponse(
-                    baos.toByteArray(),
+            return WebResponseUtils.pdfFileToWebResponse(
+                    tempOut,
                     GeneralUtils.generateFilename(
                             file.getOriginalFilename(), "_page_numbers_added.pdf"));
         }
diff --git a/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/RemoveImagesController.java b/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/RemoveImagesController.java
index 53871f973b..33fcea588b 100644
--- a/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/RemoveImagesController.java
+++ b/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/RemoveImagesController.java
@@ -1,6 +1,5 @@
 package stirling.software.SPDF.controller.api.misc;
 
-import java.io.ByteArrayOutputStream;
 import java.io.IOException;
 import java.util.ArrayList;
 import java.util.List;
@@ -17,6 +16,7 @@ import org.springframework.http.MediaType;
 import org.springframework.http.ResponseEntity;
 import org.springframework.web.bind.annotation.ModelAttribute;
 import org.springframework.web.multipart.MultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import io.swagger.v3.oas.annotations.Operation;
 
@@ -29,6 +29,8 @@ import stirling.software.common.model.api.PDFFile;
 import stirling.software.common.service.CustomPDFDocumentFactory;
 import stirling.software.common.util.ExceptionUtils;
 import stirling.software.common.util.GeneralUtils;
+import stirling.software.common.util.TempFile;
+import stirling.software.common.util.TempFileManager;
 import stirling.software.common.util.WebResponseUtils;
 
 @GeneralApi
@@ -37,6 +39,7 @@ import stirling.software.common.util.WebResponseUtils;
 public class RemoveImagesController {
 
     private final CustomPDFDocumentFactory pdfDocumentFactory;
+    private final TempFileManager tempFileManager;
 
     @AutoJobPostMapping(consumes = MediaType.MULTIPART_FORM_DATA_VALUE, value = "/remove-image-pdf")
     @Operation(
@@ -44,7 +47,8 @@ public class RemoveImagesController {
             description =
                     "This endpoint removes all embedded images from a PDF file and returns the"
                             + " modified document. Input:PDF Output:PDF Type:SISO")
-    public ResponseEntity<byte[]> removeImages(@ModelAttribute PDFFile request) throws IOException {
+    public ResponseEntity<StreamingResponseBody> removeImages(@ModelAttribute PDFFile request)
+            throws IOException {
 
         MultipartFile inputFile = request.getFileInput();
 
@@ -60,12 +64,16 @@ public class RemoveImagesController {
 
             log.info("Removed {} images from PDF with {} pages", imagesRemoved, totalPages);
 
-            ByteArrayOutputStream baos = new ByteArrayOutputStream();
-            pdfDoc.save(baos);
-            byte[] pdfContent = baos.toByteArray();
+            TempFile tempOut = tempFileManager.createManagedTempFile(".pdf");
+            try {
+                pdfDoc.save(tempOut.getFile());
+            } catch (IOException e) {
+                tempOut.close();
+                throw e;
+            }
 
-            return WebResponseUtils.bytesToWebResponse(
-                    pdfContent,
+            return WebResponseUtils.pdfFileToWebResponse(
+                    tempOut,
                     GeneralUtils.generateFilename(
                             inputFile.getOriginalFilename(), "_images_removed.pdf"));
 
diff --git a/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/RepairController.java b/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/RepairController.java
index 8eaf3a892b..b0dc0a03a5 100644
--- a/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/RepairController.java
+++ b/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/RepairController.java
@@ -8,6 +8,7 @@ import org.springframework.http.MediaType;
 import org.springframework.http.ResponseEntity;
 import org.springframework.web.bind.annotation.ModelAttribute;
 import org.springframework.web.multipart.MultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import io.swagger.v3.oas.annotations.Operation;
 
@@ -53,13 +54,12 @@ public class RepairController {
                     "This endpoint repairs a given PDF file by running Ghostscript (primary), qpdf (fallback), or PDFBox (if no external tools available). The PDF is"
                             + " first saved to a temporary location, repaired, read back, and then"
                             + " returned as a response. Input:PDF Output:PDF Type:SISO")
-    public ResponseEntity<byte[]> repairPdf(@ModelAttribute PDFFile file)
+    public ResponseEntity<StreamingResponseBody> repairPdf(@ModelAttribute PDFFile file)
             throws IOException, InterruptedException {
         MultipartFile inputFile = file.getFileInput();
 
-        // Use TempFile with try-with-resources for automatic cleanup
-        try (TempFile tempInputFile = new TempFile(tempFileManager, ".pdf");
-                TempFile tempOutputFile = new TempFile(tempFileManager, ".pdf")) {
+        TempFile tempOutputFile = new TempFile(tempFileManager, ".pdf");
+        try (TempFile tempInputFile = new TempFile(tempFileManager, ".pdf")) {
 
             // Save the uploaded file to the temporary location
             inputFile.transferTo(tempInputFile.getFile());
@@ -121,14 +121,17 @@ public class RepairController {
                 }
             }
 
-            // Read the repaired PDF file
-            byte[] pdfBytes = pdfDocumentFactory.loadToBytes(tempOutputFile.getFile());
-
-            // Return the repaired PDF as a response
-            return WebResponseUtils.bytesToWebResponse(
-                    pdfBytes,
+            // Return the repaired PDF as a streaming response
+            return WebResponseUtils.pdfFileToWebResponse(
+                    tempOutputFile,
                     GeneralUtils.generateFilename(
                             inputFile.getOriginalFilename(), "_repaired.pdf"));
+        } catch (IOException | InterruptedException e) {
+            tempOutputFile.close();
+            throw e;
+        } catch (RuntimeException e) {
+            tempOutputFile.close();
+            throw e;
         }
     }
 }
diff --git a/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/ReplaceAndInvertColorController.java b/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/ReplaceAndInvertColorController.java
index 72820acb97..defee45756 100644
--- a/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/ReplaceAndInvertColorController.java
+++ b/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/ReplaceAndInvertColorController.java
@@ -1,11 +1,15 @@
 package stirling.software.SPDF.controller.api.misc;
 
 import java.io.IOException;
+import java.io.InputStream;
+import java.nio.file.Files;
+import java.nio.file.StandardCopyOption;
 
 import org.springframework.core.io.InputStreamResource;
 import org.springframework.http.MediaType;
 import org.springframework.http.ResponseEntity;
 import org.springframework.web.bind.annotation.ModelAttribute;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import io.swagger.v3.oas.annotations.Operation;
 
@@ -16,6 +20,8 @@ import stirling.software.SPDF.service.misc.ReplaceAndInvertColorService;
 import stirling.software.common.annotations.AutoJobPostMapping;
 import stirling.software.common.annotations.api.MiscApi;
 import stirling.software.common.util.GeneralUtils;
+import stirling.software.common.util.TempFile;
+import stirling.software.common.util.TempFileManager;
 import stirling.software.common.util.WebResponseUtils;
 
 @MiscApi
@@ -23,6 +29,7 @@ import stirling.software.common.util.WebResponseUtils;
 public class ReplaceAndInvertColorController {
 
     private final ReplaceAndInvertColorService replaceAndInvertColorService;
+    private final TempFileManager tempFileManager;
 
     @AutoJobPostMapping(
             consumes = MediaType.MULTIPART_FORM_DATA_VALUE,
@@ -32,7 +39,7 @@ public class ReplaceAndInvertColorController {
             description =
                     "This endpoint accepts a PDF file and provides options to invert all colors, replace"
                             + " text and background colors, or convert to CMYK color space for printing. Input:PDF Output:PDF Type:SISO")
-    public ResponseEntity<byte[]> replaceAndInvertColor(
+    public ResponseEntity<StreamingResponseBody> replaceAndInvertColor(
             @ModelAttribute ReplaceAndInvertColorRequest request) throws IOException {
 
         InputStreamResource resource =
@@ -47,7 +54,15 @@ public class ReplaceAndInvertColorController {
         String filename =
                 GeneralUtils.generateFilename(
                         request.getFileInput().getOriginalFilename(), "_inverted.pdf");
-        return WebResponseUtils.bytesToWebResponse(
-                resource.getContentAsByteArray(), filename, MediaType.APPLICATION_PDF);
+
+        TempFile tempOut = tempFileManager.createManagedTempFile(".pdf");
+        try (InputStream in = resource.getInputStream()) {
+            Files.copy(in, tempOut.getFile().toPath(), StandardCopyOption.REPLACE_EXISTING);
+        } catch (IOException e) {
+            tempOut.close();
+            throw e;
+        }
+
+        return WebResponseUtils.pdfFileToWebResponse(tempOut, filename);
     }
 }
diff --git a/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/ScannerEffectController.java b/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/ScannerEffectController.java
index e581eb8952..8318960ff9 100644
--- a/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/ScannerEffectController.java
+++ b/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/ScannerEffectController.java
@@ -6,7 +6,6 @@ import java.awt.RenderingHints;
 import java.awt.geom.AffineTransform;
 import java.awt.image.BufferedImage;
 import java.awt.image.DataBufferInt;
-import java.io.ByteArrayOutputStream;
 import java.io.IOException;
 import java.io.UncheckedIOException;
 import java.nio.file.Files;
@@ -35,6 +34,7 @@ import org.springframework.http.MediaType;
 import org.springframework.http.ResponseEntity;
 import org.springframework.web.bind.annotation.ModelAttribute;
 import org.springframework.web.multipart.MultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import io.swagger.v3.oas.annotations.Operation;
 
@@ -51,6 +51,7 @@ import stirling.software.common.service.CustomPDFDocumentFactory;
 import stirling.software.common.util.ApplicationContextProvider;
 import stirling.software.common.util.ExceptionUtils;
 import stirling.software.common.util.GeneralUtils;
+import stirling.software.common.util.TempFileManager;
 import stirling.software.common.util.WebResponseUtils;
 
 @MiscApi
@@ -59,6 +60,7 @@ import stirling.software.common.util.WebResponseUtils;
 public class ScannerEffectController {
 
     private final CustomPDFDocumentFactory pdfDocumentFactory;
+    private final TempFileManager tempFileManager;
     private static final int MAX_IMAGE_WIDTH = 8192;
     private static final int MAX_IMAGE_HEIGHT = 8192;
     private static final long MAX_IMAGE_PIXELS = 16_777_216; // 4096x4096
@@ -562,8 +564,8 @@ public class ScannerEffectController {
             summary = "Apply scanner effect to PDF",
             description =
                     "Applies various effects to simulate a scanned document, including rotation, noise, and edge softening. Input:PDF Output:PDF Type:SISO")
-    public ResponseEntity<byte[]> scannerEffect(@Valid @ModelAttribute ScannerEffectRequest request)
-            throws IOException {
+    public ResponseEntity<StreamingResponseBody> scannerEffect(
+            @Valid @ModelAttribute ScannerEffectRequest request) throws IOException {
         MultipartFile file = request.getFileInput();
 
         List<Path> tempFiles = new ArrayList<>();
@@ -624,8 +626,7 @@ public class ScannerEffectController {
                             sharedPdfBytes != null
                                     ? pdfDocumentFactory.load(sharedPdfBytes)
                                     : pdfDocumentFactory.load(processingInput);
-                    PDDocument outputDocument = new PDDocument();
-                    ByteArrayOutputStream outputStream = new ByteArrayOutputStream()) {
+                    PDDocument outputDocument = new PDDocument()) {
 
                 int totalPages = document.getNumberOfPages();
                 if (totalPages == 0) {
@@ -708,12 +709,11 @@ public class ScannerEffectController {
 
                     writeProcessedPagesToDocument(processedPages, outputDocument);
 
-                    outputDocument.save(outputStream);
-
-                    return WebResponseUtils.bytesToWebResponse(
-                            outputStream.toByteArray(),
+                    return WebResponseUtils.pdfDocToWebResponse(
+                            outputDocument,
                             GeneralUtils.generateFilename(
-                                    file.getOriginalFilename(), "_scanner_effect.pdf"));
+                                    file.getOriginalFilename(), "_scanner_effect.pdf"),
+                            tempFileManager);
                 }
             }
         } finally {
diff --git a/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/ShowJavascript.java b/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/ShowJavascript.java
index 29dc983507..0d7dc1d1d2 100644
--- a/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/ShowJavascript.java
+++ b/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/ShowJavascript.java
@@ -1,6 +1,7 @@
 package stirling.software.SPDF.controller.api.misc;
 
 import java.nio.charset.StandardCharsets;
+import java.nio.file.Files;
 import java.util.Map;
 
 import org.apache.pdfbox.pdmodel.PDDocument;
@@ -10,6 +11,7 @@ import org.springframework.http.MediaType;
 import org.springframework.http.ResponseEntity;
 import org.springframework.web.bind.annotation.ModelAttribute;
 import org.springframework.web.multipart.MultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import io.github.pixee.security.Filenames;
 import io.swagger.v3.oas.annotations.Operation;
@@ -21,6 +23,8 @@ import stirling.software.common.annotations.AutoJobPostMapping;
 import stirling.software.common.annotations.api.MiscApi;
 import stirling.software.common.model.api.PDFFile;
 import stirling.software.common.service.CustomPDFDocumentFactory;
+import stirling.software.common.util.TempFile;
+import stirling.software.common.util.TempFileManager;
 import stirling.software.common.util.WebResponseUtils;
 
 @MiscApi
@@ -28,13 +32,15 @@ import stirling.software.common.util.WebResponseUtils;
 public class ShowJavascript {
 
     private final CustomPDFDocumentFactory pdfDocumentFactory;
+    private final TempFileManager tempFileManager;
 
     @AutoJobPostMapping(consumes = MediaType.MULTIPART_FORM_DATA_VALUE, value = "/show-javascript")
     @JavaScriptResponse
     @Operation(
             summary = "Grabs all JS from a PDF and returns a single JS file with all code",
             description = "desc. Input:PDF Output:JS Type:SISO")
-    public ResponseEntity<byte[]> extractHeader(@ModelAttribute PDFFile file) throws Exception {
+    public ResponseEntity<StreamingResponseBody> extractHeader(@ModelAttribute PDFFile file)
+            throws Exception {
         MultipartFile inputFile = file.getFileInput();
         StringBuilder script = new StringBuilder();
         boolean foundScript = false;
@@ -77,8 +83,17 @@ public class ShowJavascript {
                                 .append("' does not contain Javascript");
             }
 
-            return WebResponseUtils.bytesToWebResponse(
-                    script.toString().getBytes(StandardCharsets.UTF_8),
+            TempFile tempOut = tempFileManager.createManagedTempFile(".js");
+            try {
+                Files.write(
+                        tempOut.getFile().toPath(),
+                        script.toString().getBytes(StandardCharsets.UTF_8));
+            } catch (Exception e) {
+                tempOut.close();
+                throw e;
+            }
+            return WebResponseUtils.fileToWebResponse(
+                    tempOut,
                     Filenames.toSimpleFileName(inputFile.getOriginalFilename()) + ".js",
                     MediaType.TEXT_PLAIN);
         }
diff --git a/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/StampController.java b/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/StampController.java
index 78f381fa7f..0e6fc1d004 100644
--- a/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/StampController.java
+++ b/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/StampController.java
@@ -37,6 +37,7 @@ import org.springframework.web.bind.WebDataBinder;
 import org.springframework.web.bind.annotation.InitBinder;
 import org.springframework.web.bind.annotation.ModelAttribute;
 import org.springframework.web.multipart.MultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import io.swagger.v3.oas.annotations.Operation;
 
@@ -92,7 +93,7 @@ public class StampController {
                     "This endpoint adds a stamp to a given PDF file. Users can specify the stamp"
                             + " type (text or image), rotation, opacity, width spacer, and height"
                             + " spacer. Input:PDF Output:PDF Type:SISO")
-    public ResponseEntity<byte[]> addStamp(@ModelAttribute AddStampRequest request)
+    public ResponseEntity<StreamingResponseBody> addStamp(@ModelAttribute AddStampRequest request)
             throws IOException, Exception {
         MultipartFile pdfFile = request.getFileInput();
         String pdfFileName = pdfFile.getOriginalFilename();
@@ -199,7 +200,8 @@ public class StampController {
             // Return the stamped PDF as a response
             return WebResponseUtils.pdfDocToWebResponse(
                     document,
-                    GeneralUtils.generateFilename(pdfFile.getOriginalFilename(), "_stamped.pdf"));
+                    GeneralUtils.generateFilename(pdfFile.getOriginalFilename(), "_stamped.pdf"),
+                    tempFileManager);
         }
     }
 
@@ -483,9 +485,19 @@ public class StampController {
             y = overrideY;
         } else {
             x = calculatePositionX(pageSize, position, desiredPhysicalWidth, margin);
-            y = calculatePositionY(pageSize, position, desiredPhysicalHeight, margin);
+            // drawImage() places the lower-left corner at (x, y); use image-specific Y logic
+            y = calculateImagePositionY(pageSize, position, desiredPhysicalHeight, margin);
         }
 
+        float llx = pageSize.getLowerLeftX();
+        float lly = pageSize.getLowerLeftY();
+        float urx = pageSize.getUpperRightX();
+        float ury = pageSize.getUpperRightY();
+        float xMax = Math.max(llx, urx - desiredPhysicalWidth);
+        float yMax = Math.max(lly, ury - desiredPhysicalHeight);
+        x = Math.min(xMax, Math.max(llx, x));
+        y = Math.min(yMax, Math.max(lly, y));
+
         contentStream.saveGraphicsState();
         contentStream.transform(Matrix.getTranslateInstance(x, y));
         contentStream.transform(Matrix.getRotateInstance(Math.toRadians(rotation), 0, 0));
@@ -495,18 +507,37 @@ public class StampController {
 
     private float calculatePositionX(
             PDRectangle pageSize, int position, float contentWidth, float margin) {
+        float llx = pageSize.getLowerLeftX();
+        float urx = pageSize.getUpperRightX();
         return switch (position % 3) {
             case 1: // Left
-                yield pageSize.getLowerLeftX() + margin;
+                yield llx + margin;
             case 2: // Center
-                yield (pageSize.getWidth() - contentWidth) / 2;
+                yield llx + (pageSize.getWidth() - contentWidth) / 2;
             case 0: // Right
-                yield pageSize.getUpperRightX() - contentWidth - margin;
+                yield urx - contentWidth - margin;
             default:
                 yield 0;
         };
     }
 
+    private float calculateImagePositionY(
+            PDRectangle pageSize, int position, float imageHeight, float margin) {
+        float lly = pageSize.getLowerLeftY();
+        float pageHeight = pageSize.getHeight();
+        float ury = pageSize.getUpperRightY();
+        return switch ((position - 1) / 3) {
+            case 0: // Top - upper image edge flush below top margin
+                yield ury - margin - imageHeight;
+            case 1: // Middle - center image on page
+                yield lly + (pageHeight - imageHeight) / 2;
+            case 2: // Bottom - lower image edge at bottom margin
+                yield lly + margin;
+            default:
+                yield lly;
+        };
+    }
+
     private float calculatePositionY(
             PDRectangle pageSize, int position, float height, float margin) {
         return switch ((position - 1) / 3) {
diff --git a/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/UnlockPDFFormsController.java b/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/UnlockPDFFormsController.java
index faa98a7ea8..22117b5f35 100644
--- a/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/UnlockPDFFormsController.java
+++ b/app/core/src/main/java/stirling/software/SPDF/controller/api/misc/UnlockPDFFormsController.java
@@ -13,6 +13,7 @@ import org.apache.pdfbox.pdmodel.interactive.form.PDField;
 import org.springframework.http.MediaType;
 import org.springframework.http.ResponseEntity;
 import org.springframework.web.bind.annotation.ModelAttribute;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import io.github.pixee.security.Filenames;
 import io.swagger.v3.oas.annotations.Operation;
@@ -26,15 +27,19 @@ import stirling.software.common.model.api.PDFFile;
 import stirling.software.common.service.CustomPDFDocumentFactory;
 import stirling.software.common.util.GeneralUtils;
 import stirling.software.common.util.RegexPatternUtils;
+import stirling.software.common.util.TempFileManager;
 import stirling.software.common.util.WebResponseUtils;
 
 @MiscApi
 @Slf4j
 public class UnlockPDFFormsController {
     private final CustomPDFDocumentFactory pdfDocumentFactory;
+    private final TempFileManager tempFileManager;
 
-    public UnlockPDFFormsController(CustomPDFDocumentFactory pdfDocumentFactory) {
+    public UnlockPDFFormsController(
+            CustomPDFDocumentFactory pdfDocumentFactory, TempFileManager tempFileManager) {
         this.pdfDocumentFactory = pdfDocumentFactory;
+        this.tempFileManager = tempFileManager;
     }
 
     @AutoJobPostMapping(consumes = MediaType.MULTIPART_FORM_DATA_VALUE, value = "/unlock-pdf-forms")
@@ -44,7 +49,7 @@ public class UnlockPDFFormsController {
             description =
                     "Removing read-only property from form fields making them fillable"
                             + "Input:PDF, Output:PDF. Type:SISO")
-    public ResponseEntity<byte[]> unlockPDFForms(@ModelAttribute PDFFile file) {
+    public ResponseEntity<StreamingResponseBody> unlockPDFForms(@ModelAttribute PDFFile file) {
         try (PDDocument document = pdfDocumentFactory.load(file)) {
             PDAcroForm acroForm = document.getDocumentCatalog().getAcroForm();
 
@@ -116,7 +121,7 @@ public class UnlockPDFFormsController {
                     GeneralUtils.generateFilename(
                             file.getFileInput().getOriginalFilename(), "_unlocked_forms.pdf");
             return WebResponseUtils.pdfDocToWebResponse(
-                    document, Filenames.toSimpleFileName(mergedFileName));
+                    document, Filenames.toSimpleFileName(mergedFileName), tempFileManager);
         } catch (Exception e) {
             log.error(e.getMessage(), e);
         }
diff --git a/app/core/src/main/java/stirling/software/SPDF/controller/api/pipeline/PipelineProcessor.java b/app/core/src/main/java/stirling/software/SPDF/controller/api/pipeline/PipelineProcessor.java
index 1eac93b227..fde2cfa900 100644
--- a/app/core/src/main/java/stirling/software/SPDF/controller/api/pipeline/PipelineProcessor.java
+++ b/app/core/src/main/java/stirling/software/SPDF/controller/api/pipeline/PipelineProcessor.java
@@ -11,36 +11,26 @@ import java.util.List;
 import java.util.Locale;
 import java.util.Map;
 import java.util.Map.Entry;
-import java.util.zip.ZipEntry;
-import java.util.zip.ZipInputStream;
 
-import org.springframework.beans.factory.annotation.Autowired;
 import org.springframework.core.io.FileSystemResource;
 import org.springframework.core.io.Resource;
 import org.springframework.http.*;
 import org.springframework.stereotype.Service;
 import org.springframework.util.LinkedMultiValueMap;
 import org.springframework.util.MultiValueMap;
-import org.springframework.web.client.RequestCallback;
-import org.springframework.web.client.RestTemplate;
 import org.springframework.web.multipart.MultipartFile;
 
 import io.github.pixee.security.Filenames;
-import io.github.pixee.security.ZipSecurity;
-
-import jakarta.servlet.ServletContext;
 
 import lombok.extern.slf4j.Slf4j;
 
-import stirling.software.SPDF.SPDFApplication;
 import stirling.software.SPDF.model.PipelineConfig;
 import stirling.software.SPDF.model.PipelineOperation;
 import stirling.software.SPDF.model.PipelineResult;
 import stirling.software.SPDF.service.ApiDocService;
-import stirling.software.common.model.enumeration.Role;
-import stirling.software.common.service.UserServiceInterface;
-import stirling.software.common.util.TempFile;
+import stirling.software.common.service.InternalApiClient;
 import stirling.software.common.util.TempFileManager;
+import stirling.software.common.util.ZipExtractionUtils;
 
 @Service
 @Slf4j
@@ -48,20 +38,16 @@ public class PipelineProcessor {
 
     private final ApiDocService apiDocService;
 
-    private final UserServiceInterface userService;
-
-    private final ServletContext servletContext;
+    private final InternalApiClient internalApiClient;
 
     private final TempFileManager tempFileManager;
 
     public PipelineProcessor(
             ApiDocService apiDocService,
-            @Autowired(required = false) UserServiceInterface userService,
-            ServletContext servletContext,
+            InternalApiClient internalApiClient,
             TempFileManager tempFileManager) {
         this.apiDocService = apiDocService;
-        this.userService = userService;
-        this.servletContext = servletContext;
+        this.internalApiClient = internalApiClient;
         this.tempFileManager = tempFileManager;
     }
 
@@ -84,17 +70,6 @@ public class PipelineProcessor {
         return name.substring(0, underscoreIndex) + extension;
     }
 
-    private String getApiKeyForUser() {
-        if (userService == null) return "";
-        return userService.getApiKeyForUser(Role.INTERNAL_API_USER.getRoleId());
-    }
-
-    private String getBaseUrl() {
-        String contextPath = servletContext.getContextPath();
-        String port = SPDFApplication.getStaticPort();
-        return "http://localhost:" + port + contextPath + "/";
-    }
-
     PipelineResult runPipelineAgainstFiles(List<Resource> outputFiles, PipelineConfig config)
             throws Exception {
         PipelineResult result = new PipelineResult();
@@ -122,7 +97,6 @@ public class PipelineProcessor {
                         "Invalid operation: " + operation + " with parameters: " + parameters);
             }
 
-            String url = getBaseUrl() + operation;
             List<Resource> newOutputFiles = new ArrayList<>();
             if (!isMultiInputOperation) {
                 for (Resource file : outputFiles) {
@@ -144,12 +118,15 @@ public class PipelineProcessor {
                                     body.add(entry.getKey(), entry.getValue());
                                 }
                             }
-                            ResponseEntity<Resource> response = sendWebRequest(url, body);
+                            ResponseEntity<Resource> response =
+                                    internalApiClient.post(operation, body);
                             // If the operation is filter and the response body is null or empty,
                             // skip
                             // this
                             // file
-                            if (response.getBody() instanceof TempFileResource tempFileResource) {
+                            if (response.getBody()
+                                    instanceof
+                                    InternalApiClient.TempFileResource tempFileResource) {
                                 result.addTempFile(tempFileResource.getTempFile());
                             }
 
@@ -226,8 +203,9 @@ public class PipelineProcessor {
                             body.add(entry.getKey(), entry.getValue());
                         }
                     }
-                    ResponseEntity<Resource> response = sendWebRequest(url, body);
-                    if (response.getBody() instanceof TempFileResource tempFileResource) {
+                    ResponseEntity<Resource> response = internalApiClient.post(operation, body);
+                    if (response.getBody()
+                            instanceof InternalApiClient.TempFileResource tempFileResource) {
                         result.addTempFile(tempFileResource.getTempFile());
                     }
                     // Handle the response
@@ -281,42 +259,6 @@ public class PipelineProcessor {
         return result;
     }
 
-    /* package */ ResponseEntity<Resource> sendWebRequest(
-            String url, MultiValueMap<String, Object> body) {
-        RestTemplate restTemplate = new RestTemplate();
-        // Set up headers, including API key
-        HttpHeaders headers = new HttpHeaders();
-        String apiKey = getApiKeyForUser();
-        if (apiKey != null && !apiKey.isEmpty()) {
-            headers.add("X-API-KEY", apiKey);
-        }
-
-        // Let the message converter set the multipart boundary/content type
-        HttpEntity<MultiValueMap<String, Object>> entity = new HttpEntity<>(body, headers);
-
-        RequestCallback requestCallback =
-                restTemplate.httpEntityCallback(entity, Resource.class /* response type hint */);
-        return restTemplate.execute(
-                url,
-                HttpMethod.POST,
-                requestCallback,
-                response -> {
-                    try {
-                        TempFile tempFile = tempFileManager.createManagedTempFile("pipeline");
-                        Files.copy(
-                                response.getBody(),
-                                tempFile.getPath(),
-                                java.nio.file.StandardCopyOption.REPLACE_EXISTING);
-                        TempFileResource resource = new TempFileResource(tempFile);
-                        return ResponseEntity.status(response.getStatusCode())
-                                .headers(response.getHeaders())
-                                .body(resource);
-                    } catch (IOException e) {
-                        throw new UncheckedIOException(e);
-                    }
-                });
-    }
-
     private List<Resource> processOutputFiles(
             String operation,
             ResponseEntity<Resource> response,
@@ -335,13 +277,15 @@ public class PipelineProcessor {
             newFilename = removeTrailingNaming(extractFilename(response));
         }
         // Check if the response body is a zip file
-        if (isZip(response.getBody(), newFilename)) {
+        if (ZipExtractionUtils.isZip(response.getBody(), newFilename)) {
             // Unzip the file and add all the files to the new output files
-            newOutputFiles.addAll(unzip(response.getBody(), result));
+            newOutputFiles.addAll(
+                    ZipExtractionUtils.extractZip(
+                            response.getBody(), tempFileManager, result::addTempFile));
         } else {
             final Resource tempResource = response.getBody();
-            if (tempResource instanceof TempFileResource) {
-                result.addTempFile(((TempFileResource) tempResource).getTempFile());
+            if (tempResource instanceof InternalApiClient.TempFileResource tfr) {
+                result.addTempFile(tfr.getTempFile());
             }
             Resource outputResource =
                     new FileSystemResource(tempResource.getFile()) {
@@ -424,97 +368,4 @@ public class PipelineProcessor {
         log.info("Files successfully loaded. Starting processing...");
         return outputFiles;
     }
-
-    private boolean isZip(Resource data, String filename) throws IOException {
-        if (data == null || data.contentLength() < 4) {
-            return false;
-        }
-        if (filename != null) {
-            String lower = filename.toLowerCase();
-            if (lower.endsWith(".cbz")) {
-                // Treat CBZ as non-zip for our unzipping purposes
-                return false;
-            }
-        }
-        // Check the first four bytes of the data against the standard zip magic number
-        try (InputStream is = data.getInputStream()) {
-            byte[] header = new byte[4];
-            if (is.read(header) < 4) {
-                return false;
-            }
-            return header[0] == 0x50 && header[1] == 0x4B && header[2] == 0x03 && header[3] == 0x04;
-        }
-    }
-
-    private boolean isZip(Resource data) throws IOException {
-        return isZip(data, null);
-    }
-
-    private static final int MAX_UNZIP_DEPTH = 10;
-
-    private List<Resource> unzip(Resource data, PipelineResult result) throws IOException {
-        return unzip(data, result, 0);
-    }
-
-    private List<Resource> unzip(Resource data, PipelineResult result, int depth)
-            throws IOException {
-        if (depth > MAX_UNZIP_DEPTH) {
-            log.warn(
-                    "ZIP nesting depth {} exceeds limit {}, treating as file",
-                    depth,
-                    MAX_UNZIP_DEPTH);
-            return List.of(data);
-        }
-        log.info("Unzipping data of length: {}", data.contentLength());
-        List<Resource> unzippedFiles = new ArrayList<>();
-        try (InputStream bais = data.getInputStream();
-                ZipInputStream zis = ZipSecurity.createHardenedInputStream(bais)) {
-            ZipEntry entry;
-            while ((entry = zis.getNextEntry()) != null) {
-                if (entry.isDirectory()) {
-                    continue;
-                }
-                TempFile tempFile = tempFileManager.createManagedTempFile("unzip");
-                result.addTempFile(tempFile);
-                try (OutputStream os = Files.newOutputStream(tempFile.getPath())) {
-                    byte[] buffer = new byte[4096];
-                    int count;
-                    while ((count = zis.read(buffer)) != -1) {
-                        os.write(buffer, 0, count);
-                    }
-                }
-                final String filename = entry.getName();
-                Resource fileResource =
-                        new FileSystemResource(tempFile.getFile()) {
-
-                            @Override
-                            public String getFilename() {
-                                return filename;
-                            }
-                        };
-                // If the unzipped file is a zip file, unzip it
-                if (isZip(fileResource, filename)) {
-                    log.info("File {} is a zip file. Unzipping...", filename);
-                    unzippedFiles.addAll(unzip(fileResource, result, depth + 1));
-                } else {
-                    unzippedFiles.add(fileResource);
-                }
-            }
-        }
-        log.info("Unzipping completed. {} files were unzipped.", unzippedFiles.size());
-        return unzippedFiles;
-    }
-
-    private static class TempFileResource extends FileSystemResource {
-        private final TempFile tempFile;
-
-        public TempFileResource(TempFile tempFile) {
-            super(tempFile.getFile());
-            this.tempFile = tempFile;
-        }
-
-        public TempFile getTempFile() {
-            return tempFile;
-        }
-    }
 }
diff --git a/app/core/src/main/java/stirling/software/SPDF/controller/api/security/CertSignController.java b/app/core/src/main/java/stirling/software/SPDF/controller/api/security/CertSignController.java
index 5c45f5ab0f..f1b085dea2 100644
--- a/app/core/src/main/java/stirling/software/SPDF/controller/api/security/CertSignController.java
+++ b/app/core/src/main/java/stirling/software/SPDF/controller/api/security/CertSignController.java
@@ -64,6 +64,7 @@ import org.springframework.web.bind.annotation.ModelAttribute;
 import org.springframework.web.bind.annotation.RequestMapping;
 import org.springframework.web.bind.annotation.RestController;
 import org.springframework.web.multipart.MultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import io.micrometer.common.util.StringUtils;
 import io.swagger.v3.oas.annotations.Operation;
@@ -78,6 +79,8 @@ import stirling.software.common.service.CustomPDFDocumentFactory;
 import stirling.software.common.service.ServerCertificateServiceInterface;
 import stirling.software.common.util.ExceptionUtils;
 import stirling.software.common.util.GeneralUtils;
+import stirling.software.common.util.TempFile;
+import stirling.software.common.util.TempFileManager;
 import stirling.software.common.util.WebResponseUtils;
 
 @RestController
@@ -104,13 +107,15 @@ public class CertSignController {
 
     private final CustomPDFDocumentFactory pdfDocumentFactory;
     private final ServerCertificateServiceInterface serverCertificateService;
+    private final TempFileManager tempFileManager;
 
     public CertSignController(
             CustomPDFDocumentFactory pdfDocumentFactory,
-            @Autowired(required = false)
-                    ServerCertificateServiceInterface serverCertificateService) {
+            @Autowired(required = false) ServerCertificateServiceInterface serverCertificateService,
+            TempFileManager tempFileManager) {
         this.pdfDocumentFactory = pdfDocumentFactory;
         this.serverCertificateService = serverCertificateService;
+        this.tempFileManager = tempFileManager;
     }
 
     public static void sign(
@@ -163,8 +168,8 @@ public class CertSignController {
                     "This endpoint accepts a PDF file, a digital certificate and related"
                             + " information to sign the PDF. It then returns the digitally signed PDF"
                             + " file. Input:PDF Output:PDF Type:SISO")
-    public ResponseEntity<byte[]> signPDFWithCert(@ModelAttribute SignPDFWithCertRequest request)
-            throws Exception {
+    public ResponseEntity<StreamingResponseBody> signPDFWithCert(
+            @ModelAttribute SignPDFWithCertRequest request) throws Exception {
         MultipartFile pdf = request.getFileInput();
         String certType = request.getCertType();
         MultipartFile privateKeyFile = request.getPrivateKeyFile();
@@ -246,22 +251,26 @@ public class CertSignController {
         }
 
         CreateSignature createSignature = new CreateSignature(ks, keystorePassword.toCharArray());
-        ByteArrayOutputStream baos = new ByteArrayOutputStream();
-        sign(
-                pdfDocumentFactory,
-                pdf,
-                baos,
-                createSignature,
-                showSignature,
-                pageNumber,
-                name,
-                location,
-                reason,
-                showLogo);
+        TempFile signedOut = tempFileManager.createManagedTempFile(".pdf");
+        try (OutputStream os = new FileOutputStream(signedOut.getFile())) {
+            sign(
+                    pdfDocumentFactory,
+                    pdf,
+                    os,
+                    createSignature,
+                    showSignature,
+                    pageNumber,
+                    name,
+                    location,
+                    reason,
+                    showLogo);
+        } catch (IOException e) {
+            signedOut.close();
+            throw e;
+        }
         // Return the signed PDF
-        return WebResponseUtils.bytesToWebResponse(
-                baos.toByteArray(),
-                GeneralUtils.generateFilename(pdf.getOriginalFilename(), "_signed.pdf"));
+        return WebResponseUtils.pdfFileToWebResponse(
+                signedOut, GeneralUtils.generateFilename(pdf.getOriginalFilename(), "_signed.pdf"));
     }
 
     private MultipartFile validateFilePresent(
diff --git a/app/core/src/main/java/stirling/software/SPDF/controller/api/security/PasswordController.java b/app/core/src/main/java/stirling/software/SPDF/controller/api/security/PasswordController.java
index 567f1dd2ab..e9fa41ff05 100644
--- a/app/core/src/main/java/stirling/software/SPDF/controller/api/security/PasswordController.java
+++ b/app/core/src/main/java/stirling/software/SPDF/controller/api/security/PasswordController.java
@@ -9,6 +9,7 @@ import org.springframework.http.MediaType;
 import org.springframework.http.ResponseEntity;
 import org.springframework.web.bind.annotation.ModelAttribute;
 import org.springframework.web.multipart.MultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import io.swagger.v3.oas.annotations.Operation;
 
@@ -22,6 +23,7 @@ import stirling.software.common.annotations.api.SecurityApi;
 import stirling.software.common.service.CustomPDFDocumentFactory;
 import stirling.software.common.util.ExceptionUtils;
 import stirling.software.common.util.GeneralUtils;
+import stirling.software.common.util.TempFileManager;
 import stirling.software.common.util.WebResponseUtils;
 
 @SecurityApi
@@ -29,6 +31,7 @@ import stirling.software.common.util.WebResponseUtils;
 public class PasswordController {
 
     private final CustomPDFDocumentFactory pdfDocumentFactory;
+    private final TempFileManager tempFileManager;
 
     @AutoJobPostMapping(consumes = MediaType.MULTIPART_FORM_DATA_VALUE, value = "/remove-password")
     @StandardPdfResponse
@@ -37,8 +40,8 @@ public class PasswordController {
             description =
                     "This endpoint removes the password from a protected PDF file. Users need to"
                             + " provide the existing password. Input:PDF Output:PDF Type:SISO")
-    public ResponseEntity<byte[]> removePassword(@ModelAttribute PDFPasswordRequest request)
-            throws IOException {
+    public ResponseEntity<StreamingResponseBody> removePassword(
+            @ModelAttribute PDFPasswordRequest request) throws IOException {
         MultipartFile fileInput = request.getFileInput();
         String password = request.getPassword();
 
@@ -47,7 +50,8 @@ public class PasswordController {
             return WebResponseUtils.pdfDocToWebResponse(
                     document,
                     GeneralUtils.generateFilename(
-                            fileInput.getOriginalFilename(), "_password_removed.pdf"));
+                            fileInput.getOriginalFilename(), "_password_removed.pdf"),
+                    tempFileManager);
         } catch (IOException e) {
             // Handle password errors specifically
             if (ExceptionUtils.isPasswordError(e)) {
@@ -66,8 +70,8 @@ public class PasswordController {
                     "This endpoint adds password protection to a PDF file. Users can specify a set"
                             + " of permissions that should be applied to the file. Input:PDF"
                             + " Output:PDF")
-    public ResponseEntity<byte[]> addPassword(@ModelAttribute AddPasswordRequest request)
-            throws IOException {
+    public ResponseEntity<StreamingResponseBody> addPassword(
+            @ModelAttribute AddPasswordRequest request) throws IOException {
         MultipartFile fileInput = request.getFileInput();
         String ownerPassword = request.getOwnerPassword();
         String password = request.getPassword();
@@ -108,11 +112,13 @@ public class PasswordController {
                 return WebResponseUtils.pdfDocToWebResponse(
                         document,
                         GeneralUtils.generateFilename(
-                                fileInput.getOriginalFilename(), "_permissions.pdf"));
+                                fileInput.getOriginalFilename(), "_permissions.pdf"),
+                        tempFileManager);
             return WebResponseUtils.pdfDocToWebResponse(
                     document,
                     GeneralUtils.generateFilename(
-                            fileInput.getOriginalFilename(), "_passworded.pdf"));
+                            fileInput.getOriginalFilename(), "_passworded.pdf"),
+                    tempFileManager);
         }
     }
 }
diff --git a/app/core/src/main/java/stirling/software/SPDF/controller/api/security/RedactController.java b/app/core/src/main/java/stirling/software/SPDF/controller/api/security/RedactController.java
index 0011fdb34d..377529b5fb 100644
--- a/app/core/src/main/java/stirling/software/SPDF/controller/api/security/RedactController.java
+++ b/app/core/src/main/java/stirling/software/SPDF/controller/api/security/RedactController.java
@@ -1,7 +1,6 @@
 package stirling.software.SPDF.controller.api.security;
 
 import java.awt.Color;
-import java.io.ByteArrayOutputStream;
 import java.io.IOException;
 import java.util.ArrayList;
 import java.util.Arrays;
@@ -40,6 +39,7 @@ import org.springframework.web.bind.WebDataBinder;
 import org.springframework.web.bind.annotation.InitBinder;
 import org.springframework.web.bind.annotation.ModelAttribute;
 import org.springframework.web.multipart.MultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import io.github.pixee.security.Filenames;
 import io.swagger.v3.oas.annotations.Operation;
@@ -64,6 +64,8 @@ import stirling.software.common.service.CustomPDFDocumentFactory;
 import stirling.software.common.util.ExceptionUtils;
 import stirling.software.common.util.GeneralUtils;
 import stirling.software.common.util.PdfUtils;
+import stirling.software.common.util.TempFile;
+import stirling.software.common.util.TempFileManager;
 import stirling.software.common.util.WebResponseUtils;
 import stirling.software.common.util.propertyeditor.StringToArrayListPropertyEditor;
 
@@ -85,6 +87,7 @@ public class RedactController {
     private static final COSString EMPTY_COS_STRING = new COSString("");
 
     private final CustomPDFDocumentFactory pdfDocumentFactory;
+    private final TempFileManager tempFileManager;
 
     private String removeFileExtension(String filename) {
         return GeneralUtils.removeExtension(filename);
@@ -105,8 +108,8 @@ public class RedactController {
                     "This endpoint redacts content from a PDF file based on manually specified areas. "
                             + "Users can specify areas to redact and optionally convert the PDF to an image. "
                             + "Input:PDF Output:PDF Type:SISO")
-    public ResponseEntity<byte[]> redactPDF(@ModelAttribute ManualRedactPdfRequest request)
-            throws IOException {
+    public ResponseEntity<StreamingResponseBody> redactPDF(
+            @ModelAttribute ManualRedactPdfRequest request) throws IOException {
 
         MultipartFile file = request.getFileInput();
         List<RedactionArea> redactionAreas = request.getRedactions();
@@ -120,30 +123,24 @@ public class RedactController {
 
             if (Boolean.TRUE.equals(request.getConvertPDFToImage())) {
                 try (PDDocument convertedPdf = PdfUtils.convertPdfToPdfImage(document)) {
-                    ByteArrayOutputStream baos = new ByteArrayOutputStream();
-                    convertedPdf.save(baos);
-                    byte[] pdfContent = baos.toByteArray();
-
-                    return WebResponseUtils.bytesToWebResponse(
-                            pdfContent,
+                    return WebResponseUtils.pdfDocToWebResponse(
+                            convertedPdf,
                             removeFileExtension(
                                             Objects.requireNonNull(
                                                     Filenames.toSimpleFileName(
                                                             file.getOriginalFilename())))
-                                    + "_redacted.pdf");
+                                    + "_redacted.pdf",
+                            tempFileManager);
                 }
             }
 
-            ByteArrayOutputStream baos = new ByteArrayOutputStream();
-            document.save(baos);
-            byte[] pdfContent = baos.toByteArray();
-
-            return WebResponseUtils.bytesToWebResponse(
-                    pdfContent,
+            return WebResponseUtils.pdfDocToWebResponse(
+                    document,
                     removeFileExtension(
                                     Objects.requireNonNull(
                                             Filenames.toSimpleFileName(file.getOriginalFilename())))
-                            + "_redacted.pdf");
+                            + "_redacted.pdf",
+                    tempFileManager);
         }
     }
 
@@ -504,7 +501,8 @@ public class RedactController {
                     "This endpoint automatically redacts text from a PDF file based on specified patterns. "
                             + "Users can provide text patterns to redact, with options for regex and whole word matching. "
                             + "Input:PDF Output:PDF Type:SISO")
-    public ResponseEntity<byte[]> redactPdf(@ModelAttribute RedactPdfRequest request) {
+    public ResponseEntity<StreamingResponseBody> redactPdf(
+            @ModelAttribute RedactPdfRequest request) {
         String[] listOfText = request.getListOfText().split("\n");
         boolean useRegex = Boolean.TRUE.equals(request.getUseRegex());
         boolean wholeWordSearchBool = Boolean.TRUE.equals(request.getWholeWordSearch());
@@ -545,20 +543,15 @@ public class RedactController {
 
             if (allFoundTextsByPage.isEmpty()) {
                 log.info("No text found matching redaction patterns");
-                byte[] originalContent;
-                try (ByteArrayOutputStream baos = new ByteArrayOutputStream()) {
-                    document.save(baos);
-                    originalContent = baos.toByteArray();
-                }
-
-                return WebResponseUtils.bytesToWebResponse(
-                        originalContent,
+                return WebResponseUtils.pdfDocToWebResponse(
+                        document,
                         removeFileExtension(
                                         Objects.requireNonNull(
                                                 Filenames.toSimpleFileName(
                                                         request.getFileInput()
                                                                 .getOriginalFilename())))
-                                + "_redacted.pdf");
+                                + "_redacted.pdf",
+                        tempFileManager);
             }
 
             boolean fallbackToBoxOnlyMode;
@@ -587,7 +580,7 @@ public class RedactController {
                         findTextToRedact(
                                 fallbackDocument, listOfText, useRegex, wholeWordSearchBool);
 
-                byte[] pdfContent =
+                TempFile finalized =
                         finalizeRedaction(
                                 fallbackDocument,
                                 allFoundTextsByPage,
@@ -596,8 +589,8 @@ public class RedactController {
                                 request.getConvertPDFToImage(),
                                 false); // Box-only mode, use original box sizes
 
-                return WebResponseUtils.bytesToWebResponse(
-                        pdfContent,
+                return WebResponseUtils.pdfFileToWebResponse(
+                        finalized,
                         removeFileExtension(
                                         Objects.requireNonNull(
                                                 Filenames.toSimpleFileName(
@@ -606,7 +599,7 @@ public class RedactController {
                                 + "_redacted.pdf");
             }
 
-            byte[] pdfContent =
+            TempFile finalized =
                     finalizeRedaction(
                             document,
                             allFoundTextsByPage,
@@ -615,8 +608,8 @@ public class RedactController {
                             request.getConvertPDFToImage(),
                             true); // Text removal mode, use reduced box sizes
 
-            return WebResponseUtils.bytesToWebResponse(
-                    pdfContent,
+            return WebResponseUtils.pdfFileToWebResponse(
+                    finalized,
                     removeFileExtension(
                                     Objects.requireNonNull(
                                             Filenames.toSimpleFileName(
@@ -733,7 +726,7 @@ public class RedactController {
         }
     }
 
-    private byte[] finalizeRedaction(
+    private TempFile finalizeRedaction(
             PDDocument document,
             Map<Integer, List<PDFText>> allFoundTextsByPage,
             String colorString,
@@ -759,29 +752,37 @@ public class RedactController {
             try (PDDocument convertedPdf = PdfUtils.convertPdfToPdfImage(document)) {
                 cleanDocumentMetadata(convertedPdf);
 
-                ByteArrayOutputStream baos = new ByteArrayOutputStream();
-                convertedPdf.save(baos);
-                byte[] out = baos.toByteArray();
+                TempFile tempOut = tempFileManager.createManagedTempFile(".pdf");
+                try {
+                    convertedPdf.save(tempOut.getFile());
+                } catch (IOException e) {
+                    tempOut.close();
+                    throw e;
+                }
 
                 log.info(
                         "Redaction finalized (image mode): {} pages ➜ {} KB",
                         convertedPdf.getNumberOfPages(),
-                        out.length / 1024);
+                        tempOut.getFile().length() / 1024);
 
-                return out;
+                return tempOut;
             }
         }
 
-        ByteArrayOutputStream baos = new ByteArrayOutputStream();
-        document.save(baos);
-        byte[] out = baos.toByteArray();
+        TempFile tempOut = tempFileManager.createManagedTempFile(".pdf");
+        try {
+            document.save(tempOut.getFile());
+        } catch (IOException e) {
+            tempOut.close();
+            throw e;
+        }
 
         log.info(
                 "Redaction finalized: {} pages ➜ {} KB",
                 document.getNumberOfPages(),
-                out.length / 1024);
+                tempOut.getFile().length() / 1024);
 
-        return out;
+        return tempOut;
     }
 
     private void cleanDocumentMetadata(PDDocument document) {
diff --git a/app/core/src/main/java/stirling/software/SPDF/controller/api/security/RemoveCertSignController.java b/app/core/src/main/java/stirling/software/SPDF/controller/api/security/RemoveCertSignController.java
index 91644747e6..f23d63765e 100644
--- a/app/core/src/main/java/stirling/software/SPDF/controller/api/security/RemoveCertSignController.java
+++ b/app/core/src/main/java/stirling/software/SPDF/controller/api/security/RemoveCertSignController.java
@@ -11,6 +11,7 @@ import org.springframework.http.MediaType;
 import org.springframework.http.ResponseEntity;
 import org.springframework.web.bind.annotation.ModelAttribute;
 import org.springframework.web.multipart.MultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import io.swagger.v3.oas.annotations.Operation;
 
@@ -22,6 +23,7 @@ import stirling.software.common.annotations.api.SecurityApi;
 import stirling.software.common.model.api.PDFFile;
 import stirling.software.common.service.CustomPDFDocumentFactory;
 import stirling.software.common.util.GeneralUtils;
+import stirling.software.common.util.TempFileManager;
 import stirling.software.common.util.WebResponseUtils;
 
 @SecurityApi
@@ -29,6 +31,7 @@ import stirling.software.common.util.WebResponseUtils;
 public class RemoveCertSignController {
 
     private final CustomPDFDocumentFactory pdfDocumentFactory;
+    private final TempFileManager tempFileManager;
 
     @AutoJobPostMapping(consumes = MediaType.MULTIPART_FORM_DATA_VALUE, value = "/remove-cert-sign")
     @StandardPdfResponse
@@ -37,7 +40,7 @@ public class RemoveCertSignController {
             description =
                     "This endpoint accepts a PDF file and returns the PDF file without the digital"
                             + " signature. Input:PDF, Output:PDF Type:SISO")
-    public ResponseEntity<byte[]> removeCertSignPDF(@ModelAttribute PDFFile request)
+    public ResponseEntity<StreamingResponseBody> removeCertSignPDF(@ModelAttribute PDFFile request)
             throws Exception {
         MultipartFile pdf = request.getFileInput();
 
@@ -63,7 +66,8 @@ public class RemoveCertSignController {
             // Return the modified PDF as a response
             return WebResponseUtils.pdfDocToWebResponse(
                     document,
-                    GeneralUtils.generateFilename(pdf.getOriginalFilename(), "_unsigned.pdf"));
+                    GeneralUtils.generateFilename(pdf.getOriginalFilename(), "_unsigned.pdf"),
+                    tempFileManager);
         }
     }
 }
diff --git a/app/core/src/main/java/stirling/software/SPDF/controller/api/security/SanitizeController.java b/app/core/src/main/java/stirling/software/SPDF/controller/api/security/SanitizeController.java
index 9a6f44692f..7db9f2a8a0 100644
--- a/app/core/src/main/java/stirling/software/SPDF/controller/api/security/SanitizeController.java
+++ b/app/core/src/main/java/stirling/software/SPDF/controller/api/security/SanitizeController.java
@@ -1,6 +1,5 @@
 package stirling.software.SPDF.controller.api.security;
 
-import java.io.ByteArrayOutputStream;
 import java.io.IOException;
 import java.util.List;
 
@@ -29,6 +28,7 @@ import org.springframework.http.MediaType;
 import org.springframework.http.ResponseEntity;
 import org.springframework.web.bind.annotation.ModelAttribute;
 import org.springframework.web.multipart.MultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import io.swagger.v3.oas.annotations.Operation;
 
@@ -41,6 +41,7 @@ import stirling.software.common.annotations.AutoJobPostMapping;
 import stirling.software.common.annotations.api.SecurityApi;
 import stirling.software.common.service.CustomPDFDocumentFactory;
 import stirling.software.common.util.GeneralUtils;
+import stirling.software.common.util.TempFileManager;
 import stirling.software.common.util.WebResponseUtils;
 
 @Slf4j
@@ -49,6 +50,7 @@ import stirling.software.common.util.WebResponseUtils;
 public class SanitizeController {
 
     private final CustomPDFDocumentFactory pdfDocumentFactory;
+    private final TempFileManager tempFileManager;
 
     @AutoJobPostMapping(consumes = MediaType.MULTIPART_FORM_DATA_VALUE, value = "/sanitize-pdf")
     @StandardPdfResponse
@@ -57,8 +59,8 @@ public class SanitizeController {
             description =
                     "This endpoint processes a PDF file and removes specific elements based on the"
                             + " provided options. Input:PDF Output:PDF Type:SISO")
-    public ResponseEntity<byte[]> sanitizePDF(@ModelAttribute SanitizePdfRequest request)
-            throws IOException {
+    public ResponseEntity<StreamingResponseBody> sanitizePDF(
+            @ModelAttribute SanitizePdfRequest request) throws IOException {
         MultipartFile inputFile = request.getFileInput();
         boolean removeJavaScript = Boolean.TRUE.equals(request.getRemoveJavaScript());
         boolean removeEmbeddedFiles = Boolean.TRUE.equals(request.getRemoveEmbeddedFiles());
@@ -92,14 +94,11 @@ public class SanitizeController {
                 sanitizeFonts(document);
             }
 
-            // Save the sanitized document to output stream
-            ByteArrayOutputStream outputStream = new ByteArrayOutputStream();
-            document.save(outputStream);
-
-            return WebResponseUtils.bytesToWebResponse(
-                    outputStream.toByteArray(),
+            return WebResponseUtils.pdfDocToWebResponse(
+                    document,
                     GeneralUtils.generateFilename(
-                            inputFile.getOriginalFilename(), "_sanitized.pdf"));
+                            inputFile.getOriginalFilename(), "_sanitized.pdf"),
+                    tempFileManager);
         }
     }
 
diff --git a/app/core/src/main/java/stirling/software/SPDF/controller/api/security/TimestampController.java b/app/core/src/main/java/stirling/software/SPDF/controller/api/security/TimestampController.java
index f4259e682c..ef744330f7 100644
--- a/app/core/src/main/java/stirling/software/SPDF/controller/api/security/TimestampController.java
+++ b/app/core/src/main/java/stirling/software/SPDF/controller/api/security/TimestampController.java
@@ -1,6 +1,5 @@
 package stirling.software.SPDF.controller.api.security;
 
-import java.io.ByteArrayOutputStream;
 import java.io.IOException;
 import java.io.InputStream;
 import java.io.OutputStream;
@@ -33,6 +32,7 @@ import org.springframework.http.MediaType;
 import org.springframework.http.ResponseEntity;
 import org.springframework.web.bind.annotation.ModelAttribute;
 import org.springframework.web.multipart.MultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import io.swagger.v3.oas.annotations.Operation;
 
@@ -46,6 +46,8 @@ import stirling.software.common.annotations.api.SecurityApi;
 import stirling.software.common.model.ApplicationProperties;
 import stirling.software.common.service.CustomPDFDocumentFactory;
 import stirling.software.common.util.GeneralUtils;
+import stirling.software.common.util.TempFile;
+import stirling.software.common.util.TempFileManager;
 import stirling.software.common.util.WebResponseUtils;
 
 @Slf4j
@@ -74,6 +76,7 @@ public class TimestampController {
 
     private final CustomPDFDocumentFactory pdfDocumentFactory;
     private final ApplicationProperties applicationProperties;
+    private final TempFileManager tempFileManager;
 
     @AutoJobPostMapping(consumes = MediaType.MULTIPART_FORM_DATA_VALUE, value = "/timestamp-pdf")
     @StandardPdfResponse
@@ -84,8 +87,8 @@ public class TimestampController {
                             + " document timestamp into the PDF. Only a SHA-256 hash of the"
                             + " document is sent to the TSA — the PDF itself never leaves the"
                             + " server. Input:PDF Output:PDF Type:SISO")
-    public ResponseEntity<byte[]> timestampPdf(@ModelAttribute TimestampPdfRequest request)
-            throws Exception {
+    public ResponseEntity<StreamingResponseBody> timestampPdf(
+            @ModelAttribute TimestampPdfRequest request) throws Exception {
         MultipartFile inputFile = request.getFileInput();
         ApplicationProperties.Security.Timestamp tsConfig =
                 applicationProperties.getSecurity().getTimestamp();
@@ -124,9 +127,10 @@ public class TimestampController {
                             + " via settings.yml (security.timestamp.customTsaUrls).");
         }
 
-        ByteArrayOutputStream outputStream = new ByteArrayOutputStream();
-
-        try (PDDocument document = pdfDocumentFactory.load(inputFile)) {
+        TempFile tempOutputFile = tempFileManager.createManagedTempFile(".pdf");
+        try (PDDocument document = pdfDocumentFactory.load(inputFile);
+                OutputStream outputStream =
+                        java.nio.file.Files.newOutputStream(tempOutputFile.getPath())) {
             PDSignature signature = new PDSignature();
             signature.setType(COSName.DOC_TIME_STAMP);
             signature.setFilter(PDSignature.FILTER_ADOBE_PPKLITE);
@@ -136,10 +140,13 @@ public class TimestampController {
             document.addSignature(signature, content -> requestTimestampToken(content, tsaUrl));
 
             document.saveIncremental(outputStream);
+        } catch (Exception e) {
+            tempOutputFile.close();
+            throw e;
         }
 
-        return WebResponseUtils.bytesToWebResponse(
-                outputStream.toByteArray(),
+        return WebResponseUtils.pdfFileToWebResponse(
+                tempOutputFile,
                 GeneralUtils.generateFilename(inputFile.getOriginalFilename(), "_timestamped.pdf"));
     }
 
@@ -163,7 +170,8 @@ public class TimestampController {
             TimeStampRequest tsaRequest = generator.generate(digestAlgorithm, hash, nonce);
             byte[] requestBytes = tsaRequest.getEncoded();
 
-            // Contact the TSA server (redirects disabled to prevent SSRF via redirect)
+            // Contact the TSA server — tsaUrl is validated against an allowlist above,
+            // and redirects are disabled below to prevent SSRF via redirect.
             connection = (HttpURLConnection) URI.create(tsaUrl).toURL().openConnection();
             connection.setInstanceFollowRedirects(false);
             connection.setDoOutput(true);
diff --git a/app/core/src/main/java/stirling/software/SPDF/controller/api/security/WatermarkController.java b/app/core/src/main/java/stirling/software/SPDF/controller/api/security/WatermarkController.java
index 773c0e21f2..5e51fd55c6 100644
--- a/app/core/src/main/java/stirling/software/SPDF/controller/api/security/WatermarkController.java
+++ b/app/core/src/main/java/stirling/software/SPDF/controller/api/security/WatermarkController.java
@@ -30,6 +30,7 @@ import org.springframework.web.bind.WebDataBinder;
 import org.springframework.web.bind.annotation.InitBinder;
 import org.springframework.web.bind.annotation.ModelAttribute;
 import org.springframework.web.multipart.MultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import io.swagger.v3.oas.annotations.Operation;
 
@@ -45,6 +46,7 @@ import stirling.software.common.service.CustomPDFDocumentFactory;
 import stirling.software.common.util.GeneralUtils;
 import stirling.software.common.util.PdfUtils;
 import stirling.software.common.util.RegexPatternUtils;
+import stirling.software.common.util.TempFileManager;
 import stirling.software.common.util.WebResponseUtils;
 
 @SecurityApi
@@ -52,6 +54,7 @@ import stirling.software.common.util.WebResponseUtils;
 public class WatermarkController {
 
     private final CustomPDFDocumentFactory pdfDocumentFactory;
+    private final TempFileManager tempFileManager;
 
     @InitBinder
     public void initBinder(WebDataBinder binder) {
@@ -73,8 +76,8 @@ public class WatermarkController {
                     "This endpoint adds a watermark to a given PDF file. Users can specify the"
                             + " watermark type (text or image), rotation, opacity, width spacer, and"
                             + " height spacer. Input:PDF Output:PDF Type:SISO")
-    public ResponseEntity<byte[]> addWatermark(@Valid @ModelAttribute AddWatermarkRequest request)
-            throws IOException, Exception {
+    public ResponseEntity<StreamingResponseBody> addWatermark(
+            @Valid @ModelAttribute AddWatermarkRequest request) throws IOException, Exception {
         MultipartFile pdfFile = request.getFileInput();
         String pdfFileName = pdfFile.getOriginalFilename();
         if (pdfFileName != null && (pdfFileName.contains("..") || pdfFileName.startsWith("/"))) {
@@ -151,14 +154,16 @@ public class WatermarkController {
                     return WebResponseUtils.pdfDocToWebResponse(
                             convertedPdf,
                             GeneralUtils.generateFilename(
-                                    pdfFile.getOriginalFilename(), "_watermarked.pdf"));
+                                    pdfFile.getOriginalFilename(), "_watermarked.pdf"),
+                            tempFileManager);
                 }
             } else {
                 // Return the watermarked PDF as a response
                 return WebResponseUtils.pdfDocToWebResponse(
                         document,
                         GeneralUtils.generateFilename(
-                                pdfFile.getOriginalFilename(), "_watermarked.pdf"));
+                                pdfFile.getOriginalFilename(), "_watermarked.pdf"),
+                        tempFileManager);
             }
         }
     }
diff --git a/app/core/src/main/java/stirling/software/SPDF/controller/web/SignatureImageController.java b/app/core/src/main/java/stirling/software/SPDF/controller/web/SignatureImageController.java
index 5d69d60c8c..92f9dc8cab 100644
--- a/app/core/src/main/java/stirling/software/SPDF/controller/web/SignatureImageController.java
+++ b/app/core/src/main/java/stirling/software/SPDF/controller/web/SignatureImageController.java
@@ -11,21 +11,18 @@ import org.springframework.web.bind.annotation.PathVariable;
 import org.springframework.web.bind.annotation.RequestMapping;
 import org.springframework.web.bind.annotation.RestController;
 
+import io.swagger.v3.oas.annotations.tags.Tag;
+
 import lombok.extern.slf4j.Slf4j;
 
 import stirling.software.SPDF.service.SharedSignatureService;
 import stirling.software.common.service.PersonalSignatureServiceInterface;
 import stirling.software.common.service.UserServiceInterface;
 
-/**
- * Unified signature image controller that works for both authenticated and unauthenticated users.
- * Uses composition pattern: - Core SharedSignatureService (always available): reads shared
- * signatures - PersonalSignatureService (proprietary, optional): reads personal signatures For
- * authenticated signature management (save/delete), see proprietary SignatureController.
- */
 @Slf4j
 @RestController
 @RequestMapping("/api/v1/general")
+@Tag(name = "Signature Assets", description = "Retrieve saved signature images")
 public class SignatureImageController {
 
     private final SharedSignatureService sharedSignatureService;
diff --git a/app/core/src/main/java/stirling/software/SPDF/model/api/converters/ConvertPDFToMarkdown.java b/app/core/src/main/java/stirling/software/SPDF/model/api/converters/ConvertPDFToMarkdown.java
index 5b820e6073..013aaa01ef 100644
--- a/app/core/src/main/java/stirling/software/SPDF/model/api/converters/ConvertPDFToMarkdown.java
+++ b/app/core/src/main/java/stirling/software/SPDF/model/api/converters/ConvertPDFToMarkdown.java
@@ -4,6 +4,7 @@ import org.springframework.http.MediaType;
 import org.springframework.http.ResponseEntity;
 import org.springframework.web.bind.annotation.ModelAttribute;
 import org.springframework.web.multipart.MultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import io.swagger.v3.oas.annotations.Operation;
 
@@ -28,7 +29,7 @@ public class ConvertPDFToMarkdown {
             summary = "Convert PDF to Markdown",
             description =
                     "This endpoint converts a PDF file to Markdown format. Input:PDF Output:Markdown Type:SISO")
-    public ResponseEntity<byte[]> processPdfToMarkdown(@ModelAttribute PDFFile file)
+    public ResponseEntity<StreamingResponseBody> processPdfToMarkdown(@ModelAttribute PDFFile file)
             throws Exception {
         MultipartFile inputFile = file.getFileInput();
         PDFToFile pdfToFile = new PDFToFile(tempFileManager);
diff --git a/app/core/src/main/java/stirling/software/SPDF/model/api/general/RotatePDFRequest.java b/app/core/src/main/java/stirling/software/SPDF/model/api/general/RotatePDFRequest.java
index 030a0df42b..43695de3d4 100644
--- a/app/core/src/main/java/stirling/software/SPDF/model/api/general/RotatePDFRequest.java
+++ b/app/core/src/main/java/stirling/software/SPDF/model/api/general/RotatePDFRequest.java
@@ -13,7 +13,8 @@ public class RotatePDFRequest extends PDFFile {
 
     @Schema(
             description =
-                    "The angle by which to rotate the PDF file. This should be a multiple of 90.",
+                    "The clockwise angle by which to rotate the PDF file. Must be a multiple of"
+                            + " 90.",
             type = "integer",
             requiredMode = Schema.RequiredMode.REQUIRED,
             allowableValues = {"0", "90", "180", "270"})
diff --git a/app/core/src/main/java/stirling/software/SPDF/pdf/TextFinder.java b/app/core/src/main/java/stirling/software/SPDF/pdf/TextFinder.java
index aa727035aa..a49476004e 100644
--- a/app/core/src/main/java/stirling/software/SPDF/pdf/TextFinder.java
+++ b/app/core/src/main/java/stirling/software/SPDF/pdf/TextFinder.java
@@ -34,6 +34,7 @@ public class TextFinder extends PDFTextStripper {
         this.useRegex = useRegex;
         this.wholeWordSearch = wholeWordSearch;
         this.setWordSeparator(" ");
+        this.setLineSeparator("\n");
     }
 
     @Override
diff --git a/app/core/src/main/java/stirling/software/SPDF/service/ApiDocService.java b/app/core/src/main/java/stirling/software/SPDF/service/ApiDocService.java
index e60c74e223..b0d2e5a4a0 100644
--- a/app/core/src/main/java/stirling/software/SPDF/service/ApiDocService.java
+++ b/app/core/src/main/java/stirling/software/SPDF/service/ApiDocService.java
@@ -6,6 +6,7 @@ import java.util.List;
 import java.util.Locale;
 import java.util.Map;
 import java.util.regex.Matcher;
+import java.util.regex.Pattern;
 
 import org.springframework.beans.factory.annotation.Autowired;
 import org.springframework.http.HttpEntity;
@@ -30,7 +31,14 @@ import tools.jackson.databind.ObjectMapper;
 
 @Service
 @Slf4j
-public class ApiDocService {
+public class ApiDocService implements stirling.software.common.service.ToolMetadataService {
+
+    // Matches a bare "Output:ZIP" declaration (i.e. ZIP is not followed by "-" or "/").
+    // Bare ZIP means the archive itself is the deliverable (e.g. get-attachments), so it
+    // should not be auto-unpacked. Wrapper forms like Output:ZIP-PDF or Output:IMAGE/ZIP
+    // use ZIP as transport for multiple typed results and are safe to unpack.
+    private static final Pattern BARE_ZIP_OUTPUT =
+            Pattern.compile("Output\\s*:\\s*ZIP(?![-/])", Pattern.CASE_INSENSITIVE);
 
     private final Map<String, ApiEndpoint> apiDocumentation = new HashMap<>();
 
@@ -149,6 +157,7 @@ public class ApiDocService {
         return endpoint.areParametersValid(parameters);
     }
 
+    @Override
     public boolean isMultiInput(String operationName) {
         if (apiDocsJsonRootNode == null || apiDocumentation.isEmpty()) {
             loadApiDocumentation();
@@ -166,5 +175,36 @@ public class ApiDocService {
         }
         return false;
     }
+
+    @Override
+    public boolean shouldUnpackZipResponse(String operationName) {
+        if (apiDocsJsonRootNode == null || apiDocumentation.isEmpty()) {
+            loadApiDocumentation();
+        }
+        if (!apiDocumentation.containsKey(operationName)) {
+            return false;
+        }
+        ApiEndpoint endpoint = apiDocumentation.get(operationName);
+        String description = endpoint.getDescription();
+        Matcher typeMatcher =
+                RegexPatternUtils.getInstance().getApiDocTypePattern().matcher(description);
+        if (typeMatcher.find()) {
+            String type = typeMatcher.group(1);
+            // Multi-output endpoints (SIMO/MIMO) return a ZIP of their outputs.
+            if (type.endsWith("MO")) {
+                return true;
+            }
+        }
+        Matcher outputMatcher =
+                RegexPatternUtils.getInstance().getApiDocOutputTypePattern().matcher(description);
+        if (outputMatcher.find()) {
+            String output = outputMatcher.group(1).toUpperCase(Locale.ROOT);
+            if (output.startsWith("ZIP")) {
+                // Bare "Output:ZIP" is a single-archive deliverable, not a transport.
+                return !BARE_ZIP_OUTPUT.matcher(description).find();
+            }
+        }
+        return false;
+    }
 }
 // Model class for API Endpoint
diff --git a/app/core/src/main/resources/application.properties b/app/core/src/main/resources/application.properties
index 751eabd77e..701adb2c2c 100644
--- a/app/core/src/main/resources/application.properties
+++ b/app/core/src/main/resources/application.properties
@@ -25,6 +25,11 @@ server.http2.enabled=true
 # Enable virtual threads (Java 21+, pinning fix in Java 25)
 spring.threads.virtual.enabled=true
 
+# Only run security filters on REQUEST and ERROR dispatches (not ASYNC).
+# StreamingResponseBody triggers an ASYNC dispatch on completion; without this,
+# Spring Security re-evaluates authorization after the response is already committed.
+spring.security.filter.dispatcher-types=REQUEST,ERROR
+
 # Response compression
 server.compression.enabled=true
 server.compression.min-response-size=1024
diff --git a/app/core/src/main/resources/settings.yml.template b/app/core/src/main/resources/settings.yml.template
index c78a515bd3..2540c2f512 100644
--- a/app/core/src/main/resources/settings.yml.template
+++ b/app/core/src/main/resources/settings.yml.template
@@ -325,6 +325,11 @@ processExecutor:
     ghostscriptTimeoutMinutes: 30
     ocrMyPdfTimeoutMinutes: 30
 
+aiEngine:
+  enabled: false # Set to 'true' to enable the AI engine integration
+  url: http://localhost:5001 # URL of the Python AI engine
+  timeoutSeconds: 120 # Timeout in seconds for AI engine requests
+
 pdfEditor:
   fallback-font: classpath:/static/fonts/NotoSans-Regular.ttf # Override to point at a custom fallback font
   cache:
diff --git a/app/core/src/test/java/stirling/software/SPDF/controller/api/BookletImpositionControllerTest.java b/app/core/src/test/java/stirling/software/SPDF/controller/api/BookletImpositionControllerTest.java
index 93e819c8c3..0e260e3822 100644
--- a/app/core/src/test/java/stirling/software/SPDF/controller/api/BookletImpositionControllerTest.java
+++ b/app/core/src/test/java/stirling/software/SPDF/controller/api/BookletImpositionControllerTest.java
@@ -1,8 +1,10 @@
 package stirling.software.SPDF.controller.api;
 
 import static org.assertj.core.api.Assertions.*;
+import static org.mockito.ArgumentMatchers.anyString;
 import static org.mockito.Mockito.*;
 
+import java.io.File;
 import java.io.IOException;
 import java.nio.file.Files;
 import java.nio.file.Path;
@@ -11,6 +13,7 @@ import org.apache.pdfbox.Loader;
 import org.apache.pdfbox.pdmodel.PDDocument;
 import org.apache.pdfbox.pdmodel.PDPage;
 import org.apache.pdfbox.pdmodel.common.PDRectangle;
+import org.junit.jupiter.api.BeforeEach;
 import org.junit.jupiter.api.Test;
 import org.junit.jupiter.api.extension.ExtendWith;
 import org.junit.jupiter.api.io.TempDir;
@@ -21,17 +24,47 @@ import org.springframework.http.HttpStatus;
 import org.springframework.http.MediaType;
 import org.springframework.http.ResponseEntity;
 import org.springframework.mock.web.MockMultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import stirling.software.SPDF.model.api.general.BookletImpositionRequest;
 import stirling.software.common.service.CustomPDFDocumentFactory;
+import stirling.software.common.util.TempFile;
+import stirling.software.common.util.TempFileManager;
 
 @ExtendWith(MockitoExtension.class)
 class BookletImpositionControllerTest {
+    private static ResponseEntity<StreamingResponseBody> streamingOk(byte[] bytes) {
+        return ResponseEntity.ok(out -> out.write(bytes));
+    }
+
+    private static byte[] drainBody(ResponseEntity<StreamingResponseBody> response)
+            throws java.io.IOException {
+        java.io.ByteArrayOutputStream baos = new java.io.ByteArrayOutputStream();
+        response.getBody().writeTo(baos);
+        return baos.toByteArray();
+    }
 
     @TempDir Path tempDir;
     @Mock private CustomPDFDocumentFactory pdfDocumentFactory;
+    @Mock private TempFileManager tempFileManager;
     @InjectMocks private BookletImpositionController controller;
 
+    @BeforeEach
+    void setUp() throws Exception {
+        lenient()
+                .when(tempFileManager.createManagedTempFile(anyString()))
+                .thenAnswer(
+                        inv -> {
+                            File f =
+                                    Files.createTempFile("test", inv.<String>getArgument(0))
+                                            .toFile();
+                            TempFile tf = mock(TempFile.class);
+                            lenient().when(tf.getFile()).thenReturn(f);
+                            lenient().when(tf.getPath()).thenReturn(f.toPath());
+                            return tf;
+                        });
+    }
+
     private MockMultipartFile createRealPdf(int numPages) throws IOException {
         Path path = tempDir.resolve("test.pdf");
         try (PDDocument doc = new PDDocument()) {
@@ -61,11 +94,12 @@ class BookletImpositionControllerTest {
         when(pdfDocumentFactory.load(file)).thenReturn(sourceDoc);
         when(pdfDocumentFactory.createNewDocumentBasedOnOldDocument(sourceDoc)).thenReturn(newDoc);
 
-        ResponseEntity<byte[]> response = controller.createBookletImposition(request);
+        ResponseEntity<StreamingResponseBody> response =
+                controller.createBookletImposition(request);
 
         assertThat(response.getStatusCode()).isEqualTo(HttpStatus.OK);
-        assertThat(response.getBody()).isNotEmpty();
-        try (PDDocument result = Loader.loadPDF(response.getBody())) {
+        assertThat(drainBody(response)).isNotEmpty();
+        try (PDDocument result = Loader.loadPDF(drainBody(response))) {
             assertThat(result.getNumberOfPages()).isGreaterThan(0);
         }
     }
@@ -92,10 +126,11 @@ class BookletImpositionControllerTest {
         when(pdfDocumentFactory.load(file)).thenReturn(sourceDoc);
         when(pdfDocumentFactory.createNewDocumentBasedOnOldDocument(sourceDoc)).thenReturn(newDoc);
 
-        ResponseEntity<byte[]> response = controller.createBookletImposition(request);
+        ResponseEntity<StreamingResponseBody> response =
+                controller.createBookletImposition(request);
 
         assertThat(response.getStatusCode()).isEqualTo(HttpStatus.OK);
-        assertThat(response.getBody()).isNotEmpty();
+        assertThat(drainBody(response)).isNotEmpty();
     }
 
     @Test
@@ -109,7 +144,8 @@ class BookletImpositionControllerTest {
         when(pdfDocumentFactory.load(file)).thenReturn(sourceDoc);
         when(pdfDocumentFactory.createNewDocumentBasedOnOldDocument(sourceDoc)).thenReturn(newDoc);
 
-        ResponseEntity<byte[]> response = controller.createBookletImposition(request);
+        ResponseEntity<StreamingResponseBody> response =
+                controller.createBookletImposition(request);
 
         assertThat(response.getStatusCode()).isEqualTo(HttpStatus.OK);
     }
@@ -126,7 +162,8 @@ class BookletImpositionControllerTest {
         when(pdfDocumentFactory.load(file)).thenReturn(sourceDoc);
         when(pdfDocumentFactory.createNewDocumentBasedOnOldDocument(sourceDoc)).thenReturn(newDoc);
 
-        ResponseEntity<byte[]> response = controller.createBookletImposition(request);
+        ResponseEntity<StreamingResponseBody> response =
+                controller.createBookletImposition(request);
 
         assertThat(response.getStatusCode()).isEqualTo(HttpStatus.OK);
     }
@@ -143,7 +180,8 @@ class BookletImpositionControllerTest {
         when(pdfDocumentFactory.load(file)).thenReturn(sourceDoc);
         when(pdfDocumentFactory.createNewDocumentBasedOnOldDocument(sourceDoc)).thenReturn(newDoc);
 
-        ResponseEntity<byte[]> response = controller.createBookletImposition(request);
+        ResponseEntity<StreamingResponseBody> response =
+                controller.createBookletImposition(request);
 
         assertThat(response.getStatusCode()).isEqualTo(HttpStatus.OK);
     }
@@ -160,7 +198,8 @@ class BookletImpositionControllerTest {
         when(pdfDocumentFactory.load(file)).thenReturn(sourceDoc);
         when(pdfDocumentFactory.createNewDocumentBasedOnOldDocument(sourceDoc)).thenReturn(newDoc);
 
-        ResponseEntity<byte[]> response = controller.createBookletImposition(request);
+        ResponseEntity<StreamingResponseBody> response =
+                controller.createBookletImposition(request);
 
         assertThat(response.getStatusCode()).isEqualTo(HttpStatus.OK);
     }
@@ -177,7 +216,8 @@ class BookletImpositionControllerTest {
         when(pdfDocumentFactory.load(file)).thenReturn(sourceDoc);
         when(pdfDocumentFactory.createNewDocumentBasedOnOldDocument(sourceDoc)).thenReturn(newDoc);
 
-        ResponseEntity<byte[]> response = controller.createBookletImposition(request);
+        ResponseEntity<StreamingResponseBody> response =
+                controller.createBookletImposition(request);
 
         assertThat(response.getStatusCode()).isEqualTo(HttpStatus.OK);
     }
@@ -192,7 +232,8 @@ class BookletImpositionControllerTest {
         when(pdfDocumentFactory.load(file)).thenReturn(sourceDoc);
         when(pdfDocumentFactory.createNewDocumentBasedOnOldDocument(sourceDoc)).thenReturn(newDoc);
 
-        ResponseEntity<byte[]> response = controller.createBookletImposition(request);
+        ResponseEntity<StreamingResponseBody> response =
+                controller.createBookletImposition(request);
 
         assertThat(response.getStatusCode()).isEqualTo(HttpStatus.OK);
     }
@@ -220,7 +261,8 @@ class BookletImpositionControllerTest {
         when(pdfDocumentFactory.load(file)).thenReturn(sourceDoc);
         when(pdfDocumentFactory.createNewDocumentBasedOnOldDocument(sourceDoc)).thenReturn(newDoc);
 
-        ResponseEntity<byte[]> response = controller.createBookletImposition(request);
+        ResponseEntity<StreamingResponseBody> response =
+                controller.createBookletImposition(request);
 
         assertThat(response.getStatusCode()).isEqualTo(HttpStatus.OK);
     }
diff --git a/app/core/src/test/java/stirling/software/SPDF/controller/api/CropControllerTest.java b/app/core/src/test/java/stirling/software/SPDF/controller/api/CropControllerTest.java
index 3c526a84c5..05389a840a 100644
--- a/app/core/src/test/java/stirling/software/SPDF/controller/api/CropControllerTest.java
+++ b/app/core/src/test/java/stirling/software/SPDF/controller/api/CropControllerTest.java
@@ -1,9 +1,11 @@
 package stirling.software.SPDF.controller.api;
 
 import static org.assertj.core.api.Assertions.*;
+import static org.mockito.ArgumentMatchers.anyString;
 import static org.mockito.Mockito.*;
 
 import java.awt.image.BufferedImage;
+import java.io.File;
 import java.io.IOException;
 import java.lang.reflect.Method;
 import java.nio.file.Files;
@@ -29,21 +31,47 @@ import org.springframework.http.HttpStatus;
 import org.springframework.http.MediaType;
 import org.springframework.http.ResponseEntity;
 import org.springframework.mock.web.MockMultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import stirling.software.SPDF.model.api.general.CropPdfForm;
 import stirling.software.common.service.CustomPDFDocumentFactory;
+import stirling.software.common.util.TempFile;
+import stirling.software.common.util.TempFileManager;
 
 @ExtendWith(MockitoExtension.class)
 @DisplayName("CropController Tests")
 class CropControllerTest {
+    private static ResponseEntity<StreamingResponseBody> streamingOk(byte[] bytes) {
+        return ResponseEntity.ok(out -> out.write(bytes));
+    }
+
+    private static byte[] drainBody(ResponseEntity<StreamingResponseBody> response)
+            throws java.io.IOException {
+        java.io.ByteArrayOutputStream baos = new java.io.ByteArrayOutputStream();
+        response.getBody().writeTo(baos);
+        return baos.toByteArray();
+    }
 
     @TempDir Path tempDir;
     @Mock private CustomPDFDocumentFactory pdfDocumentFactory;
+    @Mock private TempFileManager tempFileManager;
     @InjectMocks private CropController cropController;
     private TestPdfFactory pdfFactory;
 
     @BeforeEach
-    void setUp() {
+    void setUp() throws Exception {
+        lenient()
+                .when(tempFileManager.createManagedTempFile(anyString()))
+                .thenAnswer(
+                        inv -> {
+                            File f =
+                                    Files.createTempFile("test", inv.<String>getArgument(0))
+                                            .toFile();
+                            TempFile tf = mock(TempFile.class);
+                            lenient().when(tf.getFile()).thenReturn(f);
+                            lenient().when(tf.getPath()).thenReturn(f.toPath());
+                            return tf;
+                        });
         pdfFactory = new TestPdfFactory();
     }
 
@@ -177,7 +205,7 @@ class CropControllerTest {
             when(pdfDocumentFactory.createNewDocumentBasedOnOldDocument(mockDocument))
                     .thenReturn(newDocument);
 
-            ResponseEntity<byte[]> response = cropController.cropPdf(request);
+            ResponseEntity<StreamingResponseBody> response = cropController.cropPdf(request);
 
             assertThat(response)
                     .isNotNull()
@@ -214,7 +242,7 @@ class CropControllerTest {
             when(pdfDocumentFactory.createNewDocumentBasedOnOldDocument(mockDocument))
                     .thenReturn(newDocument);
 
-            ResponseEntity<byte[]> response = cropController.cropPdf(request);
+            ResponseEntity<StreamingResponseBody> response = cropController.cropPdf(request);
 
             assertThat(response).isNotNull();
             assertThat(response.getStatusCode()).isEqualTo(HttpStatus.OK);
@@ -234,7 +262,7 @@ class CropControllerTest {
         private TestPdfFactory autoCropPdfFactory;
 
         @BeforeEach
-        void setUp() {
+        void setUp() throws Exception {
             autoCropPdfFactory = new TestPdfFactory();
         }
 
@@ -254,13 +282,13 @@ class CropControllerTest {
                 when(pdfDocumentFactory.createNewDocumentBasedOnOldDocument(sourceDoc))
                         .thenReturn(newDoc);
 
-                ResponseEntity<byte[]> response = cropController.cropPdf(request);
+                ResponseEntity<StreamingResponseBody> response = cropController.cropPdf(request);
 
                 assertThat(response).isNotNull();
                 assertThat(response.getStatusCode()).isEqualTo(HttpStatus.OK);
-                assertThat(response.getBody()).isNotEmpty();
+                assertThat(drainBody(response)).isNotEmpty();
 
-                try (PDDocument result = Loader.loadPDF(response.getBody())) {
+                try (PDDocument result = Loader.loadPDF(drainBody(response))) {
                     assertThat(result.getNumberOfPages()).isEqualTo(1);
 
                     PDPage page = result.getPage(0);
@@ -285,13 +313,13 @@ class CropControllerTest {
                 when(pdfDocumentFactory.createNewDocumentBasedOnOldDocument(sourceDoc))
                         .thenReturn(newDoc);
 
-                ResponseEntity<byte[]> response = cropController.cropPdf(request);
+                ResponseEntity<StreamingResponseBody> response = cropController.cropPdf(request);
 
                 assertThat(response).isNotNull();
                 assertThat(response.getStatusCode()).isEqualTo(HttpStatus.OK);
 
                 Assertions.assertNotNull(response.getBody());
-                try (PDDocument result = Loader.loadPDF(response.getBody())) {
+                try (PDDocument result = Loader.loadPDF(drainBody(response))) {
                     assertThat(result.getNumberOfPages()).isEqualTo(1);
                 }
             }
@@ -648,7 +676,7 @@ class CropControllerTest {
             when(pdfDocumentFactory.createNewDocumentBasedOnOldDocument(mockDocument))
                     .thenReturn(newDocument);
 
-            ResponseEntity<byte[]> response = cropController.cropPdf(request);
+            ResponseEntity<StreamingResponseBody> response = cropController.cropPdf(request);
 
             assertThat(response).isNotNull();
             assertThat(response.getStatusCode()).isEqualTo(HttpStatus.OK);
@@ -676,7 +704,7 @@ class CropControllerTest {
             when(pdfDocumentFactory.createNewDocumentBasedOnOldDocument(mockDocument))
                     .thenReturn(newDocument);
 
-            ResponseEntity<byte[]> response = cropController.cropPdf(request);
+            ResponseEntity<StreamingResponseBody> response = cropController.cropPdf(request);
 
             assertThat(response.getStatusCode()).isEqualTo(HttpStatus.OK);
             verify(mockDocument, times(1)).close();
diff --git a/app/core/src/test/java/stirling/software/SPDF/controller/api/EditTableOfContentsControllerTest.java b/app/core/src/test/java/stirling/software/SPDF/controller/api/EditTableOfContentsControllerTest.java
index 9ff4687d86..5f8f459a9d 100644
--- a/app/core/src/test/java/stirling/software/SPDF/controller/api/EditTableOfContentsControllerTest.java
+++ b/app/core/src/test/java/stirling/software/SPDF/controller/api/EditTableOfContentsControllerTest.java
@@ -1,10 +1,12 @@
 package stirling.software.SPDF.controller.api;
 
 import static org.junit.jupiter.api.Assertions.*;
+import static org.mockito.ArgumentMatchers.anyString;
 import static org.mockito.Mockito.*;
 
-import java.io.ByteArrayOutputStream;
+import java.io.File;
 import java.lang.reflect.Method;
+import java.nio.file.Files;
 import java.util.ArrayList;
 import java.util.List;
 import java.util.Map;
@@ -26,10 +28,13 @@ import org.mockito.junit.jupiter.MockitoExtension;
 import org.springframework.http.MediaType;
 import org.springframework.http.ResponseEntity;
 import org.springframework.mock.web.MockMultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import stirling.software.SPDF.controller.api.EditTableOfContentsController.BookmarkItem;
 import stirling.software.SPDF.model.api.EditTableOfContentsRequest;
 import stirling.software.common.service.CustomPDFDocumentFactory;
+import stirling.software.common.util.TempFile;
+import stirling.software.common.util.TempFileManager;
 
 import tools.jackson.core.type.TypeReference;
 import tools.jackson.databind.ObjectMapper;
@@ -40,6 +45,7 @@ class EditTableOfContentsControllerTest {
     @Mock private CustomPDFDocumentFactory pdfDocumentFactory;
 
     @Mock private ObjectMapper objectMapper;
+    @Mock private TempFileManager tempFileManager;
 
     @InjectMocks private EditTableOfContentsController editTableOfContentsController;
 
@@ -53,7 +59,19 @@ class EditTableOfContentsControllerTest {
     private PDOutlineItem mockOutlineItem;
 
     @BeforeEach
-    void setUp() {
+    void setUp() throws Exception {
+        lenient()
+                .when(tempFileManager.createManagedTempFile(anyString()))
+                .thenAnswer(
+                        inv -> {
+                            File f =
+                                    Files.createTempFile("test", inv.<String>getArgument(0))
+                                            .toFile();
+                            TempFile tf = mock(TempFile.class);
+                            lenient().when(tf.getFile()).thenReturn(f);
+                            lenient().when(tf.getPath()).thenReturn(f.toPath());
+                            return tf;
+                        });
         mockFile =
                 new MockMultipartFile(
                         "file",
@@ -226,18 +244,19 @@ class EditTableOfContentsControllerTest {
         when(mockDocument.getNumberOfPages()).thenReturn(5);
         when(mockDocument.getPage(0)).thenReturn(mockPage1);
 
-        // Mock saving behavior
-        doAnswer(
-                        invocation -> {
-                            ByteArrayOutputStream baos = invocation.getArgument(0);
-                            baos.write("mocked pdf content".getBytes());
+        lenient()
+                .doAnswer(
+                        inv -> {
+                            File f = inv.getArgument(0);
+                            java.nio.file.Files.write(f.toPath(), "mock pdf".getBytes());
                             return null;
                         })
                 .when(mockDocument)
-                .save(any(ByteArrayOutputStream.class));
+                .save(any(File.class));
 
         // When
-        ResponseEntity<byte[]> result = editTableOfContentsController.editTableOfContents(request);
+        ResponseEntity<StreamingResponseBody> result =
+                editTableOfContentsController.editTableOfContents(request);
 
         // Then
         assertNotNull(result);
@@ -289,17 +308,19 @@ class EditTableOfContentsControllerTest {
         when(mockDocument.getPage(0)).thenReturn(mockPage1);
         when(mockDocument.getPage(1)).thenReturn(mockPage2);
 
-        doAnswer(
-                        invocation -> {
-                            ByteArrayOutputStream baos = invocation.getArgument(0);
-                            baos.write("mocked pdf content".getBytes());
+        lenient()
+                .doAnswer(
+                        inv -> {
+                            File f = inv.getArgument(0);
+                            java.nio.file.Files.write(f.toPath(), "mock pdf".getBytes());
                             return null;
                         })
                 .when(mockDocument)
-                .save(any(ByteArrayOutputStream.class));
+                .save(any(File.class));
 
         // When
-        ResponseEntity<byte[]> result = editTableOfContentsController.editTableOfContents(request);
+        ResponseEntity<StreamingResponseBody> result =
+                editTableOfContentsController.editTableOfContents(request);
 
         // Then
         assertNotNull(result);
@@ -341,17 +362,19 @@ class EditTableOfContentsControllerTest {
         when(mockDocument.getPage(0)).thenReturn(mockPage1); // For negative page number
         when(mockDocument.getPage(4)).thenReturn(mockPage2); // For page number exceeding bounds
 
-        doAnswer(
-                        invocation -> {
-                            ByteArrayOutputStream baos = invocation.getArgument(0);
-                            baos.write("mocked pdf content".getBytes());
+        lenient()
+                .doAnswer(
+                        inv -> {
+                            File f = inv.getArgument(0);
+                            java.nio.file.Files.write(f.toPath(), "mock pdf".getBytes());
                             return null;
                         })
                 .when(mockDocument)
-                .save(any(ByteArrayOutputStream.class));
+                .save(any(File.class));
 
         // When
-        ResponseEntity<byte[]> result = editTableOfContentsController.editTableOfContents(request);
+        ResponseEntity<StreamingResponseBody> result =
+                editTableOfContentsController.editTableOfContents(request);
 
         // Then
         assertNotNull(result);
diff --git a/app/core/src/test/java/stirling/software/SPDF/controller/api/MultiPageLayoutControllerTest.java b/app/core/src/test/java/stirling/software/SPDF/controller/api/MultiPageLayoutControllerTest.java
index 0a1f3bc3b1..28276a3f39 100644
--- a/app/core/src/test/java/stirling/software/SPDF/controller/api/MultiPageLayoutControllerTest.java
+++ b/app/core/src/test/java/stirling/software/SPDF/controller/api/MultiPageLayoutControllerTest.java
@@ -1,5 +1,12 @@
 package stirling.software.SPDF.controller.api;
 
+import static org.mockito.ArgumentMatchers.anyString;
+import static org.mockito.Mockito.lenient;
+import static org.mockito.Mockito.mock;
+
+import java.io.File;
+import java.nio.file.Files;
+
 import org.apache.pdfbox.pdmodel.PDDocument;
 import org.apache.pdfbox.pdmodel.PDPage;
 import org.junit.jupiter.api.Assertions;
@@ -15,14 +22,28 @@ import org.springframework.http.HttpStatus;
 import org.springframework.http.MediaType;
 import org.springframework.http.ResponseEntity;
 import org.springframework.mock.web.MockMultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import stirling.software.SPDF.model.api.general.MergeMultiplePagesRequest;
 import stirling.software.common.service.CustomPDFDocumentFactory;
+import stirling.software.common.util.TempFile;
+import stirling.software.common.util.TempFileManager;
 
 @ExtendWith(MockitoExtension.class)
 class MultiPageLayoutControllerTest {
+    private static ResponseEntity<StreamingResponseBody> streamingOk(byte[] bytes) {
+        return ResponseEntity.ok(out -> out.write(bytes));
+    }
+
+    private static byte[] drainBody(ResponseEntity<StreamingResponseBody> response)
+            throws java.io.IOException {
+        java.io.ByteArrayOutputStream baos = new java.io.ByteArrayOutputStream();
+        response.getBody().writeTo(baos);
+        return baos.toByteArray();
+    }
 
     @Mock private CustomPDFDocumentFactory pdfDocumentFactory;
+    @Mock private TempFileManager tempFileManager;
 
     @InjectMocks private MultiPageLayoutController controller;
 
@@ -30,7 +51,19 @@ class MultiPageLayoutControllerTest {
     private MockMultipartFile fileNoExt;
 
     @BeforeEach
-    void setup() {
+    void setup() throws Exception {
+        lenient()
+                .when(tempFileManager.createManagedTempFile(anyString()))
+                .thenAnswer(
+                        inv -> {
+                            File f =
+                                    Files.createTempFile("test", inv.<String>getArgument(0))
+                                            .toFile();
+                            TempFile tf = mock(TempFile.class);
+                            lenient().when(tf.getFile()).thenReturn(f);
+                            lenient().when(tf.getPath()).thenReturn(f.toPath());
+                            return tf;
+                        });
         fileWithExt =
                 new MockMultipartFile(
                         "fileInput", "test.pdf", "application/pdf", new byte[] {1, 2, 3});
@@ -64,11 +97,11 @@ class MultiPageLayoutControllerTest {
         req.setAddBorder(Boolean.FALSE);
         req.setFileInput(fileWithExt);
 
-        ResponseEntity<byte[]> resp = controller.mergeMultiplePagesIntoOne(req);
+        ResponseEntity<StreamingResponseBody> resp = controller.mergeMultiplePagesIntoOne(req);
         Assertions.assertEquals(HttpStatus.OK, resp.getStatusCode());
         Assertions.assertEquals(MediaType.APPLICATION_PDF, resp.getHeaders().getContentType());
         Assertions.assertNotNull(resp.getBody());
-        Assertions.assertTrue(resp.getBody().length > 0);
+        Assertions.assertTrue(drainBody(resp).length > 0);
         Assertions.assertEquals(
                 "test_multi_page_layout.pdf",
                 resp.getHeaders().getContentDisposition().getFilename());
@@ -89,11 +122,11 @@ class MultiPageLayoutControllerTest {
         req.setAddBorder(Boolean.TRUE);
         req.setFileInput(fileWithExt);
 
-        ResponseEntity<byte[]> resp = controller.mergeMultiplePagesIntoOne(req);
+        ResponseEntity<StreamingResponseBody> resp = controller.mergeMultiplePagesIntoOne(req);
         Assertions.assertEquals(HttpStatus.OK, resp.getStatusCode());
         Assertions.assertEquals(MediaType.APPLICATION_PDF, resp.getHeaders().getContentType());
         Assertions.assertNotNull(resp.getBody());
-        Assertions.assertTrue(resp.getBody().length > 0);
+        Assertions.assertTrue(drainBody(resp).length > 0);
     }
 
     @Test
@@ -112,7 +145,7 @@ class MultiPageLayoutControllerTest {
         req.setAddBorder(Boolean.TRUE);
         req.setFileInput(fileNoExt);
 
-        ResponseEntity<byte[]> resp = controller.mergeMultiplePagesIntoOne(req);
+        ResponseEntity<StreamingResponseBody> resp = controller.mergeMultiplePagesIntoOne(req);
         Assertions.assertEquals(
                 "name_multi_page_layout.pdf",
                 resp.getHeaders().getContentDisposition().getFilename());
diff --git a/app/core/src/test/java/stirling/software/SPDF/controller/api/PdfOverlayControllerTest.java b/app/core/src/test/java/stirling/software/SPDF/controller/api/PdfOverlayControllerTest.java
index 0983a0bb7c..66b3eebff5 100644
--- a/app/core/src/test/java/stirling/software/SPDF/controller/api/PdfOverlayControllerTest.java
+++ b/app/core/src/test/java/stirling/software/SPDF/controller/api/PdfOverlayControllerTest.java
@@ -2,16 +2,22 @@ package stirling.software.SPDF.controller.api;
 
 import static org.junit.jupiter.api.Assertions.*;
 import static org.mockito.ArgumentMatchers.any;
+import static org.mockito.ArgumentMatchers.anyString;
+import static org.mockito.Mockito.lenient;
+import static org.mockito.Mockito.mock;
 import static org.mockito.Mockito.when;
 
 import java.io.ByteArrayOutputStream;
+import java.io.File;
 import java.io.IOException;
+import java.nio.file.Files;
 import java.nio.file.Path;
 
 import org.apache.pdfbox.Loader;
 import org.apache.pdfbox.pdmodel.PDDocument;
 import org.apache.pdfbox.pdmodel.PDPage;
 import org.apache.pdfbox.pdmodel.common.PDRectangle;
+import org.junit.jupiter.api.BeforeEach;
 import org.junit.jupiter.api.DisplayName;
 import org.junit.jupiter.api.Test;
 import org.junit.jupiter.api.extension.ExtendWith;
@@ -24,17 +30,47 @@ import org.springframework.http.MediaType;
 import org.springframework.http.ResponseEntity;
 import org.springframework.mock.web.MockMultipartFile;
 import org.springframework.web.multipart.MultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import stirling.software.SPDF.model.api.general.OverlayPdfsRequest;
 import stirling.software.common.service.CustomPDFDocumentFactory;
+import stirling.software.common.util.TempFile;
+import stirling.software.common.util.TempFileManager;
 
 @ExtendWith(MockitoExtension.class)
 class PdfOverlayControllerTest {
+    private static ResponseEntity<StreamingResponseBody> streamingOk(byte[] bytes) {
+        return ResponseEntity.ok(out -> out.write(bytes));
+    }
+
+    private static byte[] drainBody(ResponseEntity<StreamingResponseBody> response)
+            throws java.io.IOException {
+        java.io.ByteArrayOutputStream baos = new java.io.ByteArrayOutputStream();
+        response.getBody().writeTo(baos);
+        return baos.toByteArray();
+    }
 
     @TempDir Path tempDir;
     @Mock private CustomPDFDocumentFactory pdfDocumentFactory;
+    @Mock private TempFileManager tempFileManager;
     @InjectMocks private PdfOverlayController controller;
 
+    @BeforeEach
+    void setUp() throws Exception {
+        lenient()
+                .when(tempFileManager.createManagedTempFile(anyString()))
+                .thenAnswer(
+                        inv -> {
+                            File f =
+                                    Files.createTempFile("test", inv.<String>getArgument(0))
+                                            .toFile();
+                            TempFile tf = mock(TempFile.class);
+                            lenient().when(tf.getFile()).thenReturn(f);
+                            lenient().when(tf.getPath()).thenReturn(f.toPath());
+                            return tf;
+                        });
+    }
+
     private byte[] createPdf(int numPages) throws IOException {
         try (PDDocument doc = new PDDocument()) {
             for (int i = 0; i < numPages; i++) {
@@ -71,12 +107,12 @@ class PdfOverlayControllerTest {
         when(pdfDocumentFactory.load(any(MultipartFile.class)))
                 .thenAnswer(inv -> Loader.loadPDF(((MultipartFile) inv.getArgument(0)).getBytes()));
 
-        ResponseEntity<byte[]> response = controller.overlayPdfs(request);
+        ResponseEntity<StreamingResponseBody> response = controller.overlayPdfs(request);
 
         assertNotNull(response);
         assertEquals(HttpStatus.OK, response.getStatusCode());
         assertNotNull(response.getBody());
-        assertTrue(response.getBody().length > 0);
+        assertTrue(drainBody(response).length > 0);
     }
 
     @Test
@@ -105,7 +141,7 @@ class PdfOverlayControllerTest {
         when(pdfDocumentFactory.load(any(MultipartFile.class)))
                 .thenAnswer(inv -> Loader.loadPDF(((MultipartFile) inv.getArgument(0)).getBytes()));
 
-        ResponseEntity<byte[]> response = controller.overlayPdfs(request);
+        ResponseEntity<StreamingResponseBody> response = controller.overlayPdfs(request);
 
         assertNotNull(response);
         assertEquals(HttpStatus.OK, response.getStatusCode());
@@ -137,7 +173,7 @@ class PdfOverlayControllerTest {
         when(pdfDocumentFactory.load(any(MultipartFile.class)))
                 .thenAnswer(inv -> Loader.loadPDF(((MultipartFile) inv.getArgument(0)).getBytes()));
 
-        ResponseEntity<byte[]> response = controller.overlayPdfs(request);
+        ResponseEntity<StreamingResponseBody> response = controller.overlayPdfs(request);
 
         assertNotNull(response);
         assertEquals(HttpStatus.OK, response.getStatusCode());
@@ -168,7 +204,7 @@ class PdfOverlayControllerTest {
         when(pdfDocumentFactory.load(any(MultipartFile.class)))
                 .thenAnswer(inv -> Loader.loadPDF(((MultipartFile) inv.getArgument(0)).getBytes()));
 
-        ResponseEntity<byte[]> response = controller.overlayPdfs(request);
+        ResponseEntity<StreamingResponseBody> response = controller.overlayPdfs(request);
 
         assertNotNull(response);
         assertEquals(HttpStatus.OK, response.getStatusCode());
@@ -258,7 +294,7 @@ class PdfOverlayControllerTest {
         when(pdfDocumentFactory.load(any(MultipartFile.class)))
                 .thenAnswer(inv -> Loader.loadPDF(((MultipartFile) inv.getArgument(0)).getBytes()));
 
-        ResponseEntity<byte[]> response = controller.overlayPdfs(request);
+        ResponseEntity<StreamingResponseBody> response = controller.overlayPdfs(request);
 
         assertNotNull(response);
         assertEquals(HttpStatus.OK, response.getStatusCode());
@@ -291,7 +327,7 @@ class PdfOverlayControllerTest {
         when(pdfDocumentFactory.load(any(MultipartFile.class)))
                 .thenAnswer(inv -> Loader.loadPDF(((MultipartFile) inv.getArgument(0)).getBytes()));
 
-        ResponseEntity<byte[]> response = controller.overlayPdfs(request);
+        ResponseEntity<StreamingResponseBody> response = controller.overlayPdfs(request);
 
         assertNotNull(response);
         assertEquals(HttpStatus.OK, response.getStatusCode());
diff --git a/app/core/src/test/java/stirling/software/SPDF/controller/api/RearrangePagesPDFControllerTest.java b/app/core/src/test/java/stirling/software/SPDF/controller/api/RearrangePagesPDFControllerTest.java
index eaec8e9d19..81f85d60a2 100644
--- a/app/core/src/test/java/stirling/software/SPDF/controller/api/RearrangePagesPDFControllerTest.java
+++ b/app/core/src/test/java/stirling/software/SPDF/controller/api/RearrangePagesPDFControllerTest.java
@@ -1,12 +1,16 @@
 package stirling.software.SPDF.controller.api;
 
 import static org.junit.jupiter.api.Assertions.*;
+import static org.mockito.ArgumentMatchers.anyString;
 import static org.mockito.Mockito.*;
 
+import java.io.File;
 import java.io.IOException;
+import java.nio.file.Files;
 
 import org.apache.pdfbox.pdmodel.PDDocument;
 import org.apache.pdfbox.pdmodel.PDPage;
+import org.junit.jupiter.api.BeforeEach;
 import org.junit.jupiter.api.Test;
 import org.junit.jupiter.api.extension.ExtendWith;
 import org.mockito.InjectMocks;
@@ -15,18 +19,38 @@ import org.mockito.junit.jupiter.MockitoExtension;
 import org.springframework.http.MediaType;
 import org.springframework.http.ResponseEntity;
 import org.springframework.mock.web.MockMultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import stirling.software.SPDF.model.api.PDFWithPageNums;
 import stirling.software.SPDF.model.api.general.RearrangePagesRequest;
 import stirling.software.common.service.CustomPDFDocumentFactory;
+import stirling.software.common.util.TempFile;
+import stirling.software.common.util.TempFileManager;
 
 @ExtendWith(MockitoExtension.class)
 class RearrangePagesPDFControllerTest {
 
     @Mock private CustomPDFDocumentFactory pdfDocumentFactory;
+    @Mock private TempFileManager tempFileManager;
 
     @InjectMocks private RearrangePagesPDFController controller;
 
+    @BeforeEach
+    void setUp() throws Exception {
+        lenient()
+                .when(tempFileManager.createManagedTempFile(anyString()))
+                .thenAnswer(
+                        inv -> {
+                            File f =
+                                    Files.createTempFile("test", inv.<String>getArgument(0))
+                                            .toFile();
+                            TempFile tf = mock(TempFile.class);
+                            lenient().when(tf.getFile()).thenReturn(f);
+                            lenient().when(tf.getPath()).thenReturn(f.toPath());
+                            return tf;
+                        });
+    }
+
     private MockMultipartFile createMockPdf() {
         return new MockMultipartFile(
                 "fileInput", "test.pdf", MediaType.APPLICATION_PDF_VALUE, new byte[] {1, 2, 3});
@@ -43,7 +67,7 @@ class RearrangePagesPDFControllerTest {
         when(pdfDocumentFactory.load(file)).thenReturn(mockDoc);
         when(mockDoc.getNumberOfPages()).thenReturn(5);
 
-        ResponseEntity<byte[]> response = controller.deletePages(request);
+        ResponseEntity<StreamingResponseBody> response = controller.deletePages(request);
 
         assertNotNull(response);
         assertEquals(200, response.getStatusCode().value());
@@ -73,7 +97,7 @@ class RearrangePagesPDFControllerTest {
         when(pdfDocumentFactory.createNewDocumentBasedOnOldDocument(mockDoc))
                 .thenReturn(mockNewDoc);
 
-        ResponseEntity<byte[]> response = controller.rearrangePages(request);
+        ResponseEntity<StreamingResponseBody> response = controller.rearrangePages(request);
 
         assertNotNull(response);
         assertEquals(200, response.getStatusCode().value());
@@ -103,7 +127,7 @@ class RearrangePagesPDFControllerTest {
         when(pdfDocumentFactory.createNewDocumentBasedOnOldDocument(mockDoc))
                 .thenReturn(mockNewDoc);
 
-        ResponseEntity<byte[]> response = controller.rearrangePages(request);
+        ResponseEntity<StreamingResponseBody> response = controller.rearrangePages(request);
 
         assertNotNull(response);
         verify(mockNewDoc).addPage(page1);
@@ -131,7 +155,7 @@ class RearrangePagesPDFControllerTest {
         when(pdfDocumentFactory.createNewDocumentBasedOnOldDocument(mockDoc))
                 .thenReturn(mockNewDoc);
 
-        ResponseEntity<byte[]> response = controller.rearrangePages(request);
+        ResponseEntity<StreamingResponseBody> response = controller.rearrangePages(request);
 
         assertNotNull(response);
         verify(mockNewDoc).addPage(page0);
@@ -157,7 +181,7 @@ class RearrangePagesPDFControllerTest {
         when(pdfDocumentFactory.createNewDocumentBasedOnOldDocument(mockDoc))
                 .thenReturn(mockNewDoc);
 
-        ResponseEntity<byte[]> response = controller.rearrangePages(request);
+        ResponseEntity<StreamingResponseBody> response = controller.rearrangePages(request);
 
         assertNotNull(response);
         assertEquals(200, response.getStatusCode().value());
@@ -184,7 +208,7 @@ class RearrangePagesPDFControllerTest {
         when(pdfDocumentFactory.createNewDocumentBasedOnOldDocument(mockDoc))
                 .thenReturn(mockNewDoc);
 
-        ResponseEntity<byte[]> response = controller.rearrangePages(request);
+        ResponseEntity<StreamingResponseBody> response = controller.rearrangePages(request);
 
         assertNotNull(response);
         assertEquals(200, response.getStatusCode().value());
@@ -208,7 +232,7 @@ class RearrangePagesPDFControllerTest {
         when(pdfDocumentFactory.createNewDocumentBasedOnOldDocument(mockDoc))
                 .thenReturn(mockNewDoc);
 
-        ResponseEntity<byte[]> response = controller.rearrangePages(request);
+        ResponseEntity<StreamingResponseBody> response = controller.rearrangePages(request);
 
         assertNotNull(response);
         assertEquals(200, response.getStatusCode().value());
@@ -232,7 +256,7 @@ class RearrangePagesPDFControllerTest {
         when(pdfDocumentFactory.createNewDocumentBasedOnOldDocument(mockDoc))
                 .thenReturn(mockNewDoc);
 
-        ResponseEntity<byte[]> response = controller.rearrangePages(request);
+        ResponseEntity<StreamingResponseBody> response = controller.rearrangePages(request);
 
         assertNotNull(response);
         assertEquals(200, response.getStatusCode().value());
@@ -260,7 +284,7 @@ class RearrangePagesPDFControllerTest {
         when(pdfDocumentFactory.createNewDocumentBasedOnOldDocument(mockDoc))
                 .thenReturn(mockNewDoc);
 
-        ResponseEntity<byte[]> response = controller.rearrangePages(request);
+        ResponseEntity<StreamingResponseBody> response = controller.rearrangePages(request);
 
         assertNotNull(response);
         assertEquals(200, response.getStatusCode().value());
@@ -284,7 +308,7 @@ class RearrangePagesPDFControllerTest {
         when(pdfDocumentFactory.createNewDocumentBasedOnOldDocument(mockDoc))
                 .thenReturn(mockNewDoc);
 
-        ResponseEntity<byte[]> response = controller.rearrangePages(request);
+        ResponseEntity<StreamingResponseBody> response = controller.rearrangePages(request);
 
         assertNotNull(response);
         // 2 pages * 3 duplicates = 6 addPage calls
@@ -309,7 +333,7 @@ class RearrangePagesPDFControllerTest {
         when(pdfDocumentFactory.createNewDocumentBasedOnOldDocument(mockDoc))
                 .thenReturn(mockNewDoc);
 
-        ResponseEntity<byte[]> response = controller.rearrangePages(request);
+        ResponseEntity<StreamingResponseBody> response = controller.rearrangePages(request);
 
         assertNotNull(response);
         assertEquals(200, response.getStatusCode().value());
diff --git a/app/core/src/test/java/stirling/software/SPDF/controller/api/RotationControllerTest.java b/app/core/src/test/java/stirling/software/SPDF/controller/api/RotationControllerTest.java
index ecdafc09a9..bc5f60977f 100644
--- a/app/core/src/test/java/stirling/software/SPDF/controller/api/RotationControllerTest.java
+++ b/app/core/src/test/java/stirling/software/SPDF/controller/api/RotationControllerTest.java
@@ -1,15 +1,20 @@
 package stirling.software.SPDF.controller.api;
 
 import static org.junit.jupiter.api.Assertions.*;
+import static org.mockito.ArgumentMatchers.anyString;
+import static org.mockito.Mockito.lenient;
 import static org.mockito.Mockito.mock;
 import static org.mockito.Mockito.verify;
 import static org.mockito.Mockito.when;
 
+import java.io.File;
 import java.io.IOException;
+import java.nio.file.Files;
 
 import org.apache.pdfbox.pdmodel.PDDocument;
 import org.apache.pdfbox.pdmodel.PDPage;
 import org.apache.pdfbox.pdmodel.PDPageTree;
+import org.junit.jupiter.api.BeforeEach;
 import org.junit.jupiter.api.Test;
 import org.junit.jupiter.api.extension.ExtendWith;
 import org.mockito.InjectMocks;
@@ -18,17 +23,37 @@ import org.mockito.junit.jupiter.MockitoExtension;
 import org.springframework.http.MediaType;
 import org.springframework.http.ResponseEntity;
 import org.springframework.mock.web.MockMultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import stirling.software.SPDF.model.api.general.RotatePDFRequest;
 import stirling.software.common.service.CustomPDFDocumentFactory;
+import stirling.software.common.util.TempFile;
+import stirling.software.common.util.TempFileManager;
 
 @ExtendWith(MockitoExtension.class)
 public class RotationControllerTest {
 
     @Mock private CustomPDFDocumentFactory pdfDocumentFactory;
+    @Mock private TempFileManager tempFileManager;
 
     @InjectMocks private RotationController rotationController;
 
+    @BeforeEach
+    void setUp() throws Exception {
+        lenient()
+                .when(tempFileManager.createManagedTempFile(anyString()))
+                .thenAnswer(
+                        inv -> {
+                            File f =
+                                    Files.createTempFile("test", inv.<String>getArgument(0))
+                                            .toFile();
+                            TempFile tf = mock(TempFile.class);
+                            lenient().when(tf.getFile()).thenReturn(f);
+                            lenient().when(tf.getPath()).thenReturn(f.toPath());
+                            return tf;
+                        });
+    }
+
     @Test
     public void testRotatePDF() throws IOException {
         // Create a mock file
@@ -50,7 +75,7 @@ public class RotationControllerTest {
         when(mockPage.getRotation()).thenReturn(0);
 
         // Act
-        ResponseEntity<byte[]> response = rotationController.rotatePDF(request);
+        ResponseEntity<StreamingResponseBody> response = rotationController.rotatePDF(request);
 
         // Assert
         verify(mockPage).setRotation(90);
diff --git a/app/core/src/test/java/stirling/software/SPDF/controller/api/ScalePagesControllerTest.java b/app/core/src/test/java/stirling/software/SPDF/controller/api/ScalePagesControllerTest.java
index 41574bf3aa..4fee57b5d6 100644
--- a/app/core/src/test/java/stirling/software/SPDF/controller/api/ScalePagesControllerTest.java
+++ b/app/core/src/test/java/stirling/software/SPDF/controller/api/ScalePagesControllerTest.java
@@ -2,8 +2,10 @@ package stirling.software.SPDF.controller.api;
 
 import static org.junit.jupiter.api.Assertions.*;
 import static org.mockito.ArgumentMatchers.any;
+import static org.mockito.ArgumentMatchers.anyString;
 import static org.mockito.Mockito.*;
 
+import java.io.File;
 import java.io.IOException;
 import java.nio.file.Files;
 import java.nio.file.Path;
@@ -11,6 +13,7 @@ import java.nio.file.Path;
 import org.apache.pdfbox.pdmodel.PDDocument;
 import org.apache.pdfbox.pdmodel.PDPage;
 import org.apache.pdfbox.pdmodel.common.PDRectangle;
+import org.junit.jupiter.api.BeforeEach;
 import org.junit.jupiter.api.Test;
 import org.junit.jupiter.api.extension.ExtendWith;
 import org.junit.jupiter.api.io.TempDir;
@@ -21,17 +24,47 @@ import org.springframework.http.MediaType;
 import org.springframework.http.ResponseEntity;
 import org.springframework.mock.web.MockMultipartFile;
 import org.springframework.web.multipart.MultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import stirling.software.SPDF.model.api.general.ScalePagesRequest;
 import stirling.software.common.service.CustomPDFDocumentFactory;
+import stirling.software.common.util.TempFile;
+import stirling.software.common.util.TempFileManager;
 
 @ExtendWith(MockitoExtension.class)
 class ScalePagesControllerTest {
+    private static ResponseEntity<StreamingResponseBody> streamingOk(byte[] bytes) {
+        return ResponseEntity.ok(out -> out.write(bytes));
+    }
+
+    private static byte[] drainBody(ResponseEntity<StreamingResponseBody> response)
+            throws java.io.IOException {
+        java.io.ByteArrayOutputStream baos = new java.io.ByteArrayOutputStream();
+        response.getBody().writeTo(baos);
+        return baos.toByteArray();
+    }
 
     @TempDir Path tempDir;
     @Mock private CustomPDFDocumentFactory pdfDocumentFactory;
+    @Mock private TempFileManager tempFileManager;
     @InjectMocks private ScalePagesController controller;
 
+    @BeforeEach
+    void setUp() throws Exception {
+        lenient()
+                .when(tempFileManager.createManagedTempFile(anyString()))
+                .thenAnswer(
+                        inv -> {
+                            File f =
+                                    Files.createTempFile("test", inv.<String>getArgument(0))
+                                            .toFile();
+                            TempFile tf = mock(TempFile.class);
+                            lenient().when(tf.getFile()).thenReturn(f);
+                            lenient().when(tf.getPath()).thenReturn(f.toPath());
+                            return tf;
+                        });
+    }
+
     private byte[] createRealPdf(PDRectangle pageSize, int numPages) throws IOException {
         try (PDDocument doc = new PDDocument()) {
             for (int i = 0; i < numPages; i++) {
@@ -68,12 +101,12 @@ class ScalePagesControllerTest {
 
         setupFactory();
 
-        ResponseEntity<byte[]> response = controller.scalePages(request);
+        ResponseEntity<StreamingResponseBody> response = controller.scalePages(request);
 
         assertNotNull(response);
         assertEquals(200, response.getStatusCode().value());
         assertNotNull(response.getBody());
-        assertTrue(response.getBody().length > 0);
+        assertTrue(drainBody(response).length > 0);
     }
 
     @Test
@@ -90,7 +123,7 @@ class ScalePagesControllerTest {
 
         setupFactory();
 
-        ResponseEntity<byte[]> response = controller.scalePages(request);
+        ResponseEntity<StreamingResponseBody> response = controller.scalePages(request);
 
         assertNotNull(response);
         assertEquals(200, response.getStatusCode().value());
@@ -110,7 +143,7 @@ class ScalePagesControllerTest {
 
         setupFactory();
 
-        ResponseEntity<byte[]> response = controller.scalePages(request);
+        ResponseEntity<StreamingResponseBody> response = controller.scalePages(request);
 
         assertNotNull(response);
         assertEquals(200, response.getStatusCode().value());
@@ -130,7 +163,7 @@ class ScalePagesControllerTest {
 
         setupFactory();
 
-        ResponseEntity<byte[]> response = controller.scalePages(request);
+        ResponseEntity<StreamingResponseBody> response = controller.scalePages(request);
 
         assertNotNull(response);
         assertEquals(200, response.getStatusCode().value());
@@ -150,7 +183,7 @@ class ScalePagesControllerTest {
 
         setupFactory();
 
-        ResponseEntity<byte[]> response = controller.scalePages(request);
+        ResponseEntity<StreamingResponseBody> response = controller.scalePages(request);
 
         assertNotNull(response);
         assertEquals(200, response.getStatusCode().value());
@@ -187,7 +220,7 @@ class ScalePagesControllerTest {
 
         setupFactory();
 
-        ResponseEntity<byte[]> response = controller.scalePages(request);
+        ResponseEntity<StreamingResponseBody> response = controller.scalePages(request);
 
         assertNotNull(response);
         assertEquals(200, response.getStatusCode().value());
@@ -207,7 +240,7 @@ class ScalePagesControllerTest {
 
         setupFactory();
 
-        ResponseEntity<byte[]> response = controller.scalePages(request);
+        ResponseEntity<StreamingResponseBody> response = controller.scalePages(request);
 
         assertNotNull(response);
         assertEquals(200, response.getStatusCode().value());
@@ -248,7 +281,7 @@ class ScalePagesControllerTest {
 
         setupFactory();
 
-        ResponseEntity<byte[]> response = controller.scalePages(request);
+        ResponseEntity<StreamingResponseBody> response = controller.scalePages(request);
 
         assertNotNull(response);
         assertEquals(200, response.getStatusCode().value());
diff --git a/app/core/src/test/java/stirling/software/SPDF/controller/api/SplitPdfBySectionsControllerTest.java b/app/core/src/test/java/stirling/software/SPDF/controller/api/SplitPdfBySectionsControllerTest.java
index 49330eacad..2cada36a9a 100644
--- a/app/core/src/test/java/stirling/software/SPDF/controller/api/SplitPdfBySectionsControllerTest.java
+++ b/app/core/src/test/java/stirling/software/SPDF/controller/api/SplitPdfBySectionsControllerTest.java
@@ -4,8 +4,11 @@ import static org.assertj.core.api.Assertions.assertThat;
 import static org.junit.jupiter.api.Assertions.assertThrows;
 import static org.mockito.ArgumentMatchers.any;
 import static org.mockito.ArgumentMatchers.anyString;
+import static org.mockito.Mockito.lenient;
+import static org.mockito.Mockito.mock;
 import static org.mockito.Mockito.when;
 
+import java.io.File;
 import java.io.IOException;
 import java.nio.file.Files;
 import java.nio.file.Path;
@@ -31,6 +34,7 @@ import org.springframework.web.multipart.MultipartFile;
 
 import stirling.software.SPDF.model.api.SplitPdfBySectionsRequest;
 import stirling.software.common.service.CustomPDFDocumentFactory;
+import stirling.software.common.util.TempFile;
 import stirling.software.common.util.TempFileManager;
 
 @ExtendWith(MockitoExtension.class)
@@ -44,6 +48,18 @@ class SplitPdfBySectionsControllerTest {
 
     @BeforeEach
     void setUp() throws IOException {
+        lenient()
+                .when(tempFileManager.createManagedTempFile(anyString()))
+                .thenAnswer(
+                        inv -> {
+                            File f =
+                                    Files.createTempFile("test", inv.<String>getArgument(0))
+                                            .toFile();
+                            TempFile tf = mock(TempFile.class);
+                            lenient().when(tf.getFile()).thenReturn(f);
+                            lenient().when(tf.getPath()).thenReturn(f.toPath());
+                            return tf;
+                        });
         when(tempFileManager.createTempFile(anyString()))
                 .thenAnswer(
                         inv -> {
diff --git a/app/core/src/test/java/stirling/software/SPDF/controller/api/converters/ConvertEbookToPDFControllerTest.java b/app/core/src/test/java/stirling/software/SPDF/controller/api/converters/ConvertEbookToPDFControllerTest.java
index 95f0de648d..be2295eb08 100644
--- a/app/core/src/test/java/stirling/software/SPDF/controller/api/converters/ConvertEbookToPDFControllerTest.java
+++ b/app/core/src/test/java/stirling/software/SPDF/controller/api/converters/ConvertEbookToPDFControllerTest.java
@@ -5,7 +5,10 @@ import static org.junit.jupiter.api.Assertions.assertFalse;
 import static org.junit.jupiter.api.Assertions.assertSame;
 import static org.junit.jupiter.api.Assertions.assertThrows;
 import static org.mockito.ArgumentMatchers.any;
+import static org.mockito.ArgumentMatchers.anyString;
 import static org.mockito.ArgumentMatchers.eq;
+import static org.mockito.Mockito.lenient;
+import static org.mockito.Mockito.mock;
 import static org.mockito.Mockito.when;
 
 import java.io.File;
@@ -19,6 +22,7 @@ import java.util.concurrent.atomic.AtomicReference;
 import java.util.stream.Stream;
 
 import org.apache.pdfbox.pdmodel.PDDocument;
+import org.junit.jupiter.api.BeforeEach;
 import org.junit.jupiter.api.Test;
 import org.junit.jupiter.api.extension.ExtendWith;
 import org.mockito.ArgumentCaptor;
@@ -29,6 +33,7 @@ import org.mockito.Mockito;
 import org.mockito.junit.jupiter.MockitoExtension;
 import org.springframework.http.ResponseEntity;
 import org.springframework.mock.web.MockMultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import stirling.software.SPDF.config.EndpointConfiguration;
 import stirling.software.SPDF.model.api.converters.ConvertEbookToPdfRequest;
@@ -37,11 +42,22 @@ import stirling.software.common.util.GeneralUtils;
 import stirling.software.common.util.ProcessExecutor;
 import stirling.software.common.util.ProcessExecutor.ProcessExecutorResult;
 import stirling.software.common.util.ProcessExecutor.Processes;
+import stirling.software.common.util.TempFile;
 import stirling.software.common.util.TempFileManager;
 import stirling.software.common.util.WebResponseUtils;
 
 @ExtendWith(MockitoExtension.class)
 class ConvertEbookToPDFControllerTest {
+    private static ResponseEntity<StreamingResponseBody> streamingOk(byte[] bytes) {
+        return ResponseEntity.ok(out -> out.write(bytes));
+    }
+
+    private static byte[] drainBody(ResponseEntity<StreamingResponseBody> response)
+            throws java.io.IOException {
+        java.io.ByteArrayOutputStream baos = new java.io.ByteArrayOutputStream();
+        response.getBody().writeTo(baos);
+        return baos.toByteArray();
+    }
 
     @Mock private CustomPDFDocumentFactory pdfDocumentFactory;
     @Mock private TempFileManager tempFileManager;
@@ -49,6 +65,22 @@ class ConvertEbookToPDFControllerTest {
 
     @InjectMocks private ConvertEbookToPDFController controller;
 
+    @BeforeEach
+    void setUp() throws Exception {
+        lenient()
+                .when(tempFileManager.createManagedTempFile(anyString()))
+                .thenAnswer(
+                        inv -> {
+                            File f =
+                                    Files.createTempFile("test", inv.<String>getArgument(0))
+                                            .toFile();
+                            TempFile tf = mock(TempFile.class);
+                            lenient().when(tf.getFile()).thenReturn(f);
+                            lenient().when(tf.getPath()).thenReturn(f.toPath());
+                            return tf;
+                        });
+    }
+
     @Test
     void convertEbookToPdf_buildsCalibreCommandAndCleansUp() throws Exception {
         when(endpointConfiguration.isGroupEnabled("Calibre")).thenReturn(true);
@@ -113,16 +145,14 @@ class ConvertEbookToPDFControllerTest {
                                 return execResult;
                             });
 
-            ResponseEntity<byte[]> expectedResponse = ResponseEntity.ok("result".getBytes());
-            wr.when(
-                            () ->
-                                    WebResponseUtils.pdfDocToWebResponse(
-                                            mockDocument, "ebook_convertedToPDF.pdf"))
+            ResponseEntity<StreamingResponseBody> expectedResponse =
+                    streamingOk("result".getBytes());
+            wr.when(() -> WebResponseUtils.pdfFileToWebResponse(any(TempFile.class), anyString()))
                     .thenReturn(expectedResponse);
             gu.when(() -> GeneralUtils.generateFilename("ebook.epub", "_convertedToPDF.pdf"))
                     .thenReturn("ebook_convertedToPDF.pdf");
 
-            ResponseEntity<byte[]> response = controller.convertEbookToPdf(request);
+            ResponseEntity<StreamingResponseBody> response = controller.convertEbookToPdf(request);
 
             assertSame(expectedResponse, response);
 
@@ -232,14 +262,11 @@ class ConvertEbookToPDFControllerTest {
             gu.when(() -> GeneralUtils.optimizePdfWithGhostscript(Mockito.any(byte[].class)))
                     .thenReturn(optimizedBytes);
 
-            ResponseEntity<byte[]> expectedResponse = ResponseEntity.ok(optimizedBytes);
-            wr.when(
-                            () ->
-                                    WebResponseUtils.bytesToWebResponse(
-                                            optimizedBytes, "ebook_convertedToPDF.pdf"))
+            ResponseEntity<StreamingResponseBody> expectedResponse = streamingOk(optimizedBytes);
+            wr.when(() -> WebResponseUtils.pdfFileToWebResponse(any(TempFile.class), anyString()))
                     .thenReturn(expectedResponse);
 
-            ResponseEntity<byte[]> response = controller.convertEbookToPdf(request);
+            ResponseEntity<StreamingResponseBody> response = controller.convertEbookToPdf(request);
 
             assertSame(expectedResponse, response);
             gu.verify(() -> GeneralUtils.optimizePdfWithGhostscript(Mockito.any(byte[].class)));
diff --git a/app/core/src/test/java/stirling/software/SPDF/controller/api/converters/ConvertEmlToPDFTest.java b/app/core/src/test/java/stirling/software/SPDF/controller/api/converters/ConvertEmlToPDFTest.java
index 2a7d138577..7f4857d830 100644
--- a/app/core/src/test/java/stirling/software/SPDF/controller/api/converters/ConvertEmlToPDFTest.java
+++ b/app/core/src/test/java/stirling/software/SPDF/controller/api/converters/ConvertEmlToPDFTest.java
@@ -4,12 +4,18 @@ import static org.junit.jupiter.api.Assertions.assertArrayEquals;
 import static org.junit.jupiter.api.Assertions.assertEquals;
 import static org.junit.jupiter.api.Assertions.assertTrue;
 import static org.mockito.ArgumentMatchers.any;
+import static org.mockito.ArgumentMatchers.anyString;
 import static org.mockito.ArgumentMatchers.eq;
+import static org.mockito.Mockito.lenient;
+import static org.mockito.Mockito.mock;
 import static org.mockito.Mockito.when;
 
+import java.io.File;
 import java.io.IOException;
 import java.nio.charset.StandardCharsets;
+import java.nio.file.Files;
 
+import org.junit.jupiter.api.BeforeEach;
 import org.junit.jupiter.api.Test;
 import org.junit.jupiter.api.extension.ExtendWith;
 import org.mockito.InjectMocks;
@@ -21,17 +27,29 @@ import org.springframework.http.HttpStatus;
 import org.springframework.http.MediaType;
 import org.springframework.http.ResponseEntity;
 import org.springframework.mock.web.MockMultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import stirling.software.common.configuration.RuntimePathConfig;
 import stirling.software.common.model.api.converters.EmlToPdfRequest;
 import stirling.software.common.service.CustomPDFDocumentFactory;
 import stirling.software.common.util.CustomHtmlSanitizer;
 import stirling.software.common.util.EmlToPdf;
+import stirling.software.common.util.TempFile;
 import stirling.software.common.util.TempFileManager;
 import stirling.software.common.util.WebResponseUtils;
 
 @ExtendWith(MockitoExtension.class)
 class ConvertEmlToPDFTest {
+    private static ResponseEntity<StreamingResponseBody> streamingOk(byte[] bytes) {
+        return ResponseEntity.ok(out -> out.write(bytes));
+    }
+
+    private static byte[] drainBody(ResponseEntity<StreamingResponseBody> response)
+            throws java.io.IOException {
+        java.io.ByteArrayOutputStream baos = new java.io.ByteArrayOutputStream();
+        response.getBody().writeTo(baos);
+        return baos.toByteArray();
+    }
 
     @Mock private CustomPDFDocumentFactory pdfDocumentFactory;
     @Mock private RuntimePathConfig runtimePathConfig;
@@ -40,35 +58,51 @@ class ConvertEmlToPDFTest {
 
     @InjectMocks private ConvertEmlToPDF controller;
 
+    @BeforeEach
+    void setUp() throws Exception {
+        lenient()
+                .when(tempFileManager.createManagedTempFile(anyString()))
+                .thenAnswer(
+                        inv -> {
+                            File f =
+                                    Files.createTempFile("test", inv.<String>getArgument(0))
+                                            .toFile();
+                            TempFile tf = mock(TempFile.class);
+                            lenient().when(tf.getFile()).thenReturn(f);
+                            lenient().when(tf.getPath()).thenReturn(f.toPath());
+                            return tf;
+                        });
+    }
+
     @Test
-    void convertEmlToPdf_emptyFileReturnsBadRequest() {
+    void convertEmlToPdf_emptyFileReturnsBadRequest() throws java.io.IOException {
         MockMultipartFile emptyFile =
                 new MockMultipartFile("fileInput", "test.eml", "message/rfc822", new byte[0]);
 
         EmlToPdfRequest request = new EmlToPdfRequest();
         request.setFileInput(emptyFile);
 
-        ResponseEntity<byte[]> response = controller.convertEmlToPdf(request);
+        ResponseEntity<StreamingResponseBody> response = controller.convertEmlToPdf(request);
 
         assertEquals(HttpStatus.BAD_REQUEST, response.getStatusCode());
         assertTrue(
-                new String(response.getBody(), StandardCharsets.UTF_8)
+                new String(drainBody(response), StandardCharsets.UTF_8)
                         .contains("No file provided"));
     }
 
     @Test
-    void convertEmlToPdf_nullFilenameReturnsBadRequest() {
+    void convertEmlToPdf_nullFilenameReturnsBadRequest() throws java.io.IOException {
         MockMultipartFile file =
                 new MockMultipartFile("fileInput", null, "message/rfc822", "content".getBytes());
 
         EmlToPdfRequest request = new EmlToPdfRequest();
         request.setFileInput(file);
 
-        ResponseEntity<byte[]> response = controller.convertEmlToPdf(request);
+        ResponseEntity<StreamingResponseBody> response = controller.convertEmlToPdf(request);
 
         assertEquals(HttpStatus.BAD_REQUEST, response.getStatusCode());
         assertTrue(
-                new String(response.getBody(), StandardCharsets.UTF_8).contains("valid filename"));
+                new String(drainBody(response), StandardCharsets.UTF_8).contains("valid filename"));
     }
 
     @Test
@@ -79,24 +113,24 @@ class ConvertEmlToPDFTest {
         EmlToPdfRequest request = new EmlToPdfRequest();
         request.setFileInput(file);
 
-        ResponseEntity<byte[]> response = controller.convertEmlToPdf(request);
+        ResponseEntity<StreamingResponseBody> response = controller.convertEmlToPdf(request);
 
         assertEquals(HttpStatus.BAD_REQUEST, response.getStatusCode());
     }
 
     @Test
-    void convertEmlToPdf_invalidFileTypeReturnsBadRequest() {
+    void convertEmlToPdf_invalidFileTypeReturnsBadRequest() throws java.io.IOException {
         MockMultipartFile file =
                 new MockMultipartFile("fileInput", "test.txt", "text/plain", "content".getBytes());
 
         EmlToPdfRequest request = new EmlToPdfRequest();
         request.setFileInput(file);
 
-        ResponseEntity<byte[]> response = controller.convertEmlToPdf(request);
+        ResponseEntity<StreamingResponseBody> response = controller.convertEmlToPdf(request);
 
         assertEquals(HttpStatus.BAD_REQUEST, response.getStatusCode());
         assertTrue(
-                new String(response.getBody(), StandardCharsets.UTF_8)
+                new String(drainBody(response), StandardCharsets.UTF_8)
                         .contains("valid EML or MSG"));
     }
 
@@ -112,7 +146,7 @@ class ConvertEmlToPDFTest {
 
         when(runtimePathConfig.getWeasyPrintPath()).thenReturn("/usr/bin/weasyprint");
 
-        ResponseEntity<byte[]> expectedResponse = ResponseEntity.ok(pdfBytes);
+        ResponseEntity<StreamingResponseBody> expectedResponse = streamingOk(pdfBytes);
 
         try (MockedStatic<EmlToPdf> emlMock = Mockito.mockStatic(EmlToPdf.class);
                 MockedStatic<WebResponseUtils> wrMock =
@@ -132,14 +166,14 @@ class ConvertEmlToPDFTest {
 
             wrMock.when(
                             () ->
-                                    WebResponseUtils.bytesToWebResponse(
-                                            pdfBytes, "test.eml.pdf", MediaType.APPLICATION_PDF))
+                                    WebResponseUtils.pdfFileToWebResponse(
+                                            any(TempFile.class), anyString()))
                     .thenReturn(expectedResponse);
 
-            ResponseEntity<byte[]> response = controller.convertEmlToPdf(request);
+            ResponseEntity<StreamingResponseBody> response = controller.convertEmlToPdf(request);
 
             assertEquals(HttpStatus.OK, response.getStatusCode());
-            assertArrayEquals(pdfBytes, response.getBody());
+            assertArrayEquals(pdfBytes, drainBody(response));
         }
     }
 
@@ -154,8 +188,8 @@ class ConvertEmlToPDFTest {
         request.setFileInput(file);
         request.setDownloadHtml(true);
 
-        ResponseEntity<byte[]> expectedResponse =
-                ResponseEntity.ok(htmlContent.getBytes(StandardCharsets.UTF_8));
+        ResponseEntity<StreamingResponseBody> expectedResponse =
+                streamingOk(htmlContent.getBytes(StandardCharsets.UTF_8));
 
         try (MockedStatic<EmlToPdf> emlMock = Mockito.mockStatic(EmlToPdf.class);
                 MockedStatic<WebResponseUtils> wrMock =
@@ -171,13 +205,11 @@ class ConvertEmlToPDFTest {
 
             wrMock.when(
                             () ->
-                                    WebResponseUtils.bytesToWebResponse(
-                                            htmlContent.getBytes(StandardCharsets.UTF_8),
-                                            "test.eml.html",
-                                            MediaType.TEXT_HTML))
+                                    WebResponseUtils.fileToWebResponse(
+                                            any(TempFile.class), anyString(), any(MediaType.class)))
                     .thenReturn(expectedResponse);
 
-            ResponseEntity<byte[]> response = controller.convertEmlToPdf(request);
+            ResponseEntity<StreamingResponseBody> response = controller.convertEmlToPdf(request);
 
             assertEquals(HttpStatus.OK, response.getStatusCode());
         }
@@ -203,11 +235,11 @@ class ConvertEmlToPDFTest {
                                             eq(customHtmlSanitizer)))
                     .thenThrow(new IOException("Parse error"));
 
-            ResponseEntity<byte[]> response = controller.convertEmlToPdf(request);
+            ResponseEntity<StreamingResponseBody> response = controller.convertEmlToPdf(request);
 
             assertEquals(HttpStatus.INTERNAL_SERVER_ERROR, response.getStatusCode());
             assertTrue(
-                    new String(response.getBody(), StandardCharsets.UTF_8)
+                    new String(drainBody(response), StandardCharsets.UTF_8)
                             .contains("HTML conversion failed"));
         }
     }
@@ -231,11 +263,11 @@ class ConvertEmlToPDFTest {
                                             any(), any(), any(), any(), any(), any(), any()))
                     .thenReturn(null);
 
-            ResponseEntity<byte[]> response = controller.convertEmlToPdf(request);
+            ResponseEntity<StreamingResponseBody> response = controller.convertEmlToPdf(request);
 
             assertEquals(HttpStatus.INTERNAL_SERVER_ERROR, response.getStatusCode());
             assertTrue(
-                    new String(response.getBody(), StandardCharsets.UTF_8)
+                    new String(drainBody(response), StandardCharsets.UTF_8)
                             .contains("empty output"));
         }
     }
@@ -255,7 +287,7 @@ class ConvertEmlToPDFTest {
 
         when(runtimePathConfig.getWeasyPrintPath()).thenReturn("/usr/bin/weasyprint");
 
-        ResponseEntity<byte[]> expectedResponse = ResponseEntity.ok(pdfBytes);
+        ResponseEntity<StreamingResponseBody> expectedResponse = streamingOk(pdfBytes);
 
         try (MockedStatic<EmlToPdf> emlMock = Mockito.mockStatic(EmlToPdf.class);
                 MockedStatic<WebResponseUtils> wrMock =
@@ -269,13 +301,11 @@ class ConvertEmlToPDFTest {
 
             wrMock.when(
                             () ->
-                                    WebResponseUtils.bytesToWebResponse(
-                                            any(byte[].class),
-                                            any(String.class),
-                                            any(MediaType.class)))
+                                    WebResponseUtils.pdfFileToWebResponse(
+                                            any(TempFile.class), anyString()))
                     .thenReturn(expectedResponse);
 
-            ResponseEntity<byte[]> response = controller.convertEmlToPdf(request);
+            ResponseEntity<StreamingResponseBody> response = controller.convertEmlToPdf(request);
 
             assertEquals(HttpStatus.OK, response.getStatusCode());
         }
@@ -300,11 +330,12 @@ class ConvertEmlToPDFTest {
                                             any(), any(), any(), any(), any(), any(), any()))
                     .thenThrow(new InterruptedException("interrupted"));
 
-            ResponseEntity<byte[]> response = controller.convertEmlToPdf(request);
+            ResponseEntity<StreamingResponseBody> response = controller.convertEmlToPdf(request);
 
             assertEquals(HttpStatus.INTERNAL_SERVER_ERROR, response.getStatusCode());
             assertTrue(
-                    new String(response.getBody(), StandardCharsets.UTF_8).contains("interrupted"));
+                    new String(drainBody(response), StandardCharsets.UTF_8)
+                            .contains("interrupted"));
         }
     }
 }
diff --git a/app/core/src/test/java/stirling/software/SPDF/controller/api/converters/ConvertHtmlToPDFTest.java b/app/core/src/test/java/stirling/software/SPDF/controller/api/converters/ConvertHtmlToPDFTest.java
index aa9f84b93f..466ab50650 100644
--- a/app/core/src/test/java/stirling/software/SPDF/controller/api/converters/ConvertHtmlToPDFTest.java
+++ b/app/core/src/test/java/stirling/software/SPDF/controller/api/converters/ConvertHtmlToPDFTest.java
@@ -3,9 +3,16 @@ package stirling.software.SPDF.controller.api.converters;
 import static org.junit.jupiter.api.Assertions.assertEquals;
 import static org.junit.jupiter.api.Assertions.assertThrows;
 import static org.mockito.ArgumentMatchers.any;
+import static org.mockito.ArgumentMatchers.anyString;
 import static org.mockito.ArgumentMatchers.eq;
+import static org.mockito.Mockito.lenient;
+import static org.mockito.Mockito.mock;
 import static org.mockito.Mockito.when;
 
+import java.io.File;
+import java.nio.file.Files;
+
+import org.junit.jupiter.api.BeforeEach;
 import org.junit.jupiter.api.Test;
 import org.junit.jupiter.api.extension.ExtendWith;
 import org.mockito.InjectMocks;
@@ -16,6 +23,7 @@ import org.mockito.junit.jupiter.MockitoExtension;
 import org.springframework.http.HttpStatus;
 import org.springframework.http.ResponseEntity;
 import org.springframework.mock.web.MockMultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import stirling.software.common.configuration.RuntimePathConfig;
 import stirling.software.common.model.api.converters.HTMLToPdfRequest;
@@ -23,11 +31,22 @@ import stirling.software.common.service.CustomPDFDocumentFactory;
 import stirling.software.common.util.CustomHtmlSanitizer;
 import stirling.software.common.util.FileToPdf;
 import stirling.software.common.util.GeneralUtils;
+import stirling.software.common.util.TempFile;
 import stirling.software.common.util.TempFileManager;
 import stirling.software.common.util.WebResponseUtils;
 
 @ExtendWith(MockitoExtension.class)
 class ConvertHtmlToPDFTest {
+    private static ResponseEntity<StreamingResponseBody> streamingOk(byte[] bytes) {
+        return ResponseEntity.ok(out -> out.write(bytes));
+    }
+
+    private static byte[] drainBody(ResponseEntity<StreamingResponseBody> response)
+            throws java.io.IOException {
+        java.io.ByteArrayOutputStream baos = new java.io.ByteArrayOutputStream();
+        response.getBody().writeTo(baos);
+        return baos.toByteArray();
+    }
 
     @Mock private CustomPDFDocumentFactory pdfDocumentFactory;
     @Mock private RuntimePathConfig runtimePathConfig;
@@ -36,6 +55,22 @@ class ConvertHtmlToPDFTest {
 
     @InjectMocks private ConvertHtmlToPDF controller;
 
+    @BeforeEach
+    void setUp() throws Exception {
+        lenient()
+                .when(tempFileManager.createManagedTempFile(anyString()))
+                .thenAnswer(
+                        inv -> {
+                            File f =
+                                    Files.createTempFile("test", inv.<String>getArgument(0))
+                                            .toFile();
+                            TempFile tf = mock(TempFile.class);
+                            lenient().when(tf.getFile()).thenReturn(f);
+                            lenient().when(tf.getPath()).thenReturn(f.toPath());
+                            return tf;
+                        });
+    }
+
     @Test
     void htmlToPdf_nullFileInputThrows() {
         HTMLToPdfRequest request = new HTMLToPdfRequest();
@@ -69,7 +104,7 @@ class ConvertHtmlToPDFTest {
         when(pdfDocumentFactory.createNewBytesBasedOnOldDocument(pdfBytes))
                 .thenReturn(processedPdf);
 
-        ResponseEntity<byte[]> expectedResponse = ResponseEntity.ok(processedPdf);
+        ResponseEntity<StreamingResponseBody> expectedResponse = streamingOk(processedPdf);
 
         try (MockedStatic<FileToPdf> ftpMock = Mockito.mockStatic(FileToPdf.class);
                 MockedStatic<GeneralUtils> guMock = Mockito.mockStatic(GeneralUtils.class);
@@ -90,10 +125,13 @@ class ConvertHtmlToPDFTest {
             guMock.when(() -> GeneralUtils.generateFilename("test.html", ".pdf"))
                     .thenReturn("test.pdf");
 
-            wrMock.when(() -> WebResponseUtils.bytesToWebResponse(processedPdf, "test.pdf"))
+            wrMock.when(
+                            () ->
+                                    WebResponseUtils.pdfFileToWebResponse(
+                                            any(TempFile.class), anyString()))
                     .thenReturn(expectedResponse);
 
-            ResponseEntity<byte[]> response = controller.HtmlToPdf(request);
+            ResponseEntity<StreamingResponseBody> response = controller.HtmlToPdf(request);
 
             assertEquals(HttpStatus.OK, response.getStatusCode());
         }
@@ -114,7 +152,7 @@ class ConvertHtmlToPDFTest {
         when(pdfDocumentFactory.createNewBytesBasedOnOldDocument(pdfBytes))
                 .thenReturn(processedPdf);
 
-        ResponseEntity<byte[]> expectedResponse = ResponseEntity.ok(processedPdf);
+        ResponseEntity<StreamingResponseBody> expectedResponse = streamingOk(processedPdf);
 
         try (MockedStatic<FileToPdf> ftpMock = Mockito.mockStatic(FileToPdf.class);
                 MockedStatic<GeneralUtils> guMock = Mockito.mockStatic(GeneralUtils.class);
@@ -135,10 +173,13 @@ class ConvertHtmlToPDFTest {
             guMock.when(() -> GeneralUtils.generateFilename("archive.zip", ".pdf"))
                     .thenReturn("archive.pdf");
 
-            wrMock.when(() -> WebResponseUtils.bytesToWebResponse(processedPdf, "archive.pdf"))
+            wrMock.when(
+                            () ->
+                                    WebResponseUtils.pdfFileToWebResponse(
+                                            any(TempFile.class), anyString()))
                     .thenReturn(expectedResponse);
 
-            ResponseEntity<byte[]> response = controller.HtmlToPdf(request);
+            ResponseEntity<StreamingResponseBody> response = controller.HtmlToPdf(request);
 
             assertEquals(HttpStatus.OK, response.getStatusCode());
         }
diff --git a/app/core/src/test/java/stirling/software/SPDF/controller/api/converters/ConvertImgPDFControllerTest.java b/app/core/src/test/java/stirling/software/SPDF/controller/api/converters/ConvertImgPDFControllerTest.java
index 011a3fcb61..78ce0233b1 100644
--- a/app/core/src/test/java/stirling/software/SPDF/controller/api/converters/ConvertImgPDFControllerTest.java
+++ b/app/core/src/test/java/stirling/software/SPDF/controller/api/converters/ConvertImgPDFControllerTest.java
@@ -14,6 +14,7 @@ import org.mockito.Mockito;
 import org.mockito.junit.jupiter.MockitoExtension;
 import org.springframework.http.ResponseEntity;
 import org.springframework.mock.web.MockMultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import stirling.software.SPDF.config.EndpointConfiguration;
 import stirling.software.SPDF.model.api.converters.ConvertToPdfRequest;
@@ -25,6 +26,16 @@ import stirling.software.common.util.WebResponseUtils;
 
 @ExtendWith(MockitoExtension.class)
 class ConvertImgPDFControllerTest {
+    private static ResponseEntity<StreamingResponseBody> streamingOk(byte[] bytes) {
+        return ResponseEntity.ok(out -> out.write(bytes));
+    }
+
+    private static byte[] drainBody(ResponseEntity<StreamingResponseBody> response)
+            throws java.io.IOException {
+        java.io.ByteArrayOutputStream baos = new java.io.ByteArrayOutputStream();
+        response.getBody().writeTo(baos);
+        return baos.toByteArray();
+    }
 
     @Mock private CustomPDFDocumentFactory pdfDocumentFactory;
     @Mock private TempFileManager tempFileManager;
diff --git a/app/core/src/test/java/stirling/software/SPDF/controller/api/converters/ConvertMarkdownToPdfTest.java b/app/core/src/test/java/stirling/software/SPDF/controller/api/converters/ConvertMarkdownToPdfTest.java
index 838c91ea86..00116172cd 100644
--- a/app/core/src/test/java/stirling/software/SPDF/controller/api/converters/ConvertMarkdownToPdfTest.java
+++ b/app/core/src/test/java/stirling/software/SPDF/controller/api/converters/ConvertMarkdownToPdfTest.java
@@ -4,10 +4,17 @@ import static org.junit.jupiter.api.Assertions.assertEquals;
 import static org.junit.jupiter.api.Assertions.assertNotNull;
 import static org.junit.jupiter.api.Assertions.assertThrows;
 import static org.mockito.ArgumentMatchers.any;
+import static org.mockito.ArgumentMatchers.anyString;
 import static org.mockito.ArgumentMatchers.eq;
 import static org.mockito.ArgumentMatchers.isNull;
+import static org.mockito.Mockito.lenient;
+import static org.mockito.Mockito.mock;
 import static org.mockito.Mockito.when;
 
+import java.io.File;
+import java.nio.file.Files;
+
+import org.junit.jupiter.api.BeforeEach;
 import org.junit.jupiter.api.Test;
 import org.junit.jupiter.api.extension.ExtendWith;
 import org.mockito.InjectMocks;
@@ -18,6 +25,7 @@ import org.mockito.junit.jupiter.MockitoExtension;
 import org.springframework.http.HttpStatus;
 import org.springframework.http.ResponseEntity;
 import org.springframework.mock.web.MockMultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import stirling.software.common.configuration.RuntimePathConfig;
 import stirling.software.common.model.api.GeneralFile;
@@ -25,11 +33,22 @@ import stirling.software.common.service.CustomPDFDocumentFactory;
 import stirling.software.common.util.CustomHtmlSanitizer;
 import stirling.software.common.util.FileToPdf;
 import stirling.software.common.util.GeneralUtils;
+import stirling.software.common.util.TempFile;
 import stirling.software.common.util.TempFileManager;
 import stirling.software.common.util.WebResponseUtils;
 
 @ExtendWith(MockitoExtension.class)
 class ConvertMarkdownToPdfTest {
+    private static ResponseEntity<StreamingResponseBody> streamingOk(byte[] bytes) {
+        return ResponseEntity.ok(out -> out.write(bytes));
+    }
+
+    private static byte[] drainBody(ResponseEntity<StreamingResponseBody> response)
+            throws java.io.IOException {
+        java.io.ByteArrayOutputStream baos = new java.io.ByteArrayOutputStream();
+        response.getBody().writeTo(baos);
+        return baos.toByteArray();
+    }
 
     @Mock private CustomPDFDocumentFactory pdfDocumentFactory;
     @Mock private RuntimePathConfig runtimePathConfig;
@@ -38,6 +57,22 @@ class ConvertMarkdownToPdfTest {
 
     @InjectMocks private ConvertMarkdownToPdf controller;
 
+    @BeforeEach
+    void setUp() throws Exception {
+        lenient()
+                .when(tempFileManager.createManagedTempFile(anyString()))
+                .thenAnswer(
+                        inv -> {
+                            File f =
+                                    Files.createTempFile("test", inv.<String>getArgument(0))
+                                            .toFile();
+                            TempFile tf = mock(TempFile.class);
+                            lenient().when(tf.getFile()).thenReturn(f);
+                            lenient().when(tf.getPath()).thenReturn(f.toPath());
+                            return tf;
+                        });
+    }
+
     @Test
     void markdownToPdf_nullFileInputThrows() {
         GeneralFile generalFile = new GeneralFile();
@@ -71,7 +106,7 @@ class ConvertMarkdownToPdfTest {
         when(pdfDocumentFactory.createNewBytesBasedOnOldDocument(any(byte[].class)))
                 .thenReturn(processedPdf);
 
-        ResponseEntity<byte[]> expectedResponse = ResponseEntity.ok(processedPdf);
+        ResponseEntity<StreamingResponseBody> expectedResponse = streamingOk(processedPdf);
 
         try (MockedStatic<FileToPdf> ftpMock = Mockito.mockStatic(FileToPdf.class);
                 MockedStatic<GeneralUtils> guMock = Mockito.mockStatic(GeneralUtils.class);
@@ -92,10 +127,13 @@ class ConvertMarkdownToPdfTest {
             guMock.when(() -> GeneralUtils.generateFilename("readme.md", ".pdf"))
                     .thenReturn("readme.pdf");
 
-            wrMock.when(() -> WebResponseUtils.bytesToWebResponse(processedPdf, "readme.pdf"))
+            wrMock.when(
+                            () ->
+                                    WebResponseUtils.pdfFileToWebResponse(
+                                            any(TempFile.class), anyString()))
                     .thenReturn(expectedResponse);
 
-            ResponseEntity<byte[]> response = controller.markdownToPdf(generalFile);
+            ResponseEntity<StreamingResponseBody> response = controller.markdownToPdf(generalFile);
 
             assertEquals(HttpStatus.OK, response.getStatusCode());
         }
diff --git a/app/core/src/test/java/stirling/software/SPDF/controller/api/converters/ConvertPDFToEpubControllerTest.java b/app/core/src/test/java/stirling/software/SPDF/controller/api/converters/ConvertPDFToEpubControllerTest.java
index 65cae373a4..a9d669c052 100644
--- a/app/core/src/test/java/stirling/software/SPDF/controller/api/converters/ConvertPDFToEpubControllerTest.java
+++ b/app/core/src/test/java/stirling/software/SPDF/controller/api/converters/ConvertPDFToEpubControllerTest.java
@@ -3,12 +3,15 @@ package stirling.software.SPDF.controller.api.converters;
 import static org.junit.jupiter.api.Assertions.assertEquals;
 import static org.junit.jupiter.api.Assertions.assertTrue;
 import static org.mockito.ArgumentMatchers.any;
+import static org.mockito.ArgumentMatchers.anyString;
 import static org.mockito.ArgumentMatchers.eq;
 import static org.mockito.Mockito.doAnswer;
+import static org.mockito.Mockito.lenient;
 import static org.mockito.Mockito.mock;
 import static org.mockito.Mockito.verify;
 import static org.mockito.Mockito.when;
 
+import java.io.File;
 import java.io.IOException;
 import java.nio.charset.StandardCharsets;
 import java.nio.file.Files;
@@ -18,6 +21,7 @@ import java.util.List;
 import java.util.concurrent.atomic.AtomicReference;
 import java.util.stream.Stream;
 
+import org.junit.jupiter.api.BeforeEach;
 import org.junit.jupiter.api.Test;
 import org.junit.jupiter.api.extension.ExtendWith;
 import org.mockito.ArgumentCaptor;
@@ -29,6 +33,7 @@ import org.mockito.junit.jupiter.MockitoExtension;
 import org.springframework.http.MediaType;
 import org.springframework.http.ResponseEntity;
 import org.springframework.mock.web.MockMultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import stirling.software.SPDF.config.EndpointConfiguration;
 import stirling.software.SPDF.model.api.converters.ConvertPdfToEpubRequest;
@@ -38,10 +43,21 @@ import stirling.software.common.util.GeneralUtils;
 import stirling.software.common.util.ProcessExecutor;
 import stirling.software.common.util.ProcessExecutor.ProcessExecutorResult;
 import stirling.software.common.util.ProcessExecutor.Processes;
+import stirling.software.common.util.TempFile;
 import stirling.software.common.util.TempFileManager;
 
 @ExtendWith(MockitoExtension.class)
 class ConvertPDFToEpubControllerTest {
+    private static ResponseEntity<StreamingResponseBody> streamingOk(byte[] bytes) {
+        return ResponseEntity.ok(out -> out.write(bytes));
+    }
+
+    private static byte[] drainBody(ResponseEntity<StreamingResponseBody> response)
+            throws java.io.IOException {
+        java.io.ByteArrayOutputStream baos = new java.io.ByteArrayOutputStream();
+        response.getBody().writeTo(baos);
+        return baos.toByteArray();
+    }
 
     private static final MediaType EPUB_MEDIA_TYPE = MediaType.valueOf("application/epub+zip");
 
@@ -50,6 +66,22 @@ class ConvertPDFToEpubControllerTest {
 
     @InjectMocks private ConvertPDFToEpubController controller;
 
+    @BeforeEach
+    void setUp() throws Exception {
+        lenient()
+                .when(tempFileManager.createManagedTempFile(anyString()))
+                .thenAnswer(
+                        inv -> {
+                            File f =
+                                    Files.createTempFile("test", inv.<String>getArgument(0))
+                                            .toFile();
+                            TempFile tf = mock(TempFile.class);
+                            lenient().when(tf.getFile()).thenReturn(f);
+                            lenient().when(tf.getPath()).thenReturn(f.toPath());
+                            return tf;
+                        });
+    }
+
     @Test
     void convertPdfToEpub_buildsGoldenCommandAndCleansUp() throws Exception {
         when(endpointConfiguration.isGroupEnabled("Calibre")).thenReturn(true);
@@ -110,7 +142,7 @@ class ConvertPDFToEpubControllerTest {
 
             gu.when(() -> GeneralUtils.generateFilename("novel.pdf", "_convertedToEPUB.epub"))
                     .thenReturn("novel_convertedToEPUB.epub");
-            ResponseEntity<byte[]> response = controller.convertPdfToEpub(request);
+            ResponseEntity<StreamingResponseBody> response = controller.convertPdfToEpub(request);
 
             List<String> command = commandCaptor.getValue();
             assertEquals(13, command.size());
@@ -134,7 +166,7 @@ class ConvertPDFToEpubControllerTest {
             assertEquals(
                     "novel_convertedToEPUB.epub",
                     response.getHeaders().getContentDisposition().getFilename());
-            assertEquals("epub", new String(response.getBody(), StandardCharsets.UTF_8));
+            assertEquals("epub", new String(drainBody(response), StandardCharsets.UTF_8));
 
             verify(tempFileManager).deleteTempDirectory(workingDir);
             assertEquals(workingDir, deletedDir.get());
@@ -202,7 +234,7 @@ class ConvertPDFToEpubControllerTest {
 
             gu.when(() -> GeneralUtils.generateFilename("story.pdf", "_convertedToEPUB.epub"))
                     .thenReturn("story_convertedToEPUB.epub");
-            ResponseEntity<byte[]> response = controller.convertPdfToEpub(request);
+            ResponseEntity<StreamingResponseBody> response = controller.convertPdfToEpub(request);
 
             List<String> command = commandCaptor.getValue();
             assertTrue(command.stream().noneMatch(arg -> "--chapter".equals(arg)));
@@ -220,7 +252,7 @@ class ConvertPDFToEpubControllerTest {
             assertEquals(
                     "story_convertedToEPUB.epub",
                     response.getHeaders().getContentDisposition().getFilename());
-            assertEquals("epub", new String(response.getBody(), StandardCharsets.UTF_8));
+            assertEquals("epub", new String(drainBody(response), StandardCharsets.UTF_8));
         } finally {
             deleteIfExists(workingDir);
         }
@@ -287,7 +319,7 @@ class ConvertPDFToEpubControllerTest {
 
             gu.when(() -> GeneralUtils.generateFilename("book.pdf", "_convertedToAZW3.azw3"))
                     .thenReturn("book_convertedToAZW3.azw3");
-            ResponseEntity<byte[]> response = controller.convertPdfToEpub(request);
+            ResponseEntity<StreamingResponseBody> response = controller.convertPdfToEpub(request);
 
             List<String> command = commandCaptor.getValue();
             assertEquals("ebook-convert", command.get(0));
@@ -308,7 +340,7 @@ class ConvertPDFToEpubControllerTest {
             assertEquals(
                     "book_convertedToAZW3.azw3",
                     response.getHeaders().getContentDisposition().getFilename());
-            assertEquals("azw3", new String(response.getBody(), StandardCharsets.UTF_8));
+            assertEquals("azw3", new String(drainBody(response), StandardCharsets.UTF_8));
 
             verify(tempFileManager).deleteTempDirectory(workingDir);
         } finally {
diff --git a/app/core/src/test/java/stirling/software/SPDF/controller/api/converters/ConvertPDFToExcelControllerTest.java b/app/core/src/test/java/stirling/software/SPDF/controller/api/converters/ConvertPDFToExcelControllerTest.java
index 6b5bb1e7f5..ca7a7112fa 100644
--- a/app/core/src/test/java/stirling/software/SPDF/controller/api/converters/ConvertPDFToExcelControllerTest.java
+++ b/app/core/src/test/java/stirling/software/SPDF/controller/api/converters/ConvertPDFToExcelControllerTest.java
@@ -2,11 +2,17 @@ package stirling.software.SPDF.controller.api.converters;
 
 import static org.junit.jupiter.api.Assertions.assertEquals;
 import static org.junit.jupiter.api.Assertions.assertNotNull;
+import static org.mockito.ArgumentMatchers.anyString;
+import static org.mockito.Mockito.lenient;
+import static org.mockito.Mockito.mock;
 import static org.mockito.Mockito.when;
 
+import java.io.File;
+import java.nio.file.Files;
 import java.util.List;
 
 import org.apache.pdfbox.pdmodel.PDDocument;
+import org.junit.jupiter.api.BeforeEach;
 import org.junit.jupiter.api.Test;
 import org.junit.jupiter.api.extension.ExtendWith;
 import org.mockito.InjectMocks;
@@ -17,18 +23,38 @@ import org.mockito.junit.jupiter.MockitoExtension;
 import org.springframework.http.HttpStatus;
 import org.springframework.http.ResponseEntity;
 import org.springframework.mock.web.MockMultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import stirling.software.SPDF.model.api.PDFWithPageNums;
 import stirling.software.common.service.CustomPDFDocumentFactory;
 import stirling.software.common.util.GeneralUtils;
+import stirling.software.common.util.TempFile;
+import stirling.software.common.util.TempFileManager;
 
 @ExtendWith(MockitoExtension.class)
 class ConvertPDFToExcelControllerTest {
 
     @Mock private CustomPDFDocumentFactory pdfDocumentFactory;
+    @Mock private TempFileManager tempFileManager;
 
     @InjectMocks private ConvertPDFToExcelController controller;
 
+    @BeforeEach
+    void setUp() throws Exception {
+        lenient()
+                .when(tempFileManager.createManagedTempFile(anyString()))
+                .thenAnswer(
+                        inv -> {
+                            File f =
+                                    Files.createTempFile("test", inv.<String>getArgument(0))
+                                            .toFile();
+                            TempFile tf = mock(TempFile.class);
+                            lenient().when(tf.getFile()).thenReturn(f);
+                            lenient().when(tf.getPath()).thenReturn(f.toPath());
+                            return tf;
+                        });
+    }
+
     @Test
     void pdfToExcel_noTablesReturnsNoContent() throws Exception {
         MockMultipartFile pdfFile =
@@ -55,7 +81,7 @@ class ConvertPDFToExcelControllerTest {
                                             Mockito.eq(true)))
                     .thenReturn(List.of(1));
 
-            ResponseEntity<byte[]> response = controller.pdfToExcel(request);
+            ResponseEntity<StreamingResponseBody> response = controller.pdfToExcel(request);
 
             // tabula may or may not find tables in an empty page
             assertNotNull(response);
diff --git a/app/core/src/test/java/stirling/software/SPDF/controller/api/converters/ConvertPDFToOfficeTest.java b/app/core/src/test/java/stirling/software/SPDF/controller/api/converters/ConvertPDFToOfficeTest.java
index 50991742b9..d768ce1b29 100644
--- a/app/core/src/test/java/stirling/software/SPDF/controller/api/converters/ConvertPDFToOfficeTest.java
+++ b/app/core/src/test/java/stirling/software/SPDF/controller/api/converters/ConvertPDFToOfficeTest.java
@@ -4,10 +4,16 @@ import static org.junit.jupiter.api.Assertions.assertEquals;
 import static org.junit.jupiter.api.Assertions.assertNotNull;
 import static org.junit.jupiter.api.Assertions.assertSame;
 import static org.mockito.ArgumentMatchers.any;
-import static org.mockito.ArgumentMatchers.eq;
+import static org.mockito.ArgumentMatchers.anyString;
+import static org.mockito.Mockito.lenient;
+import static org.mockito.Mockito.mock;
 import static org.mockito.Mockito.when;
 
+import java.io.File;
+import java.nio.file.Files;
+
 import org.apache.pdfbox.pdmodel.PDDocument;
+import org.junit.jupiter.api.BeforeEach;
 import org.junit.jupiter.api.Test;
 import org.junit.jupiter.api.extension.ExtendWith;
 import org.mockito.InjectMocks;
@@ -18,6 +24,7 @@ import org.mockito.junit.jupiter.MockitoExtension;
 import org.springframework.http.MediaType;
 import org.springframework.http.ResponseEntity;
 import org.springframework.mock.web.MockMultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import stirling.software.SPDF.model.api.converters.PdfToPresentationRequest;
 import stirling.software.SPDF.model.api.converters.PdfToTextOrRTFRequest;
@@ -27,11 +34,22 @@ import stirling.software.common.model.api.PDFFile;
 import stirling.software.common.service.CustomPDFDocumentFactory;
 import stirling.software.common.util.GeneralUtils;
 import stirling.software.common.util.PDFToFile;
+import stirling.software.common.util.TempFile;
 import stirling.software.common.util.TempFileManager;
 import stirling.software.common.util.WebResponseUtils;
 
 @ExtendWith(MockitoExtension.class)
 class ConvertPDFToOfficeTest {
+    private static ResponseEntity<StreamingResponseBody> streamingOk(byte[] bytes) {
+        return ResponseEntity.ok(out -> out.write(bytes));
+    }
+
+    private static byte[] drainBody(ResponseEntity<StreamingResponseBody> response)
+            throws java.io.IOException {
+        java.io.ByteArrayOutputStream baos = new java.io.ByteArrayOutputStream();
+        response.getBody().writeTo(baos);
+        return baos.toByteArray();
+    }
 
     @Mock private CustomPDFDocumentFactory pdfDocumentFactory;
     @Mock private TempFileManager tempFileManager;
@@ -39,6 +57,22 @@ class ConvertPDFToOfficeTest {
 
     @InjectMocks private ConvertPDFToOffice controller;
 
+    @BeforeEach
+    void setUp() throws Exception {
+        lenient()
+                .when(tempFileManager.createManagedTempFile(anyString()))
+                .thenAnswer(
+                        inv -> {
+                            File f =
+                                    Files.createTempFile("test", inv.<String>getArgument(0))
+                                            .toFile();
+                            TempFile tf = mock(TempFile.class);
+                            lenient().when(tf.getFile()).thenReturn(f);
+                            lenient().when(tf.getPath()).thenReturn(f.toPath());
+                            return tf;
+                        });
+    }
+
     private MockMultipartFile createPdfFile() {
         return new MockMultipartFile(
                 "fileInput", "document.pdf", "application/pdf", "pdf-content".getBytes());
@@ -51,7 +85,8 @@ class ConvertPDFToOfficeTest {
         request.setFileInput(pdfFile);
         request.setOutputFormat("pptx");
 
-        ResponseEntity<byte[]> expectedResponse = ResponseEntity.ok("pptx-content".getBytes());
+        ResponseEntity<StreamingResponseBody> expectedResponse =
+                streamingOk("pptx-content".getBytes());
 
         try (MockedStatic<PDFToFile> mock =
                 Mockito.mockStatic(PDFToFile.class, Mockito.CALLS_REAL_METHODS)) {
@@ -80,7 +115,8 @@ class ConvertPDFToOfficeTest {
         realDoc.addPage(new org.apache.pdfbox.pdmodel.PDPage());
         when(pdfDocumentFactory.load(pdfFile)).thenReturn(realDoc);
 
-        ResponseEntity<byte[]> expectedResponse = ResponseEntity.ok("text content".getBytes());
+        ResponseEntity<StreamingResponseBody> expectedResponse =
+                streamingOk("text content".getBytes());
 
         try (MockedStatic<GeneralUtils> guMock = Mockito.mockStatic(GeneralUtils.class);
                 MockedStatic<WebResponseUtils> wrMock =
@@ -91,13 +127,12 @@ class ConvertPDFToOfficeTest {
 
             wrMock.when(
                             () ->
-                                    WebResponseUtils.bytesToWebResponse(
-                                            any(byte[].class),
-                                            eq("document.txt"),
-                                            eq(MediaType.TEXT_PLAIN)))
+                                    WebResponseUtils.fileToWebResponse(
+                                            any(TempFile.class), anyString(), any(MediaType.class)))
                     .thenReturn(expectedResponse);
 
-            ResponseEntity<byte[]> response = controller.processPdfToRTForTXT(request);
+            ResponseEntity<StreamingResponseBody> response =
+                    controller.processPdfToRTForTXT(request);
 
             assertSame(expectedResponse, response);
         }
diff --git a/app/core/src/test/java/stirling/software/SPDF/controller/api/converters/ConvertPdfJsonControllerTest.java b/app/core/src/test/java/stirling/software/SPDF/controller/api/converters/ConvertPdfJsonControllerTest.java
index d9d499b17d..882c24926a 100644
--- a/app/core/src/test/java/stirling/software/SPDF/controller/api/converters/ConvertPdfJsonControllerTest.java
+++ b/app/core/src/test/java/stirling/software/SPDF/controller/api/converters/ConvertPdfJsonControllerTest.java
@@ -4,34 +4,67 @@ import static org.junit.jupiter.api.Assertions.assertEquals;
 import static org.junit.jupiter.api.Assertions.assertNotNull;
 import static org.junit.jupiter.api.Assertions.assertThrows;
 import static org.mockito.ArgumentMatchers.any;
+import static org.mockito.ArgumentMatchers.anyString;
 import static org.mockito.ArgumentMatchers.eq;
+import static org.mockito.Mockito.lenient;
+import static org.mockito.Mockito.mock;
 import static org.mockito.Mockito.verify;
 import static org.mockito.Mockito.when;
 
+import java.io.ByteArrayOutputStream;
+import java.io.File;
+import java.io.IOException;
+import java.nio.file.Files;
+
+import org.junit.jupiter.api.BeforeEach;
 import org.junit.jupiter.api.Test;
 import org.junit.jupiter.api.extension.ExtendWith;
 import org.mockito.InjectMocks;
 import org.mockito.Mock;
-import org.mockito.MockedStatic;
-import org.mockito.Mockito;
 import org.mockito.junit.jupiter.MockitoExtension;
 import org.springframework.http.HttpStatus;
 import org.springframework.http.MediaType;
 import org.springframework.http.ResponseEntity;
 import org.springframework.mock.web.MockMultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import stirling.software.SPDF.service.PdfJsonConversionService;
 import stirling.software.common.model.api.GeneralFile;
 import stirling.software.common.model.api.PDFFile;
-import stirling.software.common.util.WebResponseUtils;
+import stirling.software.common.util.TempFile;
+import stirling.software.common.util.TempFileManager;
 
 @ExtendWith(MockitoExtension.class)
 class ConvertPdfJsonControllerTest {
 
     @Mock private PdfJsonConversionService pdfJsonConversionService;
+    @Mock private TempFileManager tempFileManager;
 
     @InjectMocks private ConvertPdfJsonController controller;
 
+    @BeforeEach
+    void setUp() throws Exception {
+        lenient()
+                .when(tempFileManager.createManagedTempFile(anyString()))
+                .thenAnswer(
+                        inv -> {
+                            File f =
+                                    Files.createTempFile("test", inv.<String>getArgument(0))
+                                            .toFile();
+                            TempFile tf = mock(TempFile.class);
+                            lenient().when(tf.getFile()).thenReturn(f);
+                            lenient().when(tf.getPath()).thenReturn(f.toPath());
+                            return tf;
+                        });
+    }
+
+    private static byte[] drainBody(ResponseEntity<StreamingResponseBody> response)
+            throws IOException {
+        ByteArrayOutputStream baos = new ByteArrayOutputStream();
+        response.getBody().writeTo(baos);
+        return baos.toByteArray();
+    }
+
     @Test
     void convertPdfToJson_nullFileInputThrows() {
         PDFFile request = new PDFFile();
@@ -51,19 +84,11 @@ class ConvertPdfJsonControllerTest {
 
         when(pdfJsonConversionService.convertPdfToJson(pdfFile, false)).thenReturn(jsonBytes);
 
-        ResponseEntity<byte[]> expectedResponse = ResponseEntity.ok(jsonBytes);
+        ResponseEntity<StreamingResponseBody> response =
+                controller.convertPdfToJson(request, false);
 
-        try (MockedStatic<WebResponseUtils> wrMock = Mockito.mockStatic(WebResponseUtils.class)) {
-            wrMock.when(
-                            () ->
-                                    WebResponseUtils.bytesToWebResponse(
-                                            jsonBytes, "doc.json", MediaType.APPLICATION_JSON))
-                    .thenReturn(expectedResponse);
-
-            ResponseEntity<byte[]> response = controller.convertPdfToJson(request, false);
-
-            assertEquals(HttpStatus.OK, response.getStatusCode());
-        }
+        assertEquals(HttpStatus.OK, response.getStatusCode());
+        assertNotNull(response.getBody());
     }
 
     @Test
@@ -77,20 +102,10 @@ class ConvertPdfJsonControllerTest {
 
         when(pdfJsonConversionService.convertPdfToJson(pdfFile, true)).thenReturn(jsonBytes);
 
-        ResponseEntity<byte[]> expectedResponse = ResponseEntity.ok(jsonBytes);
+        ResponseEntity<StreamingResponseBody> response = controller.convertPdfToJson(request, true);
 
-        try (MockedStatic<WebResponseUtils> wrMock = Mockito.mockStatic(WebResponseUtils.class)) {
-            wrMock.when(
-                            () ->
-                                    WebResponseUtils.bytesToWebResponse(
-                                            jsonBytes, "doc.json", MediaType.APPLICATION_JSON))
-                    .thenReturn(expectedResponse);
-
-            ResponseEntity<byte[]> response = controller.convertPdfToJson(request, true);
-
-            assertEquals(HttpStatus.OK, response.getStatusCode());
-            verify(pdfJsonConversionService).convertPdfToJson(pdfFile, true);
-        }
+        assertEquals(HttpStatus.OK, response.getStatusCode());
+        verify(pdfJsonConversionService).convertPdfToJson(pdfFile, true);
     }
 
     @Test
@@ -112,16 +127,10 @@ class ConvertPdfJsonControllerTest {
 
         when(pdfJsonConversionService.convertJsonToPdf(jsonFile)).thenReturn(pdfBytes);
 
-        ResponseEntity<byte[]> expectedResponse = ResponseEntity.ok(pdfBytes);
+        ResponseEntity<StreamingResponseBody> response = controller.convertJsonToPdf(request);
 
-        try (MockedStatic<WebResponseUtils> wrMock = Mockito.mockStatic(WebResponseUtils.class)) {
-            wrMock.when(() -> WebResponseUtils.bytesToWebResponse(pdfBytes, "doc.pdf"))
-                    .thenReturn(expectedResponse);
-
-            ResponseEntity<byte[]> response = controller.convertJsonToPdf(request);
-
-            assertEquals(HttpStatus.OK, response.getStatusCode());
-        }
+        assertEquals(HttpStatus.OK, response.getStatusCode());
+        assertNotNull(response.getBody());
     }
 
     @Test
@@ -144,7 +153,7 @@ class ConvertPdfJsonControllerTest {
         when(pdfJsonConversionService.extractDocumentMetadata(eq(pdfFile), any(String.class)))
                 .thenReturn(jsonBytes);
 
-        ResponseEntity<byte[]> response = controller.extractPdfMetadata(request);
+        ResponseEntity<StreamingResponseBody> response = controller.extractPdfMetadata(request);
 
         assertEquals(HttpStatus.OK, response.getStatusCode());
         assertEquals(MediaType.APPLICATION_JSON, response.getHeaders().getContentType());
@@ -168,19 +177,10 @@ class ConvertPdfJsonControllerTest {
 
         when(pdfJsonConversionService.extractSinglePage(jobId, 1)).thenReturn(jsonBytes);
 
-        ResponseEntity<byte[]> expectedResponse = ResponseEntity.ok(jsonBytes);
+        ResponseEntity<StreamingResponseBody> response = controller.extractSinglePage(jobId, 1);
 
-        try (MockedStatic<WebResponseUtils> wrMock = Mockito.mockStatic(WebResponseUtils.class)) {
-            wrMock.when(
-                            () ->
-                                    WebResponseUtils.bytesToWebResponse(
-                                            jsonBytes, "page_1.json", MediaType.APPLICATION_JSON))
-                    .thenReturn(expectedResponse);
-
-            ResponseEntity<byte[]> response = controller.extractSinglePage(jobId, 1);
-
-            assertEquals(HttpStatus.OK, response.getStatusCode());
-        }
+        assertEquals(HttpStatus.OK, response.getStatusCode());
+        assertNotNull(response.getBody());
     }
 
     @Test
@@ -190,20 +190,9 @@ class ConvertPdfJsonControllerTest {
 
         when(pdfJsonConversionService.extractPageFonts(jobId, 1)).thenReturn(jsonBytes);
 
-        ResponseEntity<byte[]> expectedResponse = ResponseEntity.ok(jsonBytes);
+        ResponseEntity<StreamingResponseBody> response = controller.extractPageFonts(jobId, 1);
 
-        try (MockedStatic<WebResponseUtils> wrMock = Mockito.mockStatic(WebResponseUtils.class)) {
-            wrMock.when(
-                            () ->
-                                    WebResponseUtils.bytesToWebResponse(
-                                            jsonBytes,
-                                            "page_fonts_1.json",
-                                            MediaType.APPLICATION_JSON))
-                    .thenReturn(expectedResponse);
-
-            ResponseEntity<byte[]> response = controller.extractPageFonts(jobId, 1);
-
-            assertEquals(HttpStatus.OK, response.getStatusCode());
-        }
+        assertEquals(HttpStatus.OK, response.getStatusCode());
+        assertNotNull(response.getBody());
     }
 }
diff --git a/app/core/src/test/java/stirling/software/SPDF/controller/api/converters/ConvertPdfToVideoControllerTest.java b/app/core/src/test/java/stirling/software/SPDF/controller/api/converters/ConvertPdfToVideoControllerTest.java
deleted file mode 100644
index 0b8de27f9b..0000000000
--- a/app/core/src/test/java/stirling/software/SPDF/controller/api/converters/ConvertPdfToVideoControllerTest.java
+++ /dev/null
@@ -1,164 +0,0 @@
-package stirling.software.SPDF.controller.api.converters;
-
-import static org.junit.jupiter.api.Assertions.assertEquals;
-import static org.junit.jupiter.api.Assertions.assertNotNull;
-import static org.junit.jupiter.api.Assertions.assertThrows;
-
-import org.junit.jupiter.api.Test;
-import org.junit.jupiter.api.extension.ExtendWith;
-import org.mockito.InjectMocks;
-import org.mockito.Mock;
-import org.mockito.MockedStatic;
-import org.mockito.Mockito;
-import org.mockito.junit.jupiter.MockitoExtension;
-import org.springframework.http.HttpStatus;
-import org.springframework.http.ResponseEntity;
-import org.springframework.mock.web.MockMultipartFile;
-
-import stirling.software.SPDF.model.api.converters.PdfToVideoRequest;
-import stirling.software.common.service.CustomPDFDocumentFactory;
-import stirling.software.common.util.CheckProgramInstall;
-import stirling.software.common.util.TempFileManager;
-
-@ExtendWith(MockitoExtension.class)
-class ConvertPdfToVideoControllerTest {
-
-    @Mock private CustomPDFDocumentFactory pdfDocumentFactory;
-    @Mock private TempFileManager tempFileManager;
-
-    @InjectMocks private ConvertPdfToVideoController controller;
-
-    @Test
-    void convertPdfToVideo_ffmpegNotAvailableThrows() {
-        PdfToVideoRequest request = new PdfToVideoRequest();
-        MockMultipartFile pdfFile =
-                new MockMultipartFile(
-                        "fileInput", "doc.pdf", "application/pdf", "content".getBytes());
-        request.setFileInput(pdfFile);
-
-        try (MockedStatic<CheckProgramInstall> mock =
-                Mockito.mockStatic(CheckProgramInstall.class)) {
-            mock.when(CheckProgramInstall::isFfmpegAvailable).thenReturn(false);
-
-            assertThrows(Exception.class, () -> controller.convertPdfToVideo(request));
-        }
-    }
-
-    @Test
-    void convertPdfToVideo_nullFileThrows() {
-        PdfToVideoRequest request = new PdfToVideoRequest();
-        request.setFileInput(null);
-
-        try (MockedStatic<CheckProgramInstall> mock =
-                Mockito.mockStatic(CheckProgramInstall.class)) {
-            mock.when(CheckProgramInstall::isFfmpegAvailable).thenReturn(true);
-
-            assertThrows(Exception.class, () -> controller.convertPdfToVideo(request));
-        }
-    }
-
-    @Test
-    void convertPdfToVideo_emptyFileThrows() {
-        PdfToVideoRequest request = new PdfToVideoRequest();
-        MockMultipartFile emptyFile =
-                new MockMultipartFile("fileInput", "doc.pdf", "application/pdf", new byte[0]);
-        request.setFileInput(emptyFile);
-
-        try (MockedStatic<CheckProgramInstall> mock =
-                Mockito.mockStatic(CheckProgramInstall.class)) {
-            mock.when(CheckProgramInstall::isFfmpegAvailable).thenReturn(true);
-
-            assertThrows(Exception.class, () -> controller.convertPdfToVideo(request));
-        }
-    }
-
-    @Test
-    void convertPdfToVideo_nonPdfContentTypeReturnsBadRequest() throws Exception {
-        PdfToVideoRequest request = new PdfToVideoRequest();
-        MockMultipartFile txtFile =
-                new MockMultipartFile("fileInput", "doc.txt", "text/plain", "content".getBytes());
-        request.setFileInput(txtFile);
-
-        try (MockedStatic<CheckProgramInstall> mock =
-                Mockito.mockStatic(CheckProgramInstall.class)) {
-            mock.when(CheckProgramInstall::isFfmpegAvailable).thenReturn(true);
-
-            ResponseEntity<byte[]> response = controller.convertPdfToVideo(request);
-
-            assertEquals(HttpStatus.BAD_REQUEST, response.getStatusCode());
-        }
-    }
-
-    @Test
-    void convertPdfToVideo_invalidOpacityThrows() {
-        PdfToVideoRequest request = new PdfToVideoRequest();
-        MockMultipartFile pdfFile =
-                new MockMultipartFile(
-                        "fileInput", "doc.pdf", "application/pdf", "content".getBytes());
-        request.setFileInput(pdfFile);
-        request.setOpacity(1.5f);
-
-        try (MockedStatic<CheckProgramInstall> mock =
-                Mockito.mockStatic(CheckProgramInstall.class)) {
-            mock.when(CheckProgramInstall::isFfmpegAvailable).thenReturn(true);
-
-            assertThrows(Exception.class, () -> controller.convertPdfToVideo(request));
-        }
-    }
-
-    @Test
-    void convertPdfToVideo_negativeOpacityThrows() {
-        PdfToVideoRequest request = new PdfToVideoRequest();
-        MockMultipartFile pdfFile =
-                new MockMultipartFile(
-                        "fileInput", "doc.pdf", "application/pdf", "content".getBytes());
-        request.setFileInput(pdfFile);
-        request.setOpacity(-0.1f);
-
-        try (MockedStatic<CheckProgramInstall> mock =
-                Mockito.mockStatic(CheckProgramInstall.class)) {
-            mock.when(CheckProgramInstall::isFfmpegAvailable).thenReturn(true);
-
-            assertThrows(Exception.class, () -> controller.convertPdfToVideo(request));
-        }
-    }
-
-    @Test
-    void convertPdfToVideo_negativeSecondsPerPageThrows() {
-        PdfToVideoRequest request = new PdfToVideoRequest();
-        MockMultipartFile pdfFile =
-                new MockMultipartFile(
-                        "fileInput", "doc.pdf", "application/pdf", "content".getBytes());
-        request.setFileInput(pdfFile);
-        request.setSecondsPerPage(-1);
-
-        try (MockedStatic<CheckProgramInstall> mock =
-                Mockito.mockStatic(CheckProgramInstall.class)) {
-            mock.when(CheckProgramInstall::isFfmpegAvailable).thenReturn(true);
-
-            assertThrows(Exception.class, () -> controller.convertPdfToVideo(request));
-        }
-    }
-
-    @Test
-    void convertPdfToVideo_zeroSecondsPerPageThrows() {
-        PdfToVideoRequest request = new PdfToVideoRequest();
-        MockMultipartFile pdfFile =
-                new MockMultipartFile(
-                        "fileInput", "doc.pdf", "application/pdf", "content".getBytes());
-        request.setFileInput(pdfFile);
-        request.setSecondsPerPage(0);
-
-        try (MockedStatic<CheckProgramInstall> mock =
-                Mockito.mockStatic(CheckProgramInstall.class)) {
-            mock.when(CheckProgramInstall::isFfmpegAvailable).thenReturn(true);
-
-            assertThrows(Exception.class, () -> controller.convertPdfToVideo(request));
-        }
-    }
-
-    @Test
-    void controllerIsConstructed() {
-        assertNotNull(controller);
-    }
-}
diff --git a/app/core/src/test/java/stirling/software/SPDF/controller/api/converters/ConvertSvgToPDFTest.java b/app/core/src/test/java/stirling/software/SPDF/controller/api/converters/ConvertSvgToPDFTest.java
index 642f16f3b8..7d727cec22 100644
--- a/app/core/src/test/java/stirling/software/SPDF/controller/api/converters/ConvertSvgToPDFTest.java
+++ b/app/core/src/test/java/stirling/software/SPDF/controller/api/converters/ConvertSvgToPDFTest.java
@@ -3,11 +3,17 @@ package stirling.software.SPDF.controller.api.converters;
 import static org.junit.jupiter.api.Assertions.assertEquals;
 import static org.junit.jupiter.api.Assertions.assertTrue;
 import static org.mockito.ArgumentMatchers.any;
+import static org.mockito.ArgumentMatchers.anyString;
+import static org.mockito.Mockito.lenient;
+import static org.mockito.Mockito.mock;
 import static org.mockito.Mockito.when;
 
+import java.io.File;
 import java.io.IOException;
 import java.nio.charset.StandardCharsets;
+import java.nio.file.Files;
 
+import org.junit.jupiter.api.BeforeEach;
 import org.junit.jupiter.api.Test;
 import org.junit.jupiter.api.extension.ExtendWith;
 import org.mockito.InjectMocks;
@@ -16,20 +22,31 @@ import org.mockito.MockedStatic;
 import org.mockito.Mockito;
 import org.mockito.junit.jupiter.MockitoExtension;
 import org.springframework.http.HttpStatus;
-import org.springframework.http.MediaType;
 import org.springframework.http.ResponseEntity;
 import org.springframework.mock.web.MockMultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import stirling.software.SPDF.model.api.converters.SvgToPdfRequest;
 import stirling.software.SPDF.utils.SvgToPdf;
 import stirling.software.common.service.CustomPDFDocumentFactory;
 import stirling.software.common.util.GeneralUtils;
 import stirling.software.common.util.SvgSanitizer;
+import stirling.software.common.util.TempFile;
 import stirling.software.common.util.TempFileManager;
 import stirling.software.common.util.WebResponseUtils;
 
 @ExtendWith(MockitoExtension.class)
 class ConvertSvgToPDFTest {
+    private static ResponseEntity<StreamingResponseBody> streamingOk(byte[] bytes) {
+        return ResponseEntity.ok(out -> out.write(bytes));
+    }
+
+    private static byte[] drainBody(ResponseEntity<StreamingResponseBody> response)
+            throws java.io.IOException {
+        java.io.ByteArrayOutputStream baos = new java.io.ByteArrayOutputStream();
+        response.getBody().writeTo(baos);
+        return baos.toByteArray();
+    }
 
     @Mock private CustomPDFDocumentFactory pdfDocumentFactory;
     @Mock private SvgSanitizer svgSanitizer;
@@ -37,16 +54,32 @@ class ConvertSvgToPDFTest {
 
     @InjectMocks private ConvertSvgToPDF controller;
 
+    @BeforeEach
+    void setUp() throws Exception {
+        lenient()
+                .when(tempFileManager.createManagedTempFile(anyString()))
+                .thenAnswer(
+                        inv -> {
+                            File f =
+                                    Files.createTempFile("test", inv.<String>getArgument(0))
+                                            .toFile();
+                            TempFile tf = mock(TempFile.class);
+                            lenient().when(tf.getFile()).thenReturn(f);
+                            lenient().when(tf.getPath()).thenReturn(f.toPath());
+                            return tf;
+                        });
+    }
+
     @Test
-    void convertSvgToPdf_nullFilesReturnsBadRequest() {
+    void convertSvgToPdf_nullFilesReturnsBadRequest() throws java.io.IOException {
         SvgToPdfRequest request = new SvgToPdfRequest();
         request.setFileInput(null);
 
-        ResponseEntity<byte[]> response = controller.convertSvgToPdf(request);
+        ResponseEntity<StreamingResponseBody> response = controller.convertSvgToPdf(request);
 
         assertEquals(HttpStatus.BAD_REQUEST, response.getStatusCode());
         assertTrue(
-                new String(response.getBody(), StandardCharsets.UTF_8)
+                new String(drainBody(response), StandardCharsets.UTF_8)
                         .contains("No files provided"));
     }
 
@@ -55,7 +88,7 @@ class ConvertSvgToPDFTest {
         SvgToPdfRequest request = new SvgToPdfRequest();
         request.setFileInput(new MockMultipartFile[0]);
 
-        ResponseEntity<byte[]> response = controller.convertSvgToPdf(request);
+        ResponseEntity<StreamingResponseBody> response = controller.convertSvgToPdf(request);
 
         assertEquals(HttpStatus.BAD_REQUEST, response.getStatusCode());
     }
@@ -69,10 +102,11 @@ class ConvertSvgToPDFTest {
         request.setFileInput(new MockMultipartFile[] {txtFile});
         request.setCombineIntoSinglePdf(false);
 
-        ResponseEntity<byte[]> response = controller.convertSvgToPdf(request);
+        ResponseEntity<StreamingResponseBody> response = controller.convertSvgToPdf(request);
 
         assertEquals(HttpStatus.BAD_REQUEST, response.getStatusCode());
-        assertTrue(new String(response.getBody(), StandardCharsets.UTF_8).contains("No valid SVG"));
+        assertTrue(
+                new String(drainBody(response), StandardCharsets.UTF_8).contains("No valid SVG"));
     }
 
     @Test
@@ -84,7 +118,7 @@ class ConvertSvgToPDFTest {
         request.setFileInput(new MockMultipartFile[] {emptyFile});
         request.setCombineIntoSinglePdf(false);
 
-        ResponseEntity<byte[]> response = controller.convertSvgToPdf(request);
+        ResponseEntity<StreamingResponseBody> response = controller.convertSvgToPdf(request);
 
         assertEquals(HttpStatus.BAD_REQUEST, response.getStatusCode());
     }
@@ -107,7 +141,7 @@ class ConvertSvgToPDFTest {
         when(pdfDocumentFactory.createNewBytesBasedOnOldDocument(pdfBytes))
                 .thenReturn(processedPdf);
 
-        ResponseEntity<byte[]> expectedResponse = ResponseEntity.ok(processedPdf);
+        ResponseEntity<StreamingResponseBody> expectedResponse = streamingOk(processedPdf);
 
         try (MockedStatic<SvgToPdf> svgMock = Mockito.mockStatic(SvgToPdf.class);
                 MockedStatic<GeneralUtils> guMock = Mockito.mockStatic(GeneralUtils.class);
@@ -121,11 +155,11 @@ class ConvertSvgToPDFTest {
 
             wrMock.when(
                             () ->
-                                    WebResponseUtils.bytesToWebResponse(
-                                            processedPdf, "drawing.pdf", MediaType.APPLICATION_PDF))
+                                    WebResponseUtils.pdfFileToWebResponse(
+                                            any(TempFile.class), anyString()))
                     .thenReturn(expectedResponse);
 
-            ResponseEntity<byte[]> response = controller.convertSvgToPdf(request);
+            ResponseEntity<StreamingResponseBody> response = controller.convertSvgToPdf(request);
 
             assertEquals(HttpStatus.OK, response.getStatusCode());
         }
@@ -154,7 +188,7 @@ class ConvertSvgToPDFTest {
         when(pdfDocumentFactory.createNewBytesBasedOnOldDocument(combinedPdf))
                 .thenReturn(processedPdf);
 
-        ResponseEntity<byte[]> expectedResponse = ResponseEntity.ok(processedPdf);
+        ResponseEntity<StreamingResponseBody> expectedResponse = streamingOk(processedPdf);
 
         try (MockedStatic<SvgToPdf> svgMock = Mockito.mockStatic(SvgToPdf.class);
                 MockedStatic<GeneralUtils> guMock = Mockito.mockStatic(GeneralUtils.class);
@@ -168,13 +202,11 @@ class ConvertSvgToPDFTest {
 
             wrMock.when(
                             () ->
-                                    WebResponseUtils.bytesToWebResponse(
-                                            processedPdf,
-                                            "a_combined.pdf",
-                                            MediaType.APPLICATION_PDF))
+                                    WebResponseUtils.pdfFileToWebResponse(
+                                            any(TempFile.class), anyString()))
                     .thenReturn(expectedResponse);
 
-            ResponseEntity<byte[]> response = controller.convertSvgToPdf(request);
+            ResponseEntity<StreamingResponseBody> response = controller.convertSvgToPdf(request);
 
             assertEquals(HttpStatus.OK, response.getStatusCode());
         }
@@ -189,7 +221,7 @@ class ConvertSvgToPDFTest {
         request.setFileInput(new MockMultipartFile[] {nullNameFile});
         request.setCombineIntoSinglePdf(false);
 
-        ResponseEntity<byte[]> response = controller.convertSvgToPdf(request);
+        ResponseEntity<StreamingResponseBody> response = controller.convertSvgToPdf(request);
 
         assertEquals(HttpStatus.BAD_REQUEST, response.getStatusCode());
     }
@@ -206,7 +238,7 @@ class ConvertSvgToPDFTest {
 
         when(svgSanitizer.sanitize(svgContent)).thenThrow(new IOException("sanitization error"));
 
-        ResponseEntity<byte[]> response = controller.convertSvgToPdf(request);
+        ResponseEntity<StreamingResponseBody> response = controller.convertSvgToPdf(request);
 
         assertEquals(HttpStatus.BAD_REQUEST, response.getStatusCode());
     }
diff --git a/app/core/src/test/java/stirling/software/SPDF/controller/api/converters/ConvertWebsiteToPdfTest.java b/app/core/src/test/java/stirling/software/SPDF/controller/api/converters/ConvertWebsiteToPdfTest.java
index a85e6a6666..c722b83c9d 100644
--- a/app/core/src/test/java/stirling/software/SPDF/controller/api/converters/ConvertWebsiteToPdfTest.java
+++ b/app/core/src/test/java/stirling/software/SPDF/controller/api/converters/ConvertWebsiteToPdfTest.java
@@ -4,9 +4,10 @@ import static org.junit.jupiter.api.Assertions.*;
 import static org.mockito.ArgumentMatchers.any;
 import static org.mockito.ArgumentMatchers.anyString;
 import static org.mockito.ArgumentMatchers.eq;
+import static org.mockito.Mockito.lenient;
+import static org.mockito.Mockito.mock;
 import static org.mockito.Mockito.when;
 
-import java.io.ByteArrayOutputStream;
 import java.io.File;
 import java.io.IOException;
 import java.lang.reflect.Method;
@@ -34,6 +35,7 @@ import org.springframework.http.ResponseEntity;
 import org.springframework.mock.web.MockHttpServletRequest;
 import org.springframework.web.context.request.RequestContextHolder;
 import org.springframework.web.context.request.ServletRequestAttributes;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import stirling.software.SPDF.model.api.converters.UrlToPdfRequest;
 import stirling.software.common.configuration.RuntimePathConfig;
@@ -43,13 +45,25 @@ import stirling.software.common.util.GeneralUtils;
 import stirling.software.common.util.ProcessExecutor;
 import stirling.software.common.util.ProcessExecutor.ProcessExecutorResult;
 import stirling.software.common.util.ProcessExecutor.Processes;
-import stirling.software.common.util.WebResponseUtils;
+import stirling.software.common.util.TempFile;
+import stirling.software.common.util.TempFileManager;
 
 public class ConvertWebsiteToPdfTest {
+    private static ResponseEntity<StreamingResponseBody> streamingOk(byte[] bytes) {
+        return ResponseEntity.ok(out -> out.write(bytes));
+    }
+
+    private static byte[] drainBody(ResponseEntity<StreamingResponseBody> response)
+            throws java.io.IOException {
+        java.io.ByteArrayOutputStream baos = new java.io.ByteArrayOutputStream();
+        response.getBody().writeTo(baos);
+        return baos.toByteArray();
+    }
 
     private static final Pattern PDF_FILENAME_PATTERN = Pattern.compile("[A-Za-z0-9_]+\\.pdf");
     @Mock private CustomPDFDocumentFactory pdfDocumentFactory;
     @Mock private RuntimePathConfig runtimePathConfig;
+    @Mock private TempFileManager tempFileManager;
 
     private ApplicationProperties applicationProperties;
     private ConvertWebsiteToPDF sut;
@@ -58,6 +72,18 @@ public class ConvertWebsiteToPdfTest {
     @BeforeEach
     void setUp() throws Exception {
         mocks = MockitoAnnotations.openMocks(this);
+        lenient()
+                .when(tempFileManager.createManagedTempFile(anyString()))
+                .thenAnswer(
+                        inv -> {
+                            File f =
+                                    Files.createTempFile("test", inv.<String>getArgument(0))
+                                            .toFile();
+                            TempFile tf = mock(TempFile.class);
+                            lenient().when(tf.getFile()).thenReturn(f);
+                            lenient().when(tf.getPath()).thenReturn(f.toPath());
+                            return tf;
+                        });
 
         // Enable feature (adjust structure for your project if necessary)
         applicationProperties = new ApplicationProperties();
@@ -68,7 +94,12 @@ public class ConvertWebsiteToPdfTest {
         when(pdfDocumentFactory.load(any(File.class))).thenReturn(new PDDocument());
 
         // Build SUT
-        sut = new ConvertWebsiteToPDF(pdfDocumentFactory, runtimePathConfig, applicationProperties);
+        sut =
+                new ConvertWebsiteToPDF(
+                        pdfDocumentFactory,
+                        runtimePathConfig,
+                        applicationProperties,
+                        tempFileManager);
 
         // Provide RequestContext for ServletUriComponentsBuilder
         MockHttpServletRequest req = new MockHttpServletRequest();
@@ -172,38 +203,29 @@ public class ConvertWebsiteToPdfTest {
         request.setUrlInput("https://example.com");
 
         try (MockedStatic<ProcessExecutor> pe = Mockito.mockStatic(ProcessExecutor.class);
-                MockedStatic<WebResponseUtils> wr = Mockito.mockStatic(WebResponseUtils.class);
                 MockedStatic<GeneralUtils> gu = Mockito.mockStatic(GeneralUtils.class);
                 MockedStatic<HttpClient> httpClient = mockHttpClientReturning("<html></html>")) {
 
-            // Force URL checks to be positive
             gu.when(() -> GeneralUtils.isValidURL("https://example.com")).thenReturn(true);
             gu.when(() -> GeneralUtils.isURLReachable("https://example.com")).thenReturn(true);
+            gu.when(() -> GeneralUtils.convertToFileName(anyString())).thenReturn("example_com");
+            gu.when(() -> GeneralUtils.generateFilename(anyString(), anyString()))
+                    .thenAnswer(inv -> inv.<String>getArgument(0) + inv.<String>getArgument(1));
 
-            // correct ProcessExecutor!
             ProcessExecutor mockExec = Mockito.mock(ProcessExecutor.class);
             pe.when(() -> ProcessExecutor.getInstance(Processes.WEASYPRINT)).thenReturn(mockExec);
 
             @SuppressWarnings("unchecked")
             ArgumentCaptor<List<String>> cmdCaptor = ArgumentCaptor.forClass(List.class);
 
-            // Return value of correct type
             ProcessExecutorResult dummyResult = Mockito.mock(ProcessExecutorResult.class);
             when(mockExec.runCommandWithOutputHandling(cmdCaptor.capture()))
                     .thenReturn(dummyResult);
 
-            ResponseEntity<byte[]> fakeResponse = ResponseEntity.ok(new byte[0]);
-
-            wr.when(
-                            () ->
-                                    WebResponseUtils.baosToWebResponse(
-                                            any(ByteArrayOutputStream.class), any()))
-                    .thenReturn(fakeResponse);
-
-            // Act
             ResponseEntity<?> resp = sut.urlToPdf(request);
 
-            // Assert – Response OK
+            // Assert
+            assertNotNull(resp);
             assertEquals(HttpStatus.OK, resp.getStatusCode());
 
             // Assert – WeasyPrint command correct
@@ -236,17 +258,19 @@ public class ConvertWebsiteToPdfTest {
 
         try (MockedStatic<GeneralUtils> gu = Mockito.mockStatic(GeneralUtils.class);
                 MockedStatic<ProcessExecutor> pe = Mockito.mockStatic(ProcessExecutor.class);
-                MockedStatic<WebResponseUtils> wr = Mockito.mockStatic(WebResponseUtils.class);
                 MockedStatic<Files> files = Mockito.mockStatic(Files.class);
                 MockedStatic<HttpClient> httpClient = mockHttpClientReturning("<html></html>")) {
 
-            // Force URL checks to be positive
             gu.when(() -> GeneralUtils.isValidURL("https://example.com")).thenReturn(true);
             gu.when(() -> GeneralUtils.isURLReachable("https://example.com")).thenReturn(true);
+            gu.when(() -> GeneralUtils.convertToFileName(anyString())).thenReturn("example_com");
+            gu.when(() -> GeneralUtils.generateFilename(anyString(), anyString()))
+                    .thenAnswer(inv -> inv.<String>getArgument(0) + inv.<String>getArgument(1));
 
-            // Force temp files + provoke delete error
             files.when(() -> Files.createTempFile("url_input_", ".html")).thenReturn(htmlTemp);
             files.when(() -> Files.createTempFile("output_", ".pdf")).thenReturn(preCreatedTemp);
+            files.when(() -> Files.createTempFile(eq("test"), anyString()))
+                    .thenReturn(preCreatedTemp);
             files.when(
                             () ->
                                     Files.writeString(
@@ -257,26 +281,20 @@ public class ConvertWebsiteToPdfTest {
             files.when(() -> Files.deleteIfExists(htmlTemp)).thenReturn(true);
             files.when(() -> Files.deleteIfExists(preCreatedTemp))
                     .thenThrow(new IOException("fail delete"));
-            files.when(() -> Files.exists(preCreatedTemp)).thenReturn(true); // for the assert
+            files.when(() -> Files.exists(preCreatedTemp)).thenReturn(true);
+            files.when(() -> Files.size(any(Path.class))).thenReturn(100L);
+            files.when(() -> Files.copy(any(Path.class), any(java.io.OutputStream.class)))
+                    .thenReturn(0L);
+            files.when(() -> Files.newOutputStream(any(Path.class)))
+                    .thenAnswer(inv -> new java.io.ByteArrayOutputStream());
 
-            // ProcessExecutor
             ProcessExecutor mockExec = Mockito.mock(ProcessExecutor.class);
             pe.when(() -> ProcessExecutor.getInstance(Processes.WEASYPRINT)).thenReturn(mockExec);
             ProcessExecutorResult dummy = Mockito.mock(ProcessExecutorResult.class);
             when(mockExec.runCommandWithOutputHandling(Mockito.<List>any())).thenReturn(dummy);
 
-            // WebResponseUtils
-            ResponseEntity<byte[]> fakeResponse = ResponseEntity.ok(new byte[0]);
-            wr.when(
-                            () ->
-                                    WebResponseUtils.baosToWebResponse(
-                                            any(ByteArrayOutputStream.class), any()))
-                    .thenReturn(fakeResponse);
-
-            // Act: should not throw and should return a Response
             ResponseEntity<?> resp = assertDoesNotThrow(() -> sut.urlToPdf(request));
 
-            // Assert
             assertNotNull(resp, "Response should not be null");
             assertEquals(HttpStatus.OK, resp.getStatusCode());
             assertTrue(
diff --git a/app/core/src/test/java/stirling/software/SPDF/controller/api/converters/PdfVectorExportControllerTest.java b/app/core/src/test/java/stirling/software/SPDF/controller/api/converters/PdfVectorExportControllerTest.java
index ad63b21039..20f881e5ac 100644
--- a/app/core/src/test/java/stirling/software/SPDF/controller/api/converters/PdfVectorExportControllerTest.java
+++ b/app/core/src/test/java/stirling/software/SPDF/controller/api/converters/PdfVectorExportControllerTest.java
@@ -3,11 +3,13 @@ package stirling.software.SPDF.controller.api.converters;
 import static org.assertj.core.api.Assertions.assertThat;
 import static org.junit.jupiter.api.Assertions.assertThrows;
 import static org.mockito.ArgumentMatchers.any;
+import static org.mockito.ArgumentMatchers.anyString;
 import static org.mockito.Mockito.lenient;
 import static org.mockito.Mockito.mock;
 import static org.mockito.Mockito.reset;
 import static org.mockito.Mockito.when;
 
+import java.io.File;
 import java.lang.reflect.Field;
 import java.nio.file.Files;
 import java.nio.file.Path;
@@ -25,11 +27,13 @@ import org.mockito.junit.jupiter.MockitoExtension;
 import org.springframework.http.MediaType;
 import org.springframework.http.ResponseEntity;
 import org.springframework.mock.web.MockMultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import stirling.software.SPDF.config.EndpointConfiguration;
 import stirling.software.SPDF.model.api.converters.PdfVectorExportRequest;
 import stirling.software.common.util.ProcessExecutor;
 import stirling.software.common.util.ProcessExecutor.ProcessExecutorResult;
+import stirling.software.common.util.TempFile;
 import stirling.software.common.util.TempFileManager;
 
 @ExtendWith(MockitoExtension.class)
@@ -44,6 +48,18 @@ class PdfVectorExportControllerTest {
 
     @BeforeEach
     void setup() throws Exception {
+        lenient()
+                .when(tempFileManager.createManagedTempFile(anyString()))
+                .thenAnswer(
+                        inv -> {
+                            File f =
+                                    Files.createTempFile("test", inv.<String>getArgument(0))
+                                            .toFile();
+                            TempFile tf = mock(TempFile.class);
+                            lenient().when(tf.getFile()).thenReturn(f);
+                            lenient().when(tf.getPath()).thenReturn(f.toPath());
+                            return tf;
+                        });
         when(tempFileManager.createTempFile(any()))
                 .thenAnswer(
                         invocation -> {
@@ -106,7 +122,8 @@ class PdfVectorExportControllerTest {
         PdfVectorExportRequest request = new PdfVectorExportRequest();
         request.setFileInput(file);
 
-        ResponseEntity<byte[]> response = controller.convertGhostscriptInputsToPdf(request);
+        ResponseEntity<StreamingResponseBody> response =
+                controller.convertGhostscriptInputsToPdf(request);
 
         assertThat(response.getStatusCode()).isEqualTo(org.springframework.http.HttpStatus.OK);
         assertThat(response.getHeaders().getContentType()).isEqualTo(MediaType.APPLICATION_PDF);
@@ -123,11 +140,14 @@ class PdfVectorExportControllerTest {
         PdfVectorExportRequest request = new PdfVectorExportRequest();
         request.setFileInput(file);
 
-        ResponseEntity<byte[]> response = controller.convertGhostscriptInputsToPdf(request);
+        ResponseEntity<StreamingResponseBody> response =
+                controller.convertGhostscriptInputsToPdf(request);
 
         assertThat(response.getStatusCode()).isEqualTo(org.springframework.http.HttpStatus.OK);
         assertThat(response.getHeaders().getContentType()).isEqualTo(MediaType.APPLICATION_PDF);
-        assertThat(response.getBody()).contains(content);
+        java.io.ByteArrayOutputStream baosVerify = new java.io.ByteArrayOutputStream();
+        response.getBody().writeTo(baosVerify);
+        assertThat(baosVerify.toByteArray()).contains(content);
     }
 
     @Test
diff --git a/app/core/src/test/java/stirling/software/SPDF/controller/api/filters/FilterControllerTest.java b/app/core/src/test/java/stirling/software/SPDF/controller/api/filters/FilterControllerTest.java
index 0b73d3f7f9..df988f52fd 100644
--- a/app/core/src/test/java/stirling/software/SPDF/controller/api/filters/FilterControllerTest.java
+++ b/app/core/src/test/java/stirling/software/SPDF/controller/api/filters/FilterControllerTest.java
@@ -17,6 +17,7 @@ import org.springframework.http.HttpStatus;
 import org.springframework.http.MediaType;
 import org.springframework.http.ResponseEntity;
 import org.springframework.mock.web.MockMultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import stirling.software.SPDF.model.api.PDFComparisonAndCount;
 import stirling.software.SPDF.model.api.PDFWithPageNums;
@@ -26,12 +27,24 @@ import stirling.software.SPDF.model.api.filter.PageRotationRequest;
 import stirling.software.SPDF.model.api.filter.PageSizeRequest;
 import stirling.software.common.service.CustomPDFDocumentFactory;
 import stirling.software.common.util.PdfUtils;
+import stirling.software.common.util.TempFileManager;
 import stirling.software.common.util.WebResponseUtils;
 
 @ExtendWith(MockitoExtension.class)
 class FilterControllerTest {
+    private static ResponseEntity<StreamingResponseBody> streamingOk(byte[] bytes) {
+        return ResponseEntity.ok(out -> out.write(bytes));
+    }
+
+    private static byte[] drainBody(ResponseEntity<StreamingResponseBody> response)
+            throws java.io.IOException {
+        java.io.ByteArrayOutputStream baos = new java.io.ByteArrayOutputStream();
+        response.getBody().writeTo(baos);
+        return baos.toByteArray();
+    }
 
     @Mock private CustomPDFDocumentFactory pdfDocumentFactory;
+    @Mock private TempFileManager tempFileManager;
 
     @InjectMocks private FilterController filterController;
 
@@ -59,19 +72,22 @@ class FilterControllerTest {
         PDDocument mockDoc = mock(PDDocument.class);
         when(pdfDocumentFactory.load(mockFile)).thenReturn(mockDoc);
 
-        ResponseEntity<byte[]> expectedResponse = ResponseEntity.ok(new byte[] {1, 2, 3});
+        ResponseEntity<StreamingResponseBody> expectedResponse = streamingOk(new byte[] {1, 2, 3});
 
         try (MockedStatic<PdfUtils> pdfUtilsMock = mockStatic(PdfUtils.class);
                 MockedStatic<WebResponseUtils> webMock = mockStatic(WebResponseUtils.class)) {
 
             pdfUtilsMock.when(() -> PdfUtils.hasText(mockDoc, "all", "hello")).thenReturn(true);
-            webMock.when(() -> WebResponseUtils.pdfDocToWebResponse(mockDoc, "test.pdf"))
+            webMock.when(
+                            () ->
+                                    WebResponseUtils.pdfDocToWebResponse(
+                                            mockDoc, "test.pdf", tempFileManager))
                     .thenReturn(expectedResponse);
 
-            ResponseEntity<byte[]> result = filterController.containsText(request);
+            ResponseEntity<StreamingResponseBody> result = filterController.containsText(request);
 
             assertEquals(HttpStatus.OK, result.getStatusCode());
-            assertArrayEquals(new byte[] {1, 2, 3}, result.getBody());
+            assertArrayEquals(new byte[] {1, 2, 3}, drainBody(result));
         }
     }
 
@@ -88,7 +104,7 @@ class FilterControllerTest {
         try (MockedStatic<PdfUtils> pdfUtilsMock = mockStatic(PdfUtils.class)) {
             pdfUtilsMock.when(() -> PdfUtils.hasText(mockDoc, "all", "missing")).thenReturn(false);
 
-            ResponseEntity<byte[]> result = filterController.containsText(request);
+            ResponseEntity<StreamingResponseBody> result = filterController.containsText(request);
 
             assertEquals(HttpStatus.NO_CONTENT, result.getStatusCode());
             assertNull(result.getBody());
@@ -106,19 +122,22 @@ class FilterControllerTest {
         PDDocument mockDoc = mock(PDDocument.class);
         when(pdfDocumentFactory.load(mockFile)).thenReturn(mockDoc);
 
-        ResponseEntity<byte[]> expectedResponse = ResponseEntity.ok(new byte[] {4, 5, 6});
+        ResponseEntity<StreamingResponseBody> expectedResponse = streamingOk(new byte[] {4, 5, 6});
 
         try (MockedStatic<PdfUtils> pdfUtilsMock = mockStatic(PdfUtils.class);
                 MockedStatic<WebResponseUtils> webMock = mockStatic(WebResponseUtils.class)) {
 
             pdfUtilsMock.when(() -> PdfUtils.hasImages(mockDoc, "all")).thenReturn(true);
-            webMock.when(() -> WebResponseUtils.pdfDocToWebResponse(mockDoc, "test.pdf"))
+            webMock.when(
+                            () ->
+                                    WebResponseUtils.pdfDocToWebResponse(
+                                            mockDoc, "test.pdf", tempFileManager))
                     .thenReturn(expectedResponse);
 
-            ResponseEntity<byte[]> result = filterController.containsImage(request);
+            ResponseEntity<StreamingResponseBody> result = filterController.containsImage(request);
 
             assertEquals(HttpStatus.OK, result.getStatusCode());
-            assertArrayEquals(new byte[] {4, 5, 6}, result.getBody());
+            assertArrayEquals(new byte[] {4, 5, 6}, drainBody(result));
         }
     }
 
@@ -134,7 +153,7 @@ class FilterControllerTest {
         try (MockedStatic<PdfUtils> pdfUtilsMock = mockStatic(PdfUtils.class)) {
             pdfUtilsMock.when(() -> PdfUtils.hasImages(mockDoc, "1")).thenReturn(false);
 
-            ResponseEntity<byte[]> result = filterController.containsImage(request);
+            ResponseEntity<StreamingResponseBody> result = filterController.containsImage(request);
 
             assertEquals(HttpStatus.NO_CONTENT, result.getStatusCode());
         }
diff --git a/app/core/src/test/java/stirling/software/SPDF/controller/api/form/FormFillControllerTest.java b/app/core/src/test/java/stirling/software/SPDF/controller/api/form/FormFillControllerTest.java
index 539fa250e7..0db7f60514 100644
--- a/app/core/src/test/java/stirling/software/SPDF/controller/api/form/FormFillControllerTest.java
+++ b/app/core/src/test/java/stirling/software/SPDF/controller/api/form/FormFillControllerTest.java
@@ -2,10 +2,13 @@ package stirling.software.SPDF.controller.api.form;
 
 import static org.assertj.core.api.Assertions.*;
 import static org.mockito.ArgumentMatchers.*;
+import static org.mockito.ArgumentMatchers.anyString;
 import static org.mockito.Mockito.*;
 
 import java.io.ByteArrayOutputStream;
+import java.io.File;
 import java.io.IOException;
+import java.nio.file.Files;
 
 import org.apache.pdfbox.pdmodel.PDDocument;
 import org.apache.pdfbox.pdmodel.PDPage;
@@ -22,8 +25,11 @@ import org.mockito.junit.jupiter.MockitoExtension;
 import org.springframework.http.HttpStatus;
 import org.springframework.http.ResponseEntity;
 import org.springframework.mock.web.MockMultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import stirling.software.common.service.CustomPDFDocumentFactory;
+import stirling.software.common.util.TempFile;
+import stirling.software.common.util.TempFileManager;
 
 import tools.jackson.databind.ObjectMapper;
 import tools.jackson.databind.json.JsonMapper;
@@ -31,8 +37,19 @@ import tools.jackson.databind.json.JsonMapper;
 @ExtendWith(MockitoExtension.class)
 @DisplayName("FormFillController Tests")
 class FormFillControllerTest {
+    private static ResponseEntity<StreamingResponseBody> streamingOk(byte[] bytes) {
+        return ResponseEntity.ok(out -> out.write(bytes));
+    }
+
+    private static byte[] drainBody(ResponseEntity<StreamingResponseBody> response)
+            throws java.io.IOException {
+        java.io.ByteArrayOutputStream baos = new java.io.ByteArrayOutputStream();
+        response.getBody().writeTo(baos);
+        return baos.toByteArray();
+    }
 
     @Mock private CustomPDFDocumentFactory pdfDocumentFactory;
+    @Mock private TempFileManager tempFileManager;
 
     private ObjectMapper realObjectMapper;
 
@@ -40,6 +57,18 @@ class FormFillControllerTest {
 
     @BeforeEach
     void setUp() throws Exception {
+        lenient()
+                .when(tempFileManager.createManagedTempFile(anyString()))
+                .thenAnswer(
+                        inv -> {
+                            File f =
+                                    Files.createTempFile("test", inv.<String>getArgument(0))
+                                            .toFile();
+                            TempFile tf = mock(TempFile.class);
+                            lenient().when(tf.getFile()).thenReturn(f);
+                            lenient().when(tf.getPath()).thenReturn(f.toPath());
+                            return tf;
+                        });
         realObjectMapper = JsonMapper.builder().build();
         // Inject real ObjectMapper via reflection since @InjectMocks uses the mock
         var field = FormFillController.class.getDeclaredField("objectMapper");
@@ -203,7 +232,8 @@ class FormFillControllerTest {
             when(pdfDocumentFactory.load(eq(file))).thenReturn(doc);
 
             byte[] payload = "{\"field1\":\"value1\"}".getBytes();
-            ResponseEntity<byte[]> response = controller.fillForm(file, payload, false);
+            ResponseEntity<StreamingResponseBody> response =
+                    controller.fillForm(file, payload, false);
 
             assertThat(response.getStatusCode()).isEqualTo(HttpStatus.OK);
             assertThat(response.getBody()).isNotNull();
@@ -216,7 +246,7 @@ class FormFillControllerTest {
             PDDocument doc = createMinimalPdf();
             when(pdfDocumentFactory.load(eq(file))).thenReturn(doc);
 
-            ResponseEntity<byte[]> response = controller.fillForm(file, null, false);
+            ResponseEntity<StreamingResponseBody> response = controller.fillForm(file, null, false);
 
             assertThat(response.getStatusCode()).isEqualTo(HttpStatus.OK);
         }
@@ -257,7 +287,7 @@ class FormFillControllerTest {
             when(pdfDocumentFactory.load(eq(file))).thenReturn(doc);
 
             byte[] payload = "[\"field1\"]".getBytes();
-            ResponseEntity<byte[]> response = controller.deleteFields(file, payload);
+            ResponseEntity<StreamingResponseBody> response = controller.deleteFields(file, payload);
 
             assertThat(response.getStatusCode()).isEqualTo(HttpStatus.OK);
         }
@@ -293,7 +323,8 @@ class FormFillControllerTest {
             String json =
                     "[{\"targetName\":\"f1\",\"name\":null,\"label\":null,\"type\":null,"
                             + "\"required\":null,\"multiSelect\":null,\"options\":null,\"defaultValue\":\"newVal\",\"tooltip\":null}]";
-            ResponseEntity<byte[]> response = controller.modifyFields(file, json.getBytes());
+            ResponseEntity<StreamingResponseBody> response =
+                    controller.modifyFields(file, json.getBytes());
 
             assertThat(response.getStatusCode()).isEqualTo(HttpStatus.OK);
         }
diff --git a/app/core/src/test/java/stirling/software/SPDF/controller/api/misc/AttachmentControllerTest.java b/app/core/src/test/java/stirling/software/SPDF/controller/api/misc/AttachmentControllerTest.java
index fe0e2ca2d6..b3e4690cc7 100644
--- a/app/core/src/test/java/stirling/software/SPDF/controller/api/misc/AttachmentControllerTest.java
+++ b/app/core/src/test/java/stirling/software/SPDF/controller/api/misc/AttachmentControllerTest.java
@@ -1,9 +1,12 @@
 package stirling.software.SPDF.controller.api.misc;
 
 import static org.junit.jupiter.api.Assertions.*;
+import static org.mockito.ArgumentMatchers.anyString;
 import static org.mockito.Mockito.*;
 
+import java.io.File;
 import java.io.IOException;
+import java.nio.file.Files;
 import java.util.List;
 
 import org.apache.pdfbox.pdmodel.PDDocument;
@@ -19,18 +22,32 @@ import org.springframework.http.MediaType;
 import org.springframework.http.ResponseEntity;
 import org.springframework.mock.web.MockMultipartFile;
 import org.springframework.web.multipart.MultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import stirling.software.SPDF.model.api.misc.AddAttachmentRequest;
 import stirling.software.SPDF.service.AttachmentServiceInterface;
 import stirling.software.common.service.CustomPDFDocumentFactory;
+import stirling.software.common.util.TempFile;
+import stirling.software.common.util.TempFileManager;
 import stirling.software.common.util.WebResponseUtils;
 
 @ExtendWith(MockitoExtension.class)
 class AttachmentControllerTest {
+    private static ResponseEntity<StreamingResponseBody> streamingOk(byte[] bytes) {
+        return ResponseEntity.ok(out -> out.write(bytes));
+    }
+
+    private static byte[] drainBody(ResponseEntity<StreamingResponseBody> response)
+            throws java.io.IOException {
+        java.io.ByteArrayOutputStream baos = new java.io.ByteArrayOutputStream();
+        response.getBody().writeTo(baos);
+        return baos.toByteArray();
+    }
 
     @Mock private CustomPDFDocumentFactory pdfDocumentFactory;
 
     @Mock private AttachmentServiceInterface pdfAttachmentService;
+    @Mock private TempFileManager tempFileManager;
 
     @InjectMocks private AttachmentController attachmentController;
 
@@ -42,7 +59,19 @@ class AttachmentControllerTest {
     private PDDocument modifiedMockDocument;
 
     @BeforeEach
-    void setUp() {
+    void setUp() throws Exception {
+        lenient()
+                .when(tempFileManager.createManagedTempFile(anyString()))
+                .thenAnswer(
+                        inv -> {
+                            File f =
+                                    Files.createTempFile("test", inv.<String>getArgument(0))
+                                            .toFile();
+                            TempFile tf = mock(TempFile.class);
+                            lenient().when(tf.getFile()).thenReturn(f);
+                            lenient().when(tf.getPath()).thenReturn(f.toPath());
+                            return tf;
+                        });
         pdfFile =
                 new MockMultipartFile(
                         "fileInput",
@@ -71,8 +100,8 @@ class AttachmentControllerTest {
         List<MultipartFile> attachments = List.of(attachment1, attachment2);
         request.setAttachments(attachments);
         request.setFileInput(pdfFile);
-        ResponseEntity<byte[]> expectedResponse =
-                ResponseEntity.ok("modified PDF content".getBytes());
+        ResponseEntity<StreamingResponseBody> expectedResponse =
+                streamingOk("modified PDF content".getBytes());
 
         when(pdfDocumentFactory.load(request, false)).thenReturn(mockDocument);
         when(pdfAttachmentService.addAttachment(mockDocument, attachments))
@@ -84,10 +113,13 @@ class AttachmentControllerTest {
                     .when(
                             () ->
                                     WebResponseUtils.pdfDocToWebResponse(
-                                            eq(mockDocument), eq("test_with_attachments.pdf")))
+                                            any(PDDocument.class),
+                                            anyString(),
+                                            any(TempFileManager.class)))
                     .thenReturn(expectedResponse);
 
-            ResponseEntity<byte[]> response = attachmentController.addAttachments(request);
+            ResponseEntity<StreamingResponseBody> response =
+                    attachmentController.addAttachments(request);
 
             assertNotNull(response);
             assertEquals(HttpStatus.OK, response.getStatusCode());
@@ -102,8 +134,8 @@ class AttachmentControllerTest {
         List<MultipartFile> attachments = List.of(attachment1);
         request.setAttachments(attachments);
         request.setFileInput(pdfFile);
-        ResponseEntity<byte[]> expectedResponse =
-                ResponseEntity.ok("modified PDF content".getBytes());
+        ResponseEntity<StreamingResponseBody> expectedResponse =
+                streamingOk("modified PDF content".getBytes());
 
         when(pdfDocumentFactory.load(request, false)).thenReturn(mockDocument);
         when(pdfAttachmentService.addAttachment(mockDocument, attachments))
@@ -115,10 +147,13 @@ class AttachmentControllerTest {
                     .when(
                             () ->
                                     WebResponseUtils.pdfDocToWebResponse(
-                                            eq(mockDocument), eq("test_with_attachments.pdf")))
+                                            any(PDDocument.class),
+                                            anyString(),
+                                            any(TempFileManager.class)))
                     .thenReturn(expectedResponse);
 
-            ResponseEntity<byte[]> response = attachmentController.addAttachments(request);
+            ResponseEntity<StreamingResponseBody> response =
+                    attachmentController.addAttachments(request);
 
             assertNotNull(response);
             assertEquals(HttpStatus.OK, response.getStatusCode());
diff --git a/app/core/src/test/java/stirling/software/SPDF/controller/api/misc/AutoRenameControllerTest.java b/app/core/src/test/java/stirling/software/SPDF/controller/api/misc/AutoRenameControllerTest.java
index ce82c8c7ec..3cdf0a3a84 100644
--- a/app/core/src/test/java/stirling/software/SPDF/controller/api/misc/AutoRenameControllerTest.java
+++ b/app/core/src/test/java/stirling/software/SPDF/controller/api/misc/AutoRenameControllerTest.java
@@ -1,8 +1,10 @@
 package stirling.software.SPDF.controller.api.misc;
 
 import static org.assertj.core.api.Assertions.*;
+import static org.mockito.ArgumentMatchers.anyString;
 import static org.mockito.Mockito.*;
 
+import java.io.File;
 import java.io.IOException;
 import java.nio.file.Files;
 import java.nio.file.Path;
@@ -14,6 +16,7 @@ import org.apache.pdfbox.pdmodel.PDPageContentStream;
 import org.apache.pdfbox.pdmodel.common.PDRectangle;
 import org.apache.pdfbox.pdmodel.font.PDType1Font;
 import org.apache.pdfbox.pdmodel.font.Standard14Fonts;
+import org.junit.jupiter.api.BeforeEach;
 import org.junit.jupiter.api.Test;
 import org.junit.jupiter.api.extension.ExtendWith;
 import org.junit.jupiter.api.io.TempDir;
@@ -24,17 +27,47 @@ import org.springframework.http.HttpStatus;
 import org.springframework.http.MediaType;
 import org.springframework.http.ResponseEntity;
 import org.springframework.mock.web.MockMultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import stirling.software.SPDF.model.api.misc.ExtractHeaderRequest;
 import stirling.software.common.service.CustomPDFDocumentFactory;
+import stirling.software.common.util.TempFile;
+import stirling.software.common.util.TempFileManager;
 
 @ExtendWith(MockitoExtension.class)
 class AutoRenameControllerTest {
+    private static ResponseEntity<StreamingResponseBody> streamingOk(byte[] bytes) {
+        return ResponseEntity.ok(out -> out.write(bytes));
+    }
+
+    private static byte[] drainBody(ResponseEntity<StreamingResponseBody> response)
+            throws java.io.IOException {
+        java.io.ByteArrayOutputStream baos = new java.io.ByteArrayOutputStream();
+        response.getBody().writeTo(baos);
+        return baos.toByteArray();
+    }
 
     @TempDir Path tempDir;
     @Mock private CustomPDFDocumentFactory pdfDocumentFactory;
+    @Mock private TempFileManager tempFileManager;
     @InjectMocks private AutoRenameController controller;
 
+    @BeforeEach
+    void setUp() throws Exception {
+        lenient()
+                .when(tempFileManager.createManagedTempFile(anyString()))
+                .thenAnswer(
+                        inv -> {
+                            File f =
+                                    Files.createTempFile("test", inv.<String>getArgument(0))
+                                            .toFile();
+                            TempFile tf = mock(TempFile.class);
+                            lenient().when(tf.getFile()).thenReturn(f);
+                            lenient().when(tf.getPath()).thenReturn(f.toPath());
+                            return tf;
+                        });
+    }
+
     private MockMultipartFile createPdfWithText(String text, float fontSize) throws IOException {
         Path path = tempDir.resolve("test.pdf");
         try (PDDocument doc = new PDDocument()) {
@@ -68,10 +101,10 @@ class AutoRenameControllerTest {
         PDDocument doc = Loader.loadPDF(file.getBytes());
         when(pdfDocumentFactory.load(file)).thenReturn(doc);
 
-        ResponseEntity<byte[]> response = controller.extractHeader(request);
+        ResponseEntity<StreamingResponseBody> response = controller.extractHeader(request);
 
         assertThat(response.getStatusCode()).isEqualTo(HttpStatus.OK);
-        assertThat(response.getBody()).isNotEmpty();
+        assertThat(drainBody(response)).isNotEmpty();
         String contentDisposition = response.getHeaders().getFirst("Content-Disposition");
         assertThat(contentDisposition).contains(".pdf");
     }
@@ -94,7 +127,7 @@ class AutoRenameControllerTest {
         PDDocument doc = Loader.loadPDF(file.getBytes());
         when(pdfDocumentFactory.load(file)).thenReturn(doc);
 
-        ResponseEntity<byte[]> response = controller.extractHeader(request);
+        ResponseEntity<StreamingResponseBody> response = controller.extractHeader(request);
 
         assertThat(response.getStatusCode()).isEqualTo(HttpStatus.OK);
     }
@@ -107,7 +140,7 @@ class AutoRenameControllerTest {
         PDDocument doc = Loader.loadPDF(file.getBytes());
         when(pdfDocumentFactory.load(file)).thenReturn(doc);
 
-        ResponseEntity<byte[]> response = controller.extractHeader(request);
+        ResponseEntity<StreamingResponseBody> response = controller.extractHeader(request);
 
         assertThat(response.getStatusCode()).isEqualTo(HttpStatus.OK);
     }
@@ -155,7 +188,7 @@ class AutoRenameControllerTest {
         PDDocument doc = Loader.loadPDF(file.getBytes());
         when(pdfDocumentFactory.load(file)).thenReturn(doc);
 
-        ResponseEntity<byte[]> response = controller.extractHeader(request);
+        ResponseEntity<StreamingResponseBody> response = controller.extractHeader(request);
 
         assertThat(response.getStatusCode()).isEqualTo(HttpStatus.OK);
         // The largest font text should be used as title (URL-encoded in Content-Disposition)
@@ -173,7 +206,7 @@ class AutoRenameControllerTest {
         PDDocument doc = Loader.loadPDF(file.getBytes());
         when(pdfDocumentFactory.load(file)).thenReturn(doc);
 
-        ResponseEntity<byte[]> response = controller.extractHeader(request);
+        ResponseEntity<StreamingResponseBody> response = controller.extractHeader(request);
 
         assertThat(response.getStatusCode()).isEqualTo(HttpStatus.OK);
         // Should fallback to original filename since header is too long
@@ -189,7 +222,7 @@ class AutoRenameControllerTest {
         PDDocument doc = Loader.loadPDF(file.getBytes());
         when(pdfDocumentFactory.load(file)).thenReturn(doc);
 
-        ResponseEntity<byte[]> response = controller.extractHeader(request);
+        ResponseEntity<StreamingResponseBody> response = controller.extractHeader(request);
 
         assertThat(response.getStatusCode()).isEqualTo(HttpStatus.OK);
         // Special characters should be sanitized
@@ -215,7 +248,7 @@ class AutoRenameControllerTest {
         PDDocument doc = Loader.loadPDF(file.getBytes());
         when(pdfDocumentFactory.load(file)).thenReturn(doc);
 
-        ResponseEntity<byte[]> response = controller.extractHeader(request);
+        ResponseEntity<StreamingResponseBody> response = controller.extractHeader(request);
 
         assertThat(response.getStatusCode()).isEqualTo(HttpStatus.OK);
     }
diff --git a/app/core/src/test/java/stirling/software/SPDF/controller/api/misc/DecompressPdfControllerTest.java b/app/core/src/test/java/stirling/software/SPDF/controller/api/misc/DecompressPdfControllerTest.java
index 1be522272d..dd7541e635 100644
--- a/app/core/src/test/java/stirling/software/SPDF/controller/api/misc/DecompressPdfControllerTest.java
+++ b/app/core/src/test/java/stirling/software/SPDF/controller/api/misc/DecompressPdfControllerTest.java
@@ -1,8 +1,10 @@
 package stirling.software.SPDF.controller.api.misc;
 
 import static org.assertj.core.api.Assertions.*;
+import static org.mockito.ArgumentMatchers.anyString;
 import static org.mockito.Mockito.*;
 
+import java.io.File;
 import java.io.IOException;
 import java.nio.file.Files;
 import java.nio.file.Path;
@@ -14,6 +16,7 @@ import org.apache.pdfbox.pdmodel.PDPageContentStream;
 import org.apache.pdfbox.pdmodel.common.PDRectangle;
 import org.apache.pdfbox.pdmodel.font.PDType1Font;
 import org.apache.pdfbox.pdmodel.font.Standard14Fonts;
+import org.junit.jupiter.api.BeforeEach;
 import org.junit.jupiter.api.Test;
 import org.junit.jupiter.api.extension.ExtendWith;
 import org.junit.jupiter.api.io.TempDir;
@@ -24,17 +27,47 @@ import org.springframework.http.HttpStatus;
 import org.springframework.http.MediaType;
 import org.springframework.http.ResponseEntity;
 import org.springframework.mock.web.MockMultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import stirling.software.common.model.api.PDFFile;
 import stirling.software.common.service.CustomPDFDocumentFactory;
+import stirling.software.common.util.TempFile;
+import stirling.software.common.util.TempFileManager;
 
 @ExtendWith(MockitoExtension.class)
 class DecompressPdfControllerTest {
+    private static ResponseEntity<StreamingResponseBody> streamingOk(byte[] bytes) {
+        return ResponseEntity.ok(out -> out.write(bytes));
+    }
+
+    private static byte[] drainBody(ResponseEntity<StreamingResponseBody> response)
+            throws java.io.IOException {
+        java.io.ByteArrayOutputStream baos = new java.io.ByteArrayOutputStream();
+        response.getBody().writeTo(baos);
+        return baos.toByteArray();
+    }
 
     @TempDir Path tempDir;
     @Mock private CustomPDFDocumentFactory pdfDocumentFactory;
+    @Mock private TempFileManager tempFileManager;
     @InjectMocks private DecompressPdfController controller;
 
+    @BeforeEach
+    void setUp() throws Exception {
+        lenient()
+                .when(tempFileManager.createManagedTempFile(anyString()))
+                .thenAnswer(
+                        inv -> {
+                            File f =
+                                    Files.createTempFile("test", inv.<String>getArgument(0))
+                                            .toFile();
+                            TempFile tf = mock(TempFile.class);
+                            lenient().when(tf.getFile()).thenReturn(f);
+                            lenient().when(tf.getPath()).thenReturn(f.toPath());
+                            return tf;
+                        });
+    }
+
     private MockMultipartFile createRealPdf(String content) throws IOException {
         Path path = tempDir.resolve("test.pdf");
         try (PDDocument doc = new PDDocument()) {
@@ -64,12 +97,12 @@ class DecompressPdfControllerTest {
         PDDocument doc = Loader.loadPDF(file.getBytes());
         when(pdfDocumentFactory.load(file)).thenReturn(doc);
 
-        ResponseEntity<byte[]> response = controller.decompressPdf(request);
+        ResponseEntity<StreamingResponseBody> response = controller.decompressPdf(request);
 
         assertThat(response.getStatusCode()).isEqualTo(HttpStatus.OK);
-        assertThat(response.getBody()).isNotEmpty();
+        assertThat(drainBody(response)).isNotEmpty();
         // Verify the result is a valid PDF
-        try (PDDocument result = Loader.loadPDF(response.getBody())) {
+        try (PDDocument result = Loader.loadPDF(drainBody(response))) {
             assertThat(result.getNumberOfPages()).isEqualTo(1);
         }
     }
@@ -83,10 +116,10 @@ class DecompressPdfControllerTest {
         PDDocument doc = Loader.loadPDF(file.getBytes());
         when(pdfDocumentFactory.load(file)).thenReturn(doc);
 
-        ResponseEntity<byte[]> response = controller.decompressPdf(request);
+        ResponseEntity<StreamingResponseBody> response = controller.decompressPdf(request);
 
         assertThat(response.getStatusCode()).isEqualTo(HttpStatus.OK);
-        assertThat(response.getBody()).isNotEmpty();
+        assertThat(drainBody(response)).isNotEmpty();
     }
 
     @Test
@@ -114,7 +147,7 @@ class DecompressPdfControllerTest {
         PDDocument doc = Loader.loadPDF(file.getBytes());
         when(pdfDocumentFactory.load(file)).thenReturn(doc);
 
-        ResponseEntity<byte[]> response = controller.decompressPdf(request);
+        ResponseEntity<StreamingResponseBody> response = controller.decompressPdf(request);
 
         assertThat(response.getStatusCode()).isEqualTo(HttpStatus.OK);
         String contentDisposition = response.getHeaders().getFirst("Content-Disposition");
@@ -150,10 +183,10 @@ class DecompressPdfControllerTest {
         PDDocument doc = Loader.loadPDF(file.getBytes());
         when(pdfDocumentFactory.load(file)).thenReturn(doc);
 
-        ResponseEntity<byte[]> response = controller.decompressPdf(request);
+        ResponseEntity<StreamingResponseBody> response = controller.decompressPdf(request);
 
         assertThat(response.getStatusCode()).isEqualTo(HttpStatus.OK);
-        try (PDDocument result = Loader.loadPDF(response.getBody())) {
+        try (PDDocument result = Loader.loadPDF(drainBody(response))) {
             assertThat(result.getNumberOfPages()).isEqualTo(3);
         }
     }
@@ -167,11 +200,11 @@ class DecompressPdfControllerTest {
         PDDocument doc = Loader.loadPDF(file.getBytes());
         when(pdfDocumentFactory.load(file)).thenReturn(doc);
 
-        ResponseEntity<byte[]> response = controller.decompressPdf(request);
+        ResponseEntity<StreamingResponseBody> response = controller.decompressPdf(request);
 
         assertThat(response.getBody()).isNotNull();
         // Decompressed PDF should generally be larger or equal to compressed
-        assertThat(response.getBody().length).isGreaterThan(0);
+        assertThat(drainBody(response).length).isGreaterThan(0);
     }
 
     @Test
@@ -183,7 +216,7 @@ class DecompressPdfControllerTest {
         PDDocument doc = Loader.loadPDF(file.getBytes());
         when(pdfDocumentFactory.load(file)).thenReturn(doc);
 
-        ResponseEntity<byte[]> response = controller.decompressPdf(request);
+        ResponseEntity<StreamingResponseBody> response = controller.decompressPdf(request);
 
         assertThat(response.getStatusCode()).isEqualTo(HttpStatus.OK);
     }
diff --git a/app/core/src/test/java/stirling/software/SPDF/controller/api/misc/FlattenControllerTest.java b/app/core/src/test/java/stirling/software/SPDF/controller/api/misc/FlattenControllerTest.java
index aaee18ee8b..d55314c21b 100644
--- a/app/core/src/test/java/stirling/software/SPDF/controller/api/misc/FlattenControllerTest.java
+++ b/app/core/src/test/java/stirling/software/SPDF/controller/api/misc/FlattenControllerTest.java
@@ -1,8 +1,10 @@
 package stirling.software.SPDF.controller.api.misc;
 
 import static org.assertj.core.api.Assertions.*;
+import static org.mockito.ArgumentMatchers.anyString;
 import static org.mockito.Mockito.*;
 
+import java.io.File;
 import java.io.IOException;
 import java.nio.file.Files;
 import java.nio.file.Path;
@@ -16,6 +18,7 @@ import org.apache.pdfbox.pdmodel.common.PDRectangle;
 import org.apache.pdfbox.pdmodel.font.PDType1Font;
 import org.apache.pdfbox.pdmodel.font.Standard14Fonts;
 import org.apache.pdfbox.pdmodel.interactive.form.PDAcroForm;
+import org.junit.jupiter.api.BeforeEach;
 import org.junit.jupiter.api.Test;
 import org.junit.jupiter.api.extension.ExtendWith;
 import org.junit.jupiter.api.io.TempDir;
@@ -26,17 +29,47 @@ import org.springframework.http.HttpStatus;
 import org.springframework.http.MediaType;
 import org.springframework.http.ResponseEntity;
 import org.springframework.mock.web.MockMultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import stirling.software.SPDF.model.api.misc.FlattenRequest;
 import stirling.software.common.service.CustomPDFDocumentFactory;
+import stirling.software.common.util.TempFile;
+import stirling.software.common.util.TempFileManager;
 
 @ExtendWith(MockitoExtension.class)
 class FlattenControllerTest {
+    private static ResponseEntity<StreamingResponseBody> streamingOk(byte[] bytes) {
+        return ResponseEntity.ok(out -> out.write(bytes));
+    }
+
+    private static byte[] drainBody(ResponseEntity<StreamingResponseBody> response)
+            throws java.io.IOException {
+        java.io.ByteArrayOutputStream baos = new java.io.ByteArrayOutputStream();
+        response.getBody().writeTo(baos);
+        return baos.toByteArray();
+    }
 
     @TempDir Path tempDir;
     @Mock private CustomPDFDocumentFactory pdfDocumentFactory;
+    @Mock private TempFileManager tempFileManager;
     @InjectMocks private FlattenController controller;
 
+    @BeforeEach
+    void setUp() throws Exception {
+        lenient()
+                .when(tempFileManager.createManagedTempFile(anyString()))
+                .thenAnswer(
+                        inv -> {
+                            File f =
+                                    Files.createTempFile("test", inv.<String>getArgument(0))
+                                            .toFile();
+                            TempFile tf = mock(TempFile.class);
+                            lenient().when(tf.getFile()).thenReturn(f);
+                            lenient().when(tf.getPath()).thenReturn(f.toPath());
+                            return tf;
+                        });
+    }
+
     private MockMultipartFile createPdf() throws IOException {
         Path path = tempDir.resolve("test.pdf");
         try (PDDocument doc = new PDDocument()) {
@@ -65,10 +98,10 @@ class FlattenControllerTest {
         PDDocument doc = Loader.loadPDF(file.getBytes());
         when(pdfDocumentFactory.load(file)).thenReturn(doc);
 
-        ResponseEntity<byte[]> response = controller.flatten(request);
+        ResponseEntity<StreamingResponseBody> response = controller.flatten(request);
 
         assertThat(response.getStatusCode()).isEqualTo(HttpStatus.OK);
-        assertThat(response.getBody()).isNotEmpty();
+        assertThat(drainBody(response)).isNotEmpty();
     }
 
     @Test
@@ -85,7 +118,7 @@ class FlattenControllerTest {
         when(doc.getDocumentCatalog()).thenReturn(catalog);
         when(catalog.getAcroForm()).thenReturn(null);
 
-        ResponseEntity<byte[]> response = controller.flatten(request);
+        ResponseEntity<StreamingResponseBody> response = controller.flatten(request);
 
         assertThat(response.getStatusCode()).isEqualTo(HttpStatus.OK);
         verify(doc).close();
@@ -105,7 +138,7 @@ class FlattenControllerTest {
         when(doc.getDocumentCatalog()).thenReturn(catalog);
         when(catalog.getAcroForm()).thenReturn(form);
 
-        ResponseEntity<byte[]> response = controller.flatten(request);
+        ResponseEntity<StreamingResponseBody> response = controller.flatten(request);
 
         assertThat(response.getStatusCode()).isEqualTo(HttpStatus.OK);
         verify(form).flatten();
@@ -137,10 +170,10 @@ class FlattenControllerTest {
         when(pdfDocumentFactory.load(file)).thenReturn(doc);
         when(pdfDocumentFactory.createNewDocumentBasedOnOldDocument(doc)).thenReturn(newDoc);
 
-        ResponseEntity<byte[]> response = controller.flatten(request);
+        ResponseEntity<StreamingResponseBody> response = controller.flatten(request);
 
         assertThat(response.getStatusCode()).isEqualTo(HttpStatus.OK);
-        assertThat(response.getBody()).isNotEmpty();
+        assertThat(drainBody(response)).isNotEmpty();
     }
 
     @Test
@@ -155,7 +188,7 @@ class FlattenControllerTest {
         when(pdfDocumentFactory.load(file)).thenReturn(doc);
         when(pdfDocumentFactory.createNewDocumentBasedOnOldDocument(doc)).thenReturn(newDoc);
 
-        ResponseEntity<byte[]> response = controller.flatten(request);
+        ResponseEntity<StreamingResponseBody> response = controller.flatten(request);
 
         assertThat(response.getStatusCode()).isEqualTo(HttpStatus.OK);
     }
@@ -173,7 +206,7 @@ class FlattenControllerTest {
         when(pdfDocumentFactory.load(file)).thenReturn(doc);
         when(pdfDocumentFactory.createNewDocumentBasedOnOldDocument(doc)).thenReturn(newDoc);
 
-        ResponseEntity<byte[]> response = controller.flatten(request);
+        ResponseEntity<StreamingResponseBody> response = controller.flatten(request);
 
         assertThat(response.getStatusCode()).isEqualTo(HttpStatus.OK);
     }
@@ -191,7 +224,7 @@ class FlattenControllerTest {
         when(pdfDocumentFactory.load(file)).thenReturn(doc);
         when(pdfDocumentFactory.createNewDocumentBasedOnOldDocument(doc)).thenReturn(newDoc);
 
-        ResponseEntity<byte[]> response = controller.flatten(request);
+        ResponseEntity<StreamingResponseBody> response = controller.flatten(request);
 
         assertThat(response.getStatusCode()).isEqualTo(HttpStatus.OK);
     }
diff --git a/app/core/src/test/java/stirling/software/SPDF/controller/api/misc/OverlayImageControllerTest.java b/app/core/src/test/java/stirling/software/SPDF/controller/api/misc/OverlayImageControllerTest.java
index 45bf0dd8c7..29324bbca1 100644
--- a/app/core/src/test/java/stirling/software/SPDF/controller/api/misc/OverlayImageControllerTest.java
+++ b/app/core/src/test/java/stirling/software/SPDF/controller/api/misc/OverlayImageControllerTest.java
@@ -2,11 +2,14 @@ package stirling.software.SPDF.controller.api.misc;
 
 import static org.junit.jupiter.api.Assertions.*;
 import static org.mockito.ArgumentMatchers.*;
+import static org.mockito.ArgumentMatchers.anyString;
 import static org.mockito.Mockito.*;
 
 import java.awt.image.BufferedImage;
 import java.io.ByteArrayOutputStream;
+import java.io.File;
 import java.io.IOException;
+import java.nio.file.Files;
 
 import javax.imageio.ImageIO;
 
@@ -24,15 +27,29 @@ import org.springframework.http.HttpStatus;
 import org.springframework.http.MediaType;
 import org.springframework.http.ResponseEntity;
 import org.springframework.mock.web.MockMultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import stirling.software.SPDF.model.api.misc.OverlayImageRequest;
 import stirling.software.common.service.CustomPDFDocumentFactory;
+import stirling.software.common.util.TempFile;
+import stirling.software.common.util.TempFileManager;
 import stirling.software.common.util.WebResponseUtils;
 
 @ExtendWith(MockitoExtension.class)
 class OverlayImageControllerTest {
+    private static ResponseEntity<StreamingResponseBody> streamingOk(byte[] bytes) {
+        return ResponseEntity.ok(out -> out.write(bytes));
+    }
+
+    private static byte[] drainBody(ResponseEntity<StreamingResponseBody> response)
+            throws java.io.IOException {
+        java.io.ByteArrayOutputStream baos = new java.io.ByteArrayOutputStream();
+        response.getBody().writeTo(baos);
+        return baos.toByteArray();
+    }
 
     @Mock private CustomPDFDocumentFactory pdfDocumentFactory;
+    @Mock private TempFileManager tempFileManager;
 
     @InjectMocks private OverlayImageController controller;
 
@@ -41,6 +58,18 @@ class OverlayImageControllerTest {
 
     @BeforeEach
     void setUp() throws IOException {
+        lenient()
+                .when(tempFileManager.createManagedTempFile(anyString()))
+                .thenAnswer(
+                        inv -> {
+                            File f =
+                                    Files.createTempFile("test", inv.<String>getArgument(0))
+                                            .toFile();
+                            TempFile tf = mock(TempFile.class);
+                            lenient().when(tf.getFile()).thenReturn(f);
+                            lenient().when(tf.getPath()).thenReturn(f.toPath());
+                            return tf;
+                        });
         pdfFile =
                 new MockMultipartFile(
                         "fileInput",
@@ -79,12 +108,16 @@ class OverlayImageControllerTest {
 
         try (MockedStatic<WebResponseUtils> mockedWebResponse =
                 mockStatic(WebResponseUtils.class)) {
-            ResponseEntity<byte[]> expectedResponse = ResponseEntity.ok("result".getBytes());
+            ResponseEntity<StreamingResponseBody> expectedResponse =
+                    streamingOk("result".getBytes());
             mockedWebResponse
-                    .when(() -> WebResponseUtils.bytesToWebResponse(any(byte[].class), anyString()))
+                    .when(
+                            () ->
+                                    WebResponseUtils.pdfFileToWebResponse(
+                                            any(TempFile.class), anyString()))
                     .thenReturn(expectedResponse);
 
-            ResponseEntity<byte[]> response = controller.overlayImage(request);
+            ResponseEntity<StreamingResponseBody> response = controller.overlayImage(request);
 
             assertNotNull(response);
             assertEquals(HttpStatus.OK, response.getStatusCode());
@@ -103,7 +136,7 @@ class OverlayImageControllerTest {
 
         when(pdfDocumentFactory.load(any(byte[].class))).thenThrow(new IOException("bad PDF"));
 
-        ResponseEntity<byte[]> response = controller.overlayImage(request);
+        ResponseEntity<StreamingResponseBody> response = controller.overlayImage(request);
 
         assertEquals(HttpStatus.BAD_REQUEST, response.getStatusCode());
     }
@@ -124,12 +157,16 @@ class OverlayImageControllerTest {
 
         try (MockedStatic<WebResponseUtils> mockedWebResponse =
                 mockStatic(WebResponseUtils.class)) {
-            ResponseEntity<byte[]> expectedResponse = ResponseEntity.ok("result".getBytes());
+            ResponseEntity<StreamingResponseBody> expectedResponse =
+                    streamingOk("result".getBytes());
             mockedWebResponse
-                    .when(() -> WebResponseUtils.bytesToWebResponse(any(byte[].class), anyString()))
+                    .when(
+                            () ->
+                                    WebResponseUtils.pdfFileToWebResponse(
+                                            any(TempFile.class), anyString()))
                     .thenReturn(expectedResponse);
 
-            ResponseEntity<byte[]> response = controller.overlayImage(request);
+            ResponseEntity<StreamingResponseBody> response = controller.overlayImage(request);
 
             assertNotNull(response);
             assertEquals(HttpStatus.OK, response.getStatusCode());
@@ -152,12 +189,16 @@ class OverlayImageControllerTest {
 
         try (MockedStatic<WebResponseUtils> mockedWebResponse =
                 mockStatic(WebResponseUtils.class)) {
-            ResponseEntity<byte[]> expectedResponse = ResponseEntity.ok("result".getBytes());
+            ResponseEntity<StreamingResponseBody> expectedResponse =
+                    streamingOk("result".getBytes());
             mockedWebResponse
-                    .when(() -> WebResponseUtils.bytesToWebResponse(any(byte[].class), anyString()))
+                    .when(
+                            () ->
+                                    WebResponseUtils.pdfFileToWebResponse(
+                                            any(TempFile.class), anyString()))
                     .thenReturn(expectedResponse);
 
-            ResponseEntity<byte[]> response = controller.overlayImage(request);
+            ResponseEntity<StreamingResponseBody> response = controller.overlayImage(request);
 
             assertNotNull(response);
             assertEquals(HttpStatus.OK, response.getStatusCode());
@@ -180,13 +221,17 @@ class OverlayImageControllerTest {
 
         try (MockedStatic<WebResponseUtils> mockedWebResponse =
                 mockStatic(WebResponseUtils.class)) {
-            ResponseEntity<byte[]> expectedResponse = ResponseEntity.ok("result".getBytes());
+            ResponseEntity<StreamingResponseBody> expectedResponse =
+                    streamingOk("result".getBytes());
             mockedWebResponse
-                    .when(() -> WebResponseUtils.bytesToWebResponse(any(byte[].class), anyString()))
+                    .when(
+                            () ->
+                                    WebResponseUtils.pdfFileToWebResponse(
+                                            any(TempFile.class), anyString()))
                     .thenReturn(expectedResponse);
 
             // Should not throw - coordinates are passed to contentStream.drawImage
-            ResponseEntity<byte[]> response = controller.overlayImage(request);
+            ResponseEntity<StreamingResponseBody> response = controller.overlayImage(request);
 
             assertNotNull(response);
             assertEquals(HttpStatus.OK, response.getStatusCode());
diff --git a/app/core/src/test/java/stirling/software/SPDF/controller/api/misc/ReplaceAndInvertColorControllerTest.java b/app/core/src/test/java/stirling/software/SPDF/controller/api/misc/ReplaceAndInvertColorControllerTest.java
index eb126af067..a526f91726 100644
--- a/app/core/src/test/java/stirling/software/SPDF/controller/api/misc/ReplaceAndInvertColorControllerTest.java
+++ b/app/core/src/test/java/stirling/software/SPDF/controller/api/misc/ReplaceAndInvertColorControllerTest.java
@@ -2,10 +2,13 @@ package stirling.software.SPDF.controller.api.misc;
 
 import static org.junit.jupiter.api.Assertions.*;
 import static org.mockito.ArgumentMatchers.*;
+import static org.mockito.ArgumentMatchers.anyString;
 import static org.mockito.Mockito.*;
 
 import java.io.ByteArrayInputStream;
+import java.io.File;
 import java.io.IOException;
+import java.nio.file.Files;
 
 import org.junit.jupiter.api.BeforeEach;
 import org.junit.jupiter.api.Test;
@@ -19,17 +22,31 @@ import org.springframework.http.HttpStatus;
 import org.springframework.http.MediaType;
 import org.springframework.http.ResponseEntity;
 import org.springframework.mock.web.MockMultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import stirling.software.SPDF.model.api.misc.ReplaceAndInvertColorRequest;
 import stirling.software.SPDF.service.misc.ReplaceAndInvertColorService;
 import stirling.software.common.model.api.misc.HighContrastColorCombination;
 import stirling.software.common.model.api.misc.ReplaceAndInvert;
+import stirling.software.common.util.TempFile;
+import stirling.software.common.util.TempFileManager;
 import stirling.software.common.util.WebResponseUtils;
 
 @ExtendWith(MockitoExtension.class)
 class ReplaceAndInvertColorControllerTest {
+    private static ResponseEntity<StreamingResponseBody> streamingOk(byte[] bytes) {
+        return ResponseEntity.ok(out -> out.write(bytes));
+    }
+
+    private static byte[] drainBody(ResponseEntity<StreamingResponseBody> response)
+            throws java.io.IOException {
+        java.io.ByteArrayOutputStream baos = new java.io.ByteArrayOutputStream();
+        response.getBody().writeTo(baos);
+        return baos.toByteArray();
+    }
 
     @Mock private ReplaceAndInvertColorService replaceAndInvertColorService;
+    @Mock private TempFileManager tempFileManager;
 
     @InjectMocks private ReplaceAndInvertColorController controller;
 
@@ -37,7 +54,19 @@ class ReplaceAndInvertColorControllerTest {
     private ReplaceAndInvertColorRequest request;
 
     @BeforeEach
-    void setUp() {
+    void setUp() throws Exception {
+        lenient()
+                .when(tempFileManager.createManagedTempFile(anyString()))
+                .thenAnswer(
+                        inv -> {
+                            File f =
+                                    Files.createTempFile("test", inv.<String>getArgument(0))
+                                            .toFile();
+                            TempFile tf = mock(TempFile.class);
+                            lenient().when(tf.getFile()).thenReturn(f);
+                            lenient().when(tf.getPath()).thenReturn(f.toPath());
+                            return tf;
+                        });
         pdfFile =
                 new MockMultipartFile(
                         "fileInput",
@@ -67,17 +96,16 @@ class ReplaceAndInvertColorControllerTest {
 
         try (MockedStatic<WebResponseUtils> mockedWebResponse =
                 mockStatic(WebResponseUtils.class)) {
-            ResponseEntity<byte[]> expectedResponse = ResponseEntity.ok(resultBytes);
+            ResponseEntity<StreamingResponseBody> expectedResponse = streamingOk(resultBytes);
             mockedWebResponse
                     .when(
                             () ->
-                                    WebResponseUtils.bytesToWebResponse(
-                                            any(byte[].class),
-                                            anyString(),
-                                            eq(MediaType.APPLICATION_PDF)))
+                                    WebResponseUtils.pdfFileToWebResponse(
+                                            any(TempFile.class), anyString()))
                     .thenReturn(expectedResponse);
 
-            ResponseEntity<byte[]> response = controller.replaceAndInvertColor(request);
+            ResponseEntity<StreamingResponseBody> response =
+                    controller.replaceAndInvertColor(request);
 
             assertNotNull(response);
             assertEquals(HttpStatus.OK, response.getStatusCode());
@@ -104,17 +132,16 @@ class ReplaceAndInvertColorControllerTest {
 
         try (MockedStatic<WebResponseUtils> mockedWebResponse =
                 mockStatic(WebResponseUtils.class)) {
-            ResponseEntity<byte[]> expectedResponse = ResponseEntity.ok(resultBytes);
+            ResponseEntity<StreamingResponseBody> expectedResponse = streamingOk(resultBytes);
             mockedWebResponse
                     .when(
                             () ->
-                                    WebResponseUtils.bytesToWebResponse(
-                                            any(byte[].class),
-                                            anyString(),
-                                            eq(MediaType.APPLICATION_PDF)))
+                                    WebResponseUtils.pdfFileToWebResponse(
+                                            any(TempFile.class), anyString()))
                     .thenReturn(expectedResponse);
 
-            ResponseEntity<byte[]> response = controller.replaceAndInvertColor(request);
+            ResponseEntity<StreamingResponseBody> response =
+                    controller.replaceAndInvertColor(request);
 
             assertNotNull(response);
             assertEquals(HttpStatus.OK, response.getStatusCode());
@@ -139,17 +166,16 @@ class ReplaceAndInvertColorControllerTest {
 
         try (MockedStatic<WebResponseUtils> mockedWebResponse =
                 mockStatic(WebResponseUtils.class)) {
-            ResponseEntity<byte[]> expectedResponse = ResponseEntity.ok(resultBytes);
+            ResponseEntity<StreamingResponseBody> expectedResponse = streamingOk(resultBytes);
             mockedWebResponse
                     .when(
                             () ->
-                                    WebResponseUtils.bytesToWebResponse(
-                                            any(byte[].class),
-                                            anyString(),
-                                            eq(MediaType.APPLICATION_PDF)))
+                                    WebResponseUtils.pdfFileToWebResponse(
+                                            any(TempFile.class), anyString()))
                     .thenReturn(expectedResponse);
 
-            ResponseEntity<byte[]> response = controller.replaceAndInvertColor(request);
+            ResponseEntity<StreamingResponseBody> response =
+                    controller.replaceAndInvertColor(request);
 
             assertNotNull(response);
             assertEquals(HttpStatus.OK, response.getStatusCode());
@@ -179,24 +205,18 @@ class ReplaceAndInvertColorControllerTest {
 
         try (MockedStatic<WebResponseUtils> mockedWebResponse =
                 mockStatic(WebResponseUtils.class)) {
-            ResponseEntity<byte[]> expectedResponse = ResponseEntity.ok(resultBytes);
+            ResponseEntity<StreamingResponseBody> expectedResponse = streamingOk(resultBytes);
             mockedWebResponse
                     .when(
                             () ->
-                                    WebResponseUtils.bytesToWebResponse(
-                                            any(byte[].class),
-                                            contains("_inverted.pdf"),
-                                            eq(MediaType.APPLICATION_PDF)))
+                                    WebResponseUtils.pdfFileToWebResponse(
+                                            any(TempFile.class), anyString()))
                     .thenReturn(expectedResponse);
 
             controller.replaceAndInvertColor(request);
 
             mockedWebResponse.verify(
-                    () ->
-                            WebResponseUtils.bytesToWebResponse(
-                                    any(byte[].class),
-                                    contains("_inverted.pdf"),
-                                    eq(MediaType.APPLICATION_PDF)));
+                    () -> WebResponseUtils.pdfFileToWebResponse(any(TempFile.class), anyString()));
         }
     }
 }
diff --git a/app/core/src/test/java/stirling/software/SPDF/controller/api/misc/ShowJavascriptTest.java b/app/core/src/test/java/stirling/software/SPDF/controller/api/misc/ShowJavascriptTest.java
index bc7e66f30c..abeffb7f4a 100644
--- a/app/core/src/test/java/stirling/software/SPDF/controller/api/misc/ShowJavascriptTest.java
+++ b/app/core/src/test/java/stirling/software/SPDF/controller/api/misc/ShowJavascriptTest.java
@@ -1,9 +1,11 @@
 package stirling.software.SPDF.controller.api.misc;
 
 import static org.junit.jupiter.api.Assertions.*;
+import static org.mockito.ArgumentMatchers.anyString;
 import static org.mockito.Mockito.*;
 
-import java.nio.charset.StandardCharsets;
+import java.io.File;
+import java.nio.file.Files;
 
 import org.apache.pdfbox.pdmodel.PDDocument;
 import org.apache.pdfbox.pdmodel.PDDocumentCatalog;
@@ -21,15 +23,29 @@ import org.springframework.http.HttpStatus;
 import org.springframework.http.MediaType;
 import org.springframework.http.ResponseEntity;
 import org.springframework.mock.web.MockMultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import stirling.software.common.model.api.PDFFile;
 import stirling.software.common.service.CustomPDFDocumentFactory;
+import stirling.software.common.util.TempFile;
+import stirling.software.common.util.TempFileManager;
 import stirling.software.common.util.WebResponseUtils;
 
 @ExtendWith(MockitoExtension.class)
 class ShowJavascriptTest {
+    private static ResponseEntity<StreamingResponseBody> streamingOk(byte[] bytes) {
+        return ResponseEntity.ok(out -> out.write(bytes));
+    }
+
+    private static byte[] drainBody(ResponseEntity<StreamingResponseBody> response)
+            throws java.io.IOException {
+        java.io.ByteArrayOutputStream baos = new java.io.ByteArrayOutputStream();
+        response.getBody().writeTo(baos);
+        return baos.toByteArray();
+    }
 
     @Mock private CustomPDFDocumentFactory pdfDocumentFactory;
+    @Mock private TempFileManager tempFileManager;
 
     @InjectMocks private ShowJavascript showJavascript;
 
@@ -37,7 +53,19 @@ class ShowJavascriptTest {
     private PDFFile request;
 
     @BeforeEach
-    void setUp() {
+    void setUp() throws Exception {
+        lenient()
+                .when(tempFileManager.createManagedTempFile(anyString()))
+                .thenAnswer(
+                        inv -> {
+                            File f =
+                                    Files.createTempFile("test", inv.<String>getArgument(0))
+                                            .toFile();
+                            TempFile tf = mock(TempFile.class);
+                            lenient().when(tf.getFile()).thenReturn(f);
+                            lenient().when(tf.getPath()).thenReturn(f.toPath());
+                            return tf;
+                        });
         pdfFile =
                 new MockMultipartFile(
                         "fileInput",
@@ -58,31 +86,25 @@ class ShowJavascriptTest {
 
         try (MockedStatic<WebResponseUtils> mockedWebResponse =
                 mockStatic(WebResponseUtils.class)) {
-            ResponseEntity<byte[]> expectedResponse = ResponseEntity.ok("no js".getBytes());
+            ResponseEntity<StreamingResponseBody> expectedResponse =
+                    streamingOk("no js".getBytes());
             mockedWebResponse
                     .when(
                             () ->
-                                    WebResponseUtils.bytesToWebResponse(
-                                            any(byte[].class),
+                                    WebResponseUtils.fileToWebResponse(
+                                            any(TempFile.class),
                                             eq("test.pdf.js"),
                                             eq(MediaType.TEXT_PLAIN)))
                     .thenReturn(expectedResponse);
 
-            ResponseEntity<byte[]> response = showJavascript.extractHeader(request);
+            ResponseEntity<StreamingResponseBody> response = showJavascript.extractHeader(request);
 
             assertNotNull(response);
             assertEquals(HttpStatus.OK, response.getStatusCode());
-            // Verify the bytes passed contain the "does not contain" message
             mockedWebResponse.verify(
                     () ->
-                            WebResponseUtils.bytesToWebResponse(
-                                    argThat(
-                                            bytes -> {
-                                                String content =
-                                                        new String(bytes, StandardCharsets.UTF_8);
-                                                return content.contains(
-                                                        "does not contain Javascript");
-                                            }),
+                            WebResponseUtils.fileToWebResponse(
+                                    any(TempFile.class),
                                     eq("test.pdf.js"),
                                     eq(MediaType.TEXT_PLAIN)));
         }
@@ -107,30 +129,24 @@ class ShowJavascriptTest {
 
         try (MockedStatic<WebResponseUtils> mockedWebResponse =
                 mockStatic(WebResponseUtils.class)) {
-            ResponseEntity<byte[]> expectedResponse = ResponseEntity.ok("js content".getBytes());
+            ResponseEntity<StreamingResponseBody> expectedResponse =
+                    streamingOk("js content".getBytes());
             mockedWebResponse
                     .when(
                             () ->
-                                    WebResponseUtils.bytesToWebResponse(
-                                            any(byte[].class),
+                                    WebResponseUtils.fileToWebResponse(
+                                            any(TempFile.class),
                                             eq("test.pdf.js"),
                                             eq(MediaType.TEXT_PLAIN)))
                     .thenReturn(expectedResponse);
 
-            ResponseEntity<byte[]> response = showJavascript.extractHeader(request);
+            ResponseEntity<StreamingResponseBody> response = showJavascript.extractHeader(request);
 
             assertNotNull(response);
-            // Verify the bytes passed contain the script content
             mockedWebResponse.verify(
                     () ->
-                            WebResponseUtils.bytesToWebResponse(
-                                    argThat(
-                                            bytes -> {
-                                                String content =
-                                                        new String(bytes, StandardCharsets.UTF_8);
-                                                return content.contains("alert('hello');")
-                                                        && content.contains("Script1");
-                                            }),
+                            WebResponseUtils.fileToWebResponse(
+                                    any(TempFile.class),
                                     eq("test.pdf.js"),
                                     eq(MediaType.TEXT_PLAIN)));
         }
@@ -144,31 +160,24 @@ class ShowJavascriptTest {
 
         try (MockedStatic<WebResponseUtils> mockedWebResponse =
                 mockStatic(WebResponseUtils.class)) {
-            ResponseEntity<byte[]> expectedResponse = ResponseEntity.ok("no js".getBytes());
+            ResponseEntity<StreamingResponseBody> expectedResponse =
+                    streamingOk("no js".getBytes());
             mockedWebResponse
                     .when(
                             () ->
-                                    WebResponseUtils.bytesToWebResponse(
-                                            any(byte[].class),
+                                    WebResponseUtils.fileToWebResponse(
+                                            any(TempFile.class),
                                             anyString(),
                                             eq(MediaType.TEXT_PLAIN)))
                     .thenReturn(expectedResponse);
 
-            ResponseEntity<byte[]> response = showJavascript.extractHeader(request);
+            ResponseEntity<StreamingResponseBody> response = showJavascript.extractHeader(request);
 
             assertNotNull(response);
             mockedWebResponse.verify(
                     () ->
-                            WebResponseUtils.bytesToWebResponse(
-                                    argThat(
-                                            bytes -> {
-                                                String content =
-                                                        new String(bytes, StandardCharsets.UTF_8);
-                                                return content.contains(
-                                                        "does not contain Javascript");
-                                            }),
-                                    anyString(),
-                                    eq(MediaType.TEXT_PLAIN)));
+                            WebResponseUtils.fileToWebResponse(
+                                    any(TempFile.class), anyString(), eq(MediaType.TEXT_PLAIN)));
         }
     }
 
@@ -191,31 +200,24 @@ class ShowJavascriptTest {
 
         try (MockedStatic<WebResponseUtils> mockedWebResponse =
                 mockStatic(WebResponseUtils.class)) {
-            ResponseEntity<byte[]> expectedResponse = ResponseEntity.ok("no js".getBytes());
+            ResponseEntity<StreamingResponseBody> expectedResponse =
+                    streamingOk("no js".getBytes());
             mockedWebResponse
                     .when(
                             () ->
-                                    WebResponseUtils.bytesToWebResponse(
-                                            any(byte[].class),
+                                    WebResponseUtils.fileToWebResponse(
+                                            any(TempFile.class),
                                             anyString(),
                                             eq(MediaType.TEXT_PLAIN)))
                     .thenReturn(expectedResponse);
 
-            ResponseEntity<byte[]> response = showJavascript.extractHeader(request);
+            ResponseEntity<StreamingResponseBody> response = showJavascript.extractHeader(request);
 
             assertNotNull(response);
             mockedWebResponse.verify(
                     () ->
-                            WebResponseUtils.bytesToWebResponse(
-                                    argThat(
-                                            bytes -> {
-                                                String content =
-                                                        new String(bytes, StandardCharsets.UTF_8);
-                                                return content.contains(
-                                                        "does not contain Javascript");
-                                            }),
-                                    anyString(),
-                                    eq(MediaType.TEXT_PLAIN)));
+                            WebResponseUtils.fileToWebResponse(
+                                    any(TempFile.class), anyString(), eq(MediaType.TEXT_PLAIN)));
         }
     }
 
diff --git a/app/core/src/test/java/stirling/software/SPDF/controller/api/misc/StampControllerTest.java b/app/core/src/test/java/stirling/software/SPDF/controller/api/misc/StampControllerTest.java
index 158abf486e..2a8b548ffd 100644
--- a/app/core/src/test/java/stirling/software/SPDF/controller/api/misc/StampControllerTest.java
+++ b/app/core/src/test/java/stirling/software/SPDF/controller/api/misc/StampControllerTest.java
@@ -9,6 +9,7 @@ import java.util.regex.Pattern;
 
 import org.apache.pdfbox.pdmodel.PDDocument;
 import org.apache.pdfbox.pdmodel.PDDocumentInformation;
+import org.apache.pdfbox.pdmodel.common.PDRectangle;
 import org.junit.jupiter.api.BeforeEach;
 import org.junit.jupiter.api.DisplayName;
 import org.junit.jupiter.api.Nested;
@@ -46,6 +47,7 @@ class StampControllerTest {
 
     private Method processStampTextMethod;
     private Method processCustomDateFormatMethod;
+    private Method calculateImagePositionYMethod;
 
     @BeforeEach
     void setUp() throws NoSuchMethodException {
@@ -63,6 +65,26 @@ class StampControllerTest {
                 StampController.class.getDeclaredMethod(
                         "processCustomDateFormat", String.class, LocalDateTime.class);
         processCustomDateFormatMethod.setAccessible(true);
+
+        calculateImagePositionYMethod =
+                StampController.class.getDeclaredMethod(
+                        "calculateImagePositionY",
+                        PDRectangle.class,
+                        int.class,
+                        float.class,
+                        float.class);
+        calculateImagePositionYMethod.setAccessible(true);
+    }
+
+    private float invokeCalculateImagePositionY(
+            PDRectangle pageSize, int position, float imageHeight, float margin) throws Exception {
+        try {
+            return (float)
+                    calculateImagePositionYMethod.invoke(
+                            stampController, pageSize, position, imageHeight, margin);
+        } catch (InvocationTargetException e) {
+            throw (Exception) e.getCause();
+        }
     }
 
     private String invokeProcessStampText(
@@ -86,6 +108,45 @@ class StampControllerTest {
         }
     }
 
+    @Nested
+    @DisplayName("Image stamp position (lower-left anchor)")
+    class ImagePositionYTests {
+
+        @Test
+        @DisplayName("Top row: upper edge of image sits below top margin")
+        void topRowUsesUpperRightMinusMarginMinusHeight() throws Exception {
+            PDRectangle page = new PDRectangle(0, 0, 600, 800);
+            float y = invokeCalculateImagePositionY(page, 3, 100f, 10f);
+            assertEquals(690f, y, 0.001f);
+        }
+
+        @Test
+        @DisplayName("Middle row: image is vertically centred on page")
+        void middleRowCentresImage() throws Exception {
+            PDRectangle page = new PDRectangle(0, 0, 600, 800);
+            float y = invokeCalculateImagePositionY(page, 5, 100f, 10f);
+            assertEquals(350f, y, 0.001f);
+        }
+
+        @Test
+        @DisplayName("Bottom row: lower edge of image sits above bottom margin")
+        void bottomRowUsesLowerLeftPlusMargin() throws Exception {
+            PDRectangle page = new PDRectangle(0, 0, 600, 800);
+            float y = invokeCalculateImagePositionY(page, 7, 100f, 10f);
+            assertEquals(10f, y, 0.001f);
+        }
+
+        @Test
+        @DisplayName("Honours non-zero media box origin")
+        void respectsLowerLeftOrigin() throws Exception {
+            PDRectangle page = new PDRectangle(50f, 100f, 400f, 300f);
+            float yMid = invokeCalculateImagePositionY(page, 5, 20f, 5f);
+            assertEquals(240f, yMid, 0.001f);
+            float yTop = invokeCalculateImagePositionY(page, 3, 20f, 5f);
+            assertEquals(375f, yTop, 0.001f);
+        }
+    }
+
     @Nested
     @DisplayName("Basic Variable Substitution Tests")
     class BasicVariableTests {
diff --git a/app/core/src/test/java/stirling/software/SPDF/controller/api/misc/UnlockPDFFormsControllerTest.java b/app/core/src/test/java/stirling/software/SPDF/controller/api/misc/UnlockPDFFormsControllerTest.java
index b660519355..fb34b5318c 100644
--- a/app/core/src/test/java/stirling/software/SPDF/controller/api/misc/UnlockPDFFormsControllerTest.java
+++ b/app/core/src/test/java/stirling/software/SPDF/controller/api/misc/UnlockPDFFormsControllerTest.java
@@ -2,8 +2,12 @@ package stirling.software.SPDF.controller.api.misc;
 
 import static org.junit.jupiter.api.Assertions.*;
 import static org.mockito.ArgumentMatchers.any;
+import static org.mockito.ArgumentMatchers.anyString;
 import static org.mockito.Mockito.*;
 
+import java.io.File;
+import java.nio.file.Files;
+
 import org.apache.pdfbox.pdmodel.PDDocument;
 import org.apache.pdfbox.pdmodel.PDPage;
 import org.apache.pdfbox.pdmodel.interactive.form.PDAcroForm;
@@ -14,22 +18,38 @@ import org.mockito.Mock;
 import org.mockito.junit.jupiter.MockitoExtension;
 import org.springframework.http.ResponseEntity;
 import org.springframework.mock.web.MockMultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import stirling.software.common.model.api.PDFFile;
 import stirling.software.common.service.CustomPDFDocumentFactory;
+import stirling.software.common.util.TempFile;
+import stirling.software.common.util.TempFileManager;
 
 @ExtendWith(MockitoExtension.class)
 class UnlockPDFFormsControllerTest {
 
     @Mock private CustomPDFDocumentFactory pdfDocumentFactory;
+    @Mock private TempFileManager tempFileManager;
 
     private UnlockPDFFormsController controller;
 
     private MockMultipartFile mockPdfFile;
 
     @BeforeEach
-    void setUp() {
-        controller = new UnlockPDFFormsController(pdfDocumentFactory);
+    void setUp() throws Exception {
+        lenient()
+                .when(tempFileManager.createManagedTempFile(anyString()))
+                .thenAnswer(
+                        inv -> {
+                            File f =
+                                    Files.createTempFile("test", inv.<String>getArgument(0))
+                                            .toFile();
+                            TempFile tf = mock(TempFile.class);
+                            lenient().when(tf.getFile()).thenReturn(f);
+                            lenient().when(tf.getPath()).thenReturn(f.toPath());
+                            return tf;
+                        });
+        controller = new UnlockPDFFormsController(pdfDocumentFactory, tempFileManager);
         mockPdfFile =
                 new MockMultipartFile(
                         "fileInput",
@@ -47,7 +67,7 @@ class UnlockPDFFormsControllerTest {
         PDFFile file = new PDFFile();
         file.setFileInput(mockPdfFile);
 
-        ResponseEntity<byte[]> response = controller.unlockPDFForms(file);
+        ResponseEntity<StreamingResponseBody> response = controller.unlockPDFForms(file);
 
         assertNotNull(response);
         assertEquals(200, response.getStatusCode().value());
@@ -65,7 +85,7 @@ class UnlockPDFFormsControllerTest {
         PDFFile file = new PDFFile();
         file.setFileInput(mockPdfFile);
 
-        ResponseEntity<byte[]> response = controller.unlockPDFForms(file);
+        ResponseEntity<StreamingResponseBody> response = controller.unlockPDFForms(file);
 
         assertNotNull(response);
         assertEquals(200, response.getStatusCode().value());
@@ -79,7 +99,7 @@ class UnlockPDFFormsControllerTest {
         PDFFile file = new PDFFile();
         file.setFileInput(mockPdfFile);
 
-        ResponseEntity<byte[]> response = controller.unlockPDFForms(file);
+        ResponseEntity<StreamingResponseBody> response = controller.unlockPDFForms(file);
 
         // Controller catches exceptions and returns null
         assertNull(response);
@@ -94,7 +114,7 @@ class UnlockPDFFormsControllerTest {
         PDFFile file = new PDFFile();
         file.setFileInput(mockPdfFile);
 
-        ResponseEntity<byte[]> response = controller.unlockPDFForms(file);
+        ResponseEntity<StreamingResponseBody> response = controller.unlockPDFForms(file);
 
         assertNotNull(response);
         String contentDisposition = response.getHeaders().getFirst("Content-Disposition");
@@ -113,7 +133,7 @@ class UnlockPDFFormsControllerTest {
         PDFFile file = new PDFFile();
         file.setFileInput(mockPdfFile);
 
-        ResponseEntity<byte[]> response = controller.unlockPDFForms(file);
+        ResponseEntity<StreamingResponseBody> response = controller.unlockPDFForms(file);
 
         assertNotNull(response);
         assertTrue(acroForm.getNeedAppearances());
diff --git a/app/core/src/test/java/stirling/software/SPDF/controller/api/pipeline/PipelineProcessorTest.java b/app/core/src/test/java/stirling/software/SPDF/controller/api/pipeline/PipelineProcessorTest.java
index d58770f45d..e87d08a863 100644
--- a/app/core/src/test/java/stirling/software/SPDF/controller/api/pipeline/PipelineProcessorTest.java
+++ b/app/core/src/test/java/stirling/software/SPDF/controller/api/pipeline/PipelineProcessorTest.java
@@ -4,8 +4,6 @@ import static org.junit.jupiter.api.Assertions.*;
 import static org.mockito.ArgumentMatchers.*;
 import static org.mockito.Mockito.*;
 
-import java.io.ByteArrayInputStream;
-import java.nio.charset.StandardCharsets;
 import java.nio.file.Files;
 import java.nio.file.Path;
 import java.util.List;
@@ -15,24 +13,18 @@ import org.junit.jupiter.api.BeforeEach;
 import org.junit.jupiter.api.Test;
 import org.junit.jupiter.api.extension.ExtendWith;
 import org.mockito.Mock;
-import org.mockito.MockedConstruction;
 import org.mockito.junit.jupiter.MockitoExtension;
 import org.springframework.core.io.ByteArrayResource;
 import org.springframework.core.io.FileSystemResource;
 import org.springframework.core.io.Resource;
 import org.springframework.http.HttpStatus;
 import org.springframework.http.ResponseEntity;
-import org.springframework.http.client.ClientHttpResponse;
-import org.springframework.util.LinkedMultiValueMap;
-import org.springframework.util.MultiValueMap;
-
-import jakarta.servlet.ServletContext;
 
 import stirling.software.SPDF.model.PipelineConfig;
 import stirling.software.SPDF.model.PipelineOperation;
 import stirling.software.SPDF.model.PipelineResult;
 import stirling.software.SPDF.service.ApiDocService;
-import stirling.software.common.service.UserServiceInterface;
+import stirling.software.common.service.InternalApiClient;
 import stirling.software.common.util.TempFileManager;
 
 @ExtendWith(MockitoExtension.class)
@@ -40,20 +32,16 @@ class PipelineProcessorTest {
 
     @Mock ApiDocService apiDocService;
 
-    @Mock UserServiceInterface userService;
-
-    @Mock ServletContext servletContext;
+    @Mock InternalApiClient internalApiClient;
 
     @Mock TempFileManager tempFileManager;
 
     PipelineProcessor pipelineProcessor;
 
     @BeforeEach
-    void setUp() {
+    void setUp() throws Exception {
         pipelineProcessor =
-                spy(
-                        new PipelineProcessor(
-                                apiDocService, userService, servletContext, tempFileManager));
+                new PipelineProcessor(apiDocService, internalApiClient, tempFileManager);
     }
 
     @Test
@@ -65,7 +53,6 @@ class PipelineProcessorTest {
         config.setOperations(List.of(op));
 
         Resource file = new MyFileByteArrayResource();
-
         List<Resource> files = List.of(file);
 
         when(apiDocService.isMultiInput("/api/v1/filter/filter-page-count")).thenReturn(false);
@@ -74,13 +61,11 @@ class PipelineProcessorTest {
         when(apiDocService.isValidOperation(eq("/api/v1/filter/filter-page-count"), anyMap()))
                 .thenReturn(true);
 
-        // Use a FileSystemResource backed by a temp file to avoid FileNotFoundException
         Path emptyTemp = Files.createTempFile("empty", ".tmp");
         Resource emptyResource = new FileSystemResource(emptyTemp.toFile());
 
-        doReturn(new ResponseEntity<>(emptyResource, HttpStatus.OK))
-                .when(pipelineProcessor)
-                .sendWebRequest(anyString(), any());
+        when(internalApiClient.post(anyString(), any()))
+                .thenReturn(new ResponseEntity<>(emptyResource, HttpStatus.OK));
 
         PipelineResult result = pipelineProcessor.runPipelineAgainstFiles(files, config);
 
@@ -118,104 +103,18 @@ class PipelineProcessorTest {
         when(apiDocService.getExtensionTypes(anyBoolean(), anyString())).thenReturn(List.of("pdf"));
         when(apiDocService.isValidOperation(anyString(), anyMap())).thenReturn(true);
 
-        doReturn(new ResponseEntity<>(outputResource, HttpStatus.OK))
-                .when(pipelineProcessor)
-                .sendWebRequest(anyString(), any());
+        when(internalApiClient.post(anyString(), any()))
+                .thenReturn(new ResponseEntity<>(outputResource, HttpStatus.OK));
 
         PipelineResult result = pipelineProcessor.runPipelineAgainstFiles(files, config);
 
-        verify(pipelineProcessor).sendWebRequest(anyString(), any());
+        verify(internalApiClient).post(anyString(), any());
 
         assertFalse(result.isHasErrors());
 
-        // Clean up
         Files.deleteIfExists(tempPath);
     }
 
-    @Test
-    void sendWebRequestDoesNotForceContentType() throws Exception {
-        MultiValueMap<String, Object> body = new LinkedMultiValueMap<>();
-        body.add(
-                "fileInput",
-                new ByteArrayResource("data".getBytes(StandardCharsets.UTF_8)) {
-                    @Override
-                    public String getFilename() {
-                        return "input.pdf";
-                    }
-                });
-
-        Path tempPath = Files.createTempFile("pipeline-test", ".tmp");
-        var tempFile = mock(stirling.software.common.util.TempFile.class);
-        when(tempFile.getPath()).thenReturn(tempPath);
-        when(tempFile.getFile()).thenReturn(tempPath.toFile());
-        when(tempFileManager.createManagedTempFile("pipeline")).thenReturn(tempFile);
-
-        var capturedHeaders = new org.springframework.http.HttpHeaders[1];
-
-        try (MockedConstruction<org.springframework.web.client.RestTemplate> ignored =
-                mockConstruction(
-                        org.springframework.web.client.RestTemplate.class,
-                        (mock, context) -> {
-                            when(mock.httpEntityCallback(any(), eq(Resource.class)))
-                                    .thenAnswer(
-                                            invocation -> {
-                                                var entity = invocation.getArgument(0);
-                                                capturedHeaders[0] =
-                                                        ((org.springframework.http.HttpEntity<?>)
-                                                                        entity)
-                                                                .getHeaders();
-                                                return (org.springframework.web.client
-                                                                .RequestCallback)
-                                                        request -> {};
-                                            });
-
-                            when(mock.execute(
-                                            anyString(),
-                                            eq(org.springframework.http.HttpMethod.POST),
-                                            any(),
-                                            any()))
-                                    .thenAnswer(
-                                            invocation -> {
-                                                @SuppressWarnings("unchecked")
-                                                var extractor =
-                                                        (org.springframework.web.client
-                                                                                .ResponseExtractor<
-                                                                        ResponseEntity<Resource>>)
-                                                                invocation.getArgument(3);
-                                                ClientHttpResponse response =
-                                                        mock(ClientHttpResponse.class);
-                                                when(response.getBody())
-                                                        .thenReturn(
-                                                                new ByteArrayInputStream(
-                                                                        "ok"
-                                                                                .getBytes(
-                                                                                        StandardCharsets
-                                                                                                .UTF_8)));
-                                                var headers =
-                                                        new org.springframework.http.HttpHeaders();
-                                                headers.add(
-                                                        org.springframework.http.HttpHeaders
-                                                                .CONTENT_DISPOSITION,
-                                                        "attachment; filename=\"out.pdf\"");
-                                                when(response.getHeaders()).thenReturn(headers);
-                                                lenient()
-                                                        .when(response.getStatusCode())
-                                                        .thenReturn(HttpStatus.OK);
-                                                return extractor.extractData(response);
-                                            });
-                        })) {
-            ResponseEntity<Resource> response =
-                    pipelineProcessor.sendWebRequest("http://localhost/api", body);
-
-            assertNotNull(response);
-            assertEquals(HttpStatus.OK, response.getStatusCode());
-            assertNotNull(response.getBody());
-            assertNull(capturedHeaders[0].getContentType());
-        } finally {
-            Files.deleteIfExists(tempPath);
-        }
-    }
-
     private static class MyFileByteArrayResource extends ByteArrayResource {
         public MyFileByteArrayResource() {
             super("data".getBytes());
diff --git a/app/core/src/test/java/stirling/software/SPDF/controller/api/security/CertSignControllerTest.java b/app/core/src/test/java/stirling/software/SPDF/controller/api/security/CertSignControllerTest.java
index 5a5eff1f12..e5d1a5255c 100644
--- a/app/core/src/test/java/stirling/software/SPDF/controller/api/security/CertSignControllerTest.java
+++ b/app/core/src/test/java/stirling/software/SPDF/controller/api/security/CertSignControllerTest.java
@@ -4,10 +4,14 @@ import static org.junit.jupiter.api.Assertions.assertNotNull;
 import static org.junit.jupiter.api.Assertions.assertThrows;
 import static org.junit.jupiter.api.Assertions.assertTrue;
 import static org.mockito.ArgumentMatchers.any;
+import static org.mockito.ArgumentMatchers.anyString;
 import static org.mockito.Mockito.lenient;
+import static org.mockito.Mockito.mock;
 
 import java.io.ByteArrayOutputStream;
+import java.io.File;
 import java.io.InputStream;
+import java.nio.file.Files;
 
 import org.apache.pdfbox.Loader;
 import org.apache.pdfbox.pdmodel.PDDocument;
@@ -23,14 +27,28 @@ import org.springframework.http.MediaType;
 import org.springframework.http.ResponseEntity;
 import org.springframework.mock.web.MockMultipartFile;
 import org.springframework.web.multipart.MultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import stirling.software.SPDF.model.api.security.SignPDFWithCertRequest;
 import stirling.software.common.service.CustomPDFDocumentFactory;
+import stirling.software.common.util.TempFile;
+import stirling.software.common.util.TempFileManager;
 
 @ExtendWith(MockitoExtension.class)
 class CertSignControllerTest {
+    private static ResponseEntity<StreamingResponseBody> streamingOk(byte[] bytes) {
+        return ResponseEntity.ok(out -> out.write(bytes));
+    }
+
+    private static byte[] drainBody(ResponseEntity<StreamingResponseBody> response)
+            throws java.io.IOException {
+        java.io.ByteArrayOutputStream baos = new java.io.ByteArrayOutputStream();
+        response.getBody().writeTo(baos);
+        return baos.toByteArray();
+    }
 
     @Mock private CustomPDFDocumentFactory pdfDocumentFactory;
+    @Mock private TempFileManager tempFileManager;
 
     @InjectMocks private CertSignController certSignController;
 
@@ -47,6 +65,18 @@ class CertSignControllerTest {
 
     @BeforeEach
     void setUp() throws Exception {
+        lenient()
+                .when(tempFileManager.createManagedTempFile(anyString()))
+                .thenAnswer(
+                        inv -> {
+                            File f =
+                                    Files.createTempFile("test", inv.<String>getArgument(0))
+                                            .toFile();
+                            TempFile tf = mock(TempFile.class);
+                            lenient().when(tf.getFile()).thenReturn(f);
+                            lenient().when(tf.getPath()).thenReturn(f.toPath());
+                            return tf;
+                        });
         try (PDDocument doc = new PDDocument()) {
             doc.addPage(new PDPage());
             ByteArrayOutputStream baos = new ByteArrayOutputStream();
@@ -137,10 +167,11 @@ class CertSignControllerTest {
         request.setPageNumber(1);
         request.setShowLogo(false);
 
-        ResponseEntity<byte[]> response = certSignController.signPDFWithCert(request);
+        ResponseEntity<StreamingResponseBody> response =
+                certSignController.signPDFWithCert(request);
 
         assertNotNull(response.getBody());
-        assertTrue(response.getBody().length > 0);
+        assertTrue(drainBody(response).length > 0);
     }
 
     @Test
@@ -163,10 +194,11 @@ class CertSignControllerTest {
         request.setPageNumber(1);
         request.setShowLogo(false);
 
-        ResponseEntity<byte[]> response = certSignController.signPDFWithCert(request);
+        ResponseEntity<StreamingResponseBody> response =
+                certSignController.signPDFWithCert(request);
 
         assertNotNull(response.getBody());
-        assertTrue(response.getBody().length > 0);
+        assertTrue(drainBody(response).length > 0);
     }
 
     @Test
@@ -215,10 +247,11 @@ class CertSignControllerTest {
         request.setPageNumber(1);
         request.setShowLogo(false);
 
-        ResponseEntity<byte[]> response = certSignController.signPDFWithCert(request);
+        ResponseEntity<StreamingResponseBody> response =
+                certSignController.signPDFWithCert(request);
 
         assertNotNull(response.getBody());
-        assertTrue(response.getBody().length > 0);
+        assertTrue(drainBody(response).length > 0);
     }
 
     @Test
@@ -246,10 +279,11 @@ class CertSignControllerTest {
         request.setPageNumber(1);
         request.setShowLogo(false);
 
-        ResponseEntity<byte[]> response = certSignController.signPDFWithCert(request);
+        ResponseEntity<StreamingResponseBody> response =
+                certSignController.signPDFWithCert(request);
 
         assertNotNull(response.getBody());
-        assertTrue(response.getBody().length > 0);
+        assertTrue(drainBody(response).length > 0);
     }
 
     @Test
@@ -277,10 +311,11 @@ class CertSignControllerTest {
         request.setPageNumber(1);
         request.setShowLogo(false);
 
-        ResponseEntity<byte[]> response = certSignController.signPDFWithCert(request);
+        ResponseEntity<StreamingResponseBody> response =
+                certSignController.signPDFWithCert(request);
 
         assertNotNull(response.getBody());
-        assertTrue(response.getBody().length > 0);
+        assertTrue(drainBody(response).length > 0);
     }
 
     @Test
@@ -308,10 +343,11 @@ class CertSignControllerTest {
         request.setPageNumber(1);
         request.setShowLogo(false);
 
-        ResponseEntity<byte[]> response = certSignController.signPDFWithCert(request);
+        ResponseEntity<StreamingResponseBody> response =
+                certSignController.signPDFWithCert(request);
 
         assertNotNull(response.getBody());
-        assertTrue(response.getBody().length > 0);
+        assertTrue(drainBody(response).length > 0);
     }
 
     @Test
@@ -339,9 +375,10 @@ class CertSignControllerTest {
         request.setPageNumber(1);
         request.setShowLogo(false);
 
-        ResponseEntity<byte[]> response = certSignController.signPDFWithCert(request);
+        ResponseEntity<StreamingResponseBody> response =
+                certSignController.signPDFWithCert(request);
 
         assertNotNull(response.getBody());
-        assertTrue(response.getBody().length > 0);
+        assertTrue(drainBody(response).length > 0);
     }
 }
diff --git a/app/core/src/test/java/stirling/software/SPDF/controller/api/security/PasswordControllerTest.java b/app/core/src/test/java/stirling/software/SPDF/controller/api/security/PasswordControllerTest.java
index 71ce1b7f4f..d0d1b45fad 100644
--- a/app/core/src/test/java/stirling/software/SPDF/controller/api/security/PasswordControllerTest.java
+++ b/app/core/src/test/java/stirling/software/SPDF/controller/api/security/PasswordControllerTest.java
@@ -3,10 +3,14 @@ package stirling.software.SPDF.controller.api.security;
 import static org.junit.jupiter.api.Assertions.*;
 import static org.mockito.ArgumentMatchers.any;
 import static org.mockito.ArgumentMatchers.anyString;
+import static org.mockito.Mockito.lenient;
+import static org.mockito.Mockito.mock;
 import static org.mockito.Mockito.when;
 
 import java.io.ByteArrayOutputStream;
+import java.io.File;
 import java.io.IOException;
+import java.nio.file.Files;
 
 import org.apache.pdfbox.Loader;
 import org.apache.pdfbox.pdmodel.PDDocument;
@@ -28,17 +32,31 @@ import org.springframework.http.MediaType;
 import org.springframework.http.ResponseEntity;
 import org.springframework.mock.web.MockMultipartFile;
 import org.springframework.web.multipart.MultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import stirling.software.SPDF.model.api.security.AddPasswordRequest;
 import stirling.software.SPDF.model.api.security.PDFPasswordRequest;
 import stirling.software.common.service.CustomPDFDocumentFactory;
+import stirling.software.common.util.TempFile;
+import stirling.software.common.util.TempFileManager;
 
 @DisplayName("PasswordController Tests")
 @ExtendWith(MockitoExtension.class)
 @MockitoSettings(strictness = Strictness.LENIENT)
 class PasswordControllerTest {
+    private static ResponseEntity<StreamingResponseBody> streamingOk(byte[] bytes) {
+        return ResponseEntity.ok(out -> out.write(bytes));
+    }
+
+    private static byte[] drainBody(ResponseEntity<StreamingResponseBody> response)
+            throws java.io.IOException {
+        java.io.ByteArrayOutputStream baos = new java.io.ByteArrayOutputStream();
+        response.getBody().writeTo(baos);
+        return baos.toByteArray();
+    }
 
     @Mock private CustomPDFDocumentFactory pdfDocumentFactory;
+    @Mock private TempFileManager tempFileManager;
 
     @InjectMocks private PasswordController passwordController;
 
@@ -46,6 +64,18 @@ class PasswordControllerTest {
 
     @BeforeEach
     void setUp() throws Exception {
+        lenient()
+                .when(tempFileManager.createManagedTempFile(anyString()))
+                .thenAnswer(
+                        inv -> {
+                            File f =
+                                    Files.createTempFile("test", inv.<String>getArgument(0))
+                                            .toFile();
+                            TempFile tf = mock(TempFile.class);
+                            lenient().when(tf.getFile()).thenReturn(f);
+                            lenient().when(tf.getPath()).thenReturn(f.toPath());
+                            return tf;
+                        });
         try (PDDocument doc = new PDDocument()) {
             doc.addPage(new PDPage());
             ByteArrayOutputStream baos = new ByteArrayOutputStream();
@@ -90,10 +120,11 @@ class PasswordControllerTest {
             when(pdfDocumentFactory.load(any(MultipartFile.class), anyString()))
                     .thenAnswer(inv -> Loader.loadPDF(simplePdfBytes));
 
-            ResponseEntity<byte[]> response = passwordController.removePassword(request);
+            ResponseEntity<StreamingResponseBody> response =
+                    passwordController.removePassword(request);
 
             assertNotNull(response.getBody());
-            assertTrue(response.getBody().length > 0);
+            assertTrue(drainBody(response).length > 0);
             assertEquals(HttpStatus.OK, response.getStatusCode());
         }
 
@@ -114,7 +145,8 @@ class PasswordControllerTest {
             when(pdfDocumentFactory.load(any(MultipartFile.class), anyString()))
                     .thenAnswer(inv -> Loader.loadPDF(simplePdfBytes));
 
-            ResponseEntity<byte[]> response = passwordController.removePassword(request);
+            ResponseEntity<StreamingResponseBody> response =
+                    passwordController.removePassword(request);
 
             assertNotNull(response);
             assertNotNull(response.getBody());
@@ -177,7 +209,8 @@ class PasswordControllerTest {
             when(pdfDocumentFactory.load(any(MultipartFile.class), anyString()))
                     .thenAnswer(inv -> Loader.loadPDF(simplePdfBytes));
 
-            ResponseEntity<byte[]> response = passwordController.removePassword(request);
+            ResponseEntity<StreamingResponseBody> response =
+                    passwordController.removePassword(request);
             assertNotNull(response.getBody());
         }
 
@@ -195,7 +228,8 @@ class PasswordControllerTest {
             when(pdfDocumentFactory.load(any(MultipartFile.class), anyString()))
                     .thenAnswer(inv -> Loader.loadPDF(simplePdfBytes));
 
-            ResponseEntity<byte[]> response = passwordController.removePassword(request);
+            ResponseEntity<StreamingResponseBody> response =
+                    passwordController.removePassword(request);
             assertNotNull(response.getBody());
         }
     }
@@ -223,10 +257,11 @@ class PasswordControllerTest {
             when(pdfDocumentFactory.load(any(MultipartFile.class)))
                     .thenAnswer(inv -> Loader.loadPDF(simplePdfBytes));
 
-            ResponseEntity<byte[]> response = passwordController.addPassword(request);
+            ResponseEntity<StreamingResponseBody> response =
+                    passwordController.addPassword(request);
 
             assertNotNull(response.getBody());
-            assertTrue(response.getBody().length > 0);
+            assertTrue(drainBody(response).length > 0);
         }
 
         @Test
@@ -248,7 +283,8 @@ class PasswordControllerTest {
             when(pdfDocumentFactory.load(any(MultipartFile.class)))
                     .thenAnswer(inv -> Loader.loadPDF(simplePdfBytes));
 
-            ResponseEntity<byte[]> response = passwordController.addPassword(request);
+            ResponseEntity<StreamingResponseBody> response =
+                    passwordController.addPassword(request);
 
             assertNotNull(response.getBody());
         }
@@ -274,7 +310,8 @@ class PasswordControllerTest {
             when(pdfDocumentFactory.load(any(MultipartFile.class)))
                     .thenAnswer(inv -> Loader.loadPDF(simplePdfBytes));
 
-            ResponseEntity<byte[]> response = passwordController.addPassword(request);
+            ResponseEntity<StreamingResponseBody> response =
+                    passwordController.addPassword(request);
             assertNotNull(response.getBody());
         }
 
@@ -297,7 +334,8 @@ class PasswordControllerTest {
             when(pdfDocumentFactory.load(any(MultipartFile.class)))
                     .thenAnswer(inv -> Loader.loadPDF(simplePdfBytes));
 
-            ResponseEntity<byte[]> response = passwordController.addPassword(request);
+            ResponseEntity<StreamingResponseBody> response =
+                    passwordController.addPassword(request);
             assertNotNull(response.getBody());
         }
 
@@ -328,9 +366,10 @@ class PasswordControllerTest {
             when(pdfDocumentFactory.load(any(MultipartFile.class)))
                     .thenAnswer(inv -> Loader.loadPDF(simplePdfBytes));
 
-            ResponseEntity<byte[]> response = passwordController.addPassword(request);
+            ResponseEntity<StreamingResponseBody> response =
+                    passwordController.addPassword(request);
             assertNotNull(response.getBody());
-            assertTrue(response.getBody().length > 0);
+            assertTrue(drainBody(response).length > 0);
         }
 
         @Test
@@ -353,7 +392,8 @@ class PasswordControllerTest {
             when(pdfDocumentFactory.load(any(MultipartFile.class)))
                     .thenAnswer(inv -> Loader.loadPDF(simplePdfBytes));
 
-            ResponseEntity<byte[]> response = passwordController.addPassword(request);
+            ResponseEntity<StreamingResponseBody> response =
+                    passwordController.addPassword(request);
             assertNotNull(response.getBody());
         }
 
@@ -376,7 +416,8 @@ class PasswordControllerTest {
             when(pdfDocumentFactory.load(any(MultipartFile.class)))
                     .thenAnswer(inv -> Loader.loadPDF(simplePdfBytes));
 
-            ResponseEntity<byte[]> response = passwordController.addPassword(request);
+            ResponseEntity<StreamingResponseBody> response =
+                    passwordController.addPassword(request);
             assertNotNull(response.getBody());
         }
 
@@ -399,7 +440,8 @@ class PasswordControllerTest {
             when(pdfDocumentFactory.load(any(MultipartFile.class)))
                     .thenAnswer(inv -> Loader.loadPDF(simplePdfBytes));
 
-            ResponseEntity<byte[]> response = passwordController.addPassword(request);
+            ResponseEntity<StreamingResponseBody> response =
+                    passwordController.addPassword(request);
             assertNotNull(response.getBody());
         }
     }
diff --git a/app/core/src/test/java/stirling/software/SPDF/controller/api/security/RedactControllerTest.java b/app/core/src/test/java/stirling/software/SPDF/controller/api/security/RedactControllerTest.java
index 75f1b8d01d..caa03b3cf3 100644
--- a/app/core/src/test/java/stirling/software/SPDF/controller/api/security/RedactControllerTest.java
+++ b/app/core/src/test/java/stirling/software/SPDF/controller/api/security/RedactControllerTest.java
@@ -1,13 +1,16 @@
 package stirling.software.SPDF.controller.api.security;
 
 import static org.junit.jupiter.api.Assertions.*;
+import static org.mockito.ArgumentMatchers.anyString;
 import static org.mockito.Mockito.*;
 
 import java.awt.Color;
 import java.io.ByteArrayInputStream;
 import java.io.ByteArrayOutputStream;
+import java.io.File;
 import java.io.IOException;
 import java.io.InputStream;
+import java.nio.file.Files;
 import java.util.ArrayList;
 import java.util.Collections;
 import java.util.List;
@@ -44,20 +47,34 @@ import org.slf4j.LoggerFactory;
 import org.springframework.http.MediaType;
 import org.springframework.http.ResponseEntity;
 import org.springframework.mock.web.MockMultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import stirling.software.SPDF.model.api.security.ManualRedactPdfRequest;
 import stirling.software.SPDF.model.api.security.RedactPdfRequest;
 import stirling.software.common.model.api.security.RedactionArea;
 import stirling.software.common.service.CustomPDFDocumentFactory;
+import stirling.software.common.util.TempFile;
+import stirling.software.common.util.TempFileManager;
 
 @DisplayName("PDF Redaction Controller tests")
 @ExtendWith(MockitoExtension.class)
 @MockitoSettings(strictness = Strictness.LENIENT)
 class RedactControllerTest {
+    private static ResponseEntity<StreamingResponseBody> streamingOk(byte[] bytes) {
+        return ResponseEntity.ok(out -> out.write(bytes));
+    }
+
+    private static byte[] drainBody(ResponseEntity<StreamingResponseBody> response)
+            throws java.io.IOException {
+        java.io.ByteArrayOutputStream baos = new java.io.ByteArrayOutputStream();
+        response.getBody().writeTo(baos);
+        return baos.toByteArray();
+    }
 
     private static final Logger log = LoggerFactory.getLogger(RedactControllerTest.class);
 
     @Mock private CustomPDFDocumentFactory pdfDocumentFactory;
+    @Mock private TempFileManager tempFileManager;
 
     @InjectMocks private RedactController redactController;
 
@@ -112,6 +129,18 @@ class RedactControllerTest {
 
     @BeforeEach
     void setUp() throws IOException {
+        lenient()
+                .when(tempFileManager.createManagedTempFile(anyString()))
+                .thenAnswer(
+                        inv -> {
+                            File f =
+                                    Files.createTempFile("test", inv.<String>getArgument(0))
+                                            .toFile();
+                            TempFile tf = mock(TempFile.class);
+                            lenient().when(tf.getFile()).thenReturn(f);
+                            lenient().when(tf.getPath()).thenReturn(f.toPath());
+                            return tf;
+                        });
         mockPdfFile =
                 new MockMultipartFile(
                         "fileInput",
@@ -159,14 +188,15 @@ class RedactControllerTest {
         when(mockCOSStream.createOutputStream()).thenReturn(mockOutputStream);
         when(mockCOSStream.createOutputStream(any())).thenReturn(mockOutputStream);
 
-        doAnswer(
-                        invocation -> {
-                            ByteArrayOutputStream baos = invocation.getArgument(0);
-                            baos.write("Mock PDF Content".getBytes());
+        lenient()
+                .doAnswer(
+                        inv -> {
+                            File f = inv.getArgument(0);
+                            java.nio.file.Files.write(f.toPath(), "mock pdf".getBytes());
                             return null;
                         })
                 .when(mockDocument)
-                .save(any(ByteArrayOutputStream.class));
+                .save(any(File.class));
         doNothing().when(mockDocument).close();
 
         // Initialize a real document for unit tests
@@ -298,12 +328,12 @@ class RedactControllerTest {
                     mock(org.apache.pdfbox.pdmodel.PDDocumentInformation.class);
             when(mockDocument.getDocumentInformation()).thenReturn(mockInfo);
 
-            ResponseEntity<byte[]> response = redactController.redactPdf(request);
+            ResponseEntity<StreamingResponseBody> response = redactController.redactPdf(request);
 
             assertNotNull(response);
             assertEquals(200, response.getStatusCode().value());
 
-            verify(mockDocument).save(any(ByteArrayOutputStream.class));
+            verify(mockDocument).save(any(File.class));
             verify(mockDocument).close();
         }
     }
@@ -702,14 +732,14 @@ class RedactControllerTest {
         request.setConvertPDFToImage(convertToImage);
 
         try {
-            ResponseEntity<byte[]> response = redactController.redactPdf(request);
+            ResponseEntity<StreamingResponseBody> response = redactController.redactPdf(request);
 
             if (expectSuccess && response != null) {
                 assertNotNull(response);
                 assertEquals(200, response.getStatusCode().value());
                 assertNotNull(response.getBody());
-                assertTrue(response.getBody().length > 0);
-                verify(mockDocument, times(1)).save(any(ByteArrayOutputStream.class));
+                assertTrue(drainBody(response).length > 0);
+                verify(mockDocument, times(1)).save(any(File.class));
                 verify(mockDocument, times(1)).close();
             }
         } catch (Exception e) {
@@ -727,12 +757,12 @@ class RedactControllerTest {
         request.setConvertPDFToImage(convertToImage);
 
         try {
-            ResponseEntity<byte[]> response = redactController.redactPDF(request);
+            ResponseEntity<StreamingResponseBody> response = redactController.redactPDF(request);
 
             if (response != null) {
                 assertNotNull(response);
                 assertEquals(200, response.getStatusCode().value());
-                verify(mockDocument, times(1)).save(any(ByteArrayOutputStream.class));
+                verify(mockDocument, times(1)).save(any(File.class));
             }
         } catch (Exception e) {
             log.info("Manual redaction test completed with graceful handling: {}", e.getMessage());
@@ -918,7 +948,7 @@ class RedactControllerTest {
             request.setListOfText("test");
             request.setRedactColor(null);
 
-            ResponseEntity<byte[]> response = redactController.redactPdf(request);
+            ResponseEntity<StreamingResponseBody> response = redactController.redactPdf(request);
 
             assertNotNull(response);
             assertEquals(200, response.getStatusCode().value());
@@ -942,7 +972,7 @@ class RedactControllerTest {
             ManualRedactPdfRequest request = createManualRedactPdfRequest();
             request.setRedactions(null);
 
-            ResponseEntity<byte[]> response = redactController.redactPDF(request);
+            ResponseEntity<StreamingResponseBody> response = redactController.redactPDF(request);
 
             assertNotNull(response);
             assertEquals(200, response.getStatusCode().value());
@@ -954,7 +984,7 @@ class RedactControllerTest {
             ManualRedactPdfRequest request = createManualRedactPdfRequest();
             request.setPageNumbers("100-200");
 
-            ResponseEntity<byte[]> response = redactController.redactPDF(request);
+            ResponseEntity<StreamingResponseBody> response = redactController.redactPDF(request);
 
             assertNotNull(response);
             assertEquals(200, response.getStatusCode().value());
@@ -1419,12 +1449,12 @@ class RedactControllerTest {
             request.setUseRegex(false);
             request.setWholeWordSearch(false);
 
-            ResponseEntity<byte[]> response = redactController.redactPdf(request);
+            ResponseEntity<StreamingResponseBody> response = redactController.redactPdf(request);
 
             assertNotNull(response);
             assertEquals(200, response.getStatusCode().value());
             assertNotNull(response.getBody());
-            assertTrue(response.getBody().length > 0);
+            assertTrue(drainBody(response).length > 0);
         }
     }
 }
diff --git a/app/core/src/test/java/stirling/software/SPDF/controller/api/security/RemoveCertSignControllerTest.java b/app/core/src/test/java/stirling/software/SPDF/controller/api/security/RemoveCertSignControllerTest.java
index cf8b03ec9b..1cf95e7e23 100644
--- a/app/core/src/test/java/stirling/software/SPDF/controller/api/security/RemoveCertSignControllerTest.java
+++ b/app/core/src/test/java/stirling/software/SPDF/controller/api/security/RemoveCertSignControllerTest.java
@@ -2,10 +2,15 @@ package stirling.software.SPDF.controller.api.security;
 
 import static org.junit.jupiter.api.Assertions.*;
 import static org.mockito.ArgumentMatchers.any;
+import static org.mockito.ArgumentMatchers.anyString;
+import static org.mockito.Mockito.lenient;
+import static org.mockito.Mockito.mock;
 import static org.mockito.Mockito.when;
 
 import java.io.ByteArrayOutputStream;
+import java.io.File;
 import java.io.IOException;
+import java.nio.file.Files;
 
 import org.apache.pdfbox.Loader;
 import org.apache.pdfbox.pdmodel.PDDocument;
@@ -27,16 +32,30 @@ import org.springframework.http.MediaType;
 import org.springframework.http.ResponseEntity;
 import org.springframework.mock.web.MockMultipartFile;
 import org.springframework.web.multipart.MultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import stirling.software.common.model.api.PDFFile;
 import stirling.software.common.service.CustomPDFDocumentFactory;
+import stirling.software.common.util.TempFile;
+import stirling.software.common.util.TempFileManager;
 
 @DisplayName("RemoveCertSignController Tests")
 @ExtendWith(MockitoExtension.class)
 @MockitoSettings(strictness = Strictness.LENIENT)
 class RemoveCertSignControllerTest {
+    private static ResponseEntity<StreamingResponseBody> streamingOk(byte[] bytes) {
+        return ResponseEntity.ok(out -> out.write(bytes));
+    }
+
+    private static byte[] drainBody(ResponseEntity<StreamingResponseBody> response)
+            throws java.io.IOException {
+        java.io.ByteArrayOutputStream baos = new java.io.ByteArrayOutputStream();
+        response.getBody().writeTo(baos);
+        return baos.toByteArray();
+    }
 
     @Mock private CustomPDFDocumentFactory pdfDocumentFactory;
+    @Mock private TempFileManager tempFileManager;
 
     @InjectMocks private RemoveCertSignController removeCertSignController;
 
@@ -44,6 +63,18 @@ class RemoveCertSignControllerTest {
 
     @BeforeEach
     void setUp() throws Exception {
+        lenient()
+                .when(tempFileManager.createManagedTempFile(anyString()))
+                .thenAnswer(
+                        inv -> {
+                            File f =
+                                    Files.createTempFile("test", inv.<String>getArgument(0))
+                                            .toFile();
+                            TempFile tf = mock(TempFile.class);
+                            lenient().when(tf.getFile()).thenReturn(f);
+                            lenient().when(tf.getPath()).thenReturn(f.toPath());
+                            return tf;
+                        });
         try (PDDocument doc = new PDDocument()) {
             doc.addPage(new PDPage());
             ByteArrayOutputStream baos = new ByteArrayOutputStream();
@@ -72,10 +103,11 @@ class RemoveCertSignControllerTest {
             when(pdfDocumentFactory.load(any(MultipartFile.class)))
                     .thenAnswer(inv -> Loader.loadPDF(simplePdfBytes));
 
-            ResponseEntity<byte[]> response = removeCertSignController.removeCertSignPDF(request);
+            ResponseEntity<StreamingResponseBody> response =
+                    removeCertSignController.removeCertSignPDF(request);
 
             assertNotNull(response.getBody());
-            assertTrue(response.getBody().length > 0);
+            assertTrue(drainBody(response).length > 0);
             assertEquals(HttpStatus.OK, response.getStatusCode());
         }
 
@@ -95,7 +127,8 @@ class RemoveCertSignControllerTest {
             when(pdfDocumentFactory.load(any(MultipartFile.class)))
                     .thenAnswer(inv -> Loader.loadPDF(simplePdfBytes));
 
-            ResponseEntity<byte[]> response = removeCertSignController.removeCertSignPDF(request);
+            ResponseEntity<StreamingResponseBody> response =
+                    removeCertSignController.removeCertSignPDF(request);
 
             assertNotNull(response.getBody());
         }
@@ -126,7 +159,8 @@ class RemoveCertSignControllerTest {
             when(pdfDocumentFactory.load(any(MultipartFile.class)))
                     .thenAnswer(inv -> Loader.loadPDF(pdfWithAcroForm));
 
-            ResponseEntity<byte[]> response = removeCertSignController.removeCertSignPDF(request);
+            ResponseEntity<StreamingResponseBody> response =
+                    removeCertSignController.removeCertSignPDF(request);
             assertNotNull(response.getBody());
         }
 
@@ -156,7 +190,8 @@ class RemoveCertSignControllerTest {
             when(pdfDocumentFactory.load(any(MultipartFile.class)))
                     .thenAnswer(inv -> Loader.loadPDF(pdfWithSig));
 
-            ResponseEntity<byte[]> response = removeCertSignController.removeCertSignPDF(request);
+            ResponseEntity<StreamingResponseBody> response =
+                    removeCertSignController.removeCertSignPDF(request);
             assertNotNull(response.getBody());
         }
 
@@ -176,7 +211,8 @@ class RemoveCertSignControllerTest {
             when(pdfDocumentFactory.load(any(MultipartFile.class)))
                     .thenAnswer(inv -> Loader.loadPDF(simplePdfBytes));
 
-            ResponseEntity<byte[]> response = removeCertSignController.removeCertSignPDF(request);
+            ResponseEntity<StreamingResponseBody> response =
+                    removeCertSignController.removeCertSignPDF(request);
             assertNotNull(response);
             assertEquals(HttpStatus.OK, response.getStatusCode());
         }
@@ -194,7 +230,8 @@ class RemoveCertSignControllerTest {
             when(pdfDocumentFactory.load(any(MultipartFile.class)))
                     .thenAnswer(inv -> Loader.loadPDF(simplePdfBytes));
 
-            ResponseEntity<byte[]> response = removeCertSignController.removeCertSignPDF(request);
+            ResponseEntity<StreamingResponseBody> response =
+                    removeCertSignController.removeCertSignPDF(request);
             assertNotNull(response.getBody());
         }
 
@@ -224,7 +261,8 @@ class RemoveCertSignControllerTest {
             when(pdfDocumentFactory.load(any(MultipartFile.class)))
                     .thenAnswer(inv -> Loader.loadPDF(multiPagePdf));
 
-            ResponseEntity<byte[]> response = removeCertSignController.removeCertSignPDF(request);
+            ResponseEntity<StreamingResponseBody> response =
+                    removeCertSignController.removeCertSignPDF(request);
             assertNotNull(response.getBody());
         }
 
diff --git a/app/core/src/test/java/stirling/software/SPDF/controller/api/security/SanitizeControllerTest.java b/app/core/src/test/java/stirling/software/SPDF/controller/api/security/SanitizeControllerTest.java
index 19b77c17f1..a806c1e291 100644
--- a/app/core/src/test/java/stirling/software/SPDF/controller/api/security/SanitizeControllerTest.java
+++ b/app/core/src/test/java/stirling/software/SPDF/controller/api/security/SanitizeControllerTest.java
@@ -3,10 +3,15 @@ package stirling.software.SPDF.controller.api.security;
 import static org.junit.jupiter.api.Assertions.*;
 import static org.mockito.ArgumentMatchers.any;
 import static org.mockito.ArgumentMatchers.anyBoolean;
+import static org.mockito.ArgumentMatchers.anyString;
+import static org.mockito.Mockito.lenient;
+import static org.mockito.Mockito.mock;
 import static org.mockito.Mockito.when;
 
 import java.io.ByteArrayOutputStream;
+import java.io.File;
 import java.io.IOException;
+import java.nio.file.Files;
 
 import org.apache.pdfbox.Loader;
 import org.apache.pdfbox.pdmodel.PDDocument;
@@ -35,16 +40,30 @@ import org.springframework.http.MediaType;
 import org.springframework.http.ResponseEntity;
 import org.springframework.mock.web.MockMultipartFile;
 import org.springframework.web.multipart.MultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import stirling.software.SPDF.model.api.security.SanitizePdfRequest;
 import stirling.software.common.service.CustomPDFDocumentFactory;
+import stirling.software.common.util.TempFile;
+import stirling.software.common.util.TempFileManager;
 
 @DisplayName("SanitizeController Tests")
 @ExtendWith(MockitoExtension.class)
 @MockitoSettings(strictness = Strictness.LENIENT)
 class SanitizeControllerTest {
+    private static ResponseEntity<StreamingResponseBody> streamingOk(byte[] bytes) {
+        return ResponseEntity.ok(out -> out.write(bytes));
+    }
+
+    private static byte[] drainBody(ResponseEntity<StreamingResponseBody> response)
+            throws java.io.IOException {
+        java.io.ByteArrayOutputStream baos = new java.io.ByteArrayOutputStream();
+        response.getBody().writeTo(baos);
+        return baos.toByteArray();
+    }
 
     @Mock private CustomPDFDocumentFactory pdfDocumentFactory;
+    @Mock private TempFileManager tempFileManager;
 
     @InjectMocks private SanitizeController sanitizeController;
 
@@ -52,6 +71,18 @@ class SanitizeControllerTest {
 
     @BeforeEach
     void setUp() throws Exception {
+        lenient()
+                .when(tempFileManager.createManagedTempFile(anyString()))
+                .thenAnswer(
+                        inv -> {
+                            File f =
+                                    Files.createTempFile("test", inv.<String>getArgument(0))
+                                            .toFile();
+                            TempFile tf = mock(TempFile.class);
+                            lenient().when(tf.getFile()).thenReturn(f);
+                            lenient().when(tf.getPath()).thenReturn(f.toPath());
+                            return tf;
+                        });
         try (PDDocument doc = new PDDocument()) {
             PDPage page = new PDPage(PDRectangle.A4);
             doc.addPage(page);
@@ -139,7 +170,8 @@ class SanitizeControllerTest {
             when(pdfDocumentFactory.load(any(MultipartFile.class), anyBoolean()))
                     .thenAnswer(inv -> Loader.loadPDF(jsBytes));
 
-            ResponseEntity<byte[]> response = sanitizeController.sanitizePDF(request);
+            ResponseEntity<StreamingResponseBody> response =
+                    sanitizeController.sanitizePDF(request);
 
             assertNotNull(response.getBody());
             assertEquals(HttpStatus.OK, response.getStatusCode());
@@ -167,7 +199,8 @@ class SanitizeControllerTest {
             when(pdfDocumentFactory.load(any(MultipartFile.class), anyBoolean()))
                     .thenAnswer(inv -> Loader.loadPDF(simplePdfBytes));
 
-            ResponseEntity<byte[]> response = sanitizeController.sanitizePDF(request);
+            ResponseEntity<StreamingResponseBody> response =
+                    sanitizeController.sanitizePDF(request);
             assertNotNull(response.getBody());
         }
     }
@@ -196,9 +229,10 @@ class SanitizeControllerTest {
             when(pdfDocumentFactory.load(any(MultipartFile.class), anyBoolean()))
                     .thenAnswer(inv -> Loader.loadPDF(linkBytes));
 
-            ResponseEntity<byte[]> response = sanitizeController.sanitizePDF(request);
+            ResponseEntity<StreamingResponseBody> response =
+                    sanitizeController.sanitizePDF(request);
             assertNotNull(response.getBody());
-            assertTrue(response.getBody().length > 0);
+            assertTrue(drainBody(response).length > 0);
         }
     }
 
@@ -226,7 +260,8 @@ class SanitizeControllerTest {
             when(pdfDocumentFactory.load(any(MultipartFile.class), anyBoolean()))
                     .thenAnswer(inv -> Loader.loadPDF(metaBytes));
 
-            ResponseEntity<byte[]> response = sanitizeController.sanitizePDF(request);
+            ResponseEntity<StreamingResponseBody> response =
+                    sanitizeController.sanitizePDF(request);
             assertNotNull(response.getBody());
         }
 
@@ -252,7 +287,8 @@ class SanitizeControllerTest {
             when(pdfDocumentFactory.load(any(MultipartFile.class), anyBoolean()))
                     .thenAnswer(inv -> Loader.loadPDF(simplePdfBytes));
 
-            ResponseEntity<byte[]> response = sanitizeController.sanitizePDF(request);
+            ResponseEntity<StreamingResponseBody> response =
+                    sanitizeController.sanitizePDF(request);
             assertNotNull(response.getBody());
         }
     }
@@ -283,7 +319,8 @@ class SanitizeControllerTest {
             when(pdfDocumentFactory.load(any(MultipartFile.class), anyBoolean()))
                     .thenAnswer(inv -> Loader.loadPDF(simplePdfBytes));
 
-            ResponseEntity<byte[]> response = sanitizeController.sanitizePDF(request);
+            ResponseEntity<StreamingResponseBody> response =
+                    sanitizeController.sanitizePDF(request);
             assertNotNull(response.getBody());
         }
     }
@@ -312,9 +349,10 @@ class SanitizeControllerTest {
             when(pdfDocumentFactory.load(any(MultipartFile.class), anyBoolean()))
                     .thenAnswer(inv -> Loader.loadPDF(jsBytes));
 
-            ResponseEntity<byte[]> response = sanitizeController.sanitizePDF(request);
+            ResponseEntity<StreamingResponseBody> response =
+                    sanitizeController.sanitizePDF(request);
             assertNotNull(response.getBody());
-            assertTrue(response.getBody().length > 0);
+            assertTrue(drainBody(response).length > 0);
         }
 
         @Test
@@ -339,7 +377,8 @@ class SanitizeControllerTest {
             when(pdfDocumentFactory.load(any(MultipartFile.class), anyBoolean()))
                     .thenAnswer(inv -> Loader.loadPDF(simplePdfBytes));
 
-            ResponseEntity<byte[]> response = sanitizeController.sanitizePDF(request);
+            ResponseEntity<StreamingResponseBody> response =
+                    sanitizeController.sanitizePDF(request);
             assertNotNull(response.getBody());
         }
 
@@ -360,7 +399,8 @@ class SanitizeControllerTest {
             when(pdfDocumentFactory.load(any(MultipartFile.class), anyBoolean()))
                     .thenAnswer(inv -> Loader.loadPDF(simplePdfBytes));
 
-            ResponseEntity<byte[]> response = sanitizeController.sanitizePDF(request);
+            ResponseEntity<StreamingResponseBody> response =
+                    sanitizeController.sanitizePDF(request);
             assertNotNull(response.getBody());
         }
 
@@ -386,7 +426,8 @@ class SanitizeControllerTest {
             when(pdfDocumentFactory.load(any(MultipartFile.class), anyBoolean()))
                     .thenAnswer(inv -> Loader.loadPDF(simplePdfBytes));
 
-            ResponseEntity<byte[]> response = sanitizeController.sanitizePDF(request);
+            ResponseEntity<StreamingResponseBody> response =
+                    sanitizeController.sanitizePDF(request);
             assertNotNull(response.getBody());
         }
 
@@ -412,7 +453,8 @@ class SanitizeControllerTest {
             when(pdfDocumentFactory.load(any(MultipartFile.class), anyBoolean()))
                     .thenAnswer(inv -> Loader.loadPDF(simplePdfBytes));
 
-            ResponseEntity<byte[]> response = sanitizeController.sanitizePDF(request);
+            ResponseEntity<StreamingResponseBody> response =
+                    sanitizeController.sanitizePDF(request);
             assertNotNull(response);
             assertEquals(HttpStatus.OK, response.getStatusCode());
         }
diff --git a/app/core/src/test/java/stirling/software/SPDF/controller/api/security/WatermarkControllerTest.java b/app/core/src/test/java/stirling/software/SPDF/controller/api/security/WatermarkControllerTest.java
index d504ad2606..3081bb8da4 100644
--- a/app/core/src/test/java/stirling/software/SPDF/controller/api/security/WatermarkControllerTest.java
+++ b/app/core/src/test/java/stirling/software/SPDF/controller/api/security/WatermarkControllerTest.java
@@ -2,9 +2,14 @@ package stirling.software.SPDF.controller.api.security;
 
 import static org.junit.jupiter.api.Assertions.*;
 import static org.mockito.ArgumentMatchers.any;
+import static org.mockito.ArgumentMatchers.anyString;
+import static org.mockito.Mockito.lenient;
+import static org.mockito.Mockito.mock;
 import static org.mockito.Mockito.when;
 
 import java.io.ByteArrayOutputStream;
+import java.io.File;
+import java.nio.file.Files;
 
 import org.apache.pdfbox.Loader;
 import org.apache.pdfbox.pdmodel.PDDocument;
@@ -28,16 +33,30 @@ import org.springframework.http.MediaType;
 import org.springframework.http.ResponseEntity;
 import org.springframework.mock.web.MockMultipartFile;
 import org.springframework.web.multipart.MultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import stirling.software.SPDF.model.api.security.AddWatermarkRequest;
 import stirling.software.common.service.CustomPDFDocumentFactory;
+import stirling.software.common.util.TempFile;
+import stirling.software.common.util.TempFileManager;
 
 @DisplayName("WatermarkController Tests")
 @ExtendWith(MockitoExtension.class)
 @MockitoSettings(strictness = Strictness.LENIENT)
 class WatermarkControllerTest {
+    private static ResponseEntity<StreamingResponseBody> streamingOk(byte[] bytes) {
+        return ResponseEntity.ok(out -> out.write(bytes));
+    }
+
+    private static byte[] drainBody(ResponseEntity<StreamingResponseBody> response)
+            throws java.io.IOException {
+        java.io.ByteArrayOutputStream baos = new java.io.ByteArrayOutputStream();
+        response.getBody().writeTo(baos);
+        return baos.toByteArray();
+    }
 
     @Mock private CustomPDFDocumentFactory pdfDocumentFactory;
+    @Mock private TempFileManager tempFileManager;
 
     @InjectMocks private WatermarkController watermarkController;
 
@@ -45,6 +64,18 @@ class WatermarkControllerTest {
 
     @BeforeEach
     void setUp() throws Exception {
+        lenient()
+                .when(tempFileManager.createManagedTempFile(anyString()))
+                .thenAnswer(
+                        inv -> {
+                            File f =
+                                    Files.createTempFile("test", inv.<String>getArgument(0))
+                                            .toFile();
+                            TempFile tf = mock(TempFile.class);
+                            lenient().when(tf.getFile()).thenReturn(f);
+                            lenient().when(tf.getPath()).thenReturn(f.toPath());
+                            return tf;
+                        });
         try (PDDocument doc = new PDDocument()) {
             PDPage page = new PDPage(PDRectangle.A4);
             doc.addPage(page);
@@ -91,10 +122,11 @@ class WatermarkControllerTest {
             when(pdfDocumentFactory.load(any(MultipartFile.class)))
                     .thenAnswer(inv -> Loader.loadPDF(simplePdfBytes));
 
-            ResponseEntity<byte[]> response = watermarkController.addWatermark(request);
+            ResponseEntity<StreamingResponseBody> response =
+                    watermarkController.addWatermark(request);
 
             assertNotNull(response.getBody());
-            assertTrue(response.getBody().length > 0);
+            assertTrue(drainBody(response).length > 0);
             assertEquals(HttpStatus.OK, response.getStatusCode());
         }
 
@@ -124,7 +156,8 @@ class WatermarkControllerTest {
             when(pdfDocumentFactory.load(any(MultipartFile.class)))
                     .thenAnswer(inv -> Loader.loadPDF(simplePdfBytes));
 
-            ResponseEntity<byte[]> response = watermarkController.addWatermark(request);
+            ResponseEntity<StreamingResponseBody> response =
+                    watermarkController.addWatermark(request);
             assertNotNull(response.getBody());
         }
 
@@ -154,7 +187,8 @@ class WatermarkControllerTest {
             when(pdfDocumentFactory.load(any(MultipartFile.class)))
                     .thenAnswer(inv -> Loader.loadPDF(simplePdfBytes));
 
-            ResponseEntity<byte[]> response = watermarkController.addWatermark(request);
+            ResponseEntity<StreamingResponseBody> response =
+                    watermarkController.addWatermark(request);
             assertNotNull(response.getBody());
         }
 
@@ -184,7 +218,8 @@ class WatermarkControllerTest {
             when(pdfDocumentFactory.load(any(MultipartFile.class)))
                     .thenAnswer(inv -> Loader.loadPDF(simplePdfBytes));
 
-            ResponseEntity<byte[]> response = watermarkController.addWatermark(request);
+            ResponseEntity<StreamingResponseBody> response =
+                    watermarkController.addWatermark(request);
             assertNotNull(response.getBody());
         }
 
@@ -214,7 +249,8 @@ class WatermarkControllerTest {
             when(pdfDocumentFactory.load(any(MultipartFile.class)))
                     .thenAnswer(inv -> Loader.loadPDF(simplePdfBytes));
 
-            ResponseEntity<byte[]> response = watermarkController.addWatermark(request);
+            ResponseEntity<StreamingResponseBody> response =
+                    watermarkController.addWatermark(request);
             assertNotNull(response.getBody());
         }
     }
@@ -350,9 +386,10 @@ class WatermarkControllerTest {
             when(pdfDocumentFactory.load(any(MultipartFile.class)))
                     .thenAnswer(inv -> Loader.loadPDF(multiPagePdf));
 
-            ResponseEntity<byte[]> response = watermarkController.addWatermark(request);
+            ResponseEntity<StreamingResponseBody> response =
+                    watermarkController.addWatermark(request);
             assertNotNull(response.getBody());
-            assertTrue(response.getBody().length > 0);
+            assertTrue(drainBody(response).length > 0);
         }
     }
 
@@ -391,7 +428,8 @@ class WatermarkControllerTest {
             when(pdfDocumentFactory.load(any(MultipartFile.class)))
                     .thenAnswer(inv -> Loader.loadPDF(simplePdfBytes));
 
-            ResponseEntity<byte[]> response = watermarkController.addWatermark(request);
+            ResponseEntity<StreamingResponseBody> response =
+                    watermarkController.addWatermark(request);
             assertNotNull(response.getBody());
         }
 
@@ -418,7 +456,8 @@ class WatermarkControllerTest {
             when(pdfDocumentFactory.load(any(MultipartFile.class)))
                     .thenAnswer(inv -> Loader.loadPDF(simplePdfBytes));
 
-            ResponseEntity<byte[]> response = watermarkController.addWatermark(request);
+            ResponseEntity<StreamingResponseBody> response =
+                    watermarkController.addWatermark(request);
             assertNotNull(response.getBody());
         }
 
@@ -448,7 +487,8 @@ class WatermarkControllerTest {
             when(pdfDocumentFactory.load(any(MultipartFile.class)))
                     .thenAnswer(inv -> Loader.loadPDF(simplePdfBytes));
 
-            ResponseEntity<byte[]> response = watermarkController.addWatermark(request);
+            ResponseEntity<StreamingResponseBody> response =
+                    watermarkController.addWatermark(request);
             assertNotNull(response.getBody());
         }
     }
diff --git a/app/core/src/test/java/stirling/software/SPDF/model/api/converters/ConvertPDFToMarkdownTest.java b/app/core/src/test/java/stirling/software/SPDF/model/api/converters/ConvertPDFToMarkdownTest.java
index ca24ff46f0..b3edb4e451 100644
--- a/app/core/src/test/java/stirling/software/SPDF/model/api/converters/ConvertPDFToMarkdownTest.java
+++ b/app/core/src/test/java/stirling/software/SPDF/model/api/converters/ConvertPDFToMarkdownTest.java
@@ -3,6 +3,7 @@ package stirling.software.SPDF.model.api.converters;
 import static org.junit.jupiter.api.Assertions.assertEquals;
 import static org.mockito.ArgumentMatchers.any;
 import static org.mockito.Mockito.*;
+import static org.springframework.test.web.servlet.request.MockMvcRequestBuilders.asyncDispatch;
 import static org.springframework.test.web.servlet.request.MockMvcRequestBuilders.multipart;
 import static org.springframework.test.web.servlet.result.MockMvcResultMatchers.*;
 
@@ -16,10 +17,12 @@ import org.springframework.http.HttpStatus;
 import org.springframework.http.ResponseEntity;
 import org.springframework.mock.web.MockMultipartFile;
 import org.springframework.test.web.servlet.MockMvc;
+import org.springframework.test.web.servlet.MvcResult;
 import org.springframework.test.web.servlet.setup.MockMvcBuilders;
 import org.springframework.web.bind.annotation.ExceptionHandler;
 import org.springframework.web.bind.annotation.RestControllerAdvice;
 import org.springframework.web.multipart.MultipartFile;
+import org.springframework.web.servlet.mvc.method.annotation.StreamingResponseBody;
 
 import stirling.software.common.util.PDFToFile;
 
@@ -34,10 +37,11 @@ class ConvertPDFToMarkdownTest {
     @RestControllerAdvice
     static class GlobalErrorHandler {
         @ExceptionHandler(Exception.class)
-        ResponseEntity<byte[]> handle(Exception ex) {
+        ResponseEntity<StreamingResponseBody> handle(Exception ex) {
             String message = ex.getMessage();
             byte[] body = message != null ? message.getBytes(StandardCharsets.UTF_8) : new byte[0];
-            return ResponseEntity.status(HttpStatus.INTERNAL_SERVER_ERROR).body(body);
+            StreamingResponseBody stream = out -> out.write(body);
+            return ResponseEntity.status(HttpStatus.INTERNAL_SERVER_ERROR).body(stream);
         }
     }
 
@@ -49,12 +53,13 @@ class ConvertPDFToMarkdownTest {
                 Mockito.mockConstruction(
                         PDFToFile.class,
                         (mock, ctx) -> {
+                            StreamingResponseBody stream = out -> out.write(md);
                             when(mock.processPdfToMarkdown(any(MultipartFile.class)))
                                     .thenAnswer(
                                             inv ->
                                                     ResponseEntity.ok()
                                                             .header("Content-Type", "text/markdown")
-                                                            .body(md));
+                                                            .body(stream));
                         })) {
 
             MockMvc mvc = mockMvc();
@@ -66,7 +71,12 @@ class ConvertPDFToMarkdownTest {
                             "application/pdf",
                             new byte[] {1, 2, 3});
 
-            mvc.perform(multipart("/api/v1/convert/pdf/markdown").file(file))
+            MvcResult asyncResult =
+                    mvc.perform(multipart("/api/v1/convert/pdf/markdown").file(file))
+                            .andExpect(request().asyncStarted())
+                            .andReturn();
+
+            mvc.perform(asyncDispatch(asyncResult))
                     .andExpect(status().isOk())
                     .andExpect(header().string("Content-Type", "text/markdown"))
                     .andExpect(content().bytes(md));
diff --git a/app/core/src/test/java/stirling/software/SPDF/service/ApiDocServiceTest.java b/app/core/src/test/java/stirling/software/SPDF/service/ApiDocServiceTest.java
index 302cb8fd81..42b56a9cfa 100644
--- a/app/core/src/test/java/stirling/software/SPDF/service/ApiDocServiceTest.java
+++ b/app/core/src/test/java/stirling/software/SPDF/service/ApiDocServiceTest.java
@@ -9,6 +9,8 @@ import java.util.Map;
 import org.junit.jupiter.api.BeforeEach;
 import org.junit.jupiter.api.Test;
 import org.junit.jupiter.api.extension.ExtendWith;
+import org.junit.jupiter.params.ParameterizedTest;
+import org.junit.jupiter.params.provider.CsvSource;
 import org.mockito.Mock;
 import org.mockito.junit.jupiter.MockitoExtension;
 
@@ -348,6 +350,123 @@ class ApiDocServiceTest {
         assertTrue(apiDocService.isMultiInput("/miso"));
     }
 
+    @Test
+    void shouldUnpackZipResponseDetectsMultiOutputType() throws Exception {
+        String json = "{\"description\": \"Output:PDF Type:SIMO\"}";
+        JsonNode postNode = mapper.readTree(json);
+        ApiEndpoint endpoint = new ApiEndpoint("/split", postNode);
+        setApiDocumentation(Map.of("/split", endpoint));
+        setApiDocsJsonRootNode();
+        assertTrue(apiDocService.shouldUnpackZipResponse("/split"));
+    }
+
+    @Test
+    void shouldUnpackZipResponseDetectsMimoType() throws Exception {
+        String json = "{\"description\": \"Output:PDF Type:MIMO\"}";
+        JsonNode postNode = mapper.readTree(json);
+        ApiEndpoint endpoint = new ApiEndpoint("/overlay", postNode);
+        setApiDocumentation(Map.of("/overlay", endpoint));
+        setApiDocsJsonRootNode();
+        assertTrue(apiDocService.shouldUnpackZipResponse("/overlay"));
+    }
+
+    @Test
+    void shouldUnpackZipResponseDetectsZipOutputDeclaration() throws Exception {
+        String json = "{\"description\": \"Output:ZIP-PDF Type:SISO\"}";
+        JsonNode postNode = mapper.readTree(json);
+        ApiEndpoint endpoint = new ApiEndpoint("/split-by-sections", postNode);
+        setApiDocumentation(Map.of("/split-by-sections", endpoint));
+        setApiDocsJsonRootNode();
+        assertTrue(apiDocService.shouldUnpackZipResponse("/split-by-sections"));
+    }
+
+    @Test
+    void shouldUnpackZipResponseReturnsFalseForSisoPdf() throws Exception {
+        String json = "{\"description\": \"Input:PDF Output:PDF Type:SISO\"}";
+        JsonNode postNode = mapper.readTree(json);
+        ApiEndpoint endpoint = new ApiEndpoint("/rotate", postNode);
+        setApiDocumentation(Map.of("/rotate", endpoint));
+        setApiDocsJsonRootNode();
+        assertFalse(apiDocService.shouldUnpackZipResponse("/rotate"));
+    }
+
+    @Test
+    void shouldUnpackZipResponseReturnsFalseForUnknownOperation() throws Exception {
+        setApiDocumentation(Map.of());
+        assertFalse(apiDocService.shouldUnpackZipResponse("/unknown"));
+    }
+
+    /**
+     * Coverage test: every Stirling endpoint whose ZIP response is a transport for multiple typed
+     * results (SIMO/MIMO or Output:ZIP-PDF / Output:IMAGE/ZIP etc.) must be classified as {@code
+     * shouldUnpackZipResponse = true}. Descriptions below are the real
+     * {@code @Operation(description=...)} strings from each controller, so if a controller is
+     * renamed, tweaked or introduced without a {@code Type:} / {@code Output:ZIP-*} tag, this test
+     * breaks, surfacing the bug before {@code AiWorkflowService} silently registers a multi-result
+     * ZIP as a single file.
+     *
+     * <p>Add a new row here whenever a new unpack-eligible endpoint is introduced. Descriptions can
+     * be trimmed to the part containing the relevant tags.
+     */
+    @ParameterizedTest(name = "{0} → shouldUnpackZipResponse")
+    @CsvSource(
+            textBlock =
+                    """
+                    /api/v1/general/split-pages,              'Split pages. Input:PDF Output:PDF Type:SIMO'
+                    /api/v1/general/split-pdf-by-sections,    'Split. Input:PDF Output:ZIP-PDF Type:SISO'
+                    /api/v1/general/split-by-size-or-count,   'Split by size. Input:PDF Output:ZIP-PDF Type:SISO'
+                    /api/v1/general/split-pdf-by-chapters,    'Split by chapters. Input:PDF Output:ZIP-PDF Type:SISO'
+                    /api/v1/general/split-for-poster-print,   'Poster split. Input: PDF Output: ZIP-PDF Type: SISO'
+                    /api/v1/general/overlay-pdfs,             'Overlay PDFs. Input:PDF Output:PDF Type:MIMO'
+                    /api/v1/misc/auto-split-pdf,              'Auto split. Input:PDF Output:ZIP-PDF Type:SISO'
+                    /api/v1/misc/extract-images,              'Extract images. Output:IMAGE/ZIP Type:SIMO'
+                    /api/v1/misc/extract-image-scans,         'Extract image scans. Input:PDF Output:IMAGE/ZIP Type:SIMO'
+                    """)
+    void shouldUnpackZipResponseClassifiesKnownUnpackableEndpoints(
+            String endpoint, String description) throws Exception {
+        String json = mapper.writeValueAsString(Map.of("description", description));
+        JsonNode postNode = mapper.readTree(json);
+        setApiDocumentation(Map.of(endpoint, new ApiEndpoint(endpoint, postNode)));
+        setApiDocsJsonRootNode();
+        assertTrue(
+                apiDocService.shouldUnpackZipResponse(endpoint),
+                () ->
+                        "Expected shouldUnpackZipResponse=true for "
+                                + endpoint
+                                + " with description: "
+                                + description);
+    }
+
+    /**
+     * Inverse coverage: endpoints whose ZIP response is the deliverable itself (or that return
+     * single non-ZIP files) must not be flagged for unpacking. Catches regressions where a change
+     * to the classifier accidentally widens the positive match.
+     */
+    @ParameterizedTest(name = "{0} → !shouldUnpackZipResponse")
+    @CsvSource(
+            textBlock =
+                    """
+                    /api/v1/general/rotate-pdf,        'Rotate. Input:PDF Output:PDF Type:SISO'
+                    /api/v1/general/merge-pdfs,        'Merge. Input:PDF Output:PDF Type:MISO'
+                    /api/v1/misc/compress-pdf,         'Compress. Input:PDF Output:PDF Type:SISO'
+                    /api/v1/misc/flatten,              'Flatten forms. Input:PDF Output:PDF Type:SISO'
+                    /api/v1/security/get-attachments,  'Extract attachments. Input:PDF Output:ZIP Type:SISO'
+                    """)
+    void shouldUnpackZipResponseRejectsNonUnpackableEndpoints(String endpoint, String description)
+            throws Exception {
+        String json = mapper.writeValueAsString(Map.of("description", description));
+        JsonNode postNode = mapper.readTree(json);
+        setApiDocumentation(Map.of(endpoint, new ApiEndpoint(endpoint, postNode)));
+        setApiDocsJsonRootNode();
+        assertFalse(
+                apiDocService.shouldUnpackZipResponse(endpoint),
+                () ->
+                        "Expected shouldUnpackZipResponse=false for "
+                                + endpoint
+                                + " with description: "
+                                + description);
+    }
+
     @Test
     void constructorAcceptsNullUserService() {
         ApiDocService service = new ApiDocService(mapper, servletContext, null);
diff --git a/app/proprietary/build.gradle b/app/proprietary/build.gradle
index e0c294e09a..1c03a435f9 100644
--- a/app/proprietary/build.gradle
+++ b/app/proprietary/build.gradle
@@ -16,6 +16,8 @@ spotless {
         target 'src/**/java/**/*.java'
         targetExclude 'src/main/java/org/apache/**'
         googleJavaFormat(googleJavaFormatVersion).aosp().reorderImports(false)
+        // google-java-format 1.28.0 bundles Guava 32.x which crashes Spotless lint on JDK 24/25
+        suppressLintsFor { setStep('google-java-format') }
 
         importOrder("java", "javax", "org", "com", "net", "io", "jakarta", "lombok", "me", "stirling")
         trimTrailingWhitespace()
@@ -37,7 +39,7 @@ spotless {
 }
 dependencies {
     implementation project(':common')
-    api 'com.google.guava:guava:33.4.8-jre'
+    api 'com.google.guava:guava:33.5.0-jre'
 
     api 'org.springframework:spring-jdbc'
     api 'org.springframework:spring-webmvc'
@@ -51,18 +53,26 @@ dependencies {
     api 'org.springframework.boot:spring-boot-starter-mail'
     api 'org.springframework.boot:spring-boot-starter-cache'
     api 'com.github.ben-manes.caffeine:caffeine'
-    api 'io.swagger.core.v3:swagger-core-jakarta:2.2.43'
-    implementation 'com.bucket4j:bucket4j_jdk17-core:8.16.1'
+    api 'io.swagger.core.v3:swagger-core-jakarta:2.2.46'
+    implementation 'com.bucket4j:bucket4j_jdk17-core:8.17.0'
 
     // https://mvnrepository.com/artifact/com.bucket4j/bucket4j_jdk17
     implementation "org.bouncycastle:bcprov-jdk18on:$bouncycastleVersion"
 
+    // Tabula table extraction — used by MathAuditorOrchestrator
+    implementation ('technology.tabula:tabula:1.0.5') {
+        exclude group: 'org.slf4j', module: 'slf4j-simple'
+        exclude group: 'org.bouncycastle', module: 'bcprov-jdk15on'
+        exclude group: 'com.google.code.gson', module: 'gson'
+    }
+    implementation 'com.google.code.gson:gson:2.13.2'
+
     api 'io.micrometer:micrometer-registry-prometheus'
 
     api "io.jsonwebtoken:jjwt-api:$jwtVersion"
     runtimeOnly "io.jsonwebtoken:jjwt-impl:$jwtVersion"
     runtimeOnly "io.jsonwebtoken:jjwt-jackson:$jwtVersion"
-    runtimeOnly 'com.h2database:h2:2.3.232' // Don't upgrade h2database
+    runtimeOnly 'com.h2database:h2:2.3.232' // Don't upgrade h2database - file format incompatible with 2.4.x, would break existing user databases
     runtimeOnly 'org.postgresql:postgresql:42.7.10'
     implementation('com.coveo:saml-client:5.0.0') {
         exclude group: 'org.opensaml', module: 'opensaml-core'
diff --git a/app/proprietary/src/main/java/stirling/software/proprietary/config/AsyncConfig.java b/app/proprietary/src/main/java/stirling/software/proprietary/config/AsyncConfig.java
index aa79f9b05e..a45714ba65 100644
--- a/app/proprietary/src/main/java/stirling/software/proprietary/config/AsyncConfig.java
+++ b/app/proprietary/src/main/java/stirling/software/proprietary/config/AsyncConfig.java
@@ -10,6 +10,7 @@ import org.springframework.context.annotation.Configuration;
 import org.springframework.core.task.TaskDecorator;
 import org.springframework.core.task.support.TaskExecutorAdapter;
 import org.springframework.scheduling.annotation.EnableAsync;
+import org.springframework.security.concurrent.DelegatingSecurityContextExecutor;
 
 @Configuration
 @EnableAsync
@@ -48,4 +49,19 @@ public class AsyncConfig {
         adapter.setTaskDecorator(new MDCContextTaskDecorator());
         return adapter;
     }
+
+    /**
+     * AI orchestration runs on a background executor, so the incoming request's {@code
+     * SecurityContext} must be propagated for downstream calls to see the authenticated user.
+     * Without this, {@code JobOwnershipService} scopes job keys without a user prefix and
+     * authenticated downloads fail with 403; {@code InternalApiClient} also falls back to the
+     * internal-API-user key instead of the caller's.
+     */
+    @Bean(name = "aiStreamExecutor")
+    public Executor aiStreamExecutor() {
+        TaskExecutorAdapter adapter =
+                new TaskExecutorAdapter(Executors.newVirtualThreadPerTaskExecutor());
+        adapter.setTaskDecorator(new MDCContextTaskDecorator());
+        return new DelegatingSecurityContextExecutor(adapter);
+    }
 }
diff --git a/app/proprietary/src/main/java/stirling/software/proprietary/controller/api/AiEngineController.java b/app/proprietary/src/main/java/stirling/software/proprietary/controller/api/AiEngineController.java
new file mode 100644
index 0000000000..279f408815
--- /dev/null
+++ b/app/proprietary/src/main/java/stirling/software/proprietary/controller/api/AiEngineController.java
@@ -0,0 +1,213 @@
+package stirling.software.proprietary.controller.api;
+
+import java.io.IOException;
+import java.util.List;
+import java.util.Map;
+import java.util.concurrent.Executor;
+
+import org.springframework.beans.factory.annotation.Qualifier;
+import org.springframework.beans.factory.annotation.Value;
+import org.springframework.http.HttpStatus;
+import org.springframework.http.MediaType;
+import org.springframework.http.ResponseEntity;
+import org.springframework.web.bind.annotation.GetMapping;
+import org.springframework.web.bind.annotation.ModelAttribute;
+import org.springframework.web.bind.annotation.PostMapping;
+import org.springframework.web.bind.annotation.RequestBody;
+import org.springframework.web.bind.annotation.RequestMapping;
+import org.springframework.web.bind.annotation.RestController;
+import org.springframework.web.server.ResponseStatusException;
+import org.springframework.web.servlet.mvc.method.annotation.SseEmitter;
+
+import io.swagger.v3.oas.annotations.Hidden;
+import io.swagger.v3.oas.annotations.Operation;
+import io.swagger.v3.oas.annotations.tags.Tag;
+
+import jakarta.validation.Valid;
+
+import lombok.extern.slf4j.Slf4j;
+
+import stirling.software.common.model.job.ResultFile;
+import stirling.software.common.service.JobOwnershipService;
+import stirling.software.common.service.TaskManager;
+import stirling.software.proprietary.model.api.ai.AiWorkflowRequest;
+import stirling.software.proprietary.model.api.ai.AiWorkflowResponse;
+import stirling.software.proprietary.model.api.ai.AiWorkflowResultFile;
+import stirling.software.proprietary.service.AiEngineClient;
+import stirling.software.proprietary.service.AiWorkflowService;
+
+import tools.jackson.core.JacksonException;
+import tools.jackson.databind.JsonNode;
+import tools.jackson.databind.ObjectMapper;
+
+@Slf4j
+@RestController
+@RequestMapping("/api/v1/ai")
+@Hidden
+@Tag(name = "AI Engine", description = "Endpoints for AI-powered PDF workflows")
+public class AiEngineController {
+
+    private final AiEngineClient aiEngineClient;
+    private final AiWorkflowService aiWorkflowService;
+    private final ObjectMapper objectMapper;
+    private final Executor aiStreamExecutor;
+    private final TaskManager taskManager;
+    private final JobOwnershipService jobOwnershipService;
+
+    /**
+     * SSE emitter timeout. Long enough to accommodate multi-gigabyte PDF workflows (OCR on a
+     * 1000-page scan, splitting a huge PDF, etc.) without the emitter completing out from under the
+     * executor. Configurable via {@code stirling.ai.streamTimeoutMs}.
+     */
+    @Value("${stirling.ai.streamTimeoutMs:1800000}")
+    private long streamTimeoutMs;
+
+    public AiEngineController(
+            AiEngineClient aiEngineClient,
+            AiWorkflowService aiWorkflowService,
+            ObjectMapper objectMapper,
+            @Qualifier("aiStreamExecutor") Executor aiStreamExecutor,
+            TaskManager taskManager,
+            JobOwnershipService jobOwnershipService) {
+        this.aiEngineClient = aiEngineClient;
+        this.aiWorkflowService = aiWorkflowService;
+        this.objectMapper = objectMapper;
+        this.aiStreamExecutor = aiStreamExecutor;
+        this.taskManager = taskManager;
+        this.jobOwnershipService = jobOwnershipService;
+    }
+
+    @GetMapping("/health")
+    @Operation(
+            summary = "AI engine health check",
+            description = "Returns the health status of the AI engine including configured models")
+    public ResponseEntity<String> health() throws IOException {
+        String response = aiEngineClient.get("/health");
+        return ResponseEntity.ok().contentType(MediaType.APPLICATION_JSON).body(response);
+    }
+
+    @PostMapping(value = "/orchestrate", consumes = MediaType.MULTIPART_FORM_DATA_VALUE)
+    @Operation(
+            summary = "Run an AI workflow against a PDF",
+            description =
+                    "Accepts PDF uploads and a user message and returns an AI workflow result."
+                            + " When the workflow produces files, they are registered with the job"
+                            + " system and downloadable via GET /api/v1/general/files/{fileId}.")
+    public AiWorkflowResponse orchestrate(@Valid @ModelAttribute AiWorkflowRequest request)
+            throws IOException {
+        AiWorkflowResponse result = aiWorkflowService.orchestrate(request);
+        registerFileResultAsJob(result);
+        return result;
+    }
+
+    @PostMapping(value = "/orchestrate/stream", consumes = MediaType.MULTIPART_FORM_DATA_VALUE)
+    @Operation(
+            summary = "Run an AI workflow with streaming progress",
+            description =
+                    "Accepts a PDF upload and a user message, returns SSE events with progress"
+                            + " updates followed by the final AI workflow result")
+    public SseEmitter orchestrateStream(@Valid @ModelAttribute AiWorkflowRequest request) {
+        SseEmitter emitter = new SseEmitter(streamTimeoutMs);
+
+        emitter.onTimeout(
+                () -> {
+                    // Emit an explicit error frame so the frontend reports a timeout rather than
+                    // silently seeing the stream end without a result.
+                    log.warn(
+                            "SSE emitter timed out for AI orchestration stream after {} ms",
+                            streamTimeoutMs);
+                    sendEvent(
+                            emitter,
+                            "error",
+                            Map.of(
+                                    "message",
+                                    "AI workflow timed out after "
+                                            + (streamTimeoutMs / 1000)
+                                            + " seconds"));
+                    emitter.complete();
+                });
+        emitter.onError(e -> log.warn("SSE emitter error for AI orchestration stream", e));
+
+        aiStreamExecutor.execute(() -> runOrchestrationStream(request, emitter));
+
+        return emitter;
+    }
+
+    private void runOrchestrationStream(AiWorkflowRequest request, SseEmitter emitter) {
+        try {
+            AiWorkflowResponse result =
+                    aiWorkflowService.orchestrate(
+                            request, progress -> sendEvent(emitter, "progress", progress));
+            registerFileResultAsJob(result);
+            sendEvent(emitter, "result", result);
+            emitter.complete();
+        } catch (Exception e) {
+            log.error("AI orchestration stream failed", e);
+            // Emit an error frame for the frontend and then complete normally. Using
+            // completeWithError here as well would double-complete the emitter - the error
+            // frame already conveys the failure to the client.
+            sendEvent(emitter, "error", Map.of("message", e.getMessage()));
+            emitter.complete();
+        }
+    }
+
+    /**
+     * Register any file results produced by the workflow with {@link TaskManager} so they are
+     * downloadable via {@code GET /api/v1/general/files/{fileId}}. Uses {@code
+     * setMultipleFileResults} so the fileIds we registered earlier are not mangled by TaskManager's
+     * ZIP auto-extract path.
+     */
+    private void registerFileResultAsJob(AiWorkflowResponse result) {
+        List<AiWorkflowResultFile> files = result.getResultFiles();
+        if (files == null || files.isEmpty()) {
+            return;
+        }
+        // Scope the job key to the current user so the download endpoint's ownership check
+        // passes when security is enabled. NoOpJobOwnershipService returns the UUID unchanged
+        // when security is off.
+        String jobKey =
+                jobOwnershipService.createScopedJobKey(java.util.UUID.randomUUID().toString());
+        taskManager.createTask(jobKey);
+        List<ResultFile> jobFiles =
+                files.stream()
+                        .map(
+                                f ->
+                                        ResultFile.builder()
+                                                .fileId(f.getFileId())
+                                                .fileName(f.getFileName())
+                                                .contentType(f.getContentType())
+                                                .build())
+                        .toList();
+        taskManager.setMultipleFileResults(jobKey, jobFiles);
+        taskManager.setComplete(jobKey);
+    }
+
+    private void sendEvent(SseEmitter emitter, String name, Object data) {
+        try {
+            emitter.send(SseEmitter.event().name(name).data(data, MediaType.APPLICATION_JSON));
+        } catch (IOException e) {
+            log.debug("Failed to send SSE event (client may have disconnected)", e);
+        }
+    }
+
+    @PostMapping(value = "/pdf/edit", consumes = MediaType.APPLICATION_JSON_VALUE)
+    @Operation(
+            summary = "Generate a PDF edit plan",
+            description =
+                    "Sends a user message to the PDF edit agent which returns a structured plan"
+                            + " of tool operations to perform")
+    public ResponseEntity<String> pdfEdit(@RequestBody String requestBody) throws IOException {
+        validateJson(requestBody);
+        String response = aiEngineClient.post("/api/v1/pdf/edit", requestBody);
+        return ResponseEntity.ok().contentType(MediaType.APPLICATION_JSON).body(response);
+    }
+
+    private void validateJson(String body) {
+        try {
+            objectMapper.readValue(body, JsonNode.class);
+        } catch (JacksonException e) {
+            throw new ResponseStatusException(
+                    HttpStatus.BAD_REQUEST, "Request body is not valid JSON");
+        }
+    }
+}
diff --git a/app/proprietary/src/main/java/stirling/software/proprietary/controller/api/AuditDashboardController.java b/app/proprietary/src/main/java/stirling/software/proprietary/controller/api/AuditDashboardController.java
index 4a2f2df00f..4dff0c99a0 100644
--- a/app/proprietary/src/main/java/stirling/software/proprietary/controller/api/AuditDashboardController.java
+++ b/app/proprietary/src/main/java/stirling/software/proprietary/controller/api/AuditDashboardController.java
@@ -1,5 +1,6 @@
 package stirling.software.proprietary.controller.api;
 
+import java.nio.charset.StandardCharsets;
 import java.time.Instant;
 import java.time.LocalDate;
 import java.time.LocalDateTime;
@@ -239,7 +240,7 @@ public class AuditDashboardController {
             csv.append(escapeCSV(event.getData())).append("\n");
         }
 
-        byte[] csvBytes = csv.toString().getBytes();
+        byte[] csvBytes = csv.toString().getBytes(StandardCharsets.UTF_8);
 
         // Set up HTTP headers for download
         HttpHeaders headers = new HttpHeaders();
diff --git a/app/proprietary/src/main/java/stirling/software/proprietary/controller/api/MathAuditorAgentController.java b/app/proprietary/src/main/java/stirling/software/proprietary/controller/api/MathAuditorAgentController.java
new file mode 100644
index 0000000000..3691266b79
--- /dev/null
+++ b/app/proprietary/src/main/java/stirling/software/proprietary/controller/api/MathAuditorAgentController.java
@@ -0,0 +1,97 @@
+package stirling.software.proprietary.controller.api;
+
+import java.io.IOException;
+import java.math.BigDecimal;
+
+import org.springframework.http.HttpStatus;
+import org.springframework.http.MediaType;
+import org.springframework.http.ResponseEntity;
+import org.springframework.web.bind.annotation.PostMapping;
+import org.springframework.web.bind.annotation.RequestMapping;
+import org.springframework.web.bind.annotation.RequestParam;
+import org.springframework.web.bind.annotation.RestController;
+import org.springframework.web.multipart.MultipartFile;
+
+import io.swagger.v3.oas.annotations.Operation;
+import io.swagger.v3.oas.annotations.Parameter;
+import io.swagger.v3.oas.annotations.tags.Tag;
+
+import lombok.RequiredArgsConstructor;
+import lombok.extern.slf4j.Slf4j;
+
+import stirling.software.proprietary.model.api.ai.Verdict;
+import stirling.software.proprietary.service.MathAuditorOrchestrator;
+
+/**
+ * Public entry point for the Math Auditor Agent (mathAuditorAgent).
+ *
+ * <p>Accepts a PDF from the client, hands it to the {@link MathAuditorOrchestrator} which runs the
+ * multi-round Java-Python negotiation, and returns the Auditor's {@link Verdict}.
+ *
+ * <p>The raw PDF never leaves Java. Python receives only structured text and CSV data.
+ */
+@Slf4j
+@RestController
+@RequestMapping("/api/v1/ai")
+@RequiredArgsConstructor
+@Tag(name = "AI Engine", description = "AI-powered document analysis endpoints.")
+public class MathAuditorAgentController {
+
+    private final MathAuditorOrchestrator orchestrator;
+
+    @PostMapping(value = "/math-auditor-agent", consumes = MediaType.MULTIPART_FORM_DATA_VALUE)
+    @Operation(
+            summary = "Validate mathematical calculations in a PDF",
+            description =
+                    """
+                    Analyses a PDF document for mathematical errors using the Math Auditor Agent.
+
+                    The auditor checks:
+                    - Table row and column totals (tally errors)
+                    - Inline arithmetic expressions (e.g. "100 + 200 = 300")
+                    - Cross-page figure consistency (same figure cited differently on different pages)
+                    - Prose claims about percentages, growth rates, and comparisons
+
+                    The PDF is processed entirely on the Java side; only extracted text and table data
+                    are sent to the AI engine.
+
+                    Input: PDF  Output: JSON  Type: SISO
+                    """)
+    public ResponseEntity<Verdict> mathAuditorAgent(
+            @Parameter(description = "The PDF document to audit", required = true)
+                    @RequestParam("fileInput")
+                    MultipartFile fileInput,
+            @Parameter(
+                            description =
+                                    "Arithmetic tolerance — differences smaller than this are"
+                                            + " ignored (default: 0.01)")
+                    @RequestParam(value = "tolerance", defaultValue = "0.01")
+                    BigDecimal tolerance) {
+
+        String contentType = fileInput.getContentType();
+        if (contentType == null || !contentType.equals("application/pdf")) {
+            return ResponseEntity.badRequest().build();
+        }
+
+        if (tolerance.compareTo(BigDecimal.ZERO) < 0) {
+            return ResponseEntity.badRequest().build();
+        }
+
+        String safeName =
+                fileInput.getOriginalFilename() != null
+                        ? fileInput.getOriginalFilename().replaceAll("[\\r\\n]", "_")
+                        : "<unnamed>";
+        log.info("[math-auditor-agent] request file={} tolerance={}", safeName, tolerance);
+
+        try {
+            Verdict verdict = orchestrator.audit(fileInput, tolerance);
+            return ResponseEntity.ok(verdict);
+        } catch (IOException e) {
+            log.error("[math-auditor-agent] IO error during audit", e);
+            return ResponseEntity.status(HttpStatus.INTERNAL_SERVER_ERROR).build();
+        } catch (Exception e) {
+            log.error("[math-auditor-agent] unexpected error during audit", e);
+            return ResponseEntity.status(HttpStatus.INTERNAL_SERVER_ERROR).build();
+        }
+    }
+}
diff --git a/app/proprietary/src/main/java/stirling/software/proprietary/controller/api/SignatureController.java b/app/proprietary/src/main/java/stirling/software/proprietary/controller/api/SignatureController.java
index 37d8f3999b..3295e62abb 100644
--- a/app/proprietary/src/main/java/stirling/software/proprietary/controller/api/SignatureController.java
+++ b/app/proprietary/src/main/java/stirling/software/proprietary/controller/api/SignatureController.java
@@ -19,6 +19,8 @@ import org.springframework.web.bind.annotation.RequestBody;
 import org.springframework.web.bind.annotation.RequestMapping;
 import org.springframework.web.bind.annotation.RestController;
 
+import io.swagger.v3.oas.annotations.tags.Tag;
+
 import lombok.RequiredArgsConstructor;
 import lombok.extern.slf4j.Slf4j;
 
@@ -37,6 +39,9 @@ import stirling.software.proprietary.service.SignatureService;
 @RestController
 @RequestMapping("/api/v1/proprietary/signatures")
 @RequiredArgsConstructor
+@Tag(
+        name = "Saved Signatures",
+        description = "Manage saved signature templates for authenticated users")
 public class SignatureController {
 
     private final SignatureService signatureService;
diff --git a/app/proprietary/src/main/java/stirling/software/proprietary/model/api/ai/AiConversationMessage.java b/app/proprietary/src/main/java/stirling/software/proprietary/model/api/ai/AiConversationMessage.java
new file mode 100644
index 0000000000..32a811302c
--- /dev/null
+++ b/app/proprietary/src/main/java/stirling/software/proprietary/model/api/ai/AiConversationMessage.java
@@ -0,0 +1,22 @@
+package stirling.software.proprietary.model.api.ai;
+
+import io.swagger.v3.oas.annotations.media.Schema;
+
+import jakarta.validation.constraints.NotBlank;
+import jakarta.validation.constraints.NotNull;
+
+import lombok.Data;
+
+@Data
+@Schema(description = "A prior message in the chat conversation")
+public class AiConversationMessage {
+
+    @NotNull
+    @NotBlank
+    @Schema(description = "The role of the message sender", example = "user")
+    private String role;
+
+    @NotNull
+    @Schema(description = "The content of the message")
+    private String content;
+}
diff --git a/app/proprietary/src/main/java/stirling/software/proprietary/model/api/ai/AiPdfContentType.java b/app/proprietary/src/main/java/stirling/software/proprietary/model/api/ai/AiPdfContentType.java
new file mode 100644
index 0000000000..d7c38a723c
--- /dev/null
+++ b/app/proprietary/src/main/java/stirling/software/proprietary/model/api/ai/AiPdfContentType.java
@@ -0,0 +1,57 @@
+package stirling.software.proprietary.model.api.ai;
+
+import com.fasterxml.jackson.annotation.JsonCreator;
+import com.fasterxml.jackson.annotation.JsonValue;
+
+/**
+ * Types of content that can be extracted from a PDF and sent to the AI.
+ *
+ * <p>Values MUST match {@code PdfContentType} in {@code engine/src/stirling/contracts/common.py}.
+ */
+public enum AiPdfContentType {
+    // Document-level structured data
+    PAGE_LAYOUT("page_layout"),
+    DOCUMENT_METADATA("document_metadata"),
+    ENCRYPTION_INFO("encryption_info"),
+    BOOKMARKS("bookmarks"),
+    LAYERS("layers"),
+    EMBEDDED_FILES("embedded_files"),
+    JAVASCRIPT("javascript"),
+    LINKS("links"),
+    IMAGE_INFO("image_info"),
+    FONTS("fonts"),
+
+    // Text and content
+    PAGE_TEXT("page_text"),
+    FULL_TEXT("full_text"),
+    FORM_FIELDS("form_fields"),
+    ANNOTATIONS("annotations"),
+    SIGNATURES("signatures"),
+    STRUCTURE_TREE("structure_tree"),
+    XMP_METADATA("xmp_metadata"),
+
+    // Heavy content
+    COMPLIANCE("compliance"),
+    IMAGES("images");
+
+    private final String value;
+
+    AiPdfContentType(String value) {
+        this.value = value;
+    }
+
+    @JsonValue
+    public String getValue() {
+        return value;
+    }
+
+    @JsonCreator
+    public static AiPdfContentType fromValue(String value) {
+        for (AiPdfContentType type : values()) {
+            if (type.value.equals(value)) {
+                return type;
+            }
+        }
+        throw new IllegalArgumentException("Unknown PDF content type: " + value);
+    }
+}
diff --git a/app/proprietary/src/main/java/stirling/software/proprietary/model/api/ai/AiWorkflowFileInput.java b/app/proprietary/src/main/java/stirling/software/proprietary/model/api/ai/AiWorkflowFileInput.java
new file mode 100644
index 0000000000..c83fa55698
--- /dev/null
+++ b/app/proprietary/src/main/java/stirling/software/proprietary/model/api/ai/AiWorkflowFileInput.java
@@ -0,0 +1,22 @@
+package stirling.software.proprietary.model.api.ai;
+
+import org.springframework.http.MediaType;
+import org.springframework.web.multipart.MultipartFile;
+
+import io.swagger.v3.oas.annotations.media.Schema;
+
+import jakarta.validation.constraints.NotNull;
+
+import lombok.Data;
+
+@Data
+@Schema(description = "A single PDF file input")
+public class AiWorkflowFileInput {
+
+    @NotNull
+    @Schema(
+            description = "The input PDF file",
+            contentMediaType = MediaType.APPLICATION_PDF_VALUE,
+            format = "binary")
+    private MultipartFile fileInput;
+}
diff --git a/app/proprietary/src/main/java/stirling/software/proprietary/model/api/ai/AiWorkflowFileRequest.java b/app/proprietary/src/main/java/stirling/software/proprietary/model/api/ai/AiWorkflowFileRequest.java
new file mode 100644
index 0000000000..f238670287
--- /dev/null
+++ b/app/proprietary/src/main/java/stirling/software/proprietary/model/api/ai/AiWorkflowFileRequest.java
@@ -0,0 +1,22 @@
+package stirling.software.proprietary.model.api.ai;
+
+import java.util.ArrayList;
+import java.util.List;
+
+import io.swagger.v3.oas.annotations.media.Schema;
+
+import lombok.Data;
+
+@Data
+@Schema(description = "Per-file content extraction request from the AI engine")
+public class AiWorkflowFileRequest {
+
+    @Schema(description = "Original filename of the requested file", example = "contract.pdf")
+    private String fileName;
+
+    @Schema(description = "Specific 1-based page numbers to extract from this file")
+    private List<Integer> pageNumbers = new ArrayList<>();
+
+    @Schema(description = "Content types to extract from this file")
+    private List<AiPdfContentType> contentTypes = new ArrayList<>();
+}
diff --git a/app/proprietary/src/main/java/stirling/software/proprietary/model/api/ai/AiWorkflowOutcome.java b/app/proprietary/src/main/java/stirling/software/proprietary/model/api/ai/AiWorkflowOutcome.java
new file mode 100644
index 0000000000..577f24e5fd
--- /dev/null
+++ b/app/proprietary/src/main/java/stirling/software/proprietary/model/api/ai/AiWorkflowOutcome.java
@@ -0,0 +1,44 @@
+package stirling.software.proprietary.model.api.ai;
+
+import com.fasterxml.jackson.annotation.JsonCreator;
+import com.fasterxml.jackson.annotation.JsonValue;
+
+/**
+ * Discriminator values for AI workflow responses.
+ *
+ * <p>Values MUST match {@code WorkflowOutcome} in {@code engine/src/stirling/contracts/common.py}.
+ */
+public enum AiWorkflowOutcome {
+    ANSWER("answer"),
+    NOT_FOUND("not_found"),
+    NEED_CONTENT("need_content"),
+    PLAN("plan"),
+    NEED_CLARIFICATION("need_clarification"),
+    CANNOT_DO("cannot_do"),
+    DRAFT("draft"),
+    TOOL_CALL("tool_call"),
+    COMPLETED("completed"),
+    UNSUPPORTED_CAPABILITY("unsupported_capability"),
+    CANNOT_CONTINUE("cannot_continue");
+
+    private final String value;
+
+    AiWorkflowOutcome(String value) {
+        this.value = value;
+    }
+
+    @JsonValue
+    public String getValue() {
+        return value;
+    }
+
+    @JsonCreator
+    public static AiWorkflowOutcome fromValue(String value) {
+        for (AiWorkflowOutcome outcome : values()) {
+            if (outcome.value.equals(value)) {
+                return outcome;
+            }
+        }
+        throw new IllegalArgumentException("Unknown AI workflow outcome: " + value);
+    }
+}
diff --git a/app/proprietary/src/main/java/stirling/software/proprietary/model/api/ai/AiWorkflowPhase.java b/app/proprietary/src/main/java/stirling/software/proprietary/model/api/ai/AiWorkflowPhase.java
new file mode 100644
index 0000000000..b1ab9fff23
--- /dev/null
+++ b/app/proprietary/src/main/java/stirling/software/proprietary/model/api/ai/AiWorkflowPhase.java
@@ -0,0 +1,34 @@
+package stirling.software.proprietary.model.api.ai;
+
+import com.fasterxml.jackson.annotation.JsonCreator;
+import com.fasterxml.jackson.annotation.JsonValue;
+
+/** Progress phases emitted during AI workflow orchestration. */
+public enum AiWorkflowPhase {
+    ANALYZING("analyzing"),
+    CALLING_ENGINE("calling_engine"),
+    EXTRACTING_CONTENT("extracting_content"),
+    EXECUTING_TOOL("executing_tool"),
+    PROCESSING("processing");
+
+    private final String value;
+
+    AiWorkflowPhase(String value) {
+        this.value = value;
+    }
+
+    @JsonValue
+    public String getValue() {
+        return value;
+    }
+
+    @JsonCreator
+    public static AiWorkflowPhase fromValue(String value) {
+        for (AiWorkflowPhase phase : values()) {
+            if (phase.value.equals(value)) {
+                return phase;
+            }
+        }
+        throw new IllegalArgumentException("Unknown AI workflow phase: " + value);
+    }
+}
diff --git a/app/proprietary/src/main/java/stirling/software/proprietary/model/api/ai/AiWorkflowProgressEvent.java b/app/proprietary/src/main/java/stirling/software/proprietary/model/api/ai/AiWorkflowProgressEvent.java
new file mode 100644
index 0000000000..92c15a0004
--- /dev/null
+++ b/app/proprietary/src/main/java/stirling/software/proprietary/model/api/ai/AiWorkflowProgressEvent.java
@@ -0,0 +1,38 @@
+package stirling.software.proprietary.model.api.ai;
+
+import com.fasterxml.jackson.annotation.JsonInclude;
+
+import lombok.AllArgsConstructor;
+import lombok.Data;
+
+@Data
+@AllArgsConstructor
+@JsonInclude(JsonInclude.Include.NON_NULL)
+public class AiWorkflowProgressEvent {
+    private AiWorkflowPhase phase;
+    private long timestamp;
+
+    /** The tool endpoint path being executed, for {@link AiWorkflowPhase#EXECUTING_TOOL} events. */
+    private String tool;
+
+    /**
+     * 1-based index of the current plan step, for {@link AiWorkflowPhase#EXECUTING_TOOL} events.
+     */
+    private Integer stepIndex;
+
+    /** Total number of plan steps, for {@link AiWorkflowPhase#EXECUTING_TOOL} events. */
+    private Integer stepCount;
+
+    public static AiWorkflowProgressEvent of(AiWorkflowPhase phase) {
+        return new AiWorkflowProgressEvent(phase, System.currentTimeMillis(), null, null, null);
+    }
+
+    public static AiWorkflowProgressEvent executingTool(String tool, int stepIndex, int stepCount) {
+        return new AiWorkflowProgressEvent(
+                AiWorkflowPhase.EXECUTING_TOOL,
+                System.currentTimeMillis(),
+                tool,
+                stepIndex,
+                stepCount);
+    }
+}
diff --git a/app/proprietary/src/main/java/stirling/software/proprietary/model/api/ai/AiWorkflowRequest.java b/app/proprietary/src/main/java/stirling/software/proprietary/model/api/ai/AiWorkflowRequest.java
new file mode 100644
index 0000000000..da327177c4
--- /dev/null
+++ b/app/proprietary/src/main/java/stirling/software/proprietary/model/api/ai/AiWorkflowRequest.java
@@ -0,0 +1,30 @@
+package stirling.software.proprietary.model.api.ai;
+
+import java.util.ArrayList;
+import java.util.List;
+
+import io.swagger.v3.oas.annotations.media.Schema;
+
+import jakarta.validation.constraints.NotBlank;
+import jakarta.validation.constraints.NotNull;
+
+import lombok.Data;
+
+@Data
+@Schema(description = "Run an AI workflow against one or more PDF files")
+public class AiWorkflowRequest {
+
+    @NotNull
+    @Schema(description = "The input PDF files")
+    private List<AiWorkflowFileInput> fileInputs;
+
+    @NotBlank
+    @Schema(description = "The user message to orchestrate", example = "Summarise these documents")
+    private String userMessage;
+
+    @Schema(
+            description =
+                    "Prior chat messages exchanged between the user and the assistant, ordered"
+                            + " oldest-first. Excludes the current userMessage.")
+    private List<AiConversationMessage> conversationHistory = new ArrayList<>();
+}
diff --git a/app/proprietary/src/main/java/stirling/software/proprietary/model/api/ai/AiWorkflowResponse.java b/app/proprietary/src/main/java/stirling/software/proprietary/model/api/ai/AiWorkflowResponse.java
new file mode 100644
index 0000000000..ff28b2e9eb
--- /dev/null
+++ b/app/proprietary/src/main/java/stirling/software/proprietary/model/api/ai/AiWorkflowResponse.java
@@ -0,0 +1,82 @@
+package stirling.software.proprietary.model.api.ai;
+
+import java.util.ArrayList;
+import java.util.List;
+import java.util.Map;
+
+import io.swagger.v3.oas.annotations.media.Schema;
+
+import lombok.Data;
+
+@Data
+@Schema(description = "Structured AI workflow result")
+public class AiWorkflowResponse {
+
+    @Schema(description = "Workflow outcome")
+    private AiWorkflowOutcome outcome;
+
+    @Schema(description = "Answer returned by the AI workflow when applicable")
+    private String answer;
+
+    @Schema(description = "Summary returned by the AI workflow when applicable")
+    private String summary;
+
+    @Schema(description = "Rationale returned by the AI workflow when applicable")
+    private String rationale;
+
+    @Schema(description = "Reason when the AI workflow cannot proceed")
+    private String reason;
+
+    @Schema(description = "Clarification question for the user when more input is required")
+    private String question;
+
+    @Schema(
+            description =
+                    "Unsupported capability identifier when the workflow cannot route the request")
+    private String capability;
+
+    @Schema(description = "Message returned for unsupported capability outcomes")
+    private String message;
+
+    @Schema(description = "Supporting evidence snippets from extracted PDF text")
+    private List<AiWorkflowTextSelection> evidence = new ArrayList<>();
+
+    @Schema(description = "Structured tool steps when the workflow returns a plan")
+    private List<Map<String, Object>> steps = new ArrayList<>();
+
+    @Schema(
+            description =
+                    "Tool endpoint path for tool_call outcomes (e.g. /api/v1/misc/compress-pdf)")
+    private String tool;
+
+    @Schema(description = "Tool parameters for tool_call outcomes")
+    private Map<String, Object> parameters;
+
+    @Schema(description = "Result file ID after tool execution completes (single-file result)")
+    private String fileId;
+
+    @Schema(description = "Result filename after tool execution completes (single-file result)")
+    private String fileName;
+
+    @Schema(description = "Result MIME type after tool execution completes (single-file result)")
+    private String contentType;
+
+    @Schema(
+            description =
+                    "Result files produced by the workflow. Always populated on completed outcomes"
+                            + " with at least one entry; for single-file results this mirrors"
+                            + " fileId/fileName/contentType.")
+    private List<AiWorkflowResultFile> resultFiles = new ArrayList<>();
+
+    @Schema(description = "Per-file text extraction requests from the AI engine")
+    private List<AiWorkflowFileRequest> files = new ArrayList<>();
+
+    @Schema(description = "Maximum number of pages the AI engine wants text extracted from")
+    private Integer maxPages;
+
+    @Schema(description = "Maximum number of characters the AI engine wants extracted")
+    private Integer maxCharacters;
+
+    @Schema(description = "AI engine capability to resume with on the next turn")
+    private String resumeWith;
+}
diff --git a/app/proprietary/src/main/java/stirling/software/proprietary/model/api/ai/AiWorkflowResultFile.java b/app/proprietary/src/main/java/stirling/software/proprietary/model/api/ai/AiWorkflowResultFile.java
new file mode 100644
index 0000000000..57207d2bc9
--- /dev/null
+++ b/app/proprietary/src/main/java/stirling/software/proprietary/model/api/ai/AiWorkflowResultFile.java
@@ -0,0 +1,24 @@
+package stirling.software.proprietary.model.api.ai;
+
+import io.swagger.v3.oas.annotations.media.Schema;
+
+import lombok.AllArgsConstructor;
+import lombok.Data;
+import lombok.NoArgsConstructor;
+
+/** A single file produced by a completed AI workflow. */
+@Data
+@NoArgsConstructor
+@AllArgsConstructor
+@Schema(description = "Descriptor for a file produced by an AI workflow")
+public class AiWorkflowResultFile {
+
+    @Schema(description = "Stirling file ID — download with GET /api/v1/general/files/{fileId}")
+    private String fileId;
+
+    @Schema(description = "Original filename for the file")
+    private String fileName;
+
+    @Schema(description = "MIME type of the file", example = "application/pdf")
+    private String contentType;
+}
diff --git a/app/proprietary/src/main/java/stirling/software/proprietary/model/api/ai/AiWorkflowTextSelection.java b/app/proprietary/src/main/java/stirling/software/proprietary/model/api/ai/AiWorkflowTextSelection.java
new file mode 100644
index 0000000000..265d989dab
--- /dev/null
+++ b/app/proprietary/src/main/java/stirling/software/proprietary/model/api/ai/AiWorkflowTextSelection.java
@@ -0,0 +1,16 @@
+package stirling.software.proprietary.model.api.ai;
+
+import io.swagger.v3.oas.annotations.media.Schema;
+
+import lombok.Data;
+
+@Data
+@Schema(description = "Page-scoped extracted text selection")
+public class AiWorkflowTextSelection {
+
+    @Schema(description = "1-based page number", example = "2")
+    private Integer pageNumber;
+
+    @Schema(description = "Extracted text or evidence snippet")
+    private String text;
+}
diff --git a/app/proprietary/src/main/java/stirling/software/proprietary/model/api/ai/AuditDiscrepancy.java b/app/proprietary/src/main/java/stirling/software/proprietary/model/api/ai/AuditDiscrepancy.java
new file mode 100644
index 0000000000..ba7cd596d7
--- /dev/null
+++ b/app/proprietary/src/main/java/stirling/software/proprietary/model/api/ai/AuditDiscrepancy.java
@@ -0,0 +1,21 @@
+package stirling.software.proprietary.model.api.ai;
+
+/**
+ * A single mathematical error found by the Python Auditor.
+ *
+ * @param page 0-indexed page number where the discrepancy appears.
+ * @param kind Category of the discrepancy.
+ * @param severity Whether this is a definite mistake or a possible ambiguity.
+ * @param description Human-readable explanation of the error.
+ * @param stated The value as it appears in the document.
+ * @param expected The value the Auditor calculated.
+ * @param context Surrounding text or table fragment for traceability.
+ */
+public record AuditDiscrepancy(
+        int page,
+        DiscrepancyKind kind,
+        AuditSeverity severity,
+        String description,
+        String stated,
+        String expected,
+        String context) {}
diff --git a/app/proprietary/src/main/java/stirling/software/proprietary/model/api/ai/AuditSeverity.java b/app/proprietary/src/main/java/stirling/software/proprietary/model/api/ai/AuditSeverity.java
new file mode 100644
index 0000000000..1bef46a443
--- /dev/null
+++ b/app/proprietary/src/main/java/stirling/software/proprietary/model/api/ai/AuditSeverity.java
@@ -0,0 +1,17 @@
+package stirling.software.proprietary.model.api.ai;
+
+import com.fasterxml.jackson.annotation.JsonValue;
+
+/**
+ * Severity of a mathematical discrepancy. Mirrors the Python {@code Severity} enum in {@code
+ * contracts/ledger.py}.
+ */
+public enum AuditSeverity {
+    ERROR,
+    WARNING;
+
+    @JsonValue
+    public String toJson() {
+        return name().toLowerCase();
+    }
+}
diff --git a/app/proprietary/src/main/java/stirling/software/proprietary/model/api/ai/DiscrepancyKind.java b/app/proprietary/src/main/java/stirling/software/proprietary/model/api/ai/DiscrepancyKind.java
new file mode 100644
index 0000000000..54c7ac66f5
--- /dev/null
+++ b/app/proprietary/src/main/java/stirling/software/proprietary/model/api/ai/DiscrepancyKind.java
@@ -0,0 +1,19 @@
+package stirling.software.proprietary.model.api.ai;
+
+import com.fasterxml.jackson.annotation.JsonValue;
+
+/**
+ * Category of a mathematical discrepancy found by the auditor. Mirrors the Python {@code
+ * DiscrepancyKind} enum in {@code contracts/ledger.py}.
+ */
+public enum DiscrepancyKind {
+    TALLY,
+    ARITHMETIC,
+    CONSISTENCY,
+    STATEMENT;
+
+    @JsonValue
+    public String toJson() {
+        return name().toLowerCase();
+    }
+}
diff --git a/app/proprietary/src/main/java/stirling/software/proprietary/model/api/ai/Evidence.java b/app/proprietary/src/main/java/stirling/software/proprietary/model/api/ai/Evidence.java
new file mode 100644
index 0000000000..98b3a09454
--- /dev/null
+++ b/app/proprietary/src/main/java/stirling/software/proprietary/model/api/ai/Evidence.java
@@ -0,0 +1,24 @@
+package stirling.software.proprietary.model.api.ai;
+
+import java.util.List;
+
+/**
+ * Java's fulfilment package: the extracted content the Python Auditor asked for.
+ *
+ * <p>Sent after Java has fulfilled a {@link Requisition}. When {@code finalRound} is {@code true},
+ * the Auditor must return a {@link Verdict} — Java will not honour further Requisitions.
+ *
+ * @param sessionId Matches the session opened by the original client request.
+ * @param folios The extracted page content for each page in the Requisition.
+ * @param round Which negotiation round this Evidence belongs to (1–3).
+ * @param finalRound When {@code true}, the Auditor must commit to a Verdict this round.
+ * @param unauditablePages Pages that were requested but could not be fulfilled — e.g. OCR was asked
+ *     for but is not yet wired. The Auditor echoes these into {@link Verdict#unauditablePages()} so
+ *     the client knows coverage is incomplete.
+ */
+public record Evidence(
+        String sessionId,
+        List<Folio> folios,
+        int round,
+        boolean finalRound,
+        List<Integer> unauditablePages) {}
diff --git a/app/proprietary/src/main/java/stirling/software/proprietary/model/api/ai/Folio.java b/app/proprietary/src/main/java/stirling/software/proprietary/model/api/ai/Folio.java
new file mode 100644
index 0000000000..7126e59354
--- /dev/null
+++ b/app/proprietary/src/main/java/stirling/software/proprietary/model/api/ai/Folio.java
@@ -0,0 +1,17 @@
+package stirling.software.proprietary.model.api.ai;
+
+import java.util.List;
+
+/**
+ * One page's worth of extracted content, assembled by Java in response to a {@link Requisition}.
+ *
+ * <p>Only the fields explicitly requested will be populated; unused fields are {@code null}.
+ *
+ * @param page 0-indexed page number.
+ * @param text PDFBox plain-text extraction result (null if not requested).
+ * @param tables Tabula CSV strings, one per table found on the page (null if not requested).
+ * @param ocrText OCRmyPDF output text (null if not requested or OCR not available).
+ * @param ocrConfidence Mean character confidence from OCRmyPDF, 0.0–1.0 (null if OCR not run).
+ */
+public record Folio(
+        int page, String text, List<String> tables, String ocrText, Double ocrConfidence) {}
diff --git a/app/proprietary/src/main/java/stirling/software/proprietary/model/api/ai/FolioManifest.java b/app/proprietary/src/main/java/stirling/software/proprietary/model/api/ai/FolioManifest.java
new file mode 100644
index 0000000000..49ba60facb
--- /dev/null
+++ b/app/proprietary/src/main/java/stirling/software/proprietary/model/api/ai/FolioManifest.java
@@ -0,0 +1,18 @@
+package stirling.software.proprietary.model.api.ai;
+
+import java.util.List;
+
+/**
+ * Java's opening move in the audit negotiation.
+ *
+ * <p>Built from a cheap PDFBox scan (character count + image detection) with no OCR or Tabula
+ * involved. Sent to the Python Examiner, which replies with a {@link Requisition}.
+ *
+ * @param sessionId Opaque handle Java uses to locate the PDF on disk during this audit session.
+ * @param pageCount Total number of pages in the document.
+ * @param folioTypes One {@link FolioType} per page (0-indexed). {@code folioTypes.size() ==
+ *     pageCount}.
+ * @param round Which negotiation round this manifest belongs to (1–3).
+ */
+public record FolioManifest(
+        String sessionId, int pageCount, List<FolioType> folioTypes, int round) {}
diff --git a/app/proprietary/src/main/java/stirling/software/proprietary/model/api/ai/FolioType.java b/app/proprietary/src/main/java/stirling/software/proprietary/model/api/ai/FolioType.java
new file mode 100644
index 0000000000..a10625deb4
--- /dev/null
+++ b/app/proprietary/src/main/java/stirling/software/proprietary/model/api/ai/FolioType.java
@@ -0,0 +1,21 @@
+package stirling.software.proprietary.model.api.ai;
+
+import com.fasterxml.jackson.annotation.JsonValue;
+
+/**
+ * Java's classification of a single PDF page after a cheap PDFBox character-count scan. Mirrors the
+ * Python {@code FolioType} enum in {@code ledger/models.py}.
+ */
+public enum FolioType {
+    /** Selectable text layer is present — PDFBox can extract text directly. */
+    TEXT,
+    /** Image-only page — OCRmyPDF is required before any text is available. */
+    IMAGE,
+    /** Partial text layer plus embedded images — both PDFBox and OCRmyPDF may be useful. */
+    MIXED;
+
+    @JsonValue
+    public String toJson() {
+        return name().toLowerCase();
+    }
+}
diff --git a/app/proprietary/src/main/java/stirling/software/proprietary/model/api/ai/Requisition.java b/app/proprietary/src/main/java/stirling/software/proprietary/model/api/ai/Requisition.java
new file mode 100644
index 0000000000..05de6df97e
--- /dev/null
+++ b/app/proprietary/src/main/java/stirling/software/proprietary/model/api/ai/Requisition.java
@@ -0,0 +1,30 @@
+package stirling.software.proprietary.model.api.ai;
+
+import java.util.List;
+
+/**
+ * The Python Examiner's shopping list: which pages Java must extract before the Auditor can form an
+ * opinion.
+ *
+ * <p>Java parses this from the Examiner's response, fulfils it (text / tables / OCR), and sends the
+ * results back as an {@link Evidence} payload.
+ *
+ * @param type Discriminator — always {@code "requisition"}.
+ * @param needText 0-indexed page numbers requiring PDFBox plain-text extraction.
+ * @param needTables 0-indexed page numbers requiring Tabula CSV extraction.
+ * @param needOcr 0-indexed page numbers requiring OCRmyPDF.
+ * @param rationale Human-readable reason logged for observability.
+ */
+public record Requisition(
+        String type,
+        List<Integer> needText,
+        List<Integer> needTables,
+        List<Integer> needOcr,
+        String rationale) {
+
+    public boolean isEmpty() {
+        return (needText == null || needText.isEmpty())
+                && (needTables == null || needTables.isEmpty())
+                && (needOcr == null || needOcr.isEmpty());
+    }
+}
diff --git a/app/proprietary/src/main/java/stirling/software/proprietary/model/api/ai/Verdict.java b/app/proprietary/src/main/java/stirling/software/proprietary/model/api/ai/Verdict.java
new file mode 100644
index 0000000000..4d859f76c2
--- /dev/null
+++ b/app/proprietary/src/main/java/stirling/software/proprietary/model/api/ai/Verdict.java
@@ -0,0 +1,43 @@
+package stirling.software.proprietary.model.api.ai;
+
+import java.util.List;
+
+/**
+ * The Auditor's final opinion on the document's mathematical integrity.
+ *
+ * <p>This is the terminal message in the audit negotiation; Java returns it to the client once
+ * received from Python.
+ *
+ * @param type Discriminator — always {@code "verdict"}.
+ * @param sessionId Matches the session opened by the original client request.
+ * @param discrepancies Every mathematical error found, sorted by page.
+ * @param pagesExamined 0-indexed page numbers the Auditor actually inspected.
+ * @param roundsTaken How many negotiation rounds were needed (1–3).
+ * @param summary One or two sentences suitable for the end user.
+ * @param clean {@code true} iff no errors were found (warnings are tolerated).
+ * @param unauditablePages Pages that could not be audited — typically image-only pages for which
+ *     OCR was requested but is not yet wired. The client should indicate that these pages were not
+ *     checked.
+ */
+public record Verdict(
+        String type,
+        String sessionId,
+        List<AuditDiscrepancy> discrepancies,
+        List<Integer> pagesExamined,
+        int roundsTaken,
+        String summary,
+        boolean clean,
+        List<Integer> unauditablePages) {
+
+    public long errorCount() {
+        return discrepancies == null
+                ? 0
+                : discrepancies.stream().filter(d -> d.severity() == AuditSeverity.ERROR).count();
+    }
+
+    public long warningCount() {
+        return discrepancies == null
+                ? 0
+                : discrepancies.stream().filter(d -> d.severity() == AuditSeverity.WARNING).count();
+    }
+}
diff --git a/app/proprietary/src/main/java/stirling/software/proprietary/pdf/FlexibleCSVWriter.java b/app/proprietary/src/main/java/stirling/software/proprietary/pdf/FlexibleCSVWriter.java
new file mode 100644
index 0000000000..a22357a7ec
--- /dev/null
+++ b/app/proprietary/src/main/java/stirling/software/proprietary/pdf/FlexibleCSVWriter.java
@@ -0,0 +1,17 @@
+package stirling.software.proprietary.pdf;
+
+import org.apache.commons.csv.CSVFormat;
+
+import technology.tabula.writers.CSVWriter;
+
+/** Exposes Tabula's protected {@link CSVWriter#CSVWriter(CSVFormat)} constructor. */
+public class FlexibleCSVWriter extends CSVWriter {
+
+    public FlexibleCSVWriter() {
+        super();
+    }
+
+    public FlexibleCSVWriter(CSVFormat csvFormat) {
+        super(csvFormat);
+    }
+}
diff --git a/app/proprietary/src/main/java/stirling/software/proprietary/security/configuration/SecurityConfiguration.java b/app/proprietary/src/main/java/stirling/software/proprietary/security/configuration/SecurityConfiguration.java
index 956f91b7a2..456c5a7c34 100644
--- a/app/proprietary/src/main/java/stirling/software/proprietary/security/configuration/SecurityConfiguration.java
+++ b/app/proprietary/src/main/java/stirling/software/proprietary/security/configuration/SecurityConfiguration.java
@@ -159,10 +159,12 @@ public class SecurityConfiguration {
         firewall.setAllowedHeaderValues(
                 headerValue -> headerValue != null && allowedChars.matcher(headerValue).matches());
 
-        // Apply the same rules to parameter values for consistency.
+        // Allow non-ASCII characters and newlines in parameter values.
+        Pattern allowedParamChars = Pattern.compile("[\\p{IsAssigned}&&[^\\p{IsControl}]\\r\\n]*");
         firewall.setAllowedParameterValues(
                 parameterValue ->
-                        parameterValue != null && allowedChars.matcher(parameterValue).matches());
+                        parameterValue != null
+                                && allowedParamChars.matcher(parameterValue).matches());
         return firewall;
     }
 
@@ -291,7 +293,12 @@ public class SecurityConfiguration {
 
             http.addFilterBefore(
                             userAuthenticationFilter, UsernamePasswordAuthenticationFilter.class)
-                    .addFilterBefore(rateLimitingFilter, UsernamePasswordAuthenticationFilter.class)
+                    // TODO: IPRateLimitingFilter disabled — limit is 1M (no-op) and raw Filter
+                    // impl causes Spring Security async dispatch bug (response already committed
+                    // errors on StreamingResponseBody endpoints). Re-enable once converted to
+                    // OncePerRequestFilter with proper config-driven limits.
+                    // .addFilterBefore(rateLimitingFilter,
+                    // UsernamePasswordAuthenticationFilter.class)
                     .addFilterBefore(jwtAuthenticationFilter, UserAuthenticationFilter.class);
 
             http.sessionManagement(
diff --git a/app/proprietary/src/main/java/stirling/software/proprietary/security/controller/api/UIDataTessdataController.java b/app/proprietary/src/main/java/stirling/software/proprietary/security/controller/api/UIDataTessdataController.java
index ac2051196b..1653bca0ef 100644
--- a/app/proprietary/src/main/java/stirling/software/proprietary/security/controller/api/UIDataTessdataController.java
+++ b/app/proprietary/src/main/java/stirling/software/proprietary/security/controller/api/UIDataTessdataController.java
@@ -21,6 +21,7 @@ import org.springframework.web.bind.annotation.RequestMapping;
 import org.springframework.web.bind.annotation.RestController;
 
 import io.swagger.v3.oas.annotations.Operation;
+import io.swagger.v3.oas.annotations.tags.Tag;
 
 import lombok.Data;
 import lombok.RequiredArgsConstructor;
@@ -35,6 +36,7 @@ import tools.jackson.databind.ObjectMapper;
 @RestController
 @RequestMapping("/api/v1/ui-data")
 @RequiredArgsConstructor
+@Tag(name = "UI Data")
 public class UIDataTessdataController {
 
     private static final Pattern INVALID_LANG_CHARS_PATTERN = Pattern.compile("[^A-Za-z0-9_+\\-]");
diff --git a/app/proprietary/src/main/java/stirling/software/proprietary/security/service/UserService.java b/app/proprietary/src/main/java/stirling/software/proprietary/security/service/UserService.java
index ea960207dd..e18c101e1e 100644
--- a/app/proprietary/src/main/java/stirling/software/proprietary/security/service/UserService.java
+++ b/app/proprietary/src/main/java/stirling/software/proprietary/security/service/UserService.java
@@ -198,6 +198,15 @@ public class UserService implements UserServiceInterface {
         return user.getApiKey();
     }
 
+    @Override
+    public String getCurrentUserApiKey() {
+        String username = getCurrentUsername();
+        if (username == null || username.isEmpty()) {
+            throw new IllegalStateException("Cannot determine calling user for API key lookup");
+        }
+        return getApiKeyForUser(username);
+    }
+
     public boolean isValidApiKey(String apiKey) {
         return userRepository.findByApiKey(apiKey).isPresent();
     }
diff --git a/app/proprietary/src/main/java/stirling/software/proprietary/service/AiEngineClient.java b/app/proprietary/src/main/java/stirling/software/proprietary/service/AiEngineClient.java
new file mode 100644
index 0000000000..753331b124
--- /dev/null
+++ b/app/proprietary/src/main/java/stirling/software/proprietary/service/AiEngineClient.java
@@ -0,0 +1,108 @@
+package stirling.software.proprietary.service;
+
+import java.io.IOException;
+import java.net.URI;
+import java.net.http.HttpClient;
+import java.net.http.HttpRequest;
+import java.net.http.HttpResponse;
+import java.time.Duration;
+
+import org.springframework.http.HttpStatus;
+import org.springframework.stereotype.Service;
+import org.springframework.web.server.ResponseStatusException;
+
+import lombok.extern.slf4j.Slf4j;
+
+import stirling.software.common.model.ApplicationProperties;
+
+@Slf4j
+@Service
+public class AiEngineClient {
+
+    private final ApplicationProperties applicationProperties;
+    private final HttpClient httpClient;
+
+    public AiEngineClient(ApplicationProperties applicationProperties) {
+        this.applicationProperties = applicationProperties;
+        this.httpClient =
+                HttpClient.newBuilder()
+                        .connectTimeout(
+                                Duration.ofSeconds(
+                                        applicationProperties.getAiEngine().getTimeoutSeconds()))
+                        .build();
+    }
+
+    public String post(String path, String jsonBody) throws IOException {
+        ApplicationProperties.AiEngine config = applicationProperties.getAiEngine();
+        if (!config.isEnabled()) {
+            throw new ResponseStatusException(
+                    HttpStatus.SERVICE_UNAVAILABLE, "AI engine is not enabled");
+        }
+
+        String url = config.getUrl().stripTrailing() + path;
+        log.debug("Proxying AI engine request to {}", url);
+
+        HttpRequest request =
+                HttpRequest.newBuilder()
+                        .uri(URI.create(url))
+                        .header("Content-Type", "application/json")
+                        .header("Accept", "application/json")
+                        .timeout(Duration.ofSeconds(config.getTimeoutSeconds()))
+                        .POST(HttpRequest.BodyPublishers.ofString(jsonBody))
+                        .build();
+
+        HttpResponse<String> response = sendRequest(request);
+
+        log.debug("AI engine responded with status {}", response.statusCode());
+        checkResponseStatus(response);
+        return response.body();
+    }
+
+    public String get(String path) throws IOException {
+        ApplicationProperties.AiEngine config = applicationProperties.getAiEngine();
+        if (!config.isEnabled()) {
+            throw new ResponseStatusException(
+                    HttpStatus.SERVICE_UNAVAILABLE, "AI engine is not enabled");
+        }
+
+        String url = config.getUrl().stripTrailing() + path;
+        log.debug("Proxying AI engine GET request to {}", url);
+
+        HttpRequest request =
+                HttpRequest.newBuilder()
+                        .uri(URI.create(url))
+                        .header("Accept", "application/json")
+                        .timeout(Duration.ofSeconds(config.getTimeoutSeconds()))
+                        .GET()
+                        .build();
+
+        HttpResponse<String> response = sendRequest(request);
+
+        log.debug("AI engine responded with status {}", response.statusCode());
+        checkResponseStatus(response);
+        return response.body();
+    }
+
+    private HttpResponse<String> sendRequest(HttpRequest request) throws IOException {
+        try {
+            return httpClient.send(request, HttpResponse.BodyHandlers.ofString());
+        } catch (InterruptedException e) {
+            Thread.currentThread().interrupt();
+            throw new ResponseStatusException(
+                    HttpStatus.SERVICE_UNAVAILABLE, "AI engine request was interrupted");
+        }
+    }
+
+    private void checkResponseStatus(HttpResponse<String> response) {
+        int status = response.statusCode();
+        if (status >= 500) {
+            throw new ResponseStatusException(
+                    HttpStatus.BAD_GATEWAY, "AI engine returned error: " + status);
+        }
+        if (status >= 400) {
+            throw new ResponseStatusException(
+                    HttpStatus.valueOf(status),
+                    "AI engine returned client error: " + response.body());
+        }
+    }
+}
diff --git a/app/proprietary/src/main/java/stirling/software/proprietary/service/AiWorkflowService.java b/app/proprietary/src/main/java/stirling/software/proprietary/service/AiWorkflowService.java
new file mode 100644
index 0000000000..14bc56ed98
--- /dev/null
+++ b/app/proprietary/src/main/java/stirling/software/proprietary/service/AiWorkflowService.java
@@ -0,0 +1,428 @@
+package stirling.software.proprietary.service;
+
+import java.io.IOException;
+import java.util.ArrayList;
+import java.util.LinkedHashMap;
+import java.util.List;
+import java.util.Map;
+import java.util.stream.Collectors;
+
+import org.apache.commons.io.FilenameUtils;
+import org.apache.pdfbox.pdmodel.PDDocument;
+import org.springframework.core.io.FileSystemResource;
+import org.springframework.core.io.Resource;
+import org.springframework.http.HttpStatus;
+import org.springframework.http.MediaType;
+import org.springframework.http.MediaTypeFactory;
+import org.springframework.http.ResponseEntity;
+import org.springframework.stereotype.Service;
+import org.springframework.util.LinkedMultiValueMap;
+import org.springframework.util.MultiValueMap;
+import org.springframework.web.multipart.MultipartFile;
+
+import io.github.pixee.security.Filenames;
+
+import lombok.Data;
+import lombok.RequiredArgsConstructor;
+import lombok.extern.slf4j.Slf4j;
+
+import stirling.software.common.service.CustomPDFDocumentFactory;
+import stirling.software.common.service.FileStorage;
+import stirling.software.common.service.InternalApiClient;
+import stirling.software.common.service.ToolMetadataService;
+import stirling.software.common.util.ExceptionUtils;
+import stirling.software.common.util.TempFile;
+import stirling.software.common.util.TempFileManager;
+import stirling.software.common.util.ZipExtractionUtils;
+import stirling.software.proprietary.model.api.ai.AiConversationMessage;
+import stirling.software.proprietary.model.api.ai.AiWorkflowFileInput;
+import stirling.software.proprietary.model.api.ai.AiWorkflowFileRequest;
+import stirling.software.proprietary.model.api.ai.AiWorkflowOutcome;
+import stirling.software.proprietary.model.api.ai.AiWorkflowPhase;
+import stirling.software.proprietary.model.api.ai.AiWorkflowProgressEvent;
+import stirling.software.proprietary.model.api.ai.AiWorkflowRequest;
+import stirling.software.proprietary.model.api.ai.AiWorkflowResponse;
+import stirling.software.proprietary.model.api.ai.AiWorkflowResultFile;
+import stirling.software.proprietary.service.PdfContentExtractor.LoadedFile;
+import stirling.software.proprietary.service.PdfContentExtractor.PdfContentResult;
+import stirling.software.proprietary.service.PdfContentExtractor.WorkflowArtifact;
+
+import tools.jackson.databind.ObjectMapper;
+
+@Slf4j
+@Service
+@RequiredArgsConstructor
+public class AiWorkflowService {
+
+    private final CustomPDFDocumentFactory pdfDocumentFactory;
+    private final AiEngineClient aiEngineClient;
+    private final PdfContentExtractor pdfContentExtractor;
+    private final ObjectMapper objectMapper;
+    private final InternalApiClient internalApiClient;
+    private final FileStorage fileStorage;
+    private final ToolMetadataService toolMetadataService;
+    private final TempFileManager tempFileManager;
+
+    @FunctionalInterface
+    public interface ProgressListener {
+        void onProgress(AiWorkflowProgressEvent event);
+    }
+
+    private static final ProgressListener NOOP_LISTENER = event -> {};
+
+    private sealed interface WorkflowState {
+        record Pending(WorkflowTurnRequest request) implements WorkflowState {}
+
+        record Terminal(AiWorkflowResponse response) implements WorkflowState {}
+    }
+
+    public AiWorkflowResponse orchestrate(AiWorkflowRequest request) throws IOException {
+        return orchestrate(request, NOOP_LISTENER);
+    }
+
+    public AiWorkflowResponse orchestrate(AiWorkflowRequest request, ProgressListener listener)
+            throws IOException {
+        validateRequest(request);
+
+        Map<String, MultipartFile> filesByName = new LinkedHashMap<>();
+        for (AiWorkflowFileInput fileInput : request.getFileInputs()) {
+            filesByName.put(
+                    fileInput.getFileInput().getOriginalFilename(), fileInput.getFileInput());
+        }
+
+        WorkflowTurnRequest initialRequest = new WorkflowTurnRequest();
+        initialRequest.setUserMessage(request.getUserMessage().trim());
+        initialRequest.setFileNames(new ArrayList<>(filesByName.keySet()));
+        initialRequest.setConversationHistory(
+                request.getConversationHistory() == null
+                        ? new ArrayList<>()
+                        : new ArrayList<>(request.getConversationHistory()));
+
+        listener.onProgress(AiWorkflowProgressEvent.of(AiWorkflowPhase.ANALYZING));
+
+        WorkflowState state = new WorkflowState.Pending(initialRequest);
+        while (state instanceof WorkflowState.Pending pending) {
+            state = advance(pending.request(), filesByName, listener);
+        }
+        return ((WorkflowState.Terminal) state).response();
+    }
+
+    private WorkflowState advance(
+            WorkflowTurnRequest request,
+            Map<String, MultipartFile> filesByName,
+            ProgressListener listener)
+            throws IOException {
+        listener.onProgress(AiWorkflowProgressEvent.of(AiWorkflowPhase.CALLING_ENGINE));
+        AiWorkflowResponse response = invokeOrchestrator(request);
+        return switch (response.getOutcome()) {
+            case NEED_CONTENT -> onNeedContent(response, filesByName, request, listener);
+            case TOOL_CALL -> onToolCall(response, filesByName, listener);
+            case PLAN -> onPlan(response, filesByName, listener);
+            case ANSWER,
+                    NOT_FOUND,
+                    NEED_CLARIFICATION,
+                    CANNOT_DO,
+                    DRAFT,
+                    COMPLETED,
+                    UNSUPPORTED_CAPABILITY,
+                    CANNOT_CONTINUE ->
+                    new WorkflowState.Terminal(response);
+        };
+    }
+
+    private WorkflowState onNeedContent(
+            AiWorkflowResponse response,
+            Map<String, MultipartFile> filesByName,
+            WorkflowTurnRequest request,
+            ProgressListener listener)
+            throws IOException {
+        if (!request.getArtifacts().isEmpty()) {
+            return new WorkflowState.Terminal(
+                    cannotContinue("AI engine requested content extraction more than once."));
+        }
+
+        List<AiWorkflowFileRequest> requestedFiles = response.getFiles();
+
+        // Validate requested file names before loading anything
+        if (requestedFiles != null && !requestedFiles.isEmpty()) {
+            for (AiWorkflowFileRequest fileReq : requestedFiles) {
+                if (!filesByName.containsKey(fileReq.getFileName())) {
+                    return new WorkflowState.Terminal(
+                            cannotContinue(
+                                    "AI engine requested unknown file: " + fileReq.getFileName()));
+                }
+            }
+        }
+
+        List<String> fileNamesToLoad =
+                (requestedFiles == null || requestedFiles.isEmpty())
+                        ? new ArrayList<>(filesByName.keySet())
+                        : requestedFiles.stream().map(AiWorkflowFileRequest::getFileName).toList();
+
+        Map<String, AiWorkflowFileRequest> requestedByName =
+                requestedFiles == null || requestedFiles.isEmpty()
+                        ? Map.of()
+                        : requestedFiles.stream()
+                                .collect(
+                                        Collectors.toMap(
+                                                AiWorkflowFileRequest::getFileName, r -> r));
+
+        listener.onProgress(AiWorkflowProgressEvent.of(AiWorkflowPhase.EXTRACTING_CONTENT));
+
+        List<LoadedFile> loadedFiles = new ArrayList<>();
+        try {
+            for (String fileName : fileNamesToLoad) {
+                PDDocument doc = pdfDocumentFactory.load(filesByName.get(fileName), true);
+                loadedFiles.add(new LoadedFile(fileName, doc));
+            }
+
+            List<PdfContentResult> contentResults =
+                    pdfContentExtractor.extractContent(
+                            loadedFiles,
+                            requestedByName,
+                            response.getMaxPages(),
+                            response.getMaxCharacters());
+
+            listener.onProgress(AiWorkflowProgressEvent.of(AiWorkflowPhase.PROCESSING));
+
+            WorkflowTurnRequest nextRequest = new WorkflowTurnRequest();
+            nextRequest.setUserMessage(request.getUserMessage());
+            nextRequest.setFileNames(request.getFileNames());
+            nextRequest.setConversationHistory(request.getConversationHistory());
+            nextRequest.setArtifacts(pdfContentExtractor.buildArtifacts(contentResults));
+            nextRequest.setResumeWith(response.getResumeWith());
+            return new WorkflowState.Pending(nextRequest);
+        } finally {
+            for (LoadedFile lf : loadedFiles) {
+                try {
+                    lf.document().close();
+                } catch (IOException e) {
+                    log.warn("Failed to close PDF document: {}", lf.fileName(), e);
+                }
+            }
+        }
+    }
+
+    @SuppressWarnings("unchecked")
+    private WorkflowState onToolCall(
+            AiWorkflowResponse response,
+            Map<String, MultipartFile> filesByName,
+            ProgressListener listener) {
+        String endpointPath = response.getTool();
+        Map<String, Object> parameters = response.getParameters();
+        if (endpointPath == null || endpointPath.isBlank()) {
+            return new WorkflowState.Terminal(
+                    cannotContinue("AI engine returned tool_call without a tool endpoint."));
+        }
+        if (parameters == null) {
+            parameters = Map.of();
+        }
+
+        try {
+            List<Resource> inputFiles = toResources(filesByName);
+            listener.onProgress(AiWorkflowProgressEvent.executingTool(endpointPath, 1, 1));
+            List<Resource> results = executeStep(endpointPath, parameters, inputFiles);
+            return new WorkflowState.Terminal(
+                    buildCompletedResponse(
+                            response.getRationale(),
+                            results,
+                            new ArrayList<>(filesByName.keySet())));
+        } catch (Exception e) {
+            log.error("Failed to execute tool {}: {}", endpointPath, e.getMessage(), e);
+            return new WorkflowState.Terminal(
+                    cannotContinue("Tool execution failed: " + e.getMessage()));
+        }
+    }
+
+    @SuppressWarnings("unchecked")
+    private WorkflowState onPlan(
+            AiWorkflowResponse response,
+            Map<String, MultipartFile> filesByName,
+            ProgressListener listener) {
+        List<Map<String, Object>> steps = response.getSteps();
+        if (steps == null || steps.isEmpty()) {
+            return new WorkflowState.Terminal(
+                    cannotContinue("AI engine returned a plan with no steps."));
+        }
+
+        try {
+            List<Resource> currentFiles = toResources(filesByName);
+
+            for (int i = 0; i < steps.size(); i++) {
+                Map<String, Object> step = steps.get(i);
+                String endpointPath = (String) step.get("tool");
+                Map<String, Object> parameters =
+                        step.containsKey("parameters")
+                                ? (Map<String, Object>) step.get("parameters")
+                                : Map.of();
+
+                if (endpointPath == null || endpointPath.isBlank()) {
+                    return new WorkflowState.Terminal(
+                            cannotContinue("Plan step " + (i + 1) + " has no tool endpoint."));
+                }
+
+                listener.onProgress(
+                        AiWorkflowProgressEvent.executingTool(endpointPath, i + 1, steps.size()));
+                currentFiles = executeStep(endpointPath, parameters, currentFiles);
+            }
+
+            return new WorkflowState.Terminal(
+                    buildCompletedResponse(
+                            response.getSummary(),
+                            currentFiles,
+                            new ArrayList<>(filesByName.keySet())));
+        } catch (Exception e) {
+            log.error("Failed to execute plan: {}", e.getMessage(), e);
+            return new WorkflowState.Terminal(
+                    cannotContinue("Plan execution failed: " + e.getMessage()));
+        }
+    }
+
+    /**
+     * Execute a single tool step. If the endpoint accepts multiple files, all files are sent in one
+     * call. Otherwise, the endpoint is called once per file. ZIP responses are unpacked so each
+     * inner file is treated as its own result (e.g. split outputs a ZIP of pages).
+     */
+    private List<Resource> executeStep(
+            String endpointPath, Map<String, Object> parameters, List<Resource> inputFiles)
+            throws IOException {
+        List<Resource> results = new ArrayList<>();
+        if (toolMetadataService.isMultiInput(endpointPath)) {
+            results.addAll(callEndpoint(endpointPath, parameters, inputFiles));
+        } else {
+            for (Resource file : inputFiles) {
+                results.addAll(callEndpoint(endpointPath, parameters, List.of(file)));
+            }
+        }
+        return results;
+    }
+
+    /**
+     * Call an endpoint and return the response body. Endpoints that are declared as ZIP-returning
+     * in the API spec (multi-output, or {@code Output:ZIP-*}) are unpacked into their individual
+     * entries so callers always see a flat list of result files.
+     */
+    private List<Resource> callEndpoint(
+            String endpointPath, Map<String, Object> parameters, List<Resource> files)
+            throws IOException {
+        MultiValueMap<String, Object> body = new LinkedMultiValueMap<>();
+        for (Resource file : files) {
+            body.add("fileInput", file);
+        }
+        for (Map.Entry<String, Object> entry : parameters.entrySet()) {
+            if (entry.getValue() instanceof List<?> list) {
+                for (Object item : list) {
+                    body.add(entry.getKey(), item);
+                }
+            } else {
+                body.add(entry.getKey(), entry.getValue());
+            }
+        }
+        ResponseEntity<Resource> response = internalApiClient.post(endpointPath, body);
+        if (!HttpStatus.OK.equals(response.getStatusCode()) || response.getBody() == null) {
+            throw new IOException(
+                    "Tool returned HTTP " + response.getStatusCode() + " for " + endpointPath);
+        }
+        Resource resource = response.getBody();
+        if (toolMetadataService.shouldUnpackZipResponse(endpointPath)) {
+            return ZipExtractionUtils.extractZip(resource, tempFileManager);
+        }
+        return List.of(resource);
+    }
+
+    private List<Resource> toResources(Map<String, MultipartFile> filesByName) throws IOException {
+        List<Resource> resources = new ArrayList<>();
+        for (MultipartFile file : filesByName.values()) {
+            TempFile tempFile = tempFileManager.createManagedTempFile("ai-workflow");
+            file.transferTo(tempFile.getPath());
+            final String originalName = Filenames.toSimpleFileName(file.getOriginalFilename());
+            resources.add(
+                    new FileSystemResource(tempFile.getFile()) {
+                        @Override
+                        public String getFilename() {
+                            return originalName;
+                        }
+                    });
+        }
+        return resources;
+    }
+
+    private AiWorkflowResponse buildCompletedResponse(
+            String summary, List<Resource> resultFiles, List<String> inputFileNames)
+            throws IOException {
+        // Store every output file individually so each gets its own Stirling file ID and the
+        // frontend can add them as independent variants without going through a zip.
+        boolean preserveInputNames = inputFileNames.size() == resultFiles.size();
+        List<AiWorkflowResultFile> descriptors = new ArrayList<>();
+        for (int i = 0; i < resultFiles.size(); i++) {
+            Resource resource = resultFiles.get(i);
+            String responseName = resource.getFilename();
+            String inputName = preserveInputNames ? inputFileNames.get(i) : null;
+            // Prefer the input name only for 1:1 operations where the output keeps the same
+            // extension (rotate, compress, etc.). For converters and other extension-changing
+            // tools, the response filename from Content-Disposition is authoritative.
+            String name;
+            if (inputName != null
+                    && FilenameUtils.getExtension(inputName)
+                            .equalsIgnoreCase(FilenameUtils.getExtension(responseName))) {
+                name = inputName;
+            } else if (responseName != null) {
+                name = responseName;
+            } else {
+                name = "result-" + (i + 1);
+            }
+            String contentType =
+                    MediaTypeFactory.getMediaType(name)
+                            .orElse(MediaType.APPLICATION_OCTET_STREAM)
+                            .toString();
+            String fileId;
+            try (java.io.InputStream is = resource.getInputStream()) {
+                fileId = fileStorage.storeInputStream(is, name).fileId();
+            }
+            descriptors.add(new AiWorkflowResultFile(fileId, name, contentType));
+        }
+
+        AiWorkflowResponse completed = new AiWorkflowResponse();
+        completed.setOutcome(AiWorkflowOutcome.COMPLETED);
+        completed.setSummary(summary);
+        completed.setResultFiles(descriptors);
+        // Mirror the first file into the legacy single-file fields so existing clients still work.
+        if (!descriptors.isEmpty()) {
+            AiWorkflowResultFile first = descriptors.getFirst();
+            completed.setFileId(first.getFileId());
+            completed.setFileName(first.getFileName());
+            completed.setContentType(first.getContentType());
+        }
+        return completed;
+    }
+
+    private void validateRequest(AiWorkflowRequest request) {
+        for (AiWorkflowFileInput fileInput : request.getFileInputs()) {
+            if (fileInput.getFileInput().isEmpty()) {
+                throw ExceptionUtils.createFileNullOrEmptyException();
+            }
+        }
+    }
+
+    private AiWorkflowResponse cannotContinue(String reason) {
+        AiWorkflowResponse response = new AiWorkflowResponse();
+        response.setOutcome(AiWorkflowOutcome.CANNOT_CONTINUE);
+        response.setReason(reason);
+        return response;
+    }
+
+    private AiWorkflowResponse invokeOrchestrator(WorkflowTurnRequest request) throws IOException {
+        String requestBody = objectMapper.writeValueAsString(request);
+        String responseBody = aiEngineClient.post("/api/v1/orchestrator", requestBody);
+        return objectMapper.readValue(responseBody, AiWorkflowResponse.class);
+    }
+
+    @Data
+    private static class WorkflowTurnRequest {
+        private String userMessage;
+        private List<String> fileNames = new ArrayList<>();
+        private List<AiConversationMessage> conversationHistory = new ArrayList<>();
+        private List<WorkflowArtifact> artifacts = new ArrayList<>();
+        private String resumeWith;
+    }
+}
diff --git a/app/proprietary/src/main/java/stirling/software/proprietary/service/MathAuditorOrchestrator.java b/app/proprietary/src/main/java/stirling/software/proprietary/service/MathAuditorOrchestrator.java
new file mode 100644
index 0000000000..92c595b43a
--- /dev/null
+++ b/app/proprietary/src/main/java/stirling/software/proprietary/service/MathAuditorOrchestrator.java
@@ -0,0 +1,226 @@
+package stirling.software.proprietary.service;
+
+import java.io.IOException;
+import java.math.BigDecimal;
+import java.util.ArrayList;
+import java.util.Collections;
+import java.util.List;
+import java.util.UUID;
+
+import org.apache.pdfbox.pdmodel.PDDocument;
+import org.springframework.stereotype.Service;
+import org.springframework.web.multipart.MultipartFile;
+
+import lombok.RequiredArgsConstructor;
+import lombok.extern.slf4j.Slf4j;
+
+import stirling.software.common.service.CustomPDFDocumentFactory;
+import stirling.software.proprietary.model.api.ai.Evidence;
+import stirling.software.proprietary.model.api.ai.Folio;
+import stirling.software.proprietary.model.api.ai.FolioManifest;
+import stirling.software.proprietary.model.api.ai.FolioType;
+import stirling.software.proprietary.model.api.ai.Requisition;
+import stirling.software.proprietary.model.api.ai.Verdict;
+
+import tools.jackson.databind.ObjectMapper;
+
+/**
+ * Orchestrator for the Math Auditor Agent (mathAuditorAgent).
+ *
+ * <p>Manages a four-step Java-Python protocol:
+ *
+ * <ol>
+ *   <li>Classify all pages cheaply with PDFBox (no OCR or Tabula yet).
+ *   <li>Send the {@link FolioManifest} to the Python Examiner; receive a {@link Requisition}.
+ *   <li>Fulfil the Requisition (text / tables / OCR) for only the requested pages.
+ *   <li>Send the {@link Evidence} to the Python Auditor; receive a {@link Verdict}.
+ * </ol>
+ *
+ * <p>The raw PDF never leaves Java. Python only receives structured text and CSV data.
+ */
+@Slf4j
+@Service
+@RequiredArgsConstructor
+public class MathAuditorOrchestrator {
+
+    private static final String EXAMINE_PATH = "/api/v1/ai/math-auditor-agent/examine";
+    private static final String DELIBERATE_PATH = "/api/v1/ai/math-auditor-agent/deliberate";
+
+    private final AiEngineClient aiEngineClient;
+    private final CustomPDFDocumentFactory pdfDocumentFactory;
+    private final PdfContentExtractor pdfContentExtractor;
+    private final ObjectMapper objectMapper;
+
+    /**
+     * Run a full math audit against the supplied PDF file.
+     *
+     * @param pdfFile The uploaded PDF to audit.
+     * @param tolerance Arithmetic tolerance — differences smaller than this are ignored.
+     * @return The Auditor's final Verdict.
+     */
+    public Verdict audit(MultipartFile pdfFile, BigDecimal tolerance) throws IOException {
+        String sessionId = UUID.randomUUID().toString();
+        log.info(
+                "[math-auditor-agent] audit started session={} file={} tolerance={}",
+                sessionId,
+                pdfFile.getOriginalFilename(),
+                tolerance);
+
+        try (PDDocument document = pdfDocumentFactory.load(pdfFile)) {
+            // Round 1: classify pages cheaply; send manifest; get requisition
+            List<FolioType> folioTypes = classifyPages(document);
+            FolioManifest manifest =
+                    new FolioManifest(sessionId, document.getNumberOfPages(), folioTypes, 1);
+
+            Requisition requisition = callExamine(manifest);
+            log.info(
+                    "[math-auditor-agent] session={} requisition received: {}",
+                    sessionId,
+                    requisition.rationale());
+
+            // Round 2: fulfil the requisition and get verdict
+            Evidence evidence = fulfil(document, sessionId, requisition, 2, true);
+            Verdict verdict = callDeliberate(evidence, tolerance);
+
+            if (verdict == null) {
+                log.error(
+                        "[math-auditor-agent] session={} null Verdict from deliberate", sessionId);
+                throw new IllegalStateException("Math Auditor Agent returned null Verdict");
+            }
+
+            log.info(
+                    "[math-auditor-agent] session={} verdict: {} errors, {} warnings,"
+                            + " clean={}",
+                    sessionId,
+                    verdict.errorCount(),
+                    verdict.warningCount(),
+                    verdict.clean());
+            return verdict;
+        }
+    }
+
+    // -----------------------------------------------------------------------
+    // Python engine calls
+    // -----------------------------------------------------------------------
+
+    private Requisition callExamine(FolioManifest manifest) throws IOException {
+        String requestBody = objectMapper.writeValueAsString(manifest);
+        log.info(
+                "[math-auditor-agent] POST {} session={} round={}",
+                EXAMINE_PATH,
+                manifest.sessionId(),
+                manifest.round());
+        String responseBody = aiEngineClient.post(EXAMINE_PATH, requestBody);
+        return objectMapper.readValue(responseBody, Requisition.class);
+    }
+
+    private Verdict callDeliberate(Evidence evidence, BigDecimal tolerance) throws IOException {
+        String path = DELIBERATE_PATH + "?tolerance=" + tolerance.toPlainString();
+        String requestBody = objectMapper.writeValueAsString(evidence);
+        log.info(
+                "[math-auditor-agent] POST {} session={} round={} final={}",
+                path,
+                evidence.sessionId(),
+                evidence.round(),
+                evidence.finalRound());
+        String responseBody = aiEngineClient.post(path, requestBody);
+        return objectMapper.readValue(responseBody, Verdict.class);
+    }
+
+    // -----------------------------------------------------------------------
+    // Page classification
+    // -----------------------------------------------------------------------
+
+    private List<FolioType> classifyPages(PDDocument document) throws IOException {
+        List<FolioType> types = new ArrayList<>();
+        for (int page = 1; page <= document.getNumberOfPages(); page++) {
+            types.add(pdfContentExtractor.classifyPage(document, page));
+        }
+        return types;
+    }
+
+    // -----------------------------------------------------------------------
+    // Requisition fulfilment
+    // -----------------------------------------------------------------------
+
+    private Evidence fulfil(
+            PDDocument document,
+            String sessionId,
+            Requisition requisition,
+            int round,
+            boolean finalRound)
+            throws IOException {
+
+        List<Integer> allPages =
+                union(requisition.needText(), requisition.needTables(), requisition.needOcr());
+        int totalPages = document.getNumberOfPages();
+        allPages.removeIf(page -> page < 0 || page >= totalPages);
+        if (allPages.isEmpty()) {
+            log.warn(
+                    "[math-auditor-agent] session={} all requested pages are out of bounds",
+                    sessionId);
+        }
+        List<Folio> folios = new ArrayList<>();
+        List<Integer> unauditablePages = new ArrayList<>();
+
+        for (int page : allPages) {
+            // Page indices from Python are 0-based; PdfContentExtractor uses 1-based
+            int pageNumber = page + 1;
+            String text = null;
+            List<String> tables = null;
+            String ocrText = null;
+
+            if (contains(requisition.needText(), page)) {
+                text = pdfContentExtractor.extractPageTextRaw(document, pageNumber);
+            }
+            if (contains(requisition.needTables(), page)) {
+                tables = pdfContentExtractor.extractTablesAsCsv(document, pageNumber);
+            }
+            if (contains(requisition.needOcr(), page)) {
+                log.warn(
+                        "[math-auditor-agent] session={} OCR requested for page {} but not yet"
+                                + " wired - marking unauditable",
+                        sessionId,
+                        page);
+                unauditablePages.add(page);
+            }
+
+            if (text != null || tables != null) {
+                folios.add(new Folio(page, text, tables, ocrText, null));
+            }
+        }
+
+        log.info(
+                "[math-auditor-agent] session={} fulfilled round {} with {} folios, {}"
+                        + " unauditable pages",
+                sessionId,
+                round,
+                folios.size(),
+                unauditablePages.size());
+        return new Evidence(sessionId, folios, round, finalRound, unauditablePages);
+    }
+
+    // -----------------------------------------------------------------------
+    // Helpers
+    // -----------------------------------------------------------------------
+
+    @SafeVarargs
+    private static List<Integer> union(List<Integer>... lists) {
+        List<Integer> result = new ArrayList<>();
+        for (List<Integer> list : lists) {
+            if (list != null) {
+                for (int page : list) {
+                    if (!result.contains(page)) {
+                        result.add(page);
+                    }
+                }
+            }
+        }
+        Collections.sort(result);
+        return result;
+    }
+
+    private static boolean contains(List<Integer> list, int value) {
+        return list != null && list.contains(value);
+    }
+}
diff --git a/app/proprietary/src/main/java/stirling/software/proprietary/service/PdfContentExtractor.java b/app/proprietary/src/main/java/stirling/software/proprietary/service/PdfContentExtractor.java
new file mode 100644
index 0000000000..0716b2ca88
--- /dev/null
+++ b/app/proprietary/src/main/java/stirling/software/proprietary/service/PdfContentExtractor.java
@@ -0,0 +1,367 @@
+package stirling.software.proprietary.service;
+
+import java.io.IOException;
+import java.io.StringWriter;
+import java.util.ArrayList;
+import java.util.Collections;
+import java.util.LinkedHashSet;
+import java.util.List;
+import java.util.Map;
+import java.util.Optional;
+import java.util.Set;
+import java.util.stream.Collectors;
+
+import org.apache.commons.csv.CSVFormat;
+import org.apache.commons.csv.QuoteMode;
+import org.apache.pdfbox.pdmodel.PDDocument;
+import org.apache.pdfbox.text.PDFTextStripper;
+import org.springframework.stereotype.Service;
+
+import com.fasterxml.jackson.annotation.JsonIgnore;
+import com.fasterxml.jackson.annotation.JsonValue;
+
+import lombok.Data;
+import lombok.extern.slf4j.Slf4j;
+
+import stirling.software.common.util.ExceptionUtils;
+import stirling.software.common.util.PdfUtils;
+import stirling.software.proprietary.model.api.ai.AiPdfContentType;
+import stirling.software.proprietary.model.api.ai.AiWorkflowFileRequest;
+import stirling.software.proprietary.model.api.ai.AiWorkflowTextSelection;
+import stirling.software.proprietary.model.api.ai.FolioType;
+import stirling.software.proprietary.pdf.FlexibleCSVWriter;
+
+import technology.tabula.ObjectExtractor;
+import technology.tabula.Page;
+import technology.tabula.Table;
+import technology.tabula.extractors.SpreadsheetExtractionAlgorithm;
+
+@Slf4j
+@Service
+public class PdfContentExtractor {
+
+    private static final int MAX_CHARACTERS_PER_PAGE = 4_000;
+
+    private static final int TEXT_PRESENCE_THRESHOLD = 20;
+
+    record LoadedFile(String fileName, PDDocument document) {}
+
+    // -----------------------------------------------------------------------
+    // Low-level extraction methods (usable by any agent)
+    // -----------------------------------------------------------------------
+
+    /**
+     * Classify a single page as TEXT, IMAGE, or MIXED.
+     *
+     * @param document the open PDF
+     * @param pageNumber 1-based page number
+     */
+    public FolioType classifyPage(PDDocument document, int pageNumber) throws IOException {
+        PDFTextStripper stripper = new PDFTextStripper();
+        stripper.setStartPage(pageNumber);
+        stripper.setEndPage(pageNumber);
+        String text = stripper.getText(document).trim();
+
+        boolean hasText = text.length() > TEXT_PRESENCE_THRESHOLD;
+        boolean hasImages = PdfUtils.hasImagesOnPage(document.getPage(pageNumber - 1));
+
+        if (hasText && hasImages) {
+            return FolioType.MIXED;
+        } else if (hasText) {
+            return FolioType.TEXT;
+        } else {
+            return FolioType.IMAGE;
+        }
+    }
+
+    /**
+     * Extract plain text from a single page, clipped to {@link #MAX_CHARACTERS_PER_PAGE}.
+     *
+     * @param document the open PDF
+     * @param pageNumber 1-based page number
+     * @return trimmed text, or empty string if the page has no extractable text
+     */
+    public String extractPageTextRaw(PDDocument document, int pageNumber) throws IOException {
+        PDFTextStripper stripper = new PDFTextStripper();
+        stripper.setStartPage(pageNumber);
+        stripper.setEndPage(pageNumber);
+        String text = stripper.getText(document).trim();
+        return clip(text, MAX_CHARACTERS_PER_PAGE);
+    }
+
+    /**
+     * Extract all tables from a single page as CSV strings.
+     *
+     * @param document the open PDF
+     * @param pageNumber 1-based page number
+     * @return list of CSV strings (one per table), empty if no tables found
+     */
+    public List<String> extractTablesAsCsv(PDDocument document, int pageNumber) throws IOException {
+        SpreadsheetExtractionAlgorithm sea = new SpreadsheetExtractionAlgorithm();
+        CSVFormat format =
+                CSVFormat.EXCEL.builder().setEscape('"').setQuoteMode(QuoteMode.ALL).build();
+        List<String> csvStrings = new ArrayList<>();
+
+        try (ObjectExtractor extractor = new ObjectExtractor(document)) {
+            Page tabulaPage = extractor.extract(pageNumber);
+            List<Table> tables = sea.extract(tabulaPage);
+
+            for (Table table : tables) {
+                StringWriter sw = new StringWriter();
+                FlexibleCSVWriter csvWriter = new FlexibleCSVWriter(format);
+                csvWriter.write(sw, Collections.singletonList(table));
+                csvStrings.add(sw.toString());
+            }
+        }
+        return csvStrings;
+    }
+
+    // -----------------------------------------------------------------------
+    // Workflow extraction (used by AiWorkflowService)
+    // -----------------------------------------------------------------------
+
+    /**
+     * Extracts content from the loaded files according to the requested content types and budget
+     * constraints.
+     */
+    List<PdfContentResult> extractContent(
+            List<LoadedFile> loadedFiles,
+            Map<String, AiWorkflowFileRequest> requestedByName,
+            int maxPages,
+            int maxCharacters)
+            throws IOException {
+        List<PdfContentResult> contentResults = new ArrayList<>();
+        int remainingPages = maxPages;
+        int remainingCharacters = maxCharacters;
+
+        for (LoadedFile lf : loadedFiles) {
+            if (remainingPages <= 0 || remainingCharacters <= 0) break;
+            AiWorkflowFileRequest fileReq = requestedByName.get(lf.fileName());
+            List<AiPdfContentType> contentTypes =
+                    fileReq != null && !fileReq.getContentTypes().isEmpty()
+                            ? fileReq.getContentTypes()
+                            : List.of(AiPdfContentType.PAGE_TEXT);
+
+            for (AiPdfContentType contentType : contentTypes) {
+                Optional<PdfContentResult> result =
+                        dispatchContentType(
+                                contentType, lf, fileReq, remainingPages, remainingCharacters);
+                if (result.isPresent()) {
+                    PdfContentResult content = result.get();
+                    contentResults.add(content);
+                    remainingPages -= content.pagesConsumed();
+                    remainingCharacters -= content.charactersConsumed();
+                }
+            }
+        }
+        return contentResults;
+    }
+
+    /** Groups content results by artifact kind and builds the corresponding workflow artifacts. */
+    List<WorkflowArtifact> buildArtifacts(List<PdfContentResult> results) {
+        List<WorkflowArtifact> artifacts = new ArrayList<>();
+        Map<ArtifactKind, List<PdfContentResult>> byKind =
+                results.stream().collect(Collectors.groupingBy(PdfContentResult::getArtifactKind));
+        for (var entry : byKind.entrySet()) {
+            artifacts.add(buildArtifact(entry.getKey(), entry.getValue()));
+        }
+        return artifacts;
+    }
+
+    private Optional<PdfContentResult> dispatchContentType(
+            AiPdfContentType contentType,
+            LoadedFile lf,
+            AiWorkflowFileRequest fileReq,
+            int remainingPages,
+            int remainingCharacters)
+            throws IOException {
+        return switch (contentType) {
+            case PAGE_TEXT, FULL_TEXT ->
+                    Optional.<PdfContentResult>ofNullable(
+                            extractText(lf, fileReq, remainingPages, remainingCharacters));
+            default -> {
+                log.warn(
+                        "Content type {} not yet implemented, skipping for {}",
+                        contentType,
+                        lf.fileName());
+                yield Optional.empty();
+            }
+        };
+    }
+
+    private ExtractedFileText extractText(
+            LoadedFile lf,
+            AiWorkflowFileRequest fileReq,
+            int remainingPages,
+            int remainingCharacters)
+            throws IOException {
+        List<Integer> requestedPages = fileReq != null ? fileReq.getPageNumbers() : null;
+        List<Integer> pages =
+                selectPages(lf.document().getNumberOfPages(), requestedPages, remainingPages);
+        List<AiWorkflowTextSelection> extracted =
+                extractPageText(lf.document(), pages, remainingCharacters);
+        return extracted.isEmpty() ? null : buildExtractedFileText(lf.fileName(), extracted);
+    }
+
+    private WorkflowArtifact buildArtifact(ArtifactKind kind, List<PdfContentResult> results) {
+        return switch (kind) {
+            case EXTRACTED_TEXT -> {
+                ExtractedTextArtifact artifact = new ExtractedTextArtifact();
+                artifact.setFiles(results.stream().map(ExtractedFileText.class::cast).toList());
+                yield artifact;
+            }
+        };
+    }
+
+    private List<Integer> selectPages(
+            int totalPages, List<Integer> requestedPageNumbers, int maxPages) {
+        if (totalPages <= 0) {
+            throw ExceptionUtils.createPdfNoPages();
+        }
+
+        List<Integer> pages = new ArrayList<>();
+
+        if (requestedPageNumbers == null || requestedPageNumbers.isEmpty()) {
+            for (int p = 1; p <= totalPages && pages.size() < maxPages; p++) {
+                pages.add(p);
+            }
+            return pages;
+        }
+
+        Set<Integer> deduplicatedPages = new LinkedHashSet<>(requestedPageNumbers);
+        for (Integer pageNumber : deduplicatedPages) {
+            if (pageNumber == null || pageNumber < 1 || pageNumber > totalPages) {
+                throw ExceptionUtils.createIllegalArgumentException(
+                        "error.invalidPageNumber",
+                        "Requested page number %s is outside the PDF page range.",
+                        pageNumber);
+            }
+            pages.add(pageNumber);
+            if (pages.size() >= maxPages) {
+                break;
+            }
+        }
+        return pages;
+    }
+
+    private List<AiWorkflowTextSelection> extractPageText(
+            PDDocument document, List<Integer> selectedPages, int maxCharacters)
+            throws IOException {
+        PDFTextStripper textStripper = new PDFTextStripper();
+        List<AiWorkflowTextSelection> pages = new ArrayList<>();
+        int remainingCharacters = maxCharacters;
+
+        for (Integer pageNumber : selectedPages) {
+            if (remainingCharacters <= 0) {
+                break;
+            }
+
+            textStripper.setStartPage(pageNumber);
+            textStripper.setEndPage(pageNumber);
+
+            String pageText = textStripper.getText(document).trim();
+            if (pageText.isBlank()) {
+                continue;
+            }
+
+            int allowedCharacters = Math.min(remainingCharacters, MAX_CHARACTERS_PER_PAGE);
+            String clippedText = clip(pageText, allowedCharacters);
+            if (clippedText.isBlank()) {
+                continue;
+            }
+
+            AiWorkflowTextSelection selection = new AiWorkflowTextSelection();
+            selection.setPageNumber(pageNumber);
+            selection.setText(clippedText);
+            pages.add(selection);
+            remainingCharacters -= clippedText.length();
+        }
+        return pages;
+    }
+
+    private ExtractedFileText buildExtractedFileText(
+            String fileName, List<AiWorkflowTextSelection> pages) {
+        ExtractedFileText fileText = new ExtractedFileText();
+        fileText.setFileName(fileName);
+        fileText.setPages(pages);
+        return fileText;
+    }
+
+    private String clip(String text, int maxLength) {
+        if (text.length() <= maxLength) {
+            return text;
+        }
+        // Avoid splitting a surrogate pair at the boundary
+        int end = maxLength;
+        if (Character.isHighSurrogate(text.charAt(end - 1))) {
+            end--;
+        }
+        return text.substring(0, end);
+    }
+
+    // --- Types shared with AiWorkflowService (package-private) ---
+
+    interface PdfContentResult {
+        @JsonIgnore
+        ArtifactKind getArtifactKind();
+
+        @JsonIgnore
+        default int pagesConsumed() {
+            return 0;
+        }
+
+        @JsonIgnore
+        default int charactersConsumed() {
+            return 0;
+        }
+    }
+
+    /**
+     * Values MUST match {@code ArtifactKind} in {@code engine/src/stirling/contracts/common.py}.
+     */
+    enum ArtifactKind {
+        EXTRACTED_TEXT("extracted_text");
+
+        private final String value;
+
+        ArtifactKind(String value) {
+            this.value = value;
+        }
+
+        @JsonValue
+        public String getValue() {
+            return value;
+        }
+    }
+
+    interface WorkflowArtifact {
+        ArtifactKind getKind();
+    }
+
+    @Data
+    static class ExtractedFileText implements PdfContentResult {
+        private String fileName;
+        private List<AiWorkflowTextSelection> pages = new ArrayList<>();
+
+        @Override
+        public ArtifactKind getArtifactKind() {
+            return ArtifactKind.EXTRACTED_TEXT;
+        }
+
+        @Override
+        public int pagesConsumed() {
+            return pages.size();
+        }
+
+        @Override
+        public int charactersConsumed() {
+            return pages.stream().mapToInt(p -> p.getText().length()).sum();
+        }
+    }
+
+    @Data
+    static final class ExtractedTextArtifact implements WorkflowArtifact {
+        private final ArtifactKind kind = ArtifactKind.EXTRACTED_TEXT;
+        private List<ExtractedFileText> files = new ArrayList<>();
+    }
+}
diff --git a/app/proprietary/src/main/java/stirling/software/proprietary/storage/controller/FileStorageController.java b/app/proprietary/src/main/java/stirling/software/proprietary/storage/controller/FileStorageController.java
index 8429135204..6027721a28 100644
--- a/app/proprietary/src/main/java/stirling/software/proprietary/storage/controller/FileStorageController.java
+++ b/app/proprietary/src/main/java/stirling/software/proprietary/storage/controller/FileStorageController.java
@@ -22,6 +22,8 @@ import org.springframework.web.bind.annotation.RestController;
 import org.springframework.web.multipart.MultipartFile;
 import org.springframework.web.server.ResponseStatusException;
 
+import io.swagger.v3.oas.annotations.tags.Tag;
+
 import lombok.RequiredArgsConstructor;
 
 import stirling.software.proprietary.security.model.User;
@@ -38,6 +40,9 @@ import stirling.software.proprietary.storage.service.FileStorageService;
 @RestController
 @RequestMapping("/api/v1/storage")
 @RequiredArgsConstructor
+@Tag(
+        name = "File Storage",
+        description = "Stored file management, sharing, and share link operations")
 public class FileStorageController {
 
     private final FileStorageService fileStorageService;
diff --git a/app/proprietary/src/main/java/stirling/software/proprietary/workflow/controller/SigningSessionController.java b/app/proprietary/src/main/java/stirling/software/proprietary/workflow/controller/SigningSessionController.java
index 3269388868..756fba1fe0 100644
--- a/app/proprietary/src/main/java/stirling/software/proprietary/workflow/controller/SigningSessionController.java
+++ b/app/proprietary/src/main/java/stirling/software/proprietary/workflow/controller/SigningSessionController.java
@@ -47,7 +47,9 @@ import stirling.software.proprietary.workflow.service.WorkflowSessionService;
 @Slf4j
 @RestController
 @RequestMapping("/api/v1/security")
-@Tag(name = "Security", description = "Security APIs - Signing Workflows")
+@Tag(
+        name = "Signing Sessions",
+        description = "Signing session lifecycle and participant management")
 @RequiredArgsConstructor
 public class SigningSessionController {
 
diff --git a/app/proprietary/src/test/java/stirling/software/proprietary/service/AiWorkflowServiceTest.java b/app/proprietary/src/test/java/stirling/software/proprietary/service/AiWorkflowServiceTest.java
new file mode 100644
index 0000000000..2872e0db91
--- /dev/null
+++ b/app/proprietary/src/test/java/stirling/software/proprietary/service/AiWorkflowServiceTest.java
@@ -0,0 +1,335 @@
+package stirling.software.proprietary.service;
+
+import static org.junit.jupiter.api.Assertions.assertEquals;
+import static org.junit.jupiter.api.Assertions.assertNotNull;
+import static org.mockito.ArgumentMatchers.any;
+import static org.mockito.ArgumentMatchers.anyString;
+import static org.mockito.ArgumentMatchers.eq;
+import static org.mockito.Mockito.never;
+import static org.mockito.Mockito.times;
+import static org.mockito.Mockito.verify;
+import static org.mockito.Mockito.when;
+
+import java.io.ByteArrayInputStream;
+import java.io.ByteArrayOutputStream;
+import java.io.IOException;
+import java.io.InputStream;
+import java.nio.file.Path;
+import java.util.ArrayList;
+import java.util.List;
+import java.util.concurrent.atomic.AtomicInteger;
+import java.util.zip.ZipEntry;
+import java.util.zip.ZipOutputStream;
+
+import org.junit.jupiter.api.BeforeEach;
+import org.junit.jupiter.api.Test;
+import org.junit.jupiter.api.extension.ExtendWith;
+import org.junit.jupiter.api.io.TempDir;
+import org.mockito.Mock;
+import org.mockito.junit.jupiter.MockitoExtension;
+import org.springframework.core.io.ByteArrayResource;
+import org.springframework.core.io.Resource;
+import org.springframework.http.ResponseEntity;
+import org.springframework.mock.web.MockMultipartFile;
+import org.springframework.util.MultiValueMap;
+
+import stirling.software.common.model.ApplicationProperties;
+import stirling.software.common.service.CustomPDFDocumentFactory;
+import stirling.software.common.service.FileStorage;
+import stirling.software.common.service.FileStorage.StoredFile;
+import stirling.software.common.service.InternalApiClient;
+import stirling.software.common.service.ToolMetadataService;
+import stirling.software.common.util.TempFileManager;
+import stirling.software.common.util.TempFileRegistry;
+import stirling.software.proprietary.model.api.ai.AiWorkflowFileInput;
+import stirling.software.proprietary.model.api.ai.AiWorkflowOutcome;
+import stirling.software.proprietary.model.api.ai.AiWorkflowRequest;
+import stirling.software.proprietary.model.api.ai.AiWorkflowResponse;
+
+import tools.jackson.databind.ObjectMapper;
+import tools.jackson.databind.json.JsonMapper;
+
+/**
+ * Smoke tests for {@link AiWorkflowService}. Covers the TOOL_CALL and PLAN execution paths,
+ * ZIP-response unpacking (split endpoints), multi-input dispatch (merge endpoints), and the 1:1
+ * input-to-output filename preservation rule.
+ *
+ * <p>External collaborators (engine client, internal API client, tool metadata, file storage) are
+ * mocked. {@link TempFileManager} is constructed with a real in-test registry so the service's
+ * temp-file handling exercises real code.
+ */
+@ExtendWith(MockitoExtension.class)
+class AiWorkflowServiceTest {
+
+    private static final String ROTATE_ENDPOINT = "/api/v1/general/rotate-pdf";
+    private static final String SPLIT_ENDPOINT = "/api/v1/general/split-pages";
+    private static final String MERGE_ENDPOINT = "/api/v1/general/merge-pdfs";
+    private static final String COMPRESS_ENDPOINT = "/api/v1/misc/compress-pdf";
+
+    @Mock private CustomPDFDocumentFactory pdfDocumentFactory;
+    @Mock private AiEngineClient aiEngineClient;
+    @Mock private PdfContentExtractor pdfContentExtractor;
+    @Mock private InternalApiClient internalApiClient;
+    @Mock private FileStorage fileStorage;
+    @Mock private ToolMetadataService toolMetadataService;
+
+    @TempDir Path tempDir;
+
+    private TempFileManager tempFileManager;
+    private ObjectMapper objectMapper;
+    private AiWorkflowService service;
+
+    @BeforeEach
+    void setUp() {
+        ApplicationProperties props = new ApplicationProperties();
+        props.getSystem().getTempFileManagement().setBaseTmpDir(tempDir.toString());
+        props.getSystem().getTempFileManagement().setPrefix("ai-test-");
+        tempFileManager = new TempFileManager(new TempFileRegistry(), props);
+        objectMapper = JsonMapper.builder().build();
+
+        service =
+                new AiWorkflowService(
+                        pdfDocumentFactory,
+                        aiEngineClient,
+                        pdfContentExtractor,
+                        objectMapper,
+                        internalApiClient,
+                        fileStorage,
+                        toolMetadataService,
+                        tempFileManager);
+    }
+
+    @Test
+    void toolCallSingleFilePreservesInputFilename() throws IOException {
+        MockMultipartFile input = pdf("input.pdf", "original-pdf-bytes");
+        stubOrchestrator(
+                """
+                {"outcome":"tool_call","tool":"%s","parameters":{"angle":90},"rationale":"Rotating"}
+                """
+                        .formatted(ROTATE_ENDPOINT));
+        when(toolMetadataService.isMultiInput(ROTATE_ENDPOINT)).thenReturn(false);
+        when(toolMetadataService.shouldUnpackZipResponse(ROTATE_ENDPOINT)).thenReturn(false);
+        stubEndpoint(ROTATE_ENDPOINT, pdfResource("rotated-bytes", "rotated.pdf"));
+        AtomicInteger ids = stubFileStorage();
+
+        AiWorkflowResponse result = service.orchestrate(requestFor(input, "rotate 90"));
+
+        assertEquals(AiWorkflowOutcome.COMPLETED, result.getOutcome());
+        assertEquals(1, result.getResultFiles().size());
+        // 1:1 mapping — the single output should inherit the single input's filename.
+        assertEquals("input.pdf", result.getResultFiles().get(0).getFileName());
+        assertEquals("file-1", result.getResultFiles().get(0).getFileId());
+        assertEquals(1, ids.get());
+        verify(internalApiClient, times(1)).post(eq(ROTATE_ENDPOINT), any());
+    }
+
+    @Test
+    void toolCallZipResponseUnpacksIntoMultipleResults() throws IOException {
+        MockMultipartFile input = pdf("doc.pdf", "original");
+        stubOrchestrator(
+                """
+                {"outcome":"tool_call","tool":"%s","parameters":{},"rationale":"Splitting"}
+                """
+                        .formatted(SPLIT_ENDPOINT));
+        when(toolMetadataService.isMultiInput(SPLIT_ENDPOINT)).thenReturn(false);
+        when(toolMetadataService.shouldUnpackZipResponse(SPLIT_ENDPOINT)).thenReturn(true);
+        stubEndpoint(
+                SPLIT_ENDPOINT,
+                zipResource(
+                        "doc.zip",
+                        List.of(
+                                new ZipEntryBytes("page-1.pdf", "page-one"),
+                                new ZipEntryBytes("page-2.pdf", "page-two"),
+                                new ZipEntryBytes("page-3.pdf", "page-three"))));
+        stubFileStorage();
+
+        AiWorkflowResponse result = service.orchestrate(requestFor(input, "split"));
+
+        assertEquals(AiWorkflowOutcome.COMPLETED, result.getOutcome());
+        assertEquals(3, result.getResultFiles().size());
+        // Input count (1) != output count (3) so the per-entry filename is kept.
+        assertEquals("page-1.pdf", result.getResultFiles().get(0).getFileName());
+        assertEquals("page-2.pdf", result.getResultFiles().get(1).getFileName());
+        assertEquals("page-3.pdf", result.getResultFiles().get(2).getFileName());
+    }
+
+    @Test
+    void multiInputEndpointIsCalledOnceWithAllFiles() throws IOException {
+        MockMultipartFile a = pdf("a.pdf", "a-bytes");
+        MockMultipartFile b = pdf("b.pdf", "b-bytes");
+        stubOrchestrator(
+                """
+                {"outcome":"tool_call","tool":"%s","parameters":{},"rationale":"Merging"}
+                """
+                        .formatted(MERGE_ENDPOINT));
+        when(toolMetadataService.isMultiInput(MERGE_ENDPOINT)).thenReturn(true);
+        when(toolMetadataService.shouldUnpackZipResponse(MERGE_ENDPOINT)).thenReturn(false);
+        stubEndpoint(MERGE_ENDPOINT, pdfResource("merged-bytes", "merged.pdf"));
+        stubFileStorage();
+
+        AiWorkflowResponse result =
+                service.orchestrate(requestFor(new MockMultipartFile[] {a, b}, "merge these"));
+
+        assertEquals(AiWorkflowOutcome.COMPLETED, result.getOutcome());
+        assertEquals(1, result.getResultFiles().size());
+        // Two inputs but only one output → filename is not preserved from either input.
+        assertEquals("merged.pdf", result.getResultFiles().get(0).getFileName());
+        verify(internalApiClient, times(1)).post(eq(MERGE_ENDPOINT), any());
+    }
+
+    @Test
+    void singleInputEndpointIsCalledOncePerFile() throws IOException {
+        MockMultipartFile a = pdf("a.pdf", "a-bytes");
+        MockMultipartFile b = pdf("b.pdf", "b-bytes");
+        stubOrchestrator(
+                """
+                {"outcome":"tool_call","tool":"%s","parameters":{"angle":90},"rationale":"Rotating"}
+                """
+                        .formatted(ROTATE_ENDPOINT));
+        when(toolMetadataService.isMultiInput(ROTATE_ENDPOINT)).thenReturn(false);
+        when(toolMetadataService.shouldUnpackZipResponse(ROTATE_ENDPOINT)).thenReturn(false);
+        stubEndpoint(ROTATE_ENDPOINT, pdfResource("rotated", "rotated.pdf"));
+        stubFileStorage();
+
+        AiWorkflowResponse result =
+                service.orchestrate(requestFor(new MockMultipartFile[] {a, b}, "rotate both"));
+
+        assertEquals(AiWorkflowOutcome.COMPLETED, result.getOutcome());
+        assertEquals(2, result.getResultFiles().size());
+        // Per-file loop dispatches one call per input file.
+        verify(internalApiClient, times(2)).post(eq(ROTATE_ENDPOINT), any());
+        // 1:1 mapping preserves each input's filename.
+        assertEquals("a.pdf", result.getResultFiles().get(0).getFileName());
+        assertEquals("b.pdf", result.getResultFiles().get(1).getFileName());
+    }
+
+    @Test
+    void planExecutesStepsSequentially() throws IOException {
+        MockMultipartFile input = pdf("input.pdf", "bytes");
+        stubOrchestrator(
+                """
+                {
+                  "outcome":"plan",
+                  "summary":"Rotate then compress",
+                  "steps":[
+                    {"tool":"%s","parameters":{"angle":90}},
+                    {"tool":"%s","parameters":{}}
+                  ]
+                }
+                """
+                        .formatted(ROTATE_ENDPOINT, COMPRESS_ENDPOINT));
+        when(toolMetadataService.isMultiInput(anyString())).thenReturn(false);
+        when(toolMetadataService.shouldUnpackZipResponse(anyString())).thenReturn(false);
+        stubEndpoint(ROTATE_ENDPOINT, pdfResource("rotated", "rotated.pdf"));
+        stubEndpoint(COMPRESS_ENDPOINT, pdfResource("compressed", "compressed.pdf"));
+        stubFileStorage();
+
+        AiWorkflowResponse result = service.orchestrate(requestFor(input, "rotate and compress"));
+
+        assertEquals(AiWorkflowOutcome.COMPLETED, result.getOutcome());
+        assertEquals(1, result.getResultFiles().size());
+        // 1:1 input → output mapping at the plan level preserves the input's filename.
+        assertEquals("input.pdf", result.getResultFiles().get(0).getFileName());
+        verify(internalApiClient, times(1)).post(eq(ROTATE_ENDPOINT), any());
+        verify(internalApiClient, times(1)).post(eq(COMPRESS_ENDPOINT), any());
+    }
+
+    @Test
+    void toolCallWithoutEndpointFallsBackToCannotContinue() throws IOException {
+        MockMultipartFile input = pdf("input.pdf", "bytes");
+        stubOrchestrator("{\"outcome\":\"tool_call\",\"parameters\":{}}");
+
+        AiWorkflowResponse result = service.orchestrate(requestFor(input, "do something"));
+
+        assertEquals(AiWorkflowOutcome.CANNOT_CONTINUE, result.getOutcome());
+        assertNotNull(result.getReason());
+        verify(internalApiClient, never()).post(anyString(), any());
+    }
+
+    // --- helpers ---
+
+    private void stubOrchestrator(String responseJson) throws IOException {
+        when(aiEngineClient.post(eq("/api/v1/orchestrator"), anyString())).thenReturn(responseJson);
+    }
+
+    private void stubEndpoint(String endpoint, Resource body) {
+        when(internalApiClient.post(eq(endpoint), any(MultiValueMap.class)))
+                .thenReturn(ResponseEntity.ok(body));
+    }
+
+    /**
+     * Stub {@link FileStorage#storeInputStream} with sequential file IDs and an accurate byte
+     * count. Returns the counter so tests can assert how many stores happened.
+     */
+    private AtomicInteger stubFileStorage() throws IOException {
+        AtomicInteger counter = new AtomicInteger();
+        when(fileStorage.storeInputStream(any(InputStream.class), anyString()))
+                .thenAnswer(
+                        inv -> {
+                            InputStream is = inv.getArgument(0);
+                            long size = is.readAllBytes().length;
+                            return new StoredFile("file-" + counter.incrementAndGet(), size);
+                        });
+        return counter;
+    }
+
+    private static MockMultipartFile pdf(String filename, String content) {
+        return new MockMultipartFile("fileInput", filename, "application/pdf", content.getBytes());
+    }
+
+    private static AiWorkflowRequest requestFor(MockMultipartFile file, String message) {
+        return requestFor(new MockMultipartFile[] {file}, message);
+    }
+
+    private static AiWorkflowRequest requestFor(MockMultipartFile[] files, String message) {
+        AiWorkflowRequest request = new AiWorkflowRequest();
+        List<AiWorkflowFileInput> inputs = new ArrayList<>();
+        for (MockMultipartFile file : files) {
+            AiWorkflowFileInput fileInput = new AiWorkflowFileInput();
+            fileInput.setFileInput(file);
+            inputs.add(fileInput);
+        }
+        request.setFileInputs(inputs);
+        request.setUserMessage(message);
+        return request;
+    }
+
+    private static ByteArrayResource pdfResource(String content, String filename) {
+        return new ByteArrayResource(content.getBytes()) {
+            @Override
+            public String getFilename() {
+                return filename;
+            }
+        };
+    }
+
+    private static ByteArrayResource zipResource(String filename, List<ZipEntryBytes> entries)
+            throws IOException {
+        ByteArrayOutputStream baos = new ByteArrayOutputStream();
+        try (ZipOutputStream zos = new ZipOutputStream(baos)) {
+            for (ZipEntryBytes entry : entries) {
+                zos.putNextEntry(new ZipEntry(entry.name()));
+                zos.write(entry.bytes());
+                zos.closeEntry();
+            }
+        }
+        byte[] zipBytes = baos.toByteArray();
+        return new ByteArrayResource(zipBytes) {
+            @Override
+            public String getFilename() {
+                return filename;
+            }
+
+            @Override
+            public InputStream getInputStream() {
+                return new ByteArrayInputStream(zipBytes);
+            }
+        };
+    }
+
+    private record ZipEntryBytes(String name, byte[] bytes) {
+        ZipEntryBytes(String name, String content) {
+            this(name, content.getBytes());
+        }
+    }
+}
diff --git a/build.gradle b/build.gradle
index b41c54e3b8..0721c37baa 100644
--- a/build.gradle
+++ b/build.gradle
@@ -2,13 +2,13 @@ plugins {
     id "java"
     id "jacoco"
     id "io.spring.dependency-management" version "1.1.7"
-    id "org.springframework.boot" version "4.0.3"
+    id "org.springframework.boot" version "4.0.5"
     id "org.springdoc.openapi-gradle-plugin" version "1.9.0"
     id "io.swagger.swaggerhub" version "1.3.2"
-    id "com.diffplug.spotless" version "8.1.0"
-    id "com.github.jk1.dependency-license-report" version "3.0.1"
+    id "com.diffplug.spotless" version "8.4.0"
+    id "com.github.jk1.dependency-license-report" version "3.1.1"
     //id "nebula.lint" version "19.0.3"
-    id "org.sonarqube" version "7.2.2.6593"
+    id "org.sonarqube" version "7.2.3.7755"
 }
 
 import com.github.jk1.license.render.*
@@ -20,17 +20,17 @@ import org.gradle.api.tasks.testing.Test
 import org.gradle.jvm.toolchain.JavaLanguageVersion
 
 ext {
-    springBootVersion = "4.0.3"
+    springBootVersion = "4.0.5"
     pdfboxVersion = "3.0.7"
     imageioVersion = "3.13.1"
-    lombokVersion = "1.18.42"
+    lombokVersion = "1.18.44"
     bouncycastleVersion = "1.83"
-    springSecuritySamlVersion = "7.0.2"
+    springSecuritySamlVersion = "7.0.4"
     openSamlVersion = "5.2.1"
-    commonmarkVersion = "0.27.1"
-    googleJavaFormatVersion = "1.35.0"
+    commonmarkVersion = "0.28.0"
+    googleJavaFormatVersion = "1.28.0"
     logback = "1.5.32"
-    junitPlatformVersion = "1.12.2"
+    // junit-platform-launcher version managed by Spring Boot BOM
     modernJavaVersion = 21
 }
 
@@ -78,7 +78,7 @@ springBoot {
 
 allprojects {
     group = 'stirling.software'
-    version = '2.8.0'
+    version = '2.9.2'
 
     configurations.configureEach {
         exclude group: "org.springframework.boot", module: "spring-boot-starter-tomcat"
@@ -110,11 +110,11 @@ tasks.register('syncAppVersion') {
         [new File(sim1Path), new File(sim2Path)].each { f ->
             if (f.exists()) {
                 def content = f.getText('UTF-8')
-                def matcher = (content =~ /(appVersion:\s*')([^']*)(')/)
+                def matcher = (content =~ /(appVersion:\s*(['"]))(.*?)(\2)/)
                 if (!matcher.find()) {
                     throw new GradleException("Could not locate appVersion in ${f} for synchronization")
                 }
-                def updatedContent = matcher.replaceFirst("${matcher.group(1)}${appVersionStr}${matcher.group(3)}")
+                def updatedContent = matcher.replaceFirst("${matcher.group(1)}${appVersionStr}${matcher.group(4)}")
                 if (content != updatedContent) {
                     f.write(updatedContent, 'UTF-8')
                 }
@@ -198,6 +198,10 @@ subprojects {
         imports {
             mavenBom "org.springframework.boot:spring-boot-dependencies:$springBootVersion"
         }
+        dependencies {
+            // Override BOM-managed commons-lang3 for CVE-2025-48924 fix
+            dependency 'org.apache.commons:commons-lang3:3.20.0'
+        }
     }
 
     dependencies {
@@ -523,7 +527,7 @@ dependencies {
     }
 
     testImplementation 'org.springframework.boot:spring-boot-starter-test'
-    testRuntimeOnly "org.junit.platform:junit-platform-launcher:$junitPlatformVersion"
+    testRuntimeOnly "org.junit.platform:junit-platform-launcher"
 
     testImplementation platform("com.squareup.okhttp3:okhttp-bom:5.3.2")
     testImplementation "com.squareup.okhttp3:mockwebserver"
diff --git a/devGuide/DeveloperGuide.md b/devGuide/DeveloperGuide.md
index 034a475c5f..964992927e 100644
--- a/devGuide/DeveloperGuide.md
+++ b/devGuide/DeveloperGuide.md
@@ -1,442 +1,5 @@
-# Stirling-PDF Developer Guide
+# Developer Guide
 
-## 1. Introduction
+This guide has moved to the repository root for easier discovery.
 
-Stirling-PDF is a robust, locally hosted, web-based PDF manipulation tool. This guide focuses on Docker-based development and testing, which is the recommended approach for working with the full version of Stirling-PDF.
-
-## 2. Project Overview
-
-Stirling-PDF is built using:
-
-- Spring Boot
-- PDFBox
-- LibreOffice
-- qpdf
-- Calibre (`ebook-convert` CLI) for eBook conversions
-- HTML, CSS, JavaScript
-- Docker
-- PDF.js
-- PDF-LIB.js
-- Lombok
-
-## 3. Development Environment Setup
-
-### Prerequisites
-
-- Docker
-- Git
-- Java JDK 21 or later (JDK 25 recommended)
-- Gradle 7.0 or later (Included within the repo)
-
-### Setup Steps
-
-1. Clone the repository:
-
-   ```bash
-   git clone https://github.com/Stirling-Tools/Stirling-PDF.git
-   cd Stirling-PDF
-   ```
-
-2. Install Docker and JDK 21 (or JDK 25 recommended) if not already installed.
-
-3. Install a recommended Java IDE such as Eclipse, IntelliJ, or VSCode
-   1. Only VSCode
-      1. Open VS Code.
-      2. When prompted, install the recommended extensions.
-      3. Alternatively, open the command palette (`Ctrl + Shift + P` or `Cmd + Shift + P` on macOS) and run:
-
-        ```sh
-        Extensions: Show Recommended Extensions
-        ```
-
-      4. Install the required extensions from the list.
-
-4. Lombok Setup
-Stirling-PDF uses Lombok to reduce boilerplate code. Some IDEs, like Eclipse, don't support Lombok out of the box. To set up Lombok in your development environment:
-Visit the [Lombok website](https://projectlombok.org/setup/) for installation instructions specific to your IDE.
-
-5. Install Calibre CLI (optional but required for eBook conversions)
-   Ensure the `ebook-convert` binary from Calibre is available on your PATH when working on the
-   eBook to PDF feature. The Calibre tool group is automatically disabled when the binary is
-   missing, so having it installed locally allows you to exercise the full workflow.
-
-6. Add environment variable
-For local testing, you should generally be testing the full 'Security' version of Stirling PDF. To do this, you must add the environment flag DISABLE_ADDITIONAL_FEATURES=false to your system and/or IDE build/run step.
-
-## 4. Project Structure
-
-```bash
-Stirling-PDF/
-├── .github/               # GitHub-specific files (workflows, issue templates)
-├── configs/               # Configuration files used by stirling at runtime (generated at runtime)
-├── cucumber/              # Cucumber test files
-│   ├── features/
-├── customFiles/           # Custom static files and templates (generated at runtime used to replace existing files)
-├── docs/                  # Documentation files
-├── exampleYmlFiles/       # Example YAML configuration files
-├── images/                # Image assets
-├── pipeline/              # Pipeline-related files (generated at runtime)
-├── scripts/               # Utility scripts
-├── src/                   # Source code
-│   ├── main/
-│   │   ├── java/
-│   │   │   └── stirling/
-│   │   │       └── software/
-│   │   │           └── SPDF/
-│   │   │               ├── config/
-│   │   │               ├── controller/
-│   │   │               ├── model/
-│   │   │               ├── repository/
-│   │   │               ├── service/
-│   │   │               └── utils/
-│   │   └── resources/
-│   │       ├── static/
-│   │       │   ├── css/
-│   │       │   ├── js/
-│   │       │   └── pdfjs/
-│   └── test/
-│       └── java/
-│           └── stirling/
-│               └── software/
-│                   └── SPDF/
-├── build.gradle           # Gradle build configuration
-├── Dockerfile             # Main Dockerfile
-├── Dockerfile.ultra-lite  # Dockerfile for ultra-lite version
-├── Dockerfile.fat         # Dockerfile for fat version
-├── docker-compose.yml     # Docker Compose configuration
-└── test.sh                # Test script to deploy all docker versions and run cuke tests
-```
-
-## 5. Docker-based Development
-
-Stirling-PDF offers several Docker versions:
-
-- Full: All features included
-- Ultra-Lite: Basic PDF operations only
-- Fat: Includes additional libraries and fonts predownloaded
-
-### Example Docker Compose Files
-
-Stirling-PDF provides several example Docker Compose files in the `exampleYmlFiles` directory, such as:
-
-- `docker-compose-latest.yml`: Latest version without login and security features
-- `docker-compose-latest-security.yml`: Latest version with login and security features enabled
-- `docker-compose-latest-fat-security.yml`: Fat version with login and security features enabled
-
-These files provide pre-configured setups for different scenarios. For example, here's a snippet from `docker-compose-latest-security.yml`:
-
-```yaml
-services:
-  stirling-pdf:
-    container_name: Stirling-PDF-Security
-    image: docker.stirlingpdf.com/stirlingtools/stirling-pdf:latest
-    deploy:
-      resources:
-        limits:
-          memory: 4G
-    healthcheck:
-      test: ["CMD-SHELL", "curl -f http://localhost:8080/api/v1/info/status | grep -q 'UP' && curl -fL http://localhost:8080/ | grep -q 'Please sign in'"]
-      interval: 5s
-      timeout: 10s
-      retries: 16
-    ports:
-      - "8080:8080"
-    volumes:
-      - ./stirling/latest/data:/usr/share/tessdata:rw
-      - ./stirling/latest/config:/configs:rw
-      - ./stirling/latest/logs:/logs:rw
-    environment:
-      DISABLE_ADDITIONAL_FEATURES: "false"
-      SECURITY_ENABLELOGIN: "true"
-      PUID: 1002
-      PGID: 1002
-      UMASK: "022"
-      SYSTEM_DEFAULTLOCALE: en-US
-      UI_APPNAME: Stirling-PDF
-      UI_HOMEDESCRIPTION: Demo site for Stirling-PDF Latest with Security
-      UI_APPNAMENAVBAR: Stirling-PDF Latest
-      SYSTEM_MAXFILESIZE: "100"
-      METRICS_ENABLED: "true"
-      SYSTEM_GOOGLEVISIBILITY: "true"
-      SHOW_SURVEY: "true"
-    restart: on-failure:5
-```
-
-To use these example files, copy the desired file to your project root and rename it to `docker-compose.yml`, or specify the file explicitly when running Docker Compose:
-
-```bash
-docker-compose -f exampleYmlFiles/docker-compose-latest-security.yml up
-```
-
-### Building Docker Images
-
-Stirling-PDF uses different Docker images for various configurations. The build process is controlled by environment variables and uses specific Dockerfile variants. Here's how to build the Docker images:
-
-1. Set the security environment variable:
-
-   ```bash
-   export DISABLE_ADDITIONAL_FEATURES=true  # or false for to enable login and security features for builds
-   ```
-
-2. Build the project with Gradle:
-
-   ```bash
-   ./gradlew clean build
-   ```
-
-3. Build the Docker images:
-
-   For the latest version:
-
-   ```bash
-   docker build --no-cache --pull --build-arg VERSION_TAG=alpha -t stirlingtools/stirling-pdf:latest -f ./Dockerfile .
-   ```
-
-   For the ultra-lite version:
-
-   ```bash
-   docker build --no-cache --pull --build-arg VERSION_TAG=alpha -t stirlingtools/stirling-pdf:latest-ultra-lite -f ./Dockerfile.ultra-lite .
-   ```
-
-   For the fat version (with login and security features enabled):
-
-   ```bash
-   export DISABLE_ADDITIONAL_FEATURES=false
-   docker build --no-cache --pull --build-arg VERSION_TAG=alpha -t stirlingtools/stirling-pdf:latest-fat -f ./Dockerfile.fat .
-   ```
-
-Note: The `--no-cache` and `--pull` flags ensure that the build process uses the latest base images and doesn't use cached layers, which is useful for testing and ensuring reproducible builds. however to improve build times these can often be removed depending on your usecase
-
-## 6. Testing
-
-### Comprehensive Testing Script
-
-Stirling-PDF provides a `test.sh` script in the root directory. This script builds all versions of Stirling-PDF, checks that each version works, and runs Cucumber tests. It's recommended to run this script before submitting a final pull request.
-
-To run the test script:
-
-```bash
-./test.sh
-```
-
-This script performs the following actions:
-
-1. Builds all Docker images (full, ultra-lite, fat).
-2. Runs each version to ensure it starts correctly.
-3. Executes Cucumber tests against the main version and ensures feature compatibility. In the event these tests fail, your PR will not be merged.
-
-Note: The `test.sh` script will run automatically when you raise a PR. However, it's recommended to run it locally first to save resources and catch any issues early.
-
-### Full Testing with Docker
-
-1. Build and run the Docker container per the above instructions:
-
-2. Access the application at `http://localhost:8080` and manually test all features developed.
-
-### Local Testing (Java and UI Components)
-
-For quick iterations and development of Java backend, JavaScript, and UI components, you can run and test Stirling-PDF locally without Docker. This approach allows you to work on and verify changes to:
-
-- Java backend logic
-- RESTful API endpoints
-- JavaScript functionality
-- User interface components and styling
-
-To run Stirling-PDF locally:
-
-1. Compile and run the project using built-in IDE methods or by running:
-
-   ```bash
-   ./gradlew bootRun
-   ```
-
-2. Access the application at `http://localhost:8080` in your web browser.
-
-3. Manually test the features you're working on through the UI.
-
-4. For API changes, use tools like Postman or curl to test endpoints directly.
-
-Important notes:
-
-- Local testing doesn't include features that depend on external tools like qpdf, LibreOffice, or Python scripts.
-- There are currently no automated unit tests. All testing is done manually through the UI or API calls. (You are welcome to add JUnits!)
-- Always verify your changes in the full Docker environment before submitting pull requests, as some integrations and features will only work in the complete setup.
-
-## 7. Contributing
-
-1. Fork the repository on GitHub.
-2. Create a new branch for your feature or bug fix.
-3. Make your changes and commit them with clear, descriptive messages and ensure any documentation is updated related to your changes.
-4. Test your changes thoroughly in the Docker environment.
-5. Run the `test.sh` script to ensure all versions build correctly and pass the Cucumber tests:
-
-   ```bash
-   ./test.sh
-   ```
-
-6. Push your changes to your fork.
-7. Submit a pull request to the main repository.
-8. See additional [contributing guidelines](../CONTRIBUTING.md).
-
-When you raise a PR:
-
-- The `test.sh` script will run automatically against your PR.
-- The PR checks will verify versioning and dependency updates.
-- Documentation will be automatically updated for dependency changes.
-- Security issues will be checked using Snyk and PixeeBot.
-
-Address any issues that arise from these checks before finalizing your pull request.
-
-## 8. API Documentation
-
-API documentation is available at `/swagger-ui/index.html` when running the application. You can also view the latest API documentation [here](https://app.swaggerhub.com/apis-docs/Stirling-Tools/Stirling-PDF/).
-
-## 9. Customization
-
-Stirling-PDF can be customized through environment variables or a `settings.yml` file. Key customization options include:
-
-- Application name and branding
-- Security settings
-- UI customization
-- Endpoint management
-- Maximum DPI for PDF to image conversion (`system.maxDPI`)
-
-When using Docker, pass environment variables using the `-e` flag or in your `docker-compose.yml` file.
-
-Example:
-
-```bash
-docker run -p 8080:8080 -e APP_NAME="My PDF Tool" stirling-pdf:full
-```
-
-Refer to the main README for a full list of customization options.
-
-## 10. Language Translations
-
-For managing language translations that affect multiple files, Stirling-PDF provides a helper script:
-
-```bash
-/scripts/replace_translation_line.sh
-```
-
-This script helps you make consistent replacements across language files.
-
-When contributing translations:
-
-1. Use the helper script for multi-file changes.
-2. Ensure all language files are updated consistently.
-3. The PR checks will verify consistency in language file updates.
-
-Remember to test your changes thoroughly to ensure they don't break any existing functionality.
-
-## Code examples
-
-### Adding a New Feature to the Backend (API)
-
-1. **Create a New Controller:**
-   - Create a new Java class in the `app/core/src/main/java/stirling/software/SPDF/controller/api` directory.
-   - Annotate the class with `@RestController` and `@RequestMapping` to define the API endpoint.
-   - Ensure to add API documentation annotations like `@Tag(name = "General", description = "General APIs")` and `@Operation(summary = "Crops a PDF document", description = "This operation takes an input PDF file and crops it according to the given coordinates. Input:PDF Output:PDF Type:SISO")`.
-
-   ```java
-   package stirling.software.SPDF.controller.api;
-
-   import org.springframework.web.bind.annotation.GetMapping;
-   import org.springframework.web.bind.annotation.RequestMapping;
-   import org.springframework.web.bind.annotation.RestController;
-   import io.swagger.v3.oas.annotations.Operation;
-   import io.swagger.v3.oas.annotations.tags.Tag;
-
-   @RestController
-   @RequestMapping("/api/v1/new-feature")
-   @Tag(name = "General", description = "General APIs")
-   public class NewFeatureController {
-
-       @GetMapping
-       @Operation(summary = "New Feature", description = "This is a new feature endpoint.")
-       public String newFeature() {
-           return "NewFeatureResponse";
-       }
-   }
-   ```
-
-2. **Define the Service Layer:** (Not required but often useful)
-   - Create a new service class in the `app/core/src/main/java/stirling/software/SPDF/service` directory.
-   - Implement the business logic for the new feature.
-
-   ```java
-   package stirling.software.SPDF.service;
-
-   import org.springframework.stereotype.Service;
-
-   @Service
-   public class NewFeatureService {
-
-       public String getNewFeatureData() {
-           // Implement business logic here
-           return "New Feature Data";
-       }
-   }
-   ```
-
-2b. **Integrate the Service with the Controller:**
-
-- Autowire the service class in the controller and use it to handle the API request.
-
-  ```java
-  package stirling.software.SPDF.controller.api;
-
-  import org.springframework.beans.factory.annotation.Autowired;
-  import org.springframework.web.bind.annotation.GetMapping;
-  import org.springframework.web.bind.annotation.RequestMapping;
-  import org.springframework.web.bind.annotation.RestController;
-  import stirling.software.SPDF.service.NewFeatureService;
-  import io.swagger.v3.oas.annotations.Operation;
-  import io.swagger.v3.oas.annotations.tags.Tag;
-
-  @RestController
-  @RequestMapping("/api/v1/new-feature")
-  @Tag(name = "General", description = "General APIs")
-  public class NewFeatureController {
-
-      @Autowired
-      private NewFeatureService newFeatureService;
-
-      @GetMapping
-      @Operation(summary = "New Feature", description = "This is a new feature endpoint.")
-      public String newFeature() {
-          return newFeatureService.getNewFeatureData();
-      }
-  }
-  ```
-
-## Adding New Translations to Existing Language Files in Stirling-PDF
-
-When adding a new feature or modifying existing ones in Stirling-PDF, you'll need to add new translation entries to the existing language files. Here's a step-by-step guide:
-
-### 1. Locate Existing Language Files
-
-Find the existing `messages.properties` files in the `app/core/src/main/resources` directory. You'll see files like:
-
-- `messages.properties` (default, usually English)
-- `messages_en_GB.properties`
-- `messages_fr_FR.properties`
-- `messages_de_DE.properties`
-- etc.
-
-### 2. Add New Translation Entries
-
-Open each of these files and add your new translation entries. For example, if you're adding a new feature called "PDF Splitter",
-Use descriptive, hierarchical keys (e.g., `feature.element.description`)
-you might add:
-
-```properties
-pdfSplitter.title=PDF Splitter
-pdfSplitter.description=Split your PDF into multiple documents
-pdfSplitter.button.split=Split PDF
-pdfSplitter.input.pages=Enter page numbers to split
-```
-
-Add these entries to the default GB language file and any others you wish, translating the values as appropriate for each language.
-
-Remember, never hard-code text in your templates or Java code. Always use translation keys to ensure proper localization.
+**See [DeveloperGuide.md](../DeveloperGuide.md) for the current developer guide.**
diff --git a/devGuide/README.md b/devGuide/README.md
index f58f6e5d19..5c8f60577b 100644
--- a/devGuide/README.md
+++ b/devGuide/README.md
@@ -5,7 +5,8 @@ This directory contains all development-related documentation for Stirling PDF.
 ## 📚 Documentation Index
 
 ### Core Development
-- **[DeveloperGuide.md](./DeveloperGuide.md)** - Main developer setup and architecture guide
+- **[DeveloperGuide.md](../DeveloperGuide.md)** - Main developer setup and architecture guide (in repo root)
+- **[Taskfile.yml](../Taskfile.yml)** - Unified task runner for all build/dev/test/lint commands
 - **[EXCEPTION_HANDLING_GUIDE.md](./EXCEPTION_HANDLING_GUIDE.md)** - Exception handling patterns and i18n best practices
 - **[HowToAddNewLanguage.md](./HowToAddNewLanguage.md)** - Internationalization and translation guide
 
diff --git a/docker/README.md b/docker/README.md
index 99b86b53ea..d0a1535fff 100644
--- a/docker/README.md
+++ b/docker/README.md
@@ -2,6 +2,23 @@
 
 This directory contains the organized Docker configurations for the split frontend/backend architecture.
 
+## Using Taskfile (Recommended)
+
+All Docker commands can be run from the project root using [Task](https://taskfile.dev/):
+
+```bash
+task docker:build            # Build standard image
+task docker:build:fat        # Build fat image (all features)
+task docker:build:ultra-lite # Build ultra-lite image
+task docker:build:frontend   # Build frontend-only image
+task docker:build:engine     # Build engine image
+task docker:up               # Start standard compose stack
+task docker:up:fat           # Start fat compose stack
+task docker:up:ultra-lite    # Start ultra-lite compose stack
+task docker:down             # Stop all running stacks
+task docker:logs             # Tail compose logs
+```
+
 ## Directory Structure
 
 ```
diff --git a/docker/base/Dockerfile b/docker/base/Dockerfile
index dfd64ee705..acb6d5a9f5 100644
--- a/docker/base/Dockerfile
+++ b/docker/base/Dockerfile
@@ -385,8 +385,10 @@ RUN --mount=type=cache,target=/var/cache/apt,sharing=locked \
     apt-get install -y --no-install-recommends \
       # Core tools
       ca-certificates tzdata tini bash fontconfig curl \
-      ffmpeg poppler-utils fontforge \
-      gosu unpaper pngquant \
+      # ffmpeg disabled due to raised CVEs
+      # ffmpeg \
+      poppler-utils fontforge \
+      unpaper pngquant \
       # Fonts: full coverage for standard + fat variants
       fonts-dejavu \
       fonts-liberation2 \
@@ -622,8 +624,7 @@ RUN set -eux; \
         -d /home/stirlingpdfuser -s /bin/bash stirlingpdfuser 2>/dev/null \
         || useradd -m -g stirlingpdfgroup \
           -d /home/stirlingpdfuser -s /bin/bash stirlingpdfuser; \
-    fi; \
-    ln -sf /usr/sbin/gosu /usr/local/bin/su-exec
+    fi
 
 # Application directories
 RUN set -eux; \
diff --git a/docker/compose/docker-compose-unified-backend.yml b/docker/compose/docker-compose-unified-backend.yml
index b8ebfd42b3..e8a9e3c3df 100644
--- a/docker/compose/docker-compose-unified-backend.yml
+++ b/docker/compose/docker-compose-unified-backend.yml
@@ -41,7 +41,7 @@ services:
     restart: unless-stopped
 
     healthcheck:
-      test: ["CMD-SHELL", "curl -f http://localhost:8080/api/v1/info/status || exit 1"]
+      test: ["CMD-SHELL", "curl -f http://localhost:8080$${SYSTEM_ROOTURIPATH:-''}/api/v1/info/status || exit 1"]
       interval: 30s
       timeout: 10s
       retries: 3
diff --git a/docker/compose/docker-compose-unified-both.yml b/docker/compose/docker-compose-unified-both.yml
index 92e08e4aae..f600905de3 100644
--- a/docker/compose/docker-compose-unified-both.yml
+++ b/docker/compose/docker-compose-unified-both.yml
@@ -45,7 +45,7 @@ services:
     restart: unless-stopped
 
     healthcheck:
-      test: ["CMD-SHELL", "curl -f http://localhost:8080/api/v1/info/status || exit 1"]
+      test: ["CMD-SHELL", "curl -f http://localhost:8080$${SYSTEM_ROOTURIPATH:-''}/api/v1/info/status || exit 1"]
       interval: 30s
       timeout: 10s
       retries: 3
diff --git a/docker/compose/docker-compose-unified-frontend.yml b/docker/compose/docker-compose-unified-frontend.yml
index c7d217b34c..0739bf8a7a 100644
--- a/docker/compose/docker-compose-unified-frontend.yml
+++ b/docker/compose/docker-compose-unified-frontend.yml
@@ -24,7 +24,7 @@ services:
       UMASK: "022"
     restart: unless-stopped
     healthcheck:
-      test: ["CMD-SHELL", "curl -f http://localhost:8080/api/v1/info/status || exit 1"]
+      test: ["CMD-SHELL", "curl -f http://localhost:8080$${SYSTEM_ROOTURIPATH:-''}/api/v1/info/status || exit 1"]
       interval: 30s
       timeout: 10s
       retries: 3
diff --git a/docker/compose/docker-compose.fat.yml b/docker/compose/docker-compose.fat.yml
index a6d657f156..215471ab0b 100644
--- a/docker/compose/docker-compose.fat.yml
+++ b/docker/compose/docker-compose.fat.yml
@@ -10,7 +10,7 @@ services:
         limits:
           memory: 6G
     healthcheck:
-      test: ["CMD-SHELL", "curl -f http://localhost:8080/api/v1/info/status | grep -q 'UP'"]
+      test: ["CMD-SHELL", "curl -f http://localhost:8080$${SYSTEM_ROOTURIPATH:-''}/api/v1/info/status | grep -q 'UP'"]
       interval: 5s
       timeout: 10s
       retries: 16
diff --git a/docker/compose/docker-compose.ultra-lite.yml b/docker/compose/docker-compose.ultra-lite.yml
index 420a64137f..af2c6efc71 100644
--- a/docker/compose/docker-compose.ultra-lite.yml
+++ b/docker/compose/docker-compose.ultra-lite.yml
@@ -10,7 +10,7 @@ services:
         limits:
           memory: 2G
     healthcheck:
-      test: ["CMD-SHELL", "curl -f http://localhost:8080/api/v1/info/status | grep -q 'UP'"]
+      test: ["CMD-SHELL", "curl -f http://localhost:8080$${SYSTEM_ROOTURIPATH:-''}/api/v1/info/status | grep -q 'UP'"]
       interval: 5s
       timeout: 10s
       retries: 16
diff --git a/docker/compose/docker-compose.yml b/docker/compose/docker-compose.yml
index 359bf2f463..577338a90d 100644
--- a/docker/compose/docker-compose.yml
+++ b/docker/compose/docker-compose.yml
@@ -6,7 +6,7 @@ services:
     container_name: stirling-pdf
     restart: unless-stopped
     healthcheck:
-      test: ["CMD-SHELL", "curl -f http://localhost:8080/api/v1/info/status | grep -q 'UP'"]
+      test: ["CMD-SHELL", "curl -f http://localhost:8080$${SYSTEM_ROOTURIPATH:-''}/api/v1/info/status | grep -q 'UP'"]
       interval: 5s
       timeout: 10s
       retries: 16
diff --git a/docker/embedded/Dockerfile b/docker/embedded/Dockerfile
index ee04dcf7e7..6f6a5ff026 100644
--- a/docker/embedded/Dockerfile
+++ b/docker/embedded/Dockerfile
@@ -1,17 +1,22 @@
 # Stirling-PDF - Full version (embedded frontend)
 # Uses pre-built base image for fast builds
 
-ARG BASE_VERSION=1.0.0
-ARG BASE_IMAGE=ghcr.io/stirling-tools/stirling-pdf-base:${BASE_VERSION}
+ARG BASE_VERSION=1.0.2
+ARG BASE_IMAGE=stirlingtools/stirling-pdf-base:${BASE_VERSION}
 
 # Stage 1: Build the Java application and frontend
 FROM gradle:9.3.1-jdk25 AS app-build
 
+ARG TASK_VERSION=3.49.1
 RUN apt-get update \
     && apt-get install -y --no-install-recommends curl ca-certificates \
     && update-ca-certificates \
     && curl -fsSL https://deb.nodesource.com/setup_20.x | bash - \
     && apt-get install -y --no-install-recommends nodejs \
+    && ARCH=$(dpkg --print-architecture) \
+    && curl -fsSL "https://github.com/go-task/task/releases/download/v${TASK_VERSION}/task_${TASK_VERSION}_linux_${ARCH}.deb" -o /tmp/task.deb \
+    && dpkg -i /tmp/task.deb \
+    && rm /tmp/task.deb \
     && rm -rf /var/lib/apt/lists/*
 
 # JDK 25+: --add-exports is no longer accepted via JAVA_TOOL_OPTIONS; use JDK_JAVA_OPTIONS instead
@@ -34,9 +39,11 @@ RUN gradle dependencies --no-daemon || true
 
 COPY . .
 
+ARG PROTOTYPES_BUILD=false
 RUN DISABLE_ADDITIONAL_FEATURES=false \
     gradle clean build \
       -PbuildWithFrontend=true \
+      -PprototypesMode=${PROTOTYPES_BUILD} \
       -x spotlessApply -x spotlessCheck -x test -x sonarqube \
       --no-daemon
 
@@ -91,6 +98,15 @@ ENV VERSION_TAG=$VERSION_TAG \
     _JVM_OPTS_BALANCED="-XX:+ExitOnOutOfMemoryError -XX:+HeapDumpOnOutOfMemoryError -XX:HeapDumpPath=/configs/heap_dumps -XX:+UseG1GC -XX:MaxGCPauseMillis=200 -XX:G1HeapRegionSize=4m -XX:G1PeriodicGCInterval=60000 -XX:+UseStringDeduplication -XX:+UseCompactObjectHeaders -XX:+ExplicitGCInvokesConcurrent -Dspring.threads.virtual.enabled=true -Djava.awt.headless=true" \
     _JVM_OPTS_PERFORMANCE="-XX:+ExitOnOutOfMemoryError -XX:+HeapDumpOnOutOfMemoryError -XX:HeapDumpPath=/configs/heap_dumps -XX:+UseShenandoahGC -XX:ShenandoahGCMode=generational -XX:+UseCompactObjectHeaders -XX:+UseStringDeduplication -XX:+AlwaysPreTouch -XX:+ExplicitGCInvokesConcurrent -Dspring.threads.virtual.enabled=true -Djava.awt.headless=true" \
     JAVA_CUSTOM_OPTS="" \
+    HOME=/home/stirlingpdfuser \
+    PUID=1000 \
+    PGID=1000 \
+    UMASK=022 \
+    STIRLING_TEMPFILES_DIRECTORY=/tmp/stirling-pdf \
+    TMPDIR=/tmp/stirling-pdf \
+    TEMP=/tmp/stirling-pdf \
+    TMP=/tmp/stirling-pdf \
+    DBUS_SESSION_BUS_ADDRESS=/dev/null \
     SAL_TMP=/tmp/stirling-pdf/libre
 
 # Metadata labels
@@ -110,7 +126,7 @@ EXPOSE 8080/tcp
 STOPSIGNAL SIGTERM
 
 HEALTHCHECK --interval=30s --timeout=15s --start-period=120s --retries=5 \
-  CMD curl -fs --max-time 10 http://localhost:8080/api/v1/info/status || exit 1
+  CMD curl -fs --max-time 10 http://localhost:8080${SYSTEM_ROOTURIPATH:-''}/api/v1/info/status || exit 1
 
 ENTRYPOINT ["tini", "--", "/scripts/init.sh"]
 CMD []
diff --git a/docker/embedded/Dockerfile.fat b/docker/embedded/Dockerfile.fat
index dfdaaea691..81c10943f6 100644
--- a/docker/embedded/Dockerfile.fat
+++ b/docker/embedded/Dockerfile.fat
@@ -2,17 +2,22 @@
 # Extra fonts for air-gapped environments
 # Uses pre-built base image for fast builds
 
-ARG BASE_VERSION=1.0.0
-ARG BASE_IMAGE=ghcr.io/stirling-tools/stirling-pdf-base:${BASE_VERSION}
+ARG BASE_VERSION=1.0.2
+ARG BASE_IMAGE=stirlingtools/stirling-pdf-base:${BASE_VERSION}
 
 # Stage 1: Build the Java application and frontend
 FROM gradle:9.3.1-jdk25 AS app-build
 
+ARG TASK_VERSION=3.49.1
 RUN apt-get update \
     && apt-get install -y --no-install-recommends curl ca-certificates \
     && update-ca-certificates \
     && curl -fsSL https://deb.nodesource.com/setup_20.x | bash - \
     && apt-get install -y --no-install-recommends nodejs \
+    && ARCH=$(dpkg --print-architecture) \
+    && curl -fsSL "https://github.com/go-task/task/releases/download/v${TASK_VERSION}/task_${TASK_VERSION}_linux_${ARCH}.deb" -o /tmp/task.deb \
+    && dpkg -i /tmp/task.deb \
+    && rm /tmp/task.deb \
     && rm -rf /var/lib/apt/lists/*
 
 # JDK 25+: --add-exports is no longer accepted via JAVA_TOOL_OPTIONS; use JDK_JAVA_OPTIONS instead
@@ -91,8 +96,17 @@ ENV VERSION_TAG=$VERSION_TAG \
     _JVM_OPTS_BALANCED="-XX:+ExitOnOutOfMemoryError -XX:+HeapDumpOnOutOfMemoryError -XX:HeapDumpPath=/configs/heap_dumps -XX:+UseG1GC -XX:MaxGCPauseMillis=200 -XX:G1HeapRegionSize=4m -XX:G1PeriodicGCInterval=60000 -XX:+UseStringDeduplication -XX:+UseCompactObjectHeaders -XX:+ExplicitGCInvokesConcurrent -Dspring.threads.virtual.enabled=true -Djava.awt.headless=true" \
     _JVM_OPTS_PERFORMANCE="-XX:+ExitOnOutOfMemoryError -XX:+HeapDumpOnOutOfMemoryError -XX:HeapDumpPath=/configs/heap_dumps -XX:+UseShenandoahGC -XX:ShenandoahGCMode=generational -XX:+UseCompactObjectHeaders -XX:+UseStringDeduplication -XX:+AlwaysPreTouch -XX:+ExplicitGCInvokesConcurrent -Dspring.threads.virtual.enabled=true -Djava.awt.headless=true" \
     JAVA_CUSTOM_OPTS="" \
+    HOME=/home/stirlingpdfuser \
+    PUID=1000 \
+    PGID=1000 \
+    UMASK=022 \
     FAT_DOCKER=true \
     INSTALL_BOOK_AND_ADVANCED_HTML_OPS=false \
+    STIRLING_TEMPFILES_DIRECTORY=/tmp/stirling-pdf \
+    TMPDIR=/tmp/stirling-pdf \
+    TEMP=/tmp/stirling-pdf \
+    TMP=/tmp/stirling-pdf \
+    DBUS_SESSION_BUS_ADDRESS=/dev/null \
     SAL_TMP=/tmp/stirling-pdf/libre
 
 # Metadata labels
@@ -112,7 +126,7 @@ EXPOSE 8080/tcp
 STOPSIGNAL SIGTERM
 
 HEALTHCHECK --interval=30s --timeout=15s --start-period=120s --retries=5 \
-  CMD curl -fs --max-time 10 http://localhost:8080/api/v1/info/status || exit 1
+  CMD curl -fs --max-time 10 http://localhost:8080${SYSTEM_ROOTURIPATH:-''}/api/v1/info/status || exit 1
 
 ENTRYPOINT ["tini", "--", "/scripts/init.sh"]
 CMD []
diff --git a/docker/embedded/Dockerfile.ultra-lite b/docker/embedded/Dockerfile.ultra-lite
index e0d719cd70..b748dbab82 100644
--- a/docker/embedded/Dockerfile.ultra-lite
+++ b/docker/embedded/Dockerfile.ultra-lite
@@ -5,12 +5,17 @@
 FROM gradle:9.3.1-jdk25 AS build
 
 # Install Node.js and npm for frontend build
+ARG TASK_VERSION=3.49.1
 RUN apt-get update && apt-get install -y --no-install-recommends \
     curl \
     && curl -fsSL https://deb.nodesource.com/setup_20.x | bash - \
     && apt-get install -y --no-install-recommends nodejs \
     && npm --version \
     && node --version \
+    && ARCH=$(dpkg --print-architecture) \
+    && curl -fsSL "https://github.com/go-task/task/releases/download/v${TASK_VERSION}/task_${TASK_VERSION}_linux_${ARCH}.deb" -o /tmp/task.deb \
+    && dpkg -i /tmp/task.deb \
+    && rm /tmp/task.deb \
     && rm -rf /var/lib/apt/lists/*
 
 WORKDIR /app
@@ -93,7 +98,7 @@ RUN echo "@main https://dl-cdn.alpinelinux.org/alpine/edge/main" | tee -a /etc/a
     bash \
     curl \
     shadow \
-    su-exec && \
+    util-linux && \
     mkdir -p $HOME /configs /logs /customFiles /pipeline/watchedFolders /pipeline/finishedFolders /tmp/stirling-pdf /tmp/stirling-pdf/heap_dumps && \
     mkdir -p /usr/share/fonts/opentype/noto && \
     # User permissions
diff --git a/docker/embedded/compose/docker-compose-latest-fat-endpoints-disabled.yml b/docker/embedded/compose/docker-compose-latest-fat-endpoints-disabled.yml
index 512ba4f144..c1d2360b53 100644
--- a/docker/embedded/compose/docker-compose-latest-fat-endpoints-disabled.yml
+++ b/docker/embedded/compose/docker-compose-latest-fat-endpoints-disabled.yml
@@ -11,7 +11,7 @@ services:
         limits:
           memory: 4G
     healthcheck:
-      test: ["CMD-SHELL", "curl -f http://localhost:8080/api/v1/info/status | grep -q 'UP'"]
+      test: ["CMD-SHELL", "curl -f http://localhost:8080$${SYSTEM_ROOTURIPATH:-''}/api/v1/info/status | grep -q 'UP'"]
       interval: 5s
       timeout: 10s
       retries: 16
diff --git a/docker/embedded/compose/docker-compose-latest-fat-security.yml b/docker/embedded/compose/docker-compose-latest-fat-security.yml
index 9ca92ce60c..7abd1acd6c 100644
--- a/docker/embedded/compose/docker-compose-latest-fat-security.yml
+++ b/docker/embedded/compose/docker-compose-latest-fat-security.yml
@@ -10,7 +10,7 @@ services:
         limits:
           memory: 4G
     healthcheck:
-      test: ["CMD-SHELL", "curl -f http://localhost:8080/api/v1/info/status | grep -q 'UP'"]
+      test: ["CMD-SHELL", "curl -f http://localhost:8080$${SYSTEM_ROOTURIPATH:-''}/api/v1/info/status | grep -q 'UP'"]
       interval: 5s
       timeout: 10s
       retries: 16
diff --git a/docker/embedded/compose/docker-compose-latest-security-remote-uno.yml b/docker/embedded/compose/docker-compose-latest-security-remote-uno.yml
index d1b804ad4c..a80a04e133 100644
--- a/docker/embedded/compose/docker-compose-latest-security-remote-uno.yml
+++ b/docker/embedded/compose/docker-compose-latest-security-remote-uno.yml
@@ -6,7 +6,7 @@ services:
       context: ../../..
       dockerfile: docker/embedded/Dockerfile
     healthcheck:
-      test: ["CMD-SHELL", "curl -f http://localhost:8080/api/v1/info/status | grep -q 'UP'"]
+      test: ["CMD-SHELL", "curl -f http://localhost:8080$${SYSTEM_ROOTURIPATH:-''}/api/v1/info/status | grep -q 'UP'"]
       interval: 5s
       timeout: 10s
       retries: 16
diff --git a/docker/embedded/compose/docker-compose-latest-security.yml b/docker/embedded/compose/docker-compose-latest-security.yml
index af8979bafa..42f9946dc0 100644
--- a/docker/embedded/compose/docker-compose-latest-security.yml
+++ b/docker/embedded/compose/docker-compose-latest-security.yml
@@ -6,7 +6,7 @@ services:
       context: ../../..
       dockerfile: docker/embedded/Dockerfile
     healthcheck:
-      test: ["CMD-SHELL", "curl -f http://localhost:8080/api/v1/info/status | grep -q 'UP'"]
+      test: ["CMD-SHELL", "curl -f http://localhost:8080$${SYSTEM_ROOTURIPATH:-''}/api/v1/info/status | grep -q 'UP'"]
       interval: 5s
       timeout: 10s
       retries: 16
diff --git a/docker/embedded/compose/docker-compose-latest-ultra-lite.yml b/docker/embedded/compose/docker-compose-latest-ultra-lite.yml
index a5cae8dc54..11174d1064 100644
--- a/docker/embedded/compose/docker-compose-latest-ultra-lite.yml
+++ b/docker/embedded/compose/docker-compose-latest-ultra-lite.yml
@@ -10,7 +10,7 @@ services:
         limits:
           memory: 1G
     healthcheck:
-      test: ["CMD-SHELL", "curl -f http://localhost:8080/api/v1/info/status | grep -q 'UP' && curl -fL http://localhost:8080/ | grep -qv 'Please sign in'"]
+      test: ["CMD-SHELL", "curl -f http://localhost:8080$${SYSTEM_ROOTURIPATH:-''}/api/v1/info/status | grep -q 'UP' && curl -fL http://localhost:8080/ | grep -qv 'Please sign in'"]
       interval: 5s
       timeout: 10s
       retries: 16
diff --git a/docker/embedded/compose/test_cicd.yml b/docker/embedded/compose/test_cicd.yml
index d1e08013c2..fe165c8644 100644
--- a/docker/embedded/compose/test_cicd.yml
+++ b/docker/embedded/compose/test_cicd.yml
@@ -5,12 +5,8 @@ services:
     build:
       context: ../../../
       dockerfile: docker/embedded/Dockerfile.fat
-    deploy:
-      resources:
-        limits:
-          memory: 4G
     healthcheck:
-      test: ["CMD-SHELL", "curl -f -H 'X-API-KEY: 123456789' http://localhost:8080/api/v1/info/status | grep -q 'UP'"]
+      test: ["CMD-SHELL", "curl -f -H 'X-API-KEY: 123456789' http://localhost:8080${SYSTEM_ROOTURIPATH:-''}/api/v1/info/status | grep -q 'UP'"]
       interval: 5s
       timeout: 10s
       retries: 16
diff --git a/docker/frontend/Dockerfile b/docker/frontend/Dockerfile
index af80bee067..5fef0ea3e4 100644
--- a/docker/frontend/Dockerfile
+++ b/docker/frontend/Dockerfile
@@ -13,7 +13,7 @@ RUN npm ci
 COPY frontend .
 
 # Build the application
-RUN npm run build
+RUN npx vite build
 
 # Production stage
 FROM nginx:alpine@sha256:b0f7830b6bfaa1258f45d94c240ab668ced1b3651c8a222aefe6683447c7bf55
diff --git a/docs/security/VERIFYING_RELEASES.md b/docs/security/VERIFYING_RELEASES.md
new file mode 100644
index 0000000000..2ddb8d905b
--- /dev/null
+++ b/docs/security/VERIFYING_RELEASES.md
@@ -0,0 +1,114 @@
+# Verifying Stirling-PDF Release Artifacts
+
+Every Linux release artifact (`.AppImage`, `.rpm`, `.deb`) is signed with the
+**Stirling-PDF release signing key**. Users are encouraged to verify downloads
+before running them, especially when obtaining Stirling-PDF from a mirror,
+redistributor, or any source other than the official
+[GitHub Releases page](https://github.com/Stirling-Tools/Stirling-PDF/releases).
+
+## Signing key
+
+| Field        | Value                                              |
+|--------------|----------------------------------------------------|
+| User ID      | `Stirling PDF Inc. <contact@stirlingpdf.com>`      |
+| Fingerprint  | `EBB9 258B FEA4 7D92 342F  00DF B8C0 96A5 9BEF 2A8B` |
+| Algorithm    | RSA-4096                                           |
+| Valid until  | 2031-04-16                                         |
+
+The public key is committed to this repository at
+[`docs/security/signing-key.pub`](signing-key.pub) and is also published on:
+
+- https://keys.openpgp.org/search?q=EBB9258BFEA47D92342F00DFB8C096A59BEF2A8B
+- https://keyserver.ubuntu.com/pks/lookup?op=get&search=0xEBB9258BFEA47D92342F00DFB8C096A59BEF2A8B
+
+Cross-checking the fingerprint from two independent sources (the repository and
+a keyserver) is the recommended way to be sure you've obtained the genuine key.
+
+## One-time setup — import the public key
+
+```bash
+# Option 1 — from the repo over HTTPS
+curl -fsSL https://raw.githubusercontent.com/Stirling-Tools/Stirling-PDF/main/docs/security/signing-key.pub \
+  | gpg --import
+
+# Option 2 — from a keyserver
+gpg --keyserver hkps://keys.openpgp.org \
+    --recv-keys EBB9258BFEA47D92342F00DFB8C096A59BEF2A8B
+```
+
+Confirm the fingerprint matches after import:
+
+```bash
+gpg --fingerprint contact@stirlingpdf.com
+# Expected: EBB9 258B FEA4 7D92 342F  00DF B8C0 96A5 9BEF 2A8B
+```
+
+## Verifying an `.AppImage`
+
+Tauri's AppImage bundler embeds the signature inside the AppImage itself via
+`appimagetool --sign`. Extract and verify:
+
+```bash
+# --appimage-signature prints the embedded signature
+./Stirling-PDF_*.AppImage --appimage-signature > sig.asc
+./Stirling-PDF_*.AppImage --appimage-offset                  # shows the offset
+# Verify the payload signature against the key
+gpg --verify sig.asc Stirling-PDF_*.AppImage
+```
+
+A successful result looks like:
+
+```
+gpg: Good signature from "Stirling PDF Inc. <contact@stirlingpdf.com>" [ultimate]
+```
+
+## Verifying an `.rpm`
+
+RPM signatures are verified via `rpm --checksig`:
+
+```bash
+# Import the key into rpm's keyring
+sudo rpm --import docs/security/signing-key.pub   # if working from a clone
+# OR
+sudo rpm --import https://raw.githubusercontent.com/Stirling-Tools/Stirling-PDF/main/docs/security/signing-key.pub
+
+# Verify the package
+rpm --checksig Stirling-PDF-*.rpm
+# Expected output ends with: "digests signatures OK"
+```
+
+## Verifying a `.deb`
+
+Debian packages are signed with a detached `.asc` file distributed alongside
+the `.deb` on the release page:
+
+```bash
+gpg --verify Stirling-PDF-*.deb.asc Stirling-PDF-*.deb
+```
+
+## What if verification fails?
+
+A failed signature check means **do not install the file**. Possible causes:
+
+- The download was corrupted — try again from the
+  [official releases](https://github.com/Stirling-Tools/Stirling-PDF/releases).
+- You obtained the file from a malicious mirror — get it from the official
+  source.
+- The signing key has rotated — check this document on the latest `main` for
+  the current fingerprint.
+
+If none of those explain it, please open a security report at
+https://github.com/Stirling-Tools/Stirling-PDF/security/advisories/new.
+
+## Key rotation policy
+
+The signing key expires on **2031-04-16**. We will publish a new key at least
+six months before expiry. The transition process:
+
+1. A new key is announced in release notes and this document is updated.
+2. The last few releases will be co-signed with both the old and new keys.
+3. The old key is published with a revocation notice once the transition is
+   complete.
+
+If the signing key is ever compromised, a revocation certificate will be
+published immediately to both keyservers and to this document.
diff --git a/docs/security/signing-key.pub b/docs/security/signing-key.pub
new file mode 100644
index 0000000000..cc47ffe8ca
--- /dev/null
+++ b/docs/security/signing-key.pub
@@ -0,0 +1,52 @@
+-----BEGIN PGP PUBLIC KEY BLOCK-----
+
+mQINBGniEeQBEADHiXeQS+OD8Tzm9RoFEZZE09yD/9GTMXZh3YZuOQTHXoEYHmQE
+mdytue4LdyKQtWxn6DlHnB3ea724yARtRkMcleljDYC9bcAb2/Cpysf9vTI8QxFa
+Tw+T1jp/it0WC4Gsc18pfZeS+QaGwqs9MkMiy1jSnxSf3q4pncCcI+w/8ZqC7iRE
+XHoIQPJLx0poSqqa0y4hbK8rM2zms/RGmktQoVuGEVSkt2dmGDGoHpKo4sueyMtr
+qm4Qy3n7qQDT/Fl9YPgs9KYdCWJV8uET4WHPaUMz44798gip4m5RIexa7eNdIUid
+wpfGDJwd4FTZ3MndHaJ96gW1mrIp0YzCnZxTibp2Ki/BQpw6kwgfkWLa9J97ikIu
+u/4tTrZV/wUGX6nOIDsJgTdfGICjdnnt3pkp8NeBaU54NPahwlaVvp7byiehrhDe
+qyLO+rDvwnraxeHTdpF2s2Rb+/gZZJKUgRqimFah8Enh6Ntwu8J39NQK5+SLZkbG
++3g6Xlnn8T9+7if830xvbXh8CmIYdMe0SEkZQQqNi9pZzkUMf3B1gar8FoLR23/u
+eem04OLNAwQFFVkTAsmLB1uMYZuo01EsSl5dmnMF4bovJxhHp4mbZwBcpehA6b9R
+WX29aqeJYM6j/z8MBXkjmIh7Z/Ftqc+BSWz4So0goxSsqH8D4Yvhspy95wARAQAB
+tCtTdGlybGluZyBQREYgSW5jLiA8Y29udGFjdEBzdGlybGluZ3BkZi5jb20+iQJX
+BBMBCABBFiEE67kli/6kfZI0LwDfuMCWpZvvKosFAmniEeQCGwMFCQlmAYAFCwkI
+BwICIgIGFQoJCAsCBBYCAwECHgcCF4AACgkQuMCWpZvvKosUXQ/9F6PeGwB7qNkC
+22rBel7QjzF0XJVYPboLdqXKZGN4Nr1Mr57aHfETNfnDxfxG7ClEAfGuOR7McSG7
+ewPDdd4f0qCbQWkqUXOnmtb9+2ljiRHGtEg3gWUoCfIDxORaMluWO++z4VmKRS2L
+Ech761cU3acgDePkHfIg62/agNlhFgrE5QRnUznyf8OKAJbcl3vlyBC9eXZ+9Atg
+7FAXfohOBdn9J5i3v+AmnAJSoDfjNYseaJqCouhdPM1uNoSq798JnE3X+j2Pt/AY
+2Nlz1ZdREgiHGL0zA4/ILEchv+Ypl/gtNsArsbJJdMST5conihc2L7bcJ7FJzd71
+xFczvUyhPTrPJcaryFYvR559xIDtJ5ucz6C63DAL32kmE4fnUd2UE+/pwx7pkEit
+sqTq/fSZNALyq0W5IL6jgEzdC2yUodHytULk3JSS7RQakkkVHrhkJrm5UnOYXTkD
+62k4tpDIBtuZ6NyD+X4PD2XBUdsdu42OetKrr7tIN/ZktfV1C5BY8+Jr4ZQSxXG5
+8Qwjfcytem4rhuumfS0pqaJ91PUNDxVTyKEBsa8a/gkLelkapnvDMU9DyND75UBw
+Y81ptA2Q5u4nODJ1ow8R/6GiolC9/0mNQPHZatdI0uoC7fRUMybEvrcSl+D1YpgC
+uuEh1VurvrV0J6VdwncFYrjZiwxo0A25Ag0EaeIR5AEQANFuE3C5iq6GWZ7rWnz6
+IORKb+aK7p/ifES4TXq3GVgWGslcPpnChlcfuMLo91QySRNrgnT5qkRg70JvtVil
+y8hOx4rcfEEK/lKDIBmu6/9DdQhegxmjP+myXYqpMzE5l+t5wWDKWK4e2b0SluRM
+x3sb0rp7mM0KM/VmMCDrDCd3zWE8Z/r40Oc/6pKJ7FmorZmU8OyLQAIiXhnANPW7
+nAUEvtjS57ctIBK58UQVfLasoKMe3JIjRU67sVGV6pdQS9b+1wv8cFIAjUdlWmem
+gYy8YZP2XS1kgq6WsNYE0noxs1UafJ+r1IbNs9czT3S2Uu6hjIukKWyb1CjehOlj
+HbS9WRfNyeAVz3R7HUfKukFF1a58DPe0shxdSr9xqths5337Nx+M9nVQwSSQeALl
+95F2o1dokZc/Wzk83T4K89zGlpZYdehTObdPlaLH8b/p7UH47gjH3naEHpp0vQAE
+w/7VkYp0Pqo9YtST8Xom05R/kDrUdNYjJHdEMSKRKh+yw9N+cyMX3yQjJFf+tUzW
+d3tpdXQx9DeQR6I8os9uvoSYtg9GHaWHHxkn64y6Y6TjMF9RT//lifRxyt6dGyVW
+ROkzzojqfXUTONdzO4SSNvXhD9EDx9MVnCG44WXuMf4VMj+cTQKmguENiur/Xh4k
+Uq3B9NtpB+fzSX1WRqEVTTQHABEBAAGJAjwEGAEIACYWIQTruSWL/qR9kjQvAN+4
+wJalm+8qiwUCaeIR5AIbDAUJCWYBgAAKCRC4wJalm+8qixuuD/9uGhTTLxL7CiIh
+D9QzkPQzo7qRl1+ca1DpM6cF+N26gHyy03AELm6HuacCDGt3+ZtpF8ADFTwQzkVq
+Y1UGkd1mSxKank3uATEv7bksHkZE6pKk2RGK7JtMGmdoaUOs5BXGFRgE3ntRYM+4
+rXGld+gQpxCw5URFwD6+vaByNcxgSGCLMxWCvbAargWTqHuVoFUwbd6LV8qp/DCR
+8W1HzlDoHqOyZZpYAHiyRKhlrElImE2Bxn99z5oE3beNw5kd5D87P4oSRkrlz+Kj
+OSqJPWTh5gNE0z3JPsQDCNpmEuifZbJc0SF6QLg8/oYabZiM34YFMqMtsc4t4vtH
+bAtUPWZoPiW0YAM90caoGQcU7kaA7Jn38QwMZ8FDv9OWMO6LQDHIY6CzXxRgakoy
+OPkn/iTwCecrdqHlBtc2hINSguPw6JO35O08BmOYLe/lFTf5EWcGZFCVG5raos+2
+AZry7VjhGMmFONteuLyZ94Istse122L158M10V63S7SCFzPEAZw0mhHMOULfXt/Z
+wk1Czlo6J78TsEevILG0Ft4a7hyAUiPIigZ/LqZRH2Skrk4pVVP5rFlwmITQg7dG
+NldnyvBgL4CX72XIc6BumY9k3eiFzM++XuQ9Z/NkSjYkynGyjMD0FjlGQj6xHdr4
+0546Zz4onsw5L5I/NzcaG5HK1YNUNA==
+=vzHS
+-----END PGP PUBLIC KEY BLOCK-----
diff --git a/engine/.env b/engine/.env
new file mode 100644
index 0000000000..7d1aa13940
--- /dev/null
+++ b/engine/.env
@@ -0,0 +1,44 @@
+###############################################################################
+# Environment variables used within the AI Engine.
+# Values can be overridden in the uncommitted sibling `.env.local` file.
+# Note: This file is committed to Git, so should not contain any private keys.
+###############################################################################
+
+# Configure the model strings passed to pydantic-ai. Provider credentials are handled by
+# pydantic-ai and should be set using the provider's native environment variables, for example
+# ANTHROPIC_API_KEY or OPENAI_API_KEY.
+STIRLING_SMART_MODEL=anthropic:claude-haiku-4-5
+STIRLING_FAST_MODEL=anthropic:claude-haiku-4-5
+
+# Default output token limits applied by the engine for each model tier.
+STIRLING_SMART_MODEL_MAX_TOKENS=8192
+STIRLING_FAST_MODEL_MAX_TOKENS=2048
+
+# RAG Configuration — retrieval-augmented generation is always on.
+# Embedding provider credentials are handled natively (e.g. VOYAGE_API_KEY for VoyageAI).
+STIRLING_RAG_EMBEDDING_MODEL=voyageai:voyage-4
+
+# Vector store backend: "sqlite" (embedded) or "pgvector" (external Postgres).
+STIRLING_RAG_BACKEND=sqlite
+
+# Path to the sqlite-vec database file (used when backend=sqlite).
+STIRLING_RAG_STORE_PATH=data/rag.db
+
+# Postgres DSN for pgvector (used when backend=pgvector). Leave empty when backend=sqlite.
+# Example: postgresql://user:password@host:5432/dbname
+STIRLING_RAG_PGVECTOR_DSN=
+
+STIRLING_RAG_CHUNK_SIZE=512
+STIRLING_RAG_CHUNK_OVERLAP=64
+STIRLING_RAG_TOP_K=5
+
+# PostHog analytics. Set STIRLING_POSTHOG_ENABLED=true and provide an API key to enable.
+STIRLING_POSTHOG_ENABLED=false
+STIRLING_POSTHOG_API_KEY=phc_VOdeYnlevc2T63m3myFGjeBlRcIusRgmhfx6XL5a1iz
+STIRLING_POSTHOG_HOST=https://eu.i.posthog.com
+
+# Log level for the stirling logger hierarchy (DEBUG, INFO, WARNING, ERROR)
+STIRLING_LOG_LEVEL=INFO
+
+# Path to log file. Rolls daily, keeps 1 backup. Leave empty for console only.
+STIRLING_LOG_FILE=
diff --git a/engine/.gitignore b/engine/.gitignore
index 1116f48815..890e5247ba 100644
--- a/engine/.gitignore
+++ b/engine/.gitignore
@@ -19,7 +19,6 @@ yarn-error.log*
 .vite/
 
 # Environment
-.env
 .env.local
 
 # LaTeX outputs
diff --git a/engine/AGENTS.md b/engine/AGENTS.md
index 87fa13db26..8e45662740 100644
--- a/engine/AGENTS.md
+++ b/engine/AGENTS.md
@@ -4,9 +4,23 @@ This file is for AI agents working in `engine/`.
 
 The engine is a Python reasoning service for Stirling. It plans and interprets work, but it does not own durable state, and it does not execute Stirling PDF operations directly. Keep the service narrow: typed contracts in, typed contracts out, with AI only where it adds reasoning value.
 
+## Commands
+
+All engine commands can be run from the repository root using Task:
+
+- `task engine:check` — run all checks (typecheck + lint + format-check + test)
+- `task engine:fix` — auto-fix lint + formatting
+- `task engine:install` — install Python dependencies via uv
+- `task engine:dev` — start FastAPI with hot reload (localhost:5001)
+- `task engine:test` — run pytest
+- `task engine:lint` — run ruff linting
+- `task engine:typecheck` — run pyright
+- `task engine:format` — format code with ruff
+- `task engine:tool-models` — generate tool_models.py from Java OpenAPI spec
+
 ## Code Style
 
-- Keep `make check` passing.
+- Keep `task engine:check` passing.
 - Use modern Python when it improves clarity.
 - Prefer explicit names to cleverness.
 - Avoid nested functions and nested classes unless the language construct requires them.
diff --git a/engine/Dockerfile b/engine/Dockerfile
index 817f949510..5caeb5d6bf 100644
--- a/engine/Dockerfile
+++ b/engine/Dockerfile
@@ -1,9 +1,20 @@
 # syntax=docker/dockerfile:1.5
 FROM ghcr.io/astral-sh/uv:python3.13-bookworm-slim
 
+ARG TASK_VERSION=3.49.1
+RUN apt-get update \
+    && apt-get install -y --no-install-recommends curl ca-certificates \
+    && ARCH=$(dpkg --print-architecture) \
+    && curl -fsSL "https://github.com/go-task/task/releases/download/v${TASK_VERSION}/task_${TASK_VERSION}_linux_${ARCH}.deb" -o /tmp/task.deb \
+    && dpkg -i /tmp/task.deb \
+    && rm /tmp/task.deb \
+    && rm -rf /var/lib/apt/lists/*
+
 WORKDIR /app
 
-COPY pyproject.toml uv.lock ./
+COPY pyproject.toml uv.lock Taskfile.yml .env ./
+COPY .taskfiles/ ./.taskfiles/
+COPY scripts/ ./scripts/
 RUN --mount=type=cache,target=/root/.cache/uv \
     uv sync --frozen --no-dev
 
@@ -14,4 +25,4 @@ ENV PYTHONUNBUFFERED=1
 
 EXPOSE 5001
 
-CMD ["uv", "run", "uvicorn", "stirling.api.app:app", "--host", "0.0.0.0", "--port", "5001"]
+CMD ["task", "engine:run"]
diff --git a/engine/Makefile b/engine/Makefile
deleted file mode 100644
index 71d637694e..0000000000
--- a/engine/Makefile
+++ /dev/null
@@ -1,82 +0,0 @@
-.PHONY: help install prep check fix lint lint-fix lint-fix-unsafe format format-check typecheck test run run-dev clean tool-models docker-build docker-run
-
-REPO_ROOT_DIR = ..
-ROOT_DIR = .
-VENV_DIR = $(ROOT_DIR)/.venv
-DEPS_STAMP := $(VENV_DIR)/.deps-installed
-TOOL_MODELS := $(CURDIR)/src/stirling/models/tool_models.py
-FRONTEND_DIR := $(REPO_ROOT_DIR)/frontend
-FRONTEND_TSX := $(FRONTEND_DIR)/node_modules/.bin/tsx
-
-$(DEPS_STAMP): $(ROOT_DIR)/uv.lock $(ROOT_DIR)/pyproject.toml
-	uv python install 3.13.8
-	uv sync
-	touch $(DEPS_STAMP)
-
-help:
-	@echo "Engine commands:"
-	@echo "  make install      - Install production dependencies"
-	@echo "  make prep         - Set up .env file from .env.example"
-	@echo "  make lint         - Run linting checks"
-	@echo "  make format       - Format code"
-	@echo "  make format-check - Show whether code is correctly formatted"
-	@echo "  make typecheck    - Run type checking"
-	@echo "  make test         - Run tests"
-	@echo "  make run          - Run the FastAPI backend with uvicorn"
-	@echo "  make run-dev      - Run the FastAPI backend with reload"
-	@echo "  make tool-models  - Generate src/stirling/models/tool_models.py from frontend TypeScript tool defs"
-	@echo "  make clean        - Clean up generated files"
-	@echo "  make docker-build - Build Docker image"
-	@echo "  make docker-run   - Run Docker container"
-
-install: $(DEPS_STAMP)
-
-prep: install
-	uv run scripts/setup_env.py
-
-check: typecheck lint format-check test
-
-fix: lint-fix format
-
-lint: install
-	uv run ruff check .
-
-lint-fix: install
-	uv run ruff check . --fix
-
-lint-fix-unsafe: install
-	uv run ruff check . --fix --unsafe-fixes
-
-format: install
-	uv run ruff format .
-
-format-check: install
-	uv run ruff format . --diff
-
-typecheck: install
-	uv run pyright . --warnings
-
-test: prep
-	uv run pytest tests
-
-run: prep
-	cd src && PYTHONUNBUFFERED=1 uv run uvicorn stirling.api.app:app --host 0.0.0.0 --port 5001
-
-run-dev: prep
-	cd src && PYTHONUNBUFFERED=1 uv run uvicorn stirling.api.app:app --host 0.0.0.0 --port 5001 --reload
-
-frontend-deps:
-	if [ ! -x "$(FRONTEND_TSX)" ]; then cd $(FRONTEND_DIR) && npm install; fi
-
-tool-models: install frontend-deps
-	uv run python scripts/generate_tool_models.py --output $(TOOL_MODELS)
-	$(MAKE) fix
-
-clean:
-	rm -rf $(VENV_DIR) data logs output
-
-docker-build:
-	docker build -t stirling-pdf-engine .
-
-docker-run:
-	docker run -p 5001:5001 stirling-pdf-engine
diff --git a/engine/pyproject.toml b/engine/pyproject.toml
index 693a281532..f1a10fe108 100644
--- a/engine/pyproject.toml
+++ b/engine/pyproject.toml
@@ -5,17 +5,26 @@ description = "AI Document Engine"
 requires-python = ">=3.13"
 dependencies = [
     "fastapi>=0.116.0",
+    "pgvector>=0.3.6",
+    "psycopg[binary]>=3.2",
     "pydantic>=2.0.0",
     "pydantic-ai>=1.67.0",
+    "pydantic-ai-slim[voyageai]>=1.67.0",
     "pydantic-settings>=2.0.0",
     "python-dotenv>=1.2.1",
+    "sqlite-vec>=0.1.6",
     "uvicorn>=0.35.0",
+    "opentelemetry-sdk>=1.39.0",
+    "posthog>=3.0.0",
 ]
 
 [dependency-groups]
 dev = [
+    "anyio>=4.0.0",
+    "datamodel-code-generator[ruff]>=0.26.0",
     "pytest>=8.0.0",
     "pyright>=1.1.408",
+    "referencing>=0.35.0",
     "ruff>=0.14.10",
 ]
 
@@ -42,9 +51,9 @@ select = [
     "W",
     "RUF100",
     "UP",
-]
-ignore = [
-    "E501", # Temporarily disable line length limit until codebase conformat
+    "PYI",    # flake8-pyi: flags deprecated typing constructs
+    "FA",     # flake8-future-annotations: flags missing future annotations imports
+    "BLE",    # flake8-blind-except: flags bare `except Exception`
 ]
 
 [tool.pyright]
@@ -55,6 +64,7 @@ reportUnnecessaryCast = "warning"
 reportUnnecessaryTypeIgnoreComment = "warning"
 reportUnusedImport = "warning"
 reportUnknownParameterType = "warning"
+reportDeprecated = "warning"
 
 [tool.pytest.ini_options]
 testpaths = ["tests"]
diff --git a/engine/scripts/generate_tool_models.py b/engine/scripts/generate_tool_models.py
index bc339acb0a..9c67fcae49 100644
--- a/engine/scripts/generate_tool_models.py
+++ b/engine/scripts/generate_tool_models.py
@@ -1,509 +1,222 @@
 #!/usr/bin/env python3
+"""Generate Python tool models from the Java backend's OpenAPI spec (SwaggerDoc.json).
+
+Uses datamodel-code-generator to convert OpenAPI request schemas to Pydantic models.
+Run via:
+    task engine:tool-models
+"""
+
 from __future__ import annotations
 
 import argparse
 import json
-import keyword
-import re
-import subprocess
-from collections.abc import Callable
 from dataclasses import dataclass
 from pathlib import Path
 from typing import Any
 
-TOOL_MODELS_HEADER = """# AUTO-GENERATED FILE. DO NOT EDIT.
-# Generated by scripts/generate_tool_models.py from frontend TypeScript sources.
-# ruff: noqa: N815
-"""
+from datamodel_code_generator import InputFileType, PythonVersion, generate
+from datamodel_code_generator.enums import DataModelType
+from datamodel_code_generator.format import Formatter
+from referencing import Registry, Resource
+from referencing.jsonschema import DRAFT202012
 
+# Fields inherited from PDFFile base class — not tool parameters.
+BASE_CLASS_FIELDS = frozenset({"fileInput", "fileId"})
 
-OPERATION_TYPE_RE = re.compile(r"operationType\s*:\s*['\"]([A-Za-z0-9_]+)['\"]")
-DEFAULT_REF_RE = re.compile(r"defaultParameters\s*:\s*([A-Za-z0-9_]+)")
-DEFAULT_SHORTHAND_RE = re.compile(r"\bdefaultParameters\b")
-IMPORT_RE = re.compile(r"import\s*\{([^}]+)\}\s*from\s*['\"]([^'\"]+)['\"]")
-VAR_OBJ_RE_TEMPLATE = r"(?:export\s+)?const\s+{name}\b[^=]*=\s*\{{"
+_ENGINE_ROOT = Path(__file__).resolve().parents[1]
+
+_FILE_HEADER = (
+    "# AUTO-GENERATED FILE. DO NOT EDIT.\n"
+    "# Generated by scripts/generate_tool_models.py from Java OpenAPI spec (SwaggerDoc.json).\n"
+    "# ruff: noqa: E501"
+)
 
 
 @dataclass
-class ToolModelSpec:
-    tool_id: str
-    params: dict[str, Any]
-    param_types: dict[str, Any]
+class ToolSpec:
+    path: str
+    enum_name: str
+    class_name: str
 
 
-class ParseError(Exception):
-    pass
+@dataclass
+class DiscoveryResult:
+    tools: list[ToolSpec]
+    combined_schema: dict[str, Any]
 
 
-def _find_matching(text: str, start: int, open_char: str, close_char: str) -> int:
-    depth = 0
-    i = start
-    in_str: str | None = None
-    while i < len(text):
-        ch = text[i]
-        if in_str:
-            if ch == "\\":
-                i += 2
-                continue
-            if ch == in_str:
-                in_str = None
-            i += 1
-            continue
-        if ch in {"'", '"'}:
-            in_str = ch
-        elif ch == open_char:
-            depth += 1
-        elif ch == close_char:
-            depth -= 1
-            if depth == 0:
-                return i
-        i += 1
-    raise ParseError(f"Unmatched {open_char}{close_char} block")
+class ToolDiscovery:
+    """Discovers tool endpoints from an OpenAPI spec and builds a combined JSON Schema."""
 
-
-def _extract_block(text: str, pattern: str) -> str | None:
-    match = re.search(pattern, text)
-    if not match:
-        return None
-    brace_start = text.find("{", match.end() - 1)
-    if brace_start == -1:
-        return None
-    brace_end = _find_matching(text, brace_start, "{", "}")
-    return text[brace_start : brace_end + 1]
-
-
-def _split_top_level_items(obj_body: str) -> list[str]:
-    items: list[str] = []
-    depth_obj = depth_arr = 0
-    in_str: str | None = None
-    token_start = 0
-    i = 0
-    while i < len(obj_body):
-        ch = obj_body[i]
-        if in_str:
-            if ch == "\\":
-                i += 2
-                continue
-            if ch == in_str:
-                in_str = None
-            i += 1
-            continue
-        if ch in {"'", '"'}:
-            in_str = ch
-        elif ch == "{":
-            depth_obj += 1
-        elif ch == "}":
-            depth_obj -= 1
-        elif ch == "[":
-            depth_arr += 1
-        elif ch == "]":
-            depth_arr -= 1
-        elif ch == "," and depth_obj == 0 and depth_arr == 0:
-            piece = obj_body[token_start:i].strip()
-            if piece:
-                items.append(piece)
-            token_start = i + 1
-        i += 1
-    tail = obj_body[token_start:].strip()
-    if tail:
-        items.append(tail)
-    return items
-
-
-def _resolve_import_path(repo_root: Path, current_file: Path, module_path: str) -> Path | None:
-    candidates: list[Path] = []
-    if module_path.startswith("@app/"):
-        rel = module_path[len("@app/") :]
-        candidates.extend(
-            [
-                repo_root / "frontend/src/core" / f"{rel}.ts",
-                repo_root / "frontend/src/core" / f"{rel}.tsx",
-                repo_root / "frontend/src/saas" / f"{rel}.ts",
-                repo_root / "frontend/src/saas" / f"{rel}.tsx",
-                repo_root / "frontend/src" / f"{rel}.ts",
-                repo_root / "frontend/src" / f"{rel}.tsx",
-            ]
-        )
-    elif module_path.startswith("."):
-        base = (current_file.parent / module_path).resolve()
-        candidates.extend([Path(f"{base}.ts"), Path(f"{base}.tsx")])
-    for candidate in candidates:
-        if candidate.exists():
-            return candidate
-    return None
-
-
-def _parse_literal_value(value: str, resolver: Callable[[str], dict[str, Any] | None]) -> Any:
-    value = value.strip()
-    if not value:
-        return None
-    if value.startswith("{") and value.endswith("}"):
-        return _parse_object_literal(value, resolver)
-    if value.startswith("[") and value.endswith("]"):
-        inner = value[1:-1].strip()
-        if not inner:
-            return []
-        return [_parse_literal_value(item, resolver) for item in _split_top_level_items(inner)]
-    if value.startswith(("'", '"')) and value.endswith(("'", '"')):
-        return value[1:-1]
-    if value in {"true", "false"}:
-        return value == "true"
-    if value == "null":
-        return None
-    if re.fullmatch(r"-?\d+", value):
-        return int(value)
-    if re.fullmatch(r"-?\d+\.\d+", value):
-        return float(value)
-    resolved = resolver(value)
-    if resolved is not None:
-        return resolved
-    return None
-
-
-def _parse_object_literal(obj_text: str, resolver: Callable[[str], dict[str, Any] | None]) -> dict[str, Any]:
-    body = obj_text.strip()[1:-1]
-    result: dict[str, Any] = {}
-    for item in _split_top_level_items(body):
-        if item.startswith("..."):
-            spread_name = item[3:].strip()
-            spread = resolver(spread_name)
-            if isinstance(spread, dict):
-                result.update(spread)
-            continue
-        if ":" not in item:
-            continue
-        key, raw_value = item.split(":", 1)
-        key = key.strip().strip("'\"")
-        result[key] = _parse_literal_value(raw_value.strip(), resolver)
-    return result
-
-
-def _extract_imports(source: str) -> dict[str, str]:
-    imports: dict[str, str] = {}
-    for names, module_path in IMPORT_RE.findall(source):
-        for part in names.split(","):
-            segment = part.strip()
-            if not segment:
-                continue
-            if " as " in segment:
-                original, alias = [x.strip() for x in segment.split(" as ", 1)]
-                imports[alias] = module_path
-                imports[original] = module_path
-            else:
-                imports[segment] = module_path
-    return imports
-
-
-def _resolve_object_identifier(repo_root: Path, file_path: Path, source: str, identifier: str) -> dict[str, Any] | None:
-    var_pattern = VAR_OBJ_RE_TEMPLATE.format(name=re.escape(identifier))
-    block = _extract_block(source, var_pattern)
-    imports = _extract_imports(source)
-
-    def resolver(name: str) -> dict[str, Any] | None:
-        local_block = _extract_block(source, VAR_OBJ_RE_TEMPLATE.format(name=re.escape(name)))
-        if local_block:
-            return _parse_object_literal(local_block, resolver)
-        import_path = imports.get(name)
-        if not import_path:
-            return None
-        resolved_file = _resolve_import_path(repo_root, file_path, import_path)
-        if not resolved_file:
-            return None
-        imported_source = resolved_file.read_text(encoding="utf-8")
-        return _resolve_object_identifier(repo_root, resolved_file, imported_source, name)
-
-    if block:
-        return _parse_object_literal(block, resolver)
-    import_path = imports.get(identifier)
-    if not import_path:
-        return None
-    resolved_file = _resolve_import_path(repo_root, file_path, import_path)
-    if not resolved_file:
-        return None
-    imported_source = resolved_file.read_text(encoding="utf-8")
-    return _resolve_object_identifier(repo_root, resolved_file, imported_source, identifier)
-
-
-def _infer_py_type(value: Any) -> str:
-    if isinstance(value, bool):
-        return "bool"
-    if isinstance(value, int):
-        return "int"
-    if isinstance(value, float):
-        return "float"
-    if isinstance(value, str):
-        return "str"
-    if isinstance(value, list):
-        return "list[Any]"
-    if isinstance(value, dict):
-        return "dict[str, Any]"
-    return "Any"
-
-
-def _spec_is_none(spec: dict[str, Any]) -> bool:
-    return spec.get("kind") == "null"
-
-
-def _py_type_from_spec(spec: dict[str, Any]) -> str:
-    kind = spec.get("kind")
-    if kind == "string":
-        return "str"
-    if kind == "number":
-        return "float"
-    if kind == "boolean":
-        return "bool"
-    if kind == "date":
-        return "str"
-    if kind == "enum":
-        values = spec.get("values")
-        if isinstance(values, list) and values:
-            literal_values = ", ".join(_py_repr(v) for v in values)
-            return f"Literal[{literal_values}]"
-    if kind == "ref":
-        ref_name = spec.get("name")
-        if isinstance(ref_name, str) and ref_name.endswith("Parameters"):
-            return f"{ref_name[:-10]}Params"
-    if kind == "array":
-        element = spec.get("element")
-        inner = _py_type_from_spec(element) if isinstance(element, dict) else "Any"
-        return f"list[{inner}]"
-    if kind == "object":
-        dict_value = spec.get("dictValue")
-        if isinstance(dict_value, dict):
-            inner = _py_type_from_spec(dict_value)
-            return f"dict[str, {inner}]"
-        properties = spec.get("properties")
-        if isinstance(properties, dict) and properties:
-            property_types = {_py_type_from_spec(p) for p in properties.values() if isinstance(p, dict)}
-            if len(property_types) == 1:
-                inner = next(iter(property_types))
-                return f"dict[str, {inner}]"
-        return "dict[str, Any]"
-    if kind in {"null"}:
-        return "Any"
-    return "Any"
-
-
-def _to_class_name(tool_id: str) -> str:
-    cleaned = re.sub(r"([a-z0-9])([A-Z])", r"\1 \2", tool_id)
-    cleaned = re.sub(r"[^A-Za-z0-9]+", " ", cleaned)
-    parts = [part.capitalize() for part in cleaned.split() if part]
-    return "".join(parts) + "Params"
-
-
-def _to_snake_case(name: str) -> str:
-    snake = re.sub(r"([a-z0-9])([A-Z])", r"\1_\2", name)
-    snake = re.sub(r"[^A-Za-z0-9]+", "_", snake).strip("_").lower()
-    if not snake:
-        snake = "param"
-    if snake[0].isdigit():
-        snake = f"param_{snake}"
-    if keyword.iskeyword(snake):
-        snake = f"{snake}_"
-    return snake
-
-
-def _build_field_name_map(params: dict[str, Any]) -> dict[str, str]:
-    field_map: dict[str, str] = {}
-    used: set[str] = set()
-    for original_key in sorted(params):
-        base_name = _to_snake_case(original_key)
-        candidate = base_name
-        suffix = 2
-        while candidate in used:
-            candidate = f"{base_name}_{suffix}"
-            suffix += 1
-        used.add(candidate)
-        field_map[original_key] = candidate
-    return field_map
-
-
-def _to_enum_member_name(tool_id: str) -> str:
-    return _to_snake_case(tool_id).upper()
-
-
-def _build_enum_member_map(specs: list[ToolModelSpec]) -> dict[str, str]:
-    member_map: dict[str, str] = {}
-    used: set[str] = set()
-    for spec in specs:
-        base_name = _to_enum_member_name(spec.tool_id)
-        candidate = base_name
-        suffix = 2
-        while candidate in used:
-            candidate = f"{base_name}_{suffix}"
-            suffix += 1
-        used.add(candidate)
-        member_map[spec.tool_id] = candidate
-    return member_map
-
-
-def _py_repr(value: Any) -> str:
-    return (
-        json.dumps(value, ensure_ascii=True).replace("true", "True").replace("false", "False").replace("null", "None")
+    # Namespaces exposed to the LLM as callable tools. Largely matches ``InternalApiClient.java``.
+    # Note: ``/api/v1/filter/`` is intentionally excluded because those APIs are for pipeline processing,
+    #  not tool execution.
+    ALLOWED_PATH_PREFIXES = (
+        "/api/v1/general/",
+        "/api/v1/misc/",
+        "/api/v1/security/",
+        "/api/v1/convert/",
     )
 
+    def __init__(self, spec: dict[str, Any]):
+        resource = Resource.from_contents(spec, default_specification=DRAFT202012)
+        self.resolver = Registry().with_resource("", resource).resolver()
+        self.spec = spec
 
-def discover_tool_specs(repo_root: Path) -> list[ToolModelSpec]:
-    frontend_dir = repo_root / "frontend"
-    extractor = frontend_dir / "scripts/export-tool-specs.ts"
-    command = ["node", "--import", "tsx", str(extractor)]
-    result = subprocess.run(
-        command,
-        check=True,
-        capture_output=True,
-        text=True,
-        cwd=str(frontend_dir),
+    def discover(self) -> DiscoveryResult:
+        tools: list[ToolSpec] = []
+        defs: dict[str, Any] = {}
+        used_enum: set[str] = set()
+        used_class: set[str] = set()
+
+        for path, path_item in sorted(self.spec.get("paths", {}).items()):
+            if "{" in path or not any(path.startswith(p) for p in self.ALLOWED_PATH_PREFIXES):
+                continue
+            properties = self._get_request_properties(path_item)
+            if not properties:
+                continue
+            clean_props = self._filter_properties(properties)
+            if not clean_props:
+                continue
+
+            enum_name = _deduplicate(_path_to_enum_name(path), used_enum)
+            class_name = _deduplicate(_path_to_class_name(path), used_class)
+
+            defs[class_name] = {"type": "object", "properties": clean_props}
+            tools.append(ToolSpec(path, enum_name, class_name))
+
+        combined_schema: dict[str, Any] = {
+            "$defs": defs,
+            "anyOf": [{"$ref": f"#/$defs/{t.class_name}"} for t in tools],
+        }
+        return DiscoveryResult(tools=tools, combined_schema=combined_schema)
+
+    def _resolve_ref(self, schema: dict[str, Any]) -> dict[str, Any]:
+        if "$ref" in schema:
+            return self.resolver.lookup(schema["$ref"]).contents
+        return schema
+
+    def _get_request_properties(self, path_item: dict[str, Any]) -> dict[str, Any] | None:
+        post = path_item.get("post")
+        if not post:
+            return None
+        content = post.get("requestBody", {}).get("content", {})
+        for media_type in ("multipart/form-data", "application/json"):
+            if media_type in content:
+                schema = content[media_type].get("schema")
+                if schema:
+                    return self._resolve_ref(schema).get("properties")
+        return None
+
+    def _filter_properties(self, properties: dict[str, Any]) -> dict[str, Any]:
+        """Remove base-class fields and binary upload fields, resolving any $refs."""
+        clean: dict[str, Any] = {}
+        for name, prop in properties.items():
+            if name in BASE_CLASS_FIELDS:
+                continue
+            prop = self._resolve_ref(prop)
+            if prop.get("type") == "string" and prop.get("format") == "binary":
+                continue
+            clean[name] = prop
+        return clean
+
+
+def _tool_name_segments(path: str) -> str:
+    """Extract a descriptive name from the endpoint path.
+
+    Converters use two segments (e.g. /api/v1/convert/cbr/pdf → cbr-to-pdf).
+    Other tools use the last segment (e.g. /api/v1/misc/compress-pdf → compress-pdf).
+    """
+    parts = path.rstrip("/").split("/")
+    if "/api/v1/convert/" in path and len(parts) >= 6:
+        return f"{parts[-2]}-to-{parts[-1]}"
+    return parts[-1]
+
+
+def _path_to_enum_name(path: str) -> str:
+    return _tool_name_segments(path).replace("-", "_").upper()
+
+
+def _path_to_class_name(path: str) -> str:
+    return "".join(p.capitalize() for p in _tool_name_segments(path).split("-")) + "Params"
+
+
+def _deduplicate(name: str, used: set[str]) -> str:
+    """Return name, appending 2, 3, ... if already in used. Adds result to used."""
+    candidate = name
+    n = 2
+    while candidate in used:
+        candidate = f"{name}{n}"
+        n += 1
+    used.add(candidate)
+    return candidate
+
+
+def generate_models_code(combined_schema: dict[str, Any]) -> str:
+    """Run datamodel-code-generator once on the combined schema."""
+    code = generate(
+        input_=json.dumps(combined_schema, sort_keys=True),
+        input_file_type=InputFileType.JsonSchema,
+        output_model_type=DataModelType.PydanticV2BaseModel,
+        target_python_version=PythonVersion.PY_313,
+        snake_case_field=True,
+        base_class="stirling.models.base.ApiModel",
+        field_constraints=True,
+        no_alias=True,
+        set_default_enum_member=True,
+        additional_imports=["enum.StrEnum"],
+        enable_version_header=False,
+        custom_file_header=_FILE_HEADER,
+        formatters=[Formatter.RUFF_FORMAT, Formatter.RUFF_CHECK],
+        settings_path=_ENGINE_ROOT / "pyproject.toml",
     )
-    raw = json.loads(result.stdout)
-    specs: list[ToolModelSpec] = []
-    for item in raw:
-        tool_id = item.get("tool_id")
-        if not isinstance(tool_id, str) or not tool_id:
-            continue
-        params = item.get("params")
-        param_types = item.get("param_types")
-        specs.append(
-            ToolModelSpec(
-                tool_id=tool_id,
-                params=params if isinstance(params, dict) else {},
-                param_types=param_types if isinstance(param_types, dict) else {},
-            )
-        )
-    return sorted(specs, key=lambda spec: spec.tool_id)
+    return str(code or "")
 
 
-def write_models_module(out_path: Path, specs: list[ToolModelSpec]) -> None:
-    lines: list[str] = [
-        TOOL_MODELS_HEADER,
-        "from __future__ import annotations\n\n",
-        "from enum import StrEnum\n",
-        "from typing import Any, Literal\n\n",
-        "from stirling.models.base import ApiModel\n",
+def write_output(out_path: Path, tools: list[ToolSpec], models_code: str) -> None:
+    union_lines = ["type ParamToolModel = ("]
+    for i, tool in enumerate(tools):
+        prefix = "    | " if i > 0 else "    "
+        union_lines.append(f"{prefix}{tool.class_name}")
+    union_lines.append(")")
+    union_lines.append("type ParamToolModelType = type[ParamToolModel]")
+
+    enum_lines = [
+        "class ToolEndpoint(StrEnum):",
+        *(f'    {t.enum_name} = "{t.path}"' for t in tools),
     ]
 
-    class_names: dict[str, str] = {spec.tool_id: _to_class_name(spec.tool_id) for spec in specs}
-    class_name_to_tool_id = {name: tool_id for tool_id, name in class_names.items()}
+    ops_lines = [
+        "OPERATIONS: dict[ToolEndpoint, ParamToolModelType] = {",
+        *(f"    ToolEndpoint.{t.enum_name}: {t.class_name}," for t in tools),
+        "}",
+    ]
 
-    def extract_class_dependencies(spec: ToolModelSpec) -> set[str]:
-        deps: set[str] = set()
-        if not isinstance(spec.param_types, dict):
-            return deps
-        for entry in spec.param_types.values():
-            if not isinstance(entry, dict):
-                continue
-            type_spec = entry
-            if "type" in entry and isinstance(entry.get("type"), dict):
-                type_spec = entry["type"]
-            if not isinstance(type_spec, dict):
-                continue
-            if type_spec.get("kind") != "ref":
-                continue
-            ref_name = type_spec.get("name")
-            if isinstance(ref_name, str) and ref_name.endswith("Parameters"):
-                ref_class = f"{ref_name[:-10]}Params"
-                if ref_class in class_name_to_tool_id:
-                    deps.add(ref_class)
-        return deps
-
-    dependencies_by_class: dict[str, set[str]] = {}
-    for spec in specs:
-        class_name = class_names[spec.tool_id]
-        dependencies_by_class[class_name] = extract_class_dependencies(spec)
-
-    remaining = set(class_names.values())
-    ordered_class_names: list[str] = []
-    while remaining:
-        progress = False
-        for class_name in sorted(remaining):
-            deps = dependencies_by_class.get(class_name, set())
-            if deps.issubset(set(ordered_class_names)):
-                ordered_class_names.append(class_name)
-                remaining.remove(class_name)
-                progress = True
-                break
-        if not progress:
-            ordered_class_names.extend(sorted(remaining))
-            break
-
-    ordered_specs = [next(spec for spec in specs if class_names[spec.tool_id] == name) for name in ordered_class_names]
-
-    for spec in ordered_specs:
-        class_name = class_names[spec.tool_id]
-        lines.append(f"class {class_name}(ApiModel):\n")
-        all_param_keys = set(spec.params)
-        if isinstance(spec.param_types, dict):
-            all_param_keys.update(spec.param_types.keys())
-
-        if not all_param_keys:
-            lines.append("    pass\n\n\n")
-            continue
-
-        field_name_map = _build_field_name_map({key: True for key in all_param_keys})
-        for key in sorted(all_param_keys):
-            field_name = field_name_map[key]
-            value = spec.params.get(key)
-            type_spec = spec.param_types.get(key) if isinstance(spec.param_types, dict) else None
-            if isinstance(type_spec, dict):
-                py_type = _py_type_from_spec(type_spec)
-            else:
-                py_type = _infer_py_type(value)
-
-            if value is None and (isinstance(type_spec, dict) and _spec_is_none(type_spec)):
-                if py_type != "Any" and "| None" not in py_type:
-                    py_type = f"{py_type} | None"
-                lines.append(f"    {field_name}: {py_type} = None\n")
-            elif value is None:
-                lines.append(f"    {field_name}: {py_type} | None = None\n")
-            else:
-                if isinstance(type_spec, dict) and type_spec.get("kind") == "ref" and isinstance(value, dict):
-                    lines.append(f"    {field_name}: {py_type} = {py_type}.model_validate({_py_repr(value)})\n")
-                    continue
-                lines.append(f"    {field_name}: {py_type} = {_py_repr(value)}\n")
-        lines.append("\n\n")
-
-    if class_names:
-        union_members = " | ".join(class_names[tool_id] for tool_id in sorted(class_names))
-        lines.append(f"type ParamToolModel = {union_members}\n")
-        lines.append("type ParamToolModelType = type[ParamToolModel]\n\n")
-    else:
-        lines.append("type ParamToolModel = ApiModel\n")
-        lines.append("type ParamToolModelType = type[ParamToolModel]\n\n")
-
-    enum_member_map = _build_enum_member_map(specs)
-
-    lines.append("class OperationId(StrEnum):\n")
-
-    for spec in specs:
-        lines.append(f"    {enum_member_map[spec.tool_id]} = {spec.tool_id!r}\n")
-
-    lines.extend(
-        [
-            "\n\n",
-            "OPERATIONS: dict[OperationId, ParamToolModelType] = {\n",
-        ]
-    )
-
-    for spec in specs:
-        model_name = _to_class_name(spec.tool_id)
-        lines.append(f"    OperationId.{enum_member_map[spec.tool_id]}: {model_name},\n")
-    lines.append("}\n")
-    out_path.write_text("".join(lines), encoding="utf-8")
+    parts = [models_code, "\n", *union_lines, "\n", *enum_lines, "\n", *ops_lines, ""]
+    out_path.write_text("\n".join(parts), encoding="utf-8")
 
 
 def main() -> None:
-    parser = argparse.ArgumentParser(description="Generate tool models from frontend TypeScript tool definitions")
-    parser.add_argument("--spec", help="Deprecated (ignored)", default="")
-    parser.add_argument("--output", default="", help="Path to tool_models.py")
-    parser.add_argument("--ai-output", default="", help="Deprecated (ignored)")
+    parser = argparse.ArgumentParser(description="Generate Python tool models from Java OpenAPI spec")
+    parser.add_argument("--spec", required=True, help="Path to SwaggerDoc.json")
+    parser.add_argument("--output", required=True, help="Path to output tool_models.py")
     args = parser.parse_args()
 
-    repo_root = Path(__file__).resolve().parents[3]
-    specs = discover_tool_specs(repo_root)
+    spec_path = Path(args.spec)
+    if not spec_path.exists():
+        raise SystemExit(f"OpenAPI spec not found at {spec_path}\nRun 'task engine:tool-models' to generate it.")
+    output_path = Path(args.output)
 
-    output_path = Path(args.output) if args.output else (repo_root / "src/stirling/models/tool_models.py")
+    with open(spec_path) as f:
+        spec = json.load(f)
 
-    write_models_module(output_path, specs)
-    print(f"Wrote {len(specs)} tool model specs")
+    result = ToolDiscovery(spec).discover()
+    models_code = generate_models_code(result.combined_schema)
+    write_output(output_path, result.tools, models_code)
+
+    print(f"Generated {len(result.tools)} tool models from {spec_path.name}")
+    for tool in result.tools:
+        print(f"  {tool.enum_name}: {tool.path} → {tool.class_name}")
 
 
 if __name__ == "__main__":
diff --git a/engine/scripts/setup_env.py b/engine/scripts/setup_env.py
index 9626e2c8cf..c459679238 100644
--- a/engine/scripts/setup_env.py
+++ b/engine/scripts/setup_env.py
@@ -1,48 +1,24 @@
 """
-Copies .env from .env.example if missing, and errors if any keys from the example
-are absent from the actual .env file.
+Ensures `.env.local` exists so developers have a place to put overrides
+(API keys, local model choices, etc.) without touching the committed `.env`.
 
 Usage:
     uv run scripts/setup_env.py
 """
 
-import os
-import shutil
-import sys
 from pathlib import Path
 
-from dotenv import dotenv_values
-
 ROOT = Path(__file__).parent.parent
-EXAMPLE_FILE = ROOT / "config" / ".env.example"
-ENV_FILE = ROOT / ".env"
+ENV_LOCAL_FILE = ROOT / ".env.local"
 
-print("setup-env: see engine/config/.env.example for documentation")
+TEMPLATE = """\
+###############################################################################
+# Local overrides for `engine/.env`
+# Put API keys and machine-specific settings here. Any variable defined here
+# takes precedence over the committed `.env`
+###############################################################################
+"""
 
-if not EXAMPLE_FILE.exists():
-    print(f"setup-env: {EXAMPLE_FILE.name} not found, skipping", file=sys.stderr)
-    sys.exit(0)
-
-if not ENV_FILE.exists():
-    shutil.copy(EXAMPLE_FILE, ENV_FILE)
-    print("setup-env: created .env from .env.example")
-
-env_keys = set(dotenv_values(ENV_FILE).keys()) | set(os.environ.keys())
-example_keys = set(dotenv_values(EXAMPLE_FILE).keys())
-missing = sorted(example_keys - env_keys)
-
-if missing:
-    sys.exit(
-        "setup-env: .env is missing keys from .env.example:\n"
-        + "\n".join(f"  {k}" for k in missing)
-        + "\n  Add them manually or delete your local .env to re-copy from config/.env.example."
-    )
-
-extra = sorted(k for k in dotenv_values(ENV_FILE) if k.startswith("STIRLING_") and k not in example_keys)
-if extra:
-    print(
-        "setup-env: .env contains STIRLING_ keys not in config/.env.example:\n"
-        + "\n".join(f"  {k}" for k in extra)
-        + "\n  Add them to config/.env.example if they are intentional.",
-        file=sys.stderr,
-    )
+if not ENV_LOCAL_FILE.exists():
+    ENV_LOCAL_FILE.write_text(TEMPLATE)
+    print("setup-env: created empty .env.local for local overrides")
diff --git a/engine/src/stirling/agents/ledger/__init__.py b/engine/src/stirling/agents/ledger/__init__.py
new file mode 100644
index 0000000000..a6b4831f4f
--- /dev/null
+++ b/engine/src/stirling/agents/ledger/__init__.py
@@ -0,0 +1,5 @@
+"""Math Auditor Agent (mathAuditorAgent) — AI-powered math validation for PDF documents."""
+
+from .agent import MathAuditorAgent
+
+__all__ = ["MathAuditorAgent"]
diff --git a/engine/src/stirling/agents/ledger/agent.py b/engine/src/stirling/agents/ledger/agent.py
new file mode 100644
index 0000000000..f000b604e4
--- /dev/null
+++ b/engine/src/stirling/agents/ledger/agent.py
@@ -0,0 +1,550 @@
+"""
+Math Auditor Agent (mathAuditorAgent) — pydantic-ai agents for PDF math validation.
+
+Examiner  (Round 1, /api/v1/ai/math-auditor-agent/examine)
+    Receives a FolioManifest and returns a Requisition declaring what
+    Java must extract before validation can begin.
+
+Audit pipeline  (Round 2, /api/v1/ai/math-auditor-agent/deliberate)
+    Processes Evidence per-page:
+      1. Deterministic pass — ArithmeticScanner on every folio
+      2. Fast-model pass  — extract named figures from each page
+      3. FigureTracker    — cross-page consistency check
+      4. Fast-model call  — generate human-readable summary
+      5. Assemble Verdict programmatically
+
+Neither agent ever touches a PDF file. All content arrives pre-extracted
+by Java, which owns the PDF from start to finish.
+"""
+
+from __future__ import annotations
+
+import asyncio
+import logging
+from collections.abc import Coroutine
+from decimal import Decimal, InvalidOperation
+from typing import Any
+
+from pydantic import BaseModel, Field
+from pydantic_ai import Agent
+from pydantic_ai.exceptions import AgentRunError
+
+from stirling.contracts.ledger import (
+    Discrepancy,
+    DiscrepancyKind,
+    Evidence,
+    Folio,
+    FolioManifest,
+    Requisition,
+    Severity,
+    Verdict,
+)
+from stirling.logging import Pretty
+from stirling.services import AppRuntime
+
+from .prompts import (
+    EXAMINER_SYSTEM_PROMPT,
+    FIGURE_EXTRACTOR_PROMPT,
+    STATEMENT_VERIFIER_PROMPT,
+    SUMMARY_PROMPT,
+    TABLE_FORMULA_PROMPT,
+)
+from .validators import ArithmeticScanner, FigureTracker, FormulaEvaluator
+
+logger = logging.getLogger(__name__)
+
+
+# ---------------------------------------------------------------------------
+# Structured output models for the per-page figure extractor
+# ---------------------------------------------------------------------------
+
+
+class ExtractedFigure(BaseModel):
+    """A single named figure found on a page."""
+
+    label: str = Field(description="Normalised name, e.g. 'Total Revenue', 'VAT'.")
+    value: str = Field(description="Numeric value as a string, e.g. '1200.00'.")
+    raw: str = Field(description="Original text from the document, e.g. '£1,200.00'.")
+
+
+class FigureExtractionResult(BaseModel):
+    """All named figures found on a single page."""
+
+    figures: list[ExtractedFigure] = Field(default_factory=list)
+
+
+class FormulaCheck(BaseModel):
+    """One verifiable mathematical relationship in a table."""
+
+    description: str = Field(description="Human-readable, e.g. 'Line Total = Qty × Unit Price'")
+    formula: str = Field(description="Expression: 'col3 = col1 * col2' or 'cell(4,3) = sum(col3, 1-3)'")
+    scope: str = Field(description="'each_row' | 'column_total' | 'single_cell'")
+    row_range: list[int] | None = Field(default=None, description="Data rows to check (for each_row scope)")
+    target_row: int | None = Field(default=None, description="Row index of total (for column_total/single_cell)")
+    target_col: int | None = Field(default=None, description="Column index (for column_total/single_cell)")
+
+
+class TableFormulas(BaseModel):
+    """All verifiable formulas found in one table."""
+
+    formulas: list[FormulaCheck] = Field(default_factory=list)
+
+
+class StatementCheck(BaseModel):
+    """One prose claim and its verification result."""
+
+    claim: str = Field(description="The exact text of the claim")
+    verification: str = Field(description="Type: percentage_change, comparison, ratio, trend, average, other")
+    values_referenced: list[str] = Field(default_factory=list, description="Numbers used in the check")
+    expected_result: str = Field(description="What the calculation actually yields")
+    actual_claim: str = Field(description="What the text claims")
+    is_valid: bool = Field(description="True if the claim is correct within tolerance")
+    explanation: str = Field(description="One-line working showing the calculation")
+
+
+class StatementsResult(BaseModel):
+    """All verifiable prose claims found on a page."""
+
+    statements: list[StatementCheck] = Field(default_factory=list)
+
+
+# ---------------------------------------------------------------------------
+# MathAuditorAgent — main entry point, instantiated once at startup
+# ---------------------------------------------------------------------------
+
+
+class MathAuditorAgent:
+    """
+    Encapsulates the Ledger Auditor pipeline.
+
+    Instantiated once at app startup with an AppRuntime, which provides
+    pre-built Model objects and ModelSettings.
+    """
+
+    def __init__(self, runtime: AppRuntime) -> None:
+        fast_model = runtime.fast_model
+        model_settings = runtime.fast_model_settings
+        self._runtime = runtime
+        self._examiner = Agent(
+            model=fast_model,
+            deps_type=FolioManifest,
+            output_type=Requisition,
+            system_prompt=EXAMINER_SYSTEM_PROMPT,
+            model_settings=model_settings,
+        )
+        self._figure_extractor = Agent(
+            model=fast_model,
+            output_type=FigureExtractionResult,
+            system_prompt=FIGURE_EXTRACTOR_PROMPT,
+            model_settings=model_settings,
+        )
+        self._table_analyser = Agent(
+            model=fast_model,
+            output_type=TableFormulas,
+            system_prompt=TABLE_FORMULA_PROMPT,
+            model_settings=model_settings,
+        )
+        self._statement_verifier = Agent(
+            model=fast_model,
+            output_type=StatementsResult,
+            system_prompt=STATEMENT_VERIFIER_PROMPT,
+            model_settings=model_settings,
+        )
+        self._summary_agent = Agent(
+            model=fast_model,
+            output_type=str,
+            system_prompt=SUMMARY_PROMPT,
+            model_settings=model_settings,
+        )
+        self._llm_semaphore = asyncio.Semaphore(10)
+
+    # ------------------------------------------------------------------
+    # Round 1: Examine
+    # ------------------------------------------------------------------
+
+    async def examine(self, manifest: FolioManifest) -> Requisition:
+        """Inspect a FolioManifest and declare the Requisition."""
+        logger.info(
+            "[math-auditor-agent] session=%s round=%d examining %d folios",
+            manifest.session_id,
+            manifest.round,
+            manifest.page_count,
+        )
+
+        user_prompt = "Examine this folio manifest and declare your requisition:\n" + manifest.model_dump_json()
+        logger.debug("REQUEST (examine)\n%s", Pretty({"user_prompt": user_prompt}))
+
+        result = await self._examiner.run(user_prompt, deps=manifest)
+        req = result.output
+
+        logger.debug("RESPONSE (examine)\n%s", Pretty(req.model_dump()))
+        logger.info(
+            "[math-auditor-agent] session=%s requisition: text=%s tables=%s ocr=%s",
+            manifest.session_id,
+            req.need_text,
+            req.need_tables,
+            req.need_ocr,
+        )
+        return req
+
+    # ------------------------------------------------------------------
+    # Round 2: Deliberate (deterministic-first pipeline)
+    # ------------------------------------------------------------------
+
+    async def audit(self, evidence: Evidence, tolerance: Decimal = Decimal("0.01")) -> Verdict:
+        """
+        Audit the evidence using a deterministic-first pipeline:
+
+        1. Run ArithmeticScanner on every folio (no LLM)
+        2. Extract named figures per-page with fast model
+        3. Run FigureTracker cross-page consistency check (no LLM)
+        4. Generate human summary with fast model
+        5. Assemble Verdict
+        """
+        return await self._audit_inner(evidence, tolerance)
+
+    async def _audit_inner(
+        self,
+        evidence: Evidence,
+        tolerance: Decimal,
+    ) -> Verdict:
+        logger.info(
+            "[math-auditor-agent] session=%s round=%d auditing %d folios (final=%s)",
+            evidence.session_id,
+            evidence.round,
+            len(evidence.folios),
+            evidence.final_round,
+        )
+
+        all_discrepancies: list[Discrepancy] = []
+        pages_examined: list[int] = []
+        figure_tracker = FigureTracker(tolerance=tolerance)
+
+        # Step 1: Arithmetic scanning (deterministic, instant)
+        arithmetic_scanner = ArithmeticScanner(tolerance=tolerance)
+        for folio in evidence.folios:
+            pages_examined.append(folio.page)
+            text = folio.readable_text
+            if text and text.strip():
+                results = arithmetic_scanner.scan(folio.page, text)
+                all_discrepancies.extend(results)
+                logger.debug(
+                    "TOOL (scan_arithmetic)\nArgs: %s\nResult: %s",
+                    Pretty({"page": folio.page, "text_length": len(text)}),
+                    Pretty([d.model_dump() for d in results]),
+                )
+
+        # Step 2: Parallel LLM calls — formula inference + figure extraction
+        # These are independent per-page so we fire them all concurrently.
+        formula_evaluator = FormulaEvaluator(tolerance=tolerance)
+        folios_with_text = [f for f in evidence.folios if f.readable_text.strip()]
+
+        # Collect all tables as (page, csv) pairs for formula inference
+        table_tasks: list[tuple[int, str]] = []
+        for folio in evidence.folios:
+            if folio.tables:
+                for table_csv in folio.tables:
+                    table_tasks.append((folio.page, table_csv))
+
+        logger.info(
+            "[math-auditor-agent] session=%s step 2: %d formula + %d figure LLM calls (parallel)",
+            evidence.session_id,
+            len(table_tasks),
+            len(folios_with_text),
+        )
+
+        # Fire all LLM calls concurrently (bounded by _llm_semaphore)
+        formula_coros = [self._throttled(self._infer_formulas(csv)) for _, csv in table_tasks]
+        figure_coros = [self._throttled(self._extract_figures_for_page(f)) for f in folios_with_text]
+        statement_coros = [self._throttled(self._verify_statements(f)) for f in folios_with_text]
+        all_results = await asyncio.gather(
+            *formula_coros,
+            *figure_coros,
+            *statement_coros,
+            return_exceptions=True,
+        )
+
+        n_formulas = len(table_tasks)
+        n_figures = len(folios_with_text)
+
+        # Process formula results
+        for i, (page, table_csv) in enumerate(table_tasks):
+            result = all_results[i]
+            if isinstance(result, BaseException):
+                logger.warning("[math-auditor-agent] formula inference failed for page %d: %s", page, result)
+                continue
+            assert isinstance(result, TableFormulas)
+            formulas = result
+            if not formulas.formulas:
+                logger.info("[math-auditor-agent] page %d: no verifiable formulas found", page)
+                continue
+            for fc in formulas.formulas:
+                checked = formula_evaluator.evaluate(
+                    page=page,
+                    table_csv=table_csv,
+                    formula=fc.formula,
+                    scope=fc.scope,
+                    description=fc.description,
+                    row_range=fc.row_range,
+                    target_row=fc.target_row,
+                    target_col=fc.target_col,
+                )
+                all_discrepancies.extend(checked)
+                logger.debug(
+                    "TOOL (check_formula)\nArgs: %s\nResult: %s",
+                    Pretty({"page": page, "formula": fc.formula, "scope": fc.scope, "description": fc.description}),
+                    Pretty([d.model_dump() for d in checked]),
+                )
+
+        # Process figure results
+        for i, folio in enumerate(folios_with_text):
+            result = all_results[n_formulas + i]
+            if isinstance(result, BaseException):
+                logger.warning("[math-auditor-agent] figure extraction failed for page %d: %s", folio.page, result)
+                continue
+            assert isinstance(result, list)
+            for fig, page in result:
+                try:
+                    decimal_value = Decimal(fig.value.replace(",", "").strip())
+                except (InvalidOperation, ValueError):
+                    logger.warning(
+                        "[math-auditor-agent] skipping figure %r on page %d: non-numeric value %r",
+                        fig.label,
+                        page,
+                        fig.value,
+                    )
+                    continue
+                figure_tracker.record(
+                    label=fig.label,
+                    value=decimal_value,
+                    page=page,
+                    raw=fig.raw,
+                )
+
+        # Process statement verification results
+        for i, folio in enumerate(folios_with_text):
+            result = all_results[n_formulas + n_figures + i]
+            if isinstance(result, BaseException):
+                logger.warning("[math-auditor-agent] statement verification failed for page %d: %s", folio.page, result)
+                continue
+            assert isinstance(result, StatementsResult)
+            stmts = result
+            for sc in stmts.statements:
+                if not sc.is_valid:
+                    all_discrepancies.append(
+                        Discrepancy(
+                            page=folio.page,
+                            kind=DiscrepancyKind.STATEMENT,
+                            severity=Severity.ERROR,
+                            description=f"{sc.claim}: {sc.explanation}",
+                            stated=sc.actual_claim,
+                            expected=sc.expected_result,
+                            context=sc.claim,
+                        )
+                    )
+                logger.debug(
+                    "TOOL (verify_statement)\nArgs: %s\nResult: %s",
+                    Pretty({"page": folio.page, "claim": sc.claim}),
+                    Pretty(sc.model_dump()),
+                )
+
+        logger.info(
+            "[math-auditor-agent] session=%s step 2 complete: %d figures registered",
+            evidence.session_id,
+            figure_tracker.entry_count,
+        )
+
+        # Step 3: Cross-page consistency — deterministic
+        consistency_discrepancies = figure_tracker.conflicts()
+        all_discrepancies.extend(consistency_discrepancies)
+        if consistency_discrepancies:
+            logger.debug(
+                "TOOL (check_figure_consistency)\nResult: %s",
+                Pretty([d.model_dump() for d in consistency_discrepancies]),
+            )
+
+        # Step 4: Summary — fast model, small payload
+        # Collect verification stats for the summary
+        total_tables = sum(len(f.tables) for f in evidence.folios if f.tables)
+        total_formulas_checked = sum(len(r.formulas) for r in all_results[:n_formulas] if isinstance(r, TableFormulas))
+        total_statements_checked = sum(
+            len(r.statements) for r in all_results[n_formulas + n_figures :] if isinstance(r, StatementsResult)
+        )
+        verification_stats = (
+            f"Verified: {len(pages_examined)} pages, {total_tables} tables "
+            f"({total_formulas_checked} formulas), "
+            f"{figure_tracker.entry_count} figures tracked, "
+            f"{total_statements_checked} prose claims checked."
+        )
+
+        logger.info(
+            "[math-auditor-agent] session=%s step 4: generating summary (%d discrepancies)",
+            evidence.session_id,
+            len(all_discrepancies),
+        )
+        pages_examined.sort()
+        summary = await self._generate_summary(
+            all_discrepancies,
+            pages_examined,
+            evidence.unauditable_pages,
+            verification_stats,
+        )
+
+        # Step 5: Assemble Verdict
+        error_count = sum(1 for d in all_discrepancies if d.severity == Severity.ERROR)
+        verdict = Verdict(
+            session_id=evidence.session_id,
+            discrepancies=all_discrepancies,
+            pages_examined=pages_examined,
+            rounds_taken=evidence.round,
+            summary=summary,
+            clean=error_count == 0,
+            unauditable_pages=evidence.unauditable_pages,
+        )
+
+        logger.debug("RESPONSE (deliberate)\n%s", Pretty(verdict.model_dump()))
+        logger.info(
+            "[math-auditor-agent] session=%s verdict: %d errors, %d warnings, clean=%s",
+            evidence.session_id,
+            verdict.error_count,
+            verdict.warning_count,
+            verdict.clean,
+        )
+        return verdict
+
+    # ------------------------------------------------------------------
+    # Internal helpers
+    # ------------------------------------------------------------------
+
+    async def _throttled[T](self, coro: Coroutine[Any, Any, T]) -> T:
+        """Wrap a coroutine with the LLM concurrency semaphore."""
+        async with self._llm_semaphore:
+            return await coro
+
+    async def _infer_formulas(self, table_csv: str) -> TableFormulas:
+        """Ask the fast model to infer verifiable formulas from a CSV table."""
+        try:
+            result = await self._table_analyser.run(f"CSV table:\n{table_csv}")
+            formulas = result.output
+        except AgentRunError:
+            logger.warning("[math-auditor-agent] formula inference failed, skipping table", exc_info=True)
+            formulas = TableFormulas(formulas=[])
+
+        logger.debug(
+            "TOOL (infer_formulas)\nArgs: %s\nResult: %s",
+            Pretty({"table_csv": table_csv[:300]}),
+            Pretty(formulas.model_dump()),
+        )
+        return formulas
+
+    async def _verify_statements(
+        self,
+        folio: Folio,
+    ) -> StatementsResult:
+        """Ask the fast model to find and verify prose claims on a page."""
+        text = folio.readable_text
+        if not text or not text.strip():
+            return StatementsResult(statements=[])
+
+        # Build context: page text + any table CSVs
+        prompt = f"Page {folio.page + 1} text:\n{text}"
+        if folio.tables:
+            prompt += "\n\nTable data on this page:\n"
+            for i, csv in enumerate(folio.tables):
+                prompt += f"\nTable {i + 1}:\n{csv}"
+
+        try:
+            result = await self._statement_verifier.run(prompt)
+            stmts = result.output
+        except AgentRunError:
+            logger.warning("[math-auditor-agent] statement verification failed for page %d", folio.page, exc_info=True)
+            stmts = StatementsResult(statements=[])
+
+        if stmts.statements:
+            logger.debug(
+                "TOOL (verify_statements)\nArgs: %s\nResult: %s",
+                Pretty({"page": folio.page, "text_length": len(text), "n_tables": len(folio.tables or [])}),
+                Pretty([s.model_dump() for s in stmts.statements]),
+            )
+        return stmts
+
+    async def _extract_figures_for_page(
+        self,
+        folio: Folio,
+    ) -> list[tuple[ExtractedFigure, int]]:
+        text = folio.readable_text
+        if not text or not text.strip():
+            return []
+
+        logger.info("[math-auditor-agent] extracting figures from page %d (%d chars)", folio.page, len(text))
+        prompt = f"Page {folio.page + 1} text:\n{text}"
+        try:
+            result = await self._figure_extractor.run(prompt)
+            figures = result.output.figures
+        except AgentRunError:
+            logger.warning(
+                "[math-auditor-agent] figure extraction failed for page %d, skipping",
+                folio.page,
+                exc_info=True,
+            )
+            figures = []
+
+        logger.debug(
+            "TOOL (extract_figures)\nArgs: %s\nResult: %s",
+            Pretty({"page": folio.page, "text_length": len(text)}),
+            Pretty([f.model_dump() for f in figures]),
+        )
+
+        return [(fig, folio.page) for fig in figures]
+
+    async def _generate_summary(
+        self,
+        discrepancies: list[Discrepancy],
+        pages_examined: list[int],
+        unauditable_pages: list[int],
+        verification_stats: str,
+    ) -> str:
+        error_count = sum(1 for d in discrepancies if d.severity == Severity.ERROR)
+        warning_count = sum(1 for d in discrepancies if d.severity == Severity.WARNING)
+
+        prompt = (
+            f"{verification_stats}\n"
+            f"Errors: {error_count}, Warnings: {warning_count}, "
+            f"Pages examined: {len(pages_examined)}, "
+            f"Unauditable pages: {unauditable_pages or 'none'}.\n"
+        )
+        if discrepancies:
+            prompt += "Discrepancies:\n"
+            for d in discrepancies:
+                prompt += f"  - [{d.severity}] p{d.page + 1}: {d.description}\n"
+
+        try:
+            result = await self._summary_agent.run(prompt)
+            summary = result.output
+        except AgentRunError:
+            logger.warning("[math-auditor-agent] summary generation failed, using fallback", exc_info=True)
+            summary = self._fallback_summary(error_count, warning_count, pages_examined, unauditable_pages)
+
+        logger.debug("RESPONSE (summary)\n%s", Pretty({"summary": summary}))
+        return summary
+
+    @staticmethod
+    def _fallback_summary(
+        error_count: int,
+        warning_count: int,
+        pages_examined: list[int],
+        unauditable_pages: list[int],
+    ) -> str:
+        parts = []
+        if error_count == 0 and warning_count == 0:
+            parts.append(f"No mathematical errors found across {len(pages_examined)} pages.")
+        else:
+            if error_count:
+                parts.append(f"Found {error_count} error{'s' if error_count != 1 else ''}.")
+            if warning_count:
+                parts.append(f"Found {warning_count} warning{'s' if warning_count != 1 else ''}.")
+        if unauditable_pages:
+            parts.append(
+                f"Pages {', '.join(str(p + 1) for p in unauditable_pages)} could not be audited (OCR unavailable)."
+            )
+        return " ".join(parts)
diff --git a/engine/src/stirling/agents/ledger/prompts.py b/engine/src/stirling/agents/ledger/prompts.py
new file mode 100644
index 0000000000..78e97c4f9a
--- /dev/null
+++ b/engine/src/stirling/agents/ledger/prompts.py
@@ -0,0 +1,147 @@
+"""
+Ledger Auditor — system prompts.
+
+One prompt per role; keep them short and directive. Each agent is a
+specialist with a narrow remit, not a general assistant.
+"""
+
+EXAMINER_SYSTEM_PROMPT = """\
+You are the Examiner, the first stage of the Ledger Auditor pipeline.
+
+You receive a FolioManifest: a list of page types (text / image / mixed) \
+for a PDF document. Your sole task is to declare exactly which pages you \
+need Java to extract content from so that the Auditor can verify the \
+document's mathematics.
+
+Rules:
+- Request BOTH text AND table extraction for every 'text' or 'mixed' page. \
+  Tables are critical — the Auditor cannot verify totals without them. \
+  Tabula extraction is cheap; missing a table is not.
+- Request OCR for any page classified as 'image' or 'mixed' (PDFBox cannot \
+  read image-only content).
+- Be conservative — if in doubt, request the page. False negatives \
+  (missed errors) are worse than false positives (wasted extraction).
+- Do not request pages that are clearly decorative (cover pages, blank pages) \
+  unless you cannot tell from the manifest alone.
+- Return a Requisition with your page lists and a plain-English rationale \
+  that will appear in server logs.
+"""
+
+FIGURE_EXTRACTOR_PROMPT = """\
+You are a figure extractor for financial document auditing.
+
+You receive the text content of a single PDF page. Your task is to \
+identify every significant named numeric figure on the page.
+
+A "named figure" is a labelled number that could appear elsewhere in \
+the document under the same name — for example:
+  "Total Revenue: £1,200,000"
+  "Net Profit  $45,000"
+  "VAT (20%): 240.00"
+  "Subtotal ......... 3,500"
+
+For each figure, return:
+- label: a normalised name (e.g. "Total Revenue", "Net Profit", "VAT")
+- value: the numeric value as a plain decimal string (e.g. "1200000")
+- raw: the original text as it appears in the document
+
+Rules:
+- Only extract figures that have a clear label/name attached.
+- Do not extract bare numbers without context.
+- Strip currency symbols and thousands separators from value.
+- If a figure appears multiple times on the same page, extract each.
+- Return an empty list if no named figures are found.
+- Be precise — do not invent figures that are not in the text.
+"""
+
+TABLE_FORMULA_PROMPT = """\
+You are a table formula analyser for financial document auditing.
+
+You receive a CSV table extracted from a PDF. Your task is to identify \
+every verifiable mathematical relationship between cells.
+
+Relationships fall into three scopes:
+
+1. "each_row" — a formula that should hold for every data row.
+   Example: "col3 = col1 * col2" (Line Total = Qty × Unit Price)
+
+2. "column_total" — a total row where cells = sum of the column above.
+   Example: a Subtotal row where each cell sums the column.
+
+3. "single_cell" — one specific cell computed from others.
+   Example: "cell(5,3) = cell(4,3) * 0.1" (Tax = Subtotal × 10%)
+
+Formula syntax (use exactly this):
+  - Column references: col0, col1, col2 ... (0-indexed)
+  - Cell references: cell(row, col) — 0-indexed, header is row 0
+  - Operators: + - * /
+  - sum(colN, start-end) — sum of colN from row start to row end inclusive
+  - Decimal numbers: 0.1, 100, etc.
+
+Rules:
+- Row 0 is the header. First data row is row 1.
+- Include the left-hand side: "col3 = col1 * col2" not just "col1 * col2"
+- For column_total scope, set target_row to the total row index. \
+  Set target_col to a specific column or null to check all numeric columns.
+- For each_row scope, set row_range to the data rows (exclude header \
+  and total rows).
+- Only return formulas you are confident about. Skip columns/rows \
+  where the relationship is unclear.
+- Return an empty list if the table has no verifiable math.
+"""
+
+STATEMENT_VERIFIER_PROMPT = """\
+You are a statement verifier for financial document auditing.
+
+You receive the text of a single PDF page, plus any table data from \
+that page. Your task is to find prose claims that make mathematical \
+assertions, and verify whether each claim is correct.
+
+A "verifiable claim" is a sentence that states a mathematical fact \
+about numbers present on the page or derivable from the data. Examples:
+  - "Revenue grew 15% year-over-year"
+  - "Costs decreased month on month"
+  - "Department A represents 40% of total spend"
+  - "Net margin improved to 12.4%"
+  - "Average transaction value was $250"
+
+For each claim you find:
+1. Identify the numbers referenced in the claim
+2. Perform the calculation yourself using the data on the page
+3. Compare your result to what the claim states
+4. Determine if the claim is valid (within reasonable rounding)
+
+Return:
+- claim: the exact text of the claim
+- verification: the type — "percentage_change", "comparison", \
+  "ratio", "trend", "average", or "other"
+- values_referenced: the specific numbers used in your check
+- expected_result: what the calculation actually yields
+- actual_claim: what the text claims
+- is_valid: true if the claim is correct within 1% tolerance
+- explanation: show your working, one line
+
+Rules:
+- Only check claims that can be verified from data on this page.
+- If a claim references data not on the page, skip it.
+- "Decreased month on month" means EVERY consecutive pair decreased.
+- Percentage claims allow 1% absolute tolerance (14.8% ≈ 15%).
+- Return an empty list if there are no verifiable claims.
+- Do not fabricate claims that are not in the text.
+"""
+
+SUMMARY_PROMPT = """\
+You are a summary writer for a PDF math audit tool.
+
+You receive a list of discrepancies (errors and warnings) found in a \
+document, plus coverage statistics and a breakdown of what was verified. \
+Write a two to three sentence summary suitable for an end user.
+
+Rules:
+- Start with what was verified: e.g. "Audited 6 pages: checked 4 tables \
+  (12 formulas), scanned 6 pages for arithmetic, extracted 20 figures \
+  for cross-page consistency, and verified 3 prose claims."
+- Then state the outcome: errors found or clean.
+- Mention unauditable pages if any exist.
+- Be concise and factual. Do not repeat individual discrepancy details.
+"""
diff --git a/engine/src/stirling/agents/ledger/validators/__init__.py b/engine/src/stirling/agents/ledger/validators/__init__.py
new file mode 100644
index 0000000000..d4ba9dc1cd
--- /dev/null
+++ b/engine/src/stirling/agents/ledger/validators/__init__.py
@@ -0,0 +1,5 @@
+from .arithmetic import ArithmeticScanner
+from .figures import FigureTracker
+from .formula import FormulaEvaluator
+
+__all__ = ["ArithmeticScanner", "FigureTracker", "FormulaEvaluator"]
diff --git a/engine/src/stirling/agents/ledger/validators/_parsing.py b/engine/src/stirling/agents/ledger/validators/_parsing.py
new file mode 100644
index 0000000000..52a06271c3
--- /dev/null
+++ b/engine/src/stirling/agents/ledger/validators/_parsing.py
@@ -0,0 +1,31 @@
+"""Shared parsing helpers for ledger validators."""
+
+from __future__ import annotations
+
+import csv
+import io
+import re
+from decimal import Decimal, InvalidOperation
+
+# Strip common currency symbols and thousands separators before parsing.
+STRIP_PATTERN = re.compile(r"[£$€¥,\s]")
+
+
+def to_decimal(raw: str) -> Decimal | None:
+    """Parse a cell value to Decimal, returning None for non-numeric cells."""
+    cleaned = STRIP_PATTERN.sub("", raw.strip())
+    if not cleaned or cleaned in {"-", "—", "n/a", "N/A", "na", "NA"}:
+        return None
+    # Handle parenthesised negatives: (123.45) → -123.45
+    if cleaned.startswith("(") and cleaned.endswith(")"):
+        cleaned = "-" + cleaned[1:-1]
+    try:
+        return Decimal(cleaned)
+    except InvalidOperation:
+        return None
+
+
+def parse_csv(table_csv: str) -> list[list[str]]:
+    """Parse a CSV string into rows, dropping completely empty rows."""
+    reader = csv.reader(io.StringIO(table_csv.strip()))
+    return [row for row in reader if any(cell.strip() for cell in row)]
diff --git a/engine/src/stirling/agents/ledger/validators/arithmetic.py b/engine/src/stirling/agents/ledger/validators/arithmetic.py
new file mode 100644
index 0000000000..31856ffa8c
--- /dev/null
+++ b/engine/src/stirling/agents/ledger/validators/arithmetic.py
@@ -0,0 +1,152 @@
+"""
+ArithmeticScanner — finds and verifies inline arithmetic expressions in text.
+
+Targets patterns commonly found in financial documents:
+  "100 + 200 + 150 = 450"
+  "Total: 1,250 (500 + 400 + 350)"
+  "Net profit of £1,200 (£2,000 revenue less £800 costs)"
+
+All arithmetic is performed in Decimal. The scanner does not use an LLM —
+it is a deterministic regex-and-eval pipeline.
+"""
+
+from __future__ import annotations
+
+import logging
+import re
+from decimal import Decimal
+
+from stirling.contracts.ledger import Discrepancy, DiscrepancyKind, Severity
+
+from ._parsing import STRIP_PATTERN as _STRIP
+from ._parsing import to_decimal as _to_decimal
+
+logger = logging.getLogger(__name__)
+
+# ---------------------------------------------------------------------------
+# Regex patterns
+# ---------------------------------------------------------------------------
+
+# Currency / number token: optional sign, optional currency symbol,
+# digits with optional thousands separator and decimal point.
+_NUM = r"[£$€¥]?-?[\d,]+(?:\.\d+)?"
+
+# "A + B + C = D" or "A + B + C = D" with arbitrary spacing
+_EQUALS_EXPR = re.compile(
+    rf"({_NUM}(?:\s*[+\-]\s*{_NUM})+)\s*=\s*({_NUM})",
+    re.IGNORECASE,
+)
+
+# "Total: X (A + B + C)" — the total comes before the addends
+_TOTAL_THEN_ADDENDS = re.compile(
+    rf"(?:total|sum|grand total|subtotal)\s*[:\-]?\s*({_NUM})\s*\(({_NUM}(?:\s*[+\-]\s*{_NUM})+)\)",
+    re.IGNORECASE,
+)
+
+
+def _parse(token: str) -> Decimal | None:
+    """Parse a regex-matched token to Decimal."""
+    return _to_decimal(token)
+
+
+def _eval_expression(expr: str) -> Decimal | None:
+    """
+    Evaluate a simple additive expression of the form  A +/- B +/- C ...
+    Returns None if the expression cannot be parsed.
+    """
+    # Tokenise: split on + or -, keep the operator.
+    tokens = re.split(r"([+\-])", _STRIP.sub("", expr.strip()))
+    result = Decimal(0)
+    operator = "+"
+    for token in tokens:
+        token = token.strip()
+        if not token:
+            continue  # skip empty tokens (e.g. from leading negative)
+        if token in ("+", "-"):
+            operator = token
+            continue
+        val = _parse(token)
+        if val is None:
+            return None
+        result = result + val if operator == "+" else result - val
+    return result
+
+
+class ArithmeticScanner:
+    """
+    Scans a block of text for arithmetic expressions and checks them.
+
+    Parameters
+    ----------
+    tolerance:
+        Maximum absolute difference before an expression is flagged as wrong.
+    """
+
+    def __init__(self, tolerance: Decimal = Decimal("0.01")) -> None:
+        self.tolerance = tolerance
+
+    def scan(self, page: int, text: str) -> list[Discrepancy]:
+        """
+        Find all verifiable arithmetic expressions in *text* and return
+        a Discrepancy for each one that does not balance within tolerance.
+        """
+        discrepancies: list[Discrepancy] = []
+        discrepancies.extend(self._check_equals_expressions(page, text))
+        discrepancies.extend(self._check_total_then_addends(page, text))
+        return discrepancies
+
+    # ------------------------------------------------------------------
+    # Internal helpers
+    # ------------------------------------------------------------------
+
+    def _check_equals_expressions(self, page: int, text: str) -> list[Discrepancy]:
+        """Handle patterns like '100 + 200 = 300'."""
+        found: list[Discrepancy] = []
+        for match in _EQUALS_EXPR.finditer(text):
+            expr_str = match.group(1)
+            stated_str = match.group(2)
+
+            computed = _eval_expression(expr_str)
+            stated = _parse(stated_str)
+            if computed is None or stated is None:
+                continue
+
+            if abs(computed - stated) > self.tolerance:
+                found.append(
+                    Discrepancy(
+                        page=page,
+                        kind=DiscrepancyKind.ARITHMETIC,
+                        severity=Severity.ERROR,
+                        description=f"Arithmetic error: {expr_str.strip()} should equal {computed}, not {stated}",
+                        stated=str(stated),
+                        expected=str(computed),
+                        context=match.group(0),
+                    )
+                )
+        return found
+
+    def _check_total_then_addends(self, page: int, text: str) -> list[Discrepancy]:
+        """Handle patterns like 'Total: 450 (100 + 200 + 150)'."""
+        found: list[Discrepancy] = []
+        for match in _TOTAL_THEN_ADDENDS.finditer(text):
+            stated_str = match.group(1)
+            expr_str = match.group(2)
+
+            stated = _parse(stated_str)
+            computed = _eval_expression(expr_str)
+            if stated is None or computed is None:
+                continue
+
+            if abs(computed - stated) > self.tolerance:
+                found.append(
+                    Discrepancy(
+                        page=page,
+                        kind=DiscrepancyKind.ARITHMETIC,
+                        severity=Severity.ERROR,
+                        description=f"Stated total {stated} does not match addends ({expr_str.strip()} = {computed})",
+                        stated=str(stated),
+                        expected=str(computed),
+                        context=match.group(0),
+                    )
+                )
+        return found
diff --git a/engine/src/stirling/agents/ledger/validators/figures.py b/engine/src/stirling/agents/ledger/validators/figures.py
new file mode 100644
index 0000000000..7790c8dfb5
--- /dev/null
+++ b/engine/src/stirling/agents/ledger/validators/figures.py
@@ -0,0 +1,98 @@
+"""
+FigureTracker — cross-page consistency checker for named figures.
+
+Collects named numeric figures as the auditor encounters them (e.g.
+"Total Revenue: £1,200,000") and surfaces any that appear under the same
+label but with a different value on another page — a classic symptom of
+copy-paste errors or stale data in executive summaries.
+
+The tracker is intentionally simple: normalise labels, compare values
+within tolerance, emit Discrepancy for each conflict.
+"""
+
+from __future__ import annotations
+
+import logging
+import re
+from decimal import Decimal
+
+from pydantic import BaseModel
+
+from stirling.contracts.ledger import Discrepancy, DiscrepancyKind, Severity
+
+logger = logging.getLogger(__name__)
+
+
+class FigureRecord(BaseModel):
+    """A named numeric figure seen on a specific page."""
+
+    label: str
+    value: Decimal
+    page: int
+    raw: str
+
+
+# Strip punctuation that varies between contexts ("revenue:" vs "revenue —")
+_LABEL_NOISE = re.compile(r"[:\-—\s]+")
+
+
+def _normalise_label(label: str) -> str:
+    return _LABEL_NOISE.sub(" ", label.lower()).strip()
+
+
+class FigureTracker:
+    """
+    Accumulates named figures during an audit and checks them for consistency.
+
+    Typical usage:
+        tracker = FigureTracker()
+        tracker.record("Net Profit", Decimal("1200.00"), page=3, raw="£1,200.00")
+        tracker.record("Net Profit", Decimal("1250.00"), page=7, raw="£1,250.00")
+        discrepancies = tracker.conflicts()  # returns one Discrepancy
+    """
+
+    def __init__(self, tolerance: Decimal = Decimal("0.01")) -> None:
+        self.tolerance = tolerance
+        self._ledger: dict[str, list[FigureRecord]] = {}
+
+    def record(self, label: str, value: Decimal, page: int, raw: str) -> None:
+        """Register a named figure sighting."""
+        key = _normalise_label(label)
+        self._ledger.setdefault(key, []).append(FigureRecord(label=key, value=value, page=page, raw=raw))
+
+    def conflicts(self) -> list[Discrepancy]:
+        """
+        Return a Discrepancy for every label that has sightings whose value
+        differs from the first-seen (canonical) value by more than tolerance.
+
+        O(n) per label — each record is compared against the canonical only.
+        """
+        discrepancies: list[Discrepancy] = []
+
+        for label, records in self._ledger.items():
+            if len(records) < 2:
+                continue
+            canonical = records[0]
+            for other in records[1:]:
+                if abs(canonical.value - other.value) > self.tolerance:
+                    discrepancies.append(
+                        Discrepancy(
+                            page=other.page,
+                            kind=DiscrepancyKind.CONSISTENCY,
+                            severity=Severity.WARNING,
+                            description=(
+                                f'"{label}" stated as {canonical.raw} on page'
+                                f" {canonical.page + 1}"
+                                f" but {other.raw} on page {other.page + 1}"
+                            ),
+                            stated=other.raw,
+                            expected=canonical.raw,
+                            context=(f"First seen: page {canonical.page + 1} | Later: page {other.page + 1}"),
+                        )
+                    )
+
+        return discrepancies
+
+    @property
+    def entry_count(self) -> int:
+        return sum(len(v) for v in self._ledger.values())
diff --git a/engine/src/stirling/agents/ledger/validators/formula.py b/engine/src/stirling/agents/ledger/validators/formula.py
new file mode 100644
index 0000000000..fe9ae81c57
--- /dev/null
+++ b/engine/src/stirling/agents/ledger/validators/formula.py
@@ -0,0 +1,375 @@
+"""
+FormulaEvaluator — verifies LLM-inferred formulas against CSV table data.
+
+Supports a safe expression syntax:
+  - Column refs:  col0, col1, col2 ...
+  - Cell refs:    cell(row, col)
+  - Operators:    +  -  *  /
+  - Functions:    sum(colN, rows start-end)
+
+All arithmetic is Decimal. No eval(), no arbitrary code execution.
+"""
+
+from __future__ import annotations
+
+import logging
+import re
+from decimal import Decimal, InvalidOperation
+
+from stirling.contracts.ledger import Discrepancy, DiscrepancyKind, Severity
+
+from ._parsing import parse_csv as _parse_csv
+from ._parsing import to_decimal as _to_decimal
+
+logger = logging.getLogger(__name__)
+
+
+class FormulaEvaluator:
+    """
+    Evaluates formula expressions against parsed CSV rows.
+
+    Formulas use a simple syntax:
+      "col3 = col1 * col2"           — per-row check
+      "cell(4,3) = sum(col3, 1-3)"   — single cell check
+    """
+
+    def __init__(self, tolerance: Decimal = Decimal("0.01")) -> None:
+        self.tolerance = tolerance
+
+    def evaluate(
+        self,
+        page: int,
+        table_csv: str,
+        formula: str,
+        scope: str,
+        description: str,
+        row_range: list[int] | None = None,
+        target_row: int | None = None,
+        target_col: int | None = None,
+    ) -> list[Discrepancy]:
+        """
+        Evaluate a formula against table data.
+
+        scope: "each_row" | "column_total" | "single_cell"
+        """
+        rows = _parse_csv(table_csv)
+        if len(rows) < 2:
+            return []
+
+        if scope == "each_row":
+            return self._check_each_row(page, rows, formula, description, row_range)
+        elif scope == "column_total":
+            return self._check_column_total(page, rows, formula, description, target_row, target_col)
+        elif scope == "single_cell":
+            return self._check_single_cell(page, rows, formula, description, target_row, target_col)
+        else:
+            logger.warning("[formula] unknown scope %r, skipping", scope)
+            return []
+
+    def _check_each_row(
+        self,
+        page: int,
+        rows: list[list[str]],
+        formula: str,
+        description: str,
+        row_range: list[int] | None,
+    ) -> list[Discrepancy]:
+        """Verify formula holds for each data row."""
+        discrepancies: list[Discrepancy] = []
+
+        # Parse "colX = expr" format
+        parts = formula.split("=", 1)
+        if len(parts) != 2:
+            return []
+        lhs = parts[0].strip()
+        rhs = parts[1].strip()
+
+        lhs_col = self._parse_col_ref(lhs)
+        if lhs_col is None:
+            return []
+
+        check_rows = row_range if row_range else list(range(1, len(rows)))
+
+        for row_idx in check_rows:
+            if row_idx >= len(rows):
+                continue
+            row = rows[row_idx]
+
+            stated = self._get_cell(row, lhs_col)
+            if stated is None:
+                continue
+
+            computed = self._eval_row_expr(rhs, row, rows)
+            if computed is None:
+                continue
+
+            if abs(stated - computed) > self.tolerance:
+                discrepancies.append(
+                    Discrepancy(
+                        page=page,
+                        kind=DiscrepancyKind.TALLY,
+                        severity=Severity.ERROR,
+                        description=f"{description}: row {row_idx} — stated {stated}, expected {computed}",
+                        stated=str(stated),
+                        expected=str(computed),
+                        context=f"row {row_idx}, {formula}",
+                    )
+                )
+
+        return discrepancies
+
+    def _check_column_total(
+        self,
+        page: int,
+        rows: list[list[str]],
+        formula: str,
+        description: str,
+        target_row: int | None,
+        target_col: int | None,
+    ) -> list[Discrepancy]:
+        """Verify that a total row contains correct column sums."""
+        if target_row is None or target_row >= len(rows):
+            return []
+
+        discrepancies: list[Discrepancy] = []
+        total_row = rows[target_row]
+
+        # Determine which columns to check
+        cols_to_check: list[int] = []
+        if target_col is not None:
+            cols_to_check = [target_col]
+        else:
+            # Check all numeric columns in the total row
+            cols_to_check = list(range(len(total_row)))
+
+        # Determine addend rows (all rows between header and total row)
+        addend_rows = list(range(1, target_row))
+
+        for col in cols_to_check:
+            stated = self._get_cell(total_row, col)
+            if stated is None:
+                continue
+
+            computed = Decimal(0)
+            has_addends = False
+            for r_idx in addend_rows:
+                if r_idx >= len(rows):
+                    continue
+                val = self._get_cell(rows[r_idx], col)
+                if val is not None:
+                    computed += val
+                    has_addends = True
+
+            if not has_addends:
+                continue
+
+            if abs(stated - computed) > self.tolerance:
+                discrepancies.append(
+                    Discrepancy(
+                        page=page,
+                        kind=DiscrepancyKind.TALLY,
+                        severity=Severity.ERROR,
+                        description=f"{description}: column {col} — stated {stated}, expected {computed}",
+                        stated=str(stated),
+                        expected=str(computed),
+                        context=f"column {col}, total row {target_row}",
+                    )
+                )
+
+        return discrepancies
+
+    def _check_single_cell(
+        self,
+        page: int,
+        rows: list[list[str]],
+        formula: str,
+        description: str,
+        target_row: int | None,
+        target_col: int | None,
+    ) -> list[Discrepancy]:
+        """Verify a single cell formula (e.g. Grand Total = Subtotal + Tax)."""
+        parts = formula.split("=", 1)
+        if len(parts) != 2:
+            return []
+
+        # Parse target from LHS cell(r,c) if not provided explicitly
+        if target_row is None or target_col is None:
+            lhs_match = re.match(r"cell\(\s*(\d+)\s*,\s*(\d+)\s*\)", parts[0].strip())
+            if lhs_match:
+                target_row = int(lhs_match.group(1))
+                target_col = int(lhs_match.group(2))
+            else:
+                return []
+
+        if target_row >= len(rows):
+            return []
+
+        rhs = parts[1].strip()
+
+        stated = self._get_cell(rows[target_row], target_col)
+        if stated is None:
+            return []
+
+        computed = self._eval_row_expr(rhs, rows[target_row], rows)
+        if computed is None:
+            return []
+
+        if abs(stated - computed) > self.tolerance:
+            return [
+                Discrepancy(
+                    page=page,
+                    kind=DiscrepancyKind.TALLY,
+                    severity=Severity.ERROR,
+                    description=f"{description}: stated {stated}, expected {computed}",
+                    stated=str(stated),
+                    expected=str(computed),
+                    context=f"cell({target_row},{target_col}), {formula}",
+                )
+            ]
+        return []
+
+    # ------------------------------------------------------------------
+    # Expression evaluation
+    # ------------------------------------------------------------------
+
+    def _eval_row_expr(self, expr: str, row: list[str], all_rows: list[list[str]]) -> Decimal | None:
+        """
+        Evaluate an expression in the context of a specific row.
+        Supports: colN refs, cell(r,c) refs, +, -, *, /
+        Also supports: sum(colN, start-end)
+        """
+        # Handle sum() function first
+        sum_pattern = re.compile(r"sum\(\s*col(\d+)\s*,\s*(\d+)\s*-\s*(\d+)\s*\)")
+        resolved = expr
+        for match in sum_pattern.finditer(expr):
+            col = int(match.group(1))
+            start = int(match.group(2))
+            end = int(match.group(3))
+            total = Decimal(0)
+            for r_idx in range(start, end + 1):
+                if r_idx < len(all_rows):
+                    val = self._get_cell(all_rows[r_idx], col)
+                    if val is not None:
+                        total += val
+            resolved = resolved.replace(match.group(0), str(total))
+
+        # Handle cell(r, c) references
+        cell_pattern = re.compile(r"cell\(\s*(\d+)\s*,\s*(\d+)\s*\)")
+        for match in cell_pattern.finditer(resolved):
+            r = int(match.group(1))
+            c = int(match.group(2))
+            if r < len(all_rows):
+                val = self._get_cell(all_rows[r], c)
+                if val is not None:
+                    resolved = resolved.replace(match.group(0), str(val))
+                else:
+                    return None
+            else:
+                return None
+
+        # Replace colN references with values from the current row.
+        # Use re.sub with word boundaries to avoid col1 corrupting col12.
+        _failed = False
+
+        def _col_replacer(m: re.Match[str]) -> str:
+            nonlocal _failed
+            col_idx = int(m.group(1))
+            val = self._get_cell(row, col_idx)
+            if val is None:
+                _failed = True
+                return m.group(0)
+            return str(val)
+
+        resolved = re.sub(r"\bcol(\d+)\b", _col_replacer, resolved)
+        if _failed:
+            return None
+
+        # Evaluate the resulting arithmetic expression safely
+        return self._safe_eval(resolved)
+
+    def _safe_eval(self, expr: str) -> Decimal | None:
+        """
+        Evaluate a simple arithmetic expression containing only
+        numbers and +, -, *, / operators.  Respects standard operator
+        precedence (* and / bind tighter than + and -).  No eval().
+        """
+        try:
+            raw = re.findall(r"\d+(?:\.\d+)?|[+\-*/]", expr.strip())
+            if not raw:
+                return None
+
+            # Build (values, ops) lists, merging a leading '-' or an
+            # operator-adjacent '-' into the next number token.
+            values: list[Decimal] = []
+            ops: list[str] = []
+            i = 0
+            while i < len(raw):
+                tok = raw[i]
+                if tok in "+-*/" and not values and tok == "-":
+                    # Leading negative: merge with next number
+                    i += 1
+                    if i >= len(raw):
+                        return None
+                    values.append(Decimal("-" + raw[i]))
+                elif tok in "+-*/":
+                    # Operator followed by '-' → negative operand
+                    if (
+                        tok in "+-*/"
+                        and i + 1 < len(raw)
+                        and raw[i + 1] == "-"
+                        and i + 2 < len(raw)
+                        and raw[i + 2] not in "+-*/"
+                    ):
+                        ops.append(tok)
+                        values.append(Decimal("-" + raw[i + 2]))
+                        i += 2  # skip the '-' and the number
+                    else:
+                        ops.append(tok)
+                else:
+                    values.append(Decimal(tok))
+                i += 1
+
+            if not values:
+                return None
+
+            # Pass 1: evaluate * and /
+            j = 0
+            while j < len(ops):
+                if ops[j] in ("*", "/"):
+                    if ops[j] == "*":
+                        values[j] = values[j] * values[j + 1]
+                    else:
+                        if values[j + 1] == 0:
+                            return None
+                        values[j] = values[j] / values[j + 1]
+                    values.pop(j + 1)
+                    ops.pop(j)
+                else:
+                    j += 1
+
+            # Pass 2: evaluate + and -
+            result = values[0]
+            for j, op in enumerate(ops):
+                if op == "+":
+                    result += values[j + 1]
+                elif op == "-":
+                    result -= values[j + 1]
+
+            return result
+        except (InvalidOperation, IndexError, ValueError):
+            return None
+
+    # ------------------------------------------------------------------
+    # Helpers
+    # ------------------------------------------------------------------
+
+    @staticmethod
+    def _parse_col_ref(ref: str) -> int | None:
+        match = re.match(r"col(\d+)", ref.strip())
+        return int(match.group(1)) if match else None
+
+    @staticmethod
+    def _get_cell(row: list[str], col: int) -> Decimal | None:
+        if col >= len(row):
+            return None
+        return _to_decimal(row[col])
diff --git a/engine/src/stirling/agents/orchestrator.py b/engine/src/stirling/agents/orchestrator.py
index 23919a02de..0596dd3b68 100644
--- a/engine/src/stirling/agents/orchestrator.py
+++ b/engine/src/stirling/agents/orchestrator.py
@@ -1,6 +1,7 @@
 from __future__ import annotations
 
 from dataclasses import dataclass
+from typing import assert_never
 
 from pydantic_ai import Agent
 from pydantic_ai.output import ToolOutput
@@ -13,15 +14,20 @@ from stirling.agents.user_spec import UserSpecAgent
 from stirling.contracts import (
     AgentDraftRequest,
     AgentDraftWorkflowResponse,
+    ExtractedTextArtifact,
     OrchestratorRequest,
     OrchestratorResponse,
     PdfEditRequest,
     PdfEditResponse,
     PdfQuestionRequest,
     PdfQuestionResponse,
+    SupportedCapability,
+    ToolOperationStep,
     UnsupportedCapabilityResponse,
+    format_conversation_history,
 )
-from stirling.contracts.form_fill import KnowledgeUpdateResponse
+from stirling.contracts.pdf_edit import EditPlanResponse
+from stirling.models.agent_tool_models import AgentToolId, MathAuditorAgentParams
 from stirling.services import AppRuntime
 
 
@@ -57,6 +63,14 @@ class OrchestratorAgent:
                     name="delegate_user_spec",
                     description="Delegate requests to create or revise a user agent spec and return the draft result.",
                 ),
+                ToolOutput(
+                    self.math_auditor_agent,
+                    name="math_auditor_agent",
+                    description=(
+                        "Delegate requests to check arithmetic, validate table totals, "
+                        "audit financial calculations, or verify mathematical accuracy in PDFs."
+                    ),
+                ),
                 ToolOutput(
                     self.unsupported_capability,
                     name="unsupported_capability",
@@ -67,44 +81,91 @@ class OrchestratorAgent:
             system_prompt=(
                 "You are the top-level orchestrator. "
                 "Choose exactly one output function that best handles the request. "
-                "Use delegate_pdf_edit for requested PDF modifications. "
-                "Use delegate_pdf_question for questions about the contents of a PDF. "
-                "Use delegate_form_fill for requests to extract personal information for form filling. "
+                "Use delegate_pdf_edit for requested modifications of single or multiple PDFs. "
+                "Use delegate_pdf_question for questions about PDF contents. "
                 "Use delegate_user_spec for requests to create or define an agent spec. "
+                "Use math_auditor_agent for requests to check arithmetic, validate "
+                "table totals, audit financial calculations, or verify math in PDFs. "
                 "Use unsupported_capability only when none of the other outputs fit."
             ),
             model_settings=runtime.fast_model_settings,
         )
 
     async def handle(self, request: OrchestratorRequest) -> OrchestratorResponse:
+        if request.resume_with is not None:
+            return await self._resume(request, request.resume_with)
         result = await self.agent.run(
-            request.user_message,
+            self._build_prompt(request),
             deps=OrchestratorDeps(runtime=self.runtime, request=request),
         )
         return result.output
 
-    async def delegate_form_fill(self, ctx: RunContext[OrchestratorDeps]) -> KnowledgeUpdateResponse:
-        request = ctx.deps.request
-        return await DocumentExtractorAgent(ctx.deps.runtime).extract_single(
-            document_text=request.user_message,
-            user_message=request.user_message,
-        )
+    async def _resume(self, request: OrchestratorRequest, capability: SupportedCapability) -> OrchestratorResponse:
+        """Fast-path to get back to the correct endpoint without having to call AI."""
+        match capability:
+            case SupportedCapability.PDF_QUESTION:
+                return await self._run_pdf_question(request)
+            case SupportedCapability.PDF_EDIT:
+                return await self._run_pdf_edit(request)
+            case SupportedCapability.AGENT_DRAFT:
+                return await self._run_agent_draft(request)
+            case (
+                SupportedCapability.ORCHESTRATE
+                | SupportedCapability.AGENT_REVISE
+                | SupportedCapability.AGENT_NEXT_ACTION
+                | SupportedCapability.MATH_AUDITOR_AGENT
+            ):
+                raise ValueError(f"Cannot resume orchestrator with capability: {capability}")
+            case _ as unreachable:
+                assert_never(unreachable)
 
     async def delegate_pdf_edit(self, ctx: RunContext[OrchestratorDeps]) -> PdfEditResponse:
-        request = ctx.deps.request
-        return await PdfEditAgent(ctx.deps.runtime).handle(
-            PdfEditRequest(user_message=request.user_message, conversation_id=request.conversation_id)
+        return await self._run_pdf_edit(ctx.deps.request)
+
+    async def _run_pdf_edit(self, request: OrchestratorRequest) -> PdfEditResponse:
+        return await PdfEditAgent(self.runtime).handle(
+            PdfEditRequest(
+                user_message=request.user_message,
+                file_names=request.file_names,
+                conversation_history=request.conversation_history,
+            )
         )
 
     async def delegate_pdf_question(self, ctx: RunContext[OrchestratorDeps]) -> PdfQuestionResponse:
-        request = ctx.deps.request
-        return await PdfQuestionAgent(ctx.deps.runtime).handle(
-            PdfQuestionRequest(question=request.user_message, conversation_id=request.conversation_id)
+        return await self._run_pdf_question(ctx.deps.request)
+
+    async def _run_pdf_question(self, request: OrchestratorRequest) -> PdfQuestionResponse:
+        extracted_text = self._get_extracted_text_artifact(request)
+        return await PdfQuestionAgent(self.runtime).handle(
+            PdfQuestionRequest(
+                question=request.user_message,
+                file_names=request.file_names,
+                page_text=extracted_text.files if extracted_text is not None else [],
+                conversation_history=request.conversation_history,
+            )
         )
 
     async def delegate_user_spec(self, ctx: RunContext[OrchestratorDeps]) -> AgentDraftWorkflowResponse:
-        request = ctx.deps.request
-        return await UserSpecAgent(ctx.deps.runtime).draft(AgentDraftRequest(user_message=request.user_message))
+        return await self._run_agent_draft(ctx.deps.request)
+
+    async def _run_agent_draft(self, request: OrchestratorRequest) -> AgentDraftWorkflowResponse:
+        return await UserSpecAgent(self.runtime).draft(
+            AgentDraftRequest(
+                user_message=request.user_message,
+                conversation_history=request.conversation_history,
+            )
+        )
+
+    async def math_auditor_agent(self, ctx: RunContext[OrchestratorDeps]) -> EditPlanResponse:
+        return EditPlanResponse(
+            summary="Validate mathematical calculations in the document.",
+            steps=[
+                ToolOperationStep(
+                    tool=AgentToolId.MATH_AUDITOR_AGENT,
+                    parameters=MathAuditorAgentParams(),
+                )
+            ],
+        )
 
     async def unsupported_capability(
         self,
@@ -113,3 +174,34 @@ class OrchestratorAgent:
         message: str,
     ) -> UnsupportedCapabilityResponse:
         return UnsupportedCapabilityResponse(capability=capability, message=message)
+
+    def _get_extracted_text_artifact(self, request: OrchestratorRequest) -> ExtractedTextArtifact | None:
+        for artifact in request.artifacts:
+            if isinstance(artifact, ExtractedTextArtifact):
+                return artifact
+        return None
+
+    def _build_prompt(self, request: OrchestratorRequest) -> str:
+        artifact_summary = self._describe_artifacts(request)
+        file_names = ", ".join(request.file_names) if request.file_names else "Unknown files"
+        history = format_conversation_history(request.conversation_history)
+        return (
+            f"Conversation history:\n{history}\n"
+            f"User message: {request.user_message}\n"
+            f"Files: {file_names}\n"
+            f"Available artifacts:\n{artifact_summary}"
+        )
+
+    def _describe_artifacts(self, request: OrchestratorRequest) -> str:
+        if not request.artifacts:
+            return "- none"
+
+        descriptions: list[str] = []
+        for artifact in request.artifacts:
+            if isinstance(artifact, ExtractedTextArtifact):
+                total_pages = sum(len(f.pages) for f in artifact.files)
+                file_names = [f.file_name for f in artifact.files]
+                descriptions.append(f"- extracted_text: {total_pages} pages from {file_names}")
+                continue
+            descriptions.append("- unknown artifact")
+        return "\n".join(descriptions)
diff --git a/engine/src/stirling/agents/pdf_edit.py b/engine/src/stirling/agents/pdf_edit.py
index 1ba014dec4..40b1365783 100644
--- a/engine/src/stirling/agents/pdf_edit.py
+++ b/engine/src/stirling/agents/pdf_edit.py
@@ -13,14 +13,15 @@ from stirling.contracts import (
     PdfEditRequest,
     PdfEditResponse,
     ToolOperationStep,
+    format_conversation_history,
 )
-from stirling.models import OPERATIONS, ApiModel, OperationId, ParamToolModel
+from stirling.models import OPERATIONS, ApiModel, ParamToolModel, ToolEndpoint
 from stirling.services import AppRuntime
 
 
 class PdfEditPlanSelection(ApiModel):
     outcome: Literal["plan"] = "plan"
-    operations: list[OperationId] = Field(min_length=1)
+    operations: list[ToolEndpoint] = Field(min_length=1)
     summary: str
     rationale: str | None = None
 
@@ -41,7 +42,7 @@ class PdfEditParameterSelector:
     async def select(
         self,
         request: PdfEditRequest,
-        operation_plan: list[OperationId],
+        operation_plan: list[ToolEndpoint],
         operation_index: int,
         generated_steps: list[ToolOperationStep],
     ) -> ParamToolModel:
@@ -51,7 +52,7 @@ class PdfEditParameterSelector:
             self._build_parameter_prompt(request, operation_plan, operation_index, generated_steps),
             output_type=NativeOutput(parameter_model),
             instructions=(
-                f"Generate only the parameters for the PDF operation `{operation_id.value}`. "
+                f"Generate only the parameters for the PDF operation `{operation_id.name}`. "
                 "Do not include fields from any other operation."
             ),
         )
@@ -60,12 +61,12 @@ class PdfEditParameterSelector:
     def _build_parameter_prompt(
         self,
         request: PdfEditRequest,
-        operation_plan: list[OperationId],
+        operation_plan: list[ToolEndpoint],
         operation_index: int,
         generated_steps: list[ToolOperationStep],
     ) -> str:
         operation_id = operation_plan[operation_index]
-        operation_list = ", ".join(operation.value for operation in operation_plan)
+        operation_list = ", ".join(operation.name for operation in operation_plan)
         file_names = ", ".join(request.file_names) if request.file_names else "No file names were provided."
         generated_steps_text = (
             "\n".join(
@@ -79,7 +80,7 @@ class PdfEditParameterSelector:
             f"Files: {file_names}\n"
             f"Operation plan: {operation_list}\n"
             f"Selected operation index: {operation_index + 1} of {len(operation_plan)}\n"
-            f"Selected operation: {operation_id.value}\n"
+            f"Selected operation: {operation_id.name}\n"
             f"Already generated steps:\n{generated_steps_text}\n"
             "Return only the parameter object for the selected operation."
         )
@@ -146,6 +147,7 @@ class PdfEditAgent:
     def _build_selection_prompt(self, request: PdfEditRequest) -> str:
         file_names = ", ".join(request.file_names) if request.file_names else "No file names were provided."
         return (
+            f"Conversation history:\n{format_conversation_history(request.conversation_history)}\n"
             f"User request: {request.user_message}\n"
             f"Files: {file_names}\n"
             f"Supported operations: {self._supported_operations_prompt()}\n"
@@ -153,4 +155,4 @@ class PdfEditAgent:
         )
 
     def _supported_operations_prompt(self) -> str:
-        return ", ".join(operation_id.value for operation_id in self.supported_operations)
+        return ", ".join(f"{op.name} ({op.value})" for op in self.supported_operations)
diff --git a/engine/src/stirling/agents/pdf_questions.py b/engine/src/stirling/agents/pdf_questions.py
index b7ca33ac9a..c646159da8 100644
--- a/engine/src/stirling/agents/pdf_questions.py
+++ b/engine/src/stirling/agents/pdf_questions.py
@@ -4,18 +4,26 @@ from pydantic_ai import Agent
 from pydantic_ai.output import NativeOutput
 
 from stirling.contracts import (
+    ExtractedFileText,
+    NeedContentFileRequest,
+    PdfContentType,
     PdfQuestionAnswerResponse,
-    PdfQuestionNeedTextResponse,
+    PdfQuestionNeedContentResponse,
     PdfQuestionNotFoundResponse,
     PdfQuestionRequest,
     PdfQuestionResponse,
+    format_conversation_history,
 )
 from stirling.services import AppRuntime
 
 
 class PdfQuestionAgent:
+    DEFAULT_MAX_PAGES = 12
+    DEFAULT_MAX_CHARACTERS = 24_000
+
     def __init__(self, runtime: AppRuntime) -> None:
         self.runtime = runtime
+        rag = runtime.rag_capability
         self.agent = Agent(
             model=runtime.smart_model,
             output_type=NativeOutput(
@@ -25,18 +33,29 @@ class PdfQuestionAgent:
                 ]
             ),
             system_prompt=(
-                "Answer questions about a PDF using only the extracted text provided in the prompt. "
+                "Answer questions about PDFs using only the extracted page text provided in the prompt. "
                 "Do not guess or use outside knowledge. "
                 "If the answer is not supported by the provided text, return not_found. "
-                "When answering, include a short list of evidence snippets copied from the provided text."
+                "When answering, include a short list of evidence snippets with their page numbers."
             ),
+            instructions=rag.instructions,
+            toolsets=[rag.toolset],
             model_settings=runtime.smart_model_settings,
         )
 
     async def handle(self, request: PdfQuestionRequest) -> PdfQuestionResponse:
-        if not request.extracted_text.strip():
-            return PdfQuestionNeedTextResponse(
-                reason="No extracted PDF text was provided, so the question cannot be answered yet."
+        if not self._has_page_text(request.page_text):
+            return PdfQuestionNeedContentResponse(
+                reason="No extracted PDF page text was provided, so the question cannot be answered yet.",
+                files=[
+                    NeedContentFileRequest(
+                        file_name=file_name,
+                        content_types=[PdfContentType.PAGE_TEXT],
+                    )
+                    for file_name in request.file_names
+                ],
+                max_pages=self.DEFAULT_MAX_PAGES,
+                max_characters=self.DEFAULT_MAX_CHARACTERS,
             )
         return await self._run_answer_agent(request)
 
@@ -45,5 +64,20 @@ class PdfQuestionAgent:
         return result.output
 
     def _build_prompt(self, request: PdfQuestionRequest) -> str:
-        file_name = request.file_name or "Unknown file"
-        return f"File: {file_name}\nQuestion: {request.question}\nExtracted text:\n{request.extracted_text}"
+        file_names = ", ".join(request.file_names) if request.file_names else "Unknown files"
+        sections = [
+            f"[File: {file_text.file_name}, Page {selection.page_number or '?'}]\n{selection.text}"
+            for file_text in request.page_text
+            for selection in file_text.pages
+        ]
+        pages = "\n\n".join(sections)
+        history = format_conversation_history(request.conversation_history)
+        return (
+            f"Conversation history:\n{history}\n"
+            f"Files: {file_names}\n"
+            f"Question: {request.question}\n"
+            f"Extracted page text:\n{pages}"
+        )
+
+    def _has_page_text(self, page_text: list[ExtractedFileText]) -> bool:
+        return any(selection.text.strip() for file_text in page_text for selection in file_text.pages)
diff --git a/engine/src/stirling/agents/user_spec.py b/engine/src/stirling/agents/user_spec.py
index d30b5e53d5..40a028aa1b 100644
--- a/engine/src/stirling/agents/user_spec.py
+++ b/engine/src/stirling/agents/user_spec.py
@@ -18,6 +18,7 @@ from stirling.contracts import (
     EditClarificationRequest,
     EditPlanResponse,
     PdfEditRequest,
+    format_conversation_history,
 )
 from stirling.models import ApiModel
 from stirling.services import AppRuntime
@@ -45,14 +46,15 @@ class UserSpecAgent:
         )
 
     async def draft(self, request: AgentDraftRequest) -> AgentDraftWorkflowResponse:
-        edit_plan = await self._build_edit_plan(request.user_message)
+        edit_plan = await self._build_edit_plan(request.user_message, request.conversation_history)
         if not isinstance(edit_plan, EditPlanResponse):
             return edit_plan
         return AgentDraftResponse(draft=await self._run_draft_agent(request, edit_plan))
 
     async def revise(self, request: AgentRevisionRequest) -> AgentRevisionWorkflowResponse:
         edit_plan = await self._build_edit_plan(
-            f"Current objective: {request.current_draft.objective}\nRevision request: {request.user_message}"
+            f"Current objective: {request.current_draft.objective}\nRevision request: {request.user_message}",
+            request.conversation_history,
         )
         if not isinstance(edit_plan, EditPlanResponse):
             return edit_plan
@@ -80,7 +82,7 @@ class UserSpecAgent:
     def _build_draft_prompt(self, request: AgentDraftRequest, edit_plan: EditPlanResponse) -> str:
         return (
             f"User request:\n{request.user_message}\n\n"
-            f"Conversation history:\n{self._format_conversation_history(request.conversation_history)}\n\n"
+            f"Conversation history:\n{format_conversation_history(request.conversation_history)}\n\n"
             f"Edit plan summary:\n{edit_plan.summary}\n\n"
             f"Edit plan rationale:\n{edit_plan.rationale or 'None'}\n\n"
             f"Edit plan steps:\n{edit_plan.model_dump_json(indent=2)}"
@@ -89,20 +91,18 @@ class UserSpecAgent:
     def _build_revision_prompt(self, request: AgentRevisionRequest, edit_plan: EditPlanResponse) -> str:
         return (
             f"Revision request:\n{request.user_message}\n\n"
-            f"Conversation history:\n{self._format_conversation_history(request.conversation_history)}\n\n"
+            f"Conversation history:\n{format_conversation_history(request.conversation_history)}\n\n"
             f"Current draft:\n{request.current_draft.model_dump_json(indent=2)}\n\n"
             f"Edit plan summary:\n{edit_plan.summary}\n\n"
             f"Edit plan rationale:\n{edit_plan.rationale or 'None'}\n\n"
             f"Edit plan steps:\n{edit_plan.model_dump_json(indent=2)}"
         )
 
-    def _format_conversation_history(self, conversation_history: list[ConversationMessage]) -> str:
-        if not conversation_history:
-            return "None"
-        return "\n".join(f"- {message.role}: {message.content}" for message in conversation_history)
-
     async def _build_edit_plan(
         self,
         user_message: str,
+        conversation_history: list[ConversationMessage],
     ) -> EditPlanResponse | EditClarificationRequest | EditCannotDoResponse:
-        return await self.pdf_edit_agent.handle(PdfEditRequest(user_message=user_message))
+        return await self.pdf_edit_agent.handle(
+            PdfEditRequest(user_message=user_message, conversation_history=conversation_history)
+        )
diff --git a/engine/src/stirling/api/app.py b/engine/src/stirling/api/app.py
index 5273403c2f..ed1ccfc246 100644
--- a/engine/src/stirling/api/app.py
+++ b/engine/src/stirling/api/app.py
@@ -4,6 +4,8 @@ from contextlib import asynccontextmanager
 from typing import Annotated
 
 from fastapi import Depends, FastAPI
+from pydantic_ai import Agent
+from pydantic_ai.models.instrumented import InstrumentationSettings
 
 from stirling.agents import (
     DocumentExtractorAgent,
@@ -15,17 +17,21 @@ from stirling.agents import (
     PdfQuestionAgent,
     UserSpecAgent,
 )
+from stirling.agents.ledger import MathAuditorAgent
+from stirling.api.middleware import UserIdMiddleware
 from stirling.api.routes import (
     agent_draft_router,
     execution_router,
     form_fill_router,
+    ledger_router,
     orchestrator_router,
     pdf_edit_router,
     pdf_question_router,
+    rag_router,
 )
 from stirling.config import AppSettings, load_settings
 from stirling.contracts import HealthResponse
-from stirling.services import build_runtime
+from stirling.services import build_runtime, setup_posthog_tracking
 
 
 def _load_startup_settings(fast_api: FastAPI) -> AppSettings:
@@ -46,18 +52,27 @@ async def lifespan(fast_api: FastAPI):
     fast_api.state.pdf_question_agent = PdfQuestionAgent(runtime)
     fast_api.state.user_spec_agent = UserSpecAgent(runtime)
     fast_api.state.execution_planning_agent = ExecutionPlanningAgent(runtime)
+    fast_api.state.math_auditor_agent = MathAuditorAgent(runtime)
     fast_api.state.form_analyser_agent = FormAnalyserAgent(runtime)
     fast_api.state.form_filler_agent = FormFillerAgent(runtime)
     fast_api.state.document_extractor_agent = DocumentExtractorAgent(runtime)
+    tracer_provider = setup_posthog_tracking(settings)
+    if tracer_provider:
+        Agent.instrument_all(InstrumentationSettings(tracer_provider=tracer_provider))
     yield
+    if tracer_provider:
+        tracer_provider.shutdown()
 
 
 app = FastAPI(title="Stirling AI Engine", lifespan=lifespan, version="0.1.0")
+app.add_middleware(UserIdMiddleware)
 app.include_router(orchestrator_router)
 app.include_router(pdf_edit_router)
 app.include_router(pdf_question_router)
 app.include_router(agent_draft_router)
 app.include_router(execution_router)
+app.include_router(rag_router)
+app.include_router(ledger_router)
 app.include_router(form_fill_router)
 
 
diff --git a/engine/src/stirling/api/dependencies.py b/engine/src/stirling/api/dependencies.py
index e4a5fc2fe1..a500caaae2 100644
--- a/engine/src/stirling/api/dependencies.py
+++ b/engine/src/stirling/api/dependencies.py
@@ -12,6 +12,8 @@ from stirling.agents import (
     PdfQuestionAgent,
     UserSpecAgent,
 )
+from stirling.agents.ledger import MathAuditorAgent
+from stirling.rag import RagService
 from stirling.services import AppRuntime
 
 
@@ -39,6 +41,18 @@ def get_execution_planning_agent(request: Request) -> ExecutionPlanningAgent:
     return request.app.state.execution_planning_agent
 
 
+def get_rag_service(request: Request) -> RagService:
+    return request.app.state.runtime.rag_service
+
+
+def get_rag_embedding_model(request: Request) -> str:
+    return request.app.state.runtime.settings.rag_embedding_model
+
+
+def get_math_auditor_agent(request: Request) -> MathAuditorAgent:
+    return request.app.state.math_auditor_agent
+
+
 def get_form_analyser_agent(request: Request) -> FormAnalyserAgent:
     return request.app.state.form_analyser_agent
 
diff --git a/engine/src/stirling/api/middleware.py b/engine/src/stirling/api/middleware.py
new file mode 100644
index 0000000000..8d5be8b036
--- /dev/null
+++ b/engine/src/stirling/api/middleware.py
@@ -0,0 +1,23 @@
+from __future__ import annotations
+
+from starlette.middleware.base import BaseHTTPMiddleware, RequestResponseEndpoint
+from starlette.requests import Request
+from starlette.responses import Response
+
+from stirling.services.tracking import current_user_id
+
+_USER_ID_HEADER = "X-User-Id"
+
+
+class UserIdMiddleware(BaseHTTPMiddleware):
+    """Extract X-User-Id header and set it as the current user for PostHog tracking."""
+
+    async def dispatch(self, request: Request, call_next: RequestResponseEndpoint) -> Response:
+        user_id = request.headers.get(_USER_ID_HEADER)
+        if user_id:
+            token = current_user_id.set(user_id)
+            try:
+                return await call_next(request)
+            finally:
+                current_user_id.reset(token)
+        return await call_next(request)
diff --git a/engine/src/stirling/api/routes/__init__.py b/engine/src/stirling/api/routes/__init__.py
index bdc50e7128..c751901cac 100644
--- a/engine/src/stirling/api/routes/__init__.py
+++ b/engine/src/stirling/api/routes/__init__.py
@@ -1,15 +1,19 @@
 from .agent_drafts import router as agent_draft_router
 from .execution import router as execution_router
 from .form_fill import router as form_fill_router
+from .ledger import router as ledger_router
 from .orchestrator import router as orchestrator_router
 from .pdf_edit import router as pdf_edit_router
 from .pdf_questions import router as pdf_question_router
+from .rag import router as rag_router
 
 __all__ = [
     "agent_draft_router",
     "execution_router",
     "form_fill_router",
+    "ledger_router",
     "orchestrator_router",
     "pdf_edit_router",
     "pdf_question_router",
+    "rag_router",
 ]
diff --git a/engine/src/stirling/api/routes/ledger.py b/engine/src/stirling/api/routes/ledger.py
new file mode 100644
index 0000000000..82e220fbf6
--- /dev/null
+++ b/engine/src/stirling/api/routes/ledger.py
@@ -0,0 +1,60 @@
+"""
+Math Auditor Agent (mathAuditorAgent) — FastAPI routes.
+
+Two internal endpoints, called only by the Java MathAuditorOrchestrator:
+
+  POST /api/v1/ai/math-auditor-agent/examine
+      Java sends a FolioManifest (cheap page classification).
+      Python returns a Requisition (what Java must extract).
+
+  POST /api/v1/ai/math-auditor-agent/deliberate
+      Java sends Evidence (fulfilled extraction results).
+      Python returns a Verdict directly.
+"""
+
+from __future__ import annotations
+
+import logging
+from decimal import Decimal, InvalidOperation
+from typing import Annotated
+
+from fastapi import APIRouter, Depends, HTTPException, Query
+
+from stirling.agents.ledger import MathAuditorAgent
+from stirling.api.dependencies import get_math_auditor_agent
+from stirling.contracts.ledger import (
+    Evidence,
+    FolioManifest,
+    Requisition,
+    Verdict,
+)
+
+logger = logging.getLogger(__name__)
+
+router = APIRouter(prefix="/api/v1/ai/math-auditor-agent", tags=["math-auditor-agent"])
+
+
+@router.post("/examine", response_model=Requisition)
+async def examine_endpoint(
+    manifest: FolioManifest,
+    agent: Annotated[MathAuditorAgent, Depends(get_math_auditor_agent)],
+) -> Requisition:
+    """Round 1: Java presents a FolioManifest; Python declares its Requisition."""
+    return await agent.examine(manifest)
+
+
+@router.post("/deliberate", response_model=Verdict)
+async def deliberate_endpoint(
+    evidence: Evidence,
+    agent: Annotated[MathAuditorAgent, Depends(get_math_auditor_agent)],
+    tolerance: str = Query(default="0.01"),
+) -> Verdict:
+    """Round 2: Java presents fulfilled Evidence; Python returns a Verdict."""
+    try:
+        tol = Decimal(tolerance)
+        if tol < 0:
+            raise HTTPException(status_code=400, detail="tolerance must be non-negative")
+    except InvalidOperation:
+        raise HTTPException(status_code=400, detail=f"Invalid tolerance value: {tolerance!r}")
+
+    return await agent.audit(evidence, tol)
diff --git a/engine/src/stirling/api/routes/rag.py b/engine/src/stirling/api/routes/rag.py
new file mode 100644
index 0000000000..2eb9acfcc2
--- /dev/null
+++ b/engine/src/stirling/api/routes/rag.py
@@ -0,0 +1,78 @@
+from __future__ import annotations
+
+from typing import Annotated
+
+from fastapi import APIRouter, Depends
+
+from stirling.api.dependencies import get_rag_embedding_model, get_rag_service
+from stirling.contracts import (
+    RagCollectionsResponse,
+    RagDeleteCollectionResponse,
+    RagIndexRequest,
+    RagIndexResponse,
+    RagSearchRequest,
+    RagSearchResponse,
+    RagSearchResultItem,
+    RagStatusResponse,
+)
+from stirling.rag import RagService
+
+router = APIRouter(prefix="/api/v1/rag", tags=["rag"])
+
+
+@router.get("/status", response_model=RagStatusResponse)
+async def rag_status(
+    rag: Annotated[RagService, Depends(get_rag_service)],
+    embedding_model: Annotated[str, Depends(get_rag_embedding_model)],
+) -> RagStatusResponse:
+    collections = await rag.list_collections()
+    return RagStatusResponse(embedding_model=embedding_model, collections=collections)
+
+
+@router.post("/index", response_model=RagIndexResponse)
+async def rag_index(
+    request: RagIndexRequest,
+    rag: Annotated[RagService, Depends(get_rag_service)],
+) -> RagIndexResponse:
+    count = await rag.index_text(
+        collection=request.collection,
+        text=request.text,
+        source=request.source,
+        metadata=request.metadata,
+    )
+    return RagIndexResponse(collection=request.collection, chunks_indexed=count)
+
+
+@router.post("/search", response_model=RagSearchResponse)
+async def rag_search(
+    request: RagSearchRequest,
+    rag: Annotated[RagService, Depends(get_rag_service)],
+) -> RagSearchResponse:
+    results = await rag.search(query=request.query, collection=request.collection, top_k=request.top_k)
+    items = [
+        RagSearchResultItem(
+            text=r.document.text,
+            source=r.document.metadata.get("source", ""),
+            chunk_id=r.document.metadata.get("chunk_index", ""),
+            score=r.score,
+        )
+        for r in results
+    ]
+    return RagSearchResponse(query=request.query, results=items)
+
+
+@router.get("/collections", response_model=RagCollectionsResponse)
+async def rag_collections(
+    rag: Annotated[RagService, Depends(get_rag_service)],
+) -> RagCollectionsResponse:
+    collections = await rag.list_collections()
+    return RagCollectionsResponse(collections=collections)
+
+
+@router.delete("/collections/{name}", response_model=RagDeleteCollectionResponse)
+async def rag_delete_collection(
+    name: str,
+    rag: Annotated[RagService, Depends(get_rag_service)],
+) -> RagDeleteCollectionResponse:
+    await rag.delete_collection(name)
+    return RagDeleteCollectionResponse(status="deleted", collection=name)
diff --git a/engine/src/stirling/config/__init__.py b/engine/src/stirling/config/__init__.py
index cb0326172c..c5044a2148 100644
--- a/engine/src/stirling/config/__init__.py
+++ b/engine/src/stirling/config/__init__.py
@@ -1,8 +1,10 @@
 """Configuration models and loaders for the Stirling AI service."""
 
-from .settings import AppSettings, load_settings
+from .settings import ENGINE_ROOT, AppSettings, RagBackend, load_settings
 
 __all__ = [
+    "ENGINE_ROOT",
     "AppSettings",
+    "RagBackend",
     "load_settings",
 ]
diff --git a/engine/src/stirling/config/settings.py b/engine/src/stirling/config/settings.py
index e4ddc81d17..d4e6212283 100644
--- a/engine/src/stirling/config/settings.py
+++ b/engine/src/stirling/config/settings.py
@@ -1,5 +1,8 @@
 from __future__ import annotations
 
+import logging
+import logging.handlers
+from enum import StrEnum
 from functools import lru_cache
 from pathlib import Path
 
@@ -9,18 +12,70 @@ from pydantic_settings import BaseSettings, SettingsConfigDict
 
 ENGINE_ROOT = Path(__file__).resolve().parents[3]
 ENV_FILE = ENGINE_ROOT / ".env"
+ENV_LOCAL_FILE = ENGINE_ROOT / ".env.local"
+
+
+class RagBackend(StrEnum):
+    SQLITE = "sqlite"
+    PGVECTOR = "pgvector"
 
 
 class AppSettings(BaseSettings):
-    model_config = SettingsConfigDict(env_file=ENV_FILE, extra="ignore", populate_by_name=True)
+    model_config = SettingsConfigDict(env_file=(ENV_FILE, ENV_LOCAL_FILE), extra="ignore", populate_by_name=True)
 
     smart_model_name: str = Field(validation_alias="STIRLING_SMART_MODEL")
     fast_model_name: str = Field(validation_alias="STIRLING_FAST_MODEL")
     smart_model_max_tokens: int = Field(validation_alias="STIRLING_SMART_MODEL_MAX_TOKENS")
     fast_model_max_tokens: int = Field(validation_alias="STIRLING_FAST_MODEL_MAX_TOKENS")
 
+    # RAG settings — always on; the backend picks between embedded sqlite-vec and external pgvector.
+    rag_backend: RagBackend = Field(validation_alias="STIRLING_RAG_BACKEND")
+    rag_embedding_model: str = Field(validation_alias="STIRLING_RAG_EMBEDDING_MODEL")
+    rag_store_path: Path = Field(validation_alias="STIRLING_RAG_STORE_PATH")
+    rag_pgvector_dsn: str = Field(validation_alias="STIRLING_RAG_PGVECTOR_DSN")
+    rag_chunk_size: int = Field(validation_alias="STIRLING_RAG_CHUNK_SIZE")
+    rag_chunk_overlap: int = Field(validation_alias="STIRLING_RAG_CHUNK_OVERLAP")
+    rag_default_top_k: int = Field(validation_alias="STIRLING_RAG_TOP_K")
+
+    log_level: str = Field(default="INFO", validation_alias="STIRLING_LOG_LEVEL")
+    log_file: str = Field(default="", validation_alias="STIRLING_LOG_FILE")
+
+    posthog_enabled: bool = Field(validation_alias="STIRLING_POSTHOG_ENABLED")
+    posthog_api_key: str = Field(validation_alias="STIRLING_POSTHOG_API_KEY")
+    posthog_host: str = Field(validation_alias="STIRLING_POSTHOG_HOST")
+
+
+def _configure_logging(level_name: str, log_file: str) -> None:
+    """Configure the ``stirling`` logger hierarchy."""
+    level = logging.getLevelNamesMapping().get(level_name.upper())
+    if level is None:
+        logging.getLogger("stirling").warning(
+            "Unknown STIRLING_LOG_LEVEL %r, defaulting to INFO",
+            level_name,
+        )
+        level = logging.INFO
+
+    root = logging.getLogger("stirling")
+    root.setLevel(level)
+
+    if log_file:
+        log_path = Path(log_file)
+        log_path.parent.mkdir(parents=True, exist_ok=True)
+        fh = logging.handlers.TimedRotatingFileHandler(
+            log_path,
+            when="midnight",
+            backupCount=1,
+            encoding="utf-8",
+        )
+        fh.setFormatter(logging.Formatter("%(asctime)s %(levelname)s %(name)s [%(funcName)s] %(message)s"))
+        fh.setLevel(level)
+        root.addHandler(fh)
+
 
 @lru_cache(maxsize=1)
 def load_settings() -> AppSettings:
     load_dotenv(ENV_FILE)
-    return AppSettings.model_validate({})
+    load_dotenv(ENV_LOCAL_FILE, override=True)
+    settings = AppSettings.model_validate({})
+    _configure_logging(settings.log_level, settings.log_file)
+    return settings
diff --git a/engine/src/stirling/contracts/__init__.py b/engine/src/stirling/contracts/__init__.py
index ba18995d44..aaaf5a173c 100644
--- a/engine/src/stirling/contracts/__init__.py
+++ b/engine/src/stirling/contracts/__init__.py
@@ -8,7 +8,18 @@ from .agent_drafts import (
     AgentRevisionWorkflowResponse,
 )
 from .agent_specs import AgentSpec, AgentSpecStep, AiToolAgentStep
-from .common import ConversationMessage, PdfTextSelection, ToolOperationStep
+from .common import (
+    ArtifactKind,
+    ConversationMessage,
+    ExtractedFileText,
+    PdfContentType,
+    PdfTextSelection,
+    StepKind,
+    SupportedCapability,
+    ToolOperationStep,
+    WorkflowOutcome,
+    format_conversation_history,
+)
 from .execution import (
     AgentExecutionRequest,
     CannotContinueExecutionAction,
@@ -41,7 +52,24 @@ from .form_fill import (
     ProposedProfile,
 )
 from .health import HealthResponse
-from .orchestrator import OrchestratorRequest, OrchestratorResponse, SupportedCapability, UnsupportedCapabilityResponse
+from .ledger import (
+    Discrepancy,
+    DiscrepancyKind,
+    Evidence,
+    Folio,
+    FolioManifest,
+    FolioType,
+    Requisition,
+    Severity,
+    Verdict,
+)
+from .orchestrator import (
+    ExtractedTextArtifact,
+    OrchestratorRequest,
+    OrchestratorResponse,
+    UnsupportedCapabilityResponse,
+    WorkflowArtifact,
+)
 from .pdf_edit import (
     EditCannotDoResponse,
     EditClarificationRequest,
@@ -50,14 +78,27 @@ from .pdf_edit import (
     PdfEditResponse,
 )
 from .pdf_questions import (
+    NeedContentFileRequest,
     PdfQuestionAnswerResponse,
-    PdfQuestionNeedTextResponse,
+    PdfQuestionNeedContentResponse,
     PdfQuestionNotFoundResponse,
     PdfQuestionRequest,
     PdfQuestionResponse,
 )
+from .rag import (
+    MAX_INDEX_TEXT_LENGTH,
+    RagCollectionsResponse,
+    RagDeleteCollectionResponse,
+    RagIndexRequest,
+    RagIndexResponse,
+    RagSearchRequest,
+    RagSearchResponse,
+    RagSearchResultItem,
+    RagStatusResponse,
+)
 
 __all__ = [
+    "MAX_INDEX_TEXT_LENGTH",
     "AgentDraft",
     "AgentDraftRequest",
     "AgentDraftResponse",
@@ -69,48 +110,74 @@ __all__ = [
     "AgentSpec",
     "AgentSpecStep",
     "AiToolAgentStep",
+    "AnalysedFileResult",
+    "ArtifactKind",
     "CannotContinueExecutionAction",
     "CleanedLabel",
+    "CompletedExecutionAction",
     "ConversationMessage",
+    "CrossFileRole",
     "DetectedRole",
+    "Discrepancy",
+    "DiscrepancyKind",
     "DocumentExtractionRequest",
     "DocumentExtractionResponse",
     "DocumentText",
-    "FileFieldSet",
-    "FileFillRequest",
-    "FileFillResult",
-    "FormAnalysisRequest",
-    "FormAnalysisResponse",
-    "AnalysedFileResult",
-    "CrossFileRole",
-    "FormFillBatchRequest",
-    "FormFillBatchResponse",
-    "CompletedExecutionAction",
-    "FieldMapping",
-    "FormField",
     "EditCannotDoResponse",
     "EditClarificationRequest",
     "EditPlanResponse",
+    "Evidence",
     "ExecutionContext",
     "ExecutionStepResult",
+    "ExtractedFileText",
+    "ExtractedTextArtifact",
+    "FieldMapping",
+    "FileFieldSet",
+    "FileFillRequest",
+    "FileFillResult",
+    "Folio",
+    "FolioManifest",
+    "FolioType",
+    "FormAnalysisRequest",
+    "FormAnalysisResponse",
+    "FormField",
+    "FormFillBatchRequest",
+    "FormFillBatchResponse",
+    "format_conversation_history",
     "HealthResponse",
     "KnowledgeEntry",
     "KnowledgeUpdateResponse",
     "MultiProfileExtractionResponse",
+    "NeedContentFileRequest",
+    "ProposedProfile",
     "NextExecutionAction",
     "OrchestratorRequest",
     "OrchestratorResponse",
-    "ProposedProfile",
+    "PdfContentType",
     "PdfEditRequest",
     "PdfEditResponse",
     "PdfQuestionAnswerResponse",
+    "PdfQuestionNeedContentResponse",
     "PdfQuestionNotFoundResponse",
-    "PdfQuestionNeedTextResponse",
     "PdfQuestionRequest",
     "PdfQuestionResponse",
     "PdfTextSelection",
+    "RagCollectionsResponse",
+    "RagDeleteCollectionResponse",
+    "RagIndexRequest",
+    "RagIndexResponse",
+    "RagSearchRequest",
+    "RagSearchResponse",
+    "RagSearchResultItem",
+    "RagStatusResponse",
+    "Requisition",
+    "Severity",
+    "StepKind",
     "SupportedCapability",
-    "ToolOperationStep",
     "ToolCallExecutionAction",
+    "ToolOperationStep",
     "UnsupportedCapabilityResponse",
+    "Verdict",
+    "WorkflowArtifact",
+    "WorkflowOutcome",
 ]
diff --git a/engine/src/stirling/contracts/agent_drafts.py b/engine/src/stirling/contracts/agent_drafts.py
index a59d279f21..752019d348 100644
--- a/engine/src/stirling/contracts/agent_drafts.py
+++ b/engine/src/stirling/contracts/agent_drafts.py
@@ -7,12 +7,12 @@ from pydantic import Field
 from stirling.models import ApiModel
 
 from .agent_specs import AgentSpecStep
-from .common import ConversationMessage
+from .common import ConversationMessage, StepKind, WorkflowOutcome
 from .pdf_edit import EditCannotDoResponse, EditClarificationRequest
 
 
 class AgentDraftStep(ApiModel):
-    kind: Literal["tool", "ai_tool"]
+    kind: Literal[StepKind.TOOL, StepKind.AI_TOOL]
     title: str
     description: str
 
@@ -30,7 +30,7 @@ class AgentDraftRequest(ApiModel):
 
 
 class AgentDraftResponse(ApiModel):
-    outcome: Literal["draft"] = "draft"
+    outcome: Literal[WorkflowOutcome.DRAFT] = WorkflowOutcome.DRAFT
     draft: AgentDraft
 
 
@@ -41,7 +41,7 @@ class AgentRevisionRequest(ApiModel):
 
 
 class AgentRevisionResponse(ApiModel):
-    outcome: Literal["draft"] = "draft"
+    outcome: Literal[WorkflowOutcome.DRAFT] = WorkflowOutcome.DRAFT
     draft: AgentDraft
 
 
diff --git a/engine/src/stirling/contracts/agent_specs.py b/engine/src/stirling/contracts/agent_specs.py
index 403af17807..933d2e6856 100644
--- a/engine/src/stirling/contracts/agent_specs.py
+++ b/engine/src/stirling/contracts/agent_specs.py
@@ -4,16 +4,16 @@ from typing import Annotated, Literal
 
 from pydantic import Field
 
-from stirling.models import ApiModel, OperationId
+from stirling.models import ApiModel, ToolEndpoint
 
-from .common import ToolOperationStep
+from .common import StepKind, ToolOperationStep
 
 
 class AiToolAgentStep(ApiModel):
-    kind: Literal["ai_tool"] = "ai_tool"
+    kind: Literal[StepKind.AI_TOOL] = StepKind.AI_TOOL
     title: str
     description: str
-    tool: OperationId
+    tool: ToolEndpoint
     instruction: str
 
 
diff --git a/engine/src/stirling/contracts/common.py b/engine/src/stirling/contracts/common.py
index 65bb224004..50038d1503 100644
--- a/engine/src/stirling/contracts/common.py
+++ b/engine/src/stirling/contracts/common.py
@@ -1,10 +1,89 @@
 from __future__ import annotations
 
-from typing import Literal
+from enum import StrEnum
+from typing import Literal, assert_never
 
-from pydantic import model_validator
+from pydantic import Field, model_validator
 
-from stirling.models import OPERATIONS, ApiModel, OperationId, ParamToolModel
+from stirling.models import OPERATIONS, ApiModel, ToolEndpoint
+from stirling.models.agent_tool_models import AGENT_OPERATIONS, AgentToolId, AnyParamModel, AnyToolId
+
+
+class PdfContentType(StrEnum):
+    """Types of content that can be extracted from a PDF and sent to the AI.
+
+    Java counterpart: AiPdfContentType.java - values must stay in sync.
+    """
+
+    # Document-level structured data
+    PAGE_LAYOUT = "page_layout"
+    DOCUMENT_METADATA = "document_metadata"
+    ENCRYPTION_INFO = "encryption_info"
+    BOOKMARKS = "bookmarks"
+    LAYERS = "layers"
+    EMBEDDED_FILES = "embedded_files"
+    JAVASCRIPT = "javascript"
+    LINKS = "links"
+    IMAGE_INFO = "image_info"
+    FONTS = "fonts"
+
+    # Text and content
+    PAGE_TEXT = "page_text"
+    FULL_TEXT = "full_text"
+    FORM_FIELDS = "form_fields"
+    ANNOTATIONS = "annotations"
+    SIGNATURES = "signatures"
+    STRUCTURE_TREE = "structure_tree"
+    XMP_METADATA = "xmp_metadata"
+
+    # Heavy content
+    COMPLIANCE = "compliance"
+    IMAGES = "images"
+
+
+class WorkflowOutcome(StrEnum):
+    """Discriminator values for all workflow response unions (outcome field).
+
+    Java counterpart: AiWorkflowOutcome.java - values must stay in sync.
+    """
+
+    ANSWER = "answer"
+    NEED_CONTENT = "need_content"
+    NOT_FOUND = "not_found"
+    PLAN = "plan"
+    NEED_CLARIFICATION = "need_clarification"
+    CANNOT_DO = "cannot_do"
+    DRAFT = "draft"
+    TOOL_CALL = "tool_call"
+    COMPLETED = "completed"
+    CANNOT_CONTINUE = "cannot_continue"
+    UNSUPPORTED_CAPABILITY = "unsupported_capability"
+
+
+class ArtifactKind(StrEnum):
+    """Discriminator values for WorkflowArtifact unions (kind field).
+
+    Java counterpart: PdfContentExtractor.ArtifactKind - values must stay in sync.
+    """
+
+    EXTRACTED_TEXT = "extracted_text"
+
+
+class StepKind(StrEnum):
+    """Discriminator values for AgentSpecStep unions (kind field)."""
+
+    TOOL = "tool"
+    AI_TOOL = "ai_tool"
+
+
+class SupportedCapability(StrEnum):
+    ORCHESTRATE = "orchestrate"
+    PDF_EDIT = "pdf_edit"
+    PDF_QUESTION = "pdf_question"
+    AGENT_DRAFT = "agent_draft"
+    AGENT_REVISE = "agent_revise"
+    AGENT_NEXT_ACTION = "agent_next_action"
+    MATH_AUDITOR_AGENT = "math_auditor_agent"
 
 
 class ConversationMessage(ApiModel):
@@ -12,21 +91,37 @@ class ConversationMessage(ApiModel):
     content: str
 
 
+def format_conversation_history(conversation_history: list[ConversationMessage]) -> str:
+    if not conversation_history:
+        return "None"
+    return "\n".join(f"- {message.role}: {message.content}" for message in conversation_history)
+
+
 class PdfTextSelection(ApiModel):
     page_number: int | None = None
     text: str
 
 
+class ExtractedFileText(ApiModel):
+    file_name: str
+    pages: list[PdfTextSelection] = Field(default_factory=list)
+
+
 class ToolOperationStep(ApiModel):
-    kind: Literal["tool"] = "tool"
-    tool: OperationId
-    parameters: ParamToolModel
+    kind: Literal[StepKind.TOOL] = StepKind.TOOL
+    tool: AnyToolId
+    parameters: AnyParamModel
 
     @model_validator(mode="after")
     def validate_tool_parameter_pairing(self) -> ToolOperationStep:
-        expected_type = OPERATIONS[self.tool]
+        if isinstance(self.tool, AgentToolId):
+            expected_type = AGENT_OPERATIONS[self.tool]
+        elif isinstance(self.tool, ToolEndpoint):
+            expected_type = OPERATIONS[self.tool]
+        else:
+            assert_never(self.tool)
+
         if not isinstance(self.parameters, expected_type):
             actual_type = type(self.parameters).__name__
-            expected_type_name = expected_type.__name__
-            raise ValueError(f"Parameters for tool {self.tool.value} must be {expected_type_name}, got {actual_type}.")
+            raise ValueError(f"Parameters for tool {self.tool} must be {expected_type.__name__}, got {actual_type}.")
         return self
diff --git a/engine/src/stirling/contracts/execution.py b/engine/src/stirling/contracts/execution.py
index 64e70d682a..a5a227c70e 100644
--- a/engine/src/stirling/contracts/execution.py
+++ b/engine/src/stirling/contracts/execution.py
@@ -4,14 +4,15 @@ from typing import Annotated, Any, Literal
 
 from pydantic import Field
 
-from stirling.models import ApiModel, OperationId, ParamToolModel
+from stirling.models import ApiModel, ParamToolModel, ToolEndpoint
 
 from .agent_specs import AgentSpec
+from .common import WorkflowOutcome
 
 
 class ExecutionStepResult(ApiModel):
     step_index: int
-    tool: OperationId | None = None
+    tool: ToolEndpoint | None = None
     success: bool
     output_summary: str | None = None
     output_data: dict[str, Any] = Field(default_factory=dict)
@@ -31,19 +32,19 @@ class AgentExecutionRequest(ApiModel):
 
 
 class ToolCallExecutionAction(ApiModel):
-    outcome: Literal["tool_call"] = "tool_call"
-    tool: OperationId
+    outcome: Literal[WorkflowOutcome.TOOL_CALL] = WorkflowOutcome.TOOL_CALL
+    tool: ToolEndpoint
     parameters: ParamToolModel
     rationale: str | None = None
 
 
 class CompletedExecutionAction(ApiModel):
-    outcome: Literal["completed"] = "completed"
+    outcome: Literal[WorkflowOutcome.COMPLETED] = WorkflowOutcome.COMPLETED
     summary: str
 
 
 class CannotContinueExecutionAction(ApiModel):
-    outcome: Literal["cannot_continue"] = "cannot_continue"
+    outcome: Literal[WorkflowOutcome.CANNOT_CONTINUE] = WorkflowOutcome.CANNOT_CONTINUE
     reason: str
 
 
diff --git a/engine/src/stirling/contracts/ledger.py b/engine/src/stirling/contracts/ledger.py
new file mode 100644
index 0000000000..bc31b960e1
--- /dev/null
+++ b/engine/src/stirling/contracts/ledger.py
@@ -0,0 +1,196 @@
+"""
+Ledger Auditor — shared models for the Java-Python protocol.
+
+Every struct that crosses the wire lives here so the contract is
+impossible to miss or partially implement.
+"""
+
+from __future__ import annotations
+
+from enum import StrEnum
+from typing import Literal
+
+from pydantic import Field
+
+from stirling.models import ApiModel
+
+# ---------------------------------------------------------------------------
+# Page classification — Java's side of the conversation
+# ---------------------------------------------------------------------------
+
+
+class FolioType(StrEnum):
+    """How Java classifies each page after a cheap PDFBox scan.
+
+    Java counterpart: FolioType.java - values must stay in sync.
+    """
+
+    TEXT = "text"  # selectable text layer present
+    IMAGE = "image"  # image-only, will need OCR
+    MIXED = "mixed"  # partial text layer + embedded images
+
+
+class FolioManifest(ApiModel):
+    """
+    Java's opening move: a fast, cheap page classification with no OCR or
+    table extraction — just PDFBox character counts and image detection.
+
+    Python inspects this and returns a Requisition declaring what it needs.
+    """
+
+    session_id: str = Field(description="Opaque handle Java uses to find the PDF on disk.")
+    page_count: int = Field(ge=1)
+    folio_types: list[FolioType] = Field(description="One entry per page (0-indexed). len(folio_types) == page_count.")
+    round: int = Field(default=1, ge=1, le=3, description="Which negotiation round this is.")
+
+
+# ---------------------------------------------------------------------------
+# Requisition — Python's declaration of what it needs
+# ---------------------------------------------------------------------------
+
+
+class Requisition(ApiModel):
+    """
+    Python's reply to a FolioManifest: a precise shopping list of what Java
+    must extract before the auditor can form an opinion.
+
+    Java fulfils this and sends back an Evidence payload.
+    """
+
+    type: Literal["requisition"] = "requisition"
+    need_text: list[int] = Field(
+        default_factory=list,
+        description="0-indexed page numbers. Java runs PDFBox text extraction on these.",
+    )
+    need_tables: list[int] = Field(
+        default_factory=list,
+        description="0-indexed page numbers. Java runs Tabula CSV extraction on these.",
+    )
+    need_ocr: list[int] = Field(
+        default_factory=list,
+        description="0-indexed page numbers. Java runs OCRmyPDF on these.",
+    )
+    rationale: str = Field(description="Plain-language reason, written for log readability, not the client.")
+
+
+# ---------------------------------------------------------------------------
+# Evidence — Java's fulfilment of a Requisition
+# ---------------------------------------------------------------------------
+
+
+class Folio(ApiModel):
+    """
+    One page's worth of extracted content — whatever Java was able to provide
+    in response to the Requisition for that page.
+    """
+
+    page: int = Field(ge=0, description="0-indexed page number.")
+    text: str | None = Field(default=None, description="PDFBox plain-text extraction.")
+    tables: list[str] | None = Field(default=None, description="Tabula CSV strings, one per table found on the page.")
+    ocr_text: str | None = Field(default=None, description="OCRmyPDF output text.")
+    ocr_confidence: float | None = Field(
+        default=None, ge=0.0, le=1.0, description="Mean character confidence from OCRmyPDF."
+    )
+
+    @property
+    def readable_text(self) -> str:
+        """Best available text for this folio — OCR wins over digital when present."""
+        return self.ocr_text or self.text or ""
+
+
+class Evidence(ApiModel):
+    """
+    Java's fulfilment package: the extracted content Python asked for.
+    Java may also set final_round=True on the last allowable round to signal
+    that the auditor must return a Verdict regardless of remaining questions.
+    """
+
+    session_id: str
+    folios: list[Folio]
+    round: int = Field(ge=1, le=3)
+    final_round: bool = Field(
+        default=False,
+        description="When True, Java will not honour further Requisitions. "
+        "The auditor must return a Verdict this round.",
+    )
+    unauditable_pages: list[int] = Field(
+        default_factory=list,
+        description=(
+            "Pages that were requested in the Requisition but could not be fulfilled — "
+            "e.g. OCR was asked for but is not wired. The Auditor echoes these into "
+            "Verdict.unauditable_pages so the client knows coverage is incomplete."
+        ),
+    )
+
+
+# ---------------------------------------------------------------------------
+# Findings — what the auditor discovers
+# ---------------------------------------------------------------------------
+
+
+class DiscrepancyKind(StrEnum):
+    """Java counterpart: DiscrepancyKind.java - values must stay in sync."""
+
+    TALLY = "tally"  # a row/column sum is wrong
+    ARITHMETIC = "arithmetic"  # an inline calculation is wrong
+    CONSISTENCY = "consistency"  # the same figure is stated differently elsewhere
+    STATEMENT = "statement"  # a prose claim contradicts the numbers
+
+
+class Severity(StrEnum):
+    """Java counterpart: AuditSeverity.java - values must stay in sync."""
+
+    ERROR = "error"  # definite arithmetic mistake
+    WARNING = "warning"  # possible rounding or ambiguity
+
+
+class Discrepancy(ApiModel):
+    """A single mathematical error found in the document."""
+
+    page: int = Field(ge=0)
+    kind: DiscrepancyKind
+    severity: Severity
+    description: str = Field(description="Human-readable explanation of the error.")
+    stated: str = Field(description="The value as it appears in the document.")
+    expected: str = Field(description="The value the auditor calculated.")
+    context: str = Field(
+        default="",
+        description="Surrounding text or table fragment for traceability.",
+    )
+
+
+# ---------------------------------------------------------------------------
+# Verdict — the final report
+# ---------------------------------------------------------------------------
+
+
+class Verdict(ApiModel):
+    """
+    The auditor's final opinion on the document's mathematical integrity.
+    Returned to Java as the terminal message in the negotiation.
+    """
+
+    type: Literal["verdict"] = "verdict"
+    session_id: str
+    discrepancies: list[Discrepancy] = Field(default_factory=list)
+    pages_examined: list[int] = Field(description="0-indexed page numbers the auditor actually inspected.")
+    rounds_taken: int = Field(ge=1, le=3)
+    summary: str = Field(description="One or two sentences summarising the audit outcome for the client.")
+    clean: bool = Field(description="True iff no errors were found (warnings are tolerated).")
+    unauditable_pages: list[int] = Field(
+        default_factory=list,
+        description=(
+            "0-indexed pages that could not be audited — typically because OCR was "
+            "requested but is not yet wired. Java populates this by omitting the folio "
+            "and the Auditor echoes the page number here so the client knows coverage "
+            "is incomplete."
+        ),
+    )
+
+    @property
+    def error_count(self) -> int:
+        return sum(1 for d in self.discrepancies if d.severity == Severity.ERROR)
+
+    @property
+    def warning_count(self) -> int:
+        return sum(1 for d in self.discrepancies if d.severity == Severity.WARNING)
diff --git a/engine/src/stirling/contracts/orchestrator.py b/engine/src/stirling/contracts/orchestrator.py
index 823b0f9d12..f38a2f8379 100644
--- a/engine/src/stirling/contracts/orchestrator.py
+++ b/engine/src/stirling/contracts/orchestrator.py
@@ -1,6 +1,5 @@
 from __future__ import annotations
 
-from enum import StrEnum
 from typing import Annotated, Literal
 
 from pydantic import Field
@@ -8,29 +7,37 @@ from pydantic import Field
 from stirling.models import ApiModel
 
 from .agent_drafts import AgentDraftResponse
+from .common import (
+    ArtifactKind,
+    ConversationMessage,
+    ExtractedFileText,
+    SupportedCapability,
+    WorkflowOutcome,
+)
 from .execution import NextExecutionAction
 from .form_fill import KnowledgeUpdateResponse
 from .pdf_edit import PdfEditResponse
 from .pdf_questions import PdfQuestionResponse
 
 
-class SupportedCapability(StrEnum):
-    ORCHESTRATE = "orchestrate"
-    PDF_EDIT = "pdf_edit"
-    PDF_QUESTION = "pdf_question"
-    AGENT_DRAFT = "agent_draft"
-    AGENT_REVISE = "agent_revise"
-    AGENT_NEXT_ACTION = "agent_next_action"
-    FORM_FILL = "form_fill"
+class ExtractedTextArtifact(ApiModel):
+    kind: Literal[ArtifactKind.EXTRACTED_TEXT] = ArtifactKind.EXTRACTED_TEXT
+    files: list[ExtractedFileText] = Field(default_factory=list)
+
+
+WorkflowArtifact = Annotated[ExtractedTextArtifact, Field(discriminator="kind")]
 
 
 class OrchestratorRequest(ApiModel):
     user_message: str
-    conversation_id: str | None = None
+    file_names: list[str]
+    conversation_history: list[ConversationMessage] = Field(default_factory=list)
+    artifacts: list[WorkflowArtifact] = Field(default_factory=list)
+    resume_with: SupportedCapability | None = None
 
 
 class UnsupportedCapabilityResponse(ApiModel):
-    outcome: Literal["unsupported_capability"] = "unsupported_capability"
+    outcome: Literal[WorkflowOutcome.UNSUPPORTED_CAPABILITY] = WorkflowOutcome.UNSUPPORTED_CAPABILITY
     capability: str
     message: str
 
diff --git a/engine/src/stirling/contracts/pdf_edit.py b/engine/src/stirling/contracts/pdf_edit.py
index e3e1e60579..a7bcedfa9d 100644
--- a/engine/src/stirling/contracts/pdf_edit.py
+++ b/engine/src/stirling/contracts/pdf_edit.py
@@ -6,30 +6,30 @@ from pydantic import Field
 
 from stirling.models import ApiModel
 
-from .common import ToolOperationStep
+from .common import ConversationMessage, ToolOperationStep, WorkflowOutcome
 
 
 class PdfEditRequest(ApiModel):
     user_message: str
-    conversation_id: str | None = None
     file_names: list[str] = Field(default_factory=list)
+    conversation_history: list[ConversationMessage] = Field(default_factory=list)
 
 
 class EditPlanResponse(ApiModel):
-    outcome: Literal["plan"] = "plan"
+    outcome: Literal[WorkflowOutcome.PLAN] = WorkflowOutcome.PLAN
     summary: str
     rationale: str | None = None
     steps: list[ToolOperationStep]
 
 
 class EditClarificationRequest(ApiModel):
-    outcome: Literal["need_clarification"] = "need_clarification"
+    outcome: Literal[WorkflowOutcome.NEED_CLARIFICATION] = WorkflowOutcome.NEED_CLARIFICATION
     question: str
     reason: str
 
 
 class EditCannotDoResponse(ApiModel):
-    outcome: Literal["cannot_do"] = "cannot_do"
+    outcome: Literal[WorkflowOutcome.CANNOT_DO] = WorkflowOutcome.CANNOT_DO
     reason: str
 
 
diff --git a/engine/src/stirling/contracts/pdf_questions.py b/engine/src/stirling/contracts/pdf_questions.py
index 3ac12bdfe8..4ee0d25966 100644
--- a/engine/src/stirling/contracts/pdf_questions.py
+++ b/engine/src/stirling/contracts/pdf_questions.py
@@ -6,31 +6,49 @@ from pydantic import Field
 
 from stirling.models import ApiModel
 
+from .common import (
+    ConversationMessage,
+    ExtractedFileText,
+    PdfContentType,
+    SupportedCapability,
+    WorkflowOutcome,
+)
+
 
 class PdfQuestionRequest(ApiModel):
     question: str
-    conversation_id: str | None = None
-    extracted_text: str = ""
-    file_name: str | None = None
+    page_text: list[ExtractedFileText] = Field(default_factory=list)
+    file_names: list[str]
+    conversation_history: list[ConversationMessage] = Field(default_factory=list)
 
 
 class PdfQuestionAnswerResponse(ApiModel):
-    outcome: Literal["answer"] = "answer"
+    outcome: Literal[WorkflowOutcome.ANSWER] = WorkflowOutcome.ANSWER
     answer: str
-    evidence: list[str] = Field(default_factory=list)
+    evidence: list[ExtractedFileText] = Field(default_factory=list)
 
 
-class PdfQuestionNeedTextResponse(ApiModel):
-    outcome: Literal["need_text"] = "need_text"
+class NeedContentFileRequest(ApiModel):
+    file_name: str
+    page_numbers: list[int] = Field(default_factory=list)
+    content_types: list[PdfContentType]
+
+
+class PdfQuestionNeedContentResponse(ApiModel):
+    outcome: Literal[WorkflowOutcome.NEED_CONTENT] = WorkflowOutcome.NEED_CONTENT
+    resume_with: SupportedCapability = SupportedCapability.PDF_QUESTION
     reason: str
+    files: list[NeedContentFileRequest] = Field(default_factory=list)
+    max_pages: int
+    max_characters: int
 
 
 class PdfQuestionNotFoundResponse(ApiModel):
-    outcome: Literal["not_found"] = "not_found"
+    outcome: Literal[WorkflowOutcome.NOT_FOUND] = WorkflowOutcome.NOT_FOUND
     reason: str
 
 
 PdfQuestionResponse = Annotated[
-    PdfQuestionAnswerResponse | PdfQuestionNeedTextResponse | PdfQuestionNotFoundResponse,
+    PdfQuestionAnswerResponse | PdfQuestionNeedContentResponse | PdfQuestionNotFoundResponse,
     Field(discriminator="outcome"),
 ]
diff --git a/engine/src/stirling/contracts/rag.py b/engine/src/stirling/contracts/rag.py
new file mode 100644
index 0000000000..c4cea35af1
--- /dev/null
+++ b/engine/src/stirling/contracts/rag.py
@@ -0,0 +1,51 @@
+from __future__ import annotations
+
+from pydantic import Field
+
+from stirling.models import ApiModel
+
+MAX_INDEX_TEXT_LENGTH = 1_000_000  # 1MB text limit per index request
+
+
+class RagStatusResponse(ApiModel):
+    embedding_model: str
+    collections: list[str]
+
+
+class RagIndexRequest(ApiModel):
+    collection: str = Field(min_length=1)
+    text: str = Field(max_length=MAX_INDEX_TEXT_LENGTH)
+    source: str = ""
+    metadata: dict[str, str] = Field(default_factory=dict)
+
+
+class RagIndexResponse(ApiModel):
+    collection: str
+    chunks_indexed: int
+
+
+class RagSearchRequest(ApiModel):
+    query: str
+    collection: str | None = Field(default=None, min_length=1)
+    top_k: int = 5
+
+
+class RagSearchResultItem(ApiModel):
+    text: str
+    source: str
+    chunk_id: str
+    score: float
+
+
+class RagSearchResponse(ApiModel):
+    query: str
+    results: list[RagSearchResultItem]
+
+
+class RagCollectionsResponse(ApiModel):
+    collections: list[str]
+
+
+class RagDeleteCollectionResponse(ApiModel):
+    status: str
+    collection: str
diff --git a/engine/src/stirling/logging.py b/engine/src/stirling/logging.py
new file mode 100644
index 0000000000..a0a6fec20b
--- /dev/null
+++ b/engine/src/stirling/logging.py
@@ -0,0 +1,22 @@
+"""Shared logging utilities for the Stirling AI engine."""
+
+from __future__ import annotations
+
+import json
+
+
+class Pretty:
+    """Lazy JSON formatter — only serialises when ``str()`` is called.
+
+    Designed for use with ``logging``'s ``%s`` formatting so that the
+    JSON serialisation is skipped entirely when the log message is
+    never emitted.
+    """
+
+    __slots__ = ("_obj",)
+
+    def __init__(self, obj: object) -> None:
+        self._obj = obj
+
+    def __str__(self) -> str:
+        return json.dumps(self._obj, indent=2, default=str, ensure_ascii=True)
diff --git a/engine/src/stirling/models/__init__.py b/engine/src/stirling/models/__init__.py
index 7877141aaf..0d4c774d0e 100644
--- a/engine/src/stirling/models/__init__.py
+++ b/engine/src/stirling/models/__init__.py
@@ -1,11 +1,11 @@
 from . import tool_models
 from .base import ApiModel
-from .tool_models import OPERATIONS, OperationId, ParamToolModel
+from .tool_models import OPERATIONS, ParamToolModel, ToolEndpoint
 
 __all__ = [
     "ApiModel",
     "OPERATIONS",
-    "OperationId",
     "ParamToolModel",
+    "ToolEndpoint",
     "tool_models",
 ]
diff --git a/engine/src/stirling/models/agent_tool_models.py b/engine/src/stirling/models/agent_tool_models.py
new file mode 100644
index 0000000000..ecbcde78d7
--- /dev/null
+++ b/engine/src/stirling/models/agent_tool_models.py
@@ -0,0 +1,30 @@
+"""Agent tool IDs, parameter models, and registry.
+
+tool_models.py is auto-generated from the Java OpenAPI spec. This file is its
+manually-maintained counterpart for tools backed by AI agent pipelines.
+"""
+
+from __future__ import annotations
+
+from enum import StrEnum
+
+from stirling.models.base import ApiModel
+from stirling.models.tool_models import ParamToolModel, ToolEndpoint
+
+
+class AgentToolId(StrEnum):
+    MATH_AUDITOR_AGENT = "mathAuditorAgent"
+
+
+class MathAuditorAgentParams(ApiModel):
+    tolerance: str = "0.01"
+
+
+type AgentParamModel = MathAuditorAgentParams
+
+type AnyToolId = ToolEndpoint | AgentToolId
+type AnyParamModel = ParamToolModel | AgentParamModel
+
+AGENT_OPERATIONS: dict[AgentToolId, type[AgentParamModel]] = {
+    AgentToolId.MATH_AUDITOR_AGENT: MathAuditorAgentParams,
+}
diff --git a/engine/src/stirling/models/tool_models.py b/engine/src/stirling/models/tool_models.py
index 334d88442d..d671441141 100644
--- a/engine/src/stirling/models/tool_models.py
+++ b/engine/src/stirling/models/tool_models.py
@@ -1,439 +1,1380 @@
 # AUTO-GENERATED FILE. DO NOT EDIT.
-# Generated by scripts/generate_tool_models.py from frontend TypeScript sources.
+# Generated by scripts/generate_tool_models.py from Java OpenAPI spec (SwaggerDoc.json).
+# ruff: noqa: E501
+
 from __future__ import annotations
 
-from enum import StrEnum
-from typing import Any, Literal
+from enum import Enum, IntEnum, StrEnum
+from typing import Any
+
+from pydantic import Field, RootModel, SecretStr
 
 from stirling.models.base import ApiModel
 
 
 class AddAttachmentsParams(ApiModel):
-    attachments: list[dict[str, Any]] = []
-
-
-class AdjustContrastParams(ApiModel):
-    blue: float = 100
-    brightness: float = 100
-    contrast: float = 100
-    green: float = 100
-    red: float = 100
-    saturation: float = 100
-
-
-class AutoRenameParams(ApiModel):
-    use_first_text_as_fallback: bool = False
-
-
-class AutomateParams(ApiModel):
-    pass
-
-
-class BookletImpositionParams(ApiModel):
-    add_border: bool = False
-    add_gutter: bool = False
-    double_sided: bool = True
-    duplex_pass: Literal["BOTH", "FIRST", "SECOND"] = "BOTH"
-    flip_on_short_edge: bool = False
-    gutter_size: float = 12
-    pages_per_sheet: float = 2
-    spine_location: Literal["LEFT", "RIGHT"] = "LEFT"
-
-
-class CertSignParams(ApiModel):
-    cert_file: dict[str, Any] | None = None
-    cert_type: Literal["", "PEM", "PKCS12", "PFX", "JKS"] = ""
-    jks_file: dict[str, Any] | None = None
-    location: str = ""
-    name: str = ""
-    p12_file: dict[str, Any] | None = None
-    page_number: float = 1
-    password: str = ""
-    private_key_file: dict[str, Any] | None = None
-    reason: str = ""
-    show_logo: bool = True
-    show_signature: bool = False
-    sign_mode: Literal["MANUAL", "AUTO"] = "MANUAL"
-
-
-class ChangeMetadataParams(ApiModel):
-    author: str = ""
-    creation_date: str | None = None
-    creator: str = ""
-    custom_metadata: list[dict[str, str]] = []
-    delete_all: bool = False
-    keywords: str = ""
-    modification_date: str | None = None
-    producer: str = ""
-    subject: str = ""
-    title: str = ""
-    trapped: Literal["True", "False", "Unknown"] | None = None
-
-
-class ChangePermissionsParams(ApiModel):
-    prevent_assembly: bool = False
-    prevent_extract_content: bool = False
-    prevent_extract_for_accessibility: bool = False
-    prevent_fill_in_form: bool = False
-    prevent_modify: bool = False
-    prevent_modify_annotations: bool = False
-    prevent_printing: bool = False
-    prevent_printing_faithful: bool = False
-
-
-class AddPasswordParams(ApiModel):
-    key_length: float = 128
-    owner_password: str = ""
-    password: str = ""
-    permissions: ChangePermissionsParams = ChangePermissionsParams.model_validate(
-        {
-            "preventAssembly": False,
-            "preventExtractContent": False,
-            "preventExtractForAccessibility": False,
-            "preventFillInForm": False,
-            "preventModify": False,
-            "preventModifyAnnotations": False,
-            "preventPrinting": False,
-            "preventPrintingFaithful": False,
-        }
+    attachments: list[bytes] | None = Field(None, description="The image file to be overlaid onto the PDF.")
+    convert_to_pdf_a3b: bool | None = Field(
+        False, description="Convert the resulting PDF to PDF/A-3b format after adding attachments"
     )
 
 
-class CompressParams(ApiModel):
-    compression_level: float = 5
-    compression_method: Literal["quality", "filesize"] = "quality"
-    expected_size: str = ""
-    file_size_unit: Literal["KB", "MB"] = "MB"
-    file_size_value: str = ""
-    grayscale: bool = False
+class AddImageParams(ApiModel):
+    every_page: bool | None = Field(False, description="Whether to overlay the image onto every page of the PDF.")
+    x: float | None = Field(0, description="The x-coordinate at which to place the top-left corner of the image.")
+    y: float | None = Field(0, description="The y-coordinate at which to place the top-left corner of the image.")
 
 
-class ConvertParams(ApiModel):
-    cbz_options: dict[str, bool] = {"optimizeForEbook": False}
-    cbz_output_options: dict[str, float] = {"dpi": 150}
-    email_options: dict[str, Any] = {
-        "includeAttachments": True,
-        "maxAttachmentSizeMB": 10,
-        "downloadHtml": False,
-        "includeAllRecipients": False,
-    }
-    from_extension: str = ""
-    html_options: dict[str, float] = {"zoomLevel": 1}
-    image_options: dict[str, Any] = {
-        "colorType": "color",
-        "dpi": 300,
-        "singleOrMultiple": "multiple",
-        "fitOption": "maintainAspectRatio",
-        "autoRotate": True,
-        "combineImages": True,
-    }
-    is_smart_detection: bool = False
-    pdfa_options: dict[str, str] = {"outputFormat": "pdfa-1"}
-    smart_detection_type: Literal["mixed", "images", "web", "none"] = "none"
-    to_extension: str = ""
+class CustomMargin(StrEnum):
+    small = "small"
+    medium = "medium"
+    large = "large"
+    x_large = "x-large"
+
+
+class FontType(StrEnum):
+    helvetica = "helvetica"
+    courier = "courier"
+    times = "times"
+
+
+class Position(IntEnum):
+    integer_1 = 1
+    integer_2 = 2
+    integer_3 = 3
+    integer_4 = 4
+    integer_5 = 5
+    integer_6 = 6
+    integer_7 = 7
+    integer_8 = 8
+    integer_9 = 9
+
+
+class AddPageNumbersParams(ApiModel):
+    custom_margin: CustomMargin | None = Field(
+        CustomMargin.medium, description="Custom margin: small/medium/large/x-large"
+    )
+    custom_text: str | None = Field(
+        "{n}",
+        description="Custom text pattern. Available variables: {n}=current page number, {total}=total pages, {filename}=original filename",
+        examples=["Page {n} of {total}"],
+    )
+    font_color: str | None = Field(
+        "#000000", description="Hex colour for page numbers (e.g. #FF0000)", examples=["#000000"]
+    )
+    font_size: float | None = Field(12, description="Font size for page numbers", ge=1.0)
+    font_type: FontType | None = Field(None, description="Font type for page numbers")
+    page_numbers: str | None = Field(
+        "all",
+        description="The pages to select, Supports ranges (e.g., '1,3,5-9'), or 'all' or functions in the format 'an+b' where 'a' is the multiplier of the page number 'n', and 'b' is a constant (e.g., '2n+1', '3n', '6n-5')",
+    )
+    pages_to_number: str | None = Field("all", description="Which pages to number (e.g. '1,3-5,7' or 'all')")
+    position: Position | None = Field(
+        None,
+        description="Position: 1-9 representing positions on the page (1=top-left, 2=top-center, 3=top-right, 4=middle-left, 5=middle-center, 6=middle-right, 7=bottom-left, 8=bottom-center, 9=bottom-right)",
+    )
+    starting_number: int | None = Field(1, description="Starting number for page numbering", ge=1)
+    zero_pad: int | None = Field(
+        0, description="Zero-padding width for page numbers (Bates Stamping). Set to 0 to disable padding", ge=0
+    )
+
+
+class KeyLength(IntEnum):
+    integer_40 = 40
+    integer_128 = 128
+    integer_256 = 256
+
+
+class AddPasswordParams(ApiModel):
+    key_length: KeyLength | None = Field(None, description="The length of the encryption key")
+    owner_password: SecretStr | None = Field(
+        None,
+        description="The owner password to be added to the PDF file (Restricts what can be done with the document once it is opened)",
+    )
+    password: SecretStr | None = Field(
+        None, description="The password to be added to the PDF file (Restricts the opening of the document itself.)"
+    )
+    prevent_assembly: bool | None = Field(False, description="Whether document assembly is prevented")
+    prevent_extract_content: bool | None = Field(False, description="Whether content extraction is prevented")
+    prevent_extract_for_accessibility: bool | None = Field(
+        False, description="Whether content extraction for accessibility is prevented"
+    )
+    prevent_fill_in_form: bool | None = Field(False, description="Whether form filling is prevented")
+    prevent_modify: bool | None = Field(False, description="Whether document modification is prevented")
+    prevent_modify_annotations: bool | None = Field(
+        False, description="Whether modification of annotations is prevented"
+    )
+    prevent_printing: bool | None = Field(False, description="Whether printing of the document is prevented")
+    prevent_printing_faithful: bool | None = Field(False, description="Whether faithful printing is prevented")
+
+
+class Alphabet(StrEnum):
+    roman = "roman"
+    arabic = "arabic"
+    japanese = "japanese"
+    korean = "korean"
+    chinese = "chinese"
+    thai = "thai"
+
+
+class StampType(StrEnum):
+    text = "text"
+    image = "image"
+
+
+class AddStampParams(ApiModel):
+    alphabet: Alphabet | None = Field(Alphabet.roman, description="The selected alphabet of the stamp text")
+    custom_color: str | None = Field("#d3d3d3", description="The color of the stamp text")
+    custom_margin: CustomMargin | None = Field(
+        CustomMargin.medium, description="Specifies the margin size for the stamp."
+    )
+    font_size: float | None = Field(40, description="The font size of the stamp text and image in points.")
+    opacity: float | None = Field(0.5, description="The opacity of the stamp (0.0 - 1.0)")
+    override_x: float | None = Field(
+        -1,
+        description="Override X coordinate for stamp placement. If set, it will override the position-based calculation. Negative value means no override.",
+    )
+    override_y: float | None = Field(
+        -1,
+        description="Override Y coordinate for stamp placement. If set, it will override the position-based calculation. Negative value means no override.",
+    )
+    page_numbers: str | None = Field(
+        "all",
+        description="The pages to select, Supports ranges (e.g., '1,3,5-9'), or 'all' or functions in the format 'an+b' where 'a' is the multiplier of the page number 'n', and 'b' is a constant (e.g., '2n+1', '3n', '6n-5')",
+    )
+    position: Position | None = Field(
+        Position.integer_8,
+        description="Position for stamp placement based on a 1-9 grid (1: bottom-left, 2: bottom-center, 3: bottom-right, 4: middle-left, 5: middle-center, 6: middle-right, 7: top-left, 8: top-center, 9: top-right)",
+    )
+    rotation: float | None = Field(0, description="The rotation of the stamp in degrees")
+    stamp_text: str | None = Field("Stirling Software", description="The stamp text")
+    stamp_type: StampType | None = Field(None, description="The stamp type (text or image)")
+
+
+class WatermarkType(StrEnum):
+    text = "text"
+    image = "image"
+
+
+class AddWatermarkParams(ApiModel):
+    alphabet: Alphabet | None = Field(Alphabet.roman, description="The selected alphabet")
+    convert_pdf_to_image: bool | None = Field(False, description="Convert the redacted PDF to an image")
+    custom_color: str | None = Field("#d3d3d3", description="The color for watermark")
+    font_size: float | None = Field(30, description="The font size of the watermark text", ge=1.0)
+    height_spacer: int | None = Field(50, description="The height spacer between watermark elements", ge=0)
+    opacity: float | None = Field(0.5, description="The opacity of the watermark (0.0 - 1.0)")
+    rotation: float | None = Field(0, description="The rotation of the watermark in degrees")
+    watermark_text: str | None = Field("Stirling Software", description="The watermark text")
+    watermark_type: WatermarkType | None = Field(None, description="The watermark type (text or image)")
+    width_spacer: int | None = Field(50, description="The width spacer between watermark elements", ge=0)
+
+
+class AutoRedactParams(ApiModel):
+    convert_pdf_to_image: bool | None = Field(False, description="Convert the redacted PDF to an image")
+    custom_padding: float | None = Field(None, description="Custom padding for redaction")
+    list_of_text: str | None = Field("text,text2", description="List of text to redact from the PDF")
+    redact_color: str | None = Field("#000000", description="The color for redaction")
+    use_regex: bool | None = Field(False, description="Whether to use regex for the listOfText")
+    whole_word_search: bool | None = Field(False, description="Whether to use whole word search")
+
+
+class AutoRenameParams(ApiModel):
+    use_first_text_as_fallback: bool | None = Field(
+        False,
+        description="Flag indicating whether to use the first text as a fallback if no suitable title is found. Defaults to false.",
+    )
+
+
+class AutoSplitPdfParams(ApiModel):
+    duplex_mode: bool | None = Field(
+        False,
+        description="Flag indicating if the duplex mode is active, where the page after the divider also gets removed.",
+    )
+
+
+class DuplexPass(StrEnum):
+    both = "BOTH"
+    first = "FIRST"
+    second = "SECOND"
+
+
+class PagesPerSheet(Enum):
+    number_2 = 2
+
+
+class SpineLocation(StrEnum):
+    left = "LEFT"
+    right = "RIGHT"
+
+
+class BookletImpositionParams(ApiModel):
+    add_border: bool | None = Field(None, description="Boolean for if you wish to add border around the pages")
+    add_gutter: bool | None = Field(None, description="Add gutter margin (inner margin for binding)")
+    double_sided: bool | None = Field(None, description="Generate both front and back sides (double-sided printing)")
+    duplex_pass: DuplexPass | None = Field(DuplexPass.both, description="For manual duplex: which pass to generate")
+    flip_on_short_edge: bool | None = Field(
+        None, description="Flip back sides for short-edge duplex printing (default is long-edge)"
+    )
+    gutter_size: float | None = Field(12, description="Gutter margin size in points (used when addGutter is true)")
+    pages_per_sheet: PagesPerSheet | None = Field(
+        PagesPerSheet.number_2,
+        description="The number of pages per side for booklet printing (always 2 for proper booklet).",
+    )
+    spine_location: SpineLocation | None = Field(SpineLocation.left, description="The spine location for the booklet.")
+
+
+class CbrToPdfParams(ApiModel):
+    optimize_for_ebook: bool | None = Field(
+        False, description="Optimize the output PDF for ebook reading using Ghostscript"
+    )
+
+
+class CbzToPdfParams(ApiModel):
+    optimize_for_ebook: bool | None = Field(
+        False, description="Optimize the output PDF for ebook reading using Ghostscript"
+    )
+
+
+class CertType(StrEnum):
+    pem = "PEM"
+    pkcs12 = "PKCS12"
+    pfx = "PFX"
+    jks = "JKS"
+    server = "SERVER"
+
+
+class CertSignParams(ApiModel):
+    cert_type: CertType | None = Field(None, description="The type of the digital certificate")
+    location: str | None = Field("SPDF", description="The location where the PDF is signed")
+    name: str | None = Field("SPDF", description="The name of the signer")
+    page_number: int | None = Field(
+        1,
+        description="The page number where the signature should be visible. This is required if showSignature is set to true",
+    )
+    password: SecretStr | None = Field(None, description="The password for the keystore or the private key")
+    reason: str | None = Field("Signed by SPDF", description="The reason for signing the PDF")
+    show_logo: bool | None = Field(
+        True, description="Whether to visually show a signature logo along with the signature"
+    )
+    show_signature: bool | None = Field(False, description="Whether to visually show the signature in the PDF file")
+
+
+class LineArtEdgeLevel(IntEnum):
+    integer_1 = 1
+    integer_2 = 2
+    integer_3 = 3
+
+
+class OptimizeLevel(IntEnum):
+    integer_1 = 1
+    integer_2 = 2
+    integer_3 = 3
+    integer_4 = 4
+    integer_5 = 5
+    integer_6 = 6
+    integer_7 = 7
+    integer_8 = 8
+    integer_9 = 9
+
+
+class CompressPdfParams(ApiModel):
+    expected_output_size: str | None = Field("25KB", description="The expected output size, e.g. '100MB', '25KB', etc.")
+    grayscale: bool | None = Field(False, description="Whether to convert the PDF to grayscale. Default is false.")
+    line_art: bool | None = Field(
+        False, description="Whether to convert images to high-contrast line art using ImageMagick. Default is false."
+    )
+    line_art_edge_level: LineArtEdgeLevel | None = Field(
+        LineArtEdgeLevel.integer_1,
+        description="Edge detection strength to use for line art conversion (1-3). This maps to ImageMagick's -edge radius.",
+    )
+    line_art_threshold: float | None = Field(55, description="Threshold to use for line art conversion (0-100).")
+    linearize: bool | None = Field(
+        False, description="Whether to linearize the PDF for faster web viewing. Default is false."
+    )
+    normalize: bool | None = Field(
+        False, description="Whether to normalize the PDF content for better compatibility. Default is false."
+    )
+    optimize_level: OptimizeLevel | None = Field(
+        None,
+        description="The level of optimization to apply to the PDF file. Higher values indicate greater compression but may reduce quality.",
+    )
 
 
 class CropParams(ApiModel):
-    crop_area: dict[str, float] = {"x": 0, "y": 0, "width": 595, "height": 842}
+    auto_crop: bool | None = Field(None, description="Enable auto-crop to detect and remove white space")
+    height: float | None = Field(None, description="The height of the crop area")
+    remove_data_outside_crop: bool | None = Field(
+        None, description="Whether to remove text outside the crop area (keeps images)"
+    )
+    width: float | None = Field(None, description="The width of the crop area")
+    x: float | None = Field(None, description="The x-coordinate of the top-left corner of the crop area")
+    y: float | None = Field(None, description="The y-coordinate of the top-left corner of the crop area")
+
+
+class DeleteAttachmentParams(ApiModel):
+    attachment_name: str | None = Field(None, description="The name of the attachment to delete")
+
+
+class EmbedAllFonts(Enum):
+    boolean_true = True
+    boolean_false = False
+
+
+class IncludePageNumbers(Enum):
+    boolean_true = True
+    boolean_false = False
+
+
+class IncludeTableOfContents(Enum):
+    boolean_true = True
+    boolean_false = False
+
+
+class OptimizeForEbook(Enum):
+    boolean_true = True
+    boolean_false = False
+
+
+class EbookToPdfParams(ApiModel):
+    embed_all_fonts: EmbedAllFonts | None = Field(
+        EmbedAllFonts.boolean_false, description="Embed all fonts from the eBook into the generated PDF"
+    )
+    include_page_numbers: IncludePageNumbers | None = Field(
+        IncludePageNumbers.boolean_false, description="Add page numbers to the generated PDF"
+    )
+    include_table_of_contents: IncludeTableOfContents | None = Field(
+        IncludeTableOfContents.boolean_false, description="Add a generated table of contents to the resulting PDF"
+    )
+    optimize_for_ebook: OptimizeForEbook | None = Field(
+        OptimizeForEbook.boolean_false,
+        description="Optimize the PDF for eBook reading (smaller file size, better rendering on eInk devices)",
+    )
 
 
 class EditTableOfContentsParams(ApiModel):
-    bookmarks: list[dict[str, Any]] = []
-    replace_existing: bool = True
+    bookmark_data: str | None = Field(
+        None,
+        description="Bookmark structure in JSON format",
+        examples=[
+            '[{\\"title\\":\\"Chapter 1\\",\\"pageNumber\\":1,\\"children\\":[{\\"title\\":\\"Section 1.1\\",\\"pageNumber\\":2}]}]'
+        ],
+    )
+    replace_existing: bool | None = Field(
+        None, description="Whether to replace existing bookmarks or append to them", examples=[True]
+    )
+
+
+class EmlToPdfParams(ApiModel):
+    download_html: bool | None = Field(
+        None, description="Download HTML intermediate file instead of PDF", examples=[False]
+    )
+    include_all_recipients: bool | None = Field(
+        None, description="Include CC and BCC recipients in header (if available)", examples=[True]
+    )
+    include_attachments: bool | None = Field(
+        None, description="Include email attachments in the PDF output", examples=[False]
+    )
+    max_attachment_size_mb: int | None = Field(
+        None,
+        description="Maximum attachment size in MB to include (default 10MB, range: 1-100)",
+        examples=[10],
+        ge=1,
+        le=100,
+    )
+
+
+class ExtractImageScansParams(ApiModel):
+    angle_threshold: int | None = Field(5, description="The angle threshold for the image scan extraction")
+    border_size: int | None = Field(1, description="The border size for the image scan extraction")
+    min_area: int | None = Field(8000, description="The minimum area for the image scan extraction")
+    min_contour_area: int | None = Field(500, description="The minimum contour area for the image scan extraction")
+    tolerance: int | None = Field(20, description="The tolerance for the image scan extraction")
+
+
+class Format(StrEnum):
+    png = "png"
+    jpeg = "jpeg"
+    gif = "gif"
 
 
 class ExtractImagesParams(ApiModel):
-    allow_duplicates: bool = False
-    format: Literal["png", "jpg", "gif"] = "png"
-
-
-class ExtractPagesParams(ApiModel):
-    page_numbers: str = ""
+    format: Format | None = Field(Format.png, description="The output image format e.g., 'png', 'jpeg', or 'gif'")
 
 
 class FlattenParams(ApiModel):
-    flatten_only_forms: bool = False
+    flatten_only_forms: bool | None = Field(
+        False, description="True to flatten only the forms, false to flatten full PDF (Convert page to image)"
+    )
+    render_dpi: int | None = Field(
+        None, description="Optional DPI for page rendering when flattening the full document.", ge=72
+    )
 
 
-class MergeParams(ApiModel):
-    generate_table_of_contents: bool = False
-    remove_digital_signature: bool = False
+class HtmlToPdfParams(ApiModel):
+    zoom: float | None = Field(1, description="Zoom level for displaying the website. Default is '1'.")
 
 
-class OcrParams(ApiModel):
-    additional_options: list[str] = []
-    languages: list[str] = []
-    ocr_render_type: str = "hocr"
-    ocr_type: str = "skip-text"
+class ColorType(StrEnum):
+    color = "color"
+    greyscale = "greyscale"
+    blackwhite = "blackwhite"
+
+
+class FitOption(StrEnum):
+    fill_page = "fillPage"
+    fit_document_to_image = "fitDocumentToImage"
+    maintain_aspect_ratio = "maintainAspectRatio"
+
+
+class ImgToPdfParams(ApiModel):
+    auto_rotate: bool | None = Field(
+        False, description="Whether to automatically rotate the images to better fit the PDF page"
+    )
+    color_type: ColorType | None = Field(ColorType.color, description="The color type of the output image(s)")
+    fit_option: FitOption | None = Field(
+        FitOption.fill_page, description="Option to determine how the image will fit onto the page"
+    )
+
+
+class SortType(StrEnum):
+    order_provided = "orderProvided"
+    by_file_name = "byFileName"
+    by_date_modified = "byDateModified"
+    by_date_created = "byDateCreated"
+    by_pdf_title = "byPDFTitle"
+
+
+class MergePdfsParams(ApiModel):
+    client_file_ids: str | None = Field(
+        None, description="JSON array of client-provided IDs for each uploaded file (same order as fileInput)"
+    )
+    generate_toc: bool | None = Field(
+        False,
+        description="Flag indicating whether to generate a table of contents for the merged PDF. If true, a table of contents will be created using the input filenames as chapter names.",
+    )
+    remove_cert_sign: bool | None = Field(
+        True,
+        description="Flag indicating whether to remove certification signatures from the merged PDF. If true, all certification signatures will be removed from the final merged document.",
+    )
+    sort_type: SortType | None = Field(
+        SortType.order_provided, description="The type of sorting to be applied on the input files before merging."
+    )
+
+
+class Arrangement(StrEnum):
+    by_rows = "BY_ROWS"
+    by_columns = "BY_COLUMNS"
+
+
+class Mode(StrEnum):
+    default = "DEFAULT"
+    custom = "CUSTOM"
+
+
+class Orientation(StrEnum):
+    portrait = "PORTRAIT"
+    landscape = "LANDSCAPE"
+
+
+class PagesPerSheet1(IntEnum):
+    integer_2 = 2
+    integer_4 = 4
+    integer_9 = 9
+    integer_16 = 16
+
+
+class ReadingDirection(StrEnum):
+    ltr = "LTR"
+    rtl = "RTL"
+
+
+class MultiPageLayoutParams(ApiModel):
+    add_border: bool | None = Field(None, description="Boolean for if you wish to add border around the pages")
+    arrangement: Arrangement | None = Field(
+        Arrangement.by_rows,
+        description="The arrangement of pages on the sheet: BY_ROWS fills pages row by row, while BY_COLUMNS fills pages column by column.",
+    )
+    border_width: float | None = Field(
+        1, description="Border width (in points) to apply around each page when merging", examples=[2], ge=0.0
+    )
+    bottom_margin: float | None = Field(
+        0, description="Bottom margin (in points) to apply to the output pages when merging", examples=[200], ge=0.0
+    )
+    cols: float | None = Field(2, description="Number of columns", examples=[2], ge=1.0, le=300.0)
+    inner_margin: float | None = Field(
+        0, description="Inner margin (in points) to apply around each page when merging", examples=[200], ge=0.0
+    )
+    left_margin: float | None = Field(
+        0, description="Left margin (in points) to apply to the output pages when merging", examples=[200], ge=0.0
+    )
+    mode: Mode | None = Field(
+        Mode.default, description="Input mode: DEFAULT uses pagesPerSheet; CUSTOM uses explicit cols x rows."
+    )
+    orientation: Orientation | None = Field(Orientation.portrait, description="The orientation of the output PDF pages")
+    pages_per_sheet: PagesPerSheet1 | None = Field(
+        None, description="The number of pages to fit onto a single sheet in the output PDF."
+    )
+    reading_direction: ReadingDirection | None = Field(
+        ReadingDirection.ltr,
+        description="The direction in which pages are arranged on the sheet: LTR (left-to-right) or RTL (right-to-left).",
+    )
+    right_margin: float | None = Field(
+        0, description="Right margin (in points) to apply to the output pages when merging", examples=[200], ge=0.0
+    )
+    rows: float | None = Field(1, description="Number of rows", examples=[3], ge=1.0, le=300.0)
+    top_margin: float | None = Field(
+        0, description="Top margin (in points) to apply to the output pages when merging", examples=[200], ge=0.0
+    )
+
+
+class OcrRenderType(StrEnum):
+    hocr = "hocr"
+    sandwich = "sandwich"
+
+
+class OcrType(StrEnum):
+    skip_text = "skip-text"
+    force_ocr = "force-ocr"
+    normal = "Normal"
+
+
+class OcrPdfParams(ApiModel):
+    clean: bool | None = Field(None, description="Clean the input file if set to true")
+    clean_final: bool | None = Field(None, description="Clean the final output if set to true")
+    deskew: bool | None = Field(None, description="Deskew the input file if set to true")
+    languages: list[str] | None = Field(
+        ["eng"], description="List of languages to use in OCR processing, e.g., 'eng', 'deu'"
+    )
+    ocr_render_type: OcrRenderType | None = Field(
+        OcrRenderType.hocr, description="Specify the OCR render type, either 'hocr' or 'sandwich'"
+    )
+    ocr_type: OcrType | None = Field(
+        None, description="Specify the OCR type, e.g., 'skip-text', 'force-ocr', or 'Normal'"
+    )
+    remove_images_after: bool | None = Field(None, description="Remove images from the output PDF if set to true")
+    sidecar: bool | None = Field(None, description="Include OCR text in a sidecar text file if set to true")
+
+
+class OverlayMode(StrEnum):
+    sequential_overlay = "SequentialOverlay"
+    interleaved_overlay = "InterleavedOverlay"
+    fixed_repeat_overlay = "FixedRepeatOverlay"
+
+
+class OverlayPosition(Enum):
+    number_0 = 0
+    number_1 = 1
 
 
 class OverlayPdfsParams(ApiModel):
-    counts: list[float] = []
-    overlay_files: list[dict[str, Any]] = []
-    overlay_mode: Literal["SequentialOverlay", "InterleavedOverlay", "FixedRepeatOverlay"] = "SequentialOverlay"
-    overlay_position: Literal[0, 1] = 0
+    counts: list[int] | None = Field(
+        None,
+        description="An array of integers specifying the number of times each corresponding overlay file should be applied in the 'FixedRepeatOverlay' mode. This should match the length of the overlayFiles array.",
+    )
+    overlay_files: list[bytes] | None = Field(
+        None,
+        description="An array of PDF files to be used as overlays on the base PDF. The order in these files is applied based on the selected mode.",
+    )
+    overlay_mode: OverlayMode | None = Field(
+        None,
+        description="The mode of overlaying: 'SequentialOverlay' for sequential application, 'InterleavedOverlay' for round-robin application, 'FixedRepeatOverlay' for fixed repetition based on provided counts",
+    )
+    overlay_position: OverlayPosition | None = Field(
+        None, description="Overlay position 0 is Foregound, 1 is Background"
+    )
 
 
-class PageLayoutParams(ApiModel):
-    add_border: bool = False
-    pages_per_sheet: float = 4
+class PdfToCbrParams(ApiModel):
+    dpi: int | None = Field(
+        None, description="The DPI (Dots Per Inch) for rendering PDF pages as images", examples=[150]
+    )
 
 
-class PdfToSinglePageParams(ApiModel):
-    pass
+class PdfToCbzParams(ApiModel):
+    dpi: int | None = Field(
+        None, description="The DPI (Dots Per Inch) for rendering PDF pages as images", examples=[150]
+    )
 
 
-class RedactParams(ApiModel):
-    convert_pdfto_image: bool = True
-    custom_padding: float = 0.1
-    mode: Literal["automatic", "manual"] = "automatic"
-    redact_color: str = "#000000"
-    use_regex: bool = False
-    whole_word_search: bool = False
-    words_to_redact: list[str] = []
+class PdfToCsvParams(ApiModel):
+    page_numbers: str | None = Field(
+        "all",
+        description="The pages to select, Supports ranges (e.g., '1,3,5-9'), or 'all' or functions in the format 'an+b' where 'a' is the multiplier of the page number 'n', and 'b' is a constant (e.g., '2n+1', '3n', '6n-5')",
+    )
 
 
-class RemoveAnnotationsParams(ApiModel):
-    pass
+class DetectChapters(Enum):
+    boolean_true = True
+    boolean_false = False
+
+
+class OutputFormat(StrEnum):
+    epub = "EPUB"
+    azw3 = "AZW3"
+    epub_1 = "EPUB"
+    azw3_1 = "AZW3"
+
+
+class TargetDevice(StrEnum):
+    tablet_phone_images = "TABLET_PHONE_IMAGES"
+    kindle_eink_text = "KINDLE_EINK_TEXT"
+    tablet_phone_images_1 = "TABLET_PHONE_IMAGES"
+    kindle_eink_text_1 = "KINDLE_EINK_TEXT"
+
+
+class PdfToEpubParams(ApiModel):
+    detect_chapters: DetectChapters | None = Field(
+        DetectChapters.boolean_true, description="Detect headings that look like chapters and insert EPUB page breaks."
+    )
+    output_format: OutputFormat | None = Field(OutputFormat.epub, description="Choose the output format for the ebook.")
+    target_device: TargetDevice | None = Field(
+        TargetDevice.tablet_phone_images, description="Choose an output profile optimized for the reader device."
+    )
+
+
+class ImageFormat(StrEnum):
+    png = "png"
+    jpeg = "jpeg"
+    jpg = "jpg"
+    gif = "gif"
+    webp = "webp"
+
+
+class SingleOrMultiple(StrEnum):
+    single = "single"
+    multiple = "multiple"
+
+
+class PdfToImgParams(ApiModel):
+    color_type: ColorType | None = Field(ColorType.color, description="The color type of the output image(s)")
+    dpi: int | None = Field(300, description="The DPI (dots per inch) for the output image(s)")
+    image_format: ImageFormat | None = Field(ImageFormat.png, description="The output image format")
+    include_annotations: bool | None = Field(
+        False, description="Include annotations such as comments in the output image(s)"
+    )
+    page_numbers: str | None = Field(
+        "all",
+        description="The pages to select, Supports ranges (e.g., '1,3,5-9'), or 'all' or functions in the format 'an+b' where 'a' is the multiplier of the page number 'n', and 'b' is a constant (e.g., '2n+1', '3n', '6n-5')",
+    )
+    single_or_multiple: SingleOrMultiple | None = Field(
+        SingleOrMultiple.multiple,
+        description="Choose between a single image containing all pages or separate images for each page",
+    )
+
+
+class OutputFormat1(StrEnum):
+    pdfa = "pdfa"
+    pdfa_1 = "pdfa-1"
+    pdfa_2 = "pdfa-2"
+    pdfa_2b = "pdfa-2b"
+    pdfa_3 = "pdfa-3"
+    pdfa_3b = "pdfa-3b"
+    pdfx = "pdfx"
+
+
+class PdfToPdfaParams(ApiModel):
+    output_format: OutputFormat1 | None = Field(None, description="The output format type (PDF/A or PDF/X)")
+    strict: bool | None = Field(
+        None, description="If true, the conversion will fail if the output is not perfectly compliant"
+    )
+
+
+class OutputFormat2(StrEnum):
+    ppt = "ppt"
+    pptx = "pptx"
+    odp = "odp"
+
+
+class PdfToPresentationParams(ApiModel):
+    output_format: OutputFormat2 | None = Field(None, description="The output Presentation format")
+
+
+class OutputFormat3(StrEnum):
+    rtf = "rtf"
+    txt = "txt"
+
+
+class PdfToTextParams(ApiModel):
+    output_format: OutputFormat3 | None = Field(None, description="The output Text or RTF format")
+
+
+class OutputFormat4(StrEnum):
+    eps = "eps"
+    ps = "ps"
+    pcl = "pcl"
+    xps = "xps"
+
+
+class Prepress(Enum):
+    boolean_true = True
+    boolean_false = False
+
+
+class PdfToVectorParams(ApiModel):
+    output_format: OutputFormat4 | None = Field(OutputFormat4.eps, description="Target vector format extension")
+    prepress: Prepress | None = Field(Prepress.boolean_false, description="Apply Ghostscript prepress settings")
+
+
+class OutputFormat5(StrEnum):
+    doc = "doc"
+    docx = "docx"
+    odt = "odt"
+
+
+class PdfToWordParams(ApiModel):
+    output_format: OutputFormat5 | None = Field(None, description="The output Word document format")
+
+
+class PdfToXlsxParams(ApiModel):
+    page_numbers: str | None = Field(
+        "all",
+        description="The pages to select, Supports ranges (e.g., '1,3,5-9'), or 'all' or functions in the format 'an+b' where 'a' is the multiplier of the page number 'n', and 'b' is a constant (e.g., '2n+1', '3n', '6n-5')",
+    )
+
+
+class CustomMode(StrEnum):
+    custom = "CUSTOM"
+    reverse_order = "REVERSE_ORDER"
+    duplex_sort = "DUPLEX_SORT"
+    booklet_sort = "BOOKLET_SORT"
+    side_stitch_booklet_sort = "SIDE_STITCH_BOOKLET_SORT"
+    odd_even_split = "ODD_EVEN_SPLIT"
+    remove_first = "REMOVE_FIRST"
+    remove_last = "REMOVE_LAST"
+    remove_first_and_last = "REMOVE_FIRST_AND_LAST"
+    duplicate = "DUPLICATE"
+
+
+class RearrangePagesParams(ApiModel):
+    custom_mode: CustomMode | None = Field(
+        None,
+        description="The custom mode for page rearrangement. Valid values are:\nCUSTOM: Uses order defined in PageNums DUPLICATE: Duplicate pages n times (if Page order defined as 4, then duplicates each page 4 times)REVERSE_ORDER: Reverses the order of all pages.\nDUPLEX_SORT: Sorts pages as if all fronts were scanned then all backs in reverse (1, n, 2, n-1, ...). BOOKLET_SORT: Arranges pages for booklet printing (last, first, second, second last, ...).\nODD_EVEN_SPLIT: Splits and arranges pages into odd and even numbered pages.\nREMOVE_FIRST: Removes the first page.\nREMOVE_LAST: Removes the last page.\nREMOVE_FIRST_AND_LAST: Removes both the first and the last pages.\n",
+    )
+    page_numbers: str | None = Field(
+        "all",
+        description="The pages to select, Supports ranges (e.g., '1,3,5-9'), or 'all' or functions in the format 'an+b' where 'a' is the multiplier of the page number 'n', and 'b' is a constant (e.g., '2n+1', '3n', '6n-5')",
+    )
 
 
 class RemoveBlanksParams(ApiModel):
-    include_blank_pages: bool = False
-    threshold: float = 10
-    white_percent: float = 99.9
-
-
-class RemoveCertSignParams(ApiModel):
-    pass
-
-
-class RemoveImageParams(ApiModel):
-    pass
+    threshold: int | None = Field(10, description="The threshold value to determine blank pages", ge=0, le=255)
+    white_percent: float | None = Field(
+        99.9, description="The percentage of white color on a page to consider it as blank", ge=0.1, le=100.0
+    )
 
 
 class RemovePagesParams(ApiModel):
-    page_numbers: str = ""
+    page_numbers: str | None = Field(
+        "all",
+        description="The pages to select, Supports ranges (e.g., '1,3,5-9'), or 'all' or functions in the format 'an+b' where 'a' is the multiplier of the page number 'n', and 'b' is a constant (e.g., '2n+1', '3n', '6n-5')",
+    )
 
 
 class RemovePasswordParams(ApiModel):
-    password: str = ""
+    password: SecretStr | None = Field(None, description="The password of the PDF file")
 
 
-class ReorganizePagesParams(ApiModel):
-    custom_mode: str | None = None
-    page_numbers: str | None = None
+class RenameAttachmentParams(ApiModel):
+    attachment_name: str | None = Field(None, description="The current name of the attachment to rename")
+    new_name: str | None = Field(None, description="The new name for the attachment")
 
 
-class RepairParams(ApiModel):
-    pass
+class HighContrastColorCombination(StrEnum):
+    white_text_on_black = "WHITE_TEXT_ON_BLACK"
+    black_text_on_white = "BLACK_TEXT_ON_WHITE"
+    yellow_text_on_black = "YELLOW_TEXT_ON_BLACK"
+    green_text_on_black = "GREEN_TEXT_ON_BLACK"
+    white_text_on_black_1 = "WHITE_TEXT_ON_BLACK"
+    black_text_on_white_1 = "BLACK_TEXT_ON_WHITE"
+    yellow_text_on_black_1 = "YELLOW_TEXT_ON_BLACK"
+    green_text_on_black_1 = "GREEN_TEXT_ON_BLACK"
 
 
-class ReplaceColorParams(ApiModel):
-    back_ground_color: str = "#ffffff"
-    high_contrast_color_combination: Literal[
-        "WHITE_TEXT_ON_BLACK", "BLACK_TEXT_ON_WHITE", "YELLOW_TEXT_ON_BLACK", "GREEN_TEXT_ON_BLACK"
-    ] = "WHITE_TEXT_ON_BLACK"
-    replace_and_invert_option: Literal[
-        "HIGH_CONTRAST_COLOR", "CUSTOM_COLOR", "FULL_INVERSION", "COLOR_SPACE_CONVERSION"
-    ] = "HIGH_CONTRAST_COLOR"
-    text_color: str = "#000000"
+class ReplaceAndInvertOption(StrEnum):
+    high_contrast_color = "HIGH_CONTRAST_COLOR"
+    custom_color = "CUSTOM_COLOR"
+    full_inversion = "FULL_INVERSION"
+    color_space_conversion = "COLOR_SPACE_CONVERSION"
+    high_contrast_color_1 = "HIGH_CONTRAST_COLOR"
+    custom_color_1 = "CUSTOM_COLOR"
+    full_inversion_1 = "FULL_INVERSION"
+    color_space_conversion_1 = "COLOR_SPACE_CONVERSION"
 
 
-class RotateParams(ApiModel):
-    angle: float = 0
+class ReplaceInvertPdfParams(ApiModel):
+    back_ground_color: str | None = Field(
+        None,
+        description="If CUSTOM_COLOR option selected, then pick the custom color for background. Expected color value should be 24bit decimal value of a color",
+    )
+    high_contrast_color_combination: HighContrastColorCombination | None = Field(
+        HighContrastColorCombination.white_text_on_black,
+        description="If HIGH_CONTRAST_COLOR option selected, then pick the default color option for text and background.",
+    )
+    replace_and_invert_option: ReplaceAndInvertOption | None = Field(
+        ReplaceAndInvertOption.high_contrast_color, description="Replace and Invert color options of a pdf."
+    )
+    text_color: str | None = Field(
+        None,
+        description="If CUSTOM_COLOR option selected, then pick the custom color for text. Expected color value should be 24bit decimal value of a color",
+    )
 
 
-class SanitizeParams(ApiModel):
-    remove_embedded_files: bool = True
-    remove_fonts: bool = False
-    remove_java_script: bool = True
-    remove_links: bool = False
-    remove_metadata: bool = False
-    remove_xmpmetadata: bool = False
+class Angle(IntEnum):
+    integer_0 = 0
+    integer_90 = 90
+    integer_180 = 180
+    integer_270 = 270
+
+
+class RotatePdfParams(ApiModel):
+    angle: Angle | None = Field(
+        None, description="The clockwise angle by which to rotate the PDF file. Must be a multiple of 90."
+    )
+
+
+class SanitizePdfParams(ApiModel):
+    remove_embedded_files: bool | None = Field(True, description="Remove embedded files from the PDF")
+    remove_fonts: bool | None = Field(False, description="Remove fonts from the PDF")
+    remove_java_script: bool | None = Field(True, description="Remove JavaScript actions from the PDF")
+    remove_links: bool | None = Field(False, description="Remove links from the PDF")
+    remove_metadata: bool | None = Field(False, description="Remove document info metadata from the PDF")
+    remove_xmp_metadata: bool | None = Field(False, description="Remove XMP metadata from the PDF")
+
+
+class PageSize(StrEnum):
+    a0 = "A0"
+    a1 = "A1"
+    a2 = "A2"
+    a3 = "A3"
+    a4 = "A4"
+    a5 = "A5"
+    a6 = "A6"
+    letter = "LETTER"
+    legal = "LEGAL"
+    keep = "KEEP"
 
 
 class ScalePagesParams(ApiModel):
-    page_size: Literal["KEEP", "A0", "A1", "A2", "A3", "A4", "A5", "A6", "LETTER", "LEGAL"] | None = None
-    scale_factor: float = 1
+    page_size: PageSize | None = Field(
+        None, description="The scale of pages in the output PDF. Acceptable values are A0-A6, LETTER, LEGAL, KEEP."
+    )
+    scale_factor: float | None = Field(
+        1, description="The scale of the content on the pages of the output PDF. Acceptable values are floats.", ge=0.0
+    )
 
 
-class ScannerImageSplitParams(ApiModel):
-    angle_threshold: float = 10
-    border_size: float = 1
-    min_area: float = 10000
-    min_contour_area: float = 500
-    tolerance: float = 30
+class Colorspace(StrEnum):
+    grayscale = "grayscale"
+    color = "color"
 
 
-class SignParams(ApiModel):
-    font_family: str = "Helvetica"
-    font_size: float = 16
-    location: str = "Digital"
-    reason: str = "Document signing"
-    signature_data: str | None = None
-    signature_position: dict[str, float] | None = None
-    signature_type: Literal["text", "image", "canvas"] = "canvas"
-    signer_name: str = ""
-    text_color: str = "#000000"
+class Quality(StrEnum):
+    low = "low"
+    medium = "medium"
+    high = "high"
 
 
-class SplitParams(ApiModel):
-    allow_duplicates: bool = False
-    bookmark_level: str = "1"
-    duplex_mode: bool = False
-    h_div: str = "2"
-    include_metadata: bool = False
-    merge: bool = False
-    method: Literal[
-        "", "byPages", "bySections", "bySize", "byPageCount", "byDocCount", "byChapters", "byPageDivider"
-    ] = ""
-    pages: str = ""
-    split_value: str = ""
-    v_div: str = "2"
+class Rotation(StrEnum):
+    none = "none"
+    slight = "slight"
+    moderate = "moderate"
+    severe = "severe"
 
 
-class UnlockPdfformsParams(ApiModel):
-    pass
+class ScannerEffectParams(ApiModel):
+    advanced_enabled: bool | None = Field(None, description="Whether advanced settings are enabled", examples=[False])
+    blur: float | None = Field(None, description="Blur amount (0 = none, higher = more blur)", examples=[1.0])
+    border: int | None = Field(None, description="Border thickness in pixels", examples=[20])
+    brightness: float | None = Field(None, description="Brightness multiplier (1.0 = no change)", examples=[1.0])
+    colorspace: Colorspace | None = Field(None, description="Colorspace for output image", examples=["grayscale"])
+    contrast: float | None = Field(None, description="Contrast multiplier (1.0 = no change)", examples=[1.0])
+    noise: float | None = Field(None, description="Noise amount (0 = none, higher = more noise)", examples=[8.0])
+    quality: Quality | None = Field(None, description="Scan quality preset", examples=["high"])
+    resolution: int | None = Field(None, description="Rendering resolution in DPI", examples=[300])
+    rotate: int | None = Field(None, description="Base rotation in degrees", examples=[0])
+    rotate_variance: int | None = Field(None, description="Random rotation variance in degrees", examples=[2])
+    rotation: Rotation | None = Field(None, description="Rotation preset", examples=["none"])
+    rotation_value: int | None = None
+    yellowish: bool | None = Field(None, description="Simulate yellowed paper", examples=[False])
 
 
-class WatermarkParams(ApiModel):
-    alphabet: str = "roman"
-    convert_pdfto_image: bool = False
-    custom_color: str = "#d3d3d3"
-    font_size: float = 12
-    height_spacer: float = 50
-    opacity: float = 50
-    rotation: float = 0
-    watermark_image: dict[str, Any] | None = None
-    watermark_text: str = ""
-    watermark_type: Literal["text", "image"] | None = None
-    width_spacer: float = 50
+class WorkflowType(StrEnum):
+    signing = "SIGNING"
+    review = "REVIEW"
+    approval = "APPROVAL"
+
+
+class Request(ApiModel):
+    document_name: str | None = None
+    due_date: str | None = None
+    message: str | None = None
+    owner_email: str | None = None
+    participant_emails: list[str] | None = None
+    participant_user_ids: list[int] | None = None
+    workflow_metadata: str | None = None
+    workflow_type: WorkflowType | None = None
+
+
+class SessionsParams(ApiModel):
+    request: Request | None = None
+
+
+class SplitBySizeOrCountParams(ApiModel):
+    split_type: int | None = Field(
+        0, description="Determines the type of split: 0 for size, 1 for page count, 2 for document count"
+    )
+    split_value: str | None = Field(
+        "10MB", description="Value for split: size in MB (e.g., '10MB') or number of pages (e.g., '5')"
+    )
+
+
+class PageSize1(StrEnum):
+    a4 = "A4"
+    letter = "Letter"
+    a3 = "A3"
+    a5 = "A5"
+    legal = "Legal"
+    tabloid = "Tabloid"
+
+
+class SplitForPosterPrintParams(ApiModel):
+    page_size: PageSize1 | None = Field(
+        None, description="Target page size for output chunks (e.g., 'A4', 'Letter', 'A3')"
+    )
+    right_to_left: bool | None = Field(False, description="Split right-to-left instead of left-to-right")
+    xfactor: int | None = None
+    yfactor: int | None = None
+
+
+class SplitPagesParams(ApiModel):
+    page_numbers: str | None = Field(
+        "all",
+        description="The pages to select, Supports ranges (e.g., '1,3,5-9'), or 'all' or functions in the format 'an+b' where 'a' is the multiplier of the page number 'n', and 'b' is a constant (e.g., '2n+1', '3n', '6n-5')",
+    )
+
+
+class SplitPdfByChaptersParams(ApiModel):
+    allow_duplicates: bool | None = Field(False, description="Whether to allow duplicates or not")
+    bookmark_level: int | None = Field(0, description="Maximum bookmark level required", ge=0)
+    include_metadata: bool | None = Field(False, description="Whether to include Metadata or not")
+
+
+class SplitMode(StrEnum):
+    custom = "CUSTOM"
+    split_all_except_first_and_last = "SPLIT_ALL_EXCEPT_FIRST_AND_LAST"
+    split_all_except_first = "SPLIT_ALL_EXCEPT_FIRST"
+    split_all_except_last = "SPLIT_ALL_EXCEPT_LAST"
+    split_all = "SPLIT_ALL"
+
+
+class SplitPdfBySectionsParams(ApiModel):
+    horizontal_divisions: int | None = Field(
+        0, description="Number of horizontal divisions for each PDF page", ge=0, le=50
+    )
+    merge: bool | None = Field(False, description="Merge the split documents into a single PDF")
+    page_numbers: str | None = Field("SPLIT_ALL", description="Pages to be split by section")
+    split_mode: SplitMode | None = Field(
+        None,
+        description="Modes for page split. Valid values are:\nSPLIT_ALL_EXCEPT_FIRST_AND_LAST: Splits all except the first and the last pages.\nSPLIT_ALL_EXCEPT_FIRST: Splits all except the first page.\nSPLIT_ALL_EXCEPT_LAST: Splits all except the last page.\nSPLIT_ALL: Splits all pages.\nCUSTOM: Custom split.\n",
+    )
+    vertical_divisions: int | None = Field(1, description="Number of vertical divisions for each PDF page", ge=0, le=50)
+
+
+class SvgToPdfParams(ApiModel):
+    combine_into_single_pdf: bool | None = Field(
+        False,
+        description="Whether to combine all SVG files into a single PDF (each SVG as a separate page) or create separate PDF files for each SVG.",
+    )
+
+
+class TimestampPdfParams(ApiModel):
+    tsa_url: str | None = Field(
+        "http://timestamp.digicert.com",
+        description="URL of the RFC 3161 Time Stamp Authority (TSA) server. Must be one of the built-in presets (DigiCert, Sectigo, SSL.com, FreeTSA, MeSign) or an admin-configured URL in settings.yml (security.timestamp.customTsaUrls). If omitted, the server default is used.",
+    )
+
+
+class Trapped(StrEnum):
+    true = "True"
+    false = "False"
+    unknown = "Unknown"
+
+
+class UpdateMetadataParams(ApiModel):
+    all_request_params: dict[str, str] | None = Field(
+        None,
+        description="Map list of key and value of custom parameters. Note these must start with customKey and customValue if they are non-standard",
+    )
+    author: str | None = Field("author", description="The author of the document")
+    creation_date: str | None = Field(
+        "2023/10/01 12:00:00",
+        description="The creation date of the document (format: yyyy/MM/dd HH:mm:ss)",
+        pattern="yyyy/MM/dd HH:mm:ss",
+    )
+    creator: str | None = Field("creator", description="The creator of the document")
+    delete_all: bool | None = Field(False, description="Delete all metadata if set to true")
+    keywords: str | None = Field("keywords", description="The keywords for the document")
+    modification_date: str | None = Field(
+        "2023/10/01 12:00:00",
+        description="The modification date of the document (format: yyyy/MM/dd HH:mm:ss)",
+        pattern="yyyy/MM/dd HH:mm:ss",
+    )
+    producer: str | None = Field("producer", description="The producer of the document")
+    subject: str | None = Field("subject", description="The subject of the document")
+    title: str | None = Field("title", description="The title of the document")
+    trapped: Trapped | None = Field(Trapped.false, description="The trapped status of the document")
+
+
+class UrlToPdfParams(ApiModel):
+    url_input: str | None = Field(None, description="The input URL to be converted to a PDF file")
+
+
+class OutputFormat6(StrEnum):
+    eps = "eps"
+    ps = "ps"
+    pcl = "pcl"
+    xps = "xps"
+
+
+class VectorToPdfParams(ApiModel):
+    output_format: OutputFormat6 | None = Field(OutputFormat6.eps, description="Target vector format extension")
+    prepress: Prepress | None = Field(Prepress.boolean_false, description="Apply Ghostscript prepress settings")
+
+
+class RedactionArea(RootModel[Any]):
+    root: Any
+
+
+class RedactParams(ApiModel):
+    convert_pdf_to_image: bool | None = Field(False, description="Convert the redacted PDF to an image")
+    page_numbers: str | None = Field(
+        "all",
+        description="The pages to select, Supports ranges (e.g., '1,3,5-9'), or 'all' or functions in the format 'an+b' where 'a' is the multiplier of the page number 'n', and 'b' is a constant (e.g., '2n+1', '3n', '6n-5')",
+    )
+    page_redaction_color: str | None = Field("#000000", description="The color used to fully redact certain pages")
+    redactions: list[RedactionArea] | None = Field(None, description="A list of areas that should be redacted")
+
+
+class Model(
+    RootModel[
+        CbrToPdfParams
+        | CbzToPdfParams
+        | EbookToPdfParams
+        | EmlToPdfParams
+        | HtmlToPdfParams
+        | ImgToPdfParams
+        | PdfToCbrParams
+        | PdfToCbzParams
+        | PdfToCsvParams
+        | PdfToEpubParams
+        | PdfToImgParams
+        | PdfToPdfaParams
+        | PdfToPresentationParams
+        | PdfToTextParams
+        | PdfToVectorParams
+        | PdfToWordParams
+        | PdfToXlsxParams
+        | SvgToPdfParams
+        | UrlToPdfParams
+        | VectorToPdfParams
+        | BookletImpositionParams
+        | CropParams
+        | EditTableOfContentsParams
+        | MergePdfsParams
+        | MultiPageLayoutParams
+        | OverlayPdfsParams
+        | RearrangePagesParams
+        | RemovePagesParams
+        | RotatePdfParams
+        | ScalePagesParams
+        | SplitBySizeOrCountParams
+        | SplitForPosterPrintParams
+        | SplitPagesParams
+        | SplitPdfByChaptersParams
+        | SplitPdfBySectionsParams
+        | AddAttachmentsParams
+        | AddImageParams
+        | AddPageNumbersParams
+        | AddStampParams
+        | AutoRenameParams
+        | AutoSplitPdfParams
+        | CompressPdfParams
+        | DeleteAttachmentParams
+        | ExtractImageScansParams
+        | ExtractImagesParams
+        | FlattenParams
+        | OcrPdfParams
+        | RemoveBlanksParams
+        | RenameAttachmentParams
+        | ReplaceInvertPdfParams
+        | ScannerEffectParams
+        | UpdateMetadataParams
+        | AddPasswordParams
+        | AddWatermarkParams
+        | AutoRedactParams
+        | CertSignParams
+        | SessionsParams
+        | RedactParams
+        | RemovePasswordParams
+        | SanitizePdfParams
+        | TimestampPdfParams
+    ]
+):
+    root: (
+        CbrToPdfParams
+        | CbzToPdfParams
+        | EbookToPdfParams
+        | EmlToPdfParams
+        | HtmlToPdfParams
+        | ImgToPdfParams
+        | PdfToCbrParams
+        | PdfToCbzParams
+        | PdfToCsvParams
+        | PdfToEpubParams
+        | PdfToImgParams
+        | PdfToPdfaParams
+        | PdfToPresentationParams
+        | PdfToTextParams
+        | PdfToVectorParams
+        | PdfToWordParams
+        | PdfToXlsxParams
+        | SvgToPdfParams
+        | UrlToPdfParams
+        | VectorToPdfParams
+        | BookletImpositionParams
+        | CropParams
+        | EditTableOfContentsParams
+        | MergePdfsParams
+        | MultiPageLayoutParams
+        | OverlayPdfsParams
+        | RearrangePagesParams
+        | RemovePagesParams
+        | RotatePdfParams
+        | ScalePagesParams
+        | SplitBySizeOrCountParams
+        | SplitForPosterPrintParams
+        | SplitPagesParams
+        | SplitPdfByChaptersParams
+        | SplitPdfBySectionsParams
+        | AddAttachmentsParams
+        | AddImageParams
+        | AddPageNumbersParams
+        | AddStampParams
+        | AutoRenameParams
+        | AutoSplitPdfParams
+        | CompressPdfParams
+        | DeleteAttachmentParams
+        | ExtractImageScansParams
+        | ExtractImagesParams
+        | FlattenParams
+        | OcrPdfParams
+        | RemoveBlanksParams
+        | RenameAttachmentParams
+        | ReplaceInvertPdfParams
+        | ScannerEffectParams
+        | UpdateMetadataParams
+        | AddPasswordParams
+        | AddWatermarkParams
+        | AutoRedactParams
+        | CertSignParams
+        | SessionsParams
+        | RedactParams
+        | RemovePasswordParams
+        | SanitizePdfParams
+        | TimestampPdfParams
+    )
 
 
 type ParamToolModel = (
-    AddAttachmentsParams
-    | AddPasswordParams
-    | AdjustContrastParams
-    | AutoRenameParams
-    | AutomateParams
+    CbrToPdfParams
+    | CbzToPdfParams
+    | EbookToPdfParams
+    | EmlToPdfParams
+    | HtmlToPdfParams
+    | ImgToPdfParams
+    | PdfToCbrParams
+    | PdfToCbzParams
+    | PdfToCsvParams
+    | PdfToEpubParams
+    | PdfToImgParams
+    | PdfToPdfaParams
+    | PdfToPresentationParams
+    | PdfToTextParams
+    | PdfToVectorParams
+    | PdfToWordParams
+    | PdfToXlsxParams
+    | SvgToPdfParams
+    | UrlToPdfParams
+    | VectorToPdfParams
     | BookletImpositionParams
-    | CertSignParams
-    | ChangeMetadataParams
-    | ChangePermissionsParams
-    | CompressParams
-    | ConvertParams
     | CropParams
     | EditTableOfContentsParams
-    | ExtractImagesParams
-    | ExtractPagesParams
-    | FlattenParams
-    | MergeParams
-    | OcrParams
+    | MergePdfsParams
+    | MultiPageLayoutParams
     | OverlayPdfsParams
-    | PageLayoutParams
-    | PdfToSinglePageParams
-    | RedactParams
-    | RemoveAnnotationsParams
-    | RemoveBlanksParams
-    | RemoveCertSignParams
-    | RemoveImageParams
+    | RearrangePagesParams
     | RemovePagesParams
-    | RemovePasswordParams
-    | ReorganizePagesParams
-    | RepairParams
-    | ReplaceColorParams
-    | RotateParams
-    | SanitizeParams
+    | RotatePdfParams
     | ScalePagesParams
-    | ScannerImageSplitParams
-    | SignParams
-    | SplitParams
-    | UnlockPdfformsParams
-    | WatermarkParams
+    | SplitBySizeOrCountParams
+    | SplitForPosterPrintParams
+    | SplitPagesParams
+    | SplitPdfByChaptersParams
+    | SplitPdfBySectionsParams
+    | AddAttachmentsParams
+    | AddImageParams
+    | AddPageNumbersParams
+    | AddStampParams
+    | AutoRenameParams
+    | AutoSplitPdfParams
+    | CompressPdfParams
+    | DeleteAttachmentParams
+    | ExtractImageScansParams
+    | ExtractImagesParams
+    | FlattenParams
+    | OcrPdfParams
+    | RemoveBlanksParams
+    | RenameAttachmentParams
+    | ReplaceInvertPdfParams
+    | ScannerEffectParams
+    | UpdateMetadataParams
+    | AddPasswordParams
+    | AddWatermarkParams
+    | AutoRedactParams
+    | CertSignParams
+    | SessionsParams
+    | RedactParams
+    | RemovePasswordParams
+    | SanitizePdfParams
+    | TimestampPdfParams
 )
 type ParamToolModelType = type[ParamToolModel]
 
 
-class OperationId(StrEnum):
-    ADD_ATTACHMENTS = "addAttachments"
-    ADD_PASSWORD = "addPassword"
-    ADJUST_CONTRAST = "adjustContrast"
-    AUTO_RENAME = "autoRename"
-    AUTOMATE = "automate"
-    BOOKLET_IMPOSITION = "bookletImposition"
-    CERT_SIGN = "certSign"
-    CHANGE_METADATA = "changeMetadata"
-    CHANGE_PERMISSIONS = "changePermissions"
-    COMPRESS = "compress"
-    CONVERT = "convert"
-    CROP = "crop"
-    EDIT_TABLE_OF_CONTENTS = "editTableOfContents"
-    EXTRACT_IMAGES = "extractImages"
-    EXTRACT_PAGES = "extractPages"
-    FLATTEN = "flatten"
-    MERGE = "merge"
-    OCR = "ocr"
-    OVERLAY_PDFS = "overlayPdfs"
-    PAGE_LAYOUT = "pageLayout"
-    PDF_TO_SINGLE_PAGE = "pdfToSinglePage"
-    REDACT = "redact"
-    REMOVE_ANNOTATIONS = "removeAnnotations"
-    REMOVE_BLANKS = "removeBlanks"
-    REMOVE_CERT_SIGN = "removeCertSign"
-    REMOVE_IMAGE = "removeImage"
-    REMOVE_PAGES = "removePages"
-    REMOVE_PASSWORD = "removePassword"
-    REORGANIZE_PAGES = "reorganizePages"
-    REPAIR = "repair"
-    REPLACE_COLOR = "replaceColor"
-    ROTATE = "rotate"
-    SANITIZE = "sanitize"
-    SCALE_PAGES = "scalePages"
-    SCANNER_IMAGE_SPLIT = "scannerImageSplit"
-    SIGN = "sign"
-    SPLIT = "split"
-    UNLOCK_PDFFORMS = "unlockPDFForms"
-    WATERMARK = "watermark"
+class ToolEndpoint(StrEnum):
+    CBR_TO_PDF = "/api/v1/convert/cbr/pdf"
+    CBZ_TO_PDF = "/api/v1/convert/cbz/pdf"
+    EBOOK_TO_PDF = "/api/v1/convert/ebook/pdf"
+    EML_TO_PDF = "/api/v1/convert/eml/pdf"
+    HTML_TO_PDF = "/api/v1/convert/html/pdf"
+    IMG_TO_PDF = "/api/v1/convert/img/pdf"
+    PDF_TO_CBR = "/api/v1/convert/pdf/cbr"
+    PDF_TO_CBZ = "/api/v1/convert/pdf/cbz"
+    PDF_TO_CSV = "/api/v1/convert/pdf/csv"
+    PDF_TO_EPUB = "/api/v1/convert/pdf/epub"
+    PDF_TO_IMG = "/api/v1/convert/pdf/img"
+    PDF_TO_PDFA = "/api/v1/convert/pdf/pdfa"
+    PDF_TO_PRESENTATION = "/api/v1/convert/pdf/presentation"
+    PDF_TO_TEXT = "/api/v1/convert/pdf/text"
+    PDF_TO_VECTOR = "/api/v1/convert/pdf/vector"
+    PDF_TO_WORD = "/api/v1/convert/pdf/word"
+    PDF_TO_XLSX = "/api/v1/convert/pdf/xlsx"
+    SVG_TO_PDF = "/api/v1/convert/svg/pdf"
+    URL_TO_PDF = "/api/v1/convert/url/pdf"
+    VECTOR_TO_PDF = "/api/v1/convert/vector/pdf"
+    BOOKLET_IMPOSITION = "/api/v1/general/booklet-imposition"
+    CROP = "/api/v1/general/crop"
+    EDIT_TABLE_OF_CONTENTS = "/api/v1/general/edit-table-of-contents"
+    MERGE_PDFS = "/api/v1/general/merge-pdfs"
+    MULTI_PAGE_LAYOUT = "/api/v1/general/multi-page-layout"
+    OVERLAY_PDFS = "/api/v1/general/overlay-pdfs"
+    REARRANGE_PAGES = "/api/v1/general/rearrange-pages"
+    REMOVE_PAGES = "/api/v1/general/remove-pages"
+    ROTATE_PDF = "/api/v1/general/rotate-pdf"
+    SCALE_PAGES = "/api/v1/general/scale-pages"
+    SPLIT_BY_SIZE_OR_COUNT = "/api/v1/general/split-by-size-or-count"
+    SPLIT_FOR_POSTER_PRINT = "/api/v1/general/split-for-poster-print"
+    SPLIT_PAGES = "/api/v1/general/split-pages"
+    SPLIT_PDF_BY_CHAPTERS = "/api/v1/general/split-pdf-by-chapters"
+    SPLIT_PDF_BY_SECTIONS = "/api/v1/general/split-pdf-by-sections"
+    ADD_ATTACHMENTS = "/api/v1/misc/add-attachments"
+    ADD_IMAGE = "/api/v1/misc/add-image"
+    ADD_PAGE_NUMBERS = "/api/v1/misc/add-page-numbers"
+    ADD_STAMP = "/api/v1/misc/add-stamp"
+    AUTO_RENAME = "/api/v1/misc/auto-rename"
+    AUTO_SPLIT_PDF = "/api/v1/misc/auto-split-pdf"
+    COMPRESS_PDF = "/api/v1/misc/compress-pdf"
+    DELETE_ATTACHMENT = "/api/v1/misc/delete-attachment"
+    EXTRACT_IMAGE_SCANS = "/api/v1/misc/extract-image-scans"
+    EXTRACT_IMAGES = "/api/v1/misc/extract-images"
+    FLATTEN = "/api/v1/misc/flatten"
+    OCR_PDF = "/api/v1/misc/ocr-pdf"
+    REMOVE_BLANKS = "/api/v1/misc/remove-blanks"
+    RENAME_ATTACHMENT = "/api/v1/misc/rename-attachment"
+    REPLACE_INVERT_PDF = "/api/v1/misc/replace-invert-pdf"
+    SCANNER_EFFECT = "/api/v1/misc/scanner-effect"
+    UPDATE_METADATA = "/api/v1/misc/update-metadata"
+    ADD_PASSWORD = "/api/v1/security/add-password"
+    ADD_WATERMARK = "/api/v1/security/add-watermark"
+    AUTO_REDACT = "/api/v1/security/auto-redact"
+    CERT_SIGN = "/api/v1/security/cert-sign"
+    SESSIONS = "/api/v1/security/cert-sign/sessions"
+    REDACT = "/api/v1/security/redact"
+    REMOVE_PASSWORD = "/api/v1/security/remove-password"
+    SANITIZE_PDF = "/api/v1/security/sanitize-pdf"
+    TIMESTAMP_PDF = "/api/v1/security/timestamp-pdf"
 
 
-OPERATIONS: dict[OperationId, ParamToolModelType] = {
-    OperationId.ADD_ATTACHMENTS: AddAttachmentsParams,
-    OperationId.ADD_PASSWORD: AddPasswordParams,
-    OperationId.ADJUST_CONTRAST: AdjustContrastParams,
-    OperationId.AUTO_RENAME: AutoRenameParams,
-    OperationId.AUTOMATE: AutomateParams,
-    OperationId.BOOKLET_IMPOSITION: BookletImpositionParams,
-    OperationId.CERT_SIGN: CertSignParams,
-    OperationId.CHANGE_METADATA: ChangeMetadataParams,
-    OperationId.CHANGE_PERMISSIONS: ChangePermissionsParams,
-    OperationId.COMPRESS: CompressParams,
-    OperationId.CONVERT: ConvertParams,
-    OperationId.CROP: CropParams,
-    OperationId.EDIT_TABLE_OF_CONTENTS: EditTableOfContentsParams,
-    OperationId.EXTRACT_IMAGES: ExtractImagesParams,
-    OperationId.EXTRACT_PAGES: ExtractPagesParams,
-    OperationId.FLATTEN: FlattenParams,
-    OperationId.MERGE: MergeParams,
-    OperationId.OCR: OcrParams,
-    OperationId.OVERLAY_PDFS: OverlayPdfsParams,
-    OperationId.PAGE_LAYOUT: PageLayoutParams,
-    OperationId.PDF_TO_SINGLE_PAGE: PdfToSinglePageParams,
-    OperationId.REDACT: RedactParams,
-    OperationId.REMOVE_ANNOTATIONS: RemoveAnnotationsParams,
-    OperationId.REMOVE_BLANKS: RemoveBlanksParams,
-    OperationId.REMOVE_CERT_SIGN: RemoveCertSignParams,
-    OperationId.REMOVE_IMAGE: RemoveImageParams,
-    OperationId.REMOVE_PAGES: RemovePagesParams,
-    OperationId.REMOVE_PASSWORD: RemovePasswordParams,
-    OperationId.REORGANIZE_PAGES: ReorganizePagesParams,
-    OperationId.REPAIR: RepairParams,
-    OperationId.REPLACE_COLOR: ReplaceColorParams,
-    OperationId.ROTATE: RotateParams,
-    OperationId.SANITIZE: SanitizeParams,
-    OperationId.SCALE_PAGES: ScalePagesParams,
-    OperationId.SCANNER_IMAGE_SPLIT: ScannerImageSplitParams,
-    OperationId.SIGN: SignParams,
-    OperationId.SPLIT: SplitParams,
-    OperationId.UNLOCK_PDFFORMS: UnlockPdfformsParams,
-    OperationId.WATERMARK: WatermarkParams,
+OPERATIONS: dict[ToolEndpoint, ParamToolModelType] = {
+    ToolEndpoint.CBR_TO_PDF: CbrToPdfParams,
+    ToolEndpoint.CBZ_TO_PDF: CbzToPdfParams,
+    ToolEndpoint.EBOOK_TO_PDF: EbookToPdfParams,
+    ToolEndpoint.EML_TO_PDF: EmlToPdfParams,
+    ToolEndpoint.HTML_TO_PDF: HtmlToPdfParams,
+    ToolEndpoint.IMG_TO_PDF: ImgToPdfParams,
+    ToolEndpoint.PDF_TO_CBR: PdfToCbrParams,
+    ToolEndpoint.PDF_TO_CBZ: PdfToCbzParams,
+    ToolEndpoint.PDF_TO_CSV: PdfToCsvParams,
+    ToolEndpoint.PDF_TO_EPUB: PdfToEpubParams,
+    ToolEndpoint.PDF_TO_IMG: PdfToImgParams,
+    ToolEndpoint.PDF_TO_PDFA: PdfToPdfaParams,
+    ToolEndpoint.PDF_TO_PRESENTATION: PdfToPresentationParams,
+    ToolEndpoint.PDF_TO_TEXT: PdfToTextParams,
+    ToolEndpoint.PDF_TO_VECTOR: PdfToVectorParams,
+    ToolEndpoint.PDF_TO_WORD: PdfToWordParams,
+    ToolEndpoint.PDF_TO_XLSX: PdfToXlsxParams,
+    ToolEndpoint.SVG_TO_PDF: SvgToPdfParams,
+    ToolEndpoint.URL_TO_PDF: UrlToPdfParams,
+    ToolEndpoint.VECTOR_TO_PDF: VectorToPdfParams,
+    ToolEndpoint.BOOKLET_IMPOSITION: BookletImpositionParams,
+    ToolEndpoint.CROP: CropParams,
+    ToolEndpoint.EDIT_TABLE_OF_CONTENTS: EditTableOfContentsParams,
+    ToolEndpoint.MERGE_PDFS: MergePdfsParams,
+    ToolEndpoint.MULTI_PAGE_LAYOUT: MultiPageLayoutParams,
+    ToolEndpoint.OVERLAY_PDFS: OverlayPdfsParams,
+    ToolEndpoint.REARRANGE_PAGES: RearrangePagesParams,
+    ToolEndpoint.REMOVE_PAGES: RemovePagesParams,
+    ToolEndpoint.ROTATE_PDF: RotatePdfParams,
+    ToolEndpoint.SCALE_PAGES: ScalePagesParams,
+    ToolEndpoint.SPLIT_BY_SIZE_OR_COUNT: SplitBySizeOrCountParams,
+    ToolEndpoint.SPLIT_FOR_POSTER_PRINT: SplitForPosterPrintParams,
+    ToolEndpoint.SPLIT_PAGES: SplitPagesParams,
+    ToolEndpoint.SPLIT_PDF_BY_CHAPTERS: SplitPdfByChaptersParams,
+    ToolEndpoint.SPLIT_PDF_BY_SECTIONS: SplitPdfBySectionsParams,
+    ToolEndpoint.ADD_ATTACHMENTS: AddAttachmentsParams,
+    ToolEndpoint.ADD_IMAGE: AddImageParams,
+    ToolEndpoint.ADD_PAGE_NUMBERS: AddPageNumbersParams,
+    ToolEndpoint.ADD_STAMP: AddStampParams,
+    ToolEndpoint.AUTO_RENAME: AutoRenameParams,
+    ToolEndpoint.AUTO_SPLIT_PDF: AutoSplitPdfParams,
+    ToolEndpoint.COMPRESS_PDF: CompressPdfParams,
+    ToolEndpoint.DELETE_ATTACHMENT: DeleteAttachmentParams,
+    ToolEndpoint.EXTRACT_IMAGE_SCANS: ExtractImageScansParams,
+    ToolEndpoint.EXTRACT_IMAGES: ExtractImagesParams,
+    ToolEndpoint.FLATTEN: FlattenParams,
+    ToolEndpoint.OCR_PDF: OcrPdfParams,
+    ToolEndpoint.REMOVE_BLANKS: RemoveBlanksParams,
+    ToolEndpoint.RENAME_ATTACHMENT: RenameAttachmentParams,
+    ToolEndpoint.REPLACE_INVERT_PDF: ReplaceInvertPdfParams,
+    ToolEndpoint.SCANNER_EFFECT: ScannerEffectParams,
+    ToolEndpoint.UPDATE_METADATA: UpdateMetadataParams,
+    ToolEndpoint.ADD_PASSWORD: AddPasswordParams,
+    ToolEndpoint.ADD_WATERMARK: AddWatermarkParams,
+    ToolEndpoint.AUTO_REDACT: AutoRedactParams,
+    ToolEndpoint.CERT_SIGN: CertSignParams,
+    ToolEndpoint.SESSIONS: SessionsParams,
+    ToolEndpoint.REDACT: RedactParams,
+    ToolEndpoint.REMOVE_PASSWORD: RemovePasswordParams,
+    ToolEndpoint.SANITIZE_PDF: SanitizePdfParams,
+    ToolEndpoint.TIMESTAMP_PDF: TimestampPdfParams,
 }
diff --git a/engine/src/stirling/rag/README.md b/engine/src/stirling/rag/README.md
new file mode 100644
index 0000000000..309a3a7c9b
--- /dev/null
+++ b/engine/src/stirling/rag/README.md
@@ -0,0 +1,88 @@
+# RAG Integration Guide
+
+## Adding RAG to an Agent
+
+```python
+from pydantic_ai import Agent
+
+from stirling.services import AppRuntime
+
+class MyAgent:
+    def __init__(self, runtime: AppRuntime) -> None:
+        rag = runtime.rag_capability
+        self.agent = Agent(
+            model=runtime.smart_model,
+            system_prompt="Your prompt here...",
+            instructions=rag.instructions,
+            toolsets=[rag.toolset],
+        )
+```
+
+That's it. The agent gets a `search_knowledge` tool it can call autonomously.
+
+## Scoping to Specific Collections
+
+Collections are named buckets of indexed documents — think folders. By default an agent searches everything in the store. Pass `collections=` to restrict it to only the docs indexed under those names.
+
+```python
+from stirling.rag import RagCapability
+
+# Only searches docs indexed under "company-docs" — ignores everything else
+scoped = RagCapability(runtime.rag_service, collections=["company-docs"], top_k=3)
+
+# Searches multiple collections
+multi = RagCapability(runtime.rag_service, collections=["company-docs", "product-specs"])
+
+# No collections arg = searches all collections in the store
+everything = RagCapability(runtime.rag_service)
+```
+
+## Config
+
+Non-secret defaults live in the committed `engine/.env`:
+
+```
+STIRLING_RAG_BACKEND=sqlite              # or "pgvector"
+STIRLING_RAG_EMBEDDING_MODEL=voyageai:voyage-4
+STIRLING_RAG_STORE_PATH=data/rag.db      # used when backend=sqlite
+STIRLING_RAG_PGVECTOR_DSN=               # used when backend=pgvector
+STIRLING_RAG_CHUNK_SIZE=512
+STIRLING_RAG_CHUNK_OVERLAP=64
+STIRLING_RAG_TOP_K=5
+```
+
+Provider credentials (and any local overrides) go in the uncommitted `engine/.env.local`:
+
+```
+VOYAGE_API_KEY=your-key
+```
+
+## Backends
+
+**`sqlite`** — Embedded sqlite-vec. Single `.db` file, zero ops. Ideal for dev and self-hosted deployments.
+
+**`pgvector`** — External PostgreSQL with the `vector` extension. Point `STIRLING_RAG_PGVECTOR_DSN` at your Postgres instance.
+
+Both backends implement the same `VectorStore` interface, so agents and the RAG service work identically regardless of which you pick.
+
+For a self-hosted embedding server (e.g. Ollama, TEI, vLLM) set the model string accordingly and point at the server via its native env var:
+
+```
+# Ollama running on another machine
+STIRLING_RAG_EMBEDDING_MODEL=ollama:nomic-embed-text
+OLLAMA_HOST=http://192.168.1.50:11434
+
+# Any OpenAI-compatible embedding server
+STIRLING_RAG_EMBEDDING_MODEL=openai:my-model
+OPENAI_BASE_URL=http://192.168.1.50:8080/v1
+```
+
+## API Endpoints
+
+| Method | Endpoint | Purpose |
+|--------|----------|---------|
+| GET | `/api/v1/rag/status` | Report embedding model and existing collections |
+| POST | `/api/v1/rag/index` | Index text into a collection |
+| POST | `/api/v1/rag/search` | Search a collection |
+| GET | `/api/v1/rag/collections` | List collections |
+| DELETE | `/api/v1/rag/collections/{name}` | Delete a collection |
diff --git a/engine/src/stirling/rag/__init__.py b/engine/src/stirling/rag/__init__.py
new file mode 100644
index 0000000000..3abc1f8180
--- /dev/null
+++ b/engine/src/stirling/rag/__init__.py
@@ -0,0 +1,19 @@
+from __future__ import annotations
+
+from stirling.rag.capability import RagCapability
+from stirling.rag.embedder import EmbeddingService
+from stirling.rag.pgvector_store import PgVectorStore
+from stirling.rag.service import RagService
+from stirling.rag.sqlite_vec_store import SqliteVecStore
+from stirling.rag.store import Document, SearchResult, VectorStore
+
+__all__ = [
+    "Document",
+    "EmbeddingService",
+    "PgVectorStore",
+    "RagCapability",
+    "RagService",
+    "SearchResult",
+    "SqliteVecStore",
+    "VectorStore",
+]
diff --git a/engine/src/stirling/rag/capability.py b/engine/src/stirling/rag/capability.py
new file mode 100644
index 0000000000..9950cf30ac
--- /dev/null
+++ b/engine/src/stirling/rag/capability.py
@@ -0,0 +1,108 @@
+from __future__ import annotations
+
+from collections.abc import Awaitable, Callable
+
+from pydantic_ai import FunctionToolset
+from pydantic_ai.toolsets import AbstractToolset
+
+from stirling.rag.service import RagService
+
+
+class RagCapability:
+    """Bundles RAG instructions and the ``search_knowledge`` toolset for agent injection.
+
+    Agents consume this as::
+
+        rag = runtime.rag_capability
+        Agent(
+            ...,
+            instructions=rag.instructions,
+            toolsets=[rag.toolset],
+        )
+
+    When no collections are pinned, the instructions are generated dynamically at
+    run time so the agent sees the current list of collections in the store.
+    """
+
+    def __init__(
+        self,
+        rag_service: RagService,
+        collections: list[str] | None = None,
+        top_k: int = 5,
+    ) -> None:
+        self._rag_service = rag_service
+        self._collections = collections
+        self._top_k = top_k
+        toolset: FunctionToolset[None] = FunctionToolset()
+        toolset.add_function(self._search_knowledge, name="search_knowledge")
+        self._toolset = toolset
+
+    @property
+    def instructions(self) -> str | Callable[[], Awaitable[str]]:
+        if self._collections:
+            return self._static_instructions_text(self._collections)
+        return self._dynamic_instructions
+
+    @property
+    def toolset(self) -> AbstractToolset[None]:
+        return self._toolset
+
+    @staticmethod
+    def _static_instructions_text(collections: list[str]) -> str:
+        collection_desc = f"collections: {', '.join(collections)}"
+        return (
+            "You have access to a knowledge base search tool called 'search_knowledge'. "
+            f"It searches {collection_desc} for relevant information. "
+            "Use it when the provided context is insufficient to answer the user's question, "
+            "or when you think additional background information would improve your answer. "
+            "You do not have to use it if the answer is already clear from the provided text."
+        )
+
+    async def _dynamic_instructions(self) -> str:
+        collections = await self._rag_service.list_collections()
+        if collections:
+            names = ", ".join(collections)
+            collection_desc = f"the following knowledge base collections: {names}"
+        else:
+            collection_desc = "the knowledge base (currently empty — no collections indexed yet)"
+        return (
+            "You have access to a knowledge base search tool called 'search_knowledge'. "
+            f"It searches {collection_desc} for relevant information. "
+            "Use it when the provided context is insufficient to answer the user's question, "
+            "or when you think additional background information would improve your answer. "
+            "You do not have to use it if the answer is already clear from the provided text."
+        )
+
+    async def _search_knowledge(self, query: str, max_results: int | None = None) -> str:
+        """Search the knowledge base for information relevant to the query.
+
+        Args:
+            query: The search query describing what information you need.
+            max_results: Maximum number of results to return.
+
+        Returns:
+            Formatted text with the most relevant knowledge base excerpts.
+        """
+        k = max_results if max_results is not None else self._top_k
+        if self._collections:
+            all_results = []
+            for col in self._collections:
+                col_results = await self._rag_service.search(query, collection=col, top_k=k)
+                all_results.extend(col_results)
+            all_results.sort(key=lambda r: r.score, reverse=True)
+            results = all_results[:k]
+        else:
+            results = await self._rag_service.search(query, top_k=k)
+
+        if not results:
+            return "No relevant results found in the knowledge base."
+
+        sections = []
+        for i, result in enumerate(results, 1):
+            source = result.document.metadata.get("source", "unknown")
+            chunk_idx = result.document.metadata.get("chunk_index", "?")
+            score = f"{result.score:.3f}"
+            sections.append(
+                f"[Result {i} | source: {source}, chunk: {chunk_idx}, relevance: {score}]\n{result.document.text}"
+            )
+        return "\n\n---\n\n".join(sections)
diff --git a/engine/src/stirling/rag/chunker.py b/engine/src/stirling/rag/chunker.py
new file mode 100644
index 0000000000..689365f6cb
--- /dev/null
+++ b/engine/src/stirling/rag/chunker.py
@@ -0,0 +1,118 @@
+from __future__ import annotations
+
+import re
+
+# TODO: replace with pydantic-ai's built-in chunking once
+# https://github.com/pydantic/pydantic-ai/issues/3962 lands.
+
+
+def chunk_text(text: str, chunk_size: int = 512, overlap: int = 64) -> list[str]:
+    """Split text into chunks of approximately chunk_size characters with overlap.
+
+    Splits on paragraph then sentence boundaries to avoid cutting mid-thought.
+    Returns an empty list for empty/whitespace-only input.
+    """
+    text = text.strip()
+    if not text:
+        return []
+
+    paragraphs = _split_paragraphs(text)
+    chunks: list[str] = []
+    current: list[str] = []
+    current_len = 0
+
+    for para in paragraphs:
+        para_len = len(para)
+
+        if current_len + para_len <= chunk_size:
+            current.append(para)
+            current_len += para_len
+            continue
+
+        # If the current buffer has content, flush it
+        if current:
+            chunks.append("\n\n".join(current))
+
+        # If this paragraph alone exceeds chunk_size, split it by sentences
+        if para_len > chunk_size:
+            sentence_chunks = _split_long_paragraph(para, chunk_size, overlap)
+            chunks.extend(sentence_chunks)
+            current = []
+            current_len = 0
+        else:
+            # Start new chunk with overlap from previous chunk
+            overlap_text = _get_overlap(chunks, overlap) if chunks else ""
+            if overlap_text:
+                current = [overlap_text, para]
+                current_len = len(overlap_text) + para_len
+            else:
+                current = [para]
+                current_len = para_len
+
+    if current:
+        chunks.append("\n\n".join(current))
+
+    return [c.strip() for c in chunks if c.strip()]
+
+
+def _split_paragraphs(text: str) -> list[str]:
+    """Split text into paragraphs on double newlines."""
+    return [p.strip() for p in re.split(r"\n\s*\n", text) if p.strip()]
+
+
+def _split_sentences(text: str) -> list[str]:
+    """Split text into sentences, keeping the delimiter attached."""
+    parts = re.split(r"(?<=[.!?])\s+", text)
+    return [s.strip() for s in parts if s.strip()]
+
+
+def _split_long_paragraph(paragraph: str, chunk_size: int, overlap: int) -> list[str]:
+    """Split a single long paragraph into sentence-boundary chunks."""
+    sentences = _split_sentences(paragraph)
+    chunks: list[str] = []
+    current: list[str] = []
+    current_len = 0
+
+    for sentence in sentences:
+        sent_len = len(sentence)
+
+        if current_len + sent_len <= chunk_size:
+            current.append(sentence)
+            current_len += sent_len + 1  # +1 for space
+            continue
+
+        if current:
+            chunks.append(" ".join(current))
+
+        # If a single sentence exceeds chunk_size, force-split it
+        if sent_len > chunk_size:
+            for i in range(0, sent_len, chunk_size - overlap):
+                chunks.append(sentence[i : i + chunk_size])
+            current = []
+            current_len = 0
+        else:
+            overlap_text = _get_overlap(chunks, overlap) if chunks else ""
+            if overlap_text:
+                current = [overlap_text, sentence]
+                current_len = len(overlap_text) + sent_len + 1
+            else:
+                current = [sentence]
+                current_len = sent_len
+
+    if current:
+        chunks.append(" ".join(current))
+
+    return chunks
+
+
+def _get_overlap(chunks: list[str], overlap: int) -> str:
+    """Extract the last ~`overlap` characters from the most recent chunk, snapped to a word boundary."""
+    if not chunks or overlap <= 0:
+        return ""
+    last = chunks[-1]
+    tail = last[-overlap:] if len(last) > overlap else last
+    # Snap to the nearest word boundary to avoid starting mid-word
+    space_idx = tail.find(" ")
+    if space_idx > 0:
+        tail = tail[space_idx + 1 :]
+    return tail
diff --git a/engine/src/stirling/rag/embedder.py b/engine/src/stirling/rag/embedder.py
new file mode 100644
index 0000000000..5df71bc808
--- /dev/null
+++ b/engine/src/stirling/rag/embedder.py
@@ -0,0 +1,47 @@
+from __future__ import annotations
+
+from pydantic_ai import Embedder
+
+from stirling.rag.chunker import chunk_text
+from stirling.rag.store import Document
+
+
+class EmbeddingService:
+    """Wraps Pydantic AI's Embedder to provide document chunking and embedding."""
+
+    def __init__(self, model_name: str, chunk_size: int = 512, chunk_overlap: int = 64) -> None:
+        self._embedder = Embedder(model_name)
+        self._chunk_size = chunk_size
+        self._chunk_overlap = chunk_overlap
+
+    async def embed_query(self, text: str) -> list[float]:
+        """Embed a search query, optimised for retrieval."""
+        result = await self._embedder.embed_query(text)
+        return list(result.embeddings[0])
+
+    async def embed_documents(self, texts: list[str]) -> list[list[float]]:
+        """Embed multiple document texts for indexing."""
+        if not texts:
+            return []
+        result = await self._embedder.embed_documents(texts)
+        return [list(emb) for emb in result.embeddings]
+
+    def chunk_and_prepare(
+        self,
+        text: str,
+        source: str = "",
+        base_metadata: dict[str, str] | None = None,
+    ) -> list[Document]:
+        """Chunk text and return Document objects ready for embedding.
+
+        Each chunk gets a unique ID based on source and chunk index.
+        """
+        chunks = chunk_text(text, self._chunk_size, self._chunk_overlap)
+        documents: list[Document] = []
+        for i, chunk in enumerate(chunks):
+            meta = dict(base_metadata) if base_metadata else {}
+            meta["source"] = source
+            meta["chunk_index"] = str(i)
+            doc_id = f"{source}:chunk:{i}" if source else f"chunk:{i}"
+            documents.append(Document(id=doc_id, text=chunk, metadata=meta))
+        return documents
diff --git a/engine/src/stirling/rag/pgvector_store.py b/engine/src/stirling/rag/pgvector_store.py
new file mode 100644
index 0000000000..9eedffb47d
--- /dev/null
+++ b/engine/src/stirling/rag/pgvector_store.py
@@ -0,0 +1,133 @@
+from __future__ import annotations
+
+import json
+
+import psycopg
+from pgvector.psycopg import register_vector_async
+
+from stirling.rag.store import Document, SearchResult, VectorStore
+
+
+class PgVectorStore(VectorStore):
+    """PostgreSQL + pgvector backed store.
+
+    Connects to an external Postgres instance (DSN provided via config) and uses the
+    `vector` extension for similarity search. The schema is created on first use.
+    """
+
+    def __init__(self, dsn: str) -> None:
+        if not dsn:
+            raise ValueError("pgvector backend requires a non-empty DSN (STIRLING_RAG_PGVECTOR_DSN)")
+        self._dsn = dsn
+        self._initialized = False
+
+    async def _connect(self) -> psycopg.AsyncConnection:
+        conn = await psycopg.AsyncConnection.connect(self._dsn)
+        await register_vector_async(conn)
+        return conn
+
+    async def _ensure_schema(self) -> None:
+        if self._initialized:
+            return
+        async with await self._connect() as conn:
+            async with conn.cursor() as cur:
+                await cur.execute("CREATE EXTENSION IF NOT EXISTS vector")
+                await cur.execute(
+                    """
+                    CREATE TABLE IF NOT EXISTS rag_documents (
+                        id TEXT NOT NULL,
+                        collection TEXT NOT NULL,
+                        text TEXT NOT NULL,
+                        metadata JSONB NOT NULL DEFAULT '{}'::jsonb,
+                        embedding vector NOT NULL,
+                        PRIMARY KEY (id, collection)
+                    )
+                    """
+                )
+                await cur.execute("CREATE INDEX IF NOT EXISTS idx_rag_collection ON rag_documents(collection)")
+                await conn.commit()
+        self._initialized = True
+
+    async def add_documents(
+        self,
+        collection: str,
+        documents: list[Document],
+        embeddings: list[list[float]],
+    ) -> None:
+        if len(documents) != len(embeddings):
+            raise ValueError(f"Got {len(documents)} documents but {len(embeddings)} embeddings")
+        if not documents:
+            return
+
+        await self._ensure_schema()
+        async with await self._connect() as conn:
+            async with conn.cursor() as cur:
+                for doc, emb in zip(documents, embeddings):
+                    await cur.execute(
+                        """
+                        INSERT INTO rag_documents (id, collection, text, metadata, embedding)
+                        VALUES (%s, %s, %s, %s::jsonb, %s)
+                        ON CONFLICT (id, collection)
+                        DO UPDATE SET
+                            text = EXCLUDED.text,
+                            metadata = EXCLUDED.metadata,
+                            embedding = EXCLUDED.embedding
+                        """,
+                        (doc.id, collection, doc.text, json.dumps(doc.metadata), emb),
+                    )
+                await conn.commit()
+
+    async def search(
+        self,
+        collection: str,
+        query_embedding: list[float],
+        top_k: int = 5,
+    ) -> list[SearchResult]:
+        await self._ensure_schema()
+        async with await self._connect() as conn:
+            async with conn.cursor() as cur:
+                await cur.execute(
+                    """
+                    SELECT id, text, metadata, 1 - (embedding <=> %s) AS score
+                    FROM rag_documents
+                    WHERE collection = %s
+                    ORDER BY embedding <=> %s
+                    LIMIT %s
+                    """,
+                    (query_embedding, collection, query_embedding, top_k),
+                )
+                rows = await cur.fetchall()
+
+        return [
+            SearchResult(
+                document=Document(id=r[0], text=r[1], metadata=r[2] or {}),
+                score=float(r[3]),
+            )
+            for r in rows
+        ]
+
+    async def delete_collection(self, collection: str) -> None:
+        await self._ensure_schema()
+        async with await self._connect() as conn:
+            async with conn.cursor() as cur:
+                await cur.execute("DELETE FROM rag_documents WHERE collection = %s", (collection,))
+                await conn.commit()
+
+    async def list_collections(self) -> list[str]:
+        await self._ensure_schema()
+        async with await self._connect() as conn:
+            async with conn.cursor() as cur:
+                await cur.execute("SELECT DISTINCT collection FROM rag_documents ORDER BY collection")
+                rows = await cur.fetchall()
+        return [r[0] for r in rows]
+
+    async def has_collection(self, collection: str) -> bool:
+        await self._ensure_schema()
+        async with await self._connect() as conn:
+            async with conn.cursor() as cur:
+                await cur.execute(
+                    "SELECT 1 FROM rag_documents WHERE collection = %s LIMIT 1",
+                    (collection,),
+                )
+                row = await cur.fetchone()
+        return row is not None
diff --git a/engine/src/stirling/rag/service.py b/engine/src/stirling/rag/service.py
new file mode 100644
index 0000000000..b8c9c4ab19
--- /dev/null
+++ b/engine/src/stirling/rag/service.py
@@ -0,0 +1,80 @@
+from __future__ import annotations
+
+import logging
+
+from stirling.rag.embedder import EmbeddingService
+from stirling.rag.store import Document, SearchResult, VectorStore
+
+logger = logging.getLogger(__name__)
+
+
+class RagService:
+    """Orchestrates embedding and vector storage for RAG workflows."""
+
+    def __init__(self, embedder: EmbeddingService, store: VectorStore, default_top_k: int = 5) -> None:
+        self._embedder = embedder
+        self._store = store
+        self._default_top_k = default_top_k
+
+    async def index_text(
+        self,
+        collection: str,
+        text: str,
+        source: str = "",
+        metadata: dict[str, str] | None = None,
+    ) -> int:
+        """Chunk, embed, and store text. Returns the number of chunks indexed."""
+        documents = self._embedder.chunk_and_prepare(text, source=source, base_metadata=metadata)
+        if not documents:
+            return 0
+        embeddings = await self._embedder.embed_documents([doc.text for doc in documents])
+        await self._store.add_documents(collection, documents, embeddings)
+        return len(documents)
+
+    async def index_documents(self, collection: str, documents: list[Document]) -> int:
+        """Embed and store pre-chunked documents. Returns the number stored."""
+        if not documents:
+            return 0
+        embeddings = await self._embedder.embed_documents([doc.text for doc in documents])
+        await self._store.add_documents(collection, documents, embeddings)
+        return len(documents)
+
+    async def search(
+        self,
+        query: str,
+        collection: str | None = None,
+        top_k: int | None = None,
+    ) -> list[SearchResult]:
+        """Embed query and search across one or all collections.
+
+        If collection is None, searches all available collections and merges results.
+        """
+        k = top_k if top_k is not None else self._default_top_k
+        query_embedding = await self._embedder.embed_query(query)
+
+        if collection is not None:
+            if not await self._store.has_collection(collection):
+                return []
+            return await self._store.search(collection, query_embedding, k)
+
+        # Search all collections, skipping any that error (e.g. dimension mismatch)
+        collections = await self._store.list_collections()
+        all_results: list[SearchResult] = []
+        for col_name in collections:
+            try:
+                results = await self._store.search(col_name, query_embedding, k)
+                all_results.extend(results)
+            except Exception:  # noqa: BLE001 — any backend error on one collection should not stop the others
+                logger.warning("Skipping collection %s during cross-collection search", col_name, exc_info=True)
+
+        # Sort by score descending, return top_k across all collections
+        all_results.sort(key=lambda r: r.score, reverse=True)
+        return all_results[:k]
+
+    async def delete_collection(self, collection: str) -> None:
+        """Remove a collection and all its documents."""
+        await self._store.delete_collection(collection)
+
+    async def list_collections(self) -> list[str]:
+        """List all available collections."""
+        return await self._store.list_collections()
diff --git a/engine/src/stirling/rag/sqlite_vec_store.py b/engine/src/stirling/rag/sqlite_vec_store.py
new file mode 100644
index 0000000000..b3008dcf22
--- /dev/null
+++ b/engine/src/stirling/rag/sqlite_vec_store.py
@@ -0,0 +1,227 @@
+from __future__ import annotations
+
+import asyncio
+import json
+import math
+import re
+import sqlite3
+from pathlib import Path
+
+import sqlite_vec
+
+from stirling.rag.store import Document, SearchResult, VectorStore
+
+
+class SqliteVecStore(VectorStore):
+    """sqlite-vec backed vector store. Single-file SQLite database, embedded, no server.
+
+    Each collection gets its own `vec0` virtual table with a fixed embedding dimension
+    (detected on first insert). Document metadata lives in a regular table joined by rowid.
+    """
+
+    def __init__(self, db_path: str | Path) -> None:
+        is_memory = str(db_path) == ":memory:"
+        self._db_path: Path | None = None if is_memory else Path(db_path)
+
+        if self._db_path is not None:
+            self._db_path.parent.mkdir(parents=True, exist_ok=True)
+            conn = sqlite3.connect(str(self._db_path), check_same_thread=False)
+        else:
+            conn = sqlite3.connect(":memory:", check_same_thread=False)
+
+        conn.enable_load_extension(True)
+        sqlite_vec.load(conn)
+        conn.enable_load_extension(False)
+        if self._db_path is not None:
+            conn.execute("PRAGMA journal_mode=WAL")
+
+        self._conn = conn
+        self._lock = asyncio.Lock()
+        self._init_schema()
+
+    @classmethod
+    def ephemeral(cls) -> SqliteVecStore:
+        """In-memory store for testing."""
+        return cls(":memory:")
+
+    def _init_schema(self) -> None:
+        self._conn.execute(
+            """
+            CREATE TABLE IF NOT EXISTS collections (
+                name TEXT PRIMARY KEY,
+                dim INTEGER NOT NULL,
+                table_name TEXT NOT NULL
+            )
+            """
+        )
+        self._conn.execute(
+            """
+            CREATE TABLE IF NOT EXISTS documents (
+                id TEXT NOT NULL,
+                collection TEXT NOT NULL,
+                text TEXT NOT NULL,
+                metadata TEXT NOT NULL DEFAULT '{}',
+                vec_rowid INTEGER NOT NULL,
+                PRIMARY KEY (id, collection)
+            )
+            """
+        )
+        self._conn.execute("CREATE INDEX IF NOT EXISTS idx_doc_collection ON documents(collection)")
+        self._conn.commit()
+
+    @staticmethod
+    def _sanitize_table_name(collection: str) -> str:
+        safe = re.sub(r"[^a-zA-Z0-9_]", "_", collection)
+        return f"vec_{safe}"
+
+    @staticmethod
+    def _normalize(vector: list[float]) -> list[float]:
+        norm = math.sqrt(sum(x * x for x in vector))
+        if norm == 0:
+            return list(vector)
+        return [x / norm for x in vector]
+
+    async def add_documents(
+        self,
+        collection: str,
+        documents: list[Document],
+        embeddings: list[list[float]],
+    ) -> None:
+        if len(documents) != len(embeddings):
+            raise ValueError(f"Got {len(documents)} documents but {len(embeddings)} embeddings")
+        if not documents:
+            return
+
+        async with self._lock:
+            await asyncio.to_thread(self._sync_add, collection, documents, embeddings)
+
+    def _sync_add(
+        self,
+        collection: str,
+        documents: list[Document],
+        embeddings: list[list[float]],
+    ) -> None:
+        dim = len(embeddings[0])
+        row = self._conn.execute("SELECT dim, table_name FROM collections WHERE name = ?", (collection,)).fetchone()
+        if row is None:
+            table_name = self._sanitize_table_name(collection)
+            self._conn.execute(f"CREATE VIRTUAL TABLE IF NOT EXISTS {table_name} USING vec0(embedding float[{dim}])")
+            self._conn.execute(
+                "INSERT INTO collections(name, dim, table_name) VALUES (?, ?, ?)",
+                (collection, dim, table_name),
+            )
+        else:
+            existing_dim, table_name = row
+            if existing_dim != dim:
+                raise ValueError(f"Collection {collection} has dim {existing_dim}, got embedding of dim {dim}")
+
+        # Upsert: delete existing docs with matching IDs first
+        ids = [doc.id for doc in documents]
+        placeholders = ",".join("?" * len(ids))
+        existing = self._conn.execute(
+            f"SELECT vec_rowid FROM documents WHERE collection = ? AND id IN ({placeholders})",
+            (collection, *ids),
+        ).fetchall()
+        if existing:
+            vec_rowids = [r[0] for r in existing]
+            row_placeholders = ",".join("?" * len(vec_rowids))
+            self._conn.execute(
+                f"DELETE FROM {table_name} WHERE rowid IN ({row_placeholders})",
+                vec_rowids,
+            )
+            self._conn.execute(
+                f"DELETE FROM documents WHERE collection = ? AND id IN ({placeholders})",
+                (collection, *ids),
+            )
+
+        for doc, emb in zip(documents, embeddings):
+            normalized = self._normalize(list(emb))
+            cursor = self._conn.execute(
+                f"INSERT INTO {table_name}(embedding) VALUES (?)",
+                (sqlite_vec.serialize_float32(normalized),),
+            )
+            vec_rowid = cursor.lastrowid
+            self._conn.execute(
+                "INSERT INTO documents(id, collection, text, metadata, vec_rowid) VALUES (?, ?, ?, ?, ?)",
+                (doc.id, collection, doc.text, json.dumps(doc.metadata), vec_rowid),
+            )
+        self._conn.commit()
+
+    async def search(
+        self,
+        collection: str,
+        query_embedding: list[float],
+        top_k: int = 5,
+    ) -> list[SearchResult]:
+        async with self._lock:
+            return await asyncio.to_thread(self._sync_search, collection, query_embedding, top_k)
+
+    def _sync_search(
+        self,
+        collection: str,
+        query_embedding: list[float],
+        top_k: int,
+    ) -> list[SearchResult]:
+        row = self._conn.execute("SELECT table_name, dim FROM collections WHERE name = ?", (collection,)).fetchone()
+        if row is None:
+            return []
+        table_name, dim = row
+        if len(query_embedding) != dim:
+            raise ValueError(f"Query embedding dim {len(query_embedding)} does not match collection dim {dim}")
+
+        normalized = self._normalize(list(query_embedding))
+        query_blob = sqlite_vec.serialize_float32(normalized)
+
+        results = self._conn.execute(
+            f"""
+            SELECT d.id, d.text, d.metadata, v.distance
+            FROM {table_name} v
+            JOIN documents d ON d.vec_rowid = v.rowid AND d.collection = ?
+            WHERE v.embedding MATCH ? AND k = ?
+            ORDER BY v.distance
+            """,
+            (collection, query_blob, top_k),
+        ).fetchall()
+
+        return [
+            SearchResult(
+                document=Document(
+                    id=r[0],
+                    text=r[1],
+                    metadata=json.loads(r[2]) if r[2] else {},
+                ),
+                # For normalized vectors: cosine_sim = 1 - (L2^2 / 2)
+                score=max(0.0, 1.0 - (r[3] ** 2) / 2.0),
+            )
+            for r in results
+        ]
+
+    async def delete_collection(self, collection: str) -> None:
+        async with self._lock:
+            await asyncio.to_thread(self._sync_delete_collection, collection)
+
+    def _sync_delete_collection(self, collection: str) -> None:
+        row = self._conn.execute("SELECT table_name FROM collections WHERE name = ?", (collection,)).fetchone()
+        if row is None:
+            return
+        table_name = row[0]
+        self._conn.execute(f"DROP TABLE IF EXISTS {table_name}")
+        self._conn.execute("DELETE FROM documents WHERE collection = ?", (collection,))
+        self._conn.execute("DELETE FROM collections WHERE name = ?", (collection,))
+        self._conn.commit()
+
+    async def list_collections(self) -> list[str]:
+        async with self._lock:
+            return await asyncio.to_thread(self._sync_list_collections)
+
+    def _sync_list_collections(self) -> list[str]:
+        rows = self._conn.execute("SELECT name FROM collections ORDER BY name").fetchall()
+        return [r[0] for r in rows]
+
+    async def has_collection(self, collection: str) -> bool:
+        async with self._lock:
+            return await asyncio.to_thread(self._sync_has_collection, collection)
+
+    def _sync_has_collection(self, collection: str) -> bool:
+        row = self._conn.execute("SELECT 1 FROM collections WHERE name = ?", (collection,)).fetchone()
+        return row is not None
diff --git a/engine/src/stirling/rag/store.py b/engine/src/stirling/rag/store.py
new file mode 100644
index 0000000000..1ad0dffbf5
--- /dev/null
+++ b/engine/src/stirling/rag/store.py
@@ -0,0 +1,59 @@
+from __future__ import annotations
+
+from abc import ABC, abstractmethod
+from dataclasses import dataclass, field
+
+
+@dataclass
+class Document:
+    """A chunk of text with metadata, ready for embedding and storage."""
+
+    id: str
+    text: str
+    metadata: dict[str, str] = field(default_factory=dict)
+
+
+@dataclass
+class SearchResult:
+    """A document returned from a vector search with its relevance score."""
+
+    document: Document
+    score: float
+
+
+class VectorStore(ABC):
+    """Abstract interface for vector storage backends.
+
+    Implementations must handle persistence, collection management,
+    and nearest-neighbor search over pre-computed embeddings.
+    """
+
+    @abstractmethod
+    async def add_documents(
+        self,
+        collection: str,
+        documents: list[Document],
+        embeddings: list[list[float]],
+    ) -> None:
+        """Store documents with their embeddings in the named collection."""
+
+    @abstractmethod
+    async def search(
+        self,
+        collection: str,
+        query_embedding: list[float],
+        top_k: int = 5,
+    ) -> list[SearchResult]:
+        """Return the top_k most similar documents from the collection."""
+
+    @abstractmethod
+    async def delete_collection(self, collection: str) -> None:
+        """Remove a collection and all its documents."""
+
+    @abstractmethod
+    async def list_collections(self) -> list[str]:
+        """Return names of all existing collections."""
+
+    @abstractmethod
+    async def has_collection(self, collection: str) -> bool:
+        """Check whether a collection exists."""
diff --git a/engine/src/stirling/services/__init__.py b/engine/src/stirling/services/__init__.py
index d4c79f4910..8894f41149 100644
--- a/engine/src/stirling/services/__init__.py
+++ b/engine/src/stirling/services/__init__.py
@@ -1,9 +1,11 @@
 """Shared services used by the Stirling AI runtime."""
 
 from .runtime import AppRuntime, build_model_settings, build_runtime
+from .tracking import setup_posthog_tracking
 
 __all__ = [
     "AppRuntime",
     "build_model_settings",
     "build_runtime",
+    "setup_posthog_tracking",
 ]
diff --git a/engine/src/stirling/services/runtime.py b/engine/src/stirling/services/runtime.py
index 656e7d9512..3b91abbd79 100644
--- a/engine/src/stirling/services/runtime.py
+++ b/engine/src/stirling/services/runtime.py
@@ -1,11 +1,23 @@
 from __future__ import annotations
 
+import logging
 from dataclasses import dataclass
+from typing import assert_never
 
 from pydantic_ai.models import Model, infer_model
 from pydantic_ai.settings import ModelSettings
 
-from stirling.config import AppSettings
+from stirling.config import ENGINE_ROOT, AppSettings, RagBackend
+from stirling.rag import (
+    EmbeddingService,
+    PgVectorStore,
+    RagCapability,
+    RagService,
+    SqliteVecStore,
+    VectorStore,
+)
+
+logger = logging.getLogger(__name__)
 
 
 @dataclass(frozen=True)
@@ -13,6 +25,8 @@ class AppRuntime:
     settings: AppSettings
     fast_model: Model
     smart_model: Model
+    rag_service: RagService
+    rag_capability: RagCapability
 
     @property
     def fast_model_settings(self) -> ModelSettings:
@@ -39,13 +53,47 @@ def validate_structured_output_support(model: Model, model_name: str) -> None:
         raise ValueError(f"Unsupported model {model_name}. This model does not support structured outputs.")
 
 
+def _build_vector_store(settings: AppSettings) -> VectorStore:
+    """Build the configured vector store backend."""
+    if settings.rag_backend == RagBackend.SQLITE:
+        store_path = settings.rag_store_path
+        # Treat ":memory:" as a special in-process token; otherwise resolve against the engine root.
+        if str(store_path) != ":memory:" and not store_path.is_absolute():
+            store_path = ENGINE_ROOT / store_path
+        logger.info("RAG backend=sqlite, db_path=%s", store_path)
+        return SqliteVecStore(db_path=store_path)
+    if settings.rag_backend == RagBackend.PGVECTOR:
+        logger.info("RAG backend=pgvector, dsn=<configured>")
+        return PgVectorStore(dsn=settings.rag_pgvector_dsn)
+    assert_never(settings.rag_backend)
+
+
+def _build_rag(settings: AppSettings) -> tuple[RagService, RagCapability]:
+    """Build the RAG service and capability."""
+    logger.info("RAG: embedding_model=%s", settings.rag_embedding_model)
+    embedder = EmbeddingService(
+        model_name=settings.rag_embedding_model,
+        chunk_size=settings.rag_chunk_size,
+        chunk_overlap=settings.rag_chunk_overlap,
+    )
+    store = _build_vector_store(settings)
+    service = RagService(embedder=embedder, store=store, default_top_k=settings.rag_default_top_k)
+    capability = RagCapability(rag_service=service, top_k=settings.rag_default_top_k)
+    return service, capability
+
+
 def build_runtime(settings: AppSettings) -> AppRuntime:
     fast_model = infer_model(settings.fast_model_name)
     smart_model = infer_model(settings.smart_model_name)
     validate_structured_output_support(fast_model, settings.fast_model_name)
     validate_structured_output_support(smart_model, settings.smart_model_name)
+
+    rag_service, rag_capability = _build_rag(settings)
+
     return AppRuntime(
         settings=settings,
         fast_model=fast_model,
         smart_model=smart_model,
+        rag_service=rag_service,
+        rag_capability=rag_capability,
     )
diff --git a/engine/src/stirling/services/tracking.py b/engine/src/stirling/services/tracking.py
new file mode 100644
index 0000000000..f8c93524a1
--- /dev/null
+++ b/engine/src/stirling/services/tracking.py
@@ -0,0 +1,233 @@
+from __future__ import annotations
+
+import json
+from collections import OrderedDict
+from collections.abc import Mapping
+from contextvars import ContextVar
+from typing import Any
+
+from opentelemetry.context import Context
+from opentelemetry.sdk.trace import ReadableSpan, SpanProcessor, TracerProvider
+from opentelemetry.semconv._incubating.attributes.gen_ai_attributes import (  # No public import for these constants yet
+    GEN_AI_INPUT_MESSAGES,
+    GEN_AI_OPERATION_NAME,
+    GEN_AI_OUTPUT_MESSAGES,
+    GEN_AI_REQUEST_MAX_TOKENS,
+    GEN_AI_REQUEST_MODEL,
+    GEN_AI_REQUEST_TEMPERATURE,
+    GEN_AI_RESPONSE_MODEL,
+    GEN_AI_SYSTEM,
+    GEN_AI_TOOL_DEFINITIONS,
+    GEN_AI_USAGE_INPUT_TOKENS,
+    GEN_AI_USAGE_OUTPUT_TOKENS,
+    GenAiOperationNameValues,
+)
+from opentelemetry.semconv.attributes.server_attributes import SERVER_ADDRESS, SERVER_PORT
+from opentelemetry.trace import Span
+from posthog.client import Client as PostHogClient
+
+from stirling.config import AppSettings
+
+# Per-request user ID, set by middleware from the X-User-Id header.
+# When not set, PostHog generates a random ID and marks the event as personless.
+current_user_id: ContextVar[str | None] = ContextVar("current_user_id", default=None)
+
+
+class LRUSet:
+    """Least Recently Used Set: a set with a maximum size that evicts the oldest entries first."""
+
+    def __init__(self, max_size: int) -> None:
+        self._max_size = max_size
+        self._data: OrderedDict[str, None] = OrderedDict()
+
+    def __contains__(self, key: str) -> bool:
+        return key in self._data
+
+    def add(self, key: str) -> None:
+        self._data[key] = None
+        if len(self._data) > self._max_size:
+            self._data.popitem(last=False)
+
+
+def _parse_json_attr(attrs: Mapping[str, Any], key: str) -> Any | None:
+    """Parse a JSON string span attribute, returning None on failure."""
+    raw = attrs.get(key)
+    if raw is None:
+        return None
+    try:
+        return json.loads(str(raw))
+    except (json.JSONDecodeError, TypeError):
+        return None
+
+
+def _transform_output_choices(choices: list[Any]) -> list[Any]:
+    """Transform Pydantic AI's parts-based output format to PostHog-compatible format.
+
+    Pydantic AI emits: ``[{"role": "assistant", "parts": [{"type": "tool_call", "name": "..."}]}]``
+    PostHog expects: ``[{"role": "assistant", "tool_calls": [{"type": "function", "function": {"name": "..."}}]}]``
+    """
+    for choice in choices:
+        if not isinstance(choice, dict) or "parts" not in choice:
+            continue
+        tool_calls = []
+        for part in choice.get("parts", []):
+            if isinstance(part, dict) and part.get("type") == "tool_call":
+                tool_calls.append(
+                    {
+                        "type": "function",
+                        "id": part.get("id", ""),
+                        "function": {"name": part.get("name", "")},
+                    }
+                )
+        if tool_calls:
+            choice["tool_calls"] = tool_calls
+        choice["content"] = choice.pop("parts")
+    return choices
+
+
+def _extract_user_message(attrs: Mapping[str, Any]) -> str:
+    """Extract the last user message text from the input messages span attribute."""
+    messages = _parse_json_attr(attrs, GEN_AI_INPUT_MESSAGES)
+    if not isinstance(messages, list):
+        return ""
+    for msg in reversed(messages):
+        if not isinstance(msg, dict):
+            continue
+        if msg.get("role") == "user":
+            for part in msg.get("parts", []):
+                if isinstance(part, dict) and part.get("type") == "text":
+                    return str(part.get("content", ""))
+    return ""
+
+
+# TODO: Replace with an official PostHog integration if one ever exists
+class PostHogSpanProcessor(SpanProcessor):
+    """Translates Pydantic AI OpenTelemetry spans into PostHog $ai_generation events."""
+
+    def __init__(self, client: PostHogClient) -> None:
+        self._client = client
+        self._seen_traces = LRUSet(max_size=10_000)
+
+    def on_start(self, span: Span, parent_context: Context | None = None) -> None:
+        pass
+
+    def on_end(self, span: ReadableSpan) -> None:
+        attrs = dict(span.attributes or {})
+        if attrs.get(GEN_AI_OPERATION_NAME) != GenAiOperationNameValues.CHAT.value:
+            return
+
+        properties = self._build_generation_properties(span, attrs)
+        self._maybe_emit_trace_event(span, attrs, properties)
+        self._client.capture(
+            distinct_id=current_user_id.get(),
+            event="$ai_generation",
+            properties=properties,
+        )
+
+    def _build_generation_properties(self, span: ReadableSpan, attrs: Mapping[str, Any]) -> dict[str, object]:
+        """Build the $ai_generation event properties from span data."""
+        properties: dict[str, object] = {
+            "$ai_provider": attrs.get(GEN_AI_SYSTEM, ""),
+            "$ai_model": attrs.get(GEN_AI_RESPONSE_MODEL) or attrs.get(GEN_AI_REQUEST_MODEL, ""),
+            "$ai_input_tokens": attrs.get(GEN_AI_USAGE_INPUT_TOKENS, 0),
+            "$ai_output_tokens": attrs.get(GEN_AI_USAGE_OUTPUT_TOKENS, 0),
+        }
+
+        if span.context:
+            properties["$ai_trace_id"] = format(span.context.trace_id, "032x")
+            properties["$ai_span_id"] = format(span.context.span_id, "016x")
+        if span.parent and span.parent.span_id:
+            properties["$ai_parent_id"] = format(span.parent.span_id, "016x")
+        if span.start_time and span.end_time:
+            properties["$ai_latency"] = (span.end_time - span.start_time) / 1e9
+
+        self._add_message_properties(properties, attrs)
+        self._add_model_parameters(properties, attrs)
+        self._add_tool_definitions(properties, attrs)
+        self._add_base_url(properties, attrs)
+
+        return properties
+
+    def _maybe_emit_trace_event(
+        self, span: ReadableSpan, attrs: Mapping[str, Any], properties: dict[str, object]
+    ) -> None:
+        """Emit an $ai_trace event for the first span seen per trace ID."""
+        trace_id = str(properties.get("$ai_trace_id", ""))
+        if not trace_id or trace_id in self._seen_traces:
+            return
+
+        self._seen_traces.add(trace_id)
+        trace_properties: dict[str, object] = {
+            "$ai_trace_id": trace_id,
+            "$ai_trace_name": _extract_user_message(attrs),
+            "$ai_provider": attrs.get(GEN_AI_SYSTEM, ""),
+        }
+        if span.start_time and span.end_time:
+            trace_properties["$ai_latency"] = (span.end_time - span.start_time) / 1e9
+        self._client.capture(
+            distinct_id=current_user_id.get(),
+            event="$ai_trace",
+            properties=trace_properties,
+        )
+
+    @staticmethod
+    def _add_message_properties(properties: dict[str, object], attrs: Mapping[str, Any]) -> None:
+        input_messages = _parse_json_attr(attrs, GEN_AI_INPUT_MESSAGES)
+        if input_messages is not None:
+            properties["$ai_input"] = input_messages
+
+        output_messages = _parse_json_attr(attrs, GEN_AI_OUTPUT_MESSAGES)
+        if isinstance(output_messages, list):
+            properties["$ai_output_choices"] = _transform_output_choices(output_messages)
+        elif output_messages is not None:
+            properties["$ai_output_choices"] = output_messages
+
+    @staticmethod
+    def _add_model_parameters(properties: dict[str, object], attrs: Mapping[str, Any]) -> None:
+        model_parameters: dict[str, object] = {}
+        if GEN_AI_REQUEST_TEMPERATURE in attrs:
+            model_parameters["temperature"] = attrs[GEN_AI_REQUEST_TEMPERATURE]
+        if GEN_AI_REQUEST_MAX_TOKENS in attrs:
+            model_parameters["max_tokens"] = attrs[GEN_AI_REQUEST_MAX_TOKENS]
+        if model_parameters:
+            properties["$ai_model_parameters"] = model_parameters
+
+    @staticmethod
+    def _add_tool_definitions(properties: dict[str, object], attrs: Mapping[str, Any]) -> None:
+        tools = _parse_json_attr(attrs, GEN_AI_TOOL_DEFINITIONS)
+        if tools is not None:
+            properties["$ai_tools"] = tools
+
+    @staticmethod
+    def _add_base_url(properties: dict[str, object], attrs: Mapping[str, Any]) -> None:
+        parts: list[str] = []
+        if host := attrs.get(SERVER_ADDRESS):
+            parts.append(str(host))
+        if port := attrs.get(SERVER_PORT):
+            parts.append(str(port))
+        if parts:
+            properties["$ai_base_url"] = ":".join(parts)
+
+    def shutdown(self) -> None:
+        self._client.shutdown()
+
+    def force_flush(self, timeout_millis: int = 30000) -> bool:
+        self._client.flush()
+        return True
+
+
+def setup_posthog_tracking(settings: AppSettings) -> TracerProvider | None:
+    """Configure OpenTelemetry with a PostHog span processor for LLM analytics.
+
+    Returns the TracerProvider so it can be shut down on app exit,
+    or None when tracking is disabled.
+    """
+    if not settings.posthog_enabled or not settings.posthog_api_key:
+        return None
+
+    client = PostHogClient(project_api_key=settings.posthog_api_key, host=settings.posthog_host)
+    processor = PostHogSpanProcessor(client)
+
+    provider = TracerProvider()
+    provider.add_span_processor(processor)
+    return provider
diff --git a/engine/tests/conftest.py b/engine/tests/conftest.py
new file mode 100644
index 0000000000..3e1809f769
--- /dev/null
+++ b/engine/tests/conftest.py
@@ -0,0 +1,46 @@
+from __future__ import annotations
+
+from collections.abc import Iterator
+from pathlib import Path
+
+import pytest
+
+from stirling.config import AppSettings, RagBackend, load_settings
+from stirling.services import build_runtime
+from stirling.services.runtime import AppRuntime
+
+
+@pytest.fixture(autouse=True)
+def clear_settings_cache() -> Iterator[None]:
+    load_settings.cache_clear()
+    yield
+    load_settings.cache_clear()
+
+
+def build_app_settings() -> AppSettings:
+    return AppSettings(
+        smart_model_name="test",
+        fast_model_name="test",
+        smart_model_max_tokens=8192,
+        fast_model_max_tokens=2048,
+        rag_backend=RagBackend.SQLITE,
+        rag_embedding_model="voyageai:voyage-4",
+        rag_store_path=Path(":memory:"),
+        rag_pgvector_dsn="",
+        rag_chunk_size=512,
+        rag_chunk_overlap=64,
+        rag_default_top_k=5,
+        posthog_enabled=False,
+        posthog_api_key="",
+        posthog_host="https://eu.i.posthog.com",
+    )
+
+
+@pytest.fixture
+def app_settings() -> AppSettings:
+    return build_app_settings()
+
+
+@pytest.fixture
+def runtime(app_settings: AppSettings) -> AppRuntime:
+    return build_runtime(app_settings)
diff --git a/engine/tests/ledger/__init__.py b/engine/tests/ledger/__init__.py
new file mode 100644
index 0000000000..e69de29bb2
diff --git a/engine/tests/ledger/test_arithmetic_scanner.py b/engine/tests/ledger/test_arithmetic_scanner.py
new file mode 100644
index 0000000000..00fe4c68ff
--- /dev/null
+++ b/engine/tests/ledger/test_arithmetic_scanner.py
@@ -0,0 +1,133 @@
+"""
+ArithmeticScanner — unit tests.
+
+Tests cover the two inline arithmetic patterns the scanner targets:
+  1. Equals expressions:        A + B = C
+  2. Total-then-addends:        Total: C (A + B)
+"""
+
+from decimal import Decimal
+
+import pytest
+
+from stirling.agents.ledger.validators.arithmetic import ArithmeticScanner
+
+
+@pytest.fixture
+def scanner() -> ArithmeticScanner:
+    return ArithmeticScanner(tolerance=Decimal("0.01"))
+
+
+# ---------------------------------------------------------------------------
+# Equals expressions: A + B + C = D
+# ---------------------------------------------------------------------------
+
+
+def test_correct_equals_expression(scanner: ArithmeticScanner) -> None:
+    """A correct sum should produce no findings."""
+    text = "The total cost is 100 + 200 + 150 = 450."
+    assert scanner.scan(page=0, text=text) == []
+
+
+def test_wrong_equals_expression(scanner: ArithmeticScanner) -> None:
+    """An incorrect sum should produce one error discrepancy."""
+    text = "Revenue: 500 + 300 = 900"  # should be 800
+    discrepancies = scanner.scan(page=3, text=text)
+    assert len(discrepancies) == 1
+    d = discrepancies[0]
+    assert d.page == 3
+    assert d.kind == "arithmetic"
+    assert d.severity == "error"
+    assert d.stated == "900"
+    assert d.expected == "800"
+
+
+def test_subtraction_expression(scanner: ArithmeticScanner) -> None:
+    """Subtraction in expressions should be evaluated correctly."""
+    text = "Net: 1000 - 250 = 750"
+    assert scanner.scan(page=0, text=text) == []
+
+
+def test_wrong_subtraction(scanner: ArithmeticScanner) -> None:
+    text = "Net: 1000 - 250 = 800"  # should be 750
+    discrepancies = scanner.scan(page=0, text=text)
+    assert len(discrepancies) == 1
+    assert discrepancies[0].expected == "750"
+
+
+def test_currency_symbols_stripped(scanner: ArithmeticScanner) -> None:
+    """Currency symbols and thousand separators must not break parsing."""
+    text = "Total: £1,000 + £500 = £1,500"
+    assert scanner.scan(page=0, text=text) == []
+
+
+def test_multiple_expressions_in_text(scanner: ArithmeticScanner) -> None:
+    """Multiple expressions in the same text should each be evaluated."""
+    text = (
+        "Q1 revenue: 100 + 200 = 300. "
+        "Q2 revenue: 150 + 100 = 350. "  # wrong: should be 250
+    )
+    discrepancies = scanner.scan(page=0, text=text)
+    assert len(discrepancies) == 1
+    assert discrepancies[0].expected == "250"
+
+
+# ---------------------------------------------------------------------------
+# Total-then-addends: "Total: X (A + B + C)"
+# ---------------------------------------------------------------------------
+
+
+def test_correct_total_then_addends(scanner: ArithmeticScanner) -> None:
+    text = "Grand Total: 750 (300 + 250 + 200)"
+    assert scanner.scan(page=0, text=text) == []
+
+
+def test_wrong_total_then_addends(scanner: ArithmeticScanner) -> None:
+    text = "Grand Total: 900 (300 + 250 + 200)"  # addends sum to 750
+    discrepancies = scanner.scan(page=0, text=text)
+    assert len(discrepancies) == 1
+    d = discrepancies[0]
+    assert d.stated == "900"
+    assert d.expected == "750"
+
+
+def test_total_keyword_variations(scanner: ArithmeticScanner) -> None:
+    """The pattern must work for 'Sum', 'Subtotal', 'Grand Total' etc."""
+    cases = [
+        ("Sum: 600 (200 + 200 + 200)", True),
+        ("Subtotal: 600 (200 + 200 + 200)", True),
+        ("Total: 999 (200 + 200 + 200)", False),  # wrong
+    ]
+    for text, should_be_clean in cases:
+        result = scanner.scan(page=0, text=text)
+        if should_be_clean:
+            assert result == [], f"Expected clean for: {text!r}"
+        else:
+            assert len(result) == 1, f"Expected error for: {text!r}"
+
+
+# ---------------------------------------------------------------------------
+# Edge cases
+# ---------------------------------------------------------------------------
+
+
+def test_no_expressions_in_text(scanner: ArithmeticScanner) -> None:
+    text = "This paragraph discusses revenue trends but contains no arithmetic."
+    assert scanner.scan(page=0, text=text) == []
+
+
+def test_empty_text(scanner: ArithmeticScanner) -> None:
+    assert scanner.scan(page=0, text="") == []
+
+
+def test_leading_negative_expression(scanner: ArithmeticScanner) -> None:
+    """Expressions starting with a negative number should evaluate correctly."""
+    text = "Adjustment: -100 + 250 = 150"
+    assert scanner.scan(page=0, text=text) == []
+
+
+def test_leading_negative_wrong(scanner: ArithmeticScanner) -> None:
+    text = "Adjustment: -100 + 250 = 200"  # should be 150
+    discrepancies = scanner.scan(page=0, text=text)
+    assert len(discrepancies) == 1
+    assert discrepancies[0].expected == "150"
diff --git a/engine/tests/ledger/test_figure_tracker.py b/engine/tests/ledger/test_figure_tracker.py
new file mode 100644
index 0000000000..fec3050628
--- /dev/null
+++ b/engine/tests/ledger/test_figure_tracker.py
@@ -0,0 +1,100 @@
+"""
+FigureTracker — unit tests.
+
+Tests that named figures are correctly accumulated and that conflicting
+sightings (same label, different value) are surfaced as consistency warnings.
+"""
+
+from decimal import Decimal
+
+import pytest
+
+from stirling.agents.ledger.validators.figures import FigureTracker
+
+
+@pytest.fixture
+def tracker() -> FigureTracker:
+    return FigureTracker(tolerance=Decimal("0.01"))
+
+
+# ---------------------------------------------------------------------------
+# No conflicts
+# ---------------------------------------------------------------------------
+
+
+def test_no_conflicts_single_figure(tracker: FigureTracker) -> None:
+    tracker.record("Net Profit", Decimal("1200.00"), page=3, raw="£1,200.00")
+    assert tracker.conflicts() == []
+
+
+def test_no_conflicts_consistent_figure(tracker: FigureTracker) -> None:
+    """The same figure cited identically on two pages must not raise a conflict."""
+    tracker.record("Total Revenue", Decimal("5000.00"), page=1, raw="£5,000")
+    tracker.record("Total Revenue", Decimal("5000.00"), page=8, raw="£5,000")
+    assert tracker.conflicts() == []
+
+
+def test_no_conflicts_within_tolerance(tracker: FigureTracker) -> None:
+    """A difference within tolerance must not be flagged."""
+    tracker.record("VAT", Decimal("100.00"), page=2, raw="£100.00")
+    tracker.record("VAT", Decimal("100.005"), page=5, raw="£100.005")
+    assert tracker.conflicts() == []
+
+
+# ---------------------------------------------------------------------------
+# Conflicts
+# ---------------------------------------------------------------------------
+
+
+def test_conflict_different_values(tracker: FigureTracker) -> None:
+    """Same label, different value on two pages → one consistency warning."""
+    tracker.record("Net Profit", Decimal("1200.00"), page=3, raw="£1,200")
+    tracker.record("Net Profit", Decimal("1250.00"), page=7, raw="£1,250")
+    conflicts = tracker.conflicts()
+    assert len(conflicts) == 1
+    d = conflicts[0]
+    assert d.kind == "consistency"
+    assert d.severity == "warning"
+    assert d.page == 7  # later occurrence is flagged
+
+
+def test_conflict_three_sightings_two_values(tracker: FigureTracker) -> None:
+    """Three sightings where one differs from canonical → 1 conflict."""
+    tracker.record("Revenue", Decimal("1000"), page=1, raw="£1,000")
+    tracker.record("Revenue", Decimal("1000"), page=3, raw="£1,000")
+    tracker.record("Revenue", Decimal("999"), page=5, raw="£999")
+    conflicts = tracker.conflicts()
+    # Canonical=p1 (1000). p3 matches, p5 differs → 1 conflict
+    assert len(conflicts) == 1
+    assert conflicts[0].page == 5
+
+
+# ---------------------------------------------------------------------------
+# Label normalisation
+# ---------------------------------------------------------------------------
+
+
+def test_label_normalisation_case_insensitive(tracker: FigureTracker) -> None:
+    """Labels must be compared case-insensitively."""
+    tracker.record("Net Profit", Decimal("1200"), page=2, raw="1200")
+    tracker.record("net profit", Decimal("1100"), page=4, raw="1100")
+    assert len(tracker.conflicts()) == 1
+
+
+def test_label_normalisation_punctuation(tracker: FigureTracker) -> None:
+    """Colons and dashes in labels must be normalised before comparison."""
+    tracker.record("Total Revenue:", Decimal("5000"), page=1, raw="5000")
+    tracker.record("Total Revenue —", Decimal("4000"), page=9, raw="4000")
+    assert len(tracker.conflicts()) == 1
+
+
+# ---------------------------------------------------------------------------
+# Entry count
+# ---------------------------------------------------------------------------
+
+
+def test_entry_count(tracker: FigureTracker) -> None:
+    tracker.record("A", Decimal("1"), page=0, raw="1")
+    tracker.record("A", Decimal("1"), page=1, raw="1")
+    tracker.record("B", Decimal("2"), page=2, raw="2")
+    assert tracker.entry_count == 3
diff --git a/engine/tests/ledger/test_formula_evaluator.py b/engine/tests/ledger/test_formula_evaluator.py
new file mode 100644
index 0000000000..1cf5a254d2
--- /dev/null
+++ b/engine/tests/ledger/test_formula_evaluator.py
@@ -0,0 +1,205 @@
+"""
+FormulaEvaluator — unit tests.
+
+Tests cover:
+  - Operator precedence (* / before + -)
+  - Column reference replacement (colN with word boundaries)
+  - Negative number handling
+  - each_row, column_total, and single_cell scopes
+"""
+
+from decimal import Decimal
+
+import pytest
+
+from stirling.agents.ledger.validators.formula import FormulaEvaluator
+
+
+@pytest.fixture
+def evaluator() -> FormulaEvaluator:
+    return FormulaEvaluator(tolerance=Decimal("0.01"))
+
+
+# ---------------------------------------------------------------------------
+# _safe_eval — operator precedence
+# ---------------------------------------------------------------------------
+
+
+def test_safe_eval_addition(evaluator: FormulaEvaluator) -> None:
+    assert evaluator._safe_eval("2 + 3") == Decimal("5")
+
+
+def test_safe_eval_multiplication_before_addition(evaluator: FormulaEvaluator) -> None:
+    """2 + 3 * 4 should be 14, not 20."""
+    assert evaluator._safe_eval("2 + 3 * 4") == Decimal("14")
+
+
+def test_safe_eval_division_before_subtraction(evaluator: FormulaEvaluator) -> None:
+    """10 - 6 / 2 should be 7, not 2."""
+    assert evaluator._safe_eval("10 - 6 / 2") == Decimal("7")
+
+
+def test_safe_eval_mixed_precedence(evaluator: FormulaEvaluator) -> None:
+    """1 + 2 * 3 - 4 / 2 should be 1 + 6 - 2 = 5."""
+    assert evaluator._safe_eval("1 + 2 * 3 - 4 / 2") == Decimal("5")
+
+
+def test_safe_eval_all_multiplication(evaluator: FormulaEvaluator) -> None:
+    assert evaluator._safe_eval("2 * 3 * 4") == Decimal("24")
+
+
+def test_safe_eval_division_by_zero(evaluator: FormulaEvaluator) -> None:
+    assert evaluator._safe_eval("10 / 0") is None
+
+
+def test_safe_eval_negative_result(evaluator: FormulaEvaluator) -> None:
+    assert evaluator._safe_eval("3 - 5") == Decimal("-2")
+
+
+def test_safe_eval_leading_negative(evaluator: FormulaEvaluator) -> None:
+    """Expressions starting with a negative number should work."""
+    result = evaluator._safe_eval("-100 + 200")
+    assert result == Decimal("100")
+
+
+def test_safe_eval_empty(evaluator: FormulaEvaluator) -> None:
+    assert evaluator._safe_eval("") is None
+
+
+def test_safe_eval_single_number(evaluator: FormulaEvaluator) -> None:
+    assert evaluator._safe_eval("42") == Decimal("42")
+
+
+def test_safe_eval_decimal_numbers(evaluator: FormulaEvaluator) -> None:
+    result = evaluator._safe_eval("1.5 * 2 + 0.5")
+    assert result == Decimal("3.5")
+
+
+# ---------------------------------------------------------------------------
+# colN replacement — word boundary safety
+# ---------------------------------------------------------------------------
+
+
+def test_col1_does_not_corrupt_col12(evaluator: FormulaEvaluator) -> None:
+    """col1 replacement must not alter col12."""
+    csv = "a,b,c,d,e,f,g,h,i,j,k,l,m\n0,10,0,0,0,0,0,0,0,0,0,0,120\n"
+    # col1=10, col12=120 → col12 - col1 should be 110
+    result = evaluator.evaluate(
+        page=0,
+        table_csv=csv,
+        formula="col0 = col12 - col1",
+        scope="each_row",
+        description="test",
+    )
+    # row 1: col0=0, expected=120-10=110 → discrepancy
+    assert len(result) == 1
+    assert result[0].expected == "110"
+
+
+def test_col_replacement_adjacent_columns(evaluator: FormulaEvaluator) -> None:
+    """col1 and col10 should both be replaced correctly."""
+    csv = "a,b,c,d,e,f,g,h,i,j,k\n55,5,0,0,0,0,0,0,0,0,50\n"
+    # col0=55, col1=5, col10=50 → col1 + col10 = 55
+    result = evaluator.evaluate(
+        page=0,
+        table_csv=csv,
+        formula="col0 = col1 + col10",
+        scope="each_row",
+        description="test",
+    )
+    assert result == []  # 5 + 50 = 55, matches col0
+
+
+# ---------------------------------------------------------------------------
+# each_row scope
+# ---------------------------------------------------------------------------
+
+
+def test_each_row_correct(evaluator: FormulaEvaluator) -> None:
+    csv = "Item,Qty,Price,Total\nWidget,10,5,50\nGadget,3,20,60\n"
+    result = evaluator.evaluate(
+        page=0,
+        table_csv=csv,
+        formula="col3 = col1 * col2",
+        scope="each_row",
+        description="unit price check",
+    )
+    assert result == []
+
+
+def test_each_row_error(evaluator: FormulaEvaluator) -> None:
+    csv = "Item,Qty,Price,Total\nWidget,10,5,50\nGadget,3,20,99\n"
+    result = evaluator.evaluate(
+        page=0,
+        table_csv=csv,
+        formula="col3 = col1 * col2",
+        scope="each_row",
+        description="unit price check",
+    )
+    assert len(result) == 1
+    assert result[0].expected == "60"
+    assert result[0].stated == "99"
+
+
+# ---------------------------------------------------------------------------
+# column_total scope
+# ---------------------------------------------------------------------------
+
+
+def test_column_total_correct(evaluator: FormulaEvaluator) -> None:
+    csv = "Name,Amount\nA,100\nB,200\nTotal,300\n"
+    result = evaluator.evaluate(
+        page=0,
+        table_csv=csv,
+        formula="sum",
+        scope="column_total",
+        description="total check",
+        target_row=3,
+        target_col=1,
+    )
+    assert result == []
+
+
+def test_column_total_error(evaluator: FormulaEvaluator) -> None:
+    csv = "Name,Amount\nA,100\nB,200\nTotal,400\n"
+    result = evaluator.evaluate(
+        page=0,
+        table_csv=csv,
+        formula="sum",
+        scope="column_total",
+        description="total check",
+        target_row=3,
+        target_col=1,
+    )
+    assert len(result) == 1
+    assert result[0].expected == "300"
+
+
+# ---------------------------------------------------------------------------
+# single_cell scope
+# ---------------------------------------------------------------------------
+
+
+def test_single_cell_correct(evaluator: FormulaEvaluator) -> None:
+    csv = "A,B,C\n10,20,30\n5,15,20\n15,35,50\n"
+    result = evaluator.evaluate(
+        page=0,
+        table_csv=csv,
+        formula="cell(3,2) = cell(1,2) + cell(2,2)",
+        scope="single_cell",
+        description="grand total",
+    )
+    assert result == []
+
+
+def test_single_cell_error(evaluator: FormulaEvaluator) -> None:
+    csv = "A,B,C\n10,20,30\n5,15,20\n15,35,99\n"
+    result = evaluator.evaluate(
+        page=0,
+        table_csv=csv,
+        formula="cell(3,2) = cell(1,2) + cell(2,2)",
+        scope="single_cell",
+        description="grand total",
+    )
+    assert len(result) == 1
+    assert result[0].expected == "50"
diff --git a/engine/tests/ledger/test_models.py b/engine/tests/ledger/test_models.py
new file mode 100644
index 0000000000..98b0ef9c85
--- /dev/null
+++ b/engine/tests/ledger/test_models.py
@@ -0,0 +1,144 @@
+"""
+Ledger models — unit tests for serialisation and business logic.
+
+These tests confirm the wire contract: models round-trip through JSON
+correctly and their helper properties behave as documented.
+"""
+
+import pytest
+from pydantic import ValidationError
+
+from stirling.contracts.ledger import (
+    Discrepancy,
+    DiscrepancyKind,
+    Evidence,
+    Folio,
+    FolioManifest,
+    FolioType,
+    Requisition,
+    Severity,
+    Verdict,
+)
+
+# ---------------------------------------------------------------------------
+# FolioManifest
+# ---------------------------------------------------------------------------
+
+
+def test_folio_manifest_round_trip() -> None:
+    manifest = FolioManifest(
+        session_id="abc-123",
+        page_count=3,
+        folio_types=[FolioType.TEXT, FolioType.IMAGE, FolioType.MIXED],
+    )
+    reloaded = FolioManifest.model_validate_json(manifest.model_dump_json())
+    assert reloaded == manifest
+
+
+def test_folio_manifest_round_bounds() -> None:
+    with pytest.raises(ValidationError):
+        FolioManifest(session_id="x", page_count=1, folio_types=[FolioType.TEXT], round=0)
+    with pytest.raises(ValidationError):
+        FolioManifest(session_id="x", page_count=1, folio_types=[FolioType.TEXT], round=4)
+
+
+# ---------------------------------------------------------------------------
+# Requisition
+# ---------------------------------------------------------------------------
+
+
+def test_requisition_empty() -> None:
+    req = Requisition(rationale="nothing needed")
+    assert req.need_text == []
+    assert req.need_tables == []
+    assert req.need_ocr == []
+
+
+def test_requisition_type_discriminator() -> None:
+    req = Requisition(need_text=[0, 1], rationale="needs text")
+    assert req.type == "requisition"
+
+
+# ---------------------------------------------------------------------------
+# Folio.readable_text
+# ---------------------------------------------------------------------------
+
+
+def test_folio_readable_text_prefers_ocr() -> None:
+    folio = Folio(page=0, text="digital text", ocr_text="ocr text")
+    assert folio.readable_text == "ocr text"
+
+
+def test_folio_readable_text_falls_back_to_text() -> None:
+    folio = Folio(page=0, text="digital text")
+    assert folio.readable_text == "digital text"
+
+
+def test_folio_readable_text_empty_when_none() -> None:
+    folio = Folio(page=0)
+    assert folio.readable_text == ""
+
+
+# ---------------------------------------------------------------------------
+# Verdict
+# ---------------------------------------------------------------------------
+
+
+def test_verdict_clean_flag() -> None:
+    verdict = Verdict(
+        session_id="s1",
+        discrepancies=[],
+        pages_examined=[0, 1],
+        rounds_taken=2,
+        summary="All figures balance.",
+        clean=True,
+    )
+    assert verdict.error_count == 0
+    assert verdict.warning_count == 0
+    assert verdict.clean is True
+
+
+def test_verdict_error_and_warning_counts() -> None:
+    discrepancies = [
+        Discrepancy(
+            page=0,
+            kind=DiscrepancyKind.TALLY,
+            severity=Severity.ERROR,
+            description="bad sum",
+            stated="100",
+            expected="110",
+        ),
+        Discrepancy(
+            page=1,
+            kind=DiscrepancyKind.CONSISTENCY,
+            severity=Severity.WARNING,
+            description="mismatched figure",
+            stated="500",
+            expected="550",
+        ),
+    ]
+    verdict = Verdict(
+        session_id="s1",
+        discrepancies=discrepancies,
+        pages_examined=[0, 1],
+        rounds_taken=1,
+        summary="Issues found.",
+        clean=False,
+    )
+    assert verdict.error_count == 1
+    assert verdict.warning_count == 1
+
+
+# ---------------------------------------------------------------------------
+# Evidence.final_round
+# ---------------------------------------------------------------------------
+
+
+def test_evidence_final_round() -> None:
+    evidence = Evidence(
+        session_id="s",
+        folios=[Folio(page=0, text="hello")],
+        round=3,
+        final_round=True,
+    )
+    assert evidence.final_round is True
diff --git a/engine/tests/ledger/test_routes.py b/engine/tests/ledger/test_routes.py
new file mode 100644
index 0000000000..ca322a6364
--- /dev/null
+++ b/engine/tests/ledger/test_routes.py
@@ -0,0 +1,243 @@
+"""
+Ledger Auditor — FastAPI route tests.
+
+Uses FastAPI's TestClient with dependency overrides. All LLM calls are
+mocked out; these tests exercise HTTP parsing, serialisation, and response
+enveloping only — not the agent's reasoning.
+"""
+
+from __future__ import annotations
+
+from collections.abc import Iterator
+from decimal import Decimal
+
+import pytest
+from fastapi.testclient import TestClient
+
+from stirling.api import app
+from stirling.api.dependencies import get_math_auditor_agent
+from stirling.config import AppSettings, load_settings
+from stirling.contracts.ledger import (
+    Discrepancy,
+    DiscrepancyKind,
+    Evidence,
+    FolioManifest,
+    Requisition,
+    Severity,
+    Verdict,
+)
+
+# ---------------------------------------------------------------------------
+# Stubs
+# ---------------------------------------------------------------------------
+
+
+class StubSettingsProvider:
+    def __call__(self) -> AppSettings:
+        from conftest import build_app_settings
+
+        return build_app_settings()
+
+
+class StubLedgerAgent:
+    """Stub that returns canned responses without touching any model."""
+
+    def __init__(
+        self,
+        requisition: Requisition | None = None,
+        verdict: Verdict | None = None,
+    ) -> None:
+        self._requisition = requisition or _stub_requisition()
+        self._verdict = verdict or _stub_verdict()
+        self.examine_calls: list[FolioManifest] = []
+        self.audit_calls: list[tuple[Evidence, Decimal]] = []
+
+    async def examine(self, manifest: FolioManifest) -> Requisition:
+        self.examine_calls.append(manifest)
+        return self._requisition
+
+    async def audit(self, evidence: Evidence, tolerance: Decimal = Decimal("0.01")) -> Verdict:
+        self.audit_calls.append((evidence, tolerance))
+        return self._verdict
+
+
+# ---------------------------------------------------------------------------
+# Helpers
+# ---------------------------------------------------------------------------
+
+
+def _stub_requisition() -> Requisition:
+    return Requisition(
+        need_text=[0, 2],
+        need_tables=[0],
+        need_ocr=[1],
+        rationale="Page 1 is image-only; pages 0 and 2 have financial text.",
+    )
+
+
+def _stub_verdict(
+    clean: bool = True,
+    discrepancies: list[Discrepancy] | None = None,
+) -> Verdict:
+    return Verdict(
+        session_id="test-session",
+        discrepancies=discrepancies or [],
+        pages_examined=[0, 2],
+        rounds_taken=2,
+        summary="No errors found." if clean else "1 tally error found.",
+        clean=clean,
+    )
+
+
+def _manifest_body(**overrides: object) -> dict[str, object]:
+    base: dict[str, object] = {
+        "sessionId": "test-session",
+        "pageCount": 3,
+        "folioTypes": ["text", "image", "mixed"],
+        "round": 1,
+    }
+    return {**base, **overrides}
+
+
+def _evidence_body(**overrides: object) -> dict[str, object]:
+    base: dict[str, object] = {
+        "sessionId": "test-session",
+        "folios": [
+            {"page": 0, "text": "Fee: £100\nTax: £20\nTotal: £120"},
+            {"page": 2, "text": "Summary: all tallies correct"},
+        ],
+        "round": 2,
+        "finalRound": False,
+    }
+    return {**base, **overrides}
+
+
+# ---------------------------------------------------------------------------
+# Fixtures
+# ---------------------------------------------------------------------------
+
+
+@pytest.fixture
+def stub_agent() -> StubLedgerAgent:
+    return StubLedgerAgent()
+
+
+@pytest.fixture
+def client(stub_agent: StubLedgerAgent) -> Iterator[TestClient]:
+    app.dependency_overrides[load_settings] = StubSettingsProvider()
+    app.dependency_overrides[get_math_auditor_agent] = lambda: stub_agent
+    yield TestClient(app, raise_server_exceptions=False)
+    app.dependency_overrides.pop(load_settings, None)
+    app.dependency_overrides.pop(get_math_auditor_agent, None)
+
+
+# ---------------------------------------------------------------------------
+# POST /api/v1/ai/math-auditor-agent/examine
+# ---------------------------------------------------------------------------
+
+
+class TestExamineEndpoint:
+    """Tests for POST /api/v1/ai/math-auditor-agent/examine."""
+
+    def test_returns_200(self, client: TestClient) -> None:
+        resp = client.post("/api/v1/ai/math-auditor-agent/examine", json=_manifest_body())
+        assert resp.status_code == 200
+
+    def test_response_is_requisition(self, client: TestClient) -> None:
+        resp = client.post("/api/v1/ai/math-auditor-agent/examine", json=_manifest_body())
+        body = resp.json()
+        assert body["type"] == "requisition"
+        assert body["needText"] == [0, 2]
+        assert body["needTables"] == [0]
+        assert body["needOcr"] == [1]
+        assert "rationale" in body
+
+    def test_examine_called_with_parsed_manifest(
+        self,
+        client: TestClient,
+        stub_agent: StubLedgerAgent,
+    ) -> None:
+        client.post("/api/v1/ai/math-auditor-agent/examine", json=_manifest_body(sessionId="my-session", pageCount=3))
+        assert len(stub_agent.examine_calls) == 1
+        manifest = stub_agent.examine_calls[0]
+        assert manifest.session_id == "my-session"
+        assert manifest.page_count == 3
+
+    def test_content_type_is_json(self, client: TestClient) -> None:
+        resp = client.post("/api/v1/ai/math-auditor-agent/examine", json=_manifest_body())
+        assert "application/json" in resp.headers["content-type"]
+
+
+# ---------------------------------------------------------------------------
+# POST /api/v1/ai/math-auditor-agent/deliberate
+# ---------------------------------------------------------------------------
+
+
+class TestDeliberateEndpoint:
+    """Tests for POST /api/v1/ai/math-auditor-agent/deliberate."""
+
+    def test_returns_200_clean(self, client: TestClient) -> None:
+        resp = client.post("/api/v1/ai/math-auditor-agent/deliberate", json=_evidence_body())
+        assert resp.status_code == 200
+
+    def test_response_is_verdict(self, client: TestClient) -> None:
+        resp = client.post("/api/v1/ai/math-auditor-agent/deliberate", json=_evidence_body())
+        body = resp.json()
+        assert body["type"] == "verdict"
+        assert body["clean"] is True
+
+    def test_discrepancies_serialised(self, client: TestClient) -> None:
+        d = Discrepancy(
+            page=0,
+            kind=DiscrepancyKind.TALLY,
+            severity=Severity.ERROR,
+            description="Column total wrong",
+            stated="250",
+            expected="300",
+        )
+        stub = StubLedgerAgent(verdict=_stub_verdict(clean=False, discrepancies=[d]))
+        app.dependency_overrides[get_math_auditor_agent] = lambda: stub
+        resp = client.post("/api/v1/ai/math-auditor-agent/deliberate", json=_evidence_body())
+        body = resp.json()
+        discrepancies = body["discrepancies"]
+        assert len(discrepancies) == 1
+        assert discrepancies[0]["kind"] == "tally"
+        assert discrepancies[0]["severity"] == "error"
+        assert discrepancies[0]["stated"] == "250"
+        assert discrepancies[0]["expected"] == "300"
+
+    def test_tolerance_query_param_forwarded(
+        self,
+        client: TestClient,
+        stub_agent: StubLedgerAgent,
+    ) -> None:
+        client.post("/api/v1/ai/math-auditor-agent/deliberate?tolerance=0.05", json=_evidence_body())
+        assert len(stub_agent.audit_calls) == 1
+        _, tolerance = stub_agent.audit_calls[0]
+        assert tolerance == Decimal("0.05")
+
+    def test_default_tolerance_when_omitted(
+        self,
+        client: TestClient,
+        stub_agent: StubLedgerAgent,
+    ) -> None:
+        client.post("/api/v1/ai/math-auditor-agent/deliberate", json=_evidence_body())
+        _, tolerance = stub_agent.audit_calls[0]
+        assert tolerance == Decimal("0.01")
+
+    def test_invalid_tolerance_returns_400(
+        self,
+        client: TestClient,
+        stub_agent: StubLedgerAgent,
+    ) -> None:
+        resp = client.post("/api/v1/ai/math-auditor-agent/deliberate?tolerance=notanumber", json=_evidence_body())
+        assert resp.status_code == 400
+
+    def test_final_round_flag_parsed(
+        self,
+        client: TestClient,
+        stub_agent: StubLedgerAgent,
+    ) -> None:
+        client.post("/api/v1/ai/math-auditor-agent/deliberate", json=_evidence_body(finalRound=True))
+        evidence, _ = stub_agent.audit_calls[0]
+        assert evidence.final_round is True
diff --git a/engine/tests/test_pdf_edit_agent.py b/engine/tests/test_pdf_edit_agent.py
index e78b1b9255..fdbeb722ee 100644
--- a/engine/tests/test_pdf_edit_agent.py
+++ b/engine/tests/test_pdf_edit_agent.py
@@ -5,7 +5,6 @@ from dataclasses import dataclass
 import pytest
 
 from stirling.agents import PdfEditAgent, PdfEditParameterSelector, PdfEditPlanSelection
-from stirling.config import AppSettings
 from stirling.contracts import (
     EditCannotDoResponse,
     EditClarificationRequest,
@@ -13,23 +12,14 @@ from stirling.contracts import (
     PdfEditRequest,
     ToolOperationStep,
 )
-from stirling.models.tool_models import CompressParams, OperationId, RotateParams
-from stirling.services import build_runtime
-
-
-def build_test_settings() -> AppSettings:
-    return AppSettings(
-        smart_model_name="test",
-        fast_model_name="test",
-        smart_model_max_tokens=8192,
-        fast_model_max_tokens=2048,
-    )
+from stirling.models.tool_models import Angle, FlattenParams, RotatePdfParams, ToolEndpoint
+from stirling.services.runtime import AppRuntime
 
 
 @dataclass(frozen=True)
 class ParameterSelectorCall:
     request: PdfEditRequest
-    operation_plan: list[OperationId]
+    operation_plan: list[ToolEndpoint]
     operation_index: int
     generated_steps: list[ToolOperationStep]
 
@@ -41,10 +31,10 @@ class RecordingParameterSelector:
     async def select(
         self,
         request: PdfEditRequest,
-        operation_plan: list[OperationId],
+        operation_plan: list[ToolEndpoint],
         operation_index: int,
         generated_steps: list[ToolOperationStep],
-    ) -> RotateParams | CompressParams:
+    ) -> RotatePdfParams | FlattenParams:
         self.calls.append(
             ParameterSelectorCall(
                 request=request,
@@ -54,17 +44,18 @@ class RecordingParameterSelector:
             )
         )
         if operation_index == 0:
-            return RotateParams(angle=90)
-        return CompressParams(compression_level=5)
+            return RotatePdfParams(angle=Angle(90))
+        return FlattenParams(flatten_only_forms=False, render_dpi=None)
 
 
 class StubPdfEditAgent(PdfEditAgent):
     def __init__(
         self,
+        runtime: AppRuntime,
         selection: PdfEditPlanSelection | EditClarificationRequest | EditCannotDoResponse,
         parameter_selector: RecordingParameterSelector | PdfEditParameterSelector | None = None,
     ) -> None:
-        super().__init__(build_runtime(build_test_settings()))
+        super().__init__(runtime)
         self.selection = selection
         if parameter_selector is not None:
             self.parameter_selector = parameter_selector
@@ -77,11 +68,12 @@ class StubPdfEditAgent(PdfEditAgent):
 
 
 @pytest.mark.anyio
-async def test_pdf_edit_agent_builds_multi_step_plan() -> None:
+async def test_pdf_edit_agent_builds_multi_step_plan(runtime: AppRuntime) -> None:
     parameter_selector = RecordingParameterSelector()
     agent = StubPdfEditAgent(
+        runtime,
         PdfEditPlanSelection(
-            operations=[OperationId.ROTATE, OperationId.COMPRESS],
+            operations=[ToolEndpoint.ROTATE_PDF, ToolEndpoint.FLATTEN],
             summary="Rotate the PDF, then compress it.",
             rationale="The pages need reorientation before reducing file size.",
         ),
@@ -98,17 +90,18 @@ async def test_pdf_edit_agent_builds_multi_step_plan() -> None:
     assert isinstance(response, EditPlanResponse)
     assert response.summary == "Rotate the PDF, then compress it."
     assert response.rationale == "The pages need reorientation before reducing file size."
-    assert [step.tool for step in response.steps] == [OperationId.ROTATE, OperationId.COMPRESS]
-    assert isinstance(response.steps[0].parameters, RotateParams)
-    assert isinstance(response.steps[1].parameters, CompressParams)
+    assert [step.tool for step in response.steps] == [ToolEndpoint.ROTATE_PDF, ToolEndpoint.FLATTEN]
+    assert isinstance(response.steps[0].parameters, RotatePdfParams)
+    assert isinstance(response.steps[1].parameters, FlattenParams)
 
 
 @pytest.mark.anyio
-async def test_pdf_edit_agent_passes_previous_steps_to_parameter_selector() -> None:
+async def test_pdf_edit_agent_passes_previous_steps_to_parameter_selector(runtime: AppRuntime) -> None:
     parameter_selector = RecordingParameterSelector()
     agent = StubPdfEditAgent(
+        runtime,
         PdfEditPlanSelection(
-            operations=[OperationId.ROTATE, OperationId.COMPRESS],
+            operations=[ToolEndpoint.ROTATE_PDF, ToolEndpoint.FLATTEN],
             summary="Rotate the PDF, then compress it.",
         ),
         parameter_selector=parameter_selector,
@@ -127,19 +120,20 @@ async def test_pdf_edit_agent_passes_previous_steps_to_parameter_selector() -> N
     assert parameter_selector.calls[1].operation_index == 1
     assert parameter_selector.calls[1].generated_steps == [
         ToolOperationStep(
-            tool=OperationId.ROTATE,
-            parameters=RotateParams(angle=90),
+            tool=ToolEndpoint.ROTATE_PDF,
+            parameters=RotatePdfParams(angle=Angle(90)),
         )
     ]
 
 
 @pytest.mark.anyio
-async def test_pdf_edit_agent_returns_clarification_without_partial_plan() -> None:
+async def test_pdf_edit_agent_returns_clarification_without_partial_plan(runtime: AppRuntime) -> None:
     agent = StubPdfEditAgent(
+        runtime,
         EditClarificationRequest(
             question="Which pages should be rotated?",
             reason="The request does not say which pages to change.",
-        )
+        ),
     )
 
     response = await agent.handle(PdfEditRequest(user_message="Rotate some pages."))
@@ -148,11 +142,12 @@ async def test_pdf_edit_agent_returns_clarification_without_partial_plan() -> No
 
 
 @pytest.mark.anyio
-async def test_pdf_edit_agent_returns_cannot_do_without_partial_plan() -> None:
+async def test_pdf_edit_agent_returns_cannot_do_without_partial_plan(runtime: AppRuntime) -> None:
     agent = StubPdfEditAgent(
+        runtime,
         EditCannotDoResponse(
             reason="This request requires OCR, which is not part of PDF edit planning.",
-        )
+        ),
     )
 
     response = await agent.handle(PdfEditRequest(user_message="Read this scan and summarize it."))
diff --git a/engine/tests/test_pdf_question_agent.py b/engine/tests/test_pdf_question_agent.py
index 52df9474ce..b284870b76 100644
--- a/engine/tests/test_pdf_question_agent.py
+++ b/engine/tests/test_pdf_question_agent.py
@@ -3,19 +3,20 @@ from __future__ import annotations
 import pytest
 
 from stirling.agents import PdfQuestionAgent
-from stirling.config import AppSettings
 from stirling.contracts import (
+    ExtractedFileText,
     PdfQuestionAnswerResponse,
-    PdfQuestionNeedTextResponse,
+    PdfQuestionNeedContentResponse,
     PdfQuestionNotFoundResponse,
     PdfQuestionRequest,
+    PdfTextSelection,
 )
-from stirling.services import build_runtime
+from stirling.services.runtime import AppRuntime
 
 
 class StubPdfQuestionAgent(PdfQuestionAgent):
-    def __init__(self, response: PdfQuestionAnswerResponse | PdfQuestionNotFoundResponse) -> None:
-        super().__init__(build_runtime(build_test_settings()))
+    def __init__(self, runtime: AppRuntime, response: PdfQuestionAnswerResponse | PdfQuestionNotFoundResponse) -> None:
+        super().__init__(runtime)
         self.response = response
 
     async def _run_answer_agent(
@@ -25,38 +26,39 @@ class StubPdfQuestionAgent(PdfQuestionAgent):
         return self.response
 
 
-def build_test_settings() -> AppSettings:
-    return AppSettings(
-        smart_model_name="test",
-        fast_model_name="test",
-        smart_model_max_tokens=8192,
-        fast_model_max_tokens=2048,
+def invoice_page() -> ExtractedFileText:
+    return ExtractedFileText(
+        file_name="invoice.pdf",
+        pages=[PdfTextSelection(page_number=1, text="Invoice total: 120.00")],
     )
 
 
 @pytest.mark.anyio
-async def test_pdf_question_agent_requires_extracted_text() -> None:
-    agent = PdfQuestionAgent(build_runtime(build_test_settings()))
+async def test_pdf_question_agent_requires_extracted_text(runtime: AppRuntime) -> None:
+    agent = PdfQuestionAgent(runtime)
 
-    response = await agent.handle(PdfQuestionRequest(question="What is the total?", extracted_text=""))
+    response = await agent.handle(
+        PdfQuestionRequest(question="What is the total?", page_text=[], file_names=["test.pdf"])
+    )
 
-    assert isinstance(response, PdfQuestionNeedTextResponse)
+    assert isinstance(response, PdfQuestionNeedContentResponse)
 
 
 @pytest.mark.anyio
-async def test_pdf_question_agent_returns_grounded_answer() -> None:
+async def test_pdf_question_agent_returns_grounded_answer(runtime: AppRuntime) -> None:
     agent = StubPdfQuestionAgent(
+        runtime,
         PdfQuestionAnswerResponse(
             answer="The invoice total is 120.00.",
-            evidence=["Invoice total: 120.00"],
-        )
+            evidence=[invoice_page()],
+        ),
     )
 
     response = await agent.handle(
         PdfQuestionRequest(
             question="What is the total?",
-            extracted_text="Invoice total: 120.00",
-            file_name="invoice.pdf",
+            page_text=[invoice_page()],
+            file_names=["invoice.pdf"],
         )
     )
 
@@ -65,14 +67,19 @@ async def test_pdf_question_agent_returns_grounded_answer() -> None:
 
 
 @pytest.mark.anyio
-async def test_pdf_question_agent_returns_not_found_when_text_is_insufficient() -> None:
-    agent = StubPdfQuestionAgent(PdfQuestionNotFoundResponse(reason="The answer is not present in the text."))
+async def test_pdf_question_agent_returns_not_found_when_text_is_insufficient(runtime: AppRuntime) -> None:
+    agent = StubPdfQuestionAgent(runtime, PdfQuestionNotFoundResponse(reason="The answer is not present in the text."))
 
     response = await agent.handle(
         PdfQuestionRequest(
             question="What is the total?",
-            extracted_text="This page contains only a shipping address.",
-            file_name="invoice.pdf",
+            page_text=[
+                ExtractedFileText(
+                    file_name="invoice.pdf",
+                    pages=[PdfTextSelection(page_number=1, text="This page contains only a shipping address.")],
+                )
+            ],
+            file_names=["invoice.pdf"],
         )
     )
 
diff --git a/engine/tests/test_rag.py b/engine/tests/test_rag.py
new file mode 100644
index 0000000000..da1d524653
--- /dev/null
+++ b/engine/tests/test_rag.py
@@ -0,0 +1,283 @@
+from __future__ import annotations
+
+import pytest
+
+from stirling.rag.capability import RagCapability
+from stirling.rag.chunker import chunk_text
+from stirling.rag.service import RagService
+from stirling.rag.sqlite_vec_store import SqliteVecStore
+from stirling.rag.store import Document, SearchResult
+
+# ── chunk_text ──────────────────────────────────────────────────────────
+
+
+class TestChunkText:
+    def test_empty_input_returns_empty(self) -> None:
+        assert chunk_text("") == []
+        assert chunk_text("   ") == []
+
+    def test_short_text_returns_single_chunk(self) -> None:
+        text = "Hello world."
+        chunks = chunk_text(text, chunk_size=100)
+        assert len(chunks) == 1
+        assert chunks[0] == "Hello world."
+
+    def test_splits_on_paragraph_boundaries(self) -> None:
+        text = "First paragraph.\n\nSecond paragraph.\n\nThird paragraph."
+        chunks = chunk_text(text, chunk_size=30, overlap=0)
+        # Each paragraph fits in 30 chars, so they should be split
+        assert len(chunks) >= 2
+        assert "First paragraph." in chunks[0]
+
+    def test_long_text_produces_multiple_chunks(self) -> None:
+        text = " ".join(["word"] * 200)
+        chunks = chunk_text(text, chunk_size=100, overlap=10)
+        assert len(chunks) > 1
+        for chunk in chunks:
+            # Chunks may slightly exceed due to sentence boundary snapping
+            assert len(chunk) <= 200  # generous upper bound
+
+    def test_overlap_produces_shared_content(self) -> None:
+        sentences = [f"Sentence number {i}." for i in range(20)]
+        text = " ".join(sentences)
+        chunks = chunk_text(text, chunk_size=100, overlap=30)
+        if len(chunks) >= 2:
+            # After word-boundary snapping, the second chunk should share
+            # some content with the tail of the first chunk
+            words_in_first_tail = chunks[0].split()[-3:]  # last 3 words
+            overlap_text = " ".join(words_in_first_tail)
+            assert overlap_text in chunks[1], f"Expected overlap '{overlap_text}' in chunk[1]: '{chunks[1][:80]}...'"
+
+
+# ── SqliteVecStore ──────────────────────────────────────────────────────
+
+
+class TestSqliteVecStore:
+    """Each test gets its own ephemeral store to avoid cross-test dimension conflicts."""
+
+    @pytest.mark.anyio
+    async def test_add_and_search(self) -> None:
+        store = SqliteVecStore.ephemeral()
+        docs = [
+            Document(id="1", text="Python is a programming language", metadata={"source": "test"}),
+            Document(id="2", text="Java is another programming language", metadata={"source": "test"}),
+            Document(id="3", text="The weather today is sunny", metadata={"source": "test"}),
+        ]
+        # Simple 3-dimensional embeddings for testing
+        embeddings = [
+            [1.0, 0.0, 0.0],
+            [0.9, 0.1, 0.0],
+            [0.0, 0.0, 1.0],
+        ]
+        await store.add_documents("test-col", docs, embeddings)
+
+        # Search with a query close to the programming-related docs
+        results = await store.search("test-col", [1.0, 0.05, 0.0], top_k=2)
+        assert len(results) == 2
+        assert isinstance(results[0], SearchResult)
+        # The closest should be doc "1" (exact match on first dimension)
+        assert results[0].document.id == "1"
+        assert results[0].score > 0.5
+
+    @pytest.mark.anyio
+    async def test_list_and_has_collection(self) -> None:
+        store = SqliteVecStore.ephemeral()
+        docs = [Document(id="1", text="test", metadata={})]
+        await store.add_documents("my-collection", docs, [[1.0, 0.0]])
+
+        collections = await store.list_collections()
+        assert "my-collection" in collections
+        assert await store.has_collection("my-collection") is True
+        assert await store.has_collection("nonexistent") is False
+
+    @pytest.mark.anyio
+    async def test_delete_collection(self) -> None:
+        store = SqliteVecStore.ephemeral()
+        docs = [Document(id="1", text="test", metadata={})]
+        await store.add_documents("to-delete", docs, [[1.0]])
+
+        assert await store.has_collection("to-delete") is True
+        await store.delete_collection("to-delete")
+        assert await store.has_collection("to-delete") is False
+
+    @pytest.mark.anyio
+    async def test_search_empty_collection(self) -> None:
+        store = SqliteVecStore.ephemeral()
+        docs = [Document(id="1", text="test", metadata={})]
+        await store.add_documents("empty-test", docs, [[1.0, 0.0]])
+        results = await store.search("empty-test", [1.0, 0.0], top_k=5)
+        assert len(results) == 1
+
+    @pytest.mark.anyio
+    async def test_mismatched_docs_embeddings_raises(self) -> None:
+        store = SqliteVecStore.ephemeral()
+        docs = [Document(id="1", text="test", metadata={})]
+        with pytest.raises(ValueError, match="documents.*embeddings"):
+            await store.add_documents("bad", docs, [[1.0], [2.0]])
+
+
+# ── RagService (with stub embedder) ────────────────────────────────────
+
+
+class StubEmbeddingService:
+    """A minimal stub that returns fixed-dimension embeddings for testing."""
+
+    def __init__(self, dim: int = 8) -> None:
+        self._dim = dim
+
+    async def embed_query(self, text: str) -> list[float]:
+        # Deterministic embedding based on hash of text
+        h = hash(text) % 1000
+        return [(h + i) / 1000.0 for i in range(self._dim)]
+
+    async def embed_documents(self, texts: list[str]) -> list[list[float]]:
+        return [await self.embed_query(t) for t in texts]
+
+    def chunk_and_prepare(
+        self,
+        text: str,
+        source: str = "",
+        base_metadata: dict[str, str] | None = None,
+    ) -> list[Document]:
+        from stirling.rag.chunker import chunk_text
+
+        chunks = chunk_text(text, 100, 10)
+        docs = []
+        for i, chunk in enumerate(chunks):
+            meta = dict(base_metadata) if base_metadata else {}
+            meta["source"] = source
+            meta["chunk_index"] = str(i)
+            doc_id = f"{source}:chunk:{i}" if source else f"chunk:{i}"
+            docs.append(Document(id=doc_id, text=chunk, metadata=meta))
+        return docs
+
+
+@pytest.fixture
+def rag_service() -> RagService:
+    """Each RagService test gets its own fresh ephemeral store to avoid dimension conflicts."""
+    store = SqliteVecStore.ephemeral()
+    return RagService(embedder=StubEmbeddingService(), store=store, default_top_k=3)  # type: ignore[arg-type]
+
+
+class TestRagService:
+    @pytest.mark.anyio
+    async def test_index_and_search(self, rag_service: RagService) -> None:
+        text = "Python is great for data science. It has many libraries like pandas and numpy."
+        count = await rag_service.index_text("docs", text, source="guide.pdf")
+        assert count > 0
+
+        results = await rag_service.search("Python libraries", collection="docs")
+        assert len(results) > 0
+        assert results[0].document.text  # non-empty text
+
+    @pytest.mark.anyio
+    async def test_index_empty_text_returns_zero(self, rag_service: RagService) -> None:
+        count = await rag_service.index_text("docs", "", source="empty.pdf")
+        assert count == 0
+
+    @pytest.mark.anyio
+    async def test_search_nonexistent_collection_returns_empty(self, rag_service: RagService) -> None:
+        results = await rag_service.search("anything", collection="nonexistent")
+        assert results == []
+
+    @pytest.mark.anyio
+    async def test_search_all_collections(self, rag_service: RagService) -> None:
+        await rag_service.index_text("col-a", "Machine learning overview.", source="ml.pdf")
+        await rag_service.index_text("col-b", "Deep learning with neural networks.", source="dl.pdf")
+
+        results = await rag_service.search("neural networks")
+        assert len(results) > 0
+
+    @pytest.mark.anyio
+    async def test_delete_collection(self, rag_service: RagService) -> None:
+        await rag_service.index_text("temp", "Temporary data.", source="tmp.pdf")
+        collections = await rag_service.list_collections()
+        assert "temp" in collections
+
+        await rag_service.delete_collection("temp")
+        collections = await rag_service.list_collections()
+        assert "temp" not in collections
+
+
+# ── RagCapability ──────────────────────────────────────────────────────
+
+
+async def _invoke_search_knowledge(capability: RagCapability, query: str, max_results: int = 5) -> str:
+    """Extract and call the search_knowledge tool function from a RagCapability's toolset."""
+    from pydantic_ai import FunctionToolset
+
+    toolset = capability.toolset
+    assert isinstance(toolset, FunctionToolset)
+    tool = toolset.tools["search_knowledge"]
+    return await tool.function(query=query, max_results=max_results)  # type: ignore[call-arg] — pyright can't infer the generic tool function's kwargs
+
+
+class TestRagCapability:
+    def test_instructions_static_when_collections_pinned(self, rag_service: RagService) -> None:
+        cap = RagCapability(rag_service, collections=["docs", "manuals"])
+        instructions = cap.instructions
+        assert isinstance(instructions, str)
+        assert "docs, manuals" in instructions
+        assert "search_knowledge" in instructions
+
+    def test_instructions_dynamic_when_no_collections(self, rag_service: RagService) -> None:
+        cap = RagCapability(rag_service)
+        instructions = cap.instructions
+        assert callable(instructions)
+
+    @pytest.mark.anyio
+    async def test_dynamic_instructions_list_available_collections(self, rag_service: RagService) -> None:
+        await rag_service.index_text("col-a", "Alpha content.", source="a.pdf")
+        await rag_service.index_text("col-b", "Beta content.", source="b.pdf")
+        cap = RagCapability(rag_service)
+        instructions_fn = cap.instructions
+        assert callable(instructions_fn)
+        text = await instructions_fn()
+        assert "col-a" in text
+        assert "col-b" in text
+
+    @pytest.mark.anyio
+    async def test_dynamic_instructions_when_store_empty(self, rag_service: RagService) -> None:
+        cap = RagCapability(rag_service)
+        instructions_fn = cap.instructions
+        assert callable(instructions_fn)
+        text = await instructions_fn()
+        assert "empty" in text.lower()
+
+    @pytest.mark.anyio
+    async def test_search_knowledge_returns_no_results_message_when_empty(self, rag_service: RagService) -> None:
+        cap = RagCapability(rag_service)
+        output = await _invoke_search_knowledge(cap, "anything")
+        assert output == "No relevant results found in the knowledge base."
+
+    @pytest.mark.anyio
+    async def test_search_knowledge_formats_results_with_source_and_score(self, rag_service: RagService) -> None:
+        await rag_service.index_text("docs", "Python is a programming language.", source="guide.pdf")
+        cap = RagCapability(rag_service)
+        output = await _invoke_search_knowledge(cap, "Python")
+        assert "[Result 1" in output
+        assert "source: guide.pdf" in output
+        assert "chunk:" in output
+        assert "relevance:" in output
+
+    @pytest.mark.anyio
+    async def test_search_knowledge_restricts_to_pinned_collections(self, rag_service: RagService) -> None:
+        await rag_service.index_text("pinned", "Pinned collection content.", source="pinned.pdf")
+        await rag_service.index_text("other", "Content in another collection.", source="other.pdf")
+
+        cap = RagCapability(rag_service, collections=["pinned"])
+        output = await _invoke_search_knowledge(cap, "content")
+        assert "pinned.pdf" in output
+        assert "other.pdf" not in output
+
+    @pytest.mark.anyio
+    async def test_search_knowledge_respects_max_results(self, rag_service: RagService) -> None:
+        paragraphs = "\n\n".join(f"Paragraph {i} about topic." for i in range(10))
+        await rag_service.index_text("bulk", paragraphs, source="bulk.pdf")
+
+        cap = RagCapability(rag_service)
+        output = await _invoke_search_knowledge(cap, "topic", max_results=2)
+        # Only two results requested, so only Result 1 and Result 2 should appear
+        assert "[Result 1" in output
+        assert "[Result 2" in output
+        assert "[Result 3" not in output
diff --git a/engine/tests/test_rag_routes.py b/engine/tests/test_rag_routes.py
new file mode 100644
index 0000000000..6227159279
--- /dev/null
+++ b/engine/tests/test_rag_routes.py
@@ -0,0 +1,205 @@
+from __future__ import annotations
+
+from collections.abc import Iterator
+
+import pytest
+from fastapi.testclient import TestClient
+
+from stirling.api import app
+from stirling.api.dependencies import get_rag_embedding_model, get_rag_service
+from stirling.rag import Document, RagService, SqliteVecStore
+
+TEST_EMBEDDING_MODEL = "test-embedder"
+
+
+class StubEmbedder:
+    """Deterministic embeddings for route tests — no network, no provider needed."""
+
+    def __init__(self, dim: int = 8) -> None:
+        self._dim = dim
+
+    async def embed_query(self, text: str) -> list[float]:
+        h = hash(text) % 1000
+        return [(h + i) / 1000.0 for i in range(self._dim)]
+
+    async def embed_documents(self, texts: list[str]) -> list[list[float]]:
+        return [await self.embed_query(t) for t in texts]
+
+    def chunk_and_prepare(
+        self,
+        text: str,
+        source: str = "",
+        base_metadata: dict[str, str] | None = None,
+    ) -> list[Document]:
+        from stirling.rag.chunker import chunk_text
+
+        chunks = chunk_text(text, 100, 10)
+        docs = []
+        for i, chunk in enumerate(chunks):
+            meta = dict(base_metadata) if base_metadata else {}
+            meta["source"] = source
+            meta["chunk_index"] = str(i)
+            doc_id = f"{source}:chunk:{i}" if source else f"chunk:{i}"
+            docs.append(Document(id=doc_id, text=chunk, metadata=meta))
+        return docs
+
+
+def _build_service() -> RagService:
+    return RagService(
+        embedder=StubEmbedder(),  # type: ignore[arg-type]
+        store=SqliteVecStore.ephemeral(),
+        default_top_k=3,
+    )
+
+
+@pytest.fixture
+def client() -> Iterator[TestClient]:
+    service = _build_service()
+    app.dependency_overrides[get_rag_service] = lambda: service
+    app.dependency_overrides[get_rag_embedding_model] = lambda: TEST_EMBEDDING_MODEL
+    try:
+        yield TestClient(app)
+    finally:
+        app.dependency_overrides.pop(get_rag_service, None)
+        app.dependency_overrides.pop(get_rag_embedding_model, None)
+
+
+# ── /status ─────────────────────────────────────────────────────────────
+
+
+def test_status_reports_embedding_model_and_collections(client: TestClient) -> None:
+    client.post(
+        "/api/v1/rag/index",
+        json={"collection": "my-docs", "text": "Hello world.", "source": "a.pdf"},
+    )
+    response = client.get("/api/v1/rag/status")
+    assert response.status_code == 200
+    body = response.json()
+    assert body["embeddingModel"] == TEST_EMBEDDING_MODEL
+    assert "my-docs" in body["collections"]
+
+
+def test_status_when_empty(client: TestClient) -> None:
+    response = client.get("/api/v1/rag/status")
+    assert response.status_code == 200
+    body = response.json()
+    assert body == {"embeddingModel": TEST_EMBEDDING_MODEL, "collections": []}
+
+
+# ── /index ──────────────────────────────────────────────────────────────
+
+
+def test_index_returns_chunk_count(client: TestClient) -> None:
+    response = client.post(
+        "/api/v1/rag/index",
+        json={"collection": "indexed", "text": "Short text.", "source": "doc.pdf"},
+    )
+    assert response.status_code == 200
+    body = response.json()
+    assert body["collection"] == "indexed"
+    assert body["chunksIndexed"] >= 1
+
+
+def test_index_rejects_empty_collection_name(client: TestClient) -> None:
+    response = client.post(
+        "/api/v1/rag/index",
+        json={"collection": "", "text": "Text.", "source": "x.pdf"},
+    )
+    assert response.status_code == 422
+
+
+def test_index_rejects_oversized_text(client: TestClient) -> None:
+    huge = "x" * 1_000_001  # Just over the 1MB cap
+    response = client.post(
+        "/api/v1/rag/index",
+        json={"collection": "toobig", "text": huge},
+    )
+    assert response.status_code == 422
+
+
+# ── /search ─────────────────────────────────────────────────────────────
+
+
+def test_search_returns_results(client: TestClient) -> None:
+    client.post(
+        "/api/v1/rag/index",
+        json={"collection": "search-test", "text": "Python is fun.", "source": "guide.pdf"},
+    )
+    response = client.post(
+        "/api/v1/rag/search",
+        json={"query": "Python", "collection": "search-test", "topK": 3},
+    )
+    assert response.status_code == 200
+    body = response.json()
+    assert body["query"] == "Python"
+    assert len(body["results"]) >= 1
+    first = body["results"][0]
+    assert first["source"] == "guide.pdf"
+    assert "score" in first
+
+
+def test_search_rejects_empty_collection_name(client: TestClient) -> None:
+    response = client.post(
+        "/api/v1/rag/search",
+        json={"query": "anything", "collection": ""},
+    )
+    assert response.status_code == 422
+
+
+def test_search_without_collection_searches_all(client: TestClient) -> None:
+    client.post(
+        "/api/v1/rag/index",
+        json={"collection": "col-one", "text": "Alpha content.", "source": "one.pdf"},
+    )
+    client.post(
+        "/api/v1/rag/index",
+        json={"collection": "col-two", "text": "Beta content.", "source": "two.pdf"},
+    )
+    response = client.post(
+        "/api/v1/rag/search",
+        json={"query": "content"},
+    )
+    assert response.status_code == 200
+    body = response.json()
+    assert len(body["results"]) >= 1
+
+
+# ── /collections ────────────────────────────────────────────────────────
+
+
+def test_collections_empty_when_no_data(client: TestClient) -> None:
+    response = client.get("/api/v1/rag/collections")
+    assert response.status_code == 200
+    assert response.json() == {"collections": []}
+
+
+def test_collections_lists_indexed(client: TestClient) -> None:
+    client.post(
+        "/api/v1/rag/index",
+        json={"collection": "list-me", "text": "Text.", "source": "x.pdf"},
+    )
+    response = client.get("/api/v1/rag/collections")
+    assert response.status_code == 200
+    assert "list-me" in response.json()["collections"]
+
+
+# ── DELETE /collections/{name} ──────────────────────────────────────────
+
+
+def test_delete_collection_removes_it(client: TestClient) -> None:
+    client.post(
+        "/api/v1/rag/index",
+        json={"collection": "to-delete", "text": "Text.", "source": "x.pdf"},
+    )
+    response = client.delete("/api/v1/rag/collections/to-delete")
+    assert response.status_code == 200
+    assert response.json() == {"status": "deleted", "collection": "to-delete"}
+
+    listing = client.get("/api/v1/rag/collections").json()
+    assert "to-delete" not in listing["collections"]
+
+
+def test_delete_nonexistent_collection_is_idempotent(client: TestClient) -> None:
+    response = client.delete("/api/v1/rag/collections/never-existed")
+    assert response.status_code == 200
+    assert response.json() == {"status": "deleted", "collection": "never-existed"}
diff --git a/engine/tests/test_stirling_api.py b/engine/tests/test_stirling_api.py
index ad07396325..98fa1f966f 100644
--- a/engine/tests/test_stirling_api.py
+++ b/engine/tests/test_stirling_api.py
@@ -1,3 +1,4 @@
+from conftest import build_app_settings
 from fastapi.testclient import TestClient
 
 from stirling.api import app
@@ -11,7 +12,7 @@ from stirling.api.dependencies import (
     get_pdf_question_agent,
     get_user_spec_agent,
 )
-from stirling.config import AppSettings, load_settings
+from stirling.config import load_settings
 from stirling.contracts import (
     AgentDraft,
     AgentDraftRequest,
@@ -19,42 +20,30 @@ from stirling.contracts import (
     AgentExecutionRequest,
     AgentRevisionRequest,
     AgentRevisionResponse,
-    CannotContinueExecutionAction,
-    EditCannotDoResponse,
-    OrchestratorRequest,
-    PdfEditRequest,
-    PdfQuestionNotFoundResponse,
-    PdfQuestionRequest,
-    UnsupportedCapabilityResponse,
-)
-from stirling.contracts.form_fill import (
     AnalysedFileResult,
+    CannotContinueExecutionAction,
     CrossFileRole,
     DetectedRole,
     DocumentExtractionRequest,
+    EditCannotDoResponse,
     FileFillResult,
     FormAnalysisRequest,
     FormAnalysisResponse,
     FormFillBatchRequest,
     FormFillBatchResponse,
     KnowledgeUpdateResponse,
+    OrchestratorRequest,
+    PdfEditRequest,
+    PdfQuestionNeedContentResponse,
+    PdfQuestionNotFoundResponse,
+    PdfQuestionRequest,
 )
-from stirling.models.tool_models import RotateParams
-
-
-class StubSettingsProvider:
-    def __call__(self) -> AppSettings:
-        return AppSettings(
-            smart_model_name="test",
-            fast_model_name="test",
-            smart_model_max_tokens=8192,
-            fast_model_max_tokens=2048,
-        )
+from stirling.models.tool_models import Angle, RotatePdfParams
 
 
 class StubOrchestratorAgent:
-    async def handle(self, request: OrchestratorRequest) -> UnsupportedCapabilityResponse:
-        return UnsupportedCapabilityResponse(capability="pdf_edit", message=request.user_message)
+    async def handle(self, request: OrchestratorRequest) -> PdfQuestionNeedContentResponse:
+        return PdfQuestionNeedContentResponse(reason=request.user_message, files=[], max_pages=1, max_characters=1000)
 
 
 class StubPdfEditAgent:
@@ -127,14 +116,7 @@ class StubExecutionPlanningAgent:
         return CannotContinueExecutionAction(reason=str(request.current_step_index))
 
 
-client: TestClient = TestClient(app)
-
-
-def override_settings() -> AppSettings:
-    return StubSettingsProvider()()
-
-
-app.dependency_overrides[load_settings] = override_settings
+app.dependency_overrides[load_settings] = build_app_settings
 app.dependency_overrides[get_orchestrator_agent] = lambda: StubOrchestratorAgent()
 app.dependency_overrides[get_pdf_edit_agent] = lambda: StubPdfEditAgent()
 app.dependency_overrides[get_pdf_question_agent] = lambda: StubPdfQuestionAgent()
@@ -144,6 +126,8 @@ app.dependency_overrides[get_form_analyser_agent] = lambda: StubFormAnalyserAgen
 app.dependency_overrides[get_form_filler_agent] = lambda: StubFormFillerAgent()
 app.dependency_overrides[get_document_extractor_agent] = lambda: StubDocumentExtractorAgent()
 
+client: TestClient = TestClient(app)
+
 
 def test_health_route() -> None:
     response = client.get("/health")
@@ -153,10 +137,10 @@ def test_health_route() -> None:
 
 
 def test_orchestrator_route() -> None:
-    response = client.post("/api/v1/orchestrator", json={"userMessage": "route this"})
+    response = client.post("/api/v1/orchestrator", json={"userMessage": "route this", "fileNames": ["test.pdf"]})
 
     assert response.status_code == 200
-    assert response.json()["outcome"] == "unsupported_capability"
+    assert response.json()["outcome"] == "need_content"
 
 
 def test_pdf_edit_route() -> None:
@@ -167,7 +151,14 @@ def test_pdf_edit_route() -> None:
 
 
 def test_pdf_questions_route() -> None:
-    response = client.post("/api/v1/pdf/questions", json={"question": "what is this?"})
+    response = client.post(
+        "/api/v1/pdf/questions",
+        json={
+            "question": "what is this?",
+            "fileNames": ["test.pdf"],
+            "pageText": [{"fileName": "test.pdf", "pages": [{"pageNumber": 1, "text": "Example"}]}],
+        },
+    )
 
     assert response.status_code == 200
     assert response.json()["outcome"] == "not_found"
@@ -192,8 +183,8 @@ def test_agent_revise_route() -> None:
                 "steps": [
                     {
                         "kind": "tool",
-                        "tool": "rotate",
-                        "parameters": RotateParams(angle=90).model_dump(by_alias=True),
+                        "tool": "/api/v1/general/rotate-pdf",
+                        "parameters": RotatePdfParams(angle=Angle(90)).model_dump(by_alias=True),
                     }
                 ],
             },
@@ -252,8 +243,8 @@ def test_next_action_route() -> None:
                 "steps": [
                     {
                         "kind": "tool",
-                        "tool": "rotate",
-                        "parameters": RotateParams(angle=90).model_dump(by_alias=True),
+                        "tool": "/api/v1/general/rotate-pdf",
+                        "parameters": RotatePdfParams(angle=Angle(90)).model_dump(by_alias=True),
                     }
                 ],
             },
diff --git a/engine/tests/test_stirling_contracts.py b/engine/tests/test_stirling_contracts.py
index 526abb4be2..df183e8c82 100644
--- a/engine/tests/test_stirling_contracts.py
+++ b/engine/tests/test_stirling_contracts.py
@@ -1,36 +1,47 @@
-from collections.abc import Iterator
-
-import pytest
-
-from stirling.config import AppSettings, load_settings
+from stirling.config import AppSettings
 from stirling.contracts import (
     AgentExecutionRequest,
     AgentSpec,
     AgentSpecStep,
     EditPlanResponse,
     ExecutionContext,
-    OrchestratorRequest,
-    PdfQuestionAnswerResponse,
-    ToolOperationStep,
-)
-from stirling.contracts.form_fill import (
+    ExtractedFileText,
+    ExtractedTextArtifact,
     KnowledgeEntry,
     KnowledgeUpdateResponse,
+    OrchestratorRequest,
+    PdfQuestionAnswerResponse,
+    PdfTextSelection,
+    ToolOperationStep,
 )
-from stirling.models.tool_models import OperationId, RotateParams
+from stirling.models.tool_models import Angle, RotatePdfParams, ToolEndpoint
 
 
 def test_orchestrator_request_accepts_user_message() -> None:
-    request = OrchestratorRequest(user_message="Rotate the PDF")
+    request = OrchestratorRequest(
+        user_message="Rotate the PDF",
+        file_names=["test.pdf"],
+        artifacts=[
+            ExtractedTextArtifact(
+                files=[
+                    ExtractedFileText(
+                        file_name="test.pdf",
+                        pages=[PdfTextSelection(page_number=1, text="Hello")],
+                    )
+                ]
+            )
+        ],
+    )
 
     assert request.user_message == "Rotate the PDF"
+    assert len(request.artifacts) == 1
 
 
 def test_agent_execution_request_uses_typed_agent_spec() -> None:
     steps: list[AgentSpecStep] = [
         ToolOperationStep(
-            tool=OperationId.ROTATE,
-            parameters=RotateParams(angle=90),
+            tool=ToolEndpoint.ROTATE_PDF,
+            parameters=RotatePdfParams(angle=Angle(90)),
         )
     ]
     request = AgentExecutionRequest(
@@ -48,13 +59,13 @@ def test_agent_execution_request_uses_typed_agent_spec() -> None:
 
 
 def test_edit_plan_response_has_typed_steps() -> None:
-    steps = [ToolOperationStep(tool=OperationId.ROTATE, parameters=RotateParams(angle=90))]
+    steps = [ToolOperationStep(tool=ToolEndpoint.ROTATE_PDF, parameters=RotatePdfParams(angle=Angle(90)))]
     response = EditPlanResponse(
         summary="Rotate the input PDF by 90 degrees.",
         steps=steps,
     )
 
-    assert response.steps[0].tool == OperationId.ROTATE
+    assert response.steps[0].tool == ToolEndpoint.ROTATE_PDF
 
 
 def test_pdf_question_answer_defaults_evidence_list() -> None:
@@ -63,13 +74,6 @@ def test_pdf_question_answer_defaults_evidence_list() -> None:
     assert response.evidence == []
 
 
-@pytest.fixture(autouse=True)
-def clear_settings_cache() -> Iterator[None]:
-    load_settings.cache_clear()
-    yield
-    load_settings.cache_clear()
-
-
 def test_knowledge_update_response_discriminator() -> None:
     update = KnowledgeUpdateResponse(
         proposed_entries=[KnowledgeEntry(key="name", value="John", source="CV")],
@@ -79,11 +83,25 @@ def test_knowledge_update_response_discriminator() -> None:
 
 
 def test_app_settings_accepts_model_configuration() -> None:
+    from pathlib import Path
+
+    from stirling.config import RagBackend
+
     settings = AppSettings(
         smart_model_name="claude-sonnet-4-5-20250929",
         fast_model_name="claude-haiku-4-5-20251001",
         smart_model_max_tokens=8192,
         fast_model_max_tokens=2048,
+        rag_backend=RagBackend.SQLITE,
+        rag_embedding_model="voyageai:voyage-4",
+        rag_store_path=Path(":memory:"),
+        rag_pgvector_dsn="",
+        rag_chunk_size=512,
+        rag_chunk_overlap=64,
+        rag_default_top_k=5,
+        posthog_enabled=False,
+        posthog_api_key="",
+        posthog_host="https://eu.i.posthog.com",
     )
 
     assert settings.smart_model_name
diff --git a/engine/tests/test_user_spec_agent.py b/engine/tests/test_user_spec_agent.py
index fee8595b6f..3a91fcf1fb 100644
--- a/engine/tests/test_user_spec_agent.py
+++ b/engine/tests/test_user_spec_agent.py
@@ -4,7 +4,6 @@ import pytest
 from pydantic import ValidationError
 
 from stirling.agents import UserSpecAgent
-from stirling.config import AppSettings
 from stirling.contracts import (
     AgentDraft,
     AgentDraftRequest,
@@ -14,35 +13,28 @@ from stirling.contracts import (
     EditPlanResponse,
     ToolOperationStep,
 )
-from stirling.models.tool_models import CompressParams, OperationId, RotateParams
-from stirling.services import build_runtime
-
-
-def build_test_settings() -> AppSettings:
-    return AppSettings(
-        smart_model_name="test",
-        fast_model_name="test",
-        smart_model_max_tokens=8192,
-        fast_model_max_tokens=2048,
-    )
+from stirling.models.tool_models import Angle, FlattenParams, RotatePdfParams, ToolEndpoint
+from stirling.services.runtime import AppRuntime
 
 
 class StubUserSpecAgent(UserSpecAgent):
-    def __init__(self, draft_result: AgentDraft, revision_result: AgentDraft) -> None:
-        super().__init__(build_runtime(build_test_settings()))
+    def __init__(self, runtime: AppRuntime, draft_result: AgentDraft, revision_result: AgentDraft) -> None:
+        super().__init__(runtime)
         self.draft_result = draft_result
         self.revision_result = revision_result
         self.edit_plan = EditPlanResponse(
             summary="Rotate the document.",
             steps=[
                 ToolOperationStep(
-                    tool=OperationId.ROTATE,
-                    parameters=RotateParams(angle=90),
+                    tool=ToolEndpoint.ROTATE_PDF,
+                    parameters=RotatePdfParams(angle=Angle(90)),
                 )
             ],
         )
 
-    async def _build_edit_plan(self, user_message: str) -> EditPlanResponse:
+    async def _build_edit_plan(
+        self, user_message: str, conversation_history: list[ConversationMessage]
+    ) -> EditPlanResponse:
         return self.edit_plan
 
     async def _run_draft_agent(self, request: AgentDraftRequest, edit_plan: EditPlanResponse) -> AgentDraft:
@@ -53,10 +45,12 @@ class StubUserSpecAgent(UserSpecAgent):
 
 
 class ClarifyingUserSpecAgent(UserSpecAgent):
-    def __init__(self) -> None:
-        super().__init__(build_runtime(build_test_settings()))
+    def __init__(self, runtime: AppRuntime) -> None:
+        super().__init__(runtime)
 
-    async def _build_edit_plan(self, user_message: str) -> EditClarificationRequest:
+    async def _build_edit_plan(
+        self, user_message: str, conversation_history: list[ConversationMessage]
+    ) -> EditClarificationRequest:
         return EditClarificationRequest(
             question="Which pages should be changed?",
             reason="The request does not specify the target pages.",
@@ -64,16 +58,17 @@ class ClarifyingUserSpecAgent(UserSpecAgent):
 
 
 @pytest.mark.anyio
-async def test_user_spec_agent_drafts_agent_spec() -> None:
+async def test_user_spec_agent_drafts_agent_spec(runtime: AppRuntime) -> None:
     agent = StubUserSpecAgent(
+        runtime,
         AgentDraft(
             name="Invoice Cleanup",
             description="Prepare invoices for review.",
             objective="Normalize invoices before accounting review.",
             steps=[
                 ToolOperationStep(
-                    tool=OperationId.ROTATE,
-                    parameters=RotateParams(angle=90),
+                    tool=ToolEndpoint.ROTATE_PDF,
+                    parameters=RotatePdfParams(angle=Angle(90)),
                 )
             ],
         ),
@@ -100,19 +95,20 @@ async def test_user_spec_agent_drafts_agent_spec() -> None:
 
 
 @pytest.mark.anyio
-async def test_user_spec_agent_revises_existing_draft() -> None:
+async def test_user_spec_agent_revises_existing_draft(runtime: AppRuntime) -> None:
     current_draft = AgentDraft(
         name="Invoice Cleanup",
         description="Prepare invoices for review.",
         objective="Normalize invoices before accounting review.",
         steps=[
             ToolOperationStep(
-                tool=OperationId.ROTATE,
-                parameters=RotateParams(angle=90),
+                tool=ToolEndpoint.ROTATE_PDF,
+                parameters=RotatePdfParams(angle=Angle(90)),
             )
         ],
     )
     agent = StubUserSpecAgent(
+        runtime,
         draft_result=current_draft,
         revision_result=AgentDraft(
             name="Invoice Cleanup",
@@ -120,12 +116,12 @@ async def test_user_spec_agent_revises_existing_draft() -> None:
             objective="Normalize invoices before accounting review.",
             steps=[
                 ToolOperationStep(
-                    tool=OperationId.ROTATE,
-                    parameters=RotateParams(angle=90),
+                    tool=ToolEndpoint.ROTATE_PDF,
+                    parameters=RotatePdfParams(angle=Angle(90)),
                 ),
                 ToolOperationStep(
-                    tool=OperationId.COMPRESS,
-                    parameters=CompressParams(compression_level=5),
+                    tool=ToolEndpoint.FLATTEN,
+                    parameters=FlattenParams(flatten_only_forms=False, render_dpi=None),
                 ),
             ],
         ),
@@ -146,14 +142,14 @@ async def test_user_spec_agent_revises_existing_draft() -> None:
 def test_tool_operation_step_rejects_mismatched_parameters() -> None:
     with pytest.raises(ValidationError):
         ToolOperationStep(
-            tool=OperationId.ROTATE,
-            parameters=CompressParams(compression_level=5),
+            tool=ToolEndpoint.ROTATE_PDF,
+            parameters=FlattenParams(flatten_only_forms=False, render_dpi=None),
         )
 
 
 @pytest.mark.anyio
-async def test_user_spec_agent_propagates_edit_clarification() -> None:
-    agent = ClarifyingUserSpecAgent()
+async def test_user_spec_agent_propagates_edit_clarification(runtime: AppRuntime) -> None:
+    agent = ClarifyingUserSpecAgent(runtime)
 
     response = await agent.draft(AgentDraftRequest(user_message="Build an agent to rotate some pages."))
 
diff --git a/engine/uv.lock b/engine/uv.lock
index 9292fd2393..c8f79e6372 100644
--- a/engine/uv.lock
+++ b/engine/uv.lock
@@ -1,6 +1,10 @@
 version = 1
 revision = 3
 requires-python = ">=3.13"
+resolution-markers = [
+    "python_full_version >= '3.14'",
+    "python_full_version < '3.14'",
+]
 
 [[package]]
 name = "ag-ui-protocol"
@@ -37,7 +41,7 @@ wheels = [
 
 [[package]]
 name = "aiohttp"
-version = "3.13.3"
+version = "3.13.5"
 source = { registry = "https://pypi.org/simple" }
 dependencies = [
     { name = "aiohappyeyeballs" },
@@ -48,59 +52,68 @@ dependencies = [
     { name = "propcache" },
     { name = "yarl" },
 ]
-sdist = { url = "https://files.pythonhosted.org/packages/50/42/32cf8e7704ceb4481406eb87161349abb46a57fee3f008ba9cb610968646/aiohttp-3.13.3.tar.gz", hash = "sha256:a949eee43d3782f2daae4f4a2819b2cb9b0c5d3b7f7a927067cc84dafdbb9f88", size = 7844556, upload-time = "2026-01-03T17:33:05.204Z" }
+sdist = { url = "https://files.pythonhosted.org/packages/77/9a/152096d4808df8e4268befa55fba462f440f14beab85e8ad9bf990516918/aiohttp-3.13.5.tar.gz", hash = "sha256:9d98cc980ecc96be6eb4c1994ce35d28d8b1f5e5208a23b421187d1209dbb7d1", size = 7858271, upload-time = "2026-03-31T22:01:03.343Z" }
 wheels = [
-    { url = "https://files.pythonhosted.org/packages/97/8a/12ca489246ca1faaf5432844adbfce7ff2cc4997733e0af120869345643a/aiohttp-3.13.3-cp313-cp313-macosx_10_13_universal2.whl", hash = "sha256:5dff64413671b0d3e7d5918ea490bdccb97a4ad29b3f311ed423200b2203e01c", size = 734190, upload-time = "2026-01-03T17:30:45.832Z" },
-    { url = "https://files.pythonhosted.org/packages/32/08/de43984c74ed1fca5c014808963cc83cb00d7bb06af228f132d33862ca76/aiohttp-3.13.3-cp313-cp313-macosx_10_13_x86_64.whl", hash = "sha256:87b9aab6d6ed88235aa2970294f496ff1a1f9adcd724d800e9b952395a80ffd9", size = 491783, upload-time = "2026-01-03T17:30:47.466Z" },
-    { url = "https://files.pythonhosted.org/packages/17/f8/8dd2cf6112a5a76f81f81a5130c57ca829d101ad583ce57f889179accdda/aiohttp-3.13.3-cp313-cp313-macosx_11_0_arm64.whl", hash = "sha256:425c126c0dc43861e22cb1c14ba4c8e45d09516d0a3ae0a3f7494b79f5f233a3", size = 490704, upload-time = "2026-01-03T17:30:49.373Z" },
-    { url = "https://files.pythonhosted.org/packages/6d/40/a46b03ca03936f832bc7eaa47cfbb1ad012ba1be4790122ee4f4f8cba074/aiohttp-3.13.3-cp313-cp313-manylinux2014_aarch64.manylinux_2_17_aarch64.manylinux_2_28_aarch64.whl", hash = "sha256:7f9120f7093c2a32d9647abcaf21e6ad275b4fbec5b55969f978b1a97c7c86bf", size = 1720652, upload-time = "2026-01-03T17:30:50.974Z" },
-    { url = "https://files.pythonhosted.org/packages/f7/7e/917fe18e3607af92657e4285498f500dca797ff8c918bd7d90b05abf6c2a/aiohttp-3.13.3-cp313-cp313-manylinux2014_armv7l.manylinux_2_17_armv7l.manylinux_2_31_armv7l.whl", hash = "sha256:697753042d57f4bf7122cab985bf15d0cef23c770864580f5af4f52023a56bd6", size = 1692014, upload-time = "2026-01-03T17:30:52.729Z" },
-    { url = "https://files.pythonhosted.org/packages/71/b6/cefa4cbc00d315d68973b671cf105b21a609c12b82d52e5d0c9ae61d2a09/aiohttp-3.13.3-cp313-cp313-manylinux2014_ppc64le.manylinux_2_17_ppc64le.manylinux_2_28_ppc64le.whl", hash = "sha256:6de499a1a44e7de70735d0b39f67c8f25eb3d91eb3103be99ca0fa882cdd987d", size = 1759777, upload-time = "2026-01-03T17:30:54.537Z" },
-    { url = "https://files.pythonhosted.org/packages/fb/e3/e06ee07b45e59e6d81498b591fc589629be1553abb2a82ce33efe2a7b068/aiohttp-3.13.3-cp313-cp313-manylinux2014_s390x.manylinux_2_17_s390x.manylinux_2_28_s390x.whl", hash = "sha256:37239e9f9a7ea9ac5bf6b92b0260b01f8a22281996da609206a84df860bc1261", size = 1861276, upload-time = "2026-01-03T17:30:56.512Z" },
-    { url = "https://files.pythonhosted.org/packages/7c/24/75d274228acf35ceeb2850b8ce04de9dd7355ff7a0b49d607ee60c29c518/aiohttp-3.13.3-cp313-cp313-manylinux2014_x86_64.manylinux_2_17_x86_64.manylinux_2_28_x86_64.whl", hash = "sha256:f76c1e3fe7d7c8afad7ed193f89a292e1999608170dcc9751a7462a87dfd5bc0", size = 1743131, upload-time = "2026-01-03T17:30:58.256Z" },
-    { url = "https://files.pythonhosted.org/packages/04/98/3d21dde21889b17ca2eea54fdcff21b27b93f45b7bb94ca029c31ab59dc3/aiohttp-3.13.3-cp313-cp313-manylinux_2_31_riscv64.manylinux_2_39_riscv64.whl", hash = "sha256:fc290605db2a917f6e81b0e1e0796469871f5af381ce15c604a3c5c7e51cb730", size = 1556863, upload-time = "2026-01-03T17:31:00.445Z" },
-    { url = "https://files.pythonhosted.org/packages/9e/84/da0c3ab1192eaf64782b03971ab4055b475d0db07b17eff925e8c93b3aa5/aiohttp-3.13.3-cp313-cp313-musllinux_1_2_aarch64.whl", hash = "sha256:4021b51936308aeea0367b8f006dc999ca02bc118a0cc78c303f50a2ff6afb91", size = 1682793, upload-time = "2026-01-03T17:31:03.024Z" },
-    { url = "https://files.pythonhosted.org/packages/ff/0f/5802ada182f575afa02cbd0ec5180d7e13a402afb7c2c03a9aa5e5d49060/aiohttp-3.13.3-cp313-cp313-musllinux_1_2_armv7l.whl", hash = "sha256:49a03727c1bba9a97d3e93c9f93ca03a57300f484b6e935463099841261195d3", size = 1716676, upload-time = "2026-01-03T17:31:04.842Z" },
-    { url = "https://files.pythonhosted.org/packages/3f/8c/714d53bd8b5a4560667f7bbbb06b20c2382f9c7847d198370ec6526af39c/aiohttp-3.13.3-cp313-cp313-musllinux_1_2_ppc64le.whl", hash = "sha256:3d9908a48eb7416dc1f4524e69f1d32e5d90e3981e4e37eb0aa1cd18f9cfa2a4", size = 1733217, upload-time = "2026-01-03T17:31:06.868Z" },
-    { url = "https://files.pythonhosted.org/packages/7d/79/e2176f46d2e963facea939f5be2d26368ce543622be6f00a12844d3c991f/aiohttp-3.13.3-cp313-cp313-musllinux_1_2_riscv64.whl", hash = "sha256:2712039939ec963c237286113c68dbad80a82a4281543f3abf766d9d73228998", size = 1552303, upload-time = "2026-01-03T17:31:08.958Z" },
-    { url = "https://files.pythonhosted.org/packages/ab/6a/28ed4dea1759916090587d1fe57087b03e6c784a642b85ef48217b0277ae/aiohttp-3.13.3-cp313-cp313-musllinux_1_2_s390x.whl", hash = "sha256:7bfdc049127717581866fa4708791220970ce291c23e28ccf3922c700740fdc0", size = 1763673, upload-time = "2026-01-03T17:31:10.676Z" },
-    { url = "https://files.pythonhosted.org/packages/e8/35/4a3daeb8b9fab49240d21c04d50732313295e4bd813a465d840236dd0ce1/aiohttp-3.13.3-cp313-cp313-musllinux_1_2_x86_64.whl", hash = "sha256:8057c98e0c8472d8846b9c79f56766bcc57e3e8ac7bfd510482332366c56c591", size = 1721120, upload-time = "2026-01-03T17:31:12.575Z" },
-    { url = "https://files.pythonhosted.org/packages/bc/9f/d643bb3c5fb99547323e635e251c609fbbc660d983144cfebec529e09264/aiohttp-3.13.3-cp313-cp313-win32.whl", hash = "sha256:1449ceddcdbcf2e0446957863af03ebaaa03f94c090f945411b61269e2cb5daf", size = 427383, upload-time = "2026-01-03T17:31:14.382Z" },
-    { url = "https://files.pythonhosted.org/packages/4e/f1/ab0395f8a79933577cdd996dd2f9aa6014af9535f65dddcf88204682fe62/aiohttp-3.13.3-cp313-cp313-win_amd64.whl", hash = "sha256:693781c45a4033d31d4187d2436f5ac701e7bbfe5df40d917736108c1cc7436e", size = 453899, upload-time = "2026-01-03T17:31:15.958Z" },
-    { url = "https://files.pythonhosted.org/packages/99/36/5b6514a9f5d66f4e2597e40dea2e3db271e023eb7a5d22defe96ba560996/aiohttp-3.13.3-cp314-cp314-macosx_10_13_universal2.whl", hash = "sha256:ea37047c6b367fd4bd632bff8077449b8fa034b69e812a18e0132a00fae6e808", size = 737238, upload-time = "2026-01-03T17:31:17.909Z" },
-    { url = "https://files.pythonhosted.org/packages/f7/49/459327f0d5bcd8c6c9ca69e60fdeebc3622861e696490d8674a6d0cb90a6/aiohttp-3.13.3-cp314-cp314-macosx_10_13_x86_64.whl", hash = "sha256:6fc0e2337d1a4c3e6acafda6a78a39d4c14caea625124817420abceed36e2415", size = 492292, upload-time = "2026-01-03T17:31:19.919Z" },
-    { url = "https://files.pythonhosted.org/packages/e8/0b/b97660c5fd05d3495b4eb27f2d0ef18dc1dc4eff7511a9bf371397ff0264/aiohttp-3.13.3-cp314-cp314-macosx_11_0_arm64.whl", hash = "sha256:c685f2d80bb67ca8c3837823ad76196b3694b0159d232206d1e461d3d434666f", size = 493021, upload-time = "2026-01-03T17:31:21.636Z" },
-    { url = "https://files.pythonhosted.org/packages/54/d4/438efabdf74e30aeceb890c3290bbaa449780583b1270b00661126b8aae4/aiohttp-3.13.3-cp314-cp314-manylinux2014_aarch64.manylinux_2_17_aarch64.manylinux_2_28_aarch64.whl", hash = "sha256:48e377758516d262bde50c2584fc6c578af272559c409eecbdd2bae1601184d6", size = 1717263, upload-time = "2026-01-03T17:31:23.296Z" },
-    { url = "https://files.pythonhosted.org/packages/71/f2/7bddc7fd612367d1459c5bcf598a9e8f7092d6580d98de0e057eb42697ad/aiohttp-3.13.3-cp314-cp314-manylinux2014_armv7l.manylinux_2_17_armv7l.manylinux_2_31_armv7l.whl", hash = "sha256:34749271508078b261c4abb1767d42b8d0c0cc9449c73a4df494777dc55f0687", size = 1669107, upload-time = "2026-01-03T17:31:25.334Z" },
-    { url = "https://files.pythonhosted.org/packages/00/5a/1aeaecca40e22560f97610a329e0e5efef5e0b5afdf9f857f0d93839ab2e/aiohttp-3.13.3-cp314-cp314-manylinux2014_ppc64le.manylinux_2_17_ppc64le.manylinux_2_28_ppc64le.whl", hash = "sha256:82611aeec80eb144416956ec85b6ca45a64d76429c1ed46ae1b5f86c6e0c9a26", size = 1760196, upload-time = "2026-01-03T17:31:27.394Z" },
-    { url = "https://files.pythonhosted.org/packages/f8/f8/0ff6992bea7bd560fc510ea1c815f87eedd745fe035589c71ce05612a19a/aiohttp-3.13.3-cp314-cp314-manylinux2014_s390x.manylinux_2_17_s390x.manylinux_2_28_s390x.whl", hash = "sha256:2fff83cfc93f18f215896e3a190e8e5cb413ce01553901aca925176e7568963a", size = 1843591, upload-time = "2026-01-03T17:31:29.238Z" },
-    { url = "https://files.pythonhosted.org/packages/e3/d1/e30e537a15f53485b61f5be525f2157da719819e8377298502aebac45536/aiohttp-3.13.3-cp314-cp314-manylinux2014_x86_64.manylinux_2_17_x86_64.manylinux_2_28_x86_64.whl", hash = "sha256:bbe7d4cecacb439e2e2a8a1a7b935c25b812af7a5fd26503a66dadf428e79ec1", size = 1720277, upload-time = "2026-01-03T17:31:31.053Z" },
-    { url = "https://files.pythonhosted.org/packages/84/45/23f4c451d8192f553d38d838831ebbc156907ea6e05557f39563101b7717/aiohttp-3.13.3-cp314-cp314-manylinux_2_31_riscv64.manylinux_2_39_riscv64.whl", hash = "sha256:b928f30fe49574253644b1ca44b1b8adbd903aa0da4b9054a6c20fc7f4092a25", size = 1548575, upload-time = "2026-01-03T17:31:32.87Z" },
-    { url = "https://files.pythonhosted.org/packages/6a/ed/0a42b127a43712eda7807e7892c083eadfaf8429ca8fb619662a530a3aab/aiohttp-3.13.3-cp314-cp314-musllinux_1_2_aarch64.whl", hash = "sha256:7b5e8fe4de30df199155baaf64f2fcd604f4c678ed20910db8e2c66dc4b11603", size = 1679455, upload-time = "2026-01-03T17:31:34.76Z" },
-    { url = "https://files.pythonhosted.org/packages/2e/b5/c05f0c2b4b4fe2c9d55e73b6d3ed4fd6c9dc2684b1d81cbdf77e7fad9adb/aiohttp-3.13.3-cp314-cp314-musllinux_1_2_armv7l.whl", hash = "sha256:8542f41a62bcc58fc7f11cf7c90e0ec324ce44950003feb70640fc2a9092c32a", size = 1687417, upload-time = "2026-01-03T17:31:36.699Z" },
-    { url = "https://files.pythonhosted.org/packages/c9/6b/915bc5dad66aef602b9e459b5a973529304d4e89ca86999d9d75d80cbd0b/aiohttp-3.13.3-cp314-cp314-musllinux_1_2_ppc64le.whl", hash = "sha256:5e1d8c8b8f1d91cd08d8f4a3c2b067bfca6ec043d3ff36de0f3a715feeedf926", size = 1729968, upload-time = "2026-01-03T17:31:38.622Z" },
-    { url = "https://files.pythonhosted.org/packages/11/3b/e84581290a9520024a08640b63d07673057aec5ca548177a82026187ba73/aiohttp-3.13.3-cp314-cp314-musllinux_1_2_riscv64.whl", hash = "sha256:90455115e5da1c3c51ab619ac57f877da8fd6d73c05aacd125c5ae9819582aba", size = 1545690, upload-time = "2026-01-03T17:31:40.57Z" },
-    { url = "https://files.pythonhosted.org/packages/f5/04/0c3655a566c43fd647c81b895dfe361b9f9ad6d58c19309d45cff52d6c3b/aiohttp-3.13.3-cp314-cp314-musllinux_1_2_s390x.whl", hash = "sha256:042e9e0bcb5fba81886c8b4fbb9a09d6b8a00245fd8d88e4d989c1f96c74164c", size = 1746390, upload-time = "2026-01-03T17:31:42.857Z" },
-    { url = "https://files.pythonhosted.org/packages/1f/53/71165b26978f719c3419381514c9690bd5980e764a09440a10bb816ea4ab/aiohttp-3.13.3-cp314-cp314-musllinux_1_2_x86_64.whl", hash = "sha256:2eb752b102b12a76ca02dff751a801f028b4ffbbc478840b473597fc91a9ed43", size = 1702188, upload-time = "2026-01-03T17:31:44.984Z" },
-    { url = "https://files.pythonhosted.org/packages/29/a7/cbe6c9e8e136314fa1980da388a59d2f35f35395948a08b6747baebb6aa6/aiohttp-3.13.3-cp314-cp314-win32.whl", hash = "sha256:b556c85915d8efaed322bf1bdae9486aa0f3f764195a0fb6ee962e5c71ef5ce1", size = 433126, upload-time = "2026-01-03T17:31:47.463Z" },
-    { url = "https://files.pythonhosted.org/packages/de/56/982704adea7d3b16614fc5936014e9af85c0e34b58f9046655817f04306e/aiohttp-3.13.3-cp314-cp314-win_amd64.whl", hash = "sha256:9bf9f7a65e7aa20dd764151fb3d616c81088f91f8df39c3893a536e279b4b984", size = 459128, upload-time = "2026-01-03T17:31:49.2Z" },
-    { url = "https://files.pythonhosted.org/packages/6c/2a/3c79b638a9c3d4658d345339d22070241ea341ed4e07b5ac60fb0f418003/aiohttp-3.13.3-cp314-cp314t-macosx_10_13_universal2.whl", hash = "sha256:05861afbbec40650d8a07ea324367cb93e9e8cc7762e04dd4405df99fa65159c", size = 769512, upload-time = "2026-01-03T17:31:51.134Z" },
-    { url = "https://files.pythonhosted.org/packages/29/b9/3e5014d46c0ab0db8707e0ac2711ed28c4da0218c358a4e7c17bae0d8722/aiohttp-3.13.3-cp314-cp314t-macosx_10_13_x86_64.whl", hash = "sha256:2fc82186fadc4a8316768d61f3722c230e2c1dcab4200d52d2ebdf2482e47592", size = 506444, upload-time = "2026-01-03T17:31:52.85Z" },
-    { url = "https://files.pythonhosted.org/packages/90/03/c1d4ef9a054e151cd7839cdc497f2638f00b93cbe8043983986630d7a80c/aiohttp-3.13.3-cp314-cp314t-macosx_11_0_arm64.whl", hash = "sha256:0add0900ff220d1d5c5ebbf99ed88b0c1bbf87aa7e4262300ed1376a6b13414f", size = 510798, upload-time = "2026-01-03T17:31:54.91Z" },
-    { url = "https://files.pythonhosted.org/packages/ea/76/8c1e5abbfe8e127c893fe7ead569148a4d5a799f7cf958d8c09f3eedf097/aiohttp-3.13.3-cp314-cp314t-manylinux2014_aarch64.manylinux_2_17_aarch64.manylinux_2_28_aarch64.whl", hash = "sha256:568f416a4072fbfae453dcf9a99194bbb8bdeab718e08ee13dfa2ba0e4bebf29", size = 1868835, upload-time = "2026-01-03T17:31:56.733Z" },
-    { url = "https://files.pythonhosted.org/packages/8e/ac/984c5a6f74c363b01ff97adc96a3976d9c98940b8969a1881575b279ac5d/aiohttp-3.13.3-cp314-cp314t-manylinux2014_armv7l.manylinux_2_17_armv7l.manylinux_2_31_armv7l.whl", hash = "sha256:add1da70de90a2569c5e15249ff76a631ccacfe198375eead4aadf3b8dc849dc", size = 1720486, upload-time = "2026-01-03T17:31:58.65Z" },
-    { url = "https://files.pythonhosted.org/packages/b2/9a/b7039c5f099c4eb632138728828b33428585031a1e658d693d41d07d89d1/aiohttp-3.13.3-cp314-cp314t-manylinux2014_ppc64le.manylinux_2_17_ppc64le.manylinux_2_28_ppc64le.whl", hash = "sha256:10b47b7ba335d2e9b1239fa571131a87e2d8ec96b333e68b2a305e7a98b0bae2", size = 1847951, upload-time = "2026-01-03T17:32:00.989Z" },
-    { url = "https://files.pythonhosted.org/packages/3c/02/3bec2b9a1ba3c19ff89a43a19324202b8eb187ca1e928d8bdac9bbdddebd/aiohttp-3.13.3-cp314-cp314t-manylinux2014_s390x.manylinux_2_17_s390x.manylinux_2_28_s390x.whl", hash = "sha256:3dd4dce1c718e38081c8f35f323209d4c1df7d4db4bab1b5c88a6b4d12b74587", size = 1941001, upload-time = "2026-01-03T17:32:03.122Z" },
-    { url = "https://files.pythonhosted.org/packages/37/df/d879401cedeef27ac4717f6426c8c36c3091c6e9f08a9178cc87549c537f/aiohttp-3.13.3-cp314-cp314t-manylinux2014_x86_64.manylinux_2_17_x86_64.manylinux_2_28_x86_64.whl", hash = "sha256:34bac00a67a812570d4a460447e1e9e06fae622946955f939051e7cc895cfab8", size = 1797246, upload-time = "2026-01-03T17:32:05.255Z" },
-    { url = "https://files.pythonhosted.org/packages/8d/15/be122de1f67e6953add23335c8ece6d314ab67c8bebb3f181063010795a7/aiohttp-3.13.3-cp314-cp314t-manylinux_2_31_riscv64.manylinux_2_39_riscv64.whl", hash = "sha256:a19884d2ee70b06d9204b2727a7b9f983d0c684c650254679e716b0b77920632", size = 1627131, upload-time = "2026-01-03T17:32:07.607Z" },
-    { url = "https://files.pythonhosted.org/packages/12/12/70eedcac9134cfa3219ab7af31ea56bc877395b1ac30d65b1bc4b27d0438/aiohttp-3.13.3-cp314-cp314t-musllinux_1_2_aarch64.whl", hash = "sha256:5f8ca7f2bb6ba8348a3614c7918cc4bb73268c5ac2a207576b7afea19d3d9f64", size = 1795196, upload-time = "2026-01-03T17:32:09.59Z" },
-    { url = "https://files.pythonhosted.org/packages/32/11/b30e1b1cd1f3054af86ebe60df96989c6a414dd87e27ad16950eee420bea/aiohttp-3.13.3-cp314-cp314t-musllinux_1_2_armv7l.whl", hash = "sha256:b0d95340658b9d2f11d9697f59b3814a9d3bb4b7a7c20b131df4bcef464037c0", size = 1782841, upload-time = "2026-01-03T17:32:11.445Z" },
-    { url = "https://files.pythonhosted.org/packages/88/0d/d98a9367b38912384a17e287850f5695c528cff0f14f791ce8ee2e4f7796/aiohttp-3.13.3-cp314-cp314t-musllinux_1_2_ppc64le.whl", hash = "sha256:a1e53262fd202e4b40b70c3aff944a8155059beedc8a89bba9dc1f9ef06a1b56", size = 1795193, upload-time = "2026-01-03T17:32:13.705Z" },
-    { url = "https://files.pythonhosted.org/packages/43/a5/a2dfd1f5ff5581632c7f6a30e1744deda03808974f94f6534241ef60c751/aiohttp-3.13.3-cp314-cp314t-musllinux_1_2_riscv64.whl", hash = "sha256:d60ac9663f44168038586cab2157e122e46bdef09e9368b37f2d82d354c23f72", size = 1621979, upload-time = "2026-01-03T17:32:15.965Z" },
-    { url = "https://files.pythonhosted.org/packages/fa/f0/12973c382ae7c1cccbc4417e129c5bf54c374dfb85af70893646e1f0e749/aiohttp-3.13.3-cp314-cp314t-musllinux_1_2_s390x.whl", hash = "sha256:90751b8eed69435bac9ff4e3d2f6b3af1f57e37ecb0fbeee59c0174c9e2d41df", size = 1822193, upload-time = "2026-01-03T17:32:18.219Z" },
-    { url = "https://files.pythonhosted.org/packages/3c/5f/24155e30ba7f8c96918af1350eb0663e2430aad9e001c0489d89cd708ab1/aiohttp-3.13.3-cp314-cp314t-musllinux_1_2_x86_64.whl", hash = "sha256:fc353029f176fd2b3ec6cfc71be166aba1936fe5d73dd1992ce289ca6647a9aa", size = 1769801, upload-time = "2026-01-03T17:32:20.25Z" },
-    { url = "https://files.pythonhosted.org/packages/eb/f8/7314031ff5c10e6ece114da79b338ec17eeff3a079e53151f7e9f43c4723/aiohttp-3.13.3-cp314-cp314t-win32.whl", hash = "sha256:2e41b18a58da1e474a057b3d35248d8320029f61d70a37629535b16a0c8f3767", size = 466523, upload-time = "2026-01-03T17:32:22.215Z" },
-    { url = "https://files.pythonhosted.org/packages/b4/63/278a98c715ae467624eafe375542d8ba9b4383a016df8fdefe0ae28382a7/aiohttp-3.13.3-cp314-cp314t-win_amd64.whl", hash = "sha256:44531a36aa2264a1860089ffd4dce7baf875ee5a6079d5fb42e261c704ef7344", size = 499694, upload-time = "2026-01-03T17:32:24.546Z" },
+    { url = "https://files.pythonhosted.org/packages/78/e9/d76bf503005709e390122d34e15256b88f7008e246c4bdbe915cd4f1adce/aiohttp-3.13.5-cp313-cp313-macosx_10_13_universal2.whl", hash = "sha256:a5029cc80718bbd545123cd8fe5d15025eccaaaace5d0eeec6bd556ad6163d61", size = 742930, upload-time = "2026-03-31T21:58:13.155Z" },
+    { url = "https://files.pythonhosted.org/packages/57/00/4b7b70223deaebd9bb85984d01a764b0d7bd6526fcdc73cca83bcbe7243e/aiohttp-3.13.5-cp313-cp313-macosx_10_13_x86_64.whl", hash = "sha256:4bb6bf5811620003614076bdc807ef3b5e38244f9d25ca5fe888eaccea2a9832", size = 496927, upload-time = "2026-03-31T21:58:15.073Z" },
+    { url = "https://files.pythonhosted.org/packages/9c/f5/0fb20fb49f8efdcdce6cd8127604ad2c503e754a8f139f5e02b01626523f/aiohttp-3.13.5-cp313-cp313-macosx_11_0_arm64.whl", hash = "sha256:a84792f8631bf5a94e52d9cc881c0b824ab42717165a5579c760b830d9392ac9", size = 497141, upload-time = "2026-03-31T21:58:17.009Z" },
+    { url = "https://files.pythonhosted.org/packages/3b/86/b7c870053e36a94e8951b803cb5b909bfbc9b90ca941527f5fcafbf6b0fa/aiohttp-3.13.5-cp313-cp313-manylinux2014_aarch64.manylinux_2_17_aarch64.manylinux_2_28_aarch64.whl", hash = "sha256:57653eac22c6a4c13eb22ecf4d673d64a12f266e72785ab1c8b8e5940d0e8090", size = 1732476, upload-time = "2026-03-31T21:58:18.925Z" },
+    { url = "https://files.pythonhosted.org/packages/b5/e5/4e161f84f98d80c03a238671b4136e6530453d65262867d989bbe78244d0/aiohttp-3.13.5-cp313-cp313-manylinux2014_armv7l.manylinux_2_17_armv7l.manylinux_2_31_armv7l.whl", hash = "sha256:e5e5f7debc7a57af53fdf5c5009f9391d9f4c12867049d509bf7bb164a6e295b", size = 1706507, upload-time = "2026-03-31T21:58:21.094Z" },
+    { url = "https://files.pythonhosted.org/packages/d4/56/ea11a9f01518bd5a2a2fcee869d248c4b8a0cfa0bb13401574fa31adf4d4/aiohttp-3.13.5-cp313-cp313-manylinux2014_ppc64le.manylinux_2_17_ppc64le.manylinux_2_28_ppc64le.whl", hash = "sha256:c719f65bebcdf6716f10e9eff80d27567f7892d8988c06de12bbbd39307c6e3a", size = 1773465, upload-time = "2026-03-31T21:58:23.159Z" },
+    { url = "https://files.pythonhosted.org/packages/eb/40/333ca27fb74b0383f17c90570c748f7582501507307350a79d9f9f3c6eb1/aiohttp-3.13.5-cp313-cp313-manylinux2014_s390x.manylinux_2_17_s390x.manylinux_2_28_s390x.whl", hash = "sha256:d97f93fdae594d886c5a866636397e2bcab146fd7a132fd6bb9ce182224452f8", size = 1873523, upload-time = "2026-03-31T21:58:25.59Z" },
+    { url = "https://files.pythonhosted.org/packages/f0/d2/e2f77eef1acb7111405433c707dc735e63f67a56e176e72e9e7a2cd3f493/aiohttp-3.13.5-cp313-cp313-manylinux2014_x86_64.manylinux_2_17_x86_64.manylinux_2_28_x86_64.whl", hash = "sha256:3df334e39d4c2f899a914f1dba283c1aadc311790733f705182998c6f7cae665", size = 1754113, upload-time = "2026-03-31T21:58:27.624Z" },
+    { url = "https://files.pythonhosted.org/packages/fb/56/3f653d7f53c89669301ec9e42c95233e2a0c0a6dd051269e6e678db4fdb0/aiohttp-3.13.5-cp313-cp313-manylinux_2_31_riscv64.manylinux_2_39_riscv64.whl", hash = "sha256:fe6970addfea9e5e081401bcbadf865d2b6da045472f58af08427e108d618540", size = 1562351, upload-time = "2026-03-31T21:58:29.918Z" },
+    { url = "https://files.pythonhosted.org/packages/ec/a6/9b3e91eb8ae791cce4ee736da02211c85c6f835f1bdfac0594a8a3b7018c/aiohttp-3.13.5-cp313-cp313-musllinux_1_2_aarch64.whl", hash = "sha256:7becdf835feff2f4f335d7477f121af787e3504b48b449ff737afb35869ba7bb", size = 1693205, upload-time = "2026-03-31T21:58:32.214Z" },
+    { url = "https://files.pythonhosted.org/packages/98/fc/bfb437a99a2fcebd6b6eaec609571954de2ed424f01c352f4b5504371dd3/aiohttp-3.13.5-cp313-cp313-musllinux_1_2_armv7l.whl", hash = "sha256:676e5651705ad5d8a70aeb8eb6936c436d8ebbd56e63436cb7dd9bb36d2a9a46", size = 1730618, upload-time = "2026-03-31T21:58:34.728Z" },
+    { url = "https://files.pythonhosted.org/packages/e4/b6/c8534862126191a034f68153194c389addc285a0f1347d85096d349bbc15/aiohttp-3.13.5-cp313-cp313-musllinux_1_2_ppc64le.whl", hash = "sha256:9b16c653d38eb1a611cc898c41e76859ca27f119d25b53c12875fd0474ae31a8", size = 1745185, upload-time = "2026-03-31T21:58:36.909Z" },
+    { url = "https://files.pythonhosted.org/packages/0b/93/4ca8ee2ef5236e2707e0fd5fecb10ce214aee1ff4ab307af9c558bda3b37/aiohttp-3.13.5-cp313-cp313-musllinux_1_2_riscv64.whl", hash = "sha256:999802d5fa0389f58decd24b537c54aa63c01c3219ce17d1214cbda3c2b22d2d", size = 1557311, upload-time = "2026-03-31T21:58:39.38Z" },
+    { url = "https://files.pythonhosted.org/packages/57/ae/76177b15f18c5f5d094f19901d284025db28eccc5ae374d1d254181d33f4/aiohttp-3.13.5-cp313-cp313-musllinux_1_2_s390x.whl", hash = "sha256:ec707059ee75732b1ba130ed5f9580fe10ff75180c812bc267ded039db5128c6", size = 1773147, upload-time = "2026-03-31T21:58:41.476Z" },
+    { url = "https://files.pythonhosted.org/packages/01/a4/62f05a0a98d88af59d93b7fcac564e5f18f513cb7471696ac286db970d6a/aiohttp-3.13.5-cp313-cp313-musllinux_1_2_x86_64.whl", hash = "sha256:2d6d44a5b48132053c2f6cd5c8cb14bc67e99a63594e336b0f2af81e94d5530c", size = 1730356, upload-time = "2026-03-31T21:58:44.049Z" },
+    { url = "https://files.pythonhosted.org/packages/e4/85/fc8601f59dfa8c9523808281f2da571f8b4699685f9809a228adcc90838d/aiohttp-3.13.5-cp313-cp313-win32.whl", hash = "sha256:329f292ed14d38a6c4c435e465f48bebb47479fd676a0411936cc371643225cc", size = 432637, upload-time = "2026-03-31T21:58:46.167Z" },
+    { url = "https://files.pythonhosted.org/packages/c0/1b/ac685a8882896acf0f6b31d689e3792199cfe7aba37969fa91da63a7fa27/aiohttp-3.13.5-cp313-cp313-win_amd64.whl", hash = "sha256:69f571de7500e0557801c0b51f4780482c0ec5fe2ac851af5a92cfce1af1cb83", size = 458896, upload-time = "2026-03-31T21:58:48.119Z" },
+    { url = "https://files.pythonhosted.org/packages/5d/ce/46572759afc859e867a5bc8ec3487315869013f59281ce61764f76d879de/aiohttp-3.13.5-cp314-cp314-macosx_10_13_universal2.whl", hash = "sha256:eb4639f32fd4a9904ab8fb45bf3383ba71137f3d9d4ba25b3b3f3109977c5b8c", size = 745721, upload-time = "2026-03-31T21:58:50.229Z" },
+    { url = "https://files.pythonhosted.org/packages/13/fe/8a2efd7626dbe6049b2ef8ace18ffda8a4dfcbe1bcff3ac30c0c7575c20b/aiohttp-3.13.5-cp314-cp314-macosx_10_13_x86_64.whl", hash = "sha256:7e5dc4311bd5ac493886c63cbf76ab579dbe4641268e7c74e48e774c74b6f2be", size = 497663, upload-time = "2026-03-31T21:58:52.232Z" },
+    { url = "https://files.pythonhosted.org/packages/9b/91/cc8cc78a111826c54743d88651e1687008133c37e5ee615fee9b57990fac/aiohttp-3.13.5-cp314-cp314-macosx_11_0_arm64.whl", hash = "sha256:756c3c304d394977519824449600adaf2be0ccee76d206ee339c5e76b70ded25", size = 499094, upload-time = "2026-03-31T21:58:54.566Z" },
+    { url = "https://files.pythonhosted.org/packages/0a/33/a8362cb15cf16a3af7e86ed11962d5cd7d59b449202dc576cdc731310bde/aiohttp-3.13.5-cp314-cp314-manylinux2014_aarch64.manylinux_2_17_aarch64.manylinux_2_28_aarch64.whl", hash = "sha256:ecc26751323224cf8186efcf7fbcbc30f4e1d8c7970659daf25ad995e4032a56", size = 1726701, upload-time = "2026-03-31T21:58:56.864Z" },
+    { url = "https://files.pythonhosted.org/packages/45/0c/c091ac5c3a17114bd76cbf85d674650969ddf93387876cf67f754204bd77/aiohttp-3.13.5-cp314-cp314-manylinux2014_armv7l.manylinux_2_17_armv7l.manylinux_2_31_armv7l.whl", hash = "sha256:10a75acfcf794edf9d8db50e5a7ec5fc818b2a8d3f591ce93bc7b1210df016d2", size = 1683360, upload-time = "2026-03-31T21:58:59.072Z" },
+    { url = "https://files.pythonhosted.org/packages/23/73/bcee1c2b79bc275e964d1446c55c54441a461938e70267c86afaae6fba27/aiohttp-3.13.5-cp314-cp314-manylinux2014_ppc64le.manylinux_2_17_ppc64le.manylinux_2_28_ppc64le.whl", hash = "sha256:0f7a18f258d124cd678c5fe072fe4432a4d5232b0657fca7c1847f599233c83a", size = 1773023, upload-time = "2026-03-31T21:59:01.776Z" },
+    { url = "https://files.pythonhosted.org/packages/c7/ef/720e639df03004fee2d869f771799d8c23046dec47d5b81e396c7cda583a/aiohttp-3.13.5-cp314-cp314-manylinux2014_s390x.manylinux_2_17_s390x.manylinux_2_28_s390x.whl", hash = "sha256:df6104c009713d3a89621096f3e3e88cc323fd269dbd7c20afe18535094320be", size = 1853795, upload-time = "2026-03-31T21:59:04.568Z" },
+    { url = "https://files.pythonhosted.org/packages/bd/c9/989f4034fb46841208de7aeeac2c6d8300745ab4f28c42f629ba77c2d916/aiohttp-3.13.5-cp314-cp314-manylinux2014_x86_64.manylinux_2_17_x86_64.manylinux_2_28_x86_64.whl", hash = "sha256:241a94f7de7c0c3b616627aaad530fe2cb620084a8b144d3be7b6ecfe95bae3b", size = 1730405, upload-time = "2026-03-31T21:59:07.221Z" },
+    { url = "https://files.pythonhosted.org/packages/ce/75/ee1fd286ca7dc599d824b5651dad7b3be7ff8d9a7e7b3fe9820d9180f7db/aiohttp-3.13.5-cp314-cp314-manylinux_2_31_riscv64.manylinux_2_39_riscv64.whl", hash = "sha256:c974fb66180e58709b6fc402846f13791240d180b74de81d23913abe48e96d94", size = 1558082, upload-time = "2026-03-31T21:59:09.484Z" },
+    { url = "https://files.pythonhosted.org/packages/c3/20/1e9e6650dfc436340116b7aa89ff8cb2bbdf0abc11dfaceaad8f74273a10/aiohttp-3.13.5-cp314-cp314-musllinux_1_2_aarch64.whl", hash = "sha256:6e27ea05d184afac78aabbac667450c75e54e35f62238d44463131bd3f96753d", size = 1692346, upload-time = "2026-03-31T21:59:12.068Z" },
+    { url = "https://files.pythonhosted.org/packages/d8/40/8ebc6658d48ea630ac7903912fe0dd4e262f0e16825aa4c833c56c9f1f56/aiohttp-3.13.5-cp314-cp314-musllinux_1_2_armv7l.whl", hash = "sha256:a79a6d399cef33a11b6f004c67bb07741d91f2be01b8d712d52c75711b1e07c7", size = 1698891, upload-time = "2026-03-31T21:59:14.552Z" },
+    { url = "https://files.pythonhosted.org/packages/d8/78/ea0ae5ec8ba7a5c10bdd6e318f1ba5e76fcde17db8275188772afc7917a4/aiohttp-3.13.5-cp314-cp314-musllinux_1_2_ppc64le.whl", hash = "sha256:c632ce9c0b534fbe25b52c974515ed674937c5b99f549a92127c85f771a78772", size = 1742113, upload-time = "2026-03-31T21:59:17.068Z" },
+    { url = "https://files.pythonhosted.org/packages/8a/66/9d308ed71e3f2491be1acb8769d96c6f0c47d92099f3bc9119cada27b357/aiohttp-3.13.5-cp314-cp314-musllinux_1_2_riscv64.whl", hash = "sha256:fceedde51fbd67ee2bcc8c0b33d0126cc8b51ef3bbde2f86662bd6d5a6f10ec5", size = 1553088, upload-time = "2026-03-31T21:59:19.541Z" },
+    { url = "https://files.pythonhosted.org/packages/da/a6/6cc25ed8dfc6e00c90f5c6d126a98e2cf28957ad06fa1036bd34b6f24a2c/aiohttp-3.13.5-cp314-cp314-musllinux_1_2_s390x.whl", hash = "sha256:f92995dfec9420bb69ae629abf422e516923ba79ba4403bc750d94fb4a6c68c1", size = 1757976, upload-time = "2026-03-31T21:59:22.311Z" },
+    { url = "https://files.pythonhosted.org/packages/c1/2b/cce5b0ffe0de99c83e5e36d8f828e4161e415660a9f3e58339d07cce3006/aiohttp-3.13.5-cp314-cp314-musllinux_1_2_x86_64.whl", hash = "sha256:20ae0ff08b1f2c8788d6fb85afcb798654ae6ba0b747575f8562de738078457b", size = 1712444, upload-time = "2026-03-31T21:59:24.635Z" },
+    { url = "https://files.pythonhosted.org/packages/6c/cf/9e1795b4160c58d29421eafd1a69c6ce351e2f7c8d3c6b7e4ca44aea1a5b/aiohttp-3.13.5-cp314-cp314-win32.whl", hash = "sha256:b20df693de16f42b2472a9c485e1c948ee55524786a0a34345511afdd22246f3", size = 438128, upload-time = "2026-03-31T21:59:27.291Z" },
+    { url = "https://files.pythonhosted.org/packages/22/4d/eaedff67fc805aeba4ba746aec891b4b24cebb1a7d078084b6300f79d063/aiohttp-3.13.5-cp314-cp314-win_amd64.whl", hash = "sha256:f85c6f327bf0b8c29da7d93b1cabb6363fb5e4e160a32fa241ed2dce21b73162", size = 464029, upload-time = "2026-03-31T21:59:29.429Z" },
+    { url = "https://files.pythonhosted.org/packages/79/11/c27d9332ee20d68dd164dc12a6ecdef2e2e35ecc97ed6cf0d2442844624b/aiohttp-3.13.5-cp314-cp314t-macosx_10_13_universal2.whl", hash = "sha256:1efb06900858bb618ff5cee184ae2de5828896c448403d51fb633f09e109be0a", size = 778758, upload-time = "2026-03-31T21:59:31.547Z" },
+    { url = "https://files.pythonhosted.org/packages/04/fb/377aead2e0a3ba5f09b7624f702a964bdf4f08b5b6728a9799830c80041e/aiohttp-3.13.5-cp314-cp314t-macosx_10_13_x86_64.whl", hash = "sha256:fee86b7c4bd29bdaf0d53d14739b08a106fdda809ca5fe032a15f52fae5fe254", size = 512883, upload-time = "2026-03-31T21:59:34.098Z" },
+    { url = "https://files.pythonhosted.org/packages/bb/a6/aa109a33671f7a5d3bd78b46da9d852797c5e665bfda7d6b373f56bff2ec/aiohttp-3.13.5-cp314-cp314t-macosx_11_0_arm64.whl", hash = "sha256:20058e23909b9e65f9da62b396b77dfa95965cbe840f8def6e572538b1d32e36", size = 516668, upload-time = "2026-03-31T21:59:36.497Z" },
+    { url = "https://files.pythonhosted.org/packages/79/b3/ca078f9f2fa9563c36fb8ef89053ea2bb146d6f792c5104574d49d8acb63/aiohttp-3.13.5-cp314-cp314t-manylinux2014_aarch64.manylinux_2_17_aarch64.manylinux_2_28_aarch64.whl", hash = "sha256:8cf20a8d6868cb15a73cab329ffc07291ba8c22b1b88176026106ae39aa6df0f", size = 1883461, upload-time = "2026-03-31T21:59:38.723Z" },
+    { url = "https://files.pythonhosted.org/packages/b7/e3/a7ad633ca1ca497b852233a3cce6906a56c3225fb6d9217b5e5e60b7419d/aiohttp-3.13.5-cp314-cp314t-manylinux2014_armv7l.manylinux_2_17_armv7l.manylinux_2_31_armv7l.whl", hash = "sha256:330f5da04c987f1d5bdb8ae189137c77139f36bd1cb23779ca1a354a4b027800", size = 1747661, upload-time = "2026-03-31T21:59:41.187Z" },
+    { url = "https://files.pythonhosted.org/packages/33/b9/cd6fe579bed34a906d3d783fe60f2fa297ef55b27bb4538438ee49d4dc41/aiohttp-3.13.5-cp314-cp314t-manylinux2014_ppc64le.manylinux_2_17_ppc64le.manylinux_2_28_ppc64le.whl", hash = "sha256:6f1cbf0c7926d315c3c26c2da41fd2b5d2fe01ac0e157b78caefc51a782196cf", size = 1863800, upload-time = "2026-03-31T21:59:43.84Z" },
+    { url = "https://files.pythonhosted.org/packages/c0/3f/2c1e2f5144cefa889c8afd5cf431994c32f3b29da9961698ff4e3811b79a/aiohttp-3.13.5-cp314-cp314t-manylinux2014_s390x.manylinux_2_17_s390x.manylinux_2_28_s390x.whl", hash = "sha256:53fc049ed6390d05423ba33103ded7281fe897cf97878f369a527070bd95795b", size = 1958382, upload-time = "2026-03-31T21:59:46.187Z" },
+    { url = "https://files.pythonhosted.org/packages/66/1d/f31ec3f1013723b3babe3609e7f119c2c2fb6ef33da90061a705ef3e1bc8/aiohttp-3.13.5-cp314-cp314t-manylinux2014_x86_64.manylinux_2_17_x86_64.manylinux_2_28_x86_64.whl", hash = "sha256:898703aa2667e3c5ca4c54ca36cd73f58b7a38ef87a5606414799ebce4d3fd3a", size = 1803724, upload-time = "2026-03-31T21:59:48.656Z" },
+    { url = "https://files.pythonhosted.org/packages/0e/b4/57712dfc6f1542f067daa81eb61da282fab3e6f1966fca25db06c4fc62d5/aiohttp-3.13.5-cp314-cp314t-manylinux_2_31_riscv64.manylinux_2_39_riscv64.whl", hash = "sha256:0494a01ca9584eea1e5fbd6d748e61ecff218c51b576ee1999c23db7066417d8", size = 1640027, upload-time = "2026-03-31T21:59:51.284Z" },
+    { url = "https://files.pythonhosted.org/packages/25/3c/734c878fb43ec083d8e31bf029daae1beafeae582d1b35da234739e82ee7/aiohttp-3.13.5-cp314-cp314t-musllinux_1_2_aarch64.whl", hash = "sha256:6cf81fe010b8c17b09495cbd15c1d35afbc8fb405c0c9cf4738e5ae3af1d65be", size = 1806644, upload-time = "2026-03-31T21:59:53.753Z" },
+    { url = "https://files.pythonhosted.org/packages/20/a5/f671e5cbec1c21d044ff3078223f949748f3a7f86b14e34a365d74a5d21f/aiohttp-3.13.5-cp314-cp314t-musllinux_1_2_armv7l.whl", hash = "sha256:c564dd5f09ddc9d8f2c2d0a301cd30a79a2cc1b46dd1a73bef8f0038863d016b", size = 1791630, upload-time = "2026-03-31T21:59:56.239Z" },
+    { url = "https://files.pythonhosted.org/packages/0b/63/fb8d0ad63a0b8a99be97deac8c04dacf0785721c158bdf23d679a87aa99e/aiohttp-3.13.5-cp314-cp314t-musllinux_1_2_ppc64le.whl", hash = "sha256:2994be9f6e51046c4f864598fd9abeb4fba6e88f0b2152422c9666dcd4aea9c6", size = 1809403, upload-time = "2026-03-31T21:59:59.103Z" },
+    { url = "https://files.pythonhosted.org/packages/59/0c/bfed7f30662fcf12206481c2aac57dedee43fe1c49275e85b3a1e1742294/aiohttp-3.13.5-cp314-cp314t-musllinux_1_2_riscv64.whl", hash = "sha256:157826e2fa245d2ef46c83ea8a5faf77ca19355d278d425c29fda0beb3318037", size = 1634924, upload-time = "2026-03-31T22:00:02.116Z" },
+    { url = "https://files.pythonhosted.org/packages/17/d6/fd518d668a09fd5a3319ae5e984d4d80b9a4b3df4e21c52f02251ef5a32e/aiohttp-3.13.5-cp314-cp314t-musllinux_1_2_s390x.whl", hash = "sha256:a8aca50daa9493e9e13c0f566201a9006f080e7c50e5e90d0b06f53146a54500", size = 1836119, upload-time = "2026-03-31T22:00:04.756Z" },
+    { url = "https://files.pythonhosted.org/packages/78/b7/15fb7a9d52e112a25b621c67b69c167805cb1f2ab8f1708a5c490d1b52fe/aiohttp-3.13.5-cp314-cp314t-musllinux_1_2_x86_64.whl", hash = "sha256:3b13560160d07e047a93f23aaa30718606493036253d5430887514715b67c9d9", size = 1772072, upload-time = "2026-03-31T22:00:07.494Z" },
+    { url = "https://files.pythonhosted.org/packages/7e/df/57ba7f0c4a553fc2bd8b6321df236870ec6fd64a2a473a8a13d4f733214e/aiohttp-3.13.5-cp314-cp314t-win32.whl", hash = "sha256:9a0f4474b6ea6818b41f82172d799e4b3d29e22c2c520ce4357856fced9af2f8", size = 471819, upload-time = "2026-03-31T22:00:10.277Z" },
+    { url = "https://files.pythonhosted.org/packages/62/29/2f8418269e46454a26171bfdd6a055d74febf32234e474930f2f60a17145/aiohttp-3.13.5-cp314-cp314t-win_amd64.whl", hash = "sha256:18a2f6c1182c51baa1d28d68fea51513cb2a76612f038853c0ad3c145423d3d9", size = 505441, upload-time = "2026-03-31T22:00:12.791Z" },
+]
+
+[[package]]
+name = "aiolimiter"
+version = "1.2.1"
+source = { registry = "https://pypi.org/simple" }
+sdist = { url = "https://files.pythonhosted.org/packages/f1/23/b52debf471f7a1e42e362d959a3982bdcb4fe13a5d46e63d28868807a79c/aiolimiter-1.2.1.tar.gz", hash = "sha256:e02a37ea1a855d9e832252a105420ad4d15011505512a1a1d814647451b5cca9", size = 7185, upload-time = "2024-12-08T15:31:51.496Z" }
+wheels = [
+    { url = "https://files.pythonhosted.org/packages/f3/ba/df6e8e1045aebc4778d19b8a3a9bc1808adb1619ba94ca354d9ba17d86c3/aiolimiter-1.2.1-py3-none-any.whl", hash = "sha256:d3f249e9059a20badcb56b61601a83556133655c11d1eb3dd3e04ff069e5f3c7", size = 6711, upload-time = "2024-12-08T15:31:49.874Z" },
 ]
 
 [[package]]
@@ -135,7 +148,7 @@ wheels = [
 
 [[package]]
 name = "anthropic"
-version = "0.86.0"
+version = "0.93.0"
 source = { registry = "https://pypi.org/simple" }
 dependencies = [
     { name = "anyio" },
@@ -147,9 +160,9 @@ dependencies = [
     { name = "sniffio" },
     { name = "typing-extensions" },
 ]
-sdist = { url = "https://files.pythonhosted.org/packages/37/7a/8b390dc47945d3169875d342847431e5f7d5fa716b2e37494d57cfc1db10/anthropic-0.86.0.tar.gz", hash = "sha256:60023a7e879aa4fbb1fed99d487fe407b2ebf6569603e5047cfe304cebdaa0e5", size = 583820, upload-time = "2026-03-18T18:43:08.017Z" }
+sdist = { url = "https://files.pythonhosted.org/packages/c2/70/2429d6f7c2516db99fb342c3ad89575ab3e0cd31d3d2f6cba5fdf5e9c65b/anthropic-0.93.0.tar.gz", hash = "sha256:fea8376f7d5cdf99d5e8e85a48fe7a7bd8ab307cdfee4b1e8283a18b1c0ce1b5", size = 654155, upload-time = "2026-04-09T18:13:53.522Z" }
 wheels = [
-    { url = "https://files.pythonhosted.org/packages/63/5f/67db29c6e5d16c8c9c4652d3efb934d89cb750cad201539141781d8eae14/anthropic-0.86.0-py3-none-any.whl", hash = "sha256:9d2bbd339446acce98858c5627d33056efe01f70435b22b63546fe7edae0cd57", size = 469400, upload-time = "2026-03-18T18:43:06.526Z" },
+    { url = "https://files.pythonhosted.org/packages/c9/7b/5b2c11902707c49c7a99418eb027ed3eb63876193fee5c80b5c878e3a673/anthropic-0.93.0-py3-none-any.whl", hash = "sha256:2c20b2ce6d305564c66a6cbaedddee8efdd3b9753098bf314093fcf4c662d04c", size = 627482, upload-time = "2026-04-09T18:13:51.606Z" },
 ]
 
 [[package]]
@@ -194,6 +207,15 @@ wheels = [
     { url = "https://files.pythonhosted.org/packages/53/23/b65f568ed0c22f1efacb744d2db1a33c8068f384b8c9b482b52ebdbc3ef6/authlib-1.6.9-py2.py3-none-any.whl", hash = "sha256:f08b4c14e08f0861dc18a32357b33fbcfd2ea86cfe3fe149484b4d764c4a0ac3", size = 244197, upload-time = "2026-03-02T07:44:00.307Z" },
 ]
 
+[[package]]
+name = "backoff"
+version = "2.2.1"
+source = { registry = "https://pypi.org/simple" }
+sdist = { url = "https://files.pythonhosted.org/packages/47/d7/5bbeb12c44d7c4f2fb5b56abce497eb5ed9f34d85701de869acedd602619/backoff-2.2.1.tar.gz", hash = "sha256:03f829f5bb1923180821643f8753b0502c3b682293992485b0eef2807afa5cba", size = 17001, upload-time = "2022-10-05T19:19:32.061Z" }
+wheels = [
+    { url = "https://files.pythonhosted.org/packages/df/73/b6e24bd22e6720ca8ee9a85a0c4a2971af8497d8f3193fa05390cbd46e09/backoff-2.2.1-py3-none-any.whl", hash = "sha256:63579f9a0628e06278f7e47b7d7d5b6ce20dc65c5e96a6f3ca99a6adca0396e8", size = 15148, upload-time = "2022-10-05T19:19:30.546Z" },
+]
+
 [[package]]
 name = "beartype"
 version = "0.22.9"
@@ -203,6 +225,33 @@ wheels = [
     { url = "https://files.pythonhosted.org/packages/71/cc/18245721fa7747065ab478316c7fea7c74777d07f37ae60db2e84f8172e8/beartype-0.22.9-py3-none-any.whl", hash = "sha256:d16c9bbc61ea14637596c5f6fbff2ee99cbe3573e46a716401734ef50c3060c2", size = 1333658, upload-time = "2025-12-13T06:50:28.266Z" },
 ]
 
+[[package]]
+name = "black"
+version = "26.3.1"
+source = { registry = "https://pypi.org/simple" }
+dependencies = [
+    { name = "click" },
+    { name = "mypy-extensions" },
+    { name = "packaging" },
+    { name = "pathspec" },
+    { name = "platformdirs" },
+    { name = "pytokens" },
+]
+sdist = { url = "https://files.pythonhosted.org/packages/e1/c5/61175d618685d42b005847464b8fb4743a67b1b8fdb75e50e5a96c31a27a/black-26.3.1.tar.gz", hash = "sha256:2c50f5063a9641c7eed7795014ba37b0f5fa227f3d408b968936e24bc0566b07", size = 666155, upload-time = "2026-03-12T03:36:03.593Z" }
+wheels = [
+    { url = "https://files.pythonhosted.org/packages/f5/77/5728052a3c0450c53d9bb3945c4c46b91baa62b2cafab6801411b6271e45/black-26.3.1-cp313-cp313-macosx_10_13_x86_64.whl", hash = "sha256:855822d90f884905362f602880ed8b5df1b7e3ee7d0db2502d4388a954cc8c54", size = 1895034, upload-time = "2026-03-12T03:40:21.813Z" },
+    { url = "https://files.pythonhosted.org/packages/52/73/7cae55fdfdfbe9d19e9a8d25d145018965fe2079fa908101c3733b0c55a0/black-26.3.1-cp313-cp313-macosx_11_0_arm64.whl", hash = "sha256:8a33d657f3276328ce00e4d37fe70361e1ec7614da5d7b6e78de5426cb56332f", size = 1718503, upload-time = "2026-03-12T03:40:23.666Z" },
+    { url = "https://files.pythonhosted.org/packages/e1/87/af89ad449e8254fdbc74654e6467e3c9381b61472cc532ee350d28cfdafb/black-26.3.1-cp313-cp313-manylinux2014_x86_64.manylinux_2_17_x86_64.manylinux_2_28_x86_64.whl", hash = "sha256:f1cd08e99d2f9317292a311dfe578fd2a24b15dbce97792f9c4d752275c1fa56", size = 1793557, upload-time = "2026-03-12T03:40:25.497Z" },
+    { url = "https://files.pythonhosted.org/packages/43/10/d6c06a791d8124b843bf325ab4ac7d2f5b98731dff84d6064eafd687ded1/black-26.3.1-cp313-cp313-win_amd64.whl", hash = "sha256:c7e72339f841b5a237ff14f7d3880ddd0fc7f98a1199e8c4327f9a4f478c1839", size = 1422766, upload-time = "2026-03-12T03:40:27.14Z" },
+    { url = "https://files.pythonhosted.org/packages/59/4f/40a582c015f2d841ac24fed6390bd68f0fc896069ff3a886317959c9daf8/black-26.3.1-cp313-cp313-win_arm64.whl", hash = "sha256:afc622538b430aa4c8c853f7f63bc582b3b8030fd8c80b70fb5fa5b834e575c2", size = 1232140, upload-time = "2026-03-12T03:40:28.882Z" },
+    { url = "https://files.pythonhosted.org/packages/d5/da/e36e27c9cebc1311b7579210df6f1c86e50f2d7143ae4fcf8a5017dc8809/black-26.3.1-cp314-cp314-macosx_10_15_x86_64.whl", hash = "sha256:2d6bfaf7fd0993b420bed691f20f9492d53ce9a2bcccea4b797d34e947318a78", size = 1889234, upload-time = "2026-03-12T03:40:30.964Z" },
+    { url = "https://files.pythonhosted.org/packages/0e/7b/9871acf393f64a5fa33668c19350ca87177b181f44bb3d0c33b2d534f22c/black-26.3.1-cp314-cp314-macosx_11_0_arm64.whl", hash = "sha256:f89f2ab047c76a9c03f78d0d66ca519e389519902fa27e7a91117ef7611c0568", size = 1720522, upload-time = "2026-03-12T03:40:32.346Z" },
+    { url = "https://files.pythonhosted.org/packages/03/87/e766c7f2e90c07fb7586cc787c9ae6462b1eedab390191f2b7fc7f6170a9/black-26.3.1-cp314-cp314-manylinux2014_x86_64.manylinux_2_17_x86_64.manylinux_2_28_x86_64.whl", hash = "sha256:b07fc0dab849d24a80a29cfab8d8a19187d1c4685d8a5e6385a5ce323c1f015f", size = 1787824, upload-time = "2026-03-12T03:40:33.636Z" },
+    { url = "https://files.pythonhosted.org/packages/ac/94/2424338fb2d1875e9e83eed4c8e9c67f6905ec25afd826a911aea2b02535/black-26.3.1-cp314-cp314-win_amd64.whl", hash = "sha256:0126ae5b7c09957da2bdbd91a9ba1207453feada9e9fe51992848658c6c8e01c", size = 1445855, upload-time = "2026-03-12T03:40:35.442Z" },
+    { url = "https://files.pythonhosted.org/packages/86/43/0c3338bd928afb8ee7471f1a4eec3bdbe2245ccb4a646092a222e8669840/black-26.3.1-cp314-cp314-win_arm64.whl", hash = "sha256:92c0ec1f2cc149551a2b7b47efc32c866406b6891b0ee4625e95967c8f4acfb1", size = 1258109, upload-time = "2026-03-12T03:40:36.832Z" },
+    { url = "https://files.pythonhosted.org/packages/8e/0d/52d98722666d6fc6c3dd4c76df339501d6efd40e0ff95e6186a7b7f0befd/black-26.3.1-py3-none-any.whl", hash = "sha256:2bd5aa94fc267d38bb21a70d7410a89f1a1d318841855f698746f8e7f51acd1b", size = 207542, upload-time = "2026-03-12T03:36:01.668Z" },
+]
+
 [[package]]
 name = "boto3"
 version = "1.42.74"
@@ -410,55 +459,55 @@ wheels = [
 
 [[package]]
 name = "cryptography"
-version = "46.0.5"
+version = "46.0.7"
 source = { registry = "https://pypi.org/simple" }
 dependencies = [
     { name = "cffi", marker = "platform_python_implementation != 'PyPy'" },
 ]
-sdist = { url = "https://files.pythonhosted.org/packages/60/04/ee2a9e8542e4fa2773b81771ff8349ff19cdd56b7258a0cc442639052edb/cryptography-46.0.5.tar.gz", hash = "sha256:abace499247268e3757271b2f1e244b36b06f8515cf27c4d49468fc9eb16e93d", size = 750064, upload-time = "2026-02-10T19:18:38.255Z" }
+sdist = { url = "https://files.pythonhosted.org/packages/47/93/ac8f3d5ff04d54bc814e961a43ae5b0b146154c89c61b47bb07557679b18/cryptography-46.0.7.tar.gz", hash = "sha256:e4cfd68c5f3e0bfdad0d38e023239b96a2fe84146481852dffbcca442c245aa5", size = 750652, upload-time = "2026-04-08T01:57:54.692Z" }
 wheels = [
-    { url = "https://files.pythonhosted.org/packages/f7/81/b0bb27f2ba931a65409c6b8a8b358a7f03c0e46eceacddff55f7c84b1f3b/cryptography-46.0.5-cp311-abi3-macosx_10_9_universal2.whl", hash = "sha256:351695ada9ea9618b3500b490ad54c739860883df6c1f555e088eaf25b1bbaad", size = 7176289, upload-time = "2026-02-10T19:17:08.274Z" },
-    { url = "https://files.pythonhosted.org/packages/ff/9e/6b4397a3e3d15123de3b1806ef342522393d50736c13b20ec4c9ea6693a6/cryptography-46.0.5-cp311-abi3-manylinux2014_aarch64.manylinux_2_17_aarch64.whl", hash = "sha256:c18ff11e86df2e28854939acde2d003f7984f721eba450b56a200ad90eeb0e6b", size = 4275637, upload-time = "2026-02-10T19:17:10.53Z" },
-    { url = "https://files.pythonhosted.org/packages/63/e7/471ab61099a3920b0c77852ea3f0ea611c9702f651600397ac567848b897/cryptography-46.0.5-cp311-abi3-manylinux2014_x86_64.manylinux_2_17_x86_64.whl", hash = "sha256:4d7e3d356b8cd4ea5aff04f129d5f66ebdc7b6f8eae802b93739ed520c47c79b", size = 4424742, upload-time = "2026-02-10T19:17:12.388Z" },
-    { url = "https://files.pythonhosted.org/packages/37/53/a18500f270342d66bf7e4d9f091114e31e5ee9e7375a5aba2e85a91e0044/cryptography-46.0.5-cp311-abi3-manylinux_2_28_aarch64.whl", hash = "sha256:50bfb6925eff619c9c023b967d5b77a54e04256c4281b0e21336a130cd7fc263", size = 4277528, upload-time = "2026-02-10T19:17:13.853Z" },
-    { url = "https://files.pythonhosted.org/packages/22/29/c2e812ebc38c57b40e7c583895e73c8c5adb4d1e4a0cc4c5a4fdab2b1acc/cryptography-46.0.5-cp311-abi3-manylinux_2_28_ppc64le.whl", hash = "sha256:803812e111e75d1aa73690d2facc295eaefd4439be1023fefc4995eaea2af90d", size = 4947993, upload-time = "2026-02-10T19:17:15.618Z" },
-    { url = "https://files.pythonhosted.org/packages/6b/e7/237155ae19a9023de7e30ec64e5d99a9431a567407ac21170a046d22a5a3/cryptography-46.0.5-cp311-abi3-manylinux_2_28_x86_64.whl", hash = "sha256:3ee190460e2fbe447175cda91b88b84ae8322a104fc27766ad09428754a618ed", size = 4456855, upload-time = "2026-02-10T19:17:17.221Z" },
-    { url = "https://files.pythonhosted.org/packages/2d/87/fc628a7ad85b81206738abbd213b07702bcbdada1dd43f72236ef3cffbb5/cryptography-46.0.5-cp311-abi3-manylinux_2_31_armv7l.whl", hash = "sha256:f145bba11b878005c496e93e257c1e88f154d278d2638e6450d17e0f31e558d2", size = 3984635, upload-time = "2026-02-10T19:17:18.792Z" },
-    { url = "https://files.pythonhosted.org/packages/84/29/65b55622bde135aedf4565dc509d99b560ee4095e56989e815f8fd2aa910/cryptography-46.0.5-cp311-abi3-manylinux_2_34_aarch64.whl", hash = "sha256:e9251e3be159d1020c4030bd2e5f84d6a43fe54b6c19c12f51cde9542a2817b2", size = 4277038, upload-time = "2026-02-10T19:17:20.256Z" },
-    { url = "https://files.pythonhosted.org/packages/bc/36/45e76c68d7311432741faf1fbf7fac8a196a0a735ca21f504c75d37e2558/cryptography-46.0.5-cp311-abi3-manylinux_2_34_ppc64le.whl", hash = "sha256:47fb8a66058b80e509c47118ef8a75d14c455e81ac369050f20ba0d23e77fee0", size = 4912181, upload-time = "2026-02-10T19:17:21.825Z" },
-    { url = "https://files.pythonhosted.org/packages/6d/1a/c1ba8fead184d6e3d5afcf03d569acac5ad063f3ac9fb7258af158f7e378/cryptography-46.0.5-cp311-abi3-manylinux_2_34_x86_64.whl", hash = "sha256:4c3341037c136030cb46e4b1e17b7418ea4cbd9dd207e4a6f3b2b24e0d4ac731", size = 4456482, upload-time = "2026-02-10T19:17:25.133Z" },
-    { url = "https://files.pythonhosted.org/packages/f9/e5/3fb22e37f66827ced3b902cf895e6a6bc1d095b5b26be26bd13c441fdf19/cryptography-46.0.5-cp311-abi3-musllinux_1_2_aarch64.whl", hash = "sha256:890bcb4abd5a2d3f852196437129eb3667d62630333aacc13dfd470fad3aaa82", size = 4405497, upload-time = "2026-02-10T19:17:26.66Z" },
-    { url = "https://files.pythonhosted.org/packages/1a/df/9d58bb32b1121a8a2f27383fabae4d63080c7ca60b9b5c88be742be04ee7/cryptography-46.0.5-cp311-abi3-musllinux_1_2_x86_64.whl", hash = "sha256:80a8d7bfdf38f87ca30a5391c0c9ce4ed2926918e017c29ddf643d0ed2778ea1", size = 4667819, upload-time = "2026-02-10T19:17:28.569Z" },
-    { url = "https://files.pythonhosted.org/packages/ea/ed/325d2a490c5e94038cdb0117da9397ece1f11201f425c4e9c57fe5b9f08b/cryptography-46.0.5-cp311-abi3-win32.whl", hash = "sha256:60ee7e19e95104d4c03871d7d7dfb3d22ef8a9b9c6778c94e1c8fcc8365afd48", size = 3028230, upload-time = "2026-02-10T19:17:30.518Z" },
-    { url = "https://files.pythonhosted.org/packages/e9/5a/ac0f49e48063ab4255d9e3b79f5def51697fce1a95ea1370f03dc9db76f6/cryptography-46.0.5-cp311-abi3-win_amd64.whl", hash = "sha256:38946c54b16c885c72c4f59846be9743d699eee2b69b6988e0a00a01f46a61a4", size = 3480909, upload-time = "2026-02-10T19:17:32.083Z" },
-    { url = "https://files.pythonhosted.org/packages/00/13/3d278bfa7a15a96b9dc22db5a12ad1e48a9eb3d40e1827ef66a5df75d0d0/cryptography-46.0.5-cp314-cp314t-macosx_10_9_universal2.whl", hash = "sha256:94a76daa32eb78d61339aff7952ea819b1734b46f73646a07decb40e5b3448e2", size = 7119287, upload-time = "2026-02-10T19:17:33.801Z" },
-    { url = "https://files.pythonhosted.org/packages/67/c8/581a6702e14f0898a0848105cbefd20c058099e2c2d22ef4e476dfec75d7/cryptography-46.0.5-cp314-cp314t-manylinux2014_aarch64.manylinux_2_17_aarch64.whl", hash = "sha256:5be7bf2fb40769e05739dd0046e7b26f9d4670badc7b032d6ce4db64dddc0678", size = 4265728, upload-time = "2026-02-10T19:17:35.569Z" },
-    { url = "https://files.pythonhosted.org/packages/dd/4a/ba1a65ce8fc65435e5a849558379896c957870dd64fecea97b1ad5f46a37/cryptography-46.0.5-cp314-cp314t-manylinux2014_x86_64.manylinux_2_17_x86_64.whl", hash = "sha256:fe346b143ff9685e40192a4960938545c699054ba11d4f9029f94751e3f71d87", size = 4408287, upload-time = "2026-02-10T19:17:36.938Z" },
-    { url = "https://files.pythonhosted.org/packages/f8/67/8ffdbf7b65ed1ac224d1c2df3943553766914a8ca718747ee3871da6107e/cryptography-46.0.5-cp314-cp314t-manylinux_2_28_aarch64.whl", hash = "sha256:c69fd885df7d089548a42d5ec05be26050ebcd2283d89b3d30676eb32ff87dee", size = 4270291, upload-time = "2026-02-10T19:17:38.748Z" },
-    { url = "https://files.pythonhosted.org/packages/f8/e5/f52377ee93bc2f2bba55a41a886fd208c15276ffbd2569f2ddc89d50e2c5/cryptography-46.0.5-cp314-cp314t-manylinux_2_28_ppc64le.whl", hash = "sha256:8293f3dea7fc929ef7240796ba231413afa7b68ce38fd21da2995549f5961981", size = 4927539, upload-time = "2026-02-10T19:17:40.241Z" },
-    { url = "https://files.pythonhosted.org/packages/3b/02/cfe39181b02419bbbbcf3abdd16c1c5c8541f03ca8bda240debc467d5a12/cryptography-46.0.5-cp314-cp314t-manylinux_2_28_x86_64.whl", hash = "sha256:1abfdb89b41c3be0365328a410baa9df3ff8a9110fb75e7b52e66803ddabc9a9", size = 4442199, upload-time = "2026-02-10T19:17:41.789Z" },
-    { url = "https://files.pythonhosted.org/packages/c0/96/2fcaeb4873e536cf71421a388a6c11b5bc846e986b2b069c79363dc1648e/cryptography-46.0.5-cp314-cp314t-manylinux_2_31_armv7l.whl", hash = "sha256:d66e421495fdb797610a08f43b05269e0a5ea7f5e652a89bfd5a7d3c1dee3648", size = 3960131, upload-time = "2026-02-10T19:17:43.379Z" },
-    { url = "https://files.pythonhosted.org/packages/d8/d2/b27631f401ddd644e94c5cf33c9a4069f72011821cf3dc7309546b0642a0/cryptography-46.0.5-cp314-cp314t-manylinux_2_34_aarch64.whl", hash = "sha256:4e817a8920bfbcff8940ecfd60f23d01836408242b30f1a708d93198393a80b4", size = 4270072, upload-time = "2026-02-10T19:17:45.481Z" },
-    { url = "https://files.pythonhosted.org/packages/f4/a7/60d32b0370dae0b4ebe55ffa10e8599a2a59935b5ece1b9f06edb73abdeb/cryptography-46.0.5-cp314-cp314t-manylinux_2_34_ppc64le.whl", hash = "sha256:68f68d13f2e1cb95163fa3b4db4bf9a159a418f5f6e7242564fc75fcae667fd0", size = 4892170, upload-time = "2026-02-10T19:17:46.997Z" },
-    { url = "https://files.pythonhosted.org/packages/d2/b9/cf73ddf8ef1164330eb0b199a589103c363afa0cf794218c24d524a58eab/cryptography-46.0.5-cp314-cp314t-manylinux_2_34_x86_64.whl", hash = "sha256:a3d1fae9863299076f05cb8a778c467578262fae09f9dc0ee9b12eb4268ce663", size = 4441741, upload-time = "2026-02-10T19:17:48.661Z" },
-    { url = "https://files.pythonhosted.org/packages/5f/eb/eee00b28c84c726fe8fa0158c65afe312d9c3b78d9d01daf700f1f6e37ff/cryptography-46.0.5-cp314-cp314t-musllinux_1_2_aarch64.whl", hash = "sha256:c4143987a42a2397f2fc3b4d7e3a7d313fbe684f67ff443999e803dd75a76826", size = 4396728, upload-time = "2026-02-10T19:17:50.058Z" },
-    { url = "https://files.pythonhosted.org/packages/65/f4/6bc1a9ed5aef7145045114b75b77c2a8261b4d38717bd8dea111a63c3442/cryptography-46.0.5-cp314-cp314t-musllinux_1_2_x86_64.whl", hash = "sha256:7d731d4b107030987fd61a7f8ab512b25b53cef8f233a97379ede116f30eb67d", size = 4652001, upload-time = "2026-02-10T19:17:51.54Z" },
-    { url = "https://files.pythonhosted.org/packages/86/ef/5d00ef966ddd71ac2e6951d278884a84a40ffbd88948ef0e294b214ae9e4/cryptography-46.0.5-cp314-cp314t-win32.whl", hash = "sha256:c3bcce8521d785d510b2aad26ae2c966092b7daa8f45dd8f44734a104dc0bc1a", size = 3003637, upload-time = "2026-02-10T19:17:52.997Z" },
-    { url = "https://files.pythonhosted.org/packages/b7/57/f3f4160123da6d098db78350fdfd9705057aad21de7388eacb2401dceab9/cryptography-46.0.5-cp314-cp314t-win_amd64.whl", hash = "sha256:4d8ae8659ab18c65ced284993c2265910f6c9e650189d4e3f68445ef82a810e4", size = 3469487, upload-time = "2026-02-10T19:17:54.549Z" },
-    { url = "https://files.pythonhosted.org/packages/e2/fa/a66aa722105ad6a458bebd64086ca2b72cdd361fed31763d20390f6f1389/cryptography-46.0.5-cp38-abi3-macosx_10_9_universal2.whl", hash = "sha256:4108d4c09fbbf2789d0c926eb4152ae1760d5a2d97612b92d508d96c861e4d31", size = 7170514, upload-time = "2026-02-10T19:17:56.267Z" },
-    { url = "https://files.pythonhosted.org/packages/0f/04/c85bdeab78c8bc77b701bf0d9bdcf514c044e18a46dcff330df5448631b0/cryptography-46.0.5-cp38-abi3-manylinux2014_aarch64.manylinux_2_17_aarch64.whl", hash = "sha256:7d1f30a86d2757199cb2d56e48cce14deddf1f9c95f1ef1b64ee91ea43fe2e18", size = 4275349, upload-time = "2026-02-10T19:17:58.419Z" },
-    { url = "https://files.pythonhosted.org/packages/5c/32/9b87132a2f91ee7f5223b091dc963055503e9b442c98fc0b8a5ca765fab0/cryptography-46.0.5-cp38-abi3-manylinux2014_x86_64.manylinux_2_17_x86_64.whl", hash = "sha256:039917b0dc418bb9f6edce8a906572d69e74bd330b0b3fea4f79dab7f8ddd235", size = 4420667, upload-time = "2026-02-10T19:18:00.619Z" },
-    { url = "https://files.pythonhosted.org/packages/a1/a6/a7cb7010bec4b7c5692ca6f024150371b295ee1c108bdc1c400e4c44562b/cryptography-46.0.5-cp38-abi3-manylinux_2_28_aarch64.whl", hash = "sha256:ba2a27ff02f48193fc4daeadf8ad2590516fa3d0adeeb34336b96f7fa64c1e3a", size = 4276980, upload-time = "2026-02-10T19:18:02.379Z" },
-    { url = "https://files.pythonhosted.org/packages/8e/7c/c4f45e0eeff9b91e3f12dbd0e165fcf2a38847288fcfd889deea99fb7b6d/cryptography-46.0.5-cp38-abi3-manylinux_2_28_ppc64le.whl", hash = "sha256:61aa400dce22cb001a98014f647dc21cda08f7915ceb95df0c9eaf84b4b6af76", size = 4939143, upload-time = "2026-02-10T19:18:03.964Z" },
-    { url = "https://files.pythonhosted.org/packages/37/19/e1b8f964a834eddb44fa1b9a9976f4e414cbb7aa62809b6760c8803d22d1/cryptography-46.0.5-cp38-abi3-manylinux_2_28_x86_64.whl", hash = "sha256:3ce58ba46e1bc2aac4f7d9290223cead56743fa6ab94a5d53292ffaac6a91614", size = 4453674, upload-time = "2026-02-10T19:18:05.588Z" },
-    { url = "https://files.pythonhosted.org/packages/db/ed/db15d3956f65264ca204625597c410d420e26530c4e2943e05a0d2f24d51/cryptography-46.0.5-cp38-abi3-manylinux_2_31_armv7l.whl", hash = "sha256:420d0e909050490d04359e7fdb5ed7e667ca5c3c402b809ae2563d7e66a92229", size = 3978801, upload-time = "2026-02-10T19:18:07.167Z" },
-    { url = "https://files.pythonhosted.org/packages/41/e2/df40a31d82df0a70a0daf69791f91dbb70e47644c58581d654879b382d11/cryptography-46.0.5-cp38-abi3-manylinux_2_34_aarch64.whl", hash = "sha256:582f5fcd2afa31622f317f80426a027f30dc792e9c80ffee87b993200ea115f1", size = 4276755, upload-time = "2026-02-10T19:18:09.813Z" },
-    { url = "https://files.pythonhosted.org/packages/33/45/726809d1176959f4a896b86907b98ff4391a8aa29c0aaaf9450a8a10630e/cryptography-46.0.5-cp38-abi3-manylinux_2_34_ppc64le.whl", hash = "sha256:bfd56bb4b37ed4f330b82402f6f435845a5f5648edf1ad497da51a8452d5d62d", size = 4901539, upload-time = "2026-02-10T19:18:11.263Z" },
-    { url = "https://files.pythonhosted.org/packages/99/0f/a3076874e9c88ecb2ecc31382f6e7c21b428ede6f55aafa1aa272613e3cd/cryptography-46.0.5-cp38-abi3-manylinux_2_34_x86_64.whl", hash = "sha256:a3d507bb6a513ca96ba84443226af944b0f7f47dcc9a399d110cd6146481d24c", size = 4452794, upload-time = "2026-02-10T19:18:12.914Z" },
-    { url = "https://files.pythonhosted.org/packages/02/ef/ffeb542d3683d24194a38f66ca17c0a4b8bf10631feef44a7ef64e631b1a/cryptography-46.0.5-cp38-abi3-musllinux_1_2_aarch64.whl", hash = "sha256:9f16fbdf4da055efb21c22d81b89f155f02ba420558db21288b3d0035bafd5f4", size = 4404160, upload-time = "2026-02-10T19:18:14.375Z" },
-    { url = "https://files.pythonhosted.org/packages/96/93/682d2b43c1d5f1406ed048f377c0fc9fc8f7b0447a478d5c65ab3d3a66eb/cryptography-46.0.5-cp38-abi3-musllinux_1_2_x86_64.whl", hash = "sha256:ced80795227d70549a411a4ab66e8ce307899fad2220ce5ab2f296e687eacde9", size = 4667123, upload-time = "2026-02-10T19:18:15.886Z" },
-    { url = "https://files.pythonhosted.org/packages/45/2d/9c5f2926cb5300a8eefc3f4f0b3f3df39db7f7ce40c8365444c49363cbda/cryptography-46.0.5-cp38-abi3-win32.whl", hash = "sha256:02f547fce831f5096c9a567fd41bc12ca8f11df260959ecc7c3202555cc47a72", size = 3010220, upload-time = "2026-02-10T19:18:17.361Z" },
-    { url = "https://files.pythonhosted.org/packages/48/ef/0c2f4a8e31018a986949d34a01115dd057bf536905dca38897bacd21fac3/cryptography-46.0.5-cp38-abi3-win_amd64.whl", hash = "sha256:556e106ee01aa13484ce9b0239bca667be5004efb0aabbed28d353df86445595", size = 3467050, upload-time = "2026-02-10T19:18:18.899Z" },
+    { url = "https://files.pythonhosted.org/packages/0b/5d/4a8f770695d73be252331e60e526291e3df0c9b27556a90a6b47bccca4c2/cryptography-46.0.7-cp311-abi3-macosx_10_9_universal2.whl", hash = "sha256:ea42cbe97209df307fdc3b155f1b6fa2577c0defa8f1f7d3be7d31d189108ad4", size = 7179869, upload-time = "2026-04-08T01:56:17.157Z" },
+    { url = "https://files.pythonhosted.org/packages/5f/45/6d80dc379b0bbc1f9d1e429f42e4cb9e1d319c7a8201beffd967c516ea01/cryptography-46.0.7-cp311-abi3-manylinux2014_aarch64.manylinux_2_17_aarch64.whl", hash = "sha256:b36a4695e29fe69215d75960b22577197aca3f7a25b9cf9d165dcfe9d80bc325", size = 4275492, upload-time = "2026-04-08T01:56:19.36Z" },
+    { url = "https://files.pythonhosted.org/packages/4a/9a/1765afe9f572e239c3469f2cb429f3ba7b31878c893b246b4b2994ffe2fe/cryptography-46.0.7-cp311-abi3-manylinux2014_x86_64.manylinux_2_17_x86_64.whl", hash = "sha256:5ad9ef796328c5e3c4ceed237a183f5d41d21150f972455a9d926593a1dcb308", size = 4426670, upload-time = "2026-04-08T01:56:21.415Z" },
+    { url = "https://files.pythonhosted.org/packages/8f/3e/af9246aaf23cd4ee060699adab1e47ced3f5f7e7a8ffdd339f817b446462/cryptography-46.0.7-cp311-abi3-manylinux_2_28_aarch64.whl", hash = "sha256:73510b83623e080a2c35c62c15298096e2a5dc8d51c3b4e1740211839d0dea77", size = 4280275, upload-time = "2026-04-08T01:56:23.539Z" },
+    { url = "https://files.pythonhosted.org/packages/0f/54/6bbbfc5efe86f9d71041827b793c24811a017c6ac0fd12883e4caa86b8ed/cryptography-46.0.7-cp311-abi3-manylinux_2_28_ppc64le.whl", hash = "sha256:cbd5fb06b62bd0721e1170273d3f4d5a277044c47ca27ee257025146c34cbdd1", size = 4928402, upload-time = "2026-04-08T01:56:25.624Z" },
+    { url = "https://files.pythonhosted.org/packages/2d/cf/054b9d8220f81509939599c8bdbc0c408dbd2bdd41688616a20731371fe0/cryptography-46.0.7-cp311-abi3-manylinux_2_28_x86_64.whl", hash = "sha256:420b1e4109cc95f0e5700eed79908cef9268265c773d3a66f7af1eef53d409ef", size = 4459985, upload-time = "2026-04-08T01:56:27.309Z" },
+    { url = "https://files.pythonhosted.org/packages/f9/46/4e4e9c6040fb01c7467d47217d2f882daddeb8828f7df800cb806d8a2288/cryptography-46.0.7-cp311-abi3-manylinux_2_31_armv7l.whl", hash = "sha256:24402210aa54baae71d99441d15bb5a1919c195398a87b563df84468160a65de", size = 3990652, upload-time = "2026-04-08T01:56:29.095Z" },
+    { url = "https://files.pythonhosted.org/packages/36/5f/313586c3be5a2fbe87e4c9a254207b860155a8e1f3cca99f9910008e7d08/cryptography-46.0.7-cp311-abi3-manylinux_2_34_aarch64.whl", hash = "sha256:8a469028a86f12eb7d2fe97162d0634026d92a21f3ae0ac87ed1c4a447886c83", size = 4279805, upload-time = "2026-04-08T01:56:30.928Z" },
+    { url = "https://files.pythonhosted.org/packages/69/33/60dfc4595f334a2082749673386a4d05e4f0cf4df8248e63b2c3437585f2/cryptography-46.0.7-cp311-abi3-manylinux_2_34_ppc64le.whl", hash = "sha256:9694078c5d44c157ef3162e3bf3946510b857df5a3955458381d1c7cfc143ddb", size = 4892883, upload-time = "2026-04-08T01:56:32.614Z" },
+    { url = "https://files.pythonhosted.org/packages/c7/0b/333ddab4270c4f5b972f980adef4faa66951a4aaf646ca067af597f15563/cryptography-46.0.7-cp311-abi3-manylinux_2_34_x86_64.whl", hash = "sha256:42a1e5f98abb6391717978baf9f90dc28a743b7d9be7f0751a6f56a75d14065b", size = 4459756, upload-time = "2026-04-08T01:56:34.306Z" },
+    { url = "https://files.pythonhosted.org/packages/d2/14/633913398b43b75f1234834170947957c6b623d1701ffc7a9600da907e89/cryptography-46.0.7-cp311-abi3-musllinux_1_2_aarch64.whl", hash = "sha256:91bbcb08347344f810cbe49065914fe048949648f6bd5c2519f34619142bbe85", size = 4410244, upload-time = "2026-04-08T01:56:35.977Z" },
+    { url = "https://files.pythonhosted.org/packages/10/f2/19ceb3b3dc14009373432af0c13f46aa08e3ce334ec6eff13492e1812ccd/cryptography-46.0.7-cp311-abi3-musllinux_1_2_x86_64.whl", hash = "sha256:5d1c02a14ceb9148cc7816249f64f623fbfee39e8c03b3650d842ad3f34d637e", size = 4674868, upload-time = "2026-04-08T01:56:38.034Z" },
+    { url = "https://files.pythonhosted.org/packages/1a/bb/a5c213c19ee94b15dfccc48f363738633a493812687f5567addbcbba9f6f/cryptography-46.0.7-cp311-abi3-win32.whl", hash = "sha256:d23c8ca48e44ee015cd0a54aeccdf9f09004eba9fc96f38c911011d9ff1bd457", size = 3026504, upload-time = "2026-04-08T01:56:39.666Z" },
+    { url = "https://files.pythonhosted.org/packages/2b/02/7788f9fefa1d060ca68717c3901ae7fffa21ee087a90b7f23c7a603c32ae/cryptography-46.0.7-cp311-abi3-win_amd64.whl", hash = "sha256:397655da831414d165029da9bc483bed2fe0e75dde6a1523ec2fe63f3c46046b", size = 3488363, upload-time = "2026-04-08T01:56:41.893Z" },
+    { url = "https://files.pythonhosted.org/packages/7b/56/15619b210e689c5403bb0540e4cb7dbf11a6bf42e483b7644e471a2812b3/cryptography-46.0.7-cp314-cp314t-macosx_10_9_universal2.whl", hash = "sha256:d151173275e1728cf7839aaa80c34fe550c04ddb27b34f48c232193df8db5842", size = 7119671, upload-time = "2026-04-08T01:56:44Z" },
+    { url = "https://files.pythonhosted.org/packages/74/66/e3ce040721b0b5599e175ba91ab08884c75928fbeb74597dd10ef13505d2/cryptography-46.0.7-cp314-cp314t-manylinux2014_aarch64.manylinux_2_17_aarch64.whl", hash = "sha256:db0f493b9181c7820c8134437eb8b0b4792085d37dbb24da050476ccb664e59c", size = 4268551, upload-time = "2026-04-08T01:56:46.071Z" },
+    { url = "https://files.pythonhosted.org/packages/03/11/5e395f961d6868269835dee1bafec6a1ac176505a167f68b7d8818431068/cryptography-46.0.7-cp314-cp314t-manylinux2014_x86_64.manylinux_2_17_x86_64.whl", hash = "sha256:ebd6daf519b9f189f85c479427bbd6e9c9037862cf8fe89ee35503bd209ed902", size = 4408887, upload-time = "2026-04-08T01:56:47.718Z" },
+    { url = "https://files.pythonhosted.org/packages/40/53/8ed1cf4c3b9c8e611e7122fb56f1c32d09e1fff0f1d77e78d9ff7c82653e/cryptography-46.0.7-cp314-cp314t-manylinux_2_28_aarch64.whl", hash = "sha256:b7b412817be92117ec5ed95f880defe9cf18a832e8cafacf0a22337dc1981b4d", size = 4271354, upload-time = "2026-04-08T01:56:49.312Z" },
+    { url = "https://files.pythonhosted.org/packages/50/46/cf71e26025c2e767c5609162c866a78e8a2915bbcfa408b7ca495c6140c4/cryptography-46.0.7-cp314-cp314t-manylinux_2_28_ppc64le.whl", hash = "sha256:fbfd0e5f273877695cb93baf14b185f4878128b250cc9f8e617ea0c025dfb022", size = 4905845, upload-time = "2026-04-08T01:56:50.916Z" },
+    { url = "https://files.pythonhosted.org/packages/c0/ea/01276740375bac6249d0a971ebdf6b4dc9ead0ee0a34ef3b5a88c1a9b0d4/cryptography-46.0.7-cp314-cp314t-manylinux_2_28_x86_64.whl", hash = "sha256:ffca7aa1d00cf7d6469b988c581598f2259e46215e0140af408966a24cf086ce", size = 4444641, upload-time = "2026-04-08T01:56:52.882Z" },
+    { url = "https://files.pythonhosted.org/packages/3d/4c/7d258f169ae71230f25d9f3d06caabcff8c3baf0978e2b7d65e0acac3827/cryptography-46.0.7-cp314-cp314t-manylinux_2_31_armv7l.whl", hash = "sha256:60627cf07e0d9274338521205899337c5d18249db56865f943cbe753aa96f40f", size = 3967749, upload-time = "2026-04-08T01:56:54.597Z" },
+    { url = "https://files.pythonhosted.org/packages/b5/2a/2ea0767cad19e71b3530e4cad9605d0b5e338b6a1e72c37c9c1ceb86c333/cryptography-46.0.7-cp314-cp314t-manylinux_2_34_aarch64.whl", hash = "sha256:80406c3065e2c55d7f49a9550fe0c49b3f12e5bfff5dedb727e319e1afb9bf99", size = 4270942, upload-time = "2026-04-08T01:56:56.416Z" },
+    { url = "https://files.pythonhosted.org/packages/41/3d/fe14df95a83319af25717677e956567a105bb6ab25641acaa093db79975d/cryptography-46.0.7-cp314-cp314t-manylinux_2_34_ppc64le.whl", hash = "sha256:c5b1ccd1239f48b7151a65bc6dd54bcfcc15e028c8ac126d3fada09db0e07ef1", size = 4871079, upload-time = "2026-04-08T01:56:58.31Z" },
+    { url = "https://files.pythonhosted.org/packages/9c/59/4a479e0f36f8f378d397f4eab4c850b4ffb79a2f0d58704b8fa0703ddc11/cryptography-46.0.7-cp314-cp314t-manylinux_2_34_x86_64.whl", hash = "sha256:d5f7520159cd9c2154eb61eb67548ca05c5774d39e9c2c4339fd793fe7d097b2", size = 4443999, upload-time = "2026-04-08T01:57:00.508Z" },
+    { url = "https://files.pythonhosted.org/packages/28/17/b59a741645822ec6d04732b43c5d35e4ef58be7bfa84a81e5ae6f05a1d33/cryptography-46.0.7-cp314-cp314t-musllinux_1_2_aarch64.whl", hash = "sha256:fcd8eac50d9138c1d7fc53a653ba60a2bee81a505f9f8850b6b2888555a45d0e", size = 4399191, upload-time = "2026-04-08T01:57:02.654Z" },
+    { url = "https://files.pythonhosted.org/packages/59/6a/bb2e166d6d0e0955f1e9ff70f10ec4b2824c9cfcdb4da772c7dd69cc7d80/cryptography-46.0.7-cp314-cp314t-musllinux_1_2_x86_64.whl", hash = "sha256:65814c60f8cc400c63131584e3e1fad01235edba2614b61fbfbfa954082db0ee", size = 4655782, upload-time = "2026-04-08T01:57:04.592Z" },
+    { url = "https://files.pythonhosted.org/packages/95/b6/3da51d48415bcb63b00dc17c2eff3a651b7c4fed484308d0f19b30e8cb2c/cryptography-46.0.7-cp314-cp314t-win32.whl", hash = "sha256:fdd1736fed309b4300346f88f74cd120c27c56852c3838cab416e7a166f67298", size = 3002227, upload-time = "2026-04-08T01:57:06.91Z" },
+    { url = "https://files.pythonhosted.org/packages/32/a8/9f0e4ed57ec9cebe506e58db11ae472972ecb0c659e4d52bbaee80ca340a/cryptography-46.0.7-cp314-cp314t-win_amd64.whl", hash = "sha256:e06acf3c99be55aa3b516397fe42f5855597f430add9c17fa46bf2e0fb34c9bb", size = 3475332, upload-time = "2026-04-08T01:57:08.807Z" },
+    { url = "https://files.pythonhosted.org/packages/a7/7f/cd42fc3614386bc0c12f0cb3c4ae1fc2bbca5c9662dfed031514911d513d/cryptography-46.0.7-cp38-abi3-macosx_10_9_universal2.whl", hash = "sha256:462ad5cb1c148a22b2e3bcc5ad52504dff325d17daf5df8d88c17dda1f75f2a4", size = 7165618, upload-time = "2026-04-08T01:57:10.645Z" },
+    { url = "https://files.pythonhosted.org/packages/a5/d0/36a49f0262d2319139d2829f773f1b97ef8aef7f97e6e5bd21455e5a8fb5/cryptography-46.0.7-cp38-abi3-manylinux2014_aarch64.manylinux_2_17_aarch64.whl", hash = "sha256:84d4cced91f0f159a7ddacad249cc077e63195c36aac40b4150e7a57e84fffe7", size = 4270628, upload-time = "2026-04-08T01:57:12.885Z" },
+    { url = "https://files.pythonhosted.org/packages/8a/6c/1a42450f464dda6ffbe578a911f773e54dd48c10f9895a23a7e88b3e7db5/cryptography-46.0.7-cp38-abi3-manylinux2014_x86_64.manylinux_2_17_x86_64.whl", hash = "sha256:128c5edfe5e5938b86b03941e94fac9ee793a94452ad1365c9fc3f4f62216832", size = 4415405, upload-time = "2026-04-08T01:57:14.923Z" },
+    { url = "https://files.pythonhosted.org/packages/9a/92/4ed714dbe93a066dc1f4b4581a464d2d7dbec9046f7c8b7016f5286329e2/cryptography-46.0.7-cp38-abi3-manylinux_2_28_aarch64.whl", hash = "sha256:5e51be372b26ef4ba3de3c167cd3d1022934bc838ae9eaad7e644986d2a3d163", size = 4272715, upload-time = "2026-04-08T01:57:16.638Z" },
+    { url = "https://files.pythonhosted.org/packages/b7/e6/a26b84096eddd51494bba19111f8fffe976f6a09f132706f8f1bf03f51f7/cryptography-46.0.7-cp38-abi3-manylinux_2_28_ppc64le.whl", hash = "sha256:cdf1a610ef82abb396451862739e3fc93b071c844399e15b90726ef7470eeaf2", size = 4918400, upload-time = "2026-04-08T01:57:19.021Z" },
+    { url = "https://files.pythonhosted.org/packages/c7/08/ffd537b605568a148543ac3c2b239708ae0bd635064bab41359252ef88ed/cryptography-46.0.7-cp38-abi3-manylinux_2_28_x86_64.whl", hash = "sha256:1d25aee46d0c6f1a501adcddb2d2fee4b979381346a78558ed13e50aa8a59067", size = 4450634, upload-time = "2026-04-08T01:57:21.185Z" },
+    { url = "https://files.pythonhosted.org/packages/16/01/0cd51dd86ab5b9befe0d031e276510491976c3a80e9f6e31810cce46c4ad/cryptography-46.0.7-cp38-abi3-manylinux_2_31_armv7l.whl", hash = "sha256:cdfbe22376065ffcf8be74dc9a909f032df19bc58a699456a21712d6e5eabfd0", size = 3985233, upload-time = "2026-04-08T01:57:22.862Z" },
+    { url = "https://files.pythonhosted.org/packages/92/49/819d6ed3a7d9349c2939f81b500a738cb733ab62fbecdbc1e38e83d45e12/cryptography-46.0.7-cp38-abi3-manylinux_2_34_aarch64.whl", hash = "sha256:abad9dac36cbf55de6eb49badd4016806b3165d396f64925bf2999bcb67837ba", size = 4271955, upload-time = "2026-04-08T01:57:24.814Z" },
+    { url = "https://files.pythonhosted.org/packages/80/07/ad9b3c56ebb95ed2473d46df0847357e01583f4c52a85754d1a55e29e4d0/cryptography-46.0.7-cp38-abi3-manylinux_2_34_ppc64le.whl", hash = "sha256:935ce7e3cfdb53e3536119a542b839bb94ec1ad081013e9ab9b7cfd478b05006", size = 4879888, upload-time = "2026-04-08T01:57:26.88Z" },
+    { url = "https://files.pythonhosted.org/packages/b8/c7/201d3d58f30c4c2bdbe9b03844c291feb77c20511cc3586daf7edc12a47b/cryptography-46.0.7-cp38-abi3-manylinux_2_34_x86_64.whl", hash = "sha256:35719dc79d4730d30f1c2b6474bd6acda36ae2dfae1e3c16f2051f215df33ce0", size = 4449961, upload-time = "2026-04-08T01:57:29.068Z" },
+    { url = "https://files.pythonhosted.org/packages/a5/ef/649750cbf96f3033c3c976e112265c33906f8e462291a33d77f90356548c/cryptography-46.0.7-cp38-abi3-musllinux_1_2_aarch64.whl", hash = "sha256:7bbc6ccf49d05ac8f7d7b5e2e2c33830d4fe2061def88210a126d130d7f71a85", size = 4401696, upload-time = "2026-04-08T01:57:31.029Z" },
+    { url = "https://files.pythonhosted.org/packages/41/52/a8908dcb1a389a459a29008c29966c1d552588d4ae6d43f3a1a4512e0ebe/cryptography-46.0.7-cp38-abi3-musllinux_1_2_x86_64.whl", hash = "sha256:a1529d614f44b863a7b480c6d000fe93b59acee9c82ffa027cfadc77521a9f5e", size = 4664256, upload-time = "2026-04-08T01:57:33.144Z" },
+    { url = "https://files.pythonhosted.org/packages/4b/fa/f0ab06238e899cc3fb332623f337a7364f36f4bb3f2534c2bb95a35b132c/cryptography-46.0.7-cp38-abi3-win32.whl", hash = "sha256:f247c8c1a1fb45e12586afbb436ef21ff1e80670b2861a90353d9b025583d246", size = 3013001, upload-time = "2026-04-08T01:57:34.933Z" },
+    { url = "https://files.pythonhosted.org/packages/d2/f1/00ce3bde3ca542d1acd8f8cfa38e446840945aa6363f9b74746394b14127/cryptography-46.0.7-cp38-abi3-win_amd64.whl", hash = "sha256:506c4ff91eff4f82bdac7633318a526b1d1309fc07ca76a3ad182cb5b686d6d3", size = 3472985, upload-time = "2026-04-08T01:57:36.714Z" },
 ]
 
 [[package]]
@@ -476,6 +525,30 @@ wheels = [
     { url = "https://files.pythonhosted.org/packages/8a/0b/2261922126b2e50c601fe22d7ff5194e0a4d50e654836260c0665e24d862/cyclopts-4.10.1-py3-none-any.whl", hash = "sha256:35f37257139380a386d9fe4475e1e7c87ca7795765ef4f31abba579fcfcb6ecd", size = 204331, upload-time = "2026-03-23T14:43:02.625Z" },
 ]
 
+[[package]]
+name = "datamodel-code-generator"
+version = "0.56.0"
+source = { registry = "https://pypi.org/simple" }
+dependencies = [
+    { name = "argcomplete" },
+    { name = "black" },
+    { name = "genson" },
+    { name = "inflect" },
+    { name = "isort" },
+    { name = "jinja2" },
+    { name = "pydantic" },
+    { name = "pyyaml" },
+]
+sdist = { url = "https://files.pythonhosted.org/packages/03/7d/7fc2bb3d8946ca45851da3f23497a2c6e252e92558ccbd89d609cf1e13d4/datamodel_code_generator-0.56.0.tar.gz", hash = "sha256:e7c003fb5421b890aabe12f66ae65b57198b04cfe1da7c40810798020835b3a8", size = 837708, upload-time = "2026-04-04T09:46:19.636Z" }
+wheels = [
+    { url = "https://files.pythonhosted.org/packages/ed/3a/7f169ffc7a2d69a4f9158b1ac083f685b7f4a1a8a1db5d1e4abbb4e741b7/datamodel_code_generator-0.56.0-py3-none-any.whl", hash = "sha256:a0559683fbe90cdf2ce9b6637e3adae3e3a8056a8d0516df581d486e2834ead2", size = 256545, upload-time = "2026-04-04T09:46:17.582Z" },
+]
+
+[package.optional-dependencies]
+ruff = [
+    { name = "ruff" },
+]
+
 [[package]]
 name = "distro"
 version = "1.9.0"
@@ -531,34 +604,52 @@ version = "0.1.0"
 source = { editable = "." }
 dependencies = [
     { name = "fastapi" },
+    { name = "opentelemetry-sdk" },
+    { name = "pgvector" },
+    { name = "posthog" },
+    { name = "psycopg", extra = ["binary"] },
     { name = "pydantic" },
     { name = "pydantic-ai" },
+    { name = "pydantic-ai-slim", extra = ["voyageai"] },
     { name = "pydantic-settings" },
     { name = "python-dotenv" },
+    { name = "sqlite-vec" },
     { name = "uvicorn" },
 ]
 
 [package.dev-dependencies]
 dev = [
+    { name = "anyio" },
+    { name = "datamodel-code-generator", extra = ["ruff"] },
     { name = "pyright" },
     { name = "pytest" },
+    { name = "referencing" },
     { name = "ruff" },
 ]
 
 [package.metadata]
 requires-dist = [
     { name = "fastapi", specifier = ">=0.116.0" },
+    { name = "opentelemetry-sdk", specifier = ">=1.39.0" },
+    { name = "pgvector", specifier = ">=0.3.6" },
+    { name = "posthog", specifier = ">=3.0.0" },
+    { name = "psycopg", extras = ["binary"], specifier = ">=3.2" },
     { name = "pydantic", specifier = ">=2.0.0" },
     { name = "pydantic-ai", specifier = ">=1.67.0" },
+    { name = "pydantic-ai-slim", extras = ["voyageai"], specifier = ">=1.67.0" },
     { name = "pydantic-settings", specifier = ">=2.0.0" },
     { name = "python-dotenv", specifier = ">=1.2.1" },
+    { name = "sqlite-vec", specifier = ">=0.1.6" },
     { name = "uvicorn", specifier = ">=0.35.0" },
 ]
 
 [package.metadata.requires-dev]
 dev = [
+    { name = "anyio", specifier = ">=4.0.0" },
+    { name = "datamodel-code-generator", extras = ["ruff"], specifier = ">=0.26.0" },
     { name = "pyright", specifier = ">=1.1.408" },
     { name = "pytest", specifier = ">=8.0.0" },
+    { name = "referencing", specifier = ">=0.35.0" },
     { name = "ruff", specifier = ">=0.14.10" },
 ]
 
@@ -636,7 +727,7 @@ wheels = [
 
 [[package]]
 name = "fastmcp"
-version = "3.1.1"
+version = "3.2.3"
 source = { registry = "https://pypi.org/simple" }
 dependencies = [
     { name = "authlib" },
@@ -661,9 +752,21 @@ dependencies = [
     { name = "watchfiles" },
     { name = "websockets" },
 ]
-sdist = { url = "https://files.pythonhosted.org/packages/25/83/c95d3bf717698a693eccb43e137a32939d2549876e884e246028bff6ecce/fastmcp-3.1.1.tar.gz", hash = "sha256:db184b5391a31199323766a3abf3a8bfbb8010479f77eca84c0e554f18655c48", size = 17347644, upload-time = "2026-03-14T19:12:20.235Z" }
+sdist = { url = "https://files.pythonhosted.org/packages/b9/42/7eed0a38e3b7a386805fecacf8a5a9353a2b3040395ef9e30e585d8549ac/fastmcp-3.2.3.tar.gz", hash = "sha256:4f02ae8b00227285a0cf6544dea1db29b022c8cdd8d3dfdec7118540210ae60a", size = 26328743, upload-time = "2026-04-09T22:05:03.402Z" }
 wheels = [
-    { url = "https://files.pythonhosted.org/packages/70/ea/570122de7e24f72138d006f799768e14cc1ccf7fcb22b7750b2bd276c711/fastmcp-3.1.1-py3-none-any.whl", hash = "sha256:8132ba069d89f14566b3266919d6d72e2ec23dd45d8944622dca407e9beda7eb", size = 633754, upload-time = "2026-03-14T19:12:22.736Z" },
+    { url = "https://files.pythonhosted.org/packages/f5/48/84b6dcba793178a44b9d99b4def6cd62f870dcfc5bb7b9153ac390135812/fastmcp-3.2.3-py3-none-any.whl", hash = "sha256:cc50af6eed1f62ed8b6ebf4987286d8d1d006f08d5bec739d5c7fb76160e0911", size = 707260, upload-time = "2026-04-09T22:05:01.225Z" },
+]
+
+[[package]]
+name = "ffmpeg-python"
+version = "0.2.0"
+source = { registry = "https://pypi.org/simple" }
+dependencies = [
+    { name = "future", marker = "python_full_version < '3.14'" },
+]
+sdist = { url = "https://files.pythonhosted.org/packages/dd/5e/d5f9105d59c1325759d838af4e973695081fbbc97182baf73afc78dec266/ffmpeg-python-0.2.0.tar.gz", hash = "sha256:65225db34627c578ef0e11c8b1eb528bb35e024752f6f10b78c011f6f64c4127", size = 21543, upload-time = "2019-07-06T00:19:08.989Z" }
+wheels = [
+    { url = "https://files.pythonhosted.org/packages/d7/0c/56be52741f75bad4dc6555991fabd2e07b432d333da82c11ad701123888a/ffmpeg_python-0.2.0-py3-none-any.whl", hash = "sha256:ac441a0404e053f8b6a1113a77c0f452f1cfc62f6344a769475ffdc0f56c23c5", size = 25024, upload-time = "2019-07-06T00:19:07.215Z" },
 ]
 
 [[package]]
@@ -757,6 +860,15 @@ wheels = [
     { url = "https://files.pythonhosted.org/packages/e6/ab/fb21f4c939bb440104cc2b396d3be1d9b7a9fd3c6c2a53d98c45b3d7c954/fsspec-2026.2.0-py3-none-any.whl", hash = "sha256:98de475b5cb3bd66bedd5c4679e87b4fdfe1a3bf4d707b151b3c07e58c9a2437", size = 202505, upload-time = "2026-02-05T21:50:51.819Z" },
 ]
 
+[[package]]
+name = "future"
+version = "1.0.0"
+source = { registry = "https://pypi.org/simple" }
+sdist = { url = "https://files.pythonhosted.org/packages/a7/b2/4140c69c6a66432916b26158687e821ba631a4c9273c474343badf84d3ba/future-1.0.0.tar.gz", hash = "sha256:bd2968309307861edae1458a4f8a4f3598c03be43b97521076aebf5d94c07b05", size = 1228490, upload-time = "2024-02-21T11:52:38.461Z" }
+wheels = [
+    { url = "https://files.pythonhosted.org/packages/da/71/ae30dadffc90b9006d77af76b393cb9dfbfc9629f339fc1574a1c52e6806/future-1.0.0-py3-none-any.whl", hash = "sha256:929292d34f5872e70396626ef385ec22355a1fae8ad29e1a734c3e43f9fbc216", size = 491326, upload-time = "2024-02-21T11:52:35.956Z" },
+]
+
 [[package]]
 name = "genai-prices"
 version = "0.0.56"
@@ -770,6 +882,15 @@ wheels = [
     { url = "https://files.pythonhosted.org/packages/a3/f6/8ef7e4c286deb2709d11ca96a5237caae3ef4876ab3c48095856cfd2df30/genai_prices-0.0.56-py3-none-any.whl", hash = "sha256:dbe86be8f3f556bed1b72209ed36851fec8b01793b3b220f42921a4e7da945f6", size = 68966, upload-time = "2026-03-20T20:33:02.555Z" },
 ]
 
+[[package]]
+name = "genson"
+version = "1.3.0"
+source = { registry = "https://pypi.org/simple" }
+sdist = { url = "https://files.pythonhosted.org/packages/c5/cf/2303c8ad276dcf5ee2ad6cf69c4338fd86ef0f471a5207b069adf7a393cf/genson-1.3.0.tar.gz", hash = "sha256:e02db9ac2e3fd29e65b5286f7135762e2cd8a986537c075b06fc5f1517308e37", size = 34919, upload-time = "2024-05-15T22:08:49.123Z" }
+wheels = [
+    { url = "https://files.pythonhosted.org/packages/f8/5c/e226de133afd8bb267ec27eead9ae3d784b95b39a287ed404caab39a5f50/genson-1.3.0-py3-none-any.whl", hash = "sha256:468feccd00274cc7e4c09e84b08704270ba8d95232aa280f65b986139cec67f7", size = 21470, upload-time = "2024-05-15T22:08:47.056Z" },
+]
+
 [[package]]
 name = "google-auth"
 version = "2.49.1"
@@ -997,6 +1118,19 @@ wheels = [
     { url = "https://files.pythonhosted.org/packages/fa/5e/f8e9a1d23b9c20a551a8a02ea3637b4642e22c2626e3a13a9a29cdea99eb/importlib_metadata-8.7.1-py3-none-any.whl", hash = "sha256:5a1f80bf1daa489495071efbb095d75a634cf28a8bc299581244063b53176151", size = 27865, upload-time = "2025-12-21T10:00:18.329Z" },
 ]
 
+[[package]]
+name = "inflect"
+version = "7.5.0"
+source = { registry = "https://pypi.org/simple" }
+dependencies = [
+    { name = "more-itertools" },
+    { name = "typeguard" },
+]
+sdist = { url = "https://files.pythonhosted.org/packages/78/c6/943357d44a21fd995723d07ccaddd78023eace03c1846049a2645d4324a3/inflect-7.5.0.tar.gz", hash = "sha256:faf19801c3742ed5a05a8ce388e0d8fe1a07f8d095c82201eb904f5d27ad571f", size = 73751, upload-time = "2024-12-28T17:11:18.897Z" }
+wheels = [
+    { url = "https://files.pythonhosted.org/packages/8a/eb/427ed2b20a38a4ee29f24dbe4ae2dafab198674fe9a85e3d6adf9e5f5f41/inflect-7.5.0-py3-none-any.whl", hash = "sha256:2aea70e5e70c35d8350b8097396ec155ffd68def678c7ff97f51aa69c1d92344", size = 35197, upload-time = "2024-12-28T17:11:15.931Z" },
+]
+
 [[package]]
 name = "iniconfig"
 version = "2.3.0"
@@ -1006,6 +1140,15 @@ wheels = [
     { url = "https://files.pythonhosted.org/packages/cb/b1/3846dd7f199d53cb17f49cba7e651e9ce294d8497c8c150530ed11865bb8/iniconfig-2.3.0-py3-none-any.whl", hash = "sha256:f631c04d2c48c52b84d0d0549c99ff3859c98df65b3101406327ecc7d53fbf12", size = 7484, upload-time = "2025-10-18T21:55:41.639Z" },
 ]
 
+[[package]]
+name = "isort"
+version = "8.0.1"
+source = { registry = "https://pypi.org/simple" }
+sdist = { url = "https://files.pythonhosted.org/packages/ef/7c/ec4ab396d31b3b395e2e999c8f46dec78c5e29209fac49d1f4dace04041d/isort-8.0.1.tar.gz", hash = "sha256:171ac4ff559cdc060bcfff550bc8404a486fee0caab245679c2abe7cb253c78d", size = 769592, upload-time = "2026-02-28T10:08:20.685Z" }
+wheels = [
+    { url = "https://files.pythonhosted.org/packages/3e/95/c7c34aa53c16353c56d0b802fba48d5f5caa2cdee7958acbcb795c830416/isort-8.0.1-py3-none-any.whl", hash = "sha256:28b89bc70f751b559aeca209e6120393d43fbe2490de0559662be7a9787e3d75", size = 89733, upload-time = "2026-02-28T10:08:19.466Z" },
+]
+
 [[package]]
 name = "jaraco-classes"
 version = "3.4.0"
@@ -1048,6 +1191,18 @@ wheels = [
     { url = "https://files.pythonhosted.org/packages/b2/a3/e137168c9c44d18eff0376253da9f1e9234d0239e0ee230d2fee6cea8e55/jeepney-0.9.0-py3-none-any.whl", hash = "sha256:97e5714520c16fc0a45695e5365a2e11b81ea79bba796e26f9f1d178cb182683", size = 49010, upload-time = "2025-02-27T18:51:00.104Z" },
 ]
 
+[[package]]
+name = "jinja2"
+version = "3.1.6"
+source = { registry = "https://pypi.org/simple" }
+dependencies = [
+    { name = "markupsafe" },
+]
+sdist = { url = "https://files.pythonhosted.org/packages/df/bf/f7da0350254c0ed7c72f3e33cef02e048281fec7ecec5f032d4aac52226b/jinja2-3.1.6.tar.gz", hash = "sha256:0137fb05990d35f1275a587e9aee6d56da821fc83491a0fb838183be43f66d6d", size = 245115, upload-time = "2025-03-05T20:05:02.478Z" }
+wheels = [
+    { url = "https://files.pythonhosted.org/packages/62/a1/3d680cbfd5f4b8f15abc1d571870c5fc3e594bb582bc3b64ea099db13e56/jinja2-3.1.6-py3-none-any.whl", hash = "sha256:85ece4451f492d0c13c5dd7c13a64681a86afae63a5f347908daf103ce6d2f67", size = 134899, upload-time = "2025-03-05T20:05:00.369Z" },
+]
+
 [[package]]
 name = "jiter"
 version = "0.13.0"
@@ -1108,6 +1263,18 @@ wheels = [
     { url = "https://files.pythonhosted.org/packages/14/2f/967ba146e6d58cf6a652da73885f52fc68001525b4197effc174321d70b4/jmespath-1.1.0-py3-none-any.whl", hash = "sha256:a5663118de4908c91729bea0acadca56526eb2698e83de10cd116ae0f4e97c64", size = 20419, upload-time = "2026-01-22T16:35:24.919Z" },
 ]
 
+[[package]]
+name = "jsonpatch"
+version = "1.33"
+source = { registry = "https://pypi.org/simple" }
+dependencies = [
+    { name = "jsonpointer", marker = "python_full_version < '3.14'" },
+]
+sdist = { url = "https://files.pythonhosted.org/packages/42/78/18813351fe5d63acad16aec57f94ec2b70a09e53ca98145589e185423873/jsonpatch-1.33.tar.gz", hash = "sha256:9fcd4009c41e6d12348b4a0ff2563ba56a2923a7dfee731d004e212e1ee5030c", size = 21699, upload-time = "2023-06-26T12:07:29.144Z" }
+wheels = [
+    { url = "https://files.pythonhosted.org/packages/73/07/02e16ed01e04a374e644b575638ec7987ae846d25ad97bcc9945a3ee4b0e/jsonpatch-1.33-py2.py3-none-any.whl", hash = "sha256:0ae28c0cd062bbd8b8ecc26d7d164fbbea9652a1a3693f3b956c1eae5145dade", size = 12898, upload-time = "2023-06-16T21:01:28.466Z" },
+]
+
 [[package]]
 name = "jsonpath-python"
 version = "1.1.5"
@@ -1117,6 +1284,15 @@ wheels = [
     { url = "https://files.pythonhosted.org/packages/28/50/1a313fb700526b134c71eb8a225d8b83be0385dbb0204337b4379c698cef/jsonpath_python-1.1.5-py3-none-any.whl", hash = "sha256:a60315404d70a65e76c9a782c84e50600480221d94a58af47b7b4d437351cb4b", size = 14090, upload-time = "2026-03-17T06:16:39.152Z" },
 ]
 
+[[package]]
+name = "jsonpointer"
+version = "3.1.1"
+source = { registry = "https://pypi.org/simple" }
+sdist = { url = "https://files.pythonhosted.org/packages/18/c7/af399a2e7a67fd18d63c40c5e62d3af4e67b836a2107468b6a5ea24c4304/jsonpointer-3.1.1.tar.gz", hash = "sha256:0b801c7db33a904024f6004d526dcc53bbb8a4a0f4e32bfd10beadf60adf1900", size = 9068, upload-time = "2026-03-23T22:32:32.458Z" }
+wheels = [
+    { url = "https://files.pythonhosted.org/packages/9e/6a/a83720e953b1682d2d109d3c2dbb0bc9bf28cc1cbc205be4ef4be5da709d/jsonpointer-3.1.1-py3-none-any.whl", hash = "sha256:8ff8b95779d071ba472cf5bc913028df06031797532f08a7d5b602d8b2a488ca", size = 7659, upload-time = "2026-03-23T22:32:31.568Z" },
+]
+
 [[package]]
 name = "jsonref"
 version = "1.1.0"
@@ -1184,6 +1360,57 @@ wheels = [
     { url = "https://files.pythonhosted.org/packages/81/db/e655086b7f3a705df045bf0933bdd9c2f79bb3c97bfef1384598bb79a217/keyring-25.7.0-py3-none-any.whl", hash = "sha256:be4a0b195f149690c166e850609a477c532ddbfbaed96a404d4e43f8d5e2689f", size = 39160, upload-time = "2025-11-16T16:26:08.402Z" },
 ]
 
+[[package]]
+name = "langchain-core"
+version = "1.3.0"
+source = { registry = "https://pypi.org/simple" }
+dependencies = [
+    { name = "jsonpatch", marker = "python_full_version < '3.14'" },
+    { name = "langsmith", marker = "python_full_version < '3.14'" },
+    { name = "packaging", marker = "python_full_version < '3.14'" },
+    { name = "pydantic", marker = "python_full_version < '3.14'" },
+    { name = "pyyaml", marker = "python_full_version < '3.14'" },
+    { name = "tenacity", marker = "python_full_version < '3.14'" },
+    { name = "typing-extensions", marker = "python_full_version < '3.14'" },
+    { name = "uuid-utils", marker = "python_full_version < '3.14'" },
+]
+sdist = { url = "https://files.pythonhosted.org/packages/92/fe/20190232d9b513242899dbb0c2bb77e31b4d61e343743adbe90ebc2603d2/langchain_core-1.3.0.tar.gz", hash = "sha256:14a39f528bf459aa3aa40d0a7f7f1bae7520d435ef991ae14a4ceb74d8c49046", size = 860755, upload-time = "2026-04-17T14:51:38.298Z" }
+wheels = [
+    { url = "https://files.pythonhosted.org/packages/f8/e2/dbfa347aa072a6dc4cd38d6f9ebfc730b4c14c258c47f480f4c5c546f177/langchain_core-1.3.0-py3-none-any.whl", hash = "sha256:baf16ee028475df177b9ab8869a751c79406d64a6f12125b93802991b566cced", size = 515140, upload-time = "2026-04-17T14:51:36.274Z" },
+]
+
+[[package]]
+name = "langchain-text-splitters"
+version = "1.1.2"
+source = { registry = "https://pypi.org/simple" }
+dependencies = [
+    { name = "langchain-core", marker = "python_full_version < '3.14'" },
+]
+sdist = { url = "https://files.pythonhosted.org/packages/26/9f/6c545900fefb7b00ddfa3f16b80d61338a0ec68c31c5451eeeab99082760/langchain_text_splitters-1.1.2.tar.gz", hash = "sha256:782a723db0a4746ac91e251c7c1d57fd23636e4f38ed733074e28d7a86f41627", size = 293580, upload-time = "2026-04-16T14:20:39.162Z" }
+wheels = [
+    { url = "https://files.pythonhosted.org/packages/d3/26/1ef06f56198d631296d646a6223de35bcc6cf9795ceb2442816bc963b84c/langchain_text_splitters-1.1.2-py3-none-any.whl", hash = "sha256:a2de0d799ff31886429fd6e2e0032df275b60ec817c19059a7b46181cc1c2f10", size = 35903, upload-time = "2026-04-16T14:20:38.243Z" },
+]
+
+[[package]]
+name = "langsmith"
+version = "0.7.32"
+source = { registry = "https://pypi.org/simple" }
+dependencies = [
+    { name = "httpx", marker = "python_full_version < '3.14'" },
+    { name = "orjson", marker = "python_full_version < '3.14' and platform_python_implementation != 'PyPy'" },
+    { name = "packaging", marker = "python_full_version < '3.14'" },
+    { name = "pydantic", marker = "python_full_version < '3.14'" },
+    { name = "requests", marker = "python_full_version < '3.14'" },
+    { name = "requests-toolbelt", marker = "python_full_version < '3.14'" },
+    { name = "uuid-utils", marker = "python_full_version < '3.14'" },
+    { name = "xxhash", marker = "python_full_version < '3.14'" },
+    { name = "zstandard", marker = "python_full_version < '3.14'" },
+]
+sdist = { url = "https://files.pythonhosted.org/packages/2f/b4/a0b4a501bee6b8a741ce29f8c48155b132118483cddc6f9247735ddb38fa/langsmith-0.7.32.tar.gz", hash = "sha256:b59b8e106d0e4c4842e158229296086e2aa7c561e3f602acda73d3ad0062e915", size = 1184518, upload-time = "2026-04-15T23:42:41.885Z" }
+wheels = [
+    { url = "https://files.pythonhosted.org/packages/62/bc/148f98ac7dad73ac5e1b1c985290079cfeeb9ba13d760a24f25002beb2c9/langsmith-0.7.32-py3-none-any.whl", hash = "sha256:e1fde928990c4c52f47dc5132708cec674355d9101723d564183e965f383bf5f", size = 378272, upload-time = "2026-04-15T23:42:39.905Z" },
+]
+
 [[package]]
 name = "logfire"
 version = "4.30.0"
@@ -1228,6 +1455,58 @@ wheels = [
     { url = "https://files.pythonhosted.org/packages/94/54/e7d793b573f298e1c9013b8c4dade17d481164aa517d1d7148619c2cedbf/markdown_it_py-4.0.0-py3-none-any.whl", hash = "sha256:87327c59b172c5011896038353a81343b6754500a08cd7a4973bb48c6d578147", size = 87321, upload-time = "2025-08-11T12:57:51.923Z" },
 ]
 
+[[package]]
+name = "markupsafe"
+version = "3.0.3"
+source = { registry = "https://pypi.org/simple" }
+sdist = { url = "https://files.pythonhosted.org/packages/7e/99/7690b6d4034fffd95959cbe0c02de8deb3098cc577c67bb6a24fe5d7caa7/markupsafe-3.0.3.tar.gz", hash = "sha256:722695808f4b6457b320fdc131280796bdceb04ab50fe1795cd540799ebe1698", size = 80313, upload-time = "2025-09-27T18:37:40.426Z" }
+wheels = [
+    { url = "https://files.pythonhosted.org/packages/38/2f/907b9c7bbba283e68f20259574b13d005c121a0fa4c175f9bed27c4597ff/markupsafe-3.0.3-cp313-cp313-macosx_10_13_x86_64.whl", hash = "sha256:e1cf1972137e83c5d4c136c43ced9ac51d0e124706ee1c8aa8532c1287fa8795", size = 11622, upload-time = "2025-09-27T18:36:41.777Z" },
+    { url = "https://files.pythonhosted.org/packages/9c/d9/5f7756922cdd676869eca1c4e3c0cd0df60ed30199ffd775e319089cb3ed/markupsafe-3.0.3-cp313-cp313-macosx_11_0_arm64.whl", hash = "sha256:116bb52f642a37c115f517494ea5feb03889e04df47eeff5b130b1808ce7c219", size = 12029, upload-time = "2025-09-27T18:36:43.257Z" },
+    { url = "https://files.pythonhosted.org/packages/00/07/575a68c754943058c78f30db02ee03a64b3c638586fba6a6dd56830b30a3/markupsafe-3.0.3-cp313-cp313-manylinux2014_aarch64.manylinux_2_17_aarch64.manylinux_2_28_aarch64.whl", hash = "sha256:133a43e73a802c5562be9bbcd03d090aa5a1fe899db609c29e8c8d815c5f6de6", size = 24374, upload-time = "2025-09-27T18:36:44.508Z" },
+    { url = "https://files.pythonhosted.org/packages/a9/21/9b05698b46f218fc0e118e1f8168395c65c8a2c750ae2bab54fc4bd4e0e8/markupsafe-3.0.3-cp313-cp313-manylinux2014_x86_64.manylinux_2_17_x86_64.manylinux_2_28_x86_64.whl", hash = "sha256:ccfcd093f13f0f0b7fdd0f198b90053bf7b2f02a3927a30e63f3ccc9df56b676", size = 22980, upload-time = "2025-09-27T18:36:45.385Z" },
+    { url = "https://files.pythonhosted.org/packages/7f/71/544260864f893f18b6827315b988c146b559391e6e7e8f7252839b1b846a/markupsafe-3.0.3-cp313-cp313-manylinux_2_31_riscv64.manylinux_2_39_riscv64.whl", hash = "sha256:509fa21c6deb7a7a273d629cf5ec029bc209d1a51178615ddf718f5918992ab9", size = 21990, upload-time = "2025-09-27T18:36:46.916Z" },
+    { url = "https://files.pythonhosted.org/packages/c2/28/b50fc2f74d1ad761af2f5dcce7492648b983d00a65b8c0e0cb457c82ebbe/markupsafe-3.0.3-cp313-cp313-musllinux_1_2_aarch64.whl", hash = "sha256:a4afe79fb3de0b7097d81da19090f4df4f8d3a2b3adaa8764138aac2e44f3af1", size = 23784, upload-time = "2025-09-27T18:36:47.884Z" },
+    { url = "https://files.pythonhosted.org/packages/ed/76/104b2aa106a208da8b17a2fb72e033a5a9d7073c68f7e508b94916ed47a9/markupsafe-3.0.3-cp313-cp313-musllinux_1_2_riscv64.whl", hash = "sha256:795e7751525cae078558e679d646ae45574b47ed6e7771863fcc079a6171a0fc", size = 21588, upload-time = "2025-09-27T18:36:48.82Z" },
+    { url = "https://files.pythonhosted.org/packages/b5/99/16a5eb2d140087ebd97180d95249b00a03aa87e29cc224056274f2e45fd6/markupsafe-3.0.3-cp313-cp313-musllinux_1_2_x86_64.whl", hash = "sha256:8485f406a96febb5140bfeca44a73e3ce5116b2501ac54fe953e488fb1d03b12", size = 23041, upload-time = "2025-09-27T18:36:49.797Z" },
+    { url = "https://files.pythonhosted.org/packages/19/bc/e7140ed90c5d61d77cea142eed9f9c303f4c4806f60a1044c13e3f1471d0/markupsafe-3.0.3-cp313-cp313-win32.whl", hash = "sha256:bdd37121970bfd8be76c5fb069c7751683bdf373db1ed6c010162b2a130248ed", size = 14543, upload-time = "2025-09-27T18:36:51.584Z" },
+    { url = "https://files.pythonhosted.org/packages/05/73/c4abe620b841b6b791f2edc248f556900667a5a1cf023a6646967ae98335/markupsafe-3.0.3-cp313-cp313-win_amd64.whl", hash = "sha256:9a1abfdc021a164803f4d485104931fb8f8c1efd55bc6b748d2f5774e78b62c5", size = 15113, upload-time = "2025-09-27T18:36:52.537Z" },
+    { url = "https://files.pythonhosted.org/packages/f0/3a/fa34a0f7cfef23cf9500d68cb7c32dd64ffd58a12b09225fb03dd37d5b80/markupsafe-3.0.3-cp313-cp313-win_arm64.whl", hash = "sha256:7e68f88e5b8799aa49c85cd116c932a1ac15caaa3f5db09087854d218359e485", size = 13911, upload-time = "2025-09-27T18:36:53.513Z" },
+    { url = "https://files.pythonhosted.org/packages/e4/d7/e05cd7efe43a88a17a37b3ae96e79a19e846f3f456fe79c57ca61356ef01/markupsafe-3.0.3-cp313-cp313t-macosx_10_13_x86_64.whl", hash = "sha256:218551f6df4868a8d527e3062d0fb968682fe92054e89978594c28e642c43a73", size = 11658, upload-time = "2025-09-27T18:36:54.819Z" },
+    { url = "https://files.pythonhosted.org/packages/99/9e/e412117548182ce2148bdeacdda3bb494260c0b0184360fe0d56389b523b/markupsafe-3.0.3-cp313-cp313t-macosx_11_0_arm64.whl", hash = "sha256:3524b778fe5cfb3452a09d31e7b5adefeea8c5be1d43c4f810ba09f2ceb29d37", size = 12066, upload-time = "2025-09-27T18:36:55.714Z" },
+    { url = "https://files.pythonhosted.org/packages/bc/e6/fa0ffcda717ef64a5108eaa7b4f5ed28d56122c9a6d70ab8b72f9f715c80/markupsafe-3.0.3-cp313-cp313t-manylinux2014_aarch64.manylinux_2_17_aarch64.manylinux_2_28_aarch64.whl", hash = "sha256:4e885a3d1efa2eadc93c894a21770e4bc67899e3543680313b09f139e149ab19", size = 25639, upload-time = "2025-09-27T18:36:56.908Z" },
+    { url = "https://files.pythonhosted.org/packages/96/ec/2102e881fe9d25fc16cb4b25d5f5cde50970967ffa5dddafdb771237062d/markupsafe-3.0.3-cp313-cp313t-manylinux2014_x86_64.manylinux_2_17_x86_64.manylinux_2_28_x86_64.whl", hash = "sha256:8709b08f4a89aa7586de0aadc8da56180242ee0ada3999749b183aa23df95025", size = 23569, upload-time = "2025-09-27T18:36:57.913Z" },
+    { url = "https://files.pythonhosted.org/packages/4b/30/6f2fce1f1f205fc9323255b216ca8a235b15860c34b6798f810f05828e32/markupsafe-3.0.3-cp313-cp313t-manylinux_2_31_riscv64.manylinux_2_39_riscv64.whl", hash = "sha256:b8512a91625c9b3da6f127803b166b629725e68af71f8184ae7e7d54686a56d6", size = 23284, upload-time = "2025-09-27T18:36:58.833Z" },
+    { url = "https://files.pythonhosted.org/packages/58/47/4a0ccea4ab9f5dcb6f79c0236d954acb382202721e704223a8aafa38b5c8/markupsafe-3.0.3-cp313-cp313t-musllinux_1_2_aarch64.whl", hash = "sha256:9b79b7a16f7fedff2495d684f2b59b0457c3b493778c9eed31111be64d58279f", size = 24801, upload-time = "2025-09-27T18:36:59.739Z" },
+    { url = "https://files.pythonhosted.org/packages/6a/70/3780e9b72180b6fecb83a4814d84c3bf4b4ae4bf0b19c27196104149734c/markupsafe-3.0.3-cp313-cp313t-musllinux_1_2_riscv64.whl", hash = "sha256:12c63dfb4a98206f045aa9563db46507995f7ef6d83b2f68eda65c307c6829eb", size = 22769, upload-time = "2025-09-27T18:37:00.719Z" },
+    { url = "https://files.pythonhosted.org/packages/98/c5/c03c7f4125180fc215220c035beac6b9cb684bc7a067c84fc69414d315f5/markupsafe-3.0.3-cp313-cp313t-musllinux_1_2_x86_64.whl", hash = "sha256:8f71bc33915be5186016f675cd83a1e08523649b0e33efdb898db577ef5bb009", size = 23642, upload-time = "2025-09-27T18:37:01.673Z" },
+    { url = "https://files.pythonhosted.org/packages/80/d6/2d1b89f6ca4bff1036499b1e29a1d02d282259f3681540e16563f27ebc23/markupsafe-3.0.3-cp313-cp313t-win32.whl", hash = "sha256:69c0b73548bc525c8cb9a251cddf1931d1db4d2258e9599c28c07ef3580ef354", size = 14612, upload-time = "2025-09-27T18:37:02.639Z" },
+    { url = "https://files.pythonhosted.org/packages/2b/98/e48a4bfba0a0ffcf9925fe2d69240bfaa19c6f7507b8cd09c70684a53c1e/markupsafe-3.0.3-cp313-cp313t-win_amd64.whl", hash = "sha256:1b4b79e8ebf6b55351f0d91fe80f893b4743f104bff22e90697db1590e47a218", size = 15200, upload-time = "2025-09-27T18:37:03.582Z" },
+    { url = "https://files.pythonhosted.org/packages/0e/72/e3cc540f351f316e9ed0f092757459afbc595824ca724cbc5a5d4263713f/markupsafe-3.0.3-cp313-cp313t-win_arm64.whl", hash = "sha256:ad2cf8aa28b8c020ab2fc8287b0f823d0a7d8630784c31e9ee5edea20f406287", size = 13973, upload-time = "2025-09-27T18:37:04.929Z" },
+    { url = "https://files.pythonhosted.org/packages/33/8a/8e42d4838cd89b7dde187011e97fe6c3af66d8c044997d2183fbd6d31352/markupsafe-3.0.3-cp314-cp314-macosx_10_13_x86_64.whl", hash = "sha256:eaa9599de571d72e2daf60164784109f19978b327a3910d3e9de8c97b5b70cfe", size = 11619, upload-time = "2025-09-27T18:37:06.342Z" },
+    { url = "https://files.pythonhosted.org/packages/b5/64/7660f8a4a8e53c924d0fa05dc3a55c9cee10bbd82b11c5afb27d44b096ce/markupsafe-3.0.3-cp314-cp314-macosx_11_0_arm64.whl", hash = "sha256:c47a551199eb8eb2121d4f0f15ae0f923d31350ab9280078d1e5f12b249e0026", size = 12029, upload-time = "2025-09-27T18:37:07.213Z" },
+    { url = "https://files.pythonhosted.org/packages/da/ef/e648bfd021127bef5fa12e1720ffed0c6cbb8310c8d9bea7266337ff06de/markupsafe-3.0.3-cp314-cp314-manylinux2014_aarch64.manylinux_2_17_aarch64.manylinux_2_28_aarch64.whl", hash = "sha256:f34c41761022dd093b4b6896d4810782ffbabe30f2d443ff5f083e0cbbb8c737", size = 24408, upload-time = "2025-09-27T18:37:09.572Z" },
+    { url = "https://files.pythonhosted.org/packages/41/3c/a36c2450754618e62008bf7435ccb0f88053e07592e6028a34776213d877/markupsafe-3.0.3-cp314-cp314-manylinux2014_x86_64.manylinux_2_17_x86_64.manylinux_2_28_x86_64.whl", hash = "sha256:457a69a9577064c05a97c41f4e65148652db078a3a509039e64d3467b9e7ef97", size = 23005, upload-time = "2025-09-27T18:37:10.58Z" },
+    { url = "https://files.pythonhosted.org/packages/bc/20/b7fdf89a8456b099837cd1dc21974632a02a999ec9bf7ca3e490aacd98e7/markupsafe-3.0.3-cp314-cp314-manylinux_2_31_riscv64.manylinux_2_39_riscv64.whl", hash = "sha256:e8afc3f2ccfa24215f8cb28dcf43f0113ac3c37c2f0f0806d8c70e4228c5cf4d", size = 22048, upload-time = "2025-09-27T18:37:11.547Z" },
+    { url = "https://files.pythonhosted.org/packages/9a/a7/591f592afdc734f47db08a75793a55d7fbcc6902a723ae4cfbab61010cc5/markupsafe-3.0.3-cp314-cp314-musllinux_1_2_aarch64.whl", hash = "sha256:ec15a59cf5af7be74194f7ab02d0f59a62bdcf1a537677ce67a2537c9b87fcda", size = 23821, upload-time = "2025-09-27T18:37:12.48Z" },
+    { url = "https://files.pythonhosted.org/packages/7d/33/45b24e4f44195b26521bc6f1a82197118f74df348556594bd2262bda1038/markupsafe-3.0.3-cp314-cp314-musllinux_1_2_riscv64.whl", hash = "sha256:0eb9ff8191e8498cca014656ae6b8d61f39da5f95b488805da4bb029cccbfbaf", size = 21606, upload-time = "2025-09-27T18:37:13.485Z" },
+    { url = "https://files.pythonhosted.org/packages/ff/0e/53dfaca23a69fbfbbf17a4b64072090e70717344c52eaaaa9c5ddff1e5f0/markupsafe-3.0.3-cp314-cp314-musllinux_1_2_x86_64.whl", hash = "sha256:2713baf880df847f2bece4230d4d094280f4e67b1e813eec43b4c0e144a34ffe", size = 23043, upload-time = "2025-09-27T18:37:14.408Z" },
+    { url = "https://files.pythonhosted.org/packages/46/11/f333a06fc16236d5238bfe74daccbca41459dcd8d1fa952e8fbd5dccfb70/markupsafe-3.0.3-cp314-cp314-win32.whl", hash = "sha256:729586769a26dbceff69f7a7dbbf59ab6572b99d94576a5592625d5b411576b9", size = 14747, upload-time = "2025-09-27T18:37:15.36Z" },
+    { url = "https://files.pythonhosted.org/packages/28/52/182836104b33b444e400b14f797212f720cbc9ed6ba34c800639d154e821/markupsafe-3.0.3-cp314-cp314-win_amd64.whl", hash = "sha256:bdc919ead48f234740ad807933cdf545180bfbe9342c2bb451556db2ed958581", size = 15341, upload-time = "2025-09-27T18:37:16.496Z" },
+    { url = "https://files.pythonhosted.org/packages/6f/18/acf23e91bd94fd7b3031558b1f013adfa21a8e407a3fdb32745538730382/markupsafe-3.0.3-cp314-cp314-win_arm64.whl", hash = "sha256:5a7d5dc5140555cf21a6fefbdbf8723f06fcd2f63ef108f2854de715e4422cb4", size = 14073, upload-time = "2025-09-27T18:37:17.476Z" },
+    { url = "https://files.pythonhosted.org/packages/3c/f0/57689aa4076e1b43b15fdfa646b04653969d50cf30c32a102762be2485da/markupsafe-3.0.3-cp314-cp314t-macosx_10_13_x86_64.whl", hash = "sha256:1353ef0c1b138e1907ae78e2f6c63ff67501122006b0f9abad68fda5f4ffc6ab", size = 11661, upload-time = "2025-09-27T18:37:18.453Z" },
+    { url = "https://files.pythonhosted.org/packages/89/c3/2e67a7ca217c6912985ec766c6393b636fb0c2344443ff9d91404dc4c79f/markupsafe-3.0.3-cp314-cp314t-macosx_11_0_arm64.whl", hash = "sha256:1085e7fbddd3be5f89cc898938f42c0b3c711fdcb37d75221de2666af647c175", size = 12069, upload-time = "2025-09-27T18:37:19.332Z" },
+    { url = "https://files.pythonhosted.org/packages/f0/00/be561dce4e6ca66b15276e184ce4b8aec61fe83662cce2f7d72bd3249d28/markupsafe-3.0.3-cp314-cp314t-manylinux2014_aarch64.manylinux_2_17_aarch64.manylinux_2_28_aarch64.whl", hash = "sha256:1b52b4fb9df4eb9ae465f8d0c228a00624de2334f216f178a995ccdcf82c4634", size = 25670, upload-time = "2025-09-27T18:37:20.245Z" },
+    { url = "https://files.pythonhosted.org/packages/50/09/c419f6f5a92e5fadde27efd190eca90f05e1261b10dbd8cbcb39cd8ea1dc/markupsafe-3.0.3-cp314-cp314t-manylinux2014_x86_64.manylinux_2_17_x86_64.manylinux_2_28_x86_64.whl", hash = "sha256:fed51ac40f757d41b7c48425901843666a6677e3e8eb0abcff09e4ba6e664f50", size = 23598, upload-time = "2025-09-27T18:37:21.177Z" },
+    { url = "https://files.pythonhosted.org/packages/22/44/a0681611106e0b2921b3033fc19bc53323e0b50bc70cffdd19f7d679bb66/markupsafe-3.0.3-cp314-cp314t-manylinux_2_31_riscv64.manylinux_2_39_riscv64.whl", hash = "sha256:f190daf01f13c72eac4efd5c430a8de82489d9cff23c364c3ea822545032993e", size = 23261, upload-time = "2025-09-27T18:37:22.167Z" },
+    { url = "https://files.pythonhosted.org/packages/5f/57/1b0b3f100259dc9fffe780cfb60d4be71375510e435efec3d116b6436d43/markupsafe-3.0.3-cp314-cp314t-musllinux_1_2_aarch64.whl", hash = "sha256:e56b7d45a839a697b5eb268c82a71bd8c7f6c94d6fd50c3d577fa39a9f1409f5", size = 24835, upload-time = "2025-09-27T18:37:23.296Z" },
+    { url = "https://files.pythonhosted.org/packages/26/6a/4bf6d0c97c4920f1597cc14dd720705eca0bf7c787aebc6bb4d1bead5388/markupsafe-3.0.3-cp314-cp314t-musllinux_1_2_riscv64.whl", hash = "sha256:f3e98bb3798ead92273dc0e5fd0f31ade220f59a266ffd8a4f6065e0a3ce0523", size = 22733, upload-time = "2025-09-27T18:37:24.237Z" },
+    { url = "https://files.pythonhosted.org/packages/14/c7/ca723101509b518797fedc2fdf79ba57f886b4aca8a7d31857ba3ee8281f/markupsafe-3.0.3-cp314-cp314t-musllinux_1_2_x86_64.whl", hash = "sha256:5678211cb9333a6468fb8d8be0305520aa073f50d17f089b5b4b477ea6e67fdc", size = 23672, upload-time = "2025-09-27T18:37:25.271Z" },
+    { url = "https://files.pythonhosted.org/packages/fb/df/5bd7a48c256faecd1d36edc13133e51397e41b73bb77e1a69deab746ebac/markupsafe-3.0.3-cp314-cp314t-win32.whl", hash = "sha256:915c04ba3851909ce68ccc2b8e2cd691618c4dc4c4232fb7982bca3f41fd8c3d", size = 14819, upload-time = "2025-09-27T18:37:26.285Z" },
+    { url = "https://files.pythonhosted.org/packages/1a/8a/0402ba61a2f16038b48b39bccca271134be00c5c9f0f623208399333c448/markupsafe-3.0.3-cp314-cp314t-win_amd64.whl", hash = "sha256:4faffd047e07c38848ce017e8725090413cd80cbc23d86e55c587bf979e579c9", size = 15426, upload-time = "2025-09-27T18:37:27.316Z" },
+    { url = "https://files.pythonhosted.org/packages/70/bc/6f1c2f612465f5fa89b95bead1f44dcb607670fd42891d8fdcd5d039f4f4/markupsafe-3.0.3-cp314-cp314t-win_arm64.whl", hash = "sha256:32001d6a8fc98c8cb5c947787c5d08b0a50663d139f1305bac5885d98d9b40fa", size = 14146, upload-time = "2025-09-27T18:37:28.327Z" },
+]
+
 [[package]]
 name = "mcp"
 version = "1.26.0"
@@ -1371,6 +1650,15 @@ wheels = [
     { url = "https://files.pythonhosted.org/packages/81/08/7036c080d7117f28a4af526d794aab6a84463126db031b007717c1a6676e/multidict-6.7.1-py3-none-any.whl", hash = "sha256:55d97cc6dae627efa6a6e548885712d4864b81110ac76fa4e534c03819fa4a56", size = 12319, upload-time = "2026-01-26T02:46:44.004Z" },
 ]
 
+[[package]]
+name = "mypy-extensions"
+version = "1.1.0"
+source = { registry = "https://pypi.org/simple" }
+sdist = { url = "https://files.pythonhosted.org/packages/a2/6e/371856a3fb9d31ca8dac321cda606860fa4548858c0cc45d9d1d4ca2628b/mypy_extensions-1.1.0.tar.gz", hash = "sha256:52e68efc3284861e772bbcd66823fde5ae21fd2fdb51c62a211403730b916558", size = 6343, upload-time = "2025-04-22T14:54:24.164Z" }
+wheels = [
+    { url = "https://files.pythonhosted.org/packages/79/7b/2c79738432f5c924bef5071f933bcc9efd0473bac3b4aa584a6f7c1c8df8/mypy_extensions-1.1.0-py3-none-any.whl", hash = "sha256:1be4cccdb0f2482337c4743e60421de3a356cd97508abadd57d47403e94f5505", size = 4963, upload-time = "2025-04-22T14:54:22.983Z" },
+]
+
 [[package]]
 name = "nexus-rpc"
 version = "1.2.0"
@@ -1392,6 +1680,56 @@ wheels = [
     { url = "https://files.pythonhosted.org/packages/88/b2/d0896bdcdc8d28a7fc5717c305f1a861c26e18c05047949fb371034d98bd/nodeenv-1.10.0-py2.py3-none-any.whl", hash = "sha256:5bb13e3eed2923615535339b3c620e76779af4cb4c6a90deccc9e36b274d3827", size = 23438, upload-time = "2025-12-20T14:08:52.782Z" },
 ]
 
+[[package]]
+name = "numpy"
+version = "2.4.4"
+source = { registry = "https://pypi.org/simple" }
+sdist = { url = "https://files.pythonhosted.org/packages/d7/9f/b8cef5bffa569759033adda9481211426f12f53299629b410340795c2514/numpy-2.4.4.tar.gz", hash = "sha256:2d390634c5182175533585cc89f3608a4682ccb173cc9bb940b2881c8d6f8fa0", size = 20731587, upload-time = "2026-03-29T13:22:01.298Z" }
+wheels = [
+    { url = "https://files.pythonhosted.org/packages/14/1d/d0a583ce4fefcc3308806a749a536c201ed6b5ad6e1322e227ee4848979d/numpy-2.4.4-cp313-cp313-macosx_10_13_x86_64.whl", hash = "sha256:08f2e31ed5e6f04b118e49821397f12767934cfdd12a1ce86a058f91e004ee50", size = 16684933, upload-time = "2026-03-29T13:19:22.47Z" },
+    { url = "https://files.pythonhosted.org/packages/c1/62/2b7a48fbb745d344742c0277f01286dead15f3f68e4f359fbfcf7b48f70f/numpy-2.4.4-cp313-cp313-macosx_11_0_arm64.whl", hash = "sha256:e823b8b6edc81e747526f70f71a9c0a07ac4e7ad13020aa736bb7c9d67196115", size = 14694532, upload-time = "2026-03-29T13:19:25.581Z" },
+    { url = "https://files.pythonhosted.org/packages/e5/87/499737bfba066b4a3bebff24a8f1c5b2dee410b209bc6668c9be692580f0/numpy-2.4.4-cp313-cp313-macosx_14_0_arm64.whl", hash = "sha256:4a19d9dba1a76618dd86b164d608566f393f8ec6ac7c44f0cc879011c45e65af", size = 5199661, upload-time = "2026-03-29T13:19:28.31Z" },
+    { url = "https://files.pythonhosted.org/packages/cd/da/464d551604320d1491bc345efed99b4b7034143a85787aab78d5691d5a0e/numpy-2.4.4-cp313-cp313-macosx_14_0_x86_64.whl", hash = "sha256:d2a8490669bfe99a233298348acc2d824d496dee0e66e31b66a6022c2ad74a5c", size = 6547539, upload-time = "2026-03-29T13:19:30.97Z" },
+    { url = "https://files.pythonhosted.org/packages/7d/90/8d23e3b0dafd024bf31bdec225b3bb5c2dbfa6912f8a53b8659f21216cbf/numpy-2.4.4-cp313-cp313-manylinux_2_27_aarch64.manylinux_2_28_aarch64.whl", hash = "sha256:45dbed2ab436a9e826e302fcdcbe9133f9b0006e5af7168afb8963a6520da103", size = 15668806, upload-time = "2026-03-29T13:19:33.887Z" },
+    { url = "https://files.pythonhosted.org/packages/d1/73/a9d864e42a01896bb5974475438f16086be9ba1f0d19d0bb7a07427c4a8b/numpy-2.4.4-cp313-cp313-manylinux_2_27_x86_64.manylinux_2_28_x86_64.whl", hash = "sha256:c901b15172510173f5cb310eae652908340f8dede90fff9e3bf6c0d8dfd92f83", size = 16632682, upload-time = "2026-03-29T13:19:37.336Z" },
+    { url = "https://files.pythonhosted.org/packages/34/fb/14570d65c3bde4e202a031210475ae9cde9b7686a2e7dc97ee67d2833b35/numpy-2.4.4-cp313-cp313-musllinux_1_2_aarch64.whl", hash = "sha256:99d838547ace2c4aace6c4f76e879ddfe02bb58a80c1549928477862b7a6d6ed", size = 17019810, upload-time = "2026-03-29T13:19:40.963Z" },
+    { url = "https://files.pythonhosted.org/packages/8a/77/2ba9d87081fd41f6d640c83f26fb7351e536b7ce6dd9061b6af5904e8e46/numpy-2.4.4-cp313-cp313-musllinux_1_2_x86_64.whl", hash = "sha256:0aec54fd785890ecca25a6003fd9a5aed47ad607bbac5cd64f836ad8666f4959", size = 18357394, upload-time = "2026-03-29T13:19:44.859Z" },
+    { url = "https://files.pythonhosted.org/packages/a2/23/52666c9a41708b0853fa3b1a12c90da38c507a3074883823126d4e9d5b30/numpy-2.4.4-cp313-cp313-win32.whl", hash = "sha256:07077278157d02f65c43b1b26a3886bce886f95d20aabd11f87932750dfb14ed", size = 5959556, upload-time = "2026-03-29T13:19:47.661Z" },
+    { url = "https://files.pythonhosted.org/packages/57/fb/48649b4971cde70d817cf97a2a2fdc0b4d8308569f1dd2f2611959d2e0cf/numpy-2.4.4-cp313-cp313-win_amd64.whl", hash = "sha256:5c70f1cc1c4efbe316a572e2d8b9b9cc44e89b95f79ca3331553fbb63716e2bf", size = 12317311, upload-time = "2026-03-29T13:19:50.67Z" },
+    { url = "https://files.pythonhosted.org/packages/ba/d8/11490cddd564eb4de97b4579ef6bfe6a736cc07e94c1598590ae25415e01/numpy-2.4.4-cp313-cp313-win_arm64.whl", hash = "sha256:ef4059d6e5152fa1a39f888e344c73fdc926e1b2dd58c771d67b0acfbf2aa67d", size = 10222060, upload-time = "2026-03-29T13:19:54.229Z" },
+    { url = "https://files.pythonhosted.org/packages/99/5d/dab4339177a905aad3e2221c915b35202f1ec30d750dd2e5e9d9a72b804b/numpy-2.4.4-cp313-cp313t-macosx_11_0_arm64.whl", hash = "sha256:4bbc7f303d125971f60ec0aaad5e12c62d0d2c925f0ab1273debd0e4ba37aba5", size = 14822302, upload-time = "2026-03-29T13:19:57.585Z" },
+    { url = "https://files.pythonhosted.org/packages/eb/e4/0564a65e7d3d97562ed6f9b0fd0fb0a6f559ee444092f105938b50043876/numpy-2.4.4-cp313-cp313t-macosx_14_0_arm64.whl", hash = "sha256:4d6d57903571f86180eb98f8f0c839fa9ebbfb031356d87f1361be91e433f5b7", size = 5327407, upload-time = "2026-03-29T13:20:00.601Z" },
+    { url = "https://files.pythonhosted.org/packages/29/8d/35a3a6ce5ad371afa58b4700f1c820f8f279948cca32524e0a695b0ded83/numpy-2.4.4-cp313-cp313t-macosx_14_0_x86_64.whl", hash = "sha256:4636de7fd195197b7535f231b5de9e4b36d2c440b6e566d2e4e4746e6af0ca93", size = 6647631, upload-time = "2026-03-29T13:20:02.855Z" },
+    { url = "https://files.pythonhosted.org/packages/f4/da/477731acbd5a58a946c736edfdabb2ac5b34c3d08d1ba1a7b437fa0884df/numpy-2.4.4-cp313-cp313t-manylinux_2_27_aarch64.manylinux_2_28_aarch64.whl", hash = "sha256:ad2e2ef14e0b04e544ea2fa0a36463f847f113d314aa02e5b402fdf910ef309e", size = 15727691, upload-time = "2026-03-29T13:20:06.004Z" },
+    { url = "https://files.pythonhosted.org/packages/e6/db/338535d9b152beabeb511579598418ba0212ce77cf9718edd70262cc4370/numpy-2.4.4-cp313-cp313t-manylinux_2_27_x86_64.manylinux_2_28_x86_64.whl", hash = "sha256:5a285b3b96f951841799528cd1f4f01cd70e7e0204b4abebac9463eecfcf2a40", size = 16681241, upload-time = "2026-03-29T13:20:09.417Z" },
+    { url = "https://files.pythonhosted.org/packages/e2/a9/ad248e8f58beb7a0219b413c9c7d8151c5d285f7f946c3e26695bdbbe2df/numpy-2.4.4-cp313-cp313t-musllinux_1_2_aarch64.whl", hash = "sha256:f8474c4241bc18b750be2abea9d7a9ec84f46ef861dbacf86a4f6e043401f79e", size = 17085767, upload-time = "2026-03-29T13:20:13.126Z" },
+    { url = "https://files.pythonhosted.org/packages/b5/1a/3b88ccd3694681356f70da841630e4725a7264d6a885c8d442a697e1146b/numpy-2.4.4-cp313-cp313t-musllinux_1_2_x86_64.whl", hash = "sha256:4e874c976154687c1f71715b034739b45c7711bec81db01914770373d125e392", size = 18403169, upload-time = "2026-03-29T13:20:17.096Z" },
+    { url = "https://files.pythonhosted.org/packages/c2/c9/fcfd5d0639222c6eac7f304829b04892ef51c96a75d479214d77e3ce6e33/numpy-2.4.4-cp313-cp313t-win32.whl", hash = "sha256:9c585a1790d5436a5374bac930dad6ed244c046ed91b2b2a3634eb2971d21008", size = 6083477, upload-time = "2026-03-29T13:20:20.195Z" },
+    { url = "https://files.pythonhosted.org/packages/d5/e3/3938a61d1c538aaec8ed6fd6323f57b0c2d2d2219512434c5c878db76553/numpy-2.4.4-cp313-cp313t-win_amd64.whl", hash = "sha256:93e15038125dc1e5345d9b5b68aa7f996ec33b98118d18c6ca0d0b7d6198b7e8", size = 12457487, upload-time = "2026-03-29T13:20:22.946Z" },
+    { url = "https://files.pythonhosted.org/packages/97/6a/7e345032cc60501721ef94e0e30b60f6b0bd601f9174ebd36389a2b86d40/numpy-2.4.4-cp313-cp313t-win_arm64.whl", hash = "sha256:0dfd3f9d3adbe2920b68b5cd3d51444e13a10792ec7154cd0a2f6e74d4ab3233", size = 10292002, upload-time = "2026-03-29T13:20:25.909Z" },
+    { url = "https://files.pythonhosted.org/packages/6e/06/c54062f85f673dd5c04cbe2f14c3acb8c8b95e3384869bb8cc9bff8cb9df/numpy-2.4.4-cp314-cp314-macosx_10_15_x86_64.whl", hash = "sha256:f169b9a863d34f5d11b8698ead99febeaa17a13ca044961aa8e2662a6c7766a0", size = 16684353, upload-time = "2026-03-29T13:20:29.504Z" },
+    { url = "https://files.pythonhosted.org/packages/4c/39/8a320264a84404c74cc7e79715de85d6130fa07a0898f67fb5cd5bd79908/numpy-2.4.4-cp314-cp314-macosx_11_0_arm64.whl", hash = "sha256:2483e4584a1cb3092da4470b38866634bafb223cbcd551ee047633fd2584599a", size = 14704914, upload-time = "2026-03-29T13:20:33.547Z" },
+    { url = "https://files.pythonhosted.org/packages/91/fb/287076b2614e1d1044235f50f03748f31fa287e3dbe6abeb35cdfa351eca/numpy-2.4.4-cp314-cp314-macosx_14_0_arm64.whl", hash = "sha256:2d19e6e2095506d1736b7d80595e0f252d76b89f5e715c35e06e937679ea7d7a", size = 5210005, upload-time = "2026-03-29T13:20:36.45Z" },
+    { url = "https://files.pythonhosted.org/packages/63/eb/fcc338595309910de6ecabfcef2419a9ce24399680bfb149421fa2df1280/numpy-2.4.4-cp314-cp314-macosx_14_0_x86_64.whl", hash = "sha256:6a246d5914aa1c820c9443ddcee9c02bec3e203b0c080349533fae17727dfd1b", size = 6544974, upload-time = "2026-03-29T13:20:39.014Z" },
+    { url = "https://files.pythonhosted.org/packages/44/5d/e7e9044032a716cdfaa3fba27a8e874bf1c5f1912a1ddd4ed071bf8a14a6/numpy-2.4.4-cp314-cp314-manylinux_2_27_aarch64.manylinux_2_28_aarch64.whl", hash = "sha256:989824e9faf85f96ec9c7761cd8d29c531ad857bfa1daa930cba85baaecf1a9a", size = 15684591, upload-time = "2026-03-29T13:20:42.146Z" },
+    { url = "https://files.pythonhosted.org/packages/98/7c/21252050676612625449b4807d6b695b9ce8a7c9e1c197ee6216c8a65c7c/numpy-2.4.4-cp314-cp314-manylinux_2_27_x86_64.manylinux_2_28_x86_64.whl", hash = "sha256:27a8d92cd10f1382a67d7cf4db7ce18341b66438bdd9f691d7b0e48d104c2a9d", size = 16637700, upload-time = "2026-03-29T13:20:46.204Z" },
+    { url = "https://files.pythonhosted.org/packages/b1/29/56d2bbef9465db24ef25393383d761a1af4f446a1df9b8cded4fe3a5a5d7/numpy-2.4.4-cp314-cp314-musllinux_1_2_aarch64.whl", hash = "sha256:e44319a2953c738205bf3354537979eaa3998ed673395b964c1176083dd46252", size = 17035781, upload-time = "2026-03-29T13:20:50.242Z" },
+    { url = "https://files.pythonhosted.org/packages/e3/2b/a35a6d7589d21f44cea7d0a98de5ddcbb3d421b2622a5c96b1edf18707c3/numpy-2.4.4-cp314-cp314-musllinux_1_2_x86_64.whl", hash = "sha256:e892aff75639bbef0d2a2cfd55535510df26ff92f63c92cd84ef8d4ba5a5557f", size = 18362959, upload-time = "2026-03-29T13:20:54.019Z" },
+    { url = "https://files.pythonhosted.org/packages/64/c9/d52ec581f2390e0f5f85cbfd80fb83d965fc15e9f0e1aec2195faa142cde/numpy-2.4.4-cp314-cp314-win32.whl", hash = "sha256:1378871da56ca8943c2ba674530924bb8ca40cd228358a3b5f302ad60cf875fc", size = 6008768, upload-time = "2026-03-29T13:20:56.912Z" },
+    { url = "https://files.pythonhosted.org/packages/fa/22/4cc31a62a6c7b74a8730e31a4274c5dc80e005751e277a2ce38e675e4923/numpy-2.4.4-cp314-cp314-win_amd64.whl", hash = "sha256:715d1c092715954784bc79e1174fc2a90093dc4dc84ea15eb14dad8abdcdeb74", size = 12449181, upload-time = "2026-03-29T13:20:59.548Z" },
+    { url = "https://files.pythonhosted.org/packages/70/2e/14cda6f4d8e396c612d1bf97f22958e92148801d7e4f110cabebdc0eef4b/numpy-2.4.4-cp314-cp314-win_arm64.whl", hash = "sha256:2c194dd721e54ecad9ad387c1d35e63dce5c4450c6dc7dd5611283dda239aabb", size = 10496035, upload-time = "2026-03-29T13:21:02.524Z" },
+    { url = "https://files.pythonhosted.org/packages/b1/e8/8fed8c8d848d7ecea092dc3469643f9d10bc3a134a815a3b033da1d2039b/numpy-2.4.4-cp314-cp314t-macosx_11_0_arm64.whl", hash = "sha256:2aa0613a5177c264ff5921051a5719d20095ea586ca88cc802c5c218d1c67d3e", size = 14824958, upload-time = "2026-03-29T13:21:05.671Z" },
+    { url = "https://files.pythonhosted.org/packages/05/1a/d8007a5138c179c2bf33ef44503e83d70434d2642877ee8fbb230e7c0548/numpy-2.4.4-cp314-cp314t-macosx_14_0_arm64.whl", hash = "sha256:42c16925aa5a02362f986765f9ebabf20de75cdefdca827d14315c568dcab113", size = 5330020, upload-time = "2026-03-29T13:21:08.635Z" },
+    { url = "https://files.pythonhosted.org/packages/99/64/ffb99ac6ae93faf117bcbd5c7ba48a7f45364a33e8e458545d3633615dda/numpy-2.4.4-cp314-cp314t-macosx_14_0_x86_64.whl", hash = "sha256:874f200b2a981c647340f841730fc3a2b54c9d940566a3c4149099591e2c4c3d", size = 6650758, upload-time = "2026-03-29T13:21:10.949Z" },
+    { url = "https://files.pythonhosted.org/packages/6e/6e/795cc078b78a384052e73b2f6281ff7a700e9bf53bcce2ee579d4f6dd879/numpy-2.4.4-cp314-cp314t-manylinux_2_27_aarch64.manylinux_2_28_aarch64.whl", hash = "sha256:c9b39d38a9bd2ae1becd7eac1303d031c5c110ad31f2b319c6e7d98b135c934d", size = 15729948, upload-time = "2026-03-29T13:21:14.047Z" },
+    { url = "https://files.pythonhosted.org/packages/5f/86/2acbda8cc2af5f3d7bfc791192863b9e3e19674da7b5e533fded124d1299/numpy-2.4.4-cp314-cp314t-manylinux_2_27_x86_64.manylinux_2_28_x86_64.whl", hash = "sha256:b268594bccac7d7cf5844c7732e3f20c50921d94e36d7ec9b79e9857694b1b2f", size = 16679325, upload-time = "2026-03-29T13:21:17.561Z" },
+    { url = "https://files.pythonhosted.org/packages/bc/59/cafd83018f4aa55e0ac6fa92aa066c0a1877b77a615ceff1711c260ffae8/numpy-2.4.4-cp314-cp314t-musllinux_1_2_aarch64.whl", hash = "sha256:ac6b31e35612a26483e20750126d30d0941f949426974cace8e6b5c58a3657b0", size = 17084883, upload-time = "2026-03-29T13:21:21.106Z" },
+    { url = "https://files.pythonhosted.org/packages/f0/85/a42548db84e65ece46ab2caea3d3f78b416a47af387fcbb47ec28e660dc2/numpy-2.4.4-cp314-cp314t-musllinux_1_2_x86_64.whl", hash = "sha256:8e3ed142f2728df44263aaf5fb1f5b0b99f4070c553a0d7f033be65338329150", size = 18403474, upload-time = "2026-03-29T13:21:24.828Z" },
+    { url = "https://files.pythonhosted.org/packages/ed/ad/483d9e262f4b831000062e5d8a45e342166ec8aaa1195264982bca267e62/numpy-2.4.4-cp314-cp314t-win32.whl", hash = "sha256:dddbbd259598d7240b18c9d87c56a9d2fb3b02fe266f49a7c101532e78c1d871", size = 6155500, upload-time = "2026-03-29T13:21:28.205Z" },
+    { url = "https://files.pythonhosted.org/packages/c7/03/2fc4e14c7bd4ff2964b74ba90ecb8552540b6315f201df70f137faa5c589/numpy-2.4.4-cp314-cp314t-win_amd64.whl", hash = "sha256:a7164afb23be6e37ad90b2f10426149fd75aee07ca55653d2aa41e66c4ef697e", size = 12637755, upload-time = "2026-03-29T13:21:31.107Z" },
+    { url = "https://files.pythonhosted.org/packages/58/78/548fb8e07b1a341746bfbecb32f2c268470f45fa028aacdbd10d9bc73aab/numpy-2.4.4-cp314-cp314t-win_arm64.whl", hash = "sha256:ba203255017337d39f89bdd58417f03c4426f12beed0440cfd933cb15f8669c7", size = 10566643, upload-time = "2026-03-29T13:21:34.339Z" },
+]
+
 [[package]]
 name = "openai"
 version = "2.29.0"
@@ -1545,6 +1883,44 @@ wheels = [
     { url = "https://files.pythonhosted.org/packages/16/5c/d3f1733665f7cd582ef0842fb1d2ed0bc1fba10875160593342d22bba375/opentelemetry_util_http-0.60b1-py3-none-any.whl", hash = "sha256:66381ba28550c91bee14dcba8979ace443444af1ed609226634596b4b0faf199", size = 8947, upload-time = "2025-12-11T13:36:37.151Z" },
 ]
 
+[[package]]
+name = "orjson"
+version = "3.11.8"
+source = { registry = "https://pypi.org/simple" }
+sdist = { url = "https://files.pythonhosted.org/packages/9d/1b/2024d06792d0779f9dbc51531b61c24f76c75b9f4ce05e6f3377a1814cea/orjson-3.11.8.tar.gz", hash = "sha256:96163d9cdc5a202703e9ad1b9ae757d5f0ca62f4fa0cc93d1f27b0e180cc404e", size = 5603832, upload-time = "2026-03-31T16:16:27.878Z" }
+wheels = [
+    { url = "https://files.pythonhosted.org/packages/66/7f/95fba509bb2305fab0073558f1e8c3a2ec4b2afe58ed9fcb7d3b8beafe94/orjson-3.11.8-cp313-cp313-macosx_10_15_x86_64.macosx_11_0_arm64.macosx_10_15_universal2.whl", hash = "sha256:3f23426851d98478c8970da5991f84784a76682213cd50eb73a1da56b95239dc", size = 229180, upload-time = "2026-03-31T16:15:36.426Z" },
+    { url = "https://files.pythonhosted.org/packages/f6/9d/b237215c743ca073697d759b5503abd2cb8a0d7b9c9e21f524bcf176ab66/orjson-3.11.8-cp313-cp313-macosx_15_0_arm64.whl", hash = "sha256:ebaed4cef74a045b83e23537b52ef19a367c7e3f536751e355a2a394f8648559", size = 128754, upload-time = "2026-03-31T16:15:38.049Z" },
+    { url = "https://files.pythonhosted.org/packages/42/3d/27d65b6d11e63f133781425f132807aef793ed25075fec686fc8e46dd528/orjson-3.11.8-cp313-cp313-manylinux_2_17_aarch64.manylinux2014_aarch64.whl", hash = "sha256:97c8f5d3b62380b70c36ffacb2a356b7c6becec86099b177f73851ba095ef623", size = 131877, upload-time = "2026-03-31T16:15:39.484Z" },
+    { url = "https://files.pythonhosted.org/packages/dd/cc/faee30cd8f00421999e40ef0eba7332e3a625ce91a58200a2f52c7fef235/orjson-3.11.8-cp313-cp313-manylinux_2_17_armv7l.manylinux2014_armv7l.whl", hash = "sha256:436c4922968a619fb7fef1ccd4b8b3a76c13b67d607073914d675026e911a65c", size = 130361, upload-time = "2026-03-31T16:15:41.274Z" },
+    { url = "https://files.pythonhosted.org/packages/5c/bb/a6c55896197f97b6d4b4e7c7fd77e7235517c34f5d6ad5aadd43c54c6d7c/orjson-3.11.8-cp313-cp313-manylinux_2_17_i686.manylinux2014_i686.whl", hash = "sha256:1ab359aff0436d80bfe8a23b46b5fea69f1e18aaf1760a709b4787f1318b317f", size = 135521, upload-time = "2026-03-31T16:15:42.758Z" },
+    { url = "https://files.pythonhosted.org/packages/9c/7c/ca3a3525aa32ff636ebb1778e77e3587b016ab2edb1b618b36ba96f8f2c0/orjson-3.11.8-cp313-cp313-manylinux_2_17_ppc64le.manylinux2014_ppc64le.whl", hash = "sha256:f89b6d0b3a8d81e1929d3ab3d92bbc225688bd80a770c49432543928fe09ac55", size = 146862, upload-time = "2026-03-31T16:15:44.341Z" },
+    { url = "https://files.pythonhosted.org/packages/3c/0c/18a9d7f18b5edd37344d1fd5be17e94dc652c67826ab749c6e5948a78112/orjson-3.11.8-cp313-cp313-manylinux_2_17_s390x.manylinux2014_s390x.whl", hash = "sha256:29c009e7a2ca9ad0ed1376ce20dd692146a5d9fe4310848904b6b4fee5c5c137", size = 132847, upload-time = "2026-03-31T16:15:46.368Z" },
+    { url = "https://files.pythonhosted.org/packages/23/91/7e722f352ad67ca573cee44de2a58fb810d0f4eb4e33276c6a557979fd8a/orjson-3.11.8-cp313-cp313-manylinux_2_17_x86_64.manylinux2014_x86_64.whl", hash = "sha256:705b895b781b3e395c067129d8551655642dfe9437273211d5404e87ac752b53", size = 133637, upload-time = "2026-03-31T16:15:48.123Z" },
+    { url = "https://files.pythonhosted.org/packages/af/04/32845ce13ac5bd1046ddb02ac9432ba856cc35f6d74dde95864fe0ad5523/orjson-3.11.8-cp313-cp313-musllinux_1_2_aarch64.whl", hash = "sha256:88006eda83858a9fdf73985ce3804e885c2befb2f506c9a3723cdeb5a2880e3e", size = 141906, upload-time = "2026-03-31T16:15:49.626Z" },
+    { url = "https://files.pythonhosted.org/packages/02/5e/c551387ddf2d7106d9039369862245c85738b828844d13b99ccb8d61fd06/orjson-3.11.8-cp313-cp313-musllinux_1_2_armv7l.whl", hash = "sha256:55120759e61309af7fcf9e961c6f6af3dde5921cdb3ee863ef63fd9db126cae6", size = 423722, upload-time = "2026-03-31T16:15:51.176Z" },
+    { url = "https://files.pythonhosted.org/packages/00/a3/ecfe62434096f8a794d4976728cb59bcfc4a643977f21c2040545d37eb4c/orjson-3.11.8-cp313-cp313-musllinux_1_2_i686.whl", hash = "sha256:98bdc6cb889d19bed01de46e67574a2eab61f5cc6b768ed50e8ac68e9d6ffab6", size = 147801, upload-time = "2026-03-31T16:15:52.939Z" },
+    { url = "https://files.pythonhosted.org/packages/18/6d/0dce10b9f6643fdc59d99333871a38fa5a769d8e2fc34a18e5d2bfdee900/orjson-3.11.8-cp313-cp313-musllinux_1_2_x86_64.whl", hash = "sha256:708c95f925a43ab9f34625e45dcdadf09ec8a6e7b664a938f2f8d5650f6c090b", size = 136460, upload-time = "2026-03-31T16:15:54.431Z" },
+    { url = "https://files.pythonhosted.org/packages/01/d6/6dde4f31842d87099238f1f07b459d24edc1a774d20687187443ab044191/orjson-3.11.8-cp313-cp313-win32.whl", hash = "sha256:01c4e5a6695dc09098f2e6468a251bc4671c50922d4d745aff1a0a33a0cf5b8d", size = 131956, upload-time = "2026-03-31T16:15:56.081Z" },
+    { url = "https://files.pythonhosted.org/packages/c1/f9/4e494a56e013db957fb77186b818b916d4695b8fa2aa612364974160e91b/orjson-3.11.8-cp313-cp313-win_amd64.whl", hash = "sha256:c154a35dd1330707450bb4d4e7dd1f17fa6f42267a40c1e8a1daa5e13719b4b8", size = 127410, upload-time = "2026-03-31T16:15:57.54Z" },
+    { url = "https://files.pythonhosted.org/packages/57/7f/803203d00d6edb6e9e7eef421d4e1adbb5ea973e40b3533f3cfd9aeb374e/orjson-3.11.8-cp313-cp313-win_arm64.whl", hash = "sha256:4861bde57f4d253ab041e374f44023460e60e71efaa121f3c5f0ed457c3a701e", size = 127338, upload-time = "2026-03-31T16:15:59.106Z" },
+    { url = "https://files.pythonhosted.org/packages/6d/35/b01910c3d6b85dc882442afe5060cbf719c7d1fc85749294beda23d17873/orjson-3.11.8-cp314-cp314-macosx_10_15_x86_64.macosx_11_0_arm64.macosx_10_15_universal2.whl", hash = "sha256:ec795530a73c269a55130498842aaa762e4a939f6ce481a7e986eeaa790e9da4", size = 229171, upload-time = "2026-03-31T16:16:00.651Z" },
+    { url = "https://files.pythonhosted.org/packages/c2/56/c9ec97bd11240abef39b9e5d99a15462809c45f677420fd148a6c5e6295e/orjson-3.11.8-cp314-cp314-macosx_15_0_arm64.whl", hash = "sha256:c492a0e011c0f9066e9ceaa896fbc5b068c54d365fea5f3444b697ee01bc8625", size = 128746, upload-time = "2026-03-31T16:16:02.673Z" },
+    { url = "https://files.pythonhosted.org/packages/3b/e4/66d4f30a90de45e2f0cbd9623588e8ae71eef7679dbe2ae954ed6d66a41f/orjson-3.11.8-cp314-cp314-manylinux_2_17_aarch64.manylinux2014_aarch64.whl", hash = "sha256:883206d55b1bd5f5679ad5e6ddd3d1a5e3cac5190482927fdb8c78fb699193b5", size = 131867, upload-time = "2026-03-31T16:16:04.342Z" },
+    { url = "https://files.pythonhosted.org/packages/19/30/2a645fc9286b928675e43fa2a3a16fb7b6764aa78cc719dc82141e00f30b/orjson-3.11.8-cp314-cp314-manylinux_2_17_armv7l.manylinux2014_armv7l.whl", hash = "sha256:5774c1fdcc98b2259800b683b19599c133baeb11d60033e2095fd9d4667b82db", size = 124664, upload-time = "2026-03-31T16:16:05.837Z" },
+    { url = "https://files.pythonhosted.org/packages/db/44/77b9a86d84a28d52ba3316d77737f6514e17118119ade3f91b639e859029/orjson-3.11.8-cp314-cp314-manylinux_2_17_i686.manylinux2014_i686.whl", hash = "sha256:8ac7381c83dd3d4a6347e6635950aa448f54e7b8406a27c7ecb4a37e9f1ae08b", size = 129701, upload-time = "2026-03-31T16:16:07.407Z" },
+    { url = "https://files.pythonhosted.org/packages/b3/ea/eff3d9bfe47e9bc6969c9181c58d9f71237f923f9c86a2d2f490cd898c82/orjson-3.11.8-cp314-cp314-manylinux_2_17_ppc64le.manylinux2014_ppc64le.whl", hash = "sha256:14439063aebcb92401c11afc68ee4e407258d2752e62d748b6942dad20d2a70d", size = 141202, upload-time = "2026-03-31T16:16:09.48Z" },
+    { url = "https://files.pythonhosted.org/packages/52/c8/90d4b4c60c84d62068d0cf9e4d8f0a4e05e76971d133ac0c60d818d4db20/orjson-3.11.8-cp314-cp314-manylinux_2_17_s390x.manylinux2014_s390x.whl", hash = "sha256:fa72e71977bff96567b0f500fc5bfd2fdf915f34052c782a4c6ebbdaa97aa858", size = 127194, upload-time = "2026-03-31T16:16:11.02Z" },
+    { url = "https://files.pythonhosted.org/packages/8d/c7/ea9e08d1f0ba981adffb629811148b44774d935171e7b3d780ae43c4c254/orjson-3.11.8-cp314-cp314-manylinux_2_17_x86_64.manylinux2014_x86_64.whl", hash = "sha256:7679bc2f01bb0d219758f1a5f87bb7c8a81c0a186824a393b366876b4948e14f", size = 133639, upload-time = "2026-03-31T16:16:13.434Z" },
+    { url = "https://files.pythonhosted.org/packages/6c/8c/ddbbfd6ba59453c8fc7fe1d0e5983895864e264c37481b2a791db635f046/orjson-3.11.8-cp314-cp314-musllinux_1_2_aarch64.whl", hash = "sha256:14f7b8fcb35ef403b42fa5ecfa4ed032332a91f3dc7368fbce4184d59e1eae0d", size = 141914, upload-time = "2026-03-31T16:16:14.955Z" },
+    { url = "https://files.pythonhosted.org/packages/4e/31/dbfbefec9df060d34ef4962cd0afcb6fa7a9ec65884cb78f04a7859526c3/orjson-3.11.8-cp314-cp314-musllinux_1_2_armv7l.whl", hash = "sha256:c2bdf7b2facc80b5e34f48a2d557727d5c5c57a8a450de122ae81fa26a81c1bc", size = 423800, upload-time = "2026-03-31T16:16:16.594Z" },
+    { url = "https://files.pythonhosted.org/packages/87/cf/f74e9ae9803d4ab46b163494adba636c6d7ea955af5cc23b8aaa94cfd528/orjson-3.11.8-cp314-cp314-musllinux_1_2_i686.whl", hash = "sha256:ccd7ba1b0605813a0715171d39ec4c314cb97a9c85893c2c5c0c3a3729df38bf", size = 147837, upload-time = "2026-03-31T16:16:18.585Z" },
+    { url = "https://files.pythonhosted.org/packages/64/e6/9214f017b5db85e84e68602792f742e5dc5249e963503d1b356bee611e01/orjson-3.11.8-cp314-cp314-musllinux_1_2_x86_64.whl", hash = "sha256:cdbc8c9c02463fef4d3c53a9ba3336d05496ec8e1f1c53326a1e4acc11f5c600", size = 136441, upload-time = "2026-03-31T16:16:20.151Z" },
+    { url = "https://files.pythonhosted.org/packages/24/dd/3590348818f58f837a75fb969b04cdf187ae197e14d60b5e5a794a38b79d/orjson-3.11.8-cp314-cp314-win32.whl", hash = "sha256:0b57f67710a8cd459e4e54eb96d5f77f3624eba0c661ba19a525807e42eccade", size = 131983, upload-time = "2026-03-31T16:16:21.823Z" },
+    { url = "https://files.pythonhosted.org/packages/3f/0f/b6cb692116e05d058f31ceee819c70f097fa9167c82f67fabe7516289abc/orjson-3.11.8-cp314-cp314-win_amd64.whl", hash = "sha256:735e2262363dcbe05c35e3a8869898022af78f89dde9e256924dc02e99fe69ca", size = 127396, upload-time = "2026-03-31T16:16:23.685Z" },
+    { url = "https://files.pythonhosted.org/packages/c0/d1/facb5b5051fabb0ef9d26c6544d87ef19a939a9a001198655d0d891062dd/orjson-3.11.8-cp314-cp314-win_arm64.whl", hash = "sha256:6ccdea2c213cf9f3d9490cbd5d427693c870753df41e6cb375bd79bcbafc8817", size = 127330, upload-time = "2026-03-31T16:16:25.496Z" },
+]
+
 [[package]]
 name = "packaging"
 version = "25.0"
@@ -1563,6 +1939,85 @@ wheels = [
     { url = "https://files.pythonhosted.org/packages/52/96/5a770e5c461462575474468e5af931cff9de036e7c2b4fea23c1c58d2cbe/pathable-0.5.0-py3-none-any.whl", hash = "sha256:646e3d09491a6351a0c82632a09c02cdf70a252e73196b36d8a15ba0a114f0a6", size = 16867, upload-time = "2026-02-20T08:46:59.536Z" },
 ]
 
+[[package]]
+name = "pathspec"
+version = "1.0.4"
+source = { registry = "https://pypi.org/simple" }
+sdist = { url = "https://files.pythonhosted.org/packages/fa/36/e27608899f9b8d4dff0617b2d9ab17ca5608956ca44461ac14ac48b44015/pathspec-1.0.4.tar.gz", hash = "sha256:0210e2ae8a21a9137c0d470578cb0e595af87edaa6ebf12ff176f14a02e0e645", size = 131200, upload-time = "2026-01-27T03:59:46.938Z" }
+wheels = [
+    { url = "https://files.pythonhosted.org/packages/ef/3c/2c197d226f9ea224a9ab8d197933f9da0ae0aac5b6e0f884e2b8d9c8e9f7/pathspec-1.0.4-py3-none-any.whl", hash = "sha256:fb6ae2fd4e7c921a165808a552060e722767cfa526f99ca5156ed2ce45a5c723", size = 55206, upload-time = "2026-01-27T03:59:45.137Z" },
+]
+
+[[package]]
+name = "pgvector"
+version = "0.4.2"
+source = { registry = "https://pypi.org/simple" }
+dependencies = [
+    { name = "numpy" },
+]
+sdist = { url = "https://files.pythonhosted.org/packages/25/6c/6d8b4b03b958c02fa8687ec6063c49d952a189f8c91ebbe51e877dfab8f7/pgvector-0.4.2.tar.gz", hash = "sha256:322cac0c1dc5d41c9ecf782bd9991b7966685dee3a00bc873631391ed949513a", size = 31354, upload-time = "2025-12-05T01:07:17.87Z" }
+wheels = [
+    { url = "https://files.pythonhosted.org/packages/5a/26/6cee8a1ce8c43625ec561aff19df07f9776b7525d9002c86bceb3e0ac970/pgvector-0.4.2-py3-none-any.whl", hash = "sha256:549d45f7a18593783d5eec609ea1684a724ba8405c4cb182a0b2b08aeff04e08", size = 27441, upload-time = "2025-12-05T01:07:16.536Z" },
+]
+
+[[package]]
+name = "pillow"
+version = "12.2.0"
+source = { registry = "https://pypi.org/simple" }
+sdist = { url = "https://files.pythonhosted.org/packages/8c/21/c2bcdd5906101a30244eaffc1b6e6ce71a31bd0742a01eb89e660ebfac2d/pillow-12.2.0.tar.gz", hash = "sha256:a830b1a40919539d07806aa58e1b114df53ddd43213d9c8b75847eee6c0182b5", size = 46987819, upload-time = "2026-04-01T14:46:17.687Z" }
+wheels = [
+    { url = "https://files.pythonhosted.org/packages/4a/01/53d10cf0dbad820a8db274d259a37ba50b88b24768ddccec07355382d5ad/pillow-12.2.0-cp313-cp313-ios_13_0_arm64_iphoneos.whl", hash = "sha256:8297651f5b5679c19968abefd6bb84d95fe30ef712eb1b2d9b2d31ca61267f4c", size = 4100837, upload-time = "2026-04-01T14:43:41.506Z" },
+    { url = "https://files.pythonhosted.org/packages/0f/98/f3a6657ecb698c937f6c76ee564882945f29b79bad496abcba0e84659ec5/pillow-12.2.0-cp313-cp313-ios_13_0_arm64_iphonesimulator.whl", hash = "sha256:50d8520da2a6ce0af445fa6d648c4273c3eeefbc32d7ce049f22e8b5c3daecc2", size = 4176528, upload-time = "2026-04-01T14:43:43.773Z" },
+    { url = "https://files.pythonhosted.org/packages/69/bc/8986948f05e3ea490b8442ea1c1d4d990b24a7e43d8a51b2c7d8b1dced36/pillow-12.2.0-cp313-cp313-ios_13_0_x86_64_iphonesimulator.whl", hash = "sha256:766cef22385fa1091258ad7e6216792b156dc16d8d3fa607e7545b2b72061f1c", size = 3640401, upload-time = "2026-04-01T14:43:45.87Z" },
+    { url = "https://files.pythonhosted.org/packages/34/46/6c717baadcd62bc8ed51d238d521ab651eaa74838291bda1f86fe1f864c9/pillow-12.2.0-cp313-cp313-macosx_10_13_x86_64.whl", hash = "sha256:5d2fd0fa6b5d9d1de415060363433f28da8b1526c1c129020435e186794b3795", size = 5308094, upload-time = "2026-04-01T14:43:48.438Z" },
+    { url = "https://files.pythonhosted.org/packages/71/43/905a14a8b17fdb1ccb58d282454490662d2cb89a6bfec26af6d3520da5ec/pillow-12.2.0-cp313-cp313-macosx_11_0_arm64.whl", hash = "sha256:56b25336f502b6ed02e889f4ece894a72612fe885889a6e8c4c80239ff6e5f5f", size = 4695402, upload-time = "2026-04-01T14:43:51.292Z" },
+    { url = "https://files.pythonhosted.org/packages/73/dd/42107efcb777b16fa0393317eac58f5b5cf30e8392e266e76e51cff28c3d/pillow-12.2.0-cp313-cp313-manylinux2014_aarch64.manylinux_2_17_aarch64.whl", hash = "sha256:f1c943e96e85df3d3478f7b691f229887e143f81fedab9b20205349ab04d73ed", size = 6280005, upload-time = "2026-04-01T14:43:54.242Z" },
+    { url = "https://files.pythonhosted.org/packages/a8/68/b93e09e5e8549019e61acf49f65b1a8530765a7f812c77a7461bca7e4494/pillow-12.2.0-cp313-cp313-manylinux2014_x86_64.manylinux_2_17_x86_64.whl", hash = "sha256:03f6fab9219220f041c74aeaa2939ff0062bd5c364ba9ce037197f4c6d498cd9", size = 8090669, upload-time = "2026-04-01T14:43:57.335Z" },
+    { url = "https://files.pythonhosted.org/packages/4b/6e/3ccb54ce8ec4ddd1accd2d89004308b7b0b21c4ac3d20fa70af4760a4330/pillow-12.2.0-cp313-cp313-manylinux_2_27_aarch64.manylinux_2_28_aarch64.whl", hash = "sha256:5cdfebd752ec52bf5bb4e35d9c64b40826bc5b40a13df7c3cda20a2c03a0f5ed", size = 6395194, upload-time = "2026-04-01T14:43:59.864Z" },
+    { url = "https://files.pythonhosted.org/packages/67/ee/21d4e8536afd1a328f01b359b4d3997b291ffd35a237c877b331c1c3b71c/pillow-12.2.0-cp313-cp313-manylinux_2_27_x86_64.manylinux_2_28_x86_64.whl", hash = "sha256:eedf4b74eda2b5a4b2b2fb4c006d6295df3bf29e459e198c90ea48e130dc75c3", size = 7082423, upload-time = "2026-04-01T14:44:02.74Z" },
+    { url = "https://files.pythonhosted.org/packages/78/5f/e9f86ab0146464e8c133fe85df987ed9e77e08b29d8d35f9f9f4d6f917ba/pillow-12.2.0-cp313-cp313-musllinux_1_2_aarch64.whl", hash = "sha256:00a2865911330191c0b818c59103b58a5e697cae67042366970a6b6f1b20b7f9", size = 6505667, upload-time = "2026-04-01T14:44:05.381Z" },
+    { url = "https://files.pythonhosted.org/packages/ed/1e/409007f56a2fdce61584fd3acbc2bbc259857d555196cedcadc68c015c82/pillow-12.2.0-cp313-cp313-musllinux_1_2_x86_64.whl", hash = "sha256:1e1757442ed87f4912397c6d35a0db6a7b52592156014706f17658ff58bbf795", size = 7208580, upload-time = "2026-04-01T14:44:08.39Z" },
+    { url = "https://files.pythonhosted.org/packages/23/c4/7349421080b12fb35414607b8871e9534546c128a11965fd4a7002ccfbee/pillow-12.2.0-cp313-cp313-win32.whl", hash = "sha256:144748b3af2d1b358d41286056d0003f47cb339b8c43a9ea42f5fea4d8c66b6e", size = 6375896, upload-time = "2026-04-01T14:44:11.197Z" },
+    { url = "https://files.pythonhosted.org/packages/3f/82/8a3739a5e470b3c6cbb1d21d315800d8e16bff503d1f16b03a4ec3212786/pillow-12.2.0-cp313-cp313-win_amd64.whl", hash = "sha256:390ede346628ccc626e5730107cde16c42d3836b89662a115a921f28440e6a3b", size = 7081266, upload-time = "2026-04-01T14:44:13.947Z" },
+    { url = "https://files.pythonhosted.org/packages/c3/25/f968f618a062574294592f668218f8af564830ccebdd1fa6200f598e65c5/pillow-12.2.0-cp313-cp313-win_arm64.whl", hash = "sha256:8023abc91fba39036dbce14a7d6535632f99c0b857807cbbbf21ecc9f4717f06", size = 2463508, upload-time = "2026-04-01T14:44:16.312Z" },
+    { url = "https://files.pythonhosted.org/packages/4d/a4/b342930964e3cb4dce5038ae34b0eab4653334995336cd486c5a8c25a00c/pillow-12.2.0-cp313-cp313t-macosx_10_13_x86_64.whl", hash = "sha256:042db20a421b9bafecc4b84a8b6e444686bd9d836c7fd24542db3e7df7baad9b", size = 5309927, upload-time = "2026-04-01T14:44:18.89Z" },
+    { url = "https://files.pythonhosted.org/packages/9f/de/23198e0a65a9cf06123f5435a5d95cea62a635697f8f03d134d3f3a96151/pillow-12.2.0-cp313-cp313t-macosx_11_0_arm64.whl", hash = "sha256:dd025009355c926a84a612fecf58bb315a3f6814b17ead51a8e48d3823d9087f", size = 4698624, upload-time = "2026-04-01T14:44:21.115Z" },
+    { url = "https://files.pythonhosted.org/packages/01/a6/1265e977f17d93ea37aa28aa81bad4fa597933879fac2520d24e021c8da3/pillow-12.2.0-cp313-cp313t-manylinux2014_aarch64.manylinux_2_17_aarch64.whl", hash = "sha256:88ddbc66737e277852913bd1e07c150cc7bb124539f94c4e2df5344494e0a612", size = 6321252, upload-time = "2026-04-01T14:44:23.663Z" },
+    { url = "https://files.pythonhosted.org/packages/3c/83/5982eb4a285967baa70340320be9f88e57665a387e3a53a7f0db8231a0cd/pillow-12.2.0-cp313-cp313t-manylinux2014_x86_64.manylinux_2_17_x86_64.whl", hash = "sha256:d362d1878f00c142b7e1a16e6e5e780f02be8195123f164edf7eddd911eefe7c", size = 8126550, upload-time = "2026-04-01T14:44:26.772Z" },
+    { url = "https://files.pythonhosted.org/packages/4e/48/6ffc514adce69f6050d0753b1a18fd920fce8cac87620d5a31231b04bfc5/pillow-12.2.0-cp313-cp313t-manylinux_2_27_aarch64.manylinux_2_28_aarch64.whl", hash = "sha256:2c727a6d53cb0018aadd8018c2b938376af27914a68a492f59dfcaca650d5eea", size = 6433114, upload-time = "2026-04-01T14:44:29.615Z" },
+    { url = "https://files.pythonhosted.org/packages/36/a3/f9a77144231fb8d40ee27107b4463e205fa4677e2ca2548e14da5cf18dce/pillow-12.2.0-cp313-cp313t-manylinux_2_27_x86_64.manylinux_2_28_x86_64.whl", hash = "sha256:efd8c21c98c5cc60653bcb311bef2ce0401642b7ce9d09e03a7da87c878289d4", size = 7115667, upload-time = "2026-04-01T14:44:32.773Z" },
+    { url = "https://files.pythonhosted.org/packages/c1/fc/ac4ee3041e7d5a565e1c4fd72a113f03b6394cc72ab7089d27608f8aaccb/pillow-12.2.0-cp313-cp313t-musllinux_1_2_aarch64.whl", hash = "sha256:9f08483a632889536b8139663db60f6724bfcb443c96f1b18855860d7d5c0fd4", size = 6538966, upload-time = "2026-04-01T14:44:35.252Z" },
+    { url = "https://files.pythonhosted.org/packages/c0/a8/27fb307055087f3668f6d0a8ccb636e7431d56ed0750e07a60547b1e083e/pillow-12.2.0-cp313-cp313t-musllinux_1_2_x86_64.whl", hash = "sha256:dac8d77255a37e81a2efcbd1fc05f1c15ee82200e6c240d7e127e25e365c39ea", size = 7238241, upload-time = "2026-04-01T14:44:37.875Z" },
+    { url = "https://files.pythonhosted.org/packages/ad/4b/926ab182c07fccae9fcb120043464e1ff1564775ec8864f21a0ebce6ac25/pillow-12.2.0-cp313-cp313t-win32.whl", hash = "sha256:ee3120ae9dff32f121610bb08e4313be87e03efeadfc6c0d18f89127e24d0c24", size = 6379592, upload-time = "2026-04-01T14:44:40.336Z" },
+    { url = "https://files.pythonhosted.org/packages/c2/c4/f9e476451a098181b30050cc4c9a3556b64c02cf6497ea421ac047e89e4b/pillow-12.2.0-cp313-cp313t-win_amd64.whl", hash = "sha256:325ca0528c6788d2a6c3d40e3568639398137346c3d6e66bb61db96b96511c98", size = 7085542, upload-time = "2026-04-01T14:44:43.251Z" },
+    { url = "https://files.pythonhosted.org/packages/00/a4/285f12aeacbe2d6dc36c407dfbbe9e96d4a80b0fb710a337f6d2ad978c75/pillow-12.2.0-cp313-cp313t-win_arm64.whl", hash = "sha256:2e5a76d03a6c6dcef67edabda7a52494afa4035021a79c8558e14af25313d453", size = 2465765, upload-time = "2026-04-01T14:44:45.996Z" },
+    { url = "https://files.pythonhosted.org/packages/bf/98/4595daa2365416a86cb0d495248a393dfc84e96d62ad080c8546256cb9c0/pillow-12.2.0-cp314-cp314-ios_13_0_arm64_iphoneos.whl", hash = "sha256:3adc9215e8be0448ed6e814966ecf3d9952f0ea40eb14e89a102b87f450660d8", size = 4100848, upload-time = "2026-04-01T14:44:48.48Z" },
+    { url = "https://files.pythonhosted.org/packages/0b/79/40184d464cf89f6663e18dfcf7ca21aae2491fff1a16127681bf1fa9b8cf/pillow-12.2.0-cp314-cp314-ios_13_0_arm64_iphonesimulator.whl", hash = "sha256:6a9adfc6d24b10f89588096364cc726174118c62130c817c2837c60cf08a392b", size = 4176515, upload-time = "2026-04-01T14:44:51.353Z" },
+    { url = "https://files.pythonhosted.org/packages/b0/63/703f86fd4c422a9cf722833670f4f71418fb116b2853ff7da722ea43f184/pillow-12.2.0-cp314-cp314-ios_13_0_x86_64_iphonesimulator.whl", hash = "sha256:6a6e67ea2e6feda684ed370f9a1c52e7a243631c025ba42149a2cc5934dec295", size = 3640159, upload-time = "2026-04-01T14:44:53.588Z" },
+    { url = "https://files.pythonhosted.org/packages/71/e0/fb22f797187d0be2270f83500aab851536101b254bfa1eae10795709d283/pillow-12.2.0-cp314-cp314-macosx_10_15_x86_64.whl", hash = "sha256:2bb4a8d594eacdfc59d9e5ad972aa8afdd48d584ffd5f13a937a664c3e7db0ed", size = 5312185, upload-time = "2026-04-01T14:44:56.039Z" },
+    { url = "https://files.pythonhosted.org/packages/ba/8c/1a9e46228571de18f8e28f16fabdfc20212a5d019f3e3303452b3f0a580d/pillow-12.2.0-cp314-cp314-macosx_11_0_arm64.whl", hash = "sha256:80b2da48193b2f33ed0c32c38140f9d3186583ce7d516526d462645fd98660ae", size = 4695386, upload-time = "2026-04-01T14:44:58.663Z" },
+    { url = "https://files.pythonhosted.org/packages/70/62/98f6b7f0c88b9addd0e87c217ded307b36be024d4ff8869a812b241d1345/pillow-12.2.0-cp314-cp314-manylinux2014_aarch64.manylinux_2_17_aarch64.whl", hash = "sha256:22db17c68434de69d8ecfc2fe821569195c0c373b25cccb9cbdacf2c6e53c601", size = 6280384, upload-time = "2026-04-01T14:45:01.5Z" },
+    { url = "https://files.pythonhosted.org/packages/5e/03/688747d2e91cfbe0e64f316cd2e8005698f76ada3130d0194664174fa5de/pillow-12.2.0-cp314-cp314-manylinux2014_x86_64.manylinux_2_17_x86_64.whl", hash = "sha256:7b14cc0106cd9aecda615dd6903840a058b4700fcb817687d0ee4fc8b6e389be", size = 8091599, upload-time = "2026-04-01T14:45:04.5Z" },
+    { url = "https://files.pythonhosted.org/packages/f6/35/577e22b936fcdd66537329b33af0b4ccfefaeabd8aec04b266528cddb33c/pillow-12.2.0-cp314-cp314-manylinux_2_27_aarch64.manylinux_2_28_aarch64.whl", hash = "sha256:8cbeb542b2ebc6fcdacabf8aca8c1a97c9b3ad3927d46b8723f9d4f033288a0f", size = 6396021, upload-time = "2026-04-01T14:45:07.117Z" },
+    { url = "https://files.pythonhosted.org/packages/11/8d/d2532ad2a603ca2b93ad9f5135732124e57811d0168155852f37fbce2458/pillow-12.2.0-cp314-cp314-manylinux_2_27_x86_64.manylinux_2_28_x86_64.whl", hash = "sha256:4bfd07bc812fbd20395212969e41931001fd59eb55a60658b0e5710872e95286", size = 7083360, upload-time = "2026-04-01T14:45:09.763Z" },
+    { url = "https://files.pythonhosted.org/packages/5e/26/d325f9f56c7e039034897e7380e9cc202b1e368bfd04d4cbe6a441f02885/pillow-12.2.0-cp314-cp314-musllinux_1_2_aarch64.whl", hash = "sha256:9aba9a17b623ef750a4d11b742cbafffeb48a869821252b30ee21b5e91392c50", size = 6507628, upload-time = "2026-04-01T14:45:12.378Z" },
+    { url = "https://files.pythonhosted.org/packages/5f/f7/769d5632ffb0988f1c5e7660b3e731e30f7f8ec4318e94d0a5d674eb65a4/pillow-12.2.0-cp314-cp314-musllinux_1_2_x86_64.whl", hash = "sha256:deede7c263feb25dba4e82ea23058a235dcc2fe1f6021025dc71f2b618e26104", size = 7209321, upload-time = "2026-04-01T14:45:15.122Z" },
+    { url = "https://files.pythonhosted.org/packages/6a/7a/c253e3c645cd47f1aceea6a8bacdba9991bf45bb7dfe927f7c893e89c93c/pillow-12.2.0-cp314-cp314-win32.whl", hash = "sha256:632ff19b2778e43162304d50da0181ce24ac5bb8180122cbe1bf4673428328c7", size = 6479723, upload-time = "2026-04-01T14:45:17.797Z" },
+    { url = "https://files.pythonhosted.org/packages/cd/8b/601e6566b957ca50e28725cb6c355c59c2c8609751efbecd980db44e0349/pillow-12.2.0-cp314-cp314-win_amd64.whl", hash = "sha256:4e6c62e9d237e9b65fac06857d511e90d8461a32adcc1b9065ea0c0fa3a28150", size = 7217400, upload-time = "2026-04-01T14:45:20.529Z" },
+    { url = "https://files.pythonhosted.org/packages/d6/94/220e46c73065c3e2951bb91c11a1fb636c8c9ad427ac3ce7d7f3359b9b2f/pillow-12.2.0-cp314-cp314-win_arm64.whl", hash = "sha256:b1c1fbd8a5a1af3412a0810d060a78b5136ec0836c8a4ef9aa11807f2a22f4e1", size = 2554835, upload-time = "2026-04-01T14:45:23.162Z" },
+    { url = "https://files.pythonhosted.org/packages/b6/ab/1b426a3974cb0e7da5c29ccff4807871d48110933a57207b5a676cccc155/pillow-12.2.0-cp314-cp314t-macosx_10_15_x86_64.whl", hash = "sha256:57850958fe9c751670e49b2cecf6294acc99e562531f4bd317fa5ddee2068463", size = 5314225, upload-time = "2026-04-01T14:45:25.637Z" },
+    { url = "https://files.pythonhosted.org/packages/19/1e/dce46f371be2438eecfee2a1960ee2a243bbe5e961890146d2dee1ff0f12/pillow-12.2.0-cp314-cp314t-macosx_11_0_arm64.whl", hash = "sha256:d5d38f1411c0ed9f97bcb49b7bd59b6b7c314e0e27420e34d99d844b9ce3b6f3", size = 4698541, upload-time = "2026-04-01T14:45:28.355Z" },
+    { url = "https://files.pythonhosted.org/packages/55/c3/7fbecf70adb3a0c33b77a300dc52e424dc22ad8cdc06557a2e49523b703d/pillow-12.2.0-cp314-cp314t-manylinux2014_aarch64.manylinux_2_17_aarch64.whl", hash = "sha256:5c0a9f29ca8e79f09de89293f82fc9b0270bb4af1d58bc98f540cc4aedf03166", size = 6322251, upload-time = "2026-04-01T14:45:30.924Z" },
+    { url = "https://files.pythonhosted.org/packages/1c/3c/7fbc17cfb7e4fe0ef1642e0abc17fc6c94c9f7a16be41498e12e2ba60408/pillow-12.2.0-cp314-cp314t-manylinux2014_x86_64.manylinux_2_17_x86_64.whl", hash = "sha256:1610dd6c61621ae1cf811bef44d77e149ce3f7b95afe66a4512f8c59f25d9ebe", size = 8127807, upload-time = "2026-04-01T14:45:33.908Z" },
+    { url = "https://files.pythonhosted.org/packages/ff/c3/a8ae14d6defd2e448493ff512fae903b1e9bd40b72efb6ec55ce0048c8ce/pillow-12.2.0-cp314-cp314t-manylinux_2_27_aarch64.manylinux_2_28_aarch64.whl", hash = "sha256:0a34329707af4f73cf1782a36cd2289c0368880654a2c11f027bcee9052d35dd", size = 6433935, upload-time = "2026-04-01T14:45:36.623Z" },
+    { url = "https://files.pythonhosted.org/packages/6e/32/2880fb3a074847ac159d8f902cb43278a61e85f681661e7419e6596803ed/pillow-12.2.0-cp314-cp314t-manylinux_2_27_x86_64.manylinux_2_28_x86_64.whl", hash = "sha256:8e9c4f5b3c546fa3458a29ab22646c1c6c787ea8f5ef51300e5a60300736905e", size = 7116720, upload-time = "2026-04-01T14:45:39.258Z" },
+    { url = "https://files.pythonhosted.org/packages/46/87/495cc9c30e0129501643f24d320076f4cc54f718341df18cc70ec94c44e1/pillow-12.2.0-cp314-cp314t-musllinux_1_2_aarch64.whl", hash = "sha256:fb043ee2f06b41473269765c2feae53fc2e2fbf96e5e22ca94fb5ad677856f06", size = 6540498, upload-time = "2026-04-01T14:45:41.879Z" },
+    { url = "https://files.pythonhosted.org/packages/18/53/773f5edca692009d883a72211b60fdaf8871cbef075eaa9d577f0a2f989e/pillow-12.2.0-cp314-cp314t-musllinux_1_2_x86_64.whl", hash = "sha256:f278f034eb75b4e8a13a54a876cc4a5ab39173d2cdd93a638e1b467fc545ac43", size = 7239413, upload-time = "2026-04-01T14:45:44.705Z" },
+    { url = "https://files.pythonhosted.org/packages/c9/e4/4b64a97d71b2a83158134abbb2f5bd3f8a2ea691361282f010998f339ec7/pillow-12.2.0-cp314-cp314t-win32.whl", hash = "sha256:6bb77b2dcb06b20f9f4b4a8454caa581cd4dd0643a08bacf821216a16d9c8354", size = 6482084, upload-time = "2026-04-01T14:45:47.568Z" },
+    { url = "https://files.pythonhosted.org/packages/ba/13/306d275efd3a3453f72114b7431c877d10b1154014c1ebbedd067770d629/pillow-12.2.0-cp314-cp314t-win_amd64.whl", hash = "sha256:6562ace0d3fb5f20ed7290f1f929cae41b25ae29528f2af1722966a0a02e2aa1", size = 7225152, upload-time = "2026-04-01T14:45:50.032Z" },
+    { url = "https://files.pythonhosted.org/packages/ff/6e/cf826fae916b8658848d7b9f38d88da6396895c676e8086fc0988073aaf8/pillow-12.2.0-cp314-cp314t-win_arm64.whl", hash = "sha256:aa88ccfe4e32d362816319ed727a004423aab09c5cea43c01a4b435643fa34eb", size = 2556579, upload-time = "2026-04-01T14:45:52.529Z" },
+]
+
 [[package]]
 name = "platformdirs"
 version = "4.9.4"
@@ -1581,6 +2036,23 @@ wheels = [
     { url = "https://files.pythonhosted.org/packages/54/20/4d324d65cc6d9205fabedc306948156824eb9f0ee1633355a8f7ec5c66bf/pluggy-1.6.0-py3-none-any.whl", hash = "sha256:e920276dd6813095e9377c0bc5566d94c932c33b27a3e3945d8389c374dd4746", size = 20538, upload-time = "2025-05-15T12:30:06.134Z" },
 ]
 
+[[package]]
+name = "posthog"
+version = "7.9.12"
+source = { registry = "https://pypi.org/simple" }
+dependencies = [
+    { name = "backoff" },
+    { name = "distro" },
+    { name = "python-dateutil" },
+    { name = "requests" },
+    { name = "six" },
+    { name = "typing-extensions" },
+]
+sdist = { url = "https://files.pythonhosted.org/packages/1c/a7/2865487853061fbd62383492237b546d2d8f7c1846272350d2b9e14138cd/posthog-7.9.12.tar.gz", hash = "sha256:ebabf2eb2e1c1fbf22b0759df4644623fa43cc6c9dcbe9fd429b7937d14251ec", size = 176828, upload-time = "2026-03-12T09:01:15.184Z" }
+wheels = [
+    { url = "https://files.pythonhosted.org/packages/65/a9/7a803aed5a5649cf78ea7b31e90d0080181ba21f739243e1741a1e607f1f/posthog-7.9.12-py3-none-any.whl", hash = "sha256:7175bd1698a566bfea98a016c64e3456399f8046aeeca8f1d04ae5bf6c5a38d0", size = 202469, upload-time = "2026-03-12T09:01:13.38Z" },
+]
+
 [[package]]
 name = "prompt-toolkit"
 version = "3.0.52"
@@ -1677,6 +2149,52 @@ wheels = [
     { url = "https://files.pythonhosted.org/packages/c4/72/02445137af02769918a93807b2b7890047c32bfb9f90371cbc12688819eb/protobuf-6.33.6-py3-none-any.whl", hash = "sha256:77179e006c476e69bf8e8ce866640091ec42e1beb80b213c3900006ecfba6901", size = 170656, upload-time = "2026-03-18T19:04:59.826Z" },
 ]
 
+[[package]]
+name = "psycopg"
+version = "3.3.3"
+source = { registry = "https://pypi.org/simple" }
+dependencies = [
+    { name = "tzdata", marker = "sys_platform == 'win32'" },
+]
+sdist = { url = "https://files.pythonhosted.org/packages/d3/b6/379d0a960f8f435ec78720462fd94c4863e7a31237cf81bf76d0af5883bf/psycopg-3.3.3.tar.gz", hash = "sha256:5e9a47458b3c1583326513b2556a2a9473a1001a56c9efe9e587245b43148dd9", size = 165624, upload-time = "2026-02-18T16:52:16.546Z" }
+wheels = [
+    { url = "https://files.pythonhosted.org/packages/c8/5b/181e2e3becb7672b502f0ed7f16ed7352aca7c109cfb94cf3878a9186db9/psycopg-3.3.3-py3-none-any.whl", hash = "sha256:f96525a72bcfade6584ab17e89de415ff360748c766f0106959144dcbb38c698", size = 212768, upload-time = "2026-02-18T16:46:27.365Z" },
+]
+
+[package.optional-dependencies]
+binary = [
+    { name = "psycopg-binary", marker = "implementation_name != 'pypy'" },
+]
+
+[[package]]
+name = "psycopg-binary"
+version = "3.3.3"
+source = { registry = "https://pypi.org/simple" }
+wheels = [
+    { url = "https://files.pythonhosted.org/packages/03/0a/cac9fdf1df16a269ba0e5f0f06cac61f826c94cadb39df028cdfe19d3a33/psycopg_binary-3.3.3-cp313-cp313-macosx_10_13_x86_64.whl", hash = "sha256:05f32239aec25c5fb15f7948cffdc2dc0dac098e48b80a140e4ba32b572a2e7d", size = 4590414, upload-time = "2026-02-18T16:50:01.441Z" },
+    { url = "https://files.pythonhosted.org/packages/9c/c0/d8f8508fbf440edbc0099b1abff33003cd80c9e66eb3a1e78834e3fb4fb9/psycopg_binary-3.3.3-cp313-cp313-macosx_11_0_arm64.whl", hash = "sha256:7c84f9d214f2d1de2fafebc17fa68ac3f6561a59e291553dfc45ad299f4898c1", size = 4669021, upload-time = "2026-02-18T16:50:08.803Z" },
+    { url = "https://files.pythonhosted.org/packages/04/05/097016b77e343b4568feddf12c72171fc513acef9a4214d21b9478569068/psycopg_binary-3.3.3-cp313-cp313-manylinux2014_ppc64le.manylinux_2_17_ppc64le.whl", hash = "sha256:e77957d2ba17cada11be09a5066d93026cdb61ada7c8893101d7fe1c6e1f3925", size = 5467453, upload-time = "2026-02-18T16:50:14.985Z" },
+    { url = "https://files.pythonhosted.org/packages/91/23/73244e5feb55b5ca109cede6e97f32ef45189f0fdac4c80d75c99862729d/psycopg_binary-3.3.3-cp313-cp313-manylinux2014_x86_64.manylinux_2_17_x86_64.whl", hash = "sha256:42961609ac07c232a427da7c87a468d3c82fee6762c220f38e37cfdacb2b178d", size = 5151135, upload-time = "2026-02-18T16:50:24.82Z" },
+    { url = "https://files.pythonhosted.org/packages/11/49/5309473b9803b207682095201d8708bbc7842ddf3f192488a69204e36455/psycopg_binary-3.3.3-cp313-cp313-manylinux_2_27_aarch64.manylinux_2_28_aarch64.whl", hash = "sha256:ae07a3114313dd91fce686cab2f4c44af094398519af0e0f854bc707e1aeedf1", size = 6737315, upload-time = "2026-02-18T16:50:35.106Z" },
+    { url = "https://files.pythonhosted.org/packages/d4/5d/03abe74ef34d460b33c4d9662bf6ec1dd38888324323c1a1752133c10377/psycopg_binary-3.3.3-cp313-cp313-manylinux_2_38_riscv64.manylinux_2_39_riscv64.whl", hash = "sha256:d257c58d7b36a621dcce1d01476ad8b60f12d80eb1406aee4cf796f88b2ae482", size = 4979783, upload-time = "2026-02-18T16:50:42.067Z" },
+    { url = "https://files.pythonhosted.org/packages/f0/6c/3fbf8e604e15f2f3752900434046c00c90bb8764305a1b81112bff30ba24/psycopg_binary-3.3.3-cp313-cp313-musllinux_1_2_aarch64.whl", hash = "sha256:07c7211f9327d522c9c47560cae00a4ecf6687f4e02d779d035dd3177b41cb12", size = 4509023, upload-time = "2026-02-18T16:50:50.116Z" },
+    { url = "https://files.pythonhosted.org/packages/9c/6b/1a06b43b7c7af756c80b67eac8bfaa51d77e68635a8a8d246e4f0bb7604a/psycopg_binary-3.3.3-cp313-cp313-musllinux_1_2_ppc64le.whl", hash = "sha256:8e7e9eca9b363dbedeceeadd8be97149d2499081f3c52d141d7cd1f395a91f83", size = 4185874, upload-time = "2026-02-18T16:50:55.97Z" },
+    { url = "https://files.pythonhosted.org/packages/2b/d3/bf49e3dcaadba510170c8d111e5e69e5ae3f981c1554c5bb71c75ce354bb/psycopg_binary-3.3.3-cp313-cp313-musllinux_1_2_riscv64.whl", hash = "sha256:cb85b1d5702877c16f28d7b92ba030c1f49ebcc9b87d03d8c10bf45a2f1c7508", size = 3925668, upload-time = "2026-02-18T16:51:03.299Z" },
+    { url = "https://files.pythonhosted.org/packages/f8/92/0aac830ed6a944fe334404e1687a074e4215630725753f0e3e9a9a595b62/psycopg_binary-3.3.3-cp313-cp313-musllinux_1_2_x86_64.whl", hash = "sha256:4d4606c84d04b80f9138d72f1e28c6c02dc5ae0c7b8f3f8aaf89c681ce1cd1b1", size = 4234973, upload-time = "2026-02-18T16:51:09.097Z" },
+    { url = "https://files.pythonhosted.org/packages/2e/96/102244653ee5a143ece5afe33f00f52fe64e389dfce8dbc87580c6d70d3d/psycopg_binary-3.3.3-cp313-cp313-win_amd64.whl", hash = "sha256:74eae563166ebf74e8d950ff359be037b85723d99ca83f57d9b244a871d6c13b", size = 3551342, upload-time = "2026-02-18T16:51:13.892Z" },
+    { url = "https://files.pythonhosted.org/packages/a2/71/7a57e5b12275fe7e7d84d54113f0226080423a869118419c9106c083a21c/psycopg_binary-3.3.3-cp314-cp314-macosx_10_15_x86_64.whl", hash = "sha256:497852c5eaf1f0c2d88ab74a64a8097c099deac0c71de1cbcf18659a8a04a4b2", size = 4607368, upload-time = "2026-02-18T16:51:19.295Z" },
+    { url = "https://files.pythonhosted.org/packages/c7/04/cb834f120f2b2c10d4003515ef9ca9d688115b9431735e3936ae48549af8/psycopg_binary-3.3.3-cp314-cp314-macosx_11_0_arm64.whl", hash = "sha256:258d1ea53464d29768bf25930f43291949f4c7becc706f6e220c515a63a24edd", size = 4687047, upload-time = "2026-02-18T16:51:23.84Z" },
+    { url = "https://files.pythonhosted.org/packages/40/e9/47a69692d3da9704468041aa5ed3ad6fc7f6bb1a5ae788d261a26bbca6c7/psycopg_binary-3.3.3-cp314-cp314-manylinux2014_ppc64le.manylinux_2_17_ppc64le.whl", hash = "sha256:111c59897a452196116db12e7f608da472fbff000693a21040e35fc978b23430", size = 5487096, upload-time = "2026-02-18T16:51:29.645Z" },
+    { url = "https://files.pythonhosted.org/packages/0b/b6/0e0dd6a2f802864a4ae3dbadf4ec620f05e3904c7842b326aafc43e5f464/psycopg_binary-3.3.3-cp314-cp314-manylinux2014_x86_64.manylinux_2_17_x86_64.whl", hash = "sha256:17bb6600e2455993946385249a3c3d0af52cd70c1c1cdbf712e9d696d0b0bf1b", size = 5168720, upload-time = "2026-02-18T16:51:36.499Z" },
+    { url = "https://files.pythonhosted.org/packages/6f/0d/977af38ac19a6b55d22dff508bd743fd7c1901e1b73657e7937c7cccb0a3/psycopg_binary-3.3.3-cp314-cp314-manylinux_2_27_aarch64.manylinux_2_28_aarch64.whl", hash = "sha256:642050398583d61c9856210568eb09a8e4f2fe8224bf3be21b67a370e677eead", size = 6762076, upload-time = "2026-02-18T16:51:43.167Z" },
+    { url = "https://files.pythonhosted.org/packages/34/40/912a39d48322cf86895c0eaf2d5b95cb899402443faefd4b09abbba6b6e1/psycopg_binary-3.3.3-cp314-cp314-manylinux_2_38_riscv64.manylinux_2_39_riscv64.whl", hash = "sha256:533efe6dc3a7cba5e2a84e38970786bb966306863e45f3db152007e9f48638a6", size = 4997623, upload-time = "2026-02-18T16:51:47.707Z" },
+    { url = "https://files.pythonhosted.org/packages/98/0c/c14d0e259c65dc7be854d926993f151077887391d5a081118907a9d89603/psycopg_binary-3.3.3-cp314-cp314-musllinux_1_2_aarch64.whl", hash = "sha256:5958dbf28b77ce2033482f6cb9ef04d43f5d8f4b7636e6963d5626f000efb23e", size = 4532096, upload-time = "2026-02-18T16:51:51.421Z" },
+    { url = "https://files.pythonhosted.org/packages/39/21/8b7c50a194cfca6ea0fd4d1f276158307785775426e90700ab2eba5cd623/psycopg_binary-3.3.3-cp314-cp314-musllinux_1_2_ppc64le.whl", hash = "sha256:a6af77b6626ce92b5817bf294b4d45ec1a6161dba80fc2d82cdffdd6814fd023", size = 4208884, upload-time = "2026-02-18T16:51:57.336Z" },
+    { url = "https://files.pythonhosted.org/packages/c7/2c/a4981bf42cf30ebba0424971d7ce70a222ae9b82594c42fc3f2105d7b525/psycopg_binary-3.3.3-cp314-cp314-musllinux_1_2_riscv64.whl", hash = "sha256:47f06fcbe8542b4d96d7392c476a74ada521c5aebdb41c3c0155f6595fc14c8d", size = 3944542, upload-time = "2026-02-18T16:52:04.266Z" },
+    { url = "https://files.pythonhosted.org/packages/60/e9/b7c29b56aa0b85a4e0c4d89db691c1ceef08f46a356369144430c155a2f5/psycopg_binary-3.3.3-cp314-cp314-musllinux_1_2_x86_64.whl", hash = "sha256:e7800e6c6b5dc4b0ca7cc7370f770f53ac83886b76afda0848065a674231e856", size = 4254339, upload-time = "2026-02-18T16:52:10.444Z" },
+    { url = "https://files.pythonhosted.org/packages/98/5a/291d89f44d3820fffb7a04ebc8f3ef5dda4f542f44a5daea0c55a84abf45/psycopg_binary-3.3.3-cp314-cp314-win_amd64.whl", hash = "sha256:165f22ab5a9513a3d7425ffb7fcc7955ed8ccaeef6d37e369d6cc1dff1582383", size = 3652796, upload-time = "2026-02-18T16:52:14.02Z" },
+]
+
 [[package]]
 name = "py-key-value-aio"
 version = "0.4.4"
@@ -1843,6 +2361,9 @@ vertexai = [
     { name = "google-auth" },
     { name = "requests" },
 ]
+voyageai = [
+    { name = "voyageai", marker = "python_full_version < '3.14'" },
+]
 xai = [
     { name = "xai-sdk" },
 ]
@@ -2037,6 +2558,30 @@ wheels = [
     { url = "https://files.pythonhosted.org/packages/1b/d0/397f9626e711ff749a95d96b7af99b9c566a9bb5129b8e4c10fc4d100304/python_multipart-0.0.22-py3-none-any.whl", hash = "sha256:2b2cd894c83d21bf49d702499531c7bafd057d730c201782048f7945d82de155", size = 24579, upload-time = "2026-01-25T10:15:54.811Z" },
 ]
 
+[[package]]
+name = "pytokens"
+version = "0.4.1"
+source = { registry = "https://pypi.org/simple" }
+sdist = { url = "https://files.pythonhosted.org/packages/b6/34/b4e015b99031667a7b960f888889c5bd34ef585c85e1cb56a594b92836ac/pytokens-0.4.1.tar.gz", hash = "sha256:292052fe80923aae2260c073f822ceba21f3872ced9a68bb7953b348e561179a", size = 23015, upload-time = "2026-01-30T01:03:45.924Z" }
+wheels = [
+    { url = "https://files.pythonhosted.org/packages/cb/dc/08b1a080372afda3cceb4f3c0a7ba2bde9d6a5241f1edb02a22a019ee147/pytokens-0.4.1-cp313-cp313-macosx_11_0_arm64.whl", hash = "sha256:8bdb9d0ce90cbf99c525e75a2fa415144fd570a1ba987380190e8b786bc6ef9b", size = 160720, upload-time = "2026-01-30T01:03:13.843Z" },
+    { url = "https://files.pythonhosted.org/packages/64/0c/41ea22205da480837a700e395507e6a24425151dfb7ead73343d6e2d7ffe/pytokens-0.4.1-cp313-cp313-manylinux2014_aarch64.manylinux_2_17_aarch64.manylinux_2_28_aarch64.whl", hash = "sha256:5502408cab1cb18e128570f8d598981c68a50d0cbd7c61312a90507cd3a1276f", size = 254204, upload-time = "2026-01-30T01:03:14.886Z" },
+    { url = "https://files.pythonhosted.org/packages/e0/d2/afe5c7f8607018beb99971489dbb846508f1b8f351fcefc225fcf4b2adc0/pytokens-0.4.1-cp313-cp313-manylinux2014_x86_64.manylinux_2_17_x86_64.manylinux_2_28_x86_64.whl", hash = "sha256:29d1d8fb1030af4d231789959f21821ab6325e463f0503a61d204343c9b355d1", size = 268423, upload-time = "2026-01-30T01:03:15.936Z" },
+    { url = "https://files.pythonhosted.org/packages/68/d4/00ffdbd370410c04e9591da9220a68dc1693ef7499173eb3e30d06e05ed1/pytokens-0.4.1-cp313-cp313-musllinux_1_2_x86_64.whl", hash = "sha256:970b08dd6b86058b6dc07efe9e98414f5102974716232d10f32ff39701e841c4", size = 266859, upload-time = "2026-01-30T01:03:17.458Z" },
+    { url = "https://files.pythonhosted.org/packages/a7/c9/c3161313b4ca0c601eeefabd3d3b576edaa9afdefd32da97210700e47652/pytokens-0.4.1-cp313-cp313-win_amd64.whl", hash = "sha256:9bd7d7f544d362576be74f9d5901a22f317efc20046efe2034dced238cbbfe78", size = 103520, upload-time = "2026-01-30T01:03:18.652Z" },
+    { url = "https://files.pythonhosted.org/packages/8f/a7/b470f672e6fc5fee0a01d9e75005a0e617e162381974213a945fcd274843/pytokens-0.4.1-cp314-cp314-macosx_11_0_arm64.whl", hash = "sha256:4a14d5f5fc78ce85e426aa159489e2d5961acf0e47575e08f35584009178e321", size = 160821, upload-time = "2026-01-30T01:03:19.684Z" },
+    { url = "https://files.pythonhosted.org/packages/80/98/e83a36fe8d170c911f864bfded690d2542bfcfacb9c649d11a9e6eb9dc41/pytokens-0.4.1-cp314-cp314-manylinux2014_aarch64.manylinux_2_17_aarch64.manylinux_2_28_aarch64.whl", hash = "sha256:97f50fd18543be72da51dd505e2ed20d2228c74e0464e4262e4899797803d7fa", size = 254263, upload-time = "2026-01-30T01:03:20.834Z" },
+    { url = "https://files.pythonhosted.org/packages/0f/95/70d7041273890f9f97a24234c00b746e8da86df462620194cef1d411ddeb/pytokens-0.4.1-cp314-cp314-manylinux2014_x86_64.manylinux_2_17_x86_64.manylinux_2_28_x86_64.whl", hash = "sha256:dc74c035f9bfca0255c1af77ddd2d6ae8419012805453e4b0e7513e17904545d", size = 268071, upload-time = "2026-01-30T01:03:21.888Z" },
+    { url = "https://files.pythonhosted.org/packages/da/79/76e6d09ae19c99404656d7db9c35dfd20f2086f3eb6ecb496b5b31163bad/pytokens-0.4.1-cp314-cp314-musllinux_1_2_x86_64.whl", hash = "sha256:f66a6bbe741bd431f6d741e617e0f39ec7257ca1f89089593479347cc4d13324", size = 271716, upload-time = "2026-01-30T01:03:23.633Z" },
+    { url = "https://files.pythonhosted.org/packages/79/37/482e55fa1602e0a7ff012661d8c946bafdc05e480ea5a32f4f7e336d4aa9/pytokens-0.4.1-cp314-cp314-win_amd64.whl", hash = "sha256:b35d7e5ad269804f6697727702da3c517bb8a5228afa450ab0fa787732055fc9", size = 104539, upload-time = "2026-01-30T01:03:24.788Z" },
+    { url = "https://files.pythonhosted.org/packages/30/e8/20e7db907c23f3d63b0be3b8a4fd1927f6da2395f5bcc7f72242bb963dfe/pytokens-0.4.1-cp314-cp314t-macosx_11_0_arm64.whl", hash = "sha256:8fcb9ba3709ff77e77f1c7022ff11d13553f3c30299a9fe246a166903e9091eb", size = 168474, upload-time = "2026-01-30T01:03:26.428Z" },
+    { url = "https://files.pythonhosted.org/packages/d6/81/88a95ee9fafdd8f5f3452107748fd04c24930d500b9aba9738f3ade642cc/pytokens-0.4.1-cp314-cp314t-manylinux2014_aarch64.manylinux_2_17_aarch64.manylinux_2_28_aarch64.whl", hash = "sha256:79fc6b8699564e1f9b521582c35435f1bd32dd06822322ec44afdeba666d8cb3", size = 290473, upload-time = "2026-01-30T01:03:27.415Z" },
+    { url = "https://files.pythonhosted.org/packages/cf/35/3aa899645e29b6375b4aed9f8d21df219e7c958c4c186b465e42ee0a06bf/pytokens-0.4.1-cp314-cp314t-manylinux2014_x86_64.manylinux_2_17_x86_64.manylinux_2_28_x86_64.whl", hash = "sha256:d31b97b3de0f61571a124a00ffe9a81fb9939146c122c11060725bd5aea79975", size = 303485, upload-time = "2026-01-30T01:03:28.558Z" },
+    { url = "https://files.pythonhosted.org/packages/52/a0/07907b6ff512674d9b201859f7d212298c44933633c946703a20c25e9d81/pytokens-0.4.1-cp314-cp314t-musllinux_1_2_x86_64.whl", hash = "sha256:967cf6e3fd4adf7de8fc73cd3043754ae79c36475c1c11d514fc72cf5490094a", size = 306698, upload-time = "2026-01-30T01:03:29.653Z" },
+    { url = "https://files.pythonhosted.org/packages/39/2a/cbbf9250020a4a8dd53ba83a46c097b69e5eb49dd14e708f496f548c6612/pytokens-0.4.1-cp314-cp314t-win_amd64.whl", hash = "sha256:584c80c24b078eec1e227079d56dc22ff755e0ba8654d8383b2c549107528918", size = 116287, upload-time = "2026-01-30T01:03:30.912Z" },
+    { url = "https://files.pythonhosted.org/packages/c6/78/397db326746f0a342855b81216ae1f0a32965deccfd7c830a2dbc66d2483/pytokens-0.4.1-py3-none-any.whl", hash = "sha256:26cef14744a8385f35d0e095dc8b3a7583f6c953c2e3d269c7f82484bf5ad2de", size = 13729, upload-time = "2026-01-30T01:03:45.029Z" },
+]
+
 [[package]]
 name = "pywin32"
 version = "311"
@@ -2195,6 +2740,18 @@ wheels = [
     { url = "https://files.pythonhosted.org/packages/1e/db/4254e3eabe8020b458f1a747140d32277ec7a271daf1d235b70dc0b4e6e3/requests-2.32.5-py3-none-any.whl", hash = "sha256:2462f94637a34fd532264295e186976db0f5d453d1cdd31473c85a6a161affb6", size = 64738, upload-time = "2025-08-18T20:46:00.542Z" },
 ]
 
+[[package]]
+name = "requests-toolbelt"
+version = "1.0.0"
+source = { registry = "https://pypi.org/simple" }
+dependencies = [
+    { name = "requests", marker = "python_full_version < '3.14'" },
+]
+sdist = { url = "https://files.pythonhosted.org/packages/f3/61/d7545dafb7ac2230c70d38d31cbfe4cc64f7144dc41f6e4e4b78ecd9f5bb/requests-toolbelt-1.0.0.tar.gz", hash = "sha256:7681a0a3d047012b5bdc0ee37d7f8f07ebe76ab08caeccfc3921ce23c88d5bc6", size = 206888, upload-time = "2023-05-01T04:11:33.229Z" }
+wheels = [
+    { url = "https://files.pythonhosted.org/packages/3f/51/d4db610ef29373b879047326cbf6fa98b6c1969d6f6dc423279de2b1be2c/requests_toolbelt-1.0.0-py2.py3-none-any.whl", hash = "sha256:cccfdd665f0a24fcf4726e690f65639d272bb0637b9b92dfd91a5568ccf6bd06", size = 54481, upload-time = "2023-05-01T04:11:28.427Z" },
+]
+
 [[package]]
 name = "rich"
 version = "14.3.3"
@@ -2364,6 +2921,18 @@ wheels = [
     { url = "https://files.pythonhosted.org/packages/e9/44/75a9c9421471a6c4805dbf2356f7c181a29c1879239abab1ea2cc8f38b40/sniffio-1.3.1-py3-none-any.whl", hash = "sha256:2f6da418d1f1e0fddd844478f41680e794e6051915791a034ff65e5f100525a2", size = 10235, upload-time = "2024-02-25T23:20:01.196Z" },
 ]
 
+[[package]]
+name = "sqlite-vec"
+version = "0.1.9"
+source = { registry = "https://pypi.org/simple" }
+wheels = [
+    { url = "https://files.pythonhosted.org/packages/68/85/9fad0045d8e7c8df3e0fa5a56c630e8e15ad6e5ca2e6106fceb666aa6638/sqlite_vec-0.1.9-py3-none-macosx_10_6_x86_64.whl", hash = "sha256:1b62a7f0a060d9475575d4e599bbf94a13d85af896bc1ce86ee80d1b5b48e5fb", size = 131171, upload-time = "2026-03-31T08:02:31.717Z" },
+    { url = "https://files.pythonhosted.org/packages/a4/3d/3677e0cd2f92e5ebc43cd29fbf565b75582bff1ccfa0b8327c7508e1084f/sqlite_vec-0.1.9-py3-none-macosx_11_0_arm64.whl", hash = "sha256:1d52e30513bae4cc9778ddbf6145610434081be4c3afe57cd877893bad9f6b6c", size = 165434, upload-time = "2026-03-31T08:02:32.712Z" },
+    { url = "https://files.pythonhosted.org/packages/00/d4/f2b936d3bdc38eadcbd2a87875815db36430fab0363182ba5d12cd8e0b51/sqlite_vec-0.1.9-py3-none-manylinux_2_17_aarch64.manylinux2014_aarch64.whl", hash = "sha256:4e921e592f24a5f9a18f590b6ddd530eb637e2d474e3b1972f9bbeb773aa3cb9", size = 160076, upload-time = "2026-03-31T08:02:33.796Z" },
+    { url = "https://files.pythonhosted.org/packages/6f/ad/6afd073b0f817b3e03f9e37ad626ae341805891f23c74b5292818f49ac63/sqlite_vec-0.1.9-py3-none-manylinux_2_17_x86_64.manylinux2014_x86_64.manylinux1_x86_64.whl", hash = "sha256:1515727990b49e79bcaf75fdee2ffc7d461f8b66905013231251f1c8938e7786", size = 163388, upload-time = "2026-03-31T08:02:34.888Z" },
+    { url = "https://files.pythonhosted.org/packages/42/89/81b2907cda14e566b9bf215e2ad82fc9b349edf07d2010756ffdb902f328/sqlite_vec-0.1.9-py3-none-win_amd64.whl", hash = "sha256:4a28dc12fa4b53d7b1dced22da2488fade444e96b5d16fd2d698cd670675cf32", size = 292804, upload-time = "2026-03-31T08:02:36.035Z" },
+]
+
 [[package]]
 name = "sse-starlette"
 version = "3.3.3"
@@ -2495,6 +3064,18 @@ wheels = [
     { url = "https://files.pythonhosted.org/packages/16/e1/3079a9ff9b8e11b846c6ac5c8b5bfb7ff225eee721825310c91b3b50304f/tqdm-4.67.3-py3-none-any.whl", hash = "sha256:ee1e4c0e59148062281c49d80b25b67771a127c85fc9676d3be5f243206826bf", size = 78374, upload-time = "2026-02-03T17:35:50.982Z" },
 ]
 
+[[package]]
+name = "typeguard"
+version = "4.5.1"
+source = { registry = "https://pypi.org/simple" }
+dependencies = [
+    { name = "typing-extensions" },
+]
+sdist = { url = "https://files.pythonhosted.org/packages/2b/e8/66e25efcc18542d58706ce4e50415710593721aae26e794ab1dec34fb66f/typeguard-4.5.1.tar.gz", hash = "sha256:f6f8ecbbc819c9bc749983cc67c02391e16a9b43b8b27f15dc70ed7c4a007274", size = 80121, upload-time = "2026-02-19T16:09:03.392Z" }
+wheels = [
+    { url = "https://files.pythonhosted.org/packages/91/88/b55b3117287a8540b76dbdd87733808d4d01c8067a3b339408c250bb3600/typeguard-4.5.1-py3-none-any.whl", hash = "sha256:44d2bf329d49a244110a090b55f5f91aa82d9a9834ebfd30bcc73651e4a8cc40", size = 36745, upload-time = "2026-02-19T16:09:01.6Z" },
+]
+
 [[package]]
 name = "typer"
 version = "0.24.1"
@@ -2552,6 +3133,15 @@ wheels = [
     { url = "https://files.pythonhosted.org/packages/dc/9b/47798a6c91d8bdb567fe2698fe81e0c6b7cb7ef4d13da4114b41d239f65d/typing_inspection-0.4.2-py3-none-any.whl", hash = "sha256:4ed1cacbdc298c220f1bd249ed5287caa16f34d44ef4e9c3d0cbad5b521545e7", size = 14611, upload-time = "2025-10-01T02:14:40.154Z" },
 ]
 
+[[package]]
+name = "tzdata"
+version = "2026.1"
+source = { registry = "https://pypi.org/simple" }
+sdist = { url = "https://files.pythonhosted.org/packages/19/f5/cd531b2d15a671a40c0f66cf06bc3570a12cd56eef98960068ebbad1bf5a/tzdata-2026.1.tar.gz", hash = "sha256:67658a1903c75917309e753fdc349ac0efd8c27db7a0cb406a25be4840f87f98", size = 197639, upload-time = "2026-04-03T11:25:22.002Z" }
+wheels = [
+    { url = "https://files.pythonhosted.org/packages/b0/70/d460bd685a170790ec89317e9bd33047988e4bce507b831f5db771e142de/tzdata-2026.1-py2.py3-none-any.whl", hash = "sha256:4b1d2be7ac37ceafd7327b961aa3a54e467efbdb563a23655fbfe0d39cfc42a9", size = 348952, upload-time = "2026-04-03T11:25:20.313Z" },
+]
+
 [[package]]
 name = "uncalled-for"
 version = "0.2.0"
@@ -2570,6 +3160,28 @@ wheels = [
     { url = "https://files.pythonhosted.org/packages/39/08/aaaad47bc4e9dc8c725e68f9d04865dbcb2052843ff09c97b08904852d84/urllib3-2.6.3-py3-none-any.whl", hash = "sha256:bf272323e553dfb2e87d9bfd225ca7b0f467b919d7bbd355436d3fd37cb0acd4", size = 131584, upload-time = "2026-01-07T16:24:42.685Z" },
 ]
 
+[[package]]
+name = "uuid-utils"
+version = "0.14.1"
+source = { registry = "https://pypi.org/simple" }
+sdist = { url = "https://files.pythonhosted.org/packages/7b/d1/38a573f0c631c062cf42fa1f5d021d4dd3c31fb23e4376e4b56b0c9fbbed/uuid_utils-0.14.1.tar.gz", hash = "sha256:9bfc95f64af80ccf129c604fb6b8ca66c6f256451e32bc4570f760e4309c9b69", size = 22195, upload-time = "2026-02-20T22:50:38.833Z" }
+wheels = [
+    { url = "https://files.pythonhosted.org/packages/43/b7/add4363039a34506a58457d96d4aa2126061df3a143eb4d042aedd6a2e76/uuid_utils-0.14.1-cp39-abi3-macosx_10_12_x86_64.macosx_11_0_arm64.macosx_10_12_universal2.whl", hash = "sha256:93a3b5dc798a54a1feb693f2d1cb4cf08258c32ff05ae4929b5f0a2ca624a4f0", size = 604679, upload-time = "2026-02-20T22:50:27.469Z" },
+    { url = "https://files.pythonhosted.org/packages/dd/84/d1d0bef50d9e66d31b2019997c741b42274d53dde2e001b7a83e9511c339/uuid_utils-0.14.1-cp39-abi3-macosx_10_12_x86_64.whl", hash = "sha256:ccd65a4b8e83af23eae5e56d88034b2fe7264f465d3e830845f10d1591b81741", size = 309346, upload-time = "2026-02-20T22:50:31.857Z" },
+    { url = "https://files.pythonhosted.org/packages/ef/ed/b6d6fd52a6636d7c3eddf97d68da50910bf17cd5ac221992506fb56cf12e/uuid_utils-0.14.1-cp39-abi3-manylinux_2_17_aarch64.manylinux2014_aarch64.whl", hash = "sha256:b56b0cacd81583834820588378e432b0696186683b813058b707aedc1e16c4b1", size = 344714, upload-time = "2026-02-20T22:50:42.642Z" },
+    { url = "https://files.pythonhosted.org/packages/a8/a7/a19a1719fb626fe0b31882db36056d44fe904dc0cf15b06fdf56b2679cf7/uuid_utils-0.14.1-cp39-abi3-manylinux_2_17_armv7l.manylinux2014_armv7l.whl", hash = "sha256:bb3cf14de789097320a3c56bfdfdd51b1225d11d67298afbedee7e84e3837c96", size = 350914, upload-time = "2026-02-20T22:50:36.487Z" },
+    { url = "https://files.pythonhosted.org/packages/1d/fc/f6690e667fdc3bb1a73f57951f97497771c56fe23e3d302d7404be394d4f/uuid_utils-0.14.1-cp39-abi3-manylinux_2_17_ppc64le.manylinux2014_ppc64le.whl", hash = "sha256:60e0854a90d67f4b0cc6e54773deb8be618f4c9bad98d3326f081423b5d14fae", size = 482609, upload-time = "2026-02-20T22:50:37.511Z" },
+    { url = "https://files.pythonhosted.org/packages/54/6e/dcd3fa031320921a12ec7b4672dea3bd1dd90ddffa363a91831ba834d559/uuid_utils-0.14.1-cp39-abi3-manylinux_2_17_x86_64.manylinux2014_x86_64.whl", hash = "sha256:ce6743ba194de3910b5feb1a62590cd2587e33a73ab6af8a01b642ceb5055862", size = 345699, upload-time = "2026-02-20T22:50:46.87Z" },
+    { url = "https://files.pythonhosted.org/packages/04/28/e5220204b58b44ac0047226a9d016a113fde039280cc8732d9e6da43b39f/uuid_utils-0.14.1-cp39-abi3-manylinux_2_5_i686.manylinux1_i686.whl", hash = "sha256:043fb58fde6cf1620a6c066382f04f87a8e74feb0f95a585e4ed46f5d44af57b", size = 372205, upload-time = "2026-02-20T22:50:28.438Z" },
+    { url = "https://files.pythonhosted.org/packages/c7/d9/3d2eb98af94b8dfffc82b6a33b4dfc87b0a5de2c68a28f6dde0db1f8681b/uuid_utils-0.14.1-cp39-abi3-musllinux_1_2_aarch64.whl", hash = "sha256:c915d53f22945e55fe0d3d3b0b87fd965a57f5fd15666fd92d6593a73b1dd297", size = 521836, upload-time = "2026-02-20T22:50:23.057Z" },
+    { url = "https://files.pythonhosted.org/packages/a8/15/0eb106cc6fe182f7577bc0ab6e2f0a40be247f35c5e297dbf7bbc460bd02/uuid_utils-0.14.1-cp39-abi3-musllinux_1_2_armv7l.whl", hash = "sha256:0972488e3f9b449e83f006ead5a0e0a33ad4a13e4462e865b7c286ab7d7566a3", size = 625260, upload-time = "2026-02-20T22:50:25.949Z" },
+    { url = "https://files.pythonhosted.org/packages/3c/17/f539507091334b109e7496830af2f093d9fc8082411eafd3ece58af1f8ba/uuid_utils-0.14.1-cp39-abi3-musllinux_1_2_i686.whl", hash = "sha256:1c238812ae0c8ffe77d8d447a32c6dfd058ea4631246b08b5a71df586ff08531", size = 587824, upload-time = "2026-02-20T22:50:35.225Z" },
+    { url = "https://files.pythonhosted.org/packages/2e/c2/d37a7b2e41f153519367d4db01f0526e0d4b06f1a4a87f1c5dfca5d70a8b/uuid_utils-0.14.1-cp39-abi3-musllinux_1_2_x86_64.whl", hash = "sha256:bec8f8ef627af86abf8298e7ec50926627e29b34fa907fcfbedb45aaa72bca43", size = 551407, upload-time = "2026-02-20T22:50:44.915Z" },
+    { url = "https://files.pythonhosted.org/packages/65/36/2d24b2cbe78547c6532da33fb8613debd3126eccc33a6374ab788f5e46e9/uuid_utils-0.14.1-cp39-abi3-win32.whl", hash = "sha256:b54d6aa6252d96bac1fdbc80d26ba71bad9f220b2724d692ad2f2310c22ef523", size = 183476, upload-time = "2026-02-20T22:50:32.745Z" },
+    { url = "https://files.pythonhosted.org/packages/83/92/2d7e90df8b1a69ec4cff33243ce02b7a62f926ef9e2f0eca5a026889cd73/uuid_utils-0.14.1-cp39-abi3-win_amd64.whl", hash = "sha256:fc27638c2ce267a0ce3e06828aff786f91367f093c80625ee21dad0208e0f5ba", size = 187147, upload-time = "2026-02-20T22:50:45.807Z" },
+    { url = "https://files.pythonhosted.org/packages/d9/26/529f4beee17e5248e37e0bc17a2761d34c0fa3b1e5729c88adb2065bae6e/uuid_utils-0.14.1-cp39-abi3-win_arm64.whl", hash = "sha256:b04cb49b42afbc4ff8dbc60cf054930afc479d6f4dd7f1ec3bbe5dbfdde06b7a", size = 188132, upload-time = "2026-02-20T22:50:41.718Z" },
+]
+
 [[package]]
 name = "uvicorn"
 version = "0.42.0"
@@ -2583,6 +3195,27 @@ wheels = [
     { url = "https://files.pythonhosted.org/packages/0a/89/f8827ccff89c1586027a105e5630ff6139a64da2515e24dafe860bd9ae4d/uvicorn-0.42.0-py3-none-any.whl", hash = "sha256:96c30f5c7abe6f74ae8900a70e92b85ad6613b745d4879eb9b16ccad15645359", size = 68830, upload-time = "2026-03-16T06:19:48.325Z" },
 ]
 
+[[package]]
+name = "voyageai"
+version = "0.3.7"
+source = { registry = "https://pypi.org/simple" }
+dependencies = [
+    { name = "aiohttp", marker = "python_full_version < '3.14'" },
+    { name = "aiolimiter", marker = "python_full_version < '3.14'" },
+    { name = "ffmpeg-python", marker = "python_full_version < '3.14'" },
+    { name = "langchain-text-splitters", marker = "python_full_version < '3.14'" },
+    { name = "numpy", marker = "python_full_version < '3.14'" },
+    { name = "pillow", marker = "python_full_version < '3.14'" },
+    { name = "pydantic", marker = "python_full_version < '3.14'" },
+    { name = "requests", marker = "python_full_version < '3.14'" },
+    { name = "tenacity", marker = "python_full_version < '3.14'" },
+    { name = "tokenizers", marker = "python_full_version < '3.14'" },
+]
+sdist = { url = "https://files.pythonhosted.org/packages/94/16/1b46b3cd401e1717a68197c1fe336d7bb4e0a1833f8105e1738f5b1add05/voyageai-0.3.7.tar.gz", hash = "sha256:826cd97f97223f42b5babc5c459c9c80f3a8215ce5c0e007b0b276550f790d24", size = 26485, upload-time = "2025-12-16T18:43:05.26Z" }
+wheels = [
+    { url = "https://files.pythonhosted.org/packages/60/64/89f6325666d6836979f94ac88b96fefc7527e02e61abc81359843585e088/voyageai-0.3.7-py3-none-any.whl", hash = "sha256:909f6c033001e5a3b3caf970525bf3614a1bfef9003cf3c3b68207dfdb53e86d", size = 34691, upload-time = "2025-12-16T18:43:04.073Z" },
+]
+
 [[package]]
 name = "watchfiles"
 version = "1.1.1"
@@ -2743,6 +3376,74 @@ wheels = [
     { url = "https://files.pythonhosted.org/packages/27/5d/62c394d46e56e43989b34977b490f84bd60ff715e8ea696880f63546b8be/xai_sdk-1.9.1-py3-none-any.whl", hash = "sha256:3f313f1238d847ec08401894c42bf91f034fdeae04fe279c974b0e2a9644573d", size = 247192, upload-time = "2026-03-19T22:57:45.447Z" },
 ]
 
+[[package]]
+name = "xxhash"
+version = "3.6.0"
+source = { registry = "https://pypi.org/simple" }
+sdist = { url = "https://files.pythonhosted.org/packages/02/84/30869e01909fb37a6cc7e18688ee8bf1e42d57e7e0777636bd47524c43c7/xxhash-3.6.0.tar.gz", hash = "sha256:f0162a78b13a0d7617b2845b90c763339d1f1d82bb04a4b07f4ab535cc5e05d6", size = 85160, upload-time = "2025-10-02T14:37:08.097Z" }
+wheels = [
+    { url = "https://files.pythonhosted.org/packages/33/76/35d05267ac82f53ae9b0e554da7c5e281ee61f3cad44c743f0fcd354f211/xxhash-3.6.0-cp313-cp313-macosx_10_13_x86_64.whl", hash = "sha256:599e64ba7f67472481ceb6ee80fa3bd828fd61ba59fb11475572cc5ee52b89ec", size = 32738, upload-time = "2025-10-02T14:34:55.839Z" },
+    { url = "https://files.pythonhosted.org/packages/31/a8/3fbce1cd96534a95e35d5120637bf29b0d7f5d8fa2f6374e31b4156dd419/xxhash-3.6.0-cp313-cp313-macosx_11_0_arm64.whl", hash = "sha256:7d8b8aaa30fca4f16f0c84a5c8d7ddee0e25250ec2796c973775373257dde8f1", size = 30821, upload-time = "2025-10-02T14:34:57.219Z" },
+    { url = "https://files.pythonhosted.org/packages/0c/ea/d387530ca7ecfa183cb358027f1833297c6ac6098223fd14f9782cd0015c/xxhash-3.6.0-cp313-cp313-manylinux1_i686.manylinux_2_28_i686.manylinux_2_5_i686.whl", hash = "sha256:d597acf8506d6e7101a4a44a5e428977a51c0fadbbfd3c39650cca9253f6e5a6", size = 194127, upload-time = "2025-10-02T14:34:59.21Z" },
+    { url = "https://files.pythonhosted.org/packages/ba/0c/71435dcb99874b09a43b8d7c54071e600a7481e42b3e3ce1eb5226a5711a/xxhash-3.6.0-cp313-cp313-manylinux2014_aarch64.manylinux_2_17_aarch64.manylinux_2_28_aarch64.whl", hash = "sha256:858dc935963a33bc33490128edc1c12b0c14d9c7ebaa4e387a7869ecc4f3e263", size = 212975, upload-time = "2025-10-02T14:35:00.816Z" },
+    { url = "https://files.pythonhosted.org/packages/84/7a/c2b3d071e4bb4a90b7057228a99b10d51744878f4a8a6dd643c8bd897620/xxhash-3.6.0-cp313-cp313-manylinux2014_ppc64le.manylinux_2_17_ppc64le.manylinux_2_28_ppc64le.whl", hash = "sha256:ba284920194615cb8edf73bf52236ce2e1664ccd4a38fdb543506413529cc546", size = 212241, upload-time = "2025-10-02T14:35:02.207Z" },
+    { url = "https://files.pythonhosted.org/packages/81/5f/640b6eac0128e215f177df99eadcd0f1b7c42c274ab6a394a05059694c5a/xxhash-3.6.0-cp313-cp313-manylinux2014_s390x.manylinux_2_17_s390x.manylinux_2_28_s390x.whl", hash = "sha256:4b54219177f6c6674d5378bd862c6aedf64725f70dd29c472eaae154df1a2e89", size = 445471, upload-time = "2025-10-02T14:35:03.61Z" },
+    { url = "https://files.pythonhosted.org/packages/5e/1e/3c3d3ef071b051cc3abbe3721ffb8365033a172613c04af2da89d5548a87/xxhash-3.6.0-cp313-cp313-manylinux2014_x86_64.manylinux_2_17_x86_64.manylinux_2_28_x86_64.whl", hash = "sha256:42c36dd7dbad2f5238950c377fcbf6811b1cdb1c444fab447960030cea60504d", size = 193936, upload-time = "2025-10-02T14:35:05.013Z" },
+    { url = "https://files.pythonhosted.org/packages/2c/bd/4a5f68381939219abfe1c22a9e3a5854a4f6f6f3c4983a87d255f21f2e5d/xxhash-3.6.0-cp313-cp313-musllinux_1_2_aarch64.whl", hash = "sha256:f22927652cba98c44639ffdc7aaf35828dccf679b10b31c4ad72a5b530a18eb7", size = 210440, upload-time = "2025-10-02T14:35:06.239Z" },
+    { url = "https://files.pythonhosted.org/packages/eb/37/b80fe3d5cfb9faff01a02121a0f4d565eb7237e9e5fc66e73017e74dcd36/xxhash-3.6.0-cp313-cp313-musllinux_1_2_i686.whl", hash = "sha256:b45fad44d9c5c119e9c6fbf2e1c656a46dc68e280275007bbfd3d572b21426db", size = 197990, upload-time = "2025-10-02T14:35:07.735Z" },
+    { url = "https://files.pythonhosted.org/packages/d7/fd/2c0a00c97b9e18f72e1f240ad4e8f8a90fd9d408289ba9c7c495ed7dc05c/xxhash-3.6.0-cp313-cp313-musllinux_1_2_ppc64le.whl", hash = "sha256:6f2580ffab1a8b68ef2b901cde7e55fa8da5e4be0977c68f78fc80f3c143de42", size = 210689, upload-time = "2025-10-02T14:35:09.438Z" },
+    { url = "https://files.pythonhosted.org/packages/93/86/5dd8076a926b9a95db3206aba20d89a7fc14dd5aac16e5c4de4b56033140/xxhash-3.6.0-cp313-cp313-musllinux_1_2_s390x.whl", hash = "sha256:40c391dd3cd041ebc3ffe6f2c862f402e306eb571422e0aa918d8070ba31da11", size = 414068, upload-time = "2025-10-02T14:35:11.162Z" },
+    { url = "https://files.pythonhosted.org/packages/af/3c/0bb129170ee8f3650f08e993baee550a09593462a5cddd8e44d0011102b1/xxhash-3.6.0-cp313-cp313-musllinux_1_2_x86_64.whl", hash = "sha256:f205badabde7aafd1a31e8ca2a3e5a763107a71c397c4481d6a804eb5063d8bd", size = 191495, upload-time = "2025-10-02T14:35:12.971Z" },
+    { url = "https://files.pythonhosted.org/packages/e9/3a/6797e0114c21d1725e2577508e24006fd7ff1d8c0c502d3b52e45c1771d8/xxhash-3.6.0-cp313-cp313-win32.whl", hash = "sha256:2577b276e060b73b73a53042ea5bd5203d3e6347ce0d09f98500f418a9fcf799", size = 30620, upload-time = "2025-10-02T14:35:14.129Z" },
+    { url = "https://files.pythonhosted.org/packages/86/15/9bc32671e9a38b413a76d24722a2bf8784a132c043063a8f5152d390b0f9/xxhash-3.6.0-cp313-cp313-win_amd64.whl", hash = "sha256:757320d45d2fbcce8f30c42a6b2f47862967aea7bf458b9625b4bbe7ee390392", size = 31542, upload-time = "2025-10-02T14:35:15.21Z" },
+    { url = "https://files.pythonhosted.org/packages/39/c5/cc01e4f6188656e56112d6a8e0dfe298a16934b8c47a247236549a3f7695/xxhash-3.6.0-cp313-cp313-win_arm64.whl", hash = "sha256:457b8f85dec5825eed7b69c11ae86834a018b8e3df5e77783c999663da2f96d6", size = 27880, upload-time = "2025-10-02T14:35:16.315Z" },
+    { url = "https://files.pythonhosted.org/packages/f3/30/25e5321c8732759e930c555176d37e24ab84365482d257c3b16362235212/xxhash-3.6.0-cp313-cp313t-macosx_10_13_x86_64.whl", hash = "sha256:a42e633d75cdad6d625434e3468126c73f13f7584545a9cf34e883aa1710e702", size = 32956, upload-time = "2025-10-02T14:35:17.413Z" },
+    { url = "https://files.pythonhosted.org/packages/9f/3c/0573299560d7d9f8ab1838f1efc021a280b5ae5ae2e849034ef3dee18810/xxhash-3.6.0-cp313-cp313t-macosx_11_0_arm64.whl", hash = "sha256:568a6d743219e717b07b4e03b0a828ce593833e498c3b64752e0f5df6bfe84db", size = 31072, upload-time = "2025-10-02T14:35:18.844Z" },
+    { url = "https://files.pythonhosted.org/packages/7a/1c/52d83a06e417cd9d4137722693424885cc9878249beb3a7c829e74bf7ce9/xxhash-3.6.0-cp313-cp313t-manylinux1_i686.manylinux_2_28_i686.manylinux_2_5_i686.whl", hash = "sha256:bec91b562d8012dae276af8025a55811b875baace6af510412a5e58e3121bc54", size = 196409, upload-time = "2025-10-02T14:35:20.31Z" },
+    { url = "https://files.pythonhosted.org/packages/e3/8e/c6d158d12a79bbd0b878f8355432075fc82759e356ab5a111463422a239b/xxhash-3.6.0-cp313-cp313t-manylinux2014_aarch64.manylinux_2_17_aarch64.manylinux_2_28_aarch64.whl", hash = "sha256:78e7f2f4c521c30ad5e786fdd6bae89d47a32672a80195467b5de0480aa97b1f", size = 215736, upload-time = "2025-10-02T14:35:21.616Z" },
+    { url = "https://files.pythonhosted.org/packages/bc/68/c4c80614716345d55071a396cf03d06e34b5f4917a467faf43083c995155/xxhash-3.6.0-cp313-cp313t-manylinux2014_ppc64le.manylinux_2_17_ppc64le.manylinux_2_28_ppc64le.whl", hash = "sha256:3ed0df1b11a79856df5ffcab572cbd6b9627034c1c748c5566fa79df9048a7c5", size = 214833, upload-time = "2025-10-02T14:35:23.32Z" },
+    { url = "https://files.pythonhosted.org/packages/7e/e9/ae27c8ffec8b953efa84c7c4a6c6802c263d587b9fc0d6e7cea64e08c3af/xxhash-3.6.0-cp313-cp313t-manylinux2014_s390x.manylinux_2_17_s390x.manylinux_2_28_s390x.whl", hash = "sha256:0e4edbfc7d420925b0dd5e792478ed393d6e75ff8fc219a6546fb446b6a417b1", size = 448348, upload-time = "2025-10-02T14:35:25.111Z" },
+    { url = "https://files.pythonhosted.org/packages/d7/6b/33e21afb1b5b3f46b74b6bd1913639066af218d704cc0941404ca717fc57/xxhash-3.6.0-cp313-cp313t-manylinux2014_x86_64.manylinux_2_17_x86_64.manylinux_2_28_x86_64.whl", hash = "sha256:fba27a198363a7ef87f8c0f6b171ec36b674fe9053742c58dd7e3201c1ab30ee", size = 196070, upload-time = "2025-10-02T14:35:26.586Z" },
+    { url = "https://files.pythonhosted.org/packages/96/b6/fcabd337bc5fa624e7203aa0fa7d0c49eed22f72e93229431752bddc83d9/xxhash-3.6.0-cp313-cp313t-musllinux_1_2_aarch64.whl", hash = "sha256:794fe9145fe60191c6532fa95063765529770edcdd67b3d537793e8004cabbfd", size = 212907, upload-time = "2025-10-02T14:35:28.087Z" },
+    { url = "https://files.pythonhosted.org/packages/4b/d3/9ee6160e644d660fcf176c5825e61411c7f62648728f69c79ba237250143/xxhash-3.6.0-cp313-cp313t-musllinux_1_2_i686.whl", hash = "sha256:6105ef7e62b5ac73a837778efc331a591d8442f8ef5c7e102376506cb4ae2729", size = 200839, upload-time = "2025-10-02T14:35:29.857Z" },
+    { url = "https://files.pythonhosted.org/packages/0d/98/e8de5baa5109394baf5118f5e72ab21a86387c4f89b0e77ef3e2f6b0327b/xxhash-3.6.0-cp313-cp313t-musllinux_1_2_ppc64le.whl", hash = "sha256:f01375c0e55395b814a679b3eea205db7919ac2af213f4a6682e01220e5fe292", size = 213304, upload-time = "2025-10-02T14:35:31.222Z" },
+    { url = "https://files.pythonhosted.org/packages/7b/1d/71056535dec5c3177eeb53e38e3d367dd1d16e024e63b1cee208d572a033/xxhash-3.6.0-cp313-cp313t-musllinux_1_2_s390x.whl", hash = "sha256:d706dca2d24d834a4661619dcacf51a75c16d65985718d6a7d73c1eeeb903ddf", size = 416930, upload-time = "2025-10-02T14:35:32.517Z" },
+    { url = "https://files.pythonhosted.org/packages/dc/6c/5cbde9de2cd967c322e651c65c543700b19e7ae3e0aae8ece3469bf9683d/xxhash-3.6.0-cp313-cp313t-musllinux_1_2_x86_64.whl", hash = "sha256:5f059d9faeacd49c0215d66f4056e1326c80503f51a1532ca336a385edadd033", size = 193787, upload-time = "2025-10-02T14:35:33.827Z" },
+    { url = "https://files.pythonhosted.org/packages/19/fa/0172e350361d61febcea941b0cc541d6e6c8d65d153e85f850a7b256ff8a/xxhash-3.6.0-cp313-cp313t-win32.whl", hash = "sha256:1244460adc3a9be84731d72b8e80625788e5815b68da3da8b83f78115a40a7ec", size = 30916, upload-time = "2025-10-02T14:35:35.107Z" },
+    { url = "https://files.pythonhosted.org/packages/ad/e6/e8cf858a2b19d6d45820f072eff1bea413910592ff17157cabc5f1227a16/xxhash-3.6.0-cp313-cp313t-win_amd64.whl", hash = "sha256:b1e420ef35c503869c4064f4a2f2b08ad6431ab7b229a05cce39d74268bca6b8", size = 31799, upload-time = "2025-10-02T14:35:36.165Z" },
+    { url = "https://files.pythonhosted.org/packages/56/15/064b197e855bfb7b343210e82490ae672f8bc7cdf3ddb02e92f64304ee8a/xxhash-3.6.0-cp313-cp313t-win_arm64.whl", hash = "sha256:ec44b73a4220623235f67a996c862049f375df3b1052d9899f40a6382c32d746", size = 28044, upload-time = "2025-10-02T14:35:37.195Z" },
+    { url = "https://files.pythonhosted.org/packages/7e/5e/0138bc4484ea9b897864d59fce9be9086030825bc778b76cb5a33a906d37/xxhash-3.6.0-cp314-cp314-macosx_10_13_x86_64.whl", hash = "sha256:a40a3d35b204b7cc7643cbcf8c9976d818cb47befcfac8bbefec8038ac363f3e", size = 32754, upload-time = "2025-10-02T14:35:38.245Z" },
+    { url = "https://files.pythonhosted.org/packages/18/d7/5dac2eb2ec75fd771957a13e5dda560efb2176d5203f39502a5fc571f899/xxhash-3.6.0-cp314-cp314-macosx_11_0_arm64.whl", hash = "sha256:a54844be970d3fc22630b32d515e79a90d0a3ddb2644d8d7402e3c4c8da61405", size = 30846, upload-time = "2025-10-02T14:35:39.6Z" },
+    { url = "https://files.pythonhosted.org/packages/fe/71/8bc5be2bb00deb5682e92e8da955ebe5fa982da13a69da5a40a4c8db12fb/xxhash-3.6.0-cp314-cp314-manylinux1_i686.manylinux_2_28_i686.manylinux_2_5_i686.whl", hash = "sha256:016e9190af8f0a4e3741343777710e3d5717427f175adfdc3e72508f59e2a7f3", size = 194343, upload-time = "2025-10-02T14:35:40.69Z" },
+    { url = "https://files.pythonhosted.org/packages/e7/3b/52badfb2aecec2c377ddf1ae75f55db3ba2d321c5e164f14461c90837ef3/xxhash-3.6.0-cp314-cp314-manylinux2014_aarch64.manylinux_2_17_aarch64.manylinux_2_28_aarch64.whl", hash = "sha256:4f6f72232f849eb9d0141e2ebe2677ece15adfd0fa599bc058aad83c714bb2c6", size = 213074, upload-time = "2025-10-02T14:35:42.29Z" },
+    { url = "https://files.pythonhosted.org/packages/a2/2b/ae46b4e9b92e537fa30d03dbc19cdae57ed407e9c26d163895e968e3de85/xxhash-3.6.0-cp314-cp314-manylinux2014_ppc64le.manylinux_2_17_ppc64le.manylinux_2_28_ppc64le.whl", hash = "sha256:63275a8aba7865e44b1813d2177e0f5ea7eadad3dd063a21f7cf9afdc7054063", size = 212388, upload-time = "2025-10-02T14:35:43.929Z" },
+    { url = "https://files.pythonhosted.org/packages/f5/80/49f88d3afc724b4ac7fbd664c8452d6db51b49915be48c6982659e0e7942/xxhash-3.6.0-cp314-cp314-manylinux2014_s390x.manylinux_2_17_s390x.manylinux_2_28_s390x.whl", hash = "sha256:3cd01fa2aa00d8b017c97eb46b9a794fbdca53fc14f845f5a328c71254b0abb7", size = 445614, upload-time = "2025-10-02T14:35:45.216Z" },
+    { url = "https://files.pythonhosted.org/packages/ed/ba/603ce3961e339413543d8cd44f21f2c80e2a7c5cfe692a7b1f2cccf58f3c/xxhash-3.6.0-cp314-cp314-manylinux2014_x86_64.manylinux_2_17_x86_64.manylinux_2_28_x86_64.whl", hash = "sha256:0226aa89035b62b6a86d3c68df4d7c1f47a342b8683da2b60cedcddb46c4d95b", size = 194024, upload-time = "2025-10-02T14:35:46.959Z" },
+    { url = "https://files.pythonhosted.org/packages/78/d1/8e225ff7113bf81545cfdcd79eef124a7b7064a0bba53605ff39590b95c2/xxhash-3.6.0-cp314-cp314-musllinux_1_2_aarch64.whl", hash = "sha256:c6e193e9f56e4ca4923c61238cdaced324f0feac782544eb4c6d55ad5cc99ddd", size = 210541, upload-time = "2025-10-02T14:35:48.301Z" },
+    { url = "https://files.pythonhosted.org/packages/6f/58/0f89d149f0bad89def1a8dd38feb50ccdeb643d9797ec84707091d4cb494/xxhash-3.6.0-cp314-cp314-musllinux_1_2_i686.whl", hash = "sha256:9176dcaddf4ca963d4deb93866d739a343c01c969231dbe21680e13a5d1a5bf0", size = 198305, upload-time = "2025-10-02T14:35:49.584Z" },
+    { url = "https://files.pythonhosted.org/packages/11/38/5eab81580703c4df93feb5f32ff8fa7fe1e2c51c1f183ee4e48d4bb9d3d7/xxhash-3.6.0-cp314-cp314-musllinux_1_2_ppc64le.whl", hash = "sha256:c1ce4009c97a752e682b897aa99aef84191077a9433eb237774689f14f8ec152", size = 210848, upload-time = "2025-10-02T14:35:50.877Z" },
+    { url = "https://files.pythonhosted.org/packages/5e/6b/953dc4b05c3ce678abca756416e4c130d2382f877a9c30a20d08ee6a77c0/xxhash-3.6.0-cp314-cp314-musllinux_1_2_s390x.whl", hash = "sha256:8cb2f4f679b01513b7adbb9b1b2f0f9cdc31b70007eaf9d59d0878809f385b11", size = 414142, upload-time = "2025-10-02T14:35:52.15Z" },
+    { url = "https://files.pythonhosted.org/packages/08/a9/238ec0d4e81a10eb5026d4a6972677cbc898ba6c8b9dbaec12ae001b1b35/xxhash-3.6.0-cp314-cp314-musllinux_1_2_x86_64.whl", hash = "sha256:653a91d7c2ab54a92c19ccf43508b6a555440b9be1bc8be553376778be7f20b5", size = 191547, upload-time = "2025-10-02T14:35:53.547Z" },
+    { url = "https://files.pythonhosted.org/packages/f1/ee/3cf8589e06c2164ac77c3bf0aa127012801128f1feebf2a079272da5737c/xxhash-3.6.0-cp314-cp314-win32.whl", hash = "sha256:a756fe893389483ee8c394d06b5ab765d96e68fbbfe6fde7aa17e11f5720559f", size = 31214, upload-time = "2025-10-02T14:35:54.746Z" },
+    { url = "https://files.pythonhosted.org/packages/02/5d/a19552fbc6ad4cb54ff953c3908bbc095f4a921bc569433d791f755186f1/xxhash-3.6.0-cp314-cp314-win_amd64.whl", hash = "sha256:39be8e4e142550ef69629c9cd71b88c90e9a5db703fecbcf265546d9536ca4ad", size = 32290, upload-time = "2025-10-02T14:35:55.791Z" },
+    { url = "https://files.pythonhosted.org/packages/b1/11/dafa0643bc30442c887b55baf8e73353a344ee89c1901b5a5c54a6c17d39/xxhash-3.6.0-cp314-cp314-win_arm64.whl", hash = "sha256:25915e6000338999236f1eb68a02a32c3275ac338628a7eaa5a269c401995679", size = 28795, upload-time = "2025-10-02T14:35:57.162Z" },
+    { url = "https://files.pythonhosted.org/packages/2c/db/0e99732ed7f64182aef4a6fb145e1a295558deec2a746265dcdec12d191e/xxhash-3.6.0-cp314-cp314t-macosx_10_13_x86_64.whl", hash = "sha256:c5294f596a9017ca5a3e3f8884c00b91ab2ad2933cf288f4923c3fd4346cf3d4", size = 32955, upload-time = "2025-10-02T14:35:58.267Z" },
+    { url = "https://files.pythonhosted.org/packages/55/f4/2a7c3c68e564a099becfa44bb3d398810cc0ff6749b0d3cb8ccb93f23c14/xxhash-3.6.0-cp314-cp314t-macosx_11_0_arm64.whl", hash = "sha256:1cf9dcc4ab9cff01dfbba78544297a3a01dafd60f3bde4e2bfd016cf7e4ddc67", size = 31072, upload-time = "2025-10-02T14:35:59.382Z" },
+    { url = "https://files.pythonhosted.org/packages/c6/d9/72a29cddc7250e8a5819dad5d466facb5dc4c802ce120645630149127e73/xxhash-3.6.0-cp314-cp314t-manylinux1_i686.manylinux_2_28_i686.manylinux_2_5_i686.whl", hash = "sha256:01262da8798422d0685f7cef03b2bd3f4f46511b02830861df548d7def4402ad", size = 196579, upload-time = "2025-10-02T14:36:00.838Z" },
+    { url = "https://files.pythonhosted.org/packages/63/93/b21590e1e381040e2ca305a884d89e1c345b347404f7780f07f2cdd47ef4/xxhash-3.6.0-cp314-cp314t-manylinux2014_aarch64.manylinux_2_17_aarch64.manylinux_2_28_aarch64.whl", hash = "sha256:51a73fb7cb3a3ead9f7a8b583ffd9b8038e277cdb8cb87cf890e88b3456afa0b", size = 215854, upload-time = "2025-10-02T14:36:02.207Z" },
+    { url = "https://files.pythonhosted.org/packages/ce/b8/edab8a7d4fa14e924b29be877d54155dcbd8b80be85ea00d2be3413a9ed4/xxhash-3.6.0-cp314-cp314t-manylinux2014_ppc64le.manylinux_2_17_ppc64le.manylinux_2_28_ppc64le.whl", hash = "sha256:b9c6df83594f7df8f7f708ce5ebeacfc69f72c9fbaaababf6cf4758eaada0c9b", size = 214965, upload-time = "2025-10-02T14:36:03.507Z" },
+    { url = "https://files.pythonhosted.org/packages/27/67/dfa980ac7f0d509d54ea0d5a486d2bb4b80c3f1bb22b66e6a05d3efaf6c0/xxhash-3.6.0-cp314-cp314t-manylinux2014_s390x.manylinux_2_17_s390x.manylinux_2_28_s390x.whl", hash = "sha256:627f0af069b0ea56f312fd5189001c24578868643203bca1abbc2c52d3a6f3ca", size = 448484, upload-time = "2025-10-02T14:36:04.828Z" },
+    { url = "https://files.pythonhosted.org/packages/8c/63/8ffc2cc97e811c0ca5d00ab36604b3ea6f4254f20b7bc658ca825ce6c954/xxhash-3.6.0-cp314-cp314t-manylinux2014_x86_64.manylinux_2_17_x86_64.manylinux_2_28_x86_64.whl", hash = "sha256:aa912c62f842dfd013c5f21a642c9c10cd9f4c4e943e0af83618b4a404d9091a", size = 196162, upload-time = "2025-10-02T14:36:06.182Z" },
+    { url = "https://files.pythonhosted.org/packages/4b/77/07f0e7a3edd11a6097e990f6e5b815b6592459cb16dae990d967693e6ea9/xxhash-3.6.0-cp314-cp314t-musllinux_1_2_aarch64.whl", hash = "sha256:b465afd7909db30168ab62afe40b2fcf79eedc0b89a6c0ab3123515dc0df8b99", size = 213007, upload-time = "2025-10-02T14:36:07.733Z" },
+    { url = "https://files.pythonhosted.org/packages/ae/d8/bc5fa0d152837117eb0bef6f83f956c509332ce133c91c63ce07ee7c4873/xxhash-3.6.0-cp314-cp314t-musllinux_1_2_i686.whl", hash = "sha256:a881851cf38b0a70e7c4d3ce81fc7afd86fbc2a024f4cfb2a97cf49ce04b75d3", size = 200956, upload-time = "2025-10-02T14:36:09.106Z" },
+    { url = "https://files.pythonhosted.org/packages/26/a5/d749334130de9411783873e9b98ecc46688dad5db64ca6e04b02acc8b473/xxhash-3.6.0-cp314-cp314t-musllinux_1_2_ppc64le.whl", hash = "sha256:9b3222c686a919a0f3253cfc12bb118b8b103506612253b5baeaac10d8027cf6", size = 213401, upload-time = "2025-10-02T14:36:10.585Z" },
+    { url = "https://files.pythonhosted.org/packages/89/72/abed959c956a4bfc72b58c0384bb7940663c678127538634d896b1195c10/xxhash-3.6.0-cp314-cp314t-musllinux_1_2_s390x.whl", hash = "sha256:c5aa639bc113e9286137cec8fadc20e9cd732b2cc385c0b7fa673b84fc1f2a93", size = 417083, upload-time = "2025-10-02T14:36:12.276Z" },
+    { url = "https://files.pythonhosted.org/packages/0c/b3/62fd2b586283b7d7d665fb98e266decadf31f058f1cf6c478741f68af0cb/xxhash-3.6.0-cp314-cp314t-musllinux_1_2_x86_64.whl", hash = "sha256:5c1343d49ac102799905e115aee590183c3921d475356cb24b4de29a4bc56518", size = 193913, upload-time = "2025-10-02T14:36:14.025Z" },
+    { url = "https://files.pythonhosted.org/packages/9a/9a/c19c42c5b3f5a4aad748a6d5b4f23df3bed7ee5445accc65a0fb3ff03953/xxhash-3.6.0-cp314-cp314t-win32.whl", hash = "sha256:5851f033c3030dd95c086b4a36a2683c2ff4a799b23af60977188b057e467119", size = 31586, upload-time = "2025-10-02T14:36:15.603Z" },
+    { url = "https://files.pythonhosted.org/packages/03/d6/4cc450345be9924fd5dc8c590ceda1db5b43a0a889587b0ae81a95511360/xxhash-3.6.0-cp314-cp314t-win_amd64.whl", hash = "sha256:0444e7967dac37569052d2409b00a8860c2135cff05502df4da80267d384849f", size = 32526, upload-time = "2025-10-02T14:36:16.708Z" },
+    { url = "https://files.pythonhosted.org/packages/0f/c9/7243eb3f9eaabd1a88a5a5acadf06df2d83b100c62684b7425c6a11bcaa8/xxhash-3.6.0-cp314-cp314t-win_arm64.whl", hash = "sha256:bb79b1e63f6fd84ec778a4b1916dfe0a7c3fdb986c06addd5db3a0d413819d95", size = 28898, upload-time = "2025-10-02T14:36:17.843Z" },
+]
+
 [[package]]
 name = "yarl"
 version = "1.23.0"
@@ -2837,3 +3538,43 @@ sdist = { url = "https://files.pythonhosted.org/packages/e3/02/0f2892c661036d50e
 wheels = [
     { url = "https://files.pythonhosted.org/packages/2e/54/647ade08bf0db230bfea292f893923872fd20be6ac6f53b2b936ba839d75/zipp-3.23.0-py3-none-any.whl", hash = "sha256:071652d6115ed432f5ce1d34c336c0adfd6a884660d1e9712a256d3d3bd4b14e", size = 10276, upload-time = "2025-06-08T17:06:38.034Z" },
 ]
+
+[[package]]
+name = "zstandard"
+version = "0.25.0"
+source = { registry = "https://pypi.org/simple" }
+sdist = { url = "https://files.pythonhosted.org/packages/fd/aa/3e0508d5a5dd96529cdc5a97011299056e14c6505b678fd58938792794b1/zstandard-0.25.0.tar.gz", hash = "sha256:7713e1179d162cf5c7906da876ec2ccb9c3a9dcbdffef0cc7f70c3667a205f0b", size = 711513, upload-time = "2025-09-14T22:15:54.002Z" }
+wheels = [
+    { url = "https://files.pythonhosted.org/packages/35/0b/8df9c4ad06af91d39e94fa96cc010a24ac4ef1378d3efab9223cc8593d40/zstandard-0.25.0-cp313-cp313-macosx_10_13_x86_64.whl", hash = "sha256:ec996f12524f88e151c339688c3897194821d7f03081ab35d31d1e12ec975e94", size = 795735, upload-time = "2025-09-14T22:17:26.042Z" },
+    { url = "https://files.pythonhosted.org/packages/3f/06/9ae96a3e5dcfd119377ba33d4c42a7d89da1efabd5cb3e366b156c45ff4d/zstandard-0.25.0-cp313-cp313-macosx_11_0_arm64.whl", hash = "sha256:a1a4ae2dec3993a32247995bdfe367fc3266da832d82f8438c8570f989753de1", size = 640440, upload-time = "2025-09-14T22:17:27.366Z" },
+    { url = "https://files.pythonhosted.org/packages/d9/14/933d27204c2bd404229c69f445862454dcc101cd69ef8c6068f15aaec12c/zstandard-0.25.0-cp313-cp313-manylinux2010_i686.manylinux2014_i686.manylinux_2_12_i686.manylinux_2_17_i686.whl", hash = "sha256:e96594a5537722fdfb79951672a2a63aec5ebfb823e7560586f7484819f2a08f", size = 5343070, upload-time = "2025-09-14T22:17:28.896Z" },
+    { url = "https://files.pythonhosted.org/packages/6d/db/ddb11011826ed7db9d0e485d13df79b58586bfdec56e5c84a928a9a78c1c/zstandard-0.25.0-cp313-cp313-manylinux2014_aarch64.manylinux_2_17_aarch64.whl", hash = "sha256:bfc4e20784722098822e3eee42b8e576b379ed72cca4a7cb856ae733e62192ea", size = 5063001, upload-time = "2025-09-14T22:17:31.044Z" },
+    { url = "https://files.pythonhosted.org/packages/db/00/87466ea3f99599d02a5238498b87bf84a6348290c19571051839ca943777/zstandard-0.25.0-cp313-cp313-manylinux2014_ppc64le.manylinux_2_17_ppc64le.whl", hash = "sha256:457ed498fc58cdc12fc48f7950e02740d4f7ae9493dd4ab2168a47c93c31298e", size = 5394120, upload-time = "2025-09-14T22:17:32.711Z" },
+    { url = "https://files.pythonhosted.org/packages/2b/95/fc5531d9c618a679a20ff6c29e2b3ef1d1f4ad66c5e161ae6ff847d102a9/zstandard-0.25.0-cp313-cp313-manylinux2014_s390x.manylinux_2_17_s390x.whl", hash = "sha256:fd7a5004eb1980d3cefe26b2685bcb0b17989901a70a1040d1ac86f1d898c551", size = 5451230, upload-time = "2025-09-14T22:17:34.41Z" },
+    { url = "https://files.pythonhosted.org/packages/63/4b/e3678b4e776db00f9f7b2fe58e547e8928ef32727d7a1ff01dea010f3f13/zstandard-0.25.0-cp313-cp313-manylinux2014_x86_64.manylinux_2_17_x86_64.whl", hash = "sha256:8e735494da3db08694d26480f1493ad2cf86e99bdd53e8e9771b2752a5c0246a", size = 5547173, upload-time = "2025-09-14T22:17:36.084Z" },
+    { url = "https://files.pythonhosted.org/packages/4e/d5/ba05ed95c6b8ec30bd468dfeab20589f2cf709b5c940483e31d991f2ca58/zstandard-0.25.0-cp313-cp313-musllinux_1_1_aarch64.whl", hash = "sha256:3a39c94ad7866160a4a46d772e43311a743c316942037671beb264e395bdd611", size = 5046736, upload-time = "2025-09-14T22:17:37.891Z" },
+    { url = "https://files.pythonhosted.org/packages/50/d5/870aa06b3a76c73eced65c044b92286a3c4e00554005ff51962deef28e28/zstandard-0.25.0-cp313-cp313-musllinux_1_1_x86_64.whl", hash = "sha256:172de1f06947577d3a3005416977cce6168f2261284c02080e7ad0185faeced3", size = 5576368, upload-time = "2025-09-14T22:17:40.206Z" },
+    { url = "https://files.pythonhosted.org/packages/5d/35/398dc2ffc89d304d59bc12f0fdd931b4ce455bddf7038a0a67733a25f550/zstandard-0.25.0-cp313-cp313-musllinux_1_2_aarch64.whl", hash = "sha256:3c83b0188c852a47cd13ef3bf9209fb0a77fa5374958b8c53aaa699398c6bd7b", size = 4954022, upload-time = "2025-09-14T22:17:41.879Z" },
+    { url = "https://files.pythonhosted.org/packages/9a/5c/36ba1e5507d56d2213202ec2b05e8541734af5f2ce378c5d1ceaf4d88dc4/zstandard-0.25.0-cp313-cp313-musllinux_1_2_i686.whl", hash = "sha256:1673b7199bbe763365b81a4f3252b8e80f44c9e323fc42940dc8843bfeaf9851", size = 5267889, upload-time = "2025-09-14T22:17:43.577Z" },
+    { url = "https://files.pythonhosted.org/packages/70/e8/2ec6b6fb7358b2ec0113ae202647ca7c0e9d15b61c005ae5225ad0995df5/zstandard-0.25.0-cp313-cp313-musllinux_1_2_ppc64le.whl", hash = "sha256:0be7622c37c183406f3dbf0cba104118eb16a4ea7359eeb5752f0794882fc250", size = 5433952, upload-time = "2025-09-14T22:17:45.271Z" },
+    { url = "https://files.pythonhosted.org/packages/7b/01/b5f4d4dbc59ef193e870495c6f1275f5b2928e01ff5a81fecb22a06e22fb/zstandard-0.25.0-cp313-cp313-musllinux_1_2_s390x.whl", hash = "sha256:5f5e4c2a23ca271c218ac025bd7d635597048b366d6f31f420aaeb715239fc98", size = 5814054, upload-time = "2025-09-14T22:17:47.08Z" },
+    { url = "https://files.pythonhosted.org/packages/b2/e5/fbd822d5c6f427cf158316d012c5a12f233473c2f9c5fe5ab1ae5d21f3d8/zstandard-0.25.0-cp313-cp313-musllinux_1_2_x86_64.whl", hash = "sha256:4f187a0bb61b35119d1926aee039524d1f93aaf38a9916b8c4b78ac8514a0aaf", size = 5360113, upload-time = "2025-09-14T22:17:48.893Z" },
+    { url = "https://files.pythonhosted.org/packages/8e/e0/69a553d2047f9a2c7347caa225bb3a63b6d7704ad74610cb7823baa08ed7/zstandard-0.25.0-cp313-cp313-win32.whl", hash = "sha256:7030defa83eef3e51ff26f0b7bfb229f0204b66fe18e04359ce3474ac33cbc09", size = 436936, upload-time = "2025-09-14T22:17:52.658Z" },
+    { url = "https://files.pythonhosted.org/packages/d9/82/b9c06c870f3bd8767c201f1edbdf9e8dc34be5b0fbc5682c4f80fe948475/zstandard-0.25.0-cp313-cp313-win_amd64.whl", hash = "sha256:1f830a0dac88719af0ae43b8b2d6aef487d437036468ef3c2ea59c51f9d55fd5", size = 506232, upload-time = "2025-09-14T22:17:50.402Z" },
+    { url = "https://files.pythonhosted.org/packages/d4/57/60c3c01243bb81d381c9916e2a6d9e149ab8627c0c7d7abb2d73384b3c0c/zstandard-0.25.0-cp313-cp313-win_arm64.whl", hash = "sha256:85304a43f4d513f5464ceb938aa02c1e78c2943b29f44a750b48b25ac999a049", size = 462671, upload-time = "2025-09-14T22:17:51.533Z" },
+    { url = "https://files.pythonhosted.org/packages/3d/5c/f8923b595b55fe49e30612987ad8bf053aef555c14f05bb659dd5dbe3e8a/zstandard-0.25.0-cp314-cp314-macosx_10_13_x86_64.whl", hash = "sha256:e29f0cf06974c899b2c188ef7f783607dbef36da4c242eb6c82dcd8b512855e3", size = 795887, upload-time = "2025-09-14T22:17:54.198Z" },
+    { url = "https://files.pythonhosted.org/packages/8d/09/d0a2a14fc3439c5f874042dca72a79c70a532090b7ba0003be73fee37ae2/zstandard-0.25.0-cp314-cp314-macosx_11_0_arm64.whl", hash = "sha256:05df5136bc5a011f33cd25bc9f506e7426c0c9b3f9954f056831ce68f3b6689f", size = 640658, upload-time = "2025-09-14T22:17:55.423Z" },
+    { url = "https://files.pythonhosted.org/packages/5d/7c/8b6b71b1ddd517f68ffb55e10834388d4f793c49c6b83effaaa05785b0b4/zstandard-0.25.0-cp314-cp314-manylinux2010_i686.manylinux_2_12_i686.manylinux_2_28_i686.whl", hash = "sha256:f604efd28f239cc21b3adb53eb061e2a205dc164be408e553b41ba2ffe0ca15c", size = 5379849, upload-time = "2025-09-14T22:17:57.372Z" },
+    { url = "https://files.pythonhosted.org/packages/a4/86/a48e56320d0a17189ab7a42645387334fba2200e904ee47fc5a26c1fd8ca/zstandard-0.25.0-cp314-cp314-manylinux2014_aarch64.manylinux_2_17_aarch64.manylinux_2_28_aarch64.whl", hash = "sha256:223415140608d0f0da010499eaa8ccdb9af210a543fac54bce15babbcfc78439", size = 5058095, upload-time = "2025-09-14T22:17:59.498Z" },
+    { url = "https://files.pythonhosted.org/packages/f8/ad/eb659984ee2c0a779f9d06dbfe45e2dc39d99ff40a319895df2d3d9a48e5/zstandard-0.25.0-cp314-cp314-manylinux2014_ppc64le.manylinux_2_17_ppc64le.manylinux_2_28_ppc64le.whl", hash = "sha256:2e54296a283f3ab5a26fc9b8b5d4978ea0532f37b231644f367aa588930aa043", size = 5551751, upload-time = "2025-09-14T22:18:01.618Z" },
+    { url = "https://files.pythonhosted.org/packages/61/b3/b637faea43677eb7bd42ab204dfb7053bd5c4582bfe6b1baefa80ac0c47b/zstandard-0.25.0-cp314-cp314-manylinux2014_s390x.manylinux_2_17_s390x.manylinux_2_28_s390x.whl", hash = "sha256:ca54090275939dc8ec5dea2d2afb400e0f83444b2fc24e07df7fdef677110859", size = 6364818, upload-time = "2025-09-14T22:18:03.769Z" },
+    { url = "https://files.pythonhosted.org/packages/31/dc/cc50210e11e465c975462439a492516a73300ab8caa8f5e0902544fd748b/zstandard-0.25.0-cp314-cp314-manylinux2014_x86_64.manylinux_2_17_x86_64.manylinux_2_28_x86_64.whl", hash = "sha256:e09bb6252b6476d8d56100e8147b803befa9a12cea144bbe629dd508800d1ad0", size = 5560402, upload-time = "2025-09-14T22:18:05.954Z" },
+    { url = "https://files.pythonhosted.org/packages/c9/ae/56523ae9c142f0c08efd5e868a6da613ae76614eca1305259c3bf6a0ed43/zstandard-0.25.0-cp314-cp314-musllinux_1_2_aarch64.whl", hash = "sha256:a9ec8c642d1ec73287ae3e726792dd86c96f5681eb8df274a757bf62b750eae7", size = 4955108, upload-time = "2025-09-14T22:18:07.68Z" },
+    { url = "https://files.pythonhosted.org/packages/98/cf/c899f2d6df0840d5e384cf4c4121458c72802e8bda19691f3b16619f51e9/zstandard-0.25.0-cp314-cp314-musllinux_1_2_i686.whl", hash = "sha256:a4089a10e598eae6393756b036e0f419e8c1d60f44a831520f9af41c14216cf2", size = 5269248, upload-time = "2025-09-14T22:18:09.753Z" },
+    { url = "https://files.pythonhosted.org/packages/1b/c0/59e912a531d91e1c192d3085fc0f6fb2852753c301a812d856d857ea03c6/zstandard-0.25.0-cp314-cp314-musllinux_1_2_ppc64le.whl", hash = "sha256:f67e8f1a324a900e75b5e28ffb152bcac9fbed1cc7b43f99cd90f395c4375344", size = 5430330, upload-time = "2025-09-14T22:18:11.966Z" },
+    { url = "https://files.pythonhosted.org/packages/a0/1d/7e31db1240de2df22a58e2ea9a93fc6e38cc29353e660c0272b6735d6669/zstandard-0.25.0-cp314-cp314-musllinux_1_2_s390x.whl", hash = "sha256:9654dbc012d8b06fc3d19cc825af3f7bf8ae242226df5f83936cb39f5fdc846c", size = 5811123, upload-time = "2025-09-14T22:18:13.907Z" },
+    { url = "https://files.pythonhosted.org/packages/f6/49/fac46df5ad353d50535e118d6983069df68ca5908d4d65b8c466150a4ff1/zstandard-0.25.0-cp314-cp314-musllinux_1_2_x86_64.whl", hash = "sha256:4203ce3b31aec23012d3a4cf4a2ed64d12fea5269c49aed5e4c3611b938e4088", size = 5359591, upload-time = "2025-09-14T22:18:16.465Z" },
+    { url = "https://files.pythonhosted.org/packages/c2/38/f249a2050ad1eea0bb364046153942e34abba95dd5520af199aed86fbb49/zstandard-0.25.0-cp314-cp314-win32.whl", hash = "sha256:da469dc041701583e34de852d8634703550348d5822e66a0c827d39b05365b12", size = 444513, upload-time = "2025-09-14T22:18:20.61Z" },
+    { url = "https://files.pythonhosted.org/packages/3a/43/241f9615bcf8ba8903b3f0432da069e857fc4fd1783bd26183db53c4804b/zstandard-0.25.0-cp314-cp314-win_amd64.whl", hash = "sha256:c19bcdd826e95671065f8692b5a4aa95c52dc7a02a4c5a0cac46deb879a017a2", size = 516118, upload-time = "2025-09-14T22:18:17.849Z" },
+    { url = "https://files.pythonhosted.org/packages/f0/ef/da163ce2450ed4febf6467d77ccb4cd52c4c30ab45624bad26ca0a27260c/zstandard-0.25.0-cp314-cp314-win_arm64.whl", hash = "sha256:d7541afd73985c630bafcd6338d2518ae96060075f9463d7dc14cfb33514383d", size = 476940, upload-time = "2025-09-14T22:18:19.088Z" },
+]
diff --git a/frontend/.prettierignore b/frontend/.prettierignore
new file mode 100644
index 0000000000..3ad5fb2f0b
--- /dev/null
+++ b/frontend/.prettierignore
@@ -0,0 +1,13 @@
+dist/
+# Tauri/Cargo build output (binary assets named *.js etc. confuse Prettier)
+src-tauri/target/
+node_modules/
+public/vendor/
+public/pdfjs*/
+public/js/thirdParty/
+public/css/cookieconsent.css
+src-tauri/target/
+*.min.*
+*.md
+*.wxs
+src/output.css
diff --git a/frontend/.prettierrc b/frontend/.prettierrc
new file mode 100644
index 0000000000..58bc875631
--- /dev/null
+++ b/frontend/.prettierrc
@@ -0,0 +1,6 @@
+{
+  "printWidth": 80,
+  "tabWidth": 2,
+  "useTabs": false,
+  "endOfLine": "lf"
+}
diff --git a/frontend/README.md b/frontend/README.md
index e3bd1887b0..a8802b24ef 100644
--- a/frontend/README.md
+++ b/frontend/README.md
@@ -1,145 +1,79 @@
 # Frontend
+
+All frontend commands are run from the repository root using [Task](https://taskfile.dev/):
+
+- `task frontend:dev` — start Vite dev server (localhost:5173)
+- `task frontend:build` — production build
+- `task frontend:test` — run tests
+- `task frontend:test:watch` — run tests in watch mode
+- `task frontend:lint` — run ESLint + cycle detection
+- `task frontend:typecheck` — run TypeScript type checking
+- `task frontend:check` — run typecheck + lint + test
+- `task frontend:install` — install npm dependencies
+
+For desktop app development, see the [Tauri](#tauri) section below.
+
 ## Environment Variables
 
-The frontend requires environment variables to be set before running. `npm run dev` will create a `.env` file for you automatically on first run using the defaults from `config/.env.example` - for most development work this is all you need.
+The frontend requires environment variables to be set before running. `task frontend:dev` will create a `.env` file for you automatically on first run using the defaults from `config/.env.example` - for most development work this is all you need.
 
 If you need to configure specific services (Google Drive, Supabase, Stripe, PostHog), edit your local `.env` file. The values in `config/.env.example` show what each variable does and provides sensible defaults where applicable.
 
-For desktop (Tauri) development, `npm run tauri-dev` will additionally create a `.env.desktop` file from `config/.env.desktop.example`.
+For desktop (Tauri) development, `task desktop:dev` will additionally create a `.env.desktop` file from `config/.env.desktop.example`.
 
 ## Docker Setup
 
 For Docker deployments and configuration, see the [Docker README](../docker/README.md).
 
-## Available Scripts
-
-In the project directory, you can run:
-
-### `npm start`
-
-Runs the app in the development mode.\
-Open [http://localhost:3000](http://localhost:3000) to view it in your browser.
-
-The page will reload when you make changes.\
-You may also see any lint errors in the console.
-
-### `npm test`
-
-Launches the test runner in the interactive watch mode.\
-See the section about [running tests](https://facebook.github.io/create-react-app/docs/running-tests) for more information.
-
-### `npm run build`
-
-Builds the app for production to the `build` folder.\
-It correctly bundles React in production mode and optimizes the build for the best performance.
-
-The build is minified and the filenames include the hashes.\
-Your app is ready to be deployed!
-
-See the section about [deployment](https://facebook.github.io/create-react-app/docs/deployment) for more information.
-
-### `npm run eject`
-
-**Note: this is a one-way operation. Once you `eject`, you can't go back!**
-
-If you aren't satisfied with the build tool and configuration choices, you can `eject` at any time. This command will remove the single build dependency from your project.
-
-Instead, it will copy all the configuration files and the transitive dependencies (webpack, Babel, ESLint, etc) right into your project so you have full control over them. All of the commands except `eject` will still work, but they will point to the copied scripts so you can tweak them. At this point you're on your own.
-
-You don't have to ever use `eject`. The curated feature set is suitable for small and middle deployments, and you shouldn't feel obligated to use this feature. However we understand that this tool wouldn't be useful if you couldn't customize it when you are ready for it.
-
-## Learn More
-
-You can learn more in the [Create React App documentation](https://facebook.github.io/create-react-app/docs/getting-started).
-
-To learn React, check out the [React documentation](https://reactjs.org/).
-
-### Code Splitting
-
-This section has moved here: [https://facebook.github.io/create-react-app/docs/code-splitting](https://facebook.github.io/create-react-app/docs/code-splitting)
-
-### Analyzing the Bundle Size
-
-This section has moved here: [https://facebook.github.io/create-react-app/docs/analyzing-the-bundle-size](https://facebook.github.io/create-react-app/docs/analyzing-the-bundle-size)
-
-### Making a Progressive Web App
-
-This section has moved here: [https://facebook.github.io/create-react-app/docs/making-a-progressive-web-app](https://facebook.github.io/create-react-app/docs/making-a-progressive-web-app)
-
-### Advanced Configuration
-
-This section has moved here: [https://facebook.github.io/create-react-app/docs/advanced-configuration](https://facebook.github.io/create-react-app/docs/advanced-configuration)
-
-### Deployment
-
-This section has moved here: [https://facebook.github.io/create-react-app/docs/deployment](https://facebook.github.io/create-react-app/docs/deployment)
-
-### `npm run build` fails to minify
-
-This section has moved here: [https://facebook.github.io/create-react-app/docs/troubleshooting#npm-run-build-fails-to-minify](https://facebook.github.io/create-react-app/docs/troubleshooting#npm-run-build-fails-to-minify)
-
-
 ## Tauri
-In order to run Tauri, you first have to build the Java backend for Tauri to use.
 
-**macOS/Linux:**
-
-From the root of the repo, run:
-
-```bash
-./gradlew clean build
-./scripts/build-tauri-jlink.sh
-```
-
-**Windows**
-
-From the root of the repo, run:
-
-```batch
-gradlew clean build
-scripts\build-tauri-jlink.bat
-```
-
-### Testing the Bundled Runtime
-
-Before building the full Tauri app, you can test the bundled runtime:
-
-**macOS/Linux:**
-```bash
-./frontend/src-tauri/runtime/launch-stirling.sh
-```
-
-**Windows:**
-```cmd
-frontend\src-tauri\runtime\launch-stirling.bat
-```
-
-This will start Stirling-PDF using the bundled JRE, accessible at http://localhost:8080
+All desktop tasks are available via [Task](https://taskfile.dev). From the root of the repo:
 
 ### Dev
-To run Tauri in development. Use the command in the `frontend` folder:
 
 ```bash
-npm run tauri-dev
+task desktop:dev
 ```
 
-This will run the gradle runboot command and the tauri dev command concurrently, starting the app once both are stable.
-
-> [!NOTE]
->
-> Desktop builds require additional environment variables. See [Environment Variables](#environment-variables)
-> above - `npm run tauri-dev` will set these up automatically from `config/.env.desktop.example` on first run.
+This ensures the JLink runtime and backend JAR exist (skipping if already built), then starts Tauri in dev mode.
 
 ### Build
-To build a deployment of the Tauri app. Use this command in the `frontend` folder:
 
 ```bash
-npm run tauri-build
+task desktop:build
 ```
 
-This will bundle the backend and frontend into one executable for each target. Targets can be set within the `tauri.conf.json` file.
+This does a full clean rebuild of the backend JAR and JLink runtime, then builds the Tauri app for production.
+
+Platform-specific dev builds are also available:
+
+```bash
+task desktop:build:dev           # No bundling
+task desktop:build:dev:mac       # macOS .app bundle
+task desktop:build:dev:windows   # Windows NSIS installer
+task desktop:build:dev:linux     # Linux AppImage
+```
+
+### JLink Tasks
+
+You can also run JLink steps individually:
+
+```bash
+task desktop:jlink          # Build JAR + create JLink runtime
+task desktop:jlink:jar      # Build backend JAR only
+task desktop:jlink:runtime  # Create JLink custom JRE only
+task desktop:jlink:clean    # Remove JLink artifacts
+```
+
+### Clean
+
+```bash
+task desktop:clean
+```
+
+Removes all desktop build artifacts including JLink runtime, bundled JARs, Cargo build, and dist/build directories.
 
 > [!NOTE]
 >
 > Desktop builds require additional environment variables. See [Environment Variables](#environment-variables)
-> above - `npm run tauri-build` will set these up automatically from `config/.env.desktop.example` on first run.
+> above - `task desktop:dev` will set these up automatically from `config/.env.desktop.example` on first run.
diff --git a/frontend/config/.env.desktop.example b/frontend/config/.env.desktop.example
index 2e58bebec8..a83666a4e1 100644
--- a/frontend/config/.env.desktop.example
+++ b/frontend/config/.env.desktop.example
@@ -10,4 +10,4 @@ VITE_SAAS_BACKEND_API_URL=https://api2.stirling.com
 
 # Dev only: set to true to mimic an expired access token (no valid JWT for API/auth checks).
 # Production builds ignore this. Restart tauri-dev after changing.
-VITE_DEV_SIMULATE_EXPIRED_JWT=false
+VITE_DEV_SIMULATE_EXPIRED_JWT=
diff --git a/frontend/eslint.config.mjs b/frontend/eslint.config.mjs
index 6f0ed90cbb..a963558ec1 100644
--- a/frontend/eslint.config.mjs
+++ b/frontend/eslint.config.mjs
@@ -1,62 +1,55 @@
 // @ts-check
 
-import eslint from '@eslint/js';
-import globals from 'globals';
-import { defineConfig } from 'eslint/config';
-import tseslint from 'typescript-eslint';
+import eslint from "@eslint/js";
+import globals from "globals";
+import { defineConfig } from "eslint/config";
+import tseslint from "typescript-eslint";
 
-const srcGlobs = [
-  'src/**/*.{js,mjs,jsx,ts,tsx}',
-];
-const nodeGlobs = [
-  'scripts/**/*.{js,ts,mjs}',
-  '*.config.{js,ts,mjs}',
-];
+const srcGlobs = ["src/**/*.{js,mjs,jsx,ts,tsx}"];
+const nodeGlobs = ["scripts/**/*.{js,ts,mjs}", "*.config.{js,ts,mjs}"];
 
 const baseRestrictedImportPatterns = [
-  { regex: '^\\.', message: "Use @app/* imports instead of relative imports." },
-  { regex: '^src/', message: "Use @app/* imports instead of absolute src/ imports." },
+  { regex: "^\\.", message: "Use @app/* imports instead of relative imports." },
+  {
+    regex: "^src/",
+    message: "Use @app/* imports instead of absolute src/ imports.",
+  },
 ];
 
 export default defineConfig(
   {
     // Everything that contains 3rd party code that we don't want to lint
-    ignores: [
-      'dist',
-      'node_modules',
-      'public',
-      'src-tauri',
-    ],
+    ignores: ["dist", "node_modules", "public", "src-tauri"],
   },
   eslint.configs.recommended,
   tseslint.configs.recommended,
   {
     rules: {
-      'no-restricted-imports': [
-        'error',
+      "no-restricted-imports": [
+        "error",
         {
           patterns: baseRestrictedImportPatterns,
         },
       ],
-      '@typescript-eslint/no-empty-object-type': [
-        'error',
+      "@typescript-eslint/no-empty-object-type": [
+        "error",
         {
           // Allow empty extending interfaces because there's no real reason not to, and it makes it obvious where to put extra attributes in the future
-          allowInterfaces: 'with-single-extends',
+          allowInterfaces: "with-single-extends",
         },
       ],
-      '@typescript-eslint/no-explicit-any': 'off', // Temporarily disabled until codebase conformant
-      '@typescript-eslint/no-require-imports': 'off', // Temporarily disabled until codebase conformant
-      '@typescript-eslint/no-unused-vars': [
-        'error',
+      "@typescript-eslint/no-explicit-any": "off", // Temporarily disabled until codebase conformant
+      "@typescript-eslint/no-require-imports": "off", // Temporarily disabled until codebase conformant
+      "@typescript-eslint/no-unused-vars": [
+        "error",
         {
-          'args': 'all', // All function args must be used (or explicitly ignored)
-          'argsIgnorePattern': '^_', // Allow unused variables beginning with an underscore
-          'caughtErrors': 'all', // Caught errors must be used (or explicitly ignored)
-          'caughtErrorsIgnorePattern': '^_', // Allow unused variables beginning with an underscore
-          'destructuredArrayIgnorePattern': '^_', // Allow unused variables beginning with an underscore
-          'varsIgnorePattern': '^_', // Allow unused variables beginning with an underscore
-          'ignoreRestSiblings': true, // Allow unused variables when removing attributes from objects (otherwise this requires explicit renaming like `({ x: _x, ...y }) => y`, which is clunky)
+          args: "all", // All function args must be used (or explicitly ignored)
+          argsIgnorePattern: "^_", // Allow unused variables beginning with an underscore
+          caughtErrors: "all", // Caught errors must be used (or explicitly ignored)
+          caughtErrorsIgnorePattern: "^_", // Allow unused variables beginning with an underscore
+          destructuredArrayIgnorePattern: "^_", // Allow unused variables beginning with an underscore
+          varsIgnorePattern: "^_", // Allow unused variables beginning with an underscore
+          ignoreRestSiblings: true, // Allow unused variables when removing attributes from objects (otherwise this requires explicit renaming like `({ x: _x, ...y }) => y`, which is clunky)
         },
       ],
     },
@@ -65,16 +58,17 @@ export default defineConfig(
   // Use the stub/shadow pattern instead: define a stub in src/core/ and override in src/desktop/.
   {
     files: srcGlobs,
-    ignores: ['src/desktop/**'],
+    ignores: ["src/desktop/**"],
     rules: {
-      'no-restricted-imports': [
-        'error',
+      "no-restricted-imports": [
+        "error",
         {
           patterns: [
             ...baseRestrictedImportPatterns,
             {
-              regex: '^@tauri-apps/',
-              message: "Tauri APIs are desktop-only. Review frontend/DeveloperGuide.md for structure advice.",
+              regex: "^@tauri-apps/",
+              message:
+                "Tauri APIs are desktop-only. Review frontend/DeveloperGuide.md for structure advice.",
             },
           ],
         },
@@ -83,7 +77,12 @@ export default defineConfig(
   },
   // Folders that have been cleaned up and are now conformant - stricter rules enforced here
   {
-    files: ['src/saas/**/*.{js,mjs,jsx,ts,tsx}'],
+    files: [
+      "src/desktop/**/*.{js,mjs,jsx,ts,tsx}",
+      "src/proprietary/**/*.{js,mjs,jsx,ts,tsx}",
+      "src/saas/**/*.{js,mjs,jsx,ts,tsx}",
+      "src/prototypes/**/*.{js,mjs,jsx,ts,tsx}",
+    ],
     languageOptions: {
       parserOptions: {
         project: true,
@@ -91,8 +90,8 @@ export default defineConfig(
       },
     },
     rules: {
-      '@typescript-eslint/no-explicit-any': 'error',
-      '@typescript-eslint/no-unnecessary-type-assertion': 'error',
+      "@typescript-eslint/no-explicit-any": "error",
+      "@typescript-eslint/no-unnecessary-type-assertion": "error",
     },
   },
   // Config for browser scripts
@@ -101,8 +100,8 @@ export default defineConfig(
     languageOptions: {
       globals: {
         ...globals.browser,
-      }
-    }
+      },
+    },
   },
   // Config for node scripts
   {
@@ -110,7 +109,7 @@ export default defineConfig(
     languageOptions: {
       globals: {
         ...globals.node,
-      }
-    }
+      },
+    },
   },
 );
diff --git a/frontend/index.html b/frontend/index.html
index c790b8d1ed..98b620b407 100644
--- a/frontend/index.html
+++ b/frontend/index.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html>
+<!doctype html>
 <html lang="en-GB">
   <head>
     <meta charset="UTF-8" />
diff --git a/frontend/package-lock.json b/frontend/package-lock.json
index f1ce75050c..0bb7efc56f 100644
--- a/frontend/package-lock.json
+++ b/frontend/package-lock.json
@@ -59,7 +59,7 @@
         "@tauri-apps/plugin-shell": "^2.3.5",
         "@userback/widget": "^0.3.12",
         "autoprefixer": "^10.4.21",
-        "axios": "^1.13.2",
+        "axios": "^1.15.0",
         "d3": "^7.9.0",
         "globals": "^17.1.0",
         "i18next": "^25.5.2",
@@ -68,6 +68,7 @@
         "license-report": "^6.8.0",
         "pdfjs-dist": "^5.4.149",
         "peerjs": "^1.5.5",
+        "pixelmatch": "^7.1.0",
         "posthog-js": "^1.268.0",
         "qrcode.react": "^4.2.0",
         "react": "^19.1.1",
@@ -114,6 +115,7 @@
         "postcss-cli": "^11.0.1",
         "postcss-preset-mantine": "^1.18.0",
         "postcss-simple-vars": "^7.0.1",
+        "prettier": "^3.8.1",
         "puppeteer": "^24.25.0",
         "tsx": "^4.21.0",
         "typescript": "^5.9.2",
@@ -214,9 +216,9 @@
       "license": "MIT"
     },
     "node_modules/@atlaskit/pragmatic-drag-and-drop": {
-      "version": "1.7.7",
-      "resolved": "https://registry.npmjs.org/@atlaskit/pragmatic-drag-and-drop/-/pragmatic-drag-and-drop-1.7.7.tgz",
-      "integrity": "sha512-jX+68AoSTqO/fhCyJDTZ38Ey6/wyL2Iq+J/moanma0YyktpnoHxevjY1UNJHYp0NCburdQDZSL1ZFac1mO1osQ==",
+      "version": "1.7.9",
+      "resolved": "https://registry.npmjs.org/@atlaskit/pragmatic-drag-and-drop/-/pragmatic-drag-and-drop-1.7.9.tgz",
+      "integrity": "sha512-m/bcw5flyjfcF/rdX4JeomtIBrWuDNOwcQieiywHv7zkfIRmUC34Q9ZLeNGVoz73UiGsRqxysMuw4tC7lSJ89g==",
       "license": "Apache-2.0",
       "dependencies": {
         "@babel/runtime": "^7.0.0",
@@ -295,9 +297,9 @@
       }
     },
     "node_modules/@babel/parser": {
-      "version": "7.29.0",
-      "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.29.0.tgz",
-      "integrity": "sha512-IyDgFV5GeDUVX4YdF/3CPULtVGSXXMLh1xVIgdCgxApktqnQV0r7/8Nqthg+8YLGaAtdyIlo2qIdZrbCv4+7ww==",
+      "version": "7.29.2",
+      "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.29.2.tgz",
+      "integrity": "sha512-4GgRzy/+fsBa72/RZVJmGKPmZu9Byn8o4MoLpmNe1m8ZfYnz5emHLQz3U4gLud6Zwl0RZIcgiLD7Uq7ySFuDLA==",
       "license": "MIT",
       "dependencies": {
         "@babel/types": "^7.29.0"
@@ -310,9 +312,9 @@
       }
     },
     "node_modules/@babel/runtime": {
-      "version": "7.28.6",
-      "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.28.6.tgz",
-      "integrity": "sha512-05WQkdpL9COIMz4LjTxGpPNCdlpyimKppYNoJ5Di5EUObifl8t4tuLuUBBZEpoLYOmfvIWrsp9fCl0HoPRVTdA==",
+      "version": "7.29.2",
+      "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.29.2.tgz",
+      "integrity": "sha512-JiDShH45zKHWyGe4ZNVRrCjBz8Nh9TMmZG1kh4QTK8hCBTWBi8Da+i7s1fJw7/lYpM4ccepSNfqzZ/QvABBi5g==",
       "license": "MIT",
       "engines": {
         "node": ">=6.9.0"
@@ -374,9 +376,9 @@
       }
     },
     "node_modules/@cantoo/pdf-lib": {
-      "version": "2.6.1",
-      "resolved": "https://registry.npmjs.org/@cantoo/pdf-lib/-/pdf-lib-2.6.1.tgz",
-      "integrity": "sha512-Nr/N5kR0xEzibtXei25E8LX9ThYsAN+Wob9jGZ1MSkMzWfxSo1fQwHc/BumE11bMMKEzn7jG5nT+kGlzAaAb2Q==",
+      "version": "2.6.5",
+      "resolved": "https://registry.npmjs.org/@cantoo/pdf-lib/-/pdf-lib-2.6.5.tgz",
+      "integrity": "sha512-3eMHEaqKHt/G/q+6QjT06A3lz0S/a8x3+myiSN7FNeL3uWcedO0lpfs6TWofa4C03Z1wz3tWeHoa4CsI7DrTSA==",
       "license": "MIT",
       "dependencies": {
         "@pdf-lib/standard-fonts": "^1.0.0",
@@ -484,9 +486,9 @@
       }
     },
     "node_modules/@csstools/css-syntax-patches-for-csstree": {
-      "version": "1.0.28",
-      "resolved": "https://registry.npmjs.org/@csstools/css-syntax-patches-for-csstree/-/css-syntax-patches-for-csstree-1.0.28.tgz",
-      "integrity": "sha512-1NRf1CUBjnr3K7hu8BLxjQrKCxEe8FP/xmPTenAxCRZWVLbmGotkFvG9mfNpjA6k7Bw1bw4BilZq9cu19RA5pg==",
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/@csstools/css-syntax-patches-for-csstree/-/css-syntax-patches-for-csstree-1.1.1.tgz",
+      "integrity": "sha512-BvqN0AMWNAnLk9G8jnUT77D+mUbY/H2b3uDTvg2isJkHaOufUE2R3AOwxWo7VBQKT1lOdwdvorddo2B/lk64+w==",
       "dev": true,
       "funding": [
         {
@@ -498,7 +500,15 @@
           "url": "https://opencollective.com/csstools"
         }
       ],
-      "license": "MIT-0"
+      "license": "MIT-0",
+      "peerDependencies": {
+        "css-tree": "^3.2.1"
+      },
+      "peerDependenciesMeta": {
+        "css-tree": {
+          "optional": true
+        }
+      }
     },
     "node_modules/@csstools/css-tokenizer": {
       "version": "4.0.0",
@@ -574,13 +584,13 @@
       }
     },
     "node_modules/@embedpdf/core": {
-      "version": "2.8.0",
-      "resolved": "https://registry.npmjs.org/@embedpdf/core/-/core-2.8.0.tgz",
-      "integrity": "sha512-ui0HR4fl7ndiGPw40kMBxXCO9gZHctV1u3Q+/XTd34ONYJ+Pa2LoWNVW2IuPDK7PgKzABPT2axntowlVLPP10g==",
+      "version": "2.9.1",
+      "resolved": "https://registry.npmjs.org/@embedpdf/core/-/core-2.9.1.tgz",
+      "integrity": "sha512-DlFV2o+tv9S+j4TeBVkRaIjjE9o3Tq3+hvJNoIOFtl87cR77UVQqEIRqOf61yk85Y+T2LfmnVPWjNcMuiKUh8w==",
       "license": "MIT",
       "dependencies": {
-        "@embedpdf/engines": "2.8.0",
-        "@embedpdf/models": "2.8.0"
+        "@embedpdf/engines": "2.9.1",
+        "@embedpdf/models": "2.9.1"
       },
       "peerDependencies": {
         "preact": "^10.26.4",
@@ -591,9 +601,9 @@
       }
     },
     "node_modules/@embedpdf/engines": {
-      "version": "2.8.0",
-      "resolved": "https://registry.npmjs.org/@embedpdf/engines/-/engines-2.8.0.tgz",
-      "integrity": "sha512-s749nppKxOcgvFraySKrwtiCt2VMXFe8TFuZUV5R7z8TtMagt6o5NOk6VsdvIpggUYxIsiKhLkFvAqvkNgcjng==",
+      "version": "2.9.1",
+      "resolved": "https://registry.npmjs.org/@embedpdf/engines/-/engines-2.9.1.tgz",
+      "integrity": "sha512-zyUdKgM2BZVzkqkbIMiTPAKIdH4M3bRV91P1nXUJUU94AmL9DrDrMkf2Nv6+S0bxGt19OpqDlclGSRZ8txhbGw==",
       "license": "MIT",
       "dependencies": {
         "@embedpdf/fonts-arabic": "1.0.0",
@@ -603,8 +613,8 @@
         "@embedpdf/fonts-latin": "1.0.0",
         "@embedpdf/fonts-sc": "1.0.0",
         "@embedpdf/fonts-tc": "1.0.0",
-        "@embedpdf/models": "2.8.0",
-        "@embedpdf/pdfium": "2.8.0"
+        "@embedpdf/models": "2.9.1",
+        "@embedpdf/pdfium": "2.9.1"
       },
       "peerDependencies": {
         "preact": "^10.26.4",
@@ -657,31 +667,31 @@
       "license": "OFL-1.1"
     },
     "node_modules/@embedpdf/models": {
-      "version": "2.8.0",
-      "resolved": "https://registry.npmjs.org/@embedpdf/models/-/models-2.8.0.tgz",
-      "integrity": "sha512-kk3Fm8exMmEX9Ce7VQePybmo04NQGdpsO3FsX1YOQqHpLVBk7tiTeOdetjBqI+YhQ2zWLa2naNKSOSGGzYLyxA==",
+      "version": "2.9.1",
+      "resolved": "https://registry.npmjs.org/@embedpdf/models/-/models-2.9.1.tgz",
+      "integrity": "sha512-hUKj30D+a9dDOQlbqbrpjaECDPIcw/526Vo/s+eqJBY8zDNUkZ6meX+aVUrKg8+ApBm2dcEdVo3ff7KgNRhUGw==",
       "license": "MIT"
     },
     "node_modules/@embedpdf/pdfium": {
-      "version": "2.8.0",
-      "resolved": "https://registry.npmjs.org/@embedpdf/pdfium/-/pdfium-2.8.0.tgz",
-      "integrity": "sha512-RlNLRNboF1Y6fNDy4sJ/a/FEYxATZyeM+n25r3KZJjG+RaM6bxBWXvWlFlGBU5Vx2eqQ5AzDAmIE9cn1agFmqA==",
+      "version": "2.9.1",
+      "resolved": "https://registry.npmjs.org/@embedpdf/pdfium/-/pdfium-2.9.1.tgz",
+      "integrity": "sha512-GUu1rDF3XP8X7UpQNnOCvc/jAX/Tw0NoUpOF0aEksVZ6CoujBxtu84P3kWAxcJl6cicyIJq1GAp9szHBSYrTrQ==",
       "license": "MIT"
     },
     "node_modules/@embedpdf/plugin-annotation": {
-      "version": "2.8.0",
-      "resolved": "https://registry.npmjs.org/@embedpdf/plugin-annotation/-/plugin-annotation-2.8.0.tgz",
-      "integrity": "sha512-h31dT0pvQjFSwsBLytL4BBLf3WDdz9kmAYNKR10filikge7MpgTzgVYFD0C6AOyy2qK1Y/vqworCyh+emVD5aA==",
+      "version": "2.9.1",
+      "resolved": "https://registry.npmjs.org/@embedpdf/plugin-annotation/-/plugin-annotation-2.9.1.tgz",
+      "integrity": "sha512-aNtXjI3NUwz7kdmWsQIWzuS1QdZmuHXGCc+Kwl9u5O0PAgoj74OLsgoNEcFzz9m1rljyq3WPVnLczO6ByiifpQ==",
       "license": "MIT",
       "dependencies": {
-        "@embedpdf/models": "2.8.0",
-        "@embedpdf/utils": "2.8.0"
+        "@embedpdf/models": "2.9.1",
+        "@embedpdf/utils": "2.9.1"
       },
       "peerDependencies": {
-        "@embedpdf/core": "2.8.0",
-        "@embedpdf/plugin-history": "2.8.0",
-        "@embedpdf/plugin-interaction-manager": "2.8.0",
-        "@embedpdf/plugin-selection": "2.8.0",
+        "@embedpdf/core": "2.9.1",
+        "@embedpdf/plugin-history": "2.9.1",
+        "@embedpdf/plugin-interaction-manager": "2.9.1",
+        "@embedpdf/plugin-selection": "2.9.1",
         "preact": "^10.26.4",
         "react": ">=16.8.0",
         "react-dom": ">=16.8.0",
@@ -690,15 +700,15 @@
       }
     },
     "node_modules/@embedpdf/plugin-attachment": {
-      "version": "2.8.0",
-      "resolved": "https://registry.npmjs.org/@embedpdf/plugin-attachment/-/plugin-attachment-2.8.0.tgz",
-      "integrity": "sha512-g2jCwjhQsij9zz2JOxZJkIeLTAUxiBKsFh6K4hcsG45ougw/mI3WCw1f+bZlAPkZuOWPo2/nthsHb+wAlrcykQ==",
+      "version": "2.9.1",
+      "resolved": "https://registry.npmjs.org/@embedpdf/plugin-attachment/-/plugin-attachment-2.9.1.tgz",
+      "integrity": "sha512-7fPPHLWHZE9SXZRPnibo6o/AkuiknJQckdNgO16g9EdbPbO6IDNg/8e8pyjK4Knc+ckyyF4gnJ1lemWswSELUw==",
       "license": "MIT",
       "dependencies": {
-        "@embedpdf/models": "2.8.0"
+        "@embedpdf/models": "2.9.1"
       },
       "peerDependencies": {
-        "@embedpdf/core": "2.8.0",
+        "@embedpdf/core": "2.9.1",
         "preact": "^10.26.4",
         "react": ">=16.8.0",
         "react-dom": ">=16.8.0",
@@ -707,15 +717,15 @@
       }
     },
     "node_modules/@embedpdf/plugin-bookmark": {
-      "version": "2.8.0",
-      "resolved": "https://registry.npmjs.org/@embedpdf/plugin-bookmark/-/plugin-bookmark-2.8.0.tgz",
-      "integrity": "sha512-ab49e17amEshweobU2GbtDEuRDHj89vRYiahkRq9nU1ACI16JIyh4t4fE/m/ucL9YhMMXldjwdtTGHceV566Jg==",
+      "version": "2.9.1",
+      "resolved": "https://registry.npmjs.org/@embedpdf/plugin-bookmark/-/plugin-bookmark-2.9.1.tgz",
+      "integrity": "sha512-5qgz4yBFEi6h1cogvn9q9CBObGdNLVfkX809kVNPHuRIYsghEieqYkdoh1BNwdP/bm9+D7a6pcXZrVvbXs5e5w==",
       "license": "MIT",
       "dependencies": {
-        "@embedpdf/models": "2.8.0"
+        "@embedpdf/models": "2.9.1"
       },
       "peerDependencies": {
-        "@embedpdf/core": "2.8.0",
+        "@embedpdf/core": "2.9.1",
         "preact": "^10.26.4",
         "react": ">=16.8.0",
         "react-dom": ">=16.8.0",
@@ -724,15 +734,15 @@
       }
     },
     "node_modules/@embedpdf/plugin-document-manager": {
-      "version": "2.8.0",
-      "resolved": "https://registry.npmjs.org/@embedpdf/plugin-document-manager/-/plugin-document-manager-2.8.0.tgz",
-      "integrity": "sha512-SS+IKJ2+rk4dHM3PvQQrvnfNdb5oOF1INR5r2w0MKo22C9WPD8Ncg1Jak/mCrGbSrJemW3pkIrKZhoREQtSrbA==",
+      "version": "2.9.1",
+      "resolved": "https://registry.npmjs.org/@embedpdf/plugin-document-manager/-/plugin-document-manager-2.9.1.tgz",
+      "integrity": "sha512-TrqkZvPIQxcWikL9Fmm8/qAJvI+uG7ahPXuyGyyF0JxkrrHCkUMCL8SPJN/fntcPnLJRIi3/K/xR5Qnt/L0aAg==",
       "license": "MIT",
       "dependencies": {
-        "@embedpdf/models": "2.8.0"
+        "@embedpdf/models": "2.9.1"
       },
       "peerDependencies": {
-        "@embedpdf/core": "2.8.0",
+        "@embedpdf/core": "2.9.1",
         "preact": "^10.26.4",
         "react": ">=16.8.0",
         "react-dom": ">=16.8.0",
@@ -741,15 +751,15 @@
       }
     },
     "node_modules/@embedpdf/plugin-export": {
-      "version": "2.8.0",
-      "resolved": "https://registry.npmjs.org/@embedpdf/plugin-export/-/plugin-export-2.8.0.tgz",
-      "integrity": "sha512-AvqfyhB58HLoZMKyXLLT+1ebE7wrMEnIAjr+OqEuaNnekxvb8atD8EBByzgtXLiNLStlxFn5g1CKyQThpw4Pcw==",
+      "version": "2.9.1",
+      "resolved": "https://registry.npmjs.org/@embedpdf/plugin-export/-/plugin-export-2.9.1.tgz",
+      "integrity": "sha512-oYl8H0km1m75SYz17mVwxm9ljZvW0yBV8sTcyCa7YhnqE7yxtczu7jw3BrU3KW4Sua9mr9izhs3AixvWkTASQg==",
       "license": "MIT",
       "dependencies": {
-        "@embedpdf/models": "2.8.0"
+        "@embedpdf/models": "2.9.1"
       },
       "peerDependencies": {
-        "@embedpdf/core": "2.8.0",
+        "@embedpdf/core": "2.9.1",
         "preact": "^10.26.4",
         "react": ">=16.8.0",
         "react-dom": ">=16.8.0",
@@ -758,15 +768,15 @@
       }
     },
     "node_modules/@embedpdf/plugin-history": {
-      "version": "2.8.0",
-      "resolved": "https://registry.npmjs.org/@embedpdf/plugin-history/-/plugin-history-2.8.0.tgz",
-      "integrity": "sha512-S6TO7DqMqVtBYsztgvPvq8BOJTMl8rWdGjVMuoxD93HZdSgogoculwCATrJGor/BC+X6Vmtaqg6NJWSdIAeBEQ==",
+      "version": "2.9.1",
+      "resolved": "https://registry.npmjs.org/@embedpdf/plugin-history/-/plugin-history-2.9.1.tgz",
+      "integrity": "sha512-3AcvSTT7fmqe1ve/FvR3lJ5q7t5JYmnnAg8LKc9ATsDjS9J5b0WE03Omz9a8/sL19iKq8xeR1+W28phgvlcKNw==",
       "license": "MIT",
       "dependencies": {
-        "@embedpdf/models": "2.8.0"
+        "@embedpdf/models": "2.9.1"
       },
       "peerDependencies": {
-        "@embedpdf/core": "2.8.0",
+        "@embedpdf/core": "2.9.1",
         "preact": "^10.26.4",
         "react": ">=16.8.0",
         "react-dom": ">=16.8.0",
@@ -775,15 +785,15 @@
       }
     },
     "node_modules/@embedpdf/plugin-interaction-manager": {
-      "version": "2.8.0",
-      "resolved": "https://registry.npmjs.org/@embedpdf/plugin-interaction-manager/-/plugin-interaction-manager-2.8.0.tgz",
-      "integrity": "sha512-xdRTAp1YiXWm+3WVqIN8dkRT3I/dHTumLJy5Kvt7lc1W2XM3M5bfCk5eTTcjY1DPv2buyt44i/4XNWoXAgBXDg==",
+      "version": "2.9.1",
+      "resolved": "https://registry.npmjs.org/@embedpdf/plugin-interaction-manager/-/plugin-interaction-manager-2.9.1.tgz",
+      "integrity": "sha512-/wpdStr1NeyMCvAEMVSCPC0a3zaMd+TSK4u8INsIo3b1RoFfb9iTlBB+qW/aaxvZJ/C7MChQ7cLX6VSKXK/6JQ==",
       "license": "MIT",
       "dependencies": {
-        "@embedpdf/models": "2.8.0"
+        "@embedpdf/models": "2.9.1"
       },
       "peerDependencies": {
-        "@embedpdf/core": "2.8.0",
+        "@embedpdf/core": "2.9.1",
         "preact": "^10.26.4",
         "react": ">=16.8.0",
         "react-dom": ">=16.8.0",
@@ -792,17 +802,17 @@
       }
     },
     "node_modules/@embedpdf/plugin-pan": {
-      "version": "2.8.0",
-      "resolved": "https://registry.npmjs.org/@embedpdf/plugin-pan/-/plugin-pan-2.8.0.tgz",
-      "integrity": "sha512-EFqTEHk9E7AMRwguRO24jRl0J/5+pG07wlAm5U2rB0LDk30oAqVklFuDygaALdi8ZRBdkWOfD3Wl3gurQvfwAA==",
+      "version": "2.9.1",
+      "resolved": "https://registry.npmjs.org/@embedpdf/plugin-pan/-/plugin-pan-2.9.1.tgz",
+      "integrity": "sha512-LH5fp/2xKWuEYb5cc5jNWdXkhgOL+8TEf4oLcgao6hK33aV1xry+HAg5ATy+OPpIJItCwjU/Lk7Mc7uibYcFlA==",
       "license": "MIT",
       "dependencies": {
-        "@embedpdf/models": "2.8.0"
+        "@embedpdf/models": "2.9.1"
       },
       "peerDependencies": {
-        "@embedpdf/core": "2.8.0",
-        "@embedpdf/plugin-interaction-manager": "2.8.0",
-        "@embedpdf/plugin-viewport": "2.8.0",
+        "@embedpdf/core": "2.9.1",
+        "@embedpdf/plugin-interaction-manager": "2.9.1",
+        "@embedpdf/plugin-viewport": "2.9.1",
         "preact": "^10.26.4",
         "react": ">=16.8.0",
         "react-dom": ">=16.8.0",
@@ -811,15 +821,15 @@
       }
     },
     "node_modules/@embedpdf/plugin-print": {
-      "version": "2.8.0",
-      "resolved": "https://registry.npmjs.org/@embedpdf/plugin-print/-/plugin-print-2.8.0.tgz",
-      "integrity": "sha512-PUdw2/1GwbewYrxVgsb+3lkYyYYcLU5qpazrBZjjx0v+SEpb2SMQOOPNUILeJGKbYUlxSz3qv/loFwqzALkUQA==",
+      "version": "2.9.1",
+      "resolved": "https://registry.npmjs.org/@embedpdf/plugin-print/-/plugin-print-2.9.1.tgz",
+      "integrity": "sha512-brTn0R8AVyAfpm0SYxz/8bg0e373n4KaeIgw5E51DSrczVr3zIgqYGSvXFbfbv57ZUp63Hb93sVorP1et2AeUw==",
       "license": "MIT",
       "dependencies": {
-        "@embedpdf/models": "2.8.0"
+        "@embedpdf/models": "2.9.1"
       },
       "peerDependencies": {
-        "@embedpdf/core": "2.8.0",
+        "@embedpdf/core": "2.9.1",
         "preact": "^10.26.4",
         "react": ">=18.0.0",
         "react-dom": ">=18.0.0",
@@ -828,20 +838,20 @@
       }
     },
     "node_modules/@embedpdf/plugin-redaction": {
-      "version": "2.8.0",
-      "resolved": "https://registry.npmjs.org/@embedpdf/plugin-redaction/-/plugin-redaction-2.8.0.tgz",
-      "integrity": "sha512-pIDFNd9rX7cwrhY6rFCBa5MTnGdLZHX7magToqna/Ffs1KEr0CfNF8jIXG0/E6KB6SsppbHwC7AkwRVWz8NoHg==",
+      "version": "2.9.1",
+      "resolved": "https://registry.npmjs.org/@embedpdf/plugin-redaction/-/plugin-redaction-2.9.1.tgz",
+      "integrity": "sha512-2R81U4ex/JU4IAJ0+G3eIMOwpq80HnAIZ2sI5yMhkDbz+ZZE/sdAP4JKTOFIbhTkwk7DmC222yW34dQJoX4tRQ==",
       "license": "MIT",
       "dependencies": {
-        "@embedpdf/models": "2.8.0",
-        "@embedpdf/utils": "2.8.0"
+        "@embedpdf/models": "2.9.1",
+        "@embedpdf/utils": "2.9.1"
       },
       "peerDependencies": {
-        "@embedpdf/core": "2.8.0",
-        "@embedpdf/plugin-annotation": "2.8.0",
-        "@embedpdf/plugin-history": "2.8.0",
-        "@embedpdf/plugin-interaction-manager": "2.8.0",
-        "@embedpdf/plugin-selection": "2.8.0",
+        "@embedpdf/core": "2.9.1",
+        "@embedpdf/plugin-annotation": "2.9.1",
+        "@embedpdf/plugin-history": "2.9.1",
+        "@embedpdf/plugin-interaction-manager": "2.9.1",
+        "@embedpdf/plugin-selection": "2.9.1",
         "preact": "^10.26.4",
         "react": ">=16.8.0",
         "react-dom": ">=16.8.0",
@@ -850,15 +860,15 @@
       }
     },
     "node_modules/@embedpdf/plugin-render": {
-      "version": "2.8.0",
-      "resolved": "https://registry.npmjs.org/@embedpdf/plugin-render/-/plugin-render-2.8.0.tgz",
-      "integrity": "sha512-jVGSuyg366LmFzbDpqszLbu3G6VOfv1u46D1C0ph6pL3jisTlRswRosaXS4eVE/fAYTryBrI0olCpVYYct4bQw==",
+      "version": "2.9.1",
+      "resolved": "https://registry.npmjs.org/@embedpdf/plugin-render/-/plugin-render-2.9.1.tgz",
+      "integrity": "sha512-mtfu6uDxlz3+j0xPXfKyvuu8iCFjapPkbnx8vGQ0z2PBNAMm+05hsNIzxJSGMP2VCFo09SOz2zCs7ch9J6NeNg==",
       "license": "MIT",
       "dependencies": {
-        "@embedpdf/models": "2.8.0"
+        "@embedpdf/models": "2.9.1"
       },
       "peerDependencies": {
-        "@embedpdf/core": "2.8.0",
+        "@embedpdf/core": "2.9.1",
         "preact": "^10.26.4",
         "react": ">=16.8.0",
         "react-dom": ">=16.8.0",
@@ -867,15 +877,15 @@
       }
     },
     "node_modules/@embedpdf/plugin-rotate": {
-      "version": "2.8.0",
-      "resolved": "https://registry.npmjs.org/@embedpdf/plugin-rotate/-/plugin-rotate-2.8.0.tgz",
-      "integrity": "sha512-lWATWEwhkBW77dJaKXlSJbqEMLTSy1lOhn0kDAZ5eyPZRo+7UWe7LHuT5HWzzRlbY9rpvnyixCT6Zp9rKT+WnQ==",
+      "version": "2.9.1",
+      "resolved": "https://registry.npmjs.org/@embedpdf/plugin-rotate/-/plugin-rotate-2.9.1.tgz",
+      "integrity": "sha512-OgfMI2IsSPHKs4A0DGpmHpxuhoBcZjvw+tz+CXGBi6ILL6oS7z5wXhoMZfRgCgkvjII8RnmjBvmLeahoSaepAA==",
       "license": "MIT",
       "dependencies": {
-        "@embedpdf/models": "2.8.0"
+        "@embedpdf/models": "2.9.1"
       },
       "peerDependencies": {
-        "@embedpdf/core": "2.8.0",
+        "@embedpdf/core": "2.9.1",
         "preact": "^10.26.4",
         "react": ">=16.8.0",
         "react-dom": ">=16.8.0",
@@ -884,16 +894,16 @@
       }
     },
     "node_modules/@embedpdf/plugin-scroll": {
-      "version": "2.8.0",
-      "resolved": "https://registry.npmjs.org/@embedpdf/plugin-scroll/-/plugin-scroll-2.8.0.tgz",
-      "integrity": "sha512-l6hFH6lsAI+07ZGuOwbC8qcRNdYzWSIfRszjt9UmhKZbvXLEp6YJeS/XOUC/37Kqi30tsmLDyZhMW1AooGAr1A==",
+      "version": "2.9.1",
+      "resolved": "https://registry.npmjs.org/@embedpdf/plugin-scroll/-/plugin-scroll-2.9.1.tgz",
+      "integrity": "sha512-+U3PSIUuNlIOTXzRhnPBP+Rx20sFOd3OPiowyI2EP/Kx/j5R/amgL/t2rjrpw9gjXEMEGsli9Fn4UqnVgMrPaQ==",
       "license": "MIT",
       "dependencies": {
-        "@embedpdf/models": "2.8.0"
+        "@embedpdf/models": "2.9.1"
       },
       "peerDependencies": {
-        "@embedpdf/core": "2.8.0",
-        "@embedpdf/plugin-viewport": "2.8.0",
+        "@embedpdf/core": "2.9.1",
+        "@embedpdf/plugin-viewport": "2.9.1",
         "preact": "^10.26.4",
         "react": ">=16.8.0",
         "react-dom": ">=16.8.0",
@@ -902,15 +912,15 @@
       }
     },
     "node_modules/@embedpdf/plugin-search": {
-      "version": "2.8.0",
-      "resolved": "https://registry.npmjs.org/@embedpdf/plugin-search/-/plugin-search-2.8.0.tgz",
-      "integrity": "sha512-HZ7munHdAF2pJ1cT02yc5I0Xcr4b4CQ8GkhD4qhTpZK0yga/tQiDY2Jjstygv7XiZwHIDKvqOuQsQmOXDsEemw==",
+      "version": "2.9.1",
+      "resolved": "https://registry.npmjs.org/@embedpdf/plugin-search/-/plugin-search-2.9.1.tgz",
+      "integrity": "sha512-NefZgXPfj1MW8i5bYEfuphpXXAODutJTtwCHpLff1YwPw6liuBug9G1lDKSpNddvp+7aSkTcXV5LYNhcPxb1vg==",
       "license": "MIT",
       "dependencies": {
-        "@embedpdf/models": "2.8.0"
+        "@embedpdf/models": "2.9.1"
       },
       "peerDependencies": {
-        "@embedpdf/core": "2.8.0",
+        "@embedpdf/core": "2.9.1",
         "preact": "^10.26.4",
         "react": ">=16.8.0",
         "react-dom": ">=16.8.0",
@@ -919,17 +929,17 @@
       }
     },
     "node_modules/@embedpdf/plugin-selection": {
-      "version": "2.8.0",
-      "resolved": "https://registry.npmjs.org/@embedpdf/plugin-selection/-/plugin-selection-2.8.0.tgz",
-      "integrity": "sha512-DcPyOp2WKoVYVpbZIP5t+JsEmCL9Y7bxe8PmiEBtlm1lustuUezdWyA2G4wsGCR4I/5uNlY85qBGCBhL195sSA==",
+      "version": "2.9.1",
+      "resolved": "https://registry.npmjs.org/@embedpdf/plugin-selection/-/plugin-selection-2.9.1.tgz",
+      "integrity": "sha512-dVLjiLGnZDo0xO7lZulLGl3cJ/mO7BcA3PGO2uMdhqSWK4tAF/DrakvwXdD581VBwXD/C25EJhxiNa2L7mU4wg==",
       "license": "MIT",
       "dependencies": {
-        "@embedpdf/models": "2.8.0",
-        "@embedpdf/utils": "2.8.0"
+        "@embedpdf/models": "2.9.1",
+        "@embedpdf/utils": "2.9.1"
       },
       "peerDependencies": {
-        "@embedpdf/core": "2.8.0",
-        "@embedpdf/plugin-interaction-manager": "2.8.0",
+        "@embedpdf/core": "2.9.1",
+        "@embedpdf/plugin-interaction-manager": "2.9.1",
         "preact": "^10.26.4",
         "react": ">=16.8.0",
         "react-dom": ">=16.8.0",
@@ -938,15 +948,15 @@
       }
     },
     "node_modules/@embedpdf/plugin-spread": {
-      "version": "2.8.0",
-      "resolved": "https://registry.npmjs.org/@embedpdf/plugin-spread/-/plugin-spread-2.8.0.tgz",
-      "integrity": "sha512-0Ld5HERaG8cKyWW7ktojG3FK6angkzYnBnw7Rnqf4cQuNdO7nKSTslyxkrLzF3vvmKrB//2ghm/pRVkgci4BOw==",
+      "version": "2.9.1",
+      "resolved": "https://registry.npmjs.org/@embedpdf/plugin-spread/-/plugin-spread-2.9.1.tgz",
+      "integrity": "sha512-s9J4tvoucNac8pUAHVhv3PWDWMZJyK0ikaG78VdGwh4G2iMo5HW1LKDJkJ29l1TjAuxhIoKihpfQbLgUgi7JHA==",
       "license": "MIT",
       "dependencies": {
-        "@embedpdf/models": "2.8.0"
+        "@embedpdf/models": "2.9.1"
       },
       "peerDependencies": {
-        "@embedpdf/core": "2.8.0",
+        "@embedpdf/core": "2.9.1",
         "preact": "^10.26.4",
         "react": ">=16.8.0",
         "react-dom": ">=16.8.0",
@@ -955,16 +965,16 @@
       }
     },
     "node_modules/@embedpdf/plugin-thumbnail": {
-      "version": "2.8.0",
-      "resolved": "https://registry.npmjs.org/@embedpdf/plugin-thumbnail/-/plugin-thumbnail-2.8.0.tgz",
-      "integrity": "sha512-Dq/Cqsn4GClRXNWerqlXNH8WDWK/TtHxwq6yr2kqgXPo1FyREto4I7GfdO1hygTu0Dl6HK2auEVHBVC8QT53fw==",
+      "version": "2.9.1",
+      "resolved": "https://registry.npmjs.org/@embedpdf/plugin-thumbnail/-/plugin-thumbnail-2.9.1.tgz",
+      "integrity": "sha512-TAEUkVxvvB5kh2VVGf9RMuJFq++CQgWpKJ62ed2GhB9WvVKP5gBYj7G5ff90TLCrAV8iXZL9ENKcHgGKxrZrYw==",
       "license": "MIT",
       "dependencies": {
-        "@embedpdf/models": "2.8.0"
+        "@embedpdf/models": "2.9.1"
       },
       "peerDependencies": {
-        "@embedpdf/core": "2.8.0",
-        "@embedpdf/plugin-render": "2.8.0",
+        "@embedpdf/core": "2.9.1",
+        "@embedpdf/plugin-render": "2.9.1",
         "preact": "^10.26.4",
         "react": ">=16.8.0",
         "react-dom": ">=16.8.0",
@@ -973,18 +983,18 @@
       }
     },
     "node_modules/@embedpdf/plugin-tiling": {
-      "version": "2.8.0",
-      "resolved": "https://registry.npmjs.org/@embedpdf/plugin-tiling/-/plugin-tiling-2.8.0.tgz",
-      "integrity": "sha512-gPe5mG6hyyruki1eSuQYD2KDbo0Z0TxzSk8TcHIdEYYF6NlI2OghuO8Vczz5WLU8clX8xzn8c/c+tQMHEXfbZA==",
+      "version": "2.9.1",
+      "resolved": "https://registry.npmjs.org/@embedpdf/plugin-tiling/-/plugin-tiling-2.9.1.tgz",
+      "integrity": "sha512-UQ/gr/Rdzj7sMsgvtuClw6Jq25fMr+OEdW4tQmg2bV/MqpKptpOEUZ5Aiay4M03X3cgoxhS8UvobRMnjlpYljA==",
       "license": "MIT",
       "dependencies": {
-        "@embedpdf/models": "2.8.0"
+        "@embedpdf/models": "2.9.1"
       },
       "peerDependencies": {
-        "@embedpdf/core": "2.8.0",
-        "@embedpdf/plugin-render": "2.8.0",
-        "@embedpdf/plugin-scroll": "2.8.0",
-        "@embedpdf/plugin-viewport": "2.8.0",
+        "@embedpdf/core": "2.9.1",
+        "@embedpdf/plugin-render": "2.9.1",
+        "@embedpdf/plugin-scroll": "2.9.1",
+        "@embedpdf/plugin-viewport": "2.9.1",
         "preact": "^10.26.4",
         "react": ">=16.8.0",
         "react-dom": ">=16.8.0",
@@ -993,15 +1003,15 @@
       }
     },
     "node_modules/@embedpdf/plugin-viewport": {
-      "version": "2.8.0",
-      "resolved": "https://registry.npmjs.org/@embedpdf/plugin-viewport/-/plugin-viewport-2.8.0.tgz",
-      "integrity": "sha512-E16hc4yPA54XQGHp0Dy3OYyE8ilBaJE7LJirVmha4kMkP7XBu6xHNOJrXtq4GsZmdLQkf+x8ie2DDbWS+tcwnw==",
+      "version": "2.9.1",
+      "resolved": "https://registry.npmjs.org/@embedpdf/plugin-viewport/-/plugin-viewport-2.9.1.tgz",
+      "integrity": "sha512-bVhBuZHTppKV+OB5lBLqXQv+5oW1A7kAIc5UzsImBwl6NpwH+2PdVkelfrF37yEqnEF/mdxobriWSP0aOVl93w==",
       "license": "MIT",
       "dependencies": {
-        "@embedpdf/models": "2.8.0"
+        "@embedpdf/models": "2.9.1"
       },
       "peerDependencies": {
-        "@embedpdf/core": "2.8.0",
+        "@embedpdf/core": "2.9.1",
         "preact": "^10.26.4",
         "react": ">=16.8.0",
         "react-dom": ">=16.8.0",
@@ -1010,17 +1020,17 @@
       }
     },
     "node_modules/@embedpdf/plugin-zoom": {
-      "version": "2.8.0",
-      "resolved": "https://registry.npmjs.org/@embedpdf/plugin-zoom/-/plugin-zoom-2.8.0.tgz",
-      "integrity": "sha512-HepSQ7NFYhMsQsgfnC/G3b3LOYtNCWkCME0C0jBLrEYsgqsWozf97jIgzfOAeJsugyjQmojpgLUNt3xE9CtG6Q==",
+      "version": "2.9.1",
+      "resolved": "https://registry.npmjs.org/@embedpdf/plugin-zoom/-/plugin-zoom-2.9.1.tgz",
+      "integrity": "sha512-FVOYj+AKTc2aCPrZHOrgbiYNTfBmiwVpFCedmqeGLYOIYTIeGzwJlyIHLU0PmIC/nuHcu1ZFwh0tH23fWAfVCQ==",
       "license": "MIT",
       "dependencies": {
-        "@embedpdf/models": "2.8.0"
+        "@embedpdf/models": "2.9.1"
       },
       "peerDependencies": {
-        "@embedpdf/core": "2.8.0",
-        "@embedpdf/plugin-scroll": "2.8.0",
-        "@embedpdf/plugin-viewport": "2.8.0",
+        "@embedpdf/core": "2.9.1",
+        "@embedpdf/plugin-scroll": "2.9.1",
+        "@embedpdf/plugin-viewport": "2.9.1",
         "preact": "^10.26.4",
         "react": ">=16.8.0",
         "react-dom": ">=16.8.0",
@@ -1029,9 +1039,9 @@
       }
     },
     "node_modules/@embedpdf/utils": {
-      "version": "2.8.0",
-      "resolved": "https://registry.npmjs.org/@embedpdf/utils/-/utils-2.8.0.tgz",
-      "integrity": "sha512-mt3DiQ8pnPk95q0zv7dXfN+y5fzJT2WtXyST8ziYEgmfhz0l2HT/MHCAwLzB3Whlnd2BdHThLfJyG1UD6pC84g==",
+      "version": "2.9.1",
+      "resolved": "https://registry.npmjs.org/@embedpdf/utils/-/utils-2.9.1.tgz",
+      "integrity": "sha512-IKe/k5DruzpuyGJBIoLEL9AKJ9rEBDLgi1eSCWQPyYkuLWTJg4rBzyGh57eS4S4K4dzQrlJ3Z9zGAW1mgbY2Jw==",
       "license": "MIT",
       "peerDependencies": {
         "preact": "^10.26.4",
@@ -1188,9 +1198,9 @@
       "license": "MIT"
     },
     "node_modules/@esbuild/aix-ppc64": {
-      "version": "0.27.3",
-      "resolved": "https://registry.npmjs.org/@esbuild/aix-ppc64/-/aix-ppc64-0.27.3.tgz",
-      "integrity": "sha512-9fJMTNFTWZMh5qwrBItuziu834eOCUcEqymSH7pY+zoMVEZg3gcPuBNxH1EvfVYe9h0x/Ptw8KBzv7qxb7l8dg==",
+      "version": "0.27.4",
+      "resolved": "https://registry.npmjs.org/@esbuild/aix-ppc64/-/aix-ppc64-0.27.4.tgz",
+      "integrity": "sha512-cQPwL2mp2nSmHHJlCyoXgHGhbEPMrEEU5xhkcy3Hs/O7nGZqEpZ2sUtLaL9MORLtDfRvVl2/3PAuEkYZH0Ty8Q==",
       "cpu": [
         "ppc64"
       ],
@@ -1205,9 +1215,9 @@
       }
     },
     "node_modules/@esbuild/android-arm": {
-      "version": "0.27.3",
-      "resolved": "https://registry.npmjs.org/@esbuild/android-arm/-/android-arm-0.27.3.tgz",
-      "integrity": "sha512-i5D1hPY7GIQmXlXhs2w8AWHhenb00+GxjxRncS2ZM7YNVGNfaMxgzSGuO8o8SJzRc/oZwU2bcScvVERk03QhzA==",
+      "version": "0.27.4",
+      "resolved": "https://registry.npmjs.org/@esbuild/android-arm/-/android-arm-0.27.4.tgz",
+      "integrity": "sha512-X9bUgvxiC8CHAGKYufLIHGXPJWnr0OCdR0anD2e21vdvgCI8lIfqFbnoeOz7lBjdrAGUhqLZLcQo6MLhTO2DKQ==",
       "cpu": [
         "arm"
       ],
@@ -1222,9 +1232,9 @@
       }
     },
     "node_modules/@esbuild/android-arm64": {
-      "version": "0.27.3",
-      "resolved": "https://registry.npmjs.org/@esbuild/android-arm64/-/android-arm64-0.27.3.tgz",
-      "integrity": "sha512-YdghPYUmj/FX2SYKJ0OZxf+iaKgMsKHVPF1MAq/P8WirnSpCStzKJFjOjzsW0QQ7oIAiccHdcqjbHmJxRb/dmg==",
+      "version": "0.27.4",
+      "resolved": "https://registry.npmjs.org/@esbuild/android-arm64/-/android-arm64-0.27.4.tgz",
+      "integrity": "sha512-gdLscB7v75wRfu7QSm/zg6Rx29VLdy9eTr2t44sfTW7CxwAtQghZ4ZnqHk3/ogz7xao0QAgrkradbBzcqFPasw==",
       "cpu": [
         "arm64"
       ],
@@ -1239,9 +1249,9 @@
       }
     },
     "node_modules/@esbuild/android-x64": {
-      "version": "0.27.3",
-      "resolved": "https://registry.npmjs.org/@esbuild/android-x64/-/android-x64-0.27.3.tgz",
-      "integrity": "sha512-IN/0BNTkHtk8lkOM8JWAYFg4ORxBkZQf9zXiEOfERX/CzxW3Vg1ewAhU7QSWQpVIzTW+b8Xy+lGzdYXV6UZObQ==",
+      "version": "0.27.4",
+      "resolved": "https://registry.npmjs.org/@esbuild/android-x64/-/android-x64-0.27.4.tgz",
+      "integrity": "sha512-PzPFnBNVF292sfpfhiyiXCGSn9HZg5BcAz+ivBuSsl6Rk4ga1oEXAamhOXRFyMcjwr2DVtm40G65N3GLeH1Lvw==",
       "cpu": [
         "x64"
       ],
@@ -1256,9 +1266,9 @@
       }
     },
     "node_modules/@esbuild/darwin-arm64": {
-      "version": "0.27.3",
-      "resolved": "https://registry.npmjs.org/@esbuild/darwin-arm64/-/darwin-arm64-0.27.3.tgz",
-      "integrity": "sha512-Re491k7ByTVRy0t3EKWajdLIr0gz2kKKfzafkth4Q8A5n1xTHrkqZgLLjFEHVD+AXdUGgQMq+Godfq45mGpCKg==",
+      "version": "0.27.4",
+      "resolved": "https://registry.npmjs.org/@esbuild/darwin-arm64/-/darwin-arm64-0.27.4.tgz",
+      "integrity": "sha512-b7xaGIwdJlht8ZFCvMkpDN6uiSmnxxK56N2GDTMYPr2/gzvfdQN8rTfBsvVKmIVY/X7EM+/hJKEIbbHs9oA4tQ==",
       "cpu": [
         "arm64"
       ],
@@ -1273,9 +1283,9 @@
       }
     },
     "node_modules/@esbuild/darwin-x64": {
-      "version": "0.27.3",
-      "resolved": "https://registry.npmjs.org/@esbuild/darwin-x64/-/darwin-x64-0.27.3.tgz",
-      "integrity": "sha512-vHk/hA7/1AckjGzRqi6wbo+jaShzRowYip6rt6q7VYEDX4LEy1pZfDpdxCBnGtl+A5zq8iXDcyuxwtv3hNtHFg==",
+      "version": "0.27.4",
+      "resolved": "https://registry.npmjs.org/@esbuild/darwin-x64/-/darwin-x64-0.27.4.tgz",
+      "integrity": "sha512-sR+OiKLwd15nmCdqpXMnuJ9W2kpy0KigzqScqHI3Hqwr7IXxBp3Yva+yJwoqh7rE8V77tdoheRYataNKL4QrPw==",
       "cpu": [
         "x64"
       ],
@@ -1290,9 +1300,9 @@
       }
     },
     "node_modules/@esbuild/freebsd-arm64": {
-      "version": "0.27.3",
-      "resolved": "https://registry.npmjs.org/@esbuild/freebsd-arm64/-/freebsd-arm64-0.27.3.tgz",
-      "integrity": "sha512-ipTYM2fjt3kQAYOvo6vcxJx3nBYAzPjgTCk7QEgZG8AUO3ydUhvelmhrbOheMnGOlaSFUoHXB6un+A7q4ygY9w==",
+      "version": "0.27.4",
+      "resolved": "https://registry.npmjs.org/@esbuild/freebsd-arm64/-/freebsd-arm64-0.27.4.tgz",
+      "integrity": "sha512-jnfpKe+p79tCnm4GVav68A7tUFeKQwQyLgESwEAUzyxk/TJr4QdGog9sqWNcUbr/bZt/O/HXouspuQDd9JxFSw==",
       "cpu": [
         "arm64"
       ],
@@ -1307,9 +1317,9 @@
       }
     },
     "node_modules/@esbuild/freebsd-x64": {
-      "version": "0.27.3",
-      "resolved": "https://registry.npmjs.org/@esbuild/freebsd-x64/-/freebsd-x64-0.27.3.tgz",
-      "integrity": "sha512-dDk0X87T7mI6U3K9VjWtHOXqwAMJBNN2r7bejDsc+j03SEjtD9HrOl8gVFByeM0aJksoUuUVU9TBaZa2rgj0oA==",
+      "version": "0.27.4",
+      "resolved": "https://registry.npmjs.org/@esbuild/freebsd-x64/-/freebsd-x64-0.27.4.tgz",
+      "integrity": "sha512-2kb4ceA/CpfUrIcTUl1wrP/9ad9Atrp5J94Lq69w7UwOMolPIGrfLSvAKJp0RTvkPPyn6CIWrNy13kyLikZRZQ==",
       "cpu": [
         "x64"
       ],
@@ -1324,9 +1334,9 @@
       }
     },
     "node_modules/@esbuild/linux-arm": {
-      "version": "0.27.3",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-arm/-/linux-arm-0.27.3.tgz",
-      "integrity": "sha512-s6nPv2QkSupJwLYyfS+gwdirm0ukyTFNl3KTgZEAiJDd+iHZcbTPPcWCcRYH+WlNbwChgH2QkE9NSlNrMT8Gfw==",
+      "version": "0.27.4",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-arm/-/linux-arm-0.27.4.tgz",
+      "integrity": "sha512-aBYgcIxX/wd5n2ys0yESGeYMGF+pv6g0DhZr3G1ZG4jMfruU9Tl1i2Z+Wnj9/KjGz1lTLCcorqE2viePZqj4Eg==",
       "cpu": [
         "arm"
       ],
@@ -1341,9 +1351,9 @@
       }
     },
     "node_modules/@esbuild/linux-arm64": {
-      "version": "0.27.3",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-arm64/-/linux-arm64-0.27.3.tgz",
-      "integrity": "sha512-sZOuFz/xWnZ4KH3YfFrKCf1WyPZHakVzTiqji3WDc0BCl2kBwiJLCXpzLzUBLgmp4veFZdvN5ChW4Eq/8Fc2Fg==",
+      "version": "0.27.4",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-arm64/-/linux-arm64-0.27.4.tgz",
+      "integrity": "sha512-7nQOttdzVGth1iz57kxg9uCz57dxQLHWxopL6mYuYthohPKEK0vU0C3O21CcBK6KDlkYVcnDXY099HcCDXd9dA==",
       "cpu": [
         "arm64"
       ],
@@ -1358,9 +1368,9 @@
       }
     },
     "node_modules/@esbuild/linux-ia32": {
-      "version": "0.27.3",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-ia32/-/linux-ia32-0.27.3.tgz",
-      "integrity": "sha512-yGlQYjdxtLdh0a3jHjuwOrxQjOZYD/C9PfdbgJJF3TIZWnm/tMd/RcNiLngiu4iwcBAOezdnSLAwQDPqTmtTYg==",
+      "version": "0.27.4",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-ia32/-/linux-ia32-0.27.4.tgz",
+      "integrity": "sha512-oPtixtAIzgvzYcKBQM/qZ3R+9TEUd1aNJQu0HhGyqtx6oS7qTpvjheIWBbes4+qu1bNlo2V4cbkISr8q6gRBFA==",
       "cpu": [
         "ia32"
       ],
@@ -1375,9 +1385,9 @@
       }
     },
     "node_modules/@esbuild/linux-loong64": {
-      "version": "0.27.3",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-loong64/-/linux-loong64-0.27.3.tgz",
-      "integrity": "sha512-WO60Sn8ly3gtzhyjATDgieJNet/KqsDlX5nRC5Y3oTFcS1l0KWba+SEa9Ja1GfDqSF1z6hif/SkpQJbL63cgOA==",
+      "version": "0.27.4",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-loong64/-/linux-loong64-0.27.4.tgz",
+      "integrity": "sha512-8mL/vh8qeCoRcFH2nM8wm5uJP+ZcVYGGayMavi8GmRJjuI3g1v6Z7Ni0JJKAJW+m0EtUuARb6Lmp4hMjzCBWzA==",
       "cpu": [
         "loong64"
       ],
@@ -1392,9 +1402,9 @@
       }
     },
     "node_modules/@esbuild/linux-mips64el": {
-      "version": "0.27.3",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-mips64el/-/linux-mips64el-0.27.3.tgz",
-      "integrity": "sha512-APsymYA6sGcZ4pD6k+UxbDjOFSvPWyZhjaiPyl/f79xKxwTnrn5QUnXR5prvetuaSMsb4jgeHewIDCIWljrSxw==",
+      "version": "0.27.4",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-mips64el/-/linux-mips64el-0.27.4.tgz",
+      "integrity": "sha512-1RdrWFFiiLIW7LQq9Q2NES+HiD4NyT8Itj9AUeCl0IVCA459WnPhREKgwrpaIfTOe+/2rdntisegiPWn/r/aAw==",
       "cpu": [
         "mips64el"
       ],
@@ -1409,9 +1419,9 @@
       }
     },
     "node_modules/@esbuild/linux-ppc64": {
-      "version": "0.27.3",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-ppc64/-/linux-ppc64-0.27.3.tgz",
-      "integrity": "sha512-eizBnTeBefojtDb9nSh4vvVQ3V9Qf9Df01PfawPcRzJH4gFSgrObw+LveUyDoKU3kxi5+9RJTCWlj4FjYXVPEA==",
+      "version": "0.27.4",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-ppc64/-/linux-ppc64-0.27.4.tgz",
+      "integrity": "sha512-tLCwNG47l3sd9lpfyx9LAGEGItCUeRCWeAx6x2Jmbav65nAwoPXfewtAdtbtit/pJFLUWOhpv0FpS6GQAmPrHA==",
       "cpu": [
         "ppc64"
       ],
@@ -1426,9 +1436,9 @@
       }
     },
     "node_modules/@esbuild/linux-riscv64": {
-      "version": "0.27.3",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-riscv64/-/linux-riscv64-0.27.3.tgz",
-      "integrity": "sha512-3Emwh0r5wmfm3ssTWRQSyVhbOHvqegUDRd0WhmXKX2mkHJe1SFCMJhagUleMq+Uci34wLSipf8Lagt4LlpRFWQ==",
+      "version": "0.27.4",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-riscv64/-/linux-riscv64-0.27.4.tgz",
+      "integrity": "sha512-BnASypppbUWyqjd1KIpU4AUBiIhVr6YlHx/cnPgqEkNoVOhHg+YiSVxM1RLfiy4t9cAulbRGTNCKOcqHrEQLIw==",
       "cpu": [
         "riscv64"
       ],
@@ -1443,9 +1453,9 @@
       }
     },
     "node_modules/@esbuild/linux-s390x": {
-      "version": "0.27.3",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-s390x/-/linux-s390x-0.27.3.tgz",
-      "integrity": "sha512-pBHUx9LzXWBc7MFIEEL0yD/ZVtNgLytvx60gES28GcWMqil8ElCYR4kvbV2BDqsHOvVDRrOxGySBM9Fcv744hw==",
+      "version": "0.27.4",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-s390x/-/linux-s390x-0.27.4.tgz",
+      "integrity": "sha512-+eUqgb/Z7vxVLezG8bVB9SfBie89gMueS+I0xYh2tJdw3vqA/0ImZJ2ROeWwVJN59ihBeZ7Tu92dF/5dy5FttA==",
       "cpu": [
         "s390x"
       ],
@@ -1460,9 +1470,9 @@
       }
     },
     "node_modules/@esbuild/linux-x64": {
-      "version": "0.27.3",
-      "resolved": "https://registry.npmjs.org/@esbuild/linux-x64/-/linux-x64-0.27.3.tgz",
-      "integrity": "sha512-Czi8yzXUWIQYAtL/2y6vogER8pvcsOsk5cpwL4Gk5nJqH5UZiVByIY8Eorm5R13gq+DQKYg0+JyQoytLQas4dA==",
+      "version": "0.27.4",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-x64/-/linux-x64-0.27.4.tgz",
+      "integrity": "sha512-S5qOXrKV8BQEzJPVxAwnryi2+Iq5pB40gTEIT69BQONqR7JH1EPIcQ/Uiv9mCnn05jff9umq/5nqzxlqTOg9NA==",
       "cpu": [
         "x64"
       ],
@@ -1477,9 +1487,9 @@
       }
     },
     "node_modules/@esbuild/netbsd-arm64": {
-      "version": "0.27.3",
-      "resolved": "https://registry.npmjs.org/@esbuild/netbsd-arm64/-/netbsd-arm64-0.27.3.tgz",
-      "integrity": "sha512-sDpk0RgmTCR/5HguIZa9n9u+HVKf40fbEUt+iTzSnCaGvY9kFP0YKBWZtJaraonFnqef5SlJ8/TiPAxzyS+UoA==",
+      "version": "0.27.4",
+      "resolved": "https://registry.npmjs.org/@esbuild/netbsd-arm64/-/netbsd-arm64-0.27.4.tgz",
+      "integrity": "sha512-xHT8X4sb0GS8qTqiwzHqpY00C95DPAq7nAwX35Ie/s+LO9830hrMd3oX0ZMKLvy7vsonee73x0lmcdOVXFzd6Q==",
       "cpu": [
         "arm64"
       ],
@@ -1494,9 +1504,9 @@
       }
     },
     "node_modules/@esbuild/netbsd-x64": {
-      "version": "0.27.3",
-      "resolved": "https://registry.npmjs.org/@esbuild/netbsd-x64/-/netbsd-x64-0.27.3.tgz",
-      "integrity": "sha512-P14lFKJl/DdaE00LItAukUdZO5iqNH7+PjoBm+fLQjtxfcfFE20Xf5CrLsmZdq5LFFZzb5JMZ9grUwvtVYzjiA==",
+      "version": "0.27.4",
+      "resolved": "https://registry.npmjs.org/@esbuild/netbsd-x64/-/netbsd-x64-0.27.4.tgz",
+      "integrity": "sha512-RugOvOdXfdyi5Tyv40kgQnI0byv66BFgAqjdgtAKqHoZTbTF2QqfQrFwa7cHEORJf6X2ht+l9ABLMP0dnKYsgg==",
       "cpu": [
         "x64"
       ],
@@ -1511,9 +1521,9 @@
       }
     },
     "node_modules/@esbuild/openbsd-arm64": {
-      "version": "0.27.3",
-      "resolved": "https://registry.npmjs.org/@esbuild/openbsd-arm64/-/openbsd-arm64-0.27.3.tgz",
-      "integrity": "sha512-AIcMP77AvirGbRl/UZFTq5hjXK+2wC7qFRGoHSDrZ5v5b8DK/GYpXW3CPRL53NkvDqb9D+alBiC/dV0Fb7eJcw==",
+      "version": "0.27.4",
+      "resolved": "https://registry.npmjs.org/@esbuild/openbsd-arm64/-/openbsd-arm64-0.27.4.tgz",
+      "integrity": "sha512-2MyL3IAaTX+1/qP0O1SwskwcwCoOI4kV2IBX1xYnDDqthmq5ArrW94qSIKCAuRraMgPOmG0RDTA74mzYNQA9ow==",
       "cpu": [
         "arm64"
       ],
@@ -1528,9 +1538,9 @@
       }
     },
     "node_modules/@esbuild/openbsd-x64": {
-      "version": "0.27.3",
-      "resolved": "https://registry.npmjs.org/@esbuild/openbsd-x64/-/openbsd-x64-0.27.3.tgz",
-      "integrity": "sha512-DnW2sRrBzA+YnE70LKqnM3P+z8vehfJWHXECbwBmH/CU51z6FiqTQTHFenPlHmo3a8UgpLyH3PT+87OViOh1AQ==",
+      "version": "0.27.4",
+      "resolved": "https://registry.npmjs.org/@esbuild/openbsd-x64/-/openbsd-x64-0.27.4.tgz",
+      "integrity": "sha512-u8fg/jQ5aQDfsnIV6+KwLOf1CmJnfu1ShpwqdwC0uA7ZPwFws55Ngc12vBdeUdnuWoQYx/SOQLGDcdlfXhYmXQ==",
       "cpu": [
         "x64"
       ],
@@ -1545,9 +1555,9 @@
       }
     },
     "node_modules/@esbuild/openharmony-arm64": {
-      "version": "0.27.3",
-      "resolved": "https://registry.npmjs.org/@esbuild/openharmony-arm64/-/openharmony-arm64-0.27.3.tgz",
-      "integrity": "sha512-NinAEgr/etERPTsZJ7aEZQvvg/A6IsZG/LgZy+81wON2huV7SrK3e63dU0XhyZP4RKGyTm7aOgmQk0bGp0fy2g==",
+      "version": "0.27.4",
+      "resolved": "https://registry.npmjs.org/@esbuild/openharmony-arm64/-/openharmony-arm64-0.27.4.tgz",
+      "integrity": "sha512-JkTZrl6VbyO8lDQO3yv26nNr2RM2yZzNrNHEsj9bm6dOwwu9OYN28CjzZkH57bh4w0I2F7IodpQvUAEd1mbWXg==",
       "cpu": [
         "arm64"
       ],
@@ -1562,9 +1572,9 @@
       }
     },
     "node_modules/@esbuild/sunos-x64": {
-      "version": "0.27.3",
-      "resolved": "https://registry.npmjs.org/@esbuild/sunos-x64/-/sunos-x64-0.27.3.tgz",
-      "integrity": "sha512-PanZ+nEz+eWoBJ8/f8HKxTTD172SKwdXebZ0ndd953gt1HRBbhMsaNqjTyYLGLPdoWHy4zLU7bDVJztF5f3BHA==",
+      "version": "0.27.4",
+      "resolved": "https://registry.npmjs.org/@esbuild/sunos-x64/-/sunos-x64-0.27.4.tgz",
+      "integrity": "sha512-/gOzgaewZJfeJTlsWhvUEmUG4tWEY2Spp5M20INYRg2ZKl9QPO3QEEgPeRtLjEWSW8FilRNacPOg8R1uaYkA6g==",
       "cpu": [
         "x64"
       ],
@@ -1579,9 +1589,9 @@
       }
     },
     "node_modules/@esbuild/win32-arm64": {
-      "version": "0.27.3",
-      "resolved": "https://registry.npmjs.org/@esbuild/win32-arm64/-/win32-arm64-0.27.3.tgz",
-      "integrity": "sha512-B2t59lWWYrbRDw/tjiWOuzSsFh1Y/E95ofKz7rIVYSQkUYBjfSgf6oeYPNWHToFRr2zx52JKApIcAS/D5TUBnA==",
+      "version": "0.27.4",
+      "resolved": "https://registry.npmjs.org/@esbuild/win32-arm64/-/win32-arm64-0.27.4.tgz",
+      "integrity": "sha512-Z9SExBg2y32smoDQdf1HRwHRt6vAHLXcxD2uGgO/v2jK7Y718Ix4ndsbNMU/+1Qiem9OiOdaqitioZwxivhXYg==",
       "cpu": [
         "arm64"
       ],
@@ -1596,9 +1606,9 @@
       }
     },
     "node_modules/@esbuild/win32-ia32": {
-      "version": "0.27.3",
-      "resolved": "https://registry.npmjs.org/@esbuild/win32-ia32/-/win32-ia32-0.27.3.tgz",
-      "integrity": "sha512-QLKSFeXNS8+tHW7tZpMtjlNb7HKau0QDpwm49u0vUp9y1WOF+PEzkU84y9GqYaAVW8aH8f3GcBck26jh54cX4Q==",
+      "version": "0.27.4",
+      "resolved": "https://registry.npmjs.org/@esbuild/win32-ia32/-/win32-ia32-0.27.4.tgz",
+      "integrity": "sha512-DAyGLS0Jz5G5iixEbMHi5KdiApqHBWMGzTtMiJ72ZOLhbu/bzxgAe8Ue8CTS3n3HbIUHQz/L51yMdGMeoxXNJw==",
       "cpu": [
         "ia32"
       ],
@@ -1613,9 +1623,9 @@
       }
     },
     "node_modules/@esbuild/win32-x64": {
-      "version": "0.27.3",
-      "resolved": "https://registry.npmjs.org/@esbuild/win32-x64/-/win32-x64-0.27.3.tgz",
-      "integrity": "sha512-4uJGhsxuptu3OcpVAzli+/gWusVGwZZHTlS63hh++ehExkVT8SgiEf7/uC/PclrPPkLhZqGgCTjd0VWLo6xMqA==",
+      "version": "0.27.4",
+      "resolved": "https://registry.npmjs.org/@esbuild/win32-x64/-/win32-x64-0.27.4.tgz",
+      "integrity": "sha512-+knoa0BDoeXgkNvvV1vvbZX4+hizelrkwmGJBdT17t8FNPwG2lKemmuMZlmaNQ3ws3DKKCxpb4zRZEIp3UxFCg==",
       "cpu": [
         "x64"
       ],
@@ -1659,37 +1669,37 @@
       }
     },
     "node_modules/@eslint/config-array": {
-      "version": "0.23.2",
-      "resolved": "https://registry.npmjs.org/@eslint/config-array/-/config-array-0.23.2.tgz",
-      "integrity": "sha512-YF+fE6LV4v5MGWRGj7G404/OZzGNepVF8fxk7jqmqo3lrza7a0uUcDnROGRBG1WFC1omYUS/Wp1f42i0M+3Q3A==",
+      "version": "0.23.3",
+      "resolved": "https://registry.npmjs.org/@eslint/config-array/-/config-array-0.23.3.tgz",
+      "integrity": "sha512-j+eEWmB6YYLwcNOdlwQ6L2OsptI/LO6lNBuLIqe5R7RetD658HLoF+Mn7LzYmAWWNNzdC6cqP+L6r8ujeYXWLw==",
       "dev": true,
       "license": "Apache-2.0",
       "dependencies": {
-        "@eslint/object-schema": "^3.0.2",
+        "@eslint/object-schema": "^3.0.3",
         "debug": "^4.3.1",
-        "minimatch": "^10.2.1"
+        "minimatch": "^10.2.4"
       },
       "engines": {
         "node": "^20.19.0 || ^22.13.0 || >=24"
       }
     },
     "node_modules/@eslint/config-helpers": {
-      "version": "0.5.2",
-      "resolved": "https://registry.npmjs.org/@eslint/config-helpers/-/config-helpers-0.5.2.tgz",
-      "integrity": "sha512-a5MxrdDXEvqnIq+LisyCX6tQMPF/dSJpCfBgBauY+pNZ28yCtSsTvyTYrMhaI+LK26bVyCJfJkT0u8KIj2i1dQ==",
+      "version": "0.5.3",
+      "resolved": "https://registry.npmjs.org/@eslint/config-helpers/-/config-helpers-0.5.3.tgz",
+      "integrity": "sha512-lzGN0onllOZCGroKJmRwY6QcEHxbjBw1gwB8SgRSqK8YbbtEXMvKynsXc3553ckIEBxsbMBU7oOZXKIPGZNeZw==",
       "dev": true,
       "license": "Apache-2.0",
       "dependencies": {
-        "@eslint/core": "^1.1.0"
+        "@eslint/core": "^1.1.1"
       },
       "engines": {
         "node": "^20.19.0 || ^22.13.0 || >=24"
       }
     },
     "node_modules/@eslint/core": {
-      "version": "1.1.0",
-      "resolved": "https://registry.npmjs.org/@eslint/core/-/core-1.1.0.tgz",
-      "integrity": "sha512-/nr9K9wkr3P1EzFTdFdMoLuo1PmIxjmwvPozwoSodjNBdefGujXQUF93u1DDZpEaTuDvMsIQddsd35BwtrW9Xw==",
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/@eslint/core/-/core-1.1.1.tgz",
+      "integrity": "sha512-QUPblTtE51/7/Zhfv8BDwO0qkkzQL7P/aWWbqcf4xWLEYn1oKjdO0gglQBB4GAsu7u6wjijbCmzsUTy6mnk6oQ==",
       "dev": true,
       "license": "Apache-2.0",
       "dependencies": {
@@ -1721,9 +1731,9 @@
       }
     },
     "node_modules/@eslint/object-schema": {
-      "version": "3.0.2",
-      "resolved": "https://registry.npmjs.org/@eslint/object-schema/-/object-schema-3.0.2.tgz",
-      "integrity": "sha512-HOy56KJt48Bx8KmJ+XGQNSUMT/6dZee/M54XyUyuvTvPXJmsERRvBchsUVx1UMe1WwIH49XLAczNC7V2INsuUw==",
+      "version": "3.0.3",
+      "resolved": "https://registry.npmjs.org/@eslint/object-schema/-/object-schema-3.0.3.tgz",
+      "integrity": "sha512-iM869Pugn9Nsxbh/YHRqYiqd23AmIbxJOcpUMOuWCVNdoQJ5ZtwL6h3t0bcZzJUlC3Dq9jCFCESBZnX0GTv7iQ==",
       "dev": true,
       "license": "Apache-2.0",
       "engines": {
@@ -1731,13 +1741,13 @@
       }
     },
     "node_modules/@eslint/plugin-kit": {
-      "version": "0.6.0",
-      "resolved": "https://registry.npmjs.org/@eslint/plugin-kit/-/plugin-kit-0.6.0.tgz",
-      "integrity": "sha512-bIZEUzOI1jkhviX2cp5vNyXQc6olzb2ohewQubuYlMXZ2Q/XjBO0x0XhGPvc9fjSIiUN0vw+0hq53BJ4eQSJKQ==",
+      "version": "0.6.1",
+      "resolved": "https://registry.npmjs.org/@eslint/plugin-kit/-/plugin-kit-0.6.1.tgz",
+      "integrity": "sha512-iH1B076HoAshH1mLpHMgwdGeTs0CYwL0SPMkGuSebZrwBp16v415e9NZXg2jtrqPVQjf6IANe2Vtlr5KswtcZQ==",
       "dev": true,
       "license": "Apache-2.0",
       "dependencies": {
-        "@eslint/core": "^1.1.0",
+        "@eslint/core": "^1.1.1",
         "levn": "^0.4.1"
       },
       "engines": {
@@ -1745,9 +1755,9 @@
       }
     },
     "node_modules/@exodus/bytes": {
-      "version": "1.14.1",
-      "resolved": "https://registry.npmjs.org/@exodus/bytes/-/bytes-1.14.1.tgz",
-      "integrity": "sha512-OhkBFWI6GcRMUroChZiopRiSp2iAMvEBK47NhJooDqz1RERO4QuZIZnjP63TXX8GAiLABkYmX+fuQsdJ1dd2QQ==",
+      "version": "1.15.0",
+      "resolved": "https://registry.npmjs.org/@exodus/bytes/-/bytes-1.15.0.tgz",
+      "integrity": "sha512-UY0nlA+feH81UGSHv92sLEPLCeZFjXOuHhrIo0HQydScuQc8s0A7kL/UdgwgDq8g8ilksmuoF35YVTNphV2aBQ==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -1763,32 +1773,32 @@
       }
     },
     "node_modules/@floating-ui/core": {
-      "version": "1.7.4",
-      "resolved": "https://registry.npmjs.org/@floating-ui/core/-/core-1.7.4.tgz",
-      "integrity": "sha512-C3HlIdsBxszvm5McXlB8PeOEWfBhcGBTZGkGlWc2U0KFY5IwG5OQEuQ8rq52DZmcHDlPLd+YFBK+cZcytwIFWg==",
+      "version": "1.7.5",
+      "resolved": "https://registry.npmjs.org/@floating-ui/core/-/core-1.7.5.tgz",
+      "integrity": "sha512-1Ih4WTWyw0+lKyFMcBHGbb5U5FtuHJuujoyyr5zTaWS5EYMeT6Jb2AuDeftsCsEuchO+mM2ij5+q9crhydzLhQ==",
       "license": "MIT",
       "dependencies": {
-        "@floating-ui/utils": "^0.2.10"
+        "@floating-ui/utils": "^0.2.11"
       }
     },
     "node_modules/@floating-ui/dom": {
-      "version": "1.7.5",
-      "resolved": "https://registry.npmjs.org/@floating-ui/dom/-/dom-1.7.5.tgz",
-      "integrity": "sha512-N0bD2kIPInNHUHehXhMke1rBGs1dwqvC9O9KYMyyjK7iXt7GAhnro7UlcuYcGdS/yYOlq0MAVgrow8IbWJwyqg==",
+      "version": "1.7.6",
+      "resolved": "https://registry.npmjs.org/@floating-ui/dom/-/dom-1.7.6.tgz",
+      "integrity": "sha512-9gZSAI5XM36880PPMm//9dfiEngYoC6Am2izES1FF406YFsjvyBMmeJ2g4SAju3xWwtuynNRFL2s9hgxpLI5SQ==",
       "license": "MIT",
       "dependencies": {
-        "@floating-ui/core": "^1.7.4",
-        "@floating-ui/utils": "^0.2.10"
+        "@floating-ui/core": "^1.7.5",
+        "@floating-ui/utils": "^0.2.11"
       }
     },
     "node_modules/@floating-ui/react": {
-      "version": "0.27.18",
-      "resolved": "https://registry.npmjs.org/@floating-ui/react/-/react-0.27.18.tgz",
-      "integrity": "sha512-xJWJxvmy3a05j643gQt+pRbht5XnTlGpsEsAPnMi5F5YTOEEJymA90uZKBD8OvIv5XvZ1qi4GcccSlqT3Bq44Q==",
+      "version": "0.27.19",
+      "resolved": "https://registry.npmjs.org/@floating-ui/react/-/react-0.27.19.tgz",
+      "integrity": "sha512-31B8h5mm8YxotlE7/AU/PhNAl8eWxAmjL/v2QOxroDNkTFLk3Uu82u63N3b6TXa4EGJeeZLVcd/9AlNlVqzeog==",
       "license": "MIT",
       "dependencies": {
-        "@floating-ui/react-dom": "^2.1.7",
-        "@floating-ui/utils": "^0.2.10",
+        "@floating-ui/react-dom": "^2.1.8",
+        "@floating-ui/utils": "^0.2.11",
         "tabbable": "^6.0.0"
       },
       "peerDependencies": {
@@ -1797,12 +1807,12 @@
       }
     },
     "node_modules/@floating-ui/react-dom": {
-      "version": "2.1.7",
-      "resolved": "https://registry.npmjs.org/@floating-ui/react-dom/-/react-dom-2.1.7.tgz",
-      "integrity": "sha512-0tLRojf/1Go2JgEVm+3Frg9A3IW8bJgKgdO0BN5RkF//ufuz2joZM63Npau2ff3J6lUVYgDSNzNkR+aH3IVfjg==",
+      "version": "2.1.8",
+      "resolved": "https://registry.npmjs.org/@floating-ui/react-dom/-/react-dom-2.1.8.tgz",
+      "integrity": "sha512-cC52bHwM/n/CxS87FH0yWdngEZrjdtLW/qVruo68qg+prK7ZQ4YGdut2GyDVpoGeAYe/h899rVeOVm6Oi40k2A==",
       "license": "MIT",
       "dependencies": {
-        "@floating-ui/dom": "^1.7.5"
+        "@floating-ui/dom": "^1.7.6"
       },
       "peerDependencies": {
         "react": ">=16.8.0",
@@ -1810,9 +1820,9 @@
       }
     },
     "node_modules/@floating-ui/utils": {
-      "version": "0.2.10",
-      "resolved": "https://registry.npmjs.org/@floating-ui/utils/-/utils-0.2.10.tgz",
-      "integrity": "sha512-aGTxbpbg8/b5JfU1HXSrbH3wXZuLPJcNEcZQFMxLs3oSzgtVu6nFPkbbGGUvBcUjKV2YyB9Wxxabo+HEH9tcRQ==",
+      "version": "0.2.11",
+      "resolved": "https://registry.npmjs.org/@floating-ui/utils/-/utils-0.2.11.tgz",
+      "integrity": "sha512-RiB/yIh78pcIxl6lLMG0CgBXAZ2Y0eVHqMPYugu+9U0AeT6YBeiJpf7lbdJNIugFP5SIjwNRgo4DhR1Qxi26Gg==",
       "license": "MIT"
     },
     "node_modules/@humanfs/core": {
@@ -1868,9 +1878,9 @@
       }
     },
     "node_modules/@iconify-json/material-symbols": {
-      "version": "1.2.58",
-      "resolved": "https://registry.npmjs.org/@iconify-json/material-symbols/-/material-symbols-1.2.58.tgz",
-      "integrity": "sha512-yPDXwGFNZ4Fq6O8NGbMGP7N4lVk8uX+oMwF3rIb6WRv6lID1W+pd9GN/KiM20rxZR36FjrG6TI5+x2LKLHdOnA==",
+      "version": "1.2.63",
+      "resolved": "https://registry.npmjs.org/@iconify-json/material-symbols/-/material-symbols-1.2.63.tgz",
+      "integrity": "sha512-R4PS/l8K6j+dk2P2MoYFLJgfbZ4YDo6XjCOpX6b1tvX+BhiSpSOjc1b6cnb/mvWe+JWBKlt4pcvPNiAijFLPnA==",
       "dev": true,
       "license": "Apache-2.0",
       "dependencies": {
@@ -1996,9 +2006,9 @@
       "license": "MIT"
     },
     "node_modules/@mantine/core": {
-      "version": "8.3.15",
-      "resolved": "https://registry.npmjs.org/@mantine/core/-/core-8.3.15.tgz",
-      "integrity": "sha512-wBn/GogB4x7a2Uj7Ztt3amRaApjED+9XqfE4wyCLh88R7KV55k9vnTdCx+irI/GLOOu9tXNUGm3a4t5sTajwkQ==",
+      "version": "8.3.18",
+      "resolved": "https://registry.npmjs.org/@mantine/core/-/core-8.3.18.tgz",
+      "integrity": "sha512-9tph1lTVogKPjTx02eUxDUOdXacPzK62UuSqb4TdGliI54/Xgxftq0Dfqu6XuhCxn9J5MDJaNiLDvL/1KRkYqA==",
       "license": "MIT",
       "dependencies": {
         "@floating-ui/react": "^0.27.16",
@@ -2009,55 +2019,55 @@
         "type-fest": "^4.41.0"
       },
       "peerDependencies": {
-        "@mantine/hooks": "8.3.15",
+        "@mantine/hooks": "8.3.18",
         "react": "^18.x || ^19.x",
         "react-dom": "^18.x || ^19.x"
       }
     },
     "node_modules/@mantine/dates": {
-      "version": "8.3.15",
-      "resolved": "https://registry.npmjs.org/@mantine/dates/-/dates-8.3.15.tgz",
-      "integrity": "sha512-4WlGHCOAE4in88rQFNlPVl14e7WFWb+YBqxmx4rvAXLj9xLgUxYJO44fva1eIOwNPlTqwbx+GgsEr/HwlcmDMg==",
+      "version": "8.3.18",
+      "resolved": "https://registry.npmjs.org/@mantine/dates/-/dates-8.3.18.tgz",
+      "integrity": "sha512-FHx5teJOhupI0gO2o5evtVYQEdqOjayOkLRhEQfB5Nc5DvcysfPfmNILGkc1Nrp9ZQeQWKLT9qr+CkcCXwHOaw==",
       "license": "MIT",
       "dependencies": {
         "clsx": "^2.1.1"
       },
       "peerDependencies": {
-        "@mantine/core": "8.3.15",
-        "@mantine/hooks": "8.3.15",
+        "@mantine/core": "8.3.18",
+        "@mantine/hooks": "8.3.18",
         "dayjs": ">=1.0.0",
         "react": "^18.x || ^19.x",
         "react-dom": "^18.x || ^19.x"
       }
     },
     "node_modules/@mantine/dropzone": {
-      "version": "8.3.15",
-      "resolved": "https://registry.npmjs.org/@mantine/dropzone/-/dropzone-8.3.15.tgz",
-      "integrity": "sha512-12bx1msHULi4D2/VV2PHTBBSshjax/ogLZEIAewX4tK0vRN3OKtA0qR+lqKhywUW4KYv4Z9Dr6O1LoGKHntrUA==",
+      "version": "8.3.18",
+      "resolved": "https://registry.npmjs.org/@mantine/dropzone/-/dropzone-8.3.18.tgz",
+      "integrity": "sha512-GaYUUl/382R7hl1g6heTCZ5a6T5x6qYPg0oID6ik/J0j7e5+XMZyTH5ITpaqpsBQ09GKKsF5y3iNehpSby8Kew==",
       "license": "MIT",
       "dependencies": {
         "react-dropzone": "15.0.0"
       },
       "peerDependencies": {
-        "@mantine/core": "8.3.15",
-        "@mantine/hooks": "8.3.15",
+        "@mantine/core": "8.3.18",
+        "@mantine/hooks": "8.3.18",
         "react": "^18.x || ^19.x",
         "react-dom": "^18.x || ^19.x"
       }
     },
     "node_modules/@mantine/hooks": {
-      "version": "8.3.15",
-      "resolved": "https://registry.npmjs.org/@mantine/hooks/-/hooks-8.3.15.tgz",
-      "integrity": "sha512-AUSnpUlzttHzJht3CJ1YWi16iy6NWRwtyWO5RLGHHsmiW05DyG0qOPKF8+R5dLHuOCnl3XOu4roI2Y1ku9U04Q==",
+      "version": "8.3.18",
+      "resolved": "https://registry.npmjs.org/@mantine/hooks/-/hooks-8.3.18.tgz",
+      "integrity": "sha512-QoWr9+S8gg5050TQ06aTSxtlpGjYOpIllRbjYYXlRvZeTsUqiTbVfvQROLexu4rEaK+yy9Wwriwl9PMRgbLqPw==",
       "license": "MIT",
       "peerDependencies": {
         "react": "^18.x || ^19.x"
       }
     },
     "node_modules/@maxim_mazurok/gapi.client.discovery-v1": {
-      "version": "0.4.20200806",
-      "resolved": "https://registry.npmjs.org/@maxim_mazurok/gapi.client.discovery-v1/-/gapi.client.discovery-v1-0.4.20200806.tgz",
-      "integrity": "sha512-Jeo/KZqK39DI6ExXHcJ4lqnn1O/wEqboQ6eQ8WnNpu5eJ7wUnX/C5KazOgs1aRhnIB/dVzDe8wm62nmtkMIoaw==",
+      "version": "0.5.20200806",
+      "resolved": "https://registry.npmjs.org/@maxim_mazurok/gapi.client.discovery-v1/-/gapi.client.discovery-v1-0.5.20200806.tgz",
+      "integrity": "sha512-oVq9hnnI5VhAtsx55iJbPz8NRfJtWFpI1kINKeuygzCvsx90b1GQDeN3MDUvhADXiQ7+Izs316cqBnJjoDxCow==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -2066,9 +2076,9 @@
       }
     },
     "node_modules/@maxim_mazurok/gapi.client.drive-v3": {
-      "version": "0.1.20260220",
-      "resolved": "https://registry.npmjs.org/@maxim_mazurok/gapi.client.drive-v3/-/gapi.client.drive-v3-0.1.20260220.tgz",
-      "integrity": "sha512-ySN46cAYsMw6IiZ7a3eKeUqyH++eL4sPIFlgwu33l0mJHLevK4Qd5VxJOgMS8nBp44xKssCCBLRuRq091rp1WA==",
+      "version": "0.2.20260311",
+      "resolved": "https://registry.npmjs.org/@maxim_mazurok/gapi.client.drive-v3/-/gapi.client.drive-v3-0.2.20260311.tgz",
+      "integrity": "sha512-2SVn8bIFZB9pq1JjqBNY/Agebv8gjHdr5k+ippSVsz07eWpl7d0Vxj4huX1O60ev0NDqrIx6a7w6MFFUIKlN6w==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -2086,9 +2096,9 @@
       }
     },
     "node_modules/@mui/core-downloads-tracker": {
-      "version": "7.3.8",
-      "resolved": "https://registry.npmjs.org/@mui/core-downloads-tracker/-/core-downloads-tracker-7.3.8.tgz",
-      "integrity": "sha512-s9UHZo7QJVly7gNArEZkbbsimHqJZhElgBpXIJdehZ4OWXt+CCr0SBDgUCDJnQrqpd1dWK2dLq5rmO4mCBmI3w==",
+      "version": "7.3.9",
+      "resolved": "https://registry.npmjs.org/@mui/core-downloads-tracker/-/core-downloads-tracker-7.3.9.tgz",
+      "integrity": "sha512-MOkOCTfbMJwLshlBCKJ59V2F/uaLYfmKnN76kksj6jlGUVdI25A9Hzs08m+zjBRdLv+sK7Rqdsefe8X7h/6PCw==",
       "license": "MIT",
       "funding": {
         "type": "opencollective",
@@ -2096,9 +2106,9 @@
       }
     },
     "node_modules/@mui/icons-material": {
-      "version": "7.3.8",
-      "resolved": "https://registry.npmjs.org/@mui/icons-material/-/icons-material-7.3.8.tgz",
-      "integrity": "sha512-88sWg/UJc1X82OMO+ISR4E3P58I3BjFVg0qkmDu7OWlN8VijneZD3ylFA+ImxuPjMHW3SHosfSJYy1fztoz0fw==",
+      "version": "7.3.9",
+      "resolved": "https://registry.npmjs.org/@mui/icons-material/-/icons-material-7.3.9.tgz",
+      "integrity": "sha512-BT+zPJXss8Hg/oEMRmHl17Q97bPACG4ufFSfGEdhiE96jOyR5Dz1ty7ZWt1fVGR0y1p+sSgEwQT/MNZQmoWDCw==",
       "license": "MIT",
       "dependencies": {
         "@babel/runtime": "^7.28.6"
@@ -2111,7 +2121,7 @@
         "url": "https://opencollective.com/mui-org"
       },
       "peerDependencies": {
-        "@mui/material": "^7.3.8",
+        "@mui/material": "^7.3.9",
         "@types/react": "^17.0.0 || ^18.0.0 || ^19.0.0",
         "react": "^17.0.0 || ^18.0.0 || ^19.0.0"
       },
@@ -2122,16 +2132,16 @@
       }
     },
     "node_modules/@mui/material": {
-      "version": "7.3.8",
-      "resolved": "https://registry.npmjs.org/@mui/material/-/material-7.3.8.tgz",
-      "integrity": "sha512-QKd1RhDXE1hf2sQDNayA9ic9jGkEgvZOf0tTkJxlBPG8ns8aS4rS8WwYURw2x5y3739p0HauUXX9WbH7UufFLw==",
+      "version": "7.3.9",
+      "resolved": "https://registry.npmjs.org/@mui/material/-/material-7.3.9.tgz",
+      "integrity": "sha512-I8yO3t4T0y7bvDiR1qhIN6iBWZOTBfVOnmLlM7K6h3dx5YX2a7rnkuXzc2UkZaqhxY9NgTnEbdPlokR1RxCNRQ==",
       "license": "MIT",
       "dependencies": {
         "@babel/runtime": "^7.28.6",
-        "@mui/core-downloads-tracker": "^7.3.8",
-        "@mui/system": "^7.3.8",
-        "@mui/types": "^7.4.11",
-        "@mui/utils": "^7.3.8",
+        "@mui/core-downloads-tracker": "^7.3.9",
+        "@mui/system": "^7.3.9",
+        "@mui/types": "^7.4.12",
+        "@mui/utils": "^7.3.9",
         "@popperjs/core": "^2.11.8",
         "@types/react-transition-group": "^4.4.12",
         "clsx": "^2.1.1",
@@ -2150,7 +2160,7 @@
       "peerDependencies": {
         "@emotion/react": "^11.5.0",
         "@emotion/styled": "^11.3.0",
-        "@mui/material-pigment-css": "^7.3.8",
+        "@mui/material-pigment-css": "^7.3.9",
         "@types/react": "^17.0.0 || ^18.0.0 || ^19.0.0",
         "react": "^17.0.0 || ^18.0.0 || ^19.0.0",
         "react-dom": "^17.0.0 || ^18.0.0 || ^19.0.0"
@@ -2171,13 +2181,13 @@
       }
     },
     "node_modules/@mui/private-theming": {
-      "version": "7.3.8",
-      "resolved": "https://registry.npmjs.org/@mui/private-theming/-/private-theming-7.3.8.tgz",
-      "integrity": "sha512-du5dlPZ9XL3xW2apHoGDXBI+QLtyVJGrXNCfcNYfP/ojkz1RQ0rRV6VG9Rkm1DqEFRG8mjjTL7zmE1Bvn1eR4A==",
+      "version": "7.3.9",
+      "resolved": "https://registry.npmjs.org/@mui/private-theming/-/private-theming-7.3.9.tgz",
+      "integrity": "sha512-ErIyRQvsiQEq7Yvcvfw9UDHngaqjMy9P3JDPnRAaKG5qhpl2C4tX/W1S4zJvpu+feihmZJStjIyvnv6KDbIrlw==",
       "license": "MIT",
       "dependencies": {
         "@babel/runtime": "^7.28.6",
-        "@mui/utils": "^7.3.8",
+        "@mui/utils": "^7.3.9",
         "prop-types": "^15.8.1"
       },
       "engines": {
@@ -2198,9 +2208,9 @@
       }
     },
     "node_modules/@mui/styled-engine": {
-      "version": "7.3.8",
-      "resolved": "https://registry.npmjs.org/@mui/styled-engine/-/styled-engine-7.3.8.tgz",
-      "integrity": "sha512-JHAeXQzS0tJ+Fq3C6J4TVDsW+yKhO4uuxuiLaopNStJeQYBIUCXpKYyUCcgXym4AmhbznQnv9RlHywSH6b0FOg==",
+      "version": "7.3.9",
+      "resolved": "https://registry.npmjs.org/@mui/styled-engine/-/styled-engine-7.3.9.tgz",
+      "integrity": "sha512-JqujWt5bX4okjUPGpVof/7pvgClqh7HvIbsIBIOOlCh2u3wG/Bwp4+E1bc1dXSwkrkp9WUAoNdI5HEC+5HKvMw==",
       "license": "MIT",
       "dependencies": {
         "@babel/runtime": "^7.28.6",
@@ -2232,16 +2242,16 @@
       }
     },
     "node_modules/@mui/system": {
-      "version": "7.3.8",
-      "resolved": "https://registry.npmjs.org/@mui/system/-/system-7.3.8.tgz",
-      "integrity": "sha512-hoFRj4Zw2Km8DPWZp/nKG+ao5Jw5LSk2m/e4EGc6M3RRwXKEkMSG4TgtfVJg7dS2homRwtdXSMW+iRO0ZJ4+IA==",
+      "version": "7.3.9",
+      "resolved": "https://registry.npmjs.org/@mui/system/-/system-7.3.9.tgz",
+      "integrity": "sha512-aL1q9am8XpRrSabv9qWf5RHhJICJql34wnrc1nz0MuOglPRYF/liN+c8VqZdTvUn9qg+ZjRVbKf4sJVFfIDtmg==",
       "license": "MIT",
       "dependencies": {
         "@babel/runtime": "^7.28.6",
-        "@mui/private-theming": "^7.3.8",
-        "@mui/styled-engine": "^7.3.8",
-        "@mui/types": "^7.4.11",
-        "@mui/utils": "^7.3.8",
+        "@mui/private-theming": "^7.3.9",
+        "@mui/styled-engine": "^7.3.9",
+        "@mui/types": "^7.4.12",
+        "@mui/utils": "^7.3.9",
         "clsx": "^2.1.1",
         "csstype": "^3.2.3",
         "prop-types": "^15.8.1"
@@ -2272,9 +2282,9 @@
       }
     },
     "node_modules/@mui/types": {
-      "version": "7.4.11",
-      "resolved": "https://registry.npmjs.org/@mui/types/-/types-7.4.11.tgz",
-      "integrity": "sha512-fZ2xO9D08IKOxO2oUBi1nnVKH6oJUD+64cnv4YAaFoC0E5+i1+S5AHbNqqvZlYYsbPEQ6qEVwuBqY3jl5W4G+Q==",
+      "version": "7.4.12",
+      "resolved": "https://registry.npmjs.org/@mui/types/-/types-7.4.12.tgz",
+      "integrity": "sha512-iKNAF2u9PzSIj40CjvKJWxFXJo122jXVdrmdh0hMYd+FR+NuJMkr/L88XwWLCRiJ5P1j+uyac25+Kp6YC4hu6w==",
       "license": "MIT",
       "dependencies": {
         "@babel/runtime": "^7.28.6"
@@ -2289,13 +2299,13 @@
       }
     },
     "node_modules/@mui/utils": {
-      "version": "7.3.8",
-      "resolved": "https://registry.npmjs.org/@mui/utils/-/utils-7.3.8.tgz",
-      "integrity": "sha512-kZRcE2620CBGr+XI8YMmwPj6WIPwSF7uMJjvSfqd8zXVvlz0MCJbzRRUGNf8NgflCLthdji2DdS643TeyJ3+nA==",
+      "version": "7.3.9",
+      "resolved": "https://registry.npmjs.org/@mui/utils/-/utils-7.3.9.tgz",
+      "integrity": "sha512-U6SdZaGbfb65fqTsH3V5oJdFj9uYwyLE2WVuNvmbggTSDBb8QHrFsqY8BN3taK9t3yJ8/BPHD/kNvLNyjwM7Yw==",
       "license": "MIT",
       "dependencies": {
         "@babel/runtime": "^7.28.6",
-        "@mui/types": "^7.4.11",
+        "@mui/types": "^7.4.12",
         "@types/prop-types": "^15.7.15",
         "clsx": "^2.1.1",
         "prop-types": "^15.8.1",
@@ -2319,9 +2329,9 @@
       }
     },
     "node_modules/@napi-rs/canvas": {
-      "version": "0.1.95",
-      "resolved": "https://registry.npmjs.org/@napi-rs/canvas/-/canvas-0.1.95.tgz",
-      "integrity": "sha512-lkg23ge+rgyhgUwXmlbkPEhuhHq/hUi/gXKH+4I7vO+lJrbNfEYcQdJLIGjKyXLQzgFiiyDAwh5vAe/tITAE+w==",
+      "version": "0.1.97",
+      "resolved": "https://registry.npmjs.org/@napi-rs/canvas/-/canvas-0.1.97.tgz",
+      "integrity": "sha512-8cFniXvrIEnVwuNSRCW9wirRZbHvrD3JVujdS2P5n5xiJZNZMOZcfOvJ1pb66c7jXMKHHglJEDVJGbm8XWFcXQ==",
       "license": "MIT",
       "optional": true,
       "workspaces": [
@@ -2335,23 +2345,23 @@
         "url": "https://github.com/sponsors/Brooooooklyn"
       },
       "optionalDependencies": {
-        "@napi-rs/canvas-android-arm64": "0.1.95",
-        "@napi-rs/canvas-darwin-arm64": "0.1.95",
-        "@napi-rs/canvas-darwin-x64": "0.1.95",
-        "@napi-rs/canvas-linux-arm-gnueabihf": "0.1.95",
-        "@napi-rs/canvas-linux-arm64-gnu": "0.1.95",
-        "@napi-rs/canvas-linux-arm64-musl": "0.1.95",
-        "@napi-rs/canvas-linux-riscv64-gnu": "0.1.95",
-        "@napi-rs/canvas-linux-x64-gnu": "0.1.95",
-        "@napi-rs/canvas-linux-x64-musl": "0.1.95",
-        "@napi-rs/canvas-win32-arm64-msvc": "0.1.95",
-        "@napi-rs/canvas-win32-x64-msvc": "0.1.95"
+        "@napi-rs/canvas-android-arm64": "0.1.97",
+        "@napi-rs/canvas-darwin-arm64": "0.1.97",
+        "@napi-rs/canvas-darwin-x64": "0.1.97",
+        "@napi-rs/canvas-linux-arm-gnueabihf": "0.1.97",
+        "@napi-rs/canvas-linux-arm64-gnu": "0.1.97",
+        "@napi-rs/canvas-linux-arm64-musl": "0.1.97",
+        "@napi-rs/canvas-linux-riscv64-gnu": "0.1.97",
+        "@napi-rs/canvas-linux-x64-gnu": "0.1.97",
+        "@napi-rs/canvas-linux-x64-musl": "0.1.97",
+        "@napi-rs/canvas-win32-arm64-msvc": "0.1.97",
+        "@napi-rs/canvas-win32-x64-msvc": "0.1.97"
       }
     },
     "node_modules/@napi-rs/canvas-android-arm64": {
-      "version": "0.1.95",
-      "resolved": "https://registry.npmjs.org/@napi-rs/canvas-android-arm64/-/canvas-android-arm64-0.1.95.tgz",
-      "integrity": "sha512-SqTh0wsYbetckMXEvHqmR7HKRJujVf1sYv1xdlhkifg6TlCSysz1opa49LlS3+xWuazcQcfRfmhA07HxxxGsAA==",
+      "version": "0.1.97",
+      "resolved": "https://registry.npmjs.org/@napi-rs/canvas-android-arm64/-/canvas-android-arm64-0.1.97.tgz",
+      "integrity": "sha512-V1c/WVw+NzH8vk7ZK/O8/nyBSCQimU8sfMsB/9qeSvdkGKNU7+mxy/bIF0gTgeBFmHpj30S4E9WHMSrxXGQuVQ==",
       "cpu": [
         "arm64"
       ],
@@ -2369,9 +2379,9 @@
       }
     },
     "node_modules/@napi-rs/canvas-darwin-arm64": {
-      "version": "0.1.95",
-      "resolved": "https://registry.npmjs.org/@napi-rs/canvas-darwin-arm64/-/canvas-darwin-arm64-0.1.95.tgz",
-      "integrity": "sha512-F7jT0Syu+B9DGBUBcMk3qCRIxAWiDXmvEjamwbYfbZl7asI1pmXZUnCOoIu49Wt0RNooToYfRDxU9omD6t5Xuw==",
+      "version": "0.1.97",
+      "resolved": "https://registry.npmjs.org/@napi-rs/canvas-darwin-arm64/-/canvas-darwin-arm64-0.1.97.tgz",
+      "integrity": "sha512-ok+SCEF4YejcxuJ9Rm+WWunHHpf2HmiPxfz6z1a/NFQECGXtsY7A4B8XocK1LmT1D7P174MzwPF9Wy3AUAwEPw==",
       "cpu": [
         "arm64"
       ],
@@ -2389,9 +2399,9 @@
       }
     },
     "node_modules/@napi-rs/canvas-darwin-x64": {
-      "version": "0.1.95",
-      "resolved": "https://registry.npmjs.org/@napi-rs/canvas-darwin-x64/-/canvas-darwin-x64-0.1.95.tgz",
-      "integrity": "sha512-54eb2Ho15RDjYGXO/harjRznBrAvu+j5nQ85Z4Qd6Qg3slR8/Ja+Yvvy9G4yo7rdX6NR9GPkZeSTf2UcKXwaXw==",
+      "version": "0.1.97",
+      "resolved": "https://registry.npmjs.org/@napi-rs/canvas-darwin-x64/-/canvas-darwin-x64-0.1.97.tgz",
+      "integrity": "sha512-PUP6e6/UGlclUvAQNnuXCcnkpdUou6VYZfQOQxExLp86epOylmiwLkqXIvpFmjoTEDmPmXrI+coL/9EFU1gKPA==",
       "cpu": [
         "x64"
       ],
@@ -2409,9 +2419,9 @@
       }
     },
     "node_modules/@napi-rs/canvas-linux-arm-gnueabihf": {
-      "version": "0.1.95",
-      "resolved": "https://registry.npmjs.org/@napi-rs/canvas-linux-arm-gnueabihf/-/canvas-linux-arm-gnueabihf-0.1.95.tgz",
-      "integrity": "sha512-hYaLCSLx5bmbnclzQc3ado3PgZ66blJWzjXp0wJmdwpr/kH+Mwhj6vuytJIomgksyJoCdIqIa4N6aiqBGJtJ5Q==",
+      "version": "0.1.97",
+      "resolved": "https://registry.npmjs.org/@napi-rs/canvas-linux-arm-gnueabihf/-/canvas-linux-arm-gnueabihf-0.1.97.tgz",
+      "integrity": "sha512-XyXH2L/cic8eTNtbrXCcvqHtMX/nEOxN18+7rMrAM2XtLYC/EB5s0wnO1FsLMWmK+04ZSLN9FBGipo7kpIkcOw==",
       "cpu": [
         "arm"
       ],
@@ -2429,9 +2439,9 @@
       }
     },
     "node_modules/@napi-rs/canvas-linux-arm64-gnu": {
-      "version": "0.1.95",
-      "resolved": "https://registry.npmjs.org/@napi-rs/canvas-linux-arm64-gnu/-/canvas-linux-arm64-gnu-0.1.95.tgz",
-      "integrity": "sha512-J7VipONahKsmScPZsipHVQBqpbZx4favaD8/enWzzlGcjiwycOoymL7f4tNeqdjK0su19bDOUt6mjp9gsPWYlw==",
+      "version": "0.1.97",
+      "resolved": "https://registry.npmjs.org/@napi-rs/canvas-linux-arm64-gnu/-/canvas-linux-arm64-gnu-0.1.97.tgz",
+      "integrity": "sha512-Kuq/M3djq0K8ktgz6nPlK7Ne5d4uWeDxPpyKWOjWDK2RIOhHVtLtyLiJw2fuldw7Vn4mhw05EZXCEr4Q76rs9w==",
       "cpu": [
         "arm64"
       ],
@@ -2449,9 +2459,9 @@
       }
     },
     "node_modules/@napi-rs/canvas-linux-arm64-musl": {
-      "version": "0.1.95",
-      "resolved": "https://registry.npmjs.org/@napi-rs/canvas-linux-arm64-musl/-/canvas-linux-arm64-musl-0.1.95.tgz",
-      "integrity": "sha512-PXy0UT1J/8MPG8UAkWp6Fd51ZtIZINFzIjGH909JjQrtCuJf3X6nanHYdz1A+Wq9o4aoPAw1YEUpFS1lelsVlg==",
+      "version": "0.1.97",
+      "resolved": "https://registry.npmjs.org/@napi-rs/canvas-linux-arm64-musl/-/canvas-linux-arm64-musl-0.1.97.tgz",
+      "integrity": "sha512-kKmSkQVnWeqg7qdsiXvYxKhAFuHz3tkBjW/zyQv5YKUPhotpaVhpBGv5LqCngzyuRV85SXoe+OFj+Tv0a0QXkQ==",
       "cpu": [
         "arm64"
       ],
@@ -2469,9 +2479,9 @@
       }
     },
     "node_modules/@napi-rs/canvas-linux-riscv64-gnu": {
-      "version": "0.1.95",
-      "resolved": "https://registry.npmjs.org/@napi-rs/canvas-linux-riscv64-gnu/-/canvas-linux-riscv64-gnu-0.1.95.tgz",
-      "integrity": "sha512-2IzCkW2RHRdcgF9W5/plHvYFpc6uikyjMb5SxjqmNxfyDFz9/HB89yhi8YQo0SNqrGRI7yBVDec7Pt+uMyRWsg==",
+      "version": "0.1.97",
+      "resolved": "https://registry.npmjs.org/@napi-rs/canvas-linux-riscv64-gnu/-/canvas-linux-riscv64-gnu-0.1.97.tgz",
+      "integrity": "sha512-Jc7I3A51jnEOIAXeLsN/M/+Z28LUeakcsXs07FLq9prXc0eYOtVwsDEv913Gr+06IRo34gJJVgT0TXvmz+N2VA==",
       "cpu": [
         "riscv64"
       ],
@@ -2489,9 +2499,9 @@
       }
     },
     "node_modules/@napi-rs/canvas-linux-x64-gnu": {
-      "version": "0.1.95",
-      "resolved": "https://registry.npmjs.org/@napi-rs/canvas-linux-x64-gnu/-/canvas-linux-x64-gnu-0.1.95.tgz",
-      "integrity": "sha512-OV/ol/OtcUr4qDhQg8G7SdViZX8XyQeKpPsVv/j3+7U178FGoU4M+yIocdVo1ih/A8GQ63+LjF4jDoEjaVU8Pw==",
+      "version": "0.1.97",
+      "resolved": "https://registry.npmjs.org/@napi-rs/canvas-linux-x64-gnu/-/canvas-linux-x64-gnu-0.1.97.tgz",
+      "integrity": "sha512-iDUBe7AilfuBSRbSa8/IGX38Mf+iCSBqoVKLSQ5XaY2JLOaqz1TVyPFEyIck7wT6mRQhQt5sN6ogfjIDfi74tg==",
       "cpu": [
         "x64"
       ],
@@ -2509,9 +2519,9 @@
       }
     },
     "node_modules/@napi-rs/canvas-linux-x64-musl": {
-      "version": "0.1.95",
-      "resolved": "https://registry.npmjs.org/@napi-rs/canvas-linux-x64-musl/-/canvas-linux-x64-musl-0.1.95.tgz",
-      "integrity": "sha512-Z5KzqBK/XzPz5+SFHKz7yKqClEQ8pOiEDdgk5SlphBLVNb8JFIJkxhtJKSvnJyHh2rjVgiFmvtJzMF0gNwwKyQ==",
+      "version": "0.1.97",
+      "resolved": "https://registry.npmjs.org/@napi-rs/canvas-linux-x64-musl/-/canvas-linux-x64-musl-0.1.97.tgz",
+      "integrity": "sha512-AKLFd/v0Z5fvgqBDqhvqtAdx+fHMJ5t9JcUNKq4FIZ5WH+iegGm8HPdj00NFlCSnm83Fp3Ln8I2f7uq1aIiWaA==",
       "cpu": [
         "x64"
       ],
@@ -2529,9 +2539,9 @@
       }
     },
     "node_modules/@napi-rs/canvas-win32-arm64-msvc": {
-      "version": "0.1.95",
-      "resolved": "https://registry.npmjs.org/@napi-rs/canvas-win32-arm64-msvc/-/canvas-win32-arm64-msvc-0.1.95.tgz",
-      "integrity": "sha512-aj0YbRpe8qVJ4OzMsK7NfNQePgcf9zkGFzNZ9mSuaxXzhpLHmlF2GivNdCdNOg8WzA/NxV6IU4c5XkXadUMLeA==",
+      "version": "0.1.97",
+      "resolved": "https://registry.npmjs.org/@napi-rs/canvas-win32-arm64-msvc/-/canvas-win32-arm64-msvc-0.1.97.tgz",
+      "integrity": "sha512-u883Yr6A6fO7Vpsy9YE4FVCIxzzo5sO+7pIUjjoDLjS3vQaNMkVzx5bdIpEL+ob+gU88WDK4VcxYMZ6nmnoX9A==",
       "cpu": [
         "arm64"
       ],
@@ -2549,9 +2559,9 @@
       }
     },
     "node_modules/@napi-rs/canvas-win32-x64-msvc": {
-      "version": "0.1.95",
-      "resolved": "https://registry.npmjs.org/@napi-rs/canvas-win32-x64-msvc/-/canvas-win32-x64-msvc-0.1.95.tgz",
-      "integrity": "sha512-GA8leTTCfdjuHi8reICTIxU0081PhXvl3lzIniLUjeLACx9GubUiyzkwFb+oyeKLS5IAGZFLKnzAf4wm2epRlA==",
+      "version": "0.1.97",
+      "resolved": "https://registry.npmjs.org/@napi-rs/canvas-win32-x64-msvc/-/canvas-win32-x64-msvc-0.1.97.tgz",
+      "integrity": "sha512-sWtD2EE3fV0IzN+iiQUqr/Q1SwqWhs2O1FKItFlxtdDkikpEj5g7DKQpY3x55H/MAOnL8iomnlk3mcEeGiUMoQ==",
       "cpu": [
         "x64"
       ],
@@ -2677,12 +2687,12 @@
       }
     },
     "node_modules/@opentelemetry/resources": {
-      "version": "2.5.1",
-      "resolved": "https://registry.npmjs.org/@opentelemetry/resources/-/resources-2.5.1.tgz",
-      "integrity": "sha512-BViBCdE/GuXRlp9k7nS1w6wJvY5fnFX5XvuEtWsTAOQFIO89Eru7lGW3WbfbxtCuZ/GbrJfAziXG0w0dpxL7eQ==",
+      "version": "2.6.0",
+      "resolved": "https://registry.npmjs.org/@opentelemetry/resources/-/resources-2.6.0.tgz",
+      "integrity": "sha512-D4y/+OGe3JSuYUCBxtH5T9DSAWNcvCb/nQWIga8HNtXTVPQn59j0nTBAgaAXxUVBDl40mG3Tc76b46wPlZaiJQ==",
       "license": "Apache-2.0",
       "dependencies": {
-        "@opentelemetry/core": "2.5.1",
+        "@opentelemetry/core": "2.6.0",
         "@opentelemetry/semantic-conventions": "^1.29.0"
       },
       "engines": {
@@ -2693,9 +2703,9 @@
       }
     },
     "node_modules/@opentelemetry/resources/node_modules/@opentelemetry/core": {
-      "version": "2.5.1",
-      "resolved": "https://registry.npmjs.org/@opentelemetry/core/-/core-2.5.1.tgz",
-      "integrity": "sha512-Dwlc+3HAZqpgTYq0MUyZABjFkcrKTePwuiFVLjahGD8cx3enqihmpAmdgNFO1R4m/sIe5afjJrA25Prqy4NXlA==",
+      "version": "2.6.0",
+      "resolved": "https://registry.npmjs.org/@opentelemetry/core/-/core-2.6.0.tgz",
+      "integrity": "sha512-HLM1v2cbZ4TgYN6KEOj+Bbj8rAKriOdkF9Ed3tG25FoprSiQl7kYc+RRT6fUZGOvx0oMi5U67GoFdT+XUn8zEg==",
       "license": "Apache-2.0",
       "dependencies": {
         "@opentelemetry/semantic-conventions": "^1.29.0"
@@ -2806,9 +2816,9 @@
       }
     },
     "node_modules/@opentelemetry/semantic-conventions": {
-      "version": "1.39.0",
-      "resolved": "https://registry.npmjs.org/@opentelemetry/semantic-conventions/-/semantic-conventions-1.39.0.tgz",
-      "integrity": "sha512-R5R9tb2AXs2IRLNKLBJDynhkfmx7mX0vi8NkhZb3gUkPWHn6HXk5J8iQ/dql0U3ApfWym4kXXmBDRGO+oeOfjg==",
+      "version": "1.40.0",
+      "resolved": "https://registry.npmjs.org/@opentelemetry/semantic-conventions/-/semantic-conventions-1.40.0.tgz",
+      "integrity": "sha512-cifvXDhcqMwwTlTK04GBNeIe7yyo28Mfby85QXFe1Yk8nmi36Ab/5UQwptOx84SsoGNRg+EVSjwzfSZMy6pmlw==",
       "license": "Apache-2.0",
       "engines": {
         "node": ">=14"
@@ -2870,9 +2880,9 @@
       }
     },
     "node_modules/@posthog/core": {
-      "version": "1.23.1",
-      "resolved": "https://registry.npmjs.org/@posthog/core/-/core-1.23.1.tgz",
-      "integrity": "sha512-GViD5mOv/mcbZcyzz3z9CS0R79JzxVaqEz4sP5Dsea178M/j3ZWe6gaHDZB9yuyGfcmIMQ/8K14yv+7QrK4sQQ==",
+      "version": "1.24.1",
+      "resolved": "https://registry.npmjs.org/@posthog/core/-/core-1.24.1.tgz",
+      "integrity": "sha512-e8AciAnc6MRFws89ux8lJKFAaI03yEon0ASDoUO7yS91FVqbUGXYekObUUR3LHplcg+pmyiJBI0jolY0SFbGRA==",
       "license": "MIT",
       "dependencies": {
         "cross-spawn": "^7.0.6"
@@ -2895,9 +2905,9 @@
       }
     },
     "node_modules/@posthog/types": {
-      "version": "1.354.0",
-      "resolved": "https://registry.npmjs.org/@posthog/types/-/types-1.354.0.tgz",
-      "integrity": "sha512-sfH1PiThX1YWkrZSls6zMuZcJWnvboCnZEJ3Z/OI8WgBmLDJfQpficbuLM3tgSLIchI22TPAkpwdT987iW6XIA==",
+      "version": "1.363.3",
+      "resolved": "https://registry.npmjs.org/@posthog/types/-/types-1.363.3.tgz",
+      "integrity": "sha512-Wslj6BrDwIEkqoahJFE0DbqgoGsB/F9BC3XtzBQdUzr04XhVNriGQ7/lves9eCFwrpSiOHv/5xfSShRwiP3ciA==",
       "license": "MIT"
     },
     "node_modules/@protobufjs/aspromise": {
@@ -3074,16 +3084,16 @@
       }
     },
     "node_modules/@rolldown/pluginutils": {
-      "version": "1.0.0-rc.2",
-      "resolved": "https://registry.npmjs.org/@rolldown/pluginutils/-/pluginutils-1.0.0-rc.2.tgz",
-      "integrity": "sha512-izyXV/v+cHiRfozX62W9htOAvwMo4/bXKDrQ+vom1L1qRuexPock/7VZDAhnpHCLNejd3NJ6hiab+tO0D44Rgw==",
+      "version": "1.0.0-rc.7",
+      "resolved": "https://registry.npmjs.org/@rolldown/pluginutils/-/pluginutils-1.0.0-rc.7.tgz",
+      "integrity": "sha512-qujRfC8sFVInYSPPMLQByRh7zhwkGFS4+tyMQ83srV1qrxL4g8E2tyxVVyxd0+8QeBM1mIk9KbWxkegRr76XzA==",
       "dev": true,
       "license": "MIT"
     },
     "node_modules/@rollup/rollup-android-arm-eabi": {
-      "version": "4.59.0",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm-eabi/-/rollup-android-arm-eabi-4.59.0.tgz",
-      "integrity": "sha512-upnNBkA6ZH2VKGcBj9Fyl9IGNPULcjXRlg0LLeaioQWueH30p6IXtJEbKAgvyv+mJaMxSm1l6xwDXYjpEMiLMg==",
+      "version": "4.60.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm-eabi/-/rollup-android-arm-eabi-4.60.0.tgz",
+      "integrity": "sha512-WOhNW9K8bR3kf4zLxbfg6Pxu2ybOUbB2AjMDHSQx86LIF4rH4Ft7vmMwNt0loO0eonglSNy4cpD3MKXXKQu0/A==",
       "cpu": [
         "arm"
       ],
@@ -3095,9 +3105,9 @@
       ]
     },
     "node_modules/@rollup/rollup-android-arm64": {
-      "version": "4.59.0",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm64/-/rollup-android-arm64-4.59.0.tgz",
-      "integrity": "sha512-hZ+Zxj3SySm4A/DylsDKZAeVg0mvi++0PYVceVyX7hemkw7OreKdCvW2oQ3T1FMZvCaQXqOTHb8qmBShoqk69Q==",
+      "version": "4.60.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm64/-/rollup-android-arm64-4.60.0.tgz",
+      "integrity": "sha512-u6JHLll5QKRvjciE78bQXDmqRqNs5M/3GVqZeMwvmjaNODJih/WIrJlFVEihvV0MiYFmd+ZyPr9wxOVbPAG2Iw==",
       "cpu": [
         "arm64"
       ],
@@ -3109,9 +3119,9 @@
       ]
     },
     "node_modules/@rollup/rollup-darwin-arm64": {
-      "version": "4.59.0",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-arm64/-/rollup-darwin-arm64-4.59.0.tgz",
-      "integrity": "sha512-W2Psnbh1J8ZJw0xKAd8zdNgF9HRLkdWwwdWqubSVk0pUuQkoHnv7rx4GiF9rT4t5DIZGAsConRE3AxCdJ4m8rg==",
+      "version": "4.60.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-arm64/-/rollup-darwin-arm64-4.60.0.tgz",
+      "integrity": "sha512-qEF7CsKKzSRc20Ciu2Zw1wRrBz4g56F7r/vRwY430UPp/nt1x21Q/fpJ9N5l47WWvJlkNCPJz3QRVw008fi7yA==",
       "cpu": [
         "arm64"
       ],
@@ -3123,9 +3133,9 @@
       ]
     },
     "node_modules/@rollup/rollup-darwin-x64": {
-      "version": "4.59.0",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-x64/-/rollup-darwin-x64-4.59.0.tgz",
-      "integrity": "sha512-ZW2KkwlS4lwTv7ZVsYDiARfFCnSGhzYPdiOU4IM2fDbL+QGlyAbjgSFuqNRbSthybLbIJ915UtZBtmuLrQAT/w==",
+      "version": "4.60.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-x64/-/rollup-darwin-x64-4.60.0.tgz",
+      "integrity": "sha512-WADYozJ4QCnXCH4wPB+3FuGmDPoFseVCUrANmA5LWwGmC6FL14BWC7pcq+FstOZv3baGX65tZ378uT6WG8ynTw==",
       "cpu": [
         "x64"
       ],
@@ -3137,9 +3147,9 @@
       ]
     },
     "node_modules/@rollup/rollup-freebsd-arm64": {
-      "version": "4.59.0",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-freebsd-arm64/-/rollup-freebsd-arm64-4.59.0.tgz",
-      "integrity": "sha512-EsKaJ5ytAu9jI3lonzn3BgG8iRBjV4LxZexygcQbpiU0wU0ATxhNVEpXKfUa0pS05gTcSDMKpn3Sx+QB9RlTTA==",
+      "version": "4.60.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-freebsd-arm64/-/rollup-freebsd-arm64-4.60.0.tgz",
+      "integrity": "sha512-6b8wGHJlDrGeSE3aH5mGNHBjA0TTkxdoNHik5EkvPHCt351XnigA4pS7Wsj/Eo9Y8RBU6f35cjN9SYmCFBtzxw==",
       "cpu": [
         "arm64"
       ],
@@ -3151,9 +3161,9 @@
       ]
     },
     "node_modules/@rollup/rollup-freebsd-x64": {
-      "version": "4.59.0",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-freebsd-x64/-/rollup-freebsd-x64-4.59.0.tgz",
-      "integrity": "sha512-d3DuZi2KzTMjImrxoHIAODUZYoUUMsuUiY4SRRcJy6NJoZ6iIqWnJu9IScV9jXysyGMVuW+KNzZvBLOcpdl3Vg==",
+      "version": "4.60.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-freebsd-x64/-/rollup-freebsd-x64-4.60.0.tgz",
+      "integrity": "sha512-h25Ga0t4jaylMB8M/JKAyrvvfxGRjnPQIR8lnCayyzEjEOx2EJIlIiMbhpWxDRKGKF8jbNH01NnN663dH638mA==",
       "cpu": [
         "x64"
       ],
@@ -3165,9 +3175,9 @@
       ]
     },
     "node_modules/@rollup/rollup-linux-arm-gnueabihf": {
-      "version": "4.59.0",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-gnueabihf/-/rollup-linux-arm-gnueabihf-4.59.0.tgz",
-      "integrity": "sha512-t4ONHboXi/3E0rT6OZl1pKbl2Vgxf9vJfWgmUoCEVQVxhW6Cw/c8I6hbbu7DAvgp82RKiH7TpLwxnJeKv2pbsw==",
+      "version": "4.60.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-gnueabihf/-/rollup-linux-arm-gnueabihf-4.60.0.tgz",
+      "integrity": "sha512-RzeBwv0B3qtVBWtcuABtSuCzToo2IEAIQrcyB/b2zMvBWVbjo8bZDjACUpnaafaxhTw2W+imQbP2BD1usasK4g==",
       "cpu": [
         "arm"
       ],
@@ -3179,9 +3189,9 @@
       ]
     },
     "node_modules/@rollup/rollup-linux-arm-musleabihf": {
-      "version": "4.59.0",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-musleabihf/-/rollup-linux-arm-musleabihf-4.59.0.tgz",
-      "integrity": "sha512-CikFT7aYPA2ufMD086cVORBYGHffBo4K8MQ4uPS/ZnY54GKj36i196u8U+aDVT2LX4eSMbyHtyOh7D7Zvk2VvA==",
+      "version": "4.60.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-musleabihf/-/rollup-linux-arm-musleabihf-4.60.0.tgz",
+      "integrity": "sha512-Sf7zusNI2CIU1HLzuu9Tc5YGAHEZs5Lu7N1ssJG4Tkw6e0MEsN7NdjUDDfGNHy2IU+ENyWT+L2obgWiguWibWQ==",
       "cpu": [
         "arm"
       ],
@@ -3193,9 +3203,9 @@
       ]
     },
     "node_modules/@rollup/rollup-linux-arm64-gnu": {
-      "version": "4.59.0",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-gnu/-/rollup-linux-arm64-gnu-4.59.0.tgz",
-      "integrity": "sha512-jYgUGk5aLd1nUb1CtQ8E+t5JhLc9x5WdBKew9ZgAXg7DBk0ZHErLHdXM24rfX+bKrFe+Xp5YuJo54I5HFjGDAA==",
+      "version": "4.60.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-gnu/-/rollup-linux-arm64-gnu-4.60.0.tgz",
+      "integrity": "sha512-DX2x7CMcrJzsE91q7/O02IJQ5/aLkVtYFryqCjduJhUfGKG6yJV8hxaw8pZa93lLEpPTP/ohdN4wFz7yp/ry9A==",
       "cpu": [
         "arm64"
       ],
@@ -3207,9 +3217,9 @@
       ]
     },
     "node_modules/@rollup/rollup-linux-arm64-musl": {
-      "version": "4.59.0",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-musl/-/rollup-linux-arm64-musl-4.59.0.tgz",
-      "integrity": "sha512-peZRVEdnFWZ5Bh2KeumKG9ty7aCXzzEsHShOZEFiCQlDEepP1dpUl/SrUNXNg13UmZl+gzVDPsiCwnV1uI0RUA==",
+      "version": "4.60.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-musl/-/rollup-linux-arm64-musl-4.60.0.tgz",
+      "integrity": "sha512-09EL+yFVbJZlhcQfShpswwRZ0Rg+z/CsSELFCnPt3iK+iqwGsI4zht3secj5vLEs957QvFFXnzAT0FFPIxSrkQ==",
       "cpu": [
         "arm64"
       ],
@@ -3221,9 +3231,9 @@
       ]
     },
     "node_modules/@rollup/rollup-linux-loong64-gnu": {
-      "version": "4.59.0",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-loong64-gnu/-/rollup-linux-loong64-gnu-4.59.0.tgz",
-      "integrity": "sha512-gbUSW/97f7+r4gHy3Jlup8zDG190AuodsWnNiXErp9mT90iCy9NKKU0Xwx5k8VlRAIV2uU9CsMnEFg/xXaOfXg==",
+      "version": "4.60.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-loong64-gnu/-/rollup-linux-loong64-gnu-4.60.0.tgz",
+      "integrity": "sha512-i9IcCMPr3EXm8EQg5jnja0Zyc1iFxJjZWlb4wr7U2Wx/GrddOuEafxRdMPRYVaXjgbhvqalp6np07hN1w9kAKw==",
       "cpu": [
         "loong64"
       ],
@@ -3235,9 +3245,9 @@
       ]
     },
     "node_modules/@rollup/rollup-linux-loong64-musl": {
-      "version": "4.59.0",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-loong64-musl/-/rollup-linux-loong64-musl-4.59.0.tgz",
-      "integrity": "sha512-yTRONe79E+o0FWFijasoTjtzG9EBedFXJMl888NBEDCDV9I2wGbFFfJQQe63OijbFCUZqxpHz1GzpbtSFikJ4Q==",
+      "version": "4.60.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-loong64-musl/-/rollup-linux-loong64-musl-4.60.0.tgz",
+      "integrity": "sha512-DGzdJK9kyJ+B78MCkWeGnpXJ91tK/iKA6HwHxF4TAlPIY7GXEvMe8hBFRgdrR9Ly4qebR/7gfUs9y2IoaVEyog==",
       "cpu": [
         "loong64"
       ],
@@ -3249,9 +3259,9 @@
       ]
     },
     "node_modules/@rollup/rollup-linux-ppc64-gnu": {
-      "version": "4.59.0",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-ppc64-gnu/-/rollup-linux-ppc64-gnu-4.59.0.tgz",
-      "integrity": "sha512-sw1o3tfyk12k3OEpRddF68a1unZ5VCN7zoTNtSn2KndUE+ea3m3ROOKRCZxEpmT9nsGnogpFP9x6mnLTCaoLkA==",
+      "version": "4.60.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-ppc64-gnu/-/rollup-linux-ppc64-gnu-4.60.0.tgz",
+      "integrity": "sha512-RwpnLsqC8qbS8z1H1AxBA1H6qknR4YpPR9w2XX0vo2Sz10miu57PkNcnHVaZkbqyw/kUWfKMI73jhmfi9BRMUQ==",
       "cpu": [
         "ppc64"
       ],
@@ -3263,9 +3273,9 @@
       ]
     },
     "node_modules/@rollup/rollup-linux-ppc64-musl": {
-      "version": "4.59.0",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-ppc64-musl/-/rollup-linux-ppc64-musl-4.59.0.tgz",
-      "integrity": "sha512-+2kLtQ4xT3AiIxkzFVFXfsmlZiG5FXYW7ZyIIvGA7Bdeuh9Z0aN4hVyXS/G1E9bTP/vqszNIN/pUKCk/BTHsKA==",
+      "version": "4.60.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-ppc64-musl/-/rollup-linux-ppc64-musl-4.60.0.tgz",
+      "integrity": "sha512-Z8pPf54Ly3aqtdWC3G4rFigZgNvd+qJlOE52fmko3KST9SoGfAdSRCwyoyG05q1HrrAblLbk1/PSIV+80/pxLg==",
       "cpu": [
         "ppc64"
       ],
@@ -3277,9 +3287,9 @@
       ]
     },
     "node_modules/@rollup/rollup-linux-riscv64-gnu": {
-      "version": "4.59.0",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-riscv64-gnu/-/rollup-linux-riscv64-gnu-4.59.0.tgz",
-      "integrity": "sha512-NDYMpsXYJJaj+I7UdwIuHHNxXZ/b/N2hR15NyH3m2qAtb/hHPA4g4SuuvrdxetTdndfj9b1WOmy73kcPRoERUg==",
+      "version": "4.60.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-riscv64-gnu/-/rollup-linux-riscv64-gnu-4.60.0.tgz",
+      "integrity": "sha512-3a3qQustp3COCGvnP4SvrMHnPQ9d1vzCakQVRTliaz8cIp/wULGjiGpbcqrkv0WrHTEp8bQD/B3HBjzujVWLOA==",
       "cpu": [
         "riscv64"
       ],
@@ -3291,9 +3301,9 @@
       ]
     },
     "node_modules/@rollup/rollup-linux-riscv64-musl": {
-      "version": "4.59.0",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-riscv64-musl/-/rollup-linux-riscv64-musl-4.59.0.tgz",
-      "integrity": "sha512-nLckB8WOqHIf1bhymk+oHxvM9D3tyPndZH8i8+35p/1YiVoVswPid2yLzgX7ZJP0KQvnkhM4H6QZ5m0LzbyIAg==",
+      "version": "4.60.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-riscv64-musl/-/rollup-linux-riscv64-musl-4.60.0.tgz",
+      "integrity": "sha512-pjZDsVH/1VsghMJ2/kAaxt6dL0psT6ZexQVrijczOf+PeP2BUqTHYejk3l6TlPRydggINOeNRhvpLa0AYpCWSQ==",
       "cpu": [
         "riscv64"
       ],
@@ -3305,9 +3315,9 @@
       ]
     },
     "node_modules/@rollup/rollup-linux-s390x-gnu": {
-      "version": "4.59.0",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-s390x-gnu/-/rollup-linux-s390x-gnu-4.59.0.tgz",
-      "integrity": "sha512-oF87Ie3uAIvORFBpwnCvUzdeYUqi2wY6jRFWJAy1qus/udHFYIkplYRW+wo+GRUP4sKzYdmE1Y3+rY5Gc4ZO+w==",
+      "version": "4.60.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-s390x-gnu/-/rollup-linux-s390x-gnu-4.60.0.tgz",
+      "integrity": "sha512-3ObQs0BhvPgiUVZrN7gqCSvmFuMWvWvsjG5ayJ3Lraqv+2KhOsp+pUbigqbeWqueGIsnn+09HBw27rJ+gYK4VQ==",
       "cpu": [
         "s390x"
       ],
@@ -3319,9 +3329,9 @@
       ]
     },
     "node_modules/@rollup/rollup-linux-x64-gnu": {
-      "version": "4.59.0",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-gnu/-/rollup-linux-x64-gnu-4.59.0.tgz",
-      "integrity": "sha512-3AHmtQq/ppNuUspKAlvA8HtLybkDflkMuLK4DPo77DfthRb71V84/c4MlWJXixZz4uruIH4uaa07IqoAkG64fg==",
+      "version": "4.60.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-gnu/-/rollup-linux-x64-gnu-4.60.0.tgz",
+      "integrity": "sha512-EtylprDtQPdS5rXvAayrNDYoJhIz1/vzN2fEubo3yLE7tfAw+948dO0g4M0vkTVFhKojnF+n6C8bDNe+gDRdTg==",
       "cpu": [
         "x64"
       ],
@@ -3333,9 +3343,9 @@
       ]
     },
     "node_modules/@rollup/rollup-linux-x64-musl": {
-      "version": "4.59.0",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-musl/-/rollup-linux-x64-musl-4.59.0.tgz",
-      "integrity": "sha512-2UdiwS/9cTAx7qIUZB/fWtToJwvt0Vbo0zmnYt7ED35KPg13Q0ym1g442THLC7VyI6JfYTP4PiSOWyoMdV2/xg==",
+      "version": "4.60.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-musl/-/rollup-linux-x64-musl-4.60.0.tgz",
+      "integrity": "sha512-k09oiRCi/bHU9UVFqD17r3eJR9bn03TyKraCrlz5ULFJGdJGi7VOmm9jl44vOJvRJ6P7WuBi/s2A97LxxHGIdw==",
       "cpu": [
         "x64"
       ],
@@ -3347,9 +3357,9 @@
       ]
     },
     "node_modules/@rollup/rollup-openbsd-x64": {
-      "version": "4.59.0",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-openbsd-x64/-/rollup-openbsd-x64-4.59.0.tgz",
-      "integrity": "sha512-M3bLRAVk6GOwFlPTIxVBSYKUaqfLrn8l0psKinkCFxl4lQvOSz8ZrKDz2gxcBwHFpci0B6rttydI4IpS4IS/jQ==",
+      "version": "4.60.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-openbsd-x64/-/rollup-openbsd-x64-4.60.0.tgz",
+      "integrity": "sha512-1o/0/pIhozoSaDJoDcec+IVLbnRtQmHwPV730+AOD29lHEEo4F5BEUB24H0OBdhbBBDwIOSuf7vgg0Ywxdfiiw==",
       "cpu": [
         "x64"
       ],
@@ -3361,9 +3371,9 @@
       ]
     },
     "node_modules/@rollup/rollup-openharmony-arm64": {
-      "version": "4.59.0",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-openharmony-arm64/-/rollup-openharmony-arm64-4.59.0.tgz",
-      "integrity": "sha512-tt9KBJqaqp5i5HUZzoafHZX8b5Q2Fe7UjYERADll83O4fGqJ49O1FsL6LpdzVFQcpwvnyd0i+K/VSwu/o/nWlA==",
+      "version": "4.60.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-openharmony-arm64/-/rollup-openharmony-arm64-4.60.0.tgz",
+      "integrity": "sha512-pESDkos/PDzYwtyzB5p/UoNU/8fJo68vcXM9ZW2V0kjYayj1KaaUfi1NmTUTUpMn4UhU4gTuK8gIaFO4UGuMbA==",
       "cpu": [
         "arm64"
       ],
@@ -3375,9 +3385,9 @@
       ]
     },
     "node_modules/@rollup/rollup-win32-arm64-msvc": {
-      "version": "4.59.0",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-arm64-msvc/-/rollup-win32-arm64-msvc-4.59.0.tgz",
-      "integrity": "sha512-V5B6mG7OrGTwnxaNUzZTDTjDS7F75PO1ae6MJYdiMu60sq0CqN5CVeVsbhPxalupvTX8gXVSU9gq+Rx1/hvu6A==",
+      "version": "4.60.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-arm64-msvc/-/rollup-win32-arm64-msvc-4.60.0.tgz",
+      "integrity": "sha512-hj1wFStD7B1YBeYmvY+lWXZ7ey73YGPcViMShYikqKT1GtstIKQAtfUI6yrzPjAy/O7pO0VLXGmUVWXQMaYgTQ==",
       "cpu": [
         "arm64"
       ],
@@ -3389,9 +3399,9 @@
       ]
     },
     "node_modules/@rollup/rollup-win32-ia32-msvc": {
-      "version": "4.59.0",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-ia32-msvc/-/rollup-win32-ia32-msvc-4.59.0.tgz",
-      "integrity": "sha512-UKFMHPuM9R0iBegwzKF4y0C4J9u8C6MEJgFuXTBerMk7EJ92GFVFYBfOZaSGLu6COf7FxpQNqhNS4c4icUPqxA==",
+      "version": "4.60.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-ia32-msvc/-/rollup-win32-ia32-msvc-4.60.0.tgz",
+      "integrity": "sha512-SyaIPFoxmUPlNDq5EHkTbiKzmSEmq/gOYFI/3HHJ8iS/v1mbugVa7dXUzcJGQfoytp9DJFLhHH4U3/eTy2Bq4w==",
       "cpu": [
         "ia32"
       ],
@@ -3403,9 +3413,9 @@
       ]
     },
     "node_modules/@rollup/rollup-win32-x64-gnu": {
-      "version": "4.59.0",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-x64-gnu/-/rollup-win32-x64-gnu-4.59.0.tgz",
-      "integrity": "sha512-laBkYlSS1n2L8fSo1thDNGrCTQMmxjYY5G0WFWjFFYZkKPjsMBsgJfGf4TLxXrF6RyhI60L8TMOjBMvXiTcxeA==",
+      "version": "4.60.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-x64-gnu/-/rollup-win32-x64-gnu-4.60.0.tgz",
+      "integrity": "sha512-RdcryEfzZr+lAr5kRm2ucN9aVlCCa2QNq4hXelZxb8GG0NJSazq44Z3PCCc8wISRuCVnGs0lQJVX5Vp6fKA+IA==",
       "cpu": [
         "x64"
       ],
@@ -3417,9 +3427,9 @@
       ]
     },
     "node_modules/@rollup/rollup-win32-x64-msvc": {
-      "version": "4.59.0",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-x64-msvc/-/rollup-win32-x64-msvc-4.59.0.tgz",
-      "integrity": "sha512-2HRCml6OztYXyJXAvdDXPKcawukWY2GpR5/nxKp4iBgiO3wcoEGkAaqctIbZcNB6KlUQBIqt8VYkNSj2397EfA==",
+      "version": "4.60.0",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-x64-msvc/-/rollup-win32-x64-msvc-4.60.0.tgz",
+      "integrity": "sha512-PrsWNQ8BuE00O3Xsx3ALh2Df8fAj9+cvvX9AIA6o4KpATR98c9mud4XtDWVvsEuyia5U4tVSTKygawyJkjm60w==",
       "cpu": [
         "x64"
       ],
@@ -3493,9 +3503,9 @@
       }
     },
     "node_modules/@supabase/auth-js": {
-      "version": "2.97.0",
-      "resolved": "https://registry.npmjs.org/@supabase/auth-js/-/auth-js-2.97.0.tgz",
-      "integrity": "sha512-2Og/1lqp+AIavr8qS2X04aSl8RBY06y4LrtIAGxat06XoXYiDxKNQMQzWDAKm1EyZFZVRNH48DO5YvIZ7la5fQ==",
+      "version": "2.100.0",
+      "resolved": "https://registry.npmjs.org/@supabase/auth-js/-/auth-js-2.100.0.tgz",
+      "integrity": "sha512-pdT3ye3UVRN1Cg0wom6BmyY+XTtp5DiJaYnPi6j8ht5i8Lq8kfqxJMJz9GI9YDKk3w1nhGOPnh6Qz5qpyYm+1w==",
       "license": "MIT",
       "dependencies": {
         "tslib": "2.8.1"
@@ -3505,9 +3515,9 @@
       }
     },
     "node_modules/@supabase/functions-js": {
-      "version": "2.97.0",
-      "resolved": "https://registry.npmjs.org/@supabase/functions-js/-/functions-js-2.97.0.tgz",
-      "integrity": "sha512-fSaA0ZeBUS9hMgpGZt5shIZvfs3Mvx2ZdajQT4kv/whubqDBAp3GU5W8iIXy21MRvKmO2NpAj8/Q6y+ZkZyF/w==",
+      "version": "2.100.0",
+      "resolved": "https://registry.npmjs.org/@supabase/functions-js/-/functions-js-2.100.0.tgz",
+      "integrity": "sha512-keLg79RPwP+uiwHuxFPTFgDRxPV46LM4j/swjyR2GKJgWniTVSsgiBHfbIBDcrQwehLepy09b/9QSHUywtKRWQ==",
       "license": "MIT",
       "dependencies": {
         "tslib": "2.8.1"
@@ -3516,10 +3526,16 @@
         "node": ">=20.0.0"
       }
     },
+    "node_modules/@supabase/phoenix": {
+      "version": "0.4.0",
+      "resolved": "https://registry.npmjs.org/@supabase/phoenix/-/phoenix-0.4.0.tgz",
+      "integrity": "sha512-RHSx8bHS02xwfHdAbX5Lpbo6PXbgyf7lTaXTlwtFDPwOIw64NnVRwFAXGojHhjtVYI+PEPNSWwkL90f4agN3bw==",
+      "license": "MIT"
+    },
     "node_modules/@supabase/postgrest-js": {
-      "version": "2.97.0",
-      "resolved": "https://registry.npmjs.org/@supabase/postgrest-js/-/postgrest-js-2.97.0.tgz",
-      "integrity": "sha512-g4Ps0eaxZZurvfv/KGoo2XPZNpyNtjth9aW8eho9LZWM0bUuBtxPZw3ZQ6ERSpEGogshR+XNgwlSPIwcuHCNww==",
+      "version": "2.100.0",
+      "resolved": "https://registry.npmjs.org/@supabase/postgrest-js/-/postgrest-js-2.100.0.tgz",
+      "integrity": "sha512-xYNvNbBJaXOGcrZ44wxwp5830uo1okMHGS8h8dm3u4f0xcZ39yzbryUsubTJW41MG2gbL/6U57cA4Pi6YMZ9pA==",
       "license": "MIT",
       "dependencies": {
         "tslib": "2.8.1"
@@ -3529,12 +3545,12 @@
       }
     },
     "node_modules/@supabase/realtime-js": {
-      "version": "2.97.0",
-      "resolved": "https://registry.npmjs.org/@supabase/realtime-js/-/realtime-js-2.97.0.tgz",
-      "integrity": "sha512-37Jw0NLaFP0CZd7qCan97D1zWutPrTSpgWxAw6Yok59JZoxp4IIKMrPeftJ3LZHmf+ILQOPy3i0pRDHM9FY36Q==",
+      "version": "2.100.0",
+      "resolved": "https://registry.npmjs.org/@supabase/realtime-js/-/realtime-js-2.100.0.tgz",
+      "integrity": "sha512-2AZs00zzEF0HuCKY8grz5eCYlwEfVi5HONLZFoNR6aDfxQivl8zdQYNjyFoqN2MZiVhQHD7u6XV/xHwM8mCEHw==",
       "license": "MIT",
       "dependencies": {
-        "@types/phoenix": "^1.6.6",
+        "@supabase/phoenix": "^0.4.0",
         "@types/ws": "^8.18.1",
         "tslib": "2.8.1",
         "ws": "^8.18.2"
@@ -3544,9 +3560,9 @@
       }
     },
     "node_modules/@supabase/storage-js": {
-      "version": "2.97.0",
-      "resolved": "https://registry.npmjs.org/@supabase/storage-js/-/storage-js-2.97.0.tgz",
-      "integrity": "sha512-9f6NniSBfuMxOWKwEFb+RjJzkfMdJUwv9oHuFJKfe/5VJR8cd90qw68m6Hn0ImGtwG37TUO+QHtoOechxRJ1Yg==",
+      "version": "2.100.0",
+      "resolved": "https://registry.npmjs.org/@supabase/storage-js/-/storage-js-2.100.0.tgz",
+      "integrity": "sha512-d4EeuK6RNIgYNA2MU9kj8lQrLm5AzZ+WwpWjGkii6SADQNIGTC/uiaTRu02XJ5AmFALQfo8fLl9xuCkO6Xw+iQ==",
       "license": "MIT",
       "dependencies": {
         "iceberg-js": "^0.8.1",
@@ -3557,16 +3573,16 @@
       }
     },
     "node_modules/@supabase/supabase-js": {
-      "version": "2.97.0",
-      "resolved": "https://registry.npmjs.org/@supabase/supabase-js/-/supabase-js-2.97.0.tgz",
-      "integrity": "sha512-kTD91rZNO4LvRUHv4x3/4hNmsEd2ofkYhuba2VMUPRVef1RCmnHtm7rIws38Fg0yQnOSZOplQzafn0GSiy6GVg==",
+      "version": "2.100.0",
+      "resolved": "https://registry.npmjs.org/@supabase/supabase-js/-/supabase-js-2.100.0.tgz",
+      "integrity": "sha512-r0tlcukejJXJ1m/2eG/Ya5eYs4W8AC7oZfShpG3+SIo/eIU9uIt76ZeYI1SoUwUmcmzlAbgch+HDZDR/toVQPQ==",
       "license": "MIT",
       "dependencies": {
-        "@supabase/auth-js": "2.97.0",
-        "@supabase/functions-js": "2.97.0",
-        "@supabase/postgrest-js": "2.97.0",
-        "@supabase/realtime-js": "2.97.0",
-        "@supabase/storage-js": "2.97.0"
+        "@supabase/auth-js": "2.100.0",
+        "@supabase/functions-js": "2.100.0",
+        "@supabase/postgrest-js": "2.100.0",
+        "@supabase/realtime-js": "2.100.0",
+        "@supabase/storage-js": "2.100.0"
       },
       "engines": {
         "node": ">=20.0.0"
@@ -3583,9 +3599,9 @@
       }
     },
     "node_modules/@swc/core": {
-      "version": "1.15.13",
-      "resolved": "https://registry.npmjs.org/@swc/core/-/core-1.15.13.tgz",
-      "integrity": "sha512-0l1gl/72PErwUZuavcRpRAQN9uSst+Nk++niC5IX6lmMWpXoScYx3oq/narT64/sKv/eRiPTaAjBFGDEQiWJIw==",
+      "version": "1.15.21",
+      "resolved": "https://registry.npmjs.org/@swc/core/-/core-1.15.21.tgz",
+      "integrity": "sha512-fkk7NJcBscrR3/F8jiqlMptRHP650NxqDnspBMrRe5d8xOoCy9MLL5kOBLFXjFLfMo3KQQHhk+/jUULOMlR1uQ==",
       "dev": true,
       "hasInstallScript": true,
       "license": "Apache-2.0",
@@ -3601,16 +3617,18 @@
         "url": "https://opencollective.com/swc"
       },
       "optionalDependencies": {
-        "@swc/core-darwin-arm64": "1.15.13",
-        "@swc/core-darwin-x64": "1.15.13",
-        "@swc/core-linux-arm-gnueabihf": "1.15.13",
-        "@swc/core-linux-arm64-gnu": "1.15.13",
-        "@swc/core-linux-arm64-musl": "1.15.13",
-        "@swc/core-linux-x64-gnu": "1.15.13",
-        "@swc/core-linux-x64-musl": "1.15.13",
-        "@swc/core-win32-arm64-msvc": "1.15.13",
-        "@swc/core-win32-ia32-msvc": "1.15.13",
-        "@swc/core-win32-x64-msvc": "1.15.13"
+        "@swc/core-darwin-arm64": "1.15.21",
+        "@swc/core-darwin-x64": "1.15.21",
+        "@swc/core-linux-arm-gnueabihf": "1.15.21",
+        "@swc/core-linux-arm64-gnu": "1.15.21",
+        "@swc/core-linux-arm64-musl": "1.15.21",
+        "@swc/core-linux-ppc64-gnu": "1.15.21",
+        "@swc/core-linux-s390x-gnu": "1.15.21",
+        "@swc/core-linux-x64-gnu": "1.15.21",
+        "@swc/core-linux-x64-musl": "1.15.21",
+        "@swc/core-win32-arm64-msvc": "1.15.21",
+        "@swc/core-win32-ia32-msvc": "1.15.21",
+        "@swc/core-win32-x64-msvc": "1.15.21"
       },
       "peerDependencies": {
         "@swc/helpers": ">=0.5.17"
@@ -3622,9 +3640,9 @@
       }
     },
     "node_modules/@swc/core-darwin-arm64": {
-      "version": "1.15.13",
-      "resolved": "https://registry.npmjs.org/@swc/core-darwin-arm64/-/core-darwin-arm64-1.15.13.tgz",
-      "integrity": "sha512-ztXusRuC5NV2w+a6pDhX13CGioMLq8CjX5P4XgVJ21ocqz9t19288Do0y8LklplDtwcEhYGTNdMbkmUT7+lDTg==",
+      "version": "1.15.21",
+      "resolved": "https://registry.npmjs.org/@swc/core-darwin-arm64/-/core-darwin-arm64-1.15.21.tgz",
+      "integrity": "sha512-SA8SFg9dp0qKRH8goWsax6bptFE2EdmPf2YRAQW9WoHGf3XKM1bX0nd5UdwxmC5hXsBUZAYf7xSciCler6/oyA==",
       "cpu": [
         "arm64"
       ],
@@ -3639,9 +3657,9 @@
       }
     },
     "node_modules/@swc/core-darwin-x64": {
-      "version": "1.15.13",
-      "resolved": "https://registry.npmjs.org/@swc/core-darwin-x64/-/core-darwin-x64-1.15.13.tgz",
-      "integrity": "sha512-cVifxQUKhaE7qcO/y9Mq6PEhoyvN9tSLzCnnFZ4EIabFHBuLtDDO6a+vLveOy98hAs5Qu1+bb5Nv0oa1Pihe3Q==",
+      "version": "1.15.21",
+      "resolved": "https://registry.npmjs.org/@swc/core-darwin-x64/-/core-darwin-x64-1.15.21.tgz",
+      "integrity": "sha512-//fOVntgowz9+V90lVsNCtyyrtbHp3jWH6Rch7MXHXbcvbLmbCTmssl5DeedUWLLGiAAW1wksBdqdGYOTjaNLw==",
       "cpu": [
         "x64"
       ],
@@ -3656,9 +3674,9 @@
       }
     },
     "node_modules/@swc/core-linux-arm-gnueabihf": {
-      "version": "1.15.13",
-      "resolved": "https://registry.npmjs.org/@swc/core-linux-arm-gnueabihf/-/core-linux-arm-gnueabihf-1.15.13.tgz",
-      "integrity": "sha512-t+xxEzZ48enl/wGGy7SRYd7kImWQ/+wvVFD7g5JZo234g6/QnIgZ+YdfIyjHB+ZJI3F7a2IQHS7RNjxF29UkWw==",
+      "version": "1.15.21",
+      "resolved": "https://registry.npmjs.org/@swc/core-linux-arm-gnueabihf/-/core-linux-arm-gnueabihf-1.15.21.tgz",
+      "integrity": "sha512-meNI4Sh6h9h8DvIfEc0l5URabYMSuNvyisLmG6vnoYAS43s8ON3NJR8sDHvdP7NJTrLe0q/x2XCn6yL/BeHcZg==",
       "cpu": [
         "arm"
       ],
@@ -3673,9 +3691,9 @@
       }
     },
     "node_modules/@swc/core-linux-arm64-gnu": {
-      "version": "1.15.13",
-      "resolved": "https://registry.npmjs.org/@swc/core-linux-arm64-gnu/-/core-linux-arm64-gnu-1.15.13.tgz",
-      "integrity": "sha512-VndeGvKmTXFn6AGwjy0Kg8i7HccOCE7Jt/vmZwRxGtOfNZM1RLYRQ7MfDLo6T0h1Bq6eYzps3L5Ma4zBmjOnOg==",
+      "version": "1.15.21",
+      "resolved": "https://registry.npmjs.org/@swc/core-linux-arm64-gnu/-/core-linux-arm64-gnu-1.15.21.tgz",
+      "integrity": "sha512-QrXlNQnHeXqU2EzLlnsPoWEh8/GtNJLvfMiPsDhk+ht6Xv8+vhvZ5YZ/BokNWSIZiWPKLAqR0M7T92YF5tmD3g==",
       "cpu": [
         "arm64"
       ],
@@ -3690,9 +3708,9 @@
       }
     },
     "node_modules/@swc/core-linux-arm64-musl": {
-      "version": "1.15.13",
-      "resolved": "https://registry.npmjs.org/@swc/core-linux-arm64-musl/-/core-linux-arm64-musl-1.15.13.tgz",
-      "integrity": "sha512-SmZ9m+XqCB35NddHCctvHFLqPZDAs5j8IgD36GoutufDJmeq2VNfgk5rQoqNqKmAK3Y7iFdEmI76QoHIWiCLyw==",
+      "version": "1.15.21",
+      "resolved": "https://registry.npmjs.org/@swc/core-linux-arm64-musl/-/core-linux-arm64-musl-1.15.21.tgz",
+      "integrity": "sha512-8/yGCMO333ultDaMQivE5CjO6oXDPeeg1IV4sphojPkb0Pv0i6zvcRIkgp60xDB+UxLr6VgHgt+BBgqS959E9g==",
       "cpu": [
         "arm64"
       ],
@@ -3706,10 +3724,44 @@
         "node": ">=10"
       }
     },
+    "node_modules/@swc/core-linux-ppc64-gnu": {
+      "version": "1.15.21",
+      "resolved": "https://registry.npmjs.org/@swc/core-linux-ppc64-gnu/-/core-linux-ppc64-gnu-1.15.21.tgz",
+      "integrity": "sha512-ucW0HzPx0s1dgRvcvuLSPSA/2Kk/VYTv9st8qe1Kc22Gu0Q0rH9+6TcBTmMuNIp0Xs4BPr1uBttmbO1wEGI49Q==",
+      "cpu": [
+        "ppc64"
+      ],
+      "dev": true,
+      "license": "Apache-2.0 AND MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/@swc/core-linux-s390x-gnu": {
+      "version": "1.15.21",
+      "resolved": "https://registry.npmjs.org/@swc/core-linux-s390x-gnu/-/core-linux-s390x-gnu-1.15.21.tgz",
+      "integrity": "sha512-ulTnOGc5I7YRObE/9NreAhQg94QkiR5qNhhcUZ1iFAYjzg/JGAi1ch+s/Ixe61pMIr8bfVrF0NOaB0f8wjaAfA==",
+      "cpu": [
+        "s390x"
+      ],
+      "dev": true,
+      "license": "Apache-2.0 AND MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=10"
+      }
+    },
     "node_modules/@swc/core-linux-x64-gnu": {
-      "version": "1.15.13",
-      "resolved": "https://registry.npmjs.org/@swc/core-linux-x64-gnu/-/core-linux-x64-gnu-1.15.13.tgz",
-      "integrity": "sha512-5rij+vB9a29aNkHq72EXI2ihDZPszJb4zlApJY4aCC/q6utgqFA6CkrfTfIb+O8hxtG3zP5KERETz8mfFK6A0A==",
+      "version": "1.15.21",
+      "resolved": "https://registry.npmjs.org/@swc/core-linux-x64-gnu/-/core-linux-x64-gnu-1.15.21.tgz",
+      "integrity": "sha512-D0RokxtM+cPvSqJIKR6uja4hbD+scI9ezo95mBhfSyLUs9wnPPl26sLp1ZPR/EXRdYm3F3S6RUtVi+8QXhT24Q==",
       "cpu": [
         "x64"
       ],
@@ -3724,9 +3776,9 @@
       }
     },
     "node_modules/@swc/core-linux-x64-musl": {
-      "version": "1.15.13",
-      "resolved": "https://registry.npmjs.org/@swc/core-linux-x64-musl/-/core-linux-x64-musl-1.15.13.tgz",
-      "integrity": "sha512-OlSlaOK9JplQ5qn07WiBLibkOw7iml2++ojEXhhR3rbWrNEKCD7sd8+6wSavsInyFdw4PhLA+Hy6YyDBIE23Yw==",
+      "version": "1.15.21",
+      "resolved": "https://registry.npmjs.org/@swc/core-linux-x64-musl/-/core-linux-x64-musl-1.15.21.tgz",
+      "integrity": "sha512-nER8u7VeRfmU6fMDzl1NQAbbB/G7O2avmvCOwIul1uGkZ2/acbPH+DCL9h5+0yd/coNcxMBTL6NGepIew+7C2w==",
       "cpu": [
         "x64"
       ],
@@ -3741,9 +3793,9 @@
       }
     },
     "node_modules/@swc/core-win32-arm64-msvc": {
-      "version": "1.15.13",
-      "resolved": "https://registry.npmjs.org/@swc/core-win32-arm64-msvc/-/core-win32-arm64-msvc-1.15.13.tgz",
-      "integrity": "sha512-zwQii5YVdsfG8Ti9gIKgBKZg8qMkRZxl+OlYWUT5D93Jl4NuNBRausP20tfEkQdAPSRrMCSUZBM6FhW7izAZRg==",
+      "version": "1.15.21",
+      "resolved": "https://registry.npmjs.org/@swc/core-win32-arm64-msvc/-/core-win32-arm64-msvc-1.15.21.tgz",
+      "integrity": "sha512-+/AgNBnjYugUA8C0Do4YzymgvnGbztv7j8HKSQLvR/DQgZPoXQ2B3PqB2mTtGh/X5DhlJWiqnunN35JUgWcAeQ==",
       "cpu": [
         "arm64"
       ],
@@ -3758,9 +3810,9 @@
       }
     },
     "node_modules/@swc/core-win32-ia32-msvc": {
-      "version": "1.15.13",
-      "resolved": "https://registry.npmjs.org/@swc/core-win32-ia32-msvc/-/core-win32-ia32-msvc-1.15.13.tgz",
-      "integrity": "sha512-hYXvyVVntqRlYoAIDwNzkS3tL2ijP3rxyWQMNKaxcCxxkCDto/w3meOK/OB6rbQSkNw0qTUcBfU9k+T0ptYdfQ==",
+      "version": "1.15.21",
+      "resolved": "https://registry.npmjs.org/@swc/core-win32-ia32-msvc/-/core-win32-ia32-msvc-1.15.21.tgz",
+      "integrity": "sha512-IkSZj8PX/N4HcaFhMQtzmkV8YSnuNoJ0E6OvMwFiOfejPhiKXvl7CdDsn1f4/emYEIDO3fpgZW9DTaCRMDxaDA==",
       "cpu": [
         "ia32"
       ],
@@ -3775,9 +3827,9 @@
       }
     },
     "node_modules/@swc/core-win32-x64-msvc": {
-      "version": "1.15.13",
-      "resolved": "https://registry.npmjs.org/@swc/core-win32-x64-msvc/-/core-win32-x64-msvc-1.15.13.tgz",
-      "integrity": "sha512-XTzKs7c/vYCcjmcwawnQvlHHNS1naJEAzcBckMI5OJlnrcgW8UtcX9NHFYvNjGtXuKv0/9KvqL4fuahdvlNGKw==",
+      "version": "1.15.21",
+      "resolved": "https://registry.npmjs.org/@swc/core-win32-x64-msvc/-/core-win32-x64-msvc-1.15.21.tgz",
+      "integrity": "sha512-zUyWso7OOENB6e1N1hNuNn8vbvLsTdKQ5WKLgt/JcBNfJhKy/6jmBmqI3GXk/MyvQKd5SLvP7A0F36p7TeDqvw==",
       "cpu": [
         "x64"
       ],
@@ -3809,47 +3861,47 @@
       }
     },
     "node_modules/@tailwindcss/node": {
-      "version": "4.2.1",
-      "resolved": "https://registry.npmjs.org/@tailwindcss/node/-/node-4.2.1.tgz",
-      "integrity": "sha512-jlx6sLk4EOwO6hHe1oCGm1Q4AN/s0rSrTTPBGPM0/RQ6Uylwq17FuU8IeJJKEjtc6K6O07zsvP+gDO6MMWo7pg==",
+      "version": "4.2.2",
+      "resolved": "https://registry.npmjs.org/@tailwindcss/node/-/node-4.2.2.tgz",
+      "integrity": "sha512-pXS+wJ2gZpVXqFaUEjojq7jzMpTGf8rU6ipJz5ovJV6PUGmlJ+jvIwGrzdHdQ80Sg+wmQxUFuoW1UAAwHNEdFA==",
       "license": "MIT",
       "dependencies": {
         "@jridgewell/remapping": "^2.3.5",
         "enhanced-resolve": "^5.19.0",
         "jiti": "^2.6.1",
-        "lightningcss": "1.31.1",
+        "lightningcss": "1.32.0",
         "magic-string": "^0.30.21",
         "source-map-js": "^1.2.1",
-        "tailwindcss": "4.2.1"
+        "tailwindcss": "4.2.2"
       }
     },
     "node_modules/@tailwindcss/oxide": {
-      "version": "4.2.1",
-      "resolved": "https://registry.npmjs.org/@tailwindcss/oxide/-/oxide-4.2.1.tgz",
-      "integrity": "sha512-yv9jeEFWnjKCI6/T3Oq50yQEOqmpmpfzG1hcZsAOaXFQPfzWprWrlHSdGPEF3WQTi8zu8ohC9Mh9J470nT5pUw==",
+      "version": "4.2.2",
+      "resolved": "https://registry.npmjs.org/@tailwindcss/oxide/-/oxide-4.2.2.tgz",
+      "integrity": "sha512-qEUA07+E5kehxYp9BVMpq9E8vnJuBHfJEC0vPC5e7iL/hw7HR61aDKoVoKzrG+QKp56vhNZe4qwkRmMC0zDLvg==",
       "license": "MIT",
       "engines": {
         "node": ">= 20"
       },
       "optionalDependencies": {
-        "@tailwindcss/oxide-android-arm64": "4.2.1",
-        "@tailwindcss/oxide-darwin-arm64": "4.2.1",
-        "@tailwindcss/oxide-darwin-x64": "4.2.1",
-        "@tailwindcss/oxide-freebsd-x64": "4.2.1",
-        "@tailwindcss/oxide-linux-arm-gnueabihf": "4.2.1",
-        "@tailwindcss/oxide-linux-arm64-gnu": "4.2.1",
-        "@tailwindcss/oxide-linux-arm64-musl": "4.2.1",
-        "@tailwindcss/oxide-linux-x64-gnu": "4.2.1",
-        "@tailwindcss/oxide-linux-x64-musl": "4.2.1",
-        "@tailwindcss/oxide-wasm32-wasi": "4.2.1",
-        "@tailwindcss/oxide-win32-arm64-msvc": "4.2.1",
-        "@tailwindcss/oxide-win32-x64-msvc": "4.2.1"
+        "@tailwindcss/oxide-android-arm64": "4.2.2",
+        "@tailwindcss/oxide-darwin-arm64": "4.2.2",
+        "@tailwindcss/oxide-darwin-x64": "4.2.2",
+        "@tailwindcss/oxide-freebsd-x64": "4.2.2",
+        "@tailwindcss/oxide-linux-arm-gnueabihf": "4.2.2",
+        "@tailwindcss/oxide-linux-arm64-gnu": "4.2.2",
+        "@tailwindcss/oxide-linux-arm64-musl": "4.2.2",
+        "@tailwindcss/oxide-linux-x64-gnu": "4.2.2",
+        "@tailwindcss/oxide-linux-x64-musl": "4.2.2",
+        "@tailwindcss/oxide-wasm32-wasi": "4.2.2",
+        "@tailwindcss/oxide-win32-arm64-msvc": "4.2.2",
+        "@tailwindcss/oxide-win32-x64-msvc": "4.2.2"
       }
     },
     "node_modules/@tailwindcss/oxide-android-arm64": {
-      "version": "4.2.1",
-      "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-android-arm64/-/oxide-android-arm64-4.2.1.tgz",
-      "integrity": "sha512-eZ7G1Zm5EC8OOKaesIKuw77jw++QJ2lL9N+dDpdQiAB/c/B2wDh0QPFHbkBVrXnwNugvrbJFk1gK2SsVjwWReg==",
+      "version": "4.2.2",
+      "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-android-arm64/-/oxide-android-arm64-4.2.2.tgz",
+      "integrity": "sha512-dXGR1n+P3B6748jZO/SvHZq7qBOqqzQ+yFrXpoOWWALWndF9MoSKAT3Q0fYgAzYzGhxNYOoysRvYlpixRBBoDg==",
       "cpu": [
         "arm64"
       ],
@@ -3863,9 +3915,9 @@
       }
     },
     "node_modules/@tailwindcss/oxide-darwin-arm64": {
-      "version": "4.2.1",
-      "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-darwin-arm64/-/oxide-darwin-arm64-4.2.1.tgz",
-      "integrity": "sha512-q/LHkOstoJ7pI1J0q6djesLzRvQSIfEto148ppAd+BVQK0JYjQIFSK3JgYZJa+Yzi0DDa52ZsQx2rqytBnf8Hw==",
+      "version": "4.2.2",
+      "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-darwin-arm64/-/oxide-darwin-arm64-4.2.2.tgz",
+      "integrity": "sha512-iq9Qjr6knfMpZHj55/37ouZeykwbDqF21gPFtfnhCCKGDcPI/21FKC9XdMO/XyBM7qKORx6UIhGgg6jLl7BZlg==",
       "cpu": [
         "arm64"
       ],
@@ -3879,9 +3931,9 @@
       }
     },
     "node_modules/@tailwindcss/oxide-darwin-x64": {
-      "version": "4.2.1",
-      "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-darwin-x64/-/oxide-darwin-x64-4.2.1.tgz",
-      "integrity": "sha512-/f/ozlaXGY6QLbpvd/kFTro2l18f7dHKpB+ieXz+Cijl4Mt9AI2rTrpq7V+t04nK+j9XBQHnSMdeQRhbGyt6fw==",
+      "version": "4.2.2",
+      "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-darwin-x64/-/oxide-darwin-x64-4.2.2.tgz",
+      "integrity": "sha512-BlR+2c3nzc8f2G639LpL89YY4bdcIdUmiOOkv2GQv4/4M0vJlpXEa0JXNHhCHU7VWOKWT/CjqHdTP8aUuDJkuw==",
       "cpu": [
         "x64"
       ],
@@ -3895,9 +3947,9 @@
       }
     },
     "node_modules/@tailwindcss/oxide-freebsd-x64": {
-      "version": "4.2.1",
-      "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-freebsd-x64/-/oxide-freebsd-x64-4.2.1.tgz",
-      "integrity": "sha512-5e/AkgYJT/cpbkys/OU2Ei2jdETCLlifwm7ogMC7/hksI2fC3iiq6OcXwjibcIjPung0kRtR3TxEITkqgn0TcA==",
+      "version": "4.2.2",
+      "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-freebsd-x64/-/oxide-freebsd-x64-4.2.2.tgz",
+      "integrity": "sha512-YUqUgrGMSu2CDO82hzlQ5qSb5xmx3RUrke/QgnoEx7KvmRJHQuZHZmZTLSuuHwFf0DJPybFMXMYf+WJdxHy/nQ==",
       "cpu": [
         "x64"
       ],
@@ -3911,9 +3963,9 @@
       }
     },
     "node_modules/@tailwindcss/oxide-linux-arm-gnueabihf": {
-      "version": "4.2.1",
-      "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-linux-arm-gnueabihf/-/oxide-linux-arm-gnueabihf-4.2.1.tgz",
-      "integrity": "sha512-Uny1EcVTTmerCKt/1ZuKTkb0x8ZaiuYucg2/kImO5A5Y/kBz41/+j0gxUZl+hTF3xkWpDmHX+TaWhOtba2Fyuw==",
+      "version": "4.2.2",
+      "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-linux-arm-gnueabihf/-/oxide-linux-arm-gnueabihf-4.2.2.tgz",
+      "integrity": "sha512-FPdhvsW6g06T9BWT0qTwiVZYE2WIFo2dY5aCSpjG/S/u1tby+wXoslXS0kl3/KXnULlLr1E3NPRRw0g7t2kgaQ==",
       "cpu": [
         "arm"
       ],
@@ -3927,9 +3979,9 @@
       }
     },
     "node_modules/@tailwindcss/oxide-linux-arm64-gnu": {
-      "version": "4.2.1",
-      "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-linux-arm64-gnu/-/oxide-linux-arm64-gnu-4.2.1.tgz",
-      "integrity": "sha512-CTrwomI+c7n6aSSQlsPL0roRiNMDQ/YzMD9EjcR+H4f0I1SQ8QqIuPnsVp7QgMkC1Qi8rtkekLkOFjo7OlEFRQ==",
+      "version": "4.2.2",
+      "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-linux-arm64-gnu/-/oxide-linux-arm64-gnu-4.2.2.tgz",
+      "integrity": "sha512-4og1V+ftEPXGttOO7eCmW7VICmzzJWgMx+QXAJRAhjrSjumCwWqMfkDrNu1LXEQzNAwz28NCUpucgQPrR4S2yw==",
       "cpu": [
         "arm64"
       ],
@@ -3943,9 +3995,9 @@
       }
     },
     "node_modules/@tailwindcss/oxide-linux-arm64-musl": {
-      "version": "4.2.1",
-      "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-linux-arm64-musl/-/oxide-linux-arm64-musl-4.2.1.tgz",
-      "integrity": "sha512-WZA0CHRL/SP1TRbA5mp9htsppSEkWuQ4KsSUumYQnyl8ZdT39ntwqmz4IUHGN6p4XdSlYfJwM4rRzZLShHsGAQ==",
+      "version": "4.2.2",
+      "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-linux-arm64-musl/-/oxide-linux-arm64-musl-4.2.2.tgz",
+      "integrity": "sha512-oCfG/mS+/+XRlwNjnsNLVwnMWYH7tn/kYPsNPh+JSOMlnt93mYNCKHYzylRhI51X+TbR+ufNhhKKzm6QkqX8ag==",
       "cpu": [
         "arm64"
       ],
@@ -3959,9 +4011,9 @@
       }
     },
     "node_modules/@tailwindcss/oxide-linux-x64-gnu": {
-      "version": "4.2.1",
-      "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-linux-x64-gnu/-/oxide-linux-x64-gnu-4.2.1.tgz",
-      "integrity": "sha512-qMFzxI2YlBOLW5PhblzuSWlWfwLHaneBE0xHzLrBgNtqN6mWfs+qYbhryGSXQjFYB1Dzf5w+LN5qbUTPhW7Y5g==",
+      "version": "4.2.2",
+      "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-linux-x64-gnu/-/oxide-linux-x64-gnu-4.2.2.tgz",
+      "integrity": "sha512-rTAGAkDgqbXHNp/xW0iugLVmX62wOp2PoE39BTCGKjv3Iocf6AFbRP/wZT/kuCxC9QBh9Pu8XPkv/zCZB2mcMg==",
       "cpu": [
         "x64"
       ],
@@ -3975,9 +4027,9 @@
       }
     },
     "node_modules/@tailwindcss/oxide-linux-x64-musl": {
-      "version": "4.2.1",
-      "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-linux-x64-musl/-/oxide-linux-x64-musl-4.2.1.tgz",
-      "integrity": "sha512-5r1X2FKnCMUPlXTWRYpHdPYUY6a1Ar/t7P24OuiEdEOmms5lyqjDRvVY1yy9Rmioh+AunQ0rWiOTPE8F9A3v5g==",
+      "version": "4.2.2",
+      "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-linux-x64-musl/-/oxide-linux-x64-musl-4.2.2.tgz",
+      "integrity": "sha512-XW3t3qwbIwiSyRCggeO2zxe3KWaEbM0/kW9e8+0XpBgyKU4ATYzcVSMKteZJ1iukJ3HgHBjbg9P5YPRCVUxlnQ==",
       "cpu": [
         "x64"
       ],
@@ -3991,9 +4043,9 @@
       }
     },
     "node_modules/@tailwindcss/oxide-wasm32-wasi": {
-      "version": "4.2.1",
-      "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-wasm32-wasi/-/oxide-wasm32-wasi-4.2.1.tgz",
-      "integrity": "sha512-MGFB5cVPvshR85MTJkEvqDUnuNoysrsRxd6vnk1Lf2tbiqNlXpHYZqkqOQalydienEWOHHFyyuTSYRsLfxFJ2Q==",
+      "version": "4.2.2",
+      "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-wasm32-wasi/-/oxide-wasm32-wasi-4.2.2.tgz",
+      "integrity": "sha512-eKSztKsmEsn1O5lJ4ZAfyn41NfG7vzCg496YiGtMDV86jz1q/irhms5O0VrY6ZwTUkFy/EKG3RfWgxSI3VbZ8Q==",
       "bundleDependencies": [
         "@napi-rs/wasm-runtime",
         "@emnapi/core",
@@ -4020,9 +4072,9 @@
       }
     },
     "node_modules/@tailwindcss/oxide-win32-arm64-msvc": {
-      "version": "4.2.1",
-      "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-win32-arm64-msvc/-/oxide-win32-arm64-msvc-4.2.1.tgz",
-      "integrity": "sha512-YlUEHRHBGnCMh4Nj4GnqQyBtsshUPdiNroZj8VPkvTZSoHsilRCwXcVKnG9kyi0ZFAS/3u+qKHBdDc81SADTRA==",
+      "version": "4.2.2",
+      "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-win32-arm64-msvc/-/oxide-win32-arm64-msvc-4.2.2.tgz",
+      "integrity": "sha512-qPmaQM4iKu5mxpsrWZMOZRgZv1tOZpUm+zdhhQP0VhJfyGGO3aUKdbh3gDZc/dPLQwW4eSqWGrrcWNBZWUWaXQ==",
       "cpu": [
         "arm64"
       ],
@@ -4036,9 +4088,9 @@
       }
     },
     "node_modules/@tailwindcss/oxide-win32-x64-msvc": {
-      "version": "4.2.1",
-      "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-win32-x64-msvc/-/oxide-win32-x64-msvc-4.2.1.tgz",
-      "integrity": "sha512-rbO34G5sMWWyrN/idLeVxAZgAKWrn5LiR3/I90Q9MkA67s6T1oB0xtTe+0heoBvHSpbU9Mk7i6uwJnpo4u21XQ==",
+      "version": "4.2.2",
+      "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-win32-x64-msvc/-/oxide-win32-x64-msvc-4.2.2.tgz",
+      "integrity": "sha512-1T/37VvI7WyH66b+vqHj/cLwnCxt7Qt3WFu5Q8hk65aOvlwAhs7rAp1VkulBJw/N4tMirXjVnylTR72uI0HGcA==",
       "cpu": [
         "x64"
       ],
@@ -4052,25 +4104,25 @@
       }
     },
     "node_modules/@tailwindcss/postcss": {
-      "version": "4.2.1",
-      "resolved": "https://registry.npmjs.org/@tailwindcss/postcss/-/postcss-4.2.1.tgz",
-      "integrity": "sha512-OEwGIBnXnj7zJeonOh6ZG9woofIjGrd2BORfvE5p9USYKDCZoQmfqLcfNiRWoJlRWLdNPn2IgVZuWAOM4iTYMw==",
+      "version": "4.2.2",
+      "resolved": "https://registry.npmjs.org/@tailwindcss/postcss/-/postcss-4.2.2.tgz",
+      "integrity": "sha512-n4goKQbW8RVXIbNKRB/45LzyUqN451deQK0nzIeauVEqjlI49slUlgKYJM2QyUzap/PcpnS7kzSUmPb1sCRvYQ==",
       "license": "MIT",
       "dependencies": {
         "@alloc/quick-lru": "^5.2.0",
-        "@tailwindcss/node": "4.2.1",
-        "@tailwindcss/oxide": "4.2.1",
+        "@tailwindcss/node": "4.2.2",
+        "@tailwindcss/oxide": "4.2.2",
         "postcss": "^8.5.6",
-        "tailwindcss": "4.2.1"
+        "tailwindcss": "4.2.2"
       }
     },
     "node_modules/@tanstack/react-virtual": {
-      "version": "3.13.19",
-      "resolved": "https://registry.npmjs.org/@tanstack/react-virtual/-/react-virtual-3.13.19.tgz",
-      "integrity": "sha512-KzwmU1IbE0IvCZSm6OXkS+kRdrgW2c2P3Ho3NC+zZXWK6oObv/L+lcV/2VuJ+snVESRlMJ+w/fg4WXI/JzoNGQ==",
+      "version": "3.13.23",
+      "resolved": "https://registry.npmjs.org/@tanstack/react-virtual/-/react-virtual-3.13.23.tgz",
+      "integrity": "sha512-XnMRnHQ23piOVj2bzJqHrRrLg4r+F86fuBcwteKfbIjJrtGxb4z7tIvPVAe4B+4UVwo9G4Giuz5fmapcrnZ0OQ==",
       "license": "MIT",
       "dependencies": {
-        "@tanstack/virtual-core": "3.13.19"
+        "@tanstack/virtual-core": "3.13.23"
       },
       "funding": {
         "type": "github",
@@ -4082,9 +4134,9 @@
       }
     },
     "node_modules/@tanstack/virtual-core": {
-      "version": "3.13.19",
-      "resolved": "https://registry.npmjs.org/@tanstack/virtual-core/-/virtual-core-3.13.19.tgz",
-      "integrity": "sha512-/BMP7kNhzKOd7wnDeB8NrIRNLwkf5AhCYCvtfZV2GXWbBieFm/el0n6LOAXlTi6ZwHICSNnQcIxRCWHrLzDY+g==",
+      "version": "3.13.23",
+      "resolved": "https://registry.npmjs.org/@tanstack/virtual-core/-/virtual-core-3.13.23.tgz",
+      "integrity": "sha512-zSz2Z2HNyLjCplANTDyl3BcdQJc2k1+yyFoKhNRmCr7V7dY8o8q5m8uFTI1/Pg1kL+Hgrz6u3Xo6eFUB7l66cg==",
       "license": "MIT",
       "funding": {
         "type": "github",
@@ -4102,9 +4154,9 @@
       }
     },
     "node_modules/@tauri-apps/cli": {
-      "version": "2.10.0",
-      "resolved": "https://registry.npmjs.org/@tauri-apps/cli/-/cli-2.10.0.tgz",
-      "integrity": "sha512-ZwT0T+7bw4+DPCSWzmviwq5XbXlM0cNoleDKOYPFYqcZqeKY31KlpoMW/MOON/tOFBPgi31a2v3w9gliqwL2+Q==",
+      "version": "2.10.1",
+      "resolved": "https://registry.npmjs.org/@tauri-apps/cli/-/cli-2.10.1.tgz",
+      "integrity": "sha512-jQNGF/5quwORdZSSLtTluyKQ+o6SMa/AUICfhf4egCGFdMHqWssApVgYSbg+jmrZoc8e1DscNvjTnXtlHLS11g==",
       "dev": true,
       "license": "Apache-2.0 OR MIT",
       "bin": {
@@ -4118,23 +4170,23 @@
         "url": "https://opencollective.com/tauri"
       },
       "optionalDependencies": {
-        "@tauri-apps/cli-darwin-arm64": "2.10.0",
-        "@tauri-apps/cli-darwin-x64": "2.10.0",
-        "@tauri-apps/cli-linux-arm-gnueabihf": "2.10.0",
-        "@tauri-apps/cli-linux-arm64-gnu": "2.10.0",
-        "@tauri-apps/cli-linux-arm64-musl": "2.10.0",
-        "@tauri-apps/cli-linux-riscv64-gnu": "2.10.0",
-        "@tauri-apps/cli-linux-x64-gnu": "2.10.0",
-        "@tauri-apps/cli-linux-x64-musl": "2.10.0",
-        "@tauri-apps/cli-win32-arm64-msvc": "2.10.0",
-        "@tauri-apps/cli-win32-ia32-msvc": "2.10.0",
-        "@tauri-apps/cli-win32-x64-msvc": "2.10.0"
+        "@tauri-apps/cli-darwin-arm64": "2.10.1",
+        "@tauri-apps/cli-darwin-x64": "2.10.1",
+        "@tauri-apps/cli-linux-arm-gnueabihf": "2.10.1",
+        "@tauri-apps/cli-linux-arm64-gnu": "2.10.1",
+        "@tauri-apps/cli-linux-arm64-musl": "2.10.1",
+        "@tauri-apps/cli-linux-riscv64-gnu": "2.10.1",
+        "@tauri-apps/cli-linux-x64-gnu": "2.10.1",
+        "@tauri-apps/cli-linux-x64-musl": "2.10.1",
+        "@tauri-apps/cli-win32-arm64-msvc": "2.10.1",
+        "@tauri-apps/cli-win32-ia32-msvc": "2.10.1",
+        "@tauri-apps/cli-win32-x64-msvc": "2.10.1"
       }
     },
     "node_modules/@tauri-apps/cli-darwin-arm64": {
-      "version": "2.10.0",
-      "resolved": "https://registry.npmjs.org/@tauri-apps/cli-darwin-arm64/-/cli-darwin-arm64-2.10.0.tgz",
-      "integrity": "sha512-avqHD4HRjrMamE/7R/kzJPcAJnZs0IIS+1nkDP5b+TNBn3py7N2aIo9LIpy+VQq0AkN8G5dDpZtOOBkmWt/zjA==",
+      "version": "2.10.1",
+      "resolved": "https://registry.npmjs.org/@tauri-apps/cli-darwin-arm64/-/cli-darwin-arm64-2.10.1.tgz",
+      "integrity": "sha512-Z2OjCXiZ+fbYZy7PmP3WRnOpM9+Fy+oonKDEmUE6MwN4IGaYqgceTjwHucc/kEEYZos5GICve35f7ZiizgqEnQ==",
       "cpu": [
         "arm64"
       ],
@@ -4149,9 +4201,9 @@
       }
     },
     "node_modules/@tauri-apps/cli-darwin-x64": {
-      "version": "2.10.0",
-      "resolved": "https://registry.npmjs.org/@tauri-apps/cli-darwin-x64/-/cli-darwin-x64-2.10.0.tgz",
-      "integrity": "sha512-keDmlvJRStzVFjZTd0xYkBONLtgBC9eMTpmXnBXzsHuawV2q9PvDo2x6D5mhuoMVrJ9QWjgaPKBBCFks4dK71Q==",
+      "version": "2.10.1",
+      "resolved": "https://registry.npmjs.org/@tauri-apps/cli-darwin-x64/-/cli-darwin-x64-2.10.1.tgz",
+      "integrity": "sha512-V/irQVvjPMGOTQqNj55PnQPVuH4VJP8vZCN7ajnj+ZS8Kom1tEM2hR3qbbIRoS3dBKs5mbG8yg1WC+97dq17Pw==",
       "cpu": [
         "x64"
       ],
@@ -4166,9 +4218,9 @@
       }
     },
     "node_modules/@tauri-apps/cli-linux-arm-gnueabihf": {
-      "version": "2.10.0",
-      "resolved": "https://registry.npmjs.org/@tauri-apps/cli-linux-arm-gnueabihf/-/cli-linux-arm-gnueabihf-2.10.0.tgz",
-      "integrity": "sha512-e5u0VfLZsMAC9iHaOEANumgl6lfnJx0Dtjkd8IJpysZ8jp0tJ6wrIkto2OzQgzcYyRCKgX72aKE0PFgZputA8g==",
+      "version": "2.10.1",
+      "resolved": "https://registry.npmjs.org/@tauri-apps/cli-linux-arm-gnueabihf/-/cli-linux-arm-gnueabihf-2.10.1.tgz",
+      "integrity": "sha512-Hyzwsb4VnCWKGfTw+wSt15Z2pLw2f0JdFBfq2vHBOBhvg7oi6uhKiF87hmbXOBXUZaGkyRDkCHsdzJcIfoJC2w==",
       "cpu": [
         "arm"
       ],
@@ -4183,9 +4235,9 @@
       }
     },
     "node_modules/@tauri-apps/cli-linux-arm64-gnu": {
-      "version": "2.10.0",
-      "resolved": "https://registry.npmjs.org/@tauri-apps/cli-linux-arm64-gnu/-/cli-linux-arm64-gnu-2.10.0.tgz",
-      "integrity": "sha512-YrYYk2dfmBs5m+OIMCrb+JH/oo+4FtlpcrTCgiFYc7vcs6m3QDd1TTyWu0u01ewsCtK2kOdluhr/zKku+KP7HA==",
+      "version": "2.10.1",
+      "resolved": "https://registry.npmjs.org/@tauri-apps/cli-linux-arm64-gnu/-/cli-linux-arm64-gnu-2.10.1.tgz",
+      "integrity": "sha512-OyOYs2t5GkBIvyWjA1+h4CZxTcdz1OZPCWAPz5DYEfB0cnWHERTnQ/SLayQzncrT0kwRoSfSz9KxenkyJoTelA==",
       "cpu": [
         "arm64"
       ],
@@ -4200,9 +4252,9 @@
       }
     },
     "node_modules/@tauri-apps/cli-linux-arm64-musl": {
-      "version": "2.10.0",
-      "resolved": "https://registry.npmjs.org/@tauri-apps/cli-linux-arm64-musl/-/cli-linux-arm64-musl-2.10.0.tgz",
-      "integrity": "sha512-GUoPdVJmrJRIXFfW3Rkt+eGK9ygOdyISACZfC/bCSfOnGt8kNdQIQr5WRH9QUaTVFIwxMlQyV3m+yXYP+xhSVA==",
+      "version": "2.10.1",
+      "resolved": "https://registry.npmjs.org/@tauri-apps/cli-linux-arm64-musl/-/cli-linux-arm64-musl-2.10.1.tgz",
+      "integrity": "sha512-MIj78PDDGjkg3NqGptDOGgfXks7SYJwhiMh8SBoZS+vfdz7yP5jN18bNaLnDhsVIPARcAhE1TlsZe/8Yxo2zqg==",
       "cpu": [
         "arm64"
       ],
@@ -4217,9 +4269,9 @@
       }
     },
     "node_modules/@tauri-apps/cli-linux-riscv64-gnu": {
-      "version": "2.10.0",
-      "resolved": "https://registry.npmjs.org/@tauri-apps/cli-linux-riscv64-gnu/-/cli-linux-riscv64-gnu-2.10.0.tgz",
-      "integrity": "sha512-JO7s3TlSxshwsoKNCDkyvsx5gw2QAs/Y2GbR5UE2d5kkU138ATKoPOtxn8G1fFT1aDW4LH0rYAAfBpGkDyJJnw==",
+      "version": "2.10.1",
+      "resolved": "https://registry.npmjs.org/@tauri-apps/cli-linux-riscv64-gnu/-/cli-linux-riscv64-gnu-2.10.1.tgz",
+      "integrity": "sha512-X0lvOVUg8PCVaoEtEAnpxmnkwlE1gcMDTqfhbefICKDnOTJ5Est3qL0SrWxizDackIOKBcvtpejrSiVpuJI1kw==",
       "cpu": [
         "riscv64"
       ],
@@ -4234,9 +4286,9 @@
       }
     },
     "node_modules/@tauri-apps/cli-linux-x64-gnu": {
-      "version": "2.10.0",
-      "resolved": "https://registry.npmjs.org/@tauri-apps/cli-linux-x64-gnu/-/cli-linux-x64-gnu-2.10.0.tgz",
-      "integrity": "sha512-Uvh4SUUp4A6DVRSMWjelww0GnZI3PlVy7VS+DRF5napKuIehVjGl9XD0uKoCoxwAQBLctvipyEK+pDXpJeoHng==",
+      "version": "2.10.1",
+      "resolved": "https://registry.npmjs.org/@tauri-apps/cli-linux-x64-gnu/-/cli-linux-x64-gnu-2.10.1.tgz",
+      "integrity": "sha512-2/12bEzsJS9fAKybxgicCDFxYD1WEI9kO+tlDwX5znWG2GwMBaiWcmhGlZ8fi+DMe9CXlcVarMTYc0L3REIRxw==",
       "cpu": [
         "x64"
       ],
@@ -4251,9 +4303,9 @@
       }
     },
     "node_modules/@tauri-apps/cli-linux-x64-musl": {
-      "version": "2.10.0",
-      "resolved": "https://registry.npmjs.org/@tauri-apps/cli-linux-x64-musl/-/cli-linux-x64-musl-2.10.0.tgz",
-      "integrity": "sha512-AP0KRK6bJuTpQ8kMNWvhIpKUkQJfcPFeba7QshOQZjJ8wOS6emwTN4K5g/d3AbCMo0RRdnZWwu67MlmtJyxC1Q==",
+      "version": "2.10.1",
+      "resolved": "https://registry.npmjs.org/@tauri-apps/cli-linux-x64-musl/-/cli-linux-x64-musl-2.10.1.tgz",
+      "integrity": "sha512-Y8J0ZzswPz50UcGOFuXGEMrxbjwKSPgXftx5qnkuMs2rmwQB5ssvLb6tn54wDSYxe7S6vlLob9vt0VKuNOaCIQ==",
       "cpu": [
         "x64"
       ],
@@ -4268,9 +4320,9 @@
       }
     },
     "node_modules/@tauri-apps/cli-win32-arm64-msvc": {
-      "version": "2.10.0",
-      "resolved": "https://registry.npmjs.org/@tauri-apps/cli-win32-arm64-msvc/-/cli-win32-arm64-msvc-2.10.0.tgz",
-      "integrity": "sha512-97DXVU3dJystrq7W41IX+82JEorLNY+3+ECYxvXWqkq7DBN6FsA08x/EFGE8N/b0LTOui9X2dvpGGoeZKKV08g==",
+      "version": "2.10.1",
+      "resolved": "https://registry.npmjs.org/@tauri-apps/cli-win32-arm64-msvc/-/cli-win32-arm64-msvc-2.10.1.tgz",
+      "integrity": "sha512-iSt5B86jHYAPJa/IlYw++SXtFPGnWtFJriHn7X0NFBVunF6zu9+/zOn8OgqIWSl8RgzhLGXQEEtGBdR4wzpVgg==",
       "cpu": [
         "arm64"
       ],
@@ -4285,9 +4337,9 @@
       }
     },
     "node_modules/@tauri-apps/cli-win32-ia32-msvc": {
-      "version": "2.10.0",
-      "resolved": "https://registry.npmjs.org/@tauri-apps/cli-win32-ia32-msvc/-/cli-win32-ia32-msvc-2.10.0.tgz",
-      "integrity": "sha512-EHyQ1iwrWy1CwMalEm9z2a6L5isQ121pe7FcA2xe4VWMJp+GHSDDGvbTv/OPdkt2Lyr7DAZBpZHM6nvlHXEc4A==",
+      "version": "2.10.1",
+      "resolved": "https://registry.npmjs.org/@tauri-apps/cli-win32-ia32-msvc/-/cli-win32-ia32-msvc-2.10.1.tgz",
+      "integrity": "sha512-gXyxgEzsFegmnWywYU5pEBURkcFN/Oo45EAwvZrHMh+zUSEAvO5E8TXsgPADYm31d1u7OQU3O3HsYfVBf2moHw==",
       "cpu": [
         "ia32"
       ],
@@ -4302,9 +4354,9 @@
       }
     },
     "node_modules/@tauri-apps/cli-win32-x64-msvc": {
-      "version": "2.10.0",
-      "resolved": "https://registry.npmjs.org/@tauri-apps/cli-win32-x64-msvc/-/cli-win32-x64-msvc-2.10.0.tgz",
-      "integrity": "sha512-NTpyQxkpzGmU6ceWBTY2xRIEaS0ZLbVx1HE1zTA3TY/pV3+cPoPPOs+7YScr4IMzXMtOw7tLw5LEXo5oIG3qaQ==",
+      "version": "2.10.1",
+      "resolved": "https://registry.npmjs.org/@tauri-apps/cli-win32-x64-msvc/-/cli-win32-x64-msvc-2.10.1.tgz",
+      "integrity": "sha512-6Cn7YpPFwzChy0ERz6djKEmUehWrYlM+xTaNzGPgZocw3BD7OfwfWHKVWxXzdjEW2KfKkHddfdxK1XXTYqBRLg==",
       "cpu": [
         "x64"
       ],
@@ -4931,9 +4983,9 @@
       "license": "MIT"
     },
     "node_modules/@types/node": {
-      "version": "24.10.13",
-      "resolved": "https://registry.npmjs.org/@types/node/-/node-24.10.13.tgz",
-      "integrity": "sha512-oH72nZRfDv9lADUBSo104Aq7gPHpQZc4BTx38r9xf9pg5LfP6EzSyH2n7qFmmxRQXh7YlUXODcYsg6PuTDSxGg==",
+      "version": "24.12.0",
+      "resolved": "https://registry.npmjs.org/@types/node/-/node-24.12.0.tgz",
+      "integrity": "sha512-GYDxsZi3ChgmckRT9HPU0WEhKLP08ev/Yfcq2AstjrDASOYCSXeyjDsHg4v5t4jOj7cyDX3vmprafKlWIG9MXQ==",
       "license": "MIT",
       "dependencies": {
         "undici-types": "~7.16.0"
@@ -4945,12 +4997,6 @@
       "integrity": "sha512-dISoDXWWQwUquiKsyZ4Ng+HX2KsPL7LyHKHQwgGFEA3IaKac4Obd+h2a/a6waisAoepJlBcx9paWqjA8/HVjCw==",
       "license": "MIT"
     },
-    "node_modules/@types/phoenix": {
-      "version": "1.6.7",
-      "resolved": "https://registry.npmjs.org/@types/phoenix/-/phoenix-1.6.7.tgz",
-      "integrity": "sha512-oN9ive//QSBkf19rfDv45M7eZPi0eEXylht2OLEXicu5b4KoQ1OzXIw+xDSGWxSxe1JmepRR/ZH283vsu518/Q==",
-      "license": "MIT"
-    },
     "node_modules/@types/prop-types": {
       "version": "15.7.15",
       "resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.15.tgz",
@@ -5018,17 +5064,17 @@
       }
     },
     "node_modules/@typescript-eslint/eslint-plugin": {
-      "version": "8.56.1",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/eslint-plugin/-/eslint-plugin-8.56.1.tgz",
-      "integrity": "sha512-Jz9ZztpB37dNC+HU2HI28Bs9QXpzCz+y/twHOwhyrIRdbuVDxSytJNDl6z/aAKlaRIwC7y8wJdkBv7FxYGgi0A==",
+      "version": "8.57.2",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/eslint-plugin/-/eslint-plugin-8.57.2.tgz",
+      "integrity": "sha512-NZZgp0Fm2IkD+La5PR81sd+g+8oS6JwJje+aRWsDocxHkjyRw0J5L5ZTlN3LI1LlOcGL7ph3eaIUmTXMIjLk0w==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
         "@eslint-community/regexpp": "^4.12.2",
-        "@typescript-eslint/scope-manager": "8.56.1",
-        "@typescript-eslint/type-utils": "8.56.1",
-        "@typescript-eslint/utils": "8.56.1",
-        "@typescript-eslint/visitor-keys": "8.56.1",
+        "@typescript-eslint/scope-manager": "8.57.2",
+        "@typescript-eslint/type-utils": "8.57.2",
+        "@typescript-eslint/utils": "8.57.2",
+        "@typescript-eslint/visitor-keys": "8.57.2",
         "ignore": "^7.0.5",
         "natural-compare": "^1.4.0",
         "ts-api-utils": "^2.4.0"
@@ -5041,22 +5087,22 @@
         "url": "https://opencollective.com/typescript-eslint"
       },
       "peerDependencies": {
-        "@typescript-eslint/parser": "^8.56.1",
+        "@typescript-eslint/parser": "^8.57.2",
         "eslint": "^8.57.0 || ^9.0.0 || ^10.0.0",
         "typescript": ">=4.8.4 <6.0.0"
       }
     },
     "node_modules/@typescript-eslint/parser": {
-      "version": "8.56.1",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/parser/-/parser-8.56.1.tgz",
-      "integrity": "sha512-klQbnPAAiGYFyI02+znpBRLyjL4/BrBd0nyWkdC0s/6xFLkXYQ8OoRrSkqacS1ddVxf/LDyODIKbQ5TgKAf/Fg==",
+      "version": "8.57.2",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/parser/-/parser-8.57.2.tgz",
+      "integrity": "sha512-30ScMRHIAD33JJQkgfGW1t8CURZtjc2JpTrq5n2HFhOefbAhb7ucc7xJwdWcrEtqUIYJ73Nybpsggii6GtAHjA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@typescript-eslint/scope-manager": "8.56.1",
-        "@typescript-eslint/types": "8.56.1",
-        "@typescript-eslint/typescript-estree": "8.56.1",
-        "@typescript-eslint/visitor-keys": "8.56.1",
+        "@typescript-eslint/scope-manager": "8.57.2",
+        "@typescript-eslint/types": "8.57.2",
+        "@typescript-eslint/typescript-estree": "8.57.2",
+        "@typescript-eslint/visitor-keys": "8.57.2",
         "debug": "^4.4.3"
       },
       "engines": {
@@ -5072,14 +5118,14 @@
       }
     },
     "node_modules/@typescript-eslint/project-service": {
-      "version": "8.56.1",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/project-service/-/project-service-8.56.1.tgz",
-      "integrity": "sha512-TAdqQTzHNNvlVFfR+hu2PDJrURiwKsUvxFn1M0h95BB8ah5jejas08jUWG4dBA68jDMI988IvtfdAI53JzEHOQ==",
+      "version": "8.57.2",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/project-service/-/project-service-8.57.2.tgz",
+      "integrity": "sha512-FuH0wipFywXRTHf+bTTjNyuNQQsQC3qh/dYzaM4I4W0jrCqjCVuUh99+xd9KamUfmCGPvbO8NDngo/vsnNVqgw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@typescript-eslint/tsconfig-utils": "^8.56.1",
-        "@typescript-eslint/types": "^8.56.1",
+        "@typescript-eslint/tsconfig-utils": "^8.57.2",
+        "@typescript-eslint/types": "^8.57.2",
         "debug": "^4.4.3"
       },
       "engines": {
@@ -5094,14 +5140,14 @@
       }
     },
     "node_modules/@typescript-eslint/scope-manager": {
-      "version": "8.56.1",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-8.56.1.tgz",
-      "integrity": "sha512-YAi4VDKcIZp0O4tz/haYKhmIDZFEUPOreKbfdAN3SzUDMcPhJ8QI99xQXqX+HoUVq8cs85eRKnD+rne2UAnj2w==",
+      "version": "8.57.2",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-8.57.2.tgz",
+      "integrity": "sha512-snZKH+W4WbWkrBqj4gUNRIGb/jipDW3qMqVJ4C9rzdFc+wLwruxk+2a5D+uoFcKPAqyqEnSb4l2ULuZf95eSkw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@typescript-eslint/types": "8.56.1",
-        "@typescript-eslint/visitor-keys": "8.56.1"
+        "@typescript-eslint/types": "8.57.2",
+        "@typescript-eslint/visitor-keys": "8.57.2"
       },
       "engines": {
         "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
@@ -5112,9 +5158,9 @@
       }
     },
     "node_modules/@typescript-eslint/tsconfig-utils": {
-      "version": "8.56.1",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/tsconfig-utils/-/tsconfig-utils-8.56.1.tgz",
-      "integrity": "sha512-qOtCYzKEeyr3aR9f28mPJqBty7+DBqsdd63eO0yyDwc6vgThj2UjWfJIcsFeSucYydqcuudMOprZ+x1SpF3ZuQ==",
+      "version": "8.57.2",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/tsconfig-utils/-/tsconfig-utils-8.57.2.tgz",
+      "integrity": "sha512-3Lm5DSM+DCowsUOJC+YqHHnKEfFh5CoGkj5Z31NQSNF4l5wdOwqGn99wmwN/LImhfY3KJnmordBq/4+VDe2eKw==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -5129,15 +5175,15 @@
       }
     },
     "node_modules/@typescript-eslint/type-utils": {
-      "version": "8.56.1",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/type-utils/-/type-utils-8.56.1.tgz",
-      "integrity": "sha512-yB/7dxi7MgTtGhZdaHCemf7PuwrHMenHjmzgUW1aJpO+bBU43OycnM3Wn+DdvDO/8zzA9HlhaJ0AUGuvri4oGg==",
+      "version": "8.57.2",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/type-utils/-/type-utils-8.57.2.tgz",
+      "integrity": "sha512-Co6ZCShm6kIbAM/s+oYVpKFfW7LBc6FXoPXjTRQ449PPNBY8U0KZXuevz5IFuuUj2H9ss40atTaf9dlGLzbWZg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@typescript-eslint/types": "8.56.1",
-        "@typescript-eslint/typescript-estree": "8.56.1",
-        "@typescript-eslint/utils": "8.56.1",
+        "@typescript-eslint/types": "8.57.2",
+        "@typescript-eslint/typescript-estree": "8.57.2",
+        "@typescript-eslint/utils": "8.57.2",
         "debug": "^4.4.3",
         "ts-api-utils": "^2.4.0"
       },
@@ -5154,10 +5200,9 @@
       }
     },
     "node_modules/@typescript-eslint/types": {
-      "version": "8.56.1",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-8.56.1.tgz",
-      "integrity": "sha512-dbMkdIUkIkchgGDIv7KLUpa0Mda4IYjo4IAMJUZ+3xNoUXxMsk9YtKpTHSChRS85o+H9ftm51gsK1dZReY9CVw==",
-      "dev": true,
+      "version": "8.57.2",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-8.57.2.tgz",
+      "integrity": "sha512-/iZM6FnM4tnx9csuTxspMW4BOSegshwX5oBDznJ7S4WggL7Vczz5d2W11ecc4vRrQMQHXRSxzrCsyG5EsPPTbA==",
       "license": "MIT",
       "engines": {
         "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
@@ -5168,16 +5213,16 @@
       }
     },
     "node_modules/@typescript-eslint/typescript-estree": {
-      "version": "8.56.1",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-8.56.1.tgz",
-      "integrity": "sha512-qzUL1qgalIvKWAf9C1HpvBjif+Vm6rcT5wZd4VoMb9+Km3iS3Cv9DY6dMRMDtPnwRAFyAi7YXJpTIEXLvdfPxg==",
+      "version": "8.57.2",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-8.57.2.tgz",
+      "integrity": "sha512-2MKM+I6g8tJxfSmFKOnHv2t8Sk3T6rF20A1Puk0svLK+uVapDZB/4pfAeB7nE83uAZrU6OxW+HmOd5wHVdXwXA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@typescript-eslint/project-service": "8.56.1",
-        "@typescript-eslint/tsconfig-utils": "8.56.1",
-        "@typescript-eslint/types": "8.56.1",
-        "@typescript-eslint/visitor-keys": "8.56.1",
+        "@typescript-eslint/project-service": "8.57.2",
+        "@typescript-eslint/tsconfig-utils": "8.57.2",
+        "@typescript-eslint/types": "8.57.2",
+        "@typescript-eslint/visitor-keys": "8.57.2",
         "debug": "^4.4.3",
         "minimatch": "^10.2.2",
         "semver": "^7.7.3",
@@ -5196,16 +5241,16 @@
       }
     },
     "node_modules/@typescript-eslint/utils": {
-      "version": "8.56.1",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/utils/-/utils-8.56.1.tgz",
-      "integrity": "sha512-HPAVNIME3tABJ61siYlHzSWCGtOoeP2RTIaHXFMPqjrQKCGB9OgUVdiNgH7TJS2JNIQ5qQ4RsAUDuGaGme/KOA==",
+      "version": "8.57.2",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/utils/-/utils-8.57.2.tgz",
+      "integrity": "sha512-krRIbvPK1ju1WBKIefiX+bngPs+odIQUtR7kymzPfo1POVw3jlF+nLkmexdSSd4UCbDcQn+wMBATOOmpBbqgKg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
         "@eslint-community/eslint-utils": "^4.9.1",
-        "@typescript-eslint/scope-manager": "8.56.1",
-        "@typescript-eslint/types": "8.56.1",
-        "@typescript-eslint/typescript-estree": "8.56.1"
+        "@typescript-eslint/scope-manager": "8.57.2",
+        "@typescript-eslint/types": "8.57.2",
+        "@typescript-eslint/typescript-estree": "8.57.2"
       },
       "engines": {
         "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
@@ -5220,13 +5265,13 @@
       }
     },
     "node_modules/@typescript-eslint/visitor-keys": {
-      "version": "8.56.1",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-8.56.1.tgz",
-      "integrity": "sha512-KiROIzYdEV85YygXw6BI/Dx4fnBlFQu6Mq4QE4MOH9fFnhohw6wX/OAvDY2/C+ut0I3RSPKenvZJIVYqJNkhEw==",
+      "version": "8.57.2",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-8.57.2.tgz",
+      "integrity": "sha512-zhahknjobV2FiD6Ee9iLbS7OV9zi10rG26odsQdfBO/hjSzUQbkIYgda+iNKK1zNiW2ey+Lf8MU5btN17V3dUw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@typescript-eslint/types": "8.56.1",
+        "@typescript-eslint/types": "8.57.2",
         "eslint-visitor-keys": "^5.0.0"
       },
       "engines": {
@@ -5257,20 +5302,20 @@
       "license": "MIT"
     },
     "node_modules/@vitejs/plugin-react-swc": {
-      "version": "4.2.3",
-      "resolved": "https://registry.npmjs.org/@vitejs/plugin-react-swc/-/plugin-react-swc-4.2.3.tgz",
-      "integrity": "sha512-QIluDil2prhY1gdA3GGwxZzTAmLdi8cQ2CcuMW4PB/Wu4e/1pzqrwhYWVd09LInCRlDUidQjd0B70QWbjWtLxA==",
+      "version": "4.3.0",
+      "resolved": "https://registry.npmjs.org/@vitejs/plugin-react-swc/-/plugin-react-swc-4.3.0.tgz",
+      "integrity": "sha512-mOkXCII839dHyAt/gpoSlm28JIVDwhZ6tnG6wJxUy2bmOx7UaPjvOyIDf3SFv5s7Eo7HVaq6kRcu6YMEzt5Z7w==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@rolldown/pluginutils": "1.0.0-rc.2",
+        "@rolldown/pluginutils": "1.0.0-rc.7",
         "@swc/core": "^1.15.11"
       },
       "engines": {
         "node": "^20.19.0 || >=22.12.0"
       },
       "peerDependencies": {
-        "vite": "^4 || ^5 || ^6 || ^7"
+        "vite": "^4 || ^5 || ^6 || ^7 || ^8"
       }
     },
     "node_modules/@vitest/coverage-v8": {
@@ -5423,13 +5468,13 @@
       }
     },
     "node_modules/@vue/compiler-core": {
-      "version": "3.5.29",
-      "resolved": "https://registry.npmjs.org/@vue/compiler-core/-/compiler-core-3.5.29.tgz",
-      "integrity": "sha512-cuzPhD8fwRHk8IGfmYaR4eEe4cAyJEL66Ove/WZL7yWNL134nqLddSLwNRIsFlnnW1kK+p8Ck3viFnC0chXCXw==",
+      "version": "3.5.30",
+      "resolved": "https://registry.npmjs.org/@vue/compiler-core/-/compiler-core-3.5.30.tgz",
+      "integrity": "sha512-s3DfdZkcu/qExZ+td75015ljzHc6vE+30cFMGRPROYjqkroYI5NV2X1yAMX9UeyBNWB9MxCfPcsjpLS11nzkkw==",
       "license": "MIT",
       "dependencies": {
         "@babel/parser": "^7.29.0",
-        "@vue/shared": "3.5.29",
+        "@vue/shared": "3.5.30",
         "entities": "^7.0.1",
         "estree-walker": "^2.0.2",
         "source-map-js": "^1.2.1"
@@ -5454,29 +5499,29 @@
       "license": "MIT"
     },
     "node_modules/@vue/compiler-dom": {
-      "version": "3.5.29",
-      "resolved": "https://registry.npmjs.org/@vue/compiler-dom/-/compiler-dom-3.5.29.tgz",
-      "integrity": "sha512-n0G5o7R3uBVmVxjTIYcz7ovr8sy7QObFG8OQJ3xGCDNhbG60biP/P5KnyY8NLd81OuT1WJflG7N4KWYHaeeaIg==",
+      "version": "3.5.30",
+      "resolved": "https://registry.npmjs.org/@vue/compiler-dom/-/compiler-dom-3.5.30.tgz",
+      "integrity": "sha512-eCFYESUEVYHhiMuK4SQTldO3RYxyMR/UQL4KdGD1Yrkfdx4m/HYuZ9jSfPdA+nWJY34VWndiYdW/wZXyiPEB9g==",
       "license": "MIT",
       "dependencies": {
-        "@vue/compiler-core": "3.5.29",
-        "@vue/shared": "3.5.29"
+        "@vue/compiler-core": "3.5.30",
+        "@vue/shared": "3.5.30"
       }
     },
     "node_modules/@vue/compiler-sfc": {
-      "version": "3.5.29",
-      "resolved": "https://registry.npmjs.org/@vue/compiler-sfc/-/compiler-sfc-3.5.29.tgz",
-      "integrity": "sha512-oJZhN5XJs35Gzr50E82jg2cYdZQ78wEwvRO6Y63TvLVTc+6xICzJHP1UIecdSPPYIbkautNBanDiWYa64QSFIA==",
+      "version": "3.5.30",
+      "resolved": "https://registry.npmjs.org/@vue/compiler-sfc/-/compiler-sfc-3.5.30.tgz",
+      "integrity": "sha512-LqmFPDn89dtU9vI3wHJnwaV6GfTRD87AjWpTWpyrdVOObVtjIuSeZr181z5C4PmVx/V3j2p+0f7edFKGRMpQ5A==",
       "license": "MIT",
       "dependencies": {
         "@babel/parser": "^7.29.0",
-        "@vue/compiler-core": "3.5.29",
-        "@vue/compiler-dom": "3.5.29",
-        "@vue/compiler-ssr": "3.5.29",
-        "@vue/shared": "3.5.29",
+        "@vue/compiler-core": "3.5.30",
+        "@vue/compiler-dom": "3.5.30",
+        "@vue/compiler-ssr": "3.5.30",
+        "@vue/shared": "3.5.30",
         "estree-walker": "^2.0.2",
         "magic-string": "^0.30.21",
-        "postcss": "^8.5.6",
+        "postcss": "^8.5.8",
         "source-map-js": "^1.2.1"
       }
     },
@@ -5487,67 +5532,67 @@
       "license": "MIT"
     },
     "node_modules/@vue/compiler-ssr": {
-      "version": "3.5.29",
-      "resolved": "https://registry.npmjs.org/@vue/compiler-ssr/-/compiler-ssr-3.5.29.tgz",
-      "integrity": "sha512-Y/ARJZE6fpjzL5GH/phJmsFwx3g6t2KmHKHx5q+MLl2kencADKIrhH5MLF6HHpRMmlRAYBRSvv347Mepf1zVNw==",
+      "version": "3.5.30",
+      "resolved": "https://registry.npmjs.org/@vue/compiler-ssr/-/compiler-ssr-3.5.30.tgz",
+      "integrity": "sha512-NsYK6OMTnx109PSL2IAyf62JP6EUdk4Dmj6AkWcJGBvN0dQoMYtVekAmdqgTtWQgEJo+Okstbf/1p7qZr5H+bA==",
       "license": "MIT",
       "dependencies": {
-        "@vue/compiler-dom": "3.5.29",
-        "@vue/shared": "3.5.29"
+        "@vue/compiler-dom": "3.5.30",
+        "@vue/shared": "3.5.30"
       }
     },
     "node_modules/@vue/reactivity": {
-      "version": "3.5.29",
-      "resolved": "https://registry.npmjs.org/@vue/reactivity/-/reactivity-3.5.29.tgz",
-      "integrity": "sha512-zcrANcrRdcLtmGZETBxWqIkoQei8HaFpZWx/GHKxx79JZsiZ8j1du0VUJtu4eJjgFvU/iKL5lRXFXksVmI+5DA==",
+      "version": "3.5.30",
+      "resolved": "https://registry.npmjs.org/@vue/reactivity/-/reactivity-3.5.30.tgz",
+      "integrity": "sha512-179YNgKATuwj9gB+66snskRDOitDiuOZqkYia7mHKJaidOMo/WJxHKF8DuGc4V4XbYTJANlfEKb0yxTQotnx4Q==",
       "license": "MIT",
       "peer": true,
       "dependencies": {
-        "@vue/shared": "3.5.29"
+        "@vue/shared": "3.5.30"
       }
     },
     "node_modules/@vue/runtime-core": {
-      "version": "3.5.29",
-      "resolved": "https://registry.npmjs.org/@vue/runtime-core/-/runtime-core-3.5.29.tgz",
-      "integrity": "sha512-8DpW2QfdwIWOLqtsNcds4s+QgwSaHSJY/SUe04LptianUQ/0xi6KVsu/pYVh+HO3NTVvVJjIPL2t6GdeKbS4Lg==",
+      "version": "3.5.30",
+      "resolved": "https://registry.npmjs.org/@vue/runtime-core/-/runtime-core-3.5.30.tgz",
+      "integrity": "sha512-e0Z+8PQsUTdwV8TtEsLzUM7SzC7lQwYKePydb7K2ZnmS6jjND+WJXkmmfh/swYzRyfP1EY3fpdesyYoymCzYfg==",
       "license": "MIT",
       "peer": true,
       "dependencies": {
-        "@vue/reactivity": "3.5.29",
-        "@vue/shared": "3.5.29"
+        "@vue/reactivity": "3.5.30",
+        "@vue/shared": "3.5.30"
       }
     },
     "node_modules/@vue/runtime-dom": {
-      "version": "3.5.29",
-      "resolved": "https://registry.npmjs.org/@vue/runtime-dom/-/runtime-dom-3.5.29.tgz",
-      "integrity": "sha512-AHvvJEtcY9tw/uk+s/YRLSlxxQnqnAkjqvK25ZiM4CllCZWzElRAoQnCM42m9AHRLNJ6oe2kC5DCgD4AUdlvXg==",
+      "version": "3.5.30",
+      "resolved": "https://registry.npmjs.org/@vue/runtime-dom/-/runtime-dom-3.5.30.tgz",
+      "integrity": "sha512-2UIGakjU4WSQ0T4iwDEW0W7vQj6n7AFn7taqZ9Cvm0Q/RA2FFOziLESrDL4GmtI1wV3jXg5nMoJSYO66egDUBw==",
       "license": "MIT",
       "peer": true,
       "dependencies": {
-        "@vue/reactivity": "3.5.29",
-        "@vue/runtime-core": "3.5.29",
-        "@vue/shared": "3.5.29",
+        "@vue/reactivity": "3.5.30",
+        "@vue/runtime-core": "3.5.30",
+        "@vue/shared": "3.5.30",
         "csstype": "^3.2.3"
       }
     },
     "node_modules/@vue/server-renderer": {
-      "version": "3.5.29",
-      "resolved": "https://registry.npmjs.org/@vue/server-renderer/-/server-renderer-3.5.29.tgz",
-      "integrity": "sha512-G/1k6WK5MusLlbxSE2YTcqAAezS+VuwHhOvLx2KnQU7G2zCH6KIb+5Wyt6UjMq7a3qPzNEjJXs1hvAxDclQH+g==",
+      "version": "3.5.30",
+      "resolved": "https://registry.npmjs.org/@vue/server-renderer/-/server-renderer-3.5.30.tgz",
+      "integrity": "sha512-v+R34icapydRwbZRD0sXwtHqrQJv38JuMB4JxbOxd8NEpGLny7cncMp53W9UH/zo4j8eDHjQ1dEJXwzFQknjtQ==",
       "license": "MIT",
       "peer": true,
       "dependencies": {
-        "@vue/compiler-ssr": "3.5.29",
-        "@vue/shared": "3.5.29"
+        "@vue/compiler-ssr": "3.5.30",
+        "@vue/shared": "3.5.30"
       },
       "peerDependencies": {
-        "vue": "3.5.29"
+        "vue": "3.5.30"
       }
     },
     "node_modules/@vue/shared": {
-      "version": "3.5.29",
-      "resolved": "https://registry.npmjs.org/@vue/shared/-/shared-3.5.29.tgz",
-      "integrity": "sha512-w7SR0A5zyRByL9XUkCfdLs7t9XOHUyJ67qPGQjOou3p6GvBeBW+AVjUUmlxtZ4PIYaRvE+1LmK44O4uajlZwcg==",
+      "version": "3.5.30",
+      "resolved": "https://registry.npmjs.org/@vue/shared/-/shared-3.5.30.tgz",
+      "integrity": "sha512-YXgQ7JjaO18NeK2K9VTbDHaFy62WrObMa6XERNfNOkAhD1F1oDSf3ZJ7K6GqabZ0BvSDHajp8qfS5Sa2I9n8uQ==",
       "license": "MIT"
     },
     "node_modules/abbrev": {
@@ -5728,9 +5773,9 @@
       }
     },
     "node_modules/ast-v8-to-istanbul": {
-      "version": "0.3.11",
-      "resolved": "https://registry.npmjs.org/ast-v8-to-istanbul/-/ast-v8-to-istanbul-0.3.11.tgz",
-      "integrity": "sha512-Qya9fkoofMjCBNVdWINMjB5KZvkYfaO9/anwkWnjxibpWUxo5iHl2sOdP7/uAqaRuUYuoo8rDwnbaaKVFxoUvw==",
+      "version": "0.3.12",
+      "resolved": "https://registry.npmjs.org/ast-v8-to-istanbul/-/ast-v8-to-istanbul-0.3.12.tgz",
+      "integrity": "sha512-BRRC8VRZY2R4Z4lFIL35MwNXmwVqBityvOIwETtsCSwvjl0IdgFsy9NhdaA6j74nUdtJJlIypeRhpDam19Wq3g==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -5762,9 +5807,9 @@
       }
     },
     "node_modules/autoprefixer": {
-      "version": "10.4.26",
-      "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-10.4.26.tgz",
-      "integrity": "sha512-c6Hxv5eR12gQmANICaAGM967LGOXZ4SVAuwkiDrqPqZ5oReOnj/ZBtj3dyfwAnEV5qbzspNzjMM8lZENDK8f5A==",
+      "version": "10.4.27",
+      "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-10.4.27.tgz",
+      "integrity": "sha512-NP9APE+tO+LuJGn7/9+cohklunJsXWiaWEfV3si4Gi/XHDwVNgkwr1J3RQYFIvPy76GmJ9/bW8vyoU1LcxwKHA==",
       "funding": [
         {
           "type": "opencollective",
@@ -5798,14 +5843,23 @@
       }
     },
     "node_modules/axios": {
-      "version": "1.13.5",
-      "resolved": "https://registry.npmjs.org/axios/-/axios-1.13.5.tgz",
-      "integrity": "sha512-cz4ur7Vb0xS4/KUN0tPWe44eqxrIu31me+fbang3ijiNscE129POzipJJA6zniq2C/Z6sJCjMimjS8Lc/GAs8Q==",
+      "version": "1.15.0",
+      "resolved": "https://registry.npmjs.org/axios/-/axios-1.15.0.tgz",
+      "integrity": "sha512-wWyJDlAatxk30ZJer+GeCWS209sA42X+N5jU2jy6oHTp7ufw8uzUTVFBX9+wTfAlhiJXGS0Bq7X6efruWjuK9Q==",
       "license": "MIT",
       "dependencies": {
         "follow-redirects": "^1.15.11",
         "form-data": "^4.0.5",
-        "proxy-from-env": "^1.1.0"
+        "proxy-from-env": "^2.1.0"
+      }
+    },
+    "node_modules/axios/node_modules/proxy-from-env": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/proxy-from-env/-/proxy-from-env-2.1.0.tgz",
+      "integrity": "sha512-cJ+oHTW1VAEa8cJslgmUZrc+sjRKgAKl3Zyse6+PV38hZe/V6Z14TbCuXcan9F9ghlz4QrFr2c92TNF82UkYHA==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=10"
       }
     },
     "node_modules/axobject-query": {
@@ -5874,12 +5928,11 @@
       }
     },
     "node_modules/bare-fs": {
-      "version": "4.5.5",
-      "resolved": "https://registry.npmjs.org/bare-fs/-/bare-fs-4.5.5.tgz",
-      "integrity": "sha512-XvwYM6VZqKoqDll8BmSww5luA5eflDzY0uEFfBJtFKe4PAAtxBjU3YIxzIBzhyaEQBy1VXEQBto4cpN5RZJw+w==",
+      "version": "4.5.6",
+      "resolved": "https://registry.npmjs.org/bare-fs/-/bare-fs-4.5.6.tgz",
+      "integrity": "sha512-1QovqDrR80Pmt5HPAsMsXTCFcDYr+NSUKW6nd6WO5v0JBmnItc/irNRzm2KOQ5oZ69P37y+AMujNyNtG+1Rggw==",
       "dev": true,
       "license": "Apache-2.0",
-      "optional": true,
       "dependencies": {
         "bare-events": "^2.5.4",
         "bare-path": "^3.0.0",
@@ -5900,12 +5953,11 @@
       }
     },
     "node_modules/bare-os": {
-      "version": "3.7.0",
-      "resolved": "https://registry.npmjs.org/bare-os/-/bare-os-3.7.0.tgz",
-      "integrity": "sha512-64Rcwj8qlnTZU8Ps6JJEdSmxBEUGgI7g8l+lMtsJLl4IsfTcHMTfJ188u2iGV6P6YPRZrtv72B2kjn+hp+Yv3g==",
+      "version": "3.8.0",
+      "resolved": "https://registry.npmjs.org/bare-os/-/bare-os-3.8.0.tgz",
+      "integrity": "sha512-Dc9/SlwfxkXIGYhvMQNUtKaXCaGkZYGcd1vuNUUADVqzu4/vQfvnMkYYOUnt2VwQ2AqKr/8qAVFRtwETljgeFg==",
       "dev": true,
       "license": "Apache-2.0",
-      "optional": true,
       "engines": {
         "bare": ">=1.14.0"
       }
@@ -5916,20 +5968,18 @@
       "integrity": "sha512-tyfW2cQcB5NN8Saijrhqn0Zh7AnFNsnczRcuWODH0eYAXBsJ5gVxAUuNr7tsHSC6IZ77cA0SitzT+s47kot8Mw==",
       "dev": true,
       "license": "Apache-2.0",
-      "optional": true,
       "dependencies": {
         "bare-os": "^3.0.1"
       }
     },
     "node_modules/bare-stream": {
-      "version": "2.8.0",
-      "resolved": "https://registry.npmjs.org/bare-stream/-/bare-stream-2.8.0.tgz",
-      "integrity": "sha512-reUN0M2sHRqCdG4lUK3Fw8w98eeUIZHL5c3H7Mbhk2yVBL+oofgaIp0ieLfD5QXwPCypBpmEEKU2WZKzbAk8GA==",
+      "version": "2.10.0",
+      "resolved": "https://registry.npmjs.org/bare-stream/-/bare-stream-2.10.0.tgz",
+      "integrity": "sha512-DOPZF/DDcDruKDA43cOw6e9Quq5daua7ygcAwJE/pKJsRWhgSSemi7qVNGE5kyDIxIeN1533G/zfbvWX7Wcb9w==",
       "dev": true,
       "license": "Apache-2.0",
-      "optional": true,
       "dependencies": {
-        "streamx": "^2.21.0",
+        "streamx": "^2.25.0",
         "teex": "^1.0.1"
       },
       "peerDependencies": {
@@ -5946,12 +5996,11 @@
       }
     },
     "node_modules/bare-url": {
-      "version": "2.3.2",
-      "resolved": "https://registry.npmjs.org/bare-url/-/bare-url-2.3.2.tgz",
-      "integrity": "sha512-ZMq4gd9ngV5aTMa5p9+UfY0b3skwhHELaDkhEHetMdX0LRkW9kzaym4oo/Eh+Ghm0CCDuMTsRIGM/ytUc1ZYmw==",
+      "version": "2.4.0",
+      "resolved": "https://registry.npmjs.org/bare-url/-/bare-url-2.4.0.tgz",
+      "integrity": "sha512-NSTU5WN+fy/L0DDenfE8SXQna4voXuW0FHM7wH8i3/q9khUSchfPbPezO4zSFMnDGIf9YE+mt/RWhZgNRKRIXA==",
       "dev": true,
       "license": "Apache-2.0",
-      "optional": true,
       "dependencies": {
         "bare-path": "^3.0.0"
       }
@@ -5978,9 +6027,9 @@
       "license": "MIT"
     },
     "node_modules/baseline-browser-mapping": {
-      "version": "2.10.0",
-      "resolved": "https://registry.npmjs.org/baseline-browser-mapping/-/baseline-browser-mapping-2.10.0.tgz",
-      "integrity": "sha512-lIyg0szRfYbiy67j9KN8IyeD7q7hcmqnJ1ddWmNt19ItGpNN64mnllmxUNFIOdOm6by97jlL6wfpTTJrmnjWAA==",
+      "version": "2.10.10",
+      "resolved": "https://registry.npmjs.org/baseline-browser-mapping/-/baseline-browser-mapping-2.10.10.tgz",
+      "integrity": "sha512-sUoJ3IMxx4AyRqO4MLeHlnGDkyXRoUG0/AI9fjK+vS72ekpV0yWVY7O0BVjmBcRtkNcsAO2QDZ4tdKKGoI6YaQ==",
       "license": "Apache-2.0",
       "bin": {
         "baseline-browser-mapping": "dist/cli.cjs"
@@ -6056,9 +6105,9 @@
       }
     },
     "node_modules/brace-expansion": {
-      "version": "5.0.3",
-      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-5.0.3.tgz",
-      "integrity": "sha512-fy6KJm2RawA5RcHkLa1z/ScpBeA762UF9KmZQxwIbDtRJrgLzM10depAiEQ+CXYcoiqW1/m96OAAoke2nE9EeA==",
+      "version": "5.0.4",
+      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-5.0.4.tgz",
+      "integrity": "sha512-h+DEnpVvxmfVefa4jFbCf5HdH5YMDXRsmKflpf1pILZWRFlTbJpxeU55nJl4Smt5HQaGzg1o6RHFPJaOqnmBDg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -6240,9 +6289,9 @@
       }
     },
     "node_modules/caniuse-lite": {
-      "version": "1.0.30001774",
-      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001774.tgz",
-      "integrity": "sha512-DDdwPGz99nmIEv216hKSgLD+D4ikHQHjBC/seF98N9CPqRX4M5mSxT9eTV6oyisnJcuzxtZy4n17yKKQYmYQOA==",
+      "version": "1.0.30001781",
+      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001781.tgz",
+      "integrity": "sha512-RdwNCyMsNBftLjW6w01z8bKEvT6e/5tpPVEgtn22TiLGlstHOVecsX2KHFkD5e/vRnIE4EGzpuIODb3mtswtkw==",
       "funding": [
         {
           "type": "opencollective",
@@ -6577,9 +6626,9 @@
       }
     },
     "node_modules/core-js": {
-      "version": "3.48.0",
-      "resolved": "https://registry.npmjs.org/core-js/-/core-js-3.48.0.tgz",
-      "integrity": "sha512-zpEHTy1fjTMZCKLHUZoVeylt9XrzaIN2rbPXEt0k+q7JE5CkCZdo6bNq55bn24a69CH7ErAVLKijxJja4fw+UQ==",
+      "version": "3.49.0",
+      "resolved": "https://registry.npmjs.org/core-js/-/core-js-3.49.0.tgz",
+      "integrity": "sha512-es1U2+YTtzpwkxVLwAFdSpaIMyQaq0PBgm3YD1W3Qpsn1NAmO3KSgZfu+oGSWVu6NvLHoHCV/aYcsE5wiB7ALg==",
       "hasInstallScript": true,
       "license": "MIT",
       "funding": {
@@ -6610,9 +6659,9 @@
       }
     },
     "node_modules/cosmiconfig/node_modules/yaml": {
-      "version": "1.10.2",
-      "resolved": "https://registry.npmjs.org/yaml/-/yaml-1.10.2.tgz",
-      "integrity": "sha512-r3vXyErRCYJ7wg28yvBY5VSoAF8ZvlcW9/BwUzEtUsjvX/DKs24dIkuwjtuprwJJHsbyUbLApepYTR1BN4uHrg==",
+      "version": "1.10.3",
+      "resolved": "https://registry.npmjs.org/yaml/-/yaml-1.10.3.tgz",
+      "integrity": "sha512-vIYeF1u3CjlhAFekPPAk2h/Kv4T3mAkMox5OymRiJQB0spDP10LHvt+K7G9Ny6NuuMAb25/6n1qyUjAcGNf/AA==",
       "license": "ISC",
       "engines": {
         "node": ">= 6"
@@ -6639,14 +6688,14 @@
       "license": "MIT"
     },
     "node_modules/css-tree": {
-      "version": "3.1.0",
-      "resolved": "https://registry.npmjs.org/css-tree/-/css-tree-3.1.0.tgz",
-      "integrity": "sha512-0eW44TGN5SQXU1mWSkKwFstI/22X2bG1nYzZTYMAWjylYURhse752YgbE4Cx46AC+bAvI+/dYTPRk1LqSUnu6w==",
+      "version": "3.2.1",
+      "resolved": "https://registry.npmjs.org/css-tree/-/css-tree-3.2.1.tgz",
+      "integrity": "sha512-X7sjQzceUhu1u7Y/ylrRZFU2FS6LRiFVp6rKLPg23y3x3c3DOKAwuXGDp+PAGjh6CSnCjYeAul8pcT8bAl+lSA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "mdn-data": "2.12.2",
-        "source-map-js": "^1.0.1"
+        "mdn-data": "2.27.1",
+        "source-map-js": "^1.2.1"
       },
       "engines": {
         "node": "^10 || ^12.20.0 || ^14.13.0 || >=15.0.0"
@@ -7130,9 +7179,9 @@
       }
     },
     "node_modules/dayjs": {
-      "version": "1.11.19",
-      "resolved": "https://registry.npmjs.org/dayjs/-/dayjs-1.11.19.tgz",
-      "integrity": "sha512-t5EcLVS6QPBNqM2z8fakk/NKel+Xzshgt8FFKAn+qwlD1pzZWxh0nVCrvFK7ZDb6XucZeF9z8C7CBWTRIVApAw==",
+      "version": "1.11.20",
+      "resolved": "https://registry.npmjs.org/dayjs/-/dayjs-1.11.20.tgz",
+      "integrity": "sha512-YbwwqR/uYpeoP4pu043q+LTDLFBLApUP6VxRihdfNTqu4ubqMlGDLd6ErXhEgsyvY0K6nCs7nggYumAN+9uEuQ==",
       "license": "MIT",
       "peer": true
     },
@@ -7247,9 +7296,9 @@
       }
     },
     "node_modules/delaunator": {
-      "version": "5.0.1",
-      "resolved": "https://registry.npmjs.org/delaunator/-/delaunator-5.0.1.tgz",
-      "integrity": "sha512-8nvh+XBe96aCESrGOqMp/84b13H9cdKbG5P2ejQCh4d4sK9RL4371qou9drQjMhvnPmhWl5hnmqbEE0fXr9Xnw==",
+      "version": "5.1.0",
+      "resolved": "https://registry.npmjs.org/delaunator/-/delaunator-5.1.0.tgz",
+      "integrity": "sha512-AGrQ4QSgssa1NGmWmLPqN5NY2KajF5MqxetNEO+o0n3ZwZZeTmt7bBnvzHWrmkZFxGgr4HdyFgelzgi06otLuQ==",
       "license": "ISC",
       "dependencies": {
         "robust-predicates": "^3.0.2"
@@ -7275,14 +7324,14 @@
       }
     },
     "node_modules/dependency-tree": {
-      "version": "11.3.0",
-      "resolved": "https://registry.npmjs.org/dependency-tree/-/dependency-tree-11.3.0.tgz",
-      "integrity": "sha512-T893F3p48rblazo45S/5jkFEvU8mzZ8obtNSyP2S1QCA8e9PpVH+hIakHnQYdnhitwQ8wo9btYJpQxnjiGm0Qg==",
+      "version": "11.4.0",
+      "resolved": "https://registry.npmjs.org/dependency-tree/-/dependency-tree-11.4.0.tgz",
+      "integrity": "sha512-r4wZ1pfv8eQrnoWbIGdrJTVmlb0dkXdwBjKsotKO4gmfqrOsAMG+0+cfA5EZ3NO8umc85twXOl1eO27E5pjTzw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
         "commander": "^12.1.0",
-        "filing-cabinet": "^5.1.0",
+        "filing-cabinet": "^5.2.0",
         "precinct": "^12.2.0",
         "typescript": "^5.9.3"
       },
@@ -7348,9 +7397,9 @@
       }
     },
     "node_modules/detective-cjs": {
-      "version": "6.0.1",
-      "resolved": "https://registry.npmjs.org/detective-cjs/-/detective-cjs-6.0.1.tgz",
-      "integrity": "sha512-tLTQsWvd2WMcmn/60T2inEJNhJoi7a//PQ7DwRKEj1yEeiQs4mrONgsUtEJKnZmrGWBBmE0kJ1vqOG/NAxwaJw==",
+      "version": "6.1.0",
+      "resolved": "https://registry.npmjs.org/detective-cjs/-/detective-cjs-6.1.0.tgz",
+      "integrity": "sha512-Qt3S4IddVNDb+71lm+jmt5NznIsgcKlibTnrw9Zr91rT9vRwKp+73+ImqLTNrQj4YuOxnzrC7GwIAVwF7136XQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -7470,16 +7519,16 @@
       }
     },
     "node_modules/devalue": {
-      "version": "5.6.3",
-      "resolved": "https://registry.npmjs.org/devalue/-/devalue-5.6.3.tgz",
-      "integrity": "sha512-nc7XjUU/2Lb+SvEFVGcWLiKkzfw8+qHI7zn8WYXKkLMgfGSHbgCEaR6bJpev8Cm6Rmrb19Gfd/tZvGqx9is3wg==",
+      "version": "5.6.4",
+      "resolved": "https://registry.npmjs.org/devalue/-/devalue-5.6.4.tgz",
+      "integrity": "sha512-Gp6rDldRsFh/7XuouDbxMH3Mx8GMCcgzIb1pDTvNyn8pZGQ22u+Wa+lGV9dQCltFQ7uVw0MhRyb8XDskNFOReA==",
       "license": "MIT",
       "peer": true
     },
     "node_modules/devtools-protocol": {
-      "version": "0.0.1566079",
-      "resolved": "https://registry.npmjs.org/devtools-protocol/-/devtools-protocol-0.0.1566079.tgz",
-      "integrity": "sha512-MJfAEA1UfVhSs7fbSQOG4czavUp1ajfg6prlAN0+cmfa2zNjaIbvq8VneP7do1WAQQIvgNJWSMeP6UyI90gIlQ==",
+      "version": "0.0.1581282",
+      "resolved": "https://registry.npmjs.org/devtools-protocol/-/devtools-protocol-0.0.1581282.tgz",
+      "integrity": "sha512-nv7iKtNZQshSW2hKzYNr46nM/Cfh5SEvE2oV0/SEGgc9XupIY5ggf84Cz8eJIkBce7S3bmTAauFD6aysMpnqsQ==",
       "dev": true,
       "license": "BSD-3-Clause"
     },
@@ -7512,9 +7561,9 @@
       }
     },
     "node_modules/dompurify": {
-      "version": "3.3.1",
-      "resolved": "https://registry.npmjs.org/dompurify/-/dompurify-3.3.1.tgz",
-      "integrity": "sha512-qkdCKzLNtrgPFP1Vo+98FRzJnBRGe4ffyCea9IwHB1fyxPOeNTHpLKYGd4Uk9xvNoH0ZoOjwZxNptyMwqrId1Q==",
+      "version": "3.3.3",
+      "resolved": "https://registry.npmjs.org/dompurify/-/dompurify-3.3.3.tgz",
+      "integrity": "sha512-Oj6pzI2+RqBfFG+qOaOLbFXLQ90ARpcGG6UePL82bJLtdsa6CYJD7nmiU8MW9nQNOtCHV3lZ/Bzq1X0QYbBZCA==",
       "license": "(MPL-2.0 OR Apache-2.0)",
       "optionalDependencies": {
         "@types/trusted-types": "^2.0.7"
@@ -7552,61 +7601,6 @@
         "dpdm": "lib/bin/dpdm.js"
       }
     },
-    "node_modules/dpdm/node_modules/balanced-match": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz",
-      "integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==",
-      "dev": true,
-      "license": "MIT"
-    },
-    "node_modules/dpdm/node_modules/brace-expansion": {
-      "version": "2.0.2",
-      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.2.tgz",
-      "integrity": "sha512-Jt0vHyM+jmUBqojB7E1NIYadt0vI0Qxjxd2TErW94wDz+E2LAm5vKMXXwg6ZZBTHPuUlDgQHKXvjGBdfcF1ZDQ==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "balanced-match": "^1.0.0"
-      }
-    },
-    "node_modules/dpdm/node_modules/glob": {
-      "version": "10.5.0",
-      "resolved": "https://registry.npmjs.org/glob/-/glob-10.5.0.tgz",
-      "integrity": "sha512-DfXN8DfhJ7NH3Oe7cFmu3NCu1wKbkReJ8TorzSAFbSKrlNaQSKfIzqYqVY8zlbs2NLBbWpRiU52GX2PbaBVNkg==",
-      "deprecated": "Old versions of glob are not supported, and contain widely publicized security vulnerabilities, which have been fixed in the current version. Please update. Support for old versions may be purchased (at exorbitant rates) by contacting i@izs.me",
-      "dev": true,
-      "license": "ISC",
-      "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"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/isaacs"
-      }
-    },
-    "node_modules/dpdm/node_modules/minimatch": {
-      "version": "9.0.9",
-      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.9.tgz",
-      "integrity": "sha512-OBwBN9AL4dqmETlpS2zasx+vTeWclWzkblfZk7KTA5j3jeOONz/tRCnZomUyvNg83wL5Zv9Ss6HMJXAgL8R2Yg==",
-      "dev": true,
-      "license": "ISC",
-      "dependencies": {
-        "brace-expansion": "^2.0.2"
-      },
-      "engines": {
-        "node": ">=16 || 14 >=14.17"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/isaacs"
-      }
-    },
     "node_modules/dunder-proto": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/dunder-proto/-/dunder-proto-1.0.1.tgz",
@@ -7629,9 +7623,9 @@
       "license": "MIT"
     },
     "node_modules/electron-to-chromium": {
-      "version": "1.5.302",
-      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.302.tgz",
-      "integrity": "sha512-sM6HAN2LyK82IyPBpznDRqlTQAtuSaO+ShzFiWTvoMJLHyZ+Y39r8VMfHzwbU8MVBzQ4Wdn85+wlZl2TLGIlwg==",
+      "version": "1.5.321",
+      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.321.tgz",
+      "integrity": "sha512-L2C7Q279W2D/J4PLZLk7sebOILDSWos7bMsMNN06rK482umHUrh/3lM8G7IlHFOYip2oAg5nha1rCMxr/rs6ZQ==",
       "license": "ISC"
     },
     "node_modules/emoji-regex": {
@@ -7652,9 +7646,9 @@
       }
     },
     "node_modules/enhanced-resolve": {
-      "version": "5.19.0",
-      "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-5.19.0.tgz",
-      "integrity": "sha512-phv3E1Xl4tQOShqSte26C7Fl84EwUdZsyOuSSk9qtAGyyQs2s3jJzComh+Abf4g187lUUAvH+H26omrqia2aGg==",
+      "version": "5.20.1",
+      "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-5.20.1.tgz",
+      "integrity": "sha512-Qohcme7V1inbAfvjItgw0EaxVX5q2rdVEZHRBrEQdRZTssLDGsL8Lwrznl8oQ/6kuTJONLaDcGjkNP247XEhcA==",
       "license": "MIT",
       "dependencies": {
         "graceful-fs": "^4.2.4",
@@ -7758,9 +7752,9 @@
       }
     },
     "node_modules/es-toolkit": {
-      "version": "1.44.0",
-      "resolved": "https://registry.npmjs.org/es-toolkit/-/es-toolkit-1.44.0.tgz",
-      "integrity": "sha512-6penXeZalaV88MM3cGkFZZfOoLGWshWWfdy0tWw/RlVVyhvMaWSBTOvXNeiW3e5FwdS5ePW0LGEu17zT139ktg==",
+      "version": "1.45.1",
+      "resolved": "https://registry.npmjs.org/es-toolkit/-/es-toolkit-1.45.1.tgz",
+      "integrity": "sha512-/jhoOj/Fx+A+IIyDNOvO3TItGmlMKhtX8ISAHKE90c4b/k1tqaqEZ+uUqfpU8DMnW5cgNJv606zS55jGvza0Xw==",
       "license": "MIT",
       "workspaces": [
         "docs",
@@ -7768,9 +7762,9 @@
       ]
     },
     "node_modules/esbuild": {
-      "version": "0.27.3",
-      "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.27.3.tgz",
-      "integrity": "sha512-8VwMnyGCONIs6cWue2IdpHxHnAjzxnw2Zr7MkVxB2vjmQ2ivqGFb4LEG3SMnv0Gb2F/G/2yA8zUaiL1gywDCCg==",
+      "version": "0.27.4",
+      "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.27.4.tgz",
+      "integrity": "sha512-Rq4vbHnYkK5fws5NF7MYTU68FPRE1ajX7heQ/8QXXWqNgqqJ/GkmmyxIzUnf2Sr/bakf8l54716CcMGHYhMrrQ==",
       "dev": true,
       "hasInstallScript": true,
       "license": "MIT",
@@ -7781,32 +7775,32 @@
         "node": ">=18"
       },
       "optionalDependencies": {
-        "@esbuild/aix-ppc64": "0.27.3",
-        "@esbuild/android-arm": "0.27.3",
-        "@esbuild/android-arm64": "0.27.3",
-        "@esbuild/android-x64": "0.27.3",
-        "@esbuild/darwin-arm64": "0.27.3",
-        "@esbuild/darwin-x64": "0.27.3",
-        "@esbuild/freebsd-arm64": "0.27.3",
-        "@esbuild/freebsd-x64": "0.27.3",
-        "@esbuild/linux-arm": "0.27.3",
-        "@esbuild/linux-arm64": "0.27.3",
-        "@esbuild/linux-ia32": "0.27.3",
-        "@esbuild/linux-loong64": "0.27.3",
-        "@esbuild/linux-mips64el": "0.27.3",
-        "@esbuild/linux-ppc64": "0.27.3",
-        "@esbuild/linux-riscv64": "0.27.3",
-        "@esbuild/linux-s390x": "0.27.3",
-        "@esbuild/linux-x64": "0.27.3",
-        "@esbuild/netbsd-arm64": "0.27.3",
-        "@esbuild/netbsd-x64": "0.27.3",
-        "@esbuild/openbsd-arm64": "0.27.3",
-        "@esbuild/openbsd-x64": "0.27.3",
-        "@esbuild/openharmony-arm64": "0.27.3",
-        "@esbuild/sunos-x64": "0.27.3",
-        "@esbuild/win32-arm64": "0.27.3",
-        "@esbuild/win32-ia32": "0.27.3",
-        "@esbuild/win32-x64": "0.27.3"
+        "@esbuild/aix-ppc64": "0.27.4",
+        "@esbuild/android-arm": "0.27.4",
+        "@esbuild/android-arm64": "0.27.4",
+        "@esbuild/android-x64": "0.27.4",
+        "@esbuild/darwin-arm64": "0.27.4",
+        "@esbuild/darwin-x64": "0.27.4",
+        "@esbuild/freebsd-arm64": "0.27.4",
+        "@esbuild/freebsd-x64": "0.27.4",
+        "@esbuild/linux-arm": "0.27.4",
+        "@esbuild/linux-arm64": "0.27.4",
+        "@esbuild/linux-ia32": "0.27.4",
+        "@esbuild/linux-loong64": "0.27.4",
+        "@esbuild/linux-mips64el": "0.27.4",
+        "@esbuild/linux-ppc64": "0.27.4",
+        "@esbuild/linux-riscv64": "0.27.4",
+        "@esbuild/linux-s390x": "0.27.4",
+        "@esbuild/linux-x64": "0.27.4",
+        "@esbuild/netbsd-arm64": "0.27.4",
+        "@esbuild/netbsd-x64": "0.27.4",
+        "@esbuild/openbsd-arm64": "0.27.4",
+        "@esbuild/openbsd-x64": "0.27.4",
+        "@esbuild/openharmony-arm64": "0.27.4",
+        "@esbuild/sunos-x64": "0.27.4",
+        "@esbuild/win32-arm64": "0.27.4",
+        "@esbuild/win32-ia32": "0.27.4",
+        "@esbuild/win32-x64": "0.27.4"
       }
     },
     "node_modules/escalade": {
@@ -7864,18 +7858,18 @@
       }
     },
     "node_modules/eslint": {
-      "version": "10.0.2",
-      "resolved": "https://registry.npmjs.org/eslint/-/eslint-10.0.2.tgz",
-      "integrity": "sha512-uYixubwmqJZH+KLVYIVKY1JQt7tysXhtj21WSvjcSmU5SVNzMus1bgLe+pAt816yQ8opKfheVVoPLqvVMGejYw==",
+      "version": "10.1.0",
+      "resolved": "https://registry.npmjs.org/eslint/-/eslint-10.1.0.tgz",
+      "integrity": "sha512-S9jlY/ELKEUwwQnqWDO+f+m6sercqOPSqXM5Go94l7DOmxHVDgmSFGWEzeE/gwgTAr0W103BWt0QLe/7mabIvA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
         "@eslint-community/eslint-utils": "^4.8.0",
         "@eslint-community/regexpp": "^4.12.2",
-        "@eslint/config-array": "^0.23.2",
-        "@eslint/config-helpers": "^0.5.2",
-        "@eslint/core": "^1.1.0",
-        "@eslint/plugin-kit": "^0.6.0",
+        "@eslint/config-array": "^0.23.3",
+        "@eslint/config-helpers": "^0.5.3",
+        "@eslint/core": "^1.1.1",
+        "@eslint/plugin-kit": "^0.6.1",
         "@humanfs/node": "^0.16.6",
         "@humanwhocodes/module-importer": "^1.0.1",
         "@humanwhocodes/retry": "^0.4.2",
@@ -7884,9 +7878,9 @@
         "cross-spawn": "^7.0.6",
         "debug": "^4.3.2",
         "escape-string-regexp": "^4.0.0",
-        "eslint-scope": "^9.1.1",
+        "eslint-scope": "^9.1.2",
         "eslint-visitor-keys": "^5.0.1",
-        "espree": "^11.1.1",
+        "espree": "^11.2.0",
         "esquery": "^1.7.0",
         "esutils": "^2.0.2",
         "fast-deep-equal": "^3.1.3",
@@ -7897,7 +7891,7 @@
         "imurmurhash": "^0.1.4",
         "is-glob": "^4.0.0",
         "json-stable-stringify-without-jsonify": "^1.0.1",
-        "minimatch": "^10.2.1",
+        "minimatch": "^10.2.4",
         "natural-compare": "^1.4.0",
         "optionator": "^0.9.3"
       },
@@ -7920,9 +7914,9 @@
       }
     },
     "node_modules/eslint-scope": {
-      "version": "9.1.1",
-      "resolved": "https://registry.npmjs.org/eslint-scope/-/eslint-scope-9.1.1.tgz",
-      "integrity": "sha512-GaUN0sWim5qc8KVErfPBWmc31LEsOkrUJbvJZV+xuL3u2phMUK4HIvXlWAakfC8W4nzlK+chPEAkYOYb5ZScIw==",
+      "version": "9.1.2",
+      "resolved": "https://registry.npmjs.org/eslint-scope/-/eslint-scope-9.1.2.tgz",
+      "integrity": "sha512-xS90H51cKw0jltxmvmHy2Iai1LIqrfbw57b79w/J7MfvDfkIkFZ+kj6zC3BjtUwh150HsSSdxXZcsuv72miDFQ==",
       "dev": true,
       "license": "BSD-2-Clause",
       "dependencies": {
@@ -7982,9 +7976,9 @@
       "peer": true
     },
     "node_modules/espree": {
-      "version": "11.1.1",
-      "resolved": "https://registry.npmjs.org/espree/-/espree-11.1.1.tgz",
-      "integrity": "sha512-AVHPqQoZYc+RUM4/3Ly5udlZY/U4LS8pIG05jEjWM2lQMU/oaZ7qshzAl2YP1tfNmXfftH3ohurfwNAug+MnsQ==",
+      "version": "11.2.0",
+      "resolved": "https://registry.npmjs.org/espree/-/espree-11.2.0.tgz",
+      "integrity": "sha512-7p3DrVEIopW1B1avAGLuCSh1jubc01H2JHc8B4qqGblmg5gI9yumBgACjWo4JlIc04ufug4xJ3SQI8HkS/Rgzw==",
       "dev": true,
       "license": "BSD-2-Clause",
       "dependencies": {
@@ -8040,13 +8034,14 @@
       }
     },
     "node_modules/esrap": {
-      "version": "2.2.3",
-      "resolved": "https://registry.npmjs.org/esrap/-/esrap-2.2.3.tgz",
-      "integrity": "sha512-8fOS+GIGCQZl/ZIlhl59htOlms6U8NvX6ZYgYHpRU/b6tVSh3uHkOHZikl3D4cMbYM0JlpBe+p/BkZEi8J9XIQ==",
+      "version": "2.2.4",
+      "resolved": "https://registry.npmjs.org/esrap/-/esrap-2.2.4.tgz",
+      "integrity": "sha512-suICpxAmZ9A8bzJjEl/+rLJiDKC0X4gYWUxT6URAWBLvlXmtbZd5ySMu/N2ZGEtMCAmflUDPSehrP9BQcsGcSg==",
       "license": "MIT",
       "peer": true,
       "dependencies": {
-        "@jridgewell/sourcemap-codec": "^1.4.15"
+        "@jridgewell/sourcemap-codec": "^1.4.15",
+        "@typescript-eslint/types": "^8.2.0"
       }
     },
     "node_modules/esrecurse": {
@@ -8225,17 +8220,17 @@
       }
     },
     "node_modules/filing-cabinet": {
-      "version": "5.1.0",
-      "resolved": "https://registry.npmjs.org/filing-cabinet/-/filing-cabinet-5.1.0.tgz",
-      "integrity": "sha512-xA3nKuR0N762AtUloSEbq4T+tOqNf1rZ3vgPW8Sijurqz9rvArjTpZhfrV1OxSrhX6OUoDGAONXo6liKZTNXKQ==",
+      "version": "5.2.0",
+      "resolved": "https://registry.npmjs.org/filing-cabinet/-/filing-cabinet-5.2.0.tgz",
+      "integrity": "sha512-eNrCJGdYQY0tV+ACNesQ7vb2aMxD76NM7THayMn0Z5XBt1Tonr4vbVN+FbhHfekKGQG9O5UaciDDR7+dw8P9ZA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
         "app-module-path": "^2.2.0",
         "commander": "^12.1.0",
-        "enhanced-resolve": "^5.19.0",
+        "enhanced-resolve": "^5.20.0",
         "module-definition": "^6.0.1",
-        "module-lookup-amd": "^9.1.0",
+        "module-lookup-amd": "^9.1.1",
         "resolve": "^1.22.11",
         "resolve-dependency-path": "^4.0.1",
         "sass-lookup": "^6.1.0",
@@ -8323,9 +8318,9 @@
       }
     },
     "node_modules/flatted": {
-      "version": "3.3.3",
-      "resolved": "https://registry.npmjs.org/flatted/-/flatted-3.3.3.tgz",
-      "integrity": "sha512-GX+ysw4PBCz0PzosHDepZGANEuFCMLrnRTiEy9McGjmkCQYwRq4A/X786G/fjM/+OjsWSU1ZrY5qyARZmO/uwg==",
+      "version": "3.4.2",
+      "resolved": "https://registry.npmjs.org/flatted/-/flatted-3.4.2.tgz",
+      "integrity": "sha512-PjDse7RzhcPkIJwy5t7KPWQSZ9cAbzQXcafsetQoD7sOJRQlGikNbx7yZp2OotDnJyrDcbyRq3Ttb18iYOqkxA==",
       "dev": true,
       "license": "ISC"
     },
@@ -8405,9 +8400,9 @@
       }
     },
     "node_modules/fs-extra": {
-      "version": "11.3.3",
-      "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-11.3.3.tgz",
-      "integrity": "sha512-VWSRii4t0AFm6ixFFmLLx1t7wS1gh+ckoa84aOeapGum0h+EZd1EhEumSB+ZdDLnEPuucsVB9oB7cxJHap6Afg==",
+      "version": "11.3.4",
+      "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-11.3.4.tgz",
+      "integrity": "sha512-CTXd6rk/M3/ULNQj8FBqBWHYBVYybQ3VPBw0xGKFe3tuH7ytT6ACnvzpIQ3UZtB8yvUKC2cXn1a+x+5EVQLovA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -8556,9 +8551,9 @@
       }
     },
     "node_modules/get-tsconfig": {
-      "version": "4.13.6",
-      "resolved": "https://registry.npmjs.org/get-tsconfig/-/get-tsconfig-4.13.6.tgz",
-      "integrity": "sha512-shZT/QMiSHc/YBLxxOkMtgSid5HFoauqCE3/exfsEcwg1WkeqjG+V40yBbBrsD+jW2HDXcs28xOfcbm2jI8Ddw==",
+      "version": "4.13.7",
+      "resolved": "https://registry.npmjs.org/get-tsconfig/-/get-tsconfig-4.13.7.tgz",
+      "integrity": "sha512-7tN6rFgBlMgpBML5j8typ92BKFi2sFQvIdpAqLA2beia5avZDrMs0FLZiM5etShWq5irVyGcGMEA1jcDaK7A/Q==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -8583,6 +8578,28 @@
         "node": ">= 14"
       }
     },
+    "node_modules/glob": {
+      "version": "10.5.0",
+      "resolved": "https://registry.npmjs.org/glob/-/glob-10.5.0.tgz",
+      "integrity": "sha512-DfXN8DfhJ7NH3Oe7cFmu3NCu1wKbkReJ8TorzSAFbSKrlNaQSKfIzqYqVY8zlbs2NLBbWpRiU52GX2PbaBVNkg==",
+      "deprecated": "Old versions of glob are not supported, and contain widely publicized security vulnerabilities, which have been fixed in the current version. Please update. Support for old versions may be purchased (at exorbitant rates) by contacting i@izs.me",
+      "dev": true,
+      "license": "ISC",
+      "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"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/isaacs"
+      }
+    },
     "node_modules/glob-parent": {
       "version": "6.0.2",
       "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-6.0.2.tgz",
@@ -8596,10 +8613,43 @@
         "node": ">=10.13.0"
       }
     },
+    "node_modules/glob/node_modules/balanced-match": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz",
+      "integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/glob/node_modules/brace-expansion": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.2.tgz",
+      "integrity": "sha512-Jt0vHyM+jmUBqojB7E1NIYadt0vI0Qxjxd2TErW94wDz+E2LAm5vKMXXwg6ZZBTHPuUlDgQHKXvjGBdfcF1ZDQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "balanced-match": "^1.0.0"
+      }
+    },
+    "node_modules/glob/node_modules/minimatch": {
+      "version": "9.0.9",
+      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.9.tgz",
+      "integrity": "sha512-OBwBN9AL4dqmETlpS2zasx+vTeWclWzkblfZk7KTA5j3jeOONz/tRCnZomUyvNg83wL5Zv9Ss6HMJXAgL8R2Yg==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "brace-expansion": "^2.0.2"
+      },
+      "engines": {
+        "node": ">=16 || 14 >=14.17"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/isaacs"
+      }
+    },
     "node_modules/globals": {
-      "version": "17.3.0",
-      "resolved": "https://registry.npmjs.org/globals/-/globals-17.3.0.tgz",
-      "integrity": "sha512-yMqGUQVVCkD4tqjOJf3TnrvaaHDMYp4VlUSObbkIiuCPe/ofdMBFIAcBbCSRFWOnos6qRiTVStDwqPLUclaxIw==",
+      "version": "17.4.0",
+      "resolved": "https://registry.npmjs.org/globals/-/globals-17.4.0.tgz",
+      "integrity": "sha512-hjrNztw/VajQwOLsMNT1cbJiH2muO3OROCHnbehc8eY5JyD2gqz4AcMHPqgaOR59DjgUjYAYLeH699g/eWi2jw==",
       "license": "MIT",
       "engines": {
         "node": ">=18"
@@ -8848,26 +8898,26 @@
       }
     },
     "node_modules/i18next": {
-      "version": "25.8.13",
-      "resolved": "https://registry.npmjs.org/i18next/-/i18next-25.8.13.tgz",
-      "integrity": "sha512-E0vzjBY1yM+nsFrtgkjLhST2NBkirkvOVoQa0MSldhsuZ3jUge7ZNpuwG0Cfc74zwo5ZwRzg3uOgT+McBn32iA==",
+      "version": "25.10.5",
+      "resolved": "https://registry.npmjs.org/i18next/-/i18next-25.10.5.tgz",
+      "integrity": "sha512-jRnF7eRNsdcnh7AASSgaU3lj/8lJZuHkfsouetnLEDH0xxE1vVi7qhiJ9RhdSPUyzg4ltb7P7aXsFlTk9sxL2w==",
       "funding": [
         {
           "type": "individual",
-          "url": "https://locize.com"
-        },
-        {
-          "type": "individual",
-          "url": "https://locize.com/i18next.html"
+          "url": "https://www.locize.com/i18next"
         },
         {
           "type": "individual",
           "url": "https://www.i18next.com/how-to/faq#i18next-is-awesome.-how-can-i-support-the-project"
+        },
+        {
+          "type": "individual",
+          "url": "https://www.locize.com"
         }
       ],
       "license": "MIT",
       "dependencies": {
-        "@babel/runtime": "^7.28.4"
+        "@babel/runtime": "^7.29.2"
       },
       "peerDependencies": {
         "typescript": "^5"
@@ -9010,12 +9060,12 @@
       "license": "ISC"
     },
     "node_modules/ini": {
-      "version": "5.0.0",
-      "resolved": "https://registry.npmjs.org/ini/-/ini-5.0.0.tgz",
-      "integrity": "sha512-+N0ngpO3e7cRUWOJAS7qw0IZIVc6XPrW4MlFBdD066F2L4k1L6ker3hLqSq7iXxU5tgS4WGkIUElWn5vogAEnw==",
+      "version": "6.0.0",
+      "resolved": "https://registry.npmjs.org/ini/-/ini-6.0.0.tgz",
+      "integrity": "sha512-IBTdIkzZNOpqm7q3dRqJvMaldXjDHWkEDfrwGEQTs5eaQMWV+djAhR+wahyNNMAa+qpbDUhBMVt4ZKNwpPm7xQ==",
       "license": "ISC",
       "engines": {
-        "node": "^18.17.0 || >=20.5.0"
+        "node": "^20.17.0 || >=22.9.0"
       }
     },
     "node_modules/internmap": {
@@ -9578,19 +9628,19 @@
       }
     },
     "node_modules/license-report": {
-      "version": "6.8.1",
-      "resolved": "https://registry.npmjs.org/license-report/-/license-report-6.8.1.tgz",
-      "integrity": "sha512-TxUUJNLTa+1kfYMK7uk7fLFtPrKMahX10K+pAY4UnGeNIJi+xWRzt/HrxpVlHj+9LG9Y2mhLzKFjHgAkj04ujg==",
+      "version": "6.8.2",
+      "resolved": "https://registry.npmjs.org/license-report/-/license-report-6.8.2.tgz",
+      "integrity": "sha512-eWzJujDhPm5bKTrolTBt8mvL6YW3c5SY1kpqnt7GmTLU01rOtzjqe3sevOQLF2dPY7dV+VnSZIWV774Cgqz/Eg==",
       "license": "MIT",
       "dependencies": {
         "@kessler/tableify": "^1.0.2",
         "debug": "^4.4.3",
         "eol": "^0.10.0",
         "find-up-simple": "^1.0.1",
-        "got": "^14.6.0",
-        "ini": "^5.0.0",
+        "got": "^14.6.6",
+        "ini": "^6.0.0",
         "rc": "^1.2.8",
-        "semver": "^7.7.3",
+        "semver": "^7.7.4",
         "tablemark": "^4.1.0",
         "text-table": "^0.2.0",
         "visit-values": "^2.0.0"
@@ -9612,9 +9662,9 @@
       }
     },
     "node_modules/lightningcss": {
-      "version": "1.31.1",
-      "resolved": "https://registry.npmjs.org/lightningcss/-/lightningcss-1.31.1.tgz",
-      "integrity": "sha512-l51N2r93WmGUye3WuFoN5k10zyvrVs0qfKBhyC5ogUQ6Ew6JUSswh78mbSO+IU3nTWsyOArqPCcShdQSadghBQ==",
+      "version": "1.32.0",
+      "resolved": "https://registry.npmjs.org/lightningcss/-/lightningcss-1.32.0.tgz",
+      "integrity": "sha512-NXYBzinNrblfraPGyrbPoD19C1h9lfI/1mzgWYvXUTe414Gz/X1FD2XBZSZM7rRTrMA8JL3OtAaGifrIKhQ5yQ==",
       "license": "MPL-2.0",
       "dependencies": {
         "detect-libc": "^2.0.3"
@@ -9627,23 +9677,23 @@
         "url": "https://opencollective.com/parcel"
       },
       "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"
+        "lightningcss-android-arm64": "1.32.0",
+        "lightningcss-darwin-arm64": "1.32.0",
+        "lightningcss-darwin-x64": "1.32.0",
+        "lightningcss-freebsd-x64": "1.32.0",
+        "lightningcss-linux-arm-gnueabihf": "1.32.0",
+        "lightningcss-linux-arm64-gnu": "1.32.0",
+        "lightningcss-linux-arm64-musl": "1.32.0",
+        "lightningcss-linux-x64-gnu": "1.32.0",
+        "lightningcss-linux-x64-musl": "1.32.0",
+        "lightningcss-win32-arm64-msvc": "1.32.0",
+        "lightningcss-win32-x64-msvc": "1.32.0"
       }
     },
     "node_modules/lightningcss-android-arm64": {
-      "version": "1.31.1",
-      "resolved": "https://registry.npmjs.org/lightningcss-android-arm64/-/lightningcss-android-arm64-1.31.1.tgz",
-      "integrity": "sha512-HXJF3x8w9nQ4jbXRiNppBCqeZPIAfUo8zE/kOEGbW5NZvGc/K7nMxbhIr+YlFlHW5mpbg/YFPdbnCh1wAXCKFg==",
+      "version": "1.32.0",
+      "resolved": "https://registry.npmjs.org/lightningcss-android-arm64/-/lightningcss-android-arm64-1.32.0.tgz",
+      "integrity": "sha512-YK7/ClTt4kAK0vo6w3X+Pnm0D2cf2vPHbhOXdoNti1Ga0al1P4TBZhwjATvjNwLEBCnKvjJc2jQgHXH0NEwlAg==",
       "cpu": [
         "arm64"
       ],
@@ -9661,9 +9711,9 @@
       }
     },
     "node_modules/lightningcss-darwin-arm64": {
-      "version": "1.31.1",
-      "resolved": "https://registry.npmjs.org/lightningcss-darwin-arm64/-/lightningcss-darwin-arm64-1.31.1.tgz",
-      "integrity": "sha512-02uTEqf3vIfNMq3h/z2cJfcOXnQ0GRwQrkmPafhueLb2h7mqEidiCzkE4gBMEH65abHRiQvhdcQ+aP0D0g67sg==",
+      "version": "1.32.0",
+      "resolved": "https://registry.npmjs.org/lightningcss-darwin-arm64/-/lightningcss-darwin-arm64-1.32.0.tgz",
+      "integrity": "sha512-RzeG9Ju5bag2Bv1/lwlVJvBE3q6TtXskdZLLCyfg5pt+HLz9BqlICO7LZM7VHNTTn/5PRhHFBSjk5lc4cmscPQ==",
       "cpu": [
         "arm64"
       ],
@@ -9681,9 +9731,9 @@
       }
     },
     "node_modules/lightningcss-darwin-x64": {
-      "version": "1.31.1",
-      "resolved": "https://registry.npmjs.org/lightningcss-darwin-x64/-/lightningcss-darwin-x64-1.31.1.tgz",
-      "integrity": "sha512-1ObhyoCY+tGxtsz1lSx5NXCj3nirk0Y0kB/g8B8DT+sSx4G9djitg9ejFnjb3gJNWo7qXH4DIy2SUHvpoFwfTA==",
+      "version": "1.32.0",
+      "resolved": "https://registry.npmjs.org/lightningcss-darwin-x64/-/lightningcss-darwin-x64-1.32.0.tgz",
+      "integrity": "sha512-U+QsBp2m/s2wqpUYT/6wnlagdZbtZdndSmut/NJqlCcMLTWp5muCrID+K5UJ6jqD2BFshejCYXniPDbNh73V8w==",
       "cpu": [
         "x64"
       ],
@@ -9701,9 +9751,9 @@
       }
     },
     "node_modules/lightningcss-freebsd-x64": {
-      "version": "1.31.1",
-      "resolved": "https://registry.npmjs.org/lightningcss-freebsd-x64/-/lightningcss-freebsd-x64-1.31.1.tgz",
-      "integrity": "sha512-1RINmQKAItO6ISxYgPwszQE1BrsVU5aB45ho6O42mu96UiZBxEXsuQ7cJW4zs4CEodPUioj/QrXW1r9pLUM74A==",
+      "version": "1.32.0",
+      "resolved": "https://registry.npmjs.org/lightningcss-freebsd-x64/-/lightningcss-freebsd-x64-1.32.0.tgz",
+      "integrity": "sha512-JCTigedEksZk3tHTTthnMdVfGf61Fky8Ji2E4YjUTEQX14xiy/lTzXnu1vwiZe3bYe0q+SpsSH/CTeDXK6WHig==",
       "cpu": [
         "x64"
       ],
@@ -9721,9 +9771,9 @@
       }
     },
     "node_modules/lightningcss-linux-arm-gnueabihf": {
-      "version": "1.31.1",
-      "resolved": "https://registry.npmjs.org/lightningcss-linux-arm-gnueabihf/-/lightningcss-linux-arm-gnueabihf-1.31.1.tgz",
-      "integrity": "sha512-OOCm2//MZJ87CdDK62rZIu+aw9gBv4azMJuA8/KB74wmfS3lnC4yoPHm0uXZ/dvNNHmnZnB8XLAZzObeG0nS1g==",
+      "version": "1.32.0",
+      "resolved": "https://registry.npmjs.org/lightningcss-linux-arm-gnueabihf/-/lightningcss-linux-arm-gnueabihf-1.32.0.tgz",
+      "integrity": "sha512-x6rnnpRa2GL0zQOkt6rts3YDPzduLpWvwAF6EMhXFVZXD4tPrBkEFqzGowzCsIWsPjqSK+tyNEODUBXeeVHSkw==",
       "cpu": [
         "arm"
       ],
@@ -9741,9 +9791,9 @@
       }
     },
     "node_modules/lightningcss-linux-arm64-gnu": {
-      "version": "1.31.1",
-      "resolved": "https://registry.npmjs.org/lightningcss-linux-arm64-gnu/-/lightningcss-linux-arm64-gnu-1.31.1.tgz",
-      "integrity": "sha512-WKyLWztD71rTnou4xAD5kQT+982wvca7E6QoLpoawZ1gP9JM0GJj4Tp5jMUh9B3AitHbRZ2/H3W5xQmdEOUlLg==",
+      "version": "1.32.0",
+      "resolved": "https://registry.npmjs.org/lightningcss-linux-arm64-gnu/-/lightningcss-linux-arm64-gnu-1.32.0.tgz",
+      "integrity": "sha512-0nnMyoyOLRJXfbMOilaSRcLH3Jw5z9HDNGfT/gwCPgaDjnx0i8w7vBzFLFR1f6CMLKF8gVbebmkUN3fa/kQJpQ==",
       "cpu": [
         "arm64"
       ],
@@ -9761,9 +9811,9 @@
       }
     },
     "node_modules/lightningcss-linux-arm64-musl": {
-      "version": "1.31.1",
-      "resolved": "https://registry.npmjs.org/lightningcss-linux-arm64-musl/-/lightningcss-linux-arm64-musl-1.31.1.tgz",
-      "integrity": "sha512-mVZ7Pg2zIbe3XlNbZJdjs86YViQFoJSpc41CbVmKBPiGmC4YrfeOyz65ms2qpAobVd7WQsbW4PdsSJEMymyIMg==",
+      "version": "1.32.0",
+      "resolved": "https://registry.npmjs.org/lightningcss-linux-arm64-musl/-/lightningcss-linux-arm64-musl-1.32.0.tgz",
+      "integrity": "sha512-UpQkoenr4UJEzgVIYpI80lDFvRmPVg6oqboNHfoH4CQIfNA+HOrZ7Mo7KZP02dC6LjghPQJeBsvXhJod/wnIBg==",
       "cpu": [
         "arm64"
       ],
@@ -9781,9 +9831,9 @@
       }
     },
     "node_modules/lightningcss-linux-x64-gnu": {
-      "version": "1.31.1",
-      "resolved": "https://registry.npmjs.org/lightningcss-linux-x64-gnu/-/lightningcss-linux-x64-gnu-1.31.1.tgz",
-      "integrity": "sha512-xGlFWRMl+0KvUhgySdIaReQdB4FNudfUTARn7q0hh/V67PVGCs3ADFjw+6++kG1RNd0zdGRlEKa+T13/tQjPMA==",
+      "version": "1.32.0",
+      "resolved": "https://registry.npmjs.org/lightningcss-linux-x64-gnu/-/lightningcss-linux-x64-gnu-1.32.0.tgz",
+      "integrity": "sha512-V7Qr52IhZmdKPVr+Vtw8o+WLsQJYCTd8loIfpDaMRWGUZfBOYEJeyJIkqGIDMZPwPx24pUMfwSxxI8phr/MbOA==",
       "cpu": [
         "x64"
       ],
@@ -9801,9 +9851,9 @@
       }
     },
     "node_modules/lightningcss-linux-x64-musl": {
-      "version": "1.31.1",
-      "resolved": "https://registry.npmjs.org/lightningcss-linux-x64-musl/-/lightningcss-linux-x64-musl-1.31.1.tgz",
-      "integrity": "sha512-eowF8PrKHw9LpoZii5tdZwnBcYDxRw2rRCyvAXLi34iyeYfqCQNA9rmUM0ce62NlPhCvof1+9ivRaTY6pSKDaA==",
+      "version": "1.32.0",
+      "resolved": "https://registry.npmjs.org/lightningcss-linux-x64-musl/-/lightningcss-linux-x64-musl-1.32.0.tgz",
+      "integrity": "sha512-bYcLp+Vb0awsiXg/80uCRezCYHNg1/l3mt0gzHnWV9XP1W5sKa5/TCdGWaR/zBM2PeF/HbsQv/j2URNOiVuxWg==",
       "cpu": [
         "x64"
       ],
@@ -9821,9 +9871,9 @@
       }
     },
     "node_modules/lightningcss-win32-arm64-msvc": {
-      "version": "1.31.1",
-      "resolved": "https://registry.npmjs.org/lightningcss-win32-arm64-msvc/-/lightningcss-win32-arm64-msvc-1.31.1.tgz",
-      "integrity": "sha512-aJReEbSEQzx1uBlQizAOBSjcmr9dCdL3XuC/6HLXAxmtErsj2ICo5yYggg1qOODQMtnjNQv2UHb9NpOuFtYe4w==",
+      "version": "1.32.0",
+      "resolved": "https://registry.npmjs.org/lightningcss-win32-arm64-msvc/-/lightningcss-win32-arm64-msvc-1.32.0.tgz",
+      "integrity": "sha512-8SbC8BR40pS6baCM8sbtYDSwEVQd4JlFTOlaD3gWGHfThTcABnNDBda6eTZeqbofalIJhFx0qKzgHJmcPTnGdw==",
       "cpu": [
         "arm64"
       ],
@@ -9841,9 +9891,9 @@
       }
     },
     "node_modules/lightningcss-win32-x64-msvc": {
-      "version": "1.31.1",
-      "resolved": "https://registry.npmjs.org/lightningcss-win32-x64-msvc/-/lightningcss-win32-x64-msvc-1.31.1.tgz",
-      "integrity": "sha512-I9aiFrbd7oYHwlnQDqr1Roz+fTz61oDDJX7n9tYF9FJymH1cIN1DtKw3iYt6b8WZgEjoNwVSncwF4wx/ZedMhw==",
+      "version": "1.32.0",
+      "resolved": "https://registry.npmjs.org/lightningcss-win32-x64-msvc/-/lightningcss-win32-x64-msvc-1.32.0.tgz",
+      "integrity": "sha512-Amq9B/SoZYdDi1kFrojnoqPLxYhQ4Wo5XiL8EVJrVsB8ARoC1PWW6VGtT0WKCemjy8aC+louJnjS7U18x3b06Q==",
       "cpu": [
         "x64"
       ],
@@ -9957,9 +10007,9 @@
       }
     },
     "node_modules/lru-cache": {
-      "version": "11.2.6",
-      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-11.2.6.tgz",
-      "integrity": "sha512-ESL2CrkS/2wTPfuend7Zhkzo2u0daGJ/A2VucJOgQ/C48S/zB8MMeMHSGKYpXhIjbPxfuezITkaBH1wqv00DDQ==",
+      "version": "11.2.7",
+      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-11.2.7.tgz",
+      "integrity": "sha512-aY/R+aEsRelme17KGQa/1ZSIpLpNYYrhcrepKTZgE+W3WM16YMCaPwOHLHsmopZHELU0Ojin1lPVxKR0MihncA==",
       "dev": true,
       "license": "BlueOak-1.0.0",
       "engines": {
@@ -10062,9 +10112,9 @@
       }
     },
     "node_modules/mdn-data": {
-      "version": "2.12.2",
-      "resolved": "https://registry.npmjs.org/mdn-data/-/mdn-data-2.12.2.tgz",
-      "integrity": "sha512-IEn+pegP1aManZuckezWCO+XZQDplx1366JoVhTpMpBB1sPey/SbveZQUosKiKiGYjg1wH4pMlNgXbCiYgihQA==",
+      "version": "2.27.1",
+      "resolved": "https://registry.npmjs.org/mdn-data/-/mdn-data-2.27.1.tgz",
+      "integrity": "sha512-9Yubnt3e8A0OKwxYSXyhLymGW4sCufcLG6VdiDdUGVkPhpqLxlvP5vl1983gQjJl3tqbrM731mjaZaP68AgosQ==",
       "dev": true,
       "license": "CC0-1.0"
     },
@@ -10177,16 +10227,16 @@
       }
     },
     "node_modules/mlly": {
-      "version": "1.8.0",
-      "resolved": "https://registry.npmjs.org/mlly/-/mlly-1.8.0.tgz",
-      "integrity": "sha512-l8D9ODSRWLe2KHJSifWGwBqpTZXIXTeo8mlKjY+E2HAakaTeNpqAyBZ8GSqLzHgw4XmHmC8whvpjJNMbFZN7/g==",
+      "version": "1.8.2",
+      "resolved": "https://registry.npmjs.org/mlly/-/mlly-1.8.2.tgz",
+      "integrity": "sha512-d+ObxMQFmbt10sretNDytwt85VrbkhhUA/JBGm1MPaWJ65Cl4wOgLaB1NYvJSZ0Ef03MMEU/0xpPMXUIQ29UfA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "acorn": "^8.15.0",
+        "acorn": "^8.16.0",
         "pathe": "^2.0.3",
         "pkg-types": "^1.3.1",
-        "ufo": "^1.6.1"
+        "ufo": "^1.6.3"
       }
     },
     "node_modules/module-definition": {
@@ -10292,9 +10342,9 @@
       "optional": true
     },
     "node_modules/node-releases": {
-      "version": "2.0.27",
-      "resolved": "https://registry.npmjs.org/node-releases/-/node-releases-2.0.27.tgz",
-      "integrity": "sha512-nmh3lCkYZ3grZvqcCH+fjmQ7X+H0OeZgP40OierEaAptX4XofMh5kwNbWh7lBduUzCcV/8kZ+NDLCwm2iorIlA==",
+      "version": "2.0.36",
+      "resolved": "https://registry.npmjs.org/node-releases/-/node-releases-2.0.36.tgz",
+      "integrity": "sha512-TdC8FSgHz8Mwtw9g5L4gR/Sh9XhSP/0DEkQxfEFXOpiul5IiHgHan2VhYYb6agDSfp4KuvltmGApc8HMgUrIkA==",
       "license": "MIT"
     },
     "node_modules/node-source-walk": {
@@ -10751,15 +10801,15 @@
       }
     },
     "node_modules/pdfjs-dist": {
-      "version": "5.4.624",
-      "resolved": "https://registry.npmjs.org/pdfjs-dist/-/pdfjs-dist-5.4.624.tgz",
-      "integrity": "sha512-sm6TxKTtWv1Oh6n3C6J6a8odejb5uO4A4zo/2dgkHuC0iu8ZMAXOezEODkVaoVp8nX1Xzr+0WxFJJmUr45hQzg==",
+      "version": "5.5.207",
+      "resolved": "https://registry.npmjs.org/pdfjs-dist/-/pdfjs-dist-5.5.207.tgz",
+      "integrity": "sha512-WMqqw06w1vUt9ZfT0gOFhMf3wHsWhaCrxGrckGs5Cci6ybDW87IvPaOd2pnBwT6BJuP/CzXDZxjFgmSULLdsdw==",
       "license": "Apache-2.0",
       "engines": {
-        "node": ">=20.16.0 || >=22.3.0"
+        "node": ">=20.19.0 || >=22.13.0 || >=24"
       },
       "optionalDependencies": {
-        "@napi-rs/canvas": "^0.1.88",
+        "@napi-rs/canvas": "^0.1.95",
         "node-readable-to-web-readable-stream": "^0.4.2"
       }
     },
@@ -10809,9 +10859,9 @@
       "license": "ISC"
     },
     "node_modules/picomatch": {
-      "version": "2.3.1",
-      "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.3.1.tgz",
-      "integrity": "sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==",
+      "version": "2.3.2",
+      "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.3.2.tgz",
+      "integrity": "sha512-V7+vQEJ06Z+c5tSye8S+nHUfI51xoXIXjHQ99cQtKUkQqqO1kO/KCJUfZXuB47h/YBlDhah2H3hdUGXn8ie0oA==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -10831,6 +10881,18 @@
         "node": ">=0.10.0"
       }
     },
+    "node_modules/pixelmatch": {
+      "version": "7.1.0",
+      "resolved": "https://registry.npmjs.org/pixelmatch/-/pixelmatch-7.1.0.tgz",
+      "integrity": "sha512-1wrVzJ2STrpmONHKBy228LM1b84msXDUoAzVEl0R8Mz4Ce6EPr+IVtxm8+yvrqLYMHswREkjYFaMxnyGnaY3Ng==",
+      "license": "ISC",
+      "dependencies": {
+        "pngjs": "^7.0.0"
+      },
+      "bin": {
+        "pixelmatch": "bin/pixelmatch"
+      }
+    },
     "node_modules/pkg-types": {
       "version": "1.3.1",
       "resolved": "https://registry.npmjs.org/pkg-types/-/pkg-types-1.3.1.tgz",
@@ -10885,10 +10947,19 @@
         "node": ">=4"
       }
     },
+    "node_modules/pngjs": {
+      "version": "7.0.0",
+      "resolved": "https://registry.npmjs.org/pngjs/-/pngjs-7.0.0.tgz",
+      "integrity": "sha512-LKWqWJRhstyYo9pGvgor/ivk2w94eSjE3RGVuzLGlr3NmD8bf7RcYGze1mNdEHRP6TRP6rMuDHk5t44hnTRyow==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=14.19.0"
+      }
+    },
     "node_modules/postcss": {
-      "version": "8.5.6",
-      "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.5.6.tgz",
-      "integrity": "sha512-3Ybi1tAuwAP9s0r1UQ2J4n5Y0G05bJkpUIO0/bI9MhwmD70S5aTWbXGBwxHrelT+XM1k6dM0pk+SwNkpTRN7Pg==",
+      "version": "8.5.8",
+      "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.5.8.tgz",
+      "integrity": "sha512-OW/rX8O/jXnm82Ey1k44pObPtdblfiuWnrd8X7GJ7emImCOstunGbXUpp7HdBrFQX6rJzn3sPT397Wp5aCwCHg==",
       "funding": [
         {
           "type": "opencollective",
@@ -11160,9 +11231,9 @@
       }
     },
     "node_modules/posthog-js": {
-      "version": "1.354.0",
-      "resolved": "https://registry.npmjs.org/posthog-js/-/posthog-js-1.354.0.tgz",
-      "integrity": "sha512-qrpToz7mN1PmEfo+Ob4Z8euX4z2p17LA0EAtFeyod3IVnlwnu+Ybea/oxVsPiq5YAPo+p5z73FcjF2yEJ7oZnA==",
+      "version": "1.363.3",
+      "resolved": "https://registry.npmjs.org/posthog-js/-/posthog-js-1.363.3.tgz",
+      "integrity": "sha512-j1+MTbHO17kKXJMGDnaiW1EMOiA4AprE8EML6QnbSds+XbqHR2CdHa8T+/zIriZSoXlkZH4R+A4gY29lb5hdlA==",
       "license": "SEE LICENSE IN LICENSE",
       "dependencies": {
         "@opentelemetry/api": "^1.9.0",
@@ -11170,10 +11241,10 @@
         "@opentelemetry/exporter-logs-otlp-http": "^0.208.0",
         "@opentelemetry/resources": "^2.2.0",
         "@opentelemetry/sdk-logs": "^0.208.0",
-        "@posthog/core": "1.23.1",
-        "@posthog/types": "1.354.0",
+        "@posthog/core": "1.24.1",
+        "@posthog/types": "1.363.3",
         "core-js": "^3.38.1",
-        "dompurify": "^3.3.1",
+        "dompurify": "^3.3.2",
         "fflate": "^0.4.8",
         "preact": "^10.28.2",
         "query-selector-shadow-dom": "^1.0.1",
@@ -11181,9 +11252,9 @@
       }
     },
     "node_modules/preact": {
-      "version": "10.28.4",
-      "resolved": "https://registry.npmjs.org/preact/-/preact-10.28.4.tgz",
-      "integrity": "sha512-uKFfOHWuSNpRFVTnljsCluEFq57OKT+0QdOiQo8XWnQ/pSvg7OpX5eNOejELXJMWy+BwM2nobz0FkvzmnpCNsQ==",
+      "version": "10.29.0",
+      "resolved": "https://registry.npmjs.org/preact/-/preact-10.29.0.tgz",
+      "integrity": "sha512-wSAGyk2bYR1c7t3SZ3jHcM6xy0lcBcDel6lODcs9ME6Th++Dx2KU+6D3HD8wMMKGA8Wpw7OMd3/4RGzYRpzwRg==",
       "license": "MIT",
       "funding": {
         "type": "opencollective",
@@ -11240,6 +11311,22 @@
         "node": ">= 0.8.0"
       }
     },
+    "node_modules/prettier": {
+      "version": "3.8.1",
+      "resolved": "https://registry.npmjs.org/prettier/-/prettier-3.8.1.tgz",
+      "integrity": "sha512-UOnG6LftzbdaHZcKoPFtOcCKztrQ57WkHDeRD9t/PTQtmT0NHSeWWepj6pS0z/N7+08BHFDQVUrfmfMRcZwbMg==",
+      "dev": true,
+      "license": "MIT",
+      "bin": {
+        "prettier": "bin/prettier.cjs"
+      },
+      "engines": {
+        "node": ">=14"
+      },
+      "funding": {
+        "url": "https://github.com/prettier/prettier?sponsor=1"
+      }
+    },
     "node_modules/pretty-format": {
       "version": "27.5.1",
       "resolved": "https://registry.npmjs.org/pretty-format/-/pretty-format-27.5.1.tgz",
@@ -11392,12 +11479,13 @@
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/proxy-from-env/-/proxy-from-env-1.1.0.tgz",
       "integrity": "sha512-D+zkORCbA9f1tdWRK0RaCR3GPv50cMxcrz4X8k5LTSUD1Dkw47mKJEZQNunItRTkWwgtaUSo1RVFRIG9ZXiFYg==",
+      "dev": true,
       "license": "MIT"
     },
     "node_modules/pump": {
-      "version": "3.0.3",
-      "resolved": "https://registry.npmjs.org/pump/-/pump-3.0.3.tgz",
-      "integrity": "sha512-todwxLMY7/heScKmntwQG8CXVkWUOdYxIvY2s0VWAAMh/nd8SoYiRaKjlr7+iCs984f2P8zvrfWcDDYVb73NfA==",
+      "version": "3.0.4",
+      "resolved": "https://registry.npmjs.org/pump/-/pump-3.0.4.tgz",
+      "integrity": "sha512-VS7sjc6KR7e1ukRFhQSY5LM2uBWAUPiOPa/A3mkKmiMwSmRFUITt0xuj+/lesgnCv+dPIEYlkzrcyXgquIHMcA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -11416,9 +11504,9 @@
       }
     },
     "node_modules/puppeteer": {
-      "version": "24.37.5",
-      "resolved": "https://registry.npmjs.org/puppeteer/-/puppeteer-24.37.5.tgz",
-      "integrity": "sha512-3PAOIQLceyEmn1Fi76GkGO2EVxztv5OtdlB1m8hMUZL3f8KDHnlvXbvCXv+Ls7KzF1R0KdKBqLuT/Hhrok12hQ==",
+      "version": "24.40.0",
+      "resolved": "https://registry.npmjs.org/puppeteer/-/puppeteer-24.40.0.tgz",
+      "integrity": "sha512-IxQbDq93XHVVLWHrAkFP7F7iHvb9o0mgfsSIMlhHb+JM+JjM1V4v4MNSQfcRWJopx9dsNOr9adYv0U5fm9BJBQ==",
       "dev": true,
       "hasInstallScript": true,
       "license": "Apache-2.0",
@@ -11426,9 +11514,9 @@
         "@puppeteer/browsers": "2.13.0",
         "chromium-bidi": "14.0.0",
         "cosmiconfig": "^9.0.0",
-        "devtools-protocol": "0.0.1566079",
-        "puppeteer-core": "24.37.5",
-        "typed-query-selector": "^2.12.0"
+        "devtools-protocol": "0.0.1581282",
+        "puppeteer-core": "24.40.0",
+        "typed-query-selector": "^2.12.1"
       },
       "bin": {
         "puppeteer": "lib/cjs/puppeteer/node/cli.js"
@@ -11438,17 +11526,17 @@
       }
     },
     "node_modules/puppeteer-core": {
-      "version": "24.37.5",
-      "resolved": "https://registry.npmjs.org/puppeteer-core/-/puppeteer-core-24.37.5.tgz",
-      "integrity": "sha512-ybL7iE78YPN4T6J+sPLO7r0lSByp/0NN6PvfBEql219cOnttoTFzCWKiBOjstXSqi/OKpwae623DWAsL7cn2MQ==",
+      "version": "24.40.0",
+      "resolved": "https://registry.npmjs.org/puppeteer-core/-/puppeteer-core-24.40.0.tgz",
+      "integrity": "sha512-MWL3XbUCfVgGR0gRsidzT6oKJT2QydPLhMITU6HoVWiiv4gkb6gJi3pcdAa8q4HwjBTbqISOWVP4aJiiyUJvag==",
       "dev": true,
       "license": "Apache-2.0",
       "dependencies": {
         "@puppeteer/browsers": "2.13.0",
         "chromium-bidi": "14.0.0",
         "debug": "^4.4.3",
-        "devtools-protocol": "0.0.1566079",
-        "typed-query-selector": "^2.12.0",
+        "devtools-protocol": "0.0.1581282",
+        "typed-query-selector": "^2.12.1",
         "webdriver-bidi-protocol": "0.4.1",
         "ws": "^8.19.0"
       },
@@ -11457,9 +11545,9 @@
       }
     },
     "node_modules/puppeteer/node_modules/cosmiconfig": {
-      "version": "9.0.0",
-      "resolved": "https://registry.npmjs.org/cosmiconfig/-/cosmiconfig-9.0.0.tgz",
-      "integrity": "sha512-itvL5h8RETACmOTFc4UfIyB2RfEHi71Ax6E/PivVxq9NseKbOWpeyHEOIbmAw1rs8Ak0VursQNww7lf7YtUwzg==",
+      "version": "9.0.1",
+      "resolved": "https://registry.npmjs.org/cosmiconfig/-/cosmiconfig-9.0.1.tgz",
+      "integrity": "sha512-hr4ihw+DBqcvrsEDioRO31Z17x71pUYoNe/4h6Z0wB72p7MU7/9gH8Q3s12NFhHPfYBBOV3qyfUxmr/Yn3shnQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -11576,12 +11664,12 @@
       }
     },
     "node_modules/react-draggable": {
-      "version": "4.4.6",
-      "resolved": "https://registry.npmjs.org/react-draggable/-/react-draggable-4.4.6.tgz",
-      "integrity": "sha512-LtY5Xw1zTPqHkVmtM3X8MUOxNDOUhv/khTgBgrUvwaS064bwVvxT+q5El0uUFNx5IEPKXuRejr7UqLwBIg5pdw==",
+      "version": "4.5.0",
+      "resolved": "https://registry.npmjs.org/react-draggable/-/react-draggable-4.5.0.tgz",
+      "integrity": "sha512-VC+HBLEZ0XJxnOxVAZsdRi8rD04Iz3SiiKOoYzamjylUcju/hP9np/aZdLHf/7WOD268WMoNJMvYfB5yAK45cw==",
       "license": "MIT",
       "dependencies": {
-        "clsx": "^1.1.1",
+        "clsx": "^2.1.1",
         "prop-types": "^15.8.1"
       },
       "peerDependencies": {
@@ -11589,15 +11677,6 @@
         "react-dom": ">= 16.3.0"
       }
     },
-    "node_modules/react-draggable/node_modules/clsx": {
-      "version": "1.2.1",
-      "resolved": "https://registry.npmjs.org/clsx/-/clsx-1.2.1.tgz",
-      "integrity": "sha512-EcR6r5a8bj6pu3ycsa/E/cKVGuTgZJZdsyUYHOksG/UHIiKfjxzRxYJpyVBwYaQeOvghal9fcc4PidlgzugAQg==",
-      "license": "MIT",
-      "engines": {
-        "node": ">=6"
-      }
-    },
     "node_modules/react-dropzone": {
       "version": "15.0.0",
       "resolved": "https://registry.npmjs.org/react-dropzone/-/react-dropzone-15.0.0.tgz",
@@ -11662,9 +11741,9 @@
       "license": "MIT"
     },
     "node_modules/react-number-format": {
-      "version": "5.4.4",
-      "resolved": "https://registry.npmjs.org/react-number-format/-/react-number-format-5.4.4.tgz",
-      "integrity": "sha512-wOmoNZoOpvMminhifQYiYSTCLUDOiUbBunrMrMjA+dV52sY+vck1S4UhR6PkgnoCquvvMSeJjErXZ4qSaWCliA==",
+      "version": "5.4.5",
+      "resolved": "https://registry.npmjs.org/react-number-format/-/react-number-format-5.4.5.tgz",
+      "integrity": "sha512-y8O2yHHj3w0aE9XO8d2BCcUOOdQTRSVq+WIuMlLVucAm5XNjJAy+BoOJiuQMldVYVOKTMyvVNfnbl2Oqp+YxGw==",
       "license": "MIT",
       "peerDependencies": {
         "react": "^0.14 || ^15.0.0 || ^16.0.0 || ^17.0.0 || ^18.0.0 || ^19.0.0",
@@ -11742,13 +11821,13 @@
       }
     },
     "node_modules/react-rnd": {
-      "version": "10.5.2",
-      "resolved": "https://registry.npmjs.org/react-rnd/-/react-rnd-10.5.2.tgz",
-      "integrity": "sha512-0Tm4x7k7pfHf2snewJA8x7Nwgt3LV+58MVEWOVsFjk51eYruFEa6Wy7BNdxt4/lH0wIRsu7Gm3KjSXY2w7YaNw==",
+      "version": "10.5.3",
+      "resolved": "https://registry.npmjs.org/react-rnd/-/react-rnd-10.5.3.tgz",
+      "integrity": "sha512-s/sIT3pGZnQ+57egijkTp9mizjIWrJz68Pq6yd+F/wniFY3IriML18dUXnQe/HP9uMiJ+9MAp44hljG99fZu6Q==",
       "license": "MIT",
       "dependencies": {
-        "re-resizable": "6.11.2",
-        "react-draggable": "4.4.6",
+        "re-resizable": "^6.11.2",
+        "react-draggable": "^4.5.0",
         "tslib": "2.6.2"
       },
       "peerDependencies": {
@@ -11763,9 +11842,9 @@
       "license": "0BSD"
     },
     "node_modules/react-router": {
-      "version": "7.13.1",
-      "resolved": "https://registry.npmjs.org/react-router/-/react-router-7.13.1.tgz",
-      "integrity": "sha512-td+xP4X2/6BJvZoX6xw++A2DdEi++YypA69bJUV5oVvqf6/9/9nNlD70YO1e9d3MyamJEBQFEzk6mbfDYbqrSA==",
+      "version": "7.13.2",
+      "resolved": "https://registry.npmjs.org/react-router/-/react-router-7.13.2.tgz",
+      "integrity": "sha512-tX1Aee+ArlKQP+NIUd7SE6Li+CiGKwQtbS+FfRxPX6Pe4vHOo6nr9d++u5cwg+Z8K/x8tP+7qLmujDtfrAoUJA==",
       "license": "MIT",
       "dependencies": {
         "cookie": "^1.0.1",
@@ -11785,12 +11864,12 @@
       }
     },
     "node_modules/react-router-dom": {
-      "version": "7.13.1",
-      "resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-7.13.1.tgz",
-      "integrity": "sha512-UJnV3Rxc5TgUPJt2KJpo1Jpy0OKQr0AjgbZzBFjaPJcFOb2Y8jA5H3LT8HUJAiRLlWrEXWHbF1Z4SCZaQjWDHw==",
+      "version": "7.13.2",
+      "resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-7.13.2.tgz",
+      "integrity": "sha512-aR7SUORwTqAW0JDeiWF07e9SBE9qGpByR9I8kJT5h/FrBKxPMS6TiC7rmVO+gC0q52Bx7JnjWe8Z1sR9faN4YA==",
       "license": "MIT",
       "dependencies": {
-        "react-router": "7.13.1"
+        "react-router": "7.13.2"
       },
       "engines": {
         "node": ">=20.0.0"
@@ -12004,15 +12083,15 @@
       }
     },
     "node_modules/recharts": {
-      "version": "3.7.0",
-      "resolved": "https://registry.npmjs.org/recharts/-/recharts-3.7.0.tgz",
-      "integrity": "sha512-l2VCsy3XXeraxIID9fx23eCb6iCBsxUQDnE8tWm6DFdszVAO7WVY/ChAD9wVit01y6B2PMupYiMmQwhgPHc9Ew==",
+      "version": "3.8.0",
+      "resolved": "https://registry.npmjs.org/recharts/-/recharts-3.8.0.tgz",
+      "integrity": "sha512-Z/m38DX3L73ExO4Tpc9/iZWHmHnlzWG4njQbxsF5aSjwqmHNDDIm0rdEBArkwsBvR8U6EirlEHiQNYWCVh9sGQ==",
       "license": "MIT",
       "workspaces": [
         "www"
       ],
       "dependencies": {
-        "@reduxjs/toolkit": "1.x.x || 2.x.x",
+        "@reduxjs/toolkit": "^1.9.0 || 2.x.x",
         "clsx": "^2.1.1",
         "decimal.js-light": "^2.5.1",
         "es-toolkit": "^1.39.3",
@@ -12220,15 +12299,15 @@
       "license": "ISC"
     },
     "node_modules/robust-predicates": {
-      "version": "3.0.2",
-      "resolved": "https://registry.npmjs.org/robust-predicates/-/robust-predicates-3.0.2.tgz",
-      "integrity": "sha512-IXgzBWvWQwE6PrDI05OvmXUIruQTcoMDzRsOd5CDvHCVLcLHMTSYvOK5Cm46kWqlV3yAbuSpBZdJ5oP5OUoStg==",
+      "version": "3.0.3",
+      "resolved": "https://registry.npmjs.org/robust-predicates/-/robust-predicates-3.0.3.tgz",
+      "integrity": "sha512-NS3levdsRIUOmiJ8FZWCP7LG3QpJyrs/TE0Zpf1yvZu8cAJJ6QMW92H1c7kWpdIHo8RvmLxN/o2JXTKHp74lUA==",
       "license": "Unlicense"
     },
     "node_modules/rollup": {
-      "version": "4.59.0",
-      "resolved": "https://registry.npmjs.org/rollup/-/rollup-4.59.0.tgz",
-      "integrity": "sha512-2oMpl67a3zCH9H79LeMcbDhXW/UmWG/y2zuqnF2jQq5uq9TbM9TVyXvA4+t+ne2IIkBdrLpAaRQAvo7YI/Yyeg==",
+      "version": "4.60.0",
+      "resolved": "https://registry.npmjs.org/rollup/-/rollup-4.60.0.tgz",
+      "integrity": "sha512-yqjxruMGBQJ2gG4HtjZtAfXArHomazDHoFwFFmZZl0r7Pdo7qCIXKqKHZc8yeoMgzJJ+pO6pEEHa+V7uzWlrAQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -12242,31 +12321,31 @@
         "npm": ">=8.0.0"
       },
       "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",
+        "@rollup/rollup-android-arm-eabi": "4.60.0",
+        "@rollup/rollup-android-arm64": "4.60.0",
+        "@rollup/rollup-darwin-arm64": "4.60.0",
+        "@rollup/rollup-darwin-x64": "4.60.0",
+        "@rollup/rollup-freebsd-arm64": "4.60.0",
+        "@rollup/rollup-freebsd-x64": "4.60.0",
+        "@rollup/rollup-linux-arm-gnueabihf": "4.60.0",
+        "@rollup/rollup-linux-arm-musleabihf": "4.60.0",
+        "@rollup/rollup-linux-arm64-gnu": "4.60.0",
+        "@rollup/rollup-linux-arm64-musl": "4.60.0",
+        "@rollup/rollup-linux-loong64-gnu": "4.60.0",
+        "@rollup/rollup-linux-loong64-musl": "4.60.0",
+        "@rollup/rollup-linux-ppc64-gnu": "4.60.0",
+        "@rollup/rollup-linux-ppc64-musl": "4.60.0",
+        "@rollup/rollup-linux-riscv64-gnu": "4.60.0",
+        "@rollup/rollup-linux-riscv64-musl": "4.60.0",
+        "@rollup/rollup-linux-s390x-gnu": "4.60.0",
+        "@rollup/rollup-linux-x64-gnu": "4.60.0",
+        "@rollup/rollup-linux-x64-musl": "4.60.0",
+        "@rollup/rollup-openbsd-x64": "4.60.0",
+        "@rollup/rollup-openharmony-arm64": "4.60.0",
+        "@rollup/rollup-win32-arm64-msvc": "4.60.0",
+        "@rollup/rollup-win32-ia32-msvc": "4.60.0",
+        "@rollup/rollup-win32-x64-gnu": "4.60.0",
+        "@rollup/rollup-win32-x64-msvc": "4.60.0",
         "fsevents": "~2.3.2"
       }
     },
@@ -12289,14 +12368,14 @@
       "license": "MIT"
     },
     "node_modules/sass-lookup": {
-      "version": "6.1.0",
-      "resolved": "https://registry.npmjs.org/sass-lookup/-/sass-lookup-6.1.0.tgz",
-      "integrity": "sha512-Zx+lVyoWqXZxHuYWlTA17Z5sczJ6braNT2C7rmClw+c4E7r/n911Zwss3h1uHI9reR5AgHZyNHF7c2+VIp5AUA==",
+      "version": "6.1.1",
+      "resolved": "https://registry.npmjs.org/sass-lookup/-/sass-lookup-6.1.1.tgz",
+      "integrity": "sha512-12dvZdQYTeKZ1ypjuiijZYuMZ1m0F+4+BkRX5yJi2WA9W3DBUrcdCt7bVuKlagHl11n8eYtalWDle+m98Ol2DA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
         "commander": "^12.1.0",
-        "enhanced-resolve": "^5.18.0"
+        "enhanced-resolve": "^5.20.0"
       },
       "bin": {
         "sass-lookup": "bin/cli.js"
@@ -12461,9 +12540,9 @@
       }
     },
     "node_modules/smol-toml": {
-      "version": "1.6.0",
-      "resolved": "https://registry.npmjs.org/smol-toml/-/smol-toml-1.6.0.tgz",
-      "integrity": "sha512-4zemZi0HvTnYwLfrpk/CF9LOd9Lt87kAt50GnqhMpyF9U3poDAP2+iukq2bZsO/ufegbYehBkqINbsWxj4l4cw==",
+      "version": "1.6.1",
+      "resolved": "https://registry.npmjs.org/smol-toml/-/smol-toml-1.6.1.tgz",
+      "integrity": "sha512-dWUG8F5sIIARXih1DTaQAX4SsiTXhInKf1buxdY9DIg4ZYPZK5nGM1VRIYmEbDbsHt7USo99xSLFu5Q1IqTmsg==",
       "license": "BSD-3-Clause",
       "engines": {
         "node": ">= 18"
@@ -12612,9 +12691,9 @@
       }
     },
     "node_modules/streamx": {
-      "version": "2.23.0",
-      "resolved": "https://registry.npmjs.org/streamx/-/streamx-2.23.0.tgz",
-      "integrity": "sha512-kn+e44esVfn2Fa/O0CPFcex27fjIL6MkVae0Mm6q+E6f0hWv578YCERbv+4m02cjxvDsPKLnmxral/rR6lBMAg==",
+      "version": "2.25.0",
+      "resolved": "https://registry.npmjs.org/streamx/-/streamx-2.25.0.tgz",
+      "integrity": "sha512-0nQuG6jf1w+wddNEEXCF4nTg3LtufWINB5eFEN+5TNZW7KWJp6x87+JFL43vaAUPyCfH1wID+mNVyW6OHtFamg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -12702,12 +12781,12 @@
       }
     },
     "node_modules/strip-ansi": {
-      "version": "7.1.2",
-      "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-7.1.2.tgz",
-      "integrity": "sha512-gmBGslpoQJtgnMAvOVqGZpEz9dyoKTCzy2nfz/n8aIFhN/jCE/rCmcxabB6jOOHV+0WNnylOxaxBQPSvcWklhA==",
+      "version": "7.2.0",
+      "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-7.2.0.tgz",
+      "integrity": "sha512-yDPMNjp4WyfYBkHnjIRLfca1i6KMyGCtsVgoKe/z1+6vukgaENdgGBZt+ZmKPc4gavvEZ5OgHfHdrazhgNyG7w==",
       "license": "MIT",
       "dependencies": {
-        "ansi-regex": "^6.0.1"
+        "ansi-regex": "^6.2.2"
       },
       "engines": {
         "node": ">=12"
@@ -12875,9 +12954,9 @@
       }
     },
     "node_modules/svelte": {
-      "version": "5.53.5",
-      "resolved": "https://registry.npmjs.org/svelte/-/svelte-5.53.5.tgz",
-      "integrity": "sha512-YkqERnF05g8KLdDZwZrF8/i1eSbj6Eoat8Jjr2IfruZz9StLuBqo8sfCSzjosNKd+ZrQ8DkKZDjpO5y3ht1Pow==",
+      "version": "5.55.0",
+      "resolved": "https://registry.npmjs.org/svelte/-/svelte-5.55.0.tgz",
+      "integrity": "sha512-SThllKq6TRMBwPtat7ASnm/9CDXnIhBR0NPGw0ujn2DVYx9rVwsPZxDaDQcYGdUz/3BYVsCzdq7pZarRQoGvtw==",
       "license": "MIT",
       "peer": true,
       "dependencies": {
@@ -12890,7 +12969,7 @@
         "aria-query": "5.3.1",
         "axobject-query": "^4.1.0",
         "clsx": "^2.1.1",
-        "devalue": "^5.6.3",
+        "devalue": "^5.6.4",
         "esm-env": "^1.2.1",
         "esrap": "^2.2.2",
         "is-reference": "^3.0.3",
@@ -13022,15 +13101,15 @@
       }
     },
     "node_modules/tailwindcss": {
-      "version": "4.2.1",
-      "resolved": "https://registry.npmjs.org/tailwindcss/-/tailwindcss-4.2.1.tgz",
-      "integrity": "sha512-/tBrSQ36vCleJkAOsy9kbNTgaxvGbyOamC30PRePTQe/o1MFwEKHQk4Cn7BNGaPtjp+PuUrByJehM1hgxfq4sw==",
+      "version": "4.2.2",
+      "resolved": "https://registry.npmjs.org/tailwindcss/-/tailwindcss-4.2.2.tgz",
+      "integrity": "sha512-KWBIxs1Xb6NoLdMVqhbhgwZf2PGBpPEiwOqgI4pFIYbNTfBXiKYyWoTsXgBQ9WFg/OlhnvHaY+AEpW7wSmFo2Q==",
       "license": "MIT"
     },
     "node_modules/tapable": {
-      "version": "2.3.0",
-      "resolved": "https://registry.npmjs.org/tapable/-/tapable-2.3.0.tgz",
-      "integrity": "sha512-g9ljZiwki/LfxmQADO3dEY1CbpmXT5Hm2fJ+QaGKwSXUylMybePR7/67YW7jOrrvjEgL1Fmz5kzyAjWVWLlucg==",
+      "version": "2.3.2",
+      "resolved": "https://registry.npmjs.org/tapable/-/tapable-2.3.2.tgz",
+      "integrity": "sha512-1MOpMXuhGzGL5TTCZFItxCc0AARf1EZFQkGqMm7ERKj8+Hgr5oLvJOVFcC+lRmR8hCe2S3jC4T5D7Vg/d7/fhA==",
       "license": "MIT",
       "engines": {
         "node": ">=6"
@@ -13041,9 +13120,9 @@
       }
     },
     "node_modules/tar-fs": {
-      "version": "3.1.1",
-      "resolved": "https://registry.npmjs.org/tar-fs/-/tar-fs-3.1.1.tgz",
-      "integrity": "sha512-LZA0oaPOc2fVo82Txf3gw+AkEd38szODlptMYejQUhndHMLQ9M059uXR+AfS7DNo0NpINvSqDsvyaCrBVkptWg==",
+      "version": "3.1.2",
+      "resolved": "https://registry.npmjs.org/tar-fs/-/tar-fs-3.1.2.tgz",
+      "integrity": "sha512-QGxxTxxyleAdyM3kpFs14ymbYmNFrfY+pHj7Z8FgtbZ7w2//VAgLMac7sT6nRpIHjppXO2AwwEOg0bPFVRcmXw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -13056,13 +13135,14 @@
       }
     },
     "node_modules/tar-stream": {
-      "version": "3.1.7",
-      "resolved": "https://registry.npmjs.org/tar-stream/-/tar-stream-3.1.7.tgz",
-      "integrity": "sha512-qJj60CXt7IU1Ffyc3NJMjh6EkuCFej46zUqJ4J7pqYlThyd9bO0XBTmcOIhSzZJVWfsLks0+nle/j538YAW9RQ==",
+      "version": "3.1.8",
+      "resolved": "https://registry.npmjs.org/tar-stream/-/tar-stream-3.1.8.tgz",
+      "integrity": "sha512-U6QpVRyCGHva435KoNWy9PRoi2IFYCgtEhq9nmrPPpbRacPs9IH4aJ3gbrFC8dPcXvdSZ4XXfXT5Fshbp2MtlQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
         "b4a": "^1.6.4",
+        "bare-fs": "^4.5.5",
         "fast-fifo": "^1.2.0",
         "streamx": "^2.15.0"
       }
@@ -13073,7 +13153,6 @@
       "integrity": "sha512-eYE6iEI62Ni1H8oIa7KlDU6uQBtqr4Eajni3wX7rpfXD8ysFx8z0+dri+KWEPWpBsxXfxu58x/0jvTVT1ekOSg==",
       "dev": true,
       "license": "MIT",
-      "optional": true,
       "dependencies": {
         "streamx": "^2.12.5"
       }
@@ -13093,61 +13172,6 @@
         "node": ">=18"
       }
     },
-    "node_modules/test-exclude/node_modules/balanced-match": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz",
-      "integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==",
-      "dev": true,
-      "license": "MIT"
-    },
-    "node_modules/test-exclude/node_modules/brace-expansion": {
-      "version": "2.0.2",
-      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.2.tgz",
-      "integrity": "sha512-Jt0vHyM+jmUBqojB7E1NIYadt0vI0Qxjxd2TErW94wDz+E2LAm5vKMXXwg6ZZBTHPuUlDgQHKXvjGBdfcF1ZDQ==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "balanced-match": "^1.0.0"
-      }
-    },
-    "node_modules/test-exclude/node_modules/glob": {
-      "version": "10.5.0",
-      "resolved": "https://registry.npmjs.org/glob/-/glob-10.5.0.tgz",
-      "integrity": "sha512-DfXN8DfhJ7NH3Oe7cFmu3NCu1wKbkReJ8TorzSAFbSKrlNaQSKfIzqYqVY8zlbs2NLBbWpRiU52GX2PbaBVNkg==",
-      "deprecated": "Old versions of glob are not supported, and contain widely publicized security vulnerabilities, which have been fixed in the current version. Please update. Support for old versions may be purchased (at exorbitant rates) by contacting i@izs.me",
-      "dev": true,
-      "license": "ISC",
-      "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"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/isaacs"
-      }
-    },
-    "node_modules/test-exclude/node_modules/glob/node_modules/minimatch": {
-      "version": "9.0.9",
-      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.9.tgz",
-      "integrity": "sha512-OBwBN9AL4dqmETlpS2zasx+vTeWclWzkblfZk7KTA5j3jeOONz/tRCnZomUyvNg83wL5Zv9Ss6HMJXAgL8R2Yg==",
-      "dev": true,
-      "license": "ISC",
-      "dependencies": {
-        "brace-expansion": "^2.0.2"
-      },
-      "engines": {
-        "node": ">=16 || 14 >=14.17"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/isaacs"
-      }
-    },
     "node_modules/text-decoder": {
       "version": "1.2.7",
       "resolved": "https://registry.npmjs.org/text-decoder/-/text-decoder-1.2.7.tgz",
@@ -13185,9 +13209,9 @@
       "license": "MIT"
     },
     "node_modules/tinyexec": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/tinyexec/-/tinyexec-1.0.2.tgz",
-      "integrity": "sha512-W/KYk+NFhkmsYpuHq5JykngiOCnxeVL8v8dFnqxSD8qEEdRfXk1SDM6JzNqcERbcGYj9tMrDQBYV9cjgnunFIg==",
+      "version": "1.0.4",
+      "resolved": "https://registry.npmjs.org/tinyexec/-/tinyexec-1.0.4.tgz",
+      "integrity": "sha512-u9r3uZC0bdpGOXtlxUIdwf9pkmvhqJdrVCH9fapQtgy/OeTTMZ1nqH7agtvEfmGui6e1XxjcdrlxvxJvc3sMqw==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -13230,9 +13254,9 @@
       }
     },
     "node_modules/tinyglobby/node_modules/picomatch": {
-      "version": "4.0.3",
-      "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-4.0.3.tgz",
-      "integrity": "sha512-5gTmgEY/sqK6gFXLIsQNH19lWb4ebPDLA4SdLP7dsWkIXHWlG66oPuVvXSGFPppYZz8ZDZq0dYYrbHfBCVUb1Q==",
+      "version": "4.0.4",
+      "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-4.0.4.tgz",
+      "integrity": "sha512-QP88BAKvMam/3NxH6vj2o21R6MjxZUAd6nlwAS/pnGvN9IVLocLHxGYIzFhg6fUQ+5th6P4dv4eW9jX3DSIj7A==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -13273,22 +13297,22 @@
       }
     },
     "node_modules/tldts": {
-      "version": "7.0.23",
-      "resolved": "https://registry.npmjs.org/tldts/-/tldts-7.0.23.tgz",
-      "integrity": "sha512-ASdhgQIBSay0R/eXggAkQ53G4nTJqTXqC2kbaBbdDwM7SkjyZyO0OaaN1/FH7U/yCeqOHDwFO5j8+Os/IS1dXw==",
+      "version": "7.0.27",
+      "resolved": "https://registry.npmjs.org/tldts/-/tldts-7.0.27.tgz",
+      "integrity": "sha512-I4FZcVFcqCRuT0ph6dCDpPuO4Xgzvh+spkcTr1gK7peIvxWauoloVO0vuy1FQnijT63ss6AsHB6+OIM4aXHbPg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "tldts-core": "^7.0.23"
+        "tldts-core": "^7.0.27"
       },
       "bin": {
         "tldts": "bin/cli.js"
       }
     },
     "node_modules/tldts-core": {
-      "version": "7.0.23",
-      "resolved": "https://registry.npmjs.org/tldts-core/-/tldts-core-7.0.23.tgz",
-      "integrity": "sha512-0g9vrtDQLrNIiCj22HSe9d4mLVG3g5ph5DZ8zCKBr4OtrspmNB6ss7hVyzArAeE88ceZocIEGkyW1Ime7fxPtQ==",
+      "version": "7.0.27",
+      "resolved": "https://registry.npmjs.org/tldts-core/-/tldts-core-7.0.27.tgz",
+      "integrity": "sha512-YQ7uPjgWUibIK6DW5lrKujGwUKhLevU4hcGbP5O6TcIUb+oTjJYJVWPS4nZsIHrEEEG6myk/oqAJUEQmpZrHsg==",
       "dev": true,
       "license": "MIT"
     },
@@ -13306,9 +13330,9 @@
       }
     },
     "node_modules/tough-cookie": {
-      "version": "6.0.0",
-      "resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-6.0.0.tgz",
-      "integrity": "sha512-kXuRi1mtaKMrsLUxz3sQYvVl37B0Ns6MzfrtV5DvJceE9bPyspOqk9xxv7XbZWcfLWbFmm997vl83qUWVJA64w==",
+      "version": "6.0.1",
+      "resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-6.0.1.tgz",
+      "integrity": "sha512-LktZQb3IeoUWB9lqR5EWTHgW/VTITCXg4D21M+lvybRVdylLrRMnqaIONLVb5mav8vM19m44HIcGq4qASeu2Qw==",
       "dev": true,
       "license": "BSD-3-Clause",
       "dependencies": {
@@ -13342,9 +13366,9 @@
       }
     },
     "node_modules/ts-api-utils": {
-      "version": "2.4.0",
-      "resolved": "https://registry.npmjs.org/ts-api-utils/-/ts-api-utils-2.4.0.tgz",
-      "integrity": "sha512-3TaVTaAv2gTiMB35i3FiGJaRfwb3Pyn/j3m/bfAvGe8FB7CF6u+LMYqYlDh7reQf7UNvoTvdfAqHGmPGOSsPmA==",
+      "version": "2.5.0",
+      "resolved": "https://registry.npmjs.org/ts-api-utils/-/ts-api-utils-2.5.0.tgz",
+      "integrity": "sha512-OJ/ibxhPlqrMM0UiNHJ/0CKQkoKF243/AEmplt3qpRgkW8VG7IfOS41h7V8TjITqdByHzrjcS/2si+y4lIh8NA==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -13483,9 +13507,9 @@
       }
     },
     "node_modules/typed-query-selector": {
-      "version": "2.12.0",
-      "resolved": "https://registry.npmjs.org/typed-query-selector/-/typed-query-selector-2.12.0.tgz",
-      "integrity": "sha512-SbklCd1F0EiZOyPiW192rrHZzZ5sBijB6xM+cpmrwDqObvdtunOHHIk9fCGsoK5JVIYXoyEp4iEdE3upFH3PAg==",
+      "version": "2.12.1",
+      "resolved": "https://registry.npmjs.org/typed-query-selector/-/typed-query-selector-2.12.1.tgz",
+      "integrity": "sha512-uzR+FzI8qrUEIu96oaeBJmd9E7CFEiQ3goA5qCVgc4s5llSubcfGHq9yUstZx/k4s9dXHVKsE35YWoFyvEqEHA==",
       "dev": true,
       "license": "MIT"
     },
@@ -13504,16 +13528,16 @@
       }
     },
     "node_modules/typescript-eslint": {
-      "version": "8.56.1",
-      "resolved": "https://registry.npmjs.org/typescript-eslint/-/typescript-eslint-8.56.1.tgz",
-      "integrity": "sha512-U4lM6pjmBX7J5wk4szltF7I1cGBHXZopnAXCMXb3+fZ3B/0Z3hq3wS/CCUB2NZBNAExK92mCU2tEohWuwVMsDQ==",
+      "version": "8.57.2",
+      "resolved": "https://registry.npmjs.org/typescript-eslint/-/typescript-eslint-8.57.2.tgz",
+      "integrity": "sha512-VEPQ0iPgWO/sBaZOU1xo4nuNdODVOajPnTIbog2GKYr31nIlZ0fWPoCQgGfF3ETyBl1vn63F/p50Um9Z4J8O8A==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@typescript-eslint/eslint-plugin": "8.56.1",
-        "@typescript-eslint/parser": "8.56.1",
-        "@typescript-eslint/typescript-estree": "8.56.1",
-        "@typescript-eslint/utils": "8.56.1"
+        "@typescript-eslint/eslint-plugin": "8.57.2",
+        "@typescript-eslint/parser": "8.57.2",
+        "@typescript-eslint/typescript-estree": "8.57.2",
+        "@typescript-eslint/utils": "8.57.2"
       },
       "engines": {
         "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
@@ -13838,9 +13862,9 @@
       }
     },
     "node_modules/vite-plugin-static-copy": {
-      "version": "3.2.0",
-      "resolved": "https://registry.npmjs.org/vite-plugin-static-copy/-/vite-plugin-static-copy-3.2.0.tgz",
-      "integrity": "sha512-g2k9z8B/1Bx7D4wnFjPLx9dyYGrqWMLTpwTtPHhcU+ElNZP2O4+4OsyaficiDClus0dzVhdGvoGFYMJxoXZ12Q==",
+      "version": "3.4.0",
+      "resolved": "https://registry.npmjs.org/vite-plugin-static-copy/-/vite-plugin-static-copy-3.4.0.tgz",
+      "integrity": "sha512-ekryzCw0ouAOE8tw4RvVL/dfqguXzumsV3FBKoKso4MQ1MUUrUXtl5RI4KpJQUNGqFEsg9kxl4EvDl02YtA9VQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -13857,7 +13881,7 @@
         "url": "https://github.com/sponsors/sapphi-red"
       },
       "peerDependencies": {
-        "vite": "^5.0.0 || ^6.0.0 || ^7.0.0"
+        "vite": "^5.0.0 || ^6.0.0 || ^7.0.0 || ^8.0.0"
       }
     },
     "node_modules/vite-tsconfig-paths": {
@@ -13914,9 +13938,9 @@
       }
     },
     "node_modules/vite/node_modules/picomatch": {
-      "version": "4.0.3",
-      "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-4.0.3.tgz",
-      "integrity": "sha512-5gTmgEY/sqK6gFXLIsQNH19lWb4ebPDLA4SdLP7dsWkIXHWlG66oPuVvXSGFPppYZz8ZDZq0dYYrbHfBCVUb1Q==",
+      "version": "4.0.4",
+      "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-4.0.4.tgz",
+      "integrity": "sha512-QP88BAKvMam/3NxH6vj2o21R6MjxZUAd6nlwAS/pnGvN9IVLocLHxGYIzFhg6fUQ+5th6P4dv4eW9jX3DSIj7A==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -14000,9 +14024,9 @@
       }
     },
     "node_modules/vitest/node_modules/picomatch": {
-      "version": "4.0.3",
-      "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-4.0.3.tgz",
-      "integrity": "sha512-5gTmgEY/sqK6gFXLIsQNH19lWb4ebPDLA4SdLP7dsWkIXHWlG66oPuVvXSGFPppYZz8ZDZq0dYYrbHfBCVUb1Q==",
+      "version": "4.0.4",
+      "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-4.0.4.tgz",
+      "integrity": "sha512-QP88BAKvMam/3NxH6vj2o21R6MjxZUAd6nlwAS/pnGvN9IVLocLHxGYIzFhg6fUQ+5th6P4dv4eW9jX3DSIj7A==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -14029,17 +14053,17 @@
       }
     },
     "node_modules/vue": {
-      "version": "3.5.29",
-      "resolved": "https://registry.npmjs.org/vue/-/vue-3.5.29.tgz",
-      "integrity": "sha512-BZqN4Ze6mDQVNAni0IHeMJ5mwr8VAJ3MQC9FmprRhcBYENw+wOAAjRj8jfmN6FLl0j96OXbR+CjWhmAmM+QGnA==",
+      "version": "3.5.30",
+      "resolved": "https://registry.npmjs.org/vue/-/vue-3.5.30.tgz",
+      "integrity": "sha512-hTHLc6VNZyzzEH/l7PFGjpcTvUgiaPK5mdLkbjrTeWSRcEfxFrv56g/XckIYlE9ckuobsdwqd5mk2g1sBkMewg==",
       "license": "MIT",
       "peer": true,
       "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"
+        "@vue/compiler-dom": "3.5.30",
+        "@vue/compiler-sfc": "3.5.30",
+        "@vue/runtime-dom": "3.5.30",
+        "@vue/server-renderer": "3.5.30",
+        "@vue/shared": "3.5.30"
       },
       "peerDependencies": {
         "typescript": "*"
@@ -14287,9 +14311,9 @@
       "license": "ISC"
     },
     "node_modules/ws": {
-      "version": "8.19.0",
-      "resolved": "https://registry.npmjs.org/ws/-/ws-8.19.0.tgz",
-      "integrity": "sha512-blAT2mjOEIi0ZzruJfIhb3nps74PRWTCz1IjglWEEpQl5XS/UNama6u2/rjFkDDouqr4L67ry+1aGIALViWjDg==",
+      "version": "8.20.0",
+      "resolved": "https://registry.npmjs.org/ws/-/ws-8.20.0.tgz",
+      "integrity": "sha512-sAt8BhgNbzCtgGbt2OxmpuryO63ZoDk/sqaB/znQm94T4fCEsy/yV+7CdC1kJhOU9lboAEU7R3kquuycDoibVA==",
       "license": "MIT",
       "engines": {
         "node": ">=10.0.0"
@@ -14335,9 +14359,9 @@
       }
     },
     "node_modules/yaml": {
-      "version": "2.8.2",
-      "resolved": "https://registry.npmjs.org/yaml/-/yaml-2.8.2.tgz",
-      "integrity": "sha512-mplynKqc1C2hTVYxd0PU2xQAc22TI1vShAYGksCCfxbn/dFwnHTNi1bvYsBTkhdUNtGIf5xNOg938rrSSYvS9A==",
+      "version": "2.8.3",
+      "resolved": "https://registry.npmjs.org/yaml/-/yaml-2.8.3.tgz",
+      "integrity": "sha512-AvbaCLOO2Otw/lW5bmh9d/WEdcDFdQp2Z2ZUH3pX9U2ihyUY0nvLv7J6TrWowklRGPYbB/IuIMfYgxaCPg5Bpg==",
       "dev": true,
       "license": "ISC",
       "bin": {
diff --git a/frontend/package.json b/frontend/package.json
index c53d89c9a4..a26b3315fd 100644
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -55,7 +55,7 @@
     "@tauri-apps/plugin-shell": "^2.3.5",
     "@userback/widget": "^0.3.12",
     "autoprefixer": "^10.4.21",
-    "axios": "^1.13.2",
+    "axios": "^1.15.0",
     "d3": "^7.9.0",
     "globals": "^17.1.0",
     "i18next": "^25.5.2",
@@ -64,6 +64,7 @@
     "license-report": "^6.8.0",
     "pdfjs-dist": "^5.4.149",
     "peerjs": "^1.5.5",
+    "pixelmatch": "^7.1.0",
     "posthog-js": "^1.268.0",
     "qrcode.react": "^4.2.0",
     "react": "^19.1.1",
@@ -79,52 +80,7 @@
     "web-vitals": "^5.1.0"
   },
   "scripts": {
-    "prep": "tsx scripts/setup-env.ts && npm run generate-icons",
-    "prep:saas": "tsx scripts/setup-env.ts --saas && npm run generate-icons",
-    "prep:desktop": "tsx scripts/setup-env.ts --desktop && npm run generate-icons",
-    "prep:desktop-build": "node scripts/build-provisioner.mjs && npm run prep:desktop",
-    "dev": "npm run prep && vite",
-    "dev:core": "npm run prep && vite --mode core",
-    "dev:proprietary": "npm run prep && vite --mode proprietary",
-    "dev:saas": "npm run prep:saas && vite --mode saas",
-    "dev:desktop": "npm run prep:desktop && vite --mode desktop",
-    "lint": "npm run lint:eslint && npm run lint:cycles",
-    "lint:eslint": "eslint --max-warnings=0",
-    "lint:cycles": "dpdm src --circular --no-warning --no-tree --exit-code circular:1",
-    "build": "npm run prep && vite build",
-    "build:core": "npm run prep && vite build --mode core",
-    "build:proprietary": "npm run prep && vite build --mode proprietary",
-    "build:saas": "npm run prep:saas && vite build --mode saas",
-    "build:desktop": "npm run prep:desktop && vite build --mode desktop",
-    "preview": "vite preview",
-    "tauri-dev": "npm run prep:desktop && tauri dev --no-watch",
-    "tauri-build": "npm run prep:desktop-build && tauri build",
-    "_tauri-build-dev": "npm run prep:desktop && tauri build",
-    "tauri-build-dev": "npm run _tauri-build-dev -- --no-bundle",
-    "tauri-build-dev-mac": "npm run _tauri-build-dev -- --bundles app",
-    "tauri-build-dev-windows": "npm run _tauri-build-dev -- --bundles nsis",
-    "tauri-build-dev-linux": "npm run _tauri-build-dev -- --bundles appimage",
-    "tauri-clean": "cd src-tauri && cargo clean && cd .. && rm -rf dist build",
-    "typecheck": "npm run typecheck:proprietary",
-    "typecheck:core": "tsc --noEmit --project src/core/tsconfig.json",
-    "typecheck:proprietary": "tsc --noEmit --project src/proprietary/tsconfig.json",
-    "typecheck:saas": "tsc --noEmit --project src/saas/tsconfig.json",
-    "typecheck:desktop": "tsc --noEmit --project src/desktop/tsconfig.json",
-    "typecheck:scripts": "tsc --noEmit --project scripts/tsconfig.json",
-    "typecheck:all": "npm run typecheck:core && npm run typecheck:proprietary && npm run typecheck:saas && npm run typecheck:desktop && npm run typecheck:scripts",
-    "check": "npm run typecheck && npm run lint && npm run test:run",
-    "generate-licenses": "node scripts/generate-licenses.js",
-    "generate-icons": "node scripts/generate-icons.js",
-    "generate-icons:verbose": "node scripts/generate-icons.js --verbose",
-    "generate-sample-pdf": "node scripts/sample-pdf/generate.mjs",
-    "test": "vitest",
-    "test:run": "vitest run",
-    "test:watch": "vitest --watch",
-    "test:coverage": "vitest --coverage",
-    "test:e2e": "playwright test",
-    "test:e2e:ui": "playwright test --ui",
-    "test:e2e:install": "playwright install",
-    "update:minor": "npm outdated || npm update && npm audit fix && npm test",
+    "update:minor": "npm outdated || npm update --before=$(date -v-7d +%Y-%m-%d) && (npm audit fix --before=$(date -v-7d +%Y-%m-%d) || true) && npm test",
     "update:major": "npx npm-check-updates -u && npm install",
     "update:interactive": "npx npm-check-updates -i",
     "update:minor-strict": "npx npm-check-updates -u --target minor && npm install"
@@ -173,6 +129,7 @@
     "postcss-cli": "^11.0.1",
     "postcss-preset-mantine": "^1.18.0",
     "postcss-simple-vars": "^7.0.1",
+    "prettier": "^3.8.1",
     "puppeteer": "^24.25.0",
     "tsx": "^4.21.0",
     "typescript": "^5.9.2",
diff --git a/frontend/playwright.config.ts b/frontend/playwright.config.ts
index 14eb25f85c..58590adebf 100644
--- a/frontend/playwright.config.ts
+++ b/frontend/playwright.config.ts
@@ -1,11 +1,11 @@
-import { defineConfig, devices } from '@playwright/test';
+import { defineConfig, devices } from "@playwright/test";
 
 /**
  * @see https://playwright.dev/docs/test-configuration
  */
 export default defineConfig({
-  testDir: './src/core/tests',
-  testMatch: '**/*.spec.ts',
+  testDir: "./src/core/tests",
+  testMatch: "**/*.spec.ts",
   /* Run tests in files in parallel */
   fullyParallel: true,
   /* Fail the build on CI if you accidentally left test.only in the source code. */
@@ -15,34 +15,34 @@ export default defineConfig({
   /* Opt out of parallel tests on CI. */
   workers: process.env.CI ? 1 : undefined,
   /* Reporter to use. See https://playwright.dev/docs/test-reporters */
-  reporter: 'html',
+  reporter: "html",
   /* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */
   use: {
     /* Base URL to use in actions like `await page.goto('/')`. */
-    baseURL: 'http://localhost:5173',
+    baseURL: "http://localhost:5173",
 
     /* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */
-    trace: 'on-first-retry',
+    trace: "on-first-retry",
   },
 
   /* Configure projects for major browsers */
   projects: [
     {
-      name: 'chromium',
-      use: { 
-        ...devices['Desktop Chrome'],
-        viewport: { width: 1920, height: 1080 }
+      name: "chromium",
+      use: {
+        ...devices["Desktop Chrome"],
+        viewport: { width: 1920, height: 1080 },
       },
     },
 
     {
-      name: 'firefox',
-      use: { ...devices['Desktop Firefox'] },
+      name: "firefox",
+      use: { ...devices["Desktop Firefox"] },
     },
 
     {
-      name: 'webkit',
-      use: { ...devices['Desktop Safari'] },
+      name: "webkit",
+      use: { ...devices["Desktop Safari"] },
     },
 
     /* Test against mobile viewports. */
@@ -68,8 +68,8 @@ export default defineConfig({
 
   /* Run your local dev server before starting the tests */
   webServer: {
-    command: 'npm run dev',
-    url: 'http://localhost:5173',
+    command: "npx vite",
+    url: "http://localhost:5173",
     reuseExistingServer: !process.env.CI,
   },
-});
\ No newline at end of file
+});
diff --git a/frontend/postcss.config.js b/frontend/postcss.config.js
index 57e730c99a..7b8895cce8 100644
--- a/frontend/postcss.config.js
+++ b/frontend/postcss.config.js
@@ -1,6 +1,3 @@
 module.exports = {
-  plugins: [
-    require('@tailwindcss/postcss'),
-    require('autoprefixer'),
-  ],
+  plugins: [require("@tailwindcss/postcss"), require("autoprefixer")],
 };
diff --git a/frontend/public/css/cookieconsentCustomisation.css b/frontend/public/css/cookieconsentCustomisation.css
index ec360c20be..fd1a8ff355 100644
--- a/frontend/public/css/cookieconsentCustomisation.css
+++ b/frontend/public/css/cookieconsentCustomisation.css
@@ -1,206 +1,205 @@
 /* Light theme variables */
 :root {
-    --cc-bg: #ffffff;
-    --cc-primary-color: #1c1c1c;
-    --cc-secondary-color: #666666;
+  --cc-bg: #ffffff;
+  --cc-primary-color: #1c1c1c;
+  --cc-secondary-color: #666666;
 
-    --cc-btn-primary-bg: #007BFF;
-    --cc-btn-primary-color: #ffffff;
-    --cc-btn-primary-border-color: #007BFF;
-    --cc-btn-primary-hover-bg: #0056b3;
-    --cc-btn-primary-hover-color: #ffffff;
-    --cc-btn-primary-hover-border-color: #0056b3;
+  --cc-btn-primary-bg: #007bff;
+  --cc-btn-primary-color: #ffffff;
+  --cc-btn-primary-border-color: #007bff;
+  --cc-btn-primary-hover-bg: #0056b3;
+  --cc-btn-primary-hover-color: #ffffff;
+  --cc-btn-primary-hover-border-color: #0056b3;
 
-    --cc-btn-secondary-bg: #f1f3f4;
-    --cc-btn-secondary-color: #1c1c1c;
-    --cc-btn-secondary-border-color: #f1f3f4;
-    --cc-btn-secondary-hover-bg: #007BFF;
-    --cc-btn-secondary-hover-color: #ffffff;
-    --cc-btn-secondary-hover-border-color: #007BFF;
+  --cc-btn-secondary-bg: #f1f3f4;
+  --cc-btn-secondary-color: #1c1c1c;
+  --cc-btn-secondary-border-color: #f1f3f4;
+  --cc-btn-secondary-hover-bg: #007bff;
+  --cc-btn-secondary-hover-color: #ffffff;
+  --cc-btn-secondary-hover-border-color: #007bff;
 
-    --cc-separator-border-color: #e0e0e0;
+  --cc-separator-border-color: #e0e0e0;
 
-    --cc-toggle-on-bg: #007BFF;
-    --cc-toggle-off-bg: #667481;
-    --cc-toggle-on-knob-bg: #ffffff;
-    --cc-toggle-off-knob-bg: #ffffff;
+  --cc-toggle-on-bg: #007bff;
+  --cc-toggle-off-bg: #667481;
+  --cc-toggle-on-knob-bg: #ffffff;
+  --cc-toggle-off-knob-bg: #ffffff;
 
-    --cc-toggle-enabled-icon-color: #ffffff;   
-    --cc-toggle-disabled-icon-color: #ffffff;  
+  --cc-toggle-enabled-icon-color: #ffffff;
+  --cc-toggle-disabled-icon-color: #ffffff;
 
-    --cc-toggle-readonly-bg: #f1f3f4;
-    --cc-toggle-readonly-knob-bg: #79747E;
-    --cc-toggle-readonly-knob-icon-color: #f1f3f4;
+  --cc-toggle-readonly-bg: #f1f3f4;
+  --cc-toggle-readonly-knob-bg: #79747e;
+  --cc-toggle-readonly-knob-icon-color: #f1f3f4;
 
-    --cc-section-category-border: #e0e0e0;
+  --cc-section-category-border: #e0e0e0;
 
-    --cc-cookie-category-block-bg: #f1f3f4;
-    --cc-cookie-category-block-border: #f1f3f4; 
-    --cc-cookie-category-block-hover-bg: #e9eff4;
-    --cc-cookie-category-block-hover-border: #e9eff4;
-    
-    --cc-cookie-category-expanded-block-bg: #f1f3f4;
-    --cc-cookie-category-expanded-block-hover-bg: #e9eff4;
+  --cc-cookie-category-block-bg: #f1f3f4;
+  --cc-cookie-category-block-border: #f1f3f4;
+  --cc-cookie-category-block-hover-bg: #e9eff4;
+  --cc-cookie-category-block-hover-border: #e9eff4;
 
-    --cc-footer-bg: #ffffff;
-    --cc-footer-color: #1c1c1c;
-    --cc-footer-border-color: #ffffff; 
+  --cc-cookie-category-expanded-block-bg: #f1f3f4;
+  --cc-cookie-category-expanded-block-hover-bg: #e9eff4;
+
+  --cc-footer-bg: #ffffff;
+  --cc-footer-color: #1c1c1c;
+  --cc-footer-border-color: #ffffff;
 }
 
 /* Dark theme variables */
-.cc--darkmode{
-    --cc-bg: #2d2d2d;
-    --cc-primary-color: #e5e5e5;
-    --cc-secondary-color: #b0b0b0;
+.cc--darkmode {
+  --cc-bg: #2d2d2d;
+  --cc-primary-color: #e5e5e5;
+  --cc-secondary-color: #b0b0b0;
 
-    --cc-btn-primary-bg: #4dabf7;
-    --cc-btn-primary-color: #ffffff;
-    --cc-btn-primary-border-color: #4dabf7;
-    --cc-btn-primary-hover-bg: #3d3d3d;
-    --cc-btn-primary-hover-color: #ffffff;
-    --cc-btn-primary-hover-border-color: #3d3d3d;
+  --cc-btn-primary-bg: #4dabf7;
+  --cc-btn-primary-color: #ffffff;
+  --cc-btn-primary-border-color: #4dabf7;
+  --cc-btn-primary-hover-bg: #3d3d3d;
+  --cc-btn-primary-hover-color: #ffffff;
+  --cc-btn-primary-hover-border-color: #3d3d3d;
 
-    --cc-btn-secondary-bg: #3d3d3d;
-    --cc-btn-secondary-color: #ffffff;
-    --cc-btn-secondary-border-color: #3d3d3d;
-    --cc-btn-secondary-hover-bg: #4dabf7;
-    --cc-btn-secondary-hover-color: #ffffff;
-    --cc-btn-secondary-hover-border-color: #4dabf7;
+  --cc-btn-secondary-bg: #3d3d3d;
+  --cc-btn-secondary-color: #ffffff;
+  --cc-btn-secondary-border-color: #3d3d3d;
+  --cc-btn-secondary-hover-bg: #4dabf7;
+  --cc-btn-secondary-hover-color: #ffffff;
+  --cc-btn-secondary-hover-border-color: #4dabf7;
 
-    --cc-separator-border-color: #555555;
+  --cc-separator-border-color: #555555;
 
-    --cc-toggle-on-bg: #4dabf7;
-    --cc-toggle-off-bg: #667481;
-    --cc-toggle-on-knob-bg: #2d2d2d;
-    --cc-toggle-off-knob-bg: #2d2d2d;
+  --cc-toggle-on-bg: #4dabf7;
+  --cc-toggle-off-bg: #667481;
+  --cc-toggle-on-knob-bg: #2d2d2d;
+  --cc-toggle-off-knob-bg: #2d2d2d;
 
-    --cc-toggle-enabled-icon-color: #2d2d2d;   
-    --cc-toggle-disabled-icon-color: #2d2d2d;  
+  --cc-toggle-enabled-icon-color: #2d2d2d;
+  --cc-toggle-disabled-icon-color: #2d2d2d;
 
-    --cc-toggle-readonly-bg: #555555;
-    --cc-toggle-readonly-knob-bg: #8e8e8e;
-    --cc-toggle-readonly-knob-icon-color: #555555;
+  --cc-toggle-readonly-bg: #555555;
+  --cc-toggle-readonly-knob-bg: #8e8e8e;
+  --cc-toggle-readonly-knob-icon-color: #555555;
 
-    --cc-section-category-border: #555555;
+  --cc-section-category-border: #555555;
 
-    --cc-cookie-category-block-bg: #3d3d3d;
-    --cc-cookie-category-block-border: #3d3d3d; 
-    --cc-cookie-category-block-hover-bg: #4d4d4d;
-    --cc-cookie-category-block-hover-border: #4d4d4d;
-    
-    --cc-cookie-category-expanded-block-bg: #3d3d3d;
-    --cc-cookie-category-expanded-block-hover-bg: #4d4d4d;
+  --cc-cookie-category-block-bg: #3d3d3d;
+  --cc-cookie-category-block-border: #3d3d3d;
+  --cc-cookie-category-block-hover-bg: #4d4d4d;
+  --cc-cookie-category-block-hover-border: #4d4d4d;
 
-    --cc-footer-bg: #2d2d2d;
-    --cc-footer-color: #e5e5e5;
-    --cc-footer-border-color: #2d2d2d; 
+  --cc-cookie-category-expanded-block-bg: #3d3d3d;
+  --cc-cookie-category-expanded-block-hover-bg: #4d4d4d;
+
+  --cc-footer-bg: #2d2d2d;
+  --cc-footer-color: #e5e5e5;
+  --cc-footer-border-color: #2d2d2d;
 }
-.cm__body{
-    max-width: 90% !important;
-    flex-direction: row !important;
-    align-items: center !important;
-
+.cm__body {
+  max-width: 90% !important;
+  flex-direction: row !important;
+  align-items: center !important;
 }
 
-.cm__desc{
-    max-width: 70rem !important;
+.cm__desc {
+  max-width: 70rem !important;
 }
 
-.cm__btns{
-    flex-direction: row-reverse !important;
-    gap:10px !important;
-    padding-top: 3.4rem !important;
+.cm__btns {
+  flex-direction: row-reverse !important;
+  gap: 10px !important;
+  padding-top: 3.4rem !important;
 }
 
 @media only screen and (max-width: 1400px) {
-    .cm__body{
-        max-width: 90% !important;
-        flex-direction: column !important;
-        align-items: normal !important;
-    }
+  .cm__body {
+    max-width: 90% !important;
+    flex-direction: column !important;
+    align-items: normal !important;
+  }
 
-    .cm__btns{
-        padding-top: 1rem !important;
-    }
+  .cm__btns {
+    padding-top: 1rem !important;
+  }
 }
 
 /* Toggle visibility fixes */
 #cc-main .section__toggle {
-    opacity: 0 !important; /* Keep invisible but functional */
+  opacity: 0 !important; /* Keep invisible but functional */
 }
 
 #cc-main .toggle__icon {
-    display: flex !important;
-    align-items: center !important;
-    justify-content: flex-start !important;
+  display: flex !important;
+  align-items: center !important;
+  justify-content: flex-start !important;
 }
 
 #cc-main .toggle__icon-circle {
-    display: block !important;
-    position: absolute !important;
-    transition: transform 0.25s ease !important;
+  display: block !important;
+  position: absolute !important;
+  transition: transform 0.25s ease !important;
 }
 
 #cc-main .toggle__icon-on,
 #cc-main .toggle__icon-off {
-    display: flex !important;
-    align-items: center !important;
-    justify-content: center !important;
-    position: absolute !important;
-    width: 100% !important;
-    height: 100% !important;
+  display: flex !important;
+  align-items: center !important;
+  justify-content: center !important;
+  position: absolute !important;
+  width: 100% !important;
+  height: 100% !important;
 }
 
 /* Ensure toggles are visible in both themes */
 #cc-main .toggle__icon {
-    background: var(--cc-toggle-off-bg) !important;
-    border: 1px solid var(--cc-toggle-off-bg) !important;
+  background: var(--cc-toggle-off-bg) !important;
+  border: 1px solid var(--cc-toggle-off-bg) !important;
 }
 
 #cc-main .section__toggle:checked ~ .toggle__icon {
-    background: var(--cc-toggle-on-bg) !important;
-    border: 1px solid var(--cc-toggle-on-bg) !important;
+  background: var(--cc-toggle-on-bg) !important;
+  border: 1px solid var(--cc-toggle-on-bg) !important;
 }
 
 /* Ensure toggle text is visible */
 #cc-main .pm__section-title {
-    color: var(--cc-primary-color) !important;
+  color: var(--cc-primary-color) !important;
 }
 
 #cc-main .pm__section-desc {
-    color: var(--cc-secondary-color) !important;
+  color: var(--cc-secondary-color) !important;
 }
 
 /* Make sure the modal has proper contrast */
 #cc-main .pm {
-    background: var(--cc-bg) !important;
-    color: var(--cc-primary-color) !important;
+  background: var(--cc-bg) !important;
+  color: var(--cc-primary-color) !important;
 }
 
 /* Lower z-index so cookie banner appears behind onboarding modals */
 #cc-main {
-    z-index: 100 !important;
+  z-index: 100 !important;
 }
 
 /* Ensure consent modal text is visible in both themes */
 #cc-main .cm {
-    background: var(--cc-bg) !important;
-    color: var(--cc-primary-color) !important;
+  background: var(--cc-bg) !important;
+  color: var(--cc-primary-color) !important;
 }
 
 #cc-main .cm__title {
-    color: var(--cc-primary-color) !important;
+  color: var(--cc-primary-color) !important;
 }
 
 #cc-main .cm__desc {
-    color: var(--cc-primary-color) !important;
+  color: var(--cc-primary-color) !important;
 }
 
 #cc-main .cm__footer {
-    color: var(--cc-primary-color) !important;
+  color: var(--cc-primary-color) !important;
 }
 
 #cc-main .cm__footer-links a,
 #cc-main .cm__link {
-    color: var(--cc-primary-color) !important;
-}
\ No newline at end of file
+  color: var(--cc-primary-color) !important;
+}
diff --git a/frontend/public/images/google-drive.svg b/frontend/public/images/google-drive.svg
new file mode 100644
index 0000000000..03b2f21290
--- /dev/null
+++ b/frontend/public/images/google-drive.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg"  viewBox="0 0 48 48" width="96px" height="96px"><path fill="#1e88e5" d="M38.59,39c-0.535,0.93-0.298,1.68-1.195,2.197C36.498,41.715,35.465,42,34.39,42H13.61 c-1.074,0-2.106-0.285-3.004-0.802C9.708,40.681,9.945,39.93,9.41,39l7.67-9h13.84L38.59,39z"/><path fill="#fbc02d" d="M27.463,6.999c1.073-0.002,2.104-0.716,3.001-0.198c0.897,0.519,1.66,1.27,2.197,2.201l10.39,17.996 c0.537,0.93,0.807,1.967,0.808,3.002c0.001,1.037-1.267,2.073-1.806,3.001l-11.127-3.005l-6.924-11.993L27.463,6.999z"/><path fill="#e53935" d="M43.86,30c0,1.04-0.27,2.07-0.81,3l-3.67,6.35c-0.53,0.78-1.21,1.4-1.99,1.85L30.92,30H43.86z"/><path fill="#4caf50" d="M5.947,33.001c-0.538-0.928-1.806-1.964-1.806-3c0.001-1.036,0.27-2.073,0.808-3.004l10.39-17.996 c0.537-0.93,1.3-1.682,2.196-2.2c0.897-0.519,1.929,0.195,3.002,0.197l3.459,11.009l-6.922,11.989L5.947,33.001z"/><path fill="#1565c0" d="M17.08,30l-6.47,11.2c-0.78-0.45-1.46-1.07-1.99-1.85L4.95,33c-0.54-0.93-0.81-1.96-0.81-3H17.08z"/><path fill="#2e7d32" d="M30.46,6.8L24,18L17.53,6.8c0.78-0.45,1.66-0.73,2.6-0.79L27.46,6C28.54,6,29.57,6.28,30.46,6.8z"/></svg>
\ No newline at end of file
diff --git a/frontend/public/locales/ar-AR/translation.toml b/frontend/public/locales/ar-AR/translation.toml
index e3329dc08f..1bd56a9ae7 100644
--- a/frontend/public/locales/ar-AR/translation.toml
+++ b/frontend/public/locales/ar-AR/translation.toml
@@ -8,6 +8,7 @@ black = "أسود"
 blue = "أزرق"
 bored = "الانتظار بالملل؟"
 cancel = "إلغاء"
+confirm = "تأكيد"
 changedCredsMessage = "تم تغيير بيانات الاعتماد!"
 chooseFile = "اختر مل�ًا"
 close = "إغلاق"
@@ -146,6 +147,7 @@ insufficientCredits = "الأرصدة غير كا�ية. المطلوب: {{requi
 loadingCredits = "جار� التحقق من الأرصدة..."
 loadingProStatus = "جار� التحقق من حالة الاشتراك..."
 noticeTopUpOrPlan = "لا توجد أرصدة كا�ية، يرجى إعادة الشحن أو الترقية إلى خطة"
+accessInvite = "دعوة"
 
 [account]
 accountSettings = "إعدادات الحساب"
@@ -1427,6 +1429,34 @@ title = "المعالجة"
 description = "المدة القصوى لانتظار مهمة معالجة قبل الإبلاغ عن خطأ."
 label = "مهلة المعالجة (ثوان�)"
 
+[admin.settings.storage]
+description = "التحكم �ي تخزين الخادم وخيارات المشاركة."
+title = "تخزين المل�ات والمشاركة"
+
+[admin.settings.storage.enabled]
+description = "السماح للمستخدمين بتخزين المل�ات على الخادم."
+label = "تمكين تخزين مل�ات الخادم"
+
+[admin.settings.storage.sharing.email]
+description = "السماح بالمشاركة عبر عناوين البريد الإلكتروني."
+label = "تمكين المشاركة عبر البريد الإلكتروني"
+mailLink = "ضبط إعدادات البريد"
+mailNote = "يتطلب إعداد البريد. "
+
+[admin.settings.storage.sharing.enabled]
+description = "السماح للمستخدمين بمشاركة المل�ات المخزنة."
+label = "تمكين المشاركة"
+
+[admin.settings.storage.sharing.links]
+description = "السماح بالمشاركة عبر روابط تتطلب تسجيل الدخول."
+frontendUrlLink = "الضبط �ي إعدادات النظام"
+frontendUrlNote = "يتطلب عنوان URL للواجهة الأمامية. "
+label = "تمكين روابط المشاركة"
+
+[admin.settings.storage.signing.enabled]
+description = "السماح للمستخدمين بإنشاء جلسات توقيع بمشاركة عدة أطرا�. يتطلب تمكين تخزين مل�ات الخادم."
+label = "تمكين التوقيع الجماعي (أل�ا)"
+
 [admin.settings.unsavedChanges]
 cancel = "متابعة التحرير"
 discard = "تجاهل التغييرات"
@@ -2059,7 +2089,19 @@ numbers = "الأرقام/النطاقات: 5, 10-20"
 progressions = "التقدّم: 3n, 4n+1"
 
 [certSign]
+allSigned = "وقّع جميع المشاركين. جاهز للإنهاء."
+awaitingSignatures = "بانتظار التواقيع"
+signatureProgress = "{{signedCount}}/{{totalCount}} توقيعات"
 chooseCertificate = "اختر مل� الشهادة"
+declined = "مر�وض"
+fetchFailed = "�شل �ي تحميل بيانات التوقيع"
+finalized = "تم الإنهاء"
+notified = "قيد الانتظار"
+partialNote = "يمكنك الإنهاء مبكرًا بالتواقيع الحالية. سيتم استبعاد المشاركين غير الموقّعين."
+pending = "قيد الانتظار"
+readyToFinalize = "جاهز للإنهاء"
+signed = "موقّع"
+viewed = "تمت المشاهدة"
 chooseJksFile = "اختر مل� JKS"
 chooseP12File = "اختر مل� PKCS12"
 choosePfxFile = "اختر مل� PFX"
@@ -2082,6 +2124,7 @@ title = "توقيع الشهادة"
 invisible = "غير مرئي"
 stepTitle = "مظهر التوقيع"
 visible = "مرئي"
+visibility = "الظهور"
 
 [certSign.appearance.options]
 title = "ت�اصيل التوقيع"
@@ -2188,6 +2231,252 @@ bullet4 = "يمكن استخدام شهادات مخصّصة للتحقق"
 text = "عند التحقق من التواقيع، ت�ظهر الأداة صلاحيتها، ومن وقّع ومتى، وما إذا تم تعديل المستند بعد التوقيع."
 title = "التحقق من التواقيع"
 
+[certSign.collab.finalize]
+button = "إنهاء وتحميل مل� PDF الموقّع"
+early = "إنهاء بالتواقيع الحالية"
+
+[certSign.collab.sessionDetail]
+addButton = "إضا�ة مشاركين"
+addParticipants = "إضا�ة مشاركين"
+addParticipantsError = "تعذّر إضا�ة المشاركين"
+backToList = "العودة إلى الجلسات"
+deleteConfirm = "هل أنت متأكد؟ لا يمكن التراجع عن ذلك."
+deleteError = "�شل حذ� الجلسة"
+deleted = "تم حذ� الجلسة"
+deleteSession = "حذ� الجلسة"
+dueDate = "تاريخ الاستحقاق"
+finalizeError = "تعذّر إنهاء الجلسة"
+loadPdfError = "تعذّر تحميل مل� PDF الموقّع"
+loadSignedPdf = "تحميل مل� PDF الموقّع إلى المل�ات النشطة"
+messageLabel = "رسالة"
+noAdditionalInfo = "لا توجد معلومات إضا�ية"
+owner = "المالك"
+participantRemoved = "تمت إزالة المشارك"
+participants = "المشاركون"
+participantsAdded = "تمت إضا�ة المشاركين بنجاح"
+removeParticipant = "إزالة"
+removeParticipantError = "تعذّر إزالة المشارك"
+selectUsers = "اختر المستخدمين..."
+sessionInfo = "معلومات الجلسة"
+workbenchTitle = "إدارة الجلسة"
+
+[certSign.collab.signRequest]
+addedToFiles = "تمت إضا�ة المستند إلى المل�ات النشطة"
+addSignature = "أض� توقيعك"
+addToFiles = "إضا�ة إلى المل�ات النشطة"
+advancedSettings = "إعدادات متقدمة"
+backToList = "العودة إلى طلبات التوقيع"
+certificateChoice = "اختر شهادة للتوقيع بها"
+changeSignature = "تغيير التوقيع"
+clearSignature = "مسح التوقيع"
+completeAndSign = "إكمال والتوقيع"
+createNewSignature = "إنشاء توقيع جديد"
+declineButton = "ر�ض"
+decline = "ر�ض الطلب"
+deleteSelected = "حذ� التوقيع المحدد"
+drawSignature = "ارسم توقيعك أدناه"
+dueDate = "تاريخ الاستحقاق"
+fileTooLarge = "يجب أن يكون حجم المل� أقل من 5MB"
+fontFamily = "عائلة الخط"
+fontSize = "حجم الخط: {{size}}px"
+fontSizePlaceholder = "الحجم"
+from = "من"
+invalidCertFile = "يرجى اختيار مل� شهادة P12 أو PFX"
+invalidFileType = "يرجى اختيار مل� صورة"
+location = "الموقع (اختياري)"
+locationPlaceholder = "من أين توقّع؟"
+message = "رسالة"
+noCertificate = "يرجى اختيار مل� شهادة"
+noSignatures = "يرجى وضع توقيع واحد على الأقل على مل� PDF"
+p12File = "مل� شهادة P12/PFX"
+password = "كلمة مرور الشهادة"
+passwordPlaceholder = "أدخل كلمة المرور..."
+penColor = "لون القلم"
+penSize = "حجم القلم: {{size}}px"
+placementActive = "انقر على مل� PDF للوضع"
+placeSignatureButton = "وضع التوقيع على مل� PDF"
+reason = "السبب (اختياري)"
+reasonPlaceholder = "لماذا توقّع؟"
+removeImage = "إزالة الصورة"
+removeCertFile = "إزالة المل�"
+savedSignatures = "التواقيع المح�وظة"
+selectFile = "اختر مل� صورة"
+selectSignatureTitle = "اختر أو أنشئ توقيعًا"
+signButton = "توقيع المستند"
+signatureInfo = "يتم ضبط هذه الإعدادات بواسطة مالك المستند"
+signaturePlaced = "تم وضع التوقيع على الص�حة"
+signatureSettings = "إعدادات التوقيع"
+signatureText = "نص التوقيع"
+signatureTextPlaceholder = "أدخل اسمك..."
+signatureTypeLabel = "نوع التوقيع"
+signingTitle = "التوقيع"
+textColor = "لون النص"
+typeSignature = "اكتب اسمك لإنشاء توقيع"
+uploadCert = "شهادة مخصصة"
+uploadCertDesc = "استخدم شهادة P12/PFX الخاصة بك"
+uploadSignature = "ار�ع صورة توقيعك"
+usePersonalCert = "شهادة شخصية"
+usePersonalCertDesc = "ت�نشأ تلقائيًا لحسابك"
+useServerCert = "شهادة المؤسسة"
+useServerCertDesc = "شهادة مؤسسة مشتركة"
+workbenchTitle = "طلب توقيع"
+
+[certSign.collab.signRequest.canvas]
+colorPickerTitle = "اختر لون القلم"
+continue = "متابعة"
+
+[certSign.collab.signRequest.certModal]
+description = "لقد وضعت {{count}} توقيع(ات). اختر شهادتك لإكمال التوقيع."
+sign = "توقيع المستند"
+certValidating = "جار� التحقق من الشهادة..."
+certValidUntil = "الشهادة صالحة حتى {{date}}"
+certInvalid = "الشهادة غير صالحة: {{error}}"
+certInvalidFallback = "شهادة غير صالحة"
+certNetworkError = "تعذّر التحقق من الشهادة"
+title = "تهيئة الشهادة"
+
+[certSign.collab.signRequest.image]
+hint = "حمّل صورة توقيعك بصيغة PNG أو JPG"
+
+[certSign.collab.signRequest.mode]
+move = "نقل التوقيع"
+place = "وضع التوقيع"
+title = "وضع التوقيع أو النقل"
+
+[certSign.collab.signRequest.modeTabs]
+draw = "رسم"
+image = "ر�ع"
+text = "كتابة"
+
+[certSign.collab.signRequest.placeSignature]
+message = "انقر على مل� PDF لوضع توقيعك"
+title = "وضع التوقيع"
+
+[certSign.collab.signRequest.preview]
+imageAlt = "التوقيع المحدد"
+missing = "لا معاينة"
+textFallback = "توقيع"
+
+[certSign.collab.signRequest.saved]
+defaultCanvasLabel = "توقيع مرسوم"
+defaultImageLabel = "توقيع مر�وع"
+defaultLabel = "توقيع"
+defaultTextLabel = "توقيع مكتوب"
+delete = "حذ� التوقيع"
+none = "لا توجد تواقيع مح�وظة"
+
+[certSign.collab.signRequest.signatureType]
+draw = "رسم"
+type = "كتابة"
+upload = "ر�ع"
+
+[certSign.collab.signRequest.steps]
+back = "رجوع"
+cancelPlacement = "إلغاء الوضع"
+certificate = "الشهادة"
+clickMultipleTimes = "انقر على مل� PDF عدة مرات لوضع التواقيع. اسحب أي توقيع لتحريكه أو تغيير حجمه."
+clickToPlace = "انقر على مل� PDF حيث ترغب أن يظهر توقيعك."
+continue = "المتابعة لاختيار الشهادة"
+continueToPlacement = "المتابعة إلى الوضع"
+continueToReview = "المتابعة إلى المراجعة"
+createSignature = "إنشاء توقيع"
+invisible = "غير مرئي"
+location = "الموقع:"
+multipleSignatures = "{{count}} توقيعات سيتم تطبيقها على مل� PDF"
+oneSignature = "سيتم تطبيق توقيع واحد على مل� PDF"
+placeOnPdf = "وضع على مل� PDF"
+reason = "السبب:"
+reviewTitle = "مراجعة قبل التوقيع"
+signaturePlaced = "تم وضع التوقيع على الص�حة {{page}}. يمكنك ضبط الموضع بالنقر مرة أخرى أو المتابعة إلى المراجعة."
+visible = "مرئي"
+visibility = "الظهور:"
+yourSignatures = "تواقيعك ({{count}})"
+
+[certSign.collab.signRequest.text]
+colorLabel = "اللون"
+fontLabel = "الخط"
+fontSizeLabel = "الحجم"
+fontSizePlaceholder = "16"
+label = "نص التوقيع"
+modalHint = "أدخل اسمك، ثم انقر متابعة لوضعه على مل� PDF."
+placeholder = "أدخل اسمك..."
+
+[certSign.collab.participant]
+certValidating = "جار� التحقق من الشهادة..."
+certValid = "✓ الشهادة صالحة"
+certValidUntil = " حتى {{date}}"
+certInvalid = "✗ {{error}}"
+certInvalidFallback = "شهادة غير صالحة"
+certNetworkError = "تعذّر التحقق من الشهادة"
+
+[certSign.collab.addParticipants]
+add = "إضا�ة {{count}} مشارك"
+back = "رجوع"
+configureSignatures = "تهيئة إعدادات التوقيع"
+continue = "المتابعة إلى إعدادات التوقيع"
+reasonHelp = "تحديد سبب توقيع مسبق لهؤلاء المشاركين (اختياري، يمكنهم تغييره عند التوقيع)"
+reasonPlaceholder = "مثال: موا�قة، مراجعة..."
+selectUsers = "اختيار المستخدمين"
+
+[certSign.collab.sessionCreation]
+includeSummaryPage = "تضمين ص�حة ملخص التواقيع"
+includeSummaryPageHelp = "ست�ضا� ص�حة ملخص �ي النهاية تضم جميع بيانات التوقيع الوص�ية. سيتم إخ�اء مربعات توقيع الشهادة الرقمية على الص�حات ال�ردية (لا تتأثر التواقيع اليدوية)."
+
+[certSign.collab.sessionList]
+active = "نشطة"
+finalized = "تم الإنهاء"
+
+[certSign.collab.signatureSettings]
+description = "تهيئة كي�ية ظهور التواقيع لجميع المشاركين"
+title = "مظهر التوقيع"
+
+[certSign.collab.userSelector]
+inviteUsers = "إضا�ة مستخدمين"
+loadError = "�شل �ي تحميل المستخدمين"
+noTeam = "لا يوجد �ريق"
+noUsers = "لم يتم العثور على مستخدمين آخرين."
+placeholder = "اختر المستخدمين..."
+
+[certSign.mobile]
+panelActions = "إجراءات"
+panelDocument = "مستند"
+panelPeople = "أشخاص"
+
+[certSign.sessions]
+deleted = "تم حذ� الجلسة"
+fetchFailed = "�شل تحميل ت�اصيل الجلسة"
+finalized = "تم إنهاء الجلسة"
+loaded = "تم تحميل مل� PDF الموقّع"
+pdfNotReady = "مل� PDF غير جاهز"
+pdfNotReadyDesc = "يجري إنشاء مل� PDF الموقّع. يرجى المحاولة بعد قليل."
+
+[certificateChoice.tooltip]
+header = "أنواع الشهادات"
+
+[certificateChoice.tooltip.organization]
+bullet1 = "تدار بواسطة مسؤولي النظام"
+bullet2 = "مشتركة عبر المستخدمين المخوّلين"
+bullet3 = "تمثل هوية الشركة وليس ال�رد"
+bullet4 = "أ�ضل للاستخدام: المستندات الرسمية، تواقيع ال�ريق"
+description = "شهادة مشتركة تو�رها مؤسستك. ت�ستخدم للت�ويض بالتوقيع على مستوى الشركة."
+title = "شهادة المؤسسة"
+
+[certificateChoice.tooltip.personal]
+bullet1 = "ت�نشأ تلقائيًا عند أول استخدام"
+bullet2 = "مرتبطة بحساب المستخدم الخاص بك"
+bullet3 = "لا يمكن مشاركتها مع مستخدمين آخرين"
+bullet4 = "أ�ضل للاستخدام: المستندات الشخصية، المساءلة ال�ردية"
+description = "شهادة م�نشأة تلقائيًا �ريدة لحساب المستخدم الخاص بك. مناسبة للتواقيع ال�ردية."
+title = "شهادة شخصية"
+
+[certificateChoice.tooltip.upload]
+bullet1 = "يتطلب مل� P12/PFX وكلمة مرور"
+bullet2 = "يمكن إصدارها من جهات إصدار شهادات خارجية"
+bullet3 = "مستوى ثقة أعلى للمستندات القانونية"
+bullet4 = "أ�ضل للاستخدام: العقود الملزمة قانونيًا، التحقق الخارجي"
+description = "استخدم مل� شهادة PKCS#12 الخاص بك. يو�ّر تحكمًا كاملاً بخصائص الشهادة."
+title = "ر�ع مل� P12 مخصص"
+
 [changeCreds]
 changePassword = "أنت تستخدم بيانات تسجيل الدخول الا�تراضية. يرجى إدخال كلمة مرور جديدة"
 changeUsername = "حدّث اسم المستخدم. سيتم تسجيل خروجك بعد التحديث."
@@ -3242,6 +3531,46 @@ totalSelected = "الإجمالي المحدد"
 unsupported = "غير مدعوم"
 unzip = "�ك الضغط"
 uploadError = "�شل تحميل بعض المل�ات."
+copyCreated = "تم ح�ظ نسخة على هذا الجهاز."
+copyFailed = "تعذّر إنشاء نسخة."
+leaveShare = "إزالة من قائمتي"
+leaveShareFailed = "تعذّر إزالة المل� المشترك."
+leaveShareSuccess = "تمت الإزالة من قائمتك المشتركة."
+removeBoth = "إزالة من كليهما"
+removeFilePrompt = "هذا المل� مح�وظ على هذا الجهاز وعلى خادمك. من أين ترغب �ي إزالته؟"
+removeFileTitle = "إزالة المل�"
+removeLocalOnly = "هذا الجهاز �قط"
+removeServerFailed = "تعذّر إزالة المل� من الخادم."
+removeServerOnly = "الخادم �قط"
+removeServerOnlyPrompt = "هذا المل� مخزّن �قط على خادمك. هل ترغب �ي إزالته من الخادم؟"
+removeServerSuccess = "تمت الإزالة من الخادم."
+removeSharedPrompt = "هذا المل� مشترك معك. يمكنك إزالته من هذا الجهاز أو من قائمتك المشتركة."
+removeSharedServerOnlyBlockedPrompt = "هذا المل� مشترك معك ومخزّن �قط على الخادم."
+removeSharedServerOnlyPrompt = "هذا المل� مشترك معك ومخزّن �قط على الخادم. هل تود إزالته من قائمتك؟"
+changesNotUploaded = "لم ت�ر�ع التغييرات"
+cloudFile = "مل� سحابي"
+filterAll = "الكل"
+filterLocal = "محلي"
+filterSharedByMe = "مشترك بواسطتي"
+filterSharedWithMe = "مشترك معي"
+lastSynced = "آخر مزامنة"
+localOnly = "محلي �قط"
+makeCopy = "إنشاء نسخة"
+owner = "المالك"
+ownerUnknown = "غير معرو�"
+share = "مشاركة"
+shareSelected = "مشاركة المحدد"
+sharedByYou = "مشترك بواسطتك"
+sharedEditNoticeBody = "ليس لديك حقوق تحرير لنسخة الخادم من هذا المل�. سيتم ح�ظ أي تعديلات تجريها كنسخة محلية."
+sharedEditNoticeConfirm = "حسنًا"
+sharedEditNoticeTitle = "نسخة خادم للعرض �قط"
+sharedWithYou = "مشترك معك"
+sharing = "مشاركة"
+storageState = "التخزين"
+synced = "تمت المزامنة"
+updateOnServer = "تحديث على الخادم"
+uploadSelected = "ر�ع المحدد"
+uploadToServer = "ر�ع إلى الخادم"
 
 [files]
 addFiles = "إضا�ة مل�ات"
@@ -3367,6 +3696,77 @@ title = "حول تسطيح مل�ات PDF"
 discord = "Discord"
 issues = "GitHub"
 
+[groupSigning.tooltip]
+header = "نبذة عن التوقيع الجماعي"
+
+[groupSigning.tooltip.finalization]
+bullet1 = "ت�طبَّق جميع التواقيع حسب ترتيب المشاركين الذي حددته"
+bullet2 = "يمكنك الإنهاء بتواقيع جزئية عند الحاجة"
+bullet3 = "بعد الإنهاء، لا يمكن تعديل الجلسة"
+description = "عند توقيع جميع المشاركين (أو إذا اخترت الإنهاء مبكرًا)، يمكنك إنشاء مل� PDF النهائي الموقّع."
+title = "عملية الإنهاء"
+
+[groupSigning.tooltip.roles]
+bullet1 = "المالك (أنت): ينشئ الجلسة، يضبط ا�تراضات التوقيع، ينهي المستند"
+bullet2 = "المشاركون: ينشئون توقيعهم، يختارون الشهادة، يضعونها على مل� PDF"
+bullet3 = "لا يمكن للمشاركين تعديل إعدادات الظهور أو السبب أو الموقع للتوقيع"
+description = "أنت تتحكم �ي إعدادات مظهر التوقيع لجميع المشاركين."
+title = "أدوار المشاركين"
+
+[groupSigning.tooltip.sequential]
+bullet1 = "يجب أن يوقّع المشارك الأول قبل أن يتمكن الثاني من الوصول إلى المستند"
+bullet2 = "يضمن ترتيب توقيع مناسبًا للامتثال القانوني"
+bullet3 = "يمكنك إعادة ترتيب المشاركين بسحبهم �ي القائمة"
+description = "يوقّع المشاركون المستندات بالترتيب الذي تحدده. يتلقى كل موقّع إشعارًا عندما يحين دوره."
+title = "التوقيع المتسلسل"
+
+[groupSigning.steps]
+back = "رجوع"
+completed = "مكتمل"
+current = "حالي"
+stepLabel = "الخطوة {{number}}"
+
+[groupSigning.steps.configureDefaults]
+continue = "المتابعة إلى المراجعة"
+invisible = "ستكون التواقيع غير مرئية (بيانات وص�ية �قط)"
+locationLabel = "الموقع:"
+preview = "معاينة"
+reasonLabel = "السبب:"
+title = "تهيئة إعدادات التوقيع"
+visible = "ستكون التواقيع مرئية على الص�حة {{page}}"
+
+[groupSigning.steps.review]
+document = "المستند"
+dueDate = "تاريخ الاستحقاق (اختياري)"
+dueDatePlaceholder = "اختر تاريخ الاستحقاق..."
+invisible = "غير مرئي (بيانات وص�ية �قط)"
+location = "الموقع:"
+logo = "الشعار:"
+logoHidden = "بدون شعار"
+logoShown = "يظهر شعار Stirling PDF"
+participants = "المشاركون"
+reason = "السبب:"
+send = "إرسال طلبات التوقيع"
+signatureSettings = "إعدادات التوقيع"
+title = "مراجعة ت�اصيل الجلسة"
+titleShort = "مراجعة وإرسال"
+visibility = "الظهور:"
+visible = "مرئي على الص�حة {{page}}"
+participantCount = "{{count}} مشارك سيوقّعون بالترتيب"
+
+[groupSigning.steps.selectDocument]
+continue = "المتابعة لاختيار المشاركين"
+noFile = "يرجى اختيار مل� PDF واحد من مل�اتك النشطة لإنشاء جلسة توقيع."
+selectedFile = "المستند المحدد"
+title = "اختيار مستند"
+
+[groupSigning.steps.selectParticipants]
+continue = "المتابعة إلى إعدادات التوقيع"
+count = "تم اختيار {{count}} مشارك"
+label = "اختر المشاركين"
+placeholder = "اختر المشاركين للتوقيع..."
+title = "اختيار المشاركين"
+
 [getPdfInfo]
 downloadJson = "تحميل JSON"
 downloads = "التنزيلات"
@@ -4460,7 +4860,10 @@ zoomOut = "تصغير"
 
 [viewer]
 cannotPreviewFile = "لا يمكن معاينة المل�"
+disableColorFilter = "تعطيل مرشح الألوان"
 dualPageView = "عرض ص�حتين"
+enableDarkFilter = "تمكين المرشح الداكن"
+enableSepiaFilter = "تمكين مرشح سيبيا"
 firstPage = "الص�حة الأولى"
 lastPage = "الص�حة الأخيرة"
 nextPage = "الص�حة التالية"
@@ -4470,6 +4873,22 @@ singlePageView = "عرض ص�حة واحدة"
 unknownFile = "مل� غير معرو�"
 zoomIn = "تكبير"
 zoomOut = "تصغير"
+resetZoom = "إعادة ضبط التكبير"
+
+[viewer.nonPdf]
+fileTypeBadge = "مل� {{type}}"
+convertToPdf = "التحويل إلى PDF"
+loading = "جار� التحميل..."
+emptyFile = "مل� �ارغ"
+csvStats = "{{rows}} ص�و� · {{columns}} أعمدة · {{size}}"
+sortedBy = "مرتّب حسب: {{column}}"
+columnDefault = "العمود {{index}}"
+htmlPreviewWarning = "معاينة HTML — قد لا يتم تحميل الموارد الخارجية · {{size}}"
+htmlPreview = "معاينة HTML"
+invalidJson = "JSON غير صالح — عرض المحتوى الخام"
+textStats = "{{lines}} أسطر · {{size}}"
+lineNumbers = "أرقام الأسطر"
+renderMarkdown = "عرض Markdown"
 
 [viewer.attachments]
 title = "المر�قات"
@@ -4531,6 +4950,7 @@ toggleAttachments = "إظهار/إخ�اء المر�قات"
 toggleTheme = "تبديل الس�مة"
 language = "اللغة"
 toggleAnnotations = "تبديل ظهور التعليقات التوضيحية"
+toggleLayers = "تبديل الطبقات"
 search = "بحث �ي PDF"
 panMode = "وضع السحب"
 applyRedactionsFirst = "طبّق التنقيحات أولًا"
@@ -5407,20 +5827,72 @@ title = "طباعة مل�"
 2 = "ادخل اسم الطابعة"
 
 [quickAccess]
+access = "وصول"
+accessAddPerson = "إضا�ة شخص آخر"
+accessBack = "رجوع"
+accessCopyLink = "نسخ الرابط"
+accessEmail = "عنوان البريد الإلكتروني"
+accessEmailPlaceholder = "name@company.com"
+accessFileLabel = "مل�"
+accessGeneral = "وصول عام"
+accessInviteTitle = "دعوة أشخاص"
+accessOwner = "المالك"
+accessPanel = "وصول المستند"
+accessPeople = "الأشخاص الذين لديهم وصول"
+accessRemove = "إزالة"
+accessRestricted = "مقيّد"
+accessRestrictedHint = "لا يمكن ال�تح إلا لمن لديهم وصول"
+accessRole = "الدور"
+accessRoleCommenter = "معلّق"
+accessRoleEditor = "محرر"
+accessRoleViewer = "عارض"
+accessSelectedFile = "المل� المحدد"
+accessSendInvite = "إرسال الدعوة"
+accessTitle = "وصول المستند"
+accessYou = "أنت"
 account = "الحساب"
+activeSessions = "جلسات نشطة"
+activeTab = "نشطة"
 activity = "النشاط"
 adminSettings = "إعدادات المشر�"
+allSessions = "كل الجلسات"
 allTools = "كل الأدوات"
 automate = "أتمتة"
+back = "رجوع"
+certSign = "توقيع بالشهادة"
+completedSessions = "جلسات مكتملة"
+completedTab = "مكتملة"
 config = "الإعداد"
+createNew = "إنشاء طلب جديد"
+createSession = "إنشاء طلب توقيع"
+dueDate = "تاريخ الاستحقاق (اختياري)"
 files = "المل�ات"
 help = "مساعدة"
+noActiveSessions = "لا توجد طلبات توقيع معلّقة أو جلسات نشطة"
+noCompletedSessions = "لا توجد جلسات مكتملة"
+noFile = "لم يتم اختيار مل�"
 read = "قراءة"
 reader = "القارئ"
+refresh = "تحديث"
+requestSignatures = "طلب تواقيع"
+selectSingleFileToRequest = "اختر مل� PDF واحدًا لطلب التواقيع"
+selectedFile = "المل� المحدد"
+selectUsers = "اختر مستخدمين للتوقيع"
+selectUsersPlaceholder = "اختر المشاركين..."
+sendingRequest = "جار� الإرسال..."
 settings = "إعدادات"
 showMeAround = "أرني جولة"
 sign = "توقيع"
+signatureRequests = "طلبات التوقيع"
+signYourself = "وقّع بن�سك"
+newRequest = "طلب جديد"
 tours = "جولات"
+wetSign = "إضا�ة توقيع"
+filterMine = "الخاصة بي"
+filterOverdue = "متأخرة"
+filterSigned = "موقّع"
+filterDeclined = "مر�وض"
+searchDocuments = "ابحث �ي المستندات…"
 
 [quickAccess.helpMenu]
 adminTour = "جولة المسؤول"
@@ -6050,11 +6522,75 @@ toolNotAvailableLocally = "خادم Stirling-PDF الخاص بك غير متصل
 expired = "لقد انتهت جلستك. يرجى تحديث الص�حة والمحاولة مرة أخرى"
 refreshPage = "تحديث الص�حة"
 
+[sessionManagement.tooltip]
+header = "إدارة جلسات التوقيع"
+
+[sessionManagement.tooltip.addParticipants]
+bullet1 = "ي�ضا� المشاركون الجدد إلى نهاية ترتيب التوقيع"
+bullet2 = "لا يمكن إضا�ة مشاركين بعد إنهاء الجلسة"
+bullet3 = "يتلقى كل مشارك إشعارًا عندما يحين دوره"
+description = "يمكنك إضا�ة المزيد من المشاركين إلى جلسة نشطة �ي أي وقت قبل الإنهاء."
+title = "إضا�ة مشاركين"
+
+[sessionManagement.tooltip.finalization]
+bullet1 = "<b>إنهاء كامل</b>: وقّع جميع المشاركين"
+bullet2 = "<b>إنهاء جزئي</b>: لم يوقّع بعض المشاركين بعد"
+bullet3 = "سيتم استبعاد المشاركين غير الموقّعين من المستند النهائي"
+bullet4 = "بعد الإنهاء، يمكنك تحميل مل� PDF الموقّع إلى المل�ات النشطة"
+description = "يجمع الإنهاء جميع التواقيع �ي مل� PDF واحد موقّع. لا يمكن التراجع عن هذا الإجراء."
+title = "إنهاء الجلسة"
+
+[sessionManagement.tooltip.participantRemoval]
+bullet1 = "لا يمكن إزالة المشاركين الذين قاموا بالتوقيع بال�عل"
+bullet2 = "لن يتلقى المشاركون الذين تمت إزالتهم إشعارات بعد ذلك"
+bullet3 = "ي�عدل ترتيب التوقيع تلقائيًا"
+description = "يمكن إزالة المشاركين من الجلسات قبل أن يوقّعوا."
+title = "إزالة المشاركين"
+
+[sessionManagement.tooltip.signatureOrder]
+bullet1 = "ي�طبَّق كل توقيع بالتسلسل على مل� PDF"
+bullet2 = "يمكن للموقّعين اللاحقين رؤية التواقيع السابقة"
+bullet3 = "أمر حاسم لتد�قات الموا�قات والسلاسل القانونية للحيازة"
+description = "الترتيب الذي تحدده عند إنشاء الجلسة يحدد من يوقّع أولًا."
+title = "ترتيب التوقيع"
+
+[signatureSettings.tooltip]
+header = "إعدادات مظهر التوقيع"
+
+[signatureSettings.tooltip.location]
+bullet1 = "أمثلة: \"New York, USA\"، \"London Office\"، \"Remote\""
+bullet2 = "ليست ن�س موضع الص�حة"
+bullet3 = "قد يكون مطلوبًا �ي بعض الولايات القضائية القانونية"
+description = "موقع جغرا�ي اختياري حيث تم تطبيق التوقيع. ي�خزّن �ي بيانات الشهادة الوص�ية."
+title = "موقع التوقيع"
+
+[signatureSettings.tooltip.logo]
+bullet1 = "ي�عرض بجانب التوقيع والنص"
+bullet2 = "يدعم صيغ PNG وJPG"
+bullet3 = "يعزّز المظهر الاحترا�ي"
+description = "أض� شعار الشركة إلى التواقيع المرئية للعلامة التجارية والمصداقية."
+title = "شعار الشركة"
+
+[signatureSettings.tooltip.reason]
+bullet1 = "أمثلة: \"Approval\"، \"Contract Agreement\"، \"Review Complete\""
+bullet2 = "يظهر �ي خصائص توقيع PDF"
+bullet3 = "م�يد لسجلات التدقيق والامتثال"
+description = "نص اختياري يشرح سبب توقيع المستند. ي�خزّن �ي بيانات الشهادة الوص�ية."
+title = "سبب التوقيع"
+
+[signatureSettings.tooltip.visibility]
+bullet1 = "<b>مرئي</b>: يظهر التوقيع على مل� PDF بمظهر مخصص"
+bullet2 = "<b>غير مرئي</b>: ت�ضمَّن الشهادة دون علامة مرئية"
+bullet3 = "لا تزال التواقيع غير المرئية تو�ّر تحققًا تش�يريًا"
+description = "يتحكم �يما إذا كان التوقيع مرئيًا على المستند أو م�ضمّنًا بشكل غير مرئي."
+title = "ظهور التوقيع"
+
 [settings.configuration]
 advanced = "متقدم"
 database = "قاعدة البيانات"
 endpoints = "نقاط النهاية"
 features = "الميزات"
+storageSharing = "تخزين المل�ات والمشاركة"
 systemSettings = "إعدادات النظام"
 title = "التهيئة"
 
@@ -6332,10 +6868,13 @@ title = "سجّل الدخول إلى Stirling"
 [setup.selfhosted]
 link = "أو الاتصال بحساب م�ستضا� ذاتيًا"
 subtitle = "أدخل بيانات اعتماد الخادم"
+changeServerLocked = "لقد قيّدت مؤسستك هذا التطبيق بخادم محدد"
 switchToLocal = "استخدام الأدوات المحلية بدلًا من ذلك"
 title = "سجّل الدخول إلى الخادم"
 
 [setup.selfhosted.unreachable]
+changeServer = "الاتصال بخادم آخر"
+changeServerLocked = "لقد قيّدت مؤسستك هذا التطبيق بخادم محدد"
 continueOffline = "استخدام الأدوات المحلية بدلًا من ذلك"
 message = "تعذّر الوصول إلى {{url}}. تحقّق من أن الخادم يعمل وقابل للوصول."
 retry = "إعادة المحاولة"
@@ -6529,6 +7068,15 @@ saved = "مح�وظ"
 text = "نص"
 title = "نوع التوقيع"
 
+[signRequest]
+declined = "تم ر�ض طلب التوقيع"
+fetchFailed = "تعذّر تحميل طلب التوقيع"
+signed = "تم توقيع المستند بنجاح"
+
+[signSession]
+createFailed = "تعذّر إنشاء طلب التوقيع"
+created = "تم إرسال طلب التوقيع"
+
 [signup]
 accountCreatedSuccessfully = "تم إنشاء الحساب بنجاح! يمكنك الآن تسجيل الدخول."
 alreadyHaveAccount = "هل لديك حساب بال�عل؟ سجّل الدخول"
@@ -6807,6 +7355,106 @@ title = "تجزئة المستند حسب ال�صول"
 [splitPdfByChapters]
 tags = "تجزئة، �صول، علامات تبويب، تنظيم"
 
+[storageShare]
+accessed = "تم الوصول"
+accessDenied = "ليس لديك حق الوصول إلى هذا المل� المشترك. اطلب من المالك مشاركته معك."
+accessFailed = "تعذّر تحميل النشاط."
+accessDeniedBody = "ليس لديك حق الوصول إلى هذا المل�. اطلب من المالك مشاركته معك."
+accessDeniedTitle = "لا وصول"
+accessLimitedCommenter = "وصول التعليق قادم قريبًا. اطلب من المالك صلاحية المحرر إذا كنت بحاجة إلى التنزيل."
+accessLimitedTitle = "وصول محدود"
+accessLimitedViewer = "هذا الرابط للعرض �قط. اطلب من المالك صلاحية المحرر إذا كنت بحاجة إلى التنزيل."
+createdAt = "تم الإنشاء"
+download = "تنزيل"
+downloadFailed = "تعذّر تنزيل هذا المل�."
+expiredBody = "رابط المشاركة هذا غير صالح أو انتهت صلاحيته."
+expiredTitle = "انتهت صلاحية الرابط"
+goToLogin = "الانتقال إلى تسجيل الدخول"
+loadFailed = "تعذّر �تح المل� المشترك."
+loading = "جار� تحميل رابط المشاركة..."
+loginPrompt = "سجّل الدخول للوصول إلى هذا المل� المشترك."
+loginRequired = "مطلوب تسجيل الدخول"
+openInApp = "�تح �ي Stirling PDF"
+ownerLabel = "المالك"
+ownerUnknown = "غير معرو�"
+requiresLogin = "هذا المل� المشترك يتطلب تسجيل الدخول."
+roleCommenter = "معلّق"
+roleEditor = "محرر"
+roleViewer = "عارض"
+shareHeading = "مل� مشترك"
+titleDefault = "مل� مشترك"
+tryAgain = "يرجى المحاولة لاحقًا."
+addUser = "إضا�ة"
+commenterHint = "التعليق قادم قريبًا."
+copied = "تم نسخ الرابط إلى الحا�ظة"
+copy = "نسخ"
+copyFailed = "�شل النسخ"
+description = "أنشئ رابط مشاركة لهذا المل�. يمكن للمستخدمين المسجّلين الدخول والذين لديهم الرابط الوصول إليه."
+downloadsCount = "عمليات التنزيل: {{count}}"
+emailWarningBody = "يبدو هذا عنوان بريد إلكتروني. إذا لم يكن هذا الشخص مستخدم Stirling PDF بال�عل، �لن يتمكن من الوصول إلى المل�."
+emailWarningConfirm = "المشاركة على أي حال"
+emailWarningTitle = "عنوان بريد إلكتروني"
+errorTitle = "�شلت المشاركة"
+failure = "تعذّر إنشاء رابط مشاركة. يرجى المحاولة مرة أخرى."
+fileLabel = "المل�"
+generate = "إنشاء رابط"
+generated = "تم إنشاء رابط المشاركة"
+hideActivity = "إخ�اء النشاط"
+invalidUsername = "أدخل اسم مستخدم أو عنوان بريد إلكتروني صالحًا."
+lastAccessed = "آخر وصول"
+linkAccessTitle = "وصول رابط المشاركة"
+linkLabel = "رابط المشاركة"
+linksDisabled = "روابط المشاركة معطّلة."
+linksDisabledBody = "روابط المشاركة معطّلة بواسطة إعدادات الخادم."
+manage = "إدارة المشاركة"
+manageDescription = "إنشاء وإدارة روابط لمشاركة هذا المل�."
+manageLoadFailed = "تعذّر تحميل روابط المشاركة."
+manageTitle = "إدارة المشاركة"
+noActivity = "لا يوجد نشاط بعد."
+noLinks = "لا توجد روابط مشاركة نشطة بعد."
+noSharedUsers = "لا يملك أي مستخدم وصولًا بعد."
+removeLink = "إزالة الرابط"
+removeUser = "إزالة"
+revokeFailed = "تعذّر إزالة رابط المشاركة."
+revoked = "تمت إزالة رابط المشاركة"
+roleLabel = "الدور"
+sharingDisabled = "المشاركة معطّلة."
+sharingDisabledBody = "تم تعطيل المشاركة بواسطة إعدادات الخادم."
+sharedUsersTitle = "المستخدمون الذين تمت المشاركة معهم"
+title = "مشاركة المل�"
+unknownUser = "مستخدم غير معرو�"
+userAddFailed = "يتعذر المشاركة مع هذا المستخدم."
+userAdded = "تمت إضا�ة المستخدم إلى قائمة المشاركة."
+usernameLabel = "اسم المستخدم أو البريد الإلكتروني"
+usernamePlaceholder = "أدخل اسم مستخدم أو بريدًا إلكترونيًا"
+userRemoveFailed = "يتعذر إزالة هذا المستخدم."
+userRemoved = "تمت إزالة المستخدم من قائمة المشاركة."
+viewActivity = "عرض النشاط"
+viewed = "تمت المشاهدة"
+viewsCount = "المشاهدات: {{count}}"
+downloaded = "تم التنزيل"
+bulkDescription = "أنشئ رابطًا واحدًا لمشاركة جميع المل�ات المحددة مع المستخدمين المسجّلين الدخول."
+bulkTitle = "مشاركة المل�ات المحددة"
+copyLink = "نسخ رابط المشاركة"
+fileCount = "تم تحديد {{count}} مل�ًا"
+ownerOnly = "يمكن للمالك �قط إدارة المشاركة."
+selectSingleFile = "حدّد مل�ًا واحدًا لإدارة المشاركة."
+
+[storageUpload]
+description = "يقوم هذا بتحميل المل� الحالي إلى تخزين الخادم لاستخدامك الخاص."
+errorTitle = "�شل التحميل"
+failure = "�شل التحميل. يرجى التحقق من تسجيل الدخول وإعدادات التخزين."
+fileLabel = "المل�"
+hint = "تتحكم إعدادات الخادم �ي الروابط العامة وأوضاع الوصول."
+success = "تم التحميل إلى الخادم"
+title = "التحميل إلى الخادم"
+updateButton = "تحديث على الخادم"
+uploadButton = "تحميل إلى الخادم"
+bulkDescription = "يقوم هذا بتحميل المل�ات المحددة إلى تخزين الخادم."
+bulkTitle = "تحميل المل�ات المحددة"
+fileCount = "تم تحديد {{count}} مل�ًا"
+more = " +{{count}} أخرى"
+
 [storage]
 approximateSize = "الحجم التقريبي"
 fileTooLarge = "المل� كبير جدًا. الحد الأقصى للحجم لكل مل� هو"
@@ -7153,6 +7801,30 @@ title = "عرض/تحرير PDF"
 [warning]
 tooltipTitle = "تحذير"
 
+[wetSignature.tooltip]
+header = "طرق إنشاء التوقيع"
+
+[wetSignature.tooltip.draw]
+bullet1 = "تخصيص لون القلم وسماكته"
+bullet2 = "امسح وأعد الرسم حتى ترضى"
+bullet3 = "يعمل على أجهزة اللمس (الأجهزة اللوحية، الهوات�)"
+description = "أنشئ توقيعًا بخط اليد باستخدام الماوس أو شاشة اللمس. الأ�ضل للتوقيعات الشخصية الأصيلة."
+title = "رسم التوقيع"
+
+[wetSignature.tooltip.type]
+bullet1 = "اختر من عدة خطوط"
+bullet2 = "خصص حجم النص ولونه"
+bullet3 = "مثالي للتوقيعات الموحّدة"
+description = "أنشئ توقيعًا من نص مكتوب. سريع ومتّسق، ومناسب للمستندات التجارية."
+title = "كتابة التوقيع"
+
+[wetSignature.tooltip.upload]
+bullet1 = "يدعم PNG وJPG وغيرها من صيغ الصور"
+bullet2 = "ي�وصى بالخل�يات الش�ا�ة للحصول على أ�ضل النتائج"
+bullet3 = "سيتم تغيير حجم الصورة لتناسب مساحة التوقيع"
+description = "حمّل صورة توقيع م�نشأة مسبقًا. مثالي إذا كان لديك توقيع ممسوح ضوئيًا أو شعار شركة."
+title = "تحميل صورة التوقيع"
+
 [watermark]
 completed = "تمت إضا�ة العلامة المائية"
 desc = "أض� علامات مائية نصية أو صورية إلى مل�ات PDF"
@@ -7333,6 +8005,7 @@ activeSession = "جلسة نشطة"
 addMembers = "إضا�ة أعضاء"
 admin = "مسؤول"
 confirmDelete = "هل أنت متأكد أنك تريد حذ� هذا المستخدم؟ لا يمكن التراجع عن هذا الإجراء."
+confirmUnlock = "هل أنت متأكد من أنك تريد �تح ق�ل حساب هذا المستخدم؟"
 deleteUser = "حذ� المستخدم"
 deleteUserError = "�شل حذ� المستخدم"
 deleteUserSuccess = "تم حذ� المستخدم بنجاح"
@@ -7341,6 +8014,8 @@ disable = "تعطيل"
 disabled = "معطّل"
 editRole = "تحرير الدور"
 enable = "تمكين"
+locked = "مق�ل"
+lockedBadge = "مق�ل"
 loading = "جار� تحميل الأشخاص..."
 loginRequired = "�عّل وضع تسجيل الدخول أولاً"
 member = "عضو"
@@ -7350,6 +8025,9 @@ searchMembers = "ابحث عن الأعضاء..."
 status = "الحالة"
 team = "ال�ريق"
 title = "الأشخاص"
+unlockAccount = "�تح ق�ل الحساب"
+unlockUserError = "�شل �تح ق�ل حساب المستخدم"
+unlockUserSuccess = "تم �تح ق�ل حساب المستخدم بنجاح"
 user = "مستخدم"
 
 [workspace.people.actions]
diff --git a/frontend/public/locales/az-AZ/translation.toml b/frontend/public/locales/az-AZ/translation.toml
index 3e33ecb6be..67972e61a9 100644
--- a/frontend/public/locales/az-AZ/translation.toml
+++ b/frontend/public/locales/az-AZ/translation.toml
@@ -8,6 +8,7 @@ black = "Qara"
 blue = "Mavi"
 bored = "Gözləməkdən Sıxıldınız?"
 cancel = "Ləğv et"
+confirm = "Təsdiqlə"
 changedCredsMessage = "Etibarnamələr dəyişdirildi!"
 chooseFile = "Fayl seç"
 close = "BaÄŸla"
@@ -146,6 +147,7 @@ insufficientCredits = "Kreditlər kifayət deyil. Tələb olunur: {{requiredCred
 loadingCredits = "Kreditlər yoxlanılır..."
 loadingProStatus = "Abunəlik statusu yoxlanılır..."
 noticeTopUpOrPlan = "Kreditlər kifayət deyil, xahiş edirik balansı artırın və ya planı yüksəldin"
+accessInvite = "Dəvət et"
 
 [account]
 accountSettings = "Hesab Parametrləri"
@@ -1427,6 +1429,34 @@ title = "Emal"
 description = "Xətanı bildirməzdən əvvəl emal işini gözləmək üçün maksimum vaxt."
 label = "Emal vaxt limiti (saniyÉ™)"
 
+[admin.settings.storage]
+description = "Server yaddaşını və paylaşma seçimlərini idarə edin."
+title = "Fayl Saxlama vÉ™ PaylaÅŸma"
+
+[admin.settings.storage.enabled]
+description = "İstifadəçilərə faylları serverdə saxlamağa icazə verin."
+label = "Serverdə Fayl Saxlamanı Aktiv et"
+
+[admin.settings.storage.sharing.email]
+description = "E-poçt ünvanları ilə paylaşmağa icazə verin."
+label = "E-poçt ilə Paylaşmanı Aktiv et"
+mailLink = "Poçt Tənzimləmələrini Qur"
+mailNote = "Poçt konfiqurasiyası tələb olunur. "
+
+[admin.settings.storage.sharing.enabled]
+description = "İstifadəçilərə saxlanan faylları paylaşmağa icazə verin."
+label = "Paylaşmanı Aktiv et"
+
+[admin.settings.storage.sharing.links]
+description = "Giriş tələb edən linklərlə paylaşmağa icazə verin."
+frontendUrlLink = "Sistem Tənzimləmələrində qur"
+frontendUrlNote = "Frontend URL tələb olunur. "
+label = "Paylaşma Linklərini Aktiv et"
+
+[admin.settings.storage.signing.enabled]
+description = "İstifadəçilərə çox iştirakçılı sənəd imzalama sessiyaları yaratmağa icazə verin. Server fayl saxlaması aktiv olmalıdır."
+label = "Qrup İmzalanmasını Aktiv et (Alfa)"
+
 [admin.settings.unsavedChanges]
 cancel = "Redaktəyə davam et"
 discard = "Dəyişiklikləri ləğv et"
@@ -2059,7 +2089,19 @@ numbers = "Nömrələr/aralıqlar: 5, 10-20"
 progressions = "Proqressiyalar: 3n, 4n+1"
 
 [certSign]
+allSigned = "Bütün iştirakçılar imzalayıb. Yekunlaşdırmağa hazırdır."
+awaitingSignatures = "İmzalar gözlənir"
+signatureProgress = "{{signedCount}}/{{totalCount}} imza"
 chooseCertificate = "Sertifikat faylını seçin"
+declined = "Ä°mtina edildi"
+fetchFailed = "İmzalama məlumatlarını yükləmək mümkün olmadı"
+finalized = "Yekunlaşdırılıb"
+notified = "Gözləmədə"
+partialNote = "Mövcud imzalarla erkən yekunlaşdıra bilərsiniz. İmzalamayan iştirakçılar çıxarılacaq."
+pending = "Gözləmədə"
+readyToFinalize = "Yekunlaşdırmağa hazır"
+signed = "İmzalanıb"
+viewed = "Baxılıb"
 chooseJksFile = "JKS faylını seçin"
 chooseP12File = "PKCS12 faylını seçin"
 choosePfxFile = "PFX faylını seçin"
@@ -2082,6 +2124,7 @@ title = "Sertifikatla Ä°mzala"
 invisible = "Görünməz"
 stepTitle = "İmza görünüşü"
 visible = "Görünən"
+visibility = "Görünürlük"
 
 [certSign.appearance.options]
 title = "İmza detalları"
@@ -2188,6 +2231,252 @@ bullet4 = "Doğrulama üçün xüsusi sertifikatlardan istifadə edə bilər"
 text = "İmzaları yoxladıqda alət onların etibarlı olub-olmadığını, sənədi kimin və nə vaxt imzaladığını və imzadan sonra sənədin dəyişdirilib-dəyişdirilmədiyini bildirir."
 title = "İmzaların yoxlanması"
 
+[certSign.collab.finalize]
+button = "Yekunlaşdır və İmzalanmış PDF-i Yüklə"
+early = "Mövcud imzalarla yekunlaşdır"
+
+[certSign.collab.sessionDetail]
+addButton = "İştirakçı əlavə et"
+addParticipants = "İştirakçı əlavə et"
+addParticipantsError = "İştirakçıları əlavə etmək mümkün olmadı"
+backToList = "Sessiyalara qayıt"
+deleteConfirm = "�minsiniz? Bu əməliyyatı geri qaytarmaq olmaz."
+deleteError = "Sessiyanı silmək mümkün olmadı"
+deleted = "Sessiya silindi"
+deleteSession = "Sessiyanı sil"
+dueDate = "Son tarix"
+finalizeError = "Sessiyanı yekunlaşdırmaq mümkün olmadı"
+loadPdfError = "İmzalanmış PDF-i yükləmək mümkün olmadı"
+loadSignedPdf = "İmzalanmış PDF-i Aktiv Fayllara Yüklə"
+messageLabel = "Mesaj"
+noAdditionalInfo = "�lavə məlumat yoxdur"
+owner = "Sahib"
+participantRemoved = "İştirakçı silindi"
+participants = "İştirakçılar"
+participantsAdded = "İştirakçılar uğurla əlavə olundu"
+removeParticipant = "Sil"
+removeParticipantError = "İştirakçını silmək mümkün olmadı"
+selectUsers = "İstifadəçiləri seçin..."
+sessionInfo = "Sessiya məlumatı"
+workbenchTitle = "Sessiya İdarəetməsi"
+
+[certSign.collab.signRequest]
+addedToFiles = "Sənəd aktiv fayllara əlavə olundu"
+addSignature = "İmzanızı əlavə edin"
+addToFiles = "Aktiv Fayllara �lavə et"
+advancedSettings = "�traflı tənzimləmələr"
+backToList = "İmza Sorğularına qayıt"
+certificateChoice = "İmzalamaq üçün sertifikat seçin"
+changeSignature = "İmzanı dəyiş"
+clearSignature = "İmzanı sil"
+completeAndSign = "Tamamla vÉ™ Ä°mzala"
+createNewSignature = "Yeni Ä°mza Yarat"
+declineButton = "Ä°mtina et"
+decline = "SorÄŸudan imtina et"
+deleteSelected = "Seçilmiş imzanı sil"
+drawSignature = "Aşağıda imzanızı çəkin"
+dueDate = "Son tarix"
+fileTooLarge = "Fayl ölçüsü 5MB-dan az olmalıdır"
+fontFamily = "Şrift ailəsi"
+fontSize = "Şrift ölçüsü: {{size}}px"
+fontSizePlaceholder = "Ölçü"
+from = "Kimdən"
+invalidCertFile = "Zəhmət olmasa P12 və ya PFX sertifikat faylı seçin"
+invalidFileType = "Zəhmət olmasa şəkil faylı seçin"
+location = "Məkan (Seçim üzrə)"
+locationPlaceholder = "Haradan imzalayırsınız?"
+message = "Mesaj"
+noCertificate = "Zəhmət olmasa sertifikat faylı seçin"
+noSignatures = "Zəhmət olmasa PDF üzərinə ən azı bir imza yerləşdirin"
+p12File = "P12/PFX Sertifikat Faylı"
+password = "Sertifikat şifrəsi"
+passwordPlaceholder = "Şifrəni daxil edin..."
+penColor = "Qələm rəngi"
+penSize = "Qələm ölçüsü: {{size}}px"
+placementActive = "Yerləşdirmək üçün PDF-ə klikləyin"
+placeSignatureButton = "İmzanı PDF üzərinə yerləşdir"
+reason = "Səbəb (Seçim üzrə)"
+reasonPlaceholder = "Niyə imzalayırsınız?"
+removeImage = "Şəkli sil"
+removeCertFile = "Faylı sil"
+savedSignatures = "Yadda saxlanılan imzalar"
+selectFile = "Şəkil faylı seçin"
+selectSignatureTitle = "İmza seçin və ya yaradın"
+signButton = "Sənədi imzala"
+signatureInfo = "Bu tənzimləmələr sənəd sahibi tərəfindən qurulub"
+signaturePlaced = "İmza səhifəyə yerləşdirildi"
+signatureSettings = "İmza tənzimləmələri"
+signatureText = "İmza mətni"
+signatureTextPlaceholder = "Adınızı daxil edin..."
+signatureTypeLabel = "İmza növü"
+signingTitle = "Ä°mzalama"
+textColor = "Mətn rəngi"
+typeSignature = "İmza yaratmaq üçün adınızı yazın"
+uploadCert = "Fərdi sertifikat"
+uploadCertDesc = "Öz P12/PFX sertifikatınızdan istifadə edin"
+uploadSignature = "İmzanızın şəklini yükləyin"
+usePersonalCert = "Şəxsi sertifikat"
+usePersonalCertDesc = "Hesabınız üçün avtomatik yaradılır"
+useServerCert = "Təşkilat sertifikatı"
+useServerCertDesc = "Paylaşılan təşkilat sertifikatı"
+workbenchTitle = "Ä°mza SorÄŸusu"
+
+[certSign.collab.signRequest.canvas]
+colorPickerTitle = "Xətt rəngini seçin"
+continue = "Davam et"
+
+[certSign.collab.signRequest.certModal]
+description = "{{count}} imza yerləşdirmisiniz. İmzalamayı tamamlamak üçün sertifikatınızı seçin."
+sign = "Sənədi imzala"
+certValidating = "Sertifikat yoxlanılır..."
+certValidUntil = "Sertifikatın qüvvə müddəti {{date}} tarixədək"
+certInvalid = "Sertifikat etibarsızdır: {{error}}"
+certInvalidFallback = "Etibarsız sertifikat"
+certNetworkError = "Sertifikatı yoxlamaq mümkün olmadı"
+title = "Sertifikatı tənzimlə"
+
+[certSign.collab.signRequest.image]
+hint = "İmzanızın PNG və ya JPG şəklini yükləyin"
+
+[certSign.collab.signRequest.mode]
+move = "İmzanı hərəkət etdir"
+place = "İmzanı yerləşdir"
+title = "İmzalama və ya hərəkət etdirmə rejimi"
+
+[certSign.collab.signRequest.modeTabs]
+draw = "Çək"
+image = "Yüklə"
+text = "Yaz"
+
+[certSign.collab.signRequest.placeSignature]
+message = "İmzanızı yerləşdirmək üçün PDF-ə klikləyin"
+title = "İmzanı yerləşdir"
+
+[certSign.collab.signRequest.preview]
+imageAlt = "Seçilmiş imza"
+missing = "Ön baxış yoxdur"
+textFallback = "Ä°mza"
+
+[certSign.collab.signRequest.saved]
+defaultCanvasLabel = "Çəkilmiş imza"
+defaultImageLabel = "Yüklənmiş imza"
+defaultLabel = "Ä°mza"
+defaultTextLabel = "Yazılmış imza"
+delete = "İmzanı sil"
+none = "Yadda saxlanmış imza yoxdur"
+
+[certSign.collab.signRequest.signatureType]
+draw = "Çək"
+type = "Yaz"
+upload = "Yüklə"
+
+[certSign.collab.signRequest.steps]
+back = "Geri"
+cancelPlacement = "Yerləşdirməni ləğv et"
+certificate = "Sertifikat"
+clickMultipleTimes = "İmzaları yerləşdirmək üçün PDF-ə bir neçə dəfə klikləyin. Hər hansı imzanı daşıyaraq yerini dəyişin və ya ölçüləndirin."
+clickToPlace = "İmzanızın görünməsini istədiyiniz yerə PDF üzərində klikləyin."
+continue = "Sertifikat seçiminə davam et"
+continueToPlacement = "Yerləşdirməyə davam et"
+continueToReview = "Ä°cmala davam et"
+createSignature = "Ä°mza yarat"
+invisible = "Görünməz"
+location = "Məkan:"
+multipleSignatures = "{{count}} imza PDF-ə tətbiq olunacaq"
+oneSignature = "PDF-ə 1 imza tətbiq olunacaq"
+placeOnPdf = "PDF üzərinə yerləşdir"
+reason = "Səbəb:"
+reviewTitle = "İmzalamadan əvvəl baxış"
+signaturePlaced = "İmza {{page}}-ci səhifəyə yerləşdirildi. Yenidən klikləyərək yerini düzəldə və ya icmala davam edə bilərsiniz."
+visible = "Görünən"
+visibility = "Görünürlük:"
+yourSignatures = "İmzalarınız ({{count}})"
+
+[certSign.collab.signRequest.text]
+colorLabel = "Rəng"
+fontLabel = "Åžrift"
+fontSizeLabel = "Ölçü"
+fontSizePlaceholder = "16"
+label = "İmza mətni"
+modalHint = "Adınızı daxil edin, sonra PDF üzərində yerləşdirmək üçün Davam et düyməsini klikləyin."
+placeholder = "Adınızı daxil edin..."
+
+[certSign.collab.participant]
+certValidating = "Sertifikat yoxlanılır..."
+certValid = "✓ Sertifikat etibarlıdır"
+certValidUntil = " {{date}} tarixinədək"
+certInvalid = "✗ {{error}}"
+certInvalidFallback = "Etibarsız sertifikat"
+certNetworkError = "Sertifikatı yoxlamaq mümkün olmadı"
+
+[certSign.collab.addParticipants]
+add = "{{count}} iştirakçı əlavə et"
+back = "Geri"
+configureSignatures = "İmza tənzimləmələrini tənzimlə"
+continue = "İmza tənzimləmələrinə davam et"
+reasonHelp = "Bu iştirakçılar üçün imzalama səbəbini əvvəlcədən təyin edin (seçim üzrə, imzalayarkən dəyişə bilərlər)"
+reasonPlaceholder = "məs., Təsdiq, İcmal..."
+selectUsers = "İstifadəçiləri seçin"
+
+[certSign.collab.sessionCreation]
+includeSummaryPage = "İmza xülasə səhifəsini daxil et"
+includeSummaryPageHelp = "Sonda bütün imza metadata-sı ilə xülasə səhifəsi əlavə olunacaq. Ayrı-ayrı səhifələrdəki rəqəmsal sertifikat imza çərçivələri gizlədiləcək (əl ilə imzalar təsirlənmir)."
+
+[certSign.collab.sessionList]
+active = "Aktiv"
+finalized = "Yekunlaşdırılıb"
+
+[certSign.collab.signatureSettings]
+description = "İmzaların bütün iştirakçılar üçün necə görünəcəyini tənzimləyin"
+title = "İmzanın görünüşü"
+
+[certSign.collab.userSelector]
+inviteUsers = "İstifadəçi əlavə et"
+loadError = "İstifadəçiləri yükləmək mümkün olmadı"
+noTeam = "Komanda yoxdur"
+noUsers = "Başqa istifadəçi tapılmadı."
+placeholder = "İstifadəçiləri seçin..."
+
+[certSign.mobile]
+panelActions = "Fəaliyyətlər"
+panelDocument = "Sənəd"
+panelPeople = "Şəxslər"
+
+[certSign.sessions]
+deleted = "Sessiya silindi"
+fetchFailed = "Sessiya detalları yüklənə bilmədi"
+finalized = "Sessiya yekunlaşdırıldı"
+loaded = "İmzalanmış PDF yükləndi"
+pdfNotReady = "PDF Hazır Deyil"
+pdfNotReadyDesc = "İmzalanmış PDF yaradılır. Zəhmət olmasa bir qədər sonra yenidən cəhd edin."
+
+[certificateChoice.tooltip]
+header = "Sertifikat Növləri"
+
+[certificateChoice.tooltip.organization]
+bullet1 = "Sistem administratorları tərəfindən idarə olunur"
+bullet2 = "Avtorizə olunmuş istifadəçilər arasında paylaşılır"
+bullet3 = "Fərdi deyil, şirkət kimliyini təmsil edir"
+bullet4 = "�n uyğunu: Rəsmi sənədlər, komanda imzaları"
+description = "Təşkilatınız tərəfindən təqdim olunan paylaşılmış sertifikat. Şirkət miqyasında imzalama səlahiyyəti üçün istifadə olunur."
+title = "Təşkilat Sertifikatı"
+
+[certificateChoice.tooltip.personal]
+bullet1 = "İlk istifadə zamanı avtomatik yaradılır"
+bullet2 = "İstifadəçi hesabınızla bağlıdır"
+bullet3 = "Başqa istifadəçilərlə paylaşıla bilməz"
+bullet4 = "�n uyğunu: Şəxsi sənədlər, fərdi məsuliyyət"
+description = "İstifadəçi hesabınız üçün unikal, avtomatik yaradılan sertifikat. Fərdi imzalar üçün uyğundur."
+title = "Şəxsi Sertifikat"
+
+[certificateChoice.tooltip.upload]
+bullet1 = "P12/PFX faylı və şifrə tələb edir"
+bullet2 = "Xarici Sertifikat Orqanları tərəfindən verilə bilər"
+bullet3 = "Hüquqi sənədlər üçün daha yüksək etibar səviyyəsi"
+bullet4 = "�n uyğunu: Hüquqi qüvvəli müqavilələr, xarici təsdiqləmə"
+description = "Öz PKCS#12 sertifikat faylınızdan istifadə edin. Sertifikat xüsusiyyətlərinə tam nəzarət verir."
+title = "Fərdi P12 yüklə"
+
 [changeCreds]
 changePassword = "Siz standart giriş məlumatlarından istifadə edirsiniz. Zəhmət olmasa, yeni şifr daxil edin"
 changeUsername = "İstifadəçi adınızı yeniləyin. Yenilədikdən sonra çıxış ediləcəksiniz."
@@ -3242,6 +3531,46 @@ totalSelected = "Cəmi seçilib"
 unsupported = "Dəstəklənmir"
 unzip = "Arxivdən çıxar"
 uploadError = "Bəzi faylları yükləmək alınmadı."
+copyCreated = "Surət bu cihazda saxlandı."
+copyFailed = "Surət yaratmaq mümkün olmadı."
+leaveShare = "Siyahımdan çıxar"
+leaveShareFailed = "Paylaşılan faylı siyahıdan çıxarmaq mümkün olmadı."
+leaveShareSuccess = "Paylaşılan siyahınızdan çıxarıldı."
+removeBoth = "Hər ikisindən sil"
+removeFilePrompt = "Bu fayl bu cihazda və serverinizdə saxlanılır. Hansından silmək istəyirsiniz?"
+removeFileTitle = "Faylı sil"
+removeLocalOnly = "Yalnız bu cihazda"
+removeServerFailed = "Faylı serverdən silmək mümkün olmadı."
+removeServerOnly = "Yalnız serverdə"
+removeServerOnlyPrompt = "Bu fayl yalnız serverinizdə saxlanılır. Serverdən silmək istəyirsiniz?"
+removeServerSuccess = "Serverdən silindi."
+removeSharedPrompt = "Bu fayl sizinlə paylaşılıb. Onu bu cihazdan və ya paylaşılan siyahınızdan silə bilərsiniz."
+removeSharedServerOnlyBlockedPrompt = "Bu fayl sizinlə paylaşılıb və yalnız serverdə saxlanılır."
+removeSharedServerOnlyPrompt = "Bu fayl sizinlə paylaşılıb və yalnız serverdə saxlanılır. Siyahınızdan çıxarmaq istəyirsiniz?"
+changesNotUploaded = "Dəyişikliklər yüklənməyib"
+cloudFile = "Bulud faylı"
+filterAll = "Hamısı"
+filterLocal = "Lokal"
+filterSharedByMe = "Mənim paylaşdıqlarım"
+filterSharedWithMe = "Mənimlə paylaşılanlar"
+lastSynced = "Son sinxronlaşdırma"
+localOnly = "Yalnız lokal"
+makeCopy = "Surət yarat"
+owner = "Sahib"
+ownerUnknown = "Naməlum"
+share = "PaylaÅŸ"
+shareSelected = "Seçilənləri paylaş"
+sharedByYou = "Sizin paylaşdıqlarınız"
+sharedEditNoticeBody = "Bu faylın server versiyasını redaktə etmə hüququnuz yoxdur. Etdiyiniz dəyişikliklər lokal surət kimi saxlanılacaq."
+sharedEditNoticeConfirm = "Başa düşdüm"
+sharedEditNoticeTitle = "Server nüsxəsi yalnız oxumaq üçündür"
+sharedWithYou = "Sizinlə paylaşılanlar"
+sharing = "PaylaÅŸma"
+storageState = "Saxlama"
+synced = "Sinxronlaşdırılıb"
+updateOnServer = "ServerdÉ™ yenilÉ™"
+uploadSelected = "Seçilənləri yüklə"
+uploadToServer = "Serverə yüklə"
 
 [files]
 addFiles = "Fayllar əlavə et"
@@ -3367,6 +3696,77 @@ title = "PDF-lərin yastılaşdırılması haqqında"
 discord = "Discord"
 issues = "GitHub"
 
+[groupSigning.tooltip]
+header = "Qrup imzalanması haqqında"
+
+[groupSigning.tooltip.finalization]
+bullet1 = "Bütün imzalar göstərdiyiniz iştirakçı ardıcıllığına görə tətbiq olunur"
+bullet2 = "Lazım olsa qismən imzalarla yekunlaşdıra bilərsiniz"
+bullet3 = "Yekunlaşdırıldıqdan sonra sessiya dəyişdirilə bilməz"
+description = "Bütün iştirakçılar imzaladıqdan sonra (və ya erkən yekunlaşdırma seçsəniz) yekun imzalanmış PDF-i yarada bilərsiniz."
+title = "Yekunlaşdırma Prosesi"
+
+[groupSigning.tooltip.roles]
+bullet1 = "Sahib (siz): Sessiya yaradır, imza standartlarını qurur, sənədi yekunlaşdırır"
+bullet2 = "İştirakçılar: Öz imzalarını yaradır, sertifikatı seçir, PDF üzərinə yerləşdirir"
+bullet3 = "İştirakçılar imzanın görünürlüyü, səbəb və məkan tənzimləmələrini dəyişə bilməz"
+description = "Bütün iştirakçılar üçün imza görünüşü tənzimləmələrinə siz nəzarət edirsiniz."
+title = "İştirakçı Rolları"
+
+[groupSigning.tooltip.sequential]
+bullet1 = "İkinci şəxs sənədə çıxmadan əvvəl birinci iştirakçı imzalamalıdır"
+bullet2 = "Hüquqi uyğunluq üçün düzgün imzalama sırasını təmin edir"
+bullet3 = "İştirakçıları siyahıda sürükləyərək sıralamanı dəyişə bilərsiniz"
+description = "İştirakçılar sənədləri sizin verdiyiniz ardıcıllıqla imzalayır. Növbəsi çatdıqda hər imzalayana bildiriş göndərilir."
+title = "Ardıcıllıqla İmzalama"
+
+[groupSigning.steps]
+back = "Geri"
+completed = "Tamamlandı"
+current = "Cari"
+stepLabel = "Addım {{number}}"
+
+[groupSigning.steps.configureDefaults]
+continue = "Ä°cmala davam et"
+invisible = "İmzalar görünməyəcək (yalnız metadata)"
+locationLabel = "Məkan:"
+preview = "Ön baxış"
+reasonLabel = "Səbəb:"
+title = "İmza tənzimləmələrini tənzimlə"
+visible = "İmzalar {{page}}-ci səhifədə görünəcək"
+
+[groupSigning.steps.review]
+document = "Sənəd"
+dueDate = "Son tarix (Seçim üzrə)"
+dueDatePlaceholder = "Son tarixi seçin..."
+invisible = "Görünməz (yalnız metadata)"
+location = "Məkan:"
+logo = "Loqo:"
+logoHidden = "Loqo yoxdur"
+logoShown = "Stirling PDF loqosu göstərilir"
+participants = "İştirakçılar"
+reason = "Səbəb:"
+send = "İmzalama Sorğularını Göndər"
+signatureSettings = "İmza tənzimləmələri"
+title = "Sessiya Detalları İcmalı"
+titleShort = "İcmal və Göndər"
+visibility = "Görünürlük:"
+visible = "{{page}}-ci səhifədə görünən"
+participantCount = "{{count}} iştirakçı ardıcıllıqla imzalayacaq"
+
+[groupSigning.steps.selectDocument]
+continue = "İştirakçı seçiminə davam et"
+noFile = "İmzalama sessiyası yaratmaq üçün aktiv fayllarınızdan tək bir PDF faylı seçin."
+selectedFile = "Seçilmiş sənəd"
+title = "Sənədi seçin"
+
+[groupSigning.steps.selectParticipants]
+continue = "İmza tənzimləmələrinə davam et"
+count = "{{count}} iştirakçı seçildi"
+label = "İştirakçıları seçin"
+placeholder = "İştirakçıları imzalamaq üçün seçin..."
+title = "İştirakçıları seçin"
+
 [getPdfInfo]
 downloadJson = "JSON yüklə"
 downloads = "Yükləmələr"
@@ -4460,7 +4860,10 @@ zoomOut = "Kiçilt"
 
 [viewer]
 cannotPreviewFile = "Faylın önizlənməsi mümkün deyil"
+disableColorFilter = "Rəng filtrini söndür"
 dualPageView = "İki Səhifə Görünüşü"
+enableDarkFilter = "Qaranlıq filtrini aktiv et"
+enableSepiaFilter = "Sepiya filtrini aktiv et"
 firstPage = "Birinci səhifə"
 lastPage = "Son səhifə"
 nextPage = "Növbəti səhifə"
@@ -4470,6 +4873,22 @@ singlePageView = "Tək Səhifə Görünüşü"
 unknownFile = "Naməlum fayl"
 zoomIn = "Böyüt"
 zoomOut = "Kiçilt"
+resetZoom = "Miqyası sıfırla"
+
+[viewer.nonPdf]
+fileTypeBadge = "{{type}} Faylı"
+convertToPdf = "PDF-ə çevir"
+loading = "Yüklənir..."
+emptyFile = "BoÅŸ fayl"
+csvStats = "{{rows}} sətir · {{columns}} sütun · {{size}}"
+sortedBy = "Sıralanıb: {{column}}"
+columnDefault = "Sütun {{index}}"
+htmlPreviewWarning = "HTML ön baxış — xarici resurslar yüklənməyə bilər · {{size}}"
+htmlPreview = "HTML ön baxış"
+invalidJson = "Etibarsız JSON — xam məzmun göstərilir"
+textStats = "{{lines}} sətir · {{size}}"
+lineNumbers = "Sətir nömrələri"
+renderMarkdown = "Markdown-u göstər"
 
 [viewer.attachments]
 title = "QoÅŸmalar"
@@ -4531,6 +4950,7 @@ toggleAttachments = "Qoşmaları göstər/gizlət"
 toggleTheme = "Mövzunu dəyiş"
 language = "Dil"
 toggleAnnotations = "Annotasiyaların görünməsini dəyiş"
+toggleLayers = "Qatları aç/bağla"
 search = "PDF-dÉ™ axtar"
 panMode = "Sürüşdürmə rejimi"
 applyRedactionsFirst = "�vvəlcə məxfiləşdirmələri tətbiq edin"
@@ -5407,20 +5827,72 @@ title = "Faylı çap edin"
 2 = "Printer adını daxil edin"
 
 [quickAccess]
+access = "GiriÅŸ"
+accessAddPerson = "Başqa şəxs əlavə et"
+accessBack = "Geri"
+accessCopyLink = "Linki kopyala"
+accessEmail = "E-poçt ünvanı"
+accessEmailPlaceholder = "name@company.com"
+accessFileLabel = "Fayl"
+accessGeneral = "Ãœmumi giriÅŸ"
+accessInviteTitle = "İnsanları dəvət et"
+accessOwner = "Sahib"
+accessPanel = "Sənədə giriş"
+accessPeople = "GiriÅŸi olanlar"
+accessRemove = "Sil"
+accessRestricted = "Məhdudlaşdırılıb"
+accessRestrictedHint = "Yalnız girişi olanlar aça bilər"
+accessRole = "Rol"
+accessRoleCommenter = "Şərhçi"
+accessRoleEditor = "Redaktor"
+accessRoleViewer = "İzləyici"
+accessSelectedFile = "Seçilmiş fayl"
+accessSendInvite = "Dəvət göndər"
+accessTitle = "Sənədə giriş"
+accessYou = "Siz"
 account = "Hesab"
+activeSessions = "Aktiv sessiyalar"
+activeTab = "Aktiv"
 activity = "Aktivlik"
 adminSettings = "Admin Ayarları"
+allSessions = "Bütün sessiyalar"
 allTools = "All Tools"
 automate = "Auto"
+back = "Geri"
+certSign = "Sertifikatla imzalama"
+completedSessions = "Tamamlanmış sessiyalar"
+completedTab = "Tamamlanmış"
 config = "Konfiq"
+createNew = "Yeni sorÄŸu yarat"
+createSession = "Ä°mzalama sorÄŸusu yarat"
+dueDate = "Son tarix (seçim üzrə)"
 files = "Fayllar"
 help = "Kömək"
+noActiveSessions = "Gözləyən imza sorğusu və ya aktiv sessiya yoxdur"
+noCompletedSessions = "Tamamlanmış sessiya yoxdur"
+noFile = "Fayl seçilməyib"
 read = "Oxu"
 reader = "Oxuyucu"
+refresh = "YenilÉ™"
+requestSignatures = "İmzalar tələb et"
+selectSingleFileToRequest = "İmzalar istəmək üçün tək bir PDF faylı seçin"
+selectedFile = "Seçilmiş fayl"
+selectUsers = "İmzalama üçün istifadəçiləri seçin"
+selectUsersPlaceholder = "İştirakçıları seçin..."
+sendingRequest = "Göndərilir..."
 settings = "Ayarlar"
 showMeAround = "Məni gəzdir"
 sign = "Ä°mzala"
+signatureRequests = "İmza sorğuları"
+signYourself = "Özünüz imzalayın"
+newRequest = "Yeni sorÄŸu"
 tours = "Turlar"
+wetSign = "İmza əlavə et"
+filterMine = "Mənim"
+filterOverdue = "Müddəti keçmiş"
+filterSigned = "İmzalanıb"
+filterDeclined = "Ä°mtina edilib"
+searchDocuments = "Sənədlərdə axtar…"
 
 [quickAccess.helpMenu]
 adminTour = "Admin Turu"
@@ -6050,11 +6522,75 @@ toolNotAvailableLocally = "Sizin Stirling-PDF serveriniz oflayndır və \"{{endp
 expired = "Sessiyanızın vaxtı bitdi. Səhifəni yeniləyin və yenidən cəhd edin."
 refreshPage = "Səhifəni Yenilə"
 
+[sessionManagement.tooltip]
+header = "İmzalama sessiyalarının idarə edilməsi"
+
+[sessionManagement.tooltip.addParticipants]
+bullet1 = "Yeni iştirakçılar imzalama sırasının sonuna əlavə olunur"
+bullet2 = "Sessiya yekunlaşdırıldıqdan sonra iştirakçı əlavə etmək olmaz"
+bullet3 = "Növbəsi çatanda hər iştirakçıya bildiriş göndərilir"
+description = "Yekunlaşdırmadan əvvəl istənilən vaxt aktiv sessiyaya daha çox iştirakçı əlavə edə bilərsiniz."
+title = "İştirakçıların əlavə edilməsi"
+
+[sessionManagement.tooltip.finalization]
+bullet1 = "<b>Tam yekunlaşdırma</b>: Bütün iştirakçılar imzalayıb"
+bullet2 = "<b>Qismən yekunlaşdırma</b>: Bəzi iştirakçılar hələ imzalamayıb"
+bullet3 = "İmzalamayan iştirakçılar yekun sənəddən çıxarılacaq"
+bullet4 = "Yekunlaşdırdıqdan sonra imzalanmış PDF-i aktiv fayllara yükləyə bilərsiniz"
+description = "Yekunlaşdırma bütün imzaları tək imzalanmış PDF-də birləşdirir. Bu əməliyyatı geri qaytarmaq olmaz."
+title = "Sessiyanın Yekunlaşdırılması"
+
+[sessionManagement.tooltip.participantRemoval]
+bullet1 = "Artıq imzalamış iştirakçıları silmək olmaz"
+bullet2 = "Silinən iştirakçılar artıq bildiriş almayacaq"
+bullet3 = "İmzalama sırası avtomatik tənzimlənir"
+description = "İştirakçılar imzalamadan əvvəl sessiyalardan silinə bilər."
+title = "İştirakçıların Silinməsi"
+
+[sessionManagement.tooltip.signatureOrder]
+bullet1 = "Hər imza PDF-ə ardıcıllıqla tətbiq olunur"
+bullet2 = "Sonrakı imzalayanlar əvvəlki imzaları görə bilir"
+bullet3 = "Təsdiq axınları və hüquqi nəzarət zəncirləri üçün vacibdir"
+description = "Sessiyanı yaradan zaman göstərdiyiniz sıra birincinin kim olacağını müəyyən edir."
+title = "İmza Sırası"
+
+[signatureSettings.tooltip]
+header = "İmzanın Görünüşü Tənzimləmələri"
+
+[signatureSettings.tooltip.location]
+bullet1 = "Nümunələr: \"New York, USA\", \"London Office\", \"Remote\""
+bullet2 = "Səhifədəki mövqedən fərqlidir"
+bullet3 = "Bəzi hüquqi yurisdiksiyalar üçün tələb oluna bilər"
+description = "İmzanın tətbiq olunduğu ixtiyari coğrafi məkan. Sertifikat metadata-sında saxlanılır."
+title = "İmza Məkanı"
+
+[signatureSettings.tooltip.logo]
+bullet1 = "İmza və mətnlə yanaşı göstərilir"
+bullet2 = "PNG, JPG formatlarını dəstəkləyir"
+bullet3 = "Peşəkar görünüşü artırır"
+description = "Brendinq və autentiklik üçün görünən imzalara şirkət loqosu əlavə edin."
+title = "Şirkət Loqosu"
+
+[signatureSettings.tooltip.reason]
+bullet1 = "Nümunələr: \"Approval\", \"Contract Agreement\", \"Review Complete\""
+bullet2 = "PDF imza xüsusiyyətlərində görünür"
+bullet3 = "Audit izləri və uyğunluq üçün faydalıdır"
+description = "Sənədin niyə imzalandığını izah edən ixtiyari mətn. Sertifikat metadata-sında saxlanılır."
+title = "İmzanın Səbəbi"
+
+[signatureSettings.tooltip.visibility]
+bullet1 = "<b>Görünən</b>: İmza PDF-də xüsusi görünüşlə görünür"
+bullet2 = "<b>Görünməz</b>: Sertifikat vizual işarə olmadan yerləşdirilir"
+bullet3 = "Görünməz imzalar da kriptoqrafik təsdiq təmin edir"
+description = "İmzanın sənəddə görünən olub-olmadığını və ya gizli yerləşdirildiyini idarə edir."
+title = "İmzanın Görünürlüyü"
+
 [settings.configuration]
 advanced = "Qabaqcıl"
 database = "Məlumat bazası"
 endpoints = "Endpointlər"
 features = "Funksiyalar"
+storageSharing = "Fayl Saxlama vÉ™ PaylaÅŸma"
 systemSettings = "Sistem parametrləri"
 title = "Konfiqurasiya"
 
@@ -6332,10 +6868,13 @@ title = "Stirling-É™ daxil olun"
 [setup.selfhosted]
 link = "vÉ™ ya self-hosted hesaba qoÅŸulun"
 subtitle = "Server məlumatlarınızı daxil edin"
+changeServerLocked = "Təşkilatınız bu tətbiqi konkret serverlə məhdudlaşdırıb"
 switchToLocal = "�vəzində yerli alətlərdən istifadə et"
 title = "ServerÉ™ daxil olun"
 
 [setup.selfhosted.unreachable]
+changeServer = "BaÅŸqa serverÉ™ qoÅŸul"
+changeServerLocked = "Təşkilatınız bu tətbiqi konkret serverlə məhdudlaşdırıb"
 continueOffline = "�vəzində yerli alətlərdən istifadə et"
 message = "{{url}} ünvanına qoşulmaq mümkün olmadı. Serverin işlədiyini və əlçatan olduğunu yoxlayın."
 retry = "Yenidən cəhd et"
@@ -6529,6 +7068,15 @@ saved = "Saxlanmış"
 text = "Mətn"
 title = "İmza növü"
 
+[signRequest]
+declined = "Ä°mza sorÄŸusundan imtina edildi"
+fetchFailed = "İmza sorğusunu yükləmək mümkün olmadı"
+signed = "Sənəd uğurla imzalandı"
+
+[signSession]
+createFailed = "İmzalama sorğusu yaratmaq mümkün olmadı"
+created = "İmzalama sorğusu göndərildi"
+
 [signup]
 accountCreatedSuccessfully = "Hesab uğurla yaradıldı! İndi daxil ola bilərsiniz."
 alreadyHaveAccount = "Artıq hesabınız var? Daxil olun"
@@ -6807,6 +7355,106 @@ title = "PDF-i hissələrə bölün"
 [splitPdfByChapters]
 tags = "böl,fəsillər,əlfəcinlər,nizamla"
 
+[storageShare]
+accessed = "Daxil olundu"
+accessDenied = "Bu paylaşılan fayla girişiniz yoxdur. Sahibdən sizinlə paylaşmağı xahiş edin."
+accessFailed = "Fəaliyyəti yükləmək mümkün olmadı."
+accessDeniedBody = "Bu fayla girişiniz yoxdur. Sahibdən sizinlə paylaşmağı xahiş edin."
+accessDeniedTitle = "GiriÅŸ yoxdur"
+accessLimitedCommenter = "Şərh imkanı tezliklə gələcək. Endirməyə ehtiyacınız varsa, sahibdən redaktor girişi istəyin."
+accessLimitedTitle = "Məhdud giriş"
+accessLimitedViewer = "Bu link yalnız baxış üçündür. Endirməyə ehtiyacınız varsa, sahibdən redaktor girişi istəyin."
+createdAt = "Yaradılıb"
+download = "Endir"
+downloadFailed = "Bu faylı endirmək mümkün deyil."
+expiredBody = "Bu paylaşma linki etibarsızdır və ya vaxtı bitib."
+expiredTitle = "Linkin müddəti bitib"
+goToLogin = "Giriş səhifəsinə keç"
+loadFailed = "Paylaşılan faylı açmaq mümkün deyil."
+loading = "Paylaşma linki yüklənir..."
+loginPrompt = "Bu paylaşılan fayla daxil olmaq üçün daxil olun."
+loginRequired = "Giriş tələb olunur"
+openInApp = "Open in Stirling PDF"
+ownerLabel = "Sahib"
+ownerUnknown = "Naməlum"
+requiresLogin = "Bu paylaşılan fayl üçün giriş tələb olunur."
+roleCommenter = "Şərhçi"
+roleEditor = "Redaktor"
+roleViewer = "İzləyici"
+shareHeading = "Paylaşılan fayl"
+titleDefault = "Paylaşılan fayl"
+tryAgain = "Zəhmət olmasa sonra yenidən cəhd edin."
+addUser = "�lavə et"
+commenterHint = "Şərh əlavə etmə funksiyası tezliklə."
+copied = "Link panoya kopyalandı"
+copy = "Kopyala"
+copyFailed = "Kopyalama uÄŸursuz oldu"
+description = "Bu fayl üçün paylaşma linki yaradın. Linkə malik daxil olmuş istifadəçilər ona çata bilər."
+downloadsCount = "Endirmələr: {{count}}"
+emailWarningBody = "Bu e-poçt ünvanına bənzəyir. Bu şəxs Stirling PDF istifadəçisi deyilsə, fayla çata bilməyəcək."
+emailWarningConfirm = "YenÉ™ dÉ™ paylaÅŸ"
+emailWarningTitle = "E-poçt ünvanı"
+errorTitle = "Paylaşma alınmadı"
+failure = "Paylaşma linki yaratmaq mümkün olmadı. Zəhmət olmasa yenidən cəhd edin."
+fileLabel = "Fayl"
+generate = "Link yarat"
+generated = "Paylaşma linki yaradıldı"
+hideActivity = "Fəaliyyəti gizlət"
+invalidUsername = "Etibarlı istifadəçi adı və ya e-poçt ünvanı daxil edin."
+lastAccessed = "Son daxilolma"
+linkAccessTitle = "PaylaÅŸma linkinÉ™ giriÅŸ"
+linkLabel = "PaylaÅŸma linki"
+linksDisabled = "Paylaşma linkləri deaktiv edilib."
+linksDisabledBody = "Paylaşma linkləri server tənzimləmələriniz tərəfindən deaktiv edilib."
+manage = "Paylaşmanı idarə et"
+manageDescription = "Bu faylı paylaşmaq üçün linklər yaradın və idarə edin."
+manageLoadFailed = "Paylaşma linklərini yükləmək mümkün olmadı."
+manageTitle = "Paylaşmanın idarə edilməsi"
+noActivity = "Hələ fəaliyyət yoxdur."
+noLinks = "Hələ aktiv paylaşma linki yoxdur."
+noSharedUsers = "Hələ heç bir istifadəçinin girişi yoxdur."
+removeLink = "Linki sil"
+removeUser = "Sil"
+revokeFailed = "Paylaşma linkini silmək mümkün olmadı."
+revoked = "Paylaşma keçidi silindi"
+roleLabel = "Rol"
+sharingDisabled = "Paylaşım deaktiv edilib."
+sharingDisabledBody = "Paylaşım server tənzimləmələriniz tərəfindən deaktiv edilib."
+sharedUsersTitle = "Paylaşılan istifadəçilər"
+title = "Faylı paylaş"
+unknownUser = "Naməlum istifadəçi"
+userAddFailed = "Bu istifadəçi ilə paylaşmaq mümkün olmadı."
+userAdded = "İstifadəçi paylaşım siyahısına əlavə edildi."
+usernameLabel = "İstifadəçi adı və ya e-poçt"
+usernamePlaceholder = "İstifadəçi adı və ya e-poçt daxil edin"
+userRemoveFailed = "Bu istifadəçini silmək mümkün olmadı."
+userRemoved = "İstifadəçi paylaşım siyahısından silindi."
+viewActivity = "AktivliyÉ™ bax"
+viewed = "Baxılıb"
+viewsCount = "Baxışlar: {{count}}"
+downloaded = "Endirilib"
+bulkDescription = "Daxil olmuş istifadəçilərlə seçilmiş bütün faylları paylaşmaq üçün bir keçid yaradın."
+bulkTitle = "Seçilmiş faylları paylaş"
+copyLink = "Paylaşma keçidini kopyala"
+fileCount = "{{count}} fayl seçilib"
+ownerOnly = "Paylaşımı yalnız sahibi idarə edə bilər."
+selectSingleFile = "Paylaşımı idarə etmək üçün tək bir fayl seçin."
+
+[storageUpload]
+description = "Bu, cari faylı öz girişiniz üçün server yaddaşına yükləyir."
+errorTitle = "Yükləmə uğursuz oldu"
+failure = "Yükləmə uğursuz oldu. Zəhmət olmasa giriş və yaddaş tənzimləmələrinizi yoxlayın."
+fileLabel = "Fayl"
+hint = "İctimai keçidlər və giriş rejimləri server tənzimləmələriniz tərəfindən idarə olunur."
+success = "Serverə yükləndi"
+title = "Serverə yüklə"
+updateButton = "ServerdÉ™ yenilÉ™"
+uploadButton = "Serverə yüklə"
+bulkDescription = "Bu, seçilmiş faylları server yaddaşınıza yükləyir."
+bulkTitle = "Seçilmiş faylları yüklə"
+fileCount = "{{count}} fayl seçilib"
+more = " +{{count}} daha"
+
 [storage]
 approximateSize = "Təxmini ölçü"
 fileTooLarge = "Fayl çox böyükdür. Hər fayl üçün maksimum ölçü"
@@ -7153,6 +7801,30 @@ title = "PDF-É™ Bax/RedaktÉ™ et"
 [warning]
 tooltipTitle = "Xəbərdarlıq"
 
+[wetSignature.tooltip]
+header = "İmza yaratma üsulları"
+
+[wetSignature.tooltip.draw]
+bullet1 = "Qələm rəngini və qalınlığını fərdiləşdirin"
+bullet2 = "Bəyənənədək silin və yenidən çəkin"
+bullet3 = "Sensor qurğularda işləyir (planşetlər, telefonlar)"
+description = "Siçan və ya sensor ekran vasitəsilə əl yazısı imza yaradın. Şəxsi, autentik imzalar üçün ən uyğundur."
+title = "İmzanı çək"
+
+[wetSignature.tooltip.type]
+bullet1 = "Bir neçə şriftdən seçin"
+bullet2 = "Mətn ölçüsünü və rəngini fərdiləşdirin"
+bullet3 = "Standartlaşdırılmış imzalar üçün idealdır"
+description = "Yazılmış mətndən imza yaradın. Sürətli və ardıcıl, iş sənədləri üçün uyğundur."
+title = "İmzanı yaz"
+
+[wetSignature.tooltip.upload]
+bullet1 = "PNG, JPG və digər şəkil formatlarını dəstəkləyir"
+bullet2 = "�n yaxşı nəticə üçün şəffaf fon məsləhətdir"
+bullet3 = "Şəkil imza sahəsinə uyğun ölçüləndiriləcək"
+description = "Öncədən yaradılmış imza şəklini yükləyin. Skan edilmiş imzanız və ya şirkət loqonuz varsa idealdır."
+title = "İmza şəklini yüklə"
+
 [watermark]
 completed = "Su nişanı əlavə olundu"
 desc = "PDF fayllarına mətn və ya şəkil su nişanları əlavə edin"
@@ -7333,6 +8005,7 @@ activeSession = "Aktiv sessiya"
 addMembers = "Üzv əlavə et"
 admin = "Admin"
 confirmDelete = "Bu istifadəçini silmək istədiyinizə əminsiniz? Bu əməliyyat geri alına bilməz."
+confirmUnlock = "Bu istifadəçi hesabının kilidini açmaq istədiyinizə əminsiniz?"
 deleteUser = "İstifadəçini sil"
 deleteUserError = "İstifadəçini silmək alınmadı"
 deleteUserSuccess = "İstifadəçi uğurla silindi"
@@ -7341,6 +8014,8 @@ disable = "Deaktiv et"
 disabled = "Deaktiv"
 editRole = "Rolu redaktÉ™ et"
 enable = "Aktiv et"
+locked = "kilidli"
+lockedBadge = "Kilidli"
 loading = "İnsanlar yüklənir..."
 loginRequired = "�vvəlcə giriş rejimini aktivləşdirin"
 member = "Ãœzv"
@@ -7350,6 +8025,9 @@ searchMembers = "Üzvlərdə axtar..."
 status = "Status"
 team = "Komanda"
 title = "Ä°nsanlar"
+unlockAccount = "Hesabın kilidini aç"
+unlockUserError = "İstifadəçi hesabının kilidini açmaq mümkün olmadı"
+unlockUserSuccess = "İstifadəçi hesabının kilidi uğurla açıldı"
 user = "İstifadəçi"
 
 [workspace.people.actions]
diff --git a/frontend/public/locales/bg-BG/translation.toml b/frontend/public/locales/bg-BG/translation.toml
index 0dd69580a4..5db9df17fa 100644
--- a/frontend/public/locales/bg-BG/translation.toml
+++ b/frontend/public/locales/bg-BG/translation.toml
@@ -8,6 +8,7 @@ black = "Черно"
 blue = "Синьо"
 bored = "Отекчени �те да чакате?"
 cancel = "Отказ"
+confirm = "Потвърди"
 changedCredsMessage = "Идентификационните данни �а променени!"
 chooseFile = "Изберете файл"
 close = "Затворете"
@@ -146,6 +147,7 @@ insufficientCredits = "�едо�татъчен брой кредити. �ео
 loadingCredits = "Проверка на кредитите..."
 loadingProStatus = "Проверка на �ъ�то�нието на абонамента..."
 noticeTopUpOrPlan = "�едо�татъчно кредити. Мол�, заредете още или надградете до план"
+accessInvite = "Покани"
 
 [account]
 accountSettings = "�а�тройки на акаунта"
@@ -1427,6 +1429,34 @@ title = "Обработка"
 description = "Мак�имално време за изчакване на задача за обработка преди да �е �ъобщи грешка."
 label = "Таймаут за обработка (�екунди)"
 
+[admin.settings.storage]
+description = "Контролирайте �ървърното �ъхранение и опциите за �подел�не."
+title = "Съхранение на файлове и �подел�не"
+
+[admin.settings.storage.enabled]
+description = "Позвол�ва на потребителите да �ъхран�ват файлове на �ървъра."
+label = "�ктивиране на �ървърно �ъхранение на файлове"
+
+[admin.settings.storage.sharing.email]
+description = "Позвол�ва �подел�не � имейл адре�и."
+label = "�ктивиране на �подел�не по имейл"
+mailLink = "Конфигуриране на на�тройки за поща"
+mailNote = "Изи�ква конфигураци� на поща. "
+
+[admin.settings.storage.sharing.enabled]
+description = "Позвол�ва на потребителите да �подел�т �ъхранени файлове."
+label = "�ктивиране на �подел�не"
+
+[admin.settings.storage.sharing.links]
+description = "Позвол�ва �подел�не чрез връзки � изи�кване за вход."
+frontendUrlLink = "Конфигуриране в �и�темните на�тройки"
+frontendUrlNote = "Изи�ква Frontend URL. "
+label = "�ктивиране на връзки за �подел�не"
+
+[admin.settings.storage.signing.enabled]
+description = "Позвол�ва �ъздаване на �е�ии за подпи�ване � множе�тво уча�тници. Изи�ква активирано �ървърно �ъхранение на файлове."
+label = "�ктивиране на групово подпи�ване (Alpha)"
+
 [admin.settings.unsavedChanges]
 cancel = "Продължи редактирането"
 discard = "Отхвърли промените"
@@ -2059,7 +2089,19 @@ numbers = "Чи�ла/диапазони: 5, 10-20"
 progressions = "Прогре�ии: 3n, 4n+1"
 
 [certSign]
+allSigned = "В�ички уча�тници �а подпи�али. Готово за финализиране."
+awaitingSignatures = "Изчакват �е подпи�и"
+signatureProgress = "{{signedCount}}/{{totalCount}} подпи�а"
 chooseCertificate = "Изберете файл �ъ� �ертификат"
+declined = "Отказано"
+fetchFailed = "�еу�пешно зареждане на данните за подпи�ване"
+finalized = "Финализирано"
+notified = "В изчакване"
+partialNote = "Можете да финализирате по-рано � текущите подпи�и. �еподпи�алите уча�тници ще бъдат изключени."
+pending = "В изчакване"
+readyToFinalize = "Готово за финализиране"
+signed = "Подпи�ано"
+viewed = "Прегледано"
 chooseJksFile = "Изберете JKS файл"
 chooseP12File = "Изберете PKCS12 файл"
 choosePfxFile = "Изберете PFX файл"
@@ -2082,6 +2124,7 @@ title = "Подпи�ване �ъ� �ертификат"
 invisible = "�евидим"
 stepTitle = "Външен вид на подпи�а"
 visible = "Видим"
+visibility = "Видимо�т"
 
 [certSign.appearance.options]
 title = "Детайли на подпи�а"
@@ -2188,6 +2231,252 @@ bullet4 = "Може да използва потребител�ки �ерти
 text = "При проверка ин�трументът показва дали подпи�ите �а валидни, кой е подпи�ал документа, кога е подпи�ан и дали документът е промен�н �лед подпи�ване."
 title = "Проверка на подпи�и"
 
+[certSign.collab.finalize]
+button = "Финализирай и зареди подпи�ани� PDF"
+early = "Финализирай � текущите подпи�и"
+
+[certSign.collab.sessionDetail]
+addButton = "Добави уча�тници"
+addParticipants = "Добави уча�тници"
+addParticipantsError = "�еу�пешно добав�не на уча�тници"
+backToList = "�азад към �е�иите"
+deleteConfirm = "Сигурни ли �те? Това не може да �е отмени."
+deleteError = "�еу�пешно изтриване на �е�и�та"
+deleted = "Се�и�та е изтрита"
+deleteSession = "Изтрий �е�и�"
+dueDate = "Краен �рок"
+finalizeError = "�еу�пешно финализиране на �е�и�та"
+loadPdfError = "�еу�пешно зареждане на подпи�ан PDF"
+loadSignedPdf = "Зареди подпи�ани� PDF в активните файлове"
+messageLabel = "Съобщение"
+noAdditionalInfo = "��ма допълнителна информаци�"
+owner = "Соб�твеник"
+participantRemoved = "Уча�тникът е премахнат"
+participants = "Уча�тници"
+participantsAdded = "Уча�тниците �а добавени у�пешно"
+removeParticipant = "Премахни"
+removeParticipantError = "�еу�пешно премахване на уча�тник"
+selectUsers = "Изберете потребители..."
+sessionInfo = "Информаци� за �е�и�та"
+workbenchTitle = "Управление на �е�и�та"
+
+[certSign.collab.signRequest]
+addedToFiles = "Документът е добавен към активните файлове"
+addSignature = "Добави �во� подпи�"
+addToFiles = "Добави към активни файлове"
+advancedSettings = "Разширени на�тройки"
+backToList = "�азад към за�вките за подпи�ване"
+certificateChoice = "Изберете �ертификат, � който да подпишете"
+changeSignature = "Промени подпи�а"
+clearSignature = "Изчи�ти подпи�а"
+completeAndSign = "Завърши и подпиши"
+createNewSignature = "Създай нов подпи�"
+declineButton = "Откажи"
+decline = "Откажи за�вката"
+deleteSelected = "Изтрий избрани� подпи�"
+drawSignature = "�ари�увайте �во� подпи� по-долу"
+dueDate = "Краен �рок"
+fileTooLarge = "Размерът на файла тр�бва да е под 5MB"
+fontFamily = "Семей�тво шрифтове"
+fontSize = "Размер на шрифта: {{size}}px"
+fontSizePlaceholder = "Размер"
+from = "От"
+invalidCertFile = "Мол�, изберете P12 или PFX файл �ъ� �ертификат"
+invalidFileType = "Мол�, изберете файл � изображение"
+location = "Ме�тоположение (незадължително)"
+locationPlaceholder = "Откъде подпи�вате?"
+message = "Съобщение"
+noCertificate = "Мол�, изберете файл �ъ� �ертификат"
+noSignatures = "Мол�, по�тавете поне един подпи� върху PDF файла"
+p12File = "P12/PFX файл �ъ� �ертификат"
+password = "Парола за �ертификат"
+passwordPlaceholder = "Въведете парола..."
+penColor = "Цв�т на пи�алката"
+penSize = "Размер на пи�алката: {{size}}px"
+placementActive = "Щракнете върху PDF, за да по�тавите"
+placeSignatureButton = "По�тави подпи� върху PDF"
+reason = "Причина (незадължително)"
+reasonPlaceholder = "Защо подпи�вате?"
+removeImage = "Премахни изображението"
+removeCertFile = "Премахни файла"
+savedSignatures = "Запи�ани подпи�и"
+selectFile = "Изберете файл � изображение"
+selectSignatureTitle = "Изберете или �ъздайте подпи�"
+signButton = "Подпиши документа"
+signatureInfo = "Тези на�тройки �е задават от �об�твеника на документа"
+signaturePlaced = "Подпи�ът е по�тавен на �траница"
+signatureSettings = "�а�тройки на подпи�а"
+signatureText = "Тек�т на подпи�а"
+signatureTextPlaceholder = "Въведете вашето име..."
+signatureTypeLabel = "Тип на подпи�а"
+signingTitle = "Подпи�ване"
+textColor = "Цв�т на тек�та"
+typeSignature = "Въведете името �и, за да �ъздадете подпи�"
+uploadCert = "Потребител�ки �ертификат"
+uploadCertDesc = "Използвайте �вой P12/PFX �ертификат"
+uploadSignature = "Качете изображение на подпи�а �и"
+usePersonalCert = "Личен �ертификат"
+usePersonalCertDesc = "�втоматично генериран за ваши� акаунт"
+useServerCert = "Сертификат на организаци�та"
+useServerCertDesc = "Споделен организационен �ертификат"
+workbenchTitle = "За�вка за подпи�ване"
+
+[certSign.collab.signRequest.canvas]
+colorPickerTitle = "Изберете цв�т на щриха"
+continue = "Продължи"
+
+[certSign.collab.signRequest.certModal]
+description = "По�тавили �те {{count}} подпи�(а). Изберете �ертификат, за да завършите подпи�ването."
+sign = "Подпиши документа"
+certValidating = "Проверка на �ертификата..."
+certValidUntil = "Сертификатът е валиден до {{date}}"
+certInvalid = "Сертификатът е невалиден: {{error}}"
+certInvalidFallback = "�евалиден �ертификат"
+certNetworkError = "�е можа да �е валидира �ертификатът"
+title = "Конфигуриране на �ертификат"
+
+[certSign.collab.signRequest.image]
+hint = "Качете PNG или JPG изображение на ваши� подпи�"
+
+[certSign.collab.signRequest.mode]
+move = "Преме�ти подпи�а"
+place = "По�тави подпи�"
+title = "Режим подпи�ване или преме�тване"
+
+[certSign.collab.signRequest.modeTabs]
+draw = "Ри�уване"
+image = "Качване"
+text = "Въвеждане"
+
+[certSign.collab.signRequest.placeSignature]
+message = "Щракнете върху PDF, за да по�тавите подпи�а �и"
+title = "По�тави подпи�"
+
+[certSign.collab.signRequest.preview]
+imageAlt = "Избрани�т подпи�"
+missing = "��ма визуализаци�"
+textFallback = "Подпи�"
+
+[certSign.collab.signRequest.saved]
+defaultCanvasLabel = "Ри�уван подпи�"
+defaultImageLabel = "Качен подпи�"
+defaultLabel = "Подпи�"
+defaultTextLabel = "Въведен подпи�"
+delete = "Изтрий подпи�а"
+none = "��ма запи�ани подпи�и"
+
+[certSign.collab.signRequest.signatureType]
+draw = "Ри�уване"
+type = "Въвеждане"
+upload = "Качване"
+
+[certSign.collab.signRequest.steps]
+back = "�азад"
+cancelPlacement = "Отмени по�тав�нето"
+certificate = "Сертификат"
+clickMultipleTimes = "Щракнете върху PDF н�колко пъти, за да по�тавите подпи�и. Плъзнете който и да е подпи�, за да го преме�тите или оразмерите."
+clickToPlace = "Щракнете върху PDF, където желаете да �е по�ви подпи�ът ви."
+continue = "Продължи към избора на �ертификат"
+continueToPlacement = "Продължи към по�тав�не"
+continueToReview = "Продължи към преглед"
+createSignature = "Създай подпи�"
+invisible = "�евидим"
+location = "Ме�тоположение:"
+multipleSignatures = "{{count}} подпи�(а) ще бъдат приложени към PDF файла"
+oneSignature = "1 подпи� ще бъде приложен към PDF файла"
+placeOnPdf = "По�тави върху PDF"
+reason = "Причина:"
+reviewTitle = "Преглед преди подпи�ване"
+signaturePlaced = "Подпи�ът е по�тавен на �траница {{page}}. Можете да коригирате позици�та � ново щракване или да продължите към преглед."
+visible = "Видим"
+visibility = "Видимо�т:"
+yourSignatures = "Вашите подпи�и ({{count}})"
+
+[certSign.collab.signRequest.text]
+colorLabel = "Цв�т"
+fontLabel = "Шрифт"
+fontSizeLabel = "Размер"
+fontSizePlaceholder = "16"
+label = "Тек�т на подпи�а"
+modalHint = "Въведете името �и, �лед това нати�нете „Продължи“, за да го по�тавите върху PDF."
+placeholder = "Въведете вашето име..."
+
+[certSign.collab.participant]
+certValidating = "Проверка на �ертификата..."
+certValid = "✓ Сертификатът е валиден"
+certValidUntil = " до {{date}}"
+certInvalid = "✗ {{error}}"
+certInvalidFallback = "�евалиден �ертификат"
+certNetworkError = "�е можа да �е валидира �ертификатът"
+
+[certSign.collab.addParticipants]
+add = "Добави {{count}} уча�тник(а)"
+back = "�азад"
+configureSignatures = "Конфигурирай на�тройките на подпи�а"
+continue = "Продължи към на�тройките на подпи�а"
+reasonHelp = "Предварително задайте причина за подпи�ване за тези уча�тници (незадължително; могат да � промен�т при подпи�ване)"
+reasonPlaceholder = "напр. Одобрение, Преглед..."
+selectUsers = "Изберете потребители"
+
+[certSign.collab.sessionCreation]
+includeSummaryPage = "Включи �траница � обобщение на подпи�ите"
+includeSummaryPageHelp = "В кра� ще бъде добавена обобщаваща �траница � в�ички метаданни за подпи�ите. Полетата за цифров �ертификат на отделните �траници ще бъдат �крити (ръчните подпи�и не �е за��гат)."
+
+[certSign.collab.sessionList]
+active = "�ктивни"
+finalized = "Финализирани"
+
+[certSign.collab.signatureSettings]
+description = "Конфигурирайте как ще изглеждат подпи�ите за в�ички уча�тници"
+title = "Външен вид на подпи�а"
+
+[certSign.collab.userSelector]
+inviteUsers = "Добави потребители"
+loadError = "�еу�пешно зареждане на потребители"
+noTeam = "Без екип"
+noUsers = "�е �а намерени други потребители."
+placeholder = "Изберете потребители..."
+
+[certSign.mobile]
+panelActions = "Дей�тви�"
+panelDocument = "Документ"
+panelPeople = "Хора"
+
+[certSign.sessions]
+deleted = "Се�и�та е изтрита"
+fetchFailed = "�еу�пешно зареждане на подробно�ти за �е�и�та"
+finalized = "Се�и�та е финализирана"
+loaded = "Подпи�ани�т PDF е зареден"
+pdfNotReady = "PDF не е готов"
+pdfNotReadyDesc = "Подпи�ани�т PDF �е генерира. Опитайте отново �лед малко."
+
+[certificateChoice.tooltip]
+header = "Видове �ертификати"
+
+[certificateChoice.tooltip.organization]
+bullet1 = "Управл�ван от �и�темни админи�тратори"
+bullet2 = "Сподел�н между оторизирани потребители"
+bullet3 = "Пред�тавл�ва идентично�тта на компани�та, а не на индивида"
+bullet4 = "�ай-подход�щ за: Официални документи, екипни подпи�и"
+description = "Споделен �ертификат, предо�тавен от вашата организаци�. Използва �е за подпи�ване от името на компани�та."
+title = "Сертификат на организаци�та"
+
+[certificateChoice.tooltip.personal]
+bullet1 = "Генерира �е автоматично при първа употреба"
+bullet2 = "Привързан към ваши� потребител�ки акаунт"
+bullet3 = "�е може да �е �подел� � други потребители"
+bullet4 = "�ай-подход�щ за: Лични документи, индивидуална отговорно�т"
+description = "�втоматично генериран �ертификат, уникален за ваши� акаунт. Подход�щ за индивидуални подпи�и."
+title = "Личен �ертификат"
+
+[certificateChoice.tooltip.upload]
+bullet1 = "Изи�ква P12/PFX файл и парола"
+bullet2 = "Може да бъде издаден от външни �ертифициращи органи"
+bullet3 = "По-ви�око ниво на доверие за правни документи"
+bullet4 = "�ай-подход�щ за: Правно обвързващи договори, външна валидаци�"
+description = "Използвайте �об�твен PKCS#12 �ертификатен файл. О�игур�ва пълен контрол върху �вой�твата на �ертификата."
+title = "Качване на потребител�ки P12"
+
 [changeCreds]
 changePassword = "Използвате идентификационни данни за вход по подразбиране. Мол�, въведете нова парола"
 changeUsername = "�ктуализирайте потребител�кото �и име. След актуализиране ще бъдете изведени от профила."
@@ -3242,6 +3531,46 @@ totalSelected = "Общо избрани"
 unsupported = "�еподдържано"
 unzip = "Разархивирай"
 uploadError = "�еу�пешно качване на н�кои файлове."
+copyCreated = "Копието е запи�ано на това у�трой�тво."
+copyFailed = "�е можа да �е �ъздаде копие."
+leaveShare = "Премахни от мо� �пи�ък"
+leaveShareFailed = "�е можа да �е премахне �поделени�т файл."
+leaveShareSuccess = "Премахнато от ваши� �поделен �пи�ък."
+removeBoth = "Премахни и от двете"
+removeFilePrompt = "Този файл е запи�ан на това у�трой�тво и на ваши� �ървър. Откъде и�кате да го премахнете?"
+removeFileTitle = "Премахване на файл"
+removeLocalOnly = "Само на това у�трой�тво"
+removeServerFailed = "�е можа да �е премахне файлът от �ървъра."
+removeServerOnly = "Само от �ървъра"
+removeServerOnlyPrompt = "Този файл �е �ъхран�ва �амо на ваши� �ървър. И�кате ли да го премахнете от �ървъра?"
+removeServerSuccess = "Премахнат от �ървъра."
+removeSharedPrompt = "Този файл е �поделен � ва�. Можете да го премахнете от това у�трой�тво или от ваши� �поделен �пи�ък."
+removeSharedServerOnlyBlockedPrompt = "Този файл е �поделен � ва� и �е �ъхран�ва �амо на �ървъра."
+removeSharedServerOnlyPrompt = "Този файл е �поделен � ва� и �е �ъхран�ва �амо на �ървъра. Да бъде ли премахнат от ваши� �пи�ък?"
+changesNotUploaded = "Промените не �а качени"
+cloudFile = "Файл в облака"
+filterAll = "В�ички"
+filterLocal = "Локални"
+filterSharedByMe = "Споделени от мен"
+filterSharedWithMe = "Споделени � мен"
+lastSynced = "По�ледно �инхронизирано"
+localOnly = "Само локално"
+makeCopy = "Създай копие"
+owner = "Соб�твеник"
+ownerUnknown = "�епознат"
+share = "Сподели"
+shareSelected = "Сподели избраните"
+sharedByYou = "Споделено от ва�"
+sharedEditNoticeBody = "��мате права за редактиране на �ървърната вер�и� на този файл. В�ички промени, които направите, ще бъдат запи�ани като локално копие."
+sharedEditNoticeConfirm = "Разбрах"
+sharedEditNoticeTitle = "Сървърното копие е �амо за четене"
+sharedWithYou = "Споделено � ва�"
+sharing = "Сподел�не"
+storageState = "Съхранение"
+synced = "Синхронизирано"
+updateOnServer = "�ктуализирай на �ървъра"
+uploadSelected = "Качи избраните"
+uploadToServer = "Качи на �ървъра"
 
 [files]
 addFiles = "Добав�не на файлове"
@@ -3367,6 +3696,77 @@ title = "За �пле�кването на PDF"
 discord = "Discord"
 issues = "GitHub"
 
+[groupSigning.tooltip]
+header = "За груповото подпи�ване"
+
+[groupSigning.tooltip.finalization]
+bullet1 = "В�ички подпи�и �е прилагат в определени� от ва� ред на уча�тниците"
+bullet2 = "При нужда можете да финализирате � ча�т от подпи�ите"
+bullet3 = "След финализиране �е�и�та не може да бъде промен�на"
+description = "След като в�ички уча�тници подпишат (или изберете ранно финализиране), можете да генерирате крайни� подпи�ан PDF."
+title = "Проце� на финализиране"
+
+[groupSigning.tooltip.roles]
+bullet1 = "Соб�твеник (вие): Създава �е�и�, конфигурира на�тройки по подразбиране, финализира документа"
+bullet2 = "Уча�тници: Създават �во� подпи�, избират �ертификат, по�тав�т го върху PDF"
+bullet3 = "Уча�тниците не могат да промен�т на�тройките за видимо�т, причина или ме�тоположение на подпи�а"
+description = "Вие контролирате на�тройките за външен вид на подпи�ите за в�ички уча�тници."
+title = "Роли на уча�тниците"
+
+[groupSigning.tooltip.sequential]
+bullet1 = "Първи�т уча�тник тр�бва да подпише, преди втори�т да получи до�тъп до документа"
+bullet2 = "Гарантира правилен ред на подпи�ване за правно �ъответ�твие"
+bullet3 = "Можете да пренареждате уча�тниците чрез плъзгане в �пи�ъка"
+description = "Уча�тниците подпи�ват документите в по�очени� от ва� ред. В�еки подпи�ващ получава изве�тие, когато му дойде редът."
+title = "По�ледователно подпи�ване"
+
+[groupSigning.steps]
+back = "�азад"
+completed = "Завършено"
+current = "Текущо"
+stepLabel = "Стъпка {{number}}"
+
+[groupSigning.steps.configureDefaults]
+continue = "Продължи към преглед"
+invisible = "Подпи�ите ще бъдат невидими (�амо метаданни)"
+locationLabel = "Ме�тоположение:"
+preview = "Визуализаци�"
+reasonLabel = "Причина:"
+title = "Конфигурирай на�тройките на подпи�а"
+visible = "Подпи�ите ще �а видими на �траница {{page}}"
+
+[groupSigning.steps.review]
+document = "Документ"
+dueDate = "Краен �рок (незадължително)"
+dueDatePlaceholder = "Изберете краен �рок..."
+invisible = "�евидими (�амо метаданни)"
+location = "Ме�тоположение:"
+logo = "Лого:"
+logoHidden = "Без лого"
+logoShown = "Показано е логото на Stirling PDF"
+participants = "Уча�тници"
+reason = "Причина:"
+send = "Изпрати за�вки за подпи�ване"
+signatureSettings = "�а�тройки на подпи�а"
+title = "Преглед на подробно�тите за �е�и�та"
+titleShort = "Преглед и изпращане"
+visibility = "Видимо�т:"
+visible = "Видими на �траница {{page}}"
+participantCount = "{{count}} уча�тник(а) ще подпи�ват по�ледователно"
+
+[groupSigning.steps.selectDocument]
+continue = "Продължи към избор на уча�тници"
+noFile = "Мол�, изберете един PDF файл от активните �и файлове, за да �ъздадете �е�и� за подпи�ване."
+selectedFile = "Избран документ"
+title = "Избери документ"
+
+[groupSigning.steps.selectParticipants]
+continue = "Продължи към на�тройките на подпи�а"
+count = "Избрани �а {{count}} уча�тник(а)"
+label = "Изберете уча�тници"
+placeholder = "Изберете уча�тници за подпи�..."
+title = "Изберете уча�тници"
+
 [getPdfInfo]
 downloadJson = "Изтеглете JSON"
 downloads = "Изтегл�ни�"
@@ -4460,7 +4860,10 @@ zoomOut = "�амали"
 
 [viewer]
 cannotPreviewFile = "�е може да �е визуализира файлът"
+disableColorFilter = "Изключи цветови филтър"
 dualPageView = "Изглед: две �траници"
+enableDarkFilter = "Включи тъмен филтър"
+enableSepiaFilter = "Включи �епи� филтър"
 firstPage = "Първа �траница"
 lastPage = "По�ледна �траница"
 nextPage = "Следваща �траница"
@@ -4470,6 +4873,22 @@ singlePageView = "Изглед: една �траница"
 unknownFile = "�епознат файл"
 zoomIn = "Увеличи"
 zoomOut = "�амали"
+resetZoom = "�улирай мащаба"
+
+[viewer.nonPdf]
+fileTypeBadge = "{{type}} файл"
+convertToPdf = "Конвертирай в PDF"
+loading = "Зареждане..."
+emptyFile = "Празен файл"
+csvStats = "{{rows}} реда · {{columns}} колони · {{size}}"
+sortedBy = "Сортирано по: {{column}}"
+columnDefault = "Колона {{index}}"
+htmlPreviewWarning = "HTML визуализаци� — външните ре�ур�и може да не �е заред�т · {{size}}"
+htmlPreview = "HTML визуализаци�"
+invalidJson = "�евалиден JSON — показване на �уровото �ъдържание"
+textStats = "{{lines}} реда · {{size}}"
+lineNumbers = "�омера на редовете"
+renderMarkdown = "Рендерирай Markdown"
 
 [viewer.attachments]
 title = "Прикачени файлове"
@@ -4531,6 +4950,7 @@ toggleAttachments = "Превключване на прикачени файло
 toggleTheme = "Превключи тема"
 language = "Език"
 toggleAnnotations = "Показване/�криване на анотациите"
+toggleLayers = "Превключи �лоеве"
 search = "Тър�ене в PDF"
 panMode = "Режим на придвижване"
 applyRedactionsFirst = "Първо приложете заличавани�та"
@@ -5407,20 +5827,72 @@ title = "Печат на файл"
 2 = "Въведете име на принтер"
 
 [quickAccess]
+access = "До�тъп"
+accessAddPerson = "Добави още човек"
+accessBack = "�азад"
+accessCopyLink = "Копирай връзка"
+accessEmail = "Имейл адре�"
+accessEmailPlaceholder = "name@company.com"
+accessFileLabel = "Файл"
+accessGeneral = "Общ до�тъп"
+accessInviteTitle = "Покани хора"
+accessOwner = "Соб�твеник"
+accessPanel = "До�тъп до документа"
+accessPeople = "Хора � до�тъп"
+accessRemove = "Премахни"
+accessRestricted = "Ограничен"
+accessRestrictedHint = "Само хора � до�тъп могат да отвар�т"
+accessRole = "Рол�"
+accessRoleCommenter = "Коментатор"
+accessRoleEditor = "Редактор"
+accessRoleViewer = "Преглеждащ"
+accessSelectedFile = "Избран файл"
+accessSendInvite = "Изпрати покана"
+accessTitle = "До�тъп до документа"
+accessYou = "Вие"
 account = "�каунт"
+activeSessions = "�ктивни �е�ии"
+activeTab = "�ктивни"
 activity = "Дейно�т"
 adminSettings = "�дмин опции"
+allSessions = "В�ички �е�ии"
 allTools = "All Tools"
 automate = "�вто"
+back = "�азад"
+certSign = "Подпи� �ъ� �ертификат"
+completedSessions = "Завършени �е�ии"
+completedTab = "Завършени"
 config = "Конфиг"
+createNew = "Създай нова за�вка"
+createSession = "Създай за�вка за подпи�ване"
+dueDate = "Краен �рок (незадължително)"
 files = "Файлове"
 help = "Помощ"
+noActiveSessions = "��ма чакащи за�вки за подпи�ване или активни �е�ии"
+noCompletedSessions = "��ма завършени �е�ии"
+noFile = "��ма избран файл"
 read = "Четене"
 reader = "Четец"
+refresh = "Опре�ни"
+requestSignatures = "За�ви подпи�и"
+selectSingleFileToRequest = "Изберете един PDF файл, за да пои�кате подпи�и"
+selectedFile = "Избран файл"
+selectUsers = "Изберете потребители за подпи�"
+selectUsersPlaceholder = "Изберете уча�тници..."
+sendingRequest = "Изпращане..."
 settings = "Опции"
 showMeAround = "Покажете ми наоколо"
 sign = "Подпи�"
+signatureRequests = "За�вки за подпи�ване"
+signYourself = "Подпишете �ами"
+newRequest = "�ова за�вка"
 tours = "Турове"
+wetSign = "Добави подпи�"
+filterMine = "Моите"
+filterOverdue = "Про�рочени"
+filterSigned = "Подпи�ано"
+filterDeclined = "Отказано"
+searchDocuments = "Тър�ене в документи…"
 
 [quickAccess.helpMenu]
 adminTour = "Обиколка за админи"
@@ -6050,11 +6522,75 @@ toolNotAvailableLocally = "Ваши�т Stirling-PDF �ървър е офлай
 expired = "Вашата �е�и� е изтекла. Мол�, опре�нете �траницата и опитайте отново."
 refreshPage = "Презареждане на �траницата"
 
+[sessionManagement.tooltip]
+header = "Управление на �е�иите за подпи�ване"
+
+[sessionManagement.tooltip.addParticipants]
+bullet1 = "�овите уча�тници �е добав�т в кра� на реда за подпи�ване"
+bullet2 = "�е могат да �е добав�т уча�тници �лед финализиране на �е�и�та"
+bullet3 = "В�еки уча�тник получава изве�тие, когато му дойде редът"
+description = "Можете да добав�те още уча�тници към активна �е�и� по в��ко време преди финализиране."
+title = "Добав�не на уча�тници"
+
+[sessionManagement.tooltip.finalization]
+bullet1 = "<b>Пълно финализиране</b>: В�ички уча�тници �а подпи�али"
+bullet2 = "<b>Ча�тично финализиране</b>: ��кои уча�тници в�е още не �а подпи�али"
+bullet3 = "�еподпи�алите уча�тници ще бъдат изключени от крайни� документ"
+bullet4 = "След финализиране можете да заредите подпи�ани� PDF в активните файлове"
+description = "Финализирането комбинира в�ички подпи�и в един подпи�ан PDF. Това дей�твие не може да бъде отменено."
+title = "Финализиране на �е�и�"
+
+[sessionManagement.tooltip.participantRemoval]
+bullet1 = "�е могат да бъдат премахнати уча�тници, които вече �а подпи�али"
+bullet2 = "Премахнатите уча�тници повече н�ма да получават изве�ти�"
+bullet3 = "Редът за подпи�ване �е коригира автоматично"
+description = "Уча�тниците могат да бъдат премахнати от �е�ии преди да подпишат."
+title = "Премахване на уча�тници"
+
+[sessionManagement.tooltip.signatureOrder]
+bullet1 = "В�еки подпи� �е прилага по�ледователно върху PDF"
+bullet2 = "По-къ�ните подпи�ващи виждат по-ранните подпи�и"
+bullet3 = "Критично за проце�и по одобрение и правни вериги на отговорно�т"
+description = "Редът, който по�очвате при �ъздаване на �е�и�та, определ� кой подпи�ва първи."
+title = "Ред на подпи�ите"
+
+[signatureSettings.tooltip]
+header = "�а�тройки за външен вид на подпи�а"
+
+[signatureSettings.tooltip.location]
+bullet1 = "Примери: \"New York, USA\", \"London Office\", \"Remote\""
+bullet2 = "�е е �ъщото като позици� на �траницата"
+bullet3 = "Може да �е изи�ква в определени юридиче�ки юри�дикции"
+description = "�езадължително географ�ко ме�тоположение, където е приложен подпи�ът. Съхран�ва �е в метаданните на �ертификата."
+title = "Ме�тоположение на подпи�а"
+
+[signatureSettings.tooltip.logo]
+bullet1 = "Показва �е заедно � подпи�а и тек�та"
+bullet2 = "Поддържа формати PNG, JPG"
+bullet3 = "Подобр�ва профе�ионални� вид"
+description = "Добавете фирмено лого към видимите подпи�и за брандиране и автентично�т."
+title = "Фирмено лого"
+
+[signatureSettings.tooltip.reason]
+bullet1 = "Примери: \"Approval\", \"Contract Agreement\", \"Review Complete\""
+bullet2 = "Видимо в �вой�твата на подпи�а в PDF"
+bullet3 = "Полезно за одит и �ъответ�твие"
+description = "�езадължителен тек�т, об��н�ващ защо документът �е подпи�ва. Съхран�ва �е в метаданните на �ертификата."
+title = "Причина за подпи�ване"
+
+[signatureSettings.tooltip.visibility]
+bullet1 = "<b>Видим</b>: Подпи�ът �е показва в PDF � пер�онализиран вид"
+bullet2 = "<b>�евидим</b>: Сертификатът е вграден без видима маркировка"
+bullet3 = "�евидимите подпи�и пак о�игур�ват криптограф�ка валидаци�"
+description = "Контролира дали подпи�ът е видим върху документа или е вграден невидимо."
+title = "Видимо�т на подпи�а"
+
 [settings.configuration]
 advanced = "Разширени"
 database = "База данни"
 endpoints = "Крайни точки"
 features = "Функции"
+storageSharing = "Съхранение на файлове и �подел�не"
 systemSettings = "Си�темни на�тройки"
 title = "Конфигураци�"
 
@@ -6332,10 +6868,13 @@ title = "Впишете �е в Stirling"
 [setup.selfhosted]
 link = "или �е �вържете �ъ� �амо�то�телно хо�тван акаунт"
 subtitle = "Въведете �воите данни за �ървъра"
+changeServerLocked = "Вашата организаци� е ограничила това приложение до конкретен �ървър"
 switchToLocal = "Използване на локалните ин�трументи"
 title = "Впишете �е в �ървъра"
 
 [setup.selfhosted.unreachable]
+changeServer = "Свържете �е � друг �ървър"
+changeServerLocked = "Вашата организаци� е ограничила това приложение до конкретен �ървър"
 continueOffline = "Използване на локалните ин�трументи"
 message = "�е може да �е о�ъще�тви до�тъп до {{url}}. Проверете дали �ървърът работи и е до�тъпен."
 retry = "Повторен опит"
@@ -6529,6 +7068,15 @@ saved = "Запазени"
 text = "Тек�т"
 title = "Тип подпи�"
 
+[signRequest]
+declined = "За�вката за подпи�ване е отказана"
+fetchFailed = "�еу�пешно зареждане на за�вката за подпи�ване"
+signed = "Документът е подпи�ан у�пешно"
+
+[signSession]
+createFailed = "�еу�пешно �ъздаване на за�вка за подпи�ване"
+created = "За�вката за подпи�ване е изпратена"
+
 [signup]
 accountCreatedSuccessfully = "�каунтът е �ъздаден у�пешно! Сега можете да влезете."
 alreadyHaveAccount = "Вече имате акаунт? Вход"
@@ -6807,6 +7355,106 @@ title = "Разделете PDF по глави"
 [splitPdfByChapters]
 tags = "раздел�не, глави, отметки, организиране"
 
+[storageShare]
+accessed = "До�тъпено"
+accessDenied = "��мате до�тъп до този �поделен файл. Помолете �об�твеника да го �подели � ва�."
+accessFailed = "�еу�пешно зареждане на активно�тта."
+accessDeniedBody = "��мате до�тъп до този файл. Помолете �об�твеника да го �подели � ва�."
+accessDeniedTitle = "��ма до�тъп"
+accessLimitedCommenter = "До�тъпът за коментиране �коро ще бъде наличен. Помолете �об�твеника за до�тъп като редактор, ако тр�бва да изтеглите."
+accessLimitedTitle = "Ограничен до�тъп"
+accessLimitedViewer = "Тази връзка е �амо за преглед. Помолете �об�твеника за до�тъп като редактор, ако тр�бва да изтеглите."
+createdAt = "Създадено"
+download = "Изтегли"
+downloadFailed = "Файлът не може да бъде изтеглен."
+expiredBody = "Тази връзка за �подел�не е невалидна или е изтекла."
+expiredTitle = "Връзката е изтекла"
+goToLogin = "Към вход"
+loadFailed = "�еу�пешно отвар�не на �поделен файл."
+loading = "Зареждане на връзка за �подел�не..."
+loginPrompt = "Впишете �е, за да получите до�тъп до този �поделен файл."
+loginRequired = "�еобходим е вход"
+openInApp = "Отвори в Stirling PDF"
+ownerLabel = "Соб�твеник"
+ownerUnknown = "�епознат"
+requiresLogin = "Този �поделен файл изи�ква вход."
+roleCommenter = "Коментатор"
+roleEditor = "Редактор"
+roleViewer = "Преглеждащ"
+shareHeading = "Споделен файл"
+titleDefault = "Споделен файл"
+tryAgain = "Мол�, опитайте отново по-къ�но."
+addUser = "Добави"
+commenterHint = "Коментирането �коро ще бъде налично."
+copied = "Връзката е копирана в клипборда"
+copy = "Копирай"
+copyFailed = "Копирането не бе у�пешно"
+description = "Създайте връзка за �подел�не за този файл. Впи�аните потребители � връзката ще имат до�тъп."
+downloadsCount = "Изтегл�ни�: {{count}}"
+emailWarningBody = "Изглежда като имейл адре�. �ко този човек не е потребител на Stirling PDF, н�ма да може да получи до�тъп до файла."
+emailWarningConfirm = "Сподели въпреки това"
+emailWarningTitle = "Имейл адре�"
+errorTitle = "�еу�пешно �подел�не"
+failure = "�е може да �е генерира връзка за �подел�не. Мол�, опитайте отново."
+fileLabel = "Файл"
+generate = "Генерирай връзка"
+generated = "Генерирана е връзка за �подел�не"
+hideActivity = "Скрий активно�тта"
+invalidUsername = "Въведете валидно потребител�ко име или имейл адре�."
+lastAccessed = "По�леден до�тъп"
+linkAccessTitle = "До�тъп чрез връзка за �подел�не"
+linkLabel = "Връзка за �подел�не"
+linksDisabled = "Връзките за �подел�не �а деактивирани."
+linksDisabledBody = "Връзките за �подел�не �а деактивирани от на�тройките на ваши� �ървър."
+manage = "Управление на �подел�нето"
+manageDescription = "Създавайте и управл�вайте връзки за �подел�не на този файл."
+manageLoadFailed = "�еу�пешно зареждане на връзките за �подел�не."
+manageTitle = "Управление на �подел�нето"
+noActivity = "В�е още н�ма активно�т."
+noLinks = "В�е още н�ма активни връзки за �подел�не."
+noSharedUsers = "В�е още н�ма потребители � до�тъп."
+removeLink = "Премахни връзката"
+removeUser = "Премахни"
+revokeFailed = "�е можа да �е премахне връзката за �подел�не."
+revoked = "Връзката за �подел�не е премахната"
+roleLabel = "Рол�"
+sharingDisabled = "Сподел�нето е деактивирано."
+sharingDisabledBody = "Сподел�нето е деактивирано от на�тройките на ваши� �ървър."
+sharedUsersTitle = "Потребители �ъ� �поделен до�тъп"
+title = "Сподел�не на файл"
+unknownUser = "�еизве�тен потребител"
+userAddFailed = "�е може да �е �подели � този потребител."
+userAdded = "Потребител�т е добавен към �пи�ъка за �подел�не."
+usernameLabel = "Потребител�ко име или имейл"
+usernamePlaceholder = "Въведете потребител�ко име или имейл"
+userRemoveFailed = "�е може да �е премахне този потребител."
+userRemoved = "Потребител�т е премахнат от �пи�ъка за �подел�не."
+viewActivity = "Преглед на активно�тта"
+viewed = "Прегледано"
+viewsCount = "Прегледи: {{count}}"
+downloaded = "Изтеглено"
+bulkDescription = "Създайте една връзка за �подел�не на в�ички избрани файлове � влезли в �и�темата потребители."
+bulkTitle = "Сподел�не на избраните файлове"
+copyLink = "Копиране на връзката за �подел�не"
+fileCount = "{{count}} избрани файла"
+ownerOnly = "Само �об�твеникът може да управл�ва �подел�нето."
+selectSingleFile = "Изберете един файл, за да управл�вате �подел�нето."
+
+[storageUpload]
+description = "Това качва текущи� файл в �ървърното хранилище за ваш до�тъп."
+errorTitle = "�еу�пешно качване"
+failure = "Качването не бе у�пешно. Мол�, проверете данните �и за вход и на�тройките за �ъхранение."
+fileLabel = "Файл"
+hint = "Публичните връзки и режимите за до�тъп �е контролират от на�тройките на ваши� �ървър."
+success = "Качено на �ървъра"
+title = "Качване на �ървъра"
+updateButton = "�ктуализиране на �ървъра"
+uploadButton = "Качване на �ървъра"
+bulkDescription = "Това качва избраните файлове в �ървърното ви хранилище."
+bulkTitle = "Качване на избраните файлове"
+fileCount = "{{count}} избрани файла"
+more = " +{{count}} още"
+
 [storage]
 approximateSize = "Приблизителен размер"
 fileTooLarge = "Файлът е твърде гол�м. Мак�имални�т размер на файл е"
@@ -7153,6 +7801,30 @@ title = "Преглед/Редактиране на PDF"
 [warning]
 tooltipTitle = "Предупреждение"
 
+[wetSignature.tooltip]
+header = "Методи за �ъздаване на подпи�"
+
+[wetSignature.tooltip.draw]
+bullet1 = "Пер�онализирайте цвета и дебелината на пи�алката"
+bullet2 = "Изтрийте и начертайте отново, докато �те доволни"
+bullet3 = "Работи на у�трой�тва � доко�ване (таблети, телефони)"
+description = "Създайте подпи� на ръка, използвайки мишка или �ензорен екран. �ай-подход�щ за лични, автентични подпи�и."
+title = "�ари�увайте подпи�"
+
+[wetSignature.tooltip.type]
+bullet1 = "Изберете от множе�тво шрифтове"
+bullet2 = "Пер�онализирайте размера и цвета на тек�та"
+bullet3 = "Идеално за �тандартизирани подпи�и"
+description = "Генерирайте подпи� от въведен тек�т. Бърз и по�ледователен, подход�щ за бизне� документи."
+title = "Въведете подпи�"
+
+[wetSignature.tooltip.upload]
+bullet1 = "Поддържа PNG, JPG и други формати на изображени�"
+bullet2 = "Препоръчват �е прозрачни фонове за най-добри резултати"
+bullet3 = "Изображението ще бъде преоразмерено, за да па�не в обла�тта за подпи�"
+description = "Качете предварително �ъздадено изображение на подпи�. Идеално, ако имате �каниран подпи� или фирмено лого."
+title = "Качване на изображение на подпи�"
+
 [watermark]
 completed = "Добавен е воден знак"
 desc = "Добав�не на тек�тови или изображени водни знаци към PDF файлове"
@@ -7333,6 +8005,7 @@ activeSession = "�ктивна �е�и�"
 addMembers = "Добав�не на членове"
 admin = "�дмин"
 confirmDelete = "Сигурни ли �те, че и�кате да изтриете този потребител? Това дей�твие не може да бъде отменено."
+confirmUnlock = "Сигурни ли �те, че и�кате да отключите този потребител�ки акаунт?"
 deleteUser = "Изтрий потребител"
 deleteUserError = "�еу�пешно изтриване на потребител"
 deleteUserSuccess = "Потребител�т е изтрит у�пешно"
@@ -7341,6 +8014,8 @@ disable = "Деактивирай"
 disabled = "Деактивиран"
 editRole = "Редактиране на рол�"
 enable = "�ктивирай"
+locked = "заключен"
+lockedBadge = "Заключен"
 loading = "Зареждане на хора..."
 loginRequired = "Първо активирайте режима за вход"
 member = "Член"
@@ -7350,6 +8025,9 @@ searchMembers = "Тър�ене на членове..."
 status = "Стату�"
 team = "Екип"
 title = "Хора"
+unlockAccount = "Отключване на акаунт"
+unlockUserError = "�еу�пешно отключване на потребител�ки акаунт"
+unlockUserSuccess = "Потребител�ки�т акаунт е отключен у�пешно"
 user = "Потребител"
 
 [workspace.people.actions]
diff --git a/frontend/public/locales/bo-CN/translation.toml b/frontend/public/locales/bo-CN/translation.toml
index e284014a14..e611e0a324 100644
--- a/frontend/public/locales/bo-CN/translation.toml
+++ b/frontend/public/locales/bo-CN/translation.toml
@@ -8,6 +8,7 @@ black = "ནག་པོ"
 blue = "སྔོན་པོ"
 bored = "ཉོབ་སྣང་ས�ྱེད་པའི་སྒུག་བཟོ�"
 cancel = "འདོར་བ"
+confirm = "ག�ན་འ�ེལ"
 changedCredsMessage = "�ོ་འགོད་གནས་ཚུལ་བསྒྱུར་ཟིན�"
 chooseFile = "ཡིག་ཆ་འདེམས�"
 close = "སྒོ་རྒྱག"
@@ -146,6 +147,7 @@ insufficientCredits = "བཀོལ་གྲངས་མི་འདངས� 
 loadingCredits = "བཀོལ་གྲངས་ཞིབ་བཤེར..."
 loadingProStatus = "མངག་འདོན་གནས་སྟངས་ཞིབ་བཤེར..."
 noticeTopUpOrPlan = "བཀོལ་གྲངས་མི་འདངས� གྲངས་�་སྣོན་བྱེད ཡང་ན་འཆར་གཞི་སྤེལ་རོགས་"
+accessInvite = "མགྲོན་འབོད"
 
 [account]
 accountSettings = "རྩིས་�ྲ་སྒྲིག་སྟངས�"
@@ -1427,6 +1429,34 @@ title = "ལས་སྒྲུབ"
 description = "ལས་སྒྲུབ་ལས་ཀ་ཞིབ་བཤེར་བསྒུག་དགོས་པའི་དུས་ཚོད་མང་མ�འ�"
 label = "ལས་སྒྲུབ་དུས་ཚོད་�ོན་པ (ས�ར་ཆ)"
 
+[admin.settings.storage]
+description = "སར་བར་གསོག་འཇོག་དང་མཉམ་སྤྱོད་གདམ་ག་ཚོད་འཛིན�"
+title = "ཡིག་ཆའི་གསོག་འཇོག་དང་མཉམ་སྤྱོད"
+
+[admin.settings.storage.enabled]
+description = "མ�ོ་སྤྲོད་པས་སར་བར་དུ་ཡིག་ཆ་ཉར་ཚགས་བྱེད་ཆོག."
+label = "སར་བར་ཡིག་ཆ་ཉར་ཚགས་ལྕོགས་འགུལ"
+
+[admin.settings.storage.sharing.email]
+description = "གློག་འཕྲིན་གྲངས་འཛིན་དང་མཉམ་སྤྱོད་ཆོག."
+label = "གློག་འཕྲིན་མཉམ་སྤྱོད་ལྕོགས་འགུལ"
+mailLink = "ཡིག་འཕྲིན་སྒྲིག་འགོད"
+mailNote = "ཡིག་འཕྲིན་སྒྲིག་འགོད་དགོས� "
+
+[admin.settings.storage.sharing.enabled]
+description = "མ�ོ་སྤྲོད་པས་ཉར་ཚགས་ཡིག་ཆ་མཉམ་སྤྱོད་ཆོག."
+label = "མཉམ་སྤྱོད་ལྕོགས་འགུལ"
+
+[admin.settings.storage.sharing.links]
+description = "ནང་འཇུག་བྱས་པའི་འབྲེལ་�ག་བརྒྱུད་ནས་མཉམ་སྤྱོད་ཆོག."
+frontendUrlLink = "མ་ལག་སྒྲིག་འགོད་ནང་སྒྲིག"
+frontendUrlNote = "Frontend URL དགོས� "
+label = "མཉམ་སྤྱོད་འབྲེལ་�ག་ལྕོགས་འགུལ"
+
+[admin.settings.storage.signing.enabled]
+description = "མ�ོ་སྤྲོད་པས་མི་སྣ་མང་མཉམ་ཞུགས་ཀྱི་ཡིག་ཆ་མཛུབ་འགན་ལས་འ�ུར་བཟོ་ཆོག དགོས་ནས་སར་བར་ཡིག་ཆ་ཉར་ཚགས་ལྕོགས་འགུལ་ཡོད་དགོས་རེད�"
+label = "ཚོགས་མི་མཛུབ་འགན (Alpha) ལྕོགས་འགུལ"
+
 [admin.settings.unsavedChanges]
 cancel = "རྩོམ་སྒྲིག�"
 discard = "དཀའ་ངལ་གྱི་འགྱུར་བ�"
@@ -2059,7 +2089,19 @@ numbers = "ཨང་གྲངས�/�ྱབ་�ོངས�: ༥, ༡༠-༢
 progressions = "ཡར་རྒྱས� 3n, 4n+1"
 
 [certSign]
+allSigned = "ཞུགས་མ�ན་ཚང་མས་མཛུབ་འགན་བཀལ་ཟིན� མཇུག་བསྡུ་བཅས་ཡོད�"
+awaitingSignatures = "མཛུབ་འགན་བསྒུག་བཞིན"
+signatureProgress = "{{signedCount}}/{{totalCount}} མཛུབ་འགན"
 chooseCertificate = "ལག་འ�ྱེར་ཡིག་ཆ་འདེམས�"
+declined = "�ས་ལེན་མ་བྱས"
+fetchFailed = "མཛུབ་འགན་གནས་ཚུལ་འཇུག་མ་�ུབ"
+finalized = "མཇུག་བསྡུས"
+notified = "བསྒུག་བཞིན"
+partialNote = "ད་ལྟ་�ོབ་ཡོད་པའི་མཛུབ་འགན་དང་གཅིག་�ར་སྔོན་དུ་མཇུག་བསྡུ་ཆོག མཛུབ་འགན་མ་བཀལ་མི་ཚང་མ་བུ་ག�ོར་བྱེད�"
+pending = "བསྒུག་བཞིན"
+readyToFinalize = "མཇུག་བསྡུ་བཅས"
+signed = "མཛུབ་འགན་བཀལ་ཟིན"
+viewed = "ལྟ་ཞིབ་བྱས"
 chooseJksFile = "JKSཡིག་ཆ་འདེམས�"
 chooseP12File = "PKCS12ཡིག་ཆ་འདེམས�"
 choosePfxFile = "PFXཡིག་ཆ་འདེམས�"
@@ -2082,6 +2124,7 @@ title = "ལག་འ�ྱེར་མིང་རྟགས་བཀོད་
 invisible = "མི་མངོན་པ�"
 stepTitle = "མཚན་རྟགས་�ོན་ས�ྱེལ�"
 visible = "མངོན་ཤེས�"
+visibility = "མ�ོང་རུང་གནས"
 
 [certSign.appearance.options]
 title = "མཚན་རྟགས་ཞིབ་ཕྲ�"
@@ -2188,6 +2231,252 @@ bullet4 = "བདེན་དཔང་ཆེད་རང་སྒྲིག་ལ
 text = "�ྱེད་ཀྱིས་མིང་རྟགས་བརྟག་དཔྱད་བྱེད་ས�བས་ལག་ཆ་དེས་�ྱེད་ལ་དེ་དག་ནུས་ལྡན་ཡིན་མིན་དང་� ཡིག་ཆ་དེ་ལ་མིང་རྟགས་བཀོད་པ� མིང་རྟགས་བཀོད་པ�"
 title = "མཚན་རྟགས་ལ་ཞིབ་བཤེར་བྱེད་པ�"
 
+[certSign.collab.finalize]
+button = "མཇུག་བསྡུས་ནས་མཛུབ་འགན་PDF འཇུག"
+early = "དང་�ོག་མའི་མཛུབ་འགན་དང་གཅིག་�ར་མཇུག་བསྡུ"
+
+[certSign.collab.sessionDetail]
+addButton = "ཞུགས་མ�ན་�་སྣོན"
+addParticipants = "ཞུགས་མ�ན་�་སྣོན"
+addParticipantsError = "ཞུགས་མ�ན་�་སྣོན་ཕམ་པ"
+backToList = "ལས་འ�ུར་�ོར་ལོག"
+deleteConfirm = "ངེས་བརྟན་ཡིན་ནམ� བས�ྱར་མེད�"
+deleteError = "ལས་འ�ུར་བསུབ་མ་�ུབ"
+deleted = "ལས་འ�ུར་བསུབ་ཟིན"
+deleteSession = "ལས་འ�ུར་བསུབ"
+dueDate = "དུས་བཀག"
+finalizeError = "ལས་འ�ུར་མཇུག་བསྡུ་མ་�ུབ"
+loadPdfError = "མཛུབ་འགན་PDF འཇུག་མ་�ུབ"
+loadSignedPdf = "མཛུབ་འགན་PDF འགུལ་སྤྱོད་ཡིག་ཆ་ནང་འཇུག"
+messageLabel = "འཕྲིན་དོན"
+noAdditionalInfo = "ཟུར་དུ་གནས་ཚུལ་མེད"
+owner = "བདག་པོ"
+participantRemoved = "ཞུགས་མ�ན་བསུབ་ཟིན"
+participants = "ཞུགས་མ�ན"
+participantsAdded = "ཞུགས་མ�ན་�་སྣོན་བྱས་ཚར"
+removeParticipant = "བསུབ"
+removeParticipantError = "ཞུགས་མ�ན་བསུབ་མ་�ུབ"
+selectUsers = "མི་སྣ་འདེམས..."
+sessionInfo = "ལས་འ�ུར་གནས་ཚུལ"
+workbenchTitle = "ལས་འ�ུར་དོ་དམ"
+
+[certSign.collab.signRequest]
+addedToFiles = "ཡིག་ཆ་འགུལ་སྤྱོད་ཡིག་ཆར་�་སྣོན་བྱས་ཟིན"
+addSignature = "�ྱེད་ཀྱི་མཛུབ་འགན་�་སྣོན"
+addToFiles = "འགུལ་སྤྱོད་ཡིག་ཆར་�་སྣོན"
+advancedSettings = "མ�ོ་རིམ་སྒྲིག་འགོད"
+backToList = "མཛུབ་འགན་ཞུ་ག�ོང་�ོར་ལོག"
+certificateChoice = "མཛུབ་འགན་ལ་སྤྱོད་པའི་ལག་འ�ྱེར་འདེམས"
+changeSignature = "མཛུབ་འགན་བརྗེ"
+clearSignature = "མཛུབ་འགན་བསུབ"
+completeAndSign = "མཇུག་སྒྲིལ་དང་མཛུབ་འགན"
+createNewSignature = "མཛུབ་འགན་གསར་བ་བཟོ"
+declineButton = "�ས་ལེན་མ་བྱས"
+decline = "ཞུ་ག�ོང་�ས་ལེན་མ་བྱས"
+deleteSelected = "མཛུབ་འགན་འདེམས་པ་བསུབ"
+drawSignature = "མར་འོག་ལ་�ྱེད་ཀྱི་མཛུབ་འགན་འབྲི"
+dueDate = "དུས་བཀག"
+fileTooLarge = "ཡིག་ཆའི་ཆེ་ཆུང 5MB ལས་ཉུང་དགོས"
+fontFamily = "ཡིག་གཟུགས"
+fontSize = "ཡིག་གཟུགས་ཆེ་ཆུང: {{size}}px"
+fontSizePlaceholder = "ཆེ་ཆུང"
+from = "བརྒྱུད་ནས"
+invalidCertFile = "P12 ཡང་ན PFX ལག་འ�ྱེར་ཡིག་ཆ་འདེམས་རོགས�"
+invalidFileType = "པར་ཡིག་ཆ་འདེམས་རོགས�"
+location = "གནས་ཡུལ (གདམ་�)"
+locationPlaceholder = "�ྱེད་ཀྱིས་ག་པར་མཛུབ་འགན་བཀལ?"
+message = "འཕྲིན་དོན"
+noCertificate = "ལག་འ�ྱེར་ཡིག་ཆ་འདེམས་རོགས�"
+noSignatures = "PDF ཡི་ནང་ཉུང་མ�ར་ཡང་མཛུབ་འགན་གཅིག་བཞག་རོགས�"
+p12File = "P12/PFX ལག་འ�ྱེར་ཡིག་ཆ"
+password = "གསང་ཨང"
+passwordPlaceholder = "གསང་ཨང་འཇུག..."
+penColor = "སྨྱུག་གུའི་�་དོག"
+penSize = "སྨྱུག་གུ་ཆེ་ཆུང: {{size}}px"
+placementActive = "PDF ལ་མནན་ནས་བཞག"
+placeSignatureButton = "PDF སྟེང་མཛུབ་འགན་བཞག"
+reason = "རྒྱུ་མཚན (གདམ་�)"
+reasonPlaceholder = "ཅིའི་ཕྱིར་མཛུབ་འགན་བཀལ?"
+removeImage = "པར་བསུབ"
+removeCertFile = "ཡིག་ཆ་བསུབ"
+savedSignatures = "ཉར་ཚགས་བྱས་པའི་མཛུབ་འགན"
+selectFile = "པར་ཡིག་ཆ་འདེམས"
+selectSignatureTitle = "མཛུབ་འགན་འདེམས་ཡང་ན་གསར་བ་བཟོ"
+signButton = "ཡིག་ཆར་མཛུབ་འགན"
+signatureInfo = "སྒྲིག་འགོད་འདི་ཡིག་ཆའི་བདག་པོས་སྒྲིག་ཡོད�"
+signaturePlaced = "ཤོག་ངོས་སྟེང་མཛུབ་འགན་བཞག་ཟིན"
+signatureSettings = "མཛུབ་འགན་སྒྲིག་འགོད"
+signatureText = "མཛུབ་འགན་ཡི་གེ"
+signatureTextPlaceholder = "�ྱེད་ཀྱི་མིང་འཇུག..."
+signatureTypeLabel = "མཛུབ་འགན་རིགས"
+signingTitle = "མཛུབ་འགན"
+textColor = "ཡི་གེའི་�་དོག"
+typeSignature = "�ྱེད་ཀྱི་མིང་འཇུག་ནས་མཛུབ་འགན་བཟོ"
+uploadCert = "ལག་འ�ྱེར་སྲོལ་གསར"
+uploadCertDesc = "�ྱེད་རང་གི P12/PFX ལག་འ�ྱེར་སྤྱོད"
+uploadSignature = "�ྱེད་ཀྱི་མཛུབ་འགན་པར་ཡར་འཇུག"
+usePersonalCert = "མི་དབང་ལག་འ�ྱེར"
+usePersonalCertDesc = "�ྱེད་ཀྱི་�་བྱང་ལ་རང་འགུལ་བཟོས"
+useServerCert = "སྒྲིག་སྡེའི་ལག་འ�ྱེར"
+useServerCertDesc = "སྒྲིག་སྡེ་མཉམ་སྤྱོད་ལག་འ�ྱེར"
+workbenchTitle = "མཛུབ་འགན་རྒྱུ་འདོན"
+
+[certSign.collab.signRequest.canvas]
+colorPickerTitle = "འབྲི་རིས་�་དོག་གདམ"
+continue = "མུ་མ�ུད"
+
+[certSign.collab.signRequest.certModal]
+description = "�ྱེད་ཀྱིས {{count}} མཛུབ་འགན་བཞག་ཟིན� མཇུག་མ�ུན་བྱེད་པར་ལག་འ�ྱེར་གདམ་གནང་�"
+sign = "ཡིག་ཆར་མཛུབ་འགན"
+certValidating = "ལག་འ�ྱེར་བདེན་བཤད་བཤེར་བཞིན..."
+certValidUntil = "ལག་འ�ྱེར་ནུས་ཡོད་པའི་ཚེས: {{date}}"
+certInvalid = "ལག་འ�ྱེར་ནུས་མེད: {{error}}"
+certInvalidFallback = "ལག་འ�ྱེར་ནུས་མེད"
+certNetworkError = "ལག་འ�ྱེར་བདེན་བཤད་བྱས་མི་�ུབ"
+title = "ལག་འ�ྱེར་སྒྲིག་འགོད"
+
+[certSign.collab.signRequest.image]
+hint = "�ྱེད་ཀྱི་མཛུབ་འགན་ PNG ཡང་ན JPG པར་ཡར་འཇུག"
+
+[certSign.collab.signRequest.mode]
+move = "མཛུབ་འགན་སྤོ"
+place = "མཛུབ་འགན་བཞག"
+title = "མཛུབ་འགན་ཡང་ན་སྤོའི་རྣམ་པ"
+
+[certSign.collab.signRequest.modeTabs]
+draw = "འབྲི"
+image = "ཡར་འཇུག"
+text = "ཡི་གེ"
+
+[certSign.collab.signRequest.placeSignature]
+message = "PDF སྟེང་ལ་མནན་ནས་�ྱེད་ཀྱི་མཛུབ་འགན་བཞག"
+title = "མཛུབ་འགན་བཞག"
+
+[certSign.collab.signRequest.preview]
+imageAlt = "མཛུབ་འགན་འདེམས་ཟིན"
+missing = "སྔོན་ལྟ་མེད"
+textFallback = "མཛུབ་འགན"
+
+[certSign.collab.signRequest.saved]
+defaultCanvasLabel = "འབྲིས་པའི་མཛུབ་འགན"
+defaultImageLabel = "ཡར་འཇུག་པར་མཛུབ་འགན"
+defaultLabel = "མཛུབ་འགན"
+defaultTextLabel = "ཡི་གེ་མཛུབ་འགན"
+delete = "མཛུབ་འགན་བསུབ"
+none = "ཉར་ཚགས་མཛུབ་འགན་མེད"
+
+[certSign.collab.signRequest.signatureType]
+draw = "འབྲི"
+type = "ཡི་གེ"
+upload = "ཡར་འཇུག"
+
+[certSign.collab.signRequest.steps]
+back = "ཕྱིར་ལོག"
+cancelPlacement = "བཞག་བཤོལ"
+certificate = "ལག་འ�ྱེར"
+clickMultipleTimes = "PDF ལ་མི་ཚུན་མང་རྟགས་མནན་ནས་མཛུབ་འགན་བཞག� མཛུབ་འགན་གང་རུང་དེ་འདྲུད་ནས་སྤོ་བཟོ་དང་ཆེ་ཆུང་བསྒྱུར་ཆོག."
+clickToPlace = "PDF ཡི་ས་གནས་ཀྱིས་�ྱེད་ཀྱི་མཛུབ་འགན་མངོན་དགོས་པ་ལ་མནན�"
+continue = "ལག་འ�ྱེར་འདེམས་སུ་མུ་མ�ུད"
+continueToPlacement = "བཞག་སྒང་ལ་མུ་མ�ུད"
+continueToReview = "བས�ྱར་ཞིབ་ལ་མུ་མ�ུད"
+createSignature = "མཛུབ་འགན་བཟོ"
+invisible = "མ�ོང་མི་རུང"
+location = "གནས་ཡུལ:"
+multipleSignatures = "{{count}} མཛུབ་འགན PDF ལ་འཇུག"
+oneSignature = "1 མཛུབ་འགན་ PDF ལ་འཇུག"
+placeOnPdf = "PDF ལ་བཞག"
+reason = "རྒྱུ་མཚན:"
+reviewTitle = "མཛུབ་འགན་བྱེད་པའི་སྔོན་ལྟ"
+signaturePlaced = "ཤོག་ངོས་ {{page}} སྟེང་མཛུབ་འགན་བཞག་ཟིན� བས�ྱར་མནན་ནས་གནས་སར་བཅོས་བཟོ་ཡང་ན་བས�ྱར་ཞིབ་ལ་མུ་མ�ུད�"
+visible = "མ�ོང་རུང"
+visibility = "མ�ོང་རུང་གནས:"
+yourSignatures = "�ྱེད་ཀྱི་མཛུབ་འགན ({{count}})"
+
+[certSign.collab.signRequest.text]
+colorLabel = "�་དོག"
+fontLabel = "ཡིག་གཟུགས"
+fontSizeLabel = "ཆེ་ཆུང"
+fontSizePlaceholder = "16"
+label = "མཛུབ་འགན་ཡི་གེ"
+modalHint = "�ྱེད་ཀྱི་མིང་འཇུག་བྱས་�ེ མུ་མ�ུད་མནན་ནས PDF ལ་བཞག."
+placeholder = "�ྱེད་ཀྱི་མིང་འཇུག..."
+
+[certSign.collab.participant]
+certValidating = "ལག་འ�ྱེར་བདེན་བཤད་བཤེར་བཞིན..."
+certValid = "✓ ལག་འ�ྱེར་ནུས་ཡོད"
+certValidUntil = " {{date}} བར"
+certInvalid = "✗ {{error}}"
+certInvalidFallback = "ལག་འ�ྱེར་ནུས་མེད"
+certNetworkError = "ལག་འ�ྱེར་བདེན་བཤད་བྱས་མི་�ུབ"
+
+[certSign.collab.addParticipants]
+add = "ཞུགས་མ�ན {{count}} �་སྣོན"
+back = "ཕྱིར་ལོག"
+configureSignatures = "མཛུབ་འགན་སྒྲིག་འགོད་སྒྲིག"
+continue = "མཛུབ་འགན་སྒྲིག་འགོད་ལ་མུ་མ�ུད"
+reasonHelp = "ཞུགས་མ�ན་འདི་ཚོའི་མཛུབ་འགན་རྒྱུ་མཚན་སྔོན་འགུལ་འཇོག (གདམ་� �ོང་ཚོས་མཛུབ་འགན་ས�བས་བརྗེ་ཆོག)"
+reasonPlaceholder = "e.g. Approval, Review..."
+selectUsers = "མི་སྣ་འདེམས"
+
+[certSign.collab.sessionCreation]
+includeSummaryPage = "མཛུབ་འགན་གནས་བྱང་བརྗོད་པའི་ཤོག་ངོས་�་སྣོན"
+includeSummaryPageHelp = "མཇུག་ལ་མཛུབ་འགན metadata ཡོངས་ཀྱི་བརྗོད་པ་ཡོད་པའི་ཤོག་ངོས་�་སྣོན་བྱེད� ཤོག་ངོས་སོ་སོའི་ནང་གི་དགོངས་ཡིག་ལག་འ�ྱེར་མཛུབ་འགན་སྒྲོག་ག�ོར་བྱེད་(wet signatures ལ་ཕན་མེད)�"
+
+[certSign.collab.sessionList]
+active = "འགུལ་སྤྱོད"
+finalized = "མཇུག་བསྡུས"
+
+[certSign.collab.signatureSettings]
+description = "ཞུགས་མ�ན་ཚང་མའི་མཛུབ་འགན་མངོན་སྟོན་ཇི་ལྟར་མ�ུན་འགྱུར་བྱ་དགོས་མེད�"
+title = "མཛུབ་འགན་མངོན་སྟོན"
+
+[certSign.collab.userSelector]
+inviteUsers = "མི་སྣ་�་སྣོན"
+loadError = "མི་སྣ་འཇུག་མ་�ུབ"
+noTeam = "ཚོགས་མིང་མེད"
+noUsers = "མི་སྣ་གཞན་མ་རྙེད�"
+placeholder = "མི་སྣ་འདེམས..."
+
+[certSign.mobile]
+panelActions = "བྱ་བ"
+panelDocument = "ཡིག་ཆ"
+panelPeople = "མི་སྣ"
+
+[certSign.sessions]
+deleted = "ལས་འ�ུར་བསུབ་ཟིན"
+fetchFailed = "ལས་འ�ུར་གནས་ཚུལ་འཇུག་མ་�ུབ"
+finalized = "ལས་འ�ུར་མཇུག་བསྡུས"
+loaded = "མཛུབ་འགན་PDF འཇུག་ཟིན"
+pdfNotReady = "PDF གྲ་སྒྲིག་མེད"
+pdfNotReadyDesc = "མཛུབ་འགན་PDF བཟོ་བའི་སྒང་ཡིན� ས�ར་མ་ཤུལ་ལ་ཡང་བཤལ་ལས་ཚོད་ལྟ་རོགས�"
+
+[certificateChoice.tooltip]
+header = "ལག་འ�ྱེར་རིགས་གྲས"
+
+[certificateChoice.tooltip.organization]
+bullet1 = "རིམ་སྤྱོད་ས�ྱོང་བ་ཚོས་དོ་དམ"
+bullet2 = "དབང་ཚད་ཡོད་པའི་མི་ཚུལ་དང་མཉམ་སྤྱོད"
+bullet3 = "མི་སྒེར་མིན་པ� ཚོགས་སྡེའི་ངོ་སྤྲོད"
+bullet4 = "ལེགས་པ: གཞུང་མིང་ཡིག་ཆ� ཚོགས་མི་མཛུབ་འགན"
+description = "�ྱེད་ཀྱི་ཚོགས་སྡེས་བྱིན་པའི་མཉམ་སྤྱོད་ལག་འ�ྱེར� ཚོགས་སྡེ་ཡོངས་ཀྱི་མཛུབ་འགན་དབང་ཆེད་སྤྱོད�"
+title = "སྒྲིག་སྡེའི་ལག་འ�ྱེར"
+
+[certificateChoice.tooltip.personal]
+bullet1 = "�ེངས་དང་པོ་སྤྱོད་ས�བས་རང་འགུལ་བཟོས"
+bullet2 = "�ྱེད་ཀྱི་�་བྱང་ལ་འབྲེལ"
+bullet3 = "མི་སྣ་གཞན་དང་མཉམ་སྤྱོད་མི་�ུབ"
+bullet4 = "ལེགས་པ: མི་སྒེར་ཡིག་ཆ� སོ་སོའི་�ྲིམས་འ�ྲིལ"
+description = "�ྱེད་ཀྱི་�་བྱང་ལ་དམིགས་བཀོད་བྱས་པའི་རང་འགུལ་ལག་འ�ྱེར� སོ་སོའི་མཛུབ་འགན་ལ་འཚམ�"
+title = "མི་དབང་ལག་འ�ྱེར"
+
+[certificateChoice.tooltip.upload]
+bullet1 = "P12/PFX ཡིག་ཆ་དང་གསང་ཨང་དགོས"
+bullet2 = "ཕྱིས་ཀྱི Certificate Authorities ཡིས་�ྱབས་སྤྲོད་ཆོག"
+bullet3 = "�ྲིམས་འ�ྲིན་ཡིག་ཆའི་མ�ོ་རིམ་བློ་གྲོས"
+bullet4 = "ལེགས་པ: �ྲིམས་ལྡན་དམ་ཚིག ཕྱིས་ཀྱི་བདེན་བསྟན"
+description = "�ྱེད་རང་གི PKCS#12 ལག་འ�ྱེར་ཡིག་ཆ་སྤྱོད� ལག་འ�ྱེར་ག�ོགས་སྒྲིག་ལ་ཚད་བཟོ་ཆོག."
+title = "P12 སྲོལ་གསར་ཡར་འཇུག"
+
 [changeCreds]
 changePassword = "�ྱེད་ཀྱིས་སྔོན་སྒྲིག་ནང་འཛུལ་གྱི་ཡིག་ཆ་བེད་སྤྱོད་བྱེད་ཀྱི་ཡོད� གསང་གྲངས་གསར་པ་བླུགས་རོགས�"
 changeUsername = "�ྱེད་རང་གི་སྤྱོད་མ�ན་གྱི་མིང་གསར་བརྗེ� �ྱེད་རང་གསར་བརྗེ་བྱས་རྗེས་ཕྱིར་�ོན་འགྲོ་གི་རེད�"
@@ -3242,6 +3531,46 @@ totalSelected = "བསྡོམས་འདེམས་པ�"
 unsupported = "རྒྱབ་ས�ྱོར་མེད་པ�"
 unzip = "ཟིཔ�"
 uploadError = "ཡིག་ཆ་འགའ་ཤས་ཡར་བས�ུར་མ་�ུབ་པ་རེད�"
+copyCreated = "པར་འདེབས་འདི་�བས་འཕྲུལ་འདིའི་�ོག་ཉར་ཟིན�"
+copyFailed = "པར་འདེབས་བཟོ་མ་�ུབ�"
+leaveShare = "ངའི་�ོའི་ནས་བསུབ"
+leaveShareFailed = "མཉམ་སྤྱོད་ཡིག་ཆ་བསུབ་མ་�ུབ�"
+leaveShareSuccess = "�ྱེད་ཀྱི་མཉམ་སྤྱོད་�ོ་ཡིག་ནས་བསུབ་ཟིན�"
+removeBoth = "གཉིས་ཀ་ནས་བསུབ"
+removeFilePrompt = "ཡིག་ཆ་འདི་�བས་འཕྲུལ་འདི་དང་�ྱེད་ཀྱི་སར་བར་གཉིས་ཀ་ལ་ཉར་ཡོད� གནས་ས་གང་ནས་བསུབ་དགོས?"
+removeFileTitle = "ཡིག་ཆ་བསུབ"
+removeLocalOnly = "�བས་འཕྲུལ་འདི་པོ་ཙམ"
+removeServerFailed = "སར་བར་ནས་ཡིག་ཆ་བསུབ་མ་�ུབ�"
+removeServerOnly = "སར་བར་པོ་ཙམ"
+removeServerOnlyPrompt = "ཡིག་ཆ་འདི་�ྱེད་ཀྱི་སར་བར་ནང་ཙམ་ཉར་ཡོད� སར་བར་ནས་བསུབ་དགོས་སམ?"
+removeServerSuccess = "སར་བར་ནས་བསུབ་ཟིན�"
+removeSharedPrompt = "ཡིག་ཆ་འདི་�ྱེད་ལ་མཉམ་སྤྱོད་བྱས་ཟིན� �བས་འཕྲུལ་འདིའམ མཉམ་སྤྱོད་�ོ་ཡིག་ནས་བསུབ་ཆོག."
+removeSharedServerOnlyBlockedPrompt = "ཡིག་ཆ་འདི་�ྱེད་ལ་མཉམ་སྤྱོད་བྱས་པ་དང་སར་བར་ཙམ་སྟེང་ཉར་ཡོད�"
+removeSharedServerOnlyPrompt = "ཡིག་ཆ་འདི་�ྱེད་ལ་མཉམ་སྤྱོད་བྱས་པ་དང་སར་བར་ཙམ་སྟེང་ཉར་ཡོད� �ྱེད་ཀྱི་�ོ་ཡིག་ནས་བསུབ་དགོས་སམ?"
+changesNotUploaded = "བཟོ་བཅོས་ཡར་འཇུག་མ་བྱས"
+cloudFile = "Cloud ཡིག་ཆ"
+filterAll = "ཡོངས"
+filterLocal = "རང་ས"
+filterSharedByMe = "ངས་མཉམ་སྤྱོད"
+filterSharedWithMe = "ང་ལ་མཉམ་སྤྱོད"
+lastSynced = "མཉམ་བསྒྲིག་�ེངས་མཇུག"
+localOnly = "རང་ས་པོ་ཙམ"
+makeCopy = "པར་འདེབས་བྱེད"
+owner = "བདག་པོ"
+ownerUnknown = "མ་ཤེས"
+share = "མཉམ་སྤྱོད"
+shareSelected = "འདེམས་པ་མཉམ་སྤྱོད"
+sharedByYou = "�ྱེད་ཀྱིས་མཉམ་སྤྱོད"
+sharedEditNoticeBody = "སར་བར་ཡིག་ཆ་འདིའི་རྩོམ་སྒྲིག་དབང་ཆ་མེད� �ྱེད་ཀྱིས་བཟོ་བཅོས་བྱས་པ་དེ་རང་ས་དུ་ཉར་ཡོད་པའི་ཀླད་ཀོར་པར་འདེབས་སྦེ་ཉར་ཚགས་བྱེད�"
+sharedEditNoticeConfirm = "གོ་སོང་"
+sharedEditNoticeTitle = "སར་བར་མངོན་མ�ོང་ཙམ"
+sharedWithYou = "�ྱེད་ལ་མཉམ་སྤྱོད"
+sharing = "མཉམ་སྤྱོད"
+storageState = "གསོག་འཇོག"
+synced = "མཉམ་བསྒྲིག"
+updateOnServer = "སར་བར་གསར་སྒྱུར"
+uploadSelected = "འདེམས་པ་ཡར་འཇུག"
+uploadToServer = "སར་བར་ཡར་འཇུག"
 
 [files]
 addFiles = "ཡིག་ཆ་�་སྣོན�"
@@ -3367,6 +3696,77 @@ title = "PDFs ཕ་ལེཊ་ཊེན་སི་ས�ོར�"
 discord = "མི་མ�ུན་པ�"
 issues = "གྷི་ཊི་ཧབ�"
 
+[groupSigning.tooltip]
+header = "ཚོགས་མི་མཛུབ་འགན་ས�ོར"
+
+[groupSigning.tooltip.finalization]
+bullet1 = "མཛུབ་འགན་ཚང་མ་�ྱེད་ཀྱིས་བཀོད་པའི་ཞུགས་མ�ན་གྱི་རིམ་པ་ལྟར་འཇུག"
+bullet2 = "དགོས་ཚེ་མཛུབ་འགན་ཕྱོགས་མེད་ཀྱིས་མཇུག་བསྡུ་ཆོག"
+bullet3 = "མཇུག་བསྡུས་ཟིན་པའི་རྗེས་ལས་ལས་འ�ུར་བཅོས་མི་�ུབ"
+description = "མཇུག་བསྡུས་པས་མཛུབ་འགན་ཡོངས་ཀྱིས་གཅིག་པའི་མཛུབ་འགན་PDF བཟོ་བྱེད� འདི་བས�ྱར་མེད�"
+title = "མཇུག་བསྡུས་ལས་ས�ྱོད"
+
+[groupSigning.tooltip.roles]
+bullet1 = "བདག་པོ (�ྱེད): ལས་འ�ུར་བཟོ, མཛུབ་འགན་སྔོན་སྒྲིག, ཡིག་ཆ་མཇུག་བསྡུ"
+bullet2 = "ཞུགས་མ�ན: མཛུབ་འགན་བཟོ, ལག་འ�ྱེར་འདེམས, PDF སྟེང་བཞག"
+bullet3 = "ཞུགས་མ�ན་ཚོས མ�ོང་རུང་/རྒྱུ་མཚན/གནས་ཡུལ སྒྲིག་འགོད་བཅོས་མི་�ུབ"
+description = "�ྱེད་ཀྱིས་ཞུགས་མ�ན་ཚང་མའི་མཛུབ་འགན་མངོན་སྟོན་སྒྲིག་ཚོད་འཛིན་བྱེད�"
+title = "ཞུགས་མ�ན་ལས་འགན"
+
+[groupSigning.tooltip.sequential]
+bullet1 = "ཞུགས་མ�ན་དང་པོས་མཛུབ་འགན་བཀལ་བྱས་རྗེས་གཉིས་པས་ཡིག་ཆར་འཛུལ་ཆོག"
+bullet2 = "�ྲིམས་ལྡན་གྲོས་མ�ུན་གྱི་རིམ་པ་ལ་འཚམ"
+bullet3 = "�ོ་ཡིག་ནས་འདྲུད་ནས་ཞུགས་མ�ན་རིམ་པ་བརྗེ་ཆོག"
+description = "ཞུགས་མ�ན་ཚོས་�ྱེད་ཀྱིས་བཀོད་པའི་རིམ་པ་ལྟར་མཛུབ་འགན་བཀལ� རེ་ཞུགས་མ�ན་རེ་ལ་རིམ་པ་ཡོངས་ནས་གསར་བརྡ་འབྱོར�"
+title = "རིམ་པ་རིམ་པའི་མཛུབ་འགན"
+
+[groupSigning.steps]
+back = "ཕྱིར་ལོག"
+completed = "མཇུག་བསྡུས"
+current = "མིག་སྔའི"
+stepLabel = "རིམ་པ {{number}}"
+
+[groupSigning.steps.configureDefaults]
+continue = "བས�ྱར་ཞིབ་ལ་མུ་མ�ུད"
+invisible = "མཛུབ་འགན་རྣམས་མ�ོང་མི་རུང (metadata ཙམ)"
+locationLabel = "གནས་ཡུལ:"
+preview = "སྔོན་ལྟ"
+reasonLabel = "རྒྱུ་མཚན:"
+title = "མཛུབ་འགན་སྒྲིག་འགོད"
+visible = "མཛུབ་འགན་རྣམས་ {{page}} ཤོག་ངོས་སྟེང་མ�ོང་རུང"
+
+[groupSigning.steps.review]
+document = "ཡིག་ཆ"
+dueDate = "དུས་བཀག (གདམ་�)"
+dueDatePlaceholder = "དུས་བཀག་འདེམས..."
+invisible = "མ�ོང་མི་རུང (metadata ཙམ)"
+location = "གནས་ཡུལ:"
+logo = "ལས་རྟགས:"
+logoHidden = "ལས་རྟགས་མེད"
+logoShown = "Stirling PDF ལས་རྟགས་མངོན"
+participants = "ཞུགས་མ�ན"
+reason = "རྒྱུ་མཚན:"
+send = "མཛུབ་འགན་ཞུ་ག�ོང"
+signatureSettings = "མཛུབ་འགན་སྒྲིག་འགོད"
+title = "ལས་འ�ུར་ཞིབ་བཤེར"
+titleShort = "ཞིབ་བཤེར་དང་ག�ོང"
+visibility = "མ�ོང་རུང་གནས:"
+visible = "{{page}} ཤོག་ངོས་སྟེང་མ�ོང་རུང"
+participantCount = "{{count}} ཞུགས་མ�ན་རིམ་པ་ལྟར་མཛུབ་འགན"
+
+[groupSigning.steps.selectDocument]
+continue = "ཞུགས་མ�ན་འདེམས་ལ་མུ་མ�ུད"
+noFile = "མཛུབ་འགན་ལས་འ�ུར་བཟོ་བར �ྱེད་ཀྱི་འགུལ་སྤྱོད་ཡིག་ཆ་ནས PDF ཡིག་ཆ་གཅིག་འདེམས་རོགས�"
+selectedFile = "འདེམས་ཟིན་པའི་ཡིག་ཆ"
+title = "ཡིག་ཆ་འདེམས"
+
+[groupSigning.steps.selectParticipants]
+continue = "མཛུབ་འགན་སྒྲིག་འགོད་ལ་མུ་མ�ུད"
+count = "{{count}} ཞུགས་མ�ན་འདེམས་ཟིན"
+label = "ཞུགས་མ�ན་འདེམས"
+placeholder = "མཛུབ་འགན་ལ་ཞུགས་པའི་མི་སྣ་འདེམས..."
+title = "ཞུགས་མ�ན་འདེམས"
+
 [getPdfInfo]
 downloadJson = "JSON ཕབ་ལེན�"
 downloads = "ཕབ་ལེན�"
@@ -4460,7 +4860,10 @@ zoomOut = "ཆུང་དུ་བཟོ�"
 
 [viewer]
 cannotPreviewFile = "སྔོན་ལྟའི་ཡིག་འབྲུའི་ཡིག་ཚགས་བཟོ་མི་རུང་�"
+disableColorFilter = "�་དོག་འཚག་བཟོ་བར་བཀག"
 dualPageView = "ཤོག་ངོས་གཉིས་ལྡན་གྱི་མ�ོང་སྣང་�"
+enableDarkFilter = "མུན་མ�ོང་འཚག་བཟོ་ལྕོགས་འགུལ"
+enableSepiaFilter = "Sepia འཚག་བཟོ་ལྕོགས་འགུལ"
 firstPage = "ཤོག་ངོས་དང་པོ�"
 lastPage = "ཤོག་ངོས་མ�འ་མ�"
 nextPage = "ཤོག་ངོས་རྗེས་མ�"
@@ -4470,6 +4873,22 @@ singlePageView = "ཤོག་ངོས་གཅིག་པའི་མ�ོ
 unknownFile = "མ་ཤེས་པའི་ཡིག་ཆ�"
 zoomIn = "Zoom in"
 zoomOut = "ཆུང་དུ་བཟོ�"
+resetZoom = "རྒྱས་ཚད་བས�ྱར་འཇོག"
+
+[viewer.nonPdf]
+fileTypeBadge = "{{type}} ཡིག་ཆ"
+convertToPdf = "PDF ལ་བསྒྱུར"
+loading = "སྒྲུབ་བརྒྱབ..."
+emptyFile = "ཡིག་ཆ་སྟོང་"
+csvStats = "{{rows}} གྲལ · {{columns}} སྟར · {{size}}"
+sortedBy = "གོང་འབྱེད: {{column}}"
+columnDefault = "གྲལ་�ིག {{index}}"
+htmlPreviewWarning = "HTML སྔོན་ལྟ — ཕྱི་�ོན་�ུངས་ཚུད་མི་སྲིད · {{size}}"
+htmlPreview = "HTML སྔོན་ལྟ"
+invalidJson = "JSON ནུས་མེད — ནང་དོར་�ོག་མངོན"
+textStats = "{{lines}} ཕྲེང · {{size}}"
+lineNumbers = "ཕྲེང་གྲངས"
+renderMarkdown = "markdown མངོན"
 
 [viewer.attachments]
 title = "ཟུར་སྣོན"
@@ -4531,6 +4950,7 @@ toggleAttachments = "ཟུར་སྣོན་སྟོན/སྦེལ"
 toggleTheme = "བསྒྱུར་བའི་བརྗོད་གཞི�"
 language = "ས�ད་རིགས"
 toggleAnnotations = "བསྒུལ་བསྒྱུར� མིང་ཚིག་མ�ོང་�ུབ་ཚད�"
+toggleLayers = "སྒང་རིས་བསྒྱུར"
 search = "འཚོལ་ཞིབ་PDF"
 panMode = "པན་�བས་ཀྱི་�བས་ལམ�"
 applyRedactionsFirst = "དེ་སྔོན་ལ་གསང་སྦེད་འཇུག"
@@ -5407,20 +5827,72 @@ title = "པར་ས�ྲུན�"
 2 = "པར་འཕྲུལ་གྱི་མིང་བླུགས�"
 
 [quickAccess]
+access = "འཛུལ་ས"
+accessAddPerson = "མི་མངོན་དུ་�་སྣོན"
+accessBack = "ཕྱིར་ལོག"
+accessCopyLink = "འབྲེལ་�ག་འ�ེན"
+accessEmail = "གློག་འཕྲིན་གནས་ཡུལ"
+accessEmailPlaceholder = "name@company.com"
+accessFileLabel = "ཡིག་ཆ"
+accessGeneral = "དམིགས་མེད་འཛུལ་ས"
+accessInviteTitle = "མི་སྣ་མགྲོན་འབོད"
+accessOwner = "བདག་པོ"
+accessPanel = "ཡིག་ཆའི་འཛུལ་ས"
+accessPeople = "འཛུལ་ས་ཡོད་པའི་མི་ཚོ"
+accessRemove = "བསུབ"
+accessRestricted = "ཚད་འཛིན"
+accessRestrictedHint = "འཛུལ་ས་ཡོད་པའི་མི་ཙམ་�་ཕྱེ"
+accessRole = "ལས་འགན"
+accessRoleCommenter = "མཆན་འགྲེལ་པ"
+accessRoleEditor = "ཞུན་དག་པ"
+accessRoleViewer = "ལྟ་མ�ན"
+accessSelectedFile = "འདེམས་ཟིན་པའི་ཡིག་ཆ"
+accessSendInvite = "མགྲོན་འབོད་ག�ོང"
+accessTitle = "ཡིག་ཆའི་འཛུལ་ས"
+accessYou = "�ྱེད"
 account = "�ོ་བདག"
+activeSessions = "འགུལ་སྤྱོད་ལས་འ�ུར"
+activeTab = "འགུལ་སྤྱོད"
 activity = "བྱེད་སྒོ"
 adminSettings = "འཛིན་ས�ྱོང་སྒྲིག་སྟངས�"
+allSessions = "ལས་འ�ུར་ཡོངས"
 allTools = "ལག་ཆ"
 automate = "རང་འགུལ་ཅན�"
+back = "ཕྱིར་ལོག"
+certSign = "ལག་འ�ྱེར་མཛུབ་འགན"
+completedSessions = "མཇུག་བསྡུས་ལས་འ�ུར"
+completedTab = "མཇུག་བསྡུས"
 config = "སྒྲིག་བཀོད�"
+createNew = "རྒྱུ་འདོན་གསར་བ་བཟོ"
+createSession = "མཛུབ་འགན་ཞུ་ག�ོང་བཟོ"
+dueDate = "དུས་བཀག (གདམ་�)"
 files = "ཡིག་ཆ�"
 help = "རོགས་རམ"
+noActiveSessions = "མཛུབ་འགན་ཞུ་ག�ོང་སྒུག་མེད ཡང་ན་འགུལ་སྤྱོད་ལས་འ�ུར་མེད"
+noCompletedSessions = "མཇུག་བསྡུས་ལས་འ�ུར་མེད"
+noFile = "ཡིག་ཆ་མ་འདེམས"
 read = "ཀློག་པ"
 reader = "ཀློག་མ�ན�"
+refresh = "གསར་སྒྱུར"
+requestSignatures = "མཛུབ་འགན་ཞུ་ག�ོང"
+selectSingleFileToRequest = "མཛུབ་འགན་ཞུ་ག�ོང་བར PDF ཡིག་ཆ་གཅིག་འདེམས"
+selectedFile = "འདེམས་ཟིན་པའི་ཡིག་ཆ"
+selectUsers = "མཛུབ་འགན་བཀལ་མི་སྣ་འདེམས"
+selectUsersPlaceholder = "ཞུགས་མ�ན་འདེམས..."
+sendingRequest = "ག�ོང་བཞིན..."
 settings = "སྒྲིག་སྟངས�"
 showMeAround = "ང་ལ་སྟོན་དང་�"
 sign = "མིང་འགོད"
+signatureRequests = "མཛུབ་འགན་ཞུ་ག�ོང"
+signYourself = "�ྱེད་རང་མཛུབ་འགན"
+newRequest = "རྒྱུ་འདོན་གསར་པ"
 tours = "ཡུལ་ས�ོར�"
+wetSign = "མཛུབ་རྟགས་�་སྣོན"
+filterMine = "ངའི"
+filterOverdue = "དུས་བཀག་ལས་འདས"
+filterSigned = "མཛུབ་འགན་བཀལ"
+filterDeclined = "�ས་ལེན་མ་བྱས"
+searchDocuments = "ཡིག་ཆ་འཚོལ…"
 
 [quickAccess.helpMenu]
 adminTour = "འཛིན་ས�ྱོང་ས�ོར་གཡེང་�"
@@ -6050,11 +6522,75 @@ toolNotAvailableLocally = "�ྱེད་ཀྱི Stirling-PDF ཞབས་ཞ
 expired = "�ྱེད་རང་གི་ཚོགས་�ུན་དུས་ཚོད་རྫོགས་ཡོད� ཤོག་བུ་གསར་བཟོ་བྱས་ནས་བས�ྱར་དུ་ཚོད་ལྟ་གནང་རོགས�"
 refreshPage = "གསར་འགྱུར་ཤོག་ངོས�"
 
+[sessionManagement.tooltip]
+header = "མཛུབ་འགན་ལས་འ�ུར་དོ་དམ"
+
+[sessionManagement.tooltip.addParticipants]
+bullet1 = "ཞུགས་མ�ན་གསར་པ་ཚོས་མཛུབ་འགན་རིམ་པའི་མཇུག་�ུ་�་སྣོན"
+bullet2 = "ལས་འ�ུར་མཇུག་བསྡུས་རྗེས་ཞུགས་མ�ན་�་སྣོན་མི་�ུབ"
+bullet3 = "ཞུགས་མ�ན་རེ་རེ་ལ་�ོང་ཚོའི་རྗེས་རུ་གསར་བརྡ་འབྱོར"
+description = "མཇུག་བསྡུ་སྔོན་ལ་དུས་གང་རུང་ལས་ལས་འ�ུར་ན་ཞུགས་མ�ན་�་སྣོན་ཆོག."
+title = "ཞུགས་མ�ན་�་སྣོན"
+
+[sessionManagement.tooltip.finalization]
+bullet1 = "<b>མཇུག་བསྡུས་པ་ཡོངས</b>: ཞུགས་མ�ན་ཚང་མ་མཛུབ་འགན་བཀལ་ཟིན"
+bullet2 = "<b>མཇུག་བསྡུས་པ་ཕྱོགས་མེད</b>: ཞུགས་མ�ན་�་ཤས་ད་མ་མཛུབ་འགན"
+bullet3 = "མཛུབ་འགན་མི་བཀལ་མི་ཚོ་མཇུག་ཡིག་ཆ་ནས་བུ་ག�ོར་བྱེད"
+bullet4 = "མཇུག་བསྡུས་རྗེས མཛུབ་འགན་PDF འགུལ་སྤྱོད་ཡིག་ཆ་ནང་འཇུག་ཆོག"
+description = "མཇུག་བསྡུས་པས་མཛུབ་འགན་ཡོངས་ཀྱིས་གཅིག་པའི་མཛུབ་འགན་PDF བཟོ་བྱེད� འདི་བས�ྱར་མེད�"
+title = "ལས་འ�ུར་མཇུག་བསྡུས"
+
+[sessionManagement.tooltip.participantRemoval]
+bullet1 = "མཛུབ་འགན་བཀལ་ཟིན་པའི་ཞུགས་མ�ན་བསུབ་མི་�ུབ"
+bullet2 = "བསུབ་ཟིན་པའི་ཞུགས་མ�ན་ལ་གསར་བརྡ་མི་འབྱོར"
+bullet3 = "མཛུབ་འགན་རིམ་པ་རང་འགུལ་གྱིས་བཅོས"
+description = "ཞུགས་མ�ན་ཚོ་མཛུབ་འགན་བཀལ་མ་སྔོན་ལས་ལས་འ�ུར་ནས་བསུབ་ཆོག."
+title = "ཞུགས་མ�ན་བསུབ"
+
+[sessionManagement.tooltip.signatureOrder]
+bullet1 = "མཛུབ་འགན་རེ་རེ་བསྟུན་པར PDF ལ་འཇུག"
+bullet2 = "རྗེས་མའི་མཛུབ་འགན་པས་སྔོན་མའི་མཛུབ་འགན་ལྟ་ཆོག"
+bullet3 = "�ྲིམས་ལྡན་གྲོས་མ�ུན་དང་ལག་ལེན་ལ་གལ་ཆེ�"
+description = "�ྱེད་ཀྱིས་ལས་འ�ུར་བཟོས་ས�བས་བཀོད་པའི་རིམ་པས་སོ་སོ་ཇི་ལྟར་མཛུབ་འགན་བཀལ་དགོས་ཆེད་ག�ན་འ�ེལ�"
+title = "མཛུབ་འགན་རིམ་པ"
+
+[signatureSettings.tooltip]
+header = "མཛུབ་འགན་མངོན་སྟོན་སྒྲིག"
+
+[signatureSettings.tooltip.location]
+bullet1 = "དཔེར: \"New York, USA\", \"London Office\", \"Remote\""
+bullet2 = "ཤོག་ངོས་ཀྱི་གནས་ས་དང་མི་འདྲ"
+bullet3 = "�ྲིམས་སྲོལ་གཞན་དག་ལ་དགོས་སྲིད"
+description = "མཛུབ་འགན་བཀལ་ས་གནས་ཡུལ་གྱི་གདམ་�� ལག་འ�ྱེར metadata ནང་ཉར�"
+title = "མཛུབ་འགན་གནས་ཡུལ"
+
+[signatureSettings.tooltip.logo]
+bullet1 = "མཛུབ་འགན་དང་ཡི་གེ་དང་མཉམ་དུ་མངོན"
+bullet2 = "PNG, JPG རྣམ་གྲངས་རྒྱུན་འགྱུར"
+bullet3 = "ལས་དབང་འཛུགས་ལྗོངས་ལ་བརྗོད་པ་ལེགས་སྒྱུར"
+description = "མ�ོང་རུང་མཛུབ་འགན་ལ་ཚོགས་སྡེའི་ལས་རྟགས་�་སྣོན་ནས བརྡ་སྟོན་དང་བློ་གྲོས་བཟོ�"
+title = "ས་�ང་ལས་རྟགས"
+
+[signatureSettings.tooltip.reason]
+bullet1 = "དཔེར: \"Approval\", \"Contract Agreement\", \"Review Complete\""
+bullet2 = "PDF མཛུབ་འགན་ངོ་སྤྲོད་ནང་མངོན"
+bullet3 = "བཤེར་དཔྱད་དང་ལྟ་སྤྱོད་ལ་ཕན"
+description = "ཡིག་ཆ་ལ་མཛུབ་འགན་བཀལ་རྒྱུའི་རྒྱུ་མཚན� ལག་འ�ྱེར metadata ནང་ཉར�"
+title = "མཛུབ་འགན་རྒྱུ་མཚན"
+
+[signatureSettings.tooltip.visibility]
+bullet1 = "<b>མ�ོང་རུང</b>: མཛུབ་འགན་ཡིག་ཆའི་སྟེང་མངོན རྣམ་པ་སྲོལ་གསར"
+bullet2 = "<b>མ�ོང་མི་རུང</b>: ལག་འ�ྱེར་ཡིག་ཆ་ནང་�་མས་བཅུག"
+bullet3 = "མ�ོང་མི་རུང་མཛུབ་འགན་ཡང་གསང་ཨང་རྒྱུད་གཞི་�ུངས་ཡོད"
+description = "མཛུབ་འགན་ཡིག་ཆ་སྟེང་མངོན་དམ་ནང་�་མས་བཅུག་ན་གདམ�"
+title = "མཛུབ་འགན་མ�ོང་རུང་གནས"
+
 [settings.configuration]
 advanced = "ཡན་�ོན་ཅན"
 database = "གཞི་གྲངས་རྟེན་གཞི�"
 endpoints = "མཇུག་སྡོམ�"
 features = "�ྱད་ཆོས"
+storageSharing = "ཡིག་ཆའི་གསོག་འཇོག་དང་མཉམ་སྤྱོད"
 systemSettings = "མ་ལག་སྒྲིག་བཀོད�"
 title = "བཀོད་སྒྲིག�"
 
@@ -6332,10 +6868,13 @@ title = "སི་ཊར་ལིང་ལ་འཛུལ་བ�"
 [setup.selfhosted]
 link = "ཡང་ན་རང་གིས་བདག་གཉེར་བྱེད་པའི་རྩིས་�ྲ་ལ་མ�ུད་པ�"
 subtitle = "�ྱེད་རང་གི་གསབ་ལེན་ཆས་ཀྱི་ཡིག་ཆ་བླུགས�"
+changeServerLocked = "�ྱེད་ཀྱི་ཚོགས་སྡེས་མ་ལག་འདི་སར་བར་གཅིག་ལ་བཀག་འགོག་བྱས་ཡོད�"
 switchToLocal = "རང་གནས་ལག་ཆ་སྤྱོད"
 title = "སར་བར་ནང་འཛུལ་བ�"
 
 [setup.selfhosted.unreachable]
+changeServer = "སར་བར་གཞན་ལ་མ�ུད"
+changeServerLocked = "�ྱེད་ཀྱི་ཚོགས་སྡེས་མ་ལག་འདི་སར་བར་གཅིག་ལ་བཀག་འགོག་བྱས་ཡོད�"
 continueOffline = "རང་གནས་ལག་ཆ་སྤྱོད"
 message = "{{url}} ལ་མ�ུད་མི་�ུབ� ཞབས་ཞུ་འ�ོར་བཀོལ་བཞིན་དང་འ�ོབ་ཚུལ་ཡོད་མིན་ཞིབ་བཤེར་བྱོས�"
 retry = "བས�ྱར་ཚོད"
@@ -6529,6 +7068,15 @@ saved = "ས�ྱོབ་པ�"
 text = "ཡིག་གཞི"
 title = "མཚན་རྟགས་རིགས�"
 
+[signRequest]
+declined = "མཛུབ་འགན་ཞུ་ག�ོང་�ས་ལེན་མ་བྱས"
+fetchFailed = "མཛུབ་འགན་ཞུ་ག�ོང་འཇུག་མ་�ུབ"
+signed = "ཡིག་ཆ་མཛུབ་འགན་ལེགས་གྲུབ"
+
+[signSession]
+createFailed = "མཛུབ་འགན་ཞུ་ག�ོང་བཟོ་མ་�ུབ"
+created = "མཛུབ་འགན་ཞུ་ག�ོང་བ�ང་ཟིན"
+
 [signup]
 accountCreatedSuccessfully = "རྩིས་�ྲ་ལེགས་འགྲུབ་བྱུང་� �ྱེད་རང་ད་ལྟ་ནང་དུ་མིང་རྟགས་བཀོད་ཆོག"
 alreadyHaveAccount = "ད་ལྟ་རྩིས་�ྲ་ཞིག་ཡོད་དམ� མཚན་རྟགས་བཀོད་པ�"
@@ -6807,6 +7355,106 @@ title = "ལེའུ་ཡིས་PDFབགོས�"
 [splitPdfByChapters]
 tags = "�་ཕྲལ་བ� ལེའུ་ཅན� དེབ་མཚོན་ཆ� གོ་སྒྲིག་བྱེད་པ�"
 
+[storageShare]
+accessed = "འཛུལ་ཟིན"
+accessDenied = "�ྱེད་ལ་མཉམ་སྤྱོད་ཡིག་ཆ་འདིར་འཛུལ་མི་ཆོག བདག་པོ་ལས་མཉམ་སྤྱོད་བཀལ་དུས་ཞུ�"
+accessFailed = "ལཱ་འགུལ་འཇུག་མ་�ུབ�"
+accessDeniedBody = "�ྱེད་ལ་ཡིག་ཆ་འདི་ལ་འཛུལ་མི་ཆོག བདག་པོ་ལས་མཉམ་སྤྱོད་བཀལ་དུས་ཞུ�"
+accessDeniedTitle = "འཛུལ་ས་མེད"
+accessLimitedCommenter = "མཆན་བཀོད་ལས་འགུལ་མ་འབྱུང་བསྒུག་བཞིན� ཕབ་ལེན་དགོས་ན་བདག་པོས་ཞུན་དག་པའི་དབང་ཆ་བྱ་རོགས�"
+accessLimitedTitle = "ཚད་འཛིན་འཛུལ་ས"
+accessLimitedViewer = "འབྲེལ་�ག་འདི་ལྟ་ཙམ་ཡིན� ཕབ་ལེན་དགོས་ན་བདག་པོས་ཞུན་དག་པའི་དབང་ཆ་བྱ་རོགས�"
+createdAt = "གསར་བཟོས"
+download = "ཕབ་ལེན"
+downloadFailed = "ཡིག་ཆ་འདི་ཕབ་ལེན་མི་�ུབ�"
+expiredBody = "མཉམ་སྤྱོད་འབྲེལ་�ག་འདི་ནུས་མེད་ཡང་ན་དུས་ཡོལ་བྱས་ཟིན�"
+expiredTitle = "འབྲེལ་�ག་དུས་ཡོལ"
+goToLogin = "�ོ་འགོད་ལ་འགྲོ"
+loadFailed = "མཉམ་སྤྱོད་ཡིག་ཆ་�་ཕྱེ་མི་�ུབ�"
+loading = "མཉམ་སྤྱོད་འབྲེལ་�ག་སྒྲུབ་བཞིན..."
+loginPrompt = "མཉམ་སྤྱོད་ཡིག་ཆ་འདིར་འཛུལ་བར་�ོ་འགོད་བྱེད་རོགས�"
+loginRequired = "�ོ་འགོད་དགོས"
+openInApp = "Stirling PDF ནང་�་ཕྱེ"
+ownerLabel = "བདག་པོ"
+ownerUnknown = "མ་ཤེས"
+requiresLogin = "མཉམ་སྤྱོད་ཡིག་ཆ་འདི་ལ་�ོ་འགོད་དགོས�"
+roleCommenter = "མཆན་འགྲེལ་པ"
+roleEditor = "ཞུན་དག་པ"
+roleViewer = "ལྟ་མ�ན"
+shareHeading = "མཉམ་སྤྱོད་ཡིག་ཆ"
+titleDefault = "མཉམ་སྤྱོད་ཡིག་ཆ"
+tryAgain = "དུས་རབས་འགོར་�ེ་ཚོད་ལྟ་རོགས�"
+addUser = "�་སྣོན"
+commenterHint = "མཆན་འགྲེལ་ལས་འགུལ་མ་འབྱུང་བསྒུག་བཞིན�"
+copied = "འབྲེལ་�ག་འདྲ་བཤུས་བྱས"
+copy = "འདྲ་བཤུས"
+copyFailed = "འདྲ་བཤུས་ཕམ་པ"
+description = "ཡིག་ཆ་འདིའི་དོན་ལུགས་འབྲེལ་�ག་བཟོ� ནང་འཇུག་བྱས་པའི་མི་ཚོས་འབྲེལ་�ག་བརྒྱུད་ནས་འཛུལ་ཆོག."
+downloadsCount = "ཕབ་ལེན: {{count}}"
+emailWarningBody = "འདི་གློག་འཕྲིན་གྲངས་འཛིན་ལྟར་མ�ོང་བ་ཡིན� མི་འདི་ནི Stirling PDF སྤྱོད་མ�ན་མ་རེད་ན་ཡིག་ཆ་ལ་འཛུལ་མི་�ུབ�"
+emailWarningConfirm = "མཉམ་སྤྱོད་གང་རེད་ཀྱང་"
+emailWarningTitle = "གློག་འཕྲིན་གྲངས་འཛིན"
+errorTitle = "མཉམ་སྤྱོད་ཕམ་པ"
+failure = "མཉམ་སྤྱོད་འབྲེལ་�ག་བཟོ་མ་�ུབ ཚོད་ལྟ་རོགས�"
+fileLabel = "ཡིག་ཆ"
+generate = "འབྲེལ་�ག་བཟོ"
+generated = "མཉམ་སྤྱོད་འབྲེལ་�ག་བཟོ་ཟིན"
+hideActivity = "ལཱ་འགུལ་སྦ་བ"
+invalidUsername = "ནུས་ལྡན་མིང་ཡང་ན་གློག་འཕྲིན་འཇུག་རོགས�"
+lastAccessed = "མ�ར་མཇུག་འཛུལ་བ"
+linkAccessTitle = "མཉམ་སྤྱོད་འབྲེལ་�ག་འཛུལ་ས"
+linkLabel = "མཉམ་སྤྱོད་འབྲེལ་�ག"
+linksDisabled = "མཉམ་སྤྱོད་འབྲེལ་�ག་བཀག་ཟིན�"
+linksDisabledBody = "མཉམ་སྤྱོད་འབྲེལ་�ག་སར་བར་སྒྲིག་འགོད་གྲངས་ལས་བཀག་ཟིན�"
+manage = "མཉམ་སྤྱོད་དོ་དམ"
+manageDescription = "ཡིག་ཆ་འདིའི་མཉམ་སྤྱོད་འབྲེལ་�ག་བཟོ་དང་དོ་དམ་བྱེད�"
+manageLoadFailed = "མཉམ་སྤྱོད་འབྲེལ་�ག་འཇུག་མ་�ུབ�"
+manageTitle = "མཉམ་སྤྱོད་དོ་དམ"
+noActivity = "ལཱ་འགུལ་མེད�"
+noLinks = "མཉམ་སྤྱོད་འབྲེལ་�ག་མ་འདུག"
+noSharedUsers = "འཛུལ་ས་ཡོད་པའི་མི་མེད�"
+removeLink = "འབྲེལ་�ག་བསུབ"
+removeUser = "བསུབ"
+revokeFailed = "མཉམ་སྤྱོད་འབྲེལ་�ག་བསུབ་མ་�ུབ"
+revoked = "མཉམ་སྤྱོད་སྦྲེལ་མ�ུད་སུབ་ཟིན�"
+roleLabel = "ལས་འགན"
+sharingDisabled = "མཉམ་སྤྱོད་བཀག་ཡོད�"
+sharingDisabledBody = "�ྱེད་ཀྱི་སར་བར་སྒྲིག་འགོད་ཀྱིས་མཉམ་སྤྱོད་བཀག་བཞག་ཟིན�"
+sharedUsersTitle = "མཉམ་སྤྱོད་སྤྱོད་པ་ཚོ"
+title = "ཡིག་ཆ་མཉམ་སྤྱོད�"
+unknownUser = "ངོ་མ་ཤེས་པའི་སྤྱོད་པ�"
+userAddFailed = "སྤྱོད་པ་དེ་དང་མཉམ་སྤྱོད་བྱ་མི་�ུབ�"
+userAdded = "སྤྱོད་པ་དེ་མཉམ་སྤྱོད་�ོ་ཡིག་ནང་སྣོན་ཟིན�"
+usernameLabel = "སྤྱོད་མ�ན་མིང་ ཡང་ན་ གློག་འཕྲིན�"
+usernamePlaceholder = "སྤྱོད་མ�ན་མིང་ ཡང་ན་ གློག་འཕྲིན་བཙུགས�"
+userRemoveFailed = "སྤྱོད་པ་དེ་འདོར་མི་�ུབ�"
+userRemoved = "སྤྱོད་པ་དེ་མཉམ་སྤྱོད་�ོ་ཡིག་ནས་འདོར་ཟིན�"
+viewActivity = "འགུལ་སྒོ་ལྟ་བ�"
+viewed = "ལྟ་ཟིན�"
+viewsCount = "ལྟ་བ: {{count}}"
+downloaded = "ཕབ་ལེན་བྱས་ཟིན�"
+bulkDescription = "བདམས་པའི་ཡིག་ཆ་ཚང་མ་�ོ་འགོད་ཟིན་པའི་སྤྱོད་པ་ཚོ་དང་མཉམ་སྤྱོད་བྱེད་པར་སྦྲེལ་མ�ུད་གཅིག་གསར་བཟོ�"
+bulkTitle = "བདམས་པའི་ཡིག་ཆ་མཉམ་སྤྱོད�"
+copyLink = "མཉམ་སྤྱོད་སྦྲེལ་མ�ུད་འདྲ་བཤུས�"
+fileCount = "{{count}} ཡིག་ཆ་བདམས་ཟིན�"
+ownerOnly = "མ�ོ་བདག་�ོ་རང་ཙམ་གྱིས་མཉམ་སྤྱོད་དོ་དམ་བྱེད་ཆོག"
+selectSingleFile = "མཉམ་སྤྱོད་དོ་དམ་བྱེད་པར་ཡིག་ཆ་གཅིག་བདམས�"
+
+[storageUpload]
+description = "ད་ལྟའི་ཡིག་ཆ་འདི་�ྱེད་རང་གི་སྤྱོད་དེབ་དོན་ལ་སར་བར་གསོག་འཇོག་ནང་ཡར་བས�ུར་བྱེད�"
+errorTitle = "ཡར་བས�ུར་ཕམ་པ�"
+failure = "ཡར་བས�ུར་ཕམ་པ� �ོ་འགོད་དང་གསོག་འཇོག་སྒྲིག་འགོད་ཞིབ་བཤེར་བྱོས�"
+fileLabel = "ཡིག་ཆ"
+hint = "མང་མ�འི་སྦྲེལ་མ�ུད་དང་འཇུག་ཚུལ་ཚང་མ་�ྱེད་ཀྱི་སར་བར་སྒྲིག་འགོད་ཀྱིས་ཚོད་འཛིན་བྱས་ཡོད�"
+success = "སར་བར་ཡར་བས�ུར་ཚར་བ�"
+title = "སར་བར་ལ་ཡར་བས�ུར�"
+updateButton = "སར་བར་ནང་གསར་སྒྱུར�"
+uploadButton = "སར་བར་ལ་ཡར་བས�ུར�"
+bulkDescription = "བདམས་པའི་ཡིག་ཆ་ཚང་མ་�ྱེད་ཀྱི་སར་བར་གསོག་འཇོག་ནང་ཡར་བས�ུར་བྱེད�"
+bulkTitle = "བདམས་པའི་ཡིག་ཆ་ཡར་བས�ུར�"
+fileCount = "{{count}} ཡིག་ཆ་བདམས་ཟིན�"
+more = " +{{count}} དེ་ལས་མང་"
+
 [storage]
 approximateSize = "ཆེ་ཆུང་ཕལ་ཆེར་ཡོད�"
 fileTooLarge = "ཡིག་ཆ་ཆེ་དྲགས་འདུག ཡིག་ཆ་རེ་ལ་ཆེས་མ�ོ་བའི་ཚད་གཞི་ནི�"
@@ -7153,6 +7801,30 @@ title = "ལྟ་ཚུལ�/རྩོམ་སྒྲིག་པ� PDF"
 [warning]
 tooltipTitle = "ཉེན་བརྡ"
 
+[wetSignature.tooltip]
+header = "མིང་འགོད་བཟོ་�བས�"
+
+[wetSignature.tooltip.draw]
+bullet1 = "སྨྱུག་གུའི་�་དོག་དང་ཞེང་ཚད་སྲོལ་སྒྲིག"
+bullet2 = "གནོན་སུབས་བྱས་ནས་དགའ་ཚུལ་དེ་བྱེད་ཚར་བའི་བར་བས�ྱར་འབྲི�"
+bullet3 = "touch སྒྲིག་ཆས་(tablet, phone) ལ་བཀོལ་�ུབ�"
+description = "mouse ཡང་ན་ touchscreen སྤྱོད་ནས་ལག་འབྲིའི་མིང་འགོད་གསར་བཟོ� རང་སོའི་དངོས་མ�ོང་ཡོད་པའི་མིང་འགོད་ལ་མོས་ཆེ�"
+title = "མིང་འགོད་འབྲི�"
+
+[wetSignature.tooltip.type]
+bullet1 = "ཡིག་གཟུགས་མང་པོ་ནས་བདམས�"
+bullet2 = "ཡི་གེའི་ཆེ་ཆུང་དང་�་དོག་སྲོལ་སྒྲིག"
+bullet3 = "ཚད་ལྡན་མིང་འགོད་ལ་འོས་འཚམ�"
+description = "ཡིག་འབྲུས་བྱས་པའི་ཚིག་ཡིག་ནས་མིང་འགོད་གསར་བཟོ� མགྱོགས་དྲག་དང་མ�ུན་མོང་ ཚོང་ལས་ཡིག་ཆར་འཚམ�"
+title = "ཡིག་འབྲུས་ཀྱི་མིང་འགོད�"
+
+[wetSignature.tooltip.upload]
+bullet1 = "PNG, JPG དང་གཞན་དག་བརྙན་རྣམ་གྱི་རྣམ་གཞག་རྒྱབ་ས�ྱོར�"
+bullet2 = "འབྲས་བུ་ཡག་པོ་དགོས་པས་རྒྱབ་ལྗོངས་དྭངས་པོ་སྤྱོད་དགོས�"
+bullet3 = "མིང་འགོད་�ོངས་ལ་མཚུངས་པར་པར་རིས་ཀྱི་ཆེ་ཆུང་བས�ྱར་བཟོ་བྱེད�"
+description = "སྔོན་བཟོས་པའི་མིང་འགོད་པར་ཡར་བས�ུར� མིང་འགོད་བཤར་འབེབས་ཡང་ན་ཚོང་ལས་ལས་རྟགས་ཡོད་ན་འོས་འཚམ�"
+title = "མིང་འགོད་པར་ཡར་བས�ུར�"
+
 [watermark]
 completed = "ཆུ་རྟགས་�་སྣོན་གྱིས་�་སྣོན་བྱས�"
 desc = "PDF ཡིག་ཆ་ལ་ཡིག་ཆ་ཡང་ན་པར་རིས་ཀྱི་ཆུ་རྟགས་�་སྣོན་བྱེད�"
@@ -7333,6 +8005,7 @@ activeSession = "ཤུགས་ལྡན་གྱི་ཚོགས་འདུ
 addMembers = "འ�ུས་མི་�་སྣོན�"
 admin = "འཛིན་ས�ྱོང་�"
 confirmDelete = "�ྱེད་རང་གིས་སྤྱོད་མ�ན་འདི་སུབ་འདོད་ཡོད་དམ� བྱ་སྤྱོད་འདི་སེལ་མི་�ུབ�"
+confirmUnlock = "སྤྱོད་པ་འདིའི་རྩིས་�ྲོད་ཕྱེ་དགོས་པ་ལ་ངེས་པར་བཟོས་ཡོད་དམ?"
 deleteUser = "སྤྱོད་མ�ན་སུབ་པ�"
 deleteUserError = "སྤྱོད་མ�ན་བསུབས་མ་�ུབ་པ�"
 deleteUserSuccess = "སྤྱོད་མ�ན་གྱིས་བསུབ་པ་ལེགས་འགྲུབ་བྱུང་�"
@@ -7341,6 +8014,8 @@ disable = "ནུས་པ་འཇོམས་པ"
 disabled = "ཞ་བོ"
 editRole = "འགན་འཛིན�"
 enable = "སྲིད་པ"
+locked = "བཀག་ཡོད"
+lockedBadge = "བཀག་ཡོད"
 loading = "མི་ལ་ས�ྱེལ་འདྲེན་བྱེད་པ�"
 loginRequired = "ནང་འཇུག་�བས་ལམ་�ོག་མར་ལྕོགས་ཅན་བཟོ་བ�"
 member = "འ�ུས་མི�"
@@ -7350,6 +8025,9 @@ searchMembers = "འཚོལ་ཞིབ་ཚོགས་མི�..."
 status = "གོ་གནས"
 team = "རུ་�ག"
 title = "མི་དམངས"
+unlockAccount = "རྩིས་�ྲོད་ཕྱེ"
+unlockUserError = "སྤྱོད་པའི་རྩིས་�ྲོད་ཕྱེ་མི་�ུབ�"
+unlockUserSuccess = "སྤྱོད་པའི་རྩིས་�ྲོད་ཕྱེ་ཚར་བ�"
 user = "བེད་སྤྱོད�"
 
 [workspace.people.actions]
diff --git a/frontend/public/locales/ca-CA/translation.toml b/frontend/public/locales/ca-CA/translation.toml
index eede99b385..8e3ea9f5f8 100644
--- a/frontend/public/locales/ca-CA/translation.toml
+++ b/frontend/public/locales/ca-CA/translation.toml
@@ -8,6 +8,7 @@ black = "Negre"
 blue = "Blau"
 bored = "Avorrit esperant?"
 cancel = "Cancel·la"
+confirm = "Confirmar"
 changedCredsMessage = "Credencials canviades!"
 chooseFile = "Tria fitxer"
 close = "Tanca"
@@ -146,6 +147,7 @@ insufficientCredits = "Crèdits insuficients. Necessaris: {{requiredCredits}}, D
 loadingCredits = "Comprovant els crèdits..."
 loadingProStatus = "Comprovant l’estat de la subscripció..."
 noticeTopUpOrPlan = "No tens prou crèdits; recarrega o passa a un pla"
+accessInvite = "Convida"
 
 [account]
 accountSettings = "Opcions del compte"
@@ -1427,6 +1429,34 @@ title = "Processament"
 description = "Temps màxim d'espera d'una tasca de processament abans d'informar d'un error."
 label = "Temps d'espera del processament (segons)"
 
+[admin.settings.storage]
+description = "Controla les opcions d'emmagatzematge del servidor i de compartició."
+title = "Emmagatzematge i compartició de fitxers"
+
+[admin.settings.storage.enabled]
+description = "Permet als usuaris desar fitxers al servidor."
+label = "Habilita l'emmagatzematge de fitxers al servidor"
+
+[admin.settings.storage.sharing.email]
+description = "Permet compartir amb adreces de correu electrònic."
+label = "Habilita la compartició per correu electrònic"
+mailLink = "Configura els paràmetres de correu"
+mailNote = "Requereix una configuració de correu. "
+
+[admin.settings.storage.sharing.enabled]
+description = "Permet als usuaris compartir fitxers desats."
+label = "Habilita la compartició"
+
+[admin.settings.storage.sharing.links]
+description = "Permet compartir mitjançant enllaços per a usuaris amb sessió iniciada."
+frontendUrlLink = "Configura-ho als paràmetres del sistema"
+frontendUrlNote = "Requereix una Frontend URL. "
+label = "Habilita els enllaços de compartició"
+
+[admin.settings.storage.signing.enabled]
+description = "Permet als usuaris crear sessions de signatura de documents amb múltiples participants. Requereix tenir habilitat l'emmagatzematge de fitxers al servidor."
+label = "Habilita la signatura en grup (Alfa)"
+
 [admin.settings.unsavedChanges]
 cancel = "Continua editant"
 discard = "Descarta els canvis"
@@ -2059,7 +2089,19 @@ numbers = "Números/intervals: 5, 10-20"
 progressions = "Progressions: 3n, 4n+1"
 
 [certSign]
+allSigned = "Tots els participants han signat. A punt per finalitzar."
+awaitingSignatures = "En espera de signatures"
+signatureProgress = "{{signedCount}}/{{totalCount}} signatures"
 chooseCertificate = "Trieu el fitxer de certificat"
+declined = "Rebutjada"
+fetchFailed = "No s'han pogut carregar les dades de signatura"
+finalized = "Finalitzat"
+notified = "Pendent"
+partialNote = "Pots finalitzar abans amb les signatures actuals. Els participants sense signar s'exclouran."
+pending = "Pendent"
+readyToFinalize = "A punt per finalitzar"
+signed = "Signat"
+viewed = "Vist"
 chooseJksFile = "Trieu el fitxer JKS"
 chooseP12File = "Trieu el fitxer PKCS12"
 choosePfxFile = "Trieu el fitxer PFX"
@@ -2082,6 +2124,7 @@ title = "Signatura amb Certificat"
 invisible = "Invisible"
 stepTitle = "Aparença de la signatura"
 visible = "Visible"
+visibility = "Visibilitat"
 
 [certSign.appearance.options]
 title = "Detalls de la signatura"
@@ -2188,6 +2231,252 @@ bullet4 = "Pot usar certificats personalitzats per a la verificació"
 text = "Quan comproveu les signatures, l'eina us indica si són vàlides, qui ha signat el document, quan es va signar i si el document s'ha modificat des de la signatura."
 title = "Comprovació de signatures"
 
+[certSign.collab.finalize]
+button = "Finalitza i carrega el PDF signat"
+early = "Finalitza amb les signatures actuals"
+
+[certSign.collab.sessionDetail]
+addButton = "Afegeix participants"
+addParticipants = "Afegeix participants"
+addParticipantsError = "No s'han pogut afegir participants"
+backToList = "Torna a les sessions"
+deleteConfirm = "N'estàs segur? Això no es pot desfer."
+deleteError = "No s'ha pogut eliminar la sessió"
+deleted = "Sessió eliminada"
+deleteSession = "Elimina la sessió"
+dueDate = "Data límit"
+finalizeError = "No s'ha pogut finalitzar la sessió"
+loadPdfError = "No s'ha pogut carregar el PDF signat"
+loadSignedPdf = "Carrega el PDF signat als fitxers actius"
+messageLabel = "Missatge"
+noAdditionalInfo = "Sense informació addicional"
+owner = "Propietari"
+participantRemoved = "Participant eliminat"
+participants = "Participants"
+participantsAdded = "Participants afegits correctament"
+removeParticipant = "Elimina"
+removeParticipantError = "No s'ha pogut eliminar el participant"
+selectUsers = "Selecciona usuaris..."
+sessionInfo = "Informació de la sessió"
+workbenchTitle = "Gestió de la sessió"
+
+[certSign.collab.signRequest]
+addedToFiles = "Document afegit als fitxers actius"
+addSignature = "Afegeix la teva signatura"
+addToFiles = "Afegeix als fitxers actius"
+advancedSettings = "Paràmetres avançats"
+backToList = "Torna a les sol·licituds de signatura"
+certificateChoice = "Selecciona un certificat per signar"
+changeSignature = "Canvia la signatura"
+clearSignature = "Neteja la signatura"
+completeAndSign = "Completa i signa"
+createNewSignature = "Crea una signatura nova"
+declineButton = "Rebutja"
+decline = "Rebutja la sol·licitud"
+deleteSelected = "Elimina la signatura seleccionada"
+drawSignature = "Dibuixa la teva signatura a continuació"
+dueDate = "Data límit"
+fileTooLarge = "La mida del fitxer ha de ser inferior a 5 MB"
+fontFamily = "Família de lletra"
+fontSize = "Mida de lletra: {{size}}px"
+fontSizePlaceholder = "Mida"
+from = "De"
+invalidCertFile = "Selecciona un fitxer de certificat P12 o PFX"
+invalidFileType = "Selecciona un fitxer d'imatge"
+location = "Ubicació (opcional)"
+locationPlaceholder = "Des d'on signes?"
+message = "Missatge"
+noCertificate = "Selecciona un fitxer de certificat"
+noSignatures = "Col·loca almenys una signatura al PDF"
+p12File = "Fitxer de certificat P12/PFX"
+password = "Contrasenya del certificat"
+passwordPlaceholder = "Introdueix la contrasenya..."
+penColor = "Color del llapis"
+penSize = "Gruix del traç: {{size}}px"
+placementActive = "Fes clic al PDF per col·locar"
+placeSignatureButton = "Col·loca la signatura al PDF"
+reason = "Motiu (opcional)"
+reasonPlaceholder = "Per què signes?"
+removeImage = "Elimina la imatge"
+removeCertFile = "Elimina el fitxer"
+savedSignatures = "Signatures desades"
+selectFile = "Selecciona un fitxer d'imatge"
+selectSignatureTitle = "Selecciona o crea una signatura"
+signButton = "Signa el document"
+signatureInfo = "Aquests paràmetres els configura el propietari del document"
+signaturePlaced = "Signatura col·locada a la pàgina"
+signatureSettings = "Paràmetres de la signatura"
+signatureText = "Text de la signatura"
+signatureTextPlaceholder = "Introdueix el teu nom..."
+signatureTypeLabel = "Tipus de signatura"
+signingTitle = "Signatura"
+textColor = "Color del text"
+typeSignature = "Escriu el teu nom per crear una signatura"
+uploadCert = "Certificat personalitzat"
+uploadCertDesc = "Usa el teu certificat P12/PFX"
+uploadSignature = "Puja la imatge de la teva signatura"
+usePersonalCert = "Certificat personal"
+usePersonalCertDesc = "Generat automàticament per al teu compte"
+useServerCert = "Certificat de l'organització"
+useServerCertDesc = "Certificat compartit de l'organització"
+workbenchTitle = "Sol·licitud de signatura"
+
+[certSign.collab.signRequest.canvas]
+colorPickerTitle = "Tria el color del traç"
+continue = "Continua"
+
+[certSign.collab.signRequest.certModal]
+description = "Has col·locat {{count}} signatura(es). Tria el certificat per completar la signatura."
+sign = "Signa el document"
+certValidating = "S'està validant el certificat..."
+certValidUntil = "Certificat vàlid fins al {{date}}"
+certInvalid = "Certificat no vàlid: {{error}}"
+certInvalidFallback = "Certificat no vàlid"
+certNetworkError = "No s'ha pogut validar el certificat"
+title = "Configura el certificat"
+
+[certSign.collab.signRequest.image]
+hint = "Puja una imatge PNG o JPG de la teva signatura"
+
+[certSign.collab.signRequest.mode]
+move = "Mou la signatura"
+place = "Col·loca la signatura"
+title = "Mode de signatura o de moviment"
+
+[certSign.collab.signRequest.modeTabs]
+draw = "Dibuixa"
+image = "Puja"
+text = "Escriu"
+
+[certSign.collab.signRequest.placeSignature]
+message = "Fes clic al PDF per col·locar la teva signatura"
+title = "Col·loca la signatura"
+
+[certSign.collab.signRequest.preview]
+imageAlt = "Signatura seleccionada"
+missing = "Sense previsualització"
+textFallback = "Signatura"
+
+[certSign.collab.signRequest.saved]
+defaultCanvasLabel = "Signatura dibuixada"
+defaultImageLabel = "Signatura pujada"
+defaultLabel = "Signatura"
+defaultTextLabel = "Signatura escrita"
+delete = "Elimina la signatura"
+none = "No hi ha signatures desades"
+
+[certSign.collab.signRequest.signatureType]
+draw = "Dibuixa"
+type = "Escriu"
+upload = "Puja"
+
+[certSign.collab.signRequest.steps]
+back = "Enrere"
+cancelPlacement = "Cancel·la la col·locació"
+certificate = "Certificat"
+clickMultipleTimes = "Fes clic al PDF diverses vegades per col·locar signatures. Arrossega qualsevol signatura per moure-la o canviar-ne la mida."
+clickToPlace = "Fes clic al PDF on vulguis que aparegui la teva signatura."
+continue = "Continua a la selecció de certificat"
+continueToPlacement = "Continua a la col·locació"
+continueToReview = "Continua a la revisió"
+createSignature = "Crea la signatura"
+invisible = "Invisible"
+location = "Ubicació:"
+multipleSignatures = "{{count}} signatures s'aplicaran al PDF"
+oneSignature = "S'aplicarà 1 signatura al PDF"
+placeOnPdf = "Col·loca al PDF"
+reason = "Motiu:"
+reviewTitle = "Revisa abans de signar"
+signaturePlaced = "Signatura col·locada a la pàgina {{page}}. Pots ajustar-ne la posició fent-hi clic de nou o continuar a la revisió."
+visible = "Visible"
+visibility = "Visibilitat:"
+yourSignatures = "Les teves signatures ({{count}})"
+
+[certSign.collab.signRequest.text]
+colorLabel = "Color"
+fontLabel = "Tipus de lletra"
+fontSizeLabel = "Mida"
+fontSizePlaceholder = "16"
+label = "Text de la signatura"
+modalHint = "Introdueix el teu nom i fes clic a Continua per col·locar-lo al PDF."
+placeholder = "Introdueix el teu nom..."
+
+[certSign.collab.participant]
+certValidating = "S'està validant el certificat..."
+certValid = "✓ Certificat vàlid"
+certValidUntil = " fins al {{date}}"
+certInvalid = "✗ {{error}}"
+certInvalidFallback = "Certificat no vàlid"
+certNetworkError = "No s'ha pogut validar el certificat"
+
+[certSign.collab.addParticipants]
+add = "Afegeix {{count}} participants"
+back = "Enrere"
+configureSignatures = "Configura els paràmetres de la signatura"
+continue = "Continua als paràmetres de la signatura"
+reasonHelp = "Preconfigura un motiu de signatura per a aquests participants (opcional, el poden canviar en signar)"
+reasonPlaceholder = "p. ex. Aprovació, Revisió..."
+selectUsers = "Selecciona usuaris"
+
+[certSign.collab.sessionCreation]
+includeSummaryPage = "Inclou la pàgina de resum de signatures"
+includeSummaryPageHelp = "S'afegirà una pàgina de resum al final amb totes les metadades de les signatures. Les caixes de signatura del certificat digital a les pàgines individuals se suprimiran (les signatures manuscrites no es veuran afectades)."
+
+[certSign.collab.sessionList]
+active = "Activa"
+finalized = "Finalitzada"
+
+[certSign.collab.signatureSettings]
+description = "Configura com apareixeran les signatures per a tots els participants"
+title = "Aparença de la signatura"
+
+[certSign.collab.userSelector]
+inviteUsers = "Afegeix usuaris"
+loadError = "No s'han pogut carregar els usuaris"
+noTeam = "Sense equip"
+noUsers = "No s'han trobat altres usuaris."
+placeholder = "Selecciona usuaris..."
+
+[certSign.mobile]
+panelActions = "Accions"
+panelDocument = "Document"
+panelPeople = "Persones"
+
+[certSign.sessions]
+deleted = "Sessió eliminada"
+fetchFailed = "No s'han pogut carregar els detalls de la sessió"
+finalized = "Sessió finalitzada"
+loaded = "PDF signat carregat"
+pdfNotReady = "El PDF no està llest"
+pdfNotReadyDesc = "S'està generant el PDF signat. Torna-ho a provar d'aquí a un moment."
+
+[certificateChoice.tooltip]
+header = "Tipus de certificat"
+
+[certificateChoice.tooltip.organization]
+bullet1 = "Gestionat pels administradors del sistema"
+bullet2 = "Compartit entre els usuaris autoritzats"
+bullet3 = "Representa la identitat de l'empresa, no la individual"
+bullet4 = "Ideal per a: documents oficials, signatures d'equip"
+description = "Un certificat compartit proporcionat per la teva organització. S'utilitza per a la signatura a nivell d'empresa."
+title = "Certificat de l'organització"
+
+[certificateChoice.tooltip.personal]
+bullet1 = "Es genera automàticament en el primer ús"
+bullet2 = "Vinculat al teu compte d'usuari"
+bullet3 = "No es pot compartir amb altres usuaris"
+bullet4 = "Ideal per a: documents personals, responsabilitat individual"
+description = "Un certificat generat automàticament i únic per al teu compte d'usuari. Adequat per a signatures individuals."
+title = "Certificat personal"
+
+[certificateChoice.tooltip.upload]
+bullet1 = "Requereix fitxer P12/PFX i contrasenya"
+bullet2 = "Pot ser emès per Autoritats de Certificació externes"
+bullet3 = "Nivell de confiança més alt per a documents legals"
+bullet4 = "Ideal per a: contractes legalment vinculants, validació externa"
+description = "Utilitza el teu propi fitxer de certificat PKCS#12. Proporciona control total sobre les propietats del certificat."
+title = "Puja P12 personalitzat"
+
 [changeCreds]
 changePassword = "Estàs utilitzant les credencials d'inici de sessió per defecte. Si us plau, introdueix una nova contrasenya"
 changeUsername = "Actualitza el nom d'usuari. Es tancarà la sessió després d’actualitzar."
@@ -3242,6 +3531,46 @@ totalSelected = "Total seleccionat"
 unsupported = "No compatible"
 unzip = "Descomprimeix"
 uploadError = "No s'han pogut pujar alguns fitxers."
+copyCreated = "Còpia desada en aquest dispositiu."
+copyFailed = "No s'ha pogut crear una còpia."
+leaveShare = "Elimina de la meva llista"
+leaveShareFailed = "No s'ha pogut eliminar el fitxer compartit."
+leaveShareSuccess = "S'ha eliminat de la teva llista de compartits."
+removeBoth = "Elimina de tots dos llocs"
+removeFilePrompt = "Aquest fitxer està desat en aquest dispositiu i al teu servidor. Des d'on vols eliminar-lo?"
+removeFileTitle = "Elimina el fitxer"
+removeLocalOnly = "Només aquest dispositiu"
+removeServerFailed = "No s'ha pogut eliminar el fitxer del servidor."
+removeServerOnly = "Només del servidor"
+removeServerOnlyPrompt = "Aquest fitxer només està desat al teu servidor. Vols eliminar-lo del servidor?"
+removeServerSuccess = "S'ha eliminat del servidor."
+removeSharedPrompt = "Aquest fitxer està compartit amb tu. Pots eliminar-lo d'aquest dispositiu o de la teva llista de compartits."
+removeSharedServerOnlyBlockedPrompt = "Aquest fitxer està compartit amb tu i només està desat al servidor."
+removeSharedServerOnlyPrompt = "Aquest fitxer està compartit amb tu i només està desat al servidor. Vols eliminar-lo de la teva llista?"
+changesNotUploaded = "Canvis no pujats"
+cloudFile = "Fitxer al núvol"
+filterAll = "Tots"
+filterLocal = "Locals"
+filterSharedByMe = "Compartits per mi"
+filterSharedWithMe = "Compartits amb mi"
+lastSynced = "Última sincronització"
+localOnly = "Només local"
+makeCopy = "Fes-ne una còpia"
+owner = "Propietari"
+ownerUnknown = "Desconegut"
+share = "Comparteix"
+shareSelected = "Comparteix els seleccionats"
+sharedByYou = "Compartits per tu"
+sharedEditNoticeBody = "No tens drets d'edició de la versió al servidor d'aquest fitxer. Qualsevol edició que facis es desarà com a còpia local."
+sharedEditNoticeConfirm = "Entesos"
+sharedEditNoticeTitle = "Còpia al servidor només de lectura"
+sharedWithYou = "Compartits amb tu"
+sharing = "Compartició"
+storageState = "Emmagatzematge"
+synced = "Sincronitzat"
+updateOnServer = "Actualitza al servidor"
+uploadSelected = "Puja els seleccionats"
+uploadToServer = "Puja al servidor"
 
 [files]
 addFiles = "Afegeix fitxers"
@@ -3367,6 +3696,77 @@ title = "Sobre l'aplanament de PDFs"
 discord = "Discord"
 issues = "GitHub"
 
+[groupSigning.tooltip]
+header = "Sobre la signatura en grup"
+
+[groupSigning.tooltip.finalization]
+bullet1 = "Totes les signatures s'apliquen en l'ordre de participants que hagis especificat"
+bullet2 = "Pots finalitzar amb signatures parcials si cal"
+bullet3 = "Un cop finalitzada, la sessió no es pot modificar"
+description = "Quan tots els participants hagin signat (o decideixis finalitzar abans), pots generar el PDF final signat."
+title = "Procés de finalització"
+
+[groupSigning.tooltip.roles]
+bullet1 = "Propietari (tu): crea la sessió, configura els valors per defecte de la signatura, finalitza el document"
+bullet2 = "Participants: creen la seva signatura, trien el certificat, la col·loquen al PDF"
+bullet3 = "Els participants no poden modificar els paràmetres de visibilitat, motiu o ubicació de la signatura"
+description = "Tu controles els paràmetres d'aparença de la signatura per a tots els participants."
+title = "Rols dels participants"
+
+[groupSigning.tooltip.sequential]
+bullet1 = "El primer participant ha de signar abans que el segon pugui accedir al document"
+bullet2 = "Garanteix l'ordre de signatura adequat per al compliment legal"
+bullet3 = "Pots reordenar els participants arrossegant-los a la llista"
+description = "Els participants signen els documents en l'ordre que especifiquis. Cada signant rep una notificació quan és el seu torn."
+title = "Signatura seqüencial"
+
+[groupSigning.steps]
+back = "Enrere"
+completed = "Completat"
+current = "Actual"
+stepLabel = "Pas {{number}}"
+
+[groupSigning.steps.configureDefaults]
+continue = "Continua a la revisió"
+invisible = "Les signatures seran invisibles (només metadades)"
+locationLabel = "Ubicació:"
+preview = "Previsualitza"
+reasonLabel = "Motiu:"
+title = "Configura els paràmetres de la signatura"
+visible = "Les signatures seran visibles a la pàgina {{page}}"
+
+[groupSigning.steps.review]
+document = "Document"
+dueDate = "Data límit (opcional)"
+dueDatePlaceholder = "Selecciona la data límit..."
+invisible = "Invisible (només metadades)"
+location = "Ubicació:"
+logo = "Logotip:"
+logoHidden = "Sense logotip"
+logoShown = "Es mostra el logotip de Stirling PDF"
+participants = "Participants"
+reason = "Motiu:"
+send = "Envia les sol·licituds de signatura"
+signatureSettings = "Paràmetres de la signatura"
+title = "Revisa els detalls de la sessió"
+titleShort = "Revisa i envia"
+visibility = "Visibilitat:"
+visible = "Visible a la pàgina {{page}}"
+participantCount = "Signaran {{count}} participants en ordre"
+
+[groupSigning.steps.selectDocument]
+continue = "Continua a la selecció de participants"
+noFile = "Selecciona un únic fitxer PDF dels teus fitxers actius per crear una sessió de signatura."
+selectedFile = "Document seleccionat"
+title = "Selecciona el document"
+
+[groupSigning.steps.selectParticipants]
+continue = "Continua als paràmetres de la signatura"
+count = "{{count}} participants seleccionats"
+label = "Selecciona participants"
+placeholder = "Tria participants per signar..."
+title = "Tria participants"
+
 [getPdfInfo]
 downloadJson = "Descarrega JSON"
 downloads = "Descàrregues"
@@ -4460,7 +4860,10 @@ zoomOut = "Redueix"
 
 [viewer]
 cannotPreviewFile = "No es pot previsualitzar el fitxer"
+disableColorFilter = "Desactiva el filtre de color"
 dualPageView = "Vista de dues pàgines"
+enableDarkFilter = "Activa el filtre fosc"
+enableSepiaFilter = "Activa el filtre sèpia"
 firstPage = "Primera pàgina"
 lastPage = "Última pàgina"
 nextPage = "Pàgina següent"
@@ -4470,6 +4873,22 @@ singlePageView = "Vista d'una sola pàgina"
 unknownFile = "Fitxer desconegut"
 zoomIn = "Amplia"
 zoomOut = "Redueix"
+resetZoom = "Restableix el zoom"
+
+[viewer.nonPdf]
+fileTypeBadge = "Fitxer {{type}}"
+convertToPdf = "Converteix a PDF"
+loading = "Carregant..."
+emptyFile = "Fitxer buit"
+csvStats = "{{rows}} files · {{columns}} columnes · {{size}}"
+sortedBy = "Ordenat per: {{column}}"
+columnDefault = "Columna {{index}}"
+htmlPreviewWarning = "Previsualització HTML — els recursos externs poden no carregar-se · {{size}}"
+htmlPreview = "Previsualització HTML"
+invalidJson = "JSON no vàlid — es mostra el contingut en brut"
+textStats = "{{lines}} línies · {{size}}"
+lineNumbers = "Números de línia"
+renderMarkdown = "Renderitza Markdown"
 
 [viewer.attachments]
 title = "Adjunts"
@@ -4531,6 +4950,7 @@ toggleAttachments = "Mostra/amaga els adjunts"
 toggleTheme = "Canvia el tema"
 language = "Idioma"
 toggleAnnotations = "Mostra/oculta les anotacions"
+toggleLayers = "Commuta les capes"
 search = "Cerca al PDF"
 panMode = "Mode de desplaçament"
 applyRedactionsFirst = "Aplica primer les redaccions"
@@ -5407,20 +5827,72 @@ title = "Imprimir Fitxer"
 2 = "Introdueix el Nom de la Impresora"
 
 [quickAccess]
+access = "Accés"
+accessAddPerson = "Afegeix una altra persona"
+accessBack = "Enrere"
+accessCopyLink = "Copia l'enllaç"
+accessEmail = "Adreça de correu electrònic"
+accessEmailPlaceholder = "nom@empresa.com"
+accessFileLabel = "Fitxer"
+accessGeneral = "Accés general"
+accessInviteTitle = "Convida persones"
+accessOwner = "Propietari"
+accessPanel = "Accés al document"
+accessPeople = "Persones amb accés"
+accessRemove = "Elimina"
+accessRestricted = "Restringit"
+accessRestrictedHint = "Només les persones amb accés el poden obrir"
+accessRole = "Rol"
+accessRoleCommenter = "Comentarista"
+accessRoleEditor = "Editor"
+accessRoleViewer = "Lector"
+accessSelectedFile = "Fitxer seleccionat"
+accessSendInvite = "Envia la invitació"
+accessTitle = "Accés al document"
+accessYou = "Tu"
 account = "Compte"
+activeSessions = "Sessions actives"
+activeTab = "Actives"
 activity = "Registre"
 adminSettings = "Ajustos admin"
+allSessions = "Totes les sessions"
 allTools = "All Tools"
 automate = "Auto"
+back = "Enrere"
+certSign = "Signatura amb certificat"
+completedSessions = "Sessions completades"
+completedTab = "Completades"
 config = "Config"
+createNew = "Crea una sol·licitud nova"
+createSession = "Crea una sol·licitud de signatura"
+dueDate = "Data límit (opcional)"
 files = "Fitxers"
 help = "Ajuda"
+noActiveSessions = "No hi ha sol·licituds de signatura pendents ni sessions actives"
+noCompletedSessions = "No hi ha sessions completades"
+noFile = "Cap fitxer seleccionat"
 read = "Llegeix"
 reader = "Lector"
+refresh = "Actualitza"
+requestSignatures = "Sol·licita signatures"
+selectSingleFileToRequest = "Selecciona un únic fitxer PDF per sol·licitar signatures"
+selectedFile = "Fitxer seleccionat"
+selectUsers = "Selecciona usuaris per signar"
+selectUsersPlaceholder = "Tria participants..."
+sendingRequest = "Enviant..."
 settings = "Ajustos"
 showMeAround = "Fes-me una visita guiada"
 sign = "Signa"
+signatureRequests = "Sol·licituds de signatura"
+signYourself = "Signa-ho tu"
+newRequest = "Nova sol·licitud"
 tours = "Visites guiades"
+wetSign = "Afegeix signatura"
+filterMine = "Meves"
+filterOverdue = "Vençudes"
+filterSigned = "Signades"
+filterDeclined = "Rebutjades"
+searchDocuments = "Cerca documents…"
 
 [quickAccess.helpMenu]
 adminTour = "Visita per a administradors"
@@ -6050,11 +6522,75 @@ toolNotAvailableLocally = "El teu servidor de Stirling-PDF és fora de línia i
 expired = "La teva sessió ha expirat. Si us plau, actualitza la pàgina i torna a intentar-ho."
 refreshPage = "Actualitza la pàgina"
 
+[sessionManagement.tooltip]
+header = "Gestió de sessions de signatura"
+
+[sessionManagement.tooltip.addParticipants]
+bullet1 = "Nous participants afegits al final de l'ordre de signatura"
+bullet2 = "No es poden afegir participants després que la sessió estigui finalitzada"
+bullet3 = "Cada participant rep una notificació quan és el seu torn"
+description = "Pots afegir més participants a una sessió activa en qualsevol moment abans de la finalització."
+title = "Afegir participants"
+
+[sessionManagement.tooltip.finalization]
+bullet1 = "<b>Finalització completa</b>: Tots els participants han signat"
+bullet2 = "<b>Finalització parcial</b>: Alguns participants encara no han signat"
+bullet3 = "Els participants sense signar s'exclouran del document final"
+bullet4 = "Un cop finalitzada, pots carregar el PDF signat als fitxers actius"
+description = "La finalització combina totes les signatures en un únic PDF signat. Aquesta acció no es pot desfer."
+title = "Finalització de la sessió"
+
+[sessionManagement.tooltip.participantRemoval]
+bullet1 = "No es poden eliminar participants que ja hagin signat"
+bullet2 = "Els participants eliminats ja no rebran notificacions"
+bullet3 = "L'ordre de signatura s'ajusta automàticament"
+description = "Els participants es poden eliminar de les sessions abans que signin."
+title = "Eliminació de participants"
+
+[sessionManagement.tooltip.signatureOrder]
+bullet1 = "Cada signatura s'aplica de manera seqüencial al PDF"
+bullet2 = "Els signants posteriors poden veure les signatures anteriors"
+bullet3 = "Crític per a fluxos d'aprovació i cadenes de custòdia legals"
+description = "L'ordre que especifiquis en crear la sessió determina qui signa primer."
+title = "Ordre de signatura"
+
+[signatureSettings.tooltip]
+header = "Paràmetres d'aparença de la signatura"
+
+[signatureSettings.tooltip.location]
+bullet1 = "Exemples: \"Nova York, EUA\", \"Oficina de Londres\", \"En remot\""
+bullet2 = "No és el mateix que la posició a la pàgina"
+bullet3 = "Pot ser necessari en algunes jurisdiccions legals"
+description = "Ubicació geogràfica opcional on s'ha aplicat la signatura. S'emmagatzema a les metadades del certificat."
+title = "Ubicació de la signatura"
+
+[signatureSettings.tooltip.logo]
+bullet1 = "Es mostra junt amb la signatura i el text"
+bullet2 = "Admet formats PNG, JPG"
+bullet3 = "Millora l'aparença professional"
+description = "Afegeix un logotip d'empresa a les signatures visibles per a marca i autenticitat."
+title = "Logotip de l'empresa"
+
+[signatureSettings.tooltip.reason]
+bullet1 = "Exemples: \"Aprovació\", \"Acord de contracte\", \"Revisió completada\""
+bullet2 = "Visible a les propietats de la signatura del PDF"
+bullet3 = "Útil per a pistes d'auditoria i compliment"
+description = "Text opcional que explica per què es signa el document. S'emmagatzema a les metadades del certificat."
+title = "Motiu de la signatura"
+
+[signatureSettings.tooltip.visibility]
+bullet1 = "<b>Visible</b>: La signatura apareix al PDF amb aparença personalitzada"
+bullet2 = "<b>Invisible</b>: Certificat incrustat sense marca visual"
+bullet3 = "Les signatures invisibles encara ofereixen validació criptogràfica"
+description = "Controla si la signatura és visible al document o s'incrusta de manera invisible."
+title = "Visibilitat de la signatura"
+
 [settings.configuration]
 advanced = "Avançat"
 database = "Base de dades"
 endpoints = "Endpoints"
 features = "Funcions"
+storageSharing = "Emmagatzematge i compartició de fitxers"
 systemSettings = "Configuració del sistema"
 title = "Configuració"
 
@@ -6332,10 +6868,13 @@ title = "Inicia sessió a Stirling"
 [setup.selfhosted]
 link = "o connecteu-vos a un compte autoallotjat"
 subtitle = "Introdueix les credencials del servidor"
+changeServerLocked = "La teva organització ha restringit aquesta aplicació a un servidor específic"
 switchToLocal = "Utilitza les eines locals"
 title = "Inicia sessió al servidor"
 
 [setup.selfhosted.unreachable]
+changeServer = "Connecta't a un altre servidor"
+changeServerLocked = "La teva organització ha restringit aquesta aplicació a un servidor específic"
 continueOffline = "Utilitza les eines locals"
 message = "No s’ha pogut accedir a {{url}}. Comprova que el servidor s’està executant i és accessible."
 retry = "Torna-ho a provar"
@@ -6529,6 +7068,15 @@ saved = "Desades"
 text = "Text"
 title = "Tipus de signatura"
 
+[signRequest]
+declined = "S'ha rebutjat la sol·licitud de signatura"
+fetchFailed = "No s'ha pogut carregar la sol·licitud de signatura"
+signed = "Document signat correctament"
+
+[signSession]
+createFailed = "No s'ha pogut crear la sol·licitud de signatura"
+created = "S'ha enviat la sol·licitud de signatura"
+
 [signup]
 accountCreatedSuccessfully = "Compte creat correctament! Ara podeu iniciar sessió."
 alreadyHaveAccount = "Ja teniu compte? Inicieu sessió"
@@ -6807,6 +7355,106 @@ title = "Divideix PDF per Capítols"
 [splitPdfByChapters]
 tags = "dividir,capítols,marcadors,organitza"
 
+[storageShare]
+accessed = "Accedit"
+accessDenied = "No tens accés a aquest fitxer compartit. Demana al propietari que el comparteixi amb tu."
+accessFailed = "No s'ha pogut carregar l'activitat."
+accessDeniedBody = "No tens accés a aquest fitxer. Demana al propietari que el comparteixi amb tu."
+accessDeniedTitle = "Sense accés"
+accessLimitedCommenter = "L'accés per comentar arribarà aviat. Demana al propietari accés d'editor si necessites descarregar."
+accessLimitedTitle = "Accés limitat"
+accessLimitedViewer = "Aquest enllaç és només de visualització. Demana al propietari accés d'editor si necessites descarregar."
+createdAt = "Creat"
+download = "Descarrega"
+downloadFailed = "No es pot descarregar aquest fitxer."
+expiredBody = "Aquest enllaç de compartició no és vàlid o ha caducat."
+expiredTitle = "Enllaç caducat"
+goToLogin = "Ves a l'inici de sessió"
+loadFailed = "No es pot obrir el fitxer compartit."
+loading = "Carregant l'enllaç de compartició..."
+loginPrompt = "Inicia sessió per accedir a aquest fitxer compartit."
+loginRequired = "Cal iniciar sessió"
+openInApp = "Obre a Stirling PDF"
+ownerLabel = "Propietari"
+ownerUnknown = "Desconegut"
+requiresLogin = "Aquest fitxer compartit requereix iniciar sessió."
+roleCommenter = "Comentarista"
+roleEditor = "Editor"
+roleViewer = "Lector"
+shareHeading = "Fitxer compartit"
+titleDefault = "Fitxer compartit"
+tryAgain = "Torna-ho a provar més tard."
+addUser = "Afegeix"
+commenterHint = "La funció de comentar arribarà aviat."
+copied = "Enllaç copiat al porta-retalls"
+copy = "Copia"
+copyFailed = "No s'ha pogut copiar"
+description = "Crea un enllaç de compartició per a aquest fitxer. Els usuaris amb sessió iniciada i l'enllaç hi podran accedir."
+downloadsCount = "Descàrregues: {{count}}"
+emailWarningBody = "Això sembla una adreça de correu electrònic. Si aquesta persona no és usuària de Stirling PDF, no podrà accedir al fitxer."
+emailWarningConfirm = "Comparteix igualment"
+emailWarningTitle = "Adreça de correu electrònic"
+errorTitle = "No s'ha pogut compartir"
+failure = "No s'ha pogut generar un enllaç de compartició. Torna-ho a provar."
+fileLabel = "Fitxer"
+generate = "Genera l'enllaç"
+generated = "S'ha generat l'enllaç de compartició"
+hideActivity = "Amaga l'activitat"
+invalidUsername = "Introdueix un nom d'usuari o una adreça de correu electrònic vàlids."
+lastAccessed = "Últim accés"
+linkAccessTitle = "Accés per enllaç"
+linkLabel = "Enllaç de compartició"
+linksDisabled = "Els enllaços de compartició estan desactivats."
+linksDisabledBody = "Els enllaços de compartició estan desactivats per la configuració del teu servidor."
+manage = "Gestiona la compartició"
+manageDescription = "Crea i gestiona enllaços per compartir aquest fitxer."
+manageLoadFailed = "No s'han pogut carregar els enllaços de compartició."
+manageTitle = "Gestiona la compartició"
+noActivity = "Encara no hi ha activitat."
+noLinks = "Encara no hi ha enllaços de compartició actius."
+noSharedUsers = "Encara no hi ha usuaris amb accés."
+removeLink = "Elimina l'enllaç"
+removeUser = "Elimina"
+revokeFailed = "No s'ha pogut eliminar l'enllaç de compartició."
+revoked = "S'ha eliminat l'enllaç de compartició"
+roleLabel = "Rol"
+sharingDisabled = "La compartició està desactivada."
+sharingDisabledBody = "La compartició s'ha desactivat per la configuració del servidor."
+sharedUsersTitle = "Usuaris amb accés compartit"
+title = "Compartir fitxer"
+unknownUser = "Usuari desconegut"
+userAddFailed = "No s'ha pogut compartir amb aquest usuari."
+userAdded = "Usuari afegit a la llista de compartició."
+usernameLabel = "Nom d'usuari o correu electrònic"
+usernamePlaceholder = "Introduïu un nom d'usuari o un correu electrònic"
+userRemoveFailed = "No s'ha pogut eliminar aquest usuari."
+userRemoved = "Usuari eliminat de la llista de compartició."
+viewActivity = "Veure l'activitat"
+viewed = "Vist"
+viewsCount = "Visualitzacions: {{count}}"
+downloaded = "Baixat"
+bulkDescription = "Creeu un enllaç per compartir tots els fitxers seleccionats amb usuaris que han iniciat la sessió."
+bulkTitle = "Compartir fitxers seleccionats"
+copyLink = "Copia l'enllaç per compartir"
+fileCount = "{{count}} fitxers seleccionats"
+ownerOnly = "Només el propietari pot gestionar la compartició."
+selectSingleFile = "Seleccioneu un sol fitxer per gestionar la compartició."
+
+[storageUpload]
+description = "Això puja el fitxer actual a l'emmagatzematge del servidor perquè hi pugueu accedir."
+errorTitle = "La pujada ha fallat"
+failure = "La pujada ha fallat. Comproveu l'inici de sessió i la configuració d'emmagatzematge."
+fileLabel = "Fitxer"
+hint = "Els enllaços públics i els modes d'accés es controlen per la configuració del servidor."
+success = "S'ha pujat al servidor"
+title = "Pujar al servidor"
+updateButton = "Actualitza al servidor"
+uploadButton = "Puja al servidor"
+bulkDescription = "Això puja els fitxers seleccionats a l'emmagatzematge del servidor."
+bulkTitle = "Pujar fitxers seleccionats"
+fileCount = "{{count}} fitxers seleccionats"
+more = " +{{count}} més"
+
 [storage]
 approximateSize = "Mida aproximada"
 fileTooLarge = "Fitxer massa gran. La mida màxima per fitxer és"
@@ -7153,6 +7801,30 @@ title = "Visualitza/edita PDF"
 [warning]
 tooltipTitle = "Avís"
 
+[wetSignature.tooltip]
+header = "Mètodes de creació de signatura"
+
+[wetSignature.tooltip.draw]
+bullet1 = "Personalitzeu el color i el gruix del traç"
+bullet2 = "Esborreu i torneu a dibuixar fins que estigueu satisfets"
+bullet3 = "Funciona en dispositius tàctils (tauletes, telèfons)"
+description = "Creeu una signatura manuscrita amb el ratolí o la pantalla tàctil. Ideal per a signatures personals i autèntiques."
+title = "Dibuixar la signatura"
+
+[wetSignature.tooltip.type]
+bullet1 = "Trieu entre diversos tipus de lletra"
+bullet2 = "Personalitzeu la mida i el color del text"
+bullet3 = "Perfecte per a signatures estandarditzades"
+description = "Genereu una signatura a partir de text teclejat. Ràpid i coherent, adequat per a documents empresarials."
+title = "Escriure la signatura"
+
+[wetSignature.tooltip.upload]
+bullet1 = "Admet PNG, JPG i altres formats d'imatge"
+bullet2 = "Es recomana fons transparents per obtenir els millors resultats"
+bullet3 = "La imatge es redimensionarà per ajustar-se a l'àrea de la signatura"
+description = "Pugeu una imatge de signatura ja creada. Ideal si teniu una signatura escanejada o el logotip de l'empresa."
+title = "Pujar imatge de la signatura"
+
 [watermark]
 completed = "Marca d'aigua afegida"
 desc = "Afegeix marques d'aigua de text o d'imatge als fitxers PDF"
@@ -7333,6 +8005,7 @@ activeSession = "Sessió activa"
 addMembers = "Afegeix membres"
 admin = "Administrador"
 confirmDelete = "Esteu segur que voleu suprimir aquest usuari? Aquesta acció no es pot desfer."
+confirmUnlock = "Segur que voleu desbloquejar aquest compte d'usuari?"
 deleteUser = "Suprimeix l’usuari"
 deleteUserError = "No s’ha pogut suprimir l’usuari"
 deleteUserSuccess = "Usuari suprimit correctament"
@@ -7341,6 +8014,8 @@ disable = "Deshabilita"
 disabled = "Desactivat"
 editRole = "Edita el rol"
 enable = "Habilita"
+locked = "bloquejat"
+lockedBadge = "Bloquejat"
 loading = "Carregant persones..."
 loginRequired = "Habilita primer el mode d'inici de sessió"
 member = "Membre"
@@ -7350,6 +8025,9 @@ searchMembers = "Cerca membres..."
 status = "Estat"
 team = "Equip"
 title = "Persones"
+unlockAccount = "Desbloqueja el compte"
+unlockUserError = "No s'ha pogut desbloquejar el compte d'usuari"
+unlockUserSuccess = "El compte d'usuari s'ha desbloquejat correctament"
 user = "Usuari"
 
 [workspace.people.actions]
diff --git a/frontend/public/locales/cs-CZ/translation.toml b/frontend/public/locales/cs-CZ/translation.toml
index 1b6046308d..5317d91191 100644
--- a/frontend/public/locales/cs-CZ/translation.toml
+++ b/frontend/public/locales/cs-CZ/translation.toml
@@ -8,6 +8,7 @@ black = "Černá"
 blue = "Modrá"
 bored = "Nudíte se při �ekání?"
 cancel = "Zrušit"
+confirm = "Potvrdit"
 changedCredsMessage = "Přihlašovací údaje byly změněny!"
 chooseFile = "Vybrat soubor"
 close = "Zavřít"
@@ -146,6 +147,7 @@ insufficientCredits = "Nedostatek kreditů. Požadováno: {{requiredCredits}}, D
 loadingCredits = "Kontrola kreditů..."
 loadingProStatus = "Kontrola stavu předplatného..."
 noticeTopUpOrPlan = "Není dostatek kreditů, dobijte je nebo přejděte na tarif"
+accessInvite = "Pozvat"
 
 [account]
 accountSettings = "Nastavení ú�tu"
@@ -1427,6 +1429,34 @@ title = "Zpracování"
 description = "Maximální doba �ekání na úlohu zpracování před ohlášením chyby."
 label = "Časový limit zpracování (sekundy)"
 
+[admin.settings.storage]
+description = "Spravujte úložiště serveru a možnosti sdílení."
+title = "Ukládání souborů a sdílení"
+
+[admin.settings.storage.enabled]
+description = "Umožnit uživatelům ukládat soubory na serveru."
+label = "Povolit ukládání souborů na serveru"
+
+[admin.settings.storage.sharing.email]
+description = "Umožnit sdílení s e-mailovými adresami."
+label = "Povolit sdílení e-mailem"
+mailLink = "Nastavit poštu"
+mailNote = "Vyžaduje nastavení pošty. "
+
+[admin.settings.storage.sharing.enabled]
+description = "Umožnit uživatelům sdílet uložené soubory."
+label = "Povolit sdílení"
+
+[admin.settings.storage.sharing.links]
+description = "Umožnit sdílení prostřednictvím odkazů pro přihlášené uživatele."
+frontendUrlLink = "Nastavit v nastavení systému"
+frontendUrlNote = "Vyžaduje Frontend URL. "
+label = "Povolit odkazy ke sdílení"
+
+[admin.settings.storage.signing.enabled]
+description = "Umožnit uživatelům vytvářet relace podepisování s více ú�astníky. Vyžaduje povolené ukládání souborů na serveru."
+label = "Povolit skupinové podepisování (Alpha)"
+
 [admin.settings.unsavedChanges]
 cancel = "Pokra�ovat v úpravách"
 discard = "Zahodit změny"
@@ -2059,7 +2089,19 @@ numbers = "Čísla/rozsahy: 5, 10-20"
 progressions = "Progrese: 3n, 4n+1"
 
 [certSign]
+allSigned = "Všichni ú�astníci podepsali. Připraveno k dokon�ení."
+awaitingSignatures = "Čeká na podpisy"
+signatureProgress = "{{signedCount}}/{{totalCount}} podpisů"
 chooseCertificate = "Vyberte soubor s certifikátem"
+declined = "Odmítnuto"
+fetchFailed = "Nepodařilo se na�íst data o podepisování"
+finalized = "Dokon�eno"
+notified = "Oznámeno"
+partialNote = "Můžete dokon�it dříve s aktuálními podpisy. Nepodepsaní ú�astníci budou vylou�eni."
+pending = "Čeká"
+readyToFinalize = "Připraveno k dokon�ení"
+signed = "Podepsáno"
+viewed = "Zobrazeno"
 chooseJksFile = "Vyberte soubor JKS"
 chooseP12File = "Vyberte soubor PKCS12"
 choosePfxFile = "Vyberte soubor PFX"
@@ -2082,6 +2124,7 @@ title = "Podepisování certifikátem"
 invisible = "Neviditelné"
 stepTitle = "Vzhled podpisu"
 visible = "Viditelné"
+visibility = "Viditelnost"
 
 [certSign.appearance.options]
 title = "Podrobnosti podpisu"
@@ -2188,6 +2231,252 @@ bullet4 = "Může použít vlastní certifikáty k ověření"
 text = "Při kontrole podpisů nástroj sdělí, zda jsou platné, kdo dokument podepsal, kdy byl podepsán a zda byl po podpisu změněn."
 title = "Kontrola podpisů"
 
+[certSign.collab.finalize]
+button = "Dokon�it a na�íst podepsané PDF"
+early = "Dokon�it s aktuálními podpisy"
+
+[certSign.collab.sessionDetail]
+addButton = "Přidat ú�astníky"
+addParticipants = "Přidat ú�astníky"
+addParticipantsError = "Nepodařilo se přidat ú�astníky"
+backToList = "Zpět na relace"
+deleteConfirm = "Opravdu? Tuto akci nelze vrátit."
+deleteError = "Relaci se nepodařilo smazat"
+deleted = "Relace smazána"
+deleteSession = "Smazat relaci"
+dueDate = "Termín"
+finalizeError = "Nepodařilo se dokon�it relaci"
+loadPdfError = "Nepodařilo se na�íst podepsané PDF"
+loadSignedPdf = "Na�íst podepsané PDF mezi aktivní soubory"
+messageLabel = "Zpráva"
+noAdditionalInfo = "Žádné další informace"
+owner = "Vlastník"
+participantRemoved = "Ú�astník odstraněn"
+participants = "Ú�astníci"
+participantsAdded = "Ú�astníci byli úspěšně přidáni"
+removeParticipant = "Odebrat"
+removeParticipantError = "Nepodařilo se odebrat ú�astníka"
+selectUsers = "Vyberte uživatele..."
+sessionInfo = "Informace o relaci"
+workbenchTitle = "Správa relací"
+
+[certSign.collab.signRequest]
+addedToFiles = "Dokument přidán mezi aktivní soubory"
+addSignature = "Přidat svůj podpis"
+addToFiles = "Přidat mezi aktivní soubory"
+advancedSettings = "Pokro�ilá nastavení"
+backToList = "Zpět na požadavky na podpis"
+certificateChoice = "Vyberte certifikát pro podepsání"
+changeSignature = "Změnit podpis"
+clearSignature = "Vymazat podpis"
+completeAndSign = "Dokon�it a podepsat"
+createNewSignature = "Vytvořit nový podpis"
+declineButton = "Odmítnout"
+decline = "Odmítnout požadavek"
+deleteSelected = "Smazat vybraný podpis"
+drawSignature = "Nakreslete níže svůj podpis"
+dueDate = "Termín"
+fileTooLarge = "Velikost souboru musí být menší než 5 MB"
+fontFamily = "Písmo"
+fontSize = "Velikost písma: {{size}}px"
+fontSizePlaceholder = "Velikost"
+from = "Od"
+invalidCertFile = "Vyberte soubor certifikátu P12 nebo PFX"
+invalidFileType = "Vyberte soubor obrázku"
+location = "Místo (volitelné)"
+locationPlaceholder = "Odkud podepisujete?"
+message = "Zpráva"
+noCertificate = "Vyberte soubor certifikátu"
+noSignatures = "Umístěte na PDF alespoň jeden podpis"
+p12File = "Soubor certifikátu P12/PFX"
+password = "Heslo certifikátu"
+passwordPlaceholder = "Zadejte heslo..."
+penColor = "Barva pera"
+penSize = "Tloušťka pera: {{size}}px"
+placementActive = "Klikněte do PDF pro umístění"
+placeSignatureButton = "Umístit podpis na PDF"
+reason = "Důvod (volitelné)"
+reasonPlaceholder = "Pro� podepisujete?"
+removeImage = "Odebrat obrázek"
+removeCertFile = "Odebrat soubor"
+savedSignatures = "Uložené podpisy"
+selectFile = "Vyberte soubor obrázku"
+selectSignatureTitle = "Vyberte nebo vytvořte podpis"
+signButton = "Podepsat dokument"
+signatureInfo = "Tato nastavení jsou ur�ena vlastníkem dokumentu"
+signaturePlaced = "Podpis umístěn na stránku"
+signatureSettings = "Nastavení podpisu"
+signatureText = "Text podpisu"
+signatureTextPlaceholder = "Zadejte své jméno..."
+signatureTypeLabel = "Typ podpisu"
+signingTitle = "Podepisování"
+textColor = "Barva textu"
+typeSignature = "Zadejte své jméno pro vytvoření podpisu"
+uploadCert = "Vlastní certifikát"
+uploadCertDesc = "Použijte vlastní certifikát P12/PFX"
+uploadSignature = "Nahrajte obrázek svého podpisu"
+usePersonalCert = "Osobní certifikát"
+usePersonalCertDesc = "Automaticky vytvořen pro váš ú�et"
+useServerCert = "Certifikát organizace"
+useServerCertDesc = "Sdílený certifikát organizace"
+workbenchTitle = "Požadavek na podpis"
+
+[certSign.collab.signRequest.canvas]
+colorPickerTitle = "Vyberte barvu tahu"
+continue = "Pokra�ovat"
+
+[certSign.collab.signRequest.certModal]
+description = "Umístili jste {{count}} podpis(ů). Vyberte certifikát pro dokon�ení podepisování."
+sign = "Podepsat dokument"
+certValidating = "Ověřování certifikátu..."
+certValidUntil = "Certifikát platný do {{date}}"
+certInvalid = "Certifikát je neplatný: {{error}}"
+certInvalidFallback = "Neplatný certifikát"
+certNetworkError = "Nepodařilo se ověřit certifikát"
+title = "Nastavení certifikátu"
+
+[certSign.collab.signRequest.image]
+hint = "Nahrajte obrázek podpisu ve formátu PNG nebo JPG"
+
+[certSign.collab.signRequest.mode]
+move = "Přesunout podpis"
+place = "Umístit podpis"
+title = "Režim podpisu nebo přesunu"
+
+[certSign.collab.signRequest.modeTabs]
+draw = "Kreslit"
+image = "Nahrát"
+text = "Psát"
+
+[certSign.collab.signRequest.placeSignature]
+message = "Klikněte na PDF pro umístění podpisu"
+title = "Umístit podpis"
+
+[certSign.collab.signRequest.preview]
+imageAlt = "Vybraný podpis"
+missing = "Žádný náhled"
+textFallback = "Podpis"
+
+[certSign.collab.signRequest.saved]
+defaultCanvasLabel = "Nakreslený podpis"
+defaultImageLabel = "Nahraný podpis"
+defaultLabel = "Podpis"
+defaultTextLabel = "Zadaný podpis"
+delete = "Smazat podpis"
+none = "Žádné uložené podpisy"
+
+[certSign.collab.signRequest.signatureType]
+draw = "Kresba"
+type = "Psát"
+upload = "Nahrát"
+
+[certSign.collab.signRequest.steps]
+back = "Zpět"
+cancelPlacement = "Zrušit umístění"
+certificate = "Certifikát"
+clickMultipleTimes = "Klikněte do PDF vícekrát pro umístění podpisů. Libovolný podpis přesuňte nebo změňte jeho velikost přetažením."
+clickToPlace = "Klikněte do PDF tam, kde chcete, aby se podpis zobrazil."
+continue = "Pokra�ovat k výběru certifikátu"
+continueToPlacement = "Pokra�ovat k umístění"
+continueToReview = "Pokra�ovat ke kontrole"
+createSignature = "Vytvořit podpis"
+invisible = "Neviditelný"
+location = "Místo:"
+multipleSignatures = "{{count}} podpisů bude aplikováno na PDF"
+oneSignature = "Na PDF bude aplikován 1 podpis"
+placeOnPdf = "Umístit na PDF"
+reason = "Důvod:"
+reviewTitle = "Zkontrolujte před podpisem"
+signaturePlaced = "Podpis umístěn na stránku {{page}}. Polohu můžete upravit opětovným kliknutím nebo pokra�ovat ke kontrole."
+visible = "Viditelný"
+visibility = "Viditelnost:"
+yourSignatures = "Vaše podpisy ({{count}})"
+
+[certSign.collab.signRequest.text]
+colorLabel = "Barva"
+fontLabel = "Písmo"
+fontSizeLabel = "Velikost"
+fontSizePlaceholder = "16"
+label = "Text podpisu"
+modalHint = "Zadejte své jméno a poté klikněte na Pokra�ovat pro umístění do PDF."
+placeholder = "Zadejte své jméno..."
+
+[certSign.collab.participant]
+certValidating = "Ověřování certifikátu..."
+certValid = "✓ Certifikát je platný"
+certValidUntil = " do {{date}}"
+certInvalid = "✗ {{error}}"
+certInvalidFallback = "Neplatný certifikát"
+certNetworkError = "Nepodařilo se ověřit certifikát"
+
+[certSign.collab.addParticipants]
+add = "Přidat {{count}} ú�astníka(ů)"
+back = "Zpět"
+configureSignatures = "Konfigurovat nastavení podpisu"
+continue = "Pokra�ovat k nastavení podpisu"
+reasonHelp = "Přednastavte důvod podpisu pro tyto ú�astníky (volitelné, při podpisu jej mohou změnit)"
+reasonPlaceholder = "např. Schválení, Kontrola..."
+selectUsers = "Vybrat uživatele"
+
+[certSign.collab.sessionCreation]
+includeSummaryPage = "Zahrnout souhrnnou stránku podpisů"
+includeSummaryPageHelp = "Na konec bude přidána souhrnná stránka se všemi metadaty podpisů. Ráme�ky digitálního certifikátu na jednotlivých stránkách budou potla�eny (vlastnoru�ní podpisy nejsou ovlivněny)."
+
+[certSign.collab.sessionList]
+active = "Aktivní"
+finalized = "Dokon�eno"
+
+[certSign.collab.signatureSettings]
+description = "Nastavte, jak budou podpisy vypadat pro všechny ú�astníky"
+title = "Vzhled podpisu"
+
+[certSign.collab.userSelector]
+inviteUsers = "Přidat uživatele"
+loadError = "Nepodařilo se na�íst uživatele"
+noTeam = "Žádný tým"
+noUsers = "Nebyli nalezeni žádní další uživatelé."
+placeholder = "Vyberte uživatele..."
+
+[certSign.mobile]
+panelActions = "Akce"
+panelDocument = "Dokument"
+panelPeople = "Lidé"
+
+[certSign.sessions]
+deleted = "Relace smazána"
+fetchFailed = "Nepodařilo se na�íst podrobnosti relace"
+finalized = "Relace dokon�ena"
+loaded = "Podepsané PDF na�teno"
+pdfNotReady = "PDF není připraveno"
+pdfNotReadyDesc = "Podepsané PDF se generuje. Zkuste to prosím za okamžik."
+
+[certificateChoice.tooltip]
+header = "Typy certifikátů"
+
+[certificateChoice.tooltip.organization]
+bullet1 = "Spravováno správci systému"
+bullet2 = "Sdíleno mezi oprávněnými uživateli"
+bullet3 = "Reprezentuje identitu spole�nosti, nikoli jednotlivce"
+bullet4 = "Vhodné pro: Oficiální dokumenty, týmové podpisy"
+description = "Sdílený certifikát poskytovaný vaší organizací. Používá se pro firemní oprávnění k podepisování."
+title = "Certifikát organizace"
+
+[certificateChoice.tooltip.personal]
+bullet1 = "Vygenerován automaticky při prvním použití"
+bullet2 = "Navázán na váš uživatelský ú�et"
+bullet3 = "Nelze sdílet s jinými uživateli"
+bullet4 = "Vhodné pro: Osobní dokumenty, individuální odpovědnost"
+description = "Automaticky generovaný certifikát jedine�ný pro váš uživatelský ú�et. Vhodný pro individuální podpisy."
+title = "Osobní certifikát"
+
+[certificateChoice.tooltip.upload]
+bullet1 = "Vyžaduje soubor P12/PFX a heslo"
+bullet2 = "Může být vydán externími certifika�ními autoritami"
+bullet3 = "Vyšší úroveň důvěry pro právní dokumenty"
+bullet4 = "Vhodné pro: Právně závazné smlouvy, externí ověření"
+description = "Použijte svůj vlastní certifikát PKCS#12. Poskytuje plnou kontrolu nad vlastnostmi certifikátu."
+title = "Nahrát vlastní P12"
+
 [changeCreds]
 changePassword = "Používáte výchozí přihlašovací údaje. Zadejte prosím nové heslo"
 changeUsername = "Update your username. You will be logged out after updating."
@@ -3242,6 +3531,46 @@ totalSelected = "Celkem vybráno"
 unsupported = "Nepodporováno"
 unzip = "Rozbalit"
 uploadError = "Nepodařilo se nahrát některé soubory."
+copyCreated = "Kopie uložena do tohoto zařízení."
+copyFailed = "Kopii se nepodařilo vytvořit."
+leaveShare = "Odebrat z mého seznamu"
+leaveShareFailed = "Nepodařilo se odebrat sdílený soubor."
+leaveShareSuccess = "Odebráno z vašeho seznamu sdílení."
+removeBoth = "Odebrat z obou"
+removeFilePrompt = "Tento soubor je uložen v tomto zařízení i na vašem serveru. Odkud jej chcete odebrat?"
+removeFileTitle = "Odebrat soubor"
+removeLocalOnly = "Pouze toto zařízení"
+removeServerFailed = "Soubor se nepodařilo odebrat ze serveru."
+removeServerOnly = "Pouze server"
+removeServerOnlyPrompt = "Tento soubor je uložen pouze na vašem serveru. Chcete jej odebrat ze serveru?"
+removeServerSuccess = "Odebrán ze serveru."
+removeSharedPrompt = "Tento soubor je s vámi sdílen. Můžete jej odebrat z tohoto zařízení nebo ze svého seznamu sdílených."
+removeSharedServerOnlyBlockedPrompt = "Tento soubor je s vámi sdílen a je uložen pouze na serveru."
+removeSharedServerOnlyPrompt = "Tento soubor je s vámi sdílen a je uložen pouze na serveru. Odebrat jej z vašeho seznamu?"
+changesNotUploaded = "Změny nebyly nahrány"
+cloudFile = "Cloudový soubor"
+filterAll = "VÅ¡e"
+filterLocal = "Místní"
+filterSharedByMe = "Sdíleno mnou"
+filterSharedWithMe = "Sdíleno se mnou"
+lastSynced = "Naposledy synchronizováno"
+localOnly = "Pouze místní"
+makeCopy = "Vytvořit kopii"
+owner = "Vlastník"
+ownerUnknown = "Neznámý"
+share = "Sdílet"
+shareSelected = "Sdílet vybrané"
+sharedByYou = "Sdíleno vámi"
+sharedEditNoticeBody = "Nemáte práva upravovat serverovou verzi tohoto souboru. Jakékoli úpravy se uloží jako místní kopie."
+sharedEditNoticeConfirm = "Rozumím"
+sharedEditNoticeTitle = "Kopie na serveru je jen pro �tení"
+sharedWithYou = "Sdíleno s vámi"
+sharing = "Sdílení"
+storageState = "Úložiště"
+synced = "Synchronizováno"
+updateOnServer = "Aktualizovat na serveru"
+uploadSelected = "Nahrát vybrané"
+uploadToServer = "Nahrát na server"
 
 [files]
 addFiles = "Přidat soubory"
@@ -3367,6 +3696,77 @@ title = "O zplošťování PDF"
 discord = "Discord"
 issues = "GitHub"
 
+[groupSigning.tooltip]
+header = "O skupinovém podepisování"
+
+[groupSigning.tooltip.finalization]
+bullet1 = "Všechny podpisy se aplikují v pořadí ú�astníků, které jste ur�ili"
+bullet2 = "V případě potřeby můžete dokon�it i s neúplnými podpisy"
+bullet3 = "Po dokon�ení již relaci nelze upravovat"
+description = "Jakmile všichni ú�astníci podepíší (nebo se rozhodnete dokon�it dříve), můžete vygenerovat finální podepsané PDF."
+title = "Proces dokon�ení"
+
+[groupSigning.tooltip.roles]
+bullet1 = "Vlastník (vy): Vytváří relaci, nastavuje výchozí podpisové parametry, dokon�uje dokument"
+bullet2 = "Ú�astníci: Vytvářejí svůj podpis, volí certifikát, umisťují na PDF"
+bullet3 = "Ú�astníci nemohou měnit nastavení viditelnosti, důvodu ani místa podpisu"
+description = "Nastavení vzhledu podpisů ovládáte pro všechny ú�astníky."
+title = "Role ú�astníků"
+
+[groupSigning.tooltip.sequential]
+bullet1 = "První ú�astník musí podepsat, než se druhý dostane k dokumentu"
+bullet2 = "Zajišťuje správné pořadí podpisů pro právní soulad"
+bullet3 = "Ú�astníky můžete přeřadit přetažením v seznamu"
+description = "Ú�astníci podepisují dokumenty v pořadí, které ur�íte. Každý podepisující obdrží oznámení, když je na řadě."
+title = "Sekven�ní podepisování"
+
+[groupSigning.steps]
+back = "Zpět"
+completed = "Dokon�eno"
+current = "Aktuální"
+stepLabel = "Krok {{number}}"
+
+[groupSigning.steps.configureDefaults]
+continue = "Pokra�ovat ke kontrole"
+invisible = "Podpisy budou neviditelné (pouze metadata)"
+locationLabel = "Místo:"
+preview = "Náhled"
+reasonLabel = "Důvod:"
+title = "Nastavit parametry podpisu"
+visible = "Podpisy budou viditelné na stránce {{page}}"
+
+[groupSigning.steps.review]
+document = "Dokument"
+dueDate = "Termín (volitelné)"
+dueDatePlaceholder = "Vyberte termín..."
+invisible = "Neviditelné (pouze metadata)"
+location = "Místo:"
+logo = "Logo:"
+logoHidden = "Bez loga"
+logoShown = "Zobrazeno logo Stirling PDF"
+participants = "Ú�astníci"
+reason = "Důvod:"
+send = "Odeslat požadavky na podpis"
+signatureSettings = "Nastavení podpisu"
+title = "Zkontrolovat údaje relace"
+titleShort = "Zkontrolovat a odeslat"
+visibility = "Viditelnost:"
+visible = "Viditelné na stránce {{page}}"
+participantCount = "{{count}} ú�astník(ů) bude podepisovat v daném pořadí"
+
+[groupSigning.steps.selectDocument]
+continue = "Pokra�ovat k výběru ú�astníků"
+noFile = "Vyberte jeden soubor PDF z vašich aktivních souborů pro vytvoření relace podepisování."
+selectedFile = "Vybraný dokument"
+title = "Vyberte dokument"
+
+[groupSigning.steps.selectParticipants]
+continue = "Pokra�ovat k nastavení podpisu"
+count = "Vybráno: {{count}} ú�astník(ů)"
+label = "Vyberte ú�astníky"
+placeholder = "Zvolte ú�astníky k podpisu..."
+title = "Zvolte ú�astníky"
+
 [getPdfInfo]
 downloadJson = "Stáhnout JSON"
 downloads = "Stažení"
@@ -4460,7 +4860,10 @@ zoomOut = "Oddálit"
 
 [viewer]
 cannotPreviewFile = "Nelze zobrazit náhled souboru"
+disableColorFilter = "Vypnout barevný filtr"
 dualPageView = "Zobrazení dvou stránek"
+enableDarkFilter = "Zapnout tmavý filtr"
+enableSepiaFilter = "Zapnout sépiový filtr"
 firstPage = "První stránka"
 lastPage = "Poslední stránka"
 nextPage = "Další stránka"
@@ -4470,6 +4873,22 @@ singlePageView = "Zobrazení jedné stránky"
 unknownFile = "Neznámý soubor"
 zoomIn = "Přiblížit"
 zoomOut = "Oddálit"
+resetZoom = "Obnovit přiblížení"
+
+[viewer.nonPdf]
+fileTypeBadge = "Soubor {{type}}"
+convertToPdf = "Převést do PDF"
+loading = "Na�ítání..."
+emptyFile = "Prázdný soubor"
+csvStats = "{{rows}} řádků · {{columns}} sloupců · {{size}}"
+sortedBy = "Seřazeno podle: {{column}}"
+columnDefault = "Sloupec {{index}}"
+htmlPreviewWarning = "Náhled HTML — externí zdroje se nemusí na�íst · {{size}}"
+htmlPreview = "Náhled HTML"
+invalidJson = "Neplatný JSON — zobrazen nezpracovaný obsah"
+textStats = "{{lines}} řádků · {{size}}"
+lineNumbers = "Čísla řádků"
+renderMarkdown = "Vykreslit Markdown"
 
 [viewer.attachments]
 title = "Přílohy"
@@ -4531,6 +4950,7 @@ toggleAttachments = "Přepnout zobrazení příloh"
 toggleTheme = "Přepnout motiv"
 language = "Jazyk"
 toggleAnnotations = "Přepnout viditelnost anotací"
+toggleLayers = "Přepnout vrstvy"
 search = "Hledat v PDF"
 panMode = "Režim posunu"
 applyRedactionsFirst = "Nejprve použijte za�ernění"
@@ -5407,20 +5827,72 @@ title = "Tisk souboru"
 2 = "Zadejte název tiskárny"
 
 [quickAccess]
+access = "Přístup"
+accessAddPerson = "Přidat další osobu"
+accessBack = "Zpět"
+accessCopyLink = "Kopírovat odkaz"
+accessEmail = "E-mailová adresa"
+accessEmailPlaceholder = "name@company.com"
+accessFileLabel = "Soubor"
+accessGeneral = "Obecný přístup"
+accessInviteTitle = "Pozvat osoby"
+accessOwner = "Vlastník"
+accessPanel = "Přístup k dokumentu"
+accessPeople = "Osoby s přístupem"
+accessRemove = "Odebrat"
+accessRestricted = "Omezeno"
+accessRestrictedHint = "Otevřít mohou pouze osoby s přístupem"
+accessRole = "Role"
+accessRoleCommenter = "Komentující"
+accessRoleEditor = "Editor"
+accessRoleViewer = "Prohlíže�"
+accessSelectedFile = "Vybraný soubor"
+accessSendInvite = "Odeslat pozvánku"
+accessTitle = "Přístup k dokumentu"
+accessYou = "Vy"
 account = "Ú�et"
+activeSessions = "Aktivní relace"
+activeTab = "Aktivní"
 activity = "Aktivita"
 adminSettings = "Admin nastav."
+allSessions = "VÅ¡echny relace"
 allTools = "All Tools"
 automate = "Automat."
+back = "Zpět"
+certSign = "Podepsat certifikátem"
+completedSessions = "Dokon�ené relace"
+completedTab = "Dokon�ené"
 config = "Konfig."
+createNew = "Vytvořit nový požadavek"
+createSession = "Vytvořit požadavek na podpis"
+dueDate = "Termín (volitelné)"
 files = "Soubory"
 help = "Nápověda"
+noActiveSessions = "Žádné �ekající požadavky na podpis ani aktivní relace"
+noCompletedSessions = "Žádné dokon�ené relace"
+noFile = "Není vybrán žádný soubor"
 read = "Číst"
 reader = "Čte�ka"
+refresh = "Obnovit"
+requestSignatures = "Požádat o podpisy"
+selectSingleFileToRequest = "Vyberte jeden soubor PDF pro vyžádání podpisů"
+selectedFile = "Vybraný soubor"
+selectUsers = "Vyberte uživatele k podpisu"
+selectUsersPlaceholder = "Zvolte ú�astníky..."
+sendingRequest = "Odesílání..."
 settings = "Nastav."
 showMeAround = "Show me around"
 sign = "Podepsat"
+signatureRequests = "Požadavky na podpis"
+signYourself = "Podepsat se"
+newRequest = "Nový požadavek"
 tours = "Tours"
+wetSign = "Přidat podpis"
+filterMine = "Moje"
+filterOverdue = "Po termínu"
+filterSigned = "Podepsáno"
+filterDeclined = "Odmítnuto"
+searchDocuments = "Hledat dokumenty…"
 
 [quickAccess.helpMenu]
 adminTour = "Prohlídka administrace"
@@ -6050,11 +6522,75 @@ toolNotAvailableLocally = "Váš server Stirling-PDF je offline a \"{{endpoint}}
 expired = "Vaše relace vypršela. Obnovte prosím stránku a zkuste to znovu."
 refreshPage = "Obnovit stránku"
 
+[sessionManagement.tooltip]
+header = "Správa relací podepisování"
+
+[sessionManagement.tooltip.addParticipants]
+bullet1 = "Noví ú�astníci jsou přidáni na konec pořadí podpisů"
+bullet2 = "Po dokon�ení relace nelze ú�astníky přidávat"
+bullet3 = "Každý ú�astník dostane oznámení, když je na řadě"
+description = "Do aktivní relace můžete kdykoli před dokon�ením přidat další ú�astníky."
+title = "Přidávání ú�astníků"
+
+[sessionManagement.tooltip.finalization]
+bullet1 = "<b>Plné dokon�ení</b>: Všichni ú�astníci podepsali"
+bullet2 = "<b>Částe�né dokon�ení</b>: Někteří ú�astníci ještě nepodepsali"
+bullet3 = "Nepodepsaní ú�astníci budou z finálního dokumentu vynecháni"
+bullet4 = "Po dokon�ení můžete na�íst podepsané PDF mezi aktivní soubory"
+description = "Dokon�ení slou�í všechny podpisy do jednoho podepsaného PDF. Tuto akci nelze vrátit."
+title = "Dokon�ení relace"
+
+[sessionManagement.tooltip.participantRemoval]
+bullet1 = "Nelze odebrat ú�astníky, kteří již podepsali"
+bullet2 = "Odebraní ú�astníci již nebudou dostávat oznámení"
+bullet3 = "Pořadí podpisů se automaticky upraví"
+description = "Ú�astníky lze z relací odebrat předtím, než podepíší."
+title = "Odebírání ú�astníků"
+
+[sessionManagement.tooltip.signatureOrder]
+bullet1 = "Každý podpis je na PDF aplikován postupně"
+bullet2 = "Pozdější podepisující vidí dřívější podpisy"
+bullet3 = "Zásadní pro schvalovací procesy a právní řetězce předání"
+description = "Pořadí, které ur�íte při vytvoření relace, ur�uje, kdo podepisuje jako první."
+title = "Pořadí podpisů"
+
+[signatureSettings.tooltip]
+header = "Nastavení vzhledu podpisu"
+
+[signatureSettings.tooltip.location]
+bullet1 = "Příklady: \"New York, USA\", \"London Office\", \"Remote\""
+bullet2 = "Není totéž co pozice na stránce"
+bullet3 = "Může být vyžadováno v některých právních jurisdikcích"
+description = "Volitelné geografické místo, kde byl podpis aplikován. Ukládá se do metadat certifikátu."
+title = "Místo podpisu"
+
+[signatureSettings.tooltip.logo]
+bullet1 = "Zobrazeno vedle podpisu a textu"
+bullet2 = "Podporuje formáty PNG, JPG"
+bullet3 = "Zvyšuje profesionální dojem"
+description = "Přidejte k viditelným podpisům logo spole�nosti pro branding a důvěryhodnost."
+title = "Logo spole�nosti"
+
+[signatureSettings.tooltip.reason]
+bullet1 = "Příklady: \"Schválení\", \"Uzavření smlouvy\", \"Kontrola dokon�ena\""
+bullet2 = "Viditelné ve vlastnostech podpisu PDF"
+bullet3 = "Užite�né pro auditní záznamy a dodržování předpisů"
+description = "Volitelný text vysvětlující, pro� je dokument podepisován. Ukládá se do metadat certifikátu."
+title = "Důvod podpisu"
+
+[signatureSettings.tooltip.visibility]
+bullet1 = "<b>Viditelný</b>: Podpis se zobrazí v PDF s vlastním vzhledem"
+bullet2 = "<b>Neviditelný</b>: Certifikát je vložen bez vizuální zna�ky"
+bullet3 = "Neviditelné podpisy stále poskytují kryptografické ověření"
+description = "Ur�uje, zda je podpis na dokumentu viditelný, nebo je vložen neviditelně."
+title = "Viditelnost podpisu"
+
 [settings.configuration]
 advanced = "Pokro�ilé"
 database = "Databáze"
 endpoints = "Endpoints"
 features = "Funkce"
+storageSharing = "Ukládání souborů a sdílení"
 systemSettings = "Systémová nastavení"
 title = "Konfigurace"
 
@@ -6332,10 +6868,13 @@ title = "Přihlásit se do Stirling"
 [setup.selfhosted]
 link = "nebo se připojte k ú�tu s vlastním hostováním"
 subtitle = "Zadejte přihlašovací údaje k vašemu serveru"
+changeServerLocked = "Vaše organizace omezila tuto aplikaci na konkrétní server"
 switchToLocal = "Místo toho použít místní nástroje"
 title = "Přihlásit se k serveru"
 
 [setup.selfhosted.unreachable]
+changeServer = "Připojit se k jinému serveru"
+changeServerLocked = "Vaše organizace omezila tuto aplikaci na konkrétní server"
 continueOffline = "Místo toho použít místní nástroje"
 message = "Nelze se připojit k {{url}}. Zkontrolujte, že server běží a je dostupný."
 retry = "Zkusit znovu"
@@ -6529,6 +7068,15 @@ saved = "Uložené"
 text = "Text"
 title = "Typ podpisu"
 
+[signRequest]
+declined = "Požadavek na podpis byl odmítnut"
+fetchFailed = "Nepodařilo se na�íst požadavek na podpis"
+signed = "Dokument byl úspěšně podepsán"
+
+[signSession]
+createFailed = "Nepodařilo se vytvořit požadavek na podpis"
+created = "Požadavek na podpis odeslán"
+
 [signup]
 accountCreatedSuccessfully = "Ú�et byl úspěšně vytvořen! Nyní se můžete přihlásit."
 alreadyHaveAccount = "Už máte ú�et? Přihlaste se"
@@ -6807,6 +7355,106 @@ title = "Rozdělit PDF podle kapitol"
 [splitPdfByChapters]
 tags = "rozdělit,kapitoly,záložky,uspořádat"
 
+[storageShare]
+accessed = "Přístup"
+accessDenied = "K tomuto sdílenému souboru nemáte přístup. Požádejte vlastníka o sdílení."
+accessFailed = "Nelze na�íst aktivitu."
+accessDeniedBody = "K tomuto souboru nemáte přístup. Požádejte vlastníka o sdílení."
+accessDeniedTitle = "Bez přístupu"
+accessLimitedCommenter = "Přístup pro komentující bude brzy k dispozici. Pokud potřebujete stahovat, požádejte vlastníka o přístup editora."
+accessLimitedTitle = "Omezený přístup"
+accessLimitedViewer = "Tento odkaz je pouze pro zobrazení. Pokud potřebujete stahovat, požádejte vlastníka o přístup editora."
+createdAt = "Vytvořeno"
+download = "Stáhnout"
+downloadFailed = "Tento soubor nelze stáhnout."
+expiredBody = "Tento odkaz ke sdílení je neplatný nebo vypršel."
+expiredTitle = "Odkaz vypršel"
+goToLogin = "Přejít na přihlášení"
+loadFailed = "Nelze otevřít sdílený soubor."
+loading = "Na�ítání odkazu ke sdílení..."
+loginPrompt = "Přihlaste se pro přístup k tomuto sdílenému souboru."
+loginRequired = "Vyžadováno přihlášení"
+openInApp = "Otevřít ve Stirling PDF"
+ownerLabel = "Vlastník"
+ownerUnknown = "Neznámý"
+requiresLogin = "Tento sdílený soubor vyžaduje přihlášení."
+roleCommenter = "Komentující"
+roleEditor = "Editor"
+roleViewer = "Prohlíže�"
+shareHeading = "Sdílený soubor"
+titleDefault = "Sdílený soubor"
+tryAgain = "Zkuste to prosím později."
+addUser = "Přidat"
+commenterHint = "Komentování bude brzy k dispozici."
+copied = "Odkaz zkopírován do schránky"
+copy = "Kopírovat"
+copyFailed = "Kopírování se nezdařilo"
+description = "Vytvořte odkaz ke sdílení tohoto souboru. Přihlášení uživatelé s odkazem k němu budou mít přístup."
+downloadsCount = "Stažení: {{count}}"
+emailWarningBody = "Vypadá to jako e-mailová adresa. Pokud tato osoba ještě není uživatelem Stirling PDF, k souboru se nedostane."
+emailWarningConfirm = "Sdílet i tak"
+emailWarningTitle = "E-mailová adresa"
+errorTitle = "Sdílení se nezdařilo"
+failure = "Nelze vygenerovat odkaz ke sdílení. Zkuste to prosím znovu."
+fileLabel = "Soubor"
+generate = "Vygenerovat odkaz"
+generated = "Odkaz ke sdílení vygenerován"
+hideActivity = "Skrýt aktivitu"
+invalidUsername = "Zadejte platné uživatelské jméno nebo e-mailovou adresu."
+lastAccessed = "Poslední přístup"
+linkAccessTitle = "Přístup přes odkaz"
+linkLabel = "Odkaz ke sdílení"
+linksDisabled = "Odkazy ke sdílení jsou zakázány."
+linksDisabledBody = "Odkazy ke sdílení jsou zakázány v nastavení vašeho serveru."
+manage = "Spravovat sdílení"
+manageDescription = "Vytvářejte a spravujte odkazy pro sdílení tohoto souboru."
+manageLoadFailed = "Nelze na�íst odkazy ke sdílení."
+manageTitle = "Správa sdílení"
+noActivity = "Zatím žádná aktivita."
+noLinks = "Zatím nejsou žádné aktivní odkazy ke sdílení."
+noSharedUsers = "Zatím nemá přístup žádný uživatel."
+removeLink = "Odebrat odkaz"
+removeUser = "Odebrat"
+revokeFailed = "Odkaz ke sdílení se nepodařilo odstranit."
+revoked = "Odkaz pro sdílení odstraněn"
+roleLabel = "Role"
+sharingDisabled = "Sdílení je zakázáno."
+sharingDisabledBody = "Sdílení bylo zakázáno nastavením vašeho serveru."
+sharedUsersTitle = "Sdíleno s uživateli"
+title = "Sdílet soubor"
+unknownUser = "Neznámý uživatel"
+userAddFailed = "Nelze sdílet s tímto uživatelem."
+userAdded = "Uživatel přidán do seznamu sdílení."
+usernameLabel = "Uživatelské jméno nebo e-mail"
+usernamePlaceholder = "Zadejte uživatelské jméno nebo e-mail"
+userRemoveFailed = "Tohoto uživatele nelze odebrat."
+userRemoved = "Uživatel odebrán ze seznamu sdílení."
+viewActivity = "Zobrazit aktivitu"
+viewed = "Zobrazeno"
+viewsCount = "Zobrazení: {{count}}"
+downloaded = "Staženo"
+bulkDescription = "Vytvořte jeden odkaz pro sdílení všech vybraných souborů s přihlášenými uživateli."
+bulkTitle = "Sdílet vybrané soubory"
+copyLink = "Kopírovat odkaz pro sdílení"
+fileCount = "Vybráno {{count}} souborů"
+ownerOnly = "Sdílení může spravovat pouze vlastník."
+selectSingleFile = "Pro správu sdílení vyberte jeden soubor."
+
+[storageUpload]
+description = "Tímto nahrajete aktuální soubor do úložiště serveru pro svůj přístup."
+errorTitle = "Nahrávání selhalo"
+failure = "Nahrávání selhalo. Zkontrolujte prosím své přihlášení a nastavení úložiště."
+fileLabel = "Soubor"
+hint = "Veřejné odkazy a režimy přístupu jsou řízeny nastavením vašeho serveru."
+success = "Nahráno na server"
+title = "Nahrát na server"
+updateButton = "Aktualizovat na serveru"
+uploadButton = "Nahrát na server"
+bulkDescription = "Tímto nahrajete vybrané soubory do úložiště vašeho serveru."
+bulkTitle = "Nahrát vybrané soubory"
+fileCount = "Vybráno {{count}} souborů"
+more = " +{{count}} navíc"
+
 [storage]
 approximateSize = "Přibližná velikost"
 fileTooLarge = "Soubor je příliš velký. Maximální velikost na soubor je"
@@ -7153,6 +7801,30 @@ title = "Zobrazit/Upravit PDF"
 [warning]
 tooltipTitle = "Upozornění"
 
+[wetSignature.tooltip]
+header = "Způsoby vytvoření podpisu"
+
+[wetSignature.tooltip.draw]
+bullet1 = "Přizpůsobte barvu a tloušťku pera"
+bullet2 = "Vymažte a nakreslete znovu, dokud nebudete spokojeni"
+bullet3 = "Funguje na dotykových zařízeních (tablety, telefony)"
+description = "Vytvořte vlastnoru�ní podpis pomocí myši nebo dotykové obrazovky. Nejvhodnější pro osobní, autentické podpisy."
+title = "Nakreslit podpis"
+
+[wetSignature.tooltip.type]
+bullet1 = "Vyberte si z několika písem"
+bullet2 = "Přizpůsobte velikost a barvu textu"
+bullet3 = "Ideální pro standardizované podpisy"
+description = "Vygenerujte podpis z napsaného textu. Rychlé a konzistentní, vhodné pro obchodní dokumenty."
+title = "Napsat podpis"
+
+[wetSignature.tooltip.upload]
+bullet1 = "Podporuje PNG, JPG a další obrazové formáty"
+bullet2 = "Pro nejlepší výsledek se doporu�uje průhledné pozadí"
+bullet3 = "Obrázek bude velikostně přizpůsoben oblasti podpisu"
+description = "Nahrajte předem vytvořený obrázek podpisu. Ideální, pokud máte naskenovaný podpis nebo firemní logo."
+title = "Nahrát obrázek podpisu"
+
 [watermark]
 completed = "Vodoznak přidán"
 desc = "Přidat textové nebo obrazové vodoznaky do souborů PDF"
@@ -7333,6 +8005,7 @@ activeSession = "Aktivní relace"
 addMembers = "Přidat �leny"
 admin = "Administrátor"
 confirmDelete = "Opravdu chcete tohoto uživatele smazat? Tuto akci nelze vrátit."
+confirmUnlock = "Opravdu chcete odemknout tento uživatelský ú�et?"
 deleteUser = "Smazat uživatele"
 deleteUserError = "Uživatele se nepodařilo smazat"
 deleteUserSuccess = "Uživatel úspěšně smazán"
@@ -7341,6 +8014,8 @@ disable = "Zakázat"
 disabled = "Deaktivován"
 editRole = "Upravit roli"
 enable = "Povolit"
+locked = "uzam�eno"
+lockedBadge = "Uzam�eno"
 loading = "Na�ítání osob..."
 loginRequired = "Nejprve povolte režim přihlášení"
 member = "ÄŒlen"
@@ -7350,6 +8025,9 @@ searchMembers = "Hledat �leny..."
 status = "Stav"
 team = "Tým"
 title = "Lidé"
+unlockAccount = "Odemknout ú�et"
+unlockUserError = "Nepodařilo se odemknout uživatelský ú�et"
+unlockUserSuccess = "Uživatelský ú�et byl úspěšně odemknut"
 user = "Uživatel"
 
 [workspace.people.actions]
diff --git a/frontend/public/locales/da-DK/translation.toml b/frontend/public/locales/da-DK/translation.toml
index 5ae58fe318..a7ecb538f3 100644
--- a/frontend/public/locales/da-DK/translation.toml
+++ b/frontend/public/locales/da-DK/translation.toml
@@ -8,6 +8,7 @@ black = "Sort"
 blue = "Blå"
 bored = "Træt af at vente?"
 cancel = "Annuller"
+confirm = "Bekræft"
 changedCredsMessage = "Legitimationsoplysninger ændret!"
 chooseFile = "Vælg fil"
 close = "Luk"
@@ -146,6 +147,7 @@ insufficientCredits = "Utilstrækkelige kreditter. Krævet: {{requiredCredits}},
 loadingCredits = "Kontrollerer kreditter..."
 loadingProStatus = "Kontrollerer abonnementsstatus..."
 noticeTopUpOrPlan = "Ikke nok kreditter. Fyld op eller opgrader til et abonnement"
+accessInvite = "Inviter"
 
 [account]
 accountSettings = "Kontoindstillinger"
@@ -1427,6 +1429,34 @@ title = "Behandling"
 description = "Maksimal ventetid på en behandlingsopgave før fejl meldes."
 label = "Behandlingstimeout (sekunder)"
 
+[admin.settings.storage]
+description = "Styr serverlagring og delingsmuligheder."
+title = "Fillagring og deling"
+
+[admin.settings.storage.enabled]
+description = "Tillad brugere at gemme filer på serveren."
+label = "Aktiver server-fillagring"
+
+[admin.settings.storage.sharing.email]
+description = "Tillad deling med e-mailadresser."
+label = "Aktiver e-mail-deling"
+mailLink = "Konfigurer mailindstillinger"
+mailNote = "Kræver mailkonfiguration. "
+
+[admin.settings.storage.sharing.enabled]
+description = "Tillad brugere at dele gemte filer."
+label = "Aktiver deling"
+
+[admin.settings.storage.sharing.links]
+description = "Tillad deling via links for indloggede brugere."
+frontendUrlLink = "Konfigurer i systemindstillinger"
+frontendUrlNote = "Kræver en Frontend URL. "
+label = "Aktiver delingslinks"
+
+[admin.settings.storage.signing.enabled]
+description = "Tillad brugere at oprette underskriftssessioner med flere deltagere. Kræver at server-fillagring er aktiveret."
+label = "Aktiver gruppeunderskrift (Alpha)"
+
 [admin.settings.unsavedChanges]
 cancel = "Fortsæt redigering"
 discard = "Kassér ændringer"
@@ -2059,7 +2089,19 @@ numbers = "Tal/intervaller: 5, 10-20"
 progressions = "Progressioner: 3n, 4n+1"
 
 [certSign]
+allSigned = "Alle deltagere har underskrevet. Klar til at færdiggøre."
+awaitingSignatures = "Afventer underskrifter"
+signatureProgress = "{{signedCount}}/{{totalCount}} underskrifter"
 chooseCertificate = "Vælg certifikatfil"
+declined = "Afvist"
+fetchFailed = "Kunne ikke indlæse underskriftsdata"
+finalized = "Færdiggjort"
+notified = "Afventer"
+partialNote = "Du kan færdiggøre tidligt med de nuværende underskrifter. Ikke-underskrevne deltagere vil blive udeladt."
+pending = "Afventer"
+readyToFinalize = "Klar til at færdiggøre"
+signed = "Underskrevet"
+viewed = "Set"
 chooseJksFile = "Vælg JKS-fil"
 chooseP12File = "Vælg PKCS12-fil"
 choosePfxFile = "Vælg PFX-fil"
@@ -2082,6 +2124,7 @@ title = "Certifikat Underskrivning"
 invisible = "Usynlig"
 stepTitle = "Signaturudseende"
 visible = "Synlig"
+visibility = "Synlighed"
 
 [certSign.appearance.options]
 title = "Signaturdetaljer"
@@ -2188,6 +2231,252 @@ bullet4 = "Kan bruge brugerdefinerede certifikater til verifikation"
 text = "Når du tjekker signaturer, fortæller værktøjet, om de er gyldige, hvem der underskrev dokumentet, hvornår det blev underskrevet, og om dokumentet er ændret siden underskrivning."
 title = "Kontrol af signaturer"
 
+[certSign.collab.finalize]
+button = "Færdiggør og indlæs underskrevet PDF"
+early = "Færdiggør med nuværende underskrifter"
+
+[certSign.collab.sessionDetail]
+addButton = "Tilføj deltagere"
+addParticipants = "Tilføj deltagere"
+addParticipantsError = "Kunne ikke tilføje deltagere"
+backToList = "Tilbage til sessioner"
+deleteConfirm = "Er du sikker? Dette kan ikke fortrydes."
+deleteError = "Kunne ikke slette session"
+deleted = "Session slettet"
+deleteSession = "Slet session"
+dueDate = "Forfaldsdato"
+finalizeError = "Kunne ikke færdiggøre session"
+loadPdfError = "Kunne ikke indlæse underskrevet PDF"
+loadSignedPdf = "Indlæs underskrevet PDF i aktive filer"
+messageLabel = "Besked"
+noAdditionalInfo = "Ingen yderligere oplysninger"
+owner = "Ejer"
+participantRemoved = "Deltager fjernet"
+participants = "Deltagere"
+participantsAdded = "Deltagere tilføjet"
+removeParticipant = "Fjern"
+removeParticipantError = "Kunne ikke fjerne deltager"
+selectUsers = "Vælg brugere..."
+sessionInfo = "Sessionsinfo"
+workbenchTitle = "Sessionsstyring"
+
+[certSign.collab.signRequest]
+addedToFiles = "Dokument tilføjet til aktive filer"
+addSignature = "Tilføj din underskrift"
+addToFiles = "Tilføj til aktive filer"
+advancedSettings = "Avancerede indstillinger"
+backToList = "Tilbage til underskriftsanmodninger"
+certificateChoice = "Vælg et certifikat at underskrive med"
+changeSignature = "Skift underskrift"
+clearSignature = "Ryd underskrift"
+completeAndSign = "Fuldfør og underskriv"
+createNewSignature = "Opret ny underskrift"
+declineButton = "Afvis"
+decline = "Afvis anmodning"
+deleteSelected = "Slet valgt underskrift"
+drawSignature = "Tegn din underskrift nedenfor"
+dueDate = "Forfaldsdato"
+fileTooLarge = "Filstørrelse skal være mindre end 5 MB"
+fontFamily = "Skrifttype"
+fontSize = "Skriftstørrelse: {{size}}px"
+fontSizePlaceholder = "Størrelse"
+from = "Fra"
+invalidCertFile = "Vælg en P12- eller PFX-certifikatfil"
+invalidFileType = "Vælg en billedfil"
+location = "Placering (valgfrit)"
+locationPlaceholder = "Hvor underskriver du fra?"
+message = "Besked"
+noCertificate = "Vælg en certifikatfil"
+noSignatures = "Placer mindst én underskrift på PDF'en"
+p12File = "P12/PFX-certifikatfil"
+password = "Certifikatadgangskode"
+passwordPlaceholder = "Indtast adgangskode..."
+penColor = "Penfarve"
+penSize = "Penstørrelse: {{size}}px"
+placementActive = "Klik på PDF for at placere"
+placeSignatureButton = "Placer underskrift på PDF"
+reason = "Ã…rsag (valgfrit)"
+reasonPlaceholder = "Hvorfor underskriver du?"
+removeImage = "Fjern billede"
+removeCertFile = "Fjern fil"
+savedSignatures = "Gemte underskrifter"
+selectFile = "Vælg billedfil"
+selectSignatureTitle = "Vælg eller opret underskrift"
+signButton = "Underskriv dokument"
+signatureInfo = "Disse indstillinger konfigureres af dokumentets ejer"
+signaturePlaced = "Underskrift placeret på side"
+signatureSettings = "Underskriftsindstillinger"
+signatureText = "Underskriftstekst"
+signatureTextPlaceholder = "Indtast dit navn..."
+signatureTypeLabel = "Underskriftstype"
+signingTitle = "Underskrivning"
+textColor = "Tekstfarve"
+typeSignature = "Skriv dit navn for at oprette en underskrift"
+uploadCert = "Brugerdefineret certifikat"
+uploadCertDesc = "Brug dit eget P12/PFX-certifikat"
+uploadSignature = "Upload dit underskriftsbillede"
+usePersonalCert = "Personligt certifikat"
+usePersonalCertDesc = "Automatisk genereret til din konto"
+useServerCert = "Organisationscertifikat"
+useServerCertDesc = "Delt organisationscertifikat"
+workbenchTitle = "Underskriftsanmodning"
+
+[certSign.collab.signRequest.canvas]
+colorPickerTitle = "Vælg stregfarve"
+continue = "Fortsæt"
+
+[certSign.collab.signRequest.certModal]
+description = "Du har placeret {{count}} underskrift(er). Vælg dit certifikat for at fuldføre underskrivningen."
+sign = "Underskriv dokument"
+certValidating = "Validerer certifikat..."
+certValidUntil = "Certifikat gyldigt indtil {{date}}"
+certInvalid = "Ugyldigt certifikat: {{error}}"
+certInvalidFallback = "Ugyldigt certifikat"
+certNetworkError = "Kunne ikke validere certifikat"
+title = "Konfigurer certifikat"
+
+[certSign.collab.signRequest.image]
+hint = "Upload et PNG- eller JPG-billede af din underskrift"
+
+[certSign.collab.signRequest.mode]
+move = "Flyt underskrift"
+place = "Placer underskrift"
+title = "Underskriv eller flyt-tilstand"
+
+[certSign.collab.signRequest.modeTabs]
+draw = "Tegn"
+image = "Upload"
+text = "Skriv"
+
+[certSign.collab.signRequest.placeSignature]
+message = "Klik på PDF'en for at placere din underskrift"
+title = "Placer underskrift"
+
+[certSign.collab.signRequest.preview]
+imageAlt = "Valgt underskrift"
+missing = "Ingen forhåndsvisning"
+textFallback = "Underskrift"
+
+[certSign.collab.signRequest.saved]
+defaultCanvasLabel = "Tegnet underskrift"
+defaultImageLabel = "Uploadet underskrift"
+defaultLabel = "Underskrift"
+defaultTextLabel = "Indtastet underskrift"
+delete = "Slet underskrift"
+none = "Ingen gemte underskrifter"
+
+[certSign.collab.signRequest.signatureType]
+draw = "Tegn"
+type = "Skriv"
+upload = "Upload"
+
+[certSign.collab.signRequest.steps]
+back = "Tilbage"
+cancelPlacement = "Annuller placering"
+certificate = "Certifikat"
+clickMultipleTimes = "Klik flere gange på PDF'en for at placere underskrifter. Træk en hvilken som helst underskrift for at flytte eller ændre størrelse."
+clickToPlace = "Klik på PDF'en, hvor du vil have din underskrift til at vises."
+continue = "Fortsæt til valg af certifikat"
+continueToPlacement = "Fortsæt til placering"
+continueToReview = "Fortsæt til gennemgang"
+createSignature = "Opret underskrift"
+invisible = "Usynlig"
+location = "Placering:"
+multipleSignatures = "{{count}} underskrifter vil blive anvendt på PDF'en"
+oneSignature = "1 underskrift vil blive anvendt på PDF'en"
+placeOnPdf = "Placer på PDF"
+reason = "Ã…rsag:"
+reviewTitle = "Gennemse før underskrivning"
+signaturePlaced = "Underskrift placeret på side {{page}}. Du kan justere placeringen ved at klikke igen eller fortsætte til gennemgang."
+visible = "Synlig"
+visibility = "Synlighed:"
+yourSignatures = "Dine underskrifter ({{count}})"
+
+[certSign.collab.signRequest.text]
+colorLabel = "Farve"
+fontLabel = "Skrifttype"
+fontSizeLabel = "Størrelse"
+fontSizePlaceholder = "16"
+label = "Underskriftstekst"
+modalHint = "Indtast dit navn, og klik derefter på Fortsæt for at placere det på PDF'en."
+placeholder = "Indtast dit navn..."
+
+[certSign.collab.participant]
+certValidating = "Validerer certifikat..."
+certValid = "✓ Certifikat gyldigt"
+certValidUntil = " indtil {{date}}"
+certInvalid = "✗ {{error}}"
+certInvalidFallback = "Ugyldigt certifikat"
+certNetworkError = "Kunne ikke validere certifikat"
+
+[certSign.collab.addParticipants]
+add = "Tilføj {{count}} deltager(e)"
+back = "Tilbage"
+configureSignatures = "Konfigurer underskriftsindstillinger"
+continue = "Fortsæt til underskriftsindstillinger"
+reasonHelp = "Forudindstil en underskriftsårsag for disse deltagere (valgfrit, de kan tilsidesætte den ved underskrivning)"
+reasonPlaceholder = "f.eks. Godkendelse, Gennemgang..."
+selectUsers = "Vælg brugere"
+
+[certSign.collab.sessionCreation]
+includeSummaryPage = "Medtag side med underskriftssammendrag"
+includeSummaryPageHelp = "En sammendragside vil blive tilføjet til sidst med al underskriftsmetadata. De digitale certifikat-underskriftsfelter på de enkelte sider undertrykkes (våde underskrifter påvirkes ikke)."
+
+[certSign.collab.sessionList]
+active = "Aktiv"
+finalized = "Færdiggjort"
+
+[certSign.collab.signatureSettings]
+description = "Konfigurer, hvordan underskrifter vises for alle deltagere"
+title = "Underskriftsudseende"
+
+[certSign.collab.userSelector]
+inviteUsers = "Tilføj brugere"
+loadError = "Kunne ikke indlæse brugere"
+noTeam = "Intet team"
+noUsers = "Ingen andre brugere fundet."
+placeholder = "Vælg brugere..."
+
+[certSign.mobile]
+panelActions = "Handlinger"
+panelDocument = "Dokument"
+panelPeople = "Personer"
+
+[certSign.sessions]
+deleted = "Session slettet"
+fetchFailed = "Kunne ikke indlæse sessionsdetaljer"
+finalized = "Session færdiggjort"
+loaded = "Underskrevet PDF indlæst"
+pdfNotReady = "PDF ikke klar"
+pdfNotReadyDesc = "Den underskrevne PDF genereres. Prøv igen om et øjeblik."
+
+[certificateChoice.tooltip]
+header = "Certifikattyper"
+
+[certificateChoice.tooltip.organization]
+bullet1 = "Administreres af systemadministratorer"
+bullet2 = "Deles mellem autoriserede brugere"
+bullet3 = "Repræsenterer virksomhedens identitet, ikke en person"
+bullet4 = "Bedst til: Officielle dokumenter, teamunderskrifter"
+description = "Et delt certifikat leveret af din organisation. Bruges til underskriftsfuldmagt på tværs af virksomheden."
+title = "Organisationscertifikat"
+
+[certificateChoice.tooltip.personal]
+bullet1 = "Genereres automatisk ved første brug"
+bullet2 = "Knyttet til din brugerkonto"
+bullet3 = "Kan ikke deles med andre brugere"
+bullet4 = "Bedst til: Personlige dokumenter, individuel ansvarlighed"
+description = "Et automatisk genereret certifikat, der er unikt for din brugerkonto. Velegnet til individuelle underskrifter."
+title = "Personligt certifikat"
+
+[certificateChoice.tooltip.upload]
+bullet1 = "Kræver P12/PFX-fil og adgangskode"
+bullet2 = "Kan udstedes af eksterne Certificate Authorities"
+bullet3 = "Højere tillidsniveau til juridiske dokumenter"
+bullet4 = "Bedst til: Juridisk bindende kontrakter, ekstern validering"
+description = "Brug din egen PKCS#12-certifikatfil. Giver fuld kontrol over certifikategenskaber."
+title = "Upload brugerdefineret P12"
+
 [changeCreds]
 changePassword = "Du bruger standard loginoplysninger. Indtast venligst en ny adgangskode"
 changeUsername = "Opdater dit brugernavn. Du bliver logget ud efter opdatering."
@@ -3242,6 +3531,46 @@ totalSelected = "Valgt i alt"
 unsupported = "Ikke understøttet"
 unzip = "Udpak"
 uploadError = "Kunne ikke uploade nogle filer."
+copyCreated = "Kopi gemt på denne enhed."
+copyFailed = "Kunne ikke oprette en kopi."
+leaveShare = "Fjern fra min liste"
+leaveShareFailed = "Kunne ikke fjerne den delte fil."
+leaveShareSuccess = "Fjernet fra din delte liste."
+removeBoth = "Fjern begge steder"
+removeFilePrompt = "Denne fil er gemt på denne enhed og på din server. Hvor vil du fjerne den fra?"
+removeFileTitle = "Fjern fil"
+removeLocalOnly = "Kun denne enhed"
+removeServerFailed = "Kunne ikke fjerne filen fra serveren."
+removeServerOnly = "Kun server"
+removeServerOnlyPrompt = "Denne fil er kun lagret på din server. Vil du fjerne den fra serveren?"
+removeServerSuccess = "Fjernet fra server."
+removeSharedPrompt = "Denne fil er delt med dig. Du kan fjerne den fra denne enhed eller din delte liste."
+removeSharedServerOnlyBlockedPrompt = "Denne fil er delt med dig og kun lagret på serveren."
+removeSharedServerOnlyPrompt = "Denne fil er delt med dig og kun lagret på serveren. Vil du fjerne den fra din liste?"
+changesNotUploaded = "Ændringer ikke uploadet"
+cloudFile = "Cloud-fil"
+filterAll = "Alle"
+filterLocal = "Lokal"
+filterSharedByMe = "Delt af mig"
+filterSharedWithMe = "Delt med mig"
+lastSynced = "Sidst synkroniseret"
+localOnly = "Kun lokal"
+makeCopy = "Opret en kopi"
+owner = "Ejer"
+ownerUnknown = "Ukendt"
+share = "Del"
+shareSelected = "Del valgte"
+sharedByYou = "Delt af dig"
+sharedEditNoticeBody = "Du har ikke redigeringsrettigheder til serverversionen af denne fil. Eventuelle ændringer, du laver, gemmes som en lokal kopi."
+sharedEditNoticeConfirm = "Forstået"
+sharedEditNoticeTitle = "Skrivebeskyttet serverkopi"
+sharedWithYou = "Delt med dig"
+sharing = "Deling"
+storageState = "Lagring"
+synced = "Synkroniseret"
+updateOnServer = "Opdater på server"
+uploadSelected = "Upload valgte"
+uploadToServer = "Upload til server"
 
 [files]
 addFiles = "Tilføj filer"
@@ -3367,6 +3696,77 @@ title = "Om udfladning af PDF'er"
 discord = "Discord"
 issues = "GitHub"
 
+[groupSigning.tooltip]
+header = "Om gruppeunderskrift"
+
+[groupSigning.tooltip.finalization]
+bullet1 = "Alle underskrifter anvendes i den rækkefølge, du har angivet for deltagerne"
+bullet2 = "Du kan færdiggøre med delvise underskrifter om nødvendigt"
+bullet3 = "Når den er færdiggjort, kan sessionen ikke ændres"
+description = "Når alle deltagere har underskrevet (eller du vælger at færdiggøre tidligt), kan du generere den endelige underskrevne PDF."
+title = "Færdiggørelsesproces"
+
+[groupSigning.tooltip.roles]
+bullet1 = "Ejer (dig): Opretter session, konfigurerer standarder for underskrift, færdiggør dokument"
+bullet2 = "Deltagere: Opretter deres underskrift, vælger certifikat, placerer på PDF"
+bullet3 = "Deltagere kan ikke ændre indstillinger for underskriftens synlighed, årsag eller placering"
+description = "Du styrer indstillingerne for underskriftsudseende for alle deltagere."
+title = "Deltagerroller"
+
+[groupSigning.tooltip.sequential]
+bullet1 = "Første deltager skal underskrive, før den anden kan få adgang til dokumentet"
+bullet2 = "Sikrer korrekt underskriftsrækkefølge for juridisk overholdelse"
+bullet3 = "Du kan omarrangere deltagere ved at trække dem i listen"
+description = "Deltagere underskriver dokumenter i den rækkefølge, du angiver. Hver underskriver får en meddelelse, når det er deres tur."
+title = "Sekventiel underskrift"
+
+[groupSigning.steps]
+back = "Tilbage"
+completed = "Fuldført"
+current = "Aktuel"
+stepLabel = "Trin {{number}}"
+
+[groupSigning.steps.configureDefaults]
+continue = "Fortsæt til gennemgang"
+invisible = "Underskrifter vil være usynlige (kun metadata)"
+locationLabel = "Placering:"
+preview = "Forhåndsvisning"
+reasonLabel = "Ã…rsag:"
+title = "Konfigurer underskriftsindstillinger"
+visible = "Underskrifter vil være synlige på side {{page}}"
+
+[groupSigning.steps.review]
+document = "Dokument"
+dueDate = "Forfaldsdato (valgfrit)"
+dueDatePlaceholder = "Vælg forfaldsdato..."
+invisible = "Usynlig (kun metadata)"
+location = "Placering:"
+logo = "Logo:"
+logoHidden = "Intet logo"
+logoShown = "Stirling PDF-logo vist"
+participants = "Deltagere"
+reason = "Ã…rsag:"
+send = "Send underskriftsanmodninger"
+signatureSettings = "Underskriftsindstillinger"
+title = "Gennemse sessionsdetaljer"
+titleShort = "Gennemse og send"
+visibility = "Synlighed:"
+visible = "Synlig på side {{page}}"
+participantCount = "{{count}} deltager(e) vil underskrive i rækkefølge"
+
+[groupSigning.steps.selectDocument]
+continue = "Fortsæt til valg af deltagere"
+noFile = "Vælg én PDF-fil fra dine aktive filer for at oprette en underskriftssession."
+selectedFile = "Valgt dokument"
+title = "Vælg dokument"
+
+[groupSigning.steps.selectParticipants]
+continue = "Fortsæt til underskriftsindstillinger"
+count = "{{count}} deltager(e) valgt"
+label = "Vælg deltagere"
+placeholder = "Vælg deltagere til at underskrive..."
+title = "Vælg deltagere"
+
 [getPdfInfo]
 downloadJson = "Download JSON"
 downloads = "Downloads"
@@ -4460,7 +4860,10 @@ zoomOut = "Zoom ud"
 
 [viewer]
 cannotPreviewFile = "Kan ikke forhåndsvise fil"
+disableColorFilter = "Deaktiver farvefilter"
 dualPageView = "To-siders visning"
+enableDarkFilter = "Aktiver mørkt filter"
+enableSepiaFilter = "Aktiver sepiafilter"
 firstPage = "Første side"
 lastPage = "Sidste side"
 nextPage = "Næste side"
@@ -4470,6 +4873,22 @@ singlePageView = "Enkelt-sides visning"
 unknownFile = "Ukendt fil"
 zoomIn = "Zoom ind"
 zoomOut = "Zoom ud"
+resetZoom = "Nulstil zoom"
+
+[viewer.nonPdf]
+fileTypeBadge = "{{type}}-fil"
+convertToPdf = "Konverter til PDF"
+loading = "Indlæser..."
+emptyFile = "Tom fil"
+csvStats = "{{rows}} rækker · {{columns}} kolonner · {{size}}"
+sortedBy = "Sorterede efter: {{column}}"
+columnDefault = "Kolonne {{index}}"
+htmlPreviewWarning = "HTML-forhåndsvisning — eksterne ressourcer indlæses muligvis ikke · {{size}}"
+htmlPreview = "HTML-forhåndsvisning"
+invalidJson = "Ugyldig JSON — viser råt indhold"
+textStats = "{{lines}} linjer · {{size}}"
+lineNumbers = "Linjenumre"
+renderMarkdown = "Gengiv Markdown"
 
 [viewer.attachments]
 title = "Vedhæftninger"
@@ -4531,6 +4950,7 @@ toggleAttachments = "Vis/skjul vedhæftninger"
 toggleTheme = "Skift tema"
 language = "Sprog"
 toggleAnnotations = "Skift visning af annoteringer"
+toggleLayers = "Skift lag"
 search = "Søg i PDF"
 panMode = "Pan-tilstand"
 applyRedactionsFirst = "Anvend maskeringer først"
@@ -5407,20 +5827,72 @@ title = "Udskriv Fil"
 2 = "Indtast printernavn"
 
 [quickAccess]
+access = "Adgang"
+accessAddPerson = "Tilføj en person mere"
+accessBack = "Tilbage"
+accessCopyLink = "Kopiér link"
+accessEmail = "E-mailadresse"
+accessEmailPlaceholder = "name@company.com"
+accessFileLabel = "Fil"
+accessGeneral = "Generel adgang"
+accessInviteTitle = "Inviter personer"
+accessOwner = "Ejer"
+accessPanel = "Dokumentadgang"
+accessPeople = "Personer med adgang"
+accessRemove = "Fjern"
+accessRestricted = "Begrænset"
+accessRestrictedHint = "Kun personer med adgang kan åbne"
+accessRole = "Rolle"
+accessRoleCommenter = "Kommentator"
+accessRoleEditor = "Redaktør"
+accessRoleViewer = "Læser"
+accessSelectedFile = "Valgt fil"
+accessSendInvite = "Send invitation"
+accessTitle = "Dokumentadgang"
+accessYou = "Dig"
 account = "Konto"
+activeSessions = "Aktive sessioner"
+activeTab = "Aktiv"
 activity = "Historik"
 adminSettings = "Admin Indstil."
+allSessions = "Alle sessioner"
 allTools = "All Tools"
 automate = "Automat."
+back = "Tilbage"
+certSign = "Certifikatunderskrift"
+completedSessions = "Fuldførte sessioner"
+completedTab = "Fuldført"
 config = "Konfig."
+createNew = "Opret ny anmodning"
+createSession = "Opret underskriftsanmodning"
+dueDate = "Forfaldsdato (valgfrit)"
 files = "Filer"
 help = "Hjælp"
+noActiveSessions = "Ingen afventende underskriftsanmodninger eller aktive sessioner"
+noCompletedSessions = "Ingen fuldførte sessioner"
+noFile = "Ingen fil valgt"
 read = "Læs"
 reader = "Læser"
+refresh = "Opdater"
+requestSignatures = "Anmod om underskrifter"
+selectSingleFileToRequest = "Vælg én PDF-fil for at anmode om underskrifter"
+selectedFile = "Valgt fil"
+selectUsers = "Vælg brugere til at underskrive"
+selectUsersPlaceholder = "Vælg deltagere..."
+sendingRequest = "Sender..."
 settings = "Indstil."
 showMeAround = "Vis mig rundt"
 sign = "Signer"
+signatureRequests = "Underskriftsanmodninger"
+signYourself = "Underskriv selv"
+newRequest = "Ny anmodning"
 tours = "Rundvisninger"
+wetSign = "Tilføj underskrift"
+filterMine = "Mine"
+filterOverdue = "Forfaldne"
+filterSigned = "Underskrevet"
+filterDeclined = "Afvist"
+searchDocuments = "Søg i dokumenter…"
 
 [quickAccess.helpMenu]
 adminTour = "Admin-rundtur"
@@ -6050,11 +6522,75 @@ toolNotAvailableLocally = "Din Stirling-PDF-server er offline, og \"{{endpoint}}
 expired = "Din sesions tid har udløbet. Genlad siden og prøv igen."
 refreshPage = "Opdater side"
 
+[sessionManagement.tooltip]
+header = "Administration af underskriftssessioner"
+
+[sessionManagement.tooltip.addParticipants]
+bullet1 = "Nye deltagere tilføjes i slutningen af underskriftsrækkefølgen"
+bullet2 = "Kan ikke tilføje deltagere, efter sessionen er færdiggjort"
+bullet3 = "Hver deltager modtager en meddelelse, når det er deres tur"
+description = "Du kan tilføje flere deltagere til en aktiv session når som helst før færdiggørelse."
+title = "Tilføjelse af deltagere"
+
+[sessionManagement.tooltip.finalization]
+bullet1 = "<b>Fuld færdiggørelse</b>: Alle deltagere har underskrevet"
+bullet2 = "<b>Delvis færdiggørelse</b>: Nogle deltagere har ikke underskrevet endnu"
+bullet3 = "Ikke-underskrevne deltagere udelukkes fra det endelige dokument"
+bullet4 = "Når den er færdiggjort, kan du indlæse den underskrevne PDF i aktive filer"
+description = "Færdiggørelse kombinerer alle underskrifter i én underskrevet PDF. Denne handling kan ikke fortrydes."
+title = "Færdiggørelse af session"
+
+[sessionManagement.tooltip.participantRemoval]
+bullet1 = "Kan ikke fjerne deltagere, der allerede har underskrevet"
+bullet2 = "Fjernede deltagere modtager ikke længere meddelelser"
+bullet3 = "Underskriftsrækkefølge justeres automatisk"
+description = "Deltagere kan fjernes fra sessioner, før de underskriver."
+title = "Fjernelse af deltagere"
+
+[sessionManagement.tooltip.signatureOrder]
+bullet1 = "Hver underskrift anvendes sekventielt på PDF'en"
+bullet2 = "Senere underskrivere kan se tidligere underskrifter"
+bullet3 = "Afgørende for godkendelsesarbejdsgange og juridiske beviskæder"
+description = "Den rækkefølge, du angiver, når du opretter sessionen, bestemmer, hvem der underskriver først."
+title = "Underskriftsrækkefølge"
+
+[signatureSettings.tooltip]
+header = "Indstillinger for underskriftsudseende"
+
+[signatureSettings.tooltip.location]
+bullet1 = "Eksempler: \"New York, USA\", \"London Office\", \"Remote\""
+bullet2 = "Ikke det samme som sideplacering"
+bullet3 = "Kan være påkrævet i visse retsområder"
+description = "Valgfri geografisk placering, hvor underskriften blev anvendt. Gemmes i certifikatmetadata."
+title = "Underskriftsplacering"
+
+[signatureSettings.tooltip.logo]
+bullet1 = "Vises sammen med underskrift og tekst"
+bullet2 = "Understøtter PNG-, JPG-formater"
+bullet3 = "Forbedrer det professionelle udseende"
+description = "Tilføj et firmalogo til synlige underskrifter for branding og autenticitet."
+title = "Firmalogo"
+
+[signatureSettings.tooltip.reason]
+bullet1 = "Eksempler: \"Approval\", \"Contract Agreement\", \"Review Complete\""
+bullet2 = "Synlig i PDF'ens underskriftsegenskaber"
+bullet3 = "Nyttigt til revisionsspor og compliance"
+description = "Valgfri tekst, der forklarer, hvorfor dokumentet underskrives. Gemmes i certifikatmetadata."
+title = "Underskriftsårsag"
+
+[signatureSettings.tooltip.visibility]
+bullet1 = "<b>Synlig</b>: Underskrift vises på PDF med tilpasset udseende"
+bullet2 = "<b>Usynlig</b>: Certifikat indlejret uden visuelt mærke"
+bullet3 = "Usynlige underskrifter giver stadig kryptografisk validering"
+description = "Styrer om underskriften er synlig på dokumentet eller indlejres usynligt."
+title = "Underskriftssynlighed"
+
 [settings.configuration]
 advanced = "Avanceret"
 database = "Database"
 endpoints = "Endpoints"
 features = "Funktioner"
+storageSharing = "Fillagring og deling"
 systemSettings = "Systemindstillinger"
 title = "Konfiguration"
 
@@ -6332,10 +6868,13 @@ title = "Log ind på Stirling"
 [setup.selfhosted]
 link = "eller opret forbindelse til en selvhostet konto"
 subtitle = "Indtast dine server-loginoplysninger"
+changeServerLocked = "Din organisation har begrænset denne app til en specifik server"
 switchToLocal = "Brug lokale værktøjer i stedet"
 title = "Log ind på server"
 
 [setup.selfhosted.unreachable]
+changeServer = "Opret forbindelse til en anden server"
+changeServerLocked = "Din organisation har begrænset denne app til en specifik server"
 continueOffline = "Brug lokale værktøjer i stedet"
 message = "Kunne ikke nå {{url}}. Kontroller, at serveren kører og er tilgængelig."
 retry = "Prøv igen"
@@ -6529,6 +7068,15 @@ saved = "Gemt"
 text = "Tekst"
 title = "Underskriftstype"
 
+[signRequest]
+declined = "Underskriftsanmodning afvist"
+fetchFailed = "Kunne ikke indlæse underskriftsanmodning"
+signed = "Dokument underskrevet"
+
+[signSession]
+createFailed = "Kunne ikke oprette underskriftsanmodning"
+created = "Underskriftsanmodning sendt"
+
 [signup]
 accountCreatedSuccessfully = "Konto oprettet! Du kan nu logge ind."
 alreadyHaveAccount = "Har du allerede en konto? Log ind"
@@ -6807,6 +7355,106 @@ title = "Del PDF ved Kapitler"
 [splitPdfByChapters]
 tags = "partitionering,kapitler,merker,organisering"
 
+[storageShare]
+accessed = "Tilgået"
+accessDenied = "Du har ikke adgang til denne delte fil. Bed ejeren om at dele den med dig."
+accessFailed = "Kan ikke indlæse aktivitet."
+accessDeniedBody = "Du har ikke adgang til denne fil. Bed ejeren om at dele den med dig."
+accessDeniedTitle = "Ingen adgang"
+accessLimitedCommenter = "Kommentaradgang kommer snart. Bed ejeren om redaktøradgang, hvis du har brug for at downloade."
+accessLimitedTitle = "Begrænset adgang"
+accessLimitedViewer = "Dette link er kun til visning. Bed ejeren om redaktøradgang, hvis du har brug for at downloade."
+createdAt = "Oprettet"
+download = "Download"
+downloadFailed = "Kan ikke downloade denne fil."
+expiredBody = "Dette delingslink er ugyldigt eller udløbet."
+expiredTitle = "Link udløbet"
+goToLogin = "GÃ¥ til login"
+loadFailed = "Kan ikke åbne delt fil."
+loading = "Indlæser delingslink..."
+loginPrompt = "Log ind for at få adgang til denne delte fil."
+loginRequired = "Login påkrævet"
+openInApp = "Ã…bn i Stirling PDF"
+ownerLabel = "Ejer"
+ownerUnknown = "Ukendt"
+requiresLogin = "Denne delte fil kræver login."
+roleCommenter = "Kommentator"
+roleEditor = "Redaktør"
+roleViewer = "Læser"
+shareHeading = "Delt fil"
+titleDefault = "Delt fil"
+tryAgain = "Prøv igen senere."
+addUser = "Tilføj"
+commenterHint = "Kommentarer kommer snart."
+copied = "Link kopieret til udklipsholder"
+copy = "Kopiér"
+copyFailed = "Kopiering mislykkedes"
+description = "Opret et delingslink til denne fil. Indloggede brugere med linket kan få adgang til den."
+downloadsCount = "Downloads: {{count}}"
+emailWarningBody = "Dette ligner en e-mailadresse. Hvis denne person ikke allerede er Stirling PDF-bruger, vil vedkommende ikke kunne få adgang til filen."
+emailWarningConfirm = "Del alligevel"
+emailWarningTitle = "E-mailadresse"
+errorTitle = "Deling mislykkedes"
+failure = "Kan ikke generere et delingslink. Prøv igen."
+fileLabel = "Fil"
+generate = "Generer link"
+generated = "Delingslink genereret"
+hideActivity = "Skjul aktivitet"
+invalidUsername = "Indtast et gyldigt brugernavn eller en gyldig e-mailadresse."
+lastAccessed = "Sidst tilgået"
+linkAccessTitle = "Adgang via delingslink"
+linkLabel = "Delingslink"
+linksDisabled = "Delingslinks er deaktiveret."
+linksDisabledBody = "Delingslinks er deaktiveret af dine serverindstillinger."
+manage = "Administrer deling"
+manageDescription = "Opret og administrer links for at dele denne fil."
+manageLoadFailed = "Kan ikke indlæse delingslinks."
+manageTitle = "Administrer deling"
+noActivity = "Ingen aktivitet endnu."
+noLinks = "Ingen aktive delingslinks endnu."
+noSharedUsers = "Ingen brugere har adgang endnu."
+removeLink = "Fjern link"
+removeUser = "Fjern"
+revokeFailed = "Kan ikke fjerne delingslinket."
+revoked = "Delingslink fjernet"
+roleLabel = "Rolle"
+sharingDisabled = "Deling er deaktiveret."
+sharingDisabledBody = "Deling er deaktiveret af dine serverindstillinger."
+sharedUsersTitle = "Delte brugere"
+title = "Del fil"
+unknownUser = "Ukendt bruger"
+userAddFailed = "Kan ikke dele med den bruger."
+userAdded = "Bruger tilføjet til delingslisten."
+usernameLabel = "Brugernavn eller e-mail"
+usernamePlaceholder = "Indtast et brugernavn eller en e-mail"
+userRemoveFailed = "Kan ikke fjerne den bruger."
+userRemoved = "Bruger fjernet fra delingslisten."
+viewActivity = "Vis aktivitet"
+viewed = "Vist"
+viewsCount = "Visninger: {{count}}"
+downloaded = "Hentet"
+bulkDescription = "Opret ét link for at dele alle valgte filer med indloggede brugere."
+bulkTitle = "Del valgte filer"
+copyLink = "Kopiér delingslink"
+fileCount = "{{count}} filer valgt"
+ownerOnly = "Kun ejeren kan administrere deling."
+selectSingleFile = "Vælg en enkelt fil for at administrere deling."
+
+[storageUpload]
+description = "Dette uploader den aktuelle fil til serverlager, så du selv kan få adgang."
+errorTitle = "Upload mislykkedes"
+failure = "Upload mislykkedes. Kontroller dine login- og lagerindstillinger."
+fileLabel = "Fil"
+hint = "Offentlige links og adgangstilstande styres af dine serverindstillinger."
+success = "Uploadet til server"
+title = "Upload til server"
+updateButton = "Opdater på server"
+uploadButton = "Upload til server"
+bulkDescription = "Dette uploader de valgte filer til dit serverlager."
+bulkTitle = "Upload valgte filer"
+fileCount = "{{count}} filer valgt"
+more = " +{{count}} flere"
+
 [storage]
 approximateSize = "Omtrent størrelse"
 fileTooLarge = "Filen er for stor. Maksimal størrelse pr. fil er"
@@ -7153,6 +7801,30 @@ title = "Vis/Rediger PDF"
 [warning]
 tooltipTitle = "Advarsel"
 
+[wetSignature.tooltip]
+header = "Metoder til oprettelse af underskrift"
+
+[wetSignature.tooltip.draw]
+bullet1 = "Tilpas pennens farve og tykkelse"
+bullet2 = "Ryd og tegn igen, indtil du er tilfreds"
+bullet3 = "Fungerer på touch-enheder (tablets, telefoner)"
+description = "Opret en håndskrevet underskrift med din mus eller touchscreen. Bedst til personlige, autentiske underskrifter."
+title = "Tegn underskrift"
+
+[wetSignature.tooltip.type]
+bullet1 = "Vælg mellem flere skrifttyper"
+bullet2 = "Tilpas tekststørrelse og farve"
+bullet3 = "Perfekt til standardiserede underskrifter"
+description = "Generér en underskrift ud fra indtastet tekst. Hurtig og ensartet, velegnet til forretningsdokumenter."
+title = "Skriv underskrift"
+
+[wetSignature.tooltip.upload]
+bullet1 = "Understøtter PNG, JPG og andre billedformater"
+bullet2 = "Gennemsigtige baggrunde anbefales for bedste resultat"
+bullet3 = "Billedet ændres i størrelse, så det passer til underskriftsområdet"
+description = "Upload et på forhånd oprettet underskriftsbillede. Ideelt, hvis du har en scannet underskrift eller firmalogo."
+title = "Upload underskriftsbillede"
+
 [watermark]
 completed = "Vandmærke tilføjet"
 desc = "Tilføj tekst- eller billedvandmærker til PDF-filer"
@@ -7333,6 +8005,7 @@ activeSession = "Aktiv session"
 addMembers = "Tilføj medlemmer"
 admin = "Administrator"
 confirmDelete = "Er du sikker på, at du vil slette denne bruger? Denne handling kan ikke fortrydes."
+confirmUnlock = "Er du sikker på, at du vil låse denne brugerkonto op?"
 deleteUser = "Slet bruger"
 deleteUserError = "Kunne ikke slette bruger"
 deleteUserSuccess = "Bruger slettet"
@@ -7341,6 +8014,8 @@ disable = "Deaktivér"
 disabled = "Deaktiveret"
 editRole = "Redigér rolle"
 enable = "Aktivér"
+locked = "låst"
+lockedBadge = "LÃ¥st"
 loading = "Indlæser personer..."
 loginRequired = "Aktivér først login-tilstand"
 member = "Medlem"
@@ -7350,6 +8025,9 @@ searchMembers = "Søg efter medlemmer..."
 status = "Status"
 team = "Team"
 title = "Personer"
+unlockAccount = "LÃ¥s konto op"
+unlockUserError = "Kunne ikke låse brugerkonto op"
+unlockUserSuccess = "Brugerkonto låst op"
 user = "Bruger"
 
 [workspace.people.actions]
diff --git a/frontend/public/locales/de-DE/translation.toml b/frontend/public/locales/de-DE/translation.toml
index 31a1dec13b..6b37ffb95c 100644
--- a/frontend/public/locales/de-DE/translation.toml
+++ b/frontend/public/locales/de-DE/translation.toml
@@ -8,6 +8,7 @@ black = "Schwarz"
 blue = "Blau"
 bored = "Langeweile beim Warten?"
 cancel = "Abbrechen"
+confirm = "Bestätigen"
 changedCredsMessage = "Anmeldedaten geändert!"
 chooseFile = "Datei wählen"
 close = "Schließen"
@@ -146,6 +147,7 @@ insufficientCredits = "Unzureichende Credits. Erforderlich: {{requiredCredits}},
 loadingCredits = "Credits werden geprüft..."
 loadingProStatus = "Abonnementstatus wird geprüft..."
 noticeTopUpOrPlan = "Nicht genug Credits, bitte aufladen oder auf einen Tarif upgraden"
+accessInvite = "Einladen"
 
 [account]
 accountSettings = "Kontoeinstellungen"
@@ -1427,6 +1429,34 @@ title = "Processing"
 description = "Maximale Wartezeit für einen Verarbeitungsauftrag, bevor ein Fehler gemeldet wird."
 label = "Processing Timeout (seconds)"
 
+[admin.settings.storage]
+description = "Server-Speicher und Freigabeoptionen verwalten."
+title = "Dateispeicher & Freigabe"
+
+[admin.settings.storage.enabled]
+description = "Ermöglicht Benutzern, Dateien auf dem Server zu speichern."
+label = "Server-Dateispeicher aktivieren"
+
+[admin.settings.storage.sharing.email]
+description = "Erlaubt das Teilen mit E-Mail-Adressen."
+label = "E-Mail-Freigabe aktivieren"
+mailLink = "E-Mail-Einstellungen konfigurieren"
+mailNote = "Erfordert eine Mail-Konfiguration. "
+
+[admin.settings.storage.sharing.enabled]
+description = "Ermöglicht Benutzern, gespeicherte Dateien freizugeben."
+label = "Freigabe aktivieren"
+
+[admin.settings.storage.sharing.links]
+description = "Erlaubt Freigabe über Links für angemeldete Benutzer."
+frontendUrlLink = "In den Systemeinstellungen konfigurieren"
+frontendUrlNote = "Erfordert eine Frontend-URL. "
+label = "Freigabelinks aktivieren"
+
+[admin.settings.storage.signing.enabled]
+description = "Ermöglicht Benutzern, Signatursitzungen mit mehreren Teilnehmern zu erstellen. Erfordert aktivierten Server-Dateispeicher."
+label = "Gruppensignieren aktivieren (Alpha)"
+
 [admin.settings.unsavedChanges]
 cancel = "Weiter bearbeiten"
 discard = "Änderungen verwerfen"
@@ -2059,7 +2089,19 @@ numbers = "Zahlen/Bereiche: 5, 10-20"
 progressions = "Progressionen: 3n, 4n+1"
 
 [certSign]
+allSigned = "Alle Teilnehmer haben signiert. Bereit zum Finalisieren."
+awaitingSignatures = "Warten auf Signaturen"
+signatureProgress = "{{signedCount}}/{{totalCount}} Signaturen"
 chooseCertificate = "Zertifikatdatei auswählen"
+declined = "Abgelehnt"
+fetchFailed = "Signierdaten konnten nicht geladen werden"
+finalized = "Finalisiert"
+notified = "Ausstehend"
+partialNote = "Sie können vorzeitig mit den aktuellen Signaturen finalisieren. Nicht signierte Teilnehmer werden ausgeschlossen."
+pending = "Ausstehend"
+readyToFinalize = "Bereit zum Finalisieren"
+signed = "Signiert"
+viewed = "Angesehen"
 chooseJksFile = "JKS-Datei auswählen"
 chooseP12File = "PKCS12-Datei auswählen"
 choosePfxFile = "PFX-Datei auswählen"
@@ -2082,6 +2124,7 @@ title = "Zertifikatsignierung"
 invisible = "Unsichtbar"
 stepTitle = "Signatur-Erscheinungsbild"
 visible = "Sichtbar"
+visibility = "Sichtbarkeit"
 
 [certSign.appearance.options]
 title = "Signaturdetails"
@@ -2188,6 +2231,252 @@ bullet4 = "Kann benutzerdefinierte Zertifikate für die Verifizierung verwenden"
 text = "Wenn Sie Signaturen prüfen, zeigt Ihnen das Tool, ob sie gültig sind, wer das Dokument signiert hat, wann es signiert wurde und ob das Dokument seit der Signierung geändert wurde."
 title = "Signaturen überprüfen"
 
+[certSign.collab.finalize]
+button = "Finalisieren und signiertes PDF laden"
+early = "Mit aktuellen Signaturen finalisieren"
+
+[certSign.collab.sessionDetail]
+addButton = "Teilnehmer hinzufügen"
+addParticipants = "Teilnehmer hinzufügen"
+addParticipantsError = "Teilnehmer konnten nicht hinzugefügt werden"
+backToList = "Zurück zu Sitzungen"
+deleteConfirm = "Sind Sie sicher? Dies kann nicht rückgängig gemacht werden."
+deleteError = "Sitzung konnte nicht gelöscht werden"
+deleted = "Sitzung gelöscht"
+deleteSession = "Sitzung löschen"
+dueDate = "Fälligkeitsdatum"
+finalizeError = "Sitzung konnte nicht finalisiert werden"
+loadPdfError = "Signiertes PDF konnte nicht geladen werden"
+loadSignedPdf = "Signiertes PDF in aktive Dateien laden"
+messageLabel = "Nachricht"
+noAdditionalInfo = "Keine weiteren Informationen"
+owner = "Eigentümer"
+participantRemoved = "Teilnehmer entfernt"
+participants = "Teilnehmer"
+participantsAdded = "Teilnehmer erfolgreich hinzugefügt"
+removeParticipant = "Entfernen"
+removeParticipantError = "Teilnehmer konnte nicht entfernt werden"
+selectUsers = "Benutzer auswählen..."
+sessionInfo = "Sitzungsinfo"
+workbenchTitle = "Sitzungsverwaltung"
+
+[certSign.collab.signRequest]
+addedToFiles = "Dokument zu aktiven Dateien hinzugefügt"
+addSignature = "Eigene Signatur hinzufügen"
+addToFiles = "Zu aktiven Dateien hinzufügen"
+advancedSettings = "Erweiterte Einstellungen"
+backToList = "Zurück zu Signaturanfragen"
+certificateChoice = "Wählen Sie ein Zertifikat zum Signieren aus"
+changeSignature = "Signatur ändern"
+clearSignature = "Signatur löschen"
+completeAndSign = "Abschließen & Signieren"
+createNewSignature = "Neue Signatur erstellen"
+declineButton = "Ablehnen"
+decline = "Anfrage ablehnen"
+deleteSelected = "Ausgewählte Signatur löschen"
+drawSignature = "Zeichnen Sie unten Ihre Signatur"
+dueDate = "Fälligkeitsdatum"
+fileTooLarge = "Dateigröße muss unter 5 MB liegen"
+fontFamily = "Schriftfamilie"
+fontSize = "Schriftgröße: {{size}}px"
+fontSizePlaceholder = "Größe"
+from = "Von"
+invalidCertFile = "Bitte wählen Sie eine P12- oder PFX-Zertifikatsdatei aus"
+invalidFileType = "Bitte wählen Sie eine Bilddatei aus"
+location = "Ort (optional)"
+locationPlaceholder = "Von wo aus signieren Sie?"
+message = "Nachricht"
+noCertificate = "Bitte wählen Sie eine Zertifikatsdatei aus"
+noSignatures = "Bitte platzieren Sie mindestens eine Signatur auf dem PDF"
+p12File = "P12/PFX-Zertifikatsdatei"
+password = "Zertifikatspasswort"
+passwordPlaceholder = "Passwort eingeben..."
+penColor = "Stiftfarbe"
+penSize = "Stiftstärke: {{size}}px"
+placementActive = "Klicken Sie ins PDF zum Platzieren"
+placeSignatureButton = "Signatur auf PDF platzieren"
+reason = "Grund (optional)"
+reasonPlaceholder = "Warum signieren Sie?"
+removeImage = "Bild entfernen"
+removeCertFile = "Datei entfernen"
+savedSignatures = "Gespeicherte Signaturen"
+selectFile = "Bilddatei auswählen"
+selectSignatureTitle = "Signatur auswählen oder erstellen"
+signButton = "Dokument signieren"
+signatureInfo = "Diese Einstellungen werden vom Dokumenteigentümer konfiguriert"
+signaturePlaced = "Signatur auf Seite platziert"
+signatureSettings = "Signatur-Einstellungen"
+signatureText = "Signaturtext"
+signatureTextPlaceholder = "Geben Sie Ihren Namen ein..."
+signatureTypeLabel = "Signaturtyp"
+signingTitle = "Signieren"
+textColor = "Textfarbe"
+typeSignature = "Geben Sie Ihren Namen ein, um eine Signatur zu erstellen"
+uploadCert = "Eigenes Zertifikat"
+uploadCertDesc = "Verwenden Sie Ihr eigenes P12/PFX-Zertifikat"
+uploadSignature = "Laden Sie Ihr Signaturbild hoch"
+usePersonalCert = "Persönliches Zertifikat"
+usePersonalCertDesc = "Automatisch für Ihr Konto erzeugt"
+useServerCert = "Organisationszertifikat"
+useServerCertDesc = "Geteiltes Organisationszertifikat"
+workbenchTitle = "Signaturanfrage"
+
+[certSign.collab.signRequest.canvas]
+colorPickerTitle = "Strichfarbe auswählen"
+continue = "Weiter"
+
+[certSign.collab.signRequest.certModal]
+description = "Sie haben {{count}} Signatur(en) platziert. Wählen Sie Ihr Zertifikat, um das Signieren abzuschließen."
+sign = "Dokument signieren"
+certValidating = "Zertifikat wird validiert..."
+certValidUntil = "Zertifikat gültig bis {{date}}"
+certInvalid = "Zertifikat ungültig: {{error}}"
+certInvalidFallback = "Ungültiges Zertifikat"
+certNetworkError = "Zertifikat konnte nicht validiert werden"
+title = "Zertifikat konfigurieren"
+
+[certSign.collab.signRequest.image]
+hint = "Laden Sie ein PNG- oder JPG-Bild Ihrer Signatur hoch"
+
+[certSign.collab.signRequest.mode]
+move = "Signatur verschieben"
+place = "Signatur platzieren"
+title = "Signier- oder Verschiebemodus"
+
+[certSign.collab.signRequest.modeTabs]
+draw = "Zeichnen"
+image = "Hochladen"
+text = "Eingeben"
+
+[certSign.collab.signRequest.placeSignature]
+message = "Klicken Sie auf das PDF, um Ihre Signatur zu platzieren"
+title = "Signatur platzieren"
+
+[certSign.collab.signRequest.preview]
+imageAlt = "Ausgewählte Signatur"
+missing = "Keine Vorschau"
+textFallback = "Signatur"
+
+[certSign.collab.signRequest.saved]
+defaultCanvasLabel = "Gezeichnete Signatur"
+defaultImageLabel = "Hochgeladene Signatur"
+defaultLabel = "Signatur"
+defaultTextLabel = "Eingegebene Signatur"
+delete = "Signatur löschen"
+none = "Keine gespeicherten Signaturen"
+
+[certSign.collab.signRequest.signatureType]
+draw = "Zeichnen"
+type = "Eingeben"
+upload = "Hochladen"
+
+[certSign.collab.signRequest.steps]
+back = "Zurück"
+cancelPlacement = "Platzierung abbrechen"
+certificate = "Zertifikat"
+clickMultipleTimes = "Klicken Sie mehrfach auf das PDF, um Signaturen zu platzieren. Ziehen Sie eine Signatur, um sie zu verschieben oder zu skalieren."
+clickToPlace = "Klicken Sie auf das PDF, wo Ihre Signatur erscheinen soll."
+continue = "Weiter zur Zertifikatsauswahl"
+continueToPlacement = "Weiter zur Platzierung"
+continueToReview = "Weiter zur Prüfung"
+createSignature = "Signatur erstellen"
+invisible = "Unsichtbar"
+location = "Ort:"
+multipleSignatures = "{{count}} Signaturen werden auf das PDF angewendet"
+oneSignature = "1 Signatur wird auf das PDF angewendet"
+placeOnPdf = "Auf PDF platzieren"
+reason = "Grund:"
+reviewTitle = "Vor dem Signieren prüfen"
+signaturePlaced = "Signatur auf Seite {{page}} platziert. Sie können die Position durch erneutes Klicken anpassen oder mit der Prüfung fortfahren."
+visible = "Sichtbar"
+visibility = "Sichtbarkeit:"
+yourSignatures = "Ihre Signaturen ({{count}})"
+
+[certSign.collab.signRequest.text]
+colorLabel = "Farbe"
+fontLabel = "Schriftart"
+fontSizeLabel = "Größe"
+fontSizePlaceholder = "16"
+label = "Signaturtext"
+modalHint = "Geben Sie Ihren Namen ein und klicken Sie dann auf Weiter, um ihn auf dem PDF zu platzieren."
+placeholder = "Geben Sie Ihren Namen ein..."
+
+[certSign.collab.participant]
+certValidating = "Zertifikat wird validiert..."
+certValid = "✓ Zertifikat gültig"
+certValidUntil = " bis {{date}}"
+certInvalid = "✗ {{error}}"
+certInvalidFallback = "Ungültiges Zertifikat"
+certNetworkError = "Zertifikat konnte nicht validiert werden"
+
+[certSign.collab.addParticipants]
+add = "{{count}} Teilnehmer hinzufügen"
+back = "Zurück"
+configureSignatures = "Signatur-Einstellungen konfigurieren"
+continue = "Weiter zu den Signatur-Einstellungen"
+reasonHelp = "Voreinstellung eines Signiergrundes für diese Teilnehmer (optional, kann beim Signieren überschrieben werden)"
+reasonPlaceholder = "z. B. Genehmigung, Prüfung..."
+selectUsers = "Benutzer auswählen"
+
+[certSign.collab.sessionCreation]
+includeSummaryPage = "Seite mit Signaturübersicht einschließen"
+includeSummaryPageHelp = "Am Ende wird eine Übersichtsseite mit allen Signatur-Metadaten hinzugefügt. Die Signaturfelder des digitalen Zertifikats auf einzelnen Seiten werden unterdrückt (Handsignaturen sind nicht betroffen)."
+
+[certSign.collab.sessionList]
+active = "Aktiv"
+finalized = "Finalisiert"
+
+[certSign.collab.signatureSettings]
+description = "Legen Sie fest, wie Signaturen für alle Teilnehmer erscheinen"
+title = "Signaturdarstellung"
+
+[certSign.collab.userSelector]
+inviteUsers = "Benutzer hinzufügen"
+loadError = "Benutzer konnten nicht geladen werden"
+noTeam = "Kein Team"
+noUsers = "Keine weiteren Benutzer gefunden."
+placeholder = "Benutzer auswählen..."
+
+[certSign.mobile]
+panelActions = "Aktionen"
+panelDocument = "Dokument"
+panelPeople = "Personen"
+
+[certSign.sessions]
+deleted = "Sitzung gelöscht"
+fetchFailed = "Sitzungsdetails konnten nicht geladen werden"
+finalized = "Sitzung finalisiert"
+loaded = "Signiertes PDF geladen"
+pdfNotReady = "PDF noch nicht bereit"
+pdfNotReadyDesc = "Das signierte PDF wird erzeugt. Bitte versuchen Sie es in Kürze erneut."
+
+[certificateChoice.tooltip]
+header = "Zertifikatstypen"
+
+[certificateChoice.tooltip.organization]
+bullet1 = "Von Systemadministratoren verwaltet"
+bullet2 = "Für berechtigte Benutzer freigegeben"
+bullet3 = "Repräsentiert die Unternehmensidentität, nicht die eines Einzelnen"
+bullet4 = "Am besten geeignet für: Offizielle Dokumente, Team-Signaturen"
+description = "Ein gemeinsames Zertifikat Ihrer Organisation. Wird für unternehmensweite Signierberechtigungen verwendet."
+title = "Organisationszertifikat"
+
+[certificateChoice.tooltip.personal]
+bullet1 = "Bei der ersten Nutzung automatisch erzeugt"
+bullet2 = "An Ihr Benutzerkonto gebunden"
+bullet3 = "Kann nicht mit anderen Benutzern geteilt werden"
+bullet4 = "Am besten geeignet für: Persönliche Dokumente, individuelle Verantwortlichkeit"
+description = "Ein automatisch generiertes Zertifikat, das Ihrem Benutzerkonto eindeutig zugeordnet ist. Geeignet für individuelle Signaturen."
+title = "Persönliches Zertifikat"
+
+[certificateChoice.tooltip.upload]
+bullet1 = "Erfordert P12/PFX-Datei und Passwort"
+bullet2 = "Kann von externen Zertifizierungsstellen ausgestellt werden"
+bullet3 = "Höheres Vertrauensniveau für juristische Dokumente"
+bullet4 = "Am besten geeignet für: Rechtsverbindliche Verträge, externe Validierung"
+description = "Verwenden Sie Ihre eigene PKCS#12-Zertifikatsdatei. Bietet vollständige Kontrolle über die Zertifikateigenschaften."
+title = "Eigenes P12 hochladen"
+
 [changeCreds]
 changePassword = "Sie verwenden die Standard-Zugangsdaten. Bitte geben Sie ein neues Passwort ein."
 changeUsername = "Aktualisieren Sie Ihren Benutzernamen. Nach dem Update werden Sie abgemeldet."
@@ -3242,6 +3531,46 @@ totalSelected = "Gesamt ausgewählt"
 unsupported = "Nicht unterstützt"
 unzip = "Entpacken"
 uploadError = "Einige Dateien konnten nicht hochgeladen werden."
+copyCreated = "Kopie auf diesem Gerät gespeichert."
+copyFailed = "Kopie konnte nicht erstellt werden."
+leaveShare = "Aus meiner Liste entfernen"
+leaveShareFailed = "Die freigegebene Datei konnte nicht entfernt werden."
+leaveShareSuccess = "Aus Ihrer Freigabeliste entfernt."
+removeBoth = "Aus beiden entfernen"
+removeFilePrompt = "Diese Datei ist auf diesem Gerät und auf Ihrem Server gespeichert. Wo möchten Sie sie entfernen?"
+removeFileTitle = "Datei entfernen"
+removeLocalOnly = "Nur dieses Gerät"
+removeServerFailed = "Die Datei konnte nicht vom Server entfernt werden."
+removeServerOnly = "Nur Server"
+removeServerOnlyPrompt = "Diese Datei ist nur auf Ihrem Server gespeichert. Möchten Sie sie vom Server entfernen?"
+removeServerSuccess = "Vom Server entfernt."
+removeSharedPrompt = "Diese Datei wurde für Sie freigegeben. Sie können sie von diesem Gerät oder aus Ihrer Freigabeliste entfernen."
+removeSharedServerOnlyBlockedPrompt = "Diese Datei wurde für Sie freigegeben und ist nur auf dem Server gespeichert."
+removeSharedServerOnlyPrompt = "Diese Datei wurde für Sie freigegeben und ist nur auf dem Server gespeichert. Aus Ihrer Liste entfernen?"
+changesNotUploaded = "Änderungen nicht hochgeladen"
+cloudFile = "Cloud-Datei"
+filterAll = "Alle"
+filterLocal = "Lokal"
+filterSharedByMe = "Von mir freigegeben"
+filterSharedWithMe = "Für mich freigegeben"
+lastSynced = "Zuletzt synchronisiert"
+localOnly = "Nur lokal"
+makeCopy = "Kopie erstellen"
+owner = "Eigentümer"
+ownerUnknown = "Unbekannt"
+share = "Freigeben"
+shareSelected = "Auswahl freigeben"
+sharedByYou = "Von Ihnen freigegeben"
+sharedEditNoticeBody = "Sie haben keine Bearbeitungsrechte für die Serverversion dieser Datei. Alle Änderungen werden als lokale Kopie gespeichert."
+sharedEditNoticeConfirm = "Verstanden"
+sharedEditNoticeTitle = "Schreibgeschützte Serverkopie"
+sharedWithYou = "Für Sie freigegeben"
+sharing = "Freigabe"
+storageState = "Speicher"
+synced = "Synchronisiert"
+updateOnServer = "Auf dem Server aktualisieren"
+uploadSelected = "Auswahl hochladen"
+uploadToServer = "Auf den Server hochladen"
 
 [files]
 addFiles = "Dateien hinzufügen"
@@ -3367,6 +3696,77 @@ title = "Ãœber das Abflachen von PDFs"
 discord = "Discord"
 issues = "GitHub"
 
+[groupSigning.tooltip]
+header = "Ãœber das Gruppensignieren"
+
+[groupSigning.tooltip.finalization]
+bullet1 = "Alle Signaturen werden in der von Ihnen festgelegten Teilnehmerreihenfolge angewendet"
+bullet2 = "Sie können bei Bedarf mit teilweisen Signaturen finalisieren"
+bullet3 = "Nach dem Finalisieren kann die Sitzung nicht mehr geändert werden"
+description = "Sobald alle Teilnehmer signiert haben (oder Sie sich für eine vorzeitige Finalisierung entscheiden), können Sie das endgültige signierte PDF erzeugen."
+title = "Finalisierungsprozess"
+
+[groupSigning.tooltip.roles]
+bullet1 = "Eigentümer (Sie): erstellt die Sitzung, konfiguriert Signaturstandards, finalisiert das Dokument"
+bullet2 = "Teilnehmer: Erstellen ihre Signatur, wählen ein Zertifikat und platzieren sie im PDF"
+bullet3 = "Teilnehmer können Sichtbarkeit, Grund oder Ort der Signatur nicht ändern"
+description = "Sie steuern die Einstellungen zur Signaturdarstellung für alle Teilnehmer."
+title = "Teilnehmerrollen"
+
+[groupSigning.tooltip.sequential]
+bullet1 = "Der erste Teilnehmer muss signieren, bevor der zweite auf das Dokument zugreifen kann"
+bullet2 = "Stellt die korrekte Signierreihenfolge für rechtliche Konformität sicher"
+bullet3 = "Sie können die Teilnehmer durch Ziehen in der Liste neu anordnen"
+description = "Teilnehmer signieren Dokumente in der von Ihnen festgelegten Reihenfolge. Jeder Unterzeichner erhält eine Benachrichtigung, wenn er an der Reihe ist."
+title = "Sequenzielles Signieren"
+
+[groupSigning.steps]
+back = "Zurück"
+completed = "Abgeschlossen"
+current = "Aktuell"
+stepLabel = "Schritt {{number}}"
+
+[groupSigning.steps.configureDefaults]
+continue = "Weiter zur Prüfung"
+invisible = "Signaturen sind unsichtbar (nur Metadaten)"
+locationLabel = "Ort:"
+preview = "Vorschau"
+reasonLabel = "Grund:"
+title = "Signatur-Einstellungen konfigurieren"
+visible = "Signaturen sind auf Seite {{page}} sichtbar"
+
+[groupSigning.steps.review]
+document = "Dokument"
+dueDate = "Fälligkeitsdatum (optional)"
+dueDatePlaceholder = "Fälligkeitsdatum auswählen..."
+invisible = "Unsichtbar (nur Metadaten)"
+location = "Ort:"
+logo = "Logo:"
+logoHidden = "Kein Logo"
+logoShown = "Stirling PDF-Logo wird angezeigt"
+participants = "Teilnehmer"
+reason = "Grund:"
+send = "Signaturanfragen senden"
+signatureSettings = "Signatur-Einstellungen"
+title = "Sitzungsdetails prüfen"
+titleShort = "Prüfen & Senden"
+visibility = "Sichtbarkeit:"
+visible = "Auf Seite {{page}} sichtbar"
+participantCount = "{{count}} Teilnehmer signieren der Reihe nach"
+
+[groupSigning.steps.selectDocument]
+continue = "Weiter zur Teilnehmerauswahl"
+noFile = "Bitte wählen Sie eine einzelne PDF-Datei aus Ihren aktiven Dateien, um eine Signiersitzung zu erstellen."
+selectedFile = "Ausgewähltes Dokument"
+title = "Dokument auswählen"
+
+[groupSigning.steps.selectParticipants]
+continue = "Weiter zu den Signatur-Einstellungen"
+count = "{{count}} Teilnehmer ausgewählt"
+label = "Teilnehmer auswählen"
+placeholder = "Teilnehmer zum Signieren auswählen..."
+title = "Teilnehmer auswählen"
+
 [getPdfInfo]
 downloadJson = "Als JSON herunterladen"
 downloads = "Downloads"
@@ -4460,7 +4860,10 @@ zoomOut = "Verkleinern"
 
 [viewer]
 cannotPreviewFile = "Datei kann nicht in der Vorschau angezeigt werden"
+disableColorFilter = "Farbfilter deaktivieren"
 dualPageView = "Doppelseitenansicht"
+enableDarkFilter = "Dunkelfilter aktivieren"
+enableSepiaFilter = "Sepia-Filter aktivieren"
 firstPage = "Erste Seite"
 lastPage = "Letzte Seite"
 nextPage = "Nächste Seite"
@@ -4470,6 +4873,22 @@ singlePageView = "Einzelseitenansicht"
 unknownFile = "Unbekannte Datei"
 zoomIn = "Vergrößern"
 zoomOut = "Verkleinern"
+resetZoom = "Zoom zurücksetzen"
+
+[viewer.nonPdf]
+fileTypeBadge = "{{type}}-Datei"
+convertToPdf = "In PDF konvertieren"
+loading = "Laden..."
+emptyFile = "Leere Datei"
+csvStats = "{{rows}} Zeilen · {{columns}} Spalten · {{size}}"
+sortedBy = "Sortiert nach: {{column}}"
+columnDefault = "Spalte {{index}}"
+htmlPreviewWarning = "HTML-Vorschau — externe Ressourcen werden möglicherweise nicht geladen · {{size}}"
+htmlPreview = "HTML-Vorschau"
+invalidJson = "Ungültiges JSON — Rohinhalt wird angezeigt"
+textStats = "{{lines}} Zeilen · {{size}}"
+lineNumbers = "Zeilennummern"
+renderMarkdown = "Markdown rendern"
 
 [viewer.attachments]
 title = "Attachments"
@@ -4531,6 +4950,7 @@ toggleAttachments = "Toggle Attachments"
 toggleTheme = "Design wechseln"
 language = "Sprache"
 toggleAnnotations = "Anmerkungen ein-/ausblenden"
+toggleLayers = "Ebenen umschalten"
 search = "PDF durchsuchen"
 panMode = "Verschiebemodus"
 applyRedactionsFirst = "Apply redactions first"
@@ -5407,20 +5827,72 @@ title = "Datei drucken"
 2 = "Druckernamen eingeben"
 
 [quickAccess]
+access = "Zugriff"
+accessAddPerson = "Weitere Person hinzufügen"
+accessBack = "Zurück"
+accessCopyLink = "Link kopieren"
+accessEmail = "E-Mail-Adresse"
+accessEmailPlaceholder = "name@company.com"
+accessFileLabel = "Datei"
+accessGeneral = "Allgemeiner Zugriff"
+accessInviteTitle = "Personen einladen"
+accessOwner = "Eigentümer"
+accessPanel = "Dokumentzugriff"
+accessPeople = "Personen mit Zugriff"
+accessRemove = "Entfernen"
+accessRestricted = "Eingeschränkt"
+accessRestrictedHint = "Nur Personen mit Zugriff können öffnen"
+accessRole = "Rolle"
+accessRoleCommenter = "Kommentator"
+accessRoleEditor = "Bearbeiter"
+accessRoleViewer = "Betrachter"
+accessSelectedFile = "Ausgewählte Datei"
+accessSendInvite = "Einladung senden"
+accessTitle = "Dokumentzugriff"
+accessYou = "Sie"
 account = "Konto"
+activeSessions = "Aktive Sitzungen"
+activeTab = "Aktiv"
 activity = "Verlauf"
 adminSettings = "Admin Optionen"
+allSessions = "Alle Sitzungen"
 allTools = "Werkzeuge"
 automate = "Autom."
+back = "Zurück"
+certSign = "Mit Zertifikat signieren"
+completedSessions = "Abgeschlossene Sitzungen"
+completedTab = "Abgeschlossen"
 config = "Konfig"
+createNew = "Neue Anfrage erstellen"
+createSession = "Signaturanfrage erstellen"
+dueDate = "Fälligkeitsdatum (optional)"
 files = "Dateien"
 help = "Hilfe"
+noActiveSessions = "Keine ausstehenden Signaturanfragen oder aktiven Sitzungen"
+noCompletedSessions = "Keine abgeschlossenen Sitzungen"
+noFile = "Keine Datei ausgewählt"
 read = "Lesen"
 reader = "Reader"
+refresh = "Aktualisieren"
+requestSignatures = "Signaturen anfordern"
+selectSingleFileToRequest = "Wählen Sie eine einzelne PDF-Datei, um Signaturen anzufordern"
+selectedFile = "Ausgewählte Datei"
+selectUsers = "Benutzer zum Signieren auswählen"
+selectUsersPlaceholder = "Teilnehmer auswählen..."
+sendingRequest = "Wird gesendet..."
 settings = "Optionen"
 showMeAround = "Rundgang starten"
 sign = "Signatur"
+signatureRequests = "Signaturanfragen"
+signYourself = "Selbst signieren"
+newRequest = "Neue Anfrage"
 tours = "Touren"
+wetSign = "Signatur hinzufügen"
+filterMine = "Meine"
+filterOverdue = "Überfällig"
+filterSigned = "Signiert"
+filterDeclined = "Abgelehnt"
+searchDocuments = "Dokumente suchen…"
 
 [quickAccess.helpMenu]
 adminTour = "Admin-Tour"
@@ -6050,11 +6522,75 @@ toolNotAvailableLocally = "Ihr Stirling-PDF-Server ist offline und „{{endpoint
 expired = "Ihre Sitzung ist abgelaufen. Bitte laden Sie die Seite neu und versuchen Sie es erneut."
 refreshPage = "Seite aktualisieren"
 
+[sessionManagement.tooltip]
+header = "Signiersitzungen verwalten"
+
+[sessionManagement.tooltip.addParticipants]
+bullet1 = "Neue Teilnehmer werden am Ende der Signierreihenfolge hinzugefügt"
+bullet2 = "Teilnehmer können nach der Finalisierung nicht mehr hinzugefügt werden"
+bullet3 = "Jeder Teilnehmer erhält eine Benachrichtigung, wenn er an der Reihe ist"
+description = "Sie können einer aktiven Sitzung jederzeit vor der Finalisierung weitere Teilnehmer hinzufügen."
+title = "Teilnehmer hinzufügen"
+
+[sessionManagement.tooltip.finalization]
+bullet1 = "<b>Vollständige Finalisierung</b>: Alle Teilnehmer haben signiert"
+bullet2 = "<b>Teilweise Finalisierung</b>: Einige Teilnehmer haben noch nicht signiert"
+bullet3 = "Nicht signierte Teilnehmer werden aus dem endgültigen Dokument ausgeschlossen"
+bullet4 = "Nach der Finalisierung können Sie das signierte PDF in aktive Dateien laden"
+description = "Die Finalisierung kombiniert alle Signaturen zu einem einzigen signierten PDF. Diese Aktion kann nicht rückgängig gemacht werden."
+title = "Sitzungsfinalisierung"
+
+[sessionManagement.tooltip.participantRemoval]
+bullet1 = "Teilnehmer, die bereits signiert haben, können nicht entfernt werden"
+bullet2 = "Entfernte Teilnehmer erhalten keine Benachrichtigungen mehr"
+bullet3 = "Die Signierreihenfolge passt sich automatisch an"
+description = "Teilnehmer können aus Sitzungen entfernt werden, bevor sie signieren."
+title = "Teilnehmer entfernen"
+
+[sessionManagement.tooltip.signatureOrder]
+bullet1 = "Jede Signatur wird nacheinander auf das PDF angewendet"
+bullet2 = "Spätere Unterzeichner können frühere Signaturen sehen"
+bullet3 = "Wichtig für Genehmigungs-Workflows und rechtliche Nachweisketten"
+description = "Die von Ihnen bei der Erstellung der Sitzung festgelegte Reihenfolge bestimmt, wer zuerst signiert."
+title = "Signaturreihenfolge"
+
+[signatureSettings.tooltip]
+header = "Einstellungen für Signaturdarstellung"
+
+[signatureSettings.tooltip.location]
+bullet1 = "Beispiele: \"New York, USA\", \"London Office\", \"Remote\""
+bullet2 = "Nicht dasselbe wie die Seitenposition"
+bullet3 = "Kann in bestimmten Rechtsräumen erforderlich sein"
+description = "Optionaler geografischer Ort, an dem die Signatur angewendet wurde. Wird in den Zertifikat-Metadaten gespeichert."
+title = "Signaturort"
+
+[signatureSettings.tooltip.logo]
+bullet1 = "Wird neben Signatur und Text angezeigt"
+bullet2 = "Unterstützt PNG- und JPG-Formate"
+bullet3 = "Verbessert das professionelle Erscheinungsbild"
+description = "Fügen Sie sichtbaren Signaturen ein Firmenlogo für Branding und Authentizität hinzu."
+title = "Firmenlogo"
+
+[signatureSettings.tooltip.reason]
+bullet1 = "Beispiele: \"Genehmigung\", \"Vertragsvereinbarung\", \"Prüfung abgeschlossen\""
+bullet2 = "Sichtbar in den PDF-Signatureigenschaften"
+bullet3 = "Nützlich für Audit-Trails und Compliance"
+description = "Optionaler Text, der erklärt, warum das Dokument signiert wird. Wird in den Zertifikat-Metadaten gespeichert."
+title = "Signiergrund"
+
+[signatureSettings.tooltip.visibility]
+bullet1 = "<b>Sichtbar</b>: Signatur erscheint im PDF mit benutzerdefinierter Darstellung"
+bullet2 = "<b>Unsichtbar</b>: Zertifikat wird ohne sichtbare Markierung eingebettet"
+bullet3 = "Unsichtbare Signaturen bieten dennoch kryptografische Validierung"
+description = "Steuert, ob die Signatur im Dokument sichtbar ist oder unsichtbar eingebettet wird."
+title = "Signatursichtbarkeit"
+
 [settings.configuration]
 advanced = "Erweitert"
 database = "Datenbank"
 endpoints = "Endpunkte"
 features = "Funktionen"
+storageSharing = "Dateispeicher & Freigabe"
 systemSettings = "Systemeinstellungen"
 title = "Konfiguration"
 
@@ -6332,10 +6868,13 @@ title = "Bei Stirling anmelden"
 [setup.selfhosted]
 link = "oder mit einem selbstgehosteten Konto verbinden"
 subtitle = "Geben Sie Ihre Server-Anmeldedaten ein"
+changeServerLocked = "Ihre Organisation hat diese App auf einen bestimmten Server beschränkt"
 switchToLocal = "Stattdessen lokale Tools verwenden"
 title = "Am Server anmelden"
 
 [setup.selfhosted.unreachable]
+changeServer = "Mit einem anderen Server verbinden"
+changeServerLocked = "Ihre Organisation hat diese App auf einen bestimmten Server beschränkt"
 continueOffline = "Stattdessen lokale Tools verwenden"
 message = "Konnte {{url}} nicht erreichen. Prüfen Sie, ob der Server läuft und erreichbar ist."
 retry = "Erneut versuchen"
@@ -6529,6 +7068,15 @@ saved = "Gespeichert"
 text = "Text"
 title = "Signaturtyp"
 
+[signRequest]
+declined = "Signaturanfrage abgelehnt"
+fetchFailed = "Signaturanfrage konnte nicht geladen werden"
+signed = "Dokument erfolgreich signiert"
+
+[signSession]
+createFailed = "Signaturanfrage konnte nicht erstellt werden"
+created = "Signaturanfrage gesendet"
+
 [signup]
 accountCreatedSuccessfully = "Konto erfolgreich erstellt! Sie können sich jetzt anmelden."
 alreadyHaveAccount = "Sie haben bereits ein Konto? Anmelden"
@@ -6807,6 +7355,106 @@ title = "PDF nach Kapiteln aufteilen"
 [splitPdfByChapters]
 tags = "aufteilen,kapitel,lesezeichen,organisieren"
 
+[storageShare]
+accessed = "Zugegriffen"
+accessDenied = "Sie haben keinen Zugriff auf diese freigegebene Datei. Bitten Sie den Eigentümer, sie für Sie freizugeben."
+accessFailed = "Aktivität kann nicht geladen werden."
+accessDeniedBody = "Sie haben keinen Zugriff auf diese Datei. Bitten Sie den Eigentümer, sie für Sie freizugeben."
+accessDeniedTitle = "Kein Zugriff"
+accessLimitedCommenter = "Kommentarzugriff ist bald verfügbar. Bitten Sie den Eigentümer um Bearbeiterzugriff, wenn Sie herunterladen müssen."
+accessLimitedTitle = "Eingeschränkter Zugriff"
+accessLimitedViewer = "Dieser Link ist nur zum Ansehen. Bitten Sie den Eigentümer um Bearbeiterzugriff, wenn Sie herunterladen müssen."
+createdAt = "Erstellt"
+download = "Herunterladen"
+downloadFailed = "Diese Datei kann nicht heruntergeladen werden."
+expiredBody = "Dieser Freigabelink ist ungültig oder abgelaufen."
+expiredTitle = "Link abgelaufen"
+goToLogin = "Zum Login"
+loadFailed = "Freigegebene Datei kann nicht geöffnet werden."
+loading = "Freigabelink wird geladen..."
+loginPrompt = "Melden Sie sich an, um auf diese freigegebene Datei zuzugreifen."
+loginRequired = "Anmeldung erforderlich"
+openInApp = "In Stirling PDF öffnen"
+ownerLabel = "Eigentümer"
+ownerUnknown = "Unbekannt"
+requiresLogin = "Für diese freigegebene Datei ist eine Anmeldung erforderlich."
+roleCommenter = "Kommentator"
+roleEditor = "Bearbeiter"
+roleViewer = "Betrachter"
+shareHeading = "Freigegebene Datei"
+titleDefault = "Freigegebene Datei"
+tryAgain = "Bitte versuchen Sie es später erneut."
+addUser = "Hinzufügen"
+commenterHint = "Kommentieren ist bald verfügbar."
+copied = "Link in die Zwischenablage kopiert"
+copy = "Kopieren"
+copyFailed = "Kopieren fehlgeschlagen"
+description = "Erstellen Sie einen Freigabelink für diese Datei. Angemeldete Benutzer mit dem Link können darauf zugreifen."
+downloadsCount = "Downloads: {{count}}"
+emailWarningBody = "Das sieht nach einer E-Mail-Adresse aus. Wenn diese Person noch kein Stirling PDF-Benutzer ist, kann sie nicht auf die Datei zugreifen."
+emailWarningConfirm = "Trotzdem freigeben"
+emailWarningTitle = "E-Mail-Adresse"
+errorTitle = "Freigabe fehlgeschlagen"
+failure = "Freigabelink kann nicht erstellt werden. Bitte versuchen Sie es erneut."
+fileLabel = "Datei"
+generate = "Link erzeugen"
+generated = "Freigabelink erstellt"
+hideActivity = "Aktivität ausblenden"
+invalidUsername = "Geben Sie einen gültigen Benutzernamen oder eine E-Mail-Adresse ein."
+lastAccessed = "Zuletzt zugegriffen"
+linkAccessTitle = "Zugriff per Freigabelink"
+linkLabel = "Freigabelink"
+linksDisabled = "Freigabelinks sind deaktiviert."
+linksDisabledBody = "Freigabelinks sind durch Ihre Servereinstellungen deaktiviert."
+manage = "Freigabe verwalten"
+manageDescription = "Erstellen und verwalten Sie Links, um diese Datei freizugeben."
+manageLoadFailed = "Freigabelinks können nicht geladen werden."
+manageTitle = "Freigabe verwalten"
+noActivity = "Noch keine Aktivität."
+noLinks = "Noch keine aktiven Freigabelinks."
+noSharedUsers = "Noch keine Benutzer mit Zugriff."
+removeLink = "Link entfernen"
+removeUser = "Entfernen"
+revokeFailed = "Freigabelink kann nicht entfernt werden."
+revoked = "Freigabelink entfernt"
+roleLabel = "Rolle"
+sharingDisabled = "Freigabe ist deaktiviert."
+sharingDisabledBody = "Die Freigabe wurde durch Ihre Servereinstellungen deaktiviert."
+sharedUsersTitle = "Freigegebene Benutzer"
+title = "Datei freigeben"
+unknownUser = "Unbekannter Benutzer"
+userAddFailed = "Freigabe für diesen Benutzer nicht möglich."
+userAdded = "Benutzer zur Freigabeliste hinzugefügt."
+usernameLabel = "Benutzername oder E-Mail"
+usernamePlaceholder = "Geben Sie einen Benutzernamen oder eine E-Mail ein"
+userRemoveFailed = "Benutzer konnte nicht entfernt werden."
+userRemoved = "Benutzer aus Freigabeliste entfernt."
+viewActivity = "Aktivität anzeigen"
+viewed = "Angesehen"
+viewsCount = "Aufrufe: {{count}}"
+downloaded = "Heruntergeladen"
+bulkDescription = "Einen Link erstellen, um alle ausgewählten Dateien mit angemeldeten Benutzern freizugeben."
+bulkTitle = "Ausgewählte Dateien freigeben"
+copyLink = "Freigabelink kopieren"
+fileCount = "{{count}} Dateien ausgewählt"
+ownerOnly = "Nur der Besitzer kann die Freigabe verwalten."
+selectSingleFile = "Wählen Sie eine einzelne Datei aus, um die Freigabe zu verwalten."
+
+[storageUpload]
+description = "Dadurch wird die aktuelle Datei in den Serverspeicher hochgeladen, damit Sie selbst darauf zugreifen können."
+errorTitle = "Hochladen fehlgeschlagen"
+failure = "Hochladen fehlgeschlagen. Bitte überprüfen Sie Ihre Anmelde- und Speichereinstellungen."
+fileLabel = "Datei"
+hint = "Öffentliche Links und Zugriffsmodi werden durch Ihre Servereinstellungen gesteuert."
+success = "Auf Server hochgeladen"
+title = "Auf Server hochladen"
+updateButton = "Auf Server aktualisieren"
+uploadButton = "Auf Server hochladen"
+bulkDescription = "Dies lädt die ausgewählten Dateien in Ihren Serverspeicher hoch."
+bulkTitle = "Ausgewählte Dateien hochladen"
+fileCount = "{{count}} Dateien ausgewählt"
+more = " +{{count}} weitere"
+
 [storage]
 approximateSize = "Ungefähre Größe"
 fileTooLarge = "Datei zu groß. Maximale Größe pro Datei ist"
@@ -7153,6 +7801,30 @@ title = "PDF anzeigen/bearbeiten"
 [warning]
 tooltipTitle = "Warnung"
 
+[wetSignature.tooltip]
+header = "Methoden zur Signaturerstellung"
+
+[wetSignature.tooltip.draw]
+bullet1 = "Stiftfarbe und -stärke anpassen"
+bullet2 = "Löschen und neu zeichnen, bis Sie zufrieden sind"
+bullet3 = "Funktioniert auf Touch-Geräten (Tablets, Smartphones)"
+description = "Erstellen Sie eine handschriftliche Signatur mit Ihrer Maus oder dem Touchscreen. Am besten für persönliche, authentische Signaturen."
+title = "Signatur zeichnen"
+
+[wetSignature.tooltip.type]
+bullet1 = "Aus mehreren Schriftarten wählen"
+bullet2 = "Textgröße und -farbe anpassen"
+bullet3 = "Ideal für standardisierte Signaturen"
+description = "Erzeugen Sie eine Signatur aus eingegebenem Text. Schnell und einheitlich, geeignet für Geschäftsdokumente."
+title = "Signatur eingeben"
+
+[wetSignature.tooltip.upload]
+bullet1 = "Unterstützt PNG, JPG und andere Bildformate"
+bullet2 = "Transparente Hintergründe für beste Ergebnisse empfohlen"
+bullet3 = "Das Bild wird an den Signaturbereich angepasst"
+description = "Laden Sie ein bereits erstelltes Signaturbild hoch. Ideal, wenn Sie eine eingescannte Unterschrift oder ein Firmenlogo haben."
+title = "Signaturbild hochladen"
+
 [watermark]
 completed = "Wasserzeichen hinzugefügt"
 desc = "Text- oder Bildwasserzeichen zu PDF-Dateien hinzufügen"
@@ -7333,6 +8005,7 @@ activeSession = "Aktive Sitzung"
 addMembers = "Mitglieder hinzufügen"
 admin = "Admin"
 confirmDelete = "Sind Sie sicher, dass Sie diesen Benutzer löschen möchten? Diese Aktion kann nicht rückgängig gemacht werden."
+confirmUnlock = "Möchten Sie dieses Benutzerkonto wirklich entsperren?"
 deleteUser = "Benutzer löschen"
 deleteUserError = "Benutzer konnte nicht gelöscht werden"
 deleteUserSuccess = "Benutzer erfolgreich gelöscht"
@@ -7341,6 +8014,8 @@ disable = "Deaktivieren"
 disabled = "Deaktiviert"
 editRole = "Rolle bearbeiten"
 enable = "Aktivieren"
+locked = "gesperrt"
+lockedBadge = "Gesperrt"
 loading = "Personen werden geladen..."
 loginRequired = "Zuerst Login-Modus aktivieren"
 member = "Mitglied"
@@ -7350,6 +8025,9 @@ searchMembers = "Mitglieder suchen..."
 status = "Status"
 team = "Team"
 title = "Personen"
+unlockAccount = "Konto entsperren"
+unlockUserError = "Benutzerkonto konnte nicht entsperrt werden"
+unlockUserSuccess = "Benutzerkonto erfolgreich entsperrt"
 user = "Benutzer"
 
 [workspace.people.actions]
diff --git a/frontend/public/locales/el-GR/translation.toml b/frontend/public/locales/el-GR/translation.toml
index 040e813f83..eabfeab528 100644
--- a/frontend/public/locales/el-GR/translation.toml
+++ b/frontend/public/locales/el-GR/translation.toml
@@ -8,6 +8,7 @@ black = "Μα��ο"
 blue = "Μπλε"
 bored = "Βα�ιέστε την αναμονή;"
 cancel = "Άκυ�ο"
+confirm = "Επιβεβαίωση"
 changedCredsMessage = "Τα διαπιστευτή�ια άλλαξαν!"
 chooseFile = "Επιλέξτε α�χείο"
 close = "Κλείσιμο"
@@ -146,6 +147,7 @@ insufficientCredits = "Ανεπα�κείς μονάδες. Απαιτο�ντα
 loadingCredits = "Έλεγχος μονάδων..."
 loadingProStatus = "Έλεγχος κατάστασης συνδ�ομής..."
 noticeTopUpOrPlan = "Μη επα�κείς μονάδες, πα�ακαλο�με ανανεώστε το υπόλοιπο ή αναβαθμίστε σε πλάνο"
+accessInvite = "Π�όσκληση"
 
 [account]
 accountSettings = "Ρυθμίσεις λογα�ιασμο�"
@@ -1427,6 +1429,34 @@ title = "Επεξε�γασία"
 description = "Μέγιστος χ�όνος αναμονής επεξε�γασίας π�ιν αναφε�θεί σφάλμα."
 label = "Χ�ονικό ό�ιο επεξε�γασίας (δευτ.)"
 
+[admin.settings.storage]
+description = "Έλεγχος αποθήκευσης διακομιστή και επιλογών κοινής χ�ήσης."
+title = "Αποθήκευση Α�χείων & Κοινή Χ�ήση"
+
+[admin.settings.storage.enabled]
+description = "�α επιτ�έπεται στους χ�ήστες να αποθηκε�ουν α�χεία στον διακομιστή."
+label = "Ενε�γοποίηση αποθήκευσης α�χείων στον διακομιστή"
+
+[admin.settings.storage.sharing.email]
+description = "�α επιτ�έπεται η κοινή χ�ήση με διευθ�νσεις email."
+label = "Ενε�γοποίηση κοινής χ�ήσης μέσω email"
+mailLink = "Διαμό�φωση �υθμίσεων αλληλογ�αφίας"
+mailNote = "Απαιτεί ��θμιση αλληλογ�αφίας. "
+
+[admin.settings.storage.sharing.enabled]
+description = "�α επιτ�έπεται στους χ�ήστες να μοι�άζονται αποθηκευμένα α�χεία."
+label = "Ενε�γοποίηση κοινής χ�ήσης"
+
+[admin.settings.storage.sharing.links]
+description = "�α επιτ�έπεται η κοινή χ�ήση μέσω συνδέσμων με σ�νδεση."
+frontendUrlLink = "Ρ�θμιση στις Ρυθμίσεις Συστήματος"
+frontendUrlNote = "Απαιτεί Frontend URL. "
+label = "Ενε�γοποίηση συνδέσμων κοινής χ�ήσης"
+
+[admin.settings.storage.signing.enabled]
+description = "�α επιτ�έπεται στους χ�ήστες να δημιου�γο�ν συνεδ�ίες υπογ�αφής εγγ�άφων με πολλο�ς συμμετέχοντες. Απαιτεί ενε�γοποιημένη την αποθήκευση α�χείων στον διακομιστή."
+label = "Ενε�γοποίηση ομαδικής υπογ�αφής (Alpha)"
+
 [admin.settings.unsavedChanges]
 cancel = "Συνέχεια επεξε�γασίας"
 discard = "Από��ιψη αλλαγών"
@@ -2059,7 +2089,19 @@ numbers = "Α�ιθμοί/ε��η: 5, 10-20"
 progressions = "Π�όοδοι: 3n, 4n+1"
 
 [certSign]
+allSigned = "Όλοι οι συμμετέχοντες έχουν υπογ�άψει. Έτοιμο για ο�ιστικοποίηση."
+awaitingSignatures = "Αναμονή υπογ�αφών"
+signatureProgress = "{{signedCount}}/{{totalCount}} υπογ�αφές"
 chooseCertificate = "Επιλέξτε α�χείο πιστοποιητικο�"
+declined = "Απο��ίφθηκε"
+fetchFailed = "Αποτυχία φό�τωσης δεδομένων υπογ�αφής"
+finalized = "Ο�ιστικοποιήθηκε"
+notified = "Σε εκκ�εμότητα"
+partialNote = "Μπο�είτε να ο�ιστικοποιήσετε νω�ίτε�α με τις τ�έχουσες υπογ�αφές. Οι μη υπογεγ�αμμένοι συμμετέχοντες θα εξαι�εθο�ν."
+pending = "Σε εκκ�εμότητα"
+readyToFinalize = "Έτοιμο για ο�ιστικοποίηση"
+signed = "Υπογεγ�αμμένο"
+viewed = "Π�οβλήθηκε"
 chooseJksFile = "Επιλέξτε α�χείο JKS"
 chooseP12File = "Επιλέξτε α�χείο PKCS12"
 choosePfxFile = "Επιλέξτε α�χείο PFX"
@@ -2082,6 +2124,7 @@ title = "Υπογ�αφή με πιστοποιητικό"
 invisible = "Αό�ατη"
 stepTitle = "Εμφάνιση υπογ�αφής"
 visible = "Ο�ατή"
+visibility = "Ο�ατότητα"
 
 [certSign.appearance.options]
 title = "Λεπτομέ�ειες υπογ�αφής"
@@ -2188,6 +2231,252 @@ bullet4 = "Μπο�εί να χ�ησιμοποιήσει π�οσα�μοσμέ
 text = "Όταν ελέγχετε υπογ�αφές, το ε�γαλείο σας λέει αν είναι έγκυ�ες, ποιος υπέγ�αψε το έγγ�αφο, πότε υπογ�άφηκε και αν το έγγ�αφο έχει αλλάξει από τότε που υπογ�άφηκε."
 title = "Έλεγχος υπογ�αφών"
 
+[certSign.collab.finalize]
+button = "Ο�ιστικοποίηση και φό�τωση υπογεγ�αμμένου PDF"
+early = "Ο�ιστικοποίηση με τις τ�έχουσες υπογ�αφές"
+
+[certSign.collab.sessionDetail]
+addButton = "Π�οσθήκη συμμετεχόντων"
+addParticipants = "Π�οσθήκη συμμετεχόντων"
+addParticipantsError = "Αποτυχία π�οσθήκης συμμετεχόντων"
+backToList = "Επιστ�οφή στις συνεδ�ίες"
+deleteConfirm = "Είστε βέβαιοι; Αυτό δεν μπο�εί να αναι�εθεί."
+deleteError = "Αποτυχία διαγ�αφής συνεδ�ίας"
+deleted = "Η συνεδ�ία διαγ�άφηκε"
+deleteSession = "Διαγ�αφή συνεδ�ίας"
+dueDate = "Ημε�ομηνία λήξης"
+finalizeError = "Αποτυχία ο�ιστικοποίησης συνεδ�ίας"
+loadPdfError = "Αποτυχία φό�τωσης υπογεγ�αμμένου PDF"
+loadSignedPdf = "Φό�τωση υπογεγ�αμμένου PDF στα ενε�γά α�χεία"
+messageLabel = "Μήνυμα"
+noAdditionalInfo = "Δεν υπά�χουν π�όσθετες πλη�οφο�ίες"
+owner = "Κάτοχος"
+participantRemoved = "Ο συμμετέχων αφαι�έθηκε"
+participants = "Συμμετέχοντες"
+participantsAdded = "Οι συμμετέχοντες π�οστέθηκαν με επιτυχία"
+removeParticipant = "Αφαί�εση"
+removeParticipantError = "Αποτυχία αφαί�εσης συμμετέχοντα"
+selectUsers = "Επιλέξτε χ�ήστες..."
+sessionInfo = "Πλη�οφο�ίες συνεδ�ίας"
+workbenchTitle = "Διαχεί�ιση συνεδ�ίας"
+
+[certSign.collab.signRequest]
+addedToFiles = "Το έγγ�αφο π�οστέθηκε στα ενε�γά α�χεία"
+addSignature = "Π�οσθέστε την υπογ�αφή σας"
+addToFiles = "Π�οσθήκη στα ενε�γά α�χεία"
+advancedSettings = "Σ�νθετες �υθμίσεις"
+backToList = "Επιστ�οφή στα αιτήματα υπογ�αφής"
+certificateChoice = "Επιλέξτε πιστοποιητικό για υπογ�αφή"
+changeSignature = "Αλλαγή υπογ�αφής"
+clearSignature = "Καθα�ισμός υπογ�αφής"
+completeAndSign = "Ολοκλή�ωση & Υπογ�αφή"
+createNewSignature = "Δημιου�γία νέας υπογ�αφής"
+declineButton = "Από��ιψη"
+decline = "Από��ιψη αιτήματος"
+deleteSelected = "Διαγ�αφή επιλεγμένης υπογ�αφής"
+drawSignature = "Σχεδιάστε την υπογ�αφή σας πα�ακάτω"
+dueDate = "Ημε�ομηνία λήξης"
+fileTooLarge = "Το μέγεθος α�χείου π�έπει να είναι μικ�ότε�ο από 5MB"
+fontFamily = "Οικογένεια γ�αμματοσει�άς"
+fontSize = "Μέγεθος γ�αμματοσει�άς: {{size}}px"
+fontSizePlaceholder = "Μέγεθος"
+from = "Από"
+invalidCertFile = "Επιλέξτε α�χείο πιστοποιητικο� P12 ή PFX"
+invalidFileType = "Επιλέξτε ένα α�χείο εικόνας"
+location = "Τοποθεσία (Π�οαι�ετικό)"
+locationPlaceholder = "Από πο� υπογ�άφετε;"
+message = "Μήνυμα"
+noCertificate = "Επιλέξτε α�χείο πιστοποιητικο�"
+noSignatures = "Τοποθετήστε τουλάχιστον μία υπογ�αφή στο PDF"
+p12File = "Α�χείο πιστοποιητικο� P12/PFX"
+password = "Κωδικός π�όσβασης πιστοποιητικο�"
+passwordPlaceholder = "Εισαγάγετε κωδικό..."
+penColor = "Χ�ώμα πένας"
+penSize = "Μέγεθος πένας: {{size}}px"
+placementActive = "Κάντε κλικ στο PDF για τοποθέτηση"
+placeSignatureButton = "Τοποθέτηση υπογ�αφής στο PDF"
+reason = "Λόγος (Π�οαι�ετικό)"
+reasonPlaceholder = "Γιατί υπογ�άφετε;"
+removeImage = "Κατά�γηση εικόνας"
+removeCertFile = "Κατά�γηση α�χείου"
+savedSignatures = "Αποθηκευμένες υπογ�αφές"
+selectFile = "Επιλογή α�χείου εικόνας"
+selectSignatureTitle = "Επιλέξτε ή δημιου�γήστε υπογ�αφή"
+signButton = "Υπογ�αφή εγγ�άφου"
+signatureInfo = "Αυτές οι �υθμίσεις έχουν διαμο�φωθεί από τον κάτοχο του εγγ�άφου"
+signaturePlaced = "Η υπογ�αφή τοποθετήθηκε στη σελίδα"
+signatureSettings = "Ρυθμίσεις υπογ�αφής"
+signatureText = "Κείμενο υπογ�αφής"
+signatureTextPlaceholder = "Εισαγάγετε το όνομά σας..."
+signatureTypeLabel = "Τ�πος υπογ�αφής"
+signingTitle = "Υπογ�αφή"
+textColor = "Χ�ώμα κειμένου"
+typeSignature = "Πληκτ�ολογήστε το όνομά σας για να δημιου�γήσετε υπογ�αφή"
+uploadCert = "Π�οσα�μοσμένο πιστοποιητικό"
+uploadCertDesc = "Χ�ησιμοποιήστε το δικό σας πιστοποιητικό P12/PFX"
+uploadSignature = "Μεταφό�τωση εικόνας υπογ�αφής"
+usePersonalCert = "Π�οσωπικό πιστοποιητικό"
+usePersonalCertDesc = "Δημιου�γείται αυτόματα για τον λογα�ιασμό σας"
+useServerCert = "Πιστοποιητικό ο�γανισμο�"
+useServerCertDesc = "Κοινόχ�ηστο πιστοποιητικό ο�γανισμο�"
+workbenchTitle = "Αίτημα υπογ�αφής"
+
+[certSign.collab.signRequest.canvas]
+colorPickerTitle = "Επιλέξτε χ�ώμα γ�αμμής"
+continue = "Συνέχεια"
+
+[certSign.collab.signRequest.certModal]
+description = "Έχετε τοποθετήσει {{count}} υπογ�αφή(ές). Επιλέξτε πιστοποιητικό για να ολοκλη�ώσετε την υπογ�αφή."
+sign = "Υπογ�αφή εγγ�άφου"
+certValidating = "Γίνεται επικ��ωση πιστοποιητικο�..."
+certValidUntil = "Το πιστοποιητικό ισχ�ει έως {{date}}"
+certInvalid = "Μη έγκυ�ο πιστοποιητικό: {{error}}"
+certInvalidFallback = "Μη έγκυ�ο πιστοποιητικό"
+certNetworkError = "Δεν ήταν δυνατή η επικ��ωση του πιστοποιητικο�"
+title = "Ρ�θμιση πιστοποιητικο�"
+
+[certSign.collab.signRequest.image]
+hint = "Μεταφο�τώστε μια εικόνα PNG ή JPG της υπογ�αφής σας"
+
+[certSign.collab.signRequest.mode]
+move = "Μετακίνηση υπογ�αφής"
+place = "Τοποθέτηση υπογ�αφής"
+title = "Λειτου�γία υπογ�αφής ή μετακίνησης"
+
+[certSign.collab.signRequest.modeTabs]
+draw = "Σχεδίαση"
+image = "Μεταφό�τωση"
+text = "Πληκτ�ολόγηση"
+
+[certSign.collab.signRequest.placeSignature]
+message = "Κάντε κλικ στο PDF για να τοποθετήσετε την υπογ�αφή σας"
+title = "Τοποθέτηση υπογ�αφής"
+
+[certSign.collab.signRequest.preview]
+imageAlt = "Επιλεγμένη υπογ�αφή"
+missing = "Χω�ίς π�οεπισκόπηση"
+textFallback = "Υπογ�αφή"
+
+[certSign.collab.signRequest.saved]
+defaultCanvasLabel = "Σχεδιασμένη υπογ�αφή"
+defaultImageLabel = "Μεταφο�τωμένη υπογ�αφή"
+defaultLabel = "Υπογ�αφή"
+defaultTextLabel = "Πληκτ�ολογημένη υπογ�αφή"
+delete = "Διαγ�αφή υπογ�αφής"
+none = "Δεν υπά�χουν αποθηκευμένες υπογ�αφές"
+
+[certSign.collab.signRequest.signatureType]
+draw = "Σχεδίαση"
+type = "Πληκτ�ολόγηση"
+upload = "Μεταφό�τωση"
+
+[certSign.collab.signRequest.steps]
+back = "Πίσω"
+cancelPlacement = "Ακ��ωση τοποθέτησης"
+certificate = "Πιστοποιητικό"
+clickMultipleTimes = "Κάντε κλικ στο PDF πολλές φο�ές για να τοποθετήσετε υπογ�αφές. Σ��ετε οποιαδήποτε υπογ�αφή για μετακίνηση ή αλλαγή μεγέθους."
+clickToPlace = "Κάντε κλικ στο PDF στο σημείο που θέλετε να εμφανίζεται η υπογ�αφή σας."
+continue = "Συνέχεια στην επιλογή πιστοποιητικο�"
+continueToPlacement = "Συνέχεια στην τοποθέτηση"
+continueToReview = "Συνέχεια στην επισκόπηση"
+createSignature = "Δημιου�γία υπογ�αφής"
+invisible = "Αό�ατη"
+location = "Τοποθεσία:"
+multipleSignatures = "{{count}} υπογ�αφές θα εφα�μοστο�ν στο PDF"
+oneSignature = "1 υπογ�αφή θα εφα�μοστεί στο PDF"
+placeOnPdf = "Τοποθέτηση στο PDF"
+reason = "Λόγος:"
+reviewTitle = "Επισκόπηση π�ιν από την υπογ�αφή"
+signaturePlaced = "Η υπογ�αφή τοποθετήθηκε στη σελίδα {{page}}. Μπο�είτε να π�οσα�μόσετε τη θέση κάνοντας ξανά κλικ ή να συνεχίσετε στην επισκόπηση."
+visible = "Ο�ατή"
+visibility = "Ο�ατότητα:"
+yourSignatures = "Οι υπογ�αφές σας ({{count}})"
+
+[certSign.collab.signRequest.text]
+colorLabel = "Χ�ώμα"
+fontLabel = "Γ�αμματοσει�ά"
+fontSizeLabel = "Μέγεθος"
+fontSizePlaceholder = "16"
+label = "Κείμενο υπογ�αφής"
+modalHint = "Εισαγάγετε το όνομά σας και έπειτα κάντε κλικ στη Συνέχεια για να το τοποθετήσετε στο PDF."
+placeholder = "Εισαγάγετε το όνομά σας..."
+
+[certSign.collab.participant]
+certValidating = "Γίνεται επικ��ωση πιστοποιητικο�..."
+certValid = "✓ Έγκυ�ο πιστοποιητικό"
+certValidUntil = " έως {{date}}"
+certInvalid = "✗ {{error}}"
+certInvalidFallback = "Μη έγκυ�ο πιστοποιητικό"
+certNetworkError = "Δεν ήταν δυνατή η επικ��ωση του πιστοποιητικο�"
+
+[certSign.collab.addParticipants]
+add = "Π�οσθήκη {{count}} συμμετεχόντων"
+back = "Πίσω"
+configureSignatures = "Διαμό�φωση �υθμίσεων υπογ�αφής"
+continue = "Συνέχεια στις �υθμίσεις υπογ�αφής"
+reasonHelp = "Π�οκαθο�ίστε έναν λόγο υπογ�αφής για αυτο�ς τους συμμετέχοντες (π�οαι�ετικό, μπο�ο�ν να τον τ�οποποιήσουν κατά την υπογ�αφή)"
+reasonPlaceholder = "π.χ. Έγκ�ιση, Ανασκόπηση..."
+selectUsers = "Επιλογή χ�ηστών"
+
+[certSign.collab.sessionCreation]
+includeSummaryPage = "Συμπε�ίληψη σελίδας σ�νοψης υπογ�αφών"
+includeSummaryPageHelp = "Θα π�οστεθεί στο τέλος μια σελίδα σ�νοψης με όλα τα μεταδεδομένα υπογ�αφής. Τα πλαίσια ψηφιακής υπογ�αφής στις μεμονωμένες σελίδες θα κατασταλο�ν (οι χει�όγ�αφες υπογ�αφές δεν επη�εάζονται)."
+
+[certSign.collab.sessionList]
+active = "Ενε�γές"
+finalized = "Ο�ιστικοποιημένες"
+
+[certSign.collab.signatureSettings]
+description = "Διαμο�φώστε πώς θα εμφανίζονται οι υπογ�αφές για όλους τους συμμετέχοντες"
+title = "Εμφάνιση υπογ�αφής"
+
+[certSign.collab.userSelector]
+inviteUsers = "Π�οσθήκη χ�ηστών"
+loadError = "Αποτυχία φό�τωσης χ�ηστών"
+noTeam = "Χω�ίς ομάδα"
+noUsers = "Δεν β�έθηκαν άλλοι χ�ήστες."
+placeholder = "Επιλέξτε χ�ήστες..."
+
+[certSign.mobile]
+panelActions = "Ενέ�γειες"
+panelDocument = "Έγγ�αφο"
+panelPeople = "Άτομα"
+
+[certSign.sessions]
+deleted = "Η συνεδ�ία διαγ�άφηκε"
+fetchFailed = "Αποτυχία φό�τωσης λεπτομε�ειών συνεδ�ίας"
+finalized = "Η συνεδ�ία ο�ιστικοποιήθηκε"
+loaded = "Το υπογεγ�αμμένο PDF φο�τώθηκε"
+pdfNotReady = "Το PDF δεν είναι έτοιμο"
+pdfNotReadyDesc = "Το υπογεγ�αμμένο PDF δημιου�γείται. Δοκιμάστε ξανά σε λίγο."
+
+[certificateChoice.tooltip]
+header = "Τ�ποι πιστοποιητικών"
+
+[certificateChoice.tooltip.organization]
+bullet1 = "Διαχει�ίζεται από διαχει�ιστές συστήματος"
+bullet2 = "Κοινόχ�ηστο μεταξ� εξουσιοδοτημένων χ�ηστών"
+bullet3 = "Αντιπ�οσωπε�ει την ταυτότητα της εται�είας, όχι του ατόμου"
+bullet4 = "Κατάλληλο για: Επίσημα έγγ�αφα, ομαδικές υπογ�αφές"
+description = "Ένα κοινόχ�ηστο πιστοποιητικό που πα�έχεται από τον ο�γανισμό σας. Χ�ησιμοποιείται για εται�ική εξουσιοδότηση υπογ�αφών."
+title = "Πιστοποιητικό ο�γανισμο�"
+
+[certificateChoice.tooltip.personal]
+bullet1 = "Δημιου�γείται αυτόματα κατά την π�ώτη χ�ήση"
+bullet2 = "Συνδέεται με τον λογα�ιασμό χ�ήστη σας"
+bullet3 = "Δεν μπο�εί να κοινοποιηθεί σε άλλους χ�ήστες"
+bullet4 = "Κατάλληλο για: Π�οσωπικά έγγ�αφα, ατομική υπευθυνότητα"
+description = "Ένα αυτόματα δημιου�γημένο πιστοποιητικό, μοναδικό για τον λογα�ιασμό χ�ήστη σας. Κατάλληλο για ατομικές υπογ�αφές."
+title = "Π�οσωπικό πιστοποιητικό"
+
+[certificateChoice.tooltip.upload]
+bullet1 = "Απαιτεί α�χείο P12/PFX και κωδικό π�όσβασης"
+bullet2 = "Μπο�εί να εκδοθεί από εξωτε�ικές Α�χές Πιστοποίησης"
+bullet3 = "Υψηλότε�ο επίπεδο εμπιστοσ�νης για νομικά έγγ�αφα"
+bullet4 = "Κατάλληλο για: �ομικά δεσμευτικά συμβόλαια, εξωτε�ική επικ��ωση"
+description = "Χ�ησιμοποιήστε το δικό σας α�χείο πιστοποιητικο� PKCS#12. Πα�έχει πλή�η έλεγχο στις ιδιότητες του πιστοποιητικο�."
+title = "Μεταφό�τωση π�οσα�μοσμένου P12"
+
 [changeCreds]
 changePassword = "Χ�ησιμοποιείτε π�οεπιλεγμένα διαπιστευτή�ια σ�νδεσης. Πα�ακαλώ εισάγετε νέο κωδικό"
 changeUsername = "Ενημε�ώστε το όνομα χ�ήστη σας. Θα αποσυνδεθείτε μετά την ενημέ�ωση."
@@ -3242,6 +3531,46 @@ totalSelected = "Σ�νολο επιλεγμένων"
 unsupported = "Μη υποστη�ιζόμενο"
 unzip = "Αποσυμπίεση"
 uploadError = "Αποτυχία μεταφό�τωσης ο�ισμένων α�χείων."
+copyCreated = "Το αντίγ�αφο αποθηκε�τηκε σε αυτήν τη συσκευή."
+copyFailed = "Δεν ήταν δυνατή η δημιου�γία αντιγ�άφου."
+leaveShare = "Αφαί�εση από τη λίστα μου"
+leaveShareFailed = "Δεν ήταν δυνατή η αφαί�εση του κοινόχ�ηστου α�χείου."
+leaveShareSuccess = "Αφαι�έθηκε από τη λίστα κοινόχ�ηστων."
+removeBoth = "Αφαί�εση και από τα δ�ο"
+removeFilePrompt = "Αυτό το α�χείο είναι αποθηκευμένο σε αυτήν τη συσκευή και στον διακομιστή σας. Από πο� θέλετε να το αφαι�έσετε;"
+removeFileTitle = "Αφαί�εση α�χείου"
+removeLocalOnly = "Μόνο από αυτήν τη συσκευή"
+removeServerFailed = "Δεν ήταν δυνατή η αφαί�εση του α�χείου από τον διακομιστή."
+removeServerOnly = "Μόνο από τον διακομιστή"
+removeServerOnlyPrompt = "Αυτό το α�χείο είναι αποθηκευμένο μόνο στον διακομιστή σας. Θέλετε να το αφαι�έσετε από τον διακομιστή;"
+removeServerSuccess = "Αφαι�έθηκε από τον διακομιστή."
+removeSharedPrompt = "Αυτό το α�χείο έχει κοινοποιηθεί σε εσάς. Μπο�είτε να το αφαι�έσετε από αυτήν τη συσκευή ή από τη λίστα κοινόχ�ηστων."
+removeSharedServerOnlyBlockedPrompt = "Αυτό το α�χείο έχει κοινοποιηθεί σε εσάς και είναι αποθηκευμένο μόνο στον διακομιστή."
+removeSharedServerOnlyPrompt = "Αυτό το α�χείο έχει κοινοποιηθεί σε εσάς και είναι αποθηκευμένο μόνο στον διακομιστή. �α αφαι�εθεί από τη λίστα σας;"
+changesNotUploaded = "Οι αλλαγές δεν μεταφο�τώθηκαν"
+cloudFile = "Α�χείο στο cloud"
+filterAll = "Όλα"
+filterLocal = "Τοπικά"
+filterSharedByMe = "Κοινοποιημένα από εμένα"
+filterSharedWithMe = "Κοινοποιημένα σε εμένα"
+lastSynced = "Τελευταίος συγχ�ονισμός"
+localOnly = "Μόνο τοπικά"
+makeCopy = "Δημιου�γία αντιγ�άφου"
+owner = "Κάτοχος"
+ownerUnknown = "Άγνωστος"
+share = "Κοινή χ�ήση"
+shareSelected = "Κοινή χ�ήση επιλεγμένων"
+sharedByYou = "Κοινοποιήθηκε από εσάς"
+sharedEditNoticeBody = "Δεν έχετε δικαιώματα επεξε�γασίας για την έκδοση διακομιστή αυτο� του α�χείου. Τυχόν επεξε�γασίες θα αποθηκευτο�ν ως τοπικό αντίγ�αφο."
+sharedEditNoticeConfirm = "Το κατάλαβα"
+sharedEditNoticeTitle = "Αντίγ�αφο διακομιστή μόνο για ανάγνωση"
+sharedWithYou = "Κοινοποιήθηκε σε εσάς"
+sharing = "Κοινή χ�ήση"
+storageState = "Αποθήκευση"
+synced = "Συγχ�ονισμένο"
+updateOnServer = "Ενημέ�ωση στον διακομιστή"
+uploadSelected = "Μεταφό�τωση επιλεγμένων"
+uploadToServer = "Μεταφό�τωση στον διακομιστή"
 
 [files]
 addFiles = "Π�οσθήκη α�χείων"
@@ -3367,6 +3696,77 @@ title = "Σχετικά με την επιπέδωση PDF"
 discord = "Discord"
 issues = "GitHub"
 
+[groupSigning.tooltip]
+header = "Σχετικά με την ομαδική υπογ�αφή"
+
+[groupSigning.tooltip.finalization]
+bullet1 = "Όλες οι υπογ�αφές εφα�μόζονται με τη σει�ά συμμετεχόντων που ο�ίσατε"
+bullet2 = "Μπο�είτε να ο�ιστικοποιήσετε με με�ικές υπογ�αφές αν χ�ειάζεται"
+bullet3 = "Μόλις ο�ιστικοποιηθεί, η συνεδ�ία δεν μπο�εί να τ�οποποιηθεί"
+description = "Μόλις όλοι οι συμμετέχοντες υπογ�άψουν (ή επιλέξετε να ο�ιστικοποιήσετε νω�ίτε�α), μπο�είτε να δημιου�γήσετε το τελικό υπογεγ�αμμένο PDF."
+title = "Διαδικασία ο�ιστικοποίησης"
+
+[groupSigning.tooltip.roles]
+bullet1 = "Κάτοχος (εσείς): Δημιου�γεί συνεδ�ία, διαμο�φώνει π�οεπιλογές υπογ�αφής, ο�ιστικοποιεί το έγγ�αφο"
+bullet2 = "Συμμετέχοντες: Δημιου�γο�ν την υπογ�αφή τους, επιλέγουν πιστοποιητικό, τοποθετο�ν στο PDF"
+bullet3 = "Οι συμμετέχοντες δεν μπο�ο�ν να τ�οποποιήσουν τις �υθμίσεις ο�ατότητας, λόγου ή τοποθεσίας υπογ�αφής"
+description = "Ελέγχετε τις �υθμίσεις εμφάνισης υπογ�αφής για όλους τους συμμετέχοντες."
+title = "Ρόλοι συμμετεχόντων"
+
+[groupSigning.tooltip.sequential]
+bullet1 = "Ο π�ώτος συμμετέχων π�έπει να υπογ�άψει π�ιν αποκτήσει π�όσβαση ο δε�τε�ος στο έγγ�αφο"
+bullet2 = "Εξασφαλίζει τη σωστή σει�ά υπογ�αφών για νομική συμμό�φωση"
+bullet3 = "Μπο�είτε να αλλάξετε τη σει�ά συμμετεχόντων σ��οντάς τους στη λίστα"
+description = "Οι συμμετέχοντες υπογ�άφουν τα έγγ�αφα με τη σει�ά που ο�ίζετε. Κάθε υπογ�άφων λαμβάνει ειδοποίηση όταν έ�θει η σει�ά του."
+title = "Διαδοχική υπογ�αφή"
+
+[groupSigning.steps]
+back = "Πίσω"
+completed = "Ολοκλη�ώθηκε"
+current = "Τ�έχον"
+stepLabel = "Βήμα {{number}}"
+
+[groupSigning.steps.configureDefaults]
+continue = "Συνέχεια στην επισκόπηση"
+invisible = "Οι υπογ�αφές θα είναι αό�ατες (μόνο μεταδεδομένα)"
+locationLabel = "Τοποθεσία:"
+preview = "Π�οεπισκόπηση"
+reasonLabel = "Λόγος:"
+title = "Διαμό�φωση �υθμίσεων υπογ�αφής"
+visible = "Οι υπογ�αφές θα είναι ο�ατές στη σελίδα {{page}}"
+
+[groupSigning.steps.review]
+document = "Έγγ�αφο"
+dueDate = "Ημε�ομηνία λήξης (Π�οαι�ετικό)"
+dueDatePlaceholder = "Επιλέξτε ημε�ομηνία λήξης..."
+invisible = "Αό�ατη (μόνο μεταδεδομένα)"
+location = "Τοποθεσία:"
+logo = "Λογότυπο:"
+logoHidden = "Χω�ίς λογότυπο"
+logoShown = "Εμφανίζεται το λογότυπο του Stirling PDF"
+participants = "Συμμετέχοντες"
+reason = "Λόγος:"
+send = "Αποστολή αιτημάτων υπογ�αφής"
+signatureSettings = "Ρυθμίσεις υπογ�αφής"
+title = "Επισκόπηση λεπτομε�ειών συνεδ�ίας"
+titleShort = "Επισκόπηση & Αποστολή"
+visibility = "Ο�ατότητα:"
+visible = "Ο�ατή στη σελίδα {{page}}"
+participantCount = "{{count}} συμμετέχοντες θα υπογ�άψουν με τη σει�ά"
+
+[groupSigning.steps.selectDocument]
+continue = "Συνέχεια στην επιλογή συμμετεχόντων"
+noFile = "Επιλέξτε ένα μόνο α�χείο PDF από τα ενε�γά α�χεία σας για να δημιου�γήσετε συνεδ�ία υπογ�αφής."
+selectedFile = "Επιλεγμένο έγγ�αφο"
+title = "Επιλογή εγγ�άφου"
+
+[groupSigning.steps.selectParticipants]
+continue = "Συνέχεια στις �υθμίσεις υπογ�αφής"
+count = "Επιλέχθηκαν {{count}} συμμετέχοντες"
+label = "Επιλέξτε συμμετέχοντες"
+placeholder = "Επιλέξτε συμμετέχοντες για υπογ�αφή..."
+title = "Επιλογή συμμετεχόντων"
+
 [getPdfInfo]
 downloadJson = "Λήψη JSON"
 downloads = "Λήψεις"
@@ -4460,7 +4860,10 @@ zoomOut = "Σμίκ�υνση"
 
 [viewer]
 cannotPreviewFile = "Δεν είναι δυνατή η π�οεπισκόπηση του α�χείου"
+disableColorFilter = "Απενε�γοποίηση φίλτ�ου χ�ώματος"
 dualPageView = "Π�οβολή διπλής σελίδας"
+enableDarkFilter = "Ενε�γοποίηση σκοτεινο� φίλτ�ου"
+enableSepiaFilter = "Ενε�γοποίηση φίλτ�ου σέπια"
 firstPage = "Π�ώτη σελίδα"
 lastPage = "Τελευταία σελίδα"
 nextPage = "Επόμενη σελίδα"
@@ -4470,6 +4873,22 @@ singlePageView = "Π�οβολή μίας σελίδας"
 unknownFile = "Άγνωστο α�χείο"
 zoomIn = "Μεγέθυνση"
 zoomOut = "Σμίκ�υνση"
+resetZoom = "Επαναφο�ά ζουμ"
+
+[viewer.nonPdf]
+fileTypeBadge = "Α�χείο {{type}}"
+convertToPdf = "Μετατ�οπή σε PDF"
+loading = "Φό�τωση..."
+emptyFile = "Κενό α�χείο"
+csvStats = "{{rows}} γ�αμμές · {{columns}} στήλες · {{size}}"
+sortedBy = "Ταξινόμηση κατά: {{column}}"
+columnDefault = "Στήλη {{index}}"
+htmlPreviewWarning = "Π�οεπισκόπηση HTML — ενδέχεται να μη φο�τωθο�ν εξωτε�ικοί πό�οι · {{size}}"
+htmlPreview = "Π�οεπισκόπηση HTML"
+invalidJson = "Μη έγκυ�ο JSON — εμφάνιση ακατέ�γαστου πε�ιεχομένου"
+textStats = "{{lines}} γ�αμμές · {{size}}"
+lineNumbers = "Α�ιθμοί γ�αμμών"
+renderMarkdown = "Απόδοση Markdown"
 
 [viewer.attachments]
 title = "Συνημμένα"
@@ -4531,6 +4950,7 @@ toggleAttachments = "Εναλλαγή συνημμένων"
 toggleTheme = "Εναλλαγή θέματος"
 language = "Γλώσσα"
 toggleAnnotations = "Εναλλαγή ο�ατότητας σχολιασμών"
+toggleLayers = "Εναλλαγή επιπέδων"
 search = "Αναζήτηση PDF"
 panMode = "Λειτου�γία μετακίνησης"
 applyRedactionsFirst = "Εφα�μόστε π�ώτα τις αποκ��ψεις"
@@ -5407,20 +5827,72 @@ title = "Εκτ�πωση α�χείου"
 2 = "Εισάγετε όνομα εκτυπωτή"
 
 [quickAccess]
+access = "Π�όσβαση"
+accessAddPerson = "Π�οσθήκη ατόμου"
+accessBack = "Πίσω"
+accessCopyLink = "Αντιγ�αφή συνδέσμου"
+accessEmail = "Διε�θυνση email"
+accessEmailPlaceholder = "name@company.com"
+accessFileLabel = "Α�χείο"
+accessGeneral = "Γενική π�όσβαση"
+accessInviteTitle = "Π�όσκληση ατόμων"
+accessOwner = "Κάτοχος"
+accessPanel = "Π�όσβαση στο έγγ�αφο"
+accessPeople = "Άτομα με π�όσβαση"
+accessRemove = "Αφαί�εση"
+accessRestricted = "Πε�ιο�ισμένη"
+accessRestrictedHint = "Μόνο τα άτομα με π�όσβαση μπο�ο�ν να ανοίξουν"
+accessRole = "Ρόλος"
+accessRoleCommenter = "Σχολιαστής"
+accessRoleEditor = "Επεξε�γαστής"
+accessRoleViewer = "Θεατής"
+accessSelectedFile = "Επιλεγμένο α�χείο"
+accessSendInvite = "Αποστολή π�όσκλησης"
+accessTitle = "Π�όσβαση εγγ�άφου"
+accessYou = "Εσείς"
 account = "Π�οφίλ"
+activeSessions = "Ενε�γές συνεδ�ίες"
+activeTab = "Ενε�γές"
 activity = "Ιστο�ικό"
 adminSettings = "Ρυθμ. διαχ."
+allSessions = "Όλες οι συνεδ�ίες"
 allTools = "All Tools"
 automate = "Αυτόματα"
+back = "Πίσω"
+certSign = "Υπογ�αφή με πιστοποιητικό"
+completedSessions = "Ολοκλη�ωμένες συνεδ�ίες"
+completedTab = "Ολοκλη�ωμένες"
 config = "Ρ�θμιση"
+createNew = "Δημιου�γία νέου αιτήματος"
+createSession = "Δημιου�γία αιτήματος υπογ�αφής"
+dueDate = "Ημε�ομηνία λήξης (π�οαι�ετικό)"
 files = "Α�χεία"
 help = "Βοήθεια"
+noActiveSessions = "Δεν υπά�χουν εκκ�εμή αιτήματα υπογ�αφής ή ενε�γές συνεδ�ίες"
+noCompletedSessions = "Δεν υπά�χουν ολοκλη�ωμένες συνεδ�ίες"
+noFile = "Δεν έχει επιλεγεί α�χείο"
 read = "Ανάγνωση"
 reader = "Ανάγνωση"
+refresh = "Ανανέωση"
+requestSignatures = "Αίτηση υπογ�αφών"
+selectSingleFileToRequest = "Επιλέξτε ένα μόνο α�χείο PDF για να ζητήσετε υπογ�αφές"
+selectedFile = "Επιλεγμένο α�χείο"
+selectUsers = "Επιλέξτε χ�ήστες για υπογ�αφή"
+selectUsersPlaceholder = "Επιλέξτε συμμετέχοντες..."
+sendingRequest = "Αποστολή..."
 settings = "Ρυθμ."
 showMeAround = "Ξενάγηση"
 sign = "Υπογ�αφή"
+signatureRequests = "Αιτήματα υπογ�αφής"
+signYourself = "Υπογ�άψτε εσείς"
+newRequest = "�έο αίτημα"
 tours = "Ξεναγήσεις"
+wetSign = "Π�οσθήκη υπογ�αφής"
+filterMine = "Δικά μου"
+filterOverdue = "Εκπ�όθεσμα"
+filterSigned = "Υπογεγ�αμμένα"
+filterDeclined = "Απο��ιφθέντα"
+searchDocuments = "Αναζήτηση εγγ�άφων…"
 
 [quickAccess.helpMenu]
 adminTour = "Ξενάγηση διαχει�ιστή"
@@ -6050,11 +6522,75 @@ toolNotAvailableLocally = "Ο διακομιστής σας Stirling-PDF είν
 expired = "Η συνεδ�ία σας έληξε. Πα�ακαλώ ανανεώστε τη σελίδα και π�οσπαθήστε ξανά."
 refreshPage = "Ανανέωση σελίδας"
 
+[sessionManagement.tooltip]
+header = "Διαχεί�ιση συνεδ�ιών υπογ�αφής"
+
+[sessionManagement.tooltip.addParticipants]
+bullet1 = "�έοι συμμετέχοντες π�οστίθενται στο τέλος της σει�άς υπογ�αφών"
+bullet2 = "Δεν μπο�ο�ν να π�οστεθο�ν συμμετέχοντες μετά την ο�ιστικοποίηση της συνεδ�ίας"
+bullet3 = "Κάθε συμμετέχων λαμβάνει ειδοποίηση όταν είναι η σει�ά του"
+description = "Μπο�είτε να π�οσθέσετε πε�ισσότε�ους συμμετέχοντες σε μια ενε�γή συνεδ�ία οποτεδήποτε π�ιν από την ο�ιστικοποίηση."
+title = "Π�οσθήκη συμμετεχόντων"
+
+[sessionManagement.tooltip.finalization]
+bullet1 = "<b>Πλή�ης ο�ιστικοποίηση</b>: Όλοι οι συμμετέχοντες έχουν υπογ�άψει"
+bullet2 = "<b>Με�ική ο�ιστικοποίηση</b>: Ο�ισμένοι συμμετέχοντες δεν έχουν υπογ�άψει ακόμα"
+bullet3 = "Οι μη υπογεγ�αμμένοι συμμετέχοντες θα εξαι�εθο�ν από το τελικό έγγ�αφο"
+bullet4 = "Μόλις ο�ιστικοποιηθεί, μπο�είτε να φο�τώσετε το υπογεγ�αμμένο PDF στα ενε�γά α�χεία"
+description = "Η ο�ιστικοποίηση συνδυάζει όλες τις υπογ�αφές σε ένα ενιαίο υπογεγ�αμμένο PDF. Αυτή η ενέ�γεια δεν μπο�εί να αναι�εθεί."
+title = "Ο�ιστικοποίηση συνεδ�ίας"
+
+[sessionManagement.tooltip.participantRemoval]
+bullet1 = "Δεν μπο�ο�ν να αφαι�εθο�ν συμμετέχοντες που έχουν ήδη υπογ�άψει"
+bullet2 = "Οι αφαι�εθέντες συμμετέχοντες δεν λαμβάνουν πλέον ειδοποιήσεις"
+bullet3 = "Η σει�ά υπογ�αφών π�οσα�μόζεται αυτόματα"
+description = "Οι συμμετέχοντες μπο�ο�ν να αφαι�εθο�ν από τις συνεδ�ίες π�ιν υπογ�άψουν."
+title = "Αφαί�εση συμμετεχόντων"
+
+[sessionManagement.tooltip.signatureOrder]
+bullet1 = "Κάθε υπογ�αφή εφα�μόζεται διαδοχικά στο PDF"
+bullet2 = "Οι μεταγενέστε�οι υπογ�άφοντες μπο�ο�ν να δουν π�οηγο�μενες υπογ�αφές"
+bullet3 = "Κ�ίσιμο για �οές έγκ�ισης και νομικές αλυσίδες φ�λαξης"
+description = "Η σει�ά που ο�ίζετε κατά τη δημιου�γία της συνεδ�ίας καθο�ίζει ποιος υπογ�άφει π�ώτος."
+title = "Σει�ά υπογ�αφών"
+
+[signatureSettings.tooltip]
+header = "Ρυθμίσεις εμφάνισης υπογ�αφής"
+
+[signatureSettings.tooltip.location]
+bullet1 = "Πα�αδείγματα: \"New York, USA\", \"Γ�αφείο Λονδίνου\", \"Απομακ�υσμένα\""
+bullet2 = "Δεν είναι το ίδιο με τη θέση στη σελίδα"
+bullet3 = "Ενδέχεται να απαιτείται σε ο�ισμένες νομικές δικαιοδοσίες"
+description = "Π�οαι�ετική γεωγ�αφική τοποθεσία όπου εφα�μόστηκε η υπογ�αφή. Αποθηκε�εται στα μεταδεδομένα του πιστοποιητικο�."
+title = "Τοποθεσία υπογ�αφής"
+
+[signatureSettings.tooltip.logo]
+bullet1 = "Εμφανίζεται δίπλα στην υπογ�αφή και στο κείμενο"
+bullet2 = "Υποστη�ίζει μο�φές PNG, JPG"
+bullet3 = "Ενισχ�ει την επαγγελματική εμφάνιση"
+description = "Π�οσθέστε εται�ικό λογότυπο σε ο�ατές υπογ�αφές για επωνυμία και αυθεντικότητα."
+title = "Λογότυπο εται�είας"
+
+[signatureSettings.tooltip.reason]
+bullet1 = "Πα�αδείγματα: \"Έγκ�ιση\", \"Συμφωνία σ�μβασης\", \"Ολοκλή�ωση ανασκόπησης\""
+bullet2 = "Εμφανίζεται στις ιδιότητες υπογ�αφής του PDF"
+bullet3 = "Χ�ήσιμο για ίχνη ελέγχου και συμμό�φωση"
+description = "Π�οαι�ετικό κείμενο που εξηγεί γιατί υπογ�άφεται το έγγ�αφο. Αποθηκε�εται στα μεταδεδομένα του πιστοποιητικο�."
+title = "Λόγος υπογ�αφής"
+
+[signatureSettings.tooltip.visibility]
+bullet1 = "<b>Ο�ατή</b>: Η υπογ�αφή εμφανίζεται στο PDF με π�οσα�μοσμένη εμφάνιση"
+bullet2 = "<b>Αό�ατη</b>: Το πιστοποιητικό ενσωματώνεται χω�ίς οπτικό σημάδι"
+bullet3 = "Οι αό�ατες υπογ�αφές εξακολουθο�ν να πα�έχουν κ�υπτογ�αφική επαλήθευση"
+description = "Ελέγχει εάν η υπογ�αφή είναι ο�ατή στο έγγ�αφο ή ενσωματωμένη αό�ατα."
+title = "Ο�ατότητα υπογ�αφής"
+
 [settings.configuration]
 advanced = "Π�οχω�ημένα"
 database = "Βάση δεδομένων"
 endpoints = "Endpoints"
 features = "Δυνατότητες"
+storageSharing = "Αποθήκευση Α�χείων & Κοινή Χ�ήση"
 systemSettings = "Ρυθμίσεις συστήματος"
 title = "Διαμό�φωση"
 
@@ -6332,10 +6868,13 @@ title = "Σ�νδεση στο Stirling"
 [setup.selfhosted]
 link = "ή συνδεθείτε σε έναν self-hosted λογα�ιασμό"
 subtitle = "Εισαγάγετε τα διαπιστευτή�ια του διακομιστή σας"
+changeServerLocked = "Ο ο�γανισμός σας έχει πε�ιο�ίσει αυτήν την εφα�μογή σε συγκεκ�ιμένο διακομιστή"
 switchToLocal = "Χ�ήση τοπικών ε�γαλείων αντ' αυτο�"
 title = "Σ�νδεση στον διακομιστή"
 
 [setup.selfhosted.unreachable]
+changeServer = "Σ�νδεση σε διαφο�ετικό διακομιστή"
+changeServerLocked = "Ο ο�γανισμός σας έχει πε�ιο�ίσει αυτήν την εφα�μογή σε συγκεκ�ιμένο διακομιστή"
 continueOffline = "Χ�ήση τοπικών ε�γαλείων αντ' αυτο�"
 message = "Δεν ήταν δυνατή η π�όσβαση στο {{url}}. Ελέγξτε ότι ο διακομιστής εκτελείται και είναι π�οσβάσιμος."
 retry = "Επανάληψη"
@@ -6529,6 +7068,15 @@ saved = "Αποθηκευμένες"
 text = "Κείμενο"
 title = "Τ�πος υπογ�αφής"
 
+[signRequest]
+declined = "Το αίτημα υπογ�αφής απο��ίφθηκε"
+fetchFailed = "Αποτυχία φό�τωσης αιτήματος υπογ�αφής"
+signed = "Το έγγ�αφο υπογ�άφηκε με επιτυχία"
+
+[signSession]
+createFailed = "Αποτυχία δημιου�γίας αιτήματος υπογ�αφής"
+created = "Το αίτημα υπογ�αφής εστάλη"
+
 [signup]
 accountCreatedSuccessfully = "Ο λογα�ιασμός δημιου�γήθηκε με επιτυχία! Μπο�είτε τώ�α να συνδεθείτε."
 alreadyHaveAccount = "Έχετε ήδη λογα�ιασμό; Συνδεθείτε"
@@ -6807,6 +7355,106 @@ title = "Διαχω�ισμός PDF ανά κεφάλαια"
 [splitPdfByChapters]
 tags = "διαχω�ισμός,κεφάλαια,σελιδοδείκτες,ο�γάνωση"
 
+[storageShare]
+accessed = "Π�οσπελάστηκε"
+accessDenied = "Δεν έχετε π�όσβαση σε αυτό το κοινόχ�ηστο α�χείο. Ζητήστε από τον κάτοχο να το κοινοποιήσει σε εσάς."
+accessFailed = "Αδυναμία φό�τωσης δ�αστη�ιότητας."
+accessDeniedBody = "Δεν έχετε π�όσβαση σε αυτό το α�χείο. Ζητήστε από τον κάτοχο να το κοινοποιήσει σε εσάς."
+accessDeniedTitle = "Χω�ίς π�όσβαση"
+accessLimitedCommenter = "Η π�όσβαση σχολιαστή έ�χεται σ�ντομα. Ζητήστε από τον κάτοχο δικαιώματα επεξε�γαστή αν χ�ειάζεστε λήψη."
+accessLimitedTitle = "Πε�ιο�ισμένη π�όσβαση"
+accessLimitedViewer = "Αυτός ο σ�νδεσμος είναι μόνο για π�οβολή. Ζητήστε από τον κάτοχο π�όσβαση επεξε�γαστή αν χ�ειάζεστε λήψη."
+createdAt = "Δημιου�γήθηκε"
+download = "Λήψη"
+downloadFailed = "Δεν είναι δυνατή η λήψη αυτο� του α�χείου."
+expiredBody = "Αυτός ο σ�νδεσμος κοινής χ�ήσης δεν είναι έγκυ�ος ή έχει λήξει."
+expiredTitle = "Ο σ�νδεσμος έληξε"
+goToLogin = "Μετάβαση στη σ�νδεση"
+loadFailed = "Δεν είναι δυνατό το άνοιγμα του κοινόχ�ηστου α�χείου."
+loading = "Φό�τωση συνδέσμου κοινής χ�ήσης..."
+loginPrompt = "Συνδεθείτε για π�όσβαση σε αυτό το κοινόχ�ηστο α�χείο."
+loginRequired = "Απαιτείται σ�νδεση"
+openInApp = "Άνοιγμα στο Stirling PDF"
+ownerLabel = "Κάτοχος"
+ownerUnknown = "Άγνωστος"
+requiresLogin = "Αυτό το κοινόχ�ηστο α�χείο απαιτεί σ�νδεση."
+roleCommenter = "Σχολιαστής"
+roleEditor = "Επεξε�γαστής"
+roleViewer = "Θεατής"
+shareHeading = "Κοινόχ�ηστο α�χείο"
+titleDefault = "Κοινόχ�ηστο α�χείο"
+tryAgain = "Δοκιμάστε ξανά α�γότε�α."
+addUser = "Π�οσθήκη"
+commenterHint = "Η δυνατότητα σχολιασμο� έ�χεται σ�ντομα."
+copied = "Ο σ�νδεσμος αντιγ�άφηκε στο π�όχει�ο"
+copy = "Αντιγ�αφή"
+copyFailed = "Η αντιγ�αφή απέτυχε"
+description = "Δημιου�γήστε έναν σ�νδεσμο κοινής χ�ήσης για αυτό το α�χείο. Οι συνδεδεμένοι χ�ήστες με τον σ�νδεσμο μπο�ο�ν να έχουν π�όσβαση."
+downloadsCount = "Λήψεις: {{count}}"
+emailWarningBody = "Αυτό μοιάζει με διε�θυνση email. Αν αυτό το άτομο δεν είναι ήδη χ�ήστης του Stirling PDF, δεν θα μπο�εί να έχει π�όσβαση στο α�χείο."
+emailWarningConfirm = "Κοινή χ�ήση ο�τως ή άλλως"
+emailWarningTitle = "Διε�θυνση email"
+errorTitle = "Αποτυχία κοινής χ�ήσης"
+failure = "Δεν ήταν δυνατή η δημιου�γία συνδέσμου κοινής χ�ήσης. Δοκιμάστε ξανά."
+fileLabel = "Α�χείο"
+generate = "Δημιου�γία συνδέσμου"
+generated = "Δημιου�γήθηκε σ�νδεσμος κοινής χ�ήσης"
+hideActivity = "Απόκ�υψη δ�αστη�ιότητας"
+invalidUsername = "Εισαγάγετε έγκυ�ο όνομα χ�ήστη ή διε�θυνση email."
+lastAccessed = "Τελευταία π�όσβαση"
+linkAccessTitle = "Π�όσβαση συνδέσμου κοινής χ�ήσης"
+linkLabel = "Σ�νδεσμος κοινής χ�ήσης"
+linksDisabled = "Οι σ�νδεσμοι κοινής χ�ήσης είναι απενε�γοποιημένοι."
+linksDisabledBody = "Οι σ�νδεσμοι κοινής χ�ήσης έχουν απενε�γοποιηθεί από τις �υθμίσεις του διακομιστή σας."
+manage = "Διαχεί�ιση κοινής χ�ήσης"
+manageDescription = "Δημιου�γία και διαχεί�ιση συνδέσμων για κοινή χ�ήση αυτο� του α�χείου."
+manageLoadFailed = "Δεν είναι δυνατή η φό�τωση συνδέσμων κοινής χ�ήσης."
+manageTitle = "Διαχεί�ιση κοινής χ�ήσης"
+noActivity = "Καμία δ�αστη�ιότητα ακόμα."
+noLinks = "Δεν υπά�χουν ενε�γοί σ�νδεσμοι κοινής χ�ήσης ακόμα."
+noSharedUsers = "Κανένας χ�ήστης δεν έχει ακόμη π�όσβαση."
+removeLink = "Κατά�γηση συνδέσμου"
+removeUser = "Αφαί�εση"
+revokeFailed = "Δεν είναι δυνατή η αφαί�εση του συνδέσμου κοινής χ�ήσης."
+revoked = "Ο σ�νδεσμος κοινής χ�ήσης αφαι�έθηκε"
+roleLabel = "Ρόλος"
+sharingDisabled = "Η κοινή χ�ήση είναι απενε�γοποιημένη."
+sharingDisabledBody = "Η κοινή χ�ήση έχει απενε�γοποιηθεί από τις �υθμίσεις του διακομιστή σας."
+sharedUsersTitle = "Χ�ήστες με π�όσβαση"
+title = "Κοινή χ�ήση α�χείου"
+unknownUser = "Άγνωστος χ�ήστης"
+userAddFailed = "Δεν είναι δυνατή η κοινή χ�ήση με αυτόν τον χ�ήστη."
+userAdded = "Ο χ�ήστης π�οστέθηκε στη λίστα κοινής χ�ήσης."
+usernameLabel = "Όνομα χ�ήστη ή email"
+usernamePlaceholder = "Εισαγάγετε όνομα χ�ήστη ή email"
+userRemoveFailed = "Δεν είναι δυνατή η αφαί�εση αυτο� του χ�ήστη."
+userRemoved = "Ο χ�ήστης αφαι�έθηκε από τη λίστα κοινής χ�ήσης."
+viewActivity = "Π�οβολή δ�αστη�ιότητας"
+viewed = "Π�οβλήθηκε"
+viewsCount = "Π�οβολές: {{count}}"
+downloaded = "Λήφθηκε"
+bulkDescription = "Δημιου�γήστε έναν σ�νδεσμο για να κάνετε κοινή χ�ήση όλων των επιλεγμένων α�χείων με συνδεδεμένους χ�ήστες."
+bulkTitle = "Κοινή χ�ήση επιλεγμένων α�χείων"
+copyLink = "Αντιγ�αφή συνδέσμου κοινής χ�ήσης"
+fileCount = "Επιλέχθηκαν {{count}} α�χεία"
+ownerOnly = "Μόνο ο κάτοχος μπο�εί να διαχει�ίζεται την κοινή χ�ήση."
+selectSingleFile = "Επιλέξτε ένα μόνο α�χείο για διαχεί�ιση της κοινής χ�ήσης."
+
+[storageUpload]
+description = "Μεταφο�τώνει το τ�έχον α�χείο στον αποθηκευτικό χώ�ο του διακομιστή για δική σας π�όσβαση."
+errorTitle = "Αποτυχία μεταφό�τωσης"
+failure = "Η μεταφό�τωση απέτυχε. Ελέγξτε τα στοιχεία σ�νδεσης και τις �υθμίσεις αποθήκευσης."
+fileLabel = "Α�χείο"
+hint = "Οι δημόσιοι σ�νδεσμοι και οι λειτου�γίες π�όσβασης ελέγχονται από τις �υθμίσεις του διακομιστή σας."
+success = "Μεταφο�τώθηκε στον διακομιστή"
+title = "Μεταφό�τωση στον διακομιστή"
+updateButton = "Ενημέ�ωση στον διακομιστή"
+uploadButton = "Μεταφό�τωση στον διακομιστή"
+bulkDescription = "Μεταφο�τώνει τα επιλεγμένα α�χεία στον αποθηκευτικό χώ�ο του διακομιστή σας."
+bulkTitle = "Μεταφό�τωση επιλεγμένων α�χείων"
+fileCount = "Επιλέχθηκαν {{count}} α�χεία"
+more = " +{{count}} ακόμη"
+
 [storage]
 approximateSize = "Π�οσεγγιστικό μέγεθος"
 fileTooLarge = "Το α�χείο είναι πολ� μεγάλο. Το μέγιστο μέγεθος ανά α�χείο είναι"
@@ -7153,6 +7801,30 @@ title = "Π�οβολή/Επεξε�γασία PDF"
 [warning]
 tooltipTitle = "Π�οειδοποίηση"
 
+[wetSignature.tooltip]
+header = "Μέθοδοι δημιου�γίας υπογ�αφής"
+
+[wetSignature.tooltip.draw]
+bullet1 = "Π�οσα�μόστε το χ�ώμα και το πάχος της πένας"
+bullet2 = "Καθα�ίστε και ξανασχεδιάστε μέχ�ι να είστε ικανοποιημένοι"
+bullet3 = "Λειτου�γεί σε συσκευές αφής (tablet, τηλέφωνα)"
+description = "Δημιου�γήστε χει�όγ�αφη υπογ�αφή με το ποντίκι ή την οθόνη αφής. Ιδανική για π�οσωπικές, αυθεντικές υπογ�αφές."
+title = "Σχεδίαση υπογ�αφής"
+
+[wetSignature.tooltip.type]
+bullet1 = "Επιλέξτε ανάμεσα σε πολλές γ�αμματοσει�ές"
+bullet2 = "Π�οσα�μόστε μέγεθος και χ�ώμα κειμένου"
+bullet3 = "Ιδανικό για τυποποιημένες υπογ�αφές"
+description = "Δημιου�γήστε υπογ�αφή από πληκτ�ολογημένο κείμενο. Γ�ήγο�η και συνεπής, κατάλληλη για επαγγελματικά έγγ�αφα."
+title = "Πληκτ�ολόγηση υπογ�αφής"
+
+[wetSignature.tooltip.upload]
+bullet1 = "Υποστη�ίζει PNG, JPG και άλλες μο�φές εικόνας"
+bullet2 = "Συνιστώνται διαφανή φόντα για καλ�τε�α αποτελέσματα"
+bullet3 = "Η εικόνα θα αλλάξει μέγεθος ώστε να ται�ιάζει στην πε�ιοχή υπογ�αφής"
+description = "Μεταφο�τώστε μια π�οδημιου�γημένη εικόνα υπογ�αφής. Ιδανική αν έχετε σα�ωμένη υπογ�αφή ή εται�ικό λογότυπο."
+title = "Μεταφό�τωση εικόνας υπογ�αφής"
+
 [watermark]
 completed = "Το υδατογ�άφημα π�οστέθηκε"
 desc = "Π�οσθέστε υδατογ�αφήματα κειμένου ή εικόνας σε α�χεία PDF"
@@ -7333,6 +8005,7 @@ activeSession = "Ενε�γή συνεδ�ία"
 addMembers = "Π�οσθήκη μελών"
 admin = "Διαχει�ιστής"
 confirmDelete = "Είστε βέβαιοι ότι θέλετε να διαγ�άψετε αυτόν τον χ�ήστη; Αυτή η ενέ�γεια δεν μπο�εί να αναι�εθεί."
+confirmUnlock = "Είστε βέβαιοι ότι θέλετε να ξεκλειδώσετε αυτόν τον λογα�ιασμό χ�ήστη;"
 deleteUser = "Διαγ�αφή χ�ήστη"
 deleteUserError = "Αποτυχία διαγ�αφής χ�ήστη"
 deleteUserSuccess = "Ο χ�ήστης διαγ�άφηκε με επιτυχία"
@@ -7341,6 +8014,8 @@ disable = "Απενε�γοποίηση"
 disabled = "Απενε�γοποιημένος"
 editRole = "Επεξε�γασία �όλου"
 enable = "Ενε�γοποίηση"
+locked = "κλειδωμένο"
+lockedBadge = "Κλειδωμένο"
 loading = "Φό�τωση μελών..."
 loginRequired = "Ενε�γοποιήστε π�ώτα τη λειτου�γία σ�νδεσης"
 member = "Μέλος"
@@ -7350,6 +8025,9 @@ searchMembers = "Αναζήτηση μελών..."
 status = "Κατάσταση"
 team = "Ομάδα"
 title = "Άνθ�ωποι"
+unlockAccount = "Ξεκλείδωμα λογα�ιασμο�"
+unlockUserError = "Αποτυχία ξεκλειδώματος λογα�ιασμο� χ�ήστη"
+unlockUserSuccess = "Ο λογα�ιασμός χ�ήστη ξεκλειδώθηκε με επιτυχία"
 user = "Χ�ήστης"
 
 [workspace.people.actions]
diff --git a/frontend/public/locales/en-GB/translation.toml b/frontend/public/locales/en-GB/translation.toml
index dac1133ba0..52275cd0d0 100644
--- a/frontend/public/locales/en-GB/translation.toml
+++ b/frontend/public/locales/en-GB/translation.toml
@@ -44,6 +44,8 @@ downloadPdf = "Download PDF"
 downloadUnavailable = "Download unavailable for this item"
 edit = "Edit"
 editYourNewFiles = "Edit your new file(s)"
+encryptedFileBlocked = "File is password-protected. Unlock it first."
+encryptedFilesBlocked = "{{count}} files are password-protected. Unlock them first."
 exportAndContinue = "Export & Continue"
 false = "False"
 fileSavedToDisk = "File saved to disk"
@@ -2077,6 +2079,23 @@ keywords = "Keywords: odd, even"
 numbers = "Numbers/ranges: 5, 10-20"
 progressions = "Progressions: 3n, 4n+1"
 
+[chat.progress]
+thinking = "Thinking..."
+analyzing = "Analysing your request..."
+calling_engine = "AI is thinking..."
+extracting_content = "Extracting content from your documents..."
+executing_tool_single = "Running {{tool}}..."
+executing_tool_step = "Running {{tool}} (step {{step}} of {{total}})..."
+executing_tool_generic = "Running tool..."
+executing_tool_generic_step = "Running tool (step {{step}} of {{total}})..."
+processing = "Processing extracted content..."
+
+[chat.toolsUsed]
+summary_one = "Ran 1 tool"
+summary_other = "Ran {{count}} tools"
+summary = "Ran {{count}} tools"
+unknownTool = "Unknown tool"
+
 [certSign]
 allSigned = "All participants have signed. Ready to finalize."
 awaitingSignatures = "Awaiting signatures"
@@ -2791,6 +2810,33 @@ confirmTitle = "Re-run comparison?"
 unlinkedBody = "Tip: Arrow Up/Down scroll both panes; panning only moves the active pane."
 unlinkedTitle = "Independent scroll & pan enabled"
 
+[compare.mode]
+pixel = "Pixel Comparison"
+text = "Text Comparison"
+
+[compare.pixel]
+base = "Original"
+changed = "changed"
+comparison = "Edited"
+diff = "Differences"
+diffOnly = "Diff only"
+missingInBase = "Missing in original"
+missingInComparison = "Missing in edited"
+overall = "overall"
+overlay = "Overlay"
+pageLabel = "Page"
+pagesChanged = "pages changed"
+sideBySide = "Side-by-side"
+sizeMismatch = "Size mismatch"
+summaryTitle = "Pixel comparison"
+
+[compare.pixel.warnings]
+noPages = "One or both documents have no pages."
+pageCountMismatch = "Page count mismatch: original has {{base}} page(s), edited has {{comparison}}. Extra pages are shown one-sided and marked as fully removed/added."
+
+[compare.pixel.errors]
+canvasContextUnavailable = "Unable to acquire 2D canvas context for pixel comparison."
+
 [compare.too.dissimilar]
 message = "These documents appear highly dissimilar. Comparison was stopped to save time."
 
@@ -3341,6 +3387,9 @@ successBodyWithName = "Password removed from {{fileName}}"
 successTitle = "Password removed"
 title = "Remove password to continue"
 unlock = "Unlock & Continue"
+unlockAll = "Use for all ({{count}})"
+unlockAllPartialFail = "Wrong password for: {{names}}"
+unlockAllSuccess = "Unlocked {{count}} file(s)."
 unlockPrompt = "Unlock PDF to continue"
 
 [encryptedPdfUnlock.password]
@@ -4291,6 +4340,8 @@ welcomeTitle = "You've been invited!"
 
 [landing]
 addFiles = "Add Files"
+heroSubtitle = "Drop in or add an existing PDF to get started."
+heroTitle = "Stirling PDF"
 mobileUpload = "Upload from Mobile"
 openFromComputer = "Open from computer"
 uploadFromComputer = "Upload from computer"
@@ -4426,6 +4477,8 @@ title = "Markdown To PDF"
 submit = "Merge"
 tags = "merge,Page operations,Back end,server side"
 title = "Merge"
+viewerModeHint = "Merge needs 2 or more files. Head to the file editor to select them."
+goToFileEditor = "Go to file editor"
 
 [merge.error]
 failed = "An error occurred while merging the PDFs."
@@ -6640,9 +6693,13 @@ defaultPdfEditorActive = "Stirling PDF is your default PDF editor"
 defaultPdfEditorChecking = "Checking..."
 defaultPdfEditorInactive = "Another application is set as default"
 defaultPdfEditorSet = "Already Default"
+defaultStartupView = "Default view on launch"
+defaultStartupViewDescription = "Choose which tab is active in the left column when the app starts"
 defaultToolPickerMode = "Default tool picker mode"
 defaultToolPickerModeDescription = "Choose whether the tool picker opens in fullscreen or sidebar by default"
 description = "Configure general application preferences."
+defaultViewerZoom = "Default reader zoom"
+defaultViewerZoomDescription = "Set the default zoom level when opening PDFs in the reader"
 hideUnavailableConversions = "Hide unavailable conversions"
 hideUnavailableConversionsDescription = "Remove disabled conversion options in the Convert tool instead of showing them greyed out."
 hideUnavailableTools = "Hide unavailable tools"
@@ -6665,6 +6722,16 @@ title = "For System Administrators"
 fullscreen = "Fullscreen"
 sidebar = "Sidebar"
 
+[settings.general.startupView]
+automate = "Automate"
+read = "Reader"
+tools = "Tools"
+
+[settings.general.zoomLevel]
+auto = "Auto"
+fitPage = "Fit page"
+fitWidth = "Fit width"
+
 [settings.general.updates]
 checkForUpdates = "Check for Updates"
 currentBackendVersion = "Current Backend Version"
@@ -6821,10 +6888,13 @@ title = "Sign in to Stirling"
 [setup.selfhosted]
 link = "or connect to a self-hosted account"
 subtitle = "Enter your server credentials"
+changeServerLocked = "Your organisation has restricted this app to a specific server"
 switchToLocal = "Use local tools instead"
 title = "Sign in to Server"
 
 [setup.selfhosted.unreachable]
+changeServer = "Connect to a different server"
+changeServerLocked = "Your organisation has restricted this app to a specific server"
 continueOffline = "Use local tools instead"
 message = "Could not reach {{url}}. Check that the server is running and accessible."
 retry = "Retry"
@@ -7524,6 +7594,11 @@ endpointUnavailable = "This tool is unavailable on your server."
 endpointUnavailableClickable = "Not available in this mode. Click to sign in."
 invalidParams = "Fill in the required settings."
 noFiles = "Add a file to get started."
+viewerMode = "Switch to the file editor to select multiple files."
+singleFileScope = "Only applying to: {{fileName}}"
+scopeThisFile = "this file"
+scopeFiles = "files"
+selectFilesHint = "Select files in Active Files to run this tool"
 
 [tools]
 noSearchResults = "No tools found"
diff --git a/frontend/public/locales/es-ES/translation.toml b/frontend/public/locales/es-ES/translation.toml
index 6dcdfdb508..dfa4d79d58 100644
--- a/frontend/public/locales/es-ES/translation.toml
+++ b/frontend/public/locales/es-ES/translation.toml
@@ -8,6 +8,7 @@ black = "Negro"
 blue = "Azul"
 bored = "¿Aburrido de esperar?"
 cancel = "Cancelar"
+confirm = "Confirmar"
 changedCredsMessage = "¡Se cambiaron las credenciales!"
 chooseFile = "Elegir Archivo"
 close = "Cerrar"
@@ -146,6 +147,7 @@ insufficientCredits = "Créditos insuficientes. Requeridos: {{requiredCredits}},
 loadingCredits = "Comprobando créditos..."
 loadingProStatus = "Comprobando estado de suscripción..."
 noticeTopUpOrPlan = "No hay suficientes créditos, por favor recarga o actualiza tu plan"
+accessInvite = "Invitar"
 
 [account]
 accountSettings = "Configuración de la cuenta"
@@ -1427,6 +1429,34 @@ title = "Procesamiento"
 description = "Tiempo máximo de espera para un trabajo de procesamiento antes de informar un error."
 label = "Tiempo de espera de procesamiento (segundos)"
 
+[admin.settings.storage]
+description = "Controla el almacenamiento del servidor y las opciones de compartir."
+title = "Almacenamiento y uso compartido de archivos"
+
+[admin.settings.storage.enabled]
+description = "Permitir a los usuarios almacenar archivos en el servidor."
+label = "Habilitar almacenamiento de archivos en el servidor"
+
+[admin.settings.storage.sharing.email]
+description = "Permitir compartir con direcciones de correo electrónico."
+label = "Habilitar compartir por correo electrónico"
+mailLink = "Configurar ajustes de correo"
+mailNote = "Requiere configuración de correo. "
+
+[admin.settings.storage.sharing.enabled]
+description = "Permitir a los usuarios compartir archivos almacenados."
+label = "Habilitar compartir"
+
+[admin.settings.storage.sharing.links]
+description = "Permitir compartir mediante enlaces con inicio de sesión."
+frontendUrlLink = "Configurar en Ajustes del sistema"
+frontendUrlNote = "Requiere una URL de Frontend. "
+label = "Habilitar enlaces para compartir"
+
+[admin.settings.storage.signing.enabled]
+description = "Permitir a los usuarios crear sesiones de firma de documentos con varios participantes. Requiere habilitar el almacenamiento de archivos en el servidor."
+label = "Habilitar firma en grupo (Alpha)"
+
 [admin.settings.unsavedChanges]
 cancel = "Seguir editando"
 discard = "Descartar cambios"
@@ -2059,7 +2089,19 @@ numbers = "Números/rangos: 5, 10-20"
 progressions = "Progresiones: 3n, 4n+1"
 
 [certSign]
+allSigned = "Todos los participantes han firmado. Listo para finalizar."
+awaitingSignatures = "A la espera de firmas"
+signatureProgress = "{{signedCount}}/{{totalCount}} firmas"
 chooseCertificate = "Elegir archivo de certificado"
+declined = "Rechazado"
+fetchFailed = "No se pudieron cargar los datos de firma"
+finalized = "Finalizado"
+notified = "Notificado"
+partialNote = "Puedes finalizar antes con las firmas actuales. Los participantes sin firmar serán excluidos."
+pending = "Pendiente"
+readyToFinalize = "Listo para finalizar"
+signed = "Firmado"
+viewed = "Visto"
 chooseJksFile = "Elegir archivo JKS"
 chooseP12File = "Elegir archivo PKCS12"
 choosePfxFile = "Elegir archivo PFX"
@@ -2082,6 +2124,7 @@ title = "Firma con certificado"
 invisible = "Invisible"
 stepTitle = "Apariencia de firma"
 visible = "Visible"
+visibility = "Visibilidad"
 
 [certSign.appearance.options]
 title = "Detalles de la firma"
@@ -2188,6 +2231,252 @@ bullet4 = "Puede usar certificados personalizados para verificación"
 text = "Cuando verifica firmas, la herramienta le indica si son válidas, quién firmó el documento, cuándo se firmó y si el documento ha sido cambiado desde la firma."
 title = "Verificar firmas"
 
+[certSign.collab.finalize]
+button = "Finalizar y cargar el PDF firmado"
+early = "Finalizar con las firmas actuales"
+
+[certSign.collab.sessionDetail]
+addButton = "Añadir participantes"
+addParticipants = "Añadir participantes"
+addParticipantsError = "No se pudieron añadir los participantes"
+backToList = "Volver a sesiones"
+deleteConfirm = "¿Estás seguro? Esto no se puede deshacer."
+deleteError = "No se pudo eliminar la sesión"
+deleted = "Sesión eliminada"
+deleteSession = "Eliminar sesión"
+dueDate = "Fecha límite"
+finalizeError = "No se pudo finalizar la sesión"
+loadPdfError = "No se pudo cargar el PDF firmado"
+loadSignedPdf = "Cargar PDF firmado en archivos activos"
+messageLabel = "Mensaje"
+noAdditionalInfo = "Sin información adicional"
+owner = "Propietario"
+participantRemoved = "Participante eliminado"
+participants = "Participantes"
+participantsAdded = "Participantes añadidos correctamente"
+removeParticipant = "Eliminar"
+removeParticipantError = "No se pudo eliminar al participante"
+selectUsers = "Selecciona usuarios..."
+sessionInfo = "Información de la sesión"
+workbenchTitle = "Gestión de sesión"
+
+[certSign.collab.signRequest]
+addedToFiles = "Documento añadido a archivos activos"
+addSignature = "Añade tu firma"
+addToFiles = "Añadir a archivos activos"
+advancedSettings = "Configuración avanzada"
+backToList = "Volver a solicitudes de firma"
+certificateChoice = "Selecciona un certificado para firmar"
+changeSignature = "Cambiar firma"
+clearSignature = "Borrar firma"
+completeAndSign = "Completar y firmar"
+createNewSignature = "Crear nueva firma"
+declineButton = "Rechazar"
+decline = "Rechazar solicitud"
+deleteSelected = "Eliminar firma seleccionada"
+drawSignature = "Dibuja tu firma abajo"
+dueDate = "Fecha límite"
+fileTooLarge = "El tamaño del archivo debe ser menor de 5MB"
+fontFamily = "Familia tipográfica"
+fontSize = "Tamaño de fuente: {{size}}px"
+fontSizePlaceholder = "Tamaño"
+from = "De"
+invalidCertFile = "Selecciona un archivo de certificado P12 o PFX"
+invalidFileType = "Selecciona un archivo de imagen"
+location = "Ubicación (opcional)"
+locationPlaceholder = "¿Desde dónde firmas?"
+message = "Mensaje"
+noCertificate = "Selecciona un archivo de certificado"
+noSignatures = "Coloca al menos una firma en el PDF"
+p12File = "Archivo de certificado P12/PFX"
+password = "Contraseña del certificado"
+passwordPlaceholder = "Introduce la contraseña..."
+penColor = "Color del trazo"
+penSize = "Grosor del trazo: {{size}}px"
+placementActive = "Haz clic en el PDF para colocar"
+placeSignatureButton = "Colocar firma en el PDF"
+reason = "Motivo (opcional)"
+reasonPlaceholder = "¿Por qué firmas?"
+removeImage = "Eliminar imagen"
+removeCertFile = "Eliminar archivo"
+savedSignatures = "Firmas guardadas"
+selectFile = "Seleccionar archivo de imagen"
+selectSignatureTitle = "Seleccionar o crear firma"
+signButton = "Firmar documento"
+signatureInfo = "Estos ajustes los configura el propietario del documento"
+signaturePlaced = "Firma colocada en la página"
+signatureSettings = "Configuración de la firma"
+signatureText = "Texto de la firma"
+signatureTextPlaceholder = "Escribe tu nombre..."
+signatureTypeLabel = "Tipo de firma"
+signingTitle = "Firma"
+textColor = "Color del texto"
+typeSignature = "Escribe tu nombre para crear una firma"
+uploadCert = "Certificado personalizado"
+uploadCertDesc = "Usa tu propio certificado P12/PFX"
+uploadSignature = "Sube la imagen de tu firma"
+usePersonalCert = "Certificado personal"
+usePersonalCertDesc = "Generado automáticamente para tu cuenta"
+useServerCert = "Certificado de la organización"
+useServerCertDesc = "Certificado compartido de la organización"
+workbenchTitle = "Solicitud de firma"
+
+[certSign.collab.signRequest.canvas]
+colorPickerTitle = "Elige el color del trazo"
+continue = "Continuar"
+
+[certSign.collab.signRequest.certModal]
+description = "Has colocado {{count}} firma(s). Elige tu certificado para completar la firma."
+sign = "Firmar documento"
+certValidating = "Validando certificado..."
+certValidUntil = "Certificado válido hasta {{date}}"
+certInvalid = "Certificado no válido: {{error}}"
+certInvalidFallback = "Certificado no válido"
+certNetworkError = "No se pudo validar el certificado"
+title = "Configurar certificado"
+
+[certSign.collab.signRequest.image]
+hint = "Sube una imagen PNG o JPG de tu firma"
+
+[certSign.collab.signRequest.mode]
+move = "Mover firma"
+place = "Colocar firma"
+title = "Modo de firmar o mover"
+
+[certSign.collab.signRequest.modeTabs]
+draw = "Dibujar"
+image = "Subir"
+text = "Escribir"
+
+[certSign.collab.signRequest.placeSignature]
+message = "Haz clic en el PDF para colocar tu firma"
+title = "Colocar firma"
+
+[certSign.collab.signRequest.preview]
+imageAlt = "Firma seleccionada"
+missing = "Sin vista previa"
+textFallback = "Firma"
+
+[certSign.collab.signRequest.saved]
+defaultCanvasLabel = "Firma dibujada"
+defaultImageLabel = "Firma cargada"
+defaultLabel = "Firma"
+defaultTextLabel = "Firma escrita"
+delete = "Eliminar firma"
+none = "No hay firmas guardadas"
+
+[certSign.collab.signRequest.signatureType]
+draw = "Dibujar"
+type = "Escribir"
+upload = "Subir"
+
+[certSign.collab.signRequest.steps]
+back = "Atrás"
+cancelPlacement = "Cancelar colocación"
+certificate = "Certificado"
+clickMultipleTimes = "Haz clic en el PDF varias veces para colocar firmas. Arrastra cualquier firma para moverla o redimensionarla."
+clickToPlace = "Haz clic en el PDF donde quieres que aparezca tu firma."
+continue = "Continuar con la selección de certificado"
+continueToPlacement = "Continuar con la colocación"
+continueToReview = "Continuar con la revisión"
+createSignature = "Crear firma"
+invisible = "Invisible"
+location = "Ubicación:"
+multipleSignatures = "Se aplicarán {{count}} firmas al PDF"
+oneSignature = "Se aplicará 1 firma al PDF"
+placeOnPdf = "Colocar en el PDF"
+reason = "Motivo:"
+reviewTitle = "Revisar antes de firmar"
+signaturePlaced = "Firma colocada en la página {{page}}. Puedes ajustar la posición haciendo clic de nuevo o continuar para revisar."
+visible = "Visible"
+visibility = "Visibilidad:"
+yourSignatures = "Tus firmas ({{count}})"
+
+[certSign.collab.signRequest.text]
+colorLabel = "Color"
+fontLabel = "Fuente"
+fontSizeLabel = "Tamaño"
+fontSizePlaceholder = "16"
+label = "Texto de la firma"
+modalHint = "Escribe tu nombre y luego haz clic en Continuar para colocarlo en el PDF."
+placeholder = "Escribe tu nombre..."
+
+[certSign.collab.participant]
+certValidating = "Validando certificado..."
+certValid = "✓ Certificado válido"
+certValidUntil = " hasta {{date}}"
+certInvalid = "✗ {{error}}"
+certInvalidFallback = "Certificado no válido"
+certNetworkError = "No se pudo validar el certificado"
+
+[certSign.collab.addParticipants]
+add = "Añadir {{count}} participante(s)"
+back = "Atrás"
+configureSignatures = "Configurar la firma"
+continue = "Continuar con la configuración de la firma"
+reasonHelp = "Preestablece un motivo de firma para estos participantes (opcional, pueden cambiarlo al firmar)"
+reasonPlaceholder = "p. ej., Aprobación, Revisión..."
+selectUsers = "Seleccionar usuarios"
+
+[certSign.collab.sessionCreation]
+includeSummaryPage = "Incluir página de resumen de firmas"
+includeSummaryPageHelp = "Se añadirá al final una página de resumen con todos los metadatos de firmas. Se suprimirán los cuadros de firma del certificado digital en las páginas individuales (las firmas manuscritas no se ven afectadas)."
+
+[certSign.collab.sessionList]
+active = "Activa"
+finalized = "Finalizada"
+
+[certSign.collab.signatureSettings]
+description = "Configura cómo aparecerán las firmas para todos los participantes"
+title = "Apariencia de la firma"
+
+[certSign.collab.userSelector]
+inviteUsers = "Añadir usuarios"
+loadError = "No se pudieron cargar los usuarios"
+noTeam = "Sin equipo"
+noUsers = "No se encontraron otros usuarios."
+placeholder = "Selecciona usuarios..."
+
+[certSign.mobile]
+panelActions = "Acciones"
+panelDocument = "Documento"
+panelPeople = "Personas"
+
+[certSign.sessions]
+deleted = "Sesión eliminada"
+fetchFailed = "No se pudieron cargar los detalles de la sesión"
+finalized = "Sesión finalizada"
+loaded = "PDF firmado cargado"
+pdfNotReady = "El PDF no está listo"
+pdfNotReadyDesc = "Se está generando el PDF firmado. Inténtalo de nuevo en un momento."
+
+[certificateChoice.tooltip]
+header = "Tipos de certificado"
+
+[certificateChoice.tooltip.organization]
+bullet1 = "Gestionado por administradores del sistema"
+bullet2 = "Compartido entre usuarios autorizados"
+bullet3 = "Representa la identidad de la empresa, no la individual"
+bullet4 = "Ideal para: Documentos oficiales, firmas de equipo"
+description = "Un certificado compartido proporcionado por tu organización. Se usa para la autoridad de firma a nivel de empresa."
+title = "Certificado de la organización"
+
+[certificateChoice.tooltip.personal]
+bullet1 = "Se genera automáticamente en el primer uso"
+bullet2 = "Vinculado a tu cuenta de usuario"
+bullet3 = "No se puede compartir con otros usuarios"
+bullet4 = "Ideal para: Documentos personales, responsabilidad individual"
+description = "Un certificado autogenerado único para tu cuenta de usuario. Adecuado para firmas individuales."
+title = "Certificado personal"
+
+[certificateChoice.tooltip.upload]
+bullet1 = "Requiere archivo P12/PFX y contraseña"
+bullet2 = "Puede ser emitido por Autoridades de Certificación externas"
+bullet3 = "Mayor nivel de confianza para documentos legales"
+bullet4 = "Ideal para: Contratos legalmente vinculantes, validación externa"
+description = "Usa tu propio archivo de certificado PKCS#12. Proporciona control total sobre las propiedades del certificado."
+title = "Cargar P12 personalizado"
+
 [changeCreds]
 changePassword = "Está usando las credenciales de inicio de sesión por defecto. Por favor, introduzca una contraseña nueva"
 changeUsername = "Actualiza tu nombre de usuario. Se cerrará tu sesión tras actualizar."
@@ -3242,6 +3531,46 @@ totalSelected = "Total Seleccionados"
 unsupported = "No Soportado"
 unzip = "Descomprimir"
 uploadError = "Error al cargar algunos archivos."
+copyCreated = "Copia guardada en este dispositivo."
+copyFailed = "No se pudo crear una copia."
+leaveShare = "Quitar de mi lista"
+leaveShareFailed = "No se pudo quitar el archivo compartido."
+leaveShareSuccess = "Eliminado de tu lista de compartidos."
+removeBoth = "Eliminar de ambos"
+removeFilePrompt = "Este archivo está guardado en este dispositivo y en tu servidor. ¿Dónde quieres eliminarlo?"
+removeFileTitle = "Eliminar archivo"
+removeLocalOnly = "Solo este dispositivo"
+removeServerFailed = "No se pudo eliminar el archivo del servidor."
+removeServerOnly = "Solo servidor"
+removeServerOnlyPrompt = "Este archivo está almacenado solo en tu servidor. ¿Quieres eliminarlo del servidor?"
+removeServerSuccess = "Eliminado del servidor."
+removeSharedPrompt = "Este archivo está compartido contigo. Puedes eliminarlo de este dispositivo o de tu lista de compartidos."
+removeSharedServerOnlyBlockedPrompt = "Este archivo está compartido contigo y se almacena solo en el servidor."
+removeSharedServerOnlyPrompt = "Este archivo está compartido contigo y se almacena solo en el servidor. ¿Eliminarlo de tu lista?"
+changesNotUploaded = "Cambios no subidos"
+cloudFile = "Archivo en la nube"
+filterAll = "Todos"
+filterLocal = "Local"
+filterSharedByMe = "Compartidos por mí"
+filterSharedWithMe = "Compartidos conmigo"
+lastSynced = "Última sincronización"
+localOnly = "Solo local"
+makeCopy = "Hacer una copia"
+owner = "Propietario"
+ownerUnknown = "Desconocido"
+share = "Compartir"
+shareSelected = "Compartir seleccionados"
+sharedByYou = "Compartidos por ti"
+sharedEditNoticeBody = "No tienes derechos de edición sobre la versión en el servidor de este archivo. Cualquier edición que hagas se guardará como una copia local."
+sharedEditNoticeConfirm = "Entendido"
+sharedEditNoticeTitle = "Copia del servidor de solo lectura"
+sharedWithYou = "Compartidos contigo"
+sharing = "Uso compartido"
+storageState = "Almacenamiento"
+synced = "Sincronizado"
+updateOnServer = "Actualizar en el servidor"
+uploadSelected = "Subir seleccionados"
+uploadToServer = "Subir al servidor"
 
 [files]
 addFiles = "Agregar archivos"
@@ -3367,6 +3696,77 @@ title = "Acerca de Aplanar PDFs"
 discord = "Discord"
 issues = "GitHub"
 
+[groupSigning.tooltip]
+header = "Acerca de la firma en grupo"
+
+[groupSigning.tooltip.finalization]
+bullet1 = "Todas las firmas se aplican en el orden de participantes que especificaste"
+bullet2 = "Puedes finalizar con firmas parciales si es necesario"
+bullet3 = "Una vez finalizada, la sesión no se puede modificar"
+description = "Cuando todos los participantes hayan firmado (o decidas finalizar antes), podrás generar el PDF final firmado."
+title = "Proceso de finalización"
+
+[groupSigning.tooltip.roles]
+bullet1 = "Propietario (tú): Crea la sesión, configura los valores predeterminados de firma, finaliza el documento"
+bullet2 = "Participantes: Crean su firma, eligen el certificado, la colocan en el PDF"
+bullet3 = "Los participantes no pueden modificar la visibilidad, el motivo ni la ubicación de la firma"
+description = "Controlas los ajustes de apariencia de la firma para todos los participantes."
+title = "Roles de los participantes"
+
+[groupSigning.tooltip.sequential]
+bullet1 = "El primer participante debe firmar antes de que el segundo pueda acceder al documento"
+bullet2 = "Garantiza el orden de firma adecuado para el cumplimiento legal"
+bullet3 = "Puedes reordenar a los participantes arrastrándolos en la lista"
+description = "Los participantes firman los documentos en el orden que especifiques. Cada firmante recibe una notificación cuando es su turno."
+title = "Firma secuencial"
+
+[groupSigning.steps]
+back = "Atrás"
+completed = "Completado"
+current = "Actual"
+stepLabel = "Paso {{number}}"
+
+[groupSigning.steps.configureDefaults]
+continue = "Continuar con la revisión"
+invisible = "Las firmas serán invisibles (solo metadatos)"
+locationLabel = "Ubicación:"
+preview = "Vista previa"
+reasonLabel = "Motivo:"
+title = "Configurar ajustes de firma"
+visible = "Las firmas serán visibles en la página {{page}}"
+
+[groupSigning.steps.review]
+document = "Documento"
+dueDate = "Fecha límite (opcional)"
+dueDatePlaceholder = "Selecciona la fecha límite..."
+invisible = "Invisible (solo metadatos)"
+location = "Ubicación:"
+logo = "Logotipo:"
+logoHidden = "Sin logotipo"
+logoShown = "Se muestra el logotipo de Stirling PDF"
+participants = "Participantes"
+reason = "Motivo:"
+send = "Enviar solicitudes de firma"
+signatureSettings = "Configuración de la firma"
+title = "Revisar detalles de la sesión"
+titleShort = "Revisar y enviar"
+visibility = "Visibilidad:"
+visible = "Visible en la página {{page}}"
+participantCount = "{{count}} participante(s) firmará(n) en orden"
+
+[groupSigning.steps.selectDocument]
+continue = "Continuar con la selección de participantes"
+noFile = "Selecciona un único archivo PDF de tus archivos activos para crear una sesión de firma."
+selectedFile = "Documento seleccionado"
+title = "Seleccionar documento"
+
+[groupSigning.steps.selectParticipants]
+continue = "Continuar con la configuración de la firma"
+count = "{{count}} participante(s) seleccionado(s)"
+label = "Seleccionar participantes"
+placeholder = "Elige participantes para firmar..."
+title = "Elegir participantes"
+
 [getPdfInfo]
 downloadJson = "Descargar JSON"
 downloads = "Descargas"
@@ -4460,7 +4860,10 @@ zoomOut = "Alejar"
 
 [viewer]
 cannotPreviewFile = "No se puede previsualizar el archivo"
+disableColorFilter = "Desactivar filtro de color"
 dualPageView = "Vista de Página Doble"
+enableDarkFilter = "Activar filtro oscuro"
+enableSepiaFilter = "Activar filtro sepia"
 firstPage = "Primera Página"
 lastPage = "Última Página"
 nextPage = "Página Siguiente"
@@ -4470,6 +4873,22 @@ singlePageView = "Vista de Página Única"
 unknownFile = "Archivo desconocido"
 zoomIn = "Acercar"
 zoomOut = "Alejar"
+resetZoom = "Restablecer zoom"
+
+[viewer.nonPdf]
+fileTypeBadge = "Archivo {{type}}"
+convertToPdf = "Convertir a PDF"
+loading = "Cargando..."
+emptyFile = "Archivo vacío"
+csvStats = "{{rows}} filas · {{columns}} columnas · {{size}}"
+sortedBy = "Ordenado por: {{column}}"
+columnDefault = "Columna {{index}}"
+htmlPreviewWarning = "Vista previa de HTML — los recursos externos pueden no cargarse · {{size}}"
+htmlPreview = "Vista previa de HTML"
+invalidJson = "JSON no válido — mostrando contenido sin procesar"
+textStats = "{{lines}} líneas · {{size}}"
+lineNumbers = "Números de línea"
+renderMarkdown = "Renderizar markdown"
 
 [viewer.attachments]
 title = "Adjuntos"
@@ -4531,6 +4950,7 @@ toggleAttachments = "Mostrar/ocultar adjuntos"
 toggleTheme = "Alternar Tema"
 language = "Idioma"
 toggleAnnotations = "Mostrar/ocultar anotaciones"
+toggleLayers = "Alternar capas"
 search = "Buscar en PDF"
 panMode = "Modo de Desplazamiento"
 applyRedactionsFirst = "Aplica primero las censuras"
@@ -5407,20 +5827,72 @@ title = "Imprimir archivo"
 2 = "Introducir nombre de la impresora"
 
 [quickAccess]
+access = "Acceso"
+accessAddPerson = "Añadir otra persona"
+accessBack = "Atrás"
+accessCopyLink = "Copiar enlace"
+accessEmail = "Dirección de correo electrónico"
+accessEmailPlaceholder = "nombre@empresa.com"
+accessFileLabel = "Archivo"
+accessGeneral = "Acceso general"
+accessInviteTitle = "Invitar personas"
+accessOwner = "Propietario"
+accessPanel = "Acceso al documento"
+accessPeople = "Personas con acceso"
+accessRemove = "Eliminar"
+accessRestricted = "Restringido"
+accessRestrictedHint = "Solo las personas con acceso pueden abrir"
+accessRole = "Rol"
+accessRoleCommenter = "Comentarista"
+accessRoleEditor = "Editor"
+accessRoleViewer = "Lector"
+accessSelectedFile = "Archivo seleccionado"
+accessSendInvite = "Enviar invitación"
+accessTitle = "Acceso al documento"
+accessYou = "Tú"
 account = "Cuenta"
+activeSessions = "Sesiones activas"
+activeTab = "Activas"
 activity = "Registro"
 adminSettings = "Ajustes admin"
+allSessions = "Todas las sesiones"
 allTools = "Herram."
 automate = "Automatizar"
+back = "Atrás"
+certSign = "Firma con certificado"
+completedSessions = "Sesiones completadas"
+completedTab = "Completadas"
 config = "Conf."
+createNew = "Crear nueva solicitud"
+createSession = "Crear solicitud de firma"
+dueDate = "Fecha límite (opcional)"
 files = "Archivos"
 help = "Ayuda"
+noActiveSessions = "No hay solicitudes de firma pendientes ni sesiones activas"
+noCompletedSessions = "No hay sesiones completadas"
+noFile = "Ningún archivo seleccionado"
 read = "Leer"
 reader = "Lector"
+refresh = "Actualizar"
+requestSignatures = "Solicitar firmas"
+selectSingleFileToRequest = "Selecciona un único archivo PDF para solicitar firmas"
+selectedFile = "Archivo seleccionado"
+selectUsers = "Selecciona usuarios para firmar"
+selectUsersPlaceholder = "Elige participantes..."
+sendingRequest = "Enviando..."
 settings = "Ajustes"
 showMeAround = "Muéstrame cómo funciona"
 sign = "Firmar"
+signatureRequests = "Solicitudes de firma"
+signYourself = "Firmar tú mismo"
+newRequest = "Nueva solicitud"
 tours = "Recorridos"
+wetSign = "Añadir firma"
+filterMine = "Mías"
+filterOverdue = "Vencidas"
+filterSigned = "Firmadas"
+filterDeclined = "Rechazadas"
+searchDocuments = "Buscar documentos…"
 
 [quickAccess.helpMenu]
 adminTour = "Recorrido de administración"
@@ -6050,11 +6522,75 @@ toolNotAvailableLocally = "Tu servidor Stirling-PDF está sin conexión y \"{{en
 expired = "Su sesión ha caducado. Actualice la página e inténtelo de nuevo."
 refreshPage = "Refrescar Página"
 
+[sessionManagement.tooltip]
+header = "Gestión de sesiones de firma"
+
+[sessionManagement.tooltip.addParticipants]
+bullet1 = "Los nuevos participantes se añaden al final del orden de firma"
+bullet2 = "No se pueden añadir participantes después de finalizar la sesión"
+bullet3 = "Cada participante recibe una notificación cuando sea su turno"
+description = "Puedes añadir más participantes a una sesión activa en cualquier momento antes de la finalización."
+title = "Añadir participantes"
+
+[sessionManagement.tooltip.finalization]
+bullet1 = "<b>Finalización completa</b>: Todos los participantes han firmado"
+bullet2 = "<b>Finalización parcial</b>: Algunos participantes aún no han firmado"
+bullet3 = "Los participantes sin firmar serán excluidos del documento final"
+bullet4 = "Una vez finalizada, puedes cargar el PDF firmado en archivos activos"
+description = "La finalización combina todas las firmas en un único PDF firmado. Esta acción no se puede deshacer."
+title = "Finalización de la sesión"
+
+[sessionManagement.tooltip.participantRemoval]
+bullet1 = "No se pueden eliminar participantes que ya hayan firmado"
+bullet2 = "Los participantes eliminados ya no recibirán notificaciones"
+bullet3 = "El orden de firma se ajusta automáticamente"
+description = "Se puede eliminar a los participantes de las sesiones antes de que firmen."
+title = "Eliminar participantes"
+
+[sessionManagement.tooltip.signatureOrder]
+bullet1 = "Cada firma se aplica secuencialmente al PDF"
+bullet2 = "Los firmantes posteriores pueden ver las firmas anteriores"
+bullet3 = "Crucial para flujos de aprobación y cadenas de custodia legales"
+description = "El orden que especifiques al crear la sesión determina quién firma primero."
+title = "Orden de firmas"
+
+[signatureSettings.tooltip]
+header = "Ajustes de apariencia de la firma"
+
+[signatureSettings.tooltip.location]
+bullet1 = "Ejemplos: \"Nueva York, EE. UU.\", \"Oficina de Londres\", \"Remoto\""
+bullet2 = "No es lo mismo que la posición en la página"
+bullet3 = "Puede ser obligatorio en ciertas jurisdicciones legales"
+description = "Ubicación geográfica opcional donde se aplicó la firma. Se almacena en los metadatos del certificado."
+title = "Ubicación de la firma"
+
+[signatureSettings.tooltip.logo]
+bullet1 = "Se muestra junto a la firma y el texto"
+bullet2 = "Compatible con formatos PNG, JPG"
+bullet3 = "Mejora la apariencia profesional"
+description = "Añade un logotipo de empresa a las firmas visibles para la marca y la autenticidad."
+title = "Logotipo de la empresa"
+
+[signatureSettings.tooltip.reason]
+bullet1 = "Ejemplos: \"Aprobación\", \"Acuerdo de contrato\", \"Revisión completa\""
+bullet2 = "Visible en las propiedades de firma del PDF"
+bullet3 = "Útil para auditorías y cumplimiento"
+description = "Texto opcional que explica por qué se firma el documento. Se almacena en los metadatos del certificado."
+title = "Motivo de la firma"
+
+[signatureSettings.tooltip.visibility]
+bullet1 = "<b>Visible</b>: La firma aparece en el PDF con apariencia personalizada"
+bullet2 = "<b>Invisible</b>: Certificado incrustado sin marca visual"
+bullet3 = "Las firmas invisibles siguen proporcionando validación criptográfica"
+description = "Controla si la firma es visible en el documento o se incrusta de forma invisible."
+title = "Visibilidad de la firma"
+
 [settings.configuration]
 advanced = "Avanzado"
 database = "Base de datos"
 endpoints = "Endpoints"
 features = "Funciones"
+storageSharing = "Almacenamiento y uso compartido de archivos"
 systemSettings = "Ajustes del sistema"
 title = "Configuración"
 
@@ -6332,10 +6868,13 @@ title = "Inicie sesión en Stirling"
 [setup.selfhosted]
 link = "o conectarse a una cuenta autoalojada"
 subtitle = "Introduzca las credenciales de su servidor"
+changeServerLocked = "Tu organización ha restringido esta aplicación a un servidor específico"
 switchToLocal = "Usar herramientas locales en su lugar"
 title = "Inicie sesión en el servidor"
 
 [setup.selfhosted.unreachable]
+changeServer = "Conectar a un servidor diferente"
+changeServerLocked = "Tu organización ha restringido esta aplicación a un servidor específico"
 continueOffline = "Usar herramientas locales en su lugar"
 message = "No se pudo acceder a {{url}}. Comprueba que el servidor esté en ejecución y sea accesible."
 retry = "Reintentar"
@@ -6529,6 +7068,15 @@ saved = "Guardadas"
 text = "Texto"
 title = "Tipo de Firma"
 
+[signRequest]
+declined = "Solicitud de firma rechazada"
+fetchFailed = "No se pudo cargar la solicitud de firma"
+signed = "Documento firmado correctamente"
+
+[signSession]
+createFailed = "No se pudo crear la solicitud de firma"
+created = "Solicitud de firma enviada"
+
 [signup]
 accountCreatedSuccessfully = "¡Cuenta creada con éxito! Ahora puede iniciar sesión."
 alreadyHaveAccount = "¿Ya tiene una cuenta? Iniciar sesión"
@@ -6807,6 +7355,106 @@ title = "Dividir PDF por Capítulos"
 [splitPdfByChapters]
 tags = "dividir,capítulos,marcadores,organizar"
 
+[storageShare]
+accessed = "Accedido"
+accessDenied = "No tienes acceso a este archivo compartido. Pide al propietario que lo comparta contigo."
+accessFailed = "No se pudo cargar la actividad."
+accessDeniedBody = "No tienes acceso a este archivo. Pide al propietario que lo comparta contigo."
+accessDeniedTitle = "Sin acceso"
+accessLimitedCommenter = "El acceso de comentarios llegará pronto. Pide acceso de editor si necesitas descargar."
+accessLimitedTitle = "Acceso limitado"
+accessLimitedViewer = "Este enlace es solo de visualización. Pide acceso de editor si necesitas descargar."
+createdAt = "Creado"
+download = "Descargar"
+downloadFailed = "No se puede descargar este archivo."
+expiredBody = "Este enlace para compartir no es válido o ha caducado."
+expiredTitle = "Enlace caducado"
+goToLogin = "Ir al inicio de sesión"
+loadFailed = "No se puede abrir el archivo compartido."
+loading = "Cargando enlace para compartir..."
+loginPrompt = "Inicia sesión para acceder a este archivo compartido."
+loginRequired = "Se requiere inicio de sesión"
+openInApp = "Abrir en Stirling PDF"
+ownerLabel = "Propietario"
+ownerUnknown = "Desconocido"
+requiresLogin = "Este archivo compartido requiere inicio de sesión."
+roleCommenter = "Comentarista"
+roleEditor = "Editor"
+roleViewer = "Lector"
+shareHeading = "Archivo compartido"
+titleDefault = "Archivo compartido"
+tryAgain = "Vuelve a intentarlo más tarde."
+addUser = "Añadir"
+commenterHint = "La función de comentarios llegará pronto."
+copied = "Enlace copiado al portapapeles"
+copy = "Copiar"
+copyFailed = "Error al copiar"
+description = "Crea un enlace para compartir este archivo. Los usuarios con sesión iniciada que tengan el enlace podrán acceder."
+downloadsCount = "Descargas: {{count}}"
+emailWarningBody = "Parece una dirección de correo electrónico. Si esta persona no es ya usuaria de Stirling PDF, no podrá acceder al archivo."
+emailWarningConfirm = "Compartir de todos modos"
+emailWarningTitle = "Dirección de correo electrónico"
+errorTitle = "Error al compartir"
+failure = "No se puede generar un enlace para compartir. Inténtalo de nuevo."
+fileLabel = "Archivo"
+generate = "Generar enlace"
+generated = "Enlace para compartir generado"
+hideActivity = "Ocultar actividad"
+invalidUsername = "Introduce un nombre de usuario o correo electrónico válido."
+lastAccessed = "Último acceso"
+linkAccessTitle = "Acceso mediante enlace para compartir"
+linkLabel = "Enlace para compartir"
+linksDisabled = "Los enlaces para compartir están desactivados."
+linksDisabledBody = "Los enlaces para compartir están desactivados por la configuración de tu servidor."
+manage = "Gestionar uso compartido"
+manageDescription = "Crea y gestiona enlaces para compartir este archivo."
+manageLoadFailed = "No se pueden cargar los enlaces para compartir."
+manageTitle = "Gestionar uso compartido"
+noActivity = "Aún no hay actividad."
+noLinks = "Aún no hay enlaces activos para compartir."
+noSharedUsers = "Aún no hay usuarios con acceso."
+removeLink = "Eliminar enlace"
+removeUser = "Eliminar"
+revokeFailed = "No se puede eliminar el enlace para compartir."
+revoked = "Enlace para compartir eliminado"
+roleLabel = "Rol"
+sharingDisabled = "El uso compartido está desactivado."
+sharingDisabledBody = "El uso compartido se ha desactivado por la configuración del servidor."
+sharedUsersTitle = "Usuarios con acceso compartido"
+title = "Compartir archivo"
+unknownUser = "Usuario desconocido"
+userAddFailed = "No se puede compartir con ese usuario."
+userAdded = "Usuario añadido a la lista de compartidos."
+usernameLabel = "Nombre de usuario o correo electrónico"
+usernamePlaceholder = "Introduce un nombre de usuario o correo electrónico"
+userRemoveFailed = "No se puede eliminar a ese usuario."
+userRemoved = "Usuario eliminado de la lista de compartidos."
+viewActivity = "Ver actividad"
+viewed = "Visto"
+viewsCount = "Vistas: {{count}}"
+downloaded = "Descargado"
+bulkDescription = "Crea un único enlace para compartir todos los archivos seleccionados con usuarios que hayan iniciado sesión."
+bulkTitle = "Compartir archivos seleccionados"
+copyLink = "Copiar enlace para compartir"
+fileCount = "{{count}} archivos seleccionados"
+ownerOnly = "Solo el propietario puede gestionar el uso compartido."
+selectSingleFile = "Selecciona un solo archivo para gestionar el uso compartido."
+
+[storageUpload]
+description = "Esto sube el archivo actual al almacenamiento del servidor para tu propio acceso."
+errorTitle = "Error al subir"
+failure = "La subida ha fallado. Comprueba tu inicio de sesión y la configuración de almacenamiento."
+fileLabel = "Archivo"
+hint = "Los enlaces públicos y los modos de acceso están controlados por la configuración del servidor."
+success = "Subido al servidor"
+title = "Subir al servidor"
+updateButton = "Actualizar en el servidor"
+uploadButton = "Subir al servidor"
+bulkDescription = "Esto sube los archivos seleccionados al almacenamiento del servidor."
+bulkTitle = "Subir archivos seleccionados"
+fileCount = "{{count}} archivos seleccionados"
+more = " +{{count}} más"
+
 [storage]
 approximateSize = "Tamaño aproximado"
 fileTooLarge = "Archivo demasiado grande. El tamaño máximo por archivo es"
@@ -7153,6 +7801,30 @@ title = "Ver/Editar PDF"
 [warning]
 tooltipTitle = "Advertencia"
 
+[wetSignature.tooltip]
+header = "Métodos de creación de firma"
+
+[wetSignature.tooltip.draw]
+bullet1 = "Personaliza el color y el grosor del trazo"
+bullet2 = "Borra y vuelve a dibujar hasta que quedes conforme"
+bullet3 = "Funciona en dispositivos táctiles (tabletas, teléfonos)"
+description = "Crea una firma manuscrita con el ratón o la pantalla táctil. Ideal para firmas personales y auténticas."
+title = "Dibujar firma"
+
+[wetSignature.tooltip.type]
+bullet1 = "Elige entre varias tipografías"
+bullet2 = "Personaliza el tamaño y el color del texto"
+bullet3 = "Perfecto para firmas estandarizadas"
+description = "Genera una firma a partir de texto escrito. Rápida y coherente, adecuada para documentos empresariales."
+title = "Escribir firma"
+
+[wetSignature.tooltip.upload]
+bullet1 = "Compatible con PNG, JPG y otros formatos de imagen"
+bullet2 = "Se recomiendan fondos transparentes para mejores resultados"
+bullet3 = "La imagen se ajustará para encajar en el área de la firma"
+description = "Sube una imagen de firma ya creada. Ideal si tienes una firma escaneada o el logotipo de la empresa."
+title = "Subir imagen de la firma"
+
 [watermark]
 completed = "Marca de agua añadida"
 desc = "Añadir marcas de agua de texto o imagen a archivos PDF"
@@ -7333,6 +8005,7 @@ activeSession = "Sesión activa"
 addMembers = "Añadir miembros"
 admin = "Administrador"
 confirmDelete = "¿Seguro que quieres eliminar a este usuario? Esta acción no se puede deshacer."
+confirmUnlock = "¿Seguro que quieres desbloquear esta cuenta de usuario?"
 deleteUser = "Eliminar usuario"
 deleteUserError = "No se pudo eliminar el usuario"
 deleteUserSuccess = "Usuario eliminado correctamente"
@@ -7341,6 +8014,8 @@ disable = "Deshabilitar"
 disabled = "Deshabilitado"
 editRole = "Editar rol"
 enable = "Habilitar"
+locked = "bloqueado"
+lockedBadge = "Bloqueado"
 loading = "Cargando personas..."
 loginRequired = "Habilite primero el modo de inicio de sesión"
 member = "Miembro"
@@ -7350,6 +8025,9 @@ searchMembers = "Buscar miembros..."
 status = "Estado"
 team = "Equipo"
 title = "Personas"
+unlockAccount = "Desbloquear cuenta"
+unlockUserError = "Error al desbloquear la cuenta de usuario"
+unlockUserSuccess = "La cuenta de usuario se ha desbloqueado correctamente"
 user = "Usuario"
 
 [workspace.people.actions]
diff --git a/frontend/public/locales/eu-ES/translation.toml b/frontend/public/locales/eu-ES/translation.toml
index a778d7ac2d..c3a1987c00 100644
--- a/frontend/public/locales/eu-ES/translation.toml
+++ b/frontend/public/locales/eu-ES/translation.toml
@@ -8,6 +8,7 @@ black = "Beltza"
 blue = "Urdina"
 bored = "Itxaroten aspertuta?"
 cancel = "Utzi"
+confirm = "Berretsi"
 changedCredsMessage = "Kredentzialak aldatu dira!"
 chooseFile = "Aukeratu fitxategia"
 close = "Itxi"
@@ -146,6 +147,7 @@ insufficientCredits = "Kreditu nahikorik ez. Beharrezkoa: {{requiredCredits}}, E
 loadingCredits = "Kredituak egiaztatzen..."
 loadingProStatus = "Harpidetza-egoera egiaztatzen..."
 noticeTopUpOrPlan = "Kreditu nahikorik ez, mesedez kargatu edo eguneratu plan batera"
+accessInvite = "Gonbidatu"
 
 [account]
 accountSettings = "Kontuaren ezarpenak"
@@ -1427,6 +1429,34 @@ title = "Prozesatzea"
 description = "Akatsa jakinarazi aurretik prozesatze-lan baten zain egoteko gehieneko denbora."
 label = "Prozesatzearen denbora-muga (segundoak)"
 
+[admin.settings.storage]
+description = "Kontrolatu zerbitzariaren biltegiratzea eta partekatze aukerak."
+title = "Fitxategi biltegiratzea eta partekatzea"
+
+[admin.settings.storage.enabled]
+description = "Baimendu erabiltzaileei fitxategiak zerbitzarian gordetzea."
+label = "Gaitu zerbitzariaren fitxategi-biltegiratzea"
+
+[admin.settings.storage.sharing.email]
+description = "Baimendu partekatzea helbide elektronikoekin."
+label = "Gaitu posta bidezko partekatzea"
+mailLink = "Konfiguratu posta ezarpenak"
+mailNote = "Posta konfigurazioa behar da. "
+
+[admin.settings.storage.sharing.enabled]
+description = "Baimendu erabiltzaileei gordetako fitxategiak partekatzea."
+label = "Gaitu partekatzea"
+
+[admin.settings.storage.sharing.links]
+description = "Baimendu saioa eskatzen duten esteken bidez partekatzea."
+frontendUrlLink = "Konfiguratu sistema ezarpenetan"
+frontendUrlNote = "Frontend URL behar da. "
+label = "Gaitu partekatzeko estekak"
+
+[admin.settings.storage.signing.enabled]
+description = "Baimendu erabiltzaileei parte-hartzaile anitzeko dokumentu-sinatze saioak sortzea. Zerbitzariaren fitxategi-biltegiratzea gaituta egotea behar da."
+label = "Gaitu taldeko sinadura (Alpha)"
+
 [admin.settings.unsavedChanges]
 cancel = "Editatzen jarraitu"
 discard = "Aldaketak baztertu"
@@ -2059,7 +2089,19 @@ numbers = "Zenbakiak/barrutiak: 5, 10-20"
 progressions = "Progresioak: 3n, 4n+1"
 
 [certSign]
+allSigned = "Parte-hartzaile guztiek sinatu dute. Amaitzeko prest."
+awaitingSignatures = "Sinaduren zain"
+signatureProgress = "{{signedCount}}/{{totalCount}} sinadura"
 chooseCertificate = "Aukeratu ziurtagiri-fitxategia"
+declined = "Ukatua"
+fetchFailed = "Ezin izan da sinadura-datuak kargatu"
+finalized = "Amaituta"
+notified = "Jakinarazita"
+partialNote = "Goiz amai dezakezu oraingo sinadurekin. Sinatu gabeko parte-hartzaileak baztertu egingo dira."
+pending = "Zain"
+readyToFinalize = "Amaitzeko prest"
+signed = "Sinatuta"
+viewed = "Ikusita"
 chooseJksFile = "Aukeratu JKS fitxategia"
 chooseP12File = "Aukeratu PKCS12 fitxategia"
 choosePfxFile = "Aukeratu PFX fitxategia"
@@ -2082,6 +2124,7 @@ title = "Ziurtagiriaren sinadura"
 invisible = "Ikusezina"
 stepTitle = "Sinaduraren itxura"
 visible = "Ikusgai"
+visibility = "Ikusgaitasuna"
 
 [certSign.appearance.options]
 title = "Sinaduraren xehetasunak"
@@ -2188,6 +2231,252 @@ bullet4 = "Egiaztapenerako ziurtagiri pertsonalizatuak erabil ditzake"
 text = "Sinadurak egiaztatzean, tresnak baliozkoak diren edo ez, nork sinatu duen, noiz sinatu zen, eta dokumentua sinatu ondoren aldatu den ala ez esaten dizu."
 title = "Sinadurak egiaztatzea"
 
+[certSign.collab.finalize]
+button = "Amaitu eta kargatu sinatutako PDFa"
+early = "Amaitu uneko sinadurekin"
+
+[certSign.collab.sessionDetail]
+addButton = "Gehitu parte-hartzaileak"
+addParticipants = "Gehitu parte-hartzaileak"
+addParticipantsError = "Ezin izan da parte-hartzaileak gehitu"
+backToList = "Itzuli saioetara"
+deleteConfirm = "Ziur zaude? Hau ezin da desegin."
+deleteError = "Ezin izan da saioa ezabatu"
+deleted = "Saioa ezabatuta"
+deleteSession = "Ezabatu saioa"
+dueDate = "Epemuga"
+finalizeError = "Ezin izan da saioa amaitu"
+loadPdfError = "Ezin izan da sinatutako PDFa kargatu"
+loadSignedPdf = "Kargatu sinatutako PDFa fitxategi aktiboetan"
+messageLabel = "Mezua"
+noAdditionalInfo = "Ez dago informazio osagarririk"
+owner = "Jabea"
+participantRemoved = "Parte-hartzailea kendu da"
+participants = "Parte-hartzaileak"
+participantsAdded = "Parte-hartzaileak ongi gehitu dira"
+removeParticipant = "Kendu"
+removeParticipantError = "Ezin izan da parte-hartzailea kendu"
+selectUsers = "Hautatu erabiltzaileak..."
+sessionInfo = "Saioaren informazioa"
+workbenchTitle = "Saio-kudeaketa"
+
+[certSign.collab.signRequest]
+addedToFiles = "Dokumentua fitxategi aktiboetara gehitu da"
+addSignature = "Gehitu zure sinadura"
+addToFiles = "Gehitu fitxategi aktiboetara"
+advancedSettings = "Ezarpen aurreratuak"
+backToList = "Itzuli sinadura-eskaeretara"
+certificateChoice = "Hautatu sinatzeko ziurtagiri bat"
+changeSignature = "Aldatu sinadura"
+clearSignature = "Garbitu sinadura"
+completeAndSign = "Osatu eta sinatu"
+createNewSignature = "Sortu sinadura berria"
+declineButton = "Ukatu"
+decline = "Ukatu eskaera"
+deleteSelected = "Ezabatu hautatutako sinadura"
+drawSignature = "Marraztu zure sinadura behean"
+dueDate = "Epemuga"
+fileTooLarge = "Fitxategiaren tamainak 5MB baino txikiagoa izan behar du"
+fontFamily = "Letra-familia"
+fontSize = "Letra-tamaina: {{size}}px"
+fontSizePlaceholder = "Tamaina"
+from = "Nork"
+invalidCertFile = "Hautatu P12 edo PFX ziurtagiri-fitxategi bat"
+invalidFileType = "Hautatu irudi-fitxategi bat"
+location = "Kokapena (aukera)"
+locationPlaceholder = "Nondik sinatzen ari zara?"
+message = "Mezua"
+noCertificate = "Hautatu ziurtagiri-fitxategi bat"
+noSignatures = "Jarri gutxienez sinadura bat PDFan"
+p12File = "P12/PFX ziurtagiri-fitxategia"
+password = "Ziurtagiriaren pasahitza"
+passwordPlaceholder = "Idatzi pasahitza..."
+penColor = "Arkatzaren kolorea"
+penSize = "Arkatzaren tamaina: {{size}}px"
+placementActive = "Egin klik PDFan jartzeko"
+placeSignatureButton = "Jarri sinadura PDFan"
+reason = "Arrazoia (aukera)"
+reasonPlaceholder = "Zergatik sinatzen ari zara?"
+removeImage = "Kendu irudia"
+removeCertFile = "Kendu fitxategia"
+savedSignatures = "Gordetako sinadurak"
+selectFile = "Hautatu irudi-fitxategia"
+selectSignatureTitle = "Hautatu edo sortu sinadura"
+signButton = "Sinatu dokumentua"
+signatureInfo = "Ezarpen hauek dokumentuaren jabeak konfiguratzen ditu"
+signaturePlaced = "Sinadura orrian jarrita"
+signatureSettings = "Sinadura-ezarpenak"
+signatureText = "Sinadura-testua"
+signatureTextPlaceholder = "Idatzi zure izena..."
+signatureTypeLabel = "Sinadura mota"
+signingTitle = "Sinatzea"
+textColor = "Testu-kolorea"
+typeSignature = "Idatzi zure izena sinadura sortzeko"
+uploadCert = "Pertsonalizatutako ziurtagiria"
+uploadCertDesc = "Erabili zure P12/PFX ziurtagiria"
+uploadSignature = "Igo zure sinadura-irudia"
+usePersonalCert = "Ziurtagiri pertsonala"
+usePersonalCertDesc = "Zure konturako automatikoki sortua"
+useServerCert = "Erakundeko ziurtagiria"
+useServerCertDesc = "Erakundeak partekatutako ziurtagiria"
+workbenchTitle = "Sinadura-eskaera"
+
+[certSign.collab.signRequest.canvas]
+colorPickerTitle = "Aukeratu trazatuaren kolorea"
+continue = "Jarraitu"
+
+[certSign.collab.signRequest.certModal]
+description = "{{count}} sinadura jarri dituzu. Aukeratu zure ziurtagiria sinadura osatzeko."
+sign = "Sinatu dokumentua"
+certValidating = "Ziurtagiria balioztatzen..."
+certValidUntil = "Ziurtagiria baliozkoa: {{date}} arte"
+certInvalid = "Ziurtagiri baliogabea: {{error}}"
+certInvalidFallback = "Ziurtagiri baliogabea"
+certNetworkError = "Ezin izan da ziurtagiria balioztatu"
+title = "Konfiguratu ziurtagiria"
+
+[certSign.collab.signRequest.image]
+hint = "Igo zure sinaduraren PNG edo JPG irudia"
+
+[certSign.collab.signRequest.mode]
+move = "Mugitu sinadura"
+place = "Jarri sinadura"
+title = "Sinatu edo mugitu modua"
+
+[certSign.collab.signRequest.modeTabs]
+draw = "Marraztu"
+image = "Igo"
+text = "Idatzi"
+
+[certSign.collab.signRequest.placeSignature]
+message = "Egin klik PDFan zure sinadura jartzeko"
+title = "Jarri sinadura"
+
+[certSign.collab.signRequest.preview]
+imageAlt = "Hautatutako sinadura"
+missing = "Aurrebistarik ez"
+textFallback = "Sinadura"
+
+[certSign.collab.signRequest.saved]
+defaultCanvasLabel = "Marraztutako sinadura"
+defaultImageLabel = "Igotako sinadura"
+defaultLabel = "Sinadura"
+defaultTextLabel = "Idatzitako sinadura"
+delete = "Ezabatu sinadura"
+none = "Ez dago gordetako sinadurarik"
+
+[certSign.collab.signRequest.signatureType]
+draw = "Marraztu"
+type = "Idatzi"
+upload = "Igo"
+
+[certSign.collab.signRequest.steps]
+back = "Atzera"
+cancelPlacement = "Utzi kokapena"
+certificate = "Ziurtagiria"
+clickMultipleTimes = "Egin klik PDFan hainbat aldiz sinadurak jartzeko. Arrastatu edozein sinadura mugitzeko edo tamaina aldatzeko."
+clickToPlace = "Egin klik PDFan zure sinadura agertzea nahi duzun tokian."
+continue = "Jarraitu ziurtagiria hautatzera"
+continueToPlacement = "Jarraitu kokapenera"
+continueToReview = "Jarraitu berrikuspenera"
+createSignature = "Sortu sinadura"
+invisible = "Ikusezina"
+location = "Kokapena:"
+multipleSignatures = "{{count}} sinadura aplikatuko dira PDFari"
+oneSignature = "Sinadura 1 aplikatuko da PDFari"
+placeOnPdf = "Jarri PDFan"
+reason = "Arrazoia:"
+reviewTitle = "Berrikusi sinatu aurretik"
+signaturePlaced = "Sinadura {{page}} orrian jarri da. Posizioa doitzeko berriro klik egin edo jarraitu berrikustera."
+visible = "Ikusgai"
+visibility = "Ikusgaitasuna:"
+yourSignatures = "Zure sinadurak ({{count}})"
+
+[certSign.collab.signRequest.text]
+colorLabel = "Kolorea"
+fontLabel = "Letra-tipoa"
+fontSizeLabel = "Tamaina"
+fontSizePlaceholder = "16"
+label = "Sinadura-testua"
+modalHint = "Idatzi zure izena, eta egin klik Jarraitu botoian PDFan jartzeko."
+placeholder = "Idatzi zure izena..."
+
+[certSign.collab.participant]
+certValidating = "Ziurtagiria balioztatzen..."
+certValid = "✓ Ziurtagiria baliozkoa"
+certValidUntil = " {{date}} arte"
+certInvalid = "✗ {{error}}"
+certInvalidFallback = "Ziurtagiri baliogabea"
+certNetworkError = "Ezin izan da ziurtagiria balioztatu"
+
+[certSign.collab.addParticipants]
+add = "Gehitu {{count}} parte-hartzaile"
+back = "Atzera"
+configureSignatures = "Konfiguratu sinadura-ezarpenak"
+continue = "Jarraitu sinadura-ezarpenetara"
+reasonHelp = "Aurrez ezarri sinatzeko arrazoia parte-hartzaile hauentzat (aukerakoa; sinatzean alda dezakete)"
+reasonPlaceholder = "adib. Onarpena, Berrikuspena..."
+selectUsers = "Hautatu erabiltzaileak"
+
+[certSign.collab.sessionCreation]
+includeSummaryPage = "Sartu sinaduren laburpen orria"
+includeSummaryPageHelp = "Azkenean orri bat gehituko da sinadura metadatu guztiekin. Orri indibidualetako ziurtagiri digitalen sinadura-koadroak ezkutatuko dira (sinadura hezeei ez die eragiten)."
+
+[certSign.collab.sessionList]
+active = "Aktiboak"
+finalized = "Amaituta"
+
+[certSign.collab.signatureSettings]
+description = "Konfiguratu sinaduren itxura parte-hartzaile guztientzat"
+title = "Sinaduraren itxura"
+
+[certSign.collab.userSelector]
+inviteUsers = "Gehitu erabiltzaileak"
+loadError = "Ezin izan da erabiltzaileak kargatu"
+noTeam = "Talderik ez"
+noUsers = "Ez da beste erabiltzailerik aurkitu."
+placeholder = "Hautatu erabiltzaileak..."
+
+[certSign.mobile]
+panelActions = "Ekintzak"
+panelDocument = "Dokumentua"
+panelPeople = "Pertsonak"
+
+[certSign.sessions]
+deleted = "Saioa ezabatuta"
+fetchFailed = "Ezin izan da saioaren xehetasunak kargatu"
+finalized = "Saioa amaituta"
+loaded = "Sinatutako PDFa kargatuta"
+pdfNotReady = "PDF prest ez"
+pdfNotReadyDesc = "Sinatutako PDFa sortzen ari da. Saiatu berriro une batean."
+
+[certificateChoice.tooltip]
+header = "Ziurtagiri motak"
+
+[certificateChoice.tooltip.organization]
+bullet1 = "Sistema-administratzaileek kudeatua"
+bullet2 = "Baimendutako erabiltzaileen artean partekatua"
+bullet3 = "Enpresaren nortasuna ordezkatzen du, ez pertsonarena"
+bullet4 = "Egokiena: dokumentu ofizialak, talde-sinadurak"
+description = "Zure erakundeak emandako ziurtagiri partekatua. Enpresa-mailako sinadura-agintaritzarako erabiltzen da."
+title = "Erakundeko ziurtagiria"
+
+[certificateChoice.tooltip.personal]
+bullet1 = "Lehen erabileran automatikoki sortua"
+bullet2 = "Zure erabiltzaile-kontuari lotua"
+bullet3 = "Ezin da beste erabiltzaileekin partekatu"
+bullet4 = "Egokiena: dokumentu pertsonalak, erantzukizun indibiduala"
+description = "Zure erabiltzaile-kontuarentzat berez sortutako ziurtagiri bakarra. Sinadura indibidualetarako egokia."
+title = "Ziurtagiri pertsonala"
+
+[certificateChoice.tooltip.upload]
+bullet1 = "P12/PFX fitxategia eta pasahitza behar ditu"
+bullet2 = "Kanpoko Ziurtagiri Agintariek eman dezakete"
+bullet3 = "Fidagarritasun-maila handiagoa agiri juridikoetarako"
+bullet4 = "Egokiena: legez lotesleak diren kontratuak, kanpo-balidazioa"
+description = "Erabili zure PKCS#12 ziurtagiri-fitxategia. Ziurtagiriaren propietateen gaineko kontrol osoa ematen du."
+title = "Igo P12 pertsonalizatua"
+
 [changeCreds]
 changePassword = "Saioa hasteko kredentzial lehenetsiak erabiltzen ari zara. Mesedez, sartu pasahitz berria"
 changeUsername = "Eguneratu zure erabiltzaile-izena. Eguneratu ondoren saioa itxiko da."
@@ -3242,6 +3531,46 @@ totalSelected = "Guztira hautatuta"
 unsupported = "Ez da onartzen"
 unzip = "Deskonprimitu"
 uploadError = "Zenbait fitxategi igotzeak huts egin du."
+copyCreated = "Kopia gailu honetan gorde da."
+copyFailed = "Ezin izan da kopiarik sortu."
+leaveShare = "Kendu nire zerrendatik"
+leaveShareFailed = "Ezin izan da fitxategi partekatua kendu."
+leaveShareSuccess = "Zure partekatuen zerrendatik kendu da."
+removeBoth = "Kendu bietatik"
+removeFilePrompt = "Fitxategi hau gailu honetan eta zure zerbitzarian gordeta dago. Nondik kendu nahi duzu?"
+removeFileTitle = "Kendu fitxategia"
+removeLocalOnly = "Gailu hau bakarrik"
+removeServerFailed = "Ezin izan da fitxategia zerbitzaritik kendu."
+removeServerOnly = "Zerbitzaria bakarrik"
+removeServerOnlyPrompt = "Fitxategi hau zure zerbitzarian soilik gordeta dago. Zerbitzaritik kendu nahi duzu?"
+removeServerSuccess = "Zerbitzaritik kenduta."
+removeSharedPrompt = "Fitxategi hau zurekin partekatuta dago. Gailu honetatik edo zure partekatuen zerrendatik ken dezakezu."
+removeSharedServerOnlyBlockedPrompt = "Fitxategi hau zurekin partekatuta dago eta zerbitzarian soilik gordeta dago."
+removeSharedServerOnlyPrompt = "Fitxategi hau zurekin partekatuta dago eta zerbitzarian soilik gordeta dago. Zure zerrendatik kendu?"
+changesNotUploaded = "Aldaketak ez dira igo"
+cloudFile = "Hodeiko fitxategia"
+filterAll = "Denak"
+filterLocal = "Lokal"
+filterSharedByMe = "Nik partekatuak"
+filterSharedWithMe = "Nirekin partekatuak"
+lastSynced = "Azken sinkronizazioa"
+localOnly = "Lokal soilik"
+makeCopy = "Egin kopia bat"
+owner = "Jabea"
+ownerUnknown = "Ezezaguna"
+share = "Partekatu"
+shareSelected = "Partekatu hautatutakoak"
+sharedByYou = "Zuk partekatua"
+sharedEditNoticeBody = "Ez duzu zerbitzariko bertsio hau editatzeko baimenik. Egiten dituzun edizioak kopia lokal gisa gordeko dira."
+sharedEditNoticeConfirm = "Ulertuta"
+sharedEditNoticeTitle = "Zerbitzariko kopia irakurtzeko soilik"
+sharedWithYou = "Zurekin partekatua"
+sharing = "Partekatzea"
+storageState = "Biltegiratzea"
+synced = "Sinkronizatuta"
+updateOnServer = "Eguneratu zerbitzarian"
+uploadSelected = "Igo hautatutakoak"
+uploadToServer = "Igo zerbitzarira"
 
 [files]
 addFiles = "Gehitu fitxategiak"
@@ -3367,6 +3696,77 @@ title = "PDFak lautzeaz"
 discord = "Discord"
 issues = "GitHub"
 
+[groupSigning.tooltip]
+header = "Taldeko sinadurari buruz"
+
+[groupSigning.tooltip.finalization]
+bullet1 = "Sinadura guztiak zehaztu duzun parte-hartzaileen ordenan aplikatuko dira"
+bullet2 = "Beharrezkoa bada, sinadura partzialekin amai dezakezu"
+bullet3 = "Behin amaituta, saioa ezin da aldatu"
+description = "Parte-hartzaile guztiek sinatu dutenean (edo goiz amaitzea aukeratzen duzunean), azken sinatutako PDFa sor dezakezu."
+title = "Amaitzeko prozesua"
+
+[groupSigning.tooltip.roles]
+bullet1 = "Jabea (zu): saioa sortzen du, sinaduraren lehenetsiak konfiguratzen ditu, dokumentua amaitzen du"
+bullet2 = "Parte-hartzaileak: beren sinadura sortu, ziurtagiria aukeratu eta PDFan kokatu"
+bullet3 = "Parte-hartzaileek ezin dituzte aldatu sinaduraren ikusgaitasuna, arrazoia edo kokapen-ezarpenak"
+description = "Parte-hartzaile guztientzako sinadura-itxuraren ezarpenak zuk kontrolatzen dituzu."
+title = "Parte-hartzaileen rolak"
+
+[groupSigning.tooltip.sequential]
+bullet1 = "Lehen parte-hartzaileak sinatu behar du bigarrenak dokumentua atzitu aurretik"
+bullet2 = "Betetzen du sinadura-ordena egokia eskakizun legaletarako"
+bullet3 = "Parte-hartzaileak berrantola ditzakezu zerrendan arrastatuz"
+description = "Parte-hartzaileek zuk zehaztutako ordenan sinatzen dute dokumentua. Sinatzeko txanda dutenean jakinarazpena jasotzen dute."
+title = "Sinadura sekuentziala"
+
+[groupSigning.steps]
+back = "Atzera"
+completed = "Osatuta"
+current = "Unekoa"
+stepLabel = "{{number}}. urratsa"
+
+[groupSigning.steps.configureDefaults]
+continue = "Jarraitu berrikuspenara"
+invisible = "Sinadurak ikusezinak izango dira (metadatuak baino ez)"
+locationLabel = "Kokapena:"
+preview = "Aurrebista"
+reasonLabel = "Arrazoia:"
+title = "Konfiguratu sinadura-ezarpenak"
+visible = "Sinadurak ikusgai izango dira {{page}} orrian"
+
+[groupSigning.steps.review]
+document = "Dokumentua"
+dueDate = "Epemuga (aukerakoa)"
+dueDatePlaceholder = "Hautatu epemuga..."
+invisible = "Ikusezina (metadatuak soilik)"
+location = "Kokapena:"
+logo = "Logotipoa:"
+logoHidden = "Logotiporik ez"
+logoShown = "Stirling PDF logotipoa erakusten da"
+participants = "Parte-hartzaileak"
+reason = "Arrazoia:"
+send = "Bidali sinadura-eskaerak"
+signatureSettings = "Sinadura-ezarpenak"
+title = "Berrikusi saioaren xehetasunak"
+titleShort = "Berrikusi eta bidali"
+visibility = "Ikusgaitasuna:"
+visible = "Ikusgai {{page}} orrian"
+participantCount = "{{count}} parte-hartzailek sinatuko dute ordenean"
+
+[groupSigning.steps.selectDocument]
+continue = "Jarraitu parte-hartzaileak hautatzera"
+noFile = "Hautatu fitxategi aktiboetatik PDF bakar bat sinatze-saioa sortzeko."
+selectedFile = "Hautatutako dokumentua"
+title = "Hautatu dokumentua"
+
+[groupSigning.steps.selectParticipants]
+continue = "Jarraitu sinadura-ezarpenetara"
+count = "{{count}} parte-hartzaile hautatuta"
+label = "Hautatu parte-hartzaileak"
+placeholder = "Aukeratu parte-hartzaileak sinatzeko..."
+title = "Aukeratu parte-hartzaileak"
+
 [getPdfInfo]
 downloadJson = "Deskargatu JSON"
 downloads = "Deskargak"
@@ -4460,7 +4860,10 @@ zoomOut = "Zoom txikitu"
 
 [viewer]
 cannotPreviewFile = "Ezin da fitxategia aurreikusi"
+disableColorFilter = "Desgaitu kolore-iragazkia"
 dualPageView = "Orri biko ikuspegia"
+enableDarkFilter = "Gaitu iragazki iluna"
+enableSepiaFilter = "Gaitu sepia iragazkia"
 firstPage = "Lehen orria"
 lastPage = "Azken orria"
 nextPage = "Hurrengo orria"
@@ -4470,6 +4873,22 @@ singlePageView = "Orri bakarreko ikuspegia"
 unknownFile = "Fitxategi ezezaguna"
 zoomIn = "Zoom handitu"
 zoomOut = "Zoom txikitu"
+resetZoom = "Berrezarri zooma"
+
+[viewer.nonPdf]
+fileTypeBadge = "{{type}} fitxategia"
+convertToPdf = "Bihurtu PDFra"
+loading = "Kargatzen..."
+emptyFile = "Fitxategi hutsa"
+csvStats = "{{rows}} errenkada · {{columns}} zutabe · {{size}}"
+sortedBy = "Ordenatua: {{column}}"
+columnDefault = "{{index}}. zutabea"
+htmlPreviewWarning = "HTML aurrebista — kanpoko baliabideak agian ez dira kargatuko · {{size}}"
+htmlPreview = "HTML aurrebista"
+invalidJson = "JSON baliogabea — edukia gordinean erakusten"
+textStats = "{{lines}} lerro · {{size}}"
+lineNumbers = "Lerro-zenbakiak"
+renderMarkdown = "Errendatu Markdown"
 
 [viewer.attachments]
 title = "Eranskinak"
@@ -4531,6 +4950,7 @@ toggleAttachments = "Eranskinak erakutsi/ezkutatu"
 toggleTheme = "Gaia txandakatu"
 language = "Hizkuntza"
 toggleAnnotations = "Oharpenen ikusgarritasuna txandakatu"
+toggleLayers = "Txandakatu geruzak"
 search = "Bilatu PDF"
 panMode = "Pan modua"
 applyRedactionsFirst = "Lehenik aplikatu zentsurak"
@@ -5407,20 +5827,72 @@ title = "Inprimatu fitxategia"
 2 = "Idatzi inprimagailuaren izena"
 
 [quickAccess]
+access = "Atzipena"
+accessAddPerson = "Gehitu beste pertsona bat"
+accessBack = "Atzera"
+accessCopyLink = "Kopiatu esteka"
+accessEmail = "Helbide elektronikoa"
+accessEmailPlaceholder = "name@company.com"
+accessFileLabel = "Fitxategia"
+accessGeneral = "Atzipen orokorra"
+accessInviteTitle = "Gonbidatu pertsonak"
+accessOwner = "Jabea"
+accessPanel = "Dokumentuaren atzipena"
+accessPeople = "Atzipena duten pertsonak"
+accessRemove = "Kendu"
+accessRestricted = "Mugatua"
+accessRestrictedHint = "Atzipena duten pertsonek soilik ireki dezakete"
+accessRole = "Rola"
+accessRoleCommenter = "Iruzkingilea"
+accessRoleEditor = "Editorea"
+accessRoleViewer = "Ikuslea"
+accessSelectedFile = "Hautatutako fitxategia"
+accessSendInvite = "Bidali gonbidapena"
+accessTitle = "Dokumentuaren atzipena"
+accessYou = "Zu"
 account = "Kontua"
+activeSessions = "Saio aktiboak"
+activeTab = "Aktiboak"
 activity = "Jarduera"
 adminSettings = "Admin aukerak"
+allSessions = "Saio guztiak"
 allTools = "All Tools"
 automate = "Autom."
+back = "Atzera"
+certSign = "Ziurtagiri bidezko sinadura"
+completedSessions = "Amaitutako saioak"
+completedTab = "Amaituta"
 config = "Konfig."
+createNew = "Sortu eskaera berria"
+createSession = "Sortu sinadura-eskaera"
+dueDate = "Epemuga (aukerakoa)"
 files = "Fitx."
 help = "Laguntza"
+noActiveSessions = "Ez dago zain dauden sinadura-eskaerarik edo saio aktiborik"
+noCompletedSessions = "Ez dago amaitutako saiorik"
+noFile = "Ez da fitxategirik hautatu"
 read = "Irakurri"
 reader = "Irakurri"
+refresh = "Freskatu"
+requestSignatures = "Eskatu sinadurak"
+selectSingleFileToRequest = "Hautatu PDF fitxategi bakarra sinadurak eskatzeko"
+selectedFile = "Hautatutako fitxategia"
+selectUsers = "Hautatu sinatuko duten erabiltzaileak"
+selectUsersPlaceholder = "Aukeratu parte-hartzaileak..."
+sendingRequest = "Bidaltzen..."
 settings = "Aukerak"
 showMeAround = "Erakutsi ingurunea"
 sign = "Sinatu"
+signatureRequests = "Sinadura-eskaerak"
+signYourself = "Sinatu zeuk"
+newRequest = "Eskaera berria"
 tours = "Ibilbideak"
+wetSign = "Gehitu sinadura"
+filterMine = "Nireak"
+filterOverdue = "Epea gaindituta"
+filterSigned = "Sinatuta"
+filterDeclined = "Ukatua"
+searchDocuments = "Bilatu dokumentuak…"
 
 [quickAccess.helpMenu]
 adminTour = "Administrazio ibilaldia"
@@ -6050,11 +6522,75 @@ toolNotAvailableLocally = "Zure Stirling-PDF zerbitzaria lineaz kanpo dago eta \
 expired = "Zure saioa iraungi da. Freskatu orria eta saiatu berriro."
 refreshPage = "Freskatu orria"
 
+[sessionManagement.tooltip]
+header = "Sinatze-saioen kudeaketa"
+
+[sessionManagement.tooltip.addParticipants]
+bullet1 = "Parte-hartzaile berriak sinadura-ordenaren amaieran gehitzen dira"
+bullet2 = "Ezin dira parte-hartzaileak gehitu saioa amaitu ondoren"
+bullet3 = "Parte-hartzaile bakoitzak jakinarazpena jasotzen du bere txanda denean"
+description = "Saio aktibo batera parte-hartzaile gehiago gehi ditzakezu edozein unetan amaitu aurretik."
+title = "Parte-hartzaileak gehitzea"
+
+[sessionManagement.tooltip.finalization]
+bullet1 = "<b>Amaiera osoa</b>: Parte-hartzaile guztiek sinatu dute"
+bullet2 = "<b>Amaiera partziala</b>: Parte-hartzaile batzuek oraindik ez dute sinatu"
+bullet3 = "Sinatu gabe dauden parte-hartzaileak ez dira azken dokumentuan sartuko"
+bullet4 = "Behin amaituta, sinatutako PDFa fitxategi aktiboetan kargatu dezakezu"
+description = "Amaitzeak sinadura guztiak PDF sinatu bakarrean konbinatzen ditu. Ekintza hau ezin da desegin."
+title = "Saioaren amaiera"
+
+[sessionManagement.tooltip.participantRemoval]
+bullet1 = "Ezin dira sinatu duten parte-hartzaileak kendu"
+bullet2 = "Kendutako parte-hartzaileek ez dute gehiago jakinarazpenik jasoko"
+bullet3 = "Sinadura-ordena automatikoki doitzen da"
+description = "Parte-hartzaileak ken daitezke sinatu aurretik."
+title = "Parte-hartzaileak kentzea"
+
+[sessionManagement.tooltip.signatureOrder]
+bullet1 = "Sinadura bakoitza sekuentzialki aplikatzen da PDFari"
+bullet2 = "Beranduago sinatzen dutenek aurreko sinadurak ikus ditzakete"
+bullet3 = "Funtsezkoa da onarpen-fluxuetarako eta zaintza-kate legaletarako"
+description = "Saioa sortzean zehazten duzun ordenak zein sinatuko duen lehenik ezartzen du."
+title = "Sinadura-ordena"
+
+[signatureSettings.tooltip]
+header = "Sinaduraren itxuraren ezarpenak"
+
+[signatureSettings.tooltip.location]
+bullet1 = "Adibideak: \"New York, USA\", \"London Office\", \"Remote\""
+bullet2 = "Ez da orri-posizio bera"
+bullet3 = "Lege-eremu jakin batzuetan beharrezkoa izan daiteke"
+description = "Aukerako kokapen geografikoa non sinadura aplikatu den. Ziurtagiriaren metadatuetan gordetzen da."
+title = "Sinaduraren kokapena"
+
+[signatureSettings.tooltip.logo]
+bullet1 = "Sinaduraren eta testuaren ondoan bistaratzen da"
+bullet2 = "PNG, JPG formatuak onartzen ditu"
+bullet3 = "Itxura profesionala hobetzen du"
+description = "Gehitu enpresaren logotipoa ikusgai dauden sinadurei branding eta egiazkotasunerako."
+title = "Enpresaren logotipoa"
+
+[signatureSettings.tooltip.reason]
+bullet1 = "Adibideak: \"Onarpena\", \"Kontratu-akordioa\", \"Berrikuspena amaituta\""
+bullet2 = "PDFko sinadura-propietateetan ikusgai"
+bullet3 = "Baliagarria auditoretza-arrastoetarako eta araudia betetzeko"
+description = "Dokumentua zergatik sinatzen ari den azaltzen duen aukerako testua. Ziurtagiriaren metadatuetan gordetzen da."
+title = "Sinaduraren arrazoia"
+
+[signatureSettings.tooltip.visibility]
+bullet1 = "<b>Ikusgai</b>: Sinadura PDFan agertzen da itxura pertsonalizatuarekin"
+bullet2 = "<b>Ikusezina</b>: Ziurtagiria ikusizko markarik gabe kapsulatuta"
+bullet3 = "Sinadura ikusezinek ere baliozkotze kriptografikoa ematen dute"
+description = "Kontrolatzen du sinadura dokumentuan ikusgai den ala modu ikusezinean kapsulatuta."
+title = "Sinaduraren ikusgaitasuna"
+
 [settings.configuration]
 advanced = "Aurreratua"
 database = "Datu-basea"
 endpoints = "Endpoints"
 features = "Eginbideak"
+storageSharing = "Fitxategi biltegiratzea eta partekatzea"
 systemSettings = "Sistemaren ezarpenak"
 title = "Konfigurazioa"
 
@@ -6332,10 +6868,13 @@ title = "Hasi saioa Stirlingen"
 [setup.selfhosted]
 link = "edo konektatu autoostatutako kontu batera"
 subtitle = "Sartu zure zerbitzariaren kredentzialak"
+changeServerLocked = "Zure erakundeak aplikazio hau zerbitzari jakin batera mugatu du"
 switchToLocal = "Erabili tokiko tresnak"
 title = "Hasi saioa zerbitzarian"
 
 [setup.selfhosted.unreachable]
+changeServer = "Konektatu beste zerbitzari batera"
+changeServerLocked = "Zure erakundeak aplikazio hau zerbitzari jakin batera mugatu du"
 continueOffline = "Erabili tokiko tresnak"
 message = "Ezin izan da {{url}} atzitu. Egiaztatu zerbitzaria martxan eta atzigarri dagoela."
 retry = "Saiatu berriro"
@@ -6529,6 +7068,15 @@ saved = "Gordeta"
 text = "Testua"
 title = "Sinadura mota"
 
+[signRequest]
+declined = "Sinadura-eskaera ukatua"
+fetchFailed = "Ezin izan da sinadura-eskaera kargatu"
+signed = "Dokumentua ongi sinatu da"
+
+[signSession]
+createFailed = "Ezin izan da sinadura-eskaera sortu"
+created = "Sinadura-eskaera bidalita"
+
 [signup]
 accountCreatedSuccessfully = "Kontua ongi sortu da! Orain saioa hasi dezakezu."
 alreadyHaveAccount = "Kontua baduzu? Hasi saioa"
@@ -6807,6 +7355,106 @@ title = "Zatikatu PDF kapituluen arabera"
 [splitPdfByChapters]
 tags = "zatikatu,kapituluak,lastermarkak,antolatu"
 
+[storageShare]
+accessed = "Atzituta"
+accessDenied = "Ez duzu fitxategi partekatu honetarako atzipenik. Eskatu jabeari zurekin partekatzeko."
+accessFailed = "Ezin izan da jarduera kargatu."
+accessDeniedBody = "Ez duzu fitxategi honetarako atzipenik. Eskatu jabeari zurekin partekatzeko."
+accessDeniedTitle = "Atzipenik ez"
+accessLimitedCommenter = "Iruzkinetarako atzipena laster egongo da eskuragarri. Deskargatu behar baduzu, eskatu jabeari editore-atzipena."
+accessLimitedTitle = "Atzipen mugatua"
+accessLimitedViewer = "Esteka hau ikuspegi-soilerako da. Deskargatu behar baduzu, eskatu jabeari editore-atzipena."
+createdAt = "Sortua"
+download = "Deskargatu"
+downloadFailed = "Ezin da fitxategi hau deskargatu."
+expiredBody = "Partekatze-esteka hau baliogabea da edo iraungi da."
+expiredTitle = "Esteka iraungita"
+goToLogin = "Joan saioa-hasiera orrira"
+loadFailed = "Ezin da fitxategi partekatua ireki."
+loading = "Partekatze-esteka kargatzen..."
+loginPrompt = "Hasi saioa fitxategi partekatu honetara sartzeko."
+loginRequired = "Saioa behar da"
+openInApp = "Ireki Stirling PDF"
+ownerLabel = "Jabea"
+ownerUnknown = "Ezezaguna"
+requiresLogin = "Fitxategi partekatu honek saioa behar du."
+roleCommenter = "Iruzkingilea"
+roleEditor = "Editorea"
+roleViewer = "Ikuslea"
+shareHeading = "Fitxategi partekatua"
+titleDefault = "Fitxategi partekatua"
+tryAgain = "Saiatu berriro geroago."
+addUser = "Gehitu"
+commenterHint = "Iruzkinak laster egongo dira eskuragarri."
+copied = "Esteka arbelean kopiatu da"
+copy = "Kopiatu"
+copyFailed = "Ezin izan da kopiatu"
+description = "Sortu partekatzeko esteka fitxategi honetarako. Saioa hasita duten erabiltzaileek estekaren bidez atzi dezakete."
+downloadsCount = "Deskargak: {{count}}"
+emailWarningBody = "Honek helbide elektroniko baten itxura du. Pertsona hau Stirling PDF erabiltzailea ez bada, ezin izango du fitxategia atzitu."
+emailWarningConfirm = "Partekatu hala ere"
+emailWarningTitle = "Helbide elektronikoa"
+errorTitle = "Partekatzea huts egin du"
+failure = "Ezin izan da partekatzeko estekarik sortu. Saiatu berriro."
+fileLabel = "Fitxategia"
+generate = "Sortu esteka"
+generated = "Partekatzeko esteka sortu da"
+hideActivity = "Ezkutatu jarduera"
+invalidUsername = "Idatzi erabiltzaile-izen edo helbide elektroniko balioduna."
+lastAccessed = "Azken atzipena"
+linkAccessTitle = "Partekatzeko estekaren atzipena"
+linkLabel = "Partekatzeko esteka"
+linksDisabled = "Partekatzeko estekak desgaituta daude."
+linksDisabledBody = "Partekatzeko estekak zure zerbitzariaren ezarpenek desgaitu dituzte."
+manage = "Kudeatu partekatzea"
+manageDescription = "Sortu eta kudeatu fitxategi hau partekatzeko estekak."
+manageLoadFailed = "Ezin izan dira partekatzeko estekak kargatu."
+manageTitle = "Partekatzea kudeatu"
+noActivity = "Oraindik ez dago jarduerarik."
+noLinks = "Ez dago partekatzeko esteka aktiborik oraindik."
+noSharedUsers = "Oraindik ez du inork atzipenik."
+removeLink = "Kendu esteka"
+removeUser = "Kendu"
+revokeFailed = "Ezin izan da partekatzeko esteka kendu."
+revoked = "Partekatze-esteka kendu da"
+roleLabel = "Rola"
+sharingDisabled = "Partekatzea desgaituta dago."
+sharingDisabledBody = "Zerbitzariaren ezarpenek partekatzea desgaitu dute."
+sharedUsersTitle = "Partekatutako erabiltzaileak"
+title = "Partekatu fitxategia"
+unknownUser = "Erabiltzaile ezezaguna"
+userAddFailed = "Ezin izan da erabiltzaile horrekin partekatu."
+userAdded = "Erabiltzailea partekatutako zerrendan gehitu da."
+usernameLabel = "Erabiltzaile-izena edo helbide elektronikoa"
+usernamePlaceholder = "Sartu erabiltzaile-izen bat edo helbide elektroniko bat"
+userRemoveFailed = "Ezin izan da erabiltzaile hori kendu."
+userRemoved = "Erabiltzailea partekatutako zerrendatik kendu da."
+viewActivity = "Ikusi jarduera"
+viewed = "Ikusita"
+viewsCount = "Ikustaldiak: {{count}}"
+downloaded = "Deskargatuta"
+bulkDescription = "Sortu esteka bakarra hautatutako fitxategi guztiak saioa hasita duten erabiltzaileekin partekatzeko."
+bulkTitle = "Partekatu hautatutako fitxategiak"
+copyLink = "Kopiatu partekatze-esteka"
+fileCount = "{{count}} fitxategi hautatuta"
+ownerOnly = "Jabeak bakarrik kudea dezake partekatzea."
+selectSingleFile = "Hautatu fitxategi bakarra partekatzea kudeatzeko."
+
+[storageUpload]
+description = "Honek uneko fitxategia zerbitzariaren biltegira igotzen du zure sarbiderako."
+errorTitle = "Igoerak huts egin du"
+failure = "Igoerak huts egin du. Egiaztatu zure saio-hasiera eta biltegiratze ezarpenak."
+fileLabel = "Fitxategia"
+hint = "Esteka publikoak eta sarbide-moduak zure zerbitzariaren ezarpenek kontrolatzen dituzte."
+success = "Zerbitzarira igo da"
+title = "Igo zerbitzarira"
+updateButton = "Eguneratu zerbitzarian"
+uploadButton = "Igo zerbitzarira"
+bulkDescription = "Honek hautatutako fitxategiak zure zerbitzariaren biltegira igotzen ditu."
+bulkTitle = "Igo hautatutako fitxategiak"
+fileCount = "{{count}} fitxategi hautatuta"
+more = " +{{count}} gehiago"
+
 [storage]
 approximateSize = "Gutxi gorabeherako tamaina"
 fileTooLarge = "Fitxategia handiegia. Fitxategi bakoitzerako gehienezko tamaina da"
@@ -7153,6 +7801,30 @@ title = "Ikusi/Editatu PDF"
 [warning]
 tooltipTitle = "Abisua"
 
+[wetSignature.tooltip]
+header = "Sinadura sortzeko metodoak"
+
+[wetSignature.tooltip.draw]
+bullet1 = "Pertsonalizatu arkatzaren kolorea eta lodiera"
+bullet2 = "Garbitu eta berriz marraztu gustura geratu arte"
+bullet3 = "Ukipen-gailuetan funtzionatzen du (tabletak, telefonuak)"
+description = "Sortu eskuz idatzitako sinadura saguarekin edo ukipen-pantailarekin. Pertsonal eta egiazko sinaduretarako egokiena."
+title = "Marraztu sinadura"
+
+[wetSignature.tooltip.type]
+bullet1 = "Aukeratu letra-tipo anitzen artetik"
+bullet2 = "Pertsonalizatu testuaren tamaina eta kolorea"
+bullet3 = "Estandarizatutako sinaduretarako aproposa"
+description = "Sortu sinadura idatzitako testutik. Azkarra eta koherentea, enpresa-dokumentuetarako egokia."
+title = "Idatzi sinadura"
+
+[wetSignature.tooltip.upload]
+bullet1 = "PNG, JPG eta bestelako irudi-formatuak onartzen ditu"
+bullet2 = "Atzeko plano gardenak gomendatzen dira emaitza onenak lortzeko"
+bullet3 = "Irudia sinadura-eremura egokitzeko tamainaz aldatuko da"
+description = "Igo aldez aurretik sortutako sinadura-irudia. Ideala sinadura eskaneatua edo enpresako logotipoa baduzu."
+title = "Igo sinadura-irudia"
+
 [watermark]
 completed = "Ur‑marka gehituta"
 desc = "Gehitu testu edo irudi ur‑markak PDF fitxategiei"
@@ -7333,6 +8005,7 @@ activeSession = "Saio aktiboa"
 addMembers = "Gehitu kideak"
 admin = "Admin"
 confirmDelete = "Ziur erabiltzaile hau ezabatu nahi duzula? Ekintza hau ezin da desegin."
+confirmUnlock = "Ziur al zaude erabiltzaile-kontu hau desblokeatu nahi duzula?"
 deleteUser = "Ezabatu erabiltzailea"
 deleteUserError = "Ezin izan da erabiltzailea ezabatu"
 deleteUserSuccess = "Erabiltzailea ongi ezabatu da"
@@ -7341,6 +8014,8 @@ disable = "Desgaitu"
 disabled = "Desgaituta"
 editRole = "Rola editatu"
 enable = "Gaitu"
+locked = "blokeatuta"
+lockedBadge = "Blokeatuta"
 loading = "Pertsonak kargatzen..."
 loginRequired = "Gaitu saio-hasiera modua lehenik"
 member = "Kidea"
@@ -7350,6 +8025,9 @@ searchMembers = "Bilatu kideak..."
 status = "Egoera"
 team = "Taldea"
 title = "Pertsonak"
+unlockAccount = "Desblokeatu kontua"
+unlockUserError = "Erabiltzaile-kontua desblokeatzeak huts egin du"
+unlockUserSuccess = "Erabiltzaile-kontua arrakastaz desblokeatu da"
 user = "Erabiltzailea"
 
 [workspace.people.actions]
diff --git a/frontend/public/locales/fa-IR/translation.toml b/frontend/public/locales/fa-IR/translation.toml
index 8ddb7f9abd..8653a58a09 100644
--- a/frontend/public/locales/fa-IR/translation.toml
+++ b/frontend/public/locales/fa-IR/translation.toml
@@ -8,6 +8,7 @@ black = "سیاه"
 blue = "آبی"
 bored = "منتظر ماندن خسته‌کننده است؟"
 cancel = "انصرا�"
+confirm = "تأیید"
 changedCredsMessage = "مشخصات تغییر یا�ت!"
 chooseFile = "انتخاب �ایل"
 close = "بستن"
@@ -146,6 +147,7 @@ insufficientCredits = "اعتبار کا�ی نیست. موردنیاز: {{requi
 loadingCredits = "در حال بررسی اعتبار..."
 loadingProStatus = "در حال بررسی وضعیت اشتراک..."
 noticeTopUpOrPlan = "اعتبار کا�ی نیست، لط�اً اعتبار را شارژ کنید یا طرح خود را ارتقا دهید"
+accessInvite = "دعوت"
 
 [account]
 accountSettings = "تنظیمات حساب"
@@ -1427,6 +1429,34 @@ title = "پردازش"
 description = "حداکثر زمان انتظار برای یک کار پردازش پیش از گزارش خطا."
 label = "مهلت پردازش (ثانیه)"
 
+[admin.settings.storage]
+description = "کنترل گزینه‌های ذخیره‌سازی سرور و اشتراک‌گذاری."
+title = "ذخیره‌سازی �ایل و اشتراک‌گذاری"
+
+[admin.settings.storage.enabled]
+description = "به کاربران اجازه دهید �ایل‌ها را روی سرور ذخیره کنند."
+label = "�عال‌سازی ذخیره‌سازی �ایل روی سرور"
+
+[admin.settings.storage.sharing.email]
+description = "اجازه اشتراک‌گذاری با نشانی‌های ایمیل."
+label = "�عال‌سازی اشتراک‌گذاری ایمیلی"
+mailLink = "پیکربندی تنظیمات ایمیل"
+mailNote = "نیازمند پیکربندی ایمیل است. "
+
+[admin.settings.storage.sharing.enabled]
+description = "به کاربران اجازه دهید �ایل‌های ذخیره‌شده را به اشتراک بگذارند."
+label = "�عال‌سازی اشتراک‌گذاری"
+
+[admin.settings.storage.sharing.links]
+description = "اجازه اشتراک‌گذاری از طریق لینک‌هایی که نیاز به ورود دارند."
+frontendUrlLink = "پیکربندی در تنظیمات سیستم"
+frontendUrlNote = "نیازمند یک Frontend URL است. "
+label = "�عال‌سازی لینک‌های اشتراک"
+
+[admin.settings.storage.signing.enabled]
+description = "به کاربران اجازه دهید نشست‌های امضای چندشرکت‌کننده بسازند. نیازمند �عال بودن ذخیره‌سازی �ایل روی سرور است."
+label = "�عال‌سازی امضای گروهی (آل�ا)"
+
 [admin.settings.unsavedChanges]
 cancel = "ادامه ویرایش"
 discard = "نادیده گر�تن تغییرات"
@@ -2059,7 +2089,19 @@ numbers = "اعداد/بازه‌ها: 5, 10-20"
 progressions = "پیشروی‌ها: 3n، 4n+1"
 
 [certSign]
+allSigned = "همه شرکت‌کنندگان امضا کرده‌اند. آماده نهایی‌سازی."
+awaitingSignatures = "در انتظار امضاها"
+signatureProgress = "{{signedCount}}/{{totalCount}} امضا"
 chooseCertificate = "انتخاب �ایل گواهی"
+declined = "رد شده"
+fetchFailed = "بارگذاری داده‌های امضا نامو�ق بود"
+finalized = "نهایی شد"
+notified = "در انتظار"
+partialNote = "می‌توانید زودتر با امضاهای �علی نهایی‌سازی کنید. شرکت‌کنندگان امضانشده کنار گذاشته خواهند شد."
+pending = "در انتظار"
+readyToFinalize = "آماده نهایی‌سازی"
+signed = "امضا شد"
+viewed = "مشاهده شد"
 chooseJksFile = "انتخاب �ایل JKS"
 chooseP12File = "انتخاب �ایل PKCS12"
 choosePfxFile = "انتخاب �ایل PFX"
@@ -2082,6 +2124,7 @@ title = "امضای گواهی"
 invisible = "نامرئی"
 stepTitle = "ظاهر امضا"
 visible = "مرئی"
+visibility = "قابلیت مشاهده"
 
 [certSign.appearance.options]
 title = "جزئیات امضا"
@@ -2188,6 +2231,252 @@ bullet4 = "امکان است�اده از گواهی‌های س�ارشی بر
 text = "وقتی امضاها را بررسی می‌کنید، ابزار به شما می‌گوید آیا معتبرند، چه کسی سند را امضا کرده، چه زمانی امضا شده و اینکه آیا سند از زمان امضا تغییر کرده است یا نه."
 title = "بررسی امضاها"
 
+[certSign.collab.finalize]
+button = "نهایی‌سازی و بارگذاری PDF امضاشده"
+early = "نهایی‌سازی با امضاهای �علی"
+
+[certSign.collab.sessionDetail]
+addButton = "ا�زودن شرکت‌کنندگان"
+addParticipants = "ا�زودن شرکت‌کنندگان"
+addParticipantsError = "ا�زودن شرکت‌کنندگان نامو�ق بود"
+backToList = "بازگشت به نشست‌ها"
+deleteConfirm = "مطمئن هستید؟ این کار قابل بازگشت نیست."
+deleteError = "حذ� نشست نامو�ق بود"
+deleted = "نشست حذ� شد"
+deleteSession = "حذ� نشست"
+dueDate = "تاریخ سررسید"
+finalizeError = "نهایی‌سازی نشست نامو�ق بود"
+loadPdfError = "بارگذاری PDF امضاشده نامو�ق بود"
+loadSignedPdf = "بارگذاری PDF امضاشده در �ایل‌های �عال"
+messageLabel = "پیام"
+noAdditionalInfo = "اطلاعات اضا�ی وجود ندارد"
+owner = "مالک"
+participantRemoved = "شرکت‌کننده حذ� شد"
+participants = "شرکت‌کنندگان"
+participantsAdded = "شرکت‌کنندگان با مو�قیت ا�زوده شدند"
+removeParticipant = "حذ�"
+removeParticipantError = "حذ� شرکت‌کننده نامو�ق بود"
+selectUsers = "کاربران را انتخاب کنید..."
+sessionInfo = "اطلاعات نشست"
+workbenchTitle = "مدیریت نشست"
+
+[certSign.collab.signRequest]
+addedToFiles = "سند به �ایل‌های �عال ا�زوده شد"
+addSignature = "ا�زودن امضای شما"
+addToFiles = "ا�زودن به �ایل‌های �عال"
+advancedSettings = "تنظیمات پیشر�ته"
+backToList = "بازگشت به درخواست‌های امضا"
+certificateChoice = "یک گواهی برای امضا انتخاب کنید"
+changeSignature = "تغییر امضا"
+clearSignature = "پاک کردن امضا"
+completeAndSign = "تکمیل و امضا"
+createNewSignature = "ایجاد امضای جدید"
+declineButton = "رد"
+decline = "رد درخواست"
+deleteSelected = "حذ� امضای انتخاب‌شده"
+drawSignature = "امضای خود را در پایین رسم کنید"
+dueDate = "تاریخ سررسید"
+fileTooLarge = "اندازه �ایل باید کمتر از 5MB باشد"
+fontFamily = "خانواده �ونت"
+fontSize = "اندازه �ونت: {{size}}px"
+fontSizePlaceholder = "اندازه"
+from = "از"
+invalidCertFile = "لط�اً یک �ایل گواهی P12 یا PFX انتخاب کنید"
+invalidFileType = "لط�اً یک �ایل تصویر انتخاب کنید"
+location = "مکان (اختیاری)"
+locationPlaceholder = "از کجا امضا می‌کنید؟"
+message = "پیام"
+noCertificate = "لط�اً یک �ایل گواهی انتخاب کنید"
+noSignatures = "لط�اً حداقل یک امضا روی PDF قرار دهید"
+p12File = "�ایل گواهی P12/PFX"
+password = "گذرواژه گواهی"
+passwordPlaceholder = "گذرواژه را وارد کنید..."
+penColor = "رنگ قلم"
+penSize = "اندازه قلم: {{size}}px"
+placementActive = "برای قرار دادن روی PDF کلیک کنید"
+placeSignatureButton = "قرار دادن امضا روی PDF"
+reason = "دلیل (اختیاری)"
+reasonPlaceholder = "چرا امضا می‌کنید؟"
+removeImage = "حذ� تصویر"
+removeCertFile = "حذ� �ایل"
+savedSignatures = "امضاهای ذخیره‌شده"
+selectFile = "انتخاب �ایل تصویر"
+selectSignatureTitle = "انتخاب یا ایجاد امضا"
+signButton = "امضای سند"
+signatureInfo = "این تنظیمات توسط مالک سند پیکربندی شده است"
+signaturePlaced = "امضا روی ص�حه قرار گر�ت"
+signatureSettings = "تنظیمات امضا"
+signatureText = "متن امضا"
+signatureTextPlaceholder = "نام خود را وارد کنید..."
+signatureTypeLabel = "نوع امضا"
+signingTitle = "امضا"
+textColor = "رنگ متن"
+typeSignature = "برای ایجاد امضا نام خود را تایپ کنید"
+uploadCert = "گواهی س�ارشی"
+uploadCertDesc = "از گواهی P12/PFX خود است�اده کنید"
+uploadSignature = "بارگذاری تصویر امضای خود"
+usePersonalCert = "گواهی شخصی"
+usePersonalCertDesc = "به‌صورت خودکار برای حساب شما ایجاد می‌شود"
+useServerCert = "گواهی سازمان"
+useServerCertDesc = "گواهی مشترک سازمان"
+workbenchTitle = "درخواست امضا"
+
+[certSign.collab.signRequest.canvas]
+colorPickerTitle = "انتخاب رنگ قلم"
+continue = "ادامه"
+
+[certSign.collab.signRequest.certModal]
+description = "شما {{count}} امضا قرار داده‌اید. برای تکمیل امضا گواهی خود را انتخاب کنید."
+sign = "امضای سند"
+certValidating = "در حال اعتبارسنجی گواهی..."
+certValidUntil = "گواهی تا {{date}} معتبر است"
+certInvalid = "گواهی نامعتبر است: {{error}}"
+certInvalidFallback = "گواهی نامعتبر"
+certNetworkError = "امکان اعتبارسنجی گواهی نبود"
+title = "پیکربندی گواهی"
+
+[certSign.collab.signRequest.image]
+hint = "یک تصویر PNG یا JPG از امضای خود بارگذاری کنید"
+
+[certSign.collab.signRequest.mode]
+move = "جابه‌جایی امضا"
+place = "قرار دادن امضا"
+title = "حالت امضا یا جابه‌جایی"
+
+[certSign.collab.signRequest.modeTabs]
+draw = "رسم"
+image = "بارگذاری"
+text = "تایپ"
+
+[certSign.collab.signRequest.placeSignature]
+message = "برای قرار دادن امضا روی PDF کلیک کنید"
+title = "قرار دادن امضا"
+
+[certSign.collab.signRequest.preview]
+imageAlt = "امضای انتخاب‌شده"
+missing = "بدون پیش‌نمایش"
+textFallback = "امضا"
+
+[certSign.collab.signRequest.saved]
+defaultCanvasLabel = "امضای ترسیمی"
+defaultImageLabel = "امضای بارگذاری‌شده"
+defaultLabel = "امضا"
+defaultTextLabel = "امضای تایپی"
+delete = "حذ� امضا"
+none = "هیچ امضای ذخیره‌شده‌ای نیست"
+
+[certSign.collab.signRequest.signatureType]
+draw = "رسم"
+type = "تایپ"
+upload = "بارگذاری"
+
+[certSign.collab.signRequest.steps]
+back = "بازگشت"
+cancelPlacement = "لغو قراردهی"
+certificate = "گواهی"
+clickMultipleTimes = "برای قرار دادن چند امضا چندبار روی PDF کلیک کنید. برای جابه‌جایی یا تغییر اندازه، هر امضا را بکشید."
+clickToPlace = "روی PDF در جایی که می‌خواهید امضای شما ظاهر شود کلیک کنید."
+continue = "ادامه به انتخاب گواهی"
+continueToPlacement = "ادامه به قراردهی"
+continueToReview = "ادامه به بازبینی"
+createSignature = "ایجاد امضا"
+invisible = "نامرئی"
+location = "مکان:"
+multipleSignatures = "{{count}} امضا به PDF اعمال خواهد شد"
+oneSignature = "۱ امضا به PDF اعمال خواهد شد"
+placeOnPdf = "قرار دادن روی PDF"
+reason = "دلیل:"
+reviewTitle = "بازبینی قبل از امضا"
+signaturePlaced = "امضا در ص�حه {{page}} قرار گر�ت. می‌توانید با دوباره کلیک کردن موقعیت را تنظیم کنید یا به بازبینی ادامه دهید."
+visible = "مرئی"
+visibility = "قابلیت مشاهده:"
+yourSignatures = "امضاهای شما ({{count}})"
+
+[certSign.collab.signRequest.text]
+colorLabel = "رنگ"
+fontLabel = "�ونت"
+fontSizeLabel = "اندازه"
+fontSizePlaceholder = "16"
+label = "متن امضا"
+modalHint = "نام خود را وارد کنید و سپس برای قرار دادن روی PDF روی «ادامه» کلیک کنید."
+placeholder = "نام خود را وارد کنید..."
+
+[certSign.collab.participant]
+certValidating = "در حال اعتبارسنجی گواهی..."
+certValid = "✓ گواهی معتبر است"
+certValidUntil = " تا {{date}}"
+certInvalid = "✗ {{error}}"
+certInvalidFallback = "گواهی نامعتبر"
+certNetworkError = "امکان اعتبارسنجی گواهی نبود"
+
+[certSign.collab.addParticipants]
+add = "ا�زودن {{count}} شرکت‌کننده"
+back = "بازگشت"
+configureSignatures = "پیکربندی تنظیمات امضا"
+continue = "ادامه به تنظیمات امضا"
+reasonHelp = "برای این شرکت‌کنندگان یک دلیل امضا از پیش تعیین کنید (اختیاری؛ هنگام امضا می‌توانند آن را تغییر دهند)"
+reasonPlaceholder = "مثلاً: تأیید، بازبینی..."
+selectUsers = "انتخاب کاربران"
+
+[certSign.collab.sessionCreation]
+includeSummaryPage = "ا�زودن ص�حه خلاصه امضا"
+includeSummaryPageHelp = "یک ص�حه خلاصه در انتها با تمام �راداده‌های امضا ا�زوده می‌شود. جعبه‌های امضای گواهی دیجیتال در ص�حات جداگانه مخ�ی خواهند شد (امضاهای دستی بی‌تأثیر هستند)."
+
+[certSign.collab.sessionList]
+active = "�عال"
+finalized = "نهایی‌شده"
+
+[certSign.collab.signatureSettings]
+description = "چگونگی نمایش امضاها برای همه شرکت‌کنندگان را پیکربندی کنید"
+title = "ظاهر امضا"
+
+[certSign.collab.userSelector]
+inviteUsers = "ا�زودن کاربران"
+loadError = "بارگذاری کاربران نامو�ق بود"
+noTeam = "بدون تیم"
+noUsers = "کاربر دیگری یا�ت نشد."
+placeholder = "کاربران را انتخاب کنید..."
+
+[certSign.mobile]
+panelActions = "اقدامات"
+panelDocument = "سند"
+panelPeople = "ا�راد"
+
+[certSign.sessions]
+deleted = "نشست حذ� شد"
+fetchFailed = "بارگذاری جزئیات نشست نامو�ق بود"
+finalized = "نشست نهایی شد"
+loaded = "PDF امضاشده بارگذاری شد"
+pdfNotReady = "PDF آماده نیست"
+pdfNotReadyDesc = "PDF امضاشده در حال تولید است. لط�اً لحظه‌ای دیگر دوباره تلاش کنید."
+
+[certificateChoice.tooltip]
+header = "انواع گواهی"
+
+[certificateChoice.tooltip.organization]
+bullet1 = "مدیریت‌شده توسط مدیران سیستم"
+bullet2 = "مشترک بین کاربران مجاز"
+bullet3 = "نمایانگر هویت شرکت، نه �رد"
+bullet4 = "مناسب برای: اسناد رسمی، امضاهای تیمی"
+description = "یک گواهی مشترک که توسط سازمان شما ارائه می‌شود. برای اختیار امضای سراسری شرکت است�اده می‌شود."
+title = "گواهی سازمان"
+
+[certificateChoice.tooltip.personal]
+bullet1 = "در اولین است�اده به‌طور خودکار ایجاد می‌شود"
+bullet2 = "به حساب کاربری شما متصل است"
+bullet3 = "قابل اشتراک با دیگر کاربران نیست"
+bullet4 = "مناسب برای: اسناد شخصی، پاسخ‌گویی �ردی"
+description = "یک گواهی منحصربه‌�رد که به‌طور خودکار برای حساب کاربری شما ایجاد می‌شود. مناسب برای امضاهای �ردی."
+title = "گواهی شخصی"
+
+[certificateChoice.tooltip.upload]
+bullet1 = "نیازمند �ایل و گذرواژه P12/PFX"
+bullet2 = "می‌تواند توسط مراجع صدور گواهی خارجی صادر شود"
+bullet3 = "سطح اعتماد بالاتر برای اسناد حقوقی"
+bullet4 = "مناسب برای: قراردادهای الزام‌آور قانونی، اعتبارسنجی خارجی"
+description = "از �ایل گواهی PKCS#12 خود است�اده کنید. کنترل کامل روی ویژگی‌های گواهی را �راهم می‌کند."
+title = "بارگذاری P12 س�ارشی"
+
 [changeCreds]
 changePassword = "شما از مشخصات پیش‌�رض ورود است�اده می‌کنید. لط�اً یک رمز عبور جدید وارد کنید"
 changeUsername = "نام کاربری خود را به‌روزرسانی کنید. پس از به‌روزرسانی از حساب خارج خواهید شد."
@@ -3242,6 +3531,46 @@ totalSelected = "مجموع انتخاب‌شده"
 unsupported = "پشتیبانی‌نشده"
 unzip = "استخراج"
 uploadError = "بارگذاری برخی �ایل‌ها نامو�ق بود."
+copyCreated = "رونوشت در این دستگاه ذخیره شد."
+copyFailed = "امکان ایجاد رونوشت نبود."
+leaveShare = "حذ� از �هرست من"
+leaveShareFailed = "امکان حذ� �ایل مشترک نبود."
+leaveShareSuccess = "از �هرست اشتراکی شما حذ� شد."
+removeBoth = "حذ� از هر دو"
+removeFilePrompt = "این �ایل در این دستگاه و روی سرور شما ذخیره شده است. مایلید آن را از کجا حذ� کنید؟"
+removeFileTitle = "حذ� �ایل"
+removeLocalOnly = "�قط این دستگاه"
+removeServerFailed = "امکان حذ� �ایل از سرور نبود."
+removeServerOnly = "�قط سرور"
+removeServerOnlyPrompt = "این �ایل �قط روی سرور شما ذخیره شده است. مایلید آن را از سرور حذ� کنید؟"
+removeServerSuccess = "از سرور حذ� شد."
+removeSharedPrompt = "این �ایل با شما به اشتراک گذاشته شده است. می‌توانید آن را از این دستگاه یا از �هرست اشتراکی خود حذ� کنید."
+removeSharedServerOnlyBlockedPrompt = "این �ایل با شما به اشتراک گذاشته شده و �قط روی سرور ذخیره شده است."
+removeSharedServerOnlyPrompt = "این �ایل با شما به اشتراک گذاشته شده و �قط روی سرور ذخیره شده است. آن را از �هرست خود حذ� می‌کنید؟"
+changesNotUploaded = "تغییرات بارگذاری نشده‌اند"
+cloudFile = "�ایل ابری"
+filterAll = "همه"
+filterLocal = "محلی"
+filterSharedByMe = "اشتراک‌گذاری‌شده توسط من"
+filterSharedWithMe = "اشتراک‌گذاری‌شده با من"
+lastSynced = "آخرین همگام‌سازی"
+localOnly = "�قط محلی"
+makeCopy = "ایجاد رونوشت"
+owner = "مالک"
+ownerUnknown = "نامشخص"
+share = "اشتراک‌گذاری"
+shareSelected = "اشتراک‌گذاری موارد انتخاب‌شده"
+sharedByYou = "اشتراک‌گذاری‌شده توسط شما"
+sharedEditNoticeBody = "شما حق ویرایش نسخه سروری این �ایل را ندارید. هر ویرایشی انجام دهید به‌صورت یک نسخه محلی ذخیره خواهد شد."
+sharedEditNoticeConfirm = "متوجه شدم"
+sharedEditNoticeTitle = "نسخه �قط‌خواندنی روی سرور"
+sharedWithYou = "با شما به اشتراک گذاشته شده"
+sharing = "اشتراک‌گذاری"
+storageState = "ذخیره‌سازی"
+synced = "همگام شد"
+updateOnServer = "به‌روزرسانی روی سرور"
+uploadSelected = "بارگذاری موارد انتخاب‌شده"
+uploadToServer = "بارگذاری روی سرور"
 
 [files]
 addFiles = "ا�زودن �ایل‌ها"
@@ -3367,6 +3696,77 @@ title = "درباره تخت‌سازی PDFها"
 discord = "Discord"
 issues = "GitHub"
 
+[groupSigning.tooltip]
+header = "درباره امضای گروهی"
+
+[groupSigning.tooltip.finalization]
+bullet1 = "تمام امضاها به‌ترتیبی که مشخص کرده‌اید اعمال می‌شوند"
+bullet2 = "در صورت نیاز می‌توانید با امضاهای ناقص نهایی‌سازی کنید"
+bullet3 = "پس از نهایی‌سازی، نشست قابل تغییر نیست"
+description = "پس از اینکه همه شرکت‌کنندگان امضا کردند (یا اگر تصمیم بگیرید زودتر نهایی‌سازی کنید)، می‌توانید PDF نهایی امضاشده را تولید کنید."
+title = "�رآیند نهایی‌سازی"
+
+[groupSigning.tooltip.roles]
+bullet1 = "مالک (شما): ایجاد نشست، پیکربندی پیش‌�رض‌های امضا، نهایی‌سازی سند"
+bullet2 = "شرکت‌کنندگان: ایجاد امضای خود، انتخاب گواهی، قرار دادن روی PDF"
+bullet3 = "شرکت‌کنندگان نمی‌توانند تنظیمات قابلیت مشاهده، دلیل یا مکان امضا را تغییر دهند"
+description = "شما تنظیمات ظاهر امضا را برای همه شرکت‌کنندگان کنترل می‌کنید."
+title = "نقش‌های شرکت‌کنندگان"
+
+[groupSigning.tooltip.sequential]
+bullet1 = "شرکت‌کننده اول باید امضا کند تا ن�ر دوم به سند دسترسی یابد"
+bullet2 = "ترتیب صحیح امضا برای انطباق حقوقی را تضمین می‌کند"
+bullet3 = "می‌توانید با کشیدن در �هرست، ترتیب شرکت‌کنندگان را تغییر دهید"
+description = "شرکت‌کنندگان به ترتیبی که مشخص می‌کنید اسناد را امضا می‌کنند. هر امضاکننده هنگامی که نوبتش شود اعلان دریا�ت می‌کند."
+title = "امضای ترتیبی"
+
+[groupSigning.steps]
+back = "بازگشت"
+completed = "تکمیل شد"
+current = "جاری"
+stepLabel = "گام {{number}}"
+
+[groupSigning.steps.configureDefaults]
+continue = "ادامه به بازبینی"
+invisible = "امضاها نامرئی خواهند بود (�قط �راداده)"
+locationLabel = "مکان:"
+preview = "پیش‌نمایش"
+reasonLabel = "دلیل:"
+title = "پیکربندی تنظیمات امضا"
+visible = "امضاها روی ص�حه {{page}} مرئی خواهند بود"
+
+[groupSigning.steps.review]
+document = "سند"
+dueDate = "تاریخ سررسید (اختیاری)"
+dueDatePlaceholder = "تاریخ سررسید را انتخاب کنید..."
+invisible = "نامرئی (�قط �راداده)"
+location = "مکان:"
+logo = "لوگو:"
+logoHidden = "بدون لوگو"
+logoShown = "لوگوی Stirling PDF نمایش داده می‌شود"
+participants = "شرکت‌کنندگان"
+reason = "دلیل:"
+send = "ارسال درخواست‌های امضا"
+signatureSettings = "تنظیمات امضا"
+title = "بازبینی جزئیات نشست"
+titleShort = "بازبینی و ارسال"
+visibility = "قابلیت مشاهده:"
+visible = "روی ص�حه {{page}} مرئی"
+participantCount = "{{count}} شرکت‌کننده به ترتیب امضا خواهند کرد"
+
+[groupSigning.steps.selectDocument]
+continue = "ادامه به انتخاب شرکت‌کنندگان"
+noFile = "لط�اً برای ایجاد یک نشست امضا یک �ایل PDF واحد از �ایل‌های �عال خود انتخاب کنید."
+selectedFile = "سند انتخاب‌شده"
+title = "انتخاب سند"
+
+[groupSigning.steps.selectParticipants]
+continue = "ادامه به تنظیمات امضا"
+count = "{{count}} شرکت‌کننده انتخاب شد"
+label = "انتخاب شرکت‌کنندگان"
+placeholder = "شرکت‌کنندگان را برای امضا انتخاب کنید..."
+title = "انتخاب شرکت‌کنندگان"
+
 [getPdfInfo]
 downloadJson = "دانلود JSON"
 downloads = "دانلودها"
@@ -4460,7 +4860,10 @@ zoomOut = "کوچک‌نمایی"
 
 [viewer]
 cannotPreviewFile = "امکان پیش‌نمایش �ایل نیست"
+disableColorFilter = "غیر�عال کردن �یلتر رنگ"
 dualPageView = "نمای دوص�حه‌ای"
+enableDarkFilter = "�عال‌سازی �یلتر تیره"
+enableSepiaFilter = "�عال‌سازی �یلتر سپیا"
 firstPage = "ص�حه نخست"
 lastPage = "ص�حه آخر"
 nextPage = "ص�حه بعد"
@@ -4470,6 +4873,22 @@ singlePageView = "نمای تک‌ص�حه‌ای"
 unknownFile = "�ایل ناشناخته"
 zoomIn = "بزرگ‌نمایی"
 zoomOut = "کوچک‌نمایی"
+resetZoom = "بازنشانی زوم"
+
+[viewer.nonPdf]
+fileTypeBadge = "�ایل {{type}}"
+convertToPdf = "تبدیل به PDF"
+loading = "در حال بارگذاری..."
+emptyFile = "�ایل خالی"
+csvStats = "{{rows}} ردی� · {{columns}} ستون · {{size}}"
+sortedBy = "مرتب‌شده بر اساس: {{column}}"
+columnDefault = "ستون {{index}}"
+htmlPreviewWarning = "پیش‌نمایش HTML — ممکن است منابع خارجی بارگذاری نشوند · {{size}}"
+htmlPreview = "پیش‌نمایش HTML"
+invalidJson = "JSON نامعتبر — محتوای خام نمایش داده می‌شود"
+textStats = "{{lines}} خط · {{size}}"
+lineNumbers = "شماره خطوط"
+renderMarkdown = "رندر Markdown"
 
 [viewer.attachments]
 title = "پیوست‌ها"
@@ -4531,6 +4950,7 @@ toggleAttachments = "نمایش/پنهان‌کردن پیوست‌ها"
 toggleTheme = "تغییر تم"
 language = "زبان"
 toggleAnnotations = "تغییر وضعیت نمایش حاشیه‌نویسی‌ها"
+toggleLayers = "تغییر وضعیت لایه‌ها"
 search = "جستجوی PDF"
 panMode = "حالت پیمایش"
 applyRedactionsFirst = "ابتدا سانسورها را اعمال کنید"
@@ -5407,20 +5827,72 @@ title = "چاپ �ایل"
 2 = "نام چاپگر را وارد کنید"
 
 [quickAccess]
+access = "دسترسی"
+accessAddPerson = "ا�زودن یک ن�ر دیگر"
+accessBack = "بازگشت"
+accessCopyLink = "کپی لینک"
+accessEmail = "نشانی ایمیل"
+accessEmailPlaceholder = "name@company.com"
+accessFileLabel = "�ایل"
+accessGeneral = "دسترسی عمومی"
+accessInviteTitle = "دعوت ا�راد"
+accessOwner = "مالک"
+accessPanel = "دسترسی به سند"
+accessPeople = "ا�رادی که دسترسی دارند"
+accessRemove = "حذ�"
+accessRestricted = "محدود"
+accessRestrictedHint = "�قط ا�رادی که دسترسی دارند می‌توانند باز کنند"
+accessRole = "نقش"
+accessRoleCommenter = "نظردهنده"
+accessRoleEditor = "ویرایشگر"
+accessRoleViewer = "بیننده"
+accessSelectedFile = "�ایل انتخاب‌شده"
+accessSendInvite = "ارسال دعوت"
+accessTitle = "دسترسی به سند"
+accessYou = "شما"
 account = "حساب"
+activeSessions = "نشست‌های �عال"
+activeTab = "�عال"
 activity = "�عالیت"
 adminSettings = "تنظیمات مدیر"
+allSessions = "همه نشست‌ها"
 allTools = "All Tools"
 automate = "اتوماسیون"
+back = "بازگشت"
+certSign = "امضای با گواهی"
+completedSessions = "نشست‌های تکمیل‌شده"
+completedTab = "تکمیل‌شده"
 config = "پیکربندی"
+createNew = "ایجاد درخواست جدید"
+createSession = "ایجاد درخواست امضا"
+dueDate = "تاریخ سررسید (اختیاری)"
 files = "�ایل‌ها"
 help = "راهنما"
+noActiveSessions = "هیچ درخواست امضای در انتظار یا نشست �عالی نیست"
+noCompletedSessions = "هیچ نشستی تکمیل نشده است"
+noFile = "هیچ �ایلی انتخاب نشده است"
 read = "خواندن"
 reader = "نمایشگر"
+refresh = "تازه‌سازی"
+requestSignatures = "درخواست امضاها"
+selectSingleFileToRequest = "برای درخواست امضاها یک �ایل PDF واحد انتخاب کنید"
+selectedFile = "�ایل انتخاب‌شده"
+selectUsers = "کاربران را برای امضا انتخاب کنید"
+selectUsersPlaceholder = "شرکت‌کنندگان را انتخاب کنید..."
+sendingRequest = "در حال ارسال..."
 settings = "تنظیمات"
 showMeAround = "راهنمایی‌ام کن"
 sign = "امضا"
+signatureRequests = "درخواست‌های امضا"
+signYourself = "خودتان امضا کنید"
+newRequest = "درخواست جدید"
 tours = "تورها"
+wetSign = "ا�زودن امضای دستی"
+filterMine = "مال من"
+filterOverdue = "گذشته از موعد"
+filterSigned = "امضاشده"
+filterDeclined = "رد شده"
+searchDocuments = "جستجوی اسناد…"
 
 [quickAccess.helpMenu]
 adminTour = "تور مدیریت"
@@ -6050,11 +6522,75 @@ toolNotAvailableLocally = "سرور Stirling-PDF شما آ�لاین است و \
 expired = "نشست شما به پایان رسیده است. لط�اً ص�حه را تازه‌سازی کرده و دوباره تلاش کنید."
 refreshPage = "تازه‌سازی ص�حه"
 
+[sessionManagement.tooltip]
+header = "مدیریت نشست‌های امضا"
+
+[sessionManagement.tooltip.addParticipants]
+bullet1 = "شرکت‌کنندگان جدید به انتهای ترتیب امضا اضا�ه می‌شوند"
+bullet2 = "پس از نهایی‌سازی نشست، نمی‌توان شرکت‌کننده اضا�ه کرد"
+bullet3 = "هر شرکت‌کننده وقتی نوبتش شود اعلان دریا�ت می‌کند"
+description = "می‌توانید هر زمان پیش از نهایی‌سازی، شرکت‌کنندگان بیشتری به یک نشست �عال اضا�ه کنید."
+title = "ا�زودن شرکت‌کنندگان"
+
+[sessionManagement.tooltip.finalization]
+bullet1 = "<b>نهایی‌سازی کامل</b>: همه شرکت‌کنندگان امضا کرده‌اند"
+bullet2 = "<b>نهایی‌سازی جزئی</b>: برخی شرکت‌کنندگان هنوز امضا نکرده‌اند"
+bullet3 = "شرکت‌کنندگان امضانشده از سند نهایی حذ� می‌شوند"
+bullet4 = "پس از نهایی‌سازی، می‌توانید PDF امضاشده را در �ایل‌های �عال بارگذاری کنید"
+description = "نهایی‌سازی، همه امضاها را در یک PDF امضاشده واحد ترکیب می‌کند. این اقدام قابل بازگشت نیست."
+title = "نهایی‌سازی نشست"
+
+[sessionManagement.tooltip.participantRemoval]
+bullet1 = "نمی‌توان شرکت‌کنندگانی را که قبلاً امضا کرده‌اند حذ� کرد"
+bullet2 = "شرکت‌کنندگان حذ�‌شده دیگر اعلان دریا�ت نخواهند کرد"
+bullet3 = "ترتیب امضا به‌صورت خودکار تنظیم می‌شود"
+description = "پیش از امضا می‌توان شرکت‌کنندگان را از نشست‌ها حذ� کرد."
+title = "حذ� شرکت‌کنندگان"
+
+[sessionManagement.tooltip.signatureOrder]
+bullet1 = "هر امضا به‌صورت ترتیبی روی PDF اعمال می‌شود"
+bullet2 = "امضاکنندگان بعدی می‌توانند امضاهای قبلی را ببینند"
+bullet3 = "برای �رایندهای تأیید و زنجیره‌های ح�ظ و انتقال قانونی حیاتی است"
+description = "ترتیبی که هنگام ایجاد نشست مشخص می‌کنید، تعیین می‌کند چه کسی ابتدا امضا کند."
+title = "ترتیب امضا"
+
+[signatureSettings.tooltip]
+header = "تنظیمات ظاهر امضا"
+
+[signatureSettings.tooltip.location]
+bullet1 = "نمونه‌ها: \"New York, USA\"، \"London Office\"، \"Remote\""
+bullet2 = "با موقعیت ص�حه یکسان نیست"
+bullet3 = "ممکن است برای برخی حوزه‌های قضایی لازم باشد"
+description = "مکان جغرا�یایی اختیاری که امضا در آن اعمال شده است. در �راداده گواهی ذخیره می‌شود."
+title = "مکان امضا"
+
+[signatureSettings.tooltip.logo]
+bullet1 = "در کنار امضا و متن نمایش داده می‌شود"
+bullet2 = "از �رمت‌های PNG، JPG پشتیبانی می‌کند"
+bullet3 = "ظاهر حر�ه‌ای را ارتقا می‌دهد"
+description = "برای برندسازی و اصالت، یک لوگوی شرکت به امضاهای مرئی اضا�ه کنید."
+title = "لوگوی شرکت"
+
+[signatureSettings.tooltip.reason]
+bullet1 = "نمونه‌ها: \"Approval\"، \"Contract Agreement\"، \"Review Complete\""
+bullet2 = "در ویژگی‌های امضای PDF قابل مشاهده است"
+bullet3 = "برای مسیرهای ممیزی و انطباق م�ید است"
+description = "متن اختیاری که توضیح می‌دهد چرا سند امضا می‌شود. در �راداده گواهی ذخیره می‌شود."
+title = "دلیل امضا"
+
+[signatureSettings.tooltip.visibility]
+bullet1 = "<b>مرئی</b>: امضا با ظاهر س�ارشی روی PDF نمایش داده می‌شود"
+bullet2 = "<b>نامرئی</b>: گواهی بدون نشانه بصری جاسازی می‌شود"
+bullet3 = "امضاهای نامرئی همچنان اعتبارسنجی رمزنگاری‌شده �راهم می‌کنند"
+description = "کنترل می‌کند امضا روی سند مرئی باشد یا نامرئی جاسازی شود."
+title = "قابلیت مشاهده امضا"
+
 [settings.configuration]
 advanced = "پیشر�ته"
 database = "پایگاه داده"
 endpoints = "نقاط پایانی"
 features = "قابلیت‌ها"
+storageSharing = "ذخیره‌سازی �ایل و اشتراک‌گذاری"
 systemSettings = "تنظیمات سیستم"
 title = "پیکربندی"
 
@@ -6332,10 +6868,13 @@ title = "ورود به Stirling"
 [setup.selfhosted]
 link = "یا به یک حساب خودمیزبان متصل شوید"
 subtitle = "اطلاعات کاربری سرور خود را وارد کنید"
+changeServerLocked = "سازمان شما این برنامه را به یک سرور مشخص محدود کرده است"
 switchToLocal = "است�اده از ابزارهای محلی به‌جای آن"
 title = "ورود به سرور"
 
 [setup.selfhosted.unreachable]
+changeServer = "اتصال به سرور دیگر"
+changeServerLocked = "سازمان شما این برنامه را به یک سرور مشخص محدود کرده است"
 continueOffline = "است�اده از ابزارهای محلی به‌جای آن"
 message = "امکان دسترسی به {{url}} نبود. بررسی کنید سرور در حال اجرا و قابل دسترسی باشد."
 retry = "تلاش مجدد"
@@ -6529,6 +7068,15 @@ saved = "ذخیره‌شده"
 text = "متن"
 title = "نوع امضا"
 
+[signRequest]
+declined = "درخواست امضا رد شد"
+fetchFailed = "بارگذاری درخواست امضا نامو�ق بود"
+signed = "سند با مو�قیت امضا شد"
+
+[signSession]
+createFailed = "ایجاد درخواست امضا نامو�ق بود"
+created = "درخواست امضا ارسال شد"
+
 [signup]
 accountCreatedSuccessfully = "حساب با مو�قیت ایجاد شد! اکنون می‌توانید وارد شوید."
 alreadyHaveAccount = "از قبل حساب دارید؟ وارد شوید"
@@ -6807,6 +7355,106 @@ title = "تقسیم PDF بر اساس �صل‌ها"
 [splitPdfByChapters]
 tags = "تقسیم، �صل‌ها، نشانه‌گذاری، سازماندهی"
 
+[storageShare]
+accessed = "دسترسی انجام شد"
+accessDenied = "شما به این �ایل مشترک دسترسی ندارید. از مالک بخواهید آن را با شما به اشتراک بگذارد."
+accessFailed = "امکان بارگذاری �عالیت نبود."
+accessDeniedBody = "شما به این �ایل دسترسی ندارید. از مالک بخواهید آن را با شما به اشتراک بگذارد."
+accessDeniedTitle = "بدون دسترسی"
+accessLimitedCommenter = "دسترسی نظر دادن به‌زودی اضا�ه می‌شود. اگر نیاز به دانلود دارید از مالک دسترسی ویرایشگر بخواهید."
+accessLimitedTitle = "دسترسی محدود"
+accessLimitedViewer = "این لینک �قط قابل مشاهده است. اگر نیاز به دانلود دارید از مالک دسترسی ویرایشگر بخواهید."
+createdAt = "ایجاد شد"
+download = "دانلود"
+downloadFailed = "امکان دانلود این �ایل نبود."
+expiredBody = "این لینک اشتراک نامعتبر است یا منقضی شده."
+expiredTitle = "لینک منقضی شده است"
+goToLogin = "ر�تن به ورود"
+loadFailed = "امکان باز کردن �ایل مشترک نبود."
+loading = "در حال بارگذاری لینک اشتراک..."
+loginPrompt = "برای دسترسی به این �ایل مشترک وارد شوید."
+loginRequired = "ورود لازم است"
+openInApp = "باز کردن در Stirling PDF"
+ownerLabel = "مالک"
+ownerUnknown = "نامشخص"
+requiresLogin = "این �ایل مشترک نیاز به ورود دارد."
+roleCommenter = "نظردهنده"
+roleEditor = "ویرایشگر"
+roleViewer = "بیننده"
+shareHeading = "�ایل اشتراک‌گذاری‌شده"
+titleDefault = "�ایل اشتراک‌گذاری‌شده"
+tryAgain = "لط�اً بعداً دوباره تلاش کنید."
+addUser = "ا�زودن"
+commenterHint = "امکان نظر دادن به‌زودی �راهم می‌شود."
+copied = "لینک در کلیپ‌بورد کپی شد"
+copy = "کپی"
+copyFailed = "کپی نامو�ق بود"
+description = "برای این �ایل یک لینک اشتراک بسازید. کاربران واردشده با داشتن لینک می‌توانند به آن دسترسی داشته باشند."
+downloadsCount = "دانلودها: {{count}}"
+emailWarningBody = "به نظر می‌رسد این یک نشانی ایمیل است. اگر این �رد کاربر Stirling PDF نباشد، به �ایل دسترسی نخواهد داشت."
+emailWarningConfirm = "با این حال به اشتراک بگذار"
+emailWarningTitle = "نشانی ایمیل"
+errorTitle = "اشتراک نامو�ق بود"
+failure = "امکان ایجاد لینک اشتراک نبود. لط�اً دوباره تلاش کنید."
+fileLabel = "�ایل"
+generate = "تولید لینک"
+generated = "لینک اشتراک تولید شد"
+hideActivity = "پنهان کردن �عالیت"
+invalidUsername = "یک نام کاربری یا نشانی ایمیل معتبر وارد کنید."
+lastAccessed = "آخرین دسترسی"
+linkAccessTitle = "دسترسی لینک اشتراک"
+linkLabel = "لینک اشتراک"
+linksDisabled = "لینک‌های اشتراک غیر�عال هستند."
+linksDisabledBody = "لینک‌های اشتراک توسط تنظیمات سرور شما غیر�عال شده‌اند."
+manage = "مدیریت اشتراک‌گذاری"
+manageDescription = "ایجاد و مدیریت لینک‌های اشتراک این �ایل."
+manageLoadFailed = "امکان بارگذاری لینک‌های اشتراک نبود."
+manageTitle = "مدیریت اشتراک‌گذاری"
+noActivity = "هنوز هیچ �عالیتی نیست."
+noLinks = "هنوز لینک اشتراکی �عالی نیست."
+noSharedUsers = "هنوز هیچ کاربری دسترسی ندارد."
+removeLink = "حذ� لینک"
+removeUser = "حذ�"
+revokeFailed = "امکان حذ� لینک اشتراک نبود."
+revoked = "لینک اشتراک حذ� شد"
+roleLabel = "نقش"
+sharingDisabled = "اشتراک‌گذاری غیر�عال است."
+sharingDisabledBody = "اشتراک‌گذاری توسط تنظیمات سرور شما غیر�عال شده است."
+sharedUsersTitle = "کاربران� دارای دسترسی"
+title = "اشتراک‌گذاری �ایل"
+unknownUser = "کاربر ناشناخته"
+userAddFailed = "اشتراک‌گذاری با آن کاربر ممکن نیست."
+userAdded = "کاربر به �هرست اشتراک ا�زوده شد."
+usernameLabel = "نام کاربری یا ایمیل"
+usernamePlaceholder = "نام کاربری یا ایمیل را وارد کنید"
+userRemoveFailed = "حذ� آن کاربر ممکن نیست."
+userRemoved = "کاربر از �هرست اشتراک حذ� شد."
+viewActivity = "مشاهده �عالیت"
+viewed = "مشاهده‌شده"
+viewsCount = "بازدیدها: {{count}}"
+downloaded = "دانلود‌شده"
+bulkDescription = "یک لینک برای اشتراک همه �ایل‌های انتخاب‌شده با کاربران� واردشده بسازید."
+bulkTitle = "اشتراک‌گذاری �ایل‌های انتخاب‌شده"
+copyLink = "کپی لینک اشتراک"
+fileCount = "{{count}} �ایل انتخاب‌شده"
+ownerOnly = "�قط مالک می‌تواند اشتراک‌گذاری را مدیریت کند."
+selectSingleFile = "برای مدیریت اشتراک‌گذاری، تنها یک �ایل را انتخاب کنید."
+
+[storageUpload]
+description = "این کار �ایل �علی را برای دسترسی خودتان در �ضای ذخیره‌سازی سرور بارگذاری می‌کند."
+errorTitle = "بارگذاری نامو�ق بود"
+failure = "بارگذاری نامو�ق بود. لط�اً ورود و تنظیمات ذخیره‌سازی خود را بررسی کنید."
+fileLabel = "�ایل"
+hint = "لینک‌های عمومی و حالت‌های دسترسی توسط تنظیمات سرور شما کنترل می‌شوند."
+success = "روی سرور بارگذاری شد"
+title = "بارگذاری در سرور"
+updateButton = "به‌روزرسانی روی سرور"
+uploadButton = "بارگذاری در سرور"
+bulkDescription = "این کار �ایل‌های انتخاب‌شده را در �ضای ذخیره‌سازی سرور شما بارگذاری می‌کند."
+bulkTitle = "بارگذاری �ایل‌های انتخاب‌شده"
+fileCount = "{{count}} �ایل انتخاب‌شده"
+more = " +{{count}} مورد دیگر"
+
 [storage]
 approximateSize = "حجم تقریبی"
 fileTooLarge = "�ایل خیلی بزرگ است. حداکثر اندازه هر �ایل برابر است با"
@@ -7153,6 +7801,30 @@ title = "نمایش/ویرایش PDF"
 [warning]
 tooltipTitle = "هشدار"
 
+[wetSignature.tooltip]
+header = "روش‌های ایجاد امضا"
+
+[wetSignature.tooltip.draw]
+bullet1 = "س�ارشی‌سازی رنگ و ضخامت قلم"
+bullet2 = "پاک کنید و تا رسیدن به نتیجه مطلوب دوباره رسم کنید"
+bullet3 = "روی دستگاه‌های لمسی (تبلت‌ها، گوشی‌ها) کار می‌کند"
+description = "با است�اده از ماوس یا ص�حه‌نمایش لمسی یک امضای دست‌نویس بسازید. بهترین گزینه برای امضاهای شخصی و اصیل."
+title = "رسم امضا"
+
+[wetSignature.tooltip.type]
+bullet1 = "انتخاب از میان چندین �ونت"
+bullet2 = "س�ارشی‌سازی اندازه و رنگ متن"
+bullet3 = "مناسب برای امضاهای استاندارد"
+description = "از متن تایپ‌شده امضا تولید کنید. سریع و یکنواخت، مناسب اسناد تجاری."
+title = "تایپ امضا"
+
+[wetSignature.tooltip.upload]
+bullet1 = "از PNG، JPG و سایر �رمت‌های تصویری پشتیبانی می‌کند"
+bullet2 = "برای بهترین نتیجه پس‌زمینه‌های ش�ا� توصیه می‌شود"
+bullet3 = "تصویر برای تناسب با ناحیه امضا تغییر اندازه می‌یابد"
+description = "یک تصویر امضای ازپیش‌ساخته را بارگذاری کنید. ایده‌آل اگر امضای اسکن‌شده یا نشان شرکت دارید."
+title = "بارگذاری تصویر امضا"
+
 [watermark]
 completed = "واترمارک ا�زوده شد"
 desc = "ا�زودن واترمارک متنی یا تصویری به �ایل‌های PDF"
@@ -7333,6 +8005,7 @@ activeSession = "نشست �عال"
 addMembers = "ا�زودن اعضا"
 admin = "مدیر"
 confirmDelete = "مطمئنید می‌خواهید این کاربر را حذ� کنید؟ این اقدام غیرقابل بازگشت است."
+confirmUnlock = "آیا مطمئن هستید می‌خواهید ق�ل این حساب کاربری را باز کنید؟"
 deleteUser = "حذ� کاربر"
 deleteUserError = "حذ� کاربر نامو�ق بود"
 deleteUserSuccess = "کاربر با مو�قیت حذ� شد"
@@ -7341,6 +8014,8 @@ disable = "غیر�عال‌سازی"
 disabled = "غیر�عال"
 editRole = "ویرایش نقش"
 enable = "�عال‌سازی"
+locked = "ق�ل‌شده"
+lockedBadge = "ق�ل‌شده"
 loading = "در حال بارگذاری ا�راد..."
 loginRequired = "ابتدا حالت لاگین را �عال کنید"
 member = "عضو"
@@ -7350,6 +8025,9 @@ searchMembers = "جستجوی اعضا..."
 status = "وضعیت"
 team = "تیم"
 title = "ا�راد"
+unlockAccount = "باز کردن ق�ل حساب"
+unlockUserError = "باز کردن ق�ل حساب کاربری نامو�ق بود"
+unlockUserSuccess = "ق�ل حساب کاربری با مو�قیت باز شد"
 user = "کاربر"
 
 [workspace.people.actions]
diff --git a/frontend/public/locales/fr-FR/translation.toml b/frontend/public/locales/fr-FR/translation.toml
index c30c621ea2..0f612d6fd5 100644
--- a/frontend/public/locales/fr-FR/translation.toml
+++ b/frontend/public/locales/fr-FR/translation.toml
@@ -8,6 +8,7 @@ black = "Noir"
 blue = "Bleu"
 bored = "Marre d'attendre ?"
 cancel = "Annuler"
+confirm = "Confirmer"
 changedCredsMessage = "Les identifiants ont été mis à jour !"
 chooseFile = "Choisir un fichier"
 close = "Fermer"
@@ -146,6 +147,7 @@ insufficientCredits = "Insufficient credits. Required: {{requiredCredits}}, Avai
 loadingCredits = "Checking credits..."
 loadingProStatus = "Checking subscription status..."
 noticeTopUpOrPlan = "Not enough credits, please top up or upgrade to a plan"
+accessInvite = "Inviter"
 
 [account]
 accountSettings = "Paramètres du compte"
@@ -1427,6 +1429,34 @@ title = "Traitement"
 description = "Temps d’attente maximal d’un job de traitement avant de signaler une erreur."
 label = "Délai de traitement (secondes)"
 
+[admin.settings.storage]
+description = "Contrôler les options de stockage et de partage du serveur."
+title = "Stockage et partage de fichiers"
+
+[admin.settings.storage.enabled]
+description = "Autoriser les utilisateurs à stocker des fichiers sur le serveur."
+label = "Activer le stockage de fichiers sur le serveur"
+
+[admin.settings.storage.sharing.email]
+description = "Autoriser le partage avec des adresses e-mail."
+label = "Activer le partage par e-mail"
+mailLink = "Configurer les paramètres de messagerie"
+mailNote = "Nécessite une configuration de messagerie. "
+
+[admin.settings.storage.sharing.enabled]
+description = "Autoriser les utilisateurs à partager les fichiers stockés."
+label = "Activer le partage"
+
+[admin.settings.storage.sharing.links]
+description = "Autoriser le partage via des liens nécessitant une connexion."
+frontendUrlLink = "Configurer dans les paramètres système"
+frontendUrlNote = "Nécessite une Frontend URL. "
+label = "Activer les liens de partage"
+
+[admin.settings.storage.signing.enabled]
+description = "Autoriser les utilisateurs à créer des sessions de signature multi-participants. Nécessite l’activation du stockage de fichiers sur le serveur."
+label = "Activer la signature de groupe (Alpha)"
+
 [admin.settings.unsavedChanges]
 cancel = "Continuer l’édition"
 discard = "Ignorer les modifications"
@@ -1517,7 +1547,7 @@ editStampHint = "Pour changer l’image, supprimez ce tampon et ajoutez-en un no
 editSwitchToSelect = "Basculez sur Sélectionner et modifier pour modifier cette annotation."
 editText = "Modifier la zone de texte"
 editTextMarkup = "Modifier le marquage de texte"
-annotationStyle = "Annotation style"
+annotationStyle = "Style d'annotation"
 ellipse = "Ellipse"
 exit = "Quitter le mode d’annotation"
 fillColor = "Couleur de remplissage"
@@ -1528,19 +1558,19 @@ highlight = "Surligner"
 imagePreview = "Aperçu"
 inkHighlighter = "Surligneur à main levée"
 line = "Ligne"
-lineArrow = "Arrow"
+lineArrow = "Flèche"
 noBackground = "Sans arrière-plan"
 note = "Note"
-comment = "Comment"
-comments = "Comments"
-insertText = "Insert Text"
-replaceText = "Replace Text"
+comment = "Commentaire"
+comments = "Commentaires"
+insertText = "Insérer du texte"
+replaceText = "Remplacer le texte"
 noteIcon = "Icône de note"
 notesStamps = "Notes et tampons"
 opacity = "Opacité"
 pen = "Stylo"
 polygon = "Polygone"
-polyline = "Polyline"
+polyline = "Ligne brisée"
 properties = "Propriétés"
 rectangle = "Rectangle"
 redo = "Rétablir"
@@ -2059,7 +2089,19 @@ numbers = "Nombres/plages : 5, 10-20"
 progressions = "Progressions : 3n, 4n+1"
 
 [certSign]
+allSigned = "Tous les participants ont signé. Prêt à finaliser."
+awaitingSignatures = "En attente de signatures"
+signatureProgress = "{{signedCount}}/{{totalCount}} signatures"
 chooseCertificate = "Choisir le fichier de certificat"
+declined = "Refusé"
+fetchFailed = "Échec du chargement des données de signature"
+finalized = "Finalisé"
+notified = "En attente"
+partialNote = "Vous pouvez finaliser plus tôt avec les signatures actuelles. Les participants non signataires seront exclus."
+pending = "En attente"
+readyToFinalize = "Prêt à finaliser"
+signed = "Signé"
+viewed = "Vu"
 chooseJksFile = "Choisir le fichier JKS"
 chooseP12File = "Choisir le fichier PKCS12"
 choosePfxFile = "Choisir le fichier PFX"
@@ -2082,6 +2124,7 @@ title = "Signer avec un certificat"
 invisible = "Invisible"
 stepTitle = "Apparence de la signature"
 visible = "Visible"
+visibility = "Visibilité"
 
 [certSign.appearance.options]
 title = "Détails de la signature"
@@ -2188,6 +2231,252 @@ bullet4 = "Peut utiliser des certificats personnalisés pour la vérification"
 text = "Lors de la vérification des signatures, l’outil indique si elles sont valides, qui a signé le document, quand il a été signé et s’il a été modifié depuis."
 title = "Vérification des signatures"
 
+[certSign.collab.finalize]
+button = "Finaliser et charger le PDF signé"
+early = "Finaliser avec les signatures actuelles"
+
+[certSign.collab.sessionDetail]
+addButton = "Ajouter des participants"
+addParticipants = "Ajouter des participants"
+addParticipantsError = "Échec de l’ajout des participants"
+backToList = "Retour aux sessions"
+deleteConfirm = "Êtes-vous sûr ? Cette action est irréversible."
+deleteError = "Échec de la suppression de la session"
+deleted = "Session supprimée"
+deleteSession = "Supprimer la session"
+dueDate = "Date d’échéance"
+finalizeError = "Échec de la finalisation de la session"
+loadPdfError = "Échec du chargement du PDF signé"
+loadSignedPdf = "Charger le PDF signé dans les fichiers actifs"
+messageLabel = "Message"
+noAdditionalInfo = "Aucune information supplémentaire"
+owner = "Propriétaire"
+participantRemoved = "Participant supprimé"
+participants = "Participants"
+participantsAdded = "Participants ajoutés avec succès"
+removeParticipant = "Supprimer"
+removeParticipantError = "Échec de la suppression du participant"
+selectUsers = "Sélectionner des utilisateurs…"
+sessionInfo = "Infos de la session"
+workbenchTitle = "Gestion des sessions"
+
+[certSign.collab.signRequest]
+addedToFiles = "Document ajouté aux fichiers actifs"
+addSignature = "Ajouter votre signature"
+addToFiles = "Ajouter aux fichiers actifs"
+advancedSettings = "Paramètres avancés"
+backToList = "Retour aux demandes de signature"
+certificateChoice = "Sélectionnez un certificat pour signer"
+changeSignature = "Modifier la signature"
+clearSignature = "Effacer la signature"
+completeAndSign = "Terminer et signer"
+createNewSignature = "Créer une nouvelle signature"
+declineButton = "Refuser"
+decline = "Refuser la demande"
+deleteSelected = "Supprimer la signature sélectionnée"
+drawSignature = "Dessinez votre signature ci-dessous"
+dueDate = "Date d’échéance"
+fileTooLarge = "La taille du fichier doit être inférieure à 5 Mo"
+fontFamily = "Famille de police"
+fontSize = "Taille de police : {{size}}px"
+fontSizePlaceholder = "Taille"
+from = "De"
+invalidCertFile = "Veuillez sélectionner un fichier de certificat P12 ou PFX"
+invalidFileType = "Veuillez sélectionner un fichier image"
+location = "Emplacement (facultatif)"
+locationPlaceholder = "D’où signez-vous ?"
+message = "Message"
+noCertificate = "Veuillez sélectionner un fichier de certificat"
+noSignatures = "Veuillez placer au moins une signature sur le PDF"
+p12File = "Fichier de certificat P12/PFX"
+password = "Mot de passe du certificat"
+passwordPlaceholder = "Saisissez le mot de passe…"
+penColor = "Couleur du trait"
+penSize = "Taille du trait : {{size}}px"
+placementActive = "Cliquez sur le PDF pour placer"
+placeSignatureButton = "Placer la signature sur le PDF"
+reason = "Raison (facultatif)"
+reasonPlaceholder = "Pourquoi signez-vous ?"
+removeImage = "Supprimer l’image"
+removeCertFile = "Supprimer le fichier"
+savedSignatures = "Signatures enregistrées"
+selectFile = "Sélectionner un fichier image"
+selectSignatureTitle = "Sélectionner ou créer une signature"
+signButton = "Signer le document"
+signatureInfo = "Ces paramètres sont configurés par le propriétaire du document"
+signaturePlaced = "Signature placée sur la page"
+signatureSettings = "Paramètres de signature"
+signatureText = "Texte de la signature"
+signatureTextPlaceholder = "Saisissez votre nom…"
+signatureTypeLabel = "Type de signature"
+signingTitle = "Signature"
+textColor = "Couleur du texte"
+typeSignature = "Saisissez votre nom pour créer une signature"
+uploadCert = "Certificat personnalisé"
+uploadCertDesc = "Utilisez votre propre certificat P12/PFX"
+uploadSignature = "Téléverser l’image de votre signature"
+usePersonalCert = "Certificat personnel"
+usePersonalCertDesc = "Généré automatiquement pour votre compte"
+useServerCert = "Certificat d’organisation"
+useServerCertDesc = "Certificat d’organisation partagé"
+workbenchTitle = "Demande de signature"
+
+[certSign.collab.signRequest.canvas]
+colorPickerTitle = "Choisir la couleur du trait"
+continue = "Continuer"
+
+[certSign.collab.signRequest.certModal]
+description = "Vous avez placé {{count}} signature(s). Choisissez votre certificat pour terminer la signature."
+sign = "Signer le document"
+certValidating = "Validation du certificat…"
+certValidUntil = "Certificat valide jusqu’au {{date}}"
+certInvalid = "Certificat invalide : {{error}}"
+certInvalidFallback = "Certificat invalide"
+certNetworkError = "Impossible de valider le certificat"
+title = "Configurer le certificat"
+
+[certSign.collab.signRequest.image]
+hint = "Téléversez une image PNG ou JPG de votre signature"
+
+[certSign.collab.signRequest.mode]
+move = "Déplacer la signature"
+place = "Placer la signature"
+title = "Mode signature ou déplacement"
+
+[certSign.collab.signRequest.modeTabs]
+draw = "Dessiner"
+image = "Téléverser"
+text = "Saisir"
+
+[certSign.collab.signRequest.placeSignature]
+message = "Cliquez sur le PDF pour placer votre signature"
+title = "Placer la signature"
+
+[certSign.collab.signRequest.preview]
+imageAlt = "Signature sélectionnée"
+missing = "Aucun aperçu"
+textFallback = "Signature"
+
+[certSign.collab.signRequest.saved]
+defaultCanvasLabel = "Signature dessinée"
+defaultImageLabel = "Signature téléversée"
+defaultLabel = "Signature"
+defaultTextLabel = "Signature saisie"
+delete = "Supprimer la signature"
+none = "Aucune signature enregistrée"
+
+[certSign.collab.signRequest.signatureType]
+draw = "Dessiner"
+type = "Saisir"
+upload = "Téléverser"
+
+[certSign.collab.signRequest.steps]
+back = "Retour"
+cancelPlacement = "Annuler le placement"
+certificate = "Certificat"
+clickMultipleTimes = "Cliquez plusieurs fois sur le PDF pour placer des signatures. Faites glisser une signature pour la déplacer ou la redimensionner."
+clickToPlace = "Cliquez sur le PDF à l’endroit où vous souhaitez que votre signature apparaisse."
+continue = "Continuer vers la sélection du certificat"
+continueToPlacement = "Continuer vers le placement"
+continueToReview = "Continuer vers la vérification"
+createSignature = "Créer une signature"
+invisible = "Invisible"
+location = "Emplacement :"
+multipleSignatures = "{{count}} signatures seront appliquées au PDF"
+oneSignature = "1 signature sera appliquée au PDF"
+placeOnPdf = "Placer sur le PDF"
+reason = "Raison :"
+reviewTitle = "Vérifier avant de signer"
+signaturePlaced = "Signature placée sur la page {{page}}. Vous pouvez ajuster la position en recliquant ou continuer vers la vérification."
+visible = "Visible"
+visibility = "Visibilité :"
+yourSignatures = "Vos signatures ({{count}})"
+
+[certSign.collab.signRequest.text]
+colorLabel = "Couleur"
+fontLabel = "Police"
+fontSizeLabel = "Taille"
+fontSizePlaceholder = "16"
+label = "Texte de la signature"
+modalHint = "Saisissez votre nom, puis cliquez sur Continuer pour le placer sur le PDF."
+placeholder = "Saisissez votre nom…"
+
+[certSign.collab.participant]
+certValidating = "Validation du certificat…"
+certValid = "✓ Certificat valide"
+certValidUntil = " jusqu’au {{date}}"
+certInvalid = "✗ {{error}}"
+certInvalidFallback = "Certificat invalide"
+certNetworkError = "Impossible de valider le certificat"
+
+[certSign.collab.addParticipants]
+add = "Ajouter {{count}} participant(s)"
+back = "Retour"
+configureSignatures = "Configurer les paramètres de signature"
+continue = "Continuer vers les paramètres de signature"
+reasonHelp = "Préconfigurer une raison de signature pour ces participants (optionnel, ils peuvent la modifier lors de la signature)"
+reasonPlaceholder = "ex. : Approbation, Vérification…"
+selectUsers = "Sélectionner des utilisateurs"
+
+[certSign.collab.sessionCreation]
+includeSummaryPage = "Inclure une page de synthèse des signatures"
+includeSummaryPageHelp = "Une page récapitulative sera ajoutée à la fin avec toutes les métadonnées de signature. Les cadres de signature du certificat numérique sur les pages individuelles seront supprimés (les signatures manuscrites ne sont pas affectées)."
+
+[certSign.collab.sessionList]
+active = "Actives"
+finalized = "Finalisées"
+
+[certSign.collab.signatureSettings]
+description = "Configurer l’apparence des signatures pour tous les participants"
+title = "Apparence des signatures"
+
+[certSign.collab.userSelector]
+inviteUsers = "Ajouter des utilisateurs"
+loadError = "Échec du chargement des utilisateurs"
+noTeam = "Pas d’équipe"
+noUsers = "Aucun autre utilisateur trouvé."
+placeholder = "Sélectionner des utilisateurs…"
+
+[certSign.mobile]
+panelActions = "Actions"
+panelDocument = "Document"
+panelPeople = "Personnes"
+
+[certSign.sessions]
+deleted = "Session supprimée"
+fetchFailed = "Échec du chargement des détails de la session"
+finalized = "Session finalisée"
+loaded = "PDF signé chargé"
+pdfNotReady = "PDF non prêt"
+pdfNotReadyDesc = "Le PDF signé est en cours de génération. Veuillez réessayer dans un instant."
+
+[certificateChoice.tooltip]
+header = "Types de certificats"
+
+[certificateChoice.tooltip.organization]
+bullet1 = "Géré par les administrateurs système"
+bullet2 = "Partagé entre les utilisateurs autorisés"
+bullet3 = "Représente l’identité de l’entreprise, pas celle d’un individu"
+bullet4 = "Idéal pour : documents officiels, signatures d’équipe"
+description = "Un certificat partagé fourni par votre organisation. Utilisé pour l’autorité de signature à l’échelle de l’entreprise."
+title = "Certificat d’organisation"
+
+[certificateChoice.tooltip.personal]
+bullet1 = "Généré automatiquement lors de la première utilisation"
+bullet2 = "Lié à votre compte utilisateur"
+bullet3 = "Ne peut pas être partagé avec d’autres utilisateurs"
+bullet4 = "Idéal pour : documents personnels, responsabilité individuelle"
+description = "Un certificat généré automatiquement et propre à votre compte utilisateur. Adapté aux signatures individuelles."
+title = "Certificat personnel"
+
+[certificateChoice.tooltip.upload]
+bullet1 = "Nécessite un fichier P12/PFX et un mot de passe"
+bullet2 = "Peut être délivré par des autorités de certification externes"
+bullet3 = "Niveau de confiance supérieur pour les documents juridiques"
+bullet4 = "Idéal pour : contrats juridiquement contraignants, validation externe"
+description = "Utilisez votre propre fichier de certificat PKCS#12. Offre un contrôle total des propriétés du certificat."
+title = "Téléverser un P12 personnalisé"
+
 [changeCreds]
 changePassword = "Vous utilisez les identifiants de connexion par défaut. Veuillez saisir un nouveau mot de passe"
 changeUsername = "Mettre à jour votre nom d’utilisateur. Vous serez déconnecté après la mise à jour."
@@ -2644,7 +2933,7 @@ upgradeButton = "Mettre à niveau le compte"
 [config.apiKeys]
 chartAriaLabel = "Utilisation des crédits : inclus {{includedUsed}} sur {{includedTotal}}, achetés {{purchasedUsed}} sur {{purchasedTotal}}"
 copyKeyAriaLabel = "Copier la clé API"
-creditsRemaining = "Credits Remaining"
+creditsRemaining = "Crédits restant"
 description = "Votre clé API pour accéder à la suite d’outils PDF de Stirling. Copiez-la dans votre projet ou actualisez pour en générer une nouvelle."
 docsDescription = "En savoir plus sur l’intégration avec Stirling PDF :"
 docsLink = "Documentation API"
@@ -2695,12 +2984,12 @@ security = "Configuration de sécurité"
 system = "Configuration système"
 
 [connectionMode.status]
-localOffline = "Offline mode running"
-localOnline = "Offline mode running"
-saas = "Connected to Stirling Cloud"
-selfhostedChecking = "Connected to self-hosted server (checking...)"
-selfhostedOffline = "Self-hosted server unreachable"
-selfhostedOnline = "Connected to self-hosted server"
+localOffline = "Mode offline"
+localOnline = "Mode offline"
+saas = "Connecté au Cloud Stirling"
+selfhostedChecking = "Connection en cours à un serveur auto-hébergé"
+selfhostedOffline = "Serveur auto-hébergé inaccessible"
+selfhostedOnline = "Connecté à un serveur auto-hébergé"
 
 [convert]
 autoRotate = "Rotation automatique"
@@ -3242,6 +3531,46 @@ totalSelected = "Total sélectionné"
 unsupported = "Non pris en charge"
 unzip = "Décompresser"
 uploadError = "Échec du téléversement de certains fichiers."
+copyCreated = "Copie enregistrée sur cet appareil."
+copyFailed = "Impossible de créer une copie."
+leaveShare = "Retirer de ma liste"
+leaveShareFailed = "Impossible de retirer le fichier partagé."
+leaveShareSuccess = "Retiré de votre liste de partages."
+removeBoth = "Supprimer des deux"
+removeFilePrompt = "Ce fichier est enregistré sur cet appareil et sur votre serveur. D’où souhaitez-vous le supprimer ?"
+removeFileTitle = "Supprimer le fichier"
+removeLocalOnly = "Cet appareil uniquement"
+removeServerFailed = "Impossible de supprimer le fichier du serveur."
+removeServerOnly = "Serveur uniquement"
+removeServerOnlyPrompt = "Ce fichier est stocké uniquement sur votre serveur. Souhaitez-vous le supprimer du serveur ?"
+removeServerSuccess = "Supprimé du serveur."
+removeSharedPrompt = "Ce fichier est partagé avec vous. Vous pouvez le retirer de cet appareil ou de votre liste de partages."
+removeSharedServerOnlyBlockedPrompt = "Ce fichier est partagé avec vous et stocké uniquement sur le serveur."
+removeSharedServerOnlyPrompt = "Ce fichier est partagé avec vous et stocké uniquement sur le serveur. Le retirer de votre liste ?"
+changesNotUploaded = "Modifications non téléversées"
+cloudFile = "Fichier cloud"
+filterAll = "Tous"
+filterLocal = "Local"
+filterSharedByMe = "Partagé par moi"
+filterSharedWithMe = "Partagé avec moi"
+lastSynced = "Dernière synchronisation"
+localOnly = "Local uniquement"
+makeCopy = "Faire une copie"
+owner = "Propriétaire"
+ownerUnknown = "Inconnu"
+share = "Partager"
+shareSelected = "Partager la sélection"
+sharedByYou = "Partagé par vous"
+sharedEditNoticeBody = "Vous n’avez pas de droits d’édition sur la version serveur de ce fichier. Toute modification sera enregistrée comme copie locale."
+sharedEditNoticeConfirm = "Compris"
+sharedEditNoticeTitle = "Copie serveur en lecture seule"
+sharedWithYou = "Partagé avec vous"
+sharing = "Partage"
+storageState = "Stockage"
+synced = "Synchronisé"
+updateOnServer = "Mettre à jour sur le serveur"
+uploadSelected = "Téléverser la sélection"
+uploadToServer = "Téléverser sur le serveur"
 
 [files]
 addFiles = "Ajouter des fichiers"
@@ -3367,6 +3696,77 @@ title = "À propos de l’aplatissement des PDF"
 discord = "Discord"
 issues = "GitHub"
 
+[groupSigning.tooltip]
+header = "À propos de la signature de groupe"
+
+[groupSigning.tooltip.finalization]
+bullet1 = "Toutes les signatures sont appliquées dans l’ordre des participants que vous avez défini"
+bullet2 = "Vous pouvez finaliser avec des signatures partielles si nécessaire"
+bullet3 = "Une fois finalisée, la session ne peut plus être modifiée"
+description = "Une fois que tous les participants ont signé (ou si vous choisissez de finaliser plus tôt), vous pouvez générer le PDF final signé."
+title = "Processus de finalisation"
+
+[groupSigning.tooltip.roles]
+bullet1 = "Propriétaire (vous) : crée la session, configure les paramètres par défaut des signatures, finalise le document"
+bullet2 = "Participants : créent leur signature, choisissent le certificat, la placent sur le PDF"
+bullet3 = "Les participants ne peuvent pas modifier la visibilité, la raison ou l’emplacement de la signature"
+description = "Vous contrôlez les paramètres d’apparence des signatures pour tous les participants."
+title = "Rôles des participants"
+
+[groupSigning.tooltip.sequential]
+bullet1 = "Le premier participant doit signer avant que le second puisse accéder au document"
+bullet2 = "Garantit un ordre de signature conforme aux exigences légales"
+bullet3 = "Vous pouvez réorganiser les participants en les faisant glisser dans la liste"
+description = "Les participants signent les documents dans l’ordre que vous spécifiez. Chaque signataire reçoit une notification quand c’est son tour."
+title = "Signature séquentielle"
+
+[groupSigning.steps]
+back = "Retour"
+completed = "Terminé"
+current = "En cours"
+stepLabel = "Étape {{number}}"
+
+[groupSigning.steps.configureDefaults]
+continue = "Continuer vers la vérification"
+invisible = "Les signatures seront invisibles (métadonnées uniquement)"
+locationLabel = "Emplacement :"
+preview = "Aperçu"
+reasonLabel = "Raison :"
+title = "Configurer les paramètres de signature"
+visible = "Les signatures seront visibles à la page {{page}}"
+
+[groupSigning.steps.review]
+document = "Document"
+dueDate = "Date d’échéance (optionnelle)"
+dueDatePlaceholder = "Sélectionner une date d’échéance…"
+invisible = "Invisible (métadonnées uniquement)"
+location = "Emplacement :"
+logo = "Logo :"
+logoHidden = "Pas de logo"
+logoShown = "Logo Stirling PDF affiché"
+participants = "Participants"
+reason = "Raison :"
+send = "Envoyer les demandes de signature"
+signatureSettings = "Paramètres de signature"
+title = "Vérifier les détails de la session"
+titleShort = "Vérifier et envoyer"
+visibility = "Visibilité :"
+visible = "Visible à la page {{page}}"
+participantCount = "{{count}} participant(s) signeront dans l’ordre"
+
+[groupSigning.steps.selectDocument]
+continue = "Continuer vers la sélection des participants"
+noFile = "Veuillez sélectionner un seul fichier PDF parmi vos fichiers actifs pour créer une session de signature."
+selectedFile = "Document sélectionné"
+title = "Sélectionner un document"
+
+[groupSigning.steps.selectParticipants]
+continue = "Continuer vers les paramètres de signature"
+count = "{{count}} participant(s) sélectionné(s)"
+label = "Sélectionner des participants"
+placeholder = "Choisissez des participants pour signer…"
+title = "Choisir des participants"
+
 [getPdfInfo]
 downloadJson = "Télécharger le JSON"
 downloads = "Téléchargements"
@@ -3926,7 +4326,7 @@ version = "Version"
 accountCreatedSuccess = "Compte créé avec succès ! Vous pouvez maintenant vous connecter."
 alreadyLoggedIn = "Vous êtes déjà connecté sur"
 alreadyLoggedIn2 = "appareils. Veuillez vous déconnecter des appareils et réessayer."
-backToSignIn = "Back to sign in"
+backToSignIn = "Retour à la connexion"
 cancel = "Annuler"
 changePasswordWarning = "Veuillez changer votre mot de passe après votre première connexion"
 credentialsUpdated = "Vos identifiants ont été mis à jour. Veuillez vous reconnecter."
@@ -3973,16 +4373,16 @@ pleaseEnterBoth = "Veuillez saisir l’e-mail et le mot de passe"
 pleaseEnterEmail = "Veuillez saisir votre adresse e-mail"
 relyingPartyRegistrationNotFound = "Aucun enregistrement de partie de confiance trouvé"
 rememberme = "Se souvenir de moi"
-resetHelp = "Enter your email to receive a secure link to reset your password. If the link has expired, please request a new one."
-resetYourPassword = "Reset your password"
+resetHelp = "Saisissez votre email pour recevoir un lien de réinitialisation de votre mot de passe. Si le lien a expiré, veuillez en demander un nouveau."
+resetYourPassword = "Réinitialisation de mot de passe"
 saml2RequiresLicense = "La connexion SAML nécessite une licence payante (Server ou Enterprise). Veuillez contacter l’administrateur pour mettre à niveau votre plan."
 sending = "Envoi…"
 sendMagicLink = "Envoyer le lien magique"
-sendResetLink = "Send reset link"
+sendResetLink = "Envoyer le lien de réinitialisation"
 sessionExpired = "Votre session a expiré. Veuillez vous reconnecter."
 signin = "Connexion"
 signInAnonymously = "S’inscrire en tant qu’invité"
-subtitle = "Sign back in to Stirling PDF"
+subtitle = "Se reconnecter à Stirling PDF"
 signingIn = "Connexion en cours…"
 signinTitle = "Veuillez vous connecter"
 signInWith = "Se connecter avec"
@@ -3991,7 +4391,7 @@ ssoSignIn = "Se connecter via l'authentification unique"
 title = "Connexion"
 toManySessions = "Vous avez trop de sessions actives."
 unexpectedError = "Erreur inattendue : {{message}}"
-updatePassword = "Update password"
+updatePassword = "Mise à jour du mot de passe"
 useEmailInstead = "Se connecter avec l’e‑mail"
 useMagicLink = "Utiliser plutôt le lien magique"
 userIsDisabled = "L'utilisateur est désactivé, la connexion est actuellement bloquée avec ce nom d'utilisateur. Veuillez contacter l'administrateur."
@@ -4302,13 +4702,13 @@ workbench = "Voici le <strong>Workbench</strong> - la zone principale où vous v
 wrapUp = "Tout est prêt ! Vous avez appris les principales zones de l’application et comment les utiliser. Cliquez sur le bouton <strong>Aide</strong> quand vous le souhaitez pour revoir cette visite."
 
 [onboarding.freeTrial]
-afterTrialWithoutPayment = "After your trial ends, you'll continue with our free tier. Add a payment method to keep Pro access."
-afterTrialWithPayment = "Your Pro subscription will start automatically when the trial ends."
-body = "You have full access to Stirling PDF Pro features during your trial. Enjoy unlimited conversions, larger file sizes, and priority processing."
-daysRemaining = "{{days}} days remaining"
-daysRemainingSingular = "{{days}} day remaining"
-title = "Your 30-Day Pro Trial"
-trialEnds = "Trial ends {{date}}"
+afterTrialWithoutPayment = "À la fin de la période d'essai, vous basculerez en mode gratuit. Ajoutez une méthode de paiement pour garder l'accès Pro."
+afterTrialWithPayment = "Votre abonnement Pro commencera immédiatement à la fin de la période d'essai."
+body = "Vous avez accès à toutes les fonctionnalité Pro de Stirling PDF pendant la période d'essai. Profitez de conversion ilimitées, de tailles de fichier plus importantes et de la priorité des tâches."
+daysRemaining = "{{days}} jours restants"
+daysRemainingSingular = "{{days}} jour restant"
+title = "Votre période d'essai Pro de 30 jours"
+trialEnds = "La période d'essai fini le {{date}}"
 
 [onboarding.buttons]
 back = "Retour"
@@ -4460,7 +4860,10 @@ zoomOut = "Zoom arrière"
 
 [viewer]
 cannotPreviewFile = "Impossible d’afficher un aperçu du fichier"
+disableColorFilter = "Désactiver le filtre de couleur"
 dualPageView = "Vue double page"
+enableDarkFilter = "Activer le filtre sombre"
+enableSepiaFilter = "Activer le filtre sépia"
 firstPage = "Première page"
 lastPage = "Dernière page"
 nextPage = "Page suivante"
@@ -4470,6 +4873,22 @@ singlePageView = "Vue page unique"
 unknownFile = "Fichier inconnu"
 zoomIn = "Zoom avant"
 zoomOut = "Zoom arrière"
+resetZoom = "Réinitialiser le zoom"
+
+[viewer.nonPdf]
+fileTypeBadge = "Fichier {{type}}"
+convertToPdf = "Convertir en PDF"
+loading = "Chargement…"
+emptyFile = "Fichier vide"
+csvStats = "{{rows}} lignes · {{columns}} colonnes · {{size}}"
+sortedBy = "Trié par : {{column}}"
+columnDefault = "Colonne {{index}}"
+htmlPreviewWarning = "Aperçu HTML — les ressources externes peuvent ne pas se charger · {{size}}"
+htmlPreview = "Aperçu HTML"
+invalidJson = "JSON invalide — affichage du contenu brut"
+textStats = "{{lines}} lignes · {{size}}"
+lineNumbers = "Numéros de ligne"
+renderMarkdown = "Afficher le markdown"
 
 [viewer.attachments]
 title = "Pièces jointes"
@@ -4481,29 +4900,29 @@ empty = "Aucune pièce jointe dans ce document"
 noMatch = "Aucune pièce jointe ne correspond à votre recherche"
 
 [viewer.comments]
-title = "Comments"
-hint = "Place comments with the Comment, Insert Text, or Replace Text tools. They will appear here by page."
-placeholder = "Type your comment..."
+title = "Commentaires"
+hint = "Commentez avec Commentaire, Insérer du texte ou remplacer le texte. Vos commentaires apparaîtrons ici par page."
+placeholder = "Saisissez votre commentaire..."
 pageLabel = "Page {{page}}"
-oneComment = "1 comment"
-nComments = "{{count}} comments"
-addCommentPlaceholder = "Add comment..."
-addLink = "Add link"
-goToLink = "Go to link"
-addComment = "Add comment"
-viewComment = "View comment"
-addReplyPlaceholder = "Add reply..."
-saveReply = "Save reply"
-send = "Send"
-moreActions = "More actions"
-typeComment = "Comment"
-typeInsertText = "Insert Text"
-typeReplaceText = "Replace Text"
-locateAnnotation = "Locate in document"
-deleteTitle = "Remove annotation from comments?"
-deleteDescription = "This annotation has a comment attached. You can remove just the comment from the sidebar while keeping the annotation, or delete everything."
-removeCommentOnly = "Remove comment only"
-deleteAnnotationAndComment = "Delete annotation & comment"
+oneComment = "1 commentaire"
+nComments = "{{count}} commentaires"
+addCommentPlaceholder = "Ajouter un commentaire..."
+addLink = "Ajouter un lien"
+goToLink = "Suivre le lien"
+addComment = "Ajouter un commentaire"
+viewComment = "Voir le commentaire"
+addReplyPlaceholder = "Répondre..."
+saveReply = "Sauvegarder la réponse"
+send = "Envoyer"
+moreActions = "Plus d'actions"
+typeComment = "Commentaire"
+typeInsertText = "Insérer du text"
+typeReplaceText = "Remplacer le commentaire"
+locateAnnotation = "Chercher dans le document"
+deleteTitle = "Supprimer l'annotation des commentaires ?"
+deleteDescription = "Cette annotation a un commentaire. Vous pouvez supprimer seulement le commentaire de la bare latérale en gardant l'annotation ou supprimer les deux."
+removeCommentOnly = "Supprimer seulement le commentaire"
+deleteAnnotationAndComment = "Supprimer l'annotation et le commentaire"
 
 [viewer.formBar]
 title = "Champs de formulaire"
@@ -4531,6 +4950,7 @@ toggleAttachments = "Afficher/Masquer les pièces jointes"
 toggleTheme = "Changer de thème"
 language = "Langue"
 toggleAnnotations = "Afficher/masquer les annotations"
+toggleLayers = "Basculer les calques"
 search = "Rechercher dans le PDF"
 panMode = "Mode panoramique"
 applyRedactionsFirst = "Appliquez d’abord les caviardages"
@@ -4551,7 +4971,7 @@ exitRedaction = "Quitter le mode de caviardage"
 save = "Enregistrer"
 downloadAll = "Tout télécharger"
 saveAll = "Tout enregistrer"
-saveAs = "Save As"
+saveAs = "Souvegarder sous"
 
 [textAlign]
 left = "Gauche"
@@ -5407,20 +5827,72 @@ title = "Imprimer le fichier"
 2 = "Entrez le nom de l'imprimante"
 
 [quickAccess]
+access = "Accès"
+accessAddPerson = "Ajouter une autre personne"
+accessBack = "Retour"
+accessCopyLink = "Copier le lien"
+accessEmail = "Adresse e-mail"
+accessEmailPlaceholder = "nom@entreprise.com"
+accessFileLabel = "Fichier"
+accessGeneral = "Accès général"
+accessInviteTitle = "Inviter des personnes"
+accessOwner = "Propriétaire"
+accessPanel = "Accès au document"
+accessPeople = "Personnes ayant accès"
+accessRemove = "Supprimer"
+accessRestricted = "Restreint"
+accessRestrictedHint = "Seules les personnes ayant accès peuvent ouvrir"
+accessRole = "Rôle"
+accessRoleCommenter = "Commentateur"
+accessRoleEditor = "Éditeur"
+accessRoleViewer = "Lecteur"
+accessSelectedFile = "Fichier sélectionné"
+accessSendInvite = "Envoyer l’invitation"
+accessTitle = "Accès au document"
+accessYou = "Vous"
 account = "Compte"
+activeSessions = "Sessions actives"
+activeTab = "Actives"
 activity = "Activité"
 adminSettings = "Réglages admin"
+allSessions = "Toutes les sessions"
 allTools = "Outils"
 automate = "Auto"
+back = "Retour"
+certSign = "Signature avec certificat"
+completedSessions = "Sessions terminées"
+completedTab = "Terminées"
 config = "Config"
+createNew = "Créer une nouvelle demande"
+createSession = "Créer une demande de signature"
+dueDate = "Date d’échéance (optionnelle)"
 files = "Fichiers"
 help = "Aide"
+noActiveSessions = "Aucune demande de signature en attente ni session active"
+noCompletedSessions = "Aucune session terminée"
+noFile = "Aucun fichier sélectionné"
 read = "Lire"
 reader = "Lecteur"
+refresh = "Actualiser"
+requestSignatures = "Demander des signatures"
+selectSingleFileToRequest = "Sélectionnez un seul fichier PDF pour demander des signatures"
+selectedFile = "Fichier sélectionné"
+selectUsers = "Sélectionnez des utilisateurs pour signer"
+selectUsersPlaceholder = "Choisissez des participants…"
+sendingRequest = "Envoi…"
 settings = "Réglages"
 showMeAround = "Faites-moi visiter"
 sign = "Signer"
+signatureRequests = "Demandes de signature"
+signYourself = "Signer vous-même"
+newRequest = "Nouvelle demande"
 tours = "Visites guidées"
+wetSign = "Ajouter une signature"
+filterMine = "Les miens"
+filterOverdue = "En retard"
+filterSigned = "Signé"
+filterDeclined = "Refusé"
+searchDocuments = "Rechercher des documents…"
 
 [quickAccess.helpMenu]
 adminTour = "Visite administrateur"
@@ -6050,25 +6522,89 @@ toolNotAvailableLocally = "Your Stirling-PDF server is offline and \"{{endpoint}
 expired = "Votre session a expiré. Veuillez recharger la page et réessayer."
 refreshPage = "Rafraichir la page"
 
+[sessionManagement.tooltip]
+header = "Gestion des sessions de signature"
+
+[sessionManagement.tooltip.addParticipants]
+bullet1 = "Les nouveaux participants sont ajoutés à la fin de l’ordre de signature"
+bullet2 = "Impossible d’ajouter des participants après la finalisation de la session"
+bullet3 = "Chaque participant reçoit une notification lorsqu’arrive son tour"
+description = "Vous pouvez ajouter d’autres participants à une session active à tout moment avant la finalisation."
+title = "Ajout de participants"
+
+[sessionManagement.tooltip.finalization]
+bullet1 = "<b>Finalisation complète</b> : Tous les participants ont signé"
+bullet2 = "<b>Finalisation partielle</b> : Certains participants n’ont pas encore signé"
+bullet3 = "Les participants n’ayant pas signé seront exclus du document final"
+bullet4 = "Une fois finalisée, vous pouvez charger le PDF signé dans les fichiers actifs"
+description = "La finalisation combine toutes les signatures en un seul PDF signé. Cette action est irréversible."
+title = "Finalisation de la session"
+
+[sessionManagement.tooltip.participantRemoval]
+bullet1 = "Impossible de supprimer les participants ayant déjà signé"
+bullet2 = "Les participants supprimés ne reçoivent plus de notifications"
+bullet3 = "L’ordre de signature s’ajuste automatiquement"
+description = "Les participants peuvent être retirés des sessions avant de signer."
+title = "Suppression de participants"
+
+[sessionManagement.tooltip.signatureOrder]
+bullet1 = "Chaque signature est appliquée séquentiellement au PDF"
+bullet2 = "Les signataires suivants peuvent voir les signatures précédentes"
+bullet3 = "Critique pour les flux d’approbation et les chaînes de conservation légales"
+description = "L’ordre que vous spécifiez lors de la création de la session détermine qui signe en premier."
+title = "Ordre des signatures"
+
+[signatureSettings.tooltip]
+header = "Paramètres d’apparence des signatures"
+
+[signatureSettings.tooltip.location]
+bullet1 = "Exemples : « New York, USA », « Bureau de Londres », « À distance »"
+bullet2 = "Diffère de la position sur la page"
+bullet3 = "Peut être requis dans certaines juridictions"
+description = "Emplacement géographique optionnel où la signature a été apposée. Stocké dans les métadonnées du certificat."
+title = "Emplacement de la signature"
+
+[signatureSettings.tooltip.logo]
+bullet1 = "Affiché à côté de la signature et du texte"
+bullet2 = "Prend en charge les formats PNG, JPG"
+bullet3 = "Améliore l’apparence professionnelle"
+description = "Ajoutez un logo d’entreprise aux signatures visibles pour l’image de marque et l’authenticité."
+title = "Logo de l’entreprise"
+
+[signatureSettings.tooltip.reason]
+bullet1 = "Exemples : « Approbation », « Contrat », « Vérification terminée »"
+bullet2 = "Visible dans les propriétés de signature du PDF"
+bullet3 = "Utile pour les pistes d’audit et la conformité"
+description = "Texte optionnel expliquant pourquoi le document est signé. Stocké dans les métadonnées du certificat."
+title = "Raison de la signature"
+
+[signatureSettings.tooltip.visibility]
+bullet1 = "<b>Visible</b> : La signature apparaît sur le PDF avec une apparence personnalisée"
+bullet2 = "<b>Invisible</b> : Certificat intégré sans marque visuelle"
+bullet3 = "Les signatures invisibles fournissent tout de même une validation cryptographique"
+description = "Contrôle si la signature est visible sur le document ou intégrée de manière invisible."
+title = "Visibilité de la signature"
+
 [settings.configuration]
 advanced = "Avancé"
 database = "Base de données"
 endpoints = "Endpoints"
 features = "Fonctionnalités"
+storageSharing = "Stockage et partage de fichiers"
 systemSettings = "Paramètres système"
 title = "Configuration"
 
 [settings.connection]
-localDescription = "You are using the local backend without an account. Some tools requiring cloud processing or a self-hosted server are unavailable."
+localDescription = "Vous utilisez le backend local sans compte. Certains outils nécessitant le cloud ou un serveur auto-hébergé ne sont pas disponibles."
 logout = "Se déconnecter"
 server = "Serveur"
-signIn = "Sign In"
+signIn = "Se connecter"
 title = "Mode de connexion"
 user = "Connecté en tant que"
 
 [settings.connection.mode]
-local = "Local Only"
-saas = "Stirling Cloud"
+local = "En local seulement"
+saas = "Cloud Stirling"
 selfhosted = "Auto-hébergé"
 
 [settings.planBilling]
@@ -6332,10 +6868,13 @@ title = "Se connecter à Stirling"
 [setup.selfhosted]
 link = "ou connectez-vous à un compte auto-hébergé"
 subtitle = "Saisissez les identifiants du serveur"
+changeServerLocked = "Votre organisation a limité cette application à un serveur spécifique"
 switchToLocal = "Use local tools instead"
 title = "Se connecter au serveur"
 
 [setup.selfhosted.unreachable]
+changeServer = "Se connecter à un autre serveur"
+changeServerLocked = "Votre organisation a limité cette application à un serveur spécifique"
 continueOffline = "Use local tools instead"
 message = "Could not reach {{url}}. Check that the server is running and accessible."
 retry = "Retry"
@@ -6529,6 +7068,15 @@ saved = "Enregistrées"
 text = "Texte"
 title = "Type de signature"
 
+[signRequest]
+declined = "Demande de signature refusée"
+fetchFailed = "Échec du chargement de la demande de signature"
+signed = "Document signé avec succès"
+
+[signSession]
+createFailed = "Échec de la création de la demande de signature"
+created = "Demande de signature envoyée"
+
 [signup]
 accountCreatedSuccessfully = "Compte créé avec succès ! Vous pouvez maintenant vous connecter."
 alreadyHaveAccount = "Vous avez déjà un compte ? Connectez-vous"
@@ -6807,6 +7355,106 @@ title = "Diviser un PDF par Chapitres"
 [splitPdfByChapters]
 tags = "séparer,chapitres,split,chapters,bookmarks,organize"
 
+[storageShare]
+accessed = "Accédé"
+accessDenied = "Vous n’avez pas accès à ce fichier partagé. Demandez au propriétaire de le partager avec vous."
+accessFailed = "Impossible de charger l’activité."
+accessDeniedBody = "Vous n’avez pas accès à ce fichier. Demandez au propriétaire de le partager avec vous."
+accessDeniedTitle = "Aucun accès"
+accessLimitedCommenter = "L’accès en tant que commentateur arrive bientôt. Demandez l’accès éditeur si vous devez télécharger."
+accessLimitedTitle = "Accès limité"
+accessLimitedViewer = "Ce lien est en lecture seule. Demandez l’accès éditeur si vous devez télécharger."
+createdAt = "Créé"
+download = "Télécharger"
+downloadFailed = "Impossible de télécharger ce fichier."
+expiredBody = "Ce lien de partage est invalide ou a expiré."
+expiredTitle = "Lien expiré"
+goToLogin = "Aller à la connexion"
+loadFailed = "Impossible d’ouvrir le fichier partagé."
+loading = "Chargement du lien de partage…"
+loginPrompt = "Connectez-vous pour accéder à ce fichier partagé."
+loginRequired = "Connexion requise"
+openInApp = "Ouvrir dans Stirling PDF"
+ownerLabel = "Propriétaire"
+ownerUnknown = "Inconnu"
+requiresLogin = "Ce fichier partagé nécessite une connexion."
+roleCommenter = "Commentateur"
+roleEditor = "Éditeur"
+roleViewer = "Lecteur"
+shareHeading = "Fichier partagé"
+titleDefault = "Fichier partagé"
+tryAgain = "Veuillez réessayer plus tard."
+addUser = "Ajouter"
+commenterHint = "Les commentaires arrivent bientôt."
+copied = "Lien copié dans le presse-papiers"
+copy = "Copier"
+copyFailed = "Échec de la copie"
+description = "Créez un lien de partage pour ce fichier. Les utilisateurs connectés munis du lien peuvent y accéder."
+downloadsCount = "Téléchargements : {{count}}"
+emailWarningBody = "Cela ressemble à une adresse e-mail. Si cette personne n’est pas déjà utilisatrice de Stirling PDF, elle ne pourra pas accéder au fichier."
+emailWarningConfirm = "Partager quand même"
+emailWarningTitle = "Adresse e-mail"
+errorTitle = "Échec du partage"
+failure = "Impossible de générer un lien de partage. Veuillez réessayer."
+fileLabel = "Fichier"
+generate = "Générer le lien"
+generated = "Lien de partage généré"
+hideActivity = "Masquer l’activité"
+invalidUsername = "Saisissez un nom d’utilisateur ou une adresse e-mail valide."
+lastAccessed = "Dernier accès"
+linkAccessTitle = "Accès via lien de partage"
+linkLabel = "Lien de partage"
+linksDisabled = "Les liens de partage sont désactivés."
+linksDisabledBody = "Les liens de partage sont désactivés par les paramètres de votre serveur."
+manage = "Gérer le partage"
+manageDescription = "Créer et gérer des liens pour partager ce fichier."
+manageLoadFailed = "Impossible de charger les liens de partage."
+manageTitle = "Gérer le partage"
+noActivity = "Aucune activité pour le moment."
+noLinks = "Aucun lien de partage actif pour le moment."
+noSharedUsers = "Aucun utilisateur n’a encore accès."
+removeLink = "Supprimer le lien"
+removeUser = "Supprimer"
+revokeFailed = "Impossible de supprimer le lien de partage."
+revoked = "Lien de partage supprimé"
+roleLabel = "Rôle"
+sharingDisabled = "Le partage est désactivé."
+sharingDisabledBody = "Le partage a été désactivé par les paramètres de votre serveur."
+sharedUsersTitle = "Utilisateurs ayant accès"
+title = "Partager le fichier"
+unknownUser = "Utilisateur inconnu"
+userAddFailed = "Impossible de partager avec cet utilisateur."
+userAdded = "Utilisateur ajouté à la liste de partage."
+usernameLabel = "Nom d’utilisateur ou adresse e-mail"
+usernamePlaceholder = "Saisissez un nom d’utilisateur ou une adresse e-mail"
+userRemoveFailed = "Impossible de supprimer cet utilisateur."
+userRemoved = "Utilisateur supprimé de la liste de partage."
+viewActivity = "Voir l’activité"
+viewed = "Consulté"
+viewsCount = "Vues : {{count}}"
+downloaded = "Téléchargé"
+bulkDescription = "Créer un seul lien pour partager tous les fichiers sélectionnés avec les utilisateurs connectés."
+bulkTitle = "Partager les fichiers sélectionnés"
+copyLink = "Copier le lien de partage"
+fileCount = "{{count}} fichiers sélectionnés"
+ownerOnly = "Seul le propriétaire peut gérer le partage."
+selectSingleFile = "Sélectionnez un seul fichier pour gérer le partage."
+
+[storageUpload]
+description = "Cela téléverse le fichier actuel vers le stockage du serveur pour votre accès personnel."
+errorTitle = "Échec du téléversement"
+failure = "Échec du téléversement. Veuillez vérifier votre connexion et vos paramètres de stockage."
+fileLabel = "Fichier"
+hint = "Les liens publics et les modes d’accès sont contrôlés par les paramètres de votre serveur."
+success = "Téléversé sur le serveur"
+title = "Téléverser sur le serveur"
+updateButton = "Mettre à jour sur le serveur"
+uploadButton = "Téléverser sur le serveur"
+bulkDescription = "Cela téléverse les fichiers sélectionnés vers le stockage de votre serveur."
+bulkTitle = "Téléverser les fichiers sélectionnés"
+fileCount = "{{count}} fichiers sélectionnés"
+more = " +{{count}} autres"
+
 [storage]
 approximateSize = "Taille approximative"
 fileTooLarge = "Fichier trop volumineux. Taille maximale par fichier :"
@@ -7153,6 +7801,30 @@ title = "Afficher/modifier un PDF"
 [warning]
 tooltipTitle = "Avertissement"
 
+[wetSignature.tooltip]
+header = "Méthodes de création de signature"
+
+[wetSignature.tooltip.draw]
+bullet1 = "Personnaliser la couleur et l’épaisseur du trait"
+bullet2 = "Effacer et redessiner jusqu’à ce que vous soyez satisfait"
+bullet3 = "Fonctionne sur les appareils tactiles (tablettes, téléphones)"
+description = "Créez une signature manuscrite à l’aide de votre souris ou de votre écran tactile. Idéal pour des signatures personnelles et authentiques."
+title = "Dessiner la signature"
+
+[wetSignature.tooltip.type]
+bullet1 = "Choisir parmi plusieurs polices"
+bullet2 = "Personnaliser la taille et la couleur du texte"
+bullet3 = "Parfait pour des signatures standardisées"
+description = "Générez une signature à partir d’un texte saisi. Rapide et cohérent, adapté aux documents professionnels."
+title = "Saisir la signature"
+
+[wetSignature.tooltip.upload]
+bullet1 = "Prend en charge PNG, JPG et autres formats d’image"
+bullet2 = "Arrière-plans transparents recommandés pour de meilleurs résultats"
+bullet3 = "L’image sera redimensionnée pour s’adapter à la zone de signature"
+description = "Téléversez une image de signature préalablement créée. Idéal si vous avez une signature numérisée ou un logo d’entreprise."
+title = "Téléverser une image de signature"
+
 [watermark]
 completed = "Filigrane ajouté"
 desc = "Ajouter des filigranes texte ou image aux fichiers PDF"
@@ -7333,6 +8005,7 @@ activeSession = "Session active"
 addMembers = "Ajouter des membres"
 admin = "Admin"
 confirmDelete = "Êtes-vous sûr de vouloir supprimer cet utilisateur ? Cette action ne peut pas être annulée."
+confirmUnlock = "Êtes-vous sûr de vouloir déverrouiller ce compte utilisateur ?"
 deleteUser = "Supprimer l’utilisateur"
 deleteUserError = "Échec de la suppression de l’utilisateur"
 deleteUserSuccess = "Utilisateur supprimé avec succès"
@@ -7341,6 +8014,8 @@ disable = "Désactiver"
 disabled = "Désactivé"
 editRole = "Modifier le rôle"
 enable = "Activer"
+locked = "verrouillé"
+lockedBadge = "Verrouillé"
 loading = "Chargement des personnes..."
 loginRequired = "Activez d’abord le mode connexion"
 member = "Membre"
@@ -7350,6 +8025,9 @@ searchMembers = "Rechercher des membres..."
 status = "Statut"
 team = "Équipe"
 title = "Personnes"
+unlockAccount = "Déverrouiller le compte"
+unlockUserError = "Échec du déverrouillage du compte utilisateur"
+unlockUserSuccess = "Compte utilisateur déverrouillé avec succès"
 user = "Utilisateur"
 
 [workspace.people.actions]
diff --git a/frontend/public/locales/ga-IE/translation.toml b/frontend/public/locales/ga-IE/translation.toml
index 9bfb8e663d..d5995fc772 100644
--- a/frontend/public/locales/ga-IE/translation.toml
+++ b/frontend/public/locales/ga-IE/translation.toml
@@ -8,6 +8,7 @@ black = "Dubh"
 blue = "Gorm"
 bored = "Leamh Ag Feitheamh?"
 cancel = "Cealaigh"
+confirm = "Deimhnigh"
 changedCredsMessage = "Dintiúir athraithe!"
 chooseFile = "Roghnaigh Comhad"
 close = "Dún"
@@ -146,6 +147,7 @@ insufficientCredits = "Creidiúintí neamhleor. Riachtanach: {{requiredCredits}}
 loadingCredits = "Ag seiceáil creidiúintí..."
 loadingProStatus = "Ag seiceáil stádais síntiúis..."
 noticeTopUpOrPlan = "Níl go leor creidiúintí ann; cuir creidiúintí leis nó uasghrádaigh go plean"
+accessInvite = "Cuir cuireadh"
 
 [account]
 accountSettings = "Socruithe cuntas"
@@ -1427,6 +1429,34 @@ title = "Próiseáil"
 description = "Uasmhéid ama le fanacht le tasc próiseála sula dtuairiscítear earráid."
 label = "Teorainn Ama Próiseála (soicind)"
 
+[admin.settings.storage]
+description = "Rialaigh stóráil agus roghanna comhroinnte an fhreastalaí."
+title = "Stóráil Comhad agus Comhroinnt"
+
+[admin.settings.storage.enabled]
+description = "Ceadaigh d'úsáideoirí comhaid a stóráil ar an bhfreastalaí."
+label = "Cumasaigh stóráil comhad ar an bhfreastalaí"
+
+[admin.settings.storage.sharing.email]
+description = "Ceadaigh comhroinnt le seoltaí ríomhphoist."
+label = "Cumasaigh Comhroinnt trí Ríomhphost"
+mailLink = "Cumraigh Socruithe Ríomhphoist"
+mailNote = "Éilíonn cumraíocht ríomhphoist. "
+
+[admin.settings.storage.sharing.enabled]
+description = "Ceadaigh d'úsáideoirí comhaid stóráilte a roinnt."
+label = "Cumasaigh Comhroinnt"
+
+[admin.settings.storage.sharing.links]
+description = "Ceadaigh comhroinnt trí naisc a éilíonn logáil isteach."
+frontendUrlLink = "Cumraigh i Socruithe an Chórais"
+frontendUrlNote = "Éilíonn Frontend URL. "
+label = "Cumasaigh naisc chomhroinnte"
+
+[admin.settings.storage.signing.enabled]
+description = "Ceadaigh d'úsáideoirí seisiúin sínithe doiciméid il-rannpháirtithe a chruthú. Ní mór stóráil chomhad freastalaí a bheith cumasaithe."
+label = "Cumasaigh Sínithe Grúpa (Alfa)"
+
 [admin.settings.unsavedChanges]
 cancel = "Lean ar eagarthóireacht"
 discard = "Cuir athruithe i leataobh"
@@ -2059,7 +2089,19 @@ numbers = "Uimhreacha/raonta: 5, 10-20"
 progressions = "Forásanna: 3n, 4n+1"
 
 [certSign]
+allSigned = "Tá gach rannpháirtí tar éis síniú. Réidh le críochnú."
+awaitingSignatures = "Ag feitheamh le sínithe"
+signatureProgress = "{{signedCount}}/{{totalCount}} sínithe"
 chooseCertificate = "Roghnaigh Comhad Teastais"
+declined = "Diúltaithe"
+fetchFailed = "Theip ar shonraí sínithe a lódáil"
+finalized = "Críochnaithe"
+notified = "Ar feitheamh"
+partialNote = "Is féidir leat críochnú go luath leis na sínithe reatha. Ní áireofar rannpháirtithe gan síniú."
+pending = "Ar feitheamh"
+readyToFinalize = "Réidh le críochnú"
+signed = "Sínithe"
+viewed = "Feicthe"
 chooseJksFile = "Roghnaigh Comhad JKS"
 chooseP12File = "Roghnaigh Comhad PKCS12"
 choosePfxFile = "Roghnaigh Comhad PFX"
@@ -2082,6 +2124,7 @@ title = "Síniú Teastais"
 invisible = "Dofheicthe"
 stepTitle = "Cuma Sínithe"
 visible = "Infheicthe"
+visibility = "Infheictheacht"
 
 [certSign.appearance.options]
 title = "Sonraí Sínithe"
@@ -2188,6 +2231,252 @@ bullet4 = "Is féidir teastais shaincheaptha a úsáid le haghaidh fíoraithe"
 text = "Nuair a sheiceálann tú sínithe, deir an uirlis leat an bhfuil siad bailí, cé a shínigh an doiciméad, cathain a síníodh é, agus an ndearnadh aon athrú ar an doiciméad ó síníodh é."
 title = "Sínithe á Seiceáil"
 
+[certSign.collab.finalize]
+button = "Críochnaigh agus Luchtaigh an PDF Sínithe"
+early = "Críochnaigh leis na Sínithe Reatha"
+
+[certSign.collab.sessionDetail]
+addButton = "Cuir Rannpháirtithe Leis"
+addParticipants = "Cuir Rannpháirtithe Leis"
+addParticipantsError = "Theip ar rannpháirtithe a chur leis"
+backToList = "Ar ais go Seisiúin"
+deleteConfirm = "An bhfuil tú cinnte? Ní féidir é seo a chur ar ceal."
+deleteError = "Theip ar an seisiún a scriosadh"
+deleted = "Scriosadh an seisiún"
+deleteSession = "Scrios an Seisiún"
+dueDate = "Spriocdháta"
+finalizeError = "Theip ar an seisiún a chríochnú"
+loadPdfError = "Theip ar an PDF sínithe a lódáil"
+loadSignedPdf = "Luchtaigh an PDF Sínithe isteach sna Comhaid Ghníomhacha"
+messageLabel = "Teachtaireacht"
+noAdditionalInfo = "Níl a thuilleadh eolais"
+owner = "Úinéir"
+participantRemoved = "Baineadh rannpháirtí"
+participants = "Rannpháirtithe"
+participantsAdded = "Cuireadh rannpháirtithe leis go rathúil"
+removeParticipant = "Bain"
+removeParticipantError = "Theip ar rannpháirtí a bhaint"
+selectUsers = "Roghnaigh úsáideoirí..."
+sessionInfo = "Eolas Seisiúin"
+workbenchTitle = "Bainistíocht Seisiúin"
+
+[certSign.collab.signRequest]
+addedToFiles = "Cuireadh an doiciméad le comhaid ghníomhacha"
+addSignature = "Cuir Do Shíniú Leis"
+addToFiles = "Cuir le Comhaid Ghníomhacha"
+advancedSettings = "Ardsocruithe"
+backToList = "Ar ais go hIarratais Shínithe"
+certificateChoice = "Roghnaigh teastas le síniú leis"
+changeSignature = "Athraigh an síniú"
+clearSignature = "Glan an Síniú"
+completeAndSign = "Críochnaigh & Sínigh"
+createNewSignature = "Cruthaigh Síniú Nua"
+declineButton = "Diúltaigh"
+decline = "Diúltaigh an Iarratas"
+deleteSelected = "Scrios an síniú roghnaithe"
+drawSignature = "Tarraing do shíniú thíos"
+dueDate = "Spriocdháta"
+fileTooLarge = "Ní mór do mhéid an chomhaid a bheith níos lú ná 5MB"
+fontFamily = "Teaghlach Cló"
+fontSize = "Méid Cló: {{size}}px"
+fontSizePlaceholder = "Méid"
+from = "Ó"
+invalidCertFile = "Roghnaigh comhad teastais P12 nó PFX le do thoil"
+invalidFileType = "Roghnaigh comhad íomhá le do thoil"
+location = "Suíomh (Roghnach)"
+locationPlaceholder = "Cá bhfuil tú ag síniú?"
+message = "Teachtaireacht"
+noCertificate = "Roghnaigh comhad teastais le do thoil"
+noSignatures = "Cuir ar a laghad síniú amháin ar an PDF"
+p12File = "Comhad Teastais P12/PFX"
+password = "Focal Faire an Teastais"
+passwordPlaceholder = "Iontráil focal faire..."
+penColor = "Dath Peann"
+penSize = "Méid Peann: {{size}}px"
+placementActive = "Cliceáil ar an PDF chun é a chur"
+placeSignatureButton = "Cuir Síniú ar an PDF"
+reason = "Fáth (Roghnach)"
+reasonPlaceholder = "Cén fáth atá tú ag síniú?"
+removeImage = "Bain �omhá"
+removeCertFile = "Bain Comhad"
+savedSignatures = "Sínithe Sábháilte"
+selectFile = "Roghnaigh Comhad �omhá"
+selectSignatureTitle = "Roghnaigh nó Cruthaigh Síniú"
+signButton = "Sínigh an Doiciméad"
+signatureInfo = "Cumraíonn úinéir an doiciméid na socruithe seo"
+signaturePlaced = "Cuireadh síniú ar an leathanach"
+signatureSettings = "Socruithe Sínithe"
+signatureText = "Téacs an Sínithe"
+signatureTextPlaceholder = "Iontráil d'ainm..."
+signatureTypeLabel = "Cineál an Sínithe"
+signingTitle = "Síniú"
+textColor = "Dath Téacs"
+typeSignature = "Clóscríobh d'ainm chun síniú a chruthú"
+uploadCert = "Teastas Saincheaptha"
+uploadCertDesc = "Úsáid do theastas P12/PFX féin"
+uploadSignature = "Uasluchtaigh íomhá do shínithe"
+usePersonalCert = "Teastas Pearsanta"
+usePersonalCertDesc = "Ginte go huathoibríoch do do chuntas"
+useServerCert = "Teastas Eagraíochta"
+useServerCertDesc = "Teastas eagraíochta roinnte"
+workbenchTitle = "Iarratas Sínithe"
+
+[certSign.collab.signRequest.canvas]
+colorPickerTitle = "Roghnaigh dath an stróic"
+continue = "Lean ar aghaidh"
+
+[certSign.collab.signRequest.certModal]
+description = "Tá {{count}} síniú(í) curtha agat. Roghnaigh do theastas chun an síniú a chur i gcrích."
+sign = "Sínigh an Doiciméad"
+certValidating = "Teastas á bhailíochtú..."
+certValidUntil = "Teastas bailí go dtí {{date}}"
+certInvalid = "Teastas neamhbhailí: {{error}}"
+certInvalidFallback = "Teastas neamhbhailí"
+certNetworkError = "Níorbh fhéidir an teastas a bhailíochtú"
+title = "Cumraigh an Teastas"
+
+[certSign.collab.signRequest.image]
+hint = "Uasluchtaigh íomhá PNG nó JPG de do shíniú"
+
+[certSign.collab.signRequest.mode]
+move = "Bog an Síniú"
+place = "Cuir an Síniú"
+title = "Mód síniúcháin nó bogtha"
+
+[certSign.collab.signRequest.modeTabs]
+draw = "Tarraing"
+image = "Uasluchtaigh"
+text = "Clóscríobh"
+
+[certSign.collab.signRequest.placeSignature]
+message = "Cliceáil ar an PDF chun do shíniú a chur"
+title = "Cuir Síniú"
+
+[certSign.collab.signRequest.preview]
+imageAlt = "Síniú roghnaithe"
+missing = "Gan réamhamharc"
+textFallback = "Síniú"
+
+[certSign.collab.signRequest.saved]
+defaultCanvasLabel = "Síniú tarraingthe"
+defaultImageLabel = "Síniú uasluchtaithe"
+defaultLabel = "Síniú"
+defaultTextLabel = "Síniú clóscríofa"
+delete = "Scrios síniú"
+none = "Níl aon síniú sábháilte"
+
+[certSign.collab.signRequest.signatureType]
+draw = "Tarraing"
+type = "Clóscríobh"
+upload = "Uasluchtaigh"
+
+[certSign.collab.signRequest.steps]
+back = "Ar ais"
+cancelPlacement = "Cealaigh Socrú"
+certificate = "Teastas"
+clickMultipleTimes = "Cliceáil ar an PDF arís agus arís eile chun sínithe a chur. Tarraing aon síniú chun é a bhogadh nó a athmhéadú."
+clickToPlace = "Cliceáil ar an PDF san áit ar mhaith leat go mbeadh do shíniú le feiceáil."
+continue = "Lean ar aghaidh go Roghnú Teastais"
+continueToPlacement = "Lean ar aghaidh go Socrú"
+continueToReview = "Lean ar aghaidh go hAthbhreithniú"
+createSignature = "Cruthaigh Síniú"
+invisible = "Dofheicthe"
+location = "Suíomh:"
+multipleSignatures = "Cuirfear {{count}} sínithe i bhfeidhm ar an PDF"
+oneSignature = "Cuirfear 1 síniú i bhfeidhm ar an PDF"
+placeOnPdf = "Cuir ar an PDF"
+reason = "Fáth:"
+reviewTitle = "Athbhreithniú Roimh Shíniú"
+signaturePlaced = "Cuireadh an síniú ar leathanach {{page}}. Is féidir leat an suíomh a choigeartú trí chliceáil arís nó lean ar aghaidh chun athbhreithniú a dhéanamh."
+visible = "Infheicthe"
+visibility = "Infheictheacht:"
+yourSignatures = "Do Shínithe ({{count}})"
+
+[certSign.collab.signRequest.text]
+colorLabel = "Dath"
+fontLabel = "Cló"
+fontSizeLabel = "Méid"
+fontSizePlaceholder = "16"
+label = "Téacs an Sínithe"
+modalHint = "Iontráil d'ainm, ansin cliceáil Lean ar aghaidh chun é a chur ar an PDF."
+placeholder = "Iontráil d'ainm..."
+
+[certSign.collab.participant]
+certValidating = "Teastas á bhailíochtú..."
+certValid = "✓ Teastas bailí"
+certValidUntil = " go dtí {{date}}"
+certInvalid = "✗ {{error}}"
+certInvalidFallback = "Teastas neamhbhailí"
+certNetworkError = "Níorbh fhéidir an teastas a bhailíochtú"
+
+[certSign.collab.addParticipants]
+add = "Cuir {{count}} rannpháirtí leis"
+back = "Ar ais"
+configureSignatures = "Cumraigh Socruithe Sínithe"
+continue = "Lean ar aghaidh go Socruithe Sínithe"
+reasonHelp = "Réamhshocraigh fáth sínithe do na rannpháirtithe seo (roghnach, is féidir leo a athrú agus iad ag síniú)"
+reasonPlaceholder = "m.sh. Formheas, Athbhreithniú..."
+selectUsers = "Roghnaigh Úsáideoirí"
+
+[certSign.collab.sessionCreation]
+includeSummaryPage = "Cuir Leathanach Achoimre Síniú san áireamh"
+includeSummaryPageHelp = "Cuirfear leathanach achoimre leis ag an deireadh le gach meiteashonraí sínithe. Cuirfear boscaí sínithe teastais dhigiteacha ar leathanaigh aonair ar ceal (ní théann sé i bhfeidhm ar shínithe fliucha)."
+
+[certSign.collab.sessionList]
+active = "Gníomhach"
+finalized = "Críochnaithe"
+
+[certSign.collab.signatureSettings]
+description = "Cumraigh conas a bheidh cuma ar shínithe do gach rannpháirtí"
+title = "Cuma an Sínithe"
+
+[certSign.collab.userSelector]
+inviteUsers = "Cuir Úsáideoirí Leis"
+loadError = "Theip ar úsáideoirí a lódáil"
+noTeam = "Gan Foireann"
+noUsers = "Níor aimsíodh aon úsáideoirí eile."
+placeholder = "Roghnaigh úsáideoirí..."
+
+[certSign.mobile]
+panelActions = "Gníomhartha"
+panelDocument = "Doiciméad"
+panelPeople = "Daoine"
+
+[certSign.sessions]
+deleted = "Scriosadh an seisiún"
+fetchFailed = "Theip ar shonraí an tseisiúin a lódáil"
+finalized = "Seisiún críochnaithe"
+loaded = "Luchtaíodh an PDF sínithe"
+pdfNotReady = "Níl an PDF Réidh"
+pdfNotReadyDesc = "Tá an PDF sínithe á ghiniúint. Bain triail eile as ar ball."
+
+[certificateChoice.tooltip]
+header = "Cineálacha Teastais"
+
+[certificateChoice.tooltip.organization]
+bullet1 = "� bhainistiú ag riarthóirí an chórais"
+bullet2 = "Roinnte i measc úsáideoirí údaraithe"
+bullet3 = "Léiríonn sé aitheantas na cuideachta, ní duine aonair"
+bullet4 = "Is fearr do: Doiciméid oifigiúla, sínithe foirne"
+description = "Teastas roinnte a sholáthraíonn d’eagraíocht. Úsáidtear le haghaidh údarás sínithe ar fud na cuideachta."
+title = "Teastas Eagraíochta"
+
+[certificateChoice.tooltip.personal]
+bullet1 = "Ginte go huathoibríoch ag an gcéad úsáid"
+bullet2 = "Ceangailte le do chuntas úsáideora"
+bullet3 = "Ní féidir a roinnt le húsáideoirí eile"
+bullet4 = "Is fearr do: Doiciméid phearsanta, cuntasacht aonair"
+description = "Teastas uathghinte uathúil do do chuntas úsáideora. Oiriúnach do shínithe aonair."
+title = "Teastas Pearsanta"
+
+[certificateChoice.tooltip.upload]
+bullet1 = "Éilíonn comhad P12/PFX agus focal faire"
+bullet2 = "Is féidir le hÚdaráis Teastais sheachtracha é a eisiúint"
+bullet3 = "Leibhéal mhuiníne níos airde do dhoiciméid dhlíthiúla"
+bullet4 = "Is fearr do: Conarthaí dlíthiúla ceangailteacha, bailíochtú seachtrach"
+description = "Úsáid do chomhad teastais PKCS#12 féin. Soláthraíonn sé smacht iomlán ar airíonna an teastais."
+title = "Uasluchtaigh P12 Saincheaptha"
+
 [changeCreds]
 changePassword = "Tá dintiúir réamhshocraithe logáil isteach á úsáid agat. Cuir isteach pasfhocal nua le do thoil"
 changeUsername = "Nuashonraigh d'ainm úsáideora. Logálfar amach thú tar éis an nuashonraithe."
@@ -3242,6 +3531,46 @@ totalSelected = "Iomlán Roghnaithe"
 unsupported = "Gan tacaíocht"
 unzip = "Dízipeáil"
 uploadError = "Theip ar uaslódáil roinnt comhad."
+copyCreated = "Cóip sábháilte ar an ngléas seo."
+copyFailed = "Níorbh fhéidir cóip a chruthú."
+leaveShare = "Bain de mo liosta"
+leaveShareFailed = "Níorbh fhéidir an comhad comhroinnte a bhaint."
+leaveShareSuccess = "Baineadh de do liosta comhroinnte."
+removeBoth = "Bain ón dá cheann"
+removeFilePrompt = "Tá an comhad seo sábháilte ar an ngléas seo agus ar do fhreastalaí. Cá mba mhaith leat é a bhaint as?"
+removeFileTitle = "Bain comhad"
+removeLocalOnly = "An gléas seo amháin"
+removeServerFailed = "Níorbh fhéidir an comhad a bhaint den fhreastalaí."
+removeServerOnly = "Freastalaí amháin"
+removeServerOnlyPrompt = "Níl an comhad seo stóráilte ach ar do fhreastalaí. Ar mhaith leat é a bhaint den fhreastalaí?"
+removeServerSuccess = "Baineadh den fhreastalaí."
+removeSharedPrompt = "Tá an comhad seo roinnte leat. Is féidir leat é a bhaint den ghléas seo nó de do liosta comhroinnte."
+removeSharedServerOnlyBlockedPrompt = "Tá an comhad seo roinnte leat agus stóráilte ar an bhfreastalaí amháin."
+removeSharedServerOnlyPrompt = "Tá an comhad seo roinnte leat agus stóráilte ar an bhfreastalaí amháin. Bain é de do liosta?"
+changesNotUploaded = "Níor uasluchtaíodh na hathruithe"
+cloudFile = "Comhad sa scamall"
+filterAll = "Uile"
+filterLocal = "�itiúil"
+filterSharedByMe = "Roinnte agam"
+filterSharedWithMe = "Roinnte liom"
+lastSynced = "Sioncrónaithe go deireanach"
+localOnly = "�itiúil amháin"
+makeCopy = "Déan cóip"
+owner = "Úinéir"
+ownerUnknown = "Anaithnid"
+share = "Comhroinn"
+shareSelected = "Comhroinn Roghnaithe"
+sharedByYou = "Roinnte agat"
+sharedEditNoticeBody = "Níl cearta eagarthóireachta agat ar leagan freastalaí an chomhaid seo. Sábhálfar aon eagarthóireacht a dhéanfaidh tú mar chóip áitiúil."
+sharedEditNoticeConfirm = "Tuigim"
+sharedEditNoticeTitle = "Leagan freastalaí inléite amháin"
+sharedWithYou = "Roinnte leat"
+sharing = "Comhroinnt"
+storageState = "Stóráil"
+synced = "Sioncrónaithe"
+updateOnServer = "Nuashonraigh ar an bhfreastalaí"
+uploadSelected = "Uasluchtaigh Roghnaithe"
+uploadToServer = "Uasluchtaigh chuig an bhfreastalaí"
 
 [files]
 addFiles = "Cuir comhaid leis"
@@ -3367,6 +3696,77 @@ title = "Maidir le Maolú PDFanna"
 discord = "Discord"
 issues = "GitHub"
 
+[groupSigning.tooltip]
+header = "Maidir le Sínithe Grúpa"
+
+[groupSigning.tooltip.finalization]
+bullet1 = "Cuirtear gach síniú i bhfeidhm san ord rannpháirtíochta a shonraigh tú"
+bullet2 = "Is féidir leat críochnú le cuid de na sínithe más gá"
+bullet3 = "Nuair a bheidh sé críochnaithe, ní féidir an seisiún a mhodhnú"
+description = "Nuair a bheidh gach rannpháirtí tar éis síniú (nó má roghnaíonn tú críochnú go luath), is féidir leat an PDF sínithe deiridh a ghiniúint."
+title = "Próiseas Críochnaithe"
+
+[groupSigning.tooltip.roles]
+bullet1 = "Úinéir (tusa): Cruthaíonn seisiún, cumraíonn réamhshocruithe sínithe, críochnaíonn doiciméad"
+bullet2 = "Rannpháirtithe: Cruthaíonn a síniú, roghnaíonn teastas, cuireann ar an PDF é"
+bullet3 = "Ní féidir le rannpháirtithe infheictheacht, fáth ná socruithe suímh an tsínithe a athrú"
+description = "Rialaíonn tú socruithe cuma an tsínithe do gach rannpháirtí."
+title = "Róil Rannpháirtithe"
+
+[groupSigning.tooltip.sequential]
+bullet1 = "Ní mór don chéad rannpháirtí síniú sula mbeidh an dara duine in ann rochtain a fháil ar an doiciméad"
+bullet2 = "Cinntíonn ord sínithe cuí ar mhaithe le comhlíonadh dlí"
+bullet3 = "Is féidir leat rannpháirtithe a athordú trí iad a tharraingt sa liosta"
+description = "Síníonn rannpháirtithe doiciméid san ord a shonraíonn tú. Faigheann gach sínitheoir fógra nuair is é a seal é."
+title = "Sínithe Seicheamhach"
+
+[groupSigning.steps]
+back = "Ar ais"
+completed = "Críochnaithe"
+current = "Reatha"
+stepLabel = "Céim {{number}}"
+
+[groupSigning.steps.configureDefaults]
+continue = "Lean ar aghaidh go hAthbhreithniú"
+invisible = "Beidh sínithe dofheicthe (meiteashonraí amháin)"
+locationLabel = "Suíomh:"
+preview = "Réamhamharc"
+reasonLabel = "Fáth:"
+title = "Cumraigh Socruithe Sínithe"
+visible = "Beidh sínithe infheicthe ar leathanach {{page}}"
+
+[groupSigning.steps.review]
+document = "Doiciméad"
+dueDate = "Spriocdháta (Roghnach)"
+dueDatePlaceholder = "Roghnaigh spriocdháta..."
+invisible = "Dofheicthe (meiteashonraí amháin)"
+location = "Suíomh:"
+logo = "Lógó:"
+logoHidden = "Gan lógó"
+logoShown = "Lógó Stirling PDF le feiceáil"
+participants = "Rannpháirtithe"
+reason = "Fáth:"
+send = "Seol Iarratais Shínithe"
+signatureSettings = "Socruithe Sínithe"
+title = "Athbhreithnigh Sonraí an tSeisiúin"
+titleShort = "Athbhreithnigh & Seol"
+visibility = "Infheictheacht:"
+visible = "Infheicthe ar leathanach {{page}}"
+participantCount = "Sínneoidh {{count}} rannpháirtí in ord"
+
+[groupSigning.steps.selectDocument]
+continue = "Lean ar aghaidh go Roghnú Rannpháirtithe"
+noFile = "Roghnaigh comhad PDF aonair ó do chomhaid ghníomhacha chun seisiún sínithe a chruthú."
+selectedFile = "Doiciméad roghnaithe"
+title = "Roghnaigh Doiciméad"
+
+[groupSigning.steps.selectParticipants]
+continue = "Lean ar aghaidh go Socruithe Sínithe"
+count = "Roghnaíodh {{count}} rannpháirtí"
+label = "Roghnaigh rannpháirtithe"
+placeholder = "Roghnaigh rannpháirtithe le síniú..."
+title = "Roghnaigh Rannpháirtithe"
+
 [getPdfInfo]
 downloadJson = "�osluchtaigh ceol JSON"
 downloads = "�oslódálacha"
@@ -4460,7 +4860,10 @@ zoomOut = "Súmáil Amach"
 
 [viewer]
 cannotPreviewFile = "Ní féidir an comhad a réamhamharc."
+disableColorFilter = "Díchumasaigh Scagaire Datha"
 dualPageView = "Amharc Dhá Leathanach"
+enableDarkFilter = "Cumasaigh Scagaire Dorcha"
+enableSepiaFilter = "Cumasaigh Scagaire Sepia"
 firstPage = "An Chéad Leathanach"
 lastPage = "An Leathanach Deireanach"
 nextPage = "Leathanach Ar Aghaidh"
@@ -4470,6 +4873,22 @@ singlePageView = "Amharc Leathanach Aonair"
 unknownFile = "Comhad anaithnid"
 zoomIn = "Súmáil Isteach"
 zoomOut = "Súmáil Amach"
+resetZoom = "Athshocraigh zúmáil"
+
+[viewer.nonPdf]
+fileTypeBadge = "Comhad {{type}}"
+convertToPdf = "Tiontaigh go PDF"
+loading = "� lódáil..."
+emptyFile = "Comhad folamh"
+csvStats = "{{rows}} sraith · {{columns}} colún · {{size}}"
+sortedBy = "Sórtáilte de réir: {{column}}"
+columnDefault = "Colún {{index}}"
+htmlPreviewWarning = "Réamhamharc HTML — seans nach lódálfar acmhainní seachtracha · {{size}}"
+htmlPreview = "Réamhamharc HTML"
+invalidJson = "JSON neamhbhailí — á thaispeáint amh"
+textStats = "{{lines}} líne · {{size}}"
+lineNumbers = "Uimhreacha línte"
+renderMarkdown = "Rindreáil Markdown"
 
 [viewer.attachments]
 title = "Iatáin"
@@ -4531,6 +4950,7 @@ toggleAttachments = "Scoránaigh Iatáin"
 toggleTheme = "Téama a Athsholáthar"
 language = "Teanga"
 toggleAnnotations = "Infheictheacht Anótálacha a Athrú"
+toggleLayers = "Scoránaigh Sraitheanna"
 search = "Cuardaigh PDF"
 panMode = "Mód Pan"
 applyRedactionsFirst = "Cuir eagarthóireachtaí i bhfeidhm ar dtús"
@@ -5407,20 +5827,72 @@ title = "Priontáil Comhad"
 2 = "Cuir isteach Ainm an Phrintéara"
 
 [quickAccess]
+access = "Rochtain"
+accessAddPerson = "Cuir duine eile leis"
+accessBack = "Ar ais"
+accessCopyLink = "Cóipeáil nasc"
+accessEmail = "Seoladh Ríomhphoist"
+accessEmailPlaceholder = "name@company.com"
+accessFileLabel = "Comhad"
+accessGeneral = "Rochtain Ghinearálta"
+accessInviteTitle = "Tabhair cuireadh do dhaoine"
+accessOwner = "Úinéir"
+accessPanel = "Rochtain doiciméid"
+accessPeople = "Daoine a bhfuil rochtain acu"
+accessRemove = "Bain"
+accessRestricted = "Srianta"
+accessRestrictedHint = "Ní féidir ach le daoine a bhfuil rochtain acu a oscailt"
+accessRole = "Ról"
+accessRoleCommenter = "Tráchtaire"
+accessRoleEditor = "Eagarthóir"
+accessRoleViewer = "Amharcóir"
+accessSelectedFile = "Comhad roghnaithe"
+accessSendInvite = "Seol Cuireadh"
+accessTitle = "Rochtain ar Dhoiciméad"
+accessYou = "Tusa"
 account = "Cuntas"
+activeSessions = "Seisiúin Ghníomhacha"
+activeTab = "Gníomhach"
 activity = "Stair"
 adminSettings = "Socruí riar."
+allSessions = "Gach Seisiún"
 allTools = "All Tools"
 automate = "Auto"
+back = "Ar ais"
+certSign = "Sínigh le Teastas"
+completedSessions = "Seisiúin Chríochnaithe"
+completedTab = "Críochnaithe"
 config = "Cumraigh"
+createNew = "Cruthaigh Iarratas Nua"
+createSession = "Cruthaigh Iarratas Sínithe"
+dueDate = "Spriocdháta (roghnach)"
 files = "Comhaid"
 help = "Cabhair"
+noActiveSessions = "Níl aon iarratais sínithe ar feitheamh ná seisiúin ghníomhacha"
+noCompletedSessions = "Níl aon seisiúin chríochnaithe"
+noFile = "Níl comhad roghnaithe"
 read = "Léigh"
 reader = "Léamh"
+refresh = "Athnuaigh"
+requestSignatures = "Iarraigh Sínithe"
+selectSingleFileToRequest = "Roghnaigh comhad PDF aonair chun sínithe a iarraidh"
+selectedFile = "Comhad roghnaithe"
+selectUsers = "Roghnaigh úsáideoirí le síniú"
+selectUsersPlaceholder = "Roghnaigh rannpháirtithe..."
+sendingRequest = "� sheoladh..."
 settings = "Socruí"
 showMeAround = "Taispeáin dom timpeall"
 sign = "Sínigh"
+signatureRequests = "Iarratais Shínithe"
+signYourself = "Sínigh Tú Féin"
+newRequest = "Iarratas Nua"
 tours = "Turais"
+wetSign = "Cuir Síniú Leis"
+filterMine = "Mise"
+filterOverdue = "Thar téarma"
+filterSigned = "Sínithe"
+filterDeclined = "Diúltaithe"
+searchDocuments = "Cuardaigh doiciméid…"
 
 [quickAccess.helpMenu]
 adminTour = "Turas an Riarthóra"
@@ -6050,11 +6522,75 @@ toolNotAvailableLocally = "Tá do fhreastalaí Stirling-PDF as líne agus níl \
 expired = "Tá do sheisiún imithe in éag. Athnuaigh an leathanach agus bain triail eile as."
 refreshPage = "Athnuaigh an Leathanach"
 
+[sessionManagement.tooltip]
+header = "Bainistiú Seisiúin Shínithe"
+
+[sessionManagement.tooltip.addParticipants]
+bullet1 = "Cuirtear rannpháirtithe nua leis ag deireadh an orduithe sínithe"
+bullet2 = "Ní féidir rannpháirtithe a chur leis tar éis an seisiún a bheith críochnaithe"
+bullet3 = "Faigheann gach rannpháirtí fógra nuair is é a seal é"
+description = "Is féidir leat níos mó rannpháirtithe a chur le seisiún gníomhach am ar bith roimh an gcríochniú."
+title = "Rannpháirtithe a Chur Leis"
+
+[sessionManagement.tooltip.finalization]
+bullet1 = "<b>Críochnú iomlán</b>: Tá gach rannpháirtí tar éis síniú"
+bullet2 = "<b>Críochnú páirteach</b>: Níl cuid de na rannpháirtithe tar éis síniú fós"
+bullet3 = "Ní áireofar rannpháirtithe gan síniú sa doiciméad deiridh"
+bullet4 = "Nuair a bheidh sé críochnaithe, is féidir an PDF sínithe a lódáil isteach sna comhaid ghníomhacha"
+description = "Comhcheanglaíonn an críochnú gach síniú isteach i PDF sínithe amháin. Ní féidir an gníomh seo a chur ar ceal."
+title = "Críochnú an tSeisiúin"
+
+[sessionManagement.tooltip.participantRemoval]
+bullet1 = "Ní féidir rannpháirtithe a bhaint a bhfuil síniú déanta acu cheana"
+bullet2 = "Ní bhfaighidh rannpháirtithe bainte fógraí a thuilleadh"
+bullet3 = "Coigeartaítear ord an tsínithe go huathoibríoch"
+description = "Is féidir rannpháirtithe a bhaint as seisiúin sula síníonn siad."
+title = "Rannpháirtithe a Bhaint"
+
+[sessionManagement.tooltip.signatureOrder]
+bullet1 = "Cuirtear gach síniú i bhfeidhm ar an PDF go seicheamhach"
+bullet2 = "Is féidir le sínitheoirí níos déanaí sínithe níos luaithe a fheiceáil"
+bullet3 = "Riachtanach do shreabha oibre formheasa agus do shlabhraí coimeádta dlíthiúla"
+description = "Socraíonn an t-ord a shonraíonn tú nuair a chruthaíonn tú an seisiún cé a shíníonn ar dtús."
+title = "Ord an tSínithe"
+
+[signatureSettings.tooltip]
+header = "Socruithe Cuma Sínithe"
+
+[signatureSettings.tooltip.location]
+bullet1 = "Examples: \"New York, USA\", \"London Office\", \"Remote\""
+bullet2 = "Ní ionann é agus suíomh an leathanaigh"
+bullet3 = "D'fhéadfadh sé a bheith riachtanach i ndlínsí áirithe"
+description = "Suíomh geografach roghnach ina cuireadh an síniú i bhfeidhm. Stóráiltear i meiteashonraí an teastais."
+title = "Suíomh an tSínithe"
+
+[signatureSettings.tooltip.logo]
+bullet1 = "Le taispeáint in aice leis an síniú agus an téacs"
+bullet2 = "Tacaíonn sé le formáidí PNG, JPG"
+bullet3 = "Feabhsaíonn sé cuma ghairmiúil"
+description = "Cuir lógó cuideachta le sínithe infheicthe chun brandáil agus barántúlacht a threisiú."
+title = "Lógó Cuideachta"
+
+[signatureSettings.tooltip.reason]
+bullet1 = "Examples: \"Approval\", \"Contract Agreement\", \"Review Complete\""
+bullet2 = "Le feiceáil in airíonna an tsínithe PDF"
+bullet3 = "Fóinteach do rianta iniúchta agus comhlíontacht"
+description = "Téacs roghnach ag míniú cén fáth a bhfuil an doiciméad á shíniú. Stóráiltear i meiteashonraí an teastais."
+title = "Fáth an tSínithe"
+
+[signatureSettings.tooltip.visibility]
+bullet1 = "<b>Infheicthe</b>: Tá an síniú le feiceáil ar an PDF le cuma shaincheaptha"
+bullet2 = "<b>Dofheicthe</b>: Teastas leabaithe gan marc amhairc"
+bullet3 = "Soláthraíonn sínithe dofheicthe bailíochtú cripteagrafach fós"
+description = "Rialaíonn sé an bhfuil an síniú infheicthe ar an doiciméad nó leabaithe go dofheicthe."
+title = "Infheictheacht an tSínithe"
+
 [settings.configuration]
 advanced = "Ardroghanna"
 database = "Bunachar Sonraí"
 endpoints = "Deirphointí"
 features = "Gnéithe"
+storageSharing = "Stóráil Comhad agus Comhroinnt"
 systemSettings = "Socruithe Córais"
 title = "Cumraíocht"
 
@@ -6332,10 +6868,13 @@ title = "Sínigh isteach i Stirling"
 [setup.selfhosted]
 link = "nó ceangail le cuntas féinóstáilte"
 subtitle = "Cuir isteach dintiúir do fhreastalaí"
+changeServerLocked = "Tá do eagraíocht tar éis an aip seo a shrianadh le freastalaí ar leith"
 switchToLocal = "Úsáid uirlisí áitiúla ina n-ionad"
 title = "Sínigh isteach chuig an bhFreastalaí"
 
 [setup.selfhosted.unreachable]
+changeServer = "Ceangail le freastalaí eile"
+changeServerLocked = "Tá do eagraíocht tar éis an aip seo a shrianadh le freastalaí ar leith"
 continueOffline = "Úsáid uirlisí áitiúla ina n-ionad"
 message = "Níorbh fhéidir {{url}} a bhaint amach. Seiceáil go bhfuil an freastalaí ag rith agus inrochtana."
 retry = "Atriail"
@@ -6529,6 +7068,15 @@ saved = "Sábháilte"
 text = "Téacs"
 title = "Cineál Sínithe"
 
+[signRequest]
+declined = "Diúltaíodh an t-iarratas sínithe"
+fetchFailed = "Theip ar iarratas sínithe a lódáil"
+signed = "D'éirigh le síniú an doiciméid"
+
+[signSession]
+createFailed = "Theip ar iarratas sínithe a chruthú"
+created = "Seoladh an t-iarratas sínithe"
+
 [signup]
 accountCreatedSuccessfully = "Cruthaíodh an cuntas go rathúil! Is féidir leat logáil isteach anois."
 alreadyHaveAccount = "An bhfuil cuntas agat cheana? Logáil isteach"
@@ -6807,6 +7355,106 @@ title = "Scoil PDF de réir Caibidlí"
 [splitPdfByChapters]
 tags = "scoilt, caibidlí, leabharmharcanna, eagraigh"
 
+[storageShare]
+accessed = "Rochtain déanta"
+accessDenied = "Níl rochtain agat ar an gcomhad comhroinnte seo. Iarr ar an úinéir é a roinnt leat."
+accessFailed = "Níorbh fhéidir an ghníomhaíocht a lódáil."
+accessDeniedBody = "Níl rochtain agat ar an gcomhad seo. Iarr ar an úinéir é a roinnt leat."
+accessDeniedTitle = "Gan rochtain"
+accessLimitedCommenter = "Tá rochtain tráchtála ag teacht go luath. Iarr ar an úinéir rochtain eagarthóra má theastaíonn uait íoslódáil."
+accessLimitedTitle = "Rochtain theoranta"
+accessLimitedViewer = "Is le haghaidh amhairc amháin an nasc seo. Iarr ar an úinéir rochtain eagarthóra má theastaíonn uait íoslódáil."
+createdAt = "Cruthaithe"
+download = "�oslódáil"
+downloadFailed = "Níorbh fhéidir an comhad seo a íoslódáil."
+expiredBody = "Tá an nasc comhroinnte seo neamhbhailí nó tá sé imithe in éag."
+expiredTitle = "Nasc imithe in éag"
+goToLogin = "Téigh go dtí an logáil isteach"
+loadFailed = "Níorbh fhéidir an comhad comhroinnte a oscailt."
+loading = "Nasc comhroinnte á lódáil..."
+loginPrompt = "Sínigh isteach chun rochtain a fháil ar an gcomhad comhroinnte seo."
+loginRequired = "Logáil isteach de dhíth"
+openInApp = "Oscail i Stirling PDF"
+ownerLabel = "Úinéir"
+ownerUnknown = "Anaithnid"
+requiresLogin = "Éilíonn an comhad comhroinnte seo logáil isteach."
+roleCommenter = "Tráchtaire"
+roleEditor = "Eagarthóir"
+roleViewer = "Amharcóir"
+shareHeading = "Comhad comhroinnte"
+titleDefault = "Comhad comhroinnte"
+tryAgain = "Bain triail eile as níos déanaí."
+addUser = "Cuir leis"
+commenterHint = "Tá tráchtáil ag teacht go luath."
+copied = "Cóipeáladh an nasc go dtí an ghearrthaisce"
+copy = "Cóipeáil"
+copyFailed = "Theip ar chóipeáil"
+description = "Cruthaigh nasc comhroinnte don chomhad seo. Is féidir le húsáideoirí sínithe isteach leis an nasc rochtain a fháil air."
+downloadsCount = "�oslódálacha: {{count}}"
+emailWarningBody = "Is cosúil gur seoladh ríomhphoist é seo. Mura bhfuil an duine seo ina úsáideoir Stirling PDF cheana, ní bheidh sé in ann rochtain a fháil ar an gcomhad."
+emailWarningConfirm = "Comhroinn mar sin féin"
+emailWarningTitle = "Seoladh ríomhphoist"
+errorTitle = "Theip ar chomhroinnt"
+failure = "Níorbh fhéidir nasc comhroinnte a ghiniúint. Bain triail eile as."
+fileLabel = "Comhad"
+generate = "Gin Nasc"
+generated = "Gineadh nasc comhroinnte"
+hideActivity = "Folaigh gníomhaíocht"
+invalidUsername = "Iontráil ainm úsáideora bailí nó seoladh ríomhphoist."
+lastAccessed = "Rochtain dheireanach"
+linkAccessTitle = "Rochtain an naisc chomhroinnte"
+linkLabel = "Nasc comhroinnte"
+linksDisabled = "Tá naisc chomhroinnte díchumasaithe."
+linksDisabledBody = "Tá naisc chomhroinnte díchumasaithe ag socruithe do fhreastalaí."
+manage = "Bainistigh comhroinnt"
+manageDescription = "Cruthaigh agus bainistigh naisc chun an comhad seo a roinnt."
+manageLoadFailed = "Níorbh fhéidir naisc chomhroinnte a lódáil."
+manageTitle = "Bainistigh Comhroinnt"
+noActivity = "Níl aon ghníomhaíocht fós."
+noLinks = "Níl aon naisc chomhroinnte gníomhacha fós."
+noSharedUsers = "Níl aon úsáideoirí le rochtain fós."
+removeLink = "Bain nasc"
+removeUser = "Bain"
+revokeFailed = "Níorbh fhéidir an nasc comhroinnte a bhaint."
+revoked = "Baineadh an nasc roinnte"
+roleLabel = "Ról"
+sharingDisabled = "Tá roinnt díchumasaithe."
+sharingDisabledBody = "Díchumasaíodh roinnt de bharr socruithe do fhreastalaí."
+sharedUsersTitle = "Úsáideoirí roinnte"
+title = "Roinn comhad"
+unknownUser = "Úsáideoir anaithnid"
+userAddFailed = "Níorbh fhéidir a roinnt leis an úsáideoir sin."
+userAdded = "Cuireadh an t-úsáideoir leis an liosta roinnte."
+usernameLabel = "Ainm úsáideora nó ríomhphost"
+usernamePlaceholder = "Cuir isteach ainm úsáideora nó ríomhphost"
+userRemoveFailed = "Níorbh fhéidir an t-úsáideoir sin a bhaint."
+userRemoved = "Baineadh an t-úsáideoir den liosta roinnte."
+viewActivity = "Féach ar ghníomhaíocht"
+viewed = "Feicthe"
+viewsCount = "Amharcanna: {{count}}"
+downloaded = "�osluchtaithe"
+bulkDescription = "Cruthaigh nasc amháin chun na comhaid roghnaithe go léir a roinnt le húsáideoirí logáilte isteach."
+bulkTitle = "Roinn na comhaid roghnaithe"
+copyLink = "Cóipeáil an nasc roinnte"
+fileCount = "{{count}} comhad roghnaithe"
+ownerOnly = "Ní féidir ach leis an úinéir roinnt a bhainistiú."
+selectSingleFile = "Roghnaigh comhad aonair chun roinnt a bhainistiú."
+
+[storageUpload]
+description = "Uaslódálann sé seo an comhad reatha chuig stóráil an fhreastalaí ionas gur féidir leat é a rochtain."
+errorTitle = "Theip ar an uaslódáil"
+failure = "Theip ar an uaslódáil. Seiceáil do shocruithe logála isteach agus stórála le do thoil."
+fileLabel = "Comhad"
+hint = "Rialaítear na naisc phoiblí agus na módanna rochtana le socruithe do fhreastalaí."
+success = "Uaslódáladh chuig an bhfreastalaí"
+title = "Uaslódáil chuig an bhfreastalaí"
+updateButton = "Nuashonraigh ar an bhfreastalaí"
+uploadButton = "Uaslódáil chuig an bhfreastalaí"
+bulkDescription = "Uaslódálann sé seo na comhaid roghnaithe chuig stóráil do fhreastalaí."
+bulkTitle = "Uaslódáil na comhaid roghnaithe"
+fileCount = "{{count}} comhad roghnaithe"
+more = " +{{count}} tuilleadh"
+
 [storage]
 approximateSize = "Méid thart"
 fileTooLarge = "Comhad ró‑mhór. Is é an méid uasta in aghaidh an chomhaid ná"
@@ -7153,6 +7801,30 @@ title = "Amharc/Cuir PDF in Eagar"
 [warning]
 tooltipTitle = "Rabhadh"
 
+[wetSignature.tooltip]
+header = "Modhanna chun síniú a chruthú"
+
+[wetSignature.tooltip.draw]
+bullet1 = "Saincheap dath agus tiús an pheann"
+bullet2 = "Glan agus tarraing arís go dtí go mbeidh tú sásta"
+bullet3 = "Oibríonn ar ghléasanna tadhaill (táibléid, fóin)"
+description = "Cruthaigh síniú lámhscríofa le do luchóg nó le do scáileán tadhaill. Is fearr é do shínithe pearsanta, barántúla."
+title = "Tarraing síniú"
+
+[wetSignature.tooltip.type]
+bullet1 = "Roghnaigh as iliomad clónna"
+bullet2 = "Saincheap méid agus dath an téacs"
+bullet3 = "Foirfe do shínithe caighdeánaithe"
+description = "Gin síniú ó théacs clóscríofa. Tapa agus comhsheasmhach, oiriúnach do cháipéisí gnó."
+title = "Clóscríobh síniú"
+
+[wetSignature.tooltip.upload]
+bullet1 = "Tacaíonn sé le PNG, JPG, agus formáidí íomhá eile"
+bullet2 = "Moltar cúlraí trédhearcacha chun na torthaí is fearr a bhaint amach"
+bullet3 = "Athrófar méid na híomhá chun an limistéar sínithe a oiriúnú"
+description = "Uaslódáil íomhá sínithe réamhdhéanta. Oiriúnach má tá síniú scanta nó lógó cuideachta agat."
+title = "Uaslódáil íomhá sínithe"
+
 [watermark]
 completed = "Comhartha uisce curtha leis"
 desc = "Cuir comharthaí uisce téacs nó íomhá le comhaid PDF"
@@ -7333,6 +8005,7 @@ activeSession = "Seisiún gníomhach"
 addMembers = "Cuir Baill Leis"
 admin = "Riarthóir"
 confirmDelete = "An bhfuil tú cinnte gur mian leat an t-úsáideoir seo a scriosadh? Ní féidir an gníomh seo a chur ar ceal."
+confirmUnlock = "An bhfuil tú cinnte gur mian leat an cuntas úsáideora seo a dhíghlasáil?"
 deleteUser = "Scrios Úsáideoir"
 deleteUserError = "Theip ar an úsáideoir a scriosadh"
 deleteUserSuccess = "Scriosadh an t-úsáideoir go rathúil"
@@ -7341,6 +8014,8 @@ disable = "Díchumasaigh"
 disabled = "Díchumasaithe"
 editRole = "Cuir Ról in Eagar"
 enable = "Cumasaigh"
+locked = "faoi ghlas"
+lockedBadge = "Faoi ghlas"
 loading = "Daoine á lódáil..."
 loginRequired = "Cumasaigh mód logála isteach ar dtús"
 member = "Ball"
@@ -7350,6 +8025,9 @@ searchMembers = "Cuardaigh baill..."
 status = "Stádas"
 team = "Foireann"
 title = "Daoine"
+unlockAccount = "Díghlasáil an cuntas"
+unlockUserError = "Theip ar dhíghlasáil an chuntais úsáideora"
+unlockUserSuccess = "Díghlasáladh an cuntas úsáideora go rathúil"
 user = "Úsáideoir"
 
 [workspace.people.actions]
diff --git a/frontend/public/locales/hi-IN/translation.toml b/frontend/public/locales/hi-IN/translation.toml
index c1bbe520af..012c6a72ef 100644
--- a/frontend/public/locales/hi-IN/translation.toml
+++ b/frontend/public/locales/hi-IN/translation.toml
@@ -8,6 +8,7 @@ black = "काला"
 blue = "नीला"
 bored = "इंतज़ार करते ह�� बोर हो रहे हैं?"
 cancel = "रद�द करें"
+confirm = "प�ष�टि करें"
 changedCredsMessage = "क�रेडेंशियल�स बदल दि� ग�!"
 chooseFile = "फ़ाइल च�नें"
 close = "बंद करें"
@@ -146,6 +147,7 @@ insufficientCredits = "पर�याप�त क�रेडिट�स न
 loadingCredits = "क�रेडिट�स की जा�च हो रही है..."
 loadingProStatus = "सदस�यता स�थिति की जा�च हो रही है..."
 noticeTopUpOrPlan = "पर�याप�त क�रेडिट�स नहीं हैं, कृपया टॉप अप करें या किसी प�लान में अपग�रेड करें"
+accessInvite = "आमंत�रित करें"
 
 [account]
 accountSettings = "खाता सेटिंग�स"
@@ -1427,6 +1429,34 @@ title = "प�रसंस�करण"
 description = "त�र�टि रिपोर�ट करने से पहले प�रोसेसिंग जॉब के लि� प�रतीक�षा का अधिकतम समय।"
 label = "प�रोसेसिंग टाइमआउट (सेकंड)"
 
+[admin.settings.storage]
+description = "सर�वर भंडारण और शेयरिंग विकल�प नियंत�रित करें।"
+title = "फ़ाइल भंडारण और शेयरिंग"
+
+[admin.settings.storage.enabled]
+description = "उपयोगकर�ताओं को सर�वर पर फ़ाइलें संग�रहीत करने की अन�मति दें।"
+label = "सर�वर फ़ाइल भंडारण सक�षम करें"
+
+[admin.settings.storage.sharing.email]
+description = "ईमेल पतों के साथ शेयरिंग की अन�मति दें।"
+label = "ईमेल शेयरिंग सक�षम करें"
+mailLink = "मेल सेटिंग�स कॉन�फ़िगर करें"
+mailNote = "मेल कॉन�फ़िगरेशन आवश�यक है। "
+
+[admin.settings.storage.sharing.enabled]
+description = "उपयोगकर�ताओं को संग�रहीत फ़ाइलें सा�ा करने की अन�मति दें।"
+label = "शेयरिंग सक�षम करें"
+
+[admin.settings.storage.sharing.links]
+description = "साइन-इन लिंक के माध�यम से शेयरिंग की अन�मति दें।"
+frontendUrlLink = "सिस�टम सेटिंग�स में कॉन�फ़िगर करें"
+frontendUrlNote = "�क Frontend URL आवश�यक है। "
+label = "शेयर लिंक सक�षम करें"
+
+[admin.settings.storage.signing.enabled]
+description = "उपयोगकर�ताओं को बह�-प�रतिभागी दस�तावेज़ हस�ताक�षर सत�र बनाने की अन�मति दें। इसके लि� सर�वर फ़ाइल भंडारण सक�षम होना आवश�यक है।"
+label = "समूह हस�ताक�षर सक�षम करें (अल�फा)"
+
 [admin.settings.unsavedChanges]
 cancel = "संपादन जारी रखें"
 discard = "परिवर�तन त�यागें"
@@ -2059,7 +2089,19 @@ numbers = "संख�या��/रेंज: 5, 10-20"
 progressions = "प�रोग�रेशन: 3n, 4n+1"
 
 [certSign]
+allSigned = "सभी प�रतिभागियों ने हस�ताक�षर कर दि� हैं। अंतिम रूप देने के लि� तैयार।"
+awaitingSignatures = "हस�ताक�षरों की प�रतीक�षा"
+signatureProgress = "{{signedCount}}/{{totalCount}} हस�ताक�षर"
 chooseCertificate = "प�रमाणपत�र फ़ाइल च�नें"
+declined = "अस�वीकृत"
+fetchFailed = "हस�ताक�षर डेटा लोड करने में विफल"
+finalized = "अंतिम रूप दिया गया"
+notified = "लंबित"
+partialNote = "आप वर�तमान हस�ताक�षरों के साथ पहले ही अंतिम रूप दे सकते हैं। बिना हस�ताक�षर वाले प�रतिभागियों को बाहर रखा जा�गा।"
+pending = "लंबित"
+readyToFinalize = "अंतिम रूप देने के लि� तैयार"
+signed = "हस�ताक�षरित"
+viewed = "देखा गया"
 chooseJksFile = "JKS फ़ाइल च�नें"
 chooseP12File = "PKCS12 फ़ाइल च�नें"
 choosePfxFile = "PFX फ़ाइल च�नें"
@@ -2082,6 +2124,7 @@ title = "प�रमाणपत�र हस�ताक�षर"
 invisible = "अदृश�य"
 stepTitle = "हस�ताक�षर का रूप"
 visible = "दृश�यमान"
+visibility = "दृश�यता"
 
 [certSign.appearance.options]
 title = "हस�ताक�षर विवरण"
@@ -2188,6 +2231,252 @@ bullet4 = "सत�यापन के लि� कस�टम प�रम
 text = "जब आप हस�ताक�षरों की जा�च करते हैं, तो टूल बताता है कि वे वैध हैं या नहीं, किसने दस�तावेज़ पर हस�ताक�षर कि�, कब कि�, और हस�ताक�षर के बाद दस�तावेज़ में कोई बदलाव ह�आ है या नहीं।"
 title = "हस�ताक�षर की जा�च"
 
+[certSign.collab.finalize]
+button = "अंतिम रूप दें और हस�ताक�षरित PDF लोड करें"
+early = "वर�तमान हस�ताक�षरों के साथ अंतिम रूप दें"
+
+[certSign.collab.sessionDetail]
+addButton = "प�रतिभागी जोड़ें"
+addParticipants = "प�रतिभागी जोड़ें"
+addParticipantsError = "प�रतिभागी जोड़ने में विफल"
+backToList = "सत�रों पर वापस"
+deleteConfirm = "क�या आप स�निश�चित हैं? इसे वापस नहीं लिया जा सकता।"
+deleteError = "सत�र हटाने में विफल"
+deleted = "सत�र हटाया गया"
+deleteSession = "सत�र हटा�ं"
+dueDate = "नियत तिथि"
+finalizeError = "सत�र अंतिम रूप देने में विफल"
+loadPdfError = "हस�ताक�षरित PDF लोड करने में विफल"
+loadSignedPdf = "हस�ताक�षरित PDF को सक�रिय फ़ाइलों में लोड करें"
+messageLabel = "संदेश"
+noAdditionalInfo = "कोई अतिरिक�त जानकारी नहीं"
+owner = "मालिक"
+participantRemoved = "प�रतिभागी हटाया गया"
+participants = "प�रतिभागी"
+participantsAdded = "प�रतिभागी सफलतापूर�वक जोड़े ग�"
+removeParticipant = "हटा��"
+removeParticipantError = "प�रतिभागी हटाने में विफल"
+selectUsers = "उपयोगकर�ता च�नें..."
+sessionInfo = "सत�र जानकारी"
+workbenchTitle = "सत�र प�रबंधन"
+
+[certSign.collab.signRequest]
+addedToFiles = "दस�तावेज़ सक�रिय फ़ाइलों में जोड़ा गया"
+addSignature = "अपना हस�ताक�षर जोड़ें"
+addToFiles = "सक�रिय फ़ाइलों में जोड़ें"
+advancedSettings = "उन�नत सेटिंग�स"
+backToList = "हस�ताक�षर अन�रोधों पर वापस"
+certificateChoice = "हस�ताक�षर करने के लि� �क प�रमाणपत�र च�नें"
+changeSignature = "हस�ताक�षर बदलें"
+clearSignature = "हस�ताक�षर साफ़ करें"
+completeAndSign = "पूर�ण करें और हस�ताक�षर करें"
+createNewSignature = "नया हस�ताक�षर बना�ं"
+declineButton = "अस�वीकार करें"
+decline = "अन�रोध अस�वीकार करें"
+deleteSelected = "चयनित हस�ताक�षर हटा��"
+drawSignature = "नीचे अपना हस�ताक�षर बना�ं"
+dueDate = "नियत तिथि"
+fileTooLarge = "फ़ाइल आकार 5MB से कम होना चाहि�"
+fontFamily = "फ़ॉन�ट परिवार"
+fontSize = "फ़ॉन�ट आकार: {{size}}px"
+fontSizePlaceholder = "आकार"
+from = "प�रेषक"
+invalidCertFile = "कृपया P12 या PFX प�रमाणपत�र फ़ाइल च�नें"
+invalidFileType = "कृपया �क छवि फ़ाइल च�नें"
+location = "स�थान (वैकल�पिक)"
+locationPlaceholder = "आप कहा� से हस�ताक�षर कर रहे हैं?"
+message = "संदेश"
+noCertificate = "कृपया �क प�रमाणपत�र फ़ाइल च�नें"
+noSignatures = "कृपया PDF पर कम से कम �क हस�ताक�षर रखें"
+p12File = "P12/PFX प�रमाणपत�र फ़ाइल"
+password = "प�रमाणपत�र पासवर�ड"
+passwordPlaceholder = "पासवर�ड दर�ज करें..."
+penColor = "पेन का रंग"
+penSize = "पेन आकार: {{size}}px"
+placementActive = "रखने के लि� PDF पर क�लिक करें"
+placeSignatureButton = "PDF पर हस�ताक�षर रखें"
+reason = "कारण (वैकल�पिक)"
+reasonPlaceholder = "आप क�यों हस�ताक�षर कर रहे हैं?"
+removeImage = "छवि हटा��"
+removeCertFile = "फ़ाइल हटा��"
+savedSignatures = "सहेजे ग� हस�ताक�षर"
+selectFile = "छवि फ़ाइल च�नें"
+selectSignatureTitle = "हस�ताक�षर च�नें या बना��"
+signButton = "दस�तावेज़ पर हस�ताक�षर करें"
+signatureInfo = "ये सेटिंग�स दस�तावेज़ के मालिक द�वारा कॉन�फ़िगर की गई हैं"
+signaturePlaced = "पृष�ठ पर हस�ताक�षर रखा गया"
+signatureSettings = "हस�ताक�षर सेटिंग�स"
+signatureText = "हस�ताक�षर पाठ"
+signatureTextPlaceholder = "अपना नाम दर�ज करें..."
+signatureTypeLabel = "हस�ताक�षर प�रकार"
+signingTitle = "हस�ताक�षर करना"
+textColor = "पाठ का रंग"
+typeSignature = "हस�ताक�षर बनाने के लि� अपना नाम टाइप करें"
+uploadCert = "कस�टम प�रमाणपत�र"
+uploadCertDesc = "अपना P12/PFX प�रमाणपत�र उपयोग करें"
+uploadSignature = "अपने हस�ताक�षर की छवि अपलोड करें"
+usePersonalCert = "व�यक�तिगत प�रमाणपत�र"
+usePersonalCertDesc = "आपके खाते के लि� स�वतः जनरेटेड"
+useServerCert = "संगठन प�रमाणपत�र"
+useServerCertDesc = "सा�ा संगठन प�रमाणपत�र"
+workbenchTitle = "हस�ताक�षर अन�रोध"
+
+[certSign.collab.signRequest.canvas]
+colorPickerTitle = "स�ट�रोक का रंग च�नें"
+continue = "जारी रखें"
+
+[certSign.collab.signRequest.certModal]
+description = "आपने {{count}} हस�ताक�षर रखे हैं। हस�ताक�षर पूर�ण करने के लि� अपना प�रमाणपत�र च�नें।"
+sign = "दस�तावेज़ पर हस�ताक�षर करें"
+certValidating = "प�रमाणपत�र सत�यापित किया जा रहा है..."
+certValidUntil = "प�रमाणपत�र {{date}} तक मान�य"
+certInvalid = "प�रमाणपत�र अमान�य: {{error}}"
+certInvalidFallback = "अमान�य प�रमाणपत�र"
+certNetworkError = "प�रमाणपत�र सत�यापित नहीं कर सके"
+title = "प�रमाणपत�र कॉन�फ़िगर करें"
+
+[certSign.collab.signRequest.image]
+hint = "अपने हस�ताक�षर की PNG या JPG छवि अपलोड करें"
+
+[certSign.collab.signRequest.mode]
+move = "हस�ताक�षर स�थानांतरित करें"
+place = "हस�ताक�षर रखें"
+title = "साइन या मूव मोड"
+
+[certSign.collab.signRequest.modeTabs]
+draw = "ड�रा"
+image = "अपलोड"
+text = "टाइप"
+
+[certSign.collab.signRequest.placeSignature]
+message = "अपने हस�ताक�षर रखने के लि� PDF पर क�लिक करें"
+title = "हस�ताक�षर रखें"
+
+[certSign.collab.signRequest.preview]
+imageAlt = "चयनित हस�ताक�षर"
+missing = "कोई पूर�वावलोकन नहीं"
+textFallback = "हस�ताक�षर"
+
+[certSign.collab.signRequest.saved]
+defaultCanvasLabel = "ड�रॉ किया गया हस�ताक�षर"
+defaultImageLabel = "अपलोड किया ह�आ हस�ताक�षर"
+defaultLabel = "हस�ताक�षर"
+defaultTextLabel = "टाइप किया ह�आ हस�ताक�षर"
+delete = "हस�ताक�षर हटा��"
+none = "कोई सहेजे ग� हस�ताक�षर नहीं"
+
+[certSign.collab.signRequest.signatureType]
+draw = "ड�रा"
+type = "टाइप"
+upload = "अपलोड"
+
+[certSign.collab.signRequest.steps]
+back = "वापस"
+cancelPlacement = "रखना रद�द करें"
+certificate = "प�रमाणपत�र"
+clickMultipleTimes = "हस�ताक�षर रखने के लि� PDF पर कई बार क�लिक करें। किसी भी हस�ताक�षर को खींचकर स�थानांतरित या आकार बदलें।"
+clickToPlace = "जहा� आप अपना हस�ताक�षर दिखाना चाहते हैं वहा� PDF पर क�लिक करें।"
+continue = "प�रमाणपत�र चयन पर जारी रखें"
+continueToPlacement = "रखने पर जारी रखें"
+continueToReview = "समीक�षा पर जारी रखें"
+createSignature = "हस�ताक�षर बना�ं"
+invisible = "अदृश�य"
+location = "स�थान:"
+multipleSignatures = "{{count}} हस�ताक�षर PDF पर लागू होंगे"
+oneSignature = "1 हस�ताक�षर PDF पर लागू होगा"
+placeOnPdf = "PDF पर रखें"
+reason = "कारण:"
+reviewTitle = "हस�ताक�षर करने से पहले समीक�षा करें"
+signaturePlaced = "पृष�ठ {{page}} पर हस�ताक�षर रखा गया। आप प�नः क�लिक करके स�थिति समायोजित कर सकते हैं या समीक�षा पर आगे बढ़ें।"
+visible = "दृश�यमान"
+visibility = "दृश�यता:"
+yourSignatures = "आपके हस�ताक�षर ({{count}})"
+
+[certSign.collab.signRequest.text]
+colorLabel = "रंग"
+fontLabel = "फ़ॉन�ट"
+fontSizeLabel = "आकार"
+fontSizePlaceholder = "16"
+label = "हस�ताक�षर पाठ"
+modalHint = "अपना नाम दर�ज करें, फिर इसे PDF पर रखने के लि� जारी रखें पर क�लिक करें।"
+placeholder = "अपना नाम दर�ज करें..."
+
+[certSign.collab.participant]
+certValidating = "प�रमाणपत�र सत�यापित किया जा रहा है..."
+certValid = "✓ प�रमाणपत�र मान�य"
+certValidUntil = " {{date}} तक"
+certInvalid = "✗ {{error}}"
+certInvalidFallback = "अमान�य प�रमाणपत�र"
+certNetworkError = "प�रमाणपत�र सत�यापित नहीं कर सके"
+
+[certSign.collab.addParticipants]
+add = "{{count}} प�रतिभागी जोड़ें"
+back = "वापस"
+configureSignatures = "हस�ताक�षर सेटिंग�स कॉन�फ़िगर करें"
+continue = "हस�ताक�षर सेटिंग�स पर जारी रखें"
+reasonHelp = "इन प�रतिभागियों के लि� पहले से हस�ताक�षर का कारण निर�धारित करें (वैकल�पिक, वे हस�ताक�षर करते समय बदल सकते हैं)"
+reasonPlaceholder = "जैसे: मंजूरी, समीक�षा..."
+selectUsers = "उपयोगकर�ता च�नें"
+
+[certSign.collab.sessionCreation]
+includeSummaryPage = "हस�ताक�षर सारांश पृष�ठ शामिल करें"
+includeSummaryPageHelp = "अंत में सभी हस�ताक�षर मेटाडेटा के साथ �क सारांश पृष�ठ जोड़ा जा�गा। व�यक�तिगत पृष�ठों पर डिजिटल प�रमाणपत�र हस�ताक�षर बॉक�स दबा दि� जा�ंगे (वेट हस�ताक�षरों पर कोई प�रभाव नहीं पड़ेगा)।"
+
+[certSign.collab.sessionList]
+active = "सक�रिय"
+finalized = "अंतिम रूप दिया गया"
+
+[certSign.collab.signatureSettings]
+description = "सभी प�रतिभागियों के लि� हस�ताक�षर कैसे दिखेंगे, कॉन�फ़िगर करें"
+title = "हस�ताक�षर रूप"
+
+[certSign.collab.userSelector]
+inviteUsers = "उपयोगकर�ता जोड़ें"
+loadError = "उपयोगकर�ता लोड करने में विफल"
+noTeam = "कोई टीम नहीं"
+noUsers = "अन�य कोई उपयोगकर�ता नहीं मिला।"
+placeholder = "उपयोगकर�ता च�नें..."
+
+[certSign.mobile]
+panelActions = "क�रिया�ं"
+panelDocument = "दस�तावेज़"
+panelPeople = "लोग"
+
+[certSign.sessions]
+deleted = "सत�र हटाया गया"
+fetchFailed = "सत�र विवरण लोड करने में विफल"
+finalized = "सत�र अंतिम रूप दिया गया"
+loaded = "हस�ताक�षरित PDF लोड हो गया"
+pdfNotReady = "PDF तैयार नहीं है"
+pdfNotReadyDesc = "हस�ताक�षरित PDF जनरेट किया जा रहा है। कृपया थोड़ी देर बाद प�नः प�रयास करें।"
+
+[certificateChoice.tooltip]
+header = "प�रमाणपत�र प�रकार"
+
+[certificateChoice.tooltip.organization]
+bullet1 = "सिस�टम प�रशासकों द�वारा प�रबंधित"
+bullet2 = "अधिकृत उपयोगकर�ताओं के बीच सा�ा"
+bullet3 = "व�यक�ति नहीं, कंपनी की पहचान दर�शाता है"
+bullet4 = "उपय�क�त: आधिकारिक दस�तावेज़, टीम हस�ताक�षर"
+description = "आपके संगठन द�वारा प�रदान किया गया �क सा�ा प�रमाणपत�र। कंपनी-स�तर के हस�ताक�षर अधिकार के लि� उपयोग होता है।"
+title = "संगठन प�रमाणपत�र"
+
+[certificateChoice.tooltip.personal]
+bullet1 = "पहली बार उपयोग पर स�वतः जनरेट होता है"
+bullet2 = "आपके उपयोगकर�ता खाते से सम�बद�ध"
+bullet3 = "अन�य उपयोगकर�ताओं के साथ सा�ा नहीं किया जा सकता"
+bullet4 = "उपय�क�त: व�यक�तिगत दस�तावेज़, व�यक�तिगत उत�तरदायित�व"
+description = "आपके उपयोगकर�ता खाते के लि� विशिष�ट स�वतः-जनरेटेड प�रमाणपत�र। व�यक�तिगत हस�ताक�षरों के लि� उपय�क�त।"
+title = "व�यक�तिगत प�रमाणपत�र"
+
+[certificateChoice.tooltip.upload]
+bullet1 = "P12/PFX फ़ाइल और पासवर�ड आवश�यक"
+bullet2 = "बाहरी Certificate Authorities द�वारा जारी किया जा सकता है"
+bullet3 = "कानूनी दस�तावेज़ों के लि� उच�च विश�वसनीयता"
+bullet4 = "उपय�क�त: कानूनी रूप से बाध�यकारी अन�बंध, बाहरी सत�यापन"
+description = "अपनी PKCS#12 प�रमाणपत�र फ़ाइल का उपयोग करें। प�रमाणपत�र ग�णों पर पूर�ण नियंत�रण देता है।"
+title = "कस�टम P12 अपलोड करें"
+
 [changeCreds]
 changePassword = "आप डिफ़ॉल�ट लॉगिन क�रेडेंशियल�स का उपयोग कर रहे हैं। कृपया �क नया पासवर�ड दर�ज करें"
 changeUsername = "अपना उपयोगकर�ता नाम अपडेट करें। अपडेट के बाद आप लॉगआउट हो जा��गे।"
@@ -3242,6 +3531,46 @@ totalSelected = "क�ल चयनित"
 unsupported = "असमर�थित"
 unzip = "अनज़िप"
 uploadError = "क�छ फ़ाइलें अपलोड करने में विफल।"
+copyCreated = "कॉपी इस डिवाइस पर सहेजी गई।"
+copyFailed = "कॉपी नहीं बना सके।"
+leaveShare = "मेरी सूची से हटा��"
+leaveShareFailed = "सा�ा फ़ाइल नहीं हटा सके।"
+leaveShareSuccess = "आपकी सा�ा सूची से हटाया गया।"
+removeBoth = "दोनों से हटा��"
+removeFilePrompt = "यह फ़ाइल इस डिवाइस और आपके सर�वर पर सहेजी गई है। आप इसे कहा� से हटाना चाहेंगे?"
+removeFileTitle = "फ़ाइल हटा��"
+removeLocalOnly = "केवल इस डिवाइस से"
+removeServerFailed = "फ़ाइल को सर�वर से नहीं हटा सके।"
+removeServerOnly = "केवल सर�वर से"
+removeServerOnlyPrompt = "यह फ़ाइल केवल आपके सर�वर पर संग�रहीत है। क�या आप इसे सर�वर से हटाना चाहते हैं?"
+removeServerSuccess = "सर�वर से हटाया गया।"
+removeSharedPrompt = "यह फ़ाइल आपके साथ सा�ा की गई है। आप इसे इस डिवाइस से या अपनी सा�ा सूची से हटा सकते हैं।"
+removeSharedServerOnlyBlockedPrompt = "यह फ़ाइल आपके साथ सा�ा की गई है और केवल सर�वर पर संग�रहीत है।"
+removeSharedServerOnlyPrompt = "यह फ़ाइल आपके साथ सा�ा की गई है और केवल सर�वर पर संग�रहीत है। क�या इसे अपनी सूची से हटा��?"
+changesNotUploaded = "परिवर�तन अपलोड नहीं ह��"
+cloudFile = "क�लाउड फ़ाइल"
+filterAll = "सभी"
+filterLocal = "स�थानीय"
+filterSharedByMe = "मेरे द�वारा सा�ा"
+filterSharedWithMe = "मेरे साथ सा�ा"
+lastSynced = "अंतिम सिंक"
+localOnly = "केवल स�थानीय"
+makeCopy = "�क प�रति बना��"
+owner = "मालिक"
+ownerUnknown = "अज�ञात"
+share = "शेयर करें"
+shareSelected = "चयनित सा�ा करें"
+sharedByYou = "आपके द�वारा सा�ा"
+sharedEditNoticeBody = "आपके पास इस फ़ाइल के सर�वर संस�करण को संपादित करने का अधिकार नहीं है। आपके द�वारा कि� ग� किसी भी संपादन को �क स�थानीय प�रति के रूप में सहेजा जा�गा।"
+sharedEditNoticeConfirm = "ठीक है"
+sharedEditNoticeTitle = "सिर�फ पढ़ने योग�य सर�वर प�रति"
+sharedWithYou = "आपके साथ सा�ा"
+sharing = "शेयरिंग"
+storageState = "भंडारण"
+synced = "सिंक किया गया"
+updateOnServer = "सर�वर पर अपडेट करें"
+uploadSelected = "चयनित अपलोड करें"
+uploadToServer = "सर�वर पर अपलोड करें"
 
 [files]
 addFiles = "फ़ाइलें जोड़ें"
@@ -3367,6 +3696,77 @@ title = "PDF फ�लैटन करने के बारे में"
 discord = "Discord"
 issues = "GitHub"
 
+[groupSigning.tooltip]
+header = "समूह हस�ताक�षर के बारे में"
+
+[groupSigning.tooltip.finalization]
+bullet1 = "सभी हस�ताक�षर आपके द�वारा निर�दिष�ट प�रतिभागी क�रम में लागू होते हैं"
+bullet2 = "आवश�यक होने पर आप आंशिक हस�ताक�षरों के साथ अंतिम रूप दे सकते हैं"
+bullet3 = "�क बार अंतिम रूप देने के बाद, सत�र संशोधित नहीं किया जा सकता"
+description = "जब सभी प�रतिभागी हस�ताक�षर कर लें (या आप पहले अंतिम रूप देना च�नें), तो आप अंतिम हस�ताक�षरित PDF जनरेट कर सकते हैं।"
+title = "अंतिमकरण प�रक�रिया"
+
+[groupSigning.tooltip.roles]
+bullet1 = "मालिक (आप): सत�र बनाते हैं, डिफ़ॉल�ट हस�ताक�षर कॉन�फ़िगर करते हैं, दस�तावेज़ को अंतिम रूप देते हैं"
+bullet2 = "प�रतिभागी: अपना हस�ताक�षर बनाते हैं, प�रमाणपत�र च�नते हैं, PDF पर रखते हैं"
+bullet3 = "प�रतिभागी हस�ताक�षर की दृश�यता, कारण, या स�थान सेटिंग�स संशोधित नहीं कर सकते"
+description = "आप सभी प�रतिभागियों के लि� हस�ताक�षर रूप सेटिंग�स नियंत�रित करते हैं।"
+title = "प�रतिभागी भूमिका�ं"
+
+[groupSigning.tooltip.sequential]
+bullet1 = "दूसरा प�रतिभागी दस�तावेज़ तक पह��चने से पहले पहले को हस�ताक�षर करना होगा"
+bullet2 = "कानूनी अन�पालन के लि� सही हस�ताक�षर क�रम स�निश�चित करता है"
+bullet3 = "आप सूची में प�रतिभागियों को खींचकर उनका क�रम बदल सकते हैं"
+description = "प�रतिभागी आपके द�वारा निर�दिष�ट क�रम में दस�तावेज़ों पर हस�ताक�षर करते हैं। जब किसी की बारी आती है तो प�रत�येक साइनर को सूचना मिलती है।"
+title = "क�रमवार हस�ताक�षर"
+
+[groupSigning.steps]
+back = "वापस"
+completed = "पूर�ण"
+current = "वर�तमान"
+stepLabel = "चरण {{number}}"
+
+[groupSigning.steps.configureDefaults]
+continue = "समीक�षा पर जारी रखें"
+invisible = "हस�ताक�षर अदृश�य होंगे (केवल मेटाडेटा)"
+locationLabel = "स�थान:"
+preview = "पूर�वावलोकन"
+reasonLabel = "कारण:"
+title = "हस�ताक�षर सेटिंग�स कॉन�फ़िगर करें"
+visible = "हस�ताक�षर पृष�ठ {{page}} पर दृश�य होंगे"
+
+[groupSigning.steps.review]
+document = "दस�तावेज़"
+dueDate = "नियत तिथि (वैकल�पिक)"
+dueDatePlaceholder = "नियत तिथि च�नें..."
+invisible = "अदृश�य (केवल मेटाडेटा)"
+location = "स�थान:"
+logo = "लोगो:"
+logoHidden = "कोई लोगो नहीं"
+logoShown = "Stirling PDF लोगो दिखाया गया"
+participants = "प�रतिभागी"
+reason = "कारण:"
+send = "हस�ताक�षर अन�रोध भेजें"
+signatureSettings = "हस�ताक�षर सेटिंग�स"
+title = "सत�र विवरण की समीक�षा करें"
+titleShort = "समीक�षा करें और भेजें"
+visibility = "दृश�यता:"
+visible = "पृष�ठ {{page}} पर दृश�य"
+participantCount = "{{count}} प�रतिभागी क�रम में हस�ताक�षर करेंगे"
+
+[groupSigning.steps.selectDocument]
+continue = "प�रतिभागी चयन पर जारी रखें"
+noFile = "हस�ताक�षर सत�र बनाने के लि� कृपया अपनी सक�रिय फ़ाइलों से �कल PDF फ़ाइल च�नें।"
+selectedFile = "चयनित दस�तावेज़"
+title = "दस�तावेज़ च�नें"
+
+[groupSigning.steps.selectParticipants]
+continue = "हस�ताक�षर सेटिंग�स पर जारी रखें"
+count = "{{count}} प�रतिभागी च�ने ग�"
+label = "प�रतिभागी च�नें"
+placeholder = "हस�ताक�षर करने के लि� प�रतिभागी च�नें..."
+title = "प�रतिभागी च�नें"
+
 [getPdfInfo]
 downloadJson = "JSON डाउनलोड करें"
 downloads = "डाउनलोड"
@@ -4460,7 +4860,10 @@ zoomOut = "ज़ूम आउट"
 
 [viewer]
 cannotPreviewFile = "फ़ाइल का पूर�वावलोकन नहीं किया जा सकता"
+disableColorFilter = "रंग फ़िल�टर अक�षम करें"
 dualPageView = "दोहरा पृष�ठ दृश�य"
+enableDarkFilter = "डार�क फ़िल�टर सक�षम करें"
+enableSepiaFilter = "सेपिया फ़िल�टर सक�षम करें"
 firstPage = "पहला पृष�ठ"
 lastPage = "अंतिम पृष�ठ"
 nextPage = "अगला पृष�ठ"
@@ -4470,6 +4873,22 @@ singlePageView = "�कल पृष�ठ दृश�य"
 unknownFile = "अज�ञात फ़ाइल"
 zoomIn = "ज़ूम इन"
 zoomOut = "ज़ूम आउट"
+resetZoom = "ज़ूम रीसेट करें"
+
+[viewer.nonPdf]
+fileTypeBadge = "{{type}} फ़ाइल"
+convertToPdf = "PDF में बदलें"
+loading = "लोड हो रहा है..."
+emptyFile = "खाली फ़ाइल"
+csvStats = "{{rows}} पंक�तिया� · {{columns}} स�तंभ · {{size}}"
+sortedBy = "इसके अन�सार क�रमबद�ध: {{column}}"
+columnDefault = "स�तंभ {{index}}"
+htmlPreviewWarning = "HTML पूर�वावलोकन — बाहरी संसाधन लोड नहीं हो सकते · {{size}}"
+htmlPreview = "HTML पूर�वावलोकन"
+invalidJson = "अवैध JSON — कच�ची सामग�री दिखाई जा रही है"
+textStats = "{{lines}} पंक�तिया� · {{size}}"
+lineNumbers = "पंक�ति संख�या��"
+renderMarkdown = "Markdown रेंडर करें"
 
 [viewer.attachments]
 title = "संलग�नक"
@@ -4531,6 +4950,7 @@ toggleAttachments = "संलग�नक दिखा�ं/छिपा�ं
 toggleTheme = "थीम टॉगल करें"
 language = "भाषा"
 toggleAnnotations = "�नोटेशन दृश�यता टॉगल करें"
+toggleLayers = "परतें टॉगल करें"
 search = "PDF खोजें"
 panMode = "पैन मोड"
 applyRedactionsFirst = "पहले रिडैक�शन लागू करें"
@@ -5407,20 +5827,72 @@ title = "फ़ाइल प�रिंट करें"
 2 = "प�रिंटर नाम दर�ज करें"
 
 [quickAccess]
+access = "पह��च"
+accessAddPerson = "�क और व�यक�ति जोड़ें"
+accessBack = "वापस"
+accessCopyLink = "लिंक कॉपी करें"
+accessEmail = "ईमेल पता"
+accessEmailPlaceholder = "name@company.com"
+accessFileLabel = "फ़ाइल"
+accessGeneral = "सामान�य पह��च"
+accessInviteTitle = "लोगों को आमंत�रित करें"
+accessOwner = "मालिक"
+accessPanel = "दस�तावेज़ पह��च"
+accessPeople = "जिन�हें पह��च है"
+accessRemove = "हटा��"
+accessRestricted = "प�रतिबंधित"
+accessRestrictedHint = "केवल जिनके पास पह��च है वे खोल सकते हैं"
+accessRole = "भूमिका"
+accessRoleCommenter = "टिप�पणीकार"
+accessRoleEditor = "संपादक"
+accessRoleViewer = "दर�शक"
+accessSelectedFile = "चयनित फ़ाइल"
+accessSendInvite = "आमंत�रण भेजें"
+accessTitle = "दस�तावेज़ पह��च"
+accessYou = "आप"
 account = "खाता"
+activeSessions = "सक�रिय सत�र"
+activeTab = "सक�रिय"
 activity = "गतिविधि"
 adminSettings = "�डमिन सेटिंग�स"
+allSessions = "सभी सत�र"
 allTools = "All Tools"
 automate = "स�वचालित करें"
+back = "वापस"
+certSign = "प�रमाणपत�र हस�ताक�षर"
+completedSessions = "पूर�ण सत�र"
+completedTab = "पूर�ण"
 config = "कॉन�फ़िग"
+createNew = "नया अन�रोध बना��"
+createSession = "हस�ताक�षर अन�रोध बना�ं"
+dueDate = "नियत तिथि (वैकल�पिक)"
 files = "फ़ाइलें"
 help = "सहायता"
+noActiveSessions = "कोई लंबित हस�ताक�षर अन�रोध या सक�रिय सत�र नहीं"
+noCompletedSessions = "कोई पूर�ण सत�र नहीं"
+noFile = "कोई फ़ाइल चयनित नहीं"
 read = "पढ़ें"
 reader = "रीडर"
+refresh = "रिफ�रेश"
+requestSignatures = "हस�ताक�षर का अन�रोध करें"
+selectSingleFileToRequest = "हस�ताक�षर अन�रोध के लि� �कल PDF फ़ाइल च�नें"
+selectedFile = "चयनित फ़ाइल"
+selectUsers = "हस�ताक�षर के लि� उपयोगकर�ता च�नें"
+selectUsersPlaceholder = "प�रतिभागी च�नें..."
+sendingRequest = "भेजा जा रहा है..."
 settings = "सेटिंग�स"
 showMeAround = "म��े दिखा��"
 sign = "साइन"
+signatureRequests = "हस�ताक�षर अन�रोध"
+signYourself = "स�वयं हस�ताक�षर करें"
+newRequest = "नया अन�रोध"
 tours = "टूर"
+wetSign = "हस�ताक�षर जोड़ें"
+filterMine = "मेरे"
+filterOverdue = "अतिदेय"
+filterSigned = "हस�ताक�षरित"
+filterDeclined = "अस�वीकृत"
+searchDocuments = "दस�तावेज़ खोजें…"
 
 [quickAccess.helpMenu]
 adminTour = "�डमिन टूर"
@@ -6050,11 +6522,75 @@ toolNotAvailableLocally = "आपका Stirling-PDF सर�वर ऑफ़
 expired = "आपका सत�र समाप�त हो गया है। कृपया पृष�ठ को रिफ�रेश करें और प�न: प�रयास करें।"
 refreshPage = "पृष�ठ रिफ�रेश करें"
 
+[sessionManagement.tooltip]
+header = "हस�ताक�षर सत�र प�रबंधन"
+
+[sessionManagement.tooltip.addParticipants]
+bullet1 = "न� प�रतिभागी हस�ताक�षर क�रम के अंत में जोड़े जाते हैं"
+bullet2 = "सत�र के अंतिम रूप के बाद प�रतिभागी नहीं जोड़े जा सकते"
+bullet3 = "प�रत�येक प�रतिभागी की बारी आने पर उसे सूचना मिलती है"
+description = "आप अंतिम रूप देने से पहले किसी भी समय सक�रिय सत�र में और प�रतिभागी जोड़ सकते हैं।"
+title = "प�रतिभागी जोड़ना"
+
+[sessionManagement.tooltip.finalization]
+bullet1 = "<b>पूर�ण अंतिमकरण</b>: सभी प�रतिभागियों ने हस�ताक�षर कि� हैं"
+bullet2 = "<b>आंशिक अंतिमकरण</b>: क�छ प�रतिभागियों ने अभी हस�ताक�षर नहीं कि�"
+bullet3 = "बिना हस�ताक�षर वाले प�रतिभागियों को अंतिम दस�तावेज़ से बाहर रखा जा�गा"
+bullet4 = "अंतिम रूप देने के बाद, आप हस�ताक�षरित PDF को सक�रिय फ़ाइलों में लोड कर सकते हैं"
+description = "अंतिमकरण सभी हस�ताक�षरों को �कल हस�ताक�षरित PDF में संयोजित करता है। इस क�रिया को वापस नहीं लिया जा सकता।"
+title = "सत�र अंतिमकरण"
+
+[sessionManagement.tooltip.participantRemoval]
+bullet1 = "जिन प�रतिभागियों ने पहले ही हस�ताक�षर कर दि� हैं, उन�हें नहीं हटाया जा सकता"
+bullet2 = "हटा� ग� प�रतिभागियों को अब सूचना�� नहीं मिलेंगी"
+bullet3 = "हस�ताक�षर क�रम स�वतः समायोजित होता है"
+description = "प�रतिभागियों को हस�ताक�षर से पहले सत�रों से हटाया जा सकता है।"
+title = "प�रतिभागियों को हटाना"
+
+[sessionManagement.tooltip.signatureOrder]
+bullet1 = "प�रत�येक हस�ताक�षर PDF पर क�रमवार लागू होता है"
+bullet2 = "बाद के साइनर पहले के हस�ताक�षर देख सकते हैं"
+bullet3 = "अन�मोदन कार�यप�रवाह और कानूनी कस�टडी चेन के लि� महत�वपूर�ण"
+description = "सत�र बनाते समय आप जो क�रम निर�दिष�ट करते हैं वह निर�धारित करता है कि पहले कौन हस�ताक�षर करेगा।"
+title = "हस�ताक�षर क�रम"
+
+[signatureSettings.tooltip]
+header = "हस�ताक�षर रूप सेटिंग�स"
+
+[signatureSettings.tooltip.location]
+bullet1 = "उदाहरण: \"न�यूयॉर�क, USA\", \"लंदन ऑफिस\", \"रिमोट\""
+bullet2 = "पृष�ठ स�थिति जैसा नहीं है"
+bullet3 = "क�छ कानूनी अधिकार क�षेत�रों के लि� आवश�यक हो सकता है"
+description = "वैकल�पिक भौगोलिक स�थान जहा� हस�ताक�षर लागू किया गया। प�रमाणपत�र मेटाडेटा में संग�रहीत।"
+title = "हस�ताक�षर स�थान"
+
+[signatureSettings.tooltip.logo]
+bullet1 = "हस�ताक�षर और पाठ के साथ प�रदर�शित"
+bullet2 = "PNG, JPG फ़ॉर�मैट समर�थित"
+bullet3 = "व�यावसायिक रूप को बेहतर बनाता है"
+description = "ब�रांडिंग और प�रामाणिकता के लि� दृश�यमान हस�ताक�षरों में कंपनी लोगो जोड़ें।"
+title = "कंपनी लोगो"
+
+[signatureSettings.tooltip.reason]
+bullet1 = "उदाहरण: \"मंजूरी\", \"अन�बंध सम�ौता\", \"समीक�षा पूर�ण\""
+bullet2 = "PDF हस�ताक�षर ग�णों में दृश�य"
+bullet3 = "ऑडिट ट�रेल और अन�पालन के लि� उपयोगी"
+description = "दस�तावेज़ पर हस�ताक�षर क�यों कि� जा रहे हैं, इसका वैकल�पिक पाठ। प�रमाणपत�र मेटाडेटा में संग�रहीत।"
+title = "हस�ताक�षर का कारण"
+
+[signatureSettings.tooltip.visibility]
+bullet1 = "<b>दृश�यमान</b>: कस�टम रूप के साथ PDF पर हस�ताक�षर दिखाई देंगे"
+bullet2 = "<b>अदृश�य</b>: बिना दृश�य चिह�न के प�रमाणपत�र �म�बेड होगा"
+bullet3 = "अदृश�य हस�ताक�षर अभी भी क�रिप�टोग�राफ़िक मान�यता प�रदान करते हैं"
+description = "नियंत�रित करता है कि हस�ताक�षर दस�तावेज़ पर दृश�यमान हो या अदृश�य रूप से �म�बेड हो।"
+title = "हस�ताक�षर की दृश�यता"
+
 [settings.configuration]
 advanced = "�डवांस�ड"
 database = "डेटाबेस"
 endpoints = "�ंडपॉइंट�स"
 features = "फ़ीचर�स"
+storageSharing = "फ़ाइल भंडारण और शेयरिंग"
 systemSettings = "सिस�टम सेटिंग�स"
 title = "कॉन�फ़िगरेशन"
 
@@ -6332,10 +6868,13 @@ title = "Stirling में साइन इन"
 [setup.selfhosted]
 link = "या किसी स�व-होस�टेड खाते से कनेक�ट करें"
 subtitle = "अपने सर�वर क�रेडेंशियल�स दर�ज करें"
+changeServerLocked = "आपके संगठन ने इस �प को �क विशिष�ट सर�वर तक सीमित कर दिया है"
 switchToLocal = "इसके बजाय लोकल टूल�स का उपयोग करें"
 title = "सर�वर में साइन इन"
 
 [setup.selfhosted.unreachable]
+changeServer = "किसी अन�य सर�वर से कनेक�ट करें"
+changeServerLocked = "आपके संगठन ने इस �प को �क विशिष�ट सर�वर तक सीमित कर दिया है"
 continueOffline = "इसके बजाय लोकल टूल�स का उपयोग करें"
 message = "{{url}} तक पह��चा नहीं जा सका। जा�चें कि सर�वर चल रहा है और स�लभ है।"
 retry = "प�नः प�रयास करें"
@@ -6529,6 +7068,15 @@ saved = "सहेजा गया"
 text = "टेक�स�ट"
 title = "हस�ताक�षर प�रकार"
 
+[signRequest]
+declined = "हस�ताक�षर अन�रोध अस�वीकृत"
+fetchFailed = "हस�ताक�षर अन�रोध लोड करने में विफल"
+signed = "दस�तावेज़ सफलतापूर�वक हस�ताक�षरित"
+
+[signSession]
+createFailed = "हस�ताक�षर अन�रोध बनाने में विफल"
+created = "हस�ताक�षर अन�रोध भेजा गया"
+
 [signup]
 accountCreatedSuccessfully = "खाता सफलतापूर�वक बनाया गया! अब आप साइन इन कर सकते हैं।"
 alreadyHaveAccount = "पहले से खाता है? साइन इन करें"
@@ -6807,6 +7355,106 @@ title = "अध�यायों द�वारा PDF विभाजित 
 [splitPdfByChapters]
 tags = "विभाजन,अध�याय,ब�कमार�क,व�यवस�थित करें"
 
+[storageShare]
+accessed = "�क�सेस किया गया"
+accessDenied = "आपको इस सा�ा फ़ाइल की पह��च नहीं है। मालिक से इसे आपके साथ सा�ा करने के लि� कहें।"
+accessFailed = "गतिविधि लोड करने में असमर�थ।"
+accessDeniedBody = "आपको इस फ़ाइल की पह��च नहीं है। मालिक से इसे आपके साथ सा�ा करने के लि� कहें।"
+accessDeniedTitle = "पह��च नहीं"
+accessLimitedCommenter = "टिप�पणी पह��च जल�द ही आ रही है। यदि आपको डाउनलोड करना है तो मालिक से संपादक पह��च मा�गें।"
+accessLimitedTitle = "सीमित पह��च"
+accessLimitedViewer = "यह लिंक केवल देखने के लि� है। यदि आपको डाउनलोड करना है तो मालिक से संपादक पह��च मा�गें।"
+createdAt = "बनाया गया"
+download = "डाउनलोड"
+downloadFailed = "इस फ़ाइल को डाउनलोड करने में असमर�थ।"
+expiredBody = "यह शेयर लिंक अमान�य है या इसकी मियाद समाप�त हो गई है।"
+expiredTitle = "लिंक समाप�त"
+goToLogin = "लॉगिन पर जा��"
+loadFailed = "सा�ा फ़ाइल खोलने में असमर�थ।"
+loading = "शेयर लिंक लोड हो रहा है..."
+loginPrompt = "इस सा�ा फ़ाइल तक पह��चने के लि� साइन इन करें।"
+loginRequired = "लॉगिन आवश�यक"
+openInApp = "Stirling PDF में खोलें"
+ownerLabel = "मालिक"
+ownerUnknown = "अज�ञात"
+requiresLogin = "इस सा�ा फ़ाइल के लि� लॉगिन आवश�यक है।"
+roleCommenter = "टिप�पणीकार"
+roleEditor = "संपादक"
+roleViewer = "दर�शक"
+shareHeading = "सा�ा फ़ाइल"
+titleDefault = "सा�ा फ़ाइल"
+tryAgain = "कृपया बाद में प�नः प�रयास करें।"
+addUser = "जोड़ें"
+commenterHint = "टिप�पणी करना जल�द ही आ रहा है।"
+copied = "लिंक क�लिपबोर�ड पर कॉपी किया गया"
+copy = "कॉपी"
+copyFailed = "कॉपी विफल"
+description = "इस फ़ाइल के लि� �क शेयर लिंक बना��। लिंक के साथ साइन-इन उपयोगकर�ता इसे �क�सेस कर सकते हैं।"
+downloadsCount = "डाउनलोड: {{count}}"
+emailWarningBody = "यह ईमेल पता जैसा लगता है। यदि यह व�यक�ति पहले से Stirling PDF उपयोगकर�ता नहीं है, तो वह फ़ाइल तक पह��च नहीं कर पा�गा।"
+emailWarningConfirm = "फिर भी सा�ा करें"
+emailWarningTitle = "ईमेल पता"
+errorTitle = "शेयर विफल"
+failure = "शेयर लिंक जनरेट करने में असमर�थ। कृपया प�नः प�रयास करें।"
+fileLabel = "फ़ाइल"
+generate = "लिंक जनरेट करें"
+generated = "शेयर लिंक जनरेट किया गया"
+hideActivity = "गतिविधि छिपा��"
+invalidUsername = "मान�य उपयोगकर�ता नाम या ईमेल पता दर�ज करें।"
+lastAccessed = "अंतिम बार �क�सेस किया गया"
+linkAccessTitle = "शेयर लिंक पह��च"
+linkLabel = "शेयर लिंक"
+linksDisabled = "शेयर लिंक अक�षम हैं।"
+linksDisabledBody = "आपके सर�वर सेटिंग�स द�वारा शेयर लिंक अक�षम हैं।"
+manage = "शेयरिंग प�रबंधित करें"
+manageDescription = "इस फ़ाइल को सा�ा करने के लि� लिंक बना�� और प�रबंधित करें।"
+manageLoadFailed = "शेयर लिंक लोड करने में असमर�थ।"
+manageTitle = "शेयरिंग प�रबंधन"
+noActivity = "अभी तक कोई गतिविधि नहीं।"
+noLinks = "अभी तक कोई सक�रिय शेयर लिंक नहीं।"
+noSharedUsers = "अभी तक किसी उपयोगकर�ता को पह��च नहीं है।"
+removeLink = "लिंक हटा��"
+removeUser = "हटा��"
+revokeFailed = "शेयर लिंक हटाने में असमर�थ।"
+revoked = "शेयर लिंक हटाया गया"
+roleLabel = "भूमिका"
+sharingDisabled = "शेयरिंग अक�षम है।"
+sharingDisabledBody = "आपकी सर�वर सेटिंग�स द�वारा शेयरिंग अक�षम कर दी गई है।"
+sharedUsersTitle = "शेयर कि� ग� उपयोगकर�ता"
+title = "फ़ाइल शेयर करें"
+unknownUser = "अज�ञात उपयोगकर�ता"
+userAddFailed = "उस उपयोगकर�ता के साथ शेयर नहीं कर सके।"
+userAdded = "उपयोगकर�ता को शेयर सूची में जोड़ा गया।"
+usernameLabel = "उपयोगकर�ता नाम या ईमेल"
+usernamePlaceholder = "उपयोगकर�ता नाम या ईमेल दर�ज करें"
+userRemoveFailed = "उस उपयोगकर�ता को नहीं हटा सके।"
+userRemoved = "उपयोगकर�ता को शेयर सूची से हटाया गया।"
+viewActivity = "गतिविधि देखें"
+viewed = "देखा गया"
+viewsCount = "देखे ग�: {{count}}"
+downloaded = "डाउनलोड किया गया"
+bulkDescription = "साइन-इन उपयोगकर�ताओं के साथ सभी चयनित फ़ाइलें शेयर करने के लि� �क लिंक बना��।"
+bulkTitle = "चयनित फ़ाइलें शेयर करें"
+copyLink = "शेयर लिंक कॉपी करें"
+fileCount = "{{count}} फ़ाइलें चयनित"
+ownerOnly = "केवल मालिक ही शेयरिंग प�रबंधित कर सकता है।"
+selectSingleFile = "शेयरिंग प�रबंधित करने के लि� �क ही फ़ाइल च�नें।"
+
+[storageUpload]
+description = "यह वर�तमान फ़ाइल को आपकी पह��च के लि� सर�वर स�टोरेज पर अपलोड करता है।"
+errorTitle = "अपलोड विफल ह�आ"
+failure = "अपलोड विफल ह�आ। कृपया अपने लॉगिन और स�टोरेज सेटिंग�स की जा�च करें।"
+fileLabel = "फ़ाइल"
+hint = "सार�वजनिक लिंक और �क�सेस मोड आपकी सर�वर सेटिंग�स द�वारा नियंत�रित होते हैं।"
+success = "सर�वर पर अपलोड किया गया"
+title = "सर�वर पर अपलोड करें"
+updateButton = "सर�वर पर अपडेट करें"
+uploadButton = "सर�वर पर अपलोड करें"
+bulkDescription = "यह चयनित फ़ाइलों को आपके सर�वर स�टोरेज पर अपलोड करता है।"
+bulkTitle = "चयनित फ़ाइलें अपलोड करें"
+fileCount = "{{count}} फ़ाइलें चयनित"
+more = " +{{count}} और"
+
 [storage]
 approximateSize = "अन�मानित आकार"
 fileTooLarge = "फ़ाइल बह�त बड़ी है। प�रति फ़ाइल अधिकतम आकार है"
@@ -7153,6 +7801,30 @@ title = "PDF देखें/संपादित करें"
 [warning]
 tooltipTitle = "चेतावनी"
 
+[wetSignature.tooltip]
+header = "हस�ताक�षर बनाने के तरीके"
+
+[wetSignature.tooltip.draw]
+bullet1 = "पेन का रंग और मोटाई अन�कूलित करें"
+bullet2 = "संत�ष�ट होने तक साफ करें और फिर से बना�ं"
+bullet3 = "टच डिवाइस (टैबलेट, फ़ोन) पर काम करता है"
+description = "अपने माउस या टचस�क�रीन का उपयोग करके हस�तलिखित हस�ताक�षर बना�ं। व�यक�तिगत और प�रामाणिक हस�ताक�षरों के लि� सर�वोत�तम।"
+title = "हस�ताक�षर बना�ं"
+
+[wetSignature.tooltip.type]
+bullet1 = "कई फ़ॉन�ट में से च�नें"
+bullet2 = "टेक�स�ट का आकार और रंग अन�कूलित करें"
+bullet3 = "मानकीकृत हस�ताक�षरों के लि� उपय�क�त"
+description = "टाइप कि� ग� टेक�स�ट से हस�ताक�षर बना�ं। तेज़ और स�संगत, व�यावसायिक दस�तावेज़ों के लि� उपय�क�त।"
+title = "हस�ताक�षर टाइप करें"
+
+[wetSignature.tooltip.upload]
+bullet1 = "PNG, JPG और अन�य इमेज फ़ॉर�मैट समर�थित हैं"
+bullet2 = "बेहतर परिणामों के लि� पारदर�शी पृष�ठभूमि की अन�शंसा की जाती है"
+bullet3 = "हस�ताक�षर क�षेत�र में फिट करने के लि� इमेज का आकार बदला जा�गा"
+description = "पहले से बनाई गई हस�ताक�षर इमेज अपलोड करें। यदि आपके पास स�कैन किया ह�आ हस�ताक�षर या कंपनी लोगो है तो उपय�क�त।"
+title = "हस�ताक�षर इमेज अपलोड करें"
+
 [watermark]
 completed = "वॉटरमार�क जोड़ा गया"
 desc = "PDF फ़ाइलों में टेक�स�ट या इमेज वॉटरमार�क जोड़ें"
@@ -7333,6 +8005,7 @@ activeSession = "सक�रिय सत�र"
 addMembers = "सदस�य जोड़ें"
 admin = "प�रशासक"
 confirmDelete = "क�या आप वाकई इस उपयोगकर�ता को हटाना चाहते हैं? यह क�रिया पूर�ववत नहीं की जा सकती।"
+confirmUnlock = "क�या आप स�निश�चित हैं कि आप इस उपयोगकर�ता खाते को अनलॉक करना चाहते हैं?"
 deleteUser = "उपयोगकर�ता हटा��"
 deleteUserError = "उपयोगकर�ता हटाने में विफल"
 deleteUserSuccess = "उपयोगकर�ता सफलतापूर�वक हटाया गया"
@@ -7341,6 +8014,8 @@ disable = "अक�षम करें"
 disabled = "अक�षम"
 editRole = "भूमिका संपादित करें"
 enable = "सक�रिय करें"
+locked = "लॉक�ड"
+lockedBadge = "लॉक�ड"
 loading = "लोग लोड हो रहे हैं..."
 loginRequired = "पहले लॉगिन मोड सक�षम करें"
 member = "सदस�य"
@@ -7350,6 +8025,9 @@ searchMembers = "सदस�यों को खोजें..."
 status = "स�थिति"
 team = "टीम"
 title = "लोग"
+unlockAccount = "खाता अनलॉक करें"
+unlockUserError = "उपयोगकर�ता खाता अनलॉक करने में विफल"
+unlockUserSuccess = "उपयोगकर�ता खाता सफलतापूर�वक अनलॉक किया गया"
 user = "उपयोगकर�ता"
 
 [workspace.people.actions]
diff --git a/frontend/public/locales/hr-HR/translation.toml b/frontend/public/locales/hr-HR/translation.toml
index 4cd16516b7..05d68b832b 100644
--- a/frontend/public/locales/hr-HR/translation.toml
+++ b/frontend/public/locales/hr-HR/translation.toml
@@ -8,6 +8,7 @@ black = "Crno"
 blue = "Plavo"
 bored = "Dosađujete se �ekajući?"
 cancel = "Odustani"
+confirm = "Potvrdi"
 changedCredsMessage = "Podaci za prijavu uspješno promijenjeni!"
 chooseFile = "Odaberi datoteku"
 close = "Zatvori"
@@ -146,6 +147,7 @@ insufficientCredits = "Nedovoljno kredita. Potrebno: {{requiredCredits}}, Dostup
 loadingCredits = "Provjera kredita..."
 loadingProStatus = "Provjera statusa pretplate..."
 noticeTopUpOrPlan = "Nedovoljno kredita, nadoplatite ili nadogradite na plan"
+accessInvite = "Pozovi"
 
 [account]
 accountSettings = "Postavke ra�una"
@@ -1427,6 +1429,34 @@ title = "Obrada"
 description = "Maksimalno vrijeme �ekanja na zadatak obrade prije prijave pogreške."
 label = "Vremensko ograni�enje obrade (sekunde)"
 
+[admin.settings.storage]
+description = "Upravljajte pohranom na poslužitelju i opcijama dijeljenja."
+title = "Pohrana i dijeljenje datoteka"
+
+[admin.settings.storage.enabled]
+description = "Omogućite korisnicima pohranu datoteka na poslužitelju."
+label = "Omogući pohranu datoteka na poslužitelju"
+
+[admin.settings.storage.sharing.email]
+description = "Omogući dijeljenje s adresama e-pošte."
+label = "Omogući dijeljenje e-poštom"
+mailLink = "Konfiguriraj postavke pošte"
+mailNote = "Zahtijeva konfiguraciju pošte. "
+
+[admin.settings.storage.sharing.enabled]
+description = "Omogućite korisnicima dijeljenje pohranjenih datoteka."
+label = "Omogući dijeljenje"
+
+[admin.settings.storage.sharing.links]
+description = "Omogući dijeljenje putem poveznica uz prijavu."
+frontendUrlLink = "Konfiguriraj u Postavkama sustava"
+frontendUrlNote = "Zahtijeva Frontend URL. "
+label = "Omogući poveznice za dijeljenje"
+
+[admin.settings.storage.signing.enabled]
+description = "Omogućite korisnicima stvaranje sesija potpisivanja s više sudionika. Zahtijeva omogućenu poslužiteljsku pohranu datoteka."
+label = "Omogući grupno potpisivanje (alfa)"
+
 [admin.settings.unsavedChanges]
 cancel = "Nastavi uređivati"
 discard = "Odbaci promjene"
@@ -2059,7 +2089,19 @@ numbers = "Brojevi/rasponi: 5, 10-20"
 progressions = "Progresije: 3n, 4n+1"
 
 [certSign]
+allSigned = "Svi sudionici su potpisali. Spremno za dovršavanje."
+awaitingSignatures = "ÄŒeka potpise"
+signatureProgress = "{{signedCount}}/{{totalCount}} potpisa"
 chooseCertificate = "Odaberite datoteku certifikata"
+declined = "Odbijeno"
+fetchFailed = "Nije moguće u�itati podatke o potpisivanju"
+finalized = "Dovršeno"
+notified = "Na �ekanju"
+partialNote = "Možete ranije dovršiti s trenuta�nim potpisima. Nepotpisani sudionici bit će isklju�eni."
+pending = "Na �ekanju"
+readyToFinalize = "Spremno za dovršavanje"
+signed = "Potpisano"
+viewed = "Pregledano"
 chooseJksFile = "Odaberite JKS datoteku"
 chooseP12File = "Odaberite PKCS12 datoteku"
 choosePfxFile = "Odaberite PFX datoteku"
@@ -2082,6 +2124,7 @@ title = "Potpisivanje Certifikatom"
 invisible = "Nevidljivo"
 stepTitle = "Izgled potpisa"
 visible = "Vidljivo"
+visibility = "Vidljivost"
 
 [certSign.appearance.options]
 title = "Detalji potpisa"
@@ -2188,6 +2231,252 @@ bullet4 = "Može koristiti prilagođene certifikate za provjeru"
 text = "Pri provjeri potpisa alat javlja jesu li valjani, tko je potpisao dokument, kada je potpisan i je li mijenjan nakon potpisivanja."
 title = "Provjera potpisa"
 
+[certSign.collab.finalize]
+button = "Dovrši i u�itaj potpisani PDF"
+early = "Dovrši s trenuta�nim potpisima"
+
+[certSign.collab.sessionDetail]
+addButton = "Dodaj sudionike"
+addParticipants = "Dodaj sudionike"
+addParticipantsError = "Neuspjelo dodavanje sudionika"
+backToList = "Natrag na sesije"
+deleteConfirm = "Jeste li sigurni? Ovo se ne može poništiti."
+deleteError = "Neuspjelo brisanje sesije"
+deleted = "Sesija izbrisana"
+deleteSession = "Izbriši sesiju"
+dueDate = "Rok"
+finalizeError = "Neuspjelo dovršavanje sesije"
+loadPdfError = "Neuspjelo u�itavanje potpisanog PDF-a"
+loadSignedPdf = "U�itaj potpisani PDF u aktivne datoteke"
+messageLabel = "Poruka"
+noAdditionalInfo = "Nema dodatnih informacija"
+owner = "Vlasnik"
+participantRemoved = "Sudionik uklonjen"
+participants = "Sudionici"
+participantsAdded = "Sudionici su uspješno dodani"
+removeParticipant = "Ukloni"
+removeParticipantError = "Neuspjelo uklanjanje sudionika"
+selectUsers = "Odaberite korisnike..."
+sessionInfo = "Informacije o sesiji"
+workbenchTitle = "Upravljanje sesijom"
+
+[certSign.collab.signRequest]
+addedToFiles = "Dokument dodan u aktivne datoteke"
+addSignature = "Dodajte svoj potpis"
+addToFiles = "Dodaj u aktivne datoteke"
+advancedSettings = "Napredne postavke"
+backToList = "Natrag na zahtjeve za potpis"
+certificateChoice = "Odaberite certifikat za potpisivanje"
+changeSignature = "Promijeni potpis"
+clearSignature = "Obriši potpis"
+completeAndSign = "Dovrši i potpiši"
+createNewSignature = "Izradi novi potpis"
+declineButton = "Odbij"
+decline = "Odbij zahtjev"
+deleteSelected = "Izbriši odabrani potpis"
+drawSignature = "Nacrtajte svoj potpis dolje"
+dueDate = "Rok"
+fileTooLarge = "Veli�ina datoteke mora biti manja od 5 MB"
+fontFamily = "Obitelj fonta"
+fontSize = "Veli�ina fonta: {{size}}px"
+fontSizePlaceholder = "Veli�ina"
+from = "Od"
+invalidCertFile = "Odaberite P12 ili PFX datoteku certifikata"
+invalidFileType = "Odaberite slikovnu datoteku"
+location = "Lokacija (neobavezno)"
+locationPlaceholder = "Odakle potpisujete?"
+message = "Poruka"
+noCertificate = "Odaberite datoteku certifikata"
+noSignatures = "Postavite barem jedan potpis na PDF"
+p12File = "P12/PFX datoteka certifikata"
+password = "Lozinka certifikata"
+passwordPlaceholder = "Unesite lozinku..."
+penColor = "Boja olovke"
+penSize = "Veli�ina olovke: {{size}}px"
+placementActive = "Kliknite na PDF za postavljanje"
+placeSignatureButton = "Postavi potpis na PDF"
+reason = "Razlog (neobavezno)"
+reasonPlaceholder = "Zašto potpisujete?"
+removeImage = "Ukloni sliku"
+removeCertFile = "Ukloni datoteku"
+savedSignatures = "Spremljeni potpisi"
+selectFile = "Odaberi datoteku slike"
+selectSignatureTitle = "Odaberite ili izradite potpis"
+signButton = "Potpiši dokument"
+signatureInfo = "Ove postavke konfigurira vlasnik dokumenta"
+signaturePlaced = "Potpis postavljen na stranicu"
+signatureSettings = "Postavke potpisa"
+signatureText = "Tekst potpisa"
+signatureTextPlaceholder = "Unesite svoje ime..."
+signatureTypeLabel = "Vrsta potpisa"
+signingTitle = "Potpisivanje"
+textColor = "Boja teksta"
+typeSignature = "Upišite svoje ime da biste izradili potpis"
+uploadCert = "Prilagođeni certifikat"
+uploadCertDesc = "Koristite vlastiti P12/PFX certifikat"
+uploadSignature = "Prenesite sliku svog potpisa"
+usePersonalCert = "Osobni certifikat"
+usePersonalCertDesc = "Automatski generiran za vaš ra�un"
+useServerCert = "Certifikat organizacije"
+useServerCertDesc = "Zajedni�ki certifikat organizacije"
+workbenchTitle = "Zahtjev za potpis"
+
+[certSign.collab.signRequest.canvas]
+colorPickerTitle = "Odaberite boju poteza"
+continue = "Nastavi"
+
+[certSign.collab.signRequest.certModal]
+description = "Postavili ste {{count}} potpis(a). Odaberite svoj certifikat za dovršetak potpisivanja."
+sign = "Potpiši dokument"
+certValidating = "Provjera certifikata..."
+certValidUntil = "Certifikat vrijedi do {{date}}"
+certInvalid = "Certifikat nevažeći: {{error}}"
+certInvalidFallback = "Nevažeći certifikat"
+certNetworkError = "Nije moguće potvrditi certifikat"
+title = "Konfiguriraj certifikat"
+
+[certSign.collab.signRequest.image]
+hint = "Prenesite PNG ili JPG sliku svog potpisa"
+
+[certSign.collab.signRequest.mode]
+move = "Premjesti potpis"
+place = "Postavi potpis"
+title = "Na�in potpisivanja ili premještanja"
+
+[certSign.collab.signRequest.modeTabs]
+draw = "Crtaj"
+image = "Prenesi"
+text = "Upiši"
+
+[certSign.collab.signRequest.placeSignature]
+message = "Kliknite na PDF kako biste postavili svoj potpis"
+title = "Postavi potpis"
+
+[certSign.collab.signRequest.preview]
+imageAlt = "Odabrani potpis"
+missing = "Nema pregleda"
+textFallback = "Potpis"
+
+[certSign.collab.signRequest.saved]
+defaultCanvasLabel = "Crtani potpis"
+defaultImageLabel = "Preneseni potpis"
+defaultLabel = "Potpis"
+defaultTextLabel = "Upisani potpis"
+delete = "Izbriši potpis"
+none = "Nema spremljenih potpisa"
+
+[certSign.collab.signRequest.signatureType]
+draw = "Crtaj"
+type = "Upiši"
+upload = "Prenesi"
+
+[certSign.collab.signRequest.steps]
+back = "Natrag"
+cancelPlacement = "Otkaži postavljanje"
+certificate = "Certifikat"
+clickMultipleTimes = "Kliknite na PDF više puta kako biste postavili potpise. Povucite bilo koji potpis za premještanje ili promjenu veli�ine."
+clickToPlace = "Kliknite na PDF gdje želite da se vaš potpis pojavi."
+continue = "Nastavi na odabir certifikata"
+continueToPlacement = "Nastavi na postavljanje"
+continueToReview = "Nastavi na pregled"
+createSignature = "Izradi potpis"
+invisible = "Nevidljivo"
+location = "Lokacija:"
+multipleSignatures = "{{count}} potpisa bit će primijenjeno na PDF"
+oneSignature = "1 potpis bit će primijenjen na PDF"
+placeOnPdf = "Postavi na PDF"
+reason = "Razlog:"
+reviewTitle = "Pregled prije potpisivanja"
+signaturePlaced = "Potpis postavljen na stranicu {{page}}. Možete prilagoditi položaj ponovnim klikom ili nastaviti na pregled."
+visible = "Vidljivo"
+visibility = "Vidljivost:"
+yourSignatures = "Vaši potpisi ({{count}})"
+
+[certSign.collab.signRequest.text]
+colorLabel = "Boja"
+fontLabel = "Font"
+fontSizeLabel = "Veli�ina"
+fontSizePlaceholder = "16"
+label = "Tekst potpisa"
+modalHint = "Unesite svoje ime, zatim kliknite Nastavi za postavljanje na PDF."
+placeholder = "Unesite svoje ime..."
+
+[certSign.collab.participant]
+certValidating = "Provjera certifikata..."
+certValid = "✓ Certifikat valjan"
+certValidUntil = " do {{date}}"
+certInvalid = "✗ {{error}}"
+certInvalidFallback = "Nevažeći certifikat"
+certNetworkError = "Nije moguće potvrditi certifikat"
+
+[certSign.collab.addParticipants]
+add = "Dodaj {{count}} sudionika"
+back = "Natrag"
+configureSignatures = "Konfiguriraj postavke potpisa"
+continue = "Nastavi na postavke potpisa"
+reasonHelp = "Unaprijed postavite razlog potpisivanja za ove sudionike (neobavezno, mogu ga promijeniti pri potpisivanju)"
+reasonPlaceholder = "npr. odobrenje, pregled..."
+selectUsers = "Odaberi korisnike"
+
+[certSign.collab.sessionCreation]
+includeSummaryPage = "Uklju�i stranicu sažetka potpisa"
+includeSummaryPageHelp = "Na kraju će se dodati stranica sa svim metapodacima potpisa. Okviri digitalnih certifikata na pojedina�nim stranicama bit će potisnuti (ru�ni potpisi nisu pogođeni)."
+
+[certSign.collab.sessionList]
+active = "Aktivno"
+finalized = "Dovršeno"
+
+[certSign.collab.signatureSettings]
+description = "Konfigurirajte kako će potpisi izgledati za sve sudionike"
+title = "Izgled potpisa"
+
+[certSign.collab.userSelector]
+inviteUsers = "Dodaj korisnike"
+loadError = "Nije moguće u�itati korisnike"
+noTeam = "Bez tima"
+noUsers = "Nisu pronađeni drugi korisnici."
+placeholder = "Odaberite korisnike..."
+
+[certSign.mobile]
+panelActions = "Akcije"
+panelDocument = "Dokument"
+panelPeople = "Osobe"
+
+[certSign.sessions]
+deleted = "Sesija izbrisana"
+fetchFailed = "Nije moguće u�itati detalje sesije"
+finalized = "Sesija dovršena"
+loaded = "Potpisani PDF u�itan"
+pdfNotReady = "PDF nije spreman"
+pdfNotReadyDesc = "Potpisani PDF se generira. Pokušajte ponovno za trenutak."
+
+[certificateChoice.tooltip]
+header = "Vrste certifikata"
+
+[certificateChoice.tooltip.organization]
+bullet1 = "Upravljaju administratori sustava"
+bullet2 = "Dijeljeno među ovlaštenim korisnicima"
+bullet3 = "Predstavlja identitet tvrtke, ne pojedinca"
+bullet4 = "Najbolje za: službene dokumente, timske potpise"
+description = "Zajedni�ki certifikat koji pruža vaša organizacija. Koristi se za ovlasti potpisivanja na razini tvrtke."
+title = "Certifikat organizacije"
+
+[certificateChoice.tooltip.personal]
+bullet1 = "Automatski se generira pri prvoj upotrebi"
+bullet2 = "Povezan s vašim korisni�kim ra�unom"
+bullet3 = "Ne može se dijeliti s drugim korisnicima"
+bullet4 = "Najbolje za: osobne dokumente, individualnu odgovornost"
+description = "Automatski generirani certifikat jedinstven za vaš korisni�ki ra�un. Primjeren za individualne potpise."
+title = "Osobni certifikat"
+
+[certificateChoice.tooltip.upload]
+bullet1 = "Zahtijeva P12/PFX datoteku i lozinku"
+bullet2 = "Može ga izdati vanjsko certifikacijsko tijelo"
+bullet3 = "Viša razina povjerenja za pravne dokumente"
+bullet4 = "Najbolje za: pravno obvezujuće ugovore, vanjsku validaciju"
+description = "Koristite vlastitu PKCS#12 datoteku certifikata. Pruža potpunu kontrolu nad svojstvima certifikata."
+title = "Prenesi prilagođeni P12"
+
 [changeCreds]
 changePassword = "Koristite zadanu lozinku za prijavu. Unesite novu lozinku"
 changeUsername = "Ažurirajte svoje korisni�ko ime. Bit ćete odjavljeni nakon ažuriranja."
@@ -3242,6 +3531,46 @@ totalSelected = "Ukupno odabrano"
 unsupported = "Nepodržano"
 unzip = "Raspakiraj"
 uploadError = "Nije uspjelo otpremiti neke datoteke."
+copyCreated = "Kopija spremljena na ovaj uređaj."
+copyFailed = "Nije moguće stvoriti kopiju."
+leaveShare = "Ukloni s mog popisa"
+leaveShareFailed = "Nije moguće ukloniti dijeljenu datoteku."
+leaveShareSuccess = "Uklonjeno s vašeg popisa dijeljenih."
+removeBoth = "Ukloni s oba"
+removeFilePrompt = "Ova je datoteka spremljena na ovom uređaju i na vašem poslužitelju. Odakle je želite ukloniti?"
+removeFileTitle = "Ukloni datoteku"
+removeLocalOnly = "Samo s ovog uređaja"
+removeServerFailed = "Nije moguće ukloniti datoteku s poslužitelja."
+removeServerOnly = "Samo s poslužitelja"
+removeServerOnlyPrompt = "Ova je datoteka pohranjena samo na vašem poslužitelju. Želite li je ukloniti s poslužitelja?"
+removeServerSuccess = "Uklonjeno s poslužitelja."
+removeSharedPrompt = "Ova je datoteka podijeljena s vama. Možete je ukloniti s ovog uređaja ili s vašeg popisa dijeljenih."
+removeSharedServerOnlyBlockedPrompt = "Ova je datoteka podijeljena s vama i pohranjena samo na poslužitelju."
+removeSharedServerOnlyPrompt = "Ova je datoteka podijeljena s vama i pohranjena samo na poslužitelju. Ukloniti je s vašeg popisa?"
+changesNotUploaded = "Promjene nisu prenesene"
+cloudFile = "Datoteka u oblaku"
+filterAll = "Sve"
+filterLocal = "Lokalno"
+filterSharedByMe = "Podijeljeno od mene"
+filterSharedWithMe = "Podijeljeno sa mnom"
+lastSynced = "Zadnja sinkronizacija"
+localOnly = "Samo lokalno"
+makeCopy = "Izradi kopiju"
+owner = "Vlasnik"
+ownerUnknown = "Nepoznato"
+share = "Podijeli"
+shareSelected = "Podijeli odabrano"
+sharedByYou = "Podijeljeno od vas"
+sharedEditNoticeBody = "Nemate prava uređivanja poslužiteljske verzije ove datoteke. Sve izmjene koje napravite bit će spremljene kao lokalna kopija."
+sharedEditNoticeConfirm = "Razumijem"
+sharedEditNoticeTitle = "Kopija na poslužitelju samo za �itanje"
+sharedWithYou = "Podijeljeno s vama"
+sharing = "Dijeljenje"
+storageState = "Pohrana"
+synced = "Sinkronizirano"
+updateOnServer = "Ažuriraj na poslužitelju"
+uploadSelected = "Prenesi odabrano"
+uploadToServer = "Prenesi na poslužitelj"
 
 [files]
 addFiles = "Dodaj datoteke"
@@ -3367,6 +3696,77 @@ title = "O spljoštavanju PDF-ova"
 discord = "Discord"
 issues = "GitHub"
 
+[groupSigning.tooltip]
+header = "O grupnom potpisivanju"
+
+[groupSigning.tooltip.finalization]
+bullet1 = "Svi potpisi primjenjuju se redoslijedom sudionika koji ste odredili"
+bullet2 = "Možete dovršiti s djelomi�nim potpisima ako je potrebno"
+bullet3 = "Nakon dovršavanja sesiju nije moguće mijenjati"
+description = "Kada svi sudionici potpišu (ili odaberete rano dovršiti), možete generirati kona�ni potpisani PDF."
+title = "Postupak dovršavanja"
+
+[groupSigning.tooltip.roles]
+bullet1 = "Vlasnik (vi): stvara sesiju, konfigurira zadane postavke potpisa, dovršava dokument"
+bullet2 = "Sudionici: stvaraju svoj potpis, biraju certifikat, postavljaju na PDF"
+bullet3 = "Sudionici ne mogu mijenjati postavke vidljivosti, razloga ili lokacije potpisa"
+description = "Vi kontrolirate postavke izgleda potpisa za sve sudionike."
+title = "Uloge sudionika"
+
+[groupSigning.tooltip.sequential]
+bullet1 = "Prvi sudionik mora potpisati prije nego drugi dobije pristup dokumentu"
+bullet2 = "Osigurava ispravan redoslijed potpisivanja radi pravne usklađenosti"
+bullet3 = "Možete promijeniti redoslijed sudionika povla�enjem na popisu"
+description = "Sudionici potpisuju dokumente redoslijedom koji odredite. Svaki potpisnik dobiva obavijest kada dođe njegov red."
+title = "Sekvencijalno potpisivanje"
+
+[groupSigning.steps]
+back = "Natrag"
+completed = "Dovršeno"
+current = "Trenutno"
+stepLabel = "Korak {{number}}"
+
+[groupSigning.steps.configureDefaults]
+continue = "Nastavi na pregled"
+invisible = "Potpisi će biti nevidljivi (samo metapodaci)"
+locationLabel = "Lokacija:"
+preview = "Pretpregled"
+reasonLabel = "Razlog:"
+title = "Konfiguriraj postavke potpisa"
+visible = "Potpisi će biti vidljivi na stranici {{page}}"
+
+[groupSigning.steps.review]
+document = "Dokument"
+dueDate = "Rok (neobavezno)"
+dueDatePlaceholder = "Odaberite rok..."
+invisible = "Nevidljivo (samo metapodaci)"
+location = "Lokacija:"
+logo = "Logo:"
+logoHidden = "Bez logotipa"
+logoShown = "Prikazan Stirling PDF logotip"
+participants = "Sudionici"
+reason = "Razlog:"
+send = "Pošalji zahtjeve za potpisivanje"
+signatureSettings = "Postavke potpisa"
+title = "Pregled detalja sesije"
+titleShort = "Pregled i slanje"
+visibility = "Vidljivost:"
+visible = "Vidljivo na stranici {{page}}"
+participantCount = "{{count}} sudionik(a) potpisivat će redom"
+
+[groupSigning.steps.selectDocument]
+continue = "Nastavi na odabir sudionika"
+noFile = "Odaberite jednu PDF datoteku iz svojih aktivnih datoteka za stvaranje sesije potpisivanja."
+selectedFile = "Odabrani dokument"
+title = "Odaberi dokument"
+
+[groupSigning.steps.selectParticipants]
+continue = "Nastavi na postavke potpisa"
+count = "{{count}} sudionik(a) odabrano"
+label = "Odaberite sudionike"
+placeholder = "Odaberite sudionike za potpisivanje..."
+title = "Odaberite sudionike"
+
 [getPdfInfo]
 downloadJson = "Preuzmite JSON"
 downloads = "Preuzimanja"
@@ -4460,7 +4860,10 @@ zoomOut = "Umanji"
 
 [viewer]
 cannotPreviewFile = "Nije moguće pregledati datoteku"
+disableColorFilter = "Onemogući filtar boje"
 dualPageView = "Prikaz dviju stranica"
+enableDarkFilter = "Omogući tamni filtar"
+enableSepiaFilter = "Omogući sepija filtar"
 firstPage = "Prva stranica"
 lastPage = "Zadnja stranica"
 nextPage = "Sljedeća stranica"
@@ -4470,6 +4873,22 @@ singlePageView = "Prikaz jedne stranice"
 unknownFile = "Nepoznata datoteka"
 zoomIn = "Povećaj"
 zoomOut = "Umanji"
+resetZoom = "Poništi zum"
+
+[viewer.nonPdf]
+fileTypeBadge = "{{type}} datoteka"
+convertToPdf = "Pretvori u PDF"
+loading = "U�itavanje..."
+emptyFile = "Prazna datoteka"
+csvStats = "{{rows}} redaka · {{columns}} stupaca · {{size}}"
+sortedBy = "Sortirano po: {{column}}"
+columnDefault = "Stupac {{index}}"
+htmlPreviewWarning = "HTML pregled — vanjski resursi se možda neće u�itati · {{size}}"
+htmlPreview = "HTML pregled"
+invalidJson = "Nevažeći JSON — prikaz neobrađenog sadržaja"
+textStats = "{{lines}} redaka · {{size}}"
+lineNumbers = "Brojevi redaka"
+renderMarkdown = "Prikaži Markdown"
 
 [viewer.attachments]
 title = "Prilozi"
@@ -4531,6 +4950,7 @@ toggleAttachments = "Prikaži/sakrij priloge"
 toggleTheme = "Prebaci temu"
 language = "Jezik"
 toggleAnnotations = "Prebaci vidljivost bilješki"
+toggleLayers = "Prikaži/sakrij slojeve"
 search = "Pretraži PDF"
 panMode = "Na�in pomicanja"
 applyRedactionsFirst = "Najprije primijeni zacrnjivanja"
@@ -5407,20 +5827,72 @@ title = "Ispis datoteke"
 2 = "Unesite naziv pisa�a"
 
 [quickAccess]
+access = "Pristup"
+accessAddPerson = "Dodaj još jednu osobu"
+accessBack = "Natrag"
+accessCopyLink = "Kopiraj poveznicu"
+accessEmail = "Adresa e-pošte"
+accessEmailPlaceholder = "name@company.com"
+accessFileLabel = "Datoteka"
+accessGeneral = "Opći pristup"
+accessInviteTitle = "Pozovi osobe"
+accessOwner = "Vlasnik"
+accessPanel = "Pristup dokumentu"
+accessPeople = "Osobe s pristupom"
+accessRemove = "Ukloni"
+accessRestricted = "Ograni�eno"
+accessRestrictedHint = "Samo osobe s pristupom mogu otvoriti"
+accessRole = "Uloga"
+accessRoleCommenter = "Komentator"
+accessRoleEditor = "Urednik"
+accessRoleViewer = "Pregledavatelj"
+accessSelectedFile = "Odabrana datoteka"
+accessSendInvite = "Pošalji poziv"
+accessTitle = "Pristup dokumentu"
+accessYou = "Vi"
 account = "Ra�un"
+activeSessions = "Aktivne sesije"
+activeTab = "Aktivno"
 activity = "Dnevnik"
 adminSettings = "Admin postavke"
+allSessions = "Sve sesije"
 allTools = "All Tools"
 automate = "Auto"
+back = "Natrag"
+certSign = "Potpis certifikatom"
+completedSessions = "Dovršene sesije"
+completedTab = "Dovršeno"
 config = "Postavke"
+createNew = "Stvori novi zahtjev"
+createSession = "Stvori zahtjev za potpisivanje"
+dueDate = "Rok (neobavezno)"
 files = "Datoteke"
 help = "Pomoć"
+noActiveSessions = "Nema zahtjeva za potpisivanje na �ekanju ni aktivnih sesija"
+noCompletedSessions = "Nema dovršenih sesija"
+noFile = "Nije odabrana datoteka"
 read = "ÄŒitanje"
 reader = "Čita�"
+refresh = "Osvježi"
+requestSignatures = "Zatraži potpise"
+selectSingleFileToRequest = "Odaberite jednu PDF datoteku za zahtjev potpisa"
+selectedFile = "Odabrana datoteka"
+selectUsers = "Odaberite korisnike za potpis"
+selectUsersPlaceholder = "Odaberite sudionike..."
+sendingRequest = "Slanje..."
 settings = "Postavke"
 showMeAround = "Provedi me kroz"
 sign = "Potpiši"
+signatureRequests = "Zahtjevi za potpis"
+signYourself = "Potpišite sami"
+newRequest = "Novi zahtjev"
 tours = "Obilasci"
+wetSign = "Dodaj potpis"
+filterMine = "Moji"
+filterOverdue = "Zakašnjelo"
+filterSigned = "Potpisano"
+filterDeclined = "Odbijeno"
+searchDocuments = "Pretraži dokumente…"
 
 [quickAccess.helpMenu]
 adminTour = "Vodi� za administratore"
@@ -6050,11 +6522,75 @@ toolNotAvailableLocally = "Vaš Stirling-PDF poslužitelj je izvan mreže i \"{{
 expired = "Vaš sesija je istekla. Molim vas da osvježite stranicu i pokušate ponovno."
 refreshPage = "Osvježi stranicu"
 
+[sessionManagement.tooltip]
+header = "Upravljanje sesijama potpisivanja"
+
+[sessionManagement.tooltip.addParticipants]
+bullet1 = "Novi sudionici dodaju se na kraj redoslijeda potpisivanja"
+bullet2 = "Nije moguće dodavati sudionike nakon dovršetka sesije"
+bullet3 = "Svaki sudionik prima obavijest kada dođe njegov red"
+description = "Možete dodavati više sudionika u aktivnu sesiju bilo kada prije dovršavanja."
+title = "Dodavanje sudionika"
+
+[sessionManagement.tooltip.finalization]
+bullet1 = "<b>Potpuno dovršavanje</b>: svi sudionici su potpisali"
+bullet2 = "<b>Djelomi�no dovršavanje</b>: neki sudionici još nisu potpisali"
+bullet3 = "Nepotpisani sudionici bit će isklju�eni iz kona�nog dokumenta"
+bullet4 = "Nakon dovršavanja možete u�itati potpisani PDF u aktivne datoteke"
+description = "Dovršavanje objedinjuje sve potpise u jedan potpisani PDF. Ovu radnju nije moguće poništiti."
+title = "Dovršavanje sesije"
+
+[sessionManagement.tooltip.participantRemoval]
+bullet1 = "Nije moguće ukloniti sudionike koji su već potpisali"
+bullet2 = "Uklonjeni sudionici više ne primaju obavijesti"
+bullet3 = "Redoslijed potpisivanja automatski se prilagođava"
+description = "Sudionici se mogu ukloniti iz sesija prije nego potpišu."
+title = "Uklanjanje sudionika"
+
+[sessionManagement.tooltip.signatureOrder]
+bullet1 = "Svaki se potpis primjenjuje sekvencijalno na PDF"
+bullet2 = "Kasniji potpisnici mogu vidjeti ranije potpise"
+bullet3 = "Klju�no za tijekove odobravanja i pravne lance �uvanja"
+description = "Redoslijed koji odredite pri stvaranju sesije definira tko potpisuje prvi."
+title = "Redoslijed potpisa"
+
+[signatureSettings.tooltip]
+header = "Postavke izgleda potpisa"
+
+[signatureSettings.tooltip.location]
+bullet1 = "Primjeri: \"New York, USA\", \"London Office\", \"Remote\""
+bullet2 = "Nije isto što i položaj na stranici"
+bullet3 = "Može biti obavezno u određenim pravnim jurisdikcijama"
+description = "Neobavezna geografska lokacija gdje je primijenjen potpis. Sprema se u metapodacima certifikata."
+title = "Lokacija potpisa"
+
+[signatureSettings.tooltip.logo]
+bullet1 = "Prikazuje se uz potpis i tekst"
+bullet2 = "Podržava PNG, JPG formate"
+bullet3 = "Poboljšava profesionalni izgled"
+description = "Dodajte logotip tvrtke vidljivim potpisima radi brendiranja i autenti�nosti."
+title = "Logotip tvrtke"
+
+[signatureSettings.tooltip.reason]
+bullet1 = "Primjeri: \"Approval\", \"Contract Agreement\", \"Review Complete\""
+bullet2 = "Vidljivo u svojstvima potpisa PDF-a"
+bullet3 = "Korisno za revizijske tragove i usklađenost"
+description = "Neobavezan tekst koji objašnjava zašto se dokument potpisuje. Sprema se u metapodacima certifikata."
+title = "Razlog potpisa"
+
+[signatureSettings.tooltip.visibility]
+bullet1 = "<b>Vidljivo</b>: potpis se pojavljuje na PDF-u s prilagođenim izgledom"
+bullet2 = "<b>Nevidljivo</b>: certifikat ugrađen bez vidljive oznake"
+bullet3 = "Nevidljivi potpisi i dalje pružaju kriptografsku valjanost"
+description = "Upravlja time hoće li potpis biti vidljiv na dokumentu ili ugrađen nevidljivo."
+title = "Vidljivost potpisa"
+
 [settings.configuration]
 advanced = "Napredno"
 database = "Baza podataka"
 endpoints = "Endpointi"
 features = "Zna�ajke"
+storageSharing = "Pohrana i dijeljenje datoteka"
 systemSettings = "Postavke sustava"
 title = "Konfiguracija"
 
@@ -6332,10 +6868,13 @@ title = "Prijavite se u Stirling"
 [setup.selfhosted]
 link = "ili se povežite sa samohostiranim ra�unom"
 subtitle = "Unesite vjerodajnice poslužitelja"
+changeServerLocked = "Vaša organizacija je ograni�ila ovu aplikaciju na određeni poslužitelj"
 switchToLocal = "Umjesto toga koristi lokalne alate"
 title = "Prijavite se na poslužitelj"
 
 [setup.selfhosted.unreachable]
+changeServer = "Povežite se s drugim poslužiteljem"
+changeServerLocked = "Vaša organizacija je ograni�ila ovu aplikaciju na određeni poslužitelj"
 continueOffline = "Umjesto toga koristi lokalne alate"
 message = "Nije moguće doći do {{url}}. Provjerite da je poslužitelj pokrenut i dostupan."
 retry = "Pokušaj ponovno"
@@ -6529,6 +7068,15 @@ saved = "Spremljeno"
 text = "Tekst"
 title = "Vrsta potpisa"
 
+[signRequest]
+declined = "Zahtjev za potpis odbijen"
+fetchFailed = "Nije moguće u�itati zahtjev za potpis"
+signed = "Dokument uspješno potpisan"
+
+[signSession]
+createFailed = "Neuspješno stvaranje zahtjeva za potpisivanje"
+created = "Zahtjev za potpisivanje poslan"
+
 [signup]
 accountCreatedSuccessfully = "Ra�un je uspješno stvoren! Sada se možete prijaviti."
 alreadyHaveAccount = "Već imate ra�un? Prijavite se"
@@ -6807,6 +7355,106 @@ title = "Podijeli PDF naoglazdene glave"
 [splitPdfByChapters]
 tags = "podjela, glave, markere, organizacija"
 
+[storageShare]
+accessed = "Pristupljeno"
+accessDenied = "Nemate pristup ovoj dijeljenoj datoteci. Zatražite od vlasnika da je podijeli s vama."
+accessFailed = "Nije moguće u�itati aktivnost."
+accessDeniedBody = "Nemate pristup ovoj datoteci. Zatražite od vlasnika da je podijeli s vama."
+accessDeniedTitle = "Nema pristupa"
+accessLimitedCommenter = "Pristup komentiranju uskoro dolazi. Zatražite od vlasnika prava urednika ako trebate preuzeti."
+accessLimitedTitle = "Ograni�en pristup"
+accessLimitedViewer = "Ova je poveznica samo za pregled. Zatražite od vlasnika prava urednika ako trebate preuzeti."
+createdAt = "Stvoreno"
+download = "Preuzmi"
+downloadFailed = "Nije moguće preuzeti ovu datoteku."
+expiredBody = "Ova poveznica za dijeljenje je nevažeća ili je istekla."
+expiredTitle = "Poveznica je istekla"
+goToLogin = "Idi na prijavu"
+loadFailed = "Nije moguće otvoriti dijeljenu datoteku."
+loading = "U�itavanje poveznice za dijeljenje..."
+loginPrompt = "Prijavite se za pristup ovoj dijeljenoj datoteci."
+loginRequired = "Potrebna je prijava"
+openInApp = "Otvori u Stirling PDF"
+ownerLabel = "Vlasnik"
+ownerUnknown = "Nepoznato"
+requiresLogin = "Za ovu dijeljenu datoteku potrebna je prijava."
+roleCommenter = "Komentator"
+roleEditor = "Urednik"
+roleViewer = "Pregledavatelj"
+shareHeading = "Dijeljena datoteka"
+titleDefault = "Dijeljena datoteka"
+tryAgain = "Pokušajte ponovno kasnije."
+addUser = "Dodaj"
+commenterHint = "Komentiranje uskoro dolazi."
+copied = "Poveznica kopirana u međuspremnik"
+copy = "Kopiraj"
+copyFailed = "Kopiranje nije uspjelo"
+description = "Stvorite poveznicu za dijeljenje za ovu datoteku. Prijavljeni korisnici s poveznicom mogu joj pristupiti."
+downloadsCount = "Preuzimanja: {{count}}"
+emailWarningBody = "Ovo izgleda kao adresa e-pošte. Ako ova osoba još nije korisnik Stirling PDF-a, neće moći pristupiti datoteci."
+emailWarningConfirm = "Ipak podijeli"
+emailWarningTitle = "Adresa e-pošte"
+errorTitle = "Dijeljenje nije uspjelo"
+failure = "Nije moguće generirati poveznicu za dijeljenje. Pokušajte ponovno."
+fileLabel = "Datoteka"
+generate = "Generiraj poveznicu"
+generated = "Poveznica za dijeljenje generirana"
+hideActivity = "Sakrij aktivnost"
+invalidUsername = "Unesite valjano korisni�ko ime ili adresu e-pošte."
+lastAccessed = "Zadnji pristup"
+linkAccessTitle = "Pristup putem poveznice za dijeljenje"
+linkLabel = "Poveznica za dijeljenje"
+linksDisabled = "Poveznice za dijeljenje su onemogućene."
+linksDisabledBody = "Poveznice za dijeljenje su onemogućene postavkama vašeg poslužitelja."
+manage = "Upravljaj dijeljenjem"
+manageDescription = "Stvarajte i upravljajte poveznicama za dijeljenje ove datoteke."
+manageLoadFailed = "Nije moguće u�itati poveznice za dijeljenje."
+manageTitle = "Upravljanje dijeljenjem"
+noActivity = "Još nema aktivnosti."
+noLinks = "Još nema aktivnih poveznica za dijeljenje."
+noSharedUsers = "Još nitko nema pristup."
+removeLink = "Ukloni poveznicu"
+removeUser = "Ukloni"
+revokeFailed = "Nije moguće ukloniti poveznicu za dijeljenje."
+revoked = "Poveznica za dijeljenje uklonjena"
+roleLabel = "Uloga"
+sharingDisabled = "Dijeljenje je onemogućeno."
+sharingDisabledBody = "Dijeljenje je onemogućeno postavkama vašeg poslužitelja."
+sharedUsersTitle = "Korisnici s kojima je podijeljeno"
+title = "Dijeli datoteku"
+unknownUser = "Nepoznat korisnik"
+userAddFailed = "Nije moguće dijeliti s tim korisnikom."
+userAdded = "Korisnik je dodan na popis dijeljenja."
+usernameLabel = "Korisni�ko ime ili e-pošta"
+usernamePlaceholder = "Unesite korisni�ko ime ili e-poštu"
+userRemoveFailed = "Nije moguće ukloniti tog korisnika."
+userRemoved = "Korisnik je uklonjen s popisa dijeljenja."
+viewActivity = "Prikaži aktivnost"
+viewed = "Pregledano"
+viewsCount = "Pregledi: {{count}}"
+downloaded = "Preuzeto"
+bulkDescription = "Stvorite jednu poveznicu za dijeljenje svih odabranih datoteka s prijavljenim korisnicima."
+bulkTitle = "Dijeli odabrane datoteke"
+copyLink = "Kopiraj poveznicu za dijeljenje"
+fileCount = "{{count}} datoteka odabrano"
+ownerOnly = "Samo vlasnik može upravljati dijeljenjem."
+selectSingleFile = "Odaberite jednu datoteku za upravljanje dijeljenjem."
+
+[storageUpload]
+description = "Ovo prenosi trenuta�nu datoteku u pohranu na poslužitelju za vaš vlastiti pristup."
+errorTitle = "Prijenos nije uspio"
+failure = "Prijenos nije uspio. Provjerite svoje postavke prijave i pohrane."
+fileLabel = "Datoteka"
+hint = "Javnim poveznicama i na�inima pristupa upravljaju postavke vašeg poslužitelja."
+success = "Preneseno na poslužitelj"
+title = "Prenesi na poslužitelj"
+updateButton = "Ažuriraj na poslužitelju"
+uploadButton = "Prenesi na poslužitelj"
+bulkDescription = "Ovo prenosi odabrane datoteke u pohranu na vašem poslužitelju."
+bulkTitle = "Prenesi odabrane datoteke"
+fileCount = "{{count}} datoteka odabrano"
+more = " +{{count}} još"
+
 [storage]
 approximateSize = "Približna veli�ina"
 fileTooLarge = "Datoteka je prevelika. Maksimalna veli�ina po datoteci je"
@@ -7153,6 +7801,30 @@ title = "Pregled/Uredi PDF"
 [warning]
 tooltipTitle = "Upozorenje"
 
+[wetSignature.tooltip]
+header = "Metode izrade potpisa"
+
+[wetSignature.tooltip.draw]
+bullet1 = "Prilagodite boju i debljinu olovke"
+bullet2 = "Brišite i ponovno crtajte dok ne budete zadovoljni"
+bullet3 = "Radi na uređajima s dodirnim zaslonom (tableti, telefoni)"
+description = "Izradite rukom pisani potpis pomoću miša ili dodirnog zaslona. Najbolje za osobne, autenti�ne potpise."
+title = "Nacrtaj potpis"
+
+[wetSignature.tooltip.type]
+bullet1 = "Odaberite između više fontova"
+bullet2 = "Prilagodite veli�inu i boju teksta"
+bullet3 = "Idealno za standardizirane potpise"
+description = "Generirajte potpis iz upisanog teksta. Brzo i dosljedno, pogodno za poslovne dokumente."
+title = "Upiši potpis"
+
+[wetSignature.tooltip.upload]
+bullet1 = "Podržava PNG, JPG i druge slikovne formate"
+bullet2 = "Za najbolje rezultate preporu�uju se prozirne pozadine"
+bullet3 = "Slika će se promijeniti veli�inom kako bi odgovarala podru�ju potpisa"
+description = "U�itajte unaprijed izrađenu sliku potpisa. Idealno ako imate skenirani potpis ili logotip tvrtke."
+title = "U�itaj sliku potpisa"
+
 [watermark]
 completed = "Vodeni žig dodan"
 desc = "Dodajte tekstualne ili slikovne vodene žigove u PDF datoteke"
@@ -7333,6 +8005,7 @@ activeSession = "Aktivna sesija"
 addMembers = "Dodaj �lanove"
 admin = "Administrator"
 confirmDelete = "Jeste li sigurni da želite izbrisati ovog korisnika? Ova radnja se ne može poništiti."
+confirmUnlock = "Jeste li sigurni da želite otklju�ati ovaj korisni�ki ra�un?"
 deleteUser = "Izbriši korisnika"
 deleteUserError = "Nije uspjelo brisanje korisnika"
 deleteUserSuccess = "Korisnik je uspješno izbrisan"
@@ -7341,6 +8014,8 @@ disable = "Onemogući"
 disabled = "Onemogućeno"
 editRole = "Uredi ulogu"
 enable = "Omogući"
+locked = "zaklju�an"
+lockedBadge = "Zaklju�an"
 loading = "U�itavanje osoba..."
 loginRequired = "Najprije omogućite na�in prijave"
 member = "ÄŒlan"
@@ -7350,6 +8025,9 @@ searchMembers = "Pretraži �lanove..."
 status = "Status"
 team = "Tim"
 title = "Osobe"
+unlockAccount = "Otklju�aj ra�un"
+unlockUserError = "Otklju�avanje korisni�kog ra�una nije uspjelo"
+unlockUserSuccess = "Korisni�ki ra�un je uspješno otklju�an"
 user = "Korisnik"
 
 [workspace.people.actions]
diff --git a/frontend/public/locales/hu-HU/translation.toml b/frontend/public/locales/hu-HU/translation.toml
index 0830a287d5..1f239e71f2 100644
--- a/frontend/public/locales/hu-HU/translation.toml
+++ b/frontend/public/locales/hu-HU/translation.toml
@@ -8,6 +8,7 @@ black = "Fekete"
 blue = "Kék"
 bored = "Unatkozik várakozás közben?"
 cancel = "Mégse"
+confirm = "Megerősítés"
 changedCredsMessage = "A hitelesítési adatok megváltoztak!"
 chooseFile = "Fájl kiválasztása"
 close = "Bezárás"
@@ -146,6 +147,7 @@ insufficientCredits = "Elégtelen kreditek. Szükséges: {{requiredCredits}}, El
 loadingCredits = "Kreditek ellenőrzése..."
 loadingProStatus = "Előfizetési állapot ellenőrzése..."
 noticeTopUpOrPlan = "Nincs elég kredit, kérjük, töltsön fel vagy váltson csomagra"
+accessInvite = "Meghívás"
 
 [account]
 accountSettings = "Fiókbeállítások"
@@ -1427,6 +1429,34 @@ title = "Feldolgozás"
 description = "Maximális várakozási idő egy feldolgozási feladatra hiba jelentése előtt."
 label = "Feldolgozási időkorlát (másodperc)"
 
+[admin.settings.storage]
+description = "A szerver tárhely- és megosztási beállításainak kezelése."
+title = "Fájltárolás és megosztás"
+
+[admin.settings.storage.enabled]
+description = "Engedélyezi, hogy a felhasználók fájlokat tároljanak a szerveren."
+label = "Szerveres fájltárolás engedélyezése"
+
+[admin.settings.storage.sharing.email]
+description = "E-mail-címekkel való megosztás engedélyezése."
+label = "E-mailes megosztás engedélyezése"
+mailLink = "Levelezési beállítások konfigurálása"
+mailNote = "Levelezési beállítás szükséges. "
+
+[admin.settings.storage.sharing.enabled]
+description = "Engedélyezi a tárolt fájlok megosztását."
+label = "Megosztás engedélyezése"
+
+[admin.settings.storage.sharing.links]
+description = "Megosztás engedélyezése bejelentkezést igénylő linkeken keresztül."
+frontendUrlLink = "Beállítás a Rendszerbeállításokban"
+frontendUrlNote = "Frontend URL szükséges. "
+label = "Megosztási linkek engedélyezése"
+
+[admin.settings.storage.signing.enabled]
+description = "Engedélyezi több résztvevős dokumentum-aláírási munkamenetek létrehozását. A szerveres fájltárolás engedélyezése szükséges."
+label = "Csoportos aláírás engedélyezése (Alpha)"
+
 [admin.settings.unsavedChanges]
 cancel = "Szerkesztés folytatása"
 discard = "Módosítások elvetése"
@@ -2059,7 +2089,19 @@ numbers = "Számok/tartományok: 5, 10-20"
 progressions = "Sorozatok: 3n, 4n+1"
 
 [certSign]
+allSigned = "Minden résztvevő aláírt. Készen áll a véglegesítésre."
+awaitingSignatures = "Aláírásokra vár"
+signatureProgress = "{{signedCount}}/{{totalCount}} aláírás"
 chooseCertificate = "Tanúsítványfájl kiválasztása"
+declined = "Elutasítva"
+fetchFailed = "Az aláírási adatok betöltése sikertelen"
+finalized = "Véglegesítve"
+notified = "Függőben"
+partialNote = "A jelenlegi aláírásokkal korábban is véglegesíthet. Az aláíratlan résztvevők ki lesznek hagyva."
+pending = "Függőben"
+readyToFinalize = "Készen áll a véglegesítésre"
+signed = "Aláírva"
+viewed = "Megtekintve"
 chooseJksFile = "JKS fájl kiválasztása"
 chooseP12File = "PKCS12 fájl kiválasztása"
 choosePfxFile = "PFX fájl kiválasztása"
@@ -2082,6 +2124,7 @@ title = "Tanúsítvánnyal aláírás"
 invisible = "Láthatatlan"
 stepTitle = "Aláírás megjelenése"
 visible = "Látható"
+visibility = "Láthatóság"
 
 [certSign.appearance.options]
 title = "Aláírás részletei"
@@ -2188,6 +2231,252 @@ bullet4 = "Ellenőrzéshez használhat egyéni tanúsítványokat"
 text = "Ellenőrzéskor az eszköz megmondja, érvényesek-e, ki írta alá a dokumentumot, mikor történt az aláírás, és hogy megváltozott-e a dokumentum az aláírás óta."
 title = "Aláírások ellenőrzése"
 
+[certSign.collab.finalize]
+button = "Véglegesítés és az aláírt PDF betöltése"
+early = "Véglegesítés a jelenlegi aláírásokkal"
+
+[certSign.collab.sessionDetail]
+addButton = "Résztvevők hozzáadása"
+addParticipants = "Résztvevők hozzáadása"
+addParticipantsError = "A résztvevők hozzáadása sikertelen"
+backToList = "Vissza a munkamenetekhez"
+deleteConfirm = "Biztos benne? Ez a művelet nem vonható vissza."
+deleteError = "A munkamenet törlése sikertelen"
+deleted = "Munkamenet törölve"
+deleteSession = "Munkamenet törlése"
+dueDate = "Határidő"
+finalizeError = "A munkamenet véglegesítése sikertelen"
+loadPdfError = "Az aláírt PDF betöltése sikertelen"
+loadSignedPdf = "Aláírt PDF betöltése az Aktív fájlok közé"
+messageLabel = "Ãœzenet"
+noAdditionalInfo = "Nincs további információ"
+owner = "Tulajdonos"
+participantRemoved = "Résztvevő eltávolítva"
+participants = "Résztvevők"
+participantsAdded = "A résztvevők hozzáadása sikeres"
+removeParticipant = "Eltávolítás"
+removeParticipantError = "A résztvevő eltávolítása sikertelen"
+selectUsers = "Felhasználók kiválasztása..."
+sessionInfo = "Munkamenet-információ"
+workbenchTitle = "Munkamenet-kezelés"
+
+[certSign.collab.signRequest]
+addedToFiles = "A dokumentum hozzáadva az aktív fájlokhoz"
+addSignature = "Adja hozzá az aláírását"
+addToFiles = "Hozzáadás az aktív fájlokhoz"
+advancedSettings = "Speciális beállítások"
+backToList = "Vissza az aláírási kérelmekhez"
+certificateChoice = "Válasszon tanúsítványt az aláíráshoz"
+changeSignature = "Aláírás megváltoztatása"
+clearSignature = "Aláírás törlése"
+completeAndSign = "Kitöltés és aláírás"
+createNewSignature = "Új aláírás létrehozása"
+declineButton = "Elutasítás"
+decline = "Kérelem elutasítása"
+deleteSelected = "Kiválasztott aláírás törlése"
+drawSignature = "Rajzolja le az aláírását lent"
+dueDate = "Határidő"
+fileTooLarge = "A fájlméretnek 5 MB alatt kell lennie"
+fontFamily = "Betűcsalád"
+fontSize = "Betűméret: {{size}}px"
+fontSizePlaceholder = "Méret"
+from = "Feladó"
+invalidCertFile = "Válasszon P12 vagy PFX tanúsítványfájlt"
+invalidFileType = "Válasszon képfájlt"
+location = "Hely (opcionális)"
+locationPlaceholder = "Honnan ír alá?"
+message = "Ãœzenet"
+noCertificate = "Válasszon tanúsítványfájlt"
+noSignatures = "Helyezzen el legalább egy aláírást a PDF-en"
+p12File = "P12/PFX tanúsítványfájl"
+password = "Tanúsítvány jelszava"
+passwordPlaceholder = "Adja meg a jelszót..."
+penColor = "Toll színe"
+penSize = "Toll vastagsága: {{size}}px"
+placementActive = "Kattintson a PDF-re az elhelyezéshez"
+placeSignatureButton = "Aláírás elhelyezése a PDF-en"
+reason = "Indoklás (opcionális)"
+reasonPlaceholder = "Miért ír alá?"
+removeImage = "Kép eltávolítása"
+removeCertFile = "Fájl eltávolítása"
+savedSignatures = "Mentett aláírások"
+selectFile = "Képfájl kiválasztása"
+selectSignatureTitle = "Aláírás kiválasztása vagy létrehozása"
+signButton = "Dokumentum aláírása"
+signatureInfo = "Ezeket a beállításokat a dokumentum tulajdonosa állította be"
+signaturePlaced = "Aláírás elhelyezve az oldalon"
+signatureSettings = "Aláírás beállításai"
+signatureText = "Aláírás szövege"
+signatureTextPlaceholder = "Adja meg a nevét..."
+signatureTypeLabel = "Aláírás típusa"
+signingTitle = "Aláírás"
+textColor = "Szöveg színe"
+typeSignature = "�rja be a nevét az aláírás létrehozásához"
+uploadCert = "Egyéni tanúsítvány"
+uploadCertDesc = "Használja saját P12/PFX tanúsítványát"
+uploadSignature = "Töltse fel az aláírás képfájlját"
+usePersonalCert = "Személyes tanúsítvány"
+usePersonalCertDesc = "Automatikusan generálva a fiókjához"
+useServerCert = "Szervezeti tanúsítvány"
+useServerCertDesc = "Megosztott szervezeti tanúsítvány"
+workbenchTitle = "Aláírási kérelem"
+
+[certSign.collab.signRequest.canvas]
+colorPickerTitle = "Vonal színének kiválasztása"
+continue = "Folytatás"
+
+[certSign.collab.signRequest.certModal]
+description = "{{count}} aláírást helyezett el. Válassza ki a tanúsítványt az aláírás befejezéséhez."
+sign = "Dokumentum aláírása"
+certValidating = "Tanúsítvány ellenőrzése..."
+certValidUntil = "A tanúsítvány érvényes eddig: {{date}}"
+certInvalid = "Érvénytelen tanúsítvány: {{error}}"
+certInvalidFallback = "Érvénytelen tanúsítvány"
+certNetworkError = "A tanúsítvány nem ellenőrizhető"
+title = "Tanúsítvány beállítása"
+
+[certSign.collab.signRequest.image]
+hint = "Töltsön fel egy PNG vagy JPG képet az aláírásáról"
+
+[certSign.collab.signRequest.mode]
+move = "Aláírás mozgatása"
+place = "Aláírás elhelyezése"
+title = "Aláírás vagy mozgatás mód"
+
+[certSign.collab.signRequest.modeTabs]
+draw = "Rajz"
+image = "Feltöltés"
+text = "Gépelés"
+
+[certSign.collab.signRequest.placeSignature]
+message = "Kattintson a PDF-re az aláírás elhelyezéséhez"
+title = "Aláírás elhelyezése"
+
+[certSign.collab.signRequest.preview]
+imageAlt = "Kiválasztott aláírás"
+missing = "Nincs előnézet"
+textFallback = "Aláírás"
+
+[certSign.collab.signRequest.saved]
+defaultCanvasLabel = "Rajzolt aláírás"
+defaultImageLabel = "Feltöltött aláírás"
+defaultLabel = "Aláírás"
+defaultTextLabel = "Gépelt aláírás"
+delete = "Aláírás törlése"
+none = "Nincsenek mentett aláírások"
+
+[certSign.collab.signRequest.signatureType]
+draw = "Rajz"
+type = "Gépelés"
+upload = "Feltöltés"
+
+[certSign.collab.signRequest.steps]
+back = "Vissza"
+cancelPlacement = "Elhelyezés megszakítása"
+certificate = "Tanúsítvány"
+clickMultipleTimes = "Kattintson többször a PDF-re az aláírások elhelyezéséhez. Húzással mozgathatja vagy átméretezheti őket."
+clickToPlace = "Kattintson a PDF-en arra a helyre, ahol meg szeretné jeleníteni az aláírását."
+continue = "Tovább a tanúsítvány kiválasztásához"
+continueToPlacement = "Tovább az elhelyezéshez"
+continueToReview = "Tovább az áttekintéshez"
+createSignature = "Aláírás létrehozása"
+invisible = "Láthatatlan"
+location = "Hely:"
+multipleSignatures = "{{count}} aláírás kerül alkalmazásra a PDF-re"
+oneSignature = "1 aláírás kerül alkalmazásra a PDF-re"
+placeOnPdf = "Elhelyezés a PDF-en"
+reason = "Indoklás:"
+reviewTitle = "�ttekintés aláírás előtt"
+signaturePlaced = "Aláírás elhelyezve a(z) {{page}}. oldalon. Újabb kattintással módosíthatja a pozíciót, vagy folytathatja az áttekintéssel."
+visible = "Látható"
+visibility = "Láthatóság:"
+yourSignatures = "Az Ön aláírásai ({{count}})"
+
+[certSign.collab.signRequest.text]
+colorLabel = "Szín"
+fontLabel = "Betűtípus"
+fontSizeLabel = "Méret"
+fontSizePlaceholder = "16"
+label = "Aláírás szövege"
+modalHint = "Adja meg a nevét, majd kattintson a Folytatás gombra az elhelyezéshez a PDF-en."
+placeholder = "Adja meg a nevét..."
+
+[certSign.collab.participant]
+certValidating = "Tanúsítvány ellenőrzése..."
+certValid = "✓ Érvényes tanúsítvány"
+certValidUntil = " eddig: {{date}}"
+certInvalid = "✗ {{error}}"
+certInvalidFallback = "Érvénytelen tanúsítvány"
+certNetworkError = "A tanúsítvány nem ellenőrizhető"
+
+[certSign.collab.addParticipants]
+add = "{{count}} résztvevő hozzáadása"
+back = "Vissza"
+configureSignatures = "Aláírási beállítások konfigurálása"
+continue = "Tovább az aláírási beállításokhoz"
+reasonHelp = "Előre megadhatja az aláírás okát ezeknek a résztvevőknek (opcionális, aláíráskor felülírhatják)"
+reasonPlaceholder = "pl. Jóváhagyás, �ttekintés..."
+selectUsers = "Felhasználók kiválasztása"
+
+[certSign.collab.sessionCreation]
+includeSummaryPage = "Aláírási összefoglaló oldal hozzáadása"
+includeSummaryPageHelp = "A dokumentum végére egy összefoglaló oldal kerül az összes aláírási metaadattal. Az egyes oldalakon lévő digitális tanúsítvány aláírási keretek el lesznek rejtve (a kézírásos aláírásokat ez nem érinti)."
+
+[certSign.collab.sessionList]
+active = "Aktív"
+finalized = "Véglegesítve"
+
+[certSign.collab.signatureSettings]
+description = "Beállíthatja, hogyan jelenjenek meg az aláírások minden résztvevőnél"
+title = "Aláírás megjelenése"
+
+[certSign.collab.userSelector]
+inviteUsers = "Felhasználók hozzáadása"
+loadError = "A felhasználók betöltése sikertelen"
+noTeam = "Nincs csapat"
+noUsers = "Nem található más felhasználó."
+placeholder = "Felhasználók kiválasztása..."
+
+[certSign.mobile]
+panelActions = "Műveletek"
+panelDocument = "Dokumentum"
+panelPeople = "Személyek"
+
+[certSign.sessions]
+deleted = "Munkamenet törölve"
+fetchFailed = "A munkamenet részleteinek betöltése sikertelen"
+finalized = "Munkamenet véglegesítve"
+loaded = "Aláírt PDF betöltve"
+pdfNotReady = "A PDF még nem kész"
+pdfNotReadyDesc = "Az aláírt PDF előállítása folyamatban van. Próbálja meg később."
+
+[certificateChoice.tooltip]
+header = "Tanúsítványtípusok"
+
+[certificateChoice.tooltip.organization]
+bullet1 = "Rendszeradminisztrátorok kezelik"
+bullet2 = "Jogosult felhasználók között megosztva"
+bullet3 = "A vállalatot képviseli, nem egyéni felhasználót"
+bullet4 = "Ajánlott: hivatalos dokumentumok, csapat-aláírások"
+description = "A szervezet által biztosított megosztott tanúsítvány. Vállalati szintű aláírási jogosultsághoz használható."
+title = "Szervezeti tanúsítvány"
+
+[certificateChoice.tooltip.personal]
+bullet1 = "Első használatkor automatikusan generálódik"
+bullet2 = "A felhasználói fiókjához kapcsolódik"
+bullet3 = "Nem osztható meg más felhasználókkal"
+bullet4 = "Ajánlott: személyes dokumentumok, egyéni felelősségvállalás"
+description = "A felhasználói fiókjához egyedileg generált tanúsítvány. Egyéni aláírásokhoz megfelelő."
+title = "Személyes tanúsítvány"
+
+[certificateChoice.tooltip.upload]
+bullet1 = "P12/PFX fájlt és jelszót igényel"
+bullet2 = "Külső hitelesítésszolgáltató bocsáthatja ki"
+bullet3 = "Magasabb bizalmi szint jogi dokumentumokhoz"
+bullet4 = "Ajánlott: jogilag kötelező erejű szerződések, külső hitelesítés"
+description = "Használja saját PKCS#12 tanúsítványfájlját. Teljes kontrollt biztosít a tanúsítvány tulajdonságai felett."
+title = "Egyéni P12 feltöltése"
+
 [changeCreds]
 changePassword = "Az alapértelmezett bejelentkezési adatokat használja. Kérjük, adjon meg új jelszót"
 changeUsername = "Felhasználónév frissítése. A frissítés után ki lesz jelentkeztetve."
@@ -3242,6 +3531,46 @@ totalSelected = "Összesen kiválasztva"
 unsupported = "Nem támogatott"
 unzip = "Kicsomagolás"
 uploadError = "Néhány fájl feltöltése nem sikerült."
+copyCreated = "Másolat elmentve erre az eszközre."
+copyFailed = "Nem sikerült másolatot létrehozni."
+leaveShare = "Eltávolítás a listámról"
+leaveShareFailed = "Nem sikerült eltávolítani a megosztott fájlt."
+leaveShareSuccess = "Eltávolítva a megosztott listájáról."
+removeBoth = "Eltávolítás mindkettőről"
+removeFilePrompt = "Ez a fájl ezen az eszközön és a szerveren is mentve van. Honnan szeretné eltávolítani?"
+removeFileTitle = "Fájl eltávolítása"
+removeLocalOnly = "Csak erről az eszközről"
+removeServerFailed = "Nem sikerült eltávolítani a fájlt a szerverről."
+removeServerOnly = "Csak a szerverről"
+removeServerOnlyPrompt = "Ez a fájl csak a szerveren van tárolva. Eltávolítja a szerverről?"
+removeServerSuccess = "Eltávolítva a szerverről."
+removeSharedPrompt = "Ezt a fájlt megosztották Önnel. Eltávolíthatja erről az eszközről vagy a megosztott listájáról."
+removeSharedServerOnlyBlockedPrompt = "Ezt a fájlt megosztották Önnel, és csak a szerveren van tárolva."
+removeSharedServerOnlyPrompt = "Ezt a fájlt megosztották Önnel, és csak a szerveren van tárolva. Eltávolítja a listájáról?"
+changesNotUploaded = "A módosítások nincsenek feltöltve"
+cloudFile = "Felhőfájl"
+filterAll = "Összes"
+filterLocal = "Helyi"
+filterSharedByMe = "�ltalam megosztva"
+filterSharedWithMe = "Velem megosztva"
+lastSynced = "Utoljára szinkronizálva"
+localOnly = "Csak helyi"
+makeCopy = "Másolat készítése"
+owner = "Tulajdonos"
+ownerUnknown = "Ismeretlen"
+share = "Megosztás"
+shareSelected = "Kijelöltek megosztása"
+sharedByYou = "Ön által megosztva"
+sharedEditNoticeBody = "Nincs szerkesztési joga a fájl szerveres verziójához. A módosítások helyi másolatként lesznek mentve."
+sharedEditNoticeConfirm = "Értettem"
+sharedEditNoticeTitle = "Csak olvasható szerverpéldány"
+sharedWithYou = "Önnel megosztva"
+sharing = "Megosztás"
+storageState = "Tárhely"
+synced = "Szinkronizálva"
+updateOnServer = "Frissítés a szerveren"
+uploadSelected = "Kijelöltek feltöltése"
+uploadToServer = "Feltöltés a szerverre"
 
 [files]
 addFiles = "Fájlok hozzáadása"
@@ -3367,6 +3696,77 @@ title = "PDF-ek lapításáról"
 discord = "Discord"
 issues = "GitHub"
 
+[groupSigning.tooltip]
+header = "A csoportos aláírásról"
+
+[groupSigning.tooltip.finalization]
+bullet1 = "Minden aláírás az Ön által meghatározott résztvevői sorrendben kerül alkalmazásra"
+bullet2 = "Szükség esetén részleges aláírásokkal is véglegesíthet"
+bullet3 = "A véglegesítés után a munkamenet nem módosítható"
+description = "Miután minden résztvevő aláírt (vagy korábban véglegesít), elkészítheti a végleges, aláírt PDF-et."
+title = "Véglegesítési folyamat"
+
+[groupSigning.tooltip.roles]
+bullet1 = "Tulajdonos (Ön): munkamenetet hoz létre, beállítja az aláírási alapértelmezéseket, véglegesíti a dokumentumot"
+bullet2 = "Résztvevők: elkészítik az aláírásukat, tanúsítványt választanak, elhelyezik a PDF-en"
+bullet3 = "A résztvevők nem módosíthatják az aláírás láthatóságát, okát vagy helyét"
+description = "Ön szabályozza az aláírás megjelenésének beállításait minden résztvevő számára."
+title = "Szerepkörök"
+
+[groupSigning.tooltip.sequential]
+bullet1 = "Az első résztvevőnek alá kell írnia, mielőtt a második hozzáférhet a dokumentumhoz"
+bullet2 = "Biztosítja a megfelelő aláírási sorrendet a jogszabályok betartásához"
+bullet3 = "A résztvevők sorrendje a listában húzással módosítható"
+description = "A résztvevők az Ön által meghatározott sorrendben írják alá a dokumentumot. Minden aláíró értesítést kap, amikor rá kerül a sor."
+title = "Szekvenciális aláírás"
+
+[groupSigning.steps]
+back = "Vissza"
+completed = "Kész"
+current = "Aktuális"
+stepLabel = "{{number}}. lépés"
+
+[groupSigning.steps.configureDefaults]
+continue = "Tovább az áttekintéshez"
+invisible = "Az aláírások láthatatlanok lesznek (csak metaadat)"
+locationLabel = "Hely:"
+preview = "Előnézet"
+reasonLabel = "Indoklás:"
+title = "Aláírási beállítások konfigurálása"
+visible = "Az aláírások a(z) {{page}}. oldalon lesznek láthatók"
+
+[groupSigning.steps.review]
+document = "Dokumentum"
+dueDate = "Határidő (opcionális)"
+dueDatePlaceholder = "Válasszon határidőt..."
+invisible = "Láthatatlan (csak metaadat)"
+location = "Hely:"
+logo = "Logó:"
+logoHidden = "Nincs logó"
+logoShown = "Stirling PDF logó megjelenítve"
+participants = "Résztvevők"
+reason = "Indoklás:"
+send = "Aláírási kérelmek küldése"
+signatureSettings = "Aláírás beállításai"
+title = "Munkamenet részleteinek áttekintése"
+titleShort = "�ttekintés és küldés"
+visibility = "Láthatóság:"
+visible = "Látható a(z) {{page}}. oldalon"
+participantCount = "{{count}} résztvevő ír alá sorrendben"
+
+[groupSigning.steps.selectDocument]
+continue = "Tovább a résztvevők kiválasztásához"
+noFile = "Válasszon ki egyetlen PDF fájlt az aktív fájlok közül az aláírási munkamenet létrehozásához."
+selectedFile = "Kiválasztott dokumentum"
+title = "Dokumentum kiválasztása"
+
+[groupSigning.steps.selectParticipants]
+continue = "Tovább az aláírási beállításokhoz"
+count = "{{count}} résztvevő kiválasztva"
+label = "Résztvevők kiválasztása"
+placeholder = "Válassza ki az aláíró résztvevőket..."
+title = "Résztvevők kiválasztása"
+
 [getPdfInfo]
 downloadJson = "JSON letöltése"
 downloads = "Letöltések"
@@ -4460,7 +4860,10 @@ zoomOut = "Kicsinyítés"
 
 [viewer]
 cannotPreviewFile = "A fájl előnézete nem lehetséges"
+disableColorFilter = "Színszűrő kikapcsolása"
 dualPageView = "Kétoldalas nézet"
+enableDarkFilter = "Sötét szűrő engedélyezése"
+enableSepiaFilter = "Szépia szűrő engedélyezése"
 firstPage = "Első oldal"
 lastPage = "Utolsó oldal"
 nextPage = "Következő oldal"
@@ -4470,6 +4873,22 @@ singlePageView = "Egyoldalas nézet"
 unknownFile = "Ismeretlen fájl"
 zoomIn = "Nagyítás"
 zoomOut = "Kicsinyítés"
+resetZoom = "Nagyítás visszaállítása"
+
+[viewer.nonPdf]
+fileTypeBadge = "{{type}} fájl"
+convertToPdf = "Konvertálás PDF-be"
+loading = "Betöltés..."
+emptyFile = "Üres fájl"
+csvStats = "{{rows}} sor · {{columns}} oszlop · {{size}}"
+sortedBy = "Rendezve: {{column}}"
+columnDefault = "{{index}}. oszlop"
+htmlPreviewWarning = "HTML előnézet — a külső erőforrások nem biztos, hogy betöltődnek · {{size}}"
+htmlPreview = "HTML előnézet"
+invalidJson = "Érvénytelen JSON — nyers tartalom megjelenítése"
+textStats = "{{lines}} sor · {{size}}"
+lineNumbers = "Sorszámok"
+renderMarkdown = "Markdown megjelenítése"
 
 [viewer.attachments]
 title = "Mellékletek"
@@ -4531,6 +4950,7 @@ toggleAttachments = "Mellékletek megjelenítése/elrejtése"
 toggleTheme = "Téma váltása"
 language = "Nyelv"
 toggleAnnotations = "Jegyzetek láthatóságának váltása"
+toggleLayers = "Rétegek váltása"
 search = "PDF keresése"
 panMode = "Pásztázó mód"
 applyRedactionsFirst = "Előbb alkalmazza a kitakarásokat"
@@ -5407,20 +5827,72 @@ title = "Fájl nyomtatása"
 2 = "Adja meg a nyomtató nevét"
 
 [quickAccess]
+access = "Hozzáférés"
+accessAddPerson = "További személy hozzáadása"
+accessBack = "Vissza"
+accessCopyLink = "Hivatkozás másolása"
+accessEmail = "E-mail-cím"
+accessEmailPlaceholder = "name@company.com"
+accessFileLabel = "Fájl"
+accessGeneral = "�ltalános hozzáférés"
+accessInviteTitle = "Személyek meghívása"
+accessOwner = "Tulajdonos"
+accessPanel = "Dokumentum-hozzáférés"
+accessPeople = "Hozzáféréssel rendelkezők"
+accessRemove = "Eltávolítás"
+accessRestricted = "Korlátozott"
+accessRestrictedHint = "Csak a hozzáféréssel rendelkezők nyithatják meg"
+accessRole = "Szerepkör"
+accessRoleCommenter = "Hozzászóló"
+accessRoleEditor = "Szerkesztő"
+accessRoleViewer = "Megtekintő"
+accessSelectedFile = "Kiválasztott fájl"
+accessSendInvite = "Meghívó küldése"
+accessTitle = "Dokumentum-hozzáférés"
+accessYou = "Ön"
 account = "Fiók"
+activeSessions = "Aktív munkamenetek"
+activeTab = "Aktív"
 activity = "Napló"
 adminSettings = "Admin beáll."
+allSessions = "Összes munkamenet"
 allTools = "All Tools"
 automate = "Autom."
+back = "Vissza"
+certSign = "Tanúsítványos aláírás"
+completedSessions = "Befejezett munkamenetek"
+completedTab = "Befejezett"
 config = "Konfig"
+createNew = "Új kérelem létrehozása"
+createSession = "Aláírási kérelem létrehozása"
+dueDate = "Határidő (opcionális)"
 files = "Fájlok"
 help = "Súgó"
+noActiveSessions = "Nincsenek függőben lévő aláírási kérelmek vagy aktív munkamenetek"
+noCompletedSessions = "Nincs befejezett munkamenet"
+noFile = "Nincs fájl kiválasztva"
 read = "Olvasás"
 reader = "Olvasó"
+refresh = "Frissítés"
+requestSignatures = "Aláírások kérése"
+selectSingleFileToRequest = "Válasszon ki egyetlen PDF fájlt az aláírások kéréséhez"
+selectedFile = "Kiválasztott fájl"
+selectUsers = "Válassza ki az aláíró felhasználókat"
+selectUsersPlaceholder = "Válasszon résztvevőket..."
+sendingRequest = "Küldés..."
 settings = "Beáll."
 showMeAround = "Vezessen körbe"
 sign = "Aláírás"
+signatureRequests = "Aláírási kérelmek"
+signYourself = "Saját aláírás"
+newRequest = "Új kérelem"
 tours = "Bemutatók"
+wetSign = "Aláírás hozzáadása"
+filterMine = "Saját"
+filterOverdue = "Lejárt"
+filterSigned = "Aláírva"
+filterDeclined = "Elutasítva"
+searchDocuments = "Dokumentumok keresése…"
 
 [quickAccess.helpMenu]
 adminTour = "Admin túra"
@@ -6050,11 +6522,75 @@ toolNotAvailableLocally = "A Stirling-PDF szervere offline, és a(z) \"{{endpoin
 expired = "A munkamenet lejárt. Kérjük, frissítse az oldalt és próbálja újra."
 refreshPage = "Oldal frissítése"
 
+[sessionManagement.tooltip]
+header = "Aláírási munkamenetek kezelése"
+
+[sessionManagement.tooltip.addParticipants]
+bullet1 = "Az új résztvevők az aláírási sorrend végére kerülnek"
+bullet2 = "Véglegesítés után nem adhatók hozzá résztvevők"
+bullet3 = "Minden résztvevő értesítést kap, amikor rá kerül a sor"
+description = "A véglegesítésig bármikor adhat hozzá résztvevőket egy aktív munkamenethez."
+title = "Résztvevők hozzáadása"
+
+[sessionManagement.tooltip.finalization]
+bullet1 = "<b>Teljes véglegesítés</b>: minden résztvevő aláírt"
+bullet2 = "<b>Részleges véglegesítés</b>: néhány résztvevő még nem írt alá"
+bullet3 = "Az aláíratlan résztvevők kimaradnak a végleges dokumentumból"
+bullet4 = "Véglegesítés után az aláírt PDF betölthető az aktív fájlok közé"
+description = "A véglegesítés az összes aláírást egyetlen aláírt PDF-be egyesíti. Ez a művelet nem vonható vissza."
+title = "Munkamenet véglegesítése"
+
+[sessionManagement.tooltip.participantRemoval]
+bullet1 = "A már aláírt résztvevők nem távolíthatók el"
+bullet2 = "Az eltávolított résztvevők nem kapnak több értesítést"
+bullet3 = "Az aláírási sorrend automatikusan igazodik"
+description = "A résztvevők az aláírás előtt eltávolíthatók a munkamenetből."
+title = "Résztvevők eltávolítása"
+
+[sessionManagement.tooltip.signatureOrder]
+bullet1 = "Minden aláírás szekvenciálisan kerül a PDF-re"
+bullet2 = "A későbbi aláírók láthatják a korábbi aláírásokat"
+bullet3 = "Létfontosságú jóváhagyási folyamatoknál és jogi nyomonkövetésnél"
+description = "A munkamenet létrehozásakor megadott sorrend határozza meg, ki ír alá először."
+title = "Aláírási sorrend"
+
+[signatureSettings.tooltip]
+header = "Aláírás megjelenésének beállításai"
+
+[signatureSettings.tooltip.location]
+bullet1 = "Példák: „New York, USA�, „London iroda�, „Távoli�"
+bullet2 = "Nem azonos az oldalon elfoglalt helyzettel"
+bullet3 = "Bizonyos joghatóságokban kötelező lehet"
+description = "Opcionális földrajzi hely, ahol az aláírás történt. A tanúsítvány metaadataiban tárolódik."
+title = "Aláírás helye"
+
+[signatureSettings.tooltip.logo]
+bullet1 = "Az aláírás és a szöveg mellett jelenik meg"
+bullet2 = "Támogatott formátumok: PNG, JPG"
+bullet3 = "Professzionális megjelenést kölcsönöz"
+description = "Adjon vállalati logót a látható aláírásokhoz a márkaépítés és a hitelesség érdekében."
+title = "Vállalati logó"
+
+[signatureSettings.tooltip.reason]
+bullet1 = "Példák: „Jóváhagyás�, „Szerződéskötés�, „�ttekintés kész�"
+bullet2 = "Látható a PDF aláírási tulajdonságaiban"
+bullet3 = "Hasznos ellenőrzési nyomvonalhoz és megfeleléshez"
+description = "Opcionális szöveg, amely megmagyarázza az aláírás okát. A tanúsítvány metaadataiban tárolódik."
+title = "Aláírás oka"
+
+[signatureSettings.tooltip.visibility]
+bullet1 = "<b>Látható</b>: az aláírás egyéni megjelenéssel látható a PDF-en"
+bullet2 = "<b>Láthatatlan</b>: a tanúsítvány vizuális jelölés nélkül beágyazva"
+bullet3 = "A láthatatlan aláírások is kriptográfiai hitelesítést nyújtanak"
+description = "Szabályozza, hogy az aláírás látható-e a dokumentumban vagy láthatatlanul legyen beágyazva."
+title = "Aláírás láthatósága"
+
 [settings.configuration]
 advanced = "Speciális"
 database = "Adatbázis"
 endpoints = "Végpontok"
 features = "Funkciók"
+storageSharing = "Fájltárolás és megosztás"
 systemSettings = "Rendszerbeállítások"
 title = "Konfiguráció"
 
@@ -6332,10 +6868,13 @@ title = "Bejelentkezés a Stirlingbe"
 [setup.selfhosted]
 link = "vagy csatlakozzon egy saját üzemeltetésű fiókhoz"
 subtitle = "Adja meg a szerver hitelesítő adatait"
+changeServerLocked = "A szervezete egy konkrét szerverre korlátozta az alkalmazást"
 switchToLocal = "Használja inkább a helyi eszközöket"
 title = "Bejelentkezés a szerverre"
 
 [setup.selfhosted.unreachable]
+changeServer = "Kapcsolódás másik szerverhez"
+changeServerLocked = "A szervezete egy konkrét szerverre korlátozta az alkalmazást"
 continueOffline = "Használja inkább a helyi eszközöket"
 message = "Nem sikerült elérni: {{url}}. Ellenőrizze, hogy a szerver fut-e és elérhető-e."
 retry = "Újrapróbálás"
@@ -6529,6 +7068,15 @@ saved = "Mentett"
 text = "Szöveg"
 title = "Aláírás típusa"
 
+[signRequest]
+declined = "Aláírási kérelem elutasítva"
+fetchFailed = "Az aláírási kérelem betöltése sikertelen"
+signed = "A dokumentum sikeresen aláírva"
+
+[signSession]
+createFailed = "Az aláírási kérelem létrehozása sikertelen"
+created = "Aláírási kérelem elküldve"
+
 [signup]
 accountCreatedSuccessfully = "A fiók sikeresen létrejött! Most már bejelentkezhet."
 alreadyHaveAccount = "Már van fiókja? Jelentkezzen be"
@@ -6807,6 +7355,106 @@ title = "PDF felosztása fejezetek szerint"
 [splitPdfByChapters]
 tags = "felosztás,fejezetek,könyvjelzők,rendszerezés"
 
+[storageShare]
+accessed = "Megnyitva"
+accessDenied = "Nincs hozzáférése ehhez a megosztott fájlhoz. Kérje meg a tulajdonost, hogy ossza meg Önnel."
+accessFailed = "Az aktivitás nem tölthető be."
+accessDeniedBody = "Nincs hozzáférése ehhez a fájlhoz. Kérje meg a tulajdonost, hogy ossza meg Önnel."
+accessDeniedTitle = "Nincs hozzáférés"
+accessLimitedCommenter = "A hozzászólói hozzáférés hamarosan elérhető. Letöltéshez kérjen szerkesztői jogosultságot a tulajdonostól."
+accessLimitedTitle = "Korlátozott hozzáférés"
+accessLimitedViewer = "Ez a hivatkozás csak megtekintésre szolgál. Letöltéshez kérjen szerkesztői jogosultságot a tulajdonostól."
+createdAt = "Létrehozva"
+download = "Letöltés"
+downloadFailed = "A fájl nem tölthető le."
+expiredBody = "Ez a megosztási hivatkozás érvénytelen vagy lejárt."
+expiredTitle = "A hivatkozás lejárt"
+goToLogin = "Ugrás a bejelentkezéshez"
+loadFailed = "A megosztott fájl nem nyitható meg."
+loading = "Megosztási hivatkozás betöltése..."
+loginPrompt = "Jelentkezzen be a megosztott fájl eléréséhez."
+loginRequired = "Bejelentkezés szükséges"
+openInApp = "Megnyitás a Stirling PDF-ben"
+ownerLabel = "Tulajdonos"
+ownerUnknown = "Ismeretlen"
+requiresLogin = "Ehhez a megosztott fájlhoz bejelentkezés szükséges."
+roleCommenter = "Hozzászóló"
+roleEditor = "Szerkesztő"
+roleViewer = "Megtekintő"
+shareHeading = "Megosztott fájl"
+titleDefault = "Megosztott fájl"
+tryAgain = "Kérjük, próbálja meg később."
+addUser = "Hozzáadás"
+commenterHint = "A hozzászólás hamarosan elérhető."
+copied = "Hivatkozás a vágólapra másolva"
+copy = "Másolás"
+copyFailed = "A másolás sikertelen"
+description = "Hozzon létre megosztási hivatkozást ehhez a fájlhoz. A bejelentkezett felhasználók a link birtokában elérhetik."
+downloadsCount = "Letöltések: {{count}}"
+emailWarningBody = "Ez e-mail-címnek tűnik. Ha ez a személy nem Stirling PDF felhasználó, nem fogja tudni elérni a fájlt."
+emailWarningConfirm = "Megosztás mindenképp"
+emailWarningTitle = "E-mail-cím"
+errorTitle = "A megosztás sikertelen"
+failure = "Nem sikerült megosztási hivatkozást létrehozni. Kérjük, próbálja újra."
+fileLabel = "Fájl"
+generate = "Hivatkozás létrehozása"
+generated = "Megosztási hivatkozás létrehozva"
+hideActivity = "Aktivitás elrejtése"
+invalidUsername = "Adjon meg érvényes felhasználónevet vagy e-mail-címet."
+lastAccessed = "Utoljára megnyitva"
+linkAccessTitle = "Megosztási hivatkozás hozzáférése"
+linkLabel = "Megosztási hivatkozás"
+linksDisabled = "A megosztási hivatkozások le vannak tiltva."
+linksDisabledBody = "A megosztási hivatkozások a szerver beállításai miatt le vannak tiltva."
+manage = "Megosztás kezelése"
+manageDescription = "Hozzon létre és kezeljen linkeket a fájl megosztásához."
+manageLoadFailed = "A megosztási hivatkozások nem tölthetők be."
+manageTitle = "Megosztás kezelése"
+noActivity = "Még nincs aktivitás."
+noLinks = "Még nincsenek aktív megosztási hivatkozások."
+noSharedUsers = "Még nincs felhasználó, aki hozzáfér."
+removeLink = "Hivatkozás eltávolítása"
+removeUser = "Eltávolítás"
+revokeFailed = "A megosztási hivatkozás nem távolítható el."
+revoked = "Megosztási hivatkozás eltávolítva"
+roleLabel = "Szerepkör"
+sharingDisabled = "A megosztás le van tiltva."
+sharingDisabledBody = "A megosztást a szerver beállításai letiltották."
+sharedUsersTitle = "Megosztott felhasználók"
+title = "Fájl megosztása"
+unknownUser = "Ismeretlen felhasználó"
+userAddFailed = "Nem sikerült megosztani ezzel a felhasználóval."
+userAdded = "Felhasználó hozzáadva a megosztási listához."
+usernameLabel = "Felhasználónév vagy e‑mail-cím"
+usernamePlaceholder = "Adjon meg egy felhasználónevet vagy e‑mail-címet"
+userRemoveFailed = "Nem sikerült eltávolítani ezt a felhasználót."
+userRemoved = "Felhasználó eltávolítva a megosztási listáról."
+viewActivity = "Tevékenység megtekintése"
+viewed = "Megtekintve"
+viewsCount = "Megtekintések: {{count}}"
+downloaded = "Letöltve"
+bulkDescription = "Hozzon létre egy hivatkozást az összes kijelölt fájl megosztásához a bejelentkezett felhasználókkal."
+bulkTitle = "Kijelölt fájlok megosztása"
+copyLink = "Megosztási hivatkozás másolása"
+fileCount = "{{count}} fájl kijelölve"
+ownerOnly = "Csak a tulajdonos kezelheti a megosztást."
+selectSingleFile = "Válasszon ki egyetlen fájlt a megosztás kezeléséhez."
+
+[storageUpload]
+description = "Ez feltölti az aktuális fájlt a szerver tárhelyére, hogy Ön hozzáférhessen."
+errorTitle = "A feltöltés sikertelen"
+failure = "A feltöltés sikertelen. Kérjük, ellenőrizze a bejelentkezési és tárhelybeállításokat."
+fileLabel = "Fájl"
+hint = "A nyilvános hivatkozásokat és a hozzáférési módokat a szerver beállításai szabályozzák."
+success = "Feltöltve a szerverre"
+title = "Feltöltés a szerverre"
+updateButton = "Frissítés a szerveren"
+uploadButton = "Feltöltés a szerverre"
+bulkDescription = "Ez a kijelölt fájlokat a szerver tárhelyére tölti fel."
+bulkTitle = "Kijelölt fájlok feltöltése"
+fileCount = "{{count}} fájl kijelölve"
+more = " +{{count}} további"
+
 [storage]
 approximateSize = "Megközelítő méret"
 fileTooLarge = "A fájl túl nagy. A fájl maximális mérete"
@@ -7153,6 +7801,30 @@ title = "PDF megtekintése/szerkesztése"
 [warning]
 tooltipTitle = "Figyelmeztetés"
 
+[wetSignature.tooltip]
+header = "Aláírás létrehozási módjai"
+
+[wetSignature.tooltip.draw]
+bullet1 = "Toll színének és vastagságának testreszabása"
+bullet2 = "Törlés és újrarajzolás, amíg elégedett"
+bullet3 = "Működik érintőkészülékeken (táblagépek, telefonok)"
+description = "Kézzel írt aláírást hozhat létre egérrel vagy érintőképernyővel. Személyes, hiteles aláírásokhoz a legjobb."
+title = "Aláírás rajzolása"
+
+[wetSignature.tooltip.type]
+bullet1 = "Válasszon több betűtípus közül"
+bullet2 = "Szöveg méretének és színének testreszabása"
+bullet3 = "Tökéletes szabványosított aláírásokhoz"
+description = "Begépelt szövegből generál aláírást. Gyors és egységes, üzleti dokumentumokhoz alkalmas."
+title = "Aláírás begépelése"
+
+[wetSignature.tooltip.upload]
+bullet1 = "Támogatja a PNG, JPG és más képformátumokat"
+bullet2 = "A legjobb eredmény érdekében átlátszó hátteret javaslunk"
+bullet3 = "A képet átméretezzük, hogy illeszkedjen az aláírási területhez"
+description = "Töltsön fel előre elkészített aláírásképet. Ideális, ha van beszkennelt aláírása vagy céges logója."
+title = "Aláíráskép feltöltése"
+
 [watermark]
 completed = "Vízjel hozzáadva"
 desc = "Szöveg- vagy képvízjelek hozzáadása PDF fájlokhoz"
@@ -7333,6 +8005,7 @@ activeSession = "Aktív munkamenet"
 addMembers = "Tagok hozzáadása"
 admin = "Admin"
 confirmDelete = "Biztosan törli ezt a felhasználót? Ez a művelet nem vonható vissza."
+confirmUnlock = "Biztosan feloldja ezt a felhasználói fiókot?"
 deleteUser = "Felhasználó törlése"
 deleteUserError = "A felhasználó törlése sikertelen"
 deleteUserSuccess = "Felhasználó sikeresen törölve"
@@ -7341,6 +8014,8 @@ disable = "Letiltás"
 disabled = "Letiltva"
 editRole = "Szerepkör szerkesztése"
 enable = "Engedélyezés"
+locked = "zárolva"
+lockedBadge = "Zárolva"
 loading = "Tagok betöltése..."
 loginRequired = "Előbb engedélyezze a bejelentkezési módot"
 member = "Tag"
@@ -7350,6 +8025,9 @@ searchMembers = "Tagok keresése..."
 status = "�llapot"
 team = "Csapat"
 title = "Tagok"
+unlockAccount = "Fiók feloldása"
+unlockUserError = "Nem sikerült feloldani a felhasználói fiókot"
+unlockUserSuccess = "A felhasználói fiók sikeresen feloldva"
 user = "Felhasználó"
 
 [workspace.people.actions]
diff --git a/frontend/public/locales/id-ID/translation.toml b/frontend/public/locales/id-ID/translation.toml
index 98a9c6a2cc..3ca00ceb3c 100644
--- a/frontend/public/locales/id-ID/translation.toml
+++ b/frontend/public/locales/id-ID/translation.toml
@@ -8,6 +8,7 @@ black = "Hitam"
 blue = "Biru"
 bored = "Bosan Menunggu?"
 cancel = "Batal"
+confirm = "Konfirmasi"
 changedCredsMessage = "Kredensial berubah!!"
 chooseFile = "Pilih File"
 close = "Tutup"
@@ -146,6 +147,7 @@ insufficientCredits = "Kredit tidak mencukupi. Diperlukan: {{requiredCredits}},
 loadingCredits = "Memeriksa kredit..."
 loadingProStatus = "Memeriksa status langganan..."
 noticeTopUpOrPlan = "Kredit tidak mencukupi, silakan isi ulang atau upgrade ke paket"
+accessInvite = "Undang"
 
 [account]
 accountSettings = "Pengaturan Akun"
@@ -1427,6 +1429,34 @@ title = "Pemrosesan"
 description = "Waktu maksimum menunggu pekerjaan pemrosesan sebelum melaporkan kesalahan."
 label = "Batas Waktu Pemrosesan (detik)"
 
+[admin.settings.storage]
+description = "Kendalikan opsi penyimpanan dan berbagi server."
+title = "Penyimpanan File & Berbagi"
+
+[admin.settings.storage.enabled]
+description = "Izinkan pengguna menyimpan file di server."
+label = "Aktifkan Penyimpanan File di Server"
+
+[admin.settings.storage.sharing.email]
+description = "Izinkan berbagi dengan alamat email."
+label = "Aktifkan Berbagi via Email"
+mailLink = "Konfigurasikan Pengaturan Email"
+mailNote = "Memerlukan konfigurasi email. "
+
+[admin.settings.storage.sharing.enabled]
+description = "Izinkan pengguna untuk membagikan file yang tersimpan."
+label = "Aktifkan Berbagi"
+
+[admin.settings.storage.sharing.links]
+description = "Izinkan berbagi melalui tautan yang memerlukan masuk."
+frontendUrlLink = "Konfigurasikan di Pengaturan Sistem"
+frontendUrlNote = "Memerlukan URL Frontend. "
+label = "Aktifkan Tautan Berbagi"
+
+[admin.settings.storage.signing.enabled]
+description = "Izinkan pengguna membuat sesi penandatanganan dokumen multi-peserta. Memerlukan penyimpanan file di server diaktifkan."
+label = "Aktifkan Penandatanganan Grup (Alpha)"
+
 [admin.settings.unsavedChanges]
 cancel = "Lanjutkan Mengedit"
 discard = "Buang Perubahan"
@@ -2059,7 +2089,19 @@ numbers = "Angka/rentang: 5, 10-20"
 progressions = "Progresi: 3n, 4n+1"
 
 [certSign]
+allSigned = "Semua peserta telah menandatangani. Siap difinalisasi."
+awaitingSignatures = "Menunggu tanda tangan"
+signatureProgress = "{{signedCount}}/{{totalCount}} tanda tangan"
 chooseCertificate = "Pilih File Sertifikat"
+declined = "Ditolak"
+fetchFailed = "Gagal memuat data penandatanganan"
+finalized = "Difinalisasi"
+notified = "Tertunda"
+partialNote = "Anda dapat memfinalisasi lebih awal dengan tanda tangan saat ini. Peserta yang belum menandatangani akan dikecualikan."
+pending = "Tertunda"
+readyToFinalize = "Siap difinalisasi"
+signed = "Ditandatangani"
+viewed = "Dilihat"
 chooseJksFile = "Pilih File JKS"
 chooseP12File = "Pilih File PKCS12"
 choosePfxFile = "Pilih File PFX"
@@ -2082,6 +2124,7 @@ title = "Penandatanganan Sertifikat"
 invisible = "Tidak terlihat"
 stepTitle = "Tampilan Tanda Tangan"
 visible = "Terlihat"
+visibility = "Visibilitas"
 
 [certSign.appearance.options]
 title = "Detail Tanda Tangan"
@@ -2188,6 +2231,252 @@ bullet4 = "Dapat menggunakan sertifikat kustom untuk verifikasi"
 text = "Saat Anda memeriksa tanda tangan, alat ini memberi tahu apakah tanda tangan valid, siapa yang menandatangani dokumen, kapan ditandatangani, dan apakah dokumen telah berubah sejak penandatanganan."
 title = "Memeriksa Tanda Tangan"
 
+[certSign.collab.finalize]
+button = "Finalisasi dan Muat PDF Bertanda Tangan"
+early = "Finalisasi dengan Tanda Tangan Saat Ini"
+
+[certSign.collab.sessionDetail]
+addButton = "Tambah Peserta"
+addParticipants = "Tambah Peserta"
+addParticipantsError = "Gagal menambahkan peserta"
+backToList = "Kembali ke Sesi"
+deleteConfirm = "Anda yakin? Ini tidak dapat dibatalkan."
+deleteError = "Gagal menghapus sesi"
+deleted = "Sesi dihapus"
+deleteSession = "Hapus Sesi"
+dueDate = "Tanggal Jatuh Tempo"
+finalizeError = "Gagal memfinalisasi sesi"
+loadPdfError = "Gagal memuat PDF bertanda tangan"
+loadSignedPdf = "Muat PDF Bertanda Tangan ke File Aktif"
+messageLabel = "Pesan"
+noAdditionalInfo = "Tidak ada informasi tambahan"
+owner = "Pemilik"
+participantRemoved = "Peserta dihapus"
+participants = "Peserta"
+participantsAdded = "Peserta berhasil ditambahkan"
+removeParticipant = "Hapus"
+removeParticipantError = "Gagal menghapus peserta"
+selectUsers = "Pilih pengguna..."
+sessionInfo = "Info Sesi"
+workbenchTitle = "Manajemen Sesi"
+
+[certSign.collab.signRequest]
+addedToFiles = "Dokumen ditambahkan ke file aktif"
+addSignature = "Tambahkan Tanda Tangan Anda"
+addToFiles = "Tambahkan ke File Aktif"
+advancedSettings = "Pengaturan Lanjutan"
+backToList = "Kembali ke Permintaan Tanda Tangan"
+certificateChoice = "Pilih sertifikat untuk menandatangani"
+changeSignature = "Ubah tanda tangan"
+clearSignature = "Hapus Tanda Tangan"
+completeAndSign = "Lengkapi & Tanda Tangani"
+createNewSignature = "Buat Tanda Tangan Baru"
+declineButton = "Tolak"
+decline = "Tolak Permintaan"
+deleteSelected = "Hapus tanda tangan yang dipilih"
+drawSignature = "Gambar tanda tangan Anda di bawah"
+dueDate = "Tanggal Jatuh Tempo"
+fileTooLarge = "Ukuran file harus kurang dari 5MB"
+fontFamily = "Keluarga Font"
+fontSize = "Ukuran Font: {{size}}px"
+fontSizePlaceholder = "Ukuran"
+from = "Dari"
+invalidCertFile = "Pilih file sertifikat P12 atau PFX"
+invalidFileType = "Pilih file gambar"
+location = "Lokasi (Opsional)"
+locationPlaceholder = "Dari mana Anda menandatangani?"
+message = "Pesan"
+noCertificate = "Pilih file sertifikat"
+noSignatures = "Tempatkan setidaknya satu tanda tangan pada PDF"
+p12File = "File Sertifikat P12/PFX"
+password = "Kata Sandi Sertifikat"
+passwordPlaceholder = "Masukkan kata sandi..."
+penColor = "Warna Pena"
+penSize = "Ukuran Pena: {{size}}px"
+placementActive = "Klik PDF untuk menempatkan"
+placeSignatureButton = "Tempatkan Tanda Tangan pada PDF"
+reason = "Alasan (Opsional)"
+reasonPlaceholder = "Mengapa Anda menandatangani?"
+removeImage = "Hapus Gambar"
+removeCertFile = "Hapus File"
+savedSignatures = "Tanda Tangan Tersimpan"
+selectFile = "Pilih File Gambar"
+selectSignatureTitle = "Pilih atau Buat Tanda Tangan"
+signButton = "Tanda Tangani Dokumen"
+signatureInfo = "Pengaturan ini dikonfigurasi oleh pemilik dokumen"
+signaturePlaced = "Tanda tangan ditempatkan pada halaman"
+signatureSettings = "Pengaturan Tanda Tangan"
+signatureText = "Teks Tanda Tangan"
+signatureTextPlaceholder = "Masukkan nama Anda..."
+signatureTypeLabel = "Jenis Tanda Tangan"
+signingTitle = "Penandatanganan"
+textColor = "Warna Teks"
+typeSignature = "Ketik nama Anda untuk membuat tanda tangan"
+uploadCert = "Sertifikat Kustom"
+uploadCertDesc = "Gunakan sertifikat P12/PFX Anda sendiri"
+uploadSignature = "Unggah gambar tanda tangan Anda"
+usePersonalCert = "Sertifikat Pribadi"
+usePersonalCertDesc = "Dibuat otomatis untuk akun Anda"
+useServerCert = "Sertifikat Organisasi"
+useServerCertDesc = "Sertifikat organisasi bersama"
+workbenchTitle = "Permintaan Tanda Tangan"
+
+[certSign.collab.signRequest.canvas]
+colorPickerTitle = "Pilih warna goresan"
+continue = "Lanjutkan"
+
+[certSign.collab.signRequest.certModal]
+description = "Anda telah menempatkan {{count}} tanda tangan. Pilih sertifikat Anda untuk menyelesaikan penandatanganan."
+sign = "Tanda Tangani Dokumen"
+certValidating = "Memvalidasi sertifikat..."
+certValidUntil = "Sertifikat berlaku hingga {{date}}"
+certInvalid = "Sertifikat tidak valid: {{error}}"
+certInvalidFallback = "Sertifikat tidak valid"
+certNetworkError = "Tidak dapat memvalidasi sertifikat"
+title = "Konfigurasikan Sertifikat"
+
+[certSign.collab.signRequest.image]
+hint = "Unggah gambar PNG atau JPG dari tanda tangan Anda"
+
+[certSign.collab.signRequest.mode]
+move = "Pindahkan Tanda Tangan"
+place = "Tempatkan Tanda Tangan"
+title = "Mode tanda tangan atau pindah"
+
+[certSign.collab.signRequest.modeTabs]
+draw = "Gambar"
+image = "Unggah"
+text = "Ketik"
+
+[certSign.collab.signRequest.placeSignature]
+message = "Klik pada PDF untuk menempatkan tanda tangan Anda"
+title = "Tempatkan Tanda Tangan"
+
+[certSign.collab.signRequest.preview]
+imageAlt = "Tanda tangan terpilih"
+missing = "Tidak ada pratinjau"
+textFallback = "Tanda tangan"
+
+[certSign.collab.signRequest.saved]
+defaultCanvasLabel = "Tanda tangan hasil gambar"
+defaultImageLabel = "Tanda tangan terunggah"
+defaultLabel = "Tanda tangan"
+defaultTextLabel = "Tanda tangan ketik"
+delete = "Hapus tanda tangan"
+none = "Tidak ada tanda tangan tersimpan"
+
+[certSign.collab.signRequest.signatureType]
+draw = "Gambar"
+type = "Ketik"
+upload = "Unggah"
+
+[certSign.collab.signRequest.steps]
+back = "Kembali"
+cancelPlacement = "Batalkan Penempatan"
+certificate = "Sertifikat"
+clickMultipleTimes = "Klik pada PDF beberapa kali untuk menempatkan tanda tangan. Seret tanda tangan apa pun untuk memindahkan atau mengubah ukurannya."
+clickToPlace = "Klik pada PDF di tempat Anda ingin tanda tangan muncul."
+continue = "Lanjutkan ke Pemilihan Sertifikat"
+continueToPlacement = "Lanjutkan ke Penempatan"
+continueToReview = "Lanjutkan ke Tinjauan"
+createSignature = "Buat Tanda Tangan"
+invisible = "Tidak terlihat"
+location = "Lokasi:"
+multipleSignatures = "{{count}} tanda tangan akan diterapkan ke PDF"
+oneSignature = "1 tanda tangan akan diterapkan ke PDF"
+placeOnPdf = "Tempatkan pada PDF"
+reason = "Alasan:"
+reviewTitle = "Tinjau Sebelum Menandatangani"
+signaturePlaced = "Tanda tangan ditempatkan pada halaman {{page}}. Anda dapat menyesuaikan posisinya dengan mengeklik lagi atau lanjut ke tinjauan."
+visible = "Terlihat"
+visibility = "Visibilitas:"
+yourSignatures = "Tanda Tangan Anda ({{count}})"
+
+[certSign.collab.signRequest.text]
+colorLabel = "Warna"
+fontLabel = "Font"
+fontSizeLabel = "Ukuran"
+fontSizePlaceholder = "16"
+label = "Teks Tanda Tangan"
+modalHint = "Masukkan nama Anda, lalu klik Lanjutkan untuk menempatkannya pada PDF."
+placeholder = "Masukkan nama Anda..."
+
+[certSign.collab.participant]
+certValidating = "Memvalidasi sertifikat..."
+certValid = "✓ Sertifikat valid"
+certValidUntil = " hingga {{date}}"
+certInvalid = "✗ {{error}}"
+certInvalidFallback = "Sertifikat tidak valid"
+certNetworkError = "Tidak dapat memvalidasi sertifikat"
+
+[certSign.collab.addParticipants]
+add = "Tambahkan {{count}} Peserta"
+back = "Kembali"
+configureSignatures = "Konfigurasikan Pengaturan Tanda Tangan"
+continue = "Lanjutkan ke Pengaturan Tanda Tangan"
+reasonHelp = "Tetapkan alasan penandatanganan untuk peserta ini (opsional; mereka dapat menggantinya saat menandatangani)"
+reasonPlaceholder = "mis. Persetujuan, Tinjauan..."
+selectUsers = "Pilih Pengguna"
+
+[certSign.collab.sessionCreation]
+includeSummaryPage = "Sertakan Halaman Ringkasan Tanda Tangan"
+includeSummaryPageHelp = "Sebuah halaman ringkasan akan ditambahkan di akhir dengan semua metadata tanda tangan. Kotak tanda tangan sertifikat digital pada halaman individual akan disembunyikan (tanda tangan basah tidak terpengaruh)."
+
+[certSign.collab.sessionList]
+active = "Aktif"
+finalized = "Difinalisasi"
+
+[certSign.collab.signatureSettings]
+description = "Konfigurasikan bagaimana tanda tangan akan muncul untuk semua peserta"
+title = "Tampilan Tanda Tangan"
+
+[certSign.collab.userSelector]
+inviteUsers = "Tambah Pengguna"
+loadError = "Gagal memuat pengguna"
+noTeam = "Tidak Ada Tim"
+noUsers = "Tidak ada pengguna lain yang ditemukan."
+placeholder = "Pilih pengguna..."
+
+[certSign.mobile]
+panelActions = "Tindakan"
+panelDocument = "Dokumen"
+panelPeople = "Orang"
+
+[certSign.sessions]
+deleted = "Sesi dihapus"
+fetchFailed = "Gagal memuat detail sesi"
+finalized = "Sesi difinalisasi"
+loaded = "PDF bertanda tangan dimuat"
+pdfNotReady = "PDF Belum Siap"
+pdfNotReadyDesc = "PDF bertanda tangan sedang dibuat. Silakan coba lagi sebentar."
+
+[certificateChoice.tooltip]
+header = "Jenis Sertifikat"
+
+[certificateChoice.tooltip.organization]
+bullet1 = "Dikelola oleh administrator sistem"
+bullet2 = "Dibagikan kepada pengguna yang berwenang"
+bullet3 = "Mewakili identitas perusahaan, bukan individu"
+bullet4 = "Terbaik untuk: Dokumen resmi, tanda tangan tim"
+description = "Sertifikat bersama yang disediakan oleh organisasi Anda. Digunakan untuk kewenangan penandatanganan seluruh perusahaan."
+title = "Sertifikat Organisasi"
+
+[certificateChoice.tooltip.personal]
+bullet1 = "Dibuat otomatis saat pertama kali digunakan"
+bullet2 = "Terikat pada akun pengguna Anda"
+bullet3 = "Tidak dapat dibagikan dengan pengguna lain"
+bullet4 = "Terbaik untuk: Dokumen pribadi, akuntabilitas individu"
+description = "Sertifikat yang dibuat otomatis dan unik untuk akun pengguna Anda. Cocok untuk tanda tangan individu."
+title = "Sertifikat Pribadi"
+
+[certificateChoice.tooltip.upload]
+bullet1 = "Memerlukan file P12/PFX dan kata sandi"
+bullet2 = "Dapat diterbitkan oleh Otoritas Sertifikat eksternal"
+bullet3 = "Tingkat kepercayaan lebih tinggi untuk dokumen legal"
+bullet4 = "Terbaik untuk: Kontrak yang mengikat secara hukum, validasi eksternal"
+description = "Gunakan file sertifikat PKCS#12 milik Anda. Memberikan kontrol penuh atas properti sertifikat."
+title = "Unggah P12 Kustom"
+
 [changeCreds]
 changePassword = "Anda menggunakan kredensial login default. Silakan masukkan kata sandi baru"
 changeUsername = "Perbarui nama pengguna Anda. Anda akan keluar setelah memperbarui."
@@ -3242,6 +3531,46 @@ totalSelected = "Total Dipilih"
 unsupported = "Tidak didukung"
 unzip = "Ekstrak"
 uploadError = "Gagal mengunggah beberapa file."
+copyCreated = "Salinan disimpan ke perangkat ini."
+copyFailed = "Tidak dapat membuat salinan."
+leaveShare = "Hapus dari daftar saya"
+leaveShareFailed = "Tidak dapat menghapus file bersama."
+leaveShareSuccess = "Dihapus dari daftar berbagi Anda."
+removeBoth = "Hapus dari keduanya"
+removeFilePrompt = "File ini disimpan di perangkat ini dan di server Anda. Anda ingin menghapusnya dari mana?"
+removeFileTitle = "Hapus file"
+removeLocalOnly = "Hanya perangkat ini"
+removeServerFailed = "Tidak dapat menghapus file dari server."
+removeServerOnly = "Hanya server"
+removeServerOnlyPrompt = "File ini hanya disimpan di server Anda. Ingin menghapusnya dari server?"
+removeServerSuccess = "Dihapus dari server."
+removeSharedPrompt = "File ini dibagikan kepada Anda. Anda dapat menghapusnya dari perangkat ini atau dari daftar berbagi Anda."
+removeSharedServerOnlyBlockedPrompt = "File ini dibagikan kepada Anda dan hanya disimpan di server."
+removeSharedServerOnlyPrompt = "File ini dibagikan kepada Anda dan hanya disimpan di server. Hapus dari daftar Anda?"
+changesNotUploaded = "Perubahan tidak diunggah"
+cloudFile = "File cloud"
+filterAll = "Semua"
+filterLocal = "Lokal"
+filterSharedByMe = "Dibagikan oleh saya"
+filterSharedWithMe = "Dibagikan kepada saya"
+lastSynced = "Sinkronisasi terakhir"
+localOnly = "Hanya lokal"
+makeCopy = "Buat salinan"
+owner = "Pemilik"
+ownerUnknown = "Tidak diketahui"
+share = "Bagikan"
+shareSelected = "Bagikan yang Dipilih"
+sharedByYou = "Dibagikan oleh Anda"
+sharedEditNoticeBody = "Anda tidak memiliki hak edit untuk versi server dari file ini. Perubahan yang Anda lakukan akan disimpan sebagai salinan lokal."
+sharedEditNoticeConfirm = "Mengerti"
+sharedEditNoticeTitle = "Salinan server hanya-baca"
+sharedWithYou = "Dibagikan kepada Anda"
+sharing = "Berbagi"
+storageState = "Penyimpanan"
+synced = "Tersinkron"
+updateOnServer = "Perbarui di Server"
+uploadSelected = "Unggah yang Dipilih"
+uploadToServer = "Unggah ke Server"
 
 [files]
 addFiles = "Tambahkan file"
@@ -3367,6 +3696,77 @@ title = "Tentang Meratakan PDF"
 discord = "Discord"
 issues = "GitHub"
 
+[groupSigning.tooltip]
+header = "Tentang Penandatanganan Grup"
+
+[groupSigning.tooltip.finalization]
+bullet1 = "Semua tanda tangan diterapkan sesuai urutan peserta yang Anda tentukan"
+bullet2 = "Anda dapat memfinalisasi dengan tanda tangan sebagian bila diperlukan"
+bullet3 = "Setelah difinalisasi, sesi tidak dapat diubah"
+description = "Setelah semua peserta menandatangani (atau Anda memilih memfinalisasi lebih awal), Anda dapat membuat PDF final yang ditandatangani."
+title = "Proses Finalisasi"
+
+[groupSigning.tooltip.roles]
+bullet1 = "Pemilik (Anda): Membuat sesi, mengonfigurasi default tanda tangan, memfinalisasi dokumen"
+bullet2 = "Peserta: Membuat tanda tangan, memilih sertifikat, menempatkannya pada PDF"
+bullet3 = "Peserta tidak dapat mengubah pengaturan visibilitas, alasan, atau lokasi tanda tangan"
+description = "Anda mengontrol pengaturan tampilan tanda tangan untuk semua peserta."
+title = "Peran Peserta"
+
+[groupSigning.tooltip.sequential]
+bullet1 = "Peserta pertama harus menandatangani sebelum peserta kedua dapat mengakses dokumen"
+bullet2 = "Memastikan urutan penandatanganan yang tepat untuk kepatuhan hukum"
+bullet3 = "Anda dapat mengubah urutan peserta dengan menyeret mereka dalam daftar"
+description = "Peserta menandatangani dokumen sesuai urutan yang Anda tentukan. Setiap penanda tangan menerima pemberitahuan saat gilirannya."
+title = "Penandatanganan Berurutan"
+
+[groupSigning.steps]
+back = "Kembali"
+completed = "Selesai"
+current = "Saat ini"
+stepLabel = "Langkah {{number}}"
+
+[groupSigning.steps.configureDefaults]
+continue = "Lanjutkan ke Tinjauan"
+invisible = "Tanda tangan akan tidak terlihat (hanya metadata)"
+locationLabel = "Lokasi:"
+preview = "Pratinjau"
+reasonLabel = "Alasan:"
+title = "Konfigurasikan Pengaturan Tanda Tangan"
+visible = "Tanda tangan akan terlihat pada halaman {{page}}"
+
+[groupSigning.steps.review]
+document = "Dokumen"
+dueDate = "Tanggal Jatuh Tempo (Opsional)"
+dueDatePlaceholder = "Pilih tanggal jatuh tempo..."
+invisible = "Tidak terlihat (hanya metadata)"
+location = "Lokasi:"
+logo = "Logo:"
+logoHidden = "Tanpa logo"
+logoShown = "Logo Stirling PDF ditampilkan"
+participants = "Peserta"
+reason = "Alasan:"
+send = "Kirim Permintaan Penandatanganan"
+signatureSettings = "Pengaturan Tanda Tangan"
+title = "Tinjau Detail Sesi"
+titleShort = "Tinjau & Kirim"
+visibility = "Visibilitas:"
+visible = "Terlihat pada halaman {{page}}"
+participantCount = "{{count}} peserta akan menandatangani secara berurutan"
+
+[groupSigning.steps.selectDocument]
+continue = "Lanjutkan ke Pemilihan Peserta"
+noFile = "Pilih satu file PDF dari file aktif Anda untuk membuat sesi penandatanganan."
+selectedFile = "Dokumen terpilih"
+title = "Pilih Dokumen"
+
+[groupSigning.steps.selectParticipants]
+continue = "Lanjutkan ke Pengaturan Tanda Tangan"
+count = "{{count}} peserta dipilih"
+label = "Pilih peserta"
+placeholder = "Pilih peserta untuk menandatangani..."
+title = "Pilih Peserta"
+
 [getPdfInfo]
 downloadJson = "Unduh JSON"
 downloads = "Unduhan"
@@ -4460,7 +4860,10 @@ zoomOut = "Perkecil"
 
 [viewer]
 cannotPreviewFile = "Tidak dapat menampilkan pratinjau file"
+disableColorFilter = "Nonaktifkan Filter Warna"
 dualPageView = "Tampilan Dua Halaman"
+enableDarkFilter = "Aktifkan Filter Gelap"
+enableSepiaFilter = "Aktifkan Filter Sepia"
 firstPage = "Halaman Pertama"
 lastPage = "Halaman Terakhir"
 nextPage = "Halaman Berikutnya"
@@ -4470,6 +4873,22 @@ singlePageView = "Tampilan Satu Halaman"
 unknownFile = "File tidak dikenal"
 zoomIn = "Perbesar"
 zoomOut = "Perkecil"
+resetZoom = "Setel ulang zoom"
+
+[viewer.nonPdf]
+fileTypeBadge = "File {{type}}"
+convertToPdf = "Konversi ke PDF"
+loading = "Memuat..."
+emptyFile = "File kosong"
+csvStats = "{{rows}} baris · {{columns}} kolom · {{size}}"
+sortedBy = "Diurutkan menurut: {{column}}"
+columnDefault = "Kolom {{index}}"
+htmlPreviewWarning = "Pratinjau HTML — sumber eksternal mungkin tidak dimuat · {{size}}"
+htmlPreview = "Pratinjau HTML"
+invalidJson = "JSON tidak valid — menampilkan konten mentah"
+textStats = "{{lines}} baris · {{size}}"
+lineNumbers = "Nomor baris"
+renderMarkdown = "Render markdown"
 
 [viewer.attachments]
 title = "Lampiran"
@@ -4531,6 +4950,7 @@ toggleAttachments = "Tampilkan/Sembunyikan Lampiran"
 toggleTheme = "Alihkan Tema"
 language = "Bahasa"
 toggleAnnotations = "Alihkan Visibilitas Anotasi"
+toggleLayers = "Alihkan Lapisan"
 search = "Cari PDF"
 panMode = "Mode Geser"
 applyRedactionsFirst = "Terapkan redaksi terlebih dahulu"
@@ -5407,20 +5827,72 @@ title = "Cetak File"
 2 = "Masukkan Nama Printer"
 
 [quickAccess]
+access = "Akses"
+accessAddPerson = "Tambah orang lain"
+accessBack = "Kembali"
+accessCopyLink = "Salin tautan"
+accessEmail = "Alamat Email"
+accessEmailPlaceholder = "name@company.com"
+accessFileLabel = "File"
+accessGeneral = "Akses Umum"
+accessInviteTitle = "Undang Orang"
+accessOwner = "Pemilik"
+accessPanel = "Akses dokumen"
+accessPeople = "Orang yang memiliki akses"
+accessRemove = "Hapus"
+accessRestricted = "Dibatasi"
+accessRestrictedHint = "Hanya orang yang memiliki akses yang dapat membuka"
+accessRole = "Peran"
+accessRoleCommenter = "Komentator"
+accessRoleEditor = "Editor"
+accessRoleViewer = "Penampil"
+accessSelectedFile = "File terpilih"
+accessSendInvite = "Kirim Undangan"
+accessTitle = "Akses Dokumen"
+accessYou = "Anda"
 account = "Akun"
+activeSessions = "Sesi Aktif"
+activeTab = "Aktif"
 activity = "Kegiatan"
 adminSettings = "Setelan Admin"
+allSessions = "Semua Sesi"
 allTools = "All Tools"
 automate = "Otomasi"
+back = "Kembali"
+certSign = "Tanda Tangan Sertifikat"
+completedSessions = "Sesi Selesai"
+completedTab = "Selesai"
 config = "Konfig"
+createNew = "Buat Permintaan Baru"
+createSession = "Buat Permintaan Penandatanganan"
+dueDate = "Tanggal jatuh tempo (opsional)"
 files = "File"
 help = "Bantuan"
+noActiveSessions = "Tidak ada permintaan tanda tangan tertunda atau sesi aktif"
+noCompletedSessions = "Tidak ada sesi selesai"
+noFile = "Tidak ada file yang dipilih"
 read = "Baca"
 reader = "Pembaca"
+refresh = "Segarkan"
+requestSignatures = "Minta Tanda Tangan"
+selectSingleFileToRequest = "Pilih satu file PDF untuk meminta tanda tangan"
+selectedFile = "File terpilih"
+selectUsers = "Pilih pengguna untuk menandatangani"
+selectUsersPlaceholder = "Pilih peserta..."
+sendingRequest = "Mengirim..."
 settings = "Setelan"
 showMeAround = "Ajak saya berkeliling"
 sign = "Tanda Tangan"
+signatureRequests = "Permintaan Tanda Tangan"
+signYourself = "Tanda Tangani Sendiri"
+newRequest = "Permintaan Baru"
 tours = "Tur"
+wetSign = "Tambah Tanda Tangan"
+filterMine = "Milik saya"
+filterOverdue = "Terlambat"
+filterSigned = "Ditandatangani"
+filterDeclined = "Ditolak"
+searchDocuments = "Cari dokumen…"
 
 [quickAccess.helpMenu]
 adminTour = "Tur Admin"
@@ -6050,11 +6522,75 @@ toolNotAvailableLocally = "Server Stirling-PDF Anda sedang offline dan \"{{endpo
 expired = "Sesi Anda telah kedaluwarsa. Silakan muat ulang halaman dan coba lagi."
 refreshPage = "Muat Ulang Halaman"
 
+[sessionManagement.tooltip]
+header = "Mengelola Sesi Penandatanganan"
+
+[sessionManagement.tooltip.addParticipants]
+bullet1 = "Peserta baru ditambahkan di akhir urutan penandatanganan"
+bullet2 = "Tidak dapat menambah peserta setelah sesi difinalisasi"
+bullet3 = "Setiap peserta menerima pemberitahuan saat gilirannya"
+description = "Anda dapat menambahkan lebih banyak peserta ke sesi aktif kapan saja sebelum finalisasi."
+title = "Menambahkan Peserta"
+
+[sessionManagement.tooltip.finalization]
+bullet1 = "<b>Finalisasi penuh</b>: Semua peserta telah menandatangani"
+bullet2 = "<b>Finalisasi parsial</b>: Beberapa peserta belum menandatangani"
+bullet3 = "Peserta yang belum menandatangani akan dikecualikan dari dokumen final"
+bullet4 = "Setelah difinalisasi, Anda dapat memuat PDF bertanda tangan ke file aktif"
+description = "Finalisasi menggabungkan semua tanda tangan menjadi satu PDF yang ditandatangani. Tindakan ini tidak dapat dibatalkan."
+title = "Finalisasi Sesi"
+
+[sessionManagement.tooltip.participantRemoval]
+bullet1 = "Tidak dapat menghapus peserta yang sudah menandatangani"
+bullet2 = "Peserta yang dihapus tidak lagi menerima pemberitahuan"
+bullet3 = "Urutan penandatanganan menyesuaikan secara otomatis"
+description = "Peserta dapat dihapus dari sesi sebelum mereka menandatangani."
+title = "Menghapus Peserta"
+
+[sessionManagement.tooltip.signatureOrder]
+bullet1 = "Setiap tanda tangan diterapkan secara berurutan ke PDF"
+bullet2 = "Penanda tangan berikutnya dapat melihat tanda tangan sebelumnya"
+bullet3 = "Kritis untuk alur persetujuan dan rantai penjagaan hukum"
+description = "Urutan yang Anda tentukan saat membuat sesi menentukan siapa yang menandatangani terlebih dahulu."
+title = "Urutan Tanda Tangan"
+
+[signatureSettings.tooltip]
+header = "Pengaturan Tampilan Tanda Tangan"
+
+[signatureSettings.tooltip.location]
+bullet1 = "Contoh: \"New York, USA\", \"London Office\", \"Remote\""
+bullet2 = "Bukan sama dengan posisi pada halaman"
+bullet3 = "Mungkin diperlukan untuk yurisdiksi hukum tertentu"
+description = "Lokasi geografis opsional tempat tanda tangan diterapkan. Disimpan dalam metadata sertifikat."
+title = "Lokasi Tanda Tangan"
+
+[signatureSettings.tooltip.logo]
+bullet1 = "Ditampilkan bersama tanda tangan dan teks"
+bullet2 = "Mendukung format PNG, JPG"
+bullet3 = "Meningkatkan tampilan profesional"
+description = "Tambahkan logo perusahaan ke tanda tangan yang terlihat untuk branding dan keaslian."
+title = "Logo Perusahaan"
+
+[signatureSettings.tooltip.reason]
+bullet1 = "Contoh: \"Persetujuan\", \"Perjanjian Kontrak\", \"Tinjauan Selesai\""
+bullet2 = "Terlihat di properti tanda tangan PDF"
+bullet3 = "Berguna untuk jejak audit dan kepatuhan"
+description = "Teks opsional yang menjelaskan mengapa dokumen ditandatangani. Disimpan dalam metadata sertifikat."
+title = "Alasan Tanda Tangan"
+
+[signatureSettings.tooltip.visibility]
+bullet1 = "<b>Terlihat</b>: Tanda tangan muncul pada PDF dengan tampilan kustom"
+bullet2 = "<b>Tidak terlihat</b>: Sertifikat disematkan tanpa tanda visual"
+bullet3 = "Tanda tangan tidak terlihat tetap memberikan validasi kriptografis"
+description = "Mengontrol apakah tanda tangan terlihat pada dokumen atau disematkan secara tidak terlihat."
+title = "Visibilitas Tanda Tangan"
+
 [settings.configuration]
 advanced = "Lanjutan"
 database = "Database"
 endpoints = "Endpoint"
 features = "Fitur"
+storageSharing = "Penyimpanan File & Berbagi"
 systemSettings = "Pengaturan Sistem"
 title = "Konfigurasi"
 
@@ -6332,10 +6868,13 @@ title = "Masuk ke Stirling"
 [setup.selfhosted]
 link = "atau hubungkan ke akun self-hosted"
 subtitle = "Masukkan kredensial server Anda"
+changeServerLocked = "Organisasi Anda membatasi aplikasi ini ke server tertentu"
 switchToLocal = "Gunakan alat lokal saja"
 title = "Masuk ke Server"
 
 [setup.selfhosted.unreachable]
+changeServer = "Hubungkan ke server lain"
+changeServerLocked = "Organisasi Anda membatasi aplikasi ini ke server tertentu"
 continueOffline = "Gunakan alat lokal saja"
 message = "Tidak dapat menjangkau {{url}}. Periksa apakah server sedang berjalan dan dapat diakses."
 retry = "Coba lagi"
@@ -6529,6 +7068,15 @@ saved = "Tersimpan"
 text = "Teks"
 title = "Jenis Tanda Tangan"
 
+[signRequest]
+declined = "Permintaan tanda tangan ditolak"
+fetchFailed = "Gagal memuat permintaan tanda tangan"
+signed = "Dokumen berhasil ditandatangani"
+
+[signSession]
+createFailed = "Gagal membuat permintaan penandatanganan"
+created = "Permintaan penandatanganan dikirim"
+
 [signup]
 accountCreatedSuccessfully = "Akun berhasil dibuat! Anda sekarang dapat masuk."
 alreadyHaveAccount = "Sudah punya akun? Masuk"
@@ -6807,6 +7355,106 @@ title = "Pecah PDF berdasarkan Bab"
 [splitPdfByChapters]
 tags = "pemisahan,bab,bookmark,atur"
 
+[storageShare]
+accessed = "Diakses"
+accessDenied = "Anda tidak memiliki akses ke file bersama ini. Minta pemilik untuk membagikannya kepada Anda."
+accessFailed = "Tidak dapat memuat aktivitas."
+accessDeniedBody = "Anda tidak memiliki akses ke file ini. Minta pemilik untuk membagikannya kepada Anda."
+accessDeniedTitle = "Tidak ada akses"
+accessLimitedCommenter = "Akses komentar segera hadir. Minta akses editor kepada pemilik jika Anda perlu mengunduh."
+accessLimitedTitle = "Akses terbatas"
+accessLimitedViewer = "Tautan ini hanya untuk melihat. Minta akses editor kepada pemilik jika Anda perlu mengunduh."
+createdAt = "Dibuat"
+download = "Unduh"
+downloadFailed = "Tidak dapat mengunduh file ini."
+expiredBody = "Tautan berbagi ini tidak valid atau telah kedaluwarsa."
+expiredTitle = "Tautan kedaluwarsa"
+goToLogin = "Buka login"
+loadFailed = "Tidak dapat membuka file bersama."
+loading = "Memuat tautan berbagi..."
+loginPrompt = "Masuk untuk mengakses file bersama ini."
+loginRequired = "Login diperlukan"
+openInApp = "Buka di Stirling PDF"
+ownerLabel = "Pemilik"
+ownerUnknown = "Tidak diketahui"
+requiresLogin = "File bersama ini memerlukan login."
+roleCommenter = "Komentator"
+roleEditor = "Editor"
+roleViewer = "Penampil"
+shareHeading = "File bersama"
+titleDefault = "File bersama"
+tryAgain = "Silakan coba lagi nanti."
+addUser = "Tambah"
+commenterHint = "Fitur komentar segera hadir."
+copied = "Tautan disalin ke papan klip"
+copy = "Salin"
+copyFailed = "Gagal menyalin"
+description = "Buat tautan berbagi untuk file ini. Pengguna yang masuk dengan tautan tersebut dapat mengaksesnya."
+downloadsCount = "Unduhan: {{count}}"
+emailWarningBody = "Ini terlihat seperti alamat email. Jika orang ini belum menjadi pengguna Stirling PDF, mereka tidak akan dapat mengakses file."
+emailWarningConfirm = "Tetap bagikan"
+emailWarningTitle = "Alamat email"
+errorTitle = "Gagal berbagi"
+failure = "Tidak dapat membuat tautan berbagi. Silakan coba lagi."
+fileLabel = "File"
+generate = "Buat Tautan"
+generated = "Tautan berbagi dibuat"
+hideActivity = "Sembunyikan aktivitas"
+invalidUsername = "Masukkan nama pengguna atau alamat email yang valid."
+lastAccessed = "Terakhir diakses"
+linkAccessTitle = "Akses tautan berbagi"
+linkLabel = "Tautan berbagi"
+linksDisabled = "Tautan berbagi dinonaktifkan."
+linksDisabledBody = "Tautan berbagi dinonaktifkan oleh pengaturan server Anda."
+manage = "Kelola berbagi"
+manageDescription = "Buat dan kelola tautan untuk berbagi file ini."
+manageLoadFailed = "Tidak dapat memuat tautan berbagi."
+manageTitle = "Kelola Berbagi"
+noActivity = "Belum ada aktivitas."
+noLinks = "Belum ada tautan berbagi aktif."
+noSharedUsers = "Belum ada pengguna yang memiliki akses."
+removeLink = "Hapus tautan"
+removeUser = "Hapus"
+revokeFailed = "Tidak dapat menghapus tautan berbagi."
+revoked = "Tautan berbagi dihapus"
+roleLabel = "Peran"
+sharingDisabled = "Berbagi dinonaktifkan."
+sharingDisabledBody = "Berbagi telah dinonaktifkan oleh pengaturan server Anda."
+sharedUsersTitle = "Pengguna dengan akses"
+title = "Bagikan File"
+unknownUser = "Pengguna tidak dikenal"
+userAddFailed = "Tidak dapat berbagi dengan pengguna tersebut."
+userAdded = "Pengguna ditambahkan ke daftar berbagi."
+usernameLabel = "Nama pengguna atau email"
+usernamePlaceholder = "Masukkan nama pengguna atau email"
+userRemoveFailed = "Tidak dapat menghapus pengguna tersebut."
+userRemoved = "Pengguna dihapus dari daftar berbagi."
+viewActivity = "Lihat aktivitas"
+viewed = "Dilihat"
+viewsCount = "Tayangan: {{count}}"
+downloaded = "Diunduh"
+bulkDescription = "Buat satu tautan untuk membagikan semua file yang dipilih kepada pengguna yang telah masuk."
+bulkTitle = "Bagikan file yang dipilih"
+copyLink = "Salin tautan berbagi"
+fileCount = "{{count}} file dipilih"
+ownerOnly = "Hanya pemilik yang dapat mengelola berbagi."
+selectSingleFile = "Pilih satu file untuk mengelola berbagi."
+
+[storageUpload]
+description = "Ini mengunggah file saat ini ke penyimpanan server untuk akses Anda sendiri."
+errorTitle = "Gagal mengunggah"
+failure = "Gagal mengunggah. Harap periksa login dan pengaturan penyimpanan Anda."
+fileLabel = "File"
+hint = "Tautan publik dan mode akses dikendalikan oleh pengaturan server Anda."
+success = "Diunggah ke server"
+title = "Unggah ke Server"
+updateButton = "Perbarui di Server"
+uploadButton = "Unggah ke Server"
+bulkDescription = "Ini mengunggah file yang dipilih ke penyimpanan server Anda."
+bulkTitle = "Unggah file yang dipilih"
+fileCount = "{{count}} file dipilih"
+more = " +{{count}} lainnya"
+
 [storage]
 approximateSize = "Perkiraan ukuran"
 fileTooLarge = "File terlalu besar. Ukuran maksimum per file adalah"
@@ -7153,6 +7801,30 @@ title = "Lihat/Edit PDF"
 [warning]
 tooltipTitle = "Peringatan"
 
+[wetSignature.tooltip]
+header = "Metode Pembuatan Tanda Tangan"
+
+[wetSignature.tooltip.draw]
+bullet1 = "Sesuaikan warna dan ketebalan pena"
+bullet2 = "Hapus dan gambar ulang hingga sesuai"
+bullet3 = "Berfungsi pada perangkat sentuh (tablet, ponsel)"
+description = "Buat tanda tangan tulisan tangan menggunakan mouse atau layar sentuh Anda. Terbaik untuk tanda tangan yang personal dan autentik."
+title = "Gambar Tanda Tangan"
+
+[wetSignature.tooltip.type]
+bullet1 = "Pilih dari berbagai font"
+bullet2 = "Sesuaikan ukuran dan warna teks"
+bullet3 = "Sangat cocok untuk tanda tangan standar"
+description = "Hasilkan tanda tangan dari teks yang diketik. Cepat dan konsisten, cocok untuk dokumen bisnis."
+title = "Ketik Tanda Tangan"
+
+[wetSignature.tooltip.upload]
+bullet1 = "Mendukung PNG, JPG, dan format gambar lainnya"
+bullet2 = "Latar belakang transparan direkomendasikan untuk hasil terbaik"
+bullet3 = "Gambar akan diubah ukurannya agar sesuai dengan area tanda tangan"
+description = "Unggah gambar tanda tangan yang sudah dibuat. Ideal jika Anda memiliki tanda tangan hasil pemindaian atau logo perusahaan."
+title = "Unggah Gambar Tanda Tangan"
+
 [watermark]
 completed = "Tanda air ditambahkan"
 desc = "Tambahkan tanda air teks atau gambar ke file PDF"
@@ -7333,6 +8005,7 @@ activeSession = "Sesi aktif"
 addMembers = "Tambah Anggota"
 admin = "Admin"
 confirmDelete = "Anda yakin ingin menghapus pengguna ini? Tindakan ini tidak dapat dibatalkan."
+confirmUnlock = "Anda yakin ingin membuka kunci akun pengguna ini?"
 deleteUser = "Hapus Pengguna"
 deleteUserError = "Gagal menghapus pengguna"
 deleteUserSuccess = "Pengguna berhasil dihapus"
@@ -7341,6 +8014,8 @@ disable = "Nonaktifkan"
 disabled = "Dinonaktifkan"
 editRole = "Edit Peran"
 enable = "Aktifkan"
+locked = "terkunci"
+lockedBadge = "Terkunci"
 loading = "Memuat orang..."
 loginRequired = "Aktifkan mode login terlebih dahulu"
 member = "Anggota"
@@ -7350,6 +8025,9 @@ searchMembers = "Cari anggota..."
 status = "Status"
 team = "Tim"
 title = "Orang"
+unlockAccount = "Buka Kunci Akun"
+unlockUserError = "Gagal membuka kunci akun pengguna"
+unlockUserSuccess = "Akun pengguna berhasil dibuka kunci"
 user = "Pengguna"
 
 [workspace.people.actions]
diff --git a/frontend/public/locales/it-IT/translation.toml b/frontend/public/locales/it-IT/translation.toml
index 562e8597ca..b9b2d61f03 100644
--- a/frontend/public/locales/it-IT/translation.toml
+++ b/frontend/public/locales/it-IT/translation.toml
@@ -8,6 +8,7 @@ black = "Nero"
 blue = "Blu"
 bored = "Stanco di aspettare?"
 cancel = "Annulla"
+confirm = "Conferma"
 changedCredsMessage = "Credenziali modificate!"
 chooseFile = "Scegli file"
 close = "Chiudi"
@@ -146,6 +147,7 @@ insufficientCredits = "Crediti insufficienti. Richiesti: {{requiredCredits}}, Di
 loadingCredits = "Verifica dei crediti..."
 loadingProStatus = "Verifica dello stato dell'abbonamento..."
 noticeTopUpOrPlan = "Crediti insufficienti, ricarica o passa a un piano"
+accessInvite = "Invita"
 
 [account]
 accountSettings = "Impostazioni Account"
@@ -1427,6 +1429,34 @@ title = "Elaborazione"
 description = "Tempo massimo di attesa per un processo prima di segnalare un errore."
 label = "Timeout elaborazione (secondi)"
 
+[admin.settings.storage]
+description = "Controlla le opzioni di archiviazione e condivisione del server."
+title = "Archiviazione file e condivisione"
+
+[admin.settings.storage.enabled]
+description = "Consenti agli utenti di archiviare file sul server."
+label = "Abilita archiviazione file sul server"
+
+[admin.settings.storage.sharing.email]
+description = "Consenti la condivisione con indirizzi email."
+label = "Abilita condivisione via email"
+mailLink = "Configura impostazioni email"
+mailNote = "Richiede la configurazione dell'email. "
+
+[admin.settings.storage.sharing.enabled]
+description = "Consenti agli utenti di condividere i file archiviati."
+label = "Abilita condivisione"
+
+[admin.settings.storage.sharing.links]
+description = "Consenti la condivisione tramite link con accesso autenticato."
+frontendUrlLink = "Configura nelle impostazioni di sistema"
+frontendUrlNote = "Richiede un Frontend URL. "
+label = "Abilita link di condivisione"
+
+[admin.settings.storage.signing.enabled]
+description = "Consenti agli utenti di creare sessioni di firma del documento con più partecipanti. Richiede che l'archiviazione file sul server sia abilitata."
+label = "Abilita firma di gruppo (Alpha)"
+
 [admin.settings.unsavedChanges]
 cancel = "Continua a modificare"
 discard = "Scarta modifiche"
@@ -2059,7 +2089,19 @@ numbers = "Numeri/intervalli: 5, 10-20"
 progressions = "Progressioni: 3n, 4n+1"
 
 [certSign]
+allSigned = "Tutti i partecipanti hanno firmato. Pronto per la finalizzazione."
+awaitingSignatures = "In attesa di firme"
+signatureProgress = "{{signedCount}}/{{totalCount}} firme"
 chooseCertificate = "Scegli il file del certificato"
+declined = "Rifiutato"
+fetchFailed = "Impossibile caricare i dati di firma"
+finalized = "Finalizzato"
+notified = "In sospeso"
+partialNote = "Puoi finalizzare in anticipo con le firme attuali. I partecipanti senza firma saranno esclusi."
+pending = "In sospeso"
+readyToFinalize = "Pronto per la finalizzazione"
+signed = "Firmato"
+viewed = "Visualizzato"
 chooseJksFile = "Scegli il file JKS"
 chooseP12File = "Scegli il file PKCS12"
 choosePfxFile = "Scegli il file PFX"
@@ -2082,6 +2124,7 @@ title = "Firma del certificato"
 invisible = "Invisibile"
 stepTitle = "Aspetto firma"
 visible = "Visibile"
+visibility = "Visibilità"
 
 [certSign.appearance.options]
 title = "Dettagli firma"
@@ -2188,6 +2231,252 @@ bullet4 = "Può usare certificati personalizzati per la verifica"
 text = "Quando controlli le firme, lo strumento indica se sono valide, chi ha firmato, quando e se il documento è stato modificato dopo la firma."
 title = "Verifica delle firme"
 
+[certSign.collab.finalize]
+button = "Finalizza e carica PDF firmato"
+early = "Finalizza con le firme attuali"
+
+[certSign.collab.sessionDetail]
+addButton = "Aggiungi partecipanti"
+addParticipants = "Aggiungi partecipanti"
+addParticipantsError = "Impossibile aggiungere i partecipanti"
+backToList = "Torna alle sessioni"
+deleteConfirm = "Sei sicuro? Questa operazione non può essere annullata."
+deleteError = "Impossibile eliminare la sessione"
+deleted = "Sessione eliminata"
+deleteSession = "Elimina sessione"
+dueDate = "Scadenza"
+finalizeError = "Impossibile finalizzare la sessione"
+loadPdfError = "Impossibile caricare il PDF firmato"
+loadSignedPdf = "Carica PDF firmato nei file attivi"
+messageLabel = "Messaggio"
+noAdditionalInfo = "Nessuna informazione aggiuntiva"
+owner = "Proprietario"
+participantRemoved = "Partecipante rimosso"
+participants = "Partecipanti"
+participantsAdded = "Partecipanti aggiunti con successo"
+removeParticipant = "Rimuovi"
+removeParticipantError = "Impossibile rimuovere il partecipante"
+selectUsers = "Seleziona utenti..."
+sessionInfo = "Informazioni sulla sessione"
+workbenchTitle = "Gestione sessione"
+
+[certSign.collab.signRequest]
+addedToFiles = "Documento aggiunto ai file attivi"
+addSignature = "Aggiungi la tua firma"
+addToFiles = "Aggiungi ai file attivi"
+advancedSettings = "Impostazioni avanzate"
+backToList = "Torna alle richieste di firma"
+certificateChoice = "Seleziona un certificato con cui firmare"
+changeSignature = "Cambia firma"
+clearSignature = "Cancella firma"
+completeAndSign = "Completa e firma"
+createNewSignature = "Crea nuova firma"
+declineButton = "Rifiuta"
+decline = "Rifiuta richiesta"
+deleteSelected = "Elimina firma selezionata"
+drawSignature = "Disegna la tua firma qui sotto"
+dueDate = "Scadenza"
+fileTooLarge = "La dimensione del file deve essere inferiore a 5 MB"
+fontFamily = "Famiglia di caratteri"
+fontSize = "Dimensione carattere: {{size}}px"
+fontSizePlaceholder = "Dimensione"
+from = "Da"
+invalidCertFile = "Seleziona un file di certificato P12 o PFX"
+invalidFileType = "Seleziona un file immagine"
+location = "Località (opzionale)"
+locationPlaceholder = "Da dove stai firmando?"
+message = "Messaggio"
+noCertificate = "Seleziona un file di certificato"
+noSignatures = "Posiziona almeno una firma sul PDF"
+p12File = "File di certificato P12/PFX"
+password = "Password del certificato"
+passwordPlaceholder = "Inserisci password..."
+penColor = "Colore penna"
+penSize = "Dimensione penna: {{size}}px"
+placementActive = "Clicca sul PDF per posizionare"
+placeSignatureButton = "Posiziona firma sul PDF"
+reason = "Motivo (opzionale)"
+reasonPlaceholder = "Perché stai firmando?"
+removeImage = "Rimuovi immagine"
+removeCertFile = "Rimuovi file"
+savedSignatures = "Firme salvate"
+selectFile = "Seleziona file immagine"
+selectSignatureTitle = "Seleziona o crea firma"
+signButton = "Firma documento"
+signatureInfo = "Queste impostazioni sono configurate dal proprietario del documento"
+signaturePlaced = "Firma posizionata sulla pagina"
+signatureSettings = "Impostazioni firma"
+signatureText = "Testo firma"
+signatureTextPlaceholder = "Inserisci il tuo nome..."
+signatureTypeLabel = "Tipo di firma"
+signingTitle = "Firma"
+textColor = "Colore testo"
+typeSignature = "Digita il tuo nome per creare una firma"
+uploadCert = "Certificato personalizzato"
+uploadCertDesc = "Usa il tuo certificato P12/PFX"
+uploadSignature = "Carica l'immagine della tua firma"
+usePersonalCert = "Certificato personale"
+usePersonalCertDesc = "Generato automaticamente per il tuo account"
+useServerCert = "Certificato dell'organizzazione"
+useServerCertDesc = "Certificato condiviso dell'organizzazione"
+workbenchTitle = "Richiesta di firma"
+
+[certSign.collab.signRequest.canvas]
+colorPickerTitle = "Scegli il colore del tratto"
+continue = "Continua"
+
+[certSign.collab.signRequest.certModal]
+description = "Hai posizionato {{count}} firma/e. Scegli il tuo certificato per completare la firma."
+sign = "Firma documento"
+certValidating = "Verifica del certificato..."
+certValidUntil = "Certificato valido fino al {{date}}"
+certInvalid = "Certificato non valido: {{error}}"
+certInvalidFallback = "Certificato non valido"
+certNetworkError = "Impossibile verificare il certificato"
+title = "Configura certificato"
+
+[certSign.collab.signRequest.image]
+hint = "Carica un'immagine PNG o JPG della tua firma"
+
+[certSign.collab.signRequest.mode]
+move = "Sposta firma"
+place = "Posiziona firma"
+title = "Modalità firma o spostamento"
+
+[certSign.collab.signRequest.modeTabs]
+draw = "Disegna"
+image = "Carica"
+text = "Digita"
+
+[certSign.collab.signRequest.placeSignature]
+message = "Clicca sul PDF per posizionare la tua firma"
+title = "Posiziona firma"
+
+[certSign.collab.signRequest.preview]
+imageAlt = "Firma selezionata"
+missing = "Nessuna anteprima"
+textFallback = "Firma"
+
+[certSign.collab.signRequest.saved]
+defaultCanvasLabel = "Firma disegnata"
+defaultImageLabel = "Firma caricata"
+defaultLabel = "Firma"
+defaultTextLabel = "Firma digitata"
+delete = "Elimina firma"
+none = "Nessuna firma salvata"
+
+[certSign.collab.signRequest.signatureType]
+draw = "Disegna"
+type = "Digita"
+upload = "Carica"
+
+[certSign.collab.signRequest.steps]
+back = "Indietro"
+cancelPlacement = "Annulla posizionamento"
+certificate = "Certificato"
+clickMultipleTimes = "Clicca più volte sul PDF per posizionare le firme. Trascina qualsiasi firma per spostarla o ridimensionarla."
+clickToPlace = "Clicca sul PDF dove desideri che appaia la tua firma."
+continue = "Continua alla selezione del certificato"
+continueToPlacement = "Continua al posizionamento"
+continueToReview = "Continua alla revisione"
+createSignature = "Crea firma"
+invisible = "Invisibile"
+location = "Località:"
+multipleSignatures = "{{count}} firme verranno applicate al PDF"
+oneSignature = "1 firma verrà applicata al PDF"
+placeOnPdf = "Posiziona sul PDF"
+reason = "Motivo:"
+reviewTitle = "Rivedi prima di firmare"
+signaturePlaced = "Firma posizionata sulla pagina {{page}}. Puoi regolare la posizione cliccando di nuovo oppure continuare alla revisione."
+visible = "Visibile"
+visibility = "Visibilità:"
+yourSignatures = "Le tue firme ({{count}})"
+
+[certSign.collab.signRequest.text]
+colorLabel = "Colore"
+fontLabel = "Carattere"
+fontSizeLabel = "Dimensione"
+fontSizePlaceholder = "16"
+label = "Testo firma"
+modalHint = "Inserisci il tuo nome, quindi fai clic su Continua per posizionarlo sul PDF."
+placeholder = "Inserisci il tuo nome..."
+
+[certSign.collab.participant]
+certValidating = "Verifica del certificato..."
+certValid = "✓ Certificato valido"
+certValidUntil = " fino al {{date}}"
+certInvalid = "✗ {{error}}"
+certInvalidFallback = "Certificato non valido"
+certNetworkError = "Impossibile verificare il certificato"
+
+[certSign.collab.addParticipants]
+add = "Aggiungi {{count}} partecipante/i"
+back = "Indietro"
+configureSignatures = "Configura impostazioni firma"
+continue = "Continua alle impostazioni firma"
+reasonHelp = "Preimposta un motivo di firma per questi partecipanti (opzionale, possono modificarlo al momento della firma)"
+reasonPlaceholder = "es. Approvazione, Revisione..."
+selectUsers = "Seleziona utenti"
+
+[certSign.collab.sessionCreation]
+includeSummaryPage = "Includi pagina di riepilogo firme"
+includeSummaryPageHelp = "Alla fine verrà aggiunta una pagina di riepilogo con tutti i metadati delle firme. Le caselle di firma del certificato digitale sulle singole pagine saranno nascoste (le firme autografe non sono interessate)."
+
+[certSign.collab.sessionList]
+active = "Attiva"
+finalized = "Finalizzata"
+
+[certSign.collab.signatureSettings]
+description = "Configura l'aspetto delle firme per tutti i partecipanti"
+title = "Aspetto firma"
+
+[certSign.collab.userSelector]
+inviteUsers = "Aggiungi utenti"
+loadError = "Impossibile caricare gli utenti"
+noTeam = "Nessun team"
+noUsers = "Nessun altro utente trovato."
+placeholder = "Seleziona utenti..."
+
+[certSign.mobile]
+panelActions = "Azioni"
+panelDocument = "Documento"
+panelPeople = "Persone"
+
+[certSign.sessions]
+deleted = "Sessione eliminata"
+fetchFailed = "Impossibile caricare i dettagli della sessione"
+finalized = "Sessione finalizzata"
+loaded = "PDF firmato caricato"
+pdfNotReady = "PDF non pronto"
+pdfNotReadyDesc = "Il PDF firmato è in fase di generazione. Riprova tra un momento."
+
+[certificateChoice.tooltip]
+header = "Tipi di certificato"
+
+[certificateChoice.tooltip.organization]
+bullet1 = "Gestito dagli amministratori di sistema"
+bullet2 = "Condiviso tra gli utenti autorizzati"
+bullet3 = "Rappresenta l'identità dell'azienda, non dell'individuo"
+bullet4 = "Ideale per: documenti ufficiali, firme del team"
+description = "Un certificato condiviso fornito dalla tua organizzazione. Usato per l'autorità di firma a livello aziendale."
+title = "Certificato dell'organizzazione"
+
+[certificateChoice.tooltip.personal]
+bullet1 = "Generato automaticamente al primo utilizzo"
+bullet2 = "Collegato al tuo account utente"
+bullet3 = "Non può essere condiviso con altri utenti"
+bullet4 = "Ideale per: documenti personali, responsabilità individuale"
+description = "Un certificato generato automaticamente e unico per il tuo account utente. Adatto a firme individuali."
+title = "Certificato personale"
+
+[certificateChoice.tooltip.upload]
+bullet1 = "Richiede file P12/PFX e password"
+bullet2 = "Può essere emesso da Autorità di Certificazione esterne"
+bullet3 = "Livello di fiducia più elevato per documenti legali"
+bullet4 = "Ideale per: contratti legalmente vincolanti, validazione esterna"
+description = "Usa il tuo file di certificato PKCS#12. Fornisce il pieno controllo sulle proprietà del certificato."
+title = "Carica P12 personalizzato"
+
 [changeCreds]
 changePassword = "Stai utilizzando le credenziali di accesso predefinite. Inserisci una nuova password"
 changeUsername = "Aggiorna il nome utente. Verrai disconnesso dopo l'aggiornamento."
@@ -3242,6 +3531,46 @@ totalSelected = "Totale selezionati"
 unsupported = "Non supportato"
 unzip = "Estrai"
 uploadError = "Caricamento di alcuni file non riuscito."
+copyCreated = "Copia salvata su questo dispositivo."
+copyFailed = "Impossibile creare una copia."
+leaveShare = "Rimuovi dal mio elenco"
+leaveShareFailed = "Impossibile rimuovere il file condiviso."
+leaveShareSuccess = "Rimosso dal tuo elenco Condivisi."
+removeBoth = "Rimuovi da entrambi"
+removeFilePrompt = "Questo file è salvato su questo dispositivo e sul tuo server. Da dove desideri rimuoverlo?"
+removeFileTitle = "Rimuovi file"
+removeLocalOnly = "Solo da questo dispositivo"
+removeServerFailed = "Impossibile rimuovere il file dal server."
+removeServerOnly = "Solo dal server"
+removeServerOnlyPrompt = "Questo file è archiviato solo sul tuo server. Vuoi rimuoverlo dal server?"
+removeServerSuccess = "Rimosso dal server."
+removeSharedPrompt = "Questo file è condiviso con te. Puoi rimuoverlo da questo dispositivo o dal tuo elenco Condivisi."
+removeSharedServerOnlyBlockedPrompt = "Questo file è condiviso con te ed è archiviato solo sul server."
+removeSharedServerOnlyPrompt = "Questo file è condiviso con te ed è archiviato solo sul server. Rimuoverlo dal tuo elenco?"
+changesNotUploaded = "Modifiche non caricate"
+cloudFile = "File cloud"
+filterAll = "Tutti"
+filterLocal = "Locale"
+filterSharedByMe = "Condivisi da me"
+filterSharedWithMe = "Condivisi con me"
+lastSynced = "Ultima sincronizzazione"
+localOnly = "Solo locale"
+makeCopy = "Crea una copia"
+owner = "Proprietario"
+ownerUnknown = "Sconosciuto"
+share = "Condividi"
+shareSelected = "Condividi selezionati"
+sharedByYou = "Condivisi da te"
+sharedEditNoticeBody = "Non hai diritti di modifica sulla versione sul server di questo file. Qualsiasi modifica verrà salvata come copia locale."
+sharedEditNoticeConfirm = "Ho capito"
+sharedEditNoticeTitle = "Copia sul server in sola lettura"
+sharedWithYou = "Condivisi con te"
+sharing = "Condivisione"
+storageState = "Archiviazione"
+synced = "Sincronizzato"
+updateOnServer = "Aggiorna sul server"
+uploadSelected = "Carica selezionati"
+uploadToServer = "Carica sul server"
 
 [files]
 addFiles = "Aggiungi file"
@@ -3367,6 +3696,77 @@ title = "Informazioni sull'appiattimento dei PDF"
 discord = "Discord"
 issues = "GitHub"
 
+[groupSigning.tooltip]
+header = "Informazioni sulla firma di gruppo"
+
+[groupSigning.tooltip.finalization]
+bullet1 = "Tutte le firme vengono applicate nell'ordine dei partecipanti che hai specificato"
+bullet2 = "Puoi finalizzare con firme parziali se necessario"
+bullet3 = "Una volta finalizzata, la sessione non può essere modificata"
+description = "Una volta che tutti i partecipanti hanno firmato (o scegli di finalizzare prima), puoi generare il PDF finale firmato."
+title = "Processo di finalizzazione"
+
+[groupSigning.tooltip.roles]
+bullet1 = "Proprietario (tu): crea la sessione, configura i valori predefiniti della firma, finalizza il documento"
+bullet2 = "Partecipanti: creano la propria firma, scelgono il certificato, la posizionano sul PDF"
+bullet3 = "I partecipanti non possono modificare le impostazioni di visibilità, motivo o località della firma"
+description = "Controlli le impostazioni dell'aspetto della firma per tutti i partecipanti."
+title = "Ruoli dei partecipanti"
+
+[groupSigning.tooltip.sequential]
+bullet1 = "Il primo partecipante deve firmare prima che il secondo possa accedere al documento"
+bullet2 = "Garantisce il corretto ordine di firma per la conformità legale"
+bullet3 = "Puoi riordinare i partecipanti trascinandoli nell'elenco"
+description = "I partecipanti firmano i documenti nell'ordine che specifichi. Ogni firmatario riceve una notifica quando è il suo turno."
+title = "Firma sequenziale"
+
+[groupSigning.steps]
+back = "Indietro"
+completed = "Completato"
+current = "Corrente"
+stepLabel = "Passaggio {{number}}"
+
+[groupSigning.steps.configureDefaults]
+continue = "Continua alla revisione"
+invisible = "Le firme saranno invisibili (solo metadati)"
+locationLabel = "Località:"
+preview = "Anteprima"
+reasonLabel = "Motivo:"
+title = "Configura impostazioni firma"
+visible = "Le firme saranno visibili a pagina {{page}}"
+
+[groupSigning.steps.review]
+document = "Documento"
+dueDate = "Scadenza (opzionale)"
+dueDatePlaceholder = "Seleziona una scadenza..."
+invisible = "Invisibile (solo metadati)"
+location = "Località:"
+logo = "Logo:"
+logoHidden = "Nessun logo"
+logoShown = "Logo Stirling PDF visualizzato"
+participants = "Partecipanti"
+reason = "Motivo:"
+send = "Invia richieste di firma"
+signatureSettings = "Impostazioni firma"
+title = "Rivedi i dettagli della sessione"
+titleShort = "Rivedi e invia"
+visibility = "Visibilità:"
+visible = "Visibile a pagina {{page}}"
+participantCount = "{{count}} partecipanti firmeranno in ordine"
+
+[groupSigning.steps.selectDocument]
+continue = "Continua alla selezione dei partecipanti"
+noFile = "Seleziona un singolo file PDF dai tuoi file attivi per creare una sessione di firma."
+selectedFile = "Documento selezionato"
+title = "Seleziona documento"
+
+[groupSigning.steps.selectParticipants]
+continue = "Continua alle impostazioni firma"
+count = "{{count}} partecipante/i selezionato/i"
+label = "Seleziona partecipanti"
+placeholder = "Scegli i partecipanti che devono firmare..."
+title = "Scegli partecipanti"
+
 [getPdfInfo]
 downloadJson = "Scarica JSON"
 downloads = "Download"
@@ -4460,7 +4860,10 @@ zoomOut = "Riduci"
 
 [viewer]
 cannotPreviewFile = "Impossibile visualizzare l'anteprima del file"
+disableColorFilter = "Disabilita filtro colore"
 dualPageView = "Vista doppia pagina"
+enableDarkFilter = "Abilita filtro scuro"
+enableSepiaFilter = "Abilita filtro seppia"
 firstPage = "Prima pagina"
 lastPage = "Ultima pagina"
 nextPage = "Pagina successiva"
@@ -4470,6 +4873,22 @@ singlePageView = "Vista pagina singola"
 unknownFile = "File sconosciuto"
 zoomIn = "Ingrandisci"
 zoomOut = "Riduci"
+resetZoom = "Reimposta zoom"
+
+[viewer.nonPdf]
+fileTypeBadge = "File {{type}}"
+convertToPdf = "Converti in PDF"
+loading = "Caricamento..."
+emptyFile = "File vuoto"
+csvStats = "{{rows}} righe · {{columns}} colonne · {{size}}"
+sortedBy = "Ordinato per: {{column}}"
+columnDefault = "Colonna {{index}}"
+htmlPreviewWarning = "Anteprima HTML — le risorse esterne potrebbero non essere caricate · {{size}}"
+htmlPreview = "Anteprima HTML"
+invalidJson = "JSON non valido — mostra contenuto grezzo"
+textStats = "{{lines}} righe · {{size}}"
+lineNumbers = "Numeri di riga"
+renderMarkdown = "Renderizza markdown"
 
 [viewer.attachments]
 title = "Allegati"
@@ -4531,6 +4950,7 @@ toggleAttachments = "Mostra/Nascondi allegati"
 toggleTheme = "Cambia tema"
 language = "Lingua"
 toggleAnnotations = "Attiva/disattiva visibilità annotazioni"
+toggleLayers = "Attiva/disattiva livelli"
 search = "Cerca nel PDF"
 panMode = "Modalità mano"
 applyRedactionsFirst = "Applica prima gli oscuramenti"
@@ -5407,20 +5827,72 @@ title = "Stampa file"
 2 = "Inserire il nome della stampante"
 
 [quickAccess]
+access = "Accesso"
+accessAddPerson = "Aggiungi un'altra persona"
+accessBack = "Indietro"
+accessCopyLink = "Copia link"
+accessEmail = "Indirizzo email"
+accessEmailPlaceholder = "name@company.com"
+accessFileLabel = "File"
+accessGeneral = "Accesso generale"
+accessInviteTitle = "Invita persone"
+accessOwner = "Proprietario"
+accessPanel = "Accesso al documento"
+accessPeople = "Persone con accesso"
+accessRemove = "Rimuovi"
+accessRestricted = "Limitato"
+accessRestrictedHint = "Solo le persone con accesso possono aprirlo"
+accessRole = "Ruolo"
+accessRoleCommenter = "Commentatore"
+accessRoleEditor = "Editor"
+accessRoleViewer = "Visualizzatore"
+accessSelectedFile = "File selezionato"
+accessSendInvite = "Invia invito"
+accessTitle = "Accesso al documento"
+accessYou = "Tu"
 account = "Account"
+activeSessions = "Sessioni attive"
+activeTab = "Attive"
 activity = "Attività"
 adminSettings = "Opzioni Admin"
+allSessions = "Tutte le sessioni"
 allTools = "Funzioni"
 automate = "Automaz."
+back = "Indietro"
+certSign = "Firma con certificato"
+completedSessions = "Sessioni completate"
+completedTab = "Completate"
 config = "Configurazione"
+createNew = "Crea nuova richiesta"
+createSession = "Crea richiesta di firma"
+dueDate = "Scadenza (opzionale)"
 files = "File"
 help = "Guida"
+noActiveSessions = "Nessuna richiesta di firma in sospeso o sessione attiva"
+noCompletedSessions = "Nessuna sessione completata"
+noFile = "Nessun file selezionato"
 read = "Leggi"
 reader = "Lettore"
+refresh = "Aggiorna"
+requestSignatures = "Richiedi firme"
+selectSingleFileToRequest = "Seleziona un singolo file PDF per richiedere le firme"
+selectedFile = "File selezionato"
+selectUsers = "Seleziona gli utenti che devono firmare"
+selectUsersPlaceholder = "Scegli i partecipanti..."
+sendingRequest = "Invio..."
 settings = "Opzioni"
 showMeAround = "Fammi fare un giro"
 sign = "Firma"
+signatureRequests = "Richieste di firma"
+signYourself = "Firma tu stesso"
+newRequest = "Nuova richiesta"
 tours = "Tour"
+wetSign = "Aggiungi firma"
+filterMine = "Miei"
+filterOverdue = "In ritardo"
+filterSigned = "Firmato"
+filterDeclined = "Rifiutato"
+searchDocuments = "Cerca documenti…"
 
 [quickAccess.helpMenu]
 adminTour = "Tour amministratore"
@@ -6050,11 +6522,75 @@ toolNotAvailableLocally = "Il tuo server Stirling-PDF è offline e \"{{endpoint}
 expired = "La tua sessione è scaduta. Aggiorna la pagina e riprova."
 refreshPage = "Aggiorna pagina"
 
+[sessionManagement.tooltip]
+header = "Gestione delle sessioni di firma"
+
+[sessionManagement.tooltip.addParticipants]
+bullet1 = "I nuovi partecipanti vengono aggiunti alla fine dell'ordine di firma"
+bullet2 = "Non è possibile aggiungere partecipanti dopo la finalizzazione della sessione"
+bullet3 = "Ogni partecipante riceve una notifica quando è il suo turno"
+description = "Puoi aggiungere altri partecipanti a una sessione attiva in qualsiasi momento prima della finalizzazione."
+title = "Aggiunta dei partecipanti"
+
+[sessionManagement.tooltip.finalization]
+bullet1 = "<b>Finalizzazione completa</b>: tutti i partecipanti hanno firmato"
+bullet2 = "<b>Finalizzazione parziale</b>: alcuni partecipanti non hanno ancora firmato"
+bullet3 = "I partecipanti senza firma saranno esclusi dal documento finale"
+bullet4 = "Una volta finalizzata, puoi caricare il PDF firmato nei file attivi"
+description = "La finalizzazione combina tutte le firme in un unico PDF firmato. Questa azione non può essere annullata."
+title = "Finalizzazione della sessione"
+
+[sessionManagement.tooltip.participantRemoval]
+bullet1 = "Non è possibile rimuovere i partecipanti che hanno già firmato"
+bullet2 = "I partecipanti rimossi non riceveranno più notifiche"
+bullet3 = "L'ordine di firma si adegua automaticamente"
+description = "I partecipanti possono essere rimossi dalle sessioni prima di firmare."
+title = "Rimozione dei partecipanti"
+
+[sessionManagement.tooltip.signatureOrder]
+bullet1 = "Ogni firma viene applicata in sequenza al PDF"
+bullet2 = "I firmatari successivi possono vedere le firme precedenti"
+bullet3 = "Critico per flussi di approvazione e catene di custodia legali"
+description = "L'ordine che specifichi durante la creazione della sessione determina chi firma per primo."
+title = "Ordine di firma"
+
+[signatureSettings.tooltip]
+header = "Impostazioni aspetto firma"
+
+[signatureSettings.tooltip.location]
+bullet1 = "Esempi: \"New York, USA\", \"London Office\", \"Remote\""
+bullet2 = "Non coincide con la posizione sulla pagina"
+bullet3 = "Potrebbe essere richiesta in alcune giurisdizioni legali"
+description = "Località geografica opzionale in cui è stata apposta la firma. Archiviata nei metadati del certificato."
+title = "Località della firma"
+
+[signatureSettings.tooltip.logo]
+bullet1 = "Mostrato accanto alla firma e al testo"
+bullet2 = "Supporta i formati PNG, JPG"
+bullet3 = "Migliora l'aspetto professionale"
+description = "Aggiungi un logo aziendale alle firme visibili per branding e autenticità."
+title = "Logo aziendale"
+
+[signatureSettings.tooltip.reason]
+bullet1 = "Esempi: \"Approvazione\", \"Accordo contrattuale\", \"Revisione completata\""
+bullet2 = "Visibile nelle proprietà della firma del PDF"
+bullet3 = "Utile per tracciabilità e conformità"
+description = "Testo opzionale che spiega perché il documento viene firmato. Archiviato nei metadati del certificato."
+title = "Motivo della firma"
+
+[signatureSettings.tooltip.visibility]
+bullet1 = "<b>Visibile</b>: la firma appare sul PDF con aspetto personalizzato"
+bullet2 = "<b>Invisibile</b>: certificato incorporato senza segno visivo"
+bullet3 = "Le firme invisibili forniscono comunque una validazione crittografica"
+description = "Controlla se la firma è visibile sul documento o incorporata in modo invisibile."
+title = "Visibilità della firma"
+
 [settings.configuration]
 advanced = "Avanzate"
 database = "Database"
 endpoints = "Endpoint"
 features = "Funzionalità"
+storageSharing = "Archiviazione file e condivisione"
 systemSettings = "Impostazioni di sistema"
 title = "Configurazione"
 
@@ -6332,10 +6868,13 @@ title = "Accedi a Stirling"
 [setup.selfhosted]
 link = "oppure connettiti a un account self-hosted"
 subtitle = "Inserisci le credenziali del server"
+changeServerLocked = "La tua organizzazione ha limitato questa app a un server specifico"
 switchToLocal = "Usa invece gli strumenti locali"
 title = "Accedi al server"
 
 [setup.selfhosted.unreachable]
+changeServer = "Connetti a un server diverso"
+changeServerLocked = "La tua organizzazione ha limitato questa app a un server specifico"
 continueOffline = "Usa invece gli strumenti locali"
 message = "Impossibile raggiungere {{url}}. Verifica che il server sia in esecuzione e accessibile."
 retry = "Riprova"
@@ -6529,6 +7068,15 @@ saved = "Salvate"
 text = "Testo"
 title = "Tipo di firma"
 
+[signRequest]
+declined = "Richiesta di firma rifiutata"
+fetchFailed = "Impossibile caricare la richiesta di firma"
+signed = "Documento firmato con successo"
+
+[signSession]
+createFailed = "Impossibile creare la richiesta di firma"
+created = "Richiesta di firma inviata"
+
 [signup]
 accountCreatedSuccessfully = "Account creato con successo! Ora puoi accedere."
 alreadyHaveAccount = "Hai già un account? Accedi"
@@ -6807,6 +7355,106 @@ title = "Dividere PDF per capitoli"
 [splitPdfByChapters]
 tags = "dividi,capitoli,segnalibri,organizza"
 
+[storageShare]
+accessed = "Accessato"
+accessDenied = "Non hai accesso a questo file condiviso. Chiedi al proprietario di condividerlo con te."
+accessFailed = "Impossibile caricare l'attività."
+accessDeniedBody = "Non hai accesso a questo file. Chiedi al proprietario di condividerlo con te."
+accessDeniedTitle = "Nessun accesso"
+accessLimitedCommenter = "L'accesso come commentatore arriverà presto. Chiedi al proprietario l'accesso come editor se devi scaricare."
+accessLimitedTitle = "Accesso limitato"
+accessLimitedViewer = "Questo link è solo per la visualizzazione. Chiedi al proprietario l'accesso come editor se devi scaricare."
+createdAt = "Creato"
+download = "Scarica"
+downloadFailed = "Impossibile scaricare questo file."
+expiredBody = "Questo link di condivisione non è valido o è scaduto."
+expiredTitle = "Link scaduto"
+goToLogin = "Vai al login"
+loadFailed = "Impossibile aprire il file condiviso."
+loading = "Caricamento link di condivisione..."
+loginPrompt = "Accedi per accedere a questo file condiviso."
+loginRequired = "Accesso richiesto"
+openInApp = "Apri in Stirling PDF"
+ownerLabel = "Proprietario"
+ownerUnknown = "Sconosciuto"
+requiresLogin = "Questo file condiviso richiede l'accesso."
+roleCommenter = "Commentatore"
+roleEditor = "Editor"
+roleViewer = "Visualizzatore"
+shareHeading = "File condiviso"
+titleDefault = "File condiviso"
+tryAgain = "Riprova più tardi."
+addUser = "Aggiungi"
+commenterHint = "I commenti arriveranno presto."
+copied = "Link copiato negli appunti"
+copy = "Copia"
+copyFailed = "Copia non riuscita"
+description = "Crea un link di condivisione per questo file. Gli utenti autenticati con il link possono accedervi."
+downloadsCount = "Download: {{count}}"
+emailWarningBody = "Sembra un indirizzo email. Se questa persona non è già un utente di Stirling PDF, non potrà accedere al file."
+emailWarningConfirm = "Condividi comunque"
+emailWarningTitle = "Indirizzo email"
+errorTitle = "Condivisione non riuscita"
+failure = "Impossibile generare un link di condivisione. Riprova."
+fileLabel = "File"
+generate = "Genera link"
+generated = "Link di condivisione generato"
+hideActivity = "Nascondi attività"
+invalidUsername = "Inserisci un nome utente o un indirizzo email valido."
+lastAccessed = "Ultimo accesso"
+linkAccessTitle = "Accesso tramite link di condivisione"
+linkLabel = "Link di condivisione"
+linksDisabled = "I link di condivisione sono disabilitati."
+linksDisabledBody = "I link di condivisione sono disabilitati dalle impostazioni del tuo server."
+manage = "Gestisci condivisione"
+manageDescription = "Crea e gestisci link per condividere questo file."
+manageLoadFailed = "Impossibile caricare i link di condivisione."
+manageTitle = "Gestisci condivisione"
+noActivity = "Ancora nessuna attività."
+noLinks = "Ancora nessun link di condivisione attivo."
+noSharedUsers = "Ancora nessun utente ha accesso."
+removeLink = "Rimuovi link"
+removeUser = "Rimuovi"
+revokeFailed = "Impossibile rimuovere il link di condivisione."
+revoked = "Link di condivisione rimosso"
+roleLabel = "Ruolo"
+sharingDisabled = "La condivisione è disabilitata."
+sharingDisabledBody = "La condivisione è stata disabilitata dalle impostazioni del tuo server."
+sharedUsersTitle = "Utenti con cui è condiviso"
+title = "Condividi file"
+unknownUser = "Utente sconosciuto"
+userAddFailed = "Impossibile condividere con quell'utente."
+userAdded = "Utente aggiunto all'elenco di condivisione."
+usernameLabel = "Nome utente o email"
+usernamePlaceholder = "Inserisci un nome utente o un'email"
+userRemoveFailed = "Impossibile rimuovere quell'utente."
+userRemoved = "Utente rimosso dall'elenco di condivisione."
+viewActivity = "Visualizza attività"
+viewed = "Visualizzato"
+viewsCount = "Visualizzazioni: {{count}}"
+downloaded = "Scaricato"
+bulkDescription = "Crea un unico link per condividere tutti i file selezionati con gli utenti autenticati."
+bulkTitle = "Condividi i file selezionati"
+copyLink = "Copia link di condivisione"
+fileCount = "{{count}} file selezionati"
+ownerOnly = "Solo il proprietario può gestire la condivisione."
+selectSingleFile = "Seleziona un singolo file per gestire la condivisione."
+
+[storageUpload]
+description = "Carica il file corrente nell'archiviazione del server per il tuo accesso."
+errorTitle = "Caricamento non riuscito"
+failure = "Caricamento non riuscito. Verifica le impostazioni di accesso e archiviazione."
+fileLabel = "File"
+hint = "I link pubblici e le modalità di accesso sono controllati dalle impostazioni del tuo server."
+success = "Caricato sul server"
+title = "Carica sul server"
+updateButton = "Aggiorna sul server"
+uploadButton = "Carica sul server"
+bulkDescription = "Carica i file selezionati nell'archiviazione del tuo server."
+bulkTitle = "Carica i file selezionati"
+fileCount = "{{count}} file selezionati"
+more = " +{{count}} altri"
+
 [storage]
 approximateSize = "Dimensione approssimativa"
 fileTooLarge = "File troppo grande. Dimensione massima per file"
@@ -7153,6 +7801,30 @@ title = "Visualizza/Modifica PDF"
 [warning]
 tooltipTitle = "Avviso"
 
+[wetSignature.tooltip]
+header = "Metodi di creazione della firma"
+
+[wetSignature.tooltip.draw]
+bullet1 = "Personalizza colore e spessore della penna"
+bullet2 = "Cancella e ridisegna finché non sei soddisfatto"
+bullet3 = "Funziona su dispositivi touch (tablet, telefoni)"
+description = "Crea una firma scritta a mano usando il mouse o il touchscreen. Ideale per firme personali e autentiche."
+title = "Disegna firma"
+
+[wetSignature.tooltip.type]
+bullet1 = "Scegli tra più font"
+bullet2 = "Personalizza dimensione e colore del testo"
+bullet3 = "Perfetto per firme standardizzate"
+description = "Genera una firma dal testo digitato. Veloce e coerente, adatta a documenti aziendali."
+title = "Digita firma"
+
+[wetSignature.tooltip.upload]
+bullet1 = "Supporta PNG, JPG e altri formati immagine"
+bullet2 = "Sfondi trasparenti consigliati per risultati migliori"
+bullet3 = "L'immagine verrà ridimensionata per adattarsi all'area della firma"
+description = "Carica un'immagine di firma preesistente. Ideale se hai una firma scansionata o un logo aziendale."
+title = "Carica immagine della firma"
+
 [watermark]
 completed = "Filigrana aggiunta"
 desc = "Aggiungi filigrane di testo o immagine ai PDF"
@@ -7333,6 +8005,7 @@ activeSession = "Sessione attiva"
 addMembers = "Aggiungi membri"
 admin = "Amministratore"
 confirmDelete = "Sei sicuro di voler eliminare questo utente? Questa azione non può essere annullata."
+confirmUnlock = "Sei sicuro di voler sbloccare questo account utente?"
 deleteUser = "Elimina utente"
 deleteUserError = "Impossibile eliminare l'utente"
 deleteUserSuccess = "Utente eliminato con successo"
@@ -7341,6 +8014,8 @@ disable = "Disabilita"
 disabled = "Disabilitato"
 editRole = "Modifica ruolo"
 enable = "Abilita"
+locked = "bloccato"
+lockedBadge = "Bloccato"
 loading = "Caricamento persone..."
 loginRequired = "Abilita prima la modalità login"
 member = "Membro"
@@ -7350,6 +8025,9 @@ searchMembers = "Cerca membri..."
 status = "Stato"
 team = "Team"
 title = "Persone"
+unlockAccount = "Sblocca account"
+unlockUserError = "Impossibile sbloccare l'account utente"
+unlockUserSuccess = "Account utente sbloccato con successo"
 user = "Utente"
 
 [workspace.people.actions]
diff --git a/frontend/public/locales/ja-JP/translation.toml b/frontend/public/locales/ja-JP/translation.toml
index 7325b724a1..b58e009014 100644
--- a/frontend/public/locales/ja-JP/translation.toml
+++ b/frontend/public/locales/ja-JP/translation.toml
@@ -8,6 +8,7 @@ black = "é»’"
 blue = "�"
 bored = "待�時間�退屈"
 cancel = "キャンセル"
+confirm = "確�"
 changedCredsMessage = "資格情報�変更�れ����"
 chooseFile = "ファイルを�択"
 close = "閉�る"
@@ -146,6 +147,7 @@ insufficientCredits = "クレジット��足�����。必�: {{requi
 loadingCredits = "クレジットを確������..."
 loadingProStatus = "サブスクリプション�状態を確������..."
 noticeTopUpOrPlan = "クレジット��足�����。�ャージ�る�プランをアップグレード������"
+accessInvite = "招待"
 
 [account]
 accountSettings = "アカウント設定"
@@ -1427,6 +1429,34 @@ title = "処�"
 description = "エラーを報告�る��処�ジョブを待機�る最大時間。"
 label = "処�タイムアウト（秒）"
 
+[admin.settings.storage]
+description = "サー�ーストレージ�共有オプションを管����。"
+title = "ファイルストレージ�共有"
+
+[admin.settings.storage.enabled]
+description = "ユーザー�サー�ー�ファイルを�存��るよ�����。"
+label = "サー�ーファイルストレージを有効化"
+
+[admin.settings.storage.sharing.email]
+description = "メールアドレス�よる共有を許����。"
+label = "メール共有を有効化"
+mailLink = "メール設定を設定"
+mailNote = "メール設定�必���。 "
+
+[admin.settings.storage.sharing.enabled]
+description = "�存済�ファイル�共有を許����。"
+label = "共有を有効化"
+
+[admin.settings.storage.sharing.links]
+description = "サインイン�必��リンク�よる共有を許����。"
+frontendUrlLink = "システム設定�設定"
+frontendUrlNote = "フロントエンドURL�必���。 "
+label = "共有リンクを有効化"
+
+[admin.settings.storage.signing.enabled]
+description = "複数�加者�ドキュメント署�セッション�作�を許����。サー�ーファイルストレージ�有効化�必���。"
+label = "グループ署�（アルファ）を有効化"
+
 [admin.settings.unsavedChanges]
 cancel = "編集を続�る"
 discard = "変更を破棄"
@@ -2059,7 +2089,19 @@ numbers = "数値/範囲：5�10-20"
 progressions = "等差列：3n�4n+1"
 
 [certSign]
+allSigned = "�����加者�署�����。最終化�準備������。"
+awaitingSignatures = "署�待�"
+signatureProgress = "{{signedCount}}/{{totalCount}} 件�署�"
 chooseCertificate = "証明書ファイルを�択"
+declined = "辞退"
+fetchFailed = "署�データ�読�込��失敗����"
+finalized = "最終化済�"
+notified = "�留中"
+partialNote = "�在�署��早期�最終化����。未署���加者�除外�れ��。"
+pending = "�留中"
+readyToFinalize = "最終化�準備完了"
+signed = "署�済�"
+viewed = "閲覧済�"
 chooseJksFile = "JKS ファイルを�択"
 chooseP12File = "PKCS12 ファイルを�択"
 choosePfxFile = "PFX ファイルを�択"
@@ -2082,6 +2124,7 @@ title = "証明書�よる署�"
 invisible = "�表示"
 stepTitle = "署��表示"
 visible = "表示"
+visibility = "表示状態"
 
 [certSign.appearance.options]
 title = "署�詳細"
@@ -2188,6 +2231,252 @@ bullet4 = "検証�カスタム証明書を使用�能"
 text = "署��確����署��有効��誰���署�����署�後�文書�変更�れ��を知ら���。"
 title = "署��検証"
 
+[certSign.collab.finalize]
+button = "最終化��署�済�PDFを読�込む"
+early = "�在�署��最終化"
+
+[certSign.collab.sessionDetail]
+addButton = "�加者を追加"
+addParticipants = "�加者を追加"
+addParticipantsError = "�加者�追加�失敗����"
+backToList = "セッション一覧�戻る"
+deleteConfirm = "実行����？元�戻���ん。"
+deleteError = "セッション�削除�失敗����"
+deleted = "セッションを削除����"
+deleteSession = "セッションを削除"
+dueDate = "期�"
+finalizeError = "セッション�最終化�失敗����"
+loadPdfError = "署�済�PDF�読�込��失敗����"
+loadSignedPdf = "署�済�PDFをアクティブファイル�読�込む"
+messageLabel = "メッセージ"
+noAdditionalInfo = "追加情報��り��ん"
+owner = "所有者"
+participantRemoved = "�加者を削除����"
+participants = "�加者"
+participantsAdded = "�加者を追加����"
+removeParticipant = "削除"
+removeParticipantError = "�加者�削除�失敗����"
+selectUsers = "ユーザーを�択..."
+sessionInfo = "セッション情報"
+workbenchTitle = "セッション管�"
+
+[certSign.collab.signRequest]
+addedToFiles = "ドキュメントをアクティブファイル�追加����"
+addSignature = "����署�を追加"
+addToFiles = "アクティブファイル�追加"
+advancedSettings = "詳細設定"
+backToList = "署�リクエスト�戻る"
+certificateChoice = "署��使用�る証明書を�択"
+changeSignature = "署�を変更"
+clearSignature = "署�をクリア"
+completeAndSign = "完了��署�"
+createNewSignature = "新��署�を作�"
+declineButton = "辞退"
+decline = "リクエストを辞退"
+deleteSelected = "�択��署�を削除"
+drawSignature = "下�署�を手書�������"
+dueDate = "期�"
+fileTooLarge = "ファイルサイズ�5MB未満��る必���り��"
+fontFamily = "フォントファミリー"
+fontSize = "フォントサイズ: {{size}}px"
+fontSizePlaceholder = "サイズ"
+from = "�信者"
+invalidCertFile = "P12 ��� PFX �証明書ファイルを�択������"
+invalidFileType = "画�ファイルを�択������"
+location = "場所（任�）"
+locationPlaceholder = "���署�������？"
+message = "メッセージ"
+noCertificate = "証明書ファイルを�択������"
+noSignatures = "少���も1��署�をPDF��置������"
+p12File = "P12/PFX 証明書ファイル"
+password = "証明書�パスワード"
+passwordPlaceholder = "パスワードを入力..."
+penColor = "ペン�色"
+penSize = "ペンサイズ: {{size}}px"
+placementActive = "PDFをクリック���置"
+placeSignatureButton = "PDF�署�を�置"
+reason = "�由（任�）"
+reasonPlaceholder = "��署�����？"
+removeImage = "画�を削除"
+removeCertFile = "ファイルを削除"
+savedSignatures = "�存済��署�"
+selectFile = "画�ファイルを�択"
+selectSignatureTitle = "署�を�択���作�"
+signButton = "ドキュメント�署�"
+signatureInfo = "�れら�設定�ドキュメント�所有者�よ��設定�れ����"
+signaturePlaced = "ページ�署�を�置����"
+signatureSettings = "署�設定"
+signatureText = "署�テキスト"
+signatureTextPlaceholder = "��を入力..."
+signatureTypeLabel = "署�タイプ"
+signingTitle = "署�"
+textColor = "テキスト�色"
+typeSignature = "��を入力��署�を作�"
+uploadCert = "カスタム証明書"
+uploadCertDesc = "自分� P12/PFX 証明書を使用"
+uploadSignature = "署�画�をアップロード"
+usePersonalCert = "個人証明書"
+usePersonalCertDesc = "����アカウント用�自動生��れ��"
+useServerCert = "組織証明書"
+useServerCertDesc = "共有�組織証明書"
+workbenchTitle = "署�リクエスト"
+
+[certSign.collab.signRequest.canvas]
+colorPickerTitle = "線�色を�択"
+continue = "続行"
+
+[certSign.collab.signRequest.certModal]
+description = "{{count}} 個�署�を�置����。署�を完了�る証明書を�択������。"
+sign = "ドキュメント�署�"
+certValidating = "証明書を検証�����..."
+certValidUntil = "証明書�{{date}}��有効"
+certInvalid = "証明書�無効��: {{error}}"
+certInvalidFallback = "無効�証明書"
+certNetworkError = "証明書を検証����ん���"
+title = "証明書を設定"
+
+[certSign.collab.signRequest.image]
+hint = "署�� PNG ��� JPG 画�をアップロード"
+
+[certSign.collab.signRequest.mode]
+move = "署�を移動"
+place = "署�を�置"
+title = "署�/移動モード"
+
+[certSign.collab.signRequest.modeTabs]
+draw = "手書�"
+image = "アップロード"
+text = "入力"
+
+[certSign.collab.signRequest.placeSignature]
+message = "PDFをクリック��署�を�置������"
+title = "署�を�置"
+
+[certSign.collab.signRequest.preview]
+imageAlt = "�択��署�"
+missing = "プレビュー��"
+textFallback = "署�"
+
+[certSign.collab.signRequest.saved]
+defaultCanvasLabel = "手書��署�"
+defaultImageLabel = "アップロード��署�"
+defaultLabel = "署�"
+defaultTextLabel = "入力��署�"
+delete = "署�を削除"
+none = "�存済��署���り��ん"
+
+[certSign.collab.signRequest.signatureType]
+draw = "手書�"
+type = "入力"
+upload = "アップロード"
+
+[certSign.collab.signRequest.steps]
+back = "戻る"
+cancelPlacement = "�置をキャンセル"
+certificate = "証明書"
+clickMultipleTimes = "PDFを複数回クリック��署�を�置���。署�をドラッグ��移動やサイズ変更�����。"
+clickToPlace = "署�を表示���場所をPDF上�クリック������。"
+continue = "証明書��択�進む"
+continueToPlacement = "�置�進む"
+continueToReview = "確��進む"
+createSignature = "署�を作�"
+invisible = "�表示"
+location = "場所:"
+multipleSignatures = "{{count}} 個�署��PDF��用�れ��"
+oneSignature = "1 個�署��PDF��用�れ��"
+placeOnPdf = "PDF��置"
+reason = "�由:"
+reviewTitle = "署���確�"
+signaturePlaced = "ページ {{page}} �署�を�置����。も�一度クリック���置を調整�る��確��進ん�����。"
+visible = "表示"
+visibility = "表示状態:"
+yourSignatures = "����署�（{{count}}）"
+
+[certSign.collab.signRequest.text]
+colorLabel = "色"
+fontLabel = "フォント"
+fontSizeLabel = "サイズ"
+fontSizePlaceholder = "16"
+label = "署�テキスト"
+modalHint = "��を入力��続行をクリック��PDF��置���。"
+placeholder = "��を入力..."
+
+[certSign.collab.participant]
+certValidating = "証明書を検証�����..."
+certValid = "✓ 証明書�有効��"
+certValidUntil = " （{{date}}��）"
+certInvalid = "✗ {{error}}"
+certInvalidFallback = "無効�証明書"
+certNetworkError = "証明書を検証����ん���"
+
+[certSign.collab.addParticipants]
+add = "�加者を{{count}}人追加"
+back = "戻る"
+configureSignatures = "署�設定を設定"
+continue = "署�設定�進む"
+reasonHelp = "�れら��加者�署��由を事�設定���（任��署�時�上書��能）"
+reasonPlaceholder = "例）承��レビュー..."
+selectUsers = "ユーザーを�択"
+
+[certSign.collab.sessionCreation]
+includeSummaryPage = "署�サマリーページを��る"
+includeSummaryPageHelp = "末尾�����署�メタデータを�む�約ページ�追加�れ��。�ページ�デジタル証明書�署�ボックス�表示�れ��ん（手書�署���影響���ん）。"
+
+[certSign.collab.sessionList]
+active = "アクティブ"
+finalized = "最終化済�"
+
+[certSign.collab.signatureSettings]
+description = "�����加者�署��表示方法を設定���"
+title = "署��外観"
+
+[certSign.collab.userSelector]
+inviteUsers = "ユーザーを追加"
+loadError = "ユーザー�読�込��失敗����"
+noTeam = "�ーム��"
+noUsers = "他�ユーザー�見��り��ん。"
+placeholder = "ユーザーを�択..."
+
+[certSign.mobile]
+panelActions = "アクション"
+panelDocument = "ドキュメント"
+panelPeople = "ユーザー"
+
+[certSign.sessions]
+deleted = "セッションを削除����"
+fetchFailed = "セッション詳細�読�込��失敗����"
+finalized = "セッションを最終化����"
+loaded = "署�済�PDFを読�込����"
+pdfNotReady = "PDF�未準備��"
+pdfNotReadyDesc = "署�済�PDFを生�中��。少�待���ら�試行������。"
+
+[certificateChoice.tooltip]
+header = "証明書�種類"
+
+[certificateChoice.tooltip.organization]
+bullet1 = "システム管�者�管�"
+bullet2 = "権���るユーザー間�共有"
+bullet3 = "個人����会社�身元を表�"
+bullet4 = "用途: 公�文書��ーム�署�"
+description = "組織��供�る共有証明書。全社的�署�権��使用�れ��。"
+title = "組織証明書"
+
+[certificateChoice.tooltip.personal]
+bullet1 = "�回使用時�自動生�"
+bullet2 = "����ユーザーアカウント����"
+bullet3 = "他�ユーザー�共有��"
+bullet4 = "用途: 個人文書�個人�責任追跡"
+description = "����ユーザーアカウント専用�自動生��れる証明書。個人�署��������。"
+title = "個人証明書"
+
+[certificateChoice.tooltip.upload]
+bullet1 = "P12/PFX ファイル�パスワード�必�"
+bullet2 = "外部��証局�発行�能"
+bullet3 = "法的文書���高�信頼レベル"
+bullet4 = "用途: 法的拘�力��る契約�外部検証"
+description = "自分� PKCS#12 証明書ファイルを使用���。証明書プロパティを完全�制御����。"
+title = "カスタム P12 をアップロード"
+
 [changeCreds]
 changePassword = "デフォルト�ログイン�証情報を使用�����。新��パスワードを入力������"
 changeUsername = "ユーザー�を更新���。更新後�ログアウト�れ��。"
@@ -3242,6 +3531,46 @@ totalSelected = "�計�択数"
 unsupported = "未対応"
 unzip = "解�"
 uploadError = "一部�ファイル�アップロード�失敗����。"
+copyCreated = "��デ�イス�コピーを�存����。"
+copyFailed = "コピーを作�����ん���。"
+leaveShare = "自分�一覧�ら削除"
+leaveShareFailed = "共有ファイルを削除����ん���。"
+leaveShareSuccess = "共有リスト�ら削除����。"
+removeBoth = "両方�ら削除"
+removeFilePrompt = "��ファイル���デ�イス�サー�ー�両方��存�れ����。��ら�ら削除����？"
+removeFileTitle = "ファイルを削除"
+removeLocalOnly = "��デ�イス��"
+removeServerFailed = "サー�ー�らファイルを削除����ん���。"
+removeServerOnly = "サー�ー��"
+removeServerOnlyPrompt = "��ファイル�サー�ー����存�れ����。サー�ー�ら削除����？"
+removeServerSuccess = "サー�ー�ら削除����。"
+removeSharedPrompt = "��ファイル�����共有�れ����。��デ�イス�ら削除�る��共有リスト�ら削除����。"
+removeSharedServerOnlyBlockedPrompt = "��ファイル�����共有�れ��り�サー�ー����存�れ����。"
+removeSharedServerOnlyPrompt = "��ファイル�����共有�れ�サー�ー����存�れ����。リスト�ら削除����？"
+changesNotUploaded = "変更�アップロード�れ����ん"
+cloudFile = "クラウドファイル"
+filterAll = "���"
+filterLocal = "ローカル"
+filterSharedByMe = "自分�共有"
+filterSharedWithMe = "自分�共有"
+lastSynced = "最終�期"
+localOnly = "ローカル��"
+makeCopy = "コピーを作�"
+owner = "所有者"
+ownerUnknown = "�明"
+share = "共有"
+shareSelected = "�択項目を共有"
+sharedByYou = "����共有"
+sharedEditNoticeBody = "��ファイル�サー�ー上��ージョン�編集権���り��ん。行��編集�ローカルコピー����存�れ��。"
+sharedEditNoticeConfirm = "了解"
+sharedEditNoticeTitle = "サー�ー上�閲覧専用コピー"
+sharedWithYou = "����共有"
+sharing = "共有"
+storageState = "ストレージ"
+synced = "�期済�"
+updateOnServer = "サー�ー上�更新"
+uploadSelected = "�択項目をアップロード"
+uploadToServer = "サー�ー�アップロード"
 
 [files]
 addFiles = "ファイルを追加"
@@ -3367,6 +3696,77 @@ title = "PDF �フラット化����"
 discord = "Discord"
 issues = "GitHub"
 
+[groupSigning.tooltip]
+header = "グループ署�����"
+
+[groupSigning.tooltip.finalization]
+bullet1 = "����署��指定���加者�順���用�れ��"
+bullet2 = "必��応��一部�署����最終化����"
+bullet3 = "最終化後�セッションを変更����ん"
+description = "全�加者�署�完了後（���早期最終化を�択��場�）�最終的�署�済�PDFを生�����。"
+title = "最終化プロセス"
+
+[groupSigning.tooltip.roles]
+bullet1 = "所有者（���）: セッションを作���署��既定値を設定��ドキュメントを最終化"
+bullet2 = "�加者: 署�を作���証明書を�択��PDF��置"
+bullet3 = "�加者�署��表示��由�場所�設定を変更����ん"
+description = "�����加者�署��外観設定を����管����。"
+title = "�加者�役割"
+
+[groupSigning.tooltip.sequential]
+bullet1 = "2人目�ドキュメント�アクセス�る���最���加者�署��る必���り��"
+bullet2 = "法令順守����切�署�順�を確�"
+bullet3 = "リスト内�ドラッグ���加者�順�を変更����"
+description = "�加者�指定��順��ドキュメント�署����。�署�者�自分�順番��る�通知を���り��。"
+title = "順次署�"
+
+[groupSigning.steps]
+back = "戻る"
+completed = "完了"
+current = "�在"
+stepLabel = "ステップ {{number}}"
+
+[groupSigning.steps.configureDefaults]
+continue = "確��進む"
+invisible = "署���表示��り��（メタデータ��）"
+locationLabel = "場所:"
+preview = "プレビュー"
+reasonLabel = "�由:"
+title = "署�設定を設定"
+visible = "署��ページ {{page}} �表示�れ��"
+
+[groupSigning.steps.review]
+document = "ドキュメント"
+dueDate = "期�（任�）"
+dueDatePlaceholder = "期�を�択..."
+invisible = "�表示（メタデータ��）"
+location = "場所:"
+logo = "ロゴ:"
+logoHidden = "ロゴ��"
+logoShown = "Stirling PDF ロゴを表示"
+participants = "�加者"
+reason = "�由:"
+send = "署�リクエストを�信"
+signatureSettings = "署�設定"
+title = "セッション詳細�確�"
+titleShort = "確����信"
+visibility = "表示状態:"
+visible = "ページ {{page}} �表示"
+participantCount = "{{count}} 人�順番�署����"
+
+[groupSigning.steps.selectDocument]
+continue = "�加者��択�進む"
+noFile = "署�セッションを作��る���アクティブファイル�ら1��PDFファイルを�択������。"
+selectedFile = "�択��ドキュメント"
+title = "ドキュメントを�択"
+
+[groupSigning.steps.selectParticipants]
+continue = "署�設定�進む"
+count = "{{count}} 人を�択"
+label = "�加者を�択"
+placeholder = "�加者を�択..."
+title = "�加者を�択"
+
 [getPdfInfo]
 downloadJson = "JSON�ダウンロード"
 downloads = "ダウンロード"
@@ -4460,7 +4860,10 @@ zoomOut = "縮�"
 
 [viewer]
 cannotPreviewFile = "ファイルをプレビュー����ん"
+disableColorFilter = "カラーフィルターを無効化"
 dualPageView = "見開�表示"
+enableDarkFilter = "ダークフィルターを有効化"
+enableSepiaFilter = "セピアフィルターを有効化"
 firstPage = "最��ページ"
 lastPage = "最後�ページ"
 nextPage = "次�ページ"
@@ -4470,6 +4873,22 @@ singlePageView = "�一ページ表示"
 unknownFile = "�明�ファイル"
 zoomIn = "拡大"
 zoomOut = "縮�"
+resetZoom = "ズームをリセット"
+
+[viewer.nonPdf]
+fileTypeBadge = "{{type}} ファイル"
+convertToPdf = "PDF �変�"
+loading = "読�込�中..."
+emptyFile = "空�ファイル"
+csvStats = "{{rows}} 行 · {{columns}} 列 · {{size}}"
+sortedBy = "並�替�基準: {{column}}"
+columnDefault = "列 {{index}}"
+htmlPreviewWarning = "HTMLプレビュー — 外部リソース�読�込�れ��場���り�� · {{size}}"
+htmlPreview = "HTMLプレビュー"
+invalidJson = "無効� JSON — 生�内容を表示�����"
+textStats = "{{lines}} 行 · {{size}}"
+lineNumbers = "行番�"
+renderMarkdown = "Markdown をレンダリング"
 
 [viewer.attachments]
 title = "添付ファイル"
@@ -4531,6 +4950,7 @@ toggleAttachments = "添付ファイル�表示切替"
 toggleTheme = "テーマを切り替�"
 language = "言語"
 toggleAnnotations = "注釈�表示を切り替�"
+toggleLayers = "レイヤー�切り替�"
 search = "PDF を検索"
 panMode = "パンモード"
 applyRedactionsFirst = "先�墨消�を�用"
@@ -5407,20 +5827,72 @@ title = "ファイル��刷"
 2 = "プリンタ�を入力"
 
 [quickAccess]
+access = "アクセス"
+accessAddPerson = "別�ユーザーを追加"
+accessBack = "戻る"
+accessCopyLink = "リンクをコピー"
+accessEmail = "メールアドレス"
+accessEmailPlaceholder = "name@company.com"
+accessFileLabel = "ファイル"
+accessGeneral = "一般アクセス"
+accessInviteTitle = "ユーザーを招待"
+accessOwner = "所有者"
+accessPanel = "ドキュメント�アクセス"
+accessPeople = "アクセス権��るユーザー"
+accessRemove = "削除"
+accessRestricted = "制�付�"
+accessRestrictedHint = "アクセス権��るユーザー���開���"
+accessRole = "権�"
+accessRoleCommenter = "コメント投稿者"
+accessRoleEditor = "編集者"
+accessRoleViewer = "閲覧者"
+accessSelectedFile = "�択��ファイル"
+accessSendInvite = "招待を�信"
+accessTitle = "ドキュメント�アクセス"
+accessYou = "���"
 account = "アカウント"
+activeSessions = "アクティブ�セッション"
+activeTab = "アクティブ"
 activity = "アクティビティ"
 adminSettings = "管�者設定"
+allSessions = "����セッション"
 allTools = "All Tools"
 automate = "自動化"
+back = "戻る"
+certSign = "証明書署�"
+completedSessions = "完了��セッション"
+completedTab = "完了"
 config = "構�"
+createNew = "新��リクエストを作�"
+createSession = "署�リクエストを作�"
+dueDate = "期�（任�）"
 files = "ファイル"
 help = "ヘルプ"
+noActiveSessions = "�留中�署�リクエストやアクティブ�セッション��り��ん"
+noCompletedSessions = "完了��セッション��り��ん"
+noFile = "ファイル��択�れ����ん"
 read = "読む"
 reader = "リーダー"
+refresh = "æ›´æ–°"
+requestSignatures = "署�を�頼"
+selectSingleFileToRequest = "署�を�頼�るPDFファイルを1��択������"
+selectedFile = "�択��ファイル"
+selectUsers = "署��るユーザーを�択"
+selectUsersPlaceholder = "�加者を�択..."
+sendingRequest = "�信中..."
 settings = "設定"
 showMeAround = "案内��"
 sign = "署�"
+signatureRequests = "署�リクエスト"
+signYourself = "自分�署�"
+newRequest = "新�リクエスト"
 tours = "ツアー"
+wetSign = "署�を追加"
+filterMine = "自分"
+filterOverdue = "期�超�"
+filterSigned = "署�済�"
+filterDeclined = "辞退"
+searchDocuments = "ドキュメントを検索…"
 
 [quickAccess.helpMenu]
 adminTour = "管�ツアー"
@@ -6050,11 +6522,75 @@ toolNotAvailableLocally = "Stirling-PDF サー�ー�オフライン��ロ
 expired = "セッション�期�切れ��。ページを更新��も�一度�試�����。"
 refreshPage = "ページを更新"
 
+[sessionManagement.tooltip]
+header = "署�セッション�管�"
+
+[sessionManagement.tooltip.addParticipants]
+bullet1 = "新���加者�署�順��最後�追加�れ��"
+bullet2 = "セッション�最終化後��加者を追加����ん"
+bullet3 = "��加者�自分�順番��る�通知を���り��"
+description = "最終化���れ��アクティブ�セッション����も�加者を追加����。"
+title = "�加者�追加"
+
+[sessionManagement.tooltip.finalization]
+bullet1 = "<b>完全最終化</b>: �����加者�署�済�"
+bullet2 = "<b>部分最終化</b>: 一部��加者���署������ん"
+bullet3 = "未署���加者�最終ドキュメント�ら除外�れ��"
+bullet4 = "最終化後�署�済�PDFをアクティブファイル�読�込���"
+description = "最終化�����署�を1��署�済�PDF������。���作�元�戻���ん。"
+title = "セッション�最終化"
+
+[sessionManagement.tooltip.participantRemoval]
+bullet1 = "既�署����加者�削除����ん"
+bullet2 = "削除�れ��加者��以�通知�れ��ん"
+bullet3 = "署�順��自動的�調整�れ��"
+description = "署����れ�セッション�ら�加者を削除����。"
+title = "�加者�削除"
+
+[sessionManagement.tooltip.signatureOrder]
+bullet1 = "�署��順番�PDF��用�れ��"
+bullet2 = "後�署�者�先�署�を確�����"
+bullet3 = "承�ワークフローや法的�証跡���欠��"
+description = "セッション作�時�指定�る順���誰�最��署��る�を決定���。"
+title = "署��順�"
+
+[signatureSettings.tooltip]
+header = "署��外観設定"
+
+[signatureSettings.tooltip.location]
+bullet1 = "例: \"New York, USA\"�\"London Office\"�\"Remote\""
+bullet2 = "ページ上��置��異�り��"
+bullet3 = "法域�よ���必須��る場���り��"
+description = "署��行�れ�地�的�場所（任�）。証明書�メタデータ��存�れ��。"
+title = "署��場所"
+
+[signatureSettings.tooltip.logo]
+bullet1 = "署��テキスト�横�表示�れ��"
+bullet2 = "PNG�JPG 形��対応"
+bullet3 = "プロフェッショナル��象を高���"
+description = "ブランド�真正性�����表示�れる署��会社�ロゴを追加���。"
+title = "会社ロゴ"
+
+[signatureSettings.tooltip.reason]
+bullet1 = "例: \"Approval\"�\"Contract Agreement\"�\"Review Complete\""
+bullet2 = "PDF�署�プロパティ�表示�れ��"
+bullet3 = "監査証跡やコンプライアンス�有用��"
+description = "ドキュメント�署��る�由（任�）。証明書�メタデータ��存�れ��。"
+title = "署��由"
+
+[signatureSettings.tooltip.visibility]
+bullet1 = "<b>表示</b>: カスタム外観�PDF�署��表示�れ��"
+bullet2 = "<b>�表示</b>: 視覚的�マーク���証明書��を埋�込���"
+bullet3 = "�表示�署��も暗�学的�検証��供�れ��"
+description = "署�をドキュメント上�表示�る���表示�埋�込む�を制御���。"
+title = "署��表示"
+
 [settings.configuration]
 advanced = "詳細設定"
 database = "データベース"
 endpoints = "エンド�イント"
 features = "機能"
+storageSharing = "ファイルストレージ�共有"
 systemSettings = "システム設定"
 title = "構�"
 
@@ -6332,10 +6868,13 @@ title = "Stirling �サインイン"
 [setup.selfhosted]
 link = "���セルフホスト型アカウント�接続"
 subtitle = "サー�ー��証情報を入力"
+changeServerLocked = "����組織���アプリを特定�サー�ー�制������"
 switchToLocal = "代�り�ローカルツールを使用"
 title = "サー�ー�サインイン"
 
 [setup.selfhosted.unreachable]
+changeServer = "別�サー�ー�接続"
+changeServerLocked = "����組織���アプリを特定�サー�ー�制������"
 continueOffline = "代�り�ローカルツールを使用"
 message = "{{url}} �到�����ん。サー�ー�稼���アクセス�能�確�������。"
 retry = "�試行"
@@ -6529,6 +7068,15 @@ saved = "�存済�"
 text = "テキスト"
 title = "署�タイプ"
 
+[signRequest]
+declined = "署�リクエストを辞退����"
+fetchFailed = "署�リクエスト�読�込��失敗����"
+signed = "ドキュメント�署���功����"
+
+[signSession]
+createFailed = "署�リクエスト�作��失敗����"
+created = "署�リクエストを�信����"
+
 [signup]
 accountCreatedSuccessfully = "アカウント�作��れ���。今��サインイン����。"
 alreadyHaveAccount = "���アカウントを������？サインイン"
@@ -6807,6 +7355,106 @@ title = "PDFを�ャプター���分割"
 [splitPdfByChapters]
 tags = "分割,章,��り,整�"
 
+[storageShare]
+accessed = "アクセス済�"
+accessDenied = "��共有ファイル��アクセス権��り��ん。所有者�共有を�頼������。"
+accessFailed = "アクティビティを読�込���ん。"
+accessDeniedBody = "��ファイル��アクセス権��り��ん。所有者�共有を�頼������。"
+accessDeniedTitle = "アクセス権��り��ん"
+accessLimitedCommenter = "コメント権��近日対応予定��。ダウンロード�必��場���所有者�編集権�を�頼������。"
+accessLimitedTitle = "制�付�アクセス"
+accessLimitedViewer = "��リンク�閲覧����。ダウンロード�必��場���所有者�編集権�を�頼������。"
+createdAt = "作�日時"
+download = "ダウンロード"
+downloadFailed = "��ファイルをダウンロード����ん。"
+expiredBody = "��共有リンク�無効��有効期��切れ����。"
+expiredTitle = "リンク�有効期�切れ"
+goToLogin = "ログイン�"
+loadFailed = "共有ファイルを開���ん。"
+loading = "共有リンクを読�込�中..."
+loginPrompt = "��共有ファイル�アクセス�る��サインイン������。"
+loginRequired = "ログイン�必���"
+openInApp = "Stirling PDF �開�"
+ownerLabel = "所有者"
+ownerUnknown = "�明"
+requiresLogin = "��共有ファイル�ログイン�必���。"
+roleCommenter = "コメント投稿者"
+roleEditor = "編集者"
+roleViewer = "閲覧者"
+shareHeading = "共有ファイル"
+titleDefault = "共有ファイル"
+tryAgain = "後�も�一度�試�����。"
+addUser = "追加"
+commenterHint = "コメント機能�近日対応予定��。"
+copied = "リンクをクリップボード�コピー����"
+copy = "コピー"
+copyFailed = "コピー�失敗����"
+description = "��ファイル�共有リンクを作����。リンクを��サインイン済�ユーザー�アクセス����。"
+downloadsCount = "ダウンロード数: {{count}}"
+emailWarningBody = "�れ�メールアドレス�よ���。��相手�既� Stirling PDF �ユーザー���場��ファイル�アクセス����ん。"
+emailWarningConfirm = "�れ�も共有�る"
+emailWarningTitle = "メールアドレス"
+errorTitle = "共有�失敗����"
+failure = "共有リンクを生�����ん。も�一度�試�����。"
+fileLabel = "ファイル"
+generate = "リンクを生�"
+generated = "共有リンクを生�����"
+hideActivity = "アクティビティを�表示"
+invalidUsername = "有効�ユーザー����メールアドレスを入力������。"
+lastAccessed = "最終アクセス"
+linkAccessTitle = "共有リンク�アクセス"
+linkLabel = "共有リンク"
+linksDisabled = "共有リンク�無効化�れ����。"
+linksDisabledBody = "サー�ー設定�より共有リンク�無効化�れ����。"
+manage = "共有を管�"
+manageDescription = "��ファイルを共有�る���リンクを作�・管����。"
+manageLoadFailed = "共有リンクを読�込���ん。"
+manageTitle = "共有�管�"
+noActivity = "��アクティビティ��り��ん。"
+noLinks = "アクティブ�共有リンク����り��ん。"
+noSharedUsers = "��アクセス権を��ユーザー����ん。"
+removeLink = "リンクを削除"
+removeUser = "削除"
+revokeFailed = "共有リンクを削除����ん���。"
+revoked = "共有リンクを削除����"
+roleLabel = "権�"
+sharingDisabled = "共有�無効��。"
+sharingDisabledBody = "サー�ー設定�より共有�無効化�れ����。"
+sharedUsersTitle = "共有ユーザー"
+title = "ファイルを共有"
+unknownUser = "�明�ユーザー"
+userAddFailed = "��ユーザー�共有����ん。"
+userAdded = "共有リスト�ユーザーを追加����。"
+usernameLabel = "ユーザー����メールアドレス"
+usernamePlaceholder = "ユーザー����メールアドレスを入力"
+userRemoveFailed = "��ユーザーを削除����ん。"
+userRemoved = "共有リスト�らユーザーを削除����。"
+viewActivity = "アクティビティを表示"
+viewed = "閲覧"
+viewsCount = "閲覧数: {{count}}"
+downloaded = "ダウンロード"
+bulkDescription = "�択������ファイルをサインイン済�ユーザー�共有�る1��リンクを作����。"
+bulkTitle = "�択��ファイルを共有"
+copyLink = "共有リンクをコピー"
+fileCount = "{{count}} 件�ファイルを�択中"
+ownerOnly = "共有�管��所有者���行���。"
+selectSingleFile = "共有を管��る��ファイルを1件�択������。"
+
+[storageUpload]
+description = "�在�ファイルをサー�ーストレージ�アップロード��自分�アクセス��るよ�����。"
+errorTitle = "アップロード�失敗����"
+failure = "アップロード�失敗����。ログイン情報�ストレージ設定を確�������。"
+fileLabel = "ファイル"
+hint = "公開リンク�アクセスモード�サー�ー設定�制御�れ��。"
+success = "サー�ー�アップロード����"
+title = "サー�ー�アップロード"
+updateButton = "サー�ー上�更新"
+uploadButton = "サー�ー�アップロード"
+bulkDescription = "�択��ファイルをサー�ーストレージ�アップロード���。"
+bulkTitle = "�択��ファイルをアップロード"
+fileCount = "{{count}} 件�ファイルを�択中"
+more = " +{{count}} 件 ��"
+
 [storage]
 approximateSize = "概算サイズ"
 fileTooLarge = "ファイル�大�����。ファイル���最大サイズ�"
@@ -7153,6 +7801,30 @@ title = "PDF�表示/編集"
 [warning]
 tooltipTitle = "警告"
 
+[wetSignature.tooltip]
+header = "署��作�方法"
+
+[wetSignature.tooltip.draw]
+bullet1 = "ペン�色�太�をカスタマイズ"
+bullet2 = "�得����クリア����直�"
+bullet3 = "タッ�デ�イス（タブレット・スマートフォン）�対応"
+description = "マウスやタッ�スクリーン�手書��署�を作����。個人的�本物ら��署��最���。"
+title = "手書��署�"
+
+[wetSignature.tooltip.type]
+bullet1 = "複数�フォント�ら�択"
+bullet2 = "文字サイズ�色をカスタマイズ"
+bullet3 = "定型的�署��最�"
+description = "入力��テキスト�ら署�を生����。高速�一貫性��り�ビジ�ス文書�������。"
+title = "テキスト�署�"
+
+[wetSignature.tooltip.upload]
+bullet1 = "PNG�JPG ���画�形��対応"
+bullet2 = "最良��果����明背景を推奨"
+bullet3 = "署�領域�����画�をリサイズ"
+description = "作�済��署�画�をアップロード���。スキャン��署�や会社ロゴ��る場��最���。"
+title = "署�画�をアップロード"
+
 [watermark]
 completed = "���を追加����"
 desc = "PDF ファイル�テキスト���画�����を追加"
@@ -7333,6 +8005,7 @@ activeSession = "アクティブセッション"
 addMembers = "メン�ーを追加"
 admin = "管�者"
 confirmDelete = "��ユーザーを削除��よ������？���作�元�戻���ん。"
+confirmUnlock = "��ユーザーアカウント�ロックを解除��よ������？"
 deleteUser = "ユーザーを削除"
 deleteUserError = "ユーザー�削除�失敗����"
 deleteUserSuccess = "ユーザーを削除����"
@@ -7341,6 +8014,8 @@ disable = "無効化"
 disabled = "無効"
 editRole = "ロールを編集"
 enable = "有効化"
+locked = "ロック中"
+lockedBadge = "ロック中"
 loading = "メン�ーを読�込�中..."
 loginRequired = "先�ログインモードを有効�������"
 member = "メン�ー"
@@ -7350,6 +8025,9 @@ searchMembers = "メン�ーを検索..."
 status = "ステータス"
 team = "�ーム"
 title = "メン�ー"
+unlockAccount = "アカウント�ロックを解除"
+unlockUserError = "ユーザーアカウント�ロック解除�失敗����"
+unlockUserSuccess = "ユーザーアカウント�ロックを解除����"
 user = "ユーザー"
 
 [workspace.people.actions]
diff --git a/frontend/public/locales/ko-KR/translation.toml b/frontend/public/locales/ko-KR/translation.toml
index 758f1e7728..b6ae747b55 100644
--- a/frontend/public/locales/ko-KR/translation.toml
+++ b/frontend/public/locales/ko-KR/translation.toml
@@ -8,6 +8,7 @@ black = "검정"
 blue = "파랑"
 bored = "기다리는 것� 지루하신가요?"
 cancel = "취소"
+confirm = "확�"
 changedCredsMessage = "�격 �명� 변경�었습니다!"
 chooseFile = "파� 선�"
 close = "닫기"
@@ -146,6 +147,7 @@ insufficientCredits = "�레딧� 부족합니다. 필요: {{requiredCredits}}
 loadingCredits = "�레딧 확� 중..."
 loadingProStatus = "구� �태 확� 중..."
 noticeTopUpOrPlan = "�레딧� 부족합니다. 충전하거나 요금제를 업그레�드하세요"
+accessInvite = "초대"
 
 [account]
 accountSettings = "계정 설정"
@@ -1427,6 +1429,34 @@ title = "처리"
 description = "오류를 보고하기 전 처리 작업� 대기할 최대 시간입니다."
 label = "처리 시간 제한(초)"
 
+[admin.settings.storage]
+description = "서버 저장소 � 공유 옵션� 관리합니다."
+title = "파� 저장 � 공유"
+
+[admin.settings.storage.enabled]
+description = "사용�가 서버� 파�� 저장할 수 있�� 허용합니다."
+label = "서버 파� 저장 사용"
+
+[admin.settings.storage.sharing.email]
+description = "�메� 주소로 공유를 허용합니다."
+label = "�메� 공유 사용"
+mailLink = "메� 설정 구성"
+mailNote = "메� 구성� 필요합니다. "
+
+[admin.settings.storage.sharing.enabled]
+description = "사용�가 저장� 파�� 공유할 수 있�� 허용합니다."
+label = "공유 사용"
+
+[admin.settings.storage.sharing.links]
+description = "로그�� 필요한 ��를 통한 공유를 허용합니다."
+frontendUrlLink = "시스템 설정�서 구성"
+frontendUrlNote = "프론트엔드 URL� 필요합니다. "
+label = "공유 �� 사용"
+
+[admin.settings.storage.signing.enabled]
+description = "사용�가 다중 참여� 문서 서명 세션� 만들 수 있�� 허용합니다. 서버 파� 저장 기능� 활성화�어 있어야 합니다."
+label = "그룹 서명 사용(Alpha)"
+
 [admin.settings.unsavedChanges]
 cancel = "계� 편집"
 discard = "변경 사항 버리기"
@@ -2059,7 +2089,19 @@ numbers = "숫�/범위: 5, 10-20"
 progressions = "등차 수열: 3n, 4n+1"
 
 [certSign]
+allSigned = "모든 참여�가 서명했습니다. 최종 완료할 준비가 �었습니다."
+awaitingSignatures = "서명 대기 중"
+signatureProgress = "{{signedCount}}/{{totalCount}} 서명"
 chooseCertificate = "��서 파� 선�"
+declined = "거부�"
+fetchFailed = "서명 ��터를 불러오지 못했습니다"
+finalized = "최종 완료�"
+notified = "대기 중"
+partialNote = "현재 서명으로 조기 최종 완료할 수 있습니다. 서명하지 않� 참여�는 제외�니다."
+pending = "대기 중"
+readyToFinalize = "최종 완료 준비�"
+signed = "서명�"
+viewed = "열람�"
 chooseJksFile = "JKS 파� 선�"
 chooseP12File = "PKCS12 파� 선�"
 choosePfxFile = "PFX 파� 선�"
@@ -2082,6 +2124,7 @@ title = "��서 서명"
 invisible = "보�지 않�"
 stepTitle = "서명 표시"
 visible = "ë³´ìž„"
+visibility = "표시 여부"
 
 [certSign.appearance.options]
 title = "서명 세부정보"
@@ -2188,6 +2231,252 @@ bullet4 = "검�� 사용� 지정 ��서를 사용할 수 있�"
 text = "서명� 검사하면, 유효한지, 누가 언제 서명했는지, 서명 �후 문서가 변경�었는지를 알려�니다."
 title = "서명 확�"
 
+[certSign.collab.finalize]
+button = "최종 완료 후 서명� PDF 로드"
+early = "현재 서명으로 최종 완료"
+
+[certSign.collab.sessionDetail]
+addButton = "참여� 추가"
+addParticipants = "참여� 추가"
+addParticipantsError = "참여� 추가� 실패했습니다"
+backToList = "세션 목�으로 �아가기"
+deleteConfirm = "정�로 진행하시겠습니까? � 작업� ��릴 수 없습니다."
+deleteError = "세션 삭제� 실패했습니다"
+deleted = "세션� 삭제�었습니다"
+deleteSession = "세션 삭제"
+dueDate = "마��"
+finalizeError = "세션 최종 완료� 실패했습니다"
+loadPdfError = "서명� PDF를 불러오지 못했습니다"
+loadSignedPdf = "서명� PDF를 활성 파�로 로드"
+messageLabel = "메시지"
+noAdditionalInfo = "추가 정보 없�"
+owner = "소유�"
+participantRemoved = "참여�가 제거�었습니다"
+participants = "참여�"
+participantsAdded = "참여�가 성공�으로 추가�었습니다"
+removeParticipant = "제거"
+removeParticipantError = "참여� 제거� 실패했습니다"
+selectUsers = "사용� 선�..."
+sessionInfo = "세션 정보"
+workbenchTitle = "세션 관리"
+
+[certSign.collab.signRequest]
+addedToFiles = "문서가 활성 파�� 추가�었습니다"
+addSignature = "서명 추가"
+addToFiles = "활성 파�� 추가"
+advancedSettings = "고급 설정"
+backToList = "서명 요청 목�으로 �아가기"
+certificateChoice = "서명� 사용할 ��서를 선�하세요"
+changeSignature = "서명 변경"
+clearSignature = "서명 지우기"
+completeAndSign = "완료 � 서명"
+createNewSignature = "새 서명 만들기"
+declineButton = "거부"
+decline = "요청 거부"
+deleteSelected = "선�한 서명 삭제"
+drawSignature = "아래� 서명� 그리세요"
+dueDate = "마��"
+fileTooLarge = "파� �기는 5MB 미만�어야 합니다"
+fontFamily = "글꼴"
+fontSize = "글꼴 �기: {{size}}px"
+fontSizePlaceholder = "�기"
+from = "보낸 사람"
+invalidCertFile = "P12 �는 PFX ��서 파�� 선�하세요"
+invalidFileType = "�미지 파�� 선�하세요"
+location = "위치(선� 사항)"
+locationPlaceholder = "어디�서 서명하나요?"
+message = "메시지"
+noCertificate = "��서 파�� 선�하세요"
+noSignatures = "PDF� 최소 한 개 ��� 서명� 배치하세요"
+p12File = "P12/PFX ��서 파�"
+password = "��서 비밀번호"
+passwordPlaceholder = "비밀번호 입력..."
+penColor = "펜 색�"
+penSize = "펜 �기: {{size}}px"
+placementActive = "�릭하여 PDF� 배치"
+placeSignatureButton = "PDF� 서명 배치"
+reason = "사유(선� 사항)"
+reasonPlaceholder = "왜 서명하나요?"
+removeImage = "�미지 제거"
+removeCertFile = "파� 제거"
+savedSignatures = "저장� 서명"
+selectFile = "�미지 파� 선�"
+selectSignatureTitle = "서명 선� �는 �성"
+signButton = "문서 서명"
+signatureInfo = "� 설정� 문서 소유�가 구성했습니다"
+signaturePlaced = "서명� 페�지� 배치�었습니다"
+signatureSettings = "서명 설정"
+signatureText = "서명 �스트"
+signatureTextPlaceholder = "�름� 입력하세요..."
+signatureTypeLabel = "서명 유형"
+signingTitle = "서명 중"
+textColor = "�스트 색�"
+typeSignature = "�름� 입력하여 서명� 만드세요"
+uploadCert = "사용� 지정 ��서"
+uploadCertDesc = "본�� P12/PFX ��서 사용"
+uploadSignature = "서명 �미지를 업로드"
+usePersonalCert = "개� ��서"
+usePersonalCertDesc = "귀하� 계정� 대해 �� �성�"
+useServerCert = "조� ��서"
+useServerCertDesc = "공유 조� ��서"
+workbenchTitle = "서명 요청"
+
+[certSign.collab.signRequest.canvas]
+colorPickerTitle = "선 색� 선�"
+continue = "계�"
+
+[certSign.collab.signRequest.certModal]
+description = "서명� {{count}}개 배치했습니다. 서명� 완료할 ��서를 선�하세요."
+sign = "문서 서명"
+certValidating = "��서 검� 중..."
+certValidUntil = "��서 유효 기간: {{date}}까지"
+certInvalid = "��서가 유효하지 않�: {{error}}"
+certInvalidFallback = "유효하지 않� ��서"
+certNetworkError = "��서를 검�할 수 없습니다"
+title = "��서 구성"
+
+[certSign.collab.signRequest.image]
+hint = "서명 �미지� PNG �는 JPG를 업로드하세요"
+
+[certSign.collab.signRequest.mode]
+move = "서명 ��"
+place = "서명 배치"
+title = "서명 �는 �� 모드"
+
+[certSign.collab.signRequest.modeTabs]
+draw = "그리기"
+image = "업로드"
+text = "ìž…ë ¥"
+
+[certSign.collab.signRequest.placeSignature]
+message = "PDF를 �릭하여 서명� 배치하세요"
+title = "서명 배치"
+
+[certSign.collab.signRequest.preview]
+imageAlt = "선�한 서명"
+missing = "미리보기 없�"
+textFallback = "서명"
+
+[certSign.collab.signRequest.saved]
+defaultCanvasLabel = "서명 그리기"
+defaultImageLabel = "업로드한 서명"
+defaultLabel = "서명"
+defaultTextLabel = "입력한 서명"
+delete = "서명 삭제"
+none = "저장� 서명� 없습니다"
+
+[certSign.collab.signRequest.signatureType]
+draw = "그리기"
+type = "ìž…ë ¥"
+upload = "업로드"
+
+[certSign.collab.signRequest.steps]
+back = "뒤로"
+cancelPlacement = "배치 취소"
+certificate = "��서"
+clickMultipleTimes = "서명� 배치하려면 PDF를 여러 번 �릭하세요. 서명� 드래그하여 ��하거나 �기를 조절할 수 있습니다."
+clickToPlace = "서명� 표시� 위치를 PDF�서 �릭하세요."
+continue = "��서 선�으로 계�"
+continueToPlacement = "배치로 계�"
+continueToReview = "검토로 계�"
+createSignature = "서명 만들기"
+invisible = "보�지 않�"
+location = "위치:"
+multipleSignatures = "PDF� 서명 {{count}}개가 �용�니다"
+oneSignature = "PDF� 서명 1개가 �용�니다"
+placeOnPdf = "PDF� 배치"
+reason = "사유:"
+reviewTitle = "서명 전 검토"
+signaturePlaced = "{{page}}페�지� 서명� 배치했습니다. 다시 �릭하여 위치를 조정하거나 검토를 계�할 수 있습니다."
+visible = "ë³´ìž„"
+visibility = "표시 여부:"
+yourSignatures = "내 서명({{count}})"
+
+[certSign.collab.signRequest.text]
+colorLabel = "색�"
+fontLabel = "글꼴"
+fontSizeLabel = "�기"
+fontSizePlaceholder = "16"
+label = "서명 �스트"
+modalHint = "�름� 입력한 후 '계�'� �릭하여 PDF� 배치하세요."
+placeholder = "�름� 입력하세요..."
+
+[certSign.collab.participant]
+certValidating = "��서 검� 중..."
+certValid = "✓ ��서 유효함"
+certValidUntil = " {{date}}까지"
+certInvalid = "✗ {{error}}"
+certInvalidFallback = "유효하지 않� ��서"
+certNetworkError = "��서를 검�할 수 없습니다"
+
+[certSign.collab.addParticipants]
+add = "참여� {{count}}명 추가"
+back = "뒤로"
+configureSignatures = "서명 설정 구성"
+continue = "서명 설정으로 계�"
+reasonHelp = "� 참여�들� 위한 서명 사유를 미리 설정합니다(선� 사항, 서명 시 변경 가능)"
+reasonPlaceholder = "예: 승�, 검토..."
+selectUsers = "사용� 선�"
+
+[certSign.collab.sessionCreation]
+includeSummaryPage = "서명 요약 페�지 �함"
+includeSummaryPageHelp = "모든 서명 메타��터가 �함� 요약 페�지가 마지막� 추가�니다. 개별 페�지� 디지털 ��서 서명 ��는 숨겨집니다(�필 서명�는 �향 없�)."
+
+[certSign.collab.sessionList]
+active = "진행 중"
+finalized = "최종 완료�"
+
+[certSign.collab.signatureSettings]
+description = "모든 참여�� 대한 서명 표시 방�� 구성합니다"
+title = "서명 모양"
+
+[certSign.collab.userSelector]
+inviteUsers = "사용� 추가"
+loadError = "사용�를 불러오지 못했습니다"
+noTeam = "팀 없�"
+noUsers = "다른 사용�를 찾� 수 없습니다."
+placeholder = "사용� 선�..."
+
+[certSign.mobile]
+panelActions = "ìž‘ì—…"
+panelDocument = "문서"
+panelPeople = "사람"
+
+[certSign.sessions]
+deleted = "세션� 삭제�었습니다"
+fetchFailed = "세션 세부 정보를 불러오지 못했습니다"
+finalized = "세션� 최종 완료�었습니다"
+loaded = "서명� PDF가 로드�었습니다"
+pdfNotReady = "PDF 준비�지 않�"
+pdfNotReadyDesc = "서명� PDF를 �성하는 중입니다. 잠시 후 다시 시�하세요."
+
+[certificateChoice.tooltip]
+header = "��서 유형"
+
+[certificateChoice.tooltip.organization]
+bullet1 = "시스템 관리�가 관리"
+bullet2 = "�가� 사용� 간 공유"
+bullet3 = "개�� 아닌 회사 신�� 대표"
+bullet4 = "권장 용�: 공� 문서, 팀 서명"
+description = "조��서 제공하는 공유 ��서입니다. 전사� 서명 권한� 사용�니다."
+title = "조� ��서"
+
+[certificateChoice.tooltip.personal]
+bullet1 = "첫 사용 시 �� �성"
+bullet2 = "사용� 계정과 연결"
+bullet3 = "다른 사용�와 공유 불가"
+bullet4 = "권장 용�: 개� 문서, 개� 책임"
+description = "사용� 계정� 고유한 �� �성 ��서입니다. 개� 서명� �합합니다."
+title = "개� ��서"
+
+[certificateChoice.tooltip.upload]
+bullet1 = "P12/PFX 파�과 비밀번호 필요"
+bullet2 = "외부 �� 기관�서 발급 가능"
+bullet3 = "법� 문서� � 높� 신뢰 수준"
+bullet4 = "권장 용�: 법� 효력 있는 계약, 외부 검�"
+description = "PKCS#12 ��서 파�� �접 사용합니다. ��서 �성� 완전히 제어할 수 있습니다."
+title = "사용� 지정 P12 업로드"
+
 [changeCreds]
 changePassword = "기본 로그� �격 �명� 사용 중입니다. 새 비밀번호를 입력하세요"
 changeUsername = "사용� �름� 업��트합니다. 업��트 후 로그아웃�니다."
@@ -3242,6 +3531,46 @@ totalSelected = "� 선�"
 unsupported = "지��지 않�"
 unzip = "압축 해제"
 uploadError = "�부 파�� 업로드하지 못했습니다."
+copyCreated = "복사본� � 기기� 저장�었습니다."
+copyFailed = "복사본� �성할 수 없습니다."
+leaveShare = "내 목��서 제거"
+leaveShareFailed = "공유� 파�� 제거할 수 없습니다."
+leaveShareSuccess = "공유 목��서 제거�었습니다."
+removeBoth = "둘 다�서 제거"
+removeFilePrompt = "� 파�� � 기기와 서버� 모� 저장�어 있습니다. 어디�서 제거하시겠습니까?"
+removeFileTitle = "파� 제거"
+removeLocalOnly = "� 기기만"
+removeServerFailed = "서버�서 파�� 제거할 수 없습니다."
+removeServerOnly = "서버만"
+removeServerOnlyPrompt = "� 파�� 서버�만 저장�어 있습니다. 서버�서 제거하시겠습니까?"
+removeServerSuccess = "서버�서 제거�."
+removeSharedPrompt = "� 파�� 귀하와 공유�었습니다. � 기기�서 제거하거나 공유 목��서 제거할 수 있습니다."
+removeSharedServerOnlyBlockedPrompt = "� 파�� 귀하와 공유�었으며 서버�만 저장�어 있습니다."
+removeSharedServerOnlyPrompt = "� 파�� 귀하와 공유�었으며 서버�만 저장�어 있습니다. 목��서 제거하시겠습니까?"
+changesNotUploaded = "변경 사항� 업로드�지 않�"
+cloudFile = "��우드 파�"
+filterAll = "모�"
+filterLocal = "로컬"
+filterSharedByMe = "내가 공유함"
+filterSharedWithMe = "나와 공유�"
+lastSynced = "마지막 �기화"
+localOnly = "로컬 전용"
+makeCopy = "복사본 만들기"
+owner = "소유�"
+ownerUnknown = "알 수 없�"
+share = "공유"
+shareSelected = "선� 항목 공유"
+sharedByYou = "내가 공유함"
+sharedEditNoticeBody = "서버 버전� � 파�� 대한 편집 권한� 없습니다. 편집 내용� 로컬 복사본으로 저장�니다."
+sharedEditNoticeConfirm = "알겠습니다"
+sharedEditNoticeTitle = "�기 전용 서버 사본"
+sharedWithYou = "나와 공유�"
+sharing = "공유"
+storageState = "저장소"
+synced = "�기화�"
+updateOnServer = "서버� 업��트"
+uploadSelected = "선� 항목 업로드"
+uploadToServer = "서버� 업로드"
 
 [files]
 addFiles = "파� 추가"
@@ -3367,6 +3696,77 @@ title = "PDF �탄화 안내"
 discord = "Discord"
 issues = "GitHub"
 
+[groupSigning.tooltip]
+header = "그룹 서명 정보"
+
+[groupSigning.tooltip.finalization]
+bullet1 = "모든 서명� 지정한 참여� 순서대로 �용�니다"
+bullet2 = "필요 시 �부 서명만으로� 최종 완료할 수 있습니다"
+bullet3 = "최종 완료 후�는 세션� 수정할 수 없습니다"
+description = "모든 참여�가 서명하면(�는 조기 최종 완료를 선�하면) 최종 서명� PDF를 �성할 수 있습니다."
+title = "최종 완료 프로세스"
+
+[groupSigning.tooltip.roles]
+bullet1 = "소유�(본�): 세션 �성, 서명 기본값 구성, 문서 최종 완료"
+bullet2 = "참여�: �신� 서명 �성, ��서 선�, PDF� 배치"
+bullet3 = "참여�는 서명� 표시 여부, 사유, 위치 설정� 변경할 수 없습니다"
+description = "모든 참여�� 대한 서명 표시 설정� 제어합니다."
+title = "참여� 역할"
+
+[groupSigning.tooltip.sequential]
+bullet1 = "첫 번째 참여�가 서명해야 � 번째 참여�가 문서� 접근할 수 있습니다"
+bullet2 = "법� 준수를 위한 올바른 서명 순서를 보장합니다"
+bullet3 = "목��서 드래그하여 참여� 순서를 변경할 수 있습니다"
+description = "지정한 순서대로 참여�가 문서� 서명합니다. � 서명�는 �신� 차례가 �면 알림� 받습니다."
+title = "순차 서명"
+
+[groupSigning.steps]
+back = "뒤로"
+completed = "완료�"
+current = "현재"
+stepLabel = "단계 {{number}}"
+
+[groupSigning.steps.configureDefaults]
+continue = "검토로 계�"
+invisible = "서명� 보�지 않습니다(메타��터만)"
+locationLabel = "위치:"
+preview = "미리보기"
+reasonLabel = "사유:"
+title = "서명 설정 구성"
+visible = "서명� 페�지 {{page}}� 표시�니다"
+
+[groupSigning.steps.review]
+document = "문서"
+dueDate = "마��(선� 사항)"
+dueDatePlaceholder = "마�� 선�..."
+invisible = "보�지 않�(메타��터만)"
+location = "위치:"
+logo = "로고:"
+logoHidden = "로고 없�"
+logoShown = "Stirling PDF 로고 표시�"
+participants = "참여�"
+reason = "사유:"
+send = "서명 요청 보내기"
+signatureSettings = "서명 설정"
+title = "세션 세부 정보 검토"
+titleShort = "검토 � 보내기"
+visibility = "표시 여부:"
+visible = "페�지 {{page}}� 표시"
+participantCount = "참여� {{count}}명� 순서대로 서명합니다"
+
+[groupSigning.steps.selectDocument]
+continue = "참여� 선�으로 계�"
+noFile = "서명 세션� 만들려면 활성 파��서 단� PDF 파�� 선�하세요."
+selectedFile = "선�한 문서"
+title = "문서 선�"
+
+[groupSigning.steps.selectParticipants]
+continue = "서명 설정으로 계�"
+count = "참여� {{count}}명 선��"
+label = "참여� 선�"
+placeholder = "서명할 참여� 선�..."
+title = "참여� 선�"
+
 [getPdfInfo]
 downloadJson = "JSON 다운로드"
 downloads = "다운로드"
@@ -4460,7 +4860,10 @@ zoomOut = "축소"
 
 [viewer]
 cannotPreviewFile = "파�� 미리보기할 수 없습니다"
+disableColorFilter = "색� 필터 비활성화"
 dualPageView = "� 페�지 보기"
+enableDarkFilter = "다� 필터 활성화"
+enableSepiaFilter = "세피아 필터 활성화"
 firstPage = "첫 페�지"
 lastPage = "마지막 페�지"
 nextPage = "다� 페�지"
@@ -4470,6 +4873,22 @@ singlePageView = "단� 페�지 보기"
 unknownFile = "알 수 없는 파�"
 zoomIn = "확대"
 zoomOut = "축소"
+resetZoom = "줌 재설정"
+
+[viewer.nonPdf]
+fileTypeBadge = "{{type}} 파�"
+convertToPdf = "PDF로 변환"
+loading = "로딩 중..."
+emptyFile = "빈 파�"
+csvStats = "{{rows}}행 · {{columns}}열 · {{size}}"
+sortedBy = "정렬 기준: {{column}}"
+columnDefault = "ì—´ {{index}}"
+htmlPreviewWarning = "HTML 미리보기 — 외부 리소스가 로드�지 않� 수 있습니다 · {{size}}"
+htmlPreview = "HTML 미리보기"
+invalidJson = "잘못� JSON — �본 내용� 표시합니다"
+textStats = "{{lines}}줄 · {{size}}"
+lineNumbers = "줄 번호"
+renderMarkdown = "마�다운 렌��"
 
 [viewer.attachments]
 title = "첨부 파�"
@@ -4531,6 +4950,7 @@ toggleAttachments = "첨부 파� 표시/숨기기"
 toggleTheme = "테마 전환"
 language = "언어"
 toggleAnnotations = "주� 가시성 전환"
+toggleLayers = "레�어 전환"
 search = "PDF 검색"
 panMode = "�� 모드"
 applyRedactionsFirst = "먼저 가리기 �용"
@@ -5407,20 +5827,72 @@ title = "파� �쇄"
 2 = "프린터 �름 입력"
 
 [quickAccess]
+access = "액세스"
+accessAddPerson = "사람 추가"
+accessBack = "뒤로"
+accessCopyLink = "�� 복사"
+accessEmail = "�메� 주소"
+accessEmailPlaceholder = "name@company.com"
+accessFileLabel = "파�"
+accessGeneral = "�반 액세스"
+accessInviteTitle = "사람 초대"
+accessOwner = "소유�"
+accessPanel = "문서 액세스"
+accessPeople = "액세스 권한� 있는 사람"
+accessRemove = "제거"
+accessRestricted = "제한�"
+accessRestrictedHint = "액세스 권한� 있는 사람만 열 수 있습니다"
+accessRole = "ì—­í• "
+accessRoleCommenter = "댓글 작성�"
+accessRoleEditor = "편집�"
+accessRoleViewer = "열람�"
+accessSelectedFile = "선�한 파�"
+accessSendInvite = "초대 전송"
+accessTitle = "문서 액세스"
+accessYou = "나"
 account = "계정"
+activeSessions = "진행 중 세션"
+activeTab = "진행 중"
 activity = "활�"
 adminSettings = "관리� 설정"
+allSessions = "모든 세션"
 allTools = "All Tools"
 automate = "��화"
+back = "뒤로"
+certSign = "��서 서명"
+completedSessions = "완료� 세션"
+completedTab = "완료�"
 config = "구성"
+createNew = "새 요청 만들기"
+createSession = "서명 요청 �성"
+dueDate = "마��(선� 사항)"
 files = "파�"
 help = "�움�"
+noActiveSessions = "보류 중� 서명 요청�나 진행 중 세션� 없습니다"
+noCompletedSessions = "완료� 세션� 없습니다"
+noFile = "파�� 선��지 않았습니다"
 read = "�기"
 reader = "리�"
+refresh = "새로 고침"
+requestSignatures = "서명 요청"
+selectSingleFileToRequest = "서명� 요청하려면 단� PDF 파�� 선�하세요"
+selectedFile = "선�한 파�"
+selectUsers = "서명할 사용� 선�"
+selectUsersPlaceholder = "참여� 선�..."
+sendingRequest = "전송 중..."
 settings = "설정"
 showMeAround = "둘러보기 시작"
 sign = "서명"
+signatureRequests = "서명 요청"
+signYourself = "�접 서명"
+newRequest = "새 요청"
 tours = "둘러보기"
+wetSign = "서명 추가"
+filterMine = "내 것"
+filterOverdue = "기한 초과"
+filterSigned = "서명�"
+filterDeclined = "거부�"
+searchDocuments = "문서 검색…"
 
 [quickAccess.helpMenu]
 adminTour = "관리� 둘러보기"
@@ -6050,11 +6522,75 @@ toolNotAvailableLocally = "Stirling-PDF 서버가 오프���며 로컬 백
 expired = "세션� 만료�었습니다. 페�지를 새로 고침하고 다시 시�하세요."
 refreshPage = "페�지 새로 고침"
 
+[sessionManagement.tooltip]
+header = "서명 세션 관리"
+
+[sessionManagement.tooltip.addParticipants]
+bullet1 = "새 참여�는 서명 순서� 마지막� 추가�니다"
+bullet2 = "세션� 최종 완료� 후�는 참여�를 추가할 수 없습니다"
+bullet3 = "� 참여�는 �신� 차례가 �면 알림� 받습니다"
+description = "최종 완료 전�는 언제든지 활성 세션� 참여�를 � 추가할 수 있습니다."
+title = "참여� 추가"
+
+[sessionManagement.tooltip.finalization]
+bullet1 = "<b>전체 최종 완료</b>: 모든 참여�가 서명함"
+bullet2 = "<b>부분 최종 완료</b>: �부 참여�가 아� 서명하지 않�"
+bullet3 = "서명하지 않� 참여�는 최종 문서�서 제외�니다"
+bullet4 = "최종 완료 후 서명� PDF를 활성 파�로 로드할 수 있습니다"
+description = "최종 완료는 모든 서명� 하나� 서명� PDF로 결합합니다. � 작업� ��릴 수 없습니다."
+title = "세션 최종 완료"
+
+[sessionManagement.tooltip.participantRemoval]
+bullet1 = "�미 서명한 참여�는 제거할 수 없습니다"
+bullet2 = "제거� 참여��게는 � �� 알림� 전송�지 않습니다"
+bullet3 = "서명 순서는 ��으로 조정�니다"
+description = "참여�는 서명 전� 세션�서 제거할 수 있습니다."
+title = "참여� 제거"
+
+[sessionManagement.tooltip.signatureOrder]
+bullet1 = "� 서명� PDF� 순차�으로 �용�니다"
+bullet2 = "나중� 서명하는 사람� �전 서명� 볼 수 있습니다"
+bullet3 = "승� 워�플로우와 법� �수 절차� 중요합니다"
+description = "세션 �성 시 지정한 순서가 누가 먼저 서명할지를 결정합니다."
+title = "서명 순서"
+
+[signatureSettings.tooltip]
+header = "서명 모양 설정"
+
+[signatureSettings.tooltip.location]
+bullet1 = "예: \"New York, USA\", \"London Office\", \"Remote\""
+bullet2 = "페�지 위치와는 다릅니다"
+bullet3 = "�부 법� 관할 구역�서 필요할 수 있습니다"
+description = "서명� �용� 지리� 위치(선� 사항). ��서 메타��터� 저장�니다."
+title = "서명 위치"
+
+[signatureSettings.tooltip.logo]
+bullet1 = "서명 � �스트와 함께 표시"
+bullet2 = "PNG, JPG 형� 지�"
+bullet3 = "전문�� ��� 향�"
+description = "브랜딩과 신뢰성� 위해 보�는 서명� 회사 로고를 추가합니다."
+title = "회사 로고"
+
+[signatureSettings.tooltip.reason]
+bullet1 = "예: \"Approval\", \"Contract Agreement\", \"Review Complete\""
+bullet2 = "PDF 서명 �성� 표시"
+bullet3 = "�사 추�과 컴플��언스� 유용"
+description = "문서� 서명하는 �유를 설명하는 선�� �스트입니다. ��서 메타��터� 저장�니다."
+title = "서명 사유"
+
+[signatureSettings.tooltip.visibility]
+bullet1 = "<b>보임</b>: 사용� 지정 모양으로 PDF� 서명� 표시�니다"
+bullet2 = "<b>보�지 않�</b>: 시�� 표시 없� ��서만 임베드�"
+bullet3 = "보�지 않는 서명� 암호학� 검�� 제공합니다"
+description = "문서� 서명� 보�게 할지, 보�지 않게 임베드할지 제어합니다."
+title = "서명 표시 여부"
+
 [settings.configuration]
 advanced = "고급"
 database = "��터베�스"
 endpoints = "엔드��트"
 features = "기능"
+storageSharing = "파� 저장 � 공유"
 systemSettings = "시스템 설정"
 title = "구성"
 
@@ -6332,10 +6868,13 @@ title = "Stirling� 로그�"
 [setup.selfhosted]
 link = "�는 셀프 호스팅 계정� 연결"
 subtitle = "서버 �격 �명� 입력하세요"
+changeServerLocked = "조��서 � 앱� 특정 서버로 제한했습니다"
 switchToLocal = "대신 로컬 �구 사용"
 title = "서버� 로그�"
 
 [setup.selfhosted.unreachable]
+changeServer = "다른 서버� 연결"
+changeServerLocked = "조��서 � 앱� 특정 서버로 제한했습니다"
 continueOffline = "대신 로컬 �구 사용"
 message = "{{url}}� 접�할 수 없습니다. 서버가 실행 중�고 액세스 가능한지 확�하세요."
 retry = "재시�"
@@ -6529,6 +7068,15 @@ saved = "저장�"
 text = "�스트"
 title = "서명 유형"
 
+[signRequest]
+declined = "서명 요청� 거부�었습니다"
+fetchFailed = "서명 요청� 불러오지 못했습니다"
+signed = "문서가 성공�으로 서명�었습니다"
+
+[signSession]
+createFailed = "서명 요청 �성� 실패했습니다"
+created = "서명 요청� 전송했습니다"
+
 [signup]
 accountCreatedSuccessfully = "계정� 성공�으로 �성�었습니다! �제 로그�할 수 있습니다."
 alreadyHaveAccount = "�미 계정� 있으신가요? 로그�"
@@ -6807,6 +7355,106 @@ title = "챕터별 PDF 분할"
 [splitPdfByChapters]
 tags = "분할,챕터,�마�,정리"
 
+[storageShare]
+accessed = "액세스함"
+accessDenied = "� 공유 파�� 액세스할 수 없습니다. 소유��게 공유를 요청하세요."
+accessFailed = "활�� 불러올 수 없습니다."
+accessDeniedBody = "� 파�� 액세스할 수 없습니다. 소유��게 공유를 요청하세요."
+accessDeniedTitle = "액세스 없�"
+accessLimitedCommenter = "댓글 액세스는 곧 제공� 예정입니다. 다운로드가 필요하면 소유��게 편집� 권한� 요청하세요."
+accessLimitedTitle = "제한� 액세스"
+accessLimitedViewer = "� ��는 보기 전용입니다. 다운로드가 필요하면 소유��게 편집� 권한� 요청하세요."
+createdAt = "�성�"
+download = "다운로드"
+downloadFailed = "� 파�� 다운로드할 수 없습니다."
+expiredBody = "� 공유 ��가 유효하지 않거나 만료�었습니다."
+expiredTitle = "�� 만료�"
+goToLogin = "로그�으로 ��"
+loadFailed = "공유� 파�� 열 수 없습니다."
+loading = "공유 ��를 불러오는 중..."
+loginPrompt = "� 공유 파�� 액세스하려면 로그�하세요."
+loginRequired = "로그� 필요"
+openInApp = "Stirling PDF�서 열기"
+ownerLabel = "소유�"
+ownerUnknown = "알 수 없�"
+requiresLogin = "� 공유 파�� 로그�� 필요합니다."
+roleCommenter = "댓글 작성�"
+roleEditor = "편집�"
+roleViewer = "열람�"
+shareHeading = "공유� 파�"
+titleDefault = "공유� 파�"
+tryAgain = "나중� 다시 시�하세요."
+addUser = "추가"
+commenterHint = "댓글 기능� 곧 제공� 예정입니다."
+copied = "��가 �립보드� 복사�었습니다"
+copy = "복사"
+copyFailed = "복사 실패"
+description = "� 파�� 공유 ��를 �성합니다. ��를 가진 로그�한 사용�는 액세스할 수 있습니다."
+downloadsCount = "다운로드: {{count}}"
+emailWarningBody = "�메� 주소로 보입니다. � 사람� 아� Stirling PDF 사용�가 아니�면 파�� 액세스할 수 없습니다."
+emailWarningConfirm = "그래� 공유"
+emailWarningTitle = "�메� 주소"
+errorTitle = "공유 실패"
+failure = "공유 ��를 �성할 수 없습니다. 다시 시�하세요."
+fileLabel = "파�"
+generate = "�� �성"
+generated = "공유 ��가 �성�었습니다"
+hideActivity = "활� 숨기기"
+invalidUsername = "유효한 사용� �름 �는 �메� 주소를 입력하세요."
+lastAccessed = "마지막 액세스"
+linkAccessTitle = "공유 �� 액세스"
+linkLabel = "공유 ��"
+linksDisabled = "공유 ��가 비활성화�어 있습니다."
+linksDisabledBody = "공유 ��는 서버 설정� �해 비활성화�어 있습니다."
+manage = "공유 관리"
+manageDescription = "� 파�� 공유하기 위한 ��를 �성하고 관리합니다."
+manageLoadFailed = "공유 ��를 불러올 수 없습니다."
+manageTitle = "공유 관리"
+noActivity = "아� 활� 없�."
+noLinks = "활성 공유 ��가 아� 없습니다."
+noSharedUsers = "아� 액세스 권한� 부여� 사용�가 없습니다."
+removeLink = "�� 제거"
+removeUser = "제거"
+revokeFailed = "공유 ��를 제거할 수 없습니다."
+revoked = "공유 ��가 제거�었습니다"
+roleLabel = "ì—­í• "
+sharingDisabled = "공유가 비활성화�었습니다."
+sharingDisabledBody = "서버 설정� �해 공유가 비활성화�었습니다."
+sharedUsersTitle = "공유 사용�"
+title = "파� 공유"
+unknownUser = "알 수 없는 사용�"
+userAddFailed = "해당 사용�와 공유할 수 없습니다."
+userAdded = "사용�가 공유 목�� 추가�었습니다."
+usernameLabel = "사용� �름 �는 �메�"
+usernamePlaceholder = "사용� �름 �는 �메�� 입력하세요"
+userRemoveFailed = "해당 사용�를 제거할 수 없습니다."
+userRemoved = "사용�가 공유 목��서 제거�었습니다."
+viewActivity = "활� 보기"
+viewed = "조회�"
+viewsCount = "조회수: {{count}}"
+downloaded = "다운로드�"
+bulkDescription = "선�한 모든 파�� 로그�한 사용�와 공유할 수 있는 하나� ��를 �성합니다."
+bulkTitle = "선�한 파� 공유"
+copyLink = "공유 �� 복사"
+fileCount = "{{count}}개 파� 선��"
+ownerOnly = "소유�만 공유를 관리할 수 있습니다."
+selectSingleFile = "공유를 관리하려면 하나� 파�� 선�하세요."
+
+[storageUpload]
+description = "현재 파�� 서버 저장소� 업로드하여 본�� 액세스할 수 있습니다."
+errorTitle = "업로드 실패"
+failure = "업로드� 실패했습니다. 로그� � 저장소 설정� 확�하세요."
+fileLabel = "파�"
+hint = "공개 ��와 액세스 모드는 서버 설정�서 제어�니다."
+success = "서버� 업로드�었습니다"
+title = "서버로 업로드"
+updateButton = "서버�서 업��트"
+uploadButton = "서버로 업로드"
+bulkDescription = "선�한 파�� 서버 저장소� 업로드합니다."
+bulkTitle = "선�한 파� 업로드"
+fileCount = "{{count}}개 파� 선��"
+more = " +{{count}}개 �"
+
 [storage]
 approximateSize = "대략�� �기"
 fileTooLarge = "파�� 너무 �니다. 파�당 최대 �기:"
@@ -7153,6 +7801,30 @@ title = "PDF 보기/편집"
 [warning]
 tooltipTitle = "경고"
 
+[wetSignature.tooltip]
+header = "서명 �성 방법"
+
+[wetSignature.tooltip.draw]
+bullet1 = "펜 색�과 �께 사용� 지정"
+bullet2 = "만족할 때까지 지우고 다시 그리기"
+bullet3 = "터치 기기(태블릿, 휴대�) 지�"
+description = "마우스 �는 터치스�린� 사용해 �글씨 서명� 만듭니다. 개���고 진정성 있는 서명� �합합니다."
+title = "서명 그리기"
+
+[wetSignature.tooltip.type]
+bullet1 = "여러 글꼴 중�서 선�"
+bullet2 = "�스트 �기와 색� 사용� 지정"
+bullet3 = "표준화� 서명� �합"
+description = "입력한 �스트로 서명� �성합니다. 빠르고 �관�어 비즈니스 문서� �합합니다."
+title = "서명 입력"
+
+[wetSignature.tooltip.upload]
+bullet1 = "PNG, JPG � 기타 �미지 형� 지�"
+bullet2 = "최�� 결과를 위해 투명 배경 권장"
+bullet3 = "서명 �역� 맞�� �미지 �기 조정"
+description = "미리 만든 서명 �미지를 업로드합니다. 스캔한 서명�나 회사 로고가 있는 경우� ���입니다."
+title = "서명 �미지 업로드"
+
 [watermark]
 completed = "워터마�가 추가�었습니다"
 desc = "PDF� �스트 �는 �미지 워터마� 추가"
@@ -7333,6 +8005,7 @@ activeSession = "활성 세션"
 addMembers = "멤버 추가"
 admin = "관리�"
 confirmDelete = "� 사용�를 삭제하시겠습니까? � 작업� ��릴 수 없습니다."
+confirmUnlock = "� 사용� 계정� 잠금 해제하시겠습니까?"
 deleteUser = "사용� 삭제"
 deleteUserError = "사용� 삭제� 실패했습니다"
 deleteUserSuccess = "사용�를 성공�으로 삭제했습니다"
@@ -7341,6 +8014,8 @@ disable = "비활성화"
 disabled = "비활성화�"
 editRole = "역할 편집"
 enable = "활성화"
+locked = "ìž ê¹€"
+lockedBadge = "ìž ê¹€"
 loading = "구성� 불러오는 중..."
 loginRequired = "먼저 로그� 모드를 활성화하세요"
 member = "멤버"
@@ -7350,6 +8025,9 @@ searchMembers = "멤버 검색..."
 status = "�태"
 team = "팀"
 title = "구성�"
+unlockAccount = "계정 잠금 해제"
+unlockUserError = "사용� 계정 잠금 해제� 실패했습니다"
+unlockUserSuccess = "사용� 계정� 성공�으로 잠금 해제�었습니다"
 user = "사용�"
 
 [workspace.people.actions]
diff --git a/frontend/public/locales/ml-ML/translation.toml b/frontend/public/locales/ml-ML/translation.toml
index f8f5c51657..0764a8d5fa 100644
--- a/frontend/public/locales/ml-ML/translation.toml
+++ b/frontend/public/locales/ml-ML/translation.toml
@@ -8,6 +8,7 @@ black = "കറ�പ�പ�"
 blue = "നീല"
 bored = "കാത�തിര�ന�ന� മ�ഷിഞ�ഞോ?"
 cancel = "റദ�ദാക�ക�ക"
+confirm = "സ�ഥിരീകരിക�ക�ക"
 changedCredsMessage = "വിവരങ�ങൾ മാറ�റി!"
 chooseFile = "ഫയൽ തിരഞ�ഞെട�ക�ക�ക"
 close = "അടയ�ക�ക�ക"
@@ -146,6 +147,7 @@ insufficientCredits = "ക�രെഡിറ�റ�കൾ പോരാ. ആവ
 loadingCredits = "ക�രെഡിറ�റ�കൾ പരിശോധിക�ക�ന�ന�..."
 loadingProStatus = "സബ�സ�ക�രിപ�ഷൻ നില പരിശോധിക�ക�ന�ന�..."
 noticeTopUpOrPlan = "ക�രെഡിറ�റ�കൾ മതി വര�ന�നില�ല, ദയവായി ടോപ�പ� അപ� ചെയ�യ�ക അല�ലെങ�കിൽ ഒര� പ�ലാനിലേക�ക� അപ�‌ഗ�രേഡ� ചെയ�യ�ക"
+accessInvite = "ക�ഷണിക�ക�ക"
 
 [account]
 accountSettings = "അക�കൗണ�ട� ക�രമീകരണങ�ങൾ"
@@ -1427,6 +1429,34 @@ title = "പ�രോസസ�സിംഗ�"
 description = "പിശക� റിപ�പോർട�ട� ചെയ�യ�ന�നതിന� മ�മ�പ� പ�രോസസ�സിംഗ� ജോബിനായി കാത�തിരിക�ക�ന�ന പരമാവധി സമയം."
 label = "പ�രോസസ�സിംഗ� ടൈംഔട�ട� (സെക�കൻഡ�‌)"
 
+[admin.settings.storage]
+description = "സർവർ സംഭരണവ�ം പങ�കിടൽ ഓപ�ഷന�കള�ം നിയന�ത�രിക�ക�ക."
+title = "ഫയൽ സംഭരണവ�ം പങ�കിടല�ം"
+
+[admin.settings.storage.enabled]
+description = "ഉപയോക�താക�കൾക�ക� സെർവറിൽ ഫയല�കൾ സംഭരിക�കാൻ അന�വദിക�ക�ക."
+label = "സെർവർ ഫയൽ സംഭരണം പ�രവർത�തനക�ഷമമാക�ക�ക"
+
+[admin.settings.storage.sharing.email]
+description = "ഇമെയിൽ വിലാസങ�ങളിലൂടെ പങ�കിടൽ അന�വദിക�ക�ക."
+label = "ഇമെയിൽ ഷെയറിംഗ� പ�രവർത�തനക�ഷമമാക�ക�ക"
+mailLink = "മെയിൽ ക�രമീകരണങ�ങൾ കോൺഫിഗർ ചെയ�യ�ക"
+mailNote = "മെയിൽ കോൺഫിഗറേഷൻ ആവശ�യമാണ�. "
+
+[admin.settings.storage.sharing.enabled]
+description = "സംഭരിച�ച ഫയല�കൾ ഉപയോക�താക�കൾക�ക� പങ�കിടാൻ അന�വദിക�ക�ക."
+label = "പങ�കിടൽ പ�രവർത�തനക�ഷമമാക�ക�ക"
+
+[admin.settings.storage.sharing.links]
+description = "സൈൻ ഇൻ ചെയ�ത ലിങ�ക�കളിലൂടെ പങ�കിടൽ അന�വദിക�ക�ക."
+frontendUrlLink = "സിസ�റ�റം സജ�ജീകരണങ�ങളിൽ കോൺഫിഗർ ചെയ�യ�ക"
+frontendUrlNote = "ഒര� Frontend URL ആവശ�യമാണ�. "
+label = "ഷെയർ ലിങ�ക�കൾ പ�രവർത�തനക�ഷമമാക�ക�ക"
+
+[admin.settings.storage.signing.enabled]
+description = "ബഹ�-പങ�കാളി ഡോക�യ�മെന�റ� ഒപ�പിടൽ സെഷന�കൾ സൃഷ�ടിക�കാൻ ഉപയോക�താക�കൾക�ക� അന�വാദം നൽക�ക. ഇതിന� സെർവർ ഫയൽ സംഭരണം പ�രവർത�തനക�ഷമമാക�കണം."
+label = "ഗ�രൂപ�പ� സൈൻ ചെയ�യൽ പ�രവർത�തനക�ഷമമാക�ക�ക (ആൽഫ)"
+
 [admin.settings.unsavedChanges]
 cancel = "എഡിറ�റിംഗ� ത�ടര�ക"
 discard = "മാറ�റങ�ങൾ തള�ള�ക"
@@ -2059,7 +2089,19 @@ numbers = "സംഖ�യകൾ/പരിധികൾ: 5, 10-20"
 progressions = "പ�രോഗതികൾ: 3n, 4n+1"
 
 [certSign]
+allSigned = "എല�ലാ പങ�കാളികള�ം ഒപ�പ�വച�ച�. അന�തിമീകരിക�കാൻ തയ�യാറാണ�."
+awaitingSignatures = "ഒപ�പ�കൾ കാത�തിരിക�ക�ന�ന�"
+signatureProgress = "{{signedCount}}/{{totalCount}} ഒപ�പ�കൾ"
 chooseCertificate = "സർട�ടിഫിക�കറ�റ� ഫയൽ തിരഞ�ഞെട�ക�ക�ക"
+declined = "നിരസിച�ച�"
+fetchFailed = "സൈൻ ചെയ�യ�ന�ന ഡാറ�റ ലോഡ� ചെയ�യാൻ കഴിഞ�ഞില�ല"
+finalized = "അന�തിമീകരിച�ച�"
+notified = "കാത�തിരിപ�പിൽ"
+partialNote = "നിലവിലെ ഒപ�പ�കളോടെ നേരത�തൊന�തിമീകരിക�കാവ�ന�നതാണ�. ഒപ�പിടാത�ത പങ�കാളികൾ ഒഴിവാക�കപ�പെട�ം."
+pending = "കാത�തിരിപ�പിൽ"
+readyToFinalize = "അന�തിമീകരിക�കാൻ തയ�യാറാണ�"
+signed = "ഒപ�പിട�ട�"
+viewed = "കണ�ട�"
 chooseJksFile = "JKS ഫയൽ തിരഞ�ഞെട�ക�ക�ക"
 chooseP12File = "PKCS12 ഫയൽ തിരഞ�ഞെട�ക�ക�ക"
 choosePfxFile = "PFX ഫയൽ തിരഞ�ഞെട�ക�ക�ക"
@@ -2082,6 +2124,7 @@ title = "സർട�ടിഫിക�കറ�റ� ഒപ�പിടൽ"
 invisible = "അദൃശ�യ"
 stepTitle = "ഒപ�പിന�റെ ദൃശ�യരൂപം"
 visible = "ദൃശ�യം"
+visibility = "ദൃശ�യത"
 
 [certSign.appearance.options]
 title = "ഒപ�പിന�റെ വിശദാംശങ�ങൾ"
@@ -2188,6 +2231,252 @@ bullet4 = "പരിശോധനയ�ക�കായി ഇച�ഛാന�
 text = "നിങ�ങൾ ഒപ�പ�കൾ പരിശോധിക�ക�മ�പോൾ, അവ സാധ�വാണോ, ആരാണ� ഒപ�പിട�ടത�, എപ�പോൾ ഒപ�പിട�ടത�, ഒപ�പിട�ടതിന� ശേഷം ഡോക�യ�മെന�റിൽ മാറ�റമ�ണ�ടോ എന�നിവ ടൂൾ അറിയിക�ക�ം."
 title = "ഒപ�പ�കൾ പരിശോധന"
 
+[certSign.collab.finalize]
+button = "അന�തിമീകരിച�ച� ഒപ�പിട�ട PDF ലോഡ� ചെയ�യ�ക"
+early = "നിലവില�ള�ള ഒപ�പ�കളോടെ അന�തിമീകരിക�ക�ക"
+
+[certSign.collab.sessionDetail]
+addButton = "പങ�കാളികളെ ചേർക�ക�ക"
+addParticipants = "പങ�കാളികളെ ചേർക�ക�ക"
+addParticipantsError = "പങ�കാളികളെ ചേർക�കാൻ കഴിഞ�ഞില�ല"
+backToList = "സെഷന�കളിലേക�ക� തിരികെ"
+deleteConfirm = "ഉറപ�പാണോ? ഇത� പിൻവലിക�കാൻ കഴിയില�ല."
+deleteError = "സെഷൻ ഇല�ലാതാക�കാൻ കഴിഞ�ഞില�ല"
+deleted = "സെഷൻ ഇല�ലാതാക�കി"
+deleteSession = "സെഷൻ ഇല�ലാതാക�ക�ക"
+dueDate = "അവസാന തീയതി"
+finalizeError = "സെഷൻ അന�തിമീകരിക�കാൻ കഴിഞ�ഞില�ല"
+loadPdfError = "ഒപ�പിട�ട PDF ലോഡ� ചെയ�യാൻ കഴിഞ�ഞില�ല"
+loadSignedPdf = "ഒപ�പിട�ട PDF സജീവ ഫയല�കളിലേക�ക� ലോഡ� ചെയ�യ�ക"
+messageLabel = "സന�ദേശം"
+noAdditionalInfo = "അധിക വിവരങ�ങളൊന�ന�മില�ല"
+owner = "ഉടമ"
+participantRemoved = "പങ�കാളിയെ നീക�കി"
+participants = "പങ�കാളികൾ"
+participantsAdded = "പങ�കാളികളെ വിജയകരമായി ചേർത�ത�"
+removeParticipant = "നീക�ക�ക"
+removeParticipantError = "പങ�കാളിയെ നീക�കാൻ കഴിഞ�ഞില�ല"
+selectUsers = "ഉപയോക�താക�കളെ തിരഞ�ഞെട�ക�ക�ക..."
+sessionInfo = "സെഷൻ വിവരം"
+workbenchTitle = "സെഷൻ മാനേജ�മെന�റ�"
+
+[certSign.collab.signRequest]
+addedToFiles = "ഡോക�യ�മെന�റ� സജീവ ഫയല�കളിൽ ചേർത�ത�"
+addSignature = "നിങ�ങള�ടെ ഒപ�പ� ചേർക�ക�ക"
+addToFiles = "സജീവ ഫയല�കളിലേക�ക� ചേർക�ക�ക"
+advancedSettings = "അഡ�വാൻസ�ഡ� ക�രമീകരണങ�ങൾ"
+backToList = "ഒപ�പ� അഭ�യർത�ഥനകളിലേക�ക� തിരികെ"
+certificateChoice = "ഒപ�പിടാൻ ഒര� സർട�ടിഫിക�കറ�റ� തിരഞ�ഞെട�ക�ക�ക"
+changeSignature = "ഒപ�പ� മാറ�റ�ക"
+clearSignature = "ഒപ�പ� മായ�ക�ക�ക"
+completeAndSign = "പൂർത�തിയാക�കി ഒപ�പിട�ക"
+createNewSignature = "പ�തിയ ഒപ�പ� സൃഷ�ടിക�ക�ക"
+declineButton = "നിരസിക�ക�ക"
+decline = "അഭ�യർത�ഥന നിരസിക�ക�ക"
+deleteSelected = "തിരഞ�ഞെട�ത�ത ഒപ�പ� ഇല�ലാതാക�ക�ക"
+drawSignature = "താഴെ നിങ�ങള�ടെ ഒപ�പ� വരയ�ക�ക�ക"
+dueDate = "അവസാന തീയതി"
+fileTooLarge = "ഫയൽ വല�പ�പം 5MB-ൽ ക�റവായിരിക�കണം"
+fontFamily = "അക�ഷരശൈലി"
+fontSize = "ഫോണ�ട� വല�പ�പം: {{size}}px"
+fontSizePlaceholder = "വല�പ�പം"
+from = "അയച�ചത�"
+invalidCertFile = "ദയവായി P12 അല�ലെങ�കിൽ PFX സർട�ടിഫിക�കറ�റ� ഫയൽ തിരഞ�ഞെട�ക�ക�ക"
+invalidFileType = "ദയവായി ഒര� ഇമേജ� ഫയൽ തിരഞ�ഞെട�ക�ക�ക"
+location = "സ�ഥാനം (�ച�ഛികം)"
+locationPlaceholder = "നിങ�ങൾ �ത� സ�ഥലത�ത� നിന�ന� ഒപ�പിട�ന�ന�?"
+message = "സന�ദേശം"
+noCertificate = "ദയവായി ഒര� സർട�ടിഫിക�കറ�റ� ഫയൽ തിരഞ�ഞെട�ക�ക�ക"
+noSignatures = "PDF-ൽ ക�റഞ�ഞത� ഒര� ഒപ�പെങ�കില�ം ഇട�ക"
+p12File = "P12/PFX സർട�ടിഫിക�കറ�റ� ഫയൽ"
+password = "സർട�ടിഫിക�കറ�റ� പാസ�‌വേഡ�"
+passwordPlaceholder = "പാസ�‌വേഡ� നൽക�ക..."
+penColor = "പെന�നിന�റെ നിറം"
+penSize = "പെന�നിന�റെ വല�പ�പം: {{size}}px"
+placementActive = "PDF-ൽ ക�ലിക�ക� ചെയ�ത� ഇട�ക"
+placeSignatureButton = "PDF-ൽ ഒപ�പ� ഇട�ക"
+reason = "കാരണം (�ച�ഛികം)"
+reasonPlaceholder = "�ത� കാരണത�താലാണ� ഒപ�പിട�ന�നത�?"
+removeImage = "ചിത�രം നീക�ക�ക"
+removeCertFile = "ഫയൽ നീക�ക�ക"
+savedSignatures = "സംരക�ഷിച�ച ഒപ�പ�കൾ"
+selectFile = "ഇമേജ� ഫയൽ തിരഞ�ഞെട�ക�ക�ക"
+selectSignatureTitle = "ഒപ�പ� തിരഞ�ഞെട�ക�ക�ക അല�ലെങ�കിൽ സൃഷ�ടിക�ക�ക"
+signButton = "ഡോക�യ�മെന�റ� ഒപ�പിട�ക"
+signatureInfo = "ഈ ക�രമീകരണങ�ങൾ ഡോക�യ�മെന�റിന�റെ ഉടമ നിർണ�ണയിച�ചവയാണ�"
+signaturePlaced = "പേജിൽ ഒപ�പ� വച�ച�"
+signatureSettings = "ഒപ�പ� ക�രമീകരണങ�ങൾ"
+signatureText = "ഒപ�പ� വാചകം"
+signatureTextPlaceholder = "നിങ�ങള�ടെ പേര� നൽക�ക..."
+signatureTypeLabel = "ഒപ�പിന�റെ തരം"
+signingTitle = "ഒപ�പിടൽ"
+textColor = "വാചകത�തിന�റെ നിറം"
+typeSignature = "ഒപ�പ� സൃഷ�ടിക�കാൻ നിങ�ങള�ടെ പേര� ടൈപ�പ� ചെയ�യ�ക"
+uploadCert = "ഇഷ�ടാന�സൃത സർട�ടിഫിക�കറ�റ�"
+uploadCertDesc = "നിങ�ങള�ടെ സ�വന�തം P12/PFX സർട�ടിഫിക�കറ�റ� ഉപയോഗിക�ക�ക"
+uploadSignature = "നിങ�ങള�ടെ ഒപ�പ� ഇമേജ� അപ�‌ലോഡ� ചെയ�യ�ക"
+usePersonalCert = "പേഴ�‌സണൽ സർട�ടിഫിക�കറ�റ�"
+usePersonalCertDesc = "നിങ�ങള�ടെ അക�കൗണ�ടിന� സ�വയം സൃഷ�ടിച�ചത�"
+useServerCert = "ഓർഗനൈസേഷൻ സർട�ടിഫിക�കറ�റ�"
+useServerCertDesc = "ഓർഗനൈസേഷനിൽ പങ�കിട�ന�ന സർട�ടിഫിക�കറ�റ�"
+workbenchTitle = "ഒപ�പ� അഭ�യർത�ഥന"
+
+[certSign.collab.signRequest.canvas]
+colorPickerTitle = "വരയ�ടെ നിറം തിരഞ�ഞെട�ക�ക�ക"
+continue = "ത�ടര�ക"
+
+[certSign.collab.signRequest.certModal]
+description = "നിങ�ങൾ {{count}} ഒപ�പ�(കൾ) വച�ചിരിക�ക�ന�ന�. ഒപ�പിടൽ പൂർത�തിയാക�കാൻ നിങ�ങള�ടെ സർട�ടിഫിക�കറ�റ� തിരഞ�ഞെട�ക�ക�ക."
+sign = "ഡോക�യ�മെന�റ� ഒപ�പിട�ക"
+certValidating = "സർട�ടിഫിക�കറ�റ� സാധൂകരിക�ക�ന�ന�..."
+certValidUntil = "സർട�ടിഫിക�കറ�റ� {{date}} വരെ സാധ�വാണ�"
+certInvalid = "സർട�ടിഫിക�കറ�റ� അസാധ�വാണ�: {{error}}"
+certInvalidFallback = "അസാധ�വായ സർട�ടിഫിക�കറ�റ�"
+certNetworkError = "സർട�ടിഫിക�കറ�റ� സാധൂകരിക�കാൻ കഴിഞ�ഞില�ല"
+title = "സർട�ടിഫിക�കറ�റ� കോൺഫിഗർ ചെയ�യ�ക"
+
+[certSign.collab.signRequest.image]
+hint = "നിങ�ങള�ടെ ഒപ�പിന�റെ PNG അല�ലെങ�കിൽ JPG ചിത�രം അപ�‌ലോഡ� ചെയ�യ�ക"
+
+[certSign.collab.signRequest.mode]
+move = "ഒപ�പ� നീക�ക�ക"
+place = "ഒപ�പ� ഇട�ക"
+title = "ഒപ�പ� ഇടൽ അല�ലെങ�കിൽ നീക�കൽ മോഡ�"
+
+[certSign.collab.signRequest.modeTabs]
+draw = "വരയ�‌ക�ക�ക"
+image = "അപ�‌ലോഡ� ചെയ�യ�ക"
+text = "ടൈപ�പ� ചെയ�യ�ക"
+
+[certSign.collab.signRequest.placeSignature]
+message = "PDF-ൽ ക�ലിക�ക� ചെയ�ത� നിങ�ങള�ടെ ഒപ�പ� ഇട�ക"
+title = "ഒപ�പ� ഇടൽ"
+
+[certSign.collab.signRequest.preview]
+imageAlt = "തിരഞ�ഞെട�ത�ത ഒപ�പ�"
+missing = "മ�ന��ദൃഷ�യം ഇല�ല"
+textFallback = "ഒപ�പ�"
+
+[certSign.collab.signRequest.saved]
+defaultCanvasLabel = "വരച�ച� സൃഷ�ടിച�ച ഒപ�പ�"
+defaultImageLabel = "അപ�‌ലോഡ� ചെയ�ത ഒപ�പ�"
+defaultLabel = "ഒപ�പ�"
+defaultTextLabel = "ടൈപ�പ� ചെയ�ത ഒപ�പ�"
+delete = "ഒപ�പ� ഇല�ലാതാക�ക�ക"
+none = "സംരക�ഷിച�ച ഒപ�പ�കളൊന�ന�മില�ല"
+
+[certSign.collab.signRequest.signatureType]
+draw = "വരയ�‌ക�ക�ക"
+type = "ടൈപ�പ� ചെയ�യ�ക"
+upload = "അപ�‌ലോഡ� ചെയ�യ�ക"
+
+[certSign.collab.signRequest.steps]
+back = "തിരികെ"
+cancelPlacement = "ഇടൽ റദ�ദാക�ക�ക"
+certificate = "സർട�ടിഫിക�കറ�റ�"
+clickMultipleTimes = "ഒന�നോ അതിലധികമോ ഒപ�പ�കൾ ഇടാൻ PDF-ൽ പല തവണ ക�ലിക�ക� ചെയ�യ�ക. �തെങ�കില�ം ഒപ�പ� നീക�ക�കയോ വല�പ�പമാറ�റ�കയോ ചെയ�യാൻ അത� ഇഴ�ത�ക."
+clickToPlace = "നിങ�ങള�ടെ ഒപ�പ� പ�രത�യക�ഷപ�പെടേണ�ടിടത�ത� PDF-ൽ ക�ലിക�ക� ചെയ�യ�ക."
+continue = "സർട�ടിഫിക�കറ�റ� തിരഞ�ഞെട�പ�പിലേക�ക� ത�ടര�ക"
+continueToPlacement = "ഇടലിലേക�ക� ത�ടര�ക"
+continueToReview = "പരിശോധനയിലേക�ക� ത�ടര�ക"
+createSignature = "ഒപ�പ� സൃഷ�ടിക�ക�ക"
+invisible = "അദൃശ�യമായത�"
+location = "സ�ഥലം:"
+multipleSignatures = "{{count}} ഒപ�പ�കൾ PDF-ലേക�ക� പ�രയോഗിക�കപ�പെട�ം"
+oneSignature = "1 ഒപ�പ� PDF-ലേക�ക� പ�രയോഗിക�കപ�പെട�ം"
+placeOnPdf = "PDF-ൽ ഇട�ക"
+reason = "കാരണം:"
+reviewTitle = "ഒപ�പിട�ന�നതിന� മ�മ�പ� പരിശോധിക�ക�ക"
+signaturePlaced = "പേജ� {{page}}-ൽ ഒപ�പ� വെച�ച�. സ�ഥാനം ക�രമീകരിക�കാൻ വീണ�ട�ം ക�ലിക�ക� ചെയ�യ�കയോ റിവ�യൂവിലേക�ക� ത�ടര�കയോ ചെയ�യാം."
+visible = "ദൃശ�യമായ"
+visibility = "ദൃശ�യത:"
+yourSignatures = "നിങ�ങള�ടെ ഒപ�പ�കൾ ({{count}})"
+
+[certSign.collab.signRequest.text]
+colorLabel = "നിറം"
+fontLabel = "ഫോണ�ട�"
+fontSizeLabel = "വല�പ�പം"
+fontSizePlaceholder = "16"
+label = "ഒപ�പ� വാചകം"
+modalHint = "നിങ�ങള�ടെ പേര� നൽക�ക, ശേഷം PDF-ൽ ഇടാൻ Continue ക�ലിക�ക� ചെയ�യ�ക."
+placeholder = "നിങ�ങള�ടെ പേര� നൽക�ക..."
+
+[certSign.collab.participant]
+certValidating = "സർട�ടിഫിക�കറ�റ� സാധൂകരിക�ക�ന�ന�..."
+certValid = "✓ സർട�ടിഫിക�കറ�റ� സാധ�വാണ�"
+certValidUntil = " {{date}} വരെ"
+certInvalid = "✗ {{error}}"
+certInvalidFallback = "അസാധ�വായ സർട�ടിഫിക�കറ�റ�"
+certNetworkError = "സർട�ടിഫിക�കറ�റ� സാധൂകരിക�കാൻ കഴിഞ�ഞില�ല"
+
+[certSign.collab.addParticipants]
+add = "{{count}} പങ�കാളികളെ ചേർക�ക�ക"
+back = "തിരികെ"
+configureSignatures = "ഒപ�പ� ക�രമീകരണങ�ങൾ കോൺഫിഗർ ചെയ�യ�ക"
+continue = "ഒപ�പ� ക�രമീകരണങ�ങളിലേക�ക� ത�ടര�ക"
+reasonHelp = "ഈ പങ�കാളികൾക�കായി മ�ൻകൂട�ടി ഒര� ഒപ�പിടൽ കാരണം നിശ�ചയിക�ക�ക (�ച�ഛികം, അവർ ഒപ�പിട�മ�പോൾ മാറ�റാം)"
+reasonPlaceholder = "ഉദാ: അംഗീകാരം, പരിശോധന..."
+selectUsers = "ഉപയോക�താക�കളെ തിരഞ�ഞെട�ക�ക�ക"
+
+[certSign.collab.sessionCreation]
+includeSummaryPage = "ഒപ�പ� സംഗ�രഹ പേജ� ഉൾപ�പെട�ത�ത�ക"
+includeSummaryPageHelp = "അവസാനത�തിൽ എല�ലാ ഒപ�പ� മെറ�റാഡേറ�റയ�ം ഉൾപ�പെട�ട ഒര� സംഗ�രഹ പേജ� ചേർക�ക�ം. വ�യക�തിഗത പേജ�കളിലെ ഡിജിറ�റൽ സർട�ടിഫിക�കറ�റ� ഒപ�പ� ബോക�സ�കൾ പ�രദർശിപ�പിക�കില�ല (വെറ�റ� ഒപ�പ�കൾ ബാധിക�കില�ല)."
+
+[certSign.collab.sessionList]
+active = "സജീവം"
+finalized = "അന�തിമീകരിച�ച�"
+
+[certSign.collab.signatureSettings]
+description = "എല�ലാ പങ�കാളികള�ടെയ�ം ഒപ�പിന�റെ രൂപം എങ�ങനെയിരിക�കണമെന�ന� കോൺഫിഗർ ചെയ�യ�ക"
+title = "ഒപ�പിന�റെ രൂപഭാവം"
+
+[certSign.collab.userSelector]
+inviteUsers = "ഉപയോക�താക�കളെ ചേർക�ക�ക"
+loadError = "ഉപയോക�താക�കളെ ലോഡ� ചെയ�യാൻ കഴിഞ�ഞില�ല"
+noTeam = "ടീം ഇല�ല"
+noUsers = "മറ�റ� ഉപയോക�താക�കളെ കണ�ടെത�താനായില�ല."
+placeholder = "ഉപയോക�താക�കളെ തിരഞ�ഞെട�ക�ക�ക..."
+
+[certSign.mobile]
+panelActions = "പ�രവർത�തികൾ"
+panelDocument = "ഡോക�യ�മെന�റ�"
+panelPeople = "വ�യക�തികൾ"
+
+[certSign.sessions]
+deleted = "സെഷൻ ഇല�ലാതാക�കി"
+fetchFailed = "സെഷൻ വിവരങ�ങൾ ലോഡ� ചെയ�യാൻ കഴിഞ�ഞില�ല"
+finalized = "സെഷൻ അന�തിമീകരിച�ച�"
+loaded = "ഒപ�പിട�ട PDF ലോഡ� ചെയ�ത�"
+pdfNotReady = "PDF തയ�യാറായിട�ടില�ല"
+pdfNotReadyDesc = "ഒപ�പിട�ട PDF സൃഷ�ടിച�ച� കൊണ�ടിരിക�ക�ന�ന�. ദയവായി ക�റച�ച� സമയം കഴിഞ�ഞ� വീണ�ട�ം ശ�രമിക�ക�ക."
+
+[certificateChoice.tooltip]
+header = "സർട�ടിഫിക�കറ�റ� തരങ�ങൾ"
+
+[certificateChoice.tooltip.organization]
+bullet1 = "സിസ�റ�റം അഡ�മിൻമാർ നിയന�ത�രിക�ക�ന�ന�"
+bullet2 = "അധികാരപ�പെട�ത�തിയ ഉപയോക�താക�കൾ തമ�മിൽ പങ�കിട�ന�ന�"
+bullet3 = "വ�യക�തിയ�ടേതല�ല, കമ�പനിയ�ടെ �ഡന�റിറ�റിയെ പ�രതിനിധീകരിക�ക�ന�ന�"
+bullet4 = "�റ�റവ�ം നല�ലത�: ഔദ�യോഗിക ഡോക�യ�മെന�റ�കൾ, ടീം ഒപ�പ�കൾ"
+description = "നിങ�ങള�ടെ ഓർഗനൈസേഷൻ നൽക�ന�ന ഒര� ഷെയർഡ� സർട�ടിഫിക�കറ�റ�. കമ�പനി-വ�യാപക ഒപ�പിടൽ അധികാരത�തിന� ഉപയോഗിക�ക�ന�ന�."
+title = "ഓർഗനൈസേഷൻ സർട�ടിഫിക�കറ�റ�"
+
+[certificateChoice.tooltip.personal]
+bullet1 = "ആദ�യം ഉപയോഗിക�ക�മ�പോൾ സ�വയം സൃഷ�ടിക�ക�ന�ന�"
+bullet2 = "നിങ�ങള�ടെ ഉപയോക�തൃ അക�കൗണ�ട�മായി ബന�ധിപ�പിച�ചിരിക�ക�ന�നത�"
+bullet3 = "മറ�റ� ഉപയോക�താക�കൾക�കൊപ�പം പങ�കിടാൻ കഴിയില�ല"
+bullet4 = "�റ�റവ�ം നല�ലത�: വ�യക�തിഗത ഡോക�യ�മെന�റ�കൾ, വ�യക�തിഗത ഉത�തരവാദിത�തം"
+description = "നിങ�ങള�ടെ ഉപയോക�തൃ അക�കൗണ�ടിന� പ�രത�യേകമായി സ�വയം സൃഷ�ടിച�ച സർട�ടിഫിക�കറ�റ�. വ�യക�തിഗത ഒപ�പ�കൾക�ക� അന�യോജ�യം."
+title = "പേഴ�‌സണൽ സർട�ടിഫിക�കറ�റ�"
+
+[certificateChoice.tooltip.upload]
+bullet1 = "P12/PFX ഫയല�ം പാസ�‌വേഡ�ം ആവശ�യമാണ�"
+bullet2 = "ബാഹ�യ Certificate Authorities നൽക�ന�നവയായിരിക�ക�ം"
+bullet3 = "നിയമപരമായ ഡോക�യ�മെന�റ�കൾക�ക� ഉയർന�ന വിശ�വാസനില"
+bullet4 = "�റ�റവ�ം നല�ലത�: നിയമപരമായ കരാറ�കൾ, ബാഹ�യ സാധൂകരണം"
+description = "നിങ�ങള�ടെ സ�വന�തം PKCS#12 സർട�ടിഫിക�കറ�റ� ഫയൽ ഉപയോഗിക�ക�ക. സർട�ടിഫിക�കറ�റ� ഗ�ണങ�ങളിലേയ�ക�ക�ള�ള പൂർണ�ണ നിയന�ത�രണം നൽക�ന�ന�."
+title = "ഇഷ�ടാന�സൃത P12 അപ�‌ലോഡ� ചെയ�യ�ക"
+
 [changeCreds]
 changePassword = "നിങ�ങൾ സ�ഥിര ലോഗിൻ വിവരങ�ങളാണ� ഉപയോഗിക�ക�ന�നത�. ദയവായി ഒര� പ�തിയ പാസ�‌വേഡ� നൽക�ക"
 changeUsername = "നിങ�ങള�ടെ യൂസർനെയിം അപ�‌ഡേറ�റ� ചെയ�യ�ക. അപ�‌ഡേറ�റിന� ശേഷം നിങ�ങൾ ലോഗ� ഔട�ട� ചെയ�യപ�പെട�ം."
@@ -3242,6 +3531,46 @@ totalSelected = "ആകെ തിരഞ�ഞെട�ത�തത�"
 unsupported = "പിന�ത�ണയില�ല"
 unzip = "അൺസിപ�പ�"
 uploadError = "ചില ഫയല�കൾ അപ�‌ലോഡ� ചെയ�യാൻ പരാജയപ�പെട�ട�."
+copyCreated = "പകർപ�പ� ഈ ഉപകരണത�തിൽ സേവ� ചെയ�ത�."
+copyFailed = "ഒര� പകർപ�പ� സൃഷ�ടിക�കാൻ കഴിഞ�ഞില�ല."
+leaveShare = "എന�റെ ലിസ�റ�റിൽ നിന�ന� നീക�കം ചെയ�യ�ക"
+leaveShareFailed = "പങ�കിട�ട ഫയൽ നീക�കാൻ കഴിഞ�ഞില�ല."
+leaveShareSuccess = "നിങ�ങള�ടെ ഷെയർ ചെയ�ത ലിസ�റ�റിൽ നിന�ന� നീക�കി."
+removeBoth = "രണ�ടിടത�ത�നിന�ന�ം നീക�കം ചെയ�യ�ക"
+removeFilePrompt = "ഈ ഫയൽ ഈ ഉപകരണത�തില�ം നിങ�ങള�ടെ സെർവറില�ം സേവ� ചെയ�തിരിക�ക�ന�ന�. �ത� ഇടത�ത� നിന�ന� നീക�കണം?"
+removeFileTitle = "ഫയൽ നീക�ക�ക"
+removeLocalOnly = "ഈ ഉപകരണം മാത�രം"
+removeServerFailed = "സെർവറിൽ നിന�ന� ഫയൽ നീക�കാൻ കഴിഞ�ഞില�ല."
+removeServerOnly = "സെർവർ മാത�രം"
+removeServerOnlyPrompt = "ഈ ഫയൽ നിങ�ങള�ടെ സെർവറിൽ മാത�രം സംഭരിച�ചിരിക�ക�ന�ന�. ഇത� സെർവറിൽ നിന�ന� നീക�കണോ?"
+removeServerSuccess = "സെർവറിൽ നിന�ന� നീക�കി."
+removeSharedPrompt = "ഈ ഫയൽ നിങ�ങള�മായി പങ�കിട�ടതാണ�. ഇത� ഈ ഉപകരണത�തിൽ നിന�നോ നിങ�ങള�ടെ ഷെയർ ചെയ�ത ലിസ�റ�റിൽ നിന�നോ നീക�കാം."
+removeSharedServerOnlyBlockedPrompt = "ഈ ഫയൽ നിങ�ങള�മായി പങ�കിട�ടതാണ�, സെർവറിൽ മാത�രം സംഭരിച�ചിരിക�ക�ന�ന�."
+removeSharedServerOnlyPrompt = "ഈ ഫയൽ നിങ�ങള�മായി പങ�കിട�ടത�ം സെർവറിൽ മാത�രം സംഭരിച�ചത�മാണ�. നിങ�ങള�ടെ ലിസ�റ�റിൽ നിന�ന� നീക�കണോ?"
+changesNotUploaded = "മാറ�റങ�ങൾ അപ�‌ലോഡ� ചെയ�തിട�ടില�ല"
+cloudFile = "ക�ലൗഡ� ഫയൽ"
+filterAll = "എല�ലാം"
+filterLocal = "പ�രാദേശികം"
+filterSharedByMe = "ഞാൻ പങ�കിട�ടത�"
+filterSharedWithMe = "എന�നെക�കൊപ�പം പങ�കിട�ടത�"
+lastSynced = "അവസാനം സിങ�ക� ചെയ�തത�"
+localOnly = "പ�രാദേശികം മാത�രം"
+makeCopy = "ഒര� പകർപ�പ� സൃഷ�ടിക�ക�ക"
+owner = "ഉടമ"
+ownerUnknown = "അജ�ഞാതം"
+share = "പങ�കിട�ക"
+shareSelected = "തിരഞ�ഞെട�ത�തത� പങ�കിട�ക"
+sharedByYou = "നിങ�ങൾ പങ�കിട�ടത�"
+sharedEditNoticeBody = "ഈ ഫയലിന�റെ സെർവർ പതിപ�പിൽ നിങ�ങൾക�ക� എഡിറ�റ� അവകാശമില�ല. നിങ�ങൾ ചെയ�യ�ന�ന മാറ�റങ�ങൾ ഒര� പ�രാദേശിക പകർപ�പായി സേവ� ചെയ�യ�ം."
+sharedEditNoticeConfirm = "മനസ�സിലായി"
+sharedEditNoticeTitle = "വായിക�കാനേ കഴിയൂ എന�ന സെർവർ പകർപ�പ�"
+sharedWithYou = "നിങ�ങള�മായി പങ�കിട�ടത�"
+sharing = "പങ�കിടൽ"
+storageState = "സംഭരണം"
+synced = "സിങ�ക� ചെയ�ത�"
+updateOnServer = "സെർവറിൽ അപ�‌ഡേറ�റ� ചെയ�യ�ക"
+uploadSelected = "തിരഞ�ഞെട�ത�തത� അപ�‌ലോഡ� ചെയ�യ�ക"
+uploadToServer = "സെർവറിലേക�ക� അപ�‌ലോഡ� ചെയ�യ�ക"
 
 [files]
 addFiles = "ഫയല�കൾ ചേർക�ക�ക"
@@ -3367,6 +3696,77 @@ title = "PDF-കൾ ഫ�ലാറ�റൻ ചെയ�യൽ ക�റിച
 discord = "Discord"
 issues = "GitHub"
 
+[groupSigning.tooltip]
+header = "ഗ�രൂപ�പ� സൈൻ ചെയ�യൽ സംബന�ധിച�ച�"
+
+[groupSigning.tooltip.finalization]
+bullet1 = "നിങ�ങൾ നൽകിയിരിക�ക�ന�ന പങ�കാളികള�ടെ ക�രമത�തിൽ എല�ലാ ഒപ�പ�കള�ം പ�രയോഗിക�ക�ം"
+bullet2 = "ആവശ�യമെങ�കിൽ ഭാഗിക ഒപ�പ�കളോടെയ�ം അന�തിമീകരിക�കാം"
+bullet3 = "അന�തിമീകരിച�ചതിന� ശേഷം സെഷൻ മാറ�റാൻ കഴിയില�ല"
+description = "എല�ലാ പങ�കാളികള�ം ഒപ�പിട�ടതിന� ശേഷം (അല�ലെങ�കിൽ നിങ�ങൾ നേരത�തെ അന�തിമീകരിക�കാൻ തിരഞ�ഞെട�ക�ക�മ�പോൾ) അന�തിമ ഒപ�പിട�ട PDF സൃഷ�ടിക�കാം."
+title = "അന�തിമീകരണ പ�രക�രിയ"
+
+[groupSigning.tooltip.roles]
+bullet1 = "ഉടമ (നിങ�ങൾ): സെഷൻ സൃഷ�ടിക�ക�ന�ന�, ഒപ�പ� ഡിഫോൾട�ട�കൾ കോൺഫിഗർ ചെയ�യ�ന�ന�, ഡോക�യ�മെന�റ� അന�തിമീകരിക�ക�ന�ന�"
+bullet2 = "പങ�കാളികൾ: അവര�ടെ ഒപ�പ� സൃഷ�ടിക�ക�ന�ന�, സർട�ടിഫിക�കറ�റ� തിരഞ�ഞെട�ക�ക�ന�ന�, PDF-ൽ ഇട�ന�ന�"
+bullet3 = "പങ�കാളികൾക�ക� ഒപ�പിന�റെ ദൃശ�യത, കാരണമോ, സ�ഥാനമോ മാറ�റാൻ കഴിയില�ല"
+description = "എല�ലാ പങ�കാളികൾക�ക�ം ഒപ�പിന�റെ രൂപഭാവ ക�രമീകരണങ�ങൾ നിങ�ങൾ നിയന�ത�രിക�ക�ന�ന�."
+title = "പങ�കാളികള�ടെ പങ�ക�കൾ"
+
+[groupSigning.tooltip.sequential]
+bullet1 = "ആദ�യത�തെ പങ�കാളി ഒപ�പിട�ന�നതിന� മ�മ�പ� രണ�ടാമത�തവൻക�ക� ഡോക�യ�മെന�റ� ആക�‌സസ� ലഭിക�കില�ല"
+bullet2 = "നിയമാന�സൃത ക�രമം ഉറപ�പാക�ക�ന�ന�"
+bullet3 = "പട�ടികയിൽ ഇഴ�തി നീക�കി പങ�കാളികള�ടെ ക�രമം മാറ�റാം"
+description = "നിങ�ങൾ നിർദ�ദേശിച�ച ക�രമത�തിൽ പങ�കാളികൾ ഡോക�യ�മെന�റിൽ ഒപ�പിട�ം. അവര�ടെ ടേൺ വര�മ�പോൾ ഓരോ ഒപ�പ�വെയ�ക�ക�ന�നവർക�ക�ം അറിയിപ�പ� ലഭിക�ക�ം."
+title = "ക�രമാന�സൃത ഒപ�പിടൽ"
+
+[groupSigning.steps]
+back = "തിരികെ"
+completed = "പൂർത�തിയായി"
+current = "നിലവിലെ"
+stepLabel = "ഘട�ടം {{number}}"
+
+[groupSigning.steps.configureDefaults]
+continue = "പരിശോധനയിലേക�ക� ത�ടര�ക"
+invisible = "ഒപ�പ�കൾ അദൃശ�യമായിരിക�ക�ം (മെറ�റാഡേറ�റ മാത�രം)"
+locationLabel = "സ�ഥലം:"
+preview = "പ�രിവ�യൂ"
+reasonLabel = "കാരണം:"
+title = "ഒപ�പ� ക�രമീകരണങ�ങൾ കോൺഫിഗർ ചെയ�യ�ക"
+visible = "ഒപ�പ�കൾ പേജ� {{page}}-ൽ ദൃശ�യമായിരിക�ക�ം"
+
+[groupSigning.steps.review]
+document = "ഡോക�യ�മെന�റ�"
+dueDate = "അവസാന തീയതി (�ച�ഛികം)"
+dueDatePlaceholder = "അവസാന തീയതി തിരഞ�ഞെട�ക�ക�ക..."
+invisible = "അദൃശ�യമായത� (മെറ�റാഡേറ�റ മാത�രം)"
+location = "സ�ഥലം:"
+logo = "ലോഗോ:"
+logoHidden = "ലോഗോ ഇല�ല"
+logoShown = "Stirling PDF ലോഗോ പ�രദർശിപ�പിക�ക�ം"
+participants = "പങ�കാളികൾ"
+reason = "കാരണം:"
+send = "ഒപ�പ� അഭ�യർത�ഥനകൾ അയയ�ക�ക�ക"
+signatureSettings = "ഒപ�പ� ക�രമീകരണങ�ങൾ"
+title = "സെഷൻ വിശദാംശങ�ങൾ പരിശോധിക�ക�ക"
+titleShort = "പരിശോധിച�ച� അയയ�ക�ക�ക"
+visibility = "ദൃശ�യത:"
+visible = "പേജ� {{page}}-ൽ ദൃശ�യമായി"
+participantCount = "{{count}} പങ�കാളികൾ ക�രമത�തിൽ ഒപ�പിട�ം"
+
+[groupSigning.steps.selectDocument]
+continue = "പങ�കാളികളെ തിരഞ�ഞെട�ക�കലിലേക�ക� ത�ടര�ക"
+noFile = "ഒര� സൈൻ സെഷൻ സൃഷ�ടിക�കാൻ നിങ�ങള�ടെ സജീവ ഫയല�കളിൽ നിന�ന� ഒറ�റ PDF ഫയൽ തിരഞ�ഞെട�ക�ക�ക."
+selectedFile = "തിരഞ�ഞെട�ത�ത ഡോക�യ�മെന�റ�"
+title = "ഡോക�യ�മെന�റ� തിരഞ�ഞെട�ക�ക�ക"
+
+[groupSigning.steps.selectParticipants]
+continue = "ഒപ�പ� ക�രമീകരണങ�ങളിലേക�ക� ത�ടര�ക"
+count = "{{count}} പങ�കാളികളെ തിരഞ�ഞെട�ത�ത�"
+label = "പങ�കാളികളെ തിരഞ�ഞെട�ക�ക�ക"
+placeholder = "ഒപ�പിടാൻ പങ�കാളികളെ തിരഞ�ഞെട�ക�ക�ക..."
+title = "പങ�കാളികളെ തിരഞ�ഞെട�ക�ക�ക"
+
 [getPdfInfo]
 downloadJson = "JSON ഡൗൺലോഡ� ചെയ�യ�ക"
 downloads = "ഡൗൺലോഡ�കൾ"
@@ -4460,7 +4860,10 @@ zoomOut = "സൂം ഔട�ട�"
 
 [viewer]
 cannotPreviewFile = "ഫയൽ പ�രിവ�യൂ ചെയ�യാൻ കഴിയില�ല"
+disableColorFilter = "നിറ ഫിൽട�ടർ പ�രവർത�തനരഹിതമാക�ക�ക"
 dualPageView = "രണ�ട�പേജ� ദൃശ�യം"
+enableDarkFilter = "ഡാർക�ക� ഫിൽട�ടർ പ�രവർത�തനക�ഷമമാക�ക�ക"
+enableSepiaFilter = "സെപിയ ഫിൽട�ടർ പ�രവർത�തനക�ഷമമാക�ക�ക"
 firstPage = "ആദ�യ പേജ�"
 lastPage = "അവസാന പേജ�"
 nextPage = "അട�ത�ത പേജ�"
@@ -4470,6 +4873,22 @@ singlePageView = "ഒറ�റ പേജ� ദൃശ�യം"
 unknownFile = "അപരിചിതമായ ഫയൽ"
 zoomIn = "സൂം ഇൻ"
 zoomOut = "സൂം ഔട�ട�"
+resetZoom = "സൂം റീസെറ�റ� ചെയ�യ�ക"
+
+[viewer.nonPdf]
+fileTypeBadge = "{{type}} ഫയൽ"
+convertToPdf = "PDF ആയി മാറിക�ക�ക"
+loading = "ലോഡ� ചെയ�യ�ന�ന�..."
+emptyFile = "ശൂന�യ ഫയൽ"
+csvStats = "{{rows}} വരികൾ · {{columns}} നിരകൾ · {{size}}"
+sortedBy = "ക�രമീകരിച�ചത�: {{column}}"
+columnDefault = "നിര {{index}}"
+htmlPreviewWarning = "HTML പ�രിവ�യൂ — ബാഹ�യ വിഭവങ�ങൾ ലോഡ� ചെയ�യാതിരിക�കാം · {{size}}"
+htmlPreview = "HTML പ�രിവ�യൂ"
+invalidJson = "അസാധ�വായ JSON — അസംസ�കൃത ഉള�ളടക�കം കാണിക�ക�ന�ന�"
+textStats = "{{lines}} വരികൾ · {{size}}"
+lineNumbers = "വരി നമ�പറ�കൾ"
+renderMarkdown = "മാർക�ക�ഡൗൺ റെൻഡർ ചെയ�യ�ക"
 
 [viewer.attachments]
 title = "അറ�റാച�ച�മെന�റ�കൾ"
@@ -4531,6 +4950,7 @@ toggleAttachments = "അറ�റാച�ച�മെന�റ�കൾ കാ
 toggleTheme = "തീം മാറ�റ�ക"
 language = "ഭാഷ"
 toggleAnnotations = "അനോട�ടേഷൻ ദൃശ�യമാനം മാറ�റ�ക"
+toggleLayers = "ലെയറ�കൾ ഓൺ/ഓഫ� ചെയ�യ�ക"
 search = "PDF തിരയ�ക"
 panMode = "പാൻ മോഡ�"
 applyRedactionsFirst = "ആദ�യം റെഡാക�ഷന�കൾ പ�രയോഗിക�ക�ക"
@@ -5407,20 +5827,72 @@ title = "ഫയൽ അച�ചടിക�ക�ക"
 2 = "പ�രിന�റർ പേര� നൽക�ക"
 
 [quickAccess]
+access = "ആക�സസ�"
+accessAddPerson = "മറ�റൊരാളെ ചേർക�ക�ക"
+accessBack = "തിരികെ"
+accessCopyLink = "ലിങ�ക� പകർത�ത�ക"
+accessEmail = "ഇമെയിൽ വിലാസം"
+accessEmailPlaceholder = "name@company.com"
+accessFileLabel = "ഫയൽ"
+accessGeneral = "സാധാരണ ആക�സസ�"
+accessInviteTitle = "ആള�കളെ ക�ഷണിക�ക�ക"
+accessOwner = "ഉടമ"
+accessPanel = "ഡോക�യ�മെന�റ� ആക�സസ�"
+accessPeople = "ആക�സസ� ഉള�ളവർ"
+accessRemove = "നീക�ക�ക"
+accessRestricted = "പരിമിതപ�പെട�ത�തിയ"
+accessRestrictedHint = "ആക�സസ� ഉള�ളവർക�ക� മാത�രമേ ത�റക�കാൻ കഴിയൂ"
+accessRole = "പങ�ക�"
+accessRoleCommenter = "അഭിപ�രായകർത�താവ�"
+accessRoleEditor = "എഡിറ�റർ"
+accessRoleViewer = "വീക�ഷകൻ"
+accessSelectedFile = "തിരഞ�ഞെട�ത�ത ഫയൽ"
+accessSendInvite = "ക�ഷണം അയയ�ക�ക�ക"
+accessTitle = "ഡോക�യ�മെന�റ� ആക�സസ�"
+accessYou = "നിങ�ങൾ"
 account = "അക�കൗണ�ട�"
+activeSessions = "സജീവ സെഷന�കൾ"
+activeTab = "സജീവം"
 activity = "ചരിത�രം"
 adminSettings = "അഡ�മിൻ സെറ�റിങ�ങ�കൾ"
+allSessions = "എല�ലാ സെഷന�കള�ം"
 allTools = "All Tools"
 automate = "ഓട�ടോ"
+back = "തിരികെ"
+certSign = "സർട�ടിഫിക�കറ�റ� ഒപ�പിടൽ"
+completedSessions = "പൂർത�തിയായ സെഷന�കൾ"
+completedTab = "പൂർത�തിയായി"
 config = "കോൺഫിഗ�"
+createNew = "പ�തിയ അഭ�യർത�ഥന സൃഷ�ടിക�ക�ക"
+createSession = "സൈൻ ചെയ�യൽ അഭ�യർത�ഥന സൃഷ�ടിക�ക�ക"
+dueDate = "അവസാന തീയതി (�ച�ഛികം)"
 files = "ഫയല�കൾ"
 help = "സഹായം"
+noActiveSessions = "പെൻഡിംഗ� ഒപ�പ� അഭ�യർത�ഥനകളോ സജീവ സെഷന�കളോ ഇല�ല"
+noCompletedSessions = "പൂർത�തിയായ സെഷന�കളൊന�ന�മില�ല"
+noFile = "ഫയൽ ഒന�ന�ം തെരഞ�ഞെട�ത�തിട�ടില�ല"
 read = "വായന"
 reader = "റീഡർ"
+refresh = "റിഫ�രെഷ� ചെയ�യ�ക"
+requestSignatures = "ഒപ�പ�കൾ അഭ�യർത�ഥിക�ക�ക"
+selectSingleFileToRequest = "ഒപ�പ�കൾ അഭ�യർത�ഥിക�കാൻ ഒര� PDF ഫയൽ മാത�രം തിരഞ�ഞെട�ക�ക�ക"
+selectedFile = "തിരഞ�ഞെട�ത�ത ഫയൽ"
+selectUsers = "ഒപ�പിടാൻ ഉപയോക�താക�കളെ തിരഞ�ഞെട�ക�ക�ക"
+selectUsersPlaceholder = "പങ�കാളികളെ തിരഞ�ഞെട�ക�ക�ക..."
+sendingRequest = "അയക�ക�ന�ന�..."
 settings = "സെറ�റിങ�ങ�കൾ"
 showMeAround = "എനിക�ക� കാണിച�ച� തരൂ"
 sign = "ഒപ�പിട�ക"
+signatureRequests = "ഒപ�പ� അഭ�യർത�ഥനകൾ"
+signYourself = "നിങ�ങൾ തന�നെ ഒപ�പിട�ക"
+newRequest = "പ�തിയ അഭ�യർത�ഥന"
 tours = "ടൂറ�കൾ"
+wetSign = "ഒപ�പ� ചേർക�ക�ക"
+filterMine = "എന�റെത�"
+filterOverdue = "കാലാവധി കഴിഞ�ഞത�"
+filterSigned = "ഒപ�പിട�ടത�"
+filterDeclined = "നിരസിച�ചത�"
+searchDocuments = "ഡോക�യ�മെന�റ�കൾ തിരയ�ക…"
 
 [quickAccess.helpMenu]
 adminTour = "അഡ�മിൻ പരിചയം"
@@ -6050,11 +6522,75 @@ toolNotAvailableLocally = "നിങ�ങള�ടെ Stirling-PDF സെർവ
 expired = "നിങ�ങള�ടെ സെഷൻ കാലഹരണപ�പെട�ട�. ദയവായി പേജ� പ�ത�ക�കി വീണ�ട�ം ശ�രമിക�ക�ക."
 refreshPage = "പേജ� പ�ത�ക�ക�ക"
 
+[sessionManagement.tooltip]
+header = "സൈൻ ചെയ�യ�ന�ന സെഷന�കള�ടെ മാനേജ�മെന�റ�"
+
+[sessionManagement.tooltip.addParticipants]
+bullet1 = "പ�തിയ പങ�കാളികൾ ഒപ�പിടൽ ക�രമത�തിന�റെ അവസാനത�തിലേക�ക� ചേർക�കപ�പെട�ം"
+bullet2 = "സെഷൻ അന�തിമീകരിച�ചതിന� ശേഷം പങ�കാളികളെ ചേർക�കാൻ കഴിയില�ല"
+bullet3 = "ആര�ടേയ�ം ടേൺ വര�മ�പോൾ ഓരോ പങ�കാളിക�ക�ം ഒര� അറിയിപ�പ� ലഭിക�ക�ം"
+description = "അന�തിമീകരണത�തിന� മ�മ�പ� �ത� സമയത�ത�ം ഒര� സജീവ സെഷനിലേക�ക� കൂട�തൽ പങ�കാളികളെ ചേർക�കാം."
+title = "പങ�കാളികളെ ചേർക�കൽ"
+
+[sessionManagement.tooltip.finalization]
+bullet1 = "<b>പൂർണ�ണ അന�തിമീകരണം</b>: എല�ലാ പങ�കാളികള�ം ഒപ�പിട�ട�"
+bullet2 = "<b>ഭാഗിക അന�തിമീകരണം</b>: ചിലർ ഇനിയ�ം ഒപ�പിട�ടിട�ടില�ല"
+bullet3 = "ഒപ�പിടാത�ത പങ�കാളികളെ അന�തിമ ഡോക�യ�മെന�റിൽ നിന�ന� ഒഴിവാക�ക�ം"
+bullet4 = "അന�തിമീകരിച�ച�കഴിഞ�ഞാൽ, ഒപ�പിട�ട PDF സജീവ ഫയല�കളിലേക�ക� ലോഡ� ചെയ�യാം"
+description = "അന�തിമീകരണം എല�ലാ ഒപ�പ�കള�ം ഒരൊറ�റ ഒപ�പിട�ട PDF-ലേക�ക� സംയോജിപ�പിക�ക�ന�ന�. ഈ നടപടി പിൻവലിക�കാൻ കഴിയില�ല."
+title = "സെഷൻ അന�തിമീകരണം"
+
+[sessionManagement.tooltip.participantRemoval]
+bullet1 = "ഇതിനകം ഒപ�പിട�ട പങ�കാളികളെ നീക�കാൻ കഴിയില�ല"
+bullet2 = "നീക�കിയ പങ�കാളികൾക�ക� ഇനി അറിയിപ�പ�കൾ ലഭിക�കില�ല"
+bullet3 = "ഒപ�പിടൽ ക�രമം സ�വയം ക�രമീകരിക�ക�ം"
+description = "ഒപ�പിട�ന�നതിന� മ�മ�പ� പങ�കാളികളെ സെഷനിൽ നിന�ന� നീക�കാം."
+title = "പങ�കാളികളെ നീക�കൽ"
+
+[sessionManagement.tooltip.signatureOrder]
+bullet1 = "�ത� ഒപ�പ�ം PDF-ൽ ക�രമാന�സൃതമായി പ�രയോഗിക�ക�ം"
+bullet2 = "പിന�നീട� ഒപ�പിട�ന�നവർ മ�ൻപ� ഇടപ�പെട�ട ഒപ�പ�കൾ കാണാം"
+bullet3 = "അംഗീകൃത പ�രവാഹങ�ങൾക�ക�ം നിയമപരമായ കൈമാറ�റ ശൃംഖലകൾക�ക�ം നിർണായകം"
+description = "സെഷൻ സൃഷ�ടിക�ക�മ�പോൾ നിങ�ങൾ വ�യക�തമാക�ക�ന�ന ക�രമമാണ� ആദ�യം ആരാണ� ഒപ�പിട�ക എന�നത� നിർണ�ണയിക�ക�ന�നത�."
+title = "ഒപ�പിടൽ ക�രമം"
+
+[signatureSettings.tooltip]
+header = "ഒപ�പിന�റെ രൂപഭാവ ക�രമീകരണങ�ങൾ"
+
+[signatureSettings.tooltip.location]
+bullet1 = "ഉദാഹരണങ�ങൾ: \"New York, USA\", \"London Office\", \"Remote\""
+bullet2 = "പേജിലെ സ�ഥാനവ�മായി ഇതൊന�ന�മല�ല"
+bullet3 = "ചില നിയമപരമായ അധികാരപ�രദേശങ�ങൾ ആവശ�യപ�പെടാം"
+description = "ഒപ�പ� പ�രയോഗിച�ച ഭൗഗോളിക സ�ഥലം (�ച�ഛികം). സർട�ടിഫിക�കറ�റ� മെറ�റാഡേറ�റയിൽ സേവ� ചെയ�യപ�പെട�ന�ന�."
+title = "ഒപ�പിന�റെ സ�ഥലം"
+
+[signatureSettings.tooltip.logo]
+bullet1 = "ഒപ�പിന�റെയ�ം വാചകത�തിന�റെയ�ം കൂടെ പ�രദർശിപ�പിക�ക�ന�ന�"
+bullet2 = "PNG, JPG ഫോർമാറ�റ�കൾ പിന�ത�ണയ�ക�ക�ന�ന�"
+bullet3 = "തൊഴിൽപരമായ രൂപം മെച�ചപ�പെട�ത�ത�ന�ന�"
+description = "ബ�രാൻഡിംഗിന�ം വിശ�വാസ�യതയ�ക�ക�മായി ദൃശ�യ ഒപ�പ�കളിൽ കമ�പനി ലോഗോ ചേർക�ക�ക."
+title = "കമ�പനി ലോഗോ"
+
+[signatureSettings.tooltip.reason]
+bullet1 = "ഉദാഹരണങ�ങൾ: \"Approval\", \"Contract Agreement\", \"Review Complete\""
+bullet2 = "PDF സിഗ�നേച�ചർ പ�രോപ�പർട�ടീസിൽ ദൃശ�യമാക�ം"
+bullet3 = "ഓഡിറ�റ� ട�രെയില�കൾക�ക�ം നിയമാന�സൃതതയ�ക�ക�ം ഉപകരിക�ക�ന�ന�"
+description = "ഡോക�യ�മെന�റ� ഒപ�പിടാന�ണ�ടായ കാരണം വിശദീകരിക�ക�ന�ന �ച�ഛിക വാചകം. സർട�ടിഫിക�കറ�റ� മെറ�റാഡേറ�റയിൽ സംഭരിക�ക�ന�ന�."
+title = "ഒപ�പിന�റെ കാരണം"
+
+[signatureSettings.tooltip.visibility]
+bullet1 = "<b>ദൃശ�യം</b>: ഇഷ�ടാന�സൃത രൂപഭാവത�തോടെ PDF-ൽ ഒപ�പ� പ�രത�യക�ഷപ�പെട�ം"
+bullet2 = "<b>അദൃശ�യം</b>: ദൃശ�യ അടയാളമില�ലാതെ സർട�ടിഫിക�കറ�റ� എംബെഡ� ചെയ�യ�ം"
+bullet3 = "അദൃശ�യ ഒപ�പ�കൾക�ക�ം ക�രിപ�റ�റോഗ�രാഫിക� സാധൂകരണം ലഭ�യമാണ�"
+description = "ഒപ�പ� ഡോക�യ�മെന�റിൽ ദൃശ�യമാകണോ അദൃശ�യമാകണോ എന�നത� നിയന�ത�രിക�ക�ന�ന�."
+title = "ഒപ�പിന�റെ ദൃശ�യത"
+
 [settings.configuration]
 advanced = "അഡ�വാൻസ�ഡ�"
 database = "ഡാറ�റാബേസ�"
 endpoints = "എൻഡ�പോയിന�റ�കൾ"
 features = "ഫീച�ചറ�കൾ"
+storageSharing = "ഫയൽ സംഭരണവ�ം പങ�കിടല�ം"
 systemSettings = "സിസ�റ�റം ക�രമീകരണങ�ങൾ"
 title = "കോൺഫിഗറേഷൻ"
 
@@ -6332,10 +6868,13 @@ title = "Stirling-യിൽ സൈൻ ഇൻ ചെയ�യ�ക"
 [setup.selfhosted]
 link = "അല�ലെങ�കിൽ സ�വയം-ഹോസ�റ�റ�ചെയ�ത അക�കൗണ�ട�മായി ബന�ധിപ�പിക�ക�ക"
 subtitle = "നിങ�ങള�ടെ സെർവർ ക�രെഡൻഷ�യല�കൾ നൽക�ക"
+changeServerLocked = "നിങ�ങള�ടെ സ�ഥാപനo ഈ ആപ�പ� ഒര� പ�രത�യേക സെർവറിലേക�ക� പരിമിതപ�പെട�ത�തിയിരിക�ക�ന�ന�"
 switchToLocal = "പകരം ലോക�കൽ ഉപകരണങ�ങൾ ഉപയോഗിക�ക�ക"
 title = "സെർവറിൽ സൈൻ ഇൻ ചെയ�യ�ക"
 
 [setup.selfhosted.unreachable]
+changeServer = "മറ�റൊര� സെർവറിലേക�ക� കണക�റ�റ� ചെയ�യ�ക"
+changeServerLocked = "നിങ�ങള�ടെ സ�ഥാപനo ഈ ആപ�പ� ഒര� പ�രത�യേക സെർവറിലേക�ക� പരിമിതപ�പെട�ത�തിയിരിക�ക�ന�ന�"
 continueOffline = "പകരം ലോക�കൽ ഉപകരണങ�ങൾ ഉപയോഗിക�ക�ക"
 message = "{{url}} എത�തിച�ചേരാൻ കഴിഞ�ഞില�ല. സെർവർ പ�രവർത�തിക�ക�കയാണോ ആക�‌സസ� ചെയ�യാനാക�ന�ന�വോയെന�ന� പരിശോധിക�ക�ക."
 retry = "വീണ�ട�ം ശ�രമിക�ക�ക"
@@ -6529,6 +7068,15 @@ saved = "സേവ� ചെയ�തത�"
 text = "വാചകം"
 title = "ഒപ�പ� തരം"
 
+[signRequest]
+declined = "ഒപ�പ� അഭ�യർത�ഥന നിരസിച�ച�"
+fetchFailed = "ഒപ�പ� അഭ�യർത�ഥന ലോഡ� ചെയ�യാൻ കഴിഞ�ഞില�ല"
+signed = "ഡോക�യ�മെന�റ� വിജയകരമായി ഒപ�പിട�ട�"
+
+[signSession]
+createFailed = "സൈൻ ചെയ�യൽ അഭ�യർത�ഥന സൃഷ�ടിക�കാൻ കഴിഞ�ഞില�ല"
+created = "സൈൻ ചെയ�യൽ അഭ�യർത�ഥന അയച�ച�"
+
 [signup]
 accountCreatedSuccessfully = "അക�കൗണ�ട� വിജയകരമായി സൃഷ�ടിച�ച�! നിങ�ങൾക�ക� ഇപ�പോൾ സൈൻ ഇൻ ചെയ�യാം."
 alreadyHaveAccount = "ഇതിനകം അക�കൗണ�ട� ഉണ�ടോ? സൈൻ ഇൻ ചെയ�യ�ക"
@@ -6807,6 +7355,106 @@ title = "അധ�യായങ�ങൾ അന�സരിച�ച� PDF വ
 [splitPdfByChapters]
 tags = "വിഭജിക�ക�ക,അധ�യായങ�ങൾ,ബ�ക�ക�മാർക�ക�കൾ,ക�രമീകരിക�ക�ക"
 
+[storageShare]
+accessed = "ആക�‌സസ� ചെയ�ത�"
+accessDenied = "ഈ ഷെയർ ചെയ�ത ഫയലിലേക�ക� നിങ�ങൾക�ക� ആക�‌സസ� ഇല�ല. ഉടമയോട� ഇത� നിങ�ങള�മായി പങ�കിടാൻ ആവശ�യപ�പെട�ക."
+accessFailed = "പ�രവർത�തനങ�ങൾ ലോഡ� ചെയ�യാൻ കഴിഞ�ഞില�ല."
+accessDeniedBody = "ഈ ഫയലിലേക�ക� നിങ�ങൾക�ക� ആക�‌സസ� ഇല�ല. ഉടമയോട� അത� നിങ�ങള�മായി പങ�കിടാൻ ആവശ�യപ�പെട�ക."
+accessDeniedTitle = "ആക�‌സസ� ഇല�ല"
+accessLimitedCommenter = "അഭിപ�രായ ആക�‌സസ� ഉടൻ ലഭ�യമാക�ം. ഡൗൺലോഡ� വേണമെങ�കിൽ ഉടമയോട� എഡിറ�റർ ആക�‌സസ� അഭ�യർത�ഥിക�ക�ക."
+accessLimitedTitle = "പരിമിത ആക�‌സസ�"
+accessLimitedViewer = "ഈ ലിങ�ക� കാണ�ന�നതിനായി മാത�രമാണ�. ഡൗൺലോഡ� വേണമെങ�കിൽ ഉടമയോട� എഡിറ�റർ ആക�‌സസ� അഭ�യർത�ഥിക�ക�ക."
+createdAt = "സൃഷ�ടിച�ചത�"
+download = "ഡൗൺലോഡ�"
+downloadFailed = "ഈ ഫയൽ ഡൗൺലോഡ� ചെയ�യാൻ കഴിഞ�ഞില�ല."
+expiredBody = "ഈ ഷെയർ ലിങ�ക� അസാധ�വാണ� അല�ലെങ�കിൽ കാലഹരണപ�പെട�ടിരിക�ക�ന�ന�."
+expiredTitle = "ലിങ�കിന�റെ കാലാവധി കഴിഞ�ഞ�"
+goToLogin = "ലോഗിനിലേക�ക� പോക�ക"
+loadFailed = "പങ�കിട�ട ഫയൽ ത�റക�കാൻ കഴിഞ�ഞില�ല."
+loading = "ഷെയർ ലിങ�ക� ലോഡ� ചെയ�യ�ന�ന�..."
+loginPrompt = "ഈ പങ�കിട�ട ഫയലിൽ പ�രവേശിക�കാൻ സൈൻ ഇൻ ചെയ�യ�ക."
+loginRequired = "ലോഗിൻ ആവശ�യമാണ�"
+openInApp = "Stirling PDF-ൽ ത�റക�ക�ക"
+ownerLabel = "ഉടമ"
+ownerUnknown = "അജ�ഞാതം"
+requiresLogin = "ഈ പങ�കിട�ട ഫയലിന� ലോഗിൻ ആവശ�യമാണ�."
+roleCommenter = "അഭിപ�രായകർത�താവ�"
+roleEditor = "എഡിറ�റർ"
+roleViewer = "വീക�ഷകൻ"
+shareHeading = "പങ�കിട�ട ഫയൽ"
+titleDefault = "പങ�കിട�ട ഫയൽ"
+tryAgain = "ദയവായി പിന�നീട� വീണ�ട�ം ശ�രമിക�ക�ക."
+addUser = "ചേർക�ക�ക"
+commenterHint = "അഭിപ�രായ രേഖപ�പെട�ത�തൽ ഉടൻ വര�ന�ന�."
+copied = "ലിങ�ക� ക�ലിപ�പ�‌ബോർഡിലേക�ക� പകർത�തി"
+copy = "പകർത�ത�ക"
+copyFailed = "പകർത�തൽ പരാജയപ�പെട�ട�"
+description = "ഈ ഫയലിനായി ഒര� ഷെയർ ലിങ�ക� സൃഷ�ടിക�ക�ക. ലിങ�ക�ള�ള സൈൻ-ഇൻ ചെയ�ത ഉപയോക�താക�കൾക�ക� ആക�സസ� ലഭിക�ക�ം."
+downloadsCount = "ഡൗൺലോഡ�കൾ: {{count}}"
+emailWarningBody = "ഇത� ഒര� ഇമെയിൽ വിലാസം പോലെയാണ� തോന�ന�ന�നത�. ആ വ�യക�തി Stirling PDF ഉപയോക�താവല�ലെങ�കിൽ, അവർക�ക� ഫയലിൽ പ�രവേശിക�കാൻ കഴിയില�ല."
+emailWarningConfirm = "എങ�കില�ം പങ�കിട�ക"
+emailWarningTitle = "ഇമെയിൽ വിലാസം"
+errorTitle = "പങ�കിടൽ പരാജയപ�പെട�ട�"
+failure = "ഒര� ഷെയർ ലിങ�ക� സൃഷ�ടിക�കാൻ കഴിഞ�ഞില�ല. ദയവായി വീണ�ട�ം ശ�രമിക�ക�ക."
+fileLabel = "ഫയൽ"
+generate = "ലിങ�ക� സൃഷ�ടിക�ക�ക"
+generated = "ഷെയർ ലിങ�ക� സൃഷ�ടിച�ച�"
+hideActivity = "പ�രവർത�തനം മറയ�ക�ക�ക"
+invalidUsername = "സാധ�വായ യൂസർനെയിം അല�ലെങ�കിൽ ഇമെയിൽ വിലാസം നൽക�ക."
+lastAccessed = "അവസാനം ആക�സസ� ചെയ�തത�"
+linkAccessTitle = "ഷെയർ ലിങ�ക� ആക�സസ�"
+linkLabel = "ഷെയർ ലിങ�ക�"
+linksDisabled = "ഷെയർ ലിങ�ക�കൾ പ�രവർത�തനരഹിതമാക�കിയിരിക�ക�ന�ന�."
+linksDisabledBody = "നിങ�ങള�ടെ സെർവർ ക�രമീകരണങ�ങൾ ഷെയർ ലിങ�ക�കൾ പ�രവർത�തനരഹിതമാക�കിയിരിക�ക�ന�ന�."
+manage = "പങ�കിടൽ നിയന�ത�രിക�ക�ക"
+manageDescription = "ഈ ഫയൽ പങ�കിടാൻ ലിങ�ക�കൾ സൃഷ�ടിക�ക�കയ�ം നിയന�ത�രിക�ക�കയ�ം ചെയ�യ�ക."
+manageLoadFailed = "ഷെയർ ലിങ�ക�കൾ ലോഡ� ചെയ�യാൻ കഴിഞ�ഞില�ല."
+manageTitle = "പങ�കിടൽ നിയന�ത�രണം"
+noActivity = "ഇന�ന�വരെ പ�രവർത�തനങ�ങളൊന�ന�മില�ല."
+noLinks = "സജീവ ഷെയർ ലിങ�ക�കളൊന�ന�മില�ല."
+noSharedUsers = "ഇനിയ�ം ആര�ക�ക�ം ആക�സസ� നൽകിയിട�ടില�ല."
+removeLink = "ലിങ�ക� നീക�ക�ക"
+removeUser = "നീക�ക�ക"
+revokeFailed = "ഷെയർ ലിങ�ക� നീക�കാൻ കഴിഞ�ഞില�ല."
+revoked = "പങ�കിടൽ ലിങ�ക� നീക�കം ചെയ�ത�"
+roleLabel = "പങ�ക�"
+sharingDisabled = "പങ�കിടൽ അപ�രാപ�തമാക�കിയിരിക�ക�ന�ന�."
+sharingDisabledBody = "നിങ�ങള�ടെ സെർവർ ക�രമീകരണങ�ങളാൽ പങ�കിടൽ അപ�രാപ�തമാക�കിയിരിക�ക�ന�ന�."
+sharedUsersTitle = "പങ�കിട�ട ഉപയോക�താക�കൾ"
+title = "ഫയൽ പങ�കിട�ക"
+unknownUser = "അജ�ഞാത ഉപയോക�താവ�"
+userAddFailed = "ആ ഉപയോക�താവ�മായി പങ�കിടാൻ കഴിഞ�ഞില�ല."
+userAdded = "പങ�കിട�ട പട�ടികയിൽ ഉപയോക�താവിനെ ചേർത�ത�."
+usernameLabel = "ഉപയോക�തൃനാമം അല�ലെങ�കിൽ ഇമെയിൽ"
+usernamePlaceholder = "ഉപയോക�തൃനാമമോ ഇമെയിലോ നൽക�ക"
+userRemoveFailed = "ആ ഉപയോക�താവിനെ നീക�കം ചെയ�യാൻ കഴിഞ�ഞില�ല."
+userRemoved = "പങ�കിട�ട പട�ടികയിൽ നിന�ന� ഉപയോക�താവിനെ നീക�കി."
+viewActivity = "പ�രവർത�തനങ�ങൾ കാണ�ക"
+viewed = "കണ�ട�"
+viewsCount = "കാഴ�ചകൾ: {{count}}"
+downloaded = "ഡൗൺലോഡ� ചെയ�ത�"
+bulkDescription = "തിരഞ�ഞെട�ത�ത എല�ലാ ഫയല�കള�ം സൈൻ-ഇൻ ചെയ�ത ഉപയോക�താക�കള�മായി പങ�കിടാൻ ഒര� ലിങ�ക� സൃഷ�ടിക�ക�ക."
+bulkTitle = "തിരഞ�ഞെട�ത�ത ഫയല�കൾ പങ�കിട�ക"
+copyLink = "പങ�കിടൽ ലിങ�ക� പകർത�ത�ക"
+fileCount = "{{count}} ഫയല�കൾ തിരഞ�ഞെട�ത�ത�"
+ownerOnly = "ഉടമയ�ക�ക�മാത�രമേ പങ�കിടൽ നിയന�ത�രിക�കാൻ കഴിയൂ."
+selectSingleFile = "പങ�കിടൽ നിയന�ത�രിക�കാൻ ഒറ�റ ഫയൽ തിരഞ�ഞെട�ക�ക�ക."
+
+[storageUpload]
+description = "ഇത� നിലവിലെ ഫയൽ നിങ�ങള�ടേതായ ആക�സസിനായി സെർവർ സ�റ�റോറേജിലേക�ക� അപ�‌ലോഡ� ചെയ�യ�ം."
+errorTitle = "അപ�‌ലോഡ� പരാജയപ�പെട�ട�"
+failure = "അപ�‌ലോഡ� പരാജയപ�പെട�ട�. ദയവായി നിങ�ങള�ടെ ലോഗിൻ, സ�റ�റോറേജ� ക�രമീകരണങ�ങൾ പരിശോധിക�ക�ക."
+fileLabel = "ഫയൽ"
+hint = "പബ�ലിക� ലിങ�ക�കള�ം ആക�സസ� മോഡ�കള�ം നിങ�ങള�ടെ സെർവർ ക�രമീകരണങ�ങൾ നിയന�ത�രിക�ക�ന�ന�."
+success = "സെർവറിലേക�ക� അപ�‌ലോഡ� ചെയ�ത�"
+title = "സെർവറിലേക�ക� അപ�‌ലോഡ� ചെയ�യ�ക"
+updateButton = "സെർവറിൽ അപ�‌ഡേറ�റ� ചെയ�യ�ക"
+uploadButton = "സെർവറിലേക�ക� അപ�‌ലോഡ� ചെയ�യ�ക"
+bulkDescription = "ഇത� തെരഞ�ഞെട�ത�ത ഫയല�കൾ നിങ�ങള�ടെ സെർവർ സ�റ�റോറേജിലേക�ക� അപ�‌ലോഡ� ചെയ�യ�ം."
+bulkTitle = "തിരഞ�ഞെട�ത�ത ഫയല�കൾ അപ�‌ലോഡ� ചെയ�യ�ക"
+fileCount = "{{count}} ഫയല�കൾ തിരഞ�ഞെട�ത�ത�"
+more = " +{{count}} കൂട�തൽ"
+
 [storage]
 approximateSize = "�കദേശ വല�പ�പം"
 fileTooLarge = "ഫയൽ വളരെ വല�താണ�. ഓരോ ഫയലിന�ം അന�വദനീയമായ പരമാവധി വല�പ�പം"
@@ -7153,6 +7801,30 @@ title = "PDF കാണ�ക/തിര�ത�ത�ക"
 [warning]
 tooltipTitle = "മ�ന�നറിയിപ�പ�"
 
+[wetSignature.tooltip]
+header = "കയ�യൊപ�പ� സൃഷ�ടിക�ക�ന�ന രീതികൾ"
+
+[wetSignature.tooltip.draw]
+bullet1 = "പേനയ�ടെ നിറവ�ം കനംവ�ം ഇഷ�ടാന�സരണം മാറ�റ�ക"
+bullet2 = "തൃപ�തിപ�പെട�ന�നത�വരെ മായ�ച�ച� വീണ�ട�ം വരയ�ക�ക�ക"
+bullet3 = "ടച�ച� ഉപകരണങ�ങളിൽ (ടാബ�ലെറ�റ�കൾ, ഫോൺ) പ�രവർത�തിക�ക�ം"
+description = "നിങ�ങള�ടെ മൗസ� അല�ലെങ�കിൽ ടച�ച�‌സ�‌ക�രീൻ ഉപയോഗിച�ച� കൈയെഴ�ത�ത� കൈയ�യൊപ�പ� സൃഷ�ടിക�ക�ക. വ�യക�തിപരവ�ം യഥാർത�ഥവ�മായ കൈയ�യൊപ�പ�കൾക�ക� �റ�റവ�ം ഉചിതം."
+title = "കയ�യൊപ�പ� വരയ�‌ക�ക�ക"
+
+[wetSignature.tooltip.type]
+bullet1 = "പല ഫോണ�ട�കളിൽ നിന�ന� തിരഞ�ഞെട�ക�ക�ക"
+bullet2 = "ടെക�സ�റ�റിന�റെ വലിപ�പവ�ം നിറവ�ം ഇഷ�ടാന�സരണം മാറ�റ�ക"
+bullet3 = "സ�റ�റാൻഡേർഡൈസ�ഡ� കൈയ�യൊപ�പ�കൾക�ക� �റ�റവ�ം അന�യോജ�യം"
+description = "ടൈപ�പ� ചെയ�ത ടെക�സ�റ�റിൽ നിന�ന� ഒര� കൈയ�യൊപ�പ� സൃഷ�ടിക�ക�ക. വേഗത�തില�ം സ�ഥിരതയോടെയ�ം, ബിസിനസ� ഡോക�യ�മെന�റ�കൾക�ക� അന�യോജ�യം."
+title = "കയ�യൊപ�പ� ടൈപ�പ� ചെയ�യ�ക"
+
+[wetSignature.tooltip.upload]
+bullet1 = "PNG, JPG, മറ�റ� ഇമേജ� ഫോർമാറ�റ�കൾ പിന�ത�ണയ�ക�ക�ന�ന�"
+bullet2 = "മികച�ച ഫലങ�ങൾക�കായി സ�താര�യമായ പശ�ചാത�തലം ശ�പാർശ ചെയ�യ�ന�ന�"
+bullet3 = "കയ�യൊപ�പ� പ�രദേശത�തേക�ക� ഒത�ങ�ങ�ന�നതിനായി ചിത�രത�തിന�റെ വലിപ�പം മാറ�റ�ം"
+description = "മ�മ�പേ സൃഷ�ടിച�ച കയ�യൊപ�പ� ചിത�രം അപ�‌ലോഡ� ചെയ�യ�ക. സ�കാൻ ചെയ�ത കൈയ�യൊപ�പോ കമ�പനി ലോഗോവോ ഉണ�ടെങ�കിൽ �റ�റവ�ം അന�യോജ�യം."
+title = "കയ�യൊപ�പിന�റെ ചിത�രം അപ�‌ലോഡ� ചെയ�യ�ക"
+
 [watermark]
 completed = "വാട�ടർമാർക�ക� ചേർത�ത�"
 desc = "PDF ഫയല�കളിൽ ടെക�സ�റ�റ� അല�ലെങ�കിൽ ഇമേജ� വാട�ടർമാർക�ക�കൾ ചേർക�ക�ക"
@@ -7333,6 +8005,7 @@ activeSession = "സജീവ സെഷൻ"
 addMembers = "അംഗങ�ങളെ ചേർക�ക�ക"
 admin = "അഡ�മിൻ"
 confirmDelete = "ഈ ഉപയോക�താവിനെ ഇല�ലാതാക�കണോ? ഇത� തിരിച�ചെട�ക�കാൻ കഴിയില�ല."
+confirmUnlock = "ഈ ഉപയോക�തൃ അക�കൗണ�ട� അൺലോക�ക� ചെയ�യണമെന�ന� നിങ�ങൾക�ക� ഉറപ�പാണോ?"
 deleteUser = "ഉപയോക�താവിനെ ഇല�ലാതാക�ക�ക"
 deleteUserError = "ഉപയോക�താവിനെ ഇല�ലാതാക�കൽ പരാജയപ�പെട�ട�"
 deleteUserSuccess = "ഉപയോക�താവിനെ വിജയകരമായി ഇല�ലാതാക�കി"
@@ -7341,6 +8014,8 @@ disable = "പ�രവർത�തനരഹിതമാക�ക�ക"
 disabled = "പ�രവർത�തനരഹിതം"
 editRole = "റോൾ എഡിറ�റ� ചെയ�യ�ക"
 enable = "പ�രവർത�തനക�ഷമമാക�ക�ക"
+locked = "ലോക�ക�ചെയ�തിരിക�ക�ന�ന�"
+lockedBadge = "ലോക�ക�ചെയ�ത"
 loading = "അംഗങ�ങളെ ലോഡ� ചെയ�യ�ന�ന�..."
 loginRequired = "ആദ�യം ലോഗിൻ മോഡ� പ�രാപ�തമാക�ക�ക"
 member = "à´…à´‚à´—à´‚"
@@ -7350,6 +8025,9 @@ searchMembers = "അംഗങ�ങളെ തിരയ�ക..."
 status = "സ�ഥിതി"
 team = "ടീം"
 title = "മന�ഷ�യർ"
+unlockAccount = "അക�കൗണ�ട� അൺലോക�ക� ചെയ�യ�ക"
+unlockUserError = "ഉപയോക�തൃ അക�കൗണ�ട� അൺലോക�ക� ചെയ�യ�ന�നതിൽ പരാജയപ�പെട�ട�"
+unlockUserSuccess = "ഉപയോക�തൃ അക�കൗണ�ട� വിജയകരമായി അൺലോക�ക� ചെയ�ത�"
 user = "ഉപയോക�താവ�"
 
 [workspace.people.actions]
diff --git a/frontend/public/locales/nl-NL/translation.toml b/frontend/public/locales/nl-NL/translation.toml
index fa4e7a67f7..1be00b3f5c 100644
--- a/frontend/public/locales/nl-NL/translation.toml
+++ b/frontend/public/locales/nl-NL/translation.toml
@@ -8,6 +8,7 @@ black = "Zwart"
 blue = "Blauw"
 bored = "Verveeld met wachten?"
 cancel = "Annuleren"
+confirm = "Bevestigen"
 changedCredsMessage = "Inloggegevens gewijzigd!"
 chooseFile = "Bestand kiezen"
 close = "Sluiten"
@@ -146,6 +147,7 @@ insufficientCredits = "Onvoldoende credits. Vereist: {{requiredCredits}}, Beschi
 loadingCredits = "Credits controleren..."
 loadingProStatus = "Abonnementsstatus controleren..."
 noticeTopUpOrPlan = "Onvoldoende credits, vul aan of upgrade naar een abonnement"
+accessInvite = "Uitnodigen"
 
 [account]
 accountSettings = "Account instellingen"
@@ -1427,6 +1429,34 @@ title = "Processing"
 description = "Maximum time to wait for a processing job before reporting an error."
 label = "Processing Timeout (seconds)"
 
+[admin.settings.storage]
+description = "Serveropslag en deelopties beheren."
+title = "Bestandsopslag en delen"
+
+[admin.settings.storage.enabled]
+description = "Gebruikers toestaan bestanden op de server op te slaan."
+label = "Serverbestandsopslag inschakelen"
+
+[admin.settings.storage.sharing.email]
+description = "Delen met e-mailadressen toestaan."
+label = "E-mail delen inschakelen"
+mailLink = "E-mailinstellingen configureren"
+mailNote = "Vereist e-mailconfiguratie. "
+
+[admin.settings.storage.sharing.enabled]
+description = "Gebruikers toestaan opgeslagen bestanden te delen."
+label = "Delen inschakelen"
+
+[admin.settings.storage.sharing.links]
+description = "Delen via aangemelde links toestaan."
+frontendUrlLink = "Configureren in Systeeminstellingen"
+frontendUrlNote = "Vereist een Frontend URL. "
+label = "Koppelingen voor delen inschakelen"
+
+[admin.settings.storage.signing.enabled]
+description = "Gebruikers toestaan ondertekeningssessies met meerdere deelnemers te maken. Vereist dat serverbestandsopslag is ingeschakeld."
+label = "Groepsondertekenen inschakelen (Alpha)"
+
 [admin.settings.unsavedChanges]
 cancel = "Verder bewerken"
 discard = "Wijzigingen verwerpen"
@@ -2059,7 +2089,19 @@ numbers = "Cijfers/reeksen: 5, 10-20"
 progressions = "Voortgangen: 3n, 4n+1"
 
 [certSign]
+allSigned = "Alle deelnemers hebben getekend. Klaar om te finaliseren."
+awaitingSignatures = "In afwachting van handtekeningen"
+signatureProgress = "{{signedCount}}/{{totalCount}} handtekeningen"
 chooseCertificate = "Certificaatbestand kiezen"
+declined = "Geweigerd"
+fetchFailed = "Ondertekeningsgegevens laden mislukt"
+finalized = "Gefinaliseerd"
+notified = "In afwachting"
+partialNote = "U kunt vroegtijdig finaliseren met de huidige handtekeningen. Niet-ondertekende deelnemers worden uitgesloten."
+pending = "In afwachting"
+readyToFinalize = "Klaar om te finaliseren"
+signed = "Ondertekend"
+viewed = "Bekeken"
 chooseJksFile = "JKS-bestand kiezen"
 chooseP12File = "PKCS12-bestand kiezen"
 choosePfxFile = "PFX-bestand kiezen"
@@ -2082,6 +2124,7 @@ title = "Certificaat ondertekening"
 invisible = "Onzichtbaar"
 stepTitle = "Weergave van handtekening"
 visible = "Zichtbaar"
+visibility = "Zichtbaarheid"
 
 [certSign.appearance.options]
 title = "Handtekeningdetails"
@@ -2188,6 +2231,252 @@ bullet4 = "Kan aangepaste certificaten gebruiken voor verificatie"
 text = "Wanneer u handtekeningen controleert, geeft de tool aan of ze geldig zijn, wie het document heeft ondertekend, wanneer het is ondertekend en of het document na ondertekening is gewijzigd."
 title = "Handtekeningen controleren"
 
+[certSign.collab.finalize]
+button = "Finaliseren en ondertekende PDF laden"
+early = "Finaliseren met huidige handtekeningen"
+
+[certSign.collab.sessionDetail]
+addButton = "Deelnemers toevoegen"
+addParticipants = "Deelnemers toevoegen"
+addParticipantsError = "Deelnemers toevoegen mislukt"
+backToList = "Terug naar sessies"
+deleteConfirm = "Weet u het zeker? Dit kan niet ongedaan worden gemaakt."
+deleteError = "Sessie verwijderen mislukt"
+deleted = "Sessie verwijderd"
+deleteSession = "Sessie verwijderen"
+dueDate = "Vervaldatum"
+finalizeError = "Sessie finaliseren mislukt"
+loadPdfError = "Ondertekende PDF laden mislukt"
+loadSignedPdf = "Ondertekende PDF laden in actieve bestanden"
+messageLabel = "Bericht"
+noAdditionalInfo = "Geen aanvullende informatie"
+owner = "Eigenaar"
+participantRemoved = "Deelnemer verwijderd"
+participants = "Deelnemers"
+participantsAdded = "Deelnemers succesvol toegevoegd"
+removeParticipant = "Verwijderen"
+removeParticipantError = "Deelnemer verwijderen mislukt"
+selectUsers = "Gebruikers selecteren..."
+sessionInfo = "Sessie-informatie"
+workbenchTitle = "Sessiebeheer"
+
+[certSign.collab.signRequest]
+addedToFiles = "Document toegevoegd aan actieve bestanden"
+addSignature = "Uw handtekening toevoegen"
+addToFiles = "Toevoegen aan actieve bestanden"
+advancedSettings = "Geavanceerde instellingen"
+backToList = "Terug naar ondertekeningsverzoeken"
+certificateChoice = "Selecteer een certificaat om mee te ondertekenen"
+changeSignature = "Handtekening wijzigen"
+clearSignature = "Handtekening wissen"
+completeAndSign = "Voltooien en ondertekenen"
+createNewSignature = "Nieuwe handtekening maken"
+declineButton = "Weigeren"
+decline = "Verzoek weigeren"
+deleteSelected = "Geselecteerde handtekening verwijderen"
+drawSignature = "Teken hieronder uw handtekening"
+dueDate = "Vervaldatum"
+fileTooLarge = "Bestandsgrootte moet kleiner zijn dan 5MB"
+fontFamily = "Lettertype"
+fontSize = "Lettergrootte: {{size}}px"
+fontSizePlaceholder = "Grootte"
+from = "Van"
+invalidCertFile = "Selecteer een P12- of PFX-certificaatbestand"
+invalidFileType = "Selecteer een afbeeldingsbestand"
+location = "Locatie (optioneel)"
+locationPlaceholder = "Vanwaar ondertekent u?"
+message = "Bericht"
+noCertificate = "Selecteer een certificaatbestand"
+noSignatures = "Plaats ten minste één handtekening op de PDF"
+p12File = "P12/PFX-certificaatbestand"
+password = "Certificaatwachtwoord"
+passwordPlaceholder = "Voer wachtwoord in..."
+penColor = "Penkleur"
+penSize = "Penmaat: {{size}}px"
+placementActive = "Klik op de PDF om te plaatsen"
+placeSignatureButton = "Handtekening op PDF plaatsen"
+reason = "Reden (optioneel)"
+reasonPlaceholder = "Waarom ondertekent u?"
+removeImage = "Afbeelding verwijderen"
+removeCertFile = "Bestand verwijderen"
+savedSignatures = "Opgeslagen handtekeningen"
+selectFile = "Afbeeldingsbestand selecteren"
+selectSignatureTitle = "Handtekening selecteren of maken"
+signButton = "Document ondertekenen"
+signatureInfo = "Deze instellingen zijn geconfigureerd door de documenteigenaar"
+signaturePlaced = "Handtekening geplaatst op pagina"
+signatureSettings = "Handtekeninginstellingen"
+signatureText = "Handtekeningtekst"
+signatureTextPlaceholder = "Voer uw naam in..."
+signatureTypeLabel = "Handtekeningtype"
+signingTitle = "Ondertekenen"
+textColor = "Tekstkleur"
+typeSignature = "Typ uw naam om een handtekening te maken"
+uploadCert = "Aangepast certificaat"
+uploadCertDesc = "Gebruik uw eigen P12/PFX-certificaat"
+uploadSignature = "Upload uw handtekeningafbeelding"
+usePersonalCert = "Persoonlijk certificaat"
+usePersonalCertDesc = "Automatisch gegenereerd voor uw account"
+useServerCert = "Organisatiecertificaat"
+useServerCertDesc = "Gedeeld organisatiecertificaat"
+workbenchTitle = "Ondertekeningsverzoek"
+
+[certSign.collab.signRequest.canvas]
+colorPickerTitle = "Kies lijnkleur"
+continue = "Doorgaan"
+
+[certSign.collab.signRequest.certModal]
+description = "U hebt {{count}} handtekening(en) geplaatst. Kies uw certificaat om het ondertekenen te voltooien."
+sign = "Document ondertekenen"
+certValidating = "Certificaat wordt gevalideerd..."
+certValidUntil = "Certificaat geldig tot {{date}}"
+certInvalid = "Certificaat ongeldig: {{error}}"
+certInvalidFallback = "Ongeldig certificaat"
+certNetworkError = "Certificaat kon niet worden gevalideerd"
+title = "Certificaat configureren"
+
+[certSign.collab.signRequest.image]
+hint = "Upload een PNG- of JPG-afbeelding van uw handtekening"
+
+[certSign.collab.signRequest.mode]
+move = "Handtekening verplaatsen"
+place = "Handtekening plaatsen"
+title = "Modus ondertekenen of verplaatsen"
+
+[certSign.collab.signRequest.modeTabs]
+draw = "Tekenen"
+image = "Uploaden"
+text = "Typen"
+
+[certSign.collab.signRequest.placeSignature]
+message = "Klik op de PDF om uw handtekening te plaatsen"
+title = "Handtekening plaatsen"
+
+[certSign.collab.signRequest.preview]
+imageAlt = "Geselecteerde handtekening"
+missing = "Geen voorbeeld"
+textFallback = "Handtekening"
+
+[certSign.collab.signRequest.saved]
+defaultCanvasLabel = "Getekende handtekening"
+defaultImageLabel = "Geüploade handtekening"
+defaultLabel = "Handtekening"
+defaultTextLabel = "Getypte handtekening"
+delete = "Handtekening verwijderen"
+none = "Geen opgeslagen handtekeningen"
+
+[certSign.collab.signRequest.signatureType]
+draw = "Tekenen"
+type = "Typen"
+upload = "Uploaden"
+
+[certSign.collab.signRequest.steps]
+back = "Terug"
+cancelPlacement = "Plaatsing annuleren"
+certificate = "Certificaat"
+clickMultipleTimes = "Klik meerdere keren op de PDF om handtekeningen te plaatsen. Sleep een handtekening om te verplaatsen of te schalen."
+clickToPlace = "Klik op de PDF waar u uw handtekening wilt laten verschijnen."
+continue = "Doorgaan naar certificaatkeuze"
+continueToPlacement = "Doorgaan naar plaatsing"
+continueToReview = "Doorgaan naar controle"
+createSignature = "Handtekening maken"
+invisible = "Onzichtbaar"
+location = "Locatie:"
+multipleSignatures = "{{count}} handtekeningen worden toegepast op de PDF"
+oneSignature = "1 handtekening wordt toegepast op de PDF"
+placeOnPdf = "Plaatsen op PDF"
+reason = "Reden:"
+reviewTitle = "Controleren vóór ondertekenen"
+signaturePlaced = "Handtekening geplaatst op pagina {{page}}. U kunt de positie aanpassen door opnieuw te klikken of doorgaan naar controle."
+visible = "Zichtbaar"
+visibility = "Zichtbaarheid:"
+yourSignatures = "Uw handtekeningen ({{count}})"
+
+[certSign.collab.signRequest.text]
+colorLabel = "Kleur"
+fontLabel = "Lettertype"
+fontSizeLabel = "Grootte"
+fontSizePlaceholder = "16"
+label = "Handtekeningtekst"
+modalHint = "Voer uw naam in en klik vervolgens op Doorgaan om deze op de PDF te plaatsen."
+placeholder = "Voer uw naam in..."
+
+[certSign.collab.participant]
+certValidating = "Certificaat wordt gevalideerd..."
+certValid = "✓ Certificaat geldig"
+certValidUntil = " tot {{date}}"
+certInvalid = "✗ {{error}}"
+certInvalidFallback = "Ongeldig certificaat"
+certNetworkError = "Certificaat kon niet worden gevalideerd"
+
+[certSign.collab.addParticipants]
+add = "{{count}} deelnemer(s) toevoegen"
+back = "Terug"
+configureSignatures = "Handtekeninginstellingen configureren"
+continue = "Doorgaan naar handtekeninginstellingen"
+reasonHelp = "Stel vooraf een ondertekeningsreden in voor deze deelnemers (optioneel; ze kunnen dit aanpassen bij het ondertekenen)"
+reasonPlaceholder = "bijv. Goedkeuring, Review..."
+selectUsers = "Gebruikers selecteren"
+
+[certSign.collab.sessionCreation]
+includeSummaryPage = "Pagina met handtekeningoverzicht opnemen"
+includeSummaryPageHelp = "Aan het einde wordt een overzichtspagina toegevoegd met alle handtekeningmetadata. De digitale certificaathandtekeningvakken op afzonderlijke pagina's worden onderdrukt (natte handtekeningen blijven onaangetast)."
+
+[certSign.collab.sessionList]
+active = "Actief"
+finalized = "Gefinaliseerd"
+
+[certSign.collab.signatureSettings]
+description = "Configureer hoe handtekeningen voor alle deelnemers worden weergegeven"
+title = "Weergave van handtekening"
+
+[certSign.collab.userSelector]
+inviteUsers = "Gebruikers toevoegen"
+loadError = "Gebruikers laden mislukt"
+noTeam = "Geen team"
+noUsers = "Geen andere gebruikers gevonden."
+placeholder = "Gebruikers selecteren..."
+
+[certSign.mobile]
+panelActions = "Acties"
+panelDocument = "Document"
+panelPeople = "Personen"
+
+[certSign.sessions]
+deleted = "Sessie verwijderd"
+fetchFailed = "Sessiegegevens laden mislukt"
+finalized = "Sessie gefinaliseerd"
+loaded = "Ondertekende PDF geladen"
+pdfNotReady = "PDF niet gereed"
+pdfNotReadyDesc = "De ondertekende PDF wordt gegenereerd. Probeer het zo meteen opnieuw."
+
+[certificateChoice.tooltip]
+header = "Certificaattypen"
+
+[certificateChoice.tooltip.organization]
+bullet1 = "Beheerd door systeembeheerders"
+bullet2 = "Gedeeld met geautoriseerde gebruikers"
+bullet3 = "Vertegenwoordigt bedrijfsidentiteit, niet individueel"
+bullet4 = "Beste voor: Officiële documenten, teamhandtekeningen"
+description = "Een gedeeld certificaat dat door uw organisatie wordt geleverd. Gebruikt voor organisatiebrede ondertekeningsbevoegdheid."
+title = "Organisatiecertificaat"
+
+[certificateChoice.tooltip.personal]
+bullet1 = "Automatisch gegenereerd bij eerste gebruik"
+bullet2 = "Gekoppeld aan uw gebruikersaccount"
+bullet3 = "Kan niet met andere gebruikers worden gedeeld"
+bullet4 = "Beste voor: Persoonlijke documenten, individuele verantwoordelijkheid"
+description = "Een automatisch gegenereerd certificaat dat uniek is voor uw gebruikersaccount. Geschikt voor individuele handtekeningen."
+title = "Persoonlijk certificaat"
+
+[certificateChoice.tooltip.upload]
+bullet1 = "Vereist P12/PFX-bestand en wachtwoord"
+bullet2 = "Kan worden uitgegeven door externe certificaatautoriteiten"
+bullet3 = "Hoger vertrouwensniveau voor juridische documenten"
+bullet4 = "Beste voor: Juridisch bindende contracten, externe validatie"
+description = "Gebruik uw eigen PKCS#12-certificaatbestand. Biedt volledige controle over certificaateigenschappen."
+title = "Aangepaste P12 uploaden"
+
 [changeCreds]
 changePassword = "U gebruikt de standaard inloggegevens. Voer alstublieft een nieuw wachtwoord in"
 changeUsername = "Werk uw gebruikersnaam bij. U wordt uitgelogd na het bijwerken."
@@ -3242,6 +3531,46 @@ totalSelected = "Totaal geselecteerd"
 unsupported = "Niet ondersteund"
 unzip = "Uitpakken"
 uploadError = "Uploaden van sommige bestanden is mislukt."
+copyCreated = "Kopie opgeslagen op dit apparaat."
+copyFailed = "Kopie kon niet worden gemaakt."
+leaveShare = "Verwijderen uit mijn lijst"
+leaveShareFailed = "Het gedeelde bestand kon niet worden verwijderd."
+leaveShareSuccess = "Verwijderd uit uw gedeelde lijst."
+removeBoth = "Uit beide verwijderen"
+removeFilePrompt = "Dit bestand is opgeslagen op dit apparaat en op uw server. Van waar wilt u het verwijderen?"
+removeFileTitle = "Bestand verwijderen"
+removeLocalOnly = "Alleen dit apparaat"
+removeServerFailed = "Het bestand kon niet van de server worden verwijderd."
+removeServerOnly = "Alleen server"
+removeServerOnlyPrompt = "Dit bestand is alleen op uw server opgeslagen. Wilt u het van de server verwijderen?"
+removeServerSuccess = "Van server verwijderd."
+removeSharedPrompt = "Dit bestand is met u gedeeld. U kunt het verwijderen van dit apparaat of uit uw gedeelde lijst."
+removeSharedServerOnlyBlockedPrompt = "Dit bestand is met u gedeeld en alleen op de server opgeslagen."
+removeSharedServerOnlyPrompt = "Dit bestand is met u gedeeld en alleen op de server opgeslagen. Verwijderen uit uw lijst?"
+changesNotUploaded = "Wijzigingen niet geüpload"
+cloudFile = "Cloudbestand"
+filterAll = "Alles"
+filterLocal = "Lokaal"
+filterSharedByMe = "Door mij gedeeld"
+filterSharedWithMe = "Met mij gedeeld"
+lastSynced = "Laatst gesynchroniseerd"
+localOnly = "Alleen lokaal"
+makeCopy = "Kopie maken"
+owner = "Eigenaar"
+ownerUnknown = "Onbekend"
+share = "Delen"
+shareSelected = "Geselecteerde delen"
+sharedByYou = "Door u gedeeld"
+sharedEditNoticeBody = "U hebt geen bewerkingsrechten op de serverversie van dit bestand. Eventuele bewerkingen worden als lokale kopie opgeslagen."
+sharedEditNoticeConfirm = "Begrepen"
+sharedEditNoticeTitle = "Alleen-lezen serverkopie"
+sharedWithYou = "Met u gedeeld"
+sharing = "Delen"
+storageState = "Opslag"
+synced = "Gesynchroniseerd"
+updateOnServer = "Bijwerken op server"
+uploadSelected = "Geselecteerde uploaden"
+uploadToServer = "Uploaden naar server"
 
 [files]
 addFiles = "Bestanden toevoegen"
@@ -3367,6 +3696,77 @@ title = "Over PDF's afvlakken"
 discord = "Discord"
 issues = "GitHub"
 
+[groupSigning.tooltip]
+header = "Over groepsondertekenen"
+
+[groupSigning.tooltip.finalization]
+bullet1 = "Alle handtekeningen worden toegepast in de door u opgegeven deelnemersvolgorde"
+bullet2 = "U kunt indien nodig met gedeeltelijke handtekeningen finaliseren"
+bullet3 = "Na finalisatie kan de sessie niet meer worden gewijzigd"
+description = "Zodra alle deelnemers hebben getekend (of u ervoor kiest eerder te finaliseren), kunt u de definitieve ondertekende PDF genereren."
+title = "Finalisatieproces"
+
+[groupSigning.tooltip.roles]
+bullet1 = "Eigenaar (u): Maakt sessie, configureert standaard handtekeningen, finaliseert document"
+bullet2 = "Deelnemers: Maken hun handtekening, kiezen certificaat, plaatsen op PDF"
+bullet3 = "Deelnemers kunnen zichtbaarheid, reden of locatie-instellingen niet wijzigen"
+description = "U beheert de instellingen voor de handtekeningweergave voor alle deelnemers."
+title = "Rollen van deelnemers"
+
+[groupSigning.tooltip.sequential]
+bullet1 = "Eerste deelnemer moet tekenen voordat de tweede toegang krijgt tot het document"
+bullet2 = "Zorgt voor juiste ondertekeningsvolgorde voor juridische naleving"
+bullet3 = "U kunt deelnemers herschikken door ze in de lijst te slepen"
+description = "Deelnemers ondertekenen documenten in de door u opgegeven volgorde. Elke ondertekenaar ontvangt een melding wanneer hij/zij aan de beurt is."
+title = "Sequentieel ondertekenen"
+
+[groupSigning.steps]
+back = "Terug"
+completed = "Voltooid"
+current = "Huidig"
+stepLabel = "Stap {{number}}"
+
+[groupSigning.steps.configureDefaults]
+continue = "Doorgaan naar controle"
+invisible = "Handtekeningen zijn onzichtbaar (alleen metadata)"
+locationLabel = "Locatie:"
+preview = "Voorbeeld"
+reasonLabel = "Reden:"
+title = "Handtekeninginstellingen configureren"
+visible = "Handtekeningen zijn zichtbaar op pagina {{page}}"
+
+[groupSigning.steps.review]
+document = "Document"
+dueDate = "Vervaldatum (optioneel)"
+dueDatePlaceholder = "Vervaldatum selecteren..."
+invisible = "Onzichtbaar (alleen metadata)"
+location = "Locatie:"
+logo = "Logo:"
+logoHidden = "Geen logo"
+logoShown = "Stirling PDF-logo weergegeven"
+participants = "Deelnemers"
+reason = "Reden:"
+send = "Ondertekeningsverzoeken verzenden"
+signatureSettings = "Handtekeninginstellingen"
+title = "Sessiedetails controleren"
+titleShort = "Controleren en verzenden"
+visibility = "Zichtbaarheid:"
+visible = "Zichtbaar op pagina {{page}}"
+participantCount = "{{count}} deelnemer(s) tekenen in volgorde"
+
+[groupSigning.steps.selectDocument]
+continue = "Doorgaan naar deelnemersselectie"
+noFile = "Selecteer één PDF-bestand uit uw actieve bestanden om een ondertekeningssessie te maken."
+selectedFile = "Geselecteerd document"
+title = "Document selecteren"
+
+[groupSigning.steps.selectParticipants]
+continue = "Doorgaan naar handtekeninginstellingen"
+count = "{{count}} deelnemer(s) geselecteerd"
+label = "Deelnemers selecteren"
+placeholder = "Deelnemers kiezen om te ondertekenen..."
+title = "Deelnemers kiezen"
+
 [getPdfInfo]
 downloadJson = "JSON downloaden"
 downloads = "Downloads"
@@ -4460,7 +4860,10 @@ zoomOut = "Uitzoomen"
 
 [viewer]
 cannotPreviewFile = "Kan voorbeeld van bestand niet weergeven"
+disableColorFilter = "Kleurfilter uitschakelen"
 dualPageView = "Dubbele paginaweergave"
+enableDarkFilter = "Donkerfilter inschakelen"
+enableSepiaFilter = "Sepiafilter inschakelen"
 firstPage = "Eerste pagina"
 lastPage = "Laatste pagina"
 nextPage = "Volgende pagina"
@@ -4470,6 +4873,22 @@ singlePageView = "Enkele paginaweergave"
 unknownFile = "Onbekend bestand"
 zoomIn = "Inzoomen"
 zoomOut = "Uitzoomen"
+resetZoom = "Zoom resetten"
+
+[viewer.nonPdf]
+fileTypeBadge = "{{type}}-bestand"
+convertToPdf = "Converteren naar PDF"
+loading = "Laden..."
+emptyFile = "Leeg bestand"
+csvStats = "{{rows}} rijen · {{columns}} kolommen · {{size}}"
+sortedBy = "Gesorteerd op: {{column}}"
+columnDefault = "Kolom {{index}}"
+htmlPreviewWarning = "HTML-voorbeeld — externe bronnen worden mogelijk niet geladen · {{size}}"
+htmlPreview = "HTML-voorbeeld"
+invalidJson = "Ongeldige JSON — ruwe inhoud wordt weergegeven"
+textStats = "{{lines}} regels · {{size}}"
+lineNumbers = "Regelnummers"
+renderMarkdown = "Markdown renderen"
 
 [viewer.attachments]
 title = "Bijlagen"
@@ -4531,6 +4950,7 @@ toggleAttachments = "Bijlagen tonen/verbergen"
 toggleTheme = "Thema wisselen"
 language = "Taal"
 toggleAnnotations = "Annotaties tonen/verbergen"
+toggleLayers = "Lagen in-/uitschakelen"
 search = "PDF doorzoeken"
 panMode = "Pan-modus"
 applyRedactionsFirst = "Apply redactions first"
@@ -5407,20 +5827,72 @@ title = "Print bestand"
 2 = "Voer printernaam in"
 
 [quickAccess]
+access = "Toegang"
+accessAddPerson = "Nog een persoon toevoegen"
+accessBack = "Terug"
+accessCopyLink = "Link kopiëren"
+accessEmail = "E-mailadres"
+accessEmailPlaceholder = "naam@bedrijf.com"
+accessFileLabel = "Bestand"
+accessGeneral = "Algemene toegang"
+accessInviteTitle = "Personen uitnodigen"
+accessOwner = "Eigenaar"
+accessPanel = "Documenttoegang"
+accessPeople = "Personen met toegang"
+accessRemove = "Verwijderen"
+accessRestricted = "Beperkt"
+accessRestrictedHint = "Alleen personen met toegang kunnen openen"
+accessRole = "Rol"
+accessRoleCommenter = "Opmerkinggever"
+accessRoleEditor = "Bewerker"
+accessRoleViewer = "Lezer"
+accessSelectedFile = "Geselecteerd bestand"
+accessSendInvite = "Uitnodiging verzenden"
+accessTitle = "Documenttoegang"
+accessYou = "U"
 account = "Account"
+activeSessions = "Actieve sessies"
+activeTab = "Actief"
 activity = "Logboek"
 adminSettings = "Beheer"
+allSessions = "Alle sessies"
 allTools = "Tools"
 automate = "Automatiseren"
+back = "Terug"
+certSign = "Met certificaat ondertekenen"
+completedSessions = "Voltooide sessies"
+completedTab = "Voltooid"
 config = "Configuratie"
+createNew = "Nieuw verzoek maken"
+createSession = "Ondertekeningsverzoek maken"
+dueDate = "Vervaldatum (optioneel)"
 files = "Bestand"
 help = "Hulp"
+noActiveSessions = "Geen openstaande ondertekeningsverzoeken of actieve sessies"
+noCompletedSessions = "Geen voltooide sessies"
+noFile = "Geen bestand geselecteerd"
 read = "Lezen"
 reader = "Lezer"
+refresh = "Vernieuwen"
+requestSignatures = "Handtekeningen aanvragen"
+selectSingleFileToRequest = "Selecteer één PDF-bestand om handtekeningen aan te vragen"
+selectedFile = "Geselecteerd bestand"
+selectUsers = "Gebruikers selecteren om te ondertekenen"
+selectUsersPlaceholder = "Deelnemers kiezen..."
+sendingRequest = "Verzenden..."
 settings = "Opties"
 showMeAround = "Leid me rond"
 sign = "Teken"
+signatureRequests = "Ondertekeningsverzoeken"
+signYourself = "Zelf ondertekenen"
+newRequest = "Nieuw verzoek"
 tours = "Rondleidingen"
+wetSign = "Handtekening toevoegen"
+filterMine = "Van mij"
+filterOverdue = "Achterstallig"
+filterSigned = "Ondertekend"
+filterDeclined = "Geweigerd"
+searchDocuments = "Documenten zoeken…"
 
 [quickAccess.helpMenu]
 adminTour = "Rondleiding voor beheer"
@@ -6050,11 +6522,75 @@ toolNotAvailableLocally = "Je Stirling-PDF-server is offline en \"{{endpoint}}\"
 expired = "Uw sessie is verlopen. Voer de pagina opnieuw in en probeer het opnieuw."
 refreshPage = "Pagina vernieuwen"
 
+[sessionManagement.tooltip]
+header = "Ondertekeningssessies beheren"
+
+[sessionManagement.tooltip.addParticipants]
+bullet1 = "Nieuwe deelnemers worden aan het einde van de ondertekeningsvolgorde toegevoegd"
+bullet2 = "Kan geen deelnemers toevoegen nadat sessie is gefinaliseerd"
+bullet3 = "Elke deelnemer ontvangt een melding wanneer hij/zij aan de beurt is"
+description = "U kunt op elk moment vóór de finalisatie meer deelnemers aan een actieve sessie toevoegen."
+title = "Deelnemers toevoegen"
+
+[sessionManagement.tooltip.finalization]
+bullet1 = "<b>Volledige finalisatie</b>: Alle deelnemers hebben getekend"
+bullet2 = "<b>Gedeeltelijke finalisatie</b>: Sommige deelnemers hebben nog niet getekend"
+bullet3 = "Niet-ondertekende deelnemers worden uitgesloten van het definitieve document"
+bullet4 = "Na finalisatie kunt u de ondertekende PDF laden in actieve bestanden"
+description = "Finalisatie combineert alle handtekeningen in één ondertekende PDF. Deze actie kan niet ongedaan worden gemaakt."
+title = "Sessie-finalisatie"
+
+[sessionManagement.tooltip.participantRemoval]
+bullet1 = "Kan geen deelnemers verwijderen die al hebben getekend"
+bullet2 = "Verwijderde deelnemers ontvangen geen meldingen meer"
+bullet3 = "Ondertekeningsvolgorde wordt automatisch aangepast"
+description = "Deelnemers kunnen vóór het tekenen uit sessies worden verwijderd."
+title = "Deelnemers verwijderen"
+
+[sessionManagement.tooltip.signatureOrder]
+bullet1 = "Elke handtekening wordt sequentieel op de PDF toegepast"
+bullet2 = "Latere ondertekenaars kunnen eerdere handtekeningen zien"
+bullet3 = "Cruciaal voor goedkeuringsworkflows en juridische ketens van bewaring"
+description = "De volgorde die u bij het maken van de sessie opgeeft, bepaalt wie als eerste tekent."
+title = "Ondertekeningsvolgorde"
+
+[signatureSettings.tooltip]
+header = "Instellingen voor handtekeningweergave"
+
+[signatureSettings.tooltip.location]
+bullet1 = "Voorbeelden: \"New York, USA\", \"London Office\", \"Remote\""
+bullet2 = "Niet hetzelfde als paginapositie"
+bullet3 = "Kan vereist zijn voor bepaalde rechtsgebieden"
+description = "Optionele geografische locatie waar de handtekening is toegepast. Opgeslagen in certificaatmetadata."
+title = "Handtekeninglocatie"
+
+[signatureSettings.tooltip.logo]
+bullet1 = "Weergegeven naast handtekening en tekst"
+bullet2 = "Ondersteunt PNG-, JPG-indelingen"
+bullet3 = "Verbetert professionele uitstraling"
+description = "Voeg een bedrijfslogo toe aan zichtbare handtekeningen voor branding en authenticiteit."
+title = "Bedrijfslogo"
+
+[signatureSettings.tooltip.reason]
+bullet1 = "Voorbeelden: \"Goedkeuring\", \"Contractovereenkomst\", \"Review voltooid\""
+bullet2 = "Zichtbaar in PDF-handtekeningseigenschappen"
+bullet3 = "Handig voor audittrails en naleving"
+description = "Optionele tekst die uitlegt waarom het document wordt ondertekend. Opgeslagen in certificaatmetadata."
+title = "Reden voor handtekening"
+
+[signatureSettings.tooltip.visibility]
+bullet1 = "<b>Zichtbaar</b>: Handtekening verschijnt op PDF met aangepaste weergave"
+bullet2 = "<b>Onzichtbaar</b>: Certificaat ingesloten zonder visuele markering"
+bullet3 = "Onzichtbare handtekeningen bieden nog steeds cryptografische validatie"
+description = "Bepaalt of de handtekening zichtbaar is op het document of onzichtbaar wordt ingesloten."
+title = "Zichtbaarheid van handtekening"
+
 [settings.configuration]
 advanced = "Geavanceerd"
 database = "Database"
 endpoints = "Eindpunten"
 features = "Functies"
+storageSharing = "Bestandsopslag en delen"
 systemSettings = "Systeeminstellingen"
 title = "Configuratie"
 
@@ -6332,10 +6868,13 @@ title = "Inloggen bij Stirling"
 [setup.selfhosted]
 link = "of maak verbinding met een zelfgehost account"
 subtitle = "Vul uw servergegevens in"
+changeServerLocked = "Uw organisatie heeft deze app beperkt tot een specifieke server"
 switchToLocal = "In plaats daarvan lokale tools gebruiken"
 title = "Inloggen bij server"
 
 [setup.selfhosted.unreachable]
+changeServer = "Verbinden met een andere server"
+changeServerLocked = "Uw organisatie heeft deze app beperkt tot een specifieke server"
 continueOffline = "In plaats daarvan lokale tools gebruiken"
 message = "Kon {{url}} niet bereiken. Controleer of de server actief en toegankelijk is."
 retry = "Opnieuw proberen"
@@ -6529,6 +7068,15 @@ saved = "Opgeslagen"
 text = "Tekst"
 title = "Type handtekening"
 
+[signRequest]
+declined = "Ondertekeningsverzoek geweigerd"
+fetchFailed = "Ondertekeningsverzoek laden mislukt"
+signed = "Document succesvol ondertekend"
+
+[signSession]
+createFailed = "Ondertekeningsverzoek maken mislukt"
+created = "Ondertekeningsverzoek verzonden"
+
 [signup]
 accountCreatedSuccessfully = "Account succesvol aangemaakt! U kunt nu inloggen."
 alreadyHaveAccount = "Heeft u al een account? Log dan in"
@@ -6807,6 +7355,106 @@ title = "PDF splits op hoofdstukken"
 [splitPdfByChapters]
 tags = "splitsen, hoofdstukken, bookmarks, organiseren"
 
+[storageShare]
+accessed = "Geopend"
+accessDenied = "U hebt geen toegang tot dit gedeelde bestand. Vraag de eigenaar om het met u te delen."
+accessFailed = "Kan activiteit niet laden."
+accessDeniedBody = "U hebt geen toegang tot dit bestand. Vraag de eigenaar om het met u te delen."
+accessDeniedTitle = "Geen toegang"
+accessLimitedCommenter = "Opmerkingentoegang komt binnenkort. Vraag de eigenaar om bewerkersrechten als u wilt downloaden."
+accessLimitedTitle = "Beperkte toegang"
+accessLimitedViewer = "Deze link is alleen-lezen. Vraag de eigenaar om bewerkersrechten als u wilt downloaden."
+createdAt = "Gemaakt"
+download = "Downloaden"
+downloadFailed = "Dit bestand kan niet worden gedownload."
+expiredBody = "Deze deellink is ongeldig of verlopen."
+expiredTitle = "Link verlopen"
+goToLogin = "Naar inloggen"
+loadFailed = "Gedeeld bestand kan niet worden geopend."
+loading = "Deellink laden..."
+loginPrompt = "Meld u aan om toegang te krijgen tot dit gedeelde bestand."
+loginRequired = "Inloggen vereist"
+openInApp = "Openen in Stirling PDF"
+ownerLabel = "Eigenaar"
+ownerUnknown = "Onbekend"
+requiresLogin = "Dit gedeelde bestand vereist inloggen."
+roleCommenter = "Opmerkinggever"
+roleEditor = "Bewerker"
+roleViewer = "Lezer"
+shareHeading = "Gedeeld bestand"
+titleDefault = "Gedeeld bestand"
+tryAgain = "Probeer het later opnieuw."
+addUser = "Toevoegen"
+commenterHint = "Reageren komt binnenkort."
+copied = "Link gekopieerd naar klembord"
+copy = "Kopiëren"
+copyFailed = "Kopiëren mislukt"
+description = "Maak een deellink voor dit bestand. Aangemelde gebruikers met de link hebben er toegang toe."
+downloadsCount = "Downloads: {{count}}"
+emailWarningBody = "Dit lijkt op een e-mailadres. Als deze persoon nog geen Stirling PDF-gebruiker is, kan hij/zij geen toegang krijgen tot het bestand."
+emailWarningConfirm = "Toch delen"
+emailWarningTitle = "E-mailadres"
+errorTitle = "Delen mislukt"
+failure = "Kan geen deellink genereren. Probeer het opnieuw."
+fileLabel = "Bestand"
+generate = "Link genereren"
+generated = "Deellink gegenereerd"
+hideActivity = "Activiteit verbergen"
+invalidUsername = "Voer een geldige gebruikersnaam of e-mailadres in."
+lastAccessed = "Laatst geopend"
+linkAccessTitle = "Toegang via deellink"
+linkLabel = "Deellink"
+linksDisabled = "Deellinks zijn uitgeschakeld."
+linksDisabledBody = "Deellinks zijn uitgeschakeld door uw serverinstellingen."
+manage = "Delen beheren"
+manageDescription = "Maak en beheer links om dit bestand te delen."
+manageLoadFailed = "Deellinks kunnen niet worden geladen."
+manageTitle = "Delen beheren"
+noActivity = "Nog geen activiteit."
+noLinks = "Nog geen actieve deellinks."
+noSharedUsers = "Nog geen gebruikers met toegang."
+removeLink = "Link verwijderen"
+removeUser = "Verwijderen"
+revokeFailed = "Kan de deellink niet verwijderen."
+revoked = "Deellink verwijderd"
+roleLabel = "Rol"
+sharingDisabled = "Delen is uitgeschakeld."
+sharingDisabledBody = "Delen is uitgeschakeld door uw serverinstellingen."
+sharedUsersTitle = "Gedeelde gebruikers"
+title = "Bestand delen"
+unknownUser = "Onbekende gebruiker"
+userAddFailed = "Kan niet met die gebruiker delen."
+userAdded = "Gebruiker toegevoegd aan lijst met gedeelde gebruikers."
+usernameLabel = "Gebruikersnaam of e-mail"
+usernamePlaceholder = "Voer een gebruikersnaam of e-mail in"
+userRemoveFailed = "Kan die gebruiker niet verwijderen."
+userRemoved = "Gebruiker uit de lijst met gedeelde gebruikers verwijderd."
+viewActivity = "Activiteit bekijken"
+viewed = "Bekeken"
+viewsCount = "Weergaven: {{count}}"
+downloaded = "Gedownload"
+bulkDescription = "Maak één link om alle geselecteerde bestanden te delen met ingelogde gebruikers."
+bulkTitle = "Geselecteerde bestanden delen"
+copyLink = "Deellink kopiëren"
+fileCount = "{{count}} bestanden geselecteerd"
+ownerOnly = "Alleen de eigenaar kan het delen beheren."
+selectSingleFile = "Selecteer één bestand om het delen te beheren."
+
+[storageUpload]
+description = "Dit uploadt het huidige bestand naar serveropslag voor uw eigen toegang."
+errorTitle = "Upload mislukt"
+failure = "Upload mislukt. Controleer uw inlog- en opslaginstellingen."
+fileLabel = "Bestand"
+hint = "Openbare links en toegangsmodi worden beheerd door uw serverinstellingen."
+success = "Geüpload naar server"
+title = "Uploaden naar server"
+updateButton = "Bijwerken op server"
+uploadButton = "Uploaden naar server"
+bulkDescription = "Dit uploadt de geselecteerde bestanden naar uw serveropslag."
+bulkTitle = "Geselecteerde bestanden uploaden"
+fileCount = "{{count}} bestanden geselecteerd"
+more = " +{{count}} meer"
+
 [storage]
 approximateSize = "Geschatte grootte"
 fileTooLarge = "Bestand te groot. Maximale grootte per bestand is"
@@ -7153,6 +7801,30 @@ title = "PDF bekijken/bewerken"
 [warning]
 tooltipTitle = "Waarschuwing"
 
+[wetSignature.tooltip]
+header = "Methoden voor het maken van een handtekening"
+
+[wetSignature.tooltip.draw]
+bullet1 = "Pas penkleur en -dikte aan"
+bullet2 = "Wissen en opnieuw tekenen tot u tevreden bent"
+bullet3 = "Werkt op aanraakapparaten (tablets, telefoons)"
+description = "Maak een handgeschreven handtekening met uw muis of touchscreen. Het best voor persoonlijke, authentieke handtekeningen."
+title = "Handtekening tekenen"
+
+[wetSignature.tooltip.type]
+bullet1 = "Kies uit meerdere lettertypen"
+bullet2 = "Pas tekstgrootte en -kleur aan"
+bullet3 = "Perfect voor gestandaardiseerde handtekeningen"
+description = "Genereer een handtekening vanuit getypte tekst. Snel en consistent, geschikt voor zakelijke documenten."
+title = "Handtekening typen"
+
+[wetSignature.tooltip.upload]
+bullet1 = "Ondersteunt PNG, JPG en andere afbeeldingsformaten"
+bullet2 = "Transparante achtergronden aanbevolen voor de beste resultaten"
+bullet3 = "Afbeelding wordt geschaald naar het handtekeninggebied"
+description = "Upload een vooraf gemaakte handtekeningafbeelding. Ideaal als u een gescande handtekening of bedrijfslogo heeft."
+title = "Handtekeningafbeelding uploaden"
+
 [watermark]
 completed = "Watermerk toegevoegd"
 desc = "Voeg tekst- of afbeeldingswatermerken toe aan PDF-bestanden"
@@ -7333,6 +8005,7 @@ activeSession = "Actieve sessie"
 addMembers = "Leden toevoegen"
 admin = "Beheerder"
 confirmDelete = "Weet u zeker dat u deze gebruiker wilt verwijderen? Deze actie kan niet ongedaan worden gemaakt."
+confirmUnlock = "Weet u zeker dat u dit gebruikersaccount wilt ontgrendelen?"
 deleteUser = "Gebruiker verwijderen"
 deleteUserError = "Gebruiker verwijderen is mislukt"
 deleteUserSuccess = "Gebruiker succesvol verwijderd"
@@ -7341,6 +8014,8 @@ disable = "Uitschakelen"
 disabled = "Uitgeschakeld"
 editRole = "Rol bewerken"
 enable = "Inschakelen"
+locked = "vergrendeld"
+lockedBadge = "Vergrendeld"
 loading = "Personen laden..."
 loginRequired = "Schakel eerst de loginmodus in"
 member = "Lid"
@@ -7350,6 +8025,9 @@ searchMembers = "Leden zoeken..."
 status = "Status"
 team = "Team"
 title = "Personen"
+unlockAccount = "Account ontgrendelen"
+unlockUserError = "Gebruikersaccount ontgrendelen mislukt"
+unlockUserSuccess = "Gebruikersaccount succesvol ontgrendeld"
 user = "Gebruiker"
 
 [workspace.people.actions]
diff --git a/frontend/public/locales/no-NB/translation.toml b/frontend/public/locales/no-NB/translation.toml
index 399fcf199d..93546f2638 100644
--- a/frontend/public/locales/no-NB/translation.toml
+++ b/frontend/public/locales/no-NB/translation.toml
@@ -8,6 +8,7 @@ black = "Svart"
 blue = "Blå"
 bored = "Lei av å vente?"
 cancel = "Avbryt"
+confirm = "Bekreft"
 changedCredsMessage = "Legitimasjon endret!"
 chooseFile = "Velg fil"
 close = "Lukk"
@@ -146,6 +147,7 @@ insufficientCredits = "Ikke nok kreditter. PÃ¥krevd: {{requiredCredits}}, Tilgje
 loadingCredits = "Sjekker kreditter..."
 loadingProStatus = "Sjekker abonnementsstatus..."
 noticeTopUpOrPlan = "Ikke nok kreditter, fyll på eller oppgrader til et abonnement"
+accessInvite = "Inviter"
 
 [account]
 accountSettings = "Kontoinnstillinger"
@@ -1427,6 +1429,34 @@ title = "Behandling"
 description = "Maksimal tid å vente på en behandlingsjobb før en feil rapporteres."
 label = "Behandlingstidsavbrudd (sekunder)"
 
+[admin.settings.storage]
+description = "Kontroller serverlagring og delingsalternativer."
+title = "Fil-lagring og deling"
+
+[admin.settings.storage.enabled]
+description = "Tillat brukere å lagre filer på serveren."
+label = "Aktiver fillagring på server"
+
+[admin.settings.storage.sharing.email]
+description = "Tillat deling med e-postadresser."
+label = "Aktiver deling via e-post"
+mailLink = "Konfigurer e-postinnstillinger"
+mailNote = "Krever e-postkonfigurasjon. "
+
+[admin.settings.storage.sharing.enabled]
+description = "Tillat brukere å dele lagrede filer."
+label = "Aktiver deling"
+
+[admin.settings.storage.sharing.links]
+description = "Tillat deling via påloggede lenker."
+frontendUrlLink = "Konfigurer i systeminnstillinger"
+frontendUrlNote = "Krever en Frontend URL. "
+label = "Aktiver delingslenker"
+
+[admin.settings.storage.signing.enabled]
+description = "Tillat brukere å opprette signeringsøkter med flere deltakere. Krever at fillagring på serveren er aktivert."
+label = "Aktiver gruppesignering (Alpha)"
+
 [admin.settings.unsavedChanges]
 cancel = "Fortsett redigering"
 discard = "Forkast endringer"
@@ -2059,7 +2089,19 @@ numbers = "Tall/intervaller: 5, 10-20"
 progressions = "Progresjoner: 3n, 4n+1"
 
 [certSign]
+allSigned = "Alle deltakere har signert. Klar til å ferdigstille."
+awaitingSignatures = "Avventer signaturer"
+signatureProgress = "{{signedCount}}/{{totalCount}} signaturer"
 chooseCertificate = "Velg sertifikatfil"
+declined = "Avslått"
+fetchFailed = "Kunne ikke laste signeringsdata"
+finalized = "Ferdigstilt"
+notified = "Avventer"
+partialNote = "Du kan ferdigstille tidlig med gjeldende signaturer. Usignerte deltakere blir ekskludert."
+pending = "Avventer"
+readyToFinalize = "Klar til å ferdigstille"
+signed = "Signert"
+viewed = "Vist"
 chooseJksFile = "Velg JKS-fil"
 chooseP12File = "Velg PKCS12-fil"
 choosePfxFile = "Velg PFX-fil"
@@ -2082,6 +2124,7 @@ title = "Sertifikatsignering"
 invisible = "Usynlig"
 stepTitle = "Signaturutseende"
 visible = "Synlig"
+visibility = "Synlighet"
 
 [certSign.appearance.options]
 title = "Signaturdetaljer"
@@ -2188,6 +2231,252 @@ bullet4 = "Kan bruke egendefinerte sertifikater for verifisering"
 text = "Når du sjekker signaturer, forteller verktøyet deg om de er gyldige, hvem som signerte dokumentet, når det ble signert, og om dokumentet er endret siden signering."
 title = "Kontroll av signaturer"
 
+[certSign.collab.finalize]
+button = "Ferdigstill og last inn signert PDF"
+early = "Ferdigstill med nåværende signaturer"
+
+[certSign.collab.sessionDetail]
+addButton = "Legg til deltakere"
+addParticipants = "Legg til deltakere"
+addParticipantsError = "Kunne ikke legge til deltakere"
+backToList = "Tilbake til økter"
+deleteConfirm = "Er du sikker? Dette kan ikke angres."
+deleteError = "Kunne ikke slette økt"
+deleted = "Økt slettet"
+deleteSession = "Slett økt"
+dueDate = "Frist"
+finalizeError = "Kunne ikke ferdigstille økt"
+loadPdfError = "Kunne ikke laste signert PDF"
+loadSignedPdf = "Last inn signert PDF i aktive filer"
+messageLabel = "Melding"
+noAdditionalInfo = "Ingen tilleggsinformasjon"
+owner = "Eier"
+participantRemoved = "Deltaker fjernet"
+participants = "Deltakere"
+participantsAdded = "Deltakere lagt til"
+removeParticipant = "Fjern"
+removeParticipantError = "Kunne ikke fjerne deltaker"
+selectUsers = "Velg brukere ..."
+sessionInfo = "Øktinformasjon"
+workbenchTitle = "Øktadministrasjon"
+
+[certSign.collab.signRequest]
+addedToFiles = "Dokument lagt til i aktive filer"
+addSignature = "Legg til signaturen din"
+addToFiles = "Legg til i aktive filer"
+advancedSettings = "Avanserte innstillinger"
+backToList = "Tilbake til signeringsforespørsler"
+certificateChoice = "Velg et sertifikat å signere med"
+changeSignature = "Endre signatur"
+clearSignature = "Fjern signatur"
+completeAndSign = "Fullfør og signer"
+createNewSignature = "Opprett ny signatur"
+declineButton = "Avslå"
+decline = "Avslå forespørsel"
+deleteSelected = "Slett valgt signatur"
+drawSignature = "Tegn signaturen din nedenfor"
+dueDate = "Frist"
+fileTooLarge = "Filstørrelsen må være mindre enn 5MB"
+fontFamily = "Skrifttype"
+fontSize = "Skriftstørrelse: {{size}}px"
+fontSizePlaceholder = "Størrelse"
+from = "Fra"
+invalidCertFile = "Velg en P12- eller PFX-sertifikatfil"
+invalidFileType = "Velg en bildefil"
+location = "Sted (valgfritt)"
+locationPlaceholder = "Hvor signerer du fra?"
+message = "Melding"
+noCertificate = "Velg en sertifikatfil"
+noSignatures = "Plasser minst én signatur på PDF-en"
+p12File = "P12/PFX-sertifikatfil"
+password = "Sertifikatpassord"
+passwordPlaceholder = "Angi passord ..."
+penColor = "Pennfarge"
+penSize = "Pennstørrelse: {{size}}px"
+placementActive = "Klikk på PDF-en for å plassere"
+placeSignatureButton = "Plasser signatur på PDF"
+reason = "Ã…rsak (valgfritt)"
+reasonPlaceholder = "Hvorfor signerer du?"
+removeImage = "Fjern bilde"
+removeCertFile = "Fjern fil"
+savedSignatures = "Lagrede signaturer"
+selectFile = "Velg bildefil"
+selectSignatureTitle = "Velg eller opprett signatur"
+signButton = "Signer dokument"
+signatureInfo = "Disse innstillingene er konfigurert av dokumenteieren"
+signaturePlaced = "Signatur plassert på side"
+signatureSettings = "Signaturinnstillinger"
+signatureText = "Signaturtekst"
+signatureTextPlaceholder = "Skriv inn navnet ditt ..."
+signatureTypeLabel = "Signaturtype"
+signingTitle = "Signering"
+textColor = "Tekstfarge"
+typeSignature = "Skriv inn navnet ditt for å opprette en signatur"
+uploadCert = "Egendefinert sertifikat"
+uploadCertDesc = "Bruk ditt eget P12/PFX-sertifikat"
+uploadSignature = "Last opp signaturbildet ditt"
+usePersonalCert = "Personlig sertifikat"
+usePersonalCertDesc = "Genereres automatisk for kontoen din"
+useServerCert = "Organisasjonssertifikat"
+useServerCertDesc = "Delt organisasjonssertifikat"
+workbenchTitle = "Signeringsforespørsel"
+
+[certSign.collab.signRequest.canvas]
+colorPickerTitle = "Velg strekfarge"
+continue = "Fortsett"
+
+[certSign.collab.signRequest.certModal]
+description = "Du har plassert {{count}} signatur(er). Velg sertifikatet ditt for å fullføre signeringen."
+sign = "Signer dokument"
+certValidating = "Validerer sertifikat ..."
+certValidUntil = "Sertifikat gyldig til {{date}}"
+certInvalid = "Ugyldig sertifikat: {{error}}"
+certInvalidFallback = "Ugyldig sertifikat"
+certNetworkError = "Kunne ikke validere sertifikat"
+title = "Konfigurer sertifikat"
+
+[certSign.collab.signRequest.image]
+hint = "Last opp et PNG- eller JPG-bilde av signaturen din"
+
+[certSign.collab.signRequest.mode]
+move = "Flytt signatur"
+place = "Plasser signatur"
+title = "Signerings- eller flyttemodus"
+
+[certSign.collab.signRequest.modeTabs]
+draw = "Tegn"
+image = "Last opp"
+text = "Skriv"
+
+[certSign.collab.signRequest.placeSignature]
+message = "Klikk på PDF-en for å plassere signaturen din"
+title = "Plasser signatur"
+
+[certSign.collab.signRequest.preview]
+imageAlt = "Valgt signatur"
+missing = "Ingen forhåndsvisning"
+textFallback = "Signatur"
+
+[certSign.collab.signRequest.saved]
+defaultCanvasLabel = "Tegnet signatur"
+defaultImageLabel = "Opplastet signatur"
+defaultLabel = "Signatur"
+defaultTextLabel = "Skrevet signatur"
+delete = "Slett signatur"
+none = "Ingen lagrede signaturer"
+
+[certSign.collab.signRequest.signatureType]
+draw = "Tegn"
+type = "Skriv"
+upload = "Last opp"
+
+[certSign.collab.signRequest.steps]
+back = "Tilbake"
+cancelPlacement = "Avbryt plassering"
+certificate = "Sertifikat"
+clickMultipleTimes = "Klikk flere ganger på PDF-en for å plassere signaturer. Dra en signatur for å flytte eller endre størrelse."
+clickToPlace = "Klikk på PDF-en der du vil at signaturen skal vises."
+continue = "Fortsett til valg av sertifikat"
+continueToPlacement = "Fortsett til plassering"
+continueToReview = "Fortsett til gjennomgang"
+createSignature = "Opprett signatur"
+invisible = "Usynlig"
+location = "Sted:"
+multipleSignatures = "{{count}} signaturer vil bli lagt til PDF-en"
+oneSignature = "1 signatur vil bli lagt til PDF-en"
+placeOnPdf = "Plasser på PDF"
+reason = "Ã…rsak:"
+reviewTitle = "Gjennomgå før signering"
+signaturePlaced = "Signatur plassert på side {{page}}. Du kan justere plasseringen ved å klikke igjen, eller fortsette til gjennomgang."
+visible = "Synlig"
+visibility = "Synlighet:"
+yourSignatures = "Dine signaturer ({{count}})"
+
+[certSign.collab.signRequest.text]
+colorLabel = "Farge"
+fontLabel = "Skrift"
+fontSizeLabel = "Størrelse"
+fontSizePlaceholder = "16"
+label = "Signaturtekst"
+modalHint = "Skriv inn navnet ditt, og klikk deretter Fortsett for å plassere det på PDF-en."
+placeholder = "Skriv inn navnet ditt ..."
+
+[certSign.collab.participant]
+certValidating = "Validerer sertifikat ..."
+certValid = "✓ Sertifikat gyldig"
+certValidUntil = " til {{date}}"
+certInvalid = "✗ {{error}}"
+certInvalidFallback = "Ugyldig sertifikat"
+certNetworkError = "Kunne ikke validere sertifikat"
+
+[certSign.collab.addParticipants]
+add = "Legg til {{count}} deltakere"
+back = "Tilbake"
+configureSignatures = "Konfigurer signaturinnstillinger"
+continue = "Fortsett til signaturinnstillinger"
+reasonHelp = "Forhåndsangi en signeringsårsak for disse deltakerne (valgfritt, de kan overstyre ved signering)"
+reasonPlaceholder = "f.eks. Godkjenning, Gjennomgang ..."
+selectUsers = "Velg brukere"
+
+[certSign.collab.sessionCreation]
+includeSummaryPage = "Inkluder side med signaturoppsummering"
+includeSummaryPageHelp = "En oppsummeringsside legges til på slutten med all signaturmetadata. Signaturfeltene for digitale sertifikater på enkeltsider blir undertrykt (våte signaturer påvirkes ikke)."
+
+[certSign.collab.sessionList]
+active = "Aktiv"
+finalized = "Ferdigstilt"
+
+[certSign.collab.signatureSettings]
+description = "Konfigurer hvordan signaturer skal vises for alle deltakere"
+title = "Signaturutforming"
+
+[certSign.collab.userSelector]
+inviteUsers = "Legg til brukere"
+loadError = "Kunne ikke laste brukere"
+noTeam = "Ingen team"
+noUsers = "Ingen andre brukere funnet."
+placeholder = "Velg brukere ..."
+
+[certSign.mobile]
+panelActions = "Handlinger"
+panelDocument = "Dokument"
+panelPeople = "Personer"
+
+[certSign.sessions]
+deleted = "Økt slettet"
+fetchFailed = "Kunne ikke laste øktdetaljer"
+finalized = "Økt ferdigstilt"
+loaded = "Signert PDF lastet inn"
+pdfNotReady = "PDF ikke klar"
+pdfNotReadyDesc = "Den signerte PDF-en genereres. Prøv igjen om et øyeblikk."
+
+[certificateChoice.tooltip]
+header = "Sertifikatyper"
+
+[certificateChoice.tooltip.organization]
+bullet1 = "Administreres av systemadministratorer"
+bullet2 = "Deles på tvers av autoriserte brukere"
+bullet3 = "Representerer virksomhetens identitet, ikke individet"
+bullet4 = "Best for: Offisielle dokumenter, teamsignaturer"
+description = "Et delt sertifikat levert av organisasjonen din. Brukes for signeringsmyndighet på tvers av selskapet."
+title = "Organisasjonssertifikat"
+
+[certificateChoice.tooltip.personal]
+bullet1 = "Genereres automatisk ved første bruk"
+bullet2 = "Knyttet til brukerkontoen din"
+bullet3 = "Kan ikke deles med andre brukere"
+bullet4 = "Best for: Personlige dokumenter, individuell ansvarlighet"
+description = "Et autogenerert sertifikat unikt for brukerkontoen din. Egnet for individuelle signaturer."
+title = "Personlig sertifikat"
+
+[certificateChoice.tooltip.upload]
+bullet1 = "Krever P12/PFX-fil og passord"
+bullet2 = "Kan utstedes av eksterne sertifikatutstedere"
+bullet3 = "Høyere tillitsnivå for juridiske dokumenter"
+bullet4 = "Best for: Rettslig bindende kontrakter, ekstern validering"
+description = "Bruk din egen PKCS#12-sertifikatfil. Gir full kontroll over sertifikategenskaper."
+title = "Last opp egendefinert P12"
+
 [changeCreds]
 changePassword = "Du bruker standard påloggingsdetaljer. Vennligst skriv inn et nytt passord"
 changeUsername = "Oppdater brukernavnet ditt. Du blir logget ut etter oppdatering."
@@ -3242,6 +3531,46 @@ totalSelected = "Totalt valgt"
 unsupported = "Ikke støttet"
 unzip = "Pakk ut"
 uploadError = "Noen filer kunne ikke lastes opp."
+copyCreated = "Kopi lagret på denne enheten."
+copyFailed = "Kunne ikke opprette en kopi."
+leaveShare = "Fjern fra listen min"
+leaveShareFailed = "Kunne ikke fjerne den delte filen."
+leaveShareSuccess = "Fjernet fra din delte liste."
+removeBoth = "Fjern fra begge"
+removeFilePrompt = "Denne filen er lagret på denne enheten og på serveren. Hvor vil du fjerne den fra?"
+removeFileTitle = "Fjern fil"
+removeLocalOnly = "Kun denne enheten"
+removeServerFailed = "Kunne ikke fjerne filen fra serveren."
+removeServerOnly = "Kun server"
+removeServerOnlyPrompt = "Denne filen er lagret kun på serveren. Vil du fjerne den fra serveren?"
+removeServerSuccess = "Fjernet fra server."
+removeSharedPrompt = "Denne filen er delt med deg. Du kan fjerne den fra denne enheten eller fra din delte liste."
+removeSharedServerOnlyBlockedPrompt = "Denne filen er delt med deg og lagret kun på serveren."
+removeSharedServerOnlyPrompt = "Denne filen er delt med deg og lagret kun på serveren. Fjern den fra listen din?"
+changesNotUploaded = "Endringer ikke lastet opp"
+cloudFile = "Skyfil"
+filterAll = "Alle"
+filterLocal = "Lokal"
+filterSharedByMe = "Delt av meg"
+filterSharedWithMe = "Delt med meg"
+lastSynced = "Sist synkronisert"
+localOnly = "Kun lokalt"
+makeCopy = "Lag en kopi"
+owner = "Eier"
+ownerUnknown = "Ukjent"
+share = "Del"
+shareSelected = "Del valgte"
+sharedByYou = "Delt av deg"
+sharedEditNoticeBody = "Du har ikke redigeringsrettigheter til serverversjonen av denne filen. Eventuelle endringer du gjør, lagres som en lokal kopi."
+sharedEditNoticeConfirm = "Forstått"
+sharedEditNoticeTitle = "Skrivebeskyttet serverkopi"
+sharedWithYou = "Delt med deg"
+sharing = "Deling"
+storageState = "Lagring"
+synced = "Synkronisert"
+updateOnServer = "Oppdater på serveren"
+uploadSelected = "Last opp valgte"
+uploadToServer = "Last opp til serveren"
 
 [files]
 addFiles = "Legg til filer"
@@ -3367,6 +3696,77 @@ title = "Om utflating av PDF-er"
 discord = "Discord"
 issues = "GitHub"
 
+[groupSigning.tooltip]
+header = "Om gruppesignering"
+
+[groupSigning.tooltip.finalization]
+bullet1 = "Alle signaturer legges til i den deltakerrekkefølgen du spesifiserte"
+bullet2 = "Du kan ferdigstille med delvise signaturer ved behov"
+bullet3 = "Når ferdigstilt, kan ikke økten endres"
+description = "Når alle deltakere har signert (eller du velger å ferdigstille tidlig), kan du generere den endelige signerte PDF-en."
+title = "Ferdigstillingsprosess"
+
+[groupSigning.tooltip.roles]
+bullet1 = "Eier (deg): Oppretter økt, konfigurerer signaturstandarder, ferdigstiller dokument"
+bullet2 = "Deltakere: Oppretter sin signatur, velger sertifikat, plasserer på PDF"
+bullet3 = "Deltakere kan ikke endre innstillinger for synlighet, årsak eller sted"
+description = "Du kontrollerer innstillingene for signaturutforming for alle deltakere."
+title = "Deltakerroller"
+
+[groupSigning.tooltip.sequential]
+bullet1 = "Første deltaker må signere før den neste får tilgang til dokumentet"
+bullet2 = "Sikrer korrekt signeringsrekkefølge for juridisk etterlevelse"
+bullet3 = "Du kan endre rekkefølgen ved å dra deltakere i listen"
+description = "Deltakere signerer dokumenter i den rekkefølgen du angir. Hver signerer får et varsel når det er deres tur."
+title = "Sekvensiell signering"
+
+[groupSigning.steps]
+back = "Tilbake"
+completed = "Fullført"
+current = "Gjeldende"
+stepLabel = "Trinn {{number}}"
+
+[groupSigning.steps.configureDefaults]
+continue = "Fortsett til gjennomgang"
+invisible = "Signaturer vil være usynlige (kun metadata)"
+locationLabel = "Sted:"
+preview = "Forhåndsvisning"
+reasonLabel = "Ã…rsak:"
+title = "Konfigurer signaturinnstillinger"
+visible = "Signaturer vil være synlige på side {{page}}"
+
+[groupSigning.steps.review]
+document = "Dokument"
+dueDate = "Frist (valgfritt)"
+dueDatePlaceholder = "Velg frist ..."
+invisible = "Usynlig (kun metadata)"
+location = "Sted:"
+logo = "Logo:"
+logoHidden = "Ingen logo"
+logoShown = "Stirling PDF-logo vises"
+participants = "Deltakere"
+reason = "Ã…rsak:"
+send = "Send signeringsforespørsler"
+signatureSettings = "Signaturinnstillinger"
+title = "Gjennomgå øktsdetaljer"
+titleShort = "Gjennomgå og send"
+visibility = "Synlighet:"
+visible = "Synlig på side {{page}}"
+participantCount = "{{count}} deltakere vil signere i rekkefølge"
+
+[groupSigning.steps.selectDocument]
+continue = "Fortsett til valg av deltakere"
+noFile = "Velg én PDF-fil fra dine aktive filer for å opprette en signeringsøkt."
+selectedFile = "Valgt dokument"
+title = "Velg dokument"
+
+[groupSigning.steps.selectParticipants]
+continue = "Fortsett til signaturinnstillinger"
+count = "{{count}} deltakere valgt"
+label = "Velg deltakere"
+placeholder = "Velg deltakere som skal signere ..."
+title = "Velg deltakere"
+
 [getPdfInfo]
 downloadJson = "Last ned JSON"
 downloads = "Nedlastinger"
@@ -4460,7 +4860,10 @@ zoomOut = "Zoom ut"
 
 [viewer]
 cannotPreviewFile = "Kan ikke forhåndsvise fil"
+disableColorFilter = "Deaktiver fargefilter"
 dualPageView = "Dobbelsidevisning"
+enableDarkFilter = "Aktiver mørkt filter"
+enableSepiaFilter = "Aktiver sepiafilter"
 firstPage = "Første side"
 lastPage = "Siste side"
 nextPage = "Neste side"
@@ -4470,6 +4873,22 @@ singlePageView = "Enkeltsidevisning"
 unknownFile = "Ukjent fil"
 zoomIn = "Zoom inn"
 zoomOut = "Zoom ut"
+resetZoom = "Tilbakestill zoom"
+
+[viewer.nonPdf]
+fileTypeBadge = "{{type}}-fil"
+convertToPdf = "Konverter til PDF"
+loading = "Laster ..."
+emptyFile = "Tom fil"
+csvStats = "{{rows}} rader · {{columns}} kolonner · {{size}}"
+sortedBy = "Sortert etter: {{column}}"
+columnDefault = "Kolonne {{index}}"
+htmlPreviewWarning = "HTML-forhåndsvisning — eksterne ressurser kan hende ikke lastes · {{size}}"
+htmlPreview = "HTML-forhåndsvisning"
+invalidJson = "Ugyldig JSON — viser rått innhold"
+textStats = "{{lines}} linjer · {{size}}"
+lineNumbers = "Linjenumre"
+renderMarkdown = "Gjengi Markdown"
 
 [viewer.attachments]
 title = "Vedlegg"
@@ -4531,6 +4950,7 @@ toggleAttachments = "Vis/skjul vedlegg"
 toggleTheme = "Bytt tema"
 language = "Språk"
 toggleAnnotations = "Vis/skjul merknader"
+toggleLayers = "Veksle lag"
 search = "Søk i PDF"
 panMode = "Panoreringsmodus"
 applyRedactionsFirst = "Bruk sladding først"
@@ -5407,20 +5827,72 @@ title = "Skriv ut fil"
 2 = "Skriv inn skrivernavn"
 
 [quickAccess]
+access = "Tilgang"
+accessAddPerson = "Legg til en person til"
+accessBack = "Tilbake"
+accessCopyLink = "Kopier lenke"
+accessEmail = "E-postadresse"
+accessEmailPlaceholder = "name@company.com"
+accessFileLabel = "Fil"
+accessGeneral = "Generell tilgang"
+accessInviteTitle = "Inviter personer"
+accessOwner = "Eier"
+accessPanel = "Dokumenttilgang"
+accessPeople = "Personer med tilgang"
+accessRemove = "Fjern"
+accessRestricted = "Begrenset"
+accessRestrictedHint = "Bare personer med tilgang kan åpne"
+accessRole = "Rolle"
+accessRoleCommenter = "Kommentator"
+accessRoleEditor = "Redaktør"
+accessRoleViewer = "Leser"
+accessSelectedFile = "Valgt fil"
+accessSendInvite = "Send invitasjon"
+accessTitle = "Dokumenttilgang"
+accessYou = "Deg"
 account = "Konto"
+activeSessions = "Aktive økter"
+activeTab = "Aktive"
 activity = "Logg"
 adminSettings = "Admin Innst."
+allSessions = "Alle økter"
 allTools = "All Tools"
 automate = "Auto"
+back = "Tilbake"
+certSign = "Signer med sertifikat"
+completedSessions = "Fullførte økter"
+completedTab = "Fullført"
 config = "Oppsett"
+createNew = "Opprett ny forespørsel"
+createSession = "Opprett signeringsforespørsel"
+dueDate = "Frist (valgfritt)"
 files = "Filer"
 help = "Hjelp"
+noActiveSessions = "Ingen ventende signeringsforespørsler eller aktive økter"
+noCompletedSessions = "Ingen fullførte økter"
+noFile = "Ingen fil valgt"
 read = "Les"
 reader = "Leser"
+refresh = "Oppdater"
+requestSignatures = "Be om signaturer"
+selectSingleFileToRequest = "Velg én PDF-fil for å be om signaturer"
+selectedFile = "Valgt fil"
+selectUsers = "Velg brukere som skal signere"
+selectUsersPlaceholder = "Velg deltakere ..."
+sendingRequest = "Sender ..."
 settings = "Innst."
 showMeAround = "Vis meg rundt"
 sign = "Signer"
+signatureRequests = "Signeringsforespørsler"
+signYourself = "Signer selv"
+newRequest = "Ny forespørsel"
 tours = "Omvisninger"
+wetSign = "Legg til signatur"
+filterMine = "Mine"
+filterOverdue = "Forfalt"
+filterSigned = "Signert"
+filterDeclined = "Avslått"
+searchDocuments = "Søk i dokumenter…"
 
 [quickAccess.helpMenu]
 adminTour = "Admin-omvisning"
@@ -6050,11 +6522,75 @@ toolNotAvailableLocally = "Stirling-PDF-serveren din er frakoblet og \"{{endpoin
 expired = "Økten din har utløpt. Vennligst oppdater siden og prøv igjen."
 refreshPage = "Oppdater Side"
 
+[sessionManagement.tooltip]
+header = "Administrere signeringsøkter"
+
+[sessionManagement.tooltip.addParticipants]
+bullet1 = "Nye deltakere legges til på slutten av signeringsrekkefølgen"
+bullet2 = "Kan ikke legge til deltakere etter at økten er ferdigstilt"
+bullet3 = "Hver deltaker mottar et varsel når det er deres tur"
+description = "Du kan legge til flere deltakere i en aktiv økt når som helst før ferdigstilling."
+title = "Legge til deltakere"
+
+[sessionManagement.tooltip.finalization]
+bullet1 = "<b>Full ferdigstillelse</b>: Alle deltakere har signert"
+bullet2 = "<b>Delvis ferdigstillelse</b>: Noen deltakere har ikke signert ennå"
+bullet3 = "Usignerte deltakere blir utelatt fra det endelige dokumentet"
+bullet4 = "NÃ¥r ferdigstilt, kan du laste inn den signerte PDF-en i aktive filer"
+description = "Ferdigstilling kombinerer alle signaturer i én signert PDF. Denne handlingen kan ikke angres."
+title = "Ferdigstilling av økt"
+
+[sessionManagement.tooltip.participantRemoval]
+bullet1 = "Kan ikke fjerne deltakere som allerede har signert"
+bullet2 = "Fjernede deltakere mottar ikke lenger varsler"
+bullet3 = "Signeringsrekkefølgen justeres automatisk"
+description = "Deltakere kan fjernes fra økter før de signerer."
+title = "Fjerne deltakere"
+
+[sessionManagement.tooltip.signatureOrder]
+bullet1 = "Hver signatur legges til sekvensielt på PDF-en"
+bullet2 = "Senere signerer kan se tidligere signaturer"
+bullet3 = "Kritisk for godkjenningsflyter og juridisk sporbarhet"
+description = "Rekkefølgen du angir når du oppretter økten bestemmer hvem som signerer først."
+title = "Signeringsrekkefølge"
+
+[signatureSettings.tooltip]
+header = "Innstillinger for signaturutforming"
+
+[signatureSettings.tooltip.location]
+bullet1 = "Eksempler: \"New York, USA\", \"London Office\", \"Remote\""
+bullet2 = "Ikke det samme som plassering på siden"
+bullet3 = "Kan være påkrevd i enkelte jurisdiksjoner"
+description = "Valgfritt geografisk sted der signaturen ble påført. Lagres i sertifikatmetadata."
+title = "Signatursted"
+
+[signatureSettings.tooltip.logo]
+bullet1 = "Vises sammen med signatur og tekst"
+bullet2 = "Støtter PNG, JPG-formater"
+bullet3 = "Forbedrer profesjonelt uttrykk"
+description = "Legg til en firmalogo på synlige signaturer for profilering og ekthet."
+title = "Firmalogo"
+
+[signatureSettings.tooltip.reason]
+bullet1 = "Eksempler: \"Godkjenning\", \"Kontrakt\", \"Gjennomgang fullført\""
+bullet2 = "Synlig i PDF-signaturegenskaper"
+bullet3 = "Nyttig for sporbarhet og etterlevelse"
+description = "Valgfri tekst som forklarer hvorfor dokumentet signeres. Lagres i sertifikatmetadata."
+title = "Signeringsårsak"
+
+[signatureSettings.tooltip.visibility]
+bullet1 = "<b>Synlig</b>: Signatur vises på PDF med tilpasset utseende"
+bullet2 = "<b>Usynlig</b>: Sertifikat innebygd uten visuelt merke"
+bullet3 = "Usynlige signaturer gir fortsatt kryptografisk validering"
+description = "Styrer om signaturen er synlig på dokumentet eller innebygd usynlig."
+title = "Signatursynlighet"
+
 [settings.configuration]
 advanced = "Avansert"
 database = "Database"
 endpoints = "Endepunkter"
 features = "Funksjoner"
+storageSharing = "Fil-lagring og deling"
 systemSettings = "Systeminnstillinger"
 title = "Konfigurasjon"
 
@@ -6332,10 +6868,13 @@ title = "Logg inn i Stirling"
 [setup.selfhosted]
 link = "eller koble til en selvhostet konto"
 subtitle = "Oppgi serverlegitimasjonen din"
+changeServerLocked = "Organisasjonen din har begrenset denne appen til en bestemt server"
 switchToLocal = "Bruk lokale verktøy i stedet"
 title = "Logg inn på server"
 
 [setup.selfhosted.unreachable]
+changeServer = "Koble til en annen server"
+changeServerLocked = "Organisasjonen din har begrenset denne appen til en bestemt server"
 continueOffline = "Bruk lokale verktøy i stedet"
 message = "Kunne ikke nå {{url}}. Kontroller at serveren kjører og er tilgjengelig."
 retry = "Prøv igjen"
@@ -6529,6 +7068,15 @@ saved = "Lagret"
 text = "Tekst"
 title = "Signaturtype"
 
+[signRequest]
+declined = "Signeringsforespørsel avslått"
+fetchFailed = "Kunne ikke laste signeringsforespørsel"
+signed = "Dokument signert"
+
+[signSession]
+createFailed = "Kunne ikke opprette signeringsforespørsel"
+created = "Signeringsforespørsel sendt"
+
 [signup]
 accountCreatedSuccessfully = "Konto opprettet! Du kan nå logge inn."
 alreadyHaveAccount = "Har du allerede en konto? Logg inn"
@@ -6807,6 +7355,106 @@ title = "Del PDF etter kapitler"
 [splitPdfByChapters]
 tags = "del,kapitler,bokmerker,organiser"
 
+[storageShare]
+accessed = "Ã…pnet"
+accessDenied = "Du har ikke tilgang til denne delte filen. Be eieren dele den med deg."
+accessFailed = "Kan ikke laste aktivitet."
+accessDeniedBody = "Du har ikke tilgang til denne filen. Be eieren dele den med deg."
+accessDeniedTitle = "Ingen tilgang"
+accessLimitedCommenter = "Kommentartilgang kommer snart. Be eieren om redaktørtilgang hvis du trenger å laste ned."
+accessLimitedTitle = "Begrenset tilgang"
+accessLimitedViewer = "Denne lenken er kun for visning. Be eieren om redaktørtilgang hvis du trenger å laste ned."
+createdAt = "Opprettet"
+download = "Last ned"
+downloadFailed = "Kan ikke laste ned denne filen."
+expiredBody = "Denne delingslenken er ugyldig eller har utløpt."
+expiredTitle = "Lenke utløpt"
+goToLogin = "GÃ¥ til innlogging"
+loadFailed = "Kan ikke åpne delt fil."
+loading = "Laster delingslenke ..."
+loginPrompt = "Logg inn for å få tilgang til denne delte filen."
+loginRequired = "Innlogging kreves"
+openInApp = "Ã…pne i Stirling PDF"
+ownerLabel = "Eier"
+ownerUnknown = "Ukjent"
+requiresLogin = "Denne delte filen krever innlogging."
+roleCommenter = "Kommentator"
+roleEditor = "Redaktør"
+roleViewer = "Leser"
+shareHeading = "Delt fil"
+titleDefault = "Delt fil"
+tryAgain = "Prøv igjen senere."
+addUser = "Legg til"
+commenterHint = "Kommentartilgang kommer snart."
+copied = "Lenke kopiert til utklippstavlen"
+copy = "Kopier"
+copyFailed = "Kopiering mislyktes"
+description = "Opprett en delingslenke for denne filen. Innloggede brukere med lenken kan få tilgang."
+downloadsCount = "Nedlastinger: {{count}}"
+emailWarningBody = "Dette ser ut som en e-postadresse. Hvis denne personen ikke allerede er Stirling PDF-bruker, vil vedkommende ikke kunne få tilgang til filen."
+emailWarningConfirm = "Del likevel"
+emailWarningTitle = "E-postadresse"
+errorTitle = "Deling mislyktes"
+failure = "Kunne ikke generere en delingslenke. Prøv igjen."
+fileLabel = "Fil"
+generate = "Generer lenke"
+generated = "Delingslenke opprettet"
+hideActivity = "Skjul aktivitet"
+invalidUsername = "Angi et gyldig brukernavn eller e-postadresse."
+lastAccessed = "Sist åpnet"
+linkAccessTitle = "Tilgang via delingslenke"
+linkLabel = "Delingslenke"
+linksDisabled = "Delingslenker er deaktivert."
+linksDisabledBody = "Delingslenker er deaktivert av serverinnstillingene dine."
+manage = "Administrer deling"
+manageDescription = "Opprett og administrer lenker for å dele denne filen."
+manageLoadFailed = "Kunne ikke laste delingslenker."
+manageTitle = "Administrer deling"
+noActivity = "Ingen aktivitet ennå."
+noLinks = "Ingen aktive delingslenker ennå."
+noSharedUsers = "Ingen brukere har tilgang ennå."
+removeLink = "Fjern lenke"
+removeUser = "Fjern"
+revokeFailed = "Kunne ikke fjerne delingslenken."
+revoked = "Delingslenke fjernet"
+roleLabel = "Rolle"
+sharingDisabled = "Deling er deaktivert."
+sharingDisabledBody = "Deling har blitt deaktivert av serverinnstillingene dine."
+sharedUsersTitle = "Brukere som har tilgang"
+title = "Del fil"
+unknownUser = "Ukjent bruker"
+userAddFailed = "Kan ikke dele med denne brukeren."
+userAdded = "Bruker lagt til i delingslisten."
+usernameLabel = "Brukernavn eller e-post"
+usernamePlaceholder = "Skriv inn et brukernavn eller en e-post"
+userRemoveFailed = "Kan ikke fjerne denne brukeren."
+userRemoved = "Bruker fjernet fra delingslisten."
+viewActivity = "Vis aktivitet"
+viewed = "Vist"
+viewsCount = "Visninger: {{count}}"
+downloaded = "Lastet ned"
+bulkDescription = "Opprett én lenke for å dele alle valgte filer med påloggede brukere."
+bulkTitle = "Del valgte filer"
+copyLink = "Kopier delingslenke"
+fileCount = "{{count}} filer valgt"
+ownerOnly = "Bare eieren kan administrere deling."
+selectSingleFile = "Velg én fil for å administrere deling."
+
+[storageUpload]
+description = "Dette laster opp gjeldende fil til serverlagring for din egen tilgang."
+errorTitle = "Opplasting mislyktes"
+failure = "Opplasting mislyktes. Kontroller påloggingen og lagringsinnstillingene dine."
+fileLabel = "Fil"
+hint = "Offentlige lenker og tilgangsmoduser styres av serverinnstillingene dine."
+success = "Lastet opp til serveren"
+title = "Last opp til server"
+updateButton = "Oppdater på server"
+uploadButton = "Last opp til server"
+bulkDescription = "Dette laster opp de valgte filene til serverlagringen din."
+bulkTitle = "Last opp valgte filer"
+fileCount = "{{count}} filer valgt"
+more = " +{{count}} til"
+
 [storage]
 approximateSize = "Omtrentlig størrelse"
 fileTooLarge = "Filen er for stor. Maksimal størrelse per fil er"
@@ -7153,6 +7801,30 @@ title = "Vis/Rediger PDF"
 [warning]
 tooltipTitle = "Advarsel"
 
+[wetSignature.tooltip]
+header = "Metoder for oppretting av signatur"
+
+[wetSignature.tooltip.draw]
+bullet1 = "Tilpass pennens farge og tykkelse"
+bullet2 = "Slett og tegn på nytt til du er fornøyd"
+bullet3 = "Fungerer på berøringsenheter (nettbrett, telefoner)"
+description = "Lag en håndskrevet signatur med musen eller berøringsskjermen. Best for personlige, autentiske signaturer."
+title = "Tegn signatur"
+
+[wetSignature.tooltip.type]
+bullet1 = "Velg mellom flere skrifttyper"
+bullet2 = "Tilpass tekststørrelse og -farge"
+bullet3 = "Perfekt for standardiserte signaturer"
+description = "Generer en signatur fra skrevet tekst. Rask og konsistent, egnet for forretningsdokumenter."
+title = "Skriv signatur"
+
+[wetSignature.tooltip.upload]
+bullet1 = "Støtter PNG, JPG og andre bildeformater"
+bullet2 = "Gjennomsiktige bakgrunner anbefales for best resultat"
+bullet3 = "Bildet vil størrelsestilpasses for å passe signaturområdet"
+description = "Last opp et forhåndslaget signaturbilde. Ideelt hvis du har en skannet signatur eller firmalogo."
+title = "Last opp signaturbilde"
+
 [watermark]
 completed = "Vannmerke lagt til"
 desc = "Legg til tekst- eller bildevannmerker i PDF-filer"
@@ -7333,6 +8005,7 @@ activeSession = "Aktiv økt"
 addMembers = "Legg til medlemmer"
 admin = "Admin"
 confirmDelete = "Er du sikker på at du vil slette denne brukeren? Denne handlingen kan ikke angres."
+confirmUnlock = "Er du sikker på at du vil låse opp denne brukerkontoen?"
 deleteUser = "Slett bruker"
 deleteUserError = "Kunne ikke slette bruker"
 deleteUserSuccess = "Bruker slettet"
@@ -7341,6 +8014,8 @@ disable = "Deaktiver"
 disabled = "Deaktivert"
 editRole = "Rediger rolle"
 enable = "Aktiver"
+locked = "låst"
+lockedBadge = "LÃ¥st"
 loading = "Laster personer..."
 loginRequired = "Aktiver innloggingsmodus først"
 member = "Medlem"
@@ -7350,6 +8025,9 @@ searchMembers = "Søk i medlemmer..."
 status = "Status"
 team = "Team"
 title = "Personer"
+unlockAccount = "LÃ¥s opp konto"
+unlockUserError = "Kunne ikke låse opp brukerkonto"
+unlockUserSuccess = "Brukerkonto låst opp"
 user = "Bruker"
 
 [workspace.people.actions]
diff --git a/frontend/public/locales/pl-PL/translation.toml b/frontend/public/locales/pl-PL/translation.toml
index a4492189e6..069244dc90 100644
--- a/frontend/public/locales/pl-PL/translation.toml
+++ b/frontend/public/locales/pl-PL/translation.toml
@@ -8,6 +8,7 @@ black = "czarny"
 blue = "niebieski"
 bored = "Znudzony czekaniem?"
 cancel = "Anuluj"
+confirm = "Potwierdź"
 changedCredsMessage = "Dane logowanie zostały zmienione."
 chooseFile = "Wybierz plik"
 close = "Zamknij"
@@ -146,6 +147,7 @@ insufficientCredits = "Niewystarczająca liczba kredytów. Wymagane: {{requiredC
 loadingCredits = "Sprawdzanie kredytów..."
 loadingProStatus = "Sprawdzanie statusu subskrypcji..."
 noticeTopUpOrPlan = "Za mało kredytów, doładuj lub wybierz plan"
+accessInvite = "ZaproÅ›"
 
 [account]
 accountSettings = "Ustawienia konta"
@@ -1427,6 +1429,34 @@ title = "Przetwarzanie"
 description = "Maksymalny czas oczekiwania na zadanie przetwarzania przed zgłoszeniem błędu."
 label = "Limit przetwarzania (sekundy)"
 
+[admin.settings.storage]
+description = "Zarządzaj przechowywaniem na serwerze i opcjami udostępniania."
+title = "Przechowywanie plików i udostępnianie"
+
+[admin.settings.storage.enabled]
+description = "Zezwalaj użytkownikom na przechowywanie plików na serwerze."
+label = "Włącz przechowywanie plików na serwerze"
+
+[admin.settings.storage.sharing.email]
+description = "Zezwalaj na udostępnianie na podstawie adresu e-mail."
+label = "Włącz udostępnianie e-mailem"
+mailLink = "Skonfiguruj ustawienia poczty"
+mailNote = "Wymaga konfiguracji poczty. "
+
+[admin.settings.storage.sharing.enabled]
+description = "Zezwalaj użytkownikom na udostępnianie przechowywanych plików."
+label = "Włącz udostępnianie"
+
+[admin.settings.storage.sharing.links]
+description = "Zezwalaj na udostępnianie za pomocą linków wymagających zalogowania."
+frontendUrlLink = "Skonfiguruj w ustawieniach systemu"
+frontendUrlNote = "Wymaga Frontend URL. "
+label = "Włącz linki udostępniania"
+
+[admin.settings.storage.signing.enabled]
+description = "Zezwalaj użytkownikom na tworzenie wieloosobowych sesji podpisywania dokumentów. Wymaga włączonego przechowywania plików na serwerze."
+label = "WÅ‚Ä…cz podpisywanie grupowe (Alpha)"
+
 [admin.settings.unsavedChanges]
 cancel = "Kontynuuj edycjÄ™"
 discard = "Odrzuć zmiany"
@@ -2059,7 +2089,19 @@ numbers = "Liczby/zakresy: 5, 10-20"
 progressions = "Progresje: 3n, 4n+1"
 
 [certSign]
+allSigned = "Wszyscy uczestnicy podpisali. Gotowe do finalizacji."
+awaitingSignatures = "Oczekiwanie na podpisy"
+signatureProgress = "{{signedCount}}/{{totalCount}} podpisów"
 chooseCertificate = "Wybierz plik certyfikatu"
+declined = "Odrzucono"
+fetchFailed = "Nie udało się wczytać danych podpisu"
+finalized = "Sfinalizowano"
+notified = "OczekujÄ…ce"
+partialNote = "Możesz sfinalizować wcześniej, korzystając z aktualnych podpisów. Niepodpisani uczestnicy zostaną wykluczeni."
+pending = "OczekujÄ…ce"
+readyToFinalize = "Gotowe do finalizacji"
+signed = "Podpisano"
+viewed = "Wyświetlono"
 chooseJksFile = "Wybierz plik JKS"
 chooseP12File = "Wybierz plik PKCS12"
 choosePfxFile = "Wybierz plik PFX"
@@ -2082,6 +2124,7 @@ title = "Podpisywanie certyfikatem"
 invisible = "Niewidoczny"
 stepTitle = "WyglÄ…d podpisu"
 visible = "Widoczny"
+visibility = "Widoczność"
 
 [certSign.appearance.options]
 title = "Szczegóły podpisu"
@@ -2188,6 +2231,252 @@ bullet4 = "Może używać niestandardowych certyfikatów do weryfikacji"
 text = "Podczas sprawdzania podpisów narzędzie informuje, czy są ważne, kto podpisał dokument, kiedy został podpisany oraz czy dokument był zmieniany po podpisaniu."
 title = "Sprawdzanie podpisów"
 
+[certSign.collab.finalize]
+button = "Sfinalizuj i wczytaj podpisany PDF"
+early = "Sfinalizuj z aktualnymi podpisami"
+
+[certSign.collab.sessionDetail]
+addButton = "Dodaj uczestników"
+addParticipants = "Dodaj uczestników"
+addParticipantsError = "Nie udało się dodać uczestników"
+backToList = "Wróć do sesji"
+deleteConfirm = "Na pewno? Tej operacji nie można cofnąć."
+deleteError = "Nie udało się usunąć sesji"
+deleted = "Sesję usunięto"
+deleteSession = "Usuń sesję"
+dueDate = "Termin"
+finalizeError = "Nie udało się sfinalizować sesji"
+loadPdfError = "Nie udało się wczytać podpisanego PDF-a"
+loadSignedPdf = "Wczytaj podpisany PDF do aktywnych plików"
+messageLabel = "Wiadomość"
+noAdditionalInfo = "Brak dodatkowych informacji"
+owner = "Właściciel"
+participantRemoved = "Uczestnik usunięty"
+participants = "Uczestnicy"
+participantsAdded = "Pomyślnie dodano uczestników"
+removeParticipant = "Usuń"
+removeParticipantError = "Nie udało się usunąć uczestnika"
+selectUsers = "Wybierz użytkowników..."
+sessionInfo = "Informacje o sesji"
+workbenchTitle = "ZarzÄ…dzanie sesjÄ…"
+
+[certSign.collab.signRequest]
+addedToFiles = "Dokument dodany do aktywnych plików"
+addSignature = "Dodaj swój podpis"
+addToFiles = "Dodaj do aktywnych plików"
+advancedSettings = "Ustawienia zaawansowane"
+backToList = "Wróć do próśb o podpis"
+certificateChoice = "Wybierz certyfikat do podpisu"
+changeSignature = "Zmień podpis"
+clearSignature = "Wyczyść podpis"
+completeAndSign = "Zakończ i podpisz"
+createNewSignature = "Utwórz nowy podpis"
+declineButton = "Odrzuć"
+decline = "Odrzuć prośbę"
+deleteSelected = "Usuń wybrany podpis"
+drawSignature = "Narysuj swój podpis poniżej"
+dueDate = "Termin"
+fileTooLarge = "Rozmiar pliku musi być mniejszy niż 5MB"
+fontFamily = "Krój pisma"
+fontSize = "Rozmiar czcionki: {{size}}px"
+fontSizePlaceholder = "Rozmiar"
+from = "Od"
+invalidCertFile = "Wybierz plik certyfikatu P12 lub PFX"
+invalidFileType = "Wybierz plik obrazu"
+location = "Lokalizacja (opcjonalnie)"
+locationPlaceholder = "SkÄ…d podpisujesz?"
+message = "Wiadomość"
+noCertificate = "Wybierz plik certyfikatu"
+noSignatures = "Umieść co najmniej jeden podpis w pliku PDF"
+p12File = "Plik certyfikatu P12/PFX"
+password = "Hasło certyfikatu"
+passwordPlaceholder = "Wpisz hasło..."
+penColor = "Kolor pióra"
+penSize = "Rozmiar pióra: {{size}}px"
+placementActive = "Kliknij PDF, aby umieścić"
+placeSignatureButton = "Umieść podpis na PDF"
+reason = "Powód (opcjonalnie)"
+reasonPlaceholder = "Dlaczego podpisujesz?"
+removeImage = "Usuń obraz"
+removeCertFile = "Usuń plik"
+savedSignatures = "Zapisane podpisy"
+selectFile = "Wybierz plik obrazu"
+selectSignatureTitle = "Wybierz lub utwórz podpis"
+signButton = "Podpisz dokument"
+signatureInfo = "Te ustawienia są konfigurowane przez właściciela dokumentu"
+signaturePlaced = "Podpis umieszczony na stronie"
+signatureSettings = "Ustawienia podpisu"
+signatureText = "Tekst podpisu"
+signatureTextPlaceholder = "Wpisz swoje imiÄ™ i nazwisko..."
+signatureTypeLabel = "Typ podpisu"
+signingTitle = "Podpisywanie"
+textColor = "Kolor tekstu"
+typeSignature = "Wpisz swoje imię i nazwisko, aby utworzyć podpis"
+uploadCert = "WÅ‚asny certyfikat"
+uploadCertDesc = "Użyj własnego certyfikatu P12/PFX"
+uploadSignature = "Prześlij obraz swojego podpisu"
+usePersonalCert = "Certyfikat osobisty"
+usePersonalCertDesc = "Automatycznie generowany dla twojego konta"
+useServerCert = "Certyfikat organizacji"
+useServerCertDesc = "Współdzielony certyfikat organizacji"
+workbenchTitle = "Prośba o podpis"
+
+[certSign.collab.signRequest.canvas]
+colorPickerTitle = "Wybierz kolor linii"
+continue = "Kontynuuj"
+
+[certSign.collab.signRequest.certModal]
+description = "Umieszczono {{count}} podpisów. Wybierz certyfikat, aby zakończyć podpisywanie."
+sign = "Podpisz dokument"
+certValidating = "Weryfikowanie certyfikatu..."
+certValidUntil = "Certyfikat ważny do {{date}}"
+certInvalid = "Nieprawidłowy certyfikat: {{error}}"
+certInvalidFallback = "Nieprawidłowy certyfikat"
+certNetworkError = "Nie można zweryfikować certyfikatu"
+title = "Skonfiguruj certyfikat"
+
+[certSign.collab.signRequest.image]
+hint = "Prześlij obraz PNG lub JPG swojego podpisu"
+
+[certSign.collab.signRequest.mode]
+move = "Przesuń podpis"
+place = "Umieść podpis"
+title = "Tryb podpisywania lub przenoszenia"
+
+[certSign.collab.signRequest.modeTabs]
+draw = "Rysuj"
+image = "Prześlij"
+text = "Wpisz"
+
+[certSign.collab.signRequest.placeSignature]
+message = "Kliknij na PDF, aby umieścić podpis"
+title = "Umieść podpis"
+
+[certSign.collab.signRequest.preview]
+imageAlt = "Wybrany podpis"
+missing = "Brak podglÄ…du"
+textFallback = "Podpis"
+
+[certSign.collab.signRequest.saved]
+defaultCanvasLabel = "Rysowany podpis"
+defaultImageLabel = "Przesłany podpis"
+defaultLabel = "Podpis"
+defaultTextLabel = "Wpisany podpis"
+delete = "Usuń podpis"
+none = "Brak zapisanych podpisów"
+
+[certSign.collab.signRequest.signatureType]
+draw = "Rysuj"
+type = "Wpisz"
+upload = "Prześlij"
+
+[certSign.collab.signRequest.steps]
+back = "Wstecz"
+cancelPlacement = "Anuluj umieszczanie"
+certificate = "Certyfikat"
+clickMultipleTimes = "Kliknij na pliku PDF wielokrotnie, aby umieścić podpisy. Przeciągnij dowolny podpis, aby go przenieść lub zmienić rozmiar."
+clickToPlace = "Kliknij na pliku PDF w miejscu, w którym chcesz, aby pojawił się podpis."
+continue = "Kontynuuj do wyboru certyfikatu"
+continueToPlacement = "Kontynuuj do umieszczania"
+continueToReview = "Kontynuuj do przeglÄ…du"
+createSignature = "Utwórz podpis"
+invisible = "Niewidoczny"
+location = "Lokalizacja:"
+multipleSignatures = "Do pliku PDF zostanie zastosowanych {{count}} podpisów"
+oneSignature = "1 podpis zostanie zastosowany do pliku PDF"
+placeOnPdf = "Umieść na PDF"
+reason = "Powód:"
+reviewTitle = "Przejrzyj przed podpisaniem"
+signaturePlaced = "Podpis umieszczono na stronie {{page}}. Możesz dostosować położenie, klikając ponownie, lub przejść do przeglądu."
+visible = "Widoczny"
+visibility = "Widoczność:"
+yourSignatures = "Twoje podpisy ({{count}})"
+
+[certSign.collab.signRequest.text]
+colorLabel = "Kolor"
+fontLabel = "Czcionka"
+fontSizeLabel = "Rozmiar"
+fontSizePlaceholder = "16"
+label = "Tekst podpisu"
+modalHint = "Wpisz swoje imię i nazwisko, a następnie kliknij Kontynuuj, aby umieścić je na PDF."
+placeholder = "Wpisz swoje imiÄ™ i nazwisko..."
+
+[certSign.collab.participant]
+certValidating = "Weryfikowanie certyfikatu..."
+certValid = "✓ Certyfikat ważny"
+certValidUntil = " do {{date}}"
+certInvalid = "✗ {{error}}"
+certInvalidFallback = "Nieprawidłowy certyfikat"
+certNetworkError = "Nie można zweryfikować certyfikatu"
+
+[certSign.collab.addParticipants]
+add = "Dodaj {{count}} uczestników"
+back = "Wstecz"
+configureSignatures = "Skonfiguruj ustawienia podpisu"
+continue = "Kontynuuj do ustawień podpisu"
+reasonHelp = "Wstępnie ustaw powód podpisywania dla tych uczestników (opcjonalne, mogą zmienić podczas podpisywania)"
+reasonPlaceholder = "np. Akceptacja, PrzeglÄ…d..."
+selectUsers = "Wybierz użytkowników"
+
+[certSign.collab.sessionCreation]
+includeSummaryPage = "Dołącz stronę podsumowania podpisów"
+includeSummaryPageHelp = "Na końcu zostanie dodana strona podsumowania ze wszystkimi metadanymi podpisów. Pola podpisu cyfrowego na poszczególnych stronach zostaną ukryte (podpisy odręczne bez zmian)."
+
+[certSign.collab.sessionList]
+active = "Aktywne"
+finalized = "Sfinalizowane"
+
+[certSign.collab.signatureSettings]
+description = "Skonfiguruj wygląd podpisów dla wszystkich uczestników"
+title = "WyglÄ…d podpisu"
+
+[certSign.collab.userSelector]
+inviteUsers = "Dodaj użytkowników"
+loadError = "Nie udało się wczytać użytkowników"
+noTeam = "Brak zespołu"
+noUsers = "Nie znaleziono innych użytkowników."
+placeholder = "Wybierz użytkowników..."
+
+[certSign.mobile]
+panelActions = "Akcje"
+panelDocument = "Dokument"
+panelPeople = "Osoby"
+
+[certSign.sessions]
+deleted = "Sesję usunięto"
+fetchFailed = "Nie udało się wczytać szczegółów sesji"
+finalized = "SesjÄ™ sfinalizowano"
+loaded = "Wczytano podpisany PDF"
+pdfNotReady = "PDF nie jest gotowy"
+pdfNotReadyDesc = "Podpisany PDF jest generowany. Spróbuj ponownie za chwilę."
+
+[certificateChoice.tooltip]
+header = "Typy certyfikatów"
+
+[certificateChoice.tooltip.organization]
+bullet1 = "Zarządzany przez administratorów systemu"
+bullet2 = "Współdzielony między uprawnionymi użytkownikami"
+bullet3 = "Reprezentuje tożsamość firmy, nie osoby"
+bullet4 = "Najlepsze do: oficjalnych dokumentów, podpisów zespołowych"
+description = "Współdzielony certyfikat dostarczony przez twoją organizację. Używany do podpisywania w imieniu firmy."
+title = "Certyfikat organizacji"
+
+[certificateChoice.tooltip.personal]
+bullet1 = "Generowany automatycznie przy pierwszym użyciu"
+bullet2 = "Powiązany z twoim kontem użytkownika"
+bullet3 = "Nie może być współdzielony z innymi użytkownikami"
+bullet4 = "Najlepsze do: dokumentów osobistych, indywidualnej odpowiedzialności"
+description = "Automatycznie generowany certyfikat unikalny dla twojego konta użytkownika. Odpowiedni do indywidualnych podpisów."
+title = "Certyfikat osobisty"
+
+[certificateChoice.tooltip.upload]
+bullet1 = "Wymaga pliku P12/PFX i hasła"
+bullet2 = "Może być wydany przez zewnętrzne urzędy certyfikacji"
+bullet3 = "Wyższy poziom zaufania dla dokumentów prawnych"
+bullet4 = "Najlepsze do: prawnie wiążących umów, zewnętrznej weryfikacji"
+description = "Użyj własnego certyfikatu PKCS#12. Zapewnia pełną kontrolę nad właściwościami certyfikatu."
+title = "Prześlij własny P12"
+
 [changeCreds]
 changePassword = "Musisz zmienić domyślne dane logowania"
 changeUsername = "Zaktualizuj nazwę użytkownika. Zostaniesz wylogowany po aktualizacji."
@@ -3242,6 +3531,46 @@ totalSelected = "Razem wybrane"
 unsupported = "Nieobsługiwane"
 unzip = "Rozpakuj"
 uploadError = "Nie udało się przesłać niektórych plików."
+copyCreated = "Kopia zapisana na tym urzÄ…dzeniu."
+copyFailed = "Nie udało się utworzyć kopii."
+leaveShare = "Usuń z mojej listy"
+leaveShareFailed = "Nie udało się usunąć udostępnionego pliku."
+leaveShareSuccess = "Usunięto z listy udostępnionych."
+removeBoth = "Usuń z obu"
+removeFilePrompt = "Ten plik jest zapisany na tym urządzeniu i na twoim serwerze. Skąd chcesz go usunąć?"
+removeFileTitle = "Usuń plik"
+removeLocalOnly = "Tylko to urzÄ…dzenie"
+removeServerFailed = "Nie udało się usunąć pliku z serwera."
+removeServerOnly = "Tylko serwer"
+removeServerOnlyPrompt = "Ten plik jest przechowywany tylko na twoim serwerze. Czy chcesz usunąć go z serwera?"
+removeServerSuccess = "Usunięto z serwera."
+removeSharedPrompt = "Ten plik jest z tobą udostępniony. Możesz usunąć go z tego urządzenia lub z listy udostępnionych."
+removeSharedServerOnlyBlockedPrompt = "Ten plik jest z tobą udostępniony i przechowywany wyłącznie na serwerze."
+removeSharedServerOnlyPrompt = "Ten plik jest z tobą udostępniony i przechowywany wyłącznie na serwerze. Usunąć go z twojej listy?"
+changesNotUploaded = "Zmiany nie zostały przesłane"
+cloudFile = "Plik w chmurze"
+filterAll = "Wszystkie"
+filterLocal = "Lokalne"
+filterSharedByMe = "Udostępnione przeze mnie"
+filterSharedWithMe = "Udostępnione mi"
+lastSynced = "Ostatnia synchronizacja"
+localOnly = "Tylko lokalnie"
+makeCopy = "Utwórz kopię"
+owner = "Właściciel"
+ownerUnknown = "Nieznany"
+share = "Udostępnij"
+shareSelected = "Udostępnij wybrane"
+sharedByYou = "Udostępnione przez ciebie"
+sharedEditNoticeBody = "Nie masz praw edycji do wersji serwerowej tego pliku. Wszelkie zmiany zostanÄ… zapisane jako kopia lokalna."
+sharedEditNoticeConfirm = "Rozumiem"
+sharedEditNoticeTitle = "Serwerowa kopia tylko do odczytu"
+sharedWithYou = "Udostępnione tobie"
+sharing = "Udostępnianie"
+storageState = "Przechowywanie"
+synced = "Zsynchronizowano"
+updateOnServer = "Zaktualizuj na serwerze"
+uploadSelected = "Prześlij wybrane"
+uploadToServer = "Prześlij na serwer"
 
 [files]
 addFiles = "Dodaj pliki"
@@ -3367,6 +3696,77 @@ title = "O spłaszczaniu PDF-ów"
 discord = "Discord"
 issues = "GitHub"
 
+[groupSigning.tooltip]
+header = "O podpisywaniu grupowym"
+
+[groupSigning.tooltip.finalization]
+bullet1 = "Wszystkie podpisy są nakładane w ustalonej przez ciebie kolejności uczestników"
+bullet2 = "W razie potrzeby możesz sfinalizować z częściowymi podpisami"
+bullet3 = "Po finalizacji sesji nie można modyfikować"
+description = "Gdy wszyscy uczestnicy podpiszą (lub zdecydujesz się na wcześniejszą finalizację), możesz wygenerować ostateczny podpisany PDF."
+title = "Proces finalizacji"
+
+[groupSigning.tooltip.roles]
+bullet1 = "Właściciel (ty): Tworzy sesję, konfiguruje domyślne ustawienia podpisu, finalizuje dokument"
+bullet2 = "Uczestnicy: Tworzą swój podpis, wybierają certyfikat, umieszczają go na PDF"
+bullet3 = "Uczestnicy nie mogą modyfikować ustawień widoczności, powodu ani lokalizacji podpisu"
+description = "Kontrolujesz ustawienia wyglądu podpisu dla wszystkich uczestników."
+title = "Role uczestników"
+
+[groupSigning.tooltip.sequential]
+bullet1 = "Pierwszy uczestnik musi podpisać, zanim drugi uzyska dostęp do dokumentu"
+bullet2 = "Zapewnia właściwą kolejność podpisów dla zgodności prawnej"
+bullet3 = "Możesz zmienić kolejność uczestników, przeciągając ich na liście"
+description = "Uczestnicy podpisują dokumenty w ustalonej przez ciebie kolejności. Każdy otrzymuje powiadomienie, gdy przyjdzie jego kolej."
+title = "Sekwencyjne podpisywanie"
+
+[groupSigning.steps]
+back = "Wstecz"
+completed = "Zakończono"
+current = "Bieżący"
+stepLabel = "Krok {{number}}"
+
+[groupSigning.steps.configureDefaults]
+continue = "Kontynuuj do przeglÄ…du"
+invisible = "Podpisy będą niewidoczne (tylko metadane)"
+locationLabel = "Lokalizacja:"
+preview = "PodglÄ…d"
+reasonLabel = "Powód:"
+title = "Skonfiguruj ustawienia podpisu"
+visible = "Podpisy będą widoczne na stronie {{page}}"
+
+[groupSigning.steps.review]
+document = "Dokument"
+dueDate = "Termin (opcjonalnie)"
+dueDatePlaceholder = "Wybierz termin..."
+invisible = "Niewidoczne (tylko metadane)"
+location = "Lokalizacja:"
+logo = "Logo:"
+logoHidden = "Bez logo"
+logoShown = "Wyświetlane logo Stirling PDF"
+participants = "Uczestnicy"
+reason = "Powód:"
+send = "Wyślij prośby o podpis"
+signatureSettings = "Ustawienia podpisu"
+title = "Przejrzyj szczegóły sesji"
+titleShort = "Przegląd i wysyłka"
+visibility = "Widoczność:"
+visible = "Widoczne na stronie {{page}}"
+participantCount = "{{count}} uczestników będzie podpisywać w kolejności"
+
+[groupSigning.steps.selectDocument]
+continue = "Kontynuuj do wyboru uczestników"
+noFile = "Wybierz jeden plik PDF z aktywnych plików, aby utworzyć sesję podpisywania."
+selectedFile = "Wybrany dokument"
+title = "Wybierz dokument"
+
+[groupSigning.steps.selectParticipants]
+continue = "Kontynuuj do ustawień podpisu"
+count = "Wybrano {{count}} uczestników"
+label = "Wybierz uczestników"
+placeholder = "Wybierz uczestników do podpisu..."
+title = "Wybierz uczestników"
+
 [getPdfInfo]
 downloadJson = "Pobierz JSON z zawartością"
 downloads = "Pobrania"
@@ -4460,7 +4860,10 @@ zoomOut = "Pomniejsz"
 
 [viewer]
 cannotPreviewFile = "Nie można wyświetlić podglądu pliku"
+disableColorFilter = "Wyłącz filtr kolorów"
 dualPageView = "Widok dwóch stron"
+enableDarkFilter = "WÅ‚Ä…cz ciemny filtr"
+enableSepiaFilter = "WÅ‚Ä…cz filtr sepii"
 firstPage = "Pierwsza strona"
 lastPage = "Ostatnia strona"
 nextPage = "Następna strona"
@@ -4470,6 +4873,22 @@ singlePageView = "Widok pojedynczej strony"
 unknownFile = "Nieznany plik"
 zoomIn = "Powiększ"
 zoomOut = "Pomniejsz"
+resetZoom = "Resetuj powiększenie"
+
+[viewer.nonPdf]
+fileTypeBadge = "Plik {{type}}"
+convertToPdf = "Konwertuj do PDF"
+loading = "Wczytywanie..."
+emptyFile = "Pusty plik"
+csvStats = "{{rows}} wierszy · {{columns}} kolumn · {{size}}"
+sortedBy = "Sortowanie wg: {{column}}"
+columnDefault = "Kolumna {{index}}"
+htmlPreviewWarning = "Podgląd HTML — zasoby zewnętrzne mogą się nie załadować · {{size}}"
+htmlPreview = "PodglÄ…d HTML"
+invalidJson = "Nieprawidłowy JSON — wyświetlanie surowej zawartości"
+textStats = "{{lines}} wierszy · {{size}}"
+lineNumbers = "Numery wierszy"
+renderMarkdown = "Renderuj markdown"
 
 [viewer.attachments]
 title = "Załączniki"
@@ -4531,6 +4950,7 @@ toggleAttachments = "Pokaż/ukryj załączniki"
 toggleTheme = "Przełącz motyw"
 language = "Język"
 toggleAnnotations = "Przełącz widoczność adnotacji"
+toggleLayers = "Przełącz warstwy"
 search = "Szukaj w PDF"
 panMode = "Tryb przesuwania"
 applyRedactionsFirst = "Najpierw zastosuj zaczernienia"
@@ -5407,20 +5827,72 @@ title = "Drukuj plik"
 2 = "Wskaż drukarkę"
 
 [quickAccess]
+access = "Dostęp"
+accessAddPerson = "Dodaj kolejnÄ… osobÄ™"
+accessBack = "Wstecz"
+accessCopyLink = "Kopiuj link"
+accessEmail = "Adres e-mail"
+accessEmailPlaceholder = "name@company.com"
+accessFileLabel = "Plik"
+accessGeneral = "Dostęp ogólny"
+accessInviteTitle = "ZaproÅ› osoby"
+accessOwner = "Właściciel"
+accessPanel = "Dostęp do dokumentu"
+accessPeople = "Osoby z dostępem"
+accessRemove = "Usuń"
+accessRestricted = "Ograniczony"
+accessRestrictedHint = "Tylko osoby z dostępem mogą otworzyć"
+accessRole = "Rola"
+accessRoleCommenter = "KomentujÄ…cy"
+accessRoleEditor = "Edytor"
+accessRoleViewer = "PrzeglÄ…dajÄ…cy"
+accessSelectedFile = "Wybrany plik"
+accessSendInvite = "Wyślij zaproszenie"
+accessTitle = "Dostęp do dokumentu"
+accessYou = "Ty"
 account = "Konto"
+activeSessions = "Aktywne sesje"
+activeTab = "Aktywne"
 activity = "Historia"
 adminSettings = "Ustaw. admina"
+allSessions = "Wszystkie sesje"
 allTools = "All Tools"
 automate = "Auto"
+back = "Wstecz"
+certSign = "Podpis certyfikatem"
+completedSessions = "Zakończone sesje"
+completedTab = "Zakończone"
 config = "Konfig"
+createNew = "Utwórz nową prośbę"
+createSession = "Utwórz prośbę o podpis"
+dueDate = "Termin (opcjonalnie)"
 files = "Pliki"
 help = "Pomoc"
+noActiveSessions = "Brak oczekujących próśb o podpis ani aktywnych sesji"
+noCompletedSessions = "Brak zakończonych sesji"
+noFile = "Nie wybrano pliku"
 read = "Czytaj"
 reader = "Czytnik"
+refresh = "Odśwież"
+requestSignatures = "PoproÅ› o podpisy"
+selectSingleFileToRequest = "Wybierz jeden plik PDF, aby poprosić o podpisy"
+selectedFile = "Wybrany plik"
+selectUsers = "Wybierz użytkowników do podpisu"
+selectUsersPlaceholder = "Wybierz uczestników..."
+sendingRequest = "Wysyłanie..."
 settings = "Ustaw."
 showMeAround = "Pokaż mi, jak to działa"
 sign = "Podpis"
+signatureRequests = "Prośby o podpis"
+signYourself = "Podpisz samodzielnie"
+newRequest = "Nowa prośba"
 tours = "Przewodniki"
+wetSign = "Dodaj podpis"
+filterMine = "Moje"
+filterOverdue = "Zaległe"
+filterSigned = "Podpisane"
+filterDeclined = "Odrzucone"
+searchDocuments = "Szukaj dokumentów…"
 
 [quickAccess.helpMenu]
 adminTour = "Przewodnik administratora"
@@ -6050,11 +6522,75 @@ toolNotAvailableLocally = "Twój serwer Stirling-PDF jest offline, a \"{{endpoin
 expired = "Twoja sesja wygasła. Odśwież stronę i spróbuj ponownie."
 refreshPage = "Odśwież stronę"
 
+[sessionManagement.tooltip]
+header = "ZarzÄ…dzanie sesjami podpisywania"
+
+[sessionManagement.tooltip.addParticipants]
+bullet1 = "Nowi uczestnicy są dodawani na koniec kolejności podpisywania"
+bullet2 = "Nie można dodawać uczestników po sfinalizowaniu sesji"
+bullet3 = "Każdy uczestnik otrzymuje powiadomienie, gdy przyjdzie jego kolej"
+description = "Możesz dodawać kolejnych uczestników do aktywnej sesji w dowolnym momencie przed finalizacją."
+title = "Dodawanie uczestników"
+
+[sessionManagement.tooltip.finalization]
+bullet1 = "<b>Pełna finalizacja</b>: Wszyscy uczestnicy podpisali"
+bullet2 = "<b>Częściowa finalizacja</b>: Niektórzy uczestnicy jeszcze nie podpisali"
+bullet3 = "Uczestnicy bez podpisu zostanÄ… wykluczeni z finalnego dokumentu"
+bullet4 = "Po finalizacji możesz wczytać podpisany PDF do aktywnych plików"
+description = "Finalizacja łączy wszystkie podpisy w jednym podpisanym PDF-ie. Tej czynności nie można cofnąć."
+title = "Finalizacja sesji"
+
+[sessionManagement.tooltip.participantRemoval]
+bullet1 = "Nie można usuwać uczestników, którzy już podpisali"
+bullet2 = "Usunięci uczestnicy nie będą już otrzymywać powiadomień"
+bullet3 = "Kolejność podpisywania dostosuje się automatycznie"
+description = "Uczestników można usuwać z sesji przed ich podpisem."
+title = "Usuwanie uczestników"
+
+[sessionManagement.tooltip.signatureOrder]
+bullet1 = "Każdy podpis jest nakładany sekwencyjnie na PDF"
+bullet2 = "Późniejsi sygnatariusze widzą wcześniejsze podpisy"
+bullet3 = "Kluczowe dla procesów akceptacji i łańcucha dowodowego"
+description = "Kolejność określona podczas tworzenia sesji decyduje, kto podpisuje jako pierwszy."
+title = "Kolejność podpisów"
+
+[signatureSettings.tooltip]
+header = "Ustawienia wyglÄ…du podpisu"
+
+[signatureSettings.tooltip.location]
+bullet1 = "Przykłady: \"New York, USA\", \"London Office\", \"Remote\""
+bullet2 = "To nie to samo co położenie na stronie"
+bullet3 = "Może być wymagane w niektórych jurysdykcjach prawnych"
+description = "Opcjonalna lokalizacja geograficzna, gdzie złożono podpis. Zapisywana w metadanych certyfikatu."
+title = "Lokalizacja podpisu"
+
+[signatureSettings.tooltip.logo]
+bullet1 = "Wyświetlane obok podpisu i tekstu"
+bullet2 = "Obsługuje formaty PNG, JPG"
+bullet3 = "Podnosi profesjonalny wyglÄ…d"
+description = "Dodaj logo firmy do widocznych podpisów dla brandingu i autentyczności."
+title = "Logo firmy"
+
+[signatureSettings.tooltip.reason]
+bullet1 = "Przykłady: \"Approval\", \"Contract Agreement\", \"Review Complete\""
+bullet2 = "Widoczny we właściwościach podpisu PDF"
+bullet3 = "Przydatny dla audytu i zgodności"
+description = "Opcjonalny tekst wyjaśniający, dlaczego dokument jest podpisywany. Zapisywany w metadanych certyfikatu."
+title = "Powód podpisu"
+
+[signatureSettings.tooltip.visibility]
+bullet1 = "<b>Widoczny</b>: Podpis pojawia się na PDF z własnym wyglądem"
+bullet2 = "<b>Niewidoczny</b>: Certyfikat osadzony bez śladu wizualnego"
+bullet3 = "Niewidoczne podpisy nadal zapewniajÄ… kryptograficznÄ… walidacjÄ™"
+description = "Kontroluje, czy podpis jest widoczny na dokumencie, czy osadzony niewidocznie."
+title = "Widoczność podpisu"
+
 [settings.configuration]
 advanced = "Zaawansowane"
 database = "Baza danych"
 endpoints = "Endpointy"
 features = "Funkcje"
+storageSharing = "Przechowywanie plików i udostępnianie"
 systemSettings = "Ustawienia systemowe"
 title = "Konfiguracja"
 
@@ -6332,10 +6868,13 @@ title = "Zaloguj siÄ™ do Stirling"
 [setup.selfhosted]
 link = "lub połącz się z kontem hostowanym samodzielnie"
 subtitle = "Wprowadź dane logowania do serwera"
+changeServerLocked = "Twoja organizacja ograniczyła tę aplikację do określonego serwera"
 switchToLocal = "Użyj zamiast tego narzędzi lokalnych"
 title = "Zaloguj siÄ™ do serwera"
 
 [setup.selfhosted.unreachable]
+changeServer = "Połącz z innym serwerem"
+changeServerLocked = "Twoja organizacja ograniczyła tę aplikację do określonego serwera"
 continueOffline = "Użyj zamiast tego narzędzi lokalnych"
 message = "Nie można połączyć się z {{url}}. Sprawdź, czy serwer działa i jest dostępny."
 retry = "Ponów próbę"
@@ -6529,6 +7068,15 @@ saved = "Zapisane"
 text = "Tekst"
 title = "Typ podpisu"
 
+[signRequest]
+declined = "Prośba o podpis została odrzucona"
+fetchFailed = "Nie udało się wczytać prośby o podpis"
+signed = "Dokument pomyślnie podpisany"
+
+[signSession]
+createFailed = "Nie udało się utworzyć prośby o podpis"
+created = "Wysłano prośbę o podpis"
+
 [signup]
 accountCreatedSuccessfully = "Konto zostało utworzone! Teraz możesz się zalogować."
 alreadyHaveAccount = "Masz już konto? Zaloguj się"
@@ -6807,6 +7355,106 @@ title = "Podziel PDF według Rozdziałów"
 [splitPdfByChapters]
 tags = "podział, rozdziały, zakładki, porządkowanie, organizacja"
 
+[storageShare]
+accessed = "Uzyskano dostęp"
+accessDenied = "Nie masz dostępu do tego udostępnionego pliku. Poproś właściciela o udostępnienie."
+accessFailed = "Nie można wczytać aktywności."
+accessDeniedBody = "Nie masz dostępu do tego pliku. Poproś właściciela o udostępnienie."
+accessDeniedTitle = "Brak dostępu"
+accessLimitedCommenter = "Dostęp do komentowania już wkrótce. Poproś właściciela o dostęp edytora, jeśli potrzebujesz pobierania."
+accessLimitedTitle = "Ograniczony dostęp"
+accessLimitedViewer = "Ten link umożliwia tylko przeglądanie. Poproś właściciela o dostęp edytora, jeśli potrzebujesz pobierania."
+createdAt = "Utworzono"
+download = "Pobierz"
+downloadFailed = "Nie można pobrać tego pliku."
+expiredBody = "Ten link udostępniania jest nieprawidłowy lub wygasł."
+expiredTitle = "Link wygasł"
+goToLogin = "Przejdź do logowania"
+loadFailed = "Nie można otworzyć udostępnionego pliku."
+loading = "�adowanie linku udostępniania..."
+loginPrompt = "Zaloguj się, aby uzyskać dostęp do tego udostępnionego pliku."
+loginRequired = "Wymagane logowanie"
+openInApp = "Otwórz w Stirling PDF"
+ownerLabel = "Właściciel"
+ownerUnknown = "Nieznany"
+requiresLogin = "Ten udostępniony plik wymaga logowania."
+roleCommenter = "KomentujÄ…cy"
+roleEditor = "Edytor"
+roleViewer = "PrzeglÄ…dajÄ…cy"
+shareHeading = "Udostępniony plik"
+titleDefault = "Udostępniony plik"
+tryAgain = "Spróbuj ponownie później."
+addUser = "Dodaj"
+commenterHint = "Komentowanie już wkrótce."
+copied = "Link skopiowany do schowka"
+copy = "Kopiuj"
+copyFailed = "Kopiowanie nie powiodło się"
+description = "Utwórz link udostępniania dla tego pliku. Zalogowani użytkownicy z linkiem będą mieli do niego dostęp."
+downloadsCount = "Pobrania: {{count}}"
+emailWarningBody = "To wygląda na adres e-mail. Jeśli ta osoba nie jest użytkownikiem Stirling PDF, nie będzie mogła uzyskać dostępu do pliku."
+emailWarningConfirm = "Udostępnij mimo to"
+emailWarningTitle = "Adres e-mail"
+errorTitle = "Udostępnianie nie powiodło się"
+failure = "Nie można wygenerować linku udostępniania. Spróbuj ponownie."
+fileLabel = "Plik"
+generate = "Wygeneruj link"
+generated = "Wygenerowano link udostępniania"
+hideActivity = "Ukryj aktywność"
+invalidUsername = "Wpisz prawidłową nazwę użytkownika lub adres e-mail."
+lastAccessed = "Ostatni dostęp"
+linkAccessTitle = "Dostęp przez link udostępniania"
+linkLabel = "Link udostępniania"
+linksDisabled = "Linki udostępniania są wyłączone."
+linksDisabledBody = "Linki udostępniania są wyłączone przez ustawienia serwera."
+manage = "Zarządzaj udostępnianiem"
+manageDescription = "Twórz i zarządzaj linkami do udostępniania tego pliku."
+manageLoadFailed = "Nie można wczytać linków udostępniania."
+manageTitle = "Zarządzaj udostępnianiem"
+noActivity = "Brak aktywności."
+noLinks = "Brak aktywnych linków udostępniania."
+noSharedUsers = "Żaden użytkownik nie ma jeszcze dostępu."
+removeLink = "Usuń link"
+removeUser = "Usuń"
+revokeFailed = "Nie można usunąć linku udostępniania."
+revoked = "Usunięto link udostępniania"
+roleLabel = "Rola"
+sharingDisabled = "Udostępnianie jest wyłączone."
+sharingDisabledBody = "Udostępnianie zostało wyłączone w ustawieniach serwera."
+sharedUsersTitle = "Użytkownicy z dostępem"
+title = "Udostępnij plik"
+unknownUser = "Nieznany użytkownik"
+userAddFailed = "Nie można udostępnić temu użytkownikowi."
+userAdded = "Użytkownik dodany do listy udostępniania."
+usernameLabel = "Nazwa użytkownika lub e-mail"
+usernamePlaceholder = "Wprowadź nazwę użytkownika lub e-mail"
+userRemoveFailed = "Nie można usunąć tego użytkownika."
+userRemoved = "Użytkownik usunięty z listy udostępniania."
+viewActivity = "Wyświetl aktywność"
+viewed = "Wyświetlono"
+viewsCount = "Wyświetlenia: {{count}}"
+downloaded = "Pobrano"
+bulkDescription = "Utwórz jeden link, aby udostępnić wszystkie wybrane pliki zalogowanym użytkownikom."
+bulkTitle = "Udostępnij wybrane pliki"
+copyLink = "Kopiuj link udostępniania"
+fileCount = "Wybrano {{count}} plików"
+ownerOnly = "Tylko właściciel może zarządzać udostępnianiem."
+selectSingleFile = "Wybierz jeden plik, aby zarządzać udostępnianiem."
+
+[storageUpload]
+description = "To przesyła bieżący plik do magazynu serwera, aby uzyskać do niego dostęp."
+errorTitle = "Przesyłanie nie powiodło się"
+failure = "Przesyłanie nie powiodło się. Sprawdź swoje dane logowania i ustawienia magazynu."
+fileLabel = "Plik"
+hint = "Publiczne linki i tryby dostępu są kontrolowane przez ustawienia serwera."
+success = "Przesłano na serwer"
+title = "Prześlij na serwer"
+updateButton = "Zaktualizuj na serwerze"
+uploadButton = "Prześlij na serwer"
+bulkDescription = "To przesyła wybrane pliki do magazynu serwera."
+bulkTitle = "Prześlij wybrane pliki"
+fileCount = "Wybrano {{count}} plików"
+more = " +{{count}} więcej"
+
 [storage]
 approximateSize = "Przybliżony rozmiar"
 fileTooLarge = "Plik jest zbyt duży. Maksymalny rozmiar na plik to"
@@ -7153,6 +7801,30 @@ title = "PrzeglÄ…daj/Edytuj PDF"
 [warning]
 tooltipTitle = "Ostrzeżenie"
 
+[wetSignature.tooltip]
+header = "Metody tworzenia podpisu"
+
+[wetSignature.tooltip.draw]
+bullet1 = "Dostosuj kolor i grubość pióra"
+bullet2 = "Czyść i rysuj ponownie, aż będziesz zadowolony"
+bullet3 = "Działa na urządzeniach dotykowych (tablety, telefony)"
+description = "Utwórz odręczny podpis za pomocą myszy lub ekranu dotykowego. Najlepsze dla osobistych, autentycznych podpisów."
+title = "Narysuj podpis"
+
+[wetSignature.tooltip.type]
+bullet1 = "Wybierz spośród wielu czcionek"
+bullet2 = "Dostosuj rozmiar i kolor tekstu"
+bullet3 = "Idealne do ustandaryzowanych podpisów"
+description = "Wygeneruj podpis z wpisanego tekstu. Szybkie i spójne, odpowiednie do dokumentów biznesowych."
+title = "Wpisz podpis"
+
+[wetSignature.tooltip.upload]
+bullet1 = "Obsługuje PNG, JPG i inne formaty obrazów"
+bullet2 = "Zalecane są przezroczyste tła dla najlepszych efektów"
+bullet3 = "Obraz zostanie przeskalowany, aby dopasować do obszaru podpisu"
+description = "Prześlij wcześniej utworzony obraz podpisu. Idealne, jeśli masz zeskanowany podpis lub logo firmy."
+title = "Prześlij obraz podpisu"
+
 [watermark]
 completed = "Dodano znak wodny"
 desc = "Dodawaj znaki wodne tekstowe lub graficzne do plików PDF"
@@ -7333,6 +8005,7 @@ activeSession = "Aktywna sesja"
 addMembers = "Dodaj członków"
 admin = "Administrator"
 confirmDelete = "Czy na pewno chcesz usunąć tego użytkownika? Tej operacji nie można cofnąć."
+confirmUnlock = "Czy na pewno chcesz odblokować to konto użytkownika?"
 deleteUser = "Usuń użytkownika"
 deleteUserError = "Nie udało się usunąć użytkownika"
 deleteUserSuccess = "Użytkownik usunięty pomyślnie"
@@ -7341,6 +8014,8 @@ disable = "Wyłącz"
 disabled = "Wyłączony"
 editRole = "Edytuj rolÄ™"
 enable = "WÅ‚Ä…cz"
+locked = "zablokowane"
+lockedBadge = "Zablokowane"
 loading = "Wczytywanie osób..."
 loginRequired = "Najpierw włącz tryb logowania"
 member = "Członek"
@@ -7350,6 +8025,9 @@ searchMembers = "Szukaj członków..."
 status = "Status"
 team = "Zespół"
 title = "Osoby"
+unlockAccount = "Odblokuj konto"
+unlockUserError = "Nie udało się odblokować konta użytkownika"
+unlockUserSuccess = "Pomyślnie odblokowano konto użytkownika"
 user = "Użytkownik"
 
 [workspace.people.actions]
diff --git a/frontend/public/locales/pt-BR/translation.toml b/frontend/public/locales/pt-BR/translation.toml
index de281c0e15..355fcf4112 100644
--- a/frontend/public/locales/pt-BR/translation.toml
+++ b/frontend/public/locales/pt-BR/translation.toml
@@ -8,6 +8,7 @@ black = "Preto"
 blue = "Azul"
 bored = "Entediado? Clique aqui!"
 cancel = "Cancelar"
+confirm = "Confirmar"
 changedCredsMessage = "Credenciais alteradas!"
 chooseFile = "Escolher arquivo"
 close = "Fechar"
@@ -146,6 +147,7 @@ insufficientCredits = "Créditos insuficientes. Necessário: {{requiredCredits}}
 loadingCredits = "Verificando créditos..."
 loadingProStatus = "Verificando status da assinatura..."
 noticeTopUpOrPlan = "Créditos insuficientes; recarregue ou atualize para um plano"
+accessInvite = "Convidar"
 
 [account]
 accountSettings = "Configurações da Conta"
@@ -1427,6 +1429,34 @@ title = "Processamento"
 description = "Tempo máximo de espera por um trabalho de processamento antes de informar um erro."
 label = "Tempo limite de processamento (segundos)"
 
+[admin.settings.storage]
+description = "Controla as opções de armazenamento e compartilhamento do servidor."
+title = "Armazenamento e Compartilhamento de Arquivos"
+
+[admin.settings.storage.enabled]
+description = "Permitir que os usuários armazenem arquivos no servidor."
+label = "Ativar armazenamento de arquivos no servidor"
+
+[admin.settings.storage.sharing.email]
+description = "Permitir compartilhamento com endereços de e-mail."
+label = "Ativar compartilhamento por e-mail"
+mailLink = "Configurar e-mail"
+mailNote = "Requer configuração de e-mail. "
+
+[admin.settings.storage.sharing.enabled]
+description = "Permitir que os usuários compartilhem arquivos armazenados."
+label = "Ativar compartilhamento"
+
+[admin.settings.storage.sharing.links]
+description = "Permitir compartilhamento via links autenticados."
+frontendUrlLink = "Configurar nas configurações do sistema"
+frontendUrlNote = "Requer uma URL de Frontend. "
+label = "Ativar links de compartilhamento"
+
+[admin.settings.storage.signing.enabled]
+description = "Permitir que os usuários criem sessões de assinatura de documentos com vários participantes. Requer que o armazenamento de arquivos no servidor esteja ativado."
+label = "Ativar assinatura em grupo (Alpha)"
+
 [admin.settings.unsavedChanges]
 cancel = "Continuar editando"
 discard = "Descartar alterações"
@@ -2059,7 +2089,19 @@ numbers = "Números/intervalos: 5, 10-20"
 progressions = "Progressões: 3n, 4n+1"
 
 [certSign]
+allSigned = "Todos os participantes assinaram. Pronto para finalizar."
+awaitingSignatures = "Aguardando assinaturas"
+signatureProgress = "{{signedCount}}/{{totalCount}} assinaturas"
 chooseCertificate = "Escolher arquivo de certificado"
+declined = "Recusado"
+fetchFailed = "Falha ao carregar dados de assinatura"
+finalized = "Finalizado"
+notified = "Pendente"
+partialNote = "Você pode finalizar antes com as assinaturas atuais. Participantes que não assinaram serão excluídos."
+pending = "Pendente"
+readyToFinalize = "Pronto para finalizar"
+signed = "Assinado"
+viewed = "Visualizado"
 chooseJksFile = "Escolher arquivo JKS"
 chooseP12File = "Escolher arquivo PKCS12"
 choosePfxFile = "Escolher arquivo PFX"
@@ -2082,6 +2124,7 @@ title = "Assinatura com Certificado"
 invisible = "Invisível"
 stepTitle = "Aparência da assinatura"
 visible = "Visível"
+visibility = "Visibilidade"
 
 [certSign.appearance.options]
 title = "Detalhes da assinatura"
@@ -2188,6 +2231,252 @@ bullet4 = "Pode usar certificados personalizados para verificação"
 text = "Ao verificar as assinaturas, a ferramenta informa se são válidas, quem assinou o documento, quando foi assinado e se o documento foi alterado desde a assinatura."
 title = "Verificando assinaturas"
 
+[certSign.collab.finalize]
+button = "Finalizar e carregar PDF assinado"
+early = "Finalizar com as assinaturas atuais"
+
+[certSign.collab.sessionDetail]
+addButton = "Adicionar participantes"
+addParticipants = "Adicionar participantes"
+addParticipantsError = "Falha ao adicionar participantes"
+backToList = "Voltar para sessões"
+deleteConfirm = "Tem certeza? Isso não pode ser desfeito."
+deleteError = "Falha ao excluir sessão"
+deleted = "Sessão excluída"
+deleteSession = "Excluir sessão"
+dueDate = "Data de vencimento"
+finalizeError = "Falha ao finalizar sessão"
+loadPdfError = "Falha ao carregar o PDF assinado"
+loadSignedPdf = "Carregar PDF assinado em arquivos ativos"
+messageLabel = "Mensagem"
+noAdditionalInfo = "Sem informações adicionais"
+owner = "Proprietário"
+participantRemoved = "Participante removido"
+participants = "Participantes"
+participantsAdded = "Participantes adicionados com sucesso"
+removeParticipant = "Remover"
+removeParticipantError = "Falha ao remover participante"
+selectUsers = "Selecionar usuários..."
+sessionInfo = "Informações da sessão"
+workbenchTitle = "Gerenciamento da sessão"
+
+[certSign.collab.signRequest]
+addedToFiles = "Documento adicionado aos arquivos ativos"
+addSignature = "Adicionar sua assinatura"
+addToFiles = "Adicionar aos arquivos ativos"
+advancedSettings = "Configurações avançadas"
+backToList = "Voltar para solicitações de assinatura"
+certificateChoice = "Selecione um certificado para assinar"
+changeSignature = "Alterar assinatura"
+clearSignature = "Limpar assinatura"
+completeAndSign = "Concluir e assinar"
+createNewSignature = "Criar nova assinatura"
+declineButton = "Recusar"
+decline = "Recusar solicitação"
+deleteSelected = "Excluir assinatura selecionada"
+drawSignature = "Desenhe sua assinatura abaixo"
+dueDate = "Data de vencimento"
+fileTooLarge = "O tamanho do arquivo deve ser menor que 5MB"
+fontFamily = "Família da fonte"
+fontSize = "Tamanho da fonte: {{size}}px"
+fontSizePlaceholder = "Tamanho"
+from = "De"
+invalidCertFile = "Selecione um arquivo de certificado P12 ou PFX"
+invalidFileType = "Selecione um arquivo de imagem"
+location = "Localização (opcional)"
+locationPlaceholder = "De onde você está assinando?"
+message = "Mensagem"
+noCertificate = "Selecione um arquivo de certificado"
+noSignatures = "Coloque ao menos uma assinatura no PDF"
+p12File = "Arquivo de certificado P12/PFX"
+password = "Senha do certificado"
+passwordPlaceholder = "Digite a senha..."
+penColor = "Cor da caneta"
+penSize = "Tamanho da caneta: {{size}}px"
+placementActive = "Clique no PDF para posicionar"
+placeSignatureButton = "Colocar assinatura no PDF"
+reason = "Motivo (opcional)"
+reasonPlaceholder = "Por que você está assinando?"
+removeImage = "Remover imagem"
+removeCertFile = "Remover arquivo"
+savedSignatures = "Assinaturas salvas"
+selectFile = "Selecionar arquivo de imagem"
+selectSignatureTitle = "Selecionar ou criar assinatura"
+signButton = "Assinar documento"
+signatureInfo = "Essas configurações são definidas pelo proprietário do documento"
+signaturePlaced = "Assinatura colocada na página"
+signatureSettings = "Configurações de assinatura"
+signatureText = "Texto da assinatura"
+signatureTextPlaceholder = "Digite seu nome..."
+signatureTypeLabel = "Tipo de assinatura"
+signingTitle = "Assinatura"
+textColor = "Cor do texto"
+typeSignature = "Digite seu nome para criar uma assinatura"
+uploadCert = "Certificado personalizado"
+uploadCertDesc = "Use seu próprio certificado P12/PFX"
+uploadSignature = "Enviar imagem da sua assinatura"
+usePersonalCert = "Certificado pessoal"
+usePersonalCertDesc = "Gerado automaticamente para sua conta"
+useServerCert = "Certificado da organização"
+useServerCertDesc = "Certificado compartilhado da organização"
+workbenchTitle = "Solicitação de assinatura"
+
+[certSign.collab.signRequest.canvas]
+colorPickerTitle = "Escolher cor do traço"
+continue = "Continuar"
+
+[certSign.collab.signRequest.certModal]
+description = "Você colocou {{count}} assinatura(s). Escolha seu certificado para concluir a assinatura."
+sign = "Assinar documento"
+certValidating = "Validando certificado..."
+certValidUntil = "Certificado válido até {{date}}"
+certInvalid = "Certificado inválido: {{error}}"
+certInvalidFallback = "Certificado inválido"
+certNetworkError = "Não foi possível validar o certificado"
+title = "Configurar certificado"
+
+[certSign.collab.signRequest.image]
+hint = "Envie uma imagem PNG ou JPG da sua assinatura"
+
+[certSign.collab.signRequest.mode]
+move = "Mover assinatura"
+place = "Colocar assinatura"
+title = "Modo de assinar ou mover"
+
+[certSign.collab.signRequest.modeTabs]
+draw = "Desenhar"
+image = "Enviar"
+text = "Digitar"
+
+[certSign.collab.signRequest.placeSignature]
+message = "Clique no PDF para posicionar sua assinatura"
+title = "Colocar assinatura"
+
+[certSign.collab.signRequest.preview]
+imageAlt = "Assinatura selecionada"
+missing = "Sem prévia"
+textFallback = "Assinatura"
+
+[certSign.collab.signRequest.saved]
+defaultCanvasLabel = "Assinatura desenhada"
+defaultImageLabel = "Assinatura enviada"
+defaultLabel = "Assinatura"
+defaultTextLabel = "Assinatura digitada"
+delete = "Excluir assinatura"
+none = "Nenhuma assinatura salva"
+
+[certSign.collab.signRequest.signatureType]
+draw = "Desenhar"
+type = "Digitar"
+upload = "Enviar"
+
+[certSign.collab.signRequest.steps]
+back = "Voltar"
+cancelPlacement = "Cancelar posicionamento"
+certificate = "Certificado"
+clickMultipleTimes = "Clique várias vezes no PDF para posicionar assinaturas. Arraste qualquer assinatura para mover ou redimensionar."
+clickToPlace = "Clique no PDF onde você deseja que sua assinatura apareça."
+continue = "Continuar para seleção de certificado"
+continueToPlacement = "Continuar para posicionamento"
+continueToReview = "Continuar para revisão"
+createSignature = "Criar assinatura"
+invisible = "Invisível"
+location = "Localização:"
+multipleSignatures = "{{count}} assinaturas serão aplicadas ao PDF"
+oneSignature = "1 assinatura será aplicada ao PDF"
+placeOnPdf = "Colocar no PDF"
+reason = "Motivo:"
+reviewTitle = "Revisar antes de assinar"
+signaturePlaced = "Assinatura colocada na página {{page}}. Você pode ajustar a posição clicando novamente ou continuar para a revisão."
+visible = "Visível"
+visibility = "Visibilidade:"
+yourSignatures = "Suas assinaturas ({{count}})"
+
+[certSign.collab.signRequest.text]
+colorLabel = "Cor"
+fontLabel = "Fonte"
+fontSizeLabel = "Tamanho"
+fontSizePlaceholder = "16"
+label = "Texto da assinatura"
+modalHint = "Digite seu nome e clique em Continuar para posicioná-lo no PDF."
+placeholder = "Digite seu nome..."
+
+[certSign.collab.participant]
+certValidating = "Validando certificado..."
+certValid = "✓ Certificado válido"
+certValidUntil = " até {{date}}"
+certInvalid = "✗ {{error}}"
+certInvalidFallback = "Certificado inválido"
+certNetworkError = "Não foi possível validar o certificado"
+
+[certSign.collab.addParticipants]
+add = "Adicionar {{count}} participante(s)"
+back = "Voltar"
+configureSignatures = "Configurar as configurações de assinatura"
+continue = "Continuar para configurações de assinatura"
+reasonHelp = "Predefina um motivo de assinatura para estes participantes (opcional; eles podem alterar ao assinar)"
+reasonPlaceholder = "ex.: Aprovação, Revisão..."
+selectUsers = "Selecionar usuários"
+
+[certSign.collab.sessionCreation]
+includeSummaryPage = "Incluir página de resumo de assinaturas"
+includeSummaryPageHelp = "Uma página de resumo será adicionada ao final com todos os metadados de assinatura. As caixas de assinatura do certificado digital nas páginas individuais serão suprimidas (assinaturas manuscritas não são afetadas)."
+
+[certSign.collab.sessionList]
+active = "Ativa"
+finalized = "Finalizada"
+
+[certSign.collab.signatureSettings]
+description = "Configurar como as assinaturas aparecerão para todos os participantes"
+title = "Aparência da assinatura"
+
+[certSign.collab.userSelector]
+inviteUsers = "Adicionar usuários"
+loadError = "Falha ao carregar usuários"
+noTeam = "Sem equipe"
+noUsers = "Nenhum outro usuário encontrado."
+placeholder = "Selecionar usuários..."
+
+[certSign.mobile]
+panelActions = "Ações"
+panelDocument = "Documento"
+panelPeople = "Pessoas"
+
+[certSign.sessions]
+deleted = "Sessão excluída"
+fetchFailed = "Falha ao carregar detalhes da sessão"
+finalized = "Sessão finalizada"
+loaded = "PDF assinado carregado"
+pdfNotReady = "PDF não está pronto"
+pdfNotReadyDesc = "O PDF assinado está sendo gerado. Tente novamente em instantes."
+
+[certificateChoice.tooltip]
+header = "Tipos de certificado"
+
+[certificateChoice.tooltip.organization]
+bullet1 = "Gerenciado pelos administradores do sistema"
+bullet2 = "Compartilhado entre usuários autorizados"
+bullet3 = "Representa a identidade da empresa, não do indivíduo"
+bullet4 = "Melhor para: Documentos oficiais, assinaturas de equipe"
+description = "Um certificado compartilhado fornecido pela sua organização. Usado para autoridade de assinatura em nível da empresa."
+title = "Certificado da organização"
+
+[certificateChoice.tooltip.personal]
+bullet1 = "Gerado automaticamente no primeiro uso"
+bullet2 = "Vinculado à sua conta de usuário"
+bullet3 = "Não pode ser compartilhado com outros usuários"
+bullet4 = "Melhor para: Documentos pessoais, responsabilidade individual"
+description = "Um certificado gerado automaticamente, exclusivo para sua conta de usuário. Adequado para assinaturas individuais."
+title = "Certificado pessoal"
+
+[certificateChoice.tooltip.upload]
+bullet1 = "Requer arquivo P12/PFX e senha"
+bullet2 = "Pode ser emitido por Autoridades Certificadoras externas"
+bullet3 = "Maior nível de confiança para documentos legais"
+bullet4 = "Melhor para: Contratos legalmente vinculantes, validação externa"
+description = "Use seu próprio certificado PKCS#12. Fornece controle total sobre as propriedades do certificado."
+title = "Enviar P12 personalizado"
+
 [changeCreds]
 changePassword = "Você está usando as credenciais padrões. Por favor, insira uma nova senha"
 changeUsername = "Atualize seu nome de usuário. Você será desconectado após a atualização."
@@ -3242,6 +3531,46 @@ totalSelected = "Total selecionado"
 unsupported = "Não suportado"
 unzip = "Descompactar"
 uploadError = "Falha ao fazer upload de alguns arquivos."
+copyCreated = "Cópia salva neste dispositivo."
+copyFailed = "Não foi possível criar uma cópia."
+leaveShare = "Remover da minha lista"
+leaveShareFailed = "Não foi possível remover o arquivo compartilhado."
+leaveShareSuccess = "Removido da sua lista de compartilhados."
+removeBoth = "Remover de ambos"
+removeFilePrompt = "Este arquivo está salvo neste dispositivo e no seu servidor. De onde você deseja removê-lo?"
+removeFileTitle = "Remover arquivo"
+removeLocalOnly = "Apenas neste dispositivo"
+removeServerFailed = "Não foi possível remover o arquivo do servidor."
+removeServerOnly = "Apenas no servidor"
+removeServerOnlyPrompt = "Este arquivo está armazenado apenas no seu servidor. Deseja removê-lo do servidor?"
+removeServerSuccess = "Removido do servidor."
+removeSharedPrompt = "Este arquivo foi compartilhado com você. Você pode removê-lo deste dispositivo ou da sua lista de compartilhados."
+removeSharedServerOnlyBlockedPrompt = "Este arquivo foi compartilhado com você e está armazenado apenas no servidor."
+removeSharedServerOnlyPrompt = "Este arquivo foi compartilhado com você e está armazenado apenas no servidor. Removê-lo da sua lista?"
+changesNotUploaded = "Alterações não enviadas"
+cloudFile = "Arquivo na nuvem"
+filterAll = "Todos"
+filterLocal = "Local"
+filterSharedByMe = "Compartilhados por mim"
+filterSharedWithMe = "Compartilhados comigo"
+lastSynced = "Última sincronização"
+localOnly = "Apenas local"
+makeCopy = "Fazer uma cópia"
+owner = "Proprietário"
+ownerUnknown = "Desconhecido"
+share = "Compartilhar"
+shareSelected = "Compartilhar selecionados"
+sharedByYou = "Compartilhado por você"
+sharedEditNoticeBody = "Você não tem direitos de edição na versão do servidor deste arquivo. Quaisquer edições serão salvas como uma cópia local."
+sharedEditNoticeConfirm = "Entendi"
+sharedEditNoticeTitle = "Cópia somente leitura no servidor"
+sharedWithYou = "Compartilhado com você"
+sharing = "Compartilhamento"
+storageState = "Armazenamento"
+synced = "Sincronizado"
+updateOnServer = "Atualizar no servidor"
+uploadSelected = "Enviar selecionados"
+uploadToServer = "Enviar para o servidor"
 
 [files]
 addFiles = "Adicionar arquivos"
@@ -3367,6 +3696,77 @@ title = "Sobre o achatamento de PDFs"
 discord = "Discord"
 issues = "GitHub"
 
+[groupSigning.tooltip]
+header = "Sobre assinatura em grupo"
+
+[groupSigning.tooltip.finalization]
+bullet1 = "Todas as assinaturas são aplicadas na ordem de participantes que você especificou"
+bullet2 = "Você pode finalizar com assinaturas parciais, se necessário"
+bullet3 = "Depois de finalizada, a sessão não pode ser modificada"
+description = "Quando todos os participantes tiverem assinado (ou você optar por finalizar antes), você pode gerar o PDF final assinado."
+title = "Processo de finalização"
+
+[groupSigning.tooltip.roles]
+bullet1 = "Proprietário (você): Cria a sessão, configura padrões de assinatura, finaliza o documento"
+bullet2 = "Participantes: Criam sua assinatura, escolhem o certificado, posicionam no PDF"
+bullet3 = "Participantes não podem modificar as configurações de visibilidade, motivo ou localização da assinatura"
+description = "Você controla as configurações de aparência da assinatura para todos os participantes."
+title = "Papéis dos participantes"
+
+[groupSigning.tooltip.sequential]
+bullet1 = "O primeiro participante deve assinar antes que o segundo possa acessar o documento"
+bullet2 = "Garante a ordem de assinatura adequada para conformidade legal"
+bullet3 = "Você pode reordenar os participantes arrastando-os na lista"
+description = "Os participantes assinam os documentos na ordem que você especificar. Cada assinante recebe uma notificação quando é sua vez."
+title = "Assinatura sequencial"
+
+[groupSigning.steps]
+back = "Voltar"
+completed = "Concluído"
+current = "Atual"
+stepLabel = "Etapa {{number}}"
+
+[groupSigning.steps.configureDefaults]
+continue = "Continuar para revisão"
+invisible = "As assinaturas serão invisíveis (apenas metadados)"
+locationLabel = "Localização:"
+preview = "Prévia"
+reasonLabel = "Motivo:"
+title = "Configurar configurações de assinatura"
+visible = "As assinaturas serão visíveis na página {{page}}"
+
+[groupSigning.steps.review]
+document = "Documento"
+dueDate = "Data de vencimento (opcional)"
+dueDatePlaceholder = "Selecione a data de vencimento..."
+invisible = "Invisível (apenas metadados)"
+location = "Localização:"
+logo = "Logotipo:"
+logoHidden = "Sem logotipo"
+logoShown = "Logotipo da Stirling PDF exibido"
+participants = "Participantes"
+reason = "Motivo:"
+send = "Enviar solicitações de assinatura"
+signatureSettings = "Configurações de assinatura"
+title = "Revisar detalhes da sessão"
+titleShort = "Revisar e enviar"
+visibility = "Visibilidade:"
+visible = "Visível na página {{page}}"
+participantCount = "{{count}} participante(s) assinará(ão) em ordem"
+
+[groupSigning.steps.selectDocument]
+continue = "Continuar para seleção de participantes"
+noFile = "Selecione um único arquivo PDF dos seus arquivos ativos para criar uma sessão de assinatura."
+selectedFile = "Documento selecionado"
+title = "Selecionar documento"
+
+[groupSigning.steps.selectParticipants]
+continue = "Continuar para configurações de assinatura"
+count = "{{count}} participante(s) selecionado(s)"
+label = "Selecionar participantes"
+placeholder = "Escolha os participantes para assinar..."
+title = "Escolher participantes"
+
 [getPdfInfo]
 downloadJson = "Baixar JSON"
 downloads = "Downloads"
@@ -4460,7 +4860,10 @@ zoomOut = "Reduzir"
 
 [viewer]
 cannotPreviewFile = "Não é possível visualizar o arquivo"
+disableColorFilter = "Desativar filtro de cor"
 dualPageView = "Visualização de duas páginas"
+enableDarkFilter = "Ativar filtro escuro"
+enableSepiaFilter = "Ativar filtro sépia"
 firstPage = "Primeira página"
 lastPage = "Última página"
 nextPage = "Próxima página"
@@ -4470,6 +4873,22 @@ singlePageView = "Visualização de página única"
 unknownFile = "Arquivo desconhecido"
 zoomIn = "Ampliar"
 zoomOut = "Reduzir"
+resetZoom = "Redefinir zoom"
+
+[viewer.nonPdf]
+fileTypeBadge = "Arquivo {{type}}"
+convertToPdf = "Converter para PDF"
+loading = "Carregando..."
+emptyFile = "Arquivo vazio"
+csvStats = "{{rows}} linhas · {{columns}} colunas · {{size}}"
+sortedBy = "Ordenado por: {{column}}"
+columnDefault = "Coluna {{index}}"
+htmlPreviewWarning = "Prévia de HTML — recursos externos podem não carregar · {{size}}"
+htmlPreview = "Prévia de HTML"
+invalidJson = "JSON inválido — exibindo conteúdo bruto"
+textStats = "{{lines}} linhas · {{size}}"
+lineNumbers = "Números de linha"
+renderMarkdown = "Renderizar markdown"
 
 [viewer.attachments]
 title = "Anexos"
@@ -4531,6 +4950,7 @@ toggleAttachments = "Alternar anexos"
 toggleTheme = "Alternar tema"
 language = "Idioma"
 toggleAnnotations = "Alternar visibilidade das anotações"
+toggleLayers = "Alternar camadas"
 search = "Pesquisar PDF"
 panMode = "Modo de panorâmica"
 applyRedactionsFirst = "Aplicar redações primeiro"
@@ -5407,20 +5827,72 @@ title = "Imprimir arquivo"
 2 = "Digite o nome da impressora"
 
 [quickAccess]
+access = "Acesso"
+accessAddPerson = "Adicionar outra pessoa"
+accessBack = "Voltar"
+accessCopyLink = "Copiar link"
+accessEmail = "Endereço de e-mail"
+accessEmailPlaceholder = "nome@empresa.com"
+accessFileLabel = "Arquivo"
+accessGeneral = "Acesso geral"
+accessInviteTitle = "Convidar pessoas"
+accessOwner = "Proprietário"
+accessPanel = "Acesso ao documento"
+accessPeople = "Pessoas com acesso"
+accessRemove = "Remover"
+accessRestricted = "Restrito"
+accessRestrictedHint = "Apenas pessoas com acesso podem abrir"
+accessRole = "Função"
+accessRoleCommenter = "Comentarista"
+accessRoleEditor = "Editor"
+accessRoleViewer = "Visualizador"
+accessSelectedFile = "Arquivo selecionado"
+accessSendInvite = "Enviar convite"
+accessTitle = "Acesso ao documento"
+accessYou = "Você"
 account = "Conta"
+activeSessions = "Sessões ativas"
+activeTab = "Ativas"
 activity = "Ativ."
 adminSettings = "Ajustes admin"
+allSessions = "Todas as sessões"
 allTools = "Ferram."
 automate = "Automat."
+back = "Voltar"
+certSign = "Assinatura com certificado"
+completedSessions = "Sessões concluídas"
+completedTab = "Concluídas"
 config = "Config"
+createNew = "Criar nova solicitação"
+createSession = "Criar solicitação de assinatura"
+dueDate = "Data de vencimento (opcional)"
 files = "Arquivos"
 help = "Ajuda"
+noActiveSessions = "Nenhuma solicitação pendente ou sessão ativa"
+noCompletedSessions = "Nenhuma sessão concluída"
+noFile = "Nenhum arquivo selecionado"
 read = "Ler"
 reader = "Leitor"
+refresh = "Atualizar"
+requestSignatures = "Solicitar assinaturas"
+selectSingleFileToRequest = "Selecione um único arquivo PDF para solicitar assinaturas"
+selectedFile = "Arquivo selecionado"
+selectUsers = "Selecionar usuários para assinar"
+selectUsersPlaceholder = "Escolha os participantes..."
+sendingRequest = "Enviando..."
 settings = "Ajustes"
 showMeAround = "Faça um tour"
 sign = "Assinar"
+signatureRequests = "Solicitações de assinatura"
+signYourself = "Assinar você mesmo"
+newRequest = "Nova solicitação"
 tours = "Tours"
+wetSign = "Adicionar assinatura"
+filterMine = "Meus"
+filterOverdue = "Em atraso"
+filterSigned = "Assinadas"
+filterDeclined = "Recusadas"
+searchDocuments = "Pesquisar documentos…"
 
 [quickAccess.helpMenu]
 adminTour = "Tour do administrador"
@@ -6050,11 +6522,75 @@ toolNotAvailableLocally = "Seu servidor Stirling-PDF está offline e \"{{endpoin
 expired = "Sua sessão expirou. Por gentileza atualize a página e tente novamente."
 refreshPage = "Atualizar Página"
 
+[sessionManagement.tooltip]
+header = "Gerenciando sessões de assinatura"
+
+[sessionManagement.tooltip.addParticipants]
+bullet1 = "Novos participantes adicionados ao final da ordem de assinatura"
+bullet2 = "Não é possível adicionar participantes após a finalização da sessão"
+bullet3 = "Cada participante recebe uma notificação quando é sua vez"
+description = "Você pode adicionar mais participantes a uma sessão ativa a qualquer momento antes da finalização."
+title = "Adicionando participantes"
+
+[sessionManagement.tooltip.finalization]
+bullet1 = "<b>Finalização completa</b>: Todos os participantes assinaram"
+bullet2 = "<b>Finalização parcial</b>: Alguns participantes ainda não assinaram"
+bullet3 = "Participantes que não assinaram serão excluídos do documento final"
+bullet4 = "Depois de finalizada, você pode carregar o PDF assinado nos arquivos ativos"
+description = "A finalização combina todas as assinaturas em um único PDF assinado. Essa ação não pode ser desfeita."
+title = "Finalização da sessão"
+
+[sessionManagement.tooltip.participantRemoval]
+bullet1 = "Não é possível remover participantes que já assinaram"
+bullet2 = "Participantes removidos não recebem mais notificações"
+bullet3 = "A ordem de assinatura é ajustada automaticamente"
+description = "Participantes podem ser removidos das sessões antes de assinarem."
+title = "Removendo participantes"
+
+[sessionManagement.tooltip.signatureOrder]
+bullet1 = "Cada assinatura é aplicada sequencialmente ao PDF"
+bullet2 = "Assinantes posteriores podem ver assinaturas anteriores"
+bullet3 = "Crítico para fluxos de aprovação e cadeias de custódia legais"
+description = "A ordem que você especifica ao criar a sessão determina quem assina primeiro."
+title = "Ordem de assinatura"
+
+[signatureSettings.tooltip]
+header = "Configurações de aparência da assinatura"
+
+[signatureSettings.tooltip.location]
+bullet1 = "Exemplos: \"New York, USA\", \"London Office\", \"Remote\""
+bullet2 = "Não é o mesmo que a posição na página"
+bullet3 = "Pode ser exigido por certas jurisdições legais"
+description = "Localização geográfica opcional onde a assinatura foi aplicada. Armazenada nos metadados do certificado."
+title = "Localização da assinatura"
+
+[signatureSettings.tooltip.logo]
+bullet1 = "Exibido junto da assinatura e do texto"
+bullet2 = "Compatível com formatos PNG, JPG"
+bullet3 = "Melhora a aparência profissional"
+description = "Adicione um logotipo da empresa às assinaturas visíveis para branding e autenticidade."
+title = "Logotipo da empresa"
+
+[signatureSettings.tooltip.reason]
+bullet1 = "Exemplos: \"Aprovação\", \"Acordo de Contrato\", \"Revisão Concluída\""
+bullet2 = "Visível nas propriedades de assinatura do PDF"
+bullet3 = "Útil para trilhas de auditoria e conformidade"
+description = "Texto opcional explicando por que o documento está sendo assinado. Armazenado nos metadados do certificado."
+title = "Motivo da assinatura"
+
+[signatureSettings.tooltip.visibility]
+bullet1 = "<b>Visível</b>: A assinatura aparece no PDF com aparência personalizada"
+bullet2 = "<b>Invisível</b>: Certificado incorporado sem marca visual"
+bullet3 = "Assinaturas invisíveis ainda fornecem validação criptográfica"
+description = "Controla se a assinatura é visível no documento ou incorporada de forma invisível."
+title = "Visibilidade da assinatura"
+
 [settings.configuration]
 advanced = "Avançado"
 database = "Banco de dados"
 endpoints = "Endpoints"
 features = "Recursos"
+storageSharing = "Armazenamento e compartilhamento de arquivos"
 systemSettings = "Configurações do sistema"
 title = "Configuração"
 
@@ -6332,10 +6868,13 @@ title = "Entrar no Stirling"
 [setup.selfhosted]
 link = "ou conecte-se a uma conta auto-hospedada"
 subtitle = "Informe suas credenciais do servidor"
+changeServerLocked = "Sua organização restringiu este aplicativo a um servidor específico"
 switchToLocal = "Usar ferramentas locais em vez disso"
 title = "Entrar no servidor"
 
 [setup.selfhosted.unreachable]
+changeServer = "Conectar a um servidor diferente"
+changeServerLocked = "Sua organização restringiu este aplicativo a um servidor específico"
 continueOffline = "Usar ferramentas locais em vez disso"
 message = "Não foi possível acessar {{url}}. Verifique se o servidor está em execução e acessível."
 retry = "Tentar novamente"
@@ -6529,6 +7068,15 @@ saved = "Salvas"
 text = "Texto"
 title = "Tipo de assinatura"
 
+[signRequest]
+declined = "Solicitação de assinatura recusada"
+fetchFailed = "Falha ao carregar solicitação de assinatura"
+signed = "Documento assinado com sucesso"
+
+[signSession]
+createFailed = "Falha ao criar solicitação de assinatura"
+created = "Solicitação de assinatura enviada"
+
 [signup]
 accountCreatedSuccessfully = "Conta criada com sucesso! Agora você pode entrar."
 alreadyHaveAccount = "Já tem uma conta? Entre"
@@ -6807,6 +7355,106 @@ title = "Divide PDF por Capítulos"
 [splitPdfByChapters]
 tags = "dividir,capítulos,favoritos,organizar"
 
+[storageShare]
+accessed = "Acessado"
+accessDenied = "Você não tem acesso a este arquivo compartilhado. Peça ao proprietário para compartilhá-lo com você."
+accessFailed = "Não foi possível carregar a atividade."
+accessDeniedBody = "Você não tem acesso a este arquivo. Peça ao proprietário para compartilhá-lo com você."
+accessDeniedTitle = "Sem acesso"
+accessLimitedCommenter = "O acesso de comentarista estará disponível em breve. Peça ao proprietário acesso de editor se precisar baixar."
+accessLimitedTitle = "Acesso limitado"
+accessLimitedViewer = "Este link é somente visualização. Peça ao proprietário acesso de editor se precisar baixar."
+createdAt = "Criado"
+download = "Baixar"
+downloadFailed = "Não foi possível baixar este arquivo."
+expiredBody = "Este link de compartilhamento é inválido ou expirou."
+expiredTitle = "Link expirado"
+goToLogin = "Ir para login"
+loadFailed = "Não foi possível abrir o arquivo compartilhado."
+loading = "Carregando link de compartilhamento..."
+loginPrompt = "Faça login para acessar este arquivo compartilhado."
+loginRequired = "Login necessário"
+openInApp = "Abrir no Stirling PDF"
+ownerLabel = "Proprietário"
+ownerUnknown = "Desconhecido"
+requiresLogin = "Este arquivo compartilhado requer login."
+roleCommenter = "Comentarista"
+roleEditor = "Editor"
+roleViewer = "Visualizador"
+shareHeading = "Arquivo compartilhado"
+titleDefault = "Arquivo compartilhado"
+tryAgain = "Tente novamente mais tarde."
+addUser = "Adicionar"
+commenterHint = "Comentários em breve."
+copied = "Link copiado para a área de transferência"
+copy = "Copiar"
+copyFailed = "Falha ao copiar"
+description = "Crie um link de compartilhamento para este arquivo. Usuários logados com o link podem acessá-lo."
+downloadsCount = "Downloads: {{count}}"
+emailWarningBody = "Isso parece um endereço de e-mail. Se essa pessoa ainda não for usuária do Stirling PDF, ela não conseguirá acessar o arquivo."
+emailWarningConfirm = "Compartilhar mesmo assim"
+emailWarningTitle = "Endereço de e-mail"
+errorTitle = "Falha no compartilhamento"
+failure = "Não foi possível gerar um link de compartilhamento. Tente novamente."
+fileLabel = "Arquivo"
+generate = "Gerar link"
+generated = "Link de compartilhamento gerado"
+hideActivity = "Ocultar atividade"
+invalidUsername = "Insira um nome de usuário ou endereço de e-mail válido."
+lastAccessed = "Último acesso"
+linkAccessTitle = "Acesso via link de compartilhamento"
+linkLabel = "Link de compartilhamento"
+linksDisabled = "Links de compartilhamento desativados."
+linksDisabledBody = "Links de compartilhamento estão desativados pelas configurações do seu servidor."
+manage = "Gerenciar compartilhamento"
+manageDescription = "Criar e gerenciar links para compartilhar este arquivo."
+manageLoadFailed = "Não foi possível carregar os links de compartilhamento."
+manageTitle = "Gerenciar compartilhamento"
+noActivity = "Ainda sem atividade."
+noLinks = "Ainda não há links de compartilhamento ativos."
+noSharedUsers = "Nenhum usuário tem acesso ainda."
+removeLink = "Remover link"
+removeUser = "Remover"
+revokeFailed = "Não foi possível remover o link de compartilhamento."
+revoked = "Link de compartilhamento removido"
+roleLabel = "Função"
+sharingDisabled = "O compartilhamento está desativado."
+sharingDisabledBody = "O compartilhamento foi desativado pelas configurações do seu servidor."
+sharedUsersTitle = "Usuários com acesso"
+title = "Compartilhar arquivo"
+unknownUser = "Usuário desconhecido"
+userAddFailed = "Não foi possível compartilhar com esse usuário."
+userAdded = "Usuário adicionado à lista de compartilhamento."
+usernameLabel = "Nome de usuário ou e-mail"
+usernamePlaceholder = "Insira um nome de usuário ou e-mail"
+userRemoveFailed = "Não foi possível remover esse usuário."
+userRemoved = "Usuário removido da lista de compartilhamento."
+viewActivity = "Ver atividade"
+viewed = "Visualizado"
+viewsCount = "Visualizações: {{count}}"
+downloaded = "Baixado"
+bulkDescription = "Crie um único link para compartilhar todos os arquivos selecionados com usuários autenticados."
+bulkTitle = "Compartilhar arquivos selecionados"
+copyLink = "Copiar link de compartilhamento"
+fileCount = "{{count}} arquivos selecionados"
+ownerOnly = "Apenas o proprietário pode gerenciar o compartilhamento."
+selectSingleFile = "Selecione um único arquivo para gerenciar o compartilhamento."
+
+[storageUpload]
+description = "Isso envia o arquivo atual para o armazenamento do servidor para o seu próprio acesso."
+errorTitle = "Falha no envio"
+failure = "Falha no envio. Verifique seu login e as configurações de armazenamento."
+fileLabel = "Arquivo"
+hint = "Links públicos e modos de acesso são controlados pelas configurações do seu servidor."
+success = "Enviado para o servidor"
+title = "Enviar para o servidor"
+updateButton = "Atualizar no servidor"
+uploadButton = "Enviar para o servidor"
+bulkDescription = "Isso envia os arquivos selecionados para o armazenamento do seu servidor."
+bulkTitle = "Enviar arquivos selecionados"
+fileCount = "{{count}} arquivos selecionados"
+more = " +{{count}} mais"
+
 [storage]
 approximateSize = "Tamanho aproximado"
 fileTooLarge = "Arquivo muito grande. Tamanho máximo por arquivo é"
@@ -7153,6 +7801,30 @@ title = "Ver/Editar PDF"
 [warning]
 tooltipTitle = "Aviso"
 
+[wetSignature.tooltip]
+header = "Métodos de criação de assinatura"
+
+[wetSignature.tooltip.draw]
+bullet1 = "Personalize a cor e a espessura da caneta"
+bullet2 = "Limpe e redesenhe até ficar satisfeito"
+bullet3 = "Funciona em dispositivos de toque (tablets, celulares)"
+description = "Crie uma assinatura manuscrita usando o mouse ou a tela sensível ao toque. Ideal para assinaturas pessoais e autênticas."
+title = "Desenhar assinatura"
+
+[wetSignature.tooltip.type]
+bullet1 = "Escolha entre várias fontes"
+bullet2 = "Personalize o tamanho e a cor do texto"
+bullet3 = "Perfeito para assinaturas padronizadas"
+description = "Gere uma assinatura a partir de texto digitado. Rápido e consistente, adequado para documentos comerciais."
+title = "Digitar assinatura"
+
+[wetSignature.tooltip.upload]
+bullet1 = "Compatível com PNG, JPG e outros formatos de imagem"
+bullet2 = "Fundos transparentes são recomendados para melhores resultados"
+bullet3 = "A imagem será redimensionada para caber na área da assinatura"
+description = "Envie uma imagem de assinatura pré-criada. Ideal se você tiver uma assinatura digitalizada ou o logotipo da empresa."
+title = "Enviar imagem da assinatura"
+
 [watermark]
 completed = "Marca d'água adicionada"
 desc = "Adicione marcas d'água de texto ou imagem a arquivos PDF"
@@ -7333,6 +8005,7 @@ activeSession = "Sessão ativa"
 addMembers = "Adicionar membros"
 admin = "Admin"
 confirmDelete = "Tem certeza de que deseja excluir este usuário? Esta ação não pode ser desfeita."
+confirmUnlock = "Tem certeza de que deseja desbloquear esta conta de usuário?"
 deleteUser = "Excluir usuário"
 deleteUserError = "Falha ao excluir usuário"
 deleteUserSuccess = "Usuário excluído com sucesso"
@@ -7341,6 +8014,8 @@ disable = "Desativar"
 disabled = "Desativado"
 editRole = "Editar função"
 enable = "Ativar"
+locked = "bloqueado"
+lockedBadge = "Bloqueado"
 loading = "Carregando pessoas..."
 loginRequired = "Ative o modo de login primeiro"
 member = "Membro"
@@ -7350,6 +8025,9 @@ searchMembers = "Pesquisar membros..."
 status = "Status"
 team = "Equipe"
 title = "Pessoas"
+unlockAccount = "Desbloquear conta"
+unlockUserError = "Falha ao desbloquear a conta do usuário"
+unlockUserSuccess = "Conta do usuário desbloqueada com sucesso"
 user = "Usuário"
 
 [workspace.people.actions]
diff --git a/frontend/public/locales/pt-PT/translation.toml b/frontend/public/locales/pt-PT/translation.toml
index 9d59c54cff..80f6be720d 100644
--- a/frontend/public/locales/pt-PT/translation.toml
+++ b/frontend/public/locales/pt-PT/translation.toml
@@ -8,6 +8,7 @@ black = "Preto"
 blue = "Azul"
 bored = "Entediado à espera?"
 cancel = "Cancelar"
+confirm = "Confirmar"
 changedCredsMessage = "Credenciais alteradas!"
 chooseFile = "Escolher ficheiro"
 close = "Fechar"
@@ -146,6 +147,7 @@ insufficientCredits = "Créditos insuficientes. Necessários: {{requiredCredits}
 loadingCredits = "A verificar créditos..."
 loadingProStatus = "A verificar o estado da subscrição..."
 noticeTopUpOrPlan = "Créditos insuficientes, recarregue ou atualize para um plano"
+accessInvite = "Convidar"
 
 [account]
 accountSettings = "Definições de Conta"
@@ -1427,6 +1429,34 @@ title = "Processamento"
 description = "Tempo máximo de espera por um trabalho de processamento antes de reportar um erro."
 label = "Tempo limite de processamento (segundos)"
 
+[admin.settings.storage]
+description = "Controlar o armazenamento no servidor e as opções de partilha."
+title = "Armazenamento de Ficheiros e Partilha"
+
+[admin.settings.storage.enabled]
+description = "Permitir que os utilizadores armazenem ficheiros no servidor."
+label = "Ativar armazenamento de ficheiros no servidor"
+
+[admin.settings.storage.sharing.email]
+description = "Permitir partilha com endereços de e-mail."
+label = "Ativar partilha por e-mail"
+mailLink = "Configurar definições de e-mail"
+mailNote = "Requer configuração de e-mail. "
+
+[admin.settings.storage.sharing.enabled]
+description = "Permitir que os utilizadores partilhem ficheiros armazenados."
+label = "Ativar partilha"
+
+[admin.settings.storage.sharing.links]
+description = "Permitir partilha através de ligações autenticadas."
+frontendUrlLink = "Configurar nas Definições do Sistema"
+frontendUrlNote = "Requer um URL do Frontend. "
+label = "Ativar ligações de partilha"
+
+[admin.settings.storage.signing.enabled]
+description = "Permitir que os utilizadores criem sessões de assinatura com vários participantes. Requer o armazenamento de ficheiros no servidor ativado."
+label = "Ativar assinatura em grupo (Alpha)"
+
 [admin.settings.unsavedChanges]
 cancel = "Continuar a editar"
 discard = "Descartar alterações"
@@ -2059,7 +2089,19 @@ numbers = "Números/intervalos: 5, 10-20"
 progressions = "Progressões: 3n, 4n+1"
 
 [certSign]
+allSigned = "Todos os participantes assinaram. Pronto para finalizar."
+awaitingSignatures = "A aguardar assinaturas"
+signatureProgress = "{{signedCount}}/{{totalCount}} assinaturas"
 chooseCertificate = "Escolher ficheiro de certificado"
+declined = "Recusado"
+fetchFailed = "Não foi possível carregar os dados de assinatura"
+finalized = "Finalizado"
+notified = "Pendente"
+partialNote = "Pode finalizar antecipadamente com as assinaturas atuais. Os participantes não assinados serão excluídos."
+pending = "Pendente"
+readyToFinalize = "Pronto para finalizar"
+signed = "Assinado"
+viewed = "Visto"
 chooseJksFile = "Escolher ficheiro JKS"
 chooseP12File = "Escolher ficheiro PKCS12"
 choosePfxFile = "Escolher ficheiro PFX"
@@ -2082,6 +2124,7 @@ title = "Assinatura de Certificado"
 invisible = "Invisível"
 stepTitle = "Aparência da Assinatura"
 visible = "Visível"
+visibility = "Visibilidade"
 
 [certSign.appearance.options]
 title = "Detalhes da Assinatura"
@@ -2188,6 +2231,252 @@ bullet4 = "Pode usar certificados personalizados para verificação"
 text = "Ao verificar assinaturas, a ferramenta informa se são válidas, quem assinou o documento, quando foi assinado e se o documento foi alterado desde a assinatura."
 title = "Verificação de Assinaturas"
 
+[certSign.collab.finalize]
+button = "Finalizar e carregar o PDF assinado"
+early = "Finalizar com as assinaturas atuais"
+
+[certSign.collab.sessionDetail]
+addButton = "Adicionar participantes"
+addParticipants = "Adicionar participantes"
+addParticipantsError = "Não foi possível adicionar participantes"
+backToList = "Voltar às sessões"
+deleteConfirm = "Tem a certeza? Esta ação não pode ser anulada."
+deleteError = "Não foi possível eliminar a sessão"
+deleted = "Sessão eliminada"
+deleteSession = "Eliminar sessão"
+dueDate = "Data limite"
+finalizeError = "Não foi possível finalizar a sessão"
+loadPdfError = "Não foi possível carregar o PDF assinado"
+loadSignedPdf = "Carregar o PDF assinado nos ficheiros ativos"
+messageLabel = "Mensagem"
+noAdditionalInfo = "Sem informações adicionais"
+owner = "Proprietário"
+participantRemoved = "Participante removido"
+participants = "Participantes"
+participantsAdded = "Participantes adicionados com sucesso"
+removeParticipant = "Remover"
+removeParticipantError = "Não foi possível remover o participante"
+selectUsers = "Selecionar utilizadores..."
+sessionInfo = "Informações da sessão"
+workbenchTitle = "Gestão da sessão"
+
+[certSign.collab.signRequest]
+addedToFiles = "Documento adicionado aos ficheiros ativos"
+addSignature = "Adicionar a sua assinatura"
+addToFiles = "Adicionar aos ficheiros ativos"
+advancedSettings = "Definições avançadas"
+backToList = "Voltar aos pedidos de assinatura"
+certificateChoice = "Selecione um certificado para assinar"
+changeSignature = "Alterar assinatura"
+clearSignature = "Limpar assinatura"
+completeAndSign = "Concluir e Assinar"
+createNewSignature = "Criar nova assinatura"
+declineButton = "Recusar"
+decline = "Recusar pedido"
+deleteSelected = "Eliminar assinatura selecionada"
+drawSignature = "Desenhe a sua assinatura abaixo"
+dueDate = "Data limite"
+fileTooLarge = "O tamanho do ficheiro deve ser inferior a 5 MB"
+fontFamily = "Tipo de letra"
+fontSize = "Tamanho do tipo de letra: {{size}}px"
+fontSizePlaceholder = "Tamanho"
+from = "De"
+invalidCertFile = "Por favor, selecione um ficheiro de certificado P12 ou PFX"
+invalidFileType = "Por favor, selecione um ficheiro de imagem"
+location = "Localização (opcional)"
+locationPlaceholder = "De onde está a assinar?"
+message = "Mensagem"
+noCertificate = "Por favor, selecione um ficheiro de certificado"
+noSignatures = "Coloque pelo menos uma assinatura no PDF"
+p12File = "Ficheiro de Certificado P12/PFX"
+password = "Palavra-passe do certificado"
+passwordPlaceholder = "Introduza a palavra-passe..."
+penColor = "Cor da caneta"
+penSize = "Tamanho da caneta: {{size}}px"
+placementActive = "Clique no PDF para colocar"
+placeSignatureButton = "Colocar assinatura no PDF"
+reason = "Motivo (opcional)"
+reasonPlaceholder = "Porque está a assinar?"
+removeImage = "Remover imagem"
+removeCertFile = "Remover ficheiro"
+savedSignatures = "Assinaturas guardadas"
+selectFile = "Selecionar ficheiro de imagem"
+selectSignatureTitle = "Selecionar ou Criar Assinatura"
+signButton = "Assinar documento"
+signatureInfo = "Estas definições são configuradas pelo proprietário do documento"
+signaturePlaced = "Assinatura colocada na página"
+signatureSettings = "Definições da assinatura"
+signatureText = "Texto da assinatura"
+signatureTextPlaceholder = "Introduza o seu nome..."
+signatureTypeLabel = "Tipo de assinatura"
+signingTitle = "Assinatura"
+textColor = "Cor do texto"
+typeSignature = "Escreva o seu nome para criar uma assinatura"
+uploadCert = "Certificado personalizado"
+uploadCertDesc = "Utilize o seu próprio certificado P12/PFX"
+uploadSignature = "Carregar a imagem da sua assinatura"
+usePersonalCert = "Certificado pessoal"
+usePersonalCertDesc = "Gerado automaticamente para a sua conta"
+useServerCert = "Certificado da organização"
+useServerCertDesc = "Certificado partilhado da organização"
+workbenchTitle = "Pedido de assinatura"
+
+[certSign.collab.signRequest.canvas]
+colorPickerTitle = "Escolher cor do traço"
+continue = "Continuar"
+
+[certSign.collab.signRequest.certModal]
+description = "Colocou {{count}} assinatura(s). Escolha o seu certificado para concluir a assinatura."
+sign = "Assinar documento"
+certValidating = "A validar certificado..."
+certValidUntil = "Certificado válido até {{date}}"
+certInvalid = "Certificado inválido: {{error}}"
+certInvalidFallback = "Certificado inválido"
+certNetworkError = "Não foi possível validar o certificado"
+title = "Configurar certificado"
+
+[certSign.collab.signRequest.image]
+hint = "Carregue uma imagem PNG ou JPG da sua assinatura"
+
+[certSign.collab.signRequest.mode]
+move = "Mover assinatura"
+place = "Colocar assinatura"
+title = "Modo de assinar ou mover"
+
+[certSign.collab.signRequest.modeTabs]
+draw = "Desenhar"
+image = "Carregar"
+text = "Escrever"
+
+[certSign.collab.signRequest.placeSignature]
+message = "Clique no PDF para colocar a sua assinatura"
+title = "Colocar assinatura"
+
+[certSign.collab.signRequest.preview]
+imageAlt = "Assinatura selecionada"
+missing = "Sem pré-visualização"
+textFallback = "Assinatura"
+
+[certSign.collab.signRequest.saved]
+defaultCanvasLabel = "Assinatura desenhada"
+defaultImageLabel = "Assinatura carregada"
+defaultLabel = "Assinatura"
+defaultTextLabel = "Assinatura escrita"
+delete = "Eliminar assinatura"
+none = "Nenhuma assinatura guardada"
+
+[certSign.collab.signRequest.signatureType]
+draw = "Desenhar"
+type = "Escrever"
+upload = "Carregar"
+
+[certSign.collab.signRequest.steps]
+back = "Voltar"
+cancelPlacement = "Cancelar colocação"
+certificate = "Certificado"
+clickMultipleTimes = "Clique várias vezes no PDF para colocar assinaturas. Arraste qualquer assinatura para a mover ou redimensionar."
+clickToPlace = "Clique no PDF onde pretende que a sua assinatura apareça."
+continue = "Continuar para seleção de certificado"
+continueToPlacement = "Continuar para colocação"
+continueToReview = "Continuar para revisão"
+createSignature = "Criar assinatura"
+invisible = "Invisível"
+location = "Localização:"
+multipleSignatures = "{{count}} assinaturas serão aplicadas ao PDF"
+oneSignature = "1 assinatura será aplicada ao PDF"
+placeOnPdf = "Colocar no PDF"
+reason = "Motivo:"
+reviewTitle = "Rever antes de assinar"
+signaturePlaced = "Assinatura colocada na página {{page}}. Pode ajustar a posição clicando novamente ou continuar para a revisão."
+visible = "Visível"
+visibility = "Visibilidade:"
+yourSignatures = "As suas assinaturas ({{count}})"
+
+[certSign.collab.signRequest.text]
+colorLabel = "Cor"
+fontLabel = "Tipo de letra"
+fontSizeLabel = "Tamanho"
+fontSizePlaceholder = "16"
+label = "Texto da assinatura"
+modalHint = "Introduza o seu nome e clique em Continuar para o colocar no PDF."
+placeholder = "Introduza o seu nome..."
+
+[certSign.collab.participant]
+certValidating = "A validar certificado..."
+certValid = "✓ Certificado válido"
+certValidUntil = " até {{date}}"
+certInvalid = "✗ {{error}}"
+certInvalidFallback = "Certificado inválido"
+certNetworkError = "Não foi possível validar o certificado"
+
+[certSign.collab.addParticipants]
+add = "Adicionar {{count}} participante(s)"
+back = "Voltar"
+configureSignatures = "Configurar definições de assinatura"
+continue = "Continuar para as definições de assinatura"
+reasonHelp = "Pré-definir um motivo de assinatura para estes participantes (opcional, podem alterar ao assinar)"
+reasonPlaceholder = "ex.: Aprovação, Revisão..."
+selectUsers = "Selecionar utilizadores"
+
+[certSign.collab.sessionCreation]
+includeSummaryPage = "Incluir página de resumo de assinaturas"
+includeSummaryPageHelp = "Será adicionada no fim uma página de resumo com todos os metadados das assinaturas. As caixas de assinatura de certificado digital nas páginas individuais serão suprimidas (assinaturas manuscritas não são afetadas)."
+
+[certSign.collab.sessionList]
+active = "Ativo"
+finalized = "Finalizado"
+
+[certSign.collab.signatureSettings]
+description = "Configurar como as assinaturas irão aparecer para todos os participantes"
+title = "Aparência da assinatura"
+
+[certSign.collab.userSelector]
+inviteUsers = "Adicionar utilizadores"
+loadError = "Não foi possível carregar utilizadores"
+noTeam = "Sem equipa"
+noUsers = "Nenhum outro utilizador encontrado."
+placeholder = "Selecionar utilizadores..."
+
+[certSign.mobile]
+panelActions = "Ações"
+panelDocument = "Documento"
+panelPeople = "Pessoas"
+
+[certSign.sessions]
+deleted = "Sessão eliminada"
+fetchFailed = "Não foi possível carregar os detalhes da sessão"
+finalized = "Sessão finalizada"
+loaded = "PDF assinado carregado"
+pdfNotReady = "PDF não pronto"
+pdfNotReadyDesc = "O PDF assinado está a ser gerado. Tente novamente dentro de momentos."
+
+[certificateChoice.tooltip]
+header = "Tipos de certificado"
+
+[certificateChoice.tooltip.organization]
+bullet1 = "Gerido pelos administradores do sistema"
+bullet2 = "Partilhado entre utilizadores autorizados"
+bullet3 = "Representa a identidade da empresa, não do indivíduo"
+bullet4 = "Ideal para: documentos oficiais, assinaturas de equipa"
+description = "Um certificado partilhado fornecido pela sua organização. Usado para autoridade de assinatura a nível da empresa."
+title = "Certificado da Organização"
+
+[certificateChoice.tooltip.personal]
+bullet1 = "Gerado automaticamente na primeira utilização"
+bullet2 = "Associado à sua conta de utilizador"
+bullet3 = "Não pode ser partilhado com outros utilizadores"
+bullet4 = "Ideal para: documentos pessoais, responsabilidade individual"
+description = "Um certificado gerado automaticamente, exclusivo da sua conta de utilizador. Adequado para assinaturas individuais."
+title = "Certificado Pessoal"
+
+[certificateChoice.tooltip.upload]
+bullet1 = "Requer ficheiro P12/PFX e palavra-passe"
+bullet2 = "Pode ser emitido por Autoridades Certificadoras externas"
+bullet3 = "Maior nível de confiança para documentos legais"
+bullet4 = "Ideal para: contratos legalmente vinculativos, validação externa"
+description = "Utilize o seu próprio ficheiro de certificado PKCS#12. Fornece controlo total sobre as propriedades do certificado."
+title = "Carregar P12 personalizado"
+
 [changeCreds]
 changePassword = "Está a usar credenciais de login padrão. Por favor insira uma nova palavra-passe"
 changeUsername = "Atualize o seu nome de utilizador. Será terminada a sua sessão após a atualização."
@@ -3242,6 +3531,46 @@ totalSelected = "Total selecionado"
 unsupported = "Não suportado"
 unzip = "Descompactar"
 uploadError = "Falha ao carregar alguns ficheiros."
+copyCreated = "Cópia guardada neste dispositivo."
+copyFailed = "Não foi possível criar uma cópia."
+leaveShare = "Remover da minha lista"
+leaveShareFailed = "Não foi possível remover o ficheiro partilhado."
+leaveShareSuccess = "Removido da sua lista de partilhas."
+removeBoth = "Remover de ambos"
+removeFilePrompt = "Este ficheiro está guardado neste dispositivo e no seu servidor. De onde pretende removê-lo?"
+removeFileTitle = "Remover ficheiro"
+removeLocalOnly = "Apenas deste dispositivo"
+removeServerFailed = "Não foi possível remover o ficheiro do servidor."
+removeServerOnly = "Apenas do servidor"
+removeServerOnlyPrompt = "Este ficheiro está armazenado apenas no seu servidor. Pretende removê-lo do servidor?"
+removeServerSuccess = "Removido do servidor."
+removeSharedPrompt = "Este ficheiro foi partilhado consigo. Pode removê-lo deste dispositivo ou da sua lista de partilhas."
+removeSharedServerOnlyBlockedPrompt = "Este ficheiro foi partilhado consigo e está armazenado apenas no servidor."
+removeSharedServerOnlyPrompt = "Este ficheiro foi partilhado consigo e está armazenado apenas no servidor. Removê-lo da sua lista?"
+changesNotUploaded = "Alterações não carregadas"
+cloudFile = "Ficheiro na nuvem"
+filterAll = "Todos"
+filterLocal = "Local"
+filterSharedByMe = "Partilhado por mim"
+filterSharedWithMe = "Partilhado comigo"
+lastSynced = "Última sincronização"
+localOnly = "Apenas local"
+makeCopy = "Criar uma cópia"
+owner = "Proprietário"
+ownerUnknown = "Desconhecido"
+share = "Partilhar"
+shareSelected = "Partilhar selecionados"
+sharedByYou = "Partilhado por si"
+sharedEditNoticeBody = "Não tem permissões de edição para a versão no servidor deste ficheiro. Quaisquer edições serão guardadas como uma cópia local."
+sharedEditNoticeConfirm = "Percebi"
+sharedEditNoticeTitle = "Cópia no servidor só de leitura"
+sharedWithYou = "Partilhado consigo"
+sharing = "Partilha"
+storageState = "Armazenamento"
+synced = "Sincronizado"
+updateOnServer = "Atualizar no Servidor"
+uploadSelected = "Carregar selecionados"
+uploadToServer = "Carregar para o Servidor"
 
 [files]
 addFiles = "Adicionar ficheiros"
@@ -3367,6 +3696,77 @@ title = "Sobre o Aplanamento de PDFs"
 discord = "Discord"
 issues = "GitHub"
 
+[groupSigning.tooltip]
+header = "Sobre a Assinatura em Grupo"
+
+[groupSigning.tooltip.finalization]
+bullet1 = "Todas as assinaturas são aplicadas pela ordem de participantes que especificou"
+bullet2 = "Pode finalizar com assinaturas parciais, se necessário"
+bullet3 = "Depois de finalizada, a sessão não pode ser modificada"
+description = "Quando todos os participantes assinarem (ou optar por finalizar antecipadamente), pode gerar o PDF final assinado."
+title = "Processo de finalização"
+
+[groupSigning.tooltip.roles]
+bullet1 = "Proprietário (você): cria a sessão, configura predefinições de assinatura, finaliza o documento"
+bullet2 = "Participantes: criam a sua assinatura, escolhem o certificado, colocam no PDF"
+bullet3 = "Os participantes não podem modificar as definições de visibilidade, motivo ou localização da assinatura"
+description = "Controla as definições de aparência da assinatura para todos os participantes."
+title = "Papéis dos participantes"
+
+[groupSigning.tooltip.sequential]
+bullet1 = "O primeiro participante tem de assinar antes de o segundo poder aceder ao documento"
+bullet2 = "Garante a ordem de assinatura adequada para conformidade legal"
+bullet3 = "Pode reordenar participantes arrastando-os na lista"
+description = "Os participantes assinam os documentos pela ordem que especificar. Cada signatário recebe uma notificação quando é a sua vez."
+title = "Assinatura sequencial"
+
+[groupSigning.steps]
+back = "Voltar"
+completed = "Concluído"
+current = "Atual"
+stepLabel = "Passo {{number}}"
+
+[groupSigning.steps.configureDefaults]
+continue = "Continuar para revisão"
+invisible = "As assinaturas serão invisíveis (apenas metadados)"
+locationLabel = "Localização:"
+preview = "Pré-visualização"
+reasonLabel = "Motivo:"
+title = "Configurar definições de assinatura"
+visible = "As assinaturas serão visíveis na página {{page}}"
+
+[groupSigning.steps.review]
+document = "Documento"
+dueDate = "Data limite (opcional)"
+dueDatePlaceholder = "Selecionar data limite..."
+invisible = "Invisível (apenas metadados)"
+location = "Localização:"
+logo = "Logótipo:"
+logoHidden = "Sem logótipo"
+logoShown = "Logótipo do Stirling PDF mostrado"
+participants = "Participantes"
+reason = "Motivo:"
+send = "Enviar pedidos de assinatura"
+signatureSettings = "Definições da assinatura"
+title = "Rever detalhes da sessão"
+titleShort = "Rever e Enviar"
+visibility = "Visibilidade:"
+visible = "Visível na página {{page}}"
+participantCount = "{{count}} participante(s) assinará(ão) por ordem"
+
+[groupSigning.steps.selectDocument]
+continue = "Continuar para seleção de participantes"
+noFile = "Selecione um único ficheiro PDF dos seus ficheiros ativos para criar uma sessão de assinatura."
+selectedFile = "Documento selecionado"
+title = "Selecionar documento"
+
+[groupSigning.steps.selectParticipants]
+continue = "Continuar para as definições de assinatura"
+count = "{{count}} participante(s) selecionado(s)"
+label = "Selecionar participantes"
+placeholder = "Escolher participantes para assinar..."
+title = "Escolher participantes"
+
 [getPdfInfo]
 downloadJson = "Transferir JSON"
 downloads = "Transferências"
@@ -4460,7 +4860,10 @@ zoomOut = "Reduzir"
 
 [viewer]
 cannotPreviewFile = "Não é possível pré-visualizar o ficheiro"
+disableColorFilter = "Desativar filtro de cor"
 dualPageView = "Vista de duas páginas"
+enableDarkFilter = "Ativar filtro escuro"
+enableSepiaFilter = "Ativar filtro sépia"
 firstPage = "Primeira página"
 lastPage = "Última página"
 nextPage = "Página seguinte"
@@ -4470,6 +4873,22 @@ singlePageView = "Vista de página única"
 unknownFile = "Ficheiro desconhecido"
 zoomIn = "Ampliar"
 zoomOut = "Reduzir"
+resetZoom = "Repor zoom"
+
+[viewer.nonPdf]
+fileTypeBadge = "Ficheiro {{type}}"
+convertToPdf = "Converter para PDF"
+loading = "A carregar..."
+emptyFile = "Ficheiro vazio"
+csvStats = "{{rows}} linhas · {{columns}} colunas · {{size}}"
+sortedBy = "Ordenado por: {{column}}"
+columnDefault = "Coluna {{index}}"
+htmlPreviewWarning = "Pré-visualização HTML — recursos externos podem não ser carregados · {{size}}"
+htmlPreview = "Pré-visualização HTML"
+invalidJson = "JSON inválido — a mostrar conteúdo em bruto"
+textStats = "{{lines}} linhas · {{size}}"
+lineNumbers = "Números de linha"
+renderMarkdown = "Renderizar Markdown"
 
 [viewer.attachments]
 title = "Anexos"
@@ -4531,6 +4950,7 @@ toggleAttachments = "Alternar anexos"
 toggleTheme = "Alternar tema"
 language = "Idioma"
 toggleAnnotations = "Alternar visibilidade das anotações"
+toggleLayers = "Alternar camadas"
 search = "Pesquisar PDF"
 panMode = "Modo de deslocamento"
 applyRedactionsFirst = "Aplique as ocultações primeiro"
@@ -5407,20 +5827,72 @@ title = "Imprimir Ficheiro"
 2 = "Introduza Nome da Impressora"
 
 [quickAccess]
+access = "Acesso"
+accessAddPerson = "Adicionar outra pessoa"
+accessBack = "Voltar"
+accessCopyLink = "Copiar ligação"
+accessEmail = "Endereço de e-mail"
+accessEmailPlaceholder = "nome@empresa.com"
+accessFileLabel = "Ficheiro"
+accessGeneral = "Acesso geral"
+accessInviteTitle = "Convidar pessoas"
+accessOwner = "Proprietário"
+accessPanel = "Acesso ao documento"
+accessPeople = "Pessoas com acesso"
+accessRemove = "Remover"
+accessRestricted = "Restrito"
+accessRestrictedHint = "Apenas as pessoas com acesso podem abrir"
+accessRole = "Função"
+accessRoleCommenter = "Comentador"
+accessRoleEditor = "Editor"
+accessRoleViewer = "Leitor"
+accessSelectedFile = "Ficheiro selecionado"
+accessSendInvite = "Enviar convite"
+accessTitle = "Acesso ao documento"
+accessYou = "Eu"
 account = "Conta"
+activeSessions = "Sessões ativas"
+activeTab = "Ativas"
 activity = "Registo"
 adminSettings = "Ajustes admin"
+allSessions = "Todas as sessões"
 allTools = "All Tools"
 automate = "Auto"
+back = "Voltar"
+certSign = "Assinar com certificado"
+completedSessions = "Sessões concluídas"
+completedTab = "Concluídas"
 config = "Config."
+createNew = "Criar novo pedido"
+createSession = "Criar pedido de assinatura"
+dueDate = "Data limite (opcional)"
 files = "Fich."
 help = "Ajuda"
+noActiveSessions = "Sem pedidos de assinatura pendentes ou sessões ativas"
+noCompletedSessions = "Sem sessões concluídas"
+noFile = "Nenhum ficheiro selecionado"
 read = "Ler"
 reader = "Leitor"
+refresh = "Atualizar"
+requestSignatures = "Pedir assinaturas"
+selectSingleFileToRequest = "Selecione um único ficheiro PDF para pedir assinaturas"
+selectedFile = "Ficheiro selecionado"
+selectUsers = "Selecionar utilizadores para assinar"
+selectUsersPlaceholder = "Escolher participantes..."
+sendingRequest = "A enviar..."
 settings = "Ajustes"
 showMeAround = "Faz-me uma visita guiada"
 sign = "Assinar"
+signatureRequests = "Pedidos de assinatura"
+signYourself = "Assinar você mesmo"
+newRequest = "Novo pedido"
 tours = "Visitas guiadas"
+wetSign = "Adicionar assinatura"
+filterMine = "Meus"
+filterOverdue = "Em atraso"
+filterSigned = "Assinado"
+filterDeclined = "Recusado"
+searchDocuments = "Procurar documentos…"
 
 [quickAccess.helpMenu]
 adminTour = "Visita guiada de administração"
@@ -6050,11 +6522,75 @@ toolNotAvailableLocally = "O seu servidor Stirling-PDF está offline e \"{{endpo
 expired = "A sua sessão expirou. Por favor atualize a página e tente novamente."
 refreshPage = "Atualizar Página"
 
+[sessionManagement.tooltip]
+header = "Gestão de sessões de assinatura"
+
+[sessionManagement.tooltip.addParticipants]
+bullet1 = "Novos participantes são adicionados ao fim da ordem de assinatura"
+bullet2 = "Não é possível adicionar participantes após a finalização da sessão"
+bullet3 = "Cada participante recebe uma notificação quando chega a sua vez"
+description = "Pode adicionar mais participantes a uma sessão ativa a qualquer momento antes da finalização."
+title = "Adicionar participantes"
+
+[sessionManagement.tooltip.finalization]
+bullet1 = "<b>Finalização total</b>: Todos os participantes assinaram"
+bullet2 = "<b>Finalização parcial</b>: Alguns participantes ainda não assinaram"
+bullet3 = "Os participantes não assinados serão excluídos do documento final"
+bullet4 = "Depois de finalizada, pode carregar o PDF assinado nos ficheiros ativos"
+description = "A finalização combina todas as assinaturas num único PDF assinado. Esta ação não pode ser anulada."
+title = "Finalização da sessão"
+
+[sessionManagement.tooltip.participantRemoval]
+bullet1 = "Não é possível remover participantes que já assinaram"
+bullet2 = "Os participantes removidos deixam de receber notificações"
+bullet3 = "A ordem de assinatura ajusta-se automaticamente"
+description = "Os participantes podem ser removidos das sessões antes de assinarem."
+title = "Remover participantes"
+
+[sessionManagement.tooltip.signatureOrder]
+bullet1 = "Cada assinatura é aplicada sequencialmente ao PDF"
+bullet2 = "Os signatários posteriores podem ver assinaturas anteriores"
+bullet3 = "Crítico para fluxos de aprovação e cadeias legais de custódia"
+description = "A ordem que especificar ao criar a sessão determina quem assina primeiro."
+title = "Ordem de assinatura"
+
+[signatureSettings.tooltip]
+header = "Definições de aparência da assinatura"
+
+[signatureSettings.tooltip.location]
+bullet1 = "Exemplos: \"Nova Iorque, EUA\", \"Escritório de Londres\", \"Remoto\""
+bullet2 = "Não é o mesmo que a posição na página"
+bullet3 = "Pode ser exigido por certas jurisdições legais"
+description = "Localização geográfica opcional onde a assinatura foi aplicada. Armazenada nos metadados do certificado."
+title = "Localização da assinatura"
+
+[signatureSettings.tooltip.logo]
+bullet1 = "Apresentado junto à assinatura e texto"
+bullet2 = "Suporta formatos PNG, JPG"
+bullet3 = "Melhora a aparência profissional"
+description = "Adicione um logótipo da empresa às assinaturas visíveis para reforçar a marca e autenticidade."
+title = "Logótipo da empresa"
+
+[signatureSettings.tooltip.reason]
+bullet1 = "Exemplos: \"Aprovação\", \"Acordo de Contrato\", \"Revisão Concluída\""
+bullet2 = "Visível nas propriedades da assinatura do PDF"
+bullet3 = "Útil para rastreabilidade e conformidade"
+description = "Texto opcional que explica porque o documento está a ser assinado. Armazenado nos metadados do certificado."
+title = "Motivo da assinatura"
+
+[signatureSettings.tooltip.visibility]
+bullet1 = "<b>Visível</b>: A assinatura aparece no PDF com aparência personalizada"
+bullet2 = "<b>Invisível</b>: Certificado incorporado sem marca visual"
+bullet3 = "Assinaturas invisíveis continuam a fornecer validação criptográfica"
+description = "Controla se a assinatura é visível no documento ou incorporada de forma invisível."
+title = "Visibilidade da assinatura"
+
 [settings.configuration]
 advanced = "Avançado"
 database = "Base de dados"
 endpoints = "Endpoints"
 features = "Funcionalidades"
+storageSharing = "Armazenamento de Ficheiros e Partilha"
 systemSettings = "Definições do sistema"
 title = "Configuração"
 
@@ -6332,10 +6868,13 @@ title = "Iniciar sessão no Stirling"
 [setup.selfhosted]
 link = "ou ligue-se a uma conta autoalojada"
 subtitle = "Introduza as credenciais do seu servidor"
+changeServerLocked = "A sua organização restringiu esta aplicação a um servidor específico"
 switchToLocal = "Usar ferramentas locais em vez disso"
 title = "Iniciar sessão no servidor"
 
 [setup.selfhosted.unreachable]
+changeServer = "Ligar a um servidor diferente"
+changeServerLocked = "A sua organização restringiu esta aplicação a um servidor específico"
 continueOffline = "Usar ferramentas locais em vez disso"
 message = "Não foi possível alcançar {{url}}. Verifique que o servidor está em execução e acessível."
 retry = "Tentar novamente"
@@ -6529,6 +7068,15 @@ saved = "Guardadas"
 text = "Texto"
 title = "Tipo de Assinatura"
 
+[signRequest]
+declined = "Pedido de assinatura recusado"
+fetchFailed = "Não foi possível carregar o pedido de assinatura"
+signed = "Documento assinado com sucesso"
+
+[signSession]
+createFailed = "Não foi possível criar o pedido de assinatura"
+created = "Pedido de assinatura enviado"
+
 [signup]
 accountCreatedSuccessfully = "Conta criada com sucesso! Já pode iniciar sessão."
 alreadyHaveAccount = "Já tem uma conta? Inicie sessão"
@@ -6807,6 +7355,106 @@ title = "Dividir PDF por Capítulos"
 [splitPdfByChapters]
 tags = "dividir,capítulos,marcadores,organizar"
 
+[storageShare]
+accessed = "Acedido"
+accessDenied = "Não tem acesso a este ficheiro partilhado. Peça ao proprietário que o partilhe consigo."
+accessFailed = "Não foi possível carregar a atividade."
+accessDeniedBody = "Não tem acesso a este ficheiro. Peça ao proprietário que o partilhe consigo."
+accessDeniedTitle = "Sem acesso"
+accessLimitedCommenter = "O acesso para comentários chegará em breve. Peça acesso de editor se precisar de transferir."
+accessLimitedTitle = "Acesso limitado"
+accessLimitedViewer = "Esta ligação é apenas para visualização. Peça acesso de editor se precisar de transferir."
+createdAt = "Criado"
+download = "Transferir"
+downloadFailed = "Não foi possível transferir este ficheiro."
+expiredBody = "Esta ligação de partilha é inválida ou expirou."
+expiredTitle = "Ligação expirada"
+goToLogin = "Ir para início de sessão"
+loadFailed = "Não foi possível abrir o ficheiro partilhado."
+loading = "A carregar ligação de partilha..."
+loginPrompt = "Inicie sessão para aceder a este ficheiro partilhado."
+loginRequired = "É necessário iniciar sessão"
+openInApp = "Abrir no Stirling PDF"
+ownerLabel = "Proprietário"
+ownerUnknown = "Desconhecido"
+requiresLogin = "Este ficheiro partilhado requer início de sessão."
+roleCommenter = "Comentador"
+roleEditor = "Editor"
+roleViewer = "Leitor"
+shareHeading = "Ficheiro partilhado"
+titleDefault = "Ficheiro partilhado"
+tryAgain = "Por favor, tente novamente mais tarde."
+addUser = "Adicionar"
+commenterHint = "Os comentários chegarão em breve."
+copied = "Ligação copiada para a área de transferência"
+copy = "Copiar"
+copyFailed = "Não foi possível copiar"
+description = "Crie uma ligação de partilha para este ficheiro. Utilizadores com sessão iniciada e com a ligação podem aceder-lhe."
+downloadsCount = "Transferências: {{count}}"
+emailWarningBody = "Isto parece um endereço de e-mail. Se esta pessoa não for já utilizadora do Stirling PDF, não poderá aceder ao ficheiro."
+emailWarningConfirm = "Partilhar mesmo assim"
+emailWarningTitle = "Endereço de e-mail"
+errorTitle = "Falha na partilha"
+failure = "Não foi possível gerar uma ligação de partilha. Por favor, tente novamente."
+fileLabel = "Ficheiro"
+generate = "Gerar ligação"
+generated = "Ligação de partilha gerada"
+hideActivity = "Ocultar atividade"
+invalidUsername = "Introduza um nome de utilizador ou endereço de e-mail válido."
+lastAccessed = "Último acesso"
+linkAccessTitle = "Acesso da ligação de partilha"
+linkLabel = "Ligação de partilha"
+linksDisabled = "As ligações de partilha estão desativadas."
+linksDisabledBody = "As ligações de partilha estão desativadas pelas definições do seu servidor."
+manage = "Gerir partilha"
+manageDescription = "Crie e gere ligações para partilhar este ficheiro."
+manageLoadFailed = "Não foi possível carregar as ligações de partilha."
+manageTitle = "Gerir partilha"
+noActivity = "Ainda sem atividade."
+noLinks = "Ainda não existem ligações de partilha ativas."
+noSharedUsers = "Ainda não há utilizadores com acesso."
+removeLink = "Remover ligação"
+removeUser = "Remover"
+revokeFailed = "Não foi possível remover a ligação de partilha."
+revoked = "Ligação de partilha removida"
+roleLabel = "Função"
+sharingDisabled = "A partilha está desativada."
+sharingDisabledBody = "A partilha foi desativada pelas definições do seu servidor."
+sharedUsersTitle = "Utilizadores com acesso partilhado"
+title = "Partilhar ficheiro"
+unknownUser = "Utilizador desconhecido"
+userAddFailed = "Não foi possível partilhar com esse utilizador."
+userAdded = "Utilizador adicionado à lista de partilha."
+usernameLabel = "Nome de utilizador ou e-mail"
+usernamePlaceholder = "Introduza um nome de utilizador ou e-mail"
+userRemoveFailed = "Não foi possível remover esse utilizador."
+userRemoved = "Utilizador removido da lista de partilha."
+viewActivity = "Ver atividade"
+viewed = "Visto"
+viewsCount = "Visualizações: {{count}}"
+downloaded = "Transferido"
+bulkDescription = "Crie uma única ligação para partilhar todos os ficheiros selecionados com utilizadores com sessão iniciada."
+bulkTitle = "Partilhar ficheiros selecionados"
+copyLink = "Copiar ligação de partilha"
+fileCount = "{{count}} ficheiros selecionados"
+ownerOnly = "Apenas o proprietário pode gerir a partilha."
+selectSingleFile = "Selecione um único ficheiro para gerir a partilha."
+
+[storageUpload]
+description = "Isto carrega o ficheiro atual para o armazenamento do servidor para o seu próprio acesso."
+errorTitle = "Falha no carregamento"
+failure = "O carregamento falhou. Verifique o seu início de sessão e as definições de armazenamento."
+fileLabel = "Ficheiro"
+hint = "As ligações públicas e os modos de acesso são controlados pelas definições do seu servidor."
+success = "Carregado para o servidor"
+title = "Carregar para o servidor"
+updateButton = "Atualizar no servidor"
+uploadButton = "Carregar para o servidor"
+bulkDescription = "Isto carrega os ficheiros selecionados para o armazenamento do seu servidor."
+bulkTitle = "Carregar ficheiros selecionados"
+fileCount = "{{count}} ficheiros selecionados"
+more = " +{{count}} mais"
+
 [storage]
 approximateSize = "Tamanho aproximado"
 fileTooLarge = "Ficheiro demasiado grande. O tamanho máximo por ficheiro é"
@@ -7153,6 +7801,30 @@ title = "Ver/Editar PDF"
 [warning]
 tooltipTitle = "Aviso"
 
+[wetSignature.tooltip]
+header = "Métodos de criação de assinatura"
+
+[wetSignature.tooltip.draw]
+bullet1 = "Personalize a cor e a espessura da caneta"
+bullet2 = "Limpe e volte a desenhar até ficar satisfeito"
+bullet3 = "Funciona em dispositivos táteis (tablets, telemóveis)"
+description = "Crie uma assinatura manuscrita usando o rato ou o ecrã tátil. Ideal para assinaturas pessoais e autênticas."
+title = "Desenhar Assinatura"
+
+[wetSignature.tooltip.type]
+bullet1 = "Escolha entre vários tipos de letra"
+bullet2 = "Personalize o tamanho e a cor do texto"
+bullet3 = "Perfeito para assinaturas normalizadas"
+description = "Gere uma assinatura a partir de texto escrito. Rápido e consistente, adequado para documentos empresariais."
+title = "Escrever Assinatura"
+
+[wetSignature.tooltip.upload]
+bullet1 = "Suporta PNG, JPG e outros formatos de imagem"
+bullet2 = "Recomendam-se fundos transparentes para melhores resultados"
+bullet3 = "A imagem será redimensionada para ajustar à área da assinatura"
+description = "Carregue uma imagem de assinatura pré-criada. Ideal se tiver uma assinatura digitalizada ou o logótipo da empresa."
+title = "Carregar Imagem da Assinatura"
+
 [watermark]
 completed = "Marca de água adicionada"
 desc = "Adicionar marcas de água de texto ou imagem a ficheiros PDF"
@@ -7333,6 +8005,7 @@ activeSession = "Sessão ativa"
 addMembers = "Adicionar membros"
 admin = "Administrador"
 confirmDelete = "Tem a certeza de que pretende eliminar este utilizador? Esta ação não pode ser anulada."
+confirmUnlock = "Tem a certeza de que pretende desbloquear esta conta de utilizador?"
 deleteUser = "Eliminar utilizador"
 deleteUserError = "Falha ao eliminar utilizador"
 deleteUserSuccess = "Utilizador eliminado com sucesso"
@@ -7341,6 +8014,8 @@ disable = "Desativar"
 disabled = "Desativado"
 editRole = "Editar função"
 enable = "Ativar"
+locked = "bloqueado"
+lockedBadge = "Bloqueado"
 loading = "A carregar pessoas..."
 loginRequired = "Ative primeiro o modo de login"
 member = "Membro"
@@ -7350,6 +8025,9 @@ searchMembers = "Procurar membros..."
 status = "Estado"
 team = "Equipa"
 title = "Pessoas"
+unlockAccount = "Desbloquear conta"
+unlockUserError = "Falha ao desbloquear a conta de utilizador"
+unlockUserSuccess = "Conta de utilizador desbloqueada com sucesso"
 user = "Utilizador"
 
 [workspace.people.actions]
diff --git a/frontend/public/locales/ro-RO/translation.toml b/frontend/public/locales/ro-RO/translation.toml
index 8d7f5c68f8..f42beadf85 100644
--- a/frontend/public/locales/ro-RO/translation.toml
+++ b/frontend/public/locales/ro-RO/translation.toml
@@ -8,6 +8,7 @@ black = "Negru"
 blue = "Albastru"
 bored = "Plictisit așteptând?"
 cancel = "Anulare"
+confirm = "Confirmați"
 changedCredsMessage = "Credențialele au fost schimbate!"
 chooseFile = "Alegeți fișier"
 close = "ÃŽnchide"
@@ -146,6 +147,7 @@ insufficientCredits = "Credite insuficiente. Necesare: {{requiredCredits}}, Disp
 loadingCredits = "Se verifică creditele..."
 loadingProStatus = "Se verifică starea abonamentului..."
 noticeTopUpOrPlan = "Credite insuficiente, reîncărcați sau treceți la un plan"
+accessInvite = "Invitați"
 
 [account]
 accountSettings = "Setări Cont"
@@ -1427,6 +1429,34 @@ title = "Procesare"
 description = "Timpul maxim de așteptare pentru o sarcină de procesare înainte de raportarea unei erori."
 label = "Timeout procesare (secunde)"
 
+[admin.settings.storage]
+description = "Controlați opțiunile de stocare pe server și de partajare."
+title = "Stocare fișiere și partajare"
+
+[admin.settings.storage.enabled]
+description = "Permite utilizatorilor să stocheze fișiere pe server."
+label = "Activați stocarea de fișiere pe server"
+
+[admin.settings.storage.sharing.email]
+description = "Permite partajarea cu adrese de e-mail."
+label = "Activați partajarea prin e-mail"
+mailLink = "Configurați setările de e-mail"
+mailNote = "Necesită configurare de e-mail. "
+
+[admin.settings.storage.sharing.enabled]
+description = "Permite utilizatorilor să partajeze fișierele stocate."
+label = "Activați partajarea"
+
+[admin.settings.storage.sharing.links]
+description = "Permite partajarea prin linkuri pentru utilizatori autentificați."
+frontendUrlLink = "Configurați în setările sistemului"
+frontendUrlNote = "Necesită un Frontend URL. "
+label = "Activați linkurile de partajare"
+
+[admin.settings.storage.signing.enabled]
+description = "Permite utilizatorilor să creeze sesiuni de semnare a documentelor cu mai mulți participanți. Necesită activarea stocării fișierelor pe server."
+label = "Activați semnarea în grup (Alpha)"
+
 [admin.settings.unsavedChanges]
 cancel = "Continuă editarea"
 discard = "Renunță la modificări"
@@ -2059,7 +2089,19 @@ numbers = "Numere/intervale: 5, 10-20"
 progressions = "Progresii: 3n, 4n+1"
 
 [certSign]
+allSigned = "Toți participanții au semnat. Gata de finalizare."
+awaitingSignatures = "În așteptarea semnăturilor"
+signatureProgress = "{{signedCount}}/{{totalCount}} semnături"
 chooseCertificate = "Alegeți fișierul certificatului"
+declined = "Refuzat"
+fetchFailed = "Nu s-au putut încărca datele de semnare"
+finalized = "Finalizat"
+notified = "În așteptare"
+partialNote = "Puteți finaliza mai devreme cu semnăturile curente. Participanții fără semnătură vor fi excluși."
+pending = "În așteptare"
+readyToFinalize = "Gata de finalizare"
+signed = "Semnat"
+viewed = "Vizualizat"
 chooseJksFile = "Alegeți fișierul JKS"
 chooseP12File = "Alegeți fișierul PKCS12"
 choosePfxFile = "Alegeți fișierul PFX"
@@ -2082,6 +2124,7 @@ title = "Semnare certificat"
 invisible = "Invizibil"
 stepTitle = "Aspectul semnăturii"
 visible = "Vizibil"
+visibility = "Vizibilitate"
 
 [certSign.appearance.options]
 title = "Detalii semnătură"
@@ -2188,6 +2231,252 @@ bullet4 = "Poate folosi certificate personalizate pentru verificare"
 text = "Când verificați semnăturile, instrumentul vă spune dacă sunt valide, cine a semnat documentul, când a fost semnat și dacă documentul a fost schimbat după semnare."
 title = "Verificarea semnăturilor"
 
+[certSign.collab.finalize]
+button = "Finalizați și încărcați PDF-ul semnat"
+early = "Finalizați cu semnăturile curente"
+
+[certSign.collab.sessionDetail]
+addButton = "Adăugați participanți"
+addParticipants = "Adăugați participanți"
+addParticipantsError = "Nu s-au putut adăuga participanții"
+backToList = "ÃŽnapoi la sesiuni"
+deleteConfirm = "Sunteți sigur(ă)? Aceasta nu poate fi anulată."
+deleteError = "Nu s-a putut șterge sesiunea"
+deleted = "Sesiune ștearsă"
+deleteSession = "Ștergeți sesiunea"
+dueDate = "Data limită"
+finalizeError = "Nu s-a putut finaliza sesiunea"
+loadPdfError = "Nu s-a putut încărca PDF-ul semnat"
+loadSignedPdf = "Încărcați PDF-ul semnat în fișierele active"
+messageLabel = "Mesaj"
+noAdditionalInfo = "Nicio informație suplimentară"
+owner = "Proprietar"
+participantRemoved = "Participant eliminat"
+participants = "Participanți"
+participantsAdded = "Participanți adăugați cu succes"
+removeParticipant = "Eliminați"
+removeParticipantError = "Nu s-a putut elimina participantul"
+selectUsers = "Selectați utilizatori..."
+sessionInfo = "Informații sesiune"
+workbenchTitle = "Administrare sesiuni"
+
+[certSign.collab.signRequest]
+addedToFiles = "Document adăugat la fișierele active"
+addSignature = "Adăugați semnătura dvs."
+addToFiles = "Adăugați la fișierele active"
+advancedSettings = "Setări avansate"
+backToList = "ÃŽnapoi la cereri de semnare"
+certificateChoice = "Selectați un certificat pentru semnare"
+changeSignature = "Schimbați semnătura"
+clearSignature = "Ștergeți semnătura"
+completeAndSign = "Finalizați și semnați"
+createNewSignature = "Creați semnătură nouă"
+declineButton = "Refuzați"
+decline = "Refuzați cererea"
+deleteSelected = "Ștergeți semnătura selectată"
+drawSignature = "Desenați-vă semnătura mai jos"
+dueDate = "Data limită"
+fileTooLarge = "Dimensiunea fișierului trebuie să fie mai mică de 5MB"
+fontFamily = "Familie de fonturi"
+fontSize = "Mărimea fontului: {{size}}px"
+fontSizePlaceholder = "Mărime"
+from = "De la"
+invalidCertFile = "Selectați un fișier certificat P12 sau PFX"
+invalidFileType = "Selectați un fișier imagine"
+location = "Locație (Opțional)"
+locationPlaceholder = "De unde semnați?"
+message = "Mesaj"
+noCertificate = "Selectați un fișier certificat"
+noSignatures = "Plasați cel puțin o semnătură pe PDF"
+p12File = "Fișier certificat P12/PFX"
+password = "Parola certificatului"
+passwordPlaceholder = "Introduceți parola..."
+penColor = "Culoarea stiloului"
+penSize = "Grosimea stiloului: {{size}}px"
+placementActive = "Faceți clic pe PDF pentru a plasa"
+placeSignatureButton = "Plasați semnătura pe PDF"
+reason = "Motiv (Opțional)"
+reasonPlaceholder = "De ce semnați?"
+removeImage = "Eliminați imaginea"
+removeCertFile = "Eliminați fișierul"
+savedSignatures = "Semnături salvate"
+selectFile = "Selectați fișier imagine"
+selectSignatureTitle = "Selectați sau creați o semnătură"
+signButton = "Semnați documentul"
+signatureInfo = "Aceste setări sunt configurate de proprietarul documentului"
+signaturePlaced = "Semnătură plasată pe pagină"
+signatureSettings = "Setări semnătură"
+signatureText = "Textul semnăturii"
+signatureTextPlaceholder = "Introduceți numele dvs...."
+signatureTypeLabel = "Tipul semnăturii"
+signingTitle = "Semnare"
+textColor = "Culoarea textului"
+typeSignature = "Tastați-vă numele pentru a crea o semnătură"
+uploadCert = "Certificat personalizat"
+uploadCertDesc = "Utilizați propriul certificat P12/PFX"
+uploadSignature = "Încărcați imaginea semnăturii"
+usePersonalCert = "Certificat personal"
+usePersonalCertDesc = "Generat automat pentru contul dvs."
+useServerCert = "Certificat al organizației"
+useServerCertDesc = "Certificat partajat al organizației"
+workbenchTitle = "Cerere de semnare"
+
+[certSign.collab.signRequest.canvas]
+colorPickerTitle = "Alegeți culoarea traseului"
+continue = "Continuați"
+
+[certSign.collab.signRequest.certModal]
+description = "Ați plasat {{count}} semnătură(i). Alegeți certificatul pentru a finaliza semnarea."
+sign = "Semnați documentul"
+certValidating = "Se validează certificatul..."
+certValidUntil = "Certificat valabil până la {{date}}"
+certInvalid = "Certificat invalid: {{error}}"
+certInvalidFallback = "Certificat invalid"
+certNetworkError = "Nu s-a putut valida certificatul"
+title = "Configurați certificatul"
+
+[certSign.collab.signRequest.image]
+hint = "Încărcați o imagine PNG sau JPG a semnăturii dvs."
+
+[certSign.collab.signRequest.mode]
+move = "Mutați semnătura"
+place = "Plasați semnătura"
+title = "Mod semnare sau mutare"
+
+[certSign.collab.signRequest.modeTabs]
+draw = "Desen"
+image = "Încărcare"
+text = "Text"
+
+[certSign.collab.signRequest.placeSignature]
+message = "Faceți clic pe PDF pentru a plasa semnătura"
+title = "Plasați semnătura"
+
+[certSign.collab.signRequest.preview]
+imageAlt = "Semnătura selectată"
+missing = "Fără previzualizare"
+textFallback = "Semnătură"
+
+[certSign.collab.signRequest.saved]
+defaultCanvasLabel = "Semnătură desenată"
+defaultImageLabel = "Semnătură încărcată"
+defaultLabel = "Semnătură"
+defaultTextLabel = "Semnătură tastată"
+delete = "Ștergeți semnătura"
+none = "Nicio semnătură salvată"
+
+[certSign.collab.signRequest.signatureType]
+draw = "Desen"
+type = "Text"
+upload = "Încărcare"
+
+[certSign.collab.signRequest.steps]
+back = "ÃŽnapoi"
+cancelPlacement = "Anulați plasarea"
+certificate = "Certificat"
+clickMultipleTimes = "Faceți clic de mai multe ori pe PDF pentru a plasa semnături. Trageți orice semnătură pentru a o muta sau redimensiona."
+clickToPlace = "Faceți clic pe PDF unde doriți să apară semnătura."
+continue = "Continuați la selectarea certificatului"
+continueToPlacement = "Continuați la plasare"
+continueToReview = "Continuați la revizuire"
+createSignature = "Creați semnătură"
+invisible = "Invizibil"
+location = "Locație:"
+multipleSignatures = "{{count}} semnături vor fi aplicate pe PDF"
+oneSignature = "1 semnătură va fi aplicată pe PDF"
+placeOnPdf = "Plasați pe PDF"
+reason = "Motiv:"
+reviewTitle = "Revizuire înainte de semnare"
+signaturePlaced = "Semnătură plasată pe pagina {{page}}. Puteți ajusta poziția făcând clic din nou sau continua la revizuire."
+visible = "Vizibil"
+visibility = "Vizibilitate:"
+yourSignatures = "Semnăturile dvs. ({{count}})"
+
+[certSign.collab.signRequest.text]
+colorLabel = "Culoare"
+fontLabel = "Font"
+fontSizeLabel = "Mărime"
+fontSizePlaceholder = "16"
+label = "Textul semnăturii"
+modalHint = "Introduceți numele dvs., apoi faceți clic pe Continuați pentru a-l plasa pe PDF."
+placeholder = "Introduceți numele dvs...."
+
+[certSign.collab.participant]
+certValidating = "Se validează certificatul..."
+certValid = "✓ Certificat valid"
+certValidUntil = " până la {{date}}"
+certInvalid = "✗ {{error}}"
+certInvalidFallback = "Certificat invalid"
+certNetworkError = "Nu s-a putut valida certificatul"
+
+[certSign.collab.addParticipants]
+add = "Adăugați {{count}} participant(ți)"
+back = "ÃŽnapoi"
+configureSignatures = "Configurați setările semnăturii"
+continue = "Continuați la setările semnăturii"
+reasonHelp = "Predefiniți un motiv de semnare pentru acești participanți (opțional, îl pot modifica la semnare)"
+reasonPlaceholder = "de ex. Aprobare, Revizuire..."
+selectUsers = "Selectați utilizatori"
+
+[certSign.collab.sessionCreation]
+includeSummaryPage = "Includeți pagina de sumar a semnăturilor"
+includeSummaryPageHelp = "O pagină de sumar va fi adăugată la final cu toate metadatele semnăturilor. Căsuțele de semnătură cu certificat digital de pe paginile individuale vor fi suprimate (semnăturile olografe nu sunt afectate)."
+
+[certSign.collab.sessionList]
+active = "Active"
+finalized = "Finalizate"
+
+[certSign.collab.signatureSettings]
+description = "Configurați modul în care vor apărea semnăturile pentru toți participanții"
+title = "Aspectul semnăturii"
+
+[certSign.collab.userSelector]
+inviteUsers = "Adăugați utilizatori"
+loadError = "Nu s-au putut încărca utilizatorii"
+noTeam = "Fără echipă"
+noUsers = "Nu s-au găsit alți utilizatori."
+placeholder = "Selectați utilizatori..."
+
+[certSign.mobile]
+panelActions = "Acțiuni"
+panelDocument = "Document"
+panelPeople = "Persoane"
+
+[certSign.sessions]
+deleted = "Sesiune ștearsă"
+fetchFailed = "Nu s-au putut încărca detaliile sesiunii"
+finalized = "Sesiune finalizată"
+loaded = "PDF semnat încărcat"
+pdfNotReady = "PDF-ul nu este gata"
+pdfNotReadyDesc = "PDF-ul semnat este în curs de generare. Încercați din nou peste puțin timp."
+
+[certificateChoice.tooltip]
+header = "Tipuri de certificate"
+
+[certificateChoice.tooltip.organization]
+bullet1 = "Gestionat de administratorii de sistem"
+bullet2 = "Partajat între utilizatorii autorizați"
+bullet3 = "Reprezintă identitatea companiei, nu pe cea individuală"
+bullet4 = "Ideal pentru: Documente oficiale, semnături de echipă"
+description = "Un certificat partajat furnizat de organizația dvs. Utilizat pentru autoritate de semnare la nivel de companie."
+title = "Certificat al organizației"
+
+[certificateChoice.tooltip.personal]
+bullet1 = "Generat automat la prima utilizare"
+bullet2 = "Asociat contului dvs. de utilizator"
+bullet3 = "Nu poate fi partajat cu alți utilizatori"
+bullet4 = "Ideal pentru: Documente personale, responsabilitate individuală"
+description = "Un certificat generat automat, unic pentru contul dvs. de utilizator. Potrivit pentru semnături individuale."
+title = "Certificat personal"
+
+[certificateChoice.tooltip.upload]
+bullet1 = "Necesită fișier P12/PFX și parolă"
+bullet2 = "Poate fi emis de Autorități de Certificare externe"
+bullet3 = "Nivel de încredere mai ridicat pentru documente legale"
+bullet4 = "Ideal pentru: Contracte cu valoare legală, validare externă"
+description = "Utilizați propriul fișier de certificat PKCS#12. Oferă control complet asupra proprietăților certificatului."
+title = "Încărcați P12 personalizat"
+
 [changeCreds]
 changePassword = "Utilizezi credențiale de conectare implicite. Te rugăm să introduci o nouă parolă"
 changeUsername = "Actualizați numele de utilizator. Veți fi deconectat(ă) după actualizare."
@@ -3242,6 +3531,46 @@ totalSelected = "Total selectate"
 unsupported = "Nesuportat"
 unzip = "Dezarhivați"
 uploadError = "Încărcarea unor fișiere a eșuat."
+copyCreated = "Copia a fost salvată pe acest dispozitiv."
+copyFailed = "Nu s-a putut crea o copie."
+leaveShare = "Eliminați din lista mea"
+leaveShareFailed = "Nu s-a putut elimina fișierul partajat."
+leaveShareSuccess = "Eliminat din lista dvs. de partajate."
+removeBoth = "Eliminați din ambele"
+removeFilePrompt = "Acest fișier este salvat pe acest dispozitiv și pe serverul dvs. De unde doriți să îl eliminați?"
+removeFileTitle = "Eliminați fișierul"
+removeLocalOnly = "Doar de pe acest dispozitiv"
+removeServerFailed = "Nu s-a putut elimina fișierul de pe server."
+removeServerOnly = "Doar de pe server"
+removeServerOnlyPrompt = "Acest fișier este stocat doar pe serverul dvs. Doriți să îl eliminați de pe server?"
+removeServerSuccess = "Eliminat de pe server."
+removeSharedPrompt = "Acest fișier este partajat cu dvs. Îl puteți elimina de pe acest dispozitiv sau din lista dvs. de partajate."
+removeSharedServerOnlyBlockedPrompt = "Acest fișier este partajat cu dvs. și este stocat doar pe server."
+removeSharedServerOnlyPrompt = "Acest fișier este partajat cu dvs. și este stocat doar pe server. Îl eliminați din lista dvs.?"
+changesNotUploaded = "Modificări neîncărcate"
+cloudFile = "Fișier în cloud"
+filterAll = "Toate"
+filterLocal = "Locale"
+filterSharedByMe = "Partajate de mine"
+filterSharedWithMe = "Partajate cu mine"
+lastSynced = "Ultima sincronizare"
+localOnly = "Doar local"
+makeCopy = "Creați o copie"
+owner = "Proprietar"
+ownerUnknown = "Necunoscut"
+share = "Partajați"
+shareSelected = "Partajați elementele selectate"
+sharedByYou = "Partajat de dvs."
+sharedEditNoticeBody = "Nu aveți drepturi de editare asupra versiunii de pe server a acestui fișier. Orice modificări pe care le faceți vor fi salvate ca o copie locală."
+sharedEditNoticeConfirm = "Am înțeles"
+sharedEditNoticeTitle = "Copie pe server doar pentru citire"
+sharedWithYou = "Partajat cu dvs."
+sharing = "Partajare"
+storageState = "Stocare"
+synced = "Sincronizat"
+updateOnServer = "Actualizați pe server"
+uploadSelected = "Încărcați elementele selectate"
+uploadToServer = "Încărcați pe server"
 
 [files]
 addFiles = "Adăugați fișiere"
@@ -3367,6 +3696,77 @@ title = "Despre aplatizarea PDF-urilor"
 discord = "Discord"
 issues = "GitHub"
 
+[groupSigning.tooltip]
+header = "Despre semnarea în grup"
+
+[groupSigning.tooltip.finalization]
+bullet1 = "Toate semnăturile sunt aplicate în ordinea participanților specificată de dvs."
+bullet2 = "Puteți finaliza cu semnături parțiale, dacă este necesar"
+bullet3 = "După finalizare, sesiunea nu mai poate fi modificată"
+description = "După ce toți participanții au semnat (sau alegeți să finalizați mai devreme), puteți genera PDF-ul final semnat."
+title = "Procesul de finalizare"
+
+[groupSigning.tooltip.roles]
+bullet1 = "Proprietar (dvs.): Creează sesiunea, configurează valorile implicite ale semnăturii, finalizează documentul"
+bullet2 = "Participanți: Își creează semnătura, aleg certificatul, plasează pe PDF"
+bullet3 = "Participanții nu pot modifica setările de vizibilitate, motiv sau locație ale semnăturii"
+description = "Controlați setările aspectului semnăturii pentru toți participanții."
+title = "Rolurile participanților"
+
+[groupSigning.tooltip.sequential]
+bullet1 = "Primul participant trebuie să semneze înainte ca al doilea să poată accesa documentul"
+bullet2 = "Asigură ordinea corectă de semnare pentru conformitate legală"
+bullet3 = "Puteți reordona participanții trăgându-i în listă"
+description = "Participanții semnează documentele în ordinea pe care o specificați. Fiecare semnatar primește o notificare când îi vine rândul."
+title = "Semnare secvențială"
+
+[groupSigning.steps]
+back = "ÃŽnapoi"
+completed = "Finalizat"
+current = "Curent"
+stepLabel = "Pasul {{number}}"
+
+[groupSigning.steps.configureDefaults]
+continue = "Continuați la revizuire"
+invisible = "Semnăturile vor fi invizibile (doar metadata)"
+locationLabel = "Locație:"
+preview = "Previzualizare"
+reasonLabel = "Motiv:"
+title = "Configurați setările semnăturii"
+visible = "Semnăturile vor fi vizibile pe pagina {{page}}"
+
+[groupSigning.steps.review]
+document = "Document"
+dueDate = "Data limită (opțional)"
+dueDatePlaceholder = "Selectați data limită..."
+invisible = "Invizibil (doar metadata)"
+location = "Locație:"
+logo = "Logo:"
+logoHidden = "Fără logo"
+logoShown = "Logo Stirling PDF afișat"
+participants = "Participanți"
+reason = "Motiv:"
+send = "Trimiteți cereri de semnare"
+signatureSettings = "Setările semnăturii"
+title = "Revizuiți detaliile sesiunii"
+titleShort = "Revizuire și trimitere"
+visibility = "Vizibilitate:"
+visible = "Vizibil pe pagina {{page}}"
+participantCount = "{{count}} participant(ți) vor semna în ordine"
+
+[groupSigning.steps.selectDocument]
+continue = "Continuați la selectarea participanților"
+noFile = "Selectați un singur fișier PDF din fișierele active pentru a crea o sesiune de semnare."
+selectedFile = "Document selectat"
+title = "Selectați documentul"
+
+[groupSigning.steps.selectParticipants]
+continue = "Continuați la setările semnăturii"
+count = "{{count}} participant(ți) selectați"
+label = "Selectați participanții"
+placeholder = "Alegeți participanți pentru semnare..."
+title = "Alegeți participanții"
+
 [getPdfInfo]
 downloadJson = "Descarcă JSON"
 downloads = "Descărcări"
@@ -4460,7 +4860,10 @@ zoomOut = "Micșorați"
 
 [viewer]
 cannotPreviewFile = "Nu se poate previzualiza fișierul"
+disableColorFilter = "Dezactivați filtrul de culoare"
 dualPageView = "Vizualizare cu două pagini"
+enableDarkFilter = "Activați filtrul întunecat"
+enableSepiaFilter = "Activați filtrul sepia"
 firstPage = "Prima pagină"
 lastPage = "Ultima pagină"
 nextPage = "Pagina următoare"
@@ -4470,6 +4873,22 @@ singlePageView = "Vizualizare cu o singură pagină"
 unknownFile = "Fișier necunoscut"
 zoomIn = "Măriți"
 zoomOut = "Micșorați"
+resetZoom = "Resetați zoomul"
+
+[viewer.nonPdf]
+fileTypeBadge = "Fișier {{type}}"
+convertToPdf = "Convertiți în PDF"
+loading = "Se încarcă..."
+emptyFile = "Fișier gol"
+csvStats = "{{rows}} rânduri · {{columns}} coloane · {{size}}"
+sortedBy = "Sortat după: {{column}}"
+columnDefault = "Coloana {{index}}"
+htmlPreviewWarning = "Previzualizare HTML — resursele externe s-ar putea să nu se încarce · {{size}}"
+htmlPreview = "Previzualizare HTML"
+invalidJson = "JSON invalid — se afișează conținutul brut"
+textStats = "{{lines}} linii · {{size}}"
+lineNumbers = "Numere de linie"
+renderMarkdown = "Redați markdown"
 
 [viewer.attachments]
 title = "Atașamente"
@@ -4531,6 +4950,7 @@ toggleAttachments = "Afișează/ascunde atașamentele"
 toggleTheme = "Comutați tema"
 language = "Limbă"
 toggleAnnotations = "Comutați vizibilitatea adnotărilor"
+toggleLayers = "Comutați straturile"
 search = "Căutați în PDF"
 panMode = "Mod panoramare"
 applyRedactionsFirst = "Aplicați mai întâi redactările"
@@ -5407,20 +5827,72 @@ title = "Tipărește Fișier"
 2 = "Introdu Numele Imprimantei"
 
 [quickAccess]
+access = "Acces"
+accessAddPerson = "Adăugați încă o persoană"
+accessBack = "ÃŽnapoi"
+accessCopyLink = "Copiați linkul"
+accessEmail = "Adresă de e-mail"
+accessEmailPlaceholder = "nume@companie.com"
+accessFileLabel = "Fișier"
+accessGeneral = "Acces general"
+accessInviteTitle = "Invitați persoane"
+accessOwner = "Proprietar"
+accessPanel = "Acces la document"
+accessPeople = "Persoane cu acces"
+accessRemove = "Eliminați"
+accessRestricted = "Restricționat"
+accessRestrictedHint = "Numai persoanele cu acces pot deschide"
+accessRole = "Rol"
+accessRoleCommenter = "Comentator"
+accessRoleEditor = "Editor"
+accessRoleViewer = "Vizualizator"
+accessSelectedFile = "Fișier selectat"
+accessSendInvite = "Trimiteți invitație"
+accessTitle = "Acces la document"
+accessYou = "Dvs."
 account = "Cont"
+activeSessions = "Sesiuni active"
+activeTab = "Active"
 activity = "Jurnal"
 adminSettings = "Setări admin"
+allSessions = "Toate sesiunile"
 allTools = "All Tools"
 automate = "Auto"
+back = "ÃŽnapoi"
+certSign = "Semnare cu certificat"
+completedSessions = "Sesiuni finalizate"
+completedTab = "Finalizate"
 config = "Config"
+createNew = "Creați cerere nouă"
+createSession = "Creați cerere de semnare"
+dueDate = "Data limită (opțional)"
 files = "Fișiere"
 help = "Ajutor"
+noActiveSessions = "Nicio cerere de semnare în așteptare sau sesiune activă"
+noCompletedSessions = "Nicio sesiune finalizată"
+noFile = "Niciun fișier selectat"
 read = "Citire"
 reader = "Cititor"
+refresh = "Reîmprospătați"
+requestSignatures = "Solicitați semnături"
+selectSingleFileToRequest = "Selectați un singur fișier PDF pentru a solicita semnături"
+selectedFile = "Fișier selectat"
+selectUsers = "Selectați utilizatori pentru semnare"
+selectUsersPlaceholder = "Alegeți participanți..."
+sendingRequest = "Se trimite..."
 settings = "Setări"
 showMeAround = "Ghidează-mă"
 sign = "Semnează"
+signatureRequests = "Cereri de semnare"
+signYourself = "Semnați personal"
+newRequest = "Cerere nouă"
 tours = "Tururi"
+wetSign = "Adăugați semnătură"
+filterMine = "Ale mele"
+filterOverdue = "Întârziate"
+filterSigned = "Semnate"
+filterDeclined = "Refuzate"
+searchDocuments = "Căutați documente…"
 
 [quickAccess.helpMenu]
 adminTour = "Turul de administrare"
@@ -6050,11 +6522,75 @@ toolNotAvailableLocally = "Serverul dvs. Stirling-PDF este offline, iar \"{{endp
 expired = "Sesiunea dvs. a expirat. Reîmprospătați pagina și încercați din nou."
 refreshPage = "Reîmprospătați pagina"
 
+[sessionManagement.tooltip]
+header = "Gestionarea sesiunilor de semnare"
+
+[sessionManagement.tooltip.addParticipants]
+bullet1 = "Noii participanți sunt adăugați la finalul ordinii de semnare"
+bullet2 = "Nu se pot adăuga participanți după finalizarea sesiunii"
+bullet3 = "Fiecare participant primește o notificare când îi vine rândul"
+description = "Puteți adăuga mai mulți participanți la o sesiune activă oricând înainte de finalizare."
+title = "Adăugarea participanților"
+
+[sessionManagement.tooltip.finalization]
+bullet1 = "<b>Finalizare completă</b>: Toți participanții au semnat"
+bullet2 = "<b>Finalizare parțială</b>: Unii participanți nu au semnat încă"
+bullet3 = "Participanții fără semnătură vor fi excluși din documentul final"
+bullet4 = "După finalizare, puteți încărca PDF-ul semnat în fișierele active"
+description = "Finalizarea combină toate semnăturile într-un singur PDF semnat. Această acțiune nu poate fi anulată."
+title = "Finalizarea sesiunii"
+
+[sessionManagement.tooltip.participantRemoval]
+bullet1 = "Nu pot fi eliminați participanții care au semnat deja"
+bullet2 = "Participanții eliminați nu mai primesc notificări"
+bullet3 = "Ordinea de semnare se ajustează automat"
+description = "Participanții pot fi eliminați din sesiuni înainte să semneze."
+title = "Eliminarea participanților"
+
+[sessionManagement.tooltip.signatureOrder]
+bullet1 = "Fiecare semnătură este aplicată secvențial pe PDF"
+bullet2 = "Semnatarii ulteriori pot vedea semnăturile anterioare"
+bullet3 = "Critic pentru fluxuri de aprobare și lanțuri legale de custodie"
+description = "Ordinea specificată la crearea sesiunii determină cine semnează primul."
+title = "Ordinea semnăturilor"
+
+[signatureSettings.tooltip]
+header = "Setări de aspect ale semnăturii"
+
+[signatureSettings.tooltip.location]
+bullet1 = "Exemple: \"New York, USA\", \"London Office\", \"Remote\""
+bullet2 = "Nu este același lucru cu poziția pe pagină"
+bullet3 = "Poate fi necesară în anumite jurisdicții legale"
+description = "Locație geografică opțională unde a fost aplicată semnătura. Stocată în metadata certificatului."
+title = "Locația semnăturii"
+
+[signatureSettings.tooltip.logo]
+bullet1 = "Afișat alături de semnătură și text"
+bullet2 = "Acceptă formatele PNG, JPG"
+bullet3 = "Îmbunătățește aspectul profesional"
+description = "Adăugați un logo al companiei la semnăturile vizibile pentru branding și autenticitate."
+title = "Logo companie"
+
+[signatureSettings.tooltip.reason]
+bullet1 = "Exemple: \"Aprobare\", \"Acord contractual\", \"Revizuire finalizată\""
+bullet2 = "Vizibil în proprietățile semnăturii PDF"
+bullet3 = "Util pentru trasee de audit și conformitate"
+description = "Text opțional care explică de ce este semnat documentul. Stocat în metadata certificatului."
+title = "Motivul semnăturii"
+
+[signatureSettings.tooltip.visibility]
+bullet1 = "<b>Vizibil</b>: Semnătura apare pe PDF cu aspect personalizat"
+bullet2 = "<b>Invizibil</b>: Certificatul este încorporat fără marcaj vizual"
+bullet3 = "Semnăturile invizibile oferă în continuare validare criptografică"
+description = "Controlează dacă semnătura este vizibilă pe document sau încorporată invizibil."
+title = "Vizibilitatea semnăturii"
+
 [settings.configuration]
 advanced = "Avansat"
 database = "Bază de date"
 endpoints = "Endpoint-uri"
 features = "Funcții"
+storageSharing = "Stocare fișiere și partajare"
 systemSettings = "Setări sistem"
 title = "Configurație"
 
@@ -6332,10 +6868,13 @@ title = "Autentifică-te în Stirling"
 [setup.selfhosted]
 link = "sau conectați-vă la un cont self-hosted"
 subtitle = "Introdu acreditările serverului tău"
+changeServerLocked = "Organizația dvs. a restricționat această aplicație la un anumit server"
 switchToLocal = "Utilizați instrumentele locale în schimb"
 title = "Autentifică-te pe server"
 
 [setup.selfhosted.unreachable]
+changeServer = "Conectați-vă la un alt server"
+changeServerLocked = "Organizația dvs. a restricționat această aplicație la un anumit server"
 continueOffline = "Utilizați instrumentele locale în schimb"
 message = "Nu s-a putut accesa {{url}}. Verificați că serverul rulează și este accesibil."
 retry = "Reîncercați"
@@ -6529,6 +7068,15 @@ saved = "Salvate"
 text = "Text"
 title = "Tip de semnătură"
 
+[signRequest]
+declined = "Cererea de semnare a fost refuzată"
+fetchFailed = "Nu s-a putut încărca cererea de semnare"
+signed = "Document semnat cu succes"
+
+[signSession]
+createFailed = "Nu s-a putut crea cererea de semnare"
+created = "Cererea de semnare a fost trimisă"
+
 [signup]
 accountCreatedSuccessfully = "Cont creat cu succes! Acum vă puteți autentifica."
 alreadyHaveAccount = "Aveți deja un cont? Autentificați-vă"
@@ -6807,6 +7355,106 @@ title = "Împarte PDF după capitole"
 [splitPdfByChapters]
 tags = "împarte,capitole,semne de carte,organizează"
 
+[storageShare]
+accessed = "Accesat"
+accessDenied = "Nu aveți acces la acest fișier partajat. Cereți proprietarului să îl partajeze cu dvs."
+accessFailed = "Nu se poate încărca activitatea."
+accessDeniedBody = "Nu aveți acces la acest fișier. Cereți proprietarului să îl partajeze cu dvs."
+accessDeniedTitle = "Fără acces"
+accessLimitedCommenter = "Accesul de comentare va fi disponibil în curând. Cereți proprietarului acces de editor dacă aveți nevoie să descărcați."
+accessLimitedTitle = "Acces limitat"
+accessLimitedViewer = "Acest link este doar pentru vizualizare. Cereți proprietarului acces de editor dacă aveți nevoie să descărcați."
+createdAt = "Creat"
+download = "Descărcați"
+downloadFailed = "Nu se poate descărca acest fișier."
+expiredBody = "Acest link de partajare este invalid sau a expirat."
+expiredTitle = "Link expirat"
+goToLogin = "Mergeți la autentificare"
+loadFailed = "Nu se poate deschide fișierul partajat."
+loading = "Se încarcă linkul de partajare..."
+loginPrompt = "Autentificați-vă pentru a accesa acest fișier partajat."
+loginRequired = "Autentificare necesară"
+openInApp = "Deschide în Stirling PDF"
+ownerLabel = "Proprietar"
+ownerUnknown = "Necunoscut"
+requiresLogin = "Acest fișier partajat necesită autentificare."
+roleCommenter = "Comentator"
+roleEditor = "Editor"
+roleViewer = "Vizualizator"
+shareHeading = "Fișier partajat"
+titleDefault = "Fișier partajat"
+tryAgain = "Vă rugăm să încercați din nou mai târziu."
+addUser = "Adăugați"
+commenterHint = "Funcția de comentare va fi disponibilă în curând."
+copied = "Link copiat în clipboard"
+copy = "Copiați"
+copyFailed = "Copiere eșuată"
+description = "Creați un link de partajare pentru acest fișier. Utilizatorii autentificați cu linkul îl pot accesa."
+downloadsCount = "Descărcări: {{count}}"
+emailWarningBody = "Aceasta pare a fi o adresă de e-mail. Dacă această persoană nu este deja utilizator Stirling PDF, nu va putea accesa fișierul."
+emailWarningConfirm = "Partajați oricum"
+emailWarningTitle = "Adresă de e-mail"
+errorTitle = "Partajarea a eșuat"
+failure = "Nu s-a putut genera un link de partajare. Încercați din nou."
+fileLabel = "Fișier"
+generate = "Generați link"
+generated = "Link de partajare generat"
+hideActivity = "Ascundeți activitatea"
+invalidUsername = "Introduceți un nume de utilizator sau o adresă de e-mail validă."
+lastAccessed = "Accesat ultima dată"
+linkAccessTitle = "Acces prin link de partajare"
+linkLabel = "Link de partajare"
+linksDisabled = "Linkurile de partajare sunt dezactivate."
+linksDisabledBody = "Linkurile de partajare sunt dezactivate în setările serverului dvs."
+manage = "Gestionați partajarea"
+manageDescription = "Creați și gestionați linkuri pentru a partaja acest fișier."
+manageLoadFailed = "Nu se pot încărca linkurile de partajare."
+manageTitle = "Gestionați partajarea"
+noActivity = "Nicio activitate încă."
+noLinks = "Încă nu există linkuri de partajare active."
+noSharedUsers = "Încă nu au acces utilizatori."
+removeLink = "Eliminați linkul"
+removeUser = "Eliminați"
+revokeFailed = "Nu s-a putut elimina linkul de partajare."
+revoked = "Linkul de partajare a fost eliminat"
+roleLabel = "Rol"
+sharingDisabled = "Partajarea este dezactivată."
+sharingDisabledBody = "Partajarea a fost dezactivată de setările serverului."
+sharedUsersTitle = "Utilizatori cu care este partajat"
+title = "Partajați fișierul"
+unknownUser = "Utilizator necunoscut"
+userAddFailed = "Nu se poate partaja cu acel utilizator."
+userAdded = "Utilizator adăugat la lista de partajare."
+usernameLabel = "Nume de utilizator sau e-mail"
+usernamePlaceholder = "Introduceți un nume de utilizator sau un e-mail"
+userRemoveFailed = "Nu se poate elimina acel utilizator."
+userRemoved = "Utilizator eliminat din lista de partajare."
+viewActivity = "Vizualizați activitatea"
+viewed = "Vizualizat"
+viewsCount = "Vizualizări: {{count}}"
+downloaded = "Descărcat"
+bulkDescription = "Creați un singur link pentru a partaja toate fișierele selectate cu utilizatorii autentificați."
+bulkTitle = "Partajați fișierele selectate"
+copyLink = "Copiați linkul de partajare"
+fileCount = "{{count}} fișiere selectate"
+ownerOnly = "Doar proprietarul poate gestiona partajarea."
+selectSingleFile = "Selectați un singur fișier pentru a gestiona partajarea."
+
+[storageUpload]
+description = "Aceasta încarcă fișierul curent în spațiul de stocare al serverului pentru accesul dvs."
+errorTitle = "Încărcare eșuată"
+failure = "Încărcare eșuată. Verificați autentificarea și setările de stocare."
+fileLabel = "Fișier"
+hint = "Linkurile publice și modurile de acces sunt controlate de setările serverului."
+success = "Încărcat pe server"
+title = "Încărcați pe server"
+updateButton = "Actualizați pe server"
+uploadButton = "Încărcați pe server"
+bulkDescription = "Aceasta încarcă fișierele selectate în spațiul de stocare al serverului dvs."
+bulkTitle = "Încărcați fișierele selectate"
+fileCount = "{{count}} fișiere selectate"
+more = " +{{count}} în plus"
+
 [storage]
 approximateSize = "Dimensiune aproximativă"
 fileTooLarge = "Fișier prea mare. Dimensiunea maximă per fișier este"
@@ -7153,6 +7801,30 @@ title = "Vizualizați/Editați PDF"
 [warning]
 tooltipTitle = "Avertisment"
 
+[wetSignature.tooltip]
+header = "Metode de creare a semnăturii"
+
+[wetSignature.tooltip.draw]
+bullet1 = "Personalizați culoarea și grosimea liniei"
+bullet2 = "Ștergeți și redesenați până când sunteți mulțumit"
+bullet3 = "Funcționează pe dispozitive cu ecran tactil (tablete, telefoane)"
+description = "Creați o semnătură olografă folosind mouse-ul sau ecranul tactil. Ideală pentru semnături personale, autentice."
+title = "Desenați semnătura"
+
+[wetSignature.tooltip.type]
+bullet1 = "Alegeți dintre mai multe fonturi"
+bullet2 = "Personalizați dimensiunea și culoarea textului"
+bullet3 = "Perfect pentru semnături standardizate"
+description = "Generați o semnătură din text tastat. Rapidă și consecventă, potrivită pentru documente de afaceri."
+title = "Tastați semnătura"
+
+[wetSignature.tooltip.upload]
+bullet1 = "Acceptă PNG, JPG și alte formate de imagine"
+bullet2 = "Fundalurile transparente sunt recomandate pentru rezultate optime"
+bullet3 = "Imaginea va fi redimensionată pentru a se potrivi zonei semnăturii"
+description = "Încărcați o imagine de semnătură preexistentă. Ideală dacă aveți o semnătură scanată sau un logo al companiei."
+title = "Încărcați imaginea semnăturii"
+
 [watermark]
 completed = "Filigran adăugat"
 desc = "Adaugă filigrane text sau imagine în fișiere PDF"
@@ -7333,6 +8005,7 @@ activeSession = "Sesiune activă"
 addMembers = "Adăugați membri"
 admin = "Administrator"
 confirmDelete = "Sigur doriți să ștergeți acest utilizator? Această acțiune nu poate fi anulată."
+confirmUnlock = "Sigur doriți să deblocați acest cont de utilizator?"
 deleteUser = "Ștergeți utilizatorul"
 deleteUserError = "Ștergerea utilizatorului a eșuat"
 deleteUserSuccess = "Utilizator șters cu succes"
@@ -7341,6 +8014,8 @@ disable = "Dezactivează"
 disabled = "Dezactivat"
 editRole = "Editați rolul"
 enable = "Activează"
+locked = "blocat"
+lockedBadge = "Blocat"
 loading = "Se încarcă membrii..."
 loginRequired = "Activează mai întâi modul de autentificare"
 member = "Membru"
@@ -7350,6 +8025,9 @@ searchMembers = "Căutați membri..."
 status = "Stare"
 team = "Echipă"
 title = "Membri"
+unlockAccount = "Deblocați contul"
+unlockUserError = "Deblocarea contului de utilizator a eșuat"
+unlockUserSuccess = "Contul de utilizator a fost deblocat cu succes"
 user = "Utilizator"
 
 [workspace.people.actions]
diff --git a/frontend/public/locales/ru-RU/translation.toml b/frontend/public/locales/ru-RU/translation.toml
index 7342f0b83f..5fe49e4a86 100644
--- a/frontend/public/locales/ru-RU/translation.toml
+++ b/frontend/public/locales/ru-RU/translation.toml
@@ -8,6 +8,7 @@ black = "Черный"
 blue = "Синий"
 bored = "Скучно ждать?"
 cancel = "Отмена"
+confirm = "Подтвердить"
 changedCredsMessage = "Учетные данные изменены!"
 chooseFile = "Выбрать файл"
 close = "Закрыть"
@@ -146,6 +147,7 @@ insufficientCredits = "�едо�таточно кредитов. Требует
 loadingCredits = "Проверка кредитов..."
 loadingProStatus = "Проверка �тату�а подпи�ки..."
 noticeTopUpOrPlan = "�едо�таточно кредитов, пополните балан� или перейдите на тариф"
+accessInvite = "Пригла�ить"
 
 [account]
 accountSettings = "�а�тройки аккаунта"
@@ -1427,6 +1429,34 @@ title = "Обработка"
 description = "Мак�имальное врем� ожидани� выполнени� задачи до �ообщени� об ошибке."
 label = "Таймаут обработки (�екунды)"
 
+[admin.settings.storage]
+description = "Управл�йте хранением на �ервере и параметрами общего до�тупа."
+title = "Хранение файлов и общий до�туп"
+
+[admin.settings.storage.enabled]
+description = "Разрешить пользовател�м хранить файлы на �ервере."
+label = "Включить хранение файлов на �ервере"
+
+[admin.settings.storage.sharing.email]
+description = "Разрешить общий до�туп по адре�ам �лектронной почты."
+label = "Включить общий до�туп по �лектронной почте"
+mailLink = "�а�троить параметры почты"
+mailNote = "Требует�� на�тройка почты. "
+
+[admin.settings.storage.sharing.enabled]
+description = "Разрешить пользовател�м делить�� �охранёнными файлами."
+label = "Включить общий до�туп"
+
+[admin.settings.storage.sharing.links]
+description = "Разрешить общий до�туп через ��ылки дл� вошедших пользователей."
+frontendUrlLink = "�а�троить в �и�темных на�тройках"
+frontendUrlNote = "Требует�� Frontend URL. "
+label = "Включить ��ылки общего до�тупа"
+
+[admin.settings.storage.signing.enabled]
+description = "Разрешить пользовател�м �оздавать �е��ии подпи�ани� документа � не�колькими уча�тниками. Требует�� включить хранение файлов на �ервере."
+label = "Включить групповое подпи�ание (Alpha)"
+
 [admin.settings.unsavedChanges]
 cancel = "Продолжить редактирование"
 discard = "Отменить изменени�"
@@ -2059,7 +2089,19 @@ numbers = "Чи�ла/диапазоны: 5, 10–20"
 progressions = "Прогре��ии: 3n, 4n+1"
 
 [certSign]
+allSigned = "В�е уча�тники подпи�али. Готово к завершению."
+awaitingSignatures = "Ожидание подпи�ей"
+signatureProgress = "{{signedCount}}/{{totalCount}} подпи�ей"
 chooseCertificate = "Выберите файл �ертификата"
+declined = "Отклонено"
+fetchFailed = "�е удало�ь загрузить данные о подпи�ании"
+finalized = "Завершено"
+notified = "Ожидает"
+partialNote = "Вы можете завершить раньше � текущими подпи��ми. �еподпи�авшие уча�тники будут и�ключены."
+pending = "Ожидает"
+readyToFinalize = "Готово к завершению"
+signed = "Подпи�ано"
+viewed = "Про�мотрено"
 chooseJksFile = "Выберите файл JKS"
 chooseP12File = "Выберите файл PKCS12"
 choosePfxFile = "Выберите файл PFX"
@@ -2082,6 +2124,7 @@ title = "Подпи�ание �ертификатом"
 invisible = "�евидима�"
 stepTitle = "Вид подпи�и"
 visible = "Видима�"
+visibility = "Видимо�ть"
 
 [certSign.appearance.options]
 title = "Сведени� о подпи�и"
@@ -2188,6 +2231,252 @@ bullet4 = "Можно и�пользовать пользователь�кие
 text = "При проверке подпи�ей ин�трумент �ообщает, дей�твительны ли они, кто подпи�ал документ, когда он был подпи�ан и мен�л�� ли по�ле подпи�ани�."
 title = "Проверка подпи�ей"
 
+[certSign.collab.finalize]
+button = "Завершить и загрузить подпи�анный PDF"
+early = "Завершить � текущими подпи��ми"
+
+[certSign.collab.sessionDetail]
+addButton = "Добавить уча�тников"
+addParticipants = "Добавить уча�тников"
+addParticipantsError = "�е удало�ь добавить уча�тников"
+backToList = "�азад к �е��и�м"
+deleteConfirm = "Вы уверены? Дей�твие необратимо."
+deleteError = "�е удало�ь удалить �е��ию"
+deleted = "Се��и� удалена"
+deleteSession = "Удалить �е��ию"
+dueDate = "Срок"
+finalizeError = "�е удало�ь завершить �е��ию"
+loadPdfError = "�е удало�ь загрузить подпи�анный PDF"
+loadSignedPdf = "Загрузить подпи�анный PDF в активные файлы"
+messageLabel = "Сообщение"
+noAdditionalInfo = "�ет дополнительной информации"
+owner = "Владелец"
+participantRemoved = "Уча�тник удалён"
+participants = "Уча�тники"
+participantsAdded = "Уча�тники у�пешно добавлены"
+removeParticipant = "Удалить"
+removeParticipantError = "�е удало�ь удалить уча�тника"
+selectUsers = "Выберите пользователей..."
+sessionInfo = "Информаци� о �е��ии"
+workbenchTitle = "Управление �е��ией"
+
+[certSign.collab.signRequest]
+addedToFiles = "Документ добавлен в активные файлы"
+addSignature = "Добавьте �вою подпи�ь"
+addToFiles = "Добавить в активные файлы"
+advancedSettings = "Дополнительные на�тройки"
+backToList = "�азад к запро�ам подпи�и"
+certificateChoice = "Выберите �ертификат дл� подпи�и"
+changeSignature = "Изменить подпи�ь"
+clearSignature = "Очи�тить подпи�ь"
+completeAndSign = "Завершить и подпи�ать"
+createNewSignature = "Создать новую подпи�ь"
+declineButton = "Отклонить"
+decline = "Отклонить запро�"
+deleteSelected = "Удалить выбранную подпи�ь"
+drawSignature = "�ари�уйте �вою подпи�ь ниже"
+dueDate = "Срок"
+fileTooLarge = "Размер файла должен быть меньше 5 МБ"
+fontFamily = "Шрифт"
+fontSize = "Размер шрифта: {{size}}px"
+fontSizePlaceholder = "Размер"
+from = "От"
+invalidCertFile = "Выберите файл �ертификата P12 или PFX"
+invalidFileType = "Выберите файл изображени�"
+location = "Ме�тоположение (необ�зательно)"
+locationPlaceholder = "Откуда вы подпи�ываете?"
+message = "Сообщение"
+noCertificate = "Выберите файл �ертификата"
+noSignatures = "Разме�тите хот� бы одну подпи�ь на PDF"
+p12File = "Файл �ертификата P12/PFX"
+password = "Пароль �ертификата"
+passwordPlaceholder = "Введите пароль..."
+penColor = "Цвет пера"
+penSize = "Толщина пера: {{size}}px"
+placementActive = "Щёлкните по PDF, чтобы разме�тить"
+placeSignatureButton = "Разме�тить подпи�ь на PDF"
+reason = "Причина (необ�зательно)"
+reasonPlaceholder = "Зачем вы подпи�ываете?"
+removeImage = "Удалить изображение"
+removeCertFile = "Удалить файл"
+savedSignatures = "Сохранённые подпи�и"
+selectFile = "Выбрать файл изображени�"
+selectSignatureTitle = "Выбрать или �оздать подпи�ь"
+signButton = "Подпи�ать документ"
+signatureInfo = "Эти на�тройки задаёт владелец документа"
+signaturePlaced = "Подпи�ь размещена на �транице"
+signatureSettings = "�а�тройки подпи�и"
+signatureText = "Тек�т подпи�и"
+signatureTextPlaceholder = "Введите ваше им�..."
+signatureTypeLabel = "Тип подпи�и"
+signingTitle = "Подпи�ание"
+textColor = "Цвет тек�та"
+typeSignature = "Введите �воё им�, чтобы �оздать подпи�ь"
+uploadCert = "Соб�твенный �ертификат"
+uploadCertDesc = "И�пользуйте �вой �ертификат P12/PFX"
+uploadSignature = "Загрузите изображение подпи�и"
+usePersonalCert = "Личный �ертификат"
+usePersonalCertDesc = "�втоматиче�ки �генерирован дл� вашей учётной запи�и"
+useServerCert = "Сертификат организации"
+useServerCertDesc = "Общий �ертификат организации"
+workbenchTitle = "Запро� подпи�и"
+
+[certSign.collab.signRequest.canvas]
+colorPickerTitle = "Выберите цвет штриха"
+continue = "Продолжить"
+
+[certSign.collab.signRequest.certModal]
+description = "Вы разме�тили {{count}} подпи�ь(и). Выберите �ертификат дл� завершени� подпи�ани�."
+sign = "Подпи�ать документ"
+certValidating = "Проверка �ертификата..."
+certValidUntil = "Сертификат дей�твителен до {{date}}"
+certInvalid = "�едей�твительный �ертификат: {{error}}"
+certInvalidFallback = "�едей�твительный �ертификат"
+certNetworkError = "�е удало�ь подтвердить �ертификат"
+title = "�а�тройка �ертификата"
+
+[certSign.collab.signRequest.image]
+hint = "Загрузите изображение PNG или JPG � вашей подпи�ью"
+
+[certSign.collab.signRequest.mode]
+move = "Переме�тить подпи�ь"
+place = "Разме�тить подпи�ь"
+title = "Режим размещени� или перемещени�"
+
+[certSign.collab.signRequest.modeTabs]
+draw = "Ри�овать"
+image = "Загрузить"
+text = "Вве�ти"
+
+[certSign.collab.signRequest.placeSignature]
+message = "Щёлкните по PDF, чтобы разме�тить �вою подпи�ь"
+title = "Разме�тить подпи�ь"
+
+[certSign.collab.signRequest.preview]
+imageAlt = "Выбранна� подпи�ь"
+missing = "�ет предпро�мотра"
+textFallback = "Подпи�ь"
+
+[certSign.collab.signRequest.saved]
+defaultCanvasLabel = "Ри�ованна� подпи�ь"
+defaultImageLabel = "Загруженна� подпи�ь"
+defaultLabel = "Подпи�ь"
+defaultTextLabel = "Введённа� подпи�ь"
+delete = "Удалить подпи�ь"
+none = "Сохранённых подпи�ей нет"
+
+[certSign.collab.signRequest.signatureType]
+draw = "Ри�овать"
+type = "Вве�ти"
+upload = "Загрузить"
+
+[certSign.collab.signRequest.steps]
+back = "�азад"
+cancelPlacement = "Отменить размещение"
+certificate = "Сертификат"
+clickMultipleTimes = "Щёлкните по PDF не�колько раз, чтобы разме�тить подпи�и. Перета�кивайте подпи�ь дл� перемещени� или изменени� размера."
+clickToPlace = "Щёлкните по PDF, где должна по�вить�� ваша подпи�ь."
+continue = "Перейти к выбору �ертификата"
+continueToPlacement = "Перейти к размещению"
+continueToReview = "Перейти к проверке"
+createSignature = "Создать подпи�ь"
+invisible = "�евидима�"
+location = "Ме�тоположение:"
+multipleSignatures = "{{count}} подпи�ь(и) будут применены к PDF"
+oneSignature = "1 подпи�ь будет применена к PDF"
+placeOnPdf = "Разме�тить на PDF"
+reason = "Причина:"
+reviewTitle = "Проверка перед подпи�анием"
+signaturePlaced = "Подпи�ь размещена на �транице {{page}}. Вы можете �корректировать позицию, щёлкнув ещё раз, или продолжить к проверке."
+visible = "Видима�"
+visibility = "Видимо�ть:"
+yourSignatures = "Ваши подпи�и ({{count}})"
+
+[certSign.collab.signRequest.text]
+colorLabel = "Цвет"
+fontLabel = "Шрифт"
+fontSizeLabel = "Размер"
+fontSizePlaceholder = "16"
+label = "Тек�т подпи�и"
+modalHint = "Введите �воё им�, затем нажмите «Продолжить», чтобы разме�тить его на PDF."
+placeholder = "Введите ваше им�..."
+
+[certSign.collab.participant]
+certValidating = "Проверка �ертификата..."
+certValid = "✓ Сертификат дей�твителен"
+certValidUntil = " до {{date}}"
+certInvalid = "✗ {{error}}"
+certInvalidFallback = "�едей�твительный �ертификат"
+certNetworkError = "�е удало�ь подтвердить �ертификат"
+
+[certSign.collab.addParticipants]
+add = "Добавить {{count}} уча�тник(ов)"
+back = "�азад"
+configureSignatures = "�а�троить параметры подпи�и"
+continue = "Перейти к на�тройкам подпи�и"
+reasonHelp = "Преду�тановить причину подпи�ани� дл� �тих уча�тников (необ�зательно; её можно изменить при подпи�ании)"
+reasonPlaceholder = "например, «Утверждение», «Проверка»..."
+selectUsers = "Выбрать пользователей"
+
+[certSign.collab.sessionCreation]
+includeSummaryPage = "Добавить �траницу �водки подпи�ей"
+includeSummaryPageHelp = "В конце будет добавлена �траница �о в�еми метаданными подпи�и. Пол� цифровой подпи�и на отдельных �траницах будут �крыты (рукопи�ные подпи�и не затронуты)."
+
+[certSign.collab.sessionList]
+active = "�ктивные"
+finalized = "Завершённые"
+
+[certSign.collab.signatureSettings]
+description = "�а�тройте, как будут выгл�деть подпи�и дл� в�ех уча�тников"
+title = "Внешний вид подпи�и"
+
+[certSign.collab.userSelector]
+inviteUsers = "Добавить пользователей"
+loadError = "�е удало�ь загрузить пользователей"
+noTeam = "Без команды"
+noUsers = "Другие пользователи не найдены."
+placeholder = "Выберите пользователей..."
+
+[certSign.mobile]
+panelActions = "Дей�тви�"
+panelDocument = "Документ"
+panelPeople = "Люди"
+
+[certSign.sessions]
+deleted = "Се��и� удалена"
+fetchFailed = "�е удало�ь загрузить данные �е��ии"
+finalized = "Се��и� завершена"
+loaded = "Подпи�анный PDF загружен"
+pdfNotReady = "PDF не готов"
+pdfNotReadyDesc = "Подпи�анный PDF генерирует��. Повторите попытку позже."
+
+[certificateChoice.tooltip]
+header = "Типы �ертификатов"
+
+[certificateChoice.tooltip.organization]
+bullet1 = "Управл�ет�� �и�темными админи�траторами"
+bullet2 = "До�тупен авторизованным пользовател�м"
+bullet3 = "Пред�тавл�ет компанию, а не конкретного человека"
+bullet4 = "Лучше в�его дл�: официальных документов, командных подпи�ей"
+description = "Общий �ертификат вашей организации. И�пользует�� дл� корпоративной подпи�и."
+title = "Сертификат организации"
+
+[certificateChoice.tooltip.personal]
+bullet1 = "Генерирует�� автоматиче�ки при первом и�пользовании"
+bullet2 = "Прив�зан к вашей учётной запи�и"
+bullet3 = "�ельз� поделить�� � другими пользовател�ми"
+bullet4 = "Лучше в�его дл�: личных документов, индивидуальной ответ�твенно�ти"
+description = "�втоматиче�ки �генерированный �ертификат, уникальный дл� вашей учётной запи�и. Подходит дл� индивидуальных подпи�ей."
+title = "Личный �ертификат"
+
+[certificateChoice.tooltip.upload]
+bullet1 = "Требуют�� файл P12/PFX и пароль"
+bullet2 = "Может быть выдан внешними центрами �ертификации"
+bullet3 = "Более вы�окий уровень довери� дл� юридиче�ких документов"
+bullet4 = "Лучше в�его дл�: юридиче�ки значимых контрактов, внешней валидации"
+description = "И�пользуйте �об�твенный �ертификат PKCS#12. Предо�тавл�ет полный контроль над �вой�твами �ертификата."
+title = "Загрузить �об�твенный P12"
+
 [changeCreds]
 changePassword = "Вы и�пользуете �тандартные учетные данные дл� входа. Пожалуй�та, введите новый пароль"
 changeUsername = "Обновите им� пользовател�. По�ле обновлени� вы будете выведены из �и�темы."
@@ -3242,6 +3531,46 @@ totalSelected = "В�его выбрано"
 unsupported = "�е поддерживает��"
 unzip = "Ра�паковать"
 uploadError = "�е удало�ь загрузить некоторые файлы."
+copyCreated = "Копи� �охранена на �том у�трой�тве."
+copyFailed = "�е удало�ь �оздать копию."
+leaveShare = "Убрать из моего �пи�ка"
+leaveShareFailed = "�е удало�ь удалить общий файл."
+leaveShareSuccess = "Удалено из вашего �пи�ка общих файлов."
+removeBoth = "Удалить из обоих"
+removeFilePrompt = "Этот файл �охранён на �том у�трой�тве и на вашем �ервере. Где вы хотите его удалить?"
+removeFileTitle = "Удалить файл"
+removeLocalOnly = "Только на �том у�трой�тве"
+removeServerFailed = "�е удало�ь удалить файл � �ервера."
+removeServerOnly = "Только на �ервере"
+removeServerOnlyPrompt = "Этот файл хранит�� только на вашем �ервере. Удалить его � �ервера?"
+removeServerSuccess = "Удалено � �ервера."
+removeSharedPrompt = "Этот файл предо�тавлен вам. Вы можете удалить его � �того у�трой�тва или из �пи�ка общих файлов."
+removeSharedServerOnlyBlockedPrompt = "Этот файл предо�тавлен вам и хранит�� только на �ервере."
+removeSharedServerOnlyPrompt = "Этот файл предо�тавлен вам и хранит�� только на �ервере. Удалить его из вашего �пи�ка?"
+changesNotUploaded = "Изменени� не загружены"
+cloudFile = "Файл в облаке"
+filterAll = "В�е"
+filterLocal = "Локальные"
+filterSharedByMe = "Мною предо�тавленные"
+filterSharedWithMe = "Предо�тавлены мне"
+lastSynced = "По�ледн�� �инхронизаци�"
+localOnly = "Только локально"
+makeCopy = "Сделать копию"
+owner = "Владелец"
+ownerUnknown = "�еизве�тно"
+share = "Поделить��"
+shareSelected = "Поделить�� выбранными"
+sharedByYou = "Предо�тавлены вами"
+sharedEditNoticeBody = "У ва� нет прав на редактирование �ерверной вер�ии �того файла. Любые изменени� будут �охранены как локальна� копи�."
+sharedEditNoticeConfirm = "Пон�тно"
+sharedEditNoticeTitle = "Серверна� копи� только дл� чтени�"
+sharedWithYou = "Предо�тавлены вам"
+sharing = "Общий до�туп"
+storageState = "Хранилище"
+synced = "Синхронизировано"
+updateOnServer = "Обновить на �ервере"
+uploadSelected = "Загрузить выбранные"
+uploadToServer = "Загрузить на �ервер"
 
 [files]
 addFiles = "Добавить файлы"
@@ -3367,6 +3696,77 @@ title = "Об уплощении PDF"
 discord = "Discord"
 issues = "GitHub"
 
+[groupSigning.tooltip]
+header = "О групповом подпи�ании"
+
+[groupSigning.tooltip.finalization]
+bullet1 = "В�е подпи�и примен�ют�� в указанном вами пор�дке уча�тников"
+bullet2 = "При необходимо�ти можно завершить � неполным набором подпи�ей"
+bullet3 = "По�ле завершени� �е��ию нельз� изменить"
+description = "Когда в�е уча�тники подпишут (или вы решите завершить раньше), вы �можете �генерировать финальный подпи�анный PDF."
+title = "Проце�� завершени�"
+
+[groupSigning.tooltip.roles]
+bullet1 = "Владелец (вы): �оздаёт �е��ию, на�траивает значени� по умолчанию, завершает документ"
+bullet2 = "Уча�тники: �оздают подпи�ь, выбирают �ертификат, размещают на PDF"
+bullet3 = "Уча�тники не могут измен�ть видимо�ть, причину или ме�тоположение подпи�и"
+description = "Вы управл�ете на�тройками внешнего вида подпи�и дл� в�ех уча�тников."
+title = "Роли уча�тников"
+
+[groupSigning.tooltip.sequential]
+bullet1 = "Первый уча�тник должен подпи�ать, прежде чем второй получит до�туп к документу"
+bullet2 = "Обе�печивает корректный пор�док подпи�ани� дл� юридиче�кой �оответ�тви�"
+bullet3 = "Вы можете мен�ть пор�док уча�тников, перета�кива� их в �пи�ке"
+description = "Уча�тники подпи�ывают документы в указанном вами пор�дке. Каждый подпи�ант получает уведомление, когда на�тупает его очередь."
+title = "По�ледовательное подпи�ание"
+
+[groupSigning.steps]
+back = "�азад"
+completed = "Завершено"
+current = "Текущий"
+stepLabel = "Шаг {{number}}"
+
+[groupSigning.steps.configureDefaults]
+continue = "Перейти к проверке"
+invisible = "Подпи�и будут невидимыми (только метаданные)"
+locationLabel = "Ме�тоположение:"
+preview = "Предпро�мотр"
+reasonLabel = "Причина:"
+title = "�а�троить параметры подпи�и"
+visible = "Подпи�и будут видимы на �транице {{page}}"
+
+[groupSigning.steps.review]
+document = "Документ"
+dueDate = "Срок (необ�зательно)"
+dueDatePlaceholder = "Выберите �рок..."
+invisible = "�евидима� (только метаданные)"
+location = "Ме�тоположение:"
+logo = "Логотип:"
+logoHidden = "Без логотипа"
+logoShown = "Логотип Stirling PDF отображает��"
+participants = "Уча�тники"
+reason = "Причина:"
+send = "Отправить запро�ы на подпи�ь"
+signatureSettings = "�а�тройки подпи�и"
+title = "Проверка �ведений о �е��ии"
+titleShort = "Проверка и отправка"
+visibility = "Видимо�ть:"
+visible = "Видима на �транице {{page}}"
+participantCount = "{{count}} уча�тник(ов) будет подпи�ывать по пор�дку"
+
+[groupSigning.steps.selectDocument]
+continue = "Перейти к выбору уча�тников"
+noFile = "Выберите один PDF-файл из активных файлов, чтобы �оздать �е��ию подпи�ани�."
+selectedFile = "Выбранный документ"
+title = "Выберите документ"
+
+[groupSigning.steps.selectParticipants]
+continue = "Перейти к на�тройкам подпи�и"
+count = "Выбрано уча�тник(ов): {{count}}"
+label = "Выберите уча�тников"
+placeholder = "Выберите уча�тников дл� подпи�и..."
+title = "Выбор уча�тников"
+
 [getPdfInfo]
 downloadJson = "Скачать JSON"
 downloads = "Загрузки"
@@ -4460,7 +4860,10 @@ zoomOut = "Уменьшить"
 
 [viewer]
 cannotPreviewFile = "�е удаёт�� про�мотреть файл"
+disableColorFilter = "Отключить цветовой фильтр"
 dualPageView = "Двух�траничный вид"
+enableDarkFilter = "Включить тёмный фильтр"
+enableSepiaFilter = "Включить фильтр �епи�"
 firstPage = "Перва� �траница"
 lastPage = "По�ледн�� �траница"
 nextPage = "Следующа� �траница"
@@ -4470,6 +4873,22 @@ singlePageView = "Одно�траничный вид"
 unknownFile = "�еизве�тный файл"
 zoomIn = "Увеличить"
 zoomOut = "Уменьшить"
+resetZoom = "Сбро�ить ма�штаб"
+
+[viewer.nonPdf]
+fileTypeBadge = "Файл {{type}}"
+convertToPdf = "Преобразовать в PDF"
+loading = "Загрузка..."
+emptyFile = "Пу�той файл"
+csvStats = "{{rows}} �трок · {{columns}} �толбцов · {{size}}"
+sortedBy = "Сортировка по: {{column}}"
+columnDefault = "Столбец {{index}}"
+htmlPreviewWarning = "Предпро�мотр HTML — внешние ре�ур�ы могут не загрузить�� · {{size}}"
+htmlPreview = "Предпро�мотр HTML"
+invalidJson = "�екорректный JSON — показано и�ходное �одержимое"
+textStats = "{{lines}} �трок · {{size}}"
+lineNumbers = "�омера �трок"
+renderMarkdown = "Отобразить markdown"
 
 [viewer.attachments]
 title = "Вложени�"
@@ -4531,6 +4950,7 @@ toggleAttachments = "Показать/�крыть вложени�"
 toggleTheme = "Переключить тему"
 language = "Язык"
 toggleAnnotations = "Показать/�крыть аннотации"
+toggleLayers = "Переключить �лои"
 search = "Пои�к по PDF"
 panMode = "Режим панорамировани�"
 applyRedactionsFirst = "Сначала примените зачернени�"
@@ -5407,20 +5827,72 @@ title = "Печать файла"
 2 = "Введите им� принтера"
 
 [quickAccess]
+access = "До�туп"
+accessAddPerson = "Добавить ещё человека"
+accessBack = "�азад"
+accessCopyLink = "Копировать ��ылку"
+accessEmail = "�дре� �лектронной почты"
+accessEmailPlaceholder = "name@company.com"
+accessFileLabel = "Файл"
+accessGeneral = "Общий до�туп"
+accessInviteTitle = "Пригла�ить людей"
+accessOwner = "Владелец"
+accessPanel = "До�туп к документу"
+accessPeople = "Люди � до�тупом"
+accessRemove = "Удалить"
+accessRestricted = "Ограничен"
+accessRestrictedHint = "Только пользователи � до�тупом могут открыть"
+accessRole = "Роль"
+accessRoleCommenter = "Комментатор"
+accessRoleEditor = "Редактор"
+accessRoleViewer = "Про�мотр"
+accessSelectedFile = "Выбранный файл"
+accessSendInvite = "Отправить приглашение"
+accessTitle = "До�туп к документу"
+accessYou = "Ð’Ñ‹"
 account = "Учетна� запи�ь"
+activeSessions = "�ктивные �е��ии"
+activeTab = "�ктивные"
 activity = "Журнал"
 adminSettings = "�дмин. на�тр."
+allSessions = "В�е �е��ии"
 allTools = "Ин�тр."
 automate = "�вто"
+back = "�азад"
+certSign = "Подпи�ать �ертификатом"
+completedSessions = "Завершённые �е��ии"
+completedTab = "Завершённые"
 config = "Конфиг"
+createNew = "Создать новый запро�"
+createSession = "Создать запро� подпи�и"
+dueDate = "Срок (необ�зательно)"
 files = "Файлы"
 help = "Справка"
+noActiveSessions = "�ет ожидающих запро�ов подпи�и или активных �е��ий"
+noCompletedSessions = "�ет завершённых �е��ий"
+noFile = "Файл не выбран"
 read = "Чтение"
 reader = "Читалка"
+refresh = "Обновить"
+requestSignatures = "Запро�ить подпи�и"
+selectSingleFileToRequest = "Выберите один PDF-файл, чтобы запро�ить подпи�и"
+selectedFile = "Выбранный файл"
+selectUsers = "Выберите пользователей дл� подпи�и"
+selectUsersPlaceholder = "Выберите уча�тников..."
+sendingRequest = "Отправка..."
 settings = "Опции"
 showMeAround = "Проведите по интерфей�у"
 sign = "Подпи�ь"
+signatureRequests = "Запро�ы подпи�и"
+signYourself = "Подпи�ать �амому"
+newRequest = "�овый запро�"
 tours = "Туры"
+wetSign = "Добавить подпи�ь"
+filterMine = "Мои"
+filterOverdue = "Про�рочено"
+filterSigned = "Подпи�ано"
+filterDeclined = "Отклонено"
+searchDocuments = "Пои�к документов…"
 
 [quickAccess.helpMenu]
 adminTour = "Обзор админи�трировани�"
@@ -6050,11 +6522,75 @@ toolNotAvailableLocally = "Ваш �ервер Stirling-PDF офлайн, и \"{
 expired = "Ваша �е��и� и�текла. Пожалуй�та, обновите �траницу и попробуйте �нова."
 refreshPage = "Обновить �траницу"
 
+[sessionManagement.tooltip]
+header = "Управление �е��и�ми подпи�ани�"
+
+[sessionManagement.tooltip.addParticipants]
+bullet1 = "�овые уча�тники добавл�ют�� в конец пор�дка подпи�ани�"
+bullet2 = "�ельз� добавл�ть уча�тников по�ле завершени� �е��ии"
+bullet3 = "Каждый уча�тник получает уведомление, когда на�тупает его очередь"
+description = "Вы можете добавл�ть уча�тников в активную �е��ию в любое врем� до завершени�."
+title = "Добавление уча�тников"
+
+[sessionManagement.tooltip.finalization]
+bullet1 = "<b>Полное завершение</b>: в�е уча�тники подпи�али"
+bullet2 = "<b>Ча�тичное завершение</b>: некоторые уча�тники ещё не подпи�али"
+bullet3 = "�еподпи�авшие уча�тники будут и�ключены из финального документа"
+bullet4 = "По�ле завершени� вы можете загрузить подпи�анный PDF в активные файлы"
+description = "Завершение объедин�ет в�е подпи�и в один подпи�анный PDF. Это дей�твие нельз� отменить."
+title = "Завершение �е��ии"
+
+[sessionManagement.tooltip.participantRemoval]
+bullet1 = "�ельз� удалить уча�тников, которые уже подпи�али"
+bullet2 = "Удалённые уча�тники больше не получают уведомлени�"
+bullet3 = "Пор�док подпи�ани� корректирует�� автоматиче�ки"
+description = "Уча�тников можно удал�ть из �е��ий до того, как они подпишут."
+title = "Удаление уча�тников"
+
+[sessionManagement.tooltip.signatureOrder]
+bullet1 = "Кажда� подпи�ь примен�ет�� к PDF по�ледовательно"
+bullet2 = "Поздние подпи�анты вид�т более ранние подпи�и"
+bullet3 = "Критично дл� проце��ов утверждени� и юридиче�кой цепочки хранени�"
+description = "Пор�док, который вы задаёте при �оздании �е��ии, определ�ет, кто подпи�ывает первым."
+title = "Пор�док подпи�ей"
+
+[signatureSettings.tooltip]
+header = "�а�тройки внешнего вида подпи�и"
+
+[signatureSettings.tooltip.location]
+bullet1 = "Примеры: «New York, USA», «London Office», «Remote»"
+bullet2 = "�е то же �амое, что позици� на �транице"
+bullet3 = "Может требовать�� в некоторых юри�дикци�х"
+description = "�еоб�зательное географиче�кое ме�тоположение, где была по�тавлена подпи�ь. Хранит�� в метаданных �ертификата."
+title = "Ме�тоположение подпи�и"
+
+[signatureSettings.tooltip.logo]
+bullet1 = "Отображает�� р�дом � подпи�ью и тек�том"
+bullet2 = "Поддерживают�� форматы PNG, JPG"
+bullet3 = "Повышает профе��иональный вид"
+description = "Добавьте логотип компании к видимым подпи��м дл� брендинга и подтверждени� подлинно�ти."
+title = "Логотип компании"
+
+[signatureSettings.tooltip.reason]
+bullet1 = "Примеры: «Утверждение», «Заключение контракта», «Проверка завершена»"
+bullet2 = "Видна в �вой�твах подпи�и PDF"
+bullet3 = "Полезна дл� аудита и �оответ�тви� требовани�м"
+description = "�еоб�зательный тек�т, объ��н�ющий, почему документ подпи�ывает��. Хранит�� в метаданных �ертификата."
+title = "Причина подпи�и"
+
+[signatureSettings.tooltip.visibility]
+bullet1 = "<b>Видима�</b>: подпи�ь по�вл�ет�� в PDF � на�траиваемым видом"
+bullet2 = "<b>�евидима�</b>: �ертификат в�траивает�� без визуальной метки"
+bullet3 = "�евидимые подпи�и в�ё равно обе�печивают криптографиче�кую проверку"
+description = "Определ�ет, будет ли подпи�ь видна в документе или в�троена невидимо."
+title = "Видимо�ть подпи�и"
+
 [settings.configuration]
 advanced = "Дополнительно"
 database = "База данных"
 endpoints = "Конечные точки"
 features = "Функции"
+storageSharing = "Хранение файлов и общий до�туп"
 systemSettings = "Си�темные на�тройки"
 title = "Конфигураци�"
 
@@ -6332,10 +6868,13 @@ title = "Вход в Stirling"
 [setup.selfhosted]
 link = "или подключите�ь к �амохо�тируемой учётной запи�и"
 subtitle = "Введите учётные данные �ервера"
+changeServerLocked = "Ваша организаци� ограничила �то приложение определённым �ервером"
 switchToLocal = "Вме�то �того и�пользовать локальные ин�трументы"
 title = "Вход на �ервер"
 
 [setup.selfhosted.unreachable]
+changeServer = "Подключить�� к другому �ерверу"
+changeServerLocked = "Ваша организаци� ограничила �то приложение определённым �ервером"
 continueOffline = "Вме�то �того и�пользовать локальные ин�трументы"
 message = "�е удало�ь �в�зать�� � {{url}}. Проверьте, что �ервер запущен и до�тупен."
 retry = "Повторить попытку"
@@ -6529,6 +7068,15 @@ saved = "Сохранённое"
 text = "Тек�т"
 title = "Тип подпи�и"
 
+[signRequest]
+declined = "Запро� подпи�и отклонён"
+fetchFailed = "�е удало�ь загрузить запро� подпи�и"
+signed = "Документ у�пешно подпи�ан"
+
+[signSession]
+createFailed = "�е удало�ь �оздать запро� подпи�и"
+created = "Запро� подпи�и отправлен"
+
 [signup]
 accountCreatedSuccessfully = "�ккаунт у�пешно �оздан! Теперь вы можете войти."
 alreadyHaveAccount = "Уже е�ть аккаунт? Войдите"
@@ -6807,6 +7355,106 @@ title = "Разделить PDF по главам"
 [splitPdfByChapters]
 tags = "разделение,главы,закладки,организаци�"
 
+[storageShare]
+accessed = "Открыто"
+accessDenied = "У ва� нет до�тупа к �тому общему файлу. Попро�ите владельца поделить�� им � вами."
+accessFailed = "�е удало�ь загрузить активно�ть."
+accessDeniedBody = "У ва� нет до�тупа к �тому файлу. Попро�ите владельца поделить�� им � вами."
+accessDeniedTitle = "�ет до�тупа"
+accessLimitedCommenter = "До�туп дл� комментариев �коро по�вит��. Попро�ите у владельца до�туп редактора, е�ли нужно �качать."
+accessLimitedTitle = "Ограниченный до�туп"
+accessLimitedViewer = "Эта ��ылка только дл� про�мотра. Попро�ите у владельца до�туп редактора, е�ли нужно �качать."
+createdAt = "Создано"
+download = "Скачать"
+downloadFailed = "�е удало�ь �качать �тот файл."
+expiredBody = "Эта ��ылка общего до�тупа недей�твительна или �рок её дей�тви� и�тёк."
+expiredTitle = "С�ылка недей�твительна"
+goToLogin = "Перейти ко входу"
+loadFailed = "�е удало�ь открыть общий файл."
+loading = "Загрузка ��ылки общего до�тупа..."
+loginPrompt = "Войдите, чтобы получить до�туп к �тому общему файлу."
+loginRequired = "Требует�� вход"
+openInApp = "Открыть в Stirling PDF"
+ownerLabel = "Владелец"
+ownerUnknown = "�еизве�тно"
+requiresLogin = "Дл� �того общего файла требует�� вход."
+roleCommenter = "Комментатор"
+roleEditor = "Редактор"
+roleViewer = "Про�мотр"
+shareHeading = "Общий файл"
+titleDefault = "Общий файл"
+tryAgain = "Повторите попытку позже."
+addUser = "Добавить"
+commenterHint = "Комментирование �коро по�вит��."
+copied = "С�ылка �копирована в буфер обмена"
+copy = "Копировать"
+copyFailed = "�е удало�ь �копировать"
+description = "Создать ��ылку общего до�тупа к �тому файлу. Вошедшие пользователи �о ��ылкой �могут получить до�туп."
+downloadsCount = "Загрузки: {{count}}"
+emailWarningBody = "Похоже на адре� �лектронной почты. Е�ли �тот человек ещё не �вл�ет�� пользователем Stirling PDF, он не �может получить до�туп к файлу."
+emailWarningConfirm = "В�ё равно поделить��"
+emailWarningTitle = "�дре� �лектронной почты"
+errorTitle = "�е удало�ь поделить��"
+failure = "�е удало�ь �генерировать ��ылку общего до�тупа. Повторите попытку."
+fileLabel = "Файл"
+generate = "Сгенерировать ��ылку"
+generated = "С�ылка общего до�тупа �оздана"
+hideActivity = "Скрыть активно�ть"
+invalidUsername = "Введите корректное им� пользовател� или адре� �лектронной почты."
+lastAccessed = "По�ледний до�туп"
+linkAccessTitle = "До�туп по ��ылке общего до�тупа"
+linkLabel = "С�ылка общего до�тупа"
+linksDisabled = "С�ылки общего до�тупа отключены."
+linksDisabledBody = "С�ылки общего до�тупа отключены на�тройками вашего �ервера."
+manage = "Управление общим до�тупом"
+manageDescription = "Создавайте и управл�йте ��ылками дл� общего до�тупа к �тому файлу."
+manageLoadFailed = "�е удало�ь загрузить ��ылки общего до�тупа."
+manageTitle = "Управление общим до�тупом"
+noActivity = "Пока нет активно�ти."
+noLinks = "�ктивных ��ылок общего до�тупа пока нет."
+noSharedUsers = "Пока нет пользователей � до�тупом."
+removeLink = "Удалить ��ылку"
+removeUser = "Удалить"
+revokeFailed = "�е удало�ь удалить ��ылку общего до�тупа."
+revoked = "С�ылка общего до�тупа удалена"
+roleLabel = "Роль"
+sharingDisabled = "Общий до�туп отключен."
+sharingDisabledBody = "Общий до�туп отключен на�тройками вашего �ервера."
+sharedUsersTitle = "Пользователи � до�тупом"
+title = "Общий до�туп к файлу"
+unknownUser = "�еизве�тный пользователь"
+userAddFailed = "�е удало�ь предо�тавить общий до�туп �тому пользователю."
+userAdded = "Пользователь добавлен в �пи�ок до�тупа."
+usernameLabel = "Им� пользовател� или �лектронна� почта"
+usernamePlaceholder = "Введите им� пользовател� или �лектронную почту"
+userRemoveFailed = "�е удало�ь удалить �того пользовател�."
+userRemoved = "Пользователь удален из �пи�ка до�тупа."
+viewActivity = "Про�мотреть активно�ть"
+viewed = "Про�мотрено"
+viewsCount = "Про�мотры: {{count}}"
+downloaded = "Скачано"
+bulkDescription = "Создать одну ��ылку дл� предо�тавлени� общего до�тупа ко в�ем выбранным файлам авторизованным пользовател�м."
+bulkTitle = "Общий до�туп к выбранным файлам"
+copyLink = "Скопировать ��ылку общего до�тупа"
+fileCount = "Выбрано файлов: {{count}}"
+ownerOnly = "Только владелец может управл�ть общим до�тупом."
+selectSingleFile = "Выберите один файл дл� управлени� общим до�тупом."
+
+[storageUpload]
+description = "Это загружает текущий файл в хранилище �ервера дл� вашего до�тупа."
+errorTitle = "Сбой загрузки"
+failure = "�е удало�ь загрузить. Проверьте �вои учетные данные и на�тройки хранилища."
+fileLabel = "Файл"
+hint = "Публичные ��ылки и режимы до�тупа управл�ют�� на�тройками вашего �ервера."
+success = "Загружено на �ервер"
+title = "Загрузить на �ервер"
+updateButton = "Обновить на �ервере"
+uploadButton = "Загрузить на �ервер"
+bulkDescription = "Это загружает выбранные файлы в хранилище вашего �ервера."
+bulkTitle = "Загрузить выбранные файлы"
+fileCount = "Выбрано файлов: {{count}}"
+more = " +{{count}} ещё"
+
 [storage]
 approximateSize = "Примерный размер"
 fileTooLarge = "Файл �лишком большой. Мак�имальный размер на файл —"
@@ -7153,6 +7801,30 @@ title = "Смотреть/Редактировать PDF"
 [warning]
 tooltipTitle = "Предупреждение"
 
+[wetSignature.tooltip]
+header = "Спо�обы �оздани� подпи�и"
+
+[wetSignature.tooltip.draw]
+bullet1 = "�а�тройте цвет и толщину пера"
+bullet2 = "Стирайте и перери�овывайте, пока не будете довольны"
+bullet3 = "Работает на �ен�орных у�трой�твах (планшеты, телефоны)"
+description = "Создайте рукопи�ную подпи�ь � помощью мыши или �ен�орного �крана. Лучше в�его дл� личных, аутентичных подпи�ей."
+title = "�ари�овать подпи�ь"
+
+[wetSignature.tooltip.type]
+bullet1 = "Выберите из не�кольких шрифтов"
+bullet2 = "�а�тройте размер и цвет тек�та"
+bullet3 = "Идеально дл� �тандартизированных подпи�ей"
+description = "Создайте подпи�ь из введенного тек�та. Бы�тро и единообразно, подходит дл� деловых документов."
+title = "Вве�ти подпи�ь"
+
+[wetSignature.tooltip.upload]
+bullet1 = "Поддерживают�� PNG, JPG и другие форматы изображений"
+bullet2 = "Дл� наилучших результатов рекомендует�� прозрачный фон"
+bullet3 = "Изображение будет ма�штабировано под обла�ть подпи�и"
+description = "Загрузите заранее �озданное изображение подпи�и. Идеально, е�ли у ва� е�ть �кан подпи�и или логотип компании."
+title = "Загрузить изображение подпи�и"
+
 [watermark]
 completed = "Вод�ной знак добавлен"
 desc = "Добавл�йте тек�товые или графиче�кие вод�ные знаки в PDF-файлы"
@@ -7333,6 +8005,7 @@ activeSession = "�ктивный �еан�"
 addMembers = "Добавить уча�тников"
 admin = "�дмини�тратор"
 confirmDelete = "Вы уверены, что хотите удалить �того пользовател�? Это дей�твие нельз� отменить."
+confirmUnlock = "Вы уверены, что хотите разблокировать �ту учетную запи�ь пользовател�?"
 deleteUser = "Удалить пользовател�"
 deleteUserError = "�е удало�ь удалить пользовател�"
 deleteUserSuccess = "Пользователь у�пешно удален"
@@ -7341,6 +8014,8 @@ disable = "Отключить"
 disabled = "Отключен"
 editRole = "Изменить роль"
 enable = "Включить"
+locked = "заблокирован"
+lockedBadge = "Заблокирован"
 loading = "Загрузка уча�тников..."
 loginRequired = "Сначала включите режим входа"
 member = "Уча�тник"
@@ -7350,6 +8025,9 @@ searchMembers = "Пои�к уча�тников..."
 status = "Стату�"
 team = "Команда"
 title = "Люди"
+unlockAccount = "Разблокировать учетную запи�ь"
+unlockUserError = "�е удало�ь разблокировать учетную запи�ь пользовател�"
+unlockUserSuccess = "Учетна� запи�ь пользовател� у�пешно разблокирована"
 user = "Пользователь"
 
 [workspace.people.actions]
diff --git a/frontend/public/locales/sk-SK/translation.toml b/frontend/public/locales/sk-SK/translation.toml
index 859b1f5a4c..9070f34b7f 100644
--- a/frontend/public/locales/sk-SK/translation.toml
+++ b/frontend/public/locales/sk-SK/translation.toml
@@ -8,6 +8,7 @@ black = "ÄŒierna"
 blue = "Modrá"
 bored = "Nudíte sa pri �akaní?"
 cancel = "Zrušiť"
+confirm = "Potvrdiť"
 changedCredsMessage = "Údaje zmenené!"
 chooseFile = "Vybrať súbor"
 close = "Zatvoriť"
@@ -146,6 +147,7 @@ insufficientCredits = "Nedostatok kreditov. Potrebné: {{requiredCredits}}, K di
 loadingCredits = "Kontrolujú sa kredity..."
 loadingProStatus = "Kontroluje sa stav predplatného..."
 noticeTopUpOrPlan = "Nedostatok kreditov, dobiť alebo prejsť na plán"
+accessInvite = "Pozvať"
 
 [account]
 accountSettings = "Nastavenia ú�tu"
@@ -1427,6 +1429,34 @@ title = "Spracovanie"
 description = "Maximálny �as �akania na spracovanie úlohy pred nahlásením chyby."
 label = "Časový limit spracovania (sekundy)"
 
+[admin.settings.storage]
+description = "Spravujte úložisko servera a možnosti zdieľania."
+title = "Úložisko súborov a zdieľanie"
+
+[admin.settings.storage.enabled]
+description = "Umožniť používateľom ukladať súbory na server."
+label = "Povoliť serverové úložisko súborov"
+
+[admin.settings.storage.sharing.email]
+description = "Umožniť zdieľanie s e‑mailovými adresami."
+label = "Povoliť zdieľanie e‑mailom"
+mailLink = "Konfigurovať nastavenia pošty"
+mailNote = "Vyžaduje konfiguráciu pošty. "
+
+[admin.settings.storage.sharing.enabled]
+description = "Umožniť používateľom zdieľať uložené súbory."
+label = "Povoliť zdieľanie"
+
+[admin.settings.storage.sharing.links]
+description = "Umožniť zdieľanie cez odkazy pre prihlásených používateľov."
+frontendUrlLink = "Nastaviť v systémových nastaveniach"
+frontendUrlNote = "Vyžaduje Frontend URL. "
+label = "Povoliť zdieľacie odkazy"
+
+[admin.settings.storage.signing.enabled]
+description = "Umožniť používateľom vytvárať podpisové relácie s viacerými ú�astníkmi. Vyžaduje povolené serverové úložisko súborov."
+label = "Povoliť skupinové podpisovanie (Alpha)"
+
 [admin.settings.unsavedChanges]
 cancel = "Pokra�ovať v úpravách"
 discard = "Zahodiť zmeny"
@@ -2059,7 +2089,19 @@ numbers = "Čísla/rozsahy: 5, 10-20"
 progressions = "Postupnosti: 3n, 4n+1"
 
 [certSign]
+allSigned = "Všetci ú�astníci podpísali. Pripravené na finalizáciu."
+awaitingSignatures = "Čaká sa na podpisy"
+signatureProgress = "Podpisy: {{signedCount}}/{{totalCount}}"
 chooseCertificate = "Vybrať súbor certifikátu"
+declined = "Odmietnuté"
+fetchFailed = "Nepodarilo sa na�ítať údaje o podpisovaní"
+finalized = "Finalizované"
+notified = "Oznámené"
+partialNote = "Môžete finalizovať skôr s aktuálnymi podpismi. Nepodpísaní ú�astníci budú vylú�ení."
+pending = "Čaká"
+readyToFinalize = "Pripravené na finalizáciu"
+signed = "Podpísané"
+viewed = "Zobrazené"
 chooseJksFile = "Vybrať súbor JKS"
 chooseP12File = "Vybrať súbor PKCS12"
 choosePfxFile = "Vybrať súbor PFX"
@@ -2082,6 +2124,7 @@ title = "Podpis certifikátom"
 invisible = "Neviditeľný"
 stepTitle = "Vzhľad podpisu"
 visible = "Viditeľný"
+visibility = "Viditeľnosť"
 
 [certSign.appearance.options]
 title = "Podrobnosti podpisu"
@@ -2188,6 +2231,252 @@ bullet4 = "Môže použiť vlastné certifikáty na overenie"
 text = "Pri kontrole podpisov vám nástroj oznámi, �i sú platné, kto dokument podpísal, kedy bol podpísaný a �i bol dokument po podpise zmenený."
 title = "Kontrola podpisov"
 
+[certSign.collab.finalize]
+button = "Finalizovať a na�ítať podpísané PDF"
+early = "Finalizovať s aktuálnymi podpismi"
+
+[certSign.collab.sessionDetail]
+addButton = "Pridať ú�astníkov"
+addParticipants = "Pridať ú�astníkov"
+addParticipantsError = "Nepodarilo sa pridať ú�astníkov"
+backToList = "Späť na relácie"
+deleteConfirm = "Ste si istí? Toto nie je možné vrátiť späť."
+deleteError = "Nepodarilo sa odstrániť reláciu"
+deleted = "Relácia bola odstránená"
+deleteSession = "Odstrániť reláciu"
+dueDate = "Termín"
+finalizeError = "Nepodarilo sa finalizovať reláciu"
+loadPdfError = "Nepodarilo sa na�ítať podpísané PDF"
+loadSignedPdf = "Na�ítať podpísané PDF do aktívnych súborov"
+messageLabel = "Správa"
+noAdditionalInfo = "Žiadne dodato�né informácie"
+owner = "Vlastník"
+participantRemoved = "Ú�astník odstránený"
+participants = "Ú�astníci"
+participantsAdded = "Ú�astníci boli úspešne pridaní"
+removeParticipant = "Odstrániť"
+removeParticipantError = "Nepodarilo sa odstrániť ú�astníka"
+selectUsers = "Vybrať používateľov..."
+sessionInfo = "Informácie o relácii"
+workbenchTitle = "Správa relácií"
+
+[certSign.collab.signRequest]
+addedToFiles = "Dokument bol pridaný do aktívnych súborov"
+addSignature = "Pridajte svoj podpis"
+addToFiles = "Pridať do aktívnych súborov"
+advancedSettings = "Pokro�ilé nastavenia"
+backToList = "Späť na žiadosti o podpis"
+certificateChoice = "Vyberte certifikát na podpis"
+changeSignature = "Zmeniť podpis"
+clearSignature = "Vymazať podpis"
+completeAndSign = "Dokon�iť a podpísať"
+createNewSignature = "Vytvoriť nový podpis"
+declineButton = "Odmietnuť"
+decline = "Odmietnuť žiadosť"
+deleteSelected = "Odstrániť vybraný podpis"
+drawSignature = "Nižšie nakreslite svoj podpis"
+dueDate = "Termín"
+fileTooLarge = "Veľkosť súboru musí byť menšia ako 5 MB"
+fontFamily = "Písmo"
+fontSize = "Veľkosť písma: {{size}}px"
+fontSizePlaceholder = "Veľkosť"
+from = "Od"
+invalidCertFile = "Vyberte súbor certifikátu P12 alebo PFX"
+invalidFileType = "Vyberte obrazový súbor"
+location = "Poloha (voliteľné)"
+locationPlaceholder = "Odkiaľ podpisujete?"
+message = "Správa"
+noCertificate = "Vyberte súbor certifikátu"
+noSignatures = "Umiestnite aspoň jeden podpis do PDF"
+p12File = "Súbor certifikátu P12/PFX"
+password = "Heslo certifikátu"
+passwordPlaceholder = "Zadajte heslo..."
+penColor = "Farba pera"
+penSize = "Hrúbka pera: {{size}}px"
+placementActive = "Kliknite do PDF na umiestnenie"
+placeSignatureButton = "Umiestniť podpis do PDF"
+reason = "Dôvod (voliteľné)"
+reasonPlaceholder = "Pre�o podpisujete?"
+removeImage = "Odstrániť obrázok"
+removeCertFile = "Odstrániť súbor"
+savedSignatures = "Uložené podpisy"
+selectFile = "Vybrať obrazový súbor"
+selectSignatureTitle = "Vybrať alebo vytvoriť podpis"
+signButton = "Podpísať dokument"
+signatureInfo = "Tieto nastavenia nastavuje vlastník dokumentu"
+signaturePlaced = "Podpis umiestnený na stranu"
+signatureSettings = "Nastavenia podpisu"
+signatureText = "Text podpisu"
+signatureTextPlaceholder = "Zadajte svoje meno..."
+signatureTypeLabel = "Typ podpisu"
+signingTitle = "Podpisovanie"
+textColor = "Farba textu"
+typeSignature = "Zadajte svoje meno na vytvorenie podpisu"
+uploadCert = "Vlastný certifikát"
+uploadCertDesc = "Použite svoj certifikát P12/PFX"
+uploadSignature = "Nahrajte obrázok svojho podpisu"
+usePersonalCert = "Osobný certifikát"
+usePersonalCertDesc = "Automaticky generovaný pre váš ú�et"
+useServerCert = "Organiza�ný certifikát"
+useServerCertDesc = "Zdieľaný organiza�ný certifikát"
+workbenchTitle = "Podpisová žiadosť"
+
+[certSign.collab.signRequest.canvas]
+colorPickerTitle = "Vyberte farbu ťahu"
+continue = "Pokra�ovať"
+
+[certSign.collab.signRequest.certModal]
+description = "Umiestnili ste {{count}} podpisov. Vyberte certifikát na dokon�enie podpisovania."
+sign = "Podpísať dokument"
+certValidating = "Overuje sa certifikát..."
+certValidUntil = "Certifikát platný do {{date}}"
+certInvalid = "Neplatný certifikát: {{error}}"
+certInvalidFallback = "Neplatný certifikát"
+certNetworkError = "Certifikát sa nepodarilo overiť"
+title = "Konfigurácia certifikátu"
+
+[certSign.collab.signRequest.image]
+hint = "Nahrajte obrázok PNG alebo JPG svojho podpisu"
+
+[certSign.collab.signRequest.mode]
+move = "Presunúť podpis"
+place = "Umiestniť podpis"
+title = "Režim podpisu alebo presunu"
+
+[certSign.collab.signRequest.modeTabs]
+draw = "Kresliť"
+image = "Nahrať"
+text = "Text"
+
+[certSign.collab.signRequest.placeSignature]
+message = "Kliknite na PDF, kam chcete umiestniť svoj podpis"
+title = "Umiestniť podpis"
+
+[certSign.collab.signRequest.preview]
+imageAlt = "Vybraný podpis"
+missing = "Žiadny náhľad"
+textFallback = "Podpis"
+
+[certSign.collab.signRequest.saved]
+defaultCanvasLabel = "Kreslený podpis"
+defaultImageLabel = "Nahraný podpis"
+defaultLabel = "Podpis"
+defaultTextLabel = "Písaný podpis"
+delete = "Odstrániť podpis"
+none = "Žiadne uložené podpisy"
+
+[certSign.collab.signRequest.signatureType]
+draw = "Kresliť"
+type = "Text"
+upload = "Nahrať"
+
+[certSign.collab.signRequest.steps]
+back = "Späť"
+cancelPlacement = "Zrušiť umiestnenie"
+certificate = "Certifikát"
+clickMultipleTimes = "Kliknite do PDF viackrát na umiestnenie podpisov. Potiahnutím podpis presuňte alebo zmeňte jeho veľkosť."
+clickToPlace = "Kliknite do PDF tam, kde chcete, aby sa váš podpis zobrazil."
+continue = "Pokra�ovať na výber certifikátu"
+continueToPlacement = "Pokra�ovať na umiestnenie"
+continueToReview = "Pokra�ovať na kontrolu"
+createSignature = "Vytvoriť podpis"
+invisible = "Neviditeľné"
+location = "Poloha:"
+multipleSignatures = "{{count}} podpisov bude pridaných do PDF"
+oneSignature = "1 podpis bude pridaný do PDF"
+placeOnPdf = "Umiestniť do PDF"
+reason = "Dôvod:"
+reviewTitle = "Kontrola pred podpísaním"
+signaturePlaced = "Podpis umiestnený na strane {{page}}. Polohu môžete upraviť opätovným kliknutím alebo pokra�ovať na kontrolu."
+visible = "Viditeľné"
+visibility = "Viditeľnosť:"
+yourSignatures = "Vaše podpisy ({{count}})"
+
+[certSign.collab.signRequest.text]
+colorLabel = "Farba"
+fontLabel = "Písmo"
+fontSizeLabel = "Veľkosť"
+fontSizePlaceholder = "16"
+label = "Text podpisu"
+modalHint = "Zadajte svoje meno a kliknite na Pokra�ovať, aby ste ho umiestnili do PDF."
+placeholder = "Zadajte svoje meno..."
+
+[certSign.collab.participant]
+certValidating = "Overuje sa certifikát..."
+certValid = "✓ Platný certifikát"
+certValidUntil = " do {{date}}"
+certInvalid = "✗ {{error}}"
+certInvalidFallback = "Neplatný certifikát"
+certNetworkError = "Certifikát sa nepodarilo overiť"
+
+[certSign.collab.addParticipants]
+add = "Pridať {{count}} ú�astníka/ov"
+back = "Späť"
+configureSignatures = "Nastaviť parametre podpisu"
+continue = "Pokra�ovať na nastavenia podpisu"
+reasonHelp = "Prednastavte dôvod podpisu pre týchto ú�astníkov (voliteľné, pri podpisovaní ho môžu zmeniť)"
+reasonPlaceholder = "napr. Schválenie, Kontrola..."
+selectUsers = "Vybrať používateľov"
+
+[certSign.collab.sessionCreation]
+includeSummaryPage = "Zahrnúť súhrnnú stranu podpisov"
+includeSummaryPageHelp = "Na koniec bude pridaná súhrnná strana so všetkými metadátami podpisov. Rámiky digitálnych certifikátov na jednotlivých stranách budú potla�ené (vlastnoru�né podpisy nie sú ovplyvnené)."
+
+[certSign.collab.sessionList]
+active = "Aktívne"
+finalized = "Finalizované"
+
+[certSign.collab.signatureSettings]
+description = "Nakonfigurujte, ako sa budú podpisy zobrazovať všetkým ú�astníkom"
+title = "Vzhľad podpisu"
+
+[certSign.collab.userSelector]
+inviteUsers = "Pridať používateľov"
+loadError = "Nepodarilo sa na�ítať používateľov"
+noTeam = "Bez tímu"
+noUsers = "Nenašli sa žiadni �alší používatelia."
+placeholder = "Vybrať používateľov..."
+
+[certSign.mobile]
+panelActions = "Akcie"
+panelDocument = "Dokument"
+panelPeople = "Ľudia"
+
+[certSign.sessions]
+deleted = "Relácia bola odstránená"
+fetchFailed = "Nepodarilo sa na�ítať podrobnosti relácie"
+finalized = "Relácia bola finalizovaná"
+loaded = "Podpísané PDF na�ítané"
+pdfNotReady = "PDF nie je pripravené"
+pdfNotReadyDesc = "Podpísané PDF sa generuje. Skúste to znova o chvíľu."
+
+[certificateChoice.tooltip]
+header = "Typy certifikátov"
+
+[certificateChoice.tooltip.organization]
+bullet1 = "Spravované systémovými administrátormi"
+bullet2 = "Zdieľané medzi autorizovanými používateľmi"
+bullet3 = "Reprezentuje identitu spolo�nosti, nie jednotlivca"
+bullet4 = "Vhodné pre: oficiálne dokumenty, tímové podpisy"
+description = "Zdieľaný certifikát poskytovaný vašou organizáciou. Používa sa na celofiremné podpisovanie."
+title = "Organiza�ný certifikát"
+
+[certificateChoice.tooltip.personal]
+bullet1 = "Generuje sa automaticky pri prvom použití"
+bullet2 = "Viazaný na váš používateľský ú�et"
+bullet3 = "Nie je možné zdieľať s inými používateľmi"
+bullet4 = "Vhodné pre: osobné dokumenty, individuálnu zodpovednosť"
+description = "Automaticky generovaný certifikát jedine�ný pre váš používateľský ú�et. Vhodný pre individuálne podpisy."
+title = "Osobný certifikát"
+
+[certificateChoice.tooltip.upload]
+bullet1 = "Vyžaduje súbor P12/PFX a heslo"
+bullet2 = "Môže byť vydaný externými certifika�nými autoritami"
+bullet3 = "Vyššia úroveň dôvery pre právne dokumenty"
+bullet4 = "Vhodné pre: právne záväzné zmluvy, externé overenie"
+description = "Použite vlastný súbor certifikátu PKCS#12. Poskytuje plnú kontrolu nad vlastnosťami certifikátu."
+title = "Nahrať vlastný P12"
+
 [changeCreds]
 changePassword = "Používate predvolené prihlasovacie údaje. Prosím, zadajte nové heslo"
 changeUsername = "Aktualizujte svoje používateľské meno. Po aktualizácii budete odhlásení."
@@ -3242,6 +3531,46 @@ totalSelected = "Celkom vybrané"
 unsupported = "Nepodporované"
 unzip = "Rozbaliť"
 uploadError = "Niektoré súbory sa nepodarilo nahrať."
+copyCreated = "Kópia uložená do tohto zariadenia."
+copyFailed = "Kópiu sa nepodarilo vytvoriť."
+leaveShare = "Odstrániť z môjho zoznamu"
+leaveShareFailed = "Zdieľaný súbor sa nepodarilo odstrániť."
+leaveShareSuccess = "Odstránené z vášho zoznamu zdieľaných."
+removeBoth = "Odstrániť z oboch"
+removeFilePrompt = "Tento súbor je uložený v tomto zariadení aj na vašom serveri. Odkiaľ ho chcete odstrániť?"
+removeFileTitle = "Odstrániť súbor"
+removeLocalOnly = "Len z tohto zariadenia"
+removeServerFailed = "Súbor sa nepodarilo odstrániť zo servera."
+removeServerOnly = "Len zo servera"
+removeServerOnlyPrompt = "Tento súbor je uložený len na vašom serveri. Chcete ho odstrániť zo servera?"
+removeServerSuccess = "Odstránené zo servera."
+removeSharedPrompt = "Tento súbor je s vami zdieľaný. Môžete ho odstrániť z tohto zariadenia alebo zo svojho zdieľaného zoznamu."
+removeSharedServerOnlyBlockedPrompt = "Tento súbor je s vami zdieľaný a je uložený len na serveri."
+removeSharedServerOnlyPrompt = "Tento súbor je s vami zdieľaný a je uložený len na serveri. Odstrániť ho zo zoznamu?"
+changesNotUploaded = "Zmeny neboli nahrané"
+cloudFile = "Cloudový súbor"
+filterAll = "VÅ¡etko"
+filterLocal = "Lokálne"
+filterSharedByMe = "Zdieľané mnou"
+filterSharedWithMe = "Zdieľané so mnou"
+lastSynced = "Naposledy synchronizované"
+localOnly = "Len lokálne"
+makeCopy = "Vytvoriť kópiu"
+owner = "Vlastník"
+ownerUnknown = "Neznámy"
+share = "Zdieľať"
+shareSelected = "Zdieľať vybrané"
+sharedByYou = "Zdieľané vami"
+sharedEditNoticeBody = "Nemáte práva na úpravu serverovej verzie tohto súboru. Všetky úpravy sa uložia ako lokálna kópia."
+sharedEditNoticeConfirm = "Rozumiem"
+sharedEditNoticeTitle = "Serverová kópia len na �ítanie"
+sharedWithYou = "Zdieľané s vami"
+sharing = "Zdieľanie"
+storageState = "Úložisko"
+synced = "Synchronizované"
+updateOnServer = "Aktualizovať na serveri"
+uploadSelected = "Nahrať vybrané"
+uploadToServer = "Nahrať na server"
 
 [files]
 addFiles = "Pridať súbory"
@@ -3367,6 +3696,77 @@ title = "O splošťovaní PDF"
 discord = "Discord"
 issues = "GitHub"
 
+[groupSigning.tooltip]
+header = "O skupinovom podpisovaní"
+
+[groupSigning.tooltip.finalization]
+bullet1 = "Všetky podpisy sa aplikujú v poradí ú�astníkov, ktoré ste ur�ili"
+bullet2 = "V prípade potreby môžete finalizovať aj s �iasto�nými podpismi"
+bullet3 = "Po finalizácii už reláciu nemožno upravovať"
+description = "Ke� všetci ú�astníci podpíšu (alebo sa rozhodnete finalizovať skôr), môžete vygenerovať finálne podpísané PDF."
+title = "Proces finalizácie"
+
+[groupSigning.tooltip.roles]
+bullet1 = "Vlastník (vy): vytvára reláciu, nastavuje predvolené hodnoty podpisu, finalizuje dokument"
+bullet2 = "Ú�astníci: vytvoria svoj podpis, zvolia certifikát, umiestnia ho do PDF"
+bullet3 = "Ú�astníci nemôžu meniť nastavenia viditeľnosti podpisu, dôvodu ani polohy"
+description = "Nastavenia vzhľadu podpisu riadite pre všetkých ú�astníkov."
+title = "Roly ú�astníkov"
+
+[groupSigning.tooltip.sequential]
+bullet1 = "Prvý ú�astník musí podpísať, aby mal druhý prístup k dokumentu"
+bullet2 = "Zabezpe�uje správne poradie podpisov pre právny súlad"
+bullet3 = "Ú�astníkov môžete preusporiadať ťahaním v zozname"
+description = "Ú�astníci podpisujú dokumenty v poradí, ktoré ur�íte. Každý podpisovateľ dostane upozornenie, ke� je na rade."
+title = "Postupné podpisovanie"
+
+[groupSigning.steps]
+back = "Späť"
+completed = "Dokon�ené"
+current = "Aktuálne"
+stepLabel = "Krok {{number}}"
+
+[groupSigning.steps.configureDefaults]
+continue = "Pokra�ovať na kontrolu"
+invisible = "Podpisy budú neviditeľné (len metadáta)"
+locationLabel = "Poloha:"
+preview = "Náhľad"
+reasonLabel = "Dôvod:"
+title = "Nastaviť parametre podpisu"
+visible = "Podpisy budú viditeľné na strane {{page}}"
+
+[groupSigning.steps.review]
+document = "Dokument"
+dueDate = "Termín (voliteľné)"
+dueDatePlaceholder = "Vyberte termín..."
+invisible = "Neviditeľné (len metadáta)"
+location = "Poloha:"
+logo = "Logo:"
+logoHidden = "Bez loga"
+logoShown = "Zobrazené logo Stirling PDF"
+participants = "Ú�astníci"
+reason = "Dôvod:"
+send = "Odoslať žiadosti o podpis"
+signatureSettings = "Nastavenia podpisu"
+title = "Skontrolovať podrobnosti relácie"
+titleShort = "Skontrolovať a odoslať"
+visibility = "Viditeľnosť:"
+visible = "Viditeľné na strane {{page}}"
+participantCount = "{{count}} ú�astníkov bude podpisovať v poradí"
+
+[groupSigning.steps.selectDocument]
+continue = "Pokra�ovať na výber ú�astníkov"
+noFile = "Vyberte jeden súbor PDF zo svojich aktívnych súborov na vytvorenie podpisovej relácie."
+selectedFile = "Vybraný dokument"
+title = "Vybrať dokument"
+
+[groupSigning.steps.selectParticipants]
+continue = "Pokra�ovať na nastavenia podpisu"
+count = "{{count}} vybraných ú�astníkov"
+label = "Vybrať ú�astníkov"
+placeholder = "Vyberte ú�astníkov na podpis..."
+title = "Vybrať ú�astníkov"
+
 [getPdfInfo]
 downloadJson = "Stiahnuť JSON"
 downloads = "SÅ¥ahovania"
@@ -4460,7 +4860,10 @@ zoomOut = "Oddialiť"
 
 [viewer]
 cannotPreviewFile = "Nedá sa zobraziť náhľad súboru"
+disableColorFilter = "Zakázať farebný filter"
 dualPageView = "Dvojstranové zobrazenie"
+enableDarkFilter = "Povoliť tmavý filter"
+enableSepiaFilter = "Povoliť sépiový filter"
 firstPage = "Prvá strana"
 lastPage = "Posledná strana"
 nextPage = "Nasledujúca strana"
@@ -4470,6 +4873,22 @@ singlePageView = "Zobrazenie jednej strany"
 unknownFile = "Neznámy súbor"
 zoomIn = "Priblížiť"
 zoomOut = "Oddialiť"
+resetZoom = "Obnoviť priblíženie"
+
+[viewer.nonPdf]
+fileTypeBadge = "{{type}} súbor"
+convertToPdf = "Konvertovať do PDF"
+loading = "Na�ítava sa..."
+emptyFile = "Prázdny súbor"
+csvStats = "{{rows}} riadkov · {{columns}} stĺpcov · {{size}}"
+sortedBy = "Zoradené podľa: {{column}}"
+columnDefault = "Stĺpec {{index}}"
+htmlPreviewWarning = "Náhľad HTML — externé zdroje sa nemusia na�ítať · {{size}}"
+htmlPreview = "Náhľad HTML"
+invalidJson = "Neplatný JSON — zobrazuje sa surový obsah"
+textStats = "{{lines}} riadkov · {{size}}"
+lineNumbers = "Čísla riadkov"
+renderMarkdown = "Zobraziť Markdown"
 
 [viewer.attachments]
 title = "Prílohy"
@@ -4531,6 +4950,7 @@ toggleAttachments = "Zobraziť/skryť prílohy"
 toggleTheme = "Prepnúť tému"
 language = "Jazyk"
 toggleAnnotations = "Prepnúť zobrazenie anotácií"
+toggleLayers = "Prepnúť vrstvy"
 search = "Hľadať v PDF"
 panMode = "Režim posunu"
 applyRedactionsFirst = "Najprv použite za�iernenia"
@@ -5407,20 +5827,72 @@ title = "Vytla�iť súbor"
 2 = "Zadajte názov tla�iarne"
 
 [quickAccess]
+access = "Prístup"
+accessAddPerson = "Pridať �alšiu osobu"
+accessBack = "Späť"
+accessCopyLink = "Kopírovať odkaz"
+accessEmail = "E‑mailová adresa"
+accessEmailPlaceholder = "name@company.com"
+accessFileLabel = "Súbor"
+accessGeneral = "Všeobecný prístup"
+accessInviteTitle = "Pozvať ľudí"
+accessOwner = "Vlastník"
+accessPanel = "Prístup k dokumentu"
+accessPeople = "Používatelia s prístupom"
+accessRemove = "Odstrániť"
+accessRestricted = "Obmedzené"
+accessRestrictedHint = "Otvoriť môžu len osoby s prístupom"
+accessRole = "Rola"
+accessRoleCommenter = "Komentujúci"
+accessRoleEditor = "Editor"
+accessRoleViewer = "Čitateľ"
+accessSelectedFile = "Vybraný súbor"
+accessSendInvite = "Odoslať pozvánku"
+accessTitle = "Prístup k dokumentu"
+accessYou = "Vy"
 account = "Ú�et"
+activeSessions = "Aktívne relácie"
+activeTab = "Aktívne"
 activity = "Aktivita"
 adminSettings = "Admin nast."
+allSessions = "Všetky relácie"
 allTools = "All Tools"
 automate = "Auto"
+back = "Späť"
+certSign = "Podpis certifikátom"
+completedSessions = "Dokon�ené relácie"
+completedTab = "Dokon�ené"
 config = "Konfig"
+createNew = "Vytvoriť novú žiadosť"
+createSession = "Vytvoriť žiadosť o podpis"
+dueDate = "Termín (voliteľné)"
 files = "Súbory"
 help = "Pomoc"
+noActiveSessions = "Žiadne �akajúce žiadosti o podpis ani aktívne relácie"
+noCompletedSessions = "Žiadne dokon�ené relácie"
+noFile = "Nie je vybraný žiadny súbor"
 read = "Čítať"
 reader = "Číta�ka"
+refresh = "Obnoviť"
+requestSignatures = "Požiadať o podpisy"
+selectSingleFileToRequest = "Vyberte jeden súbor PDF na vyžiadanie podpisov"
+selectedFile = "Vybraný súbor"
+selectUsers = "Vyberte používateľov na podpis"
+selectUsersPlaceholder = "Vyberte ú�astníkov..."
+sendingRequest = "Odosiela sa..."
 settings = "Nast."
 showMeAround = "Previesť ma"
 sign = "Podpísať"
+signatureRequests = "Žiadosti o podpis"
+signYourself = "Podpísať sám/sama"
+newRequest = "Nová žiadosť"
 tours = "Prehliadky"
+wetSign = "Pridať podpis"
+filterMine = "Moje"
+filterOverdue = "Po termíne"
+filterSigned = "Podpísané"
+filterDeclined = "Odmietnuté"
+searchDocuments = "Hľadať dokumenty…"
 
 [quickAccess.helpMenu]
 adminTour = "Prehliadka administrácie"
@@ -6050,11 +6522,75 @@ toolNotAvailableLocally = "Váš server Stirling-PDF je offline a \"{{endpoint}}
 expired = "Vaša relácia vypršala. Obnovte stránku a skúste znova."
 refreshPage = "Obnoviť stránku"
 
+[sessionManagement.tooltip]
+header = "Správa podpisových relácií"
+
+[sessionManagement.tooltip.addParticipants]
+bullet1 = "Noví ú�astníci sú pridaní na koniec poradia podpisovania"
+bullet2 = "Po finalizácii relácie už nemožno pridávať ú�astníkov"
+bullet3 = "Každý ú�astník dostane upozornenie, ke� je na rade"
+description = "Do aktívnej relácie môžete do finalizácie kedykoľvek pridať �alších ú�astníkov."
+title = "Pridávanie ú�astníkov"
+
+[sessionManagement.tooltip.finalization]
+bullet1 = "<b>Plná finalizácia</b>: všetci ú�astníci podpísali"
+bullet2 = "<b>Čiasto�ná finalizácia</b>: niektorí ú�astníci ešte nepodpísali"
+bullet3 = "Nepodpísaní ú�astníci budú vylú�ení z finálneho dokumentu"
+bullet4 = "Po finalizácii môžete na�ítať podpísané PDF do aktívnych súborov"
+description = "Finalizácia spojí všetky podpisy do jedného podpísaného PDF. Túto akciu nemožno vrátiť späť."
+title = "Finalizácia relácie"
+
+[sessionManagement.tooltip.participantRemoval]
+bullet1 = "Ú�astníkov, ktorí už podpísali, nemožno odstrániť"
+bullet2 = "Odstránení ú�astníci už nedostávajú upozornenia"
+bullet3 = "Poradie podpisovania sa automaticky upraví"
+description = "Ú�astníkov možno z relácie odstrániť predtým, ako podpíšu."
+title = "Odstraňovanie ú�astníkov"
+
+[sessionManagement.tooltip.signatureOrder]
+bullet1 = "Každý podpis sa aplikuje na PDF postupne"
+bullet2 = "Neskorší signatári môžu vidieť skoršie podpisy"
+bullet3 = "Kritické pre schvaľovacie postupy a právny reťazec držby"
+description = "Poradie, ktoré ur�íte pri vytváraní relácie, ur�uje, kto podpisuje ako prvý."
+title = "Poradie podpisov"
+
+[signatureSettings.tooltip]
+header = "Nastavenia vzhľadu podpisu"
+
+[signatureSettings.tooltip.location]
+bullet1 = "Príklady: \"New York, USA\", \"London Office\", \"Remote\""
+bullet2 = "Nie je to isté ako pozícia na strane"
+bullet3 = "Môže byť vyžadované v niektorých právnych jurisdikciách"
+description = "Voliteľná geografická poloha, kde bol podpis aplikovaný. Uložené v metadátach certifikátu."
+title = "Umiestnenie podpisu"
+
+[signatureSettings.tooltip.logo]
+bullet1 = "Zobrazuje sa popri podpise a texte"
+bullet2 = "Podporované formáty PNG, JPG"
+bullet3 = "Zvyšuje profesionálny vzhľad"
+description = "Pridajte k viditeľným podpisom firemné logo pre branding a autenticitu."
+title = "Firemné logo"
+
+[signatureSettings.tooltip.reason]
+bullet1 = "Príklady: \"Approval\", \"Contract Agreement\", \"Review Complete\""
+bullet2 = "Viditeľné vo vlastnostiach podpisu PDF"
+bullet3 = "Užito�né pre audit a compliance"
+description = "Voliteľný text vysvetľujúci, pre�o sa dokument podpisuje. Uložené v metadátach certifikátu."
+title = "Dôvod podpisu"
+
+[signatureSettings.tooltip.visibility]
+bullet1 = "<b>Viditeľné</b>: Podpis sa zobrazí v PDF s vlastným vzhľadom"
+bullet2 = "<b>Neviditeľné</b>: Certifikát je vložený bez vizuálnej stopy"
+bullet3 = "Neviditeľné podpisy stále poskytujú kryptografické overenie"
+description = "Ur�uje, �i je podpis na dokumente viditeľný alebo vložený neviditeľne."
+title = "Viditeľnosť podpisu"
+
 [settings.configuration]
 advanced = "Pokro�ilé"
 database = "Databáza"
 endpoints = "Endpointy"
 features = "Funkcie"
+storageSharing = "Úložisko súborov a zdieľanie"
 systemSettings = "Systémové nastavenia"
 title = "Konfigurácia"
 
@@ -6332,10 +6868,13 @@ title = "Prihláste sa do Stirling"
 [setup.selfhosted]
 link = "alebo sa pripojte k self-hosted ú�tu"
 subtitle = "Zadajte prihlasovacie údaje k serveru"
+changeServerLocked = "Vaša organizácia obmedzila túto aplikáciu na konkrétny server"
 switchToLocal = "Namiesto toho použiť lokálne nástroje"
 title = "Prihlásiť sa na server"
 
 [setup.selfhosted.unreachable]
+changeServer = "Pripojiť sa k inému serveru"
+changeServerLocked = "Vaša organizácia obmedzila túto aplikáciu na konkrétny server"
 continueOffline = "Namiesto toho použiť lokálne nástroje"
 message = "Nepodarilo sa dosiahnuť {{url}}. Skontrolujte, �i server beží a je prístupný."
 retry = "Skúsiť znova"
@@ -6529,6 +7068,15 @@ saved = "Uložené"
 text = "Text"
 title = "Typ podpisu"
 
+[signRequest]
+declined = "Žiadosť o podpis bola odmietnutá"
+fetchFailed = "Nepodarilo sa na�ítať žiadosť o podpis"
+signed = "Dokument bol úspešne podpísaný"
+
+[signSession]
+createFailed = "Nepodarilo sa vytvoriť žiadosť o podpis"
+created = "Žiadosť o podpis bola odoslaná"
+
 [signup]
 accountCreatedSuccessfully = "Ú�et bol úspešne vytvorený! Teraz sa môžete prihlásiť."
 alreadyHaveAccount = "Už máte ú�et? Prihláste sa"
@@ -6807,6 +7355,106 @@ title = "Rozdeliť PDF podľa kapitol"
 [splitPdfByChapters]
 tags = "rozdeliť,kapitoly,záložky,organizovať"
 
+[storageShare]
+accessed = "Otvorené"
+accessDenied = "K tomuto zdieľanému súboru nemáte prístup. Požiadajte vlastníka, aby ho s vami zdieľal."
+accessFailed = "Aktivitu sa nepodarilo na�ítať."
+accessDeniedBody = "K tomuto súboru nemáte prístup. Požiadajte vlastníka, aby ho s vami zdieľal."
+accessDeniedTitle = "Bez prístupu"
+accessLimitedCommenter = "Prístup na komentovanie �oskoro pribudne. Ak potrebujete sťahovať, požiadajte vlastníka o oprávnenie editora."
+accessLimitedTitle = "Obmedzený prístup"
+accessLimitedViewer = "Tento odkaz je len na zobrazenie. Ak potrebujete sťahovať, požiadajte vlastníka o oprávnenie editora."
+createdAt = "Vytvorené"
+download = "Stiahnuť"
+downloadFailed = "Nepodarilo sa stiahnuť tento súbor."
+expiredBody = "Tento zdieľací odkaz je neplatný alebo vypršal."
+expiredTitle = "Odkaz vypršal"
+goToLogin = "Prejsť na prihlásenie"
+loadFailed = "Zdieľaný súbor sa nepodarilo otvoriť."
+loading = "Na�ítava sa zdieľací odkaz..."
+loginPrompt = "Na prístup k tomuto zdieľanému súboru sa prihláste."
+loginRequired = "Vyžaduje sa prihlásenie"
+openInApp = "Otvoriť v Stirling PDF"
+ownerLabel = "Vlastník"
+ownerUnknown = "Neznámy"
+requiresLogin = "Tento zdieľaný súbor vyžaduje prihlásenie."
+roleCommenter = "Komentujúci"
+roleEditor = "Editor"
+roleViewer = "Čitateľ"
+shareHeading = "Zdieľaný súbor"
+titleDefault = "Zdieľaný súbor"
+tryAgain = "Skúste to znova neskôr."
+addUser = "Pridať"
+commenterHint = "Komentovanie �oskoro pribudne."
+copied = "Odkaz skopírovaný do schránky"
+copy = "Kopírovať"
+copyFailed = "Kopírovanie zlyhalo"
+description = "Vytvorte pre tento súbor zdieľací odkaz. Prihlásení používatelia s odkazom k nemu budú mať prístup."
+downloadsCount = "Stiahnutia: {{count}}"
+emailWarningBody = "Vyzerá to ako e‑mailová adresa. Ak táto osoba ešte nie je používateľom Stirling PDF, k súboru nebude mať prístup."
+emailWarningConfirm = "Aj tak zdieľať"
+emailWarningTitle = "E‑mailová adresa"
+errorTitle = "Zdieľanie zlyhalo"
+failure = "Zdieľací odkaz sa nepodarilo vygenerovať. Skúste to znova."
+fileLabel = "Súbor"
+generate = "Vygenerovať odkaz"
+generated = "Zdieľací odkaz bol vygenerovaný"
+hideActivity = "Skryť aktivitu"
+invalidUsername = "Zadajte platné používateľské meno alebo e‑mailovú adresu."
+lastAccessed = "Naposledy otvorené"
+linkAccessTitle = "Prístup cez zdieľací odkaz"
+linkLabel = "Zdieľací odkaz"
+linksDisabled = "Zdieľacie odkazy sú zakázané."
+linksDisabledBody = "Zdieľacie odkazy sú zakázané nastaveniami vášho servera."
+manage = "Spravovať zdieľanie"
+manageDescription = "Vytvárajte a spravujte odkazy na zdieľanie tohto súboru."
+manageLoadFailed = "Zdieľacie odkazy sa nepodarilo na�ítať."
+manageTitle = "Správa zdieľania"
+noActivity = "Zatiaľ žiadna aktivita."
+noLinks = "Zatiaľ žiadne aktívne zdieľacie odkazy."
+noSharedUsers = "Zatiaľ nemá prístup žiadny používateľ."
+removeLink = "Odstrániť odkaz"
+removeUser = "Odstrániť"
+revokeFailed = "Zdieľací odkaz sa nepodarilo odstrániť."
+revoked = "Odkaz na zdieľanie odstránený"
+roleLabel = "Rola"
+sharingDisabled = "Zdieľanie je zakázané."
+sharingDisabledBody = "Zdieľanie bolo zakázané nastaveniami servera."
+sharedUsersTitle = "Zdieľaní používatelia"
+title = "Zdieľať súbor"
+unknownUser = "Neznámy používateľ"
+userAddFailed = "Nepodarilo sa zdieľať s týmto používateľom."
+userAdded = "Používateľ pridaný do zoznamu zdieľania."
+usernameLabel = "Používateľské meno alebo e-mail"
+usernamePlaceholder = "Zadajte používateľské meno alebo e-mail"
+userRemoveFailed = "Nepodarilo sa odstrániť tohto používateľa."
+userRemoved = "Používateľ odstránený zo zoznamu zdieľania."
+viewActivity = "Zobraziť aktivitu"
+viewed = "Zobrazené"
+viewsCount = "Zobrazenia: {{count}}"
+downloaded = "Stiahnuté"
+bulkDescription = "Vytvorte jeden odkaz na zdieľanie všetkých vybraných súborov s prihlásenými používateľmi."
+bulkTitle = "Zdieľať vybrané súbory"
+copyLink = "Kopírovať odkaz na zdieľanie"
+fileCount = "{{count}} vybraných súborov"
+ownerOnly = "Zdieľanie môže spravovať iba vlastník."
+selectSingleFile = "Na správu zdieľania vyberte jeden súbor."
+
+[storageUpload]
+description = "Týmto nahráte aktuálny súbor do serverového úložiska pre vlastný prístup."
+errorTitle = "Nahrávanie zlyhalo"
+failure = "Nahrávanie zlyhalo. Skontrolujte svoje prihlásenie a nastavenia úložiska."
+fileLabel = "Súbor"
+hint = "Verejné odkazy a režimy prístupu sú riadené nastaveniami vášho servera."
+success = "Nahraté na server"
+title = "Nahrať na server"
+updateButton = "Aktualizovať na serveri"
+uploadButton = "Nahrať na server"
+bulkDescription = "Týmto nahráte vybrané súbory do serverového úložiska."
+bulkTitle = "Nahrať vybrané súbory"
+fileCount = "{{count}} vybraných súborov"
+more = " +{{count}} �alších"
+
 [storage]
 approximateSize = "Približná veľkosť"
 fileTooLarge = "Súbor je príliš veľký. Maximálna veľkosť na súbor je"
@@ -7153,6 +7801,30 @@ title = "Zobraziť/Upraviť PDF"
 [warning]
 tooltipTitle = "Upozornenie"
 
+[wetSignature.tooltip]
+header = "Spôsoby vytvorenia podpisu"
+
+[wetSignature.tooltip.draw]
+bullet1 = "Prispôsobte farbu a hrúbku pera"
+bullet2 = "Mažte a kreslite znova, kým nebudete spokojní"
+bullet3 = "Funguje na dotykových zariadeniach (tablety, telefóny)"
+description = "Vytvorte vlastnoru�ný podpis pomocou myši alebo dotykovej obrazovky. Najlepšie pre osobné, autentické podpisy."
+title = "Nakresliť podpis"
+
+[wetSignature.tooltip.type]
+bullet1 = "Vyberte si z viacerých písiem"
+bullet2 = "Prispôsobte veľkosť a farbu textu"
+bullet3 = "Ideálne pre štandardizované podpisy"
+description = "Vygenerujte podpis zo zadaného textu. Rýchle a konzistentné, vhodné pre obchodné dokumenty."
+title = "Napísať podpis"
+
+[wetSignature.tooltip.upload]
+bullet1 = "Podporuje PNG, JPG a iné formáty obrázkov"
+bullet2 = "Pre najlepší výsledok sa odporú�a priehľadné pozadie"
+bullet3 = "Obrázok bude zmenený, aby sa prispôsobil oblasti podpisu"
+description = "Nahrajte vopred vytvorený obrázok podpisu. Ideálne, ak máte naskenovaný podpis alebo logo spolo�nosti."
+title = "Nahrať obrázok podpisu"
+
 [watermark]
 completed = "Vodoznak pridaný"
 desc = "Pridajte textové alebo obrázkové vodoznaky do súborov PDF"
@@ -7333,6 +8005,7 @@ activeSession = "Aktívna relácia"
 addMembers = "Pridať �lenov"
 admin = "Admin"
 confirmDelete = "Naozaj chcete odstrániť tohto používateľa? Táto akcia sa nedá vrátiť."
+confirmUnlock = "Naozaj chcete odomknúť tento používateľský ú�et?"
 deleteUser = "Odstrániť používateľa"
 deleteUserError = "Používateľa sa nepodarilo odstrániť"
 deleteUserSuccess = "Používateľ úspešne odstránený"
@@ -7341,6 +8014,8 @@ disable = "Zakázať"
 disabled = "Zakázaný"
 editRole = "Upraviť rolu"
 enable = "Povoliť"
+locked = "zamknutý"
+lockedBadge = "Zamknutý"
 loading = "Na�ítavajú sa ľudia..."
 loginRequired = "Najprv zapnite režim prihlásenia"
 member = "ÄŒlen"
@@ -7350,6 +8025,9 @@ searchMembers = "Hľadať �lenov..."
 status = "Stav"
 team = "Tím"
 title = "Ľudia"
+unlockAccount = "Odomknúť ú�et"
+unlockUserError = "Nepodarilo sa odomknúť používateľský ú�et"
+unlockUserSuccess = "Používateľský ú�et bol úspešne odomknutý"
 user = "Používateľ"
 
 [workspace.people.actions]
diff --git a/frontend/public/locales/sl-SI/translation.toml b/frontend/public/locales/sl-SI/translation.toml
index 702dc56428..eea64f09c6 100644
--- a/frontend/public/locales/sl-SI/translation.toml
+++ b/frontend/public/locales/sl-SI/translation.toml
@@ -8,6 +8,7 @@ black = "�rna"
 blue = "modra"
 bored = "dolgo�aseno �akanje?"
 cancel = "Prekli�i"
+confirm = "Potrdi"
 changedCredsMessage = "Poverilnice spremenjene!"
 chooseFile = "Izberi datoteko"
 close = "Zapri"
@@ -146,6 +147,7 @@ insufficientCredits = "Premalo kreditov. Zahtevano: {{requiredCredits}}, Na volj
 loadingCredits = "Preverjanje kreditov..."
 loadingProStatus = "Preverjanje stanja naro�nine..."
 noticeTopUpOrPlan = "Ni dovolj kreditov, kupite dodatne kredite ali nadgradite na paket"
+accessInvite = "Povabi"
 
 [account]
 accountSettings = "Nastavitve ra�una"
@@ -1427,6 +1429,34 @@ title = "Obdelava"
 description = "Najdaljši �as �akanja na opravilo obdelave, preden se prijavi napaka."
 label = "ÄŒasovna omejitev obdelave (sekunde)"
 
+[admin.settings.storage]
+description = "Nadzirajte shrambo strežnika in možnosti skupne rabe."
+title = "Shramba datotek in skupna raba"
+
+[admin.settings.storage.enabled]
+description = "Dovoli uporabnikom shranjevanje datotek na strežniku."
+label = "Omogo�i shranjevanje datotek na strežniku"
+
+[admin.settings.storage.sharing.email]
+description = "Dovoli skupno rabo z e-poštnimi naslovi."
+label = "Omogo�i skupno rabo prek e-pošte"
+mailLink = "Nastavi nastavitve e-pošte"
+mailNote = "Zahteva konfiguracijo e-pošte. "
+
+[admin.settings.storage.sharing.enabled]
+description = "Dovoli uporabnikom deliti shranjene datoteke."
+label = "Omogo�i skupno rabo"
+
+[admin.settings.storage.sharing.links]
+description = "Dovoli skupno rabo prek povezav, ki zahtevajo prijavo."
+frontendUrlLink = "Nastavi v sistemskih nastavitvah"
+frontendUrlNote = "Zahteva Frontend URL. "
+label = "Omogo�i povezave za skupno rabo"
+
+[admin.settings.storage.signing.enabled]
+description = "Dovoli uporabnikom ustvariti seje podpisovanja dokumentov z ve� udeleženci. Zahteva omogo�eno shranjevanje datotek na strežniku."
+label = "Omogo�i skupinsko podpisovanje (Alpha)"
+
 [admin.settings.unsavedChanges]
 cancel = "Nadaljujte z urejanjem"
 discard = "Zavrzite spremembe"
@@ -2059,7 +2089,19 @@ numbers = "Å tevilke/obsegi: 5, 10-20"
 progressions = "Zaporedja: 3n, 4n+1"
 
 [certSign]
+allSigned = "Vsi udeleženci so podpisali. Pripravljeno za zaklju�ek."
+awaitingSignatures = "ÄŒakanje na podpise"
+signatureProgress = "{{signedCount}}/{{totalCount}} podpisov"
 chooseCertificate = "Izberite datoteko potrdila"
+declined = "Zavrnjeno"
+fetchFailed = "Podatkov o podpisovanju ni bilo mogo�e naložiti"
+finalized = "Zaklju�eno"
+notified = "Na �akanju"
+partialNote = "Sejo lahko pred�asno zaklju�ite z obstoje�imi podpisi. Nepodpisani udeleženci bodo izklju�eni."
+pending = "Na �akanju"
+readyToFinalize = "Pripravljeno za zaklju�ek"
+signed = "Podpisano"
+viewed = "Ogledano"
 chooseJksFile = "Izberite datoteko JKS"
 chooseP12File = "Izberite datoteko PKCS12"
 choosePfxFile = "Izberite datoteko PFX"
@@ -2082,6 +2124,7 @@ title = "Podpisovanje potrdila"
 invisible = "Neviden"
 stepTitle = "Videz podpisa"
 visible = "Viden"
+visibility = "Vidnost"
 
 [certSign.appearance.options]
 title = "Podrobnosti podpisa"
@@ -2188,6 +2231,252 @@ bullet4 = "Za preverjanje lahko uporabi prilagojena potrdila"
 text = "Ko preverite podpise, vam orodje pove, ali so veljavni, kdo je dokument podpisal, kdaj je bil podpisan in ali je bil dokument po podpisu spremenjen."
 title = "Preverjanje podpisov"
 
+[certSign.collab.finalize]
+button = "Zaklju�i in naloži podpisan PDF"
+early = "Zaklju�i z obstoje�imi podpisi"
+
+[certSign.collab.sessionDetail]
+addButton = "Dodaj udeležence"
+addParticipants = "Dodaj udeležence"
+addParticipantsError = "Udeležencev ni bilo mogo�e dodati"
+backToList = "Nazaj na seje"
+deleteConfirm = "Ali ste prepri�ani? Tega dejanja ni mogo�e razveljaviti."
+deleteError = "Seje ni bilo mogo�e izbrisati"
+deleted = "Seja izbrisana"
+deleteSession = "Izbriši sejo"
+dueDate = "Rok"
+finalizeError = "Seje ni bilo mogo�e zaklju�iti"
+loadPdfError = "Podpisanega PDF ni bilo mogo�e naložiti"
+loadSignedPdf = "Naloži podpisan PDF v aktivne datoteke"
+messageLabel = "Sporo�ilo"
+noAdditionalInfo = "Ni dodatnih informacij"
+owner = "Lastnik"
+participantRemoved = "Udeleženec odstranjen"
+participants = "Udeleženci"
+participantsAdded = "Udeleženci uspešno dodani"
+removeParticipant = "Odstrani"
+removeParticipantError = "Udeleženca ni bilo mogo�e odstraniti"
+selectUsers = "Izberite uporabnike..."
+sessionInfo = "Podatki o seji"
+workbenchTitle = "Upravljanje seje"
+
+[certSign.collab.signRequest]
+addedToFiles = "Dokument dodan v aktivne datoteke"
+addSignature = "Dodajte svoj podpis"
+addToFiles = "Dodaj v aktivne datoteke"
+advancedSettings = "Napredne nastavitve"
+backToList = "Nazaj na zahteve za podpis"
+certificateChoice = "Izberite potrdilo za podpis"
+changeSignature = "Spremeni podpis"
+clearSignature = "Po�isti podpis"
+completeAndSign = "Dokon�aj in podpiši"
+createNewSignature = "Ustvari nov podpis"
+declineButton = "Zavrni"
+decline = "Zavrni zahtevo"
+deleteSelected = "Izbriši izbrani podpis"
+drawSignature = "Spodaj narišite svoj podpis"
+dueDate = "Rok"
+fileTooLarge = "Velikost datoteke mora biti manjša od 5 MB"
+fontFamily = "Družina pisav"
+fontSize = "Velikost pisave: {{size}}px"
+fontSizePlaceholder = "Velikost"
+from = "Od"
+invalidCertFile = "Izberite datoteko potrdila P12 ali PFX"
+invalidFileType = "Izberite slikovno datoteko"
+location = "Lokacija (neobvezno)"
+locationPlaceholder = "Od kod podpisujete?"
+message = "Sporo�ilo"
+noCertificate = "Izberite datoteko potrdila"
+noSignatures = "Na PDF postavite vsaj en podpis"
+p12File = "Datoteka potrdila P12/PFX"
+password = "Geslo potrdila"
+passwordPlaceholder = "Vnesite geslo..."
+penColor = "Barva poteze"
+penSize = "Debelina poteze: {{size}}px"
+placementActive = "Kliknite PDF za postavitev"
+placeSignatureButton = "Postavi podpis na PDF"
+reason = "Razlog (neobvezno)"
+reasonPlaceholder = "Zakaj podpisujete?"
+removeImage = "Odstrani sliko"
+removeCertFile = "Odstrani datoteko"
+savedSignatures = "Shranjeni podpisi"
+selectFile = "Izberi slikovno datoteko"
+selectSignatureTitle = "Izberite ali ustvarite podpis"
+signButton = "Podpiši dokument"
+signatureInfo = "Te nastavitve dolo�i lastnik dokumenta"
+signaturePlaced = "Podpis je postavljen na strani"
+signatureSettings = "Nastavitve podpisa"
+signatureText = "Besedilo podpisa"
+signatureTextPlaceholder = "Vnesite svoje ime..."
+signatureTypeLabel = "Vrsta podpisa"
+signingTitle = "Podpisovanje"
+textColor = "Barva besedila"
+typeSignature = "Vnesite svoje ime za ustvaritev podpisa"
+uploadCert = "Lastno potrdilo"
+uploadCertDesc = "Uporabite svoje potrdilo P12/PFX"
+uploadSignature = "Naložite sliko svojega podpisa"
+usePersonalCert = "Osebno potrdilo"
+usePersonalCertDesc = "Samodejno ustvarjeno za vaš ra�un"
+useServerCert = "Organizacijsko potrdilo"
+useServerCertDesc = "Skupno organizacijsko potrdilo"
+workbenchTitle = "Zahteva za podpis"
+
+[certSign.collab.signRequest.canvas]
+colorPickerTitle = "Izberite barvo poteze"
+continue = "Nadaljuj"
+
+[certSign.collab.signRequest.certModal]
+description = "Postavili ste {{count}} podpis(ov). Za dokon�anje podpisa izberite svoje potrdilo."
+sign = "Podpiši dokument"
+certValidating = "Preverjanje potrdila..."
+certValidUntil = "Potrdilo velja do {{date}}"
+certInvalid = "Neveljavno potrdilo: {{error}}"
+certInvalidFallback = "Neveljavno potrdilo"
+certNetworkError = "Potrdila ni bilo mogo�e preveriti"
+title = "Konfiguriraj potrdilo"
+
+[certSign.collab.signRequest.image]
+hint = "Naložite sliko PNG ali JPG svojega podpisa"
+
+[certSign.collab.signRequest.mode]
+move = "Premakni podpis"
+place = "Postavi podpis"
+title = "Na�in: podpis ali premik"
+
+[certSign.collab.signRequest.modeTabs]
+draw = "Riši"
+image = "Naloži"
+text = "Vnesi"
+
+[certSign.collab.signRequest.placeSignature]
+message = "Kliknite na PDF, da postavite svoj podpis"
+title = "Postavitev podpisa"
+
+[certSign.collab.signRequest.preview]
+imageAlt = "Izbran podpis"
+missing = "Ni predogleda"
+textFallback = "Podpis"
+
+[certSign.collab.signRequest.saved]
+defaultCanvasLabel = "Narisani podpis"
+defaultImageLabel = "Naloženi podpis"
+defaultLabel = "Podpis"
+defaultTextLabel = "Vneseni podpis"
+delete = "Izbriši podpis"
+none = "Ni shranjenih podpisov"
+
+[certSign.collab.signRequest.signatureType]
+draw = "Riši"
+type = "Vnesi"
+upload = "Naloži"
+
+[certSign.collab.signRequest.steps]
+back = "Nazaj"
+cancelPlacement = "Prekli�i postavitev"
+certificate = "Potrdilo"
+clickMultipleTimes = "Kliknite na PDF ve�krat, da postavite podpise. Povlecite kateri koli podpis za premik ali spremembo velikosti."
+clickToPlace = "Kliknite na PDF, kamor želite, da se pojavi vaš podpis."
+continue = "Nadaljuj na izbiro potrdila"
+continueToPlacement = "Nadaljuj na postavitev"
+continueToReview = "Nadaljuj na pregled"
+createSignature = "Ustvari podpis"
+invisible = "Nevidno"
+location = "Lokacija:"
+multipleSignatures = "{{count}} podpisov bo uporabljenih na PDF"
+oneSignature = "1 podpis bo uporabljen na PDF"
+placeOnPdf = "Postavi na PDF"
+reason = "Razlog:"
+reviewTitle = "Pregled pred podpisom"
+signaturePlaced = "Podpis je postavljen na stran {{page}}. Položaj lahko prilagodite z novim klikom ali nadaljujete na pregled."
+visible = "Vidno"
+visibility = "Vidnost:"
+yourSignatures = "Vaši podpisi ({{count}})"
+
+[certSign.collab.signRequest.text]
+colorLabel = "Barva"
+fontLabel = "Pisava"
+fontSizeLabel = "Velikost"
+fontSizePlaceholder = "16"
+label = "Besedilo podpisa"
+modalHint = "Vnesite svoje ime, nato kliknite Nadaljuj, da ga postavite na PDF."
+placeholder = "Vnesite svoje ime..."
+
+[certSign.collab.participant]
+certValidating = "Preverjanje potrdila..."
+certValid = "✓ Potrdilo veljavno"
+certValidUntil = " do {{date}}"
+certInvalid = "✗ {{error}}"
+certInvalidFallback = "Neveljavno potrdilo"
+certNetworkError = "Potrdila ni bilo mogo�e preveriti"
+
+[certSign.collab.addParticipants]
+add = "Dodaj {{count}} udeležencev"
+back = "Nazaj"
+configureSignatures = "Nastavi nastavitve podpisa"
+continue = "Nadaljuj na nastavitve podpisa"
+reasonHelp = "Vnaprej dolo�ite razlog podpisa za te udeležence (neobvezno; lahko ga spremenijo ob podpisu)"
+reasonPlaceholder = "npr. Odobritev, Pregled..."
+selectUsers = "Izberite uporabnike"
+
+[certSign.collab.sessionCreation]
+includeSummaryPage = "Vklju�i stran s povzetkom podpisov"
+includeSummaryPageHelp = "Na koncu bo dodana stran s povzetkom z vsemi metapodatki podpisov. Polja digitalnega potrdila na posameznih straneh bodo skrita (lastnoro�ni podpisi niso prizadeti)."
+
+[certSign.collab.sessionList]
+active = "Aktivno"
+finalized = "Zaklju�eno"
+
+[certSign.collab.signatureSettings]
+description = "Nastavite, kako bodo podpisi videti za vse udeležence"
+title = "Videz podpisa"
+
+[certSign.collab.userSelector]
+inviteUsers = "Dodaj uporabnike"
+loadError = "Uporabnikov ni bilo mogo�e naložiti"
+noTeam = "Brez ekipe"
+noUsers = "Ni najdenih drugih uporabnikov."
+placeholder = "Izberite uporabnike..."
+
+[certSign.mobile]
+panelActions = "Dejanja"
+panelDocument = "Dokument"
+panelPeople = "Osebe"
+
+[certSign.sessions]
+deleted = "Seja izbrisana"
+fetchFailed = "Podrobnosti seje ni bilo mogo�e naložiti"
+finalized = "Seja zaklju�ena"
+loaded = "Podpisan PDF naložen"
+pdfNotReady = "PDF Å¡e ni pripravljen"
+pdfNotReadyDesc = "Podpisani PDF se ustvarja. Poskusite znova �ez trenutek."
+
+[certificateChoice.tooltip]
+header = "Vrste potrdil"
+
+[certificateChoice.tooltip.organization]
+bullet1 = "Upravljajo skrbniki sistema"
+bullet2 = "V skupni rabi med pooblaš�enimi uporabniki"
+bullet3 = "Predstavlja identiteto podjetja, ne posameznika"
+bullet4 = "Najbolj primerno za: uradne dokumente, podpise ekipe"
+description = "Skupno potrdilo, ki ga zagotovi vaša organizacija. Uporablja se za podpisovanje v imenu podjetja."
+title = "Organizacijsko potrdilo"
+
+[certificateChoice.tooltip.personal]
+bullet1 = "Samodejno ustvarjeno ob prvi uporabi"
+bullet2 = "Povezano z vašim uporabniškim ra�unom"
+bullet3 = "Ni ga mogo�e deliti z drugimi uporabniki"
+bullet4 = "Najbolj primerno za: osebne dokumente, individualno odgovornost"
+description = "Samodejno ustvarjeno potrdilo, edinstveno za vaš uporabniški ra�un. Primerno za posamezne podpise."
+title = "Osebno potrdilo"
+
+[certificateChoice.tooltip.upload]
+bullet1 = "Zahteva datoteko P12/PFX in geslo"
+bullet2 = "Lahko ga izdajajo zunanji overitelji potrdil"
+bullet3 = "Višja raven zaupanja za pravne dokumente"
+bullet4 = "Najbolj primerno za: pravno zavezujo�e pogodbe, zunanjo overitev"
+description = "Uporabite svojo datoteko potrdila PKCS#12. Omogo�a popoln nadzor nad lastnostmi potrdila."
+title = "Naloži lastni P12"
+
 [changeCreds]
 changePassword = "Uporabljate privzete poverilnice za prijavo. Prosim vnesite novo geslo"
 changeUsername = "Posodobite uporabniško ime. Po posodobitvi boste odjavljeni."
@@ -3242,6 +3531,46 @@ totalSelected = "Skupaj izbrano"
 unsupported = "Nepodprto"
 unzip = "Razpakiraj"
 uploadError = "Nekaterih datotek ni bilo mogo�e naložiti."
+copyCreated = "Kopija je shranjena v to napravo."
+copyFailed = "Kopije ni bilo mogo�e ustvariti."
+leaveShare = "Odstrani z mojega seznama"
+leaveShareFailed = "Skupne datoteke ni bilo mogo�e odstraniti."
+leaveShareSuccess = "Odstranjeno z vašega seznama v skupni rabi."
+removeBoth = "Odstrani z obeh"
+removeFilePrompt = "Ta datoteka je shranjena na tej napravi in na vašem strežniku. Kje jo želite odstraniti?"
+removeFileTitle = "Odstrani datoteko"
+removeLocalOnly = "Samo s te naprave"
+removeServerFailed = "Datoteke ni bilo mogo�e odstraniti s strežnika."
+removeServerOnly = "Samo s strežnika"
+removeServerOnlyPrompt = "Ta datoteka je shranjena samo na vašem strežniku. Ali jo želite odstraniti s strežnika?"
+removeServerSuccess = "Odstranjeno s strežnika."
+removeSharedPrompt = "Ta datoteka je v skupni rabi z vami. Lahko jo odstranite s te naprave ali s seznama v skupni rabi."
+removeSharedServerOnlyBlockedPrompt = "Ta datoteka je v skupni rabi z vami in je shranjena samo na strežniku."
+removeSharedServerOnlyPrompt = "Ta datoteka je v skupni rabi z vami in je shranjena samo na strežniku. Jo želite odstraniti s svojega seznama?"
+changesNotUploaded = "Spremembe niso naložene"
+cloudFile = "Datoteka v oblaku"
+filterAll = "Vse"
+filterLocal = "Krajevne"
+filterSharedByMe = "V skupni rabi z moje strani"
+filterSharedWithMe = "Z mano v skupni rabi"
+lastSynced = "Zadnja sinhronizacija"
+localOnly = "Samo krajevno"
+makeCopy = "Ustvari kopijo"
+owner = "Lastnik"
+ownerUnknown = "Neznano"
+share = "Skupna raba"
+shareSelected = "Daj v skupno rabo izbrano"
+sharedByYou = "V skupni rabi z moje strani"
+sharedEditNoticeBody = "Nimate pravic za urejanje strežniške razli�ice te datoteke. Vse spremembe bodo shranjene kot krajevna kopija."
+sharedEditNoticeConfirm = "Razumem"
+sharedEditNoticeTitle = "Kopija na strežniku samo za branje"
+sharedWithYou = "Z vami v skupni rabi"
+sharing = "Skupna raba"
+storageState = "Shramba"
+synced = "Sinhronizirano"
+updateOnServer = "Posodobi na strežniku"
+uploadSelected = "Naloži izbrano"
+uploadToServer = "Naloži na strežnik"
 
 [files]
 addFiles = "Dodaj datoteke"
@@ -3367,6 +3696,77 @@ title = "O sploš�enju PDF-jev"
 discord = "Discord"
 issues = "GitHub"
 
+[groupSigning.tooltip]
+header = "O skupinskem podpisovanju"
+
+[groupSigning.tooltip.finalization]
+bullet1 = "Vsi podpisi se uporabijo v vrstnem redu udeležencev, ki ste ga dolo�ili"
+bullet2 = "Po potrebi lahko zaklju�ite z delnimi podpisi"
+bullet3 = "Ko je zaklju�eno, seje ni ve� mogo�e spreminjati"
+description = "Ko vsi udeleženci podpišejo (ali se odlo�ite za pred�asen zaklju�ek), lahko ustvarite kon�ni podpisani PDF."
+title = "Postopek zaklju�evanja"
+
+[groupSigning.tooltip.roles]
+bullet1 = "Lastnik (vi): Ustvari sejo, nastavi privzete vrednosti podpisa, zaklju�i dokument"
+bullet2 = "Udeleženci: Ustvarijo svoj podpis, izberejo potrdilo, ga postavijo na PDF"
+bullet3 = "Udeleženci ne morejo spreminjati nastavitev vidnosti, razloga ali lokacije podpisa"
+description = "Vi nadzirate nastavitve videza podpisa za vse udeležence."
+title = "Vloge udeležencev"
+
+[groupSigning.tooltip.sequential]
+bullet1 = "Prvi udeleženec mora podpisati, preden lahko drugi dostopa do dokumenta"
+bullet2 = "Zagotavlja pravilen vrstni red podpisovanja za pravno skladnost"
+bullet3 = "Udeležence lahko prerazporedite z vle�enjem po seznamu"
+description = "Udeleženci podpisujejo dokumente v vrstnem redu, ki ga dolo�ite. Vsak podpisnik prejme obvestilo, ko je na vrsti."
+title = "Zaporedno podpisovanje"
+
+[groupSigning.steps]
+back = "Nazaj"
+completed = "Dokon�ano"
+current = "Trenutno"
+stepLabel = "Korak {{number}}"
+
+[groupSigning.steps.configureDefaults]
+continue = "Nadaljuj na pregled"
+invisible = "Podpisi bodo nevidni (samo metapodatki)"
+locationLabel = "Lokacija:"
+preview = "Predogled"
+reasonLabel = "Razlog:"
+title = "Nastavi nastavitve podpisa"
+visible = "Podpisi bodo vidni na strani {{page}}"
+
+[groupSigning.steps.review]
+document = "Dokument"
+dueDate = "Rok (neobvezno)"
+dueDatePlaceholder = "Izberite rok..."
+invisible = "Nevidno (samo metapodatki)"
+location = "Lokacija:"
+logo = "Logotip:"
+logoHidden = "Brez logotipa"
+logoShown = "Prikazan logotip Stirling PDF"
+participants = "Udeleženci"
+reason = "Razlog:"
+send = "Pošlji zahteve za podpis"
+signatureSettings = "Nastavitve podpisa"
+title = "Pregled podrobnosti seje"
+titleShort = "Pregled in pošlji"
+visibility = "Vidnost:"
+visible = "Vidno na strani {{page}}"
+participantCount = "{{count}} udeležencev bo podpisovalo po vrsti"
+
+[groupSigning.steps.selectDocument]
+continue = "Nadaljuj na izbor udeležencev"
+noFile = "Za ustvarjanje seje podpisovanja izberite eno datoteko PDF iz svojih aktivnih datotek."
+selectedFile = "Izbran dokument"
+title = "Izberi dokument"
+
+[groupSigning.steps.selectParticipants]
+continue = "Nadaljuj na nastavitve podpisa"
+count = "Izbranih {{count}} udeležencev"
+label = "Izberite udeležence"
+placeholder = "Izberite udeležence za podpis..."
+title = "Izberite udeležence"
+
 [getPdfInfo]
 downloadJson = "Prenesite JSON"
 downloads = "Prenosi"
@@ -4460,7 +4860,10 @@ zoomOut = "Pomanjšaj"
 
 [viewer]
 cannotPreviewFile = "Predogled datoteke ni mogo�"
+disableColorFilter = "Onemogo�i barvni filter"
 dualPageView = "Dvo-stranski pogled"
+enableDarkFilter = "Omogo�i temni filter"
+enableSepiaFilter = "Omogo�i sepia filter"
 firstPage = "Prva stran"
 lastPage = "Zadnja stran"
 nextPage = "Naslednja stran"
@@ -4470,6 +4873,22 @@ singlePageView = "Enostranski pogled"
 unknownFile = "Neznana datoteka"
 zoomIn = "Pove�aj"
 zoomOut = "Pomanjšaj"
+resetZoom = "Ponastavi pove�avo"
+
+[viewer.nonPdf]
+fileTypeBadge = "Datoteka {{type}}"
+convertToPdf = "Pretvori v PDF"
+loading = "Nalaganje..."
+emptyFile = "Prazna datoteka"
+csvStats = "{{rows}} vrstic · {{columns}} stolpcev · {{size}}"
+sortedBy = "Razvrš�eno po: {{column}}"
+columnDefault = "Stolpec {{index}}"
+htmlPreviewWarning = "Predogled HTML — zunanja sredstva se morda ne bodo naložila · {{size}}"
+htmlPreview = "Predogled HTML"
+invalidJson = "Neveljaven JSON — prikaz neoblikovane vsebine"
+textStats = "{{lines}} vrstic · {{size}}"
+lineNumbers = "Å tevilke vrstic"
+renderMarkdown = "Upodobi markdown"
 
 [viewer.attachments]
 title = "Priloge"
@@ -4531,6 +4950,7 @@ toggleAttachments = "Preklopi priloge"
 toggleTheme = "Preklopi temo"
 language = "Jezik"
 toggleAnnotations = "Preklopi vidnost opomb"
+toggleLayers = "Preklopi plasti"
 search = "Iš�i v PDF"
 panMode = "Na�in premikanja"
 applyRedactionsFirst = "Najprej uveljavi prekrivanja"
@@ -5407,20 +5827,72 @@ title = "Natisni datoteko"
 2 = "Vnesite ime tiskalnika"
 
 [quickAccess]
+access = "Dostop"
+accessAddPerson = "Dodaj Å¡e eno osebo"
+accessBack = "Nazaj"
+accessCopyLink = "Kopiraj povezavo"
+accessEmail = "E-poštni naslov"
+accessEmailPlaceholder = "name@company.com"
+accessFileLabel = "Datoteka"
+accessGeneral = "Splošni dostop"
+accessInviteTitle = "Povabi osebe"
+accessOwner = "Lastnik"
+accessPanel = "Dostop do dokumenta"
+accessPeople = "Osebe z dostopom"
+accessRemove = "Odstrani"
+accessRestricted = "Omejeno"
+accessRestrictedHint = "Odpiranje je omogo�eno le osebam z dostopom"
+accessRole = "Vloga"
+accessRoleCommenter = "Komentator"
+accessRoleEditor = "Urejevalec"
+accessRoleViewer = "Ogledovalec"
+accessSelectedFile = "Izbrana datoteka"
+accessSendInvite = "Pošlji povabilo"
+accessTitle = "Dostop do dokumenta"
+accessYou = "Vi"
 account = "Ra�un"
+activeSessions = "Aktivne seje"
+activeTab = "Aktivno"
 activity = "Dnevnik"
 adminSettings = "Skrbnik"
+allSessions = "Vse seje"
 allTools = "All Tools"
 automate = "Poteki"
+back = "Nazaj"
+certSign = "Podpis s potrdilom"
+completedSessions = "Zaklju�ene seje"
+completedTab = "Zaklju�eno"
 config = "Konfig."
+createNew = "Ustvari novo zahtevo"
+createSession = "Ustvari zahtevo za podpis"
+dueDate = "Rok (neobvezno)"
 files = "Datoteke"
 help = "Pomo�"
+noActiveSessions = "Ni �akajo�ih zahtev za podpis ali aktivnih sej"
+noCompletedSessions = "Ni zaklju�enih sej"
+noFile = "Ni izbrane datoteke"
 read = "Preberi"
 reader = "Bralnik"
+refresh = "Osveži"
+requestSignatures = "Zahtevaj podpise"
+selectSingleFileToRequest = "Izberite eno datoteko PDF za zahtevo za podpise"
+selectedFile = "Izbrana datoteka"
+selectUsers = "Izberite uporabnike za podpis"
+selectUsersPlaceholder = "Izberite udeležence..."
+sendingRequest = "Pošiljanje..."
 settings = "Možnosti"
 showMeAround = "Pokaži mi naokrog"
 sign = "Podpiši"
+signatureRequests = "Zahteve za podpis"
+signYourself = "Podpišite sami"
+newRequest = "Nova zahteva"
 tours = "Ogledi"
+wetSign = "Dodaj podpis"
+filterMine = "Moje"
+filterOverdue = "Zapadlo"
+filterSigned = "Podpisano"
+filterDeclined = "Zavrnjeno"
+searchDocuments = "Iš�i dokumente…"
 
 [quickAccess.helpMenu]
 adminTour = "Ogled za skrbnike"
@@ -6050,11 +6522,75 @@ toolNotAvailableLocally = "Vaš strežnik Stirling-PDF je brez povezave in \"{{e
 expired = "Vaša seja je potekla. Osvežite stran in poskusite znova."
 refreshPage = "Osveži stran"
 
+[sessionManagement.tooltip]
+header = "Upravljanje sej podpisovanja"
+
+[sessionManagement.tooltip.addParticipants]
+bullet1 = "Novi udeleženci se dodajo na konec vrstnega reda podpisovanja"
+bullet2 = "Udeležencev ni mogo�e dodajati po zaklju�ku seje"
+bullet3 = "Vsak udeleženec prejme obvestilo, ko je na vrsti"
+description = "Dodatne udeležence lahko dodate kadar koli pred zaklju�kom aktivne seje."
+title = "Dodajanje udeležencev"
+
+[sessionManagement.tooltip.finalization]
+bullet1 = "<b>Poln zaklju�ek</b>: Vsi udeleženci so podpisali"
+bullet2 = "<b>Delni zaklju�ek</b>: Nekateri udeleženci še niso podpisali"
+bullet3 = "Nepodpisani udeleženci bodo izklju�eni iz kon�nega dokumenta"
+bullet4 = "Ko je zaklju�eno, lahko naložite podpisan PDF v aktivne datoteke"
+description = "Zaklju�ek združi vse podpise v en sam podpisan PDF. Tega dejanja ni mogo�e razveljaviti."
+title = "Zaklju�ek seje"
+
+[sessionManagement.tooltip.participantRemoval]
+bullet1 = "Udeležencev, ki so že podpisali, ni mogo�e odstraniti"
+bullet2 = "Odstranjeni udeleženci ne bodo ve� prejemali obvestil"
+bullet3 = "Vrstni red podpisovanja se samodejno prilagodi"
+description = "Udeležence je mogo�e odstraniti iz sej pred njihovim podpisom."
+title = "Odstranjevanje udeležencev"
+
+[sessionManagement.tooltip.signatureOrder]
+bullet1 = "Vsak podpis se uporabi zaporedno na PDF"
+bullet2 = "Poznejši podpisniki lahko vidijo prejšnje podpise"
+bullet3 = "Klju�no za potrditvene poteke in pravno sledljivost"
+description = "Vrstni red, ki ga dolo�ite ob ustvarjanju seje, dolo�a, kdo podpisuje prvi."
+title = "Vrstni red podpisov"
+
+[signatureSettings.tooltip]
+header = "Nastavitve videza podpisa"
+
+[signatureSettings.tooltip.location]
+bullet1 = "Primeri: \"New York, USA\", \"London Office\", \"Remote\""
+bullet2 = "Ni isto kot položaj na strani"
+bullet3 = "Lahko je zahtevano v dolo�enih pravnih jurisdikcijah"
+description = "Izbirna geografska lokacija, kjer je bil podpis uporabljen. Shranjeno v metapodatkih potrdila."
+title = "Lokacija podpisa"
+
+[signatureSettings.tooltip.logo]
+bullet1 = "Prikazano ob podpisu in besedilu"
+bullet2 = "Podpira formate PNG, JPG"
+bullet3 = "Izboljša profesionalen videz"
+description = "Dodajte logotip podjetja k vidnim podpisom za branding in verodostojnost."
+title = "Logotip podjetja"
+
+[signatureSettings.tooltip.reason]
+bullet1 = "Primeri: \"Approval\", \"Contract Agreement\", \"Review Complete\""
+bullet2 = "Vidno v lastnostih podpisa PDF"
+bullet3 = "Uporabno za revizijsko sled in skladnost"
+description = "Izbirno besedilo, ki pojasnjuje, zakaj je dokument podpisan. Shranjeno v metapodatkih potrdila."
+title = "Razlog podpisa"
+
+[signatureSettings.tooltip.visibility]
+bullet1 = "<b>Vidno</b>: Podpis se prikaže v PDF s prilagojenim videzom"
+bullet2 = "<b>Nevidno</b>: Potrdilo je vdelano brez vidnega znaka"
+bullet3 = "Nevidni podpisi Å¡e vedno zagotavljajo kriptografsko veljavnost"
+description = "Nadzira, ali je podpis viden v dokumentu ali vdelan nevidno."
+title = "Vidnost podpisa"
+
 [settings.configuration]
 advanced = "Napredno"
 database = "Podatkovna baza"
 endpoints = "Kon�ne to�ke"
 features = "Funkcije"
+storageSharing = "Shramba datotek in skupna raba"
 systemSettings = "Sistemske nastavitve"
 title = "Konfiguracija"
 
@@ -6332,10 +6868,13 @@ title = "Prijavite se v Stirling"
 [setup.selfhosted]
 link = "ali se povežite z ra�unom na lastnem strežniku"
 subtitle = "Vnesite poverilnice strežnika"
+changeServerLocked = "Vaša organizacija je omejila to aplikacijo na dolo�en strežnik"
 switchToLocal = "Namesto tega uporabi lokalna orodja"
 title = "Prijavite se v strežnik"
 
 [setup.selfhosted.unreachable]
+changeServer = "Poveži se z drugim strežnikom"
+changeServerLocked = "Vaša organizacija je omejila to aplikacijo na dolo�en strežnik"
 continueOffline = "Namesto tega uporabi lokalna orodja"
 message = "Povezave do {{url}} ni bilo mogo�e vzpostaviti. Preverite, ali strežnik deluje in je dostopen."
 retry = "Poskusi znova"
@@ -6529,6 +7068,15 @@ saved = "Shranjeno"
 text = "Besedilo"
 title = "Vrsta podpisa"
 
+[signRequest]
+declined = "Zahteva za podpis zavrnjena"
+fetchFailed = "Zahteve za podpis ni bilo mogo�e naložiti"
+signed = "Dokument uspešno podpisan"
+
+[signSession]
+createFailed = "Zahteve za podpis ni bilo mogo�e ustvariti"
+created = "Zahteva za podpis poslana"
+
 [signup]
 accountCreatedSuccessfully = "Ra�un je uspešno ustvarjen! Zdaj se lahko prijavite."
 alreadyHaveAccount = "Že imate ra�un? Prijavite se"
@@ -6807,6 +7355,106 @@ title = "Razdeli PDF po poglavjih"
 [splitPdfByChapters]
 tags = "razdeli,poglavja,zaznamki,organiziraj"
 
+[storageShare]
+accessed = "Dostopano"
+accessDenied = "Nimate dostopa do te skupne datoteke. Prosite lastnika, da jo da v skupno rabo z vami."
+accessFailed = "Dejavnosti ni mogo�e naložiti."
+accessDeniedBody = "Nimate dostopa do te datoteke. Prosite lastnika, da jo da v skupno rabo z vami."
+accessDeniedTitle = "Brez dostopa"
+accessLimitedCommenter = "Dostop za komentiranje prihaja kmalu. ÄŒe morate prenesti, prosite lastnika za dostop urejevalca."
+accessLimitedTitle = "Omejen dostop"
+accessLimitedViewer = "Ta povezava omogo�a le ogled. Če morate prenesti, prosite lastnika za dostop urejevalca."
+createdAt = "Ustvarjeno"
+download = "Prenesi"
+downloadFailed = "Te datoteke ni mogo�e prenesti."
+expiredBody = "Ta povezava za skupno rabo je neveljavna ali je potekla."
+expiredTitle = "Povezava je potekla"
+goToLogin = "Pojdi na prijavo"
+loadFailed = "Skupne datoteke ni mogo�e odpreti."
+loading = "Nalaganje povezave za skupno rabo..."
+loginPrompt = "Prijavite se za dostop do te skupne datoteke."
+loginRequired = "Potrebna je prijava"
+openInApp = "Odpri v Stirling PDF"
+ownerLabel = "Lastnik"
+ownerUnknown = "Neznano"
+requiresLogin = "Ta skupna datoteka zahteva prijavo."
+roleCommenter = "Komentator"
+roleEditor = "Urejevalec"
+roleViewer = "Ogledovalec"
+shareHeading = "Datoteka v skupni rabi"
+titleDefault = "Datoteka v skupni rabi"
+tryAgain = "Poskusite znova pozneje."
+addUser = "Dodaj"
+commenterHint = "Komentiranje prihaja kmalu."
+copied = "Povezava kopirana v odložiš�e"
+copy = "Kopiraj"
+copyFailed = "Kopiranje ni uspelo"
+description = "Ustvarite povezavo za skupno rabo te datoteke. Prijavljeni uporabniki s povezavo bodo imeli dostop."
+downloadsCount = "Prenosi: {{count}}"
+emailWarningBody = "Videti je kot e-poštni naslov. Če ta oseba ni uporabnik Stirling PDF, ne bo mogla dostopati do datoteke."
+emailWarningConfirm = "Vseeno daj v skupno rabo"
+emailWarningTitle = "E-poštni naslov"
+errorTitle = "Skupna raba ni uspela"
+failure = "Povezave za skupno rabo ni bilo mogo�e ustvariti. Poskusite znova."
+fileLabel = "Datoteka"
+generate = "Ustvari povezavo"
+generated = "Povezava za skupno rabo ustvarjena"
+hideActivity = "Skrij dejavnost"
+invalidUsername = "Vnesite veljavno uporabniško ime ali e-poštni naslov."
+lastAccessed = "Zadnji dostop"
+linkAccessTitle = "Dostop s povezavo za skupno rabo"
+linkLabel = "Povezava za skupno rabo"
+linksDisabled = "Povezave za skupno rabo so onemogo�ene."
+linksDisabledBody = "Povezave za skupno rabo so onemogo�ene v nastavitvah vašega strežnika."
+manage = "Upravljaj skupno rabo"
+manageDescription = "Ustvarjajte in upravljajte povezave za skupno rabo te datoteke."
+manageLoadFailed = "Povezav za skupno rabo ni mogo�e naložiti."
+manageTitle = "Upravljanje skupne rabe"
+noActivity = "Å e ni dejavnosti."
+noLinks = "Ni aktivnih povezav za skupno rabo."
+noSharedUsers = "Noben uporabnik Å¡e nima dostopa."
+removeLink = "Odstrani povezavo"
+removeUser = "Odstrani"
+revokeFailed = "Povezave za skupno rabo ni mogo�e odstraniti."
+revoked = "Povezava za skupno rabo odstranjena"
+roleLabel = "Vloga"
+sharingDisabled = "Skupna raba je onemogo�ena."
+sharingDisabledBody = "Skupna raba je onemogo�ena v nastavitvah vašega strežnika."
+sharedUsersTitle = "Uporabniki z dostopom"
+title = "Deli datoteko"
+unknownUser = "Neznan uporabnik"
+userAddFailed = "Skupna raba s tem uporabnikom ni mogo�a."
+userAdded = "Uporabnik dodan na seznam skupne rabe."
+usernameLabel = "Uporabniško ime ali e-pošta"
+usernamePlaceholder = "Vnesite uporabniško ime ali e-pošto"
+userRemoveFailed = "Tega uporabnika ni mogo�e odstraniti."
+userRemoved = "Uporabnik odstranjen s seznama skupne rabe."
+viewActivity = "Ogled dejavnosti"
+viewed = "Ogledano"
+viewsCount = "Ogledi: {{count}}"
+downloaded = "Preneseno"
+bulkDescription = "Ustvarite eno povezavo za skupno rabo vseh izbranih datotek s prijavljenimi uporabniki."
+bulkTitle = "Deli izbrane datoteke"
+copyLink = "Kopiraj povezavo za skupno rabo"
+fileCount = "{{count}} izbranih datotek"
+ownerOnly = "Le lastnik lahko upravlja skupno rabo."
+selectSingleFile = "Za upravljanje skupne rabe izberite eno datoteko."
+
+[storageUpload]
+description = "To naloži trenutno datoteko v strežniško shrambo za vaš dostop."
+errorTitle = "Nalaganje ni uspelo"
+failure = "Nalaganje ni uspelo. Preverite svojo prijavo in nastavitve shrambe."
+fileLabel = "Datoteka"
+hint = "Javne povezave in na�ine dostopa nadzirajo nastavitve vašega strežnika."
+success = "Naloženo na strežnik"
+title = "Naloži na strežnik"
+updateButton = "Posodobi na strežniku"
+uploadButton = "Naloži na strežnik"
+bulkDescription = "To naloži izbrane datoteke v vašo strežniško shrambo."
+bulkTitle = "Naloži izbrane datoteke"
+fileCount = "{{count}} izbranih datotek"
+more = " +{{count}} ve�"
+
 [storage]
 approximateSize = "Približna velikost"
 fileTooLarge = "Datoteka je prevelika. Najve�ja velikost na datoteko je"
@@ -7153,6 +7801,30 @@ title = "Ogled/Uredi PDF"
 [warning]
 tooltipTitle = "Opozorilo"
 
+[wetSignature.tooltip]
+header = "Na�ini ustvarjanja podpisa"
+
+[wetSignature.tooltip.draw]
+bullet1 = "Prilagodite barvo in debelino peresa"
+bullet2 = "Brišite in znova narišite, dokler niste zadovoljni"
+bullet3 = "Deluje na napravah na dotik (tablice, telefoni)"
+description = "Ustvarite ro�ni podpis z miško ali zaslonom na dotik. Najbolj primerno za osebne, verodostojne podpise."
+title = "Nariši podpis"
+
+[wetSignature.tooltip.type]
+bullet1 = "Izberite med ve� pisavami"
+bullet2 = "Prilagodite velikost in barvo besedila"
+bullet3 = "Odli�no za standardizirane podpise"
+description = "Ustvarite podpis iz vnesenega besedila. Hitro in dosledno, primerno za poslovne dokumente."
+title = "Vnesi podpis"
+
+[wetSignature.tooltip.upload]
+bullet1 = "Podpira PNG, JPG in druge slikovne formate"
+bullet2 = "Za najboljše rezultate so priporo�ena prosojna ozadja"
+bullet3 = "Velikost slike bo prilagojena obmo�ju podpisa"
+description = "Naložite vnaprej ustvarjeno sliko podpisa. Idealno, �e imate skeniran podpis ali logotip podjetja."
+title = "Naloži sliko podpisa"
+
 [watermark]
 completed = "Vodni žig dodan"
 desc = "Dodajte besedilne ali slikovne vodne žige v PDF datoteke"
@@ -7333,6 +8005,7 @@ activeSession = "Aktivna seja"
 addMembers = "Dodaj �lane"
 admin = "Skrbnik"
 confirmDelete = "Ste prepri�ani, da želite izbrisati tega uporabnika? Tega dejanja ni mogo�e razveljaviti."
+confirmUnlock = "Ali ste prepri�ani, da želite odkleniti ta uporabniški ra�un?"
 deleteUser = "Izbriši uporabnika"
 deleteUserError = "Brisanje uporabnika ni uspelo"
 deleteUserSuccess = "Uporabnik uspešno izbrisan"
@@ -7341,6 +8014,8 @@ disable = "Onemogo�i"
 disabled = "Onemogo�en"
 editRole = "Uredi vlogo"
 enable = "Omogo�i"
+locked = "zaklenjen"
+lockedBadge = "Zaklenjeno"
 loading = "Nalaganje �lanov..."
 loginRequired = "Najprej omogo�ite na�in prijave"
 member = "ÄŒlan"
@@ -7350,6 +8025,9 @@ searchMembers = "Iš�i �lane..."
 status = "Stanje"
 team = "Skupina"
 title = "Ljudje"
+unlockAccount = "Odkleni ra�un"
+unlockUserError = "Odklep uporabniškega ra�una ni uspel"
+unlockUserSuccess = "Uporabniški ra�un je bil uspešno odklenjen"
 user = "Uporabnik"
 
 [workspace.people.actions]
diff --git a/frontend/public/locales/sr-LATN-RS/translation.toml b/frontend/public/locales/sr-LATN-RS/translation.toml
index ca40dec57e..2de6f7438d 100644
--- a/frontend/public/locales/sr-LATN-RS/translation.toml
+++ b/frontend/public/locales/sr-LATN-RS/translation.toml
@@ -8,6 +8,7 @@ black = "Crno"
 blue = "Plavo"
 bored = "Da li ti je dosadno dok �ekaš?"
 cancel = "Otkaži"
+confirm = "Potvrdi"
 changedCredsMessage = "Podaci za prijavu uspešno promenjeni!"
 chooseFile = "Izaberi datoteku"
 close = "Zatvori"
@@ -146,6 +147,7 @@ insufficientCredits = "Nedovoljno kredita. Potrebno: {{requiredCredits}}, Dostup
 loadingCredits = "Provera kredita..."
 loadingProStatus = "Provera statusa pretplate..."
 noticeTopUpOrPlan = "Nedovoljno kredita, dopunite ili pređite na plan"
+accessInvite = "Pozovi"
 
 [account]
 accountSettings = "Podešavanja naloga"
@@ -1427,6 +1429,34 @@ title = "Obrada"
 description = "Maksimalno vreme �ekanja na zadatak obrade pre prijave greške."
 label = "Vremensko ograni�enje obrade (sekunde)"
 
+[admin.settings.storage]
+description = "Kontrolišite skladištenje na serveru i opcije deljenja."
+title = "Skladištenje datoteka i deljenje"
+
+[admin.settings.storage.enabled]
+description = "Dozvoli korisnicima da �uvaju datoteke na serveru."
+label = "Omogući skladištenje datoteka na serveru"
+
+[admin.settings.storage.sharing.email]
+description = "Dozvoli deljenje preko adresa e-pošte."
+label = "Omogući deljenje putem e-pošte"
+mailLink = "Podesi podešavanja pošte"
+mailNote = "Zahteva podešavanje pošte. "
+
+[admin.settings.storage.sharing.enabled]
+description = "Dozvoli korisnicima da dele sa�uvane datoteke."
+label = "Omogući deljenje"
+
+[admin.settings.storage.sharing.links]
+description = "Dozvoli deljenje putem linkova uz prijavu."
+frontendUrlLink = "Podesi u sistemskim podešavanjima"
+frontendUrlNote = "Zahteva Frontend URL. "
+label = "Omogući linkove za deljenje"
+
+[admin.settings.storage.signing.enabled]
+description = "Dozvoli korisnicima da kreiraju sesije potpisivanja sa više u�esnika. Zahteva da skladištenje datoteka na serveru bude omogućeno."
+label = "Omogući grupno potpisivanje (alfa)"
+
 [admin.settings.unsavedChanges]
 cancel = "Nastavi uređivanje"
 discard = "Odbaci promene"
@@ -2059,7 +2089,19 @@ numbers = "Brojevi/opsezi: 5, 10-20"
 progressions = "Progresije: 3n, 4n+1"
 
 [certSign]
+allSigned = "Svi u�esnici su potpisali. Spremno za finalizaciju."
+awaitingSignatures = "ÄŒeka se na potpise"
+signatureProgress = "{{signedCount}}/{{totalCount}} potpisa"
 chooseCertificate = "Izaberite fajl sertifikata"
+declined = "Odbijeno"
+fetchFailed = "U�itavanje podataka o potpisivanju nije uspelo"
+finalized = "Finalizovano"
+notified = "Na �ekanju"
+partialNote = "Možete finalizovati ranije sa trenutnim potpisima. Nepotpisani u�esnici biće isklju�eni."
+pending = "Na �ekanju"
+readyToFinalize = "Spremno za finalizaciju"
+signed = "Potpisano"
+viewed = "Pregledano"
 chooseJksFile = "Izaberite JKS fajl"
 chooseP12File = "Izaberite PKCS12 fajl"
 choosePfxFile = "Izaberite PFX fajl"
@@ -2082,6 +2124,7 @@ title = "Potpisivanje Sertifikatom"
 invisible = "Nevidljiv"
 stepTitle = "Izgled potpisa"
 visible = "Vidljiv"
+visibility = "Vidljivost"
 
 [certSign.appearance.options]
 title = "Detalji potpisa"
@@ -2188,6 +2231,252 @@ bullet4 = "Može koristiti prilagođene sertifikate za verifikaciju"
 text = "Kada proveravate potpise, alat prikazuje da li su važeći, ko je potpisao dokument, kada je potpisan i da li je dokument promenjen nakon potpisivanja."
 title = "Provera potpisa"
 
+[certSign.collab.finalize]
+button = "Finalizuj i u�itaj potpisani PDF"
+early = "Finalizuj sa trenutnim potpisima"
+
+[certSign.collab.sessionDetail]
+addButton = "Dodaj u�esnike"
+addParticipants = "Dodaj u�esnike"
+addParticipantsError = "Dodavanje u�esnika nije uspelo"
+backToList = "Nazad na sesije"
+deleteConfirm = "Da li ste sigurni? Ovo se ne može opozvati."
+deleteError = "Brisanje sesije nije uspelo"
+deleted = "Sesija je obrisana"
+deleteSession = "Obriši sesiju"
+dueDate = "Rok"
+finalizeError = "Finalizacija sesije nije uspela"
+loadPdfError = "U�itavanje potpisanog PDF-a nije uspelo"
+loadSignedPdf = "U�itaj potpisani PDF u aktivne datoteke"
+messageLabel = "Poruka"
+noAdditionalInfo = "Nema dodatnih informacija"
+owner = "Vlasnik"
+participantRemoved = "U�esnik uklonjen"
+participants = "U�esnici"
+participantsAdded = "U�esnici su uspešno dodati"
+removeParticipant = "Ukloni"
+removeParticipantError = "Uklanjanje u�esnika nije uspelo"
+selectUsers = "Izaberite korisnike..."
+sessionInfo = "Informacije o sesiji"
+workbenchTitle = "Upravljanje sesijom"
+
+[certSign.collab.signRequest]
+addedToFiles = "Dokument dodat u aktivne datoteke"
+addSignature = "Dodajte svoj potpis"
+addToFiles = "Dodaj u aktivne datoteke"
+advancedSettings = "Napredna podešavanja"
+backToList = "Nazad na zahteve za potpisivanje"
+certificateChoice = "Izaberite sertifikat za potpisivanje"
+changeSignature = "Promeni potpis"
+clearSignature = "Obriši potpis"
+completeAndSign = "Dovrši i potpiši"
+createNewSignature = "Kreiraj novi potpis"
+declineButton = "Odbij"
+decline = "Odbij zahtev"
+deleteSelected = "Obriši izabrani potpis"
+drawSignature = "Nacrtajte svoj potpis ispod"
+dueDate = "Rok"
+fileTooLarge = "Veli�ina datoteke mora biti manja od 5 MB"
+fontFamily = "Porodica fonta"
+fontSize = "Veli�ina fonta: {{size}}px"
+fontSizePlaceholder = "Veli�ina"
+from = "Od"
+invalidCertFile = "Izaberite P12 ili PFX datoteku sertifikata"
+invalidFileType = "Izaberite slikovnu datoteku"
+location = "Lokacija (opciono)"
+locationPlaceholder = "Odakle potpisujete?"
+message = "Poruka"
+noCertificate = "Izaberite datoteku sertifikata"
+noSignatures = "Postavite bar jedan potpis na PDF"
+p12File = "P12/PFX datoteka sertifikata"
+password = "Lozinka sertifikata"
+passwordPlaceholder = "Unesite lozinku..."
+penColor = "Boja olovke"
+penSize = "Veli�ina olovke: {{size}}px"
+placementActive = "Kliknite na PDF za postavljanje"
+placeSignatureButton = "Postavi potpis na PDF"
+reason = "Razlog (opciono)"
+reasonPlaceholder = "Zašto potpisujete?"
+removeImage = "Ukloni sliku"
+removeCertFile = "Ukloni datoteku"
+savedSignatures = "Sa�uvani potpisi"
+selectFile = "Izaberite slikovnu datoteku"
+selectSignatureTitle = "Izaberite ili kreirajte potpis"
+signButton = "Potpiši dokument"
+signatureInfo = "Ova podešavanja je konfigurisao vlasnik dokumenta"
+signaturePlaced = "Potpis postavljen na stranici"
+signatureSettings = "Postavke potpisa"
+signatureText = "Tekst potpisa"
+signatureTextPlaceholder = "Unesite svoje ime..."
+signatureTypeLabel = "Tip potpisa"
+signingTitle = "Potpisivanje"
+textColor = "Boja teksta"
+typeSignature = "Unesite svoje ime da kreirate potpis"
+uploadCert = "Prilagođeni sertifikat"
+uploadCertDesc = "Koristite sopstveni P12/PFX sertifikat"
+uploadSignature = "Otpremite sliku svog potpisa"
+usePersonalCert = "Li�ni sertifikat"
+usePersonalCertDesc = "Automatski generisan za vaš nalog"
+useServerCert = "Sertifikat organizacije"
+useServerCertDesc = "Deljeni sertifikat organizacije"
+workbenchTitle = "Zahtev za potpisivanje"
+
+[certSign.collab.signRequest.canvas]
+colorPickerTitle = "Izaberite boju poteza"
+continue = "Nastavi"
+
+[certSign.collab.signRequest.certModal]
+description = "Postavili ste {{count}} potpis(a). Izaberite sertifikat da dovršite potpisivanje."
+sign = "Potpiši dokument"
+certValidating = "Provera sertifikata..."
+certValidUntil = "Sertifikat važi do {{date}}"
+certInvalid = "Nevažeći sertifikat: {{error}}"
+certInvalidFallback = "Nevažeći sertifikat"
+certNetworkError = "Nije moguće potvrditi sertifikat"
+title = "Podesi sertifikat"
+
+[certSign.collab.signRequest.image]
+hint = "Otpremite PNG ili JPG sliku svog potpisa"
+
+[certSign.collab.signRequest.mode]
+move = "Pomeri potpis"
+place = "Postavi potpis"
+title = "Režim potpisivanja ili pomeranja"
+
+[certSign.collab.signRequest.modeTabs]
+draw = "Crtanje"
+image = "Otpremanje"
+text = "Kucanje"
+
+[certSign.collab.signRequest.placeSignature]
+message = "Kliknite na PDF da postavite svoj potpis"
+title = "Postavljanje potpisa"
+
+[certSign.collab.signRequest.preview]
+imageAlt = "Izabrani potpis"
+missing = "Nema pregleda"
+textFallback = "Potpis"
+
+[certSign.collab.signRequest.saved]
+defaultCanvasLabel = "Crtani potpis"
+defaultImageLabel = "Otpremljeni potpis"
+defaultLabel = "Potpis"
+defaultTextLabel = "Kucani potpis"
+delete = "Obriši potpis"
+none = "Nema sa�uvanih potpisa"
+
+[certSign.collab.signRequest.signatureType]
+draw = "Crtanje"
+type = "Kucanje"
+upload = "Otpremanje"
+
+[certSign.collab.signRequest.steps]
+back = "Nazad"
+cancelPlacement = "Otkaži postavljanje"
+certificate = "Sertifikat"
+clickMultipleTimes = "Kliknite više puta na PDF da postavite potpise. Prevucite bilo koji potpis da ga pomerite ili promenite veli�inu."
+clickToPlace = "Kliknite na PDF gde želite da se pojavi vaš potpis."
+continue = "Nastavi na izbor sertifikata"
+continueToPlacement = "Nastavi na postavljanje"
+continueToReview = "Nastavi na pregled"
+createSignature = "Kreiraj potpis"
+invisible = "Nevidljivo"
+location = "Lokacija:"
+multipleSignatures = "{{count}} potpisa biće primenjeno na PDF"
+oneSignature = "1 potpis biće primenjen na PDF"
+placeOnPdf = "Postavi na PDF"
+reason = "Razlog:"
+reviewTitle = "Pregled pre potpisivanja"
+signaturePlaced = "Potpis postavljen na stranici {{page}}. Možete prilagoditi poziciju ponovnim klikom ili nastaviti na pregled."
+visible = "Vidljivo"
+visibility = "Vidljivost:"
+yourSignatures = "Vaši potpisi ({{count}})"
+
+[certSign.collab.signRequest.text]
+colorLabel = "Boja"
+fontLabel = "Font"
+fontSizeLabel = "Veli�ina"
+fontSizePlaceholder = "16"
+label = "Tekst potpisa"
+modalHint = "Unesite svoje ime, zatim kliknite na Nastavi da ga postavite na PDF."
+placeholder = "Unesite svoje ime..."
+
+[certSign.collab.participant]
+certValidating = "Provera sertifikata..."
+certValid = "✓ Sertifikat važi"
+certValidUntil = " do {{date}}"
+certInvalid = "✗ {{error}}"
+certInvalidFallback = "Nevažeći sertifikat"
+certNetworkError = "Nije moguće potvrditi sertifikat"
+
+[certSign.collab.addParticipants]
+add = "Dodaj {{count}} u�esnika"
+back = "Nazad"
+configureSignatures = "Podesi postavke potpisa"
+continue = "Nastavi na postavke potpisa"
+reasonHelp = "Unapred postavite razlog potpisivanja za ove u�esnike (opciono, mogu ga promeniti pri potpisivanju)"
+reasonPlaceholder = "npr. Odobrenje, Revizija..."
+selectUsers = "Izaberi korisnike"
+
+[certSign.collab.sessionCreation]
+includeSummaryPage = "Uklju�i stranicu sa sažetkom potpisa"
+includeSummaryPageHelp = "Na kraju će biti dodata stranica sa svim metapodacima potpisa. Okviri digitalnog sertifikata na pojedina�nim stranicama biće potisnuti (vlažni potpisi nisu pogođeni)."
+
+[certSign.collab.sessionList]
+active = "Aktivno"
+finalized = "Finalizovano"
+
+[certSign.collab.signatureSettings]
+description = "Podesite kako će potpisi izgledati za sve u�esnike"
+title = "Izgled potpisa"
+
+[certSign.collab.userSelector]
+inviteUsers = "Dodaj korisnike"
+loadError = "U�itavanje korisnika nije uspelo"
+noTeam = "Nema tima"
+noUsers = "Nisu pronađeni drugi korisnici."
+placeholder = "Izaberite korisnike..."
+
+[certSign.mobile]
+panelActions = "Radnje"
+panelDocument = "Dokument"
+panelPeople = "Osobe"
+
+[certSign.sessions]
+deleted = "Sesija je obrisana"
+fetchFailed = "U�itavanje detalja sesije nije uspelo"
+finalized = "Sesija finalizovana"
+loaded = "Potpisani PDF je u�itan"
+pdfNotReady = "PDF nije spreman"
+pdfNotReadyDesc = "Potpisani PDF se generiše. Pokušajte ponovo za trenutak."
+
+[certificateChoice.tooltip]
+header = "Tipovi sertifikata"
+
+[certificateChoice.tooltip.organization]
+bullet1 = "Upravlja sistemski administrator"
+bullet2 = "Deljen među ovlašćenim korisnicima"
+bullet3 = "Predstavlja identitet kompanije, ne pojedinca"
+bullet4 = "Najbolje za: Zvani�na dokumenta, timske potpise"
+description = "Deljeni sertifikat koji obezbeđuje vaša organizacija. Koristi se za ovlašćeno potpisivanje u ime kompanije."
+title = "Sertifikat organizacije"
+
+[certificateChoice.tooltip.personal]
+bullet1 = "Generiše se automatski pri prvoj upotrebi"
+bullet2 = "Povezan sa vašim korisni�kim nalogom"
+bullet3 = "Ne može se deliti sa drugim korisnicima"
+bullet4 = "Najbolje za: Li�na dokumenta, individualnu odgovornost"
+description = "Automatski generisan sertifikat jedinstven za vaš korisni�ki nalog. Pogodan za individualne potpise."
+title = "Li�ni sertifikat"
+
+[certificateChoice.tooltip.upload]
+bullet1 = "Zahteva P12/PFX datoteku i lozinku"
+bullet2 = "Može biti izdat od strane eksternih sertifikacionih tela"
+bullet3 = "Viši nivo poverenja za pravna dokumenta"
+bullet4 = "Najbolje za: Pravno obavezujuće ugovore, eksternu verifikaciju"
+description = "Koristite svoju PKCS#12 datoteku sertifikata. Obezbeđuje potpunu kontrolu nad svojstvima sertifikata."
+title = "Otpremi prilagođeni P12"
+
 [changeCreds]
 changePassword = "Koristiš podrazumevane pristupne podatke. Molim te unesi novu lozinku"
 changeUsername = "Ažurirajte korisni�ko ime. Bićete odjavljeni nakon ažuriranja."
@@ -3242,6 +3531,46 @@ totalSelected = "Ukupno izabrano"
 unsupported = "Nepodržano"
 unzip = "Raspakuj"
 uploadError = "Nije uspelo otpremanje nekih datoteka."
+copyCreated = "Kopija sa�uvana na ovom uređaju."
+copyFailed = "Nije moguće napraviti kopiju."
+leaveShare = "Ukloni sa moje liste"
+leaveShareFailed = "Nije moguće ukloniti deljenu datoteku."
+leaveShareSuccess = "Uklonjeno sa vaše liste deljenih datoteka."
+removeBoth = "Ukloni sa oba mesta"
+removeFilePrompt = "Ova datoteka je sa�uvana na ovom uređaju i na vašem serveru. Odakle želite da je uklonite?"
+removeFileTitle = "Ukloni datoteku"
+removeLocalOnly = "Samo ovaj uređaj"
+removeServerFailed = "Nije moguće ukloniti datoteku sa servera."
+removeServerOnly = "Samo server"
+removeServerOnlyPrompt = "Ova datoteka je sa�uvana samo na vašem serveru. Želite li da je uklonite sa servera?"
+removeServerSuccess = "Uklonjeno sa servera."
+removeSharedPrompt = "Ova datoteka je podeljena sa vama. Možete je ukloniti sa ovog uređaja ili sa liste deljenih."
+removeSharedServerOnlyBlockedPrompt = "Ova datoteka je podeljena sa vama i nalazi se samo na serveru."
+removeSharedServerOnlyPrompt = "Ova datoteka je podeljena sa vama i nalazi se samo na serveru. Ukloniti je sa vaše liste?"
+changesNotUploaded = "Izmene nisu otpremljene"
+cloudFile = "Datoteka u oblaku"
+filterAll = "Sve"
+filterLocal = "Lokalno"
+filterSharedByMe = "Deljeno od mene"
+filterSharedWithMe = "Deljeno sa mnom"
+lastSynced = "Poslednja sinhronizacija"
+localOnly = "Samo lokalno"
+makeCopy = "Napravi kopiju"
+owner = "Vlasnik"
+ownerUnknown = "Nepoznato"
+share = "Podeli"
+shareSelected = "Podeli izabrano"
+sharedByYou = "Deljeno od vas"
+sharedEditNoticeBody = "Nemate prava za uređivanje serverske verzije ove datoteke. Sve izmene koje napravite biće sa�uvane kao lokalna kopija."
+sharedEditNoticeConfirm = "Razumem"
+sharedEditNoticeTitle = "Serverska kopija samo za �itanje"
+sharedWithYou = "Deljeno sa vama"
+sharing = "Deljenje"
+storageState = "Skladište"
+synced = "Sinhronizovano"
+updateOnServer = "Ažuriraj na serveru"
+uploadSelected = "Otpremi izabrano"
+uploadToServer = "Otpremi na server"
 
 [files]
 addFiles = "Dodaj datoteke"
@@ -3367,6 +3696,77 @@ title = "O ravnanju PDF-ova"
 discord = "Discord"
 issues = "GitHub"
 
+[groupSigning.tooltip]
+header = "O grupnom potpisivanju"
+
+[groupSigning.tooltip.finalization]
+bullet1 = "Svi potpisi se primenjuju redom u�esnika koji ste naveli"
+bullet2 = "Možete finalizovati sa delimi�nim potpisima po potrebi"
+bullet3 = "Kada se finalizuje, sesija se ne može izmeniti"
+description = "Kada svi u�esnici potpišu (ili izaberete da finalizujete ranije), možete generisati kona�ni potpisani PDF."
+title = "Proces finalizacije"
+
+[groupSigning.tooltip.roles]
+bullet1 = "Vlasnik (vi): Kreira sesiju, podešava podrazumevani izgled potpisa, finalizuje dokument"
+bullet2 = "U�esnici: Kreiraju svoj potpis, biraju sertifikat, postavljaju potpis na PDF"
+bullet3 = "U�esnici ne mogu menjati vidljivost, razlog ili postavke lokacije potpisa"
+description = "Vi kontrolišete podešavanja izgleda potpisa za sve u�esnike."
+title = "Uloge u�esnika"
+
+[groupSigning.tooltip.sequential]
+bullet1 = "Prvi u�esnik mora potpisati pre nego što drugi dobije pristup dokumentu"
+bullet2 = "Obezbeđuje ispravan redosled potpisivanja radi pravne usklađenosti"
+bullet3 = "Možete promeniti redosled prevla�enjem u listi"
+description = "U�esnici potpisuju dokumente redosledom koji navedete. Svaki potpisnik dobija obaveštenje kada dođe na red."
+title = "Sekvencijalno potpisivanje"
+
+[groupSigning.steps]
+back = "Nazad"
+completed = "Završeno"
+current = "Trenutno"
+stepLabel = "Korak {{number}}"
+
+[groupSigning.steps.configureDefaults]
+continue = "Nastavi na pregled"
+invisible = "Potpisi će biti nevidljivi (samo metapodaci)"
+locationLabel = "Lokacija:"
+preview = "Pregled"
+reasonLabel = "Razlog:"
+title = "Podesi postavke potpisa"
+visible = "Potpisi će biti vidljivi na stranici {{page}}"
+
+[groupSigning.steps.review]
+document = "Dokument"
+dueDate = "Rok (opciono)"
+dueDatePlaceholder = "Izaberite rok..."
+invisible = "Nevidljivo (samo metapodaci)"
+location = "Lokacija:"
+logo = "Logotip:"
+logoHidden = "Bez logotipa"
+logoShown = "Prikazan Stirling PDF logotip"
+participants = "U�esnici"
+reason = "Razlog:"
+send = "Pošalji zahteve za potpisivanje"
+signatureSettings = "Postavke potpisa"
+title = "Pregled detalja sesije"
+titleShort = "Pregled i slanje"
+visibility = "Vidljivost:"
+visible = "Vidljivo na stranici {{page}}"
+participantCount = "{{count}} u�esnika će potpisivati redom"
+
+[groupSigning.steps.selectDocument]
+continue = "Nastavi na izbor u�esnika"
+noFile = "Izaberite jednu PDF datoteku iz svojih aktivnih datoteka da biste kreirali sesiju potpisivanja."
+selectedFile = "Izabrani dokument"
+title = "Izaberite dokument"
+
+[groupSigning.steps.selectParticipants]
+continue = "Nastavi na postavke potpisa"
+count = "Izabrano u�esnika: {{count}}"
+label = "Izaberite u�esnike"
+placeholder = "Izaberite u�esnike za potpisivanje..."
+title = "Izaberite u�esnike"
+
 [getPdfInfo]
 downloadJson = "Preuzmi JSON"
 downloads = "Preuzimanja"
@@ -4460,7 +4860,10 @@ zoomOut = "Umanji"
 
 [viewer]
 cannotPreviewFile = "Nije moguće pregledati datoteku"
+disableColorFilter = "Onemogući filter boja"
 dualPageView = "Prikaz dve stranice"
+enableDarkFilter = "Omogući tamni filter"
+enableSepiaFilter = "Omogući sepija filter"
 firstPage = "Prva stranica"
 lastPage = "Poslednja stranica"
 nextPage = "Sledeća stranica"
@@ -4470,6 +4873,22 @@ singlePageView = "Prikaz jedne stranice"
 unknownFile = "Nepoznata datoteka"
 zoomIn = "Uvećaj"
 zoomOut = "Umanji"
+resetZoom = "Resetuj zum"
+
+[viewer.nonPdf]
+fileTypeBadge = "{{type}} datoteka"
+convertToPdf = "Konvertuj u PDF"
+loading = "U�itavanje..."
+emptyFile = "Prazna datoteka"
+csvStats = "{{rows}} redova · {{columns}} kolona · {{size}}"
+sortedBy = "Sortirano po: {{column}}"
+columnDefault = "Kolona {{index}}"
+htmlPreviewWarning = "HTML pregled — spoljašnji resursi možda neće biti u�itani · {{size}}"
+htmlPreview = "HTML pregled"
+invalidJson = "Nevažeći JSON — prikaz sirovog sadržaja"
+textStats = "{{lines}} linija · {{size}}"
+lineNumbers = "Brojevi linija"
+renderMarkdown = "Prikaži markdown"
 
 [viewer.attachments]
 title = "Prilozi"
@@ -4531,6 +4950,7 @@ toggleAttachments = "Prikaži/sakrij priloge"
 toggleTheme = "Uklju�i/isklju�i temu"
 language = "Jezik"
 toggleAnnotations = "Uklju�i/isklju�i vidljivost anotacija"
+toggleLayers = "Uklju�i/isklju�i slojeve"
 search = "Pretraži PDF"
 panMode = "Režim pomeranja"
 applyRedactionsFirst = "Prvo primenite zacrnjivanja"
@@ -5407,20 +5827,72 @@ title = "Odštampaj datoteku"
 2 = "Unesi naziv štampa�a"
 
 [quickAccess]
+access = "Pristup"
+accessAddPerson = "Dodaj još jednu osobu"
+accessBack = "Nazad"
+accessCopyLink = "Kopiraj link"
+accessEmail = "Adresa e-pošte"
+accessEmailPlaceholder = "name@company.com"
+accessFileLabel = "Datoteka"
+accessGeneral = "Opšti pristup"
+accessInviteTitle = "Pozovi osobe"
+accessOwner = "Vlasnik"
+accessPanel = "Pristup dokumentu"
+accessPeople = "Osobe sa pristupom"
+accessRemove = "Ukloni"
+accessRestricted = "Ograni�eno"
+accessRestrictedHint = "Samo osobe sa pristupom mogu da otvore"
+accessRole = "Uloga"
+accessRoleCommenter = "Komentator"
+accessRoleEditor = "Urednik"
+accessRoleViewer = "ÄŒitalac"
+accessSelectedFile = "Izabrana datoteka"
+accessSendInvite = "Pošalji poziv"
+accessTitle = "Pristup dokumentu"
+accessYou = "Vi"
 account = "Nalog"
+activeSessions = "Aktivne sesije"
+activeTab = "Aktivno"
 activity = "Istorija"
 adminSettings = "Admin postavke"
+allSessions = "Sve sesije"
 allTools = "All Tools"
 automate = "Auto radnje"
+back = "Nazad"
+certSign = "Potpisivanje sertifikatom"
+completedSessions = "Završene sesije"
+completedTab = "Završeno"
 config = "Konfig"
+createNew = "Kreiraj novi zahtev"
+createSession = "Kreiraj zahtev za potpisivanje"
+dueDate = "Rok (opciono)"
 files = "Fajlovi"
 help = "Pomoć"
+noActiveSessions = "Nema zahteva za potpisivanje na �ekanju niti aktivnih sesija"
+noCompletedSessions = "Nema završenih sesija"
+noFile = "Nije izabrana datoteka"
 read = "ÄŒitanje"
 reader = "Čita�"
+refresh = "Osveži"
+requestSignatures = "Zatraži potpise"
+selectSingleFileToRequest = "Izaberite jednu PDF datoteku da zatražite potpise"
+selectedFile = "Izabrana datoteka"
+selectUsers = "Izaberite korisnike za potpisivanje"
+selectUsersPlaceholder = "Izaberite u�esnike..."
+sendingRequest = "Slanje..."
 settings = "Postavke"
 showMeAround = "Provedi me kroz"
 sign = "Potpis"
+signatureRequests = "Zahtevi za potpisivanje"
+signYourself = "Potpišite sami"
+newRequest = "Novi zahtev"
 tours = "Obilasci"
+wetSign = "Dodaj potpis"
+filterMine = "Moji"
+filterOverdue = "Istekli rok"
+filterSigned = "Potpisano"
+filterDeclined = "Odbijeno"
+searchDocuments = "Pretraži dokumente…"
 
 [quickAccess.helpMenu]
 adminTour = "Administratorski obilazak"
@@ -6050,11 +6522,75 @@ toolNotAvailableLocally = "Vaš Stirling-PDF server je van mreže i \"{{endpoint
 expired = "Istekla ti je sesija. Osveži stranicu i pokušaj ponovo."
 refreshPage = "Osveži stranicu"
 
+[sessionManagement.tooltip]
+header = "Upravljanje sesijama potpisivanja"
+
+[sessionManagement.tooltip.addParticipants]
+bullet1 = "Novi u�esnici se dodaju na kraj redosleda potpisivanja"
+bullet2 = "Ne možete dodavati u�esnike nakon finalizacije sesije"
+bullet3 = "Svaki u�esnik dobija obaveštenje kada dođe na red"
+description = "Možete dodati još u�esnika u aktivnu sesiju u bilo kom trenutku pre finalizacije."
+title = "Dodavanje u�esnika"
+
+[sessionManagement.tooltip.finalization]
+bullet1 = "<b>Potpuna finalizacija</b>: Svi u�esnici su potpisali"
+bullet2 = "<b>Delimi�na finalizacija</b>: Neki u�esnici još nisu potpisali"
+bullet3 = "U�esnici koji nisu potpisali biće isklju�eni iz kona�nog dokumenta"
+bullet4 = "Nakon finalizacije možete u�itati potpisani PDF u aktivne datoteke"
+description = "Finalizacija kombinuje sve potpise u jedan potpisani PDF. Ova radnja se ne može opozvati."
+title = "Finalizacija sesije"
+
+[sessionManagement.tooltip.participantRemoval]
+bullet1 = "Ne možete ukloniti u�esnike koji su već potpisali"
+bullet2 = "Uklonjeni u�esnici više ne dobijaju obaveštenja"
+bullet3 = "Redosled potpisivanja se automatski prilagođava"
+description = "U�esnici se mogu ukloniti iz sesije pre nego što potpišu."
+title = "Uklanjanje u�esnika"
+
+[sessionManagement.tooltip.signatureOrder]
+bullet1 = "Svaki potpis se primenjuje sekvencijalno na PDF"
+bullet2 = "Kasniji potpisnici mogu videti ranije potpise"
+bullet3 = "Klju�no za tokove odobravanja i pravni lanac �uvanja"
+description = "Redosled koji navedete pri kreiranju sesije određuje ko potpisuje prvi."
+title = "Redosled potpisivanja"
+
+[signatureSettings.tooltip]
+header = "Podešavanja izgleda potpisa"
+
+[signatureSettings.tooltip.location]
+bullet1 = "Primeri: \"New York, USA\", \"London Office\", \"Remote\""
+bullet2 = "Nije isto Å¡to i pozicija na stranici"
+bullet3 = "Može biti obavezno u određenim pravnim jurisdikcijama"
+description = "Opciona geografska lokacija gde je potpis primenjen. ÄŒuva se u metapodacima sertifikata."
+title = "Lokacija potpisa"
+
+[signatureSettings.tooltip.logo]
+bullet1 = "Prikazano uz potpis i tekst"
+bullet2 = "Podržava PNG, JPG formate"
+bullet3 = "Poboljšava profesionalni izgled"
+description = "Dodajte logotip kompanije vidljivim potpisima radi brendiranja i autenti�nosti."
+title = "Logotip kompanije"
+
+[signatureSettings.tooltip.reason]
+bullet1 = "Primeri: \"Approval\", \"Contract Agreement\", \"Review Complete\""
+bullet2 = "Vidljivo u svojstvima potpisa u PDF-u"
+bullet3 = "Korisno za revizione tragove i usklađenost"
+description = "Opcioni tekst koji objašnjava zašto se dokument potpisuje. Čuva se u metapodacima sertifikata."
+title = "Razlog potpisa"
+
+[signatureSettings.tooltip.visibility]
+bullet1 = "<b>Vidljivo</b>: Potpis se pojavljuje u PDF-u sa prilagođenim izgledom"
+bullet2 = "<b>Nevidljivo</b>: Sertifikat je ugrađen bez vizuelne oznake"
+bullet3 = "Nevidljivi potpisi i dalje pružaju kriptografsku verifikaciju"
+description = "Kontroliše da li je potpis vidljiv na dokumentu ili je nevidljivo ugrađen."
+title = "Vidljivost potpisa"
+
 [settings.configuration]
 advanced = "Napredno"
 database = "Baza podataka"
 endpoints = "Krajnje ta�ke"
 features = "Funkcije"
+storageSharing = "Skladištenje datoteka i deljenje"
 systemSettings = "Sistemska podešavanja"
 title = "Konfiguracija"
 
@@ -6332,10 +6868,13 @@ title = "Prijavite se u Stirling"
 [setup.selfhosted]
 link = "ili se povežite na samohostovani nalog"
 subtitle = "Unesite kredencijale servera"
+changeServerLocked = "Vaša organizacija je ograni�ila ovu aplikaciju na određeni server"
 switchToLocal = "Umesto toga koristite lokalne alate"
 title = "Prijava na server"
 
 [setup.selfhosted.unreachable]
+changeServer = "Povežite se na drugi server"
+changeServerLocked = "Vaša organizacija je ograni�ila ovu aplikaciju na određeni server"
 continueOffline = "Umesto toga koristite lokalne alate"
 message = "Nije moguće pristupiti {{url}}. Proverite da li server radi i da li je dostupan."
 retry = "Pokušajte ponovo"
@@ -6529,6 +7068,15 @@ saved = "Sa�uvano"
 text = "Tekst"
 title = "Tip potpisa"
 
+[signRequest]
+declined = "Zahtev za potpisivanje je odbijen"
+fetchFailed = "U�itavanje zahteva za potpisivanje nije uspelo"
+signed = "Dokument je uspešno potpisan"
+
+[signSession]
+createFailed = "Kreiranje zahteva za potpisivanje nije uspelo"
+created = "Zahtev za potpisivanje je poslat"
+
 [signup]
 accountCreatedSuccessfully = "Nalog je uspešno kreiran! Sada se možete prijaviti."
 alreadyHaveAccount = "Već imate nalog? Prijavite se"
@@ -6807,6 +7355,106 @@ title = "Podeli PDF po poglavljima"
 [splitPdfByChapters]
 tags = "podeli,poglavlja,zabeleške,organizacija"
 
+[storageShare]
+accessed = "Pristupljeno"
+accessDenied = "Nemate pristup ovoj deljenoj datoteci. Zatražite od vlasnika da je podeli sa vama."
+accessFailed = "Nije moguće u�itati aktivnost."
+accessDeniedBody = "Nemate pristup ovoj datoteci. Zatražite od vlasnika da je podeli sa vama."
+accessDeniedTitle = "Nema pristupa"
+accessLimitedCommenter = "Pristup za komentarisanje uskoro stiže. Zatražite od vlasnika pristup urednika ako treba da preuzmete."
+accessLimitedTitle = "Ograni�en pristup"
+accessLimitedViewer = "Ovaj link je samo za pregled. Zatražite od vlasnika pristup urednika ako treba da preuzmete."
+createdAt = "Kreirano"
+download = "Preuzmi"
+downloadFailed = "Nije moguće preuzeti ovu datoteku."
+expiredBody = "Ovaj link za deljenje je nevažeći ili je istekao."
+expiredTitle = "Link je istekao"
+goToLogin = "Idi na prijavu"
+loadFailed = "Nije moguće otvoriti deljenu datoteku."
+loading = "U�itavanje linka za deljenje..."
+loginPrompt = "Prijavite se da pristupite ovoj deljenoj datoteci."
+loginRequired = "Potrebna je prijava"
+openInApp = "Otvori u Stirling PDF"
+ownerLabel = "Vlasnik"
+ownerUnknown = "Nepoznato"
+requiresLogin = "Ova deljena datoteka zahteva prijavu."
+roleCommenter = "Komentator"
+roleEditor = "Urednik"
+roleViewer = "ÄŒitalac"
+shareHeading = "Deljena datoteka"
+titleDefault = "Deljena datoteka"
+tryAgain = "Pokušajte ponovo kasnije."
+addUser = "Dodaj"
+commenterHint = "Komentarisanje uskoro stiže."
+copied = "Link kopiran u privremenu memoriju"
+copy = "Kopiraj"
+copyFailed = "Kopiranje nije uspelo"
+description = "Kreirajte link za deljenje za ovu datoteku. Prijavljeni korisnici sa linkom mogu da mu pristupe."
+downloadsCount = "Preuzimanja: {{count}}"
+emailWarningBody = "Ovo izgleda kao adresa e-pošte. Ako ova osoba nije već korisnik Stirling PDF-a, neće moći da pristupi datoteci."
+emailWarningConfirm = "Ipak podeli"
+emailWarningTitle = "Adresa e-pošte"
+errorTitle = "Deljenje nije uspelo"
+failure = "Nije moguće generisati link za deljenje. Pokušajte ponovo."
+fileLabel = "Datoteka"
+generate = "Generiši link"
+generated = "Link za deljenje je generisan"
+hideActivity = "Sakrij aktivnost"
+invalidUsername = "Unesite važeće korisni�ko ime ili adresu e-pošte."
+lastAccessed = "Poslednji pristup"
+linkAccessTitle = "Pristup putem linka za deljenje"
+linkLabel = "Link za deljenje"
+linksDisabled = "Linkovi za deljenje su onemogućeni."
+linksDisabledBody = "Linkovi za deljenje su onemogućeni podešavanjima vašeg servera."
+manage = "Upravljaj deljenjem"
+manageDescription = "Kreirajte i upravljajte linkovima za deljenje ove datoteke."
+manageLoadFailed = "Nije moguće u�itati linkove za deljenje."
+manageTitle = "Upravljanje deljenjem"
+noActivity = "Još nema aktivnosti."
+noLinks = "Još nema aktivnih linkova za deljenje."
+noSharedUsers = "Još niko nema pristup."
+removeLink = "Ukloni link"
+removeUser = "Ukloni"
+revokeFailed = "Nije moguće ukloniti link za deljenje."
+revoked = "Link za deljenje uklonjen"
+roleLabel = "Uloga"
+sharingDisabled = "Deljenje je onemogućeno."
+sharingDisabledBody = "Deljenje je onemogućeno podešavanjima vašeg servera."
+sharedUsersTitle = "Korisnici sa kojima je podeljeno"
+title = "Podeli datoteku"
+unknownUser = "Nepoznat korisnik"
+userAddFailed = "Nije moguće podeliti sa tim korisnikom."
+userAdded = "Korisnik je dodat na listu deljenja."
+usernameLabel = "Korisni�ko ime ili e-pošta"
+usernamePlaceholder = "Unesite korisni�ko ime ili e-poštu"
+userRemoveFailed = "Nije moguće ukloniti tog korisnika."
+userRemoved = "Korisnik je uklonjen sa liste deljenja."
+viewActivity = "Prikaži aktivnost"
+viewed = "Pregledano"
+viewsCount = "Pregledi: {{count}}"
+downloaded = "Preuzeto"
+bulkDescription = "Napravite jedan link za deljenje svih izabranih datoteka sa prijavljenim korisnicima."
+bulkTitle = "Podeli izabrane datoteke"
+copyLink = "Kopiraj link za deljenje"
+fileCount = "{{count}} izabranih datoteka"
+ownerOnly = "Samo vlasnik može da upravlja deljenjem."
+selectSingleFile = "Izaberite jednu datoteku da biste upravljali deljenjem."
+
+[storageUpload]
+description = "Ovo otprema trenutnu datoteku na serversko skladište za vaš sopstveni pristup."
+errorTitle = "Otpremanje nije uspelo"
+failure = "Otpremanje nije uspelo. Proverite prijavu i podešavanja skladišta."
+fileLabel = "Datoteka"
+hint = "Javni linkovi i režimi pristupa kontrolišu se podešavanjima vašeg servera."
+success = "Otpremljeno na server"
+title = "Otpremi na server"
+updateButton = "Ažuriraj na serveru"
+uploadButton = "Otpremi na server"
+bulkDescription = "Ovo otprema izabrane datoteke na vaše serversko skladište."
+bulkTitle = "Otpremi izabrane datoteke"
+fileCount = "{{count}} izabranih datoteka"
+more = " +{{count}} još"
+
 [storage]
 approximateSize = "Približna veli�ina"
 fileTooLarge = "Datoteka je prevelika. Maksimalna veli�ina po datoteci je"
@@ -7153,6 +7801,30 @@ title = "Pogledaj/Izmeni PDF"
 [warning]
 tooltipTitle = "Upozorenje"
 
+[wetSignature.tooltip]
+header = "Metode kreiranja potpisa"
+
+[wetSignature.tooltip.draw]
+bullet1 = "Prilagodite boju i debljinu olovke"
+bullet2 = "Brišite i crtajte ponovo dok ne budete zadovoljni"
+bullet3 = "Radi na uređajima na dodir (tableti, telefoni)"
+description = "Napravite rukom pisani potpis pomoću miša ili ekrana osetljivog na dodir. Najbolje za li�ne, autenti�ne potpise."
+title = "Nacrtaj potpis"
+
+[wetSignature.tooltip.type]
+bullet1 = "Izaberite među više fontova"
+bullet2 = "Prilagodite veli�inu i boju teksta"
+bullet3 = "Idealno za standardizovane potpise"
+description = "Generišite potpis iz unetog teksta. Brzo i dosledno, pogodno za poslovna dokumenta."
+title = "Unesi potpis"
+
+[wetSignature.tooltip.upload]
+bullet1 = "Podržava PNG, JPG i druge formate slika"
+bullet2 = "Za najbolje rezultate preporu�uju se providne pozadine"
+bullet3 = "Slika će biti prilagođena veli�ini oblasti potpisa"
+description = "Otpremite unapred napravljenu sliku potpisa. Idealno ako imate skenirani potpis ili logo kompanije."
+title = "Otpremi sliku potpisa"
+
 [watermark]
 completed = "Vodeni žig je dodat"
 desc = "Dodajte tekstualne ili slikovne vodene žigove PDF datotekama"
@@ -7333,6 +8005,7 @@ activeSession = "Aktivna sesija"
 addMembers = "Dodaj �lanove"
 admin = "Admin"
 confirmDelete = "Da li ste sigurni da želite da obrišete ovog korisnika? Ova radnja je nepovratna."
+confirmUnlock = "Da li ste sigurni da želite da otklju�ate ovaj korisni�ki nalog?"
 deleteUser = "Obriši korisnika"
 deleteUserError = "Brisanje korisnika nije uspelo"
 deleteUserSuccess = "Korisnik uspešno obrisan"
@@ -7341,6 +8014,8 @@ disable = "Onemogući"
 disabled = "Onemogućen"
 editRole = "Uredi ulogu"
 enable = "Omogući"
+locked = "zaklju�an"
+lockedBadge = "Zaklju�an"
 loading = "U�itavanje osoba..."
 loginRequired = "Prvo omogućite režim prijave"
 member = "ÄŒlan"
@@ -7350,6 +8025,9 @@ searchMembers = "Pretraži �lanove..."
 status = "Status"
 team = "Tim"
 title = "Osobe"
+unlockAccount = "Otklju�aj nalog"
+unlockUserError = "Nije uspelo otklju�avanje korisni�kog naloga"
+unlockUserSuccess = "Korisni�ki nalog je uspešno otklju�an"
 user = "Korisnik"
 
 [workspace.people.actions]
diff --git a/frontend/public/locales/sv-SE/translation.toml b/frontend/public/locales/sv-SE/translation.toml
index 2490a70f48..5831b683c4 100644
--- a/frontend/public/locales/sv-SE/translation.toml
+++ b/frontend/public/locales/sv-SE/translation.toml
@@ -8,6 +8,7 @@ black = "Svart"
 blue = "Blå"
 bored = "Trött på att vänta?"
 cancel = "Avbryt"
+confirm = "Bekräfta"
 changedCredsMessage = "Inloggningsuppgifter ändrade!"
 chooseFile = "Välj fil"
 close = "Stäng"
@@ -146,6 +147,7 @@ insufficientCredits = "Otillräckliga krediter. Krävs: {{requiredCredits}}, Til
 loadingCredits = "Kontrollerar krediter..."
 loadingProStatus = "Kontrollerar prenumerationsstatus..."
 noticeTopUpOrPlan = "Inte tillräckligt med krediter, fyll på eller uppgradera till ett abonnemang"
+accessInvite = "Bjud in"
 
 [account]
 accountSettings = "Kontoinställningar"
@@ -1427,6 +1429,34 @@ title = "Bearbetning"
 description = "Maximal väntetid för ett bearbetningsjobb innan fel rapporteras."
 label = "Tidsgräns för bearbetning (sekunder)"
 
+[admin.settings.storage]
+description = "Styr serverlagring och delningsalternativ."
+title = "Fillagring och delning"
+
+[admin.settings.storage.enabled]
+description = "Tillåt användare att lagra filer på servern."
+label = "Aktivera fillagring på servern"
+
+[admin.settings.storage.sharing.email]
+description = "Tillåt delning med e-postadresser."
+label = "Aktivera delning via e-post"
+mailLink = "Konfigurera e-postinställningar"
+mailNote = "Kräver e-postkonfiguration. "
+
+[admin.settings.storage.sharing.enabled]
+description = "Tillåt användare att dela lagrade filer."
+label = "Aktivera delning"
+
+[admin.settings.storage.sharing.links]
+description = "Tillåt delning via länkar som kräver inloggning."
+frontendUrlLink = "Konfigurera i systeminställningar"
+frontendUrlNote = "Kräver en Frontend URL. "
+label = "Aktivera delningslänkar"
+
+[admin.settings.storage.signing.enabled]
+description = "Tillåt användare att skapa signeringssessioner med flera deltagare. Kräver att fillagring på servern är aktiverad."
+label = "Aktivera gruppsignering (Alpha)"
+
 [admin.settings.unsavedChanges]
 cancel = "Fortsätt redigera"
 discard = "Förkasta ändringar"
@@ -2059,7 +2089,19 @@ numbers = "Tal/intervall: 5, 10-20"
 progressions = "Progressioner: 3n, 4n+1"
 
 [certSign]
+allSigned = "Alla deltagare har signerat. Klart att slutföra."
+awaitingSignatures = "Väntar på signaturer"
+signatureProgress = "{{signedCount}}/{{totalCount}} signaturer"
 chooseCertificate = "Välj certifikatfil"
+declined = "Avböjt"
+fetchFailed = "Det gick inte att läsa in signeringsdata"
+finalized = "Slutförd"
+notified = "Väntar"
+partialNote = "Du kan slutföra i förtid med nuvarande signaturer. Osignerade deltagare utesluts."
+pending = "Väntar"
+readyToFinalize = "Klart att slutföra"
+signed = "Signerad"
+viewed = "Visad"
 chooseJksFile = "Välj JKS-fil"
 chooseP12File = "Välj PKCS12-fil"
 choosePfxFile = "Välj PFX-fil"
@@ -2082,6 +2124,7 @@ title = "Certifikatsignering"
 invisible = "Osynlig"
 stepTitle = "Signaturutseende"
 visible = "Synlig"
+visibility = "Synlighet"
 
 [certSign.appearance.options]
 title = "Signaturdetaljer"
@@ -2188,6 +2231,252 @@ bullet4 = "Kan använda anpassade certifikat för verifiering"
 text = "När du kontrollerar signaturer berättar verktyget om de är giltiga, vem som undertecknat dokumentet, när det signerades och om dokumentet har ändrats efter signering."
 title = "Kontrollerar signaturer"
 
+[certSign.collab.finalize]
+button = "Slutför och ladda signerad PDF"
+early = "Slutför med nuvarande signaturer"
+
+[certSign.collab.sessionDetail]
+addButton = "Lägg till deltagare"
+addParticipants = "Lägg till deltagare"
+addParticipantsError = "Det gick inte att lägga till deltagare"
+backToList = "Tillbaka till sessioner"
+deleteConfirm = "Är du säker? Detta kan inte ångras."
+deleteError = "Det gick inte att ta bort sessionen"
+deleted = "Session borttagen"
+deleteSession = "Ta bort session"
+dueDate = "Sista datum"
+finalizeError = "Det gick inte att slutföra sessionen"
+loadPdfError = "Det gick inte att läsa in signerad PDF"
+loadSignedPdf = "Ladda in signerad PDF i aktiva filer"
+messageLabel = "Meddelande"
+noAdditionalInfo = "Ingen ytterligare information"
+owner = "Ägare"
+participantRemoved = "Deltagare borttagen"
+participants = "Deltagare"
+participantsAdded = "Deltagare har lagts till"
+removeParticipant = "Ta bort"
+removeParticipantError = "Det gick inte att ta bort deltagare"
+selectUsers = "Välj användare..."
+sessionInfo = "Sessionsinfo"
+workbenchTitle = "Sessionshantering"
+
+[certSign.collab.signRequest]
+addedToFiles = "Dokument tillagt i aktiva filer"
+addSignature = "Lägg till din signatur"
+addToFiles = "Lägg till i aktiva filer"
+advancedSettings = "Avancerade inställningar"
+backToList = "Tillbaka till signeringsförfrågningar"
+certificateChoice = "Välj ett certifikat att signera med"
+changeSignature = "Ändra signatur"
+clearSignature = "Rensa signatur"
+completeAndSign = "Slutför och signera"
+createNewSignature = "Skapa ny signatur"
+declineButton = "Avböj"
+decline = "Avböj förfrågan"
+deleteSelected = "Ta bort vald signatur"
+drawSignature = "Rita din signatur nedan"
+dueDate = "Sista datum"
+fileTooLarge = "Filstorleken måste vara under 5 MB"
+fontFamily = "Typsnittsfamilj"
+fontSize = "Teckenstorlek: {{size}}px"
+fontSizePlaceholder = "Storlek"
+from = "Från"
+invalidCertFile = "Välj en P12- eller PFX-certifikatfil"
+invalidFileType = "Välj en bildfil"
+location = "Plats (valfritt)"
+locationPlaceholder = "Var signerar du från?"
+message = "Meddelande"
+noCertificate = "Välj en certifikatfil"
+noSignatures = "Placera minst en signatur på PDF:en"
+p12File = "P12/PFX-certifikatfil"
+password = "Certifikatlösenord"
+passwordPlaceholder = "Ange lösenord..."
+penColor = "Pennfärg"
+penSize = "Pennstorlek: {{size}}px"
+placementActive = "Klicka på PDF:en för att placera"
+placeSignatureButton = "Placera signatur på PDF:en"
+reason = "Orsak (valfritt)"
+reasonPlaceholder = "Varför signerar du?"
+removeImage = "Ta bort bild"
+removeCertFile = "Ta bort fil"
+savedSignatures = "Sparade signaturer"
+selectFile = "Välj bildfil"
+selectSignatureTitle = "Välj eller skapa signatur"
+signButton = "Signera dokument"
+signatureInfo = "Dessa inställningar konfigureras av dokumentägaren"
+signaturePlaced = "Signatur placerad på sidan"
+signatureSettings = "Signaturinställningar"
+signatureText = "Signaturtext"
+signatureTextPlaceholder = "Ange ditt namn..."
+signatureTypeLabel = "Signaturtyp"
+signingTitle = "Signering"
+textColor = "Textfärg"
+typeSignature = "Skriv ditt namn för att skapa en signatur"
+uploadCert = "Eget certifikat"
+uploadCertDesc = "Använd ditt eget P12/PFX-certifikat"
+uploadSignature = "Ladda upp din signaturbild"
+usePersonalCert = "Personligt certifikat"
+usePersonalCertDesc = "Skapas automatiskt för ditt konto"
+useServerCert = "Organisationscertifikat"
+useServerCertDesc = "Delat organisationscertifikat"
+workbenchTitle = "Signeringsförfrågan"
+
+[certSign.collab.signRequest.canvas]
+colorPickerTitle = "Välj linjefärg"
+continue = "Fortsätt"
+
+[certSign.collab.signRequest.certModal]
+description = "Du har placerat {{count}} signatur(er). Välj ditt certifikat för att slutföra signeringen."
+sign = "Signera dokument"
+certValidating = "Validerar certifikat..."
+certValidUntil = "Certifikatet giltigt till {{date}}"
+certInvalid = "Ogiltigt certifikat: {{error}}"
+certInvalidFallback = "Ogiltigt certifikat"
+certNetworkError = "Kunde inte validera certifikat"
+title = "Konfigurera certifikat"
+
+[certSign.collab.signRequest.image]
+hint = "Ladda upp en PNG- eller JPG-bild av din signatur"
+
+[certSign.collab.signRequest.mode]
+move = "Flytta signatur"
+place = "Placera signatur"
+title = "Läge för signering eller flytt"
+
+[certSign.collab.signRequest.modeTabs]
+draw = "Rita"
+image = "Ladda upp"
+text = "Skriv"
+
+[certSign.collab.signRequest.placeSignature]
+message = "Klicka på PDF:en för att placera din signatur"
+title = "Placera signatur"
+
+[certSign.collab.signRequest.preview]
+imageAlt = "Vald signatur"
+missing = "Ingen förhandsvisning"
+textFallback = "Signatur"
+
+[certSign.collab.signRequest.saved]
+defaultCanvasLabel = "Ritad signatur"
+defaultImageLabel = "Uppladdad signatur"
+defaultLabel = "Signatur"
+defaultTextLabel = "Skriven signatur"
+delete = "Ta bort signatur"
+none = "Inga sparade signaturer"
+
+[certSign.collab.signRequest.signatureType]
+draw = "Rita"
+type = "Skriv"
+upload = "Ladda upp"
+
+[certSign.collab.signRequest.steps]
+back = "Tillbaka"
+cancelPlacement = "Avbryt placering"
+certificate = "Certifikat"
+clickMultipleTimes = "Klicka på PDF:en flera gånger för att placera signaturer. Dra en signatur för att flytta eller ändra storlek."
+clickToPlace = "Klicka på PDF:en där du vill att din signatur ska visas."
+continue = "Fortsätt till certifikatval"
+continueToPlacement = "Fortsätt till placering"
+continueToReview = "Fortsätt till granskning"
+createSignature = "Skapa signatur"
+invisible = "Osynlig"
+location = "Plats:"
+multipleSignatures = "{{count}} signaturer kommer att tillämpas på PDF:en"
+oneSignature = "1 signatur kommer att tillämpas på PDF:en"
+placeOnPdf = "Placera på PDF:en"
+reason = "Orsak:"
+reviewTitle = "Granska före signering"
+signaturePlaced = "Signatur placerad på sidan {{page}}. Du kan justera positionen genom att klicka igen eller fortsätta till granskning."
+visible = "Synlig"
+visibility = "Synlighet:"
+yourSignatures = "Dina signaturer ({{count}})"
+
+[certSign.collab.signRequest.text]
+colorLabel = "Färg"
+fontLabel = "Typsnitt"
+fontSizeLabel = "Storlek"
+fontSizePlaceholder = "16"
+label = "Signaturtext"
+modalHint = "Ange ditt namn och klicka sedan på Fortsätt för att placera det på PDF:en."
+placeholder = "Ange ditt namn..."
+
+[certSign.collab.participant]
+certValidating = "Validerar certifikat..."
+certValid = "✓ Giltigt certifikat"
+certValidUntil = " till {{date}}"
+certInvalid = "✗ {{error}}"
+certInvalidFallback = "Ogiltigt certifikat"
+certNetworkError = "Kunde inte validera certifikat"
+
+[certSign.collab.addParticipants]
+add = "Lägg till {{count}} deltagare"
+back = "Tillbaka"
+configureSignatures = "Konfigurera signaturinställningar"
+continue = "Fortsätt till signaturinställningar"
+reasonHelp = "Förinställ en signeringsorsak för dessa deltagare (valfritt, de kan åsidosätta vid signering)"
+reasonPlaceholder = "t.ex. Godkännande, Granskning..."
+selectUsers = "Välj användare"
+
+[certSign.collab.sessionCreation]
+includeSummaryPage = "Inkludera sammanfattningssida för signaturer"
+includeSummaryPageHelp = "En sammanfattningssida läggs till sist med all signaturmetadata. De digitala certifikatsignaturrutorna på enskilda sidor undertrycks (handskrivna signaturer påverkas inte)."
+
+[certSign.collab.sessionList]
+active = "Aktiva"
+finalized = "Slutförda"
+
+[certSign.collab.signatureSettings]
+description = "Konfigurera hur signaturer ska visas för alla deltagare"
+title = "Signaturutseende"
+
+[certSign.collab.userSelector]
+inviteUsers = "Lägg till användare"
+loadError = "Det gick inte att läsa in användare"
+noTeam = "Inget team"
+noUsers = "Inga andra användare hittades."
+placeholder = "Välj användare..."
+
+[certSign.mobile]
+panelActions = "Åtgärder"
+panelDocument = "Dokument"
+panelPeople = "Personer"
+
+[certSign.sessions]
+deleted = "Session borttagen"
+fetchFailed = "Det gick inte att läsa in sessionsdetaljer"
+finalized = "Session slutförd"
+loaded = "Signerad PDF inläst"
+pdfNotReady = "PDF inte klar"
+pdfNotReadyDesc = "Den signerade PDF:en genereras. Försök igen om en stund."
+
+[certificateChoice.tooltip]
+header = "Certifikattyper"
+
+[certificateChoice.tooltip.organization]
+bullet1 = "Hanteras av systemadministratörer"
+bullet2 = "Delas mellan auktoriserade användare"
+bullet3 = "Representerar företagets identitet, inte individen"
+bullet4 = "Bäst för: Officiella dokument, teamsignaturer"
+description = "Ett delat certifikat tillhandahållet av din organisation. Används för företagets signeringsbehörighet."
+title = "Organisationscertifikat"
+
+[certificateChoice.tooltip.personal]
+bullet1 = "Genereras automatiskt vid första användning"
+bullet2 = "Kopplat till ditt användarkonto"
+bullet3 = "Kan inte delas med andra användare"
+bullet4 = "Bäst för: Personliga dokument, individuellt ansvar"
+description = "Ett automatiskt genererat certifikat unikt för ditt användarkonto. Lämpligt för individuella signaturer."
+title = "Personligt certifikat"
+
+[certificateChoice.tooltip.upload]
+bullet1 = "Kräver P12/PFX-fil och lösenord"
+bullet2 = "Kan utfärdas av externa certifikatutfärdare"
+bullet3 = "Högre tillitsnivå för juridiska dokument"
+bullet4 = "Bäst för: Juridiskt bindande avtal, extern validering"
+description = "Använd din egen PKCS#12-certifikatfil. Ger full kontroll över certifikategenskaper."
+title = "Ladda upp eget P12"
+
 [changeCreds]
 changePassword = "Du använder standardinloggningsuppgifter. Vänligen ange ett nytt lösenord"
 changeUsername = "Uppdatera ditt användarnamn. Du loggas ut efter uppdateringen."
@@ -3242,6 +3531,46 @@ totalSelected = "Totalt markerade"
 unsupported = "Stöds inte"
 unzip = "Packa upp"
 uploadError = "Det gick inte att ladda upp vissa filer."
+copyCreated = "Kopia sparad på den här enheten."
+copyFailed = "Kunde inte skapa en kopia."
+leaveShare = "Ta bort från min lista"
+leaveShareFailed = "Kunde inte ta bort den delade filen."
+leaveShareSuccess = "Borttagen från din delningslista."
+removeBoth = "Ta bort från båda"
+removeFilePrompt = "Den här filen är sparad på den här enheten och på din server. Var vill du ta bort den?"
+removeFileTitle = "Ta bort fil"
+removeLocalOnly = "Endast den här enheten"
+removeServerFailed = "Kunde inte ta bort filen från servern."
+removeServerOnly = "Endast servern"
+removeServerOnlyPrompt = "Den här filen lagras endast på din server. Vill du ta bort den från servern?"
+removeServerSuccess = "Borttagen från servern."
+removeSharedPrompt = "Den här filen är delad med dig. Du kan ta bort den från den här enheten eller din delningslista."
+removeSharedServerOnlyBlockedPrompt = "Den här filen är delad med dig och lagras endast på servern."
+removeSharedServerOnlyPrompt = "Den här filen är delad med dig och lagras endast på servern. Ta bort den från din lista?"
+changesNotUploaded = "Ändringar inte uppladdade"
+cloudFile = "Molnfil"
+filterAll = "Alla"
+filterLocal = "Lokalt"
+filterSharedByMe = "Delad av mig"
+filterSharedWithMe = "Delad med mig"
+lastSynced = "Senast synkroniserad"
+localOnly = "Endast lokalt"
+makeCopy = "Skapa en kopia"
+owner = "Ägare"
+ownerUnknown = "Okänd"
+share = "Dela"
+shareSelected = "Dela valda"
+sharedByYou = "Delad av dig"
+sharedEditNoticeBody = "Du har inte redigeringsrättigheter till serverversionen av den här filen. Alla ändringar du gör sparas som en lokal kopia."
+sharedEditNoticeConfirm = "Jag förstår"
+sharedEditNoticeTitle = "Skrivskyddad serverkopia"
+sharedWithYou = "Delad med dig"
+sharing = "Delning"
+storageState = "Lagring"
+synced = "Synkroniserad"
+updateOnServer = "Uppdatera på servern"
+uploadSelected = "Ladda upp valda"
+uploadToServer = "Ladda upp till servern"
 
 [files]
 addFiles = "Lägg till filer"
@@ -3367,6 +3696,77 @@ title = "Om att platta ut PDF:er"
 discord = "Discord"
 issues = "GitHub"
 
+[groupSigning.tooltip]
+header = "Om gruppsignering"
+
+[groupSigning.tooltip.finalization]
+bullet1 = "Alla signaturer tillämpas i den deltagarordning du angav"
+bullet2 = "Du kan slutföra med ofullständiga signaturer vid behov"
+bullet3 = "När den väl är slutförd kan sessionen inte ändras"
+description = "När alla deltagare har signerat (eller om du väljer att slutföra i förtid) kan du generera den slutliga signerade PDF:en."
+title = "Slutförandeprocess"
+
+[groupSigning.tooltip.roles]
+bullet1 = "Ägare (du): Skapar session, konfigurerar signaturstandarder, slutför dokumentet"
+bullet2 = "Deltagare: Skapar sin signatur, väljer certifikat, placerar på PDF:en"
+bullet3 = "Deltagare kan inte ändra inställningar för signatursynlighet, orsak eller plats"
+description = "Du styr inställningarna för signaturutseende för alla deltagare."
+title = "Deltagarroller"
+
+[groupSigning.tooltip.sequential]
+bullet1 = "Första deltagaren måste signera innan den andra kan få åtkomst till dokumentet"
+bullet2 = "Säkerställer korrekt signeringsordning för regelefterlevnad"
+bullet3 = "Du kan ändra ordningen genom att dra deltagare i listan"
+description = "Deltagarna signerar dokument i den ordning du anger. Varje undertecknare får en avisering när det är deras tur."
+title = "Sekventiell signering"
+
+[groupSigning.steps]
+back = "Tillbaka"
+completed = "Slutfört"
+current = "Aktuell"
+stepLabel = "Steg {{number}}"
+
+[groupSigning.steps.configureDefaults]
+continue = "Fortsätt till granskning"
+invisible = "Signaturer kommer att vara osynliga (endast metadata)"
+locationLabel = "Plats:"
+preview = "Förhandsvisa"
+reasonLabel = "Orsak:"
+title = "Konfigurera signaturinställningar"
+visible = "Signaturer kommer att vara synliga på sidan {{page}}"
+
+[groupSigning.steps.review]
+document = "Dokument"
+dueDate = "Sista datum (valfritt)"
+dueDatePlaceholder = "Välj sista datum..."
+invisible = "Osynlig (endast metadata)"
+location = "Plats:"
+logo = "Logotyp:"
+logoHidden = "Ingen logotyp"
+logoShown = "Stirling PDF-logotyp visas"
+participants = "Deltagare"
+reason = "Orsak:"
+send = "Skicka signeringsförfrågningar"
+signatureSettings = "Signaturinställningar"
+title = "Granska sessionsdetaljer"
+titleShort = "Granska och skicka"
+visibility = "Synlighet:"
+visible = "Synlig på sidan {{page}}"
+participantCount = "{{count}} deltagare kommer att signera i ordning"
+
+[groupSigning.steps.selectDocument]
+continue = "Fortsätt till deltagarval"
+noFile = "Välj en enda PDF-fil från dina aktiva filer för att skapa en signeringssession."
+selectedFile = "Valt dokument"
+title = "Välj dokument"
+
+[groupSigning.steps.selectParticipants]
+continue = "Fortsätt till signaturinställningar"
+count = "{{count}} deltagare valda"
+label = "Välj deltagare"
+placeholder = "Välj deltagare som ska signera..."
+title = "Välj deltagare"
+
 [getPdfInfo]
 downloadJson = "Ladda ner JSON"
 downloads = "Nedladdningar"
@@ -4460,7 +4860,10 @@ zoomOut = "Zooma ut"
 
 [viewer]
 cannotPreviewFile = "Kan inte förhandsgranska filen"
+disableColorFilter = "Inaktivera färgfilter"
 dualPageView = "Dubbelsidig vy"
+enableDarkFilter = "Aktivera mörkt filter"
+enableSepiaFilter = "Aktivera sepiafilter"
 firstPage = "Första sidan"
 lastPage = "Sista sidan"
 nextPage = "Nästa sida"
@@ -4470,6 +4873,22 @@ singlePageView = "Ensidig vy"
 unknownFile = "Okänd fil"
 zoomIn = "Zooma in"
 zoomOut = "Zooma ut"
+resetZoom = "Återställ zoom"
+
+[viewer.nonPdf]
+fileTypeBadge = "{{type}}-fil"
+convertToPdf = "Konvertera till PDF"
+loading = "Läser in..."
+emptyFile = "Tom fil"
+csvStats = "{{rows}} rader · {{columns}} kolumner · {{size}}"
+sortedBy = "Sorterad efter: {{column}}"
+columnDefault = "Kolumn {{index}}"
+htmlPreviewWarning = "HTML-förhandsvisning — externa resurser kanske inte läses in · {{size}}"
+htmlPreview = "HTML-förhandsvisning"
+invalidJson = "Ogiltig JSON — visar rått innehåll"
+textStats = "{{lines}} rader · {{size}}"
+lineNumbers = "Radnummer"
+renderMarkdown = "Rendera markdown"
 
 [viewer.attachments]
 title = "Bilagor"
@@ -4531,6 +4950,7 @@ toggleAttachments = "Visa/dölj bilagor"
 toggleTheme = "Växla tema"
 language = "Språk"
 toggleAnnotations = "Växla synlighet för anteckningar"
+toggleLayers = "Växla lager"
 search = "Sök i PDF"
 panMode = "Panoreringsläge"
 applyRedactionsFirst = "Tillämpa maskningar först"
@@ -5407,20 +5827,72 @@ title = "Skriv ut fil"
 2 = "Ange skrivarnamn"
 
 [quickAccess]
+access = "Ã…tkomst"
+accessAddPerson = "Lägg till ytterligare en person"
+accessBack = "Tillbaka"
+accessCopyLink = "Kopiera länk"
+accessEmail = "E-postadress"
+accessEmailPlaceholder = "name@company.com"
+accessFileLabel = "Fil"
+accessGeneral = "Allmän åtkomst"
+accessInviteTitle = "Bjud in personer"
+accessOwner = "Ägare"
+accessPanel = "Dokumentåtkomst"
+accessPeople = "Personer med åtkomst"
+accessRemove = "Ta bort"
+accessRestricted = "Begränsad"
+accessRestrictedHint = "Endast personer med åtkomst kan öppna"
+accessRole = "Roll"
+accessRoleCommenter = "Kommentator"
+accessRoleEditor = "Redigerare"
+accessRoleViewer = "Läsare"
+accessSelectedFile = "Vald fil"
+accessSendInvite = "Skicka inbjudan"
+accessTitle = "Dokumentåtkomst"
+accessYou = "Du"
 account = "Konto"
+activeSessions = "Aktiva sessioner"
+activeTab = "Aktiva"
 activity = "Aktivitet"
 adminSettings = "Admin inst."
+allSessions = "Alla sessioner"
 allTools = "All Tools"
 automate = "Automatisera"
+back = "Tillbaka"
+certSign = "Certifikatsignering"
+completedSessions = "Slutförda sessioner"
+completedTab = "Slutförda"
 config = "Konfig"
+createNew = "Skapa ny förfrågan"
+createSession = "Skapa signeringsförfrågan"
+dueDate = "Sista datum (valfritt)"
 files = "Filer"
 help = "Hjälp"
+noActiveSessions = "Inga väntande signeringsförfrågningar eller aktiva sessioner"
+noCompletedSessions = "Inga slutförda sessioner"
+noFile = "Ingen fil vald"
 read = "Läs"
 reader = "Läsare"
+refresh = "Uppdatera"
+requestSignatures = "Begär signaturer"
+selectSingleFileToRequest = "Välj en enda PDF-fil för att begära signaturer"
+selectedFile = "Vald fil"
+selectUsers = "Välj användare som ska signera"
+selectUsersPlaceholder = "Välj deltagare..."
+sendingRequest = "Skickar..."
 settings = "Inst."
 showMeAround = "Visa mig runt"
 sign = "Signera"
+signatureRequests = "Signeringsförfrågningar"
+signYourself = "Signera själv"
+newRequest = "Ny förfrågan"
 tours = "Guider"
+wetSign = "Lägg till signatur"
+filterMine = "Mina"
+filterOverdue = "Försenade"
+filterSigned = "Signerade"
+filterDeclined = "Avböjda"
+searchDocuments = "Sök dokument…"
 
 [quickAccess.helpMenu]
 adminTour = "Adminrundtur"
@@ -6050,11 +6522,75 @@ toolNotAvailableLocally = "Din Stirling-PDF-server är offline och \"{{endpoint}
 expired = "Din session har löpt ut. Uppdatera sidan och försök igen."
 refreshPage = "Uppdatera sida"
 
+[sessionManagement.tooltip]
+header = "Hantera signeringssessioner"
+
+[sessionManagement.tooltip.addParticipants]
+bullet1 = "Nya deltagare läggs till sist i signeringsordningen"
+bullet2 = "Deltagare kan inte läggas till efter att sessionen har slutförts"
+bullet3 = "Varje deltagare får en avisering när det är deras tur"
+description = "Du kan lägga till fler deltagare i en aktiv session när som helst före slutförandet."
+title = "Lägga till deltagare"
+
+[sessionManagement.tooltip.finalization]
+bullet1 = "<b>Fullständig slutföring</b>: Alla deltagare har signerat"
+bullet2 = "<b>Delvis slutföring</b>: Vissa deltagare har inte signerat ännu"
+bullet3 = "Osignerade deltagare utesluts från det slutliga dokumentet"
+bullet4 = "När den är slutförd kan du ladda in den signerade PDF:en i aktiva filer"
+description = "Slutförande kombinerar alla signaturer till en enda signerad PDF. Denna åtgärd kan inte ångras."
+title = "Slutförande av session"
+
+[sessionManagement.tooltip.participantRemoval]
+bullet1 = "Deltagare som redan har signerat kan inte tas bort"
+bullet2 = "Borttagna deltagare får inte längre aviseringar"
+bullet3 = "Signeringsordningen justeras automatiskt"
+description = "Deltagare kan tas bort från sessioner innan de signerar."
+title = "Ta bort deltagare"
+
+[sessionManagement.tooltip.signatureOrder]
+bullet1 = "Varje signatur tillämpas sekventiellt på PDF:en"
+bullet2 = "Senare undertecknare kan se tidigare signaturer"
+bullet3 = "Kritiskt för godkännandeprocesser och juridisk spårbarhet"
+description = "Den ordning du anger när du skapar sessionen avgör vem som signerar först."
+title = "Signeringsordning"
+
+[signatureSettings.tooltip]
+header = "Inställningar för signaturutseende"
+
+[signatureSettings.tooltip.location]
+bullet1 = "Exempel: \"New York, USA\", \"London Office\", \"Remote\""
+bullet2 = "Inte samma som sidposition"
+bullet3 = "Kan krävas i vissa rättsliga jurisdiktioner"
+description = "Valfri geografisk plats där signaturen tillämpades. Lagradas i certifikatets metadata."
+title = "Signaturplats"
+
+[signatureSettings.tooltip.logo]
+bullet1 = "Visas tillsammans med signatur och text"
+bullet2 = "Stöder formaten PNG, JPG"
+bullet3 = "Förbättrar professionellt utseende"
+description = "Lägg till en företagslogotyp i synliga signaturer för varumärke och äkthet."
+title = "Företagslogotyp"
+
+[signatureSettings.tooltip.reason]
+bullet1 = "Exempel: \"Godkännande\", \"Kontraktsavtal\", \"Granskning slutförd\""
+bullet2 = "Synlig i PDF:ens signatur-egenskaper"
+bullet3 = "Användbart för granskningsspår och regelefterlevnad"
+description = "Valfri text som förklarar varför dokumentet signeras. Lagradas i certifikatets metadata."
+title = "Signeringsorsak"
+
+[signatureSettings.tooltip.visibility]
+bullet1 = "<b>Synlig</b>: Signaturen visas på PDF:en med anpassat utseende"
+bullet2 = "<b>Osynlig</b>: Certifikat bäddas in utan visuellt märke"
+bullet3 = "Osynliga signaturer ger fortfarande kryptografisk validering"
+description = "Styr om signaturen är synlig i dokumentet eller bäddas in osynligt."
+title = "Signaturens synlighet"
+
 [settings.configuration]
 advanced = "Avancerat"
 database = "Databas"
 endpoints = "Slutpunkter"
 features = "Funktioner"
+storageSharing = "Fillagring och delning"
 systemSettings = "Systeminställningar"
 title = "Konfiguration"
 
@@ -6332,10 +6868,13 @@ title = "Logga in på Stirling"
 [setup.selfhosted]
 link = "eller anslut till ett självhostat konto"
 subtitle = "Ange dina serveruppgifter"
+changeServerLocked = "Din organisation har begränsat den här appen till en specifik server"
 switchToLocal = "Använd lokala verktyg i stället"
 title = "Logga in på server"
 
 [setup.selfhosted.unreachable]
+changeServer = "Anslut till en annan server"
+changeServerLocked = "Din organisation har begränsat den här appen till en specifik server"
 continueOffline = "Använd lokala verktyg i stället"
 message = "Kunde inte nå {{url}}. Kontrollera att servern körs och är tillgänglig."
 retry = "Försök igen"
@@ -6529,6 +7068,15 @@ saved = "Sparad"
 text = "Text"
 title = "Signaturtyp"
 
+[signRequest]
+declined = "Signeringsförfrågan avböjdes"
+fetchFailed = "Det gick inte att läsa in signeringsförfrågan"
+signed = "Dokumentet signerades"
+
+[signSession]
+createFailed = "Det gick inte att skapa signeringsförfrågan"
+created = "Signeringsförfrågan skickad"
+
 [signup]
 accountCreatedSuccessfully = "Kontot har skapats! Du kan nu logga in."
 alreadyHaveAccount = "Har du redan ett konto? Logga in"
@@ -6807,6 +7355,106 @@ title = "Dela upp PDF efter kapitel"
 [splitPdfByChapters]
 tags = "dela,kapitel,bokmärken,organisera"
 
+[storageShare]
+accessed = "Ã…tkomst"
+accessDenied = "Du har inte åtkomst till den här delade filen. Be ägaren dela den med dig."
+accessFailed = "Det går inte att läsa in aktivitet."
+accessDeniedBody = "Du har inte åtkomst till den här filen. Be ägaren dela den med dig."
+accessDeniedTitle = "Ingen åtkomst"
+accessLimitedCommenter = "Kommentaråtkomst kommer snart. Be ägaren om redigeraråtkomst om du behöver ladda ned."
+accessLimitedTitle = "Begränsad åtkomst"
+accessLimitedViewer = "Den här länken är endast för visning. Be ägaren om redigeraråtkomst om du behöver ladda ned."
+createdAt = "Skapad"
+download = "Ladda ned"
+downloadFailed = "Det går inte att ladda ned den här filen."
+expiredBody = "Den här delningslänken är ogiltig eller har löpt ut."
+expiredTitle = "Länken har löpt ut"
+goToLogin = "GÃ¥ till inloggningen"
+loadFailed = "Det går inte att öppna den delade filen."
+loading = "Läser in delningslänk..."
+loginPrompt = "Logga in för att få åtkomst till den här delade filen."
+loginRequired = "Inloggning krävs"
+openInApp = "Öppna i Stirling PDF"
+ownerLabel = "Ägare"
+ownerUnknown = "Okänd"
+requiresLogin = "Den här delade filen kräver inloggning."
+roleCommenter = "Kommentator"
+roleEditor = "Redigerare"
+roleViewer = "Läsare"
+shareHeading = "Delad fil"
+titleDefault = "Delad fil"
+tryAgain = "Försök igen senare."
+addUser = "Lägg till"
+commenterHint = "Kommentering kommer snart."
+copied = "Länk kopierad till urklipp"
+copy = "Kopiera"
+copyFailed = "Kopiering misslyckades"
+description = "Skapa en delningslänk för den här filen. Inloggade användare med länken kan få åtkomst till den."
+downloadsCount = "Nedladdningar: {{count}}"
+emailWarningBody = "Detta ser ut som en e-postadress. Om den här personen inte redan är Stirling PDF-användare kommer de inte att kunna få åtkomst till filen."
+emailWarningConfirm = "Dela ändå"
+emailWarningTitle = "E-postadress"
+errorTitle = "Delning misslyckades"
+failure = "Det gick inte att skapa en delningslänk. Försök igen."
+fileLabel = "Fil"
+generate = "Generera länk"
+generated = "Delningslänk skapad"
+hideActivity = "Dölj aktivitet"
+invalidUsername = "Ange ett giltigt användarnamn eller e-postadress."
+lastAccessed = "Senast åtkommet"
+linkAccessTitle = "Åtkomst via delningslänk"
+linkLabel = "Delningslänk"
+linksDisabled = "Delningslänkar är inaktiverade."
+linksDisabledBody = "Delningslänkar är inaktiverade i dina serverinställningar."
+manage = "Hantera delning"
+manageDescription = "Skapa och hantera länkar för att dela den här filen."
+manageLoadFailed = "Det går inte att läsa in delningslänkar."
+manageTitle = "Hantera delning"
+noActivity = "Ingen aktivitet ännu."
+noLinks = "Inga aktiva delningslänkar ännu."
+noSharedUsers = "Inga användare har åtkomst ännu."
+removeLink = "Ta bort länk"
+removeUser = "Ta bort"
+revokeFailed = "Det går inte att ta bort delningslänken."
+revoked = "Delningslänk borttagen"
+roleLabel = "Roll"
+sharingDisabled = "Delning är inaktiverad."
+sharingDisabledBody = "Delning har inaktiverats av dina serverinställningar."
+sharedUsersTitle = "Delade användare"
+title = "Dela fil"
+unknownUser = "Okänd användare"
+userAddFailed = "Det går inte att dela med den användaren."
+userAdded = "Användare tillagd i delningslistan."
+usernameLabel = "Användarnamn eller e-post"
+usernamePlaceholder = "Ange ett användarnamn eller e-post"
+userRemoveFailed = "Det går inte att ta bort den användaren."
+userRemoved = "Användare borttagen från delningslistan."
+viewActivity = "Visa aktivitet"
+viewed = "Visad"
+viewsCount = "Visningar: {{count}}"
+downloaded = "Nedladdad"
+bulkDescription = "Skapa en länk för att dela alla markerade filer med inloggade användare."
+bulkTitle = "Dela markerade filer"
+copyLink = "Kopiera delningslänk"
+fileCount = "{{count}} filer markerade"
+ownerOnly = "Endast ägaren kan hantera delning."
+selectSingleFile = "Välj en enskild fil för att hantera delning."
+
+[storageUpload]
+description = "Detta laddar upp den aktuella filen till serverlagring för din egen åtkomst."
+errorTitle = "Uppladdning misslyckades"
+failure = "Uppladdning misslyckades. Kontrollera din inloggning och dina lagringsinställningar."
+fileLabel = "Fil"
+hint = "Offentliga länkar och åtkomstlägen styrs av dina serverinställningar."
+success = "Uppladdad till server"
+title = "Ladda upp till server"
+updateButton = "Uppdatera på servern"
+uploadButton = "Ladda upp till server"
+bulkDescription = "Detta laddar upp de markerade filerna till din serverlagring."
+bulkTitle = "Ladda upp markerade filer"
+fileCount = "{{count}} filer markerade"
+more = " +{{count}} till"
+
 [storage]
 approximateSize = "Ungefärlig storlek"
 fileTooLarge = "Filen är för stor. Maximal storlek per fil är"
@@ -7153,6 +7801,30 @@ title = "Visa/redigera PDF"
 [warning]
 tooltipTitle = "Varning"
 
+[wetSignature.tooltip]
+header = "Metoder för signaturskapande"
+
+[wetSignature.tooltip.draw]
+bullet1 = "Anpassa pennfärg och tjocklek"
+bullet2 = "Rensa och rita om tills du är nöjd"
+bullet3 = "Fungerar på pekskärmsenheter (surfplattor, telefoner)"
+description = "Skapa en handskriven signatur med musen eller pekskärmen. Bäst för personliga, autentiska signaturer."
+title = "Rita signatur"
+
+[wetSignature.tooltip.type]
+bullet1 = "Välj mellan flera typsnitt"
+bullet2 = "Anpassa textstorlek och färg"
+bullet3 = "Perfekt för standardiserade signaturer"
+description = "Skapa en signatur från skriven text. Snabb och konsekvent, lämplig för affärsdokument."
+title = "Skriv signatur"
+
+[wetSignature.tooltip.upload]
+bullet1 = "Stöder PNG, JPG och andra bildformat"
+bullet2 = "Genomskinliga bakgrunder rekommenderas för bästa resultat"
+bullet3 = "Bilden kommer att skalas för att passa signaturområdet"
+description = "Ladda upp en i förväg skapad signaturbild. Idealiskt om du har en skannad signatur eller företagslogotyp."
+title = "Ladda upp signaturbild"
+
 [watermark]
 completed = "Vattenstämpel tillagd"
 desc = "Lägg till text- eller bildvattenstämplar i PDF‑filer"
@@ -7333,6 +8005,7 @@ activeSession = "Aktiv session"
 addMembers = "Lägg till medlemmar"
 admin = "Admin"
 confirmDelete = "Är du säker på att du vill ta bort denna användare? Detta kan inte ångras."
+confirmUnlock = "Är du säker på att du vill låsa upp detta användarkonto?"
 deleteUser = "Ta bort användare"
 deleteUserError = "Misslyckades med att ta bort användare"
 deleteUserSuccess = "Användare borttagen"
@@ -7341,6 +8014,8 @@ disable = "Inaktivera"
 disabled = "Inaktiverad"
 editRole = "Redigera roll"
 enable = "Aktivera"
+locked = "låst"
+lockedBadge = "LÃ¥st"
 loading = "Laddar personer..."
 loginRequired = "Aktivera inloggningsläge först"
 member = "Medlem"
@@ -7350,6 +8025,9 @@ searchMembers = "Sök medlemmar..."
 status = "Status"
 team = "Team"
 title = "Personer"
+unlockAccount = "LÃ¥s upp konto"
+unlockUserError = "Det gick inte att låsa upp användarkontot"
+unlockUserSuccess = "Användarkontot har låsts upp"
 user = "Användare"
 
 [workspace.people.actions]
diff --git a/frontend/public/locales/th-TH/translation.toml b/frontend/public/locales/th-TH/translation.toml
index ea1827d48e..947a4b2217 100644
--- a/frontend/public/locales/th-TH/translation.toml
+++ b/frontend/public/locales/th-TH/translation.toml
@@ -8,6 +8,7 @@ black = "ดำ"
 blue = "น้ำเงิน"
 bored = "เบื่อรอหรือยัง?"
 cancel = "ย�เลิ�"
+confirm = "ยืนยัน"
 changedCredsMessage = "ข้อมูลรับรองเปลี่ยน�ปลง�ล้ว!"
 chooseFile = "เลือ�ไฟล์"
 close = "ปิด"
@@ -146,6 +147,7 @@ insufficientCredits = "เครดิตไม่เพียงพอ ต้
 loadingCredits = "�ำลังตรวจสอบเครดิต..."
 loadingProStatus = "�ำลังตรวจสอบสถานะ�ารสมัครสมาชิ�..."
 noticeTopUpOrPlan = "เครดิตไม่พอ โปรดเติมเครดิตหรืออัปเ�รดเป็น�ผน"
+accessInvite = "เชิ�"
 
 [account]
 accountSettings = "�ารตั้งค่าบั�ชี"
@@ -1427,6 +1429,34 @@ title = "�ารประมวลผล"
 description = "เวลาสูงสุดที่รอ�ารประมวลผล�่อนรายงานข้อผิดพลาด"
 label = "เวลา Timeout �ารประมวลผล (วินาที)"
 
+[admin.settings.storage]
+description = "ควบคุม�ารจัดเ�็บไฟล์บนเซิร์ฟเวอร์�ละตัวเลือ��าร�ชร์"
+title = "�ารจัดเ�็บไฟล์�ละ�าร�ชร์"
+
+[admin.settings.storage.enabled]
+description = "อนุ�าตให้ผู้ใช้จัดเ�็บไฟล์บนเซิร์ฟเวอร์"
+label = "เปิดใช้งาน�ารจัดเ�็บไฟล์บนเซิร์ฟเวอร์"
+
+[admin.settings.storage.sharing.email]
+description = "อนุ�าตให้�ชร์ด้วยที่อยู่อีเมล"
+label = "เปิดใช้งาน�าร�ชร์ผ่านอีเมล"
+mailLink = "�ำหนดค่าเมล"
+mailNote = "ต้อง�ำหนดค่าเมล "
+
+[admin.settings.storage.sharing.enabled]
+description = "อนุ�าตให้ผู้ใช้�ชร์ไฟล์ที่จัดเ�็บไว้"
+label = "เปิดใช้งาน�าร�ชร์"
+
+[admin.settings.storage.sharing.links]
+description = "อนุ�าตให้�ชร์ผ่านลิง�์ที่ต้องลงชื่อเข้าใช้"
+frontendUrlLink = "�ำหนดค่าใน�ารตั้งค่าระบบ"
+frontendUrlNote = "ต้องมี Frontend URL "
+label = "เปิดใช้งานลิง�์�ชร์"
+
+[admin.settings.storage.signing.enabled]
+description = "อนุ�าตให้ผู้ใช้สร้างเซสชัน�ารลงนามเอ�สารหลายผู้เข้าร่วม จำเป็นต้องเปิดใช้งาน�ารจัดเ�็บไฟล์บนเซิร์ฟเวอร์"
+label = "เปิดใช้งาน�ารลงนาม�บบ�ลุ่ม (อัลฟา)"
+
 [admin.settings.unsavedChanges]
 cancel = "��้ไขต่อ"
 discard = "ละทิ้ง�ารเปลี่ยน�ปลง"
@@ -2059,7 +2089,19 @@ numbers = "ตัวเลข/ช่วง: 5, 10-20"
 progressions = "ลำดับขั้น: 3n, 4n+1"
 
 [certSign]
+allSigned = "ผู้เข้าร่วมทั้งหมดได้ลงนาม�ล้ว พร้อมสำหรับ�ารสรุปผล"
+awaitingSignatures = "รอ�ารลงนาม"
+signatureProgress = "{{signedCount}}/{{totalCount}} ลายเซ็น"
 chooseCertificate = "เลือ�ไฟล์ใบรับรอง"
+declined = "ป�ิเสธ�ล้ว"
+fetchFailed = "ไม่สามารถโหลดข้อมูล�ารลงนามได้"
+finalized = "สรุปผล�ล้ว"
+notified = "รอดำเนิน�าร"
+partialNote = "คุณสามารถสรุปผลล่วงหน้าด้วยลายเซ็นปัจจุบันได้ ผู้เข้าร่วมที่ยังไม่ลงนามจะถู�ตัดออ�"
+pending = "รอดำเนิน�าร"
+readyToFinalize = "พร้อมสรุปผล"
+signed = "ลงนาม�ล้ว"
+viewed = "เปิดดู�ล้ว"
 chooseJksFile = "เลือ�ไฟล์ JKS"
 chooseP12File = "เลือ�ไฟล์ PKCS12"
 choosePfxFile = "เลือ�ไฟล์ PFX"
@@ -2082,6 +2124,7 @@ title = "�ารเซ็นชื่อด้วยใบรับรอง"
 invisible = "มองไม่เห็น"
 stepTitle = "ลั�ษณะลายเซ็น"
 visible = "มองเห็นได้"
+visibility = "�าร�สดงผล"
 
 [certSign.appearance.options]
 title = "รายละเอียดลายเซ็น"
@@ -2188,6 +2231,252 @@ bullet4 = "สามารถใช้ใบรับรอง�บบ�ำห
 text = "เมื่อคุณตรวจสอบลายเซ็น เครื่องมือจะ�จ้งว่าถู�ต้องหรือไม่ ใครเป็นผู้ลงนาม ลงนามเมื่อใด �ละเอ�สารถู�เปลี่ยน�ปลงหลัง�ารลงนามหรือไม่"
 title = "�ารตรวจสอบลายเซ็น"
 
+[certSign.collab.finalize]
+button = "สรุปผล�ละโหลด PDF ที่ลงนาม�ล้ว"
+early = "สรุปผลด้วยลายเซ็นปัจจุบัน"
+
+[certSign.collab.sessionDetail]
+addButton = "เพิ่มผู้เข้าร่วม"
+addParticipants = "เพิ่มผู้เข้าร่วม"
+addParticipantsError = "ไม่สามารถเพิ่มผู้เข้าร่วมได้"
+backToList = "ย้อน�ลับไปยังเซสชัน"
+deleteConfirm = "�น่ใจหรือไม่? �ารดำเนิน�ารนี้ไม่สามารถย�เลิ�ได้"
+deleteError = "ไม่สามารถลบเซสชันได้"
+deleted = "ลบเซสชัน�ล้ว"
+deleteSession = "ลบเซสชัน"
+dueDate = "วันครบ�ำหนด"
+finalizeError = "ไม่สามารถสรุปผลเซสชันได้"
+loadPdfError = "ไม่สามารถโหลด PDF ที่ลงนาม�ล้วได้"
+loadSignedPdf = "โหลด PDF ที่ลงนาม�ล้วไปยังไฟล์ที่ใช้งานอยู่"
+messageLabel = "ข้อความ"
+noAdditionalInfo = "ไม่มีข้อมูลเพิ่มเติม"
+owner = "เจ้าของ"
+participantRemoved = "ลบผู้เข้าร่วม�ล้ว"
+participants = "ผู้เข้าร่วม"
+participantsAdded = "เพิ่มผู้เข้าร่วมเรียบร้อย�ล้ว"
+removeParticipant = "ลบ"
+removeParticipantError = "ไม่สามารถลบผู้เข้าร่วมได้"
+selectUsers = "เลือ�ผู้ใช้..."
+sessionInfo = "ข้อมูลเซสชัน"
+workbenchTitle = "�ารจัด�ารเซสชัน"
+
+[certSign.collab.signRequest]
+addedToFiles = "เพิ่มเอ�สารไปยังไฟล์ที่ใช้งานอยู่�ล้ว"
+addSignature = "เพิ่มลายเซ็นของคุณ"
+addToFiles = "เพิ่มไปยังไฟล์ที่ใช้งานอยู่"
+advancedSettings = "�ารตั้งค่าขั้นสูง"
+backToList = "ย้อน�ลับไปยังคำขอลงนาม"
+certificateChoice = "เลือ�ใบรับรองสำหรับ�ารลงนาม"
+changeSignature = "เปลี่ยนลายเซ็น"
+clearSignature = "ล้างลายเซ็น"
+completeAndSign = "เสร็จสิ้น�ละลงนาม"
+createNewSignature = "สร้างลายเซ็นใหม่"
+declineButton = "ป�ิเสธ"
+decline = "ป�ิเสธคำขอ"
+deleteSelected = "ลบลายเซ็นที่เลือ�"
+drawSignature = "วาดลายเซ็นของคุณด้านล่าง"
+dueDate = "วันครบ�ำหนด"
+fileTooLarge = "ขนาดไฟล์ต้องน้อย�ว่า 5MB"
+fontFamily = "ตระ�ูลฟอนต์"
+fontSize = "ขนาดฟอนต์: {{size}}px"
+fontSizePlaceholder = "ขนาด"
+from = "จา�"
+invalidCertFile = "โปรดเลือ�ไฟล์ใบรับรอง P12 หรือ PFX"
+invalidFileType = "โปรดเลือ�ไฟล์รูปภาพ"
+location = "สถานที่ (ไม่บังคับ)"
+locationPlaceholder = "คุณ�ำลังลงนามจา�ที่ไหน?"
+message = "ข้อความ"
+noCertificate = "โปรดเลือ�ไฟล์ใบรับรอง"
+noSignatures = "โปรดวางลายเซ็นอย่างน้อยหนึ่งลายเซ็นบน PDF"
+p12File = "ไฟล์ใบรับรอง P12/PFX"
+password = "รหัสผ่านใบรับรอง"
+passwordPlaceholder = "�รอ�รหัสผ่าน..."
+penColor = "สีปา��า"
+penSize = "ขนาดปา��า: {{size}}px"
+placementActive = "คลิ�ที่ PDF เพื่อวาง"
+placeSignatureButton = "วางลายเซ็นบน PDF"
+reason = "เหตุผล (ไม่บังคับ)"
+reasonPlaceholder = "ทำไมคุณจึงลงนาม?"
+removeImage = "นำรูปภาพออ�"
+removeCertFile = "นำไฟล์ออ�"
+savedSignatures = "ลายเซ็นที่บันทึ�ไว้"
+selectFile = "เลือ�ไฟล์รูปภาพ"
+selectSignatureTitle = "เลือ�หรือสร้างลายเซ็น"
+signButton = "ลงนามเอ�สาร"
+signatureInfo = "�ารตั้งค่าเหล่านี้�ำหนดโดยเจ้าของเอ�สาร"
+signaturePlaced = "วางลายเซ็นบนหน้า�ล้ว"
+signatureSettings = "�ารตั้งค่าลายเซ็น"
+signatureText = "ข้อความลายเซ็น"
+signatureTextPlaceholder = "�รอ�ชื่อของคุณ..."
+signatureTypeLabel = "ประเภทลายเซ็น"
+signingTitle = "�ารลงนาม"
+textColor = "สีข้อความ"
+typeSignature = "พิมพ์ชื่อของคุณเพื่อสร้างลายเซ็น"
+uploadCert = "ใบรับรอง�ำหนดเอง"
+uploadCertDesc = "ใช้ใบรับรอง P12/PFX ของคุณเอง"
+uploadSignature = "อัปโหลดรูปภาพลายเซ็นของคุณ"
+usePersonalCert = "ใบรับรองส่วนบุคคล"
+usePersonalCertDesc = "สร้างอัตโนมัติสำหรับบั�ชีของคุณ"
+useServerCert = "ใบรับรองขององค์�ร"
+useServerCertDesc = "ใบรับรองที่ใช้ร่วม�ันขององค์�ร"
+workbenchTitle = "คำขอลงนาม"
+
+[certSign.collab.signRequest.canvas]
+colorPickerTitle = "เลือ�สีเส้น"
+continue = "ดำเนิน�ารต่อ"
+
+[certSign.collab.signRequest.certModal]
+description = "คุณได้วางลายเซ็น {{count}} ราย�าร เลือ�ใบรับรองของคุณเพื่อทำ�ารลงนามให้เสร็จสิ้น"
+sign = "ลงนามเอ�สาร"
+certValidating = "�ำลังตรวจสอบความถู�ต้องของใบรับรอง..."
+certValidUntil = "ใบรับรองใช้ได้จนถึง {{date}}"
+certInvalid = "ใบรับรองไม่ถู�ต้อง: {{error}}"
+certInvalidFallback = "ใบรับรองไม่ถู�ต้อง"
+certNetworkError = "ไม่สามารถตรวจสอบความถู�ต้องของใบรับรองได้"
+title = "�ำหนดค่าใบรับรอง"
+
+[certSign.collab.signRequest.image]
+hint = "อัปโหลดรูปภาพ PNG หรือ JPG ของลายเซ็นของคุณ"
+
+[certSign.collab.signRequest.mode]
+move = "ย้ายลายเซ็น"
+place = "วางลายเซ็น"
+title = "โหมดลงนามหรือย้าย"
+
+[certSign.collab.signRequest.modeTabs]
+draw = "วาด"
+image = "อัปโหลด"
+text = "พิมพ์"
+
+[certSign.collab.signRequest.placeSignature]
+message = "คลิ�บน PDF เพื่อวางลายเซ็นของคุณ"
+title = "วางลายเซ็น"
+
+[certSign.collab.signRequest.preview]
+imageAlt = "ลายเซ็นที่เลือ�"
+missing = "ไม่มีตัวอย่าง"
+textFallback = "ลายเซ็น"
+
+[certSign.collab.signRequest.saved]
+defaultCanvasLabel = "ลายเซ็น�บบวาด"
+defaultImageLabel = "ลายเซ็นที่อัปโหลด"
+defaultLabel = "ลายเซ็น"
+defaultTextLabel = "ลายเซ็น�บบพิมพ์"
+delete = "ลบลายเซ็น"
+none = "ยังไม่มีลายเซ็นที่บันทึ�ไว้"
+
+[certSign.collab.signRequest.signatureType]
+draw = "วาด"
+type = "พิมพ์"
+upload = "อัปโหลด"
+
+[certSign.collab.signRequest.steps]
+back = "ย้อน�ลับ"
+cancelPlacement = "ย�เลิ��ารวาง"
+certificate = "ใบรับรอง"
+clickMultipleTimes = "คลิ�บน PDF หลายครั้งเพื่อวางลายเซ็น ลา�ลายเซ็นใดๆ เพื่อย้ายหรือปรับขนาด"
+clickToPlace = "คลิ�บน PDF ตำ�หน่งที่คุณต้อง�ารให้ลายเซ็นปรา��"
+continue = "ดำเนิน�ารต่อไปยัง�ารเลือ�ใบรับรอง"
+continueToPlacement = "ดำเนิน�ารต่อไปยัง�ารวาง"
+continueToReview = "ดำเนิน�ารต่อไปยัง�ารตรวจทาน"
+createSignature = "สร้างลายเซ็น"
+invisible = "ไม่�สดง"
+location = "สถานที่:"
+multipleSignatures = "จะมี�ารใช้ลายเซ็น {{count}} ราย�าร�ับ PDF"
+oneSignature = "จะมี�ารใช้ลายเซ็น 1 ราย�าร�ับ PDF"
+placeOnPdf = "วางบน PDF"
+reason = "เหตุผล:"
+reviewTitle = "ตรวจทาน�่อนลงนาม"
+signaturePlaced = "วางลายเซ็นบนหน้า {{page}} �ล้ว คุณสามารถปรับตำ�หน่งได้โดย�ารคลิ�อี�ครั้ง หรือดำเนิน�ารต่อเพื่อ�ารตรวจทาน"
+visible = "�สดง"
+visibility = "�าร�สดงผล:"
+yourSignatures = "ลายเซ็นของคุณ ({{count}})"
+
+[certSign.collab.signRequest.text]
+colorLabel = "สี"
+fontLabel = "ฟอนต์"
+fontSizeLabel = "ขนาด"
+fontSizePlaceholder = "16"
+label = "ข้อความลายเซ็น"
+modalHint = "�รอ�ชื่อของคุณ �ล้วคลิ� ดำเนิน�ารต่อ เพื่อวางลงบน PDF"
+placeholder = "�รอ�ชื่อของคุณ..."
+
+[certSign.collab.participant]
+certValidating = "�ำลังตรวจสอบความถู�ต้องของใบรับรอง..."
+certValid = "✓ ใบรับรองถู�ต้อง"
+certValidUntil = " จนถึง {{date}}"
+certInvalid = "✗ {{error}}"
+certInvalidFallback = "ใบรับรองไม่ถู�ต้อง"
+certNetworkError = "ไม่สามารถตรวจสอบความถู�ต้องของใบรับรองได้"
+
+[certSign.collab.addParticipants]
+add = "เพิ่มผู้เข้าร่วม {{count}} คน"
+back = "ย้อน�ลับ"
+configureSignatures = "�ำหนดค่า�ารตั้งค่าลายเซ็น"
+continue = "ดำเนิน�ารต่อไปยัง�ารตั้งค่าลายเซ็น"
+reasonHelp = "ตั้งค่าเหตุผล�ารลงนามล่วงหน้าสำหรับผู้เข้าร่วมเหล่านี้ (ไม่บังคับ พว�เขาสามารถเปลี่ยนได้เมื่อทำ�ารลงนาม)"
+reasonPlaceholder = "เช่น อนุมัติ, ตรวจทาน..."
+selectUsers = "เลือ�ผู้ใช้"
+
+[certSign.collab.sessionCreation]
+includeSummaryPage = "รวมหน้าสรุปลายเซ็น"
+includeSummaryPageHelp = "จะมี�ารเพิ่มหน้าสรุปที่ท้ายเอ�สารพร้อมเมทาดาต้าลายเซ็นทั้งหมด �ล่องลายเซ็นใบรับรองดิจิทัลบน�ต่ละหน้าจะถู�ระงับ (ลายเซ็น�บบเปีย�ไม่ได้รับผล�ระทบ)"
+
+[certSign.collab.sessionList]
+active = "ใช้งานอยู่"
+finalized = "สรุปผล�ล้ว"
+
+[certSign.collab.signatureSettings]
+description = "�ำหนดวิธี�าร�สดงลายเซ็นสำหรับผู้เข้าร่วมทั้งหมด"
+title = "ลั�ษณะลายเซ็น"
+
+[certSign.collab.userSelector]
+inviteUsers = "เพิ่มผู้ใช้"
+loadError = "ไม่สามารถโหลดผู้ใช้ได้"
+noTeam = "ไม่มีทีม"
+noUsers = "ไม่พบผู้ใช้อื่น"
+placeholder = "เลือ�ผู้ใช้..."
+
+[certSign.mobile]
+panelActions = "�ารดำเนิน�าร"
+panelDocument = "เอ�สาร"
+panelPeople = "บุคคล"
+
+[certSign.sessions]
+deleted = "ลบเซสชัน�ล้ว"
+fetchFailed = "ไม่สามารถโหลดรายละเอียดเซสชันได้"
+finalized = "สรุปผลเซสชัน�ล้ว"
+loaded = "โหลด PDF ที่ลงนาม�ล้ว"
+pdfNotReady = "PDF ยังไม่พร้อม"
+pdfNotReadyDesc = "�ำลังสร้าง PDF ที่ลงนาม โปรดลองอี�ครั้งในสั�ครู่"
+
+[certificateChoice.tooltip]
+header = "ประเภทของใบรับรอง"
+
+[certificateChoice.tooltip.organization]
+bullet1 = "จัด�ารโดยผู้ดู�ลระบบของระบบ"
+bullet2 = "ใช้ร่วม�ันระหว่างผู้ใช้ที่ได้รับอนุ�าต"
+bullet3 = "�สดงตัวตนของบริษัท ไม่ใช่บุคคล"
+bullet4 = "เหมาะสำหรับ: เอ�สารทาง�าร ลายเซ็นของทีม"
+description = "ใบรับรองที่ใช้ร่วม�ันซึ่งจัดเตรียมโดยองค์�รของคุณ ใช้สำหรับอำนาจ�ารลงนามในระดับบริษัท"
+title = "ใบรับรองขององค์�ร"
+
+[certificateChoice.tooltip.personal]
+bullet1 = "สร้างโดยอัตโนมัติเมื่อใช้ครั้ง�ร�"
+bullet2 = "ผู��ับบั�ชีผู้ใช้ของคุณ"
+bullet3 = "ไม่สามารถใช้ร่วม�ับผู้ใช้อื่นได้"
+bullet4 = "เหมาะสำหรับ: เอ�สารส่วนบุคคล ความรับผิดชอบรายบุคคล"
+description = "ใบรับรองที่สร้างอัตโนมัติเฉพาะบั�ชีผู้ใช้ของคุณ เหมาะสำหรับลายเซ็นส่วนบุคคล"
+title = "ใบรับรองส่วนบุคคล"
+
+[certificateChoice.tooltip.upload]
+bullet1 = "ต้องมีไฟล์ P12/PFX �ละรหัสผ่าน"
+bullet2 = "สามารถออ�โดยหน่วยงานออ�ใบรับรองภายนอ�"
+bullet3 = "ระดับความน่าเชื่อถือสูงสำหรับเอ�สารทาง�ฎหมาย"
+bullet4 = "เหมาะสำหรับ: สั��าที่มีผลผู�พันตาม�ฎหมาย �ารตรวจสอบจา�ภายนอ�"
+description = "ใช้ไฟล์ใบรับรอง PKCS#12 ของคุณเอง ให้�ารควบคุมคุณสมบัติใบรับรองอย่างเต็มที่"
+title = "อัปโหลด P12 �บบ�ำหนดเอง"
+
 [changeCreds]
 changePassword = "คุณ�ำลังใช้ข้อมูลรับรอง�ารเข้าสู่ระบบเริ่มต้น �รุณาใส่รหัสผ่านใหม่"
 changeUsername = "อัปเดตชื่อผู้ใช้ของคุณ คุณจะถู�ออ�จา�ระบบหลังจา�อัปเดต"
@@ -3242,6 +3531,46 @@ totalSelected = "จำนวนที่เลือ�ทั้งหมด"
 unsupported = "ไม่รองรับ"
 unzip = "�ต�ไฟล์"
 uploadError = "อัปโหลดไฟล์บางไฟล์ไม่สำเร็จ"
+copyCreated = "บันทึ�สำเนาลงในอุป�รณ์นี้�ล้ว"
+copyFailed = "ไม่สามารถสร้างสำเนาได้"
+leaveShare = "นำออ�จา�ราย�ารของฉัน"
+leaveShareFailed = "ไม่สามารถนำไฟล์ที่�ชร์ออ�ได้"
+leaveShareSuccess = "นำออ�จา�ราย�ารที่�ชร์ของคุณ�ล้ว"
+removeBoth = "นำออ�จา�ทั้งสองที่"
+removeFilePrompt = "ไฟล์นี้ถู�บันทึ�ไว้ในอุป�รณ์นี้�ละบนเซิร์ฟเวอร์ของคุณ คุณต้อง�ารนำออ�จา�ที่ใด?"
+removeFileTitle = "นำไฟล์ออ�"
+removeLocalOnly = "เฉพาะอุป�รณ์นี้"
+removeServerFailed = "ไม่สามารถนำไฟล์ออ�จา�เซิร์ฟเวอร์ได้"
+removeServerOnly = "เฉพาะเซิร์ฟเวอร์"
+removeServerOnlyPrompt = "ไฟล์นี้ถู�จัดเ�็บไว้เฉพาะบนเซิร์ฟเวอร์ของคุณ คุณต้อง�ารนำออ�จา�เซิร์ฟเวอร์หรือไม่?"
+removeServerSuccess = "นำออ�จา�เซิร์ฟเวอร์�ล้ว"
+removeSharedPrompt = "ไฟล์นี้ถู��ชร์�ับคุณ คุณสามารถนำออ�จา�อุป�รณ์นี้หรือจา�ราย�ารที่�ชร์ของคุณ"
+removeSharedServerOnlyBlockedPrompt = "ไฟล์นี้ถู��ชร์�ับคุณ�ละจัดเ�็บไว้เฉพาะบนเซิร์ฟเวอร์"
+removeSharedServerOnlyPrompt = "ไฟล์นี้ถู��ชร์�ับคุณ�ละจัดเ�็บไว้เฉพาะบนเซิร์ฟเวอร์ นำออ�จา�ราย�ารของคุณหรือไม่?"
+changesNotUploaded = "ยังไม่ได้อัปโหลด�ารเปลี่ยน�ปลง"
+cloudFile = "ไฟล์คลาวด์"
+filterAll = "ทั้งหมด"
+filterLocal = "ภายในเครื่อง"
+filterSharedByMe = "ฉันเป็นผู้�ชร์"
+filterSharedWithMe = "�ชร์�ับฉัน"
+lastSynced = "ซิงค์ล่าสุด"
+localOnly = "เฉพาะภายในเครื่อง"
+makeCopy = "สร้างสำเนา"
+owner = "เจ้าของ"
+ownerUnknown = "ไม่ทราบ"
+share = "�ชร์"
+shareSelected = "�ชร์ที่เลือ�"
+sharedByYou = "คุณเป็นผู้�ชร์"
+sharedEditNoticeBody = "คุณไม่มีสิทธิ์��้ไขเวอร์ชันบนเซิร์ฟเวอร์ของไฟล์นี้ �าร��้ไขใดๆ ที่คุณทำจะถู�บันทึ�เป็นสำเนาภายในเครื่อง"
+sharedEditNoticeConfirm = "รับทราบ"
+sharedEditNoticeTitle = "สำเนาบนเซิร์ฟเวอร์�บบอ่านอย่างเดียว"
+sharedWithYou = "�ชร์�ับคุณ"
+sharing = "�าร�ชร์"
+storageState = "ที่เ�็บข้อมูล"
+synced = "ซิงค์�ล้ว"
+updateOnServer = "อัปเดตบนเซิร์ฟเวอร์"
+uploadSelected = "อัปโหลดที่เลือ�"
+uploadToServer = "อัปโหลดไปยังเซิร์ฟเวอร์"
 
 [files]
 addFiles = "เพิ่มไฟล์"
@@ -3367,6 +3696,77 @@ title = "เ�ี่ยว�ับ�ารทำให้ PDF �บน"
 discord = "Discord"
 issues = "GitHub"
 
+[groupSigning.tooltip]
+header = "เ�ี่ยว�ับ�ารลงนาม�บบ�ลุ่ม"
+
+[groupSigning.tooltip.finalization]
+bullet1 = "จะใช้ลายเซ็นทั้งหมดตามลำดับผู้เข้าร่วมที่คุณ�ำหนด"
+bullet2 = "คุณสามารถสรุปผลด้วยลายเซ็นบางส่วนได้หา�จำเป็น"
+bullet3 = "เมื่อสรุปผล�ล้วจะไม่สามารถ��้ไขเซสชันได้"
+description = "เมื่อผู้เข้าร่วมทั้งหมดลงนาม�ล้ว (หรือคุณเลือ�สรุปผลล่วงหน้า) คุณสามารถสร้าง PDF ฉบับลงนามสุดท้ายได้"
+title = "�ระบวน�ารสรุปผล"
+
+[groupSigning.tooltip.roles]
+bullet1 = "เจ้าของ (คุณ): สร้างเซสชัน �ำหนดค่าเริ่มต้นของลายเซ็น สรุปผลเอ�สาร"
+bullet2 = "ผู้เข้าร่วม: สร้างลายเซ็น เลือ�ใบรับรอง วางบน PDF"
+bullet3 = "ผู้เข้าร่วมไม่สามารถ��้ไข�ารตั้งค่า�าร�สดงผล เหตุผล หรือสถานที่ของลายเซ็นได้"
+description = "คุณควบคุม�ารตั้งค่าลั�ษณะลายเซ็นสำหรับผู้เข้าร่วมทั้งหมด"
+title = "บทบาทของผู้เข้าร่วม"
+
+[groupSigning.tooltip.sequential]
+bullet1 = "ผู้เข้าร่วมคน�ร�ต้องลงนาม�่อน คนที่สองจึงจะเข้าถึงเอ�สารได้"
+bullet2 = "รับรองลำดับ�ารลงนามที่ถู�ต้องตามข้อ�ำหนดทาง�ฎหมาย"
+bullet3 = "คุณสามารถจัดเรียงลำดับผู้เข้าร่วมใหม่ได้โดย�ารลา�ในราย�าร"
+description = "ผู้เข้าร่วมจะลงนามเอ�สารตามลำดับที่คุณ�ำหนด ผู้ลงนาม�ต่ละคนจะได้รับ�าร�จ้งเตือนเมื่อถึงคิว"
+title = "�ารลงนามตามลำดับ"
+
+[groupSigning.steps]
+back = "ย้อน�ลับ"
+completed = "เสร็จสมบูรณ์"
+current = "ปัจจุบัน"
+stepLabel = "ขั้นตอนที่ {{number}}"
+
+[groupSigning.steps.configureDefaults]
+continue = "ดำเนิน�ารต่อไปยัง�ารตรวจทาน"
+invisible = "ลายเซ็นจะไม่�สดง (เฉพาะเมทาดาต้า)"
+locationLabel = "สถานที่:"
+preview = "�สดงตัวอย่าง"
+reasonLabel = "เหตุผล:"
+title = "�ำหนดค่า�ารตั้งค่าลายเซ็น"
+visible = "ลายเซ็นจะ�สดงบนหน้า {{page}}"
+
+[groupSigning.steps.review]
+document = "เอ�สาร"
+dueDate = "วันครบ�ำหนด (ไม่บังคับ)"
+dueDatePlaceholder = "เลือ�วันครบ�ำหนด..."
+invisible = "ไม่�สดง (เฉพาะเมทาดาต้า)"
+location = "สถานที่:"
+logo = "โลโ�้:"
+logoHidden = "ไม่มีโลโ�้"
+logoShown = "�สดงโลโ�้ Stirling PDF"
+participants = "ผู้เข้าร่วม"
+reason = "เหตุผล:"
+send = "ส่งคำขอลงนาม"
+signatureSettings = "�ารตั้งค่าลายเซ็น"
+title = "ตรวจทานรายละเอียดเซสชัน"
+titleShort = "ตรวจทาน�ละส่ง"
+visibility = "�าร�สดงผล:"
+visible = "�สดงบนหน้า {{page}}"
+participantCount = "ผู้เข้าร่วม {{count}} คนจะลงนามตามลำดับ"
+
+[groupSigning.steps.selectDocument]
+continue = "ดำเนิน�ารต่อไปยัง�ารเลือ�ผู้เข้าร่วม"
+noFile = "โปรดเลือ�ไฟล์ PDF เดียวจา�ไฟล์ที่ใช้งานอยู่เพื่อสร้างเซสชัน�ารลงนาม"
+selectedFile = "เอ�สารที่เลือ�"
+title = "เลือ�เอ�สาร"
+
+[groupSigning.steps.selectParticipants]
+continue = "ดำเนิน�ารต่อไปยัง�ารตั้งค่าลายเซ็น"
+count = "เลือ�ผู้เข้าร่วม�ล้ว {{count}} คน"
+label = "เลือ�ผู้เข้าร่วม"
+placeholder = "เลือ�ผู้เข้าร่วมเพื่อลงนาม..."
+title = "เลือ�ผู้เข้าร่วม"
+
 [getPdfInfo]
 downloadJson = "ดาวน์โหลด JSON"
 downloads = "ดาวน์โหลด"
@@ -4460,7 +4860,10 @@ zoomOut = "ซูมออ�"
 
 [viewer]
 cannotPreviewFile = "ไม่สามารถ�สดงตัวอย่างไฟล์ได้"
+disableColorFilter = "ปิดใช้งานตัว�รองสี"
 dualPageView = "มุมมองสองหน้า"
+enableDarkFilter = "เปิดใช้งานตัว�รองโทนมืด"
+enableSepiaFilter = "เปิดใช้งานตัว�รองเซเปีย"
 firstPage = "หน้า�ร�"
 lastPage = "หน้าสุดท้าย"
 nextPage = "หน้าถัดไป"
@@ -4470,6 +4873,22 @@ singlePageView = "มุมมองหน้าเดียว"
 unknownFile = "ไฟล์ไม่รู้จั�"
 zoomIn = "ซูมเข้า"
 zoomOut = "ซูมออ�"
+resetZoom = "รีเซ็ต�ารซูม"
+
+[viewer.nonPdf]
+fileTypeBadge = "ไฟล์ {{type}}"
+convertToPdf = "�ปลงเป็น PDF"
+loading = "�ำลังโหลด..."
+emptyFile = "ไฟล์ว่างเปล่า"
+csvStats = "{{rows}} �ถว · {{columns}} คอลัมน์ · {{size}}"
+sortedBy = "เรียงตาม: {{column}}"
+columnDefault = "คอลัมน์ {{index}}"
+htmlPreviewWarning = "ตัวอย่าง HTML — อาจไม่โหลดทรัพยา�รภายนอ� · {{size}}"
+htmlPreview = "ตัวอย่าง HTML"
+invalidJson = "JSON ไม่ถู�ต้อง — �สดงเนื้อหาดิบ"
+textStats = "{{lines}} บรรทัด · {{size}}"
+lineNumbers = "หมายเลขบรรทัด"
+renderMarkdown = "�สดงผล Markdown"
 
 [viewer.attachments]
 title = "ไฟล์�นบ"
@@ -4531,6 +4950,7 @@ toggleAttachments = "สลับไฟล์�นบ"
 toggleTheme = "สลับธีม"
 language = "ภาษา"
 toggleAnnotations = "สลับ�าร�สดงคำอธิบายประ�อบ"
+toggleLayers = "สลับเลเยอร์"
 search = "ค้นหาใน PDF"
 panMode = "โหมดเลื่อนดู"
 applyRedactionsFirst = "ใช้�ารป�ปิด�่อน"
@@ -5407,20 +5827,72 @@ title = "พิมพ์ไฟล์"
 2 = "ป้อนชื่อเครื่องพิมพ์"
 
 [quickAccess]
+access = "�ารเข้าถึง"
+accessAddPerson = "เพิ่มบุคคลอี�คน"
+accessBack = "ย้อน�ลับ"
+accessCopyLink = "คัดลอ�ลิง�์"
+accessEmail = "ที่อยู่อีเมล"
+accessEmailPlaceholder = "name@company.com"
+accessFileLabel = "ไฟล์"
+accessGeneral = "�ารเข้าถึงทั่วไป"
+accessInviteTitle = "เชิ�บุคคล"
+accessOwner = "เจ้าของ"
+accessPanel = "�ารเข้าถึงเอ�สาร"
+accessPeople = "บุคคลที่มีสิทธิ์เข้าถึง"
+accessRemove = "นำออ�"
+accessRestricted = "จำ�ัด"
+accessRestrictedHint = "เฉพาะผู้ที่มีสิทธิ์เข้าถึงเท่านั้นที่สามารถเปิดได้"
+accessRole = "บทบาท"
+accessRoleCommenter = "ผู้�สดงความคิดเห็น"
+accessRoleEditor = "ผู้��้ไข"
+accessRoleViewer = "ผู้ชม"
+accessSelectedFile = "ไฟล์ที่เลือ�"
+accessSendInvite = "ส่งคำเชิ�"
+accessTitle = "�ารเข้าถึงเอ�สาร"
+accessYou = "คุณ"
 account = "บั�ชี"
+activeSessions = "เซสชันที่ใช้งานอยู่"
+activeTab = "ใช้งานอยู่"
 activity = "�ิจ�รรม"
 adminSettings = "ตั้งค่า �อดมิน"
+allSessions = "ทุ�เซสชัน"
 allTools = "All Tools"
 automate = "ออโต้"
+back = "ย้อน�ลับ"
+certSign = "ลงนามด้วยใบรับรอง"
+completedSessions = "เซสชันที่เสร็จสิ้น"
+completedTab = "เสร็จสิ้น"
 config = "คอนฟิ�"
+createNew = "สร้างคำขอใหม่"
+createSession = "สร้างคำขอลงนาม"
+dueDate = "วันครบ�ำหนด (ไม่บังคับ)"
 files = "ไฟล์"
 help = "วิธีใช้"
+noActiveSessions = "ไม่มีคำขอลงนามที่ค้างอยู่หรือเซสชันที่ใช้งานอยู่"
+noCompletedSessions = "ไม่มีเซสชันที่เสร็จสิ้น"
+noFile = "ไม่ได้เลือ�ไฟล์"
 read = "อ่าน"
 reader = "ตัวอ่าน"
+refresh = "รีเฟรช"
+requestSignatures = "ขอลายเซ็น"
+selectSingleFileToRequest = "เลือ�ไฟล์ PDF เพียงไฟล์เดียวเพื่อขอลายเซ็น"
+selectedFile = "ไฟล์ที่เลือ�"
+selectUsers = "เลือ�ผู้ใช้เพื่อลงนาม"
+selectUsersPlaceholder = "เลือ�ผู้เข้าร่วม..."
+sendingRequest = "�ำลังส่ง..."
 settings = "ตั้งค่า"
 showMeAround = "พาชมรอบๆ"
 sign = "เซ็นชื่อ"
+signatureRequests = "คำขอลายเซ็น"
+signYourself = "ลงนามด้วยตนเอง"
+newRequest = "คำขอใหม่"
 tours = "ทัวร์"
+wetSign = "เพิ่มลายเซ็น"
+filterMine = "ของฉัน"
+filterOverdue = "เ�ิน�ำหนด"
+filterSigned = "ลงนาม�ล้ว"
+filterDeclined = "ถู�ป�ิเสธ"
+searchDocuments = "ค้นหาเอ�สาร…"
 
 [quickAccess.helpMenu]
 adminTour = "ทัวร์ผู้ดู�ล"
@@ -6050,11 +6522,75 @@ toolNotAvailableLocally = "เซิร์ฟเวอร์ Stirling-PDF ขอ
 expired = "สถานะของคุณในระบบหมดอายุ �รุณารีเฟรชหน้า�ละลองใหม่อี�ครั้ง"
 refreshPage = "รีเฟรชหน้า"
 
+[sessionManagement.tooltip]
+header = "�ารจัด�ารเซสชัน�ารลงนาม"
+
+[sessionManagement.tooltip.addParticipants]
+bullet1 = "ผู้เข้าร่วมใหม่จะถู�เพิ่มไว้ท้ายลำดับ�ารลงนาม"
+bullet2 = "ไม่สามารถเพิ่มผู้เข้าร่วมหลังจา�สรุปผลเซสชัน�ล้ว"
+bullet3 = "ผู้เข้าร่วม�ต่ละคนจะได้รับ�าร�จ้งเตือนเมื่อถึงคิวของตน"
+description = "คุณสามารถเพิ่มผู้เข้าร่วมเพิ่มเติมในเซสชันที่ใช้งานได้ทุ�เมื่อ�่อน�ารสรุปผล"
+title = "�ารเพิ่มผู้เข้าร่วม"
+
+[sessionManagement.tooltip.finalization]
+bullet1 = "<b>สรุปผลเต็มรูป�บบ</b>: ผู้เข้าร่วมทั้งหมดได้ลงนาม�ล้ว"
+bullet2 = "<b>สรุปผลบางส่วน</b>: บางคนยังไม่ได้ลงนาม"
+bullet3 = "ผู้เข้าร่วมที่ยังไม่ลงนามจะถู�ตัดออ�จา�เอ�สารสุดท้าย"
+bullet4 = "เมื่อสรุปผล�ล้ว คุณสามารถโหลด PDF ที่ลงนาม�ล้วไปยังไฟล์ที่ใช้งานอยู่ได้"
+description = "�ารสรุปผลจะรวมลายเซ็นทั้งหมดเข้าเป็น PDF ที่ลงนามฉบับเดียว �ารดำเนิน�ารนี้ไม่สามารถย้อน�ลับได้"
+title = "�ารสรุปผลเซสชัน"
+
+[sessionManagement.tooltip.participantRemoval]
+bullet1 = "ไม่สามารถลบผู้เข้าร่วมที่ได้ลงนาม�ล้ว"
+bullet2 = "ผู้ที่ถู�ลบจะไม่ได้รับ�าร�จ้งเตือนอี�"
+bullet3 = "ลำดับ�ารลงนามจะปรับโดยอัตโนมัติ"
+description = "สามารถลบผู้เข้าร่วมออ�จา�เซสชันได้�่อนที่พว�เขาจะลงนาม"
+title = "�ารลบผู้เข้าร่วม"
+
+[sessionManagement.tooltip.signatureOrder]
+bullet1 = "�ต่ละลายเซ็นจะถู�ใช้�ับ PDF ตามลำดับ"
+bullet2 = "ผู้ลงนามภายหลังสามารถเห็นลายเซ็น�่อนหน้าได้"
+bullet3 = "สำคั�สำหรับเวิร์�โฟลว์�ารอนุมัติ�ละ�ารส่งมอบตามสายโซ่ทาง�ฎหมาย"
+description = "ลำดับที่คุณ�ำหนดเมื่อสร้างเซสชันจะ�ำหนดว่าใครลงนาม�่อน"
+title = "ลำดับลายเซ็น"
+
+[signatureSettings.tooltip]
+header = "�ารตั้งค่าลั�ษณะลายเซ็น"
+
+[signatureSettings.tooltip.location]
+bullet1 = "ตัวอย่าง: \"New York, USA\", \"London Office\", \"Remote\""
+bullet2 = "ไม่ใช่ตำ�หน่งบนหน้า"
+bullet3 = "อาจจำเป็นสำหรับบางเขตอำนาจศาลทาง�ฎหมาย"
+description = "สถานที่ทางภูมิศาสตร์ (ไม่บังคับ) ที่มี�ารลงนาม จะถู�จัดเ�็บในเมทาดาต้าใบรับรอง"
+title = "สถานที่ลายเซ็น"
+
+[signatureSettings.tooltip.logo]
+bullet1 = "�สดงเคียงข้าง�ับลายเซ็น�ละข้อความ"
+bullet2 = "รองรับรูป�บบ PNG, JPG"
+bullet3 = "ช่วยเพิ่มความเป็นมืออาชีพ"
+description = "เพิ่มโลโ�้บริษัทให้�ับลายเซ็นที่มองเห็นได้เพื่อสร้าง�บรนด์�ละเพิ่มความน่าเชื่อถือ"
+title = "โลโ�้บริษัท"
+
+[signatureSettings.tooltip.reason]
+bullet1 = "ตัวอย่าง: \"Approval\", \"Contract Agreement\", \"Review Complete\""
+bullet2 = "�สดงในคุณสมบัติลายเซ็นของ PDF"
+bullet3 = "มีประโยชน์สำหรับบันทึ�ตรวจสอบ�ละ�ารป�ิบัติตามข้อ�ำหนด"
+description = "ข้อความอธิบายเหตุผลที่ลงนาม (ไม่บังคับ) จะถู�จัดเ�็บในเมทาดาต้าใบรับรอง"
+title = "เหตุผลของลายเซ็น"
+
+[signatureSettings.tooltip.visibility]
+bullet1 = "<b>�สดง</b>: ลายเซ็นปรา��บน PDF พร้อมลั�ษณะเฉพาะ"
+bullet2 = "<b>ไม่�สดง</b>: �ังใบรับรองโดยไม่มีรอยภาพ"
+bullet3 = "ลายเซ็นที่ไม่�สดงยังคงให้�ารยืนยันด้วย�ารเข้ารหัส"
+description = "ควบคุมว่าลายเซ็นจะ�สดงบนเอ�สารหรือ�ัง�บบไม่�สดง"
+title = "�าร�สดงผลของลายเซ็น"
+
 [settings.configuration]
 advanced = "ขั้นสูง"
 database = "�านข้อมูล"
 endpoints = "Endpoints"
 features = "ฟีเจอร์"
+storageSharing = "�ารจัดเ�็บไฟล์�ละ�าร�ชร์"
 systemSettings = "�ารตั้งค่าระบบ"
 title = "�าร�ำหนดค่า"
 
@@ -6332,10 +6868,13 @@ title = "ลงชื่อเข้าใช้ Stirling"
 [setup.selfhosted]
 link = "หรือเชื่อมต่อ�ับบั�ชี�บบ self-hosted"
 subtitle = "ป้อนข้อมูลรับรองของเซิร์ฟเวอร์ของคุณ"
+changeServerLocked = "องค์�รของคุณจำ�ัด�อปนี้ไว้�ับเซิร์ฟเวอร์เฉพาะ"
 switchToLocal = "ใช้เครื่องมือภายในเครื่อง�ทน"
 title = "ลงชื่อเข้าใช้เซิร์ฟเวอร์"
 
 [setup.selfhosted.unreachable]
+changeServer = "เชื่อมต่อ�ับเซิร์ฟเวอร์อื่น"
+changeServerLocked = "องค์�รของคุณจำ�ัด�อปนี้ไว้�ับเซิร์ฟเวอร์เฉพาะ"
 continueOffline = "ใช้เครื่องมือภายในเครื่อง�ทน"
 message = "ไม่สามารถเข้าถึง {{url}} โปรดตรวจสอบว่าเซิร์ฟเวอร์�ำลังทำงาน�ละเข้าถึงได้"
 retry = "ลองอี�ครั้ง"
@@ -6529,6 +7068,15 @@ saved = "ที่บันทึ�ไว้"
 text = "ข้อความ"
 title = "ประเภทลายเซ็น"
 
+[signRequest]
+declined = "คำขอลงนามถู�ป�ิเสธ"
+fetchFailed = "ไม่สามารถโหลดคำขอลงนามได้"
+signed = "ลงนามเอ�สารสำเร็จ"
+
+[signSession]
+createFailed = "ไม่สามารถสร้างคำขอลงนามได้"
+created = "ส่งคำขอลงนาม�ล้ว"
+
 [signup]
 accountCreatedSuccessfully = "สร้างบั�ชีสำเร็จ! ตอนนี้คุณสามารถลงชื่อเข้าใช้ได้"
 alreadyHaveAccount = "มีบั�ชีอยู่�ล้ว? ลงชื่อเข้าใช้"
@@ -6807,6 +7355,106 @@ title = "�บ่งไฟล์ PDF ตามหมวดหมู่"
 [splitPdfByChapters]
 tags = "�ย�,บท,บุ๊�มาร์�,จัดระเบียบ"
 
+[storageShare]
+accessed = "เข้าถึง�ล้ว"
+accessDenied = "คุณไม่มีสิทธิ์เข้าถึงไฟล์ที่�ชร์นี้ โปรดขอให้เจ้าของ�ชร์ให้คุณ"
+accessFailed = "ไม่สามารถโหลด�ิจ�รรมได้"
+accessDeniedBody = "คุณไม่มีสิทธิ์เข้าถึงไฟล์นี้ โปรดขอให้เจ้าของ�ชร์ให้คุณ"
+accessDeniedTitle = "ไม่มีสิทธิ์เข้าถึง"
+accessLimitedCommenter = "สิทธิ์�สดงความคิดเห็นจะมาเร็วๆ นี้ หา�คุณต้อง�ารดาวน์โหลด โปรดขอสิทธิ์ผู้��้ไขจา�เจ้าของ"
+accessLimitedTitle = "สิทธิ์เข้าถึงจำ�ัด"
+accessLimitedViewer = "ลิง�์นี้ใช้เพื่อดูเท่านั้น หา�คุณต้อง�ารดาวน์โหลด โปรดขอสิทธิ์ผู้��้ไขจา�เจ้าของ"
+createdAt = "สร้างเมื่อ"
+download = "ดาวน์โหลด"
+downloadFailed = "ไม่สามารถดาวน์โหลดไฟล์นี้ได้"
+expiredBody = "ลิง�์�ชร์นี้ไม่ถู�ต้องหรือหมดอายุ�ล้ว"
+expiredTitle = "ลิง�์หมดอายุ"
+goToLogin = "ไปที่หน้าเข้าสู่ระบบ"
+loadFailed = "ไม่สามารถเปิดไฟล์ที่�ชร์ได้"
+loading = "�ำลังโหลดลิง�์�ชร์..."
+loginPrompt = "ลงชื่อเข้าใช้เพื่อเข้าถึงไฟล์ที่�ชร์นี้"
+loginRequired = "ต้องเข้าสู่ระบบ"
+openInApp = "เปิดใน Stirling PDF"
+ownerLabel = "เจ้าของ"
+ownerUnknown = "ไม่ทราบ"
+requiresLogin = "ไฟล์ที่�ชร์นี้ต้องเข้าสู่ระบบ"
+roleCommenter = "ผู้�สดงความคิดเห็น"
+roleEditor = "ผู้��้ไข"
+roleViewer = "ผู้ชม"
+shareHeading = "ไฟล์ที่�ชร์"
+titleDefault = "ไฟล์ที่�ชร์"
+tryAgain = "โปรดลองใหม่ในภายหลัง"
+addUser = "เพิ่ม"
+commenterHint = "�าร�สดงความคิดเห็นจะมาเร็วๆ นี้"
+copied = "คัดลอ�ลิง�์ไปยังคลิปบอร์ด�ล้ว"
+copy = "คัดลอ�"
+copyFailed = "คัดลอ�ไม่สำเร็จ"
+description = "สร้างลิง�์�ชร์สำหรับไฟล์นี้ ผู้ใช้ที่ลงชื่อเข้าใช้�ละมีลิง�์สามารถเข้าถึงได้"
+downloadsCount = "ดาวน์โหลด: {{count}}"
+emailWarningBody = "นี่ดูเหมือนเป็นที่อยู่อีเมล หา�บุคคลนี้ยังไม่เป็นผู้ใช้ Stirling PDF พว�เขาจะไม่สามารถเข้าถึงไฟล์ได้"
+emailWarningConfirm = "�ชร์ต่อไป"
+emailWarningTitle = "ที่อยู่อีเมล"
+errorTitle = "�ชร์ไม่สำเร็จ"
+failure = "ไม่สามารถสร้างลิง�์�ชร์ได้ โปรดลองอี�ครั้ง"
+fileLabel = "ไฟล์"
+generate = "สร้างลิง�์"
+generated = "สร้างลิง�์�ชร์�ล้ว"
+hideActivity = "ซ่อน�ิจ�รรม"
+invalidUsername = "ป้อนชื่อผู้ใช้หรือที่อยู่อีเมลที่ถู�ต้อง"
+lastAccessed = "เข้าถึงล่าสุด"
+linkAccessTitle = "�ารเข้าถึงผ่านลิง�์�ชร์"
+linkLabel = "ลิง�์�ชร์"
+linksDisabled = "ปิดใช้งานลิง�์�ชร์"
+linksDisabledBody = "ลิง�์�ชร์ถู�ปิดใช้งานโดย�ารตั้งค่าเซิร์ฟเวอร์ของคุณ"
+manage = "จัด�าร�าร�ชร์"
+manageDescription = "สร้าง�ละจัด�ารลิง�์เพื่อ�ชร์ไฟล์นี้"
+manageLoadFailed = "ไม่สามารถโหลดลิง�์�ชร์ได้"
+manageTitle = "จัด�าร�าร�ชร์"
+noActivity = "ยังไม่มี�ิจ�รรม"
+noLinks = "ยังไม่มีลิง�์�ชร์ที่ใช้งานอยู่"
+noSharedUsers = "ยังไม่มีผู้ใช้ที่มีสิทธิ์เข้าถึง"
+removeLink = "นำลิง�์ออ�"
+removeUser = "นำออ�"
+revokeFailed = "ไม่สามารถลบลิง�์�ชร์ได้"
+revoked = "ลบลิง�์�ชร์�ล้ว"
+roleLabel = "บทบาท"
+sharingDisabled = "ปิดใช้งาน�าร�ชร์�ล้ว"
+sharingDisabledBody = "�าร�ชร์ถู�ปิดใช้งานโดย�ารตั้งค่าเซิร์ฟเวอร์ของคุณ"
+sharedUsersTitle = "ผู้ใช้ที่�ชร์ให้"
+title = "�ชร์ไฟล์"
+unknownUser = "ผู้ใช้ที่ไม่รู้จั�"
+userAddFailed = "ไม่สามารถ�ชร์�ับผู้ใช้นั้นได้"
+userAdded = "เพิ่มผู้ใช้ไปยังราย�าร�าร�ชร์�ล้ว"
+usernameLabel = "ชื่อผู้ใช้หรืออีเมล"
+usernamePlaceholder = "ป้อนชื่อผู้ใช้หรืออีเมล"
+userRemoveFailed = "ไม่สามารถลบผู้ใช้นั้นได้"
+userRemoved = "ลบผู้ใช้ออ�จา�ราย�าร�าร�ชร์�ล้ว"
+viewActivity = "ดู�ิจ�รรม"
+viewed = "ดู�ล้ว"
+viewsCount = "�ารดู: {{count}}"
+downloaded = "ดาวน์โหลด�ล้ว"
+bulkDescription = "สร้างลิง�์เดียวเพื่อ�ชร์ไฟล์ที่เลือ�ทั้งหมด�ับผู้ใช้ที่ลงชื่อเข้าใช้"
+bulkTitle = "�ชร์ไฟล์ที่เลือ�"
+copyLink = "คัดลอ�ลิง�์�ชร์"
+fileCount = "{{count}} ไฟล์ที่เลือ�"
+ownerOnly = "มีเพียงเจ้าของเท่านั้นที่จัด�าร�าร�ชร์ได้"
+selectSingleFile = "เลือ�ไฟล์เดียวเพื่อจัด�าร�าร�ชร์"
+
+[storageUpload]
+description = "อัปโหลดไฟล์ปัจจุบันไปยังพื้นที่จัดเ�็บบนเซิร์ฟเวอร์สำหรับ�ารเข้าถึงของคุณเอง"
+errorTitle = "อัปโหลดล้มเหลว"
+failure = "อัปโหลดล้มเหลว โปรดตรวจสอบ�ารเข้าสู่ระบบ�ละ�ารตั้งค่า�ารจัดเ�็บของคุณ"
+fileLabel = "ไฟล์"
+hint = "ลิง�์สาธารณะ�ละโหมด�ารเข้าถึงถู�ควบคุมโดย�ารตั้งค่าเซิร์ฟเวอร์ของคุณ"
+success = "อัปโหลดไปยังเซิร์ฟเวอร์�ล้ว"
+title = "อัปโหลดไปยังเซิร์ฟเวอร์"
+updateButton = "อัปเดตบนเซิร์ฟเวอร์"
+uploadButton = "อัปโหลดไปยังเซิร์ฟเวอร์"
+bulkDescription = "นี่จะอัปโหลดไฟล์ที่เลือ�ไปยังพื้นที่จัดเ�็บบนเซิร์ฟเวอร์ของคุณ"
+bulkTitle = "อัปโหลดไฟล์ที่เลือ�"
+fileCount = "{{count}} ไฟล์ที่เลือ�"
+more = " +{{count}} ราย�ารเพิ่มเติม"
+
 [storage]
 approximateSize = "ขนาดโดยประมาณ"
 fileTooLarge = "ไฟล์มีขนาดให�่เ�ินไป ขนาดสูงสุดต่อไฟล์คือ"
@@ -7153,6 +7801,30 @@ title = "ดู/��้ไข PDF"
 [warning]
 tooltipTitle = "คำเตือน"
 
+[wetSignature.tooltip]
+header = "วิธี�ารสร้างลายเซ็น"
+
+[wetSignature.tooltip.draw]
+bullet1 = "ปรับ�ต่งสี�ละความหนาของปา��า"
+bullet2 = "ลบ�ละวาดใหม่ได้จน�ว่าจะพอใจ"
+bullet3 = "ใช้งานได้บนอุป�รณ์สัมผัส (�ท็บเล็ต โทรศัพท์)"
+description = "สร้างลายเซ็นลายมือโดยใช้เมาส์หรือหน้าจอสัมผัส เหมาะที่สุดสำหรับลายเซ็นส่วนบุคคลที่เป็นธรรมชาติ"
+title = "วาดลายเซ็น"
+
+[wetSignature.tooltip.type]
+bullet1 = "เลือ�จา�หลายฟอนต์"
+bullet2 = "ปรับ�ต่งขนาด�ละสีของข้อความ"
+bullet3 = "เหมาะสำหรับลายเซ็น�บบมาตร�าน"
+description = "สร้างลายเซ็นจา�ข้อความที่พิมพ์ รวดเร็ว�ละสม่ำเสมอ เหมาะ�ับเอ�สารทางธุร�ิจ"
+title = "พิมพ์ลายเซ็น"
+
+[wetSignature.tooltip.upload]
+bullet1 = "รองรับ PNG, JPG �ละรูป�บบภาพอื่นๆ"
+bullet2 = "�นะนำให้ใช้ภาพพื้นหลังโปร่งใสเพื่อผลลัพธ์ที่ดีที่สุด"
+bullet3 = "รูปภาพจะถู�ปรับขนาดให้พอดี�ับพื้นที่ลายเซ็น"
+description = "อัปโหลดรูปภาพลายเซ็นที่สร้างไว้�ล้ว เหมาะอย่างยิ่งหา�คุณมีลายเซ็นที่ส��นไว้หรือโลโ�้บริษัท"
+title = "อัปโหลดรูปภาพลายเซ็น"
+
 [watermark]
 completed = "เพิ่มวอเตอร์มาร์��ล้ว"
 desc = "เพิ่มวอเตอร์มาร์�ข้อความหรือรูปภาพให้�ับไฟล์ PDF"
@@ -7333,6 +8005,7 @@ activeSession = "เซสชันที่ใช้งานอยู่"
 addMembers = "เพิ่มสมาชิ�"
 admin = "ผู้ดู�ล"
 confirmDelete = "คุณ�น่ใจหรือไม่ว่าต้อง�ารลบผู้ใช้นี้ �ารดำเนิน�ารนี้ไม่สามารถย้อน�ลับได้"
+confirmUnlock = "คุณ�น่ใจหรือไม่ว่าต้อง�ารปลดล็อ�บั�ชีผู้ใช้นี้?"
 deleteUser = "ลบผู้ใช้"
 deleteUserError = "ลบผู้ใช้ไม่สำเร็จ"
 deleteUserSuccess = "ลบผู้ใช้เรียบร้อย�ล้ว"
@@ -7341,6 +8014,8 @@ disable = "ปิดใช้งาน"
 disabled = "ปิด�ารใช้งาน"
 editRole = "��้ไขบทบาท"
 enable = "เปิดใช้งาน"
+locked = "ถู�ล็อ�"
+lockedBadge = "ถู�ล็อ�"
 loading = "�ำลังโหลดรายชื่อ..."
 loginRequired = "เปิดโหมดล็อ�อิน�่อน"
 member = "สมาชิ�"
@@ -7350,6 +8025,9 @@ searchMembers = "ค้นหาสมาชิ�..."
 status = "สถานะ"
 team = "ทีม"
 title = "บุคคล"
+unlockAccount = "ปลดล็อ�บั�ชี"
+unlockUserError = "ปลดล็อ�บั�ชีผู้ใช้ล้มเหลว"
+unlockUserSuccess = "ปลดล็อ�บั�ชีผู้ใช้สำเร็จ�ล้ว"
 user = "ผู้ใช้"
 
 [workspace.people.actions]
diff --git a/frontend/public/locales/tr-TR/translation.toml b/frontend/public/locales/tr-TR/translation.toml
index d835eef99d..56e74ebbf4 100644
--- a/frontend/public/locales/tr-TR/translation.toml
+++ b/frontend/public/locales/tr-TR/translation.toml
@@ -8,6 +8,7 @@ black = "Siyah"
 blue = "Mavi"
 bored = "Sıkıldınız mı?"
 cancel = "Ä°ptal"
+confirm = "Onayla"
 changedCredsMessage = "Bilgiler deÄŸiÅŸtirildi!"
 chooseFile = "Dosya Seç"
 close = "Kapat"
@@ -146,6 +147,7 @@ insufficientCredits = "Yetersiz kredi. Gerekli: {{requiredCredits}}, Mevcut: {{c
 loadingCredits = "Krediler kontrol ediliyor..."
 loadingProStatus = "Abonelik durumu kontrol ediliyor..."
 noticeTopUpOrPlan = "Yeterli kredi yok, lütfen bakiye yükleyin veya bir plana yükseltin"
+accessInvite = "Davet Et"
 
 [account]
 accountSettings = "Hesap Ayarları"
@@ -1427,6 +1429,34 @@ title = "Ä°ÅŸleme"
 description = "Hata bildirmeden önce bir işin işlenmesi için beklenecek azami süre."
 label = "İşleme Zaman Aşımı (saniye)"
 
+[admin.settings.storage]
+description = "Sunucu depolama ve paylaşım seçeneklerini kontrol edin."
+title = "Dosya Depolama ve PaylaÅŸma"
+
+[admin.settings.storage.enabled]
+description = "Kullanıcıların dosyaları sunucuda depolamasına izin verin."
+label = "Sunucu Dosya Depolamasını Etkinleştir"
+
+[admin.settings.storage.sharing.email]
+description = "E-posta adresleriyle paylaÅŸmaya izin verin."
+label = "E-posta ile Paylaşımı Etkinleştir"
+mailLink = "Posta Ayarlarını Yapılandır"
+mailNote = "Posta yapılandırması gerekir. "
+
+[admin.settings.storage.sharing.enabled]
+description = "Kullanıcıların depolanan dosyaları paylaşmasına izin verin."
+label = "Paylaşımı Etkinleştir"
+
+[admin.settings.storage.sharing.links]
+description = "Oturum açmayı gerektiren bağlantılarla paylaşmaya izin verin."
+frontendUrlLink = "Sistem Ayarlarında Yapılandır"
+frontendUrlNote = "Ön uç URL'si gerekir. "
+label = "Paylaşım Bağlantılarını Etkinleştir"
+
+[admin.settings.storage.signing.enabled]
+description = "Kullanıcıların çok katılımcılı belge imzalama oturumları oluşturmasına izin verin. Sunucu dosya depolamasının etkin olmasını gerektirir."
+label = "Grup İmzalama'yı Etkinleştir (Alfa)"
+
 [admin.settings.unsavedChanges]
 cancel = "Düzenlemeye Devam Et"
 discard = "Değişikliklerden Vazgeç"
@@ -2059,7 +2089,19 @@ numbers = "Sayılar/aralıklar: 5, 10-20"
 progressions = "Ä°lerlemeler: 3n, 4n+1"
 
 [certSign]
+allSigned = "Tüm katılımcılar imzaladı. Sonlandırmaya hazır."
+awaitingSignatures = "Ä°mzalar bekleniyor"
+signatureProgress = "{{signedCount}}/{{totalCount}} imza"
 chooseCertificate = "Sertifika Dosyası Seç"
+declined = "Reddedildi"
+fetchFailed = "İmzalama verileri yüklenemedi"
+finalized = "Sonlandırıldı"
+notified = "Beklemede"
+partialNote = "Mevcut imzalarla erken sonlandırabilirsiniz. İmzalamayan katılımcılar hariç tutulacaktır."
+pending = "Beklemede"
+readyToFinalize = "Sonlandırmaya hazır"
+signed = "İmzalandı"
+viewed = "Görüntülendi"
 chooseJksFile = "JKS Dosyası Seç"
 chooseP12File = "PKCS12 Dosyası Seç"
 choosePfxFile = "PFX Dosyası Seç"
@@ -2082,6 +2124,7 @@ title = "Sertifika Ä°mzalama"
 invisible = "Görünmez"
 stepTitle = "İmza Görünümü"
 visible = "Görünür"
+visibility = "Görünürlük"
 
 [certSign.appearance.options]
 title = "İmza Ayrıntıları"
@@ -2188,6 +2231,252 @@ bullet4 = "Doğrulama için özel sertifikalar kullanılabilir"
 text = "İmzaları kontrol ettiğinizde, araç bunların geçerli olup olmadığını, belgenin kimin tarafından imzalandığını, ne zaman imzalandığını ve imzadan sonra belgenin değiştirilip değiştirilmediğini size bildirir."
 title = "İmzaları Kontrol Etme"
 
+[certSign.collab.finalize]
+button = "Sonlandır ve İmzalı PDF'yi Yükle"
+early = "Mevcut İmzalarla Sonlandır"
+
+[certSign.collab.sessionDetail]
+addButton = "Katılımcı Ekle"
+addParticipants = "Katılımcı Ekle"
+addParticipantsError = "Katılımcılar eklenemedi"
+backToList = "Oturumlara Geri Dön"
+deleteConfirm = "Emin misiniz? Bu işlem geri alınamaz."
+deleteError = "Oturum silinemedi"
+deleted = "Oturum silindi"
+deleteSession = "Oturumu Sil"
+dueDate = "Son Tarih"
+finalizeError = "Oturum sonlandırılamadı"
+loadPdfError = "İmzalı PDF yüklenemedi"
+loadSignedPdf = "İmzalı PDF'yi Aktif Dosyalara Yükle"
+messageLabel = "Mesaj"
+noAdditionalInfo = "Ek bilgi yok"
+owner = "Sahip"
+participantRemoved = "Katılımcı kaldırıldı"
+participants = "Katılımcılar"
+participantsAdded = "Katılımcılar başarıyla eklendi"
+removeParticipant = "Kaldır"
+removeParticipantError = "Katılımcı kaldırılamadı"
+selectUsers = "Kullanıcı seçin..."
+sessionInfo = "Oturum Bilgileri"
+workbenchTitle = "Oturum Yönetimi"
+
+[certSign.collab.signRequest]
+addedToFiles = "Belge aktif dosyalara eklendi"
+addSignature = "İmzanızı Ekleyin"
+addToFiles = "Aktif Dosyalara Ekle"
+advancedSettings = "GeliÅŸmiÅŸ Ayarlar"
+backToList = "İmza İsteklerine Geri Dön"
+certificateChoice = "İmzalamak için bir sertifika seçin"
+changeSignature = "İmzayı değiştir"
+clearSignature = "İmzayı Temizle"
+completeAndSign = "Tamamla ve Ä°mzala"
+createNewSignature = "Yeni Ä°mza OluÅŸtur"
+declineButton = "Reddet"
+decline = "Ä°steÄŸi Reddet"
+deleteSelected = "Seçili imzayı sil"
+drawSignature = "İmzanızı aşağıda çizin"
+dueDate = "Son Tarih"
+fileTooLarge = "Dosya boyutu 5MB'den küçük olmalıdır"
+fontFamily = "Yazı Tipi Ailesi"
+fontSize = "Yazı Boyutu: {{size}}px"
+fontSizePlaceholder = "Boyut"
+from = "Kimden"
+invalidCertFile = "Lütfen bir P12 veya PFX sertifika dosyası seçin"
+invalidFileType = "Lütfen bir resim dosyası seçin"
+location = "Konum (İsteğe bağlı)"
+locationPlaceholder = "Nereden imzalıyorsunuz?"
+message = "Mesaj"
+noCertificate = "Lütfen bir sertifika dosyası seçin"
+noSignatures = "Lütfen PDF üzerine en az bir imza yerleştirin"
+p12File = "P12/PFX Sertifika Dosyası"
+password = "Sertifika Parolası"
+passwordPlaceholder = "Parolayı girin..."
+penColor = "Kalem Rengi"
+penSize = "Kalem Boyutu: {{size}}px"
+placementActive = "Yerleştirmek için PDF'ye tıklayın"
+placeSignatureButton = "İmzayı PDF'ye Yerleştir"
+reason = "Neden (İsteğe bağlı)"
+reasonPlaceholder = "Neden imzalıyorsunuz?"
+removeImage = "Görseli Kaldır"
+removeCertFile = "Dosyayı Kaldır"
+savedSignatures = "KaydedilmiÅŸ Ä°mzalar"
+selectFile = "Görsel Dosya Seç"
+selectSignatureTitle = "İmza Seçin veya Oluşturun"
+signButton = "Belgeyi Ä°mzala"
+signatureInfo = "Bu ayarlar belge sahibi tarafından yapılandırılmıştır"
+signaturePlaced = "Ä°mza sayfaya yerleÅŸtirildi"
+signatureSettings = "İmza Ayarları"
+signatureText = "Ä°mza Metni"
+signatureTextPlaceholder = "Adınızı girin..."
+signatureTypeLabel = "İmza Türü"
+signingTitle = "Ä°mzalama"
+textColor = "Metin Rengi"
+typeSignature = "İmza oluşturmak için adınızı yazın"
+uploadCert = "Özel Sertifika"
+uploadCertDesc = "Kendi P12/PFX sertifikanızı kullanın"
+uploadSignature = "İmza görselinizi yükleyin"
+usePersonalCert = "KiÅŸisel Sertifika"
+usePersonalCertDesc = "Hesabınız için otomatik oluşturulur"
+useServerCert = "Kuruluş Sertifikası"
+useServerCertDesc = "Paylaşılan kuruluş sertifikası"
+workbenchTitle = "Ä°mza Ä°steÄŸi"
+
+[certSign.collab.signRequest.canvas]
+colorPickerTitle = "Vuruş rengini seçin"
+continue = "Devam et"
+
+[certSign.collab.signRequest.certModal]
+description = "{{count}} imza yerleştirdiniz. İmzalamayı tamamlamak için sertifikanızı seçin."
+sign = "Belgeyi Ä°mzala"
+certValidating = "Sertifika doğrulanıyor..."
+certValidUntil = "Sertifika {{date}} tarihine kadar geçerli"
+certInvalid = "Sertifika geçersiz: {{error}}"
+certInvalidFallback = "Geçersiz sertifika"
+certNetworkError = "Sertifika doğrulanamadı"
+title = "Sertifikayı Yapılandır"
+
+[certSign.collab.signRequest.image]
+hint = "İmzanızın PNG veya JPG görselini yükleyin"
+
+[certSign.collab.signRequest.mode]
+move = "İmzayı Taşı"
+place = "İmzayı Yerleştir"
+title = "İmzalama veya taşıma modu"
+
+[certSign.collab.signRequest.modeTabs]
+draw = "Çiz"
+image = "Yükle"
+text = "Yaz"
+
+[certSign.collab.signRequest.placeSignature]
+message = "İmzanızı yerleştirmek için PDF'ye tıklayın"
+title = "İmzayı Yerleştir"
+
+[certSign.collab.signRequest.preview]
+imageAlt = "Seçilen imza"
+missing = "Önizleme yok"
+textFallback = "Ä°mza"
+
+[certSign.collab.signRequest.saved]
+defaultCanvasLabel = "Çizim imzası"
+defaultImageLabel = "Yüklenen imza"
+defaultLabel = "Ä°mza"
+defaultTextLabel = "Yazılı imza"
+delete = "İmzayı sil"
+none = "Kayıtlı imza yok"
+
+[certSign.collab.signRequest.signatureType]
+draw = "Çiz"
+type = "Yaz"
+upload = "Yükle"
+
+[certSign.collab.signRequest.steps]
+back = "Geri"
+cancelPlacement = "YerleÅŸtirmeyi Ä°ptal Et"
+certificate = "Sertifika"
+clickMultipleTimes = "İmzaları yerleştirmek için PDF'ye birden çok kez tıklayın. Taşımak veya yeniden boyutlandırmak için imzayı sürükleyin."
+clickToPlace = "İmzanızın görünmesini istediğiniz yere PDF üzerinde tıklayın."
+continue = "Sertifika Seçimine Devam Et"
+continueToPlacement = "YerleÅŸtirmeye Devam Et"
+continueToReview = "Gözden Geçirmeye Devam Et"
+createSignature = "Ä°mza OluÅŸtur"
+invisible = "Görünmez"
+location = "Konum:"
+multipleSignatures = "{{count}} imza PDF'ye uygulanacak"
+oneSignature = "1 imza PDF'ye uygulanacak"
+placeOnPdf = "PDF'ye YerleÅŸtir"
+reason = "Neden:"
+reviewTitle = "İmzalamadan Önce Gözden Geçirin"
+signaturePlaced = "İmza {{page}}. sayfaya yerleştirildi. Tekrar tıklayarak konumu ayarlayabilir veya gözden geçirmeye devam edebilirsiniz."
+visible = "Görünür"
+visibility = "Görünürlük:"
+yourSignatures = "İmzalarınız ({{count}})"
+
+[certSign.collab.signRequest.text]
+colorLabel = "Renk"
+fontLabel = "Yazı Tipi"
+fontSizeLabel = "Boyut"
+fontSizePlaceholder = "16"
+label = "Ä°mza Metni"
+modalHint = "Adınızı girin, ardından PDF'ye yerleştirmek için Devam et'e tıklayın."
+placeholder = "Adınızı girin..."
+
+[certSign.collab.participant]
+certValidating = "Sertifika doğrulanıyor..."
+certValid = "✓ Sertifika geçerli"
+certValidUntil = " {{date}} tarihine kadar"
+certInvalid = "✗ {{error}}"
+certInvalidFallback = "Geçersiz sertifika"
+certNetworkError = "Sertifika doğrulanamadı"
+
+[certSign.collab.addParticipants]
+add = "{{count}} Katılımcı Ekle"
+back = "Geri"
+configureSignatures = "İmza Ayarlarını Yapılandır"
+continue = "İmza Ayarlarına Devam Et"
+reasonHelp = "Bu katılımcılar için önceden bir imzalama nedeni belirleyin (isteğe bağlı, imzalarken değiştirebilirler)"
+reasonPlaceholder = "örn. Onay, İnceleme..."
+selectUsers = "Kullanıcıları Seç"
+
+[certSign.collab.sessionCreation]
+includeSummaryPage = "İmza Özeti Sayfasını Dahil Et"
+includeSummaryPageHelp = "Tüm imza metaverilerini içeren bir özet sayfası sona eklenecek. Tek tek sayfalardaki dijital sertifika imza kutuları gizlenecek (ıslak imzalar etkilenmez)."
+
+[certSign.collab.sessionList]
+active = "Aktif"
+finalized = "Sonlandırıldı"
+
+[certSign.collab.signatureSettings]
+description = "Tüm katılımcılar için imzaların nasıl görüneceğini yapılandırın"
+title = "İmza Görünümü"
+
+[certSign.collab.userSelector]
+inviteUsers = "Kullanıcı Ekle"
+loadError = "Kullanıcılar yüklenemedi"
+noTeam = "Ekip Yok"
+noUsers = "Başka kullanıcı bulunamadı."
+placeholder = "Kullanıcı seçin..."
+
+[certSign.mobile]
+panelActions = "Ä°ÅŸlemler"
+panelDocument = "Belge"
+panelPeople = "KiÅŸiler"
+
+[certSign.sessions]
+deleted = "Oturum silindi"
+fetchFailed = "Oturum ayrıntıları yüklenemedi"
+finalized = "Oturum sonlandırıldı"
+loaded = "İmzalı PDF yüklendi"
+pdfNotReady = "PDF Hazır Değil"
+pdfNotReadyDesc = "İmzalı PDF oluşturuluyor. Lütfen kısa süre sonra tekrar deneyin."
+
+[certificateChoice.tooltip]
+header = "Sertifika Türleri"
+
+[certificateChoice.tooltip.organization]
+bullet1 = "Sistem yöneticileri tarafından yönetilir"
+bullet2 = "Yetkili kullanıcılar arasında paylaşılır"
+bullet3 = "Åžirket kimliÄŸini temsil eder, bireyi deÄŸil"
+bullet4 = "En uygun: Resmi belgeler, ekip imzaları"
+description = "Kuruluşunuz tarafından sağlanan paylaşılan bir sertifika. Şirket çapında imzalama yetkisi için kullanılır."
+title = "Kuruluş Sertifikası"
+
+[certificateChoice.tooltip.personal]
+bullet1 = "İlk kullanımda otomatik oluşturulur"
+bullet2 = "Kullanıcı hesabınıza bağlıdır"
+bullet3 = "Diğer kullanıcılarla paylaşılamaz"
+bullet4 = "En uygun: KiÅŸisel belgeler, bireysel sorumluluk"
+description = "Kullanıcı hesabınıza özgü otomatik oluşturulmuş bir sertifika. Bireysel imzalar için uygundur."
+title = "KiÅŸisel Sertifika"
+
+[certificateChoice.tooltip.upload]
+bullet1 = "P12/PFX dosyası ve parola gerektirir"
+bullet2 = "Harici Sertifika Otoriteleri tarafından verilebilir"
+bullet3 = "Hukuki belgeler için daha yüksek güven seviyesi"
+bullet4 = "En uygun: Hukuken bağlayıcı sözleşmeler, harici doğrulama"
+description = "Kendi PKCS#12 sertifika dosyanızı kullanın. Sertifika özellikleri üzerinde tam kontrol sağlar."
+title = "Özel P12 Yükle"
+
 [changeCreds]
 changePassword = "Varsayılan giriş bilgilerini kullanıyorsunuz. Lütfen yeni bir şifre girin."
 changeUsername = "Kullanıcı adınızı güncelleyin. Güncellemeden sonra oturumunuz kapatılacak."
@@ -3242,6 +3531,46 @@ totalSelected = "Toplam Seçilen"
 unsupported = "Desteklenmiyor"
 unzip = "Zip'ten Çıkar"
 uploadError = "Bazı dosyalar yüklenemedi."
+copyCreated = "Kopya bu cihaza kaydedildi."
+copyFailed = "Kopya oluşturulamadı."
+leaveShare = "Listemden kaldır"
+leaveShareFailed = "Paylaşılan dosya kaldırılamadı."
+leaveShareSuccess = "Paylaşılan listenizden kaldırıldı."
+removeBoth = "Her ikisinden de kaldır"
+removeFilePrompt = "Bu dosya hem bu cihazda hem de sunucunuzda kayıtlı. Nereden kaldırmak istersiniz?"
+removeFileTitle = "Dosyayı kaldır"
+removeLocalOnly = "Yalnızca bu cihaz"
+removeServerFailed = "Dosya sunucudan kaldırılamadı."
+removeServerOnly = "Yalnızca sunucu"
+removeServerOnlyPrompt = "Bu dosya yalnızca sunucunuzda saklanıyor. Sunucudan kaldırmak ister misiniz?"
+removeServerSuccess = "Sunucudan kaldırıldı."
+removeSharedPrompt = "Bu dosya sizinle paylaşıldı. Bunu bu cihazdan veya paylaşılan listenizden kaldırabilirsiniz."
+removeSharedServerOnlyBlockedPrompt = "Bu dosya sizinle paylaşıldı ve yalnızca sunucuda saklanıyor."
+removeSharedServerOnlyPrompt = "Bu dosya sizinle paylaşıldı ve yalnızca sunucuda saklanıyor. Listeden kaldırmak ister misiniz?"
+changesNotUploaded = "Değişiklikler yüklenmedi"
+cloudFile = "Bulut dosyası"
+filterAll = "Tümü"
+filterLocal = "Yerel"
+filterSharedByMe = "Benim paylaştıklarım"
+filterSharedWithMe = "Benimle paylaşılanlar"
+lastSynced = "Son eÅŸitleme"
+localOnly = "Yalnızca yerel"
+makeCopy = "Kopya oluÅŸtur"
+owner = "Sahip"
+ownerUnknown = "Bilinmiyor"
+share = "PaylaÅŸ"
+shareSelected = "Seçileni Paylaş"
+sharedByYou = "Sizin paylaştıklarınız"
+sharedEditNoticeBody = "Bu dosyanın sunucudaki sürümünde düzenleme hakkınız yok. Yapacağınız düzenlemeler yerel bir kopya olarak kaydedilir."
+sharedEditNoticeConfirm = "Anladım"
+sharedEditNoticeTitle = "Salt okunur sunucu kopyası"
+sharedWithYou = "Sizinle paylaşılanlar"
+sharing = "Paylaşım"
+storageState = "Depolama"
+synced = "EÅŸitlendi"
+updateOnServer = "Sunucuda Güncelle"
+uploadSelected = "Seçileni Yükle"
+uploadToServer = "Sunucuya Yükle"
 
 [files]
 addFiles = "Dosya ekle"
@@ -3367,6 +3696,77 @@ title = "PDF'leri Düzleştirme Hakkında"
 discord = "Discord"
 issues = "GitHub"
 
+[groupSigning.tooltip]
+header = "Grup İmzalama Hakkında"
+
+[groupSigning.tooltip.finalization]
+bullet1 = "Tüm imzalar belirttiğiniz katılımcı sırasıyla uygulanır"
+bullet2 = "Gerektiğinde kısmi imzalarla sonlandırabilirsiniz"
+bullet3 = "Sonlandırıldıktan sonra oturum değiştirilemez"
+description = "Tüm katılımcılar imzaladığında (veya erken sonlandırmayı seçtiğinizde), nihai imzalı PDF'yi oluşturabilirsiniz."
+title = "Sonlandırma Süreci"
+
+[groupSigning.tooltip.roles]
+bullet1 = "Sahip (siz): Oturumu oluşturur, imza varsayılanlarını yapılandırır, belgeyi sonlandırır"
+bullet2 = "Katılımcılar: İmzalarını oluşturur, sertifika seçer, PDF'ye yerleştirir"
+bullet3 = "Katılımcılar imza görünürlüğü, nedeni veya konum ayarlarını değiştiremez"
+description = "Tüm katılımcılar için imza görünümü ayarlarını siz kontrol edersiniz."
+title = "Katılımcı Rolleri"
+
+[groupSigning.tooltip.sequential]
+bullet1 = "İlk katılımcı imzalamadan ikinci kişi belgeye erişemez"
+bullet2 = "Hukuki uyum için doğru imzalama sırasını sağlar"
+bullet3 = "Listedeki sıralarını sürükleyerek katılımcıları yeniden sıralayabilirsiniz"
+description = "Katılımcılar belirttiğiniz sırada belgeleri imzalar. Her imzalayan, sırası geldiğinde bir bildirim alır."
+title = "Sıralı İmzalama"
+
+[groupSigning.steps]
+back = "Geri"
+completed = "Tamamlandı"
+current = "Mevcut"
+stepLabel = "Adım {{number}}"
+
+[groupSigning.steps.configureDefaults]
+continue = "Gözden Geçirmeye Devam Et"
+invisible = "İmzalar görünmez olacak (yalnızca metaveri)"
+locationLabel = "Konum:"
+preview = "Önizleme"
+reasonLabel = "Neden:"
+title = "İmza Ayarlarını Yapılandır"
+visible = "İmzalar {{page}}. sayfada görünür olacak"
+
+[groupSigning.steps.review]
+document = "Belge"
+dueDate = "Son Tarih (İsteğe bağlı)"
+dueDatePlaceholder = "Son tarihi seçin..."
+invisible = "Görünmez (yalnızca metaveri)"
+location = "Konum:"
+logo = "Logo:"
+logoHidden = "Logo yok"
+logoShown = "Stirling PDF logosu gösteriliyor"
+participants = "Katılımcılar"
+reason = "Neden:"
+send = "İmzalama İsteklerini Gönder"
+signatureSettings = "İmza Ayarları"
+title = "Oturum Ayrıntılarını Gözden Geçir"
+titleShort = "Gözden Geçir ve Gönder"
+visibility = "Görünürlük:"
+visible = "{{page}}. sayfada görünür"
+participantCount = "{{count}} katılımcı sırayla imzalayacak"
+
+[groupSigning.steps.selectDocument]
+continue = "Katılımcı Seçimine Devam Et"
+noFile = "Bir imzalama oturumu oluşturmak için lütfen aktif dosyalarınızdan tek bir PDF dosyası seçin."
+selectedFile = "Seçilen belge"
+title = "Belge Seç"
+
+[groupSigning.steps.selectParticipants]
+continue = "İmza Ayarlarına Devam Et"
+count = "{{count}} katılımcı seçildi"
+label = "Katılımcıları seçin"
+placeholder = "İmzalamaları için katılımcıları seçin..."
+title = "Katılımcıları Seç"
+
 [getPdfInfo]
 downloadJson = "JSON Ä°ndir"
 downloads = "Ä°ndirmeler"
@@ -4460,7 +4860,10 @@ zoomOut = "Uzaklaştır"
 
 [viewer]
 cannotPreviewFile = "Dosya önizlenemiyor"
+disableColorFilter = "Renk Filtresini Devre Dışı Bırak"
 dualPageView = "Çift Sayfa Görünümü"
+enableDarkFilter = "Karanlık Filtresini Etkinleştir"
+enableSepiaFilter = "Sepya Filtresini EtkinleÅŸtir"
 firstPage = "Ä°lk Sayfa"
 lastPage = "Son Sayfa"
 nextPage = "Sonraki Sayfa"
@@ -4470,6 +4873,22 @@ singlePageView = "Tek Sayfa Görünümü"
 unknownFile = "Bilinmeyen dosya"
 zoomIn = "Yakınlaştır"
 zoomOut = "Uzaklaştır"
+resetZoom = "Yakınlaştırmayı sıfırla"
+
+[viewer.nonPdf]
+fileTypeBadge = "{{type}} Dosyası"
+convertToPdf = "PDF'ye Dönüştür"
+loading = "Yükleniyor..."
+emptyFile = "BoÅŸ dosya"
+csvStats = "{{rows}} satır · {{columns}} sütun · {{size}}"
+sortedBy = "Sıralama ölçütü: {{column}}"
+columnDefault = "Sütun {{index}}"
+htmlPreviewWarning = "HTML önizleme — harici kaynaklar yüklenmeyebilir · {{size}}"
+htmlPreview = "HTML önizleme"
+invalidJson = "Geçersiz JSON — ham içerik gösteriliyor"
+textStats = "{{lines}} satır · {{size}}"
+lineNumbers = "Satır numaraları"
+renderMarkdown = "Markdown'u iÅŸle"
 
 [viewer.attachments]
 title = "Ekler"
@@ -4531,6 +4950,7 @@ toggleAttachments = "Ekleri Göster/Gizle"
 toggleTheme = "Temayı Değiştir"
 language = "Dil"
 toggleAnnotations = "Açıklamaların Görünürlüğünü Değiştir"
+toggleLayers = "Katmanları Aç/Kapat"
 search = "PDF Ara"
 panMode = "Kaydırma Modu"
 applyRedactionsFirst = "Önce karartmaları uygula"
@@ -5407,20 +5827,72 @@ title = "Dosya Yazdır"
 2 = "Yazıcı Adını Girin"
 
 [quickAccess]
+access = "EriÅŸim"
+accessAddPerson = "BaÅŸka bir kiÅŸi ekle"
+accessBack = "Geri"
+accessCopyLink = "Bağlantıyı kopyala"
+accessEmail = "E-posta Adresi"
+accessEmailPlaceholder = "name@company.com"
+accessFileLabel = "Dosya"
+accessGeneral = "Genel EriÅŸim"
+accessInviteTitle = "KiÅŸi Davet Et"
+accessOwner = "Sahip"
+accessPanel = "Belge eriÅŸimi"
+accessPeople = "EriÅŸimi olan kiÅŸiler"
+accessRemove = "Kaldır"
+accessRestricted = "Kısıtlı"
+accessRestrictedHint = "Yalnızca erişimi olan kişiler açabilir"
+accessRole = "Rol"
+accessRoleCommenter = "Yorumcu"
+accessRoleEditor = "Düzenleyici"
+accessRoleViewer = "Görüntüleyici"
+accessSelectedFile = "Seçilen dosya"
+accessSendInvite = "Davet Gönder"
+accessTitle = "Belge EriÅŸimi"
+accessYou = "Siz"
 account = "Hesap"
+activeSessions = "Aktif Oturumlar"
+activeTab = "Aktif"
 activity = "Etkinlik"
 adminSettings = "Admin Ayarları"
+allSessions = "Tüm Oturumlar"
 allTools = "All Tools"
 automate = "Otomatik"
+back = "Geri"
+certSign = "Sertifika İmzası"
+completedSessions = "Tamamlanan Oturumlar"
+completedTab = "Tamamlandı"
 config = "Ayarlar"
+createNew = "Yeni Ä°stek OluÅŸtur"
+createSession = "Ä°mzalama Ä°steÄŸi OluÅŸtur"
+dueDate = "Son tarih (isteğe bağlı)"
 files = "Dosyalar"
 help = "Yardım"
+noActiveSessions = "Bekleyen imza isteÄŸi veya aktif oturum yok"
+noCompletedSessions = "Tamamlanan oturum yok"
+noFile = "Dosya seçilmedi"
 read = "Oku"
 reader = "Okuyucu"
+refresh = "Yenile"
+requestSignatures = "Ä°mza Ä°ste"
+selectSingleFileToRequest = "İmza istemek için tek bir PDF dosyası seçin"
+selectedFile = "Seçilen dosya"
+selectUsers = "İmzalamaları için kullanıcıları seçin"
+selectUsersPlaceholder = "Katılımcıları seçin..."
+sendingRequest = "Gönderiliyor..."
 settings = "Ayarlar"
 showMeAround = "Bana etrafı göster"
 sign = "Ä°mzala"
+signatureRequests = "Ä°mza Ä°stekleri"
+signYourself = "Kendin Ä°mzala"
+newRequest = "Yeni Ä°stek"
 tours = "Turlar"
+wetSign = "Ä°mza Ekle"
+filterMine = "Benim"
+filterOverdue = "GecikmiÅŸ"
+filterSigned = "İmzalandı"
+filterDeclined = "Reddedildi"
+searchDocuments = "Belgelerde ara…"
 
 [quickAccess.helpMenu]
 adminTour = "Yönetici Turu"
@@ -6050,11 +6522,75 @@ toolNotAvailableLocally = "Stirling-PDF sunucunuz çevrimdışı ve \"{{endpoint
 expired = "Oturumunuzun süresi doldu. Lütfen sayfayı yenileyip tekrar deneyin."
 refreshPage = "Sayfayı Yenile"
 
+[sessionManagement.tooltip]
+header = "İmzalama Oturumlarını Yönetme"
+
+[sessionManagement.tooltip.addParticipants]
+bullet1 = "Yeni katılımcılar imzalama sırasının sonuna eklenir"
+bullet2 = "Oturum sonlandırıldıktan sonra katılımcı eklenemez"
+bullet3 = "Her bir katılımcı sırası geldiğinde bir bildirim alır"
+description = "Sonlandırmadan önce istediğiniz zaman aktif bir oturuma daha fazla katılımcı ekleyebilirsiniz."
+title = "Katılımcı Ekleme"
+
+[sessionManagement.tooltip.finalization]
+bullet1 = "<b>Tam sonlandırma</b>: Tüm katılımcılar imzaladı"
+bullet2 = "<b>Kısmi sonlandırma</b>: Bazı katılımcılar henüz imzalamadı"
+bullet3 = "İmzalamayan katılımcılar nihai belgeden hariç tutulur"
+bullet4 = "Sonlandırdıktan sonra imzalı PDF'yi aktif dosyalara yükleyebilirsiniz"
+description = "Sonlandırma, tüm imzaları tek bir imzalı PDF'de birleştirir. Bu işlem geri alınamaz."
+title = "Oturumu Sonlandırma"
+
+[sessionManagement.tooltip.participantRemoval]
+bullet1 = "Zaten imzalamış katılımcılar kaldırılamaz"
+bullet2 = "Kaldırılan katılımcılara artık bildirim gönderilmez"
+bullet3 = "İmzalama sırası otomatik olarak ayarlanır"
+description = "Katılımcılar imzalamadan önce oturumlardan kaldırılabilir."
+title = "Katılımcıları Kaldırma"
+
+[sessionManagement.tooltip.signatureOrder]
+bullet1 = "Her imza PDF'ye sıralı olarak uygulanır"
+bullet2 = "Sonraki imzalayanlar önceki imzaları görebilir"
+bullet3 = "Onay iş akışları ve yasal teslim zincirleri için kritiktir"
+description = "Oturumu oluştururken belirttiğiniz sıra, kimin önce imzalayacağını belirler."
+title = "İmza Sırası"
+
+[signatureSettings.tooltip]
+header = "İmza Görünümü Ayarları"
+
+[signatureSettings.tooltip.location]
+bullet1 = "Örnekler: \"New York, USA\", \"London Office\", \"Remote\""
+bullet2 = "Sayfa konumuyla aynı değildir"
+bullet3 = "Bazı hukuki yargı alanları için gerekli olabilir"
+description = "İmzanın uygulandığı isteğe bağlı coğrafi konum. Sertifika metaverisine kaydedilir."
+title = "Ä°mza Konumu"
+
+[signatureSettings.tooltip.logo]
+bullet1 = "İmza ve metnin yanında gösterilir"
+bullet2 = "PNG, JPG formatlarını destekler"
+bullet3 = "Profesyonel görünümü artırır"
+description = "Görünür imzalara marka ve doğruluk için şirket logosu ekleyin."
+title = "Åžirket Logosu"
+
+[signatureSettings.tooltip.reason]
+bullet1 = "Örnekler: \"Onay\", \"Sözleşme Anlaşması\", \"İnceleme Tamamlandı\""
+bullet2 = "PDF imza özelliklerinde görünür"
+bullet3 = "Denetim izleri ve uyumluluk için faydalıdır"
+description = "Belgenin neden imzalandığını açıklayan isteğe bağlı metin. Sertifika metaverisine kaydedilir."
+title = "Ä°mza Nedeni"
+
+[signatureSettings.tooltip.visibility]
+bullet1 = "<b>Görünür</b>: İmza, özel görünümle PDF üzerinde görünür"
+bullet2 = "<b>Görünmez</b>: Görsel işaret olmadan sertifika gömülür"
+bullet3 = "Görünmez imzalar yine de kriptografik doğrulama sağlar"
+description = "İmzanın belgede görünür olup olmayacağını veya görünmez şekilde gömüleceğini kontrol eder."
+title = "İmza Görünürlüğü"
+
 [settings.configuration]
 advanced = "GeliÅŸmiÅŸ"
 database = "Veritabanı"
 endpoints = "Uç Noktalar"
 features = "Özellikler"
+storageSharing = "Dosya Depolama ve PaylaÅŸma"
 systemSettings = "Sistem Ayarları"
 title = "Yapılandırma"
 
@@ -6332,10 +6868,13 @@ title = "Stirling'de Oturum Açın"
 [setup.selfhosted]
 link = "veya kendi barındırdığınız bir hesaba bağlanın"
 subtitle = "Sunucu kimlik bilgilerinizi girin"
+changeServerLocked = "Kuruluşunuz bu uygulamayı belirli bir sunucuyla sınırlamıştır"
 switchToLocal = "Bunun yerine yerel araçları kullan"
 title = "Sunucuda Oturum Açın"
 
 [setup.selfhosted.unreachable]
+changeServer = "Farklı bir sunucuya bağlan"
+changeServerLocked = "Kuruluşunuz bu uygulamayı belirli bir sunucuyla sınırlamıştır"
 continueOffline = "Bunun yerine yerel araçları kullan"
 message = "{{url}} adresine ulaşılamadı. Sunucunun çalıştığını ve erişilebilir olduğunu kontrol edin."
 retry = "Yeniden dene"
@@ -6529,6 +7068,15 @@ saved = "Kaydedildi"
 text = "Metin"
 title = "İmza Türü"
 
+[signRequest]
+declined = "Ä°mza isteÄŸi reddedildi"
+fetchFailed = "İmza isteği yüklenemedi"
+signed = "Belge başarıyla imzalandı"
+
+[signSession]
+createFailed = "İmzalama isteği oluşturulamadı"
+created = "İmzalama isteği gönderildi"
+
 [signup]
 accountCreatedSuccessfully = "Hesap başarıyla oluşturuldu! Artık giriş yapabilirsiniz."
 alreadyHaveAccount = "Zaten bir hesabınız var mı? Giriş yapın"
@@ -6807,6 +7355,106 @@ title = "PDF'yi Bölümlere Ayır"
 [splitPdfByChapters]
 tags = "böl, bölümler, yer imleri, düzenle"
 
+[storageShare]
+accessed = "EriÅŸildi"
+accessDenied = "Bu paylaşılan dosyaya erişiminiz yok. Sahipten sizinle paylaşmasını isteyin."
+accessFailed = "Etkinlik yüklenemedi."
+accessDeniedBody = "Bu dosyaya erişiminiz yok. Sahipten sizinle paylaşmasını isteyin."
+accessDeniedTitle = "EriÅŸim yok"
+accessLimitedCommenter = "Yorum erişimi yakında geliyor. İndirmeniz gerekiyorsa sahibinden düzenleyici erişimi isteyin."
+accessLimitedTitle = "Sınırlı erişim"
+accessLimitedViewer = "Bu bağlantı yalnızca görüntüleme içindir. İndirmeniz gerekiyorsa sahibinden düzenleyici erişimi isteyin."
+createdAt = "OluÅŸturuldu"
+download = "Ä°ndir"
+downloadFailed = "Bu dosya indirilemedi."
+expiredBody = "Bu paylaşım bağlantısı geçersiz veya süresi dolmuş."
+expiredTitle = "Bağlantının süresi doldu"
+goToLogin = "GiriÅŸe git"
+loadFailed = "Paylaşılan dosya açılamadı."
+loading = "Paylaşım bağlantısı yükleniyor..."
+loginPrompt = "Bu paylaşılan dosyaya erişmek için oturum açın."
+loginRequired = "GiriÅŸ gerekli"
+openInApp = "Stirling PDF'de Aç"
+ownerLabel = "Sahip"
+ownerUnknown = "Bilinmiyor"
+requiresLogin = "Bu paylaşılan dosya oturum açmayı gerektirir."
+roleCommenter = "Yorumcu"
+roleEditor = "Düzenleyici"
+roleViewer = "Görüntüleyici"
+shareHeading = "Paylaşılan dosya"
+titleDefault = "Paylaşılan dosya"
+tryAgain = "Lütfen daha sonra tekrar deneyin."
+addUser = "Ekle"
+commenterHint = "Yorum yapma özelliği yakında geliyor."
+copied = "Bağlantı panoya kopyalandı"
+copy = "Kopyala"
+copyFailed = "Kopyalama başarısız"
+description = "Bu dosya için bir paylaşım bağlantısı oluşturun. Bağlantıya sahip ve oturum açmış kullanıcılar erişebilir."
+downloadsCount = "Ä°ndirme: {{count}}"
+emailWarningBody = "Bu bir e-posta adresine benziyor. Bu kişi henüz bir Stirling PDF kullanıcısı değilse dosyaya erişemez."
+emailWarningConfirm = "Yine de paylaÅŸ"
+emailWarningTitle = "E-posta adresi"
+errorTitle = "Paylaşım başarısız"
+failure = "Paylaşım bağlantısı oluşturulamadı. Lütfen tekrar deneyin."
+fileLabel = "Dosya"
+generate = "Bağlantı Oluştur"
+generated = "Paylaşım bağlantısı oluşturuldu"
+hideActivity = "EtkinliÄŸi gizle"
+invalidUsername = "Geçerli bir kullanıcı adı veya e-posta adresi girin."
+lastAccessed = "Son eriÅŸim"
+linkAccessTitle = "Paylaşım bağlantısı erişimi"
+linkLabel = "Paylaşım bağlantısı"
+linksDisabled = "Paylaşım bağlantıları devre dışı bırakıldı."
+linksDisabledBody = "Paylaşım bağlantıları sunucu ayarlarınız tarafından devre dışı bırakıldı."
+manage = "Paylaşımı yönet"
+manageDescription = "Bu dosyayı paylaşmak için bağlantılar oluşturun ve yönetin."
+manageLoadFailed = "Paylaşım bağlantıları yüklenemedi."
+manageTitle = "Paylaşımı Yönet"
+noActivity = "Henüz etkinlik yok."
+noLinks = "Henüz etkin paylaşım bağlantısı yok."
+noSharedUsers = "Henüz hiçbir kullanıcının erişimi yok."
+removeLink = "Bağlantıyı kaldır"
+removeUser = "Kaldır"
+revokeFailed = "Paylaşım bağlantısı kaldırılamadı."
+revoked = "Paylaşım bağlantısı kaldırıldı"
+roleLabel = "Rol"
+sharingDisabled = "Paylaşım devre dışı bırakıldı."
+sharingDisabledBody = "Paylaşım, sunucu ayarlarınız tarafından devre dışı bırakıldı."
+sharedUsersTitle = "Paylaşılan kullanıcılar"
+title = "Dosyayı Paylaş"
+unknownUser = "Bilinmeyen kullanıcı"
+userAddFailed = "Bu kullanıcıyla paylaşım yapılamadı."
+userAdded = "Kullanıcı paylaşım listesine eklendi."
+usernameLabel = "Kullanıcı adı veya e-posta"
+usernamePlaceholder = "Bir kullanıcı adı veya e-posta girin"
+userRemoveFailed = "Bu kullanıcı kaldırılamadı."
+userRemoved = "Kullanıcı paylaşım listesinden kaldırıldı."
+viewActivity = "Etkinliği görüntüle"
+viewed = "Görüntülendi"
+viewsCount = "Görüntüleme: {{count}}"
+downloaded = "Ä°ndirildi"
+bulkDescription = "Oturum açmış kullanıcılarla seçili tüm dosyaları paylaşmak için tek bir bağlantı oluşturun."
+bulkTitle = "Seçili dosyaları paylaş"
+copyLink = "Paylaşım bağlantısını kopyala"
+fileCount = "{{count}} dosya seçildi"
+ownerOnly = "Paylaşımı yalnızca sahibi yönetebilir."
+selectSingleFile = "Paylaşımı yönetmek için tek bir dosya seçin."
+
+[storageUpload]
+description = "Bu, geçerli dosyayı kendi erişiminiz için sunucu depolamasına yükler."
+errorTitle = "Yükleme başarısız"
+failure = "Yükleme başarısız. Lütfen oturum açma ve depolama ayarlarınızı kontrol edin."
+fileLabel = "Dosya"
+hint = "Genel bağlantılar ve erişim modları, sunucu ayarlarınız tarafından kontrol edilir."
+success = "Sunucuya yüklendi"
+title = "Sunucuya Yükle"
+updateButton = "Sunucuda Güncelle"
+uploadButton = "Sunucuya Yükle"
+bulkDescription = "Bu, seçili dosyaları sunucu depolamanıza yükler."
+bulkTitle = "Seçili dosyaları yükle"
+fileCount = "{{count}} dosya seçildi"
+more = " +{{count}} daha"
+
 [storage]
 approximateSize = "Yaklaşık boyut"
 fileTooLarge = "Dosya çok büyük. Dosya başına maksimum boyut"
@@ -7153,6 +7801,30 @@ title = "PDF Görüntüle/Düzenle"
 [warning]
 tooltipTitle = "Uyarı"
 
+[wetSignature.tooltip]
+header = "İmza Oluşturma Yöntemleri"
+
+[wetSignature.tooltip.draw]
+bullet1 = "Kalem rengi ve kalınlığını özelleştirin"
+bullet2 = "Memnun kalana kadar temizleyip yeniden çizin"
+bullet3 = "Dokunmatik cihazlarda çalışır (tabletler, telefonlar)"
+description = "Fareyi veya dokunmatik ekranı kullanarak el yazısı imza oluşturun. Kişisel ve özgün imzalar için en iyisidir."
+title = "İmza Çiz"
+
+[wetSignature.tooltip.type]
+bullet1 = "Birden çok yazı tipinden seçin"
+bullet2 = "Metin boyutunu ve rengini özelleştirin"
+bullet3 = "Standartlaştırılmış imzalar için idealdir"
+description = "Yazılan metinden bir imza oluşturun. Hızlı ve tutarlıdır, iş belgeleri için uygundur."
+title = "Ä°mza Yaz"
+
+[wetSignature.tooltip.upload]
+bullet1 = "PNG, JPG ve diğer görüntü formatlarını destekler"
+bullet2 = "En iyi sonuçlar için şeffaf arka plan önerilir"
+bullet3 = "Görüntü, imza alanına sığacak şekilde yeniden boyutlandırılacaktır"
+description = "Önceden oluşturulmuş bir imza görüntüsü yükleyin. Taranmış bir imzanız veya şirket logonuz varsa idealdir."
+title = "İmza Görüntüsü Yükle"
+
 [watermark]
 completed = "Filigran eklendi"
 desc = "PDF dosyalarına metin veya resim filigranları ekleyin"
@@ -7333,6 +8005,7 @@ activeSession = "Aktif oturum"
 addMembers = "Ãœye Ekle"
 admin = "Yönetici"
 confirmDelete = "Bu kullanıcıyı silmek istediğinizden emin misiniz? Bu işlem geri alınamaz."
+confirmUnlock = "Bu kullanıcı hesabının kilidini açmak istediğinizden emin misiniz?"
 deleteUser = "Kullanıcıyı Sil"
 deleteUserError = "Kullanıcı silme başarısız"
 deleteUserSuccess = "Kullanıcı başarıyla silindi"
@@ -7341,6 +8014,8 @@ disable = "Devre Dışı Bırak"
 disabled = "Devre dışı"
 editRole = "Rolü Düzenle"
 enable = "EtkinleÅŸtir"
+locked = "kilitli"
+lockedBadge = "Kilitli"
 loading = "Kişiler yükleniyor..."
 loginRequired = "Önce oturum açma modunu etkinleştirin"
 member = "Ãœye"
@@ -7350,6 +8025,9 @@ searchMembers = "Ãœyeleri ara..."
 status = "Durum"
 team = "Takım"
 title = "KiÅŸiler"
+unlockAccount = "Hesabın Kilidini Aç"
+unlockUserError = "Kullanıcı hesabının kilidi açılamadı"
+unlockUserSuccess = "Kullanıcı hesabının kilidi başarıyla açıldı"
 user = "Kullanıcı"
 
 [workspace.people.actions]
diff --git a/frontend/public/locales/uk-UA/translation.toml b/frontend/public/locales/uk-UA/translation.toml
index a5c8832a1f..b07a3617df 100644
--- a/frontend/public/locales/uk-UA/translation.toml
+++ b/frontend/public/locales/uk-UA/translation.toml
@@ -8,6 +8,7 @@ black = "Чорний"
 blue = "Синій"
 bored = "�удно чекати?"
 cancel = "Ска�увати"
+confirm = "Підтвердити"
 changedCredsMessage = "Облікові дані змінено!"
 chooseFile = "Вибрати файл"
 close = "Закрити"
@@ -146,6 +147,7 @@ insufficientCredits = "�едо�татньо кредитів. Потрібно
 loadingCredits = "Перевірка кредитів..."
 loadingProStatus = "Перевірка �тату�у підпи�ки..."
 noticeTopUpOrPlan = "�едо�татньо кредитів, поповніть балан� або перейдіть на тарифний план"
+accessInvite = "Запро�ити"
 
 [account]
 accountSettings = "�алаштуванн� акаунта"
@@ -1427,6 +1429,34 @@ title = "Обробка"
 description = "Мак�имальний ча� очікуванн� на завданн� обробки перед повідомленн�м про помилку."
 label = "Тайм-аут обробки (�екунди)"
 
+[admin.settings.storage]
+description = "Керуйте параметрами зберіганн� на �ервері та �пільного до�тупу."
+title = "Зберіганн� файлів і �пільний до�туп"
+
+[admin.settings.storage.enabled]
+description = "Дозволити кори�тувачам зберігати файли на �ервері."
+label = "Увімкнути зберіганн� файлів на �ервері"
+
+[admin.settings.storage.sharing.email]
+description = "Дозволити наданн� до�тупу за адре�ами електронної пошти."
+label = "Увімкнути �пільний до�туп за електронною поштою"
+mailLink = "�алаштувати параметри пошти"
+mailNote = "Потрібна конфігураці� пошти. "
+
+[admin.settings.storage.sharing.enabled]
+description = "Дозволити кори�тувачам ділити�� збереженими файлами."
+label = "Увімкнути �пільний до�туп"
+
+[admin.settings.storage.sharing.links]
+description = "Дозволити �пільний до�туп через по�иланн� дл� авторизованих кори�тувачів."
+frontendUrlLink = "�алаштувати в �и�темних налаштуванн�х"
+frontendUrlNote = "Потрібен Frontend URL. "
+label = "Увімкнути по�иланн� дл� �пільного до�тупу"
+
+[admin.settings.storage.signing.enabled]
+description = "Дозволити кори�тувачам �творювати �еан�и підпи�анн� документів із кількома уча�никами. Потрібно ввімкнути зберіганн� файлів на �ервері."
+label = "Увімкнути групове підпи�анн� (Alpha)"
+
 [admin.settings.unsavedChanges]
 cancel = "Продовжити редагуванн�"
 discard = "Відхилити зміни"
@@ -2059,7 +2089,19 @@ numbers = "Чи�ла/діапазони: 5, 10-20"
 progressions = "Прогре�ії: 3n, 4n+1"
 
 [certSign]
+allSigned = "У�і уча�ники підпи�али. Готово до завершенн�."
+awaitingSignatures = "Очікуванн� підпи�ів"
+signatureProgress = "{{signedCount}}/{{totalCount}} підпи�ів"
 chooseCertificate = "Вибрати файл �ертифіката"
+declined = "Відхилено"
+fetchFailed = "�е вдало�� завантажити дані підпи�анн�"
+finalized = "Завершено"
+notified = "Очікуєть��"
+partialNote = "Ви можете завершити раніше з поточними підпи�ами. �епідпи�ані уча�ники будуть виключені."
+pending = "Очікуєть��"
+readyToFinalize = "Готово до завершенн�"
+signed = "Підпи�ано"
+viewed = "Перегл�нуто"
 chooseJksFile = "Вибрати файл JKS"
 chooseP12File = "Вибрати файл PKCS12"
 choosePfxFile = "Вибрати файл PFX"
@@ -2082,6 +2124,7 @@ title = "Підпи� �ертифікатом"
 invisible = "�евидимий"
 stepTitle = "Вигл�д підпи�у"
 visible = "Видимий"
+visibility = "Видимі�ть"
 
 [certSign.appearance.options]
 title = "Деталі підпи�у"
@@ -2188,6 +2231,252 @@ bullet4 = "Може викори�товувати кори�тувацькі �
 text = "Під ча� перевірки ін�трумент повідомл�є, чи дій�ні підпи�и, хто підпи�ав документ, коли його підпи�ано та чи змінював�� документ пі�л� підпи�анн�."
 title = "Перевірка підпи�ів"
 
+[certSign.collab.finalize]
+button = "Завершити та завантажити підпи�аний PDF"
+early = "Завершити з поточними підпи�ами"
+
+[certSign.collab.sessionDetail]
+addButton = "Додати уча�ників"
+addParticipants = "Додати уча�ників"
+addParticipantsError = "�е вдало�� додати уча�ників"
+backToList = "�азад до �еан�ів"
+deleteConfirm = "Ви впевнені? Це неможливо �ка�увати."
+deleteError = "�е вдало�� видалити �еан�"
+deleted = "Сеан� видалено"
+deleteSession = "Видалити �еан�"
+dueDate = "Кінцевий термін"
+finalizeError = "�е вдало�� завершити �еан�"
+loadPdfError = "�е вдало�� завантажити підпи�аний PDF"
+loadSignedPdf = "Завантажити підпи�аний PDF до активних файлів"
+messageLabel = "Повідомленн�"
+noAdditionalInfo = "�емає додаткової інформації"
+owner = "Вла�ник"
+participantRemoved = "Уча�ника видалено"
+participants = "Уча�ники"
+participantsAdded = "Уча�ників у�пішно додано"
+removeParticipant = "Видалити"
+removeParticipantError = "�е вдало�� видалити уча�ника"
+selectUsers = "Виберіть кори�тувачів..."
+sessionInfo = "Інформаці� про �еан�"
+workbenchTitle = "Керуванн� �еан�ом"
+
+[certSign.collab.signRequest]
+addedToFiles = "Документ додано до активних файлів"
+addSignature = "Додайте �вій підпи�"
+addToFiles = "Додати до активних файлів"
+advancedSettings = "Розширені налаштуванн�"
+backToList = "�азад до запитів на підпи�"
+certificateChoice = "Виберіть �ертифікат дл� підпи�анн�"
+changeSignature = "Змінити підпи�"
+clearSignature = "Очи�тити підпи�"
+completeAndSign = "Завершити й підпи�ати"
+createNewSignature = "Створити новий підпи�"
+declineButton = "Відхилити"
+decline = "Відхилити запит"
+deleteSelected = "Видалити вибраний підпи�"
+drawSignature = "�амалюйте �вій підпи� нижче"
+dueDate = "Кінцевий термін"
+fileTooLarge = "Розмір файлу має бути меншим за 5 МБ"
+fontFamily = "Шрифт"
+fontSize = "Розмір шрифту: {{size}}px"
+fontSizePlaceholder = "Розмір"
+from = "Від"
+invalidCertFile = "Виберіть файл �ертифіката P12 або PFX"
+invalidFileType = "Виберіть файл зображенн�"
+location = "Мі�цезнаходженн� (необов’�зково)"
+locationPlaceholder = "Звідки ви підпи�уєте?"
+message = "Повідомленн�"
+noCertificate = "Виберіть файл �ертифіката"
+noSignatures = "Розмі�тіть щонайменше один підпи� на PDF"
+p12File = "Файл �ертифіката P12/PFX"
+password = "Пароль �ертифіката"
+passwordPlaceholder = "Введіть пароль..."
+penColor = "Колір пера"
+penSize = "Розмір пера: {{size}}px"
+placementActive = "Клацніть по PDF, щоб розмі�тити"
+placeSignatureButton = "Розмі�тити підпи� на PDF"
+reason = "Причина (необов’�зково)"
+reasonPlaceholder = "Чому ви підпи�уєте?"
+removeImage = "Видалити зображенн�"
+removeCertFile = "Видалити файл"
+savedSignatures = "Збережені підпи�и"
+selectFile = "Виберіть файл зображенн�"
+selectSignatureTitle = "Виберіть або �творіть підпи�"
+signButton = "Підпи�ати документ"
+signatureInfo = "Ці налаштуванн� задає вла�ник документа"
+signaturePlaced = "Підпи� розміщено на �торінці"
+signatureSettings = "�алаштуванн� підпи�у"
+signatureText = "Тек�т підпи�у"
+signatureTextPlaceholder = "Введіть �воє ім’�..."
+signatureTypeLabel = "Тип підпи�у"
+signingTitle = "Підпи�анн�"
+textColor = "Колір тек�ту"
+typeSignature = "Введіть �воє ім’�, щоб �творити підпи�"
+uploadCert = "Вла�ний �ертифікат"
+uploadCertDesc = "Викори�товуйте вла�ний �ертифікат P12/PFX"
+uploadSignature = "Завантажте зображенн� �вого підпи�у"
+usePersonalCert = "Пер�ональний �ертифікат"
+usePersonalCertDesc = "�втоматично �творений дл� вашого облікового запи�у"
+useServerCert = "Сертифікат організації"
+useServerCertDesc = "Спільний �ертифікат організації"
+workbenchTitle = "Запит на підпи�"
+
+[certSign.collab.signRequest.canvas]
+colorPickerTitle = "Виберіть колір штриха"
+continue = "Продовжити"
+
+[certSign.collab.signRequest.certModal]
+description = "Ви розмі�тили {{count}} підпи�(и). Виберіть �вій �ертифікат, щоб завершити підпи�анн�."
+sign = "Підпи�ати документ"
+certValidating = "Перевірка �ертифіката..."
+certValidUntil = "Сертифікат дій�ний до {{date}}"
+certInvalid = "Сертифікат недій�ний: {{error}}"
+certInvalidFallback = "�едій�ний �ертифікат"
+certNetworkError = "�е вдало�� перевірити �ертифікат"
+title = "�алаштуванн� �ертифіката"
+
+[certSign.collab.signRequest.image]
+hint = "Завантажте зображенн� PNG або JPG вашого підпи�у"
+
+[certSign.collab.signRequest.mode]
+move = "Перемі�тити підпи�"
+place = "Розмі�тити підпи�"
+title = "Режим підпи�у або переміщенн�"
+
+[certSign.collab.signRequest.modeTabs]
+draw = "Малюванн�"
+image = "Завантажити"
+text = "Тек�т"
+
+[certSign.collab.signRequest.placeSignature]
+message = "Клацніть по PDF, щоб розмі�тити �вій підпи�"
+title = "Розміщенн� підпи�у"
+
+[certSign.collab.signRequest.preview]
+imageAlt = "Вибраний підпи�"
+missing = "Попередній перегл�д від�утній"
+textFallback = "Підпи�"
+
+[certSign.collab.signRequest.saved]
+defaultCanvasLabel = "�амальований підпи�"
+defaultImageLabel = "Завантажений підпи�"
+defaultLabel = "Підпи�"
+defaultTextLabel = "Введений підпи�"
+delete = "Видалити підпи�"
+none = "�емає збережених підпи�ів"
+
+[certSign.collab.signRequest.signatureType]
+draw = "Малюванн�"
+type = "Тек�т"
+upload = "Завантаженн�"
+
+[certSign.collab.signRequest.steps]
+back = "�азад"
+cancelPlacement = "Ска�увати розміщенн�"
+certificate = "Сертифікат"
+clickMultipleTimes = "Клацніть по PDF кілька разів, щоб розмі�тити підпи�и. Перет�гніть будь-�кий підпи�, щоб перемі�тити або змінити його розмір."
+clickToPlace = "Клацніть по PDF, де має з’�вити�� ваш підпи�."
+continue = "Продовжити до вибору �ертифіката"
+continueToPlacement = "Продовжити до розміщенн�"
+continueToReview = "Продовжити до перегл�ду"
+createSignature = "Створити підпи�"
+invisible = "�евидимий"
+location = "Мі�цезнаходженн�:"
+multipleSignatures = "{{count}} підпи�ів буде за�то�овано до PDF"
+oneSignature = "1 підпи� буде за�то�овано до PDF"
+placeOnPdf = "Розмі�тити на PDF"
+reason = "Причина:"
+reviewTitle = "Перегл�ньте перед підпи�анн�м"
+signaturePlaced = "Підпи� розміщено на �торінці {{page}}. Ви можете �коригувати позицію, клацнувши ще раз, або перейти до перегл�ду."
+visible = "Видимий"
+visibility = "Видимі�ть:"
+yourSignatures = "Ваші підпи�и ({{count}})"
+
+[certSign.collab.signRequest.text]
+colorLabel = "Колір"
+fontLabel = "Шрифт"
+fontSizeLabel = "Розмір"
+fontSizePlaceholder = "16"
+label = "Тек�т підпи�у"
+modalHint = "Введіть �воє ім’�, потім нати�ніть «Продовжити», щоб розмі�тити його на PDF."
+placeholder = "Введіть �воє ім’�..."
+
+[certSign.collab.participant]
+certValidating = "Перевірка �ертифіката..."
+certValid = "✓ Сертифікат дій�ний"
+certValidUntil = " до {{date}}"
+certInvalid = "✗ {{error}}"
+certInvalidFallback = "�едій�ний �ертифікат"
+certNetworkError = "�е вдало�� перевірити �ертифікат"
+
+[certSign.collab.addParticipants]
+add = "Додати {{count}} уча�ника"
+back = "�азад"
+configureSignatures = "�алаштувати параметри підпи�у"
+continue = "Продовжити до налаштувань підпи�у"
+reasonHelp = "Попередньо в�тановіть причину підпи�анн� дл� цих уча�ників (необов’�зково, вони можуть змінити під ча� підпи�анн�)"
+reasonPlaceholder = "напр., Затвердженн�, Перегл�д..."
+selectUsers = "Виберіть кори�тувачів"
+
+[certSign.collab.sessionCreation]
+includeSummaryPage = "Додати �торінку з під�умком підпи�ів"
+includeSummaryPageHelp = "�априкінці буде додано �торінку з у�іма метаданими підпи�ів. Пол� підпи�ів цифрових �ертифікатів на окремих �торінках будуть приховані (вла�норучні підпи�и не зачіпають��)."
+
+[certSign.collab.sessionList]
+active = "�ктивні"
+finalized = "Завершені"
+
+[certSign.collab.signatureSettings]
+description = "�алаштуйте вигл�д підпи�ів дл� в�іх уча�ників"
+title = "Вигл�д підпи�у"
+
+[certSign.collab.userSelector]
+inviteUsers = "Додати кори�тувачів"
+loadError = "�е вдало�� завантажити кори�тувачів"
+noTeam = "Без команди"
+noUsers = "Інших кори�тувачів не знайдено."
+placeholder = "Виберіть кори�тувачів..."
+
+[certSign.mobile]
+panelActions = "Дії"
+panelDocument = "Документ"
+panelPeople = "Люди"
+
+[certSign.sessions]
+deleted = "Сеан� видалено"
+fetchFailed = "�е вдало�� завантажити деталі �еан�у"
+finalized = "Сеан� завершено"
+loaded = "Підпи�аний PDF завантажено"
+pdfNotReady = "PDF не готовий"
+pdfNotReadyDesc = "Генеруєть�� підпи�аний PDF. Повторіть �пробу згодом."
+
+[certificateChoice.tooltip]
+header = "Типи �ертифікатів"
+
+[certificateChoice.tooltip.organization]
+bullet1 = "Керуєть�� адміні�траторами �и�теми"
+bullet2 = "Спільний дл� авторизованих кори�тувачів"
+bullet3 = "Пред�тавл�є компанію, а не окрему о�обу"
+bullet4 = "�айкраще дл�: офіційних документів, командних підпи�ів"
+description = "Спільний �ертифікат, наданий вашою організацією. Викори�товуєть�� дл� загальноорганізаційного підпи�анн�."
+title = "Сертифікат організації"
+
+[certificateChoice.tooltip.personal]
+bullet1 = "�втоматично �творюєть�� під ча� першого викори�танн�"
+bullet2 = "Прив’�заний до вашого облікового запи�у"
+bullet3 = "�е може бути �пільним з іншими кори�тувачами"
+bullet4 = "�айкраще дл�: о�оби�тих документів, індивідуальної відповідально�ті"
+description = "�втоматично �творений �ертифікат, унікальний дл� вашого облікового запи�у. Підходить дл� індивідуальних підпи�ів."
+title = "Пер�ональний �ертифікат"
+
+[certificateChoice.tooltip.upload]
+bullet1 = "Потрібен файл P12/PFX і пароль"
+bullet2 = "Може бути виданий зовнішніми центрами �ертифікації"
+bullet3 = "Вищий рівень довіри дл� юридичних документів"
+bullet4 = "�айкраще дл�: юридично зобов’�зуючих контрактів, зовнішньої валідації"
+description = "Викори�товуйте вла�ний файл �ертифіката PKCS#12. Забезпечує повний контроль над вла�тиво�т�ми �ертифіката."
+title = "Завантажити вла�ний P12"
+
 [changeCreds]
 changePassword = "Ви викори�товуєте завод�ькі облікові дані дл� входу. Будь ла�ка, введіть новий пароль"
 changeUsername = "Оновіть ім’� кори�тувача. Пі�л� оновленн� ва� буде виведено із �и�теми."
@@ -3242,6 +3531,46 @@ totalSelected = "У�ього вибрано"
 unsupported = "�епідтримуваний"
 unzip = "Розпакувати"
 uploadError = "�е вдало�� завантажити де�кі файли."
+copyCreated = "Копію збережено на цьому при�трої."
+copyFailed = "�е вдало�� �творити копію."
+leaveShare = "Видалити з мого �пи�ку"
+leaveShareFailed = "�е вдало�� видалити �пільний файл."
+leaveShareSuccess = "Видалено з вашого �пи�ку �пільного до�тупу."
+removeBoth = "Видалити в обох мі�ц�х"
+removeFilePrompt = "Цей файл збережено на цьому при�трої та на вашому �ервері. Де ви хочете його видалити?"
+removeFileTitle = "Видалити файл"
+removeLocalOnly = "Лише з цього при�трою"
+removeServerFailed = "�е вдало�� видалити файл із �ервера."
+removeServerOnly = "Лише із �ервера"
+removeServerOnlyPrompt = "Цей файл зберігаєть�� лише на вашому �ервері. Видалити його із �ервера?"
+removeServerSuccess = "Видалено із �ервера."
+removeSharedPrompt = "Цей файл надано вам у �пільний до�туп. Ви можете видалити його з цього при�трою або зі �вого �пи�ку �пільного до�тупу."
+removeSharedServerOnlyBlockedPrompt = "Цей файл надано вам у �пільний до�туп і зберігаєть�� лише на �ервері."
+removeSharedServerOnlyPrompt = "Цей файл надано вам у �пільний до�туп і зберігаєть�� лише на �ервері. Видалити його зі �вого �пи�ку?"
+changesNotUploaded = "Зміни не завантажено"
+cloudFile = "Хмарний файл"
+filterAll = "У�і"
+filterLocal = "Локальні"
+filterSharedByMe = "�адані мною"
+filterSharedWithMe = "�адані мені"
+lastSynced = "Во�таннє �инхронізовано"
+localOnly = "Лише локально"
+makeCopy = "Створити копію"
+owner = "Вла�ник"
+ownerUnknown = "�евідомо"
+share = "Поділити��"
+shareSelected = "Поділити�� вибраними"
+sharedByYou = "�адано вами"
+sharedEditNoticeBody = "У ва� немає прав редагуванн� �ерверної вер�ії цього файлу. Будь-�кі зміни буде збережено �к локальну копію."
+sharedEditNoticeConfirm = "Зрозуміло"
+sharedEditNoticeTitle = "Копі� на �ервері лише дл� читанн�"
+sharedWithYou = "�адано вам"
+sharing = "Спільний до�туп"
+storageState = "Сховище"
+synced = "Синхронізовано"
+updateOnServer = "Оновити на �ервері"
+uploadSelected = "Завантажити вибрані"
+uploadToServer = "Завантажити на �ервер"
 
 [files]
 addFiles = "Додати файли"
@@ -3367,6 +3696,77 @@ title = "Про �плющенн� PDF"
 discord = "Discord"
 issues = "GitHub"
 
+[groupSigning.tooltip]
+header = "Про групове підпи�анн�"
+
+[groupSigning.tooltip.finalization]
+bullet1 = "У�і підпи�и за�то�овують�� у вказаному вами пор�дку уча�ників"
+bullet2 = "За потреби ви можете завершити з ча�тиною підпи�ів"
+bullet3 = "Пі�л� завершенн� �еан� не можна змінити"
+description = "Пі�л� того �к у�і уча�ники підпи�али (або ви вирішили завершити раніше), ви можете згенерувати о�таточний підпи�аний PDF."
+title = "Проце� завершенн�"
+
+[groupSigning.tooltip.roles]
+bullet1 = "Вла�ник (ви): �творює �еан�, налаштовує параметри підпи�у за замовчуванн�м, завершує документ"
+bullet2 = "Уча�ники: �творюють �вій підпи�, обирають �ертифікат, розміщують на PDF"
+bullet3 = "Уча�ники не можуть змінювати налаштуванн� видимо�ті, причини чи мі�цезнаходженн� підпи�у"
+description = "Ви керуєте налаштуванн�м вигл�ду підпи�у дл� в�іх уча�ників."
+title = "Ролі уча�ників"
+
+[groupSigning.tooltip.sequential]
+bullet1 = "Перший уча�ник має підпи�ати, перш ніж другий отримає до�туп до документа"
+bullet2 = "Забезпечує належний пор�док підпи�анн� дл� юридичної відповідно�ті"
+bullet3 = "Ви можете змінити пор�док уча�ників, перет�гуючи їх у �пи�ку"
+description = "Уча�ники підпи�ують документи у визначеному вами пор�дку. Кожен підпи�ант отримує �повіщенн�, коли на�тає його черга."
+title = "По�лідовне підпи�анн�"
+
+[groupSigning.steps]
+back = "�азад"
+completed = "Завершено"
+current = "Поточний"
+stepLabel = "Крок {{number}}"
+
+[groupSigning.steps.configureDefaults]
+continue = "Продовжити до перегл�ду"
+invisible = "Підпи�и будуть невидимими (лише метадані)"
+locationLabel = "Мі�цезнаходженн�:"
+preview = "Перегл�д"
+reasonLabel = "Причина:"
+title = "�алаштувати параметри підпи�у"
+visible = "Підпи�и будуть видимими на �торінці {{page}}"
+
+[groupSigning.steps.review]
+document = "Документ"
+dueDate = "Кінцевий термін (необов’�зково)"
+dueDatePlaceholder = "Виберіть кінцеву дату..."
+invisible = "�евидимий (лише метадані)"
+location = "Мі�цезнаходженн�:"
+logo = "Логотип:"
+logoHidden = "Без логотипа"
+logoShown = "Показано логотип Stirling PDF"
+participants = "Уча�ники"
+reason = "Причина:"
+send = "�аді�лати запити на підпи�анн�"
+signatureSettings = "�алаштуванн� підпи�у"
+title = "Перегл�нути деталі �еан�у"
+titleShort = "Перегл�д і над�иланн�"
+visibility = "Видимі�ть:"
+visible = "Видимий на �торінці {{page}}"
+participantCount = "{{count}} уча�ник(и) підпи�уватимуть по пор�дку"
+
+[groupSigning.steps.selectDocument]
+continue = "Продовжити до вибору уча�ників"
+noFile = "Виберіть один файл PDF зі �воїх активних файлів, щоб �творити �еан� підпи�анн�."
+selectedFile = "Вибраний документ"
+title = "Виберіть документ"
+
+[groupSigning.steps.selectParticipants]
+continue = "Продовжити до налаштувань підпи�у"
+count = "Вибрано {{count}} уча�ник(ів)"
+label = "Виберіть уча�ників"
+placeholder = "Виберіть уча�ників дл� підпи�анн�..."
+title = "Виберіть уча�ників"
+
 [getPdfInfo]
 downloadJson = "Завантажити JSON"
 downloads = "Завантаженн�"
@@ -4460,7 +4860,10 @@ zoomOut = "Зменшити"
 
 [viewer]
 cannotPreviewFile = "�е вдаєть�� перегл�нути файл"
+disableColorFilter = "Вимкнути кольоровий фільтр"
 dualPageView = "Парний перегл�д"
+enableDarkFilter = "Увімкнути темний фільтр"
+enableSepiaFilter = "Увімкнути фільтр �епії"
 firstPage = "Перша �торінка"
 lastPage = "О�танн� �торінка"
 nextPage = "�а�тупна �торінка"
@@ -4470,6 +4873,22 @@ singlePageView = "Одинарний перегл�д"
 unknownFile = "�евідомий файл"
 zoomIn = "Збільшити"
 zoomOut = "Зменшити"
+resetZoom = "Скинути ма�штаб"
+
+[viewer.nonPdf]
+fileTypeBadge = "Файл {{type}}"
+convertToPdf = "Перетворити в PDF"
+loading = "Завантаженн�..."
+emptyFile = "Порожній файл"
+csvStats = "{{rows}} р�дків · {{columns}} �товпців · {{size}}"
+sortedBy = "Від�ортовано за: {{column}}"
+columnDefault = "Стовпець {{index}}"
+htmlPreviewWarning = "Попередній перегл�д HTML — зовнішні ре�ур�и можуть не завантажити�� · {{size}}"
+htmlPreview = "Попередній перегл�д HTML"
+invalidJson = "�екоректний JSON — показ вмі�ту �к є"
+textStats = "{{lines}} р�дків · {{size}}"
+lineNumbers = "�омери р�дків"
+renderMarkdown = "Відображати Markdown"
 
 [viewer.attachments]
 title = "Вкладенн�"
@@ -4531,6 +4950,7 @@ toggleAttachments = "Показати/приховати вкладенн�"
 toggleTheme = "Перемкнути тему"
 language = "Мова"
 toggleAnnotations = "Перемкнути видимі�ть анотацій"
+toggleLayers = "Перемкнути шари"
 search = "Пошук у PDF"
 panMode = "Режим переміщенн�"
 applyRedactionsFirst = "Спочатку за�то�уйте зачорненн�"
@@ -5407,20 +5827,72 @@ title = "Роздрукувати файл"
 2 = "Обрати назву прінтера"
 
 [quickAccess]
+access = "До�туп"
+accessAddPerson = "Додати ще одну о�обу"
+accessBack = "�азад"
+accessCopyLink = "Копіювати по�иланн�"
+accessEmail = "Електронна адре�а"
+accessEmailPlaceholder = "name@company.com"
+accessFileLabel = "Файл"
+accessGeneral = "Загальний до�туп"
+accessInviteTitle = "Запро�ити людей"
+accessOwner = "Вла�ник"
+accessPanel = "До�туп до документа"
+accessPeople = "О�оби з до�тупом"
+accessRemove = "Видалити"
+accessRestricted = "Обмежений"
+accessRestrictedHint = "Лише о�оби з до�тупом можуть відкривати"
+accessRole = "Роль"
+accessRoleCommenter = "Коментатор"
+accessRoleEditor = "Редактор"
+accessRoleViewer = "Перегл�дач"
+accessSelectedFile = "Вибраний файл"
+accessSendInvite = "�аді�лати запрошенн�"
+accessTitle = "До�туп до документа"
+accessYou = "Ви"
 account = "Профіль"
+activeSessions = "�ктивні �еан�и"
+activeTab = "�ктивні"
 activity = "Журнал"
 adminSettings = "�алашт. адміна"
+allSessions = "У�і �еан�и"
 allTools = "All Tools"
 automate = "�втомат."
+back = "�азад"
+certSign = "Підпи� �ертифікатом"
+completedSessions = "Завершені �еан�и"
+completedTab = "Завершені"
 config = "Конфіг"
+createNew = "Створити новий запит"
+createSession = "Створити запит на підпи�анн�"
+dueDate = "Кінцевий термін (необов’�зково)"
 files = "Файли"
 help = "Довідка"
+noActiveSessions = "�емає очікуваних запитів на підпи� або активних �еан�ів"
+noCompletedSessions = "�емає завершених �еан�ів"
+noFile = "Файл не вибрано"
 read = "Читати"
 reader = "Перегл�д"
+refresh = "Оновити"
+requestSignatures = "Запро�ити підпи�и"
+selectSingleFileToRequest = "Виберіть один файл PDF, щоб запро�ити підпи�и"
+selectedFile = "Вибраний файл"
+selectUsers = "Виберіть кори�тувачів дл� підпи�анн�"
+selectUsersPlaceholder = "Виберіть уча�ників..."
+sendingRequest = "�ад�иланн�..."
 settings = "�алашт."
 showMeAround = "Проведіть ек�кур�ію"
 sign = "Підпи�"
+signatureRequests = "Запити на підпи�анн�"
+signYourself = "Підпи�ати �амо�тійно"
+newRequest = "�овий запит"
 tours = "Тури"
+wetSign = "Додати підпи�"
+filterMine = "Мої"
+filterOverdue = "Про�трочені"
+filterSigned = "Підпи�ані"
+filterDeclined = "Відхилені"
+searchDocuments = "Пошук документів…"
 
 [quickAccess.helpMenu]
 adminTour = "Огл�д адміні�тратора"
@@ -6050,11 +6522,75 @@ toolNotAvailableLocally = "Ваш �ервер Stirling-PDF офлайн і \"{{
 expired = "Ваш �еан� закінчив��. Будь ла�ка, оновіть �торінку та повторіть �пробу."
 refreshPage = "Оновити �торінку"
 
+[sessionManagement.tooltip]
+header = "Керуванн� �еан�ами підпи�анн�"
+
+[sessionManagement.tooltip.addParticipants]
+bullet1 = "�ових уча�ників додають у кінець пор�дку підпи�анн�"
+bullet2 = "�еможливо додати уча�ників пі�л� завершенн� �еан�у"
+bullet3 = "Кожен уча�ник отримує �повіщенн�, коли на�тає його черга"
+description = "Ви можете додати більше уча�ників до активного �еан�у в будь-�кий ча� до завершенн�."
+title = "Додаванн� уча�ників"
+
+[sessionManagement.tooltip.finalization]
+bullet1 = "<b>Повне завершенн�</b>: У�і уча�ники підпи�али"
+bullet2 = "<b>Ча�ткове завершенн�</b>: Де�кі уча�ники ще не підпи�али"
+bullet3 = "�епідпи�ані уча�ники будуть виключені з о�таточного документа"
+bullet4 = "Пі�л� завершенн� ви можете завантажити підпи�аний PDF до активних файлів"
+description = "Завершенн� об’єднує в�і підпи�и в один підпи�аний PDF. Цю дію неможливо �ка�увати."
+title = "Завершенн� �еан�у"
+
+[sessionManagement.tooltip.participantRemoval]
+bullet1 = "�еможливо видалити уча�ників, �кі вже підпи�али"
+bullet2 = "Видалені уча�ники більше не отримуватимуть �повіщень"
+bullet3 = "Пор�док підпи�анн� коригуєть�� автоматично"
+description = "Уча�ників можна видалити із �еан�ів до того, �к вони підпишуть."
+title = "Видаленн� уча�ників"
+
+[sessionManagement.tooltip.signatureOrder]
+bullet1 = "Кожен підпи� за�то�овуєть�� до PDF по�лідовно"
+bullet2 = "�а�тупні уча�ники можуть бачити попередні підпи�и"
+bullet3 = "Важливо дл� проце�ів затвердженн� та юридичних ланцюгів збереженн� доказів"
+description = "Пор�док, �кий ви вказуєте під ча� �творенн� �еан�у, визначає, хто підпи�ує першим."
+title = "Пор�док підпи�ів"
+
+[signatureSettings.tooltip]
+header = "Параметри вигл�ду підпи�у"
+
+[signatureSettings.tooltip.location]
+bullet1 = "Приклади: \"New York, USA\", \"London Office\", \"Remote\""
+bullet2 = "�е те �аме, що розташуванн� на �торінці"
+bullet3 = "Може бути обов’�зковим у де�ких юри�дикці�х"
+description = "Додаткове географічне мі�цезнаходженн�, де було за�то�овано підпи�. Зберігаєть�� в метаданих �ертифіката."
+title = "Мі�цезнаходженн� підпи�у"
+
+[signatureSettings.tooltip.logo]
+bullet1 = "Показуєть�� поруч із підпи�ом і тек�том"
+bullet2 = "Підтримує формати PNG, JPG"
+bullet3 = "Під�илює профе�ійний вигл�д"
+description = "Додайте логотип компанії до видимих підпи�ів дл� брендуванн� та автентично�ті."
+title = "Логотип компанії"
+
+[signatureSettings.tooltip.reason]
+bullet1 = "Приклади: \"Approval\", \"Contract Agreement\", \"Review Complete\""
+bullet2 = "Видимо у вла�тиво�т�х підпи�у PDF"
+bullet3 = "Кори�но дл� журналів аудиту та відповідно�ті"
+description = "Додатковий тек�т, �кий по��нює, чому документ підпи�уєть��. Зберігаєть�� в метаданих �ертифіката."
+title = "Причина підпи�у"
+
+[signatureSettings.tooltip.visibility]
+bullet1 = "<b>Видимий</b>: Підпи� відображаєть�� на PDF із на�троюваним вигл�дом"
+bullet2 = "<b>�евидимий</b>: Сертифікат вбудовано без візуальної позначки"
+bullet3 = "�евидимі підпи�и в�е одно забезпечують криптографічну перевірку"
+description = "Керує тим, чи підпи� видимий у документі або вбудований невидимо."
+title = "Видимі�ть підпи�у"
+
 [settings.configuration]
 advanced = "Додатково"
 database = "База даних"
 endpoints = "Кінцеві точки"
 features = "Функції"
+storageSharing = "Зберіганн� файлів і �пільний до�туп"
 systemSettings = "Си�темні налаштуванн�"
 title = "Конфігураці�"
 
@@ -6332,10 +6868,13 @@ title = "Увійдіть до Stirling"
 [setup.selfhosted]
 link = "або підключіть�� до �амохо�тингового облікового запи�у"
 subtitle = "Введіть облікові дані �ервера"
+changeServerLocked = "Ваша організаці� обмежила цей за�то�унок певним �ервером"
 switchToLocal = "�атомі�ть викори�товувати локальні ін�трументи"
 title = "Увійдіть на �ервер"
 
 [setup.selfhosted.unreachable]
+changeServer = "Підключити�� до іншого �ервера"
+changeServerLocked = "Ваша організаці� обмежила цей за�то�унок певним �ервером"
 continueOffline = "�атомі�ть викори�товувати локальні ін�трументи"
 message = "�е вдало�� підключити�� до {{url}}. Переконайте��, що �ервер запущено й він до�тупний."
 retry = "Повторити �пробу"
@@ -6529,6 +7068,15 @@ saved = "Збережені"
 text = "Тек�т"
 title = "Тип підпи�у"
 
+[signRequest]
+declined = "Запит на підпи� відхилено"
+fetchFailed = "�е вдало�� завантажити запит на підпи�"
+signed = "Документ у�пішно підпи�ано"
+
+[signSession]
+createFailed = "�е вдало�� �творити запит на підпи�анн�"
+created = "Запит на підпи�анн� наді�лано"
+
 [signup]
 accountCreatedSuccessfully = "Обліковий запи� у�пішно �творено! Тепер ви можете увійти."
 alreadyHaveAccount = "Вже маєте обліковий запи�? Увійдіть"
@@ -6807,6 +7355,106 @@ title = "Розділити PDF по главам"
 [splitPdfByChapters]
 tags = "поділ,глави,закладки,організаці�"
 
+[storageShare]
+accessed = "Отримано до�туп"
+accessDenied = "У ва� немає до�тупу до цього �пільного файлу. Попро�іть вла�ника надати вам до�туп."
+accessFailed = "�е вдало�� завантажити активні�ть."
+accessDeniedBody = "У ва� немає до�тупу до цього файлу. Попро�іть вла�ника надати вам до�туп."
+accessDeniedTitle = "�емає до�тупу"
+accessLimitedCommenter = "До�туп дл� коментуванн� з’�вить�� найближчим ча�ом. Попро�іть у вла�ника права редактора, �кщо потрібно завантажити."
+accessLimitedTitle = "Обмежений до�туп"
+accessLimitedViewer = "Це по�иланн� лише дл� перегл�ду. Попро�іть у вла�ника права редактора, �кщо потрібно завантажити."
+createdAt = "Створено"
+download = "Завантажити"
+downloadFailed = "�е вдало�� завантажити цей файл."
+expiredBody = "Це по�иланн� дл� �пільного до�тупу недій�не або �трок його дії минув."
+expiredTitle = "Термін дії по�иланн� минув"
+goToLogin = "Перейти до входу"
+loadFailed = "�е вдало�� відкрити �пільний файл."
+loading = "Завантаженн� по�иланн� на �пільний до�туп..."
+loginPrompt = "Увійдіть, щоб отримати до�туп до цього �пільного файлу."
+loginRequired = "Потрібен вхід"
+openInApp = "Відкрити в Stirling PDF"
+ownerLabel = "Вла�ник"
+ownerUnknown = "�евідомо"
+requiresLogin = "Дл� цього �пільного файлу потрібен вхід."
+roleCommenter = "Коментатор"
+roleEditor = "Редактор"
+roleViewer = "Перегл�дач"
+shareHeading = "Спільний файл"
+titleDefault = "Спільний файл"
+tryAgain = "Повторіть �пробу пізніше."
+addUser = "Додати"
+commenterHint = "Функцію коментуванн� буде додано найближчим ча�ом."
+copied = "По�иланн� �копійовано в буфер обміну"
+copy = "Копіювати"
+copyFailed = "�е вдало�� �копіювати"
+description = "Створіть по�иланн� дл� �пільного до�тупу до цього файлу. �вторизовані кори�тувачі з по�иланн�м зможуть отримати до�туп."
+downloadsCount = "Завантажень: {{count}}"
+emailWarningBody = "Це �хоже на адре�у електронної пошти. Якщо ц� о�оба ще не є кори�тувачем Stirling PDF, вона не зможе отримати до�туп до файлу."
+emailWarningConfirm = "�адати до�туп у�е одно"
+emailWarningTitle = "Електронна адре�а"
+errorTitle = "�е вдало�� надати до�туп"
+failure = "�е вдало�� згенерувати по�иланн� дл� �пільного до�тупу. Спробуйте ще раз."
+fileLabel = "Файл"
+generate = "Згенерувати по�иланн�"
+generated = "По�иланн� дл� �пільного до�тупу згенеровано"
+hideActivity = "Приховати активні�ть"
+invalidUsername = "Введіть дій�не ім’� кори�тувача або адре�у електронної пошти."
+lastAccessed = "О�танній до�туп"
+linkAccessTitle = "До�туп за по�иланн�м"
+linkLabel = "По�иланн� дл� �пільного до�тупу"
+linksDisabled = "По�иланн� дл� �пільного до�тупу вимкнено."
+linksDisabledBody = "По�иланн� дл� �пільного до�тупу вимкнено вашими налаштуванн�ми �ервера."
+manage = "Керувати �пільним до�тупом"
+manageDescription = "Створюйте та керуйте по�иланн�ми дл� �пільного до�тупу до цього файлу."
+manageLoadFailed = "�е вдало�� завантажити по�иланн� дл� �пільного до�тупу."
+manageTitle = "Керуванн� �пільним до�тупом"
+noActivity = "�ктивно�ті ще немає."
+noLinks = "Ще немає активних по�илань дл� �пільного до�тупу."
+noSharedUsers = "Ще немає кори�тувачів із до�тупом."
+removeLink = "Видалити по�иланн�"
+removeUser = "Видалити"
+revokeFailed = "�е вдало�� видалити по�иланн� дл� �пільного до�тупу."
+revoked = "По�иланн� дл� �пільного до�тупу видалено"
+roleLabel = "Роль"
+sharingDisabled = "Спільний до�туп вимкнено."
+sharingDisabledBody = "Спільний до�туп вимкнено налаштуванн�ми вашого �ервера."
+sharedUsersTitle = "Кори�тувачі з до�тупом"
+title = "Поділити�� файлом"
+unknownUser = "�евідомий кори�тувач"
+userAddFailed = "�е вдало�� надати до�туп цьому кори�тувачеві."
+userAdded = "Кори�тувача додано до �пи�ку �пільного до�тупу."
+usernameLabel = "Ім'� кори�тувача або електронна пошта"
+usernamePlaceholder = "Введіть ім'� кори�тувача або електронну пошту"
+userRemoveFailed = "�е вдало�� видалити цього кори�тувача."
+userRemoved = "Кори�тувача видалено зі �пи�ку �пільного до�тупу."
+viewActivity = "Перегл�нути активні�ть"
+viewed = "Перегл�нуто"
+viewsCount = "Перегл�ди: {{count}}"
+downloaded = "Завантажено"
+bulkDescription = "Створіть одне по�иланн�, щоб надати �пільний до�туп до в�іх вибраних файлів дл� кори�тувачів, �кі ввійшли в �и�тему."
+bulkTitle = "Поділити�� вибраними файлами"
+copyLink = "Копіювати по�иланн� �пільного до�тупу"
+fileCount = "Вибрано файлів: {{count}}"
+ownerOnly = "Лише вла�ник може керувати �пільним до�тупом."
+selectSingleFile = "Виберіть один файл, щоб керувати �пільним до�тупом."
+
+[storageUpload]
+description = "Це завантажить поточний файл у �ерверне �ховище дл� вашого до�тупу."
+errorTitle = "Помилка завантаженн�"
+failure = "�е вдало�� завантажити. Перевірте �вої облікові дані входу та налаштуванн� �ховища."
+fileLabel = "Файл"
+hint = "Публічні по�иланн� та режими до�тупу керують�� налаштуванн�ми вашого �ервера."
+success = "Завантажено на �ервер"
+title = "Завантажити на �ервер"
+updateButton = "Оновити на �ервері"
+uploadButton = "Завантажити на �ервер"
+bulkDescription = "Це завантажить вибрані файли у �ерверне �ховище."
+bulkTitle = "Завантажити вибрані файли"
+fileCount = "Вибрано файлів: {{count}}"
+more = " +{{count}} ще"
+
 [storage]
 approximateSize = "Приблизний розмір"
 fileTooLarge = "Файл завеликий. Мак�имальний розмір файлу �тановить"
@@ -7153,6 +7801,30 @@ title = "Перегл�д/редагуванн� PDF"
 [warning]
 tooltipTitle = "Попередженн�"
 
+[wetSignature.tooltip]
+header = "Спо�оби �творенн� підпи�у"
+
+[wetSignature.tooltip.draw]
+bullet1 = "�алаштуйте колір і товщину пера"
+bullet2 = "Очищуйте та перемальовуйте, доки не будете задоволені"
+bullet3 = "Працює на �ен�орних при�тро�х (планшети, телефони)"
+description = "Створіть рукопи�ний підпи� за допомогою миші або �ен�орного екрана. �айкраще підходить дл� о�оби�тих, автентичних підпи�ів."
+title = "�амалювати підпи�"
+
+[wetSignature.tooltip.type]
+bullet1 = "Виберіть один із кількох шрифтів"
+bullet2 = "�алаштуйте розмір і колір тек�ту"
+bullet3 = "Ідеально дл� �тандартизованих підпи�ів"
+description = "Згенеруйте підпи� із введеного тек�ту. Швидко та уніфіковано, підходить дл� ділових документів."
+title = "Вве�ти підпи�"
+
+[wetSignature.tooltip.upload]
+bullet1 = "Підтримує PNG, JPG та інші формати зображень"
+bullet2 = "Дл� найкращих результатів рекомендовано прозоре тло"
+bullet3 = "Зображенн� буде змінено за розміром під обла�ть підпи�у"
+description = "Завантажте заздалегідь �творене зображенн� підпи�у. Ідеально, �кщо у ва� є від�канований підпи� або логотип компанії."
+title = "Завантажити зображенн� підпи�у"
+
 [watermark]
 completed = "Вод�ний знак додано"
 desc = "Додайте тек�тові або графічні вод�ні знаки до файлів PDF"
@@ -7333,6 +8005,7 @@ activeSession = "�ктивна �е�і�"
 addMembers = "Додати уча�ників"
 admin = "�дміні�тратор"
 confirmDelete = "Ви впевнені, що хочете видалити цього кори�тувача? Цю дію не можна �ка�увати."
+confirmUnlock = "Ви впевнені, що хочете розблокувати цей обліковий запи� кори�тувача?"
 deleteUser = "Видалити кори�тувача"
 deleteUserError = "�е вдало�� видалити кори�тувача"
 deleteUserSuccess = "Кори�тувача у�пішно видалено"
@@ -7341,6 +8014,8 @@ disable = "Вимкнути"
 disabled = "Вимкнено"
 editRole = "Редагувати роль"
 enable = "Увімкнути"
+locked = "заблоковано"
+lockedBadge = "Заблоковано"
 loading = "Завантаженн� уча�ників..."
 loginRequired = "Спочатку увімкніть режим входу"
 member = "Уча�ник"
@@ -7350,6 +8025,9 @@ searchMembers = "Пошук уча�ників..."
 status = "Стату�"
 team = "Команда"
 title = "Уча�ники"
+unlockAccount = "Розблокувати обліковий запи�"
+unlockUserError = "�е вдало�� розблокувати обліковий запи� кори�тувача"
+unlockUserSuccess = "Обліковий запи� кори�тувача у�пішно розблоковано"
 user = "Кори�тувач"
 
 [workspace.people.actions]
diff --git a/frontend/public/locales/vi-VN/translation.toml b/frontend/public/locales/vi-VN/translation.toml
index d451da4aa0..8c0d891b89 100644
--- a/frontend/public/locales/vi-VN/translation.toml
+++ b/frontend/public/locales/vi-VN/translation.toml
@@ -8,6 +8,7 @@ black = "�en"
 blue = "Xanh dÆ°Æ¡ng"
 bored = "Chán phải ch� đợi?"
 cancel = "Hủy"
+confirm = "Xác nhận"
 changedCredsMessage = "Thông tin đăng nhập đã thay đổi!"
 chooseFile = "Ch�n tệp"
 close = "�óng"
@@ -146,6 +147,7 @@ insufficientCredits = "Không đủ tín dụng. Cần: {{requiredCredits}}, Hi
 loadingCredits = "�ang kiểm tra tín dụng..."
 loadingProStatus = "�ang kiểm tra trạng thái đăng ký..."
 noticeTopUpOrPlan = "Không đủ tín dụng, vui lòng nạp thêm hoặc nâng cấp lên một gói"
+accessInvite = "M�i"
 
 [account]
 accountSettings = "Cài đặt tài khoản"
@@ -1427,6 +1429,34 @@ title = "Xử lý"
 description = "Th�i gian tối đa ch� một tác vụ xử lý trước khi báo lỗi."
 label = "Th�i gian ch� xử lý (giây)"
 
+[admin.settings.storage]
+description = "Kiểm soát tùy ch�n lưu trữ và chia sẻ trên máy chủ."
+title = "Lưu trữ & Chia sẻ Tệp"
+
+[admin.settings.storage.enabled]
+description = "Cho phép ngư�i dùng lưu trữ tệp trên máy chủ."
+label = "Bật Lưu trữ Tệp trên Máy chủ"
+
+[admin.settings.storage.sharing.email]
+description = "Cho phép chia sẻ qua địa chỉ email."
+label = "Bật Chia sẻ qua Email"
+mailLink = "Cấu hình Cài đặt Thư"
+mailNote = "Yêu cầu cấu hình thư. "
+
+[admin.settings.storage.sharing.enabled]
+description = "Cho phép ngư�i dùng chia sẻ các tệp đã lưu trữ."
+label = "Bật Chia sẻ"
+
+[admin.settings.storage.sharing.links]
+description = "Cho phép chia sẻ qua liên kết yêu cầu đăng nhập."
+frontendUrlLink = "Cấu hình trong Cài đặt Hệ thống"
+frontendUrlNote = "Yêu cầu Frontend URL. "
+label = "Bật Liên kết Chia sẻ"
+
+[admin.settings.storage.signing.enabled]
+description = "Cho phép ngư�i dùng tạo phiên ký tài liệu nhi�u ngư�i tham gia. Cần bật lưu trữ tệp trên máy chủ."
+label = "Bật Ký Nhóm (Alpha)"
+
 [admin.settings.unsavedChanges]
 cancel = "Tiếp tục chỉnh sửa"
 discard = "B� thay đổi"
@@ -2059,7 +2089,19 @@ numbers = "Số/khoảng: 5, 10-20"
 progressions = "Cấp số: 3n, 4n+1"
 
 [certSign]
+allSigned = "Tất cả ngư�i tham gia đã ký. Sẵn sàng hoàn tất."
+awaitingSignatures = "�ang ch� chữ ký"
+signatureProgress = "{{signedCount}}/{{totalCount}} chữ ký"
 chooseCertificate = "Ch�n tệp chứng chỉ"
+declined = "�ã từ chối"
+fetchFailed = "Không tải được dữ liệu ký"
+finalized = "�ã hoàn tất"
+notified = "�ang ch�"
+partialNote = "Bạn có thể hoàn tất sớm với các chữ ký hiện có. Những ngư�i chưa ký sẽ bị loại kh�i tài liệu."
+pending = "�ang ch�"
+readyToFinalize = "Sẵn sàng hoàn tất"
+signed = "�ã ký"
+viewed = "�ã xem"
 chooseJksFile = "Ch�n tệp JKS"
 chooseP12File = "Ch�n tệp PKCS12"
 choosePfxFile = "Ch�n tệp PFX"
@@ -2082,6 +2124,7 @@ title = "Ký bằng chứng chỉ"
 invisible = "Ẩn"
 stepTitle = "Hiển thị chữ ký"
 visible = "Hiển thị"
+visibility = "Mức hiển thị"
 
 [certSign.appearance.options]
 title = "Chi tiết chữ ký"
@@ -2188,6 +2231,252 @@ bullet4 = "Có thể dùng chứng chỉ tùy chỉnh để xác minh"
 text = "Khi bạn kiểm tra chữ ký, công cụ sẽ cho biết chúng có hợp lệ không, ai đã ký tài liệu, khi nào ký và liệu tài liệu có bị thay đổi sau khi ký không."
 title = "Kiểm tra chữ ký"
 
+[certSign.collab.finalize]
+button = "Hoàn tất và Tải PDF đã ký"
+early = "Hoàn tất với các chữ ký hiện có"
+
+[certSign.collab.sessionDetail]
+addButton = "Thêm ngư�i tham gia"
+addParticipants = "Thêm ngư�i tham gia"
+addParticipantsError = "Không thể thêm ngư�i tham gia"
+backToList = "Quay lại Các phiên"
+deleteConfirm = "Bạn có chắc không? Thao tác này không thể hoàn tác."
+deleteError = "Không thể xóa phiên"
+deleted = "�ã xóa phiên"
+deleteSession = "Xóa phiên"
+dueDate = "Ngày đến hạn"
+finalizeError = "Không thể hoàn tất phiên"
+loadPdfError = "Không tải được PDF đã ký"
+loadSignedPdf = "Tải PDF đã ký vào Tệp đang hoạt động"
+messageLabel = "Tin nhắn"
+noAdditionalInfo = "Không có thông tin bổ sung"
+owner = "Chủ sở hữu"
+participantRemoved = "�ã xóa ngư�i tham gia"
+participants = "Ngư�i tham gia"
+participantsAdded = "�ã thêm ngư�i tham gia thành công"
+removeParticipant = "Xóa"
+removeParticipantError = "Không thể xóa ngư�i tham gia"
+selectUsers = "Ch�n ngư�i dùng..."
+sessionInfo = "Thông tin phiên"
+workbenchTitle = "Quản lý phiên"
+
+[certSign.collab.signRequest]
+addedToFiles = "Tài liệu đã được thêm vào tệp đang hoạt động"
+addSignature = "Thêm chữ ký của bạn"
+addToFiles = "Thêm vào Tệp đang hoạt động"
+advancedSettings = "Cài đặt nâng cao"
+backToList = "Quay lại Yêu cầu ký"
+certificateChoice = "Ch�n một chứng chỉ để ký"
+changeSignature = "Thay đổi chữ ký"
+clearSignature = "Xóa chữ ký"
+completeAndSign = "Hoàn tất & Ký"
+createNewSignature = "Tạo chữ ký mới"
+declineButton = "Từ chối"
+decline = "Từ chối yêu cầu"
+deleteSelected = "Xóa chữ ký đã ch�n"
+drawSignature = "Vẽ chữ ký của bạn bên dưới"
+dueDate = "Ngày đến hạn"
+fileTooLarge = "Kích thước tệp phải nh� hơn 5MB"
+fontFamily = "Phông chữ"
+fontSize = "Cỡ chữ: {{size}}px"
+fontSizePlaceholder = "Cỡ"
+from = "Từ"
+invalidCertFile = "Vui lòng ch�n tệp chứng chỉ P12 hoặc PFX"
+invalidFileType = "Vui lòng ch�n tệp hình ảnh"
+location = "Vị trí (Tùy ch�n)"
+locationPlaceholder = "Bạn đang ký từ đâu?"
+message = "Tin nhắn"
+noCertificate = "Vui lòng ch�n tệp chứng chỉ"
+noSignatures = "Vui lòng đặt ít nhất một chữ ký lên PDF"
+p12File = "Tệp chứng chỉ P12/PFX"
+password = "Mật khẩu chứng chỉ"
+passwordPlaceholder = "Nhập mật khẩu..."
+penColor = "Màu bút"
+penSize = "Cỡ bút: {{size}}px"
+placementActive = "Nhấp vào PDF để đặt"
+placeSignatureButton = "�ặt chữ ký lên PDF"
+reason = "Lý do (Tùy ch�n)"
+reasonPlaceholder = "Tại sao bạn ký?"
+removeImage = "Xóa hình ảnh"
+removeCertFile = "Xóa tệp"
+savedSignatures = "Chữ ký đã lưu"
+selectFile = "Ch�n tệp hình ảnh"
+selectSignatureTitle = "Ch�n hoặc Tạo chữ ký"
+signButton = "Ký tài liệu"
+signatureInfo = "Các cài đặt này do chủ sở hữu tài liệu cấu hình"
+signaturePlaced = "�ã đặt chữ ký trên trang"
+signatureSettings = "Cài đặt chữ ký"
+signatureText = "Văn bản chữ ký"
+signatureTextPlaceholder = "Nhập tên của bạn..."
+signatureTypeLabel = "Loại chữ ký"
+signingTitle = "Ký"
+textColor = "Màu văn bản"
+typeSignature = "Nhập tên của bạn để tạo chữ ký"
+uploadCert = "Chứng chỉ tùy chỉnh"
+uploadCertDesc = "Sử dụng chứng chỉ P12/PFX của bạn"
+uploadSignature = "Tải lên hình ảnh chữ ký của bạn"
+usePersonalCert = "Chứng chỉ cá nhân"
+usePersonalCertDesc = "Tự động tạo cho tài khoản của bạn"
+useServerCert = "Chứng chỉ tổ chức"
+useServerCertDesc = "Chứng chỉ tổ chức dùng chung"
+workbenchTitle = "Yêu cầu ký"
+
+[certSign.collab.signRequest.canvas]
+colorPickerTitle = "Ch�n màu nét vẽ"
+continue = "Tiếp tục"
+
+[certSign.collab.signRequest.certModal]
+description = "Bạn đã đặt {{count}} chữ ký. Ch�n chứng chỉ của bạn để hoàn tất việc ký."
+sign = "Ký tài liệu"
+certValidating = "�ang xác thực chứng chỉ..."
+certValidUntil = "Chứng chỉ hợp lệ đến {{date}}"
+certInvalid = "Chứng chỉ không hợp lệ: {{error}}"
+certInvalidFallback = "Chứng chỉ không hợp lệ"
+certNetworkError = "Không thể xác thực chứng chỉ"
+title = "Cấu hình chứng chỉ"
+
+[certSign.collab.signRequest.image]
+hint = "Tải lên hình ảnh PNG hoặc JPG của chữ ký của bạn"
+
+[certSign.collab.signRequest.mode]
+move = "Di chuyển chữ ký"
+place = "�ặt chữ ký"
+title = "Chế độ ký hoặc di chuyển"
+
+[certSign.collab.signRequest.modeTabs]
+draw = "Vẽ"
+image = "Tải lên"
+text = "Nhập"
+
+[certSign.collab.signRequest.placeSignature]
+message = "Nhấp vào PDF để đặt chữ ký của bạn"
+title = "�ặt chữ ký"
+
+[certSign.collab.signRequest.preview]
+imageAlt = "Chữ ký đã ch�n"
+missing = "Không có xem trước"
+textFallback = "Chữ ký"
+
+[certSign.collab.signRequest.saved]
+defaultCanvasLabel = "Chữ ký vẽ tay"
+defaultImageLabel = "Chữ ký đã tải lên"
+defaultLabel = "Chữ ký"
+defaultTextLabel = "Chữ ký nhập liệu"
+delete = "Xóa chữ ký"
+none = "Không có chữ ký đã lưu"
+
+[certSign.collab.signRequest.signatureType]
+draw = "Vẽ"
+type = "Nhập"
+upload = "Tải lên"
+
+[certSign.collab.signRequest.steps]
+back = "Quay lại"
+cancelPlacement = "Hủy đặt"
+certificate = "Chứng chỉ"
+clickMultipleTimes = "Nhấp vào PDF nhi�u lần để đặt chữ ký. Kéo bất kỳ chữ ký nào để di chuyển hoặc thay đổi kích thước."
+clickToPlace = "Nhấp vào PDF tại vị trí bạn muốn chữ ký xuất hiện."
+continue = "Tiếp tục đến ch�n chứng chỉ"
+continueToPlacement = "Tiếp tục đến bước đặt"
+continueToReview = "Tiếp tục đến xem lại"
+createSignature = "Tạo chữ ký"
+invisible = "Ẩn"
+location = "Vị trí:"
+multipleSignatures = "{{count}} chữ ký sẽ được áp dụng vào PDF"
+oneSignature = "1 chữ ký sẽ được áp dụng vào PDF"
+placeOnPdf = "�ặt lên PDF"
+reason = "Lý do:"
+reviewTitle = "Xem lại trước khi ký"
+signaturePlaced = "�ã đặt chữ ký trên trang {{page}}. Bạn có thể đi�u chỉnh vị trí bằng cách nhấp lại hoặc tiếp tục xem lại."
+visible = "Hiển thị"
+visibility = "Mức hiển thị:"
+yourSignatures = "Chữ ký của bạn ({{count}})"
+
+[certSign.collab.signRequest.text]
+colorLabel = "Màu"
+fontLabel = "Phông chữ"
+fontSizeLabel = "Cỡ"
+fontSizePlaceholder = "16"
+label = "Văn bản chữ ký"
+modalHint = "Nhập tên của bạn, sau đó nhấp Tiếp tục để đặt nó lên PDF."
+placeholder = "Nhập tên của bạn..."
+
+[certSign.collab.participant]
+certValidating = "�ang xác thực chứng chỉ..."
+certValid = "✓ Chứng chỉ hợp lệ"
+certValidUntil = " đến {{date}}"
+certInvalid = "✗ {{error}}"
+certInvalidFallback = "Chứng chỉ không hợp lệ"
+certNetworkError = "Không thể xác thực chứng chỉ"
+
+[certSign.collab.addParticipants]
+add = "Thêm {{count}} ngư�i tham gia"
+back = "Quay lại"
+configureSignatures = "Cấu hình cài đặt chữ ký"
+continue = "Tiếp tục đến cài đặt chữ ký"
+reasonHelp = "�ặt sẵn lý do ký cho những ngư�i tham gia này (tùy ch�n, h� có thể thay đổi khi ký)"
+reasonPlaceholder = "ví dụ: Phê duyệt, Xem xét..."
+selectUsers = "Ch�n ngư�i dùng"
+
+[certSign.collab.sessionCreation]
+includeSummaryPage = "Bao gồm Trang tóm tắt chữ ký"
+includeSummaryPageHelp = "Một trang tóm tắt sẽ được thêm vào cuối với tất cả siêu dữ liệu chữ ký. Các hộp chữ ký chứng chỉ số trên từng trang sẽ bị ẩn (chữ ký tay không bị ảnh hưởng)."
+
+[certSign.collab.sessionList]
+active = "�ang hoạt động"
+finalized = "�ã hoàn tất"
+
+[certSign.collab.signatureSettings]
+description = "Cấu hình cách chữ ký hiển thị cho tất cả ngư�i tham gia"
+title = "Giao diện chữ ký"
+
+[certSign.collab.userSelector]
+inviteUsers = "Thêm ngư�i dùng"
+loadError = "Không tải được danh sách ngư�i dùng"
+noTeam = "Không có Nhóm"
+noUsers = "Không tìm thấy ngư�i dùng nào khác."
+placeholder = "Ch�n ngư�i dùng..."
+
+[certSign.mobile]
+panelActions = "Hành động"
+panelDocument = "Tài liệu"
+panelPeople = "M�i ngư�i"
+
+[certSign.sessions]
+deleted = "�ã xóa phiên"
+fetchFailed = "Không tải được chi tiết phiên"
+finalized = "Phiên đã hoàn tất"
+loaded = "�ã tải PDF đã ký"
+pdfNotReady = "PDF chưa sẵn sàng"
+pdfNotReadyDesc = "PDF đã ký đang được tạo. Vui lòng thử lại sau."
+
+[certificateChoice.tooltip]
+header = "Các loại chứng chỉ"
+
+[certificateChoice.tooltip.organization]
+bullet1 = "�ược quản lý bởi quản trị viên hệ thống"
+bullet2 = "Chia sẻ cho ngư�i dùng được ủy quy�n"
+bullet3 = "�ại diện cho danh tính công ty, không phải cá nhân"
+bullet4 = "Phù hợp cho: Tài liệu chính thức, chữ ký nhóm"
+description = "Chứng chỉ dùng chung do tổ chức của bạn cung cấp. Dùng cho quy�n ký ở cấp độ toàn công ty."
+title = "Chứng chỉ tổ chức"
+
+[certificateChoice.tooltip.personal]
+bullet1 = "Tự động tạo khi lần đầu sử dụng"
+bullet2 = "Gắn với tài khoản ngư�i dùng của bạn"
+bullet3 = "Không thể chia sẻ với ngư�i dùng khác"
+bullet4 = "Phù hợp cho: Tài liệu cá nhân, trách nhiệm cá nhân"
+description = "Chứng chỉ được tự động tạo, duy nhất cho tài khoản của bạn. Phù hợp với chữ ký cá nhân."
+title = "Chứng chỉ cá nhân"
+
+[certificateChoice.tooltip.upload]
+bullet1 = "Yêu cầu tệp P12/PFX và mật khẩu"
+bullet2 = "Có thể do Tổ chức cấp Chứng chỉ bên ngoài cấp"
+bullet3 = "Mức độ tin cậy cao hơn cho tài liệu pháp lý"
+bullet4 = "Phù hợp cho: Hợp đồng có giá trị pháp lý, xác thực bên ngoài"
+description = "Sử dụng tệp chứng chỉ PKCS#12 của bạn. Cung cấp toàn quy�n kiểm soát thuộc tính chứng chỉ."
+title = "Tải lên P12 tùy chỉnh"
+
 [changeCreds]
 changePassword = "Bạn đang sử dụng thông tin đăng nhập mặc định. Vui lòng nhập mật khẩu mới"
 changeUsername = "Cập nhật tên ngư�i dùng. Bạn sẽ bị đăng xuất sau khi cập nhật."
@@ -3242,6 +3531,46 @@ totalSelected = "Tổng đã ch�n"
 unsupported = "Không được hỗ trợ"
 unzip = "Giải nén"
 uploadError = "Không thể tải lên một số tệp."
+copyCreated = "�ã lưu bản sao vào thiết bị này."
+copyFailed = "Không thể tạo bản sao."
+leaveShare = "Xóa kh�i danh sách của tôi"
+leaveShareFailed = "Không thể xóa tệp được chia sẻ."
+leaveShareSuccess = "�ã xóa kh�i danh sách chia sẻ của bạn."
+removeBoth = "Xóa ở cả hai nơi"
+removeFilePrompt = "Tệp này được lưu trên thiết bị này và trên máy chủ của bạn. Bạn muốn xóa kh�i đâu?"
+removeFileTitle = "Xóa tệp"
+removeLocalOnly = "Chỉ thiết bị này"
+removeServerFailed = "Không thể xóa tệp kh�i máy chủ."
+removeServerOnly = "Chỉ máy chủ"
+removeServerOnlyPrompt = "Tệp này chỉ được lưu trên máy chủ của bạn. Bạn có muốn xóa kh�i máy chủ không?"
+removeServerSuccess = "�ã xóa kh�i máy chủ."
+removeSharedPrompt = "Tệp này được chia sẻ với bạn. Bạn có thể xóa kh�i thiết bị này hoặc kh�i danh sách chia sẻ của bạn."
+removeSharedServerOnlyBlockedPrompt = "Tệp này được chia sẻ với bạn và chỉ được lưu trên máy chủ."
+removeSharedServerOnlyPrompt = "Tệp này được chia sẻ với bạn và chỉ được lưu trên máy chủ. Xóa kh�i danh sách của bạn?"
+changesNotUploaded = "Thay đổi chưa được tải lên"
+cloudFile = "Tệp đám mây"
+filterAll = "Tất cả"
+filterLocal = "Cục bộ"
+filterSharedByMe = "Tôi đã chia sẻ"
+filterSharedWithMe = "�ược chia sẻ với tôi"
+lastSynced = "�ồng bộ lần cuối"
+localOnly = "Chỉ cục bộ"
+makeCopy = "Tạo bản sao"
+owner = "Chủ sở hữu"
+ownerUnknown = "Không xác định"
+share = "Chia sẻ"
+shareSelected = "Chia sẻ mục đã ch�n"
+sharedByYou = "Bạn đã chia sẻ"
+sharedEditNoticeBody = "Bạn không có quy�n chỉnh sửa bản trên máy chủ của tệp này. M�i chỉnh sửa bạn thực hiện sẽ được lưu thành bản sao cục bộ."
+sharedEditNoticeConfirm = "�ã hiểu"
+sharedEditNoticeTitle = "Bản trên máy chủ chỉ đ�c"
+sharedWithYou = "�ược chia sẻ với bạn"
+sharing = "Chia sẻ"
+storageState = "Lưu trữ"
+synced = "�ã đồng bộ"
+updateOnServer = "Cập nhật trên Máy chủ"
+uploadSelected = "Tải lên mục đã ch�n"
+uploadToServer = "Tải lên Máy chủ"
 
 [files]
 addFiles = "Thêm tệp"
@@ -3367,6 +3696,77 @@ title = "V� việc làm phẳng PDF"
 discord = "Discord"
 issues = "GitHub"
 
+[groupSigning.tooltip]
+header = "Giới thiệu v� Ký nhóm"
+
+[groupSigning.tooltip.finalization]
+bullet1 = "Tất cả chữ ký được áp dụng theo thứ tự ngư�i tham gia bạn đã chỉ định"
+bullet2 = "Bạn có thể hoàn tất với một phần chữ ký nếu cần"
+bullet3 = "Sau khi hoàn tất, phiên không thể sửa đổi"
+description = "Khi tất cả ngư�i tham gia đã ký (hoặc bạn ch�n hoàn tất sớm), bạn có thể tạo PDF đã ký cuối cùng."
+title = "Quy trình hoàn tất"
+
+[groupSigning.tooltip.roles]
+bullet1 = "Chủ sở hữu (bạn): Tạo phiên, cấu hình mặc định chữ ký, hoàn tất tài liệu"
+bullet2 = "Ngư�i tham gia: Tạo chữ ký, ch�n chứng chỉ, đặt lên PDF"
+bullet3 = "Ngư�i tham gia không thể sửa cài đặt mức hiển thị, lý do hoặc vị trí chữ ký"
+description = "Bạn kiểm soát cài đặt giao diện chữ ký cho tất cả ngư�i tham gia."
+title = "Vai trò ngư�i tham gia"
+
+[groupSigning.tooltip.sequential]
+bullet1 = "Ngư�i tham gia đầu tiên phải ký trước khi ngư�i thứ hai có thể truy cập tài liệu"
+bullet2 = "�ảm bảo thứ tự ký phù hợp cho tuân thủ pháp lý"
+bullet3 = "Bạn có thể sắp xếp lại ngư�i tham gia bằng cách kéo trong danh sách"
+description = "Ngư�i tham gia ký tài liệu theo thứ tự bạn chỉ định. Mỗi ngư�i ký nhận thông báo khi đến lượt h�."
+title = "Ký tuần tự"
+
+[groupSigning.steps]
+back = "Quay lại"
+completed = "Hoàn tất"
+current = "Hiện tại"
+stepLabel = "BÆ°á»›c {{number}}"
+
+[groupSigning.steps.configureDefaults]
+continue = "Tiếp tục đến xem lại"
+invisible = "Chữ ký sẽ ẩn (chỉ siêu dữ liệu)"
+locationLabel = "Vị trí:"
+preview = "Xem trÆ°á»›c"
+reasonLabel = "Lý do:"
+title = "Cấu hình cài đặt chữ ký"
+visible = "Chữ ký sẽ hiển thị trên trang {{page}}"
+
+[groupSigning.steps.review]
+document = "Tài liệu"
+dueDate = "Ngày đến hạn (Tùy ch�n)"
+dueDatePlaceholder = "Ch�n ngày đến hạn..."
+invisible = "Ẩn (chỉ siêu dữ liệu)"
+location = "Vị trí:"
+logo = "Logo:"
+logoHidden = "Không có logo"
+logoShown = "Hiển thị logo Stirling PDF"
+participants = "Ngư�i tham gia"
+reason = "Lý do:"
+send = "Gửi yêu cầu ký"
+signatureSettings = "Cài đặt chữ ký"
+title = "Xem lại chi tiết phiên"
+titleShort = "Xem lại & Gửi"
+visibility = "Mức hiển thị:"
+visible = "Hiển thị trên trang {{page}}"
+participantCount = "{{count}} ngư�i tham gia sẽ ký theo thứ tự"
+
+[groupSigning.steps.selectDocument]
+continue = "Tiếp tục đến ch�n ngư�i tham gia"
+noFile = "Vui lòng ch�n một tệp PDF duy nhất từ các tệp đang hoạt động của bạn để tạo phiên ký."
+selectedFile = "Tài liệu đã ch�n"
+title = "Ch�n tài liệu"
+
+[groupSigning.steps.selectParticipants]
+continue = "Tiếp tục đến cài đặt chữ ký"
+count = "�ã ch�n {{count}} ngư�i tham gia"
+label = "Ch�n ngư�i tham gia"
+placeholder = "Ch�n ngư�i tham gia để ký..."
+title = "Ch�n ngư�i tham gia"
+
 [getPdfInfo]
 downloadJson = "Tải xuống JSON"
 downloads = "Tải xuống"
@@ -4460,7 +4860,10 @@ zoomOut = "Thu nh�"
 
 [viewer]
 cannotPreviewFile = "Không thể xem trước tệp"
+disableColorFilter = "Tắt bộ l�c màu"
 dualPageView = "Chế độ xem hai trang"
+enableDarkFilter = "Bật bộ l�c tối"
+enableSepiaFilter = "Bật bộ l�c sepia"
 firstPage = "Trang đầu"
 lastPage = "Trang cuối"
 nextPage = "Trang tiếp"
@@ -4470,6 +4873,22 @@ singlePageView = "Chế độ xem trang đơn"
 unknownFile = "Tệp không xác định"
 zoomIn = "Phóng to"
 zoomOut = "Thu nh�"
+resetZoom = "�ặt lại thu phóng"
+
+[viewer.nonPdf]
+fileTypeBadge = "Tệp {{type}}"
+convertToPdf = "Chuyển thành PDF"
+loading = "�ang tải..."
+emptyFile = "Tệp trống"
+csvStats = "{{rows}} hàng · {{columns}} cột · {{size}}"
+sortedBy = "Sắp xếp theo: {{column}}"
+columnDefault = "Cá»™t {{index}}"
+htmlPreviewWarning = "Xem trước HTML — tài nguyên bên ngoài có thể không tải · {{size}}"
+htmlPreview = "Xem trÆ°á»›c HTML"
+invalidJson = "JSON không hợp lệ — đang hiển thị nội dung thô"
+textStats = "{{lines}} dòng · {{size}}"
+lineNumbers = "�ánh số dòng"
+renderMarkdown = "Kết xuất markdown"
 
 [viewer.attachments]
 title = "Tệp đính kèm"
@@ -4531,6 +4950,7 @@ toggleAttachments = "Bật/Tắt tệp đính kèm"
 toggleTheme = "Chuyển đổi chủ đ�"
 language = "Ngôn ngữ"
 toggleAnnotations = "Chuyển đổi hiển thị chú thích"
+toggleLayers = "Chuyển đổi Lớp"
 search = "Tìm kiếm PDF"
 panMode = "Chế độ kéo"
 applyRedactionsFirst = "�p dụng bôi đen trước"
@@ -5407,20 +5827,72 @@ title = "In tệp"
 2 = "Nhập tên máy in"
 
 [quickAccess]
+access = "Truy cập"
+accessAddPerson = "Thêm ngư�i khác"
+accessBack = "Quay lại"
+accessCopyLink = "Sao chép liên kết"
+accessEmail = "�ịa chỉ email"
+accessEmailPlaceholder = "name@company.com"
+accessFileLabel = "Tệp"
+accessGeneral = "Quy�n truy cập chung"
+accessInviteTitle = "M�i m�i ngư�i"
+accessOwner = "Chủ sở hữu"
+accessPanel = "Quy�n truy cập tài liệu"
+accessPeople = "Ngư�i có quy�n truy cập"
+accessRemove = "Xóa"
+accessRestricted = "Bị hạn chế"
+accessRestrictedHint = "Chỉ những ngư�i có quy�n truy cập mới có thể mở"
+accessRole = "Vai trò"
+accessRoleCommenter = "Ngư�i bình luận"
+accessRoleEditor = "Ngư�i chỉnh sửa"
+accessRoleViewer = "Ngư�i xem"
+accessSelectedFile = "Tệp đã ch�n"
+accessSendInvite = "Gửi l�i m�i"
+accessTitle = "Quy�n truy cập tài liệu"
+accessYou = "Bạn"
 account = "Tài khoản"
+activeSessions = "Phiên đang hoạt động"
+activeTab = "�ang hoạt động"
 activity = "Hoạt động"
 adminSettings = "Cài đặt quản trị"
+allSessions = "Tất cả phiên"
 allTools = "All Tools"
 automate = "Tự động hóa"
+back = "Quay lại"
+certSign = "Ký bằng chứng chỉ"
+completedSessions = "Phiên đã hoàn tất"
+completedTab = "�ã hoàn tất"
 config = "Cấu hình"
+createNew = "Tạo yêu cầu mới"
+createSession = "Tạo yêu cầu ký"
+dueDate = "Ngày đến hạn (tùy ch�n)"
 files = "Tệp"
 help = "Trợ giúp"
+noActiveSessions = "Không có yêu cầu ký đang ch� hoặc phiên đang hoạt động"
+noCompletedSessions = "Không có phiên đã hoàn tất"
+noFile = "Chưa ch�n tệp"
 read = "��c"
 reader = "Trình đ�c"
+refresh = "Làm mới"
+requestSignatures = "Yêu cầu chữ ký"
+selectSingleFileToRequest = "Ch�n một tệp PDF duy nhất để yêu cầu chữ ký"
+selectedFile = "Tệp đã ch�n"
+selectUsers = "Ch�n ngư�i dùng để ký"
+selectUsersPlaceholder = "Ch�n ngư�i tham gia..."
+sendingRequest = "�ang gửi..."
 settings = "Cài đặt"
 showMeAround = "Dẫn tôi tham quan"
 sign = "Ký"
+signatureRequests = "Yêu cầu ký"
+signYourself = "Tự ký"
+newRequest = "Yêu cầu mới"
 tours = "Hướng dẫn"
+wetSign = "Thêm chữ ký"
+filterMine = "Của tôi"
+filterOverdue = "Quá hạn"
+filterSigned = "�ã ký"
+filterDeclined = "�ã từ chối"
+searchDocuments = "Tìm kiếm tài liệu…"
 
 [quickAccess.helpMenu]
 adminTour = "Hướng dẫn quản trị"
@@ -6050,11 +6522,75 @@ toolNotAvailableLocally = "Máy chủ Stirling-PDF của bạn đang ngoại tuy
 expired = "Phiên của bạn đã hết hạn. Vui lòng làm mới trang và thử lại."
 refreshPage = "Làm mới trang"
 
+[sessionManagement.tooltip]
+header = "Quản lý phiên ký"
+
+[sessionManagement.tooltip.addParticipants]
+bullet1 = "Ngư�i tham gia mới được thêm vào cuối thứ tự ký"
+bullet2 = "Không thể thêm ngư�i tham gia sau khi phiên đã hoàn tất"
+bullet3 = "Mỗi ngư�i tham gia sẽ nhận thông báo khi đến lượt"
+description = "Bạn có thể thêm nhi�u ngư�i tham gia vào phiên đang hoạt động bất kỳ lúc nào trước khi hoàn tất."
+title = "Thêm ngư�i tham gia"
+
+[sessionManagement.tooltip.finalization]
+bullet1 = "<b>Hoàn tất đầy đủ</b>: Tất cả ngư�i tham gia đã ký"
+bullet2 = "<b>Hoàn tất một phần</b>: Một số ngư�i tham gia chưa ký"
+bullet3 = "Những ngư�i chưa ký sẽ bị loại kh�i tài liệu cuối cùng"
+bullet4 = "Sau khi hoàn tất, bạn có thể tải PDF đã ký vào các tệp đang hoạt động"
+description = "Việc hoàn tất kết hợp tất cả chữ ký thành một PDF đã ký duy nhất. Hành động này không thể hoàn tác."
+title = "Hoàn tất phiên"
+
+[sessionManagement.tooltip.participantRemoval]
+bullet1 = "Không thể xóa ngư�i tham gia đã ký"
+bullet2 = "Ngư�i tham gia bị xóa sẽ không còn nhận thông báo"
+bullet3 = "Thứ tự ký sẽ tự động đi�u chỉnh"
+description = "Có thể xóa ngư�i tham gia kh�i phiên trước khi h� ký."
+title = "Xóa ngư�i tham gia"
+
+[sessionManagement.tooltip.signatureOrder]
+bullet1 = "Mỗi chữ ký được áp dụng tuần tự lên PDF"
+bullet2 = "Ngư�i ký sau có thể thấy các chữ ký trước"
+bullet3 = "Quan tr�ng cho quy trình phê duyệt và chuỗi lưu ký pháp lý"
+description = "Thứ tự bạn chỉ định khi tạo phiên quyết định ai ký trước."
+title = "Thứ tự chữ ký"
+
+[signatureSettings.tooltip]
+header = "Cài đặt giao diện chữ ký"
+
+[signatureSettings.tooltip.location]
+bullet1 = "Ví dụ: \"New York, USA\", \"London Office\", \"Remote\""
+bullet2 = "Không giống vị trí trên trang"
+bullet3 = "Có thể bắt buộc trong một số khu vực pháp lý"
+description = "Vị trí địa lý tùy ch�n nơi áp dụng chữ ký. �ược lưu trong siêu dữ liệu chứng chỉ."
+title = "Vị trí chữ ký"
+
+[signatureSettings.tooltip.logo]
+bullet1 = "Hiển thị cùng chữ ký và văn bản"
+bullet2 = "Hỗ trợ định dạng PNG, JPG"
+bullet3 = "Tăng tính chuyên nghiệp"
+description = "Thêm logo công ty vào chữ ký hiển thị để tăng nhận diện và tính xác thực."
+title = "Logo công ty"
+
+[signatureSettings.tooltip.reason]
+bullet1 = "Ví dụ: \"Approval\", \"Contract Agreement\", \"Review Complete\""
+bullet2 = "Hiển thị trong thuộc tính chữ ký của PDF"
+bullet3 = "Hữu ích cho kiểm toán và tuân thủ"
+description = "Văn bản tùy ch�n giải thích lý do ký tài liệu. �ược lưu trong siêu dữ liệu chứng chỉ."
+title = "Lý do ký"
+
+[signatureSettings.tooltip.visibility]
+bullet1 = "<b>Hiển thị</b>: Chữ ký xuất hiện trên PDF với giao diện tùy chỉnh"
+bullet2 = "<b>Ẩn</b>: Chứng chỉ được nhúng mà không có dấu hiệu trực quan"
+bullet3 = "Chữ ký ẩn vẫn cung cấp xác thực mật mã"
+description = "Kiểm soát chữ ký có hiển thị trên tài liệu hay được nhúng ẩn."
+title = "Mức hiển thị chữ ký"
+
 [settings.configuration]
 advanced = "Nâng cao"
 database = "Cơ sở dữ liệu"
 endpoints = "Endpoints"
 features = "Tính năng"
+storageSharing = "Lưu trữ & Chia sẻ Tệp"
 systemSettings = "Cài đặt hệ thống"
 title = "Cấu hình"
 
@@ -6332,10 +6868,13 @@ title = "�ăng nhập vào Stirling"
 [setup.selfhosted]
 link = "hoặc kết nối tới tài khoản tự lưu trữ"
 subtitle = "Nhập thông tin đăng nhập server"
+changeServerLocked = "Tổ chức của bạn đã giới hạn ứng dụng này vào một máy chủ cụ thể"
 switchToLocal = "Thay vào đó dùng công cụ cục bộ"
 title = "�ăng nhập vào server"
 
 [setup.selfhosted.unreachable]
+changeServer = "Kết nối tới máy chủ khác"
+changeServerLocked = "Tổ chức của bạn đã giới hạn ứng dụng này vào một máy chủ cụ thể"
 continueOffline = "Thay vào đó dùng công cụ cục bộ"
 message = "Không thể truy cập {{url}}. Kiểm tra xem máy chủ có đang chạy và có thể truy cập hay không."
 retry = "Thử lại"
@@ -6529,6 +7068,15 @@ saved = "�ã lưu"
 text = "Văn bản"
 title = "Loại chữ ký"
 
+[signRequest]
+declined = "Yêu cầu ký đã bị từ chối"
+fetchFailed = "Không tải được yêu cầu ký"
+signed = "Ký tài liệu thành công"
+
+[signSession]
+createFailed = "Không tạo được yêu cầu ký"
+created = "�ã gửi yêu cầu ký"
+
 [signup]
 accountCreatedSuccessfully = "Tạo tài khoản thành công! Bạn có thể đăng nhập ngay bây gi�."
 alreadyHaveAccount = "�ã có tài khoản? �ăng nhập"
@@ -6807,6 +7355,106 @@ title = "Tách PDF theo chương"
 [splitPdfByChapters]
 tags = "tách,chương,dấu trang,sắp xếp"
 
+[storageShare]
+accessed = "�ã truy cập"
+accessDenied = "Bạn không có quy�n truy cập tệp được chia sẻ này. Hãy yêu cầu chủ sở hữu chia sẻ với bạn."
+accessFailed = "Không thể tải hoạt động."
+accessDeniedBody = "Bạn không có quy�n truy cập tệp này. Hãy yêu cầu chủ sở hữu chia sẻ với bạn."
+accessDeniedTitle = "Không có quy�n truy cập"
+accessLimitedCommenter = "Quy�n bình luận sắp ra mắt. Hãy yêu cầu quy�n chỉnh sửa nếu bạn cần tải xuống."
+accessLimitedTitle = "Quy�n truy cập hạn chế"
+accessLimitedViewer = "Liên kết này chỉ cho phép xem. Hãy yêu cầu quy�n chỉnh sửa nếu bạn cần tải xuống."
+createdAt = "�ã tạo"
+download = "Tải xuống"
+downloadFailed = "Không thể tải xuống tệp này."
+expiredBody = "Liên kết chia sẻ này không hợp lệ hoặc đã hết hạn."
+expiredTitle = "Liên kết đã hết hạn"
+goToLogin = "�i tới đăng nhập"
+loadFailed = "Không thể mở tệp được chia sẻ."
+loading = "�ang tải liên kết chia sẻ..."
+loginPrompt = "�ăng nhập để truy cập tệp được chia sẻ này."
+loginRequired = "Yêu cầu đăng nhập"
+openInApp = "Mở trong Stirling PDF"
+ownerLabel = "Chủ sở hữu"
+ownerUnknown = "Không xác định"
+requiresLogin = "Tệp được chia sẻ này yêu cầu đăng nhập."
+roleCommenter = "Ngư�i bình luận"
+roleEditor = "Ngư�i chỉnh sửa"
+roleViewer = "Ngư�i xem"
+shareHeading = "Tệp được chia sẻ"
+titleDefault = "Tệp được chia sẻ"
+tryAgain = "Vui lòng thử lại sau."
+addUser = "Thêm"
+commenterHint = "Tính năng bình luận sắp ra mắt."
+copied = "�ã sao chép liên kết vào bộ nhớ tạm"
+copy = "Sao chép"
+copyFailed = "Sao chép thất bại"
+description = "Tạo liên kết chia sẻ cho tệp này. Ngư�i dùng đã đăng nhập có liên kết có thể truy cập."
+downloadsCount = "Lượt tải xuống: {{count}}"
+emailWarningBody = "Có vẻ đây là một địa chỉ email. Nếu ngư�i này chưa là ngư�i dùng Stirling PDF, h� sẽ không thể truy cập tệp."
+emailWarningConfirm = "Vẫn chia sẻ"
+emailWarningTitle = "�ịa chỉ email"
+errorTitle = "Chia sẻ thất bại"
+failure = "Không thể tạo liên kết chia sẻ. Vui lòng thử lại."
+fileLabel = "Tệp"
+generate = "Tạo liên kết"
+generated = "�ã tạo liên kết chia sẻ"
+hideActivity = "Ẩn hoạt động"
+invalidUsername = "Nhập tên ngư�i dùng hoặc địa chỉ email hợp lệ."
+lastAccessed = "Truy cập lần cuối"
+linkAccessTitle = "Quy�n truy cập bằng liên kết chia sẻ"
+linkLabel = "Liên kết chia sẻ"
+linksDisabled = "Liên kết chia sẻ đã bị tắt."
+linksDisabledBody = "Liên kết chia sẻ bị tắt bởi cài đặt máy chủ của bạn."
+manage = "Quản lý chia sẻ"
+manageDescription = "Tạo và quản lý các liên kết để chia sẻ tệp này."
+manageLoadFailed = "Không thể tải các liên kết chia sẻ."
+manageTitle = "Quản lý chia sẻ"
+noActivity = "Chưa có hoạt động."
+noLinks = "Chưa có liên kết chia sẻ đang hoạt động."
+noSharedUsers = "Chưa có ngư�i dùng nào có quy�n truy cập."
+removeLink = "Xóa liên kết"
+removeUser = "Xóa"
+revokeFailed = "Không thể xóa liên kết chia sẻ."
+revoked = "Liên kết chia sẻ đã bị xóa"
+roleLabel = "Vai trò"
+sharingDisabled = "Chia sẻ đã bị tắt."
+sharingDisabledBody = "Chia sẻ đã bị tắt bởi cài đặt máy chủ của bạn."
+sharedUsersTitle = "Ngư�i dùng được chia sẻ"
+title = "Chia sẻ tệp"
+unknownUser = "Ngư�i dùng không xác định"
+userAddFailed = "Không thể chia sẻ với ngư�i dùng đó."
+userAdded = "�ã thêm ngư�i dùng vào danh sách chia sẻ."
+usernameLabel = "Tên ngư�i dùng hoặc email"
+usernamePlaceholder = "Nhập tên ngư�i dùng hoặc email"
+userRemoveFailed = "Không thể xóa ngư�i dùng đó."
+userRemoved = "�ã xóa ngư�i dùng kh�i danh sách chia sẻ."
+viewActivity = "Xem hoạt động"
+viewed = "�ã xem"
+viewsCount = "Lượt xem: {{count}}"
+downloaded = "�ã tải xuống"
+bulkDescription = "Tạo một liên kết để chia sẻ tất cả tệp đã ch�n với ngư�i dùng đã đăng nhập."
+bulkTitle = "Chia sẻ các tệp đã ch�n"
+copyLink = "Sao chép liên kết chia sẻ"
+fileCount = "�ã ch�n {{count}} tệp"
+ownerOnly = "Chỉ chủ sở hữu mới có thể quản lý chia sẻ."
+selectSingleFile = "Ch�n một tệp để quản lý chia sẻ."
+
+[storageUpload]
+description = "Thao tác này sẽ tải tệp hiện tại lên lưu trữ trên máy chủ để bạn truy cập."
+errorTitle = "Tải lên không thành công"
+failure = "Tải lên không thành công. Vui lòng kiểm tra đăng nhập và cài đặt lưu trữ của bạn."
+fileLabel = "Tệp"
+hint = "Liên kết công khai và chế độ truy cập được kiểm soát bởi cài đặt máy chủ của bạn."
+success = "�ã tải lên máy chủ"
+title = "Tải lên máy chủ"
+updateButton = "Cập nhật trên máy chủ"
+uploadButton = "Tải lên máy chủ"
+bulkDescription = "Thao tác này sẽ tải các tệp đã ch�n lên lưu trữ trên máy chủ của bạn."
+bulkTitle = "Tải lên các tệp đã ch�n"
+fileCount = "�ã ch�n {{count}} tệp"
+more = " +{{count}} nữa"
+
 [storage]
 approximateSize = "Kích thước xấp xỉ"
 fileTooLarge = "Tệp quá lớn. Kích thước tối đa mỗi tệp là"
@@ -7153,6 +7801,30 @@ title = "Xem/Chỉnh sửa PDF"
 [warning]
 tooltipTitle = "Cảnh báo"
 
+[wetSignature.tooltip]
+header = "Phương thức tạo chữ ký"
+
+[wetSignature.tooltip.draw]
+bullet1 = "Tùy chỉnh màu và độ dày bút"
+bullet2 = "Xóa và vẽ lại cho đến khi hài lòng"
+bullet3 = "Hoạt động trên thiết bị cảm ứng (máy tính bảng, điện thoại)"
+description = "Tạo chữ ký viết tay bằng chuột hoặc màn hình cảm ứng của bạn. Phù hợp nhất cho chữ ký cá nhân, chân thực."
+title = "Vẽ chữ ký"
+
+[wetSignature.tooltip.type]
+bullet1 = "Ch�n từ nhi�u phông chữ"
+bullet2 = "Tùy chỉnh kích thước và màu chữ"
+bullet3 = "Lý tưởng cho chữ ký tiêu chuẩn hóa"
+description = "Tạo chữ ký từ văn bản nhập. Nhanh và nhất quán, phù hợp cho tài liệu doanh nghiệp."
+title = "Nhập chữ ký"
+
+[wetSignature.tooltip.upload]
+bullet1 = "Hỗ trợ PNG, JPG và các định dạng ảnh khác"
+bullet2 = "Khuyến nghị n�n trong suốt để có kết quả tốt nhất"
+bullet3 = "Hình ảnh sẽ được đổi kích thước để vừa vùng chữ ký"
+description = "Tải lên hình ảnh chữ ký đã tạo sẵn. Lý tưởng nếu bạn có chữ ký quét hoặc logo công ty."
+title = "Tải lên hình ảnh chữ ký"
+
 [watermark]
 completed = "�ã thêm hình m�"
 desc = "Thêm hình m� bằng văn bản hoặc hình ảnh vào tệp PDF"
@@ -7333,6 +8005,7 @@ activeSession = "Phiên hoạt động"
 addMembers = "Thêm thành viên"
 admin = "Quản trị viên"
 confirmDelete = "Bạn có chắc muốn xóa ngư�i dùng này? Thao tác này không thể hoàn tác."
+confirmUnlock = "Bạn có chắc muốn mở khóa tài khoản ngư�i dùng này không?"
 deleteUser = "Xóa ngư�i dùng"
 deleteUserError = "Xóa ngư�i dùng thất bại"
 deleteUserSuccess = "Xóa ngư�i dùng thành công"
@@ -7341,6 +8014,8 @@ disable = "Tắt"
 disabled = "�ã tắt"
 editRole = "Chỉnh sửa vai trò"
 enable = "Bật"
+locked = "đã khóa"
+lockedBadge = "�ã khóa"
 loading = "�ang tải danh sách..."
 loginRequired = "Hãy bật chế độ đăng nhập trước"
 member = "Thành viên"
@@ -7350,6 +8025,9 @@ searchMembers = "Tìm thành viên..."
 status = "Trạng thái"
 team = "Nhóm"
 title = "M�i ngư�i"
+unlockAccount = "Mở khóa tài khoản"
+unlockUserError = "Mở khóa tài khoản ngư�i dùng không thành công"
+unlockUserSuccess = "�ã mở khóa tài khoản ngư�i dùng thành công"
 user = "Ngư�i dùng"
 
 [workspace.people.actions]
diff --git a/frontend/public/locales/zh-BO/translation.toml b/frontend/public/locales/zh-BO/translation.toml
index 498d5b4d1e..54a440abe8 100644
--- a/frontend/public/locales/zh-BO/translation.toml
+++ b/frontend/public/locales/zh-BO/translation.toml
@@ -8,6 +8,7 @@ black = "ནག་པོ"
 blue = "སྔོན་པོ"
 bored = "སྒུག་སྡོད་ས�ྱིད་པོ་མི་འདུག་གམ�"
 cancel = "�消"
+confirm = "确认"
 changedCredsMessage = "ངོ་སྤྲོད་ལག་�ྱེར་བསྒྱུར་ཟིན�"
 chooseFile = "选择文件"
 close = "སྒོ་རིག�"
@@ -146,6 +147,7 @@ insufficientCredits = "点数�足。需�：{{requiredCredits}}，�用：{{
 loadingCredits = "正在检查点数..."
 loadingProStatus = "正在检查订阅状�..."
 noticeTopUpOrPlan = "点数�足，请充值或�级到套�"
+accessInvite = "邀请"
 
 [account]
 accountSettings = "�ོ་མིང་སྒྲིག་འགོད�"
@@ -1427,6 +1429,34 @@ title = "处�"
 description = "在报告错误�等待处�作业的最长时间。"
 label = "处�超时（秒）"
 
+[admin.settings.storage]
+description = "控制�务器存储和共享选项。"
+title = "文件存储与共享"
+
+[admin.settings.storage.enabled]
+description = "�许用户在�务器上存储文件。"
+label = "�用�务器文件存储"
+
+[admin.settings.storage.sharing.email]
+description = "�许通过电�邮箱共享。"
+label = "�用邮箱共享"
+mailLink = "�置邮件设置"
+mailNote = "需�邮件�置。 "
+
+[admin.settings.storage.sharing.enabled]
+description = "�许用户共享已存储的文件。"
+label = "�用共享"
+
+[admin.settings.storage.sharing.links]
+description = "�许通过需登录的链接共享。"
+frontendUrlLink = "在系统设置中�置"
+frontendUrlNote = "需��端 URL。 "
+label = "�用共享链接"
+
+[admin.settings.storage.signing.enabled]
+description = "�许用户创建多人�与的文档签署会�。需��用�务器文件存储。"
+label = "�用群组签署（Alpha）"
+
 [admin.settings.unsavedChanges]
 cancel = "继续编辑"
 discard = "放弃更改"
@@ -2059,7 +2089,19 @@ numbers = "数字/范围：5, 10-20"
 progressions = "等差�：3n, 4n+1"
 
 [certSign]
+allSigned = "所有�与者�已签署。�最终定稿。"
+awaitingSignatures = "等待签署"
+signatureProgress = "{{signedCount}}/{{totalCount}} 个签�"
 chooseCertificate = "选择�书文件"
+declined = "已拒�"
+fetchFailed = "加载签署数�失败"
+finalized = "已定稿"
+notified = "待处�"
+partialNote = "您�以��以当�签�最终定稿。未签署的�与者将被排除。"
+pending = "待处�"
+readyToFinalize = "�最终定稿"
+signed = "已签署"
+viewed = "已查看"
 chooseJksFile = "选择 JKS 文件"
 chooseP12File = "选择 PKCS12 文件"
 choosePfxFile = "选择 PFX 文件"
@@ -2082,6 +2124,7 @@ title = "ལག་�ྱེར་མིང་རྟགས�"
 invisible = "���"
 stepTitle = "签�外观"
 visible = "��"
+visibility = "��性"
 
 [certSign.appearance.options]
 title = "签�详情"
@@ -2188,6 +2231,252 @@ bullet4 = "�使用自定义�书进行验�"
 text = "在检查签�时，工具会告诉您它们是�有效��签署了文档�签署时间，以�文档在签��是�已被更改。"
 title = "检查签�"
 
+[certSign.collab.finalize]
+button = "完�并加载已签署的 PDF"
+early = "以当�签�完�定稿"
+
+[certSign.collab.sessionDetail]
+addButton = "添加�与者"
+addParticipants = "添加�与者"
+addParticipantsError = "添加�与者失败"
+backToList = "返回会�"
+deleteConfirm = "确定�？此�作无法撤销。"
+deleteError = "删除会�失败"
+deleted = "会�已删除"
+deleteSession = "删除会�"
+dueDate = "截止日期"
+finalizeError = "会�定稿失败"
+loadPdfError = "加载已签署的 PDF 失败"
+loadSignedPdf = "将已签署的 PDF 加载到活动文件"
+messageLabel = "消�"
+noAdditionalInfo = "无其他信�"
+owner = "所有者"
+participantRemoved = "已移除�与者"
+participants = "�与者"
+participantsAdded = "已�功添加�与者"
+removeParticipant = "移除"
+removeParticipantError = "移除�与者失败"
+selectUsers = "选择用户…"
+sessionInfo = "会�信�"
+workbenchTitle = "会�管�"
+
+[certSign.collab.signRequest]
+addedToFiles = "文档已添加到活动文件"
+addSignature = "添加您的签�"
+addToFiles = "添加到活动文件"
+advancedSettings = "高级设置"
+backToList = "返回签署请求"
+certificateChoice = "选择用于签署的�书"
+changeSignature = "更改签�"
+clearSignature = "清除签�"
+completeAndSign = "完�并签署"
+createNewSignature = "创建新签�"
+declineButton = "拒�"
+decline = "拒�请求"
+deleteSelected = "删除所选签�"
+drawSignature = "在下方绘制您的签�"
+dueDate = "截止日期"
+fileTooLarge = "文件大�必须�于 5MB"
+fontFamily = "字体"
+fontSize = "字�：{{size}}px"
+fontSizePlaceholder = "大�"
+from = "�自"
+invalidCertFile = "请选择 P12 或 PFX �书文件"
+invalidFileType = "请选择图片文件"
+location = "�置（�选）"
+locationPlaceholder = "您从哪里签署？"
+message = "消�"
+noCertificate = "请选择�书文件"
+noSignatures = "请在 PDF 上至少放置一个签�"
+p12File = "P12/PFX �书文件"
+password = "�书密�"
+passwordPlaceholder = "输入密�…"
+penColor = "画笔颜色"
+penSize = "画笔大�：{{size}}px"
+placementActive = "点击 PDF 放置"
+placeSignatureButton = "在 PDF 上放置签�"
+reason = "�由（�选）"
+reasonPlaceholder = "您为何签署？"
+removeImage = "移除图片"
+removeCertFile = "移除文件"
+savedSignatures = "已�存的签�"
+selectFile = "选择图片文件"
+selectSignatureTitle = "选择或创建签�"
+signButton = "签署文档"
+signatureInfo = "这些设置由文档所有者�置"
+signaturePlaced = "已在页�上放置签�"
+signatureSettings = "签�设置"
+signatureText = "签�文字"
+signatureTextPlaceholder = "输入您的姓�…"
+signatureTypeLabel = "签�类型"
+signingTitle = "签署"
+textColor = "文字颜色"
+typeSignature = "输入您的姓��创建签�"
+uploadCert = "自定义�书"
+uploadCertDesc = "使用您自己的 P12/PFX �书"
+uploadSignature = "上传您的签�图片"
+usePersonalCert = "个人�书"
+usePersonalCertDesc = "为您的账户自动生�"
+useServerCert = "组织�书"
+useServerCertDesc = "共享的组织�书"
+workbenchTitle = "签署请求"
+
+[certSign.collab.signRequest.canvas]
+colorPickerTitle = "选择笔画颜色"
+continue = "继续"
+
+[certSign.collab.signRequest.certModal]
+description = "您已放置 {{count}} 个签�。请选择�书以完�签署。"
+sign = "签署文档"
+certValidating = "正在验��书…"
+certValidUntil = "�书有效期至 {{date}}"
+certInvalid = "�书无效：{{error}}"
+certInvalidFallback = "�书无效"
+certNetworkError = "无法验��书"
+title = "�置�书"
+
+[certSign.collab.signRequest.image]
+hint = "上传您的签� PNG 或 JPG 图片"
+
+[certSign.collab.signRequest.mode]
+move = "移动签�"
+place = "放置签�"
+title = "签署或移动模�"
+
+[certSign.collab.signRequest.modeTabs]
+draw = "绘制"
+image = "上传"
+text = "输入"
+
+[certSign.collab.signRequest.placeSignature]
+message = "点击 PDF 放置您的签�"
+title = "放置签�"
+
+[certSign.collab.signRequest.preview]
+imageAlt = "已选签�"
+missing = "无预览"
+textFallback = "签�"
+
+[certSign.collab.signRequest.saved]
+defaultCanvasLabel = "手绘签�"
+defaultImageLabel = "已上传签�"
+defaultLabel = "签�"
+defaultTextLabel = "键入签�"
+delete = "删除签�"
+none = "暂无已�存的签�"
+
+[certSign.collab.signRequest.signatureType]
+draw = "绘制"
+type = "输入"
+upload = "上传"
+
+[certSign.collab.signRequest.steps]
+back = "返回"
+cancelPlacement = "�消放置"
+certificate = "�书"
+clickMultipleTimes = "在 PDF 上多次点击以放置多个签�。拖动任�签��移动或调整大�。"
+clickToPlace = "点击 PDF 中您希望显示签�的�置。"
+continue = "继续到�书选择"
+continueToPlacement = "继续到放置"
+continueToReview = "继续到审阅"
+createSignature = "创建签�"
+invisible = "���"
+location = "�置："
+multipleSignatures = "将� PDF 应用 {{count}} 个签�"
+oneSignature = "将� PDF 应用 1 个签�"
+placeOnPdf = "放置到 PDF"
+reason = "�由："
+reviewTitle = "签署�审阅"
+signaturePlaced = "已在第 {{page}} 页放置签�。您�以�次点击以调整�置，或继续进行审阅。"
+visible = "��"
+visibility = "��性："
+yourSignatures = "您的签�（{{count}}）"
+
+[certSign.collab.signRequest.text]
+colorLabel = "颜色"
+fontLabel = "字体"
+fontSizeLabel = "大�"
+fontSizePlaceholder = "16"
+label = "签�文字"
+modalHint = "输入您的姓�，然�点击“继续�以将其放置到 PDF 上。"
+placeholder = "输入您的姓�…"
+
+[certSign.collab.participant]
+certValidating = "正在验��书…"
+certValid = "✓ �书有效"
+certValidUntil = " 有效期至 {{date}}"
+certInvalid = "✗ {{error}}"
+certInvalidFallback = "�书无效"
+certNetworkError = "无法验��书"
+
+[certSign.collab.addParticipants]
+add = "添加 {{count}} ��与者"
+back = "返回"
+configureSignatures = "�置签�设置"
+continue = "继续到签�设置"
+reasonHelp = "为这些�与者预设签署�由（�选，签署时�覆盖）"
+reasonPlaceholder = "例如：审批�审核…"
+selectUsers = "选择用户"
+
+[certSign.collab.sessionCreation]
+includeSummaryPage = "包�签�摘�页"
+includeSummaryPageHelp = "将在文档末尾添加包�所有签�元数�的摘�页。�页的数字�书签�框将被��（手写签���影�）。"
+
+[certSign.collab.sessionList]
+active = "活跃"
+finalized = "已定稿"
+
+[certSign.collab.signatureSettings]
+description = "�置所有�与者的签�显示方�"
+title = "签�外观"
+
+[certSign.collab.userSelector]
+inviteUsers = "添加用户"
+loadError = "加载用户失败"
+noTeam = "无团队"
+noUsers = "未找到其他用户。"
+placeholder = "选择用户…"
+
+[certSign.mobile]
+panelActions = "�作"
+panelDocument = "文档"
+panelPeople = "人员"
+
+[certSign.sessions]
+deleted = "会�已删除"
+fetchFailed = "加载会�详情失败"
+finalized = "会�已定稿"
+loaded = "已加载已签署的 PDF"
+pdfNotReady = "PDF 尚未就绪"
+pdfNotReadyDesc = "正在生�已签署的 PDF。请���试。"
+
+[certificateChoice.tooltip]
+header = "�书类型"
+
+[certificateChoice.tooltip.organization]
+bullet1 = "由系统管�员管�"
+bullet2 = "在授�用户间共享"
+bullet3 = "代表公�身份，而�个人"
+bullet4 = "适用于：正�文档�团队签�"
+description = "您的组织�供的共享�书。用于公�范围的签署授�。"
+title = "组织�书"
+
+[certificateChoice.tooltip.personal]
+bullet1 = "首次使用时自动生�"
+bullet2 = "与您的用户账�绑定"
+bullet3 = "�能与其他用户共享"
+bullet4 = "适用于：个人文档�个人责任追溯"
+description = "为您的用户账�自动生�且唯一的�书。适用于个人签�。"
+title = "个人�书"
+
+[certificateChoice.tooltip.upload]
+bullet1 = "需� P12/PFX 文件和密�"
+bullet2 = "�由外部 CA 机构签�"
+bullet3 = "对法律文档具有更高信任级别"
+bullet4 = "适用于：具有法律效力的���外部验�"
+description = "使用您自己的 PKCS#12 �书文件。�完全控制�书属性。"
+title = "上传自定义 P12"
+
 [changeCreds]
 changePassword = "�ྱེད་ཀྱིས་སྔོན་སྒྲིག་ནང་འཛུལ་ངོ་སྤྲོད་བེད་སྤྱོད་བྱེད་བཞིན་ཡོད� གསང་ཚིག་གསར་པ་འཇུག་རོགས�"
 changeUsername = "更新您的用户�。更新�您将被登出。"
@@ -3242,6 +3531,46 @@ totalSelected = "已选总数"
 unsupported = "�支�"
 unzip = "解压"
 uploadError = "部分文件上传失败。"
+copyCreated = "已将副本�存到此设备。"
+copyFailed = "无法创建副本。"
+leaveShare = "从我的列表中移除"
+leaveShareFailed = "无法移除此共享文件。"
+leaveShareSuccess = "已从您的共享列表中移除。"
+removeBoth = "�时移除"
+removeFilePrompt = "此文件已�存在此设备与您的�务器上。您想从哪里移除？"
+removeFileTitle = "移除文件"
+removeLocalOnly = "仅此设备"
+removeServerFailed = "无法从�务器移除该文件。"
+removeServerOnly = "仅�务器"
+removeServerOnlyPrompt = "此文件仅存储在您的�务器上。是�从�务器移除？"
+removeServerSuccess = "已从�务器移除。"
+removeSharedPrompt = "此文件与您共享。您�以将其从此设备或您的共享列表中移除。"
+removeSharedServerOnlyBlockedPrompt = "此文件与您共享，且仅存储在�务器上。"
+removeSharedServerOnlyPrompt = "此文件与您共享，且仅存储在�务器上。�从您的列表中移除�？"
+changesNotUploaded = "更改未上传"
+cloudFile = "云端文件"
+filterAll = "全部"
+filterLocal = "本地"
+filterSharedByMe = "我共享的"
+filterSharedWithMe = "与我共享的"
+lastSynced = "上次�步"
+localOnly = "仅本地"
+makeCopy = "制作副本"
+owner = "所有者"
+ownerUnknown = "未知"
+share = "共享"
+shareSelected = "共享所选"
+sharedByYou = "您共享的"
+sharedEditNoticeBody = "您对该文件的�务器版本没有编辑��。您所�的任何编辑都将�存为本地副本。"
+sharedEditNoticeConfirm = "我知�了"
+sharedEditNoticeTitle = "�务器�读副本"
+sharedWithYou = "与您共享"
+sharing = "共享"
+storageState = "存储"
+synced = "已�步"
+updateOnServer = "在�务器上更新"
+uploadSelected = "上传所选"
+uploadToServer = "上传到�务器"
 
 [files]
 addFiles = "添加文件"
@@ -3367,6 +3696,77 @@ title = "关于 PDF �平化"
 discord = "Discord"
 issues = "GitHub"
 
+[groupSigning.tooltip]
+header = "关于群组签署"
+
+[groupSigning.tooltip.finalization]
+bullet1 = "所有签�将按您指定的�与者顺�应用"
+bullet2 = "如有需�，您�以在部分签�的情况下最终定稿"
+bullet3 = "一旦定稿，会�将无法修改"
+description = "当所有�与者都已签署（或您选择��定稿）�，您�以生�最终的已签署 PDF。"
+title = "定稿�程"
+
+[groupSigning.tooltip.roles]
+bullet1 = "所有者（您）：创建会���置签�默认值�完�定稿"
+bullet2 = "�与者：创建其签��选择�书�放置到 PDF"
+bullet3 = "�与者无法修改签���性��由或�置设置"
+description = "您为所有�与者控制签�外观设置。"
+title = "�与者角色"
+
+[groupSigning.tooltip.sequential]
+bullet1 = "第一��与者签署�，第二��能访问文档"
+bullet2 = "确�符��求的签署顺�以满足�规"
+bullet3 = "您�以在列表中拖动以�新排��与者"
+description = "�与者将按您指定的顺�签署文档。到其签署时，��签署者都会收到通知。"
+title = "顺�签署"
+
+[groupSigning.steps]
+back = "返回"
+completed = "已完�"
+current = "当�"
+stepLabel = "第 {{number}} 步"
+
+[groupSigning.steps.configureDefaults]
+continue = "继续到审阅"
+invisible = "签�将���（仅元数�）"
+locationLabel = "�置："
+preview = "预览"
+reasonLabel = "�由："
+title = "�置签�设置"
+visible = "签�将显示在第 {{page}} 页"
+
+[groupSigning.steps.review]
+document = "文档"
+dueDate = "截止日期（�选）"
+dueDatePlaceholder = "选择截止日期…"
+invisible = "���（仅元数�）"
+location = "�置："
+logo = "徽标："
+logoHidden = "无徽标"
+logoShown = "已显示 Stirling PDF 徽标"
+participants = "�与者"
+reason = "�由："
+send = "��签署请求"
+signatureSettings = "签�设置"
+title = "审阅会�详情"
+titleShort = "审阅并��"
+visibility = "��性："
+visible = "显示在第 {{page}} 页"
+participantCount = "{{count}} ��与者将按顺�签署"
+
+[groupSigning.steps.selectDocument]
+continue = "继续到�与者选择"
+noFile = "请从您的活动文件中选择一个 PDF 以创建签署会�。"
+selectedFile = "已选文档"
+title = "选择文档"
+
+[groupSigning.steps.selectParticipants]
+continue = "继续到签�设置"
+count = "已选择 {{count}} ��与者"
+label = "选择�与者"
+placeholder = "选择需�签署的�与者…"
+title = "选择�与者"
+
 [getPdfInfo]
 downloadJson = "JSON ཕབ་ལེན�"
 downloads = "下载"
@@ -4460,7 +4860,10 @@ zoomOut = "缩�"
 
 [viewer]
 cannotPreviewFile = "无法预览文件"
+disableColorFilter = "�用颜色滤镜"
 dualPageView = "�页视图"
+enableDarkFilter = "�用深色滤镜"
+enableSepiaFilter = "�用棕�色滤镜"
 firstPage = "第一页"
 lastPage = "最�一页"
 nextPage = "下一页"
@@ -4470,6 +4873,22 @@ singlePageView = "�页视图"
 unknownFile = "未知文件"
 zoomIn = "放大"
 zoomOut = "缩�"
+resetZoom = "�置缩放"
+
+[viewer.nonPdf]
+fileTypeBadge = "{{type}} 文件"
+convertToPdf = "转�为 PDF"
+loading = "正在加载…"
+emptyFile = "空文件"
+csvStats = "{{rows}} 行 · {{columns}} 列 · {{size}}"
+sortedBy = "排���：{{column}}"
+columnDefault = "列 {{index}}"
+htmlPreviewWarning = "HTML 预览 — 外部资��能无法加载 · {{size}}"
+htmlPreview = "HTML 预览"
+invalidJson = "无效的 JSON — 正在显示原始内容"
+textStats = "{{lines}} 行 · {{size}}"
+lineNumbers = "行�"
+renderMarkdown = "渲染 Markdown"
 
 [viewer.attachments]
 title = "附件"
@@ -4531,6 +4950,7 @@ toggleAttachments = "切�附件"
 toggleTheme = "切�主题"
 language = "语言"
 toggleAnnotations = "切�注释��性"
+toggleLayers = "切�图层"
 search = "�索 PDF"
 panMode = "平移模�"
 applyRedactionsFirst = "请先应用涂黑"
@@ -5407,20 +5827,72 @@ title = "ཡིག་ཆ་པར་འདེབས�"
 2 = "པར་འདེབས་འཕྲུལ་འ�ོར་གྱི་མིང་འཇུག་པ�"
 
 [quickAccess]
+access = "访问"
+accessAddPerson = "添加其他人员"
+accessBack = "返回"
+accessCopyLink = "�制链接"
+accessEmail = "电�邮箱"
+accessEmailPlaceholder = "name@company.com"
+accessFileLabel = "文件"
+accessGeneral = "通用访问"
+accessInviteTitle = "邀请人员"
+accessOwner = "所有者"
+accessPanel = "文档访问"
+accessPeople = "具有访问��的人员"
+accessRemove = "移除"
+accessRestricted = "��"
+accessRestrictedHint = "�有拥有访问��的人�能打开"
+accessRole = "角色"
+accessRoleCommenter = "评论者"
+accessRoleEditor = "编辑者"
+accessRoleViewer = "查看者"
+accessSelectedFile = "已选文件"
+accessSendInvite = "��邀请"
+accessTitle = "文档访问"
+accessYou = "您"
 account = "账户"
+activeSessions = "活动会�"
+activeTab = "活动"
 activity = "活动"
 adminSettings = "管�员设置"
+allSessions = "所有会�"
 allTools = "All Tools"
 automate = "自动化"
+back = "返回"
+certSign = "�书签署"
+completedSessions = "已完�会�"
+completedTab = "已完�"
 config = "�置"
+createNew = "创建新请求"
+createSession = "创建签署请求"
+dueDate = "截止日期（�选）"
 files = "文件"
 help = "帮助"
+noActiveSessions = "没有待处�的签署请求或活动会�"
+noCompletedSessions = "没有已完�的会�"
+noFile = "未选择文件"
 read = "阅读"
 reader = "阅读器"
+refresh = "刷新"
+requestSignatures = "请求签�"
+selectSingleFileToRequest = "选择一个 PDF 文件以请求签�"
+selectedFile = "已选文件"
+selectUsers = "选择需�签署的用户"
+selectUsersPlaceholder = "选择�与者…"
+sendingRequest = "正在��…"
 settings = "设置"
 showMeAround = "带我看看"
 sign = "签�"
+signatureRequests = "签署请求"
+signYourself = "自己签署"
+newRequest = "新请求"
 tours = "导览"
+wetSign = "添加签�"
+filterMine = "我的"
+filterOverdue = "逾期"
+filterSigned = "已签署"
+filterDeclined = "已拒�"
+searchDocuments = "�索文档…"
 
 [quickAccess.helpMenu]
 adminTour = "管�导览"
@@ -6050,11 +6522,75 @@ toolNotAvailableLocally = "您的 Stirling-PDF �务器已离线，且本地�
 expired = "�ྱེད་ཀྱི་གླེང་མོལ་དུས་ཡོལ་ཟིན� ཤོག་ངོས་གསར་སྒྱུར་བྱས་ནས་ཡང་བས�ྱར་ཚོད་ལྟ་བྱེད་རོགས�"
 refreshPage = "ཤོག་ངོས་གསར་སྒྱུར�"
 
+[sessionManagement.tooltip]
+header = "签署会�管�"
+
+[sessionManagement.tooltip.addParticipants]
+bullet1 = "新增�与者将被添加到签署顺�末尾"
+bullet2 = "会�定稿�无法�添加�与者"
+bullet3 = "到其轮次时，���与者都会收到通知"
+description = "在定稿之�，您��时�活动会�添加更多�与者。"
+title = "添加�与者"
+
+[sessionManagement.tooltip.finalization]
+bullet1 = "<b>完全定稿</b>：所有�与者�已签署"
+bullet2 = "<b>部分定稿</b>：部分�与者尚未签署"
+bullet3 = "未签署的�与者将被排除在最终文档之外"
+bullet4 = "定稿�，您�以将已签署的 PDF 加载到活动文件中"
+description = "定稿会将所有签��并为一个已签署的 PDF。此�作无法撤销。"
+title = "会�定稿"
+
+[sessionManagement.tooltip.participantRemoval]
+bullet1 = "无法移除已签署的�与者"
+bullet2 = "被移除的�与者将��接收通知"
+bullet3 = "签署顺�将自动调整"
+description = "�与者�在签署�从会�中移除。"
+title = "移除�与者"
+
+[sessionManagement.tooltip.signatureOrder]
+bullet1 = "�个签�都会按顺�应用到 PDF"
+bullet2 = "�续签署者�以看到先�的签�"
+bullet3 = "对审批�程和法律�全链至关��"
+description = "您在创建会�时指定的顺�决定�先签署。"
+title = "签署顺�"
+
+[signatureSettings.tooltip]
+header = "签�外观设置"
+
+[signatureSettings.tooltip.location]
+bullet1 = "示例：“New York, USA��“London Office��“Remote�"
+bullet2 = "与页��置��"
+bullet3 = "在�些法律辖区�能是必需的"
+description = "�选的签署地��置。存储在�书元数�中。"
+title = "签��置"
+
+[signatureSettings.tooltip.logo]
+bullet1 = "与签�与文字一�显示"
+bullet2 = "支� PNG�JPG 格�"
+bullet3 = "��专业外观"
+description = "为��签�添加公�徽标，以增强�牌和真实性。"
+title = "公�徽标"
+
+[signatureSettings.tooltip.reason]
+bullet1 = "示例：“Approval�“Contract Agreement�“Review Complete�"
+bullet2 = "在 PDF 签�属性中��"
+bullet3 = "有助于审计追踪与�规"
+description = "解释为何签署文档的�选文本。存储在�书元数�中。"
+title = "签��由"
+
+[signatureSettings.tooltip.visibility]
+bullet1 = "<b>��</b>：签�将以自定义外观显示在 PDF 上"
+bullet2 = "<b>���</b>：嵌入�书但无�视标记"
+bullet3 = "���签��样�供加密学验�"
+description = "控制签�是在文档中��还是以���方�嵌入。"
+title = "签���性"
+
 [settings.configuration]
 advanced = "高级"
 database = "数�库"
 endpoints = "端点"
 features = "功能"
+storageSharing = "文件存储与共享"
 systemSettings = "系统设置"
 title = "�置"
 
@@ -6332,10 +6868,13 @@ title = "登录 Stirling"
 [setup.selfhosted]
 link = "或连接到自托管账户"
 subtitle = "输入您的�务器凭�"
+changeServerLocked = "您的组织已将此应用�制为连接特定�务器"
 switchToLocal = "改用本地工具"
 title = "登录�务器"
 
 [setup.selfhosted.unreachable]
+changeServer = "连接到其他�务器"
+changeServerLocked = "您的组织已将此应用�制为连接特定�务器"
 continueOffline = "改用本地工具"
 message = "无法访问 {{url}}。请检查�务器是�正在�行且�访问。"
 retry = "�试"
@@ -6529,6 +7068,15 @@ saved = "已�存"
 text = "文本"
 title = "签�类型"
 
+[signRequest]
+declined = "签署请求已被拒�"
+fetchFailed = "加载签署请求失败"
+signed = "文档签署�功"
+
+[signSession]
+createFailed = "创建签署请求失败"
+created = "已��签署请求"
+
 [signup]
 accountCreatedSuccessfully = "账�创建�功�您现在�以登录。"
 alreadyHaveAccount = "已有账�？登录"
@@ -6807,6 +7355,106 @@ title = "ལེའ�་ལྟར་ PDF �་གྱེས�"
 [splitPdfByChapters]
 tags = "�་གྱེས�,ལེའུ�,དཔེ་རྟགས�,གོ་སྒྲིག"
 
+[storageShare]
+accessed = "已访问"
+accessDenied = "您无�访问此共享文件。请请求所有者与您共享。"
+accessFailed = "无法加载活动。"
+accessDeniedBody = "您无�访问此文件。请请求所有者与您共享。"
+accessDeniedTitle = "无访问��"
+accessLimitedCommenter = "�将支�评论��。若需下载，请�所有者请求编辑��。"
+accessLimitedTitle = "��访问"
+accessLimitedViewer = "此链接仅�查看。若需下载，请�所有者请求编辑��。"
+createdAt = "创建时间"
+download = "下载"
+downloadFailed = "无法下载此文件。"
+expiredBody = "此共享链接无效或已过期。"
+expiredTitle = "链接已过期"
+goToLogin = "�往登录"
+loadFailed = "无法打开共享文件。"
+loading = "正在加载共享链接…"
+loginPrompt = "登录以访问此共享文件。"
+loginRequired = "需�登录"
+openInApp = "在 Stirling PDF 中打开"
+ownerLabel = "所有者"
+ownerUnknown = "未知"
+requiresLogin = "此共享文件需�登录。"
+roleCommenter = "评论者"
+roleEditor = "编辑者"
+roleViewer = "查看者"
+shareHeading = "已共享文件"
+titleDefault = "已共享文件"
+tryAgain = "请���试。"
+addUser = "添加"
+commenterHint = "�将支�评论。"
+copied = "链接已�制到剪贴�"
+copy = "�制"
+copyFailed = "�制失败"
+description = "为此文件创建共享链接。�有该链接并已登录的用户�访问。"
+downloadsCount = "下载次数：{{count}}"
+emailWarningBody = "这看起��一个电�邮箱地�。若此人尚未�为 Stirling PDF 用户，将无法访问该文件。"
+emailWarningConfirm = "��共享"
+emailWarningTitle = "电�邮箱地�"
+errorTitle = "共享失败"
+failure = "无法生�共享链接。请�试。"
+fileLabel = "文件"
+generate = "生�链接"
+generated = "已生�共享链接"
+hideActivity = "��活动"
+invalidUsername = "请输入有效的用户�或电�邮箱地�。"
+lastAccessed = "上次访问"
+linkAccessTitle = "共享链接访问"
+linkLabel = "共享链接"
+linksDisabled = "已�用共享链接。"
+linksDisabledBody = "�务器设置已�用共享链接。"
+manage = "管�共享"
+manageDescription = "创建并管�用于共享此文件的链接。"
+manageLoadFailed = "无法加载共享链接。"
+manageTitle = "管�共享"
+noActivity = "暂无活动。"
+noLinks = "暂无有效的共享链接。"
+noSharedUsers = "暂无用户拥有访问��。"
+removeLink = "移除链接"
+removeUser = "移除"
+revokeFailed = "无法移除共享链接。"
+revoked = "共享链接已移除"
+roleLabel = "角色"
+sharingDisabled = "共享已被�用。"
+sharingDisabledBody = "�务器设置已�用共享。"
+sharedUsersTitle = "共享用户"
+title = "共享文件"
+unknownUser = "未知用户"
+userAddFailed = "无法与该用户共享。"
+userAdded = "已将用户添加到共享列表。"
+usernameLabel = "用户�或邮箱"
+usernamePlaceholder = "输入用户�或邮箱"
+userRemoveFailed = "无法移除该用户。"
+userRemoved = "已从共享列表中移除该用户。"
+viewActivity = "查看活动"
+viewed = "已查看"
+viewsCount = "查看次数：{{count}}"
+downloaded = "已下载"
+bulkDescription = "创建一个链接，将所有所选文件共享给已登录用户。"
+bulkTitle = "共享所选文件"
+copyLink = "�制共享链接"
+fileCount = "已选择 {{count}} 个文件"
+ownerOnly = "�有所有者�以管�共享。"
+selectSingleFile = "选择�个文件以管�共享。"
+
+[storageUpload]
+description = "这会将当�文件上传到�务器存储，供您自行访问。"
+errorTitle = "上传失败"
+failure = "上传失败。请检查您的登录和存储设置。"
+fileLabel = "文件"
+hint = "公共链接和访问模�由您的�务器设置控制。"
+success = "已上传到�务器"
+title = "上传到�务器"
+updateButton = "在�务器上更新"
+uploadButton = "上传到�务器"
+bulkDescription = "这会将所选文件上传到您的�务器存储。"
+bulkTitle = "上传所选文件"
+fileCount = "已选择 {{count}} 个文件"
+more = " +{{count}} 更多"
+
 [storage]
 approximateSize = "大致大�"
 fileTooLarge = "文件过大。�个文件的最大大�为"
@@ -7153,6 +7801,30 @@ title = "查看/编辑 PDF"
 [warning]
 tooltipTitle = "警告"
 
+[wetSignature.tooltip]
+header = "签�创建方�"
+
+[wetSignature.tooltip.draw]
+bullet1 = "自定义笔的颜色和粗细"
+bullet2 = "清除并�新绘制，直到满�为止"
+bullet3 = "适用于触控设备（平��手机）"
+description = "使用鼠标或触摸�创建手写签�。最适�个人�真实的签�。"
+title = "绘制签�"
+
+[wetSignature.tooltip.type]
+bullet1 = "�从多�字体中选择"
+bullet2 = "自定义文本大�和颜色"
+bullet3 = "�常适�标准化签�"
+description = "从输入的文本生�签�。快速且一致，适用于商务文档。"
+title = "输入签�"
+
+[wetSignature.tooltip.upload]
+bullet1 = "支� PNG�JPG �其他图�格�"
+bullet2 = "为获得最佳效果，建议使用�明背景"
+bullet3 = "图�会调整大�以适�签�区域"
+description = "上传预先创建的签�图�。若您有扫�的签�或公�徽标，效果�想。"
+title = "上传签�图�"
+
 [watermark]
 completed = "已添加水�"
 desc = "� PDF 文件添加文本或图�水�"
@@ -7333,6 +8005,7 @@ activeSession = "活动会�"
 addMembers = "添加�员"
 admin = "管�员"
 confirmDelete = "确定�删除此用户�？此�作无法撤销。"
+confirmUnlock = "确定�解�此用户账户�？"
 deleteUser = "删除用户"
 deleteUserError = "删除用户失败"
 deleteUserSuccess = "用户删除�功"
@@ -7341,6 +8014,8 @@ disable = "�用"
 disabled = "已�用"
 editRole = "编辑角色"
 enable = "�用"
+locked = "已�定"
+lockedBadge = "已�定"
 loading = "正在加载人员..."
 loginRequired = "请先�用登录模�"
 member = "�员"
@@ -7350,6 +8025,9 @@ searchMembers = "�索�员..."
 status = "状�"
 team = "团队"
 title = "人员"
+unlockAccount = "解�账户"
+unlockUserError = "解�用户账户失败"
+unlockUserSuccess = "已�功解�用户账户"
 user = "用户"
 
 [workspace.people.actions]
diff --git a/frontend/public/locales/zh-CN/translation.toml b/frontend/public/locales/zh-CN/translation.toml
index bdf1a1286a..60f83ea9fd 100644
--- a/frontend/public/locales/zh-CN/translation.toml
+++ b/frontend/public/locales/zh-CN/translation.toml
@@ -8,6 +8,7 @@ black = "黑色"
 blue = "�色"
 bored = "等待时觉得无�？"
 cancel = "�消"
+confirm = "确认"
 changedCredsMessage = "凭�已更改�"
 chooseFile = "选择文件"
 close = "关闭"
@@ -146,6 +147,7 @@ insufficientCredits = "积分�足。所需：{{requiredCredits}}，�用：{{
 loadingCredits = "正在检查积分..."
 loadingProStatus = "正在检查订阅状�..."
 noticeTopUpOrPlan = "积分�足，请充值或�级至�个套�"
+accessInvite = "邀请"
 
 [account]
 accountSettings = "账�设定"
@@ -1427,6 +1429,34 @@ title = "处�"
 description = "等待处�作业的最长时间，超时�报告错误。"
 label = "处�超时（秒）"
 
+[admin.settings.storage]
+description = "控制�务器存储和共享选项。"
+title = "文件存储与共享"
+
+[admin.settings.storage.enabled]
+description = "�许用户在�务器上存储文件。"
+label = "�用�务器文件存储"
+
+[admin.settings.storage.sharing.email]
+description = "�许通过电�邮件地�进行共享。"
+label = "�用电�邮件共享"
+mailLink = "�置邮件设置"
+mailNote = "需�邮件�置。 "
+
+[admin.settings.storage.sharing.enabled]
+description = "�许用户共享已存储的文件。"
+label = "�用共享"
+
+[admin.settings.storage.sharing.links]
+description = "�许通过需登录的链接进行共享。"
+frontendUrlLink = "在系统设置中�置"
+frontendUrlNote = "需��端 URL。 "
+label = "�用共享链接"
+
+[admin.settings.storage.signing.enabled]
+description = "�许用户创建多人�与的文档签署会�。需��用�务器文件存储。"
+label = "�用群组签署（Alpha）"
+
 [admin.settings.unsavedChanges]
 cancel = "继续编辑"
 discard = "丢弃更改"
@@ -2059,7 +2089,19 @@ numbers = "数字/范围：5，10-20"
 progressions = "等差：3n，4n+1"
 
 [certSign]
+allSigned = "所有�与者�已签署。�进行最终确定。"
+awaitingSignatures = "等待签署"
+signatureProgress = "{{signedCount}}/{{totalCount}} 个签�"
 chooseCertificate = "选择�书文件"
+declined = "已拒�"
+fetchFailed = "加载签署数�失败"
+finalized = "已最终确定"
+notified = "待处�"
+partialNote = "您�以先行以当�签�进行最终确定。未签署的�与者将被排除。"
+pending = "待处�"
+readyToFinalize = "�最终确定"
+signed = "已签署"
+viewed = "已查看"
 chooseJksFile = "选择 JKS 文件"
 chooseP12File = "选择 PKCS12 文件"
 choosePfxFile = "选择 PFX 文件"
@@ -2082,6 +2124,7 @@ title = "�书签�"
 invisible = "���"
 stepTitle = "签�外观"
 visible = "��"
+visibility = "��性"
 
 [certSign.appearance.options]
 title = "签�详情"
@@ -2188,6 +2231,252 @@ bullet4 = "�使用自定义�书进行验�"
 text = "检查签�时，工具会告诉您签�是�有效��签了��何时签的，以�自签署�文档是�被更改。"
 title = "检查签�"
 
+[certSign.collab.finalize]
+button = "最终确定并加载已签署的 PDF"
+early = "以当�签�最终确定"
+
+[certSign.collab.sessionDetail]
+addButton = "添加�与者"
+addParticipants = "添加�与者"
+addParticipantsError = "添加�与者失败"
+backToList = "返回会�"
+deleteConfirm = "您确定�？此�作无法撤销。"
+deleteError = "删除会�失败"
+deleted = "会�已删除"
+deleteSession = "删除会�"
+dueDate = "截止日期"
+finalizeError = "最终确定会�失败"
+loadPdfError = "加载已签署的 PDF 失败"
+loadSignedPdf = "将已签署的 PDF 加载到活动文件"
+messageLabel = "消�"
+noAdditionalInfo = "无其他信�"
+owner = "所有者"
+participantRemoved = "已移除�与者"
+participants = "�与者"
+participantsAdded = "已�功添加�与者"
+removeParticipant = "移除"
+removeParticipantError = "移除�与者失败"
+selectUsers = "选择用户..."
+sessionInfo = "会�信�"
+workbenchTitle = "会�管�"
+
+[certSign.collab.signRequest]
+addedToFiles = "文档已添加到活动文件"
+addSignature = "添加您的签�"
+addToFiles = "添加到活动文件"
+advancedSettings = "高级设置"
+backToList = "返回签署请求"
+certificateChoice = "选择用于签署的�书"
+changeSignature = "更改签�"
+clearSignature = "清除签�"
+completeAndSign = "完�并签署"
+createNewSignature = "创建新签�"
+declineButton = "拒�"
+decline = "拒�请求"
+deleteSelected = "删除所选签�"
+drawSignature = "在下方绘制您的签�"
+dueDate = "截止日期"
+fileTooLarge = "文件大�必须�于 5MB"
+fontFamily = "字体"
+fontSize = "字体大�：{{size}}px"
+fontSizePlaceholder = "大�"
+from = "�自"
+invalidCertFile = "请选择 P12 或 PFX �书文件"
+invalidFileType = "请选择图�文件"
+location = "�置（�选）"
+locationPlaceholder = "您从哪里进行签署？"
+message = "消�"
+noCertificate = "请选择�书文件"
+noSignatures = "请至少在 PDF 上放置一个签�"
+p12File = "P12/PFX �书文件"
+password = "�书密�"
+passwordPlaceholder = "请输入密�..."
+penColor = "画笔颜色"
+penSize = "画笔大�：{{size}}px"
+placementActive = "点击 PDF 进行放置"
+placeSignatureButton = "在 PDF 上放置签�"
+reason = "原因（�选）"
+reasonPlaceholder = "为什么进行签署？"
+removeImage = "移除图�"
+removeCertFile = "移除文件"
+savedSignatures = "已�存的签�"
+selectFile = "选择图�文件"
+selectSignatureTitle = "选择或创建签�"
+signButton = "签署文档"
+signatureInfo = "这些设置由文档所有者�置"
+signaturePlaced = "已在页�上放置签�"
+signatureSettings = "签�设置"
+signatureText = "签�文本"
+signatureTextPlaceholder = "输入您的姓�..."
+signatureTypeLabel = "签�类型"
+signingTitle = "签署"
+textColor = "文本颜色"
+typeSignature = "输入您的姓�以创建签�"
+uploadCert = "自定义�书"
+uploadCertDesc = "使用您自己的 P12/PFX �书"
+uploadSignature = "上传您的签�图�"
+usePersonalCert = "个人�书"
+usePersonalCertDesc = "为您的�户自动生�"
+useServerCert = "组织�书"
+useServerCertDesc = "共享的组织�书"
+workbenchTitle = "签署请求"
+
+[certSign.collab.signRequest.canvas]
+colorPickerTitle = "选择笔画颜色"
+continue = "继续"
+
+[certSign.collab.signRequest.certModal]
+description = "您已放置 {{count}} 个签�。选择您的�书以完�签署。"
+sign = "签署文档"
+certValidating = "正在验��书..."
+certValidUntil = "�书有效期至 {{date}}"
+certInvalid = "�书无效：{{error}}"
+certInvalidFallback = "�书无效"
+certNetworkError = "无法验��书"
+title = "�置�书"
+
+[certSign.collab.signRequest.image]
+hint = "上传 PNG 或 JPG 格�的签�图�"
+
+[certSign.collab.signRequest.mode]
+move = "移动签�"
+place = "放置签�"
+title = "签署或移动模�"
+
+[certSign.collab.signRequest.modeTabs]
+draw = "绘制"
+image = "上传"
+text = "输入"
+
+[certSign.collab.signRequest.placeSignature]
+message = "点击 PDF 以放置您的签�"
+title = "放置签�"
+
+[certSign.collab.signRequest.preview]
+imageAlt = "已选签�"
+missing = "无预览"
+textFallback = "签�"
+
+[certSign.collab.signRequest.saved]
+defaultCanvasLabel = "手绘签�"
+defaultImageLabel = "已上传的签�"
+defaultLabel = "签�"
+defaultTextLabel = "输入的签�"
+delete = "删除签�"
+none = "无已�存的签�"
+
+[certSign.collab.signRequest.signatureType]
+draw = "绘制"
+type = "输入"
+upload = "上传"
+
+[certSign.collab.signRequest.steps]
+back = "返回"
+cancelPlacement = "�消放置"
+certificate = "�书"
+clickMultipleTimes = "在 PDF 上点击多次以放置多个签�。拖动任�签��移动或调整大�。"
+clickToPlace = "点击 PDF 上希望显示签�的�置。"
+continue = "继续到�书选择"
+continueToPlacement = "继续进行放置"
+continueToReview = "继续到审阅"
+createSignature = "创建签�"
+invisible = "���"
+location = "�置："
+multipleSignatures = "将对 PDF 应用 {{count}} 个签�"
+oneSignature = "将对 PDF 应用 1 个签�"
+placeOnPdf = "放置到 PDF"
+reason = "原因："
+reviewTitle = "签署�审阅"
+signaturePlaced = "签�已放置在第 {{page}} 页。您�以�次点击以调整�置，或继续审阅。"
+visible = "��"
+visibility = "��性："
+yourSignatures = "您的签�（{{count}}）"
+
+[certSign.collab.signRequest.text]
+colorLabel = "颜色"
+fontLabel = "字体"
+fontSizeLabel = "大�"
+fontSizePlaceholder = "16"
+label = "签�文本"
+modalHint = "输入您的姓�，然�点击“继续�将其放置到 PDF。"
+placeholder = "输入您的姓�..."
+
+[certSign.collab.participant]
+certValidating = "正在验��书..."
+certValid = "✓ �书有效"
+certValidUntil = " 截至 {{date}}"
+certInvalid = "✗ {{error}}"
+certInvalidFallback = "�书无效"
+certNetworkError = "无法验��书"
+
+[certSign.collab.addParticipants]
+add = "添加 {{count}} ��与者"
+back = "返回"
+configureSignatures = "�置签�设置"
+continue = "继续到签�设置"
+reasonHelp = "为这些�与者预设签署原因（�选，签署时�覆盖）"
+reasonPlaceholder = "例如：审批�审阅..."
+selectUsers = "选择用户"
+
+[certSign.collab.sessionCreation]
+includeSummaryPage = "包�签�摘�页"
+includeSummaryPageHelp = "将在末尾添加包�所有签�元数�的摘�页。�页�上的数字�书签�框将被��（手写签���影�）。"
+
+[certSign.collab.sessionList]
+active = "进行中"
+finalized = "已最终确定"
+
+[certSign.collab.signatureSettings]
+description = "为所有�与者�置签�的显示方�"
+title = "签�外观"
+
+[certSign.collab.userSelector]
+inviteUsers = "添加用户"
+loadError = "加载用户失败"
+noTeam = "无团队"
+noUsers = "未找到其他用户。"
+placeholder = "选择用户..."
+
+[certSign.mobile]
+panelActions = "�作"
+panelDocument = "文档"
+panelPeople = "人员"
+
+[certSign.sessions]
+deleted = "会�已删除"
+fetchFailed = "加载会�详情失败"
+finalized = "会�已最终确定"
+loaded = "已加载已签署的 PDF"
+pdfNotReady = "PDF 未就绪"
+pdfNotReadyDesc = "正在生�已签署的 PDF。请���试。"
+
+[certificateChoice.tooltip]
+header = "�书类型"
+
+[certificateChoice.tooltip.organization]
+bullet1 = "由系统管�员管�"
+bullet2 = "在授�用户间共享"
+bullet3 = "代表公�身份，而�个人"
+bullet4 = "最佳用途：正�文档�团队签署"
+description = "由您的组织�供的共享�书。用于全公�范围的签署授�。"
+title = "组织�书"
+
+[certificateChoice.tooltip.personal]
+bullet1 = "首次使用时自动生�"
+bullet2 = "与您的用户�户绑定"
+bullet3 = "��与其他用户共享"
+bullet4 = "最佳用途：个人文档�个人责任"
+description = "为您的用户�户自动生�的唯一�书。适用于个人签�。"
+title = "个人�书"
+
+[certificateChoice.tooltip.upload]
+bullet1 = "需� P12/PFX 文件和密�"
+bullet2 = "�由外部�书��机构签�"
+bullet3 = "对法律文档具有更高信任级别"
+bullet4 = "最佳用途：具有法律效力的���外部验�"
+description = "使用您自己的 PKCS#12 �书文件。�完全控制�书属性。"
+title = "上传自定义 P12"
+
 [changeCreds]
 changePassword = "您正在使用默认登录凭�，请输入新密�"
 changeUsername = "更新您的用户�。更新�您将被登出。"
@@ -3242,6 +3531,46 @@ totalSelected = "�计已选"
 unsupported = "�支�"
 unzip = "解压"
 uploadError = "部分文件上传失败。"
+copyCreated = "副本已�存到此设备。"
+copyFailed = "无法创建副本。"
+leaveShare = "从我的列表中移除"
+leaveShareFailed = "无法移除该共享文件。"
+leaveShareSuccess = "已从您的共享列表中移除。"
+removeBoth = "�时从两处移除"
+removeFilePrompt = "此文件已�存在此设备和您的�务器上。您希望从哪里移除？"
+removeFileTitle = "移除文件"
+removeLocalOnly = "仅此设备"
+removeServerFailed = "无法从�务器移除该文件。"
+removeServerOnly = "仅�务器"
+removeServerOnlyPrompt = "此文件仅存储在您的�务器上。是�从�务器移除？"
+removeServerSuccess = "已从�务器移除。"
+removeSharedPrompt = "此文件与您共享。您�以将其从此设备或您的共享列表中移除。"
+removeSharedServerOnlyBlockedPrompt = "此文件与您共享且仅存储在�务器上。"
+removeSharedServerOnlyPrompt = "此文件与您共享且仅存储在�务器上。是�将其从您的列表中移除？"
+changesNotUploaded = "更改未上传"
+cloudFile = "云端文件"
+filterAll = "全部"
+filterLocal = "本地"
+filterSharedByMe = "我共享的"
+filterSharedWithMe = "与我共享的"
+lastSynced = "上次�步"
+localOnly = "仅本地"
+makeCopy = "创建副本"
+owner = "所有者"
+ownerUnknown = "未知"
+share = "共享"
+shareSelected = "共享所选"
+sharedByYou = "您共享的"
+sharedEditNoticeBody = "您对该文件的�务器版本没有编辑��。您进行的任何编辑将�存为本地副本。"
+sharedEditNoticeConfirm = "知�了"
+sharedEditNoticeTitle = "�务器副本为�读"
+sharedWithYou = "与您共享的"
+sharing = "共享"
+storageState = "存储"
+synced = "已�步"
+updateOnServer = "在�务器上更新"
+uploadSelected = "上传所选"
+uploadToServer = "上传到�务器"
 
 [files]
 addFiles = "添加文件"
@@ -3367,6 +3696,77 @@ title = "关于 PDF �平化"
 discord = "Discord"
 issues = "GitHub"
 
+[groupSigning.tooltip]
+header = "关于群组签署"
+
+[groupSigning.tooltip.finalization]
+bullet1 = "所有签�将按照您指定的�与者顺�应用"
+bullet2 = "如有需�，您�以在部分签�的情况下进行最终确定"
+bullet3 = "一旦最终确定，会�将无法修改"
+description = "当所有�与者都已签署（或您选择��最终确定）�，您�以生�最终的已签署 PDF。"
+title = "最终确定�程"
+
+[groupSigning.tooltip.roles]
+bullet1 = "所有者（您）：创建会���置签�默认值�最终确定文档"
+bullet2 = "�与者：创建其签��选择�书�在 PDF 上放置"
+bullet3 = "�与者无法修改签�的��性�原因或�置信�设置"
+description = "您�为所有�与者控制签�外观设置。"
+title = "�与者角色"
+
+[groupSigning.tooltip.sequential]
+bullet1 = "第一��与者签署�，第二��能访问文档"
+bullet2 = "确�符�法律�规所需的签署顺�"
+bullet3 = "您�以通过在列表中拖动��新排��与者"
+description = "�与者按您指定的顺�签署文档。轮到��签署者时，他们都会收到通知。"
+title = "顺�签署"
+
+[groupSigning.steps]
+back = "返回"
+completed = "已完�"
+current = "当�"
+stepLabel = "步骤 {{number}}"
+
+[groupSigning.steps.configureDefaults]
+continue = "继续到审阅"
+invisible = "签�将���（仅元数�）"
+locationLabel = "�置："
+preview = "预览"
+reasonLabel = "原因："
+title = "�置签�设置"
+visible = "签�将在第 {{page}} 页��"
+
+[groupSigning.steps.review]
+document = "文档"
+dueDate = "截止日期（�选）"
+dueDatePlaceholder = "选择截止日期..."
+invisible = "���（仅元数�）"
+location = "�置："
+logo = "Logo："
+logoHidden = "æ—  Logo"
+logoShown = "显示 Stirling PDF Logo"
+participants = "�与者"
+reason = "原因："
+send = "��签署请求"
+signatureSettings = "签�设置"
+title = "审阅会�详情"
+titleShort = "审阅并��"
+visibility = "��性："
+visible = "在第 {{page}} 页��"
+participantCount = "将有 {{count}} ��与者按顺�签署"
+
+[groupSigning.steps.selectDocument]
+continue = "继续选择�与者"
+noFile = "请从您的活动文件中选择一个 PDF 文件以创建签署会�。"
+selectedFile = "已选择的文档"
+title = "选择文档"
+
+[groupSigning.steps.selectParticipants]
+continue = "继续到签�设置"
+count = "已选择 {{count}} ��与者"
+label = "选择�与者"
+placeholder = "选择签署的�与者..."
+title = "选择�与者"
+
 [getPdfInfo]
 downloadJson = "下载 JSON"
 downloads = "下载"
@@ -4460,7 +4860,10 @@ zoomOut = "缩�"
 
 [viewer]
 cannotPreviewFile = "无法预览文件"
+disableColorFilter = "�用颜色滤镜"
 dualPageView = "�页视图"
+enableDarkFilter = "�用深色滤镜"
+enableSepiaFilter = "�用�色滤镜"
 firstPage = "第一页"
 lastPage = "最�一页"
 nextPage = "下一页"
@@ -4470,6 +4873,22 @@ singlePageView = "�页视图"
 unknownFile = "未知文件"
 zoomIn = "放大"
 zoomOut = "缩�"
+resetZoom = "�置缩放"
+
+[viewer.nonPdf]
+fileTypeBadge = "{{type}} 文件"
+convertToPdf = "转�为 PDF"
+loading = "正在加载..."
+emptyFile = "空文件"
+csvStats = "{{rows}} 行 · {{columns}} 列 · {{size}}"
+sortedBy = "排���：{{column}}"
+columnDefault = "列 {{index}}"
+htmlPreviewWarning = "HTML 预览 — 外部资��能无法加载 · {{size}}"
+htmlPreview = "HTML 预览"
+invalidJson = "无效的 JSON — 显示原始内容"
+textStats = "{{lines}} 行 · {{size}}"
+lineNumbers = "行�"
+renderMarkdown = "渲染 markdown"
 
 [viewer.attachments]
 title = "附件"
@@ -4531,6 +4950,7 @@ toggleAttachments = "切�附件"
 toggleTheme = "切�主题"
 language = "语言"
 toggleAnnotations = "切�注释��性"
+toggleLayers = "切�图层"
 search = "�索 PDF"
 panMode = "平移模�"
 applyRedactionsFirst = "请先应用涂黑"
@@ -5407,20 +5827,72 @@ title = "打�文件"
 2 = "输入打�机�称"
 
 [quickAccess]
+access = "访问"
+accessAddPerson = "添加其他人"
+accessBack = "返回"
+accessCopyLink = "�制链接"
+accessEmail = "电�邮件地�"
+accessEmailPlaceholder = "name@company.com"
+accessFileLabel = "文件"
+accessGeneral = "常规访问"
+accessInviteTitle = "邀请人员"
+accessOwner = "所有者"
+accessPanel = "文档访问"
+accessPeople = "有�访问的人员"
+accessRemove = "移除"
+accessRestricted = "��"
+accessRestrictedHint = "仅有��的人�打开"
+accessRole = "角色"
+accessRoleCommenter = "评论者"
+accessRoleEditor = "编辑者"
+accessRoleViewer = "查看者"
+accessSelectedFile = "已选择的文件"
+accessSendInvite = "��邀请"
+accessTitle = "文档访问"
+accessYou = "您"
 account = "账户"
+activeSessions = "进行中的会�"
+activeTab = "进行中"
 activity = "活动"
 adminSettings = "管�设置"
+allSessions = "所有会�"
 allTools = "全部工具"
 automate = "自动化"
+back = "返回"
+certSign = "�书签署"
+completedSessions = "已完�的会�"
+completedTab = "已完�"
 config = "�置"
+createNew = "创建新请求"
+createSession = "创建签署请求"
+dueDate = "截止日期（�选）"
 files = "文件"
 help = "帮助"
+noActiveSessions = "没有待处�的签署请求或进行中的会�"
+noCompletedSessions = "没有已完�的会�"
+noFile = "未选择文件"
 read = "阅读"
 reader = "阅读器"
+refresh = "刷新"
+requestSignatures = "请求签署"
+selectSingleFileToRequest = "选择一个 PDF 文件以请求签署"
+selectedFile = "已选择的文件"
+selectUsers = "选择�签署的用户"
+selectUsersPlaceholder = "选择�与者..."
+sendingRequest = "正在��..."
 settings = "设置"
 showMeAround = "带我看看"
 sign = "签�"
+signatureRequests = "签署请求"
+signYourself = "自行签署"
+newRequest = "新请求"
 tours = "导览"
+wetSign = "添加签�"
+filterMine = "我的"
+filterOverdue = "已逾期"
+filterSigned = "已签署"
+filterDeclined = "已拒�"
+searchDocuments = "�索文档…"
 
 [quickAccess.helpMenu]
 adminTour = "管�导览"
@@ -6050,11 +6522,75 @@ toolNotAvailableLocally = "您的 Stirling-PDF �务器处于离线状�，且
 expired = "您的会�已过期。请刷新页�并�试。"
 refreshPage = "刷新页�"
 
+[sessionManagement.tooltip]
+header = "管�签署会�"
+
+[sessionManagement.tooltip.addParticipants]
+bullet1 = "新�与者将添加到签署顺�的末尾"
+bullet2 = "会�最终确定�无法�添加�与者"
+bullet3 = "轮到他们时，���与者都会收到通知"
+description = "在最终确定�，您�以�时�活动会�添加更多�与者。"
+title = "添加�与者"
+
+[sessionManagement.tooltip.finalization]
+bullet1 = "<b>完全最终确定</b>：所有�与者�已签署"
+bullet2 = "<b>部分最终确定</b>：部分�与者尚未签署"
+bullet3 = "未签署的�与者将被排除在最终文档之外"
+bullet4 = "最终确定�，您�以将已签署的 PDF 加载到活动文件中"
+description = "最终确定会将所有签��并为一个已签署的 PDF。此�作无法撤销。"
+title = "会�最终确定"
+
+[sessionManagement.tooltip.participantRemoval]
+bullet1 = "无法移除已签署的�与者"
+bullet2 = "被移除的�与者将��收到通知"
+bullet3 = "签署顺�将自动调整"
+description = "�与者�在签署�从会�中移除。"
+title = "移除�与者"
+
+[sessionManagement.tooltip.signatureOrder]
+bullet1 = "�个签�都会按顺�应用到 PDF"
+bullet2 = "�续签署者�以看到较早的签�"
+bullet3 = "对审批�程和法律�全至关��"
+description = "您在创建会�时指定的顺�决定�先签署。"
+title = "签署顺�"
+
+[signatureSettings.tooltip]
+header = "签�外观设置"
+
+[signatureSettings.tooltip.location]
+bullet1 = "示例：“New York, USA��“London Office��“Remote�"
+bullet2 = "与页��置��"
+bullet3 = "�些法域�能�求填写"
+description = "�选的签�应用地��置。存储于�书元数�中。"
+title = "签��置"
+
+[signatureSettings.tooltip.logo]
+bullet1 = "与签��文字一�显示"
+bullet2 = "支� PNG�JPG 格�"
+bullet3 = "��专业外观"
+description = "为��签�添加公� Logo，以增强�牌和真实性。"
+title = "公� Logo"
+
+[signatureSettings.tooltip.reason]
+bullet1 = "示例：“Approval��“Contract Agreement��“Review Complete�"
+bullet2 = "在 PDF 签�属性中��"
+bullet3 = "有助于审计跟踪和�规"
+description = "说明为何签署文档的�选文本。存储于�书元数�中。"
+title = "签�原因"
+
+[signatureSettings.tooltip.visibility]
+bullet1 = "<b>��</b>：签�以自定义外观显示在 PDF 上"
+bullet2 = "<b>���</b>：嵌入�书但�显示视觉标记"
+bullet3 = "���签���供加密验�"
+description = "控制签�是在文档中��，还是以���方�嵌入。"
+title = "签���性"
+
 [settings.configuration]
 advanced = "高级"
 database = "数�库"
 endpoints = "端点"
 features = "功能"
+storageSharing = "文件存储与共享"
 systemSettings = "系统设置"
 title = "�置"
 
@@ -6332,10 +6868,13 @@ title = "登录 Stirling"
 [setup.selfhosted]
 link = "或连接到自托管账户"
 subtitle = "输入您的�务器凭�"
+changeServerLocked = "您的组织已将此应用�制为连接到特定�务器"
 switchToLocal = "改用本地工具"
 title = "登录到�务器"
 
 [setup.selfhosted.unreachable]
+changeServer = "连接到其他�务器"
+changeServerLocked = "您的组织已将此应用�制为连接到特定�务器"
 continueOffline = "改用本地工具"
 message = "无法访问 {{url}}。请检查�务器是�正在�行且�访问。"
 retry = "�试"
@@ -6529,6 +7068,15 @@ saved = "已�存"
 text = "文本"
 title = "签�类型"
 
+[signRequest]
+declined = "签署请求已被拒�"
+fetchFailed = "加载签署请求失败"
+signed = "文档签署�功"
+
+[signSession]
+createFailed = "创建签署请求失败"
+created = "签署请求已��"
+
 [signup]
 accountCreatedSuccessfully = "账户创建�功�您现在�以登录。"
 alreadyHaveAccount = "已�有账户？去登录"
@@ -6807,6 +7355,106 @@ title = "按章节拆分 PDF"
 [splitPdfByChapters]
 tags = "分割,章节,书签,组织"
 
+[storageShare]
+accessed = "已访问"
+accessDenied = "您无�访问此共享文件。请请求所有者与您共享。"
+accessFailed = "无法加载活动。"
+accessDeniedBody = "您无�访问此文件。请请求所有者与您共享。"
+accessDeniedTitle = "无��"
+accessLimitedCommenter = "评论���将上线。如需下载，请�所有者请求编辑者��。"
+accessLimitedTitle = "��访问"
+accessLimitedViewer = "此链接仅�查看。如需下载，请�所有者请求编辑者��。"
+createdAt = "创建时间"
+download = "下载"
+downloadFailed = "无法下载此文件。"
+expiredBody = "此共享链接无效或已过期。"
+expiredTitle = "链接已过期"
+goToLogin = "�往登录"
+loadFailed = "无法打开共享文件。"
+loading = "正在加载共享链接..."
+loginPrompt = "登录以访问此共享文件。"
+loginRequired = "需�登录"
+openInApp = "在 Stirling PDF 中打开"
+ownerLabel = "所有者"
+ownerUnknown = "未知"
+requiresLogin = "此共享文件需�登录。"
+roleCommenter = "评论者"
+roleEditor = "编辑者"
+roleViewer = "查看者"
+shareHeading = "共享文件"
+titleDefault = "共享文件"
+tryAgain = "请���试。"
+addUser = "添加"
+commenterHint = "评论功能�将上线。"
+copied = "链接已�制到剪贴�"
+copy = "�制"
+copyFailed = "�制失败"
+description = "为此文件创建共享链接。�有链接并已登录的用户�以访问。"
+downloadsCount = "下载次数：{{count}}"
+emailWarningBody = "这看起��是一个电�邮件地�。若此人尚未�为 Stirling PDF 用户，则无法访问该文件。"
+emailWarningConfirm = "��共享"
+emailWarningTitle = "电�邮件地�"
+errorTitle = "共享失败"
+failure = "无法生�共享链接。请�试。"
+fileLabel = "文件"
+generate = "生�链接"
+generated = "已生�共享链接"
+hideActivity = "��活动"
+invalidUsername = "请输入有效的用户�或电�邮件地�。"
+lastAccessed = "上次访问时间"
+linkAccessTitle = "共享链接访问"
+linkLabel = "共享链接"
+linksDisabled = "共享链接已被�用。"
+linksDisabledBody = "共享链接已在�务器设置中被�用。"
+manage = "管�共享"
+manageDescription = "创建并管�用于共享此文件的链接。"
+manageLoadFailed = "无法加载共享链接。"
+manageTitle = "管�共享"
+noActivity = "尚无活动。"
+noLinks = "尚无活动的共享链接。"
+noSharedUsers = "尚无用户具有访问��。"
+removeLink = "移除链接"
+removeUser = "移除"
+revokeFailed = "无法移除共享链接。"
+revoked = "已移除共享链接"
+roleLabel = "角色"
+sharingDisabled = "已�用共享。"
+sharingDisabledBody = "�务器设置已�用共享。"
+sharedUsersTitle = "共享用户"
+title = "共享文件"
+unknownUser = "未知用户"
+userAddFailed = "无法与该用户共享。"
+userAdded = "已将用户添加到共享列表。"
+usernameLabel = "用户�或邮箱"
+usernamePlaceholder = "输入用户�或邮箱"
+userRemoveFailed = "无法移除该用户。"
+userRemoved = "已从共享列表中移除用户。"
+viewActivity = "查看活动"
+viewed = "已查看"
+viewsCount = "查看次数: {{count}}"
+downloaded = "已下载"
+bulkDescription = "为所有选中的文件创建一个链接，与已登录用户共享。"
+bulkTitle = "共享所选文件"
+copyLink = "�制共享链接"
+fileCount = "已选择 {{count}} 个文件"
+ownerOnly = "�有所有者�以管�共享。"
+selectSingleFile = "选择�个文件以管�共享。"
+
+[storageUpload]
+description = "这会将当�文件上传到�务器存储，供您自己访问。"
+errorTitle = "上传失败"
+failure = "上传失败。请检查您的登录和存储设置。"
+fileLabel = "文件"
+hint = "公共链接和访问模�由您的�务器设置控制。"
+success = "已上传到�务器"
+title = "上传到�务器"
+updateButton = "在�务器上更新"
+uploadButton = "上传到�务器"
+bulkDescription = "这会将所选文件上传到您的�务器存储。"
+bulkTitle = "上传所选文件"
+fileCount = "已选择 {{count}} 个文件"
+more = " +{{count}} 更多"
+
 [storage]
 approximateSize = "大约大�"
 fileTooLarge = "文件过大。�个文件的最大大�为"
@@ -7153,6 +7801,30 @@ title = "�览/编辑 PDF"
 [warning]
 tooltipTitle = "警告"
 
+[wetSignature.tooltip]
+header = "签�创建方�"
+
+[wetSignature.tooltip.draw]
+bullet1 = "自定义笔颜色和粗细"
+bullet2 = "清除并�新绘制直至满�"
+bullet3 = "适用于触控设备（平��手机）"
+description = "使用鼠标或触摸�创建手写签�。最适�个人�真实的签�。"
+title = "手写签�"
+
+[wetSignature.tooltip.type]
+bullet1 = "从多�字体中选择"
+bullet2 = "自定义文字大�和颜色"
+bullet3 = "适用于标准化签�"
+description = "从输入文本生�签�。快速一致，适用于商务文档。"
+title = "文字签�"
+
+[wetSignature.tooltip.upload]
+bullet1 = "支� PNG�JPG 等图�格�"
+bullet2 = "建议使用�明背景以获得最佳效果"
+bullet3 = "图�将调整大�以适�签�区域"
+description = "上传预先制作的签�图�。如果您有扫�的签�或公�徽标，�想之选。"
+title = "上传签�图�"
+
 [watermark]
 completed = "已添加水�"
 desc = "� PDF 添加文本或图�水�"
@@ -7333,6 +8005,7 @@ activeSession = "活动会�"
 addMembers = "添加�员"
 admin = "管�员"
 confirmDelete = "确定�删除此用户�？此�作无法撤销。"
+confirmUnlock = "确定�解�此用户账户�？"
 deleteUser = "删除用户"
 deleteUserError = "删除用户失败"
 deleteUserSuccess = "用户删除�功"
@@ -7341,6 +8014,8 @@ disable = "�用"
 disabled = "已�用"
 editRole = "编辑角色"
 enable = "�用"
+locked = "已�定"
+lockedBadge = "已�定"
 loading = "正在加载�员..."
 loginRequired = "请先�用登录模�"
 member = "�员"
@@ -7350,6 +8025,9 @@ searchMembers = "�索�员..."
 status = "状�"
 team = "团队"
 title = "�员"
+unlockAccount = "解�账户"
+unlockUserError = "解�用户账户失败"
+unlockUserSuccess = "用户账户已�功解�"
 user = "用户"
 
 [workspace.people.actions]
diff --git a/frontend/public/locales/zh-TW/translation.toml b/frontend/public/locales/zh-TW/translation.toml
index 5ff949526c..862b3d5e8a 100644
--- a/frontend/public/locales/zh-TW/translation.toml
+++ b/frontend/public/locales/zh-TW/translation.toml
@@ -147,7 +147,6 @@ insufficientCredits = "點數�足。需�：{{requiredCredits}}，�用：{{
 loadingCredits = "正在檢查點數..."
 loadingProStatus = "正在檢查訂閱狀態..."
 noticeTopUpOrPlan = "點數�足，請儲值或�級方案"
-
 accessInvite = "邀請"
 
 [account]
@@ -1382,12 +1381,18 @@ title = "回饋訊�"
 
 [admin.settings.telegram.feedback.channel]
 title = "頻�回饋�則"
-errorMessage.description = "�頻�顯示詳細錯誤訊�。"
-errorMessage.label = "顯示錯誤訊�（頻�）"
-errorProcessing.description = "將處�錯誤訊�傳�至頻�。"
-errorProcessing.label = "顯示處�錯誤（頻�）"
-noValidDocument.description = "�頻�上傳抑制「沒有有效文件�的回應。"
-noValidDocument.label = "顯示「沒有有效文件�（頻�）"
+
+[admin.settings.telegram.feedback.channel.errorMessage]
+description = "�頻�顯示詳細錯誤訊�。"
+label = "顯示錯誤訊�（頻�）"
+
+[admin.settings.telegram.feedback.channel.errorProcessing]
+description = "將處�錯誤訊�傳�至頻�。"
+label = "顯示處�錯誤（頻�）"
+
+[admin.settings.telegram.feedback.channel.noValidDocument]
+description = "�頻�上傳抑制「沒有有效文件�的回應。"
+label = "顯示「沒有有效文件�（頻�）"
 
 [admin.settings.telegram.feedback.general.enabled]
 description = "控制機器人是��發�回饋訊�。"
@@ -1395,12 +1400,18 @@ label = "啟用回饋"
 
 [admin.settings.telegram.feedback.user]
 title = "使用者回饋�則"
-errorMessage.description = "�使用者顯示詳細錯誤訊�。"
-errorMessage.label = "顯示錯誤訊�（使用者）"
-errorProcessing.description = "將處�錯誤訊�傳�給使用者。"
-errorProcessing.label = "顯示處�錯誤（使用者）"
-noValidDocument.description = "�使用者上傳抑制「沒有有效文件�的回應。"
-noValidDocument.label = "顯示「沒有有效文件�（使用者）"
+
+[admin.settings.telegram.feedback.user.errorMessage]
+description = "�使用者顯示詳細錯誤訊�。"
+label = "顯示錯誤訊�（使用者）"
+
+[admin.settings.telegram.feedback.user.errorProcessing]
+description = "將處�錯誤訊�傳�給使用者。"
+label = "顯示處�錯誤（使用者）"
+
+[admin.settings.telegram.feedback.user.noValidDocument]
+description = "�使用者上傳抑制「沒有有效文件�的回應。"
+label = "顯示「沒有有效文件�（使用者）"
 
 [admin.settings.telegram.pipelineInboxFolder]
 description = "pipeline 目錄下儲存來自 Telegram 之傳入檔案的資料夾。"
@@ -2324,14 +2335,6 @@ certInvalidFallback = "憑證無效"
 certNetworkError = "無法驗證憑證"
 title = "設定憑證"
 
-[certSign.collab.participant]
-certValidating = "正在驗證憑證..."
-certValid = "✓ 憑證有效"
-certValidUntil = " 有效至 {{date}}"
-certInvalid = "✗ {{error}}"
-certInvalidFallback = "憑證無效"
-certNetworkError = "無法驗證憑證"
-
 [certSign.collab.signRequest.image]
 hint = "上傳 PNG 或 JPG 簽�圖片"
 
@@ -2398,6 +2401,14 @@ label = "簽�文字"
 modalHint = "請輸入姓�，然後點� [繼續] 以放置於 PDF 上。"
 placeholder = "請輸入姓�..."
 
+[certSign.collab.participant]
+certValidating = "正在驗證憑證..."
+certValid = "✓ 憑證有效"
+certValidUntil = " 有效至 {{date}}"
+certInvalid = "✗ {{error}}"
+certInvalidFallback = "憑證無效"
+certNetworkError = "無法驗證憑證"
+
 [certSign.collab.addParticipants]
 add = "新增 {{count}} ��與者"
 back = "上一步"
@@ -2863,6 +2874,9 @@ title = "�質調整"
 [compressPdfs]
 tags = "壓縮,�,微�"
 
+[config]
+plan = "方案"
+
 [config.account.overview]
 confirmDelete = "刪除我的帳號"
 deleteAccount = "刪除帳號"
@@ -2916,9 +2930,6 @@ socialLogin = "使用社群帳號�級"
 title = "�級訪客帳號"
 upgradeButton = "�級帳號"
 
-[config]
-plan = "方案"
-
 [config.apiKeys]
 chartAriaLabel = "�度使用：包� {{includedUsed}} / {{includedTotal}}，已購買 {{purchasedUsed}} / {{purchasedTotal}}"
 copyKeyAriaLabel = "複製 API 金鑰"
@@ -3882,47 +3893,47 @@ sortBy = "排�方�："
 
 [home.addAttachments]
 desc = "在 PDF 中新增或移除內嵌檔案（附件）"
-tags = "內嵌,附加,包�"
+tags = "內嵌,附加,包�,embed,attach,include,attachments,attach files,embed files,include files,add files,file attachment,associated files,supplementary files"
 title = "新增附件"
 
 [home.addImage]
 desc = "在 PDF 的指定�置新增圖片"
-tags = "�入,內嵌,放置"
+tags = "�入,內嵌,放置,insert,embed,place,add image,insert image,place image,embed image,add photo,add picture,add logo,graphics,insert picture,place photo,PNG,JPG,JPEG"
 title = "新增圖片"
 
 [home.addPageNumbers]
 desc = "在文件的設定�置新增�碼"
-tags = "編號,�碼,計數"
+tags = "編號,�碼,計數,number,pagination,count,add page numbers,page numbering,page numbers,footer,header,number pages,sequential,pagination tool"
 title = "新增�碼"
 
 [home.addPassword]
 desc = "用密碼加密您的 PDF 檔案。"
-tags = "加密,密碼,鎖定,安全,�護,安全性,加密,�障,機密,�人,�制存�"
+tags = "加密,密碼,鎖定,安全,�護,安全性,加密,�障,機密,�人,�制存�,encrypt,password,lock,secure,protect,security,encryption,safeguard,confidential,private,restrict access"
 title = "新增密碼"
 
 [home.addStamp]
 desc = "在指定�置加入文字或影�圖章"
-tags = "圖章,標記,�章"
+tags = "圖章,標記,�章,stamp,mark,seal,approved,rejected,confidential,stamp tool,rubber stamp,date stamp,approval stamp,received,void,copy,original"
 title = "新增圖章至 PDF"
 
 [home.addText]
 desc = "在 PDF 的任��置新增自訂文字"
-tags = "文字,註解,標籤"
+tags = "文字,註解,標籤,text,annotation,label,add text,insert text,place text,text box,add label,add caption,type on PDF,write on PDF,add words,add note,text overlay,typewriter"
 title = "新增文字"
 
 [home.adjustContrast]
 desc = "調整 PDF 的�比度�飽和度和亮度"
-tags = "�比,亮度,飽和度"
+tags = "�比,亮度,飽和度,contrast,brightness,saturation,adjust colors,color correction,enhance,lighten,darken,improve quality,color balance,hue,vibrance"
 title = "調整�色/�比度"
 
 [home.annotate]
 desc = "在檢視器中�顯�手繪�加入註釋與形狀"
-tags = "註解,螢光標記,繪圖"
+tags = "註解,螢光標記,繪圖,annotate,highlight,draw,markup,comment,notes,review,redline,feedback,markup tools,sticky notes,shapes,arrows,text box,freehand"
 title = "註解"
 
 [home.automate]
 desc = "將多個 PDF 動作串接，建立多步驟工作�程。���複性工作。"
-tags = "工作�程,�列,自動化"
+tags = "工作�程,�列,自動化,workflow,sequence,automation,automate,batch,batch processing,pipeline,chain,multi-step,recurring,scheduled,automatic,process multiple,bulk operations"
 title = "自動化"
 
 [home.formFill]
@@ -3931,112 +3942,112 @@ title = "填寫表單"
 
 [home.autoRename]
 desc = "��測到的標頭自動�新命� PDF 檔案"
-tags = "自動�測,�標頭,整�,�新命�"
+tags = "自動�測,�標頭,整�,�新命�,auto-detect,header-based,organize,relabel,auto rename,automatic rename,smart rename,rename by content,filename,file naming,detect title"
 title = "自動�新命� PDF 檔案"
 
 [home.autoSizeSplitPDF]
 desc = "根據大���數或檔案數將單一 PDF 分割為多個檔案"
-tags = "自動,分割,大�"
+tags = "自動,分割,大�,auto,split,size"
 title = "根據大�/數�自動分割"
 
 [home.autoSplitPDF]
 desc = "自動分割掃�的 PDF，使用實體掃���分割器 QR Code"
-tags = "自動,分割,QR"
+tags = "自動,分割,QR,auto,split,auto split,QR code,QR split,barcode,automatic split,divider page,separator page,scan divider,batch scanning"
 title = "自動分割��"
 
 [home.bookletImposition]
 desc = "建立��列�與�訂的�冊���與多�版�"
-tags = "�冊�,列�,�訂"
+tags = "�冊�,列�,�訂,booklet,print,binding,imposition,booklet printing,saddle stitch,fold,pamphlet,brochure,print booklet,duplex,two-sided,signature,book layout,page imposition,print layout"
 title = "�冊�拼版"
 
 [home.certSign]
 desc = "使用憑證/金鑰（PEM/P12）簽章 PDF"
-tags = "驗證,PEM,P12,官方,加密,簽署,憑證,PKCS12,JKS,伺�器,手動,自動"
+tags = "驗證,PEM,P12,官方,加密,簽署,憑證,PKCS12,JKS,伺�器,手動,自動,authenticate,official,encrypt,sign,certificate,server,manual,auto,digital certificate,certificate signature,PKI,cryptographic signature,trusted signature"
 title = "使用憑證簽章"
 
 [home.changeMetadata]
 desc = "從 PDF 檔案中變更/移除/新增中繼資料"
-tags = "編輯,修改,更新"
+tags = "編輯,修改,更新,edit,modify,update,metadata,properties,document properties,author,title,subject,keywords,creator,producer,info,document info,file properties"
 title = "變更中繼資料"
 
 [home.changePermissions]
 desc = "變更文件�制與權�"
-tags = "權�,�制,權利,存�控制,�許,拒絕,列�,複製,編輯,修改權�,安全設定,使用者權利"
+tags = "權�,�制,權利,存�控制,�許,拒絕,列�,複製,編輯,修改權�,安全設定,使用者權利,permissions,restrictions,rights,access control,allow,deny,printing,copying,editing,modify permissions,security settings,user rights"
 title = "變更權�"
 
 [home.compare]
 desc = "比較並顯示 2 個 PDF 檔案的差異"
-tags = "差異"
+tags = "差異,difference,compare,diff,compare PDFs,compare documents,find differences,show differences,changes,what changed,track changes,revisions,version compare,side by side,contrast,delta"
 title = "比較"
 
 [home.compress]
 desc = "壓縮 PDF 以減少其檔案大�。"
-tags = "壓縮,減少,最佳化"
+tags = "壓縮,減少,最佳化,shrink,reduce,optimize,compress,smaller,downsize,file size,reduce size,minimize,make smaller,decrease size,optimize size"
 title = "壓縮"
 
 [home.convert]
 desc = "在��格�之間轉�檔案"
-tags = "轉�,變更"
+tags = "轉�,變更,transform,change,convert,PDF to Word,PDF to Excel,PDF to image,Word to PDF,Excel to PDF,PowerPoint to PDF,HTML to PDF,export,import,file conversion,format change,save as"
 title = "轉�"
 
 [home.crop]
 desc = "�剪 PDF 以減少其大�（��文字�）"
-tags = "�切,剪�,調整大�"
+tags = "�切,剪�,調整大�,trim,cut,resize,crop,crop PDF,trim PDF,trim margins,remove margins,cut edges,trim borders,remove white space,crop pages,trim pages,reduce margins,set margins"
 title = "�剪 PDF"
 
 [home.devAirgapped]
 desc = "連�至隔離網路設定指�"
-tags = "離線,隔離,無網路,斷線,安全,網路隔離,�立�作"
+tags = "離線,隔離,無網路,斷線,安全,網路隔離,�立�作,air-gapped,offline,isolated,no internet,disconnected,secure,network isolation,standalone"
 title = "隔離網路設定"
 
 [home.devApi]
 desc = "連�至 API 文件"
-tags = "API,開發,文件"
+tags = "API,開發,文件,development,documentation,developer,REST,integration,endpoints,programmatic,automation,scripting"
 title = "API"
 
 [home.devFolderScanning]
 desc = "連�至自動化資料夾掃�指�"
-tags = "自動化,資料夾,掃�"
+tags = "自動化,資料夾,掃�,automation,folder,scanning,watch folder,hot folder,automatic processing,batch,monitor folder,auto process,folder monitoring"
 title = "自動化資料夾掃�"
 
 [home.devSsoGuide]
 desc = "連�至 SSO 指�"
-tags = "SSO,單一登入,驗證,SAML,OAuth,OIDC,登入,�業,身分�供者,IdP"
+tags = "SSO,單一登入,驗證,SAML,OAuth,OIDC,登入,�業,身分�供者,IdP,single sign-on,authentication,login,enterprise,identity provider"
 title = "SSO 指�"
 
 [home.editTableOfContents]
 desc = "在 PDF 檔案中新增或編輯書籤和目錄"
-tags = "書籤,目錄,編輯"
+tags = "書籤,目錄,編輯,bookmarks,contents,edit,table of contents,TOC,outline,navigation,chapters,sections,add bookmarks,edit bookmarks,PDF outline"
 title = "編輯目錄"
 
 [home.extractImages]
 desc = "從 PDF 中��所有圖片並將它們儲存到壓縮檔中"
-tags = "擷�,儲存,匯出"
+tags = "擷�,儲存,匯出,pull,save,export,extract images,get images,save images,export images,extract photos,extract pictures,pull images,download images,rip images,extract graphics,save photos"
 title = "��圖片"
 
 [home.extractPages]
 desc = "從 PDF 檔案中擷�特定��"
-tags = "擷�,��,複製"
+tags = "擷�,��,複製,pull,select,copy,extract,extract pages,get pages,pull out,save pages,export pages,copy pages,select pages,specific pages"
 title = "����"
 
 [home.flatten]
 desc = "從 PDF 中移除所有互動元素和表單"
-tags = "簡化,移除,互動"
+tags = "簡化,移除,互動,simplify,remove,interactive,flatten,flatten form,remove form fields,make static,finalize form,lock form,disable editing,convert to image,non-editable"
 title = "平�化"
 
 [home.getPdfInfo]
 desc = "�得 PDF 的所有�能資訊"
-tags = "資訊,中繼資料,詳細"
+tags = "資訊,中繼資料,詳細,info,metadata,details,PDF info,document info,properties,file info,get info,show info,view properties,document properties,statistics,page count,file details,inspect"
 title = "�得 PDF 的所有資訊"
 
 [home.manageCertificates]
 desc = "匯入�匯出或刪除用於簽署 PDF 的數�憑證檔。"
-tags = "憑證,匯入,匯出"
+tags = "憑證,匯入,匯出,certificates,import,export,manage certificates,digital certificates,certificate management,PFX,P12,keystore,import certificate,export certificate,certificate store,PKI"
 title = "管�憑證"
 
 [home.merge]
 desc = "輕鬆將多個 PDF �併為一個。"
-tags = "�併,連接,整�"
+tags = "�併,連接,整�,combine,join,unite,merge,merge PDFs,combine PDFs,join PDFs,concatenate,append,stitch,combine files,join files,merge documents"
 title = "�併"
 
 [home.mobile]
@@ -4051,162 +4062,162 @@ workspace = "工作�"
 
 [home.multiTool]
 desc = "�併�旋轉��新排列和移除��"
-tags = "多個,工具"
+tags = "多個,工具,multiple,tools,multi-tool,all-in-one,swiss army,page organizer,page editor,edit pages,manage pages,organize,reorganize"
 title = "PDF 複�工具"
 
 [home.ocr]
 desc = "清�掃�並從 PDF 中的影�中�測文字並�新新增為文字。"
-tags = "擷�,掃�"
+tags = "擷�,掃�,extract,scan,OCR,optical character recognition,text recognition,scan to text,image to text,scanned document,searchable PDF,make searchable,extract text,recognize text,read scanned"
 title = "OCR / 清�掃�"
 
 [home.overlay-pdfs]
 desc = "將 PDF 覆蓋在�一個 PDF 上"
-tags = "疊加,�併,圖層,�疊,疊加 PDF,圖層 PDF,�併 PDF,堆疊,疊加��,背景,�景,��"
+tags = "疊加,�併,圖層,�疊,疊加 PDF,圖層 PDF,�併 PDF,堆疊,疊加��,背景,�景,��,overlay,combine,merge,layer,superimpose,overlay PDF,layer PDFs,combine PDFs,stack,overlay pages,background,foreground,composite"
 title = "覆蓋 PDF"
 
 [home.pageLayout]
 desc = "將 PDF 檔案的多個���併到單一��"
-tags = "版�,排列,組�"
+tags = "版�,排列,組�,layout,arrange,combine,N-up,2-up,4-up,multiple per page,pages per sheet,layout pages,tile,grid layout,multi-page layout,combine on page,handout"
 title = "多�版��置"
 
 [home.pdfOrganiser]
 desc = "以任何順�移除/�新排列��"
-tags = "整�,�新排列,�新排�"
+tags = "整�,�新排列,�新排�,organize,rearrange,reorder,organise,arrange pages,sort,move pages,delete pages,remove pages,page management,page organizer,page organiser,resequence"
 title = "整�"
 
 [home.pdfTextEditor]
 desc = "檢視與編輯 Stirling PDF 的 JSON 匯出，支�群組文字編輯與�新產生 PDF"
-tags = "編輯文字,修改文字,變更文字,編輯內容,更新文字,改寫,校正,修訂,文字編輯器,內容編輯器"
+tags = "編輯文字,修改文字,變更文字,編輯內容,更新文字,改寫,校正,修訂,文字編輯器,內容編輯器,edit text,modify text,change text,edit content,update text,rewrite,correct,amend,redline,revise,text editor,content editor"
 title = "PDF 文字編輯器"
 
 [home.pdfToSinglePage]
 desc = "將所有 PDF ���併為一個大的單一��"
-tags = "�併,整�,單�"
+tags = "�併,整�,單�,combine,merge,single,single page,one page,merge to single,combine all,stitch pages,concatenate vertical,long page,poster"
 title = "PDF 轉單一大��"
 
 [home.read]
 desc = "檢視並註解 PDFs。��白文字�繪圖或�入評論以供審閱與�作。"
-tags = "檢視,開啟,顯示"
+tags = "檢視,開啟,顯示,view,open,display,read,viewer,PDF viewer,PDF reader,open PDF,view PDF,display PDF,preview,browse"
 title = "閱讀"
 
 [home.redact]
 desc = "�據��的文字�繪製的形狀和��的��塗黑 PDF"
-tags = "�蔽,塗黑,隱�"
+tags = "�蔽,塗黑,隱�,censor,blackout,hide,redact,redaction,black out,block out,remove sensitive,hide text,privacy,confidential,GDPR,PII,sensitive data,permanently remove,cover up,legal redaction"
 title = "手動塗黑"
 
 [home.removeAnnotations]
 desc = "從 PDF 中移除所有註釋/註解"
-tags = "刪除,清�,去除"
+tags = "刪除,清�,去除,delete,clean,strip,remove annotations,remove comments,delete comments,remove markup,remove highlights,clean annotations,strip comments,remove notes,delete markup,clear comments"
 title = "移除註釋"
 
 [home.removeBlanks]
 desc = "�測並從文件中移除空白��"
-tags = "刪除,清�,空白"
+tags = "刪除,清�,空白,delete,clean,empty,remove blank,delete blank pages,empty pages,white pages,remove empty,clean up,cleanup blank"
 title = "移除空白��"
 
 [home.removeCertSign]
 desc = "從 PDF 移除簽章"
-tags = "移除,刪除,解鎖"
+tags = "移除,刪除,解鎖,remove,delete,unlock,remove certificate,remove signature,delete signature,unsigned,remove digital signature,strip signature,remove cert,unsign"
 title = "移除簽章"
 
 [home.removeImage]
 desc = "從 PDF 中移除圖片以減少檔案大�"
-tags = "移除,刪除,清�"
+tags = "移除,刪除,清�,remove,delete,clean,remove image,delete image,strip images,remove pictures,delete photos,clean images,reduce size,remove graphics"
 title = "移除圖片"
 
 [home.removePages]
 desc = "從您的 PDF 檔案中刪除�需�的��。"
-tags = "刪除,擷�,排除"
+tags = "刪除,擷�,排除,delete,extract,exclude,remove pages,delete pages,remove page,delete page,exclude pages,take out pages,discard pages,drop pages"
 title = "移除"
 
 [home.removePassword]
 desc = "從您的 PDF 檔案中移除密碼�護。"
-tags = "解鎖"
+tags = "解鎖,unlock,remove password,unlock PDF,decrypt,remove encryption,unprotect,open protected PDF,password removal,unlock protected,disable password,remove security,remove owner password"
 title = "移除密碼"
 
 [home.reorganizePages]
 desc = "��視覺化拖放控制，�新排列�複製或刪除 PDF ��。"
-tags = "�新排列,�新排�,整�"
+tags = "�新排列,�新排�,整�,rearrange,reorder,organize,reorganize,move pages,page order,sort pages,arrange pages,shuffle,resequence"
 title = "�組��"
 
 [home.repair]
 desc = "嘗試修復�壞/破�的 PDF"
-tags = "修復,還原"
+tags = "修復,還原,fix,restore,repair,fix PDF,fix broken,fix corrupt,repair PDF,repair corrupt,broken PDF,corrupt PDF,damaged PDF,recover,fix errors,PDF won't open,can't open PDF,PDF errors,troubleshoot,restore PDF,rebuild,corrupted"
 title = "修復"
 
 [home.replaceColor]
 desc = "在 PDF 檔案中�代或�轉�色"
-tags = "�代�色,�轉�色,�色�代,交��色,變更�色,�轉,負片,�色交�,尋找並�代�色,轉��色,�色變更"
+tags = "�代�色,�轉�色,�色�代,交��色,變更�色,�轉,負片,�色交�,尋找並�代�色,轉��色,�色變更,replace color,invert color,color replacement,swap colors,change color,invert,negative,color swap,find and replace color,convert color,color change"
 title = "�代與�轉�色"
 
 [home.rotate]
 desc = "輕鬆旋轉您的 PDF。"
-tags = "旋轉,翻轉,調整方�"
+tags = "旋轉,翻轉,調整方�,turn,flip,orient,rotate,orientation,landscape,portrait,90 degrees,180 degrees,clockwise,anticlockwise,counter-clockwise,fix orientation"
 title = "旋轉"
 
 [home.sanitize]
 desc = "移除 PDF 中�能有害的元素"
-tags = "清�,清除,移除"
+tags = "清�,清除,移除,clean,purge,remove,sanitize,sanitise,remove scripts,remove javascript,remove metadata,strip metadata,security,clean document,remove hidden data,privacy"
 title = "淨化"
 
 [home.scalePages]
 desc = "修改���其內容的大�/比例。"
-tags = "調整大�,調整,縮放"
+tags = "調整大�,調整,縮放,resize,adjust,scale,page size,resize page,scale page,change size,adjust size,enlarge,shrink page,fit to page,A4,letter size"
 title = "調整��大�/比例"
 
 [home.scannerEffect]
 desc = "建立看起來�是掃��的 PDF"
-tags = "掃�,模擬,建立"
+tags = "掃�,模擬,建立,scan,simulate,create,fake scan,look scanned,scanner effect,make look scanned,photocopy effect,simulate scanner,realistic scan"
 title = "掃�器效果"
 
 [home.scannerImageSplit]
 desc = "�測並將掃�的照片分割為�立��"
-tags = "�測,分割,照片"
+tags = "�測,分割,照片,detect,split,photos,auto detect,detect photos,split photos,separate photos,split scanned images,multiple photos,auto split,photo detection,image detection,scan separation"
 title = "�測並分割掃�照片"
 
 [home.showJS]
 desc = "�尋並顯示嵌入 PDF 中的任何 JS（JavaScript）"
-tags = "JavaScript,程�碼,指令碼"
+tags = "JavaScript,程�碼,指令碼,javascript,code,script,show javascript,show JS,find javascript,detect javascript,view javascript,embedded scripts,malware,security,inspect,debug"
 title = "顯示 JavaScript"
 
 [home.sign]
 desc = "��繪圖�文字或影�新增簽章到 PDF"
-tags = "簽�,署�"
+tags = "簽�,署�,signature,autograph,e-sign,electronic signature,digital signature,sign document,approval,signoff,authorize,endorse,ink signature,handwriting"
 title = "簽章"
 
 [home.timestampPdf]
 desc = "新增 RFC 3161 文件時間戳記，以證明您的 PDF 於何時存在"
-tags = "時間戳記,RFC 3161,TSA,時間戳記授權機構,文件時間戳記,存在證明,時間戳記權�,�信時間戳記,簽署時間戳記,公證"
+tags = "時間戳記,RFC 3161,TSA,時間戳記授權機構,文件時間戳記,存在證明,時間戳記權�,�信時間戳記,簽署時間戳記,公證,timestamp,time stamp authority,document timestamp,proof of existence,timestamp token,trusted timestamp,sign timestamp,notarise"
 title = "PDF 加上時間戳記"
 
 [home.split]
 desc = "將 PDF 分割為多個檔案"
-tags = "分割,分開,拆分"
+tags = "分割,分開,拆分,divide,separate,break,split,extract pages,separate pages,divide document,break apart,separate files,unbind,split by page,divide by chapter"
 title = "分割"
 
 [home.splitByChapters]
 desc = "根據 PDF 的章節�構將其分割�多個檔案。"
-tags = "分割,章節,�構"
+tags = "分割,章節,�構,split,chapters,structure,split by chapters,split by bookmarks,bookmarks,outline,table of contents,TOC split,chapter split,divide by sections"
 title = "�章節分割 PDF"
 
 [home.splitBySections]
 desc = "將 PDF 的��分�較�的水平與垂直�塊"
-tags = "分割,�塊,切分"
+tags = "分割,�塊,切分,split,sections,divide,split by sections,grid split,divide pages,split into sections,cut pages,divide grid,section split,horizontal split,vertical split"
 title = "��塊分割 PDF"
 
 [home.swagger]
 desc = "檢視 API 文件並測試端點"
-tags = "API,文件,測試"
+tags = "API,文件,測試,documentation,test,swagger,API docs,REST API,endpoints,developer,API reference,API testing,OpenAPI,integration,developer docs"
 title = "API 文件"
 
 [home.unlockPDFForms]
 desc = "移除 PDF 檔案中表單欄�的唯讀屬性"
-tags = "解鎖,啟用,編輯"
+tags = "解鎖,啟用,編輯,unlock,enable,edit,unlock forms,enable forms,editable forms,remove read only,make editable,unlock fields,enable editing,form fields,fillable,unprotect forms"
 title = "解鎖 PDF 表單"
 
 [home.validateSignature]
 desc = "驗證 PDF 檔案中的數�簽章與憑證"
-tags = "驗證,校驗,憑證"
+tags = "驗證,校驗,憑證,validate,verify,certificate,validate signature,verify signature,check signature,digital signature,certificate verification,signature validation,authentic,trust,signed,verify certificate"
 title = "驗證 PDF 簽章"
 
 [home.viewPdf]
@@ -4215,7 +4226,7 @@ title = "檢視/編輯 PDF"
 
 [home.watermark]
 desc = "在您的 PDF 檔案中新增自訂浮水�。"
-tags = "圖章,標記,覆蓋"
+tags = "圖章,標記,覆蓋,stamp,mark,overlay,watermark,branding,logo,confidential,draft,copyright,trademark,text overlay,image overlay,background text"
 title = "新增浮水�"
 
 [HTMLToPDF]
@@ -4879,6 +4890,49 @@ textStats = "{{lines}} 行 · {{size}}"
 lineNumbers = "行號"
 renderMarkdown = "轉譯 Markdown"
 
+[viewer.attachments]
+title = "附件"
+searchPlaceholder = "�尋附件"
+noSupport = "此檢視器�支�附件。"
+noDocument = "開啟 PDF 以檢視其附件。"
+loading = "正在載入附件..."
+empty = "此文件沒有附件"
+noMatch = "沒有符��尋的附件"
+
+[viewer.comments]
+title = "è©•è«–"
+hint = "使用「評論��「�入文字�或「�代文字�工具放置評論。它們會���顯示於此處。"
+placeholder = "輸入您的評論..."
+pageLabel = "第 {{page}} �"
+oneComment = "1 則評論"
+nComments = "{{count}} 則評論"
+addCommentPlaceholder = "新增評論..."
+addLink = "新增連�"
+goToLink = "�往連�"
+addComment = "新增評論"
+viewComment = "檢視評論"
+addReplyPlaceholder = "新增回覆..."
+saveReply = "儲存回覆"
+send = "傳�"
+moreActions = "更多動作"
+typeComment = "è©•è«–"
+typeInsertText = "�入文字"
+typeReplaceText = "�代文字"
+locateAnnotation = "在文件中定�"
+deleteTitle = "�從評論中移除註解嗎？"
+deleteDescription = "此註解附有評論。您�以僅從�邊欄移除評論並�留註解，或刪除全部內容。"
+removeCommentOnly = "僅移除評論"
+deleteAnnotationAndComment = "刪除註解與評論"
+
+[viewer.formBar]
+title = "表單欄�"
+unsavedBadge = "未儲存"
+unsavedDesc = "您有未儲存的變更"
+hasFieldsDesc = "此 PDF 包��填寫欄�"
+dismiss = "關閉"
+apply = "套用變更"
+download = "下載 PDF"
+
 [rightRail]
 closeSelected = "關閉已�檔案"
 selectAll = "全�"
@@ -5763,7 +5817,6 @@ messageWithAmount = "執行 {{tool}} 需� {{required}} 點，但您僅有 {{cu
 teamMember = "啟用超�計費，永�耗盡點數。"
 title = "點數�足"
 
-
 [printFile]
 header = "使用�表機�出檔案"
 submit = "列�"
@@ -6457,8 +6510,6 @@ placeholder = "輸入�尋詞..."
 searching = "�尋中..."
 title = "�尋 PDF"
 
-[selfHosted]
-
 [selfHosted.offline]
 hideTools = "隱�無法使用的工具 ▴"
 messageNoFallback = "在您的伺�器�復連線�，這些工具無法使用。"
@@ -6817,10 +6868,13 @@ title = "登入 Stirling"
 [setup.selfhosted]
 link = "或連線到自行託管的帳號"
 subtitle = "輸入您的伺�器�證資訊"
+changeServerLocked = "您的組織已將此應用程��制於特定伺�器"
 switchToLocal = "改用本機工具"
 title = "登入伺�器"
 
 [setup.selfhosted.unreachable]
+changeServer = "連線至其他伺�器"
+changeServerLocked = "您的組織已將此應用程��制於特定伺�器"
 continueOffline = "改用本機工具"
 message = "無法連線至 {{url}}。請確�伺�器正在執行且�存�。"
 retry = "�試"
@@ -7739,49 +7793,6 @@ fileManager = "檔案管�器"
 pageEditor = "��編輯器"
 viewer = "檢視器"
 
-[viewer.attachments]
-title = "附件"
-searchPlaceholder = "�尋附件"
-noSupport = "此檢視器�支�附件。"
-noDocument = "開啟 PDF 以檢視其附件。"
-loading = "正在載入附件..."
-empty = "此文件沒有附件"
-noMatch = "沒有符��尋的附件"
-
-[viewer.comments]
-title = "è©•è«–"
-hint = "使用「評論��「�入文字�或「�代文字�工具放置評論。它們會���顯示於此處。"
-placeholder = "輸入您的評論..."
-pageLabel = "第 {{page}} �"
-oneComment = "1 則評論"
-nComments = "{{count}} 則評論"
-addCommentPlaceholder = "新增評論..."
-addLink = "新增連�"
-goToLink = "�往連�"
-addComment = "新增評論"
-viewComment = "檢視評論"
-addReplyPlaceholder = "新增回覆..."
-saveReply = "儲存回覆"
-send = "傳�"
-moreActions = "更多動作"
-typeComment = "è©•è«–"
-typeInsertText = "�入文字"
-typeReplaceText = "�代文字"
-locateAnnotation = "在文件中定�"
-deleteTitle = "�從評論中移除註解嗎？"
-deleteDescription = "此註解附有評論。您�以僅從�邊欄移除評論並�留註解，或刪除全部內容。"
-removeCommentOnly = "僅移除評論"
-deleteAnnotationAndComment = "刪除註解與評論"
-
-[viewer.formBar]
-title = "表單欄�"
-unsavedBadge = "未儲存"
-unsavedDesc = "您有未儲存的變更"
-hasFieldsDesc = "此 PDF 包��填寫欄�"
-dismiss = "關閉"
-apply = "套用變更"
-download = "下載 PDF"
-
 [viewPdf]
 header = "檢視 PDF"
 tags = "檢視,閱讀,註釋,文字,圖片"
@@ -8255,7 +8266,6 @@ title = "大型 ZIP 檔案"
 [cloudBadge]
 tooltip = "此�作會使用您的雲端點數"
 
-
 [team]
 cancelInviteError = "�消邀請失敗"
 confirmCancelInvite = "確定��消此邀請嗎？"
diff --git a/frontend/public/manifest-classic.json b/frontend/public/manifest-classic.json
index 9b47da7d05..d6e81e7ddf 100644
--- a/frontend/public/manifest-classic.json
+++ b/frontend/public/manifest-classic.json
@@ -23,4 +23,3 @@
   "theme_color": "#000000",
   "background_color": "#ffffff"
 }
-
diff --git a/frontend/scripts/build-provisioner.mjs b/frontend/scripts/build-provisioner.mjs
index 2f974a195f..8cd5c5cfc6 100644
--- a/frontend/scripts/build-provisioner.mjs
+++ b/frontend/scripts/build-provisioner.mjs
@@ -1,28 +1,56 @@
-import { execFileSync } from 'node:child_process';
-import { existsSync, mkdirSync, copyFileSync } from 'node:fs';
-import { join, resolve } from 'node:path';
+import { execFileSync } from "node:child_process";
+import { existsSync, mkdirSync, copyFileSync } from "node:fs";
+import { join, resolve } from "node:path";
 
-if (process.platform !== 'win32') {
+if (process.platform !== "win32") {
   process.exit(0);
 }
 
 const frontendDir = process.cwd();
-const tauriDir = resolve(frontendDir, 'src-tauri');
-const provisionerManifest = join(tauriDir, 'provisioner', 'Cargo.toml');
+const tauriDir = resolve(frontendDir, "src-tauri");
+const provisionerManifest = join(tauriDir, "provisioner", "Cargo.toml");
 
 execFileSync(
-  'cargo',
-  ['build', '--release', '--manifest-path', provisionerManifest],
-  { stdio: 'inherit' }
+  "cargo",
+  ["build", "--release", "--manifest-path", provisionerManifest],
+  { stdio: "inherit" },
 );
 
-const provisionerExe = join(tauriDir, 'provisioner', 'target', 'release', 'stirling-provisioner.exe');
+const provisionerExe = join(
+  tauriDir,
+  "provisioner",
+  "target",
+  "release",
+  "stirling-provisioner.exe",
+);
 if (!existsSync(provisionerExe)) {
   throw new Error(`Provisioner binary not found at ${provisionerExe}`);
 }
 
-const wixDir = join(tauriDir, 'windows', 'wix');
+const wixDir = join(tauriDir, "windows", "wix");
 mkdirSync(wixDir, { recursive: true });
 
-const destExe = join(wixDir, 'stirling-provision.exe');
+const destExe = join(wixDir, "stirling-provision.exe");
 copyFileSync(provisionerExe, destExe);
+
+// --- Thumbnail handler DLL ---
+const thumbManifest = join(tauriDir, "thumbnail-handler", "Cargo.toml");
+
+execFileSync(
+  "cargo",
+  ["build", "--release", "--manifest-path", thumbManifest],
+  { stdio: "inherit" },
+);
+
+const thumbDll = join(
+  tauriDir,
+  "thumbnail-handler",
+  "target",
+  "release",
+  "stirling_thumbnail_handler.dll",
+);
+if (!existsSync(thumbDll)) {
+  throw new Error(`Thumbnail handler DLL not found at ${thumbDll}`);
+}
+
+copyFileSync(thumbDll, join(wixDir, "stirling_thumbnail_handler.dll"));
diff --git a/frontend/scripts/generate-icons.js b/frontend/scripts/generate-icons.js
index 96566341c6..fb9ecd71ec 100644
--- a/frontend/scripts/generate-icons.js
+++ b/frontend/scripts/generate-icons.js
@@ -1,11 +1,12 @@
 #!/usr/bin/env node
 
-const { icons } = require('@iconify-json/material-symbols');
-const fs = require('fs');
-const path = require('path');
+const { icons } = require("@iconify-json/material-symbols");
+const fs = require("fs");
+const path = require("path");
 
 // Check for verbose flag
-const isVerbose = process.argv.includes('--verbose') || process.argv.includes('-v');
+const isVerbose =
+  process.argv.includes("--verbose") || process.argv.includes("-v");
 
 // Logging functions
 const info = (message) => console.log(message);
@@ -18,12 +19,12 @@ const debug = (message) => {
 // Function to scan codebase for LocalIcon usage
 function scanForUsedIcons() {
   const usedIcons = new Set();
-  const srcDir = path.join(__dirname, '..', 'src');
+  const srcDir = path.join(__dirname, "..", "src");
 
-  info('� Scanning codebase for LocalIcon usage...');
+  info("� Scanning codebase for LocalIcon usage...");
 
   if (!fs.existsSync(srcDir)) {
-    console.error('� Source directory not found:', srcDir);
+    console.error("� Source directory not found:", srcDir);
     process.exit(1);
   }
 
@@ -31,72 +32,92 @@ function scanForUsedIcons() {
   function scanDirectory(dir) {
     const files = fs.readdirSync(dir);
 
-    files.forEach(file => {
+    files.forEach((file) => {
       const filePath = path.join(dir, file);
       const stat = fs.statSync(filePath);
 
       if (stat.isDirectory()) {
         scanDirectory(filePath);
-      } else if (file.endsWith('.tsx') || file.endsWith('.ts')) {
-        const content = fs.readFileSync(filePath, 'utf8');
+      } else if (file.endsWith(".tsx") || file.endsWith(".ts")) {
+        const content = fs.readFileSync(filePath, "utf8");
 
         // Match LocalIcon usage: <LocalIcon icon="icon-name" ...>
-        const localIconMatches = content.match(/<LocalIcon\s+[^>]*icon="([^"]+)"/g);
+        const localIconMatches = content.match(
+          /<LocalIcon\s+[^>]*icon="([^"]+)"/g,
+        );
         if (localIconMatches) {
-          localIconMatches.forEach(match => {
+          localIconMatches.forEach((match) => {
             const iconMatch = match.match(/icon="([^"]+)"/);
             if (iconMatch) {
               usedIcons.add(iconMatch[1]);
-              debug(`  Found: ${iconMatch[1]} in ${path.relative(srcDir, filePath)}`);
+              debug(
+                `  Found: ${iconMatch[1]} in ${path.relative(srcDir, filePath)}`,
+              );
             }
           });
         }
 
         // Match LocalIcon usage: <LocalIcon icon='icon-name' ...>
-        const localIconSingleQuoteMatches = content.match(/<LocalIcon\s+[^>]*icon='([^']+)'/g);
+        const localIconSingleQuoteMatches = content.match(
+          /<LocalIcon\s+[^>]*icon='([^']+)'/g,
+        );
         if (localIconSingleQuoteMatches) {
-          localIconSingleQuoteMatches.forEach(match => {
+          localIconSingleQuoteMatches.forEach((match) => {
             const iconMatch = match.match(/icon='([^']+)'/);
             if (iconMatch) {
               usedIcons.add(iconMatch[1]);
-              debug(`  Found: ${iconMatch[1]} in ${path.relative(srcDir, filePath)}`);
+              debug(
+                `  Found: ${iconMatch[1]} in ${path.relative(srcDir, filePath)}`,
+              );
             }
           });
         }
 
         // Match old material-symbols-rounded spans: <span className="material-symbols-rounded">icon-name</span>
-        const spanMatches = content.match(/<span[^>]*className="[^"]*material-symbols-rounded[^"]*"[^>]*>([^<]+)<\/span>/g);
+        const spanMatches = content.match(
+          /<span[^>]*className="[^"]*material-symbols-rounded[^"]*"[^>]*>([^<]+)<\/span>/g,
+        );
         if (spanMatches) {
-          spanMatches.forEach(match => {
+          spanMatches.forEach((match) => {
             const iconMatch = match.match(/>([^<]+)<\/span>/);
             if (iconMatch && iconMatch[1].trim()) {
               const iconName = iconMatch[1].trim();
               usedIcons.add(iconName);
-              debug(`  Found (legacy): ${iconName} in ${path.relative(srcDir, filePath)}`);
+              debug(
+                `  Found (legacy): ${iconName} in ${path.relative(srcDir, filePath)}`,
+              );
             }
           });
         }
 
         // Match Icon component usage: <Icon icon="material-symbols:icon-name" ...>
-        const iconMatches = content.match(/<Icon\s+[^>]*icon="material-symbols:([^"]+)"/g);
+        const iconMatches = content.match(
+          /<Icon\s+[^>]*icon="material-symbols:([^"]+)"/g,
+        );
         if (iconMatches) {
-          iconMatches.forEach(match => {
+          iconMatches.forEach((match) => {
             const iconMatch = match.match(/icon="material-symbols:([^"]+)"/);
             if (iconMatch) {
               usedIcons.add(iconMatch[1]);
-              debug(`  Found (Icon): ${iconMatch[1]} in ${path.relative(srcDir, filePath)}`);
+              debug(
+                `  Found (Icon): ${iconMatch[1]} in ${path.relative(srcDir, filePath)}`,
+              );
             }
           });
         }
 
         // Match icon config usage: icon: 'icon-name' or icon: "icon-name"
-        const iconPropertyMatches = content.match(/icon:\s*(['"])([a-z0-9-]+)\1/g);
+        const iconPropertyMatches = content.match(
+          /icon:\s*(['"])([a-z0-9-]+)\1/g,
+        );
         if (iconPropertyMatches) {
-          iconPropertyMatches.forEach(match => {
+          iconPropertyMatches.forEach((match) => {
             const iconMatch = match.match(/icon:\s*(['"])([a-z0-9-]+)\1/);
             if (iconMatch) {
               usedIcons.add(iconMatch[2]);
-              debug(`  Found (config): ${iconMatch[2]} in ${path.relative(srcDir, filePath)}`);
+              debug(
+                `  Found (config): ${iconMatch[2]} in ${path.relative(srcDir, filePath)}`,
+              );
             }
           });
         }
@@ -118,18 +139,26 @@ async function main() {
   const usedIcons = scanForUsedIcons();
 
   // Check if we need to regenerate (compare with existing)
-  const outputPath = path.join(__dirname, '..', 'src', 'assets', 'material-symbols-icons.json');
+  const outputPath = path.join(
+    __dirname,
+    "..",
+    "src",
+    "assets",
+    "material-symbols-icons.json",
+  );
   let needsRegeneration = true;
 
   if (fs.existsSync(outputPath)) {
     try {
-      const existingSet = JSON.parse(fs.readFileSync(outputPath, 'utf8'));
+      const existingSet = JSON.parse(fs.readFileSync(outputPath, "utf8"));
       const existingIcons = Object.keys(existingSet.icons || {}).sort();
       const currentIcons = [...usedIcons].sort();
 
       if (JSON.stringify(existingIcons) === JSON.stringify(currentIcons)) {
         needsRegeneration = false;
-        info(`✅ Icon set already up-to-date (${usedIcons.length} icons, ${Math.round(fs.statSync(outputPath).size / 1024)}KB)`);
+        info(
+          `✅ Icon set already up-to-date (${usedIcons.length} icons, ${Math.round(fs.statSync(outputPath).size / 1024)}KB)`,
+        );
       }
     } catch {
       // If we can't parse existing file, regenerate
@@ -138,34 +167,40 @@ async function main() {
   }
 
   if (!needsRegeneration) {
-    info('🎉 No regeneration needed!');
+    info("🎉 No regeneration needed!");
     process.exit(0);
   }
 
   info(`� Extracting ${usedIcons.length} icons from Material Symbols...`);
 
   // Dynamic import of ES module
-  const { getIcons } = await import('@iconify/utils');
+  const { getIcons } = await import("@iconify/utils");
 
   // Extract only our used icons from the full set
   const extractedIcons = getIcons(icons, usedIcons);
 
   if (!extractedIcons) {
-    console.error('� Failed to extract icons');
+    console.error("� Failed to extract icons");
     process.exit(1);
   }
 
   // Check for missing icons
   const extractedIconNames = Object.keys(extractedIcons.icons || {});
-  const missingIcons = usedIcons.filter(icon => !extractedIconNames.includes(icon));
+  const missingIcons = usedIcons.filter(
+    (icon) => !extractedIconNames.includes(icon),
+  );
 
   if (missingIcons.length > 0) {
-    info(`⚠�  Missing icons (${missingIcons.length}): ${missingIcons.join(', ')}`);
-    info('💡 These icons don\'t exist in Material Symbols. Please use available alternatives.');
+    info(
+      `⚠�  Missing icons (${missingIcons.length}): ${missingIcons.join(", ")}`,
+    );
+    info(
+      "💡 These icons don't exist in Material Symbols. Please use available alternatives.",
+    );
   }
 
   // Create output directory
-  const outputDir = path.join(__dirname, '..', 'src', 'assets');
+  const outputDir = path.join(__dirname, "..", "src", "assets");
   if (!fs.existsSync(outputDir)) {
     fs.mkdirSync(outputDir, { recursive: true });
   }
@@ -173,8 +208,12 @@ async function main() {
   // Write the extracted icon set to a file (outputPath already defined above)
   fs.writeFileSync(outputPath, JSON.stringify(extractedIcons, null, 2));
 
-  info(`✅ Successfully extracted ${Object.keys(extractedIcons.icons || {}).length} icons`);
-  info(`📦 Bundle size: ${Math.round(JSON.stringify(extractedIcons).length / 1024)}KB`);
+  info(
+    `✅ Successfully extracted ${Object.keys(extractedIcons.icons || {}).length} icons`,
+  );
+  info(
+    `📦 Bundle size: ${Math.round(JSON.stringify(extractedIcons).length / 1024)}KB`,
+  );
   info(`💾 Saved to: ${outputPath}`);
 
   // Generate TypeScript types
@@ -182,7 +221,7 @@ async function main() {
 // This file is automatically generated by scripts/generate-icons.js
 // Do not edit manually - changes will be overwritten
 
-export type MaterialSymbolIcon = ${usedIcons.map(icon => `'${icon}'`).join(' | ')};
+export type MaterialSymbolIcon = ${usedIcons.map((icon) => `'${icon}'`).join(" | ")};
 
 export interface IconSet {
   prefix: string;
@@ -196,7 +235,7 @@ declare const iconSet: IconSet;
 export default iconSet;
 `;
 
-  const typesPath = path.join(outputDir, 'material-symbols-icons.d.ts');
+  const typesPath = path.join(outputDir, "material-symbols-icons.d.ts");
   fs.writeFileSync(typesPath, typesContent);
 
   info(`� Generated types: ${typesPath}`);
@@ -204,7 +243,7 @@ export default iconSet;
 }
 
 // Run the main function
-main().catch(error => {
-  console.error('� Script failed:', error);
+main().catch((error) => {
+  console.error("� Script failed:", error);
   process.exit(1);
 });
diff --git a/frontend/scripts/generate-licenses.js b/frontend/scripts/generate-licenses.js
index e4b40c0e42..bfeb848550 100644
--- a/frontend/scripts/generate-licenses.js
+++ b/frontend/scripts/generate-licenses.js
@@ -1,11 +1,16 @@
 #!/usr/bin/env node
 
-const { execSync } = require('node:child_process');
-const { existsSync, mkdirSync, writeFileSync, readFileSync } = require('node:fs');
-const path = require('node:path');
+const { execSync } = require("node:child_process");
+const {
+  existsSync,
+  mkdirSync,
+  writeFileSync,
+  readFileSync,
+} = require("node:fs");
+const path = require("node:path");
 
-const { argv } = require('node:process');
-const inputIdx = argv.indexOf('--input');
+const { argv } = require("node:process");
+const inputIdx = argv.indexOf("--input");
 const INPUT_FILE = inputIdx > -1 ? argv[inputIdx + 1] : null;
 const POSTPROCESS_ONLY = !!INPUT_FILE;
 
@@ -16,408 +21,498 @@ const POSTPROCESS_ONLY = !!INPUT_FILE;
  * This script creates a JSON file similar to the Java backend's 3rdPartyLicenses.json
  */
 
-const OUTPUT_FILE = path.join(__dirname, '..', 'src', 'assets', '3rdPartyLicenses.json');
-const PACKAGE_JSON = path.join(__dirname, '..', 'package.json');
+const OUTPUT_FILE = path.join(
+  __dirname,
+  "..",
+  "src",
+  "assets",
+  "3rdPartyLicenses.json",
+);
+const PACKAGE_JSON = path.join(__dirname, "..", "package.json");
 
 // Ensure the output directory exists
 const outputDir = path.dirname(OUTPUT_FILE);
 if (!existsSync(outputDir)) {
-    mkdirSync(outputDir, { recursive: true });
+  mkdirSync(outputDir, { recursive: true });
 }
 
-console.log('� Generating frontend license report...');
+console.log("� Generating frontend license report...");
 
 try {
-    // Safety guard: don't run this script on fork PRs (workflow setzt PR_IS_FORK)
-    if (process.env.PR_IS_FORK === 'true' && !POSTPROCESS_ONLY) {
-        console.error('Fork PR detected: only --input (postprocess-only) mode is allowed.');
-        process.exit(2);
-    }
-
-    let licenseData;
-    // Generate license report using pinned license-checker; disable lifecycle scripts
-    if (POSTPROCESS_ONLY) {
-      if (!INPUT_FILE || !existsSync(INPUT_FILE)) {
-        console.error('� --input file missing or not found');
-        process.exit(1);
-      }
-      licenseData = JSON.parse(readFileSync(INPUT_FILE, 'utf8'));
-    } else {
-      const licenseReport = execSync(
-          // 'npx --yes license-checker@25.0.1 --production --json',
-          'npx --yes license-report --only=prod --output=json',
-          {
-              encoding: 'utf8',
-              cwd: path.dirname(PACKAGE_JSON),
-              env: { ...process.env, NPM_CONFIG_IGNORE_SCRIPTS: 'true' }
-          }
-      );
-      try {
-          licenseData = JSON.parse(licenseReport);
-      } catch (parseError) {
-          console.error('� Failed to parse license data:', parseError.message);
-          console.error('Raw output:', licenseReport.substring(0, 500) + '...');
-          process.exit(1);
-      }
-    }
-
-    if (!Array.isArray(licenseData)) {
-        console.error('� Invalid license data structure');
-        process.exit(1);
-    }
-
-    // Convert license-checker format to array
-    const licenseArray = licenseData.map(dep => {
-        let licenseType = dep.licenseType;
-
-        // Handle missing or null licenses
-        if (!licenseType || licenseType === null || licenseType === undefined) {
-            licenseType = 'Unknown';
-        }
-
-        // Handle empty string licenses
-        if (licenseType === '') {
-            licenseType = 'Unknown';
-        }
-
-        // Handle array licenses (rare but possible)
-        if (Array.isArray(licenseType)) {
-            licenseType = licenseType.join(' AND ');
-        }
-
-        // Handle object licenses (fallback)
-        if (typeof licenseType === 'object' && licenseType !== null) {
-            licenseType = 'Unknown';
-        }
-
-        if ( "posthog-js" === dep.name && licenseType.startsWith("SEE LICENSE IN LICENSE")) {
-            licenseType = "SEE LICENSE IN LICENSE https://github.com/PostHog/posthog-js/blob/main/LICENSE";
-        }
-
-        return {
-            name: dep.name,
-            version: dep.installedVersion || dep.definedVersion || dep.remoteVersion || 'unknown',
-            licenseType: licenseType,
-            repository: dep.link,
-            url: dep.link,
-            link: dep.link
-        };
-    });
-
-    // Transform to match Java backend format
-    const transformedData = {
-        dependencies: licenseArray.map(dep => {
-            const licenseType = Array.isArray(dep.licenseType) ? dep.licenseType.join(', ') : (dep.licenseType || 'Unknown');
-            const licenseUrl = dep.link || getLicenseUrl(licenseType);
-
-            return {
-                moduleName: dep.name,
-                moduleUrl: dep.repository || dep.url || `https://www.npmjs.com/package/${dep.name}`,
-                moduleVersion: dep.version,
-                moduleLicense: licenseType,
-                moduleLicenseUrl: licenseUrl
-            };
-        })
-    };
-
-    // Log summary of license types found
-    const licenseSummary = licenseArray.reduce((acc, dep) => {
-        const license = Array.isArray(dep.licenseType) ? dep.licenseType.join(', ') : (dep.licenseType || 'Unknown');
-        acc[license] = (acc[license] || 0) + 1;
-        return acc;
-    }, {});
-
-    console.log('📊 License types found:');
-    Object.entries(licenseSummary).forEach(([license, count]) => {
-        console.log(`   ${license}: ${count} packages`);
-    });
-
-    // Log any complex or unusual license formats for debugging
-    const complexLicenses = licenseArray.filter(dep =>
-        dep.licenseType && (
-            dep.licenseType.includes('AND') ||
-            dep.licenseType.includes('OR') ||
-            dep.licenseType === 'Unknown' ||
-            dep.licenseType.includes('SEE LICENSE')
-        )
+  // Safety guard: don't run this script on fork PRs (workflow setzt PR_IS_FORK)
+  if (process.env.PR_IS_FORK === "true" && !POSTPROCESS_ONLY) {
+    console.error(
+      "Fork PR detected: only --input (postprocess-only) mode is allowed.",
     );
+    process.exit(2);
+  }
 
-    if (complexLicenses.length > 0) {
-        console.log('\n� Complex/Edge case licenses detected:');
-        complexLicenses.forEach(dep => {
-            console.log(`   ${dep.name}@${dep.version}: "${dep.licenseType}"`);
-        });
+  let licenseData;
+  // Generate license report using pinned license-checker; disable lifecycle scripts
+  if (POSTPROCESS_ONLY) {
+    if (!INPUT_FILE || !existsSync(INPUT_FILE)) {
+      console.error("� --input file missing or not found");
+      process.exit(1);
     }
-
-    // Check for potentially problematic licenses
-    const problematicLicenses = checkLicenseCompatibility(licenseSummary, licenseArray);
-    if (problematicLicenses.length > 0) {
-        console.log('\n⚠�  License compatibility warnings:');
-        problematicLicenses.forEach(warning => {
-            console.log(`   ${warning.message}`);
-        });
-
-        // Write license warnings to a separate file for CI/CD
-        const warningsFile = path.join(__dirname, '..', 'src', 'assets', 'license-warnings.json');
-        writeFileSync(warningsFile, JSON.stringify({
-            warnings: problematicLicenses,
-            generated: new Date().toISOString()
-        }, null, 2));
-        console.log(`⚠�  License warnings saved to: ${warningsFile}`);
-    } else {
-        console.log('\n✅ All licenses appear to be corporate-friendly');
+    licenseData = JSON.parse(readFileSync(INPUT_FILE, "utf8"));
+  } else {
+    const licenseReport = execSync(
+      // 'npx --yes license-checker@25.0.1 --production --json',
+      "npx --yes license-report --only=prod --output=json",
+      {
+        encoding: "utf8",
+        cwd: path.dirname(PACKAGE_JSON),
+        env: { ...process.env, NPM_CONFIG_IGNORE_SCRIPTS: "true" },
+      },
+    );
+    try {
+      licenseData = JSON.parse(licenseReport);
+    } catch (parseError) {
+      console.error("� Failed to parse license data:", parseError.message);
+      console.error("Raw output:", licenseReport.substring(0, 500) + "...");
+      process.exit(1);
     }
+  }
 
-    // Write to file
-    writeFileSync(OUTPUT_FILE, JSON.stringify(transformedData, null, 4));
-
-    console.log(`✅ License report generated successfully!`);
-    console.log(`📄 Found ${transformedData.dependencies.length} dependencies`);
-    console.log(`💾 Saved to: ${OUTPUT_FILE}`);
-
-} catch (error) {
-    console.error('� Error generating license report:', error.message);
+  if (!Array.isArray(licenseData)) {
+    console.error("� Invalid license data structure");
     process.exit(1);
+  }
+
+  // Convert license-checker format to array
+  const licenseArray = licenseData.map((dep) => {
+    let licenseType = dep.licenseType;
+
+    // Handle missing or null licenses
+    if (!licenseType || licenseType === null || licenseType === undefined) {
+      licenseType = "Unknown";
+    }
+
+    // Handle empty string licenses
+    if (licenseType === "") {
+      licenseType = "Unknown";
+    }
+
+    // Handle array licenses (rare but possible)
+    if (Array.isArray(licenseType)) {
+      licenseType = licenseType.join(" AND ");
+    }
+
+    // Handle object licenses (fallback)
+    if (typeof licenseType === "object" && licenseType !== null) {
+      licenseType = "Unknown";
+    }
+
+    if (
+      "posthog-js" === dep.name &&
+      licenseType.startsWith("SEE LICENSE IN LICENSE")
+    ) {
+      licenseType =
+        "SEE LICENSE IN LICENSE https://github.com/PostHog/posthog-js/blob/main/LICENSE";
+    }
+
+    return {
+      name: dep.name,
+      version:
+        dep.installedVersion ||
+        dep.definedVersion ||
+        dep.remoteVersion ||
+        "unknown",
+      licenseType: licenseType,
+      repository: dep.link,
+      url: dep.link,
+      link: dep.link,
+    };
+  });
+
+  // Transform to match Java backend format
+  const transformedData = {
+    dependencies: licenseArray.map((dep) => {
+      const licenseType = Array.isArray(dep.licenseType)
+        ? dep.licenseType.join(", ")
+        : dep.licenseType || "Unknown";
+      const licenseUrl = dep.link || getLicenseUrl(licenseType);
+
+      return {
+        moduleName: dep.name,
+        moduleUrl:
+          dep.repository ||
+          dep.url ||
+          `https://www.npmjs.com/package/${dep.name}`,
+        moduleVersion: dep.version,
+        moduleLicense: licenseType,
+        moduleLicenseUrl: licenseUrl,
+      };
+    }),
+  };
+
+  // Log summary of license types found
+  const licenseSummary = licenseArray.reduce((acc, dep) => {
+    const license = Array.isArray(dep.licenseType)
+      ? dep.licenseType.join(", ")
+      : dep.licenseType || "Unknown";
+    acc[license] = (acc[license] || 0) + 1;
+    return acc;
+  }, {});
+
+  console.log("📊 License types found:");
+  Object.entries(licenseSummary).forEach(([license, count]) => {
+    console.log(`   ${license}: ${count} packages`);
+  });
+
+  // Log any complex or unusual license formats for debugging
+  const complexLicenses = licenseArray.filter(
+    (dep) =>
+      dep.licenseType &&
+      (dep.licenseType.includes("AND") ||
+        dep.licenseType.includes("OR") ||
+        dep.licenseType === "Unknown" ||
+        dep.licenseType.includes("SEE LICENSE")),
+  );
+
+  if (complexLicenses.length > 0) {
+    console.log("\n� Complex/Edge case licenses detected:");
+    complexLicenses.forEach((dep) => {
+      console.log(`   ${dep.name}@${dep.version}: "${dep.licenseType}"`);
+    });
+  }
+
+  // Check for potentially problematic licenses
+  const problematicLicenses = checkLicenseCompatibility(
+    licenseSummary,
+    licenseArray,
+  );
+  if (problematicLicenses.length > 0) {
+    console.log("\n⚠�  License compatibility warnings:");
+    problematicLicenses.forEach((warning) => {
+      console.log(`   ${warning.message}`);
+    });
+
+    // Write license warnings to a separate file for CI/CD
+    const warningsFile = path.join(
+      __dirname,
+      "..",
+      "src",
+      "assets",
+      "license-warnings.json",
+    );
+    writeFileSync(
+      warningsFile,
+      JSON.stringify(
+        {
+          warnings: problematicLicenses,
+          generated: new Date().toISOString(),
+        },
+        null,
+        2,
+      ),
+    );
+    console.log(`⚠�  License warnings saved to: ${warningsFile}`);
+  } else {
+    console.log("\n✅ All licenses appear to be corporate-friendly");
+  }
+
+  // Write to file
+  writeFileSync(OUTPUT_FILE, JSON.stringify(transformedData, null, 2) + "\n");
+
+  console.log(`✅ License report generated successfully!`);
+  console.log(`📄 Found ${transformedData.dependencies.length} dependencies`);
+  console.log(`💾 Saved to: ${OUTPUT_FILE}`);
+} catch (error) {
+  console.error("� Error generating license report:", error.message);
+  process.exit(1);
 }
 
 /**
  * Get standard license URLs for common licenses
  */
 function getLicenseUrl(licenseType) {
-    if (!licenseType || licenseType === 'Unknown') return '';
+  if (!licenseType || licenseType === "Unknown") return "";
 
-    const licenseUrls = {
-        'MIT': 'https://opensource.org/licenses/MIT',
-        'MIT*': 'https://opensource.org/licenses/MIT',
-        'Apache-2.0': 'https://www.apache.org/licenses/LICENSE-2.0',
-        'Apache License 2.0': 'https://www.apache.org/licenses/LICENSE-2.0',
-        'BSD-3-Clause': 'https://opensource.org/licenses/BSD-3-Clause',
-        'BSD-2-Clause': 'https://opensource.org/licenses/BSD-2-Clause',
-        'BSD': 'https://opensource.org/licenses/BSD-3-Clause',
-        'GPL-3.0': 'https://www.gnu.org/licenses/gpl-3.0.html',
-        'GPL-2.0': 'https://www.gnu.org/licenses/gpl-2.0.html',
-        'LGPL-2.1': 'https://www.gnu.org/licenses/old-licenses/lgpl-2.1.html',
-        'LGPL-3.0': 'https://www.gnu.org/licenses/lgpl-3.0.html',
-        'ISC': 'https://opensource.org/licenses/ISC',
-        'CC0-1.0': 'https://creativecommons.org/publicdomain/zero/1.0/',
-        'Unlicense': 'https://unlicense.org/',
-        'MPL-2.0': 'https://www.mozilla.org/en-US/MPL/2.0/',
-        'WTFPL': 'http://www.wtfpl.net/',
-        'Zlib': 'https://opensource.org/licenses/Zlib',
-        'Artistic-2.0': 'https://opensource.org/licenses/Artistic-2.0',
-        'EPL-1.0': 'https://www.eclipse.org/legal/epl-v10.html',
-        'EPL-2.0': 'https://www.eclipse.org/legal/epl-2.0/',
-        'CDDL-1.0': 'https://opensource.org/licenses/CDDL-1.0',
-        'Ruby': 'https://www.ruby-lang.org/en/about/license.txt',
-        'Python-2.0': 'https://www.python.org/download/releases/2.0/license/',
-        'Public Domain': 'https://creativecommons.org/publicdomain/zero/1.0/',
-        'UNLICENSED': ''
-    };
+  const licenseUrls = {
+    MIT: "https://opensource.org/licenses/MIT",
+    "MIT*": "https://opensource.org/licenses/MIT",
+    "Apache-2.0": "https://www.apache.org/licenses/LICENSE-2.0",
+    "Apache License 2.0": "https://www.apache.org/licenses/LICENSE-2.0",
+    "BSD-3-Clause": "https://opensource.org/licenses/BSD-3-Clause",
+    "BSD-2-Clause": "https://opensource.org/licenses/BSD-2-Clause",
+    BSD: "https://opensource.org/licenses/BSD-3-Clause",
+    "GPL-3.0": "https://www.gnu.org/licenses/gpl-3.0.html",
+    "GPL-2.0": "https://www.gnu.org/licenses/gpl-2.0.html",
+    "LGPL-2.1": "https://www.gnu.org/licenses/old-licenses/lgpl-2.1.html",
+    "LGPL-3.0": "https://www.gnu.org/licenses/lgpl-3.0.html",
+    ISC: "https://opensource.org/licenses/ISC",
+    "CC0-1.0": "https://creativecommons.org/publicdomain/zero/1.0/",
+    Unlicense: "https://unlicense.org/",
+    "MPL-2.0": "https://www.mozilla.org/en-US/MPL/2.0/",
+    WTFPL: "http://www.wtfpl.net/",
+    Zlib: "https://opensource.org/licenses/Zlib",
+    "Artistic-2.0": "https://opensource.org/licenses/Artistic-2.0",
+    "EPL-1.0": "https://www.eclipse.org/legal/epl-v10.html",
+    "EPL-2.0": "https://www.eclipse.org/legal/epl-2.0/",
+    "CDDL-1.0": "https://opensource.org/licenses/CDDL-1.0",
+    Ruby: "https://www.ruby-lang.org/en/about/license.txt",
+    "Python-2.0": "https://www.python.org/download/releases/2.0/license/",
+    "Public Domain": "https://creativecommons.org/publicdomain/zero/1.0/",
+    UNLICENSED: "",
+  };
 
-    // Try exact match first
-    if (licenseUrls[licenseType]) {
-        return licenseUrls[licenseType];
+  // Try exact match first
+  if (licenseUrls[licenseType]) {
+    return licenseUrls[licenseType];
+  }
+
+  // Try case-insensitive match
+  const lowerType = licenseType.toLowerCase();
+  for (const [key, url] of Object.entries(licenseUrls)) {
+    if (key.toLowerCase() === lowerType) {
+      return url;
     }
+  }
 
-    // Try case-insensitive match
-    const lowerType = licenseType.toLowerCase();
-    for (const [key, url] of Object.entries(licenseUrls)) {
-        if (key.toLowerCase() === lowerType) {
-            return url;
-        }
+  // Handle complex SPDX expressions like "(MIT AND Zlib)" or "(MIT OR CC0-1.0)"
+  if (licenseType.includes("AND") || licenseType.includes("OR")) {
+    // Extract the first license from compound expressions for URL
+    const match = licenseType.match(/\(?\s*([A-Za-z0-9\-.]+)/);
+    if (match && licenseUrls[match[1]]) {
+      return licenseUrls[match[1]];
     }
+  }
 
-    // Handle complex SPDX expressions like "(MIT AND Zlib)" or "(MIT OR CC0-1.0)"
-    if (licenseType.includes('AND') || licenseType.includes('OR')) {
-        // Extract the first license from compound expressions for URL
-        const match = licenseType.match(/\(?\s*([A-Za-z0-9\-.]+)/);
-        if (match && licenseUrls[match[1]]) {
-            return licenseUrls[match[1]];
-        }
-    }
-
-    // For non-standard licenses, return empty string (will use package link if available)
-    return '';
+  // For non-standard licenses, return empty string (will use package link if available)
+  return "";
 }
 
 /**
  * Check for potentially problematic licenses that may not be MIT/corporate compatible
  */
 function checkLicenseCompatibility(licenseSummary, licenseArray) {
-    const warnings = [];
+  const warnings = [];
 
-    // Define problematic license patterns
-    const problematicLicenses = {
-        // Copyleft licenses
-        'GPL-2.0': 'Strong copyleft license - requires derivative works to be GPL',
-        'GPL-3.0': 'Strong copyleft license - requires derivative works to be GPL',
-        'LGPL-2.1': 'Weak copyleft license - may require source disclosure for modifications',
-        'LGPL-3.0': 'Weak copyleft license - may require source disclosure for modifications',
-        'AGPL-3.0': 'Network copyleft license - requires source disclosure for network use',
-        'AGPL-1.0': 'Network copyleft license - requires source disclosure for network use',
+  // Define problematic license patterns
+  const problematicLicenses = {
+    // Copyleft licenses
+    "GPL-2.0": "Strong copyleft license - requires derivative works to be GPL",
+    "GPL-3.0": "Strong copyleft license - requires derivative works to be GPL",
+    "LGPL-2.1":
+      "Weak copyleft license - may require source disclosure for modifications",
+    "LGPL-3.0":
+      "Weak copyleft license - may require source disclosure for modifications",
+    "AGPL-3.0":
+      "Network copyleft license - requires source disclosure for network use",
+    "AGPL-1.0":
+      "Network copyleft license - requires source disclosure for network use",
 
-        // Other potentially problematic licenses
-        'WTFPL': 'Potentially problematic license - legal uncertainty',
-        'CC-BY-SA-4.0': 'ShareAlike license - requires derivative works to use same license',
-        'CC-BY-SA-3.0': 'ShareAlike license - requires derivative works to use same license',
-        'CC-BY-NC-4.0': 'Non-commercial license - prohibits commercial use',
-        'CC-BY-NC-3.0': 'Non-commercial license - prohibits commercial use',
-        'OSL-3.0': 'Copyleft license - requires derivative works to be OSL',
-        'EPL-1.0': 'Weak copyleft license - may require source disclosure',
-        'EPL-2.0': 'Weak copyleft license - may require source disclosure',
-        'CDDL-1.0': 'Weak copyleft license - may require source disclosure',
-        'CDDL-1.1': 'Weak copyleft license - may require source disclosure',
-        'CPL-1.0': 'Weak copyleft license - may require source disclosure',
-        'MPL-1.1': 'Weak copyleft license - may require source disclosure',
-        'EUPL-1.1': 'Copyleft license - requires derivative works to be EUPL',
-        'EUPL-1.2': 'Copyleft license - requires derivative works to be EUPL',
-        'UNLICENSED': 'No license specified - usage rights unclear',
-        'Unknown': 'License not detected - manual review required'
-    };
+    // Other potentially problematic licenses
+    WTFPL: "Potentially problematic license - legal uncertainty",
+    "CC-BY-SA-4.0":
+      "ShareAlike license - requires derivative works to use same license",
+    "CC-BY-SA-3.0":
+      "ShareAlike license - requires derivative works to use same license",
+    "CC-BY-NC-4.0": "Non-commercial license - prohibits commercial use",
+    "CC-BY-NC-3.0": "Non-commercial license - prohibits commercial use",
+    "OSL-3.0": "Copyleft license - requires derivative works to be OSL",
+    "EPL-1.0": "Weak copyleft license - may require source disclosure",
+    "EPL-2.0": "Weak copyleft license - may require source disclosure",
+    "CDDL-1.0": "Weak copyleft license - may require source disclosure",
+    "CDDL-1.1": "Weak copyleft license - may require source disclosure",
+    "CPL-1.0": "Weak copyleft license - may require source disclosure",
+    "MPL-1.1": "Weak copyleft license - may require source disclosure",
+    "EUPL-1.1": "Copyleft license - requires derivative works to be EUPL",
+    "EUPL-1.2": "Copyleft license - requires derivative works to be EUPL",
+    UNLICENSED: "No license specified - usage rights unclear",
+    Unknown: "License not detected - manual review required",
+  };
 
-    // Known good licenses (no warnings needed)
-    const goodLicenses = new Set([
-        'MIT', 'MIT*', 'Apache-2.0', 'Apache License 2.0', 'BSD-2-Clause', 'BSD-3-Clause', 'BSD',
-        'ISC', 'CC0-1.0', 'Public Domain', 'Unlicense', '0BSD', 'BlueOak-1.0.0',
-        'Zlib', 'Artistic-2.0', 'Python-2.0', 'Ruby', 'MPL-2.0', 'CC-BY-4.0',
-        'SEE LICENSE IN https://raw.githubusercontent.com/Stirling-Tools/Stirling-PDF/refs/heads/main/proprietary/LICENSE',
-        'SEE LICENSE IN LICENSE https://github.com/PostHog/posthog-js/blob/main/LICENSE'
-    ]);
+  // Known good licenses (no warnings needed)
+  const goodLicenses = new Set([
+    "MIT",
+    "MIT*",
+    "Apache-2.0",
+    "Apache License 2.0",
+    "BSD-2-Clause",
+    "BSD-3-Clause",
+    "BSD",
+    "ISC",
+    "CC0-1.0",
+    "Public Domain",
+    "Unlicense",
+    "0BSD",
+    "BlueOak-1.0.0",
+    "Zlib",
+    "Artistic-2.0",
+    "Python-2.0",
+    "Ruby",
+    "MPL-2.0",
+    "CC-BY-4.0",
+    "SEE LICENSE IN https://raw.githubusercontent.com/Stirling-Tools/Stirling-PDF/refs/heads/main/proprietary/LICENSE",
+    "SEE LICENSE IN LICENSE https://github.com/PostHog/posthog-js/blob/main/LICENSE",
+  ]);
 
-    // Helper function to normalize license names for comparison
-    function normalizeLicense(license) {
-        return license
-            .replace(/-or-later$/, '') // Remove -or-later suffix
-            .replace(/\+$/, '') // Remove + suffix
-            .trim();
+  // Helper function to normalize license names for comparison
+  function normalizeLicense(license) {
+    return license
+      .replace(/-or-later$/, "") // Remove -or-later suffix
+      .replace(/\+$/, "") // Remove + suffix
+      .trim();
+  }
+
+  // Check each license type
+  Object.entries(licenseSummary).forEach(([license, count]) => {
+    // Skip known good licenses
+    if (goodLicenses.has(license)) {
+      return;
     }
 
-    // Check each license type
-    Object.entries(licenseSummary).forEach(([license, count]) => {
-        // Skip known good licenses
-        if (goodLicenses.has(license)) {
-            return;
-        }
-
-        // Check if this license only affects our own packages
-        const affectedPackages = licenseArray.filter(dep => {
-            const depLicense = Array.isArray(dep.licenseType) ? dep.licenseType.join(', ') : dep.licenseType;
-            return depLicense === license;
-        });
-
-        const isOnlyOurPackages = affectedPackages.every(dep =>
-            dep.name === 'frontend' ||
-            dep.name.toLowerCase().includes('stirling-pdf') ||
-            dep.name.toLowerCase().includes('stirling_pdf') ||
-            dep.name.toLowerCase().includes('stirlingpdf')
-        );
-
-        if (isOnlyOurPackages && (license === 'UNLICENSED' || license.startsWith('SEE LICENSE IN'))) {
-            return; // Skip warnings for our own Stirling-PDF packages
-        }
-
-        // Check for compound licenses like "(MIT AND Zlib)" or "(MIT OR CC0-1.0)"
-        if (license.includes('AND') || license.includes('OR')) {
-            // For OR licenses, check if there's at least one acceptable license option
-            if (license.includes('OR')) {
-                // Extract license components from OR expression
-                const orComponents = license
-                    .replace(/[()]/g, '') // Remove parentheses
-                    .split(' OR ')
-                    .map(component => component.trim());
-
-                // Check if any component is in the goodLicenses set (with normalization)
-                const hasGoodLicense = orComponents.some(component => {
-                    const normalized = normalizeLicense(component);
-                    return goodLicenses.has(component) || goodLicenses.has(normalized);
-                });
-
-                if (hasGoodLicense) {
-                    return; // Skip warning - can use the good license option
-                }
-            }
-
-            // For AND licenses or OR licenses with no good options, check for problematic components
-            const hasProblematicComponent = Object.keys(problematicLicenses).some(problematic =>
-                license.includes(problematic)
-            );
-
-            if (hasProblematicComponent) {
-                const affectedPackages = licenseArray
-                    .filter(dep => {
-                        const depLicense = Array.isArray(dep.licenseType) ? dep.licenseType.join(', ') : dep.licenseType;
-                        return depLicense === license;
-                    })
-                    .map(dep => ({
-                        name: dep.name,
-                        version: dep.version,
-                        url: dep.repository || dep.url || `https://www.npmjs.com/package/${dep.name}`
-                    }));
-
-                const licenseType = license.includes('AND') ? 'AND' : 'OR';
-                const reason = licenseType === 'AND'
-                    ? 'Compound license with AND requirement - all components must be compatible'
-                    : 'Compound license with potentially problematic components and no good fallback options';
-
-                warnings.push({
-                    message: `📋 This PR contains ${count} package${count > 1 ? 's' : ''} with compound license "${license}" - manual review recommended`,
-                    licenseType: license,
-                    licenseUrl: '',
-                    reason: reason,
-                    packageCount: count,
-                    affectedDependencies: affectedPackages
-                });
-            }
-            return;
-        }
-
-        // Check for exact matches with problematic licenses
-        if (problematicLicenses[license]) {
-            const affectedPackages = licenseArray
-                .filter(dep => {
-                    const depLicense = Array.isArray(dep.licenseType) ? dep.licenseType.join(', ') : dep.licenseType;
-                    return depLicense === license;
-                })
-                .map(dep => ({
-                    name: dep.name,
-                    version: dep.version,
-                    url: dep.repository || dep.url || `https://www.npmjs.com/package/${dep.name}`
-                }));
-
-            const packageList = affectedPackages.map(pkg => pkg.name).slice(0, 5).join(', ') + (affectedPackages.length > 5 ? `, and ${affectedPackages.length - 5} more` : '');
-            const licenseUrl = getLicenseUrl(license) || 'https://opensource.org/licenses';
-
-            warnings.push({
-                message: `⚠�  This PR contains ${count} package${count > 1 ? 's' : ''} with license type [${license}](${licenseUrl}) - ${problematicLicenses[license]}. Affected packages: ${packageList}`,
-                licenseType: license,
-                licenseUrl: licenseUrl,
-                reason: problematicLicenses[license],
-                packageCount: count,
-                affectedDependencies: affectedPackages
-            });
-        } else {
-            // Unknown license type - flag for manual review
-            const affectedPackages = licenseArray
-                .filter(dep => {
-                    const depLicense = Array.isArray(dep.licenseType) ? dep.licenseType.join(', ') : dep.licenseType;
-                    return depLicense === license;
-                })
-                .map(dep => ({
-                    name: dep.name,
-                    version: dep.version,
-                    url: dep.repository || dep.url || `https://www.npmjs.com/package/${dep.name}`
-                }));
-
-            warnings.push({
-                message: `� This PR contains ${count} package${count > 1 ? 's' : ''} with unknown license type "${license}" - manual review required`,
-                licenseType: license,
-                licenseUrl: '',
-                reason: 'Unknown license type',
-                packageCount: count,
-                affectedDependencies: affectedPackages
-            });
-        }
+    // Check if this license only affects our own packages
+    const affectedPackages = licenseArray.filter((dep) => {
+      const depLicense = Array.isArray(dep.licenseType)
+        ? dep.licenseType.join(", ")
+        : dep.licenseType;
+      return depLicense === license;
     });
 
-    return warnings;
+    const isOnlyOurPackages = affectedPackages.every(
+      (dep) =>
+        dep.name === "frontend" ||
+        dep.name.toLowerCase().includes("stirling-pdf") ||
+        dep.name.toLowerCase().includes("stirling_pdf") ||
+        dep.name.toLowerCase().includes("stirlingpdf"),
+    );
+
+    if (
+      isOnlyOurPackages &&
+      (license === "UNLICENSED" || license.startsWith("SEE LICENSE IN"))
+    ) {
+      return; // Skip warnings for our own Stirling-PDF packages
+    }
+
+    // Check for compound licenses like "(MIT AND Zlib)" or "(MIT OR CC0-1.0)"
+    if (license.includes("AND") || license.includes("OR")) {
+      // For OR licenses, check if there's at least one acceptable license option
+      if (license.includes("OR")) {
+        // Extract license components from OR expression
+        const orComponents = license
+          .replace(/[()]/g, "") // Remove parentheses
+          .split(" OR ")
+          .map((component) => component.trim());
+
+        // Check if any component is in the goodLicenses set (with normalization)
+        const hasGoodLicense = orComponents.some((component) => {
+          const normalized = normalizeLicense(component);
+          return goodLicenses.has(component) || goodLicenses.has(normalized);
+        });
+
+        if (hasGoodLicense) {
+          return; // Skip warning - can use the good license option
+        }
+      }
+
+      // For AND licenses or OR licenses with no good options, check for problematic components
+      const hasProblematicComponent = Object.keys(problematicLicenses).some(
+        (problematic) => license.includes(problematic),
+      );
+
+      if (hasProblematicComponent) {
+        const affectedPackages = licenseArray
+          .filter((dep) => {
+            const depLicense = Array.isArray(dep.licenseType)
+              ? dep.licenseType.join(", ")
+              : dep.licenseType;
+            return depLicense === license;
+          })
+          .map((dep) => ({
+            name: dep.name,
+            version: dep.version,
+            url:
+              dep.repository ||
+              dep.url ||
+              `https://www.npmjs.com/package/${dep.name}`,
+          }));
+
+        const licenseType = license.includes("AND") ? "AND" : "OR";
+        const reason =
+          licenseType === "AND"
+            ? "Compound license with AND requirement - all components must be compatible"
+            : "Compound license with potentially problematic components and no good fallback options";
+
+        warnings.push({
+          message: `📋 This PR contains ${count} package${count > 1 ? "s" : ""} with compound license "${license}" - manual review recommended`,
+          licenseType: license,
+          licenseUrl: "",
+          reason: reason,
+          packageCount: count,
+          affectedDependencies: affectedPackages,
+        });
+      }
+      return;
+    }
+
+    // Check for exact matches with problematic licenses
+    if (problematicLicenses[license]) {
+      const affectedPackages = licenseArray
+        .filter((dep) => {
+          const depLicense = Array.isArray(dep.licenseType)
+            ? dep.licenseType.join(", ")
+            : dep.licenseType;
+          return depLicense === license;
+        })
+        .map((dep) => ({
+          name: dep.name,
+          version: dep.version,
+          url:
+            dep.repository ||
+            dep.url ||
+            `https://www.npmjs.com/package/${dep.name}`,
+        }));
+
+      const packageList =
+        affectedPackages
+          .map((pkg) => pkg.name)
+          .slice(0, 5)
+          .join(", ") +
+        (affectedPackages.length > 5
+          ? `, and ${affectedPackages.length - 5} more`
+          : "");
+      const licenseUrl =
+        getLicenseUrl(license) || "https://opensource.org/licenses";
+
+      warnings.push({
+        message: `⚠�  This PR contains ${count} package${count > 1 ? "s" : ""} with license type [${license}](${licenseUrl}) - ${problematicLicenses[license]}. Affected packages: ${packageList}`,
+        licenseType: license,
+        licenseUrl: licenseUrl,
+        reason: problematicLicenses[license],
+        packageCount: count,
+        affectedDependencies: affectedPackages,
+      });
+    } else {
+      // Unknown license type - flag for manual review
+      const affectedPackages = licenseArray
+        .filter((dep) => {
+          const depLicense = Array.isArray(dep.licenseType)
+            ? dep.licenseType.join(", ")
+            : dep.licenseType;
+          return depLicense === license;
+        })
+        .map((dep) => ({
+          name: dep.name,
+          version: dep.version,
+          url:
+            dep.repository ||
+            dep.url ||
+            `https://www.npmjs.com/package/${dep.name}`,
+        }));
+
+      warnings.push({
+        message: `� This PR contains ${count} package${count > 1 ? "s" : ""} with unknown license type "${license}" - manual review required`,
+        licenseType: license,
+        licenseUrl: "",
+        reason: "Unknown license type",
+        packageCount: count,
+        affectedDependencies: affectedPackages,
+      });
+    }
+  });
+
+  return warnings;
 }
diff --git a/frontend/scripts/sample-pdf/generate.mjs b/frontend/scripts/sample-pdf/generate.mjs
index 93e5cf7ee3..2ad477cc98 100755
--- a/frontend/scripts/sample-pdf/generate.mjs
+++ b/frontend/scripts/sample-pdf/generate.mjs
@@ -8,20 +8,20 @@
  * for users to experiment with Stirling PDF's features.
  */
 
-import puppeteer from 'puppeteer';
-import { fileURLToPath } from 'url';
-import { dirname, join } from 'path';
-import { existsSync, mkdirSync, statSync } from 'fs';
+import puppeteer from "puppeteer";
+import { fileURLToPath } from "url";
+import { dirname, join } from "path";
+import { existsSync, mkdirSync, statSync } from "fs";
 
 const __filename = fileURLToPath(import.meta.url);
 const __dirname = dirname(__filename);
 
-const TEMPLATE_PATH = join(__dirname, 'template.html');
-const OUTPUT_DIR = join(__dirname, '../../public/samples');
-const OUTPUT_PATH = join(OUTPUT_DIR, 'Sample.pdf');
+const TEMPLATE_PATH = join(__dirname, "template.html");
+const OUTPUT_DIR = join(__dirname, "../../public/samples");
+const OUTPUT_PATH = join(OUTPUT_DIR, "Sample.pdf");
 
 async function generatePDF() {
-  console.log('🚀 Starting Stirling PDF sample document generation...\n');
+  console.log("🚀 Starting Stirling PDF sample document generation...\n");
 
   // Ensure output directory exists
   if (!existsSync(OUTPUT_DIR)) {
@@ -40,66 +40,65 @@ async function generatePDF() {
   let browser;
   try {
     // Launch Puppeteer
-    console.log('� Launching browser...');
+    console.log("� Launching browser...");
     browser = await puppeteer.launch({
-      headless: 'new',
-      args: ['--no-sandbox', '--disable-setuid-sandbox']
+      headless: "new",
+      args: ["--no-sandbox", "--disable-setuid-sandbox"],
     });
 
     const page = await browser.newPage();
 
     // Set viewport to match A4 proportions
     await page.setViewport({
-      width: 794,  // A4 width in pixels at 96 DPI
+      width: 794, // A4 width in pixels at 96 DPI
       height: 1123, // A4 height in pixels at 96 DPI
-      deviceScaleFactor: 2 // Higher quality rendering
+      deviceScaleFactor: 2, // Higher quality rendering
     });
 
     // Navigate to the template file
     const fileUrl = `file://${TEMPLATE_PATH}`;
-    console.log('📖 Loading HTML template...');
+    console.log("📖 Loading HTML template...");
     await page.goto(fileUrl, {
-      waitUntil: 'networkidle0' // Wait for all resources to load
+      waitUntil: "networkidle0", // Wait for all resources to load
     });
 
     // Generate PDF with A4 dimensions
-    console.log('� Generating PDF...');
+    console.log("� Generating PDF...");
     await page.pdf({
       path: OUTPUT_PATH,
-      format: 'A4',
+      format: "A4",
       printBackground: true,
       margin: {
         top: 0,
         right: 0,
         bottom: 0,
-        left: 0
+        left: 0,
       },
-      preferCSSPageSize: true
+      preferCSSPageSize: true,
     });
 
-    console.log('\n✅ PDF generated successfully!');
+    console.log("\n✅ PDF generated successfully!");
     console.log(`📦 Output: ${OUTPUT_PATH}`);
 
     // Get file size
     const stats = statSync(OUTPUT_PATH);
     const fileSizeInKB = (stats.size / 1024).toFixed(2);
     console.log(`📊 File size: ${fileSizeInKB} KB`);
-
   } catch (error) {
-    console.error('\n� Error generating PDF:', error.message);
+    console.error("\n� Error generating PDF:", error.message);
     process.exit(1);
   } finally {
     if (browser) {
       await browser.close();
-      console.log('🔒 Browser closed.');
+      console.log("🔒 Browser closed.");
     }
   }
 
-  console.log('\n🎉 Done! Sample PDF is ready for use in Stirling PDF.\n');
+  console.log("\n🎉 Done! Sample PDF is ready for use in Stirling PDF.\n");
 }
 
 // Run the generator
-generatePDF().catch(error => {
-  console.error('Fatal error:', error);
+generatePDF().catch((error) => {
+  console.error("Fatal error:", error);
   process.exit(1);
 });
diff --git a/frontend/scripts/sample-pdf/styles.css b/frontend/scripts/sample-pdf/styles.css
index 067452833c..f4cb87ac6e 100644
--- a/frontend/scripts/sample-pdf/styles.css
+++ b/frontend/scripts/sample-pdf/styles.css
@@ -20,8 +20,9 @@
   --color-white: #ffffff;
 
   /* Font Stack */
-  --font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
-                  'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
+  --font-family:
+    -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu",
+    "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
 }
 
 * {
diff --git a/frontend/scripts/sample-pdf/template.html b/frontend/scripts/sample-pdf/template.html
index edd7f2c9f4..20733766fa 100644
--- a/frontend/scripts/sample-pdf/template.html
+++ b/frontend/scripts/sample-pdf/template.html
@@ -1,234 +1,325 @@
-<!DOCTYPE html>
+<!doctype html>
 <html lang="en">
-<head>
-  <meta charset="UTF-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1.0">
-  <title>Stirling PDF - Sample Document</title>
-  <link rel="stylesheet" href="styles.css">
-</head>
-<body>
-  <!-- Page 1: Hero / Cover Page -->
-  <div class="page page-1">
-    <div class="decorative-shapes">
-      <img src="../../public/modern-logo/StirlingPDFLogoNoTextLight.svg" class="shape shape-1" alt="">
-      <img src="../../public/modern-logo/StirlingPDFLogoNoTextDark.svg" class="shape shape-2" alt="">
-      <img src="../../public/modern-logo/StirlingPDFLogoNoTextLight.svg" class="shape shape-3" alt="">
-      <img src="../../public/modern-logo/StirlingPDFLogoNoTextDark.svg" class="shape shape-4" alt="">
-      <img src="../../public/modern-logo/StirlingPDFLogoNoTextLight.svg" class="shape shape-5" alt="">
-    </div>
-    <div class="hero-content">
-      <div class="logo-container">
-        <img src="../../public/modern-logo/StirlingPDFLogoWhiteText.svg" alt="Stirling PDF" class="hero-logo">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Stirling PDF - Sample Document</title>
+    <link rel="stylesheet" href="styles.css" />
+  </head>
+  <body>
+    <!-- Page 1: Hero / Cover Page -->
+    <div class="page page-1">
+      <div class="decorative-shapes">
+        <img
+          src="../../public/modern-logo/StirlingPDFLogoNoTextLight.svg"
+          class="shape shape-1"
+          alt=""
+        />
+        <img
+          src="../../public/modern-logo/StirlingPDFLogoNoTextDark.svg"
+          class="shape shape-2"
+          alt=""
+        />
+        <img
+          src="../../public/modern-logo/StirlingPDFLogoNoTextLight.svg"
+          class="shape shape-3"
+          alt=""
+        />
+        <img
+          src="../../public/modern-logo/StirlingPDFLogoNoTextDark.svg"
+          class="shape shape-4"
+          alt=""
+        />
+        <img
+          src="../../public/modern-logo/StirlingPDFLogoNoTextLight.svg"
+          class="shape shape-5"
+          alt=""
+        />
       </div>
-      <h1 class="hero-tagline">The Free Adobe Acrobat Alternative</h1>
-      <div class="hero-stats">
-        <div class="stat-badge">
-          <span class="stat-number">10M+</span>
-          <span class="stat-label">Downloads</span>
+      <div class="hero-content">
+        <div class="logo-container">
+          <img
+            src="../../public/modern-logo/StirlingPDFLogoWhiteText.svg"
+            alt="Stirling PDF"
+            class="hero-logo"
+          />
         </div>
-      </div>
-      <div class="hero-features">
-        <div class="feature-pill">Open Source</div>
-        <div class="feature-pill">Privacy First</div>
-        <div class="feature-pill">Self-Hosted</div>
-      </div>
-    </div>
-  </div>
-
-  <!-- Page 2: What is Stirling PDF -->
-  <div class="page page-2">
-    <div class="content-wrapper">
-      <h2 class="page-title">What is Stirling PDF?</h2>
-      <p class="intro-text">
-        Stirling PDF is a robust, web-based PDF manipulation tool.
-        It enables you to carry out various operations on PDF files, including splitting,
-        merging, converting, rearranging, adding images, rotating, compressing, and more.
-      </p>
-
-      <div class="value-props">
-        <div class="value-prop">
-          <div class="value-icon">
-            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
-              <path d="M14.7 6.3a1 1 0 0 0 0 1.4l1.6 1.6a1 1 0 0 0 1.4 0l3.77-3.77a6 6 0 0 1-7.94 7.94l-6.91 6.91a2.12 2.12 0 0 1-3-3l6.91-6.91a6 6 0 0 1 7.94-7.94l-3.76 3.76z" />
-            </svg>
+        <h1 class="hero-tagline">The Free Adobe Acrobat Alternative</h1>
+        <div class="hero-stats">
+          <div class="stat-badge">
+            <span class="stat-number">10M+</span>
+            <span class="stat-label">Downloads</span>
           </div>
-          <h3>50+ PDF Operations</h3>
-          <p>Comprehensive toolkit covering all your PDF needs. From basic operations to advanced processing.</p>
         </div>
-
-        <div class="value-prop">
-          <div class="value-icon">
-            <svg viewBox="0 0 24 24" fill="currentColor">
-              <path d="M7.4 17.25q-1.05.875-2.187.8t-1.988-.775t-1.162-1.837t.412-2.338L4.35 10q-.625-.55-.987-1.325T3 7q0-1.65 1.175-2.825T7 3t2.825 1.175T11 7T9.825 9.825T7 11q-.225 0-.45-.025t-.425-.075L4.2 14.15q-.275.45-.175.888t.425.712t.775.313t.875-.313l10.5-9.025q1.05-.875 2.2-.788t2 .788t1.15 1.838t-.425 2.337L19.65 14q.625.55.988 1.325T21 17q0 1.65-1.175 2.825T17 21t-2.825-1.175T13 17t1.175-2.825T17 13q.225 0 .438.025t.412.075l1.95-3.25q.275-.45.175-.888t-.425-.712t-.775-.312t-.875.312zM7 9q.825 0 1.413-.587T9 7t-.587-1.412T7 5t-1.412.588T5 7t.588 1.413T7 9m10 10q.825 0 1.413-.587T19 17t-.587-1.412T17 15t-1.412.588T15 17t.588 1.413T17 19m0-2" />
-            </svg>
-          </div>
-          <h3>Workflow Automation</h3>
-          <p>Chain multiple operations together and save them as reusable workflows. Perfect for recurring tasks.</p>
-        </div>
-
-        <div class="value-prop">
-          <div class="value-icon">
-            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
-              <circle cx="12" cy="12" r="10" />
-              <line x1="2" y1="12" x2="22" y2="12" />
-              <path d="M12 2a15.3 15.3 0 0 1 4 10 15.3 15.3 0 0 1-4 10 15.3 15.3 0 0 1-4-10 15.3 15.3 0 0 1 4-10z" />
-            </svg>
-          </div>
-          <h3>Multi-Language Support</h3>
-          <p>Available in over 30 languages with community-contributed translations. Accessible to users worldwide.</p>
-        </div>
-
-        <div class="value-prop">
-          <div class="value-icon">
-            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
-              <rect x="5" y="11" width="14" height="10" rx="2" />
-              <circle cx="12" cy="16" r="1" />
-              <path d="M8 11V7a4 4 0 0 1 8 0v4" />
-            </svg>
-          </div>
-          <h3>Privacy First</h3>
-          <p>Self-hosted solution means your data stays on your infrastructure. You have full control over your documents.</p>
-        </div>
-
-        <div class="value-prop">
-          <div class="value-icon">
-            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
-              <circle cx="12" cy="12" r="10" />
-              <path d="m9 12 2 2 4-4" />
-            </svg>
-          </div>
-          <h3>Open Source</h3>
-          <p>Transparent, community-driven development. Inspect the code, contribute features, and adapt as needed.</p>
-        </div>
-
-        <div class="value-prop">
-          <div class="value-icon">
-            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
-              <polyline points="16 18 22 12 16 6" />
-              <polyline points="8 6 2 12 8 18" />
-            </svg>
-          </div>
-          <h3>API Access</h3>
-          <p>RESTful API for integration with external tools and scripts. Automate PDF operations programmatically.</p>
+        <div class="hero-features">
+          <div class="feature-pill">Open Source</div>
+          <div class="feature-pill">Privacy First</div>
+          <div class="feature-pill">Self-Hosted</div>
         </div>
       </div>
     </div>
-  </div>
 
-  <!-- Page 3: Key Features -->
-  <div class="page page-3">
-    <div class="content-wrapper">
-      <h2 class="page-title">Key Features</h2>
+    <!-- Page 2: What is Stirling PDF -->
+    <div class="page page-2">
+      <div class="content-wrapper">
+        <h2 class="page-title">What is Stirling PDF?</h2>
+        <p class="intro-text">
+          Stirling PDF is a robust, web-based PDF manipulation tool. It enables
+          you to carry out various operations on PDF files, including splitting,
+          merging, converting, rearranging, adding images, rotating,
+          compressing, and more.
+        </p>
 
-      <div class="features-grid">
-        <div class="feature-card" data-category="general">
-          <div class="feature-header">
-            <div class="feature-icon-large">
-              <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
-                <path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z" />
-                <polyline points="14 2 14 8 20 8" />
-                <line x1="16" y1="13" x2="8" y2="13" />
-                <line x1="16" y1="17" x2="8" y2="17" />
-                <polyline points="10 9 9 9 8 9" />
+        <div class="value-props">
+          <div class="value-prop">
+            <div class="value-icon">
+              <svg
+                viewBox="0 0 24 24"
+                fill="none"
+                stroke="currentColor"
+                stroke-width="2"
+              >
+                <path
+                  d="M14.7 6.3a1 1 0 0 0 0 1.4l1.6 1.6a1 1 0 0 0 1.4 0l3.77-3.77a6 6 0 0 1-7.94 7.94l-6.91 6.91a2.12 2.12 0 0 1-3-3l6.91-6.91a6 6 0 0 1 7.94-7.94l-3.76 3.76z"
+                />
               </svg>
             </div>
-            <h3>Page Operations</h3>
+            <h3>50+ PDF Operations</h3>
+            <p>
+              Comprehensive toolkit covering all your PDF needs. From basic
+              operations to advanced processing.
+            </p>
           </div>
-          <ul class="feature-list">
-            <li>Merge & split PDFs</li>
-            <li>Rearrange pages</li>
-            <li>Rotate & crop</li>
-            <li>Extract pages</li>
-            <li>Multi-page layout</li>
-          </ul>
-        </div>
 
-        <div class="feature-card" data-category="security">
-          <div class="feature-header">
-            <div class="feature-icon-large">
-              <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
-                <rect x="3" y="11" width="18" height="11" rx="2" ry="2" />
-                <path d="M7 11V7a5 5 0 0 1 10 0v4" />
-              </svg>
-            </div>
-            <h3>Security & Signing</h3>
-          </div>
-          <ul class="feature-list">
-            <li>Password protection</li>
-            <li>Digital signatures</li>
-            <li>Watermarks</li>
-            <li>Permission controls</li>
-            <li>Redaction tools</li>
-          </ul>
-        </div>
-
-        <div class="feature-card" data-category="formatting">
-          <div class="feature-header">
-            <div class="feature-icon-large">
+          <div class="value-prop">
+            <div class="value-icon">
               <svg viewBox="0 0 24 24" fill="currentColor">
-                <path d="m5.825 17l1.9 1.9q.3.3.288.7t-.313.7q-.3.275-.7.288t-.7-.288l-3.6-3.6q-.15-.15-.213-.325T2.426 16t.063-.375t.212-.325l3.6-3.6q.275-.275.688-.275t.712.275q.3.3.3.713t-.3.712L5.825 15H20q.425 0 .713.288T21 16t-.288.713T20 17zm12.35-8H4q-.425 0-.712-.288T3 8t.288-.712T4 7h14.175l-1.9-1.9q-.3-.3-.287-.7t.312-.7q.3-.275.7-.288t.7.288l3.6 3.6q.15.15.213.325t.062.375t-.062.375t-.213.325l-3.6 3.6q-.275.275-.687.275T16.3 12.3q-.3-.3-.3-.712t.3-.713z" />
+                <path
+                  d="M7.4 17.25q-1.05.875-2.187.8t-1.988-.775t-1.162-1.837t.412-2.338L4.35 10q-.625-.55-.987-1.325T3 7q0-1.65 1.175-2.825T7 3t2.825 1.175T11 7T9.825 9.825T7 11q-.225 0-.45-.025t-.425-.075L4.2 14.15q-.275.45-.175.888t.425.712t.775.313t.875-.313l10.5-9.025q1.05-.875 2.2-.788t2 .788t1.15 1.838t-.425 2.337L19.65 14q.625.55.988 1.325T21 17q0 1.65-1.175 2.825T17 21t-2.825-1.175T13 17t1.175-2.825T17 13q.225 0 .438.025t.412.075l1.95-3.25q.275-.45.175-.888t-.425-.712t-.775-.312t-.875.312zM7 9q.825 0 1.413-.587T9 7t-.587-1.412T7 5t-1.412.588T5 7t.588 1.413T7 9m10 10q.825 0 1.413-.587T19 17t-.587-1.412T17 15t-1.412.588T15 17t.588 1.413T17 19m0-2"
+                />
               </svg>
             </div>
-            <h3>File Conversions</h3>
+            <h3>Workflow Automation</h3>
+            <p>
+              Chain multiple operations together and save them as reusable
+              workflows. Perfect for recurring tasks.
+            </p>
           </div>
-          <ul class="feature-list">
-            <li>PDF to/from images</li>
-            <li>Office documents</li>
-            <li>HTML to PDF</li>
-            <li>Markdown to PDF</li>
-            <li>PDF to Word/Excel</li>
-          </ul>
-        </div>
 
-        <div class="feature-card" data-category="automation">
-          <div class="feature-header">
-            <div class="feature-icon-large">
-              <svg viewBox="0 0 24 24" fill="currentColor">
-                <path d="M7.4 17.25q-1.05.875-2.187.8t-1.988-.775t-1.162-1.837t.412-2.338L4.35 10q-.625-.55-.987-1.325T3 7q0-1.65 1.175-2.825T7 3t2.825 1.175T11 7T9.825 9.825T7 11q-.225 0-.45-.025t-.425-.075L4.2 14.15q-.275.45-.175.888t.425.712t.775.313t.875-.313l10.5-9.025q1.05-.875 2.2-.788t2 .788t1.15 1.838t-.425 2.337L19.65 14q.625.55.988 1.325T21 17q0 1.65-1.175 2.825T17 21t-2.825-1.175T13 17t1.175-2.825T17 13q.225 0 .438.025t.412.075l1.95-3.25q.275-.45.175-.888t-.425-.712t-.775-.312t-.875.312zM7 9q.825 0 1.413-.587T9 7t-.587-1.412T7 5t-1.412.588T5 7t.588 1.413T7 9m10 10q.825 0 1.413-.587T19 17t-.587-1.412T17 15t-1.412.588T15 17t.588 1.413T17 19m0-2" />
+          <div class="value-prop">
+            <div class="value-icon">
+              <svg
+                viewBox="0 0 24 24"
+                fill="none"
+                stroke="currentColor"
+                stroke-width="2"
+              >
+                <circle cx="12" cy="12" r="10" />
+                <line x1="2" y1="12" x2="22" y2="12" />
+                <path
+                  d="M12 2a15.3 15.3 0 0 1 4 10 15.3 15.3 0 0 1-4 10 15.3 15.3 0 0 1-4-10 15.3 15.3 0 0 1 4-10z"
+                />
               </svg>
             </div>
-            <h3>Automation</h3>
+            <h3>Multi-Language Support</h3>
+            <p>
+              Available in over 30 languages with community-contributed
+              translations. Accessible to users worldwide.
+            </p>
           </div>
-          <ul class="feature-list">
-            <li>Multi-step workflows</li>
-            <li>Chain PDF operations</li>
-            <li>Save recurring tasks</li>
-            <li>Batch file processing</li>
-            <li>API integration</li>
-          </ul>
-        </div>
-      </div>
 
-      <div class="additional-features">
-        <div class="additional-features-header">
-          <div class="additional-features-icon">
-            <svg viewBox="0 0 24 24" fill="currentColor">
-              <path d="M6 20q-.825 0-1.4125-.5875T4 18t.5875-1.4125T6 16t1.4125.5875T8 18t-.5875 1.4125T6 20m6 0q-.825 0-1.4125-.5875T10 18t.5875-1.4125T12 16t1.4125.5875T14 18t-.5875 1.4125T12 20m6 0q-.825 0-1.4125-.5875T16 18t.5875-1.4125T18 16t1.4125.5875T20 18t-.5875 1.4125T18 20M6 14q-.825 0-1.4125-.5875T4 12t.5875-1.4125T6 10t1.4125.5875T8 12t-.5875 1.4125T6 14m6 0q-.825 0-1.4125-.5875T10 12t.5875-1.4125T12 10t1.4125.5875T14 12t-.5875 1.4125T12 14m6 0q-.825 0-1.4125-.5875T16 12t.5875-1.4125T18 10t1.4125.5875T20 12t-.5875 1.4125T18 14M6 8q-.825 0-1.4125-.5875T4 6t.5875-1.4125T6 4t1.4125.5875T8 6t-.5875 1.4125T6 8m6 0q-.825 0-1.4125-.5875T10 6t.5875-1.4125T12 4t1.4125.5875T14 6t-.5875 1.4125T12 8m6 0q-.825 0-1.4125-.5875T16 6t.5875-1.4125T18 4t1.4125.5875T20 6t-.5875 1.4125T18 8" />
-            </svg>
+          <div class="value-prop">
+            <div class="value-icon">
+              <svg
+                viewBox="0 0 24 24"
+                fill="none"
+                stroke="currentColor"
+                stroke-width="2"
+              >
+                <rect x="5" y="11" width="14" height="10" rx="2" />
+                <circle cx="12" cy="16" r="1" />
+                <path d="M8 11V7a4 4 0 0 1 8 0v4" />
+              </svg>
+            </div>
+            <h3>Privacy First</h3>
+            <p>
+              Self-hosted solution means your data stays on your infrastructure.
+              You have full control over your documents.
+            </p>
+          </div>
+
+          <div class="value-prop">
+            <div class="value-icon">
+              <svg
+                viewBox="0 0 24 24"
+                fill="none"
+                stroke="currentColor"
+                stroke-width="2"
+              >
+                <circle cx="12" cy="12" r="10" />
+                <path d="m9 12 2 2 4-4" />
+              </svg>
+            </div>
+            <h3>Open Source</h3>
+            <p>
+              Transparent, community-driven development. Inspect the code,
+              contribute features, and adapt as needed.
+            </p>
+          </div>
+
+          <div class="value-prop">
+            <div class="value-icon">
+              <svg
+                viewBox="0 0 24 24"
+                fill="none"
+                stroke="currentColor"
+                stroke-width="2"
+              >
+                <polyline points="16 18 22 12 16 6" />
+                <polyline points="8 6 2 12 8 18" />
+              </svg>
+            </div>
+            <h3>API Access</h3>
+            <p>
+              RESTful API for integration with external tools and scripts.
+              Automate PDF operations programmatically.
+            </p>
           </div>
-          <h3>Plus Many More</h3>
-        </div>
-        <div class="additional-features-grid">
-          <ul>
-            <li>OCR text recognition</li>
-            <li>Compress PDFs</li>
-            <li>Add images & stamps</li>
-            <li>Detect blank pages</li>
-            <li>Extract images</li>
-            <li>Edit metadata</li>
-          </ul>
-          <ul>
-            <li>Flatten forms</li>
-            <li>PDF/A conversion</li>
-            <li>Add page numbers</li>
-            <li>Remove pages</li>
-            <li>Repair PDFs</li>
-            <li>And 40+ more tools</li>
-          </ul>
         </div>
       </div>
     </div>
-  </div>
 
-</body>
+    <!-- Page 3: Key Features -->
+    <div class="page page-3">
+      <div class="content-wrapper">
+        <h2 class="page-title">Key Features</h2>
+
+        <div class="features-grid">
+          <div class="feature-card" data-category="general">
+            <div class="feature-header">
+              <div class="feature-icon-large">
+                <svg
+                  viewBox="0 0 24 24"
+                  fill="none"
+                  stroke="currentColor"
+                  stroke-width="2"
+                >
+                  <path
+                    d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"
+                  />
+                  <polyline points="14 2 14 8 20 8" />
+                  <line x1="16" y1="13" x2="8" y2="13" />
+                  <line x1="16" y1="17" x2="8" y2="17" />
+                  <polyline points="10 9 9 9 8 9" />
+                </svg>
+              </div>
+              <h3>Page Operations</h3>
+            </div>
+            <ul class="feature-list">
+              <li>Merge & split PDFs</li>
+              <li>Rearrange pages</li>
+              <li>Rotate & crop</li>
+              <li>Extract pages</li>
+              <li>Multi-page layout</li>
+            </ul>
+          </div>
+
+          <div class="feature-card" data-category="security">
+            <div class="feature-header">
+              <div class="feature-icon-large">
+                <svg
+                  viewBox="0 0 24 24"
+                  fill="none"
+                  stroke="currentColor"
+                  stroke-width="2"
+                >
+                  <rect x="3" y="11" width="18" height="11" rx="2" ry="2" />
+                  <path d="M7 11V7a5 5 0 0 1 10 0v4" />
+                </svg>
+              </div>
+              <h3>Security & Signing</h3>
+            </div>
+            <ul class="feature-list">
+              <li>Password protection</li>
+              <li>Digital signatures</li>
+              <li>Watermarks</li>
+              <li>Permission controls</li>
+              <li>Redaction tools</li>
+            </ul>
+          </div>
+
+          <div class="feature-card" data-category="formatting">
+            <div class="feature-header">
+              <div class="feature-icon-large">
+                <svg viewBox="0 0 24 24" fill="currentColor">
+                  <path
+                    d="m5.825 17l1.9 1.9q.3.3.288.7t-.313.7q-.3.275-.7.288t-.7-.288l-3.6-3.6q-.15-.15-.213-.325T2.426 16t.063-.375t.212-.325l3.6-3.6q.275-.275.688-.275t.712.275q.3.3.3.713t-.3.712L5.825 15H20q.425 0 .713.288T21 16t-.288.713T20 17zm12.35-8H4q-.425 0-.712-.288T3 8t.288-.712T4 7h14.175l-1.9-1.9q-.3-.3-.287-.7t.312-.7q.3-.275.7-.288t.7.288l3.6 3.6q.15.15.213.325t.062.375t-.062.375t-.213.325l-3.6 3.6q-.275.275-.687.275T16.3 12.3q-.3-.3-.3-.712t.3-.713z"
+                  />
+                </svg>
+              </div>
+              <h3>File Conversions</h3>
+            </div>
+            <ul class="feature-list">
+              <li>PDF to/from images</li>
+              <li>Office documents</li>
+              <li>HTML to PDF</li>
+              <li>Markdown to PDF</li>
+              <li>PDF to Word/Excel</li>
+            </ul>
+          </div>
+
+          <div class="feature-card" data-category="automation">
+            <div class="feature-header">
+              <div class="feature-icon-large">
+                <svg viewBox="0 0 24 24" fill="currentColor">
+                  <path
+                    d="M7.4 17.25q-1.05.875-2.187.8t-1.988-.775t-1.162-1.837t.412-2.338L4.35 10q-.625-.55-.987-1.325T3 7q0-1.65 1.175-2.825T7 3t2.825 1.175T11 7T9.825 9.825T7 11q-.225 0-.45-.025t-.425-.075L4.2 14.15q-.275.45-.175.888t.425.712t.775.313t.875-.313l10.5-9.025q1.05-.875 2.2-.788t2 .788t1.15 1.838t-.425 2.337L19.65 14q.625.55.988 1.325T21 17q0 1.65-1.175 2.825T17 21t-2.825-1.175T13 17t1.175-2.825T17 13q.225 0 .438.025t.412.075l1.95-3.25q.275-.45.175-.888t-.425-.712t-.775-.312t-.875.312zM7 9q.825 0 1.413-.587T9 7t-.587-1.412T7 5t-1.412.588T5 7t.588 1.413T7 9m10 10q.825 0 1.413-.587T19 17t-.587-1.412T17 15t-1.412.588T15 17t.588 1.413T17 19m0-2"
+                  />
+                </svg>
+              </div>
+              <h3>Automation</h3>
+            </div>
+            <ul class="feature-list">
+              <li>Multi-step workflows</li>
+              <li>Chain PDF operations</li>
+              <li>Save recurring tasks</li>
+              <li>Batch file processing</li>
+              <li>API integration</li>
+            </ul>
+          </div>
+        </div>
+
+        <div class="additional-features">
+          <div class="additional-features-header">
+            <div class="additional-features-icon">
+              <svg viewBox="0 0 24 24" fill="currentColor">
+                <path
+                  d="M6 20q-.825 0-1.4125-.5875T4 18t.5875-1.4125T6 16t1.4125.5875T8 18t-.5875 1.4125T6 20m6 0q-.825 0-1.4125-.5875T10 18t.5875-1.4125T12 16t1.4125.5875T14 18t-.5875 1.4125T12 20m6 0q-.825 0-1.4125-.5875T16 18t.5875-1.4125T18 16t1.4125.5875T20 18t-.5875 1.4125T18 20M6 14q-.825 0-1.4125-.5875T4 12t.5875-1.4125T6 10t1.4125.5875T8 12t-.5875 1.4125T6 14m6 0q-.825 0-1.4125-.5875T10 12t.5875-1.4125T12 10t1.4125.5875T14 12t-.5875 1.4125T12 14m6 0q-.825 0-1.4125-.5875T16 12t.5875-1.4125T18 10t1.4125.5875T20 12t-.5875 1.4125T18 14M6 8q-.825 0-1.4125-.5875T4 6t.5875-1.4125T6 4t1.4125.5875T8 6t-.5875 1.4125T6 8m6 0q-.825 0-1.4125-.5875T10 6t.5875-1.4125T12 4t1.4125.5875T14 6t-.5875 1.4125T12 8m6 0q-.825 0-1.4125-.5875T16 6t.5875-1.4125T18 4t1.4125.5875T20 6t-.5875 1.4125T18 8"
+                />
+              </svg>
+            </div>
+            <h3>Plus Many More</h3>
+          </div>
+          <div class="additional-features-grid">
+            <ul>
+              <li>OCR text recognition</li>
+              <li>Compress PDFs</li>
+              <li>Add images & stamps</li>
+              <li>Detect blank pages</li>
+              <li>Extract images</li>
+              <li>Edit metadata</li>
+            </ul>
+            <ul>
+              <li>Flatten forms</li>
+              <li>PDF/A conversion</li>
+              <li>Add page numbers</li>
+              <li>Remove pages</li>
+              <li>Repair PDFs</li>
+              <li>And 40+ more tools</li>
+            </ul>
+          </div>
+        </div>
+      </div>
+    </div>
+  </body>
 </html>
diff --git a/frontend/scripts/setup-env.ts b/frontend/scripts/setup-env.ts
index 00ec03df00..14c6aef82d 100644
--- a/frontend/scripts/setup-env.ts
+++ b/frontend/scripts/setup-env.ts
@@ -10,22 +10,24 @@
  *   tsx scripts/setup-env.ts --saas       # also checks .env.saas
  */
 
-import { existsSync, copyFileSync, readFileSync } from 'fs';
-import { join } from 'path';
-import { config, parse } from 'dotenv';
+import { existsSync, copyFileSync, readFileSync } from "fs";
+import { join } from "path";
+import { config, parse } from "dotenv";
 
 // npm scripts run from the directory containing package.json (frontend/)
 const root = process.cwd();
 const args = process.argv.slice(2);
-const isDesktop = args.includes('--desktop');
-const isSaas = args.includes('--saas');
+const isDesktop = args.includes("--desktop");
+const isSaas = args.includes("--saas");
 
-console.log('setup-env: see frontend/README.md#environment-variables for documentation');
+console.log(
+  "setup-env: see frontend/README.md#environment-variables for documentation",
+);
 
 function getExampleKeys(exampleFile: string): string[] {
   const examplePath = join(root, exampleFile);
   if (!existsSync(examplePath)) return [];
-  return Object.keys(parse(readFileSync(examplePath, 'utf-8')));
+  return Object.keys(parse(readFileSync(examplePath, "utf-8")));
 }
 
 function ensureEnvFile(envFile: string, exampleFile: string): boolean {
@@ -44,13 +46,15 @@ function ensureEnvFile(envFile: string, exampleFile: string): boolean {
 
   config({ path: envPath });
 
-  const missing = getExampleKeys(exampleFile).filter(k => !(k in process.env));
+  const missing = getExampleKeys(exampleFile).filter(
+    (k) => !(k in process.env),
+  );
 
   if (missing.length > 0) {
     console.error(
       `setup-env: ${envFile} is missing keys from ${exampleFile}:\n` +
-      missing.map(k => `  ${k}`).join('\n') +
-      '\n  Add them manually or delete your local file to re-copy from the example.'
+        missing.map((k) => `  ${k}`).join("\n") +
+        "\n  Add them manually or delete your local file to re-copy from the example.",
     );
     return true;
   }
@@ -59,29 +63,31 @@ function ensureEnvFile(envFile: string, exampleFile: string): boolean {
 }
 
 let failed = false;
-failed = ensureEnvFile('.env', 'config/.env.example') || failed;
+failed = ensureEnvFile(".env", "config/.env.example") || failed;
 
 if (isDesktop) {
-  failed = ensureEnvFile('.env.desktop', 'config/.env.desktop.example') || failed;
+  failed =
+    ensureEnvFile(".env.desktop", "config/.env.desktop.example") || failed;
 }
 
 if (isSaas) {
-  failed = ensureEnvFile('.env.saas', 'config/.env.saas.example') || failed;
+  failed = ensureEnvFile(".env.saas", "config/.env.saas.example") || failed;
 }
 
 // Warn about any VITE_ vars set in the environment that aren't listed in any example file.
 const allExampleKeys = new Set([
-  ...getExampleKeys('config/.env.example'),
-  ...getExampleKeys('config/.env.desktop.example'),
-  ...getExampleKeys('config/.env.saas.example'),
+  ...getExampleKeys("config/.env.example"),
+  ...getExampleKeys("config/.env.desktop.example"),
+  ...getExampleKeys("config/.env.saas.example"),
 ]);
-const unknownViteVars = Object.keys(process.env)
-  .filter(k => k.startsWith('VITE_') && !allExampleKeys.has(k));
+const unknownViteVars = Object.keys(process.env).filter(
+  (k) => k.startsWith("VITE_") && !allExampleKeys.has(k),
+);
 if (unknownViteVars.length > 0) {
   console.warn(
-    'setup-env: the following VITE_ vars are set but not listed in any example file:\n' +
-    unknownViteVars.map(k => `  ${k}`).join('\n') +
-    '\n  Add them to the appropriate config/.env.*.example file if they are required.'
+    "setup-env: the following VITE_ vars are set but not listed in any example file:\n" +
+      unknownViteVars.map((k) => `  ${k}`).join("\n") +
+      "\n  Add them to the appropriate config/.env.*.example file if they are required.",
   );
 }
 
diff --git a/frontend/src-tauri/capabilities/default.json b/frontend/src-tauri/capabilities/default.json
index 6acaac5145..9259e4543f 100644
--- a/frontend/src-tauri/capabilities/default.json
+++ b/frontend/src-tauri/capabilities/default.json
@@ -2,9 +2,7 @@
   "$schema": "../gen/schemas/desktop-schema.json",
   "identifier": "default",
   "description": "enables the default permissions",
-  "windows": [
-    "main"
-  ],
+  "windows": ["main"],
   "permissions": [
     "core:default",
     "core:window:allow-destroy",
diff --git a/frontend/src-tauri/src/commands/connection.rs b/frontend/src-tauri/src/commands/connection.rs
index 8b8c68a814..157f25ce5b 100644
--- a/frontend/src-tauri/src/commands/connection.rs
+++ b/frontend/src-tauri/src/commands/connection.rs
@@ -72,6 +72,28 @@ pub async fn set_connection_mode(
 ) -> Result<(), String> {
     log::info!("Setting connection mode: {:?}", mode);
 
+    let store = app_handle
+        .store(STORE_FILE)
+        .map_err(|e| format!("Failed to access store: {}", e))?;
+
+    // If the store is already locked, protect connection_mode, server_config, and the lock
+    // flag from being overwritten by any JS-side call.
+    // Only allow marking setup_completed and updating auth-related fields.
+    let already_locked = store
+        .get(LOCK_CONNECTION_KEY)
+        .and_then(|v| v.as_bool())
+        .unwrap_or(false);
+
+    if already_locked {
+        log::warn!("set_connection_mode called while lock_connection_mode=true — preserving connection settings, but marking setup as completed");
+        // Still allow setup_completed to be written so the onboarding doesn't repeat.
+        store.set(FIRST_LAUNCH_KEY, serde_json::json!(true));
+        store
+            .save()
+            .map_err(|e| format!("Failed to save store: {}", e))?;
+        return Ok(());
+    }
+
     // Update in-memory state
     if let Ok(mut conn_state) = state.0.lock() {
         conn_state.mode = mode.clone();
@@ -81,11 +103,6 @@ pub async fn set_connection_mode(
         }
     }
 
-    // Save to store
-    let store = app_handle
-        .store(STORE_FILE)
-        .map_err(|e| format!("Failed to access store: {}", e))?;
-
     store.set(
         CONNECTION_MODE_KEY,
         serde_json::to_value(&mode).map_err(|e| format!("Failed to serialize mode: {}", e))?,
diff --git a/frontend/src-tauri/stirling-pdf.desktop b/frontend/src-tauri/stirling-pdf.desktop
index 45db59c737..e9e26a39c1 100644
--- a/frontend/src-tauri/stirling-pdf.desktop
+++ b/frontend/src-tauri/stirling-pdf.desktop
@@ -3,7 +3,8 @@ Version=1.0
 Type=Application
 Name=Stirling-PDF
 Comment=Locally hosted web application that allows you to perform various operations on PDF files
-Exec=/usr/bin/stirling-pdf
+TryExec={{exec}}
+Exec={{exec}} %F
 Icon={{icon}}
 Terminal=false
 MimeType=application/pdf;
@@ -12,4 +13,4 @@ Actions=open-file;
 
 [Desktop Action open-file]
 Name=Open PDF File
-Exec=/usr/bin/stirling-pdf %F
\ No newline at end of file
+Exec={{exec}} %F
\ No newline at end of file
diff --git a/frontend/src-tauri/tauri.conf.json b/frontend/src-tauri/tauri.conf.json
index 44ef827c3f..117aea592e 100644
--- a/frontend/src-tauri/tauri.conf.json
+++ b/frontend/src-tauri/tauri.conf.json
@@ -1,98 +1,88 @@
 {
-    "$schema": "../node_modules/@tauri-apps/cli/config.schema.json",
-    "productName": "Stirling-PDF",
-    "version": "2.8.0",
-    "identifier": "stirling.pdf.dev",
-    "build": {
-        "frontendDist": "../dist",
-        "devUrl": "http://localhost:5173",
-        "beforeDevCommand": "npm run dev -- --mode desktop",
-        "beforeBuildCommand": "node scripts/build-provisioner.mjs && npm run build -- --mode desktop"
+  "$schema": "../node_modules/@tauri-apps/cli/config.schema.json",
+  "productName": "Stirling-PDF",
+  "version": "2.9.2",
+  "identifier": "stirling.pdf.dev",
+  "build": {
+    "frontendDist": "../dist",
+    "devUrl": "http://localhost:5173",
+    "beforeDevCommand": "npx vite --mode desktop",
+    "beforeBuildCommand": "npx vite build --mode desktop"
+  },
+  "app": {
+    "windows": [
+      {
+        "title": "Stirling-PDF",
+        "width": 1280,
+        "height": 800,
+        "resizable": true,
+        "fullscreen": false,
+        "additionalBrowserArgs": "--enable-features=CertVerifierBuiltinFeature"
+      }
+    ]
+  },
+  "bundle": {
+    "active": true,
+    "publisher": "Stirling PDF Inc.",
+    "targets": ["deb", "rpm", "appimage", "dmg", "msi"],
+    "icon": [
+      "icons/icon.png",
+      "icons/icon.icns",
+      "icons/icon.ico",
+      "icons/16x16.png",
+      "icons/32x32.png",
+      "icons/64x64.png",
+      "icons/128x128.png",
+      "icons/192x192.png"
+    ],
+    "resources": ["libs/*.jar", "runtime/jre/**/*"],
+    "fileAssociations": [
+      {
+        "ext": ["pdf"],
+        "name": "PDF Document",
+        "role": "Editor",
+        "mimeType": "application/pdf"
+      }
+    ],
+    "linux": {
+      "deb": {
+        "desktopTemplate": "stirling-pdf.desktop"
+      },
+      "rpm": {
+        "desktopTemplate": "stirling-pdf.desktop"
+      },
+      "appimage": {
+        "bundleMediaFramework": false
+      }
     },
-    "app": {
-        "windows": [
-            {
-                "title": "Stirling-PDF",
-                "width": 1280,
-                "height": 800,
-                "resizable": true,
-                "fullscreen": false,
-                "additionalBrowserArgs": "--enable-features=CertVerifierBuiltinFeature"
-            }
-        ]
+    "windows": {
+      "certificateThumbprint": null,
+      "digestAlgorithm": "sha256",
+      "timestampUrl": "http://timestamp.digicert.com",
+      "wix": {
+        "fragmentPaths": ["windows/wix/provisioning.wxs"],
+        "componentGroupRefs": ["ProvisioningComponentGroup"]
+      }
     },
-    "bundle": {
-        "active": true,
-        "publisher": "Stirling PDF Inc.",
-        "targets": [
-            "deb",
-            "rpm",
-            "dmg",
-            "msi"
-        ],
-        "icon": [
-            "icons/icon.png",
-            "icons/icon.icns",
-            "icons/icon.ico",
-            "icons/16x16.png",
-            "icons/32x32.png",
-            "icons/64x64.png",
-            "icons/128x128.png",
-            "icons/192x192.png"
-        ],
-        "resources": [
-            "libs/*.jar",
-            "runtime/jre/**/*"
-        ],
-        "fileAssociations": [
-            {
-                "ext": [
-                    "pdf"
-                ],
-                "name": "PDF Document",
-                "role": "Editor",
-                "mimeType": "application/pdf"
-            }
-        ],
-        "linux": {
-            "deb": {
-                "desktopTemplate": "stirling-pdf.desktop"
-            }
-        },
-        "windows": {
-            "certificateThumbprint": null,
-            "digestAlgorithm": "sha256",
-            "timestampUrl": "http://timestamp.digicert.com",
-            "wix": {
-                "fragmentPaths": [
-                    "windows/wix/provisioning.wxs"
-                ],
-                "componentGroupRefs": [
-                    "ProvisioningComponentGroup"
-                ]
-            }
-        },
-        "macOS": {
-            "minimumSystemVersion": "10.15",
-            "signingIdentity": null,
-            "entitlements": null,
-            "providerShortName": null,
-            "infoPlist": "Info.plist"
-        }
-    },
-    "plugins": {
-        "shell": {
-            "open": true
-        },
-        "fs": {
-            "requireLiteralLeadingDot": false
-        },
-        "deep-link": {
-            "desktop": {
-                "schemes": [
-                    "stirlingpdf"
-                ]
-            }
-        }
+    "macOS": {
+      "minimumSystemVersion": "10.15",
+      "signingIdentity": null,
+      "entitlements": null,
+      "providerShortName": null,
+      "infoPlist": "Info.plist"
     }
+  },
+  "plugins": {
+    "shell": {
+      "open": true
+    },
+    "fs": {
+      "requireLiteralLeadingDot": false
+    },
+    "deep-link": {
+      "desktop": {
+        "schemes": ["stirlingpdf"]
+      }
+    }
+  }
 }
diff --git a/frontend/src-tauri/thumbnail-handler/.gitignore b/frontend/src-tauri/thumbnail-handler/.gitignore
new file mode 100644
index 0000000000..ea8c4bf7f3
--- /dev/null
+++ b/frontend/src-tauri/thumbnail-handler/.gitignore
@@ -0,0 +1 @@
+/target
diff --git a/frontend/src-tauri/thumbnail-handler/Cargo.lock b/frontend/src-tauri/thumbnail-handler/Cargo.lock
new file mode 100644
index 0000000000..713a4fb9e8
--- /dev/null
+++ b/frontend/src-tauri/thumbnail-handler/Cargo.lock
@@ -0,0 +1,174 @@
+# This file is automatically @generated by Cargo.
+# It is not intended for manual editing.
+version = 4
+
+[[package]]
+name = "proc-macro2"
+version = "1.0.106"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "8fd00f0bb2e90d81d1044c2b32617f68fcb9fa3bb7640c23e9c748e53fb30934"
+dependencies = [
+ "unicode-ident",
+]
+
+[[package]]
+name = "quote"
+version = "1.0.45"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "41f2619966050689382d2b44f664f4bc593e129785a36d6ee376ddf37259b924"
+dependencies = [
+ "proc-macro2",
+]
+
+[[package]]
+name = "stirling-thumbnail-handler"
+version = "0.1.0"
+dependencies = [
+ "windows",
+ "windows-core",
+]
+
+[[package]]
+name = "syn"
+version = "2.0.117"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "e665b8803e7b1d2a727f4023456bbbbe74da67099c585258af0ad9c5013b9b99"
+dependencies = [
+ "proc-macro2",
+ "quote",
+ "unicode-ident",
+]
+
+[[package]]
+name = "unicode-ident"
+version = "1.0.24"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "e6e4313cd5fcd3dad5cafa179702e2b244f760991f45397d14d4ebf38247da75"
+
+[[package]]
+name = "windows"
+version = "0.58.0"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "dd04d41d93c4992d421894c18c8b43496aa748dd4c081bac0dc93eb0489272b6"
+dependencies = [
+ "windows-core",
+ "windows-targets",
+]
+
+[[package]]
+name = "windows-core"
+version = "0.58.0"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "6ba6d44ec8c2591c134257ce647b7ea6b20335bf6379a27dac5f1641fcf59f99"
+dependencies = [
+ "windows-implement",
+ "windows-interface",
+ "windows-result",
+ "windows-strings",
+ "windows-targets",
+]
+
+[[package]]
+name = "windows-implement"
+version = "0.58.0"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "2bbd5b46c938e506ecbce286b6628a02171d56153ba733b6c741fc627ec9579b"
+dependencies = [
+ "proc-macro2",
+ "quote",
+ "syn",
+]
+
+[[package]]
+name = "windows-interface"
+version = "0.58.0"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "053c4c462dc91d3b1504c6fe5a726dd15e216ba718e84a0e46a88fbe5ded3515"
+dependencies = [
+ "proc-macro2",
+ "quote",
+ "syn",
+]
+
+[[package]]
+name = "windows-result"
+version = "0.2.0"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "1d1043d8214f791817bab27572aaa8af63732e11bf84aa21a45a78d6c317ae0e"
+dependencies = [
+ "windows-targets",
+]
+
+[[package]]
+name = "windows-strings"
+version = "0.1.0"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "4cd9b125c486025df0eabcb585e62173c6c9eddcec5d117d3b6e8c30e2ee4d10"
+dependencies = [
+ "windows-result",
+ "windows-targets",
+]
+
+[[package]]
+name = "windows-targets"
+version = "0.52.6"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "9b724f72796e036ab90c1021d4780d4d3d648aca59e491e6b98e725b84e99973"
+dependencies = [
+ "windows_aarch64_gnullvm",
+ "windows_aarch64_msvc",
+ "windows_i686_gnu",
+ "windows_i686_gnullvm",
+ "windows_i686_msvc",
+ "windows_x86_64_gnu",
+ "windows_x86_64_gnullvm",
+ "windows_x86_64_msvc",
+]
+
+[[package]]
+name = "windows_aarch64_gnullvm"
+version = "0.52.6"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "32a4622180e7a0ec044bb555404c800bc9fd9ec262ec147edd5989ccd0c02cd3"
+
+[[package]]
+name = "windows_aarch64_msvc"
+version = "0.52.6"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "09ec2a7bb152e2252b53fa7803150007879548bc709c039df7627cabbd05d469"
+
+[[package]]
+name = "windows_i686_gnu"
+version = "0.52.6"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "8e9b5ad5ab802e97eb8e295ac6720e509ee4c243f69d781394014ebfe8bbfa0b"
+
+[[package]]
+name = "windows_i686_gnullvm"
+version = "0.52.6"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "0eee52d38c090b3caa76c563b86c3a4bd71ef1a819287c19d586d7334ae8ed66"
+
+[[package]]
+name = "windows_i686_msvc"
+version = "0.52.6"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "240948bc05c5e7c6dabba28bf89d89ffce3e303022809e73deaefe4f6ec56c66"
+
+[[package]]
+name = "windows_x86_64_gnu"
+version = "0.52.6"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "147a5c80aabfbf0c7d901cb5895d1de30ef2907eb21fbbab29ca94c5b08b1a78"
+
+[[package]]
+name = "windows_x86_64_gnullvm"
+version = "0.52.6"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "24d5b23dc417412679681396f2b49f3de8c1473deb516bd34410872eff51ed0d"
+
+[[package]]
+name = "windows_x86_64_msvc"
+version = "0.52.6"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "589f6da84c646204747d1270a2a5661ea66ed1cced2631d546fdfb155959f9ec"
diff --git a/frontend/src-tauri/thumbnail-handler/Cargo.toml b/frontend/src-tauri/thumbnail-handler/Cargo.toml
new file mode 100644
index 0000000000..87b40cad19
--- /dev/null
+++ b/frontend/src-tauri/thumbnail-handler/Cargo.toml
@@ -0,0 +1,26 @@
+[package]
+name = "stirling-thumbnail-handler"
+version = "0.1.0"
+edition = "2021"
+
+[lib]
+crate-type = ["cdylib"]
+
+[dependencies.windows]
+version = "0.58"
+features = [
+    "implement",
+    "Win32_Foundation",
+    "Win32_System_Com",
+    "Win32_System_Com_StructuredStorage",
+    "Win32_Graphics_Gdi",
+    "Win32_Graphics_Imaging",
+    "Win32_UI_Shell",
+    "Win32_UI_Shell_PropertiesSystem",
+    "Storage_Streams",
+    "Data_Pdf",
+    "Foundation",
+]
+
+[dependencies]
+windows-core = "0.58"
diff --git a/frontend/src-tauri/thumbnail-handler/README.md b/frontend/src-tauri/thumbnail-handler/README.md
new file mode 100644
index 0000000000..3deffaab96
--- /dev/null
+++ b/frontend/src-tauri/thumbnail-handler/README.md
@@ -0,0 +1,61 @@
+# Windows PDF Thumbnail Handler
+
+A lightweight COM DLL that provides PDF page-preview thumbnails in Windows Explorer when Stirling-PDF is the default PDF application.
+
+## Why this exists
+
+When Stirling-PDF registers as the default PDF handler, Windows associates `.pdf` files with Stirling's ProgID. Without a thumbnail handler on that ProgID, Explorer falls back to showing the application icon (the big S logo) instead of a page preview. This DLL restores thumbnail previews by implementing the Windows Shell `IThumbnailProvider` COM interface.
+
+## How it works
+
+1. **Explorer requests a thumbnail** — when a folder with PDFs is opened in Medium/Large icon view, Explorer loads the DLL via the registered COM CLSID.
+2. **Shell calls `IInitializeWithStream`** — passes the PDF file content as an `IStream`.
+3. **Shell calls `IThumbnailProvider::GetThumbnail(cx)`** — requests a bitmap of size `cx × cx`.
+4. **The DLL renders page 1** using the built-in `Windows.Data.Pdf` WinRT API (the same engine Edge uses), preserving aspect ratio.
+5. **WIC decodes the rendered PNG** into BGRA pixels, which are copied into an `HBITMAP` via `CreateDIBSection`.
+6. **Explorer displays the bitmap** as the file's thumbnail.
+
+All COM methods are wrapped in `catch_unwind` so a malformed PDF cannot crash Explorer.
+
+## Technical details
+
+| | |
+|---|---|
+| **Language** | Rust (cdylib) |
+| **DLL size** | ~156 KB |
+| **External deps** | None — uses only Windows built-in APIs |
+| **PDF renderer** | `Windows.Data.Pdf` (WinRT, Windows 10+) |
+| **Image decode** | WIC (`IWICImagingFactory`) with BGRA32 format conversion |
+| **COM CLSID** | `{2D2FBE3A-9A88-4308-A52E-7EF63CA7CF48}` |
+| **Threading model** | Apartment (STA — standard for shell extensions) |
+| **Min Windows** | Windows 10 |
+
+## Registry entries (managed by MSI)
+
+The WiX installer (`provisioning.wxs`) registers:
+
+- **CLSID** at `HKLM\SOFTWARE\Classes\CLSID\{2D2FBE3A-...}\InprocServer32` pointing to the DLL
+- **Shellex** at `HKLM\SOFTWARE\Classes\.pdf\shellex\{E357FCCD-...}` linking `.pdf` thumbnails to our CLSID
+
+Both are automatically removed on uninstall.
+
+## Building
+
+The DLL is built automatically as part of the Tauri build pipeline via `build-provisioner.mjs`:
+
+```bash
+cd frontend
+npm run tauri-build
+```
+
+To build the DLL standalone:
+
+```bash
+cd frontend/src-tauri/thumbnail-handler
+cargo build --release
+# Output: target/release/stirling_thumbnail_handler.dll
+```
+
+## Linux / macOS
+
+This DLL is Windows-only. Linux and macOS don't need it — their thumbnail systems (thumbnailers on Linux, Quick Look on macOS) are decoupled from the default app association and continue working regardless of which app is set as default.
diff --git a/frontend/src-tauri/thumbnail-handler/src/lib.rs b/frontend/src-tauri/thumbnail-handler/src/lib.rs
new file mode 100644
index 0000000000..f75b10d030
--- /dev/null
+++ b/frontend/src-tauri/thumbnail-handler/src/lib.rs
@@ -0,0 +1,383 @@
+//! Stirling-PDF Windows Thumbnail Handler
+//!
+//! A lightweight COM DLL that implements IThumbnailProvider for PDF files.
+//! Uses the built-in Windows.Data.Pdf WinRT API to render page 1 as a thumbnail.
+
+use std::cell::RefCell;
+use std::ffi::c_void;
+use std::panic::catch_unwind;
+use std::sync::atomic::{AtomicU32, Ordering};
+
+use windows::core::{implement, IUnknown, Interface, GUID, HRESULT};
+use windows::Win32::Foundation::{
+    BOOL, CLASS_E_CLASSNOTAVAILABLE, CLASS_E_NOAGGREGATION, E_FAIL, E_UNEXPECTED, S_FALSE, S_OK,
+};
+use windows::Win32::Graphics::Gdi::{
+    CreateDIBSection, BITMAPINFO, BITMAPINFOHEADER, BI_RGB, DIB_RGB_COLORS, HBITMAP,
+};
+use windows::Win32::Graphics::Imaging::{
+    CLSID_WICImagingFactory, GUID_WICPixelFormat32bppBGRA, IWICImagingFactory,
+    WICBitmapDitherTypeNone, WICBitmapPaletteTypeCustom, WICDecodeMetadataCacheOnDemand,
+};
+use windows::Win32::System::Com::{
+    CoCreateInstance, IClassFactory, IClassFactory_Impl, IStream, CLSCTX_INPROC_SERVER,
+    STATFLAG_DEFAULT, STREAM_SEEK_SET,
+};
+use windows::Win32::UI::Shell::{
+    IThumbnailProvider, IThumbnailProvider_Impl, SHCreateMemStream, WTS_ALPHATYPE,
+};
+use windows::Win32::UI::Shell::PropertiesSystem::{
+    IInitializeWithStream, IInitializeWithStream_Impl,
+};
+
+// WinRT imports for PDF rendering
+use windows::Data::Pdf::PdfDocument;
+use windows::Storage::Streams::{DataWriter, InMemoryRandomAccessStream, IRandomAccessStream};
+
+// CLSID for this thumbnail handler -- must match WiX registry entries
+const CLSID_STIRLING_THUMBNAIL: GUID = GUID::from_u128(0x2d2fbe3a_9a88_4308_a52e_7ef63ca7cf48);
+
+static DLL_REF_COUNT: AtomicU32 = AtomicU32::new(0);
+
+// Maximum PDF size we'll attempt to thumbnail (256 MB)
+const MAX_PDF_SIZE: usize = 256 * 1024 * 1024;
+
+// ---------------------------------------------------------------------------
+// ThumbnailProvider -- the COM object
+// ---------------------------------------------------------------------------
+
+#[implement(IThumbnailProvider, IInitializeWithStream)]
+struct ThumbnailProvider {
+    stream: RefCell<Option<IStream>>,
+}
+
+impl ThumbnailProvider {
+    fn new() -> Self {
+        DLL_REF_COUNT.fetch_add(1, Ordering::SeqCst);
+        Self {
+            stream: RefCell::new(None),
+        }
+    }
+}
+
+impl Drop for ThumbnailProvider {
+    fn drop(&mut self) {
+        DLL_REF_COUNT.fetch_sub(1, Ordering::SeqCst);
+    }
+}
+
+impl IInitializeWithStream_Impl for ThumbnailProvider_Impl {
+    fn Initialize(
+        &self,
+        pstream: Option<&IStream>,
+        _grfmode: u32,
+    ) -> windows::core::Result<()> {
+        let result = catch_unwind(std::panic::AssertUnwindSafe(|| {
+            *self.stream.borrow_mut() = pstream.cloned();
+        }));
+        match result {
+            Ok(()) => Ok(()),
+            Err(_) => Err(E_UNEXPECTED.into()),
+        }
+    }
+}
+
+impl IThumbnailProvider_Impl for ThumbnailProvider_Impl {
+    fn GetThumbnail(
+        &self,
+        cx: u32,
+        phbmp: *mut HBITMAP,
+        pdwalpha: *mut WTS_ALPHATYPE,
+    ) -> windows::core::Result<()> {
+        let result = catch_unwind(std::panic::AssertUnwindSafe(|| {
+            self.get_thumbnail_inner(cx, phbmp, pdwalpha)
+        }));
+
+        match result {
+            Ok(inner) => inner,
+            Err(_) => Err(E_UNEXPECTED.into()),
+        }
+    }
+}
+
+impl ThumbnailProvider_Impl {
+    fn get_thumbnail_inner(
+        &self,
+        cx: u32,
+        phbmp: *mut HBITMAP,
+        pdwalpha: *mut WTS_ALPHATYPE,
+    ) -> windows::core::Result<()> {
+        let stream = self.stream.borrow();
+        let stream = stream.as_ref().ok_or(E_FAIL)?;
+
+        // Step 1: Read the IStream into a byte buffer
+        let bytes = read_istream_to_vec(stream)?;
+        if bytes.is_empty() {
+            return Err(E_FAIL.into());
+        }
+
+        // Step 2: Load the PDF via WinRT
+        let winrt_stream = bytes_to_random_access_stream(&bytes)?;
+        let pdf_doc = PdfDocument::LoadFromStreamAsync(&winrt_stream)?.get()?;
+
+        if pdf_doc.PageCount()? == 0 {
+            return Err(E_FAIL.into());
+        }
+
+        let page = pdf_doc.GetPage(0)?;
+
+        // Step 3: Render page 1 to a PNG stream
+        let output_stream = InMemoryRandomAccessStream::new()?;
+        let render_options = windows::Data::Pdf::PdfPageRenderOptions::new()?;
+
+        // Calculate dimensions preserving aspect ratio
+        let page_size = page.Size()?;
+        let scale = cx as f64 / f64::max(page_size.Width as f64, page_size.Height as f64);
+        let render_w = (page_size.Width as f64 * scale).max(1.0) as u32;
+        let render_h = (page_size.Height as f64 * scale).max(1.0) as u32;
+
+        render_options.SetDestinationWidth(render_w)?;
+        render_options.SetDestinationHeight(render_h)?;
+
+        page.RenderWithOptionsToStreamAsync(&output_stream, &render_options)?
+            .get()?;
+
+        // Step 4: Decode the PNG using WIC -> raw BGRA pixels -> HBITMAP
+        let hbitmap = png_stream_to_hbitmap(&output_stream, render_w, render_h)?;
+
+        // Step 5: Return the HBITMAP
+        unsafe {
+            *phbmp = hbitmap;
+            // WTSAT_ARGB = 2
+            *pdwalpha = WTS_ALPHATYPE(2);
+        }
+
+        Ok(())
+    }
+}
+
+// ---------------------------------------------------------------------------
+// Helper: read IStream to Vec<u8> (with loop for short reads)
+// ---------------------------------------------------------------------------
+
+fn read_istream_to_vec(stream: &IStream) -> windows::core::Result<Vec<u8>> {
+    unsafe {
+        // Get stream size
+        let mut stat = std::mem::zeroed();
+        stream.Stat(&mut stat, STATFLAG_DEFAULT)?;
+        let size = stat.cbSize as usize;
+
+        if size == 0 {
+            return Ok(Vec::new());
+        }
+        if size > MAX_PDF_SIZE {
+            return Err(E_FAIL.into());
+        }
+
+        // Seek to beginning
+        stream.Seek(0, STREAM_SEEK_SET, None)?;
+
+        // Read all bytes, looping for short reads
+        let mut buffer = vec![0u8; size];
+        let mut total_read = 0usize;
+        while total_read < size {
+            let mut bytes_read = 0u32;
+            stream
+                .Read(
+                    buffer[total_read..].as_mut_ptr() as *mut c_void,
+                    (size - total_read) as u32,
+                    Some(&mut bytes_read),
+                )
+                .ok()?;
+            if bytes_read == 0 {
+                break;
+            }
+            total_read += bytes_read as usize;
+        }
+        buffer.truncate(total_read);
+
+        Ok(buffer)
+    }
+}
+
+// ---------------------------------------------------------------------------
+// Helper: bytes -> WinRT IRandomAccessStream
+// ---------------------------------------------------------------------------
+
+fn bytes_to_random_access_stream(bytes: &[u8]) -> windows::core::Result<IRandomAccessStream> {
+    let mem_stream = InMemoryRandomAccessStream::new()?;
+    let writer = DataWriter::CreateDataWriter(&mem_stream)?;
+    writer.WriteBytes(bytes)?;
+    writer.StoreAsync()?.get()?;
+    // Detach the writer so it doesn't close the stream
+    writer.DetachStream()?;
+
+    // Seek back to beginning
+    mem_stream.Seek(0)?;
+
+    Ok(mem_stream.cast()?)
+}
+
+// ---------------------------------------------------------------------------
+// Helper: PNG stream -> HBITMAP via WIC (with format conversion to BGRA32)
+// ---------------------------------------------------------------------------
+
+fn png_stream_to_hbitmap(
+    winrt_stream: &InMemoryRandomAccessStream,
+    width: u32,
+    height: u32,
+) -> windows::core::Result<HBITMAP> {
+    unsafe {
+        // Seek to beginning and read PNG data
+        winrt_stream.Seek(0)?;
+
+        let size = winrt_stream.Size()? as usize;
+        if size == 0 {
+            return Err(E_FAIL.into());
+        }
+
+        let reader = windows::Storage::Streams::DataReader::CreateDataReader(
+            &winrt_stream.GetInputStreamAt(0)?,
+        )?;
+        reader.LoadAsync(size as u32)?.get()?;
+        let mut png_bytes = vec![0u8; size];
+        reader.ReadBytes(&mut png_bytes)?;
+
+        // Create a COM IStream from the PNG bytes
+        let png_stream = SHCreateMemStream(Some(&png_bytes)).ok_or(E_FAIL)?;
+
+        // Create WIC factory and decode the PNG
+        let wic_factory: IWICImagingFactory =
+            CoCreateInstance(&CLSID_WICImagingFactory, None, CLSCTX_INPROC_SERVER)?;
+
+        let decoder = wic_factory.CreateDecoderFromStream(
+            &png_stream,
+            std::ptr::null(),
+            WICDecodeMetadataCacheOnDemand,
+        )?;
+
+        let frame = decoder.GetFrame(0)?;
+
+        // Convert to BGRA32 to ensure consistent pixel format
+        let converter = wic_factory.CreateFormatConverter()?;
+        converter.Initialize(
+            &frame,
+            &GUID_WICPixelFormat32bppBGRA,
+            WICBitmapDitherTypeNone,
+            None,
+            0.0,
+            WICBitmapPaletteTypeCustom,
+        )?;
+
+        // Read pixels as BGRA
+        let stride = width * 4;
+        let buf_size = (stride * height) as usize;
+        let mut pixels = vec![0u8; buf_size];
+        converter.CopyPixels(std::ptr::null(), stride, &mut pixels)?;
+
+        // Create a DIB section HBITMAP
+        let bmi = BITMAPINFO {
+            bmiHeader: BITMAPINFOHEADER {
+                biSize: std::mem::size_of::<BITMAPINFOHEADER>() as u32,
+                biWidth: width as i32,
+                biHeight: -(height as i32), // top-down
+                biPlanes: 1,
+                biBitCount: 32,
+                biCompression: BI_RGB.0,
+                biSizeImage: 0,
+                biXPelsPerMeter: 0,
+                biYPelsPerMeter: 0,
+                biClrUsed: 0,
+                biClrImportant: 0,
+            },
+            bmiColors: [std::mem::zeroed()],
+        };
+
+        let mut bits: *mut c_void = std::ptr::null_mut();
+        let hbitmap = CreateDIBSection(None, &bmi, DIB_RGB_COLORS, &mut bits, None, 0)?;
+
+        if bits.is_null() {
+            return Err(E_FAIL.into());
+        }
+
+        // Copy pixel data into the DIB section
+        std::ptr::copy_nonoverlapping(pixels.as_ptr(), bits as *mut u8, buf_size);
+
+        Ok(hbitmap)
+    }
+}
+
+// ---------------------------------------------------------------------------
+// ClassFactory
+// ---------------------------------------------------------------------------
+
+#[implement(IClassFactory)]
+struct ThumbnailProviderFactory;
+
+impl IClassFactory_Impl for ThumbnailProviderFactory_Impl {
+    fn CreateInstance(
+        &self,
+        punkouter: Option<&IUnknown>,
+        riid: *const GUID,
+        ppvobject: *mut *mut c_void,
+    ) -> windows::core::Result<()> {
+        unsafe {
+            *ppvobject = std::ptr::null_mut();
+        }
+
+        if punkouter.is_some() {
+            return Err(CLASS_E_NOAGGREGATION.into());
+        }
+
+        let provider = ThumbnailProvider::new();
+        let unknown: IUnknown = provider.into();
+
+        unsafe { unknown.query(&*riid, ppvobject).ok() }
+    }
+
+    fn LockServer(&self, flock: BOOL) -> windows::core::Result<()> {
+        if flock.as_bool() {
+            DLL_REF_COUNT.fetch_add(1, Ordering::SeqCst);
+        } else {
+            DLL_REF_COUNT.fetch_sub(1, Ordering::SeqCst);
+        }
+        Ok(())
+    }
+}
+
+// ---------------------------------------------------------------------------
+// DLL exports
+// ---------------------------------------------------------------------------
+
+#[no_mangle]
+unsafe extern "system" fn DllGetClassObject(
+    rclsid: *const GUID,
+    riid: *const GUID,
+    ppv: *mut *mut c_void,
+) -> HRESULT {
+    if ppv.is_null() {
+        return E_FAIL;
+    }
+    *ppv = std::ptr::null_mut();
+
+    if *rclsid != CLSID_STIRLING_THUMBNAIL {
+        return CLASS_E_CLASSNOTAVAILABLE;
+    }
+
+    let factory = ThumbnailProviderFactory;
+    let unknown: IUnknown = factory.into();
+
+    match unknown.query(&*riid, ppv).ok() {
+        Ok(()) => S_OK,
+        Err(e) => e.into(),
+    }
+}
+
+#[no_mangle]
+extern "system" fn DllCanUnloadNow() -> HRESULT {
+    if DLL_REF_COUNT.load(Ordering::SeqCst) == 0 {
+        S_OK
+    } else {
+        S_FALSE
+    }
+}
diff --git a/frontend/src-tauri/windows/wix/provisioning.wxs b/frontend/src-tauri/windows/wix/provisioning.wxs
index 2d908815be..7c6801a973 100644
--- a/frontend/src-tauri/windows/wix/provisioning.wxs
+++ b/frontend/src-tauri/windows/wix/provisioning.wxs
@@ -13,10 +13,34 @@
       <Component Id="ProvisionerBinaryComponent" Guid="*">
         <File Id="ProvisionerExe" Source="$(sys.SOURCEFILEDIR)stirling-provision.exe" KeyPath="yes" />
       </Component>
+      <Component Id="ThumbnailHandlerDllComponent" Guid="*">
+        <File Id="ThumbnailHandlerDll" Source="$(sys.SOURCEFILEDIR)stirling_thumbnail_handler.dll" KeyPath="yes" />
+      </Component>
+    </DirectoryRef>
+
+    <!-- PDF Thumbnail Handler COM registration -->
+    <DirectoryRef Id="TARGETDIR">
+      <Component Id="ThumbnailHandlerClsidComponent" Guid="*">
+        <RegistryKey Root="HKLM" Key="SOFTWARE\Classes\CLSID\{2D2FBE3A-9A88-4308-A52E-7EF63CA7CF48}">
+          <RegistryValue Type="string" Value="Stirling-PDF Thumbnail Handler" KeyPath="yes" />
+        </RegistryKey>
+        <RegistryKey Root="HKLM" Key="SOFTWARE\Classes\CLSID\{2D2FBE3A-9A88-4308-A52E-7EF63CA7CF48}\InprocServer32">
+          <RegistryValue Type="string" Value="[INSTALLDIR]stirling_thumbnail_handler.dll" />
+          <RegistryValue Type="string" Name="ThreadingModel" Value="Apartment" />
+        </RegistryKey>
+      </Component>
+      <Component Id="ThumbnailHandlerShellexComponent" Guid="*">
+        <RegistryKey Root="HKLM" Key="SOFTWARE\Classes\.pdf\shellex\{E357FCCD-A995-4576-B01F-234630154E96}">
+          <RegistryValue Type="string" Value="{2D2FBE3A-9A88-4308-A52E-7EF63CA7CF48}" KeyPath="yes" />
+        </RegistryKey>
+      </Component>
     </DirectoryRef>
 
     <ComponentGroup Id="ProvisioningComponentGroup">
       <ComponentRef Id="ProvisionerBinaryComponent" />
+      <ComponentRef Id="ThumbnailHandlerDllComponent" />
+      <ComponentRef Id="ThumbnailHandlerClsidComponent" />
+      <ComponentRef Id="ThumbnailHandlerShellexComponent" />
     </ComponentGroup>
 
     <CustomAction
diff --git a/frontend/src/assets/3rdPartyLicenses.json b/frontend/src/assets/3rdPartyLicenses.json
index 392249d420..baf60879b6 100644
--- a/frontend/src/assets/3rdPartyLicenses.json
+++ b/frontend/src/assets/3rdPartyLicenses.json
@@ -1,326 +1,326 @@
 {
-    "dependencies": [
-        {
-            "moduleName": "@atlaskit/pragmatic-drag-and-drop",
-            "moduleUrl": "git+https://github.com/atlassian/pragmatic-drag-and-drop.git",
-            "moduleVersion": "1.7.7",
-            "moduleLicense": "Apache-2.0",
-            "moduleLicenseUrl": "git+https://github.com/atlassian/pragmatic-drag-and-drop.git"
-        },
-        {
-            "moduleName": "@embedpdf/core",
-            "moduleUrl": "https://registry.npmjs.org/@embedpdf/core/-/core-1.3.1.tgz",
-            "moduleVersion": "1.3.0",
-            "moduleLicense": "MIT",
-            "moduleLicenseUrl": "https://registry.npmjs.org/@embedpdf/core/-/core-1.3.1.tgz"
-        },
-        {
-            "moduleName": "@embedpdf/engines",
-            "moduleUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git",
-            "moduleVersion": "1.3.0",
-            "moduleLicense": "MIT",
-            "moduleLicenseUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git"
-        },
-        {
-            "moduleName": "@embedpdf/plugin-annotation",
-            "moduleUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git",
-            "moduleVersion": "1.3.0",
-            "moduleLicense": "MIT",
-            "moduleLicenseUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git"
-        },
-        {
-            "moduleName": "@embedpdf/plugin-export",
-            "moduleUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git",
-            "moduleVersion": "1.3.0",
-            "moduleLicense": "MIT",
-            "moduleLicenseUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git"
-        },
-        {
-            "moduleName": "@embedpdf/plugin-history",
-            "moduleUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git",
-            "moduleVersion": "1.3.0",
-            "moduleLicense": "MIT",
-            "moduleLicenseUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git"
-        },
-        {
-            "moduleName": "@embedpdf/plugin-interaction-manager",
-            "moduleUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git",
-            "moduleVersion": "1.3.0",
-            "moduleLicense": "MIT",
-            "moduleLicenseUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git"
-        },
-        {
-            "moduleName": "@embedpdf/plugin-loader",
-            "moduleUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git",
-            "moduleVersion": "1.3.0",
-            "moduleLicense": "MIT",
-            "moduleLicenseUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git"
-        },
-        {
-            "moduleName": "@embedpdf/plugin-pan",
-            "moduleUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git",
-            "moduleVersion": "1.3.0",
-            "moduleLicense": "MIT",
-            "moduleLicenseUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git"
-        },
-        {
-            "moduleName": "@embedpdf/plugin-render",
-            "moduleUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git",
-            "moduleVersion": "1.3.0",
-            "moduleLicense": "MIT",
-            "moduleLicenseUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git"
-        },
-        {
-            "moduleName": "@embedpdf/plugin-rotate",
-            "moduleUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git",
-            "moduleVersion": "1.3.0",
-            "moduleLicense": "MIT",
-            "moduleLicenseUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git"
-        },
-        {
-            "moduleName": "@embedpdf/plugin-scroll",
-            "moduleUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git",
-            "moduleVersion": "1.3.0",
-            "moduleLicense": "MIT",
-            "moduleLicenseUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git"
-        },
-        {
-            "moduleName": "@embedpdf/plugin-search",
-            "moduleUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git",
-            "moduleVersion": "1.3.0",
-            "moduleLicense": "MIT",
-            "moduleLicenseUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git"
-        },
-        {
-            "moduleName": "@embedpdf/plugin-selection",
-            "moduleUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git",
-            "moduleVersion": "1.3.0",
-            "moduleLicense": "MIT",
-            "moduleLicenseUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git"
-        },
-        {
-            "moduleName": "@embedpdf/plugin-spread",
-            "moduleUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git",
-            "moduleVersion": "1.3.0",
-            "moduleLicense": "MIT",
-            "moduleLicenseUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git"
-        },
-        {
-            "moduleName": "@embedpdf/plugin-thumbnail",
-            "moduleUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git",
-            "moduleVersion": "1.3.0",
-            "moduleLicense": "MIT",
-            "moduleLicenseUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git"
-        },
-        {
-            "moduleName": "@embedpdf/plugin-tiling",
-            "moduleUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git",
-            "moduleVersion": "1.3.0",
-            "moduleLicense": "MIT",
-            "moduleLicenseUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git"
-        },
-        {
-            "moduleName": "@embedpdf/plugin-viewport",
-            "moduleUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git",
-            "moduleVersion": "1.3.0",
-            "moduleLicense": "MIT",
-            "moduleLicenseUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git"
-        },
-        {
-            "moduleName": "@embedpdf/plugin-zoom",
-            "moduleUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git",
-            "moduleVersion": "1.3.0",
-            "moduleLicense": "MIT",
-            "moduleLicenseUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git"
-        },
-        {
-            "moduleName": "@emotion/react",
-            "moduleUrl": "git+https://github.com/emotion-js/emotion.git#main",
-            "moduleVersion": "11.14.0",
-            "moduleLicense": "MIT",
-            "moduleLicenseUrl": "git+https://github.com/emotion-js/emotion.git#main"
-        },
-        {
-            "moduleName": "@emotion/styled",
-            "moduleUrl": "git+https://github.com/emotion-js/emotion.git#main",
-            "moduleVersion": "11.14.1",
-            "moduleLicense": "MIT",
-            "moduleLicenseUrl": "git+https://github.com/emotion-js/emotion.git#main"
-        },
-        {
-            "moduleName": "@iconify/react",
-            "moduleUrl": "git+https://github.com/iconify/iconify.git",
-            "moduleVersion": "6.0.2",
-            "moduleLicense": "MIT",
-            "moduleLicenseUrl": "git+https://github.com/iconify/iconify.git"
-        },
-        {
-            "moduleName": "@mantine/core",
-            "moduleUrl": "git+https://github.com/mantinedev/mantine.git",
-            "moduleVersion": "8.3.1",
-            "moduleLicense": "MIT",
-            "moduleLicenseUrl": "git+https://github.com/mantinedev/mantine.git"
-        },
-        {
-            "moduleName": "@mantine/dates",
-            "moduleUrl": "git+https://github.com/mantinedev/mantine.git",
-            "moduleVersion": "8.3.1",
-            "moduleLicense": "MIT",
-            "moduleLicenseUrl": "git+https://github.com/mantinedev/mantine.git"
-        },
-        {
-            "moduleName": "@mantine/dropzone",
-            "moduleUrl": "git+https://github.com/mantinedev/mantine.git",
-            "moduleVersion": "8.3.1",
-            "moduleLicense": "MIT",
-            "moduleLicenseUrl": "git+https://github.com/mantinedev/mantine.git"
-        },
-        {
-            "moduleName": "@mantine/hooks",
-            "moduleUrl": "git+https://github.com/mantinedev/mantine.git",
-            "moduleVersion": "8.3.1",
-            "moduleLicense": "MIT",
-            "moduleLicenseUrl": "git+https://github.com/mantinedev/mantine.git"
-        },
-        {
-            "moduleName": "@mui/icons-material",
-            "moduleUrl": "git+https://github.com/mui/material-ui.git",
-            "moduleVersion": "7.3.2",
-            "moduleLicense": "MIT",
-            "moduleLicenseUrl": "git+https://github.com/mui/material-ui.git"
-        },
-        {
-            "moduleName": "@mui/material",
-            "moduleUrl": "git+https://github.com/mui/material-ui.git",
-            "moduleVersion": "7.3.2",
-            "moduleLicense": "MIT",
-            "moduleLicenseUrl": "git+https://github.com/mui/material-ui.git"
-        },
-        {
-            "moduleName": "@tailwindcss/postcss",
-            "moduleUrl": "git+https://github.com/tailwindlabs/tailwindcss.git",
-            "moduleVersion": "4.1.13",
-            "moduleLicense": "MIT",
-            "moduleLicenseUrl": "git+https://github.com/tailwindlabs/tailwindcss.git"
-        },
-        {
-            "moduleName": "@tanstack/react-virtual",
-            "moduleUrl": "git+https://github.com/TanStack/virtual.git",
-            "moduleVersion": "3.13.12",
-            "moduleLicense": "MIT",
-            "moduleLicenseUrl": "git+https://github.com/TanStack/virtual.git"
-        },
-        {
-            "moduleName": "autoprefixer",
-            "moduleUrl": "git+https://github.com/postcss/autoprefixer.git",
-            "moduleVersion": "10.4.21",
-            "moduleLicense": "MIT",
-            "moduleLicenseUrl": "git+https://github.com/postcss/autoprefixer.git"
-        },
-        {
-            "moduleName": "axios",
-            "moduleUrl": "git+https://github.com/axios/axios.git",
-            "moduleVersion": "1.12.2",
-            "moduleLicense": "MIT",
-            "moduleLicenseUrl": "git+https://github.com/axios/axios.git"
-        },
-        {
-            "moduleName": "i18next",
-            "moduleUrl": "git+https://github.com/i18next/i18next.git",
-            "moduleVersion": "25.5.2",
-            "moduleLicense": "MIT",
-            "moduleLicenseUrl": "git+https://github.com/i18next/i18next.git"
-        },
-        {
-            "moduleName": "i18next-browser-languagedetector",
-            "moduleUrl": "git+https://github.com/i18next/i18next-browser-languageDetector.git",
-            "moduleVersion": "8.2.0",
-            "moduleLicense": "MIT",
-            "moduleLicenseUrl": "git+https://github.com/i18next/i18next-browser-languageDetector.git"
-        },
-        {
-            "moduleName": "i18next-http-backend",
-            "moduleUrl": "git+ssh://git@github.com/i18next/i18next-http-backend.git",
-            "moduleVersion": "3.0.2",
-            "moduleLicense": "MIT",
-            "moduleLicenseUrl": "git+ssh://git@github.com/i18next/i18next-http-backend.git"
-        },
-        {
-            "moduleName": "jszip",
-            "moduleUrl": "git+https://github.com/Stuk/jszip.git",
-            "moduleVersion": "3.10.1",
-            "moduleLicense": "(MIT OR GPL-3.0-or-later)",
-            "moduleLicenseUrl": "git+https://github.com/Stuk/jszip.git"
-        },
-        {
-            "moduleName": "license-report",
-            "moduleUrl": "git+https://github.com/kessler/license-report.git",
-            "moduleVersion": "6.8.0",
-            "moduleLicense": "MIT",
-            "moduleLicenseUrl": "git+https://github.com/kessler/license-report.git"
-        },
-        {
-            "moduleName": "pdf-lib",
-            "moduleUrl": "git+https://github.com/Hopding/pdf-lib.git",
-            "moduleVersion": "1.17.1",
-            "moduleLicense": "MIT",
-            "moduleLicenseUrl": "git+https://github.com/Hopding/pdf-lib.git"
-        },
-        {
-            "moduleName": "pdfjs-dist",
-            "moduleUrl": "git+https://github.com/mozilla/pdf.js.git",
-            "moduleVersion": "5.4.149",
-            "moduleLicense": "Apache-2.0",
-            "moduleLicenseUrl": "git+https://github.com/mozilla/pdf.js.git"
-        },
-        {
-            "moduleName": "posthog-js",
-            "moduleUrl": "git+https://github.com/PostHog/posthog-js.git",
-            "moduleVersion": "1.268.0",
-            "moduleLicense": "SEE LICENSE IN LICENSE https://github.com/PostHog/posthog-js/blob/main/LICENSE",
-            "moduleLicenseUrl": "git+https://github.com/PostHog/posthog-js.git"
-        },
-        {
-            "moduleName": "react",
-            "moduleUrl": "git+https://github.com/facebook/react.git",
-            "moduleVersion": "19.1.1",
-            "moduleLicense": "MIT",
-            "moduleLicenseUrl": "git+https://github.com/facebook/react.git"
-        },
-        {
-            "moduleName": "react-dom",
-            "moduleUrl": "git+https://github.com/facebook/react.git",
-            "moduleVersion": "19.1.1",
-            "moduleLicense": "MIT",
-            "moduleLicenseUrl": "git+https://github.com/facebook/react.git"
-        },
-        {
-            "moduleName": "react-i18next",
-            "moduleUrl": "git+https://github.com/i18next/react-i18next.git",
-            "moduleVersion": "15.7.3",
-            "moduleLicense": "MIT",
-            "moduleLicenseUrl": "git+https://github.com/i18next/react-i18next.git"
-        },
-        {
-            "moduleName": "react-router-dom",
-            "moduleUrl": "git+https://github.com/remix-run/react-router.git",
-            "moduleVersion": "7.9.1",
-            "moduleLicense": "MIT",
-            "moduleLicenseUrl": "git+https://github.com/remix-run/react-router.git"
-        },
-        {
-            "moduleName": "tailwindcss",
-            "moduleUrl": "git+https://github.com/tailwindlabs/tailwindcss.git",
-            "moduleVersion": "4.1.13",
-            "moduleLicense": "MIT",
-            "moduleLicenseUrl": "git+https://github.com/tailwindlabs/tailwindcss.git"
-        },
-        {
-            "moduleName": "web-vitals",
-            "moduleUrl": "git+https://github.com/GoogleChrome/web-vitals.git",
-            "moduleVersion": "5.1.0",
-            "moduleLicense": "Apache-2.0",
-            "moduleLicenseUrl": "git+https://github.com/GoogleChrome/web-vitals.git"
-        }
-    ]
-}
\ No newline at end of file
+  "dependencies": [
+    {
+      "moduleName": "@atlaskit/pragmatic-drag-and-drop",
+      "moduleUrl": "git+https://github.com/atlassian/pragmatic-drag-and-drop.git",
+      "moduleVersion": "1.7.7",
+      "moduleLicense": "Apache-2.0",
+      "moduleLicenseUrl": "git+https://github.com/atlassian/pragmatic-drag-and-drop.git"
+    },
+    {
+      "moduleName": "@embedpdf/core",
+      "moduleUrl": "https://registry.npmjs.org/@embedpdf/core/-/core-1.3.1.tgz",
+      "moduleVersion": "1.3.0",
+      "moduleLicense": "MIT",
+      "moduleLicenseUrl": "https://registry.npmjs.org/@embedpdf/core/-/core-1.3.1.tgz"
+    },
+    {
+      "moduleName": "@embedpdf/engines",
+      "moduleUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git",
+      "moduleVersion": "1.3.0",
+      "moduleLicense": "MIT",
+      "moduleLicenseUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git"
+    },
+    {
+      "moduleName": "@embedpdf/plugin-annotation",
+      "moduleUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git",
+      "moduleVersion": "1.3.0",
+      "moduleLicense": "MIT",
+      "moduleLicenseUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git"
+    },
+    {
+      "moduleName": "@embedpdf/plugin-export",
+      "moduleUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git",
+      "moduleVersion": "1.3.0",
+      "moduleLicense": "MIT",
+      "moduleLicenseUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git"
+    },
+    {
+      "moduleName": "@embedpdf/plugin-history",
+      "moduleUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git",
+      "moduleVersion": "1.3.0",
+      "moduleLicense": "MIT",
+      "moduleLicenseUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git"
+    },
+    {
+      "moduleName": "@embedpdf/plugin-interaction-manager",
+      "moduleUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git",
+      "moduleVersion": "1.3.0",
+      "moduleLicense": "MIT",
+      "moduleLicenseUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git"
+    },
+    {
+      "moduleName": "@embedpdf/plugin-loader",
+      "moduleUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git",
+      "moduleVersion": "1.3.0",
+      "moduleLicense": "MIT",
+      "moduleLicenseUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git"
+    },
+    {
+      "moduleName": "@embedpdf/plugin-pan",
+      "moduleUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git",
+      "moduleVersion": "1.3.0",
+      "moduleLicense": "MIT",
+      "moduleLicenseUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git"
+    },
+    {
+      "moduleName": "@embedpdf/plugin-render",
+      "moduleUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git",
+      "moduleVersion": "1.3.0",
+      "moduleLicense": "MIT",
+      "moduleLicenseUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git"
+    },
+    {
+      "moduleName": "@embedpdf/plugin-rotate",
+      "moduleUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git",
+      "moduleVersion": "1.3.0",
+      "moduleLicense": "MIT",
+      "moduleLicenseUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git"
+    },
+    {
+      "moduleName": "@embedpdf/plugin-scroll",
+      "moduleUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git",
+      "moduleVersion": "1.3.0",
+      "moduleLicense": "MIT",
+      "moduleLicenseUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git"
+    },
+    {
+      "moduleName": "@embedpdf/plugin-search",
+      "moduleUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git",
+      "moduleVersion": "1.3.0",
+      "moduleLicense": "MIT",
+      "moduleLicenseUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git"
+    },
+    {
+      "moduleName": "@embedpdf/plugin-selection",
+      "moduleUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git",
+      "moduleVersion": "1.3.0",
+      "moduleLicense": "MIT",
+      "moduleLicenseUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git"
+    },
+    {
+      "moduleName": "@embedpdf/plugin-spread",
+      "moduleUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git",
+      "moduleVersion": "1.3.0",
+      "moduleLicense": "MIT",
+      "moduleLicenseUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git"
+    },
+    {
+      "moduleName": "@embedpdf/plugin-thumbnail",
+      "moduleUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git",
+      "moduleVersion": "1.3.0",
+      "moduleLicense": "MIT",
+      "moduleLicenseUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git"
+    },
+    {
+      "moduleName": "@embedpdf/plugin-tiling",
+      "moduleUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git",
+      "moduleVersion": "1.3.0",
+      "moduleLicense": "MIT",
+      "moduleLicenseUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git"
+    },
+    {
+      "moduleName": "@embedpdf/plugin-viewport",
+      "moduleUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git",
+      "moduleVersion": "1.3.0",
+      "moduleLicense": "MIT",
+      "moduleLicenseUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git"
+    },
+    {
+      "moduleName": "@embedpdf/plugin-zoom",
+      "moduleUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git",
+      "moduleVersion": "1.3.0",
+      "moduleLicense": "MIT",
+      "moduleLicenseUrl": "git+https://github.com/embedpdf/embed-pdf-viewer.git"
+    },
+    {
+      "moduleName": "@emotion/react",
+      "moduleUrl": "git+https://github.com/emotion-js/emotion.git#main",
+      "moduleVersion": "11.14.0",
+      "moduleLicense": "MIT",
+      "moduleLicenseUrl": "git+https://github.com/emotion-js/emotion.git#main"
+    },
+    {
+      "moduleName": "@emotion/styled",
+      "moduleUrl": "git+https://github.com/emotion-js/emotion.git#main",
+      "moduleVersion": "11.14.1",
+      "moduleLicense": "MIT",
+      "moduleLicenseUrl": "git+https://github.com/emotion-js/emotion.git#main"
+    },
+    {
+      "moduleName": "@iconify/react",
+      "moduleUrl": "git+https://github.com/iconify/iconify.git",
+      "moduleVersion": "6.0.2",
+      "moduleLicense": "MIT",
+      "moduleLicenseUrl": "git+https://github.com/iconify/iconify.git"
+    },
+    {
+      "moduleName": "@mantine/core",
+      "moduleUrl": "git+https://github.com/mantinedev/mantine.git",
+      "moduleVersion": "8.3.1",
+      "moduleLicense": "MIT",
+      "moduleLicenseUrl": "git+https://github.com/mantinedev/mantine.git"
+    },
+    {
+      "moduleName": "@mantine/dates",
+      "moduleUrl": "git+https://github.com/mantinedev/mantine.git",
+      "moduleVersion": "8.3.1",
+      "moduleLicense": "MIT",
+      "moduleLicenseUrl": "git+https://github.com/mantinedev/mantine.git"
+    },
+    {
+      "moduleName": "@mantine/dropzone",
+      "moduleUrl": "git+https://github.com/mantinedev/mantine.git",
+      "moduleVersion": "8.3.1",
+      "moduleLicense": "MIT",
+      "moduleLicenseUrl": "git+https://github.com/mantinedev/mantine.git"
+    },
+    {
+      "moduleName": "@mantine/hooks",
+      "moduleUrl": "git+https://github.com/mantinedev/mantine.git",
+      "moduleVersion": "8.3.1",
+      "moduleLicense": "MIT",
+      "moduleLicenseUrl": "git+https://github.com/mantinedev/mantine.git"
+    },
+    {
+      "moduleName": "@mui/icons-material",
+      "moduleUrl": "git+https://github.com/mui/material-ui.git",
+      "moduleVersion": "7.3.2",
+      "moduleLicense": "MIT",
+      "moduleLicenseUrl": "git+https://github.com/mui/material-ui.git"
+    },
+    {
+      "moduleName": "@mui/material",
+      "moduleUrl": "git+https://github.com/mui/material-ui.git",
+      "moduleVersion": "7.3.2",
+      "moduleLicense": "MIT",
+      "moduleLicenseUrl": "git+https://github.com/mui/material-ui.git"
+    },
+    {
+      "moduleName": "@tailwindcss/postcss",
+      "moduleUrl": "git+https://github.com/tailwindlabs/tailwindcss.git",
+      "moduleVersion": "4.1.13",
+      "moduleLicense": "MIT",
+      "moduleLicenseUrl": "git+https://github.com/tailwindlabs/tailwindcss.git"
+    },
+    {
+      "moduleName": "@tanstack/react-virtual",
+      "moduleUrl": "git+https://github.com/TanStack/virtual.git",
+      "moduleVersion": "3.13.12",
+      "moduleLicense": "MIT",
+      "moduleLicenseUrl": "git+https://github.com/TanStack/virtual.git"
+    },
+    {
+      "moduleName": "autoprefixer",
+      "moduleUrl": "git+https://github.com/postcss/autoprefixer.git",
+      "moduleVersion": "10.4.21",
+      "moduleLicense": "MIT",
+      "moduleLicenseUrl": "git+https://github.com/postcss/autoprefixer.git"
+    },
+    {
+      "moduleName": "axios",
+      "moduleUrl": "git+https://github.com/axios/axios.git",
+      "moduleVersion": "1.12.2",
+      "moduleLicense": "MIT",
+      "moduleLicenseUrl": "git+https://github.com/axios/axios.git"
+    },
+    {
+      "moduleName": "i18next",
+      "moduleUrl": "git+https://github.com/i18next/i18next.git",
+      "moduleVersion": "25.5.2",
+      "moduleLicense": "MIT",
+      "moduleLicenseUrl": "git+https://github.com/i18next/i18next.git"
+    },
+    {
+      "moduleName": "i18next-browser-languagedetector",
+      "moduleUrl": "git+https://github.com/i18next/i18next-browser-languageDetector.git",
+      "moduleVersion": "8.2.0",
+      "moduleLicense": "MIT",
+      "moduleLicenseUrl": "git+https://github.com/i18next/i18next-browser-languageDetector.git"
+    },
+    {
+      "moduleName": "i18next-http-backend",
+      "moduleUrl": "git+ssh://git@github.com/i18next/i18next-http-backend.git",
+      "moduleVersion": "3.0.2",
+      "moduleLicense": "MIT",
+      "moduleLicenseUrl": "git+ssh://git@github.com/i18next/i18next-http-backend.git"
+    },
+    {
+      "moduleName": "jszip",
+      "moduleUrl": "git+https://github.com/Stuk/jszip.git",
+      "moduleVersion": "3.10.1",
+      "moduleLicense": "(MIT OR GPL-3.0-or-later)",
+      "moduleLicenseUrl": "git+https://github.com/Stuk/jszip.git"
+    },
+    {
+      "moduleName": "license-report",
+      "moduleUrl": "git+https://github.com/kessler/license-report.git",
+      "moduleVersion": "6.8.0",
+      "moduleLicense": "MIT",
+      "moduleLicenseUrl": "git+https://github.com/kessler/license-report.git"
+    },
+    {
+      "moduleName": "pdf-lib",
+      "moduleUrl": "git+https://github.com/Hopding/pdf-lib.git",
+      "moduleVersion": "1.17.1",
+      "moduleLicense": "MIT",
+      "moduleLicenseUrl": "git+https://github.com/Hopding/pdf-lib.git"
+    },
+    {
+      "moduleName": "pdfjs-dist",
+      "moduleUrl": "git+https://github.com/mozilla/pdf.js.git",
+      "moduleVersion": "5.4.149",
+      "moduleLicense": "Apache-2.0",
+      "moduleLicenseUrl": "git+https://github.com/mozilla/pdf.js.git"
+    },
+    {
+      "moduleName": "posthog-js",
+      "moduleUrl": "git+https://github.com/PostHog/posthog-js.git",
+      "moduleVersion": "1.268.0",
+      "moduleLicense": "SEE LICENSE IN LICENSE https://github.com/PostHog/posthog-js/blob/main/LICENSE",
+      "moduleLicenseUrl": "git+https://github.com/PostHog/posthog-js.git"
+    },
+    {
+      "moduleName": "react",
+      "moduleUrl": "git+https://github.com/facebook/react.git",
+      "moduleVersion": "19.1.1",
+      "moduleLicense": "MIT",
+      "moduleLicenseUrl": "git+https://github.com/facebook/react.git"
+    },
+    {
+      "moduleName": "react-dom",
+      "moduleUrl": "git+https://github.com/facebook/react.git",
+      "moduleVersion": "19.1.1",
+      "moduleLicense": "MIT",
+      "moduleLicenseUrl": "git+https://github.com/facebook/react.git"
+    },
+    {
+      "moduleName": "react-i18next",
+      "moduleUrl": "git+https://github.com/i18next/react-i18next.git",
+      "moduleVersion": "15.7.3",
+      "moduleLicense": "MIT",
+      "moduleLicenseUrl": "git+https://github.com/i18next/react-i18next.git"
+    },
+    {
+      "moduleName": "react-router-dom",
+      "moduleUrl": "git+https://github.com/remix-run/react-router.git",
+      "moduleVersion": "7.9.1",
+      "moduleLicense": "MIT",
+      "moduleLicenseUrl": "git+https://github.com/remix-run/react-router.git"
+    },
+    {
+      "moduleName": "tailwindcss",
+      "moduleUrl": "git+https://github.com/tailwindlabs/tailwindcss.git",
+      "moduleVersion": "4.1.13",
+      "moduleLicense": "MIT",
+      "moduleLicenseUrl": "git+https://github.com/tailwindlabs/tailwindcss.git"
+    },
+    {
+      "moduleName": "web-vitals",
+      "moduleUrl": "git+https://github.com/GoogleChrome/web-vitals.git",
+      "moduleVersion": "5.1.0",
+      "moduleLicense": "Apache-2.0",
+      "moduleLicenseUrl": "git+https://github.com/GoogleChrome/web-vitals.git"
+    }
+  ]
+}
diff --git a/frontend/src/core/App.tsx b/frontend/src/core/App.tsx
index f53031c4ba..c417ef1f65 100644
--- a/frontend/src/core/App.tsx
+++ b/frontend/src/core/App.tsx
@@ -21,9 +21,7 @@ import "@app/utils/fileIdSafety";
 function MobileScannerProviders({ children }: { children: React.ReactNode }) {
   return (
     <PreferencesProvider>
-      <RainbowThemeProvider>
-        {children}
-      </RainbowThemeProvider>
+      <RainbowThemeProvider>{children}</RainbowThemeProvider>
     </PreferencesProvider>
   );
 }
diff --git a/frontend/src/core/components/AppLayout.tsx b/frontend/src/core/components/AppLayout.tsx
index 39de5dc650..ca26374345 100644
--- a/frontend/src/core/components/AppLayout.tsx
+++ b/frontend/src/core/components/AppLayout.tsx
@@ -1,5 +1,6 @@
-import { ReactNode } from 'react';
-import { useBanner } from '@app/contexts/BannerContext';
+import { ReactNode } from "react";
+import { useBanner } from "@app/contexts/BannerContext";
+import NavigationWarningModal from "@app/components/shared/NavigationWarningModal";
 
 interface AppLayoutProps {
   children: ReactNode;
@@ -20,12 +21,13 @@ export function AppLayout({ children }: AppLayoutProps) {
           height: 100% !important;
         }
       `}</style>
-      <div style={{ height: '100vh', display: 'flex', flexDirection: 'column' }}>
+      <div
+        style={{ height: "100vh", display: "flex", flexDirection: "column" }}
+      >
         {banner}
-        <div style={{ flex: 1, minHeight: 0, height: 0 }}>
-          {children}
-        </div>
+        <div style={{ flex: 1, minHeight: 0, height: 0 }}>{children}</div>
       </div>
+      <NavigationWarningModal />
     </>
   );
 }
diff --git a/frontend/src/core/components/AppProviders.tsx b/frontend/src/core/components/AppProviders.tsx
index 75c7d281c3..c32b00c401 100644
--- a/frontend/src/core/components/AppProviders.tsx
+++ b/frontend/src/core/components/AppProviders.tsx
@@ -7,8 +7,16 @@ import { FilesModalProvider } from "@app/contexts/FilesModalContext";
 import { ToolWorkflowProvider } from "@app/contexts/ToolWorkflowContext";
 import { HotkeyProvider } from "@app/contexts/HotkeyContext";
 import { SidebarProvider } from "@app/contexts/SidebarContext";
-import { PreferencesProvider, usePreferences } from "@app/contexts/PreferencesContext";
-import { AppConfigProvider, AppConfigProviderProps, AppConfigRetryOptions, useAppConfig } from "@app/contexts/AppConfigContext";
+import {
+  PreferencesProvider,
+  usePreferences,
+} from "@app/contexts/PreferencesContext";
+import {
+  AppConfigProvider,
+  AppConfigProviderProps,
+  AppConfigRetryOptions,
+  useAppConfig,
+} from "@app/contexts/AppConfigContext";
 import { RightRailProvider } from "@app/contexts/RightRailContext";
 import { ViewerProvider } from "@app/contexts/ViewerContext";
 import { SignatureProvider } from "@app/contexts/SignatureContext";
@@ -20,8 +28,8 @@ import { BannerProvider } from "@app/contexts/BannerContext";
 import ErrorBoundary from "@app/components/shared/ErrorBoundary";
 import { useScarfTracking } from "@app/hooks/useScarfTracking";
 import { useAppInitialization } from "@app/hooks/useAppInitialization";
-import { useLogoAssets } from '@app/hooks/useLogoAssets';
-import AppConfigLoader from '@app/components/shared/AppConfigLoader';
+import { useLogoAssets } from "@app/hooks/useLogoAssets";
+import AppConfigLoader from "@app/components/shared/AppConfigLoader";
 import { RedactionProvider } from "@app/contexts/RedactionContext";
 import { FormFillProvider } from "@app/tools/formFill/FormFillContext";
 
@@ -41,14 +49,14 @@ function BrandingAssetManager() {
   const { favicon, logo192, manifestHref } = useLogoAssets();
 
   useEffect(() => {
-    if (typeof document === 'undefined') {
+    if (typeof document === "undefined") {
       return;
     }
 
     const setLinkHref = (selector: string, href: string) => {
       const link = document.querySelector<HTMLLinkElement>(selector);
-      if (link && link.getAttribute('href') !== href) {
-        link.setAttribute('href', href);
+      if (link && link.getAttribute("href") !== href) {
+        link.setAttribute("href", href);
       }
     };
 
@@ -62,7 +70,10 @@ function BrandingAssetManager() {
 }
 
 // Avoid requirement to have props which are required in app providers anyway
-type AppConfigProviderOverrides = Omit<AppConfigProviderProps, 'children' | 'retryOptions'>;
+type AppConfigProviderOverrides = Omit<
+  AppConfigProviderProps,
+  "children" | "retryOptions"
+>;
 
 export interface AppProvidersProps {
   children: ReactNode;
@@ -79,7 +90,8 @@ function ServerDefaultsSync() {
     if (config) {
       const serverDefaults = {
         hideUnavailableTools: config.defaultHideUnavailableTools ?? false,
-        hideUnavailableConversions: config.defaultHideUnavailableConversions ?? false,
+        hideUnavailableConversions:
+          config.defaultHideUnavailableConversions ?? false,
       };
       updateServerDefaults(serverDefaults);
     }
@@ -92,33 +104,40 @@ function ServerDefaultsSync() {
  * Core application providers
  * Contains all providers needed for the core
  */
-export function AppProviders({ children, appConfigRetryOptions, appConfigProviderProps }: AppProvidersProps) {
+export function AppProviders({
+  children,
+  appConfigRetryOptions,
+  appConfigProviderProps,
+}: AppProvidersProps) {
   return (
     <PreferencesProvider>
       <RainbowThemeProvider>
         <ErrorBoundary>
           <BannerProvider>
-              <AppConfigProvider
-                retryOptions={appConfigRetryOptions}
-                {...appConfigProviderProps}
+            <AppConfigProvider
+              retryOptions={appConfigRetryOptions}
+              {...appConfigProviderProps}
+            >
+              <ScarfTrackingInitializer />
+              <AppConfigLoader />
+              <ServerDefaultsSync />
+              <FileContextProvider
+                enableUrlSync={true}
+                enablePersistence={true}
               >
-                <ScarfTrackingInitializer />
-                <AppConfigLoader />
-                <ServerDefaultsSync />
-                <FileContextProvider enableUrlSync={true} enablePersistence={true}>
-                  <AppInitializer />
-                  <BrandingAssetManager />
-                  <ToolRegistryProvider>
-                      <NavigationProvider>
-                        <FilesModalProvider>
-                          <ToolWorkflowProvider>
-                            <HotkeyProvider>
-                              <SidebarProvider>
-                                <ViewerProvider>
-                                  <PageEditorProvider>
-                                    <SignatureProvider>
-                                      <RedactionProvider>
-                                      <FormFillProvider>
+                <AppInitializer />
+                <BrandingAssetManager />
+                <ToolRegistryProvider>
+                  <NavigationProvider>
+                    <FilesModalProvider>
+                      <ToolWorkflowProvider>
+                        <HotkeyProvider>
+                          <SidebarProvider>
+                            <ViewerProvider>
+                              <PageEditorProvider>
+                                <SignatureProvider>
+                                  <RedactionProvider>
+                                    <FormFillProvider>
                                       <AnnotationProvider>
                                         <RightRailProvider>
                                           <TourOrchestrationProvider>
@@ -128,19 +147,19 @@ export function AppProviders({ children, appConfigRetryOptions, appConfigProvide
                                           </TourOrchestrationProvider>
                                         </RightRailProvider>
                                       </AnnotationProvider>
-                                      </FormFillProvider>
-                                      </RedactionProvider>
-                                    </SignatureProvider>
-                                  </PageEditorProvider>
-                                </ViewerProvider>
-                              </SidebarProvider>
-                            </HotkeyProvider>
-                          </ToolWorkflowProvider>
-                        </FilesModalProvider>
-                      </NavigationProvider>
-                    </ToolRegistryProvider>
-                  </FileContextProvider>
-              </AppConfigProvider>
+                                    </FormFillProvider>
+                                  </RedactionProvider>
+                                </SignatureProvider>
+                              </PageEditorProvider>
+                            </ViewerProvider>
+                          </SidebarProvider>
+                        </HotkeyProvider>
+                      </ToolWorkflowProvider>
+                    </FilesModalProvider>
+                  </NavigationProvider>
+                </ToolRegistryProvider>
+              </FileContextProvider>
+            </AppConfigProvider>
           </BannerProvider>
         </ErrorBoundary>
       </RainbowThemeProvider>
diff --git a/frontend/src/core/components/FileManager.tsx b/frontend/src/core/components/FileManager.tsx
index e3c9a84661..0b56ddbb6c 100644
--- a/frontend/src/core/components/FileManager.tsx
+++ b/frontend/src/core/components/FileManager.tsx
@@ -1,26 +1,34 @@
-import React, { useState, useCallback, useEffect, useMemo } from 'react';
-import { Modal } from '@mantine/core';
-import { Dropzone } from '@mantine/dropzone';
-import { StirlingFileStub } from '@app/types/fileContext';
-import { useFileManager } from '@app/hooks/useFileManager';
-import { useFilesModalContext } from '@app/contexts/FilesModalContext';
-import { useAppConfig } from '@app/contexts/AppConfigContext';
-import { Tool } from '@app/types/tool';
-import MobileLayout from '@app/components/fileManager/MobileLayout';
-import DesktopLayout from '@app/components/fileManager/DesktopLayout';
-import DragOverlay from '@app/components/fileManager/DragOverlay';
-import { FileManagerProvider } from '@app/contexts/FileManagerContext';
-import { Z_INDEX_FILE_MANAGER_MODAL } from '@app/styles/zIndex';
-import { isGoogleDriveConfigured, extractGoogleDriveBackendConfig } from '@app/services/googleDrivePickerService';
-import { loadScript } from '@app/utils/scriptLoader';
-import { useAllFiles } from '@app/contexts/FileContext';
+import React, { useState, useCallback, useEffect, useMemo } from "react";
+import { Modal } from "@mantine/core";
+import { Dropzone } from "@mantine/dropzone";
+import { StirlingFileStub } from "@app/types/fileContext";
+import { useFileManager } from "@app/hooks/useFileManager";
+import { useFilesModalContext } from "@app/contexts/FilesModalContext";
+import { useAppConfig } from "@app/contexts/AppConfigContext";
+import { Tool } from "@app/types/tool";
+import MobileLayout from "@app/components/fileManager/MobileLayout";
+import DesktopLayout from "@app/components/fileManager/DesktopLayout";
+import DragOverlay from "@app/components/fileManager/DragOverlay";
+import { FileManagerProvider } from "@app/contexts/FileManagerContext";
+import { Z_INDEX_FILE_MANAGER_MODAL } from "@app/styles/zIndex";
+import {
+  isGoogleDriveConfigured,
+  extractGoogleDriveBackendConfig,
+} from "@app/services/googleDrivePickerService";
+import { loadScript } from "@app/utils/scriptLoader";
+import { useAllFiles } from "@app/contexts/FileContext";
 
 interface FileManagerProps {
   selectedTool?: Tool | null;
 }
 
 const FileManager: React.FC<FileManagerProps> = ({ selectedTool }) => {
-  const { isFilesModalOpen, closeFilesModal, onFileUpload, onRecentFileSelect } = useFilesModalContext();
+  const {
+    isFilesModalOpen,
+    closeFilesModal,
+    onFileUpload,
+    onRecentFileSelect,
+  } = useFilesModalContext();
   const { config } = useAppConfig();
   const [recentFiles, setRecentFiles] = useState<StirlingFileStub[]>([]);
   const [isDragging, setIsDragging] = useState(false);
@@ -32,47 +40,59 @@ const FileManager: React.FC<FileManagerProps> = ({ selectedTool }) => {
   const { fileIds: activeFileIds } = useAllFiles();
 
   // File management handlers
-  const isFileSupported = useCallback((fileName: string) => {
-    if (!selectedTool?.supportedFormats) return true;
-    const extension = fileName.split('.').pop()?.toLowerCase();
-    return selectedTool.supportedFormats.includes(extension || '');
-  }, [selectedTool?.supportedFormats]);
+  const isFileSupported = useCallback(
+    (fileName: string) => {
+      if (!selectedTool?.supportedFormats) return true;
+      const extension = fileName.split(".").pop()?.toLowerCase();
+      return selectedTool.supportedFormats.includes(extension || "");
+    },
+    [selectedTool?.supportedFormats],
+  );
 
   const refreshRecentFiles = useCallback(async () => {
     const files = await loadRecentFiles();
     setRecentFiles(files);
   }, [loadRecentFiles]);
 
-  const handleRecentFilesSelected = useCallback(async (files: StirlingFileStub[]) => {
-    try {
-      // Use StirlingFileStubs directly - preserves all metadata!
-      onRecentFileSelect(files);
-    } catch (error) {
-      console.error('Failed to process selected files:', error);
-    }
-  }, [onRecentFileSelect]);
-
-  const handleNewFileUpload = useCallback(async (files: File[]) => {
-    if (files.length > 0) {
+  const handleRecentFilesSelected = useCallback(
+    async (files: StirlingFileStub[]) => {
       try {
-        // Files will get IDs assigned through onFilesSelect -> FileContext addFiles
-        onFileUpload(files);
-        await refreshRecentFiles();
+        // Use StirlingFileStubs directly - preserves all metadata!
+        onRecentFileSelect(files);
       } catch (error) {
-        console.error('Failed to process dropped files:', error);
+        console.error("Failed to process selected files:", error);
       }
-    }
-  }, [onFileUpload, refreshRecentFiles]);
+    },
+    [onRecentFileSelect],
+  );
 
-  const handleRemoveFileByIndex = useCallback(async (index: number) => {
-    await handleRemoveFile(index, recentFiles, setRecentFiles);
-  }, [handleRemoveFile, recentFiles]);
+  const handleNewFileUpload = useCallback(
+    async (files: File[]) => {
+      if (files.length > 0) {
+        try {
+          // Files will get IDs assigned through onFilesSelect -> FileContext addFiles
+          onFileUpload(files);
+          await refreshRecentFiles();
+        } catch (error) {
+          console.error("Failed to process dropped files:", error);
+        }
+      }
+    },
+    [onFileUpload, refreshRecentFiles],
+  );
+
+  const handleRemoveFileByIndex = useCallback(
+    async (index: number) => {
+      await handleRemoveFile(index, recentFiles, setRecentFiles);
+    },
+    [handleRemoveFile, recentFiles],
+  );
 
   useEffect(() => {
     const checkMobile = () => setIsMobile(window.innerWidth < 1030);
     checkMobile();
-    window.addEventListener('resize', checkMobile);
-    return () => window.removeEventListener('resize', checkMobile);
+    window.addEventListener("resize", checkMobile);
+    return () => window.removeEventListener("resize", checkMobile);
   }, []);
 
   useEffect(() => {
@@ -89,7 +109,9 @@ const FileManager: React.FC<FileManagerProps> = ({ selectedTool }) => {
     return () => {
       // StoredFileMetadata doesn't have blob URLs, so no cleanup needed
       // Blob URLs are managed by FileContext and tool operations
-      console.log('FileManager unmounting - FileContext handles blob URL cleanup');
+      console.log(
+        "FileManager unmounting - FileContext handles blob URL cleanup",
+      );
     };
   }, []);
 
@@ -97,7 +119,12 @@ const FileManager: React.FC<FileManagerProps> = ({ selectedTool }) => {
   // Use useMemo to only track Google Drive config changes, not all config updates
   const googleDriveBackendConfig = useMemo(
     () => extractGoogleDriveBackendConfig(config),
-    [config?.googleDriveEnabled, config?.googleDriveClientId, config?.googleDriveApiKey, config?.googleDriveAppId]
+    [
+      config?.googleDriveEnabled,
+      config?.googleDriveClientId,
+      config?.googleDriveApiKey,
+      config?.googleDriveAppId,
+    ],
   );
 
   useEffect(() => {
@@ -105,29 +132,29 @@ const FileManager: React.FC<FileManagerProps> = ({ selectedTool }) => {
       // Load scripts in parallel without blocking
       Promise.all([
         loadScript({
-          src: 'https://apis.google.com/js/api.js',
-          id: 'gapi-script',
+          src: "https://apis.google.com/js/api.js",
+          id: "gapi-script",
           async: true,
           defer: true,
         }),
         loadScript({
-          src: 'https://accounts.google.com/gsi/client',
-          id: 'gis-script',
+          src: "https://accounts.google.com/gsi/client",
+          id: "gis-script",
           async: true,
           defer: true,
         }),
       ]).catch((error) => {
-        console.warn('Failed to preload Google Drive scripts:', error);
+        console.warn("Failed to preload Google Drive scripts:", error);
       });
     }
   }, [googleDriveBackendConfig]);
 
   // Modal size constants for consistent scaling
-  const modalHeight = '80vh';
-  const modalWidth = isMobile ? '100%' : '80vw';
-  const modalMaxWidth = isMobile ? '100%' : '1200px';
-  const modalMaxHeight = '1200px';
-  const modalMinWidth = isMobile ? '320px' : '800px';
+  const modalHeight = "80vh";
+  const modalWidth = isMobile ? "100%" : "80vw";
+  const modalMaxWidth = isMobile ? "100%" : "1200px";
+  const modalMaxHeight = "1200px";
+  const modalMinWidth = isMobile ? "320px" : "800px";
 
   return (
     <Modal
@@ -141,23 +168,25 @@ const FileManager: React.FC<FileManagerProps> = ({ selectedTool }) => {
       zIndex={Z_INDEX_FILE_MANAGER_MODAL}
       styles={{
         content: {
-          position: 'relative',
-          margin: isMobile ? '1rem' : '2rem'
+          position: "relative",
+          margin: isMobile ? "1rem" : "2rem",
         },
         body: { padding: 0 },
-        header: { display: 'none' }
+        header: { display: "none" },
       }}
     >
-      <div style={{
-        position: 'relative',
-        height: modalHeight,
-        width: modalWidth,
-        maxWidth: modalMaxWidth,
-        maxHeight: modalMaxHeight,
-        minWidth: modalMinWidth,
-        margin: '0 auto',
-        overflow: 'hidden'
-      }}>
+      <div
+        style={{
+          position: "relative",
+          height: modalHeight,
+          width: modalWidth,
+          maxWidth: modalMaxWidth,
+          maxHeight: modalMaxHeight,
+          minWidth: modalMinWidth,
+          margin: "0 auto",
+          overflow: "hidden",
+        }}
+      >
         <Dropzone
           onDrop={handleNewFileUpload}
           onDragEnter={() => setIsDragging(true)}
@@ -165,14 +194,14 @@ const FileManager: React.FC<FileManagerProps> = ({ selectedTool }) => {
           multiple={true}
           activateOnClick={false}
           style={{
-            height: '100%',
-            width: '100%',
-            border: 'none',
-            borderRadius: 'var(--radius-md)',
-            backgroundColor: 'var(--bg-file-manager)'
+            height: "100%",
+            width: "100%",
+            border: "none",
+            borderRadius: "var(--radius-md)",
+            backgroundColor: "var(--bg-file-manager)",
           }}
           styles={{
-            inner: { pointerEvents: 'all' }
+            inner: { pointerEvents: "all" },
           }}
         >
           <FileManagerProvider
diff --git a/frontend/src/core/components/StorageStatsCard.tsx b/frontend/src/core/components/StorageStatsCard.tsx
index d04fd11ac4..468d24fe37 100644
--- a/frontend/src/core/components/StorageStatsCard.tsx
+++ b/frontend/src/core/components/StorageStatsCard.tsx
@@ -32,19 +32,27 @@ const StorageStatsCard: React.FC<StorageStatsCardProps> = ({
         <StorageIcon />
         <div style={{ flex: 1 }}>
           <Text size="sm" fw={500}>
-            {t("fileManager.storage", "Storage")}: {formatFileSize(storageStats.used)}
+            {t("fileManager.storage", "Storage")}:{" "}
+            {formatFileSize(storageStats.used)}
             {storageStats.quota && ` / ${formatFileSize(storageStats.quota)}`}
           </Text>
           {storageStats.quota && (
             <Progress
               value={storageUsagePercent}
-              color={storageUsagePercent > 80 ? "red" : storageUsagePercent > 60 ? "yellow" : "blue"}
+              color={
+                storageUsagePercent > 80
+                  ? "red"
+                  : storageUsagePercent > 60
+                    ? "yellow"
+                    : "blue"
+              }
               size="sm"
               mt={4}
             />
           )}
           <Text size="xs" c="dimmed">
-            {storageStats.fileCount} {t("fileManager.filesStored", "files stored")}
+            {storageStats.fileCount}{" "}
+            {t("fileManager.filesStored", "files stored")}
           </Text>
         </div>
         <Group gap="xs">
@@ -73,4 +81,4 @@ const StorageStatsCard: React.FC<StorageStatsCardProps> = ({
   );
 };
 
-export default StorageStatsCard;
\ No newline at end of file
+export default StorageStatsCard;
diff --git a/frontend/src/core/components/annotation/providers/PDFAnnotationProvider.tsx b/frontend/src/core/components/annotation/providers/PDFAnnotationProvider.tsx
index 0979d59e35..bbc6484f2e 100644
--- a/frontend/src/core/components/annotation/providers/PDFAnnotationProvider.tsx
+++ b/frontend/src/core/components/annotation/providers/PDFAnnotationProvider.tsx
@@ -1,4 +1,4 @@
-import React, { createContext, useContext, ReactNode } from 'react';
+import React, { createContext, useContext, ReactNode } from "react";
 
 interface PDFAnnotationContextValue {
   // Drawing mode management
@@ -26,7 +26,9 @@ interface PDFAnnotationContextValue {
   setSignatureConfig: (config: any | null) => void;
 }
 
-const PDFAnnotationContext = createContext<PDFAnnotationContextValue | undefined>(undefined);
+const PDFAnnotationContext = createContext<
+  PDFAnnotationContextValue | undefined
+>(undefined);
 
 interface PDFAnnotationProviderProps {
   children: ReactNode;
@@ -58,7 +60,7 @@ export const PDFAnnotationProvider: React.FC<PDFAnnotationProviderProps> = ({
   getImageData,
   isPlacementMode,
   signatureConfig,
-  setSignatureConfig
+  setSignatureConfig,
 }) => {
   const contextValue: PDFAnnotationContextValue = {
     activateDrawMode,
@@ -72,7 +74,7 @@ export const PDFAnnotationProvider: React.FC<PDFAnnotationProviderProps> = ({
     getImageData,
     isPlacementMode,
     signatureConfig,
-    setSignatureConfig
+    setSignatureConfig,
   };
 
   return (
@@ -85,7 +87,9 @@ export const PDFAnnotationProvider: React.FC<PDFAnnotationProviderProps> = ({
 export const usePDFAnnotation = (): PDFAnnotationContextValue => {
   const context = useContext(PDFAnnotationContext);
   if (context === undefined) {
-    throw new Error('usePDFAnnotation must be used within a PDFAnnotationProvider');
+    throw new Error(
+      "usePDFAnnotation must be used within a PDFAnnotationProvider",
+    );
   }
   return context;
-};
\ No newline at end of file
+};
diff --git a/frontend/src/core/components/annotation/shared/BaseAnnotationTool.tsx b/frontend/src/core/components/annotation/shared/BaseAnnotationTool.tsx
index ea093b5be8..4c0862a012 100644
--- a/frontend/src/core/components/annotation/shared/BaseAnnotationTool.tsx
+++ b/frontend/src/core/components/annotation/shared/BaseAnnotationTool.tsx
@@ -1,10 +1,10 @@
-import React, { useEffect, useState } from 'react';
-import { Stack, Alert, Text } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { DrawingControls } from '@app/components/annotation/shared/DrawingControls';
-import { ColorPicker } from '@app/components/annotation/shared/ColorPicker';
-import { usePDFAnnotation } from '@app/components/annotation/providers/PDFAnnotationProvider';
-import { useSignature } from '@app/contexts/SignatureContext';
+import React, { useEffect, useState } from "react";
+import { Stack, Alert, Text } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import { DrawingControls } from "@app/components/annotation/shared/DrawingControls";
+import { ColorPicker } from "@app/components/annotation/shared/ColorPicker";
+import { usePDFAnnotation } from "@app/components/annotation/providers/PDFAnnotationProvider";
+import { useSignature } from "@app/contexts/SignatureContext";
 
 export interface AnnotationToolConfig {
   enableDrawing?: boolean;
@@ -25,20 +25,19 @@ export const BaseAnnotationTool: React.FC<BaseAnnotationToolProps> = ({
   config,
   children,
   onSignatureDataChange,
-  disabled = false
+  disabled = false,
 }) => {
   const { t } = useTranslation();
-  const {
-    activateSignaturePlacementMode,
-    undo,
-    redo
-  } = usePDFAnnotation();
+  const { activateSignaturePlacementMode, undo, redo } = usePDFAnnotation();
   const { historyApiRef } = useSignature();
 
-  const [selectedColor, setSelectedColor] = useState('#000000');
+  const [selectedColor, setSelectedColor] = useState("#000000");
   const [isColorPickerOpen, setIsColorPickerOpen] = useState(false);
   const [signatureData, setSignatureData] = useState<string | null>(null);
-  const [historyAvailability, setHistoryAvailability] = useState({ canUndo: false, canRedo: false });
+  const [historyAvailability, setHistoryAvailability] = useState({
+    canUndo: false,
+    canRedo: false,
+  });
   const historyApiInstance = historyApiRef.current;
 
   useEffect(() => {
@@ -81,7 +80,9 @@ export const BaseAnnotationTool: React.FC<BaseAnnotationToolProps> = ({
         onRedo={redo}
         canUndo={historyAvailability.canUndo}
         canRedo={historyAvailability.canRedo}
-        onPlaceSignature={config.showPlaceButton ? handlePlaceSignature : undefined}
+        onPlaceSignature={
+          config.showPlaceButton ? handlePlaceSignature : undefined
+        }
         hasSignatureData={!!signatureData}
         disabled={disabled}
         showPlaceButton={config.showPlaceButton}
@@ -94,11 +95,14 @@ export const BaseAnnotationTool: React.FC<BaseAnnotationToolProps> = ({
         signatureData,
         onSignatureDataChange: handleSignatureDataChange,
         onColorSwatchClick: () => setIsColorPickerOpen(true),
-        disabled
+        disabled,
       })}
 
       {/* Instructions for placing signature */}
-      <Alert color="blue" title={t('sign.instructions.title', 'How to add signature')}>
+      <Alert
+        color="blue"
+        title={t("sign.instructions.title", "How to add signature")}
+      >
         <Text size="sm">
           Click anywhere on the PDF to place your annotation.
         </Text>
diff --git a/frontend/src/core/components/annotation/shared/ColorControl.tsx b/frontend/src/core/components/annotation/shared/ColorControl.tsx
index 16b3f845bb..ff2a3ff458 100644
--- a/frontend/src/core/components/annotation/shared/ColorControl.tsx
+++ b/frontend/src/core/components/annotation/shared/ColorControl.tsx
@@ -1,15 +1,24 @@
-import { ActionIcon, Tooltip, Popover, Stack, ColorSwatch, ColorPicker as MantineColorPicker, Group } from '@mantine/core';
-import { useState, useCallback, useEffect } from 'react';
-import ColorizeIcon from '@mui/icons-material/Colorize';
+import {
+  ActionIcon,
+  Tooltip,
+  Popover,
+  Stack,
+  ColorSwatch,
+  ColorPicker as MantineColorPicker,
+  Group,
+} from "@mantine/core";
+import { useState, useCallback, useEffect } from "react";
+import ColorizeIcon from "@mui/icons-material/Colorize";
 
 // safari and firefox do not support the eye dropper API, only edge, chrome and opera do.
 // the button is hidden in the UI if the API is not supported.
-const supportsEyeDropper = typeof window !== 'undefined' && 'EyeDropper' in window;
+const supportsEyeDropper =
+  typeof window !== "undefined" && "EyeDropper" in window;
 
 interface EyeDropper {
   open(): Promise<{ sRGBHex: string }>;
 }
-declare const EyeDropper: { new(): EyeDropper };
+declare const EyeDropper: { new (): EyeDropper };
 
 interface ColorControlProps {
   value: string;
@@ -18,13 +27,20 @@ interface ColorControlProps {
   disabled?: boolean;
 }
 
-export function ColorControl({ value, onChange, label, disabled = false }: ColorControlProps) {
+export function ColorControl({
+  value,
+  onChange,
+  label,
+  disabled = false,
+}: ColorControlProps) {
   const [opened, setOpened] = useState(false);
   // Buffer the colour locally so the picker stays responsive during drag.
   // Only propagate to the parent (which triggers expensive annotation updates)
   // on onChangeEnd (mouse-up / swatch click), preventing infinite re-render loops.
   const [localColor, setLocalColor] = useState(value);
-  useEffect(() => { setLocalColor(value); }, [value]);
+  useEffect(() => {
+    setLocalColor(value);
+  }, [value]);
 
   const handleEyeDropper = useCallback(async () => {
     if (!supportsEyeDropper) return;
@@ -38,7 +54,13 @@ export function ColorControl({ value, onChange, label, disabled = false }: Color
   }, [onChange]);
 
   return (
-    <Popover opened={opened} onChange={setOpened} position="bottom" withArrow withinPortal>
+    <Popover
+      opened={opened}
+      onChange={setOpened}
+      position="bottom"
+      withArrow
+      withinPortal
+    >
       <Popover.Target>
         <Tooltip label={label}>
           <ActionIcon
@@ -50,13 +72,13 @@ export function ColorControl({ value, onChange, label, disabled = false }: Color
             styles={{
               root: {
                 flexShrink: 0,
-                backgroundColor: 'var(--bg-raised)',
-                border: '1px solid var(--border-default)',
-                color: 'var(--text-secondary)',
-                '&:hover': {
-                  backgroundColor: 'var(--hover-bg)',
-                  borderColor: 'var(--border-strong)',
-                  color: 'var(--text-primary)',
+                backgroundColor: "var(--bg-raised)",
+                border: "1px solid var(--border-default)",
+                color: "var(--text-secondary)",
+                "&:hover": {
+                  backgroundColor: "var(--hover-bg)",
+                  borderColor: "var(--border-strong)",
+                  color: "var(--text-primary)",
                 },
               },
             }}
@@ -73,8 +95,16 @@ export function ColorControl({ value, onChange, label, disabled = false }: Color
             onChange={setLocalColor}
             onChangeEnd={onChange}
             swatches={[
-              '#000000', '#ffffff', '#ff0000', '#00ff00', '#0000ff',
-              '#ffff00', '#ff00ff', '#00ffff', '#ffa500', 'transparent'
+              "#000000",
+              "#ffffff",
+              "#ff0000",
+              "#00ff00",
+              "#0000ff",
+              "#ffff00",
+              "#ff00ff",
+              "#00ffff",
+              "#ffa500",
+              "transparent",
             ]}
             swatchesPerRow={5}
             size="sm"
@@ -82,7 +112,13 @@ export function ColorControl({ value, onChange, label, disabled = false }: Color
           {supportsEyeDropper && (
             <Group justify="flex-end">
               <Tooltip label="Pick colour from screen">
-                <ActionIcon variant="subtle" color="gray" size="sm" onClick={handleEyeDropper} style={{ color: 'var(--text-primary)' }}>
+                <ActionIcon
+                  variant="subtle"
+                  color="gray"
+                  size="sm"
+                  onClick={handleEyeDropper}
+                  style={{ color: "var(--text-primary)" }}
+                >
                   <ColorizeIcon style={{ fontSize: 16 }} />
                 </ActionIcon>
               </Tooltip>
diff --git a/frontend/src/core/components/annotation/shared/ColorPicker.tsx b/frontend/src/core/components/annotation/shared/ColorPicker.tsx
index 21656b1f23..e12db7f340 100644
--- a/frontend/src/core/components/annotation/shared/ColorPicker.tsx
+++ b/frontend/src/core/components/annotation/shared/ColorPicker.tsx
@@ -1,6 +1,15 @@
-import React from 'react';
-import { Modal, Stack, ColorPicker as MantineColorPicker, Group, Button, ColorSwatch, Slider, Text } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
+import React from "react";
+import {
+  Modal,
+  Stack,
+  ColorPicker as MantineColorPicker,
+  Group,
+  Button,
+  ColorSwatch,
+  Slider,
+  Text,
+} from "@mantine/core";
+import { useTranslation } from "react-i18next";
 
 interface ColorPickerProps {
   isOpen: boolean;
@@ -26,8 +35,9 @@ export const ColorPicker: React.FC<ColorPickerProps> = ({
   opacityLabel,
 }) => {
   const { t } = useTranslation();
-  const resolvedTitle = title ?? t('colorPicker.title', 'Choose colour');
-  const resolvedOpacityLabel = opacityLabel ?? t('annotation.opacity', 'Opacity');
+  const resolvedTitle = title ?? t("colorPicker.title", "Choose colour");
+  const resolvedOpacityLabel =
+    opacityLabel ?? t("annotation.opacity", "Opacity");
 
   return (
     <Modal
@@ -42,32 +52,39 @@ export const ColorPicker: React.FC<ColorPickerProps> = ({
           format="hex"
           value={selectedColor}
           onChange={onColorChange}
-          swatches={['#000000', '#0066cc', '#cc0000', '#cc6600', '#009900', '#6600cc']}
+          swatches={[
+            "#000000",
+            "#0066cc",
+            "#cc0000",
+            "#cc6600",
+            "#009900",
+            "#6600cc",
+          ]}
           swatchesPerRow={6}
           size="lg"
           fullWidth
         />
         {showOpacity && onOpacityChange && opacity !== undefined && (
           <Stack gap="xs">
-            <Text size="sm" fw={500}>{resolvedOpacityLabel}</Text>
+            <Text size="sm" fw={500}>
+              {resolvedOpacityLabel}
+            </Text>
             <Slider
               min={10}
               max={100}
               value={opacity}
               onChange={onOpacityChange}
               marks={[
-                { value: 25, label: '25%' },
-                { value: 50, label: '50%' },
-                { value: 75, label: '75%' },
-                { value: 100, label: '100%' },
+                { value: 25, label: "25%" },
+                { value: 50, label: "50%" },
+                { value: 75, label: "75%" },
+                { value: 100, label: "100%" },
               ]}
             />
           </Stack>
         )}
         <Group justify="flex-end">
-          <Button onClick={onClose}>
-            {t('common.done', 'Done')}
-          </Button>
+          <Button onClick={onClose}>{t("common.done", "Done")}</Button>
         </Group>
       </Stack>
     </Modal>
@@ -83,14 +100,14 @@ interface ColorSwatchButtonProps {
 export const ColorSwatchButton: React.FC<ColorSwatchButtonProps> = ({
   color,
   onClick,
-  size = 24
+  size = 24,
 }) => {
   return (
     <ColorSwatch
       color={color}
       size={size}
       radius={0}
-      style={{ cursor: 'pointer' }}
+      style={{ cursor: "pointer" }}
       onClick={onClick}
     />
   );
diff --git a/frontend/src/core/components/annotation/shared/DrawingCanvas.tsx b/frontend/src/core/components/annotation/shared/DrawingCanvas.tsx
index fd8864be26..de6348f624 100644
--- a/frontend/src/core/components/annotation/shared/DrawingCanvas.tsx
+++ b/frontend/src/core/components/annotation/shared/DrawingCanvas.tsx
@@ -1,10 +1,10 @@
-import React, { useEffect, useRef, useState } from 'react';
-import { Paper, Button, Modal, Stack, Text, Group } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { ColorSwatchButton } from '@app/components/annotation/shared/ColorPicker';
-import PenSizeSelector from '@app/components/tools/sign/PenSizeSelector';
-import SignaturePad from 'signature_pad';
-import { PrivateContent } from '@app/components/shared/PrivateContent';
+import React, { useEffect, useRef, useState } from "react";
+import { Paper, Button, Modal, Stack, Text, Group } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import { ColorSwatchButton } from "@app/components/annotation/shared/ColorPicker";
+import PenSizeSelector from "@app/components/tools/sign/PenSizeSelector";
+import SignaturePad from "signature_pad";
+import { PrivateContent } from "@app/components/shared/PrivateContent";
 
 interface DrawingCanvasProps {
   selectedColor: string;
@@ -47,7 +47,9 @@ export const DrawingCanvas: React.FC<DrawingCanvasProps> = ({
   const modalCanvasRef = useRef<HTMLCanvasElement>(null);
   const padRef = useRef<SignaturePad | null>(null);
   const [modalOpen, setModalOpen] = useState(false);
-  const [savedSignatureData, setSavedSignatureData] = useState<string | null>(null);
+  const [savedSignatureData, setSavedSignatureData] = useState<string | null>(
+    null,
+  );
 
   const initPad = (canvas: HTMLCanvasElement) => {
     if (!padRef.current) {
@@ -68,7 +70,7 @@ export const DrawingCanvas: React.FC<DrawingCanvasProps> = ({
       if (savedSignatureData) {
         const img = new Image();
         img.onload = () => {
-          const ctx = canvas.getContext('2d');
+          const ctx = canvas.getContext("2d");
           if (ctx) {
             ctx.drawImage(img, 0, 0, canvas.width, canvas.height);
           }
@@ -92,13 +94,16 @@ export const DrawingCanvas: React.FC<DrawingCanvasProps> = ({
   }, [autoOpen]);
 
   const trimCanvas = (canvas: HTMLCanvasElement): string => {
-    const ctx = canvas.getContext('2d');
-    if (!ctx) return canvas.toDataURL('image/png');
+    const ctx = canvas.getContext("2d");
+    if (!ctx) return canvas.toDataURL("image/png");
 
     const imageData = ctx.getImageData(0, 0, canvas.width, canvas.height);
     const pixels = imageData.data;
 
-    let minX = canvas.width, minY = canvas.height, maxX = 0, maxY = 0;
+    let minX = canvas.width,
+      minY = canvas.height,
+      maxX = 0,
+      maxY = 0;
 
     // Find bounds of non-transparent pixels
     for (let y = 0; y < canvas.height; y++) {
@@ -117,27 +122,40 @@ export const DrawingCanvas: React.FC<DrawingCanvasProps> = ({
     const trimHeight = maxY - minY + 1;
 
     // Create trimmed canvas
-    const trimmedCanvas = document.createElement('canvas');
+    const trimmedCanvas = document.createElement("canvas");
     trimmedCanvas.width = trimWidth;
     trimmedCanvas.height = trimHeight;
-    const trimmedCtx = trimmedCanvas.getContext('2d');
+    const trimmedCtx = trimmedCanvas.getContext("2d");
     if (trimmedCtx) {
-      trimmedCtx.drawImage(canvas, minX, minY, trimWidth, trimHeight, 0, 0, trimWidth, trimHeight);
+      trimmedCtx.drawImage(
+        canvas,
+        minX,
+        minY,
+        trimWidth,
+        trimHeight,
+        0,
+        0,
+        trimWidth,
+        trimHeight,
+      );
     }
 
-    return trimmedCanvas.toDataURL('image/png');
+    return trimmedCanvas.toDataURL("image/png");
   };
 
   const renderPreview = (dataUrl: string) => {
     const canvas = previewCanvasRef.current;
     if (!canvas) return;
-    const ctx = canvas.getContext('2d');
+    const ctx = canvas.getContext("2d");
     if (!ctx) return;
 
     const img = new Image();
     img.onload = () => {
       ctx.clearRect(0, 0, canvas.width, canvas.height);
-      const scale = Math.min(canvas.width / img.width, canvas.height / img.height);
+      const scale = Math.min(
+        canvas.width / img.width,
+        canvas.height / img.height,
+      );
       const scaledWidth = img.width * scale;
       const scaledHeight = img.height * scale;
       const x = (canvas.width - scaledWidth) / 2;
@@ -153,7 +171,7 @@ export const DrawingCanvas: React.FC<DrawingCanvasProps> = ({
       const canvas = modalCanvasRef.current;
       if (canvas) {
         const trimmedPng = trimCanvas(canvas);
-        const untrimmedPng = canvas.toDataURL('image/png');
+        const untrimmedPng = canvas.toDataURL("image/png");
         setSavedSignatureData(untrimmedPng); // Save untrimmed for restoration
         onSignatureDataChange(trimmedPng);
         renderPreview(trimmedPng);
@@ -176,9 +194,14 @@ export const DrawingCanvas: React.FC<DrawingCanvasProps> = ({
       padRef.current.clear();
     }
     if (previewCanvasRef.current) {
-      const ctx = previewCanvasRef.current.getContext('2d');
+      const ctx = previewCanvasRef.current.getContext("2d");
       if (ctx) {
-        ctx.clearRect(0, 0, previewCanvasRef.current.width, previewCanvasRef.current.height);
+        ctx.clearRect(
+          0,
+          0,
+          previewCanvasRef.current.width,
+          previewCanvasRef.current.height,
+        );
       }
     }
     setSavedSignatureData(null); // Clear saved signature
@@ -209,7 +232,7 @@ export const DrawingCanvas: React.FC<DrawingCanvasProps> = ({
   useEffect(() => {
     const canvas = previewCanvasRef.current;
     if (!canvas) return;
-    const ctx = canvas.getContext('2d');
+    const ctx = canvas.getContext("2d");
     if (!ctx) return;
 
     if (!initialSignatureData) {
@@ -227,33 +250,41 @@ export const DrawingCanvas: React.FC<DrawingCanvasProps> = ({
       <Paper withBorder p="md">
         <Stack gap="sm">
           <PrivateContent>
-          <Text fw={500}>{t('sign.canvas.heading', 'Draw your signature')}</Text>
-          <canvas
-            ref={previewCanvasRef}
-            width={width}
-            height={height}
-            style={{
-              border: '1px solid #ccc',
-              borderRadius: '4px',
-              cursor: disabled ? 'default' : 'pointer',
-              backgroundColor: '#ffffff',
-              width: '100%',
-            }}
-            onClick={disabled ? undefined : openModal}
-          />
+            <Text fw={500}>
+              {t("sign.canvas.heading", "Draw your signature")}
+            </Text>
+            <canvas
+              ref={previewCanvasRef}
+              width={width}
+              height={height}
+              style={{
+                border: "1px solid #ccc",
+                borderRadius: "4px",
+                cursor: disabled ? "default" : "pointer",
+                backgroundColor: "#ffffff",
+                width: "100%",
+              }}
+              onClick={disabled ? undefined : openModal}
+            />
           </PrivateContent>
           <Text size="sm" c="dimmed" ta="center">
-            {t('sign.canvas.clickToOpen', 'Click to open the drawing canvas')}
+            {t("sign.canvas.clickToOpen", "Click to open the drawing canvas")}
           </Text>
         </Stack>
       </Paper>
 
-      <Modal opened={modalOpen} onClose={closeModal} title={t('sign.canvas.modalTitle', 'Draw your signature')} size="auto" centered>
+      <Modal
+        opened={modalOpen}
+        onClose={closeModal}
+        title={t("sign.canvas.modalTitle", "Draw your signature")}
+        size="auto"
+        centered
+      >
         <Stack gap="md">
           <Group gap="lg" align="flex-end" wrap="wrap">
             <Stack gap={4} style={{ minWidth: 120 }}>
               <Text size="sm" fw={500}>
-                {t('sign.canvas.colorLabel', 'Colour')}
+                {t("sign.canvas.colorLabel", "Colour")}
               </Text>
               <ColorSwatchButton
                 color={selectedColor}
@@ -262,7 +293,7 @@ export const DrawingCanvas: React.FC<DrawingCanvasProps> = ({
             </Stack>
             <Stack gap={4} style={{ minWidth: 120 }}>
               <Text size="sm" fw={500}>
-                {t('sign.canvas.penSizeLabel', 'Pen size')}
+                {t("sign.canvas.penSizeLabel", "Pen size")}
               </Text>
               <PenSizeSelector
                 value={penSize}
@@ -272,9 +303,9 @@ export const DrawingCanvas: React.FC<DrawingCanvasProps> = ({
                   updatePenSize(size);
                 }}
                 onInputChange={onPenSizeInputChange}
-                placeholder={t('sign.canvas.penSizePlaceholder', 'Size')}
+                placeholder={t("sign.canvas.penSizePlaceholder", "Size")}
                 size="compact-sm"
-                style={{ width: '80px' }}
+                style={{ width: "80px" }}
               />
             </Stack>
           </Group>
@@ -286,26 +317,24 @@ export const DrawingCanvas: React.FC<DrawingCanvasProps> = ({
                 if (el) initPad(el);
               }}
               style={{
-                border: '1px solid #ccc',
-                borderRadius: '4px',
-                display: 'block',
-                touchAction: 'none',
-                backgroundColor: 'white',
-                width: '100%',
-                maxWidth: '50rem',
-                height: '25rem',
-                cursor: 'crosshair',
+                border: "1px solid #ccc",
+                borderRadius: "4px",
+                display: "block",
+                touchAction: "none",
+                backgroundColor: "white",
+                width: "100%",
+                maxWidth: "50rem",
+                height: "25rem",
+                cursor: "crosshair",
               }}
             />
           </PrivateContent>
 
-          <div style={{ display: 'flex', justifyContent: 'space-between' }}>
+          <div style={{ display: "flex", justifyContent: "space-between" }}>
             <Button variant="subtle" color="red" onClick={clear}>
-              {t('sign.canvas.clear', 'Clear canvas')}
-            </Button>
-            <Button onClick={closeModal}>
-              {t('common.done', 'Done')}
+              {t("sign.canvas.clear", "Clear canvas")}
             </Button>
+            <Button onClick={closeModal}>{t("common.done", "Done")}</Button>
           </div>
         </Stack>
       </Modal>
diff --git a/frontend/src/core/components/annotation/shared/DrawingControls.tsx b/frontend/src/core/components/annotation/shared/DrawingControls.tsx
index 3c28a594e0..7118a817e8 100644
--- a/frontend/src/core/components/annotation/shared/DrawingControls.tsx
+++ b/frontend/src/core/components/annotation/shared/DrawingControls.tsx
@@ -1,7 +1,7 @@
-import React from 'react';
-import { Group, Button, ActionIcon, Tooltip } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { LocalIcon } from '@app/components/shared/LocalIcon';
+import React from "react";
+import { Group, Button, ActionIcon, Tooltip } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import { LocalIcon } from "@app/components/shared/LocalIcon";
 
 interface DrawingControlsProps {
   onUndo?: () => void;
@@ -35,30 +35,40 @@ export const DrawingControls: React.FC<DrawingControlsProps> = ({
   return (
     <Group gap="xs" wrap="nowrap" align="center">
       {onUndo && (
-        <Tooltip label={t('sign.undo', 'Undo')}>
+        <Tooltip label={t("sign.undo", "Undo")}>
           <ActionIcon
             variant="subtle"
             size="lg"
-            aria-label={t('sign.undo', 'Undo')}
+            aria-label={t("sign.undo", "Undo")}
             onClick={onUndo}
             disabled={undoDisabled}
-            color={undoDisabled ? 'gray' : 'blue'}
+            color={undoDisabled ? "gray" : "blue"}
           >
-            <LocalIcon icon="undo" width={20} height={20} style={{ color: 'currentColor' }} />
+            <LocalIcon
+              icon="undo"
+              width={20}
+              height={20}
+              style={{ color: "currentColor" }}
+            />
           </ActionIcon>
         </Tooltip>
       )}
       {onRedo && (
-        <Tooltip label={t('sign.redo', 'Redo')}>
+        <Tooltip label={t("sign.redo", "Redo")}>
           <ActionIcon
             variant="subtle"
             size="lg"
-            aria-label={t('sign.redo', 'Redo')}
+            aria-label={t("sign.redo", "Redo")}
             onClick={onRedo}
             disabled={redoDisabled}
-            color={redoDisabled ? 'gray' : 'blue'}
+            color={redoDisabled ? "gray" : "blue"}
           >
-            <LocalIcon icon="redo" width={20} height={20} style={{ color: 'currentColor' }} />
+            <LocalIcon
+              icon="redo"
+              width={20}
+              height={20}
+              style={{ color: "currentColor" }}
+            />
           </ActionIcon>
         </Tooltip>
       )}
diff --git a/frontend/src/core/components/annotation/shared/ImageUploader.tsx b/frontend/src/core/components/annotation/shared/ImageUploader.tsx
index ee2cdd123f..00802893c3 100644
--- a/frontend/src/core/components/annotation/shared/ImageUploader.tsx
+++ b/frontend/src/core/components/annotation/shared/ImageUploader.tsx
@@ -1,9 +1,9 @@
-import React, { useState } from 'react';
-import { FileInput, Text, Stack, Checkbox } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { PrivateContent } from '@app/components/shared/PrivateContent';
-import { removeWhiteBackground } from '@app/utils/imageTransparency';
-import { alert } from '@app/components/toast';
+import React, { useState } from "react";
+import { FileInput, Text, Stack, Checkbox } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import { PrivateContent } from "@app/components/shared/PrivateContent";
+import { removeWhiteBackground } from "@app/utils/imageTransparency";
+import { alert } from "@app/components/toast";
 
 interface ImageUploaderProps {
   onImageChange: (file: File | null) => void;
@@ -22,29 +22,43 @@ export const ImageUploader: React.FC<ImageUploaderProps> = ({
   placeholder,
   hint,
   allowBackgroundRemoval = false,
-  onProcessedImageData
+  onProcessedImageData,
 }) => {
   const { t } = useTranslation();
   const [removeBackground, setRemoveBackground] = useState(false);
   const [currentFile, setCurrentFile] = useState<File | null>(null);
-  const [originalImageData, setOriginalImageData] = useState<string | null>(null);
+  const [originalImageData, setOriginalImageData] = useState<string | null>(
+    null,
+  );
   const [isProcessing, setIsProcessing] = useState(false);
 
-  const processImage = async (imageSource: File | string, shouldRemoveBackground: boolean): Promise<void> => {
+  const processImage = async (
+    imageSource: File | string,
+    shouldRemoveBackground: boolean,
+  ): Promise<void> => {
     if (shouldRemoveBackground && allowBackgroundRemoval) {
       setIsProcessing(true);
       try {
-        const transparentImageDataUrl = await removeWhiteBackground(imageSource, {
-          autoDetectCorner: true,
-          tolerance: 15
-        });
+        const transparentImageDataUrl = await removeWhiteBackground(
+          imageSource,
+          {
+            autoDetectCorner: true,
+            tolerance: 15,
+          },
+        );
         onProcessedImageData?.(transparentImageDataUrl);
       } catch (error) {
-        console.error('Error removing background:', error);
+        console.error("Error removing background:", error);
         alert({
-          title: t('sign.image.backgroundRemovalFailedTitle', 'Background removal failed'),
-          body: t('sign.image.backgroundRemovalFailedMessage', 'Could not remove the background from the image. Using original image instead.'),
-          alertType: 'error'
+          title: t(
+            "sign.image.backgroundRemovalFailedTitle",
+            "Background removal failed",
+          ),
+          body: t(
+            "sign.image.backgroundRemovalFailedMessage",
+            "Could not remove the background from the image. Using original image instead.",
+          ),
+          alertType: "error",
         });
         onProcessedImageData?.(null);
       } finally {
@@ -52,7 +66,7 @@ export const ImageUploader: React.FC<ImageUploaderProps> = ({
       }
     } else {
       // When background removal is disabled, return the original image data
-      if (typeof imageSource === 'string') {
+      if (typeof imageSource === "string") {
         onProcessedImageData?.(imageSource);
       } else {
         // Convert File to data URL if needed
@@ -69,8 +83,11 @@ export const ImageUploader: React.FC<ImageUploaderProps> = ({
     if (file && !disabled) {
       try {
         // Validate that it's actually an image file or SVG
-        if (!file.type.startsWith('image/') && !file.name.toLowerCase().endsWith('.svg')) {
-          console.error('Selected file is not an image or SVG');
+        if (
+          !file.type.startsWith("image/") &&
+          !file.name.toLowerCase().endsWith(".svg")
+        ) {
+          console.error("Selected file is not an image or SVG");
           return;
         }
 
@@ -78,10 +95,12 @@ export const ImageUploader: React.FC<ImageUploaderProps> = ({
         onImageChange(file);
 
         let dataUrlToProcess: string;
-        
+
         // Check if file is SVG
-        const isSvg = file.type === 'image/svg+xml' || file.name.toLowerCase().endsWith('.svg');
-        
+        const isSvg =
+          file.type === "image/svg+xml" ||
+          file.name.toLowerCase().endsWith(".svg");
+
         if (isSvg) {
           // For SVG, convert to PNG so it can be embedded in PDF
           dataUrlToProcess = await convertSvgToPng(file);
@@ -98,7 +117,7 @@ export const ImageUploader: React.FC<ImageUploaderProps> = ({
         setOriginalImageData(dataUrlToProcess);
         await processImage(dataUrlToProcess, removeBackground);
       } catch (error) {
-        console.error('Error processing image file:', error);
+        console.error("Error processing image file:", error);
       }
     } else if (!file) {
       // Clear image data when no file is selected
@@ -116,33 +135,41 @@ export const ImageUploader: React.FC<ImageUploaderProps> = ({
       reader.onload = async (e) => {
         try {
           const svgText = e.target?.result as string;
-          
+
           // Parse SVG to get dimensions
           const parser = new DOMParser();
-          const svgDoc = parser.parseFromString(svgText, 'image/svg+xml');
+          const svgDoc = parser.parseFromString(svgText, "image/svg+xml");
           const svgElement = svgDoc.documentElement;
-          
+
           // Get SVG dimensions
-          let width = 800;  // Default width
+          let width = 800; // Default width
           let height = 600; // Default height
-          
-          if (svgElement.hasAttribute('width') && svgElement.hasAttribute('height')) {
-            width = parseFloat(svgElement.getAttribute('width') || '800');
-            height = parseFloat(svgElement.getAttribute('height') || '600');
-          } else if (svgElement.hasAttribute('viewBox')) {
-            const viewBox = svgElement.getAttribute('viewBox')?.split(/\s+|,/);
+
+          if (
+            svgElement.hasAttribute("width") &&
+            svgElement.hasAttribute("height")
+          ) {
+            width = parseFloat(svgElement.getAttribute("width") || "800");
+            height = parseFloat(svgElement.getAttribute("height") || "600");
+          } else if (svgElement.hasAttribute("viewBox")) {
+            const viewBox = svgElement.getAttribute("viewBox")?.split(/\s+|,/);
             if (viewBox && viewBox.length === 4) {
               width = parseFloat(viewBox[2]);
               height = parseFloat(viewBox[3]);
             }
           }
-          
+
           // Ensure reasonable dimensions
-          if (width === 0 || height === 0 || !isFinite(width) || !isFinite(height)) {
+          if (
+            width === 0 ||
+            height === 0 ||
+            !isFinite(width) ||
+            !isFinite(height)
+          ) {
             width = 800;
             height = 600;
           }
-          
+
           // Scale large SVGs down
           const maxDimension = 2048;
           if (width > maxDimension || height > maxDimension) {
@@ -150,68 +177,75 @@ export const ImageUploader: React.FC<ImageUploaderProps> = ({
             width *= scale;
             height *= scale;
           }
-          
-          console.log('Converting SVG to PNG:', { width, height });
-          
+
+          console.log("Converting SVG to PNG:", { width, height });
+
           // Create an image element to render SVG
           const img = new Image();
-          const blob = new Blob([svgText], { type: 'image/svg+xml;charset=utf-8' });
+          const blob = new Blob([svgText], {
+            type: "image/svg+xml;charset=utf-8",
+          });
           const url = URL.createObjectURL(blob);
-          
+
           img.onload = () => {
             try {
               // Use computed dimensions or image natural dimensions
               const finalWidth = img.naturalWidth || img.width || width;
               const finalHeight = img.naturalHeight || img.height || height;
-              
-              console.log('Image loaded:', { naturalWidth: img.naturalWidth, naturalHeight: img.naturalHeight, finalWidth, finalHeight });
-              
+
+              console.log("Image loaded:", {
+                naturalWidth: img.naturalWidth,
+                naturalHeight: img.naturalHeight,
+                finalWidth,
+                finalHeight,
+              });
+
               // Create canvas to convert to PNG
-              const canvas = document.createElement('canvas');
+              const canvas = document.createElement("canvas");
               canvas.width = finalWidth;
               canvas.height = finalHeight;
-              
-              const ctx = canvas.getContext('2d');
+
+              const ctx = canvas.getContext("2d");
               if (!ctx) {
                 URL.revokeObjectURL(url);
-                reject(new Error('Failed to get canvas context'));
+                reject(new Error("Failed to get canvas context"));
                 return;
               }
-              
+
               // Fill with white background (optional, for transparency support)
-              ctx.fillStyle = 'white';
+              ctx.fillStyle = "white";
               ctx.fillRect(0, 0, finalWidth, finalHeight);
-              
+
               // Draw SVG
               ctx.drawImage(img, 0, 0, finalWidth, finalHeight);
               URL.revokeObjectURL(url);
-              
+
               // Convert canvas to PNG data URL
-              const pngDataUrl = canvas.toDataURL('image/png');
-              console.log('SVG converted to PNG successfully');
+              const pngDataUrl = canvas.toDataURL("image/png");
+              console.log("SVG converted to PNG successfully");
               resolve(pngDataUrl);
             } catch (error) {
               URL.revokeObjectURL(url);
-              console.error('Error during canvas rendering:', error);
+              console.error("Error during canvas rendering:", error);
               reject(error);
             }
           };
-          
+
           img.onerror = (error) => {
             URL.revokeObjectURL(url);
-            console.error('Failed to load SVG image:', error);
-            reject(new Error('Failed to load SVG image'));
+            console.error("Failed to load SVG image:", error);
+            reject(new Error("Failed to load SVG image"));
           };
-          
+
           img.src = url;
         } catch (error) {
-          console.error('Error parsing SVG:', error);
+          console.error("Error parsing SVG:", error);
           reject(error);
         }
       };
-      
+
       reader.onerror = () => {
-        console.error('Error reading file:', reader.error);
+        console.error("Error reading file:", reader.error);
         reject(reader.error);
       };
       reader.readAsText(file);
@@ -231,7 +265,9 @@ export const ImageUploader: React.FC<ImageUploaderProps> = ({
       <PrivateContent>
         <FileInput
           label={label}
-          placeholder={placeholder || t('sign.image.placeholder', 'Select image file')}
+          placeholder={
+            placeholder || t("sign.image.placeholder", "Select image file")
+          }
           accept="image/*,.svg"
           onChange={handleImageChange}
           disabled={disabled || isProcessing}
@@ -239,9 +275,14 @@ export const ImageUploader: React.FC<ImageUploaderProps> = ({
       </PrivateContent>
       {allowBackgroundRemoval && (
         <Checkbox
-          label={t('sign.image.removeBackground', 'Remove white background (make transparent)')}
+          label={t(
+            "sign.image.removeBackground",
+            "Remove white background (make transparent)",
+          )}
           checked={removeBackground}
-          onChange={(event) => handleBackgroundRemovalChange(event.currentTarget.checked)}
+          onChange={(event) =>
+            handleBackgroundRemovalChange(event.currentTarget.checked)
+          }
           disabled={disabled || !currentFile || isProcessing}
         />
       )}
@@ -252,7 +293,7 @@ export const ImageUploader: React.FC<ImageUploaderProps> = ({
       )}
       {isProcessing && (
         <Text size="sm" c="dimmed">
-          {t('sign.image.processing', 'Processing image...')}
+          {t("sign.image.processing", "Processing image...")}
         </Text>
       )}
     </Stack>
diff --git a/frontend/src/core/components/annotation/shared/OpacityControl.tsx b/frontend/src/core/components/annotation/shared/OpacityControl.tsx
index 27b1f10dd9..496b5c4070 100644
--- a/frontend/src/core/components/annotation/shared/OpacityControl.tsx
+++ b/frontend/src/core/components/annotation/shared/OpacityControl.tsx
@@ -1,7 +1,14 @@
-import { ActionIcon, Tooltip, Popover, Stack, Slider, Text } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { useState } from 'react';
-import OpacityIcon from '@mui/icons-material/Opacity';
+import {
+  ActionIcon,
+  Tooltip,
+  Popover,
+  Stack,
+  Slider,
+  Text,
+} from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import { useState } from "react";
+import OpacityIcon from "@mui/icons-material/Opacity";
 
 interface OpacityControlProps {
   value: number; // 0-100
@@ -9,14 +16,18 @@ interface OpacityControlProps {
   disabled?: boolean;
 }
 
-export function OpacityControl({ value, onChange, disabled = false }: OpacityControlProps) {
+export function OpacityControl({
+  value,
+  onChange,
+  disabled = false,
+}: OpacityControlProps) {
   const { t } = useTranslation();
   const [opened, setOpened] = useState(false);
 
   return (
     <Popover opened={opened} onChange={setOpened} position="top" withArrow>
       <Popover.Target>
-        <Tooltip label={t('annotation.opacity', 'Opacity')}>
+        <Tooltip label={t("annotation.opacity", "Opacity")}>
           <ActionIcon
             variant="subtle"
             color="gray"
@@ -26,13 +37,13 @@ export function OpacityControl({ value, onChange, disabled = false }: OpacityCon
             styles={{
               root: {
                 flexShrink: 0,
-                backgroundColor: 'var(--bg-raised)',
-                border: '1px solid var(--border-default)',
-                color: 'var(--text-secondary)',
-                '&:hover': {
-                  backgroundColor: 'var(--hover-bg)',
-                  borderColor: 'var(--border-strong)',
-                  color: 'var(--text-primary)',
+                backgroundColor: "var(--bg-raised)",
+                border: "1px solid var(--border-default)",
+                color: "var(--text-secondary)",
+                "&:hover": {
+                  backgroundColor: "var(--hover-bg)",
+                  borderColor: "var(--border-strong)",
+                  color: "var(--text-primary)",
                 },
               },
             }}
@@ -44,7 +55,7 @@ export function OpacityControl({ value, onChange, disabled = false }: OpacityCon
       <Popover.Dropdown>
         <Stack gap="xs" style={{ minWidth: 150 }}>
           <Text size="xs" fw={500}>
-            {t('annotation.opacity', 'Opacity')}
+            {t("annotation.opacity", "Opacity")}
           </Text>
           <Slider
             value={value}
diff --git a/frontend/src/core/components/annotation/shared/PropertiesPopover.tsx b/frontend/src/core/components/annotation/shared/PropertiesPopover.tsx
index 2f5d424ab6..5f23b81ede 100644
--- a/frontend/src/core/components/annotation/shared/PropertiesPopover.tsx
+++ b/frontend/src/core/components/annotation/shared/PropertiesPopover.tsx
@@ -1,15 +1,24 @@
-import { ActionIcon, Tooltip, Popover, Stack, Slider, Text, Group, Button } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { useState } from 'react';
-import type { TrackedAnnotation } from '@embedpdf/plugin-annotation';
-import type { PdfAnnotationObject } from '@embedpdf/models';
-import type { AnnotationPatch } from '@app/components/viewer/viewerTypes';
-import TuneIcon from '@mui/icons-material/Tune';
-import FormatAlignLeftIcon from '@mui/icons-material/FormatAlignLeft';
-import FormatAlignCenterIcon from '@mui/icons-material/FormatAlignCenter';
-import FormatAlignRightIcon from '@mui/icons-material/FormatAlignRight';
+import {
+  ActionIcon,
+  Tooltip,
+  Popover,
+  Stack,
+  Slider,
+  Text,
+  Group,
+  Button,
+} from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import { useState } from "react";
+import type { TrackedAnnotation } from "@embedpdf/plugin-annotation";
+import type { PdfAnnotationObject } from "@embedpdf/models";
+import type { AnnotationPatch } from "@app/components/viewer/viewerTypes";
+import TuneIcon from "@mui/icons-material/Tune";
+import FormatAlignLeftIcon from "@mui/icons-material/FormatAlignLeft";
+import FormatAlignCenterIcon from "@mui/icons-material/FormatAlignCenter";
+import FormatAlignRightIcon from "@mui/icons-material/FormatAlignRight";
 
-export type PropertiesAnnotationType = 'text' | 'note' | 'shape';
+export type PropertiesAnnotationType = "text" | "note" | "shape";
 
 interface PropertiesPopoverProps {
   annotationType: PropertiesAnnotationType;
@@ -35,23 +44,25 @@ export function PropertiesPopover({
     strokeWidth?: number;
   }
 
-  const obj = annotation?.object as (PdfAnnotationObject & AnnotationObjectProps) | undefined;
+  const obj = annotation?.object as
+    | (PdfAnnotationObject & AnnotationObjectProps)
+    | undefined;
 
   // Get current values
   const fontSize = obj?.fontSize ?? 14;
   const textAlign = obj?.textAlign;
   const currentAlign =
-    typeof textAlign === 'number'
+    typeof textAlign === "number"
       ? textAlign === 1
-        ? 'center'
+        ? "center"
         : textAlign === 2
-          ? 'right'
-          : 'left'
-      : textAlign === 'center'
-        ? 'center'
-        : textAlign === 'right'
-          ? 'right'
-          : 'left';
+          ? "right"
+          : "left"
+      : textAlign === "center"
+        ? "center"
+        : textAlign === "right"
+          ? "right"
+          : "left";
 
   // For shapes
   const opacity = Math.round((obj?.opacity ?? 1) * 100);
@@ -63,7 +74,7 @@ export function PropertiesPopover({
       {/* Font Size */}
       <div>
         <Text size="xs" fw={500} mb={4}>
-          {t('annotation.fontSize', 'Font size')}
+          {t("annotation.fontSize", "Font size")}
         </Text>
         <Slider
           value={fontSize}
@@ -77,7 +88,7 @@ export function PropertiesPopover({
       {/* Opacity */}
       <div>
         <Text size="xs" fw={500} mb={4}>
-          {t('annotation.opacity', 'Opacity')}
+          {t("annotation.opacity", "Opacity")}
         </Text>
         <Slider
           value={Math.round((obj?.opacity ?? 1) * 100)}
@@ -91,25 +102,25 @@ export function PropertiesPopover({
       {/* Text Alignment */}
       <div>
         <Text size="xs" fw={500} mb={4}>
-          {t('annotation.textAlignment', 'Text Alignment')}
+          {t("annotation.textAlignment", "Text Alignment")}
         </Text>
         <Group gap="xs">
           <ActionIcon
-            variant={currentAlign === 'left' ? 'filled' : 'default'}
+            variant={currentAlign === "left" ? "filled" : "default"}
             onClick={() => onUpdate({ textAlign: 0 })}
             size="md"
           >
             <FormatAlignLeftIcon style={{ fontSize: 18 }} />
           </ActionIcon>
           <ActionIcon
-            variant={currentAlign === 'center' ? 'filled' : 'default'}
+            variant={currentAlign === "center" ? "filled" : "default"}
             onClick={() => onUpdate({ textAlign: 1 })}
             size="md"
           >
             <FormatAlignCenterIcon style={{ fontSize: 18 }} />
           </ActionIcon>
           <ActionIcon
-            variant={currentAlign === 'right' ? 'filled' : 'default'}
+            variant={currentAlign === "right" ? "filled" : "default"}
             onClick={() => onUpdate({ textAlign: 2 })}
             size="md"
           >
@@ -125,7 +136,7 @@ export function PropertiesPopover({
       {/* Opacity */}
       <div>
         <Text size="xs" fw={500} mb={4}>
-          {t('annotation.opacity', 'Opacity')}
+          {t("annotation.opacity", "Opacity")}
         </Text>
         <Slider
           value={opacity}
@@ -148,7 +159,7 @@ export function PropertiesPopover({
         <Group gap="xs" align="flex-end">
           <div style={{ flex: 1 }}>
             <Text size="xs" fw={500} mb={4}>
-              {t('annotation.strokeWidth', 'Stroke')}
+              {t("annotation.strokeWidth", "Stroke")}
             </Text>
             <Slider
               value={strokeWidth}
@@ -166,7 +177,7 @@ export function PropertiesPopover({
           </div>
           <Button
             size="xs"
-            variant={!borderVisible ? 'filled' : 'light'}
+            variant={!borderVisible ? "filled" : "light"}
             onClick={() => {
               const newValue = borderVisible ? 0 : 1;
               onUpdate({
@@ -177,8 +188,8 @@ export function PropertiesPopover({
             }}
           >
             {borderVisible
-              ? t('annotation.borderOn', 'Border: On')
-              : t('annotation.borderOff', 'Border: Off')}
+              ? t("annotation.borderOn", "Border: On")
+              : t("annotation.borderOff", "Border: Off")}
           </Button>
         </Group>
       </div>
@@ -188,7 +199,7 @@ export function PropertiesPopover({
   return (
     <Popover opened={opened} onChange={setOpened} position="bottom" withArrow>
       <Popover.Target>
-        <Tooltip label={t('annotation.properties', 'Properties')}>
+        <Tooltip label={t("annotation.properties", "Properties")}>
           <ActionIcon
             variant="subtle"
             color="gray"
@@ -198,13 +209,13 @@ export function PropertiesPopover({
             styles={{
               root: {
                 flexShrink: 0,
-                backgroundColor: 'var(--bg-raised)',
-                border: '1px solid var(--border-default)',
-                color: 'var(--text-secondary)',
-                '&:hover': {
-                  backgroundColor: 'var(--hover-bg)',
-                  borderColor: 'var(--border-strong)',
-                  color: 'var(--text-primary)',
+                backgroundColor: "var(--bg-raised)",
+                border: "1px solid var(--border-default)",
+                color: "var(--text-secondary)",
+                "&:hover": {
+                  backgroundColor: "var(--hover-bg)",
+                  borderColor: "var(--border-strong)",
+                  color: "var(--text-primary)",
                 },
               },
             }}
@@ -214,8 +225,9 @@ export function PropertiesPopover({
         </Tooltip>
       </Popover.Target>
       <Popover.Dropdown>
-        {(annotationType === 'text' || annotationType === 'note') && renderTextNoteControls()}
-        {annotationType === 'shape' && renderShapeControls()}
+        {(annotationType === "text" || annotationType === "note") &&
+          renderTextNoteControls()}
+        {annotationType === "shape" && renderShapeControls()}
       </Popover.Dropdown>
     </Popover>
   );
diff --git a/frontend/src/core/components/annotation/shared/TextInputWithFont.tsx b/frontend/src/core/components/annotation/shared/TextInputWithFont.tsx
index 2385357171..a1a07a95b7 100644
--- a/frontend/src/core/components/annotation/shared/TextInputWithFont.tsx
+++ b/frontend/src/core/components/annotation/shared/TextInputWithFont.tsx
@@ -1,7 +1,16 @@
-import React, { useState, useEffect } from 'react';
-import { Stack, TextInput, Select, Combobox, useCombobox, Group, Box, SegmentedControl } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { ColorPicker } from '@app/components/annotation/shared/ColorPicker';
+import React, { useState, useEffect } from "react";
+import {
+  Stack,
+  TextInput,
+  Select,
+  Combobox,
+  useCombobox,
+  Group,
+  Box,
+  SegmentedControl,
+} from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import { ColorPicker } from "@app/components/annotation/shared/ColorPicker";
 
 interface TextInputWithFontProps {
   text: string;
@@ -12,8 +21,8 @@ interface TextInputWithFontProps {
   onFontFamilyChange: (family: string) => void;
   textColor?: string;
   onTextColorChange?: (color: string) => void;
-  textAlign?: 'left' | 'center' | 'right';
-  onTextAlignChange?: (align: 'left' | 'center' | 'right') => void;
+  textAlign?: "left" | "center" | "right";
+  onTextAlignChange?: (align: "left" | "center" | "right") => void;
   disabled?: boolean;
   label: string;
   placeholder: string;
@@ -31,9 +40,9 @@ export const TextInputWithFont: React.FC<TextInputWithFontProps> = ({
   onFontSizeChange,
   fontFamily,
   onFontFamilyChange,
-  textColor = '#000000',
+  textColor = "#000000",
   onTextColorChange,
-  textAlign = 'left',
+  textAlign = "left",
   onTextAlignChange,
   disabled = false,
   label,
@@ -42,7 +51,7 @@ export const TextInputWithFont: React.FC<TextInputWithFontProps> = ({
   fontSizeLabel,
   fontSizePlaceholder,
   colorLabel,
-  onAnyChange
+  onAnyChange,
 }) => {
   const { t } = useTranslation();
   const [fontSizeInput, setFontSizeInput] = useState(fontSize.toString());
@@ -61,14 +70,37 @@ export const TextInputWithFont: React.FC<TextInputWithFontProps> = ({
   }, [textColor]);
 
   const fontOptions = [
-    { value: 'Helvetica', label: 'Helvetica' },
-    { value: 'Times-Roman', label: 'Times' },
-    { value: 'Courier', label: 'Courier' },
-    { value: 'Arial', label: 'Arial' },
-    { value: 'Georgia', label: 'Georgia' },
+    { value: "Helvetica", label: "Helvetica" },
+    { value: "Times-Roman", label: "Times" },
+    { value: "Courier", label: "Courier" },
+    { value: "Arial", label: "Arial" },
+    { value: "Georgia", label: "Georgia" },
   ];
 
-  const fontSizeOptions = ['8', '12', '16', '20', '24', '28', '32', '36', '40', '48', '56', '64', '72', '80', '96', '112', '128', '144', '160', '176', '192', '200'];
+  const fontSizeOptions = [
+    "8",
+    "12",
+    "16",
+    "20",
+    "24",
+    "28",
+    "32",
+    "36",
+    "40",
+    "48",
+    "56",
+    "64",
+    "72",
+    "80",
+    "96",
+    "112",
+    "128",
+    "144",
+    "160",
+    "176",
+    "192",
+    "200",
+  ];
 
   // Validate hex color
   const isValidHexColor = (color: string): boolean => {
@@ -94,7 +126,7 @@ export const TextInputWithFont: React.FC<TextInputWithFontProps> = ({
         label={fontLabel}
         value={fontFamily}
         onChange={(value) => {
-          onFontFamilyChange(value || 'Helvetica');
+          onFontFamilyChange(value || "Helvetica");
           onAnyChange?.();
         }}
         data={fontOptions}
@@ -187,7 +219,7 @@ export const TextInputWithFont: React.FC<TextInputWithFontProps> = ({
                   setColorInput(textColor);
                 }
               }}
-              style={{ width: '100%' }}
+              style={{ width: "100%" }}
               rightSection={
                 <Box
                   onClick={() => !disabled && setIsColorPickerOpen(true)}
@@ -195,9 +227,9 @@ export const TextInputWithFont: React.FC<TextInputWithFontProps> = ({
                     width: 24,
                     height: 24,
                     backgroundColor: textColor,
-                    border: '1px solid #ccc',
+                    border: "1px solid #ccc",
                     borderRadius: 4,
-                    cursor: disabled ? 'default' : 'pointer'
+                    cursor: disabled ? "default" : "pointer",
                   }}
                 />
               }
@@ -224,14 +256,14 @@ export const TextInputWithFont: React.FC<TextInputWithFontProps> = ({
         <SegmentedControl
           value={textAlign}
           onChange={(value: string) => {
-            onTextAlignChange(value as 'left' | 'center' | 'right');
+            onTextAlignChange(value as "left" | "center" | "right");
             onAnyChange?.();
           }}
           disabled={disabled}
           data={[
-            { label: t('textAlign.left', 'Left'), value: 'left' },
-            { label: t('textAlign.center', 'Center'), value: 'center' },
-            { label: t('textAlign.right', 'Right'), value: 'right' },
+            { label: t("textAlign.left", "Left"), value: "left" },
+            { label: t("textAlign.center", "Center"), value: "center" },
+            { label: t("textAlign.right", "Right"), value: "right" },
           ]}
         />
       )}
diff --git a/frontend/src/core/components/annotation/shared/WidthControl.tsx b/frontend/src/core/components/annotation/shared/WidthControl.tsx
index b99d35c996..d4f063f604 100644
--- a/frontend/src/core/components/annotation/shared/WidthControl.tsx
+++ b/frontend/src/core/components/annotation/shared/WidthControl.tsx
@@ -1,7 +1,14 @@
-import { ActionIcon, Tooltip, Popover, Stack, Slider, Text } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { useState } from 'react';
-import LineWeightIcon from '@mui/icons-material/LineWeight';
+import {
+  ActionIcon,
+  Tooltip,
+  Popover,
+  Stack,
+  Slider,
+  Text,
+} from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import { useState } from "react";
+import LineWeightIcon from "@mui/icons-material/LineWeight";
 
 interface WidthControlProps {
   value: number;
@@ -11,14 +18,20 @@ interface WidthControlProps {
   disabled?: boolean;
 }
 
-export function WidthControl({ value, onChange, min, max, disabled = false }: WidthControlProps) {
+export function WidthControl({
+  value,
+  onChange,
+  min,
+  max,
+  disabled = false,
+}: WidthControlProps) {
   const { t } = useTranslation();
   const [opened, setOpened] = useState(false);
 
   return (
     <Popover opened={opened} onChange={setOpened} position="top" withArrow>
       <Popover.Target>
-        <Tooltip label={t('annotation.width', 'Width')}>
+        <Tooltip label={t("annotation.width", "Width")}>
           <ActionIcon
             variant="subtle"
             color="gray"
@@ -28,13 +41,13 @@ export function WidthControl({ value, onChange, min, max, disabled = false }: Wi
             styles={{
               root: {
                 flexShrink: 0,
-                backgroundColor: 'var(--bg-raised)',
-                border: '1px solid var(--border-default)',
-                color: 'var(--text-secondary)',
-                '&:hover': {
-                  backgroundColor: 'var(--hover-bg)',
-                  borderColor: 'var(--border-strong)',
-                  color: 'var(--text-primary)',
+                backgroundColor: "var(--bg-raised)",
+                border: "1px solid var(--border-default)",
+                color: "var(--text-secondary)",
+                "&:hover": {
+                  backgroundColor: "var(--hover-bg)",
+                  borderColor: "var(--border-strong)",
+                  color: "var(--text-primary)",
                 },
               },
             }}
@@ -46,7 +59,7 @@ export function WidthControl({ value, onChange, min, max, disabled = false }: Wi
       <Popover.Dropdown>
         <Stack gap="xs" style={{ minWidth: 150 }}>
           <Text size="xs" fw={500}>
-            {t('annotation.width', 'Width')}
+            {t("annotation.width", "Width")}
           </Text>
           <Slider
             value={value}
diff --git a/frontend/src/core/components/annotation/tools/DrawingTool.tsx b/frontend/src/core/components/annotation/tools/DrawingTool.tsx
index f3643de35c..e35f329b7e 100644
--- a/frontend/src/core/components/annotation/tools/DrawingTool.tsx
+++ b/frontend/src/core/components/annotation/tools/DrawingTool.tsx
@@ -1,7 +1,7 @@
-import React, { useState } from 'react';
-import { Stack } from '@mantine/core';
-import { BaseAnnotationTool } from '@app/components/annotation/shared/BaseAnnotationTool';
-import { DrawingCanvas } from '@app/components/annotation/shared/DrawingCanvas';
+import React, { useState } from "react";
+import { Stack } from "@mantine/core";
+import { BaseAnnotationTool } from "@app/components/annotation/shared/BaseAnnotationTool";
+import { DrawingCanvas } from "@app/components/annotation/shared/DrawingCanvas";
 
 interface DrawingToolProps {
   onDrawingChange?: (data: string | null) => void;
@@ -10,16 +10,16 @@ interface DrawingToolProps {
 
 export const DrawingTool: React.FC<DrawingToolProps> = ({
   onDrawingChange,
-  disabled = false
+  disabled = false,
 }) => {
-  const [selectedColor] = useState('#000000');
+  const [selectedColor] = useState("#000000");
   const [penSize, setPenSize] = useState(2);
-  const [penSizeInput, setPenSizeInput] = useState('2');
+  const [penSizeInput, setPenSizeInput] = useState("2");
 
   const toolConfig = {
     enableDrawing: true,
     showPlaceButton: true,
-    placeButtonText: "Place Drawing"
+    placeButtonText: "Place Drawing",
   };
 
   return (
@@ -42,4 +42,4 @@ export const DrawingTool: React.FC<DrawingToolProps> = ({
       </Stack>
     </BaseAnnotationTool>
   );
-};
\ No newline at end of file
+};
diff --git a/frontend/src/core/components/annotation/tools/ImageTool.tsx b/frontend/src/core/components/annotation/tools/ImageTool.tsx
index 0704546965..1303e2a4c6 100644
--- a/frontend/src/core/components/annotation/tools/ImageTool.tsx
+++ b/frontend/src/core/components/annotation/tools/ImageTool.tsx
@@ -1,7 +1,7 @@
-import React, { useState } from 'react';
-import { Stack } from '@mantine/core';
-import { BaseAnnotationTool } from '@app/components/annotation/shared/BaseAnnotationTool';
-import { ImageUploader } from '@app/components/annotation/shared/ImageUploader';
+import React, { useState } from "react";
+import { Stack } from "@mantine/core";
+import { BaseAnnotationTool } from "@app/components/annotation/shared/BaseAnnotationTool";
+import { ImageUploader } from "@app/components/annotation/shared/ImageUploader";
 
 interface ImageToolProps {
   onImageChange?: (data: string | null) => void;
@@ -10,7 +10,7 @@ interface ImageToolProps {
 
 export const ImageTool: React.FC<ImageToolProps> = ({
   onImageChange,
-  disabled = false
+  disabled = false,
 }) => {
   const [, setImageData] = useState<string | null>(null);
 
@@ -23,7 +23,7 @@ export const ImageTool: React.FC<ImageToolProps> = ({
             if (e.target?.result) {
               resolve(e.target.result as string);
             } else {
-              reject(new Error('Failed to read file'));
+              reject(new Error("Failed to read file"));
             }
           };
           reader.onerror = () => reject(reader.error);
@@ -33,7 +33,7 @@ export const ImageTool: React.FC<ImageToolProps> = ({
         setImageData(result);
         onImageChange?.(result);
       } catch (error) {
-        console.error('Error reading file:', error);
+        console.error("Error reading file:", error);
       }
     } else if (!file) {
       setImageData(null);
@@ -44,7 +44,7 @@ export const ImageTool: React.FC<ImageToolProps> = ({
   const toolConfig = {
     enableImageUpload: true,
     showPlaceButton: true,
-    placeButtonText: "Place Image"
+    placeButtonText: "Place Image",
   };
 
   return (
@@ -64,4 +64,4 @@ export const ImageTool: React.FC<ImageToolProps> = ({
       </Stack>
     </BaseAnnotationTool>
   );
-};
\ No newline at end of file
+};
diff --git a/frontend/src/core/components/fileEditor/AddFileCard.tsx b/frontend/src/core/components/fileEditor/AddFileCard.tsx
index c5cafd7561..7a566b032a 100644
--- a/frontend/src/core/components/fileEditor/AddFileCard.tsx
+++ b/frontend/src/core/components/fileEditor/AddFileCard.tsx
@@ -1,14 +1,14 @@
-import React, { useRef, useState } from 'react';
-import { Button, Group, useMantineColorScheme } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import AddIcon from '@mui/icons-material/Add';
-import { useFilesModalContext } from '@app/contexts/FilesModalContext';
-import LocalIcon from '@app/components/shared/LocalIcon';
-import { useLogoAssets } from '@app/hooks/useLogoAssets';
-import styles from '@app/components/fileEditor/FileEditor.module.css';
-import { useFileActionTerminology } from '@app/hooks/useFileActionTerminology';
-import { useFileActionIcons } from '@app/hooks/useFileActionIcons';
-import { openFilesFromDisk } from '@app/services/openFilesFromDisk';
+import React, { useRef, useState } from "react";
+import { Button, Group } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import AddIcon from "@mui/icons-material/Add";
+import { useFilesModalContext } from "@app/contexts/FilesModalContext";
+import LocalIcon from "@app/components/shared/LocalIcon";
+import { Wordmark } from "@app/components/shared/Wordmark";
+import styles from "@app/components/fileEditor/FileEditor.module.css";
+import { useFileActionTerminology } from "@app/hooks/useFileActionTerminology";
+import { useFileActionIcons } from "@app/hooks/useFileActionIcons";
+import { openFilesFromDisk } from "@app/services/openFilesFromDisk";
 
 interface AddFileCardProps {
   onFileSelect: (files: File[]) => void;
@@ -19,14 +19,12 @@ interface AddFileCardProps {
 const AddFileCard = ({
   onFileSelect,
   accept,
-  multiple = true
+  multiple = true,
 }: AddFileCardProps) => {
   const { t } = useTranslation();
   const fileInputRef = useRef<HTMLInputElement>(null);
   const { openFilesModal } = useFilesModalContext();
-  const { colorScheme } = useMantineColorScheme();
   const [isUploadHover, setIsUploadHover] = useState(false);
-  const { wordmark } = useLogoAssets();
   const terminology = useFileActionTerminology();
   const icons = useFileActionIcons();
 
@@ -38,7 +36,7 @@ const AddFileCard = ({
     e.stopPropagation();
     const files = await openFilesFromDisk({
       multiple,
-      onFallbackOpen: () => fileInputRef.current?.click()
+      onFallbackOpen: () => fileInputRef.current?.click(),
     });
     if (files.length > 0) {
       onFileSelect(files);
@@ -56,7 +54,7 @@ const AddFileCard = ({
       onFileSelect(files);
     }
     // Reset input so same files can be selected again
-    event.target.value = '';
+    event.target.value = "";
   };
 
   return (
@@ -67,17 +65,17 @@ const AddFileCard = ({
         accept={accept}
         multiple={multiple}
         onChange={handleFileChange}
-        style={{ display: 'none' }}
+        style={{ display: "none" }}
       />
 
       <div
         className={`${styles.addFileCard} w-[18rem] h-[22rem] select-none flex flex-col shadow-sm transition-all relative cursor-pointer`}
         tabIndex={0}
         role="button"
-        aria-label={t('fileEditor.addFiles', 'Add files')}
+        aria-label={t("fileEditor.addFiles", "Add files")}
         onClick={handleCardClick}
         onKeyDown={(e) => {
-          if (e.key === 'Enter' || e.key === ' ') {
+          if (e.key === "Enter" || e.key === " ") {
             e.preventDefault();
             handleCardClick();
           }
@@ -86,10 +84,10 @@ const AddFileCard = ({
         {/* Header bar - matches FileEditorThumbnail structure */}
         <div className={`${styles.header} ${styles.addFileHeader}`}>
           <div className={styles.logoMark}>
-            <AddIcon sx={{ color: 'inherit', fontSize: '1.5rem' }} />
+            <AddIcon sx={{ color: "inherit", fontSize: "1.5rem" }} />
           </div>
           <div className={styles.headerIndex}>
-            {t('fileEditor.addFiles', 'Add Files')}
+            {t("fileEditor.addFiles", "Add Files")}
           </div>
           <div className={styles.kebab} />
         </div>
@@ -98,75 +96,83 @@ const AddFileCard = ({
         <div className={styles.addFileContent}>
           {/* Stirling PDF Branding */}
           <Group gap="xs" align="center">
-            <img
-              src={colorScheme === 'dark' ? wordmark.white : wordmark.grey}
+            <Wordmark
               alt="Stirling PDF"
-              style={{ height: '2.2rem', width: 'auto' }}
+              muted
+              style={{ height: "2.2rem", width: "auto" }}
             />
           </Group>
 
           {/* Add Files + Native Upload Buttons - styled like LandingPage */}
           <div
             style={{
-              display: 'flex',
-              alignItems: 'center',
-              justifyContent: 'center',
-              gap: '0.6rem',
-              width: '100%',
-              marginTop: '0.8rem',
-              marginBottom: '0.8rem'
+              display: "flex",
+              alignItems: "center",
+              justifyContent: "center",
+              gap: "0.6rem",
+              width: "100%",
+              marginTop: "0.8rem",
+              marginBottom: "0.8rem",
             }}
             onMouseLeave={() => setIsUploadHover(false)}
           >
             <Button
               style={{
-                backgroundColor: 'var(--landing-button-bg)',
-                color: 'var(--landing-button-color)',
-                border: '1px solid var(--landing-button-border)',
-                borderRadius: '2rem',
-                height: '38px',
-                paddingLeft: isUploadHover ? 0 : '1rem',
-                paddingRight: isUploadHover ? 0 : '1rem',
-                width: isUploadHover ? '58px' : 'calc(100% - 58px - 0.6rem)',
-                minWidth: isUploadHover ? '58px' : undefined,
-                display: 'flex',
-                alignItems: 'center',
-                justifyContent: 'center',
-                transition: 'width .5s ease, padding .5s ease'
+                backgroundColor: "var(--landing-button-bg)",
+                color: "var(--landing-button-color)",
+                border: "1px solid var(--landing-button-border)",
+                borderRadius: "2rem",
+                height: "38px",
+                paddingLeft: isUploadHover ? 0 : "1rem",
+                paddingRight: isUploadHover ? 0 : "1rem",
+                width: isUploadHover ? "58px" : "calc(100% - 58px - 0.6rem)",
+                minWidth: isUploadHover ? "58px" : undefined,
+                display: "flex",
+                alignItems: "center",
+                justifyContent: "center",
+                transition: "width .5s ease, padding .5s ease",
               }}
               onClick={handleOpenFilesModal}
               onMouseEnter={() => setIsUploadHover(false)}
             >
-              <LocalIcon icon="add" width="1.5rem" height="1.5rem" className="text-[var(--accent-interactive)]" />
+              <LocalIcon
+                icon="add"
+                width="1.5rem"
+                height="1.5rem"
+                className="text-[var(--accent-interactive)]"
+              />
               {!isUploadHover && (
-                <span>
-                  {t('landing.addFiles', 'Add Files')}
-                </span>
+                <span>{t("landing.addFiles", "Add Files")}</span>
               )}
             </Button>
             <Button
               aria-label="Upload"
               style={{
-                backgroundColor: 'var(--landing-button-bg)',
-                color: 'var(--landing-button-color)',
-                border: '1px solid var(--landing-button-border)',
-                borderRadius: '1rem',
-                height: '38px',
-                width: isUploadHover ? 'calc(100% - 58px - 0.6rem)' : '58px',
-                minWidth: '58px',
-                paddingLeft: isUploadHover ? '1rem' : 0,
-                paddingRight: isUploadHover ? '1rem' : 0,
-                display: 'flex',
-                alignItems: 'center',
-                justifyContent: 'center',
-                transition: 'width .5s ease, padding .5s ease'
+                backgroundColor: "var(--landing-button-bg)",
+                color: "var(--landing-button-color)",
+                border: "1px solid var(--landing-button-border)",
+                borderRadius: "1rem",
+                height: "38px",
+                width: isUploadHover ? "calc(100% - 58px - 0.6rem)" : "58px",
+                minWidth: "58px",
+                paddingLeft: isUploadHover ? "1rem" : 0,
+                paddingRight: isUploadHover ? "1rem" : 0,
+                display: "flex",
+                alignItems: "center",
+                justifyContent: "center",
+                transition: "width .5s ease, padding .5s ease",
               }}
               onClick={handleNativeUploadClick}
               onMouseEnter={() => setIsUploadHover(true)}
             >
-              <LocalIcon icon={icons.uploadIconName} width="1.25rem" height="1.25rem" style={{ color: 'var(--accent-interactive)' }} />
+              <LocalIcon
+                icon={icons.uploadIconName}
+                width="1.25rem"
+                height="1.25rem"
+                style={{ color: "var(--accent-interactive)" }}
+              />
               {isUploadHover && (
-                <span style={{ marginLeft: '.5rem' }}>
+                <span style={{ marginLeft: ".5rem" }}>
                   {terminology.uploadFromComputer}
                 </span>
               )}
@@ -176,7 +182,11 @@ const AddFileCard = ({
           {/* Instruction Text */}
           <span
             className="text-[var(--accent-interactive)]"
-            style={{ fontSize: '.8rem', textAlign: 'center', marginTop: '0.5rem' }}
+            style={{
+              fontSize: ".8rem",
+              textAlign: "center",
+              marginTop: "0.5rem",
+            }}
           >
             {terminology.dropFilesHere}
           </span>
diff --git a/frontend/src/core/components/fileEditor/FileEditor.module.css b/frontend/src/core/components/fileEditor/FileEditor.module.css
index 4f26c8bce5..43ef0d1af9 100644
--- a/frontend/src/core/components/fileEditor/FileEditor.module.css
+++ b/frontend/src/core/components/fileEditor/FileEditor.module.css
@@ -6,7 +6,10 @@
   background: var(--file-card-bg);
   border-radius: 0.0625rem;
   cursor: pointer;
-  transition: box-shadow 0.18s ease, outline-color 0.18s ease, transform 0.18s ease;
+  transition:
+    box-shadow 0.18s ease,
+    outline-color 0.18s ease,
+    transform 0.18s ease;
   max-width: 100%;
   max-height: 100%;
   overflow: visible;
@@ -45,8 +48,8 @@
 }
 
 .headerResting {
-  background: #3B4B6E; /* dark blue for unselected in light mode */
-  color: #FFFFFF;
+  background: #3b4b6e; /* dark blue for unselected in light mode */
+  color: #ffffff;
   border-bottom: 1px solid var(--border-default);
 }
 
@@ -66,7 +69,7 @@
 /* Unsupported (but not errored) header appearance */
 .headerUnsupported {
   background: var(--unsupported-bar-bg); /* neutral gray */
-  color: #FFFFFF;
+  color: #ffffff;
   border-bottom: 1px solid var(--unsupported-bar-border);
 }
 
@@ -103,7 +106,7 @@
 }
 
 .headerIconButton {
-  color: #FFFFFF !important;
+  color: #ffffff !important;
 }
 
 /* Menu dropdown */
@@ -226,14 +229,13 @@
 }
 
 .pinned {
-  color: #FFC107 !important;
+  color: #ffc107 !important;
 }
 
-
 /* Unsupported file indicator */
 .unsupportedPill {
   margin-left: 1.75rem;
-  background: #6B7280;
+  background: #6b7280;
   color: white;
   padding: 4px 8px;
   border-radius: 12px;
@@ -264,7 +266,8 @@
 
 /* Animations */
 @keyframes pulse {
-  0%, 100% {
+  0%,
+  100% {
     opacity: 1;
   }
   50% {
@@ -288,15 +291,15 @@
    DARK MODE OVERRIDES
    ========================= */
 :global([data-mantine-color-scheme="dark"]) .card {
-  outline-color: #3A4047; /* deselected stroke */
+  outline-color: #3a4047; /* deselected stroke */
 }
 
 :global([data-mantine-color-scheme="dark"]) .card[data-selected="true"] {
-  outline-color: #4B525A; /* selected stroke (subtle grey) */
+  outline-color: #4b525a; /* selected stroke (subtle grey) */
 }
 
 :global([data-mantine-color-scheme="dark"]) .headerResting {
-  background: #1F2329; /* requested default unselected color */
+  background: #1f2329; /* requested default unselected color */
   color: var(--tool-header-text); /* #D0D6DC */
   border-bottom-color: var(--tool-header-border); /* #3A4047 */
 }
@@ -308,16 +311,16 @@
 }
 
 :global([data-mantine-color-scheme="dark"]) .title {
-  color: #D0D6DC; /* title text */
+  color: #d0d6dc; /* title text */
 }
 
 :global([data-mantine-color-scheme="dark"]) .meta {
-  color: #6B7280; /* subtitle text */
+  color: #6b7280; /* subtitle text */
 }
 
 /* Light mode selected header stroke override */
 :global([data-mantine-color-scheme="light"]) .card[data-selected="true"] {
-  outline-color: #3B4B6E;
+  outline-color: #3b4b6e;
 }
 
 /* =========================
diff --git a/frontend/src/core/components/fileEditor/FileEditor.tsx b/frontend/src/core/components/fileEditor/FileEditor.tsx
index eac0cca7fc..c24f632b38 100644
--- a/frontend/src/core/components/fileEditor/FileEditor.tsx
+++ b/frontend/src/core/components/fileEditor/FileEditor.tsx
@@ -1,22 +1,26 @@
-import { useState, useCallback, useRef, useMemo, useEffect } from 'react';
+import { useState, useCallback, useRef, useMemo, useEffect } from "react";
+import { flushSync } from "react-dom";
+import { Text, Center, Box, LoadingOverlay, Stack } from "@mantine/core";
+import { Dropzone } from "@mantine/dropzone";
 import {
-  Text, Center, Box, LoadingOverlay, Stack
-} from '@mantine/core';
-import { Dropzone } from '@mantine/dropzone';
-import { useFileSelection, useFileState, useFileManagement, useFileActions, useFileContext } from '@app/contexts/FileContext';
-import { useNavigationActions } from '@app/contexts/NavigationContext';
-import { useViewer } from '@app/contexts/ViewerContext';
-import { zipFileService } from '@app/services/zipFileService';
-import { detectFileExtension } from '@app/utils/fileUtils';
-import FileEditorThumbnail from '@app/components/fileEditor/FileEditorThumbnail';
-import AddFileCard from '@app/components/fileEditor/AddFileCard';
-import FilePickerModal from '@app/components/shared/FilePickerModal';
-import { FileId, StirlingFile } from '@app/types/fileContext';
-import { alert } from '@app/components/toast';
-import { downloadFile } from '@app/services/downloadService';
-import { useFileEditorRightRailButtons } from '@app/components/fileEditor/fileEditorRightRailButtons';
-import { useToolWorkflow } from '@app/contexts/ToolWorkflowContext';
-
+  useFileSelection,
+  useFileState,
+  useFileManagement,
+  useFileActions,
+  useFileContext,
+} from "@app/contexts/FileContext";
+import { useNavigationActions } from "@app/contexts/NavigationContext";
+import { useViewer } from "@app/contexts/ViewerContext";
+import { zipFileService } from "@app/services/zipFileService";
+import { detectFileExtension } from "@app/utils/fileUtils";
+import FileEditorThumbnail from "@app/components/fileEditor/FileEditorThumbnail";
+import AddFileCard from "@app/components/fileEditor/AddFileCard";
+import FilePickerModal from "@app/components/shared/FilePickerModal";
+import { FileId, StirlingFile } from "@app/types/fileContext";
+import { alert } from "@app/components/toast";
+import { downloadFile } from "@app/services/downloadService";
+import { useFileEditorRightRailButtons } from "@app/components/fileEditor/fileEditorRightRailButtons";
+import { useToolWorkflow } from "@app/contexts/ToolWorkflowContext";
 
 interface FileEditorProps {
   onOpenPageEditor?: () => void;
@@ -27,14 +31,16 @@ interface FileEditorProps {
 
 const FileEditor = ({
   toolMode = false,
-  supportedExtensions = ["pdf"]
+  supportedExtensions = ["pdf"],
 }: FileEditorProps) => {
-
   // Utility function to check if a file extension is supported
-  const isFileSupported = useCallback((fileName: string): boolean => {
-    const extension = detectFileExtension(fileName);
-    return extension ? supportedExtensions.includes(extension) : false;
-  }, [supportedExtensions]);
+  const isFileSupported = useCallback(
+    (fileName: string): boolean => {
+      const extension = detectFileExtension(fileName);
+      return extension ? supportedExtensions.includes(extension) : false;
+    },
+    [supportedExtensions],
+  );
 
   // Use optimized FileContext hooks
   const { state, selectors } = useFileState();
@@ -44,7 +50,10 @@ const FileEditor = ({
   const { clearAllFileErrors } = fileContextActions;
 
   // Extract needed values from state (memoized to prevent infinite loops)
-  const activeStirlingFileStubs = useMemo(() => selectors.getStirlingFileStubs(), [state.files.byId, state.files.ids]);
+  const activeStirlingFileStubs = useMemo(
+    () => selectors.getStirlingFileStubs(),
+    [state.files.byId, state.files.ids],
+  );
   const selectedFileIds = state.ui.selectedFileIds;
   const totalItems = state.files.ids.length;
   const selectedCount = selectedFileIds.length;
@@ -52,8 +61,8 @@ const FileEditor = ({
   // Get navigation actions
   const { actions: navActions } = useNavigationActions();
 
-  // Get viewer context for setting active file index
-  const { setActiveFileIndex } = useViewer();
+  // Get viewer context for setting active file index and ID
+  const { setActiveFileIndex, setActiveFileId } = useViewer();
 
   // Get file selection context
   const { setSelectedFiles } = useFileSelection();
@@ -62,11 +71,27 @@ const FileEditor = ({
   const [_error, _setError] = useState<string | null>(null);
 
   // Toast helpers
-  const showStatus = useCallback((message: string, type: 'neutral' | 'success' | 'warning' | 'error' = 'neutral') => {
-    alert({ alertType: type, title: message, expandable: false, durationMs: 4000 });
-  }, []);
+  const showStatus = useCallback(
+    (
+      message: string,
+      type: "neutral" | "success" | "warning" | "error" = "neutral",
+    ) => {
+      alert({
+        alertType: type,
+        title: message,
+        expandable: false,
+        durationMs: 4000,
+      });
+    },
+    [],
+  );
   const showError = useCallback((message: string) => {
-    alert({ alertType: 'error', title: 'Error', body: message, expandable: true });
+    alert({
+      alertType: "error",
+      title: "Error",
+      body: message,
+      expandable: true,
+    });
   }, []);
   const [selectionMode, setSelectionMode] = useState(toolMode);
 
@@ -76,7 +101,7 @@ const FileEditor = ({
   // Compute effective max allowed files based on the active tool and mode
   const maxAllowed = useMemo<number>(() => {
     const rawMax = selectedTool?.maxFiles;
-    return (!toolMode || rawMax == null || rawMax < 0) ? Infinity : rawMax;
+    return !toolMode || rawMax == null || rawMax < 0 ? Infinity : rawMax;
   }, [selectedTool?.maxFiles, toolMode]);
 
   // Enable selection mode automatically in tool mode
@@ -87,7 +112,9 @@ const FileEditor = ({
   }, [toolMode]);
   const [showFilePickerModal, setShowFilePickerModal] = useState(false);
   // Get selected file IDs from context (defensive programming)
-  const contextSelectedIds = Array.isArray(selectedFileIds) ? selectedFileIds : [];
+  const contextSelectedIds = Array.isArray(selectedFileIds)
+    ? selectedFileIds
+    : [];
 
   // Create refs for frequently changing values to stabilize callbacks
   const contextSelectedIdsRef = useRef<FileId[]>([]);
@@ -99,13 +126,15 @@ const FileEditor = ({
   const handleSelectAllFiles = useCallback(() => {
     // Respect maxAllowed: if limited, select the last N files
     const allIds = state.files.ids;
-    const idsToSelect = Number.isFinite(maxAllowed) ? allIds.slice(-maxAllowed) : allIds;
+    const idsToSelect = Number.isFinite(maxAllowed)
+      ? allIds.slice(-maxAllowed)
+      : allIds;
     setSelectedFiles(idsToSelect);
     try {
       clearAllFileErrors();
     } catch (error) {
-      if (process.env.NODE_ENV === 'development') {
-        console.warn('Failed to clear file errors on select all:', error);
+      if (process.env.NODE_ENV === "development") {
+        console.warn("Failed to clear file errors on select all:", error);
       }
     }
   }, [state.files.ids, setSelectedFiles, clearAllFileErrors, maxAllowed]);
@@ -115,8 +144,8 @@ const FileEditor = ({
     try {
       clearAllFileErrors();
     } catch (error) {
-      if (process.env.NODE_ENV === 'development') {
-        console.warn('Failed to clear file errors on deselect:', error);
+      if (process.env.NODE_ENV === "development") {
+        console.warn("Failed to clear file errors on deselect:", error);
       }
     }
   }, [setSelectedFiles, clearAllFileErrors]);
@@ -137,69 +166,88 @@ const FileEditor = ({
 
   // Process uploaded files using context
   // ZIP extraction is now handled automatically in FileContext based on user preferences
-  const handleFileUpload = useCallback(async (uploadedFiles: File[]) => {
-    _setError(null);
+  const handleFileUpload = useCallback(
+    async (uploadedFiles: File[]) => {
+      _setError(null);
 
-    try {
-      if (uploadedFiles.length > 0) {
-        // FileContext will automatically handle ZIP extraction based on user preferences
-        // - Respects autoUnzip setting
-        // - Respects autoUnzipFileLimit
-        // - HTML ZIPs stay intact
-        // - Non-ZIP files pass through unchanged
-        await addFiles(uploadedFiles, { selectFiles: true });
-        // After auto-selection, enforce maxAllowed if needed
-        if (Number.isFinite(maxAllowed)) {
-          const nowSelectedIds = selectors.getSelectedStirlingFileStubs().map(r => r.id);
-          if (nowSelectedIds.length > maxAllowed) {
-            setSelectedFiles(nowSelectedIds.slice(-maxAllowed));
+      try {
+        if (uploadedFiles.length > 0) {
+          // FileContext will automatically handle ZIP extraction based on user preferences
+          // - Respects autoUnzip setting
+          // - Respects autoUnzipFileLimit
+          // - HTML ZIPs stay intact
+          // - Non-ZIP files pass through unchanged
+          await addFiles(uploadedFiles, { selectFiles: true });
+          // After auto-selection, enforce maxAllowed if needed
+          if (Number.isFinite(maxAllowed)) {
+            const nowSelectedIds = selectors
+              .getSelectedStirlingFileStubs()
+              .map((r) => r.id);
+            if (nowSelectedIds.length > maxAllowed) {
+              setSelectedFiles(nowSelectedIds.slice(-maxAllowed));
+            }
+          }
+          showStatus(`Added ${uploadedFiles.length} file(s)`, "success");
+        }
+      } catch (err) {
+        const errorMessage =
+          err instanceof Error ? err.message : "Failed to process files";
+        showError(errorMessage);
+        console.error("File processing error:", err);
+      }
+    },
+    [addFiles, showStatus, showError, selectors, maxAllowed, setSelectedFiles],
+  );
+
+  const toggleFile = useCallback(
+    (fileId: FileId) => {
+      const currentSelectedIds = contextSelectedIdsRef.current;
+
+      const targetRecord = activeStirlingFileStubs.find((r) => r.id === fileId);
+      if (!targetRecord) return;
+
+      const contextFileId = fileId; // No need to create a new ID
+      const isSelected = currentSelectedIds.includes(contextFileId);
+
+      let newSelection: FileId[];
+
+      if (isSelected) {
+        // Remove file from selection
+        newSelection = currentSelectedIds.filter((id) => id !== contextFileId);
+      } else {
+        // Add file to selection
+        // Determine max files allowed from the active tool (negative or undefined means unlimited)
+        const rawMax = selectedTool?.maxFiles;
+        const maxAllowed =
+          !toolMode || rawMax == null || rawMax < 0 ? Infinity : rawMax;
+
+        if (maxAllowed === 1) {
+          // Only one file allowed -> replace selection with the new file
+          newSelection = [contextFileId];
+        } else {
+          // If at capacity, drop the oldest selected and append the new one
+          if (
+            Number.isFinite(maxAllowed) &&
+            currentSelectedIds.length >= maxAllowed
+          ) {
+            newSelection = [...currentSelectedIds.slice(1), contextFileId];
+          } else {
+            newSelection = [...currentSelectedIds, contextFileId];
           }
         }
-        showStatus(`Added ${uploadedFiles.length} file(s)`, 'success');
       }
-    } catch (err) {
-      const errorMessage = err instanceof Error ? err.message : 'Failed to process files';
-      showError(errorMessage);
-      console.error('File processing error:', err);
-    }
-  }, [addFiles, showStatus, showError, selectors, maxAllowed, setSelectedFiles]);
 
-  const toggleFile = useCallback((fileId: FileId) => {
-    const currentSelectedIds = contextSelectedIdsRef.current;
-
-    const targetRecord = activeStirlingFileStubs.find(r => r.id === fileId);
-    if (!targetRecord) return;
-
-    const contextFileId = fileId; // No need to create a new ID
-    const isSelected = currentSelectedIds.includes(contextFileId);
-
-    let newSelection: FileId[];
-
-    if (isSelected) {
-      // Remove file from selection
-      newSelection = currentSelectedIds.filter(id => id !== contextFileId);
-    } else {
-      // Add file to selection
-      // Determine max files allowed from the active tool (negative or undefined means unlimited)
-      const rawMax = selectedTool?.maxFiles;
-      const maxAllowed = (!toolMode || rawMax == null || rawMax < 0) ? Infinity : rawMax;
-
-      if (maxAllowed === 1) {
-        // Only one file allowed -> replace selection with the new file
-        newSelection = [contextFileId];
-      } else {
-        // If at capacity, drop the oldest selected and append the new one
-        if (Number.isFinite(maxAllowed) && currentSelectedIds.length >= maxAllowed) {
-          newSelection = [...currentSelectedIds.slice(1), contextFileId];
-        } else {
-          newSelection = [...currentSelectedIds, contextFileId];
-        }
-      }
-    }
-
-    // Update context (this automatically updates tool selection since they use the same action)
-    setSelectedFiles(newSelection);
-  }, [setSelectedFiles, toolMode, _setStatus, activeStirlingFileStubs, selectedTool?.maxFiles]);
+      // Update context (this automatically updates tool selection since they use the same action)
+      setSelectedFiles(newSelection);
+    },
+    [
+      setSelectedFiles,
+      toolMode,
+      _setStatus,
+      activeStirlingFileStubs,
+      selectedTool?.maxFiles,
+    ],
+  );
 
   // Enforce maxAllowed when tool changes or when an external action sets too many selected files
   useEffect(() => {
@@ -208,155 +256,212 @@ const FileEditor = ({
     }
   }, [maxAllowed, selectedFileIds, setSelectedFiles]);
 
-
   // File reordering handler for drag and drop
-  const handleReorderFiles = useCallback((sourceFileId: FileId, targetFileId: FileId, selectedFileIds: FileId[]) => {
-    const currentIds = activeStirlingFileStubs.map(r => r.id);
+  const handleReorderFiles = useCallback(
+    (sourceFileId: FileId, targetFileId: FileId, selectedFileIds: FileId[]) => {
+      const currentIds = activeStirlingFileStubs.map((r) => r.id);
 
-    // Find indices
-    const sourceIndex = currentIds.findIndex(id => id === sourceFileId);
-    const targetIndex = currentIds.findIndex(id => id === targetFileId);
+      // Find indices
+      const sourceIndex = currentIds.findIndex((id) => id === sourceFileId);
+      const targetIndex = currentIds.findIndex((id) => id === targetFileId);
 
-    if (sourceIndex === -1 || targetIndex === -1) {
-      console.warn('Could not find source or target file for reordering');
-      return;
-    }
-
-    // Handle multi-file selection reordering
-    const filesToMove = selectedFileIds.length > 1
-      ? selectedFileIds.filter(id => currentIds.includes(id))
-      : [sourceFileId];
-
-    // Create new order
-    const newOrder = [...currentIds];
-
-    // Remove files to move from their current positions (in reverse order to maintain indices)
-    const sourceIndices = filesToMove.map(id => newOrder.findIndex(nId => nId === id))
-      .sort((a, b) => b - a); // Sort descending
-
-    sourceIndices.forEach(index => {
-      newOrder.splice(index, 1);
-    });
-
-    // Calculate insertion index after removals
-    let insertIndex = newOrder.findIndex(id => id === targetFileId);
-    if (insertIndex !== -1) {
-      // Determine if moving forward or backward
-      const isMovingForward = sourceIndex < targetIndex;
-      if (isMovingForward) {
-        // Moving forward: insert after target
-        insertIndex += 1;
-      } else {
-        // Moving backward: insert before target (insertIndex already correct)
+      if (sourceIndex === -1 || targetIndex === -1) {
+        console.warn("Could not find source or target file for reordering");
+        return;
       }
-    } else {
-      // Target was moved, insert at end
-      insertIndex = newOrder.length;
-    }
 
-    // Insert files at the calculated position
-    newOrder.splice(insertIndex, 0, ...filesToMove);
+      // Handle multi-file selection reordering
+      const filesToMove =
+        selectedFileIds.length > 1
+          ? selectedFileIds.filter((id) => currentIds.includes(id))
+          : [sourceFileId];
 
-    // Update file order
-    reorderFiles(newOrder);
+      // Create new order
+      const newOrder = [...currentIds];
 
-    // Update status
-    const moveCount = filesToMove.length;
-    showStatus(`${moveCount > 1 ? `${moveCount} files` : 'File'} reordered`);
-  }, [activeStirlingFileStubs, reorderFiles, _setStatus]);
+      // Remove files to move from their current positions (in reverse order to maintain indices)
+      const sourceIndices = filesToMove
+        .map((id) => newOrder.findIndex((nId) => nId === id))
+        .sort((a, b) => b - a); // Sort descending
 
+      sourceIndices.forEach((index) => {
+        newOrder.splice(index, 1);
+      });
 
+      // Calculate insertion index after removals
+      let insertIndex = newOrder.findIndex((id) => id === targetFileId);
+      if (insertIndex !== -1) {
+        // Determine if moving forward or backward
+        const isMovingForward = sourceIndex < targetIndex;
+        if (isMovingForward) {
+          // Moving forward: insert after target
+          insertIndex += 1;
+        } else {
+          // Moving backward: insert before target (insertIndex already correct)
+        }
+      } else {
+        // Target was moved, insert at end
+        insertIndex = newOrder.length;
+      }
+
+      // Insert files at the calculated position
+      newOrder.splice(insertIndex, 0, ...filesToMove);
+
+      // Animate the reorder using the View Transitions API where available.
+      // Each FileEditorThumbnail carries a stable `view-transition-name`, so
+      // the browser snapshots each card before and after the DOM reorder and
+      // interpolates the positions automatically. `flushSync` forces React to
+      // apply the reorderFiles dispatch synchronously inside the transition
+      // callback so the BEFORE/AFTER snapshots capture the correct frames.
+      const applyReorder = () => reorderFiles(newOrder);
+      const docWithViewTransition = document as Document & {
+        startViewTransition?: (cb: () => void) => unknown;
+      };
+      if (typeof docWithViewTransition.startViewTransition === "function") {
+        docWithViewTransition.startViewTransition(() => {
+          flushSync(applyReorder);
+        });
+      } else {
+        applyReorder();
+      }
+
+      // Update status
+      const moveCount = filesToMove.length;
+      showStatus(`${moveCount > 1 ? `${moveCount} files` : "File"} reordered`);
+    },
+    [activeStirlingFileStubs, reorderFiles, _setStatus],
+  );
 
   // File operations using context
-  const handleCloseFile = useCallback((fileId: FileId) => {
-    const record = activeStirlingFileStubs.find(r => r.id === fileId);
-    const file = record ? selectors.getFile(record.id) : null;
-    if (record && file) {
-      // Remove file from context but keep in storage (close, don't delete)
-      const contextFileId = record.id;
-      removeFiles([contextFileId], false);
+  const handleCloseFile = useCallback(
+    (fileId: FileId) => {
+      const record = activeStirlingFileStubs.find((r) => r.id === fileId);
+      const file = record ? selectors.getFile(record.id) : null;
+      if (record && file) {
+        // Remove file from context but keep in storage (close, don't delete)
+        const contextFileId = record.id;
+        removeFiles([contextFileId], false);
 
-      // Remove from context selections
-      const currentSelected = selectedFileIds.filter(id => id !== contextFileId);
-      setSelectedFiles(currentSelected);
-    }
-  }, [activeStirlingFileStubs, selectors, removeFiles, setSelectedFiles, selectedFileIds]);
-
-  const handleDownloadFile = useCallback(async (fileId: FileId) => {
-    const record = activeStirlingFileStubs.find(r => r.id === fileId);
-    const file = record ? selectors.getFile(record.id) : null;
-    console.log('[FileEditor] handleDownloadFile called:', { fileId, hasRecord: !!record, hasFile: !!file, localFilePath: record?.localFilePath, isDirty: record?.isDirty });
-    if (record && file) {
-      const result = await downloadFile({
-        data: file,
-        filename: file.name,
-        localPath: record.localFilePath
-      });
-      console.log('[FileEditor] Download complete, checking dirty state:', { localFilePath: record.localFilePath, isDirty: record.isDirty, savedPath: result.savedPath });
-      // Mark file as clean after successful save to disk
-      if (result.savedPath) {
-        console.log('[FileEditor] Marking file as clean:', fileId);
-        fileActions.updateStirlingFileStub(fileId, {
-          localFilePath: record.localFilePath ?? result.savedPath,
-          isDirty: false
-        });
-      } else {
-        console.log('[FileEditor] Skipping clean mark:', { savedPath: result.savedPath, isDirty: record.isDirty });
+        // Remove from context selections
+        const currentSelected = selectedFileIds.filter(
+          (id) => id !== contextFileId,
+        );
+        setSelectedFiles(currentSelected);
       }
-    }
-  }, [activeStirlingFileStubs, selectors, fileActions]);
+    },
+    [
+      activeStirlingFileStubs,
+      selectors,
+      removeFiles,
+      setSelectedFiles,
+      selectedFileIds,
+    ],
+  );
 
-  const handleUnzipFile = useCallback(async (fileId: FileId) => {
-    const record = activeStirlingFileStubs.find(r => r.id === fileId);
-    const file = record ? selectors.getFile(record.id) : null;
-    if (record && file) {
-      try {
-        // Extract and store files using shared service method
-        const result = await zipFileService.extractAndStoreFilesWithHistory(file, record);
-
-        if (result.success && result.extractedStubs.length > 0) {
-          // Add extracted file stubs to FileContext
-          await fileActions.addStirlingFileStubs(result.extractedStubs);
-
-          // Remove the original ZIP file
-          removeFiles([fileId], false);
-
-          alert({
-            alertType: 'success',
-            title: `Extracted ${result.extractedStubs.length} file(s) from ${file.name}`,
-            expandable: false,
-            durationMs: 3500
+  const handleDownloadFile = useCallback(
+    async (fileId: FileId) => {
+      const record = activeStirlingFileStubs.find((r) => r.id === fileId);
+      const file = record ? selectors.getFile(record.id) : null;
+      console.log("[FileEditor] handleDownloadFile called:", {
+        fileId,
+        hasRecord: !!record,
+        hasFile: !!file,
+        localFilePath: record?.localFilePath,
+        isDirty: record?.isDirty,
+      });
+      if (record && file) {
+        const result = await downloadFile({
+          data: file,
+          filename: file.name,
+          localPath: record.localFilePath,
+        });
+        console.log("[FileEditor] Download complete, checking dirty state:", {
+          localFilePath: record.localFilePath,
+          isDirty: record.isDirty,
+          savedPath: result.savedPath,
+        });
+        // Mark file as clean after successful save to disk
+        if (result.savedPath) {
+          console.log("[FileEditor] Marking file as clean:", fileId);
+          fileActions.updateStirlingFileStub(fileId, {
+            localFilePath: record.localFilePath ?? result.savedPath,
+            isDirty: false,
           });
         } else {
-          alert({
-            alertType: 'error',
-            title: `Failed to extract files from ${file.name}`,
-            body: result.errors.join('\n'),
-            expandable: true,
-            durationMs: 3500
+          console.log("[FileEditor] Skipping clean mark:", {
+            savedPath: result.savedPath,
+            isDirty: record.isDirty,
           });
         }
-      } catch (error) {
-        console.error('Failed to unzip file:', error);
-        alert({
-          alertType: 'error',
-          title: `Error unzipping ${file.name}`,
-          expandable: false,
-          durationMs: 3500
-        });
       }
-    }
-  }, [activeStirlingFileStubs, selectors, fileActions, removeFiles]);
+    },
+    [activeStirlingFileStubs, selectors, fileActions],
+  );
 
-  const handleViewFile = useCallback((fileId: FileId) => {
-    const index = activeStirlingFileStubs.findIndex(r => r.id === fileId);
-    if (index !== -1) {
-      // Set the file as selected in context, sync the viewer index, and switch to viewer
-      setSelectedFiles([fileId]);
-      setActiveFileIndex(index);
-      navActions.setWorkbench('viewer');
-    }
-  }, [activeStirlingFileStubs, setSelectedFiles, setActiveFileIndex, navActions.setWorkbench]);
+  const handleUnzipFile = useCallback(
+    async (fileId: FileId) => {
+      const record = activeStirlingFileStubs.find((r) => r.id === fileId);
+      const file = record ? selectors.getFile(record.id) : null;
+      if (record && file) {
+        try {
+          // Extract and store files using shared service method
+          const result = await zipFileService.extractAndStoreFilesWithHistory(
+            file,
+            record,
+          );
+
+          if (result.success && result.extractedStubs.length > 0) {
+            // Add extracted file stubs to FileContext
+            await fileActions.addStirlingFileStubs(result.extractedStubs);
+
+            // Remove the original ZIP file
+            removeFiles([fileId], false);
+
+            alert({
+              alertType: "success",
+              title: `Extracted ${result.extractedStubs.length} file(s) from ${file.name}`,
+              expandable: false,
+              durationMs: 3500,
+            });
+          } else {
+            alert({
+              alertType: "error",
+              title: `Failed to extract files from ${file.name}`,
+              body: result.errors.join("\n"),
+              expandable: true,
+              durationMs: 3500,
+            });
+          }
+        } catch (error) {
+          console.error("Failed to unzip file:", error);
+          alert({
+            alertType: "error",
+            title: `Error unzipping ${file.name}`,
+            expandable: false,
+            durationMs: 3500,
+          });
+        }
+      }
+    },
+    [activeStirlingFileStubs, selectors, fileActions, removeFiles],
+  );
+
+  const handleViewFile = useCallback(
+    (fileId: FileId) => {
+      const index = activeStirlingFileStubs.findIndex((r) => r.id === fileId);
+      if (index !== -1) {
+        setActiveFileId(fileId as string);
+        setActiveFileIndex(index);
+        navActions.setWorkbench("viewer");
+      }
+    },
+    [
+      activeStirlingFileStubs,
+      setActiveFileId,
+      setActiveFileIndex,
+      navActions.setWorkbench,
+    ],
+  );
 
   const handleLoadFromStorage = useCallback(async (selectedFiles: File[]) => {
     if (selectedFiles.length === 0) return;
@@ -366,91 +471,91 @@ const FileEditor = ({
       // The files are already in FileContext, just need to add them to active files
       showStatus(`Loaded ${selectedFiles.length} files from storage`);
     } catch (err) {
-      console.error('Error loading files from storage:', err);
-      showError('Failed to load some files from storage');
+      console.error("Error loading files from storage:", err);
+      showError("Failed to load some files from storage");
     }
   }, []);
 
-
   return (
     <Dropzone
       onDrop={handleFileUpload}
       multiple={true}
       maxSize={2 * 1024 * 1024 * 1024}
       style={{
-        border: 'none',
+        border: "none",
         borderRadius: 0,
-        backgroundColor: 'transparent'
+        backgroundColor: "transparent",
       }}
       activateOnClick={false}
       activateOnDrag={true}
     >
-      <Box pos="relative" style={{ overflow: 'auto' }}>
+      <Box pos="relative" style={{ overflow: "auto" }}>
         <LoadingOverlay visible={state.ui.isProcessing} />
 
         <Box p="md">
-
-
-        {activeStirlingFileStubs.length === 0 ? (
-          <Center h="60vh">
-            <Stack align="center" gap="md">
-              <Text size="lg" c="dimmed">�</Text>
-              <Text c="dimmed">No files loaded</Text>
-              <Text size="sm" c="dimmed">Upload PDF files, ZIP archives, or load from storage to get started</Text>
-            </Stack>
-          </Center>
-        ) : (
-          <div
-            style={{
-              display: 'grid',
-              gridTemplateColumns: 'repeat(auto-fill, minmax(320px, 1fr))',
-              rowGap: '1.5rem',
-              padding: '1rem',
-              pointerEvents: 'auto'
-            }}
-          >
-            {/* Add File Card - only show when files exist */}
-            {activeStirlingFileStubs.length > 0 && (
-              <AddFileCard
-                key="add-file-card"
-                onFileSelect={handleFileUpload}
-              />
-            )}
-
-            {activeStirlingFileStubs.map((record, index) => {
-              return (
-                <FileEditorThumbnail
-                  key={record.id}
-                  file={record}
-                  index={index}
-                  totalFiles={activeStirlingFileStubs.length}
-                  selectedFiles={localSelectedIds}
-                  selectionMode={selectionMode}
-                  onToggleFile={toggleFile}
-                  onCloseFile={handleCloseFile}
-                  onViewFile={handleViewFile}
-                  _onSetStatus={showStatus}
-                  onReorderFiles={handleReorderFiles}
-                  onDownloadFile={handleDownloadFile}
-                  onUnzipFile={handleUnzipFile}
-                  toolMode={toolMode}
-                  isSupported={isFileSupported(record.name)}
+          {activeStirlingFileStubs.length === 0 ? (
+            <Center h="60vh">
+              <Stack align="center" gap="md">
+                <Text size="lg" c="dimmed">
+                  �
+                </Text>
+                <Text c="dimmed">No files loaded</Text>
+                <Text size="sm" c="dimmed">
+                  Upload PDF files, ZIP archives, or load from storage to get
+                  started
+                </Text>
+              </Stack>
+            </Center>
+          ) : (
+            <div
+              style={{
+                display: "grid",
+                gridTemplateColumns: "repeat(auto-fill, minmax(320px, 1fr))",
+                rowGap: "1.5rem",
+                padding: "1rem",
+                pointerEvents: "auto",
+              }}
+            >
+              {/* Add File Card - only show when files exist */}
+              {activeStirlingFileStubs.length > 0 && (
+                <AddFileCard
+                  key="add-file-card"
+                  onFileSelect={handleFileUpload}
                 />
-              );
-            })}
-          </div>
-        )}
-      </Box>
-
-      {/* File Picker Modal */}
-      <FilePickerModal
-        opened={showFilePickerModal}
-        onClose={() => setShowFilePickerModal(false)}
-        storedFiles={[]} // FileEditor doesn't have access to stored files, needs to be passed from parent
-        onSelectFiles={handleLoadFromStorage}
-      />
+              )}
 
+              {activeStirlingFileStubs.map((record, index) => {
+                return (
+                  <FileEditorThumbnail
+                    key={record.id}
+                    file={record}
+                    index={index}
+                    totalFiles={activeStirlingFileStubs.length}
+                    selectedFiles={localSelectedIds}
+                    selectionMode={selectionMode}
+                    onToggleFile={toggleFile}
+                    onCloseFile={handleCloseFile}
+                    onViewFile={handleViewFile}
+                    _onSetStatus={showStatus}
+                    onReorderFiles={handleReorderFiles}
+                    onDownloadFile={handleDownloadFile}
+                    onUnzipFile={handleUnzipFile}
+                    toolMode={toolMode}
+                    isSupported={isFileSupported(record.name)}
+                  />
+                );
+              })}
+            </div>
+          )}
+        </Box>
 
+        {/* File Picker Modal */}
+        <FilePickerModal
+          opened={showFilePickerModal}
+          onClose={() => setShowFilePickerModal(false)}
+          storedFiles={[]} // FileEditor doesn't have access to stored files, needs to be passed from parent
+          onSelectFiles={handleLoadFromStorage}
+        />
       </Box>
     </Dropzone>
   );
diff --git a/frontend/src/core/components/fileEditor/FileEditorFileName.tsx b/frontend/src/core/components/fileEditor/FileEditorFileName.tsx
index a3e4cd4493..b526e85613 100644
--- a/frontend/src/core/components/fileEditor/FileEditorFileName.tsx
+++ b/frontend/src/core/components/fileEditor/FileEditorFileName.tsx
@@ -1,6 +1,6 @@
-import React from 'react';
-import { StirlingFileStub } from '@app/types/fileContext';
-import { PrivateContent } from '@app/components/shared/PrivateContent';
+import React from "react";
+import { StirlingFileStub } from "@app/types/fileContext";
+import { PrivateContent } from "@app/components/shared/PrivateContent";
 
 interface FileEditorFileNameProps {
   file: StirlingFileStub;
diff --git a/frontend/src/core/components/fileEditor/FileEditorThumbnail.tsx b/frontend/src/core/components/fileEditor/FileEditorThumbnail.tsx
index 2af8a87ab6..81ea1d27d3 100644
--- a/frontend/src/core/components/fileEditor/FileEditorThumbnail.tsx
+++ b/frontend/src/core/components/fileEditor/FileEditorThumbnail.tsx
@@ -1,38 +1,51 @@
-import React, { useState, useCallback, useRef, useMemo } from 'react';
-import { Text, ActionIcon, CheckboxIndicator, Tooltip, Modal, Button, Group, Stack, Loader } from '@mantine/core';
-import { useIsMobile } from '@app/hooks/useIsMobile';
-import { alert } from '@app/components/toast';
-import { useTranslation } from 'react-i18next';
-import { useFileActionTerminology } from '@app/hooks/useFileActionTerminology';
-import { useFileActionIcons } from '@app/hooks/useFileActionIcons';
-import CloseIcon from '@mui/icons-material/Close';
-import VisibilityIcon from '@mui/icons-material/Visibility';
-import UnarchiveIcon from '@mui/icons-material/Unarchive';
-import CloudUploadIcon from '@mui/icons-material/CloudUpload';
-import LinkIcon from '@mui/icons-material/Link';
-import PushPinIcon from '@mui/icons-material/PushPin';
-import PushPinOutlinedIcon from '@mui/icons-material/PushPinOutlined';
-import LockOpenIcon from '@mui/icons-material/LockOpen';
-import DragIndicatorIcon from '@mui/icons-material/DragIndicator';
-import { draggable, dropTargetForElements } from '@atlaskit/pragmatic-drag-and-drop/element/adapter';
-import { StirlingFileStub } from '@app/types/fileContext';
-import { zipFileService } from '@app/services/zipFileService';
-
-import styles from '@app/components/fileEditor/FileEditor.module.css';
-import { useFileContext } from '@app/contexts/FileContext';
-import { useFileState } from '@app/contexts/file/fileHooks';
-import { FileId } from '@app/types/file';
-import { formatFileSize } from '@app/utils/fileUtils';
-import ToolChain from '@app/components/shared/ToolChain';
-import HoverActionMenu, { HoverAction } from '@app/components/shared/HoverActionMenu';
-import { downloadFile } from '@app/services/downloadService';
-import FileEditorFileName from '@app/components/fileEditor/FileEditorFileName';
-import { PrivateContent } from '@app/components/shared/PrivateContent';
-import UploadToServerModal from '@app/components/shared/UploadToServerModal';
-import ShareFileModal from '@app/components/shared/ShareFileModal';
-import { useAppConfig } from '@app/contexts/AppConfigContext';
-
+import React, { useState, useCallback, useRef, useMemo } from "react";
+import {
+  Text,
+  ActionIcon,
+  CheckboxIndicator,
+  Tooltip,
+  Modal,
+  Button,
+  Group,
+  Stack,
+  Loader,
+} from "@mantine/core";
+import { useIsMobile } from "@app/hooks/useIsMobile";
+import { alert } from "@app/components/toast";
+import { useTranslation } from "react-i18next";
+import { useFileActionTerminology } from "@app/hooks/useFileActionTerminology";
+import { useFileActionIcons } from "@app/hooks/useFileActionIcons";
+import CloseIcon from "@mui/icons-material/Close";
+import VisibilityIcon from "@mui/icons-material/Visibility";
+import UnarchiveIcon from "@mui/icons-material/Unarchive";
+import CloudUploadIcon from "@mui/icons-material/CloudUpload";
+import LinkIcon from "@mui/icons-material/Link";
+import PushPinIcon from "@mui/icons-material/PushPin";
+import PushPinOutlinedIcon from "@mui/icons-material/PushPinOutlined";
+import LockOpenIcon from "@mui/icons-material/LockOpen";
+import DragIndicatorIcon from "@mui/icons-material/DragIndicator";
+import {
+  draggable,
+  dropTargetForElements,
+} from "@atlaskit/pragmatic-drag-and-drop/element/adapter";
+import { StirlingFileStub } from "@app/types/fileContext";
+import { zipFileService } from "@app/services/zipFileService";
 
+import styles from "@app/components/fileEditor/FileEditor.module.css";
+import { useFileContext } from "@app/contexts/FileContext";
+import { useFileState } from "@app/contexts/file/fileHooks";
+import { FileId } from "@app/types/file";
+import { formatFileSize } from "@app/utils/fileUtils";
+import ToolChain from "@app/components/shared/ToolChain";
+import HoverActionMenu, {
+  HoverAction,
+} from "@app/components/shared/HoverActionMenu";
+import { downloadFile } from "@app/services/downloadService";
+import { PrivateContent } from "@app/components/shared/PrivateContent";
+import UploadToServerModal from "@app/components/shared/UploadToServerModal";
+import ShareFileModal from "@app/components/shared/ShareFileModal";
+import { useAppConfig } from "@app/contexts/AppConfigContext";
+import { truncateCenter } from "@app/utils/textUtils";
 
 interface FileEditorThumbnailProps {
   file: StirlingFileStub;
@@ -44,7 +57,11 @@ interface FileEditorThumbnailProps {
   onCloseFile: (fileId: FileId) => void;
   onViewFile: (fileId: FileId) => void;
   _onSetStatus: (status: string) => void;
-  onReorderFiles?: (sourceFileId: FileId, targetFileId: FileId, selectedFileIds: FileId[]) => void;
+  onReorderFiles?: (
+    sourceFileId: FileId,
+    targetFileId: FileId,
+    selectedFileIds: FileId[],
+  ) => void;
   onDownloadFile: (fileId: FileId) => void;
   onUnzipFile?: (fileId: FileId) => void;
   toolMode?: boolean;
@@ -82,6 +99,7 @@ const FileEditorThumbnail = ({
 
   // ---- Drag state ----
   const [isDragging, setIsDragging] = useState(false);
+  const [isDragOver, setIsDragOver] = useState(false);
   const dragElementRef = useRef<HTMLDivElement | null>(null);
   const [showHoverMenu, setShowHoverMenu] = useState(false);
   const isMobile = useIsMobile();
@@ -93,7 +111,7 @@ const FileEditorThumbnail = ({
 
   // Resolve the actual File object for pin/unpin operations
   const actualFile = useMemo(() => {
-    return activeFiles.find(f => f.fileId === file.id);
+    return activeFiles.find((f) => f.fileId === file.id);
   }, [activeFiles, file.id]);
   const isPinned = actualFile ? isFilePinned(actualFile) : false;
 
@@ -114,94 +132,105 @@ const FileEditorThumbnail = ({
   }, [file.size]);
 
   const extUpper = useMemo(() => {
-    const m = /\.([a-z0-9]+)$/i.exec(file.name ?? '');
-    return (m?.[1] || '').toUpperCase();
+    const m = /\.([a-z0-9]+)$/i.exec(file.name ?? "");
+    return (m?.[1] || "").toUpperCase();
   }, [file.name]);
 
   const extLower = useMemo(() => {
-    const m = /\.([a-z0-9]+)$/i.exec(file.name ?? '');
-    return (m?.[1] || '').toLowerCase();
+    const m = /\.([a-z0-9]+)$/i.exec(file.name ?? "");
+    return (m?.[1] || "").toLowerCase();
   }, [file.name]);
 
-  const isCBZ = extLower === 'cbz';
-  const isCBR = extLower === 'cbr';
+  const isCBZ = extLower === "cbz";
+  const isCBR = extLower === "cbr";
   const uploadEnabled = config?.storageEnabled === true;
-  const sharingEnabled = uploadEnabled && config?.storageSharingEnabled === true;
-  const shareLinksEnabled = sharingEnabled && config?.storageShareLinksEnabled === true;
+  const sharingEnabled =
+    uploadEnabled && config?.storageSharingEnabled === true;
+  const shareLinksEnabled =
+    sharingEnabled && config?.storageShareLinksEnabled === true;
   const isOwnedOrLocal = file.remoteOwnedByCurrentUser !== false;
-  const isSharedFile = file.remoteOwnedByCurrentUser === false || file.remoteSharedViaLink;
+  const isSharedFile =
+    file.remoteOwnedByCurrentUser === false || file.remoteSharedViaLink;
   const localUpdatedAt = file.createdAt ?? file.lastModified ?? 0;
   const remoteUpdatedAt = file.remoteStorageUpdatedAt ?? 0;
   const isUploaded = Boolean(file.remoteStorageId);
   const isUpToDate = isUploaded && remoteUpdatedAt >= localUpdatedAt;
-  const canUpload = uploadEnabled && isOwnedOrLocal && file.isLeaf && (!isUploaded || !isUpToDate);
+  const canUpload =
+    uploadEnabled &&
+    isOwnedOrLocal &&
+    file.isLeaf &&
+    (!isUploaded || !isUpToDate);
   const canShare = shareLinksEnabled && isOwnedOrLocal && file.isLeaf;
 
   const pageLabel = useMemo(
     () =>
-      pageCount > 0
-        ? `${pageCount} ${pageCount === 1 ? 'Page' : 'Pages'}`
-        : '',
-    [pageCount]
+      pageCount > 0 ? `${pageCount} ${pageCount === 1 ? "Page" : "Pages"}` : "",
+    [pageCount],
   );
 
   const dateLabel = useMemo(() => {
     const d = new Date(file.lastModified);
-    if (Number.isNaN(d.getTime())) return '';
+    if (Number.isNaN(d.getTime())) return "";
     return new Intl.DateTimeFormat(undefined, {
-      month: 'short',
-      day: '2-digit',
-      year: 'numeric',
+      month: "short",
+      day: "2-digit",
+      year: "numeric",
     }).format(d);
   }, [file.lastModified]);
 
   // ---- Drag & drop wiring ----
-  const fileElementRef = useCallback((element: HTMLDivElement | null) => {
-    if (!element) return;
+  const fileElementRef = useCallback(
+    (element: HTMLDivElement | null) => {
+      if (!element) return;
 
-    dragElementRef.current = element;
+      dragElementRef.current = element;
 
-    const dragCleanup = draggable({
-      element,
-      getInitialData: () => ({
-        type: 'file',
-        fileId: file.id,
-        fileName: file.name,
-        selectedFiles: [file.id]  // Always drag only this file, ignore selection state
-      }),
-      onDragStart: () => {
-        setIsDragging(true);
-      },
-      onDrop: () => {
-        setIsDragging(false);
-      }
-    });
+      const dragCleanup = draggable({
+        element,
+        getInitialData: () => ({
+          type: "file",
+          fileId: file.id,
+          fileName: file.name,
+          selectedFiles: [file.id], // Always drag only this file, ignore selection state
+        }),
+        onDragStart: () => {
+          setIsDragging(true);
+        },
+        onDrop: () => {
+          setIsDragging(false);
+        },
+      });
 
-    const dropCleanup = dropTargetForElements({
-      element,
-      getData: () => ({
-        type: 'file',
-        fileId: file.id
-      }),
-      canDrop: ({ source }) => {
-        const sourceData = source.data;
-        return sourceData.type === 'file' && sourceData.fileId !== file.id;
-      },
-      onDrop: ({ source }) => {
-        const sourceData = source.data;
-        if (sourceData.type === 'file' && onReorderFiles) {
-          const sourceFileId = sourceData.fileId as FileId;
-          const selectedFileIds = sourceData.selectedFiles as FileId[];
-          onReorderFiles(sourceFileId, file.id, selectedFileIds);
-        }
-      }
-    });
+      const dropCleanup = dropTargetForElements({
+        element,
+        getData: () => ({
+          type: "file",
+          fileId: file.id,
+        }),
+        canDrop: ({ source }) => {
+          const sourceData = source.data;
+          return sourceData.type === "file" && sourceData.fileId !== file.id;
+        },
+        onDragEnter: () => setIsDragOver(true),
+        onDragLeave: () => setIsDragOver(false),
+        onDrop: ({ source }) => {
+          setIsDragOver(false);
+          const sourceData = source.data;
+          if (sourceData.type === "file" && onReorderFiles) {
+            const sourceFileId = sourceData.fileId as FileId;
+            const selectedFileIds = sourceData.selectedFiles as FileId[];
+            onReorderFiles(sourceFileId, file.id, selectedFileIds);
+          }
+        },
+      });
 
-    return () => {
-      dragCleanup();
-      dropCleanup();
-    };
-  }, [file.id, file.name, selectedFiles, onReorderFiles]);
+      return () => {
+        dragCleanup();
+        dropCleanup();
+      };
+    },
+    [file.id, file.name, selectedFiles, onReorderFiles],
+  );
 
   // Handle close with confirmation
   const handleCloseWithConfirmation = useCallback(() => {
@@ -210,7 +239,12 @@ const FileEditorThumbnail = ({
 
   const handleConfirmClose = useCallback(() => {
     onCloseFile(file.id);
-    alert({ alertType: 'neutral', title: `Closed ${file.name}`, expandable: false, durationMs: 3500 });
+    alert({
+      alertType: "neutral",
+      title: `Closed ${file.name}`,
+      expandable: false,
+      durationMs: 3500,
+    });
     setShowCloseModal(false);
   }, [file.id, file.name, onCloseFile]);
 
@@ -221,12 +255,12 @@ const FileEditorThumbnail = ({
         const result = await downloadFile({
           data: fileToSave,
           filename: file.name,
-          localPath: file.localFilePath
+          localPath: file.localFilePath,
         });
         if (!result.cancelled && result.savedPath) {
           fileActions.updateStirlingFileStub(file.id, {
             localFilePath: file.localFilePath ?? result.savedPath,
-            isDirty: false
+            isDirty: false,
           });
         } else if (result.cancelled) {
           setShowCloseModal(false);
@@ -234,111 +268,148 @@ const FileEditorThumbnail = ({
         }
       } catch (error) {
         console.error(`Failed to save ${file.name}:`, error);
-        alert({ alertType: 'error', title: 'Save failed', body: `Could not save ${file.name}`, expandable: true });
+        alert({
+          alertType: "error",
+          title: "Save failed",
+          body: `Could not save ${file.name}`,
+          expandable: true,
+        });
         setShowCloseModal(false);
         return;
       }
     }
     // Then close
     onCloseFile(file.id);
-    alert({ alertType: 'success', title: `Saved and closed ${file.name}`, expandable: false, durationMs: 3500 });
+    alert({
+      alertType: "success",
+      title: `Saved and closed ${file.name}`,
+      expandable: false,
+      durationMs: 3500,
+    });
     setShowCloseModal(false);
-  }, [file.id, file.name, file.localFilePath, onCloseFile, selectors, fileActions]);
+  }, [
+    file.id,
+    file.name,
+    file.localFilePath,
+    onCloseFile,
+    selectors,
+    fileActions,
+  ]);
 
   const handleCancelClose = useCallback(() => {
     setShowCloseModal(false);
   }, []);
 
   // Build hover menu actions
-  const hoverActions = useMemo<HoverAction[]>(() => [
-    {
-      id: 'view',
-      icon: <VisibilityIcon style={{ fontSize: 20 }} />,
-      label: t('openInViewer', 'Open in Viewer'),
-      onClick: (e) => {
-        e.stopPropagation();
-        onViewFile(file.id);
+  const hoverActions = useMemo<HoverAction[]>(
+    () => [
+      {
+        id: "view",
+        icon: <VisibilityIcon style={{ fontSize: 20 }} />,
+        label: t("openInViewer", "Open in Viewer"),
+        onClick: (e) => {
+          e.stopPropagation();
+          onViewFile(file.id);
+        },
       },
-    },
-    {
-      id: 'download',
-      icon: <DownloadOutlinedIcon style={{ fontSize: 20 }} />,
-      label: terminology.download,
-      onClick: (e) => {
-        e.stopPropagation();
-        onDownloadFile(file.id);
+      {
+        id: "download",
+        icon: <DownloadOutlinedIcon style={{ fontSize: 20 }} />,
+        label: terminology.download,
+        onClick: (e) => {
+          e.stopPropagation();
+          onDownloadFile(file.id);
+        },
       },
-    },
-    ...(canUpload || canShare
-      ? [
-        ...(canUpload ? [{
-          id: 'upload',
-          icon: <CloudUploadIcon style={{ fontSize: 20 }} />,
-          label: isUploaded
-            ? t('fileManager.updateOnServer', 'Update on Server')
-            : t('fileManager.uploadToServer', 'Upload to Server'),
-          onClick: (e: React.MouseEvent) => {
-            e.stopPropagation();
-            setShowUploadModal(true);
-          },
-        }] : []),
-        ...(canShare ? [{
-          id: 'share',
-          icon: <LinkIcon style={{ fontSize: 20 }} />,
-          label: t('fileManager.share', 'Share'),
-          onClick: (e: React.MouseEvent) => {
-            e.stopPropagation();
-            setShowShareModal(true);
-          },
-        }] : []),
-      ]
-      : []),
-    {
-      id: 'unzip',
-      icon: <UnarchiveIcon style={{ fontSize: 20 }} />,
-      label: t('fileManager.unzip', 'Unzip'),
-      onClick: (e) => {
-        e.stopPropagation();
-        if (onUnzipFile) {
-          onUnzipFile(file.id);
-          alert({ alertType: 'success', title: `Unzipping ${file.name}`, expandable: false, durationMs: 2500 });
-        }
+      ...(canUpload || canShare
+        ? [
+            ...(canUpload
+              ? [
+                  {
+                    id: "upload",
+                    icon: <CloudUploadIcon style={{ fontSize: 20 }} />,
+                    label: isUploaded
+                      ? t("fileManager.updateOnServer", "Update on Server")
+                      : t("fileManager.uploadToServer", "Upload to Server"),
+                    onClick: (e: React.MouseEvent) => {
+                      e.stopPropagation();
+                      setShowUploadModal(true);
+                    },
+                  },
+                ]
+              : []),
+            ...(canShare
+              ? [
+                  {
+                    id: "share",
+                    icon: <LinkIcon style={{ fontSize: 20 }} />,
+                    label: t("fileManager.share", "Share"),
+                    onClick: (e: React.MouseEvent) => {
+                      e.stopPropagation();
+                      setShowShareModal(true);
+                    },
+                  },
+                ]
+              : []),
+          ]
+        : []),
+      {
+        id: "unzip",
+        icon: <UnarchiveIcon style={{ fontSize: 20 }} />,
+        label: t("fileManager.unzip", "Unzip"),
+        onClick: (e) => {
+          e.stopPropagation();
+          if (onUnzipFile) {
+            onUnzipFile(file.id);
+            alert({
+              alertType: "success",
+              title: `Unzipping ${file.name}`,
+              expandable: false,
+              durationMs: 2500,
+            });
+          }
+        },
+        hidden: !isZipFile || !onUnzipFile || isCBZ || isCBR,
       },
-      hidden: !isZipFile || !onUnzipFile || isCBZ || isCBR,
-    },
-    {
-      id: 'close',
-      icon: <CloseIcon style={{ fontSize: 20 }} />,
-      label: t('close', 'Close'),
-      onClick: (e) => {
-        e.stopPropagation();
-        handleCloseWithConfirmation();
+      {
+        id: "close",
+        icon: <CloseIcon style={{ fontSize: 20 }} />,
+        label: t("close", "Close"),
+        onClick: (e) => {
+          e.stopPropagation();
+          handleCloseWithConfirmation();
+        },
+        color: "red",
       },
-      color: 'red',
-    }
-  ], [
-    t,
-    file.id,
-    file.name,
-    isZipFile,
-    isCBZ,
-    isCBR,
-    terminology,
-    onViewFile,
-    onDownloadFile,
-    onUnzipFile,
-    handleCloseWithConfirmation,
-    canUpload,
-    canShare,
-    isUploaded
-  ]);
+    ],
+    [
+      t,
+      file.id,
+      file.name,
+      isZipFile,
+      isCBZ,
+      isCBR,
+      terminology,
+      onViewFile,
+      onDownloadFile,
+      onUnzipFile,
+      handleCloseWithConfirmation,
+      canUpload,
+      canShare,
+      isUploaded,
+    ],
+  );
 
   // ---- Card interactions ----
   const handleCardClick = () => {
     if (!isSupported) return;
     // Clear error state if file has an error (click to clear error)
     if (hasError) {
-      try { fileActions.clearFileError(file.id); } catch (_e) { void _e; }
+      try {
+        fileActions.clearFileError(file.id);
+      } catch (_e) {
+        void _e;
+      }
     }
     if (isSharedFile && !sharedEditNoticeShownRef.current) {
       sharedEditNoticeShownRef.current = true;
@@ -359,7 +430,6 @@ const FileEditorThumbnail = ({
     return isSelected ? styles.headerSelected : styles.headerResting;
   };
 
-
   return (
     <div
       ref={fileElementRef}
@@ -369,7 +439,22 @@ const FileEditorThumbnail = ({
       data-selected={isSelected}
       data-supported={isSupported}
       className={`${styles.card} w-[18rem] h-[22rem] select-none flex flex-col shadow-sm transition-all relative`}
-      style={{opacity: isDragging ? 0.9 : 1}}
+      style={
+        {
+          opacity: isDragging ? 0.4 : 1,
+          outline: isDragOver
+            ? "3px dashed var(--mantine-color-blue-5, #3b82f6)"
+            : undefined,
+          outlineOffset: isDragOver ? "2px" : undefined,
+          transform: isDragOver ? "scale(1.02)" : undefined,
+          transition:
+            "outline 120ms ease, transform 120ms ease, opacity 120ms ease",
+          // Tag each card with a stable, unique view-transition-name so the
+          // browser can animate the reorder (see FileEditor.handleReorderFiles,
+          // which dispatches reorderFiles inside document.startViewTransition).
+          viewTransitionName: `file-card-${file.id}`,
+        } as React.CSSProperties
+      }
       tabIndex={0}
       role="listitem"
       aria-selected={isSelected}
@@ -387,7 +472,7 @@ const FileEditorThumbnail = ({
         <div className={styles.logoMark}>
           {hasError ? (
             <div className={styles.errorPill}>
-              <span>{t('error._value', 'Error')}</span>
+              <span>{t("error._value", "Error")}</span>
             </div>
           ) : isSupported ? (
             <CheckboxIndicator
@@ -397,24 +482,33 @@ const FileEditorThumbnail = ({
             />
           ) : (
             <div className={styles.unsupportedPill}>
-              <span>
-                {t('unsupported', 'Unsupported')}
-              </span>
+              <span>{t("unsupported", "Unsupported")}</span>
             </div>
           )}
         </div>
 
         {/* Centered index */}
-        <div className={styles.headerIndex} aria-label={`Position ${index + 1}`}>
+        <div
+          className={styles.headerIndex}
+          aria-label={`Position ${index + 1}`}
+        >
           {index + 1}
         </div>
 
         {/* Action buttons group */}
         <div className={styles.headerActions}>
           {isEncrypted && (
-            <Tooltip label={t('encryptedPdfUnlock.unlockPrompt', 'Unlock PDF to continue')}>
+            <Tooltip
+              label={t(
+                "encryptedPdfUnlock.unlockPrompt",
+                "Unlock PDF to continue",
+              )}
+            >
               <ActionIcon
-                aria-label={t('encryptedPdfUnlock.unlockPrompt', 'Unlock PDF to continue')}
+                aria-label={t(
+                  "encryptedPdfUnlock.unlockPrompt",
+                  "Unlock PDF to continue",
+                )}
                 variant="subtle"
                 className={styles.headerIconButton}
                 onClick={(e) => {
@@ -427,9 +521,19 @@ const FileEditorThumbnail = ({
             </Tooltip>
           )}
           {/* Pin/Unpin icon */}
-          <Tooltip label={isPinned ? t('unpin', 'Unpin File (replace after tool run)') : t('pin', 'Pin File (keep active after tool run)')}>
+          <Tooltip
+            label={
+              isPinned
+                ? t("unpin", "Unpin File (replace after tool run)")
+                : t("pin", "Pin File (keep active after tool run)")
+            }
+          >
             <ActionIcon
-              aria-label={isPinned ? t('unpin', 'Unpin File (replace after tool run)') : t('pin', 'Pin File (keep active after tool run)')}
+              aria-label={
+                isPinned
+                  ? t("unpin", "Unpin File (replace after tool run)")
+                  : t("pin", "Pin File (keep active after tool run)")
+              }
               variant="subtle"
               className={isPinned ? styles.pinned : styles.headerIconButton}
               data-tour="file-card-pin"
@@ -438,15 +542,29 @@ const FileEditorThumbnail = ({
                 if (actualFile) {
                   if (isPinned) {
                     unpinFile(actualFile);
-                    alert({ alertType: 'neutral', title: `Unpinned ${file.name}`, expandable: false, durationMs: 3000 });
+                    alert({
+                      alertType: "neutral",
+                      title: `Unpinned ${file.name}`,
+                      expandable: false,
+                      durationMs: 3000,
+                    });
                   } else {
                     pinFile(actualFile);
-                    alert({ alertType: 'success', title: `Pinned ${file.name}`, expandable: false, durationMs: 3000 });
+                    alert({
+                      alertType: "success",
+                      title: `Pinned ${file.name}`,
+                      expandable: false,
+                      durationMs: 3000,
+                    });
                   }
                 }
               }}
             >
-              {isPinned ? <PushPinIcon fontSize="small" /> : <PushPinOutlinedIcon fontSize="small" />}
+              {isPinned ? (
+                <PushPinIcon fontSize="small" />
+              ) : (
+                <PushPinOutlinedIcon fontSize="small" />
+              )}
             </ActionIcon>
           </Tooltip>
         </div>
@@ -454,35 +572,40 @@ const FileEditorThumbnail = ({
 
       {/* Title + meta line */}
       <div
-      style={{
-        padding: '0.5rem',
-        textAlign: 'center',
-        background: 'var(--file-card-bg)',
-        marginTop: '0.5rem',
-        marginBottom: '0.5rem',
-      }}>
-        <Text  size="lg" fw={700} className={styles.title}  lineClamp={2} style={{ display: 'flex', alignItems: 'center', justifyContent: 'center', gap: '0.25rem' }}>
-          <FileEditorFileName file={file} />
+        style={{
+          padding: "0.5rem",
+          textAlign: "center",
+          background: "var(--file-card-bg)",
+          marginTop: "0.5rem",
+          marginBottom: "0.5rem",
+        }}
+      >
+        <Text size="lg" fw={700} className={styles.title} title={file.name}>
+          <PrivateContent>{truncateCenter(file.name, 40)}</PrivateContent>
         </Text>
         <Text
           size="sm"
           c="dimmed"
           className={styles.meta}
           lineClamp={3}
-          title={`${extUpper || 'FILE'} • ${prettySize}`}
+          title={`${extUpper || "FILE"} • ${prettySize}`}
         >
           {/* e.g.,  v2 - Jan 29, 2025 - PDF file - 3 Pages */}
           {`v${file.versionNumber} - `}
           {dateLabel}
-          {extUpper ? ` - ${extUpper} file` : ''}
-          {pageLabel ? ` - ${pageLabel}` : ''}
+          {extUpper ? ` - ${extUpper} file` : ""}
+          {pageLabel ? ` - ${pageLabel}` : ""}
         </Text>
       </div>
 
       {/* Preview area */}
       <div
         className={`${styles.previewBox} mx-6 mb-4 relative flex-1`}
-        style={isSupported || hasError ? undefined : { filter: 'grayscale(80%)', opacity: 0.6 }}
+        style={
+          isSupported || hasError
+            ? undefined
+            : { filter: "grayscale(80%)", opacity: 0.6 }
+        }
       >
         <div className={styles.previewPaper}>
           {file.thumbnailUrl ? (
@@ -495,27 +618,34 @@ const FileEditorThumbnail = ({
                 decoding="async"
                 onError={(e) => {
                   const img = e.currentTarget;
-                  img.style.display = 'none';
-                  img.parentElement?.setAttribute('data-thumb-missing', 'true');
+                  img.style.display = "none";
+                  img.parentElement?.setAttribute("data-thumb-missing", "true");
                 }}
                 style={{
-                  maxWidth: '80%',
-                maxHeight: '80%',
-                objectFit: 'contain',
-                borderRadius: 0,
-                background: '#ffffff',
-                border: '1px solid var(--border-default)',
-                display: 'block',
-                marginLeft: 'auto',
-                marginRight: 'auto',
-                alignSelf: 'start'
-              }}
-            />
+                  maxWidth: "80%",
+                  maxHeight: "80%",
+                  objectFit: "contain",
+                  borderRadius: 0,
+                  background: "#ffffff",
+                  border: "1px solid var(--border-default)",
+                  display: "block",
+                  marginLeft: "auto",
+                  marginRight: "auto",
+                  alignSelf: "start",
+                }}
+              />
             </PrivateContent>
-          ) : file.type?.startsWith('application/pdf') ? (
-            <Stack align="center" justify="center" gap="xs" style={{ height: '100%' }}>
+          ) : file.type?.startsWith("application/pdf") ? (
+            <Stack
+              align="center"
+              justify="center"
+              gap="xs"
+              style={{ height: "100%" }}
+            >
               <Loader size="sm" />
-              <Text size="xs" c="dimmed">Loading thumbnail...</Text>
+              <Text size="xs" c="dimmed">
+                Loading thumbnail...
+              </Text>
             </Stack>
           ) : null}
         </div>
@@ -527,23 +657,25 @@ const FileEditorThumbnail = ({
 
         {/* Tool chain display at bottom */}
         {file.toolHistory && (
-          <div style={{
-            position: 'absolute',
-            bottom: '4px',
-            left: '4px',
-            right: '4px',
-            padding: '4px 6px',
-            textAlign: 'center',
-            fontWeight: 600,
-            overflow: 'hidden',
-            whiteSpace: 'nowrap'
-          }}>
+          <div
+            style={{
+              position: "absolute",
+              bottom: "4px",
+              left: "4px",
+              right: "4px",
+              padding: "4px 6px",
+              textAlign: "center",
+              fontWeight: 600,
+              overflow: "hidden",
+              whiteSpace: "nowrap",
+            }}
+          >
             <ToolChain
               toolChain={file.toolHistory}
               displayStyle="text"
               size="xs"
-              maxWidth={'100%'}
-              color='var(--mantine-color-gray-7)'
+              maxWidth={"100%"}
+              color="var(--mantine-color-gray-7)"
             />
           </div>
         )}
@@ -560,41 +692,56 @@ const FileEditorThumbnail = ({
       <Modal
         opened={showCloseModal}
         onClose={handleCancelClose}
-        title={t('confirmClose', 'Confirm Close')}
+        title={t("confirmClose", "Confirm Close")}
         centered
         size="auto"
       >
         <Stack gap="md">
           {file.isDirty && file.localFilePath ? (
             <>
-              <Text size="md">{t('confirmCloseUnsaved', 'This file has unsaved changes.')}</Text>
+              <Text size="md">
+                {t("confirmCloseUnsaved", "This file has unsaved changes.")}
+              </Text>
               <Text size="sm" c="dimmed" fw={500}>
                 {file.name}
               </Text>
               <Group justify="flex-end" gap="sm">
                 <Button variant="light" onClick={handleCancelClose}>
-                  {t('confirmCloseCancel', 'Cancel')}
+                  {t("confirmCloseCancel", "Cancel")}
                 </Button>
-                <Button variant="filled" color="red" onClick={handleConfirmClose}>
-                  {t('confirmCloseDiscard', 'Discard changes and close')}
+                <Button
+                  variant="filled"
+                  color="red"
+                  onClick={handleConfirmClose}
+                >
+                  {t("confirmCloseDiscard", "Discard changes and close")}
                 </Button>
                 <Button variant="filled" onClick={handleSaveAndClose}>
-                  {t('confirmCloseSave', 'Save and close')}
+                  {t("confirmCloseSave", "Save and close")}
                 </Button>
               </Group>
             </>
           ) : (
             <>
-              <Text size="md">{t('confirmCloseMessage', 'Are you sure you want to close this file?')}</Text>
+              <Text size="md">
+                {t(
+                  "confirmCloseMessage",
+                  "Are you sure you want to close this file?",
+                )}
+              </Text>
               <Text size="sm" c="dimmed" fw={500}>
                 {file.name}
               </Text>
               <Group justify="flex-end" gap="sm">
                 <Button variant="light" onClick={handleCancelClose}>
-                  {t('confirmCloseCancel', 'Cancel')}
+                  {t("confirmCloseCancel", "Cancel")}
                 </Button>
-                <Button variant="filled" color="red" onClick={handleConfirmClose}>
-                  {t('confirmCloseConfirm', 'Close File')}
+                <Button
+                  variant="filled"
+                  color="red"
+                  onClick={handleConfirmClose}
+                >
+                  {t("confirmCloseConfirm", "Close File")}
                 </Button>
               </Group>
             </>
@@ -604,20 +751,20 @@ const FileEditorThumbnail = ({
       <Modal
         opened={showSharedEditNotice}
         onClose={() => setShowSharedEditNotice(false)}
-        title={t('fileManager.sharedEditNoticeTitle', 'Read-only server copy')}
+        title={t("fileManager.sharedEditNoticeTitle", "Read-only server copy")}
         centered
         size="auto"
       >
         <Stack gap="md">
           <Text size="sm">
             {t(
-              'fileManager.sharedEditNoticeBody',
-              'You do not have edit rights to the server version of this file. Any edits you make will be saved as a local copy.'
+              "fileManager.sharedEditNoticeBody",
+              "You do not have edit rights to the server version of this file. Any edits you make will be saved as a local copy.",
             )}
           </Text>
           <Group justify="flex-end" gap="sm">
             <Button onClick={() => setShowSharedEditNotice(false)}>
-              {t('fileManager.sharedEditNoticeConfirm', 'Got it')}
+              {t("fileManager.sharedEditNoticeConfirm", "Got it")}
             </Button>
           </Group>
         </Stack>
diff --git a/frontend/src/core/components/fileEditor/fileEditorRightRailButtons.tsx b/frontend/src/core/components/fileEditor/fileEditorRightRailButtons.tsx
index 122023af6f..8c5383457f 100644
--- a/frontend/src/core/components/fileEditor/fileEditorRightRailButtons.tsx
+++ b/frontend/src/core/components/fileEditor/fileEditorRightRailButtons.tsx
@@ -1,7 +1,10 @@
-import { useMemo } from 'react';
-import { useTranslation } from 'react-i18next';
-import { useRightRailButtons, RightRailButtonWithAction } from '@app/hooks/useRightRailButtons';
-import LocalIcon from '@app/components/shared/LocalIcon';
+import { useMemo } from "react";
+import { useTranslation } from "react-i18next";
+import {
+  useRightRailButtons,
+  RightRailButtonWithAction,
+} from "@app/hooks/useRightRailButtons";
+import LocalIcon from "@app/components/shared/LocalIcon";
 
 interface FileEditorRightRailButtonsParams {
   totalItems: number;
@@ -20,41 +23,67 @@ export function useFileEditorRightRailButtons({
 }: FileEditorRightRailButtonsParams) {
   const { t, i18n } = useTranslation();
 
-  const buttons = useMemo<RightRailButtonWithAction[]>(() => [
-    {
-      id: 'file-select-all',
-      icon: <LocalIcon icon="select-all" width="1.5rem" height="1.5rem" />,
-      tooltip: t('rightRail.selectAll', 'Select All'),
-      ariaLabel: typeof t === 'function' ? t('rightRail.selectAll', 'Select All') : 'Select All',
-      section: 'top' as const,
-      order: 10,
-      disabled: totalItems === 0 || selectedCount === totalItems,
-      visible: totalItems > 0,
-      onClick: onSelectAll,
-    },
-    {
-      id: 'file-deselect-all',
-      icon: <LocalIcon icon="crop-square-outline" width="1.5rem" height="1.5rem" />,
-      tooltip: t('rightRail.deselectAll', 'Deselect All'),
-      ariaLabel: typeof t === 'function' ? t('rightRail.deselectAll', 'Deselect All') : 'Deselect All',
-      section: 'top' as const,
-      order: 20,
-      disabled: selectedCount === 0,
-      visible: totalItems > 0,
-      onClick: onDeselectAll,
-    },
-    {
-      id: 'file-close-selected',
-      icon: <LocalIcon icon="close-rounded" width="1.5rem" height="1.5rem" />,
-      tooltip: t('rightRail.closeSelected', 'Close Selected Files'),
-      ariaLabel: typeof t === 'function' ? t('rightRail.closeSelected', 'Close Selected Files') : 'Close Selected Files',
-      section: 'top' as const,
-      order: 30,
-      disabled: selectedCount === 0,
-      visible: totalItems > 0,
-      onClick: onCloseSelected,
-    },
-  ], [t, i18n.language, totalItems, selectedCount, onSelectAll, onDeselectAll, onCloseSelected]);
+  const buttons = useMemo<RightRailButtonWithAction[]>(
+    () => [
+      {
+        id: "file-select-all",
+        icon: <LocalIcon icon="select-all" width="1.5rem" height="1.5rem" />,
+        tooltip: t("rightRail.selectAll", "Select All"),
+        ariaLabel:
+          typeof t === "function"
+            ? t("rightRail.selectAll", "Select All")
+            : "Select All",
+        section: "top" as const,
+        order: 10,
+        disabled: totalItems === 0 || selectedCount === totalItems,
+        visible: totalItems > 0,
+        onClick: onSelectAll,
+      },
+      {
+        id: "file-deselect-all",
+        icon: (
+          <LocalIcon
+            icon="crop-square-outline"
+            width="1.5rem"
+            height="1.5rem"
+          />
+        ),
+        tooltip: t("rightRail.deselectAll", "Deselect All"),
+        ariaLabel:
+          typeof t === "function"
+            ? t("rightRail.deselectAll", "Deselect All")
+            : "Deselect All",
+        section: "top" as const,
+        order: 20,
+        disabled: selectedCount === 0,
+        visible: totalItems > 0,
+        onClick: onDeselectAll,
+      },
+      {
+        id: "file-close-selected",
+        icon: <LocalIcon icon="close-rounded" width="1.5rem" height="1.5rem" />,
+        tooltip: t("rightRail.closeSelected", "Close Selected Files"),
+        ariaLabel:
+          typeof t === "function"
+            ? t("rightRail.closeSelected", "Close Selected Files")
+            : "Close Selected Files",
+        section: "top" as const,
+        order: 30,
+        disabled: selectedCount === 0,
+        visible: totalItems > 0,
+        onClick: onCloseSelected,
+      },
+    ],
+    [
+      t,
+      i18n.language,
+      totalItems,
+      selectedCount,
+      onSelectAll,
+      onDeselectAll,
+      onCloseSelected,
+    ],
+  );
 
   useRightRailButtons(buttons);
 }
diff --git a/frontend/src/core/components/fileManager/CompactFileDetails.tsx b/frontend/src/core/components/fileManager/CompactFileDetails.tsx
index 5156dccff9..d8717ee7e3 100644
--- a/frontend/src/core/components/fileManager/CompactFileDetails.tsx
+++ b/frontend/src/core/components/fileManager/CompactFileDetails.tsx
@@ -1,12 +1,12 @@
-import React from 'react';
-import { Stack, Box, Text, Button, ActionIcon, Center } from '@mantine/core';
-import PictureAsPdfIcon from '@mui/icons-material/PictureAsPdf';
-import ChevronLeftIcon from '@mui/icons-material/ChevronLeft';
-import ChevronRightIcon from '@mui/icons-material/ChevronRight';
-import { useTranslation } from 'react-i18next';
-import { getFileSize } from '@app/utils/fileUtils';
-import { StirlingFileStub } from '@app/types/fileContext';
-import { PrivateContent } from '@app/components/shared/PrivateContent';
+import React from "react";
+import { Stack, Box, Text, Button, ActionIcon, Center } from "@mantine/core";
+import PictureAsPdfIcon from "@mui/icons-material/PictureAsPdf";
+import ChevronLeftIcon from "@mui/icons-material/ChevronLeft";
+import ChevronRightIcon from "@mui/icons-material/ChevronRight";
+import { useTranslation } from "react-i18next";
+import { getFileSize } from "@app/utils/fileUtils";
+import { StirlingFileStub } from "@app/types/fileContext";
+import { PrivateContent } from "@app/components/shared/PrivateContent";
 
 interface CompactFileDetailsProps {
   currentFile: StirlingFileStub | null;
@@ -29,47 +29,63 @@ const CompactFileDetails: React.FC<CompactFileDetailsProps> = ({
   isAnimating,
   onPrevious,
   onNext,
-  onOpenFiles
+  onOpenFiles,
 }) => {
   const { t } = useTranslation();
   const hasSelection = selectedFiles.length > 0;
   const hasMultipleFiles = numberOfFiles > 1;
   const showOwner = Boolean(
     currentFile &&
-      (currentFile.remoteOwnedByCurrentUser === false || currentFile.remoteSharedViaLink)
+    (currentFile.remoteOwnedByCurrentUser === false ||
+      currentFile.remoteSharedViaLink),
   );
   const ownerLabel = currentFile
-    ? currentFile.remoteOwnerUsername || t('fileManager.ownerUnknown', 'Unknown')
-    : '';
+    ? currentFile.remoteOwnerUsername ||
+      t("fileManager.ownerUnknown", "Unknown")
+    : "";
 
   return (
-    <Stack gap="xs" style={{ height: '100%' }}>
+    <Stack gap="xs" style={{ height: "100%" }}>
       {/* Compact mobile layout */}
-      <Box style={{ display: 'flex', gap: '0.75rem', alignItems: 'center' }}>
+      <Box style={{ display: "flex", gap: "0.75rem", alignItems: "center" }}>
         {/* Small preview */}
-        <Box style={{ width: '7.5rem', height: '9.375rem', flexShrink: 0, position: 'relative', display: 'flex', alignItems: 'center', justifyContent: 'center' }}>
+        <Box
+          style={{
+            width: "7.5rem",
+            height: "9.375rem",
+            flexShrink: 0,
+            position: "relative",
+            display: "flex",
+            alignItems: "center",
+            justifyContent: "center",
+          }}
+        >
           {currentFile && thumbnail ? (
             <PrivateContent>
               <img
                 src={thumbnail}
                 alt={currentFile.name}
                 style={{
-                  maxWidth: '100%',
-                  maxHeight: '100%',
-                  objectFit: 'contain',
-                  borderRadius: '0.25rem',
-                  boxShadow: '0 2px 4px rgba(0, 0, 0, 0.1)'
+                  maxWidth: "100%",
+                  maxHeight: "100%",
+                  objectFit: "contain",
+                  borderRadius: "0.25rem",
+                  boxShadow: "0 2px 4px rgba(0, 0, 0, 0.1)",
                 }}
               />
             </PrivateContent>
           ) : currentFile ? (
-            <Center style={{
-              width: '100%',
-              height: '100%',
-              backgroundColor: 'var(--mantine-color-gray-1)',
-              borderRadius: 4
-            }}>
-              <PictureAsPdfIcon style={{ fontSize: 20, color: 'var(--mantine-color-gray-6)' }} />
+            <Center
+              style={{
+                width: "100%",
+                height: "100%",
+                backgroundColor: "var(--mantine-color-gray-1)",
+                borderRadius: 4,
+              }}
+            >
+              <PictureAsPdfIcon
+                style={{ fontSize: 20, color: "var(--mantine-color-gray-6)" }}
+              />
             </Center>
           ) : null}
         </Box>
@@ -77,10 +93,12 @@ const CompactFileDetails: React.FC<CompactFileDetailsProps> = ({
         {/* File info */}
         <Box style={{ flex: 1, minWidth: 0 }}>
           <Text size="sm" fw={500} truncate>
-            <PrivateContent>{currentFile ? currentFile.name : 'No file selected'}</PrivateContent>
+            <PrivateContent>
+              {currentFile ? currentFile.name : "No file selected"}
+            </PrivateContent>
           </Text>
           <Text size="xs" c="dimmed">
-            {currentFile ? getFileSize(currentFile) : ''}
+            {currentFile ? getFileSize(currentFile) : ""}
             {selectedFiles.length > 1 && ` • ${selectedFiles.length} files`}
             {currentFile && ` • v${currentFile.versionNumber || 1}`}
           </Text>
@@ -92,19 +110,21 @@ const CompactFileDetails: React.FC<CompactFileDetailsProps> = ({
           {/* Compact tool chain for mobile */}
           {currentFile?.toolHistory && currentFile.toolHistory.length > 0 && (
             <Text size="xs" c="dimmed">
-              {currentFile.toolHistory.map((tool) => t(`home.${tool.toolId}.title`, tool.toolId)).join(' → ')}
+              {currentFile.toolHistory
+                .map((tool) => t(`home.${tool.toolId}.title`, tool.toolId))
+                .join(" → ")}
             </Text>
           )}
           {currentFile && showOwner && (
             <Text size="xs" c="dimmed">
-              {t('fileManager.owner', 'Owner')}: {ownerLabel}
+              {t("fileManager.owner", "Owner")}: {ownerLabel}
             </Text>
           )}
         </Box>
 
         {/* Navigation arrows for multiple files */}
         {hasMultipleFiles && (
-          <Box style={{ display: 'flex', gap: '0.25rem' }}>
+          <Box style={{ display: "flex", gap: "0.25rem" }}>
             <ActionIcon
               variant="subtle"
               size="sm"
@@ -132,14 +152,15 @@ const CompactFileDetails: React.FC<CompactFileDetailsProps> = ({
         disabled={!hasSelection}
         fullWidth
         style={{
-          backgroundColor: hasSelection ? 'var(--btn-open-file)' : 'var(--mantine-color-gray-4)',
-          color: 'white'
+          backgroundColor: hasSelection
+            ? "var(--btn-open-file)"
+            : "var(--mantine-color-gray-4)",
+          color: "white",
         }}
       >
         {selectedFiles.length > 1
-          ? t('fileManager.openFiles', `Open ${selectedFiles.length} Files`)
-          : t('fileManager.openFile', 'Open File')
-        }
+          ? t("fileManager.openFiles", `Open ${selectedFiles.length} Files`)
+          : t("fileManager.openFile", "Open File")}
       </Button>
     </Stack>
   );
diff --git a/frontend/src/core/components/fileManager/DesktopLayout.tsx b/frontend/src/core/components/fileManager/DesktopLayout.tsx
index 9926592c84..46376421fb 100644
--- a/frontend/src/core/components/fileManager/DesktopLayout.tsx
+++ b/frontend/src/core/components/fileManager/DesktopLayout.tsx
@@ -1,79 +1,97 @@
-import React from 'react';
-import { Grid } from '@mantine/core';
-import FileSourceButtons from '@app/components/fileManager/FileSourceButtons';
-import FileDetails from '@app/components/fileManager/FileDetails';
-import SearchInput from '@app/components/fileManager/SearchInput';
-import FileListArea from '@app/components/fileManager/FileListArea';
-import FileActions from '@app/components/fileManager/FileActions';
-import HiddenFileInput from '@app/components/fileManager/HiddenFileInput';
-import { useFileManagerContext } from '@app/contexts/FileManagerContext';
+import React from "react";
+import { Grid } from "@mantine/core";
+import FileSourceButtons from "@app/components/fileManager/FileSourceButtons";
+import FileDetails from "@app/components/fileManager/FileDetails";
+import SearchInput from "@app/components/fileManager/SearchInput";
+import FileListArea from "@app/components/fileManager/FileListArea";
+import FileActions from "@app/components/fileManager/FileActions";
+import HiddenFileInput from "@app/components/fileManager/HiddenFileInput";
+import { useFileManagerContext } from "@app/contexts/FileManagerContext";
 
 const DesktopLayout: React.FC = () => {
-  const {
-    activeSource,
-    recentFiles,
-    modalHeight,
-  } = useFileManagerContext();
+  const { activeSource, recentFiles, modalHeight } = useFileManagerContext();
 
   return (
-    <Grid gutter="xs" h="100%" grow={false} style={{ flexWrap: 'nowrap', minWidth: 0 }}>
+    <Grid
+      gutter="xs"
+      h="100%"
+      grow={false}
+      style={{ flexWrap: "nowrap", minWidth: 0 }}
+    >
       {/* Column 1: File Sources */}
-      <Grid.Col span="content" p="lg" style={{
-        minWidth: '13.625rem',
-        width: '13.625rem',
-        flexShrink: 0,
-        height: '100%',
-      }} data-tour="file-sources">
+      <Grid.Col
+        span="content"
+        p="lg"
+        style={{
+          minWidth: "13.625rem",
+          width: "13.625rem",
+          flexShrink: 0,
+          height: "100%",
+        }}
+        data-tour="file-sources"
+      >
         <FileSourceButtons />
       </Grid.Col>
 
       {/* Column 2: File List */}
-      <Grid.Col span="auto" style={{
-        display: 'flex',
-        flexDirection: 'column',
-        height: '100%',
-        minHeight: 0,
-        minWidth: 0,
-        flex: '1 1 0px'
-      }}>
-        <div style={{
-          flex: 1,
-          display: 'flex',
-          flexDirection: 'column',
-          backgroundColor: 'var(--bg-file-list)',
-          border: '1px solid var(--mantine-color-gray-2)',
-          boxShadow: '0 2px 8px rgba(0, 0, 0, 0.1)',
-          overflow: 'hidden'
-        }}>
-          {activeSource === 'recent' && (
+      <Grid.Col
+        span="auto"
+        style={{
+          display: "flex",
+          flexDirection: "column",
+          height: "100%",
+          minHeight: 0,
+          minWidth: 0,
+          flex: "1 1 0px",
+        }}
+      >
+        <div
+          style={{
+            flex: 1,
+            display: "flex",
+            flexDirection: "column",
+            backgroundColor: "var(--bg-file-list)",
+            border: "1px solid var(--mantine-color-gray-2)",
+            boxShadow: "0 2px 8px rgba(0, 0, 0, 0.1)",
+            overflow: "hidden",
+          }}
+        >
+          {activeSource === "recent" && (
             <>
-              <div style={{
-                flexShrink: 0,
-                borderBottom: '1px solid var(--mantine-color-gray-3)'
-              }}>
+              <div
+                style={{
+                  flexShrink: 0,
+                  borderBottom: "1px solid var(--mantine-color-gray-3)",
+                }}
+              >
                 <SearchInput />
               </div>
-              <div style={{
-                flexShrink: 0,
-                borderBottom: '1px solid var(--mantine-color-gray-3)'
-              }}>
+              <div
+                style={{
+                  flexShrink: 0,
+                  borderBottom: "1px solid var(--mantine-color-gray-3)",
+                }}
+              >
                 <FileActions />
               </div>
             </>
           )}
 
-          <div style={{ flex: 1, minHeight: 0, overflow: 'hidden' }}>
+          <div style={{ flex: 1, minHeight: 0, overflow: "hidden" }}>
             <FileListArea
-              scrollAreaHeight={activeSource === 'recent' && recentFiles.length > 0
-                ? `calc(${modalHeight} - 7rem)`
-                : '100%'}
-              scrollAreaStyle={{
-                height: activeSource === 'recent' && recentFiles.length > 0
+              scrollAreaHeight={
+                activeSource === "recent" && recentFiles.length > 0
                   ? `calc(${modalHeight} - 7rem)`
-                  : '100%',
-                backgroundColor: 'transparent',
-                border: 'none',
-                borderRadius: 0
+                  : "100%"
+              }
+              scrollAreaStyle={{
+                height:
+                  activeSource === "recent" && recentFiles.length > 0
+                    ? `calc(${modalHeight} - 7rem)`
+                    : "100%",
+                backgroundColor: "transparent",
+                border: "none",
+                borderRadius: 0,
               }}
             />
           </div>
@@ -81,14 +99,18 @@ const DesktopLayout: React.FC = () => {
       </Grid.Col>
 
       {/* Column 3: File Details */}
-      <Grid.Col p="xl" span="content" style={{
-        minWidth: '25rem',
-        width: '25rem',
-        flexShrink: 0,
-        height: '100%',
-        maxWidth: '18rem'
-      }}>
-        <div style={{ height: '100%', overflow: 'hidden' }}>
+      <Grid.Col
+        p="xl"
+        span="content"
+        style={{
+          minWidth: "25rem",
+          width: "25rem",
+          flexShrink: 0,
+          height: "100%",
+          maxWidth: "18rem",
+        }}
+      >
+        <div style={{ height: "100%", overflow: "hidden" }}>
           <FileDetails />
         </div>
       </Grid.Col>
diff --git a/frontend/src/core/components/fileManager/DragOverlay.tsx b/frontend/src/core/components/fileManager/DragOverlay.tsx
index 976bb940e9..023bb59d14 100644
--- a/frontend/src/core/components/fileManager/DragOverlay.tsx
+++ b/frontend/src/core/components/fileManager/DragOverlay.tsx
@@ -1,7 +1,7 @@
-import React from 'react';
-import { Stack, Text, useMantineTheme, alpha } from '@mantine/core';
-import UploadFileIcon from '@mui/icons-material/UploadFile';
-import { useTranslation } from 'react-i18next';
+import React from "react";
+import { Stack, Text, useMantineTheme, alpha } from "@mantine/core";
+import UploadFileIcon from "@mui/icons-material/UploadFile";
+import { useTranslation } from "react-i18next";
 
 interface DragOverlayProps {
   isVisible: boolean;
@@ -16,29 +16,31 @@ const DragOverlay: React.FC<DragOverlayProps> = ({ isVisible }) => {
   return (
     <div
       style={{
-        position: 'absolute',
+        position: "absolute",
         top: 0,
         left: 0,
         right: 0,
         bottom: 0,
         backgroundColor: alpha(theme.colors.blue[6], 0.1),
         border: `0.125rem dashed ${theme.colors.blue[6]}`,
-        borderRadius: '1.875rem',
-        display: 'flex',
-        alignItems: 'center',
-        justifyContent: 'center',
+        borderRadius: "1.875rem",
+        display: "flex",
+        alignItems: "center",
+        justifyContent: "center",
         zIndex: 1000,
-        pointerEvents: 'none'
+        pointerEvents: "none",
       }}
     >
       <Stack align="center" gap="md">
-        <UploadFileIcon style={{ fontSize: '4rem', color: theme.colors.blue[6] }} />
+        <UploadFileIcon
+          style={{ fontSize: "4rem", color: theme.colors.blue[6] }}
+        />
         <Text size="xl" fw={500} c="blue.6">
-          {t('fileManager.dropFilesHere', 'Drop files here to upload')}
+          {t("fileManager.dropFilesHere", "Drop files here to upload")}
         </Text>
       </Stack>
     </div>
   );
 };
 
-export default DragOverlay;
\ No newline at end of file
+export default DragOverlay;
diff --git a/frontend/src/core/components/fileManager/EmptyFilesState.tsx b/frontend/src/core/components/fileManager/EmptyFilesState.tsx
index 24e79fb120..777b80085c 100644
--- a/frontend/src/core/components/fileManager/EmptyFilesState.tsx
+++ b/frontend/src/core/components/fileManager/EmptyFilesState.tsx
@@ -1,19 +1,17 @@
-import React, { useState } from 'react';
-import { Button, Group, Text, Stack, useMantineColorScheme } from '@mantine/core';
-import HistoryIcon from '@mui/icons-material/History';
-import { useTranslation } from 'react-i18next';
-import { useFileManagerContext } from '@app/contexts/FileManagerContext';
-import LocalIcon from '@app/components/shared/LocalIcon';
-import { useLogoAssets } from '@app/hooks/useLogoAssets';
-import { useFileActionTerminology } from '@app/hooks/useFileActionTerminology';
-import { useFileActionIcons } from '@app/hooks/useFileActionIcons';
+import React, { useState } from "react";
+import { Button, Group, Text, Stack } from "@mantine/core";
+import HistoryIcon from "@mui/icons-material/History";
+import { useTranslation } from "react-i18next";
+import { useFileManagerContext } from "@app/contexts/FileManagerContext";
+import LocalIcon from "@app/components/shared/LocalIcon";
+import { Wordmark } from "@app/components/shared/Wordmark";
+import { useFileActionTerminology } from "@app/hooks/useFileActionTerminology";
+import { useFileActionIcons } from "@app/hooks/useFileActionIcons";
 
 const EmptyFilesState: React.FC = () => {
   const { t } = useTranslation();
-  const { colorScheme } = useMantineColorScheme();
   const { onLocalFileClick } = useFileManagerContext();
   const [isUploadHover, setIsUploadHover] = useState(false);
-  const { wordmark } = useLogoAssets();
   const terminology = useFileActionTerminology();
   const icons = useFileActionIcons();
 
@@ -24,81 +22,89 @@ const EmptyFilesState: React.FC = () => {
   return (
     <div
       style={{
-        height: '100%',
-        width: '100%',
-        display: 'flex',
-        alignItems: 'center',
-        justifyContent: 'center',
-        padding: '2rem'
+        height: "100%",
+        width: "100%",
+        display: "flex",
+        alignItems: "center",
+        justifyContent: "center",
+        padding: "2rem",
       }}
     >
       {/* Container */}
       <div
         style={{
-          backgroundColor: 'transparent',
-          padding: '3rem 2rem',
-          display: 'flex',
-          flexDirection: 'column',
-          alignItems: 'center',
-          justifyContent: 'center',
-          gap: '1.5rem',
-          minWidth: '20rem',
-          maxWidth: '28rem',
-          width: '100%'
+          backgroundColor: "transparent",
+          padding: "3rem 2rem",
+          display: "flex",
+          flexDirection: "column",
+          alignItems: "center",
+          justifyContent: "center",
+          gap: "1.5rem",
+          minWidth: "20rem",
+          maxWidth: "28rem",
+          width: "100%",
         }}
       >
         {/* No Recent Files Message */}
         <Stack align="center" gap="sm">
-          <HistoryIcon style={{ fontSize: '3rem', color: 'var(--mantine-color-gray-5)' }} />
+          <HistoryIcon
+            style={{ fontSize: "3rem", color: "var(--mantine-color-gray-5)" }}
+          />
           <Text c="dimmed" ta="center" size="lg">
-            {t('fileManager.noRecentFiles', 'No recent files')}
+            {t("fileManager.noRecentFiles", "No recent files")}
           </Text>
         </Stack>
 
         {/* Stirling PDF Logo */}
         <Group gap="xs" align="center">
-          <img
-            src={colorScheme === 'dark' ? wordmark.white : wordmark.grey}
+          <Wordmark
             alt="Stirling PDF"
-            style={{ height: '2.2rem', width: 'auto' }}
+            muted
+            style={{ height: "2.2rem", width: "auto" }}
           />
         </Group>
 
         {/* Upload Button */}
         <div
           style={{
-            display: 'flex',
-            alignItems: 'center',
-            justifyContent: 'center',
-            width: '100%',
-            marginTop: '0.5rem',
-            marginBottom: '0.5rem'
+            display: "flex",
+            alignItems: "center",
+            justifyContent: "center",
+            width: "100%",
+            marginTop: "0.5rem",
+            marginBottom: "0.5rem",
           }}
           onMouseLeave={() => setIsUploadHover(false)}
         >
           <Button
             aria-label="Upload"
             style={{
-              backgroundColor: 'var(--bg-file-manager)',
-              color: 'var(--landing-button-color)',
-              border: '1px solid var(--landing-button-border)',
-              borderRadius: isUploadHover ? '2rem' : '1rem',
-              height: '38px',
-              width: isUploadHover ? '100%' : '58px',
-              minWidth: '58px',
-              paddingLeft: isUploadHover ? '1rem' : 0,
-              paddingRight: isUploadHover ? '1rem' : 0,
-              display: 'flex',
-              alignItems: 'center',
-              justifyContent: 'center',
-              transition: 'width .5s ease, padding .5s ease, border-radius .5s ease'
+              backgroundColor: "var(--bg-file-manager)",
+              color: "var(--landing-button-color)",
+              border: "1px solid var(--landing-button-border)",
+              borderRadius: isUploadHover ? "2rem" : "1rem",
+              height: "38px",
+              width: isUploadHover ? "100%" : "58px",
+              minWidth: "58px",
+              paddingLeft: isUploadHover ? "1rem" : 0,
+              paddingRight: isUploadHover ? "1rem" : 0,
+              display: "flex",
+              alignItems: "center",
+              justifyContent: "center",
+              transition:
+                "width .5s ease, padding .5s ease, border-radius .5s ease",
             }}
             onClick={handleUploadClick}
             onMouseEnter={() => setIsUploadHover(true)}
           >
-            <LocalIcon icon={icons.uploadIconName} width="1.25rem" height="1.25rem" style={{ color: 'var(--accent-interactive)' }} />
+            <LocalIcon
+              icon={icons.uploadIconName}
+              width="1.25rem"
+              height="1.25rem"
+              style={{ color: "var(--accent-interactive)" }}
+            />
             {isUploadHover && (
-              <span style={{ marginLeft: '.5rem' }}>
+              <span style={{ marginLeft: ".5rem" }}>
                 {terminology.uploadFromComputer}
               </span>
             )}
@@ -108,7 +114,7 @@ const EmptyFilesState: React.FC = () => {
         {/* Instruction Text */}
         <span
           className="text-[var(--accent-interactive)]"
-          style={{ fontSize: '.8rem', textAlign: 'center' }}
+          style={{ fontSize: ".8rem", textAlign: "center" }}
         >
           {terminology.dropFilesHere}
         </span>
diff --git a/frontend/src/core/components/fileManager/FileActions.tsx b/frontend/src/core/components/fileManager/FileActions.tsx
index 2e69c32d35..e228bc9457 100644
--- a/frontend/src/core/components/fileManager/FileActions.tsx
+++ b/frontend/src/core/components/fileManager/FileActions.tsx
@@ -1,5 +1,11 @@
 import React, { useEffect } from "react";
-import { Group, Text, ActionIcon, Tooltip, SegmentedControl } from "@mantine/core";
+import {
+  Group,
+  Text,
+  ActionIcon,
+  Tooltip,
+  SegmentedControl,
+} from "@mantine/core";
 import SelectAllIcon from "@mui/icons-material/SelectAll";
 import DeleteIcon from "@mui/icons-material/Delete";
 import CloudUploadIcon from "@mui/icons-material/CloudUpload";
@@ -30,39 +36,54 @@ const FileActions: React.FC = () => {
     onDownloadSelected,
     refreshRecentFiles,
     storageFilter,
-    onStorageFilterChange
-  } =
-    useFileManagerContext();
+    onStorageFilterChange,
+  } = useFileManagerContext();
   const uploadEnabled = config?.storageEnabled === true;
-  const sharingEnabled = uploadEnabled && config?.storageSharingEnabled === true;
-  const shareLinksEnabled = sharingEnabled && config?.storageShareLinksEnabled === true;
+  const sharingEnabled =
+    uploadEnabled && config?.storageSharingEnabled === true;
+  const shareLinksEnabled =
+    sharingEnabled && config?.storageShareLinksEnabled === true;
   const showStorageFilter = uploadEnabled;
   const storageFilterOptions = sharingEnabled
     ? [
         { value: "all", label: t("fileManager.filterAll", "All") },
         { value: "local", label: t("fileManager.filterLocal", "Local") },
-        { value: "sharedWithMe", label: t("fileManager.filterSharedWithMe", "Shared with me") },
-        { value: "sharedByMe", label: t("fileManager.filterSharedByMe", "Shared by me") }
+        {
+          value: "sharedWithMe",
+          label: t("fileManager.filterSharedWithMe", "Shared with me"),
+        },
+        {
+          value: "sharedByMe",
+          label: t("fileManager.filterSharedByMe", "Shared by me"),
+        },
       ]
     : [
         { value: "all", label: t("fileManager.filterAll", "All") },
-        { value: "local", label: t("fileManager.filterLocal", "Local") }
+        { value: "local", label: t("fileManager.filterLocal", "Local") },
       ];
   useEffect(() => {
-    if (!sharingEnabled && (storageFilter === "sharedWithMe" || storageFilter === "sharedByMe")) {
+    if (
+      !sharingEnabled &&
+      (storageFilter === "sharedWithMe" || storageFilter === "sharedByMe")
+    ) {
       onStorageFilterChange("all");
     }
   }, [sharingEnabled, storageFilter, onStorageFilterChange]);
   const hasSelection = selectedFileIds.length > 0;
-  const hasOnlyOwnedSelection = selectedFiles.every((file) => file.remoteOwnedByCurrentUser !== false);
+  const hasOnlyOwnedSelection = selectedFiles.every(
+    (file) => file.remoteOwnedByCurrentUser !== false,
+  );
   const hasDownloadAccess = selectedFiles.every((file) => {
-    const role = (file.remoteOwnedByCurrentUser !== false
-      ? 'editor'
-      : (file.remoteAccessRole ?? 'viewer')).toLowerCase();
-    return role === 'editor' || role === 'commenter' || role === 'viewer';
+    const role = (
+      file.remoteOwnedByCurrentUser !== false
+        ? "editor"
+        : (file.remoteAccessRole ?? "viewer")
+    ).toLowerCase();
+    return role === "editor" || role === "commenter" || role === "viewer";
   });
   const canBulkUpload = uploadEnabled && hasSelection && hasOnlyOwnedSelection;
-  const canBulkShare = shareLinksEnabled && hasSelection && hasOnlyOwnedSelection;
+  const canBulkShare =
+    shareLinksEnabled && hasSelection && hasOnlyOwnedSelection;
 
   const handleSelectAll = () => {
     onSelectAll();
@@ -80,13 +101,13 @@ const FileActions: React.FC = () => {
     }
   };
 
-
   // Only show actions if there are files
   if (recentFiles.length === 0) {
     return null;
   }
 
-  const allFilesSelected = filteredFiles.length > 0 && selectedFileIds.length === filteredFiles.length;
+  const allFilesSelected =
+    filteredFiles.length > 0 && selectedFileIds.length === filteredFiles.length;
 
   return (
     <div
@@ -103,7 +124,11 @@ const FileActions: React.FC = () => {
       {/* Left: Select All + Filter */}
       <Group gap="xs">
         <Tooltip
-          label={allFilesSelected ? t("fileManager.deselectAll", "Deselect All") : t("fileManager.selectAll", "Select All")}
+          label={
+            allFilesSelected
+              ? t("fileManager.deselectAll", "Deselect All")
+              : t("fileManager.selectAll", "Select All")
+          }
         >
           <ActionIcon
             variant="light"
@@ -121,7 +146,9 @@ const FileActions: React.FC = () => {
             size="xs"
             value={storageFilter}
             onChange={(value) =>
-              onStorageFilterChange(value as "all" | "local" | "sharedWithMe" | "sharedByMe")
+              onStorageFilterChange(
+                value as "all" | "local" | "sharedWithMe" | "sharedByMe",
+              )
             }
             data={storageFilterOptions}
           />
@@ -138,7 +165,9 @@ const FileActions: React.FC = () => {
       >
         {hasSelection && (
           <Text size="sm" c="dimmed" fw={500}>
-            {t("fileManager.selectedCount", "{{count}} selected", { count: selectedFileIds.length })}
+            {t("fileManager.selectedCount", "{{count}} selected", {
+              count: selectedFileIds.length,
+            })}
           </Text>
         )}
       </div>
diff --git a/frontend/src/core/components/fileManager/FileDetails.tsx b/frontend/src/core/components/fileManager/FileDetails.tsx
index c2afc47769..dd6b3e7143 100644
--- a/frontend/src/core/components/fileManager/FileDetails.tsx
+++ b/frontend/src/core/components/fileManager/FileDetails.tsx
@@ -1,26 +1,25 @@
-import React, { useEffect, useState } from 'react';
-import { Stack, Button, Box } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { useIndexedDBThumbnail } from '@app/hooks/useIndexedDBThumbnail';
-import { useFileManagerContext } from '@app/contexts/FileManagerContext';
-import FilePreview from '@app/components/shared/FilePreview';
-import FileInfoCard from '@app/components/fileManager/FileInfoCard';
-import CompactFileDetails from '@app/components/fileManager/CompactFileDetails';
+import React, { useEffect, useState } from "react";
+import { Stack, Button, Box } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import { useIndexedDBThumbnail } from "@app/hooks/useIndexedDBThumbnail";
+import { useFileManagerContext } from "@app/contexts/FileManagerContext";
+import FilePreview from "@app/components/shared/FilePreview";
+import FileInfoCard from "@app/components/fileManager/FileInfoCard";
+import CompactFileDetails from "@app/components/fileManager/CompactFileDetails";
 
 interface FileDetailsProps {
   compact?: boolean;
 }
 
-const FileDetails: React.FC<FileDetailsProps> = ({
-  compact = false
-}) => {
+const FileDetails: React.FC<FileDetailsProps> = ({ compact = false }) => {
   const { selectedFiles, onOpenFiles, modalHeight } = useFileManagerContext();
   const { t } = useTranslation();
   const [currentFileIndex, setCurrentFileIndex] = useState(0);
   const [isAnimating, setIsAnimating] = useState(false);
 
   // Get the currently displayed file
-  const currentFile = selectedFiles.length > 0 ? selectedFiles[currentFileIndex] : null;
+  const currentFile =
+    selectedFiles.length > 0 ? selectedFiles[currentFileIndex] : null;
   const hasSelection = selectedFiles.length > 0;
 
   // Use IndexedDB hook for the current file
@@ -35,7 +34,9 @@ const FileDetails: React.FC<FileDetailsProps> = ({
     if (isAnimating) return;
     setIsAnimating(true);
     setTimeout(() => {
-      setCurrentFileIndex(prev => prev > 0 ? prev - 1 : selectedFiles.length - 1);
+      setCurrentFileIndex((prev) =>
+        prev > 0 ? prev - 1 : selectedFiles.length - 1,
+      );
       setIsAnimating(false);
     }, 150);
   };
@@ -44,7 +45,9 @@ const FileDetails: React.FC<FileDetailsProps> = ({
     if (isAnimating) return;
     setIsAnimating(true);
     setTimeout(() => {
-      setCurrentFileIndex(prev => prev < selectedFiles.length - 1 ? prev + 1 : 0);
+      setCurrentFileIndex((prev) =>
+        prev < selectedFiles.length - 1 ? prev + 1 : 0,
+      );
       setIsAnimating(false);
     }, 150);
   };
@@ -75,7 +78,14 @@ const FileDetails: React.FC<FileDetailsProps> = ({
   return (
     <Stack gap="lg" h={`calc(${modalHeight} - 2rem)`} justify="flex-start">
       {/* Section 1: Thumbnail Preview */}
-      <Box style={{ width: '100%', height: 'min(35vh, 280px)', textAlign: 'center', flexShrink: 0 }}>
+      <Box
+        style={{
+          width: "100%",
+          height: "min(35vh, 280px)",
+          textAlign: "center",
+          flexShrink: 0,
+        }}
+      >
         <FilePreview
           file={currentFile}
           thumbnail={getCurrentThumbnail()}
@@ -89,10 +99,7 @@ const FileDetails: React.FC<FileDetailsProps> = ({
       </Box>
 
       {/* Section 2: File Details */}
-      <FileInfoCard
-        currentFile={currentFile}
-        modalHeight={modalHeight}
-      />
+      <FileInfoCard currentFile={currentFile} modalHeight={modalHeight} />
 
       <Button
         size="md"
@@ -100,14 +107,15 @@ const FileDetails: React.FC<FileDetailsProps> = ({
         disabled={!hasSelection}
         fullWidth
         style={{
-          backgroundColor: hasSelection ? 'var(--btn-open-file)' : 'var(--mantine-color-gray-4)',
-          color: 'white'
+          backgroundColor: hasSelection
+            ? "var(--btn-open-file)"
+            : "var(--mantine-color-gray-4)",
+          color: "white",
         }}
       >
         {selectedFiles.length > 1
-          ? t('fileManager.openFiles', `Open ${selectedFiles.length} Files`)
-          : t('fileManager.openFile', 'Open File')
-        }
+          ? t("fileManager.openFiles", `Open ${selectedFiles.length} Files`)
+          : t("fileManager.openFile", "Open File")}
       </Button>
     </Stack>
   );
diff --git a/frontend/src/core/components/fileManager/FileHistoryGroup.tsx b/frontend/src/core/components/fileManager/FileHistoryGroup.tsx
index 75d8f0e50d..cda54edf71 100644
--- a/frontend/src/core/components/fileManager/FileHistoryGroup.tsx
+++ b/frontend/src/core/components/fileManager/FileHistoryGroup.tsx
@@ -1,8 +1,8 @@
-import React from 'react';
-import { Box, Text, Collapse, Group } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { StirlingFileStub } from '@app/types/fileContext';
-import FileListItem from '@app/components/fileManager/FileListItem';
+import React from "react";
+import { Box, Text, Collapse, Group } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import { StirlingFileStub } from "@app/types/fileContext";
+import FileListItem from "@app/components/fileManager/FileListItem";
 
 interface FileHistoryGroupProps {
   leafFile: StirlingFileStub;
@@ -27,7 +27,7 @@ const FileHistoryGroup: React.FC<FileHistoryGroupProps> = ({
 
   // Sort history files by version number (oldest first, excluding the current leaf file)
   const sortedHistory = historyFiles
-    .filter(file => file.id !== leafFile.id) // Exclude the leaf file itself
+    .filter((file) => file.id !== leafFile.id) // Exclude the leaf file itself
     .sort((a, b) => (b.versionNumber || 1) - (a.versionNumber || 1));
 
   if (!isExpanded || sortedHistory.length === 0) {
@@ -39,7 +39,8 @@ const FileHistoryGroup: React.FC<FileHistoryGroupProps> = ({
       <Box ml="md" mt="xs" mb="sm">
         <Group align="center" mb="sm">
           <Text size="xs" fw={600} c="dimmed">
-            {t('fileManager.fileHistory', 'File History')} ({sortedHistory.length})
+            {t("fileManager.fileHistory", "File History")} (
+            {sortedHistory.length})
           </Text>
         </Group>
 
diff --git a/frontend/src/core/components/fileManager/FileInfoCard.tsx b/frontend/src/core/components/fileManager/FileInfoCard.tsx
index 182fcded9d..594442aefb 100644
--- a/frontend/src/core/components/fileManager/FileInfoCard.tsx
+++ b/frontend/src/core/components/fileManager/FileInfoCard.tsx
@@ -1,13 +1,23 @@
-import React, { useMemo, useState } from 'react';
-import { Stack, Card, Box, Text, Badge, Group, Divider, ScrollArea, Button } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { detectFileExtension, getFileSize } from '@app/utils/fileUtils';
-import { StirlingFileStub } from '@app/types/fileContext';
-import ToolChain from '@app/components/shared/ToolChain';
-import { PrivateContent } from '@app/components/shared/PrivateContent';
-import { useFileManagerContext } from '@app/contexts/FileManagerContext';
-import ShareManagementModal from '@app/components/shared/ShareManagementModal';
-import { useAppConfig } from '@app/contexts/AppConfigContext';
+import React, { useMemo, useState } from "react";
+import {
+  Stack,
+  Card,
+  Box,
+  Text,
+  Badge,
+  Group,
+  Divider,
+  ScrollArea,
+  Button,
+} from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import { detectFileExtension, getFileSize } from "@app/utils/fileUtils";
+import { StirlingFileStub } from "@app/types/fileContext";
+import ToolChain from "@app/components/shared/ToolChain";
+import { PrivateContent } from "@app/components/shared/PrivateContent";
+import { useFileManagerContext } from "@app/contexts/FileManagerContext";
+import ShareManagementModal from "@app/components/shared/ShareManagementModal";
+import { useAppConfig } from "@app/contexts/AppConfigContext";
 
 interface FileInfoCardProps {
   currentFile: StirlingFileStub | null;
@@ -16,7 +26,7 @@ interface FileInfoCardProps {
 
 const FileInfoCard: React.FC<FileInfoCardProps> = ({
   currentFile,
-  modalHeight
+  modalHeight,
 }) => {
   const { t } = useTranslation();
   const { config } = useAppConfig();
@@ -24,57 +34,93 @@ const FileInfoCard: React.FC<FileInfoCardProps> = ({
   const [showShareManageModal, setShowShareManageModal] = useState(false);
   const isSharedWithYou = useMemo(() => {
     if (!currentFile) return false;
-    return currentFile.remoteOwnedByCurrentUser === false || currentFile.remoteSharedViaLink;
+    return (
+      currentFile.remoteOwnedByCurrentUser === false ||
+      currentFile.remoteSharedViaLink
+    );
   }, [currentFile]);
   const isOwnedRemote = useMemo(() => {
     if (!currentFile) return false;
-    return Boolean(currentFile.remoteStorageId) && currentFile.remoteOwnedByCurrentUser !== false;
+    return (
+      Boolean(currentFile.remoteStorageId) &&
+      currentFile.remoteOwnedByCurrentUser !== false
+    );
   }, [currentFile]);
-  const localUpdatedAt = currentFile?.createdAt ?? currentFile?.lastModified ?? 0;
+  const localUpdatedAt =
+    currentFile?.createdAt ?? currentFile?.lastModified ?? 0;
   const remoteUpdatedAt = currentFile?.remoteStorageUpdatedAt ?? 0;
   const isUploaded = Boolean(currentFile?.remoteStorageId);
   const isUpToDate = isUploaded && remoteUpdatedAt >= localUpdatedAt;
   const isOutOfSync = isUploaded && !isUpToDate && isOwnedRemote;
-  const isLocalOnly = !currentFile?.remoteStorageId && !currentFile?.remoteSharedViaLink;
+  const isLocalOnly =
+    !currentFile?.remoteStorageId && !currentFile?.remoteSharedViaLink;
   const isSharedByYou = useMemo(() => {
     if (!currentFile) return false;
     return isOwnedRemote && Boolean(currentFile.remoteHasShareLinks);
   }, [currentFile, isOwnedRemote]);
   const uploadEnabled = config?.storageEnabled === true;
-  const sharingEnabled = uploadEnabled && config?.storageSharingEnabled === true;
+  const sharingEnabled =
+    uploadEnabled && config?.storageSharingEnabled === true;
   const ownerLabel = useMemo(() => {
-    if (!currentFile) return '';
+    if (!currentFile) return "";
     if (currentFile.remoteOwnerUsername) {
       return currentFile.remoteOwnerUsername;
     }
-    return t('fileManager.ownerUnknown', 'Unknown');
+    return t("fileManager.ownerUnknown", "Unknown");
   }, [currentFile, t]);
   const lastSyncedLabel = useMemo(() => {
-    if (!currentFile?.remoteStorageUpdatedAt) return '';
+    if (!currentFile?.remoteStorageUpdatedAt) return "";
     return new Date(currentFile.remoteStorageUpdatedAt).toLocaleString();
   }, [currentFile?.remoteStorageUpdatedAt]);
 
   return (
-    <Card withBorder p={0} mah={`calc(${modalHeight} * 0.45)`} style={{ overflow: 'hidden', flexShrink: 1, display: 'flex', flexDirection: 'column' }}>
-      <Box bg="gray.4" p="sm" style={{ borderTopLeftRadius: 'var(--mantine-radius-md)', borderTopRightRadius: 'var(--mantine-radius-md)', flexShrink: 0 }}>
+    <Card
+      withBorder
+      p={0}
+      mah={`calc(${modalHeight} * 0.45)`}
+      style={{
+        overflow: "hidden",
+        flexShrink: 1,
+        display: "flex",
+        flexDirection: "column",
+      }}
+    >
+      <Box
+        bg="gray.4"
+        p="sm"
+        style={{
+          borderTopLeftRadius: "var(--mantine-radius-md)",
+          borderTopRightRadius: "var(--mantine-radius-md)",
+          flexShrink: 0,
+        }}
+      >
         <Text size="sm" fw={500} ta="center" c="white">
-          {t('fileManager.details', 'File Details')}
+          {t("fileManager.details", "File Details")}
         </Text>
       </Box>
       <ScrollArea style={{ flex: 1, minHeight: 0 }} p="md">
         <Stack gap="sm">
           <Group justify="space-between" py="xs">
             <Text size="sm" c="dimmed">
-              <PrivateContent>{t('fileManager.fileName', 'Name')}</PrivateContent>
+              <PrivateContent>
+                {t("fileManager.fileName", "Name")}
+              </PrivateContent>
             </Text>
-            <Text size="sm" fw={500} style={{ maxWidth: '60%', textAlign: 'right' }} truncate>
-              {currentFile ? currentFile.name : ''}
+            <Text
+              size="sm"
+              fw={500}
+              style={{ maxWidth: "60%", textAlign: "right" }}
+              truncate
+            >
+              {currentFile ? currentFile.name : ""}
             </Text>
           </Group>
           <Divider />
 
           <Group justify="space-between" py="xs">
-            <Text size="sm" c="dimmed">{t('fileManager.fileFormat', 'Format')}</Text>
+            <Text size="sm" c="dimmed">
+              {t("fileManager.fileFormat", "Format")}
+            </Text>
             {currentFile ? (
               <Badge size="sm" variant="light">
                 {detectFileExtension(currentFile.name).toUpperCase()}
@@ -86,38 +132,54 @@ const FileInfoCard: React.FC<FileInfoCardProps> = ({
           <Divider />
 
           <Group justify="space-between" py="xs">
-            <Text size="sm" c="dimmed">{t('fileManager.fileSize', 'Size')}</Text>
+            <Text size="sm" c="dimmed">
+              {t("fileManager.fileSize", "Size")}
+            </Text>
             <Text size="sm" fw={500}>
-              {currentFile ? getFileSize(currentFile) : ''}
+              {currentFile ? getFileSize(currentFile) : ""}
             </Text>
           </Group>
           <Divider />
 
           <Group justify="space-between" py="xs">
-            <Text size="sm" c="dimmed">{t('fileManager.lastModified', 'Last modified')}</Text>
+            <Text size="sm" c="dimmed">
+              {t("fileManager.lastModified", "Last modified")}
+            </Text>
             <Text size="sm" fw={500}>
-              {currentFile ? new Date(currentFile.lastModified).toLocaleDateString() : ''}
+              {currentFile
+                ? new Date(currentFile.lastModified).toLocaleDateString()
+                : ""}
             </Text>
           </Group>
           <Divider />
 
           <Group justify="space-between" py="xs">
-            <Text size="sm" c="dimmed">{t('fileManager.fileVersion', 'Version')}</Text>
-            {currentFile &&
-              <Badge size="sm" variant="light" color={currentFile?.versionNumber ? 'blue' : 'gray'}>
-                v{currentFile ? (currentFile.versionNumber || 1) : ''}
-              </Badge>}
-
+            <Text size="sm" c="dimmed">
+              {t("fileManager.fileVersion", "Version")}
+            </Text>
+            {currentFile && (
+              <Badge
+                size="sm"
+                variant="light"
+                color={currentFile?.versionNumber ? "blue" : "gray"}
+              >
+                v{currentFile ? currentFile.versionNumber || 1 : ""}
+              </Badge>
+            )}
           </Group>
           {sharingEnabled && isSharedWithYou && (
             <>
               <Divider />
               <Group justify="space-between" py="xs">
-                <Text size="sm" c="dimmed">{t('fileManager.owner', 'Owner')}</Text>
+                <Text size="sm" c="dimmed">
+                  {t("fileManager.owner", "Owner")}
+                </Text>
                 <Group gap="xs">
-                  <Text size="sm" fw={500}>{ownerLabel}</Text>
+                  <Text size="sm" fw={500}>
+                    {ownerLabel}
+                  </Text>
                   <Badge size="xs" variant="light" color="grape">
-                    {t('fileManager.sharedWithYou', 'Shared with you')}
+                    {t("fileManager.sharedWithYou", "Shared with you")}
                   </Badge>
                 </Group>
               </Group>
@@ -129,7 +191,9 @@ const FileInfoCard: React.FC<FileInfoCardProps> = ({
             <>
               <Divider />
               <Box py="xs">
-                <Text size="xs" c="dimmed" mb="xs">{t('fileManager.toolChain', 'Tools Applied')}</Text>
+                <Text size="xs" c="dimmed" mb="xs">
+                  {t("fileManager.toolChain", "Tools Applied")}
+                </Text>
                 <ToolChain
                   toolChain={currentFile.toolHistory}
                   displayStyle="badges"
@@ -148,7 +212,7 @@ const FileInfoCard: React.FC<FileInfoCardProps> = ({
                 onClick={() => onMakeCopy(currentFile)}
                 fullWidth
               >
-                {t('fileManager.makeCopy', 'Make a copy')}
+                {t("fileManager.makeCopy", "Make a copy")}
               </Button>
             </>
           )}
@@ -157,30 +221,41 @@ const FileInfoCard: React.FC<FileInfoCardProps> = ({
             <>
               <Divider />
               <Group justify="space-between" py="xs">
-                <Text size="sm" c="dimmed">{t('fileManager.cloudFile', 'Cloud file')}</Text>
+                <Text size="sm" c="dimmed">
+                  {t("fileManager.cloudFile", "Cloud file")}
+                </Text>
                 {uploadEnabled && isOutOfSync ? (
                   <Badge size="xs" variant="light" color="yellow">
-                    {t('fileManager.changesNotUploaded', 'Changes not uploaded')}
+                    {t(
+                      "fileManager.changesNotUploaded",
+                      "Changes not uploaded",
+                    )}
                   </Badge>
                 ) : uploadEnabled ? (
                   <Badge size="xs" variant="light" color="teal">
-                    {t('fileManager.synced', 'Synced')}
+                    {t("fileManager.synced", "Synced")}
                   </Badge>
                 ) : null}
               </Group>
               {lastSyncedLabel && (
                 <Group justify="space-between" py="xs">
-                  <Text size="sm" c="dimmed">{t('fileManager.lastSynced', 'Last synced')}</Text>
-                  <Text size="sm" fw={500}>{lastSyncedLabel}</Text>
+                  <Text size="sm" c="dimmed">
+                    {t("fileManager.lastSynced", "Last synced")}
+                  </Text>
+                  <Text size="sm" fw={500}>
+                    {lastSyncedLabel}
+                  </Text>
                 </Group>
               )}
               {isSharedByYou && sharingEnabled && (
                 <>
                   <Divider />
                   <Group justify="space-between" py="xs">
-                    <Text size="sm" c="dimmed">{t('fileManager.sharing', 'Sharing')}</Text>
+                    <Text size="sm" c="dimmed">
+                      {t("fileManager.sharing", "Sharing")}
+                    </Text>
                     <Badge size="xs" variant="light" color="blue">
-                      {t('fileManager.sharedByYou', 'Shared by you')}
+                      {t("fileManager.sharedByYou", "Shared by you")}
                     </Badge>
                   </Group>
                   <Button
@@ -189,7 +264,7 @@ const FileInfoCard: React.FC<FileInfoCardProps> = ({
                     onClick={() => setShowShareManageModal(true)}
                     fullWidth
                   >
-                    {t('storageShare.manage', 'Manage sharing')}
+                    {t("storageShare.manage", "Manage sharing")}
                   </Button>
                 </>
               )}
@@ -199,9 +274,16 @@ const FileInfoCard: React.FC<FileInfoCardProps> = ({
             <>
               <Divider />
               <Group justify="space-between" py="xs">
-                <Text size="sm" c="dimmed">{t('fileManager.storageState', 'Storage')}</Text>
-                <Badge size="xs" variant="light" color="gray">
-                  {t('fileManager.localOnly', 'Local only')}
+                <Text size="sm" c="dimmed">
+                  {t("fileManager.storageState", "Storage")}
+                </Text>
+                <Badge
+                  size="xs"
+                  variant="default"
+                  c="dimmed"
+                  style={{ opacity: 0.75 }}
+                >
+                  {t("fileManager.localOnly", "Local only")}
                 </Badge>
               </Group>
             </>
diff --git a/frontend/src/core/components/fileManager/FileListArea.tsx b/frontend/src/core/components/fileManager/FileListArea.tsx
index 1964dad542..467ac398e1 100644
--- a/frontend/src/core/components/fileManager/FileListArea.tsx
+++ b/frontend/src/core/components/fileManager/FileListArea.tsx
@@ -1,11 +1,11 @@
-import React from 'react';
-import { Center, ScrollArea, Text, Stack } from '@mantine/core';
-import CloudIcon from '@mui/icons-material/Cloud';
-import { useTranslation } from 'react-i18next';
-import FileListItem from '@app/components/fileManager/FileListItem';
-import FileHistoryGroup from '@app/components/fileManager/FileHistoryGroup';
-import EmptyFilesState from '@app/components/fileManager/EmptyFilesState';
-import { useFileManagerContext } from '@app/contexts/FileManagerContext';
+import React from "react";
+import { Center, ScrollArea, Text, Stack } from "@mantine/core";
+import CloudIcon from "@mui/icons-material/Cloud";
+import { useTranslation } from "react-i18next";
+import FileListItem from "@app/components/fileManager/FileListItem";
+import FileHistoryGroup from "@app/components/fileManager/FileHistoryGroup";
+import EmptyFilesState from "@app/components/fileManager/EmptyFilesState";
+import { useFileManagerContext } from "@app/contexts/FileManagerContext";
 
 interface FileListAreaProps {
   scrollAreaHeight: string;
@@ -34,12 +34,12 @@ const FileListArea: React.FC<FileListAreaProps> = ({
   } = useFileManagerContext();
   const { t } = useTranslation();
 
-  if (activeSource === 'recent') {
+  if (activeSource === "recent") {
     return (
       <ScrollArea
         h={scrollAreaHeight}
         style={{
-          ...scrollAreaStyle
+          ...scrollAreaStyle,
         }}
         type="always"
         scrollbarSize={8}
@@ -48,8 +48,10 @@ const FileListArea: React.FC<FileListAreaProps> = ({
           {recentFiles.length === 0 && !isLoading ? (
             <EmptyFilesState />
           ) : recentFiles.length === 0 && isLoading ? (
-            <Center style={{ height: '12.5rem' }}>
-              <Text c="dimmed" ta="center">{t('fileManager.loadingFiles', 'Loading files...')}</Text>
+            <Center style={{ height: "12.5rem" }}>
+              <Text c="dimmed" ta="center">
+                {t("fileManager.loadingFiles", "Loading files...")}
+              </Text>
             </Center>
           ) : (
             filteredFiles.map((file, index) => {
@@ -93,10 +95,17 @@ const FileListArea: React.FC<FileListAreaProps> = ({
 
   // Google Drive placeholder
   return (
-    <Center style={{ height: '12.5rem' }}>
+    <Center style={{ height: "12.5rem" }}>
       <Stack align="center" gap="sm">
-        <CloudIcon style={{ fontSize: '3rem', color: 'var(--mantine-color-gray-5)' }} />
-        <Text c="dimmed" ta="center">{t('fileManager.googleDriveNotAvailable', 'Google Drive integration coming soon')}</Text>
+        <CloudIcon
+          style={{ fontSize: "3rem", color: "var(--mantine-color-gray-5)" }}
+        />
+        <Text c="dimmed" ta="center">
+          {t(
+            "fileManager.googleDriveNotAvailable",
+            "Google Drive integration coming soon",
+          )}
+        </Text>
       </Stack>
     </Center>
   );
diff --git a/frontend/src/core/components/fileManager/FileListItem.tsx b/frontend/src/core/components/fileManager/FileListItem.tsx
index 73ae8bd2a2..88b2b4e58b 100644
--- a/frontend/src/core/components/fileManager/FileListItem.tsx
+++ b/frontend/src/core/components/fileManager/FileListItem.tsx
@@ -1,31 +1,40 @@
-import React, { useCallback, useMemo, useState } from 'react';
-import { Group, Box, Text, ActionIcon, Checkbox, Divider, Menu, Badge } from '@mantine/core';
-import MoreVertIcon from '@mui/icons-material/MoreVert';
-import DeleteIcon from '@mui/icons-material/Delete';
-import DownloadIcon from '@mui/icons-material/Download';
-import HistoryIcon from '@mui/icons-material/History';
-import RestoreIcon from '@mui/icons-material/Restore';
-import UnarchiveIcon from '@mui/icons-material/Unarchive';
-import CloseIcon from '@mui/icons-material/Close';
-import CloudUploadIcon from '@mui/icons-material/CloudUpload';
-import CloudDoneIcon from '@mui/icons-material/CloudDone';
-import LinkIcon from '@mui/icons-material/Link';
-import { useTranslation } from 'react-i18next';
-import { getFileSize, getFileDate } from '@app/utils/fileUtils';
-import { FileId, StirlingFileStub } from '@app/types/fileContext';
-import { useFileManagerContext } from '@app/contexts/FileManagerContext';
-import { zipFileService } from '@app/services/zipFileService';
-import ToolChain from '@app/components/shared/ToolChain';
-import { Z_INDEX_OVER_FILE_MANAGER_MODAL } from '@app/styles/zIndex';
-import { PrivateContent } from '@app/components/shared/PrivateContent';
-import { useFileManagement } from '@app/contexts/FileContext';
-import UploadToServerModal from '@app/components/shared/UploadToServerModal';
-import ShareFileModal from '@app/components/shared/ShareFileModal';
-import { useAppConfig } from '@app/contexts/AppConfigContext';
-import ShareManagementModal from '@app/components/shared/ShareManagementModal';
-import apiClient from '@app/services/apiClient';
-import { absoluteWithBasePath } from '@app/constants/app';
-import { alert } from '@app/components/toast';
+import React, { useCallback, useMemo, useState } from "react";
+import {
+  Group,
+  Box,
+  Text,
+  ActionIcon,
+  Checkbox,
+  Divider,
+  Menu,
+  Badge,
+} from "@mantine/core";
+import MoreVertIcon from "@mui/icons-material/MoreVert";
+import DeleteIcon from "@mui/icons-material/Delete";
+import DownloadIcon from "@mui/icons-material/Download";
+import HistoryIcon from "@mui/icons-material/History";
+import RestoreIcon from "@mui/icons-material/Restore";
+import UnarchiveIcon from "@mui/icons-material/Unarchive";
+import CloseIcon from "@mui/icons-material/Close";
+import CloudUploadIcon from "@mui/icons-material/CloudUpload";
+import CloudDoneIcon from "@mui/icons-material/CloudDone";
+import LinkIcon from "@mui/icons-material/Link";
+import { useTranslation } from "react-i18next";
+import { getFileSize, getFileDate } from "@app/utils/fileUtils";
+import { FileId, StirlingFileStub } from "@app/types/fileContext";
+import { useFileManagerContext } from "@app/contexts/FileManagerContext";
+import { zipFileService } from "@app/services/zipFileService";
+import ToolChain from "@app/components/shared/ToolChain";
+import { Z_INDEX_OVER_FILE_MANAGER_MODAL } from "@app/styles/zIndex";
+import { PrivateContent } from "@app/components/shared/PrivateContent";
+import { useFileManagement } from "@app/contexts/FileContext";
+import UploadToServerModal from "@app/components/shared/UploadToServerModal";
+import ShareFileModal from "@app/components/shared/ShareFileModal";
+import { useAppConfig } from "@app/contexts/AppConfigContext";
+import ShareManagementModal from "@app/components/shared/ShareManagementModal";
+import apiClient from "@app/services/apiClient";
+import { absoluteWithBasePath } from "@app/constants/app";
+import { alert } from "@app/components/toast";
 
 interface FileListItemProps {
   file: StirlingFileStub;
@@ -51,7 +60,7 @@ const FileListItem: React.FC<FileListItemProps> = ({
   onDoubleClick,
   isHistoryFile = false,
   isLatestVersion = false,
-  isActive = false
+  isActive = false,
 }) => {
   const [isHovered, setIsHovered] = useState(false);
   const [isMenuOpen, setIsMenuOpen] = useState(false);
@@ -60,70 +69,96 @@ const FileListItem: React.FC<FileListItemProps> = ({
   const [showShareManageModal, setShowShareManageModal] = useState(false);
   const { t } = useTranslation();
   const { config } = useAppConfig();
-  const {expandedFileIds, onToggleExpansion, onUnzipFile, refreshRecentFiles } = useFileManagerContext();
+  const {
+    expandedFileIds,
+    onToggleExpansion,
+    onUnzipFile,
+    refreshRecentFiles,
+  } = useFileManagerContext();
   const { removeFiles } = useFileManagement();
 
   // Check if this is a ZIP file
   const isZipFile = zipFileService.isZipFileStub(file);
 
   // Check file extension
-  const extLower = (file.name?.match(/\.([a-z0-9]+)$/i)?.[1] || '').toLowerCase();
-  const isCBZ = extLower === 'cbz';
-  const isCBR = extLower === 'cbr';
+  const extLower = (
+    file.name?.match(/\.([a-z0-9]+)$/i)?.[1] || ""
+  ).toLowerCase();
+  const isCBZ = extLower === "cbz";
+  const isCBR = extLower === "cbr";
 
   // Keep item in hovered state if menu is open
   const shouldShowHovered = isHovered || isMenuOpen;
 
   // Get version information for this file
-  const leafFileId = (isLatestVersion ? file.id : (file.originalFileId || file.id)) as FileId;
+  const leafFileId = (
+    isLatestVersion ? file.id : file.originalFileId || file.id
+  ) as FileId;
   const hasVersionHistory = (file.versionNumber || 1) > 1; // Show history for any processed file (v2+)
   const currentVersion = file.versionNumber || 1; // Display original files as v1
   const isExpanded = expandedFileIds.has(leafFileId);
   const uploadEnabled = config?.storageEnabled === true;
-  const sharingEnabled = uploadEnabled && config?.storageSharingEnabled === true;
-  const shareLinksEnabled = sharingEnabled && config?.storageShareLinksEnabled === true;
+  const sharingEnabled =
+    uploadEnabled && config?.storageSharingEnabled === true;
+  const shareLinksEnabled =
+    sharingEnabled && config?.storageShareLinksEnabled === true;
   const isOwnedOrLocal = file.remoteOwnedByCurrentUser !== false;
   const isSharedWithYou =
-    sharingEnabled && (file.remoteOwnedByCurrentUser === false || file.remoteSharedViaLink);
+    sharingEnabled &&
+    (file.remoteOwnedByCurrentUser === false || file.remoteSharedViaLink);
   const localUpdatedAt = file.createdAt ?? file.lastModified ?? 0;
   const remoteUpdatedAt = file.remoteStorageUpdatedAt ?? 0;
   const isUploaded = Boolean(file.remoteStorageId);
   const isUpToDate = isUploaded && remoteUpdatedAt >= localUpdatedAt;
   const isOutOfSync = isUploaded && !isUpToDate && isOwnedOrLocal;
   const isLocalOnly = !file.remoteStorageId && !file.remoteSharedViaLink;
-  const accessRole = (isOwnedOrLocal ? 'editor' : (file.remoteAccessRole ?? 'viewer')).toLowerCase();
-  const hasReadAccess = isOwnedOrLocal || accessRole === 'editor' || accessRole === 'commenter' || accessRole === 'viewer';
-  const canUpload = uploadEnabled && isOwnedOrLocal && isLatestVersion && (!isUploaded || !isUpToDate);
+  const accessRole = (
+    isOwnedOrLocal ? "editor" : (file.remoteAccessRole ?? "viewer")
+  ).toLowerCase();
+  const hasReadAccess =
+    isOwnedOrLocal ||
+    accessRole === "editor" ||
+    accessRole === "commenter" ||
+    accessRole === "viewer";
+  const canUpload =
+    uploadEnabled &&
+    isOwnedOrLocal &&
+    isLatestVersion &&
+    (!isUploaded || !isUpToDate);
   const canShare = shareLinksEnabled && isOwnedOrLocal && isLatestVersion;
-  const canManageShare = sharingEnabled && isOwnedOrLocal && Boolean(file.remoteStorageId);
+  const canManageShare =
+    sharingEnabled && isOwnedOrLocal && Boolean(file.remoteStorageId);
   const canCopyShareLink =
-    shareLinksEnabled && Boolean(file.remoteHasShareLinks) && Boolean(file.remoteStorageId);
+    shareLinksEnabled &&
+    Boolean(file.remoteHasShareLinks) &&
+    Boolean(file.remoteStorageId);
   const canDownloadFile = Boolean(onDownload) && hasReadAccess;
 
   const shareBaseUrl = useMemo(() => {
-    const frontendUrl = (config?.frontendUrl || '').trim();
+    const frontendUrl = (config?.frontendUrl || "").trim();
     if (frontendUrl) {
-      const normalized = frontendUrl.endsWith('/')
+      const normalized = frontendUrl.endsWith("/")
         ? frontendUrl.slice(0, -1)
         : frontendUrl;
       return `${normalized}/share/`;
     }
-    return absoluteWithBasePath('/share/');
+    return absoluteWithBasePath("/share/");
   }, [config?.frontendUrl]);
 
   const handleCopyShareLink = useCallback(async () => {
     if (!file.remoteStorageId) return;
     try {
-      const response = await apiClient.get<{ shareLinks?: Array<{ token?: string }> }>(
-        `/api/v1/storage/files/${file.remoteStorageId}`,
-        { suppressErrorToast: true } as any
-      );
+      const response = await apiClient.get<{
+        shareLinks?: Array<{ token?: string }>;
+      }>(`/api/v1/storage/files/${file.remoteStorageId}`, {
+        suppressErrorToast: true,
+      } as any);
       const links = response.data?.shareLinks ?? [];
       const token = links[links.length - 1]?.token;
       if (!token) {
         alert({
-          alertType: 'warning',
-          title: t('storageShare.noLinks', 'No active share links yet.'),
+          alertType: "warning",
+          title: t("storageShare.noLinks", "No active share links yet."),
           expandable: false,
           durationMs: 2500,
         });
@@ -131,16 +166,16 @@ const FileListItem: React.FC<FileListItemProps> = ({
       }
       await navigator.clipboard.writeText(`${shareBaseUrl}${token}`);
       alert({
-        alertType: 'success',
-        title: t('storageShare.copied', 'Link copied to clipboard'),
+        alertType: "success",
+        title: t("storageShare.copied", "Link copied to clipboard"),
         expandable: false,
         durationMs: 2000,
       });
     } catch (error) {
-      console.error('Failed to copy share link:', error);
+      console.error("Failed to copy share link:", error);
       alert({
-        alertType: 'warning',
-        title: t('storageShare.copyFailed', 'Copy failed'),
+        alertType: "warning",
+        title: t("storageShare.copyFailed", "Copy failed"),
         expandable: false,
         durationMs: 2500,
       });
@@ -152,22 +187,28 @@ const FileListItem: React.FC<FileListItemProps> = ({
       <Box
         p="sm"
         style={{
-          cursor: isHistoryFile || isActive ? 'default' : 'pointer',
+          cursor: isHistoryFile || isActive ? "default" : "pointer",
           backgroundColor: isActive
-              ? 'var(--file-active-bg)'
-              : isSelected
-              ? 'var(--mantine-color-gray-1)'
-              : (shouldShowHovered ? 'var(--mantine-color-gray-1)' : 'var(--bg-file-list)'),
+            ? "var(--file-active-bg)"
+            : isSelected
+              ? "var(--mantine-color-gray-1)"
+              : shouldShowHovered
+                ? "var(--mantine-color-gray-1)"
+                : "var(--bg-file-list)",
           opacity: isSupported ? 1 : 0.5,
-          transition: 'background-color 0.15s ease',
-          userSelect: 'none',
-          WebkitUserSelect: 'none',
-          MozUserSelect: 'none',
-          msUserSelect: 'none',
-          paddingLeft: isHistoryFile ? '2rem' : '0.75rem', // Indent history files
-          borderLeft: isHistoryFile ? '3px solid var(--mantine-color-blue-4)' : 'none' // Visual indicator for history
+          transition: "background-color 0.15s ease",
+          userSelect: "none",
+          WebkitUserSelect: "none",
+          MozUserSelect: "none",
+          msUserSelect: "none",
+          paddingLeft: isHistoryFile ? "2rem" : "0.75rem", // Indent history files
+          borderLeft: isHistoryFile
+            ? "3px solid var(--mantine-color-blue-4)"
+            : "none", // Visual indicator for history
         }}
-        onClick={isHistoryFile || isActive ? undefined : (e) => onSelect(e.shiftKey)}
+        onClick={
+          isHistoryFile || isActive ? undefined : (e) => onSelect(e.shiftKey)
+        }
         onDoubleClick={onDoubleClick}
         onMouseEnter={() => setIsHovered(true)}
         onMouseLeave={() => setIsHovered(false)}
@@ -186,8 +227,8 @@ const FileListItem: React.FC<FileListItemProps> = ({
                 color={isActive ? "green" : undefined}
                 styles={{
                   input: {
-                    cursor: isActive ? 'not-allowed' : 'pointer'
-                  }
+                    cursor: isActive ? "not-allowed" : "pointer",
+                  },
                 }}
               />
             </Box>
@@ -203,12 +244,12 @@ const FileListItem: React.FC<FileListItemProps> = ({
                   size="xs"
                   variant="light"
                   style={{
-                    backgroundColor: 'var(--file-active-badge-bg)',
-                    color: 'var(--file-active-badge-fg)',
-                    border: '1px solid var(--file-active-badge-border)'
+                    backgroundColor: "var(--file-active-badge-bg)",
+                    color: "var(--file-active-badge-fg)",
+                    border: "1px solid var(--file-active-badge-border)",
                   }}
                 >
-                  {t('fileManager.active', 'Active')}
+                  {t("fileManager.active", "Active")}
                 </Badge>
               )}
               <Badge size="xs" variant="light" color={"blue"}>
@@ -216,18 +257,26 @@ const FileListItem: React.FC<FileListItemProps> = ({
               </Badge>
               {sharingEnabled && isSharedWithYou ? (
                 <Badge size="xs" variant="light" color="grape">
-                  {t('fileManager.sharedWithYou', 'Shared with you')}
+                  {t("fileManager.sharedWithYou", "Shared with you")}
                 </Badge>
               ) : null}
-              {sharingEnabled && isSharedWithYou && accessRole && accessRole !== 'editor' ? (
+              {sharingEnabled &&
+              isSharedWithYou &&
+              accessRole &&
+              accessRole !== "editor" ? (
                 <Badge size="xs" variant="light" color="gray">
-                  {accessRole === 'commenter'
-                    ? t('storageShare.roleCommenter', 'Commenter')
-                    : t('storageShare.roleViewer', 'Viewer')}
+                  {accessRole === "commenter"
+                    ? t("storageShare.roleCommenter", "Commenter")
+                    : t("storageShare.roleViewer", "Viewer")}
                 </Badge>
               ) : isLocalOnly ? (
-                <Badge size="xs" variant="light" color="gray">
-                  {t('fileManager.localOnly', 'Local only')}
+                <Badge
+                  size="xs"
+                  variant="default"
+                  c="dimmed"
+                  style={{ opacity: 0.75 }}
+                >
+                  {t("fileManager.localOnly", "Local only")}
                 </Badge>
               ) : uploadEnabled && isOutOfSync ? (
                 <Badge
@@ -236,7 +285,7 @@ const FileListItem: React.FC<FileListItemProps> = ({
                   color="yellow"
                   leftSection={<CloudUploadIcon style={{ fontSize: 12 }} />}
                 >
-                  {t('fileManager.changesNotUploaded', 'Changes not uploaded')}
+                  {t("fileManager.changesNotUploaded", "Changes not uploaded")}
                 </Badge>
               ) : uploadEnabled && isUploaded ? (
                 <Badge
@@ -245,15 +294,16 @@ const FileListItem: React.FC<FileListItemProps> = ({
                   color="teal"
                   leftSection={<CloudDoneIcon style={{ fontSize: 12 }} />}
                 >
-                  {t('fileManager.synced', 'Synced')}
+                  {t("fileManager.synced", "Synced")}
                 </Badge>
               ) : null}
-              {sharingEnabled && file.remoteOwnedByCurrentUser !== false && file.remoteHasShareLinks && (
-                <Badge size="xs" variant="light" color="blue">
-                  {t('fileManager.sharedByYou', 'Shared by you')}
-                </Badge>
-              )}
-
+              {sharingEnabled &&
+                file.remoteOwnedByCurrentUser !== false &&
+                file.remoteHasShareLinks && (
+                  <Badge size="xs" variant="light" color="blue">
+                    {t("fileManager.sharedByYou", "Shared by you")}
+                  </Badge>
+                )}
             </Group>
             <Group gap="xs" align="center">
               <Text size="xs" c="dimmed">
@@ -264,7 +314,7 @@ const FileListItem: React.FC<FileListItemProps> = ({
               {file.toolHistory && file.toolHistory.length > 0 && (
                 <ToolChain
                   toolChain={file.toolHistory}
-                  maxWidth={'150px'}
+                  maxWidth={"150px"}
                   displayStyle="text"
                   size="xs"
                 />
@@ -288,9 +338,9 @@ const FileListItem: React.FC<FileListItemProps> = ({
                 onClick={(e) => e.stopPropagation()}
                 style={{
                   opacity: shouldShowHovered ? 1 : 0,
-                  transform: shouldShowHovered ? 'scale(1)' : 'scale(0.8)',
-                  transition: 'opacity 0.3s ease, transform 0.3s ease',
-                  pointerEvents: shouldShowHovered ? 'auto' : 'none'
+                  transform: shouldShowHovered ? "scale(1)" : "scale(0.8)",
+                  transition: "opacity 0.3s ease, transform 0.3s ease",
+                  pointerEvents: shouldShowHovered ? "auto" : "none",
                 }}
               >
                 <MoreVertIcon style={{ fontSize: 20 }} />
@@ -308,7 +358,7 @@ const FileListItem: React.FC<FileListItemProps> = ({
                       removeFiles([file.id]);
                     }}
                   >
-                    {t('fileManager.closeFile', 'Close File')}
+                    {t("fileManager.closeFile", "Close File")}
                   </Menu.Item>
                   <Menu.Divider />
                 </>
@@ -322,7 +372,7 @@ const FileListItem: React.FC<FileListItemProps> = ({
                     onDownload?.();
                   }}
                 >
-                  {t('fileManager.download', 'Download')}
+                  {t("fileManager.download", "Download")}
                 </Menu.Item>
               )}
 
@@ -335,8 +385,8 @@ const FileListItem: React.FC<FileListItemProps> = ({
                   }}
                 >
                   {isUploaded
-                    ? t('fileManager.updateOnServer', 'Update on Server')
-                    : t('fileManager.uploadToServer', 'Upload to Server')}
+                    ? t("fileManager.updateOnServer", "Update on Server")
+                    : t("fileManager.uploadToServer", "Upload to Server")}
                 </Menu.Item>
               )}
 
@@ -348,7 +398,7 @@ const FileListItem: React.FC<FileListItemProps> = ({
                     setShowShareModal(true);
                   }}
                 >
-                  {t('fileManager.share', 'Share')}
+                  {t("fileManager.share", "Share")}
                 </Menu.Item>
               )}
 
@@ -360,7 +410,7 @@ const FileListItem: React.FC<FileListItemProps> = ({
                     void handleCopyShareLink();
                   }}
                 >
-                  {t('storageShare.copyLink', 'Copy share link')}
+                  {t("storageShare.copyLink", "Copy share link")}
                 </Menu.Item>
               )}
 
@@ -372,7 +422,7 @@ const FileListItem: React.FC<FileListItemProps> = ({
                     setShowShareManageModal(true);
                   }}
                 >
-                  {t('storageShare.manage', 'Manage sharing')}
+                  {t("storageShare.manage", "Manage sharing")}
                 </Menu.Item>
               )}
 
@@ -380,20 +430,15 @@ const FileListItem: React.FC<FileListItemProps> = ({
               {isLatestVersion && hasVersionHistory && (
                 <>
                   <Menu.Item
-                    leftSection={
-                        <HistoryIcon style={{ fontSize: 16 }} />
-                    }
+                    leftSection={<HistoryIcon style={{ fontSize: 16 }} />}
                     onClick={(e) => {
                       e.stopPropagation();
                       onToggleExpansion(leafFileId);
                     }}
                   >
-                    {
-                      (isExpanded ?
-                        t('fileManager.hideHistory', 'Hide History') :
-                        t('fileManager.showHistory', 'Show History')
-                      )
-                    }
+                    {isExpanded
+                      ? t("fileManager.hideHistory", "Hide History")
+                      : t("fileManager.showHistory", "Show History")}
                   </Menu.Item>
                   <Menu.Divider />
                 </>
@@ -408,7 +453,7 @@ const FileListItem: React.FC<FileListItemProps> = ({
                       e.stopPropagation();
                     }}
                   >
-                    {t('fileManager.restore', 'Restore')}
+                    {t("fileManager.restore", "Restore")}
                   </Menu.Item>
                   <Menu.Divider />
                 </>
@@ -424,7 +469,7 @@ const FileListItem: React.FC<FileListItemProps> = ({
                       onUnzipFile(file);
                     }}
                   >
-                    {t('fileManager.unzip', 'Unzip')}
+                    {t("fileManager.unzip", "Unzip")}
                   </Menu.Item>
                   <Menu.Divider />
                 </>
@@ -437,14 +482,13 @@ const FileListItem: React.FC<FileListItemProps> = ({
                   onRemove();
                 }}
               >
-                {t('fileManager.delete', 'Delete')}
+                {t("fileManager.delete", "Delete")}
               </Menu.Item>
-
             </Menu.Dropdown>
           </Menu>
         </Group>
       </Box>
-      { <Divider color="var(--mantine-color-gray-3)" />}
+      {<Divider color="var(--mantine-color-gray-3)" />}
       {canUpload && (
         <UploadToServerModal
           opened={showUploadModal}
diff --git a/frontend/src/core/components/fileManager/FileSourceButtons.tsx b/frontend/src/core/components/fileManager/FileSourceButtons.tsx
index 8695821efd..f6551132cf 100644
--- a/frontend/src/core/components/fileManager/FileSourceButtons.tsx
+++ b/frontend/src/core/components/fileManager/FileSourceButtons.tsx
@@ -1,15 +1,15 @@
-import React, { useState } from 'react';
-import { Stack, Text, Button, Group } from '@mantine/core';
-import HistoryIcon from '@mui/icons-material/History';
-import PhonelinkIcon from '@mui/icons-material/Phonelink';
-import { useTranslation } from 'react-i18next';
-import { useFileManagerContext } from '@app/contexts/FileManagerContext';
-import { useGoogleDrivePicker } from '@app/hooks/useGoogleDrivePicker';
-import { useFileActionTerminology } from '@app/hooks/useFileActionTerminology';
-import { useFileActionIcons } from '@app/hooks/useFileActionIcons';
-import { useAppConfig } from '@app/contexts/AppConfigContext';
-import { useIsMobile } from '@app/hooks/useIsMobile';
-import MobileUploadModal from '@app/components/shared/MobileUploadModal';
+import React, { useState } from "react";
+import { Stack, Text, Button, Group } from "@mantine/core";
+import HistoryIcon from "@mui/icons-material/History";
+import PhonelinkIcon from "@mui/icons-material/Phonelink";
+import { useTranslation } from "react-i18next";
+import { useFileManagerContext } from "@app/contexts/FileManagerContext";
+import { useGoogleDrivePicker } from "@app/hooks/useGoogleDrivePicker";
+import { useFileActionTerminology } from "@app/hooks/useFileActionTerminology";
+import { useFileActionIcons } from "@app/hooks/useFileActionIcons";
+import { useAppConfig } from "@app/contexts/AppConfigContext";
+import { useIsMobile } from "@app/hooks/useIsMobile";
+import MobileUploadModal from "@app/components/shared/MobileUploadModal";
 
 interface FileSourceButtonsProps {
   horizontal?: boolean;
@@ -24,20 +24,27 @@ const GoogleDriveIcon: React.FC<{ disabled?: boolean }> = ({ disabled }) => (
     src="/images/google-drive.svg"
     alt="Google Drive"
     style={{
-      width: '20px',
-      height: '20px',
+      width: "20px",
+      height: "20px",
       opacity: disabled ? 0.5 : 1,
-      filter: disabled ? 'grayscale(100%)' : 'none',
+      filter: disabled ? "grayscale(100%)" : "none",
     }}
   />
 );
 
 const FileSourceButtons: React.FC<FileSourceButtonsProps> = ({
-  horizontal = false
+  horizontal = false,
 }) => {
-  const { activeSource, onSourceChange, onLocalFileClick, onGoogleDriveSelect, onNewFilesSelect } = useFileManagerContext();
+  const {
+    activeSource,
+    onSourceChange,
+    onLocalFileClick,
+    onGoogleDriveSelect,
+    onNewFilesSelect,
+  } = useFileManagerContext();
   const { t } = useTranslation();
-  const { isEnabled: isGoogleDriveEnabled, openPicker: openGoogleDrivePicker } = useGoogleDrivePicker();
+  const { isEnabled: isGoogleDriveEnabled, openPicker: openGoogleDrivePicker } =
+    useGoogleDrivePicker();
   const terminology = useFileActionTerminology();
   const icons = useFileActionIcons();
   const UploadIcon = icons.upload;
@@ -53,7 +60,7 @@ const FileSourceButtons: React.FC<FileSourceButtonsProps> = ({
         onGoogleDriveSelect(files);
       }
     } catch (error) {
-      console.error('Failed to pick files from Google Drive:', error);
+      console.error("Failed to pick files from Google Drive:", error);
     }
   };
 
@@ -68,24 +75,32 @@ const FileSourceButtons: React.FC<FileSourceButtonsProps> = ({
   };
 
   // Determine visibility of Google Drive button
-  const shouldHideGoogleDrive = !isGoogleDriveEnabled && config?.hideDisabledToolsGoogleDrive;
+  const shouldHideGoogleDrive =
+    !isGoogleDriveEnabled && config?.hideDisabledToolsGoogleDrive;
 
   // Determine visibility of Mobile QR Scanner button
-  const shouldHideMobileQR = !isMobileUploadEnabled && config?.hideDisabledToolsMobileQRScanner;
+  const shouldHideMobileQR =
+    !isMobileUploadEnabled && config?.hideDisabledToolsMobileQRScanner;
 
   const buttonProps = {
-    variant: (source: string) => activeSource === source ? 'filled' : 'subtle',
-    getColor: (source: string) => activeSource === source ? 'var(--mantine-color-gray-2)' : undefined,
+    variant: (source: string) =>
+      activeSource === source ? "filled" : "subtle",
+    getColor: (source: string) =>
+      activeSource === source ? "var(--mantine-color-gray-2)" : undefined,
     getStyles: (source: string) => ({
       root: {
-        backgroundColor: activeSource === source ? undefined : 'transparent',
-        color: activeSource === source ? 'var(--mantine-color-gray-9)' : 'var(--mantine-color-gray-6)',
-        border: 'none',
-        '&:hover': {
-          backgroundColor: activeSource === source ? undefined : 'var(--mantine-color-gray-0)'
-        }
-      }
-    })
+        backgroundColor: activeSource === source ? undefined : "transparent",
+        color:
+          activeSource === source
+            ? "var(--mantine-color-gray-9)"
+            : "var(--mantine-color-gray-6)",
+        border: "none",
+        "&:hover": {
+          backgroundColor:
+            activeSource === source ? undefined : "var(--mantine-color-gray-0)",
+        },
+      },
+    }),
   };
 
   const buttons = (
@@ -93,18 +108,20 @@ const FileSourceButtons: React.FC<FileSourceButtonsProps> = ({
       <Button
         leftSection={<HistoryIcon />}
         justify={horizontal ? "center" : "flex-start"}
-        onClick={() => onSourceChange('recent')}
+        onClick={() => onSourceChange("recent")}
         fullWidth={!horizontal}
         size={horizontal ? "xs" : "sm"}
-        color={buttonProps.getColor('recent')}
-        styles={buttonProps.getStyles('recent')}
+        color={buttonProps.getColor("recent")}
+        styles={buttonProps.getStyles("recent")}
       >
-        {horizontal ? t('fileManager.recent', 'Recent') : t('fileManager.recent', 'Recent')}
+        {horizontal
+          ? t("fileManager.recent", "Recent")
+          : t("fileManager.recent", "Recent")}
       </Button>
 
       <Button
         variant="subtle"
-        color='var(--mantine-color-gray-6)'
+        color="var(--mantine-color-gray-6)"
         leftSection={<UploadIcon />}
         justify={horizontal ? "center" : "flex-start"}
         onClick={onLocalFileClick}
@@ -112,12 +129,12 @@ const FileSourceButtons: React.FC<FileSourceButtonsProps> = ({
         size={horizontal ? "xs" : "sm"}
         styles={{
           root: {
-            backgroundColor: 'transparent',
-            border: 'none',
-            '&:hover': {
-              backgroundColor: 'var(--mantine-color-gray-0)'
-            }
-          }
+            backgroundColor: "transparent",
+            border: "none",
+            "&:hover": {
+              backgroundColor: "var(--mantine-color-gray-0)",
+            },
+          },
         }}
       >
         {horizontal ? terminology.upload : terminology.uploadFiles}
@@ -126,7 +143,7 @@ const FileSourceButtons: React.FC<FileSourceButtonsProps> = ({
       {!shouldHideGoogleDrive && (
         <Button
           variant="subtle"
-          color='var(--mantine-color-gray-6)'
+          color="var(--mantine-color-gray-6)"
           leftSection={<GoogleDriveIcon disabled={!isGoogleDriveEnabled} />}
           justify={horizontal ? "center" : "flex-start"}
           onClick={handleGoogleDriveClick}
@@ -135,23 +152,34 @@ const FileSourceButtons: React.FC<FileSourceButtonsProps> = ({
           disabled={!isGoogleDriveEnabled}
           styles={{
             root: {
-              backgroundColor: 'transparent',
-              border: 'none',
-              '&:hover': {
-                backgroundColor: isGoogleDriveEnabled ? 'var(--mantine-color-gray-0)' : 'transparent'
-              }
-            }
+              backgroundColor: "transparent",
+              border: "none",
+              "&:hover": {
+                backgroundColor: isGoogleDriveEnabled
+                  ? "var(--mantine-color-gray-0)"
+                  : "transparent",
+              },
+            },
           }}
-          title={!isGoogleDriveEnabled ? t('fileManager.googleDriveNotAvailable', 'Google Drive integration not available') : undefined}
+          title={
+            !isGoogleDriveEnabled
+              ? t(
+                  "fileManager.googleDriveNotAvailable",
+                  "Google Drive integration not available",
+                )
+              : undefined
+          }
         >
-          {horizontal ? t('fileManager.googleDriveShort', 'Drive') : t('fileManager.googleDrive', 'Google Drive')}
+          {horizontal
+            ? t("fileManager.googleDriveShort", "Drive")
+            : t("fileManager.googleDrive", "Google Drive")}
         </Button>
       )}
 
       {!shouldHideMobileQR && (
         <Button
           variant="subtle"
-          color='var(--mantine-color-gray-6)'
+          color="var(--mantine-color-gray-6)"
           leftSection={<PhonelinkIcon />}
           justify={horizontal ? "center" : "flex-start"}
           onClick={handleMobileUploadClick}
@@ -160,16 +188,27 @@ const FileSourceButtons: React.FC<FileSourceButtonsProps> = ({
           disabled={!isMobileUploadEnabled}
           styles={{
             root: {
-              backgroundColor: 'transparent',
-              border: 'none',
-              '&:hover': {
-                backgroundColor: isMobileUploadEnabled ? 'var(--mantine-color-gray-0)' : 'transparent'
-              }
-            }
+              backgroundColor: "transparent",
+              border: "none",
+              "&:hover": {
+                backgroundColor: isMobileUploadEnabled
+                  ? "var(--mantine-color-gray-0)"
+                  : "transparent",
+              },
+            },
           }}
-          title={!isMobileUploadEnabled ? t('fileManager.mobileUploadNotAvailable', 'Mobile upload not available') : undefined}
+          title={
+            !isMobileUploadEnabled
+              ? t(
+                  "fileManager.mobileUploadNotAvailable",
+                  "Mobile upload not available",
+                )
+              : undefined
+          }
         >
-          {horizontal ? t('fileManager.mobileShort', 'Mobile') : t('fileManager.mobileUpload', 'Mobile Upload')}
+          {horizontal
+            ? t("fileManager.mobileShort", "Mobile")
+            : t("fileManager.mobileUpload", "Mobile Upload")}
         </Button>
       )}
     </>
@@ -178,7 +217,7 @@ const FileSourceButtons: React.FC<FileSourceButtonsProps> = ({
   if (horizontal) {
     return (
       <>
-        <Group gap="xs" justify="center" style={{ width: '100%' }}>
+        <Group gap="xs" justify="center" style={{ width: "100%" }}>
           {buttons}
         </Group>
         <MobileUploadModal
@@ -192,9 +231,16 @@ const FileSourceButtons: React.FC<FileSourceButtonsProps> = ({
 
   return (
     <>
-      <Stack gap="xs" style={{ height: '100%' }}>
-        <Text size="sm" pt="sm" fw={500} c="dimmed" mb="xs" style={{ paddingLeft: '1rem' }}>
-          {t('fileManager.myFiles', 'My Files')}
+      <Stack gap="xs" style={{ height: "100%" }}>
+        <Text
+          size="sm"
+          pt="sm"
+          fw={500}
+          c="dimmed"
+          mb="xs"
+          style={{ paddingLeft: "1rem" }}
+        >
+          {t("fileManager.myFiles", "My Files")}
         </Text>
         {buttons}
       </Stack>
diff --git a/frontend/src/core/components/fileManager/HiddenFileInput.tsx b/frontend/src/core/components/fileManager/HiddenFileInput.tsx
index 27482df519..fce23187cd 100644
--- a/frontend/src/core/components/fileManager/HiddenFileInput.tsx
+++ b/frontend/src/core/components/fileManager/HiddenFileInput.tsx
@@ -1,5 +1,5 @@
-import React from 'react';
-import { useFileManagerContext } from '@app/contexts/FileManagerContext';
+import React from "react";
+import { useFileManagerContext } from "@app/contexts/FileManagerContext";
 
 const HiddenFileInput: React.FC = () => {
   const { fileInputRef, onFileInputChange } = useFileManagerContext();
@@ -10,7 +10,7 @@ const HiddenFileInput: React.FC = () => {
       type="file"
       multiple={true}
       onChange={onFileInputChange}
-      style={{ display: 'none' }}
+      style={{ display: "none" }}
       data-testid="file-input"
     />
   );
diff --git a/frontend/src/core/components/fileManager/MobileLayout.tsx b/frontend/src/core/components/fileManager/MobileLayout.tsx
index 0701874852..2545a9d604 100644
--- a/frontend/src/core/components/fileManager/MobileLayout.tsx
+++ b/frontend/src/core/components/fileManager/MobileLayout.tsx
@@ -1,19 +1,15 @@
-import React from 'react';
-import { Box } from '@mantine/core';
-import FileSourceButtons from '@app/components/fileManager/FileSourceButtons';
-import FileDetails from '@app/components/fileManager/FileDetails';
-import SearchInput from '@app/components/fileManager/SearchInput';
-import FileListArea from '@app/components/fileManager/FileListArea';
-import FileActions from '@app/components/fileManager/FileActions';
-import HiddenFileInput from '@app/components/fileManager/HiddenFileInput';
-import { useFileManagerContext } from '@app/contexts/FileManagerContext';
+import React from "react";
+import { Box } from "@mantine/core";
+import FileSourceButtons from "@app/components/fileManager/FileSourceButtons";
+import FileDetails from "@app/components/fileManager/FileDetails";
+import SearchInput from "@app/components/fileManager/SearchInput";
+import FileListArea from "@app/components/fileManager/FileListArea";
+import FileActions from "@app/components/fileManager/FileActions";
+import HiddenFileInput from "@app/components/fileManager/HiddenFileInput";
+import { useFileManagerContext } from "@app/contexts/FileManagerContext";
 
 const MobileLayout: React.FC = () => {
-  const {
-    activeSource,
-    selectedFiles,
-    modalHeight,
-  } = useFileManagerContext();
+  const { activeSource, selectedFiles, modalHeight } = useFileManagerContext();
 
   // Calculate the height more accurately based on actual content
   const calculateFileListHeight = () => {
@@ -21,17 +17,21 @@ const MobileLayout: React.FC = () => {
     const baseHeight = `calc(${modalHeight} - 2rem)`; // Account for Stack padding
 
     // Estimate heights of fixed components
-    const fileSourceHeight = '3rem'; // FileSourceButtons height
-    const fileDetailsHeight = selectedFiles.length > 0 ? '10rem' : '8rem'; // FileDetails compact height
-    const fileActionsHeight = activeSource === 'recent' ? '3rem' : '0rem'; // FileActions height (now at bottom)
-    const searchHeight = activeSource === 'recent' ? '3rem' : '0rem'; // SearchInput height
-    const gapHeight = activeSource === 'recent' ? '3.75rem' : '2rem'; // Stack gaps
+    const fileSourceHeight = "3rem"; // FileSourceButtons height
+    const fileDetailsHeight = selectedFiles.length > 0 ? "10rem" : "8rem"; // FileDetails compact height
+    const fileActionsHeight = activeSource === "recent" ? "3rem" : "0rem"; // FileActions height (now at bottom)
+    const searchHeight = activeSource === "recent" ? "3rem" : "0rem"; // SearchInput height
+    const gapHeight = activeSource === "recent" ? "3.75rem" : "2rem"; // Stack gaps
 
     return `calc(${baseHeight} - ${fileSourceHeight} - ${fileDetailsHeight} - ${fileActionsHeight} - ${searchHeight} - ${gapHeight})`;
   };
 
   return (
-    <Box h="100%" p="sm" style={{ display: 'flex', flexDirection: 'column', gap: '0.75rem' }}>
+    <Box
+      h="100%"
+      p="sm"
+      style={{ display: "flex", flexDirection: "column", gap: "0.75rem" }}
+    >
       {/* Section 1: File Sources - Fixed at top */}
       <Box style={{ flexShrink: 0 }}>
         <FileSourceButtons horizontal={true} />
@@ -42,28 +42,34 @@ const MobileLayout: React.FC = () => {
       </Box>
 
       {/* Section 3 & 4: Search Bar + File List - Unified background extending to modal edge */}
-      <Box style={{
-        flex: 1,
-        display: 'flex',
-        flexDirection: 'column',
-        backgroundColor: 'var(--bg-file-list)',
-        borderRadius: '0.5rem',
-        border: '1px solid var(--mantine-color-gray-2)',
-        overflow: 'hidden',
-        minHeight: 0
-      }}>
-        {activeSource === 'recent' && (
+      <Box
+        style={{
+          flex: 1,
+          display: "flex",
+          flexDirection: "column",
+          backgroundColor: "var(--bg-file-list)",
+          borderRadius: "0.5rem",
+          border: "1px solid var(--mantine-color-gray-2)",
+          overflow: "hidden",
+          minHeight: 0,
+        }}
+      >
+        {activeSource === "recent" && (
           <>
-            <Box style={{
-              flexShrink: 0,
-              borderBottom: '1px solid var(--mantine-color-gray-2)'
-            }}>
+            <Box
+              style={{
+                flexShrink: 0,
+                borderBottom: "1px solid var(--mantine-color-gray-2)",
+              }}
+            >
               <SearchInput />
             </Box>
-            <Box style={{
-              flexShrink: 0,
-              borderBottom: '1px solid var(--mantine-color-gray-2)'
-            }}>
+            <Box
+              style={{
+                flexShrink: 0,
+                borderBottom: "1px solid var(--mantine-color-gray-2)",
+              }}
+            >
               <FileActions />
             </Box>
           </>
@@ -74,11 +80,11 @@ const MobileLayout: React.FC = () => {
             scrollAreaHeight={calculateFileListHeight()}
             scrollAreaStyle={{
               height: calculateFileListHeight(),
-              maxHeight: '60vh',
-              minHeight: '9.375rem',
-              backgroundColor: 'transparent',
-              border: 'none',
-              borderRadius: 0
+              maxHeight: "60vh",
+              minHeight: "9.375rem",
+              backgroundColor: "transparent",
+              border: "none",
+              borderRadius: 0,
             }}
           />
         </Box>
diff --git a/frontend/src/core/components/fileManager/SearchInput.tsx b/frontend/src/core/components/fileManager/SearchInput.tsx
index 2b318604c6..b7dbf9306c 100644
--- a/frontend/src/core/components/fileManager/SearchInput.tsx
+++ b/frontend/src/core/components/fileManager/SearchInput.tsx
@@ -1,8 +1,8 @@
-import React from 'react';
-import { TextInput } from '@mantine/core';
-import SearchIcon from '@mui/icons-material/Search';
-import { useTranslation } from 'react-i18next';
-import { useFileManagerContext } from '@app/contexts/FileManagerContext';
+import React from "react";
+import { TextInput } from "@mantine/core";
+import SearchIcon from "@mui/icons-material/Search";
+import { useTranslation } from "react-i18next";
+import { useFileManagerContext } from "@app/contexts/FileManagerContext";
 
 interface SearchInputProps {
   style?: React.CSSProperties;
@@ -14,20 +14,19 @@ const SearchInput: React.FC<SearchInputProps> = ({ style }) => {
 
   return (
     <TextInput
-      placeholder={t('fileManager.searchFiles', 'Search files...')}
+      placeholder={t("fileManager.searchFiles", "Search files...")}
       leftSection={<SearchIcon />}
       value={searchTerm}
       onChange={(e) => onSearchChange(e.target.value)}
-      
-      style={{ padding: '0.5rem', ...style }}
+      style={{ padding: "0.5rem", ...style }}
       styles={{
         input: {
-          border: 'none',
-          backgroundColor: 'transparent'
-        }
+          border: "none",
+          backgroundColor: "transparent",
+        },
       }}
     />
   );
 };
 
-export default SearchInput;
\ No newline at end of file
+export default SearchInput;
diff --git a/frontend/src/core/components/hotkeys/HotkeyDisplay.tsx b/frontend/src/core/components/hotkeys/HotkeyDisplay.tsx
index 7f6d9f26dd..5141499989 100644
--- a/frontend/src/core/components/hotkeys/HotkeyDisplay.tsx
+++ b/frontend/src/core/components/hotkeys/HotkeyDisplay.tsx
@@ -1,29 +1,33 @@
-import React from 'react';
-import { HotkeyBinding } from '@app/utils/hotkeys';
-import { useHotkeys } from '@app/contexts/HotkeyContext';
+import React from "react";
+import { HotkeyBinding } from "@app/utils/hotkeys";
+import { useHotkeys } from "@app/contexts/HotkeyContext";
 
 interface HotkeyDisplayProps {
   binding: HotkeyBinding | null | undefined;
-  size?: 'sm' | 'md';
+  size?: "sm" | "md";
   muted?: boolean;
 }
 
 const baseKeyStyle: React.CSSProperties = {
-  display: 'inline-flex',
-  alignItems: 'center',
-  justifyContent: 'center',
-  borderRadius: '0.375rem',
-  background: 'var(--mantine-color-gray-1)',
-  border: '1px solid var(--mantine-color-gray-3)',
-  padding: '0.125rem 0.35rem',
-  fontSize: '0.75rem',
+  display: "inline-flex",
+  alignItems: "center",
+  justifyContent: "center",
+  borderRadius: "0.375rem",
+  background: "var(--mantine-color-gray-1)",
+  border: "1px solid var(--mantine-color-gray-3)",
+  padding: "0.125rem 0.35rem",
+  fontSize: "0.75rem",
   lineHeight: 1,
-  fontFamily: 'var(--mantine-font-family-monospace, monospace)',
-  minWidth: '1.35rem',
-  color: 'var(--mantine-color-text)',
+  fontFamily: "var(--mantine-font-family-monospace, monospace)",
+  minWidth: "1.35rem",
+  color: "var(--mantine-color-text)",
 };
 
-export const HotkeyDisplay: React.FC<HotkeyDisplayProps> = ({ binding, size = 'sm', muted = false }) => {
+export const HotkeyDisplay: React.FC<HotkeyDisplayProps> = ({
+  binding,
+  size = "sm",
+  muted = false,
+}) => {
   const { getDisplayParts } = useHotkeys();
   const parts = getDisplayParts(binding);
 
@@ -31,24 +35,29 @@ export const HotkeyDisplay: React.FC<HotkeyDisplayProps> = ({ binding, size = 's
     return null;
   }
 
-  const keyStyle = size === 'md'
-    ? { ...baseKeyStyle, fontSize: '0.85rem', padding: '0.2rem 0.5rem' }
-    : baseKeyStyle;
+  const keyStyle =
+    size === "md"
+      ? { ...baseKeyStyle, fontSize: "0.85rem", padding: "0.2rem 0.5rem" }
+      : baseKeyStyle;
 
   return (
     <span
       style={{
-        display: 'inline-flex',
-        alignItems: 'center',
-        gap: '0.25rem',
-        color: muted ? 'var(--mantine-color-dimmed)' : 'inherit',
+        display: "inline-flex",
+        alignItems: "center",
+        gap: "0.25rem",
+        color: muted ? "var(--mantine-color-dimmed)" : "inherit",
         fontWeight: muted ? 500 : 600,
       }}
     >
       {parts.map((part, index) => (
         <React.Fragment key={`${part}-${index}`}>
           <kbd style={keyStyle}>{part}</kbd>
-          {index < parts.length - 1 && <span aria-hidden style={{ fontWeight: 400 }}>+</span>}
+          {index < parts.length - 1 && (
+            <span aria-hidden style={{ fontWeight: 400 }}>
+              +
+            </span>
+          )}
         </React.Fragment>
       ))}
     </span>
diff --git a/frontend/src/core/components/layout/Workbench.tsx b/frontend/src/core/components/layout/Workbench.tsx
index 521ac5db15..97ec71c85e 100644
--- a/frontend/src/core/components/layout/Workbench.tsx
+++ b/frontend/src/core/components/layout/Workbench.tsx
@@ -1,24 +1,28 @@
-import { useCallback } from 'react';
-import { Box } from '@mantine/core';
-import { useRainbowThemeContext } from '@app/components/shared/RainbowThemeProvider';
-import { useToolWorkflow } from '@app/contexts/ToolWorkflowContext';
-import { useFileHandler } from '@app/hooks/useFileHandler';
-import { useFileState, useFileActions } from '@app/contexts/FileContext';
-import { useNavigationState, useNavigationActions, useNavigationGuard } from '@app/contexts/NavigationContext';
-import { isBaseWorkbench } from '@app/types/workbench';
-import { useViewer } from '@app/contexts/ViewerContext';
-import { useAppConfig } from '@app/contexts/AppConfigContext';
-import { FileId } from '@app/types/file';
-import styles from '@app/components/layout/Workbench.module.css';
+import { useCallback } from "react";
+import { Box } from "@mantine/core";
+import { useRainbowThemeContext } from "@app/components/shared/RainbowThemeProvider";
+import { useToolWorkflow } from "@app/contexts/ToolWorkflowContext";
+import { useFileHandler } from "@app/hooks/useFileHandler";
+import { useFileState, useFileActions } from "@app/contexts/FileContext";
+import {
+  useNavigationState,
+  useNavigationActions,
+  useNavigationGuard,
+} from "@app/contexts/NavigationContext";
+import { isBaseWorkbench } from "@app/types/workbench";
+import { useViewer } from "@app/contexts/ViewerContext";
+import { useAppConfig } from "@app/contexts/AppConfigContext";
+import { FileId } from "@app/types/file";
+import styles from "@app/components/layout/Workbench.module.css";
 
-import TopControls from '@app/components/shared/TopControls';
-import FileEditor from '@app/components/fileEditor/FileEditor';
-import PageEditor from '@app/components/pageEditor/PageEditor';
-import PageEditorControls from '@app/components/pageEditor/PageEditorControls';
-import Viewer from '@app/components/viewer/Viewer';
-import LandingPage from '@app/components/shared/LandingPage';
-import Footer from '@app/components/shared/Footer';
-import DismissAllErrorsButton from '@app/components/shared/DismissAllErrorsButton';
+import TopControls from "@app/components/shared/TopControls";
+import FileEditor from "@app/components/fileEditor/FileEditor";
+import PageEditor from "@app/components/pageEditor/PageEditor";
+import PageEditorControls from "@app/components/pageEditor/PageEditorControls";
+import Viewer from "@app/components/viewer/Viewer";
+import LandingPage from "@app/components/shared/LandingPage";
+import Footer from "@app/components/shared/Footer";
+import DismissAllErrorsButton from "@app/components/shared/DismissAllErrorsButton";
 
 // No props needed - component uses contexts directly
 export default function Workbench() {
@@ -54,41 +58,47 @@ export default function Workbench() {
 
   // Get active file index from ViewerContext
   const { activeFileIndex, setActiveFileIndex } = useViewer();
-  
+
   // Get navigation guard for unsaved changes check when switching files
   const { requestNavigation } = useNavigationGuard();
 
   // Wrap file selection to check for unsaved changes before switching
   // requestNavigation will show the modal if there are unsaved changes, otherwise navigate immediately
-  const handleFileSelect = useCallback((index: number) => {
-    // Don't do anything if selecting the same file
-    if (index === activeFileIndex) return;
+  const handleFileSelect = useCallback(
+    (index: number) => {
+      // Don't do anything if selecting the same file
+      if (index === activeFileIndex) return;
 
-    // requestNavigation handles the unsaved changes check internally
-    requestNavigation(() => {
-      setActiveFileIndex(index);
-    });
-  }, [activeFileIndex, requestNavigation, setActiveFileIndex]);
+      // requestNavigation handles the unsaved changes check internally
+      requestNavigation(() => {
+        setActiveFileIndex(index);
+      });
+    },
+    [activeFileIndex, requestNavigation, setActiveFileIndex],
+  );
 
-  const handleFileRemove = useCallback(async (fileId: FileId) => {
-    await fileActions.removeFiles([fileId], false); // false = don't delete from IndexedDB, just remove from context
-  }, [fileActions]);
+  const handleFileRemove = useCallback(
+    async (fileId: FileId) => {
+      await fileActions.removeFiles([fileId], false); // false = don't delete from IndexedDB, just remove from context
+    },
+    [fileActions],
+  );
 
   const handlePreviewClose = () => {
     setPreviewFile(null);
-    const previousMode = sessionStorage.getItem('previousMode');
-    if (previousMode === 'split') {
+    const previousMode = sessionStorage.getItem("previousMode");
+    if (previousMode === "split") {
       // Use context's handleToolSelect which coordinates tool selection and view changes
-      handleToolSelect('split');
-      sessionStorage.removeItem('previousMode');
-    } else if (previousMode === 'compress') {
-      handleToolSelect('compress');
-      sessionStorage.removeItem('previousMode');
-    } else if (previousMode === 'convert') {
-      handleToolSelect('convert');
-      sessionStorage.removeItem('previousMode');
+      handleToolSelect("split");
+      sessionStorage.removeItem("previousMode");
+    } else if (previousMode === "compress") {
+      handleToolSelect("compress");
+      sessionStorage.removeItem("previousMode");
+    } else if (previousMode === "convert") {
+      handleToolSelect("convert");
+      sessionStorage.removeItem("previousMode");
     } else {
-      setCurrentView('fileEditor');
+      setCurrentView("fileEditor");
     }
   };
 
@@ -96,7 +106,9 @@ export default function Workbench() {
     // Check if we're showing a custom workbench first
     // Custom workbenches may not require files in FileContext (e.g., sign request workbench)
     if (!isBaseWorkbench(currentView)) {
-      const customView = customWorkbenchViews.find((view) => view.workbenchId === currentView && view.data != null);
+      const customView = customWorkbenchViews.find(
+        (view) => view.workbenchId === currentView && view.data != null,
+      );
       if (customView) {
         const CustomComponent = customView.component;
         return <CustomComponent data={customView.data} />;
@@ -104,15 +116,11 @@ export default function Workbench() {
     }
 
     if (activeFiles.length === 0) {
-      return (
-        <LandingPage
-        />
-      );
+      return <LandingPage />;
     }
 
     switch (currentView) {
       case "fileEditor":
-
         return (
           <FileEditor
             toolMode={!!selectedToolId}
@@ -124,13 +132,12 @@ export default function Workbench() {
               onMergeFiles: (filesToMerge) => {
                 addFiles(filesToMerge);
                 setCurrentView("viewer");
-              }
+              },
             })}
           />
         );
 
       case "viewer":
-        
         return (
           <Viewer
             sidebarsVisible={sidebarsVisible}
@@ -143,34 +150,39 @@ export default function Workbench() {
         );
 
       case "pageEditor":
-
         return (
-          <div style={{ position: 'relative', flex: '1 1 0', height: 0 }}>
-            <PageEditor
-              onFunctionsReady={setPageEditorFunctions}
-            />
+          <div style={{ position: "relative", flex: "1 1 0", height: 0 }}>
+            <PageEditor onFunctionsReady={setPageEditorFunctions} />
             {pageEditorFunctions && (
-              <div style={{ position: 'absolute', bottom: 0, left: 0, right: 0, zIndex: 100 }}>
+              <div
+                style={{
+                  position: "absolute",
+                  bottom: 0,
+                  left: 0,
+                  right: 0,
+                  zIndex: 100,
+                }}
+              >
                 <PageEditorControls
-                onClosePdf={pageEditorFunctions.closePdf}
-                onUndo={pageEditorFunctions.handleUndo}
-                onRedo={pageEditorFunctions.handleRedo}
-                canUndo={pageEditorFunctions.canUndo}
-                canRedo={pageEditorFunctions.canRedo}
-                onRotate={pageEditorFunctions.handleRotate}
-                onDelete={pageEditorFunctions.handleDelete}
-                onSplit={pageEditorFunctions.handleSplit}
-                onSplitAll={pageEditorFunctions.handleSplitAll}
-                onPageBreak={pageEditorFunctions.handlePageBreak}
-                onPageBreakAll={pageEditorFunctions.handlePageBreakAll}
-                onExportAll={pageEditorFunctions.onExportAll}
-                exportLoading={pageEditorFunctions.exportLoading}
-                selectionMode={pageEditorFunctions.selectionMode}
-                selectedPageIds={pageEditorFunctions.selectedPageIds}
-                displayDocument={pageEditorFunctions.displayDocument}
-                splitPositions={pageEditorFunctions.splitPositions}
-                totalPages={pageEditorFunctions.totalPages}
-              />
+                  onClosePdf={pageEditorFunctions.closePdf}
+                  onUndo={pageEditorFunctions.handleUndo}
+                  onRedo={pageEditorFunctions.handleRedo}
+                  canUndo={pageEditorFunctions.canUndo}
+                  canRedo={pageEditorFunctions.canRedo}
+                  onRotate={pageEditorFunctions.handleRotate}
+                  onDelete={pageEditorFunctions.handleDelete}
+                  onSplit={pageEditorFunctions.handleSplit}
+                  onSplitAll={pageEditorFunctions.handleSplitAll}
+                  onPageBreak={pageEditorFunctions.handlePageBreak}
+                  onPageBreakAll={pageEditorFunctions.handlePageBreakAll}
+                  onExportAll={pageEditorFunctions.onExportAll}
+                  exportLoading={pageEditorFunctions.exportLoading}
+                  selectionMode={pageEditorFunctions.selectionMode}
+                  selectedPageIds={pageEditorFunctions.selectedPageIds}
+                  displayDocument={pageEditorFunctions.displayDocument}
+                  splitPositions={pageEditorFunctions.splitPositions}
+                  totalPages={pageEditorFunctions.totalPages}
+                />
               </div>
             )}
           </div>
@@ -188,34 +200,40 @@ export default function Workbench() {
       style={
         isRainbowMode
           ? {} // No background color in rainbow mode
-          : { backgroundColor: 'var(--bg-background)' }
+          : { backgroundColor: "var(--bg-background)" }
       }
     >
       {/* Top Controls */}
-      {activeFiles.length > 0 && !customWorkbenchViews.find(v => v.workbenchId === currentView)?.hideTopControls && (
-        <TopControls
-          currentView={currentView}
-          setCurrentView={setCurrentView}
-          customViews={customWorkbenchViews}
-          activeFiles={activeFiles.map(f => {
-            const stub = selectors.getStirlingFileStub(f.fileId);
-            return { fileId: f.fileId, name: f.name, versionNumber: stub?.versionNumber };
-          })}
-          currentFileIndex={activeFileIndex}
-          onFileSelect={handleFileSelect}
-          onFileRemove={handleFileRemove}
-        />
-      )}
+      {activeFiles.length > 0 &&
+        !customWorkbenchViews.find((v) => v.workbenchId === currentView)
+          ?.hideTopControls && (
+          <TopControls
+            currentView={currentView}
+            setCurrentView={setCurrentView}
+            customViews={customWorkbenchViews}
+            activeFiles={activeFiles.map((f) => {
+              const stub = selectors.getStirlingFileStub(f.fileId);
+              return {
+                fileId: f.fileId,
+                name: f.name,
+                versionNumber: stub?.versionNumber,
+              };
+            })}
+            currentFileIndex={activeFileIndex}
+            onFileSelect={handleFileSelect}
+            onFileRemove={handleFileRemove}
+          />
+        )}
 
       {/* Dismiss All Errors Button */}
       <DismissAllErrorsButton />
 
       {/* Main content area */}
       <Box
-        className={`flex-1 min-h-0 z-10 ${currentView === 'pageEditor' ? 'relative flex flex-col' : `relative ${styles.workbenchScrollable}`}`}
+        className={`flex-1 min-h-0 z-10 ${currentView === "pageEditor" ? "relative flex flex-col" : `relative ${styles.workbenchScrollable}`}`}
         style={{
-          transition: 'opacity 0.15s ease-in-out',
-          ...(currentView === 'pageEditor' && { height: 0 }),
+          transition: "opacity 0.15s ease-in-out",
+          ...(currentView === "pageEditor" && { height: 0 }),
         }}
       >
         {renderMainContent()}
diff --git a/frontend/src/core/components/onboarding/InitialOnboardingModal/InitialOnboardingModal.module.css b/frontend/src/core/components/onboarding/InitialOnboardingModal/InitialOnboardingModal.module.css
index c507653092..5b3aec2d91 100644
--- a/frontend/src/core/components/onboarding/InitialOnboardingModal/InitialOnboardingModal.module.css
+++ b/frontend/src/core/components/onboarding/InitialOnboardingModal/InitialOnboardingModal.module.css
@@ -118,7 +118,6 @@
   }
 }
 
-
 .heroIconsContainer {
   display: flex;
   gap: 32px;
@@ -141,7 +140,9 @@
   border: none;
   padding: 0;
   cursor: pointer;
-  transition: transform 0.2s ease, opacity 0.2s ease;
+  transition:
+    transform 0.2s ease,
+    opacity 0.2s ease;
   display: flex;
   align-items: center;
   justify-content: center;
@@ -181,7 +182,14 @@
 }
 
 .iconLabel {
-  font-family: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
+  font-family:
+    "Inter",
+    system-ui,
+    -apple-system,
+    "Segoe UI",
+    Roboto,
+    Arial,
+    sans-serif;
   font-size: 14px;
   font-weight: 500;
   color: rgba(255, 255, 255, 0.9);
@@ -266,7 +274,7 @@
   opacity: 1;
   border: 1px solid rgba(255, 255, 255, 0.9);
   background: rgba(255, 255, 255, 0.9);
-  color: #1F2933;
+  color: #1f2933;
   box-shadow: 0 0 8px rgba(255, 255, 255, 0.7);
 }
 
@@ -282,7 +290,14 @@
 
 /* Title styles */
 .titleText {
-  font-family: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
+  font-family:
+    "Inter",
+    system-ui,
+    -apple-system,
+    "Segoe UI",
+    Roboto,
+    Arial,
+    sans-serif;
   font-weight: 600;
   font-size: 22px;
   color: var(--onboarding-title);
@@ -290,7 +305,14 @@
 
 /* Body text styles */
 .bodyText {
-  font-family: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
+  font-family:
+    "Inter",
+    system-ui,
+    -apple-system,
+    "Segoe UI",
+    Roboto,
+    Arial,
+    sans-serif;
   font-size: 16px;
   color: var(--onboarding-body);
   line-height: 1.5;
@@ -314,8 +336,8 @@
 }
 
 .v2Badge {
-  background: #DBEFFF;
-  color: #2A4BFF;
+  background: #dbefff;
+  color: #2a4bff;
   padding: 4px 12px;
   border-radius: 6px;
   font-size: 14px;
diff --git a/frontend/src/core/components/onboarding/InitialOnboardingModal/renderButtons.tsx b/frontend/src/core/components/onboarding/InitialOnboardingModal/renderButtons.tsx
index c50ae7b43e..fc7914db55 100644
--- a/frontend/src/core/components/onboarding/InitialOnboardingModal/renderButtons.tsx
+++ b/frontend/src/core/components/onboarding/InitialOnboardingModal/renderButtons.tsx
@@ -1,10 +1,13 @@
-import React from 'react';
-import { Button, Group, ActionIcon } from '@mantine/core';
-import ChevronLeftIcon from '@mui/icons-material/ChevronLeft';
-import { useTranslation } from 'react-i18next';
-import { ButtonDefinition, type FlowState } from '@app/components/onboarding/onboardingFlowConfig';
-import type { LicenseNotice } from '@app/types/types';
-import type { ButtonAction } from '@app/components/onboarding/onboardingFlowConfig';
+import React from "react";
+import { Button, Group, ActionIcon } from "@mantine/core";
+import ChevronLeftIcon from "@mui/icons-material/ChevronLeft";
+import { useTranslation } from "react-i18next";
+import {
+  ButtonDefinition,
+  type FlowState,
+} from "@app/components/onboarding/onboardingFlowConfig";
+import type { LicenseNotice } from "@app/types/types";
+import type { ButtonAction } from "@app/components/onboarding/onboardingFlowConfig";
 
 interface SlideButtonsProps {
   slideDefinition: {
@@ -16,51 +19,60 @@ interface SlideButtonsProps {
   onAction: (action: ButtonAction) => void;
 }
 
-export function SlideButtons({ slideDefinition, licenseNotice, flowState, onAction }: SlideButtonsProps) {
+export function SlideButtons({
+  slideDefinition,
+  licenseNotice,
+  flowState,
+  onAction,
+}: SlideButtonsProps) {
   const { t } = useTranslation();
-  const leftButtons = slideDefinition.buttons.filter((btn) => btn.group === 'left');
-  const rightButtons = slideDefinition.buttons.filter((btn) => btn.group === 'right');
+  const leftButtons = slideDefinition.buttons.filter(
+    (btn) => btn.group === "left",
+  );
+  const rightButtons = slideDefinition.buttons.filter(
+    (btn) => btn.group === "right",
+  );
 
-  const buttonStyles = (variant: ButtonDefinition['variant']) =>
-    variant === 'primary'
+  const buttonStyles = (variant: ButtonDefinition["variant"]) =>
+    variant === "primary"
       ? {
           root: {
-            background: 'var(--onboarding-primary-button-bg)',
-            color: 'var(--onboarding-primary-button-text)',
+            background: "var(--onboarding-primary-button-bg)",
+            color: "var(--onboarding-primary-button-text)",
           },
         }
       : {
           root: {
-            background: 'var(--onboarding-secondary-button-bg)',
-            border: '1px solid var(--onboarding-secondary-button-border)',
-            color: 'var(--onboarding-secondary-button-text)',
+            background: "var(--onboarding-secondary-button-bg)",
+            border: "1px solid var(--onboarding-secondary-button-border)",
+            color: "var(--onboarding-secondary-button-text)",
           },
         };
 
   const resolveButtonLabel = (button: ButtonDefinition) => {
     // Special case: override "See Plans" with "Upgrade now" when over limit
     if (
-      button.type === 'button' &&
-      slideDefinition.id === 'server-license' &&
-      button.action === 'see-plans' &&
+      button.type === "button" &&
+      slideDefinition.id === "server-license" &&
+      button.action === "see-plans" &&
       licenseNotice.isOverLimit
     ) {
-      return t('onboarding.serverLicense.upgrade', 'Upgrade now →');
+      return t("onboarding.serverLicense.upgrade", "Upgrade now →");
     }
 
     // Translate the label (it's a translation key)
-    const label = button.label ?? '';
-    if (!label) return '';
+    const label = button.label ?? "";
+    if (!label) return "";
 
     // Extract fallback text from translation key (e.g., 'onboarding.buttons.next' -> 'Next')
-    const fallback = label.split('.').pop() || label;
+    const fallback = label.split(".").pop() || label;
     return t(label, fallback);
   };
 
   const renderButton = (button: ButtonDefinition) => {
     const disabled = button.disabledWhen?.(flowState) ?? false;
 
-    if (button.type === 'icon') {
+    if (button.type === "icon") {
       return (
         <ActionIcon
           key={button.key}
@@ -70,22 +82,29 @@ export function SlideButtons({ slideDefinition, licenseNotice, flowState, onActi
           disabled={disabled}
           styles={{
             root: {
-              background: 'var(--onboarding-secondary-button-bg)',
-              border: '1px solid var(--onboarding-secondary-button-border)',
-              color: 'var(--onboarding-secondary-button-text)',
+              background: "var(--onboarding-secondary-button-bg)",
+              border: "1px solid var(--onboarding-secondary-button-border)",
+              color: "var(--onboarding-secondary-button-text)",
             },
           }}
         >
-          {button.icon === 'chevron-left' && <ChevronLeftIcon fontSize="small" />}
+          {button.icon === "chevron-left" && (
+            <ChevronLeftIcon fontSize="small" />
+          )}
         </ActionIcon>
       );
     }
 
-    const variant = button.variant ?? 'secondary';
+    const variant = button.variant ?? "secondary";
     const label = resolveButtonLabel(button);
 
     return (
-      <Button key={button.key} onClick={() => onAction(button.action)} disabled={disabled} styles={buttonStyles(variant)}>
+      <Button
+        key={button.key}
+        onClick={() => onAction(button.action)}
+        disabled={disabled}
+        styles={buttonStyles(variant)}
+      >
         {label}
       </Button>
     );
diff --git a/frontend/src/core/components/onboarding/Onboarding.tsx b/frontend/src/core/components/onboarding/Onboarding.tsx
index d098a801d5..d215c0e734 100644
--- a/frontend/src/core/components/onboarding/Onboarding.tsx
+++ b/frontend/src/core/components/onboarding/Onboarding.tsx
@@ -1,33 +1,40 @@
-import { useEffect, useMemo, useCallback, useState } from 'react';
-import { type StepType } from '@reactour/tour';
-import { useTranslation } from 'react-i18next';
-import { useNavigate, useLocation } from 'react-router-dom';
-import { isAuthRoute } from '@app/constants/routes';
-import { dispatchTourState } from '@app/constants/events';
-import { useOnboardingOrchestrator } from '@app/components/onboarding/orchestrator/useOnboardingOrchestrator';
-import { useBypassOnboarding } from '@app/components/onboarding/useBypassOnboarding';
-import OnboardingTour, { type AdvanceArgs, type CloseArgs } from '@app/components/onboarding/OnboardingTour';
-import OnboardingModalSlide from '@app/components/onboarding/OnboardingModalSlide';
+import { useEffect, useMemo, useCallback, useState } from "react";
+import { type StepType } from "@reactour/tour";
+import { useTranslation } from "react-i18next";
+import { useNavigate, useLocation } from "react-router-dom";
+import { isAuthRoute } from "@app/constants/routes";
+import { dispatchTourState } from "@app/constants/events";
+import { useOnboardingOrchestrator } from "@app/components/onboarding/orchestrator/useOnboardingOrchestrator";
+import { useBypassOnboarding } from "@app/components/onboarding/useBypassOnboarding";
+import OnboardingTour, {
+  type AdvanceArgs,
+  type CloseArgs,
+} from "@app/components/onboarding/OnboardingTour";
+import OnboardingModalSlide from "@app/components/onboarding/OnboardingModalSlide";
 import {
   useServerLicenseRequest,
   useTourRequest,
-} from '@app/components/onboarding/useOnboardingEffects';
-import { useOnboardingDownload } from '@app/components/onboarding/useOnboardingDownload';
-import { SLIDE_DEFINITIONS, type SlideId, type ButtonAction } from '@app/components/onboarding/onboardingFlowConfig';
-import ToolPanelModePrompt from '@app/components/tools/ToolPanelModePrompt';
-import { useTourOrchestration } from '@app/contexts/TourOrchestrationContext';
-import { useAdminTourOrchestration } from '@app/contexts/AdminTourOrchestrationContext';
-import { createUserStepsConfig } from '@app/components/onboarding/userStepsConfig';
-import { createAdminStepsConfig } from '@app/components/onboarding/adminStepsConfig';
-import { createWhatsNewStepsConfig } from '@app/components/onboarding/whatsNewStepsConfig';
-import { removeAllGlows } from '@app/components/onboarding/tourGlow';
-import { useFilesModalContext } from '@app/contexts/FilesModalContext';
-import { useServerExperience } from '@app/hooks/useServerExperience';
-import { useAppConfig } from '@app/contexts/AppConfigContext';
-import apiClient from '@app/services/apiClient';
-import '@app/components/onboarding/OnboardingTour.css';
-import { useAccountLogout } from '@app/extensions/accountLogout';
-import { useAuth } from '@app/auth/UseSession';
+} from "@app/components/onboarding/useOnboardingEffects";
+import { useOnboardingDownload } from "@app/components/onboarding/useOnboardingDownload";
+import {
+  SLIDE_DEFINITIONS,
+  type SlideId,
+  type ButtonAction,
+} from "@app/components/onboarding/onboardingFlowConfig";
+import ToolPanelModePrompt from "@app/components/tools/ToolPanelModePrompt";
+import { useTourOrchestration } from "@app/contexts/TourOrchestrationContext";
+import { useAdminTourOrchestration } from "@app/contexts/AdminTourOrchestrationContext";
+import { createUserStepsConfig } from "@app/components/onboarding/userStepsConfig";
+import { createAdminStepsConfig } from "@app/components/onboarding/adminStepsConfig";
+import { createWhatsNewStepsConfig } from "@app/components/onboarding/whatsNewStepsConfig";
+import { removeAllGlows } from "@app/components/onboarding/tourGlow";
+import { useFilesModalContext } from "@app/contexts/FilesModalContext";
+import { useServerExperience } from "@app/hooks/useServerExperience";
+import { useAppConfig } from "@app/contexts/AppConfigContext";
+import apiClient from "@app/services/apiClient";
+import "@app/components/onboarding/OnboardingTour.css";
+import { useAccountLogout } from "@app/extensions/accountLogout";
+import { useAuth } from "@app/auth/UseSession";
 
 export default function Onboarding() {
   const { t } = useTranslation();
@@ -39,9 +46,18 @@ export default function Onboarding() {
   const onAuthRoute = isAuthRoute(location.pathname);
   const { currentStep, isActive, isLoading, runtimeState, activeFlow } = state;
 
-  const { osInfo, osOptions, setSelectedDownloadUrl, handleDownloadSelected } = useOnboardingDownload();
-  const { showLicenseSlide, licenseNotice: externalLicenseNotice, closeLicenseSlide } = useServerLicenseRequest();
-  const { tourRequested: externalTourRequested, requestedTourType, clearTourRequest } = useTourRequest();
+  const { osInfo, osOptions, setSelectedDownloadUrl, handleDownloadSelected } =
+    useOnboardingDownload();
+  const {
+    showLicenseSlide,
+    licenseNotice: externalLicenseNotice,
+    closeLicenseSlide,
+  } = useServerLicenseRequest();
+  const {
+    tourRequested: externalTourRequested,
+    requestedTourType,
+    clearTourRequest,
+  } = useTourRequest();
   const { config, refetch: refetchConfig } = useAppConfig();
   const [analyticsError, setAnalyticsError] = useState<string | null>(null);
   const [analyticsLoading, setAnalyticsLoading] = useState(false);
@@ -52,13 +68,16 @@ export default function Onboarding() {
   const accountLogout = useAccountLogout();
   const { signOut } = useAuth();
 
-  const handleRoleSelect = useCallback((role: 'admin' | 'user' | null) => {
-    actions.updateRuntimeState({ selectedRole: role });
-    serverExperience.setSelfReportedAdmin(role === 'admin');
-  }, [actions, serverExperience]);
+  const handleRoleSelect = useCallback(
+    (role: "admin" | "user" | null) => {
+      actions.updateRuntimeState({ selectedRole: role });
+      serverExperience.setSelfReportedAdmin(role === "admin");
+    },
+    [actions, serverExperience],
+  );
 
   const redirectToLogin = useCallback(() => {
-    window.location.assign('/login');
+    window.location.assign("/login");
   }, []);
 
   const handlePasswordChanged = useCallback(async () => {
@@ -75,89 +94,124 @@ export default function Onboarding() {
 
   // Check if we should show analytics modal before onboarding
   useEffect(() => {
-    if (!isLoading && !analyticsModalDismissed && serverExperience.effectiveIsAdmin && config?.enableAnalytics == null) {
+    if (
+      !isLoading &&
+      !analyticsModalDismissed &&
+      serverExperience.effectiveIsAdmin &&
+      config?.enableAnalytics == null
+    ) {
       setShowAnalyticsModal(true);
     }
-  }, [isLoading, analyticsModalDismissed, serverExperience.effectiveIsAdmin, config?.enableAnalytics]);
+  }, [
+    isLoading,
+    analyticsModalDismissed,
+    serverExperience.effectiveIsAdmin,
+    config?.enableAnalytics,
+  ]);
 
-  const handleAnalyticsChoice = useCallback(async (enableAnalytics: boolean) => {
-    if (analyticsLoading) return;
-    setAnalyticsLoading(true);
-    setAnalyticsError(null);
+  const handleAnalyticsChoice = useCallback(
+    async (enableAnalytics: boolean) => {
+      if (analyticsLoading) return;
+      setAnalyticsLoading(true);
+      setAnalyticsError(null);
 
-    const formData = new FormData();
-    formData.append('enabled', enableAnalytics.toString());
+      const formData = new FormData();
+      formData.append("enabled", enableAnalytics.toString());
 
-    try {
-      await apiClient.post('/api/v1/settings/update-enable-analytics', formData);
-      await refetchConfig();
-      setShowAnalyticsModal(false);
-      setAnalyticsModalDismissed(true);
-    } catch (error) {
-      setAnalyticsError(error instanceof Error ? error.message : 'Unknown error');
-    } finally {
-      setAnalyticsLoading(false);
-    }
-  }, [analyticsLoading, refetchConfig]);
-
-  const handleButtonAction = useCallback(async (action: ButtonAction) => {
-    switch (action) {
-      case 'next':
-      case 'complete-close':
-        actions.complete();
-        break;
-      case 'prev':
-        actions.prev();
-        break;
-      case 'close':
-        actions.skip();
-        break;
-      case 'download-selected':
-        handleDownloadSelected();
-        actions.complete();
-        break;
-      case 'security-next':
-        if (!runtimeState.selectedRole) return;
-        if (runtimeState.selectedRole !== 'admin') {
-          actions.updateRuntimeState({ tourType: 'whatsnew' });
-          setIsTourOpen(true);
-        }
-        actions.complete();
-        break;
-      case 'launch-admin':
-        actions.updateRuntimeState({ tourType: 'admin' });
-        setIsTourOpen(true);
-        break;
-      case 'launch-tools':
-        actions.updateRuntimeState({ tourType: 'whatsnew' });
-        setIsTourOpen(true);
-        break;
-      case 'launch-auto': {
-        const tourType = serverExperience.effectiveIsAdmin || runtimeState.selectedRole === 'admin' ? 'admin' : 'whatsnew';
-        actions.updateRuntimeState({ tourType });
-        setIsTourOpen(true);
-        break;
+      try {
+        await apiClient.post(
+          "/api/v1/settings/update-enable-analytics",
+          formData,
+        );
+        await refetchConfig();
+        setShowAnalyticsModal(false);
+        setAnalyticsModalDismissed(true);
+      } catch (error) {
+        setAnalyticsError(
+          error instanceof Error ? error.message : "Unknown error",
+        );
+      } finally {
+        setAnalyticsLoading(false);
       }
-      case 'skip-to-license':
-        actions.complete();
-        break;
-      case 'skip-tour':
-        actions.complete();
-        break;
-      case 'see-plans':
-        actions.complete();
-        navigate('/settings/adminPlan');
-        break;
-      case 'enable-analytics':
-        await handleAnalyticsChoice(true);
-        break;
-      case 'disable-analytics':
-        await handleAnalyticsChoice(false);
-        break;
-    }
-  }, [actions, handleAnalyticsChoice, handleDownloadSelected, navigate, runtimeState.selectedRole, serverExperience.effectiveIsAdmin]);
+    },
+    [analyticsLoading, refetchConfig],
+  );
 
-  const isRTL = typeof document !== 'undefined' ? document.documentElement.dir === 'rtl' : false;
+  const handleButtonAction = useCallback(
+    async (action: ButtonAction) => {
+      switch (action) {
+        case "next":
+        case "complete-close":
+          actions.complete();
+          break;
+        case "prev":
+          actions.prev();
+          break;
+        case "close":
+          actions.skip();
+          break;
+        case "download-selected":
+          handleDownloadSelected();
+          actions.complete();
+          break;
+        case "security-next":
+          if (!runtimeState.selectedRole) return;
+          if (runtimeState.selectedRole !== "admin") {
+            actions.updateRuntimeState({ tourType: "whatsnew" });
+            setIsTourOpen(true);
+          }
+          actions.complete();
+          break;
+        case "launch-admin":
+          actions.updateRuntimeState({ tourType: "admin" });
+          setIsTourOpen(true);
+          break;
+        case "launch-tools":
+          actions.updateRuntimeState({ tourType: "whatsnew" });
+          setIsTourOpen(true);
+          break;
+        case "launch-auto": {
+          const tourType =
+            serverExperience.effectiveIsAdmin ||
+            runtimeState.selectedRole === "admin"
+              ? "admin"
+              : "whatsnew";
+          actions.updateRuntimeState({ tourType });
+          setIsTourOpen(true);
+          break;
+        }
+        case "skip-to-license":
+          actions.complete();
+          break;
+        case "skip-tour":
+          actions.complete();
+          break;
+        case "see-plans":
+          actions.complete();
+          navigate("/settings/adminPlan");
+          break;
+        case "enable-analytics":
+          await handleAnalyticsChoice(true);
+          break;
+        case "disable-analytics":
+          await handleAnalyticsChoice(false);
+          break;
+      }
+    },
+    [
+      actions,
+      handleAnalyticsChoice,
+      handleDownloadSelected,
+      navigate,
+      runtimeState.selectedRole,
+      serverExperience.effectiveIsAdmin,
+    ],
+  );
+
+  const isRTL =
+    typeof document !== "undefined"
+      ? document.documentElement.dir === "rtl"
+      : false;
   const [isTourOpen, setIsTourOpen] = useState(false);
 
   useEffect(() => dispatchTourState(isTourOpen), [isTourOpen]);
@@ -167,65 +221,73 @@ export default function Onboarding() {
   const adminTourOrch = useAdminTourOrchestration();
 
   const userStepsConfig = useMemo(
-    () => createUserStepsConfig({
-      t,
-      actions: {
-        saveWorkbenchState: tourOrch.saveWorkbenchState,
-        closeFilesModal,
-        backToAllTools: tourOrch.backToAllTools,
-        selectCropTool: tourOrch.selectCropTool,
-        loadSampleFile: tourOrch.loadSampleFile,
-        switchToActiveFiles: tourOrch.switchToActiveFiles,
-        pinFile: tourOrch.pinFile,
-        modifyCropSettings: tourOrch.modifyCropSettings,
-        executeTool: tourOrch.executeTool,
-        openFilesModal,
-      },
-    }),
-    [t, tourOrch, closeFilesModal, openFilesModal]
+    () =>
+      createUserStepsConfig({
+        t,
+        actions: {
+          saveWorkbenchState: tourOrch.saveWorkbenchState,
+          closeFilesModal,
+          backToAllTools: tourOrch.backToAllTools,
+          selectCropTool: tourOrch.selectCropTool,
+          loadSampleFile: tourOrch.loadSampleFile,
+          switchToActiveFiles: tourOrch.switchToActiveFiles,
+          pinFile: tourOrch.pinFile,
+          modifyCropSettings: tourOrch.modifyCropSettings,
+          executeTool: tourOrch.executeTool,
+          openFilesModal,
+        },
+      }),
+    [t, tourOrch, closeFilesModal, openFilesModal],
   );
 
   const whatsNewStepsConfig = useMemo(
-    () => createWhatsNewStepsConfig({
-      t,
-      actions: {
-        saveWorkbenchState: tourOrch.saveWorkbenchState,
-        closeFilesModal,
-        backToAllTools: tourOrch.backToAllTools,
-        openFilesModal,
-        loadSampleFile: tourOrch.loadSampleFile,
-        switchToViewer: tourOrch.switchToViewer,
-        switchToPageEditor: tourOrch.switchToPageEditor,
-        switchToActiveFiles: tourOrch.switchToActiveFiles,
-        selectFirstFile: tourOrch.selectFirstFile,
-      },
-    }),
-    [t, tourOrch, closeFilesModal, openFilesModal]
+    () =>
+      createWhatsNewStepsConfig({
+        t,
+        actions: {
+          saveWorkbenchState: tourOrch.saveWorkbenchState,
+          closeFilesModal,
+          backToAllTools: tourOrch.backToAllTools,
+          openFilesModal,
+          loadSampleFile: tourOrch.loadSampleFile,
+          switchToViewer: tourOrch.switchToViewer,
+          switchToPageEditor: tourOrch.switchToPageEditor,
+          switchToActiveFiles: tourOrch.switchToActiveFiles,
+          selectFirstFile: tourOrch.selectFirstFile,
+        },
+      }),
+    [t, tourOrch, closeFilesModal, openFilesModal],
   );
 
   const adminStepsConfig = useMemo(
-    () => createAdminStepsConfig({
-      t,
-      actions: {
-        saveAdminState: adminTourOrch.saveAdminState,
-        openConfigModal: adminTourOrch.openConfigModal,
-        navigateToSection: adminTourOrch.navigateToSection,
-        scrollNavToSection: adminTourOrch.scrollNavToSection,
-      },
-    }),
-    [t, adminTourOrch]
+    () =>
+      createAdminStepsConfig({
+        t,
+        actions: {
+          saveAdminState: adminTourOrch.saveAdminState,
+          openConfigModal: adminTourOrch.openConfigModal,
+          navigateToSection: adminTourOrch.navigateToSection,
+          scrollNavToSection: adminTourOrch.scrollNavToSection,
+        },
+      }),
+    [t, adminTourOrch],
   );
 
   const tourSteps = useMemo<StepType[]>(() => {
     switch (runtimeState.tourType) {
-      case 'admin':
+      case "admin":
         return Object.values(adminStepsConfig);
-      case 'whatsnew':
+      case "whatsnew":
         return Object.values(whatsNewStepsConfig);
       default:
         return Object.values(userStepsConfig);
     }
-  }, [adminStepsConfig, runtimeState.tourType, userStepsConfig, whatsNewStepsConfig]);
+  }, [
+    adminStepsConfig,
+    runtimeState.tourType,
+    userStepsConfig,
+    whatsNewStepsConfig,
+  ]);
 
   useEffect(() => {
     if (externalTourRequested) {
@@ -242,8 +304,8 @@ export default function Onboarding() {
 
   // Handle first-login password change modal
   useEffect(() => {
-    if(runtimeState.requiresPasswordChange === true) {
-      console.log('[Onboarding] User requires password change on first login.');
+    if (runtimeState.requiresPasswordChange === true) {
+      console.log("[Onboarding] User requires password change on first login.");
       setFirstLoginModalOpen(true);
     } else {
       setFirstLoginModalOpen(false);
@@ -252,18 +314,18 @@ export default function Onboarding() {
 
   // Handle MFA setup modal
   useEffect(() => {
-    if(runtimeState.requiresMfaSetup === true) {
-      console.log('[Onboarding] User requires MFA setup.');
+    if (runtimeState.requiresMfaSetup === true) {
+      console.log("[Onboarding] User requires MFA setup.");
       setMfaModalOpen(true);
     } else {
-      console.log('[Onboarding] User does not require MFA setup.');
+      console.log("[Onboarding] User does not require MFA setup.");
       setMfaModalOpen(false);
     }
   }, [runtimeState.requiresMfaSetup]);
 
   const finishTour = useCallback(() => {
     setIsTourOpen(false);
-    if (runtimeState.tourType === 'admin') {
+    if (runtimeState.tourType === "admin") {
       adminTourOrch.restoreAdminState();
     } else {
       tourOrch.restoreWorkbenchState();
@@ -272,23 +334,38 @@ export default function Onboarding() {
     actions.complete();
   }, [actions, adminTourOrch, runtimeState.tourType, tourOrch]);
 
-  const handleAdvanceTour = useCallback((args: AdvanceArgs) => {
-    const { setCurrentStep, currentStep: tourCurrentStep, steps, setIsOpen } = args;
-    if (steps && tourCurrentStep === steps.length - 1) {
-      setIsOpen(false);
-      finishTour();
-    } else if (steps) {
-      setCurrentStep((s) => (s === steps.length - 1 ? 0 : s + 1));
-    }
-  }, [finishTour]);
+  const handleAdvanceTour = useCallback(
+    (args: AdvanceArgs) => {
+      const {
+        setCurrentStep,
+        currentStep: tourCurrentStep,
+        steps,
+        setIsOpen,
+      } = args;
+      if (steps && tourCurrentStep === steps.length - 1) {
+        setIsOpen(false);
+        finishTour();
+      } else if (steps) {
+        setCurrentStep((s) => (s === steps.length - 1 ? 0 : s + 1));
+      }
+    },
+    [finishTour],
+  );
 
-  const handleCloseTour = useCallback((args: CloseArgs) => {
-    args.setIsOpen(false);
-    finishTour();
-  }, [finishTour]);
+  const handleCloseTour = useCallback(
+    (args: CloseArgs) => {
+      args.setIsOpen(false);
+      finishTour();
+    },
+    [finishTour],
+  );
 
   const currentSlideDefinition = useMemo(() => {
-    if (!currentStep || currentStep.type !== 'modal-slide' || !currentStep.slideId) {
+    if (
+      !currentStep ||
+      currentStep.type !== "modal-slide" ||
+      !currentStep.slideId
+    ) {
       return null;
     }
     return SLIDE_DEFINITIONS[currentStep.slideId as SlideId];
@@ -312,15 +389,31 @@ export default function Onboarding() {
       analyticsLoading,
       onMfaSetupComplete: handleMfaSetupComplete,
     });
-  }, [analyticsError, analyticsLoading, currentSlideDefinition, osInfo, osOptions, runtimeState.selectedRole, runtimeState.licenseNotice, handleRoleSelect, serverExperience.loginEnabled, setSelectedDownloadUrl, runtimeState.firstLoginUsername, handlePasswordChanged, handleMfaSetupComplete]);
+  }, [
+    analyticsError,
+    analyticsLoading,
+    currentSlideDefinition,
+    osInfo,
+    osOptions,
+    runtimeState.selectedRole,
+    runtimeState.licenseNotice,
+    handleRoleSelect,
+    serverExperience.loginEnabled,
+    setSelectedDownloadUrl,
+    runtimeState.firstLoginUsername,
+    handlePasswordChanged,
+    handleMfaSetupComplete,
+  ]);
 
   const modalSlideCount = useMemo(() => {
-    return activeFlow.filter((step) => step.type === 'modal-slide').length;
+    return activeFlow.filter((step) => step.type === "modal-slide").length;
   }, [activeFlow]);
 
   const currentModalSlideIndex = useMemo(() => {
-    if (!currentStep || currentStep.type !== 'modal-slide') return 0;
-    const modalSlides = activeFlow.filter((step) => step.type === 'modal-slide');
+    if (!currentStep || currentStep.type !== "modal-slide") return 0;
+    const modalSlides = activeFlow.filter(
+      (step) => step.type === "modal-slide",
+    );
     return modalSlides.findIndex((step) => step.id === currentStep.id);
   }, [activeFlow, currentStep]);
 
@@ -334,10 +427,10 @@ export default function Onboarding() {
 
   // Show analytics modal before onboarding if needed
   if (showAnalyticsModal) {
-    const slideDefinition = SLIDE_DEFINITIONS['analytics-choice'];
+    const slideDefinition = SLIDE_DEFINITIONS["analytics-choice"];
     const slideContent = slideDefinition.createSlide({
-      osLabel: '',
-      osUrl: '',
+      osLabel: "",
+      osUrl: "",
       selectedRole: null,
       onRoleSelect: () => {},
       analyticsError,
@@ -353,9 +446,9 @@ export default function Onboarding() {
         currentModalSlideIndex={0}
         onSkip={() => {}} // No skip allowed
         onAction={async (action) => {
-          if (action === 'enable-analytics') {
+          if (action === "enable-analytics") {
             await handleAnalyticsChoice(true);
-          } else if (action === 'disable-analytics') {
+          } else if (action === "disable-analytics") {
             await handleAnalyticsChoice(false);
           }
         }}
@@ -365,10 +458,10 @@ export default function Onboarding() {
   }
 
   if (firstLoginModalOpen) {
-    const baseSlideDefinition = SLIDE_DEFINITIONS['first-login'];
+    const baseSlideDefinition = SLIDE_DEFINITIONS["first-login"];
     const slideContent = baseSlideDefinition.createSlide({
-      osLabel: '',
-      osUrl: '',
+      osLabel: "",
+      osUrl: "",
       selectedRole: null,
       onRoleSelect: () => {},
       firstLoginUsername: runtimeState.firstLoginUsername,
@@ -385,7 +478,7 @@ export default function Onboarding() {
         currentModalSlideIndex={0}
         onSkip={() => {}}
         onAction={async (action) => {
-          if (action === 'complete-close') {
+          if (action === "complete-close") {
             handlePasswordChanged();
           }
         }}
@@ -395,11 +488,11 @@ export default function Onboarding() {
   }
 
   if (mfaModalOpen) {
-    console.log('[Onboarding] Rendering MFA setup modal slide.');
-    const baseSlideDefinition = SLIDE_DEFINITIONS['mfa-setup'];
+    console.log("[Onboarding] Rendering MFA setup modal slide.");
+    const baseSlideDefinition = SLIDE_DEFINITIONS["mfa-setup"];
     const slideContent = baseSlideDefinition.createSlide({
-      osLabel: '',
-      osUrl: '',
+      osLabel: "",
+      osUrl: "",
       selectedRole: null,
       onRoleSelect: () => {},
       onMfaSetupComplete: handleMfaSetupComplete,
@@ -414,7 +507,7 @@ export default function Onboarding() {
         currentModalSlideIndex={0}
         onSkip={() => {}}
         onAction={async (action) => {
-          if (action === 'complete-close') {
+          if (action === "complete-close") {
             handleMfaSetupComplete();
           }
         }}
@@ -424,16 +517,19 @@ export default function Onboarding() {
   }
 
   if (showLicenseSlide) {
-    const baseSlideDefinition = SLIDE_DEFINITIONS['server-license'];
+    const baseSlideDefinition = SLIDE_DEFINITIONS["server-license"];
     // Remove back button for external license notice
     const slideDefinition = {
       ...baseSlideDefinition,
-      buttons: baseSlideDefinition.buttons.filter(btn => btn.key !== 'license-back')
+      buttons: baseSlideDefinition.buttons.filter(
+        (btn) => btn.key !== "license-back",
+      ),
     };
-    const effectiveLicenseNotice = externalLicenseNotice || runtimeState.licenseNotice;
+    const effectiveLicenseNotice =
+      externalLicenseNotice || runtimeState.licenseNotice;
     const slideContent = slideDefinition.createSlide({
-      osLabel: '',
-      osUrl: '',
+      osLabel: "",
+      osUrl: "",
       osOptions: [],
       onDownloadUrlChange: () => {},
       selectedRole: null,
@@ -446,14 +542,17 @@ export default function Onboarding() {
       <OnboardingModalSlide
         slideDefinition={slideDefinition}
         slideContent={slideContent}
-        runtimeState={{ ...runtimeState, licenseNotice: effectiveLicenseNotice }}
+        runtimeState={{
+          ...runtimeState,
+          licenseNotice: effectiveLicenseNotice,
+        }}
         modalSlideCount={1}
         currentModalSlideIndex={0}
         onSkip={closeLicenseSlide}
         onAction={(action) => {
-          if (action === 'see-plans') {
+          if (action === "see-plans") {
             closeLicenseSlide();
-            navigate('/settings/adminPlan');
+            navigate("/settings/adminPlan");
           } else {
             closeLicenseSlide();
           }
@@ -487,10 +586,12 @@ export default function Onboarding() {
 
   // Render the current onboarding step
   switch (currentStep.type) {
-    case 'tool-prompt':
-      return <ToolPanelModePrompt forceOpen={true} onComplete={actions.complete} />;
+    case "tool-prompt":
+      return (
+        <ToolPanelModePrompt forceOpen={true} onComplete={actions.complete} />
+      );
 
-    case 'modal-slide':
+    case "modal-slide":
       if (!currentSlideDefinition || !currentSlideContent) return null;
       return (
         <OnboardingModalSlide
diff --git a/frontend/src/core/components/onboarding/OnboardingModalSlide.tsx b/frontend/src/core/components/onboarding/OnboardingModalSlide.tsx
index 60a9309199..b1bc731d52 100644
--- a/frontend/src/core/components/onboarding/OnboardingModalSlide.tsx
+++ b/frontend/src/core/components/onboarding/OnboardingModalSlide.tsx
@@ -1,25 +1,28 @@
 /**
  * OnboardingModalSlide Component
- * 
+ *
  * Renders a single modal slide in the onboarding flow.
  * Handles the hero image, content, stepper, and button actions.
  */
 
-import React from 'react';
-import { Modal, Stack, ActionIcon } from '@mantine/core';
-import DiamondOutlinedIcon from '@mui/icons-material/DiamondOutlined';
-import CloseIcon from '@mui/icons-material/Close';
+import React from "react";
+import { Modal, Stack, ActionIcon } from "@mantine/core";
+import DiamondOutlinedIcon from "@mui/icons-material/DiamondOutlined";
+import CloseIcon from "@mui/icons-material/Close";
 
-import type { SlideDefinition, ButtonAction } from '@app/components/onboarding/onboardingFlowConfig';
-import type { OnboardingRuntimeState } from '@app/components/onboarding/orchestrator/onboardingConfig';
-import type { SlideConfig } from '@app/types/types';
-import AnimatedSlideBackground from '@app/components/onboarding/slides/AnimatedSlideBackground';
-import OnboardingStepper from '@app/components/onboarding/OnboardingStepper';
-import { SlideButtons } from '@app/components/onboarding/InitialOnboardingModal/renderButtons';
-import LocalIcon from '@app/components/shared/LocalIcon';
-import { BASE_PATH } from '@app/constants/app';
-import { Z_INDEX_OVER_FULLSCREEN_SURFACE } from '@app/styles/zIndex';
-import styles from '@app/components/onboarding/InitialOnboardingModal/InitialOnboardingModal.module.css';
+import type {
+  SlideDefinition,
+  ButtonAction,
+} from "@app/components/onboarding/onboardingFlowConfig";
+import type { OnboardingRuntimeState } from "@app/components/onboarding/orchestrator/onboardingConfig";
+import type { SlideConfig } from "@app/types/types";
+import AnimatedSlideBackground from "@app/components/onboarding/slides/AnimatedSlideBackground";
+import OnboardingStepper from "@app/components/onboarding/OnboardingStepper";
+import { SlideButtons } from "@app/components/onboarding/InitialOnboardingModal/renderButtons";
+import LocalIcon from "@app/components/shared/LocalIcon";
+import { BASE_PATH } from "@app/constants/app";
+import { Z_INDEX_OVER_FULLSCREEN_SURFACE } from "@app/styles/zIndex";
+import styles from "@app/components/onboarding/InitialOnboardingModal/InitialOnboardingModal.module.css";
 
 interface OnboardingModalSlideProps {
   slideDefinition: SlideDefinition;
@@ -42,13 +45,16 @@ export default function OnboardingModalSlide({
   onAction,
   allowDismiss = true,
 }: OnboardingModalSlideProps) {
-
   const renderHero = () => {
-    if (slideDefinition.hero.type === 'dual-icon') {
+    if (slideDefinition.hero.type === "dual-icon") {
       return (
         <div className={styles.heroIconsContainer}>
           <div className={styles.iconWrapper}>
-            <img src={`${BASE_PATH}/modern-logo/logo512.png`} alt="Stirling icon" className={styles.downloadIcon} />
+            <img
+              src={`${BASE_PATH}/modern-logo/logo512.png`}
+              alt="Stirling icon"
+              className={styles.downloadIcon}
+            />
           </div>
         </div>
       );
@@ -56,21 +62,46 @@ export default function OnboardingModalSlide({
 
     return (
       <div className={styles.heroLogoCircle}>
-        {slideDefinition.hero.type === 'rocket' && (
-          <LocalIcon icon="rocket-launch" width={64} height={64} className={styles.heroIcon} />
+        {slideDefinition.hero.type === "rocket" && (
+          <LocalIcon
+            icon="rocket-launch"
+            width={64}
+            height={64}
+            className={styles.heroIcon}
+          />
         )}
-        {slideDefinition.hero.type === 'shield' && (
-          <LocalIcon icon="verified-user-outline" width={64} height={64} className={styles.heroIcon} />
+        {slideDefinition.hero.type === "shield" && (
+          <LocalIcon
+            icon="verified-user-outline"
+            width={64}
+            height={64}
+            className={styles.heroIcon}
+          />
         )}
-        {slideDefinition.hero.type === 'lock' && (
-          <LocalIcon icon="lock-outline" width={64} height={64} className={styles.heroIcon} />
+        {slideDefinition.hero.type === "lock" && (
+          <LocalIcon
+            icon="lock-outline"
+            width={64}
+            height={64}
+            className={styles.heroIcon}
+          />
         )}
-        {slideDefinition.hero.type === 'analytics' && (
-          <LocalIcon icon="analytics" width={64} height={64} className={styles.heroIcon} />
+        {slideDefinition.hero.type === "analytics" && (
+          <LocalIcon
+            icon="analytics"
+            width={64}
+            height={64}
+            className={styles.heroIcon}
+          />
         )}
-        {slideDefinition.hero.type === 'diamond' && <DiamondOutlinedIcon sx={{ fontSize: 64, color: '#000000' }} />}
-        {slideDefinition.hero.type === 'logo' && (
-          <img src={`${BASE_PATH}/branding/StirlingPDFLogoNoTextLightHC.svg`} alt="Stirling logo" />
+        {slideDefinition.hero.type === "diamond" && (
+          <DiamondOutlinedIcon sx={{ fontSize: 64, color: "#000000" }} />
+        )}
+        {slideDefinition.hero.type === "logo" && (
+          <img
+            src={`${BASE_PATH}/branding/StirlingPDFLogoNoTextLightHC.svg`}
+            alt="Stirling logo"
+          />
         )}
       </div>
     );
@@ -88,8 +119,13 @@ export default function OnboardingModalSlide({
       withCloseButton={false}
       zIndex={Z_INDEX_OVER_FULLSCREEN_SURFACE}
       styles={{
-        body: { padding: 0, maxHeight: '90vh', overflow: 'hidden' },
-        content: { overflow: 'hidden', border: 'none', background: 'var(--bg-surface)', maxHeight: '90vh' },
+        body: { padding: 0, maxHeight: "90vh", overflow: "hidden" },
+        content: {
+          overflow: "hidden",
+          border: "none",
+          background: "var(--bg-surface)",
+          maxHeight: "90vh",
+        },
       }}
     >
       <Stack gap={0} className={styles.modalContent}>
@@ -106,18 +142,18 @@ export default function OnboardingModalSlide({
               radius="md"
               size={36}
               style={{
-                position: 'absolute',
+                position: "absolute",
                 top: 16,
                 right: 16,
-                backgroundColor: 'rgba(255, 255, 255, 0.2)',
-                color: 'white',
-                backdropFilter: 'blur(4px)',
+                backgroundColor: "rgba(255, 255, 255, 0.2)",
+                color: "white",
+                backdropFilter: "blur(4px)",
                 zIndex: 10,
               }}
               styles={{
                 root: {
-                  '&:hover': {
-                    backgroundColor: 'rgba(255, 255, 255, 0.3)',
+                  "&:hover": {
+                    backgroundColor: "rgba(255, 255, 255, 0.3)",
                   },
                 },
               }}
@@ -130,7 +166,10 @@ export default function OnboardingModalSlide({
           </div>
         </div>
 
-        <div className={styles.modalBody} style={{ overflowY: 'auto', maxHeight: 'calc(90vh - 220px)' }}>
+        <div
+          className={styles.modalBody}
+          style={{ overflowY: "auto", maxHeight: "calc(90vh - 220px)" }}
+        >
           <Stack gap={16}>
             <div
               key={`title-${slideContent.key}`}
@@ -140,14 +179,20 @@ export default function OnboardingModalSlide({
             </div>
 
             <div className={styles.bodyText}>
-              <div key={`body-${slideContent.key}`} className={`${styles.bodyCopy} ${styles.bodyCopyInner}`}>
+              <div
+                key={`body-${slideContent.key}`}
+                className={`${styles.bodyCopy} ${styles.bodyCopyInner}`}
+              >
                 {slideContent.body}
               </div>
               <style>{`div strong{color: var(--onboarding-title); font-weight: 600;}`}</style>
             </div>
 
             {modalSlideCount > 1 && (
-              <OnboardingStepper totalSteps={modalSlideCount} activeStep={currentModalSlideIndex} />
+              <OnboardingStepper
+                totalSteps={modalSlideCount}
+                activeStep={currentModalSlideIndex}
+              />
             )}
 
             <div className={styles.buttonContainer}>
@@ -164,4 +209,3 @@ export default function OnboardingModalSlide({
     </Modal>
   );
 }
-
diff --git a/frontend/src/core/components/onboarding/OnboardingStepper.tsx b/frontend/src/core/components/onboarding/OnboardingStepper.tsx
index ec6767d8ad..c7b74e9a71 100644
--- a/frontend/src/core/components/onboarding/OnboardingStepper.tsx
+++ b/frontend/src/core/components/onboarding/OnboardingStepper.tsx
@@ -1,4 +1,4 @@
-import React from 'react';
+import React from "react";
 
 interface OnboardingStepperProps {
   totalSteps: number;
@@ -10,25 +10,29 @@ interface OnboardingStepperProps {
  * Renders a progress indicator where the active step is a pill and others are dots.
  * Colors come from theme.css variables.
  */
-export function OnboardingStepper({ totalSteps, activeStep, className }: OnboardingStepperProps) {
+export function OnboardingStepper({
+  totalSteps,
+  activeStep,
+  className,
+}: OnboardingStepperProps) {
   const items = Array.from({ length: totalSteps }, (_, index) => index);
 
   return (
     <div
       className={className}
       style={{
-        display: 'flex',
+        display: "flex",
         gap: 8,
-        alignItems: 'center',
-        justifyContent: 'center',
+        alignItems: "center",
+        justifyContent: "center",
       }}
     >
       {items.map((index) => {
         const isActive = index === activeStep;
         const baseStyles: React.CSSProperties = {
           background: isActive
-            ? 'var(--onboarding-step-active)'
-            : 'var(--onboarding-step-inactive)',
+            ? "var(--onboarding-step-active)"
+            : "var(--onboarding-step-inactive)",
         };
 
         return (
@@ -48,5 +52,3 @@ export function OnboardingStepper({ totalSteps, activeStep, className }: Onboard
 }
 
 export default OnboardingStepper;
-
-
diff --git a/frontend/src/core/components/onboarding/OnboardingTour.css b/frontend/src/core/components/onboarding/OnboardingTour.css
index 54ad69d68d..a1cbd4f3d8 100644
--- a/frontend/src/core/components/onboarding/OnboardingTour.css
+++ b/frontend/src/core/components/onboarding/OnboardingTour.css
@@ -18,7 +18,8 @@
 }
 
 @keyframes pulse-glow {
-  0%, 100% {
+  0%,
+  100% {
     box-shadow:
       0 0 0 3px var(--mantine-primary-color-filled),
       0 0 20px var(--mantine-primary-color-filled),
@@ -33,13 +34,13 @@
 }
 
 /* RTL: mirror step indicator and controls in Reactour popovers */
-:root[dir='rtl'] .reactour__popover {
+:root[dir="rtl"] .reactour__popover {
   direction: rtl;
 }
 
 /* Minimal overrides retained for glow only */
 
-:root[dir='rtl'] .reactour__badge {
+:root[dir="rtl"] .reactour__badge {
   left: auto;
   right: 16px;
 }
diff --git a/frontend/src/core/components/onboarding/OnboardingTour.tsx b/frontend/src/core/components/onboarding/OnboardingTour.tsx
index 85df0a9fdb..1f3ca67692 100644
--- a/frontend/src/core/components/onboarding/OnboardingTour.tsx
+++ b/frontend/src/core/components/onboarding/OnboardingTour.tsx
@@ -1,19 +1,19 @@
 /**
  * OnboardingTour Component
- * 
+ *
  * Reusable tour wrapper that encapsulates all Reactour configuration.
  * Used by the main Onboarding component for both the 'tour' step and
  * when the tour is open but onboarding is inactive.
  */
 
-import React from 'react';
-import { TourProvider, useTour, type StepType } from '@reactour/tour';
-import { CloseButton, ActionIcon } from '@mantine/core';
-import ArrowForwardIcon from '@mui/icons-material/ArrowForward';
-import ArrowBackIcon from '@mui/icons-material/ArrowBack';
-import CheckIcon from '@mui/icons-material/Check';
-import type { TFunction } from 'i18next';
-import i18n from '@app/i18n';
+import React from "react";
+import { TourProvider, useTour, type StepType } from "@reactour/tour";
+import { CloseButton, ActionIcon } from "@mantine/core";
+import ArrowForwardIcon from "@mui/icons-material/ArrowForward";
+import ArrowBackIcon from "@mui/icons-material/ArrowBack";
+import CheckIcon from "@mui/icons-material/Check";
+import type { TFunction } from "i18next";
+import i18n from "@app/i18n";
 
 /**
  * TourContent - Controls the tour visibility
@@ -49,7 +49,7 @@ interface CloseArgs {
 
 interface OnboardingTourProps {
   tourSteps: StepType[];
-  tourType: 'admin' | 'tools' | 'whatsnew';
+  tourType: "admin" | "tools" | "whatsnew";
   isRTL: boolean;
   t: TFunction;
   isOpen: boolean;
@@ -72,7 +72,7 @@ export default function OnboardingTour({
     <TourProvider
       key={`${tourType}-${i18n.language}`}
       steps={tourSteps}
-      maskClassName={tourType === 'admin' ? 'admin-tour-mask' : undefined}
+      maskClassName={tourType === "admin" ? "admin-tour-mask" : undefined}
       onClickClose={onClose}
       onClickMask={onAdvance}
       onClickHighlighted={(e, clickProps) => {
@@ -80,10 +80,10 @@ export default function OnboardingTour({
         onAdvance(clickProps);
       }}
       keyboardHandler={(e, clickProps, status) => {
-        if (e.key === 'ArrowRight' && !status?.isRightDisabled && clickProps) {
+        if (e.key === "ArrowRight" && !status?.isRightDisabled && clickProps) {
           e.preventDefault();
           onAdvance(clickProps);
-        } else if (e.key === 'Escape' && !status?.isEscDisabled && clickProps) {
+        } else if (e.key === "Escape" && !status?.isEscDisabled && clickProps) {
           e.preventDefault();
           onClose(clickProps);
         }
@@ -92,12 +92,12 @@ export default function OnboardingTour({
       styles={{
         popover: (base) => ({
           ...base,
-          backgroundColor: 'var(--mantine-color-body)',
-          color: 'var(--mantine-color-text)',
-          borderRadius: '8px',
-          padding: '20px',
-          boxShadow: '0 4px 12px rgba(0, 0, 0, 0.15)',
-          maxWidth: '400px',
+          backgroundColor: "var(--mantine-color-body)",
+          color: "var(--mantine-color-text)",
+          borderRadius: "8px",
+          padding: "20px",
+          boxShadow: "0 4px 12px rgba(0, 0, 0, 0.15)",
+          maxWidth: "400px",
         }),
         maskArea: (base) => ({
           ...base,
@@ -105,11 +105,11 @@ export default function OnboardingTour({
         }),
         badge: (base) => ({
           ...base,
-          backgroundColor: 'var(--mantine-primary-color-filled)',
+          backgroundColor: "var(--mantine-primary-color-filled)",
         }),
         controls: (base) => ({
           ...base,
-          justifyContent: 'center',
+          justifyContent: "center",
         }),
       }}
       highlightedMaskClassName="tour-highlight-glow"
@@ -119,15 +119,31 @@ export default function OnboardingTour({
       disableInteraction={true}
       disableDotsNavigation={false}
       prevButton={() => null}
-      nextButton={({ currentStep: tourCurrentStep, stepsLength, setCurrentStep, setIsOpen }) => {
+      nextButton={({
+        currentStep: tourCurrentStep,
+        stepsLength,
+        setCurrentStep,
+        setIsOpen,
+      }) => {
         const isLast = tourCurrentStep === stepsLength - 1;
         const ArrowIcon = isRTL ? ArrowBackIcon : ArrowForwardIcon;
         return (
           <ActionIcon
-            onClick={() => onAdvance({ setCurrentStep, currentStep: tourCurrentStep, steps: tourSteps, setIsOpen })}
+            onClick={() =>
+              onAdvance({
+                setCurrentStep,
+                currentStep: tourCurrentStep,
+                steps: tourSteps,
+                setIsOpen,
+              })
+            }
             variant="subtle"
             size="lg"
-            aria-label={isLast ? t('onboarding.finish', 'Finish') : t('onboarding.next', 'Next')}
+            aria-label={
+              isLast
+                ? t("onboarding.finish", "Finish")
+                : t("onboarding.next", "Next")
+            }
           >
             {isLast ? <CheckIcon /> : <ArrowIcon />}
           </ActionIcon>
@@ -135,10 +151,17 @@ export default function OnboardingTour({
       }}
       components={{
         Close: ({ onClick }) => (
-          <CloseButton onClick={onClick} size="md" style={{ position: 'absolute', top: '8px', right: '8px' }} />
+          <CloseButton
+            onClick={onClick}
+            size="md"
+            style={{ position: "absolute", top: "8px", right: "8px" }}
+          />
         ),
         Content: ({ content }: { content: string }) => (
-          <div style={{ paddingRight: '16px' }} dangerouslySetInnerHTML={{ __html: content }} />
+          <div
+            style={{ paddingRight: "16px" }}
+            dangerouslySetInnerHTML={{ __html: content }}
+          />
         ),
       }}
     >
@@ -148,4 +171,3 @@ export default function OnboardingTour({
 }
 
 export type { AdvanceArgs, CloseArgs };
-
diff --git a/frontend/src/core/components/onboarding/adminStepsConfig.ts b/frontend/src/core/components/onboarding/adminStepsConfig.ts
index b7a5c0b66c..4d33abb57c 100644
--- a/frontend/src/core/components/onboarding/adminStepsConfig.ts
+++ b/frontend/src/core/components/onboarding/adminStepsConfig.ts
@@ -1,6 +1,9 @@
-import type { StepType } from '@reactour/tour';
-import type { TFunction } from 'i18next';
-import { addGlowToElements, removeAllGlows } from '@app/components/onboarding/tourGlow';
+import type { StepType } from "@reactour/tour";
+import type { TFunction } from "i18next";
+import {
+  addGlowToElements,
+  removeAllGlows,
+} from "@app/components/onboarding/tourGlow";
 
 export enum AdminTourStep {
   WELCOME,
@@ -14,7 +17,7 @@ export enum AdminTourStep {
   WRAP_UP,
 }
 
-interface AdminStepActions {  
+interface AdminStepActions {
   saveAdminState: () => void;
   openConfigModal: () => void;
   navigateToSection: (section: string) => void;
@@ -26,14 +29,25 @@ interface CreateAdminStepsConfigArgs {
   actions: AdminStepActions;
 }
 
-export function createAdminStepsConfig({ t, actions }: CreateAdminStepsConfigArgs): Record<AdminTourStep, StepType> {
-  const { saveAdminState, openConfigModal, navigateToSection, scrollNavToSection } = actions;
+export function createAdminStepsConfig({
+  t,
+  actions,
+}: CreateAdminStepsConfigArgs): Record<AdminTourStep, StepType> {
+  const {
+    saveAdminState,
+    openConfigModal,
+    navigateToSection,
+    scrollNavToSection,
+  } = actions;
 
   return {
     [AdminTourStep.WELCOME]: {
       selector: '[data-tour="config-button"]',
-      content: t('adminOnboarding.welcome', "Welcome to the <strong>Admin Tour</strong>! Let's explore the powerful enterprise features and settings available to system administrators."),
-      position: 'right',
+      content: t(
+        "adminOnboarding.welcome",
+        "Welcome to the <strong>Admin Tour</strong>! Let's explore the powerful enterprise features and settings available to system administrators.",
+      ),
+      position: "right",
       padding: 10,
       action: () => {
         saveAdminState();
@@ -41,17 +55,23 @@ export function createAdminStepsConfig({ t, actions }: CreateAdminStepsConfigArg
     },
     [AdminTourStep.CONFIG_BUTTON]: {
       selector: '[data-tour="config-button"]',
-      content: t('adminOnboarding.configButton', "Click the <strong>Config</strong> button to access all system settings and administrative controls."),
-      position: 'right',
+      content: t(
+        "adminOnboarding.configButton",
+        "Click the <strong>Config</strong> button to access all system settings and administrative controls.",
+      ),
+      position: "right",
       padding: 10,
       actionAfter: () => {
         openConfigModal();
       },
     },
     [AdminTourStep.SETTINGS_OVERVIEW]: {
-      selector: '.modal-nav',
-      content: t('adminOnboarding.settingsOverview', "This is the <strong>Settings Panel</strong>. Admin settings are organised by category for easy navigation."),
-      position: 'right',
+      selector: ".modal-nav",
+      content: t(
+        "adminOnboarding.settingsOverview",
+        "This is the <strong>Settings Panel</strong>. Admin settings are organised by category for easy navigation.",
+      ),
+      position: "right",
       padding: 0,
       action: () => {
         removeAllGlows();
@@ -59,81 +79,137 @@ export function createAdminStepsConfig({ t, actions }: CreateAdminStepsConfigArg
     },
     [AdminTourStep.TEAMS_AND_USERS]: {
       selector: '[data-tour="admin-people-nav"]',
-      highlightedSelectors: ['[data-tour="admin-people-nav"]', '[data-tour="admin-teams-nav"]', '[data-tour="settings-content-area"]'],
-      content: t('adminOnboarding.teamsAndUsers', "Manage <strong>Teams</strong> and individual users here. You can invite new users via email, shareable links, or create custom accounts for them yourself."),
-      position: 'right',
+      highlightedSelectors: [
+        '[data-tour="admin-people-nav"]',
+        '[data-tour="admin-teams-nav"]',
+        '[data-tour="settings-content-area"]',
+      ],
+      content: t(
+        "adminOnboarding.teamsAndUsers",
+        "Manage <strong>Teams</strong> and individual users here. You can invite new users via email, shareable links, or create custom accounts for them yourself.",
+      ),
+      position: "right",
       padding: 10,
       action: () => {
         removeAllGlows();
-        navigateToSection('people');
+        navigateToSection("people");
         setTimeout(() => {
-          addGlowToElements(['[data-tour="admin-people-nav"]', '[data-tour="admin-teams-nav"]', '[data-tour="settings-content-area"]']);
+          addGlowToElements([
+            '[data-tour="admin-people-nav"]',
+            '[data-tour="admin-teams-nav"]',
+            '[data-tour="settings-content-area"]',
+          ]);
         }, 100);
       },
     },
     [AdminTourStep.SYSTEM_CUSTOMIZATION]: {
       selector: '[data-tour="admin-adminGeneral-nav"]',
-      highlightedSelectors: ['[data-tour="admin-adminGeneral-nav"]', '[data-tour="admin-adminFeatures-nav"]', '[data-tour="admin-adminEndpoints-nav"]', '[data-tour="settings-content-area"]'],
-      content: t('adminOnboarding.systemCustomization', "We have extensive ways to customise the UI: <strong>System Settings</strong> let you change the app name and languages, <strong>Features</strong> allows server certificate management, and <strong>Endpoints</strong> lets you enable or disable specific tools for your users."),
-      position: 'right',
+      highlightedSelectors: [
+        '[data-tour="admin-adminGeneral-nav"]',
+        '[data-tour="admin-adminFeatures-nav"]',
+        '[data-tour="admin-adminEndpoints-nav"]',
+        '[data-tour="settings-content-area"]',
+      ],
+      content: t(
+        "adminOnboarding.systemCustomization",
+        "We have extensive ways to customise the UI: <strong>System Settings</strong> let you change the app name and languages, <strong>Features</strong> allows server certificate management, and <strong>Endpoints</strong> lets you enable or disable specific tools for your users.",
+      ),
+      position: "right",
       padding: 10,
       action: () => {
         removeAllGlows();
-        navigateToSection('adminGeneral');
+        navigateToSection("adminGeneral");
         setTimeout(() => {
-          addGlowToElements(['[data-tour="admin-adminGeneral-nav"]', '[data-tour="admin-adminFeatures-nav"]', '[data-tour="admin-adminEndpoints-nav"]', '[data-tour="settings-content-area"]']);
+          addGlowToElements([
+            '[data-tour="admin-adminGeneral-nav"]',
+            '[data-tour="admin-adminFeatures-nav"]',
+            '[data-tour="admin-adminEndpoints-nav"]',
+            '[data-tour="settings-content-area"]',
+          ]);
         }, 100);
       },
     },
     [AdminTourStep.DATABASE_SECTION]: {
       selector: '[data-tour="admin-adminDatabase-nav"]',
-      highlightedSelectors: ['[data-tour="admin-adminDatabase-nav"]', '[data-tour="settings-content-area"]'],
-      content: t('adminOnboarding.databaseSection', "For advanced production environments, we have settings to allow <strong>external database hookups</strong> so you can integrate with your existing infrastructure."),
-      position: 'right',
+      highlightedSelectors: [
+        '[data-tour="admin-adminDatabase-nav"]',
+        '[data-tour="settings-content-area"]',
+      ],
+      content: t(
+        "adminOnboarding.databaseSection",
+        "For advanced production environments, we have settings to allow <strong>external database hookups</strong> so you can integrate with your existing infrastructure.",
+      ),
+      position: "right",
       padding: 10,
       action: () => {
         removeAllGlows();
-        navigateToSection('adminDatabase');
+        navigateToSection("adminDatabase");
         setTimeout(() => {
-          addGlowToElements(['[data-tour="admin-adminDatabase-nav"]', '[data-tour="settings-content-area"]']);
+          addGlowToElements([
+            '[data-tour="admin-adminDatabase-nav"]',
+            '[data-tour="settings-content-area"]',
+          ]);
         }, 100);
       },
     },
     [AdminTourStep.CONNECTIONS_SECTION]: {
       selector: '[data-tour="admin-adminConnections-nav"]',
-      highlightedSelectors: ['[data-tour="admin-adminConnections-nav"]', '[data-tour="settings-content-area"]'],
-      content: t('adminOnboarding.connectionsSection', "The <strong>Connections</strong> section supports various login methods including custom SSO and SAML providers like Google and GitHub, plus email integrations for notifications and communications."),
-      position: 'right',
+      highlightedSelectors: [
+        '[data-tour="admin-adminConnections-nav"]',
+        '[data-tour="settings-content-area"]',
+      ],
+      content: t(
+        "adminOnboarding.connectionsSection",
+        "The <strong>Connections</strong> section supports various login methods including custom SSO and SAML providers like Google and GitHub, plus email integrations for notifications and communications.",
+      ),
+      position: "right",
       padding: 10,
       action: () => {
         removeAllGlows();
-        navigateToSection('adminConnections');
+        navigateToSection("adminConnections");
         setTimeout(() => {
-          addGlowToElements(['[data-tour="admin-adminConnections-nav"]', '[data-tour="settings-content-area"]']);
+          addGlowToElements([
+            '[data-tour="admin-adminConnections-nav"]',
+            '[data-tour="settings-content-area"]',
+          ]);
         }, 100);
       },
       actionAfter: async () => {
-        await scrollNavToSection('adminAudit');
+        await scrollNavToSection("adminAudit");
       },
     },
     [AdminTourStep.ADMIN_TOOLS]: {
       selector: '[data-tour="admin-adminAudit-nav"]',
-      highlightedSelectors: ['[data-tour="admin-adminAudit-nav"]', '[data-tour="admin-adminUsage-nav"]', '[data-tour="settings-content-area"]'],
-      content: t('adminOnboarding.adminTools', "Finally, we have advanced administration tools like <strong>Auditing</strong> to track system activity and <strong>Usage Analytics</strong> to monitor how your users interact with the platform."),
-      position: 'right',
+      highlightedSelectors: [
+        '[data-tour="admin-adminAudit-nav"]',
+        '[data-tour="admin-adminUsage-nav"]',
+        '[data-tour="settings-content-area"]',
+      ],
+      content: t(
+        "adminOnboarding.adminTools",
+        "Finally, we have advanced administration tools like <strong>Auditing</strong> to track system activity and <strong>Usage Analytics</strong> to monitor how your users interact with the platform.",
+      ),
+      position: "right",
       padding: 10,
       action: () => {
         removeAllGlows();
-        navigateToSection('adminAudit');
+        navigateToSection("adminAudit");
         setTimeout(() => {
-          addGlowToElements(['[data-tour="admin-adminAudit-nav"]', '[data-tour="admin-adminUsage-nav"]', '[data-tour="settings-content-area"]']);
+          addGlowToElements([
+            '[data-tour="admin-adminAudit-nav"]',
+            '[data-tour="admin-adminUsage-nav"]',
+            '[data-tour="settings-content-area"]',
+          ]);
         }, 100);
       },
     },
     [AdminTourStep.WRAP_UP]: {
       selector: '[data-tour="help-button"]',
-      content: t('adminOnboarding.wrapUp', "That's the admin tour! You've seen the enterprise features that make Stirling PDF a powerful, customisable solution for organisations. Access this tour anytime from the <strong>Help</strong> menu."),
-      position: 'right',
+      content: t(
+        "adminOnboarding.wrapUp",
+        "That's the admin tour! You've seen the enterprise features that make Stirling PDF a powerful, customisable solution for organisations. Access this tour anytime from the <strong>Help</strong> menu.",
+      ),
+      position: "right",
       padding: 10,
       action: () => {
         removeAllGlows();
@@ -141,4 +217,3 @@ export function createAdminStepsConfig({ t, actions }: CreateAdminStepsConfigArg
     },
   };
 }
-
diff --git a/frontend/src/core/components/onboarding/onboardingFlowConfig.ts b/frontend/src/core/components/onboarding/onboardingFlowConfig.ts
index 101fb13eef..5f5a9be408 100644
--- a/frontend/src/core/components/onboarding/onboardingFlowConfig.ts
+++ b/frontend/src/core/components/onboarding/onboardingFlowConfig.ts
@@ -1,45 +1,52 @@
-import WelcomeSlide from '@app/components/onboarding/slides/WelcomeSlide';
-import DesktopInstallSlide from '@app/components/onboarding/slides/DesktopInstallSlide';
-import SecurityCheckSlide from '@app/components/onboarding/slides/SecurityCheckSlide';
-import PlanOverviewSlide from '@app/components/onboarding/slides/PlanOverviewSlide';
-import ServerLicenseSlide from '@app/components/onboarding/slides/ServerLicenseSlide';
-import FirstLoginSlide from '@app/components/onboarding/slides/FirstLoginSlide';
-import TourOverviewSlide from '@app/components/onboarding/slides/TourOverviewSlide';
-import AnalyticsChoiceSlide from '@app/components/onboarding/slides/AnalyticsChoiceSlide';
-import MFASetupSlide from '@app/components/onboarding/slides/MFASetupSlide';
-import { SlideConfig, LicenseNotice } from '@app/types/types';
+import WelcomeSlide from "@app/components/onboarding/slides/WelcomeSlide";
+import DesktopInstallSlide from "@app/components/onboarding/slides/DesktopInstallSlide";
+import SecurityCheckSlide from "@app/components/onboarding/slides/SecurityCheckSlide";
+import PlanOverviewSlide from "@app/components/onboarding/slides/PlanOverviewSlide";
+import ServerLicenseSlide from "@app/components/onboarding/slides/ServerLicenseSlide";
+import FirstLoginSlide from "@app/components/onboarding/slides/FirstLoginSlide";
+import TourOverviewSlide from "@app/components/onboarding/slides/TourOverviewSlide";
+import AnalyticsChoiceSlide from "@app/components/onboarding/slides/AnalyticsChoiceSlide";
+import MFASetupSlide from "@app/components/onboarding/slides/MFASetupSlide";
+import { SlideConfig, LicenseNotice } from "@app/types/types";
 
 export type SlideId =
-  | 'first-login'
-  | 'welcome'
-  | 'desktop-install'
-  | 'security-check'
-  | 'admin-overview'
-  | 'server-license'
-  | 'tour-overview'
-  | 'analytics-choice'
-  | 'mfa-setup';
+  | "first-login"
+  | "welcome"
+  | "desktop-install"
+  | "security-check"
+  | "admin-overview"
+  | "server-license"
+  | "tour-overview"
+  | "analytics-choice"
+  | "mfa-setup";
 
-export type HeroType = 'rocket' | 'dual-icon' | 'shield' | 'diamond' | 'logo' | 'lock' | 'analytics';
+export type HeroType =
+  | "rocket"
+  | "dual-icon"
+  | "shield"
+  | "diamond"
+  | "logo"
+  | "lock"
+  | "analytics";
 
 export type ButtonAction =
-  | 'next'
-  | 'prev'
-  | 'close'
-  | 'complete-close'
-  | 'download-selected'
-  | 'security-next'
-  | 'launch-admin'
-  | 'launch-tools'
-  | 'launch-auto'
-  | 'see-plans'
-  | 'skip-to-license'
-  | 'skip-tour'
-  | 'enable-analytics'
-  | 'disable-analytics';
+  | "next"
+  | "prev"
+  | "close"
+  | "complete-close"
+  | "download-selected"
+  | "security-next"
+  | "launch-admin"
+  | "launch-tools"
+  | "launch-auto"
+  | "see-plans"
+  | "skip-to-license"
+  | "skip-tour"
+  | "enable-analytics"
+  | "disable-analytics";
 
 export interface FlowState {
-  selectedRole: 'admin' | 'user' | null;
+  selectedRole: "admin" | "user" | null;
 }
 
 export interface OSOption {
@@ -53,8 +60,8 @@ export interface SlideFactoryParams {
   osUrl: string;
   osOptions?: OSOption[];
   onDownloadUrlChange?: (url: string) => void;
-  selectedRole: 'admin' | 'user' | null;
-  onRoleSelect: (role: 'admin' | 'user' | null) => void;
+  selectedRole: "admin" | "user" | null;
+  onRoleSelect: (role: "admin" | "user" | null) => void;
   licenseNotice?: LicenseNotice;
   loginEnabled?: boolean;
   // First login params
@@ -72,11 +79,11 @@ export interface HeroDefinition {
 
 export interface ButtonDefinition {
   key: string;
-  type: 'button' | 'icon';
+  type: "button" | "icon";
   label?: string;
-  icon?: 'chevron-left';
-  variant?: 'primary' | 'secondary' | 'default';
-  group: 'left' | 'right';
+  icon?: "chevron-left";
+  variant?: "primary" | "secondary" | "default";
+  group: "left" | "right";
   action: ButtonAction;
   disabledWhen?: (state: FlowState) => boolean;
 }
@@ -89,206 +96,212 @@ export interface SlideDefinition {
 }
 
 export const SLIDE_DEFINITIONS: Record<SlideId, SlideDefinition> = {
-  'first-login': {
-    id: 'first-login',
-    createSlide: ({ firstLoginUsername, onPasswordChanged, usingDefaultCredentials }) =>
+  "first-login": {
+    id: "first-login",
+    createSlide: ({
+      firstLoginUsername,
+      onPasswordChanged,
+      usingDefaultCredentials,
+    }) =>
       FirstLoginSlide({
-        username: firstLoginUsername || '',
+        username: firstLoginUsername || "",
         onPasswordChanged: onPasswordChanged || (() => {}),
         usingDefaultCredentials: usingDefaultCredentials || false,
       }),
-    hero: { type: 'lock' },
+    hero: { type: "lock" },
     buttons: [], // Form has its own submit button
   },
-  'welcome': {
-    id: 'welcome',
+  welcome: {
+    id: "welcome",
     createSlide: () => WelcomeSlide(),
-    hero: { type: 'rocket' },
+    hero: { type: "rocket" },
     buttons: [
       {
-        key: 'welcome-next',
-        type: 'button',
-        label: 'onboarding.buttons.next',
-        variant: 'primary',
-        group: 'right',
-        action: 'next',
+        key: "welcome-next",
+        type: "button",
+        label: "onboarding.buttons.next",
+        variant: "primary",
+        group: "right",
+        action: "next",
       },
     ],
   },
-  'desktop-install': {
-    id: 'desktop-install',
-    createSlide: ({ osLabel, osUrl, osOptions, onDownloadUrlChange }) => DesktopInstallSlide({ osLabel, osUrl, osOptions, onDownloadUrlChange }),
-    hero: { type: 'dual-icon' },
+  "desktop-install": {
+    id: "desktop-install",
+    createSlide: ({ osLabel, osUrl, osOptions, onDownloadUrlChange }) =>
+      DesktopInstallSlide({ osLabel, osUrl, osOptions, onDownloadUrlChange }),
+    hero: { type: "dual-icon" },
     buttons: [
       {
-        key: 'desktop-back',
-        type: 'icon',
-        icon: 'chevron-left',
-        group: 'left',
-        action: 'prev',
+        key: "desktop-back",
+        type: "icon",
+        icon: "chevron-left",
+        group: "left",
+        action: "prev",
       },
       {
-        key: 'desktop-skip',
-        type: 'button',
-        label: 'onboarding.buttons.skipForNow',
-        variant: 'secondary',
-        group: 'left',
-        action: 'next',
+        key: "desktop-skip",
+        type: "button",
+        label: "onboarding.buttons.skipForNow",
+        variant: "secondary",
+        group: "left",
+        action: "next",
       },
       {
-        key: 'desktop-download',
-        type: 'button',
-        label: 'onboarding.buttons.download',
-        variant: 'primary',
-        group: 'right',
-        action: 'download-selected',
+        key: "desktop-download",
+        type: "button",
+        label: "onboarding.buttons.download",
+        variant: "primary",
+        group: "right",
+        action: "download-selected",
       },
     ],
   },
-  'security-check': {
-    id: 'security-check',
+  "security-check": {
+    id: "security-check",
     createSlide: ({ selectedRole, onRoleSelect }) =>
       SecurityCheckSlide({ selectedRole, onRoleSelect }),
-    hero: { type: 'shield' },
+    hero: { type: "shield" },
     buttons: [
       {
-        key: 'security-back',
-        type: 'button',
-        label: 'onboarding.buttons.back',
-        variant: 'secondary',
-        group: 'left',
-        action: 'prev',
+        key: "security-back",
+        type: "button",
+        label: "onboarding.buttons.back",
+        variant: "secondary",
+        group: "left",
+        action: "prev",
       },
       {
-        key: 'security-next',
-        type: 'button',
-        label: 'onboarding.buttons.next',
-        variant: 'primary',
-        group: 'right',
-        action: 'security-next',
+        key: "security-next",
+        type: "button",
+        label: "onboarding.buttons.next",
+        variant: "primary",
+        group: "right",
+        action: "security-next",
         disabledWhen: (state) => !state.selectedRole,
       },
     ],
   },
-  'admin-overview': {
-    id: 'admin-overview',
+  "admin-overview": {
+    id: "admin-overview",
     createSlide: ({ licenseNotice, loginEnabled }) =>
       PlanOverviewSlide({ isAdmin: true, licenseNotice, loginEnabled }),
-    hero: { type: 'diamond' },
+    hero: { type: "diamond" },
     buttons: [
       {
-        key: 'admin-back',
-        type: 'icon',
-        icon: 'chevron-left',
-        group: 'left',
-        action: 'prev',
+        key: "admin-back",
+        type: "icon",
+        icon: "chevron-left",
+        group: "left",
+        action: "prev",
       },
       {
-        key: 'admin-show',
-        type: 'button',
-        label: 'onboarding.buttons.showMeAround',
-        variant: 'primary',
-        group: 'right',
-        action: 'launch-admin',
+        key: "admin-show",
+        type: "button",
+        label: "onboarding.buttons.showMeAround",
+        variant: "primary",
+        group: "right",
+        action: "launch-admin",
       },
       {
-        key: 'admin-skip',
-        type: 'button',
-        label: 'onboarding.buttons.skipTheTour',
-        variant: 'secondary',
-        group: 'left',
-        action: 'skip-to-license',
+        key: "admin-skip",
+        type: "button",
+        label: "onboarding.buttons.skipTheTour",
+        variant: "secondary",
+        group: "left",
+        action: "skip-to-license",
       },
     ],
   },
-  'server-license': {
-    id: 'server-license',
+  "server-license": {
+    id: "server-license",
     createSlide: ({ licenseNotice }) => ServerLicenseSlide({ licenseNotice }),
-    hero: { type: 'dual-icon' },
+    hero: { type: "dual-icon" },
     buttons: [
       {
-        key: 'license-back',
-        type: 'icon',
-        icon: 'chevron-left',
-        group: 'left',
-        action: 'prev',
+        key: "license-back",
+        type: "icon",
+        icon: "chevron-left",
+        group: "left",
+        action: "prev",
       },
       {
-        key: 'license-close',
-        type: 'button',
-        label: 'onboarding.buttons.skipForNow',
-        variant: 'secondary',
-        group: 'left',
-        action: 'close',
+        key: "license-close",
+        type: "button",
+        label: "onboarding.buttons.skipForNow",
+        variant: "secondary",
+        group: "left",
+        action: "close",
       },
       {
-        key: 'license-see-plans',
-        type: 'button',
-        label: 'onboarding.serverLicense.seePlans',
-        variant: 'primary',
-        group: 'right',
-        action: 'see-plans',
+        key: "license-see-plans",
+        type: "button",
+        label: "onboarding.serverLicense.seePlans",
+        variant: "primary",
+        group: "right",
+        action: "see-plans",
       },
     ],
   },
-  'tour-overview': {
-    id: 'tour-overview',
+  "tour-overview": {
+    id: "tour-overview",
     createSlide: () => TourOverviewSlide(),
-    hero: { type: 'rocket' },
+    hero: { type: "rocket" },
     buttons: [
       {
-        key: 'tour-overview-back',
-        type: 'icon',
-        icon: 'chevron-left',
-        group: 'left',
-        action: 'prev',
+        key: "tour-overview-back",
+        type: "icon",
+        icon: "chevron-left",
+        group: "left",
+        action: "prev",
       },
       {
-        key: 'tour-overview-skip',
-        type: 'button',
-        label: 'onboarding.buttons.skipForNow',
-        variant: 'secondary',
-        group: 'left',
-        action: 'skip-tour',
+        key: "tour-overview-skip",
+        type: "button",
+        label: "onboarding.buttons.skipForNow",
+        variant: "secondary",
+        group: "left",
+        action: "skip-tour",
       },
       {
-        key: 'tour-overview-show',
-        type: 'button',
-        label: 'onboarding.buttons.showMeAround',
-        variant: 'primary',
-        group: 'right',
-        action: 'launch-tools',
+        key: "tour-overview-show",
+        type: "button",
+        label: "onboarding.buttons.showMeAround",
+        variant: "primary",
+        group: "right",
+        action: "launch-tools",
       },
     ],
   },
-  'analytics-choice': {
-    id: 'analytics-choice',
-    createSlide: ({ analyticsError }) => AnalyticsChoiceSlide({ analyticsError }),
-    hero: { type: 'analytics' },
+  "analytics-choice": {
+    id: "analytics-choice",
+    createSlide: ({ analyticsError }) =>
+      AnalyticsChoiceSlide({ analyticsError }),
+    hero: { type: "analytics" },
     buttons: [
       {
-        key: 'analytics-disable',
-        type: 'button',
-        label: 'no',
-        variant: 'secondary',
-        group: 'left',
-        action: 'disable-analytics',
+        key: "analytics-disable",
+        type: "button",
+        label: "no",
+        variant: "secondary",
+        group: "left",
+        action: "disable-analytics",
       },
       {
-        key: 'analytics-enable',
-        type: 'button',
-        label: 'yes',
-        variant: 'primary',
-        group: 'right',
-        action: 'enable-analytics',
+        key: "analytics-enable",
+        type: "button",
+        label: "yes",
+        variant: "primary",
+        group: "right",
+        action: "enable-analytics",
       },
     ],
   },
-  'mfa-setup': {
-    id: 'mfa-setup',
-    createSlide: ({ onMfaSetupComplete = () => {} }: SlideFactoryParams) => MFASetupSlide({ onMfaSetupComplete }),
-    hero: { type: 'lock' },
+  "mfa-setup": {
+    id: "mfa-setup",
+    createSlide: ({ onMfaSetupComplete = () => {} }: SlideFactoryParams) =>
+      MFASetupSlide({ onMfaSetupComplete }),
+    hero: { type: "lock" },
     buttons: [], // Form has its own submit button
   },
 };
-
diff --git a/frontend/src/core/components/onboarding/orchestrator/onboardingConfig.ts b/frontend/src/core/components/onboarding/orchestrator/onboardingConfig.ts
index 9528694c3e..6e10ec97f3 100644
--- a/frontend/src/core/components/onboarding/orchestrator/onboardingConfig.ts
+++ b/frontend/src/core/components/onboarding/orchestrator/onboardingConfig.ts
@@ -1,23 +1,21 @@
 export type OnboardingStepId =
-  | 'first-login'
-  | 'welcome'
-  | 'desktop-install'
-  | 'security-check'
-  | 'admin-overview'
-  | 'tool-layout'
-  | 'tour-overview'
-  | 'server-license'
-  | 'analytics-choice'
-  | 'mfa-setup';
+  | "first-login"
+  | "welcome"
+  | "desktop-install"
+  | "security-check"
+  | "admin-overview"
+  | "tool-layout"
+  | "tour-overview"
+  | "server-license"
+  | "analytics-choice"
+  | "mfa-setup";
 
-export type OnboardingStepType =
-  | 'modal-slide'
-  | 'tool-prompt';
+export type OnboardingStepType = "modal-slide" | "tool-prompt";
 
 export interface OnboardingRuntimeState {
-  selectedRole: 'admin' | 'user' | null;
+  selectedRole: "admin" | "user" | null;
   tourRequested: boolean;
-  tourType: 'admin' | 'tools' | 'whatsnew';
+  tourType: "admin" | "tools" | "whatsnew";
   isDesktopApp: boolean;
   desktopSlideEnabled: boolean;
   analyticsNotConfigured: boolean;
@@ -43,14 +41,23 @@ export interface OnboardingStep {
   id: OnboardingStepId;
   type: OnboardingStepType;
   condition: (ctx: OnboardingConditionContext) => boolean;
-  slideId?: 'first-login' | 'welcome' | 'desktop-install' | 'security-check' | 'admin-overview' | 'server-license' | 'tour-overview' | 'analytics-choice' | 'mfa-setup';
+  slideId?:
+    | "first-login"
+    | "welcome"
+    | "desktop-install"
+    | "security-check"
+    | "admin-overview"
+    | "server-license"
+    | "tour-overview"
+    | "analytics-choice"
+    | "mfa-setup";
   allowDismiss?: boolean;
 }
 
 export const DEFAULT_RUNTIME_STATE: OnboardingRuntimeState = {
   selectedRole: null,
   tourRequested: false,
-  tourType: 'whatsnew',
+  tourType: "whatsnew",
   isDesktopApp: false,
   analyticsNotConfigured: false,
   analyticsEnabled: false,
@@ -61,7 +68,7 @@ export const DEFAULT_RUNTIME_STATE: OnboardingRuntimeState = {
     requiresLicense: false,
   },
   requiresPasswordChange: false,
-  firstLoginUsername: '',
+  firstLoginUsername: "",
   usingDefaultCredentials: false,
   desktopSlideEnabled: true,
   requiresMfaSetup: false,
@@ -69,59 +76,61 @@ export const DEFAULT_RUNTIME_STATE: OnboardingRuntimeState = {
 
 export const ONBOARDING_STEPS: OnboardingStep[] = [
   {
-    id: 'first-login',
-    type: 'modal-slide',
-    slideId: 'first-login',
+    id: "first-login",
+    type: "modal-slide",
+    slideId: "first-login",
     condition: (ctx) => ctx.requiresPasswordChange,
   },
   {
-    id: 'welcome',
-    type: 'modal-slide',
-    slideId: 'welcome',
+    id: "welcome",
+    type: "modal-slide",
+    slideId: "welcome",
     // Desktop has its own onboarding modal (DesktopOnboardingModal)
     condition: (ctx) => !ctx.isDesktopApp,
   },
   {
-    id: 'admin-overview',
-    type: 'modal-slide',
-    slideId: 'admin-overview',
+    id: "admin-overview",
+    type: "modal-slide",
+    slideId: "admin-overview",
     condition: (ctx) => ctx.effectiveIsAdmin,
   },
   {
-    id: 'desktop-install',
-    type: 'modal-slide',
-    slideId: 'desktop-install',
+    id: "desktop-install",
+    type: "modal-slide",
+    slideId: "desktop-install",
     condition: (ctx) => !ctx.isDesktopApp && ctx.desktopSlideEnabled,
   },
   {
-    id: 'security-check',
-    type: 'modal-slide',
-    slideId: 'security-check',
+    id: "security-check",
+    type: "modal-slide",
+    slideId: "security-check",
     condition: () => false,
   },
   {
-    id: 'tool-layout',
-    type: 'tool-prompt',
+    id: "tool-layout",
+    type: "tool-prompt",
     condition: () => false,
   },
   {
-    id: 'tour-overview',
-    type: 'modal-slide',
-    slideId: 'tour-overview',
-    condition: (ctx) => !ctx.effectiveIsAdmin && ctx.tourType !== 'admin' && !ctx.isDesktopApp,
+    id: "tour-overview",
+    type: "modal-slide",
+    slideId: "tour-overview",
+    condition: (ctx) =>
+      !ctx.effectiveIsAdmin && ctx.tourType !== "admin" && !ctx.isDesktopApp,
   },
   {
-    id: 'server-license',
-    type: 'modal-slide',
-    slideId: 'server-license',
-    condition: (ctx) => ctx.effectiveIsAdmin && ctx.licenseNotice.requiresLicense,
+    id: "server-license",
+    type: "modal-slide",
+    slideId: "server-license",
+    condition: (ctx) =>
+      ctx.effectiveIsAdmin && ctx.licenseNotice.requiresLicense,
   },
   {
-    id: 'mfa-setup',
-    type: 'modal-slide',
-    slideId: 'mfa-setup',
+    id: "mfa-setup",
+    type: "modal-slide",
+    slideId: "mfa-setup",
     condition: (ctx) => ctx.requiresMfaSetup,
-  }
+  },
 ];
 
 export function getStepById(id: OnboardingStepId): OnboardingStep | undefined {
@@ -131,4 +140,3 @@ export function getStepById(id: OnboardingStepId): OnboardingStep | undefined {
 export function getStepIndex(id: OnboardingStepId): number {
   return ONBOARDING_STEPS.findIndex((step) => step.id === id);
 }
-
diff --git a/frontend/src/core/components/onboarding/orchestrator/onboardingStorage.ts b/frontend/src/core/components/onboarding/orchestrator/onboardingStorage.ts
index 9e3065614a..73f45cb1ea 100644
--- a/frontend/src/core/components/onboarding/orchestrator/onboardingStorage.ts
+++ b/frontend/src/core/components/onboarding/orchestrator/onboardingStorage.ts
@@ -1,73 +1,85 @@
-const STORAGE_PREFIX = 'onboarding';
+const STORAGE_PREFIX = "onboarding";
 const TOURS_TOOLTIP_KEY = `${STORAGE_PREFIX}::tours-tooltip-shown`;
 const ONBOARDING_COMPLETED_KEY = `${STORAGE_PREFIX}::completed`;
 
 export function isOnboardingCompleted(): boolean {
-  if (typeof window === 'undefined') return false;
+  if (typeof window === "undefined") return false;
   try {
-    return localStorage.getItem(ONBOARDING_COMPLETED_KEY) === 'true';
+    return localStorage.getItem(ONBOARDING_COMPLETED_KEY) === "true";
   } catch {
     return false;
   }
 }
 
 export function markOnboardingCompleted(): void {
-  if (typeof window === 'undefined') return;
+  if (typeof window === "undefined") return;
   try {
-    localStorage.setItem(ONBOARDING_COMPLETED_KEY, 'true');
+    localStorage.setItem(ONBOARDING_COMPLETED_KEY, "true");
   } catch (error) {
-    console.error('[onboardingStorage] Error marking onboarding as completed:', error);
+    console.error(
+      "[onboardingStorage] Error marking onboarding as completed:",
+      error,
+    );
   }
 }
 
 export function resetOnboardingProgress(): void {
-  if (typeof window === 'undefined') return;
+  if (typeof window === "undefined") return;
   try {
     localStorage.removeItem(ONBOARDING_COMPLETED_KEY);
   } catch (error) {
-    console.error('[onboardingStorage] Error resetting onboarding progress:', error);
+    console.error(
+      "[onboardingStorage] Error resetting onboarding progress:",
+      error,
+    );
   }
 }
 
 export function hasShownToursTooltip(): boolean {
-  if (typeof window === 'undefined') return false;
+  if (typeof window === "undefined") return false;
   try {
-    return localStorage.getItem(TOURS_TOOLTIP_KEY) === 'true';
+    return localStorage.getItem(TOURS_TOOLTIP_KEY) === "true";
   } catch {
     return false;
   }
 }
 
 export function markToursTooltipShown(): void {
-  if (typeof window === 'undefined') return;
+  if (typeof window === "undefined") return;
   try {
-    localStorage.setItem(TOURS_TOOLTIP_KEY, 'true');
+    localStorage.setItem(TOURS_TOOLTIP_KEY, "true");
   } catch (error) {
-    console.error('[onboardingStorage] Error marking tours tooltip as shown:', error);
+    console.error(
+      "[onboardingStorage] Error marking tours tooltip as shown:",
+      error,
+    );
   }
 }
 
 export function migrateFromLegacyPreferences(): void {
-  if (typeof window === 'undefined') return;
+  if (typeof window === "undefined") return;
 
   const migrationKey = `${STORAGE_PREFIX}::migrated`;
 
   try {
     // Skip if already migrated
-    if (localStorage.getItem(migrationKey) === 'true') return;
+    if (localStorage.getItem(migrationKey) === "true") return;
 
-    const prefsRaw = localStorage.getItem('stirlingpdf_preferences');
+    const prefsRaw = localStorage.getItem("stirlingpdf_preferences");
     if (prefsRaw) {
       const prefs = JSON.parse(prefsRaw) as Record<string, unknown>;
 
       // If user had completed onboarding in old system, mark new system as complete
-      if (prefs.hasCompletedOnboarding === true || prefs.hasSeenIntroOnboarding === true) {
+      if (
+        prefs.hasCompletedOnboarding === true ||
+        prefs.hasSeenIntroOnboarding === true
+      ) {
         markOnboardingCompleted();
       }
     }
 
     // Mark migration complete
-    localStorage.setItem(migrationKey, 'true');
+    localStorage.setItem(migrationKey, "true");
   } catch {
     // If migration fails, onboarding will show again - safer than hiding it
   }
diff --git a/frontend/src/core/components/onboarding/orchestrator/useOnboardingOrchestrator.ts b/frontend/src/core/components/onboarding/orchestrator/useOnboardingOrchestrator.ts
index 54d1d2acf4..44052636d1 100644
--- a/frontend/src/core/components/onboarding/orchestrator/useOnboardingOrchestrator.ts
+++ b/frontend/src/core/components/onboarding/orchestrator/useOnboardingOrchestrator.ts
@@ -1,7 +1,7 @@
-import { useState, useCallback, useMemo, useEffect, useRef } from 'react';
-import { useLocation } from 'react-router-dom';
-import { useServerExperience } from '@app/hooks/useServerExperience';
-import { useAppConfig } from '@app/contexts/AppConfigContext';
+import { useState, useCallback, useMemo, useEffect, useRef } from "react";
+import { useLocation } from "react-router-dom";
+import { useServerExperience } from "@app/hooks/useServerExperience";
+import { useAppConfig } from "@app/contexts/AppConfigContext";
 
 import {
   ONBOARDING_STEPS,
@@ -10,39 +10,48 @@ import {
   type OnboardingRuntimeState,
   type OnboardingConditionContext,
   DEFAULT_RUNTIME_STATE,
-} from '@app/components/onboarding/orchestrator/onboardingConfig';
+} from "@app/components/onboarding/orchestrator/onboardingConfig";
 import {
   isOnboardingCompleted,
   markOnboardingCompleted,
   migrateFromLegacyPreferences,
-} from '@app/components/onboarding/orchestrator/onboardingStorage';
-import { accountService } from '@app/services/accountService';
-import { useBypassOnboarding } from '@app/components/onboarding/useBypassOnboarding';
+} from "@app/components/onboarding/orchestrator/onboardingStorage";
+import { accountService } from "@app/services/accountService";
+import { useBypassOnboarding } from "@app/components/onboarding/useBypassOnboarding";
 
-const AUTH_ROUTES = ['/login', '/signup', '/auth', '/invite'];
-const SESSION_TOUR_REQUESTED = 'onboarding::session::tour-requested';
-const SESSION_TOUR_TYPE = 'onboarding::session::tour-type';
-const SESSION_SELECTED_ROLE = 'onboarding::session::selected-role';
+const AUTH_ROUTES = ["/login", "/signup", "/auth", "/invite"];
+const SESSION_TOUR_REQUESTED = "onboarding::session::tour-requested";
+const SESSION_TOUR_TYPE = "onboarding::session::tour-type";
+const SESSION_SELECTED_ROLE = "onboarding::session::selected-role";
 
 // Check if user has an auth token (to avoid flash before redirect)
 function hasAuthToken(): boolean {
-  if (typeof window === 'undefined') return false;
-  return !!localStorage.getItem('stirling_jwt');
+  if (typeof window === "undefined") return false;
+  return !!localStorage.getItem("stirling_jwt");
 }
 
 // Get initial runtime state from session storage (survives remounts)
-function getInitialRuntimeState(baseState: OnboardingRuntimeState): OnboardingRuntimeState {
-  if (typeof window === 'undefined') {
+function getInitialRuntimeState(
+  baseState: OnboardingRuntimeState,
+): OnboardingRuntimeState {
+  if (typeof window === "undefined") {
     return baseState;
   }
 
   try {
-    const tourRequested = sessionStorage.getItem(SESSION_TOUR_REQUESTED) === 'true';
+    const tourRequested =
+      sessionStorage.getItem(SESSION_TOUR_REQUESTED) === "true";
     const sessionTourType = sessionStorage.getItem(SESSION_TOUR_TYPE);
-    const tourType = (sessionTourType === 'admin' || sessionTourType === 'tools' || sessionTourType === 'whatsnew')
-      ? sessionTourType
-      : 'whatsnew';
-    const selectedRole = sessionStorage.getItem(SESSION_SELECTED_ROLE) as 'admin' | 'user' | null;
+    const tourType =
+      sessionTourType === "admin" ||
+      sessionTourType === "tools" ||
+      sessionTourType === "whatsnew"
+        ? sessionTourType
+        : "whatsnew";
+    const selectedRole = sessionStorage.getItem(SESSION_SELECTED_ROLE) as
+      | "admin"
+      | "user"
+      | null;
 
     return {
       ...baseState,
@@ -56,11 +65,14 @@ function getInitialRuntimeState(baseState: OnboardingRuntimeState): OnboardingRu
 }
 
 function persistRuntimeState(state: Partial<OnboardingRuntimeState>): void {
-  if (typeof window === 'undefined') return;
+  if (typeof window === "undefined") return;
 
   try {
     if (state.tourRequested !== undefined) {
-      sessionStorage.setItem(SESSION_TOUR_REQUESTED, state.tourRequested ? 'true' : 'false');
+      sessionStorage.setItem(
+        SESSION_TOUR_REQUESTED,
+        state.tourRequested ? "true" : "false",
+      );
     }
     if (state.tourType !== undefined) {
       sessionStorage.setItem(SESSION_TOUR_TYPE, state.tourType);
@@ -73,12 +85,15 @@ function persistRuntimeState(state: Partial<OnboardingRuntimeState>): void {
       }
     }
   } catch (error) {
-    console.error('[useOnboardingOrchestrator] Error persisting runtime state:', error);
+    console.error(
+      "[useOnboardingOrchestrator] Error persisting runtime state:",
+      error,
+    );
   }
 }
 
 function clearRuntimeStateSession(): void {
-  if (typeof window === 'undefined') return;
+  if (typeof window === "undefined") return;
 
   try {
     sessionStorage.removeItem(SESSION_TOUR_REQUESTED);
@@ -94,9 +109,12 @@ function parseMfaRequired(settings: string | null | undefined): boolean {
 
   try {
     const parsed = JSON.parse(settings) as { mfaRequired?: string };
-    return parsed.mfaRequired?.toLowerCase() === 'true';
+    return parsed.mfaRequired?.toLowerCase() === "true";
   } catch (error) {
-    console.warn('[useOnboardingOrchestrator] Failed to parse account settings JSON:', error);
+    console.warn(
+      "[useOnboardingOrchestrator] Failed to parse account settings JSON:",
+      error,
+    );
     return false;
   }
 }
@@ -152,7 +170,7 @@ export interface UseOnboardingOrchestratorOptions {
 }
 
 export function useOnboardingOrchestrator(
-  options?: UseOnboardingOrchestratorOptions
+  options?: UseOnboardingOrchestratorOptions,
 ): UseOnboardingOrchestratorResult {
   const defaultState = options?.defaultRuntimeState ?? DEFAULT_RUNTIME_STATE;
   const serverExperience = useServerExperience();
@@ -161,7 +179,7 @@ export function useOnboardingOrchestrator(
   const bypassOnboarding = useBypassOnboarding();
 
   const [runtimeState, setRuntimeState] = useState<OnboardingRuntimeState>(() =>
-    getInitialRuntimeState(defaultState)
+    getInitialRuntimeState(defaultState),
   );
   const [isPaused, setIsPaused] = useState(false);
   const [isInitialized, setIsInitialized] = useState(false);
@@ -186,10 +204,11 @@ export function useOnboardingOrchestrator(
         totalUsers: serverExperience.totalUsers,
         freeTierLimit: serverExperience.freeTierLimit,
         isOverLimit: serverExperience.overFreeTierLimit ?? false,
-        requiresLicense: !serverExperience.hasPaidLicense && (
-          serverExperience.overFreeTierLimit === true ||
-          (serverExperience.effectiveIsAdmin && serverExperience.userCountResolved)
-        ),
+        requiresLicense:
+          !serverExperience.hasPaidLicense &&
+          (serverExperience.overFreeTierLimit === true ||
+            (serverExperience.effectiveIsAdmin &&
+              serverExperience.userCountResolved)),
       },
     }));
   }, [
@@ -220,7 +239,10 @@ export function useOnboardingOrchestrator(
           requiresMfaSetup: parseMfaRequired(accountData.settings),
         }));
       } catch (error) {
-        console.log('[OnboardingOrchestrator] Failed to fetch account data for onboarding runtime state:', error);
+        console.log(
+          "[OnboardingOrchestrator] Failed to fetch account data for onboarding runtime state:",
+          error,
+        );
         // Account endpoint failed - user not logged in or security disabled
       }
     };
@@ -230,29 +252,39 @@ export function useOnboardingOrchestrator(
     }
   }, [config?.enableLogin, configLoading]);
 
-  const isOnAuthRoute = AUTH_ROUTES.some((route) => location.pathname.startsWith(route));
+  const isOnAuthRoute = AUTH_ROUTES.some((route) =>
+    location.pathname.startsWith(route),
+  );
   const loginEnabled = config?.enableLogin === true;
   const isUnauthenticatedWithLoginEnabled = loginEnabled && !hasAuthToken();
   const shouldBlockOnboarding =
-    bypassOnboarding || isOnAuthRoute || configLoading || isUnauthenticatedWithLoginEnabled;
+    bypassOnboarding ||
+    isOnAuthRoute ||
+    configLoading ||
+    isUnauthenticatedWithLoginEnabled;
 
-  const conditionContext = useMemo<OnboardingConditionContext>(() => ({
-    ...serverExperience,
-    ...runtimeState,
-    effectiveIsAdmin: serverExperience.effectiveIsAdmin ||
-      (!serverExperience.loginEnabled && runtimeState.selectedRole === 'admin'),
-  }), [serverExperience, runtimeState]);
+  const conditionContext = useMemo<OnboardingConditionContext>(
+    () => ({
+      ...serverExperience,
+      ...runtimeState,
+      effectiveIsAdmin:
+        serverExperience.effectiveIsAdmin ||
+        (!serverExperience.loginEnabled &&
+          runtimeState.selectedRole === "admin"),
+    }),
+    [serverExperience, runtimeState],
+  );
 
   const activeFlow = useMemo(() => {
     return ONBOARDING_STEPS.filter((step) => step.condition(conditionContext));
   }, [conditionContext]);
 
   // Wait for config AND admin status before calculating initial step
-  const adminStatusResolved = !configLoading && (
-    config?.enableLogin === false ||
-    config?.enableLogin === undefined ||
-    config?.isAdmin !== undefined
-  );
+  const adminStatusResolved =
+    !configLoading &&
+    (config?.enableLogin === false ||
+      config?.enableLogin === undefined ||
+      config?.isAdmin !== undefined);
 
   useEffect(() => {
     if (configLoading || !adminStatusResolved) return;
@@ -280,14 +312,27 @@ export function useOnboardingOrchestrator(
 
   const totalSteps = activeFlow.length;
 
-  const isComplete = isInitialized &&
-    (totalSteps === 0 || currentStepIndex >= totalSteps || isOnboardingCompleted());
-  const currentStep = (currentStepIndex >= 0 && currentStepIndex < totalSteps)
-    ? activeFlow[currentStepIndex]
-    : null;
-  const isActive = !shouldBlockOnboarding && !isPaused && !isComplete && isInitialized && currentStep !== null;
-  const isLoading = configLoading || !adminStatusResolved || !isInitialized ||
-    !initialIndexSet.current || (currentStepIndex === -1 && activeFlow.length > 0);
+  const isComplete =
+    isInitialized &&
+    (totalSteps === 0 ||
+      currentStepIndex >= totalSteps ||
+      isOnboardingCompleted());
+  const currentStep =
+    currentStepIndex >= 0 && currentStepIndex < totalSteps
+      ? activeFlow[currentStepIndex]
+      : null;
+  const isActive =
+    !shouldBlockOnboarding &&
+    !isPaused &&
+    !isComplete &&
+    isInitialized &&
+    currentStep !== null;
+  const isLoading =
+    configLoading ||
+    !adminStatusResolved ||
+    !isInitialized ||
+    !initialIndexSet.current ||
+    (currentStepIndex === -1 && activeFlow.length > 0);
 
   useEffect(() => {
     if (!configLoading && !isInitialized) setIsInitialized(true);
@@ -325,24 +370,29 @@ export function useOnboardingOrchestrator(
     setCurrentStepIndex(nextIndex);
   }, [currentStepIndex, totalSteps]);
 
-
-  const updateRuntimeState = useCallback((updates: Partial<OnboardingRuntimeState>) => {
-    persistRuntimeState(updates);
-    setRuntimeState((prev) => ({ ...prev, ...updates }));
-  }, []);
+  const updateRuntimeState = useCallback(
+    (updates: Partial<OnboardingRuntimeState>) => {
+      persistRuntimeState(updates);
+      setRuntimeState((prev) => ({ ...prev, ...updates }));
+    },
+    [],
+  );
 
   const refreshFlow = useCallback(() => {
     initialIndexSet.current = false;
     setCurrentStepIndex(-1);
   }, []);
 
-  const startStep = useCallback((stepId: OnboardingStepId) => {
-    const index = activeFlow.findIndex((step) => step.id === stepId);
-    if (index !== -1) {
-      setCurrentStepIndex(index);
-      setIsPaused(false);
-    }
-  }, [activeFlow]);
+  const startStep = useCallback(
+    (stepId: OnboardingStepId) => {
+      const index = activeFlow.findIndex((step) => step.id === stepId);
+      if (index !== -1) {
+        setCurrentStepIndex(index);
+        setIsPaused(false);
+      }
+    },
+    [activeFlow],
+  );
 
   const pause = useCallback(() => setIsPaused(true), []);
   const resume = useCallback(() => setIsPaused(false), []);
diff --git a/frontend/src/core/components/onboarding/slides/AnalyticsChoiceSlide.tsx b/frontend/src/core/components/onboarding/slides/AnalyticsChoiceSlide.tsx
index c04009ca4c..6960b88c27 100644
--- a/frontend/src/core/components/onboarding/slides/AnalyticsChoiceSlide.tsx
+++ b/frontend/src/core/components/onboarding/slides/AnalyticsChoiceSlide.tsx
@@ -1,20 +1,25 @@
-import React from 'react';
-import { Trans } from 'react-i18next';
-import { Button } from '@mantine/core';
-import OpenInNewIcon from '@mui/icons-material/OpenInNew';
-import i18n from '@app/i18n';
-import { SlideConfig } from '@app/types/types';
-import { UNIFIED_CIRCLE_CONFIG } from '@app/components/onboarding/slides/unifiedBackgroundConfig';
-import styles from '@app/components/onboarding/InitialOnboardingModal/InitialOnboardingModal.module.css';
+import React from "react";
+import { Trans } from "react-i18next";
+import { Button } from "@mantine/core";
+import OpenInNewIcon from "@mui/icons-material/OpenInNew";
+import i18n from "@app/i18n";
+import { SlideConfig } from "@app/types/types";
+import { UNIFIED_CIRCLE_CONFIG } from "@app/components/onboarding/slides/unifiedBackgroundConfig";
+import styles from "@app/components/onboarding/InitialOnboardingModal/InitialOnboardingModal.module.css";
 
 interface AnalyticsChoiceSlideProps {
   analyticsError?: string | null;
 }
 
-export default function AnalyticsChoiceSlide({ analyticsError }: AnalyticsChoiceSlideProps): SlideConfig {
+export default function AnalyticsChoiceSlide({
+  analyticsError,
+}: AnalyticsChoiceSlideProps): SlideConfig {
   return {
-    key: 'analytics-choice',
-    title: i18n.t('analytics.title', 'Do you want to help make Stirling PDF better?'),
+    key: "analytics-choice",
+    title: i18n.t(
+      "analytics.title",
+      "Do you want to help make Stirling PDF better?",
+    ),
     body: (
       <div className={styles.bodyCopyInner}>
         <Trans
@@ -29,27 +34,31 @@ export default function AnalyticsChoiceSlide({ analyticsError }: AnalyticsChoice
           components={{ strong: <strong /> }}
         />
         <br />
-        <div style={{ textAlign: 'right', marginTop: 0 }}>
+        <div style={{ textAlign: "right", marginTop: 0 }}>
           <Button
             variant="default"
             size="sm"
-            onClick={() => window.open('https://docs.stirlingpdf.com/analytics-telemetry/', '_blank')}
+            onClick={() =>
+              window.open(
+                "https://docs.stirlingpdf.com/analytics-telemetry/",
+                "_blank",
+              )
+            }
             rightSection={<OpenInNewIcon style={{ fontSize: 16 }} />}
           >
-            {i18n.t('analytics.learnMore', 'Learn more about our analytics')}
+            {i18n.t("analytics.learnMore", "Learn more about our analytics")}
           </Button>
         </div>
         {analyticsError && (
-          <div style={{ color: 'var(--mantine-color-red-6)', marginTop: 12 }}>
+          <div style={{ color: "var(--mantine-color-red-6)", marginTop: 12 }}>
             {analyticsError}
           </div>
         )}
       </div>
     ),
     background: {
-      gradientStops: ['#0EA5E9', '#6366F1'],
+      gradientStops: ["#0EA5E9", "#6366F1"],
       circles: UNIFIED_CIRCLE_CONFIG,
     },
   };
 }
-
diff --git a/frontend/src/core/components/onboarding/slides/AnimatedSlideBackground.module.css b/frontend/src/core/components/onboarding/slides/AnimatedSlideBackground.module.css
index 5e5799ec2d..e278703955 100644
--- a/frontend/src/core/components/onboarding/slides/AnimatedSlideBackground.module.css
+++ b/frontend/src/core/components/onboarding/slides/AnimatedSlideBackground.module.css
@@ -65,6 +65,10 @@
     transform: translate3d(0, 0, 0);
   }
   100% {
-    transform: translate3d(var(--circle-move-x, 40px), var(--circle-move-y, 24px), 0);
+    transform: translate3d(
+      var(--circle-move-x, 40px),
+      var(--circle-move-y, 24px),
+      0
+    );
   }
 }
diff --git a/frontend/src/core/components/onboarding/slides/AnimatedSlideBackground.tsx b/frontend/src/core/components/onboarding/slides/AnimatedSlideBackground.tsx
index 289b07b6c4..56cbb0dd11 100644
--- a/frontend/src/core/components/onboarding/slides/AnimatedSlideBackground.tsx
+++ b/frontend/src/core/components/onboarding/slides/AnimatedSlideBackground.tsx
@@ -1,12 +1,12 @@
-import React from 'react';
-import styles from '@app/components/onboarding/slides/AnimatedSlideBackground.module.css';
-import { AnimatedSlideBackgroundProps } from '@app/types/types';
+import React from "react";
+import styles from "@app/components/onboarding/slides/AnimatedSlideBackground.module.css";
+import { AnimatedSlideBackgroundProps } from "@app/types/types";
 
 type CircleStyles = React.CSSProperties & {
-  '--circle-move-x'?: string;
-  '--circle-move-y'?: string;
-  '--circle-duration'?: string;
-  '--circle-delay'?: string;
+  "--circle-move-x"?: string;
+  "--circle-move-y"?: string;
+  "--circle-duration"?: string;
+  "--circle-delay"?: string;
 };
 
 interface AnimatedSlideBackgroundComponentProps extends AnimatedSlideBackgroundProps {
@@ -19,8 +19,11 @@ export default function AnimatedSlideBackground({
   circles,
   isActive,
 }: AnimatedSlideBackgroundComponentProps) {
-  const [prevGradient, setPrevGradient] = React.useState<[string, string] | null>(null);
-  const [currentGradient, setCurrentGradient] = React.useState<[string, string]>(gradientStops);
+  const [prevGradient, setPrevGradient] = React.useState<
+    [string, string] | null
+  >(null);
+  const [currentGradient, setCurrentGradient] =
+    React.useState<[string, string]>(gradientStops);
   const [isTransitioning, setIsTransitioning] = React.useState(false);
   const isFirstMount = React.useRef(true);
 
@@ -31,13 +34,16 @@ export default function AnimatedSlideBackground({
       setCurrentGradient(gradientStops);
       return;
     }
-    
+
     // Only transition if gradient actually changed
-    if (currentGradient[0] !== gradientStops[0] || currentGradient[1] !== gradientStops[1]) {
+    if (
+      currentGradient[0] !== gradientStops[0] ||
+      currentGradient[1] !== gradientStops[1]
+    ) {
       // Store previous gradient and start transition
       setPrevGradient(currentGradient);
       setIsTransitioning(true);
-      
+
       // Update to new gradient (will fade in)
       setCurrentGradient(gradientStops);
     }
@@ -59,8 +65,8 @@ export default function AnimatedSlideBackground({
   return (
     <div className={styles.hero} key="animated-background">
       {prevGradientStyle && isTransitioning && (
-        <div 
-          className={`${styles.gradientLayer} ${styles.gradientLayerPrevFadeOut}`} 
+        <div
+          className={`${styles.gradientLayer} ${styles.gradientLayerPrevFadeOut}`}
           style={prevGradientStyle}
           onTransitionEnd={() => {
             setPrevGradient(null);
@@ -69,14 +75,24 @@ export default function AnimatedSlideBackground({
         />
       )}
       <div
-        className={`${styles.gradientLayer} ${isActive ? styles.gradientLayerActive : ''}`.trim()}
+        className={`${styles.gradientLayer} ${isActive ? styles.gradientLayerActive : ""}`.trim()}
         style={currentGradientStyle}
       />
       {circles.map((circle, index) => {
-        const { position, size, color, opacity, blur, amplitude = 48, duration = 15, delay = 0 } = circle;
+        const {
+          position,
+          size,
+          color,
+          opacity,
+          blur,
+          amplitude = 48,
+          duration = 15,
+          delay = 0,
+        } = circle;
 
-        const moveX = position === 'bottom-left' ? amplitude : -amplitude;
-        const moveY = position === 'bottom-left' ? -amplitude * 0.6 : amplitude * 0.6;
+        const moveX = position === "bottom-left" ? amplitude : -amplitude;
+        const moveY =
+          position === "bottom-left" ? -amplitude * 0.6 : amplitude * 0.6;
 
         const circleStyle: CircleStyles = {
           width: size,
@@ -84,17 +100,17 @@ export default function AnimatedSlideBackground({
           background: color,
           opacity: opacity ?? 0.9,
           filter: blur ? `blur(${blur}px)` : undefined,
-          '--circle-move-x': `${moveX}px`,
-          '--circle-move-y': `${moveY}px`,
-          '--circle-duration': `${duration}s`,
-          '--circle-delay': `${delay}s`,
+          "--circle-move-x": `${moveX}px`,
+          "--circle-move-y": `${moveY}px`,
+          "--circle-duration": `${duration}s`,
+          "--circle-delay": `${delay}s`,
         };
 
         const defaultOffset = -size / 2;
         const offsetX = circle.offsetX ?? 0;
         const offsetY = circle.offsetY ?? 0;
 
-        if (position === 'bottom-left') {
+        if (position === "bottom-left") {
           circleStyle.left = `${defaultOffset + offsetX}px`;
           circleStyle.bottom = `${defaultOffset + offsetY}px`;
         } else {
diff --git a/frontend/src/core/components/onboarding/slides/DesktopInstallSlide.tsx b/frontend/src/core/components/onboarding/slides/DesktopInstallSlide.tsx
index 9cebfbb9cd..eb3e743527 100644
--- a/frontend/src/core/components/onboarding/slides/DesktopInstallSlide.tsx
+++ b/frontend/src/core/components/onboarding/slides/DesktopInstallSlide.tsx
@@ -1,8 +1,11 @@
-import React from 'react';
-import { useTranslation } from 'react-i18next';
-import { SlideConfig } from '@app/types/types';
-import { UNIFIED_CIRCLE_CONFIG } from '@app/components/onboarding/slides/unifiedBackgroundConfig';
-import { DesktopInstallTitle, type OSOption } from '@app/components/onboarding/slides/DesktopInstallTitle';
+import React from "react";
+import { useTranslation } from "react-i18next";
+import { SlideConfig } from "@app/types/types";
+import { UNIFIED_CIRCLE_CONFIG } from "@app/components/onboarding/slides/unifiedBackgroundConfig";
+import {
+  DesktopInstallTitle,
+  type OSOption,
+} from "@app/components/onboarding/slides/DesktopInstallTitle";
 
 export type { OSOption };
 
@@ -19,8 +22,8 @@ const DesktopInstallBody = () => {
   return (
     <span>
       {t(
-        'onboarding.desktopInstall.body',
-        'Stirling works best as a desktop app. You can use it offline, access documents faster, and make edits locally on your computer.',
+        "onboarding.desktopInstall.body",
+        "Stirling works best as a desktop app. You can use it offline, access documents faster, and make edits locally on your computer.",
       )}
     </span>
   );
@@ -32,11 +35,10 @@ export default function DesktopInstallSlide({
   osOptions = [],
   onDownloadUrlChange,
 }: DesktopInstallSlideProps): SlideConfig {
-
   return {
-    key: 'desktop-install',
+    key: "desktop-install",
     title: (
-      <DesktopInstallTitle 
+      <DesktopInstallTitle
         osLabel={osLabel}
         osUrl={osUrl}
         osOptions={osOptions || []}
@@ -46,9 +48,8 @@ export default function DesktopInstallSlide({
     body: <DesktopInstallBody />,
     downloadUrl: osUrl,
     background: {
-      gradientStops: ['#2563EB', '#0EA5E9'],
+      gradientStops: ["#2563EB", "#0EA5E9"],
       circles: UNIFIED_CIRCLE_CONFIG,
     },
   };
 }
-
diff --git a/frontend/src/core/components/onboarding/slides/DesktopInstallTitle.tsx b/frontend/src/core/components/onboarding/slides/DesktopInstallTitle.tsx
index ac42b518b3..7362774017 100644
--- a/frontend/src/core/components/onboarding/slides/DesktopInstallTitle.tsx
+++ b/frontend/src/core/components/onboarding/slides/DesktopInstallTitle.tsx
@@ -1,7 +1,7 @@
-import React from 'react';
-import { useTranslation } from 'react-i18next';
-import { Menu, ActionIcon } from '@mantine/core';
-import ExpandMoreIcon from '@mui/icons-material/ExpandMore';
+import React from "react";
+import { useTranslation } from "react-i18next";
+import { Menu, ActionIcon } from "@mantine/core";
+import ExpandMoreIcon from "@mui/icons-material/ExpandMore";
 
 export interface OSOption {
   label: string;
@@ -16,11 +16,11 @@ interface DesktopInstallTitleProps {
   onDownloadUrlChange?: (url: string) => void;
 }
 
-export const DesktopInstallTitle: React.FC<DesktopInstallTitleProps> = ({ 
-  osLabel, 
-  osUrl, 
-  osOptions, 
-  onDownloadUrlChange 
+export const DesktopInstallTitle: React.FC<DesktopInstallTitleProps> = ({
+  osLabel,
+  osUrl,
+  osOptions,
+  onDownloadUrlChange,
 }) => {
   const { t } = useTranslation();
   const [selectedOsUrl, setSelectedOsUrl] = React.useState<string>(osUrl);
@@ -29,37 +29,51 @@ export const DesktopInstallTitle: React.FC<DesktopInstallTitleProps> = ({
     setSelectedOsUrl(osUrl);
   }, [osUrl]);
 
-  const handleOsSelect = React.useCallback((option: OSOption) => {
-    setSelectedOsUrl(option.url);
-    onDownloadUrlChange?.(option.url);
-  }, [onDownloadUrlChange]);
+  const handleOsSelect = React.useCallback(
+    (option: OSOption) => {
+      setSelectedOsUrl(option.url);
+      onDownloadUrlChange?.(option.url);
+    },
+    [onDownloadUrlChange],
+  );
 
-  const currentOsOption = osOptions.find(opt => opt.url === selectedOsUrl) || 
+  const currentOsOption =
+    osOptions.find((opt) => opt.url === selectedOsUrl) ||
     (osOptions.length > 0 ? osOptions[0] : { label: osLabel, url: osUrl });
-  
+
   const displayLabel = currentOsOption.label || osLabel;
-  const title = displayLabel 
-    ? t('onboarding.desktopInstall.titleWithOs', 'Download for {{osLabel}}', { osLabel: displayLabel })
-    : t('onboarding.desktopInstall.title', 'Download');
+  const title = displayLabel
+    ? t("onboarding.desktopInstall.titleWithOs", "Download for {{osLabel}}", {
+        osLabel: displayLabel,
+      })
+    : t("onboarding.desktopInstall.title", "Download");
 
   // If only one option or no options, don't show dropdown
   if (osOptions.length <= 1) {
-    return <div style={{ textAlign: 'center', width: '100%' }}>{title}</div>;
+    return <div style={{ textAlign: "center", width: "100%" }}>{title}</div>;
   }
 
   return (
-    <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'center', gap: '0.5rem', width: '100%' }}>
-      <span style={{ whiteSpace: 'nowrap' }}>{title}</span>
+    <div
+      style={{
+        display: "flex",
+        alignItems: "center",
+        justifyContent: "center",
+        gap: "0.5rem",
+        width: "100%",
+      }}
+    >
+      <span style={{ whiteSpace: "nowrap" }}>{title}</span>
       <Menu position="bottom" offset={5} zIndex={10000}>
         <Menu.Target>
           <ActionIcon
             variant="transparent"
             size="sm"
-            style={{ 
-              background: 'transparent',
-              border: 'none',
-              color: 'inherit',
-              padding: 0
+            style={{
+              background: "transparent",
+              border: "none",
+              color: "inherit",
+              padding: 0,
             }}
           >
             <ExpandMoreIcon fontSize="small" />
@@ -74,11 +88,11 @@ export const DesktopInstallTitle: React.FC<DesktopInstallTitleProps> = ({
                 onClick={() => handleOsSelect(option)}
                 style={{
                   backgroundColor: isSelected
-                    ? 'light-dark(var(--mantine-color-blue-1), var(--mantine-color-blue-8))'
-                    : 'transparent',
+                    ? "light-dark(var(--mantine-color-blue-1), var(--mantine-color-blue-8))"
+                    : "transparent",
                   color: isSelected
-                    ? 'light-dark(var(--mantine-color-blue-9), var(--mantine-color-white))'
-                    : 'inherit',
+                    ? "light-dark(var(--mantine-color-blue-9), var(--mantine-color-white))"
+                    : "inherit",
                 }}
               >
                 {option.label}
@@ -90,4 +104,3 @@ export const DesktopInstallTitle: React.FC<DesktopInstallTitleProps> = ({
     </div>
   );
 };
-
diff --git a/frontend/src/core/components/onboarding/slides/FirstLoginSlide.tsx b/frontend/src/core/components/onboarding/slides/FirstLoginSlide.tsx
index 46ec6a0c89..4898c5a825 100644
--- a/frontend/src/core/components/onboarding/slides/FirstLoginSlide.tsx
+++ b/frontend/src/core/components/onboarding/slides/FirstLoginSlide.tsx
@@ -1,12 +1,12 @@
-import React, { useState } from 'react';
-import { Stack, PasswordInput, Button, Alert, Text } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { SlideConfig } from '@app/types/types';
-import LocalIcon from '@app/components/shared/LocalIcon';
-import { UNIFIED_CIRCLE_CONFIG } from '@app/components/onboarding/slides/unifiedBackgroundConfig';
-import { accountService } from '@app/services/accountService';
-import { alert as showToast } from '@app/components/toast';
-import styles from '@app/components/onboarding/InitialOnboardingModal/InitialOnboardingModal.module.css';
+import React, { useState } from "react";
+import { Stack, PasswordInput, Button, Alert, Text } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import { SlideConfig } from "@app/types/types";
+import LocalIcon from "@app/components/shared/LocalIcon";
+import { UNIFIED_CIRCLE_CONFIG } from "@app/components/onboarding/slides/unifiedBackgroundConfig";
+import { accountService } from "@app/services/accountService";
+import { alert as showToast } from "@app/components/toast";
+import styles from "@app/components/onboarding/InitialOnboardingModal/InitialOnboardingModal.module.css";
 
 interface FirstLoginSlideProps {
   username: string;
@@ -14,66 +14,98 @@ interface FirstLoginSlideProps {
   usingDefaultCredentials?: boolean;
 }
 
-const DEFAULT_PASSWORD = 'stirling';
+const DEFAULT_PASSWORD = "stirling";
 
-function FirstLoginForm({ username, onPasswordChanged, usingDefaultCredentials = false }: FirstLoginSlideProps) {
+function FirstLoginForm({
+  username,
+  onPasswordChanged,
+  usingDefaultCredentials = false,
+}: FirstLoginSlideProps) {
   const { t } = useTranslation();
   // If using default credentials, pre-fill with "stirling" - user won't see this field
-  const [currentPassword, setCurrentPassword] = useState(usingDefaultCredentials ? DEFAULT_PASSWORD : '');
-  const [newPassword, setNewPassword] = useState('');
-  const [confirmPassword, setConfirmPassword] = useState('');
+  const [currentPassword, setCurrentPassword] = useState(
+    usingDefaultCredentials ? DEFAULT_PASSWORD : "",
+  );
+  const [newPassword, setNewPassword] = useState("");
+  const [confirmPassword, setConfirmPassword] = useState("");
   const [loading, setLoading] = useState(false);
-  const [error, setError] = useState('');
+  const [error, setError] = useState("");
 
   const handleSubmit = async () => {
     // Validation
-    if ((!usingDefaultCredentials && !currentPassword) || !newPassword || !confirmPassword) {
-      setError(t('firstLogin.allFieldsRequired', 'All fields are required'));
+    if (
+      (!usingDefaultCredentials && !currentPassword) ||
+      !newPassword ||
+      !confirmPassword
+    ) {
+      setError(t("firstLogin.allFieldsRequired", "All fields are required"));
       return;
     }
 
     if (newPassword !== confirmPassword) {
-      setError(t('firstLogin.passwordsDoNotMatch', 'New passwords do not match'));
+      setError(
+        t("firstLogin.passwordsDoNotMatch", "New passwords do not match"),
+      );
       return;
     }
 
     if (newPassword.length < 8) {
-      setError(t('firstLogin.passwordTooShort', 'Password must be at least 8 characters'));
+      setError(
+        t(
+          "firstLogin.passwordTooShort",
+          "Password must be at least 8 characters",
+        ),
+      );
       return;
     }
 
     if (newPassword === currentPassword) {
-      setError(t('firstLogin.passwordMustBeDifferent', 'New password must be different from current password'));
+      setError(
+        t(
+          "firstLogin.passwordMustBeDifferent",
+          "New password must be different from current password",
+        ),
+      );
       return;
     }
 
     try {
       setLoading(true);
-      setError('');
+      setError("");
 
-      await accountService.changePasswordOnLogin(currentPassword, newPassword, confirmPassword);
+      await accountService.changePasswordOnLogin(
+        currentPassword,
+        newPassword,
+        confirmPassword,
+      );
 
       showToast({
-        alertType: 'success',
-        title: t('firstLogin.passwordChangedSuccess', 'Password changed successfully! Please log in again.')
+        alertType: "success",
+        title: t(
+          "firstLogin.passwordChangedSuccess",
+          "Password changed successfully! Please log in again.",
+        ),
       });
 
       // Clear form
-      setCurrentPassword('');
-      setNewPassword('');
-      setConfirmPassword('');
+      setCurrentPassword("");
+      setNewPassword("");
+      setConfirmPassword("");
 
       // Wait a moment for the user to see the success message
       setTimeout(() => {
         onPasswordChanged();
       }, 1500);
     } catch (err) {
-      console.error('Failed to change password:', err);
+      console.error("Failed to change password:", err);
       // Extract error message from axios response if available
       const axiosError = err as { response?: { data?: { message?: string } } };
       setError(
         axiosError.response?.data?.message ||
-        t('firstLogin.passwordChangeFailed', 'Failed to change password. Please check your current password.')
+          t(
+            "firstLogin.passwordChangeFailed",
+            "Failed to change password. Please check your current password.",
+          ),
       );
     } finally {
       setLoading(false);
@@ -85,22 +117,30 @@ function FirstLoginForm({ username, onPasswordChanged, usingDefaultCredentials =
       <div className={styles.securityCard}>
         <Stack gap="md">
           <div className={styles.securityAlertRow}>
-            <LocalIcon icon="info-rounded" width={20} height={20} style={{ color: '#3B82F6', flexShrink: 0 }} />
+            <LocalIcon
+              icon="info-rounded"
+              width={20}
+              height={20}
+              style={{ color: "#3B82F6", flexShrink: 0 }}
+            />
             <span>
               {t(
-                'firstLogin.welcomeMessage',
-                'For security reasons, you must change your password on your first login.'
+                "firstLogin.welcomeMessage",
+                "For security reasons, you must change your password on your first login.",
               )}
             </span>
           </div>
 
           <Text size="sm" fw={500}>
-            {t('firstLogin.loggedInAs', 'Logged in as')}: <strong>{username}</strong>
+            {t("firstLogin.loggedInAs", "Logged in as")}:{" "}
+            <strong>{username}</strong>
           </Text>
 
           {error && (
             <Alert
-              icon={<LocalIcon icon="error-rounded" width="1rem" height="1rem" />}
+              icon={
+                <LocalIcon icon="error-rounded" width="1rem" height="1rem" />
+              }
               color="red"
               variant="light"
             >
@@ -111,8 +151,11 @@ function FirstLoginForm({ username, onPasswordChanged, usingDefaultCredentials =
           {/* Only show current password field if not using default credentials */}
           {!usingDefaultCredentials && (
             <PasswordInput
-              label={t('firstLogin.currentPassword', 'Current Password')}
-              placeholder={t('firstLogin.enterCurrentPassword', 'Enter your current password')}
+              label={t("firstLogin.currentPassword", "Current Password")}
+              placeholder={t(
+                "firstLogin.enterCurrentPassword",
+                "Enter your current password",
+              )}
               value={currentPassword}
               onChange={(e) => setCurrentPassword(e.currentTarget.value)}
               required
@@ -123,8 +166,11 @@ function FirstLoginForm({ username, onPasswordChanged, usingDefaultCredentials =
           )}
 
           <PasswordInput
-            label={t('firstLogin.newPassword', 'New Password')}
-            placeholder={t('firstLogin.enterNewPassword', 'Enter new password (min 8 characters)')}
+            label={t("firstLogin.newPassword", "New Password")}
+            placeholder={t(
+              "firstLogin.enterNewPassword",
+              "Enter new password (min 8 characters)",
+            )}
             value={newPassword}
             onChange={(e) => setNewPassword(e.currentTarget.value)}
             minLength={8}
@@ -135,8 +181,11 @@ function FirstLoginForm({ username, onPasswordChanged, usingDefaultCredentials =
           />
 
           <PasswordInput
-            label={t('firstLogin.confirmPassword', 'Confirm New Password')}
-            placeholder={t('firstLogin.reEnterNewPassword', 'Re-enter new password')}
+            label={t("firstLogin.confirmPassword", "Confirm New Password")}
+            placeholder={t(
+              "firstLogin.reEnterNewPassword",
+              "Re-enter new password",
+            )}
             value={confirmPassword}
             onChange={(e) => setConfirmPassword(e.currentTarget.value)}
             required
@@ -150,11 +199,16 @@ function FirstLoginForm({ username, onPasswordChanged, usingDefaultCredentials =
             fullWidth
             onClick={handleSubmit}
             loading={loading}
-            disabled={!newPassword || !confirmPassword || newPassword.length < 8 || confirmPassword.length < 8}
+            disabled={
+              !newPassword ||
+              !confirmPassword ||
+              newPassword.length < 8 ||
+              confirmPassword.length < 8
+            }
             size="md"
             mt="xs"
           >
-            {t('firstLogin.changePassword', 'Change Password')}
+            {t("firstLogin.changePassword", "Change Password")}
           </Button>
         </Stack>
       </div>
@@ -168,8 +222,8 @@ export default function FirstLoginSlide({
   usingDefaultCredentials = false,
 }: FirstLoginSlideProps): SlideConfig {
   return {
-    key: 'first-login',
-    title: 'Set Your Password',
+    key: "first-login",
+    title: "Set Your Password",
     body: (
       <FirstLoginForm
         username={username}
@@ -178,9 +232,8 @@ export default function FirstLoginSlide({
       />
     ),
     background: {
-      gradientStops: ['#059669', '#0891B2'], // Green to teal - security/trust colors
+      gradientStops: ["#059669", "#0891B2"], // Green to teal - security/trust colors
       circles: UNIFIED_CIRCLE_CONFIG,
     },
   };
 }
-
diff --git a/frontend/src/core/components/onboarding/slides/MFASetupSlide.tsx b/frontend/src/core/components/onboarding/slides/MFASetupSlide.tsx
index d8def0528a..94bba3010d 100644
--- a/frontend/src/core/components/onboarding/slides/MFASetupSlide.tsx
+++ b/frontend/src/core/components/onboarding/slides/MFASetupSlide.tsx
@@ -1,10 +1,25 @@
-import { useCallback, useEffect, useRef, useState, type FormEvent } from "react";
-import { Alert, Box, Button, Group, Loader, Stack, Text, TextInput } from "@mantine/core";
+import {
+  useCallback,
+  useEffect,
+  useRef,
+  useState,
+  type FormEvent,
+} from "react";
+import {
+  Alert,
+  Box,
+  Button,
+  Group,
+  Loader,
+  Stack,
+  Text,
+  TextInput,
+} from "@mantine/core";
 import { QRCodeSVG } from "qrcode.react";
 import { SlideConfig } from "@app/types/types";
 import { UNIFIED_CIRCLE_CONFIG } from "@app/components/onboarding/slides/unifiedBackgroundConfig";
 import { accountService } from "@app/services/accountService";
-import { useAccountLogout } from '@app/extensions/accountLogout';
+import { useAccountLogout } from "@app/extensions/accountLogout";
 import { useAuth } from "@app/auth/UseSession";
 import LocalIcon from "@app/components/shared/LocalIcon";
 import { BASE_PATH } from "@app/constants/app";
@@ -16,7 +31,9 @@ interface MFASetupSlideProps {
 }
 
 function MFASetupContent({ onMfaSetupComplete }: MFASetupSlideProps) {
-  const [mfaSetupData, setMfaSetupData] = useState<MfaSetupResponse | null>(null);
+  const [mfaSetupData, setMfaSetupData] = useState<MfaSetupResponse | null>(
+    null,
+  );
   const [mfaSetupCode, setMfaSetupCode] = useState("");
   const [mfaError, setMfaError] = useState("");
   const [mfaLoading, setMfaLoading] = useState(false);
@@ -27,7 +44,10 @@ function MFASetupContent({ onMfaSetupComplete }: MFASetupSlideProps) {
   const accountLogout = useAccountLogout();
   const qrLogoSrc = `${BASE_PATH}/modern-logo/StirlingPDFLogoNoTextDark.svg`;
 
-  const normalizeMfaCode = useCallback((value: string) => value.replace(/\D/g, "").slice(0, 6), []);
+  const normalizeMfaCode = useCallback(
+    (value: string) => value.replace(/\D/g, "").slice(0, 6),
+    [],
+  );
 
   const fetchMfaSetup = useCallback(async () => {
     try {
@@ -38,7 +58,10 @@ function MFASetupContent({ onMfaSetupComplete }: MFASetupSlideProps) {
       setMfaSetupData(data);
     } catch (err) {
       const axiosError = err as { response?: { data?: { error?: string } } };
-      setMfaError(axiosError.response?.data?.error || "Unable to start two-factor setup. Please try again.");
+      setMfaError(
+        axiosError.response?.data?.error ||
+          "Unable to start two-factor setup. Please try again.",
+      );
     } finally {
       setMfaLoading(false);
     }
@@ -59,10 +82,10 @@ function MFASetupContent({ onMfaSetupComplete }: MFASetupSlideProps) {
   }, [fetchMfaSetup]);
 
   const redirectToLogin = useCallback(() => {
-    window.location.assign('/login');
+    window.location.assign("/login");
   }, []);
 
-  const onLogout = useCallback(async() => {
+  const onLogout = useCallback(async () => {
     await accountLogout({ signOut, redirectToLogin });
   }, [accountLogout, redirectToLogin, signOut]);
 
@@ -84,13 +107,14 @@ function MFASetupContent({ onMfaSetupComplete }: MFASetupSlideProps) {
       } catch (err) {
         const axiosError = err as { response?: { data?: { error?: string } } };
         setMfaError(
-          axiosError.response?.data?.error || "Unable to enable two-factor authentication. Check the code and try again."
+          axiosError.response?.data?.error ||
+            "Unable to enable two-factor authentication. Check the code and try again.",
         );
       } finally {
         setSubmitting(false);
       }
     },
-    [mfaSetupCode, onMfaSetupComplete]
+    [mfaSetupCode, onMfaSetupComplete],
   );
 
   const isReady = Boolean(mfaSetupData);
@@ -137,12 +161,17 @@ function MFASetupContent({ onMfaSetupComplete }: MFASetupSlideProps) {
       <div className={styles.mfaCard}>
         <Stack gap="md">
           <Text size="sm" c="dimmed">
-            Secure your account by linking an authenticator app. Scan the QR code or enter the setup key, then confirm the
-            6-digit code to finish.
+            Secure your account by linking an authenticator app. Scan the QR
+            code or enter the setup key, then confirm the 6-digit code to
+            finish.
           </Text>
 
           {mfaError && (
-            <Alert icon={<LocalIcon icon="error" width={16} height={16} />} color="red" variant="light">
+            <Alert
+              icon={<LocalIcon icon="error" width={16} height={16} />}
+              color="red"
+              variant="light"
+            >
               {mfaError}
             </Alert>
           )}
@@ -163,7 +192,9 @@ function MFASetupContent({ onMfaSetupComplete }: MFASetupSlideProps) {
                 label="Authentication code"
                 placeholder="123456"
                 value={mfaSetupCode}
-                onChange={(event) => setMfaSetupCode(normalizeMfaCode(event.currentTarget.value))}
+                onChange={(event) =>
+                  setMfaSetupCode(normalizeMfaCode(event.currentTarget.value))
+                }
                 inputMode="numeric"
                 maxLength={6}
                 minLength={6}
@@ -182,15 +213,13 @@ function MFASetupContent({ onMfaSetupComplete }: MFASetupSlideProps) {
                 <Button
                   type="submit"
                   loading={submitting}
-                  disabled={!isReady || setupComplete || mfaSetupCode.length < 6}
+                  disabled={
+                    !isReady || setupComplete || mfaSetupCode.length < 6
+                  }
                 >
                   Enable MFA
                 </Button>
-                <Button
-                  type="button"
-                  variant="light"
-                  onClick={onLogout}
-                >
+                <Button type="button" variant="light" onClick={onLogout}>
                   Logout
                 </Button>
               </Group>
@@ -208,7 +237,9 @@ function MFASetupContent({ onMfaSetupComplete }: MFASetupSlideProps) {
   );
 }
 
-export default function MFASetupSlide({ onMfaSetupComplete }: MFASetupSlideProps = {}): SlideConfig {
+export default function MFASetupSlide({
+  onMfaSetupComplete,
+}: MFASetupSlideProps = {}): SlideConfig {
   return {
     key: "mfa-setup-slide",
     title: "Multi-Factor Authentication Setup",
diff --git a/frontend/src/core/components/onboarding/slides/PlanOverviewSlide.tsx b/frontend/src/core/components/onboarding/slides/PlanOverviewSlide.tsx
index 3b8d4bfb0c..81f7911e7d 100644
--- a/frontend/src/core/components/onboarding/slides/PlanOverviewSlide.tsx
+++ b/frontend/src/core/components/onboarding/slides/PlanOverviewSlide.tsx
@@ -1,7 +1,7 @@
-import React from 'react';
-import { Trans, useTranslation } from 'react-i18next';
-import { SlideConfig, LicenseNotice } from '@app/types/types';
-import { UNIFIED_CIRCLE_CONFIG } from '@app/components/onboarding/slides/unifiedBackgroundConfig';
+import React from "react";
+import { Trans, useTranslation } from "react-i18next";
+import { SlideConfig, LicenseNotice } from "@app/types/types";
+import { UNIFIED_CIRCLE_CONFIG } from "@app/components/onboarding/slides/unifiedBackgroundConfig";
 
 interface PlanOverviewSlideProps {
   isAdmin: boolean;
@@ -16,23 +16,23 @@ const PlanOverviewTitle: React.FC<{ isAdmin: boolean }> = ({ isAdmin }) => {
   return (
     <>
       {isAdmin
-        ? t('onboarding.planOverview.adminTitle', 'Admin Overview')
-        : t('onboarding.planOverview.userTitle', 'Plan Overview')}
+        ? t("onboarding.planOverview.adminTitle", "Admin Overview")
+        : t("onboarding.planOverview.userTitle", "Plan Overview")}
     </>
   );
 };
 
-const AdminOverviewBody: React.FC<{ freeTierLimit: number; loginEnabled: boolean }> = ({
-  freeTierLimit,
-  loginEnabled,
-}) => {
+const AdminOverviewBody: React.FC<{
+  freeTierLimit: number;
+  loginEnabled: boolean;
+}> = ({ freeTierLimit, loginEnabled }) => {
   const adminBodyKey = loginEnabled
-    ? 'onboarding.planOverview.adminBodyLoginEnabled'
-    : 'onboarding.planOverview.adminBodyLoginDisabled';
+    ? "onboarding.planOverview.adminBodyLoginEnabled"
+    : "onboarding.planOverview.adminBodyLoginDisabled";
 
   const defaultValue = loginEnabled
-    ? 'As an admin, you can manage users, configure settings, and monitor server health. The first <strong>{{freeTierLimit}}</strong> people on your server get to use Stirling free of charge.'
-    : 'Once you enable login mode, you can manage users, configure settings, and monitor server health. The first <strong>{{freeTierLimit}}</strong> people on your server get to use Stirling free of charge.';
+    ? "As an admin, you can manage users, configure settings, and monitor server health. The first <strong>{{freeTierLimit}}</strong> people on your server get to use Stirling free of charge."
+    : "Once you enable login mode, you can manage users, configure settings, and monitor server health. The first <strong>{{freeTierLimit}}</strong> people on your server get to use Stirling free of charge.";
 
   return (
     <Trans
@@ -49,19 +49,26 @@ const UserOverviewBody: React.FC = () => {
   return (
     <span>
       {t(
-        'onboarding.planOverview.userBody',
+        "onboarding.planOverview.userBody",
         "Invite teammates, assign roles, and keep your documents organized in one secure workspace. Enable login mode whenever you're ready to grow beyond solo use.",
       )}
     </span>
   );
 };
 
-const PlanOverviewBody: React.FC<{ isAdmin: boolean; freeTierLimit: number; loginEnabled: boolean }> = ({
-  isAdmin,
-  freeTierLimit,
-  loginEnabled,
-}) =>
-  isAdmin ? <AdminOverviewBody freeTierLimit={freeTierLimit} loginEnabled={loginEnabled} /> : <UserOverviewBody />;
+const PlanOverviewBody: React.FC<{
+  isAdmin: boolean;
+  freeTierLimit: number;
+  loginEnabled: boolean;
+}> = ({ isAdmin, freeTierLimit, loginEnabled }) =>
+  isAdmin ? (
+    <AdminOverviewBody
+      freeTierLimit={freeTierLimit}
+      loginEnabled={loginEnabled}
+    />
+  ) : (
+    <UserOverviewBody />
+  );
 
 export default function PlanOverviewSlide({
   isAdmin,
@@ -71,13 +78,18 @@ export default function PlanOverviewSlide({
   const freeTierLimit = licenseNotice?.freeTierLimit ?? DEFAULT_FREE_TIER_LIMIT;
 
   return {
-    key: isAdmin ? 'admin-overview' : 'plan-overview',
+    key: isAdmin ? "admin-overview" : "plan-overview",
     title: <PlanOverviewTitle isAdmin={isAdmin} />,
-    body: <PlanOverviewBody isAdmin={isAdmin} freeTierLimit={freeTierLimit} loginEnabled={loginEnabled} />,
+    body: (
+      <PlanOverviewBody
+        isAdmin={isAdmin}
+        freeTierLimit={freeTierLimit}
+        loginEnabled={loginEnabled}
+      />
+    ),
     background: {
-      gradientStops: isAdmin ? ['#4F46E5', '#0EA5E9'] : ['#F97316', '#EF4444'],
+      gradientStops: isAdmin ? ["#4F46E5", "#0EA5E9"] : ["#F97316", "#EF4444"],
       circles: UNIFIED_CIRCLE_CONFIG,
     },
   };
 }
-
diff --git a/frontend/src/core/components/onboarding/slides/SecurityCheckSlide.tsx b/frontend/src/core/components/onboarding/slides/SecurityCheckSlide.tsx
index 0efb2f591d..78ed4d6db4 100644
--- a/frontend/src/core/components/onboarding/slides/SecurityCheckSlide.tsx
+++ b/frontend/src/core/components/onboarding/slides/SecurityCheckSlide.tsx
@@ -1,14 +1,14 @@
-import React from 'react';
-import { Select } from '@mantine/core';
-import { SlideConfig } from '@app/types/types';
-import LocalIcon from '@app/components/shared/LocalIcon';
-import { UNIFIED_CIRCLE_CONFIG } from '@app/components/onboarding/slides/unifiedBackgroundConfig';
-import i18n from '@app/i18n';
-import styles from '@app/components/onboarding/InitialOnboardingModal/InitialOnboardingModal.module.css';
+import React from "react";
+import { Select } from "@mantine/core";
+import { SlideConfig } from "@app/types/types";
+import LocalIcon from "@app/components/shared/LocalIcon";
+import { UNIFIED_CIRCLE_CONFIG } from "@app/components/onboarding/slides/unifiedBackgroundConfig";
+import i18n from "@app/i18n";
+import styles from "@app/components/onboarding/InitialOnboardingModal/InitialOnboardingModal.module.css";
 
 interface SecurityCheckSlideProps {
-  selectedRole: 'admin' | 'user' | null;
-  onRoleSelect: (role: 'admin' | 'user' | null) => void;
+  selectedRole: "admin" | "user" | null;
+  onRoleSelect: (role: "admin" | "user" | null) => void;
 }
 
 export default function SecurityCheckSlide({
@@ -16,24 +16,36 @@ export default function SecurityCheckSlide({
   onRoleSelect,
 }: SecurityCheckSlideProps): SlideConfig {
   return {
-    key: 'security-check',
-    title: 'Security Check',
+    key: "security-check",
+    title: "Security Check",
     body: (
       <div className={styles.securitySlideContent}>
         <div className={styles.securityCard}>
           <div className={styles.securityAlertRow}>
-            <LocalIcon icon="error" width={20} height={20} style={{ color: '#F04438', flexShrink: 0 }} />
-            <span>{i18n.t('onboarding.securityCheck.message', 'The application has undergone significant changes recently. Your server admin\'s attention may be required. Please confirm your role to continue.')}</span>
+            <LocalIcon
+              icon="error"
+              width={20}
+              height={20}
+              style={{ color: "#F04438", flexShrink: 0 }}
+            />
+            <span>
+              {i18n.t(
+                "onboarding.securityCheck.message",
+                "The application has undergone significant changes recently. Your server admin's attention may be required. Please confirm your role to continue.",
+              )}
+            </span>
           </div>
 
           <Select
             placeholder="Confirm your role"
             value={selectedRole}
             data={[
-              { value: 'admin', label: 'Admin' },
-              { value: 'user', label: 'User' },
+              { value: "admin", label: "Admin" },
+              { value: "user", label: "User" },
             ]}
-            onChange={(value) => onRoleSelect((value as 'admin' | 'user') ?? null)}
+            onChange={(value) =>
+              onRoleSelect((value as "admin" | "user") ?? null)
+            }
             comboboxProps={{ withinPortal: true, zIndex: 5000 }}
             styles={{
               input: {
@@ -46,10 +58,8 @@ export default function SecurityCheckSlide({
       </div>
     ),
     background: {
-      gradientStops: ['#5B21B6', '#2563EB'],
+      gradientStops: ["#5B21B6", "#2563EB"],
       circles: UNIFIED_CIRCLE_CONFIG,
     },
   };
 }
-
-
diff --git a/frontend/src/core/components/onboarding/slides/ServerLicenseSlide.tsx b/frontend/src/core/components/onboarding/slides/ServerLicenseSlide.tsx
index 3da69103b5..ac32244e85 100644
--- a/frontend/src/core/components/onboarding/slides/ServerLicenseSlide.tsx
+++ b/frontend/src/core/components/onboarding/slides/ServerLicenseSlide.tsx
@@ -1,8 +1,8 @@
-import React from 'react';
-import { Trans } from 'react-i18next';
-import { SlideConfig, LicenseNotice } from '@app/types/types';
-import { UNIFIED_CIRCLE_CONFIG } from '@app/components/onboarding/slides/unifiedBackgroundConfig';
-import i18n from '@app/i18n';
+import React from "react";
+import { Trans } from "react-i18next";
+import { SlideConfig, LicenseNotice } from "@app/types/types";
+import { UNIFIED_CIRCLE_CONFIG } from "@app/components/onboarding/slides/unifiedBackgroundConfig";
+import i18n from "@app/i18n";
 
 interface ServerLicenseSlideProps {
   licenseNotice?: LicenseNotice;
@@ -10,16 +10,19 @@ interface ServerLicenseSlideProps {
 
 const DEFAULT_FREE_TIER_LIMIT = 5;
 
-export default function ServerLicenseSlide({ licenseNotice }: ServerLicenseSlideProps = {}): SlideConfig {
+export default function ServerLicenseSlide({
+  licenseNotice,
+}: ServerLicenseSlideProps = {}): SlideConfig {
   const freeTierLimit = licenseNotice?.freeTierLimit ?? DEFAULT_FREE_TIER_LIMIT;
   const totalUsers = licenseNotice?.totalUsers ?? null;
   const isOverLimit = licenseNotice?.isOverLimit ?? false;
-  const formattedTotalUsers = totalUsers != null ? totalUsers.toLocaleString() : null;
+  const formattedTotalUsers =
+    totalUsers != null ? totalUsers.toLocaleString() : null;
   const overLimitUserCopy = formattedTotalUsers ?? `more than ${freeTierLimit}`;
   const title = isOverLimit
-    ? i18n.t('onboarding.serverLicense.overLimitTitle', 'Server License Needed')
-    : i18n.t('onboarding.serverLicense.freeTitle', 'Server License');
-  const key = isOverLimit ? 'server-license-over-limit' : 'server-license';
+    ? i18n.t("onboarding.serverLicense.overLimitTitle", "Server License Needed")
+    : i18n.t("onboarding.serverLicense.freeTitle", "Server License");
+  const key = isOverLimit ? "server-license-over-limit" : "server-license";
 
   const overLimitBody = (
     <Trans
@@ -50,10 +53,10 @@ export default function ServerLicenseSlide({ licenseNotice }: ServerLicenseSlide
     title,
     body,
     background: {
-      gradientStops: isOverLimit ? ['#F472B6', '#8B5CF6'] : ['#F97316', '#F59E0B'],
+      gradientStops: isOverLimit
+        ? ["#F472B6", "#8B5CF6"]
+        : ["#F97316", "#F59E0B"],
       circles: UNIFIED_CIRCLE_CONFIG,
     },
   };
 }
-
-
diff --git a/frontend/src/core/components/onboarding/slides/TourOverviewSlide.tsx b/frontend/src/core/components/onboarding/slides/TourOverviewSlide.tsx
index b76a10b7f5..3213122b40 100644
--- a/frontend/src/core/components/onboarding/slides/TourOverviewSlide.tsx
+++ b/frontend/src/core/components/onboarding/slides/TourOverviewSlide.tsx
@@ -1,14 +1,14 @@
-import React from 'react';
-import { Trans } from 'react-i18next';
-import i18n from '@app/i18n';
-import { SlideConfig } from '@app/types/types';
-import { UNIFIED_CIRCLE_CONFIG } from '@app/components/onboarding/slides/unifiedBackgroundConfig';
-import styles from '@app/components/onboarding/InitialOnboardingModal/InitialOnboardingModal.module.css';
+import React from "react";
+import { Trans } from "react-i18next";
+import i18n from "@app/i18n";
+import { SlideConfig } from "@app/types/types";
+import { UNIFIED_CIRCLE_CONFIG } from "@app/components/onboarding/slides/unifiedBackgroundConfig";
+import styles from "@app/components/onboarding/InitialOnboardingModal/InitialOnboardingModal.module.css";
 
 export default function TourOverviewSlide(): SlideConfig {
   return {
-    key: 'tour-overview',
-    title: i18n.t('onboarding.tourOverview.title', 'Tour Overview'),
+    key: "tour-overview",
+    title: i18n.t("onboarding.tourOverview.title", "Tour Overview"),
     body: (
       <span className={styles.bodyCopyInner}>
         <Trans
@@ -19,9 +19,8 @@ export default function TourOverviewSlide(): SlideConfig {
       </span>
     ),
     background: {
-      gradientStops: ['#2563EB', '#7C3AED'],
+      gradientStops: ["#2563EB", "#7C3AED"],
       circles: UNIFIED_CIRCLE_CONFIG,
     },
   };
 }
-
diff --git a/frontend/src/core/components/onboarding/slides/WelcomeSlide.tsx b/frontend/src/core/components/onboarding/slides/WelcomeSlide.tsx
index eb9160eba9..e0974262bc 100644
--- a/frontend/src/core/components/onboarding/slides/WelcomeSlide.tsx
+++ b/frontend/src/core/components/onboarding/slides/WelcomeSlide.tsx
@@ -1,15 +1,15 @@
-import React from 'react';
-import { useTranslation, Trans } from 'react-i18next';
-import { SlideConfig } from '@app/types/types';
-import styles from '@app/components/onboarding/InitialOnboardingModal/InitialOnboardingModal.module.css';
-import { UNIFIED_CIRCLE_CONFIG } from '@app/components/onboarding/slides/unifiedBackgroundConfig';
+import React from "react";
+import { useTranslation, Trans } from "react-i18next";
+import { SlideConfig } from "@app/types/types";
+import styles from "@app/components/onboarding/InitialOnboardingModal/InitialOnboardingModal.module.css";
+import { UNIFIED_CIRCLE_CONFIG } from "@app/components/onboarding/slides/unifiedBackgroundConfig";
 
 function WelcomeSlideTitle() {
   const { t } = useTranslation();
 
   return (
     <span className={styles.welcomeTitleContainer}>
-      {t('onboarding.welcomeSlide.title', 'Welcome to Stirling')}
+      {t("onboarding.welcomeSlide.title", "Welcome to Stirling")}
       <span className={styles.v2Badge}>V2</span>
     </span>
   );
@@ -27,13 +27,12 @@ const WelcomeSlideBody = () => (
 
 export default function WelcomeSlide(): SlideConfig {
   return {
-    key: 'welcome',
+    key: "welcome",
     title: <WelcomeSlideTitle />,
     body: <WelcomeSlideBody />,
     background: {
-      gradientStops: ['#7C3AED', '#EC4899'],
+      gradientStops: ["#7C3AED", "#EC4899"],
       circles: UNIFIED_CIRCLE_CONFIG,
     },
   };
 }
-
diff --git a/frontend/src/core/components/onboarding/slides/unifiedBackgroundConfig.ts b/frontend/src/core/components/onboarding/slides/unifiedBackgroundConfig.ts
index 8ba3c0fbb6..33ac2d2915 100644
--- a/frontend/src/core/components/onboarding/slides/unifiedBackgroundConfig.ts
+++ b/frontend/src/core/components/onboarding/slides/unifiedBackgroundConfig.ts
@@ -1,4 +1,4 @@
-import { AnimatedCircleConfig } from '@app/types/types';
+import { AnimatedCircleConfig } from "@app/types/types";
 
 /**
  * Unified circle background configuration used across all onboarding slides.
@@ -6,9 +6,9 @@ import { AnimatedCircleConfig } from '@app/types/types';
  */
 export const UNIFIED_CIRCLE_CONFIG: AnimatedCircleConfig[] = [
   {
-    position: 'bottom-left',
+    position: "bottom-left",
     size: 270,
-    color: 'rgba(255, 255, 255, 0.25)',
+    color: "rgba(255, 255, 255, 0.25)",
     opacity: 0.9,
     amplitude: 24,
     duration: 4.5,
@@ -16,9 +16,9 @@ export const UNIFIED_CIRCLE_CONFIG: AnimatedCircleConfig[] = [
     offsetY: 14,
   },
   {
-    position: 'top-right',
+    position: "top-right",
     size: 300,
-    color: 'rgba(255, 255, 255, 0.2)',
+    color: "rgba(255, 255, 255, 0.2)",
     opacity: 0.9,
     amplitude: 28,
     duration: 4.5,
@@ -27,4 +27,3 @@ export const UNIFIED_CIRCLE_CONFIG: AnimatedCircleConfig[] = [
     offsetY: 18,
   },
 ];
-
diff --git a/frontend/src/core/components/onboarding/tourGlow.ts b/frontend/src/core/components/onboarding/tourGlow.ts
index a043f7c011..e2383734db 100644
--- a/frontend/src/core/components/onboarding/tourGlow.ts
+++ b/frontend/src/core/components/onboarding/tourGlow.ts
@@ -3,16 +3,19 @@ export const addGlowToElements = (selectors: string[]) => {
     const element = document.querySelector(selector);
     if (element) {
       if (selector === '[data-tour="settings-content-area"]') {
-        element.classList.add('tour-content-glow');
+        element.classList.add("tour-content-glow");
       } else {
-        element.classList.add('tour-nav-glow');
+        element.classList.add("tour-nav-glow");
       }
     }
   });
 };
 
 export const removeAllGlows = () => {
-  document.querySelectorAll('.tour-content-glow').forEach((el) => el.classList.remove('tour-content-glow'));
-  document.querySelectorAll('.tour-nav-glow').forEach((el) => el.classList.remove('tour-nav-glow'));
+  document
+    .querySelectorAll(".tour-content-glow")
+    .forEach((el) => el.classList.remove("tour-content-glow"));
+  document
+    .querySelectorAll(".tour-nav-glow")
+    .forEach((el) => el.classList.remove("tour-nav-glow"));
 };
-
diff --git a/frontend/src/core/components/onboarding/useBypassOnboarding.ts b/frontend/src/core/components/onboarding/useBypassOnboarding.ts
index 166c893527..375cae9ca6 100644
--- a/frontend/src/core/components/onboarding/useBypassOnboarding.ts
+++ b/frontend/src/core/components/onboarding/useBypassOnboarding.ts
@@ -1,28 +1,28 @@
-import { useEffect, useMemo, useState } from 'react';
-import { useLocation } from 'react-router-dom';
-import { markOnboardingCompleted } from '@app/components/onboarding/orchestrator/onboardingStorage';
+import { useEffect, useMemo, useState } from "react";
+import { useLocation } from "react-router-dom";
+import { markOnboardingCompleted } from "@app/components/onboarding/orchestrator/onboardingStorage";
 
-const SESSION_KEY = 'onboarding::bypass-all';
-const PARAM_KEY = 'bypassOnboarding';
+const SESSION_KEY = "onboarding::bypass-all";
+const PARAM_KEY = "bypassOnboarding";
 
 function isTruthy(value: string | null): boolean {
-  return value?.toLowerCase() === 'true';
+  return value?.toLowerCase() === "true";
 }
 
 function readStoredBypass(): boolean {
-  if (typeof window === 'undefined') return false;
+  if (typeof window === "undefined") return false;
   try {
-    return sessionStorage.getItem(SESSION_KEY) === 'true';
+    return sessionStorage.getItem(SESSION_KEY) === "true";
   } catch {
     return false;
   }
 }
 
 function setStoredBypass(enabled: boolean): void {
-  if (typeof window === 'undefined') return;
+  if (typeof window === "undefined") return;
   try {
     if (enabled) {
-      sessionStorage.setItem(SESSION_KEY, 'true');
+      sessionStorage.setItem(SESSION_KEY, "true");
     } else {
       sessionStorage.removeItem(SESSION_KEY);
     }
@@ -38,7 +38,9 @@ function setStoredBypass(enabled: boolean): void {
  */
 export function useBypassOnboarding(): boolean {
   const location = useLocation();
-  const [bypassOnboarding, setBypassOnboarding] = useState<boolean>(() => readStoredBypass());
+  const [bypassOnboarding, setBypassOnboarding] = useState<boolean>(() =>
+    readStoredBypass(),
+  );
 
   const shouldBypassFromSearch = useMemo(() => {
     try {
diff --git a/frontend/src/core/components/onboarding/useOnboardingDownload.ts b/frontend/src/core/components/onboarding/useOnboardingDownload.ts
index 7601800312..82abc29b82 100644
--- a/frontend/src/core/components/onboarding/useOnboardingDownload.ts
+++ b/frontend/src/core/components/onboarding/useOnboardingDownload.ts
@@ -1,12 +1,12 @@
 /**
  * useOnboardingDownload Hook
- * 
+ *
  * Encapsulates OS detection and download URL logic for the desktop install slide.
  */
 
-import { useState, useEffect, useMemo, useCallback } from 'react';
-import { useOs } from '@app/hooks/useOs';
-import { DOWNLOAD_URLS } from '@app/constants/downloads';
+import { useState, useEffect, useMemo, useCallback } from "react";
+import { useOs } from "@app/hooks/useOs";
+import { DOWNLOAD_URLS } from "@app/constants/downloads";
 
 interface OsInfo {
   label: string;
@@ -29,30 +29,45 @@ interface UseOnboardingDownloadResult {
 
 export function useOnboardingDownload(): UseOnboardingDownloadResult {
   const osType = useOs();
-  const [selectedDownloadUrl, setSelectedDownloadUrl] = useState<string>('');
+  const [selectedDownloadUrl, setSelectedDownloadUrl] = useState<string>("");
 
   const osInfo = useMemo<OsInfo>(() => {
     switch (osType) {
-      case 'windows':
-        return { label: 'Windows', url: DOWNLOAD_URLS.WINDOWS };
-      case 'mac-apple':
-        return { label: 'Mac (Apple Silicon)', url: DOWNLOAD_URLS.MAC_APPLE_SILICON };
-      case 'mac-intel':
-        return { label: 'Mac (Intel)', url: DOWNLOAD_URLS.MAC_INTEL };
-      case 'linux-x64':
-      case 'linux-arm64':
-        return { label: 'Linux', url: DOWNLOAD_URLS.LINUX_DOCS };
+      case "windows":
+        return { label: "Windows", url: DOWNLOAD_URLS.WINDOWS };
+      case "mac-apple":
+        return {
+          label: "Mac (Apple Silicon)",
+          url: DOWNLOAD_URLS.MAC_APPLE_SILICON,
+        };
+      case "mac-intel":
+        return { label: "Mac (Intel)", url: DOWNLOAD_URLS.MAC_INTEL };
+      case "linux-x64":
+      case "linux-arm64":
+        return { label: "Linux", url: DOWNLOAD_URLS.LINUX_DOCS };
       default:
-        return { label: '', url: '' };
+        return { label: "", url: "" };
     }
   }, [osType]);
 
-  const osOptions = useMemo<OsOption[]>(() => [
-    { label: 'Windows', url: DOWNLOAD_URLS.WINDOWS, value: 'windows' },
-    { label: 'Mac (Apple Silicon)', url: DOWNLOAD_URLS.MAC_APPLE_SILICON, value: 'mac-apple' },
-    { label: 'Mac (Intel)', url: DOWNLOAD_URLS.MAC_INTEL, value: 'mac-intel' },
-    { label: 'Linux', url: DOWNLOAD_URLS.LINUX_DOCS, value: 'linux' },
-  ].filter((opt) => opt.url), []);
+  const osOptions = useMemo<OsOption[]>(
+    () =>
+      [
+        { label: "Windows", url: DOWNLOAD_URLS.WINDOWS, value: "windows" },
+        {
+          label: "Mac (Apple Silicon)",
+          url: DOWNLOAD_URLS.MAC_APPLE_SILICON,
+          value: "mac-apple",
+        },
+        {
+          label: "Mac (Intel)",
+          url: DOWNLOAD_URLS.MAC_INTEL,
+          value: "mac-intel",
+        },
+        { label: "Linux", url: DOWNLOAD_URLS.LINUX_DOCS, value: "linux" },
+      ].filter((opt) => opt.url),
+    [],
+  );
 
   // Initialize selected URL from detected OS
   useEffect(() => {
@@ -64,7 +79,7 @@ export function useOnboardingDownload(): UseOnboardingDownloadResult {
   const handleDownloadSelected = useCallback(() => {
     const downloadUrl = selectedDownloadUrl || osInfo.url;
     if (downloadUrl) {
-      window.open(downloadUrl, '_blank', 'noopener');
+      window.open(downloadUrl, "_blank", "noopener");
     }
   }, [selectedDownloadUrl, osInfo.url]);
 
@@ -76,4 +91,3 @@ export function useOnboardingDownload(): UseOnboardingDownloadResult {
     handleDownloadSelected,
   };
 }
-
diff --git a/frontend/src/core/components/onboarding/useOnboardingEffects.ts b/frontend/src/core/components/onboarding/useOnboardingEffects.ts
index f7eacb1f9c..0b1f22e6f0 100644
--- a/frontend/src/core/components/onboarding/useOnboardingEffects.ts
+++ b/frontend/src/core/components/onboarding/useOnboardingEffects.ts
@@ -1,27 +1,29 @@
-import { useEffect, useCallback, useState } from 'react';
+import { useEffect, useCallback, useState } from "react";
 import {
   SERVER_LICENSE_REQUEST_EVENT,
   START_TOUR_EVENT,
   type ServerLicenseRequestPayload,
   type TourType,
   type StartTourPayload,
-} from '@app/constants/events';
-import type { OnboardingRuntimeState } from '@app/components/onboarding/orchestrator/onboardingConfig';
+} from "@app/constants/events";
+import type { OnboardingRuntimeState } from "@app/components/onboarding/orchestrator/onboardingConfig";
 
 export function useServerLicenseRequest(): {
   showLicenseSlide: boolean;
-  licenseNotice: OnboardingRuntimeState['licenseNotice'] | null;
+  licenseNotice: OnboardingRuntimeState["licenseNotice"] | null;
   closeLicenseSlide: () => void;
 } {
   const [showLicenseSlide, setShowLicenseSlide] = useState(false);
-  const [licenseNotice, setLicenseNotice] = useState<OnboardingRuntimeState['licenseNotice'] | null>(null);
+  const [licenseNotice, setLicenseNotice] = useState<
+    OnboardingRuntimeState["licenseNotice"] | null
+  >(null);
 
   useEffect(() => {
-    if (typeof window === 'undefined') return;
+    if (typeof window === "undefined") return;
 
     const handleLicenseRequest = (event: Event) => {
       const { detail } = event as CustomEvent<ServerLicenseRequestPayload>;
-      
+
       if (detail?.licenseNotice) {
         setLicenseNotice({
           totalUsers: detail.licenseNotice.totalUsers ?? null,
@@ -30,12 +32,16 @@ export function useServerLicenseRequest(): {
           requiresLicense: true,
         });
       }
-      
+
       setShowLicenseSlide(true);
     };
 
     window.addEventListener(SERVER_LICENSE_REQUEST_EVENT, handleLicenseRequest);
-    return () => window.removeEventListener(SERVER_LICENSE_REQUEST_EVENT, handleLicenseRequest);
+    return () =>
+      window.removeEventListener(
+        SERVER_LICENSE_REQUEST_EVENT,
+        handleLicenseRequest,
+      );
   }, []);
 
   const closeLicenseSlide = useCallback(() => {
@@ -51,19 +57,21 @@ export function useTourRequest(): {
   clearTourRequest: () => void;
 } {
   const [tourRequested, setTourRequested] = useState(false);
-  const [requestedTourType, setRequestedTourType] = useState<TourType>('whatsnew');
+  const [requestedTourType, setRequestedTourType] =
+    useState<TourType>("whatsnew");
 
   useEffect(() => {
-    if (typeof window === 'undefined') return;
+    if (typeof window === "undefined") return;
 
     const handleTourRequest = (event: Event) => {
       const { detail } = event as CustomEvent<StartTourPayload>;
-      setRequestedTourType(detail?.tourType ?? 'whatsnew');
+      setRequestedTourType(detail?.tourType ?? "whatsnew");
       setTourRequested(true);
     };
 
     window.addEventListener(START_TOUR_EVENT, handleTourRequest);
-    return () => window.removeEventListener(START_TOUR_EVENT, handleTourRequest);
+    return () =>
+      window.removeEventListener(START_TOUR_EVENT, handleTourRequest);
   }, []);
 
   const clearTourRequest = useCallback(() => {
diff --git a/frontend/src/core/components/onboarding/userStepsConfig.ts b/frontend/src/core/components/onboarding/userStepsConfig.ts
index 5a936b3d65..f5805cbf68 100644
--- a/frontend/src/core/components/onboarding/userStepsConfig.ts
+++ b/frontend/src/core/components/onboarding/userStepsConfig.ts
@@ -1,5 +1,5 @@
-import type { StepType } from '@reactour/tour';
-import type { TFunction } from 'i18next';
+import type { StepType } from "@reactour/tour";
+import type { TFunction } from "i18next";
 
 export enum TourStep {
   ALL_TOOLS,
@@ -36,7 +36,10 @@ interface CreateUserStepsConfigArgs {
   actions: UserStepActions;
 }
 
-export function createUserStepsConfig({ t, actions }: CreateUserStepsConfigArgs): Record<TourStep, StepType> {
+export function createUserStepsConfig({
+  t,
+  actions,
+}: CreateUserStepsConfigArgs): Record<TourStep, StepType> {
   const {
     saveWorkbenchState,
     closeFilesModal,
@@ -53,8 +56,11 @@ export function createUserStepsConfig({ t, actions }: CreateUserStepsConfigArgs)
   return {
     [TourStep.ALL_TOOLS]: {
       selector: '[data-tour="tool-panel"]',
-      content: t('onboarding.allTools', 'This is the <strong>Tools</strong> panel, where you can browse and select from all available PDF tools.'),
-      position: 'center',
+      content: t(
+        "onboarding.allTools",
+        "This is the <strong>Tools</strong> panel, where you can browse and select from all available PDF tools.",
+      ),
+      position: "center",
       padding: 0,
       action: () => {
         saveWorkbenchState();
@@ -64,28 +70,40 @@ export function createUserStepsConfig({ t, actions }: CreateUserStepsConfigArgs)
     },
     [TourStep.SELECT_CROP_TOOL]: {
       selector: '[data-tour="tool-button-crop"]',
-      content: t('onboarding.selectCropTool', "Let's select the <strong>Crop</strong> tool to demonstrate how to use one of the tools."),
-      position: 'right',
+      content: t(
+        "onboarding.selectCropTool",
+        "Let's select the <strong>Crop</strong> tool to demonstrate how to use one of the tools.",
+      ),
+      position: "right",
       padding: 0,
       actionAfter: () => selectCropTool(),
     },
     [TourStep.TOOL_INTERFACE]: {
       selector: '[data-tour="tool-panel"]',
-      content: t('onboarding.toolInterface', "This is the <strong>Crop</strong> tool interface. As you can see, there's not much there because we haven't added any PDF files to work with yet."),
-      position: 'center',
+      content: t(
+        "onboarding.toolInterface",
+        "This is the <strong>Crop</strong> tool interface. As you can see, there's not much there because we haven't added any PDF files to work with yet.",
+      ),
+      position: "center",
       padding: 0,
     },
     [TourStep.FILES_BUTTON]: {
       selector: '[data-tour="files-button"]',
-      content: t('onboarding.filesButton', "The <strong>Files</strong> button on the Quick Access bar allows you to upload PDFs to use the tools on."),
-      position: 'right',
+      content: t(
+        "onboarding.filesButton",
+        "The <strong>Files</strong> button on the Quick Access bar allows you to upload PDFs to use the tools on.",
+      ),
+      position: "right",
       padding: 10,
       action: () => openFilesModal(),
     },
     [TourStep.FILE_SOURCES]: {
       selector: '[data-tour="file-sources"]',
-      content: t('onboarding.fileSources', "You can upload new files or access recent files from here. For the tour, we'll just use a sample file."),
-      position: 'right',
+      content: t(
+        "onboarding.fileSources",
+        "You can upload new files or access recent files from here. For the tour, we'll just use a sample file.",
+      ),
+      position: "right",
       padding: 0,
       actionAfter: () => {
         loadSampleFile();
@@ -94,62 +112,88 @@ export function createUserStepsConfig({ t, actions }: CreateUserStepsConfigArgs)
     },
     [TourStep.WORKBENCH]: {
       selector: '[data-tour="workbench"]',
-      content: t('onboarding.workbench', 'This is the <strong>Workbench</strong> - the main area where you view and edit your PDFs.'),
-      position: 'center',
+      content: t(
+        "onboarding.workbench",
+        "This is the <strong>Workbench</strong> - the main area where you view and edit your PDFs.",
+      ),
+      position: "center",
       padding: 0,
     },
     [TourStep.ACTIVE_FILES]: {
       selector: '[data-tour="workbench"]',
-      content: t('onboarding.activeFiles', "The <strong>Active Files</strong> view shows all of the PDFs you have loaded into the tool, and allows you to select which ones to process."),
-      position: 'center',
+      content: t(
+        "onboarding.activeFiles",
+        "The <strong>Active Files</strong> view shows all of the PDFs you have loaded into the tool, and allows you to select which ones to process.",
+      ),
+      position: "center",
       padding: 0,
       action: () => switchToActiveFiles(),
     },
     [TourStep.FILE_CHECKBOX]: {
       selector: '[data-tour="file-card-checkbox"]',
-      content: t('onboarding.fileCheckbox', "Clicking one of the files selects it for processing. You can select multiple files for batch operations."),
-      position: 'top',
+      content: t(
+        "onboarding.fileCheckbox",
+        "Clicking one of the files selects it for processing. You can select multiple files for batch operations.",
+      ),
+      position: "top",
       padding: 10,
     },
     [TourStep.CROP_SETTINGS]: {
       selector: '[data-tour="crop-settings"]',
-      content: t('onboarding.cropSettings', "Now that we've selected the file we want crop, we can configure the <strong>Crop</strong> tool to choose the area that we want to crop the PDF to."),
-      position: 'left',
+      content: t(
+        "onboarding.cropSettings",
+        "Now that we've selected the file we want crop, we can configure the <strong>Crop</strong> tool to choose the area that we want to crop the PDF to.",
+      ),
+      position: "left",
       padding: 10,
       action: () => modifyCropSettings(),
     },
     [TourStep.RUN_BUTTON]: {
       selector: '[data-tour="run-button"]',
-      content: t('onboarding.runButton', "Once the tool has been configured, this button allows you to run the tool on all the selected PDFs."),
-      position: 'top',
+      content: t(
+        "onboarding.runButton",
+        "Once the tool has been configured, this button allows you to run the tool on all the selected PDFs.",
+      ),
+      position: "top",
       padding: 10,
       actionAfter: () => executeTool(),
     },
     [TourStep.RESULTS]: {
       selector: '[data-tour="tool-panel"]',
-      content: t('onboarding.results', "After the tool has finished running, the <strong>Review</strong> step will show a preview of the results in this panel, and allow you to undo the operation or download the file. "),
-      position: 'center',
+      content: t(
+        "onboarding.results",
+        "After the tool has finished running, the <strong>Review</strong> step will show a preview of the results in this panel, and allow you to undo the operation or download the file. ",
+      ),
+      position: "center",
       padding: 0,
     },
     [TourStep.FILE_REPLACEMENT]: {
       selector: '[data-tour="file-card-checkbox"]',
-      content: t('onboarding.fileReplacement', "The modified file will replace the original file in the Workbench automatically, allowing you to easily run it through more tools."),
-      position: 'left',
+      content: t(
+        "onboarding.fileReplacement",
+        "The modified file will replace the original file in the Workbench automatically, allowing you to easily run it through more tools.",
+      ),
+      position: "left",
       padding: 10,
     },
     [TourStep.PIN_BUTTON]: {
       selector: '[data-tour="file-card-pin"]',
-      content: t('onboarding.pinButton', "You can use the <strong>Pin</strong> button if you'd rather your files stay active after running tools on them."),
-      position: 'left',
+      content: t(
+        "onboarding.pinButton",
+        "You can use the <strong>Pin</strong> button if you'd rather your files stay active after running tools on them.",
+      ),
+      position: "left",
       padding: 10,
       action: () => pinFile(),
     },
     [TourStep.WRAP_UP]: {
       selector: '[data-tour="help-button"]',
-      content: t('onboarding.wrapUp', "You're all set! You've learnt about the main areas of the app and how to use them. Click the <strong>Help</strong> button whenever you like to see this tour again."),
-      position: 'right',
+      content: t(
+        "onboarding.wrapUp",
+        "You're all set! You've learnt about the main areas of the app and how to use them. Click the <strong>Help</strong> button whenever you like to see this tour again.",
+      ),
+      position: "right",
       padding: 10,
     },
   };
 }
-
diff --git a/frontend/src/core/components/onboarding/whatsNewStepsConfig.ts b/frontend/src/core/components/onboarding/whatsNewStepsConfig.ts
index cb86644c4a..4501d89739 100644
--- a/frontend/src/core/components/onboarding/whatsNewStepsConfig.ts
+++ b/frontend/src/core/components/onboarding/whatsNewStepsConfig.ts
@@ -1,8 +1,12 @@
-import type { StepType } from '@reactour/tour';
-import type { TFunction } from 'i18next';
+import type { StepType } from "@reactour/tour";
+import type { TFunction } from "i18next";
 
-async function waitForElement(selector: string, timeoutMs = 7000, intervalMs = 100): Promise<void> {
-  if (typeof document === 'undefined') return;
+async function waitForElement(
+  selector: string,
+  timeoutMs = 7000,
+  intervalMs = 100,
+): Promise<void> {
+  if (typeof document === "undefined") return;
   const start = Date.now();
   // Immediate hit
   if (document.querySelector(selector)) return;
@@ -19,8 +23,12 @@ async function waitForElement(selector: string, timeoutMs = 7000, intervalMs = 1
   });
 }
 
-async function waitForHighlightable(selector: string, timeoutMs = 7000, intervalMs = 500): Promise<void> {
-  if (typeof document === 'undefined') return;
+async function waitForHighlightable(
+  selector: string,
+  timeoutMs = 7000,
+  intervalMs = 500,
+): Promise<void> {
+  if (typeof document === "undefined") return;
   const start = Date.now();
 
   return new Promise((resolve) => {
@@ -29,8 +37,8 @@ async function waitForHighlightable(selector: string, timeoutMs = 7000, interval
       const isVisible = !!el && el.getClientRects().length > 0;
       if (isVisible || Date.now() - start >= timeoutMs) {
         // Nudge Reactour to recalc positions in case layout shifted
-        window.dispatchEvent(new Event('resize'));
-        requestAnimationFrame(() => window.dispatchEvent(new Event('resize')));
+        window.dispatchEvent(new Event("resize"));
+        requestAnimationFrame(() => window.dispatchEvent(new Event("resize")));
         resolve();
         return;
       }
@@ -68,7 +76,10 @@ interface CreateWhatsNewStepsConfigArgs {
   actions: WhatsNewStepActions;
 }
 
-export function createWhatsNewStepsConfig({ t, actions }: CreateWhatsNewStepsConfigArgs): Record<WhatsNewTourStep, StepType> {
+export function createWhatsNewStepsConfig({
+  t,
+  actions,
+}: CreateWhatsNewStepsConfigArgs): Record<WhatsNewTourStep, StepType> {
   const {
     saveWorkbenchState,
     closeFilesModal,
@@ -85,10 +96,10 @@ export function createWhatsNewStepsConfig({ t, actions }: CreateWhatsNewStepsCon
     [WhatsNewTourStep.QUICK_ACCESS]: {
       selector: '[data-tour="quick-access-bar"]',
       content: t(
-        'onboarding.whatsNew.quickAccess',
-        'Start at the <strong>Quick Access</strong> rail to jump between Reader, Automate, your files, and all the tours.'
+        "onboarding.whatsNew.quickAccess",
+        "Start at the <strong>Quick Access</strong> rail to jump between Reader, Automate, your files, and all the tours.",
       ),
-      position: 'right',
+      position: "right",
       padding: 10,
       action: () => {
         saveWorkbenchState();
@@ -99,19 +110,19 @@ export function createWhatsNewStepsConfig({ t, actions }: CreateWhatsNewStepsCon
     [WhatsNewTourStep.LEFT_PANEL]: {
       selector: '[data-tour="tool-panel"]',
       content: t(
-        'onboarding.whatsNew.leftPanel',
-        'The left <strong>Tools</strong> panel lists everything you can do. Browse categories or search to find a tool quickly.'
+        "onboarding.whatsNew.leftPanel",
+        "The left <strong>Tools</strong> panel lists everything you can do. Browse categories or search to find a tool quickly.",
       ),
-      position: 'center',
+      position: "center",
       padding: 0,
     },
     [WhatsNewTourStep.FILE_UPLOAD]: {
       selector: '[data-tour="files-button"]',
       content: t(
-        'onboarding.whatsNew.fileUpload',
-        'Use the <strong>Files</strong> button to upload or pick a recent PDF. We will load a sample so you can see the workspace.'
+        "onboarding.whatsNew.fileUpload",
+        "Use the <strong>Files</strong> button to upload or pick a recent PDF. We will load a sample so you can see the workspace.",
       ),
-      position: 'right',
+      position: "right",
       padding: 10,
       action: async () => {
         openFilesModal();
@@ -128,12 +139,15 @@ export function createWhatsNewStepsConfig({ t, actions }: CreateWhatsNewStepsCon
     },
     [WhatsNewTourStep.RIGHT_RAIL]: {
       selector: '[data-tour="right-rail-controls"]',
-      highlightedSelectors: ['[data-tour="right-rail-controls"]', '[data-tour="right-rail-settings"]'],
+      highlightedSelectors: [
+        '[data-tour="right-rail-controls"]',
+        '[data-tour="right-rail-settings"]',
+      ],
       content: t(
-        'onboarding.whatsNew.rightRail',
-        'The <strong>Right Rail</strong> holds quick actions to select files, change theme or language, and download results.'
+        "onboarding.whatsNew.rightRail",
+        "The <strong>Right Rail</strong> holds quick actions to select files, change theme or language, and download results.",
       ),
-      position: 'left',
+      position: "left",
       padding: 10,
       action: async () => {
         await waitForElement('[data-tour="right-rail-controls"]', 7000, 100);
@@ -143,10 +157,10 @@ export function createWhatsNewStepsConfig({ t, actions }: CreateWhatsNewStepsCon
     [WhatsNewTourStep.TOP_BAR]: {
       selector: '[data-tour="view-switcher"]',
       content: t(
-        'onboarding.whatsNew.topBar',
-        'The top bar lets you swap between <strong>Viewer</strong>, <strong>Page Editor</strong>, and <strong>Active Files</strong>.'
+        "onboarding.whatsNew.topBar",
+        "The top bar lets you swap between <strong>Viewer</strong>, <strong>Page Editor</strong>, and <strong>Active Files</strong>.",
       ),
-      position: 'bottom',
+      position: "bottom",
       padding: 8,
       // Ensure the switcher has mounted before this step renders
       action: async () => {
@@ -158,10 +172,10 @@ export function createWhatsNewStepsConfig({ t, actions }: CreateWhatsNewStepsCon
     [WhatsNewTourStep.PAGE_EDITOR_VIEW]: {
       selector: '[data-tour="view-switcher"]',
       content: t(
-        'onboarding.whatsNew.pageEditorView',
-        'Switch to the Page Editor to reorder, rotate, or delete pages.'
+        "onboarding.whatsNew.pageEditorView",
+        "Switch to the Page Editor to reorder, rotate, or delete pages.",
       ),
-      position: 'bottom',
+      position: "bottom",
       padding: 8,
       action: async () => {
         switchToPageEditor();
@@ -172,10 +186,10 @@ export function createWhatsNewStepsConfig({ t, actions }: CreateWhatsNewStepsCon
     [WhatsNewTourStep.ACTIVE_FILES_VIEW]: {
       selector: '[data-tour="view-switcher"]',
       content: t(
-        'onboarding.whatsNew.activeFilesView',
-        'Use Active Files to see everything you have open and pick what to work on.'
+        "onboarding.whatsNew.activeFilesView",
+        "Use Active Files to see everything you have open and pick what to work on.",
       ),
-      position: 'bottom',
+      position: "bottom",
       padding: 8,
       action: async () => {
         switchToActiveFiles();
@@ -186,12 +200,11 @@ export function createWhatsNewStepsConfig({ t, actions }: CreateWhatsNewStepsCon
     [WhatsNewTourStep.WRAP_UP]: {
       selector: '[data-tour="help-button"]',
       content: t(
-        'onboarding.whatsNew.wrapUp',
-        'That is what is new in V2. Open the <strong>Tours</strong> menu anytime to replay this, the Tools tour, or the Admin tour.'
+        "onboarding.whatsNew.wrapUp",
+        "That is what is new in V2. Open the <strong>Tours</strong> menu anytime to replay this, the Tools tour, or the Admin tour.",
       ),
-      position: 'right',
+      position: "right",
       padding: 10,
     },
   };
 }
-
diff --git a/frontend/src/core/components/pageEditor/BulkSelectionPanel.tsx b/frontend/src/core/components/pageEditor/BulkSelectionPanel.tsx
index 81d4743331..e369c6b59f 100644
--- a/frontend/src/core/components/pageEditor/BulkSelectionPanel.tsx
+++ b/frontend/src/core/components/pageEditor/BulkSelectionPanel.tsx
@@ -1,9 +1,9 @@
-import { useState } from 'react';
-import classes from '@app/components/pageEditor/bulkSelectionPanel/BulkSelectionPanel.module.css';
-import PageSelectionInput from '@app/components/pageEditor/bulkSelectionPanel/PageSelectionInput';
-import SelectedPagesDisplay from '@app/components/pageEditor/bulkSelectionPanel/SelectedPagesDisplay';
-import PageSelectionSyntaxHint from '@app/components/shared/PageSelectionSyntaxHint';
-import AdvancedSelectionPanel from '@app/components/pageEditor/bulkSelectionPanel/AdvancedSelectionPanel';
+import { useState } from "react";
+import classes from "@app/components/pageEditor/bulkSelectionPanel/BulkSelectionPanel.module.css";
+import PageSelectionInput from "@app/components/pageEditor/bulkSelectionPanel/PageSelectionInput";
+import SelectedPagesDisplay from "@app/components/pageEditor/bulkSelectionPanel/SelectedPagesDisplay";
+import PageSelectionSyntaxHint from "@app/components/shared/PageSelectionSyntaxHint";
+import AdvancedSelectionPanel from "@app/components/pageEditor/bulkSelectionPanel/AdvancedSelectionPanel";
 
 interface BulkSelectionPanelProps {
   csvInput: string;
@@ -24,8 +24,8 @@ const BulkSelectionPanel = ({
   const maxPages = displayDocument?.pages?.length ?? 0;
 
   const handleClear = () => {
-    setCsvInput('');
-    onUpdatePagesFromCSV('');
+    setCsvInput("");
+    onUpdatePagesFromCSV("");
   };
 
   return (
@@ -39,7 +39,11 @@ const BulkSelectionPanel = ({
         onToggleAdvanced={setAdvancedOpened}
       />
 
-      <PageSelectionSyntaxHint input={csvInput} maxPages={maxPages} variant="panel" />
+      <PageSelectionSyntaxHint
+        input={csvInput}
+        maxPages={maxPages}
+        variant="panel"
+      />
 
       <SelectedPagesDisplay
         selectedPageIds={selectedPageIds}
@@ -58,4 +62,4 @@ const BulkSelectionPanel = ({
   );
 };
 
-export default BulkSelectionPanel;
\ No newline at end of file
+export default BulkSelectionPanel;
diff --git a/frontend/src/core/components/pageEditor/DragDropGrid.tsx b/frontend/src/core/components/pageEditor/DragDropGrid.tsx
index 47225c19fe..de1a3f59d7 100644
--- a/frontend/src/core/components/pageEditor/DragDropGrid.tsx
+++ b/frontend/src/core/components/pageEditor/DragDropGrid.tsx
@@ -1,14 +1,20 @@
-import React, { useRef, useEffect, useState, useCallback, useMemo } from 'react';
-import { Box } from '@mantine/core';
-import { useVirtualizer } from '@tanstack/react-virtual';
-import { GRID_CONSTANTS } from '@app/components/pageEditor/constants';
-import styles from '@app/components/pageEditor/DragDropGrid.module.css';
+import React, {
+  useRef,
+  useEffect,
+  useState,
+  useCallback,
+  useMemo,
+} from "react";
+import { Box } from "@mantine/core";
+import { useVirtualizer } from "@tanstack/react-virtual";
+import { GRID_CONSTANTS } from "@app/components/pageEditor/constants";
+import styles from "@app/components/pageEditor/DragDropGrid.module.css";
 import {
   Z_INDEX_SELECTION_BOX,
   Z_INDEX_DROP_INDICATOR,
   Z_INDEX_DRAG_BADGE,
-} from '@app/styles/zIndex';
-import { LocalIcon } from '@app/components/shared/LocalIcon';
+} from "@app/styles/zIndex";
+import { LocalIcon } from "@app/components/shared/LocalIcon";
 import {
   DndContext,
   DragEndEvent,
@@ -20,7 +26,7 @@ import {
   closestCenter,
   useDraggable,
   useDroppable,
-} from '@dnd-kit/core';
+} from "@dnd-kit/core";
 
 interface DragDropItem {
   id: string;
@@ -32,16 +38,32 @@ interface DragDropItem {
 
 interface DragDropGridProps<T extends DragDropItem> {
   items: T[];
-  onReorderPages: (sourcePageNumber: number, targetIndex: number, selectedPageIds?: string[]) => void;
-  renderItem: (item: T, index: number, refs: React.MutableRefObject<Map<string, HTMLDivElement>>, boxSelectedIds: string[], clearBoxSelection: () => void, activeDragIds: string[], justMoved: boolean, dragHandleProps?: any, zoomLevel?: number) => React.ReactNode;
-  getThumbnailData?: (itemId: string) => { src: string; rotation: number } | null;
+  onReorderPages: (
+    sourcePageNumber: number,
+    targetIndex: number,
+    selectedPageIds?: string[],
+  ) => void;
+  renderItem: (
+    item: T,
+    index: number,
+    refs: React.MutableRefObject<Map<string, HTMLDivElement>>,
+    boxSelectedIds: string[],
+    clearBoxSelection: () => void,
+    activeDragIds: string[],
+    justMoved: boolean,
+    dragHandleProps?: any,
+    zoomLevel?: number,
+  ) => React.ReactNode;
+  getThumbnailData?: (
+    itemId: string,
+  ) => { src: string; rotation: number } | null;
   zoomLevel?: number;
   selectedFileIds?: string[];
   selectedPageIds?: string[];
   onVisibleItemsChange?: (items: T[]) => void;
 }
 
-type DropSide = 'left' | 'right' | null;
+type DropSide = "left" | "right" | null;
 
 type ItemRect = { id: string; rect: DOMRect };
 
@@ -61,7 +83,10 @@ function resolveDropHint(
   }
 
   const items: ItemRect[] = Array.from(itemRefs.current.entries())
-    .filter((entry): entry is [string, HTMLDivElement] => !!entry[1] && entry[0] !== activeId)
+    .filter(
+      (entry): entry is [string, HTMLDivElement] =>
+        !!entry[1] && entry[0] !== activeId,
+    )
     .map(([itemId, element]) => ({
       id: itemId,
       rect: element.getBoundingClientRect(),
@@ -84,7 +109,8 @@ function resolveDropHint(
       return;
     }
 
-    const isSameRow = Math.abs(item.rect.top - currentRow[0].rect.top) <= rowTolerance;
+    const isSameRow =
+      Math.abs(item.rect.top - currentRow[0].rect.top) <= rowTolerance;
     if (isSameRow) {
       currentRow.push(item);
     } else {
@@ -131,13 +157,13 @@ function resolveDropHint(
   let dropSide: DropSide;
   if (cursorX < firstItem.rect.left) {
     hoveredItem = firstItem;
-    dropSide = 'left';
+    dropSide = "left";
   } else if (cursorX > lastItem.rect.right) {
     hoveredItem = lastItem;
-    dropSide = 'right';
+    dropSide = "right";
   } else {
     const midpoint = hoveredItem.rect.left + hoveredItem.rect.width / 2;
-    dropSide = cursorX >= midpoint ? 'right' : 'left';
+    dropSide = cursorX >= midpoint ? "right" : "left";
   }
 
   return { hoveredId: hoveredItem.id, dropSide };
@@ -168,15 +194,17 @@ function resolveTargetIndex<T extends DragDropItem>(
   };
 
   if (hoveredId) {
-    const filteredIndex = filteredItems.findIndex(item => item.id === hoveredId);
+    const filteredIndex = filteredItems.findIndex(
+      (item) => item.id === hoveredId,
+    );
     if (filteredIndex !== -1) {
-      const adjustedIndex = filteredIndex + (dropSide === 'right' ? 1 : 0);
+      const adjustedIndex = filteredIndex + (dropSide === "right" ? 1 : 0);
       return convertFilteredIndexToOriginal(adjustedIndex);
     }
   }
 
   if (fallbackIndex !== null && fallbackIndex !== undefined) {
-    const adjustedIndex = fallbackIndex + (dropSide === 'right' ? 1 : 0);
+    const adjustedIndex = fallbackIndex + (dropSide === "right" ? 1 : 0);
     return convertFilteredIndexToOriginal(adjustedIndex);
   }
 
@@ -192,17 +220,45 @@ interface DraggableItemProps<T extends DragDropItem> {
   clearBoxSelection: () => void;
   activeDragIds: string[];
   justMoved: boolean;
-  getThumbnailData?: (itemId: string) => { src: string; rotation: number } | null;
+  getThumbnailData?: (
+    itemId: string,
+  ) => { src: string; rotation: number } | null;
   onUpdateDropTarget: (itemId: string | null) => void;
-  renderItem: (item: T, index: number, refs: React.MutableRefObject<Map<string, HTMLDivElement>>, boxSelectedIds: string[], clearBoxSelection: () => void, activeDragIds: string[], justMoved: boolean, dragHandleProps?: any, zoomLevel?: number) => React.ReactNode;
+  renderItem: (
+    item: T,
+    index: number,
+    refs: React.MutableRefObject<Map<string, HTMLDivElement>>,
+    boxSelectedIds: string[],
+    clearBoxSelection: () => void,
+    activeDragIds: string[],
+    justMoved: boolean,
+    dragHandleProps?: any,
+    zoomLevel?: number,
+  ) => React.ReactNode;
   zoomLevel: number;
   selectedPageIds?: string[];
 }
 
-const DraggableItemInner = <T extends DragDropItem>({ item, index, itemRefs, boxSelectedPageIds, clearBoxSelection, activeDragIds, justMoved, getThumbnailData, renderItem, onUpdateDropTarget, zoomLevel }: DraggableItemProps<T>) => {
+const DraggableItemInner = <T extends DragDropItem>({
+  item,
+  index,
+  itemRefs,
+  boxSelectedPageIds,
+  clearBoxSelection,
+  activeDragIds,
+  justMoved,
+  getThumbnailData,
+  renderItem,
+  onUpdateDropTarget,
+  zoomLevel,
+}: DraggableItemProps<T>) => {
   const isPlaceholder = Boolean(item.isPlaceholder);
   const pageNumber = (item as any).pageNumber ?? index + 1;
-  const { attributes, listeners, setNodeRef: setDraggableRef } = useDraggable({
+  const {
+    attributes,
+    listeners,
+    setNodeRef: setDraggableRef,
+  } = useDraggable({
     id: item.id,
     disabled: isPlaceholder,
     data: {
@@ -215,21 +271,25 @@ const DraggableItemInner = <T extends DragDropItem>({ item, index, itemRefs, box
         }
 
         const element = itemRefs.current.get(item.id);
-        const imgElement = element?.querySelector('img.ph-no-capture') as HTMLImageElement;
+        const imgElement = element?.querySelector(
+          "img.ph-no-capture",
+        ) as HTMLImageElement;
         if (imgElement?.src) {
           return {
             src: imgElement.src,
-            rotation: imgElement.dataset.originalRotation ? parseInt(imgElement.dataset.originalRotation) : 0
+            rotation: imgElement.dataset.originalRotation
+              ? parseInt(imgElement.dataset.originalRotation)
+              : 0,
           };
         }
         return null;
-      }
-    }
+      },
+    },
   });
 
   const { setNodeRef: setDroppableRef, isOver } = useDroppable({
     id: item.id,
-    data: { index, pageNumber: index + 1 }
+    data: { index, pageNumber: index + 1 },
   });
 
   // Notify parent when hover state changes
@@ -241,14 +301,27 @@ const DraggableItemInner = <T extends DragDropItem>({ item, index, itemRefs, box
     }
   }, [isOver, item.id, onUpdateDropTarget]);
 
-  const setNodeRef = useCallback((element: HTMLDivElement | null) => {
-    setDraggableRef(element);
-    setDroppableRef(element);
-  }, [setDraggableRef, setDroppableRef]);
+  const setNodeRef = useCallback(
+    (element: HTMLDivElement | null) => {
+      setDraggableRef(element);
+      setDroppableRef(element);
+    },
+    [setDraggableRef, setDroppableRef],
+  );
 
   return (
     <>
-      {renderItem(item, index, itemRefs, boxSelectedPageIds, clearBoxSelection, activeDragIds, justMoved, { ref: setNodeRef, ...attributes, ...listeners }, zoomLevel)}
+      {renderItem(
+        item,
+        index,
+        itemRefs,
+        boxSelectedPageIds,
+        clearBoxSelection,
+        activeDragIds,
+        justMoved,
+        { ref: setNodeRef, ...attributes, ...listeners },
+        zoomLevel,
+      )}
     </>
   );
 };
@@ -267,8 +340,12 @@ const DraggableItem = React.memo(DraggableItemInner, (prevProps, nextProps) => {
   }
 
   // Check if page selection changed (for checkbox selection, not box selection)
-  const prevSelectedSet = prevProps.selectedPageIds ? new Set(prevProps.selectedPageIds) : null;
-  const nextSelectedSet = nextProps.selectedPageIds ? new Set(nextProps.selectedPageIds) : null;
+  const prevSelectedSet = prevProps.selectedPageIds
+    ? new Set(prevProps.selectedPageIds)
+    : null;
+  const nextSelectedSet = nextProps.selectedPageIds
+    ? new Set(nextProps.selectedPageIds)
+    : null;
 
   if (prevSelectedSet && nextSelectedSet) {
     const prevSelected = prevSelectedSet.has(prevProps.item.id);
@@ -303,41 +380,54 @@ const DragDropGrid = <T extends DragDropItem>({
   const containerRef = useRef<HTMLDivElement>(null);
 
   const getScrollElement = useCallback(() => {
-    return containerRef.current?.closest('[data-scrolling-container]') as HTMLElement | null;
+    return containerRef.current?.closest(
+      "[data-scrolling-container]",
+    ) as HTMLElement | null;
   }, []);
 
   // Create stable signature for items to ensure useMemo detects changes
-  const itemsSignature = useMemo(() => items.map(item => item.id).join(','), [items]);
-  const selectedFileIdsSignature = useMemo(() => selectedFileIds?.join(',') || '', [selectedFileIds]);
+  const itemsSignature = useMemo(
+    () => items.map((item) => item.id).join(","),
+    [items],
+  );
+  const selectedFileIdsSignature = useMemo(
+    () => selectedFileIds?.join(",") || "",
+    [selectedFileIds],
+  );
 
-  const { filteredItems: visibleItems, filteredToOriginalIndex } = useMemo(() => {
-    const filtered: T[] = [];
-    const indexMap: number[] = [];
-    const selectedIds =
-      selectedFileIds && selectedFileIds.length > 0 ? new Set(selectedFileIds) : null;
+  const { filteredItems: visibleItems, filteredToOriginalIndex } =
+    useMemo(() => {
+      const filtered: T[] = [];
+      const indexMap: number[] = [];
+      const selectedIds =
+        selectedFileIds && selectedFileIds.length > 0
+          ? new Set(selectedFileIds)
+          : null;
 
-    items.forEach((item, index) => {
-      const isPlaceholder = Boolean(item.isPlaceholder);
-      if (isPlaceholder) {
-        return;
-      }
+      items.forEach((item, index) => {
+        const isPlaceholder = Boolean(item.isPlaceholder);
+        if (isPlaceholder) {
+          return;
+        }
 
-      const belongsToVisibleFile =
-        !selectedIds || !item.originalFileId || selectedIds.has(item.originalFileId);
+        const belongsToVisibleFile =
+          !selectedIds ||
+          !item.originalFileId ||
+          selectedIds.has(item.originalFileId);
 
-      if (!belongsToVisibleFile) {
-        return;
-      }
+        if (!belongsToVisibleFile) {
+          return;
+        }
 
-      filtered.push(item);
-      indexMap.push(index);
-    });
+        filtered.push(item);
+        indexMap.push(index);
+      });
 
-    return { filteredItems: filtered, filteredToOriginalIndex: indexMap };
-  }, [items, selectedFileIds, itemsSignature, selectedFileIdsSignature]);
+      return { filteredItems: filtered, filteredToOriginalIndex: indexMap };
+    }, [items, selectedFileIds, itemsSignature, selectedFileIdsSignature]);
 
   useEffect(() => {
-    const visibleIdSet = new Set(visibleItems.map(item => item.id));
+    const visibleIdSet = new Set(visibleItems.map((item) => item.id));
     itemRefs.current.forEach((_, pageId) => {
       if (!visibleIdSet.has(pageId)) {
         itemRefs.current.delete(pageId);
@@ -346,8 +436,14 @@ const DragDropGrid = <T extends DragDropItem>({
   }, [visibleItems]);
 
   // Box selection state
-  const [boxSelectStart, setBoxSelectStart] = useState<{ x: number; y: number } | null>(null);
-  const [boxSelectEnd, setBoxSelectEnd] = useState<{ x: number; y: number } | null>(null);
+  const [boxSelectStart, setBoxSelectStart] = useState<{
+    x: number;
+    y: number;
+  } | null>(null);
+  const [boxSelectEnd, setBoxSelectEnd] = useState<{
+    x: number;
+    y: number;
+  } | null>(null);
   const [isBoxSelecting, setIsBoxSelecting] = useState(false);
   const [boxSelectedPageIds, setBoxSelectedPageIds] = useState<string[]>([]);
   const [justMovedIds, setJustMovedIds] = useState<string[]>([]);
@@ -355,7 +451,10 @@ const DragDropGrid = <T extends DragDropItem>({
 
   // Drag state
   const [activeId, setActiveId] = useState<string | null>(null);
-  const [dragPreview, setDragPreview] = useState<{ src: string; rotation: number } | null>(null);
+  const [dragPreview, setDragPreview] = useState<{
+    src: string;
+    rotation: number;
+  } | null>(null);
   const [hoveredItemId, setHoveredItemId] = useState<string | null>(null);
   const [dropSide, setDropSide] = useState<DropSide>(null);
 
@@ -366,7 +465,7 @@ const DragDropGrid = <T extends DragDropItem>({
       activationConstraint: {
         distance: 10,
       },
-    })
+    }),
   );
 
   // Throttled pointer move handler for drop indicator
@@ -395,9 +494,11 @@ const DragDropGrid = <T extends DragDropItem>({
       }
     };
 
-    window.addEventListener('pointermove', handlePointerMove, { passive: true });
+    window.addEventListener("pointermove", handlePointerMove, {
+      passive: true,
+    });
     return () => {
-      window.removeEventListener('pointermove', handlePointerMove);
+      window.removeEventListener("pointermove", handlePointerMove);
       if (rafId !== null) {
         cancelAnimationFrame(rafId);
       }
@@ -406,7 +507,10 @@ const DragDropGrid = <T extends DragDropItem>({
 
   // Responsive grid configuration
   const [itemsPerRow, setItemsPerRow] = useState(4);
-  const OVERSCAN = visibleItems.length > 1000 ? GRID_CONSTANTS.OVERSCAN_LARGE : GRID_CONSTANTS.OVERSCAN_SMALL;
+  const OVERSCAN =
+    visibleItems.length > 1000
+      ? GRID_CONSTANTS.OVERSCAN_LARGE
+      : GRID_CONSTANTS.OVERSCAN_SMALL;
 
   // Calculate items per row based on container width
   const calculateItemsPerRow = useCallback(() => {
@@ -416,8 +520,11 @@ const DragDropGrid = <T extends DragDropItem>({
     if (containerWidth === 0) return 4; // Container not measured yet
 
     // Convert rem to pixels for calculation
-    const remToPx = parseFloat(getComputedStyle(document.documentElement).fontSize);
-    const ITEM_WIDTH = parseFloat(GRID_CONSTANTS.ITEM_WIDTH) * remToPx * zoomLevel;
+    const remToPx = parseFloat(
+      getComputedStyle(document.documentElement).fontSize,
+    );
+    const ITEM_WIDTH =
+      parseFloat(GRID_CONSTANTS.ITEM_WIDTH) * remToPx * zoomLevel;
     const ITEM_GAP = parseFloat(GRID_CONSTANTS.ITEM_GAP) * remToPx * zoomLevel;
 
     // Calculate how many items fit: (width - gap) / (itemWidth + gap)
@@ -439,7 +546,7 @@ const DragDropGrid = <T extends DragDropItem>({
     updateLayout();
 
     // Listen for window resize
-    window.addEventListener('resize', updateLayout);
+    window.addEventListener("resize", updateLayout);
 
     // Use ResizeObserver for container size changes
     const resizeObserver = new ResizeObserver(updateLayout);
@@ -448,7 +555,7 @@ const DragDropGrid = <T extends DragDropItem>({
     }
 
     return () => {
-      window.removeEventListener('resize', updateLayout);
+      window.removeEventListener("resize", updateLayout);
       resizeObserver.disconnect();
     };
   }, [calculateItemsPerRow, zoomLevel]);
@@ -458,7 +565,9 @@ const DragDropGrid = <T extends DragDropItem>({
     count: Math.ceil(visibleItems.length / itemsPerRow),
     getScrollElement,
     estimateSize: () => {
-      const remToPx = parseFloat(getComputedStyle(document.documentElement).fontSize);
+      const remToPx = parseFloat(
+        getComputedStyle(document.documentElement).fontSize,
+      );
       return parseFloat(GRID_CONSTANTS.ITEM_HEIGHT) * remToPx * zoomLevel;
     },
     overscan: OVERSCAN,
@@ -481,10 +590,19 @@ const DragDropGrid = <T extends DragDropItem>({
 
   // Re-measure virtualizer when zoom or items per row changes
   // Also remeasure when items change (not just length) to handle item additions/removals
-  const visibleItemsSignature = useMemo(() => visibleItems.map(item => item.id).join(','), [visibleItems]);
+  const visibleItemsSignature = useMemo(
+    () => visibleItems.map((item) => item.id).join(","),
+    [visibleItems],
+  );
   useEffect(() => {
     rowVirtualizer.measure();
-  }, [zoomLevel, itemsPerRow, visibleItems.length, visibleItemsSignature, rowVirtualizer]);
+  }, [
+    zoomLevel,
+    itemsPerRow,
+    visibleItems.length,
+    visibleItemsSignature,
+    rowVirtualizer,
+  ]);
 
   // Cleanup highlight timeout on unmount
   useEffect(() => {
@@ -497,76 +615,85 @@ const DragDropGrid = <T extends DragDropItem>({
   }, []);
 
   // Box selection handlers
-  const handleMouseDown = useCallback((e: React.MouseEvent) => {
-    if (e.button !== 0) return; // Only respond to primary button
+  const handleMouseDown = useCallback(
+    (e: React.MouseEvent) => {
+      if (e.button !== 0) return; // Only respond to primary button
 
-    const container = containerRef.current;
-    if (!container) return;
+      const container = containerRef.current;
+      if (!container) return;
 
-    const clickTarget = e.target as Node;
-    let clickedPageId: string | null = null;
+      const clickTarget = e.target as Node;
+      let clickedPageId: string | null = null;
 
-    itemRefs.current.forEach((element, pageId) => {
-      if (element.contains(clickTarget)) {
-        clickedPageId = pageId;
+      itemRefs.current.forEach((element, pageId) => {
+        if (element.contains(clickTarget)) {
+          clickedPageId = pageId;
+        }
+      });
+
+      if (clickedPageId) {
+        // Clicking directly on a page shouldn't initiate box selection
+        // but clear previous box selection if clicking outside current group
+        if (
+          boxSelectedPageIds.length > 0 &&
+          !boxSelectedPageIds.includes(clickedPageId)
+        ) {
+          setBoxSelectedPageIds([]);
+        }
+        return;
       }
-    });
 
-    if (clickedPageId) {
-      // Clicking directly on a page shouldn't initiate box selection
-      // but clear previous box selection if clicking outside current group
-      if (boxSelectedPageIds.length > 0 && !boxSelectedPageIds.includes(clickedPageId)) {
-        setBoxSelectedPageIds([]);
-      }
-      return;
-    }
+      e.preventDefault();
 
-    e.preventDefault();
+      const rect = container.getBoundingClientRect();
+      setIsBoxSelecting(true);
+      setBoxSelectStart({ x: e.clientX - rect.left, y: e.clientY - rect.top });
+      setBoxSelectEnd({ x: e.clientX - rect.left, y: e.clientY - rect.top });
+      setBoxSelectedPageIds([]);
+    },
+    [boxSelectedPageIds],
+  );
 
-    const rect = container.getBoundingClientRect();
-    setIsBoxSelecting(true);
-    setBoxSelectStart({ x: e.clientX - rect.left, y: e.clientY - rect.top });
-    setBoxSelectEnd({ x: e.clientX - rect.left, y: e.clientY - rect.top });
-    setBoxSelectedPageIds([]);
-  }, [boxSelectedPageIds]);
+  const handleMouseMove = useCallback(
+    (e: React.MouseEvent) => {
+      if (!isBoxSelecting || !boxSelectStart) return;
 
-  const handleMouseMove = useCallback((e: React.MouseEvent) => {
-    if (!isBoxSelecting || !boxSelectStart) return;
+      const rect = containerRef.current?.getBoundingClientRect();
+      if (!rect) return;
 
-    const rect = containerRef.current?.getBoundingClientRect();
-    if (!rect) return;
+      setBoxSelectEnd({ x: e.clientX - rect.left, y: e.clientY - rect.top });
 
-    setBoxSelectEnd({ x: e.clientX - rect.left, y: e.clientY - rect.top });
+      // Calculate which pages intersect with selection box
+      const boxLeft = Math.min(boxSelectStart.x, e.clientX - rect.left);
+      const boxRight = Math.max(boxSelectStart.x, e.clientX - rect.left);
+      const boxTop = Math.min(boxSelectStart.y, e.clientY - rect.top);
+      const boxBottom = Math.max(boxSelectStart.y, e.clientY - rect.top);
 
-    // Calculate which pages intersect with selection box
-    const boxLeft = Math.min(boxSelectStart.x, e.clientX - rect.left);
-    const boxRight = Math.max(boxSelectStart.x, e.clientX - rect.left);
-    const boxTop = Math.min(boxSelectStart.y, e.clientY - rect.top);
-    const boxBottom = Math.max(boxSelectStart.y, e.clientY - rect.top);
+      const selectedIds: string[] = [];
+      itemRefs.current.forEach((pageEl, pageId) => {
+        const pageRect = pageEl.getBoundingClientRect();
+        const pageLeft = pageRect.left - rect.left;
+        const pageRight = pageRect.right - rect.left;
+        const pageTop = pageRect.top - rect.top;
+        const pageBottom = pageRect.bottom - rect.top;
 
-    const selectedIds: string[] = [];
-    itemRefs.current.forEach((pageEl, pageId) => {
-      const pageRect = pageEl.getBoundingClientRect();
-      const pageLeft = pageRect.left - rect.left;
-      const pageRight = pageRect.right - rect.left;
-      const pageTop = pageRect.top - rect.top;
-      const pageBottom = pageRect.bottom - rect.top;
+        // Check if page intersects with selection box
+        const intersects = !(
+          pageRight < boxLeft ||
+          pageLeft > boxRight ||
+          pageBottom < boxTop ||
+          pageTop > boxBottom
+        );
 
-      // Check if page intersects with selection box
-      const intersects = !(
-        pageRight < boxLeft ||
-        pageLeft > boxRight ||
-        pageBottom < boxTop ||
-        pageTop > boxBottom
-      );
+        if (intersects) {
+          selectedIds.push(pageId);
+        }
+      });
 
-      if (intersects) {
-        selectedIds.push(pageId);
-      }
-    });
-
-    setBoxSelectedPageIds(selectedIds);
-  }, [isBoxSelecting, boxSelectStart]);
+      setBoxSelectedPageIds(selectedIds);
+    },
+    [isBoxSelecting, boxSelectStart],
+  );
 
   const handleMouseUp = useCallback(() => {
     if (isBoxSelecting) {
@@ -593,7 +720,10 @@ const DragDropGrid = <T extends DragDropItem>({
     if (getThumbnail) {
       const thumbnailData = getThumbnail();
       if (thumbnailData?.src) {
-        setDragPreview({ src: thumbnailData.src, rotation: thumbnailData.rotation });
+        setDragPreview({
+          src: thumbnailData.src,
+          rotation: thumbnailData.rotation,
+        });
         return;
       }
     }
@@ -601,7 +731,6 @@ const DragDropGrid = <T extends DragDropItem>({
     setDragPreview(null);
   }, []);
 
-
   // Handle drag cancel
   const handleDragCancel = useCallback(() => {
     setActiveId(null);
@@ -611,79 +740,99 @@ const DragDropGrid = <T extends DragDropItem>({
   }, []);
 
   // Handle drag end
-  const handleDragEnd = useCallback((event: DragEndEvent) => {
-    const { active, over } = event;
-    const finalDropSide = dropSide;
-    setActiveId(null);
-    setDragPreview(null);
-    setHoveredItemId(null);
-    setDropSide(null);
+  const handleDragEnd = useCallback(
+    (event: DragEndEvent) => {
+      const { active, over } = event;
+      const finalDropSide = dropSide;
+      setActiveId(null);
+      setDragPreview(null);
+      setHoveredItemId(null);
+      setDropSide(null);
 
-    if (!over || active.id === over.id) {
-      return;
-    }
+      if (!over || active.id === over.id) {
+        return;
+      }
 
-    const activeData = active.data.current;
-    if (!activeData) {
-      return;
-    }
+      const activeData = active.data.current;
+      if (!activeData) {
+        return;
+      }
 
-    const sourcePageNumber = activeData.pageNumber;
+      const sourcePageNumber = activeData.pageNumber;
 
-    const overData = over?.data.current;
-    let targetIndex = resolveTargetIndex(
+      const overData = over?.data.current;
+      let targetIndex = resolveTargetIndex(
+        hoveredItemId,
+        finalDropSide,
+        visibleItems,
+        filteredToOriginalIndex,
+        items.length,
+        overData ? overData.index : null,
+      );
+
+      if (targetIndex === null) {
+        return;
+      }
+      if (targetIndex < 0) targetIndex = 0;
+      if (targetIndex > items.length) targetIndex = items.length;
+
+      // Check if this page is box-selected
+      const isBoxSelected = boxSelectedPageIds.includes(active.id as string);
+      const pagesToDrag =
+        isBoxSelected && boxSelectedPageIds.length > 0
+          ? boxSelectedPageIds
+          : undefined;
+
+      // Call reorder with page number and target index
+      onReorderPages(sourcePageNumber, targetIndex, pagesToDrag);
+
+      // Highlight moved pages briefly
+      const movedIds = pagesToDrag ?? [active.id as string];
+      setJustMovedIds(movedIds);
+      if (highlightTimeoutRef.current) {
+        window.clearTimeout(highlightTimeoutRef.current);
+      }
+      highlightTimeoutRef.current = window.setTimeout(() => {
+        setJustMovedIds([]);
+        highlightTimeoutRef.current = null;
+      }, 1200);
+
+      // Clear box selection after drag
+      if (pagesToDrag) {
+        clearBoxSelection();
+      }
+    },
+    [
+      boxSelectedPageIds,
+      dropSide,
       hoveredItemId,
-      finalDropSide,
       visibleItems,
       filteredToOriginalIndex,
-      items.length,
-      overData ? overData.index : null
-    );
-
-    if (targetIndex === null) {
-      return;
-    }
-    if (targetIndex < 0) targetIndex = 0;
-    if (targetIndex > items.length) targetIndex = items.length;
-
-    // Check if this page is box-selected
-    const isBoxSelected = boxSelectedPageIds.includes(active.id as string);
-    const pagesToDrag = isBoxSelected && boxSelectedPageIds.length > 0 ? boxSelectedPageIds : undefined;
-
-    // Call reorder with page number and target index
-    onReorderPages(sourcePageNumber, targetIndex, pagesToDrag);
-
-    // Highlight moved pages briefly
-    const movedIds = pagesToDrag ?? [active.id as string];
-    setJustMovedIds(movedIds);
-    if (highlightTimeoutRef.current) {
-      window.clearTimeout(highlightTimeoutRef.current);
-    }
-    highlightTimeoutRef.current = window.setTimeout(() => {
-      setJustMovedIds([]);
-      highlightTimeoutRef.current = null;
-    }, 1200);
-
-    // Clear box selection after drag
-    if (pagesToDrag) {
-      clearBoxSelection();
-    }
-  }, [boxSelectedPageIds, dropSide, hoveredItemId, visibleItems, filteredToOriginalIndex, items, onReorderPages, clearBoxSelection]);
+      items,
+      onReorderPages,
+      clearBoxSelection,
+    ],
+  );
 
   // Calculate optimal width for centering
-  const remToPx = parseFloat(getComputedStyle(document.documentElement).fontSize);
+  const remToPx = parseFloat(
+    getComputedStyle(document.documentElement).fontSize,
+  );
   const itemWidth = parseFloat(GRID_CONSTANTS.ITEM_WIDTH) * remToPx * zoomLevel;
   const itemGap = parseFloat(GRID_CONSTANTS.ITEM_GAP) * remToPx * zoomLevel;
   const gridWidth = itemsPerRow * itemWidth + (itemsPerRow - 1) * itemGap;
 
   // Calculate selection box dimensions
-  const selectionBoxStyle = isBoxSelecting && boxSelectStart && boxSelectEnd ? {
-    left: Math.min(boxSelectStart.x, boxSelectEnd.x),
-    top: Math.min(boxSelectStart.y, boxSelectEnd.y),
-    width: Math.abs(boxSelectEnd.x - boxSelectStart.x),
-    height: Math.abs(boxSelectEnd.y - boxSelectStart.y),
-    zIndex: Z_INDEX_SELECTION_BOX,
-  } : null;
+  const selectionBoxStyle =
+    isBoxSelecting && boxSelectStart && boxSelectEnd
+      ? {
+          left: Math.min(boxSelectStart.x, boxSelectEnd.x),
+          top: Math.min(boxSelectStart.y, boxSelectEnd.y),
+          width: Math.abs(boxSelectEnd.x - boxSelectStart.x),
+          height: Math.abs(boxSelectEnd.y - boxSelectStart.y),
+          zIndex: Z_INDEX_SELECTION_BOX,
+        }
+      : null;
 
   // Calculate drop indicator position
   const dropIndicatorStyle = useMemo(() => {
@@ -698,9 +847,10 @@ const DragDropGrid = <T extends DragDropItem>({
 
     const top = itemRect.top - containerRect.top;
     const height = itemRect.height;
-    const left = dropSide === 'left'
-      ? itemRect.left - containerRect.left - itemGap / 2
-      : itemRect.right - containerRect.left + itemGap / 2;
+    const left =
+      dropSide === "left"
+        ? itemRect.left - containerRect.left - itemGap / 2
+        : itemRect.right - containerRect.left + itemGap / 2;
 
     return {
       left: `${left}px`,
@@ -718,23 +868,26 @@ const DragDropGrid = <T extends DragDropItem>({
     return [activeId];
   }, [activeId, boxSelectedPageIds]);
 
-  const handleWheelWhileDragging = useCallback((event: React.WheelEvent<HTMLDivElement>) => {
-    if (!activeId) {
-      return;
-    }
+  const handleWheelWhileDragging = useCallback(
+    (event: React.WheelEvent<HTMLDivElement>) => {
+      if (!activeId) {
+        return;
+      }
 
-    const scrollElement = getScrollElement();
-    if (!scrollElement) {
-      return;
-    }
+      const scrollElement = getScrollElement();
+      if (!scrollElement) {
+        return;
+      }
 
-    scrollElement.scrollBy({
-      top: event.deltaY,
-      left: event.deltaX,
-    });
+      scrollElement.scrollBy({
+        top: event.deltaY,
+        left: event.deltaX,
+      });
 
-    event.preventDefault();
-  }, [activeId, getScrollElement]);
+      event.preventDefault();
+    },
+    [activeId, getScrollElement],
+  );
 
   return (
     <DndContext
@@ -753,17 +906,11 @@ const DragDropGrid = <T extends DragDropItem>({
         onWheel={handleWheelWhileDragging}
       >
         {selectionBoxStyle && (
-          <div
-            className={styles.selectionBox}
-            style={selectionBoxStyle}
-          />
+          <div className={styles.selectionBox} style={selectionBoxStyle} />
         )}
 
         {dropIndicatorStyle && (
-          <div
-            className={styles.dropIndicator}
-            style={dropIndicatorStyle}
-          />
+          <div className={styles.dropIndicator} style={dropIndicatorStyle} />
         )}
 
         <div
@@ -771,12 +918,15 @@ const DragDropGrid = <T extends DragDropItem>({
           style={{
             height: `${rowVirtualizer.getTotalSize()}px`,
             maxWidth: `${gridWidth}px`,
-            margin: '0 auto',
+            margin: "0 auto",
           }}
         >
           {virtualRows.map((virtualRow) => {
             const startIndex = virtualRow.index * itemsPerRow;
-            const endIndex = Math.min(startIndex + itemsPerRow, visibleItems.length);
+            const endIndex = Math.min(
+              startIndex + itemsPerRow,
+              visibleItems.length,
+            );
             const rowItems = visibleItems.slice(startIndex, endIndex);
 
             return (
@@ -825,14 +975,15 @@ const DragDropGrid = <T extends DragDropItem>({
       <DragOverlay>
         {activeId && (
           <div className={styles.dragOverlay}>
-            {boxSelectedPageIds.includes(activeId) && boxSelectedPageIds.length > 1 && (
-              <div
-                className={styles.dragOverlayBadge}
-                style={{ zIndex: Z_INDEX_DRAG_BADGE }}
-              >
-                {boxSelectedPageIds.length}
-              </div>
-            )}
+            {boxSelectedPageIds.includes(activeId) &&
+              boxSelectedPageIds.length > 1 && (
+                <div
+                  className={styles.dragOverlayBadge}
+                  style={{ zIndex: Z_INDEX_DRAG_BADGE }}
+                >
+                  {boxSelectedPageIds.length}
+                </div>
+              )}
             {dragPreview ? (
               <img
                 src={dragPreview.src}
@@ -840,9 +991,9 @@ const DragDropGrid = <T extends DragDropItem>({
                 style={{
                   width: `calc(20rem * ${zoomLevel})`,
                   height: `calc(20rem * ${zoomLevel})`,
-                  objectFit: 'contain',
+                  objectFit: "contain",
                   transform: `rotate(${dragPreview.rotation}deg)`,
-                  pointerEvents: 'none',
+                  pointerEvents: "none",
                   opacity: 0.5,
                 }}
               />
@@ -852,11 +1003,11 @@ const DragDropGrid = <T extends DragDropItem>({
                 style={{
                   width: `calc(20rem * ${zoomLevel})`,
                   height: `calc(20rem * ${zoomLevel})`,
-                  display: 'flex',
-                  alignItems: 'center',
-                  justifyContent: 'center',
-                  fontSize: '2rem',
-                  color: 'var(--mantine-color-dimmed)',
+                  display: "flex",
+                  alignItems: "center",
+                  justifyContent: "center",
+                  fontSize: "2rem",
+                  color: "var(--mantine-color-dimmed)",
                 }}
               >
                 <LocalIcon icon="description" width="3rem" height="3rem" />
diff --git a/frontend/src/core/components/pageEditor/FileThumbnail.tsx b/frontend/src/core/components/pageEditor/FileThumbnail.tsx
index b35ae89d0f..55d2c7d80a 100644
--- a/frontend/src/core/components/pageEditor/FileThumbnail.tsx
+++ b/frontend/src/core/components/pageEditor/FileThumbnail.tsx
@@ -1,20 +1,29 @@
-import React, { useState, useCallback, useRef, useMemo, useEffect } from 'react';
-import { ActionIcon, CheckboxIndicator } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import MoreVertIcon from '@mui/icons-material/MoreVert';
-import DeleteOutlineIcon from '@mui/icons-material/DeleteOutline';
-import PushPinIcon from '@mui/icons-material/PushPin';
-import PushPinOutlinedIcon from '@mui/icons-material/PushPinOutlined';
-import DragIndicatorIcon from '@mui/icons-material/DragIndicator';
-import { draggable, dropTargetForElements } from '@atlaskit/pragmatic-drag-and-drop/element/adapter';
+import React, {
+  useState,
+  useCallback,
+  useRef,
+  useMemo,
+  useEffect,
+} from "react";
+import { ActionIcon, CheckboxIndicator } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import MoreVertIcon from "@mui/icons-material/MoreVert";
+import DeleteOutlineIcon from "@mui/icons-material/DeleteOutline";
+import PushPinIcon from "@mui/icons-material/PushPin";
+import PushPinOutlinedIcon from "@mui/icons-material/PushPinOutlined";
+import DragIndicatorIcon from "@mui/icons-material/DragIndicator";
+import {
+  draggable,
+  dropTargetForElements,
+} from "@atlaskit/pragmatic-drag-and-drop/element/adapter";
 
-import styles from '@app/components/pageEditor/PageEditor.module.css';
-import { useFileContext } from '@app/contexts/FileContext';
-import { FileId } from '@app/types/file';
-import { PrivateContent } from '@app/components/shared/PrivateContent';
-import { useFileActionTerminology } from '@app/hooks/useFileActionTerminology';
-import { useFileActionIcons } from '@app/hooks/useFileActionIcons';
-import { downloadFile } from '@app/services/downloadService';
+import styles from "@app/components/pageEditor/PageEditor.module.css";
+import { useFileContext } from "@app/contexts/FileContext";
+import { FileId } from "@app/types/file";
+import { PrivateContent } from "@app/components/shared/PrivateContent";
+import { useFileActionTerminology } from "@app/hooks/useFileActionTerminology";
+import { useFileActionIcons } from "@app/hooks/useFileActionIcons";
+import { downloadFile } from "@app/services/downloadService";
 
 interface FileItem {
   id: FileId;
@@ -35,7 +44,11 @@ interface FileThumbnailProps {
   onDeleteFile: (fileId: FileId) => void;
   onViewFile: (fileId: FileId) => void;
   onSetStatus: (status: string) => void;
-  onReorderFiles?: (sourceFileId: FileId, targetFileId: FileId, selectedFileIds: FileId[]) => void;
+  onReorderFiles?: (
+    sourceFileId: FileId,
+    targetFileId: FileId,
+    selectedFileIds: FileId[],
+  ) => void;
   onDownloadFile?: (fileId: FileId) => void;
   toolMode?: boolean;
   isSupported?: boolean;
@@ -61,18 +74,20 @@ const FileThumbnail = ({
   // ---- Drag state ----
   const [isDragging, setIsDragging] = useState(false);
   const dragElementRef = useRef<HTMLDivElement | null>(null);
-  const [actionsWidth, setActionsWidth] = useState<number | undefined>(undefined);
+  const [actionsWidth, setActionsWidth] = useState<number | undefined>(
+    undefined,
+  );
   const [showActions, setShowActions] = useState(false);
 
   // Resolve the actual File object for pin/unpin operations
   const actualFile = useMemo(() => {
-    return activeFiles.find(f => f.fileId === file.id);
+    return activeFiles.find((f) => f.fileId === file.id);
   }, [activeFiles, file.id]);
   const isPinned = actualFile ? isFilePinned(actualFile) : false;
 
   const downloadSelectedFile = useCallback(() => {
     // Prefer parent-provided handler if available
-    if (typeof onDownloadFile === 'function') {
+    if (typeof onDownloadFile === "function") {
       onDownloadFile(file.id);
       return;
     }
@@ -80,7 +95,10 @@ const FileThumbnail = ({
     // Fallback: attempt to download using the File object if provided
     const maybeFile = (file as unknown as { file?: File }).file;
     if (maybeFile instanceof File) {
-      void downloadFile({ data: maybeFile, filename: maybeFile.name || file.name || 'download' });
+      void downloadFile({
+        data: maybeFile,
+        filename: maybeFile.name || file.name || "download",
+      });
       return;
     }
 
@@ -93,61 +111,65 @@ const FileThumbnail = ({
   const isSelected = selectedFiles.includes(file.id);
 
   // ---- Drag & drop wiring ----
-  const fileElementRef = useCallback((element: HTMLDivElement | null) => {
-    if (!element) return;
+  const fileElementRef = useCallback(
+    (element: HTMLDivElement | null) => {
+      if (!element) return;
 
-    dragElementRef.current = element;
+      dragElementRef.current = element;
 
-    const dragCleanup = draggable({
-      element,
-      getInitialData: () => ({
-        type: 'file',
-        fileId: file.id,
-        fileName: file.name,
-        selectedFiles: [file.id]  // Always drag only this file, ignore selection state
-      }),
-      onDragStart: () => {
-        setIsDragging(true);
-      },
-      onDrop: () => {
-        setIsDragging(false);
-      }
-    });
+      const dragCleanup = draggable({
+        element,
+        getInitialData: () => ({
+          type: "file",
+          fileId: file.id,
+          fileName: file.name,
+          selectedFiles: [file.id], // Always drag only this file, ignore selection state
+        }),
+        onDragStart: () => {
+          setIsDragging(true);
+        },
+        onDrop: () => {
+          setIsDragging(false);
+        },
+      });
 
-    const dropCleanup = dropTargetForElements({
-      element,
-      getData: () => ({
-        type: 'file',
-        fileId: file.id
-      }),
-      canDrop: ({ source }) => {
-        const sourceData = source.data;
-        return sourceData.type === 'file' && sourceData.fileId !== file.id;
-      },
-      onDrop: ({ source }) => {
-        const sourceData = source.data;
-        if (sourceData.type === 'file' && onReorderFiles) {
-          const sourceFileId = sourceData.fileId as FileId;
-          const selectedFileIds = sourceData.selectedFiles as FileId[];
-          onReorderFiles(sourceFileId, file.id, selectedFileIds);
-        }
-      }
-    });
+      const dropCleanup = dropTargetForElements({
+        element,
+        getData: () => ({
+          type: "file",
+          fileId: file.id,
+        }),
+        canDrop: ({ source }) => {
+          const sourceData = source.data;
+          return sourceData.type === "file" && sourceData.fileId !== file.id;
+        },
+        onDrop: ({ source }) => {
+          const sourceData = source.data;
+          if (sourceData.type === "file" && onReorderFiles) {
+            const sourceFileId = sourceData.fileId as FileId;
+            const selectedFileIds = sourceData.selectedFiles as FileId[];
+            onReorderFiles(sourceFileId, file.id, selectedFileIds);
+          }
+        },
+      });
 
-    return () => {
-      dragCleanup();
-      dropCleanup();
-    };
-  }, [file.id, file.name, selectedFiles, onReorderFiles]);
+      return () => {
+        dragCleanup();
+        dropCleanup();
+      };
+    },
+    [file.id, file.name, selectedFiles, onReorderFiles],
+  );
 
   // Update dropdown width on resize
   useEffect(() => {
     const update = () => {
-      if (dragElementRef.current) setActionsWidth(dragElementRef.current.offsetWidth);
+      if (dragElementRef.current)
+        setActionsWidth(dragElementRef.current.offsetWidth);
     };
     update();
-    window.addEventListener('resize', update);
-    return () => window.removeEventListener('resize', update);
+    window.addEventListener("resize", update);
+    return () => window.removeEventListener("resize", update);
   }, []);
 
   // Close the actions dropdown when hovering outside this file card (and its dropdown)
@@ -173,11 +195,13 @@ const FileThumbnail = ({
       }
     };
 
-    document.addEventListener('mousemove', handleMouseMove);
-    document.addEventListener('touchstart', handleTouchStart, { passive: true });
+    document.addEventListener("mousemove", handleMouseMove);
+    document.addEventListener("touchstart", handleTouchStart, {
+      passive: true,
+    });
     return () => {
-      document.removeEventListener('mousemove', handleMouseMove);
-      document.removeEventListener('touchstart', handleTouchStart);
+      document.removeEventListener("mousemove", handleMouseMove);
+      document.removeEventListener("touchstart", handleTouchStart);
     };
   }, [showActions]);
 
@@ -187,7 +211,6 @@ const FileThumbnail = ({
     onToggleFile(file.id);
   };
 
-
   return (
     <div
       ref={fileElementRef}
@@ -198,7 +221,7 @@ const FileThumbnail = ({
       className={`${styles.card} w-[18rem] h-[22rem] select-none flex flex-col shadow-sm transition-all relative`}
       style={{
         opacity: isSupported ? (isDragging ? 0.9 : 1) : 0.5,
-        filter: isSupported ? 'none' : 'grayscale(50%)',
+        filter: isSupported ? "none" : "grayscale(50%)",
       }}
       tabIndex={0}
       role="listitem"
@@ -207,9 +230,7 @@ const FileThumbnail = ({
     >
       {/* Header bar */}
       <div
-        className={`${styles.header} ${
-          isSelected ? styles.headerSelected : styles.headerResting
-        }`}
+        className={`${styles.header} ${isSelected ? styles.headerSelected : styles.headerResting}`}
       >
         {/* Logo/checkbox area */}
         <div className={styles.logoMark}>
@@ -221,21 +242,22 @@ const FileThumbnail = ({
             />
           ) : (
             <div className={styles.unsupportedPill}>
-              <span>
-                {t('unsupported', 'Unsupported')}
-              </span>
+              <span>{t("unsupported", "Unsupported")}</span>
             </div>
           )}
         </div>
 
         {/* Centered index */}
-        <div className={styles.headerIndex} aria-label={`Position ${index + 1}`}>
+        <div
+          className={styles.headerIndex}
+          aria-label={`Position ${index + 1}`}
+        >
           {index + 1}
         </div>
 
         {/* Kebab menu */}
         <ActionIcon
-          aria-label={t('moreOptions', 'More options')}
+          aria-label={t("moreOptions", "More options")}
           variant="subtle"
           className={styles.kebab}
           onClick={(e) => {
@@ -269,13 +291,20 @@ const FileThumbnail = ({
               setShowActions(false);
             }}
           >
-            {isPinned ? <PushPinIcon fontSize="small" /> : <PushPinOutlinedIcon fontSize="small" />}
-            <span>{isPinned ? t('unpin', 'Unpin') : t('pin', 'Pin')}</span>
+            {isPinned ? (
+              <PushPinIcon fontSize="small" />
+            ) : (
+              <PushPinOutlinedIcon fontSize="small" />
+            )}
+            <span>{isPinned ? t("unpin", "Unpin") : t("pin", "Pin")}</span>
           </button>
 
           <button
             className={styles.actionRow}
-            onClick={() => { downloadSelectedFile(); setShowActions(false); }}
+            onClick={() => {
+              downloadSelectedFile();
+              setShowActions(false);
+            }}
           >
             <DownloadOutlinedIcon fontSize="small" />
             <span>{terminology.download}</span>
@@ -292,7 +321,7 @@ const FileThumbnail = ({
             }}
           >
             <DeleteOutlineIcon fontSize="small" />
-            <span>{t('delete', 'Delete')}</span>
+            <span>{t("delete", "Delete")}</span>
           </button>
         </div>
       )}
@@ -302,17 +331,17 @@ const FileThumbnail = ({
         {/* Stacked file effect - multiple shadows to simulate pages */}
         <div
           style={{
-            width: '100%',
-            height: '100%',
-            backgroundColor: 'var(--mantine-color-gray-1)',
+            width: "100%",
+            height: "100%",
+            backgroundColor: "var(--mantine-color-gray-1)",
             borderRadius: 6,
-            border: '1px solid var(--mantine-color-gray-3)',
+            border: "1px solid var(--mantine-color-gray-3)",
             padding: 4,
-            display: 'flex',
-            alignItems: 'center',
-            justifyContent: 'center',
-            position: 'relative',
-            boxShadow: '2px 2px 0 rgba(0,0,0,0.1), 4px 4px 0 rgba(0,0,0,0.05)'
+            display: "flex",
+            alignItems: "center",
+            justifyContent: "center",
+            position: "relative",
+            boxShadow: "2px 2px 0 rgba(0,0,0,0.1), 4px 4px 0 rgba(0,0,0,0.05)",
           }}
         >
           {file.thumbnail && (
@@ -324,21 +353,21 @@ const FileThumbnail = ({
                 onError={(e) => {
                   // Hide broken image if blob URL was revoked
                   const img = e.target as HTMLImageElement;
-                  img.style.display = 'none';
+                  img.style.display = "none";
                 }}
-              style={{
-                maxWidth: '80%',
-                maxHeight: '80%',
-                objectFit: 'contain',
-                borderRadius: 0,
-                background: '#ffffff',
-                border: '1px solid var(--border-default)',
-                display: 'block',
-                marginLeft: 'auto',
-                marginRight: 'auto',
-                alignSelf: 'start'
-              }}
-            />
+                style={{
+                  maxWidth: "80%",
+                  maxHeight: "80%",
+                  objectFit: "contain",
+                  borderRadius: 0,
+                  background: "#ffffff",
+                  border: "1px solid var(--border-default)",
+                  display: "block",
+                  marginLeft: "auto",
+                  marginRight: "auto",
+                  alignSelf: "start",
+                }}
+              />
             </PrivateContent>
           )}
         </div>
diff --git a/frontend/src/core/components/pageEditor/PageEditor.module.css b/frontend/src/core/components/pageEditor/PageEditor.module.css
index 0c295a209c..3be018ffa2 100644
--- a/frontend/src/core/components/pageEditor/PageEditor.module.css
+++ b/frontend/src/core/components/pageEditor/PageEditor.module.css
@@ -52,7 +52,8 @@
 
 /* Animations */
 @keyframes pulse {
-  0%, 100% {
+  0%,
+  100% {
     opacity: 1;
   }
   50% {
@@ -61,18 +62,18 @@
 }
 
 /* Action styles */
-.actionRow:hover { 
-  background: var(--hover-bg); 
+.actionRow:hover {
+  background: var(--hover-bg);
 }
 
-.actionDanger { 
-  color: var(--text-brand-accent); 
+.actionDanger {
+  color: var(--text-brand-accent);
 }
 
-.actionsDivider { 
-  height: 1px; 
-  background: var(--border-default); 
-  margin: 4px 0; 
+.actionsDivider {
+  height: 1px;
+  background: var(--border-default);
+  margin: 4px 0;
 }
 
 .pinIndicator {
@@ -85,7 +86,7 @@
 
 .unsupportedPill {
   margin-left: 1.75rem;
-  background: #6B7280;
+  background: #6b7280;
   color: white;
   padding: 4px 8px;
   border-radius: 12px;
diff --git a/frontend/src/core/components/pageEditor/PageEditor.tsx b/frontend/src/core/components/pageEditor/PageEditor.tsx
index b182c9d3a8..ea78c7a722 100644
--- a/frontend/src/core/components/pageEditor/PageEditor.tsx
+++ b/frontend/src/core/components/pageEditor/PageEditor.tsx
@@ -1,20 +1,22 @@
 import { useState, useCallback, useRef, useEffect, useMemo } from "react";
 import { Text, Center, Box, LoadingOverlay, Stack } from "@mantine/core";
 import { useFileState, useFileActions } from "@app/contexts/FileContext";
-import { useNavigationGuard, useNavigationState } from "@app/contexts/NavigationContext";
+import {
+  useNavigationGuard,
+  useNavigationState,
+} from "@app/contexts/NavigationContext";
 import { usePageEditor } from "@app/contexts/PageEditorContext";
 import { PageEditorFunctions, PDFPage } from "@app/types/pageEditor";
 // Thumbnail generation is now handled by individual PageThumbnail components
-import '@app/components/pageEditor/PageEditor.module.css';
-import PageThumbnail from '@app/components/pageEditor/PageThumbnail';
-import DragDropGrid from '@app/components/pageEditor/DragDropGrid';
-import SkeletonLoader from '@app/components/shared/SkeletonLoader';
-import NavigationWarningModal from '@app/components/shared/NavigationWarningModal';
+import "@app/components/pageEditor/PageEditor.module.css";
+import PageThumbnail from "@app/components/pageEditor/PageThumbnail";
+import DragDropGrid from "@app/components/pageEditor/DragDropGrid";
+import SkeletonLoader from "@app/components/shared/SkeletonLoader";
 import { FileId } from "@app/types/file";
-import { GRID_CONSTANTS } from '@app/components/pageEditor/constants';
-import { useInitialPageDocument } from '@app/components/pageEditor/hooks/useInitialPageDocument';
-import { usePageDocument } from '@app/components/pageEditor/hooks/usePageDocument';
-import { usePageEditorState } from '@app/components/pageEditor/hooks/usePageEditorState';
+import { GRID_CONSTANTS } from "@app/components/pageEditor/constants";
+import { useInitialPageDocument } from "@app/components/pageEditor/hooks/useInitialPageDocument";
+import { usePageDocument } from "@app/components/pageEditor/hooks/usePageDocument";
+import { usePageEditorState } from "@app/components/pageEditor/hooks/usePageEditorState";
 import { usePageEditorRightRailButtons } from "@app/components/pageEditor/pageEditorRightRailButtons";
 import { useFileColorMap } from "@app/components/pageEditor/hooks/useFileColorMap";
 import { useWheelZoom } from "@app/hooks/useWheelZoom";
@@ -24,22 +26,23 @@ import { usePageSelectionManager } from "@app/components/pageEditor/hooks/usePag
 import { usePageEditorCommands } from "@app/components/pageEditor/hooks/useEditorCommands";
 import { usePageEditorExport } from "@app/components/pageEditor/hooks/usePageEditorExport";
 import { useThumbnailGeneration } from "@app/hooks/useThumbnailGeneration";
-import { convertSplitPageIdsToIndexes } from '@app/components/pageEditor/utils/splitPositions';
+import { convertSplitPageIdsToIndexes } from "@app/components/pageEditor/utils/splitPositions";
 
 export interface PageEditorProps {
   onFunctionsReady?: (functions: PageEditorFunctions) => void;
 }
 
-const PageEditor = ({
-  onFunctionsReady,
-}: PageEditorProps) => {
-
+const PageEditor = ({ onFunctionsReady }: PageEditorProps) => {
   // Use split contexts to prevent re-renders
   const { state, selectors } = useFileState();
   const { actions } = useFileActions();
 
   // Navigation guard for unsaved changes
-  const { setHasUnsavedChanges } = useNavigationGuard();
+  const {
+    setHasUnsavedChanges,
+    registerNavigationWarningHandlers,
+    unregisterNavigationWarningHandlers,
+  } = useNavigationGuard();
   const navigationState = useNavigationState();
 
   // Get PageEditor coordination functions
@@ -57,9 +60,12 @@ const PageEditor = ({
   const thumbnailRequestsRef = useRef<Set<string>>(new Set());
   const { requestThumbnail, getThumbnailFromCache } = useThumbnailGeneration();
   const handleVisibleItemsChange = useCallback((items: PDFPage[]) => {
-    setVisiblePageIds(prev => {
-      const ids = items.map(item => item.id);
-      if (prev.length === ids.length && prev.every((id, index) => id === ids[index])) {
+    setVisiblePageIds((prev) => {
+      const ids = items.map((item) => item.id);
+      if (
+        prev.length === ids.length &&
+        prev.every((id, index) => id === ids[index])
+      ) {
         return prev;
       }
       return ids;
@@ -71,7 +77,7 @@ const PageEditor = ({
   const containerRef = useRef<HTMLDivElement>(null);
   const [isContainerHovered, setIsContainerHovered] = useState(false);
   const rootFontSize = useMemo(() => {
-    if (typeof window === 'undefined') {
+    if (typeof window === "undefined") {
       return 16;
     }
     const computed = getComputedStyle(document.documentElement).fontSize;
@@ -84,50 +90,54 @@ const PageEditor = ({
 
   // Zoom actions
   const zoomIn = useCallback(() => {
-    setZoomLevel(prev => Math.min(prev + 0.1, 3.0));
+    setZoomLevel((prev) => Math.min(prev + 0.1, 3.0));
   }, []);
 
   const zoomOut = useCallback(() => {
-    setZoomLevel(prev => Math.max(prev - 0.1, 0.5));
+    setZoomLevel((prev) => Math.max(prev - 0.1, 0.5));
   }, []);
 
   // Derive page editor files from PageEditorContext's fileOrder (page editor workspace order)
   // Filter to only show PDF files (PageEditor only supports PDFs)
   // Use stable string keys to prevent infinite loops
   // Cache file objects to prevent infinite re-renders from new object references
-  const fileOrderKey = fileOrder.join(',');
-  const selectedIdsKey = [...state.ui.selectedFileIds].sort().join(',');
+  const fileOrderKey = fileOrder.join(",");
+  const selectedIdsKey = [...state.ui.selectedFileIds].sort().join(",");
   const filesSignature = selectors.getFilesSignature();
 
   const fileObjectsRef = useRef(new Map<FileId, any>());
-  const gridItemRefsRef = useRef<React.MutableRefObject<Map<string, HTMLDivElement>> | null>(null);
+  const gridItemRefsRef = useRef<React.MutableRefObject<
+    Map<string, HTMLDivElement>
+  > | null>(null);
 
   const pageEditorFiles = useMemo(() => {
     const cache = fileObjectsRef.current;
     const newFiles: any[] = [];
 
-    fileOrder.forEach(fileId => {
+    fileOrder.forEach((fileId) => {
       const stub = selectors.getStirlingFileStub(fileId);
       const isSelected = state.ui.selectedFileIds.includes(fileId);
-      const isPdf = stub?.name?.toLowerCase().endsWith('.pdf') ?? false;
+      const isPdf = stub?.name?.toLowerCase().endsWith(".pdf") ?? false;
 
       if (!isPdf) return; // Skip non-PDFs
 
       const cached = cache.get(fileId);
 
       // Check if data actually changed (compare by fileId, not position)
-      if (cached &&
-          cached.fileId === fileId &&
-          cached.name === (stub?.name || '') &&
-          cached.versionNumber === stub?.versionNumber &&
-          cached.isSelected === isSelected) {
+      if (
+        cached &&
+        cached.fileId === fileId &&
+        cached.name === (stub?.name || "") &&
+        cached.versionNumber === stub?.versionNumber &&
+        cached.isSelected === isSelected
+      ) {
         // Reuse existing object reference
         newFiles.push(cached);
       } else {
         // Create new object only if data changed
         const newFile = {
           fileId,
-          name: stub?.name || '',
+          name: stub?.name || "",
           versionNumber: stub?.versionNumber,
           isSelected,
         };
@@ -137,7 +147,7 @@ const PageEditor = ({
     });
 
     // Clean up removed files from cache
-    const activeIds = new Set(newFiles.map(f => f.fileId));
+    const activeIds = new Set(newFiles.map((f) => f.fileId));
     for (const cachedId of cache.keys()) {
       if (!activeIds.has(cachedId)) {
         cache.delete(cachedId);
@@ -149,12 +159,12 @@ const PageEditor = ({
 
   // Get ALL file IDs in order (not filtered by selection)
   const orderedFileIds = useMemo(() => {
-    return pageEditorFiles.map(f => f.fileId);
+    return pageEditorFiles.map((f) => f.fileId);
   }, [pageEditorFiles]);
 
   // Get selected file IDs for filtering
   const selectedFileIds = useMemo(() => {
-    return pageEditorFiles.filter(f => f.isSelected).map(f => f.fileId);
+    return pageEditorFiles.filter((f) => f.isSelected).map((f) => f.fileId);
   }, [pageEditorFiles]);
   const activeFilesSignature = selectors.getFilesSignature();
 
@@ -164,102 +174,112 @@ const PageEditor = ({
   const initialDocument = useInitialPageDocument();
   const { document: mergedPdfDocument } = usePageDocument();
 
-  const { setEditedDocument, displayDocument, getEditedDocument } = useEditedDocumentState({
-    initialDocument,
-    mergedPdfDocument,
-    reorderedPages,
-    clearReorderedPages,
-    fileOrder,
-    updateCurrentPages,
-  });
+  const { setEditedDocument, displayDocument, getEditedDocument } =
+    useEditedDocumentState({
+      initialDocument,
+      mergedPdfDocument,
+      reorderedPages,
+      clearReorderedPages,
+      fileOrder,
+      updateCurrentPages,
+    });
 
   const displayDocumentRef = useRef(displayDocument);
   useEffect(() => {
     displayDocumentRef.current = displayDocument;
   }, [displayDocument]);
 
-  const queueThumbnailRequestsForPages = useCallback((pageIds: string[]) => {
-    const doc = displayDocumentRef.current;
-    if (!doc || pageIds.length === 0) return;
+  const queueThumbnailRequestsForPages = useCallback(
+    (pageIds: string[]) => {
+      const doc = displayDocumentRef.current;
+      if (!doc || pageIds.length === 0) return;
 
-    const loadedCount = doc.pages.filter(p => p.thumbnail).length;
-    const pending = thumbnailRequestsRef.current.size;
-    const MAX_CONCURRENT_THUMBNAILS = loadedCount < 8 ? 1
-      : doc.totalPages < 20 ? 3
-      : doc.totalPages < 50 ? 5
-      : 8;
-    const available = Math.max(0, MAX_CONCURRENT_THUMBNAILS - pending);
-    if (available === 0) return;
+      const loadedCount = doc.pages.filter((p) => p.thumbnail).length;
+      const pending = thumbnailRequestsRef.current.size;
+      const MAX_CONCURRENT_THUMBNAILS =
+        loadedCount < 8
+          ? 1
+          : doc.totalPages < 20
+            ? 3
+            : doc.totalPages < 50
+              ? 5
+              : 8;
+      const available = Math.max(0, MAX_CONCURRENT_THUMBNAILS - pending);
+      if (available === 0) return;
 
-    const toLoad: string[] = [];
-    for (const pageId of pageIds) {
-      if (toLoad.length >= available) break;
-      if (thumbnailRequestsRef.current.has(pageId)) continue;
-      const page = doc.pages.find(p => p.id === pageId);
-      if (!page || page.thumbnail) continue;
-      toLoad.push(pageId);
-    }
+      const toLoad: string[] = [];
+      for (const pageId of pageIds) {
+        if (toLoad.length >= available) break;
+        if (thumbnailRequestsRef.current.has(pageId)) continue;
+        const page = doc.pages.find((p) => p.id === pageId);
+        if (!page || page.thumbnail) continue;
+        toLoad.push(pageId);
+      }
 
-    if (toLoad.length === 0) return;
+      if (toLoad.length === 0) return;
 
-    toLoad.forEach(pageId => {
-      const page = doc.pages.find(p => p.id === pageId);
-      if (!page) return;
+      toLoad.forEach((pageId) => {
+        const page = doc.pages.find((p) => p.id === pageId);
+        if (!page) return;
 
-      const cached = getThumbnailFromCache(pageId);
-      if (cached) {
-        thumbnailRequestsRef.current.add(pageId);
-        Promise.resolve(cached)
-          .then(cache => {
-            setEditedDocument(prev => {
-              if (!prev) return prev;
-              const pageIndex = prev.pages.findIndex(p => p.id === pageId);
-              if (pageIndex === -1) return prev;
+        const cached = getThumbnailFromCache(pageId);
+        if (cached) {
+          thumbnailRequestsRef.current.add(pageId);
+          Promise.resolve(cached)
+            .then((cache) => {
+              setEditedDocument((prev) => {
+                if (!prev) return prev;
+                const pageIndex = prev.pages.findIndex((p) => p.id === pageId);
+                if (pageIndex === -1) return prev;
 
-              const updated = [...prev.pages];
-              updated[pageIndex] = { ...prev.pages[pageIndex], thumbnail: cache };
-              return { ...prev, pages: updated };
+                const updated = [...prev.pages];
+                updated[pageIndex] = {
+                  ...prev.pages[pageIndex],
+                  thumbnail: cache,
+                };
+                return { ...prev, pages: updated };
+              });
+            })
+            .finally(() => {
+              thumbnailRequestsRef.current.delete(pageId);
             });
+          return;
+        }
+
+        const fileId = page.originalFileId;
+        if (!fileId) return;
+        const file = selectors.getFile(fileId);
+        if (!file) return;
+
+        thumbnailRequestsRef.current.add(pageId);
+        requestThumbnail(
+          pageId,
+          file,
+          page.originalPageNumber || page.pageNumber,
+        )
+          .then((thumbnail) => {
+            if (thumbnail) {
+              setEditedDocument((prev) => {
+                if (!prev) return prev;
+                const pageIndex = prev.pages.findIndex((p) => p.id === pageId);
+                if (pageIndex === -1) return prev;
+
+                const updated = [...prev.pages];
+                updated[pageIndex] = { ...prev.pages[pageIndex], thumbnail };
+                return { ...prev, pages: updated };
+              });
+            }
+          })
+          .catch((error) => {
+            console.error("[Thumbnail Loading] Error:", error);
           })
           .finally(() => {
             thumbnailRequestsRef.current.delete(pageId);
           });
-        return;
-      }
-
-      const fileId = page.originalFileId;
-      if (!fileId) return;
-      const file = selectors.getFile(fileId);
-      if (!file) return;
-
-      thumbnailRequestsRef.current.add(pageId);
-      requestThumbnail(pageId, file, page.originalPageNumber || page.pageNumber)
-        .then(thumbnail => {
-          if (thumbnail) {
-            setEditedDocument(prev => {
-              if (!prev) return prev;
-              const pageIndex = prev.pages.findIndex(p => p.id === pageId);
-              if (pageIndex === -1) return prev;
-
-              const updated = [...prev.pages];
-              updated[pageIndex] = { ...prev.pages[pageIndex], thumbnail };
-              return { ...prev, pages: updated };
-            });
-          }
-        })
-        .catch((error) => {
-          console.error('[Thumbnail Loading] Error:', error);
-        })
-        .finally(() => {
-          thumbnailRequestsRef.current.delete(pageId);
-        });
-    });
-  }, [
-    getThumbnailFromCache,
-    requestThumbnail,
-    selectors,
-    setEditedDocument
-  ]);
+      });
+    },
+    [getThumbnailFromCache, requestThumbnail, selectors, setEditedDocument],
+  );
 
   useEffect(() => {
     if (!displayDocument) {
@@ -285,11 +305,15 @@ const PageEditor = ({
     const INITIAL_VISIBLE_PAGE_COUNT = 8;
     const initialIds = displayDocument.pages
       .slice(0, INITIAL_VISIBLE_PAGE_COUNT)
-      .map(page => page.id);
+      .map((page) => page.id);
 
     queueThumbnailRequestsForPages(initialIds);
     lastInitialDocumentSignatureRef.current = signature;
-  }, [displayDocumentId, displayDocumentLength, queueThumbnailRequestsForPages]);
+  }, [
+    displayDocumentId,
+    displayDocumentLength,
+    queueThumbnailRequestsForPages,
+  ]);
 
   useEffect(() => {
     setVisiblePageIds([]);
@@ -297,13 +321,13 @@ const PageEditor = ({
 
   useEffect(() => {
     return () => {
-      if (navigationState.workbench !== 'pageEditor') {
+      if (navigationState.workbench !== "pageEditor") {
         return;
       }
 
       const doc = displayDocumentRef.current;
       if (doc && doc.pages.length > 0) {
-        const signature = doc.pages.map(page => page.id).join(',');
+        const signature = doc.pages.map((page) => page.id).join(",");
         savePersistedDocument(doc, signature);
       }
     };
@@ -311,9 +335,20 @@ const PageEditor = ({
 
   // UI state management
   const {
-    selectionMode, selectedPageIds, movingPage, isAnimating, splitPositions, exportLoading,
-    setSelectionMode, setSelectedPageIds, setMovingPage, setSplitPositions, setExportLoading,
-    togglePage, toggleSelectAll, animateReorder
+    selectionMode,
+    selectedPageIds,
+    movingPage,
+    isAnimating,
+    splitPositions,
+    exportLoading,
+    setSelectionMode,
+    setSelectedPageIds,
+    setMovingPage,
+    setSplitPositions,
+    setExportLoading,
+    togglePage,
+    toggleSelectAll,
+    animateReorder,
   } = usePageEditorState();
 
   const {
@@ -344,7 +379,9 @@ const PageEditor = ({
     handleUndo,
     handleRedo,
     clearUndoHistory,
-  } = useUndoManagerState({ setHasUnsavedChanges });
+  } = useUndoManagerState({
+    setHasUnsavedChanges,
+  });
 
   const {
     createRotateCommand,
@@ -393,6 +430,24 @@ const PageEditor = ({
     updateCurrentPages,
   });
 
+  // Register navigation warning handlers for the global modal
+  useEffect(() => {
+    registerNavigationWarningHandlers({
+      onApplyAndContinue: async () => {
+        await applyChanges();
+      },
+      onExportAndContinue: async () => {
+        await onExportAll();
+      },
+    });
+    return () => unregisterNavigationWarningHandlers();
+  }, [
+    applyChanges,
+    onExportAll,
+    registerNavigationWarningHandlers,
+    unregisterNavigationWarningHandlers,
+  ]);
+
   // Derived values for right rail and usePageEditorRightRailButtons (must be after displayDocument)
   const selectedPageCount = selectedPageIds.length;
   const activeFileIds = selectedFileIds;
@@ -416,17 +471,20 @@ const PageEditor = ({
   });
 
   // Export preview function - defined after export functions to avoid circular dependency
-  const handleExportPreview = useCallback((selectedOnly: boolean = false) => {
-    if (!displayDocument) return;
+  const handleExportPreview = useCallback(
+    (selectedOnly: boolean = false) => {
+      if (!displayDocument) return;
 
-    // For now, trigger the actual export directly
-   // In the original, this would show a preview modal first
-    if (selectedOnly) {
-      onExportSelected();
-    } else {
-      onExportAll();
-    }
-  }, [displayDocument, onExportSelected, onExportAll]);
+      // For now, trigger the actual export directly
+      // In the original, this would show a preview modal first
+      if (selectedOnly) {
+        onExportSelected();
+      } else {
+        onExportAll();
+      }
+    },
+    [displayDocument, onExportSelected, onExportAll],
+  );
 
   // Expose functions to parent component
   useEffect(() => {
@@ -459,9 +517,30 @@ const PageEditor = ({
       });
     }
   }, [
-    onFunctionsReady, handleUndo, handleRedo, canUndo, canRedo, handleRotate, handleDelete, handleSplit, handleSplitAll,
-    handlePageBreak, handlePageBreakAll, handleSelectAll, handleDeselectAll, handleSetSelectedPages, handleExportPreview, onExportSelected, onExportAll, applyChanges, exportLoading,
-    selectionMode, selectedPageIds, splitPositions, displayDocument?.pages.length, closePdf
+    onFunctionsReady,
+    handleUndo,
+    handleRedo,
+    canUndo,
+    canRedo,
+    handleRotate,
+    handleDelete,
+    handleSplit,
+    handleSplitAll,
+    handlePageBreak,
+    handlePageBreakAll,
+    handleSelectAll,
+    handleDeselectAll,
+    handleSetSelectedPages,
+    handleExportPreview,
+    onExportSelected,
+    onExportAll,
+    applyChanges,
+    exportLoading,
+    selectionMode,
+    selectedPageIds,
+    splitPositions,
+    displayDocument?.pages.length,
+    closePdf,
   ]);
 
   useWheelZoom({
@@ -478,15 +557,15 @@ const PageEditor = ({
 
       // Check if Ctrl (Windows/Linux) or Cmd (Mac) is pressed
       if (event.ctrlKey || event.metaKey) {
-        if (event.key === '=' || event.key === '+') {
+        if (event.key === "=" || event.key === "+") {
           // Ctrl+= or Ctrl++ for zoom in
           event.preventDefault();
           zoomIn();
-        } else if (event.key === '-' || event.key === '_') {
+        } else if (event.key === "-" || event.key === "_") {
           // Ctrl+- for zoom out
           event.preventDefault();
           zoomOut();
-        } else if (event.key === '0') {
+        } else if (event.key === "0") {
           // Ctrl+0 for reset zoom
           event.preventDefault();
           setZoomLevel(1.0);
@@ -494,9 +573,9 @@ const PageEditor = ({
       }
     };
 
-    document.addEventListener('keydown', handleKeyDown);
+    document.addEventListener("keydown", handleKeyDown);
     return () => {
-      document.removeEventListener('keydown', handleKeyDown);
+      document.removeEventListener("keydown", handleKeyDown);
     };
   }, [isContainerHovered, zoomIn, zoomOut]);
 
@@ -508,75 +587,80 @@ const PageEditor = ({
 
   // Memoize renderItem to prevent DragDropGrid's React.memo from blocking updates
   // when selectedPageIds changes
-  const renderItemCallback = useCallback((
-    page: PDFPage,
-    index: number,
-    refs: React.MutableRefObject<Map<string, HTMLDivElement>>,
-    boxSelectedIds: string[],
-    clearBoxSelection: () => void,
-    activeDragIds: string[],
-    justMoved: boolean,
-    dragHandleProps?: any,
-    zoomLevelParam?: number
-  ) => {
-    gridItemRefsRef.current = refs;
-    const fileColorIndex = page.originalFileId ? fileColorIndexMap.get(page.originalFileId) ?? 0 : 0;
-    const isBoxSelected = boxSelectedIds.includes(page.id);
-    return (
-      <PageThumbnail
-        key={page.id}
-        page={page}
-        index={index}
-        totalPages={displayDocument?.pages.length || 0}
-        fileColorIndex={fileColorIndex}
-        selectedPageIds={selectedPageIds}
-        selectionMode={selectionMode}
-        movingPage={movingPage}
-        isAnimating={isAnimating}
-        isBoxSelected={isBoxSelected}
-        clearBoxSelection={clearBoxSelection}
-        activeDragIds={activeDragIds}
-        justMoved={justMoved}
-        pageRefs={refs}
-        dragHandleProps={dragHandleProps}
-        onReorderPages={handleReorderPages}
-        onTogglePage={togglePage}
-        onAnimateReorder={animateReorder}
-        onExecuteCommand={executeCommand}
-        onSetStatus={() => {}}
-        onSetMovingPage={setMovingPage}
-        onDeletePage={handleDeletePage}
-        createRotateCommand={createRotateCommand}
-        createDeleteCommand={createDeleteCommand}
-        createSplitCommand={createSplitCommand}
-        pdfDocument={displayDocument!}
-        setPdfDocument={setEditedDocument}
-        splitPositions={splitPositions}
-        onInsertFiles={handleInsertFiles}
-        zoomLevel={zoomLevelParam || zoomLevel}
-      />
-    );
-  }, [
-    selectedPageIds,
-    selectionMode,
-    movingPage,
-    isAnimating,
-    displayDocument,
-    fileColorIndexMap,
-    handleReorderPages,
-    togglePage,
-    animateReorder,
-    executeCommand,
-    setMovingPage,
-    handleDeletePage,
-    createRotateCommand,
-    createDeleteCommand,
-    createSplitCommand,
-    setEditedDocument,
-    splitPositions,
-    handleInsertFiles,
-    zoomLevel,
-  ]);
+  const renderItemCallback = useCallback(
+    (
+      page: PDFPage,
+      index: number,
+      refs: React.MutableRefObject<Map<string, HTMLDivElement>>,
+      boxSelectedIds: string[],
+      clearBoxSelection: () => void,
+      activeDragIds: string[],
+      justMoved: boolean,
+      dragHandleProps?: any,
+      zoomLevelParam?: number,
+    ) => {
+      gridItemRefsRef.current = refs;
+      const fileColorIndex = page.originalFileId
+        ? (fileColorIndexMap.get(page.originalFileId) ?? 0)
+        : 0;
+      const isBoxSelected = boxSelectedIds.includes(page.id);
+      return (
+        <PageThumbnail
+          key={page.id}
+          page={page}
+          index={index}
+          totalPages={displayDocument?.pages.length || 0}
+          fileColorIndex={fileColorIndex}
+          selectedPageIds={selectedPageIds}
+          selectionMode={selectionMode}
+          movingPage={movingPage}
+          isAnimating={isAnimating}
+          isBoxSelected={isBoxSelected}
+          clearBoxSelection={clearBoxSelection}
+          activeDragIds={activeDragIds}
+          justMoved={justMoved}
+          pageRefs={refs}
+          dragHandleProps={dragHandleProps}
+          onReorderPages={handleReorderPages}
+          onTogglePage={togglePage}
+          onAnimateReorder={animateReorder}
+          onExecuteCommand={executeCommand}
+          onSetStatus={() => {}}
+          onSetMovingPage={setMovingPage}
+          onDeletePage={handleDeletePage}
+          createRotateCommand={createRotateCommand}
+          createDeleteCommand={createDeleteCommand}
+          createSplitCommand={createSplitCommand}
+          pdfDocument={displayDocument!}
+          setPdfDocument={setEditedDocument}
+          splitPositions={splitPositions}
+          onInsertFiles={handleInsertFiles}
+          zoomLevel={zoomLevelParam || zoomLevel}
+        />
+      );
+    },
+    [
+      selectedPageIds,
+      selectionMode,
+      movingPage,
+      isAnimating,
+      displayDocument,
+      fileColorIndexMap,
+      handleReorderPages,
+      togglePage,
+      animateReorder,
+      executeCommand,
+      setMovingPage,
+      handleDeletePage,
+      createRotateCommand,
+      createDeleteCommand,
+      createSplitCommand,
+      setEditedDocument,
+      splitPositions,
+      handleInsertFiles,
+      zoomLevel,
+    ],
+  );
 
   return (
     <div
@@ -585,23 +669,29 @@ const PageEditor = ({
       onMouseEnter={() => setIsContainerHovered(true)}
       onMouseLeave={() => setIsContainerHovered(false)}
       style={{
-        height: '100%',
-        overflow: 'auto',
-        position: 'relative',
-        width: '100%',
+        height: "100%",
+        overflow: "auto",
+        position: "relative",
+        width: "100%",
       }}
     >
       <LoadingOverlay visible={globalProcessing && !initialDocument} />
 
-      {!initialDocument && !globalProcessing && selectedFileIds.length === 0 && (
-        <Center h='100%'>
-          <Stack align="center" gap="md">
-            <Text size="lg" c="dimmed">📄</Text>
-            <Text c="dimmed">No PDF files loaded</Text>
-            <Text size="sm" c="dimmed">Add files to start editing pages</Text>
-          </Stack>
-        </Center>
-      )}
+      {!initialDocument &&
+        !globalProcessing &&
+        selectedFileIds.length === 0 && (
+          <Center h="100%">
+            <Stack align="center" gap="md">
+              <Text size="lg" c="dimmed">
+                📄
+              </Text>
+              <Text c="dimmed">No PDF files loaded</Text>
+              <Text size="sm" c="dimmed">
+                Add files to start editing pages
+              </Text>
+            </Stack>
+          </Center>
+        )}
 
       {!initialDocument && globalProcessing && (
         <Box p={0}>
@@ -611,19 +701,25 @@ const PageEditor = ({
       )}
 
       {displayDocument && (
-        <Box ref={gridContainerRef} p={0} pt="2rem" pb="4rem" style={{ position: 'relative' }}>
-            {/* Split Lines Overlay */}
-            <div
-              style={{
-                position: 'absolute',
-                top: 0,
-                left: 0,
-                right: 0,
-                bottom: 0,
-                pointerEvents: 'none',
-                zIndex: 10
-              }}
-            >
+        <Box
+          ref={gridContainerRef}
+          p={0}
+          pt="2rem"
+          pb="4rem"
+          style={{ position: "relative" }}
+        >
+          {/* Split Lines Overlay */}
+          <div
+            style={{
+              position: "absolute",
+              top: 0,
+              left: 0,
+              right: 0,
+              bottom: 0,
+              pointerEvents: "none",
+              zIndex: 10,
+            }}
+          >
             {(() => {
               const refsMap = gridItemRefsRef.current?.current;
               const containerEl = gridContainerRef.current;
@@ -632,7 +728,10 @@ const PageEditor = ({
               }
 
               const containerRect = containerEl.getBoundingClientRect();
-              const splitIndexes = convertSplitPageIdsToIndexes(displayDocument, splitPositions);
+              const splitIndexes = convertSplitPageIdsToIndexes(
+                displayDocument,
+                splitPositions,
+              );
 
               return Array.from(splitIndexes).map((position) => {
                 const currentPage = displayedPages[position];
@@ -653,7 +752,9 @@ const PageEditor = ({
                   const nextEl = refsMap.get(nextPage.id);
                   if (nextEl) {
                     const nextRect = nextEl.getBoundingClientRect();
-                    const sameRow = Math.abs(nextRect.top - currentRect.top) < currentRect.height / 2;
+                    const sameRow =
+                      Math.abs(nextRect.top - currentRect.top) <
+                      currentRect.height / 2;
                     if (sameRow) {
                       lineLeft = (currentRect.right + nextRect.left) / 2;
                     } else {
@@ -670,12 +771,12 @@ const PageEditor = ({
                   <div
                     key={`split-${position}`}
                     style={{
-                      position: 'absolute',
+                      position: "absolute",
                       left: `${lineLeft - containerRect.left}px`,
                       top: `${currentRect.top - containerRect.top}px`,
-                      width: '1px',
+                      width: "1px",
                       height: `${currentRect.height}px`,
-                      borderLeft: '1px dashed #3b82f6',
+                      borderLeft: "1px dashed #3b82f6",
                     }}
                   />
                 );
@@ -692,26 +793,17 @@ const PageEditor = ({
             selectedPageIds={selectedPageIds}
             onVisibleItemsChange={handleVisibleItemsChange}
             getThumbnailData={(pageId) => {
-              const page = displayDocument.pages.find(p => p.id === pageId);
+              const page = displayDocument.pages.find((p) => p.id === pageId);
               if (!page?.thumbnail) return null;
               return {
                 src: page.thumbnail,
-                rotation: page.rotation || 0
+                rotation: page.rotation || 0,
               };
             }}
             renderItem={renderItemCallback}
           />
         </Box>
       )}
-
-      <NavigationWarningModal
-        onApplyAndContinue={async () => {
-          await applyChanges();
-        }}
-        onExportAndContinue={async () => {
-          await onExportAll();
-        }}
-      />
     </div>
   );
 };
diff --git a/frontend/src/core/components/pageEditor/PageEditorControls.tsx b/frontend/src/core/components/pageEditor/PageEditorControls.tsx
index 8649076d4c..7fba942688 100644
--- a/frontend/src/core/components/pageEditor/PageEditorControls.tsx
+++ b/frontend/src/core/components/pageEditor/PageEditorControls.tsx
@@ -1,7 +1,4 @@
-import {
-  Tooltip,
-  ActionIcon,
-} from "@mantine/core";
+import { Tooltip, ActionIcon } from "@mantine/core";
 import UndoIcon from "@mui/icons-material/Undo";
 import RedoIcon from "@mui/icons-material/Redo";
 import ContentCutIcon from "@mui/icons-material/ContentCut";
@@ -21,7 +18,7 @@ interface PageEditorControlsProps {
   canRedo: boolean;
 
   // Page operations
-  onRotate: (direction: 'left' | 'right') => void;
+  onRotate: (direction: "left" | "right") => void;
   onDelete: () => void;
   onSplit: () => void;
   onSplitAll: () => void;
@@ -63,14 +60,19 @@ const PageEditorControls = ({
 
     const totalPages = displayDocument.pages.length;
     const selectedValidPageIds = displayDocument.pages
-      .filter((page, index) => selectedPageIds.includes(page.id) && index < totalPages - 1)
-      .map(page => page.id);
+      .filter(
+        (page, index) =>
+          selectedPageIds.includes(page.id) && index < totalPages - 1,
+      )
+      .map((page) => page.id);
 
     if (selectedValidPageIds.length === 0) {
       return "Split Selected";
     }
 
-    const existingSplitsCount = selectedValidPageIds.filter(id => splitPositions.has(id)).length;
+    const existingSplitsCount = selectedValidPageIds.filter((id) =>
+      splitPositions.has(id),
+    ).length;
     const noSplitsCount = selectedValidPageIds.length - existingSplitsCount;
 
     const willRemoveSplits = existingSplitsCount > noSplitsCount;
@@ -89,68 +91,101 @@ const PageEditorControls = ({
   // Calculate page break tooltip text
   const getPageBreakTooltip = () => {
     return selectedPageIds.length > 0
-      ? `Insert ${selectedPageIds.length} Page Break${selectedPageIds.length > 1 ? 's' : ''}`
+      ? `Insert ${selectedPageIds.length} Page Break${selectedPageIds.length > 1 ? "s" : ""}`
       : "Insert Page Breaks";
   };
 
   return (
     <div
       style={{
-        position: 'sticky',
+        position: "sticky",
         left: 0,
         right: 0,
         bottom: 0,
         zIndex: 50,
-        display: 'flex',
-        justifyContent: 'center',
-        pointerEvents: 'none',
-        background: 'transparent',
+        display: "flex",
+        justifyContent: "center",
+        pointerEvents: "none",
+        background: "transparent",
       }}
     >
       <div
         style={{
-          display: 'flex',
-          alignItems: 'center',
+          display: "flex",
+          alignItems: "center",
           gap: 12,
           borderTopLeftRadius: 16,
           borderTopRightRadius: 16,
           borderBottomLeftRadius: 0,
           borderBottomRightRadius: 0,
-          boxShadow: '0 -2px 8px rgba(0,0,0,0.04)',
-          backgroundColor: 'var(--bg-toolbar)',
-          border: '1px solid var(--border-default)',
-          borderRadius: '16px 16px 0 0',
-          pointerEvents: 'auto',
+          boxShadow: "0 -2px 8px rgba(0,0,0,0.04)",
+          backgroundColor: "var(--bg-toolbar)",
+          border: "1px solid var(--border-default)",
+          borderRadius: "16px 16px 0 0",
+          pointerEvents: "auto",
           minWidth: 360,
           maxWidth: 700,
-          flexWrap: 'wrap',
-          justifyContent: 'center',
+          flexWrap: "wrap",
+          justifyContent: "center",
           padding: "1rem",
-          paddingBottom: "1rem"
+          paddingBottom: "1rem",
         }}
       >
-
         {/* Undo/Redo */}
         <Tooltip label="Undo">
-          <ActionIcon onClick={onUndo} disabled={!canUndo} variant="subtle" style={{ color: canUndo ? 'var(--right-rail-icon)' : 'var(--right-rail-icon-disabled)' }} radius="md" size="lg">
+          <ActionIcon
+            onClick={onUndo}
+            disabled={!canUndo}
+            variant="subtle"
+            style={{
+              color: canUndo
+                ? "var(--right-rail-icon)"
+                : "var(--right-rail-icon-disabled)",
+            }}
+            radius="md"
+            size="lg"
+          >
             <UndoIcon />
           </ActionIcon>
         </Tooltip>
         <Tooltip label="Redo">
-          <ActionIcon onClick={onRedo} disabled={!canRedo} variant="subtle" style={{ color: canRedo ? 'var(--right-rail-icon)' : 'var(--right-rail-icon-disabled)' }} radius="md" size="lg">
+          <ActionIcon
+            onClick={onRedo}
+            disabled={!canRedo}
+            variant="subtle"
+            style={{
+              color: canRedo
+                ? "var(--right-rail-icon)"
+                : "var(--right-rail-icon-disabled)",
+            }}
+            radius="md"
+            size="lg"
+          >
             <RedoIcon />
           </ActionIcon>
         </Tooltip>
 
-        <div style={{ width: 1, height: 28, backgroundColor: 'var(--mantine-color-gray-3)', margin: '0 8px' }} />
+        <div
+          style={{
+            width: 1,
+            height: 28,
+            backgroundColor: "var(--mantine-color-gray-3)",
+            margin: "0 8px",
+          }}
+        />
 
         {/* Page Operations */}
         <Tooltip label="Rotate Selected Left">
           <ActionIcon
-            onClick={() => onRotate('left')}
+            onClick={() => onRotate("left")}
             disabled={selectedPageIds.length === 0}
             variant="subtle"
-            style={{ color: selectedPageIds.length > 0 ? 'var(--right-rail-icon)' : 'var(--right-rail-icon-disabled)' }}
+            style={{
+              color:
+                selectedPageIds.length > 0
+                  ? "var(--right-rail-icon)"
+                  : "var(--right-rail-icon-disabled)",
+            }}
             radius="md"
             size="lg"
           >
@@ -159,10 +194,15 @@ const PageEditorControls = ({
         </Tooltip>
         <Tooltip label="Rotate Selected Right">
           <ActionIcon
-            onClick={() => onRotate('right')}
+            onClick={() => onRotate("right")}
             disabled={selectedPageIds.length === 0}
             variant="subtle"
-            style={{ color: selectedPageIds.length > 0 ? 'var(--right-rail-icon)' : 'var(--right-rail-icon-disabled)' }}
+            style={{
+              color:
+                selectedPageIds.length > 0
+                  ? "var(--right-rail-icon)"
+                  : "var(--right-rail-icon-disabled)",
+            }}
             radius="md"
             size="lg"
           >
@@ -174,7 +214,12 @@ const PageEditorControls = ({
             onClick={onDelete}
             disabled={selectedPageIds.length === 0}
             variant="subtle"
-            style={{ color: selectedPageIds.length > 0 ? 'var(--right-rail-icon)' : 'var(--right-rail-icon-disabled)' }}
+            style={{
+              color:
+                selectedPageIds.length > 0
+                  ? "var(--right-rail-icon)"
+                  : "var(--right-rail-icon-disabled)",
+            }}
             radius="md"
             size="lg"
           >
@@ -186,7 +231,12 @@ const PageEditorControls = ({
             onClick={onSplit}
             disabled={selectedPageIds.length === 0}
             variant="subtle"
-            style={{ color: selectedPageIds.length > 0 ? 'var(--right-rail-icon)' : 'var(--right-rail-icon-disabled)' }}
+            style={{
+              color:
+                selectedPageIds.length > 0
+                  ? "var(--right-rail-icon)"
+                  : "var(--right-rail-icon-disabled)",
+            }}
             radius="md"
             size="lg"
           >
@@ -198,7 +248,12 @@ const PageEditorControls = ({
             onClick={onPageBreak}
             disabled={selectedPageIds.length === 0}
             variant="subtle"
-            style={{ color: selectedPageIds.length > 0 ? 'var(--right-rail-icon)' : 'var(--right-rail-icon-disabled)' }}
+            style={{
+              color:
+                selectedPageIds.length > 0
+                  ? "var(--right-rail-icon)"
+                  : "var(--right-rail-icon-disabled)",
+            }}
             radius="md"
             size="lg"
           >
diff --git a/frontend/src/core/components/pageEditor/PageSelectByNumberButton.tsx b/frontend/src/core/components/pageEditor/PageSelectByNumberButton.tsx
index 896da57809..1b35bed994 100644
--- a/frontend/src/core/components/pageEditor/PageSelectByNumberButton.tsx
+++ b/frontend/src/core/components/pageEditor/PageSelectByNumberButton.tsx
@@ -1,7 +1,7 @@
-import { ActionIcon, Popover } from '@mantine/core';
-import LocalIcon from '@app/components/shared/LocalIcon';
-import { Tooltip } from '@app/components/shared/Tooltip';
-import BulkSelectionPanel from '@app/components/pageEditor/BulkSelectionPanel';
+import { ActionIcon, Popover } from "@mantine/core";
+import LocalIcon from "@app/components/shared/LocalIcon";
+import { Tooltip } from "@app/components/shared/Tooltip";
+import BulkSelectionPanel from "@app/components/pageEditor/BulkSelectionPanel";
 
 interface PageSelectByNumberButtonProps {
   disabled: boolean;
@@ -25,11 +25,17 @@ export default function PageSelectByNumberButton({
   updatePagesFromCSV,
 }: PageSelectByNumberButtonProps) {
   return (
-    <Tooltip content={label} position="left" offset={12} arrow portalTarget={document.body}>
+    <Tooltip
+      content={label}
+      position="left"
+      offset={12}
+      arrow
+      portalTarget={document.body}
+    >
       <div className={`right-rail-fade enter`}>
         <Popover position="left" withArrow shadow="md" offset={8}>
           <Popover.Target>
-            <div style={{ display: 'inline-flex' }}>
+            <div style={{ display: "inline-flex" }}>
               <ActionIcon
                 variant="subtle"
                 radius="md"
@@ -42,7 +48,7 @@ export default function PageSelectByNumberButton({
             </div>
           </Popover.Target>
           <Popover.Dropdown>
-            <div style={{ minWidth: '24rem', maxWidth: '32rem' }}>
+            <div style={{ minWidth: "24rem", maxWidth: "32rem" }}>
               <BulkSelectionPanel
                 csvInput={csvInput}
                 setCsvInput={setCsvInput}
diff --git a/frontend/src/core/components/pageEditor/PageThumbnail.tsx b/frontend/src/core/components/pageEditor/PageThumbnail.tsx
index 87adbf90e4..189bdac01c 100644
--- a/frontend/src/core/components/pageEditor/PageThumbnail.tsx
+++ b/frontend/src/core/components/pageEditor/PageThumbnail.tsx
@@ -1,21 +1,28 @@
-import React, { useCallback, useState, useEffect, useRef, useMemo } from 'react';
-import { Text, Checkbox } from '@mantine/core';
-import { useIsMobile } from '@app/hooks/useIsMobile';
-import ArrowBackIcon from '@mui/icons-material/ArrowBack';
-import ArrowForwardIcon from '@mui/icons-material/ArrowForward';
-import RotateLeftIcon from '@mui/icons-material/RotateLeft';
-import RotateRightIcon from '@mui/icons-material/RotateRight';
-import DeleteIcon from '@mui/icons-material/Delete';
-import ContentCutIcon from '@mui/icons-material/ContentCut';
-import AddIcon from '@mui/icons-material/Add';
-import { PDFPage, PDFDocument } from '@app/types/pageEditor';
-import { useFilesModalContext } from '@app/contexts/FilesModalContext';
-import { getFileColorWithOpacity } from '@app/components/pageEditor/fileColors';
-import styles from '@app/components/pageEditor/PageEditor.module.css';
-import HoverActionMenu, { HoverAction } from '@app/components/shared/HoverActionMenu';
-import { StirlingFileStub } from '@app/types/fileContext';
-import { PrivateContent } from '@app/components/shared/PrivateContent';
-
+import React, {
+  useCallback,
+  useState,
+  useEffect,
+  useRef,
+  useMemo,
+} from "react";
+import { Text, Checkbox } from "@mantine/core";
+import { useIsMobile } from "@app/hooks/useIsMobile";
+import ArrowBackIcon from "@mui/icons-material/ArrowBack";
+import ArrowForwardIcon from "@mui/icons-material/ArrowForward";
+import RotateLeftIcon from "@mui/icons-material/RotateLeft";
+import RotateRightIcon from "@mui/icons-material/RotateRight";
+import DeleteIcon from "@mui/icons-material/Delete";
+import ContentCutIcon from "@mui/icons-material/ContentCut";
+import AddIcon from "@mui/icons-material/Add";
+import { PDFPage, PDFDocument } from "@app/types/pageEditor";
+import { useFilesModalContext } from "@app/contexts/FilesModalContext";
+import { getFileColorWithOpacity } from "@app/components/pageEditor/fileColors";
+import styles from "@app/components/pageEditor/PageEditor.module.css";
+import HoverActionMenu, {
+  HoverAction,
+} from "@app/components/shared/HoverActionMenu";
+import { StirlingFileStub } from "@app/types/fileContext";
+import { PrivateContent } from "@app/components/shared/PrivateContent";
 
 interface PageThumbnailProps {
   page: PDFPage;
@@ -32,20 +39,34 @@ interface PageThumbnailProps {
   justMoved?: boolean;
   pageRefs: React.MutableRefObject<Map<string, HTMLDivElement>>;
   dragHandleProps?: any;
-  onReorderPages: (sourcePageNumber: number, targetIndex: number, selectedPageIds?: string[]) => void;
+  onReorderPages: (
+    sourcePageNumber: number,
+    targetIndex: number,
+    selectedPageIds?: string[],
+  ) => void;
   onTogglePage: (pageId: string) => void;
   onAnimateReorder: () => void;
   onExecuteCommand: (command: { execute: () => void }) => void;
   onSetStatus: (status: string) => void;
   onSetMovingPage: (page: number | null) => void;
   onDeletePage: (pageNumber: number) => void;
-  createRotateCommand: (pageIds: string[], rotation: number) => { execute: () => void };
+  createRotateCommand: (
+    pageIds: string[],
+    rotation: number,
+  ) => { execute: () => void };
   createDeleteCommand: (pageIds: string[]) => { execute: () => void };
-  createSplitCommand: (pageId: string, pageNumber: number) => { execute: () => void };
+  createSplitCommand: (
+    pageId: string,
+    pageNumber: number,
+  ) => { execute: () => void };
   pdfDocument: PDFDocument;
   setPdfDocument: (doc: PDFDocument) => void;
   splitPositions: Set<string>;
-  onInsertFiles?: (files: File[] | StirlingFileStub[], insertAfterPage: number, isFromStorage?: boolean) => void;
+  onInsertFiles?: (
+    files: File[] | StirlingFileStub[],
+    insertAfterPage: number,
+    isFromStorage?: boolean,
+  ) => void;
   zoomLevel?: number;
 }
 
@@ -78,15 +99,22 @@ const PageThumbnail: React.FC<PageThumbnailProps> = ({
   justMoved = false,
 }: PageThumbnailProps) => {
   const pageIndex = page.pageNumber - 1;
-  const isSelected = Array.isArray(selectedPageIds) ? selectedPageIds.includes(page.id) : false;
+  const isSelected = Array.isArray(selectedPageIds)
+    ? selectedPageIds.includes(page.id)
+    : false;
 
   const [isMouseDown, setIsMouseDown] = useState(false);
-  const [mouseStartPos, setMouseStartPos] = useState<{x: number, y: number} | null>(null);
+  const [mouseStartPos, setMouseStartPos] = useState<{
+    x: number;
+    y: number;
+  } | null>(null);
   const [isHovered, setIsHovered] = useState(false);
   const isMobile = useIsMobile();
   const lastClickTimeRef = useRef<number>(0);
 
-  const [thumbnailUrl, setThumbnailUrl] = useState<string | null>(page.thumbnail);
+  const [thumbnailUrl, setThumbnailUrl] = useState<string | null>(
+    page.thumbnail,
+  );
   const elementRef = useRef<HTMLDivElement | null>(null);
   const { openFilesModal } = useFilesModalContext();
 
@@ -96,13 +124,15 @@ const PageThumbnail: React.FC<PageThumbnailProps> = ({
   // Calculate document aspect ratio from first non-blank page
   const getDocumentAspectRatio = useCallback(() => {
     // Find first non-blank page with a thumbnail to get aspect ratio
-    const firstRealPage = pdfDocument.pages.find(p => !p.isBlankPage && p.thumbnail);
+    const firstRealPage = pdfDocument.pages.find(
+      (p) => !p.isBlankPage && p.thumbnail,
+    );
     if (firstRealPage?.thumbnail) {
       // Try to get aspect ratio from an actual thumbnail image
       // For now, default to A4 but could be enhanced to measure image dimensions
-      return '1 / 1.414'; // A4 ratio as fallback
+      return "1 / 1.414"; // A4 ratio as fallback
     }
-    return '1 / 1.414'; // Default A4 ratio
+    return "1 / 1.414"; // Default A4 ratio
   }, [pdfDocument.pages]);
 
   // Update thumbnail URL when page prop changes
@@ -113,77 +143,116 @@ const PageThumbnail: React.FC<PageThumbnailProps> = ({
   }, [page.thumbnail, thumbnailUrl]);
 
   // Merge refs - combine our ref tracking with dnd-kit's ref
-  const mergedRef = useCallback((element: HTMLDivElement | null) => {
-    // Track in our refs map
-    elementRef.current = element;
-    if (element) {
-      pageRefs.current.set(page.id, element);
-    } else {
-      pageRefs.current.delete(page.id);
-    }
-
-    // Call dnd-kit's ref if provided
-    if (dragHandleProps?.ref) {
-      dragHandleProps.ref(element);
-    }
-  }, [page.id, pageRefs, dragHandleProps]);
+  const mergedRef = useCallback(
+    (element: HTMLDivElement | null) => {
+      // Track in our refs map
+      elementRef.current = element;
+      if (element) {
+        pageRefs.current.set(page.id, element);
+      } else {
+        pageRefs.current.delete(page.id);
+      }
 
+      // Call dnd-kit's ref if provided
+      if (dragHandleProps?.ref) {
+        dragHandleProps.ref(element);
+      }
+    },
+    [page.id, pageRefs, dragHandleProps],
+  );
 
   // DOM command handlers
-  const handleRotateLeft = useCallback((e: React.MouseEvent) => {
-    e.stopPropagation();
-    // Use the command system for undo/redo support
-    const command = createRotateCommand([page.id], -90);
-    onExecuteCommand(command);
-    onSetStatus(`Rotated page ${page.pageNumber} left`);
-  }, [page.id, page.pageNumber, onExecuteCommand, onSetStatus, createRotateCommand]);
+  const handleRotateLeft = useCallback(
+    (e: React.MouseEvent) => {
+      e.stopPropagation();
+      // Use the command system for undo/redo support
+      const command = createRotateCommand([page.id], -90);
+      onExecuteCommand(command);
+      onSetStatus(`Rotated page ${page.pageNumber} left`);
+    },
+    [
+      page.id,
+      page.pageNumber,
+      onExecuteCommand,
+      onSetStatus,
+      createRotateCommand,
+    ],
+  );
 
-  const handleRotateRight = useCallback((e: React.MouseEvent) => {
-    e.stopPropagation();
-    // Use the command system for undo/redo support
-    const command = createRotateCommand([page.id], 90);
-    onExecuteCommand(command);
-    onSetStatus(`Rotated page ${page.pageNumber} right`);
-  }, [page.id, page.pageNumber, onExecuteCommand, onSetStatus, createRotateCommand]);
+  const handleRotateRight = useCallback(
+    (e: React.MouseEvent) => {
+      e.stopPropagation();
+      // Use the command system for undo/redo support
+      const command = createRotateCommand([page.id], 90);
+      onExecuteCommand(command);
+      onSetStatus(`Rotated page ${page.pageNumber} right`);
+    },
+    [
+      page.id,
+      page.pageNumber,
+      onExecuteCommand,
+      onSetStatus,
+      createRotateCommand,
+    ],
+  );
 
-  const handleDelete = useCallback((e: React.MouseEvent) => {
-    e.stopPropagation();
-    onDeletePage(page.pageNumber);
-    onSetStatus(`Deleted page ${page.pageNumber}`);
-  }, [page.pageNumber, onDeletePage, onSetStatus]);
+  const handleDelete = useCallback(
+    (e: React.MouseEvent) => {
+      e.stopPropagation();
+      onDeletePage(page.pageNumber);
+      onSetStatus(`Deleted page ${page.pageNumber}`);
+    },
+    [page.pageNumber, onDeletePage, onSetStatus],
+  );
 
-  const handleSplit = useCallback((e: React.MouseEvent) => {
-    e.stopPropagation();
+  const handleSplit = useCallback(
+    (e: React.MouseEvent) => {
+      e.stopPropagation();
 
-    // Create a command to toggle split at this position
-    const command = createSplitCommand(page.id, page.pageNumber);
-    onExecuteCommand(command);
+      // Create a command to toggle split at this position
+      const command = createSplitCommand(page.id, page.pageNumber);
+      onExecuteCommand(command);
 
-    const hasSplit = splitPositions.has(page.id);
-    const action = hasSplit ? 'removed' : 'added';
-    onSetStatus(`Split marker ${action} after position ${pageIndex + 1}`);
-  }, [pageIndex, splitPositions, onExecuteCommand, onSetStatus, createSplitCommand]);
+      const hasSplit = splitPositions.has(page.id);
+      const action = hasSplit ? "removed" : "added";
+      onSetStatus(`Split marker ${action} after position ${pageIndex + 1}`);
+    },
+    [
+      pageIndex,
+      splitPositions,
+      onExecuteCommand,
+      onSetStatus,
+      createSplitCommand,
+    ],
+  );
 
-  const handleInsertFileAfter = useCallback((e: React.MouseEvent) => {
-    e.stopPropagation();
+  const handleInsertFileAfter = useCallback(
+    (e: React.MouseEvent) => {
+      e.stopPropagation();
 
-    if (onInsertFiles) {
-      // Open file manager modal with custom handler for page insertion
-      openFilesModal({
-        insertAfterPage: page.pageNumber,
-        customHandler: (files: File[] | StirlingFileStub[], insertAfterPage?: number, isFromStorage?: boolean) => {
-          if (insertAfterPage !== undefined) {
-            onInsertFiles(files, insertAfterPage, isFromStorage);
-          }
-        }
-      });
-      onSetStatus(`Select files to insert after page ${page.pageNumber}`);
-    } else {
-      // Fallback to normal file handling
-      openFilesModal({ insertAfterPage: page.pageNumber });
-      onSetStatus(`Select files to insert after page ${page.pageNumber}`);
-    }
-  }, [openFilesModal, page.pageNumber, onSetStatus, onInsertFiles]);
+      if (onInsertFiles) {
+        // Open file manager modal with custom handler for page insertion
+        openFilesModal({
+          insertAfterPage: page.pageNumber,
+          customHandler: (
+            files: File[] | StirlingFileStub[],
+            insertAfterPage?: number,
+            isFromStorage?: boolean,
+          ) => {
+            if (insertAfterPage !== undefined) {
+              onInsertFiles(files, insertAfterPage, isFromStorage);
+            }
+          },
+        });
+        onSetStatus(`Select files to insert after page ${page.pageNumber}`);
+      } else {
+        // Fallback to normal file handling
+        openFilesModal({ insertAfterPage: page.pageNumber });
+        onSetStatus(`Select files to insert after page ${page.pageNumber}`);
+      }
+    },
+    [openFilesModal, page.pageNumber, onSetStatus, onInsertFiles],
+  );
 
   // Handle click vs drag differentiation
   const handleMouseDown = useCallback((e: React.MouseEvent) => {
@@ -191,40 +260,51 @@ const PageThumbnail: React.FC<PageThumbnailProps> = ({
     setMouseStartPos({ x: e.clientX, y: e.clientY });
   }, []);
 
-  const handleMouseUp = useCallback((e: React.MouseEvent) => {
-    if (!isMouseDown || !mouseStartPos) {
-      setIsMouseDown(false);
-      setMouseStartPos(null);
-      return;
-    }
+  const handleMouseUp = useCallback(
+    (e: React.MouseEvent) => {
+      if (!isMouseDown || !mouseStartPos) {
+        setIsMouseDown(false);
+        setMouseStartPos(null);
+        return;
+      }
 
-    // Calculate distance moved
-    const deltaX = Math.abs(e.clientX - mouseStartPos.x);
-    const deltaY = Math.abs(e.clientY - mouseStartPos.y);
-    const distance = Math.sqrt(deltaX * deltaX + deltaY * deltaY);
+      // Calculate distance moved
+      const deltaX = Math.abs(e.clientX - mouseStartPos.x);
+      const deltaY = Math.abs(e.clientY - mouseStartPos.y);
+      const distance = Math.sqrt(deltaX * deltaX + deltaY * deltaY);
 
-    // If mouse moved less than 2 pixels, consider it a click (not a drag)
-    if (distance < 2 && !isDragging) {
-      // Prevent rapid double-clicks from causing issues (debounce with 100ms threshold)
-      const now = Date.now();
-      if (now - lastClickTimeRef.current > 100) {
-        lastClickTimeRef.current = now;
+      // If mouse moved less than 2 pixels, consider it a click (not a drag)
+      if (distance < 2 && !isDragging) {
+        // Prevent rapid double-clicks from causing issues (debounce with 100ms threshold)
+        const now = Date.now();
+        if (now - lastClickTimeRef.current > 100) {
+          lastClickTimeRef.current = now;
 
-        // Clear box selection when clicking on a non-selected page
-        if (!isBoxSelected && clearBoxSelection) {
-          clearBoxSelection();
-        }
+          // Clear box selection when clicking on a non-selected page
+          if (!isBoxSelected && clearBoxSelection) {
+            clearBoxSelection();
+          }
 
-        // Don't toggle page selection if it's box-selected (just keep the box selection)
-        if (!isBoxSelected) {
-          onTogglePage(page.id);
+          // Don't toggle page selection if it's box-selected (just keep the box selection)
+          if (!isBoxSelected) {
+            onTogglePage(page.id);
+          }
         }
       }
-    }
 
-    setIsMouseDown(false);
-    setMouseStartPos(null);
-  }, [isMouseDown, mouseStartPos, isDragging, page.id, isBoxSelected, clearBoxSelection, onTogglePage]);
+      setIsMouseDown(false);
+      setMouseStartPos(null);
+    },
+    [
+      isMouseDown,
+      mouseStartPos,
+      isDragging,
+      page.id,
+      isBoxSelected,
+      clearBoxSelection,
+      onTogglePage,
+    ],
+  );
 
   const handleMouseLeave = useCallback(() => {
     setIsMouseDown(false);
@@ -232,79 +312,98 @@ const PageThumbnail: React.FC<PageThumbnailProps> = ({
     setIsHovered(false);
   }, []);
 
-  const fileColorBorder = page.isBlankPage ? 'transparent' : getFileColorWithOpacity(fileColorIndex, 0.3);
+  const fileColorBorder = page.isBlankPage
+    ? "transparent"
+    : getFileColorWithOpacity(fileColorIndex, 0.3);
 
   // Spread dragHandleProps but use our merged ref
   const { ref: _, ...restDragProps } = dragHandleProps || {};
 
   // Build hover menu actions
-  const hoverActions = useMemo<HoverAction[]>(() => [
-    {
-      id: 'move-left',
-      icon: <ArrowBackIcon style={{ fontSize: 20 }} />,
-      label: 'Move Left',
-      onClick: (e) => {
-        e.stopPropagation();
-        if (pageIndex > 0 && !movingPage && !isAnimating) {
-          onSetMovingPage(page.pageNumber);
-          onReorderPages(page.pageNumber, pageIndex - 1);
-          setTimeout(() => onSetMovingPage(null), 650);
-          onSetStatus(`Moved page ${page.pageNumber} left`);
-        }
+  const hoverActions = useMemo<HoverAction[]>(
+    () => [
+      {
+        id: "move-left",
+        icon: <ArrowBackIcon style={{ fontSize: 20 }} />,
+        label: "Move Left",
+        onClick: (e) => {
+          e.stopPropagation();
+          if (pageIndex > 0 && !movingPage && !isAnimating) {
+            onSetMovingPage(page.pageNumber);
+            onReorderPages(page.pageNumber, pageIndex - 1);
+            setTimeout(() => onSetMovingPage(null), 650);
+            onSetStatus(`Moved page ${page.pageNumber} left`);
+          }
+        },
+        disabled: pageIndex === 0,
       },
-      disabled: pageIndex === 0
-    },
-    {
-      id: 'move-right',
-      icon: <ArrowForwardIcon style={{ fontSize: 20 }} />,
-      label: 'Move Right',
-      onClick: (e) => {
-        e.stopPropagation();
-        if (pageIndex < totalPages - 1 && !movingPage && !isAnimating) {
-          onSetMovingPage(page.pageNumber);
-          // ReorderPagesCommand expects target index relative to the original array.
-          // When moving toward the right (higher index), provide desiredIndex + 1
-          // so the command's internal adjustment (targetIndex - 1) lands correctly.
-          onReorderPages(page.pageNumber, pageIndex + 2);
-          setTimeout(() => onSetMovingPage(null), 650);
-          onSetStatus(`Moved page ${page.pageNumber} right`);
-        }
+      {
+        id: "move-right",
+        icon: <ArrowForwardIcon style={{ fontSize: 20 }} />,
+        label: "Move Right",
+        onClick: (e) => {
+          e.stopPropagation();
+          if (pageIndex < totalPages - 1 && !movingPage && !isAnimating) {
+            onSetMovingPage(page.pageNumber);
+            // ReorderPagesCommand expects target index relative to the original array.
+            // When moving toward the right (higher index), provide desiredIndex + 1
+            // so the command's internal adjustment (targetIndex - 1) lands correctly.
+            onReorderPages(page.pageNumber, pageIndex + 2);
+            setTimeout(() => onSetMovingPage(null), 650);
+            onSetStatus(`Moved page ${page.pageNumber} right`);
+          }
+        },
+        disabled: pageIndex === totalPages - 1,
       },
-      disabled: pageIndex === totalPages - 1
-    },
-    {
-      id: 'rotate-left',
-      icon: <RotateLeftIcon style={{ fontSize: 20 }} />,
-      label: 'Rotate Left',
-      onClick: handleRotateLeft,
-    },
-    {
-      id: 'rotate-right',
-      icon: <RotateRightIcon style={{ fontSize: 20 }} />,
-      label: 'Rotate Right',
-      onClick: handleRotateRight,
-    },
-    {
-      id: 'delete',
-      icon: <DeleteIcon style={{ fontSize: 20 }} />,
-      label: 'Delete Page',
-      onClick: handleDelete,
-      color: 'red',
-    },
-    {
-      id: 'split',
-      icon: <ContentCutIcon style={{ fontSize: 20 }} />,
-      label: 'Split After',
-      onClick: handleSplit,
-      hidden: pageIndex >= totalPages - 1,
-    },
-    {
-      id: 'insert',
-      icon: <AddIcon style={{ fontSize: 20 }} />,
-      label: 'Insert File After',
-      onClick: handleInsertFileAfter,
-    }
-  ], [pageIndex, totalPages, movingPage, isAnimating, page.pageNumber, handleRotateLeft, handleRotateRight, handleDelete, handleSplit, handleInsertFileAfter, onReorderPages, onSetMovingPage, onSetStatus]);
+      {
+        id: "rotate-left",
+        icon: <RotateLeftIcon style={{ fontSize: 20 }} />,
+        label: "Rotate Left",
+        onClick: handleRotateLeft,
+      },
+      {
+        id: "rotate-right",
+        icon: <RotateRightIcon style={{ fontSize: 20 }} />,
+        label: "Rotate Right",
+        onClick: handleRotateRight,
+      },
+      {
+        id: "delete",
+        icon: <DeleteIcon style={{ fontSize: 20 }} />,
+        label: "Delete Page",
+        onClick: handleDelete,
+        color: "red",
+      },
+      {
+        id: "split",
+        icon: <ContentCutIcon style={{ fontSize: 20 }} />,
+        label: "Split After",
+        onClick: handleSplit,
+        hidden: pageIndex >= totalPages - 1,
+      },
+      {
+        id: "insert",
+        icon: <AddIcon style={{ fontSize: 20 }} />,
+        label: "Insert File After",
+        onClick: handleInsertFileAfter,
+      },
+    ],
+    [
+      pageIndex,
+      totalPages,
+      movingPage,
+      isAnimating,
+      page.pageNumber,
+      handleRotateLeft,
+      handleRotateRight,
+      handleDelete,
+      handleSplit,
+      handleInsertFileAfter,
+      onReorderPages,
+      onSetMovingPage,
+      onSetStatus,
+    ],
+  );
 
   return (
     <div
@@ -315,7 +414,7 @@ const PageThumbnail: React.FC<PageThumbnailProps> = ({
       className={`
         ${styles.pageContainer}
         !rounded-lg
-        ${selectionMode ? 'cursor-pointer' : 'cursor-grab'}
+        ${selectionMode ? "cursor-pointer" : "cursor-grab"}
         select-none
         flex items-center justify-center
         flex-shrink-0
@@ -323,17 +422,17 @@ const PageThumbnail: React.FC<PageThumbnailProps> = ({
         hover:shadow-md
         transition-all
         relative
-        ${isDragging ? 'opacity-50 scale-95' : ''}
-        ${movingPage === page.pageNumber ? 'page-moving' : ''}
-        ${isBoxSelected ? 'ring-4 ring-blue-400 ring-offset-2' : ''}
+        ${isDragging ? "opacity-50 scale-95" : ""}
+        ${movingPage === page.pageNumber ? "page-moving" : ""}
+        ${isBoxSelected ? "ring-4 ring-blue-400 ring-offset-2" : ""}
       `}
       style={{
         width: `calc(20rem * ${zoomLevel})`,
         height: `calc(20rem * ${zoomLevel})`,
-        transition: isAnimating ? 'none' : 'transform 0.2s ease-in-out',
+        transition: isAnimating ? "none" : "transform 0.2s ease-in-out",
         zIndex: isHovered ? 50 : 1,
         ...(isBoxSelected && {
-          boxShadow: '0 0 0 4px rgba(59, 130, 246, 0.5)',
+          boxShadow: "0 0 0 4px rgba(59, 130, 246, 0.5)",
         }),
       }}
       onMouseDown={handleMouseDown}
@@ -345,15 +444,15 @@ const PageThumbnail: React.FC<PageThumbnailProps> = ({
         <div
           className={styles.checkboxContainer}
           style={{
-            position: 'absolute',
+            position: "absolute",
             top: 8,
             right: 8,
             zIndex: 10,
-            backgroundColor: 'white',
-            borderRadius: '4px',
-            padding: '2px',
-            boxShadow: '0 2px 4px rgba(0,0,0,0.1)',
-            pointerEvents: 'auto'
+            backgroundColor: "white",
+            borderRadius: "4px",
+            padding: "2px",
+            boxShadow: "0 2px 4px rgba(0,0,0,0.1)",
+            pointerEvents: "auto",
           }}
           onMouseDown={(e) => {
             e.stopPropagation();
@@ -371,41 +470,47 @@ const PageThumbnail: React.FC<PageThumbnailProps> = ({
               // Selection is handled by container mouseDown
             }}
             size="sm"
-            style={{ pointerEvents: 'none' }}
+            style={{ pointerEvents: "none" }}
           />
         </div>
       }
 
       <div className="page-container w-[90%] h-[90%]" draggable={false}>
         <div
-          className={`${styles.pageSurface} ${justMoved ? styles.pageJustMoved : ''}`}
+          className={`${styles.pageSurface} ${justMoved ? styles.pageJustMoved : ""}`}
           style={{
-            width: '100%',
-            height: '100%',
-            backgroundColor: 'var(--mantine-color-gray-1)',
+            width: "100%",
+            height: "100%",
+            backgroundColor: "var(--mantine-color-gray-1)",
             borderRadius: 6,
-            boxShadow: page.isBlankPage ? 'none' : `0 0 ${4 + 4 * zoomLevel}px 3px ${fileColorBorder}`,
+            boxShadow: page.isBlankPage
+              ? "none"
+              : `0 0 ${4 + 4 * zoomLevel}px 3px ${fileColorBorder}`,
             padding: 4,
-            display: 'flex',
-            alignItems: 'center',
-            justifyContent: 'center'
+            display: "flex",
+            alignItems: "center",
+            justifyContent: "center",
           }}
         >
           {page.isBlankPage ? (
-            <div style={{
-              width: '100%',
-              height: '100%',
-              display: 'flex',
-              alignItems: 'center',
-              justifyContent: 'center'
-            }}>
-              <div style={{
-                width: '70%',
-                aspectRatio: getDocumentAspectRatio(),
-                backgroundColor: 'white',
-                border: '1px solid #e9ecef',
-                borderRadius: 2
-              }} />
+            <div
+              style={{
+                width: "100%",
+                height: "100%",
+                display: "flex",
+                alignItems: "center",
+                justifyContent: "center",
+              }}
+            >
+              <div
+                style={{
+                  width: "70%",
+                  aspectRatio: getDocumentAspectRatio(),
+                  backgroundColor: "white",
+                  border: "1px solid #e9ecef",
+                  borderRadius: 2,
+                }}
+              />
             </div>
           ) : thumbnailUrl ? (
             <PrivateContent>
@@ -416,19 +521,23 @@ const PageThumbnail: React.FC<PageThumbnailProps> = ({
                 draggable={false}
                 data-original-rotation={page.rotation}
                 style={{
-                  width: '100%',
-                  height: '100%',
-                  objectFit: 'contain',
+                  width: "100%",
+                  height: "100%",
+                  objectFit: "contain",
                   borderRadius: 2,
                   transform: `rotate(${page.rotation}deg)`,
-                  transition: 'transform 0.3s ease-in-out'
+                  transition: "transform 0.3s ease-in-out",
                 }}
               />
             </PrivateContent>
           ) : (
-            <div style={{ textAlign: 'center' }}>
-              <Text size="lg" c="dimmed">📄</Text>
-              <Text size="xs" c="dimmed" mt={4}>Page {page.pageNumber}</Text>
+            <div style={{ textAlign: "center" }}>
+              <Text size="lg" c="dimmed">
+                📄
+              </Text>
+              <Text size="xs" c="dimmed" mt={4}>
+                Page {page.pageNumber}
+              </Text>
             </div>
           )}
         </div>
@@ -438,16 +547,16 @@ const PageThumbnail: React.FC<PageThumbnailProps> = ({
           size="sm"
           fw={500}
           style={{
-            color: 'var(--mantine-color-white)', // Use theme token for consistency
-            position: 'absolute',
+            color: "var(--mantine-color-white)", // Use theme token for consistency
+            position: "absolute",
             top: 5,
             left: 5,
-            background: 'rgba(162, 201, 255, 0.8)',
-            padding: '6px 8px',
+            background: "rgba(162, 201, 255, 0.8)",
+            padding: "6px 8px",
             borderRadius: 8,
             zIndex: 2,
             opacity: 0,
-            transition: 'opacity 0.2s ease-in-out'
+            transition: "opacity 0.2s ease-in-out",
           }}
         >
           {page.pageNumber}
@@ -459,9 +568,7 @@ const PageThumbnail: React.FC<PageThumbnailProps> = ({
           position="inside"
           className={styles.pageHoverControls}
         />
-
       </div>
-
     </div>
   );
 };
diff --git a/frontend/src/core/components/pageEditor/bulkSelectionPanel/AdvancedSelectionPanel.tsx b/frontend/src/core/components/pageEditor/bulkSelectionPanel/AdvancedSelectionPanel.tsx
index 365b8b0df6..cb1d14b36a 100644
--- a/frontend/src/core/components/pageEditor/bulkSelectionPanel/AdvancedSelectionPanel.tsx
+++ b/frontend/src/core/components/pageEditor/bulkSelectionPanel/AdvancedSelectionPanel.tsx
@@ -1,7 +1,7 @@
-import { useState } from 'react';
-import { Flex } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import classes from '@app/components/pageEditor/bulkSelectionPanel/BulkSelectionPanel.module.css';
+import { useState } from "react";
+import { Flex } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import classes from "@app/components/pageEditor/bulkSelectionPanel/BulkSelectionPanel.module.css";
 import {
   appendExpression,
   insertOperatorSmart,
@@ -10,9 +10,9 @@ import {
   everyNthExpression,
   rangeExpression,
   LogicalOperator,
-} from '@app/utils/bulkselection/selectionBuilders';
-import SelectPages from '@app/components/pageEditor/bulkSelectionPanel/SelectPages';
-import OperatorsSection from '@app/components/pageEditor/bulkSelectionPanel/OperatorsSection';
+} from "@app/utils/bulkselection/selectionBuilders";
+import SelectPages from "@app/components/pageEditor/bulkSelectionPanel/SelectPages";
+import OperatorsSection from "@app/components/pageEditor/bulkSelectionPanel/OperatorsSection";
 
 interface AdvancedSelectionPanelProps {
   csvInput: string;
@@ -30,22 +30,22 @@ const AdvancedSelectionPanel = ({
   advancedOpened,
 }: AdvancedSelectionPanelProps) => {
   const { t } = useTranslation();
-  const [rangeEnd, setRangeEnd] = useState<number | ''>('');
+  const [rangeEnd, setRangeEnd] = useState<number | "">("");
 
   const handleRangeEndChange = (val: string | number) => {
-    const next = typeof val === 'number' ? val : '';
+    const next = typeof val === "number" ? val : "";
     setRangeEnd(next);
   };
 
   // Named validation functions
   const validatePositiveNumber = (value: number): string | null => {
-    return value <= 0 ? 'Enter a positive number' : null;
+    return value <= 0 ? "Enter a positive number" : null;
   };
 
   const validateRangeStart = (start: number): string | null => {
-    if (start <= 0) return 'Values must be positive';
-    if (typeof rangeEnd === 'number' && start > rangeEnd) {
-      return 'From must be less than or equal to To';
+    if (start <= 0) return "Values must be positive";
+    if (typeof rangeEnd === "number" && start > rangeEnd) {
+      return "From must be less than or equal to To";
     }
     return null;
   };
@@ -61,7 +61,7 @@ const AdvancedSelectionPanel = ({
     const next = insertOperatorSmart(csvInput, op);
     setCsvInput(next);
     // Trigger visual selection update for 'even' and 'odd' operators
-    if (op === 'even' || op === 'odd') {
+    if (op === "even" || op === "odd") {
       onUpdatePagesFromCSV(next);
     }
   };
@@ -82,10 +82,10 @@ const AdvancedSelectionPanel = ({
   };
 
   const handleRangeApply = (start: number) => {
-    if (typeof rangeEnd !== 'number') return;
+    if (typeof rangeEnd !== "number") return;
     const expr = rangeExpression(start, rangeEnd, maxPages);
     if (expr) applyExpression(expr);
-    setRangeEnd('');
+    setRangeEnd("");
   };
 
   return (
@@ -97,41 +97,53 @@ const AdvancedSelectionPanel = ({
             {/* Cards row */}
             <Flex direction="row" mb="xs" wrap="wrap">
               <SelectPages
-                title={t('bulkSelection.firstNPages.title', 'First N Pages')}
-                placeholder={t('bulkSelection.firstNPages.placeholder', 'Number of pages')}
+                title={t("bulkSelection.firstNPages.title", "First N Pages")}
+                placeholder={t(
+                  "bulkSelection.firstNPages.placeholder",
+                  "Number of pages",
+                )}
                 onApply={handleFirstNApply}
                 maxPages={maxPages}
                 validationFn={validatePositiveNumber}
               />
-              
+
               <SelectPages
-                title={t('bulkSelection.range.title', 'Range')}
-                placeholder={t('bulkSelection.range.fromPlaceholder', 'From')}
+                title={t("bulkSelection.range.title", "Range")}
+                placeholder={t("bulkSelection.range.fromPlaceholder", "From")}
                 onApply={handleRangeApply}
                 maxPages={maxPages}
                 validationFn={validateRangeStart}
                 isRange={true}
                 rangeEndValue={rangeEnd}
                 onRangeEndChange={handleRangeEndChange}
-                rangeEndPlaceholder={t('bulkSelection.range.toPlaceholder', 'To')}
+                rangeEndPlaceholder={t(
+                  "bulkSelection.range.toPlaceholder",
+                  "To",
+                )}
               />
-              
+
               <SelectPages
-                title={t('bulkSelection.lastNPages.title', 'Last N Pages')}
-                placeholder={t('bulkSelection.lastNPages.placeholder', 'Number of pages')}
+                title={t("bulkSelection.lastNPages.title", "Last N Pages")}
+                placeholder={t(
+                  "bulkSelection.lastNPages.placeholder",
+                  "Number of pages",
+                )}
                 onApply={handleLastNApply}
                 maxPages={maxPages}
                 validationFn={validatePositiveNumber}
               />
-              
+
               <SelectPages
-                title={t('bulkSelection.everyNthPage.title', 'Every Nth Page')}
-                placeholder={t('bulkSelection.everyNthPage.placeholder', 'Step size')}
+                title={t("bulkSelection.everyNthPage.title", "Every Nth Page")}
+                placeholder={t(
+                  "bulkSelection.everyNthPage.placeholder",
+                  "Step size",
+                )}
                 onApply={handleEveryNthApply}
                 maxPages={maxPages}
               />
             </Flex>
-            
+
             {/* Operators row at bottom */}
             <OperatorsSection
               csvInput={csvInput}
diff --git a/frontend/src/core/components/pageEditor/bulkSelectionPanel/BulkSelectionPanel.module.css b/frontend/src/core/components/pageEditor/bulkSelectionPanel/BulkSelectionPanel.module.css
index 2889ff4c33..f80bebaa26 100644
--- a/frontend/src/core/components/pageEditor/bulkSelectionPanel/BulkSelectionPanel.module.css
+++ b/frontend/src/core/components/pageEditor/bulkSelectionPanel/BulkSelectionPanel.module.css
@@ -70,38 +70,38 @@
   cursor: not-allowed;
 }
 
-:global([data-mantine-color-scheme='dark']) .operatorChip {
+:global([data-mantine-color-scheme="dark"]) .operatorChip {
   background-color: var(--bulk-card-bg);
   border-color: var(--bulk-card-border);
   color: var(--text-primary);
 }
 
-:global([data-mantine-color-scheme='dark']) .operatorChip:hover:not(:disabled) {
+:global([data-mantine-color-scheme="dark"]) .operatorChip:hover:not(:disabled) {
   background-color: var(--hover-bg);
   border-color: var(--bulk-card-hover-border);
   color: var(--text-primary);
 }
- 
- .dropdownHeader {
-   display: flex;
-   justify-content: space-between;
-   align-items: center;
-   padding: 0.75rem;
-   border-bottom: 0.0625rem solid var(--border-default);
-   margin-bottom: 0.5rem;
- }
- 
- .closeButton {
-   min-width: 1.5rem;
-   height: 1.5rem;
-   padding: 0;
-   font-size: 1.25rem;
-   font-weight: bold;
-   border-radius: 50%;
-   display: flex;
-   align-items: center;
-   justify-content: center;
- }
+
+.dropdownHeader {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 0.75rem;
+  border-bottom: 0.0625rem solid var(--border-default);
+  margin-bottom: 0.5rem;
+}
+
+.closeButton {
+  min-width: 1.5rem;
+  height: 1.5rem;
+  padding: 0;
+  font-size: 1.25rem;
+  font-weight: bold;
+  border-radius: 50%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
 
 .menuItemRow {
   display: flex;
@@ -143,7 +143,7 @@
   transition: background-color 150ms ease;
 }
 
-:global([data-mantine-color-scheme='dark']) .menuItemCloseHover {
+:global([data-mantine-color-scheme="dark"]) .menuItemCloseHover {
   background-color: var(--text-brand-accent);
   opacity: 0.2;
 }
@@ -196,7 +196,7 @@
   background-color: var(--hover-bg);
 }
 
-:global([data-mantine-color-scheme='dark']) .advancedItem:hover {
+:global([data-mantine-color-scheme="dark"]) .advancedItem:hover {
   background-color: var(--hover-bg);
 }
 
@@ -211,7 +211,7 @@
   color: var(--text-primary);
 }
 
-:global([data-mantine-color-scheme='dark']) .advancedCard {
+:global([data-mantine-color-scheme="dark"]) .advancedCard {
   background-color: var(--bulk-card-bg);
 }
 
@@ -272,7 +272,7 @@
 }
 
 /* Dark-mode adjustments */
-:global([data-mantine-color-scheme='dark']) .selectedList {
+:global([data-mantine-color-scheme="dark"]) .selectedList {
   background-color: var(--bg-raised);
 }
 
@@ -311,4 +311,3 @@
   outline: none !important;
   box-shadow: none !important;
 }
-
diff --git a/frontend/src/core/components/pageEditor/bulkSelectionPanel/OperatorsSection.tsx b/frontend/src/core/components/pageEditor/bulkSelectionPanel/OperatorsSection.tsx
index eaaa2af086..975c7306bc 100644
--- a/frontend/src/core/components/pageEditor/bulkSelectionPanel/OperatorsSection.tsx
+++ b/frontend/src/core/components/pageEditor/bulkSelectionPanel/OperatorsSection.tsx
@@ -1,70 +1,85 @@
-import { Button, Text, Group, Divider } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import classes from '@app/components/pageEditor/bulkSelectionPanel/BulkSelectionPanel.module.css';
-import { LogicalOperator } from '@app/utils/bulkselection/selectionBuilders';
+import { Button, Text, Group, Divider } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import classes from "@app/components/pageEditor/bulkSelectionPanel/BulkSelectionPanel.module.css";
+import { LogicalOperator } from "@app/utils/bulkselection/selectionBuilders";
 
 interface OperatorsSectionProps {
   csvInput: string;
   onInsertOperator: (op: LogicalOperator) => void;
 }
 
-const OperatorsSection = ({ csvInput, onInsertOperator }: OperatorsSectionProps) => {
+const OperatorsSection = ({
+  csvInput,
+  onInsertOperator,
+}: OperatorsSectionProps) => {
   const { t } = useTranslation();
-  
+
   return (
     <div>
-      <Text size="xs" c="var(--text-muted)" fw={500} mb="xs">{t('bulkSelection.keywords.title', 'Keywords')}:</Text>
+      <Text size="xs" c="var(--text-muted)" fw={500} mb="xs">
+        {t("bulkSelection.keywords.title", "Keywords")}:
+      </Text>
       <Group gap="sm" wrap="nowrap">
-        <Button 
-          size="sm" 
+        <Button
+          size="sm"
           variant="outline"
-          className={classes.operatorChip} 
-          onClick={() => onInsertOperator('and')}
+          className={classes.operatorChip}
+          onClick={() => onInsertOperator("and")}
           disabled={!csvInput.trim()}
           title="Combine selections (both conditions must be true)"
         >
-          <Text size="xs" fw={500}>and</Text>
+          <Text size="xs" fw={500}>
+            and
+          </Text>
         </Button>
-        <Button 
-          size="sm" 
+        <Button
+          size="sm"
           variant="outline"
-          className={classes.operatorChip} 
-          onClick={() => onInsertOperator('or')}
+          className={classes.operatorChip}
+          onClick={() => onInsertOperator("or")}
           disabled={!csvInput.trim()}
           title="Add to selection (either condition can be true)"
         >
-          <Text size="xs" fw={500}>or</Text>
+          <Text size="xs" fw={500}>
+            or
+          </Text>
         </Button>
-        <Button 
-          size="sm" 
+        <Button
+          size="sm"
           variant="outline"
-          className={classes.operatorChip} 
-          onClick={() => onInsertOperator('not')}
+          className={classes.operatorChip}
+          onClick={() => onInsertOperator("not")}
           disabled={!csvInput.trim()}
           title="Exclude from selection"
         >
-          <Text size="xs" fw={500}>not</Text>
+          <Text size="xs" fw={500}>
+            not
+          </Text>
         </Button>
       </Group>
       <Divider my="sm" />
       <Group gap="sm" wrap="nowrap">
-        <Button 
-          size="sm" 
+        <Button
+          size="sm"
           variant="outline"
-          className={classes.operatorChip} 
-          onClick={() => onInsertOperator('even')}
+          className={classes.operatorChip}
+          onClick={() => onInsertOperator("even")}
           title="Select all even-numbered pages (2, 4, 6, 8...)"
         >
-          <Text size="xs" fw={500}>even</Text>
+          <Text size="xs" fw={500}>
+            even
+          </Text>
         </Button>
-        <Button 
-          size="sm" 
+        <Button
+          size="sm"
           variant="outline"
-          className={classes.operatorChip} 
-          onClick={() => onInsertOperator('odd')}
+          className={classes.operatorChip}
+          onClick={() => onInsertOperator("odd")}
           title="Select all odd-numbered pages (1, 3, 5, 7...)"
         >
-          <Text size="xs" fw={500}>odd</Text>
+          <Text size="xs" fw={500}>
+            odd
+          </Text>
         </Button>
       </Group>
     </div>
diff --git a/frontend/src/core/components/pageEditor/bulkSelectionPanel/PageSelectionInput.tsx b/frontend/src/core/components/pageEditor/bulkSelectionPanel/PageSelectionInput.tsx
index 6a7bbec535..7ff229661a 100644
--- a/frontend/src/core/components/pageEditor/bulkSelectionPanel/PageSelectionInput.tsx
+++ b/frontend/src/core/components/pageEditor/bulkSelectionPanel/PageSelectionInput.tsx
@@ -1,9 +1,9 @@
-import { TextInput, Button, Text, Flex, Switch } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import LocalIcon from '@app/components/shared/LocalIcon';
-import { Tooltip } from '@app/components/shared/Tooltip';
-import { usePageSelectionTips } from '@app/components/tooltips/usePageSelectionTips';
-import classes from '@app/components/pageEditor/bulkSelectionPanel/BulkSelectionPanel.module.css';
+import { TextInput, Button, Text, Flex, Switch } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import LocalIcon from "@app/components/shared/LocalIcon";
+import { Tooltip } from "@app/components/shared/Tooltip";
+import { usePageSelectionTips } from "@app/components/tooltips/usePageSelectionTips";
+import classes from "@app/components/pageEditor/bulkSelectionPanel/BulkSelectionPanel.module.css";
 
 interface PageSelectionInputProps {
   csvInput: string;
@@ -35,28 +35,35 @@ const PageSelectionInput = ({
           header={pageSelectionTips.header}
           portalTarget={document.body}
           pinOnClick={true}
-          containerStyle={{ marginTop: "1rem"}}
+          containerStyle={{ marginTop: "1rem" }}
           tips={pageSelectionTips.tips}
         >
           <Flex onClick={(e) => e.stopPropagation()} align="center" gap="xs">
-            <LocalIcon icon="gpp-maybe-outline-rounded" width="1rem" height="1rem" style={{ color: 'var(--text-instruction)' }} />
+            <LocalIcon
+              icon="gpp-maybe-outline-rounded"
+              width="1rem"
+              height="1rem"
+              style={{ color: "var(--text-instruction)" }}
+            />
             <Text>Page Selection</Text>
           </Flex>
         </Tooltip>
-        {typeof advancedOpened === 'boolean' && (
+        {typeof advancedOpened === "boolean" && (
           <Flex align="center" gap="xs">
-            <Text size="sm" c="var(--text-secondary)">{t('bulkSelection.advanced.title', 'Advanced')}</Text>
+            <Text size="sm" c="var(--text-secondary)">
+              {t("bulkSelection.advanced.title", "Advanced")}
+            </Text>
             <Switch
               size="sm"
               checked={!!advancedOpened}
               onChange={(e) => onToggleAdvanced?.(e.currentTarget.checked)}
-              title={t('bulkSelection.advanced.title', 'Advanced')}
+              title={t("bulkSelection.advanced.title", "Advanced")}
               className={classes.advancedSwitch}
             />
           </Flex>
         )}
       </Flex>
-      
+
       {/* Text input */}
       <TextInput
         value={csvInput}
@@ -72,19 +79,19 @@ const PageSelectionInput = ({
               variant="subtle"
               size="xs"
               onClick={onClear}
-              style={{ 
-                color: 'var(--text-muted)',
-                minWidth: 'auto',
-                width: '24px',
-                height: '24px',
-                padding: 0
+              style={{
+                color: "var(--text-muted)",
+                minWidth: "auto",
+                width: "24px",
+                height: "24px",
+                padding: 0,
               }}
             >
               ×
             </Button>
           )
         }
-        onKeyDown={(e) => e.key === 'Enter' && onUpdatePagesFromCSV()}
+        onKeyDown={(e) => e.key === "Enter" && onUpdatePagesFromCSV()}
         className={classes.textInput}
       />
     </div>
diff --git a/frontend/src/core/components/pageEditor/bulkSelectionPanel/SelectPages.tsx b/frontend/src/core/components/pageEditor/bulkSelectionPanel/SelectPages.tsx
index 70652af45d..314ca282b6 100644
--- a/frontend/src/core/components/pageEditor/bulkSelectionPanel/SelectPages.tsx
+++ b/frontend/src/core/components/pageEditor/bulkSelectionPanel/SelectPages.tsx
@@ -1,6 +1,6 @@
-import { useState } from 'react';
-import { Button, Text, NumberInput, Group } from '@mantine/core';
-import classes from '@app/components/pageEditor/bulkSelectionPanel/BulkSelectionPanel.module.css';
+import { useState } from "react";
+import { Button, Text, NumberInput, Group } from "@mantine/core";
+import classes from "@app/components/pageEditor/bulkSelectionPanel/BulkSelectionPanel.module.css";
 
 interface SelectPagesProps {
   title: string;
@@ -9,7 +9,7 @@ interface SelectPagesProps {
   maxPages: number;
   validationFn?: (value: number) => string | null;
   isRange?: boolean;
-  rangeEndValue?: number | '';
+  rangeEndValue?: number | "";
   onRangeEndChange?: (value: string | number) => void;
   rangeEndPlaceholder?: string;
 }
@@ -24,14 +24,14 @@ const SelectPages = ({
   onRangeEndChange,
   rangeEndPlaceholder,
 }: SelectPagesProps) => {
-  const [value, setValue] = useState<number | ''>('');
+  const [value, setValue] = useState<number | "">("");
   const [error, setError] = useState<string | null>(null);
 
   const handleValueChange = (val: string | number) => {
-    const next = typeof val === 'number' ? val : '';
+    const next = typeof val === "number" ? val : "";
     setValue(next);
-    
-    if (validationFn && typeof next === 'number') {
+
+    if (validationFn && typeof next === "number") {
       setError(validationFn(next));
     } else {
       setError(null);
@@ -39,18 +39,24 @@ const SelectPages = ({
   };
 
   const handleApply = () => {
-    if (value === '' || typeof value !== 'number') return;
+    if (value === "" || typeof value !== "number") return;
     onApply(value);
-    setValue('');
+    setValue("");
     setError(null);
   };
 
-  const isDisabled = Boolean(error) || value === '';
+  const isDisabled = Boolean(error) || value === "";
 
   return (
     <div className={classes.advancedCard}>
-      <Text size="sm" fw={600} c="var(--text-secondary)" mb="xs">{title}</Text>
-      {error && (<Text size="xs" c="var(--text-brand-accent)" mb="xs">{error}</Text>)}
+      <Text size="sm" fw={600} c="var(--text-secondary)" mb="xs">
+        {title}
+      </Text>
+      {error && (
+        <Text size="xs" c="var(--text-brand-accent)" mb="xs">
+          {error}
+        </Text>
+      )}
       <div className={classes.inputGroup}>
         <Group gap="sm" align="flex-end" wrap="nowrap">
           {isRange ? (
@@ -87,8 +93,8 @@ const SelectPages = ({
               error={Boolean(error)}
             />
           )}
-          <Button 
-            size="sm" 
+          <Button
+            size="sm"
             className={classes.applyButton}
             onClick={handleApply}
             disabled={isDisabled}
diff --git a/frontend/src/core/components/pageEditor/bulkSelectionPanel/SelectedPagesDisplay.tsx b/frontend/src/core/components/pageEditor/bulkSelectionPanel/SelectedPagesDisplay.tsx
index dbcdb6cf90..96c65f6485 100644
--- a/frontend/src/core/components/pageEditor/bulkSelectionPanel/SelectedPagesDisplay.tsx
+++ b/frontend/src/core/components/pageEditor/bulkSelectionPanel/SelectedPagesDisplay.tsx
@@ -1,5 +1,5 @@
-import { Text } from '@mantine/core';
-import classes from '@app/components/pageEditor/bulkSelectionPanel/BulkSelectionPanel.module.css';
+import { Text } from "@mantine/core";
+import classes from "@app/components/pageEditor/bulkSelectionPanel/BulkSelectionPanel.module.css";
 
 interface SelectedPagesDisplayProps {
   selectedPageIds: string[];
@@ -19,13 +19,22 @@ const SelectedPagesDisplay = ({
   return (
     <div className={classes.selectedList}>
       {syntaxError ? (
-        <Text size="xs" className={classes.errorText}>{syntaxError}</Text>
+        <Text size="xs" className={classes.errorText}>
+          {syntaxError}
+        </Text>
       ) : (
         <Text size="sm" c="dimmed" className={classes.selectedText}>
-          Selected: {selectedPageIds.length} pages ({displayDocument ? selectedPageIds.map(id => {
-            const page = displayDocument.pages.find(p => p.id === id);
-            return page?.pageNumber || 0;
-          }).filter(n => n > 0).join(', ') : ''})
+          Selected: {selectedPageIds.length} pages (
+          {displayDocument
+            ? selectedPageIds
+                .map((id) => {
+                  const page = displayDocument.pages.find((p) => p.id === id);
+                  return page?.pageNumber || 0;
+                })
+                .filter((n) => n > 0)
+                .join(", ")
+            : ""}
+          )
         </Text>
       )}
     </div>
diff --git a/frontend/src/core/components/pageEditor/commands/pageCommands.ts b/frontend/src/core/components/pageEditor/commands/pageCommands.ts
index 7061ab993c..402977c46a 100644
--- a/frontend/src/core/components/pageEditor/commands/pageCommands.ts
+++ b/frontend/src/core/components/pageEditor/commands/pageCommands.ts
@@ -1,5 +1,5 @@
-import { FileId } from '@app/types/file';
-import { PDFDocument, PDFPage, PageBreakSettings } from '@app/types/pageEditor';
+import { FileId } from "@app/types/file";
+import { PDFDocument, PDFPage, PageBreakSettings } from "@app/types/pageEditor";
 
 // V1-style DOM-first command system (replaces the old React state commands)
 export abstract class DOMCommand {
@@ -15,7 +15,7 @@ export class RotatePageCommand extends DOMCommand {
     private pageId: string,
     private degrees: number,
     private getCurrentDocument: () => PDFDocument | null,
-    private setDocument: (doc: PDFDocument) => void
+    private setDocument: (doc: PDFDocument) => void,
   ) {
     super();
   }
@@ -24,26 +24,28 @@ export class RotatePageCommand extends DOMCommand {
     const currentDoc = this.getCurrentDocument();
     if (!currentDoc) return;
 
-    const page = currentDoc.pages.find(p => p.id === this.pageId);
+    const page = currentDoc.pages.find((p) => p.id === this.pageId);
     if (!page) return;
 
     if (this.originalRotation === null) {
       this.originalRotation = page.rotation;
     }
 
-    const newRotation = ((page.rotation + this.degrees) % 360 + 360) % 360;
+    const newRotation = (((page.rotation + this.degrees) % 360) + 360) % 360;
 
     this.setDocument({
       ...currentDoc,
-      pages: currentDoc.pages.map(p =>
-        p.id === this.pageId ? { ...p, rotation: newRotation } : p
+      pages: currentDoc.pages.map((p) =>
+        p.id === this.pageId ? { ...p, rotation: newRotation } : p,
       ),
     });
 
     // Also update DOM immediately for CSS animation on currently-mounted pages
-    const pageElement = document.querySelector(`[data-page-id="${this.pageId}"]`);
+    const pageElement = document.querySelector(
+      `[data-page-id="${this.pageId}"]`,
+    );
     if (pageElement) {
-      const img = pageElement.querySelector('img');
+      const img = pageElement.querySelector("img");
       if (img) img.style.transform = `rotate(${newRotation}deg)`;
     }
   }
@@ -56,20 +58,22 @@ export class RotatePageCommand extends DOMCommand {
 
     this.setDocument({
       ...currentDoc,
-      pages: currentDoc.pages.map(p =>
-        p.id === this.pageId ? { ...p, rotation: this.originalRotation! } : p
+      pages: currentDoc.pages.map((p) =>
+        p.id === this.pageId ? { ...p, rotation: this.originalRotation! } : p,
       ),
     });
 
-    const pageElement = document.querySelector(`[data-page-id="${this.pageId}"]`);
+    const pageElement = document.querySelector(
+      `[data-page-id="${this.pageId}"]`,
+    );
     if (pageElement) {
-      const img = pageElement.querySelector('img');
+      const img = pageElement.querySelector("img");
       if (img) img.style.transform = `rotate(${this.originalRotation}deg)`;
     }
   }
 
   get description(): string {
-    return `Rotate page ${this.degrees > 0 ? 'right' : 'left'}`;
+    return `Rotate page ${this.degrees > 0 ? "right" : "left"}`;
   }
 }
 
@@ -89,7 +93,7 @@ export class DeletePagesCommand extends DOMCommand {
     private getSplitPositions: () => Set<string>,
     private setSplitPositions: (positions: Set<string>) => void,
     private getSelectedPages: () => number[],
-    onAllPagesDeleted?: () => void
+    onAllPagesDeleted?: () => void,
   ) {
     super();
     this.onAllPagesDeleted = onAllPagesDeleted;
@@ -103,16 +107,18 @@ export class DeletePagesCommand extends DOMCommand {
     if (!this.hasExecuted) {
       this.originalDocument = {
         ...currentDoc,
-        pages: currentDoc.pages.map(page => ({...page})) // Deep copy pages
+        pages: currentDoc.pages.map((page) => ({ ...page })), // Deep copy pages
       };
       this.originalSplitPositions = new Set(this.getSplitPositions());
       this.originalSelectedPages = [...this.getSelectedPages()];
 
       // Convert page numbers to page IDs for stable identification
-      this.pageIdsToDelete = this.pagesToDelete.map(pageNum => {
-        const page = currentDoc.pages.find(p => p.pageNumber === pageNum);
-        return page?.id || '';
-      }).filter(id => id);
+      this.pageIdsToDelete = this.pagesToDelete
+        .map((pageNum) => {
+          const page = currentDoc.pages.find((p) => p.pageNumber === pageNum);
+          return page?.id || "";
+        })
+        .filter((id) => id);
 
       this.hasExecuted = true;
     }
@@ -120,13 +126,16 @@ export class DeletePagesCommand extends DOMCommand {
     const selectedPageNumbersBefore = this.getSelectedPages();
     const selectedIdSet = new Set(
       selectedPageNumbersBefore
-        .map((pageNum) => currentDoc.pages.find((p) => p.pageNumber === pageNum)?.id)
-        .filter((id): id is string => Boolean(id))
+        .map(
+          (pageNum) =>
+            currentDoc.pages.find((p) => p.pageNumber === pageNum)?.id,
+        )
+        .filter((id): id is string => Boolean(id)),
     );
 
     // Filter out deleted pages by ID (stable across undo/redo)
-    const remainingPages = currentDoc.pages.filter(page =>
-      !this.pageIdsToDelete.includes(page.id)
+    const remainingPages = currentDoc.pages.filter(
+      (page) => !this.pageIdsToDelete.includes(page.id),
     );
 
     if (remainingPages.length === 0) {
@@ -181,8 +190,11 @@ export class DeletePagesCommand extends DOMCommand {
     this.setDocument(this.originalDocument);
     this.setSplitPositions(this.originalSplitPositions);
     const restoredIds = this.originalSelectedPages
-      .map((pageNum) =>
-        this.originalDocument!.pages.find((page) => page.pageNumber === pageNum)?.id || ""
+      .map(
+        (pageNum) =>
+          this.originalDocument!.pages.find(
+            (page) => page.pageNumber === pageNum,
+          )?.id || "",
       )
       .filter((id) => id !== "");
     this.setSelectedPageIds(restoredIds);
@@ -202,7 +214,7 @@ export class ReorderPagesCommand extends DOMCommand {
     private selectedPages: number[] | undefined,
     private getCurrentDocument: () => PDFDocument | null,
     private setDocument: (doc: PDFDocument) => void,
-    private onReorderComplete?: (newPages: PDFPage[]) => void
+    private onReorderComplete?: (newPages: PDFPage[]) => void,
   ) {
     super();
   }
@@ -212,21 +224,31 @@ export class ReorderPagesCommand extends DOMCommand {
     if (!currentDoc) return;
 
     // Store original state for undo
-    this.originalPages = currentDoc.pages.map(page => ({...page}));
+    this.originalPages = currentDoc.pages.map((page) => ({ ...page }));
 
     // Perform the reorder
-    const sourceIndex = currentDoc.pages.findIndex(p => p.pageNumber === this.sourcePageNumber);
+    const sourceIndex = currentDoc.pages.findIndex(
+      (p) => p.pageNumber === this.sourcePageNumber,
+    );
     if (sourceIndex === -1) return;
 
     const newPages = [...currentDoc.pages];
 
-    if (this.selectedPages && this.selectedPages.length > 1 && this.selectedPages.includes(this.sourcePageNumber)) {
+    if (
+      this.selectedPages &&
+      this.selectedPages.length > 1 &&
+      this.selectedPages.includes(this.sourcePageNumber)
+    ) {
       // Multi-page reorder
       const selectedPageObjects = this.selectedPages
-        .map(pageNum => currentDoc.pages.find(p => p.pageNumber === pageNum))
-        .filter(page => page !== undefined) as PDFPage[];
+        .map((pageNum) =>
+          currentDoc.pages.find((p) => p.pageNumber === pageNum),
+        )
+        .filter((page) => page !== undefined) as PDFPage[];
 
-      const remainingPages = newPages.filter(page => !this.selectedPages!.includes(page.pageNumber));
+      const remainingPages = newPages.filter(
+        (page) => !this.selectedPages!.includes(page.pageNumber),
+      );
       remainingPages.splice(this.targetIndex, 0, ...selectedPageObjects);
 
       remainingPages.forEach((page, index) => {
@@ -239,9 +261,10 @@ export class ReorderPagesCommand extends DOMCommand {
       const [movedPage] = newPages.splice(sourceIndex, 1);
 
       // Adjust target index if moving forward (after removal, indices shift)
-      const adjustedTargetIndex = sourceIndex < this.targetIndex
-        ? this.targetIndex - 1
-        : this.targetIndex;
+      const adjustedTargetIndex =
+        sourceIndex < this.targetIndex
+          ? this.targetIndex - 1
+          : this.targetIndex;
 
       newPages.splice(adjustedTargetIndex, 0, movedPage);
 
@@ -290,7 +313,7 @@ export class SplitCommand extends DOMCommand {
     private pageId: string,
     private pageNumber: number,
     private getSplitPositions: () => Set<string>,
-    private setSplitPositions: (positions: Set<string>) => void
+    private setSplitPositions: (positions: Set<string>) => void,
   ) {
     super();
   }
@@ -320,7 +343,7 @@ export class SplitCommand extends DOMCommand {
   get description(): string {
     const currentPositions = this.getSplitPositions();
     const willAdd = !currentPositions.has(this.pageId);
-    return `${willAdd ? 'Add' : 'Remove'} split at position ${this.pageNumber}`;
+    return `${willAdd ? "Add" : "Remove"} split at position ${this.pageNumber}`;
   }
 }
 
@@ -331,7 +354,7 @@ export class BulkRotateCommand extends DOMCommand {
     private pageIds: string[],
     private degrees: number,
     private getCurrentDocument: () => PDFDocument | null,
-    private setDocument: (doc: PDFDocument) => void
+    private setDocument: (doc: PDFDocument) => void,
   ) {
     super();
   }
@@ -354,9 +377,10 @@ export class BulkRotateCommand extends DOMCommand {
     // Update state so rotation survives virtualizer unmount/remount
     // Build a map of id → new rotation for O(1) DOM lookups below
     const newRotationById = new Map<string, number>();
-    const updatedPages = currentDoc.pages.map(page => {
+    const updatedPages = currentDoc.pages.map((page) => {
       if (pageIdSet.has(page.id)) {
-        const newRotation = ((page.rotation + this.degrees) % 360 + 360) % 360;
+        const newRotation =
+          (((page.rotation + this.degrees) % 360) + 360) % 360;
         newRotationById.set(page.id, newRotation);
         return { ...page, rotation: newRotation };
       }
@@ -369,8 +393,9 @@ export class BulkRotateCommand extends DOMCommand {
     for (const pageId of this.pageIds) {
       const pageElement = document.querySelector(`[data-page-id="${pageId}"]`);
       if (pageElement) {
-        const img = pageElement.querySelector('img');
-        if (img) img.style.transform = `rotate(${newRotationById.get(pageId)}deg)`;
+        const img = pageElement.querySelector("img");
+        if (img)
+          img.style.transform = `rotate(${newRotationById.get(pageId)}deg)`;
       }
     }
   }
@@ -380,10 +405,10 @@ export class BulkRotateCommand extends DOMCommand {
     if (!currentDoc) return;
 
     // Restore original rotations in state
-    const updatedPages = currentDoc.pages.map(page =>
+    const updatedPages = currentDoc.pages.map((page) =>
       this.originalRotations.has(page.id)
         ? { ...page, rotation: this.originalRotations.get(page.id)! }
-        : page
+        : page,
     );
 
     this.setDocument({ ...currentDoc, pages: updatedPages });
@@ -392,7 +417,7 @@ export class BulkRotateCommand extends DOMCommand {
     for (const pageId of this.pageIds) {
       const pageElement = document.querySelector(`[data-page-id="${pageId}"]`);
       if (pageElement) {
-        const img = pageElement.querySelector('img');
+        const img = pageElement.querySelector("img");
         if (img && this.originalRotations.has(pageId)) {
           img.style.transform = `rotate(${this.originalRotations.get(pageId)}deg)`;
         }
@@ -401,7 +426,7 @@ export class BulkRotateCommand extends DOMCommand {
   }
 
   get description(): string {
-    return `Rotate ${this.pageIds.length} page(s) ${this.degrees > 0 ? 'right' : 'left'}`;
+    return `Rotate ${this.pageIds.length} page(s) ${this.degrees > 0 ? "right" : "left"}`;
   }
 }
 
@@ -411,7 +436,7 @@ export class BulkSplitCommand extends DOMCommand {
   constructor(
     private positions: number[],
     private getSplitPositions: () => Set<number>,
-    private setSplitPositions: (positions: Set<number>) => void
+    private setSplitPositions: (positions: Set<number>) => void,
   ) {
     super();
   }
@@ -424,7 +449,7 @@ export class BulkSplitCommand extends DOMCommand {
 
     // Toggle each position
     const currentPositions = new Set(this.getSplitPositions());
-    this.positions.forEach(position => {
+    this.positions.forEach((position) => {
       if (currentPositions.has(position)) {
         currentPositions.delete(position);
       } else {
@@ -452,7 +477,7 @@ export class SplitAllCommand extends DOMCommand {
   constructor(
     private totalPages: number,
     private getSplitPositions: () => Set<number>,
-    private setSplitPositions: (positions: Set<number>) => void
+    private setSplitPositions: (positions: Set<number>) => void,
   ) {
     super();
     // Calculate all possible split positions (between pages, not after last page)
@@ -467,7 +492,9 @@ export class SplitAllCommand extends DOMCommand {
 
     // Check if all splits are already active
     const currentSplits = this.getSplitPositions();
-    const hasAllSplits = Array.from(this.allPossibleSplits).every(pos => currentSplits.has(pos));
+    const hasAllSplits = Array.from(this.allPossibleSplits).every((pos) =>
+      currentSplits.has(pos),
+    );
 
     if (hasAllSplits) {
       // Remove all splits
@@ -485,8 +512,10 @@ export class SplitAllCommand extends DOMCommand {
 
   get description(): string {
     const currentSplits = this.getSplitPositions();
-    const hasAllSplits = Array.from(this.allPossibleSplits).every(pos => currentSplits.has(pos));
-    return hasAllSplits ? 'Remove all splits' : 'Split all pages';
+    const hasAllSplits = Array.from(this.allPossibleSplits).every((pos) =>
+      currentSplits.has(pos),
+    );
+    return hasAllSplits ? "Remove all splits" : "Split all pages";
   }
 }
 
@@ -500,7 +529,7 @@ export class PageBreakCommand extends DOMCommand {
     private selectedPageNumbers: number[],
     private getCurrentDocument: () => PDFDocument | null,
     private setDocument: (doc: PDFDocument) => void,
-    private settings?: PageBreakSettings
+    private settings?: PageBreakSettings,
   ) {
     super();
   }
@@ -512,7 +541,7 @@ export class PageBreakCommand extends DOMCommand {
     // Store original state for undo
     this.originalDocument = {
       ...currentDoc,
-      pages: currentDoc.pages.map(page => ({...page}))
+      pages: currentDoc.pages.map((page) => ({ ...page })),
     };
 
     // Create new pages array with blank pages inserted
@@ -536,7 +565,7 @@ export class PageBreakCommand extends DOMCommand {
           selected: false,
           splitAfter: false,
           isBlankPage: true, // Custom flag for blank pages
-          pageBreakSettings: this.settings // Store settings for export
+          pageBreakSettings: this.settings, // Store settings for export
         };
         newPages.push(blankPage);
         this.insertedPages.push(blankPage);
@@ -574,7 +603,7 @@ export class BulkPageBreakCommand extends DOMCommand {
     private getCurrentDocument: () => PDFDocument | null,
     private setDocument: (doc: PDFDocument) => void,
     private setSelectedPages: (pages: number[]) => void,
-    private getSelectedPages: () => number[]
+    private getSelectedPages: () => number[],
   ) {
     super();
   }
@@ -589,7 +618,7 @@ export class BulkPageBreakCommand extends DOMCommand {
     // Store original state for undo
     this.originalDocument = {
       ...currentDoc,
-      pages: currentDoc.pages.map(page => ({...page}))
+      pages: currentDoc.pages.map((page) => ({ ...page })),
     };
 
     // Create new pages array with blank pages inserted after each page (except the last)
@@ -612,7 +641,7 @@ export class BulkPageBreakCommand extends DOMCommand {
           rotation: 0,
           selected: false,
           splitAfter: false,
-          isBlankPage: true
+          isBlankPage: true,
         };
         newPages.push(blankPage);
         this.insertedPages.push(blankPage);
@@ -630,11 +659,13 @@ export class BulkPageBreakCommand extends DOMCommand {
 
     // Maintain existing selection by mapping original selected pages to their new positions
     const updatedSelection: number[] = [];
-    this.originalSelectedPages.forEach(originalPageNum => {
+    this.originalSelectedPages.forEach((originalPageNum) => {
       // Find the original page by matching the page ID from the original document
       const originalPage = this.originalDocument?.pages[originalPageNum - 1];
       if (originalPage) {
-        const foundPage = newPages.find(page => page.id === originalPage.id && !page.isBlankPage);
+        const foundPage = newPages.find(
+          (page) => page.id === originalPage.id && !page.isBlankPage,
+        );
         if (foundPage) {
           updatedSelection.push(foundPage.pageNumber);
         }
@@ -667,7 +698,10 @@ export class InsertFilesCommand extends DOMCommand {
     private setDocument: (doc: PDFDocument) => void,
     private setSelectedPages: (pages: number[]) => void,
     private getSelectedPages: () => number[],
-    private updateFileContext?: (updatedDocument: PDFDocument, insertedFiles?: Map<FileId, File>) => void
+    private updateFileContext?: (
+      updatedDocument: PDFDocument,
+      insertedFiles?: Map<FileId, File>,
+    ) => void,
   ) {
     super();
   }
@@ -679,7 +713,7 @@ export class InsertFilesCommand extends DOMCommand {
     // Store original state for undo
     this.originalDocument = {
       ...currentDoc,
-      pages: currentDoc.pages.map(page => ({...page}))
+      pages: currentDoc.pages.map((page) => ({ ...page })),
     };
 
     try {
@@ -689,7 +723,8 @@ export class InsertFilesCommand extends DOMCommand {
       // Process all files and wait for their completion
       const baseTimestamp = Date.now();
       const extractionPromises = this.files.map(async (file, index) => {
-        const fileId = `inserted-${file.name}-${baseTimestamp + index}` as FileId;
+        const fileId =
+          `inserted-${file.name}-${baseTimestamp + index}` as FileId;
         // Store inserted file for export
         this.insertedFileMap.set(fileId, file);
         // Use base timestamp + index to ensure unique but predictable file IDs
@@ -714,7 +749,10 @@ export class InsertFilesCommand extends DOMCommand {
 
       // Add pages before insertion point
       for (let i = 0; i < insertIndex && i < currentDoc.pages.length; i++) {
-        const page = { ...currentDoc.pages[i], pageNumber: pageNumberCounter++ };
+        const page = {
+          ...currentDoc.pages[i],
+          pageNumber: pageNumberCounter++,
+        };
         newPages.push(page);
       }
 
@@ -724,7 +762,7 @@ export class InsertFilesCommand extends DOMCommand {
           ...newPage,
           pageNumber: pageNumberCounter++,
           selected: false,
-          splitAfter: false
+          splitAfter: false,
         };
         newPages.push(insertedPage);
         this.insertedPages.push(insertedPage);
@@ -732,7 +770,10 @@ export class InsertFilesCommand extends DOMCommand {
 
       // Add remaining pages after insertion point
       for (let i = insertIndex; i < currentDoc.pages.length; i++) {
-        const page = { ...currentDoc.pages[i], pageNumber: pageNumberCounter++ };
+        const page = {
+          ...currentDoc.pages[i],
+          pageNumber: pageNumberCounter++,
+        };
         newPages.push(page);
       }
 
@@ -757,7 +798,7 @@ export class InsertFilesCommand extends DOMCommand {
       const originalSelection = this.getSelectedPages();
       const updatedSelection: number[] = [];
 
-      originalSelection.forEach(originalPageNum => {
+      originalSelection.forEach((originalPageNum) => {
         if (originalPageNum <= this.insertAfterPageNumber) {
           // Pages before insertion point keep same number
           updatedSelection.push(originalPageNum);
@@ -768,9 +809,8 @@ export class InsertFilesCommand extends DOMCommand {
       });
 
       this.setSelectedPages(updatedSelection);
-
     } catch (error) {
-      console.error('Failed to insert files:', error);
+      console.error("Failed to insert files:", error);
       // Revert to original state if error occurs
       if (this.originalDocument) {
         this.setDocument(this.originalDocument);
@@ -778,15 +818,21 @@ export class InsertFilesCommand extends DOMCommand {
     }
   }
 
-  private async generateThumbnailsForInsertedPages(updatedDocument: PDFDocument): Promise<void> {
+  private async generateThumbnailsForInsertedPages(
+    updatedDocument: PDFDocument,
+  ): Promise<void> {
     try {
-      const { thumbnailGenerationService } = await import('@app/services/thumbnailGenerationService');
+      const { thumbnailGenerationService } =
+        await import("@app/services/thumbnailGenerationService");
 
       // Group pages by file ID to generate thumbnails efficiently
       const pagesByFileId = new Map<FileId, PDFPage[]>();
 
       for (const page of this.insertedPages) {
-        const fileId = page.id.substring(0, page.id.lastIndexOf('-page-')) as FileId /* FIX ME: This looks wrong - like we've thrown away info too early and need to recreate it */;
+        const fileId = page.id.substring(
+          0,
+          page.id.lastIndexOf("-page-"),
+        ) as FileId; /* FIX ME: This looks wrong - like we've thrown away info too early and need to recreate it */
         if (!pagesByFileId.has(fileId)) {
           pagesByFileId.set(fileId, []);
         }
@@ -797,29 +843,39 @@ export class InsertFilesCommand extends DOMCommand {
       for (const [fileId, pages] of pagesByFileId) {
         const arrayBuffer = this.fileDataMap.get(fileId);
 
-        console.log('Generating thumbnails for file:', fileId);
-        console.log('Pages:', pages.length);
-        console.log('ArrayBuffer size:', arrayBuffer?.byteLength || 'undefined');
+        console.log("Generating thumbnails for file:", fileId);
+        console.log("Pages:", pages.length);
+        console.log(
+          "ArrayBuffer size:",
+          arrayBuffer?.byteLength || "undefined",
+        );
 
         try {
           if (arrayBuffer && arrayBuffer.byteLength > 0) {
             // Extract page numbers for all pages from this file
-            const pageNumbers = pages.map(page => {
+            const pageNumbers = pages.map((page) => {
               const pageNumMatch = page.id.match(/-page-(\d+)$/);
               return pageNumMatch ? parseInt(pageNumMatch[1]) : 1;
             });
 
-            console.log('Generating thumbnails for page numbers:', pageNumbers);
+            console.log("Generating thumbnails for page numbers:", pageNumbers);
 
             // Generate thumbnails for all pages from this file at once
             const results = await thumbnailGenerationService.generateThumbnails(
               fileId,
               arrayBuffer,
               pageNumbers,
-              { scale: 0.2, quality: 0.8 }
+              {
+                scale: 0.2,
+                quality: 0.8,
+              },
             );
 
-            console.log('Thumbnail generation results:', results.length, 'thumbnails generated');
+            console.log(
+              "Thumbnail generation results:",
+              results.length,
+              "thumbnails generated",
+            );
 
             // Update pages with generated thumbnails
             for (let i = 0; i < results.length && i < pages.length; i++) {
@@ -827,10 +883,12 @@ export class InsertFilesCommand extends DOMCommand {
               const page = pages[i];
 
               if (result.success) {
-                const pageIndex = updatedDocument.pages.findIndex(p => p.id === page.id);
+                const pageIndex = updatedDocument.pages.findIndex(
+                  (p) => p.id === page.id,
+                );
                 if (pageIndex >= 0) {
                   updatedDocument.pages[pageIndex].thumbnail = result.thumbnail;
-                  console.log('Updated thumbnail for page:', page.id);
+                  console.log("Updated thumbnail for page:", page.id);
                 }
               }
             }
@@ -838,29 +896,39 @@ export class InsertFilesCommand extends DOMCommand {
             // Trigger re-render by updating the document
             this.setDocument({ ...updatedDocument });
           } else {
-            console.error('No valid ArrayBuffer found for file ID:', fileId);
+            console.error("No valid ArrayBuffer found for file ID:", fileId);
           }
         } catch (error) {
-          console.error('Failed to generate thumbnails for file:', fileId, error);
+          console.error(
+            "Failed to generate thumbnails for file:",
+            fileId,
+            error,
+          );
         } finally {
           this.fileDataMap.delete(fileId);
         }
       }
     } catch (error) {
-      console.error('Failed to generate thumbnails for inserted pages:', error);
+      console.error("Failed to generate thumbnails for inserted pages:", error);
     }
   }
 
-  private async extractPagesFromFile(file: File, baseTimestamp: number): Promise<PDFPage[]> {
+  private async extractPagesFromFile(
+    file: File,
+    baseTimestamp: number,
+  ): Promise<PDFPage[]> {
     return new Promise((resolve, reject) => {
       const reader = new FileReader();
       reader.onload = async (event) => {
         try {
           const arrayBuffer = event.target?.result as ArrayBuffer;
-          console.log('File reader onload - arrayBuffer size:', arrayBuffer?.byteLength || 'undefined');
+          console.log(
+            "File reader onload - arrayBuffer size:",
+            arrayBuffer?.byteLength || "undefined",
+          );
 
           if (!arrayBuffer) {
-            reject(new Error('Failed to read file'));
+            reject(new Error("Failed to read file"));
             return;
           }
 
@@ -868,21 +936,33 @@ export class InsertFilesCommand extends DOMCommand {
           const clonedArrayBuffer = arrayBuffer.slice(0);
 
           // Use PDF.js via the worker manager to extract pages
-          const { pdfWorkerManager } = await import('@app/services/pdfWorkerManager');
+          const { pdfWorkerManager } =
+            await import("@app/services/pdfWorkerManager");
           const pdf = await pdfWorkerManager.createDocument(clonedArrayBuffer);
 
           const pageCount = pdf.numPages;
           const pages: PDFPage[] = [];
           const fileId = `inserted-${file.name}-${baseTimestamp}` as FileId;
 
-          console.log('Original ArrayBuffer size:', arrayBuffer.byteLength);
-          console.log('Storing ArrayBuffer for fileId:', fileId, 'size:', arrayBuffer.byteLength);
+          console.log("Original ArrayBuffer size:", arrayBuffer.byteLength);
+          console.log(
+            "Storing ArrayBuffer for fileId:",
+            fileId,
+            "size:",
+            arrayBuffer.byteLength,
+          );
 
           // Store the original ArrayBuffer for thumbnail generation
           this.fileDataMap.set(fileId, arrayBuffer);
 
-          console.log('After storing - fileDataMap size:', this.fileDataMap.size);
-          console.log('Stored value size:', this.fileDataMap.get(fileId)?.byteLength || 'undefined');
+          console.log(
+            "After storing - fileDataMap size:",
+            this.fileDataMap.size,
+          );
+          console.log(
+            "Stored value size:",
+            this.fileDataMap.get(fileId)?.byteLength || "undefined",
+          );
 
           for (let i = 1; i <= pageCount; i++) {
             const pageId = `${fileId}-page-${i}`;
@@ -894,7 +974,7 @@ export class InsertFilesCommand extends DOMCommand {
               rotation: 0,
               selected: false,
               splitAfter: false,
-              isBlankPage: false
+              isBlankPage: false,
             });
           }
 
@@ -906,7 +986,7 @@ export class InsertFilesCommand extends DOMCommand {
           reject(error);
         }
       };
-      reader.onerror = () => reject(new Error('Failed to read file'));
+      reader.onerror = () => reject(new Error("Failed to read file"));
       reader.readAsArrayBuffer(file);
     });
   }
diff --git a/frontend/src/core/components/pageEditor/constants.ts b/frontend/src/core/components/pageEditor/constants.ts
index 28ee92580d..9d50620ab8 100644
--- a/frontend/src/core/components/pageEditor/constants.ts
+++ b/frontend/src/core/components/pageEditor/constants.ts
@@ -1,8 +1,8 @@
 // Shared constants for PageEditor grid layout
 export const GRID_CONSTANTS = {
-  ITEM_WIDTH: '20rem', // page width
-  ITEM_HEIGHT: '21.5rem', // 20rem + 1.5rem gap
-  ITEM_GAP: '1.5rem', // gap between items
+  ITEM_WIDTH: "20rem", // page width
+  ITEM_HEIGHT: "21.5rem", // 20rem + 1.5rem gap
+  ITEM_GAP: "1.5rem", // gap between items
   OVERSCAN_SMALL: 8, // Overscan for normal documents
   OVERSCAN_LARGE: 12, // Overscan for large documents (12 rows = ~96 pages pre-rendered)
-} as const;
\ No newline at end of file
+} as const;
diff --git a/frontend/src/core/components/pageEditor/fileColors.ts b/frontend/src/core/components/pageEditor/fileColors.ts
index fa9b0c35fd..18eedff990 100644
--- a/frontend/src/core/components/pageEditor/fileColors.ts
+++ b/frontend/src/core/components/pageEditor/fileColors.ts
@@ -7,30 +7,30 @@
 
 export const FILE_COLORS = [
   // Subtle colors (1-6) - fit well with UI theme
-  'rgb(59, 130, 246)',   // Blue
-  'rgb(16, 185, 129)',   // Green
-  'rgb(139, 92, 246)',   // Purple
-  'rgb(6, 182, 212)',    // Cyan
-  'rgb(20, 184, 166)',   // Teal
-  'rgb(99, 102, 241)',   // Indigo
+  "rgb(59, 130, 246)", // Blue
+  "rgb(16, 185, 129)", // Green
+  "rgb(139, 92, 246)", // Purple
+  "rgb(6, 182, 212)", // Cyan
+  "rgb(20, 184, 166)", // Teal
+  "rgb(99, 102, 241)", // Indigo
 
   // Mid-range colors (7-12) - more distinct
-  'rgb(244, 114, 182)',  // Pink
-  'rgb(251, 146, 60)',   // Orange
-  'rgb(234, 179, 8)',    // Yellow
-  'rgb(132, 204, 22)',   // Lime
-  'rgb(248, 113, 113)',  // Red
-  'rgb(168, 85, 247)',   // Violet
+  "rgb(244, 114, 182)", // Pink
+  "rgb(251, 146, 60)", // Orange
+  "rgb(234, 179, 8)", // Yellow
+  "rgb(132, 204, 22)", // Lime
+  "rgb(248, 113, 113)", // Red
+  "rgb(168, 85, 247)", // Violet
 
   // Vibrant colors (13-20) - maximum distinction
-  'rgb(236, 72, 153)',   // Fuchsia
-  'rgb(245, 158, 11)',   // Amber
-  'rgb(34, 197, 94)',    // Emerald
-  'rgb(14, 165, 233)',   // Sky
-  'rgb(239, 68, 68)',    // Rose
-  'rgb(168, 162, 158)',  // Stone
-  'rgb(251, 191, 36)',   // Gold
-  'rgb(192, 132, 252)',  // Light Purple
+  "rgb(236, 72, 153)", // Fuchsia
+  "rgb(245, 158, 11)", // Amber
+  "rgb(34, 197, 94)", // Emerald
+  "rgb(14, 165, 233)", // Sky
+  "rgb(239, 68, 68)", // Rose
+  "rgb(168, 162, 158)", // Stone
+  "rgb(251, 191, 36)", // Gold
+  "rgb(192, 132, 252)", // Light Purple
 ] as const;
 
 export const MAX_PAGE_EDITOR_FILES = 20;
@@ -54,8 +54,11 @@ export function getFileColor(index: number): string {
  * @param opacity - Opacity value (0-1), defaults to 0.3
  * @returns RGBA color string
  */
-export function getFileColorWithOpacity(index: number, opacity: number = 0.2): string {
+export function getFileColorWithOpacity(
+  index: number,
+  opacity: number = 0.2,
+): string {
   const rgb = getFileColor(index);
   // Convert rgb(r, g, b) to rgba(r, g, b, a)
-  return rgb.replace('rgb(', 'rgba(').replace(')', `, ${opacity})`);
+  return rgb.replace("rgb(", "rgba(").replace(")", `, ${opacity})`);
 }
diff --git a/frontend/src/core/components/pageEditor/hooks/useEditedDocumentState.ts b/frontend/src/core/components/pageEditor/hooks/useEditedDocumentState.ts
index 9cc7275f6d..86473719ab 100644
--- a/frontend/src/core/components/pageEditor/hooks/useEditedDocumentState.ts
+++ b/frontend/src/core/components/pageEditor/hooks/useEditedDocumentState.ts
@@ -20,7 +20,9 @@ export const useEditedDocumentState = ({
   fileOrder,
   updateCurrentPages,
 }: UseEditedDocumentStateParams) => {
-  const [editedDocument, setEditedDocument] = useState<PDFDocument | null>(null);
+  const [editedDocument, setEditedDocument] = useState<PDFDocument | null>(
+    null,
+  );
   const editedDocumentRef = useRef<PDFDocument | null>(null);
   const pagePositionCacheRef = useRef<Map<string, number>>(new Map());
   const pageNeighborCacheRef = useRef<Map<string, string | null>>(new Map());
@@ -145,14 +147,14 @@ export const useEditedDocumentState = ({
 
           if (hasRemovals) {
             pages = pages.filter(
-              (page) => sourceIds.has(page.id) || isEphemeralPage(page)
+              (page) => sourceIds.has(page.id) || isEphemeralPage(page),
             );
           }
 
           if (hasAdditions) {
             const mergedIndexMap = new Map<string, number>();
             sourcePages.forEach((page, index) =>
-              mergedIndexMap.set(page.id, index)
+              mergedIndexMap.set(page.id, index),
             );
 
             const additions = newPages
@@ -169,41 +171,46 @@ export const useEditedDocumentState = ({
                 return a.mergedIndex - b.mergedIndex;
               });
 
-            additions.forEach(({ page, neighborId, cachedIndex, mergedIndex }) => {
-              if (pages.some((existing) => existing.id === page.id)) {
-                return;
-              }
+            additions.forEach(
+              ({ page, neighborId, cachedIndex, mergedIndex }) => {
+                if (pages.some((existing) => existing.id === page.id)) {
+                  return;
+                }
 
-              let insertIndex: number;
-              const originalFileId = page.originalFileId;
-              const placeholderIndex =
-                originalFileId !== undefined
-                  ? nextInsertIndexByFile.get(originalFileId)
-                  : undefined;
+                let insertIndex: number;
+                const originalFileId = page.originalFileId;
+                const placeholderIndex =
+                  originalFileId !== undefined
+                    ? nextInsertIndexByFile.get(originalFileId)
+                    : undefined;
 
-              if (originalFileId && placeholderIndex !== undefined) {
-                insertIndex = Math.min(placeholderIndex, pages.length);
-                nextInsertIndexByFile.set(originalFileId, insertIndex + 1);
-              } else if (neighborId === null) {
-                insertIndex = 0;
-              } else if (neighborId) {
-                const neighborIndex = pages.findIndex((p) => p.id === neighborId);
-                if (neighborIndex !== -1) {
-                  insertIndex = neighborIndex + 1;
+                if (originalFileId && placeholderIndex !== undefined) {
+                  insertIndex = Math.min(placeholderIndex, pages.length);
+                  nextInsertIndexByFile.set(originalFileId, insertIndex + 1);
+                } else if (neighborId === null) {
+                  insertIndex = 0;
+                } else if (neighborId) {
+                  const neighborIndex = pages.findIndex(
+                    (p) => p.id === neighborId,
+                  );
+                  if (neighborIndex !== -1) {
+                    insertIndex = neighborIndex + 1;
+                  } else {
+                    const fallbackIndex =
+                      cachedIndex ?? mergedIndex ?? pages.length;
+                    insertIndex = Math.min(fallbackIndex, pages.length);
+                  }
                 } else {
-                  const fallbackIndex = cachedIndex ?? mergedIndex ?? pages.length;
+                  const fallbackIndex =
+                    cachedIndex ?? mergedIndex ?? pages.length;
                   insertIndex = Math.min(fallbackIndex, pages.length);
                 }
-              } else {
-                const fallbackIndex = cachedIndex ?? mergedIndex ?? pages.length;
-                insertIndex = Math.min(fallbackIndex, pages.length);
-              }
 
-              const clonedPage = { ...page };
-              pages.splice(insertIndex, 0, clonedPage);
-            });
+                const clonedPage = { ...page };
+                pages.splice(insertIndex, 0, clonedPage);
+              },
+            );
           }
-
         }
 
         if (shouldResetToMerged || hasAdditions || hasRemovals) {
@@ -240,10 +247,7 @@ export const useEditedDocumentState = ({
 
   const displayDocument = editedDocument || initialDocument;
 
-  const getEditedDocument = useCallback(
-    () => editedDocumentRef.current,
-    []
-  );
+  const getEditedDocument = useCallback(() => editedDocumentRef.current, []);
 
   useEffect(() => {
     updateCurrentPages(displayDocument?.pages ?? null);
diff --git a/frontend/src/core/components/pageEditor/hooks/useEditorCommands.ts b/frontend/src/core/components/pageEditor/hooks/useEditorCommands.ts
index ce0916740f..a790e94085 100644
--- a/frontend/src/core/components/pageEditor/hooks/useEditorCommands.ts
+++ b/frontend/src/core/components/pageEditor/hooks/useEditorCommands.ts
@@ -7,10 +7,7 @@ import {
   ReorderPagesCommand,
   SplitCommand,
 } from "@app/components/pageEditor/commands/pageCommands";
-import type {
-  useFileActions,
-  useFileState,
-} from "@app/contexts/FileContext";
+import type { useFileActions, useFileState } from "@app/contexts/FileContext";
 import { PDFDocument, PDFPage } from "@app/types/pageEditor";
 import { FileId } from "@app/types/file";
 import { StirlingFileStub } from "@app/types/fileContext";
@@ -66,20 +63,30 @@ export const usePageEditorCommands = ({
 
   const handleRotatePages = useCallback(
     (pageIds: string[], rotation: number) => {
-      const bulkRotateCommand = new BulkRotateCommand(pageIds, rotation, getEditedDocument, setEditedDocument);
+      const bulkRotateCommand = new BulkRotateCommand(
+        pageIds,
+        rotation,
+        getEditedDocument,
+        setEditedDocument,
+      );
       executeCommandWithTracking(bulkRotateCommand);
     },
-    [executeCommandWithTracking, getEditedDocument, setEditedDocument]
+    [executeCommandWithTracking, getEditedDocument, setEditedDocument],
   );
 
   const createRotateCommand = useCallback(
     (pageIds: string[], rotation: number) => ({
       execute: () => {
-        const bulkRotateCommand = new BulkRotateCommand(pageIds, rotation, getEditedDocument, setEditedDocument);
+        const bulkRotateCommand = new BulkRotateCommand(
+          pageIds,
+          rotation,
+          getEditedDocument,
+          setEditedDocument,
+        );
         executeCommandWithTracking(bulkRotateCommand);
       },
     }),
-    [executeCommandWithTracking, getEditedDocument, setEditedDocument]
+    [executeCommandWithTracking, getEditedDocument, setEditedDocument],
   );
 
   const createDeleteCommand = useCallback(
@@ -104,7 +111,7 @@ export const usePageEditorCommands = ({
             () => splitPositions,
             setSplitPositions,
             () => getPageNumbersFromIds(selectedPageIds),
-            () => closePdf()
+            () => closePdf(),
           );
           executeCommandWithTracking(deleteCommand);
         }
@@ -120,7 +127,7 @@ export const usePageEditorCommands = ({
       setSelectedPageIds,
       setSplitPositions,
       splitPositions,
-    ]
+    ],
   );
 
   const createSplitCommand = useCallback(
@@ -130,12 +137,12 @@ export const usePageEditorCommands = ({
           pageId,
           pageNumber,
           () => splitPositionsRef.current,
-          setSplitPositions
+          setSplitPositions,
         );
         executeCommandWithTracking(splitCommand);
       },
     }),
-    [executeCommandWithTracking, setSplitPositions]
+    [executeCommandWithTracking, setSplitPositions],
   );
 
   const executeCommand = useCallback((command: any) => {
@@ -151,7 +158,7 @@ export const usePageEditorCommands = ({
 
       handleRotatePages(selectedPageIds, rotation);
     },
-    [displayDocument, selectedPageIds, handleRotatePages]
+    [displayDocument, selectedPageIds, handleRotatePages],
   );
 
   const handleDelete = useCallback(() => {
@@ -167,7 +174,7 @@ export const usePageEditorCommands = ({
       () => splitPositions,
       setSplitPositions,
       () => selectedPageNumbers,
-      () => closePdf()
+      () => closePdf(),
     );
     executeCommandWithTracking(deleteCommand);
   }, [
@@ -195,7 +202,7 @@ export const usePageEditorCommands = ({
         () => splitPositions,
         setSplitPositions,
         () => getPageNumbersFromIds(selectedPageIds),
-        () => closePdf()
+        () => closePdf(),
       );
       executeCommandWithTracking(deleteCommand);
     },
@@ -209,22 +216,24 @@ export const usePageEditorCommands = ({
       setSelectedPageIds,
       setSplitPositions,
       splitPositions,
-    ]
+    ],
   );
 
   const handleSplit = useCallback(() => {
     if (!displayDocument || selectedPageIds.length === 0) return;
 
     const selectedSplitPageIds = displayDocument.pages
-      .filter((page, index) =>
-        selectedPageIds.includes(page.id) && index < displayDocument.pages.length - 1
+      .filter(
+        (page, index) =>
+          selectedPageIds.includes(page.id) &&
+          index < displayDocument.pages.length - 1,
       )
       .map((page) => page.id);
 
     if (selectedSplitPageIds.length === 0) return;
 
     const existingSplitsCount = selectedSplitPageIds.filter((id) =>
-      splitPositions.has(id)
+      splitPositions.has(id),
     ).length;
     const noSplitsCount = selectedSplitPageIds.length - existingSplitsCount;
     const shouldRemoveSplits = existingSplitsCount > noSplitsCount;
@@ -265,7 +274,7 @@ export const usePageEditorCommands = ({
     const pageBreakCommand = new PageBreakCommand(
       selectedPageNumbers,
       getEditedDocument,
-      setEditedDocument
+      setEditedDocument,
     );
     executeCommandWithTracking(pageBreakCommand);
   }, [
@@ -283,9 +292,9 @@ export const usePageEditorCommands = ({
     async (
       files: File[] | StirlingFileStub[],
       insertAfterPage: number,
-      isFromStorage?: boolean
+      isFromStorage?: boolean,
     ) => {
-      console.log('[PageEditor] handleInsertFiles called:', {
+      console.log("[PageEditor] handleInsertFiles called:", {
         fileCount: files.length,
         insertAfterPage,
         isFromStorage,
@@ -293,7 +302,7 @@ export const usePageEditorCommands = ({
 
       const workingDocument = getEditedDocument();
       if (!workingDocument || files.length === 0) {
-        console.log('[PageEditor] handleInsertFiles early return:', {
+        console.log("[PageEditor] handleInsertFiles early return:", {
           hasDocument: !!workingDocument,
           fileCount: files.length,
         });
@@ -302,15 +311,15 @@ export const usePageEditorCommands = ({
 
       try {
         const targetPage = workingDocument.pages.find(
-          (p) => p.pageNumber === insertAfterPage
+          (p) => p.pageNumber === insertAfterPage,
         );
         if (!targetPage) {
-          console.log('[PageEditor] Target page not found:', insertAfterPage);
+          console.log("[PageEditor] Target page not found:", insertAfterPage);
           return;
         }
 
         const insertAfterPageId = targetPage.id;
-        console.log('[PageEditor] Inserting files after page:', {
+        console.log("[PageEditor] Inserting files after page:", {
           pageNumber: insertAfterPage,
           pageId: insertAfterPageId,
         });
@@ -329,7 +338,7 @@ export const usePageEditorCommands = ({
             insertAfterPageId,
           });
           addedFileIds = result.map((file) => file.fileId);
-          console.log('[PageEditor] Files added to context:', {
+          console.log("[PageEditor] Files added to context:", {
             addedCount: addedFileIds.length,
             fileIds: addedFileIds,
           });
@@ -359,7 +368,7 @@ export const usePageEditorCommands = ({
 
         if (newPages.length > 0) {
           const targetIndex = workingDocument.pages.findIndex(
-            (p) => p.id === targetPage.id
+            (p) => p.id === targetPage.id,
           );
 
           if (targetIndex >= 0) {
@@ -388,14 +397,14 @@ export const usePageEditorCommands = ({
       selectors,
       updateFileOrderFromPages,
       setEditedDocument,
-    ]
+    ],
   );
 
   const handleReorderPages = useCallback(
     (
       sourcePageNumber: number,
       targetIndex: number,
-      draggedPageIds?: string[]
+      draggedPageIds?: string[],
     ) => {
       if (!displayDocument) return;
 
@@ -409,7 +418,7 @@ export const usePageEditorCommands = ({
         selectedPages,
         getEditedDocument,
         setEditedDocument,
-        (newPages) => updateFileOrderFromPages(newPages)
+        (newPages) => updateFileOrderFromPages(newPages),
       );
       executeCommandWithTracking(reorderCommand);
     },
@@ -420,7 +429,7 @@ export const usePageEditorCommands = ({
       getPageNumbersFromIds,
       setEditedDocument,
       updateFileOrderFromPages,
-    ]
+    ],
   );
 
   return {
diff --git a/frontend/src/core/components/pageEditor/hooks/useFileColorMap.ts b/frontend/src/core/components/pageEditor/hooks/useFileColorMap.ts
index 463289a4e4..f6e9a9c7ed 100644
--- a/frontend/src/core/components/pageEditor/hooks/useFileColorMap.ts
+++ b/frontend/src/core/components/pageEditor/hooks/useFileColorMap.ts
@@ -1,5 +1,5 @@
-import { useMemo, useRef } from 'react';
-import { FileId } from '@app/types/file';
+import { useMemo, useRef } from "react";
+import { FileId } from "@app/types/file";
 
 /**
  * Maintains stable color assignments for a collection of file IDs.
@@ -8,7 +8,7 @@ import { FileId } from '@app/types/file';
 export function useFileColorMap(fileIds: FileId[]): Map<FileId, number> {
   const assignmentsRef = useRef(new Map<FileId, number>());
 
-  const serializedIds = useMemo(() => fileIds.join(','), [fileIds]);
+  const serializedIds = useMemo(() => fileIds.join(","), [fileIds]);
 
   return useMemo(() => {
     const assignments = assignmentsRef.current;
diff --git a/frontend/src/core/components/pageEditor/hooks/useInitialPageDocument.ts b/frontend/src/core/components/pageEditor/hooks/useInitialPageDocument.ts
index 2d1fe0a066..5fda7123eb 100644
--- a/frontend/src/core/components/pageEditor/hooks/useInitialPageDocument.ts
+++ b/frontend/src/core/components/pageEditor/hooks/useInitialPageDocument.ts
@@ -1,6 +1,6 @@
-import { useState, useEffect, useRef } from 'react';
-import { usePageDocument } from '@app/components/pageEditor/hooks/usePageDocument';
-import { PDFDocument } from '@app/types/pageEditor';
+import { useState, useEffect, useRef } from "react";
+import { usePageDocument } from "@app/components/pageEditor/hooks/usePageDocument";
+import { PDFDocument } from "@app/types/pageEditor";
 
 /**
  * Hook that calls usePageDocument but only returns the FIRST non-null result
@@ -8,7 +8,9 @@ import { PDFDocument } from '@app/types/pageEditor';
  */
 export function useInitialPageDocument(): PDFDocument | null {
   const { document: liveDocument } = usePageDocument();
-  const [initialDocument, setInitialDocument] = useState<PDFDocument | null>(null);
+  const [initialDocument, setInitialDocument] = useState<PDFDocument | null>(
+    null,
+  );
   const lastDocumentIdRef = useRef<string | null>(null);
   const liveDocumentId = liveDocument?.id ?? null;
 
@@ -30,7 +32,11 @@ export function useInitialPageDocument(): PDFDocument | null {
       return;
     }
 
-    console.log('📄 useInitialPageDocument: Captured initial document with', liveDocument.pages.length, 'pages');
+    console.log(
+      "📄 useInitialPageDocument: Captured initial document with",
+      liveDocument.pages.length,
+      "pages",
+    );
     setInitialDocument(liveDocument);
   }, [liveDocument, initialDocument]);
 
diff --git a/frontend/src/core/components/pageEditor/hooks/usePageDocument.ts b/frontend/src/core/components/pageEditor/hooks/usePageDocument.ts
index 6494e7bd0a..001ffb2abb 100644
--- a/frontend/src/core/components/pageEditor/hooks/usePageDocument.ts
+++ b/frontend/src/core/components/pageEditor/hooks/usePageDocument.ts
@@ -1,9 +1,9 @@
-import { useMemo, useEffect, useRef, useState } from 'react';
-import { useFileState } from '@app/contexts/FileContext';
-import { usePageEditor } from '@app/contexts/PageEditorContext';
-import { PDFDocument, PDFPage } from '@app/types/pageEditor';
-import { FileId } from '@app/types/file';
-import { FileAnalyzer } from '@app/services/fileAnalyzer';
+import { useMemo, useEffect, useRef, useState } from "react";
+import { useFileState } from "@app/contexts/FileContext";
+import { usePageEditor } from "@app/contexts/PageEditorContext";
+import { PDFDocument, PDFPage } from "@app/types/pageEditor";
+import { FileId } from "@app/types/file";
+import { FileAnalyzer } from "@app/services/fileAnalyzer";
 
 export interface PageDocumentHook {
   document: PDFDocument | null;
@@ -17,7 +17,12 @@ export interface PageDocumentHook {
  */
 export function usePageDocument(): PageDocumentHook {
   const { state, selectors } = useFileState();
-  const { fileOrder, currentPages, persistedDocument, persistedDocumentSignature } = usePageEditor();
+  const {
+    fileOrder,
+    currentPages,
+    persistedDocument,
+    persistedDocumentSignature,
+  } = usePageEditor();
 
   // Use PageEditorContext's fileOrder instead of FileContext's global order
   // This ensures the page editor respects its own workspace ordering
@@ -26,15 +31,15 @@ export function usePageDocument(): PageDocumentHook {
   // Derive selected file IDs directly from FileContext (single source of truth)
   // Filter to only include PDF files (PageEditor only supports PDFs)
   // Use stable string keys to prevent infinite loops
-  const allFileIdsKey = allFileIds.join(',');
-  const selectedFileIdsKey = [...state.ui.selectedFileIds].sort().join(',');
+  const allFileIdsKey = allFileIds.join(",");
+  const selectedFileIdsKey = [...state.ui.selectedFileIds].sort().join(",");
   const activeFilesSignature = selectors.getFilesSignature();
 
   // Get ALL PDF files (selected or not) for document building with placeholders
   const activeFileIds = useMemo(() => {
-    return allFileIds.filter(id => {
+    return allFileIds.filter((id) => {
       const stub = selectors.getStirlingFileStub(id);
-      return stub?.name?.toLowerCase().endsWith('.pdf') ?? false;
+      return stub?.name?.toLowerCase().endsWith(".pdf") ?? false;
     });
   }, [allFileIdsKey, activeFilesSignature, selectors]);
 
@@ -55,9 +60,12 @@ export function usePageDocument(): PageDocumentHook {
   const globalProcessing = state.ui.isProcessing;
 
   // Get primary file record outside useMemo to track processedFile changes
-  const primaryStirlingFileStub = primaryFileId ? selectors.getStirlingFileStub(primaryFileId) : null;
+  const primaryStirlingFileStub = primaryFileId
+    ? selectors.getStirlingFileStub(primaryFileId)
+    : null;
   const processedFilePages = primaryStirlingFileStub?.processedFile?.pages;
-  const processedFileTotalPages = primaryStirlingFileStub?.processedFile?.totalPages;
+  const processedFileTotalPages =
+    primaryStirlingFileStub?.processedFile?.totalPages;
 
   const placeholderDocumentRef = useRef<PDFDocument | null>(null);
   const [placeholderVersion, setPlaceholderVersion] = useState(0);
@@ -65,20 +73,20 @@ export function usePageDocument(): PageDocumentHook {
   useEffect(() => {
     if (!primaryFileId) {
       placeholderDocumentRef.current = null;
-      setPlaceholderVersion(v => v + 1);
+      setPlaceholderVersion((v) => v + 1);
       return;
     }
 
     if (primaryStirlingFileStub?.processedFile) {
       placeholderDocumentRef.current = null;
-      setPlaceholderVersion(v => v + 1);
+      setPlaceholderVersion((v) => v + 1);
       return;
     }
 
     const file = selectors.getFile(primaryFileId);
     if (!file) {
       placeholderDocumentRef.current = null;
-      setPlaceholderVersion(v => v + 1);
+      setPlaceholderVersion((v) => v + 1);
       return;
     }
 
@@ -89,30 +97,34 @@ export function usePageDocument(): PageDocumentHook {
         const analysis = await FileAnalyzer.quickPDFAnalysis(file);
         if (canceled) return;
         const totalPages = Math.max(1, analysis.pageCount || 1);
-        const pages: PDFPage[] = Array.from({ length: totalPages }, (_, index) => ({
-          id: `placeholder-${primaryFileId}-page-${index + 1}`,
-          pageNumber: index + 1,
-          thumbnail: null,
-          rotation: 0,
-          selected: false,
-          originalFileId: primaryFileId,
-          originalPageNumber: index + 1,
-        }));
+        const pages: PDFPage[] = Array.from(
+          { length: totalPages },
+          (_, index) => ({
+            id: `placeholder-${primaryFileId}-page-${index + 1}`,
+            pageNumber: index + 1,
+            thumbnail: null,
+            rotation: 0,
+            selected: false,
+            originalFileId: primaryFileId,
+            originalPageNumber: index + 1,
+          }),
+        );
 
         if (!canceled) {
           placeholderDocumentRef.current = {
             id: `placeholder-${primaryFileId}`,
-            name: selectors.getStirlingFileStub(primaryFileId)?.name ?? file.name,
+            name:
+              selectors.getStirlingFileStub(primaryFileId)?.name ?? file.name,
             file,
             pages,
             totalPages,
           };
-          setPlaceholderVersion(v => v + 1);
+          setPlaceholderVersion((v) => v + 1);
         }
       } catch {
         if (!canceled) {
           placeholderDocumentRef.current = null;
-          setPlaceholderVersion(v => v + 1);
+          setPlaceholderVersion((v) => v + 1);
         }
       }
     };
@@ -126,11 +138,11 @@ export function usePageDocument(): PageDocumentHook {
 
   // Compute merged document with stable signature (prevents infinite loops)
   const currentPagesSignature = useMemo(() => {
-    return currentPages ? currentPages.map(page => page.id).join(',') : '';
+    return currentPages ? currentPages.map((page) => page.id).join(",") : "";
   }, [currentPages]);
 
   const mergedPdfDocument = useMemo((): PDFDocument | null => {
-    console.log('[usePageDocument] Building document:', {
+    console.log("[usePageDocument] Building document:", {
       activeFileIds: activeFileIds.length,
       selectedActiveFileIds: selectedActiveFileIds.length,
       hasPersistedDoc: !!persistedDocument,
@@ -140,64 +152,85 @@ export function usePageDocument(): PageDocumentHook {
     });
 
     if (activeFileIds.length === 0) {
-      console.log('[usePageDocument] No active files, returning null');
+      console.log("[usePageDocument] No active files, returning null");
       return null;
     }
 
-  // Check if persisted document is still valid
-  // Must match signature AND have the same number of source files
-  const persistedFileIds = persistedDocument
-    ? Array.from(new Set(persistedDocument.pages.map(p => p.originalFileId).filter(Boolean)))
-    : [];
-  const persistedIsValid =
-    persistedDocument &&
-    persistedDocumentSignature &&
-    persistedDocumentSignature === currentPagesSignature &&
-    currentPagesSignature.length > 0 &&
-    persistedFileIds.length === activeFileIds.length; // Ensure file count matches
+    // Check if persisted document is still valid
+    // Must match signature AND have the same number of source files
+    const persistedFileIds = persistedDocument
+      ? Array.from(
+          new Set(
+            persistedDocument.pages
+              .map((p) => p.originalFileId)
+              .filter(Boolean),
+          ),
+        )
+      : [];
+    const persistedIsValid =
+      persistedDocument &&
+      persistedDocumentSignature &&
+      persistedDocumentSignature === currentPagesSignature &&
+      currentPagesSignature.length > 0 &&
+      persistedFileIds.length === activeFileIds.length; // Ensure file count matches
 
-  if (persistedIsValid) {
-    console.log('[usePageDocument] Using persisted document');
-    return persistedDocument;
-  } else if (persistedDocument) {
-    console.log('[usePageDocument] Persisted document invalid - rebuilding:', {
-      sigMatch: persistedDocumentSignature === currentPagesSignature,
-      persistedFiles: persistedFileIds.length,
-      activeFiles: activeFileIds.length,
-    });
-  }
+    if (persistedIsValid) {
+      console.log("[usePageDocument] Using persisted document");
+      return persistedDocument;
+    } else if (persistedDocument) {
+      console.log(
+        "[usePageDocument] Persisted document invalid - rebuilding:",
+        {
+          sigMatch: persistedDocumentSignature === currentPagesSignature,
+          persistedFiles: persistedFileIds.length,
+          activeFiles: activeFileIds.length,
+        },
+      );
+    }
 
-  if (!primaryStirlingFileStub?.processedFile && placeholderDocumentRef.current) {
-    return placeholderDocumentRef.current;
-  }
+    if (
+      !primaryStirlingFileStub?.processedFile &&
+      placeholderDocumentRef.current
+    ) {
+      return placeholderDocumentRef.current;
+    }
 
-  const primaryFile = primaryFileId ? selectors.getFile(primaryFileId) : null;
+    const primaryFile = primaryFileId ? selectors.getFile(primaryFileId) : null;
 
     // If we have file IDs but no file record, something is wrong - return null to show loading
     if (!primaryStirlingFileStub) {
-      console.log('🎬 PageEditor: No primary file record found, showing loading');
+      console.log(
+        "🎬 PageEditor: No primary file record found, showing loading",
+      );
       return null;
     }
 
-    const namingFileIds = selectedActiveFileIds.length > 0 ? selectedActiveFileIds : activeFileIds;
+    const namingFileIds =
+      selectedActiveFileIds.length > 0 ? selectedActiveFileIds : activeFileIds;
 
     const name =
       namingFileIds.length <= 1
-        ? (namingFileIds[0]
-            ? selectors.getStirlingFileStub(namingFileIds[0])?.name ?? 'document.pdf'
-            : 'document.pdf')
+        ? namingFileIds[0]
+          ? (selectors.getStirlingFileStub(namingFileIds[0])?.name ??
+            "document.pdf")
+          : "document.pdf"
         : namingFileIds
-            .map(id => (selectors.getStirlingFileStub(id)?.name ?? 'file').replace(/\.pdf$/i, ''))
-            .join(' + ');
+            .map((id) =>
+              (selectors.getStirlingFileStub(id)?.name ?? "file").replace(
+                /\.pdf$/i,
+                "",
+              ),
+            )
+            .join(" + ");
 
     // Build page insertion map from files with insertion positions
     const insertionMap = new Map<string, FileId[]>(); // insertAfterPageId -> fileIds
     const originalFileIds: FileId[] = [];
 
-    activeFileIds.forEach(fileId => {
+    activeFileIds.forEach((fileId) => {
       const record = selectors.getStirlingFileStub(fileId);
       if (record?.insertAfterPageId !== undefined) {
-        console.log('[usePageDocument] File has insertAfterPageId:', {
+        console.log("[usePageDocument] File has insertAfterPageId:", {
           fileId,
           insertAfterPageId: record.insertAfterPageId,
         });
@@ -210,7 +243,7 @@ export function usePageDocument(): PageDocumentHook {
       }
     });
 
-    console.log('[usePageDocument] File categorization:', {
+    console.log("[usePageDocument] File categorization:", {
       originalFiles: originalFileIds.length,
       filesToInsert: insertionMap.size,
       totalActive: activeFileIds.length,
@@ -220,7 +253,11 @@ export function usePageDocument(): PageDocumentHook {
     let pages: PDFPage[];
 
     // Helper function to create pages from a file (or placeholder if deselected)
-    const createPagesFromFile = (fileId: FileId, startPageNumber: number, isSelected: boolean): PDFPage[] => {
+    const createPagesFromFile = (
+      fileId: FileId,
+      startPageNumber: number,
+      isSelected: boolean,
+    ): PDFPage[] => {
       const stirlingFileStub = selectors.getStirlingFileStub(fileId);
       if (!stirlingFileStub) {
         return [];
@@ -228,17 +265,19 @@ export function usePageDocument(): PageDocumentHook {
 
       // If file is deselected, create a single placeholder page
       if (!isSelected) {
-        return [{
-          id: `${fileId}-placeholder`,
-          pageNumber: startPageNumber,
-          originalPageNumber: 1,
-          originalFileId: fileId,
-          rotation: 0,
-          thumbnail: null,
-          selected: false,
-          splitAfter: false,
-          isPlaceholder: true,
-        }];
+        return [
+          {
+            id: `${fileId}-placeholder`,
+            pageNumber: startPageNumber,
+            originalPageNumber: 1,
+            originalFileId: fileId,
+            rotation: 0,
+            thumbnail: null,
+            selected: false,
+            splitAfter: false,
+            isPlaceholder: true,
+          },
+        ];
       }
 
       const processedFile = stirlingFileStub.processedFile;
@@ -262,32 +301,37 @@ export function usePageDocument(): PageDocumentHook {
 
       if (processedFile?.totalPages) {
         // Fallback: create pages without thumbnails but with correct count
-        return Array.from({ length: processedFile.totalPages }, (_, pageIndex) => ({
-          id: `${fileId}-${pageIndex + 1}`,
-          pageNumber: startPageNumber + pageIndex,
-          originalPageNumber: pageIndex + 1,
+        return Array.from(
+          { length: processedFile.totalPages },
+          (_, pageIndex) => ({
+            id: `${fileId}-${pageIndex + 1}`,
+            pageNumber: startPageNumber + pageIndex,
+            originalPageNumber: pageIndex + 1,
+            originalFileId: fileId,
+            rotation: 0,
+            thumbnail: null,
+            selected: false,
+            splitAfter: false,
+            isPlaceholder: false,
+          }),
+        );
+      }
+
+      // No processedFile yet - create a single loading placeholder
+      // This will be replaced when processing completes
+      return [
+        {
+          id: `${fileId}-loading`,
+          pageNumber: startPageNumber,
+          originalPageNumber: 1,
           originalFileId: fileId,
           rotation: 0,
           thumbnail: null,
           selected: false,
           splitAfter: false,
-          isPlaceholder: false,
-        }));
-      }
-
-      // No processedFile yet - create a single loading placeholder
-      // This will be replaced when processing completes
-      return [{
-        id: `${fileId}-loading`,
-        pageNumber: startPageNumber,
-        originalPageNumber: 1,
-        originalFileId: fileId,
-        rotation: 0,
-        thumbnail: null,
-        selected: false,
-        splitAfter: false,
-        isPlaceholder: true,
-      }];
+          isPlaceholder: true,
+        },
+      ];
     };
 
     // Collect all pages from original files, respecting their previous positions
@@ -304,7 +348,7 @@ export function usePageDocument(): PageDocumentHook {
     });
 
     const originalFilePages: PDFPage[] = [];
-    sortedOriginalFileIds.forEach(fileId => {
+    sortedOriginalFileIds.forEach((fileId) => {
       const isSelected = selectedFileIdsSet.has(fileId);
       const filePages = createPagesFromFile(fileId, 1, isSelected); // Temporary numbering
       originalFilePages.push(...filePages);
@@ -313,18 +357,20 @@ export function usePageDocument(): PageDocumentHook {
     // Start with all original pages numbered sequentially
     pages = originalFilePages.map((page, index) => ({
       ...page,
-      pageNumber: index + 1
+      pageNumber: index + 1,
     }));
 
     // Process each insertion by finding the page ID and inserting after it
     for (const [insertAfterPageId, fileIds] of insertionMap.entries()) {
-      const targetPageIndex = pages.findIndex(p => p.id === insertAfterPageId);
+      const targetPageIndex = pages.findIndex(
+        (p) => p.id === insertAfterPageId,
+      );
 
       if (targetPageIndex === -1) continue;
 
       // Collect all pages to insert
       const allNewPages: PDFPage[] = [];
-      fileIds.forEach(fileId => {
+      fileIds.forEach((fileId) => {
         const isSelected = selectedFileIdsSet.has(fileId);
         const insertedPages = createPagesFromFile(fileId, 1, isSelected);
         allNewPages.push(...insertedPages);
@@ -350,14 +396,22 @@ export function usePageDocument(): PageDocumentHook {
       pageNumber: index + 1,
     }));
 
-    const currentPagesSet = currentPages ? new Set(currentPages.map(page => page.id)) : null;
-    if (currentPagesSet && currentPages && currentPagesSet.size === pages.length) {
-      const sameIds = pages.every(page => currentPagesSet.has(page.id));
+    const currentPagesSet = currentPages
+      ? new Set(currentPages.map((page) => page.id))
+      : null;
+    if (
+      currentPagesSet &&
+      currentPages &&
+      currentPagesSet.size === pages.length
+    ) {
+      const sameIds = pages.every((page) => currentPagesSet.has(page.id));
       if (sameIds) {
-        const mergedById = new Map(pages.map(page => [page.id, page]));
+        const mergedById = new Map(pages.map((page) => [page.id, page]));
         pages = currentPages.map((currentPage, index) => {
           const source = mergedById.get(currentPage.id);
-          const mergedPage = source ? { ...source, ...currentPage } : currentPage;
+          const mergedPage = source
+            ? { ...source, ...currentPage }
+            : currentPage;
           return {
             ...mergedPage,
             pageNumber: index + 1,
@@ -367,7 +421,7 @@ export function usePageDocument(): PageDocumentHook {
     }
 
     const mergedDoc: PDFDocument = {
-      id: activeFileIds.join('-'),
+      id: activeFileIds.join("-"),
       name,
       file: primaryFile!,
       pages,
@@ -406,6 +460,6 @@ export function usePageDocument(): PageDocumentHook {
   return {
     document: mergedPdfDocument,
     isVeryLargeDocument,
-    isLoading
+    isLoading,
   };
 }
diff --git a/frontend/src/core/components/pageEditor/hooks/usePageEditorDropdownState.ts b/frontend/src/core/components/pageEditor/hooks/usePageEditorDropdownState.ts
index cc8d51725d..ac26c142dc 100644
--- a/frontend/src/core/components/pageEditor/hooks/usePageEditorDropdownState.ts
+++ b/frontend/src/core/components/pageEditor/hooks/usePageEditorDropdownState.ts
@@ -1,8 +1,8 @@
-import { useMemo } from 'react';
-import { usePageEditor } from '@app/contexts/PageEditorContext';
-import { useFileState } from '@app/contexts/FileContext';
-import { FileId } from '@app/types/file';
-import { useFileColorMap } from '@app/components/pageEditor/hooks/useFileColorMap';
+import { useMemo } from "react";
+import { usePageEditor } from "@app/contexts/PageEditorContext";
+import { useFileState } from "@app/contexts/FileContext";
+import { FileId } from "@app/types/file";
+import { useFileColorMap } from "@app/components/pageEditor/hooks/useFileColorMap";
 
 export interface PageEditorDropdownFile {
   fileId: FileId;
@@ -21,15 +21,11 @@ export interface PageEditorDropdownState {
 }
 
 const isPdf = (name?: string | null) =>
-  typeof name === 'string' && name.toLowerCase().endsWith('.pdf');
+  typeof name === "string" && name.toLowerCase().endsWith(".pdf");
 
 export function usePageEditorDropdownState(): PageEditorDropdownState {
   const { state, selectors } = useFileState();
-  const {
-    toggleFileSelection,
-    reorderFiles,
-    fileOrder,
-  } = usePageEditor();
+  const { toggleFileSelection, reorderFiles, fileOrder } = usePageEditor();
 
   const pageEditorFiles = useMemo(() => {
     return fileOrder
@@ -39,7 +35,7 @@ export function usePageEditorDropdownState(): PageEditorDropdownState {
 
         return {
           fileId,
-          name: stub?.name || '',
+          name: stub?.name || "",
           versionNumber: stub?.versionNumber,
           isSelected: state.ui.selectedFileIds.includes(fileId),
         };
@@ -47,19 +43,30 @@ export function usePageEditorDropdownState(): PageEditorDropdownState {
       .filter((file): file is PageEditorDropdownFile => file !== null);
   }, [fileOrder, selectors, state.ui.selectedFileIds]);
 
-  const fileColorMap = useFileColorMap(pageEditorFiles.map((file) => file.fileId));
+  const fileColorMap = useFileColorMap(
+    pageEditorFiles.map((file) => file.fileId),
+  );
 
   const selectedCount = useMemo(
     () => pageEditorFiles.filter((file) => file.isSelected).length,
-    [pageEditorFiles]
+    [pageEditorFiles],
   );
 
-  return useMemo<PageEditorDropdownState>(() => ({
-    files: pageEditorFiles,
-    selectedCount,
-    totalCount: pageEditorFiles.length,
-    onToggleSelection: toggleFileSelection,
-    onReorder: reorderFiles,
-    fileColorMap,
-  }), [pageEditorFiles, selectedCount, toggleFileSelection, reorderFiles, fileColorMap]);
+  return useMemo<PageEditorDropdownState>(
+    () => ({
+      files: pageEditorFiles,
+      selectedCount,
+      totalCount: pageEditorFiles.length,
+      onToggleSelection: toggleFileSelection,
+      onReorder: reorderFiles,
+      fileColorMap,
+    }),
+    [
+      pageEditorFiles,
+      selectedCount,
+      toggleFileSelection,
+      reorderFiles,
+      fileColorMap,
+    ],
+  );
 }
diff --git a/frontend/src/core/components/pageEditor/hooks/usePageEditorExport.ts b/frontend/src/core/components/pageEditor/hooks/usePageEditorExport.ts
index 72cefce448..2aca4a1d07 100644
--- a/frontend/src/core/components/pageEditor/hooks/usePageEditorExport.ts
+++ b/frontend/src/core/components/pageEditor/hooks/usePageEditorExport.ts
@@ -1,9 +1,6 @@
 import { Dispatch, SetStateAction, useCallback } from "react";
 
-import type {
-  useFileActions,
-  useFileState,
-} from "@app/contexts/FileContext";
+import type { useFileActions, useFileState } from "@app/contexts/FileContext";
 import { documentManipulationService } from "@app/services/documentManipulationService";
 import { pdfExportService } from "@app/services/pdfExportService";
 import { exportProcessedDocumentsToFiles } from "@app/services/pdfExportHelpers";
@@ -47,7 +44,7 @@ const removePlaceholderPages = (document: PDFDocument): PDFDocument => {
 };
 
 const normalizeProcessedDocuments = (
-  processed: PDFDocument | PDFDocument[]
+  processed: PDFDocument | PDFDocument[],
 ): PDFDocument | PDFDocument[] => {
   if (Array.isArray(processed)) {
     const normalized = processed
@@ -115,22 +112,25 @@ export const usePageEditorExport = ({
         documentManipulationService.applyDOMChangesToDocument(
           displayDocument,
           displayDocument,
-          splitPositions
+          splitPositions,
         );
 
-      const normalizedDocuments = normalizeProcessedDocuments(processedDocuments);
+      const normalizedDocuments =
+        normalizeProcessedDocuments(processedDocuments);
       const documentWithDOMState = Array.isArray(normalizedDocuments)
         ? normalizedDocuments[0]
         : normalizedDocuments;
 
       if (!documentWithDOMState || documentWithDOMState.pages.length === 0) {
-        console.warn("Export skipped: no concrete pages available after filtering placeholders.");
+        console.warn(
+          "Export skipped: no concrete pages available after filtering placeholders.",
+        );
         setExportLoading(false);
         return;
       }
 
       const validSelectedPageIds = selectedPageIds.filter((pageId) =>
-        documentWithDOMState.pages.some((page) => page.id === pageId)
+        documentWithDOMState.pages.some((page) => page.id === pageId),
       );
 
       const sourceFiles = getSourceFiles();
@@ -140,12 +140,18 @@ export const usePageEditorExport = ({
             documentWithDOMState,
             sourceFiles,
             validSelectedPageIds,
-            { selectedOnly: true, filename: exportFilename }
+            {
+              selectedOnly: true,
+              filename: exportFilename,
+            },
           )
         : await pdfExportService.exportPDF(
             documentWithDOMState,
             validSelectedPageIds,
-            { selectedOnly: true, filename: exportFilename }
+            {
+              selectedOnly: true,
+              filename: exportFilename,
+            },
           );
 
       pdfExportService.downloadFile(result.blob, result.filename);
@@ -175,16 +181,21 @@ export const usePageEditorExport = ({
         documentManipulationService.applyDOMChangesToDocument(
           displayDocument,
           displayDocument,
-          splitPositions
+          splitPositions,
         );
 
-      const normalizedDocuments = normalizeProcessedDocuments(processedDocuments);
+      const normalizedDocuments =
+        normalizeProcessedDocuments(processedDocuments);
 
       if (
-        (Array.isArray(normalizedDocuments) && normalizedDocuments.length === 0) ||
-        (!Array.isArray(normalizedDocuments) && normalizedDocuments.pages.length === 0)
+        (Array.isArray(normalizedDocuments) &&
+          normalizedDocuments.length === 0) ||
+        (!Array.isArray(normalizedDocuments) &&
+          normalizedDocuments.pages.length === 0)
       ) {
-        console.warn("Export skipped: no concrete pages available after filtering placeholders.");
+        console.warn(
+          "Export skipped: no concrete pages available after filtering placeholders.",
+        );
         setExportLoading(false);
         return;
       }
@@ -194,7 +205,7 @@ export const usePageEditorExport = ({
       const files = await exportProcessedDocumentsToFiles(
         normalizedDocuments,
         sourceFiles,
-        exportFilename
+        exportFilename,
       );
 
       if (files.length > 1) {
@@ -239,16 +250,21 @@ export const usePageEditorExport = ({
         documentManipulationService.applyDOMChangesToDocument(
           displayDocument,
           displayDocument,
-          splitPositions
+          splitPositions,
         );
 
-      const normalizedDocuments = normalizeProcessedDocuments(processedDocuments);
+      const normalizedDocuments =
+        normalizeProcessedDocuments(processedDocuments);
 
       if (
-        (Array.isArray(normalizedDocuments) && normalizedDocuments.length === 0) ||
-        (!Array.isArray(normalizedDocuments) && normalizedDocuments.pages.length === 0)
+        (Array.isArray(normalizedDocuments) &&
+          normalizedDocuments.length === 0) ||
+        (!Array.isArray(normalizedDocuments) &&
+          normalizedDocuments.pages.length === 0)
       ) {
-        console.warn("Apply changes skipped: no concrete pages available after filtering placeholders.");
+        console.warn(
+          "Apply changes skipped: no concrete pages available after filtering placeholders.",
+        );
         setExportLoading(false);
         return;
       }
@@ -258,11 +274,11 @@ export const usePageEditorExport = ({
       const files = await exportProcessedDocumentsToFiles(
         normalizedDocuments,
         sourceFiles,
-        exportFilename
+        exportFilename,
       );
 
       // Add "_multitool" suffix to filenames
-      const renamedFiles = files.map(file => {
+      const renamedFiles = files.map((file) => {
         const nameParts = file.name.match(/^(.+?)(\.pdf)$/i);
         if (nameParts) {
           const baseName = nameParts[1];
@@ -300,7 +316,7 @@ export const usePageEditorExport = ({
         if (sourceStub?.localFilePath) {
           actions.updateStirlingFileStub(newStirlingFiles[0].fileId, {
             localFilePath: sourceStub.localFilePath,
-            isDirty: true
+            isDirty: true,
           });
         }
       }
diff --git a/frontend/src/core/components/pageEditor/hooks/usePageEditorState.ts b/frontend/src/core/components/pageEditor/hooks/usePageEditorState.ts
index 570f0d08b1..13a96ec3ed 100644
--- a/frontend/src/core/components/pageEditor/hooks/usePageEditorState.ts
+++ b/frontend/src/core/components/pageEditor/hooks/usePageEditorState.ts
@@ -1,5 +1,5 @@
-import { useState, useCallback } from 'react';
-import React from 'react';
+import { useState, useCallback } from "react";
+import React from "react";
 
 export interface PageEditorState {
   // Selection state
@@ -23,7 +23,7 @@ export interface PageEditorState {
   setIsAnimating: (animating: boolean) => void;
   setSplitPositions: React.Dispatch<React.SetStateAction<Set<string>>>;
   setExportLoading: (loading: boolean) => void;
-  
+
   // Helper functions
   togglePage: (pageId: string) => void;
   toggleSelectAll: (allPageIds: string[]) => void;
@@ -38,22 +38,22 @@ export function usePageEditorState(): PageEditorState {
   // Selection state
   const [selectionMode, setSelectionMode] = useState(false);
   const [selectedPageIds, setSelectedPageIds] = useState<string[]>([]);
-  
+
   // Animation state
   const [movingPage, setMovingPage] = useState<number | null>(null);
   const [isAnimating, setIsAnimating] = useState(false);
-  
+
   // Split state - position-based split tracking (replaces page-based splitAfter)
   const [splitPositions, setSplitPositions] = useState<Set<string>>(new Set());
-  
+
   // Export state
   const [exportLoading, setExportLoading] = useState(false);
-  
+
   // Helper functions
   const togglePage = useCallback((pageId: string) => {
-    setSelectedPageIds(prev => {
+    setSelectedPageIds((prev) => {
       const newSelection = prev.includes(pageId)
-        ? prev.filter(id => id !== pageId)
+        ? prev.filter((id) => id !== pageId)
         : [...prev, pageId];
       return newSelection;
     });
@@ -61,17 +61,17 @@ export function usePageEditorState(): PageEditorState {
 
   const toggleSelectAll = useCallback((allPageIds: string[]) => {
     if (!allPageIds.length) return;
-    
-    setSelectedPageIds(prev => 
-      prev.length === allPageIds.length ? [] : allPageIds
+
+    setSelectedPageIds((prev) =>
+      prev.length === allPageIds.length ? [] : allPageIds,
     );
   }, []);
-  
+
   const animateReorder = useCallback(() => {
     setIsAnimating(true);
     setTimeout(() => setIsAnimating(false), 500);
   }, []);
-  
+
   return {
     // State
     selectionMode,
@@ -80,7 +80,7 @@ export function usePageEditorState(): PageEditorState {
     isAnimating,
     splitPositions,
     exportLoading,
-    
+
     // Setters
     setSelectionMode,
     setSelectedPageIds,
@@ -88,7 +88,7 @@ export function usePageEditorState(): PageEditorState {
     setIsAnimating,
     setSplitPositions,
     setExportLoading,
-    
+
     // Helpers
     togglePage,
     toggleSelectAll,
diff --git a/frontend/src/core/components/pageEditor/hooks/usePageSelectionManager.ts b/frontend/src/core/components/pageEditor/hooks/usePageSelectionManager.ts
index ac63c5efa9..e19b64f0cd 100644
--- a/frontend/src/core/components/pageEditor/hooks/usePageSelectionManager.ts
+++ b/frontend/src/core/components/pageEditor/hooks/usePageSelectionManager.ts
@@ -36,7 +36,7 @@ export const usePageSelectionManager = ({
         })
         .filter((num) => num > 0);
     },
-    [displayDocument]
+    [displayDocument],
   );
 
   const getPageIdsFromNumbers = useCallback(
@@ -49,7 +49,7 @@ export const usePageSelectionManager = ({
         })
         .filter((id) => id !== "");
     },
-    [displayDocument]
+    [displayDocument],
   );
 
   useEffect(() => {
@@ -107,7 +107,7 @@ export const usePageSelectionManager = ({
       const pageIds = getPageIdsFromNumbers(pageNumbers);
       setSelectedPageIds(pageIds);
     },
-    [getPageIdsFromNumbers, setSelectedPageIds]
+    [getPageIdsFromNumbers, setSelectedPageIds],
   );
 
   const updatePagesFromCSV = useCallback(
@@ -116,7 +116,7 @@ export const usePageSelectionManager = ({
       const normalized = parseSelection(override ?? csvInput, totalPages);
       handleSetSelectedPages(normalized);
     },
-    [csvInput, totalPages, handleSetSelectedPages]
+    [csvInput, totalPages, handleSetSelectedPages],
   );
 
   return {
diff --git a/frontend/src/core/components/pageEditor/hooks/useUndoManagerState.ts b/frontend/src/core/components/pageEditor/hooks/useUndoManagerState.ts
index 627742b15f..86fdf347d2 100644
--- a/frontend/src/core/components/pageEditor/hooks/useUndoManagerState.ts
+++ b/frontend/src/core/components/pageEditor/hooks/useUndoManagerState.ts
@@ -33,7 +33,7 @@ export const useUndoManagerState = ({
       undoManagerRef.current.executeCommand(command);
       setHasUnsavedChanges(true);
     },
-    [setHasUnsavedChanges]
+    [setHasUnsavedChanges],
   );
 
   const handleUndo = useCallback(() => {
diff --git a/frontend/src/core/components/pageEditor/pageEditorRightRailButtons.tsx b/frontend/src/core/components/pageEditor/pageEditorRightRailButtons.tsx
index 3036982ac9..97a5ffff16 100644
--- a/frontend/src/core/components/pageEditor/pageEditorRightRailButtons.tsx
+++ b/frontend/src/core/components/pageEditor/pageEditorRightRailButtons.tsx
@@ -1,8 +1,11 @@
-import { useMemo } from 'react';
-import { useTranslation } from 'react-i18next';
-import { useRightRailButtons, RightRailButtonWithAction } from '@app/hooks/useRightRailButtons';
-import LocalIcon from '@app/components/shared/LocalIcon';
-import PageSelectByNumberButton from '@app/components/pageEditor/PageSelectByNumberButton';
+import { useMemo } from "react";
+import { useTranslation } from "react-i18next";
+import {
+  useRightRailButtons,
+  RightRailButtonWithAction,
+} from "@app/hooks/useRightRailButtons";
+import LocalIcon from "@app/components/shared/LocalIcon";
+import PageSelectByNumberButton from "@app/components/pageEditor/PageSelectByNumberButton";
 
 interface PageEditorRightRailButtonsParams {
   totalPages: number;
@@ -22,7 +25,9 @@ interface PageEditorRightRailButtonsParams {
   closePdf: () => void;
 }
 
-export function usePageEditorRightRailButtons(params: PageEditorRightRailButtonsParams) {
+export function usePageEditorRightRailButtons(
+  params: PageEditorRightRailButtonsParams,
+) {
   const {
     totalPages,
     selectedPageCount,
@@ -44,43 +49,58 @@ export function usePageEditorRightRailButtons(params: PageEditorRightRailButtons
   const { t, i18n } = useTranslation();
 
   // Lift i18n labels out of memo for clarity
-  const selectAllLabel = t('rightRail.selectAll', 'Select All');
-  const deselectAllLabel = t('rightRail.deselectAll', 'Deselect All');
-  const selectByNumberLabel = t('rightRail.selectByNumber', 'Select by Page Numbers');
-  const deleteSelectedLabel = t('rightRail.deleteSelected', 'Delete Selected Pages');
-  const exportSelectedLabel = t('rightRail.exportSelected', 'Export Selected Pages');
-  const saveChangesLabel = t('rightRail.saveChanges', 'Save Changes');
-  const closePdfLabel = t('rightRail.closePdf', 'Close PDF');
+  const selectAllLabel = t("rightRail.selectAll", "Select All");
+  const deselectAllLabel = t("rightRail.deselectAll", "Deselect All");
+  const selectByNumberLabel = t(
+    "rightRail.selectByNumber",
+    "Select by Page Numbers",
+  );
+  const deleteSelectedLabel = t(
+    "rightRail.deleteSelected",
+    "Delete Selected Pages",
+  );
+  const exportSelectedLabel = t(
+    "rightRail.exportSelected",
+    "Export Selected Pages",
+  );
+  const saveChangesLabel = t("rightRail.saveChanges", "Save Changes");
+  const closePdfLabel = t("rightRail.closePdf", "Close PDF");
 
   const buttons = useMemo<RightRailButtonWithAction[]>(() => {
     return [
       {
-        id: 'page-select-all',
+        id: "page-select-all",
         icon: <LocalIcon icon="select-all" width="1.5rem" height="1.5rem" />,
         tooltip: selectAllLabel,
         ariaLabel: selectAllLabel,
-        section: 'top' as const,
+        section: "top" as const,
         order: 10,
         disabled: totalPages === 0 || selectedPageCount === totalPages,
         visible: totalPages > 0,
         onClick: handleSelectAll,
       },
       {
-        id: 'page-deselect-all',
-        icon: <LocalIcon icon="crop-square-outline" width="1.5rem" height="1.5rem" />,
+        id: "page-deselect-all",
+        icon: (
+          <LocalIcon
+            icon="crop-square-outline"
+            width="1.5rem"
+            height="1.5rem"
+          />
+        ),
         tooltip: deselectAllLabel,
         ariaLabel: deselectAllLabel,
-        section: 'top' as const,
+        section: "top" as const,
         order: 20,
         disabled: selectedPageCount === 0,
         visible: totalPages > 0,
         onClick: handleDeselectAll,
       },
       {
-        id: 'page-select-by-number',
+        id: "page-select-by-number",
         tooltip: selectByNumberLabel,
         ariaLabel: selectByNumberLabel,
-        section: 'top' as const,
+        section: "top" as const,
         order: 30,
         disabled: totalPages === 0,
         visible: totalPages > 0,
@@ -98,44 +118,50 @@ export function usePageEditorRightRailButtons(params: PageEditorRightRailButtons
         ),
       },
       {
-        id: 'page-delete-selected',
-        icon: <LocalIcon icon="delete-outline-rounded" width="1.5rem" height="1.5rem" />,
+        id: "page-delete-selected",
+        icon: (
+          <LocalIcon
+            icon="delete-outline-rounded"
+            width="1.5rem"
+            height="1.5rem"
+          />
+        ),
         tooltip: deleteSelectedLabel,
         ariaLabel: deleteSelectedLabel,
-        section: 'top' as const,
+        section: "top" as const,
         order: 40,
         disabled: selectedPageCount === 0,
         visible: totalPages > 0,
         onClick: handleDelete,
       },
       {
-        id: 'page-export-selected',
+        id: "page-export-selected",
         icon: <LocalIcon icon="download" width="1.5rem" height="1.5rem" />,
         tooltip: exportSelectedLabel,
         ariaLabel: exportSelectedLabel,
-        section: 'top' as const,
+        section: "top" as const,
         order: 50,
         disabled: selectedPageCount === 0 || exportLoading,
         visible: totalPages > 0,
         onClick: onExportSelected,
       },
       {
-        id: 'page-save-changes',
+        id: "page-save-changes",
         icon: <LocalIcon icon="save" width="1.5rem" height="1.5rem" />,
         tooltip: saveChangesLabel,
         ariaLabel: saveChangesLabel,
-        section: 'top' as const,
+        section: "top" as const,
         order: 55,
         disabled: totalPages === 0 || exportLoading,
         visible: totalPages > 0,
         onClick: onSaveChanges,
       },
       {
-        id: 'page-close-pdf',
+        id: "page-close-pdf",
         icon: <LocalIcon icon="close-rounded" width="1.5rem" height="1.5rem" />,
         tooltip: closePdfLabel,
         ariaLabel: closePdfLabel,
-        section: 'top' as const,
+        section: "top" as const,
         order: 60,
         disabled: activeFileCount === 0,
         visible: activeFileCount > 0,
diff --git a/frontend/src/core/components/pageEditor/utils/splitPositions.ts b/frontend/src/core/components/pageEditor/utils/splitPositions.ts
index 32630a1107..ee8f03988c 100644
--- a/frontend/src/core/components/pageEditor/utils/splitPositions.ts
+++ b/frontend/src/core/components/pageEditor/utils/splitPositions.ts
@@ -1,9 +1,11 @@
-import { PDFDocument } from '@app/types/pageEditor';
+import { PDFDocument } from "@app/types/pageEditor";
 
 /**
  * Build a map from page ID to its index in the provided document.
  */
-export function buildPageIdIndexMap(document: PDFDocument | null): Map<string, number> {
+export function buildPageIdIndexMap(
+  document: PDFDocument | null,
+): Map<string, number> {
   const map = new Map<string, number>();
   if (!document) return map;
   document.pages.forEach((page, index) => {
@@ -16,7 +18,10 @@ export function buildPageIdIndexMap(document: PDFDocument | null): Map<string, n
  * Convert a set of split page IDs (the page preceding each split) into
  * the current index positions inside the document.
  */
-export function convertSplitPageIdsToIndexes(document: PDFDocument | null, splitPageIds: Set<string>): Set<number> {
+export function convertSplitPageIdsToIndexes(
+  document: PDFDocument | null,
+  splitPageIds: Set<string>,
+): Set<number> {
   const indexes = new Set<number>();
   if (!document || !splitPageIds || splitPageIds.size === 0) {
     return indexes;
diff --git a/frontend/src/core/components/quickAccessBar/QuickAccessBarFooterExtensions.tsx b/frontend/src/core/components/quickAccessBar/QuickAccessBarFooterExtensions.tsx
index 0c595d5e7d..aa6c76afe4 100644
--- a/frontend/src/core/components/quickAccessBar/QuickAccessBarFooterExtensions.tsx
+++ b/frontend/src/core/components/quickAccessBar/QuickAccessBarFooterExtensions.tsx
@@ -7,6 +7,8 @@ interface QuickAccessBarFooterExtensionsProps {
   className?: string;
 }
 
-export function QuickAccessBarFooterExtensions(_props: QuickAccessBarFooterExtensionsProps) {
+export function QuickAccessBarFooterExtensions(
+  _props: QuickAccessBarFooterExtensionsProps,
+) {
   return null;
 }
diff --git a/frontend/src/core/components/rightRail/RightRailFooterExtensions.tsx b/frontend/src/core/components/rightRail/RightRailFooterExtensions.tsx
index 5f0021f1d8..1a90673d6a 100644
--- a/frontend/src/core/components/rightRail/RightRailFooterExtensions.tsx
+++ b/frontend/src/core/components/rightRail/RightRailFooterExtensions.tsx
@@ -2,6 +2,8 @@ interface RightRailFooterExtensionsProps {
   className?: string;
 }
 
-export function RightRailFooterExtensions(_props: RightRailFooterExtensionsProps) {
+export function RightRailFooterExtensions(
+  _props: RightRailFooterExtensionsProps,
+) {
   return null;
 }
diff --git a/frontend/src/core/components/shared/AllToolsNavButton.tsx b/frontend/src/core/components/shared/AllToolsNavButton.tsx
index 3ba3bb70b4..40e6f5641b 100644
--- a/frontend/src/core/components/shared/AllToolsNavButton.tsx
+++ b/frontend/src/core/components/shared/AllToolsNavButton.tsx
@@ -1,11 +1,14 @@
-import React from 'react';
-import { useTranslation } from 'react-i18next';
-import AppsIcon from '@mui/icons-material/AppsRounded';
-import { useToolWorkflow } from '@app/contexts/ToolWorkflowContext';
-import { useNavigationState, useNavigationActions } from '@app/contexts/NavigationContext';
-import { useSidebarNavigation } from '@app/hooks/useSidebarNavigation';
-import { handleUnlessSpecialClick } from '@app/utils/clickHandlers';
-import QuickAccessButton from '@app/components/shared/quickAccessBar/QuickAccessButton';
+import React from "react";
+import { useTranslation } from "react-i18next";
+import AppsIcon from "@mui/icons-material/AppsRounded";
+import { useToolWorkflow } from "@app/contexts/ToolWorkflowContext";
+import {
+  useNavigationState,
+  useNavigationActions,
+} from "@app/contexts/NavigationContext";
+import { useSidebarNavigation } from "@app/hooks/useSidebarNavigation";
+import { handleUnlessSpecialClick } from "@app/utils/clickHandlers";
+import QuickAccessButton from "@app/components/shared/quickAccessBar/QuickAccessButton";
 
 interface AllToolsNavButtonProps {
   activeButton: string;
@@ -17,13 +20,18 @@ const AllToolsNavButton: React.FC<AllToolsNavButtonProps> = ({
   setActiveButton,
 }) => {
   const { t } = useTranslation();
-  const { handleReaderToggle, handleBackToTools, selectedToolKey, leftPanelView } = useToolWorkflow();
+  const {
+    handleReaderToggle,
+    handleBackToTools,
+    selectedToolKey,
+    leftPanelView,
+  } = useToolWorkflow();
   const { hasUnsavedChanges } = useNavigationState();
   const { actions: navigationActions } = useNavigationActions();
   const { getHomeNavigation } = useSidebarNavigation();
 
   const performNavigation = () => {
-    setActiveButton('tools');
+    setActiveButton("tools");
     // Preserve existing behavior used in QuickAccessBar header
     handleReaderToggle();
     handleBackToTools();
@@ -38,7 +46,10 @@ const AllToolsNavButton: React.FC<AllToolsNavButtonProps> = ({
   };
 
   // Do not highlight All Tools when a specific tool is open (indicator is shown)
-  const isActive = activeButton === 'tools' && !selectedToolKey && leftPanelView === 'toolPicker';
+  const isActive =
+    activeButton === "tools" &&
+    !selectedToolKey &&
+    leftPanelView === "toolPicker";
 
   const navProps = getHomeNavigation();
 
@@ -54,7 +65,7 @@ const AllToolsNavButton: React.FC<AllToolsNavButtonProps> = ({
   return (
     <div className="mt-4 mb-2">
       <QuickAccessButton
-        icon={<AppsIcon sx={{ fontSize: isActive ? '1.875rem' : '1.5rem' }} />}
+        icon={<AppsIcon sx={{ fontSize: isActive ? "1.875rem" : "1.5rem" }} />}
         label={t("quickAccess.allTools", "Tools")}
         isActive={isActive}
         onClick={handleNavClick}
@@ -68,4 +79,3 @@ const AllToolsNavButton: React.FC<AllToolsNavButtonProps> = ({
 };
 
 export default AllToolsNavButton;
-
diff --git a/frontend/src/core/components/shared/AppConfigLoader.tsx b/frontend/src/core/components/shared/AppConfigLoader.tsx
index 7da104a6f6..1a433cb8ce 100644
--- a/frontend/src/core/components/shared/AppConfigLoader.tsx
+++ b/frontend/src/core/components/shared/AppConfigLoader.tsx
@@ -1,6 +1,6 @@
-import { useEffect } from 'react';
-import { useAppConfig } from '@app/contexts/AppConfigContext';
-import { updateSupportedLanguages } from '@app/i18n';
+import { useEffect } from "react";
+import { useAppConfig } from "@app/contexts/AppConfigContext";
+import { updateSupportedLanguages } from "@app/i18n";
 
 /**
  * Component that loads app configuration and applies it to the application.
diff --git a/frontend/src/core/components/shared/AppConfigModal.css b/frontend/src/core/components/shared/AppConfigModal.css
index 67deb733c4..07cc84ae64 100644
--- a/frontend/src/core/components/shared/AppConfigModal.css
+++ b/frontend/src/core/components/shared/AppConfigModal.css
@@ -220,7 +220,7 @@
     margin: 0 -1rem;
     margin-bottom: -1rem;
   }
-  
+
   .settings-section-content {
     padding-bottom: 4rem;
   }
diff --git a/frontend/src/core/components/shared/AppConfigModal.tsx b/frontend/src/core/components/shared/AppConfigModal.tsx
index 30253ea45d..765d099416 100644
--- a/frontend/src/core/components/shared/AppConfigModal.tsx
+++ b/frontend/src/core/components/shared/AppConfigModal.tsx
@@ -1,24 +1,39 @@
-import React, { useMemo, useState, useEffect, useCallback, useRef } from 'react';
-import { Modal, Text, ActionIcon, Tooltip, Group } from '@mantine/core';
-import { useNavigate, useLocation } from 'react-router-dom';
-import LocalIcon from '@app/components/shared/LocalIcon';
-import { useConfigNavSections } from '@app/components/shared/config/configNavSections';
-import { NavKey, VALID_NAV_KEYS } from '@app/components/shared/config/types';
-import { useAppConfig } from '@app/contexts/AppConfigContext';
-import '@app/components/shared/AppConfigModal.css';
-import { useIsMobile } from '@app/hooks/useIsMobile';
-import { Z_INDEX_CONFIG_MODAL, Z_INDEX_OVER_CONFIG_MODAL } from '@app/styles/zIndex';
-import { useLicenseAlert } from '@app/hooks/useLicenseAlert';
-import { UnsavedChangesProvider, useUnsavedChanges } from '@app/contexts/UnsavedChangesContext';
-import { SettingsSearchBar } from '@app/components/shared/config/SettingsSearchBar';
+import React, {
+  useMemo,
+  useState,
+  useEffect,
+  useCallback,
+  useRef,
+} from "react";
+import { Badge, Modal, Text, ActionIcon, Tooltip, Group } from "@mantine/core";
+import { useNavigate, useLocation } from "react-router-dom";
+import LocalIcon from "@app/components/shared/LocalIcon";
+import { useConfigNavSections } from "@app/components/shared/config/configNavSections";
+import { NavKey, VALID_NAV_KEYS } from "@app/components/shared/config/types";
+import { useAppConfig } from "@app/contexts/AppConfigContext";
+import "@app/components/shared/AppConfigModal.css";
+import { useIsMobile } from "@app/hooks/useIsMobile";
+import {
+  Z_INDEX_CONFIG_MODAL,
+  Z_INDEX_OVER_CONFIG_MODAL,
+} from "@app/styles/zIndex";
+import { useLicenseAlert } from "@app/hooks/useLicenseAlert";
+import {
+  UnsavedChangesProvider,
+  useUnsavedChanges,
+} from "@app/contexts/UnsavedChangesContext";
+import { SettingsSearchBar } from "@app/components/shared/config/SettingsSearchBar";
 
 interface AppConfigModalProps {
   opened: boolean;
   onClose: () => void;
 }
 
-const AppConfigModalInner: React.FC<AppConfigModalProps> = ({ opened, onClose }) => {
-  const [active, setActive] = useState<NavKey>('general');
+const AppConfigModalInner: React.FC<AppConfigModalProps> = ({
+  opened,
+  onClose,
+}) => {
+  const [active, setActive] = useState<NavKey>("general");
   const isMobile = useIsMobile();
   const navigate = useNavigate();
   const location = useLocation();
@@ -42,9 +57,13 @@ const AppConfigModalInner: React.FC<AppConfigModalProps> = ({ opened, onClose })
     const section = getSectionFromPath(location.pathname);
     if (opened && section) {
       setActive(section);
-    } else if (opened && location.pathname.startsWith('/settings') && !section) {
+    } else if (
+      opened &&
+      location.pathname.startsWith("/settings") &&
+      !section
+    ) {
       // If at /settings without a section, redirect to general
-      navigate('/settings/general', { replace: true });
+      navigate("/settings/general", { replace: true });
     }
   }, [location.pathname, opened, navigate]);
 
@@ -63,19 +82,26 @@ const AppConfigModalInner: React.FC<AppConfigModalProps> = ({ opened, onClose })
         navigate(`/settings/${detail.key}`);
       }
     };
-    window.addEventListener('appConfig:navigate', handler as EventListener);
-    return () => window.removeEventListener('appConfig:navigate', handler as EventListener);
+    window.addEventListener("appConfig:navigate", handler as EventListener);
+    return () =>
+      window.removeEventListener(
+        "appConfig:navigate",
+        handler as EventListener,
+      );
   }, [navigate]);
 
-  const colors = useMemo(() => ({
-    navBg: 'var(--modal-nav-bg)',
-    sectionTitle: 'var(--modal-nav-section-title)',
-    navItem: 'var(--modal-nav-item)',
-    navItemActive: 'var(--modal-nav-item-active)',
-    navItemActiveBg: 'var(--modal-nav-item-active-bg)',
-    contentBg: 'var(--modal-content-bg)',
-    headerBorder: 'var(--modal-header-border)',
-  }), []);
+  const colors = useMemo(
+    () => ({
+      navBg: "var(--modal-nav-bg)",
+      sectionTitle: "var(--modal-nav-section-title)",
+      navItem: "var(--modal-nav-item)",
+      navItemActive: "var(--modal-nav-item-active)",
+      navItemActiveBg: "var(--modal-nav-item-active-bg)",
+      contentBg: "var(--modal-content-bg)",
+      headerBorder: "var(--modal-header-border)",
+    }),
+    [],
+  );
 
   // Get isAdmin and runningEE from app config
   const isAdmin = config?.isAdmin ?? false;
@@ -86,20 +112,20 @@ const AppConfigModalInner: React.FC<AppConfigModalProps> = ({ opened, onClose })
   const configNavSections = useConfigNavSections(
     isAdmin,
     runningEE,
-    loginEnabled
+    loginEnabled,
   );
 
   const activeLabel = useMemo(() => {
     for (const section of configNavSections) {
-      const found = section.items.find(i => i.key === active);
+      const found = section.items.find((i) => i.key === active);
       if (found) return found.label;
     }
-    return '';
+    return "";
   }, [configNavSections, active]);
 
   const activeComponent = useMemo(() => {
     for (const section of configNavSections) {
-      const found = section.items.find(i => i.key === active);
+      const found = section.items.find((i) => i.key === active);
       if (found) return found.component;
     }
     return null;
@@ -108,19 +134,22 @@ const AppConfigModalInner: React.FC<AppConfigModalProps> = ({ opened, onClose })
   const handleClose = useCallback(async () => {
     const canProceed = await confirmIfDirty();
     if (!canProceed) return;
-    
+
     // Navigate back to home when closing modal
-    navigate('/', { replace: true });
+    navigate("/", { replace: true });
     onClose();
   }, [confirmIfDirty, navigate, onClose]);
 
-  const handleNavigation = useCallback(async (key: NavKey) => {
-    const canProceed = await confirmIfDirty();
-    if (!canProceed) return;
+  const handleNavigation = useCallback(
+    async (key: NavKey) => {
+      const canProceed = await confirmIfDirty();
+      if (!canProceed) return;
 
-    setActive(key);
-    navigate(`/settings/${key}`);
-  }, [confirmIfDirty, navigate]);
+      setActive(key);
+      navigate(`/settings/${key}`);
+    },
+    [confirmIfDirty, navigate],
+  );
 
   return (
     <Modal
@@ -139,30 +168,37 @@ const AppConfigModalInner: React.FC<AppConfigModalProps> = ({ opened, onClose })
       <div className="modal-container">
         {/* Left navigation */}
         <div
-          className={`modal-nav ${isMobile ? 'mobile' : ''}`}
+          className={`modal-nav ${isMobile ? "mobile" : ""}`}
           style={{
             background: colors.navBg,
             borderRight: `1px solid ${colors.headerBorder}`,
           }}
         >
           <div className="modal-nav-scroll">
-            {configNavSections.map(section => (
+            {configNavSections.map((section) => (
               <div key={section.title} className="modal-nav-section">
                 {!isMobile && (
-                  <Text size="xs" fw={600} c={colors.sectionTitle} style={{ textTransform: 'uppercase', letterSpacing: 0.4 }}>
+                  <Text
+                    size="xs"
+                    fw={600}
+                    c={colors.sectionTitle}
+                    style={{ textTransform: "uppercase", letterSpacing: 0.4 }}
+                  >
                     {section.title}
                   </Text>
                 )}
                 <div className="modal-nav-section-items">
-                  {section.items.map(item => {
+                  {section.items.map((item) => {
                     const isActive = active === item.key;
                     const isDisabled = item.disabled ?? false;
-                    const color = isActive ? colors.navItemActive : colors.navItem;
+                    const color = isActive
+                      ? colors.navItemActive
+                      : colors.navItem;
                     const iconSize = isMobile ? 28 : 18;
                     const showPlanWarning =
-                      item.key === 'adminPlan' &&
+                      item.key === "adminPlan" &&
                       licenseAlert.active &&
-                      licenseAlert.audience === 'admin';
+                      licenseAlert.audience === "admin";
 
                     const navItemContent = (
                       <div
@@ -172,26 +208,45 @@ const AppConfigModalInner: React.FC<AppConfigModalProps> = ({ opened, onClose })
                             handleNavigation(item.key);
                           }
                         }}
-                        className={`modal-nav-item ${isMobile ? 'mobile' : ''}`}
+                        className={`modal-nav-item ${isMobile ? "mobile" : ""}`}
                         style={{
-                          background: isActive ? colors.navItemActiveBg : 'transparent',
+                          background: isActive
+                            ? colors.navItemActiveBg
+                            : "transparent",
                           opacity: isDisabled ? 0.6 : 1,
-                          cursor: isDisabled ? 'not-allowed' : 'pointer',
+                          cursor: isDisabled ? "not-allowed" : "pointer",
                         }}
                         data-tour={`admin-${item.key}-nav`}
                       >
-                        <LocalIcon icon={item.icon} width={iconSize} height={iconSize} style={{ color }} />
+                        <LocalIcon
+                          icon={item.icon}
+                          width={iconSize}
+                          height={iconSize}
+                          style={{ color }}
+                        />
                         {!isMobile && (
                           <Group gap={4} align="center" wrap="nowrap">
                             <Text size="sm" fw={500} style={{ color }}>
                               {item.label}
                             </Text>
+                            {item.badge && (
+                              <Badge
+                                size="xs"
+                                variant="light"
+                                color={item.badgeColor ?? "orange"}
+                                style={{ flexShrink: 0 }}
+                              >
+                                {item.badge}
+                              </Badge>
+                            )}
                             {showPlanWarning && (
                               <LocalIcon
                                 icon="warning-rounded"
                                 width={14}
                                 height={14}
-                                style={{ color: 'var(--mantine-color-orange-7)' }}
+                                style={{
+                                  color: "var(--mantine-color-orange-7)",
+                                }}
                               />
                             )}
                           </Group>
@@ -210,7 +265,9 @@ const AppConfigModalInner: React.FC<AppConfigModalProps> = ({ opened, onClose })
                         {navItemContent}
                       </Tooltip>
                     ) : (
-                      <React.Fragment key={item.key}>{navItemContent}</React.Fragment>
+                      <React.Fragment key={item.key}>
+                        {navItemContent}
+                      </React.Fragment>
                     );
                   })}
                 </div>
@@ -230,7 +287,9 @@ const AppConfigModalInner: React.FC<AppConfigModalProps> = ({ opened, onClose })
                 borderBottom: `1px solid ${colors.headerBorder}`,
               }}
             >
-              <Text fw={700} size="lg">{activeLabel}</Text>
+              <Text fw={700} size="lg">
+                {activeLabel}
+              </Text>
               <Group gap="xs" wrap="nowrap">
                 <SettingsSearchBar
                   configNavSections={configNavSections}
@@ -248,9 +307,7 @@ const AppConfigModalInner: React.FC<AppConfigModalProps> = ({ opened, onClose })
                 </ActionIcon>
               </Group>
             </div>
-            <div className="modal-body">
-              {activeComponent}
-            </div>
+            <div className="modal-body">{activeComponent}</div>
           </div>
         </div>
       </div>
diff --git a/frontend/src/core/components/shared/Badge.tsx b/frontend/src/core/components/shared/Badge.tsx
index 7bf3283e4f..dd15bec465 100644
--- a/frontend/src/core/components/shared/Badge.tsx
+++ b/frontend/src/core/components/shared/Badge.tsx
@@ -1,10 +1,10 @@
-import React from 'react';
-import { Box } from '@mantine/core';
+import React from "react";
+import { Box } from "@mantine/core";
 
 interface BadgeProps {
   children: React.ReactNode;
-  size?: 'sm' | 'md' | 'lg';
-  variant?: 'default' | 'colored';
+  size?: "sm" | "md" | "lg";
+  variant?: "default" | "colored";
   color?: string;
   textColor?: string;
   backgroundColor?: string;
@@ -12,38 +12,38 @@ interface BadgeProps {
   style?: React.CSSProperties;
 }
 
-const Badge: React.FC<BadgeProps> = ({ 
-  children, 
-  size = 'sm', 
-  variant = 'default',
+const Badge: React.FC<BadgeProps> = ({
+  children,
+  size = "sm",
+  variant = "default",
   color,
   textColor,
   backgroundColor,
   className,
-  style 
+  style,
 }) => {
   const getSizeStyles = () => {
     switch (size) {
-      case 'sm':
+      case "sm":
         return {
-          padding: '0.125rem 0.5rem',
-          fontSize: '0.75rem',
+          padding: "0.125rem 0.5rem",
+          fontSize: "0.75rem",
           fontWeight: 700,
-          borderRadius: '0.5rem',
+          borderRadius: "0.5rem",
         };
-      case 'md':
+      case "md":
         return {
-          padding: '0.25rem 0.75rem',
-          fontSize: '0.875rem',
+          padding: "0.25rem 0.75rem",
+          fontSize: "0.875rem",
           fontWeight: 700,
-          borderRadius: '0.625rem',
+          borderRadius: "0.625rem",
         };
-      case 'lg':
+      case "lg":
         return {
-          padding: '0.375rem 1rem',
-          fontSize: '1rem',
+          padding: "0.375rem 1rem",
+          fontSize: "1rem",
           fontWeight: 700,
-          borderRadius: '0.75rem',
+          borderRadius: "0.75rem",
         };
       default:
         return {};
@@ -58,7 +58,7 @@ const Badge: React.FC<BadgeProps> = ({
         color: textColor,
       };
     }
-    
+
     // If a single color is provided, use it for text and 20% opacity for background
     if (color) {
       return {
@@ -66,21 +66,21 @@ const Badge: React.FC<BadgeProps> = ({
         color: color,
       };
     }
-    
+
     // If variant is colored but no color provided, use default colored styling
-    if (variant === 'colored') {
+    if (variant === "colored") {
       return {
         backgroundColor: `color-mix(in srgb, var(--category-color-default) 15%, transparent)`,
-        color: 'var(--category-color-default)',
+        color: "var(--category-color-default)",
         borderColor: `color-mix(in srgb, var(--category-color-default) 30%, transparent)`,
-        border: '1px solid',
+        border: "1px solid",
       };
     }
-    
+
     // Default styling
     return {
-      background: 'var(--tool-header-badge-bg)',
-      color: 'var(--tool-header-badge-text)',
+      background: "var(--tool-header-badge-bg)",
+      color: "var(--tool-header-badge-text)",
     };
   };
 
diff --git a/frontend/src/core/components/shared/BulkShareModal.tsx b/frontend/src/core/components/shared/BulkShareModal.tsx
index b2d79d87c2..72fc9a007d 100644
--- a/frontend/src/core/components/shared/BulkShareModal.tsx
+++ b/frontend/src/core/components/shared/BulkShareModal.tsx
@@ -1,19 +1,29 @@
-import React, { useCallback, useEffect, useMemo, useState } from 'react';
-import { Modal, Stack, Text, Button, Group, Alert, TextInput, Paper, Select } from '@mantine/core';
-import LinkIcon from '@mui/icons-material/Link';
-import ContentCopyRoundedIcon from '@mui/icons-material/ContentCopyRounded';
-import { useTranslation } from 'react-i18next';
+import React, { useCallback, useEffect, useMemo, useState } from "react";
+import {
+  Modal,
+  Stack,
+  Text,
+  Button,
+  Group,
+  Alert,
+  TextInput,
+  Paper,
+  Select,
+} from "@mantine/core";
+import LinkIcon from "@mui/icons-material/Link";
+import ContentCopyRoundedIcon from "@mui/icons-material/ContentCopyRounded";
+import { useTranslation } from "react-i18next";
 
-import apiClient from '@app/services/apiClient';
-import { absoluteWithBasePath } from '@app/constants/app';
-import { alert } from '@app/components/toast';
-import { Z_INDEX_OVER_FILE_MANAGER_MODAL } from '@app/styles/zIndex';
-import { useAppConfig } from '@app/contexts/AppConfigContext';
-import type { StirlingFileStub } from '@app/types/fileContext';
-import { uploadHistoryChains } from '@app/services/serverStorageUpload';
-import { fileStorage } from '@app/services/fileStorage';
-import { useFileActions } from '@app/contexts/FileContext';
-import type { FileId } from '@app/types/file';
+import apiClient from "@app/services/apiClient";
+import { absoluteWithBasePath } from "@app/constants/app";
+import { alert } from "@app/components/toast";
+import { Z_INDEX_OVER_FILE_MANAGER_MODAL } from "@app/styles/zIndex";
+import { useAppConfig } from "@app/contexts/AppConfigContext";
+import type { StirlingFileStub } from "@app/types/fileContext";
+import { uploadHistoryChains } from "@app/services/serverStorageUpload";
+import { fileStorage } from "@app/services/fileStorage";
+import { useFileActions } from "@app/contexts/FileContext";
+import type { FileId } from "@app/types/file";
 
 interface BulkShareModalProps {
   opened: boolean;
@@ -35,7 +45,9 @@ const BulkShareModal: React.FC<BulkShareModalProps> = ({
   const [isWorking, setIsWorking] = useState(false);
   const [errorMessage, setErrorMessage] = useState<string | null>(null);
   const [shareToken, setShareToken] = useState<string | null>(null);
-  const [shareRole, setShareRole] = useState<'editor' | 'commenter' | 'viewer'>('editor');
+  const [shareRole, setShareRole] = useState<"editor" | "commenter" | "viewer">(
+    "editor",
+  );
 
   useEffect(() => {
     if (!opened) {
@@ -47,15 +59,15 @@ const BulkShareModal: React.FC<BulkShareModalProps> = ({
 
   useEffect(() => {
     if (opened) {
-      setShareRole('editor');
+      setShareRole("editor");
     }
   }, [opened]);
 
   const shareUrl = useMemo(() => {
-    if (!shareToken) return '';
-    const frontendUrl = (config?.frontendUrl || '').trim();
+    if (!shareToken) return "";
+    const frontendUrl = (config?.frontendUrl || "").trim();
     if (frontendUrl) {
-      const normalized = frontendUrl.endsWith('/')
+      const normalized = frontendUrl.endsWith("/")
         ? frontendUrl.slice(0, -1)
         : frontendUrl;
       return `${normalized}/share/${shareToken}`;
@@ -63,18 +75,24 @@ const BulkShareModal: React.FC<BulkShareModalProps> = ({
     return absoluteWithBasePath(`/share/${shareToken}`);
   }, [config?.frontendUrl, shareToken]);
 
-  const createShareLink = useCallback(async (storedFileId: number) => {
-    const response = await apiClient.post(`/api/v1/storage/files/${storedFileId}/shares/links`, {
-      accessRole: shareRole,
-    });
-    return response.data as { token?: string };
-  }, [shareRole]);
+  const createShareLink = useCallback(
+    async (storedFileId: number) => {
+      const response = await apiClient.post(
+        `/api/v1/storage/files/${storedFileId}/shares/links`,
+        {
+          accessRole: shareRole,
+        },
+      );
+      return response.data as { token?: string };
+    },
+    [shareRole],
+  );
 
   const handleGenerateLink = useCallback(async () => {
     if (!shareLinksEnabled) {
       alert({
-        alertType: 'warning',
-        title: t('storageShare.linksDisabled', 'Share links are disabled.'),
+        alertType: "warning",
+        title: t("storageShare.linksDisabled", "Share links are disabled."),
         expandable: false,
         durationMs: 2500,
       });
@@ -86,18 +104,25 @@ const BulkShareModal: React.FC<BulkShareModalProps> = ({
 
     try {
       const rootIds = Array.from(
-        new Set(files.map((file) => (file.originalFileId || file.id) as FileId))
+        new Set(
+          files.map((file) => (file.originalFileId || file.id) as FileId),
+        ),
       );
       const remoteIds = Array.from(
-        new Set(files.map((file) => file.remoteStorageId).filter(Boolean) as number[])
+        new Set(
+          files.map((file) => file.remoteStorageId).filter(Boolean) as number[],
+        ),
       );
       const existingRemoteId =
-        rootIds.length === 1 && remoteIds.length === 1 ? remoteIds[0] : undefined;
+        rootIds.length === 1 && remoteIds.length === 1
+          ? remoteIds[0]
+          : undefined;
 
-      const { remoteId: storedId, updatedAt, chain } = await uploadHistoryChains(
-        rootIds,
-        existingRemoteId
-      );
+      const {
+        remoteId: storedId,
+        updatedAt,
+        chain,
+      } = await uploadHistoryChains(rootIds, existingRemoteId);
 
       const shareResponse = await createShareLink(storedId);
       setShareToken(shareResponse.token ?? null);
@@ -120,8 +145,8 @@ const BulkShareModal: React.FC<BulkShareModalProps> = ({
       }
 
       alert({
-        alertType: 'success',
-        title: t('storageShare.generated', 'Share link generated'),
+        alertType: "success",
+        title: t("storageShare.generated", "Share link generated"),
         expandable: false,
         durationMs: 3000,
       });
@@ -129,9 +154,12 @@ const BulkShareModal: React.FC<BulkShareModalProps> = ({
         await onShared();
       }
     } catch (error: any) {
-      console.error('Failed to generate share link:', error);
+      console.error("Failed to generate share link:", error);
       setErrorMessage(
-        t('storageShare.failure', 'Unable to generate a share link. Please try again.')
+        t(
+          "storageShare.failure",
+          "Unable to generate a share link. Please try again.",
+        ),
       );
     } finally {
       setIsWorking(false);
@@ -143,16 +171,16 @@ const BulkShareModal: React.FC<BulkShareModalProps> = ({
     try {
       await navigator.clipboard.writeText(shareUrl);
       alert({
-        alertType: 'success',
-        title: t('storageShare.copied', 'Link copied to clipboard'),
+        alertType: "success",
+        title: t("storageShare.copied", "Link copied to clipboard"),
         expandable: false,
         durationMs: 2000,
       });
     } catch (error) {
-      console.error('Failed to copy share link:', error);
+      console.error("Failed to copy share link:", error);
       alert({
-        alertType: 'warning',
-        title: t('storageShare.copyFailed', 'Copy failed'),
+        alertType: "warning",
+        title: t("storageShare.copyFailed", "Copy failed"),
         expandable: false,
         durationMs: 2500,
       });
@@ -164,7 +192,7 @@ const BulkShareModal: React.FC<BulkShareModalProps> = ({
       opened={opened}
       onClose={onClose}
       centered
-      title={t('storageShare.bulkTitle', 'Share selected files')}
+      title={t("storageShare.bulkTitle", "Share selected files")}
       zIndex={Z_INDEX_OVER_FILE_MANAGER_MODAL}
       size="lg"
       overlayProps={{ blur: 6 }}
@@ -172,14 +200,14 @@ const BulkShareModal: React.FC<BulkShareModalProps> = ({
       <Stack gap="md">
         <Paper withBorder radius="md" p="md">
           <Stack gap={4}>
-              <Text size="sm">
-                {t(
-                  'storageShare.bulkDescription',
-                  'Create one link to share all selected files with signed-in users.'
-                )}
-              </Text>
+            <Text size="sm">
+              {t(
+                "storageShare.bulkDescription",
+                "Create one link to share all selected files with signed-in users.",
+              )}
+            </Text>
             <Text size="sm" c="dimmed">
-              {t('storageShare.fileCount', '{{count}} files selected', {
+              {t("storageShare.fileCount", "{{count}} files selected", {
                 count: files.length,
               })}
             </Text>
@@ -187,13 +215,22 @@ const BulkShareModal: React.FC<BulkShareModalProps> = ({
         </Paper>
 
         {errorMessage && (
-          <Alert color="red" title={t('storageShare.errorTitle', 'Share failed')}>
+          <Alert
+            color="red"
+            title={t("storageShare.errorTitle", "Share failed")}
+          >
             {errorMessage}
           </Alert>
         )}
         {!shareLinksEnabled && (
-          <Alert color="yellow" title={t('storageShare.linksDisabled', 'Share links are disabled.')}>
-            {t('storageShare.linksDisabledBody', 'Share links are disabled by your server settings.')}
+          <Alert
+            color="yellow"
+            title={t("storageShare.linksDisabled", "Share links are disabled.")}
+          >
+            {t(
+              "storageShare.linksDisabledBody",
+              "Share links are disabled by your server settings.",
+            )}
           </Alert>
         )}
 
@@ -203,15 +240,17 @@ const BulkShareModal: React.FC<BulkShareModalProps> = ({
               <TextInput
                 readOnly
                 value={shareUrl}
-                label={t('storageShare.linkLabel', 'Share link')}
+                label={t("storageShare.linkLabel", "Share link")}
                 rightSection={
                   <Button
                     variant="subtle"
                     size="xs"
-                    leftSection={<ContentCopyRoundedIcon style={{ fontSize: 16 }} />}
+                    leftSection={
+                      <ContentCopyRoundedIcon style={{ fontSize: 16 }} />
+                    }
                     onClick={handleCopyLink}
                   >
-                    {t('storageShare.copy', 'Copy')}
+                    {t("storageShare.copy", "Copy")}
                   </Button>
                 }
               />
@@ -222,22 +261,36 @@ const BulkShareModal: React.FC<BulkShareModalProps> = ({
         <Paper withBorder radius="md" p="md">
           <Stack gap="xs">
             <Text size="sm" fw={500}>
-              {t('storageShare.linkAccessTitle', 'Share link access')}
+              {t("storageShare.linkAccessTitle", "Share link access")}
             </Text>
             <Select
-              label={t('storageShare.roleLabel', 'Role')}
+              label={t("storageShare.roleLabel", "Role")}
               value={shareRole}
-              onChange={(value) => setShareRole((value as typeof shareRole) || 'editor')}
-              comboboxProps={{ withinPortal: true, zIndex: Z_INDEX_OVER_FILE_MANAGER_MODAL + 10 }}
+              onChange={(value) =>
+                setShareRole((value as typeof shareRole) || "editor")
+              }
+              comboboxProps={{
+                withinPortal: true,
+                zIndex: Z_INDEX_OVER_FILE_MANAGER_MODAL + 10,
+              }}
               data={[
-                { value: 'editor', label: t('storageShare.roleEditor', 'Editor') },
-                { value: 'commenter', label: t('storageShare.roleCommenter', 'Commenter') },
-                { value: 'viewer', label: t('storageShare.roleViewer', 'Viewer') },
+                {
+                  value: "editor",
+                  label: t("storageShare.roleEditor", "Editor"),
+                },
+                {
+                  value: "commenter",
+                  label: t("storageShare.roleCommenter", "Commenter"),
+                },
+                {
+                  value: "viewer",
+                  label: t("storageShare.roleViewer", "Viewer"),
+                },
               ]}
             />
-            {shareRole === 'commenter' && (
+            {shareRole === "commenter" && (
               <Text size="xs" c="dimmed">
-                {t('storageShare.commenterHint', 'Commenting is coming soon.')}
+                {t("storageShare.commenterHint", "Commenting is coming soon.")}
               </Text>
             )}
           </Stack>
@@ -245,7 +298,7 @@ const BulkShareModal: React.FC<BulkShareModalProps> = ({
 
         <Group justify="flex-end" gap="sm">
           <Button variant="default" onClick={onClose} disabled={isWorking}>
-            {t('cancel', 'Cancel')}
+            {t("cancel", "Cancel")}
           </Button>
           <Button
             leftSection={<LinkIcon style={{ fontSize: 18 }} />}
@@ -253,7 +306,7 @@ const BulkShareModal: React.FC<BulkShareModalProps> = ({
             loading={isWorking}
             disabled={!shareLinksEnabled}
           >
-            {t('storageShare.generate', 'Generate Link')}
+            {t("storageShare.generate", "Generate Link")}
           </Button>
         </Group>
       </Stack>
diff --git a/frontend/src/core/components/shared/BulkUploadToServerModal.tsx b/frontend/src/core/components/shared/BulkUploadToServerModal.tsx
index 4e97fe74c7..8dd250851e 100644
--- a/frontend/src/core/components/shared/BulkUploadToServerModal.tsx
+++ b/frontend/src/core/components/shared/BulkUploadToServerModal.tsx
@@ -1,15 +1,15 @@
-import React, { useCallback, useEffect, useMemo, useState } from 'react';
-import { Modal, Stack, Text, Button, Group, Alert } from '@mantine/core';
-import CloudUploadIcon from '@mui/icons-material/CloudUpload';
-import { useTranslation } from 'react-i18next';
+import React, { useCallback, useEffect, useMemo, useState } from "react";
+import { Modal, Stack, Text, Button, Group, Alert } from "@mantine/core";
+import CloudUploadIcon from "@mui/icons-material/CloudUpload";
+import { useTranslation } from "react-i18next";
 
-import { alert } from '@app/components/toast';
-import { Z_INDEX_OVER_FILE_MANAGER_MODAL } from '@app/styles/zIndex';
-import type { StirlingFileStub } from '@app/types/fileContext';
-import { uploadHistoryChains } from '@app/services/serverStorageUpload';
-import { fileStorage } from '@app/services/fileStorage';
-import { useFileActions } from '@app/contexts/FileContext';
-import type { FileId } from '@app/types/file';
+import { alert } from "@app/components/toast";
+import { Z_INDEX_OVER_FILE_MANAGER_MODAL } from "@app/styles/zIndex";
+import type { StirlingFileStub } from "@app/types/fileContext";
+import { uploadHistoryChains } from "@app/services/serverStorageUpload";
+import { fileStorage } from "@app/services/fileStorage";
+import { useFileActions } from "@app/contexts/FileContext";
+import type { FileId } from "@app/types/file";
 
 interface BulkUploadToServerModalProps {
   opened: boolean;
@@ -45,16 +45,21 @@ const BulkUploadToServerModal: React.FC<BulkUploadToServerModalProps> = ({
 
     try {
       const rootIds = Array.from(
-        new Set(files.map((file) => (file.originalFileId || file.id) as FileId))
+        new Set(
+          files.map((file) => (file.originalFileId || file.id) as FileId),
+        ),
       );
       const remoteIds = Array.from(
-        new Set(files.map((file) => file.remoteStorageId).filter(Boolean) as number[])
+        new Set(
+          files.map((file) => file.remoteStorageId).filter(Boolean) as number[],
+        ),
       );
-      const existingRemoteId = remoteIds.length === 1 ? remoteIds[0] : undefined;
+      const existingRemoteId =
+        remoteIds.length === 1 ? remoteIds[0] : undefined;
 
       const { remoteId, updatedAt, chain } = await uploadHistoryChains(
         rootIds,
-        existingRemoteId
+        existingRemoteId,
       );
 
       for (const stub of chain) {
@@ -73,8 +78,8 @@ const BulkUploadToServerModal: React.FC<BulkUploadToServerModalProps> = ({
       }
 
       alert({
-        alertType: 'success',
-        title: t('storageUpload.success', 'Uploaded to server'),
+        alertType: "success",
+        title: t("storageUpload.success", "Uploaded to server"),
         expandable: false,
         durationMs: 3000,
       });
@@ -83,9 +88,12 @@ const BulkUploadToServerModal: React.FC<BulkUploadToServerModalProps> = ({
       }
       onClose();
     } catch (error) {
-      console.error('Failed to upload files to server:', error);
+      console.error("Failed to upload files to server:", error);
       setErrorMessage(
-        t('storageUpload.failure', 'Upload failed. Please check your login and storage settings.')
+        t(
+          "storageUpload.failure",
+          "Upload failed. Please check your login and storage settings.",
+        ),
       );
     } finally {
       setIsUploading(false);
@@ -97,48 +105,51 @@ const BulkUploadToServerModal: React.FC<BulkUploadToServerModalProps> = ({
       opened={opened}
       onClose={onClose}
       centered
-      title={t('storageUpload.bulkTitle', 'Upload selected files')}
+      title={t("storageUpload.bulkTitle", "Upload selected files")}
       zIndex={Z_INDEX_OVER_FILE_MANAGER_MODAL}
     >
       <Stack gap="sm">
         <Text size="sm">
           {t(
-            'storageUpload.bulkDescription',
-            'This uploads the selected files to your server storage.'
+            "storageUpload.bulkDescription",
+            "This uploads the selected files to your server storage.",
           )}
         </Text>
         <Text size="sm" c="dimmed">
-          {t('storageUpload.fileCount', '{{count}} files selected', {
+          {t("storageUpload.fileCount", "{{count}} files selected", {
             count: files.length,
           })}
         </Text>
         {displayNames.length > 0 && (
           <Text size="xs" c="dimmed">
-            {displayNames.join(', ')}
+            {displayNames.join(", ")}
             {fileNames.length > displayNames.length
-              ? t('storageUpload.more', ' +{{count}} more', {
+              ? t("storageUpload.more", " +{{count}} more", {
                   count: fileNames.length - displayNames.length,
                 })
-              : ''}
+              : ""}
           </Text>
         )}
 
         {errorMessage && (
-          <Alert color="red" title={t('storageUpload.errorTitle', 'Upload failed')}>
+          <Alert
+            color="red"
+            title={t("storageUpload.errorTitle", "Upload failed")}
+          >
             {errorMessage}
           </Alert>
         )}
 
         <Group justify="flex-end" gap="sm">
           <Button variant="default" onClick={onClose} disabled={isUploading}>
-            {t('cancel', 'Cancel')}
+            {t("cancel", "Cancel")}
           </Button>
           <Button
             leftSection={<CloudUploadIcon style={{ fontSize: 18 }} />}
             onClick={handleUpload}
             loading={isUploading}
           >
-            {t('storageUpload.uploadButton', 'Upload to Server')}
+            {t("storageUpload.uploadButton", "Upload to Server")}
           </Button>
         </Group>
       </Stack>
diff --git a/frontend/src/core/components/shared/ButtonSelector.test.tsx b/frontend/src/core/components/shared/ButtonSelector.test.tsx
index 12a509abd6..ab9fee8ef6 100644
--- a/frontend/src/core/components/shared/ButtonSelector.test.tsx
+++ b/frontend/src/core/components/shared/ButtonSelector.test.tsx
@@ -1,24 +1,24 @@
-import { describe, expect, test, vi, beforeEach } from 'vitest';
-import { render, screen, fireEvent } from '@testing-library/react';
-import { MantineProvider } from '@mantine/core';
-import ButtonSelector from '@app/components/shared/ButtonSelector';
+import { describe, expect, test, vi, beforeEach } from "vitest";
+import { render, screen, fireEvent } from "@testing-library/react";
+import { MantineProvider } from "@mantine/core";
+import ButtonSelector from "@app/components/shared/ButtonSelector";
 
 // Wrapper component to provide Mantine context
 const TestWrapper = ({ children }: { children: React.ReactNode }) => (
   <MantineProvider>{children}</MantineProvider>
 );
 
-describe('ButtonSelector', () => {
+describe("ButtonSelector", () => {
   const mockOnChange = vi.fn();
 
   beforeEach(() => {
     vi.clearAllMocks();
   });
 
-  test('should render all options as buttons', () => {
+  test("should render all options as buttons", () => {
     const options = [
-      { value: 'option1', label: 'Option 1' },
-      { value: 'option2', label: 'Option 2' },
+      { value: "option1", label: "Option 1" },
+      { value: "option2", label: "Option 2" },
     ];
 
     render(
@@ -29,18 +29,18 @@ describe('ButtonSelector', () => {
           options={options}
           label="Test Label"
         />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
-    expect(screen.getByText('Test Label')).toBeInTheDocument();
-    expect(screen.getByText('Option 1')).toBeInTheDocument();
-    expect(screen.getByText('Option 2')).toBeInTheDocument();
+    expect(screen.getByText("Test Label")).toBeInTheDocument();
+    expect(screen.getByText("Option 1")).toBeInTheDocument();
+    expect(screen.getByText("Option 2")).toBeInTheDocument();
   });
 
-  test('should highlight selected button with filled variant', () => {
+  test("should highlight selected button with filled variant", () => {
     const options = [
-      { value: 'option1', label: 'Option 1' },
-      { value: 'option2', label: 'Option 2' },
+      { value: "option1", label: "Option 1" },
+      { value: "option2", label: "Option 2" },
     ];
 
     render(
@@ -51,22 +51,22 @@ describe('ButtonSelector', () => {
           options={options}
           label="Selection Label"
         />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
-    const selectedButton = screen.getByRole('button', { name: 'Option 1' });
-    const unselectedButton = screen.getByRole('button', { name: 'Option 2' });
+    const selectedButton = screen.getByRole("button", { name: "Option 1" });
+    const unselectedButton = screen.getByRole("button", { name: "Option 2" });
 
     // Check data-variant attribute for filled/outline
-    expect(selectedButton).toHaveAttribute('data-variant', 'filled');
-    expect(unselectedButton).toHaveAttribute('data-variant', 'outline');
-    expect(screen.getByText('Selection Label')).toBeInTheDocument();
+    expect(selectedButton).toHaveAttribute("data-variant", "filled");
+    expect(unselectedButton).toHaveAttribute("data-variant", "outline");
+    expect(screen.getByText("Selection Label")).toBeInTheDocument();
   });
 
-  test('should call onChange when button is clicked', () => {
+  test("should call onChange when button is clicked", () => {
     const options = [
-      { value: 'option1', label: 'Option 1' },
-      { value: 'option2', label: 'Option 2' },
+      { value: "option1", label: "Option 1" },
+      { value: "option2", label: "Option 2" },
     ];
 
     render(
@@ -76,18 +76,18 @@ describe('ButtonSelector', () => {
           onChange={mockOnChange}
           options={options}
         />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
-    fireEvent.click(screen.getByRole('button', { name: 'Option 2' }));
+    fireEvent.click(screen.getByRole("button", { name: "Option 2" }));
 
-    expect(mockOnChange).toHaveBeenCalledWith('option2');
+    expect(mockOnChange).toHaveBeenCalledWith("option2");
   });
 
-  test('should handle undefined value (no selection)', () => {
+  test("should handle undefined value (no selection)", () => {
     const options = [
-      { value: 'option1', label: 'Option 1' },
-      { value: 'option2', label: 'Option 2' },
+      { value: "option1", label: "Option 1" },
+      { value: "option2", label: "Option 2" },
     ];
 
     render(
@@ -97,37 +97,37 @@ describe('ButtonSelector', () => {
           onChange={mockOnChange}
           options={options}
         />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
     // Both buttons should be outlined when no value is selected
-    const button1 = screen.getByRole('button', { name: 'Option 1' });
-    const button2 = screen.getByRole('button', { name: 'Option 2' });
+    const button1 = screen.getByRole("button", { name: "Option 1" });
+    const button2 = screen.getByRole("button", { name: "Option 2" });
 
-    expect(button1).toHaveAttribute('data-variant', 'outline');
-    expect(button2).toHaveAttribute('data-variant', 'outline');
+    expect(button1).toHaveAttribute("data-variant", "outline");
+    expect(button2).toHaveAttribute("data-variant", "outline");
   });
 
   test.each([
     {
-      description: 'disable buttons when disabled prop is true',
+      description: "disable buttons when disabled prop is true",
       options: [
-        { value: 'option1', label: 'Option 1' },
-        { value: 'option2', label: 'Option 2' },
+        { value: "option1", label: "Option 1" },
+        { value: "option2", label: "Option 2" },
       ],
       globalDisabled: true,
       expectedStates: [true, true],
     },
     {
-      description: 'disable individual options when option.disabled is true',
+      description: "disable individual options when option.disabled is true",
       options: [
-        { value: 'option1', label: 'Option 1' },
-        { value: 'option2', label: 'Option 2', disabled: true },
+        { value: "option1", label: "Option 1" },
+        { value: "option2", label: "Option 2", disabled: true },
       ],
       globalDisabled: false,
       expectedStates: [false, true],
     },
-  ])('should $description', ({ options, globalDisabled, expectedStates }) => {
+  ])("should $description", ({ options, globalDisabled, expectedStates }) => {
     render(
       <TestWrapper>
         <ButtonSelector
@@ -136,19 +136,19 @@ describe('ButtonSelector', () => {
           options={options}
           disabled={globalDisabled}
         />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
     options.forEach((option, index) => {
-      const button = screen.getByRole('button', { name: option.label });
-      expect(button).toHaveProperty('disabled', expectedStates[index]);
+      const button = screen.getByRole("button", { name: option.label });
+      expect(button).toHaveProperty("disabled", expectedStates[index]);
     });
   });
 
-  test('should not call onChange when disabled button is clicked', () => {
+  test("should not call onChange when disabled button is clicked", () => {
     const options = [
-      { value: 'option1', label: 'Option 1' },
-      { value: 'option2', label: 'Option 2', disabled: true },
+      { value: "option1", label: "Option 1" },
+      { value: "option2", label: "Option 2", disabled: true },
     ];
 
     render(
@@ -158,18 +158,18 @@ describe('ButtonSelector', () => {
           onChange={mockOnChange}
           options={options}
         />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
-    fireEvent.click(screen.getByRole('button', { name: 'Option 2' }));
+    fireEvent.click(screen.getByRole("button", { name: "Option 2" }));
 
     expect(mockOnChange).not.toHaveBeenCalled();
   });
 
-  test('should not apply fullWidth styling when fullWidth is false', () => {
+  test("should not apply fullWidth styling when fullWidth is false", () => {
     const options = [
-      { value: 'option1', label: 'Option 1' },
-      { value: 'option2', label: 'Option 2' },
+      { value: "option1", label: "Option 1" },
+      { value: "option2", label: "Option 2" },
     ];
 
     render(
@@ -181,18 +181,18 @@ describe('ButtonSelector', () => {
           fullWidth={false}
           label="Layout Label"
         />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
-    const button = screen.getByRole('button', { name: 'Option 1' });
-    expect(button).not.toHaveStyle({ flex: '1' });
-    expect(screen.getByText('Layout Label')).toBeInTheDocument();
+    const button = screen.getByRole("button", { name: "Option 1" });
+    expect(button).not.toHaveStyle({ flex: "1" });
+    expect(screen.getByText("Layout Label")).toBeInTheDocument();
   });
 
-  test('should not render label element when not provided', () => {
+  test("should not render label element when not provided", () => {
     const options = [
-      { value: 'option1', label: 'Option 1' },
-      { value: 'option2', label: 'Option 2' },
+      { value: "option1", label: "Option 1" },
+      { value: "option2", label: "Option 2" },
     ];
 
     const { container } = render(
@@ -202,15 +202,17 @@ describe('ButtonSelector', () => {
           onChange={mockOnChange}
           options={options}
         />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
     // Should render buttons
-    expect(screen.getByText('Option 1')).toBeInTheDocument();
-    expect(screen.getByText('Option 2')).toBeInTheDocument();
-    
+    expect(screen.getByText("Option 1")).toBeInTheDocument();
+    expect(screen.getByText("Option 2")).toBeInTheDocument();
+
     // Stack should only contain the Group (buttons), no Text element for label
-    const stackElement = container.querySelector('[class*="mantine-Stack-root"]');
+    const stackElement = container.querySelector(
+      '[class*="mantine-Stack-root"]',
+    );
     expect(stackElement?.children).toHaveLength(1); // Only the Group, no label Text
   });
 });
diff --git a/frontend/src/core/components/shared/ButtonSelector.tsx b/frontend/src/core/components/shared/ButtonSelector.tsx
index 94bd10c6e7..73e18cac8a 100644
--- a/frontend/src/core/components/shared/ButtonSelector.tsx
+++ b/frontend/src/core/components/shared/ButtonSelector.tsx
@@ -5,7 +5,7 @@ export interface ButtonOption<T> {
   value: T;
   label: string;
   disabled?: boolean;
-  tooltip?: string;  // Tooltip shown on hover (useful for explaining why option is disabled)
+  tooltip?: string; // Tooltip shown on hover (useful for explaining why option is disabled)
 }
 
 interface ButtonSelectorProps<T> {
@@ -30,33 +30,43 @@ const ButtonSelector = <T extends string | number>({
   textClassName,
 }: ButtonSelectorProps<T>) => {
   return (
-    <Stack gap='var(--mantine-spacing-sm)'>
+    <Stack gap="var(--mantine-spacing-sm)">
       {/* Label (if it exists) */}
-      {label && <Text style={{
-        fontSize: "var(--mantine-font-size-sm)",
-        lineHeight: "var(--mantine-line-height-sm)",
-        fontWeight: "var(--font-weight-medium)",
-      }}>{label}</Text>}
+      {label && (
+        <Text
+          style={{
+            fontSize: "var(--mantine-font-size-sm)",
+            lineHeight: "var(--mantine-line-height-sm)",
+            fontWeight: "var(--font-weight-medium)",
+          }}
+        >
+          {label}
+        </Text>
+      )}
 
       {/* Buttons */}
-      <Group gap='4px'>
+      <Group gap="4px">
         {options.map((option) => {
           const isDisabled = disabled || option.disabled;
           const button = (
             <Button
-              variant={value === option.value ? 'filled' : 'outline'}
-              color={value === option.value ? 'var(--color-primary-500)' : 'var(--text-muted)'}
+              variant={value === option.value ? "filled" : "outline"}
+              color={
+                value === option.value
+                  ? "var(--color-primary-500)"
+                  : "var(--text-muted)"
+              }
               onClick={() => onChange(option.value)}
               disabled={isDisabled}
               className={buttonClassName}
               style={{
                 flex: fullWidth ? 1 : undefined,
-                height: 'auto',
-                minHeight: '2.5rem',
-                fontSize: 'var(--mantine-font-size-sm)',
-                lineHeight: '1.4',
-                paddingTop: '0.5rem',
-                paddingBottom: '0.5rem'
+                height: "auto",
+                minHeight: "2.5rem",
+                fontSize: "var(--mantine-font-size-sm)",
+                lineHeight: "1.4",
+                paddingTop: "0.5rem",
+                paddingBottom: "0.5rem",
               }}
             >
               <FitText
@@ -72,13 +82,29 @@ const ButtonSelector = <T extends string | number>({
           // Wrap with tooltip if provided (useful for disabled state explanations)
           if (option.tooltip && isDisabled) {
             return (
-              <Tooltip key={option.value} label={option.tooltip} position="top" withArrow>
-                <span style={{ flex: fullWidth ? 1 : undefined, display: 'flex' }}>{button}</span>
+              <Tooltip
+                key={option.value}
+                label={option.tooltip}
+                position="top"
+                withArrow
+              >
+                <span
+                  style={{ flex: fullWidth ? 1 : undefined, display: "flex" }}
+                >
+                  {button}
+                </span>
               </Tooltip>
             );
           }
 
-          return <span key={option.value} style={{ flex: fullWidth ? 1 : undefined, display: 'flex' }}>{button}</span>;
+          return (
+            <span
+              key={option.value}
+              style={{ flex: fullWidth ? 1 : undefined, display: "flex" }}
+            >
+              {button}
+            </span>
+          );
         })}
       </Group>
     </Stack>
diff --git a/frontend/src/core/components/shared/ButtonToggle.tsx b/frontend/src/core/components/shared/ButtonToggle.tsx
index f695c8a8bc..5e02fb169b 100644
--- a/frontend/src/core/components/shared/ButtonToggle.tsx
+++ b/frontend/src/core/components/shared/ButtonToggle.tsx
@@ -1,5 +1,5 @@
-import { Button, Stack } from '@mantine/core';
-import React from 'react';
+import { Button, Stack } from "@mantine/core";
+import React from "react";
 
 export interface ButtonToggleOption {
   value: string;
@@ -13,8 +13,8 @@ export interface ButtonToggleProps {
   value: string;
   onChange: (value: string) => void;
   disabled?: boolean;
-  orientation?: 'vertical' | 'horizontal';
-  size?: 'xs' | 'sm' | 'md' | 'lg';
+  orientation?: "vertical" | "horizontal";
+  size?: "xs" | "sm" | "md" | "lg";
   fullWidth?: boolean;
 }
 
@@ -23,18 +23,18 @@ export const ButtonToggle: React.FC<ButtonToggleProps> = ({
   value,
   onChange,
   disabled = false,
-  orientation = 'vertical',
-  size = 'md',
+  orientation = "vertical",
+  size = "md",
   fullWidth = true,
 }) => {
-  const isVertical = orientation === 'vertical';
+  const isVertical = orientation === "vertical";
 
   const buttonStyle: React.CSSProperties = {
-    justifyContent: 'flex-start',
-    height: isVertical ? 'auto' : undefined,
-    minHeight: isVertical ? '50px' : undefined,
-    padding: isVertical ? '12px 16px' : undefined,
-    textAlign: 'left',
+    justifyContent: "flex-start",
+    height: isVertical ? "auto" : undefined,
+    minHeight: isVertical ? "50px" : undefined,
+    padding: isVertical ? "12px 16px" : undefined,
+    textAlign: "left",
   };
 
   const renderButton = (option: ButtonToggleOption) => {
@@ -44,21 +44,21 @@ export const ButtonToggle: React.FC<ButtonToggleProps> = ({
     return (
       <Button
         key={option.value}
-        variant={isSelected ? 'filled' : 'outline'}
+        variant={isSelected ? "filled" : "outline"}
         onClick={() => !isDisabled && onChange(option.value)}
         disabled={isDisabled}
         size={size}
         fullWidth={fullWidth}
         style={buttonStyle}
       >
-        <div style={{ width: '100%' }}>
+        <div style={{ width: "100%" }}>
           <div style={{ fontWeight: 600 }}>{option.label}</div>
           {option.description && (
             <div
               style={{
-                fontSize: '0.85em',
+                fontSize: "0.85em",
                 opacity: 0.8,
-                marginTop: '4px',
+                marginTop: "4px",
                 fontWeight: 400,
               }}
             >
@@ -71,15 +71,11 @@ export const ButtonToggle: React.FC<ButtonToggleProps> = ({
   };
 
   if (isVertical) {
-    return (
-      <Stack gap="xs">
-        {options.map(renderButton)}
-      </Stack>
-    );
+    return <Stack gap="xs">{options.map(renderButton)}</Stack>;
   }
 
   return (
-    <div style={{ display: 'flex', gap: '8px', flexWrap: 'wrap' }}>
+    <div style={{ display: "flex", gap: "8px", flexWrap: "wrap" }}>
       {options.map(renderButton)}
     </div>
   );
diff --git a/frontend/src/core/components/shared/CardSelector.tsx b/frontend/src/core/components/shared/CardSelector.tsx
index 69d970d993..75e9071d81 100644
--- a/frontend/src/core/components/shared/CardSelector.tsx
+++ b/frontend/src/core/components/shared/CardSelector.tsx
@@ -1,6 +1,6 @@
-import { Stack, Card, Text, Flex } from '@mantine/core';
-import { Tooltip } from '@app/components/shared/Tooltip';
-import { useTranslation } from 'react-i18next';
+import { Stack, Card, Text, Flex } from "@mantine/core";
+import { Tooltip } from "@app/components/shared/Tooltip";
+import { useTranslation } from "react-i18next";
 
 export interface CardOption<T = string> {
   value: T;
@@ -21,7 +21,7 @@ const CardSelector = <T, K extends CardOption<T>>({
   options,
   onSelect,
   disabled = false,
-  getTooltipContent
+  getTooltipContent,
 }: CardSelectorProps<T, K>) => {
   const { t } = useTranslation();
 
@@ -36,7 +36,7 @@ const CardSelector = <T, K extends CardOption<T>>({
       return getTooltipContent(option);
     }
     if (option.tooltipKey) {
-      const text = t(option.tooltipKey, '');
+      const text = t(option.tooltipKey, "");
       if (text) return [{ description: text }];
     }
     return [];
@@ -47,58 +47,61 @@ const CardSelector = <T, K extends CardOption<T>>({
       {options.map((option) => {
         const tips = getTooltips(option);
         return (
-        <Tooltip
-          key={option.value as string}
-          sidebarTooltip
-          tips={tips}
-          disabled={tips.length === 0}
-        >
-          <Card
-            radius="md"
-            w="100%"
-            h={'2.8rem'}
-            style={{
-              cursor: disabled ? 'default' : 'pointer',
-              backgroundColor: 'var(--mantine-color-gray-2)',
-              borderColor: 'var(--mantine-color-gray-3)',
-              opacity: disabled ? 0.6 : 1,
-              display: 'flex',
-              flexDirection: 'row',
-              transition: 'all 0.2s ease',
-            }}
-            onMouseEnter={(e) => {
-              if (!disabled) {
-                e.currentTarget.style.backgroundColor = 'var(--mantine-color-gray-3)';
-                e.currentTarget.style.transform = 'translateY(-1px)';
-                e.currentTarget.style.boxShadow = '0 4px 8px rgba(0, 0, 0, 0.1)';
-              }
-            }}
-            onMouseLeave={(e) => {
-              if (!disabled) {
-                e.currentTarget.style.backgroundColor = 'var(--mantine-color-gray-2)';
-                e.currentTarget.style.transform = 'translateY(0px)';
-                e.currentTarget.style.boxShadow = 'none';
-              }
-            }}
-            onClick={() => handleOptionClick(option.value)}
+          <Tooltip
+            key={option.value as string}
+            sidebarTooltip
+            tips={tips}
+            disabled={tips.length === 0}
           >
-            <Flex align={'center'} pl="sm" w="100%">
-              <Text size="sm" c="dimmed" ta="center" fw={350}>
-                {t(option.prefixKey, "Prefix")}
-              </Text>
-              <Text
-                fw={600}
-                size="sm"
-                c={undefined}
-                ta="center"
-                style={{ marginLeft: '0.25rem' }}
-              >
-                {t(option.nameKey, "Option Name")}
-              </Text>
-            </Flex>
-          </Card>
-        </Tooltip>
-      );
+            <Card
+              radius="md"
+              w="100%"
+              h={"2.8rem"}
+              style={{
+                cursor: disabled ? "default" : "pointer",
+                backgroundColor: "var(--mantine-color-gray-2)",
+                borderColor: "var(--mantine-color-gray-3)",
+                opacity: disabled ? 0.6 : 1,
+                display: "flex",
+                flexDirection: "row",
+                transition: "all 0.2s ease",
+              }}
+              onMouseEnter={(e) => {
+                if (!disabled) {
+                  e.currentTarget.style.backgroundColor =
+                    "var(--mantine-color-gray-3)";
+                  e.currentTarget.style.transform = "translateY(-1px)";
+                  e.currentTarget.style.boxShadow =
+                    "0 4px 8px rgba(0, 0, 0, 0.1)";
+                }
+              }}
+              onMouseLeave={(e) => {
+                if (!disabled) {
+                  e.currentTarget.style.backgroundColor =
+                    "var(--mantine-color-gray-2)";
+                  e.currentTarget.style.transform = "translateY(0px)";
+                  e.currentTarget.style.boxShadow = "none";
+                }
+              }}
+              onClick={() => handleOptionClick(option.value)}
+            >
+              <Flex align={"center"} pl="sm" w="100%">
+                <Text size="sm" c="dimmed" ta="center" fw={350}>
+                  {t(option.prefixKey, "Prefix")}
+                </Text>
+                <Text
+                  fw={600}
+                  size="sm"
+                  c={undefined}
+                  ta="center"
+                  style={{ marginLeft: "0.25rem" }}
+                >
+                  {t(option.nameKey, "Option Name")}
+                </Text>
+              </Flex>
+            </Card>
+          </Tooltip>
+        );
       })}
     </Stack>
   );
diff --git a/frontend/src/core/components/shared/DismissAllErrorsButton.tsx b/frontend/src/core/components/shared/DismissAllErrorsButton.tsx
index 43333aff18..6594292351 100644
--- a/frontend/src/core/components/shared/DismissAllErrorsButton.tsx
+++ b/frontend/src/core/components/shared/DismissAllErrorsButton.tsx
@@ -1,32 +1,34 @@
-import React from 'react';
-import { Button, Group } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { useFileState } from '@app/contexts/FileContext';
-import { useFileActions } from '@app/contexts/file/fileHooks';
-import CloseIcon from '@mui/icons-material/Close';
-import { Z_INDEX_TOAST } from '@app/styles/zIndex';
+import React from "react";
+import { Button, Group } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import { useFileState } from "@app/contexts/FileContext";
+import { useFileActions } from "@app/contexts/file/fileHooks";
+import CloseIcon from "@mui/icons-material/Close";
+import { Z_INDEX_TOAST } from "@app/styles/zIndex";
 
 interface DismissAllErrorsButtonProps {
   className?: string;
 }
 
-const DismissAllErrorsButton: React.FC<DismissAllErrorsButtonProps> = ({ className }) => {
+const DismissAllErrorsButton: React.FC<DismissAllErrorsButtonProps> = ({
+  className,
+}) => {
   const { t } = useTranslation();
   const { state } = useFileState();
   const { actions } = useFileActions();
-  
+
   // Check if there are any files in error state
   const hasErrors = state.ui.errorFileIds.length > 0;
-  
+
   // Don't render if there are no errors
   if (!hasErrors) {
     return null;
   }
-  
+
   const handleDismissAllErrors = () => {
     actions.clearAllFileErrors();
   };
-  
+
   return (
     <Group className={className}>
       <Button
@@ -36,14 +38,15 @@ const DismissAllErrorsButton: React.FC<DismissAllErrorsButtonProps> = ({ classNa
         leftSection={<CloseIcon fontSize="small" />}
         onClick={handleDismissAllErrors}
         style={{
-          position: 'absolute',
-          top: '1rem',
-          right: '1rem',
+          position: "absolute",
+          top: "1rem",
+          right: "1rem",
           zIndex: Z_INDEX_TOAST,
-          pointerEvents: 'auto'
+          pointerEvents: "auto",
         }}
       >
-        {t('error.dismissAllErrors', 'Dismiss All Errors')} ({state.ui.errorFileIds.length})
+        {t("error.dismissAllErrors", "Dismiss All Errors")} (
+        {state.ui.errorFileIds.length})
       </Button>
     </Group>
   );
diff --git a/frontend/src/core/components/shared/DropdownListWithFooter.tsx b/frontend/src/core/components/shared/DropdownListWithFooter.tsx
index b5e5a9f5d7..830a10cd23 100644
--- a/frontend/src/core/components/shared/DropdownListWithFooter.tsx
+++ b/frontend/src/core/components/shared/DropdownListWithFooter.tsx
@@ -1,8 +1,16 @@
-import React, { ReactNode, useState, useMemo } from 'react';
-import { Stack, Text, Popover, Box, Checkbox, Group, TextInput } from '@mantine/core';
-import UnfoldMoreIcon from '@mui/icons-material/UnfoldMore';
-import SearchIcon from '@mui/icons-material/Search';
-import { Z_INDEX_AUTOMATE_DROPDOWN } from '@app/styles/zIndex';
+import React, { ReactNode, useState, useMemo } from "react";
+import {
+  Stack,
+  Text,
+  Popover,
+  Box,
+  Checkbox,
+  Group,
+  TextInput,
+} from "@mantine/core";
+import UnfoldMoreIcon from "@mui/icons-material/UnfoldMore";
+import SearchIcon from "@mui/icons-material/Search";
+import { Z_INDEX_AUTOMATE_DROPDOWN } from "@app/styles/zIndex";
 
 export interface DropdownItem {
   value: string;
@@ -15,30 +23,30 @@ export interface DropdownListWithFooterProps {
   // Value and onChange - support both single and multi-select
   value: string | string[];
   onChange: (value: string | string[]) => void;
-  
+
   // Items and display
   items: DropdownItem[];
   placeholder?: string;
   disabled?: boolean;
-  
+
   // Labels and headers
   label?: string;
   header?: ReactNode;
   footer?: ReactNode;
-  
+
   // Behavior
   multiSelect?: boolean;
   searchable?: boolean;
   maxHeight?: number;
-  
+
   // Styling
   className?: string;
   dropdownClassName?: string;
-  
+
   // Popover props
-  position?: 'top' | 'bottom' | 'left' | 'right';
+  position?: "top" | "bottom" | "left" | "right";
   withArrow?: boolean;
-  width?: 'target' | number;
+  width?: "target" | number;
   withinPortal?: boolean;
   zIndex?: number;
 }
@@ -47,7 +55,7 @@ const DropdownListWithFooter: React.FC<DropdownListWithFooterProps> = ({
   value,
   onChange,
   items,
-  placeholder = 'Select option',
+  placeholder = "Select option",
   disabled = false,
   label,
   header,
@@ -55,34 +63,33 @@ const DropdownListWithFooter: React.FC<DropdownListWithFooterProps> = ({
   multiSelect = false,
   searchable = false,
   maxHeight = 300,
-  className = '',
-  dropdownClassName = '',
-  position = 'bottom',
+  className = "",
+  dropdownClassName = "",
+  position = "bottom",
   withArrow = false,
-  width = 'target',
+  width = "target",
   withinPortal = true,
-  zIndex = Z_INDEX_AUTOMATE_DROPDOWN
+  zIndex = Z_INDEX_AUTOMATE_DROPDOWN,
 }) => {
-  
-  const [searchTerm, setSearchTerm] = useState('');
-  
+  const [searchTerm, setSearchTerm] = useState("");
+
   const isMultiValue = Array.isArray(value);
-  const selectedValues = isMultiValue ? value : (value ? [value] : []);
+  const selectedValues = isMultiValue ? value : value ? [value] : [];
 
   // Filter items based on search term
   const filteredItems = useMemo(() => {
     if (!searchable || !searchTerm.trim()) {
       return items;
     }
-    return items.filter(item => 
-      item.name.toLowerCase().includes(searchTerm.toLowerCase())
+    return items.filter((item) =>
+      item.name.toLowerCase().includes(searchTerm.toLowerCase()),
     );
   }, [items, searchTerm, searchable]);
 
   const handleItemClick = (itemValue: string) => {
     if (multiSelect) {
       const newSelection = selectedValues.includes(itemValue)
-        ? selectedValues.filter(v => v !== itemValue)
+        ? selectedValues.filter((v) => v !== itemValue)
         : [...selectedValues, itemValue];
       onChange(newSelection);
     } else {
@@ -94,7 +101,9 @@ const DropdownListWithFooter: React.FC<DropdownListWithFooterProps> = ({
     if (selectedValues.length === 0) {
       return placeholder;
     } else if (selectedValues.length === 1) {
-      const selectedItem = items.find(item => item.value === selectedValues[0]);
+      const selectedItem = items.find(
+        (item) => item.value === selectedValues[0],
+      );
       return selectedItem?.name || selectedValues[0];
     } else {
       return `${selectedValues.length} selected`;
@@ -112,125 +121,144 @@ const DropdownListWithFooter: React.FC<DropdownListWithFooterProps> = ({
           {label}
         </Text>
       )}
-      
-      <Popover 
-        width={width} 
-        position={position} 
-        withArrow={withArrow} 
+
+      <Popover
+        width={width}
+        position={position}
+        withArrow={withArrow}
         shadow="md"
-        onClose={() => searchable && setSearchTerm('')}
+        onClose={() => searchable && setSearchTerm("")}
         withinPortal={withinPortal}
         zIndex={zIndex}
       >
         <Popover.Target>
           <Box
             style={{
-              border: 'light-dark(1px solid var(--mantine-color-gray-3), 1px solid var(--mantine-color-dark-4))',
-              borderRadius: 'var(--mantine-radius-sm)',
-              padding: '8px 12px',
-              backgroundColor: 'light-dark(var(--mantine-color-white), var(--mantine-color-dark-6))',
+              border:
+                "light-dark(1px solid var(--mantine-color-gray-3), 1px solid var(--mantine-color-dark-4))",
+              borderRadius: "var(--mantine-radius-sm)",
+              padding: "8px 12px",
+              backgroundColor:
+                "light-dark(var(--mantine-color-white), var(--mantine-color-dark-6))",
               opacity: disabled ? 0.6 : 1,
-              cursor: disabled ? 'not-allowed' : 'pointer',
-              minHeight: '36px',
-              display: 'flex',
-              alignItems: 'center',
-              justifyContent: 'space-between'
+              cursor: disabled ? "not-allowed" : "pointer",
+              minHeight: "36px",
+              display: "flex",
+              alignItems: "center",
+              justifyContent: "space-between",
             }}
           >
             <Text size="sm" style={{ flex: 1 }}>
               {getDisplayText()}
             </Text>
-            <UnfoldMoreIcon style={{ 
-              fontSize: '1rem', 
-              color: 'light-dark(var(--mantine-color-gray-5), var(--mantine-color-dark-2))' 
-            }} />
+            <UnfoldMoreIcon
+              style={{
+                fontSize: "1rem",
+                color:
+                  "light-dark(var(--mantine-color-gray-5), var(--mantine-color-dark-2))",
+              }}
+            />
           </Box>
         </Popover.Target>
-        
+
         <Popover.Dropdown className={dropdownClassName}>
           <Stack gap="xs">
             {header && (
-              <Box style={{ 
-                borderBottom: 'light-dark(1px solid var(--mantine-color-gray-2), 1px solid var(--mantine-color-dark-4))', 
-                paddingBottom: '8px' 
-              }}>
+              <Box
+                style={{
+                  borderBottom:
+                    "light-dark(1px solid var(--mantine-color-gray-2), 1px solid var(--mantine-color-dark-4))",
+                  paddingBottom: "8px",
+                }}
+              >
                 {header}
               </Box>
             )}
-            
+
             {searchable && (
-              <Box style={{ 
-                borderBottom: 'light-dark(1px solid var(--mantine-color-gray-2), 1px solid var(--mantine-color-dark-4))', 
-                paddingBottom: '8px' 
-              }}>
+              <Box
+                style={{
+                  borderBottom:
+                    "light-dark(1px solid var(--mantine-color-gray-2), 1px solid var(--mantine-color-dark-4))",
+                  paddingBottom: "8px",
+                }}
+              >
                 <TextInput
                   placeholder="Search..."
                   value={searchTerm}
                   onChange={handleSearchChange}
-                  leftSection={<SearchIcon style={{ fontSize: '1rem' }} />}
+                  leftSection={<SearchIcon style={{ fontSize: "1rem" }} />}
                   size="sm"
-                  style={{ width: '100%' }}
+                  style={{ width: "100%" }}
                 />
               </Box>
             )}
-            
-            <Box style={{ maxHeight, overflowY: 'auto' }}>
+
+            <Box style={{ maxHeight, overflowY: "auto" }}>
               {filteredItems.length === 0 ? (
-                <Box style={{ padding: '12px', textAlign: 'center' }}>
+                <Box style={{ padding: "12px", textAlign: "center" }}>
                   <Text size="sm" c="dimmed">
-                    {searchable && searchTerm ? 'No results found' : 'No items available'}
+                    {searchable && searchTerm
+                      ? "No results found"
+                      : "No items available"}
                   </Text>
                 </Box>
               ) : (
                 filteredItems.map((item) => (
-                <Box
-                  key={item.value}
-                  onClick={() => !item.disabled && handleItemClick(item.value)}
-                  style={{
-                    padding: '8px 12px',
-                    cursor: item.disabled ? 'not-allowed' : 'pointer',
-                    borderRadius: 'var(--mantine-radius-sm)',
-                    opacity: item.disabled ? 0.5 : 1,
-                    display: 'flex',
-                    alignItems: 'center',
-                    justifyContent: 'space-between'
-                  }}
-                  onMouseEnter={(e) => {
-                    if (!item.disabled) {
-                      e.currentTarget.style.backgroundColor = 'light-dark(var(--mantine-color-gray-0), var(--mantine-color-dark-5))';
+                  <Box
+                    key={item.value}
+                    onClick={() =>
+                      !item.disabled && handleItemClick(item.value)
                     }
-                  }}
-                  onMouseLeave={(e) => {
-                    e.currentTarget.style.backgroundColor = 'transparent';
-                  }}
-                >
-                  <Group gap="sm" style={{ flex: 1 }}>
-                    {item.leftIcon && (
-                      <Box style={{ display: 'flex', alignItems: 'center' }}>
-                        {item.leftIcon}
-                      </Box>
+                    style={{
+                      padding: "8px 12px",
+                      cursor: item.disabled ? "not-allowed" : "pointer",
+                      borderRadius: "var(--mantine-radius-sm)",
+                      opacity: item.disabled ? 0.5 : 1,
+                      display: "flex",
+                      alignItems: "center",
+                      justifyContent: "space-between",
+                    }}
+                    onMouseEnter={(e) => {
+                      if (!item.disabled) {
+                        e.currentTarget.style.backgroundColor =
+                          "light-dark(var(--mantine-color-gray-0), var(--mantine-color-dark-5))";
+                      }
+                    }}
+                    onMouseLeave={(e) => {
+                      e.currentTarget.style.backgroundColor = "transparent";
+                    }}
+                  >
+                    <Group gap="sm" style={{ flex: 1 }}>
+                      {item.leftIcon && (
+                        <Box style={{ display: "flex", alignItems: "center" }}>
+                          {item.leftIcon}
+                        </Box>
+                      )}
+                      <Text size="sm">{item.name}</Text>
+                    </Group>
+
+                    {multiSelect && (
+                      <Checkbox
+                        checked={selectedValues.includes(item.value)}
+                        onChange={() => {}} // Handled by parent onClick
+                        size="sm"
+                        disabled={item.disabled}
+                      />
                     )}
-                    <Text size="sm">{item.name}</Text>
-                  </Group>
-                  
-                  {multiSelect && (
-                    <Checkbox
-                      checked={selectedValues.includes(item.value)}
-                      onChange={() => {}} // Handled by parent onClick
-                      size="sm"
-                      disabled={item.disabled}
-                    />
-                  )}
-                </Box>
+                  </Box>
                 ))
               )}
             </Box>
-            
+
             {footer && (
-              <Box style={{ 
-                borderTop: 'light-dark(1px solid var(--mantine-color-gray-2), 1px solid var(--mantine-color-dark-4))', 
-                paddingTop: '8px' 
-              }}>
+              <Box
+                style={{
+                  borderTop:
+                    "light-dark(1px solid var(--mantine-color-gray-2), 1px solid var(--mantine-color-dark-4))",
+                  paddingTop: "8px",
+                }}
+              >
                 {footer}
               </Box>
             )}
@@ -241,4 +269,4 @@ const DropdownListWithFooter: React.FC<DropdownListWithFooterProps> = ({
   );
 };
 
-export default DropdownListWithFooter; 
\ No newline at end of file
+export default DropdownListWithFooter;
diff --git a/frontend/src/core/components/shared/EditableSecretField.tsx b/frontend/src/core/components/shared/EditableSecretField.tsx
index dfd3da6458..2244989269 100644
--- a/frontend/src/core/components/shared/EditableSecretField.tsx
+++ b/frontend/src/core/components/shared/EditableSecretField.tsx
@@ -1,7 +1,13 @@
-import { useState, useRef, useEffect } from 'react';
-import { PasswordInput, Group, ActionIcon, Tooltip, TextInput } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import LocalIcon from '@app/components/shared/LocalIcon';
+import { useState, useRef, useEffect } from "react";
+import {
+  PasswordInput,
+  Group,
+  ActionIcon,
+  Tooltip,
+  TextInput,
+} from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import LocalIcon from "@app/components/shared/LocalIcon";
 
 interface EditableSecretFieldProps {
   label?: string;
@@ -26,16 +32,16 @@ export default function EditableSecretField({
   description,
   value,
   onChange,
-  placeholder = 'Enter value',
+  placeholder = "Enter value",
   disabled = false,
   error,
 }: EditableSecretFieldProps) {
   const { t } = useTranslation();
   const [isEditing, setIsEditing] = useState(false);
-  const [tempValue, setTempValue] = useState('');
+  const [tempValue, setTempValue] = useState("");
   const inputRef = useRef<HTMLInputElement>(null);
 
-  const isMasked = value === '********';
+  const isMasked = value === "********";
 
   useEffect(() => {
     if (isEditing && inputRef.current) {
@@ -44,38 +50,50 @@ export default function EditableSecretField({
   }, [isEditing]);
 
   const handleEdit = () => {
-    setTempValue('');
+    setTempValue("");
     setIsEditing(true);
   };
 
   const handleCancel = () => {
-    setTempValue('');
+    setTempValue("");
     setIsEditing(false);
   };
 
   const handleSave = () => {
-    if (tempValue.trim() !== '') {
+    if (tempValue.trim() !== "") {
       onChange(tempValue);
     }
-    setTempValue('');
+    setTempValue("");
     setIsEditing(false);
   };
 
   return (
     <div>
-      {label && <label style={{ display: 'block', marginBottom: 4, fontWeight: 500, fontSize: '0.875rem' }}>{label}</label>}
-      {description && <p style={{ margin: '4px 0 12px 0', fontSize: '0.75rem', color: '#666' }}>{description}</p>}
+      {label && (
+        <label
+          style={{
+            display: "block",
+            marginBottom: 4,
+            fontWeight: 500,
+            fontSize: "0.875rem",
+          }}
+        >
+          {label}
+        </label>
+      )}
+      {description && (
+        <p
+          style={{ margin: "4px 0 12px 0", fontSize: "0.75rem", color: "#666" }}
+        >
+          {description}
+        </p>
+      )}
 
       {isMasked && !isEditing ? (
         // Masked value from backend: show display + Edit button
         <Group gap="xs" align="flex-end">
-          <TextInput
-            value="••••••••"
-            disabled
-            style={{ flex: 1 }}
-            readOnly
-          />
-          <Tooltip label={t('editSecret')} withArrow>
+          <TextInput value="••••••••" disabled style={{ flex: 1 }} readOnly />
+          <Tooltip label={t("editSecret")} withArrow>
             <ActionIcon
               variant="light"
               onClick={handleEdit}
@@ -99,7 +117,7 @@ export default function EditableSecretField({
           autoComplete="new-password"
           onBlur={handleSave}
           onKeyDown={(e) => {
-            if (e.key === 'Escape') handleCancel();
+            if (e.key === "Escape") handleCancel();
           }}
         />
       ) : (
diff --git a/frontend/src/core/components/shared/EncryptedPdfUnlockModal.tsx b/frontend/src/core/components/shared/EncryptedPdfUnlockModal.tsx
index 5ba2dbf053..f713d1e526 100644
--- a/frontend/src/core/components/shared/EncryptedPdfUnlockModal.tsx
+++ b/frontend/src/core/components/shared/EncryptedPdfUnlockModal.tsx
@@ -1,7 +1,14 @@
-import { Modal, Stack, Text, Button, PasswordInput, Group } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { type KeyboardEventHandler } from 'react';
-import { Z_INDEX_OVER_FULLSCREEN_SURFACE } from '@app/styles/zIndex';
+import {
+  Modal,
+  Stack,
+  Text,
+  Button,
+  PasswordInput,
+  Group,
+} from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import { type KeyboardEventHandler } from "react";
+import { Z_INDEX_OVER_FULLSCREEN_SURFACE } from "@app/styles/zIndex";
 
 interface EncryptedPdfUnlockModalProps {
   opened: boolean;
@@ -9,8 +16,10 @@ interface EncryptedPdfUnlockModalProps {
   password: string;
   errorMessage?: string | null;
   isProcessing: boolean;
+  remainingCount: number;
   onPasswordChange: (value: string) => void;
   onUnlock: () => void;
+  onUnlockAll: () => void;
   onSkip: () => void;
 }
 
@@ -20,14 +29,16 @@ const EncryptedPdfUnlockModal = ({
   password,
   errorMessage,
   isProcessing,
+  remainingCount,
   onPasswordChange,
   onUnlock,
+  onUnlockAll,
   onSkip,
 }: EncryptedPdfUnlockModalProps) => {
   const { t } = useTranslation();
 
   const handleKeyDown: KeyboardEventHandler<HTMLInputElement> = (event) => {
-    if (event.key === 'Enter' && !isProcessing && password.trim().length > 0) {
+    if (event.key === "Enter" && !isProcessing && password.trim().length > 0) {
       onUnlock();
     }
   };
@@ -36,7 +47,7 @@ const EncryptedPdfUnlockModal = ({
     <Modal
       opened={opened}
       onClose={onSkip}
-      title={t('encryptedPdfUnlock.title', 'Remove password to continue')}
+      title={t("encryptedPdfUnlock.title", "Remove password to continue")}
       centered
       size="md"
       closeOnClickOutside={!isProcessing}
@@ -44,18 +55,23 @@ const EncryptedPdfUnlockModal = ({
       zIndex={Z_INDEX_OVER_FULLSCREEN_SURFACE}
     >
       <Stack gap="md">
-        <Text fw={600} ta="center">{fileName}</Text>
+        <Text fw={600} ta="center">
+          {fileName}
+        </Text>
         <Text c="dimmed" ta="center">
           {t(
-            'encryptedPdfUnlock.description',
-            'This PDF is password protected. Enter the password so you can continue working with it.'
+            "encryptedPdfUnlock.description",
+            "This PDF is password protected. Enter the password so you can continue working with it.",
           )}
         </Text>
 
         <Stack gap={4}>
           <PasswordInput
-            label={t('encryptedPdfUnlock.password.label', 'PDF password')}
-            placeholder={t('encryptedPdfUnlock.password.placeholder', 'Enter the PDF password')}
+            label={t("encryptedPdfUnlock.password.label", "PDF password")}
+            placeholder={t(
+              "encryptedPdfUnlock.password.placeholder",
+              "Enter the PDF password",
+            )}
             value={password}
             onChange={(event) => onPasswordChange(event.currentTarget.value)}
             onKeyDown={handleKeyDown}
@@ -70,12 +86,35 @@ const EncryptedPdfUnlockModal = ({
         </Stack>
 
         <Group justify="space-between">
-          <Button variant="light" color="var(--mantine-color-gray-8)" onClick={onSkip} disabled={isProcessing}>
-            {t('encryptedPdfUnlock.skip', 'Skip for now')}
-          </Button>
-          <Button onClick={onUnlock} loading={isProcessing} disabled={password.trim().length === 0}>
-            {t('encryptedPdfUnlock.unlock', 'Unlock & Continue')}
+          <Button
+            variant="light"
+            color="var(--mantine-color-gray-8)"
+            onClick={onSkip}
+            disabled={isProcessing}
+          >
+            {t("encryptedPdfUnlock.skip", "Skip for now")}
           </Button>
+          <Group gap="xs">
+            {remainingCount > 0 && (
+              <Button
+                variant="light"
+                onClick={onUnlockAll}
+                loading={isProcessing}
+                disabled={password.trim().length === 0}
+              >
+                {t("encryptedPdfUnlock.unlockAll", "Use for all ({{count}})", {
+                  count: remainingCount + 1,
+                })}
+              </Button>
+            )}
+            <Button
+              onClick={onUnlock}
+              loading={isProcessing}
+              disabled={password.trim().length === 0}
+            >
+              {t("encryptedPdfUnlock.unlock", "Unlock & Continue")}
+            </Button>
+          </Group>
         </Group>
       </Stack>
     </Modal>
diff --git a/frontend/src/core/components/shared/ErrorBoundary.tsx b/frontend/src/core/components/shared/ErrorBoundary.tsx
index 0bab94f0a2..aa2f126287 100644
--- a/frontend/src/core/components/shared/ErrorBoundary.tsx
+++ b/frontend/src/core/components/shared/ErrorBoundary.tsx
@@ -1,5 +1,5 @@
-import React from 'react';
-import { Text, Button, Stack } from '@mantine/core';
+import React from "react";
+import { Text, Button, Stack } from "@mantine/core";
 
 interface ErrorBoundaryState {
   hasError: boolean;
@@ -8,10 +8,13 @@ interface ErrorBoundaryState {
 
 interface ErrorBoundaryProps {
   children: React.ReactNode;
-  fallback?: React.ComponentType<{error?: Error; retry: () => void}>;
+  fallback?: React.ComponentType<{ error?: Error; retry: () => void }>;
 }
 
-export default class ErrorBoundary extends React.Component<ErrorBoundaryProps, ErrorBoundaryState> {
+export default class ErrorBoundary extends React.Component<
+  ErrorBoundaryProps,
+  ErrorBoundaryState
+> {
   constructor(props: ErrorBoundaryProps) {
     super(props);
     this.state = { hasError: false };
@@ -23,41 +26,43 @@ export default class ErrorBoundary extends React.Component<ErrorBoundaryProps, E
 
   componentDidCatch(error: Error, errorInfo: React.ErrorInfo) {
     // Enhanced logging for diagnosis
-    console.error('����������������������������������������');
-    console.error('🔴 ErrorBoundary caught an error');
-    console.error('����������������������������������������');
-    console.error('Error:', error);
-    console.error('Error name:', error.name);
-    console.error('Error message:', error.message);
-    console.error('Error stack:', error.stack);
-    console.error('Component stack:', errorInfo.componentStack);
-    console.error('Current URL:', window.location.href);
-    console.error('Current pathname:', window.location.pathname);
-    console.error('Current hash:', window.location.hash);
-    console.error('Current search:', window.location.search);
-    console.error('Timestamp:', new Date().toISOString());
-    console.error('User agent:', navigator.userAgent);
+    console.error("����������������������������������������");
+    console.error("🔴 ErrorBoundary caught an error");
+    console.error("����������������������������������������");
+    console.error("Error:", error);
+    console.error("Error name:", error.name);
+    console.error("Error message:", error.message);
+    console.error("Error stack:", error.stack);
+    console.error("Component stack:", errorInfo.componentStack);
+    console.error("Current URL:", window.location.href);
+    console.error("Current pathname:", window.location.pathname);
+    console.error("Current hash:", window.location.hash);
+    console.error("Current search:", window.location.search);
+    console.error("Timestamp:", new Date().toISOString());
+    console.error("User agent:", navigator.userAgent);
     // Check for React error codes
-    if (error.message.includes('Minified React error')) {
+    if (error.message.includes("Minified React error")) {
       const errorCodeMatch = error.message.match(/#(\d+)/);
       if (errorCodeMatch) {
         const errorCode = errorCodeMatch[1];
-        console.error(`React Error #${errorCode}: https://react.dev/errors/${errorCode}`);
+        console.error(
+          `React Error #${errorCode}: https://react.dev/errors/${errorCode}`,
+        );
       }
     }
 
     // Check localStorage for auth state
     try {
-      const jwt = localStorage.getItem('stirling_jwt');
-      console.error('Auth state:', {
+      const jwt = localStorage.getItem("stirling_jwt");
+      console.error("Auth state:", {
         hasJWT: !!jwt,
         jwtLength: jwt?.length || 0,
       });
     } catch (e) {
-      console.error('Could not check localStorage:', e);
+      console.error("Could not check localStorage:", e);
     }
 
-    console.error('����������������������������������������');
+    console.error("����������������������������������������");
   }
 
   retry = () => {
@@ -72,26 +77,51 @@ export default class ErrorBoundary extends React.Component<ErrorBoundaryProps, E
       }
 
       return (
-        <Stack align="center" justify="center" style={{ minHeight: '200px', padding: '2rem', maxWidth: '800px', margin: '0 auto' }}>
-          <Text size="lg" fw={500} c="red">Something went wrong</Text>
-          {process.env.NODE_ENV === 'development' && this.state.error && (
+        <Stack
+          align="center"
+          justify="center"
+          style={{
+            minHeight: "200px",
+            padding: "2rem",
+            maxWidth: "800px",
+            margin: "0 auto",
+          }}
+        >
+          <Text size="lg" fw={500} c="red">
+            Something went wrong
+          </Text>
+          {process.env.NODE_ENV === "development" && this.state.error && (
             <>
-              <Text size="sm" c="dimmed" style={{ textAlign: 'center', fontFamily: 'monospace', marginTop: '1rem' }}>
+              <Text
+                size="sm"
+                c="dimmed"
+                style={{
+                  textAlign: "center",
+                  fontFamily: "monospace",
+                  marginTop: "1rem",
+                }}
+              >
                 {this.state.error.message}
               </Text>
               {this.state.error.stack && (
-                <details style={{ marginTop: '1rem', width: '100%' }}>
-                  <summary style={{ cursor: 'pointer', marginBottom: '0.5rem' }}>
-                    <Text size="sm" component="span">Show stack trace</Text>
+                <details style={{ marginTop: "1rem", width: "100%" }}>
+                  <summary
+                    style={{ cursor: "pointer", marginBottom: "0.5rem" }}
+                  >
+                    <Text size="sm" component="span">
+                      Show stack trace
+                    </Text>
                   </summary>
-                  <pre style={{
-                    fontSize: '0.75rem',
-                    overflow: 'auto',
-                    backgroundColor: '#f5f5f5',
-                    padding: '1rem',
-                    borderRadius: '4px',
-                    maxHeight: '300px'
-                  }}>
+                  <pre
+                    style={{
+                      fontSize: "0.75rem",
+                      overflow: "auto",
+                      backgroundColor: "#f5f5f5",
+                      padding: "1rem",
+                      borderRadius: "4px",
+                      maxHeight: "300px",
+                    }}
+                  >
                     {this.state.error.stack}
                   </pre>
                 </details>
diff --git a/frontend/src/core/components/shared/FileCard.tsx b/frontend/src/core/components/shared/FileCard.tsx
index dda4791753..6bb1f8ee84 100644
--- a/frontend/src/core/components/shared/FileCard.tsx
+++ b/frontend/src/core/components/shared/FileCard.tsx
@@ -1,5 +1,18 @@
 import { useState } from "react";
-import { Card, Stack, Text, Group, Badge, Button, Box, Image, ThemeIcon, ActionIcon, Tooltip, Loader } from "@mantine/core";
+import {
+  Card,
+  Stack,
+  Text,
+  Group,
+  Badge,
+  Button,
+  Box,
+  Image,
+  ThemeIcon,
+  ActionIcon,
+  Tooltip,
+  Loader,
+} from "@mantine/core";
 import { useTranslation } from "react-i18next";
 import PictureAsPdfIcon from "@mui/icons-material/PictureAsPdf";
 import StorageIcon from "@mui/icons-material/Storage";
@@ -22,15 +35,26 @@ interface FileCardProps {
   isSupported?: boolean; // Whether the file format is supported by the current tool
 }
 
-const FileCard = ({ file, fileStub, onRemove, onDoubleClick, onView, onEdit, isSelected, onSelect, isSupported = true }: FileCardProps) => {
+const FileCard = ({
+  file,
+  fileStub,
+  onRemove,
+  onDoubleClick,
+  onView,
+  onEdit,
+  isSelected,
+  onSelect,
+  isSupported = true,
+}: FileCardProps) => {
   const { t } = useTranslation();
   // Use record thumbnail if available, otherwise fall back to IndexedDB lookup
-  const { thumbnail: indexedDBThumb, isGenerating } = useIndexedDBThumbnail(fileStub);
+  const { thumbnail: indexedDBThumb, isGenerating } =
+    useIndexedDBThumbnail(fileStub);
   const thumb = fileStub?.thumbnailUrl || indexedDBThumb;
   const [isHovered, setIsHovered] = useState(false);
 
   // Show loading state during hydration: PDF file without thumbnail yet
-  const isPdf = file.type === 'application/pdf';
+  const isPdf = file.type === "application/pdf";
   const isHydrating = isPdf && !thumb && !isGenerating;
 
   return (
@@ -44,11 +68,13 @@ const FileCard = ({ file, fileStub, onRemove, onDoubleClick, onView, onEdit, isS
         minWidth: 180,
         maxWidth: 260,
         cursor: onDoubleClick && isSupported ? "pointer" : undefined,
-        position: 'relative',
-        border: isSelected ? '2px solid var(--mantine-color-blue-6)' : undefined,
-        backgroundColor: isSelected ? 'var(--mantine-color-blue-0)' : undefined,
+        position: "relative",
+        border: isSelected
+          ? "2px solid var(--mantine-color-blue-6)"
+          : undefined,
+        backgroundColor: isSelected ? "var(--mantine-color-blue-0)" : undefined,
         opacity: isSupported ? 1 : 0.5,
-        filter: isSupported ? 'none' : 'grayscale(50%)'
+        filter: isSupported ? "none" : "grayscale(50%)",
       }}
       onDoubleClick={onDoubleClick}
       onMouseEnter={() => setIsHovered(true)}
@@ -69,22 +95,22 @@ const FileCard = ({ file, fileStub, onRemove, onDoubleClick, onView, onEdit, isS
             justifyContent: "center",
             margin: "0 auto",
             background: "#fafbfc",
-            position: 'relative'
+            position: "relative",
           }}
         >
           {/* Hover action buttons */}
           {isHovered && (onView || onEdit) && (
             <div
               style={{
-                position: 'absolute',
+                position: "absolute",
                 top: 4,
                 right: 4,
-                display: 'flex',
+                display: "flex",
                 gap: 4,
                 zIndex: 10,
-                backgroundColor: 'rgba(255, 255, 255, 0.9)',
+                backgroundColor: "rgba(255, 255, 255, 0.9)",
                 borderRadius: 4,
-                padding: 2
+                padding: 2,
               }}
               onClick={(e) => e.stopPropagation()}
             >
@@ -129,29 +155,39 @@ const FileCard = ({ file, fileStub, onRemove, onDoubleClick, onView, onEdit, isS
               fit="contain"
               radius="sm"
             />
-          ) : (isGenerating || isHydrating) ? (
+          ) : isGenerating || isHydrating ? (
             <Stack align="center" justify="center" gap="xs">
               <Loader size="sm" />
-              <Text size="xs" c="dimmed">Loading...</Text>
+              <Text size="xs" c="dimmed">
+                Loading...
+              </Text>
             </Stack>
           ) : (
-            <div style={{
-              display: 'flex',
-              flexDirection: 'column',
-              alignItems: 'center',
-              justifyContent: 'center'
-            }}>
+            <div
+              style={{
+                display: "flex",
+                flexDirection: "column",
+                alignItems: "center",
+                justifyContent: "center",
+              }}
+            >
               <ThemeIcon
                 variant="light"
                 color={file.size > 100 * 1024 * 1024 ? "orange" : "red"}
                 size={60}
                 radius="sm"
-                style={{ display: "flex", alignItems: "center", justifyContent: "center" }}
+                style={{
+                  display: "flex",
+                  alignItems: "center",
+                  justifyContent: "center",
+                }}
               >
                 <PictureAsPdfIcon style={{ fontSize: 40 }} />
               </ThemeIcon>
               {file.size > 100 * 1024 * 1024 && (
-                <Text size="xs" c="dimmed" mt={4}>Large File</Text>
+                <Text size="xs" c="dimmed" mt={4}>
+                  Large File
+                </Text>
               )}
             </div>
           )}
diff --git a/frontend/src/core/components/shared/FileDropdownMenu.tsx b/frontend/src/core/components/shared/FileDropdownMenu.tsx
index 3d1f9427af..ce38049af0 100644
--- a/frontend/src/core/components/shared/FileDropdownMenu.tsx
+++ b/frontend/src/core/components/shared/FileDropdownMenu.tsx
@@ -1,21 +1,12 @@
-import React from 'react';
-import { Menu, Loader, Group, Text, ActionIcon, Tooltip } from '@mantine/core';
-import InsertDriveFileIcon from '@mui/icons-material/InsertDriveFile';
-import KeyboardArrowDownIcon from '@mui/icons-material/KeyboardArrowDown';
-import CloseIcon from '@mui/icons-material/Close';
-import FitText from '@app/components/shared/FitText';
-import { PrivateContent } from '@app/components/shared/PrivateContent';
-import { FileId } from '@app/types/file';
-
-// Truncate text from the center: "very-long-filename.pdf" -> "very-lo...ame.pdf"
-function truncateCenter(text: string, maxLength: number = 25): string {
-  if (text.length <= maxLength) return text;
-  const ellipsis = '...';
-  const charsToShow = maxLength - ellipsis.length;
-  const frontChars = Math.ceil(charsToShow / 2);
-  const backChars = Math.floor(charsToShow / 2);
-  return text.substring(0, frontChars) + ellipsis + text.substring(text.length - backChars);
-}
+import React from "react";
+import { Menu, Loader, Group, Text, ActionIcon, Tooltip } from "@mantine/core";
+import InsertDriveFileIcon from "@mui/icons-material/InsertDriveFile";
+import KeyboardArrowDownIcon from "@mui/icons-material/KeyboardArrowDown";
+import CloseIcon from "@mui/icons-material/Close";
+import FitText from "@app/components/shared/FitText";
+import { PrivateContent } from "@app/components/shared/PrivateContent";
+import { FileId } from "@app/types/file";
+import { truncateCenter } from "@app/utils/textUtils";
 
 interface FileDropdownMenuProps {
   displayName: string;
@@ -40,7 +31,9 @@ export const FileDropdownMenu: React.FC<FileDropdownMenuProps> = ({
   return (
     <Menu trigger="click" position="bottom" width="30rem">
       <Menu.Target>
-        <div style={{...viewOptionStyle, cursor: 'pointer', maxWidth: '100%'}}>
+        <div
+          style={{ ...viewOptionStyle, cursor: "pointer", maxWidth: "100%" }}
+        >
           {switchingTo === "viewer" ? (
             <Loader size="xs" />
           ) : (
@@ -50,22 +43,24 @@ export const FileDropdownMenu: React.FC<FileDropdownMenuProps> = ({
             <FitText
               text={truncateCenter(displayName, 30)}
               minimumFontScale={0.6}
-              style={{ maxWidth: '12rem', display: 'inline-block' }}
+              style={{ maxWidth: "12rem", display: "inline-block" }}
             />
           </PrivateContent>
           <KeyboardArrowDownIcon fontSize="small" style={{ flexShrink: 0 }} />
         </div>
       </Menu.Target>
-      <Menu.Dropdown style={{
-        backgroundColor: 'var(--right-rail-bg)',
-        border: '1px solid var(--border-subtle)',
-        borderRadius: '8px',
-        boxShadow: '0 2px 8px rgba(0, 0, 0, 0.15)',
-        maxHeight: '50vh',
-        overflowY: 'auto'
-      }}>
+      <Menu.Dropdown
+        style={{
+          backgroundColor: "var(--right-rail-bg)",
+          border: "1px solid var(--border-subtle)",
+          borderRadius: "8px",
+          boxShadow: "0 2px 8px rgba(0, 0, 0, 0.15)",
+          maxHeight: "50vh",
+          overflowY: "auto",
+        }}
+      >
         {activeFiles.map((file, index) => {
-          const itemName = file?.name || 'Untitled';
+          const itemName = file?.name || "Untitled";
           const isActive = index === currentFileIndex;
           return (
             <Menu.Item
@@ -75,18 +70,21 @@ export const FileDropdownMenu: React.FC<FileDropdownMenuProps> = ({
                 onFileSelect?.(index);
               }}
               className="viewer-file-tab"
-              {...(isActive && { 'data-active': true })}
+              {...(isActive && { "data-active": true })}
               style={{
-                justifyContent: 'flex-start',
+                justifyContent: "flex-start",
               }}
             >
-              <Group gap="xs" style={{ width: '100%', justifyContent: 'space-between' }}>
-                <div style={{ flex: 1, textAlign: 'left', minWidth: 0 }}>
+              <Group
+                gap="xs"
+                style={{ width: "100%", justifyContent: "space-between" }}
+              >
+                <div style={{ flex: 1, textAlign: "left", minWidth: 0 }}>
                   <PrivateContent>
                     <FitText
                       text={truncateCenter(itemName, 50)}
                       minimumFontScale={0.7}
-                      style={{ display: 'block', width: '100%' }}
+                      style={{ display: "block", width: "100%" }}
                     />
                   </PrivateContent>
                 </div>
diff --git a/frontend/src/core/components/shared/FileGrid.tsx b/frontend/src/core/components/shared/FileGrid.tsx
index 5bd31008db..2ade54426f 100644
--- a/frontend/src/core/components/shared/FileGrid.tsx
+++ b/frontend/src/core/components/shared/FileGrid.tsx
@@ -1,5 +1,13 @@
 import { useState } from "react";
-import { Box, Flex, Group, Text, Button, TextInput, Select } from "@mantine/core";
+import {
+  Box,
+  Flex,
+  Group,
+  Text,
+  Button,
+  TextInput,
+  Select,
+} from "@mantine/core";
 import { useTranslation } from "react-i18next";
 import SearchIcon from "@mui/icons-material/Search";
 import SortIcon from "@mui/icons-material/Sort";
@@ -24,7 +32,7 @@ interface FileGridProps {
   isFileSupported?: (fileName: string) => boolean; // Function to check if file is supported
 }
 
-type SortOption = 'date' | 'name' | 'size';
+type SortOption = "date" | "name" | "size";
 
 const FileGrid = ({
   files,
@@ -40,25 +48,25 @@ const FileGrid = ({
   onShowAll,
   showingAll = false,
   onDeleteAll,
-  isFileSupported
+  isFileSupported,
 }: FileGridProps) => {
   const { t } = useTranslation();
   const [searchTerm, setSearchTerm] = useState("");
-  const [sortBy, setSortBy] = useState<SortOption>('date');
+  const [sortBy, setSortBy] = useState<SortOption>("date");
 
   // Filter files based on search term
-  const filteredFiles = files.filter(item =>
-    item.file.name.toLowerCase().includes(searchTerm.toLowerCase())
+  const filteredFiles = files.filter((item) =>
+    item.file.name.toLowerCase().includes(searchTerm.toLowerCase()),
   );
 
   // Sort files
   const sortedFiles = [...filteredFiles].sort((a, b) => {
     switch (sortBy) {
-      case 'date':
+      case "date":
         return (b.file.lastModified || 0) - (a.file.lastModified || 0);
-      case 'name':
+      case "name":
         return a.file.name.localeCompare(b.file.name);
-      case 'size':
+      case "size":
         return (b.file.size || 0) - (a.file.size || 0);
       default:
         return 0;
@@ -66,14 +74,14 @@ const FileGrid = ({
   });
 
   // Apply max display limit if specified
-  const displayFiles = maxDisplay && !showingAll
-    ? sortedFiles.slice(0, maxDisplay)
-    : sortedFiles;
+  const displayFiles =
+    maxDisplay && !showingAll ? sortedFiles.slice(0, maxDisplay) : sortedFiles;
 
-  const hasMoreFiles = maxDisplay && !showingAll && sortedFiles.length > maxDisplay;
+  const hasMoreFiles =
+    maxDisplay && !showingAll && sortedFiles.length > maxDisplay;
 
   return (
-    <Box >
+    <Box>
       {/* Search and Sort Controls */}
       {(showSearch || showSort || onDeleteAll) && (
         <Group mb="md" justify="space-between" wrap="wrap" gap="sm">
@@ -91,9 +99,18 @@ const FileGrid = ({
             {showSort && (
               <Select
                 data={[
-                  { value: 'date', label: t("fileManager.sortByDate", "Sort by Date") },
-                  { value: 'name', label: t("fileManager.sortByName", "Sort by Name") },
-                  { value: 'size', label: t("fileManager.sortBySize", "Sort by Size") }
+                  {
+                    value: "date",
+                    label: t("fileManager.sortByDate", "Sort by Date"),
+                  },
+                  {
+                    value: "name",
+                    label: t("fileManager.sortByName", "Sort by Name"),
+                  },
+                  {
+                    value: "size",
+                    label: t("fileManager.sortBySize", "Sort by Size"),
+                  },
                 ]}
                 value={sortBy}
                 onChange={(value) => setSortBy(value as SortOption)}
@@ -104,11 +121,7 @@ const FileGrid = ({
           </Group>
 
           {onDeleteAll && (
-            <Button
-              color="red"
-              size="sm"
-              onClick={onDeleteAll}
-            >
+            <Button color="red" size="sm" onClick={onDeleteAll}>
               {t("fileManager.deleteAll", "Delete All")}
             </Button>
           )}
@@ -124,41 +137,49 @@ const FileGrid = ({
         style={{ overflowY: "auto", width: "100%" }}
       >
         {displayFiles
-          .filter(item => {
+          .filter((item) => {
             if (!item.record?.id) {
-              console.error('FileGrid: File missing StirlingFileStub with proper ID:', item.file.name);
+              console.error(
+                "FileGrid: File missing StirlingFileStub with proper ID:",
+                item.file.name,
+              );
               return false;
             }
             return true;
           })
           .map((item, idx) => {
-          const fileId = item.record!.id; // Safe to assert after filter
-          const originalIdx = files.findIndex(f => f.record?.id === fileId);
-          const supported = isFileSupported ? isFileSupported(item.file.name) : true;
-          return (
-            <FileCard
-              key={fileId + idx}
-              file={item.file}
-              fileStub={item.record}
-              onRemove={onRemove ? () => onRemove(originalIdx) : () => {}}
-              onDoubleClick={onDoubleClick && supported ? () => onDoubleClick(item) : undefined}
-              onView={onView && supported ? () => onView(item) : undefined}
-              onEdit={onEdit && supported ? () => onEdit(item) : undefined}
-              isSelected={selectedFiles.includes(fileId)}
-              onSelect={onSelect && supported ? () => onSelect(fileId) : undefined}
-              isSupported={supported}
-            />
-          );
-        })}
+            const fileId = item.record!.id; // Safe to assert after filter
+            const originalIdx = files.findIndex((f) => f.record?.id === fileId);
+            const supported = isFileSupported
+              ? isFileSupported(item.file.name)
+              : true;
+            return (
+              <FileCard
+                key={fileId + idx}
+                file={item.file}
+                fileStub={item.record}
+                onRemove={onRemove ? () => onRemove(originalIdx) : () => {}}
+                onDoubleClick={
+                  onDoubleClick && supported
+                    ? () => onDoubleClick(item)
+                    : undefined
+                }
+                onView={onView && supported ? () => onView(item) : undefined}
+                onEdit={onEdit && supported ? () => onEdit(item) : undefined}
+                isSelected={selectedFiles.includes(fileId)}
+                onSelect={
+                  onSelect && supported ? () => onSelect(fileId) : undefined
+                }
+                isSupported={supported}
+              />
+            );
+          })}
       </Flex>
 
       {/* Show All Button */}
       {hasMoreFiles && onShowAll && (
         <Group justify="center" mt="md">
-          <Button
-            variant="light"
-            onClick={onShowAll}
-          >
+          <Button variant="light" onClick={onShowAll}>
             {t("fileManager.showAll", "Show All")} ({sortedFiles.length} files)
           </Button>
         </Group>
@@ -166,12 +187,14 @@ const FileGrid = ({
 
       {/* Empty State */}
       {displayFiles.length === 0 && (
-        <Box style={{ textAlign: 'center', padding: '2rem' }}>
+        <Box style={{ textAlign: "center", padding: "2rem" }}>
           <Text c="dimmed">
             {searchTerm
-              ? t("fileManager.noFilesFound", "No files found matching your search")
-              : t("fileManager.noFiles", "No files available")
-            }
+              ? t(
+                  "fileManager.noFilesFound",
+                  "No files found matching your search",
+                )
+              : t("fileManager.noFiles", "No files available")}
           </Text>
         </Box>
       )}
diff --git a/frontend/src/core/components/shared/FilePickerModal.tsx b/frontend/src/core/components/shared/FilePickerModal.tsx
index 3f5e78b345..16f35f9fb1 100644
--- a/frontend/src/core/components/shared/FilePickerModal.tsx
+++ b/frontend/src/core/components/shared/FilePickerModal.tsx
@@ -1,4 +1,4 @@
-import { useState, useEffect } from 'react';
+import { useState, useEffect } from "react";
 import {
   Modal,
   Text,
@@ -11,12 +11,12 @@ import {
   Image,
   Badge,
   ThemeIcon,
-  SimpleGrid
-} from '@mantine/core';
-import PictureAsPdfIcon from '@mui/icons-material/PictureAsPdf';
-import { useTranslation } from 'react-i18next';
-import { FileId } from '@app/types/file';
-import { useFileActionTerminology } from '@app/hooks/useFileActionTerminology';
+  SimpleGrid,
+} from "@mantine/core";
+import PictureAsPdfIcon from "@mui/icons-material/PictureAsPdf";
+import { useTranslation } from "react-i18next";
+import { FileId } from "@app/types/file";
+import { useFileActionTerminology } from "@app/hooks/useFileActionTerminology";
 
 interface FilePickerModalProps {
   opened: boolean;
@@ -43,15 +43,15 @@ const FilePickerModal = ({
   }, [opened]);
 
   const toggleFileSelection = (fileId: FileId) => {
-    setSelectedFileIds(prev => {
+    setSelectedFileIds((prev) => {
       return prev.includes(fileId)
-        ? prev.filter(id => id !== fileId)
+        ? prev.filter((id) => id !== fileId)
         : [...prev, fileId];
     });
   };
 
   const selectAll = () => {
-    setSelectedFileIds(storedFiles.map(f => f.id).filter(Boolean));
+    setSelectedFileIds(storedFiles.map((f) => f.id).filter(Boolean));
   };
 
   const selectNone = () => {
@@ -59,8 +59,8 @@ const FilePickerModal = ({
   };
 
   const handleConfirm = async () => {
-    const selectedFiles = storedFiles.filter(f =>
-      selectedFileIds.includes(f.id)
+    const selectedFiles = storedFiles.filter((f) =>
+      selectedFileIds.includes(f.id),
     );
 
     // Convert stored files to File objects
@@ -78,31 +78,38 @@ const FilePickerModal = ({
           }
 
           // If it's from IndexedDB storage, reconstruct the File
-          if (fileItem.arrayBuffer && typeof fileItem.arrayBuffer === 'function') {
+          if (
+            fileItem.arrayBuffer &&
+            typeof fileItem.arrayBuffer === "function"
+          ) {
             const arrayBuffer = await fileItem.arrayBuffer();
-            const blob = new Blob([arrayBuffer], { type: fileItem.type || 'application/pdf' });
+            const blob = new Blob([arrayBuffer], {
+              type: fileItem.type || "application/pdf",
+            });
             return new File([blob], fileItem.name, {
-              type: fileItem.type || 'application/pdf',
-              lastModified: fileItem.lastModified || Date.now()
+              type: fileItem.type || "application/pdf",
+              lastModified: fileItem.lastModified || Date.now(),
             });
           }
 
           // If it has data property, reconstruct the File
           if (fileItem.data) {
-            const blob = new Blob([fileItem.data], { type: fileItem.type || 'application/pdf' });
+            const blob = new Blob([fileItem.data], {
+              type: fileItem.type || "application/pdf",
+            });
             return new File([blob], fileItem.name, {
-              type: fileItem.type || 'application/pdf',
-              lastModified: fileItem.lastModified || Date.now()
+              type: fileItem.type || "application/pdf",
+              lastModified: fileItem.lastModified || Date.now(),
             });
           }
 
-          console.warn('Could not convert file item:', fileItem);
+          console.warn("Could not convert file item:", fileItem);
           return null;
         } catch (error) {
-          console.error('Error converting file:', error, fileItem);
+          console.error("Error converting file:", error, fileItem);
           return null;
         }
-      })
+      }),
     );
 
     // Filter out any null values and return valid Files
@@ -113,11 +120,11 @@ const FilePickerModal = ({
   };
 
   const formatFileSize = (bytes: number) => {
-    if (bytes === 0) return '0 B';
+    if (bytes === 0) return "0 B";
     const k = 1024;
-    const sizes = ['B', 'KB', 'MB', 'GB'];
+    const sizes = ["B", "KB", "MB", "GB"];
     const i = Math.floor(Math.log(bytes) / Math.log(k));
-    return parseFloat((bytes / Math.pow(k, i)).toFixed(1)) + ' ' + sizes[i];
+    return parseFloat((bytes / Math.pow(k, i)).toFixed(1)) + " " + sizes[i];
   };
 
   return (
@@ -139,7 +146,8 @@ const FilePickerModal = ({
             {/* Selection controls */}
             <Group justify="space-between">
               <Text size="sm" c="dimmed">
-                {storedFiles.length} {t("fileUpload.filesAvailable", "files available")}
+                {storedFiles.length}{" "}
+                {t("fileUpload.filesAvailable", "files available")}
                 {selectedFileIds.length > 0 && (
                   <> • {selectedFileIds.length} selected</>
                 )}
@@ -167,14 +175,14 @@ const FilePickerModal = ({
                       p="sm"
                       style={{
                         border: isSelected
-                          ? '2px solid var(--mantine-color-blue-6)'
-                          : '1px solid var(--mantine-color-gray-3)',
+                          ? "2px solid var(--mantine-color-blue-6)"
+                          : "1px solid var(--mantine-color-gray-3)",
                         borderRadius: 8,
                         backgroundColor: isSelected
-                          ? 'var(--mantine-color-blue-0)'
-                          : 'transparent',
-                        cursor: 'pointer',
-                        transition: 'all 0.2s ease'
+                          ? "var(--mantine-color-blue-0)"
+                          : "transparent",
+                        cursor: "pointer",
+                        transition: "all 0.2s ease",
                       }}
                       onClick={() => toggleFileSelection(fileId)}
                     >
@@ -190,13 +198,13 @@ const FilePickerModal = ({
                           style={{
                             width: 60,
                             height: 80,
-                            border: '1px solid var(--mantine-color-gray-3)',
+                            border: "1px solid var(--mantine-color-gray-3)",
                             borderRadius: 4,
-                            display: 'flex',
-                            alignItems: 'center',
-                            justifyContent: 'center',
-                            backgroundColor: 'var(--mantine-color-gray-0)',
-                            flexShrink: 0
+                            display: "flex",
+                            alignItems: "center",
+                            justifyContent: "center",
+                            backgroundColor: "var(--mantine-color-gray-0)",
+                            flexShrink: 0,
                           }}
                         >
                           {file.thumbnail ? (
@@ -208,11 +216,7 @@ const FilePickerModal = ({
                               fit="contain"
                             />
                           ) : (
-                            <ThemeIcon
-                              variant="light"
-                              color="red"
-                              size={40}
-                            >
+                            <ThemeIcon variant="light" color="red" size={40}>
                               <PictureAsPdfIcon style={{ fontSize: 24 }} />
                             </ThemeIcon>
                           )}
@@ -225,7 +229,9 @@ const FilePickerModal = ({
                           </Text>
                           <Group gap="xs">
                             <Badge size="xs" variant="light" color="gray">
-                              {formatFileSize(file.size || (file.file?.size || 0))}
+                              {formatFileSize(
+                                file.size || file.file?.size || 0,
+                              )}
                             </Badge>
                           </Group>
                         </Stack>
@@ -239,7 +245,8 @@ const FilePickerModal = ({
             {/* Selection summary */}
             {selectedFileIds.length > 0 && (
               <Text size="sm" c="blue" ta="center">
-                {selectedFileIds.length} {t("fileManager.filesSelected", "files selected")}
+                {selectedFileIds.length}{" "}
+                {t("fileManager.filesSelected", "files selected")}
               </Text>
             )}
           </>
@@ -256,8 +263,7 @@ const FilePickerModal = ({
           >
             {selectedFileIds.length > 0
               ? `${t("fileUpload.loadFromStorage", "Load")} ${selectedFileIds.length} ${terminology.uploadFiles}`
-              : t("fileUpload.loadFromStorage", "Load Files")
-            }
+              : t("fileUpload.loadFromStorage", "Load Files")}
           </Button>
         </Group>
       </Stack>
diff --git a/frontend/src/core/components/shared/FilePreview.tsx b/frontend/src/core/components/shared/FilePreview.tsx
index 4377c851c0..67bb187fda 100644
--- a/frontend/src/core/components/shared/FilePreview.tsx
+++ b/frontend/src/core/components/shared/FilePreview.tsx
@@ -1,26 +1,26 @@
-import React from 'react';
-import { Box, Center } from '@mantine/core';
-import InsertDriveFileIcon from '@mui/icons-material/InsertDriveFile';
-import { StirlingFileStub } from '@app/types/fileContext';
-import DocumentThumbnail from '@app/components/shared/filePreview/DocumentThumbnail';
-import DocumentStack from '@app/components/shared/filePreview/DocumentStack';
-import HoverOverlay from '@app/components/shared/filePreview/HoverOverlay';
-import NavigationArrows from '@app/components/shared/filePreview/NavigationArrows';
+import React from "react";
+import { Box, Center } from "@mantine/core";
+import InsertDriveFileIcon from "@mui/icons-material/InsertDriveFile";
+import { StirlingFileStub } from "@app/types/fileContext";
+import DocumentThumbnail from "@app/components/shared/filePreview/DocumentThumbnail";
+import DocumentStack from "@app/components/shared/filePreview/DocumentStack";
+import HoverOverlay from "@app/components/shared/filePreview/HoverOverlay";
+import NavigationArrows from "@app/components/shared/filePreview/NavigationArrows";
 
 export interface FilePreviewProps {
   // Core file data
   file: File | StirlingFileStub | null;
   thumbnail?: string | null;
-  
+
   // Optional features
   showStacking?: boolean;
   showHoverOverlay?: boolean;
   showNavigation?: boolean;
-  
+
   // State
   totalFiles?: number;
   isAnimating?: boolean;
-  
+
   // Event handlers
   onFileClick?: (file: File | StirlingFileStub | null) => void;
   onPrevious?: () => void;
@@ -37,32 +37,34 @@ const FilePreview: React.FC<FilePreviewProps> = ({
   isAnimating = false,
   onFileClick,
   onPrevious,
-  onNext
+  onNext,
 }) => {
   if (!file) {
     return (
-      <Box style={{ width: '100%', height: '100%' }}>
-        <Center style={{ width: '100%', height: '100%' }}>
-          <InsertDriveFileIcon 
-            style={{ 
-              fontSize: '4rem', 
-              color: 'var(--mantine-color-gray-4)',
-              opacity: 0.6 
-            }} 
+      <Box style={{ width: "100%", height: "100%" }}>
+        <Center style={{ width: "100%", height: "100%" }}>
+          <InsertDriveFileIcon
+            style={{
+              fontSize: "4rem",
+              color: "var(--mantine-color-gray-4)",
+              opacity: 0.6,
+            }}
           />
         </Center>
       </Box>
     );
   }
-  
+
   const hasMultipleFiles = totalFiles > 1;
-  
+
   // Animation styles
-  const animationStyle = isAnimating ? {
-    transition: 'all 0.3s cubic-bezier(0.4, 0, 0.2, 1)',
-    transform: 'scale(0.95) translateX(1.25rem)',
-    opacity: 0.7
-  } : {};
+  const animationStyle = isAnimating
+    ? {
+        transition: "all 0.3s cubic-bezier(0.4, 0, 0.2, 1)",
+        transform: "scale(0.95) translateX(1.25rem)",
+        opacity: 0.7,
+      }
+    : {};
 
   // Build the component composition
   let content = (
@@ -81,11 +83,7 @@ const FilePreview: React.FC<FilePreviewProps> = ({
 
   // Wrap with document stack if needed
   if (showStacking) {
-    content = (
-      <DocumentStack totalFiles={totalFiles}>
-        {content}
-      </DocumentStack>
-    );
+    content = <DocumentStack totalFiles={totalFiles}>{content}</DocumentStack>;
   }
 
   // Wrap with navigation if needed
@@ -101,11 +99,7 @@ const FilePreview: React.FC<FilePreviewProps> = ({
     );
   }
 
-  return (
-    <Box style={{ width: '100%', height: '100%' }}>
-      {content}
-    </Box>
-  );
+  return <Box style={{ width: "100%", height: "100%" }}>{content}</Box>;
 };
 
-export default FilePreview;
\ No newline at end of file
+export default FilePreview;
diff --git a/frontend/src/core/components/shared/FileUploadButton.tsx b/frontend/src/core/components/shared/FileUploadButton.tsx
index 85c3d58175..000639f09c 100644
--- a/frontend/src/core/components/shared/FileUploadButton.tsx
+++ b/frontend/src/core/components/shared/FileUploadButton.tsx
@@ -19,12 +19,12 @@ const FileUploadButton = ({
   disabled = false,
   placeholder,
   variant = "outline",
-  fullWidth = true
+  fullWidth = true,
 }: FileUploadButtonProps) => {
   const { t } = useTranslation();
   const resetRef = useRef<() => void>(null);
 
-  const defaultPlaceholder = t('chooseFile', 'Choose File');
+  const defaultPlaceholder = t("chooseFile", "Choose File");
 
   return (
     <FileButton
@@ -32,11 +32,10 @@ const FileUploadButton = ({
       onChange={onChange}
       accept={accept}
       disabled={disabled}
-
     >
       {(props) => (
         <Button {...props} variant={variant} fullWidth={fullWidth} color="blue">
-          {file ? file.name : (placeholder || defaultPlaceholder)}
+          {file ? file.name : placeholder || defaultPlaceholder}
         </Button>
       )}
     </FileButton>
diff --git a/frontend/src/core/components/shared/FirstLoginModal.tsx b/frontend/src/core/components/shared/FirstLoginModal.tsx
index 877a8e2d04..00dc4594b5 100644
--- a/frontend/src/core/components/shared/FirstLoginModal.tsx
+++ b/frontend/src/core/components/shared/FirstLoginModal.tsx
@@ -1,10 +1,17 @@
-import { useState } from 'react';
-import { Modal, Stack, Text, PasswordInput, Button, Alert } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import LocalIcon from '@app/components/shared/LocalIcon';
-import { accountService } from '@app/services/accountService';
-import { alert } from '@app/components/toast';
-import { Z_INDEX_OVER_FULLSCREEN_SURFACE } from '@app/styles/zIndex';
+import { useState } from "react";
+import {
+  Modal,
+  Stack,
+  Text,
+  PasswordInput,
+  Button,
+  Alert,
+} from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import LocalIcon from "@app/components/shared/LocalIcon";
+import { accountService } from "@app/services/accountService";
+import { alert } from "@app/components/toast";
+import { Z_INDEX_OVER_FULLSCREEN_SURFACE } from "@app/styles/zIndex";
 
 interface FirstLoginModalProps {
   opened: boolean;
@@ -18,51 +25,74 @@ interface FirstLoginModalProps {
  * Forces first-time users to change their password.
  * Cannot be dismissed until password is successfully changed.
  */
-export default function FirstLoginModal({ opened, onPasswordChanged, username }: FirstLoginModalProps) {
+export default function FirstLoginModal({
+  opened,
+  onPasswordChanged,
+  username,
+}: FirstLoginModalProps) {
   const { t } = useTranslation();
-  const [currentPassword, setCurrentPassword] = useState('');
-  const [newPassword, setNewPassword] = useState('');
-  const [confirmPassword, setConfirmPassword] = useState('');
+  const [currentPassword, setCurrentPassword] = useState("");
+  const [newPassword, setNewPassword] = useState("");
+  const [confirmPassword, setConfirmPassword] = useState("");
   const [loading, setLoading] = useState(false);
-  const [error, setError] = useState('');
+  const [error, setError] = useState("");
 
   const handleSubmit = async () => {
     // Validation
     if (!currentPassword || !newPassword || !confirmPassword) {
-      setError(t('firstLogin.allFieldsRequired', 'All fields are required'));
+      setError(t("firstLogin.allFieldsRequired", "All fields are required"));
       return;
     }
 
     if (newPassword !== confirmPassword) {
-      setError(t('firstLogin.passwordsDoNotMatch', 'New passwords do not match'));
+      setError(
+        t("firstLogin.passwordsDoNotMatch", "New passwords do not match"),
+      );
       return;
     }
 
     if (newPassword.length < 8) {
-      setError(t('firstLogin.passwordTooShort', 'Password must be at least 8 characters'));
+      setError(
+        t(
+          "firstLogin.passwordTooShort",
+          "Password must be at least 8 characters",
+        ),
+      );
       return;
     }
 
     if (newPassword === currentPassword) {
-      setError(t('firstLogin.passwordMustBeDifferent', 'New password must be different from current password'));
+      setError(
+        t(
+          "firstLogin.passwordMustBeDifferent",
+          "New password must be different from current password",
+        ),
+      );
       return;
     }
 
     try {
       setLoading(true);
-      setError('');
+      setError("");
 
-      await accountService.changePasswordOnLogin(currentPassword, newPassword, confirmPassword);
+      await accountService.changePasswordOnLogin(
+        currentPassword,
+        newPassword,
+        confirmPassword,
+      );
 
       alert({
-        alertType: 'success',
-        title: t('firstLogin.passwordChangedSuccess', 'Password changed successfully! Please log in again.')
+        alertType: "success",
+        title: t(
+          "firstLogin.passwordChangedSuccess",
+          "Password changed successfully! Please log in again.",
+        ),
       });
 
       // Clear form
-      setCurrentPassword('');
-      setNewPassword('');
-      setConfirmPassword('');
+      setCurrentPassword("");
+      setNewPassword("");
+      setConfirmPassword("");
 
       // Wait a moment for the user to see the success message
       // Then the backend will have logged them out, and onPasswordChanged will handle redirect
@@ -70,10 +100,13 @@ export default function FirstLoginModal({ opened, onPasswordChanged, username }:
         onPasswordChanged();
       }, 1500);
     } catch (err: any) {
-      console.error('Failed to change password:', err);
+      console.error("Failed to change password:", err);
       setError(
         err.response?.data?.message ||
-        t('firstLogin.passwordChangeFailed', 'Failed to change password. Please check your current password.')
+          t(
+            "firstLogin.passwordChangeFailed",
+            "Failed to change password. Please check your current password.",
+          ),
       );
     } finally {
       setLoading(false);
@@ -84,7 +117,7 @@ export default function FirstLoginModal({ opened, onPasswordChanged, username }:
     <Modal
       opened={opened}
       onClose={() => {}} // Cannot close
-      title={t('firstLogin.title', 'First Time Login')}
+      title={t("firstLogin.title", "First Time Login")}
       closeOnClickOutside={false}
       closeOnEscape={false}
       withCloseButton={false}
@@ -95,25 +128,26 @@ export default function FirstLoginModal({ opened, onPasswordChanged, username }:
       <Stack gap="md">
         <Alert
           icon={<LocalIcon icon="info-rounded" width="1rem" height="1rem" />}
-          title={t('firstLogin.welcomeTitle', 'Welcome!')}
+          title={t("firstLogin.welcomeTitle", "Welcome!")}
           color="blue"
         >
           <Text size="sm">
             {t(
-              'firstLogin.welcomeMessage',
-              'For security reasons, you must change your password on your first login.'
+              "firstLogin.welcomeMessage",
+              "For security reasons, you must change your password on your first login.",
             )}
           </Text>
         </Alert>
 
         <Text size="sm" fw={500}>
-          {t('firstLogin.loggedInAs', 'Logged in as')}: <strong>{username}</strong>
+          {t("firstLogin.loggedInAs", "Logged in as")}:{" "}
+          <strong>{username}</strong>
         </Text>
 
         {error && (
           <Alert
             icon={<LocalIcon icon="error-rounded" width="1rem" height="1rem" />}
-            title={t('firstLogin.error', 'Error')}
+            title={t("firstLogin.error", "Error")}
             color="red"
           >
             {error}
@@ -121,16 +155,22 @@ export default function FirstLoginModal({ opened, onPasswordChanged, username }:
         )}
 
         <PasswordInput
-          label={t('firstLogin.currentPassword', 'Current Password')}
-          placeholder={t('firstLogin.enterCurrentPassword', 'Enter your current password')}
+          label={t("firstLogin.currentPassword", "Current Password")}
+          placeholder={t(
+            "firstLogin.enterCurrentPassword",
+            "Enter your current password",
+          )}
           value={currentPassword}
           onChange={(e) => setCurrentPassword(e.currentTarget.value)}
           required
         />
 
         <PasswordInput
-          label={t('firstLogin.newPassword', 'New Password')}
-          placeholder={t('firstLogin.enterNewPassword', 'Enter new password (min 8 characters)')}
+          label={t("firstLogin.newPassword", "New Password")}
+          placeholder={t(
+            "firstLogin.enterNewPassword",
+            "Enter new password (min 8 characters)",
+          )}
           value={newPassword}
           onChange={(e) => setNewPassword(e.currentTarget.value)}
           minLength={8}
@@ -138,8 +178,11 @@ export default function FirstLoginModal({ opened, onPasswordChanged, username }:
         />
 
         <PasswordInput
-          label={t('firstLogin.confirmPassword', 'Confirm New Password')}
-          placeholder={t('firstLogin.reEnterNewPassword', 'Re-enter new password')}
+          label={t("firstLogin.confirmPassword", "Confirm New Password")}
+          placeholder={t(
+            "firstLogin.reEnterNewPassword",
+            "Re-enter new password",
+          )}
           value={confirmPassword}
           onChange={(e) => setConfirmPassword(e.currentTarget.value)}
           minLength={8}
@@ -150,10 +193,16 @@ export default function FirstLoginModal({ opened, onPasswordChanged, username }:
           fullWidth
           onClick={handleSubmit}
           loading={loading}
-          disabled={!currentPassword || !newPassword || !confirmPassword || newPassword.length < 8 || confirmPassword.length < 8}
+          disabled={
+            !currentPassword ||
+            !newPassword ||
+            !confirmPassword ||
+            newPassword.length < 8 ||
+            confirmPassword.length < 8
+          }
           mt="md"
         >
-          {t('firstLogin.changePassword', 'Change Password')}
+          {t("firstLogin.changePassword", "Change Password")}
         </Button>
       </Stack>
     </Modal>
diff --git a/frontend/src/core/components/shared/FitText.tsx b/frontend/src/core/components/shared/FitText.tsx
index 29abe6e0c2..c3a2ead2f2 100644
--- a/frontend/src/core/components/shared/FitText.tsx
+++ b/frontend/src/core/components/shared/FitText.tsx
@@ -1,5 +1,5 @@
-import React, { CSSProperties, useMemo, useRef } from 'react';
-import { useAdjustFontSizeToFit } from '@app/components/shared/fitText/textFit';
+import React, { CSSProperties, useMemo, useRef } from "react";
+import { useAdjustFontSizeToFit } from "@app/components/shared/fitText/textFit";
 
 type FitTextProps = {
   text: string;
@@ -8,7 +8,7 @@ type FitTextProps = {
   lines?: number; // max lines
   className?: string;
   style?: CSSProperties;
-  as?: 'span' | 'div';
+  as?: "span" | "div";
   /**
    * Insert zero-width soft breaks after these characters to prefer wrapping at them
    * when multi-line is enabled. Defaults to '/'. Ignored when lines === 1.
@@ -23,8 +23,8 @@ const FitText: React.FC<FitTextProps> = ({
   lines = 1,
   className,
   style,
-  as = 'span',
-  softBreakChars = ['-','_','/'],
+  as = "span",
+  softBreakChars = ["-", "_", "/"],
 }) => {
   const ref = useRef<HTMLElement | null>(null);
 
@@ -44,35 +44,39 @@ const FitText: React.FC<FitTextProps> = ({
   const displayText = useMemo(() => {
     if (!text) return text;
     if (!lines || lines <= 1) return text;
-    const chars = Array.isArray(softBreakChars) ? softBreakChars : [softBreakChars];
-    const esc = (s: string) => s.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
-    const re = new RegExp(`(${chars.filter(Boolean).map(esc).join('|')})`, 'g');
+    const chars = Array.isArray(softBreakChars)
+      ? softBreakChars
+      : [softBreakChars];
+    const esc = (s: string) => s.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
+    const re = new RegExp(`(${chars.filter(Boolean).map(esc).join("|")})`, "g");
     return text.replace(re, `$1\u200B`);
   }, [text, lines, softBreakChars]);
 
   const clampStyles: CSSProperties = {
     // Multi-line clamp with ellipsis fallback
-    whiteSpace: lines === 1 ? 'nowrap' : 'normal',
-    overflow: 'hidden',
-    textOverflow: 'ellipsis',
-    display: lines > 1 ? '-webkit-box' : undefined,
-    WebkitBoxOrient: lines > 1 ? 'vertical' : undefined,
+    whiteSpace: lines === 1 ? "nowrap" : "normal",
+    overflow: "hidden",
+    textOverflow: "ellipsis",
+    display: lines > 1 ? "-webkit-box" : undefined,
+    WebkitBoxOrient: lines > 1 ? "vertical" : undefined,
     WebkitLineClamp: lines > 1 ? lines : undefined,
     // Favor breaking words when necessary to prevent overflow
-    wordBreak: lines > 1 ? 'break-word' : 'normal',
-    overflowWrap: lines > 1 ? 'break-word' : 'normal',
-    hyphens: lines > 1 ? 'auto' : 'manual',
+    wordBreak: lines > 1 ? "break-word" : "normal",
+    overflowWrap: lines > 1 ? "break-word" : "normal",
+    hyphens: lines > 1 ? "auto" : "manual",
     // fontSize expects rem values (e.g., 1.2, 0.9) to scale with global font size
     fontSize: fontSize ? `${fontSize}rem` : undefined,
   };
 
   return (
-    <ElementTag ref={ref} className={className} style={{ ...clampStyles, ...style }}>
+    <ElementTag
+      ref={ref}
+      className={className}
+      style={{ ...clampStyles, ...style }}
+    >
       {displayText}
     </ElementTag>
   );
 };
 
 export default FitText;
-
-
diff --git a/frontend/src/core/components/shared/Footer.tsx b/frontend/src/core/components/shared/Footer.tsx
index e7501b259a..650917ed1a 100644
--- a/frontend/src/core/components/shared/Footer.tsx
+++ b/frontend/src/core/components/shared/Footer.tsx
@@ -1,7 +1,7 @@
-import { Flex } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { useCookieConsent } from '@app/hooks/useCookieConsent';
-import { useFooterInfo } from '@app/hooks/useFooterInfo';
+import { Flex } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import { useCookieConsent } from "@app/hooks/useCookieConsent";
+import { useFooterInfo } from "@app/hooks/useFooterInfo";
 
 interface FooterProps {
   privacyPolicy?: string;
@@ -20,130 +20,145 @@ export default function Footer({
   cookiePolicy,
   impressum,
   analyticsEnabled,
-  forceLightMode = false
+  forceLightMode = false,
 }: FooterProps) {
   const { t } = useTranslation();
   const { footerInfo } = useFooterInfo();
 
   // Use props if provided, otherwise fall back to fetched footer info
-  const finalAnalyticsEnabled = analyticsEnabled ?? footerInfo?.analyticsEnabled ?? false;
+  const finalAnalyticsEnabled =
+    analyticsEnabled ?? footerInfo?.analyticsEnabled ?? false;
   const finalPrivacyPolicy = privacyPolicy ?? footerInfo?.privacyPolicy;
-  const finalTermsAndConditions = termsAndConditions ?? footerInfo?.termsAndConditions;
-  const finalAccessibilityStatement = accessibilityStatement ?? footerInfo?.accessibilityStatement;
+  const finalTermsAndConditions =
+    termsAndConditions ?? footerInfo?.termsAndConditions;
+  const finalAccessibilityStatement =
+    accessibilityStatement ?? footerInfo?.accessibilityStatement;
   const finalCookiePolicy = cookiePolicy ?? footerInfo?.cookiePolicy;
   const finalImpressum = impressum ?? footerInfo?.impressum;
 
-  const { showCookiePreferences } = useCookieConsent({ analyticsEnabled: finalAnalyticsEnabled, forceLightMode });
+  const { showCookiePreferences } = useCookieConsent({
+    analyticsEnabled: finalAnalyticsEnabled,
+    forceLightMode,
+  });
 
   // Default URLs
-  const defaultTermsUrl = "https://www.stirling.com/legal/terms-of-service";
-  const defaultPrivacyUrl = "https://www.stirling.com/legal/privacy-policy";
+  const defaultTermsUrl = "https://www.stirling.com/terms";
+  const defaultPrivacyUrl = "https://www.stirling.com/privacy";
   const defaultAccessibilityUrl = "https://www.stirling.com/accessibility";
 
   // Use provided URLs or fall back to defaults
   const finalTermsUrl = finalTermsAndConditions || defaultTermsUrl;
   const finalPrivacyUrl = finalPrivacyPolicy || defaultPrivacyUrl;
-  const finalAccessibilityUrl = finalAccessibilityStatement || defaultAccessibilityUrl;
+  const finalAccessibilityUrl =
+    finalAccessibilityStatement || defaultAccessibilityUrl;
 
   // Helper to check if a value is valid (not null/undefined/empty string)
   const isValidLink = (link?: string) => link && link.trim().length > 0;
 
   return (
-    <div style={{
-      height: 'var(--footer-height)',
-      backgroundColor: forceLightMode ? '#f1f3f5' : 'var(--mantine-color-gray-1)',
-      borderTop: forceLightMode ? '1px solid #e9ecef' : '1px solid var(--mantine-color-gray-2)',
-      display: 'flex',
-      flexDirection: 'column',
-      justifyContent: 'center',
-    }}>
-        <Flex gap="md"
-          justify="center"
-          align="center"
-          direction="row"
-          style={{
-            fontSize: '0.75rem',
-            color: forceLightMode ? '#495057' : undefined
-          }}>
-          <a
-            className="footer-link px-3"
-            id="survey"
-            target="_blank"
-            rel="noopener noreferrer"
-            href="https://stirlingpdf.info/s/cm28y3niq000o56dv7liv8wsu"
-          >
-            {t('survey.nav', 'Survey')}
-          </a>
+    <div
+      style={{
+        height: "var(--footer-height)",
+        backgroundColor: forceLightMode
+          ? "#f1f3f5"
+          : "var(--mantine-color-gray-1)",
+        borderTop: forceLightMode
+          ? "1px solid #e9ecef"
+          : "1px solid var(--mantine-color-gray-2)",
+        display: "flex",
+        flexDirection: "column",
+        justifyContent: "center",
+      }}
+    >
+      <Flex
+        gap="md"
+        justify="center"
+        align="center"
+        direction="row"
+        style={{
+          fontSize: "0.75rem",
+          color: forceLightMode ? "#495057" : undefined,
+        }}
+      >
+        <a
+          className="footer-link px-3"
+          id="survey"
+          target="_blank"
+          rel="noopener noreferrer"
+          href="https://stirlingpdf.info/s/cm28y3niq000o56dv7liv8wsu"
+        >
+          {t("survey.nav", "Survey")}
+        </a>
+        <a
+          className="footer-link px-3"
+          target="_blank"
+          rel="noopener noreferrer"
+          href={finalPrivacyUrl}
+        >
+          {t("legal.privacy", "Privacy Policy")}
+        </a>
+        <a
+          className="footer-link px-3"
+          target="_blank"
+          rel="noopener noreferrer"
+          href={finalTermsUrl}
+        >
+          {t("legal.terms", "Terms and Conditions")}
+        </a>
+        <a
+          className="footer-link px-3"
+          target="_blank"
+          rel="noopener noreferrer"
+          href="https://discord.gg/Cn8pWhQRxZ"
+        >
+          {t("footer.discord", "Discord")}
+        </a>
+        <a
+          className="footer-link px-3"
+          target="_blank"
+          rel="noopener noreferrer"
+          href="https://github.com/Stirling-Tools/Stirling-PDF"
+        >
+          {t("footer.issues", "GitHub")}
+        </a>
+        <a
+          className="footer-link px-3"
+          target="_blank"
+          rel="noopener noreferrer"
+          href={finalAccessibilityUrl}
+        >
+          {t("legal.accessibility", "Accessibility")}
+        </a>
+        {isValidLink(finalCookiePolicy) && (
           <a
             className="footer-link px-3"
             target="_blank"
             rel="noopener noreferrer"
-            href={finalPrivacyUrl}
+            href={finalCookiePolicy}
           >
-            {t('legal.privacy', 'Privacy Policy')}
+            {t("legal.cookie", "Cookie Policy")}
           </a>
+        )}
+        {isValidLink(finalImpressum) && (
           <a
             className="footer-link px-3"
             target="_blank"
             rel="noopener noreferrer"
-            href={finalTermsUrl}
+            href={finalImpressum}
           >
-            {t('legal.terms', 'Terms and Conditions')}
+            {t("legal.impressum", "Impressum")}
           </a>
-          <a
+        )}
+        {finalAnalyticsEnabled && (
+          <button
             className="footer-link px-3"
-            target="_blank"
-            rel="noopener noreferrer"
-            href="https://discord.gg/Cn8pWhQRxZ"
+            id="cookieBanner"
+            onClick={showCookiePreferences}
           >
-            {t('footer.discord', 'Discord')}
-          </a>
-          <a
-            className="footer-link px-3"
-            target="_blank"
-            rel="noopener noreferrer"
-            href="https://github.com/Stirling-Tools/Stirling-PDF"
-          >
-            {t('footer.issues', 'GitHub')}
-          </a>
-          <a
-            className="footer-link px-3"
-            target="_blank"
-            rel="noopener noreferrer"
-            href={finalAccessibilityUrl}
-          >
-            {t('legal.accessibility', 'Accessibility')}
-          </a>
-          {isValidLink(finalCookiePolicy) && (
-            <a
-              className="footer-link px-3"
-              target="_blank"
-              rel="noopener noreferrer"
-              href={finalCookiePolicy}
-            >
-              {t('legal.cookie', 'Cookie Policy')}
-            </a>
-          )}
-          {isValidLink(finalImpressum) && (
-            <a
-              className="footer-link px-3"
-              target="_blank"
-              rel="noopener noreferrer"
-              href={finalImpressum}
-            >
-              {t('legal.impressum', 'Impressum')}
-            </a>
-          )}
-          {finalAnalyticsEnabled && (
-            <button
-              className="footer-link px-3"
-              id="cookieBanner"
-              onClick={showCookiePreferences}
-            >
-              {t('legal.showCookieBanner', 'Cookie Preferences')}
-            </button>
-          )}
-        </Flex>
+            {t("legal.showCookieBanner", "Cookie Preferences")}
+          </button>
+        )}
+      </Flex>
     </div>
   );
 }
diff --git a/frontend/src/core/components/shared/HoverActionMenu.tsx b/frontend/src/core/components/shared/HoverActionMenu.tsx
index eb2304c770..c43225854d 100644
--- a/frontend/src/core/components/shared/HoverActionMenu.tsx
+++ b/frontend/src/core/components/shared/HoverActionMenu.tsx
@@ -1,7 +1,7 @@
-import React from 'react';
-import { ActionIcon, Tooltip } from '@mantine/core';
-import styles from '@app/components/shared/HoverActionMenu.module.css';
-import { Z_INDEX_HOVER_ACTION_MENU } from '@app/styles/zIndex';
+import React from "react";
+import { ActionIcon, Tooltip } from "@mantine/core";
+import styles from "@app/components/shared/HoverActionMenu.module.css";
+import { Z_INDEX_HOVER_ACTION_MENU } from "@app/styles/zIndex";
 
 export interface HoverAction {
   id: string;
@@ -16,17 +16,17 @@ export interface HoverAction {
 interface HoverActionMenuProps {
   show: boolean;
   actions: HoverAction[];
-  position?: 'inside' | 'outside';
+  position?: "inside" | "outside";
   className?: string;
 }
 
 const HoverActionMenu: React.FC<HoverActionMenuProps> = ({
   show,
   actions,
-  position = 'inside',
-  className = ''
+  position = "inside",
+  className = "",
 }) => {
-  const visibleActions = actions.filter(action => !action.hidden);
+  const visibleActions = actions.filter((action) => !action.hidden);
 
   if (visibleActions.length === 0) {
     return null;
@@ -34,7 +34,7 @@ const HoverActionMenu: React.FC<HoverActionMenuProps> = ({
 
   return (
     <div
-      className={`${styles.hoverMenu} ${position === 'outside' ? styles.outside : styles.inside} ${className}`}
+      className={`${styles.hoverMenu} ${position === "outside" ? styles.outside : styles.inside} ${className}`}
       style={{ opacity: show ? 1 : 0, zIndex: Z_INDEX_HOVER_ACTION_MENU }}
       onMouseDown={(e) => e.stopPropagation()}
       onMouseUp={(e) => e.stopPropagation()}
@@ -48,7 +48,7 @@ const HoverActionMenu: React.FC<HoverActionMenuProps> = ({
             disabled={action.disabled}
             onClick={action.onClick}
             c={action.color}
-            style={{ color: action.color || 'var(--right-rail-icon)' }}
+            style={{ color: action.color || "var(--right-rail-icon)" }}
           >
             {action.icon}
           </ActionIcon>
diff --git a/frontend/src/core/components/shared/InfoBanner.tsx b/frontend/src/core/components/shared/InfoBanner.tsx
index f64cf6dd2e..a9fde9ae42 100644
--- a/frontend/src/core/components/shared/InfoBanner.tsx
+++ b/frontend/src/core/components/shared/InfoBanner.tsx
@@ -1,8 +1,8 @@
-import React, { ReactNode } from 'react';
-import { Paper, Group, Text, Button, ActionIcon, Stack } from '@mantine/core';
-import LocalIcon from '@app/components/shared/LocalIcon';
+import React, { ReactNode } from "react";
+import { Paper, Group, Text, Button, ActionIcon, Stack } from "@mantine/core";
+import LocalIcon from "@app/components/shared/LocalIcon";
 
-type InfoBannerTone = 'info' | 'warning';
+type InfoBannerTone = "info" | "warning";
 
 const toneStyles: Record<
   InfoBannerTone,
@@ -15,18 +15,18 @@ const toneStyles: Record<
   }
 > = {
   info: {
-    background: 'var(--mantine-color-blue-0)',
-    border: 'var(--mantine-color-blue-2)',
-    text: 'var(--mantine-color-blue-9)',
-    icon: 'var(--mantine-color-blue-6)',
-    buttonColor: 'blue',
+    background: "var(--mantine-color-blue-0)",
+    border: "var(--mantine-color-blue-2)",
+    text: "var(--mantine-color-blue-9)",
+    icon: "var(--mantine-color-blue-6)",
+    buttonColor: "blue",
   },
   warning: {
-    background: 'var(--mantine-color-orange-0)',
-    border: 'var(--mantine-color-orange-3)',
-    text: 'var(--mantine-color-orange-9)',
-    icon: 'var(--mantine-color-orange-7)',
-    buttonColor: 'orange',
+    background: "var(--mantine-color-orange-0)",
+    border: "var(--mantine-color-orange-3)",
+    text: "var(--mantine-color-orange-9)",
+    icon: "var(--mantine-color-orange-7)",
+    buttonColor: "orange",
   },
 };
 
@@ -47,7 +47,7 @@ interface InfoBannerProps {
   textColor?: string;
   iconColor?: string;
   buttonColor?: string;
-  buttonVariant?: 'light' | 'filled' | 'white' | 'outline' | 'subtle';
+  buttonVariant?: "light" | "filled" | "white" | "outline" | "subtle";
   minHeight?: number | string;
   closeIconColor?: string;
 }
@@ -60,19 +60,19 @@ export const InfoBanner: React.FC<InfoBannerProps> = ({
   title,
   message,
   buttonText,
-  buttonIcon = 'check-circle-rounded',
+  buttonIcon = "check-circle-rounded",
   onButtonClick,
   onDismiss,
   dismissible = true,
   loading = false,
   show = true,
-  tone = 'info',
+  tone = "info",
   background,
   borderColor,
   textColor,
   iconColor,
   buttonColor,
-  buttonVariant = 'light',
+  buttonVariant = "light",
   minHeight = 56,
   closeIconColor,
 }) => {
@@ -93,12 +93,23 @@ export const InfoBanner: React.FC<InfoBannerProps> = ({
         background: background ?? toneStyle.background,
         borderBottom: `1px solid ${borderColor ?? toneStyle.border}`,
         minHeight,
-        display: 'flex',
-        alignItems: 'center',
+        display: "flex",
+        alignItems: "center",
       }}
     >
-      <Group gap="sm" align="center" wrap="nowrap" justify="space-between" style={{ width: '100%' }}>
-        <Group gap="sm" align="center" wrap="nowrap" style={{ flex: 1, minWidth: 0 }}>
+      <Group
+        gap="sm"
+        align="center"
+        wrap="nowrap"
+        justify="space-between"
+        style={{ width: "100%" }}
+      >
+        <Group
+          gap="sm"
+          align="center"
+          wrap="nowrap"
+          style={{ flex: 1, minWidth: 0 }}
+        >
           <LocalIcon
             icon={icon}
             width="1.2rem"
@@ -107,7 +118,11 @@ export const InfoBanner: React.FC<InfoBannerProps> = ({
           />
           <Stack gap={2} style={{ flex: 1, minWidth: 0 }}>
             {title && (
-              <Text fw={600} size="sm" style={{ color: textColor ?? toneStyle.text }}>
+              <Text
+                fw={600}
+                size="sm"
+                style={{ color: textColor ?? toneStyle.text }}
+              >
                 {title}
               </Text>
             )}
@@ -129,7 +144,9 @@ export const InfoBanner: React.FC<InfoBannerProps> = ({
               size="xs"
               onClick={onButtonClick}
               loading={loading}
-              leftSection={<LocalIcon icon={buttonIcon} width="0.9rem" height="0.9rem" />}
+              leftSection={
+                <LocalIcon icon={buttonIcon} width="0.9rem" height="0.9rem" />
+              }
             >
               {buttonText}
             </Button>
@@ -137,7 +154,7 @@ export const InfoBanner: React.FC<InfoBannerProps> = ({
           {dismissible && (
             <ActionIcon
               variant="subtle"
-              color={closeIconColor ? undefined : 'gray'}
+              color={closeIconColor ? undefined : "gray"}
               size="sm"
               onClick={handleDismiss}
               aria-label="Dismiss"
diff --git a/frontend/src/core/components/shared/LandingActions.tsx b/frontend/src/core/components/shared/LandingActions.tsx
new file mode 100644
index 0000000000..23faf275ce
--- /dev/null
+++ b/frontend/src/core/components/shared/LandingActions.tsx
@@ -0,0 +1,100 @@
+import React from "react";
+import { Button, Group, Tooltip, ActionIcon } from "@mantine/core";
+import LocalIcon from "@app/components/shared/LocalIcon";
+import { useFilesModalContext } from "@app/contexts/FilesModalContext";
+import { useFileActionTerminology } from "@app/hooks/useFileActionTerminology";
+import { useFileActionIcons } from "@app/hooks/useFileActionIcons";
+import { useAppConfig } from "@app/contexts/AppConfigContext";
+import { useIsMobile } from "@app/hooks/useIsMobile";
+
+type LandingActionsProps = {
+  fileInputRef: React.RefObject<HTMLInputElement | null>;
+  onUploadClick: () => void;
+  onMobileUploadClick: () => void;
+  onFileSelect: (event: React.ChangeEvent<HTMLInputElement>) => void;
+};
+
+export function LandingActions({
+  fileInputRef,
+  onUploadClick,
+  onMobileUploadClick,
+  onFileSelect,
+}: LandingActionsProps) {
+  const terminology = useFileActionTerminology();
+  const { openFilesModal } = useFilesModalContext();
+  const icons = useFileActionIcons();
+  const { config } = useAppConfig();
+  const isMobile = useIsMobile();
+
+  return (
+    <>
+      <Group gap="sm" justify="center" wrap="wrap" mb="xs">
+        <Button
+          classNames={{ root: "landing-btn-primary" }}
+          leftSection={
+            <LocalIcon
+              icon={icons.uploadIconName}
+              width="1rem"
+              height="1rem"
+              style={{ color: "white" }}
+            />
+          }
+          onClick={(e) => {
+            e.stopPropagation();
+            onUploadClick();
+          }}
+        >
+          {terminology.uploadFromComputer}
+        </Button>
+
+        <Button
+          variant="default"
+          classNames={{ root: "landing-btn-secondary" }}
+          leftSection={
+            <LocalIcon
+              icon="add"
+              width="1rem"
+              height="1rem"
+              className="text-[var(--accent-interactive)]"
+            />
+          }
+          onClick={(e) => {
+            e.stopPropagation();
+            openFilesModal();
+          }}
+        >
+          {terminology.addFiles}
+        </Button>
+
+        {config?.enableMobileScanner && !isMobile && (
+          <Tooltip label={terminology.mobileUpload} position="bottom">
+            <ActionIcon
+              size="lg"
+              variant="default"
+              radius="md"
+              aria-label={terminology.mobileUpload}
+              classNames={{ root: "landing-btn-secondary landing-btn-icon" }}
+              onClick={(e) => {
+                e.stopPropagation();
+                onMobileUploadClick();
+              }}
+            >
+              <LocalIcon
+                icon="qr-code-rounded"
+                width="1.25rem"
+                height="1.25rem"
+              />
+            </ActionIcon>
+          </Tooltip>
+        )}
+      </Group>
+      <input
+        ref={fileInputRef}
+        type="file"
+        multiple
+        onChange={onFileSelect}
+        style={{ display: "none" }}
+      />
+    </>
+  );
+}
diff --git a/frontend/src/core/components/shared/LandingDocumentStack.tsx b/frontend/src/core/components/shared/LandingDocumentStack.tsx
new file mode 100644
index 0000000000..32ec182df9
--- /dev/null
+++ b/frontend/src/core/components/shared/LandingDocumentStack.tsx
@@ -0,0 +1,65 @@
+/** Decorative stack only: window dots + grey bars — no text or i18n (avoids keys showing in the UI). */
+export function LandingDocumentStack() {
+  const bar = (widthPct: number, heightPx: number, marginBottom: number) => ({
+    width: `${widthPct}%`,
+    height: heightPx,
+    marginBottom: marginBottom || undefined,
+  });
+
+  return (
+    <div aria-hidden className="landing-stack">
+      <div className="landing-sheet landing-sheet--back landing-sheet--left">
+        <div className="landing-sheet-side-body">
+          <div
+            className="landing-bar landing-bar--strong"
+            style={bar(100, 10, 12)}
+          />
+          <div className="landing-bar" style={bar(80, 8, 8)} />
+          <div className="landing-bar" style={bar(100, 8, 8)} />
+          <div className="landing-bar" style={bar(60, 8, 0)} />
+        </div>
+      </div>
+
+      <div className="landing-sheet landing-sheet--front">
+        <div className="landing-sheet-header">
+          <div
+            className="landing-sheet-dot"
+            style={{ backgroundColor: "rgba(255,255,255,0.35)" }}
+          />
+          <div
+            className="landing-sheet-dot"
+            style={{ backgroundColor: "rgba(255,255,255,0.25)" }}
+          />
+          <div
+            className="landing-sheet-dot"
+            style={{ backgroundColor: "rgba(255,255,255,0.15)" }}
+          />
+        </div>
+        <div className="landing-sheet-body">
+          <div
+            className="landing-bar landing-bar--strong"
+            style={bar(100, 10, 10)}
+          />
+          <div className="landing-bar" style={bar(80, 7, 6)} />
+          <div className="landing-bar" style={bar(100, 7, 6)} />
+          <div className="landing-bar" style={bar(66, 7, 6)} />
+          <div className="landing-bar" style={bar(100, 7, 6)} />
+          <div className="landing-bar" style={bar(88, 7, 6)} />
+          <div className="landing-bar" style={bar(72, 7, 0)} />
+        </div>
+      </div>
+
+      <div className="landing-sheet landing-sheet--back landing-sheet--right">
+        <div className="landing-sheet-side-body">
+          <div
+            className="landing-bar landing-bar--strong"
+            style={bar(100, 10, 12)}
+          />
+          <div className="landing-bar" style={bar(75, 8, 8)} />
+          <div className="landing-bar" style={bar(100, 8, 8)} />
+          <div className="landing-bar" style={bar(80, 8, 0)} />
+        </div>
+      </div>
+    </div>
+  );
+}
diff --git a/frontend/src/core/components/shared/LandingPage.css b/frontend/src/core/components/shared/LandingPage.css
new file mode 100644
index 0000000000..e818217600
--- /dev/null
+++ b/frontend/src/core/components/shared/LandingPage.css
@@ -0,0 +1,152 @@
+/* ============================================================
+   Landing Page styles.
+   All custom properties are defined in theme.css.
+   ============================================================ */
+
+/* ── Hero text ───────────────────────────────────────────── */
+.landing-title {
+  margin: 0;
+  margin-top: 1.75rem;
+  margin-bottom: 0.5rem;
+  text-align: center;
+  font-size: 2.125rem;
+  font-weight: 700;
+  letter-spacing: -0.02em;
+  color: var(--text-primary);
+}
+
+.landing-subtitle {
+  margin: 0;
+  margin-bottom: 1.5rem;
+  text-align: center;
+  font-size: 0.9375rem;
+  line-height: 1.5;
+  max-width: 28rem;
+  color: var(--text-secondary);
+}
+
+/* ── Document stack ──────────────────────────────────────── */
+.landing-stack {
+  position: relative;
+  z-index: 1;
+  width: var(--landing-stack-w);
+  min-width: var(--landing-stack-w);
+  height: var(--landing-stack-h);
+  min-height: var(--landing-stack-h);
+  margin-left: auto;
+  margin-right: auto;
+  flex-shrink: 0;
+  overflow: visible;
+}
+
+/* Sheets — static white, never change with theme */
+.landing-sheet {
+  position: absolute;
+  border-radius: 12px;
+  background-color: #ffffff;
+  cursor: default;
+}
+
+.landing-sheet--back {
+  width: 128px;
+  height: 160px;
+  transform-origin: bottom center;
+  border: 1px solid #e5e7eb;
+  box-shadow: var(--landing-doc-shadow-back-idle);
+}
+
+.landing-sheet--left {
+  left: 8px;
+  top: 12px;
+  transform: rotate(-8deg);
+}
+
+.landing-sheet--right {
+  right: 8px;
+  top: 12px;
+  transform: rotate(8deg);
+}
+
+.landing-sheet--front {
+  left: 50%;
+  top: 0;
+  z-index: 10;
+  width: 144px;
+  height: 176px;
+  margin-left: -72px;
+  overflow: hidden;
+  box-shadow: var(--landing-doc-shadow-front-idle);
+}
+
+.landing-sheet-header {
+  display: flex;
+  height: 40px;
+  align-items: center;
+  gap: 8px;
+  padding: 0 12px;
+  border-radius: 12px 12px 0 0;
+  background: var(--landing-hero-gradient);
+}
+
+.landing-sheet-dot {
+  width: 10px;
+  height: 10px;
+  border-radius: 9999px;
+}
+
+.landing-sheet-body {
+  padding: 10px 12px;
+}
+
+.landing-sheet-side-body {
+  padding: 12px;
+}
+
+/* Bars — static light colours, never change with theme */
+.landing-bar {
+  border-radius: 9999px;
+  background-color: #e5e7eb;
+}
+.landing-bar--strong {
+  background-color: #d1d5db;
+}
+
+/* ── Action buttons ──────────────────────────────────────── */
+.landing-btn-primary {
+  background: var(--landing-hero-gradient) !important;
+  color: #ffffff !important;
+  border: none !important;
+  border-radius: 0.75rem !important;
+  font-weight: 600 !important;
+}
+
+.landing-btn-secondary {
+  border-radius: 0.75rem !important;
+  font-weight: 600 !important;
+  border-color: var(--landing-button-border, var(--border-default)) !important;
+  background-color: var(--landing-button-bg, var(--bg-surface)) !important;
+  color: var(--landing-button-color, var(--text-primary)) !important;
+}
+.landing-btn-secondary:hover {
+  background-color: var(
+    --landing-button-hover-bg,
+    var(--landing-button-bg, var(--bg-surface))
+  ) !important;
+}
+
+/* Icon-only variant: accent colour instead of button text colour */
+.landing-btn-icon {
+  color: var(--accent-interactive) !important;
+}
+
+/* Dropzone accept/reject outlines. Mantine 8 no longer supports nested
+ * `&[data-accept]` selectors inside the `styles` prop object, so these are
+ * plain CSS attribute selectors on a class applied to the Dropzone root. */
+.landing-dropzone[data-accept] {
+  outline: 2px dashed var(--accent-interactive);
+  outline-offset: 4px;
+}
+.landing-dropzone[data-reject] {
+  outline: 2px dashed var(--mantine-color-red-6);
+  outline-offset: 4px;
+}
diff --git a/frontend/src/core/components/shared/LandingPage.tsx b/frontend/src/core/components/shared/LandingPage.tsx
index a2ad72e2a4..e52eb98b56 100644
--- a/frontend/src/core/components/shared/LandingPage.tsx
+++ b/frontend/src/core/components/shared/LandingPage.tsx
@@ -1,68 +1,44 @@
-import React, { useEffect } from 'react';
-import { Container, Button, Group, useMantineColorScheme, ActionIcon, Tooltip } from '@mantine/core';
-import { Dropzone } from '@mantine/dropzone';
-import LocalIcon from '@app/components/shared/LocalIcon';
-import { useTranslation } from 'react-i18next';
-import { useFileHandler } from '@app/hooks/useFileHandler';
-import { useFilesModalContext } from '@app/contexts/FilesModalContext';
-import { useLogoPath } from '@app/hooks/useLogoPath';
-import { useLogoAssets } from '@app/hooks/useLogoAssets';
-import { useLogoVariant } from '@app/hooks/useLogoVariant';
-import { useFileManager } from '@app/hooks/useFileManager';
-import { useFileActionTerminology } from '@app/hooks/useFileActionTerminology';
-import { useFileActionIcons } from '@app/hooks/useFileActionIcons';
-import { useAppConfig } from '@app/contexts/AppConfigContext';
-import { useIsMobile } from '@app/hooks/useIsMobile';
-import MobileUploadModal from '@app/components/shared/MobileUploadModal';
-import { openFilesFromDisk } from '@app/services/openFilesFromDisk';
+import React, { useState } from "react";
+import { Container } from "@mantine/core";
+import { Dropzone } from "@mantine/dropzone";
+import { useTranslation } from "react-i18next";
+import { useFileHandler } from "@app/hooks/useFileHandler";
+import { useFileActionTerminology } from "@app/hooks/useFileActionTerminology";
+import MobileUploadModal from "@app/components/shared/MobileUploadModal";
+import { openFilesFromDisk } from "@app/services/openFilesFromDisk";
+import { LandingDocumentStack } from "@app/components/shared/LandingDocumentStack";
+import { LandingActions } from "@app/components/shared/LandingActions";
+import "@app/components/shared/LandingPage.css";
 
 const LandingPage = () => {
-  const { addFiles } = useFileHandler();
-  const fileInputRef = React.useRef<HTMLInputElement>(null);
-  const { colorScheme } = useMantineColorScheme();
   const { t } = useTranslation();
-  const { openFilesModal } = useFilesModalContext();
-  const [isUploadHover, setIsUploadHover] = React.useState(false);
-  const logoPath = useLogoPath();
-  const logoVariant = useLogoVariant();
-  const { wordmark } = useLogoAssets();
-  const { loadRecentFiles } = useFileManager();
-  const [hasRecents, setHasRecents] = React.useState<boolean>(false);
-  const [mobileUploadModalOpen, setMobileUploadModalOpen] = React.useState(false);
+  const { addFiles } = useFileHandler();
+  const fileInputRef = React.useRef<HTMLInputElement | null>(null);
   const terminology = useFileActionTerminology();
-  const icons = useFileActionIcons();
-  const { config } = useAppConfig();
-  const isMobile = useIsMobile();
+  const [mobileUploadModalOpen, setMobileUploadModalOpen] = useState(false);
 
   const handleFileDrop = async (files: File[]) => {
     await addFiles(files);
   };
 
-  const handleOpenFilesModal = () => {
-    openFilesModal();
-  };
-
   const handleNativeUploadClick = async () => {
     const files = await openFilesFromDisk({
       multiple: true,
-      onFallbackOpen: () => fileInputRef.current?.click()
+      onFallbackOpen: () => fileInputRef.current?.click(),
     });
     if (files.length > 0) {
       await addFiles(files);
     }
   };
 
-  const handleFileSelect = async (event: React.ChangeEvent<HTMLInputElement>) => {
+  const handleFileSelect = async (
+    event: React.ChangeEvent<HTMLInputElement>,
+  ) => {
     const files = Array.from(event.target.files || []);
     if (files.length > 0) {
       await addFiles(files);
     }
-    // Reset the input so the same file can be selected again
-    event.target.value = '';
-  };
-
-  const handleMobileUploadClick = () => {
-    setMobileUploadModalOpen(true);
+    event.target.value = "";
   };
 
   const handleFilesReceivedFromMobile = async (files: File[]) => {
@@ -71,249 +47,56 @@ const LandingPage = () => {
     }
   };
 
-  // Determine if the user has any recent files (same source as File Manager)
-  useEffect(() => {
-    let isMounted = true;
-    (async () => {
-      try {
-        const files = await loadRecentFiles();
-        if (isMounted) {
-          setHasRecents((files?.length || 0) > 0);
-        }
-      } catch (_err) {
-        if (isMounted) setHasRecents(false);
-      }
-    })();
-    return () => { isMounted = false; };
-  }, [loadRecentFiles]);
-
   return (
-    <Container size="70rem" p={0} h="100%" className="flex items-center justify-center" style={{ position: 'relative' }}>
-      {/* White PDF Page Background */}
+    <Container
+      size="70rem"
+      p={0}
+      h="100%"
+      className="flex min-h-0 flex-col"
+      style={{ position: "relative" }}
+    >
       <Dropzone
         onDrop={handleFileDrop}
-        multiple={true}
-        className="w-4/5 flex items-center justify-center h-[95%]"
-        style={{
-          position: 'absolute',
-          left: '50%',
-          transform: 'translateX(-50%)',
-          bottom: 0,
-          borderRadius: '0.25rem 0.25rem 0 0',
-          filter: 'var(--drop-shadow-filter)',
-          backgroundColor: 'var(--landing-paper-bg)',
-          transition: 'background-color 0.4s ease',
-        }}
+        multiple
         activateOnClick={false}
+        enablePointerEvents
+        aria-label={terminology.dropFilesHere}
+        className="landing-dropzone flex min-h-0 flex-1 cursor-default flex-col items-center justify-center border-none bg-transparent px-4 py-8 shadow-none outline-none"
         styles={{
           root: {
-            '&[dataAccept]': {
-              backgroundColor: 'var(--landing-drop-paper-bg)',
-            },
+            border: "none !important",
+            backgroundColor: "transparent",
+            overflow: "visible",
+          },
+          inner: {
+            overflow: "visible",
+            display: "flex",
+            flexDirection: "column",
+            alignItems: "center",
+            width: "100%",
           },
         }}
       >
-        {logoVariant === 'modern' && (
-          <div
-            style={{
-              position: 'absolute',
-              top: 0,
-              right: 0,
-              zIndex: 10,
-            }}
-          >
-            <img
-              src={logoPath}
-              alt="Stirling PDF Logo"
-              style={{
-                height: 'auto',
-                pointerEvents: 'none',
-              }}
-            />
-          </div>
-        )}
-        <div
-          className={`min-h-[45vh] flex flex-col items-center justify-center px-8 py-8 w-full min-w-[30rem] max-w-[calc(100%-2rem)] border transition-all duration-200 dropzone-inner relative`}
-          style={{
-            borderRadius: '0.5rem',
-            backgroundColor: 'var(--landing-inner-paper-bg)',
-            borderColor: 'var(--landing-inner-paper-border)',
-            borderWidth: '1px',
-            borderStyle: 'solid',
-          }}
-        >
-          {/* Logo positioned absolutely in top right corner */}
+        <LandingDocumentStack />
 
+        <h1 className="landing-title">
+          {t("landing.heroTitle", "Stirling PDF")}
+        </h1>
+        <p className="landing-subtitle">
+          {t(
+            "landing.heroSubtitle",
+            "Drop in or add an existing PDF to get started.",
+          )}
+        </p>
 
-          {/* Centered content container */}
-          <div className="flex flex-col items-center gap-4 flex-none w-full">
-            {/* Stirling PDF Branding */}
-            <Group gap="xs" align="center">
-              <img
-                src={colorScheme === 'dark' ? wordmark.white : wordmark.grey}
-                alt="Stirling PDF"
-                style={{ height: '2.2rem', width: 'auto' }}
-              />
-            </Group>
-
-            {/* Add Files + Native Upload Buttons */}
-            <div
-              style={{
-                display: 'flex',
-                alignItems: 'center',
-                justifyContent: 'center',
-                gap: '0.6rem',
-                width: '80%',
-                marginTop: '0.8rem',
-                marginBottom: '0.8rem'
-              }}
-              onMouseLeave={() => setIsUploadHover(false)}
-            >
-              {/* Show both buttons only when recents exist; otherwise show a single Upload button */}
-              {hasRecents && (
-                <>
-                  <Button
-                    style={{
-                      backgroundColor: 'var(--landing-button-bg)',
-                      color: 'var(--landing-button-color)',
-                      border: '1px solid var(--landing-button-border)',
-                      borderRadius: '2rem',
-                      height: '38px',
-                      paddingLeft: isUploadHover ? 0 : '1rem',
-                      paddingRight: isUploadHover ? 0 : '1rem',
-                      width: isUploadHover ? '58px' : 'calc(100% - 58px - 0.6rem)',
-                      minWidth: isUploadHover ? '58px' : undefined,
-                      display: 'flex',
-                      alignItems: 'center',
-                      justifyContent: 'center',
-                      transition: 'width .5s ease, padding .5s ease'
-                    }}
-                    onClick={handleOpenFilesModal}
-                    onMouseEnter={() => setIsUploadHover(false)}
-                  >
-                    <LocalIcon icon="add" width="1.5rem" height="1.5rem" className="text-[var(--accent-interactive)]" />
-                    {!isUploadHover && (
-                      <span>
-                        {t('landing.addFiles', 'Add Files')}
-                      </span>
-                    )}
-                  </Button>
-                  <Button
-                    aria-label="Upload"
-                    style={{
-                      backgroundColor: 'var(--landing-button-bg)',
-                      color: 'var(--landing-button-color)',
-                      border: '1px solid var(--landing-button-border)',
-                      borderRadius: '1rem',
-                      height: '38px',
-                      width: isUploadHover ? 'calc(100% - 50px)' : '58px',
-                      minWidth: '58px',
-                      paddingLeft: isUploadHover ? '1rem' : 0,
-                      paddingRight: isUploadHover ? '1rem' : 0,
-                      display: 'flex',
-                      alignItems: 'center',
-                      justifyContent: 'center',
-                      transition: 'width .5s ease, padding .5s ease'
-                    }}
-                    onClick={handleNativeUploadClick}
-                    onMouseEnter={() => setIsUploadHover(true)}
-                  >
-                    <LocalIcon icon={icons.uploadIconName} width="1.25rem" height="1.25rem" style={{ color: 'var(--accent-interactive)' }} />
-                    {isUploadHover && (
-                      <span style={{ marginLeft: '.5rem' }}>
-                        {terminology.uploadFromComputer}
-                      </span>
-                    )}
-                  </Button>
-                  {config?.enableMobileScanner && !isMobile && (
-                    <Tooltip label={t('landing.mobileUpload', 'Upload from Mobile')} position="bottom">
-                      <ActionIcon
-                        size={38}
-                        variant="subtle"
-                        onClick={handleMobileUploadClick}
-                        style={{
-                          backgroundColor: 'var(--landing-button-bg)',
-                          color: 'var(--accent-interactive)',
-                          border: '1px solid var(--landing-button-border)',
-                          borderRadius: '1rem',
-                          paddingLeft: '0.5rem',
-                          paddingRight: '0.5rem',
-                        }}
-                      >
-                        <LocalIcon icon="qr-code-rounded" width="1.25rem" height="1.25rem" style={{ color: 'var(--accent-interactive)' }} />
-                      </ActionIcon>
-                    </Tooltip>
-                  )}
-                </>
-              )}
-              {!hasRecents && (
-                <>
-                  <Button
-                    aria-label="Upload"
-                    style={{
-                      backgroundColor: 'var(--landing-button-bg)',
-                      color: 'var(--landing-button-color)',
-                      border: '1px solid var(--landing-button-border)',
-                      borderRadius: '1rem',
-                      height: '38px',
-                      width: 'calc(100% - 38px - 0.6rem)',
-                      minWidth: '58px',
-                      paddingLeft: '1rem',
-                      paddingRight: '1rem',
-                      display: 'flex',
-                      alignItems: 'center',
-                      justifyContent: 'center'
-                    }}
-                    onClick={handleNativeUploadClick}
-                  >
-                    <LocalIcon icon="upload" width="1.25rem" height="1.25rem" style={{ color: 'var(--accent-interactive)' }} />
-                    <span style={{ marginLeft: '.5rem' }}>
-                      {t('landing.uploadFromComputer', 'Upload from computer')}
-                    </span>
-                  </Button>
-                  {config?.enableMobileScanner && !isMobile && (
-                    <Tooltip label={t('landing.mobileUpload', 'Upload from Mobile')} position="bottom">
-                      <ActionIcon
-                        size={38}
-                        variant="subtle"
-                        onClick={handleMobileUploadClick}
-                        style={{
-                          backgroundColor: 'var(--landing-button-bg)',
-                          color: 'var(--accent-interactive)',
-                          border: '1px solid var(--landing-button-border)',
-                          borderRadius: '1rem',
-                          paddingLeft: '0.5rem',
-                          paddingRight: '0.5rem',
-                        }}
-                      >
-                        <LocalIcon icon="qr-code-rounded" width="1.25rem" height="1.25rem" style={{ color: 'var(--accent-interactive)' }} />
-                      </ActionIcon>
-                    </Tooltip>
-                  )}
-                </>
-              )}
-            </div>
-
-            {/* Hidden file input for native file picker */}
-            <input
-              ref={fileInputRef}
-              type="file"
-              multiple
-              onChange={handleFileSelect}
-              style={{ display: 'none' }}
-            />
-
-          </div>
-
-          {/* Instruction Text */}
-          <span
-            className="text-[var(--accent-interactive)]"
-            style={{ fontSize: '.8rem' }}
-          >
-            {terminology.dropFilesHere}
-          </span>
-        </div>
+        <LandingActions
+          fileInputRef={fileInputRef}
+          onUploadClick={() => void handleNativeUploadClick()}
+          onMobileUploadClick={() => setMobileUploadModalOpen(true)}
+          onFileSelect={handleFileSelect}
+        />
       </Dropzone>
+
       <MobileUploadModal
         opened={mobileUploadModalOpen}
         onClose={() => setMobileUploadModalOpen(false)}
diff --git a/frontend/src/core/components/shared/LanguageSelector.module.css b/frontend/src/core/components/shared/LanguageSelector.module.css
index 431f438069..8f2248687b 100644
--- a/frontend/src/core/components/shared/LanguageSelector.module.css
+++ b/frontend/src/core/components/shared/LanguageSelector.module.css
@@ -18,11 +18,11 @@
   .languageGrid {
     grid-template-columns: repeat(2, 1fr);
   }
-  
+
   .languageItem:nth-child(4n) {
     border-right: 2px solid var(--mantine-color-gray-3);
   }
-  
+
   .languageItem:nth-child(2n) {
     border-right: none;
   }
@@ -32,11 +32,11 @@
   .languageGrid {
     grid-template-columns: repeat(3, 1fr);
   }
-  
+
   .languageItem:nth-child(4n) {
     border-right: 2px solid var(--mantine-color-gray-3);
   }
-  
+
   .languageItem:nth-child(3n) {
     border-right: none;
   }
@@ -85,4 +85,4 @@
     height: 100px;
     opacity: 0;
   }
-}
\ No newline at end of file
+}
diff --git a/frontend/src/core/components/shared/LanguageSelector.tsx b/frontend/src/core/components/shared/LanguageSelector.tsx
index 66aa17c8a8..e0896a21eb 100644
--- a/frontend/src/core/components/shared/LanguageSelector.tsx
+++ b/frontend/src/core/components/shared/LanguageSelector.tsx
@@ -1,15 +1,15 @@
-import React, { useState, useEffect } from 'react';
-import { Menu, Button, ActionIcon } from '@mantine/core';
-import { Tooltip } from '@app/components/shared/Tooltip';
-import { useTranslation } from 'react-i18next';
-import { supportedLanguages, setUserLanguage } from '@app/i18n';
-import LocalIcon from '@app/components/shared/LocalIcon';
-import styles from '@app/components/shared/LanguageSelector.module.css';
-import { Z_INDEX_CONFIG_MODAL } from '@app/styles/zIndex';
+import React, { useState, useEffect } from "react";
+import { Menu, Button, ActionIcon } from "@mantine/core";
+import { Tooltip } from "@app/components/shared/Tooltip";
+import { useTranslation } from "react-i18next";
+import { supportedLanguages, setUserLanguage } from "@app/i18n";
+import LocalIcon from "@app/components/shared/LocalIcon";
+import styles from "@app/components/shared/LanguageSelector.module.css";
+import { Z_INDEX_CONFIG_MODAL } from "@app/styles/zIndex";
 
 // Types
 interface LanguageSelectorProps {
-  position?: React.ComponentProps<typeof Menu>['position'];
+  position?: React.ComponentProps<typeof Menu>["position"];
   offset?: number;
   compact?: boolean; // icon-only trigger
   tooltip?: string; // tooltip text for compact mode
@@ -48,12 +48,12 @@ const LanguageItem: React.FC<LanguageItemProps> = ({
   rippleEffect,
   pendingLanguage,
   compact,
-  disabled = false
+  disabled = false,
 }) => {
   const { t } = useTranslation();
 
   const labelText = option.label;
-  const comingSoonText = t('comingSoon', 'Coming soon');
+  const comingSoonText = t("comingSoon", "Coming soon");
 
   const label = disabled ? (
     <Tooltip content={comingSoonText} position="left" arrow>
@@ -68,7 +68,7 @@ const LanguageItem: React.FC<LanguageItemProps> = ({
       className={styles.languageItem}
       style={{
         opacity: animationTriggered ? 1 : 0,
-        transform: animationTriggered ? 'translateY(0px)' : 'translateY(8px)',
+        transform: animationTriggered ? "translateY(0px)" : "translateY(8px)",
         transition: `opacity 0.15s cubic-bezier(0.25, 0.46, 0.45, 0.94) ${index * 0.01}s, transform 0.15s cubic-bezier(0.25, 0.46, 0.45, 0.94) ${index * 0.01}s`,
       }}
     >
@@ -81,40 +81,42 @@ const LanguageItem: React.FC<LanguageItemProps> = ({
         disabled={disabled}
         styles={{
           root: {
-            borderRadius: '4px',
-            minHeight: '32px',
-            padding: '4px 8px',
-            justifyContent: 'flex-start',
-            position: 'relative',
-            overflow: 'hidden',
+            borderRadius: "4px",
+            minHeight: "32px",
+            padding: "4px 8px",
+            justifyContent: "flex-start",
+            position: "relative",
+            overflow: "hidden",
             backgroundColor: isSelected
-              ? 'light-dark(var(--mantine-color-blue-1), var(--mantine-color-blue-8))'
-              : 'transparent',
+              ? "light-dark(var(--mantine-color-blue-1), var(--mantine-color-blue-8))"
+              : "transparent",
             color: disabled
-              ? 'light-dark(var(--mantine-color-gray-5), var(--mantine-color-dark-3))'
+              ? "light-dark(var(--mantine-color-gray-5), var(--mantine-color-dark-3))"
               : isSelected
-              ? 'light-dark(var(--mantine-color-blue-9), var(--mantine-color-white))'
-              : 'light-dark(var(--mantine-color-gray-7), var(--mantine-color-white))',
-            transition: 'all 0.12s cubic-bezier(0.25, 0.46, 0.45, 0.94)',
-            cursor: disabled ? 'not-allowed' : 'pointer',
-            '&:hover': !disabled ? {
-              backgroundColor: isSelected
-                ? 'light-dark(var(--mantine-color-blue-2), var(--mantine-color-blue-7))'
-                : 'light-dark(var(--mantine-color-gray-1), var(--mantine-color-dark-5))',
-              transform: 'translateY(-1px)',
-              boxShadow: '0 2px 8px rgba(0, 0, 0, 0.1)',
-            } : {}
+                ? "light-dark(var(--mantine-color-blue-9), var(--mantine-color-white))"
+                : "light-dark(var(--mantine-color-gray-7), var(--mantine-color-white))",
+            transition: "all 0.12s cubic-bezier(0.25, 0.46, 0.45, 0.94)",
+            cursor: disabled ? "not-allowed" : "pointer",
+            "&:hover": !disabled
+              ? {
+                  backgroundColor: isSelected
+                    ? "light-dark(var(--mantine-color-blue-2), var(--mantine-color-blue-7))"
+                    : "light-dark(var(--mantine-color-gray-1), var(--mantine-color-dark-5))",
+                  transform: "translateY(-1px)",
+                  boxShadow: "0 2px 8px rgba(0, 0, 0, 0.1)",
+                }
+              : {},
           },
           label: {
-            fontSize: '13px',
+            fontSize: "13px",
             fontWeight: isSelected ? 600 : 400,
-            textAlign: 'left',
-            overflow: 'hidden',
-            textOverflow: 'ellipsis',
-            whiteSpace: 'nowrap',
-            position: 'relative',
+            textAlign: "left",
+            overflow: "hidden",
+            textOverflow: "ellipsis",
+            whiteSpace: "nowrap",
+            position: "relative",
             zIndex: 2,
-          }
+          },
         }}
       >
         {label}
@@ -122,16 +124,17 @@ const LanguageItem: React.FC<LanguageItemProps> = ({
           <div
             key={rippleEffect.key}
             style={{
-              position: 'absolute',
+              position: "absolute",
               left: rippleEffect.x,
               top: rippleEffect.y,
               width: 0,
               height: 0,
-              borderRadius: '50%',
-              backgroundColor: 'var(--mantine-color-blue-4)',
+              borderRadius: "50%",
+              backgroundColor: "var(--mantine-color-blue-4)",
               opacity: 0.6,
-              transform: 'translate(-50%, -50%)',
-              animation: 'ripple-expand 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94)',
+              transform: "translate(-50%, -50%)",
+              animation:
+                "ripple-expand 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94)",
               zIndex: 1,
             }}
           />
@@ -155,10 +158,10 @@ const RippleStyles: React.FC = () => (
 
 // Main component
 const LanguageSelector: React.FC<LanguageSelectorProps> = ({
-  position = 'bottom-start',
+  position = "bottom-start",
   offset = 8,
   compact = false,
-  tooltip
+  tooltip,
 }) => {
   const { i18n, ready } = useTranslation();
   const [opened, setOpened] = useState(false);
@@ -183,11 +186,15 @@ const LanguageSelector: React.FC<LanguageSelectorProps> = ({
 
   // Get the filtered list of supported languages from i18n
   // This respects server config (ui.languages) applied by AppConfigLoader
-  const allowedLanguages = (i18n.options.supportedLngs as string[] || [])
-    .filter(lang => lang !== 'cimode'); // Exclude i18next debug language
+  const allowedLanguages = (
+    (i18n.options.supportedLngs as string[]) || []
+  ).filter((lang) => lang !== "cimode"); // Exclude i18next debug language
 
   const languageOptions: LanguageOption[] = Object.entries(supportedLanguages)
-    .filter(([code]) => allowedLanguages.length === 0 || allowedLanguages.includes(code))
+    .filter(
+      ([code]) =>
+        allowedLanguages.length === 0 || allowedLanguages.includes(code),
+    )
     .sort(([, nameA], [, nameB]) => nameA.localeCompare(nameB))
     .map(([code, name]) => ({
       value: code,
@@ -196,13 +203,11 @@ const LanguageSelector: React.FC<LanguageSelectorProps> = ({
 
   // Calculate dropdown width and grid columns based on number of languages
   // 2-4: 300px/2 cols, 5-9: 400px/3 cols, 10+: 600px/4 cols
-  const dropdownWidth = languageOptions.length <= 4 ? 300
-    : languageOptions.length <= 9 ? 400
-    : 600;
+  const dropdownWidth =
+    languageOptions.length <= 4 ? 300 : languageOptions.length <= 9 ? 400 : 600;
 
-  const gridColumns = languageOptions.length <= 4 ? 2
-    : languageOptions.length <= 9 ? 3
-    : 4;
+  const gridColumns =
+    languageOptions.length <= 4 ? 2 : languageOptions.length <= 9 ? 3 : 4;
 
   const handleLanguageChange = (value: string, event: React.MouseEvent) => {
     // Create ripple effect at click position (only for button mode)
@@ -229,16 +234,17 @@ const LanguageSelector: React.FC<LanguageSelectorProps> = ({
         setTimeout(() => setRippleEffect(null), 50);
 
         // Force a full reload so RTL/LTR layout and tooltips re-evaluate correctly
-        if (typeof window !== 'undefined') {
+        if (typeof window !== "undefined") {
           window.location.reload();
         }
       }, 150);
     }, 100);
   };
 
-  const currentLanguage = supportedLanguages[i18n.language as keyof typeof supportedLanguages] ||
-                         supportedLanguages['en-GB'] ||
-                         'English'; // Fallback if supportedLanguages lookup fails
+  const currentLanguage =
+    supportedLanguages[i18n.language as keyof typeof supportedLanguages] ||
+    supportedLanguages["en-GB"] ||
+    "English"; // Fallback if supportedLanguages lookup fails
 
   // Hide the language selector if there's only one language option
   // (no point showing a selector when there's nothing to select)
@@ -258,9 +264,9 @@ const LanguageSelector: React.FC<LanguageSelectorProps> = ({
         zIndex={Z_INDEX_CONFIG_MODAL}
         withinPortal
         transitionProps={{
-          transition: 'scale-y',
+          transition: "scale-y",
           duration: 120,
-          timingFunction: 'cubic-bezier(0.25, 0.46, 0.45, 0.94)'
+          timingFunction: "cubic-bezier(0.25, 0.46, 0.45, 0.94)",
         }}
       >
         <Menu.Target>
@@ -272,11 +278,12 @@ const LanguageSelector: React.FC<LanguageSelectorProps> = ({
               title={!opened && tooltip ? tooltip : undefined}
               styles={{
                 root: {
-                  color: 'var(--right-rail-icon)',
-                  '&:hover': {
-                    backgroundColor: 'light-dark(var(--mantine-color-gray-1), var(--mantine-color-dark-5))',
-                  }
-                }
+                  color: "var(--right-rail-icon)",
+                  "&:hover": {
+                    backgroundColor:
+                      "light-dark(var(--mantine-color-gray-1), var(--mantine-color-dark-5))",
+                  },
+                },
               }}
             >
               <LocalIcon icon="language" width="1.5rem" height="1.5rem" />
@@ -285,53 +292,58 @@ const LanguageSelector: React.FC<LanguageSelectorProps> = ({
             <Button
               variant="subtle"
               size="sm"
-              leftSection={<LocalIcon icon="language" width="1.5rem" height="1.5rem" />}
+              leftSection={
+                <LocalIcon icon="language" width="1.5rem" height="1.5rem" />
+              }
               styles={{
                 root: {
-                  border: 'none',
-                  color: 'light-dark(var(--mantine-color-gray-7), var(--mantine-color-gray-1))',
-                  transition: 'background-color 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94)',
-                  '&:hover': {
-                    backgroundColor: 'light-dark(var(--mantine-color-gray-1), var(--mantine-color-dark-5))',
-                  }
+                  border: "none",
+                  color:
+                    "light-dark(var(--mantine-color-gray-7), var(--mantine-color-gray-1))",
+                  transition:
+                    "background-color 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94)",
+                  "&:hover": {
+                    backgroundColor:
+                      "light-dark(var(--mantine-color-gray-1), var(--mantine-color-dark-5))",
+                  },
                 },
-                label: { fontSize: '12px', fontWeight: 500 }
+                label: { fontSize: "12px", fontWeight: 500 },
               }}
             >
-              <span className={styles.languageText}>
-                {currentLanguage}
-              </span>
+              <span className={styles.languageText}>{currentLanguage}</span>
             </Button>
           )}
         </Menu.Target>
 
         <Menu.Dropdown
           style={{
-            padding: '12px',
-            borderRadius: '8px',
-            boxShadow: '0 4px 12px rgba(0, 0, 0, 0.1)',
-            backgroundColor: 'light-dark(var(--mantine-color-white), var(--mantine-color-dark-6))',
-            border: 'light-dark(1px solid var(--mantine-color-gray-3), 1px solid var(--mantine-color-dark-4))',
+            padding: "12px",
+            borderRadius: "8px",
+            boxShadow: "0 4px 12px rgba(0, 0, 0, 0.1)",
+            backgroundColor:
+              "light-dark(var(--mantine-color-white), var(--mantine-color-dark-6))",
+            border:
+              "light-dark(1px solid var(--mantine-color-gray-3), 1px solid var(--mantine-color-dark-4))",
           }}
         >
           <div
             className={styles.languageGrid}
             style={{ gridTemplateColumns: `repeat(${gridColumns}, 1fr)` }}
           >
-              {languageOptions.map((option, index) => (
-                  <LanguageItem
-                    key={option.value}
-                    option={option}
-                    index={index}
-                    animationTriggered={animationTriggered}
-                    isSelected={option.value === i18n.language}
-                    onClick={(event) => handleLanguageChange(option.value, event)}
-                    rippleEffect={rippleEffect}
-                    pendingLanguage={pendingLanguage}
-                    compact={compact}
-                    disabled={false}
-                  />
-                ))}
+            {languageOptions.map((option, index) => (
+              <LanguageItem
+                key={option.value}
+                option={option}
+                index={index}
+                animationTriggered={animationTriggered}
+                isSelected={option.value === i18n.language}
+                onClick={(event) => handleLanguageChange(option.value, event)}
+                rippleEffect={rippleEffect}
+                pendingLanguage={pendingLanguage}
+                compact={compact}
+                disabled={false}
+              />
+            ))}
           </div>
         </Menu.Dropdown>
       </Menu>
diff --git a/frontend/src/core/components/shared/LocalIcon.tsx b/frontend/src/core/components/shared/LocalIcon.tsx
index ff7ca493af..fc51cb419b 100644
--- a/frontend/src/core/components/shared/LocalIcon.tsx
+++ b/frontend/src/core/components/shared/LocalIcon.tsx
@@ -1,6 +1,6 @@
-import React from 'react';
-import { addCollection, Icon } from '@iconify/react';
-import iconSet from '../../../assets/material-symbols-icons.json'; // eslint-disable-line no-restricted-imports -- Outside app paths
+import React from "react";
+import { addCollection, Icon } from "@iconify/react";
+import iconSet from "../../../assets/material-symbols-icons.json"; // eslint-disable-line no-restricted-imports -- Outside app paths
 
 // Load icons synchronously at import time - guaranteed to be ready on first render
 let iconsLoaded = false;
@@ -10,10 +10,12 @@ try {
     addCollection(iconSet);
     iconsLoaded = true;
     const localIconCount = Object.keys(iconSet.icons || {}).length;
-    console.info(`✅ Local icons loaded: ${localIconCount} icons (${Math.round(JSON.stringify(iconSet).length / 1024)}KB)`);
+    console.info(
+      `✅ Local icons loaded: ${localIconCount} icons (${Math.round(JSON.stringify(iconSet).length / 1024)}KB)`,
+    );
   }
 } catch {
-  console.info('ℹ�  Local icons not available - using CDN fallback');
+  console.info("ℹ�  Local icons not available - using CDN fallback");
 }
 
 interface LocalIconProps {
@@ -28,19 +30,25 @@ interface LocalIconProps {
  * LocalIcon component that uses our locally bundled Material Symbols icons
  * instead of loading from CDN
  */
-export const LocalIcon: React.FC<LocalIconProps> = ({ icon, width, height, style, ...props }) => {
+export const LocalIcon: React.FC<LocalIconProps> = ({
+  icon,
+  width,
+  height,
+  style,
+  ...props
+}) => {
   // Convert our icon naming convention to the local collection format
-  const iconName = icon.startsWith('material-symbols:')
+  const iconName = icon.startsWith("material-symbols:")
     ? icon
     : `material-symbols:${icon}`;
 
   // Development logging (only in dev mode)
-  if (process.env.NODE_ENV === 'development') {
+  if (process.env.NODE_ENV === "development") {
     const logKey = `icon-${iconName}`;
     if (!sessionStorage.getItem(logKey)) {
-      const source = iconsLoaded ? 'local' : 'CDN';
+      const source = iconsLoaded ? "local" : "CDN";
       console.debug(`🎯 Icon: ${iconName} (${source})`);
-      sessionStorage.setItem(logKey, 'logged');
+      sessionStorage.setItem(logKey, "logged");
     }
   }
 
@@ -48,10 +56,10 @@ export const LocalIcon: React.FC<LocalIconProps> = ({ icon, width, height, style
 
   // Use width if provided, otherwise fall back to height
   const size = width || height;
-  if (size && typeof size === 'string') {
+  if (size && typeof size === "string") {
     // If it's a CSS unit string (like '1.5rem'), use it as fontSize
     iconStyle.fontSize = size;
-  } else if (typeof size === 'number') {
+  } else if (typeof size === "number") {
     // If it's a number, treat it as pixels
     iconStyle.fontSize = `${size}px`;
   }
diff --git a/frontend/src/core/components/shared/LogoIcon.tsx b/frontend/src/core/components/shared/LogoIcon.tsx
new file mode 100644
index 0000000000..6723fc3c32
--- /dev/null
+++ b/frontend/src/core/components/shared/LogoIcon.tsx
@@ -0,0 +1,14 @@
+import React from "react";
+import { useMantineColorScheme } from "@mantine/core";
+import { useLogoPath } from "@app/hooks/useLogoPath";
+
+interface LogoIconProps extends React.ImgHTMLAttributes<HTMLImageElement> {
+  alt?: string;
+}
+
+export function LogoIcon({ alt = "", ...props }: LogoIconProps) {
+  const { colorScheme } = useMantineColorScheme();
+  const logoPaths = useLogoPath();
+  const src = colorScheme === "dark" ? logoPaths.dark : logoPaths.light;
+  return <img src={src} alt={alt} {...props} />;
+}
diff --git a/frontend/src/core/components/shared/MobileUploadModal.tsx b/frontend/src/core/components/shared/MobileUploadModal.tsx
index 275b2cb0d9..0232ef93f4 100644
--- a/frontend/src/core/components/shared/MobileUploadModal.tsx
+++ b/frontend/src/core/components/shared/MobileUploadModal.tsx
@@ -1,16 +1,16 @@
-import { useEffect, useCallback, useState, useRef } from 'react';
-import { Modal, Stack, Text, Badge, Box, Alert } from '@mantine/core';
-import { QRCodeSVG } from 'qrcode.react';
-import { useTranslation } from 'react-i18next';
-import { useAppConfig } from '@app/contexts/AppConfigContext';
-import InfoRoundedIcon from '@mui/icons-material/InfoRounded';
-import ErrorRoundedIcon from '@mui/icons-material/ErrorRounded';
-import CheckRoundedIcon from '@mui/icons-material/CheckRounded';
-import WarningRoundedIcon from '@mui/icons-material/WarningRounded';
-import { Z_INDEX_OVER_FILE_MANAGER_MODAL } from '@app/styles/zIndex';
-import { withBasePath } from '@app/constants/app';
-import { convertImageToPdf, isImageFile } from '@app/utils/imageToPdfUtils';
-import apiClient from '@app/services/apiClient';
+import { useEffect, useCallback, useState, useRef } from "react";
+import { Modal, Stack, Text, Badge, Box, Alert } from "@mantine/core";
+import { QRCodeSVG } from "qrcode.react";
+import { useTranslation } from "react-i18next";
+import { useAppConfig } from "@app/contexts/AppConfigContext";
+import InfoRoundedIcon from "@mui/icons-material/InfoRounded";
+import ErrorRoundedIcon from "@mui/icons-material/ErrorRounded";
+import CheckRoundedIcon from "@mui/icons-material/CheckRounded";
+import WarningRoundedIcon from "@mui/icons-material/WarningRounded";
+import { Z_INDEX_OVER_FILE_MANAGER_MODAL } from "@app/styles/zIndex";
+import { withBasePath } from "@app/constants/app";
+import { convertImageToPdf, isImageFile } from "@app/utils/imageToPdfUtils";
+import apiClient from "@app/services/apiClient";
 
 interface MobileUploadModalProps {
   opened: boolean;
@@ -21,9 +21,10 @@ interface MobileUploadModalProps {
 // Generate a cryptographically secure UUID v4-like session ID
 function generateSessionId(): string {
   // Use Web Crypto API for cryptographically secure random values
-  const cryptoObj = typeof crypto !== 'undefined' ? crypto : (window as any).crypto;
+  const cryptoObj =
+    typeof crypto !== "undefined" ? crypto : (window as any).crypto;
 
-  if (cryptoObj && typeof cryptoObj.getRandomValues === 'function') {
+  if (cryptoObj && typeof cryptoObj.getRandomValues === "function") {
     const bytes = new Uint8Array(16);
     cryptoObj.getRandomValues(bytes);
 
@@ -32,19 +33,23 @@ function generateSessionId(): string {
     bytes[8] = (bytes[8] & 0x3f) | 0x80; // variant 10
 
     // Convert bytes to hex string in UUID format
-    const hex = Array.from(bytes, (b) => b.toString(16).padStart(2, '0'));
+    const hex = Array.from(bytes, (b) => b.toString(16).padStart(2, "0"));
     return [
-      hex.slice(0, 4).join(''),
-      hex.slice(4, 6).join(''),
-      hex.slice(6, 8).join(''),
-      hex.slice(8, 10).join(''),
-      hex.slice(10, 16).join(''),
-    ].join('-');
+      hex.slice(0, 4).join(""),
+      hex.slice(4, 6).join(""),
+      hex.slice(6, 8).join(""),
+      hex.slice(8, 10).join(""),
+      hex.slice(10, 16).join(""),
+    ].join("-");
   }
 
   // If Web Crypto is not available, fail fast rather than using insecure randomness
-  console.error('Web Crypto API not available. Cannot generate secure session ID.');
-  throw new Error('Web Crypto API not available. Cannot generate secure session ID.');
+  console.error(
+    "Web Crypto API not available. Cannot generate secure session ID.",
+  );
+  throw new Error(
+    "Web Crypto API not available. Cannot generate secure session ID.",
+  );
 }
 
 interface SessionInfo {
@@ -60,7 +65,11 @@ interface SessionInfo {
  * Displays a QR code that mobile devices can scan to upload files via backend server.
  * Files are temporarily stored on server and retrieved by desktop.
  */
-export default function MobileUploadModal({ opened, onClose, onFilesReceived }: MobileUploadModalProps) {
+export default function MobileUploadModal({
+  opened,
+  onClose,
+  onFilesReceived,
+}: MobileUploadModalProps) {
   const { t } = useTranslation();
   const { config } = useAppConfig();
 
@@ -76,30 +85,39 @@ export default function MobileUploadModal({ opened, onClose, onFilesReceived }:
 
   // Use configured frontendUrl if set, otherwise use current origin
   // Combine with base path and mobile-scanner route
-  const baseUrl = localStorage.getItem('server_url') || '';
+  const baseUrl = localStorage.getItem("server_url") || "";
   const frontendUrl = baseUrl || config?.frontendUrl || window.location.origin;
-  const mobileUrl = `${frontendUrl}${withBasePath('/mobile-scanner')}?session=${sessionId}`;
+  const mobileUrl = `${frontendUrl}${withBasePath("/mobile-scanner")}?session=${sessionId}`;
 
   // Create session on backend
-  const createSession = useCallback(async (newSessionId: string) => {
-    try {
-      const response = await apiClient.post<SessionInfo>(`/api/v1/mobile-scanner/create-session/${newSessionId}`, undefined, {
-        responseType: 'json',
-      });
+  const createSession = useCallback(
+    async (newSessionId: string) => {
+      try {
+        const response = await apiClient.post<SessionInfo>(
+          `/api/v1/mobile-scanner/create-session/${newSessionId}`,
+          undefined,
+          {
+            responseType: "json",
+          },
+        );
 
-      if (!response.status || response.status !== 200) {
-        throw new Error('Failed to create session');
+        if (!response.status || response.status !== 200) {
+          throw new Error("Failed to create session");
+        }
+
+        const data = response.data;
+        setSessionInfo(data);
+        setError(null);
+        console.log("[MobileUploadModal] Session created:", data);
+      } catch (err) {
+        console.error("[MobileUploadModal] Failed to create session:", err);
+        setError(
+          t("mobileUpload.sessionCreateError", "Failed to create session"),
+        );
       }
-
-      const data = response.data;
-      setSessionInfo(data);
-      setError(null);
-      console.log('[MobileUploadModal] Session created:', data);
-    } catch (err) {
-      console.error('[MobileUploadModal] Failed to create session:', err);
-      setError(t('mobileUpload.sessionCreateError', 'Failed to create session'));
-    }
-  }, [t]);
+    },
+    [t],
+  );
 
   // Regenerate session (when expired or warned)
   const regenerateSession = useCallback(() => {
@@ -115,43 +133,64 @@ export default function MobileUploadModal({ opened, onClose, onFilesReceived }:
     if (!opened) return;
 
     try {
-      const response = await apiClient.get(`/api/v1/mobile-scanner/files/${sessionId}`);
+      const response = await apiClient.get(
+        `/api/v1/mobile-scanner/files/${sessionId}`,
+      );
       if (!response.status || response.status !== 200) {
-        throw new Error('Failed to check for files');
+        throw new Error("Failed to check for files");
       }
 
       const data = response.data;
       const files = data.files || [];
 
       // Download only files we haven't processed yet
-      const newFiles = files.filter((f: any) => !processedFiles.current.has(f.filename));
+      const newFiles = files.filter(
+        (f: any) => !processedFiles.current.has(f.filename),
+      );
 
       if (newFiles.length > 0) {
         for (const fileMetadata of newFiles) {
           try {
             const downloadResponse = await apiClient.get(
-              `/api/v1/mobile-scanner/download/${sessionId}/${fileMetadata.filename}`, {
-                responseType: 'blob',
-              }
+              `/api/v1/mobile-scanner/download/${sessionId}/${fileMetadata.filename}`,
+              {
+                responseType: "blob",
+              },
             );
 
             if (downloadResponse.status === 200) {
               const blob = downloadResponse.data;
               let file = new File([blob], fileMetadata.filename, {
-                type: fileMetadata.contentType || 'image/jpeg'
+                type: fileMetadata.contentType || "image/jpeg",
               });
 
               // Convert images to PDF if enabled
-              if (isImageFile(file) && config?.mobileScannerConvertToPdf !== false) {
+              if (
+                isImageFile(file) &&
+                config?.mobileScannerConvertToPdf !== false
+              ) {
                 try {
                   file = await convertImageToPdf(file, {
-                    imageResolution: config?.mobileScannerImageResolution as 'full' | 'reduced' | undefined,
-                    pageFormat: config?.mobileScannerPageFormat as 'keep' | 'A4' | 'letter' | undefined,
+                    imageResolution: config?.mobileScannerImageResolution as
+                      | "full"
+                      | "reduced"
+                      | undefined,
+                    pageFormat: config?.mobileScannerPageFormat as
+                      | "keep"
+                      | "A4"
+                      | "letter"
+                      | undefined,
                     stretchToFit: config?.mobileScannerStretchToFit,
                   });
-                  console.log('[MobileUploadModal] Converted image to PDF:', file.name);
+                  console.log(
+                    "[MobileUploadModal] Converted image to PDF:",
+                    file.name,
+                  );
                 } catch (convertError) {
-                  console.warn('[MobileUploadModal] Failed to convert image to PDF, using original file:', convertError);
+                  console.warn(
+                    "[MobileUploadModal] Failed to convert image to PDF, using original file:",
+                    convertError,
+                  );
                   // Continue with original image file if conversion fails
                 }
               }
@@ -161,7 +200,11 @@ export default function MobileUploadModal({ opened, onClose, onFilesReceived }:
               onFilesReceived([file]);
             }
           } catch (err) {
-            console.error('[MobileUploadModal] Failed to download file:', fileMetadata.filename, err);
+            console.error(
+              "[MobileUploadModal] Failed to download file:",
+              fileMetadata.filename,
+              err,
+            );
           }
         }
 
@@ -169,14 +212,19 @@ export default function MobileUploadModal({ opened, onClose, onFilesReceived }:
         // This ensures files are only on server for ~1 second
         try {
           await apiClient.delete(`/api/v1/mobile-scanner/session/${sessionId}`);
-          console.log('[MobileUploadModal] Session cleaned up after file download');
+          console.log(
+            "[MobileUploadModal] Session cleaned up after file download",
+          );
         } catch (cleanupErr) {
-          console.warn('[MobileUploadModal] Failed to cleanup session after download:', cleanupErr);
+          console.warn(
+            "[MobileUploadModal] Failed to cleanup session after download:",
+            cleanupErr,
+          );
         }
       }
     } catch (err) {
-      console.error('[MobileUploadModal] Error polling for files:', err);
-      setError(t('mobileUpload.pollingError', 'Error checking for files'));
+      console.error("[MobileUploadModal] Error polling for files:", err);
+      setError(t("mobileUpload.pollingError", "Error checking for files"));
     }
   }, [opened, sessionId, onFilesReceived, t]);
 
@@ -201,9 +249,12 @@ export default function MobileUploadModal({ opened, onClose, onFilesReceived }:
     processedFiles.current.clear();
 
     return () => {
-      console.log('Cleaning up session on unmount/close:', sessionId);
-      apiClient.delete(`/api/v1/mobile-scanner/session/${sessionId}`)
-        .catch(err => console.warn('[MobileUploadModal] Cleanup failed:', err));
+      console.log("Cleaning up session on unmount/close:", sessionId);
+      apiClient
+        .delete(`/api/v1/mobile-scanner/session/${sessionId}`)
+        .catch((err) =>
+          console.warn("[MobileUploadModal] Cleanup failed:", err),
+        );
     };
   }, [opened, sessionId, createSession]);
 
@@ -267,7 +318,7 @@ export default function MobileUploadModal({ opened, onClose, onFilesReceived }:
     <Modal
       opened={opened}
       onClose={onClose}
-      title={t('mobileUpload.title', 'Upload from Mobile')}
+      title={t("mobileUpload.title", "Upload from Mobile")}
       centered
       size="md"
       radius="lg"
@@ -275,40 +326,40 @@ export default function MobileUploadModal({ opened, onClose, onFilesReceived }:
       overlayProps={{ opacity: 0.35, blur: 2 }}
       styles={{
         body: {
-          paddingTop: '1.5rem',
+          paddingTop: "1.5rem",
         },
       }}
     >
       <Stack gap="md">
         <Alert
-          icon={<InfoRoundedIcon style={{ fontSize: '1rem' }} />}
+          icon={<InfoRoundedIcon style={{ fontSize: "1rem" }} />}
           color="blue"
           variant="light"
         >
           <Text size="sm">
             {config?.mobileScannerConvertToPdf !== false
               ? t(
-                  'mobileUpload.description',
-                  'Scan this QR code with your mobile device to upload photos. Images will be automatically converted to PDF.'
+                  "mobileUpload.description",
+                  "Scan this QR code with your mobile device to upload photos. Images will be automatically converted to PDF.",
                 )
               : t(
-                  'mobileUpload.descriptionNoConvert',
-                  'Scan this QR code with your mobile device to upload photos.'
+                  "mobileUpload.descriptionNoConvert",
+                  "Scan this QR code with your mobile device to upload photos.",
                 )}
           </Text>
         </Alert>
 
         {showExpiryWarning && timeRemaining !== null && (
           <Alert
-            icon={<WarningRoundedIcon style={{ fontSize: '1rem' }} />}
-            title={t('mobileUpload.expiryWarning', 'Session Expiring Soon')}
+            icon={<WarningRoundedIcon style={{ fontSize: "1rem" }} />}
+            title={t("mobileUpload.expiryWarning", "Session Expiring Soon")}
             color="orange"
           >
             <Text size="sm">
               {t(
-                'mobileUpload.expiryWarningMessage',
-                'This QR code will expire in {{seconds}} seconds. A new code will be generated automatically.',
-                { seconds: Math.ceil(timeRemaining / 1000) }
+                "mobileUpload.expiryWarningMessage",
+                "This QR code will expire in {{seconds}} seconds. A new code will be generated automatically.",
+                { seconds: Math.ceil(timeRemaining / 1000) },
               )}
             </Text>
           </Alert>
@@ -316,41 +367,55 @@ export default function MobileUploadModal({ opened, onClose, onFilesReceived }:
 
         {error && (
           <Alert
-            icon={<ErrorRoundedIcon style={{ fontSize: '1rem' }} />}
-            title={t('mobileUpload.error', 'Connection Error')}
+            icon={<ErrorRoundedIcon style={{ fontSize: "1rem" }} />}
+            title={t("mobileUpload.error", "Connection Error")}
             color="red"
           >
             <Text size="sm">{error}</Text>
           </Alert>
         )}
 
-        <Box style={{ display: 'flex', flexDirection: 'column', alignItems: 'center', gap: '1rem' }}>
+        <Box
+          style={{
+            display: "flex",
+            flexDirection: "column",
+            alignItems: "center",
+            gap: "1rem",
+          }}
+        >
           <Box
             style={{
-              padding: '1.5rem',
-              background: 'white',
-              borderRadius: '8px',
-              boxShadow: '0 2px 8px rgba(0,0,0,0.1)',
+              padding: "1.5rem",
+              background: "white",
+              borderRadius: "8px",
+              boxShadow: "0 2px 8px rgba(0,0,0,0.1)",
             }}
           >
             <QRCodeSVG value={mobileUrl} size={256} level="H" includeMargin />
           </Box>
 
           {filesReceived > 0 && (
-            <Badge variant="filled" color="green" size="lg" leftSection={<CheckRoundedIcon style={{ fontSize: '1rem' }} />}>
-              {t('mobileUpload.filesReceived', '{{count}} file(s) received', { count: filesReceived })}
+            <Badge
+              variant="filled"
+              color="green"
+              size="lg"
+              leftSection={<CheckRoundedIcon style={{ fontSize: "1rem" }} />}
+            >
+              {t("mobileUpload.filesReceived", "{{count}} file(s) received", {
+                count: filesReceived,
+              })}
             </Badge>
           )}
 
-          <Text size="xs" c="dimmed" ta="center" style={{ maxWidth: '300px' }}>
+          <Text size="xs" c="dimmed" ta="center" style={{ maxWidth: "300px" }}>
             {config?.mobileScannerConvertToPdf !== false
               ? t(
-                  'mobileUpload.instructions',
-                  'Open the camera app on your phone and scan this code. Images will be automatically converted to PDF.'
+                  "mobileUpload.instructions",
+                  "Open the camera app on your phone and scan this code. Images will be automatically converted to PDF.",
                 )
               : t(
-                  'mobileUpload.instructionsNoConvert',
-                  'Open the camera app on your phone and scan this code. Files will be uploaded through the server.'
+                  "mobileUpload.instructionsNoConvert",
+                  "Open the camera app on your phone and scan this code. Files will be uploaded through the server.",
                 )}
           </Text>
 
@@ -358,9 +423,9 @@ export default function MobileUploadModal({ opened, onClose, onFilesReceived }:
             size="xs"
             c="dimmed"
             style={{
-              wordBreak: 'break-all',
-              textAlign: 'center',
-              fontFamily: 'monospace',
+              wordBreak: "break-all",
+              textAlign: "center",
+              fontFamily: "monospace",
             }}
           >
             {mobileUrl}
diff --git a/frontend/src/core/components/shared/MultiSelectControls.tsx b/frontend/src/core/components/shared/MultiSelectControls.tsx
index b6e0b24b9f..7a1cb80d10 100644
--- a/frontend/src/core/components/shared/MultiSelectControls.tsx
+++ b/frontend/src/core/components/shared/MultiSelectControls.tsx
@@ -16,33 +16,32 @@ const MultiSelectControls = ({
   onOpenInFileEditor,
   onOpenInPageEditor,
   onAddToUpload,
-  onDeleteAll
+  onDeleteAll,
 }: MultiSelectControlsProps) => {
   const { t } = useTranslation();
 
   if (selectedCount === 0) return null;
 
   return (
-    <Box mb="md" p="md" style={{ backgroundColor: 'var(--mantine-color-blue-0)', borderRadius: 8 }}>
+    <Box
+      mb="md"
+      p="md"
+      style={{
+        backgroundColor: "var(--mantine-color-blue-0)",
+        borderRadius: 8,
+      }}
+    >
       <Group justify="space-between">
         <Text size="sm">
           {selectedCount} {t("fileManager.filesSelected", "files selected")}
         </Text>
         <Group>
-          <Button
-            size="xs"
-            variant="light"
-            onClick={onClearSelection}
-          >
+          <Button size="xs" variant="light" onClick={onClearSelection}>
             {t("fileManager.clearSelection", "Clear Selection")}
           </Button>
 
           {onAddToUpload && (
-            <Button
-              size="xs"
-              color="green"
-              onClick={onAddToUpload}
-            >
+            <Button size="xs" color="green" onClick={onAddToUpload}>
               {t("fileManager.addToUpload", "Add to Upload")}
             </Button>
           )}
@@ -70,11 +69,7 @@ const MultiSelectControls = ({
           )}
 
           {onDeleteAll && (
-            <Button
-              size="xs"
-              color="red"
-              onClick={onDeleteAll}
-            >
+            <Button size="xs" color="red" onClick={onDeleteAll}>
               {t("fileManager.deleteAll", "Delete All")}
             </Button>
           )}
diff --git a/frontend/src/core/components/shared/NavigationWarningModal.tsx b/frontend/src/core/components/shared/NavigationWarningModal.tsx
index 6e143ccd18..d35f2a470c 100644
--- a/frontend/src/core/components/shared/NavigationWarningModal.tsx
+++ b/frontend/src/core/components/shared/NavigationWarningModal.tsx
@@ -1,3 +1,4 @@
+import { useRef, useEffect } from "react";
 import { Modal, Text, Button, Group, Stack } from "@mantine/core";
 import { useNavigationGuard } from "@app/contexts/NavigationContext";
 import { useTranslation } from "react-i18next";
@@ -6,51 +7,69 @@ import DeleteOutlineIcon from "@mui/icons-material/DeleteOutline";
 import CheckCircleOutlineIcon from "@mui/icons-material/CheckCircleOutline";
 import { Z_INDEX_TOAST } from "@app/styles/zIndex";
 
-interface NavigationWarningModalProps {
-  onApplyAndContinue?: () => Promise<void>;
-  onExportAndContinue?: () => Promise<void>;
-  /** Called when discarding - allows saving applied changes while discarding pending ones */
-  onDiscardAndContinue?: () => Promise<void>;
-}
-
-const NavigationWarningModal = ({ onApplyAndContinue, onExportAndContinue, onDiscardAndContinue }: NavigationWarningModalProps) => {
+const NavigationWarningModal = () => {
   const { t } = useTranslation();
-  const { showNavigationWarning, hasUnsavedChanges, pendingNavigation, cancelNavigation, confirmNavigation, setHasUnsavedChanges } =
-    useNavigationGuard();
+  const {
+    showNavigationWarning,
+    hasUnsavedChanges,
+    pendingNavigation,
+    cancelNavigation,
+    setHasUnsavedChanges,
+    navigationWarningHandlersRef,
+  } = useNavigationGuard();
+
+  // Store pendingNavigation in a ref so async handlers always have the latest,
+  // not a stale closure captured before an await.
+  const pendingNavigationRef = useRef(pendingNavigation);
+  useEffect(() => {
+    pendingNavigationRef.current = pendingNavigation;
+  }, [pendingNavigation]);
 
   const handleKeepWorking = () => {
     cancelNavigation();
   };
 
-  const handleDiscardChanges = async () => {
-    // If a discard handler is provided, call it to save any already-applied changes, then discard the unsaved changes
-    if (onDiscardAndContinue) {
-      await onDiscardAndContinue();
-    }
+  const finishAndNavigate = () => {
+    const nav = pendingNavigationRef.current;
     setHasUnsavedChanges(false);
-    confirmNavigation();
+    cancelNavigation();
+    if (nav) {
+      nav();
+    }
+  };
+
+  const handleDiscardChanges = async () => {
+    const handlers = navigationWarningHandlersRef.current;
+    if (handlers?.onDiscardAndContinue) {
+      await handlers.onDiscardAndContinue();
+    }
+    finishAndNavigate();
   };
 
   const handleApplyAndContinue = async () => {
-    if (onApplyAndContinue) {
-      await onApplyAndContinue();
+    const handlers = navigationWarningHandlersRef.current;
+    if (handlers?.onApplyAndContinue) {
+      await handlers.onApplyAndContinue();
     }
-    setHasUnsavedChanges(false);
-    confirmNavigation();
+    finishAndNavigate();
   };
 
   const handleExportAndContinue = async () => {
-    if (onExportAndContinue) {
-      await onExportAndContinue();
+    const handlers = navigationWarningHandlersRef.current;
+    if (handlers?.onExportAndContinue) {
+      await handlers.onExportAndContinue();
     }
-    setHasUnsavedChanges(false);
-    confirmNavigation();
+    finishAndNavigate();
   };
 
+  // Read handler availability at render time for button visibility
+  const handlers = navigationWarningHandlersRef.current;
+  const hasApply = !!handlers?.onApplyAndContinue;
+  const hasExport = !!handlers?.onExportAndContinue;
+
   const BUTTON_WIDTH = "12rem";
 
   // Only show modal if there are unsaved changes AND there's an actual pending navigation
-  // This prevents the modal from showing due to spurious state updates
   if (!hasUnsavedChanges || !pendingNavigation) {
     return null;
   }
@@ -67,33 +86,55 @@ const NavigationWarningModal = ({ onApplyAndContinue, onExportAndContinue, onDis
       zIndex={Z_INDEX_TOAST}
     >
       <Stack>
-        <Stack  ta="center"  p="md">
-        <Text size="md" fw="300">
-          {t("unsavedChanges", "You have unsaved changes to your PDF.")}
-        </Text>
-        <Text size="lg" fw="500" >
-          {t("areYouSure", "Are you sure you want to leave?")}
-        </Text>
+        <Stack ta="center" p="md">
+          <Text size="md" fw="300">
+            {t("unsavedChanges", "You have unsaved changes to your PDF.")}
+          </Text>
+          <Text size="lg" fw="500">
+            {t("areYouSure", "Are you sure you want to leave?")}
+          </Text>
         </Stack>
 
         {/* Desktop layout: 2 groups side by side */}
         <Group justify="space-between" gap="xl" visibleFrom="md">
           <Group gap="sm">
-            <Button variant="light" color="var(--mantine-color-gray-8)" onClick={handleKeepWorking} w={BUTTON_WIDTH} leftSection={<ArrowBackIcon fontSize="small" />}>
+            <Button
+              variant="light"
+              color="var(--mantine-color-gray-8)"
+              onClick={handleKeepWorking}
+              w={BUTTON_WIDTH}
+              leftSection={<ArrowBackIcon fontSize="small" />}
+            >
               {t("keepWorking", "Keep Working")}
             </Button>
           </Group>
           <Group gap="sm">
-            <Button variant="filled" color="var(--mantine-color-red-9)" onClick={handleDiscardChanges} w={BUTTON_WIDTH} leftSection={<DeleteOutlineIcon fontSize="small" />}>
+            <Button
+              variant="filled"
+              color="var(--mantine-color-red-9)"
+              onClick={handleDiscardChanges}
+              w={BUTTON_WIDTH}
+              leftSection={<DeleteOutlineIcon fontSize="small" />}
+            >
               {t("discardChanges", "Discard Changes")}
             </Button>
-            {onApplyAndContinue && (
-              <Button variant="filled"  onClick={handleApplyAndContinue} w={BUTTON_WIDTH} leftSection={<CheckCircleOutlineIcon fontSize="small" />}>
+            {hasApply && (
+              <Button
+                variant="filled"
+                onClick={handleApplyAndContinue}
+                w={BUTTON_WIDTH}
+                leftSection={<CheckCircleOutlineIcon fontSize="small" />}
+              >
                 {t("applyAndContinue", "Apply & Leave")}
               </Button>
             )}
-            {onExportAndContinue && (
-              <Button variant="filled"  onClick={handleExportAndContinue} w={BUTTON_WIDTH} leftSection={<CheckCircleOutlineIcon fontSize="small" />}>
+            {hasExport && (
+              <Button
+                variant="filled"
+                onClick={handleExportAndContinue}
+                w={BUTTON_WIDTH}
+                leftSection={<CheckCircleOutlineIcon fontSize="small" />}
+              >
                 {t("exportAndContinue", "Export & Leave")}
               </Button>
             )}
@@ -102,19 +143,41 @@ const NavigationWarningModal = ({ onApplyAndContinue, onExportAndContinue, onDis
 
         {/* Mobile layout: centered stack of 4 buttons */}
         <Stack align="center" gap="sm" hiddenFrom="md">
-           <Button variant="light" color="var(--mantine-color-gray-8)"  onClick={handleKeepWorking} w={BUTTON_WIDTH} leftSection={<ArrowBackIcon fontSize="small" />}>
+          <Button
+            variant="light"
+            color="var(--mantine-color-gray-8)"
+            onClick={handleKeepWorking}
+            w={BUTTON_WIDTH}
+            leftSection={<ArrowBackIcon fontSize="small" />}
+          >
             {t("keepWorking", "Keep Working")}
           </Button>
-          <Button variant="filled" color="var(--mantine-color-red-9)" onClick={handleDiscardChanges} w={BUTTON_WIDTH} leftSection={<DeleteOutlineIcon fontSize="small" />}>
+          <Button
+            variant="filled"
+            color="var(--mantine-color-red-9)"
+            onClick={handleDiscardChanges}
+            w={BUTTON_WIDTH}
+            leftSection={<DeleteOutlineIcon fontSize="small" />}
+          >
             {t("discardChanges", "Discard Changes")}
           </Button>
-          {onApplyAndContinue && (
-            <Button variant="filled" onClick={handleApplyAndContinue} w={BUTTON_WIDTH} leftSection={<CheckCircleOutlineIcon fontSize="small" />}>
+          {hasApply && (
+            <Button
+              variant="filled"
+              onClick={handleApplyAndContinue}
+              w={BUTTON_WIDTH}
+              leftSection={<CheckCircleOutlineIcon fontSize="small" />}
+            >
               {t("applyAndContinue", "Apply & Leave")}
             </Button>
           )}
-          {onExportAndContinue && (
-            <Button variant="filled" onClick={handleExportAndContinue} w={BUTTON_WIDTH} leftSection={<CheckCircleOutlineIcon fontSize="small" />}>
+          {hasExport && (
+            <Button
+              variant="filled"
+              onClick={handleExportAndContinue}
+              w={BUTTON_WIDTH}
+              leftSection={<CheckCircleOutlineIcon fontSize="small" />}
+            >
               {t("exportAndContinue", "Export & Leave")}
             </Button>
           )}
diff --git a/frontend/src/core/components/shared/ObscuredOverlay.tsx b/frontend/src/core/components/shared/ObscuredOverlay.tsx
index 2329d624dc..ba8140d303 100644
--- a/frontend/src/core/components/shared/ObscuredOverlay.tsx
+++ b/frontend/src/core/components/shared/ObscuredOverlay.tsx
@@ -1,5 +1,5 @@
-import React from 'react';
-import styles from '@app/components/shared/ObscuredOverlay/ObscuredOverlay.module.css';
+import React from "react";
+import styles from "@app/components/shared/ObscuredOverlay/ObscuredOverlay.module.css";
 
 type ObscuredOverlayProps = {
   obscured: boolean;
@@ -31,12 +31,14 @@ export default function ObscuredOverlay({
         >
           <div className={styles.overlayContent}>
             {overlayMessage && (
-              <div className={styles.overlayMessage}>
-                {overlayMessage}
-              </div>
+              <div className={styles.overlayMessage}>{overlayMessage}</div>
             )}
             {buttonText && onButtonClick && (
-              <button type="button" onClick={onButtonClick} className={styles.overlayButton}>
+              <button
+                type="button"
+                onClick={onButtonClick}
+                className={styles.overlayButton}
+              >
                 {buttonText}
               </button>
             )}
@@ -46,5 +48,3 @@ export default function ObscuredOverlay({
     </div>
   );
 }
-
-
diff --git a/frontend/src/core/components/shared/PageEditorFileDropdown.tsx b/frontend/src/core/components/shared/PageEditorFileDropdown.tsx
index 11f9742c2d..4cbd84b157 100644
--- a/frontend/src/core/components/shared/PageEditorFileDropdown.tsx
+++ b/frontend/src/core/components/shared/PageEditorFileDropdown.tsx
@@ -1,16 +1,16 @@
-import React from 'react';
-import { Menu, Loader, Group, Text, Checkbox } from '@mantine/core';
-import { LocalIcon } from '@app/components/shared/LocalIcon';
-import KeyboardArrowDownIcon from '@mui/icons-material/KeyboardArrowDown';
-import DragIndicatorIcon from '@mui/icons-material/DragIndicator';
-import AddIcon from '@mui/icons-material/Add';
-import FitText from '@app/components/shared/FitText';
-import { getFileColorWithOpacity } from '@app/components/pageEditor/fileColors';
-import { useFilesModalContext } from '@app/contexts/FilesModalContext';
-import { PrivateContent } from '@app/components/shared/PrivateContent';
-import { useFileItemDragDrop } from '@app/components/shared/pageEditor/useFileItemDragDrop';
+import React from "react";
+import { Menu, Loader, Group, Text, Checkbox } from "@mantine/core";
+import { LocalIcon } from "@app/components/shared/LocalIcon";
+import KeyboardArrowDownIcon from "@mui/icons-material/KeyboardArrowDown";
+import DragIndicatorIcon from "@mui/icons-material/DragIndicator";
+import AddIcon from "@mui/icons-material/Add";
+import FitText from "@app/components/shared/FitText";
+import { getFileColorWithOpacity } from "@app/components/pageEditor/fileColors";
+import { useFilesModalContext } from "@app/contexts/FilesModalContext";
+import { PrivateContent } from "@app/components/shared/PrivateContent";
+import { useFileItemDragDrop } from "@app/components/shared/pageEditor/useFileItemDragDrop";
 
-import { FileId } from '@app/types/file';
+import { FileId } from "@app/types/file";
 
 // Local interface for PageEditor file display
 interface PageEditorFile {
@@ -50,28 +50,30 @@ const FileMenuItem: React.FC<FileMenuItemProps> = ({
     onReorder,
   });
 
-  const itemName = file?.name || 'Untitled';
+  const itemName = file?.name || "Untitled";
   const fileColorBorder = getFileColorWithOpacity(colorIndex, 1);
   const fileColorBorderHover = getFileColorWithOpacity(colorIndex, 1.0);
 
   return (
     <div
       style={{
-        position: 'relative',
-        marginBottom: '0.5rem',
+        position: "relative",
+        marginBottom: "0.5rem",
       }}
     >
       {/* Drop indicator line */}
       {isDragOver && (
         <div
           style={{
-            position: 'absolute',
-            ...(dropPosition === 'above' ? { top: '-2px' } : { bottom: '-2px' }),
+            position: "absolute",
+            ...(dropPosition === "above"
+              ? { top: "-2px" }
+              : { bottom: "-2px" }),
             left: 0,
             right: 0,
-            height: '4px',
-            backgroundColor: 'rgb(59, 130, 246)',
-            borderRadius: '2px',
+            height: "4px",
+            backgroundColor: "rgb(59, 130, 246)",
+            borderRadius: "2px",
             zIndex: 10,
           }}
         />
@@ -87,34 +89,40 @@ const FileMenuItem: React.FC<FileMenuItemProps> = ({
           onToggleSelection(file.fileId);
         }}
         style={{
-          padding: '0.75rem 0.75rem',
-          cursor: isDragging ? 'grabbing' : 'grab',
-          backgroundColor: file.isSelected ? 'rgba(0, 0, 0, 0.05)' : 'transparent',
+          padding: "0.75rem 0.75rem",
+          cursor: isDragging ? "grabbing" : "grab",
+          backgroundColor: file.isSelected
+            ? "rgba(0, 0, 0, 0.05)"
+            : "transparent",
           borderLeft: `6px solid ${fileColorBorder}`,
           opacity: isDragging ? 0.5 : 1,
-          transition: 'opacity 0.2s ease-in-out, background-color 0.15s ease',
-          userSelect: 'none',
+          transition: "opacity 0.2s ease-in-out, background-color 0.15s ease",
+          userSelect: "none",
         }}
         onMouseEnter={(e) => {
           if (!isDragging) {
-            (e.currentTarget as HTMLDivElement).style.backgroundColor = 'rgba(0, 0, 0, 0.05)';
-            (e.currentTarget as HTMLDivElement).style.borderLeftColor = fileColorBorderHover;
+            (e.currentTarget as HTMLDivElement).style.backgroundColor =
+              "rgba(0, 0, 0, 0.05)";
+            (e.currentTarget as HTMLDivElement).style.borderLeftColor =
+              fileColorBorderHover;
           }
         }}
         onMouseLeave={(e) => {
           if (!isDragging) {
-            (e.currentTarget as HTMLDivElement).style.backgroundColor = file.isSelected ? 'rgba(0, 0, 0, 0.05)' : 'transparent';
-            (e.currentTarget as HTMLDivElement).style.borderLeftColor = fileColorBorder;
+            (e.currentTarget as HTMLDivElement).style.backgroundColor =
+              file.isSelected ? "rgba(0, 0, 0, 0.05)" : "transparent";
+            (e.currentTarget as HTMLDivElement).style.borderLeftColor =
+              fileColorBorder;
           }
         }}
       >
-        <Group gap="xs" style={{ width: '100%' }}>
+        <Group gap="xs" style={{ width: "100%" }}>
           <div
             style={{
-              cursor: 'grab',
-              display: 'flex',
-              alignItems: 'center',
-              color: 'var(--mantine-color-dimmed)',
+              cursor: "grab",
+              display: "flex",
+              alignItems: "center",
+              color: "var(--mantine-color-dimmed)",
             }}
           >
             <DragIndicatorIcon fontSize="small" />
@@ -125,7 +133,7 @@ const FileMenuItem: React.FC<FileMenuItemProps> = ({
             onClick={(e) => e.stopPropagation()}
             size="sm"
           />
-          <div style={{ flex: 1, textAlign: 'left', minWidth: 0 }}>
+          <div style={{ flex: 1, textAlign: "left", minWidth: 0 }}>
             <PrivateContent>
               <FitText text={itemName} minimumFontScale={0.7} />
             </PrivateContent>
@@ -167,24 +175,36 @@ export const PageEditorFileDropdown: React.FC<PageEditorFileDropdownProps> = ({
   return (
     <Menu trigger="click" position="bottom" width="40rem">
       <Menu.Target>
-        <div className="ph-no-capture" style={{...viewOptionStyle, cursor: 'pointer'}}>
+        <div
+          className="ph-no-capture"
+          style={{ ...viewOptionStyle, cursor: "pointer" }}
+        >
           {switchingTo === "pageEditor" ? (
             <Loader size="xs" />
           ) : (
-            <LocalIcon icon="dashboard-customize-rounded" width="1.4rem" height="1.4rem" />
+            <LocalIcon
+              icon="dashboard-customize-rounded"
+              width="1.4rem"
+              height="1.4rem"
+            />
           )}
-          <span className="ph-no-capture">{selectedCount}/{totalCount} files selected</span>
+          <span className="ph-no-capture">
+            {selectedCount}/{totalCount} files selected
+          </span>
           <KeyboardArrowDownIcon fontSize="small" />
         </div>
       </Menu.Target>
-      <Menu.Dropdown className="ph-no-capture" style={{
-        backgroundColor: 'var(--right-rail-bg)',
-        border: '1px solid var(--border-subtle)',
-        borderRadius: '8px',
-        boxShadow: '0 2px 8px rgba(0, 0, 0, 0.15)',
-        maxHeight: '80vh',
-        overflowY: 'auto'
-      }}>
+      <Menu.Dropdown
+        className="ph-no-capture"
+        style={{
+          backgroundColor: "var(--right-rail-bg)",
+          border: "1px solid var(--border-subtle)",
+          borderRadius: "8px",
+          boxShadow: "0 2px 8px rgba(0, 0, 0, 0.15)",
+          maxHeight: "80vh",
+          overflowY: "auto",
+        }}
+      >
         {files.map((file, index) => {
           const colorIndex = fileColorMap.get(file.fileId as string) ?? 0;
 
@@ -207,23 +227,33 @@ export const PageEditorFileDropdown: React.FC<PageEditorFileDropdownProps> = ({
             openFilesModal();
           }}
           style={{
-            padding: '0.75rem 0.75rem',
-            marginTop: '0.5rem',
-            cursor: 'pointer',
-            backgroundColor: 'transparent',
-            borderTop: '1px solid var(--border-subtle)',
-            transition: 'background-color 0.15s ease',
+            padding: "0.75rem 0.75rem",
+            marginTop: "0.5rem",
+            cursor: "pointer",
+            backgroundColor: "transparent",
+            borderTop: "1px solid var(--border-subtle)",
+            transition: "background-color 0.15s ease",
           }}
           onMouseEnter={(e) => {
-            (e.currentTarget as HTMLDivElement).style.backgroundColor = 'rgba(59, 130, 246, 0.25)';
+            (e.currentTarget as HTMLDivElement).style.backgroundColor =
+              "rgba(59, 130, 246, 0.25)";
           }}
           onMouseLeave={(e) => {
-            (e.currentTarget as HTMLDivElement).style.backgroundColor = 'transparent';
+            (e.currentTarget as HTMLDivElement).style.backgroundColor =
+              "transparent";
           }}
         >
-          <Group gap="xs" style={{ width: '100%' }}>
-            <AddIcon fontSize="small" style={{ color: 'var(--mantine-color-text)' }} />
-            <Text size="sm" fw={500} style={{ color: 'var(--mantine-color-text)' }} className="ph-no-capture">
+          <Group gap="xs" style={{ width: "100%" }}>
+            <AddIcon
+              fontSize="small"
+              style={{ color: "var(--mantine-color-text)" }}
+            />
+            <Text
+              size="sm"
+              fw={500}
+              style={{ color: "var(--mantine-color-text)" }}
+              className="ph-no-capture"
+            >
               Add File
             </Text>
           </Group>
diff --git a/frontend/src/core/components/shared/PageSelectionSyntaxHint.tsx b/frontend/src/core/components/shared/PageSelectionSyntaxHint.tsx
index bf7e642066..47cda328d8 100644
--- a/frontend/src/core/components/shared/PageSelectionSyntaxHint.tsx
+++ b/frontend/src/core/components/shared/PageSelectionSyntaxHint.tsx
@@ -1,47 +1,75 @@
-import { useEffect, useState } from 'react';
-import { useTranslation } from 'react-i18next';
-import { Text } from '@mantine/core';
-import classes from '@app/components/pageEditor/bulkSelectionPanel/BulkSelectionPanel.module.css';
-import { parseSelectionWithDiagnostics } from '@app/utils/bulkselection/parseSelection';
+import { useEffect, useState } from "react";
+import { useTranslation } from "react-i18next";
+import { Text } from "@mantine/core";
+import classes from "@app/components/pageEditor/bulkSelectionPanel/BulkSelectionPanel.module.css";
+import { parseSelectionWithDiagnostics } from "@app/utils/bulkselection/parseSelection";
 
 interface PageSelectionSyntaxHintProps {
   input: string;
   /** Optional known page count; if not provided, a large max is used for syntax-only checks */
   maxPages?: number;
   /** panel = full bulk panel style, compact = inline tool style */
-  variant?: 'panel' | 'compact';
+  variant?: "panel" | "compact";
 }
 
 const FALLBACK_MAX_PAGES = 100000; // large upper bound for syntax validation without a document
 
-const PageSelectionSyntaxHint = ({ input, maxPages, variant = 'panel' }: PageSelectionSyntaxHintProps) => {
+const PageSelectionSyntaxHint = ({
+  input,
+  maxPages,
+  variant = "panel",
+}: PageSelectionSyntaxHintProps) => {
   const [syntaxError, setSyntaxError] = useState<string | null>(null);
   const { t } = useTranslation();
 
   useEffect(() => {
-    const text = (input || '').trim();
+    const text = (input || "").trim();
     if (!text) {
       setSyntaxError(null);
       return;
     }
 
     try {
-      const { warning } = parseSelectionWithDiagnostics(text, maxPages && maxPages > 0 ? maxPages : FALLBACK_MAX_PAGES);
-      setSyntaxError(warning ? t('bulkSelection.syntaxError', 'There is a syntax issue. See Page Selection tips for help.') : null);
+      const { warning } = parseSelectionWithDiagnostics(
+        text,
+        maxPages && maxPages > 0 ? maxPages : FALLBACK_MAX_PAGES,
+      );
+      setSyntaxError(
+        warning
+          ? t(
+              "bulkSelection.syntaxError",
+              "There is a syntax issue. See Page Selection tips for help.",
+            )
+          : null,
+      );
     } catch {
-      setSyntaxError(t('bulkSelection.syntaxError', 'There is a syntax issue. See Page Selection tips for help.'));
+      setSyntaxError(
+        t(
+          "bulkSelection.syntaxError",
+          "There is a syntax issue. See Page Selection tips for help.",
+        ),
+      );
     }
   }, [input, maxPages]);
 
   if (!syntaxError) return null;
 
   return (
-    <div className={variant === 'panel' ? classes.selectedList : classes.errorCompact}>
-      <Text size="xs" className={variant === 'panel' ? classes.errorText : classes.errorTextClamp}>{syntaxError}</Text>
+    <div
+      className={
+        variant === "panel" ? classes.selectedList : classes.errorCompact
+      }
+    >
+      <Text
+        size="xs"
+        className={
+          variant === "panel" ? classes.errorText : classes.errorTextClamp
+        }
+      >
+        {syntaxError}
+      </Text>
     </div>
   );
 };
 
 export default PageSelectionSyntaxHint;
-
-
diff --git a/frontend/src/core/components/shared/PrivateContent.tsx b/frontend/src/core/components/shared/PrivateContent.tsx
index 3ed11bfc6d..270fe544ad 100644
--- a/frontend/src/core/components/shared/PrivateContent.tsx
+++ b/frontend/src/core/components/shared/PrivateContent.tsx
@@ -1,4 +1,4 @@
-import React from 'react';
+import React from "react";
 
 interface PrivateContentProps extends React.HTMLAttributes<HTMLSpanElement> {
   children: React.ReactNode;
@@ -25,12 +25,12 @@ interface PrivateContentProps extends React.HTMLAttributes<HTMLSpanElement> {
  */
 export const PrivateContent: React.FC<PrivateContentProps> = ({
   children,
-  className = '',
+  className = "",
   style,
   ...props
 }) => {
-  const combinedClassName = `ph-no-capture${className ? ` ${className}` : ''}`;
-  const combinedStyle = { display: 'contents' as const, ...style };
+  const combinedClassName = `ph-no-capture${className ? ` ${className}` : ""}`;
+  const combinedStyle = { display: "contents" as const, ...style };
 
   return (
     <span className={combinedClassName} style={combinedStyle} {...props}>
diff --git a/frontend/src/core/components/shared/QuickAccessBar.tsx b/frontend/src/core/components/shared/QuickAccessBar.tsx
index 726ed19c43..16d0ff0964 100644
--- a/frontend/src/core/components/shared/QuickAccessBar.tsx
+++ b/frontend/src/core/components/shared/QuickAccessBar.tsx
@@ -1,49 +1,62 @@
-import React, { useState, useRef, forwardRef, useEffect, useMemo, useCallback } from "react";
-import { createPortal } from 'react-dom';
+import React, {
+  useState,
+  useRef,
+  forwardRef,
+  useEffect,
+  useMemo,
+  useCallback,
+} from "react";
+import { createPortal } from "react-dom";
 import { Stack, Divider, Menu, Indicator } from "@mantine/core";
-import { useTranslation } from 'react-i18next';
-import { useNavigate, useLocation } from 'react-router-dom';
-import LocalIcon from '@app/components/shared/LocalIcon';
-import SignPopout, { SIGN_REQUEST_WORKBENCH_TYPE, SESSION_DETAIL_WORKBENCH_TYPE } from '@app/components/shared/signing/SignPopout';
+import { useTranslation } from "react-i18next";
+import { useNavigate, useLocation } from "react-router-dom";
+import LocalIcon from "@app/components/shared/LocalIcon";
+import SignPopout, {
+  SIGN_REQUEST_WORKBENCH_TYPE,
+  SESSION_DETAIL_WORKBENCH_TYPE,
+} from "@app/components/shared/signing/SignPopout";
 import { useRainbowThemeContext } from "@app/components/shared/RainbowThemeProvider";
-import { useFilesModalContext } from '@app/contexts/FilesModalContext';
-import { useToolWorkflow } from '@app/contexts/ToolWorkflowContext';
-import { useFileSelection, useFileState } from '@app/contexts/file/fileHooks';
-import { useNavigationState, useNavigationActions } from '@app/contexts/NavigationContext';
-import { useSidebarNavigation } from '@app/hooks/useSidebarNavigation';
-import { handleUnlessSpecialClick } from '@app/utils/clickHandlers';
-import { ButtonConfig } from '@app/types/sidebar';
-import '@app/components/shared/quickAccessBar/QuickAccessBar.css';
-import { Tooltip } from '@app/components/shared/Tooltip';
-import AllToolsNavButton from '@app/components/shared/AllToolsNavButton';
+import { useFilesModalContext } from "@app/contexts/FilesModalContext";
+import { useToolWorkflow } from "@app/contexts/ToolWorkflowContext";
+import { useFileSelection, useFileState } from "@app/contexts/file/fileHooks";
+import {
+  useNavigationState,
+  useNavigationActions,
+} from "@app/contexts/NavigationContext";
+import { useSidebarNavigation } from "@app/hooks/useSidebarNavigation";
+import { handleUnlessSpecialClick } from "@app/utils/clickHandlers";
+import { ButtonConfig } from "@app/types/sidebar";
+import "@app/components/shared/quickAccessBar/QuickAccessBar.css";
+import { Tooltip } from "@app/components/shared/Tooltip";
+import AllToolsNavButton from "@app/components/shared/AllToolsNavButton";
 import ActiveToolButton from "@app/components/shared/quickAccessBar/ActiveToolButton";
-import AppConfigModal from '@app/components/shared/AppConfigModal';
-import { useAppConfig } from '@app/contexts/AppConfigContext';
-import { useGroupSigningEnabled } from '@app/hooks/useGroupSigningEnabled';
-import { useSharingEnabled } from '@app/hooks/useSharingEnabled';
+import AppConfigModal from "@app/components/shared/AppConfigModal";
+import { useAppConfig } from "@app/contexts/AppConfigContext";
+import { useGroupSigningEnabled } from "@app/hooks/useGroupSigningEnabled";
+import { useSharingEnabled } from "@app/hooks/useSharingEnabled";
 import { useLicenseAlert } from "@app/hooks/useLicenseAlert";
-import { requestStartTour } from '@app/constants/events';
-import QuickAccessButton from '@app/components/shared/quickAccessBar/QuickAccessButton';
-import { useToursTooltip } from '@app/components/shared/quickAccessBar/useToursTooltip';
-import ShareManagementModal from '@app/components/shared/ShareManagementModal';
-import apiClient from '@app/services/apiClient';
-import { absoluteWithBasePath } from '@app/constants/app';
-import { alert } from '@app/components/toast';
-import { uploadHistoryChain } from '@app/services/serverStorageUpload';
-import { fileStorage } from '@app/services/fileStorage';
-import { useFileActions } from '@app/contexts/FileContext';
-import type { FileId } from '@app/types/file';
-import type { StirlingFileStub } from '@app/types/fileContext';
-import type { SignRequestSummary } from '@app/types/signingSession';
+import { requestStartTour } from "@app/constants/events";
+import QuickAccessButton from "@app/components/shared/quickAccessBar/QuickAccessButton";
+import { useToursTooltip } from "@app/components/shared/quickAccessBar/useToursTooltip";
+import ShareManagementModal from "@app/components/shared/ShareManagementModal";
+import apiClient from "@app/services/apiClient";
+import { absoluteWithBasePath } from "@app/constants/app";
+import { alert } from "@app/components/toast";
+import { uploadHistoryChain } from "@app/services/serverStorageUpload";
+import { fileStorage } from "@app/services/fileStorage";
+import { useFileActions } from "@app/contexts/FileContext";
+import type { FileId } from "@app/types/file";
+import type { StirlingFileStub } from "@app/types/fileContext";
+import type { SignRequestSummary } from "@app/types/signingSession";
 
 import {
   isNavButtonActive,
   getNavButtonStyle,
   getActiveNavButton,
-} from '@app/components/shared/quickAccessBar/QuickAccessBar';
-import { Z_INDEX_OVER_FULLSCREEN_SURFACE } from '@app/styles/zIndex';
-import { QuickAccessBarFooterExtensions } from '@app/components/quickAccessBar/QuickAccessBarFooterExtensions';
-import { useConfigButtonIcon } from '@app/hooks/useConfigButtonIcon';
+} from "@app/components/shared/quickAccessBar/QuickAccessBar";
+import { Z_INDEX_OVER_FULLSCREEN_SURFACE } from "@app/styles/zIndex";
+import { QuickAccessBarFooterExtensions } from "@app/components/quickAccessBar/QuickAccessBarFooterExtensions";
+import { useConfigButtonIcon } from "@app/hooks/useConfigButtonIcon";
 
 const QuickAccessBar = forwardRef<HTMLDivElement>((_, ref) => {
   const { t } = useTranslation();
@@ -59,34 +72,45 @@ const QuickAccessBar = forwardRef<HTMLDivElement>((_, ref) => {
     toolRegistry,
     readerMode,
     resetTool,
-    toolAvailability
+    toolAvailability,
   } = useToolWorkflow();
   const { selectedFiles, selectedFileIds } = useFileSelection();
   const { state, selectors } = useFileState();
   const { actions } = useFileActions();
-  const { hasUnsavedChanges, workbench: currentWorkbench } = useNavigationState();
+  const { hasUnsavedChanges, workbench: currentWorkbench } =
+    useNavigationState();
   const { actions: navigationActions } = useNavigationActions();
   const { getToolNavigation } = useSidebarNavigation();
   const { config } = useAppConfig();
   const licenseAlert = useLicenseAlert();
   const [configModalOpen, setConfigModalOpen] = useState(false);
-  const [activeButton, setActiveButton] = useState<string>('tools');
+  const [activeButton, setActiveButton] = useState<string>("tools");
   const [accessMenuOpen, setAccessMenuOpen] = useState(false);
   const [accessInviteOpen, setAccessInviteOpen] = useState(false);
-  const [selectedAccessFileId, setSelectedAccessFileId] = useState<string | null>(null);
+  const [selectedAccessFileId, setSelectedAccessFileId] = useState<
+    string | null
+  >(null);
   const [shareManageOpen, setShareManageOpen] = useState(false);
   const scrollableRef = useRef<HTMLDivElement>(null);
   const accessButtonRef = useRef<HTMLDivElement>(null);
   const accessPopoverRef = useRef<HTMLDivElement>(null);
-  const [accessPopoverPosition, setAccessPopoverPosition] = useState({ top: 160, left: 84 });
+  const [accessPopoverPosition, setAccessPopoverPosition] = useState({
+    top: 160,
+    left: 84,
+  });
   const { sharingEnabled, shareLinksEnabled } = useSharingEnabled();
   const groupSigningEnabled = useGroupSigningEnabled();
   const isSignWorkbenchActive =
     currentWorkbench === SIGN_REQUEST_WORKBENCH_TYPE ||
     currentWorkbench === SESSION_DETAIL_WORKBENCH_TYPE;
-  const [inviteRows, setInviteRows] = useState<Array<{ id: number; email: string; role: 'editor' | 'commenter' | 'viewer'; error?: string }>>([
-    { id: Date.now(), email: '', role: 'editor' },
-  ]);
+  const [inviteRows, setInviteRows] = useState<
+    Array<{
+      id: number;
+      email: string;
+      role: "editor" | "commenter" | "viewer";
+      error?: string;
+    }>
+  >([{ id: Date.now(), email: "", role: "editor" }]);
   const [isInviting, setIsInviting] = useState(false);
 
   // Sign button state
@@ -99,12 +123,16 @@ const QuickAccessBar = forwardRef<HTMLDivElement>((_, ref) => {
     if (!groupSigningEnabled) return;
     const fetchCount = async () => {
       try {
-        const response = await apiClient.get<SignRequestSummary[]>('/api/v1/security/cert-sign/sign-requests');
+        const response = await apiClient.get<SignRequestSummary[]>(
+          "/api/v1/security/cert-sign/sign-requests",
+        );
         const pending = response.data.filter(
-          r => r.myStatus !== 'SIGNED' && r.myStatus !== 'DECLINED'
+          (r) => r.myStatus !== "SIGNED" && r.myStatus !== "DECLINED",
         ).length;
         setPendingSignCount(pending);
-      } catch { /* silent — avoid noisy background error toasts */ }
+      } catch {
+        /* silent — avoid noisy background error toasts */
+      }
     };
     fetchCount();
     const interval = setInterval(fetchCount, 60000);
@@ -116,12 +144,16 @@ const QuickAccessBar = forwardRef<HTMLDivElement>((_, ref) => {
     if (!signMenuOpen && groupSigningEnabled) {
       const timeout = setTimeout(async () => {
         try {
-          const response = await apiClient.get<SignRequestSummary[]>('/api/v1/security/cert-sign/sign-requests');
+          const response = await apiClient.get<SignRequestSummary[]>(
+            "/api/v1/security/cert-sign/sign-requests",
+          );
           const pending = response.data.filter(
-            r => r.myStatus !== 'SIGNED' && r.myStatus !== 'DECLINED'
+            (r) => r.myStatus !== "SIGNED" && r.myStatus !== "DECLINED",
           ).length;
           setPendingSignCount(pending);
-        } catch { /* silent */ }
+        } catch {
+          /* silent */
+        }
       }, 500);
       return () => clearTimeout(timeout);
     }
@@ -138,14 +170,19 @@ const QuickAccessBar = forwardRef<HTMLDivElement>((_, ref) => {
     handleTooltipOpenChange,
   } = useToursTooltip();
 
-  const isRTL = typeof document !== 'undefined' && document.documentElement.dir === 'rtl';
+  const isRTL =
+    typeof document !== "undefined" && document.documentElement.dir === "rtl";
   const hasSelectedFiles = selectedFiles.length > 0;
   const selectedFileStubs = useMemo(
-    () => selectedFileIds.map((id) => selectors.getStirlingFileStub(id)).filter((x): x is StirlingFileStub => Boolean(x)),
-    [selectedFileIds, selectors, state.files.byId]
+    () =>
+      selectedFileIds
+        .map((id) => selectors.getStirlingFileStub(id))
+        .filter((x): x is StirlingFileStub => Boolean(x)),
+    [selectedFileIds, selectors, state.files.byId],
   );
   const selectedAccessFileStub =
-    selectedFileStubs.find((file) => file.id === selectedAccessFileId) || selectedFileStubs[0];
+    selectedFileStubs.find((file) => file.id === selectedAccessFileId) ||
+    selectedFileStubs[0];
   useEffect(() => {
     if (!hasSelectedFiles) {
       setAccessMenuOpen(false);
@@ -153,13 +190,16 @@ const QuickAccessBar = forwardRef<HTMLDivElement>((_, ref) => {
       setAccessInviteOpen(false);
       return;
     }
-    if (!selectedAccessFileId || !selectedFiles.some((file) => file.fileId === selectedAccessFileId)) {
+    if (
+      !selectedAccessFileId ||
+      !selectedFiles.some((file) => file.fileId === selectedAccessFileId)
+    ) {
       setSelectedAccessFileId(selectedFiles[0]?.fileId ?? null);
     }
   }, [hasSelectedFiles, selectedAccessFileId, selectedFiles]);
 
   const resetInviteRows = useCallback(() => {
-    setInviteRows([{ id: Date.now(), email: '', role: 'editor' }]);
+    setInviteRows([{ id: Date.now(), email: "", role: "editor" }]);
   }, []);
 
   useEffect(() => {
@@ -176,11 +216,11 @@ const QuickAccessBar = forwardRef<HTMLDivElement>((_, ref) => {
       setAccessPopoverPosition({ top, left });
     };
     updatePosition();
-    window.addEventListener('resize', updatePosition);
-    window.addEventListener('scroll', updatePosition, true);
+    window.addEventListener("resize", updatePosition);
+    window.addEventListener("scroll", updatePosition, true);
     return () => {
-      window.removeEventListener('resize', updatePosition);
-      window.removeEventListener('scroll', updatePosition, true);
+      window.removeEventListener("resize", updatePosition);
+      window.removeEventListener("scroll", updatePosition, true);
     };
   }, [accessMenuOpen, isRTL, resetInviteRows]);
 
@@ -192,77 +232,85 @@ const QuickAccessBar = forwardRef<HTMLDivElement>((_, ref) => {
       if (accessButtonRef.current?.contains(target)) return;
 
       // Check if click is inside a Mantine dropdown
-      const mantineDropdown = (target as Element).closest?.('.mantine-Combobox-dropdown, .mantine-Popover-dropdown');
+      const mantineDropdown = (target as Element).closest?.(
+        ".mantine-Combobox-dropdown, .mantine-Popover-dropdown",
+      );
       if (mantineDropdown) return;
 
       setAccessMenuOpen(false);
     };
     const handleEscape = (event: KeyboardEvent) => {
-      if (event.key === 'Escape') {
+      if (event.key === "Escape") {
         setAccessMenuOpen(false);
       }
     };
-    document.addEventListener('mousedown', handleOutside);
-    document.addEventListener('keydown', handleEscape);
+    document.addEventListener("mousedown", handleOutside);
+    document.addEventListener("keydown", handleEscape);
     return () => {
-      document.removeEventListener('mousedown', handleOutside);
-      document.removeEventListener('keydown', handleEscape);
+      document.removeEventListener("mousedown", handleOutside);
+      document.removeEventListener("keydown", handleEscape);
     };
   }, [accessMenuOpen]);
 
   const shareBaseUrl = useMemo(() => {
-    const frontendUrl = (config?.frontendUrl || '').trim();
+    const frontendUrl = (config?.frontendUrl || "").trim();
     if (frontendUrl) {
       try {
         const parsed = new URL(frontendUrl);
-        if (parsed.protocol === 'http:' || parsed.protocol === 'https:') {
-          const normalized = frontendUrl.endsWith('/') ? frontendUrl.slice(0, -1) : frontendUrl;
+        if (parsed.protocol === "http:" || parsed.protocol === "https:") {
+          const normalized = frontendUrl.endsWith("/")
+            ? frontendUrl.slice(0, -1)
+            : frontendUrl;
           return `${normalized}/share/`;
         }
       } catch {
         // invalid URL — fall through to default
       }
     }
-    return absoluteWithBasePath('/share/');
+    return absoluteWithBasePath("/share/");
   }, [config?.frontendUrl]);
 
-  const ensureStoredFile = useCallback(async (fileStub: StirlingFileStub): Promise<number> => {
-    const localUpdatedAt = fileStub.createdAt ?? fileStub.lastModified ?? 0;
-    const isUpToDate =
-      Boolean(fileStub.remoteStorageId) &&
-      Boolean(fileStub.remoteStorageUpdatedAt) &&
-      (fileStub.remoteStorageUpdatedAt as number) >= localUpdatedAt;
-    if (isUpToDate && fileStub.remoteStorageId) {
-      return fileStub.remoteStorageId as number;
-    }
-    const originalFileId = (fileStub.originalFileId || fileStub.id) as FileId;
-    const remoteId = fileStub.remoteStorageId as number | undefined;
-    const { remoteId: storedId, updatedAt, chain } = await uploadHistoryChain(
-      originalFileId,
-      remoteId
-    );
-    for (const stub of chain) {
-      actions.updateStirlingFileStub(stub.id, {
-        remoteStorageId: storedId,
-        remoteStorageUpdatedAt: updatedAt,
-        remoteOwnedByCurrentUser: true,
-        remoteSharedViaLink: false,
-      });
-      await fileStorage.updateFileMetadata(stub.id, {
-        remoteStorageId: storedId,
-        remoteStorageUpdatedAt: updatedAt,
-        remoteOwnedByCurrentUser: true,
-        remoteSharedViaLink: false,
-      });
-    }
-    return storedId;
-  }, [actions]);
+  const ensureStoredFile = useCallback(
+    async (fileStub: StirlingFileStub): Promise<number> => {
+      const localUpdatedAt = fileStub.createdAt ?? fileStub.lastModified ?? 0;
+      const isUpToDate =
+        Boolean(fileStub.remoteStorageId) &&
+        Boolean(fileStub.remoteStorageUpdatedAt) &&
+        (fileStub.remoteStorageUpdatedAt as number) >= localUpdatedAt;
+      if (isUpToDate && fileStub.remoteStorageId) {
+        return fileStub.remoteStorageId as number;
+      }
+      const originalFileId = (fileStub.originalFileId || fileStub.id) as FileId;
+      const remoteId = fileStub.remoteStorageId as number | undefined;
+      const {
+        remoteId: storedId,
+        updatedAt,
+        chain,
+      } = await uploadHistoryChain(originalFileId, remoteId);
+      for (const stub of chain) {
+        actions.updateStirlingFileStub(stub.id, {
+          remoteStorageId: storedId,
+          remoteStorageUpdatedAt: updatedAt,
+          remoteOwnedByCurrentUser: true,
+          remoteSharedViaLink: false,
+        });
+        await fileStorage.updateFileMetadata(stub.id, {
+          remoteStorageId: storedId,
+          remoteStorageUpdatedAt: updatedAt,
+          remoteOwnedByCurrentUser: true,
+          remoteSharedViaLink: false,
+        });
+      }
+      return storedId;
+    },
+    [actions],
+  );
 
   const openShareManage = useCallback(async () => {
     if (!sharingEnabled) {
       alert({
-        alertType: 'warning',
-        title: t('storageShare.sharingDisabled', 'Sharing is disabled.'),
+        alertType: "warning",
+        title: t("storageShare.sharingDisabled", "Sharing is disabled."),
         expandable: false,
         durationMs: 2500,
       });
@@ -270,8 +318,11 @@ const QuickAccessBar = forwardRef<HTMLDivElement>((_, ref) => {
     }
     if (selectedFileStubs.length > 1) {
       alert({
-        alertType: 'warning',
-        title: t('storageShare.selectSingleFile', 'Select a single file to manage sharing.'),
+        alertType: "warning",
+        title: t(
+          "storageShare.selectSingleFile",
+          "Select a single file to manage sharing.",
+        ),
         expandable: false,
         durationMs: 2500,
       });
@@ -279,8 +330,11 @@ const QuickAccessBar = forwardRef<HTMLDivElement>((_, ref) => {
     }
     if (selectedAccessFileStub?.remoteOwnedByCurrentUser === false) {
       alert({
-        alertType: 'warning',
-        title: t('storageShare.ownerOnly', 'Only the owner can manage sharing.'),
+        alertType: "warning",
+        title: t(
+          "storageShare.ownerOnly",
+          "Only the owner can manage sharing.",
+        ),
         expandable: false,
         durationMs: 2500,
       });
@@ -293,45 +347,72 @@ const QuickAccessBar = forwardRef<HTMLDivElement>((_, ref) => {
       setAccessMenuOpen(false);
       setShareManageOpen(true);
     } catch (error) {
-      console.error('Failed to upload file for sharing:', error);
+      console.error("Failed to upload file for sharing:", error);
       alert({
-        alertType: 'warning',
-        title: t('storageUpload.failure', 'Upload failed. Please check your login and storage settings.'),
+        alertType: "warning",
+        title: t(
+          "storageUpload.failure",
+          "Upload failed. Please check your login and storage settings.",
+        ),
         expandable: false,
         durationMs: 3000,
       });
     }
-  }, [ensureStoredFile, selectedAccessFileStub, selectedFileStubs.length, sharingEnabled, t]);
+  }, [
+    ensureStoredFile,
+    selectedAccessFileStub,
+    selectedFileStubs.length,
+    sharingEnabled,
+    t,
+  ]);
 
   const handleInviteRowChange = useCallback(
-    (id: number, updates: Partial<{ email: string; role: 'editor' | 'commenter' | 'viewer'; error?: string }>) => {
+    (
+      id: number,
+      updates: Partial<{
+        email: string;
+        role: "editor" | "commenter" | "viewer";
+        error?: string;
+      }>,
+    ) => {
       setInviteRows((prev) =>
         prev.map((row) => {
           if (row.id !== id) return row;
-          const nextError = Object.prototype.hasOwnProperty.call(updates, 'error')
+          const nextError = Object.prototype.hasOwnProperty.call(
+            updates,
+            "error",
+          )
             ? updates.error
             : row.error;
           return { ...row, ...updates, error: nextError };
-        })
+        }),
       );
     },
-    []
+    [],
   );
 
   const handleAddInviteRow = useCallback(() => {
-    setInviteRows((prev) => [...prev, { id: Date.now(), email: '', role: 'editor' }]);
+    setInviteRows((prev) => [
+      ...prev,
+      { id: Date.now(), email: "", role: "editor" },
+    ]);
   }, []);
 
   const handleRemoveInviteRow = useCallback((id: number) => {
-    setInviteRows((prev) => (prev.length > 1 ? prev.filter((row) => row.id !== id) : prev));
+    setInviteRows((prev) =>
+      prev.length > 1 ? prev.filter((row) => row.id !== id) : prev,
+    );
   }, []);
 
   const handleSendInvites = useCallback(async () => {
     if (!selectedAccessFileStub) return;
     if (selectedAccessFileStub.remoteOwnedByCurrentUser === false) {
       alert({
-        alertType: 'warning',
-        title: t('storageShare.ownerOnly', 'Only the owner can manage sharing.'),
+        alertType: "warning",
+        title: t(
+          "storageShare.ownerOnly",
+          "Only the owner can manage sharing.",
+        ),
         expandable: false,
         durationMs: 2500,
       });
@@ -341,7 +422,10 @@ const QuickAccessBar = forwardRef<HTMLDivElement>((_, ref) => {
       const trimmed = row.email.trim();
       let error: string | undefined;
       if (!trimmed) {
-        error = t('storageShare.invalidUsername', 'Enter a valid username or email address.');
+        error = t(
+          "storageShare.invalidUsername",
+          "Enter a valid username or email address.",
+        );
       }
       return { ...row, email: trimmed, error };
     });
@@ -359,32 +443,41 @@ const QuickAccessBar = forwardRef<HTMLDivElement>((_, ref) => {
         });
       }
       alert({
-        alertType: 'success',
-        title: t('storageShare.userAdded', 'User added to shared list.'),
+        alertType: "success",
+        title: t("storageShare.userAdded", "User added to shared list."),
         expandable: false,
         durationMs: 2500,
       });
       setAccessInviteOpen(false);
       resetInviteRows();
     } catch (error) {
-      console.error('Failed to send invite:', error);
+      console.error("Failed to send invite:", error);
       alert({
-        alertType: 'warning',
-        title: t('storageShare.userAddFailed', 'Unable to share with that user.'),
+        alertType: "warning",
+        title: t(
+          "storageShare.userAddFailed",
+          "Unable to share with that user.",
+        ),
         expandable: false,
         durationMs: 3000,
       });
     } finally {
       setIsInviting(false);
     }
-  }, [ensureStoredFile, inviteRows, resetInviteRows, selectedAccessFileStub, t]);
+  }, [
+    ensureStoredFile,
+    inviteRows,
+    resetInviteRows,
+    selectedAccessFileStub,
+    t,
+  ]);
 
   const handleCopyShareLink = async () => {
     if (!selectedAccessFileStub) return;
     if (!shareLinksEnabled) {
       alert({
-        alertType: 'warning',
-        title: t('storageShare.linksDisabled', 'Share links are disabled.'),
+        alertType: "warning",
+        title: t("storageShare.linksDisabled", "Share links are disabled."),
         expandable: false,
         durationMs: 2500,
       });
@@ -392,8 +485,11 @@ const QuickAccessBar = forwardRef<HTMLDivElement>((_, ref) => {
     }
     if (selectedFileStubs.length > 1) {
       alert({
-        alertType: 'warning',
-        title: t('storageShare.selectSingleFile', 'Select a single file to copy a link.'),
+        alertType: "warning",
+        title: t(
+          "storageShare.selectSingleFile",
+          "Select a single file to copy a link.",
+        ),
         expandable: false,
         durationMs: 2500,
       });
@@ -401,8 +497,11 @@ const QuickAccessBar = forwardRef<HTMLDivElement>((_, ref) => {
     }
     if (selectedAccessFileStub?.remoteOwnedByCurrentUser === false) {
       alert({
-        alertType: 'warning',
-        title: t('storageShare.ownerOnly', 'Only the owner can manage sharing.'),
+        alertType: "warning",
+        title: t(
+          "storageShare.ownerOnly",
+          "Only the owner can manage sharing.",
+        ),
         expandable: false,
         durationMs: 2500,
       });
@@ -412,10 +511,13 @@ const QuickAccessBar = forwardRef<HTMLDivElement>((_, ref) => {
       try {
         await ensureStoredFile(selectedAccessFileStub);
       } catch (error) {
-        console.error('Failed to upload file for sharing:', error);
+        console.error("Failed to upload file for sharing:", error);
         alert({
-          alertType: 'warning',
-          title: t('storageUpload.failure', 'Upload failed. Please check your login and storage settings.'),
+          alertType: "warning",
+          title: t(
+            "storageUpload.failure",
+            "Upload failed. Please check your login and storage settings.",
+          ),
           expandable: false,
           durationMs: 3000,
         });
@@ -424,26 +526,37 @@ const QuickAccessBar = forwardRef<HTMLDivElement>((_, ref) => {
     }
     try {
       const storedId = await ensureStoredFile(selectedAccessFileStub);
-      const response = await apiClient.get<{ shareLinks?: Array<{ token?: string }> }>(
-        `/api/v1/storage/files/${storedId}`,
-        { suppressErrorToast: true }
-      );
+      const response = await apiClient.get<{
+        shareLinks?: Array<{ token?: string }>;
+      }>(`/api/v1/storage/files/${storedId}`, {
+        suppressErrorToast: true,
+      });
       const links = response.data?.shareLinks ?? [];
       let token = links[links.length - 1]?.token;
       if (!token) {
-        const shareResponse = await apiClient.post(`/api/v1/storage/files/${storedId}/shares/links`, {
-          accessRole: 'editor',
-        });
+        const shareResponse = await apiClient.post(
+          `/api/v1/storage/files/${storedId}/shares/links`,
+          {
+            accessRole: "editor",
+          },
+        );
         token = shareResponse.data?.token;
         if (token) {
-          actions.updateStirlingFileStub(selectedAccessFileStub.id, { remoteHasShareLinks: true });
-          await fileStorage.updateFileMetadata(selectedAccessFileStub.id, { remoteHasShareLinks: true });
+          actions.updateStirlingFileStub(selectedAccessFileStub.id, {
+            remoteHasShareLinks: true,
+          });
+          await fileStorage.updateFileMetadata(selectedAccessFileStub.id, {
+            remoteHasShareLinks: true,
+          });
         }
       }
       if (!token) {
         alert({
-          alertType: 'warning',
-          title: t('storageShare.failure', 'Unable to generate a share link. Please try again.'),
+          alertType: "warning",
+          title: t(
+            "storageShare.failure",
+            "Unable to generate a share link. Please try again.",
+          ),
           expandable: false,
           durationMs: 2500,
         });
@@ -451,26 +564,25 @@ const QuickAccessBar = forwardRef<HTMLDivElement>((_, ref) => {
       }
       await navigator.clipboard.writeText(`${shareBaseUrl}${token}`);
       alert({
-        alertType: 'success',
-        title: t('storageShare.copied', 'Link copied to clipboard'),
+        alertType: "success",
+        title: t("storageShare.copied", "Link copied to clipboard"),
         expandable: false,
         durationMs: 2000,
       });
     } catch (error) {
-      console.error('Failed to copy share link:', error);
+      console.error("Failed to copy share link:", error);
       alert({
-        alertType: 'warning',
-        title: t('storageShare.copyFailed', 'Copy failed'),
+        alertType: "warning",
+        title: t("storageShare.copyFailed", "Copy failed"),
         expandable: false,
         durationMs: 2500,
       });
     }
   };
 
-
   // Open modal if URL is at /settings/*
   useEffect(() => {
-    const isSettings = location.pathname.startsWith('/settings');
+    const isSettings = location.pathname.startsWith("/settings");
     setConfigModalOpen(isSettings);
   }, [location.pathname]);
 
@@ -484,13 +596,28 @@ const QuickAccessBar = forwardRef<HTMLDivElement>((_, ref) => {
   };
 
   // Helper function to render navigation buttons with URL support
-  const renderNavButton = (config: ButtonConfig, index: number, shouldGuardNavigation = false) => {
-    const isActive = !isSignWorkbenchActive && isNavButtonActive(config, activeButton, isFilesModalOpen, configModalOpen, selectedToolKey, leftPanelView);
+  const renderNavButton = (
+    config: ButtonConfig,
+    index: number,
+    shouldGuardNavigation = false,
+  ) => {
+    const isActive =
+      !isSignWorkbenchActive &&
+      isNavButtonActive(
+        config,
+        activeButton,
+        isFilesModalOpen,
+        configModalOpen,
+        selectedToolKey,
+        leftPanelView,
+      );
 
     // Check if this button has URL navigation support
-    const navProps = config.type === 'navigation' && (config.id === 'read' || config.id === 'automate')
-      ? getToolNavigation(config.id)
-      : null;
+    const navProps =
+      config.type === "navigation" &&
+      (config.id === "read" || config.id === "automate")
+        ? getToolNavigation(config.id)
+        : null;
 
     const handleClick = (e?: React.MouseEvent) => {
       // If there are unsaved changes and this button should guard navigation, show warning modal
@@ -509,14 +636,26 @@ const QuickAccessBar = forwardRef<HTMLDivElement>((_, ref) => {
     };
 
     const buttonStyle = isSignWorkbenchActive
-      ? { backgroundColor: 'var(--icon-inactive-bg)', color: 'var(--icon-inactive-color)', border: 'none', borderRadius: '0.5rem' }
-      : getNavButtonStyle(config, activeButton, isFilesModalOpen, configModalOpen, selectedToolKey, leftPanelView);
+      ? {
+          backgroundColor: "var(--icon-inactive-bg)",
+          color: "var(--icon-inactive-color)",
+          border: "none",
+          borderRadius: "0.5rem",
+        }
+      : getNavButtonStyle(
+          config,
+          activeButton,
+          isFilesModalOpen,
+          configModalOpen,
+          selectedToolKey,
+          leftPanelView,
+        );
 
     // Render navigation button with conditional URL support
     return (
       <div
         key={config.id}
-        style={{ marginTop: index === 0 ? '0.5rem' : "0rem" }}
+        style={{ marginTop: index === 0 ? "0.5rem" : "0rem" }}
       >
         <QuickAccessButton
           icon={config.icon}
@@ -527,7 +666,7 @@ const QuickAccessBar = forwardRef<HTMLDivElement>((_, ref) => {
           ariaLabel={config.name}
           backgroundColor={buttonStyle.backgroundColor}
           color={buttonStyle.color}
-          component={navProps ? 'a' : 'button'}
+          component={navProps ? "a" : "button"}
           dataTestId={`${config.id}-button`}
           dataTour={`${config.id}-button`}
         />
@@ -535,54 +674,81 @@ const QuickAccessBar = forwardRef<HTMLDivElement>((_, ref) => {
     );
   };
 
-  const mainButtons: ButtonConfig[] = useMemo(() => [
-    {
-      id: 'read',
-      name: t("quickAccess.reader", "Reader"),
-      icon: <LocalIcon icon="menu-book-rounded" width="1.25rem" height="1.25rem" />,
-      size: 'md' as const,
-      isRound: false,
-      type: 'navigation' as const,
-      onClick: () => {
-        setActiveButton('read');
-        handleReaderToggle();
-      }
-    },
-    {
-      id: 'automate',
-      name: t("quickAccess.automate", "Automate"),
-      icon: <LocalIcon icon="automation-outline" width="1.25rem" height="1.25rem" />,
-      size: 'md' as const,
-      isRound: false,
-      type: 'navigation' as const,
-      onClick: () => {
-        setActiveButton('automate');
-        // If already on automate tool, reset it directly
-        if (selectedToolKey === 'automate') {
-          resetTool('automate');
-        } else {
-          handleToolSelect('automate');
-        }
-      }
-    },
-  ].filter(button => {
-    // Filter out buttons for disabled tools
-    // 'read' is always available (viewer mode)
-    if (button.id === 'read') return true;
-    // Check if tool is actually available (not just present in registry)
-    const availability = toolAvailability[button.id as keyof typeof toolAvailability];
-    return availability?.available !== false;
-  }), [t, setActiveButton, handleReaderToggle, selectedToolKey, resetTool, handleToolSelect, toolAvailability]);
+  const mainButtons: ButtonConfig[] = useMemo(
+    () =>
+      [
+        {
+          id: "read",
+          name: t("quickAccess.reader", "Reader"),
+          icon: (
+            <LocalIcon
+              icon="menu-book-rounded"
+              width="1.25rem"
+              height="1.25rem"
+            />
+          ),
+          size: "md" as const,
+          isRound: false,
+          type: "navigation" as const,
+          onClick: () => {
+            setActiveButton("read");
+            handleReaderToggle();
+          },
+        },
+        {
+          id: "automate",
+          name: t("quickAccess.automate", "Automate"),
+          icon: (
+            <LocalIcon
+              icon="automation-outline"
+              width="1.25rem"
+              height="1.25rem"
+            />
+          ),
+          size: "md" as const,
+          isRound: false,
+          type: "navigation" as const,
+          onClick: () => {
+            setActiveButton("automate");
+            // If already on automate tool, reset it directly
+            if (selectedToolKey === "automate") {
+              resetTool("automate");
+            } else {
+              handleToolSelect("automate");
+            }
+          },
+        },
+      ].filter((button) => {
+        // Filter out buttons for disabled tools
+        // 'read' is always available (viewer mode)
+        if (button.id === "read") return true;
+        // Check if tool is actually available (not just present in registry)
+        const availability =
+          toolAvailability[button.id as keyof typeof toolAvailability];
+        return availability?.available !== false;
+      }),
+    [
+      t,
+      setActiveButton,
+      handleReaderToggle,
+      selectedToolKey,
+      resetTool,
+      handleToolSelect,
+      toolAvailability,
+    ],
+  );
 
   const middleButtons: ButtonConfig[] = [
     {
-      id: 'files',
+      id: "files",
       name: t("quickAccess.files", "Files"),
-      icon: <LocalIcon icon="folder-rounded" width="1.25rem" height="1.25rem" />,
+      icon: (
+        <LocalIcon icon="folder-rounded" width="1.25rem" height="1.25rem" />
+      ),
       isRound: true,
-      size: 'md',
-      type: 'modal',
-      onClick: handleFilesButtonClick
+      size: "md",
+      type: "modal",
+      onClick: handleFilesButtonClick,
     },
   ];
   //TODO: Activity
@@ -599,50 +765,64 @@ const QuickAccessBar = forwardRef<HTMLDivElement>((_, ref) => {
   // Determine if settings button should be hidden
   // Hide when login is disabled AND showSettingsWhenNoLogin is false
   const shouldHideSettingsButton =
-    config?.enableLogin === false &&
-    config?.showSettingsWhenNoLogin === false;
+    config?.enableLogin === false && config?.showSettingsWhenNoLogin === false;
 
   const bottomButtons: ButtonConfig[] = [
     {
-      id: 'help',
+      id: "help",
       name: t("quickAccess.tours", "Tours"),
-      icon: <LocalIcon icon="explore-rounded" width="1.25rem" height="1.25rem" />,
+      icon: (
+        <LocalIcon icon="explore-rounded" width="1.25rem" height="1.25rem" />
+      ),
       isRound: true,
-      size: 'md',
-      type: 'action',
+      size: "md",
+      type: "action",
       onClick: () => {
         // This will be overridden by the wrapper logic
       },
     },
-    ...(shouldHideSettingsButton ? [] : [{
-      id: 'config',
-      name: t("quickAccess.settings", "Settings"),
-      icon: configButtonIcon ?? <LocalIcon icon="settings-rounded" width="1.25rem" height="1.25rem" />,
-      size: 'md' as const,
-      type: 'modal' as const,
-      onClick: () => {
-        navigate('/settings/overview');
-        setConfigModalOpen(true);
-      }
-    } as ButtonConfig])
+    ...(shouldHideSettingsButton
+      ? []
+      : [
+          {
+            id: "config",
+            name: t("quickAccess.settings", "Settings"),
+            icon: configButtonIcon ?? (
+              <LocalIcon
+                icon="settings-rounded"
+                width="1.25rem"
+                height="1.25rem"
+              />
+            ),
+            size: "md" as const,
+            type: "modal" as const,
+            onClick: () => {
+              navigate("/settings/overview");
+              setConfigModalOpen(true);
+            },
+          } as ButtonConfig,
+        ]),
   ];
 
-
   return (
     <div
       ref={ref}
       data-sidebar="quick-access"
       data-tour="quick-access-bar"
-      className={`h-screen flex flex-col w-16 quick-access-bar-main ${isRainbowMode ? 'rainbow-mode' : ''}`}
+      className={`h-screen flex flex-col w-16 quick-access-bar-main ${isRainbowMode ? "rainbow-mode" : ""}`}
     >
       {/* Fixed header outside scrollable area */}
       <div className="quick-access-header">
-        <ActiveToolButton activeButton={activeButton} setActiveButton={setActiveButton} />
-        <AllToolsNavButton activeButton={activeButton} setActiveButton={setActiveButton} />
-
+        <ActiveToolButton
+          activeButton={activeButton}
+          setActiveButton={setActiveButton}
+        />
+        <AllToolsNavButton
+          activeButton={activeButton}
+          setActiveButton={setActiveButton}
+        />
       </div>
 
-
       {/* Scrollable content area */}
       <div
         ref={scrollableRef}
@@ -657,7 +837,11 @@ const QuickAccessBar = forwardRef<HTMLDivElement>((_, ref) => {
           <Stack gap="lg" align="stretch">
             {mainButtons.map((config, index) => (
               <React.Fragment key={config.id}>
-                {renderNavButton(config, index, config.id === 'read' || config.id === 'automate')}
+                {renderNavButton(
+                  config,
+                  index,
+                  config.id === "read" || config.id === "automate",
+                )}
               </React.Fragment>
             ))}
           </Stack>
@@ -665,10 +849,7 @@ const QuickAccessBar = forwardRef<HTMLDivElement>((_, ref) => {
           {/* Middle section */}
           {middleButtons.length > 0 && (
             <>
-              <Divider
-                size="xs"
-                className="content-divider"
-              />
+              <Divider size="xs" className="content-divider" />
               <Stack gap="lg" align="stretch">
                 {middleButtons.map((config, index) => (
                   <React.Fragment key={config.id}>
@@ -678,19 +859,28 @@ const QuickAccessBar = forwardRef<HTMLDivElement>((_, ref) => {
                 {hasSelectedFiles && sharingEnabled && (
                   <div ref={accessButtonRef}>
                     <QuickAccessButton
-                      icon={<LocalIcon icon="group-rounded" width="1.25rem" height="1.25rem" />}
-                      label={t('quickAccess.access', 'Access')}
+                      icon={
+                        <LocalIcon
+                          icon="group-rounded"
+                          width="1.25rem"
+                          height="1.25rem"
+                        />
+                      }
+                      label={t("quickAccess.access", "Access")}
                       isActive={!isSignWorkbenchActive && accessMenuOpen}
                       onClick={() => {
                         setAccessMenuOpen((prev) => !prev);
                       }}
-                      ariaLabel={t('quickAccess.access', 'Access')}
+                      ariaLabel={t("quickAccess.access", "Access")}
                       dataTestId="access-button"
                     />
                   </div>
                 )}
                 {groupSigningEnabled && (
-                  <div ref={signButtonRef} style={{ display: 'flex', justifyContent: 'center' }}>
+                  <div
+                    ref={signButtonRef}
+                    style={{ display: "flex", justifyContent: "center" }}
+                  >
                     {pendingSignCount > 0 ? (
                       <Indicator
                         inline
@@ -701,21 +891,33 @@ const QuickAccessBar = forwardRef<HTMLDivElement>((_, ref) => {
                         offset={4}
                       >
                         <QuickAccessButton
-                          icon={<LocalIcon icon="edit-square-rounded" width="1.15rem" height="1.15rem" />}
-                          label={t('quickAccess.sign', 'Sign')}
+                          icon={
+                            <LocalIcon
+                              icon="edit-square-rounded"
+                              width="1.15rem"
+                              height="1.15rem"
+                            />
+                          }
+                          label={t("quickAccess.sign", "Sign")}
                           isActive={signMenuOpen || isSignWorkbenchActive}
                           onClick={() => setSignMenuOpen((prev) => !prev)}
-                          ariaLabel={t('quickAccess.sign', 'Sign')}
+                          ariaLabel={t("quickAccess.sign", "Sign")}
                           dataTestId="sign-button"
                         />
                       </Indicator>
                     ) : (
                       <QuickAccessButton
-                        icon={<LocalIcon icon="edit-square-rounded" width="1.15rem" height="1.15rem" />}
-                        label={t('quickAccess.sign', 'Sign')}
+                        icon={
+                          <LocalIcon
+                            icon="edit-square-rounded"
+                            width="1.15rem"
+                            height="1.15rem"
+                          />
+                        }
+                        label={t("quickAccess.sign", "Sign")}
                         isActive={signMenuOpen || isSignWorkbenchActive}
                         onClick={() => setSignMenuOpen((prev) => !prev)}
-                        ariaLabel={t('quickAccess.sign', 'Sign')}
+                        ariaLabel={t("quickAccess.sign", "Sign")}
                         dataTestId="sign-button"
                       />
                     )}
@@ -734,39 +936,82 @@ const QuickAccessBar = forwardRef<HTMLDivElement>((_, ref) => {
           <Stack gap="lg" align="stretch">
             {bottomButtons.map((buttonConfig, index) => {
               // Handle help button with menu or direct action
-              if (buttonConfig.id === 'help') {
+              if (buttonConfig.id === "help") {
                 const isAdmin = config?.isAdmin === true;
                 const toursTooltipContent = isAdmin
-                  ? t('quickAccess.toursTooltip.admin', 'Watch walkthroughs here: Tools tour, New V2 layout tour, and the Admin tour.')
-                  : t('quickAccess.toursTooltip.user', 'Watch walkthroughs here: Tools tour and the New V2 layout tour.');
+                  ? t(
+                      "quickAccess.toursTooltip.admin",
+                      "Watch walkthroughs here: Tools tour, New V2 layout tour, and the Admin tour.",
+                    )
+                  : t(
+                      "quickAccess.toursTooltip.user",
+                      "Watch walkthroughs here: Tools tour and the New V2 layout tour.",
+                    );
                 const tourItems = [
                   {
-                    key: 'whatsnew',
-                    icon: <LocalIcon icon="auto-awesome-rounded" width="1.25rem" height="1.25rem" />,
-                    title: t("quickAccess.helpMenu.whatsNewTour", "See what's new in V2"),
-                    description: t("quickAccess.helpMenu.whatsNewTourDesc", "Tour the updated layout"),
-                    onClick: () => requestStartTour('whatsnew'),
+                    key: "whatsnew",
+                    icon: (
+                      <LocalIcon
+                        icon="auto-awesome-rounded"
+                        width="1.25rem"
+                        height="1.25rem"
+                      />
+                    ),
+                    title: t(
+                      "quickAccess.helpMenu.whatsNewTour",
+                      "See what's new in V2",
+                    ),
+                    description: t(
+                      "quickAccess.helpMenu.whatsNewTourDesc",
+                      "Tour the updated layout",
+                    ),
+                    onClick: () => requestStartTour("whatsnew"),
                   },
                   {
-                    key: 'tools',
-                    icon: <LocalIcon icon="view-carousel-rounded" width="1.25rem" height="1.25rem" />,
+                    key: "tools",
+                    icon: (
+                      <LocalIcon
+                        icon="view-carousel-rounded"
+                        width="1.25rem"
+                        height="1.25rem"
+                      />
+                    ),
                     title: t("quickAccess.helpMenu.toolsTour", "Tools Tour"),
-                    description: t("quickAccess.helpMenu.toolsTourDesc", "Learn what the tools can do"),
-                    onClick: () => requestStartTour('tools'),
+                    description: t(
+                      "quickAccess.helpMenu.toolsTourDesc",
+                      "Learn what the tools can do",
+                    ),
+                    onClick: () => requestStartTour("tools"),
                   },
-                  ...(isAdmin ? [{
-                    key: 'admin',
-                    icon: <LocalIcon icon="admin-panel-settings-rounded" width="1.25rem" height="1.25rem" />,
-                    title: t("quickAccess.helpMenu.adminTour", "Admin Tour"),
-                    description: t("quickAccess.helpMenu.adminTourDesc", "Explore admin settings & features"),
-                    onClick: () => requestStartTour('admin'),
-                  }] : []),
+                  ...(isAdmin
+                    ? [
+                        {
+                          key: "admin",
+                          icon: (
+                            <LocalIcon
+                              icon="admin-panel-settings-rounded"
+                              width="1.25rem"
+                              height="1.25rem"
+                            />
+                          ),
+                          title: t(
+                            "quickAccess.helpMenu.adminTour",
+                            "Admin Tour",
+                          ),
+                          description: t(
+                            "quickAccess.helpMenu.adminTourDesc",
+                            "Explore admin settings & features",
+                          ),
+                          onClick: () => requestStartTour("admin"),
+                        },
+                      ]
+                    : []),
                 ];
 
                 const helpButtonNode = (
                   <div data-tour="help-button">
                     <Menu
-                      position={isRTL ? 'left' : 'right'}
+                      position={isRTL ? "left" : "right"}
                       offset={10}
                       zIndex={Z_INDEX_OVER_FULLSCREEN_SURFACE}
                       opened={toursMenuOpen}
@@ -786,7 +1031,9 @@ const QuickAccessBar = forwardRef<HTMLDivElement>((_, ref) => {
                               <div style={{ fontWeight: 500 }}>
                                 {item.title}
                               </div>
-                              <div style={{ fontSize: '0.875rem', opacity: 0.7 }}>
+                              <div
+                                style={{ fontSize: "0.875rem", opacity: 0.7 }}
+                              >
                                 {item.description}
                               </div>
                             </div>
@@ -819,9 +1066,9 @@ const QuickAccessBar = forwardRef<HTMLDivElement>((_, ref) => {
 
               const buttonNode = renderNavButton(buttonConfig, index);
               const shouldShowSettingsBadge =
-                buttonConfig.id === 'config' &&
+                buttonConfig.id === "config" &&
                 licenseAlert.active &&
-                licenseAlert.audience === 'admin';
+                licenseAlert.audience === "admin";
 
               return (
                 <React.Fragment key={buttonConfig.id}>
@@ -857,239 +1104,310 @@ const QuickAccessBar = forwardRef<HTMLDivElement>((_, ref) => {
           file={selectedAccessFileStub}
         />
       )}
-      {hasSelectedFiles && typeof document !== 'undefined' && createPortal(
-        <div
-          ref={accessPopoverRef}
-          className={`quick-access-popout ${accessMenuOpen ? 'is-open' : ''}`}
-          style={{
-            top: `${accessPopoverPosition.top}px`,
-            left: `${accessPopoverPosition.left}px`,
-            zIndex: Z_INDEX_OVER_FULLSCREEN_SURFACE,
-          }}
-          role="dialog"
-          aria-label={t('quickAccess.accessPanel', 'Document access')}
-        >
-          <div className="quick-access-popout__card">
-            <div className="quick-access-popout__header">
-              <button
-                type="button"
-                className={`quick-access-popout__back ${accessInviteOpen ? 'is-visible' : ''}`}
-                onClick={() => setAccessInviteOpen(false)}
-                aria-label={t('quickAccess.accessBack', 'Back')}
-              >
-                <LocalIcon icon="arrow-back-rounded" width="1rem" height="1rem" />
-              </button>
-              <div className="quick-access-popout__title">
-                {accessInviteOpen
-                  ? t('quickAccess.accessInviteTitle', 'Invite People')
-                  : t('quickAccess.accessTitle', 'Document Access')}
-              </div>
-              <div className="quick-access-popout__header-actions">
-                {!accessInviteOpen && (
+      {hasSelectedFiles &&
+        typeof document !== "undefined" &&
+        createPortal(
+          <div
+            ref={accessPopoverRef}
+            className={`quick-access-popout ${accessMenuOpen ? "is-open" : ""}`}
+            style={{
+              top: `${accessPopoverPosition.top}px`,
+              left: `${accessPopoverPosition.left}px`,
+              zIndex: Z_INDEX_OVER_FULLSCREEN_SURFACE,
+            }}
+            role="dialog"
+            aria-label={t("quickAccess.accessPanel", "Document access")}
+          >
+            <div className="quick-access-popout__card">
+              <div className="quick-access-popout__header">
+                <button
+                  type="button"
+                  className={`quick-access-popout__back ${accessInviteOpen ? "is-visible" : ""}`}
+                  onClick={() => setAccessInviteOpen(false)}
+                  aria-label={t("quickAccess.accessBack", "Back")}
+                >
+                  <LocalIcon
+                    icon="arrow-back-rounded"
+                    width="1rem"
+                    height="1rem"
+                  />
+                </button>
+                <div className="quick-access-popout__title">
+                  {accessInviteOpen
+                    ? t("quickAccess.accessInviteTitle", "Invite People")
+                    : t("quickAccess.accessTitle", "Document Access")}
+                </div>
+                <div className="quick-access-popout__header-actions">
+                  {!accessInviteOpen && (
+                    <button
+                      type="button"
+                      className="quick-access-popout__header-action"
+                      onClick={() => {
+                        void openShareManage();
+                      }}
+                      aria-label={t("storageShare.manage", "Manage sharing")}
+                    >
+                      <LocalIcon
+                        icon="settings-rounded"
+                        width="1rem"
+                        height="1rem"
+                      />
+                    </button>
+                  )}
                   <button
                     type="button"
                     className="quick-access-popout__header-action"
-                    onClick={() => {
-                      void openShareManage();
-                    }}
-                    aria-label={t('storageShare.manage', 'Manage sharing')}
+                    onClick={() => setAccessMenuOpen(false)}
+                    aria-label={t("close", "Close")}
                   >
-                    <LocalIcon icon="settings-rounded" width="1rem" height="1rem" />
+                    <LocalIcon
+                      icon="close-rounded"
+                      width="1rem"
+                      height="1rem"
+                    />
                   </button>
-                )}
-                <button
-                  type="button"
-                  className="quick-access-popout__header-action"
-                  onClick={() => setAccessMenuOpen(false)}
-                  aria-label={t('close', 'Close')}
-                >
-                  <LocalIcon icon="close-rounded" width="1rem" height="1rem" />
-                </button>
-              </div>
-            </div>
-
-            <div className={`quick-access-popout__body ${accessInviteOpen ? 'is-invite' : ''}`}>
-              <div className="quick-access-popout__panel">
-                <div className="quick-access-popout__section">
-                  <div className="quick-access-popout__label">
-                    {t('quickAccess.accessFileLabel', 'File')}
-                  </div>
-                  <select
-                    className="quick-access-popout__select"
-                    value={selectedAccessFileStub?.id ?? ''}
-                    onChange={(event) => setSelectedAccessFileId(event.target.value)}
-                  >
-                    {selectedFileStubs.map((file) => (
-                      <option key={file.id} value={file.id}>
-                        {file.name}
-                      </option>
-                    ))}
-                  </select>
-                </div>
-
-                <div className="quick-access-popout__divider" />
-
-                <div className="quick-access-popout__section">
-                  <div className="quick-access-popout__label">
-                    {t('quickAccess.accessGeneral', 'General Access')}
-                  </div>
-                  <div className="quick-access-popout__row">
-                    <div className="quick-access-popout__icon-bubble">
-                      <LocalIcon icon="lock-outline" width="1rem" height="1rem" />
-                    </div>
-                    <div className="quick-access-popout__row-text">
-                      <div className="quick-access-popout__row-title">
-                        {t('quickAccess.accessRestricted', 'Restricted')}
-                      </div>
-                      <div className="quick-access-popout__row-subtitle">
-                        {t('quickAccess.accessRestrictedHint', 'Only people with access can open')}
-                      </div>
-                    </div>
-                  </div>
-                </div>
-
-                <div className="quick-access-popout__divider" />
-
-                <div className="quick-access-popout__section">
-                  <div className="quick-access-popout__label">
-                    {t('quickAccess.accessPeople', 'People with access')}
-                  </div>
-                  <div className="quick-access-popout__person">
-                    <div className="quick-access-popout__avatar">
-                      {(selectedAccessFileStub?.remoteOwnerUsername || 'You').slice(0, 2).toUpperCase()}
-                    </div>
-                    <div className="quick-access-popout__person-text">
-                      <div className="quick-access-popout__row-title">
-                        {selectedAccessFileStub?.remoteOwnerUsername || t('quickAccess.accessYou', 'You')}
-                      </div>
-                      <div className="quick-access-popout__row-subtitle">
-                        {selectedAccessFileStub?.name ?? t('quickAccess.accessSelectedFile', 'Selected file')}
-                      </div>
-                    </div>
-                    <span className="quick-access-popout__pill">
-                      {t('quickAccess.accessOwner', 'Owner')}
-                    </span>
-                  </div>
                 </div>
               </div>
 
-              <div className="quick-access-popout__panel quick-access-popout__panel--invite">
-                <div className="quick-access-popout__section">
-                  <div className="quick-access-popout__label">
-                    {t('quickAccess.accessInviteTitle', 'Invite People')}
-                  </div>
-                </div>
-                {inviteRows.map((row) => (
-                  <div key={row.id} className="quick-access-popout__invite-row">
-                    <div className="quick-access-popout__input-group">
-                      <label className="quick-access-popout__label">
-                        {t('quickAccess.accessEmail', 'Email Address')}
-                      </label>
-                      <input
-                        className={`quick-access-popout__input ${row.error ? 'has-error' : ''}`}
-                        placeholder={t('quickAccess.accessEmailPlaceholder', 'name@company.com')}
-                        value={row.email}
-                        onChange={(event) =>
-                          handleInviteRowChange(row.id, { email: event.target.value, error: undefined })
-                        }
-                      />
-                      {row.error && (
-                        <div className="quick-access-popout__input-error">{row.error}</div>
-                      )}
+              <div
+                className={`quick-access-popout__body ${accessInviteOpen ? "is-invite" : ""}`}
+              >
+                <div className="quick-access-popout__panel">
+                  <div className="quick-access-popout__section">
+                    <div className="quick-access-popout__label">
+                      {t("quickAccess.accessFileLabel", "File")}
                     </div>
-                    <div className="quick-access-popout__input-group">
-                      <label className="quick-access-popout__label">
-                        {t('quickAccess.accessRole', 'Role')}
-                      </label>
-                      <select
-                        className="quick-access-popout__select"
-                        value={row.role}
-                        onChange={(event) =>
-                          handleInviteRowChange(row.id, {
-                            role: event.target.value as 'editor' | 'commenter' | 'viewer',
-                          })
-                        }
-                      >
-                        <option value="editor">{t('quickAccess.accessRoleEditor', 'Editor')}</option>
-                        <option value="commenter">{t('quickAccess.accessRoleCommenter', 'Commenter')}</option>
-                        <option value="viewer">{t('quickAccess.accessRoleViewer', 'Viewer')}</option>
-                      </select>
-                    </div>
-                    <button
-                      type="button"
-                      className="quick-access-popout__remove"
-                      onClick={() => handleRemoveInviteRow(row.id)}
-                      disabled={inviteRows.length === 1}
-                      aria-label={t('quickAccess.accessRemove', 'Remove')}
+                    <select
+                      className="quick-access-popout__select"
+                      value={selectedAccessFileStub?.id ?? ""}
+                      onChange={(event) =>
+                        setSelectedAccessFileId(event.target.value)
+                      }
                     >
-                      <LocalIcon icon="close-rounded" width="0.9rem" height="0.9rem" />
-                    </button>
+                      {selectedFileStubs.map((file) => (
+                        <option key={file.id} value={file.id}>
+                          {file.name}
+                        </option>
+                      ))}
+                    </select>
                   </div>
-                ))}
-                <button
-                  type="button"
-                  className="quick-access-popout__add"
-                  onClick={handleAddInviteRow}
-                >
-                  <span className="quick-access-popout__add-icon">+</span>
-                  {t('quickAccess.accessAddPerson', 'Add another person')}
-                </button>
-              </div>
 
-            </div>
+                  <div className="quick-access-popout__divider" />
 
-            <div className="quick-access-popout__footer">
-              {accessInviteOpen ? (
-                <>
+                  <div className="quick-access-popout__section">
+                    <div className="quick-access-popout__label">
+                      {t("quickAccess.accessGeneral", "General Access")}
+                    </div>
+                    <div className="quick-access-popout__row">
+                      <div className="quick-access-popout__icon-bubble">
+                        <LocalIcon
+                          icon="lock-outline"
+                          width="1rem"
+                          height="1rem"
+                        />
+                      </div>
+                      <div className="quick-access-popout__row-text">
+                        <div className="quick-access-popout__row-title">
+                          {t("quickAccess.accessRestricted", "Restricted")}
+                        </div>
+                        <div className="quick-access-popout__row-subtitle">
+                          {t(
+                            "quickAccess.accessRestrictedHint",
+                            "Only people with access can open",
+                          )}
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+
+                  <div className="quick-access-popout__divider" />
+
+                  <div className="quick-access-popout__section">
+                    <div className="quick-access-popout__label">
+                      {t("quickAccess.accessPeople", "People with access")}
+                    </div>
+                    <div className="quick-access-popout__person">
+                      <div className="quick-access-popout__avatar">
+                        {(selectedAccessFileStub?.remoteOwnerUsername || "You")
+                          .slice(0, 2)
+                          .toUpperCase()}
+                      </div>
+                      <div className="quick-access-popout__person-text">
+                        <div className="quick-access-popout__row-title">
+                          {selectedAccessFileStub?.remoteOwnerUsername ||
+                            t("quickAccess.accessYou", "You")}
+                        </div>
+                        <div className="quick-access-popout__row-subtitle">
+                          {selectedAccessFileStub?.name ??
+                            t(
+                              "quickAccess.accessSelectedFile",
+                              "Selected file",
+                            )}
+                        </div>
+                      </div>
+                      <span className="quick-access-popout__pill">
+                        {t("quickAccess.accessOwner", "Owner")}
+                      </span>
+                    </div>
+                  </div>
+                </div>
+
+                <div className="quick-access-popout__panel quick-access-popout__panel--invite">
+                  <div className="quick-access-popout__section">
+                    <div className="quick-access-popout__label">
+                      {t("quickAccess.accessInviteTitle", "Invite People")}
+                    </div>
+                  </div>
+                  {inviteRows.map((row) => (
+                    <div
+                      key={row.id}
+                      className="quick-access-popout__invite-row"
+                    >
+                      <div className="quick-access-popout__input-group">
+                        <label className="quick-access-popout__label">
+                          {t("quickAccess.accessEmail", "Email Address")}
+                        </label>
+                        <input
+                          className={`quick-access-popout__input ${row.error ? "has-error" : ""}`}
+                          placeholder={t(
+                            "quickAccess.accessEmailPlaceholder",
+                            "name@company.com",
+                          )}
+                          value={row.email}
+                          onChange={(event) =>
+                            handleInviteRowChange(row.id, {
+                              email: event.target.value,
+                              error: undefined,
+                            })
+                          }
+                        />
+                        {row.error && (
+                          <div className="quick-access-popout__input-error">
+                            {row.error}
+                          </div>
+                        )}
+                      </div>
+                      <div className="quick-access-popout__input-group">
+                        <label className="quick-access-popout__label">
+                          {t("quickAccess.accessRole", "Role")}
+                        </label>
+                        <select
+                          className="quick-access-popout__select"
+                          value={row.role}
+                          onChange={(event) =>
+                            handleInviteRowChange(row.id, {
+                              role: event.target.value as
+                                | "editor"
+                                | "commenter"
+                                | "viewer",
+                            })
+                          }
+                        >
+                          <option value="editor">
+                            {t("quickAccess.accessRoleEditor", "Editor")}
+                          </option>
+                          <option value="commenter">
+                            {t("quickAccess.accessRoleCommenter", "Commenter")}
+                          </option>
+                          <option value="viewer">
+                            {t("quickAccess.accessRoleViewer", "Viewer")}
+                          </option>
+                        </select>
+                      </div>
+                      <button
+                        type="button"
+                        className="quick-access-popout__remove"
+                        onClick={() => handleRemoveInviteRow(row.id)}
+                        disabled={inviteRows.length === 1}
+                        aria-label={t("quickAccess.accessRemove", "Remove")}
+                      >
+                        <LocalIcon
+                          icon="close-rounded"
+                          width="0.9rem"
+                          height="0.9rem"
+                        />
+                      </button>
+                    </div>
+                  ))}
                   <button
                     type="button"
-                    className="quick-access-popout__primary"
-                    onClick={() => void handleSendInvites()}
-                    disabled={isInviting}
+                    className="quick-access-popout__add"
+                    onClick={handleAddInviteRow}
                   >
-                    <LocalIcon icon="send-rounded" width="1rem" height="1rem" />
-                    {t('quickAccess.accessSendInvite', 'Send Invite')}
+                    <span className="quick-access-popout__add-icon">+</span>
+                    {t("quickAccess.accessAddPerson", "Add another person")}
                   </button>
-                  {shareLinksEnabled && (
-                    <button
-                      type="button"
-                      className="quick-access-popout__link"
-                      onClick={handleCopyShareLink}
-                    >
-                      <LocalIcon icon="link-rounded" width="1rem" height="1rem" />
-                      {t('quickAccess.accessCopyLink', 'Copy link')}
-                    </button>
-                  )}
-                </>
-              ) : (
-                <>
-                  {sharingEnabled && (
+                </div>
+              </div>
+
+              <div className="quick-access-popout__footer">
+                {accessInviteOpen ? (
+                  <>
                     <button
                       type="button"
                       className="quick-access-popout__primary"
-                      onClick={() => setAccessInviteOpen(true)}
+                      onClick={() => void handleSendInvites()}
+                      disabled={isInviting}
                     >
-                      <LocalIcon icon="person-add-rounded" width="1rem" height="1rem" />
-                      {t('accessInvite', 'Invite')}
+                      <LocalIcon
+                        icon="send-rounded"
+                        width="1rem"
+                        height="1rem"
+                      />
+                      {t("quickAccess.accessSendInvite", "Send Invite")}
                     </button>
-                  )}
-                  {shareLinksEnabled && (
-                    <button
-                      type="button"
-                      className="quick-access-popout__link"
-                      onClick={handleCopyShareLink}
-                    >
-                      <LocalIcon icon="link-rounded" width="1rem" height="1rem" />
-                      {t('quickAccess.accessCopyLink', 'Copy link')}
-                    </button>
-                  )}
-                </>
-              )}
+                    {shareLinksEnabled && (
+                      <button
+                        type="button"
+                        className="quick-access-popout__link"
+                        onClick={handleCopyShareLink}
+                      >
+                        <LocalIcon
+                          icon="link-rounded"
+                          width="1rem"
+                          height="1rem"
+                        />
+                        {t("quickAccess.accessCopyLink", "Copy link")}
+                      </button>
+                    )}
+                  </>
+                ) : (
+                  <>
+                    {sharingEnabled && (
+                      <button
+                        type="button"
+                        className="quick-access-popout__primary"
+                        onClick={() => setAccessInviteOpen(true)}
+                      >
+                        <LocalIcon
+                          icon="person-add-rounded"
+                          width="1rem"
+                          height="1rem"
+                        />
+                        {t("accessInvite", "Invite")}
+                      </button>
+                    )}
+                    {shareLinksEnabled && (
+                      <button
+                        type="button"
+                        className="quick-access-popout__link"
+                        onClick={handleCopyShareLink}
+                      >
+                        <LocalIcon
+                          icon="link-rounded"
+                          width="1rem"
+                          height="1rem"
+                        />
+                        {t("quickAccess.accessCopyLink", "Copy link")}
+                      </button>
+                    )}
+                  </>
+                )}
+              </div>
             </div>
-          </div>
-        </div>,
-        document.body
-      )}
+          </div>,
+          document.body,
+        )}
 
       {/* Sign Popover */}
       <SignPopout
@@ -1103,6 +1421,6 @@ const QuickAccessBar = forwardRef<HTMLDivElement>((_, ref) => {
   );
 });
 
-QuickAccessBar.displayName = 'QuickAccessBar';
+QuickAccessBar.displayName = "QuickAccessBar";
 
 export default QuickAccessBar;
diff --git a/frontend/src/core/components/shared/RainbowThemeProvider.tsx b/frontend/src/core/components/shared/RainbowThemeProvider.tsx
index 992aa79b5c..25ddffaa72 100644
--- a/frontend/src/core/components/shared/RainbowThemeProvider.tsx
+++ b/frontend/src/core/components/shared/RainbowThemeProvider.tsx
@@ -1,12 +1,12 @@
-import { createContext, useContext, ReactNode } from 'react';
-import { MantineProvider } from '@mantine/core';
-import { useRainbowTheme } from '@app/hooks/useRainbowTheme';
-import { mantineTheme } from '@app/theme/mantineTheme';
-import rainbowStyles from '@app/styles/rainbow.module.css';
-import { ToastProvider } from '@app/components/toast';
-import ToastRenderer from '@app/components/toast/ToastRenderer';
-import { ToastPortalBinder } from '@app/components/toast';
-import type { ThemeMode } from '@app/constants/theme';
+import { createContext, useContext, ReactNode } from "react";
+import { MantineProvider } from "@mantine/core";
+import { useRainbowTheme } from "@app/hooks/useRainbowTheme";
+import { mantineTheme } from "@app/theme/mantineTheme";
+import rainbowStyles from "@app/styles/rainbow.module.css";
+import { ToastProvider } from "@app/components/toast";
+import ToastRenderer from "@app/components/toast/ToastRenderer";
+import { ToastPortalBinder } from "@app/components/toast";
+import type { ThemeMode } from "@app/constants/theme";
 
 interface RainbowThemeContextType {
   themeMode: ThemeMode;
@@ -22,7 +22,9 @@ const RainbowThemeContext = createContext<RainbowThemeContextType | null>(null);
 export function useRainbowThemeContext() {
   const context = useContext(RainbowThemeContext);
   if (!context) {
-    throw new Error('useRainbowThemeContext must be used within RainbowThemeProvider');
+    throw new Error(
+      "useRainbowThemeContext must be used within RainbowThemeProvider",
+    );
   }
   return context;
 }
@@ -35,7 +37,8 @@ export function RainbowThemeProvider({ children }: RainbowThemeProviderProps) {
   const rainbowTheme = useRainbowTheme();
 
   // Determine the Mantine color scheme
-  const mantineColorScheme = rainbowTheme.themeMode === 'rainbow' ? 'dark' : rainbowTheme.themeMode;
+  const mantineColorScheme =
+    rainbowTheme.themeMode === "rainbow" ? "dark" : rainbowTheme.themeMode;
 
   return (
     <RainbowThemeContext.Provider value={rainbowTheme}>
@@ -45,8 +48,10 @@ export function RainbowThemeProvider({ children }: RainbowThemeProviderProps) {
         forceColorScheme={mantineColorScheme}
       >
         <div
-          className={rainbowTheme.isRainbowMode ? rainbowStyles.rainbowMode : ''}
-          style={{ minHeight: '100vh' }}
+          className={
+            rainbowTheme.isRainbowMode ? rainbowStyles.rainbowMode : ""
+          }
+          style={{ minHeight: "100vh" }}
         >
           <ToastProvider>
             <ToastPortalBinder />
diff --git a/frontend/src/core/components/shared/RightRail.tsx b/frontend/src/core/components/shared/RightRail.tsx
index 8001b17f73..95d4694a76 100644
--- a/frontend/src/core/components/shared/RightRail.tsx
+++ b/frontend/src/core/components/shared/RightRail.tsx
@@ -1,43 +1,58 @@
-import React, { useCallback, useMemo } from 'react';
-import { ActionIcon, Divider } from '@mantine/core';
-import '@app/components/shared/rightRail/RightRail.css';
-import { useToolWorkflow } from '@app/contexts/ToolWorkflowContext';
-import { useRightRail } from '@app/contexts/RightRailContext';
-import { useFileState, useFileSelection, useFileActions } from '@app/contexts/FileContext';
-import { isStirlingFile } from '@app/types/fileContext';
-import { useNavigationState } from '@app/contexts/NavigationContext';
-import { useTranslation } from 'react-i18next';
-import { useFileActionTerminology } from '@app/hooks/useFileActionTerminology';
-import { useFileActionIcons } from '@app/hooks/useFileActionIcons';
+import React, { useCallback, useMemo } from "react";
+import { ActionIcon, Divider } from "@mantine/core";
+import "@app/components/shared/rightRail/RightRail.css";
+import { useToolWorkflow } from "@app/contexts/ToolWorkflowContext";
+import { useRightRail } from "@app/contexts/RightRailContext";
+import {
+  useFileState,
+  useFileSelection,
+  useFileActions,
+} from "@app/contexts/FileContext";
+import { isStirlingFile } from "@app/types/fileContext";
+import { useNavigationState } from "@app/contexts/NavigationContext";
+import { useTranslation } from "react-i18next";
+import { useFileActionTerminology } from "@app/hooks/useFileActionTerminology";
+import { useFileActionIcons } from "@app/hooks/useFileActionIcons";
 
-import LanguageSelector from '@app/components/shared/LanguageSelector';
-import { useRainbowThemeContext } from '@app/components/shared/RainbowThemeProvider';
-import { Tooltip } from '@app/components/shared/Tooltip';
-import { ViewerContext } from '@app/contexts/ViewerContext';
-import LocalIcon from '@app/components/shared/LocalIcon';
-import { RightRailFooterExtensions } from '@app/components/rightRail/RightRailFooterExtensions';
-import DarkModeIcon from '@mui/icons-material/DarkMode';
-import LightModeIcon from '@mui/icons-material/LightMode';
+import LanguageSelector from "@app/components/shared/LanguageSelector";
+import { useRainbowThemeContext } from "@app/components/shared/RainbowThemeProvider";
+import { Tooltip } from "@app/components/shared/Tooltip";
+import { ViewerContext } from "@app/contexts/ViewerContext";
+import LocalIcon from "@app/components/shared/LocalIcon";
+import { RightRailFooterExtensions } from "@app/components/rightRail/RightRailFooterExtensions";
+import DarkModeIcon from "@mui/icons-material/DarkMode";
+import LightModeIcon from "@mui/icons-material/LightMode";
 
-import { useSidebarContext } from '@app/contexts/SidebarContext';
-import { RightRailButtonConfig, RightRailRenderContext, RightRailSection } from '@app/types/rightRail';
-import { useRightRailTooltipSide } from '@app/hooks/useRightRailTooltipSide';
-import { downloadFile } from '@app/services/downloadService';
+import { useSidebarContext } from "@app/contexts/SidebarContext";
+import {
+  RightRailButtonConfig,
+  RightRailRenderContext,
+  RightRailSection,
+} from "@app/types/rightRail";
+import { useRightRailTooltipSide } from "@app/hooks/useRightRailTooltipSide";
+import { downloadFile } from "@app/services/downloadService";
 
-const SECTION_ORDER: RightRailSection[] = ['top', 'middle', 'bottom'];
+const SECTION_ORDER: RightRailSection[] = ["top", "middle", "bottom"];
 
 function renderWithTooltip(
   node: React.ReactNode,
   tooltip: React.ReactNode | undefined,
-  position: 'left' | 'right',
-  offset: number
+  position: "left" | "right",
+  offset: number,
 ) {
   if (!tooltip) return node;
 
-  const portalTarget = typeof document !== 'undefined' ? document.body : undefined;
+  const portalTarget =
+    typeof document !== "undefined" ? document.body : undefined;
 
   return (
-    <Tooltip content={tooltip} position={position} offset={offset} arrow portalTarget={portalTarget}>
+    <Tooltip
+      content={tooltip}
+      position={position}
+      offset={offset}
+      arrow
+      portalTarget={portalTarget}
+    >
       <div className="right-rail-tooltip-wrapper">{node}</div>
     </Tooltip>
   );
@@ -45,7 +60,8 @@ function renderWithTooltip(
 
 export default function RightRail() {
   const { sidebarRefs } = useSidebarContext();
-  const { position: tooltipPosition, offset: tooltipOffset } = useRightRailTooltipSide(sidebarRefs);
+  const { position: tooltipPosition, offset: tooltipOffset } =
+    useRightRailTooltipSide(sidebarRefs);
   const { t } = useTranslation();
   const terminology = useFileActionTerminology();
   const icons = useFileActionIcons();
@@ -53,8 +69,10 @@ export default function RightRail() {
   const { toggleTheme, themeMode } = useRainbowThemeContext();
   const { buttons, actions, allButtonsDisabled } = useRightRail();
 
-  const { pageEditorFunctions, toolPanelMode, leftPanelView } = useToolWorkflow();
-  const disableForFullscreen = toolPanelMode === 'fullscreen' && leftPanelView === 'toolPicker';
+  const { pageEditorFunctions, toolPanelMode, leftPanelView } =
+    useToolWorkflow();
+  const disableForFullscreen =
+    toolPanelMode === "fullscreen" && leftPanelView === "toolPicker";
 
   const { workbench: currentView } = useNavigationState();
 
@@ -63,33 +81,36 @@ export default function RightRail() {
   const { actions: fileActions } = useFileActions();
   const activeFiles = selectors.getFiles();
   const pageEditorTotalPages = pageEditorFunctions?.totalPages ?? 0;
-  const pageEditorSelectedCount = pageEditorFunctions?.selectedPageIds?.length ?? 0;
+  const pageEditorSelectedCount =
+    pageEditorFunctions?.selectedPageIds?.length ?? 0;
 
   const totalItems = useMemo(() => {
-    if (currentView === 'pageEditor') return pageEditorTotalPages;
+    if (currentView === "pageEditor") return pageEditorTotalPages;
     return activeFiles.length;
   }, [currentView, pageEditorTotalPages, activeFiles.length]);
 
   const selectedCount = useMemo(() => {
-    if (currentView === 'pageEditor') {
+    if (currentView === "pageEditor") {
       return pageEditorSelectedCount;
     }
     return selectedFileIds.length;
   }, [currentView, pageEditorSelectedCount, selectedFileIds.length]);
 
   const sectionsWithButtons = useMemo(() => {
-    return SECTION_ORDER
-      .map(section => {
-        const sectionButtons = buttons.filter(btn => (btn.section ?? 'top') === section && (btn.visible ?? true));
-        return { section, buttons: sectionButtons };
-      })
-      .filter(entry => entry.buttons.length > 0);
+    return SECTION_ORDER.map((section) => {
+      const sectionButtons = buttons.filter(
+        (btn) => (btn.section ?? "top") === section && (btn.visible ?? true),
+      );
+      return { section, buttons: sectionButtons };
+    }).filter((entry) => entry.buttons.length > 0);
   }, [buttons]);
 
   const renderButton = useCallback(
     (btn: RightRailButtonConfig) => {
       const action = actions[btn.id];
-      const disabled = Boolean(btn.disabled || allButtonsDisabled || disableForFullscreen);
+      const disabled = Boolean(
+        btn.disabled || allButtonsDisabled || disableForFullscreen,
+      );
       const isActive = Boolean(btn.active);
 
       const triggerAction = () => {
@@ -111,40 +132,57 @@ export default function RightRail() {
       if (!btn.icon) return null;
 
       const ariaLabel =
-        btn.ariaLabel || (typeof btn.tooltip === 'string' ? (btn.tooltip as string) : undefined);
-      const className = ['right-rail-icon', btn.className].filter(Boolean).join(' ');
+        btn.ariaLabel ||
+        (typeof btn.tooltip === "string" ? (btn.tooltip as string) : undefined);
+      const className = ["right-rail-icon", btn.className]
+        .filter(Boolean)
+        .join(" ");
       const buttonNode = (
         <ActionIcon
-          variant={isActive ? 'filled' : 'subtle'}
-          color={isActive ? 'blue' : undefined}
+          variant={isActive ? "filled" : "subtle"}
+          color={isActive ? "blue" : undefined}
           radius="md"
           className={className}
           onClick={triggerAction}
           disabled={disabled}
           aria-label={ariaLabel}
           aria-pressed={isActive ? true : undefined}
-          data-active={isActive ? 'true' : 'false'}
+          data-active={isActive ? "true" : "false"}
         >
           {btn.icon}
         </ActionIcon>
       );
 
-      return renderWithTooltip(buttonNode, btn.tooltip, tooltipPosition, tooltipOffset);
+      return renderWithTooltip(
+        buttonNode,
+        btn.tooltip,
+        tooltipPosition,
+        tooltipOffset,
+      );
     },
-    [actions, allButtonsDisabled, disableForFullscreen, tooltipPosition, tooltipOffset]
+    [
+      actions,
+      allButtonsDisabled,
+      disableForFullscreen,
+      tooltipPosition,
+      tooltipOffset,
+    ],
   );
 
   const handleExportAll = useCallback(
     async (forceNewFile = false) => {
-      if (currentView === 'viewer') {
+      if (currentView === "viewer") {
         const buffer = await viewerContext?.exportActions?.saveAsCopy?.();
         if (!buffer) return;
-        const fileToExport = selectedFiles.length > 0 ? selectedFiles[0] : activeFiles[0];
+        const fileToExport =
+          selectedFiles.length > 0 ? selectedFiles[0] : activeFiles[0];
         if (!fileToExport) return;
-        const stub = isStirlingFile(fileToExport) ? selectors.getStirlingFileStub(fileToExport.fileId) : undefined;
+        const stub = isStirlingFile(fileToExport)
+          ? selectors.getStirlingFileStub(fileToExport.fileId)
+          : undefined;
         try {
           const result = await downloadFile({
-            data: new Blob([buffer], { type: 'application/pdf' }),
+            data: new Blob([buffer], { type: "application/pdf" }),
             filename: fileToExport.name,
             localPath: forceNewFile ? undefined : stub?.localFilePath,
           });
@@ -155,21 +193,24 @@ export default function RightRail() {
             });
           }
         } catch (error) {
-          console.error('[RightRail] Failed to export viewer file:', error);
+          console.error("[RightRail] Failed to export viewer file:", error);
         }
         return;
       }
 
-      if (currentView === 'pageEditor') {
+      if (currentView === "pageEditor") {
         pageEditorFunctions?.onExportAll?.();
         return;
       }
 
-      const filesToExport = selectedFiles.length > 0 ? selectedFiles : activeFiles;
+      const filesToExport =
+        selectedFiles.length > 0 ? selectedFiles : activeFiles;
 
       if (filesToExport.length > 0) {
         for (const file of filesToExport) {
-          const stub = isStirlingFile(file) ? selectors.getStirlingFileStub(file.fileId) : undefined;
+          const stub = isStirlingFile(file)
+            ? selectors.getStirlingFileStub(file.fileId)
+            : undefined;
           try {
             const result = await downloadFile({
               data: file,
@@ -184,7 +225,11 @@ export default function RightRail() {
               });
             }
           } catch (error) {
-            console.error('[RightRail] Failed to export file:', file.name, error);
+            console.error(
+              "[RightRail] Failed to export file:",
+              file.name,
+              error,
+            );
           }
         }
       }
@@ -197,14 +242,14 @@ export default function RightRail() {
       viewerContext,
       selectors,
       fileActions,
-    ]
+    ],
   );
 
   const downloadTooltip = useMemo(() => {
-    if (currentView === 'pageEditor') {
-      return t('rightRail.exportAll', 'Export PDF');
+    if (currentView === "pageEditor") {
+      return t("rightRail.exportAll", "Export PDF");
     }
-    if (currentView === 'viewer') {
+    if (currentView === "viewer") {
       return terminology.download;
     }
     if (selectedCount > 0) {
@@ -214,7 +259,11 @@ export default function RightRail() {
   }, [currentView, selectedCount, t, terminology]);
 
   return (
-    <div ref={sidebarRefs.rightRailRef} className="right-rail" data-sidebar="right-rail">
+    <div
+      ref={sidebarRefs.rightRailRef}
+      className="right-rail"
+      data-sidebar="right-rail"
+    >
       <div className="right-rail-inner">
         {sectionsWithButtons.map(({ section, buttons: sectionButtons }) => (
           <React.Fragment key={section}>
@@ -236,7 +285,15 @@ export default function RightRail() {
             <Divider className="right-rail-divider" />
           </React.Fragment>
         ))}
-        <div style={{ display: 'flex', flexDirection: 'column', alignItems: 'center', gap: '1rem' }} data-tour="right-rail-settings">
+        <div
+          style={{
+            display: "flex",
+            flexDirection: "column",
+            alignItems: "center",
+            gap: "1rem",
+          }}
+          data-tour="right-rail-settings"
+        >
           {renderWithTooltip(
             <ActionIcon
               variant="subtle"
@@ -244,22 +301,22 @@ export default function RightRail() {
               className="right-rail-icon"
               onClick={toggleTheme}
             >
-              {themeMode === 'dark' ? (
-                <LightModeIcon sx={{ fontSize: '1.5rem' }} />
+              {themeMode === "dark" ? (
+                <LightModeIcon sx={{ fontSize: "1.5rem" }} />
               ) : (
-                <DarkModeIcon sx={{ fontSize: '1.5rem' }} />
+                <DarkModeIcon sx={{ fontSize: "1.5rem" }} />
               )}
             </ActionIcon>,
-            t('rightRail.toggleTheme', 'Toggle Theme'),
+            t("rightRail.toggleTheme", "Toggle Theme"),
             tooltipPosition,
-            tooltipOffset
+            tooltipOffset,
           )}
 
           <LanguageSelector
             position="left-start"
             offset={6}
             compact
-            tooltip={t('rightRail.language', 'Language')}
+            tooltip={t("rightRail.language", "Language")}
           />
 
           {renderWithTooltip(
@@ -270,14 +327,19 @@ export default function RightRail() {
               onClick={() => handleExportAll()}
               disabled={
                 disableForFullscreen ||
-                (currentView !== 'viewer' && (totalItems === 0 || allButtonsDisabled))
+                (currentView !== "viewer" &&
+                  (totalItems === 0 || allButtonsDisabled))
               }
             >
-              <LocalIcon icon={icons.downloadIconName} width="1.5rem" height="1.5rem" />
+              <LocalIcon
+                icon={icons.downloadIconName}
+                width="1.5rem"
+                height="1.5rem"
+              />
             </ActionIcon>,
             downloadTooltip,
             tooltipPosition,
-            tooltipOffset
+            tooltipOffset,
           )}
           {icons.saveAsIconName &&
             renderWithTooltip(
@@ -288,14 +350,19 @@ export default function RightRail() {
                 onClick={() => handleExportAll(true)}
                 disabled={
                   disableForFullscreen ||
-                  (currentView !== 'viewer' && (totalItems === 0 || allButtonsDisabled))
+                  (currentView !== "viewer" &&
+                    (totalItems === 0 || allButtonsDisabled))
                 }
               >
-                <LocalIcon icon={icons.saveAsIconName} width="1.5rem" height="1.5rem" />
+                <LocalIcon
+                  icon={icons.saveAsIconName}
+                  width="1.5rem"
+                  height="1.5rem"
+                />
               </ActionIcon>,
-              t('rightRail.saveAs', 'Save As'),
+              t("rightRail.saveAs", "Save As"),
               tooltipPosition,
-              tooltipOffset
+              tooltipOffset,
             )}
         </div>
 
diff --git a/frontend/src/core/components/shared/ShareFileModal.tsx b/frontend/src/core/components/shared/ShareFileModal.tsx
index 3cdcf99245..2f205326e3 100644
--- a/frontend/src/core/components/shared/ShareFileModal.tsx
+++ b/frontend/src/core/components/shared/ShareFileModal.tsx
@@ -1,19 +1,29 @@
-import React, { useCallback, useEffect, useMemo, useState } from 'react';
-import { Modal, Stack, Text, Button, Group, Alert, TextInput, Paper, Select } from '@mantine/core';
-import LinkIcon from '@mui/icons-material/Link';
-import ContentCopyRoundedIcon from '@mui/icons-material/ContentCopyRounded';
-import { useTranslation } from 'react-i18next';
+import React, { useCallback, useEffect, useMemo, useState } from "react";
+import {
+  Modal,
+  Stack,
+  Text,
+  Button,
+  Group,
+  Alert,
+  TextInput,
+  Paper,
+  Select,
+} from "@mantine/core";
+import LinkIcon from "@mui/icons-material/Link";
+import ContentCopyRoundedIcon from "@mui/icons-material/ContentCopyRounded";
+import { useTranslation } from "react-i18next";
 
-import apiClient from '@app/services/apiClient';
-import { absoluteWithBasePath } from '@app/constants/app';
-import { alert } from '@app/components/toast';
-import { Z_INDEX_OVER_FILE_MANAGER_MODAL } from '@app/styles/zIndex';
-import { useAppConfig } from '@app/contexts/AppConfigContext';
-import type { StirlingFileStub } from '@app/types/fileContext';
-import { uploadHistoryChain } from '@app/services/serverStorageUpload';
-import { fileStorage } from '@app/services/fileStorage';
-import { useFileActions } from '@app/contexts/FileContext';
-import type { FileId } from '@app/types/file';
+import apiClient from "@app/services/apiClient";
+import { absoluteWithBasePath } from "@app/constants/app";
+import { alert } from "@app/components/toast";
+import { Z_INDEX_OVER_FILE_MANAGER_MODAL } from "@app/styles/zIndex";
+import { useAppConfig } from "@app/contexts/AppConfigContext";
+import type { StirlingFileStub } from "@app/types/fileContext";
+import { uploadHistoryChain } from "@app/services/serverStorageUpload";
+import { fileStorage } from "@app/services/fileStorage";
+import { useFileActions } from "@app/contexts/FileContext";
+import type { FileId } from "@app/types/file";
 
 interface ShareFileModalProps {
   opened: boolean;
@@ -35,7 +45,9 @@ const ShareFileModal: React.FC<ShareFileModalProps> = ({
   const [isWorking, setIsWorking] = useState(false);
   const [errorMessage, setErrorMessage] = useState<string | null>(null);
   const [shareToken, setShareToken] = useState<string | null>(null);
-  const [shareRole, setShareRole] = useState<'editor' | 'commenter' | 'viewer'>('editor');
+  const [shareRole, setShareRole] = useState<"editor" | "commenter" | "viewer">(
+    "editor",
+  );
 
   useEffect(() => {
     if (!opened) {
@@ -47,18 +59,20 @@ const ShareFileModal: React.FC<ShareFileModalProps> = ({
 
   useEffect(() => {
     if (opened) {
-      setShareRole('editor');
+      setShareRole("editor");
     }
   }, [opened]);
 
   const shareUrl = useMemo(() => {
-    if (!shareToken) return '';
-    const frontendUrl = (config?.frontendUrl || '').trim();
+    if (!shareToken) return "";
+    const frontendUrl = (config?.frontendUrl || "").trim();
     if (frontendUrl) {
       try {
         const parsed = new URL(frontendUrl);
-        if (parsed.protocol === 'http:' || parsed.protocol === 'https:') {
-          const normalized = frontendUrl.endsWith('/') ? frontendUrl.slice(0, -1) : frontendUrl;
+        if (parsed.protocol === "http:" || parsed.protocol === "https:") {
+          const normalized = frontendUrl.endsWith("/")
+            ? frontendUrl.slice(0, -1)
+            : frontendUrl;
           return `${normalized}/share/${shareToken}`;
         }
       } catch {
@@ -68,18 +82,24 @@ const ShareFileModal: React.FC<ShareFileModalProps> = ({
     return absoluteWithBasePath(`/share/${shareToken}`);
   }, [config?.frontendUrl, shareToken]);
 
-  const createShareLink = useCallback(async (storedFileId: number) => {
-    const response = await apiClient.post(`/api/v1/storage/files/${storedFileId}/shares/links`, {
-      accessRole: shareRole,
-    });
-    return response.data as { token?: string };
-  }, [shareRole]);
+  const createShareLink = useCallback(
+    async (storedFileId: number) => {
+      const response = await apiClient.post(
+        `/api/v1/storage/files/${storedFileId}/shares/links`,
+        {
+          accessRole: shareRole,
+        },
+      );
+      return response.data as { token?: string };
+    },
+    [shareRole],
+  );
 
   const handleGenerateLink = useCallback(async () => {
     if (!shareLinksEnabled) {
       alert({
-        alertType: 'warning',
-        title: t('storageShare.linksDisabled', 'Share links are disabled.'),
+        alertType: "warning",
+        title: t("storageShare.linksDisabled", "Share links are disabled."),
         expandable: false,
         durationMs: 2500,
       });
@@ -101,10 +121,11 @@ const ShareFileModal: React.FC<ShareFileModalProps> = ({
       if (!isUpToDate) {
         const originalFileId = (file.originalFileId || file.id) as FileId;
         const remoteId = file.remoteStorageId;
-        const { remoteId: newStoredId, updatedAt, chain } = await uploadHistoryChain(
-          originalFileId,
-          remoteId
-        );
+        const {
+          remoteId: newStoredId,
+          updatedAt,
+          chain,
+        } = await uploadHistoryChain(originalFileId, remoteId);
         storedId = newStoredId;
 
         for (const stub of chain) {
@@ -124,28 +145,33 @@ const ShareFileModal: React.FC<ShareFileModalProps> = ({
       }
 
       if (!storedId) {
-        throw new Error('Missing stored file ID for sharing.');
+        throw new Error("Missing stored file ID for sharing.");
       }
       const shareResponse = await createShareLink(storedId);
       setShareToken(shareResponse.token ?? null);
 
       alert({
-        alertType: 'success',
-        title: t('storageShare.generated', 'Share link generated'),
+        alertType: "success",
+        title: t("storageShare.generated", "Share link generated"),
         expandable: false,
         durationMs: 3000,
       });
       if (storedId) {
         actions.updateStirlingFileStub(file.id, { remoteHasShareLinks: true });
-        await fileStorage.updateFileMetadata(file.id, { remoteHasShareLinks: true });
+        await fileStorage.updateFileMetadata(file.id, {
+          remoteHasShareLinks: true,
+        });
       }
       if (onUploaded) {
         await onUploaded();
       }
     } catch (error: any) {
-      console.error('Failed to generate share link:', error);
+      console.error("Failed to generate share link:", error);
       setErrorMessage(
-        t('storageShare.failure', 'Unable to generate a share link. Please try again.')
+        t(
+          "storageShare.failure",
+          "Unable to generate a share link. Please try again.",
+        ),
       );
     } finally {
       setIsWorking(false);
@@ -157,16 +183,16 @@ const ShareFileModal: React.FC<ShareFileModalProps> = ({
     try {
       await navigator.clipboard.writeText(shareUrl);
       alert({
-        alertType: 'success',
-        title: t('storageShare.copied', 'Link copied to clipboard'),
+        alertType: "success",
+        title: t("storageShare.copied", "Link copied to clipboard"),
         expandable: false,
         durationMs: 2000,
       });
     } catch (error) {
-      console.error('Failed to copy share link:', error);
+      console.error("Failed to copy share link:", error);
       alert({
-        alertType: 'warning',
-        title: t('storageShare.copyFailed', 'Copy failed'),
+        alertType: "warning",
+        title: t("storageShare.copyFailed", "Copy failed"),
         expandable: false,
         durationMs: 2500,
       });
@@ -178,7 +204,7 @@ const ShareFileModal: React.FC<ShareFileModalProps> = ({
       opened={opened}
       onClose={onClose}
       centered
-      title={t('storageShare.title', 'Share File')}
+      title={t("storageShare.title", "Share File")}
       zIndex={Z_INDEX_OVER_FILE_MANAGER_MODAL}
       size="lg"
       overlayProps={{ blur: 6 }}
@@ -188,24 +214,33 @@ const ShareFileModal: React.FC<ShareFileModalProps> = ({
           <Stack gap={4}>
             <Text size="sm">
               {t(
-                'storageShare.description',
-                'Create a share link for this file. Signed-in users with the link can access it.'
+                "storageShare.description",
+                "Create a share link for this file. Signed-in users with the link can access it.",
               )}
             </Text>
             <Text size="sm" c="dimmed">
-              {t('storageShare.fileLabel', 'File')}: {file.name}
+              {t("storageShare.fileLabel", "File")}: {file.name}
             </Text>
           </Stack>
         </Paper>
 
         {errorMessage && (
-          <Alert color="red" title={t('storageShare.errorTitle', 'Share failed')}>
+          <Alert
+            color="red"
+            title={t("storageShare.errorTitle", "Share failed")}
+          >
             {errorMessage}
           </Alert>
         )}
         {!shareLinksEnabled && (
-          <Alert color="yellow" title={t('storageShare.linksDisabled', 'Share links are disabled.')}>
-            {t('storageShare.linksDisabledBody', 'Share links are disabled by your server settings.')}
+          <Alert
+            color="yellow"
+            title={t("storageShare.linksDisabled", "Share links are disabled.")}
+          >
+            {t(
+              "storageShare.linksDisabledBody",
+              "Share links are disabled by your server settings.",
+            )}
           </Alert>
         )}
 
@@ -215,15 +250,17 @@ const ShareFileModal: React.FC<ShareFileModalProps> = ({
               <TextInput
                 readOnly
                 value={shareUrl}
-                label={t('storageShare.linkLabel', 'Share link')}
+                label={t("storageShare.linkLabel", "Share link")}
                 rightSection={
                   <Button
                     variant="subtle"
                     size="xs"
-                    leftSection={<ContentCopyRoundedIcon style={{ fontSize: 16 }} />}
+                    leftSection={
+                      <ContentCopyRoundedIcon style={{ fontSize: 16 }} />
+                    }
                     onClick={handleCopyLink}
                   >
-                    {t('storageShare.copy', 'Copy')}
+                    {t("storageShare.copy", "Copy")}
                   </Button>
                 }
               />
@@ -234,22 +271,36 @@ const ShareFileModal: React.FC<ShareFileModalProps> = ({
         <Paper withBorder radius="md" p="md">
           <Stack gap="xs">
             <Text size="sm" fw={500}>
-              {t('storageShare.linkAccessTitle', 'Share link access')}
+              {t("storageShare.linkAccessTitle", "Share link access")}
             </Text>
             <Select
-              label={t('storageShare.roleLabel', 'Role')}
+              label={t("storageShare.roleLabel", "Role")}
               value={shareRole}
-              onChange={(value) => setShareRole((value as typeof shareRole) || 'editor')}
-              comboboxProps={{ withinPortal: true, zIndex: Z_INDEX_OVER_FILE_MANAGER_MODAL + 10 }}
+              onChange={(value) =>
+                setShareRole((value as typeof shareRole) || "editor")
+              }
+              comboboxProps={{
+                withinPortal: true,
+                zIndex: Z_INDEX_OVER_FILE_MANAGER_MODAL + 10,
+              }}
               data={[
-                { value: 'editor', label: t('storageShare.roleEditor', 'Editor') },
-                { value: 'commenter', label: t('storageShare.roleCommenter', 'Commenter') },
-                { value: 'viewer', label: t('storageShare.roleViewer', 'Viewer') },
+                {
+                  value: "editor",
+                  label: t("storageShare.roleEditor", "Editor"),
+                },
+                {
+                  value: "commenter",
+                  label: t("storageShare.roleCommenter", "Commenter"),
+                },
+                {
+                  value: "viewer",
+                  label: t("storageShare.roleViewer", "Viewer"),
+                },
               ]}
             />
-            {shareRole === 'commenter' && (
+            {shareRole === "commenter" && (
               <Text size="xs" c="dimmed">
-                {t('storageShare.commenterHint', 'Commenting is coming soon.')}
+                {t("storageShare.commenterHint", "Commenting is coming soon.")}
               </Text>
             )}
           </Stack>
@@ -257,7 +308,7 @@ const ShareFileModal: React.FC<ShareFileModalProps> = ({
 
         <Group justify="flex-end" gap="sm">
           <Button variant="default" onClick={onClose} disabled={isWorking}>
-            {t('cancel', 'Cancel')}
+            {t("cancel", "Cancel")}
           </Button>
           <Button
             leftSection={<LinkIcon style={{ fontSize: 18 }} />}
@@ -265,7 +316,7 @@ const ShareFileModal: React.FC<ShareFileModalProps> = ({
             loading={isWorking}
             disabled={!shareLinksEnabled}
           >
-            {t('storageShare.generate', 'Generate Link')}
+            {t("storageShare.generate", "Generate Link")}
           </Button>
         </Group>
       </Stack>
diff --git a/frontend/src/core/components/shared/ShareManagementModal.tsx b/frontend/src/core/components/shared/ShareManagementModal.tsx
index d3c62a4f4e..48a8b1d7d4 100644
--- a/frontend/src/core/components/shared/ShareManagementModal.tsx
+++ b/frontend/src/core/components/shared/ShareManagementModal.tsx
@@ -1,4 +1,4 @@
-import React, { useCallback, useEffect, useMemo, useState } from 'react';
+import React, { useCallback, useEffect, useMemo, useState } from "react";
 import {
   Modal,
   Stack,
@@ -12,21 +12,21 @@ import {
   SimpleGrid,
   ScrollArea,
   Select,
-} from '@mantine/core';
-import ContentCopyRoundedIcon from '@mui/icons-material/ContentCopyRounded';
-import DeleteIcon from '@mui/icons-material/Delete';
-import HistoryIcon from '@mui/icons-material/History';
-import LinkIcon from '@mui/icons-material/Link';
-import { useTranslation } from 'react-i18next';
+} from "@mantine/core";
+import ContentCopyRoundedIcon from "@mui/icons-material/ContentCopyRounded";
+import DeleteIcon from "@mui/icons-material/Delete";
+import HistoryIcon from "@mui/icons-material/History";
+import LinkIcon from "@mui/icons-material/Link";
+import { useTranslation } from "react-i18next";
 
-import apiClient from '@app/services/apiClient';
-import { absoluteWithBasePath } from '@app/constants/app';
-import { alert } from '@app/components/toast';
-import { Z_INDEX_OVER_FILE_MANAGER_MODAL } from '@app/styles/zIndex';
-import { useAppConfig } from '@app/contexts/AppConfigContext';
-import type { StirlingFileStub } from '@app/types/fileContext';
-import { fileStorage } from '@app/services/fileStorage';
-import { useFileActions } from '@app/contexts/FileContext';
+import apiClient from "@app/services/apiClient";
+import { absoluteWithBasePath } from "@app/constants/app";
+import { alert } from "@app/components/toast";
+import { Z_INDEX_OVER_FILE_MANAGER_MODAL } from "@app/styles/zIndex";
+import { useAppConfig } from "@app/contexts/AppConfigContext";
+import type { StirlingFileStub } from "@app/types/fileContext";
+import { fileStorage } from "@app/services/fileStorage";
+import { useFileActions } from "@app/contexts/FileContext";
 
 interface ShareLinkResponse {
   token: string;
@@ -66,45 +66,66 @@ const ShareManagementModal: React.FC<ShareManagementModalProps> = ({
   const [isLoading, setIsLoading] = useState(false);
   const [errorMessage, setErrorMessage] = useState<string | null>(null);
   const [shareLinks, setShareLinks] = useState<ShareLinkResponse[]>([]);
-  const [activityMap, setActivityMap] = useState<Record<string, ShareLinkAccessResponse[]>>({});
-  const [sharedUsers, setSharedUsers] = useState<Array<{ username: string; accessRole?: string | null }>>([]);
-  const [shareUsername, setShareUsername] = useState('');
-  const [shareRole, setShareRole] = useState<'editor' | 'commenter' | 'viewer'>('editor');
+  const [activityMap, setActivityMap] = useState<
+    Record<string, ShareLinkAccessResponse[]>
+  >({});
+  const [sharedUsers, setSharedUsers] = useState<
+    Array<{ username: string; accessRole?: string | null }>
+  >([]);
+  const [shareUsername, setShareUsername] = useState("");
+  const [shareRole, setShareRole] = useState<"editor" | "commenter" | "viewer">(
+    "editor",
+  );
   const [showEmailWarning, setShowEmailWarning] = useState(false);
-  const [selectedActivityToken, setSelectedActivityToken] = useState<string | null>(null);
-  const [confirmRevokeToken, setConfirmRevokeToken] = useState<string | null>(null);
-  const [confirmRemoveUser, setConfirmRemoveUser] = useState<string | null>(null);
+  const [selectedActivityToken, setSelectedActivityToken] = useState<
+    string | null
+  >(null);
+  const [confirmRevokeToken, setConfirmRevokeToken] = useState<string | null>(
+    null,
+  );
+  const [confirmRemoveUser, setConfirmRemoveUser] = useState<string | null>(
+    null,
+  );
 
   const normalizedShareUsername = shareUsername.trim();
   const lowerShareUsername = normalizedShareUsername.toLowerCase();
-  const isEmailInput = /^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(normalizedShareUsername);
-  const isSimpleUsername = /^[A-Za-z0-9@._+-]{3,50}$/.test(normalizedShareUsername);
+  const isEmailInput = /^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(
+    normalizedShareUsername,
+  );
+  const isSimpleUsername = /^[A-Za-z0-9@._+-]{3,50}$/.test(
+    normalizedShareUsername,
+  );
   const isReservedUsername =
-    lowerShareUsername === 'all_users' || lowerShareUsername === 'anonymoususer';
+    lowerShareUsername === "all_users" ||
+    lowerShareUsername === "anonymoususer";
   const isValidShareUsername =
-    normalizedShareUsername.length > 0 && !isReservedUsername && (isEmailInput || isSimpleUsername);
+    normalizedShareUsername.length > 0 &&
+    !isReservedUsername &&
+    (isEmailInput || isSimpleUsername);
   const shareUsernameError =
     normalizedShareUsername.length > 0 && !isValidShareUsername
       ? t(
-          'storageShare.invalidUsername',
-          'Enter a valid username or email address.'
+          "storageShare.invalidUsername",
+          "Enter a valid username or email address.",
         )
       : null;
 
   const shareBaseUrl = useMemo(() => {
-    const frontendUrl = (config?.frontendUrl || '').trim();
+    const frontendUrl = (config?.frontendUrl || "").trim();
     if (frontendUrl) {
       try {
         const parsed = new URL(frontendUrl);
-        if (parsed.protocol === 'http:' || parsed.protocol === 'https:') {
-          const normalized = frontendUrl.endsWith('/') ? frontendUrl.slice(0, -1) : frontendUrl;
+        if (parsed.protocol === "http:" || parsed.protocol === "https:") {
+          const normalized = frontendUrl.endsWith("/")
+            ? frontendUrl.slice(0, -1)
+            : frontendUrl;
           return `${normalized}/share/`;
         }
       } catch {
         // invalid URL — fall through to default
       }
     }
-    return absoluteWithBasePath('/share/');
+    return absoluteWithBasePath("/share/");
   }, [config?.frontendUrl]);
 
   const loadShareLinks = useCallback(async () => {
@@ -114,21 +135,23 @@ const ShareManagementModal: React.FC<ShareManagementModalProps> = ({
     try {
       const response = await apiClient.get<StoredFileResponse>(
         `/api/v1/storage/files/${file.remoteStorageId}`,
-        { suppressErrorToast: true }
+        {
+          suppressErrorToast: true,
+        },
       );
       const links = response.data?.shareLinks ?? [];
       const users =
         response.data?.sharedUsers ??
         (response.data?.sharedWithUsers ?? []).map((username) => ({
           username,
-          accessRole: 'editor',
+          accessRole: "editor",
         }));
       setShareLinks(links);
       setSharedUsers(users);
     } catch (error) {
-      console.error('Failed to load share links:', error);
+      console.error("Failed to load share links:", error);
       setErrorMessage(
-        t('storageShare.manageLoadFailed', 'Unable to load share links.')
+        t("storageShare.manageLoadFailed", "Unable to load share links."),
       );
     } finally {
       setIsLoading(false);
@@ -139,7 +162,7 @@ const ShareManagementModal: React.FC<ShareManagementModalProps> = ({
     if (opened) {
       loadShareLinks();
       setActivityMap({});
-      setShareRole('editor');
+      setShareRole("editor");
       setSelectedActivityToken(null);
     }
   }, [opened, loadShareLinks]);
@@ -153,122 +176,149 @@ const ShareManagementModal: React.FC<ShareManagementModalProps> = ({
       setSelectedActivityToken(null);
       return;
     }
-    if (!selectedActivityToken || !shareLinks.some((link) => link.token === selectedActivityToken)) {
+    if (
+      !selectedActivityToken ||
+      !shareLinks.some((link) => link.token === selectedActivityToken)
+    ) {
       setSelectedActivityToken(shareLinks[0].token);
     }
   }, [opened, selectedActivityToken, shareLinks]);
 
-  const createShareLink = useCallback(
-    async () => {
+  const createShareLink = useCallback(async () => {
+    if (!file.remoteStorageId) return;
+    setIsLoading(true);
+    setErrorMessage(null);
+    try {
+      const response = await apiClient.post(
+        `/api/v1/storage/files/${file.remoteStorageId}/shares/links`,
+        {
+          accessRole: shareRole,
+        },
+      );
+      const token = response.data?.token as string | undefined;
+      if (token) {
+        setShareLinks((prev) => [
+          ...prev,
+          {
+            token,
+            accessRole: shareRole,
+            createdAt: new Date().toISOString(),
+          },
+        ]);
+        actions.updateStirlingFileStub(file.id, { remoteHasShareLinks: true });
+        await fileStorage.updateFileMetadata(file.id, {
+          remoteHasShareLinks: true,
+        });
+        alert({
+          alertType: "success",
+          title: t("storageShare.generated", "Share link generated"),
+          expandable: false,
+          durationMs: 2500,
+        });
+      }
+    } catch (error: any) {
+      console.error("Failed to create share link:", error);
+      setErrorMessage(
+        t(
+          "storageShare.failure",
+          "Unable to generate a share link. Please try again.",
+        ),
+      );
+    } finally {
+      setIsLoading(false);
+    }
+  }, [actions, file.id, file.remoteStorageId, shareRole, t]);
+
+  const handleCopyLink = useCallback(
+    async (token: string) => {
+      try {
+        await navigator.clipboard.writeText(`${shareBaseUrl}${token}`);
+        alert({
+          alertType: "success",
+          title: t("storageShare.copied", "Link copied to clipboard"),
+          expandable: false,
+          durationMs: 2000,
+        });
+      } catch (error) {
+        console.error("Failed to copy share link:", error);
+        alert({
+          alertType: "warning",
+          title: t("storageShare.copyFailed", "Copy failed"),
+          expandable: false,
+          durationMs: 2500,
+        });
+      }
+    },
+    [shareBaseUrl, t],
+  );
+
+  const handleRevokeLink = useCallback(
+    async (token: string) => {
       if (!file.remoteStorageId) return;
       setIsLoading(true);
-      setErrorMessage(null);
+      setConfirmRevokeToken(null);
       try {
-        const response = await apiClient.post(
-          `/api/v1/storage/files/${file.remoteStorageId}/shares/links`,
-          { accessRole: shareRole }
+        await apiClient.delete(
+          `/api/v1/storage/files/${file.remoteStorageId}/shares/links/${token}`,
         );
-        const token = response.data?.token as string | undefined;
-        if (token) {
-          setShareLinks((prev) => [
-            ...prev,
-            {
-              token,
-              accessRole: shareRole,
-              createdAt: new Date().toISOString(),
-            },
-          ]);
-          actions.updateStirlingFileStub(file.id, { remoteHasShareLinks: true });
-          await fileStorage.updateFileMetadata(file.id, { remoteHasShareLinks: true });
-          alert({
-            alertType: 'success',
-            title: t('storageShare.generated', 'Share link generated'),
-            expandable: false,
-            durationMs: 2500,
-          });
-        }
-      } catch (error: any) {
-        console.error('Failed to create share link:', error);
+        // Compute before setShareLinks so we don't read stale closure state after the update
+        const nextHasLinks =
+          shareLinks.filter((link) => link.token !== token).length > 0;
+        setShareLinks((prev) => prev.filter((link) => link.token !== token));
+        setActivityMap((prev) => {
+          const updated = { ...prev };
+          delete updated[token];
+          return updated;
+        });
+        setSelectedActivityToken((prev) => (prev === token ? null : prev));
+        actions.updateStirlingFileStub(file.id, {
+          remoteHasShareLinks: nextHasLinks,
+        });
+        await fileStorage.updateFileMetadata(file.id, {
+          remoteHasShareLinks: nextHasLinks,
+        });
+        alert({
+          alertType: "success",
+          title: t("storageShare.revoked", "Share link removed"),
+          expandable: false,
+          durationMs: 2500,
+        });
+      } catch (error) {
+        console.error("Failed to revoke share link:", error);
         setErrorMessage(
-          t('storageShare.failure', 'Unable to generate a share link. Please try again.')
+          t("storageShare.revokeFailed", "Unable to remove the share link."),
         );
       } finally {
         setIsLoading(false);
       }
     },
-    [actions, file.id, file.remoteStorageId, shareRole, t]
+    [actions, file.remoteStorageId, shareLinks, t],
   );
 
-  const handleCopyLink = useCallback(async (token: string) => {
-    try {
-      await navigator.clipboard.writeText(`${shareBaseUrl}${token}`);
-      alert({
-        alertType: 'success',
-        title: t('storageShare.copied', 'Link copied to clipboard'),
-        expandable: false,
-        durationMs: 2000,
-      });
-    } catch (error) {
-      console.error('Failed to copy share link:', error);
-      alert({
-        alertType: 'warning',
-        title: t('storageShare.copyFailed', 'Copy failed'),
-        expandable: false,
-        durationMs: 2500,
-      });
-    }
-  }, [shareBaseUrl, t]);
-
-  const handleRevokeLink = useCallback(async (token: string) => {
-    if (!file.remoteStorageId) return;
-    setIsLoading(true);
-    setConfirmRevokeToken(null);
-    try {
-      await apiClient.delete(`/api/v1/storage/files/${file.remoteStorageId}/shares/links/${token}`);
-      // Compute before setShareLinks so we don't read stale closure state after the update
-      const nextHasLinks = shareLinks.filter((link) => link.token !== token).length > 0;
-      setShareLinks((prev) => prev.filter((link) => link.token !== token));
-      setActivityMap((prev) => {
-        const updated = { ...prev };
-        delete updated[token];
-        return updated;
-      });
-      setSelectedActivityToken((prev) => (prev === token ? null : prev));
-      actions.updateStirlingFileStub(file.id, { remoteHasShareLinks: nextHasLinks });
-      await fileStorage.updateFileMetadata(file.id, { remoteHasShareLinks: nextHasLinks });
-      alert({
-        alertType: 'success',
-        title: t('storageShare.revoked', 'Share link removed'),
-        expandable: false,
-        durationMs: 2500,
-      });
-    } catch (error) {
-      console.error('Failed to revoke share link:', error);
-      setErrorMessage(t('storageShare.revokeFailed', 'Unable to remove the share link.'));
-    } finally {
-      setIsLoading(false);
-    }
-  }, [actions, file.remoteStorageId, shareLinks, t]);
-
-  const handleLoadActivity = useCallback(async (token: string) => {
-    if (!file.remoteStorageId) return;
-    setIsLoading(true);
-    try {
-      const response = await apiClient.get<ShareLinkAccessResponse[]>(
-        `/api/v1/storage/files/${file.remoteStorageId}/shares/links/${token}/accesses`,
-        { suppressErrorToast: true }
-      );
-      setActivityMap((prev) => ({
-        ...prev,
-        [token]: response.data ?? [],
-      }));
-    } catch (error) {
-      console.error('Failed to load share activity:', error);
-      setErrorMessage(t('storageShare.accessFailed', 'Unable to load activity.'));
-    } finally {
-      setIsLoading(false);
-    }
-  }, [file.remoteStorageId, t]);
+  const handleLoadActivity = useCallback(
+    async (token: string) => {
+      if (!file.remoteStorageId) return;
+      setIsLoading(true);
+      try {
+        const response = await apiClient.get<ShareLinkAccessResponse[]>(
+          `/api/v1/storage/files/${file.remoteStorageId}/shares/links/${token}/accesses`,
+          { suppressErrorToast: true },
+        );
+        setActivityMap((prev) => ({
+          ...prev,
+          [token]: response.data ?? [],
+        }));
+      } catch (error) {
+        console.error("Failed to load share activity:", error);
+        setErrorMessage(
+          t("storageShare.accessFailed", "Unable to load activity."),
+        );
+      } finally {
+        setIsLoading(false);
+      }
+    },
+    [file.remoteStorageId, t],
+  );
 
   useEffect(() => {
     if (!selectedActivityToken) return;
@@ -277,112 +327,138 @@ const ShareManagementModal: React.FC<ShareManagementModalProps> = ({
     }
   }, [activityMap, handleLoadActivity, selectedActivityToken]);
 
-  const handleAddUser = useCallback(async (forceEmailConfirm = false) => {
-    if (!file.remoteStorageId) return;
-    const trimmed = shareUsername.trim();
-    if (!trimmed) return;
-    if (!isValidShareUsername) {
-      return;
-    }
-    if (isEmailInput && !forceEmailConfirm) {
-      setShowEmailWarning(true);
-      return;
-    }
-    setIsLoading(true);
-    setErrorMessage(null);
-    try {
-      await apiClient.post(`/api/v1/storage/files/${file.remoteStorageId}/shares/users`, {
-        username: trimmed,
-        accessRole: shareRole,
-      });
-      setSharedUsers((prev) => {
-        if (prev.some((user) => user.username === trimmed)) {
-          return prev.map((user) =>
-            user.username === trimmed ? { ...user, accessRole: shareRole } : user
-          );
-        }
-        return [...prev, { username: trimmed, accessRole: shareRole }].sort((a, b) =>
-          a.username.localeCompare(b.username)
-        );
-      });
-      setShareUsername('');
-      setShowEmailWarning(false);
-      alert({
-        alertType: 'success',
-        title: t('storageShare.userAdded', 'User added to shared list.'),
-        expandable: false,
-        durationMs: 2500,
-      });
-    } catch (error) {
-      console.error('Failed to share with user:', error);
-      setErrorMessage(
-        t('storageShare.userAddFailed', 'Unable to share with that user.')
-      );
-    } finally {
-      setIsLoading(false);
-    }
-  }, [file.remoteStorageId, isEmailInput, isValidShareUsername, shareRole, shareUsername, t]);
-
-  const handleUpdateUserRole = useCallback(
-    async (username: string, nextRole: 'editor' | 'commenter' | 'viewer') => {
+  const handleAddUser = useCallback(
+    async (forceEmailConfirm = false) => {
       if (!file.remoteStorageId) return;
+      const trimmed = shareUsername.trim();
+      if (!trimmed) return;
+      if (!isValidShareUsername) {
+        return;
+      }
+      if (isEmailInput && !forceEmailConfirm) {
+        setShowEmailWarning(true);
+        return;
+      }
       setIsLoading(true);
       setErrorMessage(null);
       try {
-        await apiClient.post(`/api/v1/storage/files/${file.remoteStorageId}/shares/users`, {
-          username,
-          accessRole: nextRole,
-        });
-        setSharedUsers((prev) =>
-          prev.map((user) =>
-            user.username === username ? { ...user, accessRole: nextRole } : user
-          )
+        await apiClient.post(
+          `/api/v1/storage/files/${file.remoteStorageId}/shares/users`,
+          {
+            username: trimmed,
+            accessRole: shareRole,
+          },
         );
+        setSharedUsers((prev) => {
+          if (prev.some((user) => user.username === trimmed)) {
+            return prev.map((user) =>
+              user.username === trimmed
+                ? { ...user, accessRole: shareRole }
+                : user,
+            );
+          }
+          return [...prev, { username: trimmed, accessRole: shareRole }].sort(
+            (a, b) => a.username.localeCompare(b.username),
+          );
+        });
+        setShareUsername("");
+        setShowEmailWarning(false);
         alert({
-          alertType: 'success',
-          title: t('storageShare.userAdded', 'User added to shared list.'),
+          alertType: "success",
+          title: t("storageShare.userAdded", "User added to shared list."),
           expandable: false,
           durationMs: 2500,
         });
       } catch (error) {
-        console.error('Failed to update shared user role:', error);
+        console.error("Failed to share with user:", error);
         setErrorMessage(
-          t('storageShare.userAddFailed', 'Unable to share with that user.')
+          t("storageShare.userAddFailed", "Unable to share with that user."),
         );
       } finally {
         setIsLoading(false);
       }
     },
-    [file.remoteStorageId, t]
+    [
+      file.remoteStorageId,
+      isEmailInput,
+      isValidShareUsername,
+      shareRole,
+      shareUsername,
+      t,
+    ],
   );
 
-  const handleRemoveUser = useCallback(async (username: string) => {
-    if (!file.remoteStorageId) return;
-    setIsLoading(true);
-    setErrorMessage(null);
-    setConfirmRemoveUser(null);
-    try {
-      await apiClient.delete(
-        `/api/v1/storage/files/${file.remoteStorageId}/shares/users/${encodeURIComponent(
-          username
-        )}`
-      );
-      setSharedUsers((prev) => prev.filter((user) => user.username !== username));
-      alert({
-        alertType: 'success',
-        title: t('storageShare.userRemoved', 'User removed from shared list.'),
-        expandable: false,
-        durationMs: 2500,
-      });
-    } catch (error) {
-      console.error('Failed to remove shared user:', error);
-      setErrorMessage(
-        t('storageShare.userRemoveFailed', 'Unable to remove that user.')
-      );
-    } finally {
-      setIsLoading(false);
-    }
-  }, [file.remoteStorageId, t]);
+  const handleUpdateUserRole = useCallback(
+    async (username: string, nextRole: "editor" | "commenter" | "viewer") => {
+      if (!file.remoteStorageId) return;
+      setIsLoading(true);
+      setErrorMessage(null);
+      try {
+        await apiClient.post(
+          `/api/v1/storage/files/${file.remoteStorageId}/shares/users`,
+          {
+            username,
+            accessRole: nextRole,
+          },
+        );
+        setSharedUsers((prev) =>
+          prev.map((user) =>
+            user.username === username
+              ? { ...user, accessRole: nextRole }
+              : user,
+          ),
+        );
+        alert({
+          alertType: "success",
+          title: t("storageShare.userAdded", "User added to shared list."),
+          expandable: false,
+          durationMs: 2500,
+        });
+      } catch (error) {
+        console.error("Failed to update shared user role:", error);
+        setErrorMessage(
+          t("storageShare.userAddFailed", "Unable to share with that user."),
+        );
+      } finally {
+        setIsLoading(false);
+      }
+    },
+    [file.remoteStorageId, t],
+  );
+
+  const handleRemoveUser = useCallback(
+    async (username: string) => {
+      if (!file.remoteStorageId) return;
+      setIsLoading(true);
+      setErrorMessage(null);
+      setConfirmRemoveUser(null);
+      try {
+        await apiClient.delete(
+          `/api/v1/storage/files/${file.remoteStorageId}/shares/users/${encodeURIComponent(username)}`,
+        );
+        setSharedUsers((prev) =>
+          prev.filter((user) => user.username !== username),
+        );
+        alert({
+          alertType: "success",
+          title: t(
+            "storageShare.userRemoved",
+            "User removed from shared list.",
+          ),
+          expandable: false,
+          durationMs: 2500,
+        });
+      } catch (error) {
+        console.error("Failed to remove shared user:", error);
+        setErrorMessage(
+          t("storageShare.userRemoveFailed", "Unable to remove that user."),
+        );
+      } finally {
+        setIsLoading(false);
+      }
+    },
+    [file.remoteStorageId, t],
+  );
 
   const selectedActivity = selectedActivityToken
     ? activityMap[selectedActivityToken]
@@ -396,7 +472,7 @@ const ShareManagementModal: React.FC<ShareManagementModalProps> = ({
       opened={opened}
       onClose={onClose}
       centered
-      title={t('storageShare.manageTitle', 'Manage Sharing')}
+      title={t("storageShare.manageTitle", "Manage Sharing")}
       zIndex={Z_INDEX_OVER_FILE_MANAGER_MODAL}
       size="xl"
       overlayProps={{ blur: 8 }}
@@ -404,21 +480,36 @@ const ShareManagementModal: React.FC<ShareManagementModalProps> = ({
       <Stack gap="lg">
         <Stack gap={4}>
           <Text size="sm" c="dimmed">
-            {t('storageShare.manageDescription', 'Create and manage links to share this file.')}
+            {t(
+              "storageShare.manageDescription",
+              "Create and manage links to share this file.",
+            )}
           </Text>
           <Text size="sm">
-            {t('storageShare.fileLabel', 'File')}: <Text span fw={600}>{file.name}</Text>
+            {t("storageShare.fileLabel", "File")}:{" "}
+            <Text span fw={600}>
+              {file.name}
+            </Text>
           </Text>
         </Stack>
 
         {errorMessage && (
-          <Alert color="red" title={t('storageShare.errorTitle', 'Sharing error')}>
+          <Alert
+            color="red"
+            title={t("storageShare.errorTitle", "Sharing error")}
+          >
             {errorMessage}
           </Alert>
         )}
         {!sharingEnabled && (
-          <Alert color="yellow" title={t('storageShare.sharingDisabled', 'Sharing is disabled.')}>
-            {t('storageShare.sharingDisabledBody', 'Sharing has been disabled by your server settings.')}
+          <Alert
+            color="yellow"
+            title={t("storageShare.sharingDisabled", "Sharing is disabled.")}
+          >
+            {t(
+              "storageShare.sharingDisabledBody",
+              "Sharing has been disabled by your server settings.",
+            )}
           </Alert>
         )}
 
@@ -429,23 +520,40 @@ const ShareManagementModal: React.FC<ShareManagementModalProps> = ({
                 <Stack gap="sm">
                   <Group justify="space-between">
                     <Text size="sm" fw={600}>
-                      {t('storageShare.linkAccessTitle', 'Share link access')}
+                      {t("storageShare.linkAccessTitle", "Share link access")}
                     </Text>
                   </Group>
                   <Select
-                    label={t('storageShare.roleLabel', 'Role')}
+                    label={t("storageShare.roleLabel", "Role")}
                     value={shareRole}
-                    onChange={(value) => setShareRole((value as typeof shareRole) || 'editor')}
-                    comboboxProps={{ withinPortal: true, zIndex: Z_INDEX_OVER_FILE_MANAGER_MODAL + 10 }}
+                    onChange={(value) =>
+                      setShareRole((value as typeof shareRole) || "editor")
+                    }
+                    comboboxProps={{
+                      withinPortal: true,
+                      zIndex: Z_INDEX_OVER_FILE_MANAGER_MODAL + 10,
+                    }}
                     data={[
-                      { value: 'editor', label: t('storageShare.roleEditor', 'Editor') },
-                      { value: 'commenter', label: t('storageShare.roleCommenter', 'Commenter') },
-                      { value: 'viewer', label: t('storageShare.roleViewer', 'Viewer') },
+                      {
+                        value: "editor",
+                        label: t("storageShare.roleEditor", "Editor"),
+                      },
+                      {
+                        value: "commenter",
+                        label: t("storageShare.roleCommenter", "Commenter"),
+                      },
+                      {
+                        value: "viewer",
+                        label: t("storageShare.roleViewer", "Viewer"),
+                      },
                     ]}
                   />
-                  {shareRole === 'commenter' && (
+                  {shareRole === "commenter" && (
                     <Text size="xs" c="dimmed">
-                      {t('storageShare.commenterHint', 'Commenting is coming soon.')}
+                      {t(
+                        "storageShare.commenterHint",
+                        "Commenting is coming soon.",
+                      )}
                     </Text>
                   )}
                   <Group justify="flex-end" gap="sm">
@@ -454,7 +562,7 @@ const ShareManagementModal: React.FC<ShareManagementModalProps> = ({
                       onClick={() => createShareLink()}
                       loading={isLoading}
                     >
-                      {t('storageShare.generate', 'Generate Link')}
+                      {t("storageShare.generate", "Generate Link")}
                     </Button>
                   </Group>
                 </Stack>
@@ -464,19 +572,22 @@ const ShareManagementModal: React.FC<ShareManagementModalProps> = ({
             <Paper withBorder radius="md" p="md">
               <Stack gap="sm">
                 <Text size="sm" fw={600}>
-                  {t('storageShare.sharedUsersTitle', 'Shared users')}
+                  {t("storageShare.sharedUsersTitle", "Shared users")}
                 </Text>
                 <Group align="flex-end" gap="sm">
                   <TextInput
-                    label={t('storageShare.usernameLabel', 'Username or email')}
-                    placeholder={t('storageShare.usernamePlaceholder', 'Enter a username or email')}
+                    label={t("storageShare.usernameLabel", "Username or email")}
+                    placeholder={t(
+                      "storageShare.usernamePlaceholder",
+                      "Enter a username or email",
+                    )}
                     value={shareUsername}
                     onChange={(event) => {
                       setShareUsername(event.currentTarget.value);
                       setShowEmailWarning(false);
                     }}
                     onKeyDown={(event) => {
-                      if (event.key === 'Enter') {
+                      if (event.key === "Enter") {
                         event.preventDefault();
                         void handleAddUser();
                       }
@@ -486,18 +597,27 @@ const ShareManagementModal: React.FC<ShareManagementModalProps> = ({
                   />
                   <Button
                     onClick={() => handleAddUser()}
-                    disabled={!sharingEnabled || isLoading || !normalizedShareUsername || !!shareUsernameError}
+                    disabled={
+                      !sharingEnabled ||
+                      isLoading ||
+                      !normalizedShareUsername ||
+                      !!shareUsernameError
+                    }
                   >
-                    {t('storageShare.addUser', 'Add')}
+                    {t("storageShare.addUser", "Add")}
                   </Button>
                 </Group>
                 {showEmailWarning && (
-                  <Alert color="yellow" title={t('storageShare.emailWarningTitle', 'Email address')} variant="light">
+                  <Alert
+                    color="yellow"
+                    title={t("storageShare.emailWarningTitle", "Email address")}
+                    variant="light"
+                  >
                     <Stack gap="xs">
                       <Text size="sm">
                         {t(
-                          'storageShare.emailWarningBody',
-                          'This looks like an email address. If this person is not already a Stirling PDF user, they will not be able to access the file.'
+                          "storageShare.emailWarningBody",
+                          "This looks like an email address. If this person is not already a Stirling PDF user, they will not be able to access the file.",
                         )}
                       </Text>
                       <Group justify="flex-end" gap="sm">
@@ -506,13 +626,16 @@ const ShareManagementModal: React.FC<ShareManagementModalProps> = ({
                           onClick={() => setShowEmailWarning(false)}
                           disabled={isLoading}
                         >
-                          {t('cancel', 'Cancel')}
+                          {t("cancel", "Cancel")}
                         </Button>
                         <Button
                           onClick={() => handleAddUser(true)}
                           loading={isLoading}
                         >
-                          {t('storageShare.emailWarningConfirm', 'Share anyway')}
+                          {t(
+                            "storageShare.emailWarningConfirm",
+                            "Share anyway",
+                          )}
                         </Button>
                       </Group>
                     </Stack>
@@ -520,32 +643,62 @@ const ShareManagementModal: React.FC<ShareManagementModalProps> = ({
                 )}
                 {sharedUsers.length === 0 ? (
                   <Text size="sm" c="dimmed">
-                    {t('storageShare.noSharedUsers', 'No users have access yet.')}
+                    {t(
+                      "storageShare.noSharedUsers",
+                      "No users have access yet.",
+                    )}
                   </Text>
                 ) : (
                   <Stack gap="xs">
                     {sharedUsers.map((user) => (
-                      <Group key={user.username} justify="space-between" align="flex-start">
+                      <Group
+                        key={user.username}
+                        justify="space-between"
+                        align="flex-start"
+                      >
                         <Stack gap={2}>
                           <Text size="sm">{user.username}</Text>
-                          {user.accessRole === 'commenter' && (
+                          {user.accessRole === "commenter" && (
                             <Text size="xs" c="dimmed">
-                              {t('storageShare.commenterHint', 'Commenting is coming soon.')}
+                              {t(
+                                "storageShare.commenterHint",
+                                "Commenting is coming soon.",
+                              )}
                             </Text>
                           )}
                         </Stack>
                         <Group gap="xs" align="center">
                           <Select
-                            value={user.accessRole ?? 'editor'}
+                            value={user.accessRole ?? "editor"}
                             onChange={(value) => {
-                              const nextRole = (value as 'editor' | 'commenter' | 'viewer') || 'editor';
-                              void handleUpdateUserRole(user.username, nextRole);
+                              const nextRole =
+                                (value as "editor" | "commenter" | "viewer") ||
+                                "editor";
+                              void handleUpdateUserRole(
+                                user.username,
+                                nextRole,
+                              );
+                            }}
+                            comboboxProps={{
+                              withinPortal: true,
+                              zIndex: Z_INDEX_OVER_FILE_MANAGER_MODAL + 10,
                             }}
-                            comboboxProps={{ withinPortal: true, zIndex: Z_INDEX_OVER_FILE_MANAGER_MODAL + 10 }}
                             data={[
-                              { value: 'editor', label: t('storageShare.roleEditor', 'Editor') },
-                              { value: 'commenter', label: t('storageShare.roleCommenter', 'Commenter') },
-                              { value: 'viewer', label: t('storageShare.roleViewer', 'Viewer') },
+                              {
+                                value: "editor",
+                                label: t("storageShare.roleEditor", "Editor"),
+                              },
+                              {
+                                value: "commenter",
+                                label: t(
+                                  "storageShare.roleCommenter",
+                                  "Commenter",
+                                ),
+                              },
+                              {
+                                value: "viewer",
+                                label: t("storageShare.roleViewer", "Viewer"),
+                              },
                             ]}
                             size="xs"
                           />
@@ -555,17 +708,19 @@ const ShareManagementModal: React.FC<ShareManagementModalProps> = ({
                                 variant="filled"
                                 size="xs"
                                 color="red"
-                                onClick={() => { void handleRemoveUser(user.username); }}
+                                onClick={() => {
+                                  void handleRemoveUser(user.username);
+                                }}
                                 loading={isLoading}
                               >
-                                {t('confirm', 'Confirm')}
+                                {t("confirm", "Confirm")}
                               </Button>
                               <Button
                                 variant="default"
                                 size="xs"
                                 onClick={() => setConfirmRemoveUser(null)}
                               >
-                                {t('cancel', 'Cancel')}
+                                {t("cancel", "Cancel")}
                               </Button>
                             </Group>
                           ) : (
@@ -573,11 +728,15 @@ const ShareManagementModal: React.FC<ShareManagementModalProps> = ({
                               variant="light"
                               size="xs"
                               color="red"
-                              leftSection={<DeleteIcon style={{ fontSize: 16 }} />}
-                              onClick={() => setConfirmRemoveUser(user.username)}
+                              leftSection={
+                                <DeleteIcon style={{ fontSize: 16 }} />
+                              }
+                              onClick={() =>
+                                setConfirmRemoveUser(user.username)
+                              }
                               disabled={isLoading}
                             >
-                              {t('storageShare.removeUser', 'Remove')}
+                              {t("storageShare.removeUser", "Remove")}
                             </Button>
                           )}
                         </Group>
@@ -593,7 +752,7 @@ const ShareManagementModal: React.FC<ShareManagementModalProps> = ({
                 <Stack gap="sm">
                   <Group justify="space-between">
                     <Text size="sm" fw={600}>
-                      {t('storageShare.linkLabel', 'Share link')}
+                      {t("storageShare.linkLabel", "Share link")}
                     </Text>
                     {shareLinks.length > 0 && (
                       <Badge variant="light" color="blue">
@@ -604,14 +763,19 @@ const ShareManagementModal: React.FC<ShareManagementModalProps> = ({
 
                   {shareLinks.length === 0 && !isLoading && (
                     <Text size="sm" c="dimmed">
-                      {t('storageShare.noLinks', 'No active share links yet.')}
+                      {t("storageShare.noLinks", "No active share links yet.")}
                     </Text>
                   )}
 
                   {shareLinks.map((link) => {
                     const activity = activityMap[link.token];
-                    const viewCount = activity?.filter((entry) => entry.accessType === 'VIEW').length ?? 0;
-                    const downloadCount = activity?.filter((entry) => entry.accessType === 'DOWNLOAD').length ?? 0;
+                    const viewCount =
+                      activity?.filter((entry) => entry.accessType === "VIEW")
+                        .length ?? 0;
+                    const downloadCount =
+                      activity?.filter(
+                        (entry) => entry.accessType === "DOWNLOAD",
+                      ).length ?? 0;
                     const lastAccessedAt = activity?.[0]?.accessedAt;
                     const isSelected = selectedActivityToken === link.token;
                     return (
@@ -620,15 +784,19 @@ const ShareManagementModal: React.FC<ShareManagementModalProps> = ({
                           <TextInput
                             readOnly
                             value={`${shareBaseUrl}${link.token}`}
-                            label={t('storageShare.linkLabel', 'Share link')}
+                            label={t("storageShare.linkLabel", "Share link")}
                             rightSection={
                               <Button
                                 variant="subtle"
                                 size="xs"
-                                leftSection={<ContentCopyRoundedIcon style={{ fontSize: 16 }} />}
+                                leftSection={
+                                  <ContentCopyRoundedIcon
+                                    style={{ fontSize: 16 }}
+                                  />
+                                }
                                 onClick={() => handleCopyLink(link.token)}
                               >
-                                {t('storageShare.copy', 'Copy')}
+                                {t("storageShare.copy", "Copy")}
                               </Button>
                             }
                           />
@@ -637,40 +805,69 @@ const ShareManagementModal: React.FC<ShareManagementModalProps> = ({
                               <Group gap="xs">
                                 {link.accessRole && (
                                   <Badge variant="light" color="gray">
-                                    {link.accessRole === 'editor'
-                                      ? t('storageShare.roleEditor', 'Editor')
-                                      : link.accessRole === 'commenter'
-                                        ? t('storageShare.roleCommenter', 'Commenter')
-                                        : t('storageShare.roleViewer', 'Viewer')}
+                                    {link.accessRole === "editor"
+                                      ? t("storageShare.roleEditor", "Editor")
+                                      : link.accessRole === "commenter"
+                                        ? t(
+                                            "storageShare.roleCommenter",
+                                            "Commenter",
+                                          )
+                                        : t(
+                                            "storageShare.roleViewer",
+                                            "Viewer",
+                                          )}
                                   </Badge>
                                 )}
                               </Group>
                               <Group gap="sm" align="center">
                                 <Text size="xs" c="dimmed">
-                                  {t('storageShare.viewsCount', 'Views: {{count}}', { count: viewCount })}
+                                  {t(
+                                    "storageShare.viewsCount",
+                                    "Views: {{count}}",
+                                    { count: viewCount },
+                                  )}
                                 </Text>
                                 <Text size="xs" c="dimmed">
-                                  {t('storageShare.downloadsCount', 'Downloads: {{count}}', { count: downloadCount })}
+                                  {t(
+                                    "storageShare.downloadsCount",
+                                    "Downloads: {{count}}",
+                                    { count: downloadCount },
+                                  )}
                                 </Text>
                                 {lastAccessedAt && (
                                   <Text size="xs" c="dimmed">
-                                    {t('storageShare.lastAccessed', 'Last accessed')}: {new Date(lastAccessedAt).toLocaleString()}
+                                    {t(
+                                      "storageShare.lastAccessed",
+                                      "Last accessed",
+                                    )}
+                                    :{" "}
+                                    {new Date(lastAccessedAt).toLocaleString()}
                                   </Text>
                                 )}
                               </Group>
                             </Stack>
                             <Group gap="xs">
                               <Button
-                                variant={isSelected ? 'filled' : 'light'}
+                                variant={isSelected ? "filled" : "light"}
                                 size="xs"
-                                leftSection={<HistoryIcon style={{ fontSize: 16 }} />}
+                                leftSection={
+                                  <HistoryIcon style={{ fontSize: 16 }} />
+                                }
                                 onClick={() =>
-                                  setSelectedActivityToken((prev) => (prev === link.token ? null : link.token))
+                                  setSelectedActivityToken((prev) =>
+                                    prev === link.token ? null : link.token,
+                                  )
                                 }
                               >
                                 {isSelected
-                                  ? t('storageShare.hideActivity', 'Hide activity')
-                                  : t('storageShare.viewActivity', 'View activity')}
+                                  ? t(
+                                      "storageShare.hideActivity",
+                                      "Hide activity",
+                                    )
+                                  : t(
+                                      "storageShare.viewActivity",
+                                      "View activity",
+                                    )}
                               </Button>
                               {confirmRevokeToken === link.token ? (
                                 <Group gap="xs">
@@ -678,17 +875,19 @@ const ShareManagementModal: React.FC<ShareManagementModalProps> = ({
                                     variant="filled"
                                     size="xs"
                                     color="red"
-                                    onClick={() => { void handleRevokeLink(link.token); }}
+                                    onClick={() => {
+                                      void handleRevokeLink(link.token);
+                                    }}
                                     loading={isLoading}
                                   >
-                                    {t('confirm', 'Confirm')}
+                                    {t("confirm", "Confirm")}
                                   </Button>
                                   <Button
                                     variant="default"
                                     size="xs"
                                     onClick={() => setConfirmRevokeToken(null)}
                                   >
-                                    {t('cancel', 'Cancel')}
+                                    {t("cancel", "Cancel")}
                                   </Button>
                                 </Group>
                               ) : (
@@ -696,11 +895,15 @@ const ShareManagementModal: React.FC<ShareManagementModalProps> = ({
                                   variant="light"
                                   size="xs"
                                   color="red"
-                                  leftSection={<DeleteIcon style={{ fontSize: 16 }} />}
-                                  onClick={() => setConfirmRevokeToken(link.token)}
+                                  leftSection={
+                                    <DeleteIcon style={{ fontSize: 16 }} />
+                                  }
+                                  onClick={() =>
+                                    setConfirmRevokeToken(link.token)
+                                  }
                                   disabled={isLoading}
                                 >
-                                  {t('storageShare.removeLink', 'Remove link')}
+                                  {t("storageShare.removeLink", "Remove link")}
                                 </Button>
                               )}
                             </Group>
@@ -719,21 +922,21 @@ const ShareManagementModal: React.FC<ShareManagementModalProps> = ({
               <Stack gap="sm">
                 <Group justify="space-between">
                   <Text size="sm" fw={600}>
-                    {t('storageShare.viewActivity', 'View activity')}
+                    {t("storageShare.viewActivity", "View activity")}
                   </Text>
                   {selectedLink && selectedLink.accessRole && (
                     <Badge variant="light" color="gray">
-                      {selectedLink.accessRole === 'editor'
-                        ? t('storageShare.roleEditor', 'Editor')
-                        : selectedLink.accessRole === 'commenter'
-                          ? t('storageShare.roleCommenter', 'Commenter')
-                          : t('storageShare.roleViewer', 'Viewer')}
+                      {selectedLink.accessRole === "editor"
+                        ? t("storageShare.roleEditor", "Editor")
+                        : selectedLink.accessRole === "commenter"
+                          ? t("storageShare.roleCommenter", "Commenter")
+                          : t("storageShare.roleViewer", "Viewer")}
                     </Badge>
                   )}
                 </Group>
                 {!selectedActivityToken && (
                   <Text size="sm" c="dimmed">
-                    {t('storageShare.noActivity', 'No activity yet.')}
+                    {t("storageShare.noActivity", "No activity yet.")}
                   </Text>
                 )}
                 {selectedActivityToken && (
@@ -741,31 +944,42 @@ const ShareManagementModal: React.FC<ShareManagementModalProps> = ({
                     <Stack gap="xs">
                       {(selectedActivity ?? []).length > 0 ? (
                         selectedActivity?.map((entry, index) => (
-                          <Paper key={`${selectedActivityToken}-${index}`} radius="md" p="xs" withBorder>
+                          <Paper
+                            key={`${selectedActivityToken}-${index}`}
+                            radius="md"
+                            p="xs"
+                            withBorder
+                          >
                             <Group justify="space-between">
                               <Stack gap={2}>
                                 <Text size="xs" c="dimmed">
                                   {entry.accessedAt
-                                    ? new Date(entry.accessedAt).toLocaleString()
-                                    : t('unknown', 'Unknown')}
+                                    ? new Date(
+                                        entry.accessedAt,
+                                      ).toLocaleString()
+                                    : t("unknown", "Unknown")}
                                 </Text>
                                 <Text size="sm">
-                                  {entry.username || t('storageShare.unknownUser', 'Unknown user')}
+                                  {entry.username ||
+                                    t(
+                                      "storageShare.unknownUser",
+                                      "Unknown user",
+                                    )}
                                 </Text>
                               </Stack>
                               <Badge size="sm" variant="light">
-                                {entry.accessType === 'VIEW'
-                                  ? t('storageShare.viewed', 'Viewed')
-                                  : entry.accessType === 'DOWNLOAD'
-                                    ? t('storageShare.downloaded', 'Downloaded')
-                                    : t('storageShare.accessed', 'Accessed')}
+                                {entry.accessType === "VIEW"
+                                  ? t("storageShare.viewed", "Viewed")
+                                  : entry.accessType === "DOWNLOAD"
+                                    ? t("storageShare.downloaded", "Downloaded")
+                                    : t("storageShare.accessed", "Accessed")}
                               </Badge>
                             </Group>
                           </Paper>
                         ))
                       ) : (
                         <Text size="sm" c="dimmed">
-                          {t('storageShare.noActivity', 'No activity yet.')}
+                          {t("storageShare.noActivity", "No activity yet.")}
                         </Text>
                       )}
                     </Stack>
diff --git a/frontend/src/core/components/shared/SkeletonLoader.tsx b/frontend/src/core/components/shared/SkeletonLoader.tsx
index a95949e8f2..55cab42e47 100644
--- a/frontend/src/core/components/shared/SkeletonLoader.tsx
+++ b/frontend/src/core/components/shared/SkeletonLoader.tsx
@@ -1,8 +1,8 @@
-import React from 'react';
-import { Box, Group, Stack } from '@mantine/core';
+import React from "react";
+import { Box, Group, Stack } from "@mantine/core";
 
 interface SkeletonLoaderProps {
-  type: 'pageGrid' | 'fileGrid' | 'controls' | 'viewer' | 'block';
+  type: "pageGrid" | "fileGrid" | "controls" | "viewer" | "block";
   count?: number;
   animated?: boolean;
   width?: number | string;
@@ -18,29 +18,31 @@ const SkeletonLoader: React.FC<SkeletonLoaderProps> = ({
   height,
   radius = 8,
 }) => {
-  const animationStyle = animated ? { animation: 'pulse 2s infinite' } : {};
+  const animationStyle = animated ? { animation: "pulse 2s infinite" } : {};
 
   // Generic block skeleton for inline text/inputs/etc.
   const renderBlock = () => (
     <Box
-      w={typeof width === 'number' ? `${width}px` : width}
-      h={typeof height === 'number' ? `${height}px` : height}
+      w={typeof width === "number" ? `${width}px` : width}
+      h={typeof height === "number" ? `${height}px` : height}
       bg="gray.1"
       style={{
         borderRadius: radius,
-        display: 'inline-block',
-        verticalAlign: 'middle',
-        ...animationStyle
+        display: "inline-block",
+        verticalAlign: "middle",
+        ...animationStyle,
       }}
     />
   );
 
   const renderPageGridSkeleton = () => (
-    <div style={{
-      display: 'grid',
-      gridTemplateColumns: 'repeat(auto-fill, minmax(180px, 1fr))',
-      gap: '1rem'
-    }}>
+    <div
+      style={{
+        display: "grid",
+        gridTemplateColumns: "repeat(auto-fill, minmax(180px, 1fr))",
+        gap: "1rem",
+      }}
+    >
       {Array.from({ length: count }).map((_, i) => (
         <Box
           key={i}
@@ -48,9 +50,9 @@ const SkeletonLoader: React.FC<SkeletonLoaderProps> = ({
           h={240}
           bg="gray.1"
           style={{
-            borderRadius: '8px',
+            borderRadius: "8px",
             ...animationStyle,
-            animationDelay: animated ? `${i * 0.1}s` : undefined
+            animationDelay: animated ? `${i * 0.1}s` : undefined,
           }}
         />
       ))}
@@ -58,11 +60,13 @@ const SkeletonLoader: React.FC<SkeletonLoaderProps> = ({
   );
 
   const renderFileGridSkeleton = () => (
-    <div style={{
-      display: 'grid',
-      gridTemplateColumns: 'repeat(auto-fill, minmax(200px, 1fr))',
-      gap: '1rem'
-    }}>
+    <div
+      style={{
+        display: "grid",
+        gridTemplateColumns: "repeat(auto-fill, minmax(200px, 1fr))",
+        gap: "1rem",
+      }}
+    >
       {Array.from({ length: count }).map((_, i) => (
         <Box
           key={i}
@@ -70,9 +74,9 @@ const SkeletonLoader: React.FC<SkeletonLoaderProps> = ({
           h={280}
           bg="gray.1"
           style={{
-            borderRadius: '8px',
+            borderRadius: "8px",
             ...animationStyle,
-            animationDelay: animated ? `${i * 0.1}s` : undefined
+            animationDelay: animated ? `${i * 0.1}s` : undefined,
           }}
         />
       ))}
@@ -81,9 +85,24 @@ const SkeletonLoader: React.FC<SkeletonLoaderProps> = ({
 
   const renderControlsSkeleton = () => (
     <Group mb="md">
-      <Box w={150} h={36} bg="gray.1" style={{ borderRadius: 4, ...animationStyle }} />
-      <Box w={120} h={36} bg="gray.1" style={{ borderRadius: 4, ...animationStyle }} />
-      <Box w={100} h={36} bg="gray.1" style={{ borderRadius: 4, ...animationStyle }} />
+      <Box
+        w={150}
+        h={36}
+        bg="gray.1"
+        style={{ borderRadius: 4, ...animationStyle }}
+      />
+      <Box
+        w={120}
+        h={36}
+        bg="gray.1"
+        style={{ borderRadius: 4, ...animationStyle }}
+      />
+      <Box
+        w={100}
+        h={36}
+        bg="gray.1"
+        style={{ borderRadius: 4, ...animationStyle }}
+      />
     </Group>
   );
 
@@ -91,33 +110,53 @@ const SkeletonLoader: React.FC<SkeletonLoaderProps> = ({
     <Stack gap="md" h="100%">
       {/* Toolbar skeleton */}
       <Group>
-        <Box w={40} h={40} bg="gray.1" style={{ borderRadius: 4, ...animationStyle }} />
-        <Box w={40} h={40} bg="gray.1" style={{ borderRadius: 4, ...animationStyle }} />
-        <Box w={80} h={40} bg="gray.1" style={{ borderRadius: 4, ...animationStyle }} />
-        <Box w={40} h={40} bg="gray.1" style={{ borderRadius: 4, ...animationStyle }} />
+        <Box
+          w={40}
+          h={40}
+          bg="gray.1"
+          style={{ borderRadius: 4, ...animationStyle }}
+        />
+        <Box
+          w={40}
+          h={40}
+          bg="gray.1"
+          style={{ borderRadius: 4, ...animationStyle }}
+        />
+        <Box
+          w={80}
+          h={40}
+          bg="gray.1"
+          style={{ borderRadius: 4, ...animationStyle }}
+        />
+        <Box
+          w={40}
+          h={40}
+          bg="gray.1"
+          style={{ borderRadius: 4, ...animationStyle }}
+        />
       </Group>
       {/* Main content skeleton */}
       <Box
         flex={1}
         bg="gray.1"
         style={{
-          borderRadius: '8px',
-          ...animationStyle
+          borderRadius: "8px",
+          ...animationStyle,
         }}
       />
     </Stack>
   );
 
   switch (type) {
-    case 'block':
+    case "block":
       return renderBlock();
-    case 'pageGrid':
+    case "pageGrid":
       return renderPageGridSkeleton();
-    case 'fileGrid':
+    case "fileGrid":
       return renderFileGridSkeleton();
-    case 'controls':
+    case "controls":
       return renderControlsSkeleton();
-    case 'viewer':
+    case "viewer":
       return renderViewerSkeleton();
     default:
       return null;
diff --git a/frontend/src/core/components/shared/TextInput.tsx b/frontend/src/core/components/shared/TextInput.tsx
index 0203e83c07..12725f44e4 100644
--- a/frontend/src/core/components/shared/TextInput.tsx
+++ b/frontend/src/core/components/shared/TextInput.tsx
@@ -1,7 +1,6 @@
-import React, { forwardRef } from 'react';
-import { useMantineColorScheme } from '@mantine/core';
-import LocalIcon from '@app/components/shared/LocalIcon';
-import styles from '@app/components/shared/textInput/TextInput.module.css';
+import React, { forwardRef } from "react";
+import LocalIcon from "@app/components/shared/LocalIcon";
+import styles from "@app/components/shared/textInput/TextInput.module.css";
 
 /**
  * Props for the TextInput component
@@ -34,86 +33,90 @@ export interface TextInputProps {
   /** Whether the input is read-only (default: false) */
   readOnly?: boolean;
   /** Accessibility label */
-  'aria-label'?: string;
+  "aria-label"?: string;
   /** Focus event handler */
   onFocus?: () => void;
 }
 
-export const TextInput = forwardRef<HTMLInputElement, TextInputProps>(({
-  id,
-  name,
-  value,
-  onChange,
-  placeholder,
-  icon,
-  showClearButton = true,
-  onClear,
-  className = '',
-  style,
-  autoComplete = 'off',
-  disabled = false,
-  readOnly = false,
-  'aria-label': ariaLabel,
-  onFocus,
-  ...props
-}, ref) => {
-  const { colorScheme } = useMantineColorScheme();
+export const TextInput = forwardRef<HTMLInputElement, TextInputProps>(
+  (
+    {
+      id,
+      name,
+      value,
+      onChange,
+      placeholder,
+      icon,
+      showClearButton = true,
+      onClear,
+      className = "",
+      style,
+      autoComplete = "off",
+      disabled = false,
+      readOnly = false,
+      "aria-label": ariaLabel,
+      onFocus,
+      ...props
+    },
+    ref,
+  ) => {
+    const handleClear = () => {
+      if (onClear) {
+        onClear();
+      } else {
+        onChange("");
+      }
+    };
 
-  const handleClear = () => {
-    if (onClear) {
-      onClear();
-    } else {
-      onChange('');
-    }
-  };
+    const shouldShowClearButton =
+      showClearButton && value.trim().length > 0 && !disabled && !readOnly;
 
-  const shouldShowClearButton = showClearButton && value.trim().length > 0 && !disabled && !readOnly;
+    return (
+      <div className={`${styles.container} ${className}`} style={style}>
+        {icon && (
+          <span
+            className={styles.icon}
+            style={{ color: "var(--search-text-and-icon-color)" }}
+          >
+            {icon}
+          </span>
+        )}
+        <input
+          ref={ref}
+          type="text"
+          id={id}
+          name={name}
+          placeholder={placeholder}
+          value={value}
+          onChange={(e) => onChange(e.currentTarget.value)}
+          autoComplete={autoComplete}
+          className={styles.input}
+          disabled={disabled}
+          readOnly={readOnly}
+          aria-label={ariaLabel}
+          onFocus={onFocus}
+          style={{
+            backgroundColor: "var(--input-bg)",
+            color: "var(--search-text-and-icon-color)",
+            paddingRight: shouldShowClearButton ? "40px" : "12px",
+            paddingLeft: icon ? "40px" : "12px",
+          }}
+          {...props}
+        />
+        {shouldShowClearButton && (
+          <button
+            type="button"
+            className={styles.clearButton}
+            onClick={handleClear}
+            style={{ color: "var(--search-text-and-icon-color)" }}
+            aria-label="Clear input"
+          >
+            <LocalIcon icon="close-rounded" width="1.25rem" height="1.25rem" />
+          </button>
+        )}
+      </div>
+    );
+  },
+);
 
-  return (
-    <div className={`${styles.container} ${className}`} style={style}>
-      {icon && (
-        <span
-          className={styles.icon}
-          style={{ color: colorScheme === 'dark' ? '#FFFFFF' : '#6B7382' }}
-        >
-          {icon}
-        </span>
-      )}
-      <input
-        ref={ref}
-        type="text"
-        id={id}
-        name={name}
-        placeholder={placeholder}
-        value={value}
-        onChange={(e) => onChange(e.currentTarget.value)}
-        autoComplete={autoComplete}
-        className={styles.input}
-        disabled={disabled}
-        readOnly={readOnly}
-        aria-label={ariaLabel}
-        onFocus={onFocus}
-        style={{
-          backgroundColor: colorScheme === 'dark' ? '#4B525A' : '#FFFFFF',
-          color: colorScheme === 'dark' ? '#FFFFFF' : '#6B7382',
-          paddingRight: shouldShowClearButton ? '40px' : '12px',
-          paddingLeft: icon ? '40px' : '12px',
-        }}
-        {...props}
-      />
-      {shouldShowClearButton && (
-        <button
-          type="button"
-          className={styles.clearButton}
-          onClick={handleClear}
-          style={{ color: colorScheme === 'dark' ? '#FFFFFF' : '#6B7382' }}
-          aria-label="Clear input"
-        >
-          <LocalIcon icon="close-rounded" width="1.25rem" height="1.25rem" />
-        </button>
-      )}
-    </div>
-  );
-});
-
-TextInput.displayName = 'TextInput';
+TextInput.displayName = "TextInput";
diff --git a/frontend/src/core/components/shared/ToolChain.tsx b/frontend/src/core/components/shared/ToolChain.tsx
index c67d894273..31f05eef01 100644
--- a/frontend/src/core/components/shared/ToolChain.tsx
+++ b/frontend/src/core/components/shared/ToolChain.tsx
@@ -3,63 +3,66 @@
  * Used across FileListItem, FileDetails, and FileThumbnail for consistent display
  */
 
-import React from 'react';
-import { Text, Tooltip, Badge, Group } from '@mantine/core';
-import { ToolOperation } from '@app/types/file';
-import { useTranslation } from 'react-i18next';
-import { ToolId } from '@app/types/toolId';
+import React from "react";
+import { Text, Tooltip, Badge, Group } from "@mantine/core";
+import { ToolOperation } from "@app/types/file";
+import { useTranslation } from "react-i18next";
+import { ToolId } from "@app/types/toolId";
 
 interface ToolChainProps {
   toolChain: ToolOperation[];
   maxWidth?: string;
-  displayStyle?: 'text' | 'badges' | 'compact';
-  size?: 'xs' | 'sm' | 'md';
+  displayStyle?: "text" | "badges" | "compact";
+  size?: "xs" | "sm" | "md";
   color?: string;
 }
 
 const ToolChain: React.FC<ToolChainProps> = ({
   toolChain,
-  maxWidth = '100%',
-  displayStyle = 'text',
-  size = 'xs',
-  color = 'var(--mantine-color-blue-7)'
+  maxWidth = "100%",
+  displayStyle = "text",
+  size = "xs",
+  color = "var(--mantine-color-blue-7)",
 }) => {
   const { t } = useTranslation();
   if (!toolChain || toolChain.length === 0) return null;
 
-  const toolIds = toolChain.map(tool => tool.toolId);
+  const toolIds = toolChain.map((tool) => tool.toolId);
 
   const getToolName = (toolId: ToolId) => {
     return t(`home.${toolId}.title`, toolId);
   };
 
   // Create full tool chain for tooltip
-  const fullChainDisplay = displayStyle === 'badges' ? (
-    <Group gap="xs" wrap="wrap">
-      {toolChain.map((tool, index) => (
-        <React.Fragment key={`${tool.toolId}-${index}`}>
-          <Badge size="sm" variant="light" color="blue">
-            {getToolName(tool.toolId)}
-          </Badge>
-          {index < toolChain.length - 1 && (
-            <Text size="sm" c="dimmed">→</Text>
-          )}
-        </React.Fragment>
-      ))}
-    </Group>
-  ) : (
-    <Text size="sm">{toolIds.map(getToolName).join(' → ')}</Text>
-  );
+  const fullChainDisplay =
+    displayStyle === "badges" ? (
+      <Group gap="xs" wrap="wrap">
+        {toolChain.map((tool, index) => (
+          <React.Fragment key={`${tool.toolId}-${index}`}>
+            <Badge size="sm" variant="light" color="blue">
+              {getToolName(tool.toolId)}
+            </Badge>
+            {index < toolChain.length - 1 && (
+              <Text size="sm" c="dimmed">
+                →
+              </Text>
+            )}
+          </React.Fragment>
+        ))}
+      </Group>
+    ) : (
+      <Text size="sm">{toolIds.map(getToolName).join(" → ")}</Text>
+    );
 
   // Create truncated display based on available space
   const getTruncatedDisplay = () => {
     if (toolIds.length <= 2) {
       // Show all tools if 2 or fewer
-      return { text: toolIds.map(getToolName).join(' → '), isTruncated: false };
+      return { text: toolIds.map(getToolName).join(" → "), isTruncated: false };
     } else {
       // Show first tool ... last tool for longer chains
       return {
-        text: `${getToolName(toolIds[0])} → +${toolIds.length-2} → ${getToolName(toolIds[toolIds.length - 1])}`,
+        text: `${getToolName(toolIds[0])} → +${toolIds.length - 2} → ${getToolName(toolIds[toolIds.length - 1])}`,
         isTruncated: true,
       };
     }
@@ -68,8 +71,11 @@ const ToolChain: React.FC<ToolChainProps> = ({
   const { text: truncatedText, isTruncated } = getTruncatedDisplay();
 
   // Compact style for very small spaces
-  if (displayStyle === 'compact') {
-    const compactText = toolIds.length === 1 ? getToolName(toolIds[0]) : `${toolIds.length} tools`;
+  if (displayStyle === "compact") {
+    const compactText =
+      toolIds.length === 1
+        ? getToolName(toolIds[0])
+        : `${toolIds.length} tools`;
     const isCompactTruncated = toolIds.length > 1;
 
     const compactElement = (
@@ -78,11 +84,11 @@ const ToolChain: React.FC<ToolChainProps> = ({
         style={{
           color,
           fontWeight: 500,
-          whiteSpace: 'nowrap',
-          overflow: 'hidden',
-          textOverflow: 'ellipsis',
+          whiteSpace: "nowrap",
+          overflow: "hidden",
+          textOverflow: "ellipsis",
           maxWidth: `${maxWidth}`,
-          cursor: isCompactTruncated ? 'help' : 'default'
+          cursor: isCompactTruncated ? "help" : "default",
         }}
       >
         {compactText}
@@ -93,15 +99,17 @@ const ToolChain: React.FC<ToolChainProps> = ({
       <Tooltip label={fullChainDisplay} multiline withinPortal>
         {compactElement}
       </Tooltip>
-    ) : compactElement;
+    ) : (
+      compactElement
+    );
   }
 
   // Badge style for file details
-  if (displayStyle === 'badges') {
+  if (displayStyle === "badges") {
     const isBadgesTruncated = toolChain.length > 3;
 
     const badgesElement = (
-      <div style={{ maxWidth: `${maxWidth}`, overflow: 'hidden' }}>
+      <div style={{ maxWidth: `${maxWidth}`, overflow: "hidden" }}>
         <Group gap="2px" wrap="nowrap">
           {toolChain.slice(0, 3).map((tool, index) => (
             <React.Fragment key={`${tool.toolId}-${index}`}>
@@ -109,13 +117,17 @@ const ToolChain: React.FC<ToolChainProps> = ({
                 {getToolName(tool.toolId)}
               </Badge>
               {index < Math.min(toolChain.length - 1, 2) && (
-                <Text size="xs" c="dimmed">→</Text>
+                <Text size="xs" c="dimmed">
+                  →
+                </Text>
               )}
             </React.Fragment>
           ))}
           {toolChain.length > 3 && (
             <>
-              <Text size="xs" c="dimmed">...</Text>
+              <Text size="xs" c="dimmed">
+                ...
+              </Text>
               <Badge size={size} variant="light" color="blue">
                 {getToolName(toolChain[toolChain.length - 1].toolId)}
               </Badge>
@@ -126,10 +138,12 @@ const ToolChain: React.FC<ToolChainProps> = ({
     );
 
     return isBadgesTruncated ? (
-      <Tooltip label={`${toolIds.map(getToolName).join(' → ')}`} withinPortal>
+      <Tooltip label={`${toolIds.map(getToolName).join(" → ")}`} withinPortal>
         {badgesElement}
       </Tooltip>
-    ) : badgesElement;
+    ) : (
+      badgesElement
+    );
   }
 
   // Text style (default) for file list items
@@ -139,11 +153,11 @@ const ToolChain: React.FC<ToolChainProps> = ({
       style={{
         color,
         fontWeight: 500,
-        whiteSpace: 'nowrap',
-        overflow: 'hidden',
-        textOverflow: 'ellipsis',
+        whiteSpace: "nowrap",
+        overflow: "hidden",
+        textOverflow: "ellipsis",
         maxWidth: `${maxWidth}`,
-        cursor: isTruncated ? 'help' : 'default'
+        cursor: isTruncated ? "help" : "default",
       }}
     >
       {truncatedText}
@@ -154,7 +168,9 @@ const ToolChain: React.FC<ToolChainProps> = ({
     <Tooltip label={fullChainDisplay} withinPortal>
       {textElement}
     </Tooltip>
-  ) : textElement;
+  ) : (
+    textElement
+  );
 };
 
 export default ToolChain;
diff --git a/frontend/src/core/components/shared/ToolIcon.tsx b/frontend/src/core/components/shared/ToolIcon.tsx
index 75ab249ba7..d0a1c82b9b 100644
--- a/frontend/src/core/components/shared/ToolIcon.tsx
+++ b/frontend/src/core/components/shared/ToolIcon.tsx
@@ -15,7 +15,7 @@ export const ToolIcon: React.FC<ToolIconProps> = ({
   icon,
   opacity = 1,
   color = "var(--tools-text-and-icon-color)",
-  marginRight = "0.5rem"
+  marginRight = "0.5rem",
 }) => {
   return (
     <div
@@ -25,7 +25,7 @@ export const ToolIcon: React.FC<ToolIconProps> = ({
         marginRight,
         transform: "scale(0.8)",
         transformOrigin: "center",
-        opacity
+        opacity,
       }}
     >
       {icon}
diff --git a/frontend/src/core/components/shared/Tooltip.tsx b/frontend/src/core/components/shared/Tooltip.tsx
index 2580b3530a..b6dadb9f75 100644
--- a/frontend/src/core/components/shared/Tooltip.tsx
+++ b/frontend/src/core/components/shared/Tooltip.tsx
@@ -1,18 +1,24 @@
-import React, { useState, useRef, useEffect, useMemo, useCallback } from 'react';
-import { createPortal } from 'react-dom';
-import LocalIcon from '@app/components/shared/LocalIcon';
-import { addEventListenerWithCleanup } from '@app/utils/genericUtils';
-import { useTooltipPosition } from '@app/hooks/useTooltipPosition';
-import { TooltipTip } from '@app/types/tips';
-import { TooltipContent } from '@app/components/shared/tooltip/TooltipContent';
-import { useSidebarContext } from '@app/contexts/SidebarContext';
-import { useLogoAssets } from '@app/hooks/useLogoAssets';
-import styles from '@app/components/shared/tooltip/Tooltip.module.css';
-import { Z_INDEX_OVER_FULLSCREEN_SURFACE } from '@app/styles/zIndex';
+import React, {
+  useState,
+  useRef,
+  useEffect,
+  useMemo,
+  useCallback,
+} from "react";
+import { createPortal } from "react-dom";
+import LocalIcon from "@app/components/shared/LocalIcon";
+import { addEventListenerWithCleanup } from "@app/utils/genericUtils";
+import { useTooltipPosition } from "@app/hooks/useTooltipPosition";
+import { TooltipTip } from "@app/types/tips";
+import { TooltipContent } from "@app/components/shared/tooltip/TooltipContent";
+import { useSidebarContext } from "@app/contexts/SidebarContext";
+import { useLogoAssets } from "@app/hooks/useLogoAssets";
+import styles from "@app/components/shared/tooltip/Tooltip.module.css";
+import { Z_INDEX_OVER_FULLSCREEN_SURFACE } from "@app/styles/zIndex";
 
 export interface TooltipProps {
   sidebarTooltip?: boolean;
-  position?: 'right' | 'left' | 'top' | 'bottom';
+  position?: "right" | "left" | "top" | "bottom";
   content?: React.ReactNode;
   tips?: TooltipTip[];
   children: React.ReactElement;
@@ -74,7 +80,7 @@ export const Tooltip: React.FC<TooltipProps> = ({
 
   // Runtime guard: some browsers may surface non-Node EventTargets for relatedTarget/target
   const isDomNode = (value: unknown): value is Node =>
-    typeof Node !== 'undefined' && value instanceof Node;
+    typeof Node !== "undefined" && value instanceof Node;
 
   const clearTimers = useCallback(() => {
     if (openTimeoutRef.current) {
@@ -92,15 +98,17 @@ export const Tooltip: React.FC<TooltipProps> = ({
   const open = (isControlled ? !!controlledOpen : internalOpen) && !disabled;
   const allowAutoClose = !manualCloseOnly;
 
-  const resolvedPosition: NonNullable<TooltipProps['position']> = useMemo(() => {
-    const htmlDir = typeof document !== 'undefined' ? document.documentElement.dir : 'ltr';
-    const isRTL = htmlDir === 'rtl';
-    const base = position ?? 'right';
-    if (!isRTL) return base as NonNullable<TooltipProps['position']>;
-    if (base === 'left') return 'right';
-    if (base === 'right') return 'left';
-    return base as NonNullable<TooltipProps['position']>;
-  }, [position]);
+  const resolvedPosition: NonNullable<TooltipProps["position"]> =
+    useMemo(() => {
+      const htmlDir =
+        typeof document !== "undefined" ? document.documentElement.dir : "ltr";
+      const isRTL = htmlDir === "rtl";
+      const base = position ?? "right";
+      if (!isRTL) return base as NonNullable<TooltipProps["position"]>;
+      if (base === "left") return "right";
+      if (base === "right") return "left";
+      return base as NonNullable<TooltipProps["position"]>;
+    }, [position]);
 
   const setOpen = useCallback(
     (newOpen: boolean) => {
@@ -109,7 +117,7 @@ export const Tooltip: React.FC<TooltipProps> = ({
       else setInternalOpen(newOpen);
       if (!newOpen) setIsPinned(false);
     },
-    [isControlled, onOpenChange, open]
+    [isControlled, onOpenChange, open],
   );
 
   const { coords, positionReady } = useTooltipPosition({
@@ -129,8 +137,12 @@ export const Tooltip: React.FC<TooltipProps> = ({
       const tEl = tooltipRef.current;
       const trg = triggerRef.current;
       const target = e.target as unknown;
-      const insideTooltip = Boolean(tEl && isDomNode(target) && tEl.contains(target));
-      const insideTrigger = Boolean(trg && isDomNode(target) && trg.contains(target));
+      const insideTooltip = Boolean(
+        tEl && isDomNode(target) && tEl.contains(target),
+      );
+      const insideTrigger = Boolean(
+        trg && isDomNode(target) && trg.contains(target),
+      );
 
       // If pinned: only close when clicking outside BOTH tooltip & trigger
       if (isPinned) {
@@ -142,17 +154,26 @@ export const Tooltip: React.FC<TooltipProps> = ({
       }
 
       // Not pinned and configured to close on outside
-      if (allowAutoClose && closeOnOutside && !insideTooltip && !insideTrigger) {
+      if (
+        allowAutoClose &&
+        closeOnOutside &&
+        !insideTooltip &&
+        !insideTrigger
+      ) {
         setOpen(false);
       }
     },
-    [isPinned, closeOnOutside, setOpen, allowAutoClose]
+    [isPinned, closeOnOutside, setOpen, allowAutoClose],
   );
 
   useEffect(() => {
     // Attach global click when open (so hover tooltips can also close on outside if desired)
     if (open || isPinned) {
-      return addEventListenerWithCleanup(document, 'click', handleDocumentClick as EventListener);
+      return addEventListenerWithCleanup(
+        document,
+        "click",
+        handleDocumentClick as EventListener,
+      );
     }
   }, [open, isPinned, handleDocumentClick]);
 
@@ -160,11 +181,11 @@ export const Tooltip: React.FC<TooltipProps> = ({
 
   const arrowClass = useMemo(() => {
     if (sidebarTooltip) return null;
-    const map: Record<NonNullable<TooltipProps['position']>, string> = {
-      top: 'tooltip-arrow-bottom',
-      bottom: 'tooltip-arrow-top',
-      left: 'tooltip-arrow-left',
-      right: 'tooltip-arrow-right',
+    const map: Record<NonNullable<TooltipProps["position"]>, string> = {
+      top: "tooltip-arrow-bottom",
+      bottom: "tooltip-arrow-top",
+      left: "tooltip-arrow-left",
+      right: "tooltip-arrow-right",
     };
     return map[resolvedPosition] || map.right;
   }, [resolvedPosition, sidebarTooltip]);
@@ -172,16 +193,23 @@ export const Tooltip: React.FC<TooltipProps> = ({
   const getArrowStyleClass = useCallback(
     (key: string) =>
       styles[key as keyof typeof styles] ||
-      styles[key.replace(/-([a-z])/g, (_, l) => l.toUpperCase()) as keyof typeof styles] ||
-      '',
-    []
+      styles[
+        key.replace(/-([a-z])/g, (_, l) =>
+          l.toUpperCase(),
+        ) as keyof typeof styles
+      ] ||
+      "",
+    [],
   );
 
   // === Trigger handlers ===
   const openWithDelay = useCallback(() => {
     clearTimers();
     if (disabled) return;
-    openTimeoutRef.current = setTimeout(() => setOpen(true), Math.max(0, delay || 0));
+    openTimeoutRef.current = setTimeout(
+      () => setOpen(true),
+      Math.max(0, delay || 0),
+    );
   }, [clearTimers, setOpen, delay, disabled]);
 
   const handlePointerEnter = useCallback(
@@ -189,7 +217,7 @@ export const Tooltip: React.FC<TooltipProps> = ({
       if (!isPinned && !disabled) openWithDelay();
       (children.props as any)?.onPointerEnter?.(e);
     },
-    [isPinned, openWithDelay, children.props, disabled]
+    [isPinned, openWithDelay, children.props, disabled],
   );
 
   const handlePointerLeave = useCallback(
@@ -197,8 +225,11 @@ export const Tooltip: React.FC<TooltipProps> = ({
       const related = e.relatedTarget as Node | null;
 
       // Moving into the tooltip → keep open
-      if (isDomNode(related) && tooltipRef.current && tooltipRef.current.contains(related)) {
-
+      if (
+        isDomNode(related) &&
+        tooltipRef.current &&
+        tooltipRef.current.contains(related)
+      ) {
         (children.props as any)?.onPointerLeave?.(e);
         return;
       }
@@ -213,7 +244,7 @@ export const Tooltip: React.FC<TooltipProps> = ({
       if (allowAutoClose && !isPinned) setOpen(false);
       (children.props as any)?.onPointerLeave?.(e);
     },
-    [clearTimers, isPinned, setOpen, children.props, allowAutoClose]
+    [clearTimers, isPinned, setOpen, children.props, allowAutoClose],
   );
 
   const handleMouseDown = useCallback(
@@ -221,7 +252,7 @@ export const Tooltip: React.FC<TooltipProps> = ({
       clickPendingRef.current = true;
       (children.props as any)?.onMouseDown?.(e);
     },
-    [children.props]
+    [children.props],
   );
 
   const handleMouseUp = useCallback(
@@ -230,7 +261,7 @@ export const Tooltip: React.FC<TooltipProps> = ({
       queueMicrotask(() => (clickPendingRef.current = false));
       (children.props as any)?.onMouseUp?.(e);
     },
-    [children.props]
+    [children.props],
   );
 
   const handleClick = useCallback(
@@ -247,7 +278,7 @@ export const Tooltip: React.FC<TooltipProps> = ({
       clickPendingRef.current = false;
       (children.props as any)?.onClick?.(e);
     },
-    [clearTimers, pinOnClick, open, setOpen, children.props]
+    [clearTimers, pinOnClick, open, setOpen, children.props],
   );
 
   // Keyboard / focus accessibility
@@ -256,13 +287,17 @@ export const Tooltip: React.FC<TooltipProps> = ({
       if (!isPinned && !disabled && openOnFocus) openWithDelay();
       (children.props as any)?.onFocus?.(e);
     },
-    [isPinned, openWithDelay, children.props, disabled, openOnFocus]
+    [isPinned, openWithDelay, children.props, disabled, openOnFocus],
   );
 
   const handleBlur = useCallback(
     (e: React.FocusEvent) => {
       const related = e.relatedTarget as Node | null;
-      if (isDomNode(related) && tooltipRef.current && tooltipRef.current.contains(related)) {
+      if (
+        isDomNode(related) &&
+        tooltipRef.current &&
+        tooltipRef.current.contains(related)
+      ) {
         (children.props as any)?.onBlur?.(e);
         return;
       }
@@ -270,13 +305,16 @@ export const Tooltip: React.FC<TooltipProps> = ({
       if (allowAutoClose && !isPinned) setOpen(false);
       (children.props as any)?.onBlur?.(e);
     },
-    [isPinned, setOpen, children.props, allowAutoClose, clearTimers]
+    [isPinned, setOpen, children.props, allowAutoClose, clearTimers],
   );
 
-  const handleKeyDown = useCallback((e: React.KeyboardEvent) => {
-    if (manualCloseOnly) return;
-    if (e.key === 'Escape') setOpen(false);
-  }, [setOpen, manualCloseOnly]);
+  const handleKeyDown = useCallback(
+    (e: React.KeyboardEvent) => {
+      if (manualCloseOnly) return;
+      if (e.key === "Escape") setOpen(false);
+    },
+    [setOpen, manualCloseOnly],
+  );
 
   // Keep open while pointer is over the tooltip; close when leaving it (if not pinned)
   const handleTooltipPointerEnter = useCallback(() => {
@@ -286,10 +324,15 @@ export const Tooltip: React.FC<TooltipProps> = ({
   const handleTooltipPointerLeave = useCallback(
     (e: React.PointerEvent) => {
       const related = e.relatedTarget as Node | null;
-      if (isDomNode(related) && triggerRef.current && triggerRef.current.contains(related)) return;
+      if (
+        isDomNode(related) &&
+        triggerRef.current &&
+        triggerRef.current.contains(related)
+      )
+        return;
       if (allowAutoClose && !isPinned) setOpen(false);
     },
-    [isPinned, setOpen, allowAutoClose]
+    [isPinned, setOpen, allowAutoClose],
   );
 
   // Enhance child with handlers and ref
@@ -297,10 +340,11 @@ export const Tooltip: React.FC<TooltipProps> = ({
     ref: (node: HTMLElement | null) => {
       triggerRef.current = node || null;
       const originalRef = (children as any).ref;
-      if (typeof originalRef === 'function') originalRef(node);
-      else if (originalRef && typeof originalRef === 'object') (originalRef as any).current = node;
+      if (typeof originalRef === "function") originalRef(node);
+      else if (originalRef && typeof originalRef === "object")
+        (originalRef as any).current = node;
     },
-    'aria-describedby': open ? tooltipIdRef.current : undefined,
+    "aria-describedby": open ? tooltipIdRef.current : undefined,
     onPointerEnter: handlePointerEnter,
     onPointerLeave: handlePointerLeave,
     onMouseDown: handleMouseDown,
@@ -323,23 +367,35 @@ export const Tooltip: React.FC<TooltipProps> = ({
       onPointerEnter={handleTooltipPointerEnter}
       onPointerLeave={handleTooltipPointerLeave}
       style={{
-        position: 'fixed',
+        position: "fixed",
         top: coords.top,
         left: coords.left,
-        width: maxWidth !== undefined ? maxWidth : (sidebarTooltip ? '25rem' as const : undefined),
+        width:
+          maxWidth !== undefined
+            ? maxWidth
+            : sidebarTooltip
+              ? ("25rem" as const)
+              : undefined,
         minWidth,
         zIndex: Z_INDEX_OVER_FULLSCREEN_SURFACE,
-        visibility: positionReady ? 'visible' : 'hidden',
+        visibility: positionReady ? "visible" : "hidden",
         opacity: positionReady ? 1 : 0,
-        color: 'var(--text-primary)',
+        color: "var(--text-primary)",
         ...containerStyle,
       }}
-      className={`${styles['tooltip-container']} ${isPinned ? styles.pinned : ''}`}
-      onClick={pinOnClick ? (e) => { e.stopPropagation(); setIsPinned(true); } : undefined}
+      className={`${styles["tooltip-container"]} ${isPinned ? styles.pinned : ""}`}
+      onClick={
+        pinOnClick
+          ? (e) => {
+              e.stopPropagation();
+              setIsPinned(true);
+            }
+          : undefined
+      }
     >
       {shouldShowCloseButton && (
         <button
-          className={styles['tooltip-pin-button']}
+          className={styles["tooltip-pin-button"]}
           onClick={(e) => {
             e.stopPropagation();
             setIsPinned(false);
@@ -353,29 +409,37 @@ export const Tooltip: React.FC<TooltipProps> = ({
       )}
       {arrow && !sidebarTooltip && (
         <div
-          className={`${styles['tooltip-arrow']} ${getArrowStyleClass(arrowClass!)}`}
+          className={`${styles["tooltip-arrow"]} ${getArrowStyleClass(arrowClass!)}`}
           style={
             coords.arrowOffset !== null
-              ? { [resolvedPosition === 'top' || resolvedPosition === 'bottom' ? 'left' : 'top']: coords.arrowOffset }
+              ? {
+                  [resolvedPosition === "top" || resolvedPosition === "bottom"
+                    ? "left"
+                    : "top"]: coords.arrowOffset,
+                }
               : undefined
           }
         />
       )}
       {header && (
-        <div className={styles['tooltip-header']}>
-          <div className={styles['tooltip-logo']}>
+        <div className={styles["tooltip-header"]}>
+          <div className={styles["tooltip-logo"]}>
             {header.logo || (
               <img
                 src={tooltipLogo}
                 alt="Stirling PDF"
-                style={{ width: '1.4rem', height: '1.4rem', display: 'block' }}
+                style={{ width: "1.4rem", height: "1.4rem", display: "block" }}
               />
             )}
           </div>
-          <span className={styles['tooltip-title']}>{header.title}</span>
+          <span className={styles["tooltip-title"]}>{header.title}</span>
         </div>
       )}
-      <TooltipContent content={content} tips={tips} extraRightPadding={shouldShowCloseButton ? 48 : 0} />
+      <TooltipContent
+        content={content}
+        tips={tips}
+        extraRightPadding={shouldShowCloseButton ? 48 : 0}
+      />
     </div>
   ) : null;
 
@@ -383,7 +447,8 @@ export const Tooltip: React.FC<TooltipProps> = ({
     <>
       {childWithHandlers}
       {(() => {
-        const defaultTarget = typeof document !== 'undefined' ? document.body : null;
+        const defaultTarget =
+          typeof document !== "undefined" ? document.body : null;
         const target = portalTarget ?? defaultTarget;
         return tooltipElement && target
           ? createPortal(tooltipElement, target)
diff --git a/frontend/src/core/components/shared/TopControls.tsx b/frontend/src/core/components/shared/TopControls.tsx
index e859d70d33..573ee65afb 100644
--- a/frontend/src/core/components/shared/TopControls.tsx
+++ b/frontend/src/core/components/shared/TopControls.tsx
@@ -1,26 +1,28 @@
 import React, { useState, useCallback, useMemo } from "react";
 import { SegmentedControl, Loader } from "@mantine/core";
-import { useRainbowThemeContext } from '@app/components/shared/RainbowThemeProvider';
-import rainbowStyles from '@app/styles/rainbow.module.css';
+import { useRainbowThemeContext } from "@app/components/shared/RainbowThemeProvider";
+import rainbowStyles from "@app/styles/rainbow.module.css";
 import InsertDriveFileIcon from "@mui/icons-material/InsertDriveFile";
 import GridViewIcon from "@mui/icons-material/GridView";
 import FolderIcon from "@mui/icons-material/Folder";
 import PictureAsPdfIcon from "@mui/icons-material/PictureAsPdf";
-import { WorkbenchType, isValidWorkbench } from '@app/types/workbench';
-import { PageEditorFileDropdown } from '@app/components/shared/PageEditorFileDropdown';
-import type { CustomWorkbenchViewInstance } from '@app/contexts/ToolWorkflowContext';
-import { FileDropdownMenu } from '@app/components/shared/FileDropdownMenu';
-import { usePageEditorDropdownState, PageEditorDropdownState } from '@app/components/pageEditor/hooks/usePageEditorDropdownState';
-import { FileId } from '@app/types/file';
-
+import { WorkbenchType, isValidWorkbench } from "@app/types/workbench";
+import { PageEditorFileDropdown } from "@app/components/shared/PageEditorFileDropdown";
+import type { CustomWorkbenchViewInstance } from "@app/contexts/ToolWorkflowContext";
+import { FileDropdownMenu } from "@app/components/shared/FileDropdownMenu";
+import {
+  usePageEditorDropdownState,
+  PageEditorDropdownState,
+} from "@app/components/pageEditor/hooks/usePageEditorDropdownState";
+import { FileId } from "@app/types/file";
 
 const viewOptionStyle: React.CSSProperties = {
-  display: 'inline-flex',
-  flexDirection: 'row',
-  alignItems: 'center',
-  gap: '0.5rem',
-  justifyContent: 'center',
-  padding: '2px 1rem',
+  display: "inline-flex",
+  flexDirection: "row",
+  alignItems: "center",
+  gap: "0.5rem",
+  justifyContent: "center",
+  padding: "2px 1rem",
 };
 
 // Helper function to create view options for SegmentedControl
@@ -32,13 +34,13 @@ const createViewOptions = (
   onFileSelect?: (index: number) => void,
   onFileRemove?: (fileId: FileId) => void,
   pageEditorState?: PageEditorDropdownState,
-  customViews?: CustomWorkbenchViewInstance[]
+  customViews?: CustomWorkbenchViewInstance[],
 ) => {
   // Viewer dropdown logic
   const currentFile = activeFiles[currentFileIndex];
-  const isInViewer = currentView === 'viewer';
-  const fileName = currentFile?.name || '';
-  const viewerDisplayName = isInViewer && fileName ? fileName : 'Viewer';
+  const isInViewer = currentView === "viewer";
+  const fileName = currentFile?.name || "";
+  const viewerDisplayName = isInViewer && fileName ? fileName : "Viewer";
   const showViewerDropdown = isInViewer;
 
   const viewerOption = {
@@ -65,7 +67,7 @@ const createViewOptions = (
   };
 
   // Page Editor dropdown logic
-  const isInPageEditor = currentView === 'pageEditor';
+  const isInPageEditor = currentView === "pageEditor";
   const hasPageEditorFiles = pageEditorState && pageEditorState.totalCount > 0;
   const showPageEditorDropdown = isInPageEditor && hasPageEditorFiles;
 
@@ -96,17 +98,17 @@ const createViewOptions = (
   const fileEditorOption = {
     label: (
       <div style={viewOptionStyle}>
-        {switchingTo === "fileEditor" ? <Loader size="sm" /> : <FolderIcon fontSize="medium" />}
+        {switchingTo === "fileEditor" ? (
+          <Loader size="sm" />
+        ) : (
+          <FolderIcon fontSize="medium" />
+        )}
       </div>
     ),
     value: "fileEditor",
   };
 
-  const baseOptions = [
-    viewerOption,
-    pageEditorOption,
-    fileEditorOption,
-  ];
+  const baseOptions = [viewerOption, pageEditorOption, fileEditorOption];
 
   const customOptions = (customViews ?? [])
     .filter((view) => view.data != null)
@@ -151,87 +153,101 @@ const TopControls = ({
 
   const pageEditorState = usePageEditorDropdownState();
 
-  const handleViewChange = useCallback((view: string) => {
-    if (!isValidWorkbench(view)) {
-      return;
-    }
+  const handleViewChange = useCallback(
+    (view: string) => {
+      if (!isValidWorkbench(view)) {
+        return;
+      }
 
-    const workbench = view;
+      const workbench = view;
 
-    // Show immediate feedback
-    setSwitchingTo(workbench);
+      // Show immediate feedback
+      setSwitchingTo(workbench);
 
-    // Defer the heavy view change to next frame so spinner can render
-    requestAnimationFrame(() => {
-      // Give the spinner one more frame to show
+      // Defer the heavy view change to next frame so spinner can render
       requestAnimationFrame(() => {
-        setCurrentView(workbench);
+        // Give the spinner one more frame to show
+        requestAnimationFrame(() => {
+          setCurrentView(workbench);
 
-        // Clear the loading state after view change completes
-        setTimeout(() => setSwitchingTo(null), 300);
+          // Clear the loading state after view change completes
+          setTimeout(() => setSwitchingTo(null), 300);
+        });
       });
-    });
-  }, [setCurrentView]);
+    },
+    [setCurrentView],
+  );
 
   // Memoize view options to prevent SegmentedControl re-renders
-  const viewOptions = useMemo(() => createViewOptions(
-    currentView,
-    switchingTo,
-    activeFiles,
-    currentFileIndex,
-    onFileSelect,
-    onFileRemove,
-    pageEditorState,
-    customViews
-  ), [currentView, switchingTo, activeFiles, currentFileIndex, onFileSelect, onFileRemove, pageEditorState, customViews]);
+  const viewOptions = useMemo(
+    () =>
+      createViewOptions(
+        currentView,
+        switchingTo,
+        activeFiles,
+        currentFileIndex,
+        onFileSelect,
+        onFileRemove,
+        pageEditorState,
+        customViews,
+      ),
+    [
+      currentView,
+      switchingTo,
+      activeFiles,
+      currentFileIndex,
+      onFileSelect,
+      onFileRemove,
+      pageEditorState,
+      customViews,
+    ],
+  );
 
   return (
     <div className="absolute left-0 w-full top-0 z-[100] pointer-events-none">
       <div className="flex justify-center">
-
         <SegmentedControl
           data-tour="view-switcher"
           data={viewOptions}
-
           value={currentView}
           onChange={handleViewChange}
           color="blue"
           fullWidth
-          className={isRainbowMode ? rainbowStyles.rainbowSegmentedControl : ''}
+          className={isRainbowMode ? rainbowStyles.rainbowSegmentedControl : ""}
           style={{
-            transition: 'all 0.2s ease',
+            transition: "all 0.2s ease",
             opacity: switchingTo ? 0.8 : 1,
-            pointerEvents: 'auto'
+            pointerEvents: "auto",
           }}
           styles={{
             root: {
-              borderRadius: '0 0 16px 16px',
-              height: '1.8rem',
-              backgroundColor: 'var(--bg-toolbar)',
-              border: '1px solid var(--border-default)',
-              borderTop: 'none',
-              boxShadow: '0 2px 8px rgba(0,0,0,0.1)',
-              outline: '1px solid rgba(0, 0, 0, 0.1)',
-              outlineOffset: '-1px',
-              padding: '0 0',
-              gap: '0',
+              borderRadius: "0 0 16px 16px",
+              height: "1.8rem",
+              backgroundColor: "var(--bg-toolbar)",
+              border: "1px solid var(--border-default)",
+              borderTop: "none",
+              boxShadow: "0 2px 8px rgba(0,0,0,0.1)",
+              outline: "1px solid rgba(0, 0, 0, 0.1)",
+              outlineOffset: "-1px",
+              padding: "0 0",
+              gap: "0",
             },
             control: {
-              borderRadius: '0 0 16px 16px',
-              padding: '0',
-              border: 'none',
+              borderRadius: "0 0 16px 16px",
+              padding: "0",
+              border: "none",
             },
             indicator: {
-              borderRadius: '0 0 16px 16px',
-              height: '100%',
-              top: '0rem',
-              margin: '0',
-              border: 'none',
+              borderRadius: "0 0 16px 16px",
+              height: "100%",
+              top: "0rem",
+              margin: "0",
+              border: "none",
             },
             label: {
-              paddingTop: '0',
-              paddingBottom: '0',
-            }
+              paddingTop: "0",
+              paddingBottom: "0",
+            },
           }}
         />
       </div>
diff --git a/frontend/src/core/components/shared/UpdateModal.tsx b/frontend/src/core/components/shared/UpdateModal.tsx
index 937f4426db..bf3ae25e6b 100644
--- a/frontend/src/core/components/shared/UpdateModal.tsx
+++ b/frontend/src/core/components/shared/UpdateModal.tsx
@@ -1,14 +1,31 @@
-import React, { useState, useEffect } from 'react';
-import { Modal, Stack, Text, Badge, Button, Group, Loader, Center, Divider, Box, Collapse } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { updateService, UpdateSummary, FullUpdateInfo, MachineInfo } from '@app/services/updateService';
-import { Z_INDEX_OVER_CONFIG_MODAL } from '@app/styles/zIndex';
-import WarningAmberIcon from '@mui/icons-material/WarningAmber';
-import InfoOutlinedIcon from '@mui/icons-material/InfoOutlined';
-import OpenInNewIcon from '@mui/icons-material/OpenInNew';
-import DownloadIcon from '@mui/icons-material/Download';
-import ExpandMoreIcon from '@mui/icons-material/ExpandMore';
-import ExpandLessIcon from '@mui/icons-material/ExpandLess';
+import React, { useState, useEffect } from "react";
+import {
+  Modal,
+  Stack,
+  Text,
+  Badge,
+  Button,
+  Group,
+  Loader,
+  Center,
+  Divider,
+  Box,
+  Collapse,
+} from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import {
+  updateService,
+  UpdateSummary,
+  FullUpdateInfo,
+  MachineInfo,
+} from "@app/services/updateService";
+import { Z_INDEX_OVER_CONFIG_MODAL } from "@app/styles/zIndex";
+import WarningAmberIcon from "@mui/icons-material/WarningAmber";
+import InfoOutlinedIcon from "@mui/icons-material/InfoOutlined";
+import OpenInNewIcon from "@mui/icons-material/OpenInNew";
+import DownloadIcon from "@mui/icons-material/Download";
+import ExpandMoreIcon from "@mui/icons-material/ExpandMore";
+import ExpandLessIcon from "@mui/icons-material/ExpandLess";
 
 interface UpdateModalProps {
   opened: boolean;
@@ -26,18 +43,24 @@ const UpdateModal: React.FC<UpdateModalProps> = ({
   machineInfo,
 }) => {
   const { t } = useTranslation();
-  const [fullUpdateInfo, setFullUpdateInfo] = useState<FullUpdateInfo | null>(null);
+  const [fullUpdateInfo, setFullUpdateInfo] = useState<FullUpdateInfo | null>(
+    null,
+  );
   const [loading, setLoading] = useState(true);
-  const [expandedVersions, setExpandedVersions] = useState<Set<number>>(new Set([0]));
+  const [expandedVersions, setExpandedVersions] = useState<Set<number>>(
+    new Set([0]),
+  );
 
   useEffect(() => {
     if (opened) {
       setLoading(true);
       setExpandedVersions(new Set([0]));
-      updateService.getFullUpdateInfo(currentVersion, machineInfo).then((info) => {
-        setFullUpdateInfo(info);
-        setLoading(false);
-      });
+      updateService
+        .getFullUpdateInfo(currentVersion, machineInfo)
+        .then((info) => {
+          setFullUpdateInfo(info);
+          setLoading(false);
+        });
     }
   }, [opened, currentVersion, machineInfo]);
 
@@ -55,22 +78,22 @@ const UpdateModal: React.FC<UpdateModalProps> = ({
 
   const getPriorityColor = (priority: string): string => {
     switch (priority?.toLowerCase()) {
-      case 'urgent':
-        return 'red';
-      case 'normal':
-        return 'blue';
-      case 'minor':
-        return 'cyan';
-      case 'low':
-        return 'gray';
+      case "urgent":
+        return "red";
+      case "normal":
+        return "blue";
+      case "minor":
+        return "cyan";
+      case "low":
+        return "gray";
       default:
-        return 'gray';
+        return "gray";
     }
   };
 
   const getPriorityLabel = (priority: string): string => {
     const key = priority?.toLowerCase();
-    return t(`update.priority.${key}`, priority || 'Normal');
+    return t(`update.priority.${key}`, priority || "Normal");
   };
 
   const downloadUrl = updateService.getDownloadUrl(machineInfo);
@@ -81,7 +104,7 @@ const UpdateModal: React.FC<UpdateModalProps> = ({
       onClose={onClose}
       title={
         <Text fw={600} size="lg">
-          {t('update.modalTitle', 'Update Available')}
+          {t("update.modalTitle", "Update Available")}
         </Text>
       }
       centered
@@ -89,18 +112,23 @@ const UpdateModal: React.FC<UpdateModalProps> = ({
       zIndex={Z_INDEX_OVER_CONFIG_MODAL}
       styles={{
         body: {
-          maxHeight: '75vh',
-          overflowY: 'auto',
+          maxHeight: "75vh",
+          overflowY: "auto",
         },
       }}
     >
       <Stack gap="lg" pt="md">
         {/* Version Summary Section */}
         <Box>
-          <Group justify="space-between" align="flex-start" wrap="nowrap" mb="md">
+          <Group
+            justify="space-between"
+            align="flex-start"
+            wrap="nowrap"
+            mb="md"
+          >
             <Stack gap={4} style={{ flex: 1 }}>
               <Text size="xs" c="dimmed" tt="uppercase" fw={500}>
-                {t('update.current', 'Current Version')}
+                {t("update.current", "Current Version")}
               </Text>
               <Text fw={600} size="xl">
                 {currentVersion}
@@ -109,13 +137,13 @@ const UpdateModal: React.FC<UpdateModalProps> = ({
 
             <Stack gap={4} style={{ flex: 1 }} ta="center">
               <Text size="xs" c="dimmed" tt="uppercase" fw={500}>
-                {t('update.priorityLabel', 'Priority')}
+                {t("update.priorityLabel", "Priority")}
               </Text>
               <Badge
                 color={getPriorityColor(updateSummary.max_priority)}
                 size="lg"
                 variant="filled"
-                style={{ alignSelf: 'center' }}
+                style={{ alignSelf: "center" }}
               >
                 {getPriorityLabel(updateSummary.max_priority)}
               </Badge>
@@ -123,7 +151,7 @@ const UpdateModal: React.FC<UpdateModalProps> = ({
 
             <Stack gap={4} style={{ flex: 1 }} ta="right">
               <Text size="xs" c="dimmed" tt="uppercase" fw={500}>
-                {t('update.latest', 'Latest Version')}
+                {t("update.latest", "Latest Version")}
               </Text>
               <Text fw={600} size="xl" c="blue">
                 {updateSummary.latest_version}
@@ -134,15 +162,15 @@ const UpdateModal: React.FC<UpdateModalProps> = ({
           {updateSummary.latest_stable_version && (
             <Box
               style={{
-                background: 'var(--mantine-color-green-0)',
-                padding: '10px 16px',
-                borderRadius: '8px',
-                border: '1px solid var(--mantine-color-green-2)',
+                background: "var(--mantine-color-green-0)",
+                padding: "10px 16px",
+                borderRadius: "8px",
+                border: "1px solid var(--mantine-color-green-2)",
               }}
             >
               <Group gap="xs" justify="center">
                 <Text size="sm" fw={500}>
-                  {t('update.latestStable', 'Latest Stable')}:
+                  {t("update.latestStable", "Latest Stable")}:
                 </Text>
                 <Text size="sm" fw={600} c="green">
                   {updateSummary.latest_stable_version}
@@ -156,21 +184,25 @@ const UpdateModal: React.FC<UpdateModalProps> = ({
         {updateSummary.recommended_action && (
           <Box
             style={{
-              background: 'var(--mantine-color-blue-light)',
-              padding: '12px 16px',
-              borderRadius: '8px',
-              border: '1px solid var(--mantine-color-blue-outline)',
+              background: "var(--mantine-color-blue-light)",
+              padding: "12px 16px",
+              borderRadius: "8px",
+              border: "1px solid var(--mantine-color-blue-outline)",
             }}
           >
             <Group gap="xs" wrap="nowrap" align="flex-start">
-              <InfoOutlinedIcon style={{ fontSize: 18, color: 'var(--mantine-color-blue-filled)', marginTop: 2 }} />
+              <InfoOutlinedIcon
+                style={{
+                  fontSize: 18,
+                  color: "var(--mantine-color-blue-filled)",
+                  marginTop: 2,
+                }}
+              />
               <Box style={{ flex: 1 }}>
                 <Text size="xs" fw={600} mb={4} tt="uppercase">
-                  {t('update.recommendedAction', 'Recommended Action')}
-                </Text>
-                <Text size="sm">
-                  {updateSummary.recommended_action}
+                  {t("update.recommendedAction", "Recommended Action")}
                 </Text>
+                <Text size="sm">{updateSummary.recommended_action}</Text>
               </Box>
             </Group>
           </Box>
@@ -180,22 +212,31 @@ const UpdateModal: React.FC<UpdateModalProps> = ({
         {updateSummary.any_breaking && (
           <Box
             style={{
-              background: 'var(--mantine-color-orange-light)',
-              padding: '12px 16px',
-              borderRadius: '8px',
-              border: '1px solid var(--mantine-color-orange-outline)',
+              background: "var(--mantine-color-orange-light)",
+              padding: "12px 16px",
+              borderRadius: "8px",
+              border: "1px solid var(--mantine-color-orange-outline)",
             }}
           >
             <Group gap="xs" wrap="nowrap" align="flex-start">
-              <WarningAmberIcon style={{ fontSize: 18, color: 'var(--mantine-color-orange-filled)', marginTop: 2 }} />
+              <WarningAmberIcon
+                style={{
+                  fontSize: 18,
+                  color: "var(--mantine-color-orange-filled)",
+                  marginTop: 2,
+                }}
+              />
               <Box style={{ flex: 1 }}>
                 <Text size="xs" fw={600} mb={4} tt="uppercase">
-                  {t('update.breakingChangesDetected', 'Breaking Changes Detected')}
+                  {t(
+                    "update.breakingChangesDetected",
+                    "Breaking Changes Detected",
+                  )}
                 </Text>
                 <Text size="sm">
                   {t(
-                    'update.breakingChangesMessage',
-                    'Some versions contain breaking changes. Please review the migration guides below before updating.'
+                    "update.breakingChangesMessage",
+                    "Some versions contain breaking changes. Please review the migration guides below before updating.",
                   )}
                 </Text>
               </Box>
@@ -204,48 +245,51 @@ const UpdateModal: React.FC<UpdateModalProps> = ({
         )}
 
         {/* Migration guides */}
-        {updateSummary.migration_guides && updateSummary.migration_guides.length > 0 && (
-          <>
-            <Divider />
-            <Stack gap="xs">
-              <Text fw={600} size="sm" tt="uppercase" c="dimmed">
-                {t('update.migrationGuides', 'Migration Guides')}
-              </Text>
-              {updateSummary.migration_guides.map((guide, idx) => (
-                <Box
-                  key={idx}
-                  style={{
-                    border: '1px solid var(--mantine-color-gray-3)',
-                    padding: '12px 16px',
-                    borderRadius: '8px',
-                    background: 'var(--mantine-color-gray-0)',
-                  }}
-                >
-                  <Group justify="space-between" align="center" wrap="nowrap">
-                    <Box style={{ flex: 1 }}>
-                      <Text fw={600} size="sm">
-                        {t('update.version', 'Version')} {guide.version}
-                      </Text>
-                      <Text size="xs" c="dimmed" mt={4}>
-                        {guide.notes}
-                      </Text>
-                    </Box>
-                    <Button
-                      component="a"
-                      href={guide.url}
-                      target="_blank"
-                      variant="light"
-                      size="xs"
-                      rightSection={<OpenInNewIcon style={{ fontSize: 14 }} />}
-                    >
-                      {t('update.viewGuide', 'View Guide')}
-                    </Button>
-                  </Group>
-                </Box>
-              ))}
-            </Stack>
-          </>
-        )}
+        {updateSummary.migration_guides &&
+          updateSummary.migration_guides.length > 0 && (
+            <>
+              <Divider />
+              <Stack gap="xs">
+                <Text fw={600} size="sm" tt="uppercase" c="dimmed">
+                  {t("update.migrationGuides", "Migration Guides")}
+                </Text>
+                {updateSummary.migration_guides.map((guide, idx) => (
+                  <Box
+                    key={idx}
+                    style={{
+                      border: "1px solid var(--mantine-color-gray-3)",
+                      padding: "12px 16px",
+                      borderRadius: "8px",
+                      background: "var(--mantine-color-gray-0)",
+                    }}
+                  >
+                    <Group justify="space-between" align="center" wrap="nowrap">
+                      <Box style={{ flex: 1 }}>
+                        <Text fw={600} size="sm">
+                          {t("update.version", "Version")} {guide.version}
+                        </Text>
+                        <Text size="xs" c="dimmed" mt={4}>
+                          {guide.notes}
+                        </Text>
+                      </Box>
+                      <Button
+                        component="a"
+                        href={guide.url}
+                        target="_blank"
+                        variant="light"
+                        size="xs"
+                        rightSection={
+                          <OpenInNewIcon style={{ fontSize: 14 }} />
+                        }
+                      >
+                        {t("update.viewGuide", "View Guide")}
+                      </Button>
+                    </Group>
+                  </Box>
+                ))}
+              </Stack>
+            </>
+          )}
 
         {/* Version details */}
         <Divider />
@@ -254,18 +298,26 @@ const UpdateModal: React.FC<UpdateModalProps> = ({
             <Stack align="center" gap="sm">
               <Loader size="md" />
               <Text size="sm" c="dimmed">
-                {t('update.loadingDetailedInfo', 'Loading detailed information...')}
+                {t(
+                  "update.loadingDetailedInfo",
+                  "Loading detailed information...",
+                )}
               </Text>
             </Stack>
           </Center>
-        ) : fullUpdateInfo && fullUpdateInfo.new_versions && fullUpdateInfo.new_versions.length > 0 ? (
+        ) : fullUpdateInfo &&
+          fullUpdateInfo.new_versions &&
+          fullUpdateInfo.new_versions.length > 0 ? (
           <Stack gap="xs">
             <Group justify="space-between" align="center">
               <Text fw={600} size="sm" tt="uppercase" c="dimmed">
-                {t('update.availableUpdates', 'Available Updates')}
+                {t("update.availableUpdates", "Available Updates")}
               </Text>
               <Badge variant="light" color="gray">
-                {fullUpdateInfo.new_versions.length} {fullUpdateInfo.new_versions.length === 1 ? 'version' : 'versions'}
+                {fullUpdateInfo.new_versions.length}{" "}
+                {fullUpdateInfo.new_versions.length === 1
+                  ? "version"
+                  : "versions"}
               </Badge>
             </Group>
             <Stack gap="xs">
@@ -275,9 +327,9 @@ const UpdateModal: React.FC<UpdateModalProps> = ({
                   <Box
                     key={index}
                     style={{
-                      border: '1px solid var(--mantine-color-gray-3)',
-                      borderRadius: '8px',
-                      overflow: 'hidden',
+                      border: "1px solid var(--mantine-color-gray-3)",
+                      borderRadius: "8px",
+                      overflow: "hidden",
                     }}
                   >
                     <Group
@@ -285,22 +337,27 @@ const UpdateModal: React.FC<UpdateModalProps> = ({
                       align="center"
                       p="md"
                       style={{
-                        cursor: 'pointer',
-                        background: isExpanded ? 'var(--mantine-color-gray-0)' : 'transparent',
-                        transition: 'background 0.15s ease',
+                        cursor: "pointer",
+                        background: isExpanded
+                          ? "var(--mantine-color-gray-0)"
+                          : "transparent",
+                        transition: "background 0.15s ease",
                       }}
                       onClick={() => toggleVersion(index)}
                     >
                       <Group gap="md" style={{ flex: 1 }}>
                         <Box>
                           <Text fw={600} size="sm" c="dimmed" mb={2}>
-                            {t('update.version', 'Version')}
+                            {t("update.version", "Version")}
                           </Text>
                           <Text fw={700} size="lg">
                             {version.version}
                           </Text>
                         </Box>
-                        <Badge color={getPriorityColor(version.priority)} size="md">
+                        <Badge
+                          color={getPriorityColor(version.priority)}
+                          size="md"
+                        >
                           {getPriorityLabel(version.priority)}
                         </Badge>
                       </Group>
@@ -312,26 +369,48 @@ const UpdateModal: React.FC<UpdateModalProps> = ({
                           variant="light"
                           size="xs"
                           onClick={(e) => e.stopPropagation()}
-                          rightSection={<OpenInNewIcon style={{ fontSize: 14 }} />}
+                          rightSection={
+                            <OpenInNewIcon style={{ fontSize: 14 }} />
+                          }
                         >
-                          {t('update.releaseNotes', 'Release Notes')}
+                          {t("update.releaseNotes", "Release Notes")}
                         </Button>
                         {isExpanded ? (
-                          <ExpandLessIcon style={{ fontSize: 20, color: 'var(--mantine-color-gray-6)' }} />
+                          <ExpandLessIcon
+                            style={{
+                              fontSize: 20,
+                              color: "var(--mantine-color-gray-6)",
+                            }}
+                          />
                         ) : (
-                          <ExpandMoreIcon style={{ fontSize: 20, color: 'var(--mantine-color-gray-6)' }} />
+                          <ExpandMoreIcon
+                            style={{
+                              fontSize: 20,
+                              color: "var(--mantine-color-gray-6)",
+                            }}
+                          />
                         )}
                       </Group>
                     </Group>
 
                     <Collapse in={isExpanded}>
-                      <Box p="md" pt={0} style={{ borderTop: '1px solid var(--mantine-color-gray-2)' }}>
+                      <Box
+                        p="md"
+                        pt={0}
+                        style={{
+                          borderTop: "1px solid var(--mantine-color-gray-2)",
+                        }}
+                      >
                         <Stack gap="md" mt="md">
                           <Box>
                             <Text fw={600} size="sm" mb={6}>
                               {version.announcement.title}
                             </Text>
-                            <Text size="sm" c="dimmed" style={{ lineHeight: 1.6 }}>
+                            <Text
+                              size="sm"
+                              c="dimmed"
+                              style={{ lineHeight: 1.6 }}
+                            >
                               {version.announcement.message}
                             </Text>
                           </Box>
@@ -339,33 +418,58 @@ const UpdateModal: React.FC<UpdateModalProps> = ({
                           {version.compatibility.breaking_changes && (
                             <Box
                               style={{
-                                background: 'var(--mantine-color-orange-light)',
-                                padding: '12px',
-                                borderRadius: '6px',
-                                border: '1px solid var(--mantine-color-orange-outline)',
+                                background: "var(--mantine-color-orange-light)",
+                                padding: "12px",
+                                borderRadius: "6px",
+                                border:
+                                  "1px solid var(--mantine-color-orange-outline)",
                               }}
                             >
-                              <Group gap="xs" align="flex-start" wrap="nowrap" mb="xs">
-                                <WarningAmberIcon style={{ fontSize: 16, color: 'var(--mantine-color-orange-filled)', marginTop: 2 }} />
+                              <Group
+                                gap="xs"
+                                align="flex-start"
+                                wrap="nowrap"
+                                mb="xs"
+                              >
+                                <WarningAmberIcon
+                                  style={{
+                                    fontSize: 16,
+                                    color: "var(--mantine-color-orange-filled)",
+                                    marginTop: 2,
+                                  }}
+                                />
                                 <Text size="xs" fw={600} tt="uppercase">
-                                  {t('update.breakingChanges', 'Breaking Changes')}
+                                  {t(
+                                    "update.breakingChanges",
+                                    "Breaking Changes",
+                                  )}
                                 </Text>
                               </Group>
                               <Text size="sm" mb="xs">
                                 {version.compatibility.breaking_description ||
-                                  t('update.breakingChangesDefault', 'This version contains breaking changes.')}
+                                  t(
+                                    "update.breakingChangesDefault",
+                                    "This version contains breaking changes.",
+                                  )}
                               </Text>
                               {version.compatibility.migration_guide_url && (
                                 <Button
                                   component="a"
-                                  href={version.compatibility.migration_guide_url}
+                                  href={
+                                    version.compatibility.migration_guide_url
+                                  }
                                   target="_blank"
                                   variant="light"
                                   color="orange"
                                   size="xs"
-                                  rightSection={<OpenInNewIcon style={{ fontSize: 14 }} />}
+                                  rightSection={
+                                    <OpenInNewIcon style={{ fontSize: 14 }} />
+                                  }
                                 >
-                                  {t('update.migrationGuide', 'Migration Guide')}
+                                  {t(
+                                    "update.migrationGuide",
+                                    "Migration Guide",
+                                  )}
                                 </Button>
                               )}
                             </Box>
@@ -384,7 +488,7 @@ const UpdateModal: React.FC<UpdateModalProps> = ({
         <Divider />
         <Group justify="flex-end" gap="sm">
           <Button variant="default" onClick={onClose}>
-            {t('update.close', 'Close')}
+            {t("update.close", "Close")}
           </Button>
           <Button
             variant="light"
@@ -393,7 +497,7 @@ const UpdateModal: React.FC<UpdateModalProps> = ({
             target="_blank"
             rightSection={<OpenInNewIcon style={{ fontSize: 16 }} />}
           >
-            {t('update.viewAllReleases', 'View All Releases')}
+            {t("update.viewAllReleases", "View All Releases")}
           </Button>
           {downloadUrl && (
             <Button
@@ -403,7 +507,7 @@ const UpdateModal: React.FC<UpdateModalProps> = ({
               color="green"
               leftSection={<DownloadIcon style={{ fontSize: 16 }} />}
             >
-              {t('update.downloadLatest', 'Download Latest')}
+              {t("update.downloadLatest", "Download Latest")}
             </Button>
           )}
         </Group>
diff --git a/frontend/src/core/components/shared/UploadToServerModal.tsx b/frontend/src/core/components/shared/UploadToServerModal.tsx
index ecf424e60b..10cfc57dd8 100644
--- a/frontend/src/core/components/shared/UploadToServerModal.tsx
+++ b/frontend/src/core/components/shared/UploadToServerModal.tsx
@@ -1,15 +1,15 @@
-import React, { useCallback, useEffect, useState } from 'react';
-import { Modal, Stack, Text, Button, Group, Alert } from '@mantine/core';
-import CloudUploadIcon from '@mui/icons-material/CloudUpload';
-import { useTranslation } from 'react-i18next';
+import React, { useCallback, useEffect, useState } from "react";
+import { Modal, Stack, Text, Button, Group, Alert } from "@mantine/core";
+import CloudUploadIcon from "@mui/icons-material/CloudUpload";
+import { useTranslation } from "react-i18next";
 
-import { alert } from '@app/components/toast';
-import { Z_INDEX_OVER_FILE_MANAGER_MODAL } from '@app/styles/zIndex';
-import type { StirlingFileStub } from '@app/types/fileContext';
-import { uploadHistoryChain } from '@app/services/serverStorageUpload';
-import { fileStorage } from '@app/services/fileStorage';
-import { useFileActions } from '@app/contexts/FileContext';
-import type { FileId } from '@app/types/file';
+import { alert } from "@app/components/toast";
+import { Z_INDEX_OVER_FILE_MANAGER_MODAL } from "@app/styles/zIndex";
+import type { StirlingFileStub } from "@app/types/fileContext";
+import { uploadHistoryChain } from "@app/services/serverStorageUpload";
+import { fileStorage } from "@app/services/fileStorage";
+import { useFileActions } from "@app/contexts/FileContext";
+import type { FileId } from "@app/types/file";
 
 interface UploadToServerModalProps {
   opened: boolean;
@@ -43,10 +43,11 @@ const UploadToServerModal: React.FC<UploadToServerModalProps> = ({
     try {
       const originalFileId = (file.originalFileId || file.id) as FileId;
       const remoteId = file.remoteStorageId;
-      const { remoteId: storedId, updatedAt, chain } = await uploadHistoryChain(
-        originalFileId,
-        remoteId
-      );
+      const {
+        remoteId: storedId,
+        updatedAt,
+        chain,
+      } = await uploadHistoryChain(originalFileId, remoteId);
 
       for (const stub of chain) {
         actions.updateStirlingFileStub(stub.id, {
@@ -62,8 +63,8 @@ const UploadToServerModal: React.FC<UploadToServerModalProps> = ({
       }
 
       alert({
-        alertType: 'success',
-        title: t('storageUpload.success', 'Uploaded to server'),
+        alertType: "success",
+        title: t("storageUpload.success", "Uploaded to server"),
         expandable: false,
         durationMs: 3000,
       });
@@ -72,9 +73,12 @@ const UploadToServerModal: React.FC<UploadToServerModalProps> = ({
       }
       onClose();
     } catch (error) {
-      console.error('Failed to upload file to server:', error);
+      console.error("Failed to upload file to server:", error);
       setErrorMessage(
-        t('storageUpload.failure', 'Upload failed. Please check your login and storage settings.')
+        t(
+          "storageUpload.failure",
+          "Upload failed. Please check your login and storage settings.",
+        ),
       );
     } finally {
       setIsUploading(false);
@@ -86,35 +90,38 @@ const UploadToServerModal: React.FC<UploadToServerModalProps> = ({
       opened={opened}
       onClose={onClose}
       centered
-      title={t('storageUpload.title', 'Upload to Server')}
+      title={t("storageUpload.title", "Upload to Server")}
       zIndex={Z_INDEX_OVER_FILE_MANAGER_MODAL}
     >
       <Stack gap="sm">
         <Text size="sm">
           {t(
-            'storageUpload.description',
-            'This uploads the current file to server storage for your own access.'
+            "storageUpload.description",
+            "This uploads the current file to server storage for your own access.",
           )}
         </Text>
         <Text size="sm" c="dimmed">
-          {t('storageUpload.fileLabel', 'File')}: {file.name}
+          {t("storageUpload.fileLabel", "File")}: {file.name}
         </Text>
         <Text size="xs" c="dimmed">
           {t(
-            'storageUpload.hint',
-            'Public links and access modes are controlled by your server settings.'
+            "storageUpload.hint",
+            "Public links and access modes are controlled by your server settings.",
           )}
         </Text>
 
         {errorMessage && (
-          <Alert color="red" title={t('storageUpload.errorTitle', 'Upload failed')}>
+          <Alert
+            color="red"
+            title={t("storageUpload.errorTitle", "Upload failed")}
+          >
             {errorMessage}
           </Alert>
         )}
 
         <Group justify="flex-end" gap="sm">
           <Button variant="default" onClick={onClose} disabled={isUploading}>
-            {t('cancel', 'Cancel')}
+            {t("cancel", "Cancel")}
           </Button>
           <Button
             leftSection={<CloudUploadIcon style={{ fontSize: 18 }} />}
@@ -122,8 +129,8 @@ const UploadToServerModal: React.FC<UploadToServerModalProps> = ({
             loading={isUploading}
           >
             {file.remoteStorageId
-              ? t('storageUpload.updateButton', 'Update on Server')
-              : t('storageUpload.uploadButton', 'Upload to Server')}
+              ? t("storageUpload.updateButton", "Update on Server")
+              : t("storageUpload.uploadButton", "Upload to Server")}
           </Button>
         </Group>
       </Stack>
diff --git a/frontend/src/core/components/shared/UserSelector.tsx b/frontend/src/core/components/shared/UserSelector.tsx
index 22c99ec61d..956da0cff5 100644
--- a/frontend/src/core/components/shared/UserSelector.tsx
+++ b/frontend/src/core/components/shared/UserSelector.tsx
@@ -1,25 +1,31 @@
-import { useEffect, useState } from 'react';
-import { useTranslation } from 'react-i18next';
-import { MultiSelect, Loader, Text, Button, Stack } from '@mantine/core';
-import { useNavigate } from 'react-router-dom';
-import { alert } from '@app/components/toast';
-import { UserSummary } from '@app/types/signingSession';
-import apiClient from '@app/services/apiClient';
-import { useAuth } from '@app/auth/UseSession';
-import { Z_INDEX_OVER_FILE_MANAGER_MODAL } from '@app/styles/zIndex';
+import { useEffect, useState } from "react";
+import { useTranslation } from "react-i18next";
+import { MultiSelect, Loader, Text, Button, Stack } from "@mantine/core";
+import { useNavigate } from "react-router-dom";
+import { alert } from "@app/components/toast";
+import { UserSummary } from "@app/types/signingSession";
+import apiClient from "@app/services/apiClient";
+import { useAuth } from "@app/auth/UseSession";
+import { Z_INDEX_OVER_FILE_MANAGER_MODAL } from "@app/styles/zIndex";
 
 interface UserSelectorProps {
   value: number[];
   onChange: (userIds: number[]) => void;
   placeholder?: string;
-  size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+  size?: "xs" | "sm" | "md" | "lg" | "xl";
   disabled?: boolean;
 }
 
 type SelectItem = { value: string; label: string };
 type GroupedData = { group: string; items: SelectItem[] };
 
-const UserSelector = ({ value, onChange, placeholder, size = 'sm', disabled = false }: UserSelectorProps) => {
+const UserSelector = ({
+  value,
+  onChange,
+  placeholder,
+  size = "sm",
+  disabled = false,
+}: UserSelectorProps) => {
   const { t } = useTranslation();
   const { user } = useAuth();
   const navigate = useNavigate();
@@ -30,8 +36,8 @@ const UserSelector = ({ value, onChange, placeholder, size = 'sm', disabled = fa
   useEffect(() => {
     const fetchUsers = async () => {
       try {
-        const response = await apiClient.get('/api/v1/user/users');
-        console.log('Users API response:', response.data);
+        const response = await apiClient.get("/api/v1/user/users");
+        console.log("Users API response:", response.data);
         const fetchedUsers = response.data || [];
 
         // Process selectData inside useEffect - group by team
@@ -41,16 +47,20 @@ const UserSelector = ({ value, onChange, placeholder, size = 'sm', disabled = fa
         fetchedUsers
           .filter((u: UserSummary) => u && u.userId && u.username)
           .filter((u: UserSummary) => u.userId !== currentUserId) // Exclude current user
-          .filter((u: UserSummary) => u.teamName?.toLowerCase() !== 'internal') // Exclude internal users
+          .filter((u: UserSummary) => u.teamName?.toLowerCase() !== "internal") // Exclude internal users
           .forEach((user: UserSummary) => {
-            const teamName = user.teamName || t('certSign.collab.userSelector.noTeam', 'No Team');
+            const teamName =
+              user.teamName ||
+              t("certSign.collab.userSelector.noTeam", "No Team");
             if (!usersByTeam[teamName]) {
               usersByTeam[teamName] = [];
             }
-            const displayName = user.displayName || user.username || 'Unknown';
-            const username = user.username || 'unknown';
+            const displayName = user.displayName || user.username || "Unknown";
+            const username = user.username || "unknown";
             const label =
-              displayName !== username ? `${displayName} (@${username})` : displayName;
+              displayName !== username
+                ? `${displayName} (@${username})`
+                : displayName;
             usersByTeam[teamName].push({
               value: String(user.userId),
               label,
@@ -58,19 +68,24 @@ const UserSelector = ({ value, onChange, placeholder, size = 'sm', disabled = fa
           });
 
         // Convert to Mantine's grouped format
-        const processed: GroupedData[] = Object.entries(usersByTeam).map(([teamName, items]) => ({
-          group: teamName,
-          items: items.sort((a, b) => a.label.localeCompare(b.label)),
-        }));
+        const processed: GroupedData[] = Object.entries(usersByTeam).map(
+          ([teamName, items]) => ({
+            group: teamName,
+            items: items.sort((a, b) => a.label.localeCompare(b.label)),
+          }),
+        );
 
-        console.log('Processed selectData:', processed);
+        console.log("Processed selectData:", processed);
         setSelectData(processed);
       } catch (error) {
-        console.error('Failed to load users:', error);
+        console.error("Failed to load users:", error);
         alert({
-          alertType: 'error',
-          title: t('common.error'),
-          body: t('certSign.collab.userSelector.loadError', 'Failed to load users'),
+          alertType: "error",
+          title: t("common.error"),
+          body: t(
+            "certSign.collab.userSelector.loadError",
+            "Failed to load users",
+          ),
         });
       } finally {
         setLoading(false);
@@ -83,8 +98,10 @@ const UserSelector = ({ value, onChange, placeholder, size = 'sm', disabled = fa
   // Process stringValue when value prop changes
   useEffect(() => {
     const safeValue = Array.isArray(value) ? value : [];
-    const result = safeValue.map((id) => (id != null ? id.toString() : '')).filter(Boolean);
-    console.log('stringValue for MultiSelect:', result);
+    const result = safeValue
+      .map((id) => (id != null ? id.toString() : ""))
+      .filter(Boolean);
+    console.log("stringValue for MultiSelect:", result);
     setStringValue(result);
   }, [value]);
 
@@ -97,10 +114,14 @@ const UserSelector = ({ value, onChange, placeholder, size = 'sm', disabled = fa
     return (
       <Stack gap="xs" align="flex-start">
         <Text size="sm" c="dimmed">
-          {t('certSign.collab.userSelector.noUsers', 'No other users found.')}
+          {t("certSign.collab.userSelector.noUsers", "No other users found.")}
         </Text>
-        <Button size="xs" variant="light" onClick={() => navigate('/settings/people')}>
-          {t('certSign.collab.userSelector.inviteUsers', 'Add Users')}
+        <Button
+          size="xs"
+          variant="light"
+          onClick={() => navigate("/settings/people")}
+        >
+          {t("certSign.collab.userSelector.inviteUsers", "Add Users")}
         </Button>
       </Stack>
     );
@@ -116,13 +137,19 @@ const UserSelector = ({ value, onChange, placeholder, size = 'sm', disabled = fa
           .filter((id) => !isNaN(id));
         onChange(parsedIds);
       }}
-      placeholder={placeholder || t('certSign.collab.userSelector.placeholder', 'Select users...')}
+      placeholder={
+        placeholder ||
+        t("certSign.collab.userSelector.placeholder", "Select users...")
+      }
       searchable
       clearable
       size={size}
       disabled={disabled}
       maxDropdownHeight={300}
-      comboboxProps={{ withinPortal: true, zIndex: Z_INDEX_OVER_FILE_MANAGER_MODAL + 10 }}
+      comboboxProps={{
+        withinPortal: true,
+        zIndex: Z_INDEX_OVER_FILE_MANAGER_MODAL + 10,
+      }}
     />
   );
 };
diff --git a/frontend/src/core/components/shared/Wordmark.tsx b/frontend/src/core/components/shared/Wordmark.tsx
new file mode 100644
index 0000000000..62185420c9
--- /dev/null
+++ b/frontend/src/core/components/shared/Wordmark.tsx
@@ -0,0 +1,20 @@
+import React from "react";
+import { useMantineColorScheme } from "@mantine/core";
+import { useLogoAssets } from "@app/hooks/useLogoAssets";
+
+interface WordmarkProps extends React.ImgHTMLAttributes<HTMLImageElement> {
+  alt?: string;
+  muted?: boolean;
+}
+
+export function Wordmark({ alt = "", muted = false, ...props }: WordmarkProps) {
+  const { colorScheme } = useMantineColorScheme();
+  const isDark = colorScheme === "dark";
+  const { wordmark } = useLogoAssets();
+
+  // light: black text (standard) or grey text (muted)
+  // dark:  white text for both variants
+  const src = isDark ? wordmark.white : muted ? wordmark.grey : wordmark.black;
+
+  return <img src={src} alt={alt} {...props} />;
+}
diff --git a/frontend/src/core/components/shared/ZipWarningModal.tsx b/frontend/src/core/components/shared/ZipWarningModal.tsx
index 909cf1b31b..024cb63976 100644
--- a/frontend/src/core/components/shared/ZipWarningModal.tsx
+++ b/frontend/src/core/components/shared/ZipWarningModal.tsx
@@ -15,12 +15,18 @@ interface ZipWarningModalProps {
 
 const WARNING_ICON_STYLE: CSSProperties = {
   fontSize: 36,
-  display: 'block',
-  margin: '0 auto 8px',
-  color: 'var(--mantine-color-blue-6)'
+  display: "block",
+  margin: "0 auto 8px",
+  color: "var(--mantine-color-blue-6)",
 };
 
-const ZipWarningModal = ({ opened, onConfirm, onCancel, fileCount, zipFileName }: ZipWarningModalProps) => {
+const ZipWarningModal = ({
+  opened,
+  onConfirm,
+  onCancel,
+  fileCount,
+  zipFileName,
+}: ZipWarningModalProps) => {
   const { t } = useTranslation();
 
   return (
@@ -41,7 +47,7 @@ const ZipWarningModal = ({ opened, onConfirm, onCancel, fileCount, zipFileName }
         <Text size="lg" fw={500}>
           {t("zipWarning.message", {
             count: fileCount,
-            defaultValue: "This ZIP contains {{count}} files. Extract anyway?"
+            defaultValue: "This ZIP contains {{count}} files. Extract anyway?",
           })}
         </Text>
       </Stack>
diff --git a/frontend/src/core/components/shared/config/LoginRequiredBanner.tsx b/frontend/src/core/components/shared/config/LoginRequiredBanner.tsx
index f16e38f4ea..04f6db4322 100644
--- a/frontend/src/core/components/shared/config/LoginRequiredBanner.tsx
+++ b/frontend/src/core/components/shared/config/LoginRequiredBanner.tsx
@@ -1,6 +1,6 @@
-import { Alert, Text } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import LocalIcon from '@app/components/shared/LocalIcon';
+import { Alert, Text } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import LocalIcon from "@app/components/shared/LocalIcon";
 
 interface LoginRequiredBannerProps {
   show: boolean;
@@ -10,7 +10,9 @@ interface LoginRequiredBannerProps {
  * Banner component that displays when login mode is required but not enabled
  * Shows prominent warning that settings are read-only
  */
-export default function LoginRequiredBanner({ show }: LoginRequiredBannerProps) {
+export default function LoginRequiredBanner({
+  show,
+}: LoginRequiredBannerProps) {
   const { t } = useTranslation();
 
   if (!show) return null;
@@ -18,20 +20,26 @@ export default function LoginRequiredBanner({ show }: LoginRequiredBannerProps)
   return (
     <Alert
       icon={<LocalIcon icon="lock" width={20} height={20} />}
-      title={t('admin.settings.loginDisabled.title', 'Login Mode Required')}
+      title={t("admin.settings.loginDisabled.title", "Login Mode Required")}
       color="blue"
       variant="light"
       styles={{
         root: {
-          borderLeft: '4px solid var(--mantine-color-blue-6)'
-        }
+          borderLeft: "4px solid var(--mantine-color-blue-6)",
+        },
       }}
     >
       <Text size="sm">
-        {t('admin.settings.loginDisabled.message', 'Login mode must be enabled to modify admin settings. Please set SECURITY_ENABLELOGIN=true in your environment or security.enableLogin: true in settings.yml, then restart the server.')}
+        {t(
+          "admin.settings.loginDisabled.message",
+          "Login mode must be enabled to modify admin settings. Please set SECURITY_ENABLELOGIN=true in your environment or security.enableLogin: true in settings.yml, then restart the server.",
+        )}
       </Text>
       <Text size="sm" fw={600} mt="xs" c="dimmed">
-        {t('admin.settings.loginDisabled.readOnly', 'The settings below show example values for reference. Enable login mode to view and edit actual configuration.')}
+        {t(
+          "admin.settings.loginDisabled.readOnly",
+          "The settings below show example values for reference. Enable login mode to view and edit actual configuration.",
+        )}
       </Text>
     </Alert>
   );
diff --git a/frontend/src/core/components/shared/config/OverviewHeader.tsx b/frontend/src/core/components/shared/config/OverviewHeader.tsx
index 7be820620a..9c4f3da994 100644
--- a/frontend/src/core/components/shared/config/OverviewHeader.tsx
+++ b/frontend/src/core/components/shared/config/OverviewHeader.tsx
@@ -1,14 +1,19 @@
-import { Text } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
+import { Text } from "@mantine/core";
+import { useTranslation } from "react-i18next";
 
 export function OverviewHeader() {
   const { t } = useTranslation();
 
   return (
     <div>
-      <Text fw={600} size="lg">{t('config.overview.title', 'Application Configuration')}</Text>
+      <Text fw={600} size="lg">
+        {t("config.overview.title", "Application Configuration")}
+      </Text>
       <Text size="sm" c="dimmed">
-        {t('config.overview.description', 'Current application settings and configuration details.')}
+        {t(
+          "config.overview.description",
+          "Current application settings and configuration details.",
+        )}
       </Text>
     </div>
   );
diff --git a/frontend/src/core/components/shared/config/PendingBadge.tsx b/frontend/src/core/components/shared/config/PendingBadge.tsx
index cdb3306f80..625c2499e2 100644
--- a/frontend/src/core/components/shared/config/PendingBadge.tsx
+++ b/frontend/src/core/components/shared/config/PendingBadge.tsx
@@ -1,22 +1,22 @@
-import { Badge } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
+import { Badge } from "@mantine/core";
+import { useTranslation } from "react-i18next";
 
 interface PendingBadgeProps {
   show: boolean;
-  size?: 'xs' | 'sm' | 'md' | 'lg';
+  size?: "xs" | "sm" | "md" | "lg";
 }
 
 /**
  * Badge to show when a setting has been saved but requires restart to take effect.
  */
-export default function PendingBadge({ show, size = 'xs' }: PendingBadgeProps) {
+export default function PendingBadge({ show, size = "xs" }: PendingBadgeProps) {
   const { t } = useTranslation();
 
   if (!show) return null;
 
   return (
     <Badge color="orange" size={size} variant="light">
-      {t('admin.settings.restartRequired', 'Restart Required')}
+      {t("admin.settings.restartRequired", "Restart Required")}
     </Badge>
   );
 }
diff --git a/frontend/src/core/components/shared/config/RestartConfirmationModal.tsx b/frontend/src/core/components/shared/config/RestartConfirmationModal.tsx
index b97b17a0c6..af96918154 100644
--- a/frontend/src/core/components/shared/config/RestartConfirmationModal.tsx
+++ b/frontend/src/core/components/shared/config/RestartConfirmationModal.tsx
@@ -1,8 +1,8 @@
-import { Modal, Text, Group, Button, Stack } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import RefreshIcon from '@mui/icons-material/Refresh';
-import ScheduleIcon from '@mui/icons-material/Schedule';
-import { Z_INDEX_OVER_CONFIG_MODAL } from '@app/styles/zIndex';
+import { Modal, Text, Group, Button, Stack } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import RefreshIcon from "@mui/icons-material/Refresh";
+import ScheduleIcon from "@mui/icons-material/Schedule";
+import { Z_INDEX_OVER_CONFIG_MODAL } from "@app/styles/zIndex";
 
 interface RestartConfirmationModalProps {
   opened: boolean;
@@ -23,7 +23,7 @@ export default function RestartConfirmationModal({
       onClose={onClose}
       title={
         <Text fw={600} size="lg">
-          {t('admin.settings.restart.title', 'Restart Required')}
+          {t("admin.settings.restart.title", "Restart Required")}
         </Text>
       }
       centered
@@ -34,15 +34,15 @@ export default function RestartConfirmationModal({
       <Stack gap="lg">
         <Text size="sm">
           {t(
-            'admin.settings.restart.message',
-            'Settings have been saved successfully. A server restart is required for the changes to take effect.'
+            "admin.settings.restart.message",
+            "Settings have been saved successfully. A server restart is required for the changes to take effect.",
           )}
         </Text>
 
         <Text size="sm" c="dimmed">
           {t(
-            'admin.settings.restart.question',
-            'Would you like to restart the server now or later?'
+            "admin.settings.restart.question",
+            "Would you like to restart the server now or later?",
           )}
         </Text>
 
@@ -52,14 +52,14 @@ export default function RestartConfirmationModal({
             leftSection={<ScheduleIcon style={{ fontSize: 16 }} />}
             onClick={onClose}
           >
-            {t('admin.settings.restart.later', 'Restart Later')}
+            {t("admin.settings.restart.later", "Restart Later")}
           </Button>
           <Button
             color="blue"
             leftSection={<RefreshIcon style={{ fontSize: 16 }} />}
             onClick={onRestart}
           >
-            {t('admin.settings.restart.now', 'Restart Now')}
+            {t("admin.settings.restart.now", "Restart Now")}
           </Button>
         </Group>
       </Stack>
diff --git a/frontend/src/core/components/shared/config/SettingsSearchBar.tsx b/frontend/src/core/components/shared/config/SettingsSearchBar.tsx
index cbbbd97076..e1114f3fce 100644
--- a/frontend/src/core/components/shared/config/SettingsSearchBar.tsx
+++ b/frontend/src/core/components/shared/config/SettingsSearchBar.tsx
@@ -1,10 +1,13 @@
-import React, { useMemo, useState, useCallback } from 'react';
-import { Select, Text } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import LocalIcon from '@app/components/shared/LocalIcon';
-import { NavKey, VALID_NAV_KEYS } from '@app/components/shared/config/types';
-import { Z_INDEX_OVER_CONFIG_MODAL } from '@app/styles/zIndex';
-import type { ConfigNavSection, ConfigNavItem } from '@app/components/shared/config/configNavSections';
+import React, { useMemo, useState, useCallback } from "react";
+import { Select, Text } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import LocalIcon from "@app/components/shared/LocalIcon";
+import { NavKey, VALID_NAV_KEYS } from "@app/components/shared/config/types";
+import { Z_INDEX_OVER_CONFIG_MODAL } from "@app/styles/zIndex";
+import type {
+  ConfigNavSection,
+  ConfigNavItem,
+} from "@app/components/shared/config/configNavSections";
 
 interface SettingsSearchBarProps {
   configNavSections: ConfigNavSection[];
@@ -21,46 +24,52 @@ interface SettingsSearchOption {
   matchedContext?: string;
 }
 
-const SETTINGS_SEARCH_TRANSLATION_PREFIXES: Partial<Record<string, string[]>> = {
-  general: ['settings.general'],
-  hotkeys: ['settings.hotkeys'],
-  account: ['account'],
-  people: ['settings.workspace'],
-  teams: ['settings.workspace', 'settings.team'],
-  'api-keys': ['settings.developer'],
-  connectionMode: ['settings.connection'],
-  planBilling: ['settings.planBilling'],
-  adminGeneral: ['admin.settings.general'],
-  adminFeatures: ['admin.settings.features'],
-  adminEndpoints: ['admin.settings.endpoints'],
-  adminDatabase: ['admin.settings.database'],
-  adminAdvanced: ['admin.settings.advanced'],
-  adminSecurity: ['admin.settings.security'],
-  adminConnections: [
-    'admin.settings.connections',
-    'admin.settings.mail',
-    'admin.settings.security',
-    'admin.settings.telegram',
-    'admin.settings.premium',
-    'admin.settings.general',
-    'settings.securityAuth',
-    'settings.connection',
-  ],
-  adminPlan: ['settings.planBilling', 'admin.settings.premium', 'settings.licensingAnalytics'],
-  adminAudit: ['settings.licensingAnalytics'],
-  adminUsage: ['settings.licensingAnalytics'],
-  adminLegal: ['admin.settings.legal'],
-  adminPrivacy: ['admin.settings.privacy'],
-};
+const SETTINGS_SEARCH_TRANSLATION_PREFIXES: Partial<Record<string, string[]>> =
+  {
+    general: ["settings.general"],
+    hotkeys: ["settings.hotkeys"],
+    account: ["account"],
+    people: ["settings.workspace"],
+    teams: ["settings.workspace", "settings.team"],
+    "api-keys": ["settings.developer"],
+    connectionMode: ["settings.connection"],
+    planBilling: ["settings.planBilling"],
+    adminGeneral: ["admin.settings.general"],
+    adminFeatures: ["admin.settings.features"],
+    adminEndpoints: ["admin.settings.endpoints"],
+    adminDatabase: ["admin.settings.database"],
+    adminAdvanced: ["admin.settings.advanced"],
+    adminSecurity: ["admin.settings.security"],
+    adminConnections: [
+      "admin.settings.connections",
+      "admin.settings.mail",
+      "admin.settings.security",
+      "admin.settings.telegram",
+      "admin.settings.premium",
+      "admin.settings.general",
+      "settings.securityAuth",
+      "settings.connection",
+    ],
+    adminPlan: [
+      "settings.planBilling",
+      "admin.settings.premium",
+      "settings.licensingAnalytics",
+    ],
+    adminAudit: ["settings.licensingAnalytics"],
+    adminUsage: ["settings.licensingAnalytics"],
+    adminLegal: ["admin.settings.legal"],
+    adminPrivacy: ["admin.settings.privacy"],
+  };
 
 const getTranslationPrefixesForNavKey = (key: string): string[] => {
   const explicitPrefixes = SETTINGS_SEARCH_TRANSLATION_PREFIXES[key] ?? [];
 
   const inferredPrefixes: string[] = [];
 
-  if (key.startsWith('admin')) {
-    const adminSuffix = key.replace(/^admin/, '');
-    const normalizedAdminSuffix = adminSuffix.charAt(0).toLowerCase() + adminSuffix.slice(1);
+  if (key.startsWith("admin")) {
+    const adminSuffix = key.replace(/^admin/, "");
+    const normalizedAdminSuffix =
+      adminSuffix.charAt(0).toLowerCase() + adminSuffix.slice(1);
     inferredPrefixes.push(`admin.settings.${normalizedAdminSuffix}`);
   } else {
     inferredPrefixes.push(`settings.${key}`);
@@ -70,7 +79,7 @@ const getTranslationPrefixesForNavKey = (key: string): string[] => {
 };
 
 const flattenTranslationStrings = (value: unknown): string[] => {
-  if (typeof value === 'string') {
+  if (typeof value === "string") {
     const trimmed = value.trim();
     return trimmed ? [trimmed] : [];
   }
@@ -79,8 +88,10 @@ const flattenTranslationStrings = (value: unknown): string[] => {
     return value.flatMap(flattenTranslationStrings);
   }
 
-  if (value && typeof value === 'object') {
-    return Object.values(value as Record<string, unknown>).flatMap(flattenTranslationStrings);
+  if (value && typeof value === "object") {
+    return Object.values(value as Record<string, unknown>).flatMap(
+      flattenTranslationStrings,
+    );
   }
 
   return [];
@@ -102,10 +113,10 @@ const buildMatchSnippet = (text: string, query: string): string => {
   const snippet = text.slice(start, end);
 
   if (snippet.length <= maxLength) {
-    return `${start > 0 ? '…' : ''}${snippet}${end < text.length ? '…' : ''}`;
+    return `${start > 0 ? "…" : ""}${snippet}${end < text.length ? "…" : ""}`;
   }
 
-  return `${start > 0 ? '…' : ''}${snippet.slice(0, maxLength)}${end < text.length ? '…' : ''}`;
+  return `${start > 0 ? "…" : ""}${snippet.slice(0, maxLength)}${end < text.length ? "…" : ""}`;
 };
 
 export const SettingsSearchBar: React.FC<SettingsSearchBarProps> = ({
@@ -114,7 +125,7 @@ export const SettingsSearchBar: React.FC<SettingsSearchBarProps> = ({
   isMobile,
 }) => {
   const { t } = useTranslation();
-  const [searchValue, setSearchValue] = useState('');
+  const [searchValue, setSearchValue] = useState("");
 
   // Build a global index from every accessible settings tab in the modal navigation.
   // This does not render section components, so API calls still happen only when a tab is opened.
@@ -125,7 +136,9 @@ export const SettingsSearchBar: React.FC<SettingsSearchBarProps> = ({
         .map((item: ConfigNavItem) => {
           const translationPrefixes = getTranslationPrefixesForNavKey(item.key);
           const translationContent = translationPrefixes.flatMap((prefix) =>
-            flattenTranslationStrings(t(prefix, { returnObjects: true, defaultValue: {} } as any))
+            flattenTranslationStrings(
+              t(prefix, { returnObjects: true, defaultValue: {} } as any),
+            ),
           );
 
           const searchableContent = Array.from(
@@ -134,7 +147,7 @@ export const SettingsSearchBar: React.FC<SettingsSearchBarProps> = ({
               section.title,
               `/settings/${item.key}`,
               ...translationContent,
-            ])
+            ]),
           );
 
           return {
@@ -144,7 +157,7 @@ export const SettingsSearchBar: React.FC<SettingsSearchBarProps> = ({
             destinationPath: `/settings/${item.key}`,
             searchableContent,
           };
-        })
+        }),
     );
   }, [configNavSections, t]);
 
@@ -156,30 +169,36 @@ export const SettingsSearchBar: React.FC<SettingsSearchBarProps> = ({
 
     const normalizedQuery = query.toLocaleLowerCase();
 
-    return searchableSections.reduce<SettingsSearchOption[]>((accumulator, option) => {
-      const matchedEntry = option.searchableContent.find((entry) =>
-        entry.toLocaleLowerCase().includes(normalizedQuery)
-      );
+    return searchableSections.reduce<SettingsSearchOption[]>(
+      (accumulator, option) => {
+        const matchedEntry = option.searchableContent.find((entry) =>
+          entry.toLocaleLowerCase().includes(normalizedQuery),
+        );
+
+        if (!matchedEntry) {
+          return accumulator;
+        }
+
+        accumulator.push({
+          ...option,
+          matchedContext: buildMatchSnippet(matchedEntry, query),
+        });
 
-      if (!matchedEntry) {
         return accumulator;
-      }
-
-      accumulator.push({
-        ...option,
-        matchedContext: buildMatchSnippet(matchedEntry, query),
-      });
-
-      return accumulator;
-    }, []);
+      },
+      [],
+    );
   }, [searchValue, searchableSections]);
 
-  const handleSearchNavigation = useCallback(async (value: string | null) => {
-    if (!value) return;
-    if (!VALID_NAV_KEYS.includes(value as NavKey)) return;
-    await onNavigate(value as NavKey);
-    setSearchValue('');
-  }, [onNavigate]);
+  const handleSearchNavigation = useCallback(
+    async (value: string | null) => {
+      if (!value) return;
+      if (!VALID_NAV_KEYS.includes(value as NavKey)) return;
+      await onNavigate(value as NavKey);
+      setSearchValue("");
+    },
+    [onNavigate],
+  );
 
   return (
     <Select
@@ -189,10 +208,10 @@ export const SettingsSearchBar: React.FC<SettingsSearchBarProps> = ({
       searchValue={searchValue}
       onSearchChange={setSearchValue}
       onChange={handleSearchNavigation}
-      placeholder={t('settings.search.placeholder', 'Search settings pages...')}
+      placeholder={t("settings.search.placeholder", "Search settings pages...")}
       leftSection={<LocalIcon icon="search-rounded" width={16} height={16} />}
-      aria-label={t('navbar.search', 'Search')}
-      nothingFoundMessage={t('search.noResults', 'No results found')}
+      aria-label={t("navbar.search", "Search")}
+      nothingFoundMessage={t("search.noResults", "No results found")}
       searchable
       clearable={false}
       w={isMobile ? 170 : 320}
@@ -201,9 +220,12 @@ export const SettingsSearchBar: React.FC<SettingsSearchBarProps> = ({
         const searchOption = option as unknown as SettingsSearchOption;
         return (
           <div className="settings-search-option">
-            <Text size="sm" fw={600}>{searchOption.label}</Text>
+            <Text size="sm" fw={600}>
+              {searchOption.label}
+            </Text>
             <Text size="xs" c="dimmed">
-              {searchOption.sectionTitle} · {searchOption.matchedContext || searchOption.destinationPath}
+              {searchOption.sectionTitle} ·{" "}
+              {searchOption.matchedContext || searchOption.destinationPath}
             </Text>
           </div>
         );
diff --git a/frontend/src/core/components/shared/config/SettingsStickyFooter.tsx b/frontend/src/core/components/shared/config/SettingsStickyFooter.tsx
index 0a533d57ee..a640bb1a22 100644
--- a/frontend/src/core/components/shared/config/SettingsStickyFooter.tsx
+++ b/frontend/src/core/components/shared/config/SettingsStickyFooter.tsx
@@ -1,5 +1,5 @@
-import { Button, Group, Text } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
+import { Button, Group, Text } from "@mantine/core";
+import { useTranslation } from "react-i18next";
 
 interface SettingsStickyFooterProps {
   isDirty: boolean;
@@ -26,14 +26,14 @@ export function SettingsStickyFooter({
     <div className="settings-sticky-footer">
       <Group justify="space-between" w="100%">
         <Text size="sm" c="dimmed">
-          {t('admin.settings.unsavedChanges.hint', 'You have unsaved changes')}
+          {t("admin.settings.unsavedChanges.hint", "You have unsaved changes")}
         </Text>
         <Group gap="sm">
           <Button variant="default" onClick={onDiscard} size="sm">
-            {t('admin.settings.discard', 'Discard')}
+            {t("admin.settings.discard", "Discard")}
           </Button>
           <Button onClick={onSave} loading={saving} size="sm">
-            {t('admin.settings.save', 'Save Changes')}
+            {t("admin.settings.save", "Save Changes")}
           </Button>
         </Group>
       </Group>
diff --git a/frontend/src/core/components/shared/config/configNavSections.tsx b/frontend/src/core/components/shared/config/configNavSections.tsx
index 7a0bef8c06..d9b9f56d83 100644
--- a/frontend/src/core/components/shared/config/configNavSections.tsx
+++ b/frontend/src/core/components/shared/config/configNavSections.tsx
@@ -1,8 +1,8 @@
-import React from 'react';
-import { useTranslation } from 'react-i18next';
-import { NavKey } from '@app/components/shared/config/types';
-import HotkeysSection from '@app/components/shared/config/configSections/HotkeysSection';
-import GeneralSection from '@app/components/shared/config/configSections/GeneralSection';
+import React from "react";
+import { useTranslation } from "react-i18next";
+import { NavKey } from "@app/components/shared/config/types";
+import HotkeysSection from "@app/components/shared/config/configSections/HotkeysSection";
+import GeneralSection from "@app/components/shared/config/configSections/GeneralSection";
 
 export interface ConfigNavItem {
   key: NavKey;
@@ -11,6 +11,8 @@ export interface ConfigNavItem {
   component: React.ReactNode;
   disabled?: boolean;
   disabledTooltip?: string;
+  badge?: string;
+  badgeColor?: string;
 }
 
 export interface ConfigNavSection {
@@ -31,25 +33,25 @@ export interface ConfigColors {
 export const useConfigNavSections = (
   _isAdmin: boolean = false,
   _runningEE: boolean = false,
-  _loginEnabled: boolean = false
+  _loginEnabled: boolean = false,
 ): ConfigNavSection[] => {
   const { t } = useTranslation();
 
   const sections: ConfigNavSection[] = [
     {
-      title: t('settings.preferences.title', 'Preferences'),
+      title: t("settings.preferences.title", "Preferences"),
       items: [
         {
-          key: 'general',
-          label: t('settings.general.title', 'General'),
-          icon: 'settings-rounded',
-          component: <GeneralSection />
+          key: "general",
+          label: t("settings.general.title", "General"),
+          icon: "settings-rounded",
+          component: <GeneralSection />,
         },
         {
-          key: 'hotkeys',
-          label: t('settings.hotkeys.title', 'Keyboard Shortcuts'),
-          icon: 'keyboard-rounded',
-          component: <HotkeysSection />
+          key: "hotkeys",
+          label: t("settings.hotkeys.title", "Keyboard Shortcuts"),
+          icon: "keyboard-rounded",
+          component: <HotkeysSection />,
         },
       ],
     },
@@ -62,24 +64,26 @@ export const useConfigNavSections = (
 export const createConfigNavSections = (
   _isAdmin: boolean = false,
   _runningEE: boolean = false,
-  _loginEnabled: boolean = false
+  _loginEnabled: boolean = false,
 ): ConfigNavSection[] => {
-  console.warn('createConfigNavSections is deprecated. Use useConfigNavSections hook instead for proper i18n support.');
+  console.warn(
+    "createConfigNavSections is deprecated. Use useConfigNavSections hook instead for proper i18n support.",
+  );
   const sections: ConfigNavSection[] = [
     {
-      title: 'Preferences',
+      title: "Preferences",
       items: [
         {
-          key: 'general',
-          label: 'General',
-          icon: 'settings-rounded',
-          component: <GeneralSection />
+          key: "general",
+          label: "General",
+          icon: "settings-rounded",
+          component: <GeneralSection />,
         },
         {
-          key: 'hotkeys',
-          label: 'Keyboard Shortcuts',
-          icon: 'keyboard-rounded',
-          component: <HotkeysSection />
+          key: "hotkeys",
+          label: "Keyboard Shortcuts",
+          icon: "keyboard-rounded",
+          component: <HotkeysSection />,
         },
       ],
     },
diff --git a/frontend/src/core/components/shared/config/configSections/GeneralSection.tsx b/frontend/src/core/components/shared/config/configSections/GeneralSection.tsx
index 2d4c9f42de..34d7fcbe56 100644
--- a/frontend/src/core/components/shared/config/configSections/GeneralSection.tsx
+++ b/frontend/src/core/components/shared/config/configSections/GeneralSection.tsx
@@ -7,6 +7,7 @@ import {
   Tooltip,
   NumberInput,
   SegmentedControl,
+  Select,
   Code,
   Group,
   Anchor,
@@ -19,6 +20,11 @@ import { useTranslation } from "react-i18next";
 import { usePreferences } from "@app/contexts/PreferencesContext";
 import { useAppConfig } from "@app/contexts/AppConfigContext";
 import type { ToolPanelMode } from "@app/constants/toolPanel";
+import type {
+  StartupView,
+  ViewerZoomSetting,
+} from "@app/services/preferencesService";
+import { Z_INDEX_OVER_CONFIG_MODAL } from "@app/styles/zIndex";
 import LocalIcon from "@app/components/shared/LocalIcon";
 import { updateService, UpdateSummary } from "@app/services/updateService";
 import UpdateModal from "@app/components/shared/UpdateModal";
@@ -33,19 +39,29 @@ interface GeneralSectionProps {
   hideAdminBanner?: boolean;
 }
 
-const GeneralSection: React.FC<GeneralSectionProps> = ({ hideTitle = false, hideUpdateSection = false, hideAdminBanner = false }) => {
+const GeneralSection: React.FC<GeneralSectionProps> = ({
+  hideTitle = false,
+  hideUpdateSection = false,
+  hideAdminBanner = false,
+}) => {
   const { t } = useTranslation();
   const { preferences, updatePreference } = usePreferences();
   const { config } = useAppConfig();
-  const [fileLimitInput, setFileLimitInput] = useState<number | string>(preferences.autoUnzipFileLimit);
+  const [fileLimitInput, setFileLimitInput] = useState<number | string>(
+    preferences.autoUnzipFileLimit,
+  );
   const [bannerDismissed, setBannerDismissed] = useState(() => {
     // Check localStorage on mount
     return localStorage.getItem(BANNER_DISMISSED_KEY) === "true";
   });
-  const [updateSummary, setUpdateSummary] = useState<UpdateSummary | null>(null);
+  const [updateSummary, setUpdateSummary] = useState<UpdateSummary | null>(
+    null,
+  );
   const [updateModalOpened, setUpdateModalOpened] = useState(false);
   const [checkingUpdate, setCheckingUpdate] = useState(false);
-  const { appVersion, mismatchVersion } = useFrontendVersionInfo(config?.appVersion);
+  const { appVersion, mismatchVersion } = useFrontendVersionInfo(
+    config?.appVersion,
+  );
   const frontendVersionLabel = appVersion ?? t("common.loading", "Loading..."); // null = loading, shown only when appVersion !== undefined
 
   // Sync local state with preference changes
@@ -72,9 +88,16 @@ const GeneralSection: React.FC<GeneralSectionProps> = ({ hideTitle = false, hide
       licenseType: config.license ?? "NORMAL",
     };
 
-    const summary = await updateService.getUpdateSummary(config.appVersion, machineInfo);
+    const summary = await updateService.getUpdateSummary(
+      config.appVersion,
+      machineInfo,
+    );
     if (summary && summary.latest_version) {
-      const isNewerVersion = updateService.compareVersions(summary.latest_version, config.appVersion) > 0;
+      const isNewerVersion =
+        updateService.compareVersions(
+          summary.latest_version,
+          config.appVersion,
+        ) > 0;
       if (isNewerVersion) {
         setUpdateSummary(summary);
       } else {
@@ -104,13 +127,24 @@ const GeneralSection: React.FC<GeneralSectionProps> = ({ hideTitle = false, hide
             {t("settings.general.title", "General")}
           </Text>
           <Text size="sm" c="dimmed">
-            {t("settings.general.description", "Configure general application preferences.")}
+            {t(
+              "settings.general.description",
+              "Configure general application preferences.",
+            )}
           </Text>
         </div>
       )}
 
       {!hideAdminBanner && loginDisabled && !bannerDismissed && (
-        <Paper withBorder p="md" radius="md" style={{ background: "var(--mantine-color-blue-0)", position: "relative" }}>
+        <Paper
+          withBorder
+          p="md"
+          radius="md"
+          style={{
+            background: "var(--mantine-color-blue-0)",
+            position: "relative",
+          }}
+        >
           <ActionIcon
             variant="subtle"
             color="gray"
@@ -129,8 +163,15 @@ const GeneralSection: React.FC<GeneralSectionProps> = ({ hideTitle = false, hide
                 height="1.2rem"
                 style={{ color: "var(--mantine-color-blue-6)" }}
               />
-              <Text fw={600} size="sm" style={{ color: "var(--mantine-color-blue-9)" }}>
-                {t("settings.general.enableFeatures.title", "For System Administrators")}
+              <Text
+                fw={600}
+                size="sm"
+                style={{ color: "var(--mantine-color-blue-9)" }}
+              >
+                {t(
+                  "settings.general.enableFeatures.title",
+                  "For System Administrators",
+                )}
               </Text>
             </Group>
             <Text size="sm" c="dimmed">
@@ -161,7 +202,11 @@ const GeneralSection: React.FC<GeneralSectionProps> = ({ hideTitle = false, hide
               size="sm"
               style={{ color: "var(--mantine-color-blue-6)" }}
             >
-              {t("settings.general.enableFeatures.learnMore", "Learn more in documentation")} →
+              {t(
+                "settings.general.enableFeatures.learnMore",
+                "Learn more in documentation",
+              )}{" "}
+              →
             </Anchor>
           </Stack>
         </Paper>
@@ -178,11 +223,19 @@ const GeneralSection: React.FC<GeneralSectionProps> = ({ hideTitle = false, hide
                     {t("settings.general.updates.title", "Software Updates")}
                   </Text>
                   <Text size="xs" c="dimmed" mt={4}>
-                    {t("settings.general.updates.description", "Check for updates and view version information")}
+                    {t(
+                      "settings.general.updates.description",
+                      "Check for updates and view version information",
+                    )}
                   </Text>
                 </div>
                 {updateSummary && (
-                  <Badge color={updateSummary.max_priority === "urgent" ? "red" : "blue"} variant="filled">
+                  <Badge
+                    color={
+                      updateSummary.max_priority === "urgent" ? "red" : "blue"
+                    }
+                    variant="filled"
+                  >
                     {updateSummary.max_priority === "urgent"
                       ? t("update.urgentUpdateAvailable", "Urgent Update")
                       : t("update.updateAvailable", "Update Available")}
@@ -194,7 +247,11 @@ const GeneralSection: React.FC<GeneralSectionProps> = ({ hideTitle = false, hide
               <Group justify="space-between" align="center">
                 <div>
                   <Text size="sm" c="dimmed">
-                    {t("settings.general.updates.currentFrontendVersion", "Current Frontend Version")}:{" "}
+                    {t(
+                      "settings.general.updates.currentFrontendVersion",
+                      "Current Frontend Version",
+                    )}
+                    :{" "}
                     <Text component="span" fw={500}>
                       {frontendVersionLabel}
                     </Text>
@@ -213,14 +270,22 @@ const GeneralSection: React.FC<GeneralSectionProps> = ({ hideTitle = false, hide
             <Group justify="space-between" align="center">
               <div>
                 <Text size="sm" c="dimmed">
-                  {t("settings.general.updates.currentBackendVersion", "Current Backend Version")}:{" "}
+                  {t(
+                    "settings.general.updates.currentBackendVersion",
+                    "Current Backend Version",
+                  )}
+                  :{" "}
                   <Text component="span" fw={500}>
                     {config.appVersion}
                   </Text>
                 </Text>
                 {updateSummary && (
                   <Text size="sm" c="dimmed" mt={4}>
-                    {t("settings.general.updates.latestVersion", "Latest Version")}:{" "}
+                    {t(
+                      "settings.general.updates.latestVersion",
+                      "Latest Version",
+                    )}
+                    :{" "}
                     <Text component="span" fw={500} c="blue">
                       {updateSummary.latest_version}
                     </Text>
@@ -233,16 +298,33 @@ const GeneralSection: React.FC<GeneralSectionProps> = ({ hideTitle = false, hide
                   variant="default"
                   onClick={checkForUpdate}
                   loading={checkingUpdate}
-                  leftSection={<LocalIcon icon="refresh-rounded" width="1rem" height="1rem" />}
+                  leftSection={
+                    <LocalIcon
+                      icon="refresh-rounded"
+                      width="1rem"
+                      height="1rem"
+                    />
+                  }
                 >
-                  {t("settings.general.updates.checkForUpdates", "Check for Updates")}
+                  {t(
+                    "settings.general.updates.checkForUpdates",
+                    "Check for Updates",
+                  )}
                 </Button>
                 {updateSummary && (
                   <Button
                     size="sm"
-                    color={updateSummary.max_priority === "urgent" ? "red" : "blue"}
+                    color={
+                      updateSummary.max_priority === "urgent" ? "red" : "blue"
+                    }
                     onClick={() => setUpdateModalOpened(true)}
-                    leftSection={<LocalIcon icon="system-update-alt-rounded" width="1rem" height="1rem" />}
+                    leftSection={
+                      <LocalIcon
+                        icon="system-update-alt-rounded"
+                        width="1rem"
+                        height="1rem"
+                      />
+                    }
                   >
                     {t("settings.general.updates.viewDetails", "View Details")}
                   </Button>
@@ -253,7 +335,10 @@ const GeneralSection: React.FC<GeneralSectionProps> = ({ hideTitle = false, hide
             {updateSummary?.any_breaking && (
               <Alert
                 color="orange"
-                title={t("update.breakingChangesDetected", "Breaking Changes Detected")}
+                title={t(
+                  "update.breakingChangesDetected",
+                  "Breaking Changes Detected",
+                )}
                 styles={{
                   title: { fontWeight: 600 },
                 }}
@@ -272,10 +357,19 @@ const GeneralSection: React.FC<GeneralSectionProps> = ({ hideTitle = false, hide
 
       <Paper withBorder p="md" radius="md">
         <Stack gap="md">
-          <div style={{ display: "flex", alignItems: "center", justifyContent: "space-between" }}>
+          <div
+            style={{
+              display: "flex",
+              alignItems: "center",
+              justifyContent: "space-between",
+            }}
+          >
             <div>
               <Text fw={500} size="sm">
-                {t("settings.general.defaultToolPickerMode", "Default tool picker mode")}
+                {t(
+                  "settings.general.defaultToolPickerMode",
+                  "Default tool picker mode",
+                )}
               </Text>
               <Text size="xs" c="dimmed" mt={4}>
                 {t(
@@ -286,17 +380,131 @@ const GeneralSection: React.FC<GeneralSectionProps> = ({ hideTitle = false, hide
             </div>
             <SegmentedControl
               value={preferences.defaultToolPanelMode}
-              onChange={(val: string) => updatePreference("defaultToolPanelMode", val as ToolPanelMode)}
+              onChange={(val: string) =>
+                updatePreference("defaultToolPanelMode", val as ToolPanelMode)
+              }
               data={[
-                { label: t("settings.general.mode.sidebar", "Sidebar"), value: "sidebar" },
-                { label: t("settings.general.mode.fullscreen", "Fullscreen"), value: "fullscreen" },
+                {
+                  label: t("settings.general.mode.sidebar", "Sidebar"),
+                  value: "sidebar",
+                },
+                {
+                  label: t("settings.general.mode.fullscreen", "Fullscreen"),
+                  value: "fullscreen",
+                },
               ]}
             />
           </div>
-          <div style={{ display: "flex", alignItems: "center", justifyContent: "space-between" }}>
+          <div
+            style={{
+              display: "flex",
+              alignItems: "center",
+              justifyContent: "space-between",
+            }}
+          >
             <div>
               <Text fw={500} size="sm">
-                {t("settings.general.hideUnavailableTools", "Hide unavailable tools")}
+                {t(
+                  "settings.general.defaultStartupView",
+                  "Default view on launch",
+                )}
+              </Text>
+              <Text size="xs" c="dimmed" mt={4}>
+                {t(
+                  "settings.general.defaultStartupViewDescription",
+                  "Choose which tab is active in the left column when the app starts",
+                )}
+              </Text>
+            </div>
+            <SegmentedControl
+              value={preferences.defaultStartupView}
+              onChange={(val: string) =>
+                updatePreference("defaultStartupView", val as StartupView)
+              }
+              data={[
+                {
+                  label: t("settings.general.startupView.tools", "Tools"),
+                  value: "tools",
+                },
+                {
+                  label: t("settings.general.startupView.read", "Reader"),
+                  value: "read",
+                },
+                {
+                  label: t("settings.general.startupView.automate", "Automate"),
+                  value: "automate",
+                },
+              ]}
+            />
+          </div>
+          <div
+            style={{
+              display: "flex",
+              alignItems: "center",
+              justifyContent: "space-between",
+            }}
+          >
+            <div>
+              <Text fw={500} size="sm">
+                {t("settings.general.defaultViewerZoom", "Default reader zoom")}
+              </Text>
+              <Text size="xs" c="dimmed" mt={4}>
+                {t(
+                  "settings.general.defaultViewerZoomDescription",
+                  "Set the default zoom level when opening PDFs in the reader",
+                )}
+              </Text>
+            </div>
+            <Select
+              value={preferences.defaultViewerZoom}
+              onChange={(val: string | null) => {
+                if (val)
+                  updatePreference(
+                    "defaultViewerZoom",
+                    val as ViewerZoomSetting,
+                  );
+              }}
+              data={[
+                {
+                  label: t("settings.general.zoomLevel.auto", "Auto"),
+                  value: "auto",
+                },
+                {
+                  label: t("settings.general.zoomLevel.fitWidth", "Fit width"),
+                  value: "fitWidth",
+                },
+                {
+                  label: t("settings.general.zoomLevel.fitPage", "Fit page"),
+                  value: "fitPage",
+                },
+                { label: "50%", value: "50" },
+                { label: "75%", value: "75" },
+                { label: "100%", value: "100" },
+                { label: "125%", value: "125" },
+                { label: "150%", value: "150" },
+                { label: "200%", value: "200" },
+              ]}
+              style={{ width: 140 }}
+              allowDeselect={false}
+              comboboxProps={{
+                withinPortal: true,
+                zIndex: Z_INDEX_OVER_CONFIG_MODAL,
+              }}
+            />
+          </div>
+          <div
+            style={{
+              display: "flex",
+              alignItems: "center",
+              justifyContent: "space-between",
+            }}
+          >
+            <div>
+              <Text fw={500} size="sm">
+                {t(
+                  "settings.general.hideUnavailableTools",
+                  "Hide unavailable tools",
+                )}
               </Text>
               <Text size="xs" c="dimmed" mt={4}>
                 {t(
@@ -307,13 +515,27 @@ const GeneralSection: React.FC<GeneralSectionProps> = ({ hideTitle = false, hide
             </div>
             <Switch
               checked={preferences.hideUnavailableTools}
-              onChange={(event) => updatePreference("hideUnavailableTools", event.currentTarget.checked)}
+              onChange={(event) =>
+                updatePreference(
+                  "hideUnavailableTools",
+                  event.currentTarget.checked,
+                )
+              }
             />
           </div>
-          <div style={{ display: "flex", alignItems: "center", justifyContent: "space-between" }}>
+          <div
+            style={{
+              display: "flex",
+              alignItems: "center",
+              justifyContent: "space-between",
+            }}
+          >
             <div>
               <Text fw={500} size="sm">
-                {t("settings.general.hideUnavailableConversions", "Hide unavailable conversions")}
+                {t(
+                  "settings.general.hideUnavailableConversions",
+                  "Hide unavailable conversions",
+                )}
               </Text>
               <Text size="xs" c="dimmed" mt={4}>
                 {t(
@@ -324,7 +546,12 @@ const GeneralSection: React.FC<GeneralSectionProps> = ({ hideTitle = false, hide
             </div>
             <Switch
               checked={preferences.hideUnavailableConversions}
-              onChange={(event) => updatePreference("hideUnavailableConversions", event.currentTarget.checked)}
+              onChange={(event) =>
+                updatePreference(
+                  "hideUnavailableConversions",
+                  event.currentTarget.checked,
+                )
+              }
             />
           </div>
           <Tooltip
@@ -336,18 +563,30 @@ const GeneralSection: React.FC<GeneralSectionProps> = ({ hideTitle = false, hide
             w={300}
             withArrow
           >
-            <div style={{ display: "flex", alignItems: "center", justifyContent: "space-between", cursor: "help" }}>
+            <div
+              style={{
+                display: "flex",
+                alignItems: "center",
+                justifyContent: "space-between",
+                cursor: "help",
+              }}
+            >
               <div>
                 <Text fw={500} size="sm">
                   {t("settings.general.autoUnzip", "Auto-unzip API responses")}
                 </Text>
                 <Text size="xs" c="dimmed" mt={4}>
-                  {t("settings.general.autoUnzipDescription", "Automatically extract files from ZIP responses")}
+                  {t(
+                    "settings.general.autoUnzipDescription",
+                    "Automatically extract files from ZIP responses",
+                  )}
                 </Text>
               </div>
               <Switch
                 checked={preferences.autoUnzip}
-                onChange={(event) => updatePreference("autoUnzip", event.currentTarget.checked)}
+                onChange={(event) =>
+                  updatePreference("autoUnzip", event.currentTarget.checked)
+                }
               />
             </div>
           </Tooltip>
@@ -361,13 +600,26 @@ const GeneralSection: React.FC<GeneralSectionProps> = ({ hideTitle = false, hide
             w={300}
             withArrow
           >
-            <div style={{ display: "flex", alignItems: "center", justifyContent: "space-between", cursor: "help" }}>
+            <div
+              style={{
+                display: "flex",
+                alignItems: "center",
+                justifyContent: "space-between",
+                cursor: "help",
+              }}
+            >
               <div>
                 <Text fw={500} size="sm">
-                  {t("settings.general.autoUnzipFileLimit", "Auto-unzip file limit")}
+                  {t(
+                    "settings.general.autoUnzipFileLimit",
+                    "Auto-unzip file limit",
+                  )}
                 </Text>
                 <Text size="xs" c="dimmed" mt={4}>
-                  {t("settings.general.autoUnzipFileLimitDescription", "Maximum number of files to extract from ZIP")}
+                  {t(
+                    "settings.general.autoUnzipFileLimitDescription",
+                    "Maximum number of files to extract from ZIP",
+                  )}
                 </Text>
               </div>
               <NumberInput
@@ -376,7 +628,10 @@ const GeneralSection: React.FC<GeneralSectionProps> = ({ hideTitle = false, hide
                 onBlur={() => {
                   const numValue = Number(fileLimitInput);
                   const finalValue =
-                    !fileLimitInput || isNaN(numValue) || numValue < 1 || numValue > 100
+                    !fileLimitInput ||
+                    isNaN(numValue) ||
+                    numValue < 1 ||
+                    numValue > 100
                       ? DEFAULT_AUTO_UNZIP_FILE_LIMIT
                       : numValue;
                   setFileLimitInput(finalValue);
diff --git a/frontend/src/core/components/shared/config/configSections/HotkeysSection.tsx b/frontend/src/core/components/shared/config/configSections/HotkeysSection.tsx
index 8d0774fbe1..e7e15c9e89 100644
--- a/frontend/src/core/components/shared/config/configSections/HotkeysSection.tsx
+++ b/frontend/src/core/components/shared/config/configSections/HotkeysSection.tsx
@@ -1,45 +1,73 @@
-import React, { useEffect, useMemo, useState } from 'react';
-import { Alert, Badge, Box, Button, Divider, Group, Paper, Stack, Text, TextInput } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { useToolWorkflow } from '@app/contexts/ToolWorkflowContext';
-import { useHotkeys } from '@app/contexts/HotkeyContext';
-import { ToolId } from '@app/types/toolId';
-import HotkeyDisplay from '@app/components/hotkeys/HotkeyDisplay';
-import { bindingEquals, eventToBinding, HotkeyBinding } from '@app/utils/hotkeys';
+import React, { useEffect, useMemo, useState } from "react";
+import {
+  Alert,
+  Badge,
+  Box,
+  Button,
+  Divider,
+  Group,
+  Paper,
+  Stack,
+  Text,
+  TextInput,
+} from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import { useToolWorkflow } from "@app/contexts/ToolWorkflowContext";
+import { useHotkeys } from "@app/contexts/HotkeyContext";
+import { ToolId } from "@app/types/toolId";
+import HotkeyDisplay from "@app/components/hotkeys/HotkeyDisplay";
+import {
+  bindingEquals,
+  eventToBinding,
+  HotkeyBinding,
+} from "@app/utils/hotkeys";
 import { ToolRegistryEntry } from "@app/data/toolsTaxonomy";
 
 const rowStyle: React.CSSProperties = {
-  display: 'flex',
-  flexDirection: 'column',
-  gap: '0.5rem',
+  display: "flex",
+  flexDirection: "column",
+  gap: "0.5rem",
 };
 
 const rowHeaderStyle: React.CSSProperties = {
-  display: 'flex',
-  flexWrap: 'wrap',
-  alignItems: 'center',
-  justifyContent: 'space-between',
-  gap: '0.5rem',
+  display: "flex",
+  flexWrap: "wrap",
+  alignItems: "center",
+  justifyContent: "space-between",
+  gap: "0.5rem",
 };
 
 const HotkeysSection: React.FC = () => {
   const { t } = useTranslation();
   const { toolRegistry } = useToolWorkflow();
-  const { hotkeys, defaults, updateHotkey, resetHotkey, pauseHotkeys, resumeHotkeys, getDisplayParts, isMac } = useHotkeys();
+  const {
+    hotkeys,
+    defaults,
+    updateHotkey,
+    resetHotkey,
+    pauseHotkeys,
+    resumeHotkeys,
+    getDisplayParts,
+    isMac,
+  } = useHotkeys();
   const [editingTool, setEditingTool] = useState<ToolId | null>(null);
   const [error, setError] = useState<string | null>(null);
-  const [searchQuery, setSearchQuery] = useState<string>('');
+  const [searchQuery, setSearchQuery] = useState<string>("");
 
-  const tools = useMemo(() => Object.entries(toolRegistry) as [ToolId, ToolRegistryEntry][], [toolRegistry]);
+  const tools = useMemo(
+    () => Object.entries(toolRegistry) as [ToolId, ToolRegistryEntry][],
+    [toolRegistry],
+  );
 
   const filteredTools = useMemo(() => {
     if (!searchQuery.trim()) return tools;
-    
+
     const query = searchQuery.toLowerCase();
-    return tools.filter(([toolId, tool]) => 
-      tool.name.toLowerCase().includes(query) ||
-      tool.description.toLowerCase().includes(query) ||
-      toolId.toLowerCase().includes(query)
+    return tools.filter(
+      ([toolId, tool]) =>
+        tool.name.toLowerCase().includes(query) ||
+        tool.description.toLowerCase().includes(query) ||
+        toolId.toLowerCase().includes(query),
     );
   }, [tools, searchQuery]);
 
@@ -59,7 +87,7 @@ const HotkeysSection: React.FC = () => {
     }
 
     const handleKeyDown = (event: KeyboardEvent) => {
-      if (event.key === 'Escape') {
+      if (event.key === "Escape") {
         event.preventDefault();
         event.stopPropagation();
         setEditingTool(null);
@@ -72,21 +100,31 @@ const HotkeysSection: React.FC = () => {
 
       const binding = eventToBinding(event as KeyboardEvent);
       if (!binding) {
-        const osKey = isMac ? 'mac' : 'windows';
+        const osKey = isMac ? "mac" : "windows";
         setError(t(`settings.hotkeys.errorModifier.${osKey}`));
         return;
       }
 
-      const conflictEntry = (Object.entries(hotkeys) as [ToolId, HotkeyBinding][]).find(([toolId, existing]) => (
-        toolId !== editingTool && bindingEquals(existing, binding)
-      ));
+      const conflictEntry = (
+        Object.entries(hotkeys) as [ToolId, HotkeyBinding][]
+      ).find(
+        ([toolId, existing]) =>
+          toolId !== editingTool && bindingEquals(existing, binding),
+      );
 
       if (conflictEntry) {
         const conflictKey = conflictEntry[0];
-        const conflictTool = (conflictKey in toolRegistry)
-          ? toolRegistry[conflictKey as ToolId]?.name
-          : conflictKey;
-        setError(t('settings.hotkeys.errorConflict', 'Shortcut already used by {{tool}}.', { tool: conflictTool }));
+        const conflictTool =
+          conflictKey in toolRegistry
+            ? toolRegistry[conflictKey as ToolId]?.name
+            : conflictKey;
+        setError(
+          t(
+            "settings.hotkeys.errorConflict",
+            "Shortcut already used by {{tool}}.",
+            { tool: conflictTool },
+          ),
+        );
         return;
       }
 
@@ -95,9 +133,9 @@ const HotkeysSection: React.FC = () => {
       setError(null);
     };
 
-    window.addEventListener('keydown', handleKeyDown, true);
+    window.addEventListener("keydown", handleKeyDown, true);
     return () => {
-      window.removeEventListener('keydown', handleKeyDown, true);
+      window.removeEventListener("keydown", handleKeyDown, true);
     };
   }, [editingTool, hotkeys, toolRegistry, updateHotkey, t]);
 
@@ -109,14 +147,19 @@ const HotkeysSection: React.FC = () => {
   return (
     <Stack gap="lg">
       <div>
-        <Text fw={600} size="lg">{t('settings.hotkeys.title', 'Keyboard Shortcuts')}</Text>
+        <Text fw={600} size="lg">
+          {t("settings.hotkeys.title", "Keyboard Shortcuts")}
+        </Text>
         <Text size="sm" c="dimmed">
-          {t('settings.hotkeys.description', 'Customize keyboard shortcuts for quick tool access. Click "Change shortcut" and press a new key combination. Press Esc to cancel.')}
+          {t(
+            "settings.hotkeys.description",
+            'Customize keyboard shortcuts for quick tool access. Click "Change shortcut" and press a new key combination. Press Esc to cancel.',
+          )}
         </Text>
       </div>
 
       <TextInput
-        placeholder={t('settings.hotkeys.searchPlaceholder', 'Search tools...')}
+        placeholder={t("settings.hotkeys.searchPlaceholder", "Search tools...")}
         value={searchQuery}
         onChange={(event) => setSearchQuery(event.currentTarget.value)}
         size="md"
@@ -127,70 +170,88 @@ const HotkeysSection: React.FC = () => {
         <Stack gap="md">
           {filteredTools.length === 0 ? (
             <Text c="dimmed" ta="center" py="xl">
-              {t('toolPicker.noToolsFound', 'No tools found')}
+              {t("toolPicker.noToolsFound", "No tools found")}
             </Text>
           ) : (
             filteredTools.map(([toolId, tool], index) => {
-            const currentBinding = hotkeys[toolId];
-            const defaultBinding = defaults[toolId];
-            const isEditing = editingTool === toolId;
-            const defaultParts = getDisplayParts(defaultBinding);
-            const defaultLabel = defaultParts.length > 0
-              ? defaultParts.join(' + ')
-              : t('settings.hotkeys.none', 'Not assigned');
+              const currentBinding = hotkeys[toolId];
+              const defaultBinding = defaults[toolId];
+              const isEditing = editingTool === toolId;
+              const defaultParts = getDisplayParts(defaultBinding);
+              const defaultLabel =
+                defaultParts.length > 0
+                  ? defaultParts.join(" + ")
+                  : t("settings.hotkeys.none", "Not assigned");
 
-            return (
-              <React.Fragment key={toolId}>
-                <Box style={rowStyle} data-testid={`hotkey-row-${toolId}`}>
-                  <div style={rowHeaderStyle}>
-                    <div style={{ display: 'flex', flexDirection: 'column', gap: '0.25rem', minWidth: 0 }}>
-                      <Text fw={600}>{tool.name}</Text>
-                      <Group gap="xs" wrap="wrap" align="center">
-                        <HotkeyDisplay binding={currentBinding} size="md" />
-                        {!bindingEquals(currentBinding, defaultBinding) && (
-                          <Badge variant="light" color="orange" radius="sm">
-                            {t('settings.hotkeys.customBadge', 'Custom')}
-                          </Badge>
-                        )}
-                        <Text size="xs" c="dimmed">
-                          {t('settings.hotkeys.defaultLabel', 'Default: {{shortcut}}', { shortcut: defaultLabel })}
-                        </Text>
+              return (
+                <React.Fragment key={toolId}>
+                  <Box style={rowStyle} data-testid={`hotkey-row-${toolId}`}>
+                    <div style={rowHeaderStyle}>
+                      <div
+                        style={{
+                          display: "flex",
+                          flexDirection: "column",
+                          gap: "0.25rem",
+                          minWidth: 0,
+                        }}
+                      >
+                        <Text fw={600}>{tool.name}</Text>
+                        <Group gap="xs" wrap="wrap" align="center">
+                          <HotkeyDisplay binding={currentBinding} size="md" />
+                          {!bindingEquals(currentBinding, defaultBinding) && (
+                            <Badge variant="light" color="orange" radius="sm">
+                              {t("settings.hotkeys.customBadge", "Custom")}
+                            </Badge>
+                          )}
+                          <Text size="xs" c="dimmed">
+                            {t(
+                              "settings.hotkeys.defaultLabel",
+                              "Default: {{shortcut}}",
+                              { shortcut: defaultLabel },
+                            )}
+                          </Text>
+                        </Group>
+                      </div>
+
+                      <Group gap="xs">
+                        <Button
+                          size="xs"
+                          variant={isEditing ? "filled" : "default"}
+                          color={isEditing ? "blue" : undefined}
+                          onClick={() => handleStartCapture(toolId)}
+                        >
+                          {isEditing
+                            ? t(
+                                "settings.hotkeys.capturing",
+                                "Press keys… (Esc to cancel)",
+                              )
+                            : t("settings.hotkeys.change", "Change shortcut")}
+                        </Button>
+                        <Button
+                          size="xs"
+                          variant="subtle"
+                          disabled={bindingEquals(
+                            currentBinding,
+                            defaultBinding,
+                          )}
+                          onClick={() => resetHotkey(toolId)}
+                        >
+                          {t("settings.hotkeys.reset", "Reset")}
+                        </Button>
                       </Group>
                     </div>
 
-                    <Group gap="xs">
-                      <Button
-                        size="xs"
-                        variant={isEditing ? 'filled' : 'default'}
-                        color={isEditing ? 'blue' : undefined}
-                        onClick={() => handleStartCapture(toolId)}
-                      >
-                        {isEditing
-                          ? t('settings.hotkeys.capturing', 'Press keys… (Esc to cancel)')
-                          : t('settings.hotkeys.change', 'Change shortcut')}
-                      </Button>
-                      <Button
-                        size="xs"
-                        variant="subtle"
-                        disabled={bindingEquals(currentBinding, defaultBinding)}
-                        onClick={() => resetHotkey(toolId)}
-                      >
-                        {t('settings.hotkeys.reset', 'Reset')}
-                      </Button>
-                    </Group>
-                  </div>
+                    {isEditing && error && (
+                      <Alert color="red" radius="sm" variant="filled">
+                        {error}
+                      </Alert>
+                    )}
+                  </Box>
 
-                  {isEditing && error && (
-                    <Alert color="red" radius="sm" variant="filled">
-                      {error}
-                    </Alert>
-                  )}
-                </Box>
-
-                {index < filteredTools.length - 1 && <Divider />}
-              </React.Fragment>
-            );
-          })
+                  {index < filteredTools.length - 1 && <Divider />}
+                </React.Fragment>
+              );
+            })
           )}
         </Stack>
       </Paper>
diff --git a/frontend/src/core/components/shared/config/configSections/Overview.tsx b/frontend/src/core/components/shared/config/configSections/Overview.tsx
index 3bc8e84d91..6121834027 100644
--- a/frontend/src/core/components/shared/config/configSections/Overview.tsx
+++ b/frontend/src/core/components/shared/config/configSections/Overview.tsx
@@ -1,33 +1,35 @@
-import React from 'react';
-import { Stack, Text, Code, Group, Badge, Alert, Loader } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { useAppConfig } from '@app/contexts/AppConfigContext';
-import { OverviewHeader } from '@app/components/shared/config/OverviewHeader';
+import React from "react";
+import { Stack, Text, Code, Group, Badge, Alert, Loader } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import { useAppConfig } from "@app/contexts/AppConfigContext";
+import { OverviewHeader } from "@app/components/shared/config/OverviewHeader";
 
 const Overview: React.FC = () => {
   const { t } = useTranslation();
   const { config, loading, error } = useAppConfig();
 
   const renderConfigSection = (title: string, data: any) => {
-    if (!data || typeof data !== 'object') return null;
+    if (!data || typeof data !== "object") return null;
 
     return (
       <Stack gap="xs" mb="md">
-        <Text fw={600} size="md" c="blue">{title}</Text>
+        <Text fw={600} size="md" c="blue">
+          {title}
+        </Text>
         <Stack gap="xs" pl="md">
           {Object.entries(data).map(([key, value]) => (
             <Group key={key} wrap="nowrap" align="flex-start">
               <Text size="sm" w={150} style={{ flexShrink: 0 }} c="dimmed">
                 {key}:
               </Text>
-              {typeof value === 'boolean' ? (
-                <Badge color={value ? 'green' : 'red'} size="sm">
-                  {value ? 'true' : 'false'}
+              {typeof value === "boolean" ? (
+                <Badge color={value ? "green" : "red"} size="sm">
+                  {value ? "true" : "false"}
                 </Badge>
-              ) : typeof value === 'object' ? (
+              ) : typeof value === "object" ? (
                 <Code block>{JSON.stringify(value, null, 2)}</Code>
               ) : (
-                String(value) || 'null'
+                String(value) || "null"
               )}
             </Group>
           ))}
@@ -36,38 +38,48 @@ const Overview: React.FC = () => {
     );
   };
 
-  const basicConfig = config ? {
-    appNameNavbar: config.appNameNavbar,
-    baseUrl: config.baseUrl,
-    contextPath: config.contextPath,
-    serverPort: config.serverPort,
-  } : null;
+  const basicConfig = config
+    ? {
+        appNameNavbar: config.appNameNavbar,
+        baseUrl: config.baseUrl,
+        contextPath: config.contextPath,
+        serverPort: config.serverPort,
+      }
+    : null;
 
-  const securityConfig = config ? {
-    enableLogin: config.enableLogin,
-  } : null;
+  const securityConfig = config
+    ? {
+        enableLogin: config.enableLogin,
+      }
+    : null;
 
-  const systemConfig = config ? {
-    enableAlphaFunctionality: config.enableAlphaFunctionality,
-    enableAnalytics: config.enableAnalytics,
-  } : null;
+  const systemConfig = config
+    ? {
+        enableAlphaFunctionality: config.enableAlphaFunctionality,
+        enableAnalytics: config.enableAnalytics,
+      }
+    : null;
 
-  const integrationConfig = config ? {
-    SSOAutoLogin: config.SSOAutoLogin,
-  } : null;
+  const integrationConfig = config
+    ? {
+        SSOAutoLogin: config.SSOAutoLogin,
+      }
+    : null;
 
   if (loading) {
     return (
       <Stack align="center" py="md">
         <Loader size="sm" />
-        <Text size="sm" c="dimmed">{t('config.overview.loading', 'Loading configuration...')}</Text>
+        <Text size="sm" c="dimmed">
+          {t("config.overview.loading", "Loading configuration...")}
+        </Text>
       </Stack>
     );
   }
 
   if (error) {
     return (
-      <Alert color="red" title={t('config.overview.error', 'Error')}>
+      <Alert color="red" title={t("config.overview.error", "Error")}>
         {error}
       </Alert>
     );
@@ -79,13 +91,31 @@ const Overview: React.FC = () => {
 
       {config && (
         <>
-          {renderConfigSection(t('config.overview.sections.basic', 'Basic Configuration'), basicConfig)}
-          {renderConfigSection(t('config.overview.sections.security', 'Security Configuration'), securityConfig)}
-          {renderConfigSection(t('config.overview.sections.system', 'System Configuration'), systemConfig)}
-          {renderConfigSection(t('config.overview.sections.integration', 'Integration Configuration'), integrationConfig)}
+          {renderConfigSection(
+            t("config.overview.sections.basic", "Basic Configuration"),
+            basicConfig,
+          )}
+          {renderConfigSection(
+            t("config.overview.sections.security", "Security Configuration"),
+            securityConfig,
+          )}
+          {renderConfigSection(
+            t("config.overview.sections.system", "System Configuration"),
+            systemConfig,
+          )}
+          {renderConfigSection(
+            t(
+              "config.overview.sections.integration",
+              "Integration Configuration",
+            ),
+            integrationConfig,
+          )}
 
           {config.error && (
-            <Alert color="yellow" title={t('config.overview.warning', 'Configuration Warning')}>
+            <Alert
+              color="yellow"
+              title={t("config.overview.warning", "Configuration Warning")}
+            >
               {config.error}
             </Alert>
           )}
diff --git a/frontend/src/core/components/shared/config/configSections/ProviderCard.tsx b/frontend/src/core/components/shared/config/configSections/ProviderCard.tsx
index be3348b794..3e2563c577 100644
--- a/frontend/src/core/components/shared/config/configSections/ProviderCard.tsx
+++ b/frontend/src/core/components/shared/config/configSections/ProviderCard.tsx
@@ -1,4 +1,4 @@
-import { useEffect, useState } from 'react';
+import { useEffect, useState } from "react";
 import {
   Paper,
   Group,
@@ -12,11 +12,14 @@ import {
   NumberInput,
   TagsInput,
   Anchor,
-} from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import LocalIcon from '@app/components/shared/LocalIcon';
-import EditableSecretField from '@app/components/shared/EditableSecretField';
-import { Provider, ProviderField } from '@app/components/shared/config/configSections/providerDefinitions';
+} from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import LocalIcon from "@app/components/shared/LocalIcon";
+import EditableSecretField from "@app/components/shared/EditableSecretField";
+import {
+  Provider,
+  ProviderField,
+} from "@app/components/shared/config/configSections/providerDefinitions";
 
 interface ProviderCardProps {
   provider: Provider;
@@ -41,7 +44,8 @@ export default function ProviderCard({
 }: ProviderCardProps) {
   const { t } = useTranslation();
   const [expanded, setExpanded] = useState(false);
-  const [localSettings, setLocalSettings] = useState<Record<string, any>>(settings);
+  const [localSettings, setLocalSettings] =
+    useState<Record<string, any>>(settings);
 
   // Keep local settings in sync with incoming settings (values loaded from settings.yml)
   // Update whenever parent settings change, whether expanded or not (important for Discard to work)
@@ -57,7 +61,8 @@ export default function ProviderCard({
       const defaultSettings: Record<string, any> = { ...settings };
       provider.fields.forEach((field) => {
         if (field.defaultValue !== undefined) {
-          defaultSettings[field.key] = defaultSettings[field.key] ?? field.defaultValue;
+          defaultSettings[field.key] =
+            defaultSettings[field.key] ?? field.defaultValue;
         }
       });
       setLocalSettings(defaultSettings);
@@ -83,15 +88,26 @@ export default function ProviderCard({
   };
 
   const renderField = (field: ProviderField) => {
-    const value = localSettings[field.key] ?? field.defaultValue ?? '';
+    const value = localSettings[field.key] ?? field.defaultValue ?? "";
 
     switch (field.type) {
-      case 'switch':
+      case "switch":
         return (
-          <div key={field.key} style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}>
+          <div
+            key={field.key}
+            style={{
+              display: "flex",
+              alignItems: "center",
+              justifyContent: "space-between",
+            }}
+          >
             <div>
-              <Text fw={500} size="sm">{field.label}</Text>
-              <Text size="xs" c="dimmed" mt={4}>{field.description}</Text>
+              <Text fw={500} size="sm">
+                {field.label}
+              </Text>
+              <Text size="xs" c="dimmed" mt={4}>
+                {field.description}
+              </Text>
             </div>
             <Switch
               checked={value || false}
@@ -101,7 +117,7 @@ export default function ProviderCard({
           </div>
         );
 
-      case 'password':
+      case "password":
         return (
           <EditableSecretField
             key={field.key}
@@ -114,7 +130,7 @@ export default function ProviderCard({
           />
         );
 
-      case 'textarea':
+      case "textarea":
         return (
           <Textarea
             key={field.key}
@@ -127,7 +143,7 @@ export default function ProviderCard({
           />
         );
 
-      case 'number':
+      case "number":
         return (
           <NumberInput
             key={field.key}
@@ -141,8 +157,10 @@ export default function ProviderCard({
           />
         );
 
-      case 'tags': {
-        const tagValue = Array.isArray(value) ? value.map((val) => `${val}`) : [];
+      case "tags": {
+        const tagValue = Array.isArray(value)
+          ? value.map((val) => `${val}`)
+          : [];
 
         return (
           <TagsInput
@@ -174,12 +192,12 @@ export default function ProviderCard({
 
   const renderProviderIcon = () => {
     // If icon starts with '/', it's a path to an SVG file
-    if (provider.icon.startsWith('/')) {
+    if (provider.icon.startsWith("/")) {
       return (
         <img
           src={provider.icon}
           alt={provider.name}
-          style={{ width: '1.5rem', height: '1.5rem' }}
+          style={{ width: "1.5rem", height: "1.5rem" }}
         />
       );
     }
@@ -195,8 +213,12 @@ export default function ProviderCard({
           <Group gap="sm" style={{ flex: 1, minWidth: 0 }}>
             {renderProviderIcon()}
             <div style={{ flex: 1, minWidth: 0 }}>
-              <Text fw={600} size="sm">{provider.name}</Text>
-              <Text size="xs" c="dimmed" truncate>{provider.scope}</Text>
+              <Text fw={600} size="sm">
+                {provider.name}
+              </Text>
+              <Text size="xs" c="dimmed" truncate>
+                {provider.scope}
+              </Text>
             </div>
           </Group>
 
@@ -204,27 +226,30 @@ export default function ProviderCard({
             <Button
               variant={isConfigured ? "subtle" : "filled"}
               size="xs"
-              onClick={isConfigured ? () => setExpanded(!expanded) : handleConnectToggle}
+              onClick={
+                isConfigured
+                  ? () => setExpanded(!expanded)
+                  : handleConnectToggle
+              }
               rightSection={
                 expanded ? (
-                  <LocalIcon
-                    icon="close-rounded"
-                    width="1rem"
-                    height="1rem"
-                  />
-                ) : (isConfigured ? (
+                  <LocalIcon icon="close-rounded" width="1rem" height="1rem" />
+                ) : isConfigured ? (
                   <LocalIcon
                     icon="expand-more-rounded"
                     width="1rem"
                     height="1rem"
                   />
-                ) : undefined)
+                ) : undefined
               }
             >
               {isConfigured
-                ? (expanded ? t('admin.close', 'Close') : t('admin.expand', 'Expand'))
-                : (expanded ? t('admin.close', 'Close') : t('admin.settings.connections.connect', 'Connect'))
-              }
+                ? expanded
+                  ? t("admin.close", "Close")
+                  : t("admin.expand", "Expand")
+                : expanded
+                  ? t("admin.close", "Close")
+                  : t("admin.settings.connections.connect", "Connect")}
             </Button>
           </Group>
         </Group>
@@ -240,7 +265,11 @@ export default function ProviderCard({
                 size="xs"
                 c="blue"
               >
-                {t('admin.settings.connections.documentation', 'View documentation')} ↗
+                {t(
+                  "admin.settings.connections.documentation",
+                  "View documentation",
+                )}{" "}
+                ↗
               </Anchor>
             )}
 
@@ -256,12 +285,12 @@ export default function ProviderCard({
                     onClick={onDisconnect}
                     disabled={disabled}
                   >
-                    {t('admin.settings.connections.disconnect', 'Disconnect')}
+                    {t("admin.settings.connections.disconnect", "Disconnect")}
                   </Button>
                 )}
                 {onSave && (
                   <Button size="sm" onClick={handleSave} disabled={disabled}>
-                    {t('admin.settings.save', 'Save Changes')}
+                    {t("admin.settings.save", "Save Changes")}
                   </Button>
                 )}
               </Group>
diff --git a/frontend/src/core/components/shared/config/configSections/providerDefinitions.ts b/frontend/src/core/components/shared/config/configSections/providerDefinitions.ts
index cb1f69e0d4..51fd6873ea 100644
--- a/frontend/src/core/components/shared/config/configSections/providerDefinitions.ts
+++ b/frontend/src/core/components/shared/config/configSections/providerDefinitions.ts
@@ -1,10 +1,10 @@
-import { useTranslation } from 'react-i18next';
+import { useTranslation } from "react-i18next";
 
-export type ProviderType = 'oauth2' | 'saml2' | 'telegram' | 'googledrive';
+export type ProviderType = "oauth2" | "saml2" | "telegram" | "googledrive";
 
 export interface ProviderField {
   key: string;
-  type: 'text' | 'password' | 'switch' | 'textarea' | 'number' | 'tags';
+  type: "text" | "password" | "switch" | "textarea" | "number" | "tags";
   label: string;
   description: string;
   placeholder?: string;
@@ -26,39 +26,55 @@ const useGoogleProvider = (): Provider => {
   const { t } = useTranslation();
 
   return {
-    id: 'google',
-    name: 'Google',
-    icon: '/Login/google.svg',
-    type: 'oauth2',
-    scope: t('provider.oauth2.google.scope', 'Sign-in authentication'),
-    documentationUrl: 'https://docs.stirlingpdf.com/Configuration/OAuth%20SSO%20Configuration',
+    id: "google",
+    name: "Google",
+    icon: "/Login/google.svg",
+    type: "oauth2",
+    scope: t("provider.oauth2.google.scope", "Sign-in authentication"),
+    documentationUrl:
+      "https://docs.stirlingpdf.com/Configuration/OAuth%20SSO%20Configuration",
     fields: [
       {
-        key: 'clientId',
-        type: 'text',
-        label: t('provider.oauth2.google.clientId.label', 'Client ID'),
-        description: t('provider.oauth2.google.clientId.description', 'The OAuth2 client ID from Google Cloud Console'),
-        placeholder: 'your-client-id.apps.googleusercontent.com',
+        key: "clientId",
+        type: "text",
+        label: t("provider.oauth2.google.clientId.label", "Client ID"),
+        description: t(
+          "provider.oauth2.google.clientId.description",
+          "The OAuth2 client ID from Google Cloud Console",
+        ),
+        placeholder: "your-client-id.apps.googleusercontent.com",
       },
       {
-        key: 'clientSecret',
-        type: 'password',
-        label: t('provider.oauth2.google.clientSecret.label', 'Client Secret'),
-        description: t('provider.oauth2.google.clientSecret.description', 'The OAuth2 client secret from Google Cloud Console'),
+        key: "clientSecret",
+        type: "password",
+        label: t("provider.oauth2.google.clientSecret.label", "Client Secret"),
+        description: t(
+          "provider.oauth2.google.clientSecret.description",
+          "The OAuth2 client secret from Google Cloud Console",
+        ),
       },
       {
-        key: 'scopes',
-        type: 'text',
-        label: t('provider.oauth2.google.scopes.label', 'Scopes'),
-        description: t('provider.oauth2.google.scopes.description', 'Comma-separated OAuth2 scopes'),
-        defaultValue: 'email, profile',
+        key: "scopes",
+        type: "text",
+        label: t("provider.oauth2.google.scopes.label", "Scopes"),
+        description: t(
+          "provider.oauth2.google.scopes.description",
+          "Comma-separated OAuth2 scopes",
+        ),
+        defaultValue: "email, profile",
       },
       {
-        key: 'useAsUsername',
-        type: 'text',
-        label: t('provider.oauth2.google.useAsUsername.label', 'Use as Username'),
-        description: t('provider.oauth2.google.useAsUsername.description', 'Field to use as username (email, name, given_name, family_name)'),
-        defaultValue: 'email',
+        key: "useAsUsername",
+        type: "text",
+        label: t(
+          "provider.oauth2.google.useAsUsername.label",
+          "Use as Username",
+        ),
+        description: t(
+          "provider.oauth2.google.useAsUsername.description",
+          "Field to use as username (email, name, given_name, family_name)",
+        ),
+        defaultValue: "email",
       },
     ],
   };
@@ -68,38 +84,54 @@ const useGitHubProvider = (): Provider => {
   const { t } = useTranslation();
 
   return {
-    id: 'github',
-    name: 'GitHub',
-    icon: '/Login/github.svg',
-    type: 'oauth2',
-    scope: t('provider.oauth2.github.scope', 'Sign-in authentication'),
-    documentationUrl: 'https://docs.stirlingpdf.com/Configuration/OAuth%20SSO%20Configuration',
+    id: "github",
+    name: "GitHub",
+    icon: "/Login/github.svg",
+    type: "oauth2",
+    scope: t("provider.oauth2.github.scope", "Sign-in authentication"),
+    documentationUrl:
+      "https://docs.stirlingpdf.com/Configuration/OAuth%20SSO%20Configuration",
     fields: [
       {
-        key: 'clientId',
-        type: 'text',
-        label: t('provider.oauth2.github.clientId.label', 'Client ID'),
-        description: t('provider.oauth2.github.clientId.description', 'The OAuth2 client ID from GitHub Developer Settings'),
+        key: "clientId",
+        type: "text",
+        label: t("provider.oauth2.github.clientId.label", "Client ID"),
+        description: t(
+          "provider.oauth2.github.clientId.description",
+          "The OAuth2 client ID from GitHub Developer Settings",
+        ),
       },
       {
-        key: 'clientSecret',
-        type: 'password',
-        label: t('provider.oauth2.github.clientSecret.label', 'Client Secret'),
-        description: t('provider.oauth2.github.clientSecret.description', 'The OAuth2 client secret from GitHub Developer Settings'),
+        key: "clientSecret",
+        type: "password",
+        label: t("provider.oauth2.github.clientSecret.label", "Client Secret"),
+        description: t(
+          "provider.oauth2.github.clientSecret.description",
+          "The OAuth2 client secret from GitHub Developer Settings",
+        ),
       },
       {
-        key: 'scopes',
-        type: 'text',
-        label: t('provider.oauth2.github.scopes.label', 'Scopes'),
-        description: t('provider.oauth2.github.scopes.description', 'Comma-separated OAuth2 scopes'),
-        defaultValue: 'read:user',
+        key: "scopes",
+        type: "text",
+        label: t("provider.oauth2.github.scopes.label", "Scopes"),
+        description: t(
+          "provider.oauth2.github.scopes.description",
+          "Comma-separated OAuth2 scopes",
+        ),
+        defaultValue: "read:user",
       },
       {
-        key: 'useAsUsername',
-        type: 'text',
-        label: t('provider.oauth2.github.useAsUsername.label', 'Use as Username'),
-        description: t('provider.oauth2.github.useAsUsername.description', 'Field to use as username (email, login, name)'),
-        defaultValue: 'login',
+        key: "useAsUsername",
+        type: "text",
+        label: t(
+          "provider.oauth2.github.useAsUsername.label",
+          "Use as Username",
+        ),
+        description: t(
+          "provider.oauth2.github.useAsUsername.description",
+          "Field to use as username (email, login, name)",
+        ),
+        defaultValue: "login",
       },
     ],
   };
@@ -109,46 +141,68 @@ const useKeycloakProvider = (): Provider => {
   const { t } = useTranslation();
 
   return {
-    id: 'keycloak',
-    name: 'Keycloak',
-    icon: 'key-rounded',
-    type: 'oauth2',
-    scope: t('provider.oauth2.keycloak.scope', 'SSO'),
+    id: "keycloak",
+    name: "Keycloak",
+    icon: "key-rounded",
+    type: "oauth2",
+    scope: t("provider.oauth2.keycloak.scope", "SSO"),
     businessTier: false,
-    documentationUrl: 'https://docs.stirlingpdf.com/Configuration/OAuth%20SSO%20Configuration',
+    documentationUrl:
+      "https://docs.stirlingpdf.com/Configuration/OAuth%20SSO%20Configuration",
     fields: [
       {
-        key: 'issuer',
-        type: 'text',
-        label: t('provider.oauth2.keycloak.issuer.label', 'Issuer URL'),
-        description: t('provider.oauth2.keycloak.issuer.description', "URL of the Keycloak realm's OpenID Connect Discovery endpoint"),
-        placeholder: 'https://keycloak.example.com/realms/myrealm',
+        key: "issuer",
+        type: "text",
+        label: t("provider.oauth2.keycloak.issuer.label", "Issuer URL"),
+        description: t(
+          "provider.oauth2.keycloak.issuer.description",
+          "URL of the Keycloak realm's OpenID Connect Discovery endpoint",
+        ),
+        placeholder: "https://keycloak.example.com/realms/myrealm",
       },
       {
-        key: 'clientId',
-        type: 'text',
-        label: t('provider.oauth2.keycloak.clientId.label', 'Client ID'),
-        description: t('provider.oauth2.keycloak.clientId.description', 'The OAuth2 client ID from Keycloak'),
+        key: "clientId",
+        type: "text",
+        label: t("provider.oauth2.keycloak.clientId.label", "Client ID"),
+        description: t(
+          "provider.oauth2.keycloak.clientId.description",
+          "The OAuth2 client ID from Keycloak",
+        ),
       },
       {
-        key: 'clientSecret',
-        type: 'password',
-        label: t('provider.oauth2.keycloak.clientSecret.label', 'Client Secret'),
-        description: t('provider.oauth2.keycloak.clientSecret.description', 'The OAuth2 client secret from Keycloak'),
+        key: "clientSecret",
+        type: "password",
+        label: t(
+          "provider.oauth2.keycloak.clientSecret.label",
+          "Client Secret",
+        ),
+        description: t(
+          "provider.oauth2.keycloak.clientSecret.description",
+          "The OAuth2 client secret from Keycloak",
+        ),
       },
       {
-        key: 'scopes',
-        type: 'text',
-        label: t('provider.oauth2.keycloak.scopes.label', 'Scopes'),
-        description: t('provider.oauth2.keycloak.scopes.description', 'Comma-separated OAuth2 scopes'),
-        defaultValue: 'openid, profile, email',
+        key: "scopes",
+        type: "text",
+        label: t("provider.oauth2.keycloak.scopes.label", "Scopes"),
+        description: t(
+          "provider.oauth2.keycloak.scopes.description",
+          "Comma-separated OAuth2 scopes",
+        ),
+        defaultValue: "openid, profile, email",
       },
       {
-        key: 'useAsUsername',
-        type: 'text',
-        label: t('provider.oauth2.keycloak.useAsUsername.label', 'Use as Username'),
-        description: t('provider.oauth2.keycloak.useAsUsername.description', 'Field to use as username (email, name, given_name, family_name, preferred_username)'),
-        defaultValue: 'preferred_username',
+        key: "useAsUsername",
+        type: "text",
+        label: t(
+          "provider.oauth2.keycloak.useAsUsername.label",
+          "Use as Username",
+        ),
+        description: t(
+          "provider.oauth2.keycloak.useAsUsername.description",
+          "Field to use as username (email, name, given_name, family_name, preferred_username)",
+        ),
+        defaultValue: "preferred_username",
       },
     ],
   };
@@ -158,73 +212,113 @@ const useGenericOAuth2Provider = (): Provider => {
   const { t } = useTranslation();
 
   return {
-    id: 'oauth2-generic',
-    name: t('provider.oauth2.generic.name', 'Generic OAuth2'),
-    icon: 'link-rounded',
-    type: 'oauth2',
-    scope: t('provider.oauth2.generic.scope', 'SSO'),
+    id: "oauth2-generic",
+    name: t("provider.oauth2.generic.name", "Generic OAuth2"),
+    icon: "link-rounded",
+    type: "oauth2",
+    scope: t("provider.oauth2.generic.scope", "SSO"),
     businessTier: false,
-    documentationUrl: 'https://docs.stirlingpdf.com/Configuration/OAuth%20SSO%20Configuration',
+    documentationUrl:
+      "https://docs.stirlingpdf.com/Configuration/OAuth%20SSO%20Configuration",
     fields: [
       {
-        key: 'enabled',
-        type: 'switch',
-        label: t('provider.oauth2.generic.enabled.label', 'Enable Generic OAuth2'),
-        description: t('provider.oauth2.generic.enabled.description', 'Enable authentication using a custom OAuth2 provider'),
+        key: "enabled",
+        type: "switch",
+        label: t(
+          "provider.oauth2.generic.enabled.label",
+          "Enable Generic OAuth2",
+        ),
+        description: t(
+          "provider.oauth2.generic.enabled.description",
+          "Enable authentication using a custom OAuth2 provider",
+        ),
         defaultValue: false,
       },
       {
-        key: 'provider',
-        type: 'text',
-        label: t('provider.oauth2.generic.provider.label', 'Provider Name'),
-        description: t('provider.oauth2.generic.provider.description', 'The name of your OAuth2 provider (e.g., Azure AD, Okta)'),
-        placeholder: 'azure-ad',
+        key: "provider",
+        type: "text",
+        label: t("provider.oauth2.generic.provider.label", "Provider Name"),
+        description: t(
+          "provider.oauth2.generic.provider.description",
+          "The name of your OAuth2 provider (e.g., Azure AD, Okta)",
+        ),
+        placeholder: "azure-ad",
       },
       {
-        key: 'issuer',
-        type: 'text',
-        label: t('provider.oauth2.generic.issuer.label', 'Issuer URL'),
-        description: t('provider.oauth2.generic.issuer.description', 'Provider that supports OpenID Connect Discovery (/.well-known/openid-configuration)'),
-        placeholder: 'https://login.microsoftonline.com/{tenant-id}/v2.0',
+        key: "issuer",
+        type: "text",
+        label: t("provider.oauth2.generic.issuer.label", "Issuer URL"),
+        description: t(
+          "provider.oauth2.generic.issuer.description",
+          "Provider that supports OpenID Connect Discovery (/.well-known/openid-configuration)",
+        ),
+        placeholder: "https://login.microsoftonline.com/{tenant-id}/v2.0",
       },
       {
-        key: 'clientId',
-        type: 'text',
-        label: t('provider.oauth2.generic.clientId.label', 'Client ID'),
-        description: t('provider.oauth2.generic.clientId.description', 'The OAuth2 client ID from your provider'),
+        key: "clientId",
+        type: "text",
+        label: t("provider.oauth2.generic.clientId.label", "Client ID"),
+        description: t(
+          "provider.oauth2.generic.clientId.description",
+          "The OAuth2 client ID from your provider",
+        ),
       },
       {
-        key: 'clientSecret',
-        type: 'password',
-        label: t('provider.oauth2.generic.clientSecret.label', 'Client Secret'),
-        description: t('provider.oauth2.generic.clientSecret.description', 'The OAuth2 client secret from your provider'),
+        key: "clientSecret",
+        type: "password",
+        label: t("provider.oauth2.generic.clientSecret.label", "Client Secret"),
+        description: t(
+          "provider.oauth2.generic.clientSecret.description",
+          "The OAuth2 client secret from your provider",
+        ),
       },
       {
-        key: 'scopes',
-        type: 'text',
-        label: t('provider.oauth2.generic.scopes.label', 'Scopes'),
-        description: t('provider.oauth2.generic.scopes.description', 'Comma-separated OAuth2 scopes'),
-        defaultValue: 'openid, profile, email',
+        key: "scopes",
+        type: "text",
+        label: t("provider.oauth2.generic.scopes.label", "Scopes"),
+        description: t(
+          "provider.oauth2.generic.scopes.description",
+          "Comma-separated OAuth2 scopes",
+        ),
+        defaultValue: "openid, profile, email",
       },
       {
-        key: 'useAsUsername',
-        type: 'text',
-        label: t('provider.oauth2.generic.useAsUsername.label', 'Use as Username'),
-        description: t('provider.oauth2.generic.useAsUsername.description', 'Field to use as username'),
-        defaultValue: 'email',
+        key: "useAsUsername",
+        type: "text",
+        label: t(
+          "provider.oauth2.generic.useAsUsername.label",
+          "Use as Username",
+        ),
+        description: t(
+          "provider.oauth2.generic.useAsUsername.description",
+          "Field to use as username",
+        ),
+        defaultValue: "email",
       },
       {
-        key: 'autoCreateUser',
-        type: 'switch',
-        label: t('provider.oauth2.generic.autoCreateUser.label', 'Auto Create Users'),
-        description: t('provider.oauth2.generic.autoCreateUser.description', 'Automatically create user accounts on first OAuth2 login'),
+        key: "autoCreateUser",
+        type: "switch",
+        label: t(
+          "provider.oauth2.generic.autoCreateUser.label",
+          "Auto Create Users",
+        ),
+        description: t(
+          "provider.oauth2.generic.autoCreateUser.description",
+          "Automatically create user accounts on first OAuth2 login",
+        ),
         defaultValue: true,
       },
       {
-        key: 'blockRegistration',
-        type: 'switch',
-        label: t('provider.oauth2.generic.blockRegistration.label', 'Block Registration'),
-        description: t('provider.oauth2.generic.blockRegistration.description', 'Prevent new user registration via OAuth2'),
+        key: "blockRegistration",
+        type: "switch",
+        label: t(
+          "provider.oauth2.generic.blockRegistration.label",
+          "Block Registration",
+        ),
+        description: t(
+          "provider.oauth2.generic.blockRegistration.description",
+          "Prevent new user registration via OAuth2",
+        ),
         defaultValue: false,
       },
     ],
@@ -235,53 +329,72 @@ const useSMTPProvider = (): Provider => {
   const { t } = useTranslation();
 
   return {
-    id: 'smtp',
-    name: t('provider.smtp.name', 'SMTP Mail'),
-    icon: 'mail-rounded',
-    type: 'oauth2',
-    scope: t('provider.smtp.scope', 'Email Notifications'),
-    documentationUrl: 'https://docs.stirlingpdf.com/Configuration/System%20and%20Security/#email-configuration',
+    id: "smtp",
+    name: t("provider.smtp.name", "SMTP Mail"),
+    icon: "mail-rounded",
+    type: "oauth2",
+    scope: t("provider.smtp.scope", "Email Notifications"),
+    documentationUrl:
+      "https://docs.stirlingpdf.com/Configuration/System%20and%20Security/#email-configuration",
     fields: [
       {
-        key: 'enabled',
-        type: 'switch',
-        label: t('provider.smtp.enabled.label', 'Enable Mail'),
-        description: t('provider.smtp.enabled.description', 'Enable email notifications and SMTP functionality'),
+        key: "enabled",
+        type: "switch",
+        label: t("provider.smtp.enabled.label", "Enable Mail"),
+        description: t(
+          "provider.smtp.enabled.description",
+          "Enable email notifications and SMTP functionality",
+        ),
         defaultValue: false,
       },
       {
-        key: 'host',
-        type: 'text',
-        label: t('provider.smtp.host.label', 'SMTP Host'),
-        description: t('provider.smtp.host.description', 'The hostname or IP address of your SMTP server'),
-        placeholder: 'smtp.example.com',
+        key: "host",
+        type: "text",
+        label: t("provider.smtp.host.label", "SMTP Host"),
+        description: t(
+          "provider.smtp.host.description",
+          "The hostname or IP address of your SMTP server",
+        ),
+        placeholder: "smtp.example.com",
       },
       {
-        key: 'port',
-        type: 'number',
-        label: t('provider.smtp.port.label', 'SMTP Port'),
-        description: t('provider.smtp.port.description', 'The port number for SMTP connection (typically 25, 465, or 587)'),
-        placeholder: '587',
-        defaultValue: '587',
+        key: "port",
+        type: "number",
+        label: t("provider.smtp.port.label", "SMTP Port"),
+        description: t(
+          "provider.smtp.port.description",
+          "The port number for SMTP connection (typically 25, 465, or 587)",
+        ),
+        placeholder: "587",
+        defaultValue: "587",
       },
       {
-        key: 'username',
-        type: 'text',
-        label: t('provider.smtp.username.label', 'SMTP Username'),
-        description: t('provider.smtp.username.description', 'Username for SMTP authentication'),
+        key: "username",
+        type: "text",
+        label: t("provider.smtp.username.label", "SMTP Username"),
+        description: t(
+          "provider.smtp.username.description",
+          "Username for SMTP authentication",
+        ),
       },
       {
-        key: 'password',
-        type: 'password',
-        label: t('provider.smtp.password.label', 'SMTP Password'),
-        description: t('provider.smtp.password.description', 'Password for SMTP authentication'),
+        key: "password",
+        type: "password",
+        label: t("provider.smtp.password.label", "SMTP Password"),
+        description: t(
+          "provider.smtp.password.description",
+          "Password for SMTP authentication",
+        ),
       },
       {
-        key: 'from',
-        type: 'text',
-        label: t('provider.smtp.from.label', 'From Address'),
-        description: t('provider.smtp.from.description', 'The email address to use as the sender'),
-        placeholder: 'noreply@example.com',
+        key: "from",
+        type: "text",
+        label: t("provider.smtp.from.label", "From Address"),
+        description: t(
+          "provider.smtp.from.description",
+          "The email address to use as the sender",
+        ),
+        placeholder: "noreply@example.com",
       },
     ],
   };
@@ -290,206 +403,248 @@ const useTelegramProvider = (): Provider => {
   const { t } = useTranslation();
 
   return {
-    id: 'telegram',
-    name: t('admin.settings.telegram.title', 'Telegram Bot'),
-    icon: 'send-rounded',
-    type: 'telegram',
+    id: "telegram",
+    name: t("admin.settings.telegram.title", "Telegram Bot"),
+    icon: "send-rounded",
+    type: "telegram",
     scope: t(
-      'admin.settings.telegram.description',
-      'Configure Telegram bot connectivity, access controls, and feedback behavior.'
+      "admin.settings.telegram.description",
+      "Configure Telegram bot connectivity, access controls, and feedback behavior.",
     ),
     fields: [
       {
-        key: 'enabled',
-        type: 'switch',
-        label: t('admin.settings.telegram.enabled.label', 'Enable Telegram Bot'),
-        description: t(
-          'admin.settings.telegram.enabled.description',
-          'Allow users to interact with Stirling PDF through your configured Telegram bot.'
-        ),
-        defaultValue: false,
-      },
-      {
-        key: 'botUsername',
-        type: 'text',
-        label: t('admin.settings.telegram.botUsername.label', 'Bot Username'),
-        description: t(
-          'admin.settings.telegram.botUsername.description',
-          'The public username of your Telegram bot.'
-        ),
-        placeholder: 'my_pdf_bot',
-      },
-      {
-        key: 'botToken',
-        type: 'password',
-        label: t('admin.settings.telegram.botToken.label', 'Bot Token'),
-        description: t(
-          'admin.settings.telegram.botToken.description',
-          'API token provided by BotFather for your Telegram bot.'
-        ),
-        placeholder: '123456:ABC-DEF1234ghIkl-zyx57W2v1u123ew11',
-      },
-      {
-        key: 'pipelineInboxFolder',
-        type: 'text',
-        label: t('admin.settings.telegram.pipelineInboxFolder.label', 'Inbox Folder'),
-        description: t(
-          'admin.settings.telegram.pipelineInboxFolder.description',
-          'Folder under the pipeline directory where incoming Telegram files are stored.'
-        ),
-        placeholder: 'telegram',
-      },
-      {
-        key: 'customFolderSuffix',
-        type: 'switch',
-        label: t('admin.settings.telegram.customFolderSuffix.label', 'Use Custom Folder Suffix'),
-        description: t(
-          'admin.settings.telegram.customFolderSuffix.description',
-          'Append the chat ID to incoming file folders to isolate uploads per chat.'
-        ),
-        defaultValue: false,
-      },
-      {
-        key: 'enableAllowUserIDs',
-        type: 'switch',
-        label: t('admin.settings.telegram.enableAllowUserIDs.label', 'Allow Specific User IDs'),
-        description: t(
-          'admin.settings.telegram.enableAllowUserIDs.description',
-          'When enabled, only listed user IDs can use the bot.'
-        ),
-        defaultValue: false,
-      },
-      {
-        key: 'allowUserIDs',
-        type: 'tags',
-        label: t('admin.settings.telegram.allowUserIDs.label', 'Allowed User IDs'),
-        description: t(
-          'admin.settings.telegram.allowUserIDs.description',
-          'Enter Telegram user IDs allowed to interact with the bot.'
-        ),
-        placeholder: t('admin.settings.telegram.allowUserIDs.placeholder', 'Add user ID and press enter'),
-        defaultValue: [],
-      },
-      {
-        key: 'enableAllowChannelIDs',
-        type: 'switch',
-        label: t('admin.settings.telegram.enableAllowChannelIDs.label', 'Allow Specific Channel IDs'),
-        description: t(
-          'admin.settings.telegram.enableAllowChannelIDs.description',
-          'When enabled, only listed channel IDs can use the bot.'
-        ),
-        defaultValue: false,
-      },
-      {
-        key: 'allowChannelIDs',
-        type: 'tags',
-        label: t('admin.settings.telegram.allowChannelIDs.label', 'Allowed Channel IDs'),
-        description: t(
-          'admin.settings.telegram.allowChannelIDs.description',
-          'Enter Telegram channel IDs allowed to interact with the bot.'
-        ),
-        placeholder: t('admin.settings.telegram.allowChannelIDs.placeholder', 'Add channel ID and press enter'),
-        defaultValue: [],
-      },
-      {
-        key: 'processingTimeoutSeconds',
-        type: 'number',
+        key: "enabled",
+        type: "switch",
         label: t(
-          'admin.settings.telegram.processingTimeoutSeconds.label',
-          'Processing Timeout (seconds)'
+          "admin.settings.telegram.enabled.label",
+          "Enable Telegram Bot",
         ),
         description: t(
-          'admin.settings.telegram.processingTimeoutSeconds.description',
-          'Maximum time to wait for a processing job before reporting an error.'
+          "admin.settings.telegram.enabled.description",
+          "Allow users to interact with Stirling PDF through your configured Telegram bot.",
+        ),
+        defaultValue: false,
+      },
+      {
+        key: "botUsername",
+        type: "text",
+        label: t("admin.settings.telegram.botUsername.label", "Bot Username"),
+        description: t(
+          "admin.settings.telegram.botUsername.description",
+          "The public username of your Telegram bot.",
+        ),
+        placeholder: "my_pdf_bot",
+      },
+      {
+        key: "botToken",
+        type: "password",
+        label: t("admin.settings.telegram.botToken.label", "Bot Token"),
+        description: t(
+          "admin.settings.telegram.botToken.description",
+          "API token provided by BotFather for your Telegram bot.",
+        ),
+        placeholder: "123456:ABC-DEF1234ghIkl-zyx57W2v1u123ew11",
+      },
+      {
+        key: "pipelineInboxFolder",
+        type: "text",
+        label: t(
+          "admin.settings.telegram.pipelineInboxFolder.label",
+          "Inbox Folder",
+        ),
+        description: t(
+          "admin.settings.telegram.pipelineInboxFolder.description",
+          "Folder under the pipeline directory where incoming Telegram files are stored.",
+        ),
+        placeholder: "telegram",
+      },
+      {
+        key: "customFolderSuffix",
+        type: "switch",
+        label: t(
+          "admin.settings.telegram.customFolderSuffix.label",
+          "Use Custom Folder Suffix",
+        ),
+        description: t(
+          "admin.settings.telegram.customFolderSuffix.description",
+          "Append the chat ID to incoming file folders to isolate uploads per chat.",
+        ),
+        defaultValue: false,
+      },
+      {
+        key: "enableAllowUserIDs",
+        type: "switch",
+        label: t(
+          "admin.settings.telegram.enableAllowUserIDs.label",
+          "Allow Specific User IDs",
+        ),
+        description: t(
+          "admin.settings.telegram.enableAllowUserIDs.description",
+          "When enabled, only listed user IDs can use the bot.",
+        ),
+        defaultValue: false,
+      },
+      {
+        key: "allowUserIDs",
+        type: "tags",
+        label: t(
+          "admin.settings.telegram.allowUserIDs.label",
+          "Allowed User IDs",
+        ),
+        description: t(
+          "admin.settings.telegram.allowUserIDs.description",
+          "Enter Telegram user IDs allowed to interact with the bot.",
+        ),
+        placeholder: t(
+          "admin.settings.telegram.allowUserIDs.placeholder",
+          "Add user ID and press enter",
+        ),
+        defaultValue: [],
+      },
+      {
+        key: "enableAllowChannelIDs",
+        type: "switch",
+        label: t(
+          "admin.settings.telegram.enableAllowChannelIDs.label",
+          "Allow Specific Channel IDs",
+        ),
+        description: t(
+          "admin.settings.telegram.enableAllowChannelIDs.description",
+          "When enabled, only listed channel IDs can use the bot.",
+        ),
+        defaultValue: false,
+      },
+      {
+        key: "allowChannelIDs",
+        type: "tags",
+        label: t(
+          "admin.settings.telegram.allowChannelIDs.label",
+          "Allowed Channel IDs",
+        ),
+        description: t(
+          "admin.settings.telegram.allowChannelIDs.description",
+          "Enter Telegram channel IDs allowed to interact with the bot.",
+        ),
+        placeholder: t(
+          "admin.settings.telegram.allowChannelIDs.placeholder",
+          "Add channel ID and press enter",
+        ),
+        defaultValue: [],
+      },
+      {
+        key: "processingTimeoutSeconds",
+        type: "number",
+        label: t(
+          "admin.settings.telegram.processingTimeoutSeconds.label",
+          "Processing Timeout (seconds)",
+        ),
+        description: t(
+          "admin.settings.telegram.processingTimeoutSeconds.description",
+          "Maximum time to wait for a processing job before reporting an error.",
         ),
         defaultValue: 180,
       },
       {
-        key: 'pollingIntervalMillis',
-        type: 'number',
-        label: t('admin.settings.telegram.pollingIntervalMillis.label', 'Polling Interval (ms)'),
+        key: "pollingIntervalMillis",
+        type: "number",
+        label: t(
+          "admin.settings.telegram.pollingIntervalMillis.label",
+          "Polling Interval (ms)",
+        ),
         description: t(
-          'admin.settings.telegram.pollingIntervalMillis.description',
-          'Interval between checks for new Telegram updates.'
+          "admin.settings.telegram.pollingIntervalMillis.description",
+          "Interval between checks for new Telegram updates.",
         ),
         defaultValue: 2000,
       },
       {
-        key: 'feedback.general.enabled',
-        type: 'switch',
-        label: t('admin.settings.telegram.feedback.general.enabled.label', 'Enable Feedback'),
+        key: "feedback.general.enabled",
+        type: "switch",
+        label: t(
+          "admin.settings.telegram.feedback.general.enabled.label",
+          "Enable Feedback",
+        ),
         description: t(
-          'admin.settings.telegram.feedback.general.enabled.description',
-          'Control whether the bot sends feedback messages at all.'
+          "admin.settings.telegram.feedback.general.enabled.description",
+          "Control whether the bot sends feedback messages at all.",
         ),
         defaultValue: true,
       },
       {
-        key: 'feedback.channel.noValidDocument',
-        type: 'switch',
+        key: "feedback.channel.noValidDocument",
+        type: "switch",
         label: t(
-          'admin.settings.telegram.feedback.channel.noValidDocument.label',
-          'Show "No valid document" (Channel)'
+          "admin.settings.telegram.feedback.channel.noValidDocument.label",
+          'Show "No valid document" (Channel)',
         ),
         description: t(
-          'admin.settings.telegram.feedback.channel.noValidDocument.description',
-          'Suppress the no valid document response for channel uploads.'
+          "admin.settings.telegram.feedback.channel.noValidDocument.description",
+          "Suppress the no valid document response for channel uploads.",
         ),
         defaultValue: false,
       },
       {
-        key: 'feedback.channel.errorProcessing',
-        type: 'switch',
+        key: "feedback.channel.errorProcessing",
+        type: "switch",
         label: t(
-          'admin.settings.telegram.feedback.channel.errorProcessing.label',
-          'Show processing errors (Channel)'
+          "admin.settings.telegram.feedback.channel.errorProcessing.label",
+          "Show processing errors (Channel)",
         ),
         description: t(
-          'admin.settings.telegram.feedback.channel.errorProcessing.description',
-          'Send processing error messages to channels.'
+          "admin.settings.telegram.feedback.channel.errorProcessing.description",
+          "Send processing error messages to channels.",
         ),
         defaultValue: false,
       },
       {
-        key: 'feedback.channel.errorMessage',
-        type: 'switch',
+        key: "feedback.channel.errorMessage",
+        type: "switch",
         label: t(
-          'admin.settings.telegram.feedback.channel.errorMessage.label',
-          'Show error messages (Channel)'
+          "admin.settings.telegram.feedback.channel.errorMessage.label",
+          "Show error messages (Channel)",
         ),
         description: t(
-          'admin.settings.telegram.feedback.channel.errorMessage.description',
-          'Show detailed error messages for channels.'
+          "admin.settings.telegram.feedback.channel.errorMessage.description",
+          "Show detailed error messages for channels.",
         ),
         defaultValue: false,
       },
       {
-        key: 'feedback.user.noValidDocument',
-        type: 'switch',
-        label: t('admin.settings.telegram.feedback.user.noValidDocument.label', 'Show "No valid document" (User)'),
+        key: "feedback.user.noValidDocument",
+        type: "switch",
+        label: t(
+          "admin.settings.telegram.feedback.user.noValidDocument.label",
+          'Show "No valid document" (User)',
+        ),
         description: t(
-          'admin.settings.telegram.feedback.user.noValidDocument.description',
-          'Suppress the no valid document response for user uploads.'
+          "admin.settings.telegram.feedback.user.noValidDocument.description",
+          "Suppress the no valid document response for user uploads.",
         ),
         defaultValue: false,
       },
       {
-        key: 'feedback.user.errorProcessing',
-        type: 'switch',
-        label: t('admin.settings.telegram.feedback.user.errorProcessing.label', 'Show processing errors (User)'),
+        key: "feedback.user.errorProcessing",
+        type: "switch",
+        label: t(
+          "admin.settings.telegram.feedback.user.errorProcessing.label",
+          "Show processing errors (User)",
+        ),
         description: t(
-          'admin.settings.telegram.feedback.user.errorProcessing.description',
-          'Send processing error messages to users.'
+          "admin.settings.telegram.feedback.user.errorProcessing.description",
+          "Send processing error messages to users.",
         ),
         defaultValue: false,
       },
       {
-        key: 'feedback.user.errorMessage',
-        type: 'switch',
-        label: t('admin.settings.telegram.feedback.user.errorMessage.label', 'Show error messages (User)'),
+        key: "feedback.user.errorMessage",
+        type: "switch",
+        label: t(
+          "admin.settings.telegram.feedback.user.errorMessage.label",
+          "Show error messages (User)",
+        ),
         description: t(
-          'admin.settings.telegram.feedback.user.errorMessage.description',
-          'Show detailed error messages for users.'
+          "admin.settings.telegram.feedback.user.errorMessage.description",
+          "Show detailed error messages for users.",
         ),
         defaultValue: false,
       },
@@ -501,94 +656,143 @@ const useSAML2Provider = (): Provider => {
   const { t } = useTranslation();
 
   return {
-    id: 'saml2',
-    name: t('provider.saml2.name', 'SAML2'),
-    icon: 'verified-user-rounded',
-    type: 'saml2',
-    scope: t('provider.saml2.scope', 'SSO (SAML)'),
+    id: "saml2",
+    name: t("provider.saml2.name", "SAML2"),
+    icon: "verified-user-rounded",
+    type: "saml2",
+    scope: t("provider.saml2.scope", "SSO (SAML)"),
     businessTier: true,
-    documentationUrl: 'https://docs.stirlingpdf.com/Configuration/SAML%20SSO%20Configuration/',
+    documentationUrl:
+      "https://docs.stirlingpdf.com/Configuration/SAML%20SSO%20Configuration/",
     fields: [
       {
-        key: 'enabled',
-        type: 'switch',
-        label: t('provider.saml2.enabled.label', 'Enable SAML2'),
-        description: t('provider.saml2.enabled.description', 'Enable SAML2 authentication (Enterprise only)'),
+        key: "enabled",
+        type: "switch",
+        label: t("provider.saml2.enabled.label", "Enable SAML2"),
+        description: t(
+          "provider.saml2.enabled.description",
+          "Enable SAML2 authentication (Enterprise only)",
+        ),
         defaultValue: false,
       },
       {
-        key: 'provider',
-        type: 'text',
-        label: t('provider.saml2.provider.label', 'Provider Name'),
-        description: t('provider.saml2.provider.description', 'The name of your SAML2 provider'),
+        key: "provider",
+        type: "text",
+        label: t("provider.saml2.provider.label", "Provider Name"),
+        description: t(
+          "provider.saml2.provider.description",
+          "The name of your SAML2 provider",
+        ),
       },
       {
-        key: 'registrationId',
-        type: 'text',
-        label: t('provider.saml2.registrationId.label', 'Registration ID'),
-        description: t('provider.saml2.registrationId.description', 'The name of your Service Provider (SP) app name'),
-        defaultValue: 'stirling',
+        key: "registrationId",
+        type: "text",
+        label: t("provider.saml2.registrationId.label", "Registration ID"),
+        description: t(
+          "provider.saml2.registrationId.description",
+          "The name of your Service Provider (SP) app name",
+        ),
+        defaultValue: "stirling",
       },
       {
-        key: 'idpMetadataUri',
-        type: 'text',
-        label: t('provider.saml2.idpMetadataUri.label', 'IDP Metadata URI'),
-        description: t('provider.saml2.idpMetadataUri.description', 'The URI for your provider\'s metadata'),
-        placeholder: 'https://dev-XXXXXXXX.okta.com/app/externalKey/sso/saml/metadata',
+        key: "idpMetadataUri",
+        type: "text",
+        label: t("provider.saml2.idpMetadataUri.label", "IDP Metadata URI"),
+        description: t(
+          "provider.saml2.idpMetadataUri.description",
+          "The URI for your provider's metadata",
+        ),
+        placeholder:
+          "https://dev-XXXXXXXX.okta.com/app/externalKey/sso/saml/metadata",
       },
       {
-        key: 'idpSingleLoginUrl',
-        type: 'text',
-        label: t('provider.saml2.idpSingleLoginUrl.label', 'IDP Single Login URL'),
-        description: t('provider.saml2.idpSingleLoginUrl.description', 'The URL for initiating SSO'),
-        placeholder: 'https://dev-XXXXXXXX.okta.com/app/dev-XXXXXXXX_stirlingpdf_1/externalKey/sso/saml',
+        key: "idpSingleLoginUrl",
+        type: "text",
+        label: t(
+          "provider.saml2.idpSingleLoginUrl.label",
+          "IDP Single Login URL",
+        ),
+        description: t(
+          "provider.saml2.idpSingleLoginUrl.description",
+          "The URL for initiating SSO",
+        ),
+        placeholder:
+          "https://dev-XXXXXXXX.okta.com/app/dev-XXXXXXXX_stirlingpdf_1/externalKey/sso/saml",
       },
       {
-        key: 'idpSingleLogoutUrl',
-        type: 'text',
-        label: t('provider.saml2.idpSingleLogoutUrl.label', 'IDP Single Logout URL'),
-        description: t('provider.saml2.idpSingleLogoutUrl.description', 'The URL for initiating SLO'),
-        placeholder: 'https://dev-XXXXXXXX.okta.com/app/dev-XXXXXXXX_stirlingpdf_1/externalKey/slo/saml',
+        key: "idpSingleLogoutUrl",
+        type: "text",
+        label: t(
+          "provider.saml2.idpSingleLogoutUrl.label",
+          "IDP Single Logout URL",
+        ),
+        description: t(
+          "provider.saml2.idpSingleLogoutUrl.description",
+          "The URL for initiating SLO",
+        ),
+        placeholder:
+          "https://dev-XXXXXXXX.okta.com/app/dev-XXXXXXXX_stirlingpdf_1/externalKey/slo/saml",
       },
       {
-        key: 'idpIssuer',
-        type: 'text',
-        label: t('provider.saml2.idpIssuer.label', 'IDP Issuer'),
-        description: t('provider.saml2.idpIssuer.description', 'The ID of your provider'),
+        key: "idpIssuer",
+        type: "text",
+        label: t("provider.saml2.idpIssuer.label", "IDP Issuer"),
+        description: t(
+          "provider.saml2.idpIssuer.description",
+          "The ID of your provider",
+        ),
       },
       {
-        key: 'idpCert',
-        type: 'text',
-        label: t('provider.saml2.idpCert.label', 'IDP Certificate'),
-        description: t('provider.saml2.idpCert.description', 'The certificate path (e.g., classpath:okta.cert)'),
-        placeholder: 'classpath:okta.cert',
+        key: "idpCert",
+        type: "text",
+        label: t("provider.saml2.idpCert.label", "IDP Certificate"),
+        description: t(
+          "provider.saml2.idpCert.description",
+          "The certificate path (e.g., classpath:okta.cert)",
+        ),
+        placeholder: "classpath:okta.cert",
       },
       {
-        key: 'privateKey',
-        type: 'text',
-        label: t('provider.saml2.privateKey.label', 'Private Key'),
-        description: t('provider.saml2.privateKey.description', 'Your private key path'),
-        placeholder: 'classpath:saml-private-key.key',
+        key: "privateKey",
+        type: "text",
+        label: t("provider.saml2.privateKey.label", "Private Key"),
+        description: t(
+          "provider.saml2.privateKey.description",
+          "Your private key path",
+        ),
+        placeholder: "classpath:saml-private-key.key",
       },
       {
-        key: 'spCert',
-        type: 'text',
-        label: t('provider.saml2.spCert.label', 'SP Certificate'),
-        description: t('provider.saml2.spCert.description', 'Your signing certificate path'),
-        placeholder: 'classpath:saml-public-cert.crt',
+        key: "spCert",
+        type: "text",
+        label: t("provider.saml2.spCert.label", "SP Certificate"),
+        description: t(
+          "provider.saml2.spCert.description",
+          "Your signing certificate path",
+        ),
+        placeholder: "classpath:saml-public-cert.crt",
       },
       {
-        key: 'autoCreateUser',
-        type: 'switch',
-        label: t('provider.saml2.autoCreateUser.label', 'Auto Create Users'),
-        description: t('provider.saml2.autoCreateUser.description', 'Automatically create user accounts on first SAML2 login'),
+        key: "autoCreateUser",
+        type: "switch",
+        label: t("provider.saml2.autoCreateUser.label", "Auto Create Users"),
+        description: t(
+          "provider.saml2.autoCreateUser.description",
+          "Automatically create user accounts on first SAML2 login",
+        ),
         defaultValue: true,
       },
       {
-        key: 'blockRegistration',
-        type: 'switch',
-        label: t('provider.saml2.blockRegistration.label', 'Block Registration'),
-        description: t('provider.saml2.blockRegistration.description', 'Prevent new user registration via SAML2'),
+        key: "blockRegistration",
+        type: "switch",
+        label: t(
+          "provider.saml2.blockRegistration.label",
+          "Block Registration",
+        ),
+        description: t(
+          "provider.saml2.blockRegistration.description",
+          "Prevent new user registration via SAML2",
+        ),
         defaultValue: false,
       },
     ],
@@ -599,40 +803,56 @@ const useGoogleDriveProvider = (): Provider => {
   const { t } = useTranslation();
 
   return {
-    id: 'googledrive',
-    name: t('provider.googledrive.name', 'Google Drive'),
-    icon: '/images/google-drive.svg',
-    type: 'googledrive',
-    scope: t('provider.googledrive.scope', 'File Import'),
-    documentationUrl: 'https://docs.stirlingpdf.com/Configuration/Google%20Drive%20File%20Picker/',
+    id: "googledrive",
+    name: t("provider.googledrive.name", "Google Drive"),
+    icon: "/images/google-drive.svg",
+    type: "googledrive",
+    scope: t("provider.googledrive.scope", "File Import"),
+    documentationUrl:
+      "https://docs.stirlingpdf.com/Configuration/Google%20Drive%20File%20Picker/",
     fields: [
       {
-        key: 'enabled',
-        type: 'switch',
-        label: t('provider.googledrive.enabled.label', 'Enable Google Drive File Picker'),
-        description: t('provider.googledrive.enabled.description', 'Allow users to import files directly from Google Drive'),
+        key: "enabled",
+        type: "switch",
+        label: t(
+          "provider.googledrive.enabled.label",
+          "Enable Google Drive File Picker",
+        ),
+        description: t(
+          "provider.googledrive.enabled.description",
+          "Allow users to import files directly from Google Drive",
+        ),
         defaultValue: false,
       },
       {
-        key: 'clientId',
-        type: 'text',
-        label: t('provider.googledrive.clientId.label', 'Client ID'),
-        description: t('provider.googledrive.clientId.description', 'Google OAuth 2.0 Client ID from Google Cloud Console'),
-        placeholder: 'xxx.apps.googleusercontent.com',
+        key: "clientId",
+        type: "text",
+        label: t("provider.googledrive.clientId.label", "Client ID"),
+        description: t(
+          "provider.googledrive.clientId.description",
+          "Google OAuth 2.0 Client ID from Google Cloud Console",
+        ),
+        placeholder: "xxx.apps.googleusercontent.com",
       },
       {
-        key: 'apiKey',
-        type: 'text',
-        label: t('provider.googledrive.apiKey.label', 'API Key'),
-        description: t('provider.googledrive.apiKey.description', 'Google API Key for Google Picker API from Google Cloud Console'),
-        placeholder: 'AIza...',
+        key: "apiKey",
+        type: "text",
+        label: t("provider.googledrive.apiKey.label", "API Key"),
+        description: t(
+          "provider.googledrive.apiKey.description",
+          "Google API Key for Google Picker API from Google Cloud Console",
+        ),
+        placeholder: "AIza...",
       },
       {
-        key: 'appId',
-        type: 'text',
-        label: t('provider.googledrive.appId.label', 'App ID'),
-        description: t('provider.googledrive.appId.description', 'Google Drive App ID from Google Cloud Console'),
-        placeholder: 'xxxxxxxxxxxxx',
+        key: "appId",
+        type: "text",
+        label: t("provider.googledrive.appId.label", "App ID"),
+        description: t(
+          "provider.googledrive.appId.description",
+          "Google Drive App ID from Google Cloud Console",
+        ),
+        placeholder: "xxxxxxxxxxxxx",
       },
     ],
   };
diff --git a/frontend/src/core/components/shared/config/types.ts b/frontend/src/core/components/shared/config/types.ts
index 9cee0e7caf..6a22ed3112 100644
--- a/frontend/src/core/components/shared/config/types.ts
+++ b/frontend/src/core/components/shared/config/types.ts
@@ -1,38 +1,38 @@
 // Single source of truth for all valid nav keys
 export const VALID_NAV_KEYS = [
-  'preferences',
-  'notifications',
-  'connections',
-  'account',
-  'general',
-  'people',
-  'teams',
-  'security',
-  'identity',
-  'plan',
-  'payments',
-  'requests',
-  'developer',
-  'api-keys',
-  'hotkeys',
-  'adminGeneral',
-  'adminSecurity',
-  'adminConnections',
-  'adminTelegram',
-  'adminPrivacy',
-  'adminDatabase',
-  'adminAdvanced',
-  'adminLegal',
-  'adminPremium',
-  'adminFeatures',
-  'adminPlan',
-  'adminAudit',
-  'adminUsage',
-  'adminEndpoints',
-  'adminStorageSharing',
+  "preferences",
+  "notifications",
+  "connections",
+  "account",
+  "general",
+  "people",
+  "teams",
+  "security",
+  "identity",
+  "plan",
+  "payments",
+  "requests",
+  "developer",
+  "api-keys",
+  "hotkeys",
+  "adminGeneral",
+  "adminSecurity",
+  "adminConnections",
+  "adminTelegram",
+  "adminPrivacy",
+  "adminDatabase",
+  "adminAdvanced",
+  "adminLegal",
+  "adminPremium",
+  "adminFeatures",
+  "adminPlan",
+  "adminAudit",
+  "adminUsage",
+  "adminEndpoints",
+  "adminStorageSharing",
 ] as const;
 
 // Derive the type from the array
-export type NavKey = typeof VALID_NAV_KEYS[number];
+export type NavKey = (typeof VALID_NAV_KEYS)[number];
 
 // some of these are not used yet, but appear in figma designs
diff --git a/frontend/src/core/components/shared/config/useRestartServer.ts b/frontend/src/core/components/shared/config/useRestartServer.ts
index 60291d0411..fd5993170d 100644
--- a/frontend/src/core/components/shared/config/useRestartServer.ts
+++ b/frontend/src/core/components/shared/config/useRestartServer.ts
@@ -1,7 +1,7 @@
-import { useState } from 'react';
-import { useTranslation } from 'react-i18next';
-import { alert } from '@app/components/toast';
-import apiClient from '@app/services/apiClient';
+import { useState } from "react";
+import { useTranslation } from "react-i18next";
+import { alert } from "@app/components/toast";
+import apiClient from "@app/services/apiClient";
 
 export function useRestartServer() {
   const { t } = useTranslation();
@@ -18,33 +18,34 @@ export function useRestartServer() {
   const restartServer = async () => {
     setRestartModalOpened(false);
 
-    await apiClient.post('/api/v1/admin/settings/restart', undefined, {
-      suppressErrorToast: true,
-    })
-    .then(() => {
-      alert({
-        alertType: 'neutral',
-        title: t('admin.settings.restarting', 'Restarting Server'),
-        body: t(
-          'admin.settings.restartingMessage',
-          'The server is restarting. Please wait a moment...'
-        ),
+    await apiClient
+      .post("/api/v1/admin/settings/restart", undefined, {
+        suppressErrorToast: true,
+      })
+      .then(() => {
+        alert({
+          alertType: "neutral",
+          title: t("admin.settings.restarting", "Restarting Server"),
+          body: t(
+            "admin.settings.restartingMessage",
+            "The server is restarting. Please wait a moment...",
+          ),
+        });
+        // Wait a moment then reload the page
+        setTimeout(() => {
+          window.location.reload();
+        }, 3000);
+      })
+      .catch(async (_error) => {
+        alert({
+          alertType: "error",
+          title: t("admin.error", "Error"),
+          body: t(
+            "admin.settings.restartError",
+            "Failed to restart server. Please restart manually.",
+          ),
+        });
       });
-      // Wait a moment then reload the page
-      setTimeout(() => {
-        window.location.reload();
-      }, 3000);
-    })
-    .catch(async (_error) => {
-      alert({
-        alertType: 'error',
-        title: t('admin.error', 'Error'),
-        body: t(
-          'admin.settings.restartError',
-          'Failed to restart server. Please restart manually.'
-        ),
-      });
-    })
   };
 
   return {
diff --git a/frontend/src/core/components/shared/filePreview/DocumentStack.tsx b/frontend/src/core/components/shared/filePreview/DocumentStack.tsx
index 16168f6c9e..bba1eb79a5 100644
--- a/frontend/src/core/components/shared/filePreview/DocumentStack.tsx
+++ b/frontend/src/core/components/shared/filePreview/DocumentStack.tsx
@@ -1,5 +1,5 @@
-import React from 'react';
-import { Box } from '@mantine/core';
+import React from "react";
+import { Box } from "@mantine/core";
 
 export interface DocumentStackProps {
   totalFiles: number;
@@ -8,58 +8,60 @@ export interface DocumentStackProps {
 
 const DocumentStack: React.FC<DocumentStackProps> = ({
   totalFiles,
-  children
+  children,
 }) => {
   const stackDocumentBaseStyle = {
-    position: 'absolute' as const,
-    width: '100%',
-    height: '100%'
+    position: "absolute" as const,
+    width: "100%",
+    height: "100%",
   };
 
   const stackDocumentShadows = {
-    back: '0 2px 8px rgba(0, 0, 0, 0.1)',
-    middle: '0 3px 10px rgba(0, 0, 0, 0.12)'
+    back: "0 2px 8px rgba(0, 0, 0, 0.1)",
+    middle: "0 3px 10px rgba(0, 0, 0, 0.12)",
   };
 
   return (
-    <Box style={{ position: 'relative', width: '100%', height: '100%' }}>
+    <Box style={{ position: "relative", width: "100%", height: "100%" }}>
       {/* Background documents (stack effect) */}
       {totalFiles >= 3 && (
         <Box
           style={{
             ...stackDocumentBaseStyle,
-            backgroundColor: 'var(--mantine-color-gray-3)',
+            backgroundColor: "var(--mantine-color-gray-3)",
             boxShadow: stackDocumentShadows.back,
-            transform: 'translate(0.75rem, 0.75rem) rotate(2deg)',
-            zIndex: 1
+            transform: "translate(0.75rem, 0.75rem) rotate(2deg)",
+            zIndex: 1,
           }}
         />
       )}
-      
+
       {totalFiles >= 2 && (
         <Box
           style={{
             ...stackDocumentBaseStyle,
-            backgroundColor: 'var(--mantine-color-gray-2)',
+            backgroundColor: "var(--mantine-color-gray-2)",
             boxShadow: stackDocumentShadows.middle,
-            transform: 'translate(0.375rem, 0.375rem) rotate(1deg)',
-            zIndex: 2
+            transform: "translate(0.375rem, 0.375rem) rotate(1deg)",
+            zIndex: 2,
           }}
         />
       )}
 
       {/* Main document container */}
-      <Box style={{ 
-        position: 'relative',
-        width: '100%',
-        height: '100%',
-        zIndex: 3,
-        boxShadow: '0 6px 16px rgba(0, 0, 0, 0.2)'
-      }}>
+      <Box
+        style={{
+          position: "relative",
+          width: "100%",
+          height: "100%",
+          zIndex: 3,
+          boxShadow: "0 6px 16px rgba(0, 0, 0, 0.2)",
+        }}
+      >
         {children}
       </Box>
     </Box>
   );
 };
 
-export default DocumentStack;
\ No newline at end of file
+export default DocumentStack;
diff --git a/frontend/src/core/components/shared/filePreview/DocumentThumbnail.tsx b/frontend/src/core/components/shared/filePreview/DocumentThumbnail.tsx
index f672c582e0..e0b61d6a40 100644
--- a/frontend/src/core/components/shared/filePreview/DocumentThumbnail.tsx
+++ b/frontend/src/core/components/shared/filePreview/DocumentThumbnail.tsx
@@ -1,8 +1,8 @@
-import React from 'react';
-import { Box, Center, Image } from '@mantine/core';
-import { getFileTypeIcon } from '@app/components/shared/filePreview/getFileTypeIcon';
-import { StirlingFileStub } from '@app/types/fileContext';
-import { PrivateContent } from '@app/components/shared/PrivateContent';
+import React from "react";
+import { Box, Center, Image } from "@mantine/core";
+import { getFileTypeIcon } from "@app/components/shared/filePreview/getFileTypeIcon";
+import { StirlingFileStub } from "@app/types/fileContext";
+import { PrivateContent } from "@app/components/shared/PrivateContent";
 
 export interface DocumentThumbnailProps {
   file: File | StirlingFileStub | null;
@@ -17,20 +17,20 @@ const DocumentThumbnail: React.FC<DocumentThumbnailProps> = ({
   thumbnail,
   style = {},
   onClick,
-  children
+  children,
 }) => {
   if (!file) return null;
 
   const containerStyle = {
-    position: 'relative' as const,
-    cursor: onClick ? 'pointer' : 'default',
-    transition: 'opacity 0.2s ease',
-    width: '100%',
-    height: '100%',
-    display: 'flex',
-    alignItems: 'center',
-    justifyContent: 'center',
-    ...style
+    position: "relative" as const,
+    cursor: onClick ? "pointer" : "default",
+    transition: "opacity 0.2s ease",
+    width: "100%",
+    height: "100%",
+    display: "flex",
+    alignItems: "center",
+    justifyContent: "center",
+    ...style,
   };
 
   if (thumbnail) {
@@ -41,11 +41,11 @@ const DocumentThumbnail: React.FC<DocumentThumbnailProps> = ({
             src={thumbnail}
             alt={`Preview of ${file.name}`}
             fit="contain"
-            style={{ 
-              maxWidth: '100%', 
-              maxHeight: '100%',
-              width: 'auto',
-              height: 'auto'
+            style={{
+              maxWidth: "100%",
+              maxHeight: "100%",
+              width: "auto",
+              height: "auto",
             }}
           />
         </PrivateContent>
@@ -56,10 +56,15 @@ const DocumentThumbnail: React.FC<DocumentThumbnailProps> = ({
 
   return (
     <Box style={containerStyle} onClick={onClick}>
-      <Center style={{ width: '100%', height: '100%', backgroundColor: 'var(--mantine-color-gray-1)', borderRadius: '0.25rem' }}>
-        <PrivateContent>
-          {getFileTypeIcon(file)}
-        </PrivateContent>
+      <Center
+        style={{
+          width: "100%",
+          height: "100%",
+          backgroundColor: "var(--mantine-color-gray-1)",
+          borderRadius: "0.25rem",
+        }}
+      >
+        <PrivateContent>{getFileTypeIcon(file)}</PrivateContent>
       </Center>
       {children}
     </Box>
diff --git a/frontend/src/core/components/shared/filePreview/HoverOverlay.tsx b/frontend/src/core/components/shared/filePreview/HoverOverlay.tsx
index f098089828..cc4ae15d27 100644
--- a/frontend/src/core/components/shared/filePreview/HoverOverlay.tsx
+++ b/frontend/src/core/components/shared/filePreview/HoverOverlay.tsx
@@ -1,6 +1,6 @@
-import React from 'react';
-import { Box } from '@mantine/core';
-import VisibilityIcon from '@mui/icons-material/Visibility';
+import React from "react";
+import { Box } from "@mantine/core";
+import VisibilityIcon from "@mui/icons-material/Visibility";
 
 export interface HoverOverlayProps {
   onMouseEnter?: (e: React.MouseEvent) => void;
@@ -11,53 +11,57 @@ export interface HoverOverlayProps {
 const HoverOverlay: React.FC<HoverOverlayProps> = ({
   onMouseEnter,
   onMouseLeave,
-  children
+  children,
 }) => {
   const defaultMouseEnter = (e: React.MouseEvent) => {
-    const overlay = e.currentTarget.querySelector('.hover-overlay') as HTMLElement;
-    if (overlay) overlay.style.opacity = '1';
+    const overlay = e.currentTarget.querySelector(
+      ".hover-overlay",
+    ) as HTMLElement;
+    if (overlay) overlay.style.opacity = "1";
   };
 
   const defaultMouseLeave = (e: React.MouseEvent) => {
-    const overlay = e.currentTarget.querySelector('.hover-overlay') as HTMLElement;
-    if (overlay) overlay.style.opacity = '0';
+    const overlay = e.currentTarget.querySelector(
+      ".hover-overlay",
+    ) as HTMLElement;
+    if (overlay) overlay.style.opacity = "0";
   };
 
   return (
     <Box
       style={{
-        position: 'relative',
-        width: '100%',
-        height: '100%'
+        position: "relative",
+        width: "100%",
+        height: "100%",
       }}
       onMouseEnter={onMouseEnter || defaultMouseEnter}
       onMouseLeave={onMouseLeave || defaultMouseLeave}
     >
       {children}
-      
+
       {/* Hover overlay */}
       <Box
         className="hover-overlay"
         style={{
-          position: 'absolute',
+          position: "absolute",
           top: 0,
           left: 0,
           right: 0,
           bottom: 0,
-          display: 'flex',
-          alignItems: 'center',
-          justifyContent: 'center',
-          backgroundColor: 'rgba(0, 0, 0, 0.5)',
-          borderRadius: '0.25rem',
+          display: "flex",
+          alignItems: "center",
+          justifyContent: "center",
+          backgroundColor: "rgba(0, 0, 0, 0.5)",
+          borderRadius: "0.25rem",
           opacity: 0,
-          transition: 'opacity 0.2s ease',
-          pointerEvents: 'none'
+          transition: "opacity 0.2s ease",
+          pointerEvents: "none",
         }}
       >
-        <VisibilityIcon style={{ color: 'white', fontSize: '1.5rem' }} />
+        <VisibilityIcon style={{ color: "white", fontSize: "1.5rem" }} />
       </Box>
     </Box>
   );
 };
 
-export default HoverOverlay;
\ No newline at end of file
+export default HoverOverlay;
diff --git a/frontend/src/core/components/shared/filePreview/NavigationArrows.tsx b/frontend/src/core/components/shared/filePreview/NavigationArrows.tsx
index e9fc96719e..f8b416f275 100644
--- a/frontend/src/core/components/shared/filePreview/NavigationArrows.tsx
+++ b/frontend/src/core/components/shared/filePreview/NavigationArrows.tsx
@@ -1,7 +1,7 @@
-import React from 'react';
-import { Box, ActionIcon } from '@mantine/core';
-import ChevronLeftIcon from '@mui/icons-material/ChevronLeft';
-import ChevronRightIcon from '@mui/icons-material/ChevronRight';
+import React from "react";
+import { Box, ActionIcon } from "@mantine/core";
+import ChevronLeftIcon from "@mui/icons-material/ChevronLeft";
+import ChevronRightIcon from "@mui/icons-material/ChevronRight";
 
 export interface NavigationArrowsProps {
   onPrevious: () => void;
@@ -14,17 +14,17 @@ const NavigationArrows: React.FC<NavigationArrowsProps> = ({
   onPrevious,
   onNext,
   disabled = false,
-  children
+  children,
 }) => {
   const navigationArrowStyle = {
-    position: 'absolute' as const,
-    top: '50%',
-    transform: 'translateY(-50%)',
-    zIndex: 10
+    position: "absolute" as const,
+    top: "50%",
+    transform: "translateY(-50%)",
+    zIndex: 10,
   };
 
   return (
-    <Box style={{ position: 'relative', width: '100%', height: '100%' }}>
+    <Box style={{ position: "relative", width: "100%", height: "100%" }}>
       {/* Left Navigation Arrow */}
       <ActionIcon
         variant="light"
@@ -34,17 +34,25 @@ const NavigationArrows: React.FC<NavigationArrowsProps> = ({
         disabled={disabled}
         style={{
           ...navigationArrowStyle,
-          left: '0'
+          left: "0",
         }}
       >
         <ChevronLeftIcon />
       </ActionIcon>
-      
+
       {/* Content */}
-      <Box style={{ width: '100%', height: '100%', display: 'flex', alignItems: 'center', justifyContent: 'center' }}>
+      <Box
+        style={{
+          width: "100%",
+          height: "100%",
+          display: "flex",
+          alignItems: "center",
+          justifyContent: "center",
+        }}
+      >
         {children}
       </Box>
-      
+
       {/* Right Navigation Arrow */}
       <ActionIcon
         variant="light"
@@ -54,7 +62,7 @@ const NavigationArrows: React.FC<NavigationArrowsProps> = ({
         disabled={disabled}
         style={{
           ...navigationArrowStyle,
-          right: '0'
+          right: "0",
         }}
       >
         <ChevronRightIcon />
@@ -63,4 +71,4 @@ const NavigationArrows: React.FC<NavigationArrowsProps> = ({
   );
 };
 
-export default NavigationArrows;
\ No newline at end of file
+export default NavigationArrows;
diff --git a/frontend/src/core/components/shared/filePreview/getFileTypeIcon.tsx b/frontend/src/core/components/shared/filePreview/getFileTypeIcon.tsx
index afcacad070..2666f06606 100644
--- a/frontend/src/core/components/shared/filePreview/getFileTypeIcon.tsx
+++ b/frontend/src/core/components/shared/filePreview/getFileTypeIcon.tsx
@@ -12,21 +12,36 @@ type FileLike = File | StirlingFileStub;
  * - Uses the real file type and extension to decide the icon.
  * - No any-casts; accepts File or StirlingFileStub.
  */
-export function getFileTypeIcon(file: FileLike, size: number | string = "2rem"): React.ReactElement {
+export function getFileTypeIcon(
+  file: FileLike,
+  size: number | string = "2rem",
+): React.ReactElement {
   const name = (file?.name ?? "").toLowerCase();
   const mime = (file?.type ?? "").toLowerCase();
   const ext = detectFileExtension(name);
 
   // JavaScript
   if (ext === "js" || mime.includes("javascript")) {
-    return <JavascriptIcon style={{ fontSize: size, color: "var(--mantine-color-gray-6)" }} />;
+    return (
+      <JavascriptIcon
+        style={{ fontSize: size, color: "var(--mantine-color-gray-6)" }}
+      />
+    );
   }
 
   // PDF
   if (ext === "pdf" || mime === "application/pdf") {
-    return <PictureAsPdfIcon style={{ fontSize: size, color: "var(--mantine-color-gray-6)" }} />;
+    return (
+      <PictureAsPdfIcon
+        style={{ fontSize: size, color: "var(--mantine-color-gray-6)" }}
+      />
+    );
   }
 
   // Fallback generic
-  return <InsertDriveFileIcon style={{ fontSize: size, color: "var(--mantine-color-gray-6)" }} />;
+  return (
+    <InsertDriveFileIcon
+      style={{ fontSize: size, color: "var(--mantine-color-gray-6)" }}
+    />
+  );
 }
diff --git a/frontend/src/core/components/shared/fitText/textFit.ts b/frontend/src/core/components/shared/fitText/textFit.ts
index 7a695ed777..4ad2ad9bc5 100644
--- a/frontend/src/core/components/shared/fitText/textFit.ts
+++ b/frontend/src/core/components/shared/fitText/textFit.ts
@@ -1,4 +1,4 @@
-import { RefObject, useEffect } from 'react';
+import { RefObject, useEffect } from "react";
 
 export type AdjustFontSizeOptions = {
   /** Max font size to start from. Defaults to the element's computed font size. */
@@ -19,12 +19,13 @@ export type AdjustFontSizeOptions = {
  */
 export function adjustFontSizeToFit(
   element: HTMLElement,
-  options: AdjustFontSizeOptions = {}
+  options: AdjustFontSizeOptions = {},
 ): () => void {
   if (!element) return () => {};
 
   const computed = window.getComputedStyle(element);
-  const baseFontPx = options.maxFontSizePx ?? parseFloat(computed.fontSize || '16');
+  const baseFontPx =
+    options.maxFontSizePx ?? parseFloat(computed.fontSize || "16");
   const minScale = Math.max(0.1, options.minFontScale ?? 0.7);
   const stepScale = Math.max(0.005, options.stepScale ?? 0.05);
   const singleLine = options.singleLine ?? false;
@@ -32,14 +33,14 @@ export function adjustFontSizeToFit(
 
   // Ensure measurement is consistent
   if (singleLine) {
-    element.style.whiteSpace = 'nowrap';
+    element.style.whiteSpace = "nowrap";
   }
   // Never split within words; only allow natural breaks (spaces) or explicit soft breaks
-  element.style.wordBreak = 'keep-all';
-  element.style.overflowWrap = 'normal';
+  element.style.wordBreak = "keep-all";
+  element.style.overflowWrap = "normal";
   // Disable automatic hyphenation to avoid mid-word breaks; use only manual opportunities
-  element.style.setProperty('hyphens', 'manual');
-  element.style.overflow = 'visible';
+  element.style.setProperty("hyphens", "manual");
+  element.style.overflow = "visible";
 
   const minFontPx = baseFontPx * minScale;
   const stepPx = Math.max(0.5, baseFontPx * stepScale);
@@ -50,7 +51,7 @@ export function adjustFontSizeToFit(
 
     // Calculate target height threshold for line limit
     let maxHeight = Number.POSITIVE_INFINITY;
-    if (typeof maxLines === 'number' && maxLines > 0) {
+    if (typeof maxLines === "number" && maxLines > 0) {
       const cs = window.getComputedStyle(element);
       const lineHeight = parseFloat(cs.lineHeight) || baseFontPx * 1.2;
       maxHeight = lineHeight * maxLines + 0.1; // small epsilon
@@ -82,21 +83,34 @@ export function adjustFontSizeToFit(
 
   return () => {
     cancelAnimationFrame(raf);
-    try { ro.disconnect(); } catch { /* Ignore errors */ }
-    try { mo.disconnect(); } catch { /* Ignore errors */ }
+    try {
+      ro.disconnect();
+    } catch {
+      /* Ignore errors */
+    }
+    try {
+      mo.disconnect();
+    } catch {
+      /* Ignore errors */
+    }
   };
 }
 
 /** React hook wrapper for convenience */
 export function useAdjustFontSizeToFit(
   ref: RefObject<HTMLElement | null>,
-  options: AdjustFontSizeOptions = {}
+  options: AdjustFontSizeOptions = {},
 ) {
   useEffect(() => {
     if (!ref.current) return;
     const cleanup = adjustFontSizeToFit(ref.current, options);
     return cleanup;
-  }, [ref, options.maxFontSizePx, options.minFontScale, options.stepScale, options.maxLines, options.singleLine]);
+  }, [
+    ref,
+    options.maxFontSizePx,
+    options.minFontScale,
+    options.stepScale,
+    options.maxLines,
+    options.singleLine,
+  ]);
 }
-
-
diff --git a/frontend/src/core/components/shared/modals/InsufficientCreditsModal.tsx b/frontend/src/core/components/shared/modals/InsufficientCreditsModal.tsx
index 9610f655ce..5666001a40 100644
--- a/frontend/src/core/components/shared/modals/InsufficientCreditsModal.tsx
+++ b/frontend/src/core/components/shared/modals/InsufficientCreditsModal.tsx
@@ -10,6 +10,8 @@ interface InsufficientCreditsModalProps {
   requiredCredits?: number;
 }
 
-export function InsufficientCreditsModal(_props: InsufficientCreditsModalProps) {
+export function InsufficientCreditsModal(
+  _props: InsufficientCreditsModalProps,
+) {
   return null;
 }
diff --git a/frontend/src/core/components/shared/pageEditor/useFileItemDragDrop.ts b/frontend/src/core/components/shared/pageEditor/useFileItemDragDrop.ts
index 2503957de8..b51b90737a 100644
--- a/frontend/src/core/components/shared/pageEditor/useFileItemDragDrop.ts
+++ b/frontend/src/core/components/shared/pageEditor/useFileItemDragDrop.ts
@@ -1,7 +1,10 @@
-import { useRef, useEffect, useState } from 'react';
-import { draggable, dropTargetForElements } from '@atlaskit/pragmatic-drag-and-drop/element/adapter';
+import { useRef, useEffect, useState } from "react";
+import {
+  draggable,
+  dropTargetForElements,
+} from "@atlaskit/pragmatic-drag-and-drop/element/adapter";
 
-import { FileId } from '@app/types/file';
+import { FileId } from "@app/types/file";
 
 interface UseFileItemDragDropParams {
   fileId: FileId;
@@ -13,7 +16,7 @@ interface UseFileItemDragDropReturn {
   itemRef: React.RefObject<HTMLDivElement | null>;
   isDragging: boolean;
   isDragOver: boolean;
-  dropPosition: 'above' | 'below';
+  dropPosition: "above" | "below";
   movedRef: React.MutableRefObject<boolean>;
   startRef: React.MutableRefObject<{ x: number; y: number } | null>;
   onPointerDown: (e: React.PointerEvent) => void;
@@ -32,19 +35,27 @@ export const useFileItemDragDrop = ({
 }: UseFileItemDragDropParams): UseFileItemDragDropReturn => {
   const [isDragging, setIsDragging] = useState(false);
   const [isDragOver, setIsDragOver] = useState(false);
-  const [dropPosition, setDropPosition] = useState<'above' | 'below'>('below');
+  const [dropPosition, setDropPosition] = useState<"above" | "below">("below");
   const itemRef = useRef<HTMLDivElement>(null);
 
   // Keep latest values without re-registering DnD
   const indexRef = useRef(index);
   const fileIdRef = useRef(fileId);
-  const dropPositionRef = useRef<'above' | 'below'>('below');
+  const dropPositionRef = useRef<"above" | "below">("below");
   const onReorderRef = useRef(onReorder);
 
-  useEffect(() => { indexRef.current = index; }, [index]);
-  useEffect(() => { fileIdRef.current = fileId; }, [fileId]);
-  useEffect(() => { dropPositionRef.current = dropPosition; }, [dropPosition]);
-  useEffect(() => { onReorderRef.current = onReorder; }, [onReorder]);
+  useEffect(() => {
+    indexRef.current = index;
+  }, [index]);
+  useEffect(() => {
+    fileIdRef.current = fileId;
+  }, [fileId]);
+  useEffect(() => {
+    dropPositionRef.current = dropPosition;
+  }, [dropPosition]);
+  useEffect(() => {
+    onReorderRef.current = onReorder;
+  }, [onReorder]);
 
   // Gesture guard for row click vs drag
   const movedRef = useRef(false);
@@ -73,7 +84,7 @@ export const useFileItemDragDrop = ({
     const dragCleanup = draggable({
       element,
       getInitialData: () => ({
-        type: 'file-item',
+        type: "file-item",
         fileId: fileIdRef.current,
         fromIndex: indexRef.current,
       }),
@@ -85,14 +96,14 @@ export const useFileItemDragDrop = ({
     const dropCleanup = dropTargetForElements({
       element,
       getData: () => ({
-        type: 'file-item',
+        type: "file-item",
         fileId: fileIdRef.current,
         toIndex: indexRef.current,
       }),
       onDragEnter: () => setIsDragOver((p) => (p ? p : true)),
       onDragLeave: () => {
         setIsDragOver((p) => (p ? false : p));
-        setDropPosition('below');
+        setDropPosition("below");
       },
       onDrag: ({ source }) => {
         // Determine drop position based on cursor location
@@ -100,29 +111,30 @@ export const useFileItemDragDrop = ({
         if (!element) return;
 
         const rect = element.getBoundingClientRect();
-        const clientY = (source as any).element?.getBoundingClientRect().top || 0;
+        const clientY =
+          (source as any).element?.getBoundingClientRect().top || 0;
         const midpoint = rect.top + rect.height / 2;
 
-        setDropPosition(clientY < midpoint ? 'below' : 'above');
+        setDropPosition(clientY < midpoint ? "below" : "above");
       },
       onDrop: ({ source }) => {
         setIsDragOver(false);
         const dropPos = dropPositionRef.current;
-        setDropPosition('below');
+        setDropPosition("below");
         const sourceData = source.data as any;
-        if (sourceData?.type === 'file-item') {
+        if (sourceData?.type === "file-item") {
           const fromIndex = sourceData.fromIndex as number;
           let toIndex = indexRef.current;
 
           // Adjust toIndex based on drop position
-          if (dropPos === 'below' && fromIndex < toIndex) {
+          if (dropPos === "below" && fromIndex < toIndex) {
             // Dragging down, drop after target - no adjustment needed
-          } else if (dropPos === 'above' && fromIndex > toIndex) {
+          } else if (dropPos === "above" && fromIndex > toIndex) {
             // Dragging up, drop before target - no adjustment needed
-          } else if (dropPos === 'below' && fromIndex > toIndex) {
+          } else if (dropPos === "below" && fromIndex > toIndex) {
             // Dragging up but want below target
             toIndex = toIndex + 1;
-          } else if (dropPos === 'above' && fromIndex < toIndex) {
+          } else if (dropPos === "above" && fromIndex < toIndex) {
             // Dragging down but want above target
             toIndex = toIndex - 1;
           }
@@ -131,12 +143,20 @@ export const useFileItemDragDrop = ({
             onReorderRef.current(fromIndex, toIndex);
           }
         }
-      }
+      },
     });
 
     return () => {
-      try { dragCleanup(); } catch { /* cleanup */ }
-      try { dropCleanup(); } catch { /* cleanup */ }
+      try {
+        dragCleanup();
+      } catch {
+        /* cleanup */
+      }
+      try {
+        dropCleanup();
+      } catch {
+        /* cleanup */
+      }
     };
   }, []); // Stable - no dependencies
 
diff --git a/frontend/src/core/components/shared/quickAccessBar/ActiveToolButton.tsx b/frontend/src/core/components/shared/quickAccessBar/ActiveToolButton.tsx
index 38ed454844..641ec5f849 100644
--- a/frontend/src/core/components/shared/quickAccessBar/ActiveToolButton.tsx
+++ b/frontend/src/core/components/shared/quickAccessBar/ActiveToolButton.tsx
@@ -12,26 +12,33 @@
  * - Only appears for tools that don't have dedicated nav buttons (read, sign, automate)
  */
 
-import React, { useEffect, useRef, useState } from 'react';
-import { ActionIcon, Divider } from '@mantine/core';
-import ArrowBackRoundedIcon from '@mui/icons-material/ArrowBackRounded';
-import { useToolWorkflow } from '@app/contexts/ToolWorkflowContext';
-import { useNavigationState, useNavigationActions } from '@app/contexts/NavigationContext';
-import { useSidebarNavigation } from '@app/hooks/useSidebarNavigation';
-import { handleUnlessSpecialClick } from '@app/utils/clickHandlers';
-import FitText from '@app/components/shared/FitText';
-import { Tooltip } from '@app/components/shared/Tooltip';
+import React, { useEffect, useRef, useState } from "react";
+import { ActionIcon, Divider } from "@mantine/core";
+import ArrowBackRoundedIcon from "@mui/icons-material/ArrowBackRounded";
+import { useToolWorkflow } from "@app/contexts/ToolWorkflowContext";
+import {
+  useNavigationState,
+  useNavigationActions,
+} from "@app/contexts/NavigationContext";
+import { useSidebarNavigation } from "@app/hooks/useSidebarNavigation";
+import { handleUnlessSpecialClick } from "@app/utils/clickHandlers";
+import FitText from "@app/components/shared/FitText";
+import { Tooltip } from "@app/components/shared/Tooltip";
 
 interface ActiveToolButtonProps {
   activeButton: string;
   setActiveButton: (id: string) => void;
-  tooltipPosition?: 'left' | 'right' | 'top' | 'bottom';
+  tooltipPosition?: "left" | "right" | "top" | "bottom";
 }
 
-const NAV_IDS = ['read', 'sign', 'automate'];
+const NAV_IDS = ["read", "sign", "automate"];
 
-const ActiveToolButton: React.FC<ActiveToolButtonProps> = ({ setActiveButton, tooltipPosition = 'right' }) => {
-  const { selectedTool, selectedToolKey, leftPanelView, handleBackToTools } = useToolWorkflow();
+const ActiveToolButton: React.FC<ActiveToolButtonProps> = ({
+  setActiveButton,
+  tooltipPosition = "right",
+}) => {
+  const { selectedTool, selectedToolKey, leftPanelView, handleBackToTools } =
+    useToolWorkflow();
   const { hasUnsavedChanges } = useNavigationState();
   const { actions: navigationActions } = useNavigationActions();
   const { getHomeNavigation } = useSidebarNavigation();
@@ -40,12 +47,14 @@ const ActiveToolButton: React.FC<ActiveToolButtonProps> = ({ setActiveButton, to
   // Special case: multiTool should always show even when sidebars are hidden
   const indicatorShouldShow = Boolean(
     selectedToolKey &&
-    ((leftPanelView === 'toolContent' && !NAV_IDS.includes(selectedToolKey)) ||
-     selectedToolKey === 'multiTool')
+    ((leftPanelView === "toolContent" && !NAV_IDS.includes(selectedToolKey)) ||
+      selectedToolKey === "multiTool"),
   );
 
   // Local animation and hover state
-  const [indicatorTool, setIndicatorTool] = useState<typeof selectedTool | null>(null);
+  const [indicatorTool, setIndicatorTool] = useState<
+    typeof selectedTool | null
+  >(null);
   const [indicatorVisible, setIndicatorVisible] = useState<boolean>(false);
   const [replayAnim, setReplayAnim] = useState<boolean>(false);
   const [isBackHover, setIsBackHover] = useState<boolean>(false);
@@ -54,7 +63,9 @@ const ActiveToolButton: React.FC<ActiveToolButtonProps> = ({ setActiveButton, to
   const animTimeoutRef = useRef<number | null>(null);
   const replayRafRef = useRef<number | null>(null);
 
-  const isSwitchingToNewTool = () => { return prevKeyRef.current && prevKeyRef.current !== selectedToolKey; };
+  const isSwitchingToNewTool = () => {
+    return prevKeyRef.current && prevKeyRef.current !== selectedToolKey;
+  };
 
   const clearTimers = () => {
     if (collapseTimeoutRef.current) {
@@ -139,12 +150,15 @@ const ActiveToolButton: React.FC<ActiveToolButtonProps> = ({ setActiveButton, to
 
   return (
     <>
-      <div style={{ overflow: 'visible' }} className={`current-tool-slot ${indicatorVisible ? 'visible' : ''} ${replayAnim ? 'replay' : ''}`}>
+      <div
+        style={{ overflow: "visible" }}
+        className={`current-tool-slot ${indicatorVisible ? "visible" : ""} ${replayAnim ? "replay" : ""}`}
+      >
         {indicatorTool && (
           <div className="current-tool-content">
             <div className="flex flex-col items-center gap-1">
               <Tooltip
-                content={isBackHover ? 'Back to all tools' : indicatorTool.name}
+                content={isBackHover ? "Back to all tools" : indicatorTool.name}
                 position={tooltipPosition}
                 arrow
                 maxWidth={140}
@@ -154,7 +168,7 @@ const ActiveToolButton: React.FC<ActiveToolButtonProps> = ({ setActiveButton, to
                   href={getHomeNavigation().href}
                   onClick={(e: React.MouseEvent) => {
                     const performNavigation = () => {
-                      setActiveButton('tools');
+                      setActiveButton("tools");
                       handleBackToTools();
                     };
                     if (hasUnsavedChanges) {
@@ -164,23 +178,27 @@ const ActiveToolButton: React.FC<ActiveToolButtonProps> = ({ setActiveButton, to
                     }
                     handleUnlessSpecialClick(e, performNavigation);
                   }}
-                  size={'lg'}
+                  size={"lg"}
                   variant="subtle"
                   onMouseEnter={() => setIsBackHover(true)}
                   onMouseLeave={() => setIsBackHover(false)}
-                  aria-label={isBackHover ? 'Back to all tools' : indicatorTool.name}
+                  aria-label={
+                    isBackHover ? "Back to all tools" : indicatorTool.name
+                  }
                   style={{
-                    backgroundColor: isBackHover ? 'var(--color-gray-300)' : 'var(--icon-tools-bg)',
-                    color: isBackHover ? '#fff' : 'var(--icon-tools-color)',
-                    border: 'none',
-                    borderRadius: '8px',
-                    cursor: 'pointer',
-                    textDecoration: 'none'
+                    backgroundColor: isBackHover
+                      ? "var(--color-gray-300)"
+                      : "var(--icon-tools-bg)",
+                    color: isBackHover ? "#fff" : "var(--icon-tools-color)",
+                    border: "none",
+                    borderRadius: "8px",
+                    cursor: "pointer",
+                    textDecoration: "none",
                   }}
                 >
                   <span className="iconContainer">
                     {isBackHover ? (
-                      <ArrowBackRoundedIcon sx={{ fontSize: '1.875rem' }} />
+                      <ArrowBackRoundedIcon sx={{ fontSize: "1.875rem" }} />
                     ) : (
                       indicatorTool.icon
                     )}
@@ -195,10 +213,7 @@ const ActiveToolButton: React.FC<ActiveToolButtonProps> = ({ setActiveButton, to
                 className="button-text active current-tool-label"
               />
             </div>
-            <Divider
-              size="xs"
-              className="current-tool-divider"
-            />
+            <Divider size="xs" className="current-tool-divider" />
           </div>
         )}
       </div>
@@ -207,4 +222,3 @@ const ActiveToolButton: React.FC<ActiveToolButtonProps> = ({ setActiveButton, to
 };
 
 export default ActiveToolButton;
-
diff --git a/frontend/src/core/components/shared/quickAccessBar/QuickAccessBar.css b/frontend/src/core/components/shared/quickAccessBar/QuickAccessBar.css
index 9aea864ed7..dde53c3c47 100644
--- a/frontend/src/core/components/shared/quickAccessBar/QuickAccessBar.css
+++ b/frontend/src/core/components/shared/quickAccessBar/QuickAccessBar.css
@@ -23,7 +23,9 @@
   justify-content: center;
   width: 1.5rem;
   height: 1.5rem;
-  transition: width 0.2s, height 0.2s;
+  transition:
+    width 0.2s,
+    height 0.2s;
 }
 
 /* Action icon styles */
@@ -64,8 +66,8 @@
 }
 
 /* RTL adjustments keep the bar on-screen and separated from content */
-:root[dir='rtl'] .quick-access-bar-main,
-:root[dir='rtl'] .quick-access-bar-main.rainbow-mode {
+:root[dir="rtl"] .quick-access-bar-main,
+:root[dir="rtl"] .quick-access-bar-main.rainbow-mode {
   border-right: none;
   border-left: 1px solid var(--border-default);
 }
@@ -75,7 +77,7 @@
   padding: 1rem 0.25rem 0.5rem 0.25rem;
 }
 
-.nav-header { 
+.nav-header {
   display: flex;
   flex-direction: row;
   align-items: center;
@@ -224,7 +226,9 @@
   overflow: hidden;
   max-height: 0;
   opacity: 0;
-  transition: max-height 450ms ease-out, opacity 300ms ease-out;
+  transition:
+    max-height 450ms ease-out,
+    opacity 300ms ease-out;
 }
 
 .current-tool-enter {
@@ -274,7 +278,9 @@
   opacity: 0;
   pointer-events: none;
   transform: translateX(-8px) scale(0.98);
-  transition: opacity 160ms ease, transform 200ms ease;
+  transition:
+    opacity 160ms ease,
+    transform 200ms ease;
 }
 
 .quick-access-popout.is-open {
@@ -287,7 +293,8 @@
   background: var(--bg-raised);
   border-radius: 16px;
   border: 1px solid var(--border-default);
-  box-shadow: 0 18px 36px color-mix(in srgb, var(--text-primary) 12%, transparent);
+  box-shadow: 0 18px 36px
+    color-mix(in srgb, var(--text-primary) 12%, transparent);
   overflow: hidden;
   display: flex;
   flex-direction: column;
@@ -438,7 +445,11 @@
 
 .quick-access-popout__input.has-error {
   border-color: var(--color-yellow-400);
-  background: color-mix(in srgb, var(--color-yellow-200) 18%, var(--bg-surface));
+  background: color-mix(
+    in srgb,
+    var(--color-yellow-200) 18%,
+    var(--bg-surface)
+  );
 }
 
 .quick-access-popout__input::placeholder {
@@ -585,7 +596,11 @@
 
 .quick-access-popout__warning {
   margin-top: 0.75rem;
-  background: color-mix(in srgb, var(--color-yellow-100) 35%, var(--bg-surface));
+  background: color-mix(
+    in srgb,
+    var(--color-yellow-100) 35%,
+    var(--bg-surface)
+  );
   border: 1px solid var(--color-yellow-300);
   border-radius: 12px;
   padding: 0.75rem;
@@ -709,13 +724,19 @@
   font-size: 0.78rem;
   font-weight: 500;
   color: var(--text-primary);
-  transition: background 120ms, border-color 120ms;
+  transition:
+    background 120ms,
+    border-color 120ms;
   white-space: nowrap;
 }
 
 .quick-access-popout__quick-sign-btn:hover {
   background: color-mix(in srgb, var(--btn-open-file) 12%, var(--bg-muted));
-  border-color: color-mix(in srgb, var(--btn-open-file) 40%, var(--border-default));
+  border-color: color-mix(
+    in srgb,
+    var(--btn-open-file) 40%,
+    var(--border-default)
+  );
 }
 
 /* Tab navigation */
@@ -736,7 +757,9 @@
   font-size: 0.85rem;
   color: var(--text-muted);
   border-bottom: 2px solid transparent;
-  transition: color 150ms, border-color 150ms;
+  transition:
+    color 150ms,
+    border-color 150ms;
 }
 
 .quick-access-popout__tab-button.active {
@@ -804,17 +827,33 @@
   width: 1.5rem;
   height: 1.5rem;
   padding: 0;
-  background: color-mix(in srgb, var(--accent-interactive, var(--mantine-color-blue-6, #228be6)) 15%, transparent);
-  border: 1px solid color-mix(in srgb, var(--accent-interactive, var(--mantine-color-blue-6, #228be6)) 40%, transparent);
+  background: color-mix(
+    in srgb,
+    var(--accent-interactive, var(--mantine-color-blue-6, #228be6)) 15%,
+    transparent
+  );
+  border: 1px solid
+    color-mix(
+      in srgb,
+      var(--accent-interactive, var(--mantine-color-blue-6, #228be6)) 40%,
+      transparent
+    );
   border-radius: 5px;
   color: var(--accent-interactive, var(--mantine-color-blue-6, #228be6));
   cursor: pointer;
-  transition: background 120ms, border-color 120ms, color 120ms;
+  transition:
+    background 120ms,
+    border-color 120ms,
+    color 120ms;
   flex-shrink: 0;
 }
 
 .quick-access-popout__section-action:hover {
-  background: color-mix(in srgb, var(--accent-interactive, var(--mantine-color-blue-6, #228be6)) 28%, transparent);
+  background: color-mix(
+    in srgb,
+    var(--accent-interactive, var(--mantine-color-blue-6, #228be6)) 28%,
+    transparent
+  );
   border-color: var(--accent-interactive, var(--mantine-color-blue-6, #228be6));
 }
 
@@ -883,7 +922,10 @@
   background: transparent;
   color: var(--text-muted);
   cursor: pointer;
-  transition: background 120ms, border-color 120ms, color 120ms;
+  transition:
+    background 120ms,
+    border-color 120ms,
+    color 120ms;
   white-space: nowrap;
 }
 
@@ -893,7 +935,11 @@
 }
 
 .quick-access-popout__filter-chip.is-active {
-  background: color-mix(in srgb, var(--accent-interactive, var(--mantine-color-blue-6, #228be6)) 15%, transparent);
+  background: color-mix(
+    in srgb,
+    var(--accent-interactive, var(--mantine-color-blue-6, #228be6)) 15%,
+    transparent
+  );
   border-color: var(--accent-interactive, var(--mantine-color-blue-6, #228be6));
   color: var(--accent-interactive, var(--mantine-color-blue-6, #228be6));
   font-weight: 500;
@@ -910,7 +956,8 @@
   min-height: 0;
 }
 
-.quick-access-sign-popout .quick-access-popout__body.sign-tab-requestSignatures {
+.quick-access-sign-popout
+  .quick-access-popout__body.sign-tab-requestSignatures {
   transform: translateX(0%);
 }
 
diff --git a/frontend/src/core/components/shared/quickAccessBar/QuickAccessBar.ts b/frontend/src/core/components/shared/quickAccessBar/QuickAccessBar.ts
index 84658daefb..1d38c26eb0 100644
--- a/frontend/src/core/components/shared/quickAccessBar/QuickAccessBar.ts
+++ b/frontend/src/core/components/shared/quickAccessBar/QuickAccessBar.ts
@@ -1,7 +1,7 @@
-import { ButtonConfig } from '@app/types/sidebar';
+import { ButtonConfig } from "@app/types/sidebar";
 
 // Border radius constants
-export const ROUND_BORDER_RADIUS = '0.5rem';
+export const ROUND_BORDER_RADIUS = "0.5rem";
 
 /**
  * Check if a navigation button is currently active
@@ -12,16 +12,17 @@ export const isNavButtonActive = (
   isFilesModalOpen: boolean,
   configModalOpen: boolean,
   selectedToolKey?: string | null,
-  leftPanelView?: 'toolPicker' | 'toolContent' | 'hidden'
+  leftPanelView?: "toolPicker" | "toolContent" | "hidden",
 ): boolean => {
-  const isActiveByLocalState = config.type === 'navigation' && activeButton === config.id;
+  const isActiveByLocalState =
+    config.type === "navigation" && activeButton === config.id;
   const isActiveByContext =
-    config.type === 'navigation' &&
-    leftPanelView === 'toolContent' &&
+    config.type === "navigation" &&
+    leftPanelView === "toolContent" &&
     selectedToolKey === config.id;
   const isActiveByModal =
-    (config.type === 'modal' && config.id === 'files' && isFilesModalOpen) ||
-    (config.type === 'modal' && config.id === 'config' && configModalOpen);
+    (config.type === "modal" && config.id === "files" && isFilesModalOpen) ||
+    (config.type === "modal" && config.id === "config" && configModalOpen);
 
   return isActiveByLocalState || isActiveByContext || isActiveByModal;
 };
@@ -35,7 +36,7 @@ export const getNavButtonStyle = (
   isFilesModalOpen: boolean,
   configModalOpen: boolean,
   selectedToolKey?: string | null,
-  leftPanelView?: 'toolPicker' | 'toolContent' | 'hidden'
+  leftPanelView?: "toolPicker" | "toolContent" | "hidden",
 ) => {
   const isActive = isNavButtonActive(
     config,
@@ -43,41 +44,40 @@ export const getNavButtonStyle = (
     isFilesModalOpen,
     configModalOpen,
     selectedToolKey,
-    leftPanelView
+    leftPanelView,
   );
 
   if (isActive) {
     return {
       backgroundColor: `var(--icon-${config.id}-bg)`,
       color: `var(--icon-${config.id}-color)`,
-      border: 'none',
+      border: "none",
       borderRadius: ROUND_BORDER_RADIUS,
     };
   }
 
   // Inactive state for all buttons
   return {
-    backgroundColor: 'var(--icon-inactive-bg)',
-    color: 'var(--icon-inactive-color)',
-    border: 'none',
+    backgroundColor: "var(--icon-inactive-bg)",
+    color: "var(--icon-inactive-color)",
+    border: "none",
     borderRadius: ROUND_BORDER_RADIUS,
   };
 };
 
-
 /**
  * Determine the active nav button based on current tool state and registry
  */
 export const getActiveNavButton = (
   selectedToolKey: string | null,
-  readerMode: boolean
+  readerMode: boolean,
 ): string => {
   // Reader mode takes precedence and should highlight the Read nav item
   if (readerMode) {
-    return 'read';
+    return "read";
   }
   // If a tool is selected, highlight it immediately even if the panel view
   // transition to 'toolContent' has not completed yet. This prevents a brief
   // period of no-highlight during rapid navigation.
-    return selectedToolKey ? selectedToolKey : 'tools';
+  return selectedToolKey ? selectedToolKey : "tools";
 };
diff --git a/frontend/src/core/components/shared/quickAccessBar/QuickAccessButton.tsx b/frontend/src/core/components/shared/quickAccessBar/QuickAccessButton.tsx
index 21d63505b0..a047190783 100644
--- a/frontend/src/core/components/shared/quickAccessBar/QuickAccessButton.tsx
+++ b/frontend/src/core/components/shared/quickAccessBar/QuickAccessButton.tsx
@@ -1,6 +1,6 @@
-import React from 'react';
-import { ActionIcon } from '@mantine/core';
-import FitText from '@app/components/shared/FitText';
+import React from "react";
+import { ActionIcon } from "@mantine/core";
+import FitText from "@app/components/shared/FitText";
 
 interface QuickAccessButtonProps {
   icon: React.ReactNode;
@@ -9,12 +9,12 @@ interface QuickAccessButtonProps {
   onClick?: (e: React.MouseEvent) => void;
   href?: string;
   ariaLabel: string;
-  textClassName?: 'button-text' | 'all-tools-text';
+  textClassName?: "button-text" | "all-tools-text";
   backgroundColor?: string;
   color?: string;
-  size?: 'sm' | 'md' | 'lg';
+  size?: "sm" | "md" | "lg";
   className?: string;
-  component?: 'a' | 'button';
+  component?: "a" | "button";
   dataTestId?: string;
   dataTour?: string;
   disabled?: boolean;
@@ -27,31 +27,36 @@ const QuickAccessButton: React.FC<QuickAccessButtonProps> = ({
   onClick,
   href,
   ariaLabel,
-  textClassName = 'button-text',
+  textClassName = "button-text",
   backgroundColor,
   color,
   size,
   className,
-  component = 'button',
+  component = "button",
   dataTestId,
   dataTour,
   disabled = false,
 }) => {
-  const buttonSize = size || (isActive ? 'lg' : 'md');
-  const bgColor = backgroundColor || (isActive ? 'var(--icon-tools-bg)' : 'var(--icon-inactive-bg)');
-  const textColor = color || (isActive ? 'var(--icon-tools-color)' : 'var(--icon-inactive-color)');
+  const buttonSize = size || (isActive ? "lg" : "md");
+  const bgColor =
+    backgroundColor ||
+    (isActive ? "var(--icon-tools-bg)" : "var(--icon-inactive-bg)");
+  const textColor =
+    color ||
+    (isActive ? "var(--icon-tools-color)" : "var(--icon-inactive-color)");
 
-  const actionIconProps = component === 'a' && href
-    ? {
-        component: 'a' as const,
-        href,
-        onClick,
-        'aria-label': ariaLabel,
-      }
-    : {
-        onClick,
-        'aria-label': ariaLabel,
-      };
+  const actionIconProps =
+    component === "a" && href
+      ? {
+          component: "a" as const,
+          href,
+          onClick,
+          "aria-label": ariaLabel,
+        }
+      : {
+          onClick,
+          "aria-label": ariaLabel,
+        };
 
   return (
     <div className="flex flex-col items-center gap-1" data-tour={dataTour}>
@@ -63,28 +68,28 @@ const QuickAccessButton: React.FC<QuickAccessButtonProps> = ({
         style={{
           backgroundColor: bgColor,
           color: textColor,
-          border: 'none',
-          borderRadius: '8px',
-          textDecoration: 'none',
+          border: "none",
+          borderRadius: "8px",
+          textDecoration: "none",
           opacity: disabled ? 0.5 : 1,
-          cursor: disabled ? 'not-allowed' : 'pointer',
+          cursor: disabled ? "not-allowed" : "pointer",
         }}
-        className={className || (isActive ? 'activeIconScale' : '')}
+        className={className || (isActive ? "activeIconScale" : "")}
         data-testid={dataTestId}
       >
         <span className="iconContainer">{icon}</span>
       </ActionIcon>
-      <div style={{ width: '100%' }}>
+      <div style={{ width: "100%" }}>
         <FitText
           as="span"
           text={label}
           lines={2}
           minimumFontScale={0.5}
-          className={`${textClassName} ${isActive ? 'active' : 'inactive'}`}
+          className={`${textClassName} ${isActive ? "active" : "inactive"}`}
           style={{
-            fontSize: '0.75rem',
-            textAlign: 'center',
-            display: 'block',
+            fontSize: "0.75rem",
+            textAlign: "center",
+            display: "block",
           }}
         />
       </div>
diff --git a/frontend/src/core/components/shared/quickAccessBar/useToursTooltip.ts b/frontend/src/core/components/shared/quickAccessBar/useToursTooltip.ts
index bed983fdd7..8d4d7ee0d5 100644
--- a/frontend/src/core/components/shared/quickAccessBar/useToursTooltip.ts
+++ b/frontend/src/core/components/shared/quickAccessBar/useToursTooltip.ts
@@ -1,6 +1,10 @@
-import { useCallback, useEffect, useRef, useState } from 'react';
-import { TOUR_STATE_EVENT, type TourStatePayload } from '@app/constants/events';
-import { isOnboardingCompleted, hasShownToursTooltip, markToursTooltipShown } from '@app/components/onboarding/orchestrator/onboardingStorage';
+import { useCallback, useEffect, useRef, useState } from "react";
+import { TOUR_STATE_EVENT, type TourStatePayload } from "@app/constants/events";
+import {
+  isOnboardingCompleted,
+  hasShownToursTooltip,
+  markToursTooltipShown,
+} from "@app/components/onboarding/orchestrator/onboardingStorage";
 
 export interface ToursTooltipState {
   tooltipOpen: boolean | undefined;
@@ -24,7 +28,7 @@ export function useToursTooltip(): ToursTooltipState {
 
   // Auto-show when a tour ends (fires once per user)
   useEffect(() => {
-    if (typeof window === 'undefined') return;
+    if (typeof window === "undefined") return;
 
     const handleTourStateChange = (event: Event) => {
       const { detail } = event as CustomEvent<TourStatePayload>;
@@ -37,7 +41,8 @@ export function useToursTooltip(): ToursTooltipState {
     };
 
     window.addEventListener(TOUR_STATE_EVENT, handleTourStateChange);
-    return () => window.removeEventListener(TOUR_STATE_EVENT, handleTourStateChange);
+    return () =>
+      window.removeEventListener(TOUR_STATE_EVENT, handleTourStateChange);
   }, []);
 
   // Show once after onboarding is complete
@@ -64,10 +69,14 @@ export function useToursTooltip(): ToursTooltipState {
         setShowToursTooltip(true);
       }
     },
-    [hasBeenDismissed, toursMenuOpen, handleDismissToursTooltip]
+    [hasBeenDismissed, toursMenuOpen, handleDismissToursTooltip],
   );
 
-  const tooltipOpen = toursMenuOpen ? false : hasBeenDismissed ? undefined : showToursTooltip;
+  const tooltipOpen = toursMenuOpen
+    ? false
+    : hasBeenDismissed
+      ? undefined
+      : showToursTooltip;
 
   return {
     tooltipOpen,
@@ -78,4 +87,3 @@ export function useToursTooltip(): ToursTooltipState {
     handleTooltipOpenChange,
   };
 }
-
diff --git a/frontend/src/core/components/shared/rightRail/RightRail.css b/frontend/src/core/components/shared/rightRail/RightRail.css
index e87cb323d6..f8fd76b35d 100644
--- a/frontend/src/core/components/shared/rightRail/RightRail.css
+++ b/frontend/src/core/components/shared/rightRail/RightRail.css
@@ -97,7 +97,9 @@
   overflow: hidden;
   max-height: 0;
   opacity: 0;
-  transition: max-height 450ms ease-out, opacity 300ms ease-out;
+  transition:
+    max-height 450ms ease-out,
+    opacity 300ms ease-out;
 }
 
 .right-rail-enter {
diff --git a/frontend/src/core/components/shared/rightRail/ViewerAnnotationControls.tsx b/frontend/src/core/components/shared/rightRail/ViewerAnnotationControls.tsx
index 23b7dfa821..c0383a58c4 100644
--- a/frontend/src/core/components/shared/rightRail/ViewerAnnotationControls.tsx
+++ b/frontend/src/core/components/shared/rightRail/ViewerAnnotationControls.tsx
@@ -1,30 +1,41 @@
-import React, { useCallback } from 'react';
-import { ActionIcon } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import LocalIcon from '@app/components/shared/LocalIcon';
-import { Tooltip } from '@app/components/shared/Tooltip';
-import { ViewerContext } from '@app/contexts/ViewerContext';
-import { useSignature } from '@app/contexts/SignatureContext';
-import { useFileState, useFileContext } from '@app/contexts/FileContext';
-import { createStirlingFilesAndStubs } from '@app/services/fileStubHelpers';
-import { useNavigationState, useNavigationGuard, useNavigationActions } from '@app/contexts/NavigationContext';
-import { useSidebarContext } from '@app/contexts/SidebarContext';
-import { useToolWorkflow } from '@app/contexts/ToolWorkflowContext';
-import { useRightRailTooltipSide } from '@app/hooks/useRightRailTooltipSide';
-import { useRedactionMode, useRedaction } from '@app/contexts/RedactionContext';
-import { defaultParameters, RedactParameters } from '@app/hooks/tools/redact/useRedactParameters';
-import { RedactionMode } from '@embedpdf/plugin-redaction';
+import React, { useCallback } from "react";
+import { ActionIcon } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import LocalIcon from "@app/components/shared/LocalIcon";
+import { Tooltip } from "@app/components/shared/Tooltip";
+import { ViewerContext } from "@app/contexts/ViewerContext";
+import { useSignature } from "@app/contexts/SignatureContext";
+import { useFileState, useFileContext } from "@app/contexts/FileContext";
+import { createStirlingFilesAndStubs } from "@app/services/fileStubHelpers";
+import {
+  useNavigationState,
+  useNavigationGuard,
+  useNavigationActions,
+} from "@app/contexts/NavigationContext";
+import { useSidebarContext } from "@app/contexts/SidebarContext";
+import { useToolWorkflow } from "@app/contexts/ToolWorkflowContext";
+import { useRightRailTooltipSide } from "@app/hooks/useRightRailTooltipSide";
+import { useRedactionMode, useRedaction } from "@app/contexts/RedactionContext";
+import {
+  defaultParameters,
+  RedactParameters,
+} from "@app/hooks/tools/redact/useRedactParameters";
+import { RedactionMode } from "@embedpdf/plugin-redaction";
 
 interface ViewerAnnotationControlsProps {
   currentView: string;
   disabled?: boolean;
 }
 
-export default function ViewerAnnotationControls({ currentView, disabled = false }: ViewerAnnotationControlsProps) {
+export default function ViewerAnnotationControls({
+  currentView,
+  disabled = false,
+}: ViewerAnnotationControlsProps) {
   const { t } = useTranslation();
   const { sidebarRefs } = useSidebarContext();
   const { setLeftPanelView, setSidebarsVisible } = useToolWorkflow();
-  const { position: tooltipPosition, offset: tooltipOffset } = useRightRailTooltipSide(sidebarRefs);
+  const { position: tooltipPosition, offset: tooltipOffset } =
+    useRightRailTooltipSide(sidebarRefs);
 
   // Viewer context for PDF controls - safely handle when not available
   const viewerContext = React.useContext(ViewerContext);
@@ -40,49 +51,77 @@ export default function ViewerAnnotationControls({ currentView, disabled = false
   // Check if we're in sign mode or redaction mode
   const { selectedTool } = useNavigationState();
   const { actions: navActions } = useNavigationActions();
-  const isSignMode = selectedTool === 'sign';
-  const isRedactMode = selectedTool === 'redact';
+  const isSignMode = selectedTool === "sign";
+  const isRedactMode = selectedTool === "redact";
 
   // Get redaction pending state and navigation guard
   const { isRedacting: _isRedacting } = useRedactionMode();
-  const { requestNavigation, setHasUnsavedChanges, hasUnsavedChanges } = useNavigationGuard();
-  const { setRedactionMode, activateRedact, setRedactionConfig, setRedactionsApplied, redactionApiRef, setActiveType } = useRedaction();
-
+  const { requestNavigation, setHasUnsavedChanges, hasUnsavedChanges } =
+    useNavigationGuard();
+  const {
+    setRedactionMode,
+    activateRedact,
+    setRedactionConfig,
+    setRedactionsApplied,
+    redactionApiRef,
+    setActiveType,
+  } = useRedaction();
 
   // Check if we're in any annotation tool that should disable the toggle
-  const isInAnnotationTool = selectedTool === 'annotate' || selectedTool === 'sign' || selectedTool === 'addImage' || selectedTool === 'addText';
+  const isInAnnotationTool =
+    selectedTool === "annotate" ||
+    selectedTool === "sign" ||
+    selectedTool === "addImage" ||
+    selectedTool === "addText";
 
   // Check if we're on annotate tool to highlight the button
-  const isAnnotateActive = selectedTool === 'annotate';
-  const annotationsHidden = viewerContext ? !viewerContext.isAnnotationsVisible : false;
+  const isAnnotateActive = selectedTool === "annotate";
+  const annotationsHidden = viewerContext
+    ? !viewerContext.isAnnotationsVisible
+    : false;
 
   // Persist annotations to file if there are unsaved changes
   const saveAnnotationsIfNeeded = async () => {
-    if (!viewerContext?.exportActions?.saveAsCopy || currentView !== 'viewer' || !historyApiRef?.current?.canUndo()) return;
+    if (
+      !viewerContext?.exportActions?.saveAsCopy ||
+      currentView !== "viewer" ||
+      !historyApiRef?.current?.canUndo()
+    )
+      return;
     if (activeFiles.length === 0 || state.files.ids.length === 0) return;
 
     try {
       const arrayBuffer = await viewerContext.exportActions.saveAsCopy();
       if (!arrayBuffer) return;
 
-      const file = new File([new Blob([arrayBuffer])], activeFiles[0].name, { type: 'application/pdf' });
+      const file = new File([new Blob([arrayBuffer])], activeFiles[0].name, {
+        type: "application/pdf",
+      });
       const parentStub = selectors.getStirlingFileStub(state.files.ids[0]);
       if (!parentStub) return;
 
-      const { stirlingFiles, stubs } = await createStirlingFilesAndStubs([file], parentStub, 'redact');
-      await fileActions.consumeFiles([state.files.ids[0]], stirlingFiles, stubs);
+      const { stirlingFiles, stubs } = await createStirlingFilesAndStubs(
+        [file],
+        parentStub,
+        "redact",
+      );
+      await fileActions.consumeFiles(
+        [state.files.ids[0]],
+        stirlingFiles,
+        stubs,
+      );
 
       // Clear unsaved changes flags after successful save
       setHasUnsavedChanges(false);
       setRedactionsApplied(false);
     } catch (error) {
-      console.error('Error auto-saving annotations before redaction:', error);
+      console.error("Error auto-saving annotations before redaction:", error);
     }
   };
 
   const exitRedactionMode = useCallback(() => {
-    navActions.setToolAndWorkbench(null, 'viewer');
-    setLeftPanelView('toolPicker');
+    navActions.setToolAndWorkbench(null, "viewer");
+    setLeftPanelView("toolPicker");
     setRedactionMode(false);
     setActiveType(null);
   }, [navActions, setLeftPanelView, setRedactionMode, setActiveType]);
@@ -102,16 +141,16 @@ export default function ViewerAnnotationControls({ currentView, disabled = false
         // Set redaction config to manual mode when opening from viewer
         const manualConfig: RedactParameters = {
           ...defaultParameters,
-          mode: 'manual',
+          mode: "manual",
         };
         setRedactionConfig(manualConfig);
 
         // Set tool and keep viewer workbench
-        navActions.setToolAndWorkbench('redact', 'viewer');
+        navActions.setToolAndWorkbench("redact", "viewer");
 
         // Ensure sidebars are visible and open tool content
         setSidebarsVisible(true);
-        setLeftPanelView('toolContent');
+        setLeftPanelView("toolContent");
 
         setRedactionMode(true);
         // Activate unified redact mode after a short delay
@@ -149,14 +188,24 @@ export default function ViewerAnnotationControls({ currentView, disabled = false
   return (
     <>
       {/* Redaction Mode Toggle */}
-      <Tooltip content={isRedactMode ? t('rightRail.exitRedaction', 'Exit Redaction Mode') : t('rightRail.redact', 'Redact')} position={tooltipPosition} offset={tooltipOffset} arrow portalTarget={document.body}>
+      <Tooltip
+        content={
+          isRedactMode
+            ? t("rightRail.exitRedaction", "Exit Redaction Mode")
+            : t("rightRail.redact", "Redact")
+        }
+        position={tooltipPosition}
+        offset={tooltipOffset}
+        arrow
+        portalTarget={document.body}
+      >
         <ActionIcon
-          variant={isRedactMode ? 'filled' : 'subtle'}
-          color={isRedactMode ? 'blue' : undefined}
+          variant={isRedactMode ? "filled" : "subtle"}
+          color={isRedactMode ? "blue" : undefined}
           radius="md"
           className="right-rail-icon"
           onClick={handleRedactionToggle}
-          disabled={disabled || currentView !== 'viewer'}
+          disabled={disabled || currentView !== "viewer"}
         >
           <LocalIcon
             icon="scan-delete-rounded"
@@ -167,25 +216,42 @@ export default function ViewerAnnotationControls({ currentView, disabled = false
       </Tooltip>
 
       {/* Annotation Visibility Toggle */}
-      <Tooltip content={t('rightRail.toggleAnnotations', 'Toggle Annotations Visibility')} position={tooltipPosition} offset={tooltipOffset} arrow portalTarget={document.body}>
+      <Tooltip
+        content={t(
+          "rightRail.toggleAnnotations",
+          "Toggle Annotations Visibility",
+        )}
+        position={tooltipPosition}
+        offset={tooltipOffset}
+        arrow
+        portalTarget={document.body}
+      >
         <ActionIcon
           variant={annotationsHidden ? "filled" : "subtle"}
           color={annotationsHidden ? "blue" : undefined}
           radius="md"
           className="right-rail-icon"
           onClick={handleToggleAnnotationsVisibility}
-          disabled={disabled || currentView !== 'viewer' || (isInAnnotationTool && !isAnnotateActive) || isPlacementMode}
-          data-active={annotationsHidden ? 'true' : undefined}
+          disabled={
+            disabled ||
+            currentView !== "viewer" ||
+            (isInAnnotationTool && !isAnnotateActive) ||
+            isPlacementMode
+          }
+          data-active={annotationsHidden ? "true" : undefined}
           aria-pressed={annotationsHidden}
         >
           <LocalIcon
-            icon={viewerContext?.isAnnotationsVisible ? "visibility" : "preview-off-rounded"}
+            icon={
+              viewerContext?.isAnnotationsVisible
+                ? "visibility"
+                : "preview-off-rounded"
+            }
             width="1.5rem"
             height="1.5rem"
           />
         </ActionIcon>
       </Tooltip>
-
     </>
   );
 }
diff --git a/frontend/src/core/components/shared/signing/ActiveSessionsPanel.tsx b/frontend/src/core/components/shared/signing/ActiveSessionsPanel.tsx
index d3294f4b7a..d0d2ed75a4 100644
--- a/frontend/src/core/components/shared/signing/ActiveSessionsPanel.tsx
+++ b/frontend/src/core/components/shared/signing/ActiveSessionsPanel.tsx
@@ -1,8 +1,8 @@
-import { useTranslation } from 'react-i18next';
-import { Loader, Center, Text, Badge } from '@mantine/core';
+import { useTranslation } from "react-i18next";
+import { Loader, Center, Text, Badge } from "@mantine/core";
 
 interface SessionItem {
-  itemType: 'signRequest' | 'mySession';
+  itemType: "signRequest" | "mySession";
   sessionId: string;
   documentName: string;
   createdAt: string;
@@ -28,54 +28,62 @@ const ActiveSessionsPanel = ({
 }: ActiveSessionsPanelProps) => {
   const { t } = useTranslation();
 
-  const getStatusColor = (status?: string, itemType?: string, item?: SessionItem): string => {
-    if (itemType === 'mySession' && item) {
+  const getStatusColor = (
+    status?: string,
+    itemType?: string,
+    item?: SessionItem,
+  ): string => {
+    if (itemType === "mySession" && item) {
       const signedCount = item.signedCount ?? 0;
       const totalCount = item.participantCount ?? 0;
 
       if (signedCount === totalCount && totalCount > 0) {
-        return 'green';  // All signed
+        return "green"; // All signed
       }
       if (signedCount > 0) {
-        return 'yellow'; // Partial
+        return "yellow"; // Partial
       }
-      return 'blue';     // None signed
+      return "blue"; // None signed
     }
     switch (status) {
-      case 'VIEWED':
-        return 'blue';
-      case 'NOTIFIED':
-      case 'PENDING':
-        return 'orange';
+      case "VIEWED":
+        return "blue";
+      case "NOTIFIED":
+      case "PENDING":
+        return "orange";
       default:
-        return 'gray';
+        return "gray";
     }
   };
 
   const getStatusLabel = (item: SessionItem): string => {
-    if (item.itemType === 'mySession') {
+    if (item.itemType === "mySession") {
       const signedCount = item.signedCount ?? 0;
       const totalCount = item.participantCount ?? 0;
       if (signedCount === totalCount && totalCount > 0) {
-        return t('certSign.readyToFinalize', 'Ready to finalize');
+        return t("certSign.readyToFinalize", "Ready to finalize");
       }
       // Show progress for all cases (including 0/X)
       if (totalCount > 0) {
-        return t('certSign.signatureProgress', '{{signedCount}}/{{totalCount}} signatures', { signedCount, totalCount });
+        return t(
+          "certSign.signatureProgress",
+          "{{signedCount}}/{{totalCount}} signatures",
+          { signedCount, totalCount },
+        );
       }
-      return t('certSign.awaitingSignatures', 'Awaiting signatures');
+      return t("certSign.awaitingSignatures", "Awaiting signatures");
     }
 
     // For sign requests
     switch (item.myStatus) {
-      case 'VIEWED':
-        return t('certSign.viewed', 'Viewed');
-      case 'NOTIFIED':
-        return t('certSign.notified', 'Pending');
-      case 'PENDING':
-        return t('certSign.pending', 'Pending');
+      case "VIEWED":
+        return t("certSign.viewed", "Viewed");
+      case "NOTIFIED":
+        return t("certSign.notified", "Pending");
+      case "PENDING":
+        return t("certSign.pending", "Pending");
       default:
-        return item.myStatus || 'PENDING';
+        return item.myStatus || "PENDING";
     }
   };
 
@@ -90,7 +98,10 @@ const ActiveSessionsPanel = ({
           {sessions.length === 0 ? (
             <div className="quick-access-popout__section">
               <Text size="sm" c="dimmed" ta="center" py="xl">
-                {t('quickAccess.noActiveSessions', 'No pending sign requests or active sessions')}
+                {t(
+                  "quickAccess.noActiveSessions",
+                  "No pending sign requests or active sessions",
+                )}
               </Text>
             </div>
           ) : (
@@ -102,16 +113,20 @@ const ActiveSessionsPanel = ({
                   onClick={() => onSessionClick(session)}
                 >
                   <div className="quick-access-popout__sign-request-info">
-                    <div className="quick-access-popout__row-title">{session.documentName}</div>
+                    <div className="quick-access-popout__row-title">
+                      {session.documentName}
+                    </div>
                     <div className="quick-access-popout__row-subtitle">
-                      {session.itemType === 'signRequest' ? (
+                      {session.itemType === "signRequest" ? (
                         <>
                           From: {session.ownerUsername}
-                          {session.dueDate && ` • Due: ${new Date(session.dueDate).toLocaleDateString()}`}
+                          {session.dueDate &&
+                            ` • Due: ${new Date(session.dueDate).toLocaleDateString()}`}
                         </>
                       ) : (
                         <>
-                          Created: {new Date(session.createdAt).toLocaleDateString()}
+                          Created:{" "}
+                          {new Date(session.createdAt).toLocaleDateString()}
                           {session.signedCount !== undefined &&
                             session.participantCount !== undefined &&
                             ` • ${session.signedCount}/${session.participantCount} signed`}
@@ -120,7 +135,14 @@ const ActiveSessionsPanel = ({
                     </div>
                   </div>
                   <div className="quick-access-popout__sign-request-badge">
-                    <Badge size="sm" color={getStatusColor(session.myStatus, session.itemType, session)}>
+                    <Badge
+                      size="sm"
+                      color={getStatusColor(
+                        session.myStatus,
+                        session.itemType,
+                        session,
+                      )}
+                    >
                       {getStatusLabel(session)}
                     </Badge>
                   </div>
@@ -128,7 +150,6 @@ const ActiveSessionsPanel = ({
               ))}
             </>
           )}
-
         </>
       )}
     </div>
diff --git a/frontend/src/core/components/shared/signing/CompletedSessionsPanel.tsx b/frontend/src/core/components/shared/signing/CompletedSessionsPanel.tsx
index 763a8c2be9..02036277ae 100644
--- a/frontend/src/core/components/shared/signing/CompletedSessionsPanel.tsx
+++ b/frontend/src/core/components/shared/signing/CompletedSessionsPanel.tsx
@@ -1,8 +1,8 @@
-import { useTranslation } from 'react-i18next';
-import { Loader, Center, Text, Badge } from '@mantine/core';
+import { useTranslation } from "react-i18next";
+import { Loader, Center, Text, Badge } from "@mantine/core";
 
 interface SessionItem {
-  itemType: 'signRequest' | 'mySession';
+  itemType: "signRequest" | "mySession";
   sessionId: string;
   documentName: string;
   createdAt: string;
@@ -29,30 +29,30 @@ const CompletedSessionsPanel = ({
   const { t } = useTranslation();
 
   const getStatusColor = (status?: string, itemType?: string): string => {
-    if (itemType === 'mySession') return 'green';
+    if (itemType === "mySession") return "green";
     switch (status) {
-      case 'SIGNED':
-        return 'green';
-      case 'DECLINED':
-        return 'red';
+      case "SIGNED":
+        return "green";
+      case "DECLINED":
+        return "red";
       default:
-        return 'gray';
+        return "gray";
     }
   };
 
   const getStatusLabel = (item: SessionItem): string => {
-    if (item.itemType === 'mySession') {
-      return t('certSign.finalized', 'Finalized');
+    if (item.itemType === "mySession") {
+      return t("certSign.finalized", "Finalized");
     }
 
     // For sign requests
     switch (item.myStatus) {
-      case 'SIGNED':
-        return t('certSign.signed', 'Signed');
-      case 'DECLINED':
-        return t('certSign.declined', 'Declined');
+      case "SIGNED":
+        return t("certSign.signed", "Signed");
+      case "DECLINED":
+        return t("certSign.declined", "Declined");
       default:
-        return item.myStatus || 'COMPLETED';
+        return item.myStatus || "COMPLETED";
     }
   };
 
@@ -65,7 +65,7 @@ const CompletedSessionsPanel = ({
       ) : sessions.length === 0 ? (
         <div className="quick-access-popout__section">
           <Text size="sm" c="dimmed" ta="center" py="xl">
-            {t('quickAccess.noCompletedSessions', 'No completed sessions')}
+            {t("quickAccess.noCompletedSessions", "No completed sessions")}
           </Text>
         </div>
       ) : (
@@ -77,16 +77,20 @@ const CompletedSessionsPanel = ({
               onClick={() => onSessionClick(session)}
             >
               <div className="quick-access-popout__sign-request-info">
-                <div className="quick-access-popout__row-title">{session.documentName}</div>
+                <div className="quick-access-popout__row-title">
+                  {session.documentName}
+                </div>
                 <div className="quick-access-popout__row-subtitle">
-                  {session.itemType === 'signRequest' ? (
+                  {session.itemType === "signRequest" ? (
                     <>
                       From: {session.ownerUsername}
-                      {session.dueDate && ` • Due: ${new Date(session.dueDate).toLocaleDateString()}`}
+                      {session.dueDate &&
+                        ` • Due: ${new Date(session.dueDate).toLocaleDateString()}`}
                     </>
                   ) : (
                     <>
-                      Created: {new Date(session.createdAt).toLocaleDateString()}
+                      Created:{" "}
+                      {new Date(session.createdAt).toLocaleDateString()}
                       {session.signedCount !== undefined &&
                         session.participantCount !== undefined &&
                         ` • ${session.signedCount}/${session.participantCount} signed`}
@@ -95,7 +99,10 @@ const CompletedSessionsPanel = ({
                 </div>
               </div>
               <div className="quick-access-popout__sign-request-badge">
-                <Badge size="sm" color={getStatusColor(session.myStatus, session.itemType)}>
+                <Badge
+                  size="sm"
+                  color={getStatusColor(session.myStatus, session.itemType)}
+                >
                   {getStatusLabel(session)}
                 </Badge>
               </div>
diff --git a/frontend/src/core/components/shared/signing/CreateSessionFlow.tsx b/frontend/src/core/components/shared/signing/CreateSessionFlow.tsx
index 6643e1d10c..a2042ea01d 100644
--- a/frontend/src/core/components/shared/signing/CreateSessionFlow.tsx
+++ b/frontend/src/core/components/shared/signing/CreateSessionFlow.tsx
@@ -1,15 +1,15 @@
-import { useState } from 'react';
-import { Stack, Text, Group, Badge } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import CheckIcon from '@mui/icons-material/Check';
-import { SelectDocumentStep } from '@app/components/shared/signing/steps/SelectDocumentStep';
-import { SelectParticipantsStep } from '@app/components/shared/signing/steps/SelectParticipantsStep';
-import { ConfigureSignatureDefaultsStep } from '@app/components/shared/signing/steps/ConfigureSignatureDefaultsStep';
-import { ReviewSessionStep } from '@app/components/shared/signing/steps/ReviewSessionStep';
-import { useGroupSigningTips } from '@app/components/tooltips/useGroupSigningTips';
-import { useSignatureSettingsTips } from '@app/components/tooltips/useSignatureSettingsTips';
-import type { SignatureSettings } from '@app/components/tools/certSign/SignatureSettingsInput';
-import type { FileState } from '@app/types/file';
+import { useState } from "react";
+import { Stack, Text, Group, Badge } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import CheckIcon from "@mui/icons-material/Check";
+import { SelectDocumentStep } from "@app/components/shared/signing/steps/SelectDocumentStep";
+import { SelectParticipantsStep } from "@app/components/shared/signing/steps/SelectParticipantsStep";
+import { ConfigureSignatureDefaultsStep } from "@app/components/shared/signing/steps/ConfigureSignatureDefaultsStep";
+import { ReviewSessionStep } from "@app/components/shared/signing/steps/ReviewSessionStep";
+import { useGroupSigningTips } from "@app/components/tooltips/useGroupSigningTips";
+import { useSignatureSettingsTips } from "@app/components/tooltips/useSignatureSettingsTips";
+import type { SignatureSettings } from "@app/components/tools/certSign/SignatureSettingsInput";
+import type { FileState } from "@app/types/file";
 
 interface CreateSessionFlowProps {
   selectedFiles: FileState[];
@@ -41,43 +41,43 @@ const StepWrapper: React.FC<StepWrapperProps> = ({
   return (
     <div
       style={{
-        padding: '16px',
+        padding: "16px",
         border: isActive
-          ? '2px solid var(--mantine-color-blue-6)'
-          : '1px solid var(--mantine-color-default-border)',
-        borderRadius: 'var(--mantine-radius-default)',
+          ? "2px solid var(--mantine-color-blue-6)"
+          : "1px solid var(--mantine-color-default-border)",
+        borderRadius: "var(--mantine-radius-default)",
         backgroundColor: isActive
-          ? 'var(--mantine-color-blue-0)'
+          ? "var(--mantine-color-blue-0)"
           : isCompleted
-          ? 'var(--mantine-color-gray-0)'
-          : 'transparent',
+            ? "var(--mantine-color-gray-0)"
+            : "transparent",
         opacity: !isActive && !isCompleted ? 0.6 : 1,
       }}
     >
-      <Group gap="sm" mb={isActive ? 'md' : 0}>
+      <Group gap="sm" mb={isActive ? "md" : 0}>
         <div
           style={{
-            width: '32px',
-            height: '32px',
-            borderRadius: '50%',
-            display: 'flex',
-            alignItems: 'center',
-            justifyContent: 'center',
+            width: "32px",
+            height: "32px",
+            borderRadius: "50%",
+            display: "flex",
+            alignItems: "center",
+            justifyContent: "center",
             backgroundColor: isCompleted
-              ? 'var(--mantine-color-green-6)'
+              ? "var(--mantine-color-green-6)"
               : isActive
-              ? 'var(--mantine-color-blue-6)'
-              : 'var(--mantine-color-gray-4)',
-            color: 'white',
+                ? "var(--mantine-color-blue-6)"
+                : "var(--mantine-color-gray-4)",
+            color: "white",
             fontWeight: 600,
-            fontSize: '14px',
+            fontSize: "14px",
           }}
         >
           {isCompleted ? <CheckIcon sx={{ fontSize: 18 }} /> : number}
         </div>
         <div style={{ flex: 1 }}>
           <Text size="sm" fw={600}>
-            {t('groupSigning.steps.stepLabel', 'Step {{number}}', { number })}
+            {t("groupSigning.steps.stepLabel", "Step {{number}}", { number })}
           </Text>
           <Text size="sm" c="dimmed">
             {title}
@@ -85,12 +85,12 @@ const StepWrapper: React.FC<StepWrapperProps> = ({
         </div>
         {isActive && (
           <Badge color="blue" variant="light">
-            {t('groupSigning.steps.current', 'Current')}
+            {t("groupSigning.steps.current", "Current")}
           </Badge>
         )}
         {isCompleted && (
           <Badge color="green" variant="light">
-            {t('groupSigning.steps.completed', 'Completed')}
+            {t("groupSigning.steps.completed", "Completed")}
           </Badge>
         )}
       </Group>
@@ -113,14 +113,16 @@ export const CreateSessionFlow: React.FC<CreateSessionFlowProps> = ({
   const [currentStep, setCurrentStep] = useState(1);
 
   // Signature settings state
-  const [signatureSettings, setSignatureSettings] = useState<SignatureSettings>({
-    showSignature: false,
-    pageNumber: 1,
-    reason: '',
-    location: '',
-    showLogo: false,
-    includeSummaryPage: false,
-  });
+  const [signatureSettings, setSignatureSettings] = useState<SignatureSettings>(
+    {
+      showSignature: false,
+      pageNumber: 1,
+      reason: "",
+      location: "",
+      showLogo: false,
+      includeSummaryPage: false,
+    },
+  );
 
   const groupSigningTips = useGroupSigningTips();
   const signatureSettingsTips = useSignatureSettingsTips();
@@ -131,22 +133,28 @@ export const CreateSessionFlow: React.FC<CreateSessionFlowProps> = ({
   const steps = [
     {
       number: 1,
-      title: t('groupSigning.steps.selectDocument.title', 'Select Document'),
+      title: t("groupSigning.steps.selectDocument.title", "Select Document"),
       tooltip: groupSigningTips,
     },
     {
       number: 2,
-      title: t('groupSigning.steps.selectParticipants.title', 'Choose Participants'),
+      title: t(
+        "groupSigning.steps.selectParticipants.title",
+        "Choose Participants",
+      ),
       tooltip: null,
     },
     {
       number: 3,
-      title: t('groupSigning.steps.configureDefaults.title', 'Configure Signature Settings'),
+      title: t(
+        "groupSigning.steps.configureDefaults.title",
+        "Configure Signature Settings",
+      ),
       tooltip: signatureSettingsTips,
     },
     {
       number: 4,
-      title: t('groupSigning.steps.review.titleShort', 'Review & Send'),
+      title: t("groupSigning.steps.review.titleShort", "Review & Send"),
       tooltip: null,
     },
   ];
@@ -167,11 +175,11 @@ export const CreateSessionFlow: React.FC<CreateSessionFlowProps> = ({
               onNext={() => setCurrentStep(2)}
             />
           ) : (
-            <div style={{ padding: '12px 0' }}>
+            <div style={{ padding: "12px 0" }}>
               <Text size="sm" c="dimmed" ta="center">
                 {t(
-                  'groupSigning.steps.selectDocument.noFile',
-                  'Please select a single PDF file from your active files to create a signing session.'
+                  "groupSigning.steps.selectDocument.noFile",
+                  "Please select a single PDF file from your active files to create a signing session.",
                 )}
               </Text>
             </div>
diff --git a/frontend/src/core/components/shared/signing/CreateSessionPanel.tsx b/frontend/src/core/components/shared/signing/CreateSessionPanel.tsx
index cdad4b6352..671de36b72 100644
--- a/frontend/src/core/components/shared/signing/CreateSessionPanel.tsx
+++ b/frontend/src/core/components/shared/signing/CreateSessionPanel.tsx
@@ -1,7 +1,7 @@
-import { useTranslation } from 'react-i18next';
-import { Text, Switch } from '@mantine/core';
-import UserSelector from '@app/components/shared/UserSelector';
-import type { FileState } from '@app/types/file';
+import { useTranslation } from "react-i18next";
+import { Text, Switch } from "@mantine/core";
+import UserSelector from "@app/components/shared/UserSelector";
+import type { FileState } from "@app/types/file";
 
 interface CreateSessionPanelProps {
   selectedFiles: FileState[];
@@ -33,31 +33,44 @@ const CreateSessionPanel = ({
       {!hasValidFile ? (
         <div className="quick-access-popout__section">
           <Text size="sm" c="dimmed" ta="center" py="xl">
-            {t('quickAccess.selectSingleFileToRequest', 'Select a single PDF file to request signatures')}
+            {t(
+              "quickAccess.selectSingleFileToRequest",
+              "Select a single PDF file to request signatures",
+            )}
           </Text>
         </div>
       ) : (
         <>
           <div className="quick-access-popout__section">
-            <div className="quick-access-popout__label">{t('quickAccess.selectedFile', 'Selected file')}</div>
+            <div className="quick-access-popout__label">
+              {t("quickAccess.selectedFile", "Selected file")}
+            </div>
             <div className="quick-access-popout__row-title">
-              {selectedFiles[0]?.name || t('quickAccess.noFile', 'No file selected')}
+              {selectedFiles[0]?.name ||
+                t("quickAccess.noFile", "No file selected")}
             </div>
           </div>
 
           <div className="quick-access-popout__section">
-            <div className="quick-access-popout__label">{t('quickAccess.selectUsers', 'Select users to sign')}</div>
+            <div className="quick-access-popout__label">
+              {t("quickAccess.selectUsers", "Select users to sign")}
+            </div>
             <UserSelector
               value={selectedUserIds}
               onChange={onSelectedUserIdsChange}
               size="xs"
-              placeholder={t('quickAccess.selectUsersPlaceholder', 'Choose participants...')}
+              placeholder={t(
+                "quickAccess.selectUsersPlaceholder",
+                "Choose participants...",
+              )}
               disabled={creating}
             />
           </div>
 
           <div className="quick-access-popout__section">
-            <div className="quick-access-popout__label">{t('quickAccess.dueDate', 'Due date (optional)')}</div>
+            <div className="quick-access-popout__label">
+              {t("quickAccess.dueDate", "Due date (optional)")}
+            </div>
             <input
               type="date"
               className="quick-access-popout__input"
@@ -69,10 +82,18 @@ const CreateSessionPanel = ({
 
           <div className="quick-access-popout__section">
             <Switch
-              label={t('certSign.collab.sessionCreation.includeSummaryPage', 'Include Signature Summary Page')}
-              description={t('certSign.collab.sessionCreation.includeSummaryPageHelp', 'Add a summary page at the end with all signature details')}
+              label={t(
+                "certSign.collab.sessionCreation.includeSummaryPage",
+                "Include Signature Summary Page",
+              )}
+              description={t(
+                "certSign.collab.sessionCreation.includeSummaryPageHelp",
+                "Add a summary page at the end with all signature details",
+              )}
               checked={includeSummaryPage}
-              onChange={(e) => onIncludeSummaryPageChange(e.currentTarget.checked)}
+              onChange={(e) =>
+                onIncludeSummaryPageChange(e.currentTarget.checked)
+              }
               disabled={creating}
               size="sm"
             />
diff --git a/frontend/src/core/components/shared/signing/SignPopout.tsx b/frontend/src/core/components/shared/signing/SignPopout.tsx
index 8179638b08..51de3b4f05 100644
--- a/frontend/src/core/components/shared/signing/SignPopout.tsx
+++ b/frontend/src/core/components/shared/signing/SignPopout.tsx
@@ -1,37 +1,51 @@
-import { useState, useEffect, useCallback, useRef } from 'react';
-import { createPortal } from 'react-dom';
-import { useTranslation } from 'react-i18next';
-import { Drawer } from '@mantine/core';
-import { useIsPhone } from '@app/hooks/useIsMobile';
-import LocalIcon from '@app/components/shared/LocalIcon';
-import ActiveSessionsPanel from '@app/components/shared/signing/ActiveSessionsPanel';
-import CompletedSessionsPanel from '@app/components/shared/signing/CompletedSessionsPanel';
-import CreateSessionPanel from '@app/components/shared/signing/CreateSessionPanel';
-import apiClient from '@app/services/apiClient';
-import { alert } from '@app/components/toast';
-import { SignRequestSummary, SignRequestDetail, SessionSummary, SessionDetail } from '@app/types/signingSession';
-import { useToolWorkflow } from '@app/contexts/ToolWorkflowContext';
-import { useNavigationActions, useNavigationState } from '@app/contexts/NavigationContext';
-import { useFileSelection } from '@app/contexts/file/fileHooks';
-import { fileStorage } from '@app/services/fileStorage';
-import { useFileActions } from '@app/contexts/FileContext';
-import SignRequestWorkbenchView from '@app/components/tools/certSign/SignRequestWorkbenchView';
-import SessionDetailWorkbenchView from '@app/components/tools/certSign/SessionDetailWorkbenchView';
-import { Z_INDEX_OVER_FULLSCREEN_SURFACE } from '@app/styles/zIndex';
+import { useState, useEffect, useCallback, useRef } from "react";
+import { createPortal } from "react-dom";
+import { useTranslation } from "react-i18next";
+import { Drawer } from "@mantine/core";
+import { useIsPhone } from "@app/hooks/useIsMobile";
+import LocalIcon from "@app/components/shared/LocalIcon";
+import ActiveSessionsPanel from "@app/components/shared/signing/ActiveSessionsPanel";
+import CompletedSessionsPanel from "@app/components/shared/signing/CompletedSessionsPanel";
+import CreateSessionPanel from "@app/components/shared/signing/CreateSessionPanel";
+import apiClient from "@app/services/apiClient";
+import { alert } from "@app/components/toast";
+import {
+  SignRequestSummary,
+  SignRequestDetail,
+  SessionSummary,
+  SessionDetail,
+} from "@app/types/signingSession";
+import { useToolWorkflow } from "@app/contexts/ToolWorkflowContext";
+import {
+  useNavigationActions,
+  useNavigationState,
+} from "@app/contexts/NavigationContext";
+import { useFileSelection } from "@app/contexts/file/fileHooks";
+import { fileStorage } from "@app/services/fileStorage";
+import { useFileActions } from "@app/contexts/FileContext";
+import SignRequestWorkbenchView from "@app/components/tools/certSign/SignRequestWorkbenchView";
+import SessionDetailWorkbenchView from "@app/components/tools/certSign/SessionDetailWorkbenchView";
+import { Z_INDEX_OVER_FULLSCREEN_SURFACE } from "@app/styles/zIndex";
 
-export const SIGN_REQUEST_WORKBENCH_TYPE = 'custom:signRequestWorkbench' as const;
-export const SESSION_DETAIL_WORKBENCH_TYPE = 'custom:sessionDetailWorkbench' as const;
+export const SIGN_REQUEST_WORKBENCH_TYPE =
+  "custom:signRequestWorkbench" as const;
+export const SESSION_DETAIL_WORKBENCH_TYPE =
+  "custom:sessionDetailWorkbench" as const;
 
 type SessionItem = (SignRequestSummary | SessionSummary) & {
-  itemType: 'signRequest' | 'mySession';
+  itemType: "signRequest" | "mySession";
 };
 
-function sortSessions(sessions: SessionItem[], tab: 'active' | 'completed'): SessionItem[] {
+function sortSessions(
+  sessions: SessionItem[],
+  tab: "active" | "completed",
+): SessionItem[] {
   return [...sessions].sort((a, b) => {
-    if (tab === 'active') {
+    if (tab === "active") {
       const aDue = (a as SignRequestSummary).dueDate;
       const bDue = (b as SignRequestSummary).dueDate;
-      if (aDue && bDue) return new Date(aDue).getTime() - new Date(bDue).getTime();
+      if (aDue && bDue)
+        return new Date(aDue).getTime() - new Date(bDue).getTime();
       if (aDue) return -1;
       if (bDue) return 1;
     }
@@ -47,31 +61,44 @@ interface SignPopoutProps {
   groupSigningEnabled: boolean;
 }
 
-const SignPopout = ({ isOpen, onClose, buttonRef, isRTL, groupSigningEnabled }: SignPopoutProps) => {
+const SignPopout = ({
+  isOpen,
+  onClose,
+  buttonRef,
+  isRTL,
+  groupSigningEnabled,
+}: SignPopoutProps) => {
   const { t } = useTranslation();
   const isPhone = useIsPhone();
   const popoverRef = useRef<HTMLDivElement>(null);
-  const [popoverPosition, setPopoverPosition] = useState({ top: 160, left: 84 });
+  const [popoverPosition, setPopoverPosition] = useState({
+    top: 160,
+    left: 84,
+  });
   const [maxHeight, setMaxHeight] = useState<number | undefined>(undefined);
 
   // Tab state
-  const [activeTab, setActiveTab] = useState<'active' | 'completed'>('active');
+  const [activeTab, setActiveTab] = useState<"active" | "completed">("active");
   const [showCreatePanel, setShowCreatePanel] = useState(false);
 
   // Search / filter state
-  const [searchQuery, setSearchQuery] = useState('');
+  const [searchQuery, setSearchQuery] = useState("");
   const [activeFilters, setActiveFilters] = useState<Set<string>>(new Set());
 
-  const handleTabChange = (tab: 'active' | 'completed') => {
+  const handleTabChange = (tab: "active" | "completed") => {
     setActiveTab(tab);
-    setSearchQuery('');
+    setSearchQuery("");
     setActiveFilters(new Set());
   };
 
   const toggleFilter = (key: string) => {
-    setActiveFilters(prev => {
+    setActiveFilters((prev) => {
       const next = new Set(prev);
-      if (next.has(key)) { next.delete(key); } else { next.add(key); }
+      if (next.has(key)) {
+        next.delete(key);
+      } else {
+        next.add(key);
+      }
       return next;
     });
   };
@@ -83,7 +110,7 @@ const SignPopout = ({ isOpen, onClose, buttonRef, isRTL, groupSigningEnabled }:
 
   // Create form state
   const [selectedUserIds, setSelectedUserIds] = useState<number[]>([]);
-  const [dueDate, setDueDate] = useState('');
+  const [dueDate, setDueDate] = useState("");
   const [creating, setCreating] = useState(false);
   const [includeSummaryPage, setIncludeSummaryPage] = useState(false);
 
@@ -101,8 +128,8 @@ const SignPopout = ({ isOpen, onClose, buttonRef, isRTL, groupSigningEnabled }:
   } = useToolWorkflow();
 
   // Workbench IDs
-  const SIGN_REQUEST_WORKBENCH_ID = 'signRequestWorkbench';
-  const SESSION_DETAIL_WORKBENCH_ID = 'sessionDetailWorkbench';
+  const SIGN_REQUEST_WORKBENCH_ID = "signRequestWorkbench";
+  const SESSION_DETAIL_WORKBENCH_ID = "sessionDetailWorkbench";
 
   // Register workbenches when group signing is enabled.
   // No cleanup on unmount — registration must persist when this component unmounts
@@ -113,7 +140,7 @@ const SignPopout = ({ isOpen, onClose, buttonRef, isRTL, groupSigningEnabled }:
     registerCustomWorkbenchView({
       id: SIGN_REQUEST_WORKBENCH_ID,
       workbenchId: SIGN_REQUEST_WORKBENCH_TYPE,
-      label: t('certSign.collab.signRequest.workbenchTitle', 'Sign Request'),
+      label: t("certSign.collab.signRequest.workbenchTitle", "Sign Request"),
       component: SignRequestWorkbenchView,
       hideTopControls: true,
       hideToolPanel: true,
@@ -122,7 +149,10 @@ const SignPopout = ({ isOpen, onClose, buttonRef, isRTL, groupSigningEnabled }:
     registerCustomWorkbenchView({
       id: SESSION_DETAIL_WORKBENCH_ID,
       workbenchId: SESSION_DETAIL_WORKBENCH_TYPE,
-      label: t('certSign.collab.sessionDetail.workbenchTitle', 'Session Management'),
+      label: t(
+        "certSign.collab.sessionDetail.workbenchTitle",
+        "Session Management",
+      ),
       component: SessionDetailWorkbenchView,
       hideTopControls: true,
       hideToolPanel: true,
@@ -175,12 +205,12 @@ const SignPopout = ({ isOpen, onClose, buttonRef, isRTL, groupSigningEnabled }:
     };
 
     updatePosition();
-    window.addEventListener('resize', updatePosition);
-    window.addEventListener('scroll', updatePosition, { capture: true });
+    window.addEventListener("resize", updatePosition);
+    window.addEventListener("scroll", updatePosition, { capture: true });
 
     return () => {
-      window.removeEventListener('resize', updatePosition);
-      window.removeEventListener('scroll', updatePosition, { capture: true });
+      window.removeEventListener("resize", updatePosition);
+      window.removeEventListener("scroll", updatePosition, { capture: true });
     };
   }, [isOpen, isRTL, buttonRef]);
 
@@ -194,7 +224,7 @@ const SignPopout = ({ isOpen, onClose, buttonRef, isRTL, groupSigningEnabled }:
       if (buttonRef.current?.contains(target)) return;
 
       const mantineDropdown = (target as Element).closest?.(
-        '.mantine-Combobox-dropdown, .mantine-Popover-dropdown'
+        ".mantine-Combobox-dropdown, .mantine-Popover-dropdown",
       );
       if (mantineDropdown) return;
 
@@ -202,15 +232,15 @@ const SignPopout = ({ isOpen, onClose, buttonRef, isRTL, groupSigningEnabled }:
     };
 
     const handleEscape = (event: KeyboardEvent) => {
-      if (event.key === 'Escape') onClose();
+      if (event.key === "Escape") onClose();
     };
 
-    document.addEventListener('mousedown', handleOutside);
-    document.addEventListener('keydown', handleEscape);
+    document.addEventListener("mousedown", handleOutside);
+    document.addEventListener("keydown", handleEscape);
 
     return () => {
-      document.removeEventListener('mousedown', handleOutside);
-      document.removeEventListener('keydown', handleEscape);
+      document.removeEventListener("mousedown", handleOutside);
+      document.removeEventListener("keydown", handleEscape);
     };
   }, [isOpen, onClose, buttonRef]);
 
@@ -218,17 +248,22 @@ const SignPopout = ({ isOpen, onClose, buttonRef, isRTL, groupSigningEnabled }:
     setLoading(true);
     try {
       const [requestsResponse, sessionsResponse] = await Promise.all([
-        apiClient.get<SignRequestSummary[]>('/api/v1/security/cert-sign/sign-requests'),
-        apiClient.get<SessionSummary[]>('/api/v1/security/cert-sign/sessions'),
+        apiClient.get<SignRequestSummary[]>(
+          "/api/v1/security/cert-sign/sign-requests",
+        ),
+        apiClient.get<SessionSummary[]>("/api/v1/security/cert-sign/sessions"),
       ]);
       setSignRequests(requestsResponse.data);
       setMySessions(sessionsResponse.data);
     } catch (error) {
-      console.error('Failed to fetch signing data:', error instanceof Error ? error.message : error);
+      console.error(
+        "Failed to fetch signing data:",
+        error instanceof Error ? error.message : error,
+      );
       alert({
-        alertType: 'warning',
-        title: t('common.error'),
-        body: t('certSign.fetchFailed', 'Failed to load signing data'),
+        alertType: "warning",
+        title: t("common.error"),
+        body: t("certSign.fetchFailed", "Failed to load signing data"),
         expandable: false,
         durationMs: 2500,
       });
@@ -246,7 +281,12 @@ const SignPopout = ({ isOpen, onClose, buttonRef, isRTL, groupSigningEnabled }:
 
   // Auto-refresh Active tab every 15 seconds to show updated signature status
   useEffect(() => {
-    if (isOpen && groupSigningEnabled && activeTab === 'active' && !showCreatePanel) {
+    if (
+      isOpen &&
+      groupSigningEnabled &&
+      activeTab === "active" &&
+      !showCreatePanel
+    ) {
       const interval = setInterval(() => {
         fetchData();
       }, 15000); // Refresh every 15 seconds
@@ -259,53 +299,73 @@ const SignPopout = ({ isOpen, onClose, buttonRef, isRTL, groupSigningEnabled }:
   const activeSessions: SessionItem[] = [
     // Sign requests where user hasn't signed or declined yet
     ...signRequests
-      .filter(req => req.myStatus !== 'SIGNED' && req.myStatus !== 'DECLINED')
-      .map(req => ({ ...req, itemType: 'signRequest' as const })),
+      .filter((req) => req.myStatus !== "SIGNED" && req.myStatus !== "DECLINED")
+      .map((req) => ({ ...req, itemType: "signRequest" as const })),
     // Sessions user created that aren't finalized yet
     ...mySessions
-      .filter(s => !s.finalized)
-      .map(s => ({ ...s, itemType: 'mySession' as const })),
+      .filter((s) => !s.finalized)
+      .map((s) => ({ ...s, itemType: "mySession" as const })),
   ];
 
   const completedSessions: SessionItem[] = [
     // Sign requests where user has signed or declined
     ...signRequests
-      .filter(req => req.myStatus === 'SIGNED' || req.myStatus === 'DECLINED')
-      .map(req => ({ ...req, itemType: 'signRequest' as const })),
+      .filter((req) => req.myStatus === "SIGNED" || req.myStatus === "DECLINED")
+      .map((req) => ({ ...req, itemType: "signRequest" as const })),
     // Sessions user created that have been finalized
     ...mySessions
-      .filter(s => s.finalized)
-      .map(s => ({ ...s, itemType: 'mySession' as const })),
+      .filter((s) => s.finalized)
+      .map((s) => ({ ...s, itemType: "mySession" as const })),
   ];
 
   // Filter options vary by tab
-  const filterOptions = activeTab === 'active'
-    ? [
-        { key: 'mine',    label: t('quickAccess.filterMine', 'Mine') },
-        { key: 'overdue', label: t('quickAccess.filterOverdue', 'Overdue') },
-      ]
-    : [
-        { key: 'mine',    label: t('quickAccess.filterMine', 'Mine') },
-        { key: 'signed',  label: t('quickAccess.filterSigned', 'Signed') },
-        { key: 'declined',label: t('quickAccess.filterDeclined', 'Declined') },
-      ];
+  const filterOptions =
+    activeTab === "active"
+      ? [
+          { key: "mine", label: t("quickAccess.filterMine", "Mine") },
+          { key: "overdue", label: t("quickAccess.filterOverdue", "Overdue") },
+        ]
+      : [
+          { key: "mine", label: t("quickAccess.filterMine", "Mine") },
+          { key: "signed", label: t("quickAccess.filterSigned", "Signed") },
+          {
+            key: "declined",
+            label: t("quickAccess.filterDeclined", "Declined"),
+          },
+        ];
 
   const applyFiltersAndSearch = (sessions: SessionItem[]): SessionItem[] => {
     let result = sessions;
     if (searchQuery.trim()) {
       const q = searchQuery.toLowerCase();
-      result = result.filter(s => s.documentName.toLowerCase().includes(q));
+      result = result.filter((s) => s.documentName.toLowerCase().includes(q));
     }
     const now = new Date();
-    if (activeFilters.has('mine'))     result = result.filter(s => s.itemType === 'mySession');
-    if (activeFilters.has('overdue'))  result = result.filter(s => (s as SignRequestSummary).dueDate && new Date((s as SignRequestSummary).dueDate) < now);
-    if (activeFilters.has('signed'))   result = result.filter(s => (s as SignRequestSummary).myStatus === 'SIGNED');
-    if (activeFilters.has('declined')) result = result.filter(s => (s as SignRequestSummary).myStatus === 'DECLINED');
+    if (activeFilters.has("mine"))
+      result = result.filter((s) => s.itemType === "mySession");
+    if (activeFilters.has("overdue"))
+      result = result.filter(
+        (s) =>
+          (s as SignRequestSummary).dueDate &&
+          new Date((s as SignRequestSummary).dueDate) < now,
+      );
+    if (activeFilters.has("signed"))
+      result = result.filter(
+        (s) => (s as SignRequestSummary).myStatus === "SIGNED",
+      );
+    if (activeFilters.has("declined"))
+      result = result.filter(
+        (s) => (s as SignRequestSummary).myStatus === "DECLINED",
+      );
     return result;
   };
 
-  const displayedActiveSessions = applyFiltersAndSearch(sortSessions(activeSessions, 'active'));
-  const displayedCompletedSessions = applyFiltersAndSearch(sortSessions(completedSessions, 'completed'));
+  const displayedActiveSessions = applyFiltersAndSearch(
+    sortSessions(activeSessions, "active"),
+  );
+  const displayedCompletedSessions = applyFiltersAndSearch(
+    sortSessions(completedSessions, "completed"),
+  );
 
   // Create session handler
   const handleCreateSession = useCallback(async () => {
@@ -314,207 +374,275 @@ const SignPopout = ({ isOpen, onClose, buttonRef, isRTL, groupSigningEnabled }:
     setCreating(true);
     try {
       const selectedFile = selectedFiles[0];
-      const stirlingFile = await fileStorage.getStirlingFile(selectedFile.fileId);
-      if (!stirlingFile) throw new Error('File not found');
+      const stirlingFile = await fileStorage.getStirlingFile(
+        selectedFile.fileId,
+      );
+      if (!stirlingFile) throw new Error("File not found");
 
       const formData = new FormData();
-      formData.append('file', stirlingFile, selectedFile.name);
-      formData.append('workflowType', 'SIGNING');
-      formData.append('documentName', selectedFile.name);
+      formData.append("file", stirlingFile, selectedFile.name);
+      formData.append("workflowType", "SIGNING");
+      formData.append("documentName", selectedFile.name);
       selectedUserIds.forEach((userId, index) => {
         formData.append(`participantUserIds[${index}]`, userId.toString());
       });
-      if (dueDate) formData.append('dueDate', dueDate);
-      formData.append('notifyOnCreate', 'true');
+      if (dueDate) formData.append("dueDate", dueDate);
+      formData.append("notifyOnCreate", "true");
 
       // Send includeSummaryPage setting as workflowMetadata if enabled
       if (includeSummaryPage) {
         const workflowMetadata = JSON.stringify({
           includeSummaryPage: true,
         });
-        formData.append('workflowMetadata', workflowMetadata);
+        formData.append("workflowMetadata", workflowMetadata);
       }
 
-      await apiClient.post('/api/v1/security/cert-sign/sessions', formData);
+      await apiClient.post("/api/v1/security/cert-sign/sessions", formData);
 
       alert({
-        alertType: 'success',
-        title: t('success'),
-        body: t('signSession.created', 'Signing request sent'),
+        alertType: "success",
+        title: t("success"),
+        body: t("signSession.created", "Signing request sent"),
         expandable: false,
         durationMs: 2500,
       });
 
       setSelectedUserIds([]);
-      setDueDate('');
+      setDueDate("");
       setIncludeSummaryPage(false);
       setShowCreatePanel(false);
       await fetchData();
     } catch (error) {
-      console.error('Failed to create session:', error instanceof Error ? error.message : error);
+      console.error(
+        "Failed to create session:",
+        error instanceof Error ? error.message : error,
+      );
       alert({
-        alertType: 'error',
-        title: t('common.error'),
-        body: t('signSession.createFailed', 'Failed to create signing request'),
+        alertType: "error",
+        title: t("common.error"),
+        body: t("signSession.createFailed", "Failed to create signing request"),
         expandable: false,
         durationMs: 3000,
       });
     } finally {
       setCreating(false);
     }
-  }, [selectedUserIds, dueDate, selectedFiles, fetchData, t, includeSummaryPage]);
+  }, [
+    selectedUserIds,
+    dueDate,
+    selectedFiles,
+    fetchData,
+    t,
+    includeSummaryPage,
+  ]);
 
   // Handle clicking a sign request
-  const handleSignRequestClick = useCallback(async (request: SignRequestSummary) => {
-    onClose();
-    try {
-      const [detailResponse, pdfResponse] = await Promise.all([
-        apiClient.get<SignRequestDetail>(`/api/v1/security/cert-sign/sign-requests/${request.sessionId}`),
-        apiClient.get(`/api/v1/security/cert-sign/sign-requests/${request.sessionId}/document`, {
-          responseType: 'blob',
-        }),
-      ]);
+  const handleSignRequestClick = useCallback(
+    async (request: SignRequestSummary) => {
+      onClose();
+      try {
+        const [detailResponse, pdfResponse] = await Promise.all([
+          apiClient.get<SignRequestDetail>(
+            `/api/v1/security/cert-sign/sign-requests/${request.sessionId}`,
+          ),
+          apiClient.get(
+            `/api/v1/security/cert-sign/sign-requests/${request.sessionId}/document`,
+            {
+              responseType: "blob",
+            },
+          ),
+        ]);
 
-      const pdfFile = new File([pdfResponse.data], detailResponse.data.documentName, {
-        type: 'application/pdf',
-      });
-      const canSign =
-        detailResponse.data.myStatus === 'PENDING' ||
-        detailResponse.data.myStatus === 'NOTIFIED' ||
-        detailResponse.data.myStatus === 'VIEWED';
+        const pdfFile = new File(
+          [pdfResponse.data],
+          detailResponse.data.documentName,
+          {
+            type: "application/pdf",
+          },
+        );
+        const canSign =
+          detailResponse.data.myStatus === "PENDING" ||
+          detailResponse.data.myStatus === "NOTIFIED" ||
+          detailResponse.data.myStatus === "VIEWED";
 
-      setCustomWorkbenchViewData(SIGN_REQUEST_WORKBENCH_ID, {
-        signRequest: detailResponse.data,
-        pdfFile,
-        onSign: (certData: FormData) => handleSign(request.sessionId, certData),
-        onDecline: () => handleDecline(request.sessionId),
-        onBack: () => {
-          clearCustomWorkbenchViewData(SIGN_REQUEST_WORKBENCH_ID);
-          navigationActions.setWorkbench('viewer');
-        },
-        canSign,
-      });
+        setCustomWorkbenchViewData(SIGN_REQUEST_WORKBENCH_ID, {
+          signRequest: detailResponse.data,
+          pdfFile,
+          onSign: (certData: FormData) =>
+            handleSign(request.sessionId, certData),
+          onDecline: () => handleDecline(request.sessionId),
+          onBack: () => {
+            clearCustomWorkbenchViewData(SIGN_REQUEST_WORKBENCH_ID);
+            navigationActions.setWorkbench("viewer");
+          },
+          canSign,
+        });
 
-      requestAnimationFrame(() => {
-        navigationActions.setWorkbench(SIGN_REQUEST_WORKBENCH_TYPE);
-      });
-    } catch (error) {
-      console.error('Failed to load sign request:', error instanceof Error ? error.message : error);
-      alert({
-        alertType: 'error',
-        title: t('common.error'),
-        body: t('signRequest.fetchFailed', 'Failed to load sign request'),
-        expandable: false,
-        durationMs: 3000,
-      });
-    }
-  }, [onClose, setCustomWorkbenchViewData, clearCustomWorkbenchViewData, navigationActions, t]);
+        requestAnimationFrame(() => {
+          navigationActions.setWorkbench(SIGN_REQUEST_WORKBENCH_TYPE);
+        });
+      } catch (error) {
+        console.error(
+          "Failed to load sign request:",
+          error instanceof Error ? error.message : error,
+        );
+        alert({
+          alertType: "error",
+          title: t("common.error"),
+          body: t("signRequest.fetchFailed", "Failed to load sign request"),
+          expandable: false,
+          durationMs: 3000,
+        });
+      }
+    },
+    [
+      onClose,
+      setCustomWorkbenchViewData,
+      clearCustomWorkbenchViewData,
+      navigationActions,
+      t,
+    ],
+  );
 
   // Handle clicking a session
-  const handleSessionClick = useCallback(async (session: SessionSummary) => {
-    onClose();
-    try {
-      // First fetch session detail
-      const detailResponse = await apiClient.get<SessionDetail>(
-        `/api/v1/security/cert-sign/sessions/${session.sessionId}`
-      );
+  const handleSessionClick = useCallback(
+    async (session: SessionSummary) => {
+      onClose();
+      try {
+        // First fetch session detail
+        const detailResponse = await apiClient.get<SessionDetail>(
+          `/api/v1/security/cert-sign/sessions/${session.sessionId}`,
+        );
 
-      // Determine which endpoint to use based on session state
-      let pdfFile: File | null = null;
+        // Determine which endpoint to use based on session state
+        let pdfFile: File | null = null;
 
-      if (detailResponse.data.finalized) {
-        // Finalized sessions have signed PDF available
-        try {
-          const pdfResponse = await apiClient.get(
-            `/api/v1/security/cert-sign/sessions/${session.sessionId}/signed-pdf`,
-            { responseType: 'blob' }
-          );
-          pdfFile = new File([pdfResponse.data], session.documentName, { type: 'application/pdf' });
-        } catch (pdfError: any) {
-          if (pdfError?.response?.status === 404) {
-            // Finalized but signed PDF not available - backend issue
-            alert({
-              alertType: 'warning',
-              title: t('certSign.sessions.pdfNotReady', 'PDF Not Ready'),
-              body: t('certSign.sessions.pdfNotReadyDesc', 'The signed PDF is being generated. Please try again in a moment.'),
-              expandable: false,
-              durationMs: 3000,
+        if (detailResponse.data.finalized) {
+          // Finalized sessions have signed PDF available
+          try {
+            const pdfResponse = await apiClient.get(
+              `/api/v1/security/cert-sign/sessions/${session.sessionId}/signed-pdf`,
+              {
+                responseType: "blob",
+              },
+            );
+            pdfFile = new File([pdfResponse.data], session.documentName, {
+              type: "application/pdf",
             });
-            return;
+          } catch (pdfError: any) {
+            if (pdfError?.response?.status === 404) {
+              // Finalized but signed PDF not available - backend issue
+              alert({
+                alertType: "warning",
+                title: t("certSign.sessions.pdfNotReady", "PDF Not Ready"),
+                body: t(
+                  "certSign.sessions.pdfNotReadyDesc",
+                  "The signed PDF is being generated. Please try again in a moment.",
+                ),
+                expandable: false,
+                durationMs: 3000,
+              });
+              return;
+            }
+            throw pdfError;
+          }
+        } else {
+          // For non-finalized sessions, get original PDF (always available)
+          try {
+            const pdfResponse = await apiClient.get(
+              `/api/v1/security/cert-sign/sessions/${session.sessionId}/pdf`,
+              {
+                responseType: "blob",
+              },
+            );
+            pdfFile = new File([pdfResponse.data], session.documentName, {
+              type: "application/pdf",
+            });
+          } catch (_error) {
+            // Fallback if PDF not available
+            pdfFile = null;
           }
-          throw pdfError;
-        }
-      } else {
-        // For non-finalized sessions, get original PDF (always available)
-        try {
-          const pdfResponse = await apiClient.get(
-            `/api/v1/security/cert-sign/sessions/${session.sessionId}/pdf`,
-            { responseType: 'blob' }
-          );
-          pdfFile = new File([pdfResponse.data], session.documentName, { type: 'application/pdf' });
-        } catch (_error) {
-          // Fallback if PDF not available
-          pdfFile = null;
         }
+
+        setCustomWorkbenchViewData(SESSION_DETAIL_WORKBENCH_ID, {
+          session: detailResponse.data,
+          pdfFile,
+          onFinalize: () =>
+            handleFinalize(session.sessionId, session.documentName),
+          onLoadSignedPdf: () =>
+            handleLoadSignedPdf(session.sessionId, session.documentName),
+          onAddParticipants: (userIds: number[], defaultReason?: string) =>
+            handleAddParticipants(session.sessionId, userIds, defaultReason),
+          onRemoveParticipant: (participantId: number) =>
+            handleRemoveParticipant(session.sessionId, participantId),
+          onDelete: () => handleDeleteSession(session.sessionId),
+          onBack: () => {
+            clearCustomWorkbenchViewData(SESSION_DETAIL_WORKBENCH_ID);
+            navigationActions.setWorkbench("viewer");
+          },
+          onRefresh: () => handleRefreshSession(session.sessionId),
+        });
+
+        requestAnimationFrame(() => {
+          navigationActions.setWorkbench(SESSION_DETAIL_WORKBENCH_TYPE);
+        });
+      } catch (error) {
+        console.error(
+          "Failed to load session:",
+          error instanceof Error ? error.message : error,
+        );
+        alert({
+          alertType: "error",
+          title: t("common.error"),
+          body: t(
+            "certSign.sessions.fetchFailed",
+            "Failed to load session details",
+          ),
+          expandable: false,
+          durationMs: 3000,
+        });
       }
-
-      setCustomWorkbenchViewData(SESSION_DETAIL_WORKBENCH_ID, {
-        session: detailResponse.data,
-        pdfFile,
-        onFinalize: () => handleFinalize(session.sessionId, session.documentName),
-        onLoadSignedPdf: () => handleLoadSignedPdf(session.sessionId, session.documentName),
-        onAddParticipants: (userIds: number[], defaultReason?: string) =>
-          handleAddParticipants(session.sessionId, userIds, defaultReason),
-        onRemoveParticipant: (participantId: number) => handleRemoveParticipant(session.sessionId, participantId),
-        onDelete: () => handleDeleteSession(session.sessionId),
-        onBack: () => {
-          clearCustomWorkbenchViewData(SESSION_DETAIL_WORKBENCH_ID);
-          navigationActions.setWorkbench('viewer');
-        },
-        onRefresh: () => handleRefreshSession(session.sessionId),
-      });
-
-      requestAnimationFrame(() => {
-        navigationActions.setWorkbench(SESSION_DETAIL_WORKBENCH_TYPE);
-      });
-    } catch (error) {
-      console.error('Failed to load session:', error instanceof Error ? error.message : error);
-      alert({
-        alertType: 'error',
-        title: t('common.error'),
-        body: t('certSign.sessions.fetchFailed', 'Failed to load session details'),
-        expandable: false,
-        durationMs: 3000,
-      });
-    }
-  }, [onClose, setCustomWorkbenchViewData, clearCustomWorkbenchViewData, navigationActions, t]);
+    },
+    [
+      onClose,
+      setCustomWorkbenchViewData,
+      clearCustomWorkbenchViewData,
+      navigationActions,
+      t,
+    ],
+  );
 
   // Action handlers
   const handleSign = async (sessionId: string, certificateData: FormData) => {
-    await apiClient.post(`/api/v1/security/cert-sign/sign-requests/${sessionId}/sign`, certificateData);
+    await apiClient.post(
+      `/api/v1/security/cert-sign/sign-requests/${sessionId}/sign`,
+      certificateData,
+    );
     alert({
-      alertType: 'success',
-      title: t('success'),
-      body: t('signRequest.signed', 'Document signed successfully'),
+      alertType: "success",
+      title: t("success"),
+      body: t("signRequest.signed", "Document signed successfully"),
       expandable: false,
       durationMs: 2500,
     });
     clearCustomWorkbenchViewData(SIGN_REQUEST_WORKBENCH_ID);
-    navigationActions.setWorkbench('viewer');
+    navigationActions.setWorkbench("viewer");
     await fetchData();
   };
 
   const handleDecline = async (sessionId: string) => {
-    await apiClient.post(`/api/v1/security/cert-sign/sign-requests/${sessionId}/decline`);
+    await apiClient.post(
+      `/api/v1/security/cert-sign/sign-requests/${sessionId}/decline`,
+    );
     alert({
-      alertType: 'success',
-      title: t('success'),
-      body: t('signRequest.declined', 'Sign request declined'),
+      alertType: "success",
+      title: t("success"),
+      body: t("signRequest.declined", "Sign request declined"),
       expandable: false,
       durationMs: 2500,
     });
     clearCustomWorkbenchViewData(SIGN_REQUEST_WORKBENCH_ID);
-    navigationActions.setWorkbench('viewer');
+    navigationActions.setWorkbench("viewer");
     await fetchData();
   };
 
@@ -522,109 +650,144 @@ const SignPopout = ({ isOpen, onClose, buttonRef, isRTL, groupSigningEnabled }:
     const response = await apiClient.post(
       `/api/v1/security/cert-sign/sessions/${sessionId}/finalize`,
       null,
-      { responseType: 'blob' }
+      {
+        responseType: "blob",
+      },
     );
-    const contentDisposition = response.headers['content-disposition'];
+    const contentDisposition = response.headers["content-disposition"];
     const filenameMatch = contentDisposition?.match(/filename="?(.+?)"?$/);
-    const filename = filenameMatch ? filenameMatch[1] : `${documentName}_signed.pdf`;
-    const signedFile = new File([response.data], filename, { type: 'application/pdf' });
+    const filename = filenameMatch
+      ? filenameMatch[1]
+      : `${documentName}_signed.pdf`;
+    const signedFile = new File([response.data], filename, {
+      type: "application/pdf",
+    });
     await fileActions.addFiles([signedFile]);
     alert({
-      alertType: 'success',
-      title: t('success'),
-      body: t('certSign.sessions.finalized', 'Session finalized'),
+      alertType: "success",
+      title: t("success"),
+      body: t("certSign.sessions.finalized", "Session finalized"),
       expandable: false,
       durationMs: 2500,
     });
     clearCustomWorkbenchViewData(SESSION_DETAIL_WORKBENCH_ID);
-    navigationActions.setWorkbench('viewer');
+    navigationActions.setWorkbench("viewer");
     await fetchData();
   };
 
-  const handleLoadSignedPdf = async (sessionId: string, documentName: string) => {
+  const handleLoadSignedPdf = async (
+    sessionId: string,
+    documentName: string,
+  ) => {
     const response = await apiClient.get(
       `/api/v1/security/cert-sign/sessions/${sessionId}/signed-pdf`,
-      { responseType: 'blob' }
+      {
+        responseType: "blob",
+      },
     );
-    const contentDisposition = response.headers['content-disposition'];
+    const contentDisposition = response.headers["content-disposition"];
     const filenameMatch = contentDisposition?.match(/filename="?(.+?)"?$/);
-    const filename = filenameMatch ? filenameMatch[1] : `${documentName}_signed.pdf`;
-    const signedFile = new File([response.data], filename, { type: 'application/pdf' });
+    const filename = filenameMatch
+      ? filenameMatch[1]
+      : `${documentName}_signed.pdf`;
+    const signedFile = new File([response.data], filename, {
+      type: "application/pdf",
+    });
     await fileActions.addFiles([signedFile]);
     alert({
-      alertType: 'success',
-      title: t('success'),
-      body: t('certSign.sessions.loaded', 'Signed PDF loaded'),
+      alertType: "success",
+      title: t("success"),
+      body: t("certSign.sessions.loaded", "Signed PDF loaded"),
       expandable: false,
       durationMs: 2500,
     });
     clearCustomWorkbenchViewData(SESSION_DETAIL_WORKBENCH_ID);
-    navigationActions.setWorkbench('viewer');
+    navigationActions.setWorkbench("viewer");
   };
 
-  const handleAddParticipants = async (sessionId: string, userIds: number[], defaultReason?: string) => {
-    const requests = userIds.map(userId => ({
+  const handleAddParticipants = async (
+    sessionId: string,
+    userIds: number[],
+    defaultReason?: string,
+  ) => {
+    const requests = userIds.map((userId) => ({
       userId,
       defaultReason: defaultReason || undefined,
       sendNotification: true,
     }));
-    await apiClient.post(`/api/v1/security/cert-sign/sessions/${sessionId}/participants`, requests);
+    await apiClient.post(
+      `/api/v1/security/cert-sign/sessions/${sessionId}/participants`,
+      requests,
+    );
     await handleRefreshSession(sessionId);
   };
 
-  const handleRemoveParticipant = async (sessionId: string, participantId: number) => {
-    await apiClient.delete(`/api/v1/security/cert-sign/sessions/${sessionId}/participants/${participantId}`);
+  const handleRemoveParticipant = async (
+    sessionId: string,
+    participantId: number,
+  ) => {
+    await apiClient.delete(
+      `/api/v1/security/cert-sign/sessions/${sessionId}/participants/${participantId}`,
+    );
     await handleRefreshSession(sessionId);
   };
 
   const handleDeleteSession = async (sessionId: string) => {
     await apiClient.delete(`/api/v1/security/cert-sign/sessions/${sessionId}`);
     alert({
-      alertType: 'success',
-      title: t('success'),
-      body: t('certSign.sessions.deleted', 'Session deleted'),
+      alertType: "success",
+      title: t("success"),
+      body: t("certSign.sessions.deleted", "Session deleted"),
       expandable: false,
       durationMs: 2500,
     });
     clearCustomWorkbenchViewData(SESSION_DETAIL_WORKBENCH_ID);
-    navigationActions.setWorkbench('viewer');
+    navigationActions.setWorkbench("viewer");
     await fetchData();
   };
 
   const handleRefreshSession = async (sessionId: string) => {
     const response = await apiClient.get<SessionDetail>(
-      `/api/v1/security/cert-sign/sessions/${sessionId}`
+      `/api/v1/security/cert-sign/sessions/${sessionId}`,
     );
     // Update workbench data, preserving PDF and callbacks
-    setCustomWorkbenchViewData(SESSION_DETAIL_WORKBENCH_ID, (prevData: any) => ({
-      ...prevData,
-      session: response.data,
-    }));
+    setCustomWorkbenchViewData(
+      SESSION_DETAIL_WORKBENCH_ID,
+      (prevData: any) => ({
+        ...prevData,
+        session: response.data,
+      }),
+    );
   };
 
-  if (typeof document === 'undefined') return null;
+  if (typeof document === "undefined") return null;
 
   // Shared card content — rendered inside either the portal (desktop/tablet) or Drawer (phone)
   const popoutCard = (
-    <div className="quick-access-popout__card" style={{ maxHeight: !isPhone && maxHeight ? `${maxHeight}px` : undefined }}>
+    <div
+      className="quick-access-popout__card"
+      style={{
+        maxHeight: !isPhone && maxHeight ? `${maxHeight}px` : undefined,
+      }}
+    >
       {/* Header */}
       <div className="quick-access-popout__header">
         <button
           type="button"
-          className={`quick-access-popout__back ${showCreatePanel ? 'is-visible' : ''}`}
+          className={`quick-access-popout__back ${showCreatePanel ? "is-visible" : ""}`}
           onClick={() => setShowCreatePanel(false)}
-          aria-label={t('quickAccess.back', 'Back')}
+          aria-label={t("quickAccess.back", "Back")}
         >
           <LocalIcon icon="arrow-back-rounded" width="1rem" height="1rem" />
         </button>
         <div className="quick-access-popout__title">
           {showCreatePanel
-            ? t('quickAccess.createSession', 'Create Signing Request')
-            : groupSigningEnabled && activeTab === 'active'
-            ? t('quickAccess.activeSessions', 'Active Sessions')
-            : groupSigningEnabled
-            ? t('quickAccess.completedSessions', 'Completed Sessions')
-            : t('quickAccess.sign', 'Sign')}
+            ? t("quickAccess.createSession", "Create Signing Request")
+            : groupSigningEnabled && activeTab === "active"
+              ? t("quickAccess.activeSessions", "Active Sessions")
+              : groupSigningEnabled
+                ? t("quickAccess.completedSessions", "Completed Sessions")
+                : t("quickAccess.sign", "Sign")}
         </div>
         <div className="quick-access-popout__header-actions">
           {!showCreatePanel && (
@@ -633,7 +796,7 @@ const SignPopout = ({ isOpen, onClose, buttonRef, isRTL, groupSigningEnabled }:
               className="quick-access-popout__header-action"
               onClick={fetchData}
               disabled={loading}
-              aria-label={t('quickAccess.refresh', 'Refresh')}
+              aria-label={t("quickAccess.refresh", "Refresh")}
               style={{ opacity: loading ? 0.5 : 0.7 }}
             >
               <LocalIcon icon="refresh-rounded" width="1rem" height="1rem" />
@@ -643,7 +806,7 @@ const SignPopout = ({ isOpen, onClose, buttonRef, isRTL, groupSigningEnabled }:
             type="button"
             className="quick-access-popout__header-action"
             onClick={onClose}
-            aria-label={t('close', 'Close')}
+            aria-label={t("close", "Close")}
           >
             <LocalIcon icon="close-rounded" width="1rem" height="1rem" />
           </button>
@@ -654,7 +817,7 @@ const SignPopout = ({ isOpen, onClose, buttonRef, isRTL, groupSigningEnabled }:
       {!showCreatePanel && (
         <div className="quick-access-popout__quick-sign">
           <div className="quick-access-popout__section-label">
-            {t('quickAccess.signYourself', 'Sign Yourself')}
+            {t("quickAccess.signYourself", "Sign Yourself")}
           </div>
           <div className="quick-access-popout__quick-sign-actions">
             <button
@@ -662,22 +825,26 @@ const SignPopout = ({ isOpen, onClose, buttonRef, isRTL, groupSigningEnabled }:
               className="quick-access-popout__quick-sign-btn"
               onClick={() => {
                 onClose();
-                handleToolSelect('sign');
+                handleToolSelect("sign");
               }}
             >
               <LocalIcon icon="signature-rounded" width="1rem" height="1rem" />
-              {t('quickAccess.wetSign', 'Add Signature')}
+              {t("quickAccess.wetSign", "Add Signature")}
             </button>
             <button
               type="button"
               className="quick-access-popout__quick-sign-btn"
               onClick={() => {
                 onClose();
-                handleToolSelect('certSign');
+                handleToolSelect("certSign");
               }}
             >
-              <LocalIcon icon="workspace-premium-rounded" width="1rem" height="1rem" />
-              {t('quickAccess.certSign', 'Certificate Sign')}
+              <LocalIcon
+                icon="workspace-premium-rounded"
+                width="1rem"
+                height="1rem"
+              />
+              {t("quickAccess.certSign", "Certificate Sign")}
             </button>
           </div>
         </div>
@@ -687,29 +854,31 @@ const SignPopout = ({ isOpen, onClose, buttonRef, isRTL, groupSigningEnabled }:
       {!showCreatePanel && groupSigningEnabled && (
         <>
           <div className="quick-access-popout__section-label quick-access-popout__section-label--padded quick-access-popout__section-label--row">
-            <span>{t('quickAccess.signatureRequests', 'Signature Requests')}</span>
+            <span>
+              {t("quickAccess.signatureRequests", "Signature Requests")}
+            </span>
             <button
               type="button"
               className="quick-access-popout__section-action"
               onClick={() => setShowCreatePanel(true)}
-              aria-label={t('quickAccess.newRequest', 'New request')}
-              title={t('quickAccess.newRequest', 'New request')}
+              aria-label={t("quickAccess.newRequest", "New request")}
+              title={t("quickAccess.newRequest", "New request")}
             >
               <LocalIcon icon="add-rounded" width="1rem" height="1rem" />
             </button>
           </div>
           <div className="quick-access-popout__tab-nav">
             <button
-              className={`quick-access-popout__tab-button ${activeTab === 'active' ? 'active' : ''}`}
-              onClick={() => handleTabChange('active')}
+              className={`quick-access-popout__tab-button ${activeTab === "active" ? "active" : ""}`}
+              onClick={() => handleTabChange("active")}
             >
-              {t('quickAccess.activeTab', 'Active')}
+              {t("quickAccess.activeTab", "Active")}
             </button>
             <button
-              className={`quick-access-popout__tab-button ${activeTab === 'completed' ? 'active' : ''}`}
-              onClick={() => handleTabChange('completed')}
+              className={`quick-access-popout__tab-button ${activeTab === "completed" ? "active" : ""}`}
+              onClick={() => handleTabChange("completed")}
             >
-              {t('quickAccess.completedTab', 'Completed')}
+              {t("quickAccess.completedTab", "Completed")}
             </button>
           </div>
         </>
@@ -721,16 +890,16 @@ const SignPopout = ({ isOpen, onClose, buttonRef, isRTL, groupSigningEnabled }:
           <input
             type="search"
             className="quick-access-popout__search"
-            placeholder={t('quickAccess.searchDocuments', 'Search documents…')}
+            placeholder={t("quickAccess.searchDocuments", "Search documents…")}
             value={searchQuery}
-            onChange={e => setSearchQuery(e.target.value)}
+            onChange={(e) => setSearchQuery(e.target.value)}
           />
           <div className="quick-access-popout__filter-chips">
-            {filterOptions.map(f => (
+            {filterOptions.map((f) => (
               <button
                 key={f.key}
                 type="button"
-                className={`quick-access-popout__filter-chip ${activeFilters.has(f.key) ? 'is-active' : ''}`}
+                className={`quick-access-popout__filter-chip ${activeFilters.has(f.key) ? "is-active" : ""}`}
                 onClick={() => toggleFilter(f.key)}
               >
                 {f.label}
@@ -754,12 +923,12 @@ const SignPopout = ({ isOpen, onClose, buttonRef, isRTL, groupSigningEnabled }:
               includeSummaryPage={includeSummaryPage}
               onIncludeSummaryPageChange={setIncludeSummaryPage}
             />
-          ) : activeTab === 'active' ? (
+          ) : activeTab === "active" ? (
             <ActiveSessionsPanel
               sessions={displayedActiveSessions}
               loading={loading}
               onSessionClick={(item) => {
-                if (item.itemType === 'signRequest') {
+                if (item.itemType === "signRequest") {
                   handleSignRequestClick(item as SignRequestSummary);
                 } else {
                   handleSessionClick(item as SessionSummary);
@@ -771,7 +940,7 @@ const SignPopout = ({ isOpen, onClose, buttonRef, isRTL, groupSigningEnabled }:
               sessions={displayedCompletedSessions}
               loading={loading}
               onSessionClick={(item) => {
-                if (item.itemType === 'signRequest') {
+                if (item.itemType === "signRequest") {
                   handleSignRequestClick(item as SignRequestSummary);
                 } else {
                   handleSessionClick(item as SessionSummary);
@@ -789,12 +958,16 @@ const SignPopout = ({ isOpen, onClose, buttonRef, isRTL, groupSigningEnabled }:
             type="button"
             className="quick-access-popout__primary"
             onClick={handleCreateSession}
-            disabled={selectedFiles.length !== 1 || selectedUserIds.length === 0 || creating}
+            disabled={
+              selectedFiles.length !== 1 ||
+              selectedUserIds.length === 0 ||
+              creating
+            }
           >
             <LocalIcon icon="send-rounded" width="1rem" height="1rem" />
             {creating
-              ? t('quickAccess.sendingRequest', 'Sending...')
-              : t('quickAccess.requestSignatures', 'Request Signatures')}
+              ? t("quickAccess.sendingRequest", "Sending...")
+              : t("quickAccess.requestSignatures", "Request Signatures")}
           </button>
         </div>
       )}
@@ -812,7 +985,14 @@ const SignPopout = ({ isOpen, onClose, buttonRef, isRTL, groupSigningEnabled }:
         withCloseButton={false}
         padding={0}
         className="quick-access-sign-popout"
-        styles={{ body: { padding: 0, height: '100%', display: 'flex', flexDirection: 'column' } }}
+        styles={{
+          body: {
+            padding: 0,
+            height: "100%",
+            display: "flex",
+            flexDirection: "column",
+          },
+        }}
       >
         {popoutCard}
       </Drawer>
@@ -823,9 +1003,9 @@ const SignPopout = ({ isOpen, onClose, buttonRef, isRTL, groupSigningEnabled }:
   return createPortal(
     <div
       ref={popoverRef}
-      className={`quick-access-popout quick-access-sign-popout ${isOpen ? 'is-open' : ''}`}
+      className={`quick-access-popout quick-access-sign-popout ${isOpen ? "is-open" : ""}`}
       style={{
-        position: 'fixed',
+        position: "fixed",
         top: `${popoverPosition.top}px`,
         left: `${popoverPosition.left}px`,
         zIndex: Z_INDEX_OVER_FULLSCREEN_SURFACE,
@@ -834,7 +1014,7 @@ const SignPopout = ({ isOpen, onClose, buttonRef, isRTL, groupSigningEnabled }:
     >
       {popoutCard}
     </div>,
-    document.body
+    document.body,
   );
 };
 
diff --git a/frontend/src/core/components/shared/signing/steps/ConfigureSignatureDefaultsStep.tsx b/frontend/src/core/components/shared/signing/steps/ConfigureSignatureDefaultsStep.tsx
index 5fd2d2989d..5d7f0f15d3 100644
--- a/frontend/src/core/components/shared/signing/steps/ConfigureSignatureDefaultsStep.tsx
+++ b/frontend/src/core/components/shared/signing/steps/ConfigureSignatureDefaultsStep.tsx
@@ -1,7 +1,9 @@
-import { Button, Stack, Text, Group, Paper } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import ArrowBackIcon from '@mui/icons-material/ArrowBack';
-import SignatureSettingsInput, { SignatureSettings } from '@app/components/tools/certSign/SignatureSettingsInput';
+import { Button, Stack, Text, Group, Paper } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import ArrowBackIcon from "@mui/icons-material/ArrowBack";
+import SignatureSettingsInput, {
+  SignatureSettings,
+} from "@app/components/tools/certSign/SignatureSettingsInput";
 
 interface ConfigureSignatureDefaultsStepProps {
   settings: SignatureSettings;
@@ -11,13 +13,9 @@ interface ConfigureSignatureDefaultsStepProps {
   disabled?: boolean;
 }
 
-export const ConfigureSignatureDefaultsStep: React.FC<ConfigureSignatureDefaultsStepProps> = ({
-  settings,
-  onSettingsChange,
-  onBack,
-  onNext,
-  disabled = false,
-}) => {
+export const ConfigureSignatureDefaultsStep: React.FC<
+  ConfigureSignatureDefaultsStepProps
+> = ({ settings, onSettingsChange, onBack, onNext, disabled = false }) => {
   const { t } = useTranslation();
 
   return (
@@ -31,31 +29,41 @@ export const ConfigureSignatureDefaultsStep: React.FC<ConfigureSignatureDefaults
       <Paper p="sm" withBorder>
         <Stack gap="xs">
           <Text size="xs" fw={600} c="dimmed">
-            {t('groupSigning.steps.configureDefaults.preview', 'Preview')}
+            {t("groupSigning.steps.configureDefaults.preview", "Preview")}
           </Text>
           <Text size="xs">
             {settings.showSignature
               ? t(
-                  'groupSigning.steps.configureDefaults.visible',
-                  'Signatures will be visible on page {{page}}',
-                  { page: settings.pageNumber || 1 }
+                  "groupSigning.steps.configureDefaults.visible",
+                  "Signatures will be visible on page {{page}}",
+                  {
+                    page: settings.pageNumber || 1,
+                  },
                 )
               : t(
-                  'groupSigning.steps.configureDefaults.invisible',
-                  'Signatures will be invisible (metadata only)'
+                  "groupSigning.steps.configureDefaults.invisible",
+                  "Signatures will be invisible (metadata only)",
                 )}
           </Text>
           {settings.showSignature && settings.reason && (
             <Text size="xs">
-              <strong>{t('groupSigning.steps.configureDefaults.reasonLabel', 'Reason:')}</strong>{' '}
+              <strong>
+                {t(
+                  "groupSigning.steps.configureDefaults.reasonLabel",
+                  "Reason:",
+                )}
+              </strong>{" "}
               {settings.reason}
             </Text>
           )}
           {settings.showSignature && settings.location && (
             <Text size="xs">
               <strong>
-                {t('groupSigning.steps.configureDefaults.locationLabel', 'Location:')}
-              </strong>{' '}
+                {t(
+                  "groupSigning.steps.configureDefaults.locationLabel",
+                  "Location:",
+                )}
+              </strong>{" "}
               {settings.location}
             </Text>
           )}
@@ -63,11 +71,18 @@ export const ConfigureSignatureDefaultsStep: React.FC<ConfigureSignatureDefaults
       </Paper>
 
       <Group gap="sm">
-        <Button variant="default" onClick={onBack} leftSection={<ArrowBackIcon sx={{ fontSize: 16 }} />}>
-          {t('groupSigning.steps.back', 'Back')}
+        <Button
+          variant="default"
+          onClick={onBack}
+          leftSection={<ArrowBackIcon sx={{ fontSize: 16 }} />}
+        >
+          {t("groupSigning.steps.back", "Back")}
         </Button>
         <Button onClick={onNext} disabled={disabled} style={{ flex: 1 }}>
-          {t('groupSigning.steps.configureDefaults.continue', 'Continue to Review')}
+          {t(
+            "groupSigning.steps.configureDefaults.continue",
+            "Continue to Review",
+          )}
         </Button>
       </Group>
     </Stack>
diff --git a/frontend/src/core/components/shared/signing/steps/ReviewSessionStep.tsx b/frontend/src/core/components/shared/signing/steps/ReviewSessionStep.tsx
index aab7d01b2e..f236ec593d 100644
--- a/frontend/src/core/components/shared/signing/steps/ReviewSessionStep.tsx
+++ b/frontend/src/core/components/shared/signing/steps/ReviewSessionStep.tsx
@@ -1,13 +1,13 @@
-import { Button, Stack, Text, Group, Divider, TextInput } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import PictureAsPdfIcon from '@mui/icons-material/PictureAsPdf';
-import PeopleIcon from '@mui/icons-material/People';
-import DrawIcon from '@mui/icons-material/Draw';
-import ArrowBackIcon from '@mui/icons-material/ArrowBack';
-import SendIcon from '@mui/icons-material/Send';
-import CalendarTodayIcon from '@mui/icons-material/CalendarToday';
-import type { SignatureSettings } from '@app/components/tools/certSign/SignatureSettingsInput';
-import type { FileState } from '@app/types/file';
+import { Button, Stack, Text, Group, Divider, TextInput } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import PictureAsPdfIcon from "@mui/icons-material/PictureAsPdf";
+import PeopleIcon from "@mui/icons-material/People";
+import DrawIcon from "@mui/icons-material/Draw";
+import ArrowBackIcon from "@mui/icons-material/ArrowBack";
+import SendIcon from "@mui/icons-material/Send";
+import CalendarTodayIcon from "@mui/icons-material/CalendarToday";
+import type { SignatureSettings } from "@app/components/tools/certSign/SignatureSettingsInput";
+import type { FileState } from "@app/types/file";
 
 interface ReviewSessionStepProps {
   selectedFile: FileState;
@@ -35,23 +35,25 @@ export const ReviewSessionStep: React.FC<ReviewSessionStepProps> = ({
   return (
     <Stack gap="md">
       <Text size="sm" fw={600} c="dimmed">
-        {t('groupSigning.steps.review.title', 'Review Session Details')}
+        {t("groupSigning.steps.review.title", "Review Session Details")}
       </Text>
 
       {/* Document Info */}
       <div>
         <Group gap="xs" mb="xs">
-          <PictureAsPdfIcon sx={{ fontSize: 18, color: 'var(--mantine-color-red-6)' }} />
+          <PictureAsPdfIcon
+            sx={{ fontSize: 18, color: "var(--mantine-color-red-6)" }}
+          />
           <Text size="sm" fw={600}>
-            {t('groupSigning.steps.review.document', 'Document')}
+            {t("groupSigning.steps.review.document", "Document")}
           </Text>
         </Group>
         <div
           style={{
-            padding: '12px',
-            border: '1px solid var(--mantine-color-default-border)',
-            borderRadius: 'var(--mantine-radius-default)',
-            backgroundColor: 'var(--mantine-color-default-hover)',
+            padding: "12px",
+            border: "1px solid var(--mantine-color-default-border)",
+            borderRadius: "var(--mantine-radius-default)",
+            backgroundColor: "var(--mantine-color-default-hover)",
           }}
         >
           <Text size="sm">{selectedFile.name}</Text>
@@ -70,13 +72,13 @@ export const ReviewSessionStep: React.FC<ReviewSessionStepProps> = ({
         <Group gap="xs" mb="xs">
           <PeopleIcon sx={{ fontSize: 18 }} />
           <Text size="sm" fw={600}>
-            {t('groupSigning.steps.review.participants', 'Participants')}
+            {t("groupSigning.steps.review.participants", "Participants")}
           </Text>
         </Group>
         <Text size="sm">
-          {t('groupSigning.steps.review.participantCount', {
+          {t("groupSigning.steps.review.participantCount", {
             count: participantCount,
-            defaultValue: '{{count}} participant(s) will sign in order',
+            defaultValue: "{{count}} participant(s) will sign in order",
           })}
         </Text>
       </div>
@@ -88,34 +90,55 @@ export const ReviewSessionStep: React.FC<ReviewSessionStepProps> = ({
         <Group gap="xs" mb="xs">
           <DrawIcon sx={{ fontSize: 18 }} />
           <Text size="sm" fw={600}>
-            {t('groupSigning.steps.review.signatureSettings', 'Signature Settings')}
+            {t(
+              "groupSigning.steps.review.signatureSettings",
+              "Signature Settings",
+            )}
           </Text>
         </Group>
         <Stack gap="xs">
           <Text size="sm">
-            <strong>{t('groupSigning.steps.review.visibility', 'Visibility:')}</strong>{' '}
+            <strong>
+              {t("groupSigning.steps.review.visibility", "Visibility:")}
+            </strong>{" "}
             {signatureSettings.showSignature
-              ? t('groupSigning.steps.review.visible', 'Visible on page {{page}}', {
-                  page: signatureSettings.pageNumber || 1,
-                })
-              : t('groupSigning.steps.review.invisible', 'Invisible (metadata only)')}
+              ? t(
+                  "groupSigning.steps.review.visible",
+                  "Visible on page {{page}}",
+                  {
+                    page: signatureSettings.pageNumber || 1,
+                  },
+                )
+              : t(
+                  "groupSigning.steps.review.invisible",
+                  "Invisible (metadata only)",
+                )}
           </Text>
           {signatureSettings.showSignature && signatureSettings.reason && (
             <Text size="sm">
-              <strong>{t('groupSigning.steps.review.reason', 'Reason:')}</strong> {signatureSettings.reason}
+              <strong>
+                {t("groupSigning.steps.review.reason", "Reason:")}
+              </strong>{" "}
+              {signatureSettings.reason}
             </Text>
           )}
           {signatureSettings.showSignature && signatureSettings.location && (
             <Text size="sm">
-              <strong>{t('groupSigning.steps.review.location', 'Location:')}</strong> {signatureSettings.location}
+              <strong>
+                {t("groupSigning.steps.review.location", "Location:")}
+              </strong>{" "}
+              {signatureSettings.location}
             </Text>
           )}
           {signatureSettings.showSignature && (
             <Text size="sm">
-              <strong>{t('groupSigning.steps.review.logo', 'Logo:')}</strong>{' '}
+              <strong>{t("groupSigning.steps.review.logo", "Logo:")}</strong>{" "}
               {signatureSettings.showLogo
-                ? t('groupSigning.steps.review.logoShown', 'Stirling PDF logo shown')
-                : t('groupSigning.steps.review.logoHidden', 'No logo')}
+                ? t(
+                    "groupSigning.steps.review.logoShown",
+                    "Stirling PDF logo shown",
+                  )
+                : t("groupSigning.steps.review.logoHidden", "No logo")}
             </Text>
           )}
         </Stack>
@@ -128,7 +151,7 @@ export const ReviewSessionStep: React.FC<ReviewSessionStepProps> = ({
         <Group gap="xs" mb="xs">
           <CalendarTodayIcon sx={{ fontSize: 18 }} />
           <Text size="sm" fw={600}>
-            {t('groupSigning.steps.review.dueDate', 'Due Date (Optional)')}
+            {t("groupSigning.steps.review.dueDate", "Due Date (Optional)")}
           </Text>
         </Group>
         <TextInput
@@ -136,13 +159,20 @@ export const ReviewSessionStep: React.FC<ReviewSessionStepProps> = ({
           value={dueDate}
           onChange={(e) => onDueDateChange(e.target.value)}
           disabled={disabled}
-          placeholder={t('groupSigning.steps.review.dueDatePlaceholder', 'Select due date...')}
+          placeholder={t(
+            "groupSigning.steps.review.dueDatePlaceholder",
+            "Select due date...",
+          )}
         />
       </div>
 
       <Group gap="sm" mt="md">
-        <Button variant="default" onClick={onBack} leftSection={<ArrowBackIcon sx={{ fontSize: 16 }} />}>
-          {t('groupSigning.steps.back', 'Back')}
+        <Button
+          variant="default"
+          onClick={onBack}
+          leftSection={<ArrowBackIcon sx={{ fontSize: 16 }} />}
+        >
+          {t("groupSigning.steps.back", "Back")}
         </Button>
         <Button
           onClick={onSubmit}
@@ -151,7 +181,7 @@ export const ReviewSessionStep: React.FC<ReviewSessionStepProps> = ({
           leftSection={<SendIcon sx={{ fontSize: 16 }} />}
           color="green"
         >
-          {t('groupSigning.steps.review.send', 'Send Signing Requests')}
+          {t("groupSigning.steps.review.send", "Send Signing Requests")}
         </Button>
       </Group>
     </Stack>
diff --git a/frontend/src/core/components/shared/signing/steps/SelectDocumentStep.tsx b/frontend/src/core/components/shared/signing/steps/SelectDocumentStep.tsx
index 508ef659bb..97d0b35009 100644
--- a/frontend/src/core/components/shared/signing/steps/SelectDocumentStep.tsx
+++ b/frontend/src/core/components/shared/signing/steps/SelectDocumentStep.tsx
@@ -1,7 +1,7 @@
-import { Button, Stack, Text } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import PictureAsPdfIcon from '@mui/icons-material/PictureAsPdf';
-import type { FileState } from '@app/types/file';
+import { Button, Stack, Text } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import PictureAsPdfIcon from "@mui/icons-material/PictureAsPdf";
+import type { FileState } from "@app/types/file";
 
 interface SelectDocumentStepProps {
   selectedFiles: FileState[];
@@ -22,28 +22,33 @@ export const SelectDocumentStep: React.FC<SelectDocumentStepProps> = ({
       {!hasValidFile ? (
         <Text size="sm" c="dimmed" ta="center">
           {t(
-            'groupSigning.steps.selectDocument.noFile',
-            'Please select a single PDF file from your active files to create a signing session.'
+            "groupSigning.steps.selectDocument.noFile",
+            "Please select a single PDF file from your active files to create a signing session.",
           )}
         </Text>
       ) : (
         <>
           <div>
             <Text size="sm" c="dimmed" mb="xs">
-              {t('groupSigning.steps.selectDocument.selectedFile', 'Selected document')}
+              {t(
+                "groupSigning.steps.selectDocument.selectedFile",
+                "Selected document",
+              )}
             </Text>
             <div
               style={{
-                display: 'flex',
-                alignItems: 'center',
-                gap: '12px',
-                padding: '12px',
-                border: '1px solid var(--mantine-color-default-border)',
-                borderRadius: 'var(--mantine-radius-default)',
-                backgroundColor: 'var(--mantine-color-default-hover)',
+                display: "flex",
+                alignItems: "center",
+                gap: "12px",
+                padding: "12px",
+                border: "1px solid var(--mantine-color-default-border)",
+                borderRadius: "var(--mantine-radius-default)",
+                backgroundColor: "var(--mantine-color-default-hover)",
               }}
             >
-              <PictureAsPdfIcon sx={{ fontSize: 32, color: 'var(--mantine-color-red-6)' }} />
+              <PictureAsPdfIcon
+                sx={{ fontSize: 32, color: "var(--mantine-color-red-6)" }}
+              />
               <div style={{ flex: 1 }}>
                 <Text size="sm" fw={600}>
                   {selectedFile?.name}
@@ -58,7 +63,10 @@ export const SelectDocumentStep: React.FC<SelectDocumentStepProps> = ({
           </div>
 
           <Button onClick={onNext} fullWidth>
-            {t('groupSigning.steps.selectDocument.continue', 'Continue to Participant Selection')}
+            {t(
+              "groupSigning.steps.selectDocument.continue",
+              "Continue to Participant Selection",
+            )}
           </Button>
         </>
       )}
diff --git a/frontend/src/core/components/shared/signing/steps/SelectParticipantsStep.tsx b/frontend/src/core/components/shared/signing/steps/SelectParticipantsStep.tsx
index 04af1ffe7c..e32458937c 100644
--- a/frontend/src/core/components/shared/signing/steps/SelectParticipantsStep.tsx
+++ b/frontend/src/core/components/shared/signing/steps/SelectParticipantsStep.tsx
@@ -1,7 +1,7 @@
-import { Button, Stack, Text, Group } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import ArrowBackIcon from '@mui/icons-material/ArrowBack';
-import UserSelector from '@app/components/shared/UserSelector';
+import { Button, Stack, Text, Group } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import ArrowBackIcon from "@mui/icons-material/ArrowBack";
+import UserSelector from "@app/components/shared/UserSelector";
 
 interface SelectParticipantsStepProps {
   selectedUserIds: number[];
@@ -26,14 +26,17 @@ export const SelectParticipantsStep: React.FC<SelectParticipantsStepProps> = ({
     <Stack gap="md">
       <div>
         <Text size="sm" c="dimmed" mb="xs">
-          {t('groupSigning.steps.selectParticipants.label', 'Select participants')}
+          {t(
+            "groupSigning.steps.selectParticipants.label",
+            "Select participants",
+          )}
         </Text>
         <UserSelector
           value={selectedUserIds}
           onChange={onSelectedUserIdsChange}
           placeholder={t(
-            'groupSigning.steps.selectParticipants.placeholder',
-            'Choose participants to sign...'
+            "groupSigning.steps.selectParticipants.placeholder",
+            "Choose participants to sign...",
           )}
           disabled={disabled}
         />
@@ -41,19 +44,30 @@ export const SelectParticipantsStep: React.FC<SelectParticipantsStepProps> = ({
 
       {selectedUserIds.length > 0 && (
         <Text size="xs" c="dimmed">
-          {t('groupSigning.steps.selectParticipants.count', {
+          {t("groupSigning.steps.selectParticipants.count", {
             count: selectedUserIds.length,
-            defaultValue: '{{count}} participant(s) selected',
+            defaultValue: "{{count}} participant(s) selected",
           })}
         </Text>
       )}
 
       <Group gap="sm">
-        <Button variant="default" onClick={onBack} leftSection={<ArrowBackIcon sx={{ fontSize: 16 }} />}>
-          {t('groupSigning.steps.back', 'Back')}
+        <Button
+          variant="default"
+          onClick={onBack}
+          leftSection={<ArrowBackIcon sx={{ fontSize: 16 }} />}
+        >
+          {t("groupSigning.steps.back", "Back")}
         </Button>
-        <Button onClick={onNext} disabled={!hasParticipants || disabled} style={{ flex: 1 }}>
-          {t('groupSigning.steps.selectParticipants.continue', 'Continue to Signature Settings')}
+        <Button
+          onClick={onNext}
+          disabled={!hasParticipants || disabled}
+          style={{ flex: 1 }}
+        >
+          {t(
+            "groupSigning.steps.selectParticipants.continue",
+            "Continue to Signature Settings",
+          )}
         </Button>
       </Group>
     </Stack>
diff --git a/frontend/src/core/components/shared/sliderWithInput/SliderWithInput.tsx b/frontend/src/core/components/shared/sliderWithInput/SliderWithInput.tsx
index 85e7039e29..fa729664ac 100644
--- a/frontend/src/core/components/shared/sliderWithInput/SliderWithInput.tsx
+++ b/frontend/src/core/components/shared/sliderWithInput/SliderWithInput.tsx
@@ -1,4 +1,4 @@
-import { Slider, Text, Group, NumberInput } from '@mantine/core';
+import { Slider, Text, Group, NumberInput } from "@mantine/core";
 
 interface Props {
   label: string;
@@ -19,14 +19,23 @@ export default function SliderWithInput({
   min = 0,
   max = 200,
   step = 1,
-  suffix = '%',
+  suffix = "%",
 }: Props) {
   return (
     <div>
-      <Text size="sm" fw={500} mb={8}>{label}</Text>
+      <Text size="sm" fw={500} mb={8}>
+        {label}
+      </Text>
       <Group gap="md" align="center">
         <div style={{ flex: 1 }}>
-          <Slider min={min} max={max} step={step} value={value} onChange={onChange} disabled={disabled} />
+          <Slider
+            min={min}
+            max={max}
+            step={step}
+            value={value}
+            onChange={onChange}
+            disabled={disabled}
+          />
         </div>
         <NumberInput
           value={value}
@@ -42,5 +51,3 @@ export default function SliderWithInput({
     </div>
   );
 }
-
-
diff --git a/frontend/src/core/components/shared/tooltip/Tooltip.module.css b/frontend/src/core/components/shared/tooltip/Tooltip.module.css
index 9d3bdb80a6..09c5520d76 100644
--- a/frontend/src/core/components/shared/tooltip/Tooltip.module.css
+++ b/frontend/src/core/components/shared/tooltip/Tooltip.module.css
@@ -4,12 +4,16 @@
   border: 0.0625rem solid var(--border-default);
   border-radius: 0.75rem;
   background-color: var(--bg-raised);
-  box-shadow: 0 0.625rem 0.9375rem -0.1875rem rgba(0, 0, 0, 0.1), 0 0.25rem 0.375rem -0.125rem rgba(0, 0, 0, 0.05);
+  box-shadow:
+    0 0.625rem 0.9375rem -0.1875rem rgba(0, 0, 0, 0.1),
+    0 0.25rem 0.375rem -0.125rem rgba(0, 0, 0, 0.05);
   font-size: 0.875rem;
   line-height: 1.5;
   pointer-events: auto;
   z-index: 9999;
-  transition: opacity 100ms ease-out, transform 100ms ease-out;
+  transition:
+    opacity 100ms ease-out,
+    transform 100ms ease-out;
   max-width: 50vh;
   max-height: 80vh;
   color: var(--text-primary);
@@ -20,7 +24,10 @@
 /* Pinned tooltip indicator */
 .tooltip-container.pinned {
   border-color: var(--primary-color, #3b82f6);
-  box-shadow: 0 0.625rem 0.9375rem -0.1875rem rgba(0, 0, 0, 0.1), 0 0.25rem 0.375rem -0.125rem rgba(0, 0, 0, 0.05), 0 0 0 0.125rem rgba(59, 130, 246, 0.1);
+  box-shadow:
+    0 0.625rem 0.9375rem -0.1875rem rgba(0, 0, 0, 0.1),
+    0 0.25rem 0.375rem -0.125rem rgba(0, 0, 0, 0.05),
+    0 0 0 0.125rem rgba(59, 130, 246, 0.1);
 }
 
 /* Pinned tooltip header */
@@ -41,7 +48,9 @@
   border-radius: 0.25rem;
   border: 0.0625rem solid var(--border-default);
   cursor: pointer;
-  transition: background-color 0.2s ease, border-color 0.2s ease;
+  transition:
+    background-color 0.2s ease,
+    border-color 0.2s ease;
   z-index: 1;
   display: flex;
   align-items: center;
@@ -116,12 +125,17 @@
   color: var(--link-color, #3b82f6) !important;
   text-decoration: underline;
   text-decoration-color: var(--link-underline-color, rgba(59, 130, 246, 0.3));
-  transition: color 0.2s ease, text-decoration-color 0.2s ease;
+  transition:
+    color 0.2s ease,
+    text-decoration-color 0.2s ease;
 }
 
 .tooltip-body a:hover {
   color: var(--link-hover-color, #2563eb) !important;
-  text-decoration-color: var(--link-hover-underline-color, rgba(37, 99, 235, 0.5));
+  text-decoration-color: var(
+    --link-hover-underline-color,
+    rgba(37, 99, 235, 0.5)
+  );
 }
 
 .tooltip-container .tooltip-body {
@@ -141,10 +155,12 @@
 
 .tooltip-container .tooltip-body a:hover {
   color: var(--link-hover-color, #2563eb) !important;
-  text-decoration-color: var(--link-hover-underline-color, rgba(37, 99, 235, 0.5));
+  text-decoration-color: var(
+    --link-hover-underline-color,
+    rgba(37, 99, 235, 0.5)
+  );
 }
 
-
 /* Tooltip Arrows */
 .tooltip-arrow {
   position: absolute;
@@ -155,7 +171,6 @@
   transform: rotate(45deg);
 }
 
-
 .tooltip-arrow-sidebar {
   top: 50%;
   left: -0.25rem;
@@ -194,4 +209,4 @@
   transform: translateY(-50%) rotate(45deg);
   border-right: none;
   border-top: none;
-} 
\ No newline at end of file
+}
diff --git a/frontend/src/core/components/shared/tooltip/TooltipContent.tsx b/frontend/src/core/components/shared/tooltip/TooltipContent.tsx
index 42ee19af36..08436799f9 100644
--- a/frontend/src/core/components/shared/tooltip/TooltipContent.tsx
+++ b/frontend/src/core/components/shared/tooltip/TooltipContent.tsx
@@ -1,6 +1,6 @@
-import React from 'react';
-import styles from '@app/components/shared/tooltip/Tooltip.module.css';
-import { TooltipTip } from '@app/types/tips';
+import React from "react";
+import styles from "@app/components/shared/tooltip/Tooltip.module.css";
+import { TooltipTip } from "@app/types/tips";
 
 interface TooltipContentProps {
   content?: React.ReactNode;
@@ -15,55 +15,72 @@ export const TooltipContent: React.FC<TooltipContentProps> = ({
 }) => {
   return (
     <div
-      className={`${styles['tooltip-body']}`}
+      className={`${styles["tooltip-body"]}`}
       style={{
-        color: 'var(--text-primary)',
+        color: "var(--text-primary)",
         padding: `16px ${16 + extraRightPadding}px 16px 16px`,
-        fontSize: '14px',
-        lineHeight: '1.6'
+        fontSize: "14px",
+        lineHeight: "1.6",
       }}
     >
-      <div style={{ color: 'var(--text-primary)' }}>
+      <div style={{ color: "var(--text-primary)" }}>
         {tips ? (
           <>
             {tips.map((tip, index) => (
-              <div key={index} style={{ marginBottom: index < tips.length - 1 ? '24px' : '0' }}>
+              <div
+                key={index}
+                style={{ marginBottom: index < tips.length - 1 ? "24px" : "0" }}
+              >
                 {tip.title && (
-                  <div style={{
-                    display: 'inline-block',
-                    backgroundColor: 'var(--tooltip-title-bg)',
-                    color: 'var(--tooltip-title-color)',
-                    padding: '6px 12px',
-                    borderRadius: '16px',
-                    fontSize: '12px',
-                    fontWeight: '600',
-                    marginBottom: '12px'
-                  }}>
+                  <div
+                    style={{
+                      display: "inline-block",
+                      backgroundColor: "var(--tooltip-title-bg)",
+                      color: "var(--tooltip-title-color)",
+                      padding: "6px 12px",
+                      borderRadius: "16px",
+                      fontSize: "12px",
+                      fontWeight: "600",
+                      marginBottom: "12px",
+                    }}
+                  >
                     {tip.title}
                   </div>
                 )}
                 {tip.description && (
-                  <p style={{ margin: '0 0 12px 0', color: 'var(--text-secondary)', fontSize: '13px' }} dangerouslySetInnerHTML={{ __html: tip.description }} />
+                  <p
+                    style={{
+                      margin: "0 0 12px 0",
+                      color: "var(--text-secondary)",
+                      fontSize: "13px",
+                    }}
+                    dangerouslySetInnerHTML={{ __html: tip.description }}
+                  />
                 )}
                 {tip.bullets && tip.bullets.length > 0 && (
-                  <ul style={{ margin: '0', paddingLeft: '16px', color: 'var(--text-secondary)', fontSize: '13px' }}>
+                  <ul
+                    style={{
+                      margin: "0",
+                      paddingLeft: "16px",
+                      color: "var(--text-secondary)",
+                      fontSize: "13px",
+                    }}
+                  >
                     {tip.bullets.map((bullet, bulletIndex) => (
-                      <li key={bulletIndex} style={{ marginBottom: '6px' }} dangerouslySetInnerHTML={{ __html: bullet }} />
+                      <li
+                        key={bulletIndex}
+                        style={{ marginBottom: "6px" }}
+                        dangerouslySetInnerHTML={{ __html: bullet }}
+                      />
                     ))}
                   </ul>
                 )}
                 {tip.body && (
-                  <div style={{ marginTop: '12px' }}>
-                    {tip.body}
-                  </div>
+                  <div style={{ marginTop: "12px" }}>{tip.body}</div>
                 )}
               </div>
             ))}
-            {content && (
-              <div style={{ marginTop: '24px' }}>
-                {content}
-              </div>
-            )}
+            {content && <div style={{ marginTop: "24px" }}>{content}</div>}
           </>
         ) : (
           content
@@ -71,4 +88,4 @@ export const TooltipContent: React.FC<TooltipContentProps> = ({
       </div>
     </div>
   );
-}; 
\ No newline at end of file
+};
diff --git a/frontend/src/core/components/shared/wetSignature/DrawSignatureCanvas.tsx b/frontend/src/core/components/shared/wetSignature/DrawSignatureCanvas.tsx
index a3d23d3af5..d316dd521a 100644
--- a/frontend/src/core/components/shared/wetSignature/DrawSignatureCanvas.tsx
+++ b/frontend/src/core/components/shared/wetSignature/DrawSignatureCanvas.tsx
@@ -1,7 +1,7 @@
-import { useRef, useEffect, useState } from 'react';
-import { Stack, Button, Group, ColorPicker, Slider, Text } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import DeleteIcon from '@mui/icons-material/Delete';
+import { useRef, useEffect, useState } from "react";
+import { Stack, Button, Group, ColorPicker, Slider, Text } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import DeleteIcon from "@mui/icons-material/Delete";
 
 interface DrawSignatureCanvasProps {
   signature: string | null;
@@ -17,13 +17,13 @@ export const DrawSignatureCanvas: React.FC<DrawSignatureCanvasProps> = ({
   const { t } = useTranslation();
   const canvasRef = useRef<HTMLCanvasElement>(null);
   const [isDrawing, setIsDrawing] = useState(false);
-  const [penColor, setPenColor] = useState('#000000');
+  const [penColor, setPenColor] = useState("#000000");
   const [penSize, setPenSize] = useState(2);
 
   useEffect(() => {
     if (!canvasRef.current) return;
     const canvas = canvasRef.current;
-    const ctx = canvas.getContext('2d');
+    const ctx = canvas.getContext("2d");
     if (!ctx) return;
 
     // Clear canvas
@@ -48,7 +48,7 @@ export const DrawSignatureCanvas: React.FC<DrawSignatureCanvasProps> = ({
     const x = e.clientX - rect.left;
     const y = e.clientY - rect.top;
 
-    const ctx = canvas.getContext('2d');
+    const ctx = canvas.getContext("2d");
     if (!ctx) return;
     ctx.beginPath();
     ctx.moveTo(x, y);
@@ -62,12 +62,12 @@ export const DrawSignatureCanvas: React.FC<DrawSignatureCanvasProps> = ({
     const x = e.clientX - rect.left;
     const y = e.clientY - rect.top;
 
-    const ctx = canvas.getContext('2d');
+    const ctx = canvas.getContext("2d");
     if (!ctx) return;
     ctx.lineTo(x, y);
     ctx.strokeStyle = penColor;
     ctx.lineWidth = penSize;
-    ctx.lineCap = 'round';
+    ctx.lineCap = "round";
     ctx.stroke();
   };
 
@@ -78,14 +78,14 @@ export const DrawSignatureCanvas: React.FC<DrawSignatureCanvasProps> = ({
     if (!canvas) return;
 
     // Convert canvas to base64 and save
-    const dataUrl = canvas.toDataURL('image/png');
+    const dataUrl = canvas.toDataURL("image/png");
     onChange(dataUrl);
   };
 
   const clearCanvas = () => {
     const canvas = canvasRef.current;
     if (!canvas) return;
-    const ctx = canvas.getContext('2d');
+    const ctx = canvas.getContext("2d");
     if (!ctx) return;
     ctx.clearRect(0, 0, canvas.width, canvas.height);
     onChange(null);
@@ -94,7 +94,10 @@ export const DrawSignatureCanvas: React.FC<DrawSignatureCanvasProps> = ({
   return (
     <Stack gap="sm">
       <Text size="sm" c="dimmed">
-        {t('certSign.collab.signRequest.drawSignature', 'Draw your signature below')}
+        {t(
+          "certSign.collab.signRequest.drawSignature",
+          "Draw your signature below",
+        )}
       </Text>
 
       <canvas
@@ -106,19 +109,19 @@ export const DrawSignatureCanvas: React.FC<DrawSignatureCanvasProps> = ({
         onMouseUp={stopDrawing}
         onMouseLeave={stopDrawing}
         style={{
-          border: '1px solid var(--mantine-color-default-border)',
-          borderRadius: 'var(--mantine-radius-default)',
-          cursor: disabled ? 'not-allowed' : 'crosshair',
-          width: '100%',
-          maxWidth: '400px',
-          backgroundColor: 'white',
+          border: "1px solid var(--mantine-color-default-border)",
+          borderRadius: "var(--mantine-radius-default)",
+          cursor: disabled ? "not-allowed" : "crosshair",
+          width: "100%",
+          maxWidth: "400px",
+          backgroundColor: "white",
         }}
       />
 
       <Group gap="sm">
         <div style={{ flex: 1 }}>
           <Text size="xs" mb={4}>
-            {t('certSign.collab.signRequest.penColor', 'Pen Color')}
+            {t("certSign.collab.signRequest.penColor", "Pen Color")}
           </Text>
           <ColorPicker
             value={penColor}
@@ -129,7 +132,9 @@ export const DrawSignatureCanvas: React.FC<DrawSignatureCanvasProps> = ({
         </div>
         <div style={{ flex: 2 }}>
           <Text size="xs" mb={4}>
-            {t('certSign.collab.signRequest.penSize', 'Pen Size: {{size}}px', { size: penSize })}
+            {t("certSign.collab.signRequest.penSize", "Pen Size: {{size}}px", {
+              size: penSize,
+            })}
           </Text>
           <Slider
             value={penSize}
@@ -139,9 +144,9 @@ export const DrawSignatureCanvas: React.FC<DrawSignatureCanvasProps> = ({
             step={1}
             disabled={disabled}
             marks={[
-              { value: 1, label: '1' },
-              { value: 5, label: '5' },
-              { value: 10, label: '10' },
+              { value: 1, label: "1" },
+              { value: 5, label: "5" },
+              { value: 10, label: "10" },
             ]}
           />
         </div>
@@ -155,7 +160,7 @@ export const DrawSignatureCanvas: React.FC<DrawSignatureCanvasProps> = ({
         disabled={disabled || !signature}
         fullWidth
       >
-        {t('certSign.collab.signRequest.clearSignature', 'Clear Signature')}
+        {t("certSign.collab.signRequest.clearSignature", "Clear Signature")}
       </Button>
     </Stack>
   );
diff --git a/frontend/src/core/components/shared/wetSignature/SignatureTypeSelector.tsx b/frontend/src/core/components/shared/wetSignature/SignatureTypeSelector.tsx
index fa9ddb2ced..a0875aa7ae 100644
--- a/frontend/src/core/components/shared/wetSignature/SignatureTypeSelector.tsx
+++ b/frontend/src/core/components/shared/wetSignature/SignatureTypeSelector.tsx
@@ -1,7 +1,7 @@
-import { SegmentedControl } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
+import { SegmentedControl } from "@mantine/core";
+import { useTranslation } from "react-i18next";
 
-export type SignatureType = 'draw' | 'upload' | 'type';
+export type SignatureType = "draw" | "upload" | "type";
 
 interface SignatureTypeSelectorProps {
   value: SignatureType;
@@ -23,16 +23,19 @@ export const SignatureTypeSelector: React.FC<SignatureTypeSelectorProps> = ({
       disabled={disabled}
       data={[
         {
-          value: 'draw',
-          label: t('certSign.collab.signRequest.signatureType.draw', 'Draw'),
+          value: "draw",
+          label: t("certSign.collab.signRequest.signatureType.draw", "Draw"),
         },
         {
-          value: 'upload',
-          label: t('certSign.collab.signRequest.signatureType.upload', 'Upload'),
+          value: "upload",
+          label: t(
+            "certSign.collab.signRequest.signatureType.upload",
+            "Upload",
+          ),
         },
         {
-          value: 'type',
-          label: t('certSign.collab.signRequest.signatureType.type', 'Type'),
+          value: "type",
+          label: t("certSign.collab.signRequest.signatureType.type", "Type"),
         },
       ]}
       fullWidth
diff --git a/frontend/src/core/components/shared/wetSignature/TypeSignatureText.tsx b/frontend/src/core/components/shared/wetSignature/TypeSignatureText.tsx
index c6b3c9246a..fc13d85cfb 100644
--- a/frontend/src/core/components/shared/wetSignature/TypeSignatureText.tsx
+++ b/frontend/src/core/components/shared/wetSignature/TypeSignatureText.tsx
@@ -1,6 +1,13 @@
-import { Stack, TextInput, Select, ColorPicker, Slider, Text } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { useEffect, useRef } from 'react';
+import {
+  Stack,
+  TextInput,
+  Select,
+  ColorPicker,
+  Slider,
+  Text,
+} from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import { useEffect, useRef } from "react";
 
 interface TypeSignatureTextProps {
   text: string;
@@ -38,7 +45,7 @@ export const TypeSignatureText: React.FC<TypeSignatureTextProps> = ({
     }
 
     const canvas = canvasRef.current;
-    const ctx = canvas.getContext('2d');
+    const ctx = canvas.getContext("2d");
     if (!ctx) return;
 
     // Clear canvas
@@ -52,40 +59,46 @@ export const TypeSignatureText: React.FC<TypeSignatureTextProps> = ({
 
     // Center text on canvas
     ctx.fillStyle = color;
-    ctx.textBaseline = 'middle';
+    ctx.textBaseline = "middle";
     ctx.fillText(text, (canvas.width - textWidth) / 2, canvas.height / 2);
 
     // Convert to base64
-    const dataUrl = canvas.toDataURL('image/png');
+    const dataUrl = canvas.toDataURL("image/png");
     onSignatureChange(dataUrl);
   }, [text, fontFamily, fontSize, color, onSignatureChange]);
 
   const fontOptions = [
-    { value: 'Arial', label: 'Arial' },
-    { value: 'Times New Roman', label: 'Times New Roman' },
-    { value: 'Courier New', label: 'Courier New' },
-    { value: 'Georgia', label: 'Georgia' },
-    { value: 'Verdana', label: 'Verdana' },
-    { value: 'Comic Sans MS', label: 'Comic Sans MS' },
-    { value: 'Brush Script MT', label: 'Brush Script MT (cursive)' },
+    { value: "Arial", label: "Arial" },
+    { value: "Times New Roman", label: "Times New Roman" },
+    { value: "Courier New", label: "Courier New" },
+    { value: "Georgia", label: "Georgia" },
+    { value: "Verdana", label: "Verdana" },
+    { value: "Comic Sans MS", label: "Comic Sans MS" },
+    { value: "Brush Script MT", label: "Brush Script MT (cursive)" },
   ];
 
   return (
     <Stack gap="sm">
       <Text size="sm" c="dimmed">
-        {t('certSign.collab.signRequest.typeSignature', 'Type your name to create a signature')}
+        {t(
+          "certSign.collab.signRequest.typeSignature",
+          "Type your name to create a signature",
+        )}
       </Text>
 
       <TextInput
-        label={t('certSign.collab.signRequest.signatureText', 'Signature Text')}
-        placeholder={t('certSign.collab.signRequest.signatureTextPlaceholder', 'Enter your name...')}
+        label={t("certSign.collab.signRequest.signatureText", "Signature Text")}
+        placeholder={t(
+          "certSign.collab.signRequest.signatureTextPlaceholder",
+          "Enter your name...",
+        )}
         value={text}
         onChange={(e) => onTextChange(e.target.value)}
         disabled={disabled}
       />
 
       <Select
-        label={t('certSign.collab.signRequest.fontFamily', 'Font Family')}
+        label={t("certSign.collab.signRequest.fontFamily", "Font Family")}
         value={fontFamily}
         onChange={(val) => val && onFontFamilyChange(val)}
         data={fontOptions}
@@ -94,7 +107,9 @@ export const TypeSignatureText: React.FC<TypeSignatureTextProps> = ({
 
       <div>
         <Text size="sm" mb={4}>
-          {t('certSign.collab.signRequest.fontSize', 'Font Size: {{size}}px', { size: fontSize })}
+          {t("certSign.collab.signRequest.fontSize", "Font Size: {{size}}px", {
+            size: fontSize,
+          })}
         </Text>
         <Slider
           value={fontSize}
@@ -104,36 +119,32 @@ export const TypeSignatureText: React.FC<TypeSignatureTextProps> = ({
           step={2}
           disabled={disabled}
           marks={[
-            { value: 20, label: '20' },
-            { value: 50, label: '50' },
-            { value: 80, label: '80' },
+            { value: 20, label: "20" },
+            { value: 50, label: "50" },
+            { value: 80, label: "80" },
           ]}
         />
       </div>
 
       <div>
         <Text size="sm" mb={4}>
-          {t('certSign.collab.signRequest.textColor', 'Text Color')}
+          {t("certSign.collab.signRequest.textColor", "Text Color")}
         </Text>
-        <ColorPicker
-          value={color}
-          onChange={onColorChange}
-          format="hex"
-        />
+        <ColorPicker value={color} onChange={onColorChange} format="hex" />
       </div>
 
       {/* Preview */}
       {text && (
         <div
           style={{
-            border: '1px solid var(--mantine-color-default-border)',
-            borderRadius: 'var(--mantine-radius-default)',
-            padding: '16px',
-            backgroundColor: 'white',
-            minHeight: '100px',
-            display: 'flex',
-            justifyContent: 'center',
-            alignItems: 'center',
+            border: "1px solid var(--mantine-color-default-border)",
+            borderRadius: "var(--mantine-radius-default)",
+            padding: "16px",
+            backgroundColor: "white",
+            minHeight: "100px",
+            display: "flex",
+            justifyContent: "center",
+            alignItems: "center",
           }}
         >
           <Text
@@ -153,7 +164,7 @@ export const TypeSignatureText: React.FC<TypeSignatureTextProps> = ({
         ref={canvasRef}
         width={400}
         height={150}
-        style={{ display: 'none' }}
+        style={{ display: "none" }}
       />
     </Stack>
   );
diff --git a/frontend/src/core/components/shared/wetSignature/UploadSignatureImage.tsx b/frontend/src/core/components/shared/wetSignature/UploadSignatureImage.tsx
index ff593042a1..49d4c22ca4 100644
--- a/frontend/src/core/components/shared/wetSignature/UploadSignatureImage.tsx
+++ b/frontend/src/core/components/shared/wetSignature/UploadSignatureImage.tsx
@@ -1,8 +1,8 @@
-import { useState, useRef } from 'react';
-import { Stack, Button, Text, Image } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import UploadFileIcon from '@mui/icons-material/UploadFile';
-import DeleteIcon from '@mui/icons-material/Delete';
+import { useState, useRef } from "react";
+import { Stack, Button, Text, Image } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import UploadFileIcon from "@mui/icons-material/UploadFile";
+import DeleteIcon from "@mui/icons-material/Delete";
 
 interface UploadSignatureImageProps {
   signature: string | null;
@@ -24,14 +24,24 @@ export const UploadSignatureImage: React.FC<UploadSignatureImageProps> = ({
     if (!file) return;
 
     // Validate file type
-    if (!file.type.startsWith('image/')) {
-      setError(t('certSign.collab.signRequest.invalidFileType', 'Please select an image file'));
+    if (!file.type.startsWith("image/")) {
+      setError(
+        t(
+          "certSign.collab.signRequest.invalidFileType",
+          "Please select an image file",
+        ),
+      );
       return;
     }
 
     // Validate file size (max 5MB)
     if (file.size > 5 * 1024 * 1024) {
-      setError(t('certSign.collab.signRequest.fileTooLarge', 'File size must be less than 5MB'));
+      setError(
+        t(
+          "certSign.collab.signRequest.fileTooLarge",
+          "File size must be less than 5MB",
+        ),
+      );
       return;
     }
 
@@ -54,35 +64,38 @@ export const UploadSignatureImage: React.FC<UploadSignatureImageProps> = ({
     onChange(null);
     setError(null);
     if (fileInputRef.current) {
-      fileInputRef.current.value = '';
+      fileInputRef.current.value = "";
     }
   };
 
   return (
     <Stack gap="sm">
       <Text size="sm" c="dimmed">
-        {t('certSign.collab.signRequest.uploadSignature', 'Upload your signature image')}
+        {t(
+          "certSign.collab.signRequest.uploadSignature",
+          "Upload your signature image",
+        )}
       </Text>
 
       {signature ? (
         <Stack gap="sm">
           <div
             style={{
-              border: '1px solid var(--mantine-color-default-border)',
-              borderRadius: 'var(--mantine-radius-default)',
-              padding: '16px',
-              backgroundColor: 'var(--mantine-color-default-hover)',
-              display: 'flex',
-              justifyContent: 'center',
-              alignItems: 'center',
-              minHeight: '150px',
+              border: "1px solid var(--mantine-color-default-border)",
+              borderRadius: "var(--mantine-radius-default)",
+              padding: "16px",
+              backgroundColor: "var(--mantine-color-default-hover)",
+              display: "flex",
+              justifyContent: "center",
+              alignItems: "center",
+              minHeight: "150px",
             }}
           >
             <Image
               src={signature}
               alt="Signature"
               fit="contain"
-              style={{ maxHeight: '150px', maxWidth: '100%' }}
+              style={{ maxHeight: "150px", maxWidth: "100%" }}
             />
           </div>
 
@@ -94,7 +107,7 @@ export const UploadSignatureImage: React.FC<UploadSignatureImageProps> = ({
             disabled={disabled}
             fullWidth
           >
-            {t('certSign.collab.signRequest.removeImage', 'Remove Image')}
+            {t("certSign.collab.signRequest.removeImage", "Remove Image")}
           </Button>
         </Stack>
       ) : (
@@ -105,7 +118,7 @@ export const UploadSignatureImage: React.FC<UploadSignatureImageProps> = ({
           disabled={disabled}
           fullWidth
         >
-          {t('certSign.collab.signRequest.selectFile', 'Select Image File')}
+          {t("certSign.collab.signRequest.selectFile", "Select Image File")}
         </Button>
       )}
 
@@ -119,7 +132,7 @@ export const UploadSignatureImage: React.FC<UploadSignatureImageProps> = ({
         ref={fileInputRef}
         type="file"
         accept="image/*"
-        style={{ display: 'none' }}
+        style={{ display: "none" }}
         onChange={handleFileSelect}
         disabled={disabled}
       />
diff --git a/frontend/src/core/components/toast/ToastContext.tsx b/frontend/src/core/components/toast/ToastContext.tsx
index e161d33683..a300dc1791 100644
--- a/frontend/src/core/components/toast/ToastContext.tsx
+++ b/frontend/src/core/components/toast/ToastContext.tsx
@@ -1,8 +1,20 @@
-import React, { createContext, useCallback, useContext, useMemo, useRef, useState, useEffect } from 'react';
-import { ToastApi, ToastInstance, ToastOptions } from '@app/components/toast/types';
+import React, {
+  createContext,
+  useCallback,
+  useContext,
+  useMemo,
+  useRef,
+  useState,
+  useEffect,
+} from "react";
+import {
+  ToastApi,
+  ToastInstance,
+  ToastOptions,
+} from "@app/components/toast/types";
 
 function normalizeProgress(value: number | undefined): number | undefined {
-  if (typeof value !== 'number' || Number.isNaN(value)) return undefined;
+  if (typeof value !== "number" || Number.isNaN(value)) return undefined;
   // Accept 0..1 as fraction or 0..100 as percent
   if (value <= 1) return Math.max(0, Math.min(1, value)) * 100;
   return Math.max(0, Math.min(100, value));
@@ -12,14 +24,29 @@ function generateId() {
   return `toast_${Math.random().toString(36).slice(2, 9)}`;
 }
 
-type DefaultOpts = Required<Pick<ToastOptions, 'alertType' | 'title' | 'isPersistentPopup' | 'location' | 'durationMs'>> &
-  Partial<Omit<ToastOptions, 'id' | 'alertType' | 'title' | 'isPersistentPopup' | 'location' | 'durationMs'>>;
+type DefaultOpts = Required<
+  Pick<
+    ToastOptions,
+    "alertType" | "title" | "isPersistentPopup" | "location" | "durationMs"
+  >
+> &
+  Partial<
+    Omit<
+      ToastOptions,
+      | "id"
+      | "alertType"
+      | "title"
+      | "isPersistentPopup"
+      | "location"
+      | "durationMs"
+    >
+  >;
 
 const defaultOptions: DefaultOpts = {
-  alertType: 'neutral',
-  title: '',
+  alertType: "neutral",
+  title: "",
   isPersistentPopup: false,
-  location: 'bottom-right',
+  location: "bottom-right",
   durationMs: 6000,
 };
 
@@ -31,7 +58,7 @@ const ToastContext = createContext<ToastContextShape | null>(null);
 
 export function useToast() {
   const ctx = useContext(ToastContext);
-  if (!ctx) throw new Error('useToast must be used within ToastProvider');
+  if (!ctx) throw new Error("useToast must be used within ToastProvider");
   return ctx;
 }
 
@@ -43,105 +70,139 @@ export function ToastProvider({ children }: { children: React.ReactNode }) {
     if (toast.isPersistentPopup) return;
     window.clearTimeout(timers.current[toast.id]);
     timers.current[toast.id] = window.setTimeout(() => {
-      setToasts(prev => prev.filter(t => t.id !== toast.id));
+      setToasts((prev) => prev.filter((t) => t.id !== toast.id));
     }, toast.durationMs);
   }, []);
 
-  const show = useCallback<ToastApi['show']>((options) => {
-    const id = options.id || generateId();
-    const hasButton = !!(options.buttonText && options.buttonCallback);
-    const merged: ToastInstance = {
-      ...defaultOptions,
-      ...options,
-      id,
-      progress: normalizeProgress(options.progressBarPercentage),
-      justCompleted: false,
-      expandable: hasButton ? false : (options.expandable !== false),
-      isExpanded: hasButton ? true : (options.expandable === false ? true : (options.alertType === 'error' ? true : false)),
-      createdAt: Date.now(),
-    } as ToastInstance;
-    setToasts(prev => {
-      // Coalesce duplicates by alertType + title + body text if no explicit id was provided
-      if (!options.id) {
-        const bodyText = typeof merged.body === 'string' ? merged.body : '';
-        const existingIndex = prev.findIndex(t => t.alertType === merged.alertType && t.title === merged.title && (typeof t.body === 'string' ? t.body : '') === bodyText);
-        if (existingIndex !== -1) {
-          const updated = [...prev];
-          const existing = updated[existingIndex];
-          const nextCount = (existing.count ?? 1) + 1;
-          updated[existingIndex] = { ...existing, count: nextCount, createdAt: Date.now() };
-          return updated;
-        }
-      }
-      const next = [...prev.filter(t => t.id !== id), merged];
-      return next;
-    });
-    scheduleAutoDismiss(merged);
-    return id;
-  }, [scheduleAutoDismiss]);
-
-  const update = useCallback<ToastApi['update']>((id, updates) => {
-    setToasts(prev => prev.map(t => {
-      if (t.id !== id) return t;
-      const progress = updates.progressBarPercentage !== undefined
-        ? normalizeProgress(updates.progressBarPercentage)
-        : t.progress;
-
-      const next: ToastInstance = {
-        ...t,
-        ...updates,
-        progress,
+  const show = useCallback<ToastApi["show"]>(
+    (options) => {
+      const id = options.id || generateId();
+      const hasButton = !!(options.buttonText && options.buttonCallback);
+      const merged: ToastInstance = {
+        ...defaultOptions,
+        ...options,
+        id,
+        progress: normalizeProgress(options.progressBarPercentage),
+        justCompleted: false,
+        expandable: hasButton ? false : options.expandable !== false,
+        isExpanded: hasButton
+          ? true
+          : options.expandable === false
+            ? true
+            : options.alertType === "error"
+              ? true
+              : false,
+        createdAt: Date.now(),
       } as ToastInstance;
+      setToasts((prev) => {
+        // Coalesce duplicates by alertType + title + body text if no explicit id was provided
+        if (!options.id) {
+          const bodyText = typeof merged.body === "string" ? merged.body : "";
+          const existingIndex = prev.findIndex(
+            (t) =>
+              t.alertType === merged.alertType &&
+              t.title === merged.title &&
+              (typeof t.body === "string" ? t.body : "") === bodyText,
+          );
+          if (existingIndex !== -1) {
+            const updated = [...prev];
+            const existing = updated[existingIndex];
+            const nextCount = (existing.count ?? 1) + 1;
+            updated[existingIndex] = {
+              ...existing,
+              count: nextCount,
+              createdAt: Date.now(),
+            };
+            return updated;
+          }
+        }
+        const next = [...prev.filter((t) => t.id !== id), merged];
+        return next;
+      });
+      scheduleAutoDismiss(merged);
+      return id;
+    },
+    [scheduleAutoDismiss],
+  );
 
-      // Detect completion but do not auto-flip to success.
-      // Callers (e.g., compare workbench) explicitly set alertType when done.
-      if (typeof progress === 'number' && progress >= 100 && !t.justCompleted) {
-        next.justCompleted = true;
-      }
+  const update = useCallback<ToastApi["update"]>((id, updates) => {
+    setToasts((prev) =>
+      prev.map((t) => {
+        if (t.id !== id) return t;
+        const progress =
+          updates.progressBarPercentage !== undefined
+            ? normalizeProgress(updates.progressBarPercentage)
+            : t.progress;
 
-      return next;
-    }));
+        const next: ToastInstance = {
+          ...t,
+          ...updates,
+          progress,
+        } as ToastInstance;
+
+        // Detect completion but do not auto-flip to success.
+        // Callers (e.g., compare workbench) explicitly set alertType when done.
+        if (
+          typeof progress === "number" &&
+          progress >= 100 &&
+          !t.justCompleted
+        ) {
+          next.justCompleted = true;
+        }
+
+        return next;
+      }),
+    );
   }, []);
 
-  const updateProgress = useCallback<ToastApi['updateProgress']>((id, progress) => {
-    update(id, { progressBarPercentage: progress });
-  }, [update]);
+  const updateProgress = useCallback<ToastApi["updateProgress"]>(
+    (id, progress) => {
+      update(id, { progressBarPercentage: progress });
+    },
+    [update],
+  );
 
-  const dismiss = useCallback<ToastApi['dismiss']>((id) => {
-    setToasts(prev => prev.filter(t => t.id !== id));
+  const dismiss = useCallback<ToastApi["dismiss"]>((id) => {
+    setToasts((prev) => prev.filter((t) => t.id !== id));
     window.clearTimeout(timers.current[id]);
     delete timers.current[id];
   }, []);
 
-  const dismissAll = useCallback<ToastApi['dismissAll']>(() => {
+  const dismissAll = useCallback<ToastApi["dismissAll"]>(() => {
     setToasts([]);
-    Object.values(timers.current).forEach(t => window.clearTimeout(t));
+    Object.values(timers.current).forEach((t) => window.clearTimeout(t));
     timers.current = {};
   }, []);
 
-  const value = useMemo<ToastContextShape>(() => ({
-    toasts,
-    show,
-    update,
-    updateProgress,
-    dismiss,
-    dismissAll,
-  }), [toasts, show, update, updateProgress, dismiss, dismissAll]);
+  const value = useMemo<ToastContextShape>(
+    () => ({
+      toasts,
+      show,
+      update,
+      updateProgress,
+      dismiss,
+      dismissAll,
+    }),
+    [toasts, show, update, updateProgress, dismiss, dismissAll],
+  );
 
   // Handle expand/collapse toggles from renderer without widening API
   useEffect(() => {
     const handler = (e: Event) => {
       const detail = (e as CustomEvent).detail as { id: string } | undefined;
       if (!detail?.id) return;
-      setToasts(prev => prev.map(t => t.id === detail.id ? { ...t, isExpanded: !t.isExpanded } : t));
+      setToasts((prev) =>
+        prev.map((t) =>
+          t.id === detail.id ? { ...t, isExpanded: !t.isExpanded } : t,
+        ),
+      );
     };
-    window.addEventListener('toast:toggle', handler as EventListener);
-    return () => window.removeEventListener('toast:toggle', handler as EventListener);
+    window.addEventListener("toast:toggle", handler as EventListener);
+    return () =>
+      window.removeEventListener("toast:toggle", handler as EventListener);
   }, []);
 
   return (
     <ToastContext.Provider value={value}>{children}</ToastContext.Provider>
   );
 }
-
-
diff --git a/frontend/src/core/components/toast/ToastRenderer.tsx b/frontend/src/core/components/toast/ToastRenderer.tsx
index 80e4c12f1d..d67e07ffda 100644
--- a/frontend/src/core/components/toast/ToastRenderer.tsx
+++ b/frontend/src/core/components/toast/ToastRenderer.tsx
@@ -1,14 +1,14 @@
-import { useToast } from '@app/components/toast/ToastContext';
-import { ToastInstance, ToastLocation } from '@app/components/toast/types';
-import { LocalIcon } from '@app/components/shared/LocalIcon';
-import '@app/components/toast/ToastRenderer.css';
+import { useToast } from "@app/components/toast/ToastContext";
+import { ToastInstance, ToastLocation } from "@app/components/toast/types";
+import { LocalIcon } from "@app/components/shared/LocalIcon";
+import "@app/components/toast/ToastRenderer.css";
 
 const locationToClass: Record<ToastLocation, string> = {
-  'top-left': 'toast-container--top-left',
-  'top-right': 'toast-container--top-right',
-  'bottom-left': 'toast-container--bottom-left',
-  'bottom-right': 'toast-container--bottom-right',
-  'bottom-center': 'toast-container--bottom-center',
+  "top-left": "toast-container--top-left",
+  "top-right": "toast-container--top-right",
+  "bottom-left": "toast-container--bottom-left",
+  "bottom-right": "toast-container--bottom-right",
+  "bottom-center": "toast-container--bottom-center",
 };
 
 function getToastItemClass(t: ToastInstance): string {
@@ -25,52 +25,61 @@ function getActionButtonClass(t: ToastInstance): string {
 
 function getDefaultIconName(t: ToastInstance): string {
   switch (t.alertType) {
-    case 'success':
-      return 'check-circle-rounded';
-    case 'error':
-      return 'cancel';
-    case 'warning':
-      return 'warning';
-    case 'neutral':
+    case "success":
+      return "check-circle-rounded";
+    case "error":
+      return "cancel";
+    case "warning":
+      return "warning";
+    case "neutral":
     default:
-      return 'info';
+      return "info";
   }
 }
 
 export default function ToastRenderer() {
   const { toasts, dismiss } = useToast();
 
-  const grouped = toasts.reduce<Record<ToastLocation, ToastInstance[]>>((acc, t) => {
-    const key = t.location;
-    if (!acc[key]) acc[key] = [] as ToastInstance[];
-    acc[key].push(t);
-    return acc;
-  }, { 'top-left': [], 'top-right': [], 'bottom-left': [], 'bottom-right': [], 'bottom-center': [] });
+  const grouped = toasts.reduce<Record<ToastLocation, ToastInstance[]>>(
+    (acc, t) => {
+      const key = t.location;
+      if (!acc[key]) acc[key] = [] as ToastInstance[];
+      acc[key].push(t);
+      return acc;
+    },
+    {
+      "top-left": [],
+      "top-right": [],
+      "bottom-left": [],
+      "bottom-right": [],
+      "bottom-center": [],
+    },
+  );
 
   return (
     <>
       {(Object.keys(grouped) as ToastLocation[]).map((loc) => (
         <div key={loc} className={`toast-container ${locationToClass[loc]}`}>
-          {grouped[loc].map(t => {
+          {grouped[loc].map((t) => {
             return (
-              <div
-                key={t.id}
-                role="status"
-                className={getToastItemClass(t)}
-              >
+              <div key={t.id} role="status" className={getToastItemClass(t)}>
                 {/* Top row: Icon + Title + Controls */}
                 <div className="toast-header">
                   {/* Icon */}
                   <div className="toast-icon">
                     {t.icon ?? (
-                      <LocalIcon icon={getDefaultIconName(t)} width={20} height={20} />
+                      <LocalIcon
+                        icon={getDefaultIconName(t)}
+                        width={20}
+                        height={20}
+                      />
                     )}
                   </div>
 
                   {/* Title + count badge */}
                   <div className="toast-title-container">
                     <span>{t.title}</span>
-                    {typeof t.count === 'number' && t.count > 1 && (
+                    {typeof t.count === "number" && t.count > 1 && (
                       <span className="toast-count-badge">{t.count}</span>
                     )}
                   </div>
@@ -81,10 +90,12 @@ export default function ToastRenderer() {
                       <button
                         aria-label="Toggle details"
                         onClick={() => {
-                          const evt = new CustomEvent('toast:toggle', { detail: { id: t.id } });
+                          const evt = new CustomEvent("toast:toggle", {
+                            detail: { id: t.id },
+                          });
                           window.dispatchEvent(evt);
                         }}
-                        className={`toast-button toast-expand-button ${t.isExpanded ? 'toast-expand-button--expanded' : ''}`}
+                        className={`toast-button toast-expand-button ${t.isExpanded ? "toast-expand-button--expanded" : ""}`}
                       >
                         <LocalIcon icon="expand-more-rounded" />
                       </button>
@@ -99,7 +110,7 @@ export default function ToastRenderer() {
                   </div>
                 </div>
                 {/* Progress bar - always show when present */}
-                {typeof t.progress === 'number' && (
+                {typeof t.progress === "number" && (
                   <div className="toast-progress-container">
                     <div
                       className={getProgressBarClass(t)}
@@ -110,9 +121,7 @@ export default function ToastRenderer() {
 
                 {/* Body content - only show when expanded */}
                 {(t.isExpanded || !t.expandable) && (
-                  <div className="toast-body">
-                    {t.body}
-                  </div>
+                  <div className="toast-body">{t.body}</div>
                 )}
 
                 {/* Button - always show when present, positioned below body */}
@@ -134,5 +143,3 @@ export default function ToastRenderer() {
     </>
   );
 }
-
-
diff --git a/frontend/src/core/components/toast/index.ts b/frontend/src/core/components/toast/index.ts
index 39f6093ea4..08fc95d2cb 100644
--- a/frontend/src/core/components/toast/index.ts
+++ b/frontend/src/core/components/toast/index.ts
@@ -1,6 +1,10 @@
-import { ToastApi, ToastInstance, ToastOptions } from '@app/components/toast/types';
-import { useToast, ToastProvider } from '@app/components/toast/ToastContext';
-import ToastRenderer from '@app/components/toast/ToastRenderer';
+import {
+  ToastApi,
+  ToastInstance,
+  ToastOptions,
+} from "@app/components/toast/types";
+import { useToast, ToastProvider } from "@app/components/toast/ToastContext";
+import ToastRenderer from "@app/components/toast/ToastRenderer";
 
 export { useToast, ToastProvider, ToastRenderer };
 
@@ -15,7 +19,7 @@ function createImperativeApi() {
   return {
     provide(instance: ToastContextApi) {
       api = instance;
-      subscribers.splice(0).forEach(cb => cb(instance));
+      subscribers.splice(0).forEach((cb) => cb(instance));
     },
     get(): ToastContextApi | null {
       return api;
@@ -45,8 +49,10 @@ export function alert(options: ToastOptions) {
     return _api.get()!.show(options);
   }
   // Queue until provider mounts
-  let id = '';
-  _api?.onReady((api) => { id = api.show(options); });
+  let id = "";
+  _api?.onReady((api) => {
+    id = api.show(options);
+  });
   return id;
 }
 
@@ -65,4 +71,3 @@ export function dismissToast(id: string) {
 export function dismissAllToasts() {
   _api?.get()?.dismissAll();
 }
-
diff --git a/frontend/src/core/components/toast/types.ts b/frontend/src/core/components/toast/types.ts
index 764e14c34c..1377cda4b4 100644
--- a/frontend/src/core/components/toast/types.ts
+++ b/frontend/src/core/components/toast/types.ts
@@ -1,7 +1,12 @@
-import { ReactNode } from 'react';
+import { ReactNode } from "react";
 
-export type ToastLocation = 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right' | 'bottom-center';
-export type ToastAlertType = 'success' | 'error' | 'warning' | 'neutral';
+export type ToastLocation =
+  | "top-left"
+  | "top-right"
+  | "bottom-left"
+  | "bottom-right"
+  | "bottom-center";
+export type ToastAlertType = "success" | "error" | "warning" | "neutral";
 
 export interface ToastOptions {
   alertType?: ToastAlertType;
@@ -22,7 +27,10 @@ export interface ToastOptions {
   expandable?: boolean;
 }
 
-export interface ToastInstance extends Omit<ToastOptions, 'id' | 'progressBarPercentage'> {
+export interface ToastInstance extends Omit<
+  ToastOptions,
+  "id" | "progressBarPercentage"
+> {
   id: string;
   alertType: ToastAlertType;
   isPersistentPopup: boolean;
@@ -46,5 +54,3 @@ export interface ToastApi {
   dismiss: (id: string) => void;
   dismissAll: () => void;
 }
-
-
diff --git a/frontend/src/core/components/tools/FullscreenToolList.tsx b/frontend/src/core/components/tools/FullscreenToolList.tsx
index 4c01b492ba..ef7818ff9d 100644
--- a/frontend/src/core/components/tools/FullscreenToolList.tsx
+++ b/frontend/src/core/components/tools/FullscreenToolList.tsx
@@ -1,21 +1,29 @@
-import { useMemo } from 'react';
-import { Text } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { ToolRegistryEntry, getSubcategoryLabel, getSubcategoryColor, getSubcategoryIcon } from '@app/data/toolsTaxonomy';
-import { ToolId } from '@app/types/toolId';
-import { useToolSections } from '@app/hooks/useToolSections';
-import NoToolsFound from '@app/components/tools/shared/NoToolsFound';
-import { useToolWorkflow } from '@app/contexts/ToolWorkflowContext';
-import StarRoundedIcon from '@mui/icons-material/StarRounded';
-import ThumbUpRoundedIcon from '@mui/icons-material/ThumbUpRounded';
-import Badge from '@app/components/shared/Badge';
-import '@app/components/tools/ToolPanel.css';
-import DetailedToolItem from '@app/components/tools/fullscreen/DetailedToolItem';
-import CompactToolItem from '@app/components/tools/fullscreen/CompactToolItem';
-import { useFavoriteToolItems } from '@app/hooks/tools/useFavoriteToolItems';
+import { useMemo } from "react";
+import { Text } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import {
+  ToolRegistryEntry,
+  getSubcategoryLabel,
+  getSubcategoryColor,
+  getSubcategoryIcon,
+} from "@app/data/toolsTaxonomy";
+import { ToolId } from "@app/types/toolId";
+import { useToolSections } from "@app/hooks/useToolSections";
+import NoToolsFound from "@app/components/tools/shared/NoToolsFound";
+import { useToolWorkflow } from "@app/contexts/ToolWorkflowContext";
+import StarRoundedIcon from "@mui/icons-material/StarRounded";
+import ThumbUpRoundedIcon from "@mui/icons-material/ThumbUpRounded";
+import Badge from "@app/components/shared/Badge";
+import "@app/components/tools/ToolPanel.css";
+import DetailedToolItem from "@app/components/tools/fullscreen/DetailedToolItem";
+import CompactToolItem from "@app/components/tools/fullscreen/CompactToolItem";
+import { useFavoriteToolItems } from "@app/hooks/tools/useFavoriteToolItems";
 
 interface FullscreenToolListProps {
-  filteredTools: Array<{ item: [ToolId, ToolRegistryEntry]; matchedText?: string }>;
+  filteredTools: Array<{
+    item: [ToolId, ToolRegistryEntry];
+    matchedText?: string;
+  }>;
   searchQuery: string;
   showDescriptions: boolean;
   selectedToolKey: string | null;
@@ -34,29 +42,40 @@ const FullscreenToolList = ({
   const { t } = useTranslation();
   const { toolRegistry, favoriteTools } = useToolWorkflow();
 
-  const { sections, searchGroups } = useToolSections(filteredTools, searchQuery);
-
-  const tooltipPortalTarget = typeof document !== 'undefined' ? document.body : undefined;
+  const { sections, searchGroups } = useToolSections(
+    filteredTools,
+    searchQuery,
+  );
 
+  const tooltipPortalTarget =
+    typeof document !== "undefined" ? document.body : undefined;
 
   const favoriteToolItems = useFavoriteToolItems(favoriteTools, toolRegistry);
 
-  const quickSection = useMemo(() => sections.find(section => section.key === 'quick'), [sections]);
+  const quickSection = useMemo(
+    () => sections.find((section) => section.key === "quick"),
+    [sections],
+  );
   const recommendedItems = useMemo(() => {
-    if (!quickSection) return [] as Array<{ id: string, tool: ToolRegistryEntry }>;
-    const items: Array<{ id: string, tool: ToolRegistryEntry }> = [];
-    quickSection.subcategories.forEach(sc => sc.tools.forEach(t => items.push(t)));
+    if (!quickSection)
+      return [] as Array<{ id: string; tool: ToolRegistryEntry }>;
+    const items: Array<{ id: string; tool: ToolRegistryEntry }> = [];
+    quickSection.subcategories.forEach((sc) =>
+      sc.tools.forEach((t) => items.push(t)),
+    );
     return items;
   }, [quickSection]);
 
   // Show recommended/favorites section only when not searching
-  const showRecentFavorites = searchQuery.trim().length === 0 && ((recommendedItems.length > 0) || favoriteToolItems.length > 0);
+  const showRecentFavorites =
+    searchQuery.trim().length === 0 &&
+    (recommendedItems.length > 0 || favoriteToolItems.length > 0);
 
   const subcategoryGroups = useMemo(() => {
     if (searchQuery.trim().length > 0) {
       return searchGroups;
     }
-    const allSection = sections.find(section => section.key === 'all');
+    const allSection = sections.find((section) => section.key === "all");
     return allSection ? allSection.subcategories : [];
   }, [searchGroups, sections, searchQuery]);
 
@@ -65,24 +84,28 @@ const FullscreenToolList = ({
       <div className="tool-panel__fullscreen-empty">
         <NoToolsFound />
         <Text size="sm" c="dimmed">
-          {t('toolPanel.fullscreen.noResults', 'Try adjusting your search or toggle descriptions to find what you need.')}
+          {t(
+            "toolPanel.fullscreen.noResults",
+            "Try adjusting your search or toggle descriptions to find what you need.",
+          )}
         </Text>
       </div>
     );
   }
 
   const containerClass = showDescriptions
-    ? 'tool-panel__fullscreen-groups tool-panel__fullscreen-groups--detailed'
-    : 'tool-panel__fullscreen-groups tool-panel__fullscreen-groups--compact';
+    ? "tool-panel__fullscreen-groups tool-panel__fullscreen-groups--detailed"
+    : "tool-panel__fullscreen-groups tool-panel__fullscreen-groups--compact";
 
   // Helper function to render a tool item
   const renderToolItem = (id: ToolId, tool: ToolRegistryEntry) => {
     const isSelected = selectedToolKey === id;
 
     const handleClick = () => {
-      if (!tool.component && !tool.link && id !== 'read' && id !== 'multiTool') return;
+      if (!tool.component && !tool.link && id !== "read" && id !== "multiTool")
+        return;
       if (tool.link) {
-        window.open(tool.link, '_blank', 'noopener,noreferrer');
+        window.open(tool.link, "_blank", "noopener,noreferrer");
         return;
       }
       onSelect(id as ToolId);
@@ -90,12 +113,25 @@ const FullscreenToolList = ({
 
     if (showDescriptions) {
       return (
-        <DetailedToolItem key={id} id={id} tool={tool} isSelected={isSelected} onClick={handleClick} />
+        <DetailedToolItem
+          key={id}
+          id={id}
+          tool={tool}
+          isSelected={isSelected}
+          onClick={handleClick}
+        />
       );
     }
 
     return (
-      <CompactToolItem key={id} id={id} tool={tool} isSelected={isSelected} onClick={handleClick} tooltipPortalTarget={tooltipPortalTarget} />
+      <CompactToolItem
+        key={id}
+        id={id}
+        tool={tool}
+        isSelected={isSelected}
+        onClick={handleClick}
+        tooltipPortalTarget={tooltipPortalTarget}
+      />
     );
   };
 
@@ -107,7 +143,7 @@ const FullscreenToolList = ({
             <section
               className="tool-panel__fullscreen-group tool-panel__fullscreen-group--special"
               style={{
-                borderColor: 'var(--fullscreen-border-favorites)',
+                borderColor: "var(--fullscreen-border-favorites)",
               }}
             >
               <header className="tool-panel__fullscreen-section-header">
@@ -115,14 +151,14 @@ const FullscreenToolList = ({
                   <span
                     className="tool-panel__fullscreen-section-icon"
                     style={{
-                      color: 'var(--special-color-favorites)',
+                      color: "var(--special-color-favorites)",
                     }}
                     aria-hidden
                   >
                     <StarRoundedIcon />
                   </span>
                   <Text size="sm" fw={600} tt="uppercase" lts={0.5} c="dimmed">
-                    {t('toolPanel.fullscreen.favorites', 'Favourites')}
+                    {t("toolPanel.fullscreen.favorites", "Favourites")}
                   </Text>
                 </div>
                 <Badge
@@ -135,11 +171,15 @@ const FullscreenToolList = ({
               </header>
               {showDescriptions ? (
                 <div className="tool-panel__fullscreen-grid tool-panel__fullscreen-grid--detailed">
-                  {favoriteToolItems.map((item) => item && renderToolItem(item.id, item.tool))}
+                  {favoriteToolItems.map(
+                    (item) => item && renderToolItem(item.id, item.tool),
+                  )}
                 </div>
               ) : (
                 <div className="tool-panel__fullscreen-list">
-                  {favoriteToolItems.map((item) => item && renderToolItem(item.id, item.tool))}
+                  {favoriteToolItems.map(
+                    (item) => item && renderToolItem(item.id, item.tool),
+                  )}
                 </div>
               )}
             </section>
@@ -149,7 +189,7 @@ const FullscreenToolList = ({
             <section
               className="tool-panel__fullscreen-group tool-panel__fullscreen-group--special"
               style={{
-                borderColor: 'var(--fullscreen-border-recommended)',
+                borderColor: "var(--fullscreen-border-recommended)",
               }}
             >
               <header className="tool-panel__fullscreen-section-header">
@@ -157,14 +197,14 @@ const FullscreenToolList = ({
                   <span
                     className="tool-panel__fullscreen-section-icon"
                     style={{
-                      color: 'var(--special-color-recommended)',
+                      color: "var(--special-color-recommended)",
                     }}
                     aria-hidden
                   >
                     <ThumbUpRoundedIcon />
                   </span>
                   <Text size="sm" fw={600} tt="uppercase" lts={0.5} c="dimmed">
-                    {t('toolPanel.fullscreen.recommended', 'Recommended')}
+                    {t("toolPanel.fullscreen.recommended", "Recommended")}
                   </Text>
                 </div>
                 <Badge
@@ -177,11 +217,15 @@ const FullscreenToolList = ({
               </header>
               {showDescriptions ? (
                 <div className="tool-panel__fullscreen-grid tool-panel__fullscreen-grid--detailed">
-                  {recommendedItems.map((item: any) => renderToolItem(item.id, item.tool))}
+                  {recommendedItems.map((item: any) =>
+                    renderToolItem(item.id, item.tool),
+                  )}
                 </div>
               ) : (
                 <div className="tool-panel__fullscreen-list">
-                  {recommendedItems.map((item: any) => renderToolItem(item.id, item.tool))}
+                  {recommendedItems.map((item: any) =>
+                    renderToolItem(item.id, item.tool),
+                  )}
                 </div>
               )}
             </section>
@@ -195,7 +239,7 @@ const FullscreenToolList = ({
         return (
           <section
             key={subcategoryId}
-            className={`tool-panel__fullscreen-group ${showDescriptions ? 'tool-panel__fullscreen-group--detailed' : 'tool-panel__fullscreen-group--compact'}`}
+            className={`tool-panel__fullscreen-group ${showDescriptions ? "tool-panel__fullscreen-group--detailed" : "tool-panel__fullscreen-group--compact"}`}
             style={{
               borderColor: `color-mix(in srgb, ${categoryColor} 25%, var(--fullscreen-border-subtle-65))`,
             }}
@@ -223,22 +267,22 @@ const FullscreenToolList = ({
                   {getSubcategoryLabel(t, subcategoryId)}
                 </Text>
               </div>
-              <Badge
-                size="sm"
-                variant="colored"
-                color={categoryColor}
-              >
+              <Badge size="sm" variant="colored" color={categoryColor}>
                 {tools.length}
               </Badge>
             </header>
 
             {showDescriptions ? (
               <div className="tool-panel__fullscreen-grid tool-panel__fullscreen-grid--detailed">
-                {tools.map(({ id, tool }) => renderToolItem(id as ToolId, tool))}
+                {tools.map(({ id, tool }) =>
+                  renderToolItem(id as ToolId, tool),
+                )}
               </div>
             ) : (
               <div className="tool-panel__fullscreen-list">
-                {tools.map(({ id, tool }) => renderToolItem(id as ToolId, tool))}
+                {tools.map(({ id, tool }) =>
+                  renderToolItem(id as ToolId, tool),
+                )}
               </div>
             )}
           </section>
@@ -249,5 +293,3 @@ const FullscreenToolList = ({
 };
 
 export default FullscreenToolList;
-
-
diff --git a/frontend/src/core/components/tools/FullscreenToolSurface.tsx b/frontend/src/core/components/tools/FullscreenToolSurface.tsx
index 2eedbf5f5a..99683f3923 100644
--- a/frontend/src/core/components/tools/FullscreenToolSurface.tsx
+++ b/frontend/src/core/components/tools/FullscreenToolSurface.tsx
@@ -1,23 +1,26 @@
-import { useState, useRef } from 'react';
-import { ActionIcon, ScrollArea, Switch, useMantineColorScheme } from '@mantine/core';
-import DoubleArrowIcon from '@mui/icons-material/DoubleArrow';
-import { useTranslation } from 'react-i18next';
-import ToolSearch from '@app/components/tools/toolPicker/ToolSearch';
-import FullscreenToolList from '@app/components/tools/FullscreenToolList';
-import { ToolRegistryEntry } from '@app/data/toolsTaxonomy';
-import { ToolId } from '@app/types/toolId';
-import { useFocusTrap } from '@app/hooks/useFocusTrap';
-import { useLogoPath } from '@app/hooks/useLogoPath';
-import { useLogoAssets } from '@app/hooks/useLogoAssets';
-import { Tooltip } from '@app/components/shared/Tooltip';
-import '@app/components/tools/ToolPanel.css';
-import { ToolPanelGeometry } from '@app/hooks/tools/useToolPanelGeometry';
-import { Z_INDEX_OVER_FULLSCREEN_SURFACE } from '@app/styles/zIndex';
+import { useState, useRef } from "react";
+import { ActionIcon, ScrollArea, Switch } from "@mantine/core";
+import DoubleArrowIcon from "@mui/icons-material/DoubleArrow";
+import { useTranslation } from "react-i18next";
+import ToolSearch from "@app/components/tools/toolPicker/ToolSearch";
+import FullscreenToolList from "@app/components/tools/FullscreenToolList";
+import { ToolRegistryEntry } from "@app/data/toolsTaxonomy";
+import { ToolId } from "@app/types/toolId";
+import { useFocusTrap } from "@app/hooks/useFocusTrap";
+import { LogoIcon } from "@app/components/shared/LogoIcon";
+import { Wordmark } from "@app/components/shared/Wordmark";
+import { Tooltip } from "@app/components/shared/Tooltip";
+import "@app/components/tools/ToolPanel.css";
+import { ToolPanelGeometry } from "@app/hooks/tools/useToolPanelGeometry";
+import { Z_INDEX_OVER_FULLSCREEN_SURFACE } from "@app/styles/zIndex";
 
 interface FullscreenToolSurfaceProps {
   searchQuery: string;
   toolRegistry: Partial<Record<ToolId, ToolRegistryEntry>>;
-  filteredTools: Array<{ item: [ToolId, ToolRegistryEntry]; matchedText?: string }>;
+  filteredTools: Array<{
+    item: [ToolId, ToolRegistryEntry];
+    matchedText?: string;
+  }>;
   selectedToolKey: string | null;
   showDescriptions: boolean;
   matchedTextMap: Map<string, string>;
@@ -44,21 +47,20 @@ const FullscreenToolSurface = ({
   geometry,
 }: FullscreenToolSurfaceProps) => {
   const { t } = useTranslation();
-  const { colorScheme } = useMantineColorScheme();
   const [isExiting, setIsExiting] = useState(false);
   const surfaceRef = useRef<HTMLDivElement>(null);
-  const isRTL = typeof document !== 'undefined' && document.documentElement.dir === 'rtl';
+  const isRTL =
+    typeof document !== "undefined" && document.documentElement.dir === "rtl";
 
   // Enable focus trap when surface is active
   useFocusTrap(surfaceRef, !isExiting);
 
   const brandAltText = t("home.mobile.brandAlt", "Stirling PDF logo");
-  const brandIconSrc = useLogoPath();
-  const { wordmark } = useLogoAssets();
-  const brandTextSrc = colorScheme === "dark" ? wordmark.white : wordmark.black;
 
   const handleExit = () => {
-    const prefersReducedMotion = window.matchMedia('(prefers-reduced-motion: reduce)').matches;
+    const prefersReducedMotion = window.matchMedia(
+      "(prefers-reduced-motion: reduce)",
+    ).matches;
 
     if (prefersReducedMotion) {
       onExitFullscreenMode();
@@ -72,11 +74,14 @@ const FullscreenToolSurface = ({
       return;
     }
     // Rely on CSS animation end rather than duplicating timing in JS
-    el.addEventListener('animationend', () => {
-      onExitFullscreenMode();
-    }, { once: true });
-};
-
+    el.addEventListener(
+      "animationend",
+      () => {
+        onExitFullscreenMode();
+      },
+      { once: true },
+    );
+  };
 
   const style = geometry
     ? {
@@ -92,31 +97,43 @@ const FullscreenToolSurface = ({
       className="tool-panel__fullscreen-surface"
       style={style}
       role="region"
-      aria-label={t('toolPanel.fullscreen.heading', 'All tools (fullscreen view)')}
+      aria-label={t(
+        "toolPanel.fullscreen.heading",
+        "All tools (fullscreen view)",
+      )}
       data-tour="tool-panel"
     >
       <div
         ref={surfaceRef}
-        className={`tool-panel__fullscreen-surface-inner ${isExiting ? 'tool-panel__fullscreen-surface-inner--exiting' : ''}`}
+        className={`tool-panel__fullscreen-surface-inner ${isExiting ? "tool-panel__fullscreen-surface-inner--exiting" : ""}`}
       >
         <header className="tool-panel__fullscreen-header">
           <div className="tool-panel__fullscreen-brand">
-            <img src={brandIconSrc} alt="" className="tool-panel__fullscreen-brand-icon" />
-            <img src={brandTextSrc} alt={brandAltText} className="tool-panel__fullscreen-brand-text" />
+            <LogoIcon className="tool-panel__fullscreen-brand-icon" />
+            <Wordmark
+              alt={brandAltText}
+              className="tool-panel__fullscreen-brand-text"
+            />
           </div>
-          <div style={{ display: 'flex', gap: '0.5rem', alignItems: 'center' }}>
-            <Tooltip content={toggleLabel} position="bottom" arrow={true} openOnFocus={false} containerStyle={{ zIndex: Z_INDEX_OVER_FULLSCREEN_SURFACE }}>
+          <div style={{ display: "flex", gap: "0.5rem", alignItems: "center" }}>
+            <Tooltip
+              content={toggleLabel}
+              position="bottom"
+              arrow={true}
+              openOnFocus={false}
+              containerStyle={{ zIndex: Z_INDEX_OVER_FULLSCREEN_SURFACE }}
+            >
               <ActionIcon
                 variant="subtle"
                 radius="xl"
                 size="md"
                 onClick={handleExit}
                 aria-label={toggleLabel}
-                style={{ color: 'var(--right-rail-icon)' }}
+                style={{ color: "var(--right-rail-icon)" }}
               >
                 <DoubleArrowIcon
                   fontSize="small"
-                  style={{ transform: isRTL ? undefined : 'rotate(180deg)' }}
+                  style={{ transform: isRTL ? undefined : "rotate(180deg)" }}
                 />
               </ActionIcon>
             </Tooltip>
@@ -136,12 +153,15 @@ const FullscreenToolSurface = ({
             onChange={() => onToggleDescriptions()}
             size="md"
             labelPosition="left"
-            label={t('toolPanel.fullscreen.showDetails', 'Show Details')}
+            label={t("toolPanel.fullscreen.showDetails", "Show Details")}
           />
         </div>
 
         <div className="tool-panel__fullscreen-body">
-          <ScrollArea className="tool-panel__fullscreen-scroll" offsetScrollbars>
+          <ScrollArea
+            className="tool-panel__fullscreen-scroll"
+            offsetScrollbars
+          >
             <FullscreenToolList
               filteredTools={filteredTools}
               searchQuery={searchQuery}
@@ -158,4 +178,3 @@ const FullscreenToolSurface = ({
 };
 
 export default FullscreenToolSurface;
-
diff --git a/frontend/src/core/components/tools/SearchResults.tsx b/frontend/src/core/components/tools/SearchResults.tsx
index 17e8142eb8..738efd3a8b 100644
--- a/frontend/src/core/components/tools/SearchResults.tsx
+++ b/frontend/src/core/components/tools/SearchResults.tsx
@@ -1,21 +1,31 @@
-import React from 'react';
-import { Box, Stack } from '@mantine/core';
-import { getSubcategoryLabel, ToolRegistryEntry } from '@app/data/toolsTaxonomy';
-import { ToolId } from '@app/types/toolId';
-import ToolButton from '@app/components/tools/toolPicker/ToolButton';
-import { useTranslation } from 'react-i18next';
-import { useToolSections } from '@app/hooks/useToolSections';
-import SubcategoryHeader from '@app/components/tools/shared/SubcategoryHeader';
-import NoToolsFound from '@app/components/tools/shared/NoToolsFound';
+import React from "react";
+import { Box, Stack } from "@mantine/core";
+import {
+  getSubcategoryLabel,
+  ToolRegistryEntry,
+} from "@app/data/toolsTaxonomy";
+import { ToolId } from "@app/types/toolId";
+import ToolButton from "@app/components/tools/toolPicker/ToolButton";
+import { useTranslation } from "react-i18next";
+import { useToolSections } from "@app/hooks/useToolSections";
+import SubcategoryHeader from "@app/components/tools/shared/SubcategoryHeader";
+import NoToolsFound from "@app/components/tools/shared/NoToolsFound";
 import "@app/components/tools/toolPicker/ToolPicker.css";
 
 interface SearchResultsProps {
-  filteredTools: Array<{ item: [ToolId, ToolRegistryEntry]; matchedText?: string }>;
+  filteredTools: Array<{
+    item: [ToolId, ToolRegistryEntry];
+    matchedText?: string;
+  }>;
   onSelect: (id: string) => void;
   searchQuery?: string;
 }
 
-const SearchResults: React.FC<SearchResultsProps> = ({ filteredTools, onSelect, searchQuery }) => {
+const SearchResults: React.FC<SearchResultsProps> = ({
+  filteredTools,
+  onSelect,
+  searchQuery,
+}) => {
   const { t } = useTranslation();
   const { searchGroups } = useToolSections(filteredTools, searchQuery);
 
@@ -32,21 +42,26 @@ const SearchResults: React.FC<SearchResultsProps> = ({ filteredTools, onSelect,
   }
 
   return (
-    <Stack p="sm" gap="xs"
-        className="tool-picker-scrollable">
-      {searchGroups.map(group => (
-        <Box key={group.subcategoryId}  w="100%">
-          <SubcategoryHeader label={getSubcategoryLabel(t, group.subcategoryId)} />
-          <Stack  gap="xs">
+    <Stack p="sm" gap="xs" className="tool-picker-scrollable">
+      {searchGroups.map((group) => (
+        <Box key={group.subcategoryId} w="100%">
+          <SubcategoryHeader
+            label={getSubcategoryLabel(t, group.subcategoryId)}
+          />
+          <Stack gap="xs">
             {group.tools.map(({ id, tool }) => {
               const matchedText = matchedTextMap.get(id);
               // Check if the match was from synonyms and show the actual synonym that matched
-              const isSynonymMatch = matchedText && tool.synonyms?.some(synonym =>
-                matchedText.toLowerCase().includes(synonym.toLowerCase())
-              );
-              const matchedSynonym = isSynonymMatch ? tool.synonyms?.find(synonym =>
-                matchedText.toLowerCase().includes(synonym.toLowerCase())
-              ) : undefined;
+              const isSynonymMatch =
+                matchedText &&
+                tool.synonyms?.some((synonym) =>
+                  matchedText.toLowerCase().includes(synonym.toLowerCase()),
+                );
+              const matchedSynonym = isSynonymMatch
+                ? tool.synonyms?.find((synonym) =>
+                    matchedText.toLowerCase().includes(synonym.toLowerCase()),
+                  )
+                : undefined;
 
               return (
                 <ToolButton
diff --git a/frontend/src/core/components/tools/ToolLoadingFallback.tsx b/frontend/src/core/components/tools/ToolLoadingFallback.tsx
index 9a2a4de14b..442715f348 100644
--- a/frontend/src/core/components/tools/ToolLoadingFallback.tsx
+++ b/frontend/src/core/components/tools/ToolLoadingFallback.tsx
@@ -1,6 +1,10 @@
 import { Center, Stack, Loader, Text } from "@mantine/core";
 
-export default function ToolLoadingFallback({ toolName }: { toolName?: string }) {
+export default function ToolLoadingFallback({
+  toolName,
+}: {
+  toolName?: string;
+}) {
   return (
     <Center h="100%" w="100%">
       <Stack align="center" gap="md">
diff --git a/frontend/src/core/components/tools/ToolPanel.css b/frontend/src/core/components/tools/ToolPanel.css
index 8d642214fa..dd5c3c15e1 100644
--- a/frontend/src/core/components/tools/ToolPanel.css
+++ b/frontend/src/core/components/tools/ToolPanel.css
@@ -1,37 +1,131 @@
 /* CSS Custom Properties for Fullscreen Mode */
 .tool-panel__fullscreen-surface-inner {
-  --fullscreen-bg-surface-1: color-mix(in srgb, var(--bg-toolbar) 96%, transparent);
-  --fullscreen-bg-surface-2: color-mix(in srgb, var(--bg-background) 90%, transparent);
+  --fullscreen-bg-surface-1: color-mix(
+    in srgb,
+    var(--bg-toolbar) 96%,
+    transparent
+  );
+  --fullscreen-bg-surface-2: color-mix(
+    in srgb,
+    var(--bg-background) 90%,
+    transparent
+  );
   --fullscreen-bg-header: var(--bg-toolbar);
   --fullscreen-bg-controls-1: var(--bg-toolbar);
-  --fullscreen-bg-controls-2: color-mix(in srgb, var(--bg-toolbar) 95%, var(--bg-background));
-  --fullscreen-bg-body-1: color-mix(in srgb, var(--bg-background) 86%, transparent);
-  --fullscreen-bg-body-2: color-mix(in srgb, var(--bg-toolbar) 78%, transparent);
+  --fullscreen-bg-controls-2: color-mix(
+    in srgb,
+    var(--bg-toolbar) 95%,
+    var(--bg-background)
+  );
+  --fullscreen-bg-body-1: color-mix(
+    in srgb,
+    var(--bg-background) 86%,
+    transparent
+  );
+  --fullscreen-bg-body-2: color-mix(
+    in srgb,
+    var(--bg-toolbar) 78%,
+    transparent
+  );
   --fullscreen-bg-group: color-mix(in srgb, var(--bg-toolbar) 82%, transparent);
   --fullscreen-bg-item: color-mix(in srgb, var(--bg-toolbar) 88%, transparent);
-  --fullscreen-bg-list-item: color-mix(in srgb, var(--bg-toolbar) 86%, transparent);
-  --fullscreen-bg-icon-detailed: color-mix(in srgb, var(--bg-muted) 75%, transparent);
-  --fullscreen-bg-icon-compact: color-mix(in srgb, var(--bg-muted) 70%, transparent);
-  --fullscreen-border-subtle-75: color-mix(in srgb, var(--border-subtle) 75%, transparent);
-  --fullscreen-border-subtle-70: color-mix(in srgb, var(--border-subtle) 70%, transparent);
-  --fullscreen-border-subtle-65: color-mix(in srgb, var(--border-subtle) 65%, transparent);
-  --fullscreen-border-favorites: color-mix(in srgb, var(--special-color-favorites) 25%, var(--border-subtle));
-  --fullscreen-border-recommended: color-mix(in srgb, var(--special-color-recommended) 25%, var(--border-subtle));
-  --fullscreen-shadow-primary: color-mix(in srgb, var(--shadow-color, rgba(15, 23, 42, 0.55)) 25%, transparent);
-  --fullscreen-shadow-secondary: color-mix(in srgb, var(--shadow-color, rgba(15, 23, 42, 0.35)) 30%, transparent);
-  --fullscreen-shadow-group: color-mix(in srgb, var(--shadow-color, rgba(15, 23, 42, 0.45)) 18%, transparent);
-  --fullscreen-accent-hover: color-mix(in srgb, var(--text-primary) 20%, var(--border-subtle));
-  --fullscreen-accent-selected: color-mix(in srgb, var(--text-primary) 30%, var(--border-subtle));
-  --fullscreen-accent-ring: color-mix(in srgb, var(--text-primary) 15%, transparent);
-  --fullscreen-accent-list-bg: color-mix(in srgb, var(--text-primary) 8%, var(--bg-toolbar));
-  --fullscreen-accent-list-border: color-mix(in srgb, var(--text-primary) 20%, var(--border-subtle));
-  --fullscreen-text-icon: color-mix(in srgb, var(--text-primary) 90%, var(--text-muted));
-  --fullscreen-text-icon-compact: color-mix(in srgb, var(--text-primary) 88%, var(--text-muted));
+  --fullscreen-bg-list-item: color-mix(
+    in srgb,
+    var(--bg-toolbar) 86%,
+    transparent
+  );
+  --fullscreen-bg-icon-detailed: color-mix(
+    in srgb,
+    var(--bg-muted) 75%,
+    transparent
+  );
+  --fullscreen-bg-icon-compact: color-mix(
+    in srgb,
+    var(--bg-muted) 70%,
+    transparent
+  );
+  --fullscreen-border-subtle-75: color-mix(
+    in srgb,
+    var(--border-subtle) 75%,
+    transparent
+  );
+  --fullscreen-border-subtle-70: color-mix(
+    in srgb,
+    var(--border-subtle) 70%,
+    transparent
+  );
+  --fullscreen-border-subtle-65: color-mix(
+    in srgb,
+    var(--border-subtle) 65%,
+    transparent
+  );
+  --fullscreen-border-favorites: color-mix(
+    in srgb,
+    var(--special-color-favorites) 25%,
+    var(--border-subtle)
+  );
+  --fullscreen-border-recommended: color-mix(
+    in srgb,
+    var(--special-color-recommended) 25%,
+    var(--border-subtle)
+  );
+  --fullscreen-shadow-primary: color-mix(
+    in srgb,
+    var(--shadow-color, rgba(15, 23, 42, 0.55)) 25%,
+    transparent
+  );
+  --fullscreen-shadow-secondary: color-mix(
+    in srgb,
+    var(--shadow-color, rgba(15, 23, 42, 0.35)) 30%,
+    transparent
+  );
+  --fullscreen-shadow-group: color-mix(
+    in srgb,
+    var(--shadow-color, rgba(15, 23, 42, 0.45)) 18%,
+    transparent
+  );
+  --fullscreen-accent-hover: color-mix(
+    in srgb,
+    var(--text-primary) 20%,
+    var(--border-subtle)
+  );
+  --fullscreen-accent-selected: color-mix(
+    in srgb,
+    var(--text-primary) 30%,
+    var(--border-subtle)
+  );
+  --fullscreen-accent-ring: color-mix(
+    in srgb,
+    var(--text-primary) 15%,
+    transparent
+  );
+  --fullscreen-accent-list-bg: color-mix(
+    in srgb,
+    var(--text-primary) 8%,
+    var(--bg-toolbar)
+  );
+  --fullscreen-accent-list-border: color-mix(
+    in srgb,
+    var(--text-primary) 20%,
+    var(--border-subtle)
+  );
+  --fullscreen-text-icon: color-mix(
+    in srgb,
+    var(--text-primary) 90%,
+    var(--text-muted)
+  );
+  --fullscreen-text-icon-compact: color-mix(
+    in srgb,
+    var(--text-primary) 88%,
+    var(--text-muted)
+  );
 }
 
 .tool-panel {
   position: relative;
-  transition: width 0.3s ease, max-width 0.3s ease;
+  transition:
+    width 0.3s ease,
+    max-width 0.3s ease;
 }
 
 .tool-panel--fullscreen-active {
@@ -90,8 +184,7 @@
   display: flex;
   flex-direction: column;
   border-radius: 0;
-  background:
-    linear-gradient(
+  background: linear-gradient(
       140deg,
       var(--fullscreen-bg-surface-1),
       var(--fullscreen-bg-surface-2)
@@ -104,18 +197,21 @@
   /* Shared animation durations for JS + CSS (sourced from theme.css) */
   --fullscreen-anim-in-duration: var(--fullscreen-anim-duration-in);
   --fullscreen-anim-out-duration: var(--fullscreen-anim-duration-out);
-  animation: tool-panel-fullscreen-slide-in var(--fullscreen-anim-in-duration) ease forwards;
+  animation: tool-panel-fullscreen-slide-in var(--fullscreen-anim-in-duration)
+    ease forwards;
 }
 
 .tool-panel__fullscreen-surface-inner--exiting {
-  animation: tool-panel-fullscreen-slide-out var(--fullscreen-anim-out-duration) ease forwards;
+  animation: tool-panel-fullscreen-slide-out var(--fullscreen-anim-out-duration)
+    ease forwards;
 }
 
-:root[dir='rtl'] .tool-panel__fullscreen-surface-inner {
+:root[dir="rtl"] .tool-panel__fullscreen-surface-inner {
   animation-name: tool-panel-fullscreen-slide-in-rtl;
 }
 
-:root[dir='rtl'] .tool-panel__fullscreen-surface-inner.tool-panel__fullscreen-surface-inner--exiting {
+:root[dir="rtl"]
+  .tool-panel__fullscreen-surface-inner.tool-panel__fullscreen-surface-inner--exiting {
   animation-name: tool-panel-fullscreen-slide-out-rtl;
 }
 
@@ -238,7 +334,10 @@
   border-radius: 0.95rem;
   background: var(--fullscreen-bg-item);
   cursor: pointer;
-  transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
+  transition:
+    transform 0.2s ease,
+    border-color 0.2s ease,
+    box-shadow 0.2s ease;
   width: 100%;
   box-sizing: border-box;
   /* Allow flex children to shrink without forcing horizontal overflow */
@@ -319,16 +418,19 @@
   background: var(--fullscreen-bg-icon-detailed);
   color: var(--fullscreen-text-icon);
   flex-shrink: 0;
-  transition: transform 0.2s ease, box-shadow 0.2s ease;
+  transition:
+    transform 0.2s ease,
+    box-shadow 0.2s ease;
   position: relative;
   overflow: hidden;
 }
 
 .tool-panel__fullscreen-icon::before {
-  content: '';
+  content: "";
   position: absolute;
   inset: 0;
-  background: linear-gradient(135deg,
+  background: linear-gradient(
+    135deg,
     color-mix(in srgb, var(--text-primary) 12%, transparent),
     color-mix(in srgb, var(--text-primary) 4%, transparent)
   );
@@ -337,12 +439,15 @@
   border-radius: 0.75rem;
 }
 
-.tool-panel__fullscreen-item:hover:not([aria-disabled="true"]) .tool-panel__fullscreen-icon {
+.tool-panel__fullscreen-item:hover:not([aria-disabled="true"])
+  .tool-panel__fullscreen-icon {
   transform: scale(1.08);
-  box-shadow: 0 4px 12px color-mix(in srgb, var(--text-primary) 15%, transparent);
+  box-shadow: 0 4px 12px
+    color-mix(in srgb, var(--text-primary) 15%, transparent);
 }
 
-.tool-panel__fullscreen-item:hover:not([aria-disabled="true"]) .tool-panel__fullscreen-icon::before {
+.tool-panel__fullscreen-item:hover:not([aria-disabled="true"])
+  .tool-panel__fullscreen-icon::before {
   opacity: 1;
 }
 
@@ -407,7 +512,9 @@
   padding: 0.55rem 0.5rem 0.55rem 0.65rem;
   border-radius: 0.65rem;
   cursor: pointer;
-  transition: background 0.2s ease, transform 0.2s ease;
+  transition:
+    background 0.2s ease,
+    transform 0.2s ease;
   background: var(--fullscreen-bg-list-item);
   border: 1px solid transparent;
   width: 100%;
@@ -421,7 +528,9 @@
   cursor: not-allowed;
 }
 
-.tool-panel__fullscreen-list-item:hover:not([aria-disabled="true"]):not(:disabled),
+.tool-panel__fullscreen-list-item:hover:not([aria-disabled="true"]):not(
+    :disabled
+  ),
 .tool-panel__fullscreen-list-item--selected {
   background: var(--fullscreen-accent-list-bg);
   border-color: var(--fullscreen-accent-list-border);
@@ -441,16 +550,19 @@
   background: var(--fullscreen-bg-icon-compact);
   color: var(--fullscreen-text-icon-compact);
   flex-shrink: 0;
-  transition: transform 0.2s ease, box-shadow 0.2s ease;
+  transition:
+    transform 0.2s ease,
+    box-shadow 0.2s ease;
   position: relative;
   overflow: hidden;
 }
 
 .tool-panel__fullscreen-list-icon::before {
-  content: '';
+  content: "";
   position: absolute;
   inset: 0;
-  background: linear-gradient(135deg,
+  background: linear-gradient(
+    135deg,
     color-mix(in srgb, var(--text-primary) 10%, transparent),
     color-mix(in srgb, var(--text-primary) 3%, transparent)
   );
@@ -459,12 +571,14 @@
   border-radius: 0.6rem;
 }
 
-.tool-panel__fullscreen-list-item:hover:not([aria-disabled="true"]) .tool-panel__fullscreen-list-icon {
+.tool-panel__fullscreen-list-item:hover:not([aria-disabled="true"])
+  .tool-panel__fullscreen-list-icon {
   transform: scale(1.06);
   box-shadow: 0 2px 8px color-mix(in srgb, var(--text-primary) 12%, transparent);
 }
 
-.tool-panel__fullscreen-list-item:hover:not([aria-disabled="true"]) .tool-panel__fullscreen-list-icon::before {
+.tool-panel__fullscreen-list-item:hover:not([aria-disabled="true"])
+  .tool-panel__fullscreen-list-icon::before {
   opacity: 1;
 }
 
@@ -571,5 +685,3 @@
     column-width: 14rem;
   }
 }
-
-
diff --git a/frontend/src/core/components/tools/ToolPanel.tsx b/frontend/src/core/components/tools/ToolPanel.tsx
index 3fcac49881..8be8d84c45 100644
--- a/frontend/src/core/components/tools/ToolPanel.tsx
+++ b/frontend/src/core/components/tools/ToolPanel.tsx
@@ -1,23 +1,23 @@
-import { useEffect, useMemo } from 'react';
-import { useRainbowThemeContext } from '@app/components/shared/RainbowThemeProvider';
-import { useToolWorkflow } from '@app/contexts/ToolWorkflowContext';
-import { usePreferences } from '@app/contexts/PreferencesContext';
-import ToolPicker from '@app/components/tools/ToolPicker';
-import SearchResults from '@app/components/tools/SearchResults';
-import ToolRenderer from '@app/components/tools/ToolRenderer';
-import ToolSearch from '@app/components/tools/toolPicker/ToolSearch';
+import { useEffect, useMemo } from "react";
+import { useRainbowThemeContext } from "@app/components/shared/RainbowThemeProvider";
+import { useToolWorkflow } from "@app/contexts/ToolWorkflowContext";
+import { usePreferences } from "@app/contexts/PreferencesContext";
+import ToolPicker from "@app/components/tools/ToolPicker";
+import SearchResults from "@app/components/tools/SearchResults";
+import ToolRenderer from "@app/components/tools/ToolRenderer";
+import ToolSearch from "@app/components/tools/toolPicker/ToolSearch";
 import { useSidebarContext } from "@app/contexts/SidebarContext";
-import rainbowStyles from '@app/styles/rainbow.module.css';
-import { ActionIcon, ScrollArea } from '@mantine/core';
-import { ToolId } from '@app/types/toolId';
-import { useIsMobile } from '@app/hooks/useIsMobile';
-import DoubleArrowIcon from '@mui/icons-material/DoubleArrow';
-import { useTranslation } from 'react-i18next';
-import FullscreenToolSurface from '@app/components/tools/FullscreenToolSurface';
-import { useToolPanelGeometry } from '@app/hooks/tools/useToolPanelGeometry';
-import { useRightRail } from '@app/contexts/RightRailContext';
-import { Tooltip } from '@app/components/shared/Tooltip';
-import '@app/components/tools/ToolPanel.css';
+import rainbowStyles from "@app/styles/rainbow.module.css";
+import { ActionIcon, ScrollArea } from "@mantine/core";
+import { ToolId } from "@app/types/toolId";
+import { useIsMobile } from "@app/hooks/useIsMobile";
+import DoubleArrowIcon from "@mui/icons-material/DoubleArrow";
+import { useTranslation } from "react-i18next";
+import FullscreenToolSurface from "@app/components/tools/FullscreenToolSurface";
+import { useToolPanelGeometry } from "@app/hooks/tools/useToolPanelGeometry";
+import { useRightRail } from "@app/contexts/RightRailContext";
+import { Tooltip } from "@app/components/shared/Tooltip";
+import "@app/components/tools/ToolPanel.css";
 
 // No props needed - component uses context
 
@@ -47,11 +47,15 @@ export default function ToolPanel() {
   const { setAllRightRailButtonsDisabled } = useRightRail();
   const { preferences, updatePreference } = usePreferences();
 
-  const isFullscreenMode = toolPanelMode === 'fullscreen';
+  const isFullscreenMode = toolPanelMode === "fullscreen";
   const toolPickerVisible = !readerMode;
-  const fullscreenExpanded = isFullscreenMode && leftPanelView === 'toolPicker' && !isMobile && toolPickerVisible;
-  const isRTL = typeof document !== 'undefined' && document.documentElement.dir === 'rtl';
-
+  const fullscreenExpanded =
+    isFullscreenMode &&
+    leftPanelView === "toolPicker" &&
+    !isMobile &&
+    toolPickerVisible;
+  const isRTL =
+    typeof document !== "undefined" && document.documentElement.dir === "rtl";
 
   // Disable right rail buttons when fullscreen mode is active
   useEffect(() => {
@@ -66,28 +70,28 @@ export default function ToolPanel() {
   });
 
   const toggleLabel = isFullscreenMode
-    ? t('toolPanel.toggle.sidebar', 'Switch to sidebar mode')
-    : t('toolPanel.toggle.fullscreen', 'Switch to fullscreen mode');
+    ? t("toolPanel.toggle.sidebar", "Switch to sidebar mode")
+    : t("toolPanel.toggle.fullscreen", "Switch to fullscreen mode");
 
   const handleModeToggle = () => {
-    const nextMode = isFullscreenMode ? 'sidebar' : 'fullscreen';
+    const nextMode = isFullscreenMode ? "sidebar" : "fullscreen";
     setToolPanelMode(nextMode);
 
-    if (nextMode === 'fullscreen' && leftPanelView !== 'toolPicker') {
-      setLeftPanelView('toolPicker');
+    if (nextMode === "fullscreen" && leftPanelView !== "toolPicker") {
+      setLeftPanelView("toolPicker");
     }
   };
 
   const computedWidth = () => {
     if (isMobile) {
-      return '100%';
+      return "100%";
     }
 
     if (!isPanelVisible) {
-      return '0';
+      return "0";
     }
 
-    return '18.5rem';
+    return "18.5rem";
   };
 
   const matchedTextMap = useMemo(() => {
@@ -105,29 +109,29 @@ export default function ToolPanel() {
       ref={toolPanelRef}
       data-sidebar="tool-panel"
       data-tour={fullscreenExpanded ? undefined : "tool-panel"}
-      className={`tool-panel flex flex-col ${fullscreenExpanded ? 'tool-panel--fullscreen-active' : 'overflow-hidden'} bg-[var(--bg-toolbar)] border-r border-[var(--border-subtle)] transition-all duration-300 ease-out ${
-        isRainbowMode ? rainbowStyles.rainbowPaper : ''
-      } ${isMobile ? 'h-full border-r-0' : 'h-screen'} ${fullscreenExpanded ? 'tool-panel--fullscreen' : ''}`}
+      className={`tool-panel flex flex-col ${fullscreenExpanded ? "tool-panel--fullscreen-active" : "overflow-hidden"} bg-[var(--bg-toolbar)] border-r border-[var(--border-subtle)] transition-all duration-300 ease-out ${
+        isRainbowMode ? rainbowStyles.rainbowPaper : ""
+      } ${isMobile ? "h-full border-r-0" : "h-screen"} ${fullscreenExpanded ? "tool-panel--fullscreen" : ""}`}
       style={{
         width: computedWidth(),
-        padding: '0'
+        padding: "0",
       }}
     >
       {!fullscreenExpanded && (
         <div
           style={{
             opacity: isMobile || isPanelVisible ? 1 : 0,
-            transition: 'opacity 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94)',
-            height: '100%',
-            display: 'flex',
-            flexDirection: 'column'
+            transition: "opacity 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94)",
+            height: "100%",
+            display: "flex",
+            flexDirection: "column",
           }}
         >
           <div
             className="tool-panel__search-row"
             style={{
-              backgroundColor: 'var(--tool-panel-search-bg)',
-              borderBottom: '1px solid var(--tool-panel-search-border-bottom)'
+              backgroundColor: "var(--tool-panel-search-bg)",
+              borderBottom: "1px solid var(--tool-panel-search-border-bottom)",
             }}
           >
             <ToolSearch
@@ -136,7 +140,7 @@ export default function ToolPanel() {
               toolRegistry={toolRegistry}
               mode="filter"
             />
-            {!isMobile && leftPanelView === 'toolPicker' && (
+            {!isMobile && leftPanelView === "toolPicker" && (
               <Tooltip
                 content={toggleLabel}
                 position="bottom"
@@ -146,37 +150,39 @@ export default function ToolPanel() {
                 <ActionIcon
                   variant="subtle"
                   radius="xl"
-                  style={{ color: 'var(--right-rail-icon)' }}
+                  style={{ color: "var(--right-rail-icon)" }}
                   onClick={handleModeToggle}
                   aria-label={toggleLabel}
                   className="tool-panel__mode-toggle"
                 >
                   <DoubleArrowIcon
                     fontSize="small"
-                    style={{ transform: isRTL ? 'scaleX(-1)' : undefined }}
+                    style={{ transform: isRTL ? "scaleX(-1)" : undefined }}
                   />
                 </ActionIcon>
               </Tooltip>
             )}
           </div>
 
-                {searchQuery.trim().length > 0 ? (
-                  <div className="flex-1 flex flex-col overflow-y-auto">
-                    <SearchResults
-                      filteredTools={filteredTools}
-                      onSelect={(id) => handleToolSelect(id as ToolId)}
-                      searchQuery={searchQuery}
-                    />
-                  </div>
-                ) : leftPanelView === 'toolPicker' ? (
-                  <div className="flex-1 flex flex-col overflow-auto">
-                    <ToolPicker
-                      selectedToolKey={selectedToolKey}
-                      onSelect={(id) => handleToolSelect(id as ToolId)}
-                      filteredTools={filteredTools}
-                      isSearching={Boolean(searchQuery && searchQuery.trim().length > 0)}
-                    />
-                  </div>
+          {searchQuery.trim().length > 0 ? (
+            <div className="flex-1 flex flex-col overflow-y-auto">
+              <SearchResults
+                filteredTools={filteredTools}
+                onSelect={(id) => handleToolSelect(id as ToolId)}
+                searchQuery={searchQuery}
+              />
+            </div>
+          ) : leftPanelView === "toolPicker" ? (
+            <div className="flex-1 flex flex-col overflow-auto">
+              <ToolPicker
+                selectedToolKey={selectedToolKey}
+                onSelect={(id) => handleToolSelect(id as ToolId)}
+                filteredTools={filteredTools}
+                isSearching={Boolean(
+                  searchQuery && searchQuery.trim().length > 0,
+                )}
+              />
+            </div>
           ) : (
             <div className="flex-1 flex flex-col overflow-hidden">
               <div className="flex-1 min-h-0 overflow-hidden">
@@ -188,7 +194,10 @@ export default function ToolPanel() {
                     />
                   ) : (
                     <div className="tool-panel__placeholder">
-                      {t('toolPanel.placeholder', 'Choose a tool to get started')}
+                      {t(
+                        "toolPanel.placeholder",
+                        "Choose a tool to get started",
+                      )}
                     </div>
                   )}
                 </ScrollArea>
@@ -208,8 +217,13 @@ export default function ToolPanel() {
           matchedTextMap={matchedTextMap}
           onSearchChange={setSearchQuery}
           onSelect={(id: ToolId) => handleToolSelect(id)}
-          onToggleDescriptions={() => updatePreference('showLegacyToolDescriptions', !preferences.showLegacyToolDescriptions)}
-          onExitFullscreenMode={() => setToolPanelMode('sidebar')}
+          onToggleDescriptions={() =>
+            updatePreference(
+              "showLegacyToolDescriptions",
+              !preferences.showLegacyToolDescriptions,
+            )
+          }
+          onExitFullscreenMode={() => setToolPanelMode("sidebar")}
           toggleLabel={toggleLabel}
           geometry={fullscreenGeometry}
         />
diff --git a/frontend/src/core/components/tools/ToolPanelModePrompt.css b/frontend/src/core/components/tools/ToolPanelModePrompt.css
index 50e8ad7117..2749abe537 100644
--- a/frontend/src/core/components/tools/ToolPanelModePrompt.css
+++ b/frontend/src/core/components/tools/ToolPanelModePrompt.css
@@ -1,7 +1,12 @@
 .tool-panel-mode-prompt__modal {
   background: color-mix(in srgb, var(--bg-toolbar) 94%, transparent);
   border: 1px solid color-mix(in srgb, var(--border-subtle) 70%, transparent);
-  box-shadow: 0 32px 64px color-mix(in srgb, var(--shadow-color, rgba(15, 23, 42, 0.55)) 20%, transparent);
+  box-shadow: 0 32px 64px
+    color-mix(
+      in srgb,
+      var(--shadow-color, rgba(15, 23, 42, 0.55)) 20%,
+      transparent
+    );
   max-width: min(46rem, 100%);
 }
 
@@ -15,7 +20,8 @@
   display: flex;
   flex-direction: column;
   gap: 1rem;
-  background: linear-gradient(145deg,
+  background: linear-gradient(
+    145deg,
     color-mix(in srgb, var(--bg-surface) 96%, transparent),
     color-mix(in srgb, var(--bg-muted) 70%, transparent)
   );
@@ -24,17 +30,31 @@
 }
 
 .tool-panel-mode-prompt__card--sidebar {
-  border: 1px solid color-mix(in srgb, var(--accent-primary, var(--mantine-color-blue-6, #228be6)) 18%, var(--border-subtle));
-  background: linear-gradient(165deg,
+  border: 1px solid
+    color-mix(
+      in srgb,
+      var(--accent-primary, var(--mantine-color-blue-6, #228be6)) 18%,
+      var(--border-subtle)
+    );
+  background: linear-gradient(
+    165deg,
     color-mix(in srgb, var(--bg-surface) 96%, transparent),
-    color-mix(in srgb, var(--accent-primary, var(--mantine-color-blue-6, #228be6)) 8%, transparent)
+    color-mix(
+      in srgb,
+      var(--accent-primary, var(--mantine-color-blue-6, #228be6)) 8%,
+      transparent
+    )
   );
 }
 
 .tool-panel-mode-prompt__preview {
   border-radius: 0.9rem;
   border: 1px solid color-mix(in srgb, var(--border-subtle) 70%, transparent);
-  background: linear-gradient(135deg, color-mix(in srgb, var(--bg-muted) 82%, transparent), transparent 75%);
+  background: linear-gradient(
+    135deg,
+    color-mix(in srgb, var(--bg-muted) 82%, transparent),
+    transparent 75%
+  );
   padding: 0.75rem;
   width: 100%;
   display: flex;
@@ -54,7 +74,8 @@
   display: flex;
   flex-direction: column;
   gap: 0.45rem;
-  background: linear-gradient(180deg,
+  background: linear-gradient(
+    180deg,
     color-mix(in srgb, var(--bg-muted) 88%, transparent),
     color-mix(in srgb, var(--bg-muted) 72%, transparent)
   );
@@ -71,7 +92,11 @@
 .tool-panel-mode-prompt__sidebar-item {
   height: 0.55rem;
   border-radius: 0.35rem;
-  background: color-mix(in srgb, var(--accent-primary, var(--mantine-color-blue-6, #228be6)) 32%, var(--bg-muted));
+  background: color-mix(
+    in srgb,
+    var(--accent-primary, var(--mantine-color-blue-6, #228be6)) 32%,
+    var(--bg-muted)
+  );
 }
 
 .tool-panel-mode-prompt__sidebar-item--muted {
@@ -86,7 +111,8 @@
   display: grid;
   gap: 0.35rem;
   grid-template-rows: 1.4fr 0.6fr;
-  background: linear-gradient(160deg,
+  background: linear-gradient(
+    160deg,
     color-mix(in srgb, var(--bg-background) 94%, transparent),
     color-mix(in srgb, var(--bg-muted) 68%, transparent)
   );
@@ -96,7 +122,8 @@
   border-radius: 0.45rem;
   background: color-mix(in srgb, var(--bg-surface) 96%, transparent);
   border: 1px solid color-mix(in srgb, var(--border-subtle) 55%, transparent);
-  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--bg-background) 60%, transparent);
+  box-shadow: inset 0 0 0 1px
+    color-mix(in srgb, var(--bg-background) 60%, transparent);
 }
 
 .tool-panel-mode-prompt__workspace-page--secondary {
@@ -125,7 +152,8 @@
 .tool-panel-mode-prompt__legacy-card {
   border-radius: 0.45rem;
   border: 1px solid color-mix(in srgb, var(--border-subtle) 55%, transparent);
-  background: linear-gradient(150deg,
+  background: linear-gradient(
+    150deg,
     color-mix(in srgb, var(--bg-muted) 88%, transparent),
     color-mix(in srgb, var(--bg-background) 76%, transparent)
   );
@@ -158,7 +186,8 @@
 .tool-panel-mode-prompt__fullscreen-card {
   border-radius: 0.45rem;
   border: 1px solid color-mix(in srgb, var(--border-subtle) 55%, transparent);
-  background: linear-gradient(150deg,
+  background: linear-gradient(
+    150deg,
     color-mix(in srgb, var(--bg-muted) 88%, transparent),
     color-mix(in srgb, var(--bg-background) 76%, transparent)
   );
@@ -181,7 +210,12 @@
 }
 
 .tool-panel-mode-prompt__action:hover {
-  box-shadow: 0 10px 18px color-mix(in srgb, var(--accent-primary, var(--mantine-color-blue-6, #228be6)) 25%, transparent);
+  box-shadow: 0 10px 18px
+    color-mix(
+      in srgb,
+      var(--accent-primary, var(--mantine-color-blue-6, #228be6)) 25%,
+      transparent
+    );
 }
 
 .tool-panel-mode-prompt__maybe-later {
diff --git a/frontend/src/core/components/tools/ToolPanelModePrompt.tsx b/frontend/src/core/components/tools/ToolPanelModePrompt.tsx
index 3b34e8af41..3e3f072b69 100644
--- a/frontend/src/core/components/tools/ToolPanelModePrompt.tsx
+++ b/frontend/src/core/components/tools/ToolPanelModePrompt.tsx
@@ -1,10 +1,10 @@
-import { useEffect, useState } from 'react';
-import { Badge, Button, Card, Group, Modal, Stack, Text } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { useToolWorkflow } from '@app/contexts/ToolWorkflowContext';
-import { usePreferences } from '@app/contexts/PreferencesContext';
-import '@app/components/tools/ToolPanelModePrompt.css';
-import { type ToolPanelMode } from '@app/constants/toolPanel';
+import { useEffect, useState } from "react";
+import { Badge, Button, Card, Group, Modal, Stack, Text } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import { useToolWorkflow } from "@app/contexts/ToolWorkflowContext";
+import { usePreferences } from "@app/contexts/PreferencesContext";
+import "@app/components/tools/ToolPanelModePrompt.css";
+import { type ToolPanelMode } from "@app/constants/toolPanel";
 
 interface ToolPanelModePromptProps {
   onComplete?: () => void;
@@ -14,18 +14,22 @@ interface ToolPanelModePromptProps {
 
 /**
  * ToolPanelModePrompt - Lets users choose between sidebar and fullscreen tool modes
- * 
+ *
  * The orchestrator controls this via forceOpen prop. When shown standalone (legacy),
  * it uses internal state based on preferences.
  */
-const ToolPanelModePrompt = ({ onComplete, forceOpen }: ToolPanelModePromptProps = {}) => {
+const ToolPanelModePrompt = ({
+  onComplete,
+  forceOpen,
+}: ToolPanelModePromptProps = {}) => {
   const { t } = useTranslation();
   const { toolPanelMode, setToolPanelMode } = useToolWorkflow();
   const { preferences, updatePreference } = usePreferences();
   const [internalOpened, setInternalOpened] = useState(false);
 
   // Only show after the intro onboarding has been completed (legacy standalone mode)
-  const shouldShowPrompt = !preferences.toolPanelModePromptSeen && preferences.hasSeenIntroOnboarding;
+  const shouldShowPrompt =
+    !preferences.toolPanelModePromptSeen && preferences.hasSeenIntroOnboarding;
 
   useEffect(() => {
     if (shouldShowPrompt && forceOpen === undefined) {
@@ -39,21 +43,21 @@ const ToolPanelModePrompt = ({ onComplete, forceOpen }: ToolPanelModePromptProps
 
   const handleSelect = (mode: ToolPanelMode) => {
     setToolPanelMode(mode);
-    updatePreference('defaultToolPanelMode', mode);
-    updatePreference('toolPanelModePromptSeen', true);
-    updatePreference('hasSelectedToolPanelMode', true);
+    updatePreference("defaultToolPanelMode", mode);
+    updatePreference("toolPanelModePromptSeen", true);
+    updatePreference("hasSelectedToolPanelMode", true);
     setOpened(false);
     onComplete?.();
   };
 
   const handleDismiss = () => {
-    const defaultMode: ToolPanelMode = 'sidebar';
+    const defaultMode: ToolPanelMode = "sidebar";
     if (toolPanelMode !== defaultMode) {
       setToolPanelMode(defaultMode);
-      updatePreference('defaultToolPanelMode', defaultMode);
+      updatePreference("defaultToolPanelMode", defaultMode);
     }
-    updatePreference('hasSelectedToolPanelMode', true);
-    updatePreference('toolPanelModePromptSeen', true);
+    updatePreference("hasSelectedToolPanelMode", true);
+    updatePreference("toolPanelModePromptSeen", true);
     setOpened(false);
     onComplete?.();
   };
@@ -66,28 +70,45 @@ const ToolPanelModePrompt = ({ onComplete, forceOpen }: ToolPanelModePromptProps
       size="xl"
       radius="lg"
       overlayProps={{ blur: 6, opacity: 0.35 }}
-      classNames={{ content: 'tool-panel-mode-prompt__modal' }}
-      title={t('toolPanel.modePrompt.title', 'Choose how you browse tools')}
+      classNames={{ content: "tool-panel-mode-prompt__modal" }}
+      title={t("toolPanel.modePrompt.title", "Choose how you browse tools")}
     >
       <Stack gap="lg">
         <Text size="sm" c="dimmed">
-          {t('toolPanel.modePrompt.description', 'Preview both layouts and decide how you want to explore Stirling PDF tools.')}
+          {t(
+            "toolPanel.modePrompt.description",
+            "Preview both layouts and decide how you want to explore Stirling PDF tools.",
+          )}
         </Text>
         <div className="tool-panel-mode-prompt__options">
-          <Card withBorder radius="lg" shadow="sm" padding="lg" className="tool-panel-mode-prompt__card tool-panel-mode-prompt__card--sidebar">
+          <Card
+            withBorder
+            radius="lg"
+            shadow="sm"
+            padding="lg"
+            className="tool-panel-mode-prompt__card tool-panel-mode-prompt__card--sidebar"
+          >
             <Stack gap="md" className="tool-panel-mode-prompt__card-content">
               <Group justify="space-between">
                 <Stack gap={2}>
-                <Text fw={600}>{t('toolPanel.modePrompt.sidebarTitle', 'Sidebar mode')}</Text>
-                <Text size="sm" c="dimmed">
-                  {t('toolPanel.modePrompt.sidebarDescription', 'Keep tools alongside your workspace for quick switching.')}
-                </Text>
+                  <Text fw={600}>
+                    {t("toolPanel.modePrompt.sidebarTitle", "Sidebar mode")}
+                  </Text>
+                  <Text size="sm" c="dimmed">
+                    {t(
+                      "toolPanel.modePrompt.sidebarDescription",
+                      "Keep tools alongside your workspace for quick switching.",
+                    )}
+                  </Text>
                 </Stack>
                 <Badge color="blue" variant="filled">
-                  {t('toolPanel.modePrompt.recommended', 'Recommended')}
+                  {t("toolPanel.modePrompt.recommended", "Recommended")}
                 </Badge>
               </Group>
-              <div className="tool-panel-mode-prompt__preview tool-panel-mode-prompt__preview--sidebar" aria-hidden>
+              <div
+                className="tool-panel-mode-prompt__preview tool-panel-mode-prompt__preview--sidebar"
+                aria-hidden
+              >
                 <div className="tool-panel-mode-prompt__sidebar-panel">
                   <span className="tool-panel-mode-prompt__sidebar-search" />
                   <span className="tool-panel-mode-prompt__sidebar-item" />
@@ -101,25 +122,39 @@ const ToolPanelModePrompt = ({ onComplete, forceOpen }: ToolPanelModePromptProps
                 </div>
               </div>
               <Button
-                variant={toolPanelMode === 'sidebar' ? 'filled' : 'light'}
+                variant={toolPanelMode === "sidebar" ? "filled" : "light"}
                 color="blue"
                 radius="md"
                 className="tool-panel-mode-prompt__action"
-                onClick={() => handleSelect('sidebar')}
+                onClick={() => handleSelect("sidebar")}
               >
-                {t('toolPanel.modePrompt.chooseSidebar', 'Use sidebar mode')}
+                {t("toolPanel.modePrompt.chooseSidebar", "Use sidebar mode")}
               </Button>
             </Stack>
           </Card>
-          <Card withBorder radius="lg" shadow="xs" padding="lg" className="tool-panel-mode-prompt__card">
+          <Card
+            withBorder
+            radius="lg"
+            shadow="xs"
+            padding="lg"
+            className="tool-panel-mode-prompt__card"
+          >
             <Stack gap="md" className="tool-panel-mode-prompt__card-content">
               <Stack gap={2}>
-                <Text fw={600}>{t('toolPanel.modePrompt.fullscreenTitle', 'Fullscreen mode')}</Text>
+                <Text fw={600}>
+                  {t("toolPanel.modePrompt.fullscreenTitle", "Fullscreen mode")}
+                </Text>
                 <Text size="sm" c="dimmed">
-                  {t('toolPanel.modePrompt.fullscreenDescription', 'Browse every tool in a catalogue that covers the workspace until you pick one.')}
+                  {t(
+                    "toolPanel.modePrompt.fullscreenDescription",
+                    "Browse every tool in a catalogue that covers the workspace until you pick one.",
+                  )}
                 </Text>
               </Stack>
-              <div className="tool-panel-mode-prompt__preview tool-panel-mode-prompt__preview--fullscreen" aria-hidden>
+              <div
+                className="tool-panel-mode-prompt__preview tool-panel-mode-prompt__preview--fullscreen"
+                aria-hidden
+              >
                 <div className="tool-panel-mode-prompt__fullscreen-columns">
                   <div className="tool-panel-mode-prompt__fullscreen-column">
                     <span className="tool-panel-mode-prompt__fullscreen-card" />
@@ -139,13 +174,16 @@ const ToolPanelModePrompt = ({ onComplete, forceOpen }: ToolPanelModePromptProps
                 </div>
               </div>
               <Button
-                variant={toolPanelMode === 'fullscreen' ? 'filled' : 'outline'}
+                variant={toolPanelMode === "fullscreen" ? "filled" : "outline"}
                 color="blue"
                 radius="md"
                 className="tool-panel-mode-prompt__action"
-                onClick={() => handleSelect('fullscreen')}
+                onClick={() => handleSelect("fullscreen")}
               >
-                {t('toolPanel.modePrompt.chooseFullscreen', 'Use fullscreen mode')}
+                {t(
+                  "toolPanel.modePrompt.chooseFullscreen",
+                  "Use fullscreen mode",
+                )}
               </Button>
             </Stack>
           </Card>
@@ -157,7 +195,7 @@ const ToolPanelModePrompt = ({ onComplete, forceOpen }: ToolPanelModePromptProps
           className="tool-panel-mode-prompt__maybe-later"
           onClick={handleDismiss}
         >
-          {t('toolPanel.modePrompt.dismiss', 'Maybe later')}
+          {t("toolPanel.modePrompt.dismiss", "Maybe later")}
         </Button>
       </Stack>
     </Modal>
diff --git a/frontend/src/core/components/tools/ToolPicker.tsx b/frontend/src/core/components/tools/ToolPicker.tsx
index 9642991989..02ba7625a1 100644
--- a/frontend/src/core/components/tools/ToolPicker.tsx
+++ b/frontend/src/core/components/tools/ToolPicker.tsx
@@ -17,11 +17,19 @@ import { ToolPickerFooterExtensions } from "@app/components/tools/toolPicker/Too
 interface ToolPickerProps {
   selectedToolKey: string | null;
   onSelect: (id: string) => void;
-  filteredTools: Array<{ item: [ToolId, ToolRegistryEntry]; matchedText?: string }>;
+  filteredTools: Array<{
+    item: [ToolId, ToolRegistryEntry];
+    matchedText?: string;
+  }>;
   isSearching?: boolean;
 }
 
-const ToolPicker = ({ selectedToolKey, onSelect, filteredTools, isSearching = false }: ToolPickerProps) => {
+const ToolPicker = ({
+  selectedToolKey,
+  onSelect,
+  filteredTools,
+  isSearching = false,
+}: ToolPickerProps) => {
   const { t } = useTranslation();
 
   const scrollableRef = useRef<HTMLDivElement>(null);
@@ -32,25 +40,29 @@ const ToolPicker = ({ selectedToolKey, onSelect, filteredTools, isSearching = fa
   const favoriteToolItems = useFavoriteToolItems(favoriteTools, toolRegistry);
 
   const quickSection = useMemo(
-    () => visibleSections.find(s => s.key === 'quick'),
-    [visibleSections]
+    () => visibleSections.find((s) => s.key === "quick"),
+    [visibleSections],
   );
 
   const recommendedItems = useMemo(() => {
-    if (!quickSection) return [] as Array<{ id: string; tool: ToolRegistryEntry }>;
+    if (!quickSection)
+      return [] as Array<{ id: string; tool: ToolRegistryEntry }>;
     const items: Array<{ id: string; tool: ToolRegistryEntry }> = [];
-    quickSection.subcategories.forEach((sc: SubcategoryGroup) => sc.tools.forEach((toolEntry) => items.push(toolEntry)));
+    quickSection.subcategories.forEach((sc: SubcategoryGroup) =>
+      sc.tools.forEach((toolEntry) => items.push(toolEntry)),
+    );
     return items;
   }, [quickSection]);
 
   const allSection = useMemo(
-    () => visibleSections.find(s => s.key === 'all'),
-    [visibleSections]
+    () => visibleSections.find((s) => s.key === "all"),
+    [visibleSections],
   );
 
   // Build flat list by subcategory for search mode
-  const emptyFilteredTools: ToolPickerProps['filteredTools'] = [];
-  const effectiveFilteredForSearch: ToolPickerProps['filteredTools'] = isSearching ? filteredTools : emptyFilteredTools;
+  const emptyFilteredTools: ToolPickerProps["filteredTools"] = [];
+  const effectiveFilteredForSearch: ToolPickerProps["filteredTools"] =
+    isSearching ? filteredTools : emptyFilteredTools;
   const { searchGroups } = useToolSections(effectiveFilteredForSearch);
   const headerTextStyle: React.CSSProperties = {
     fontSize: "0.75rem",
@@ -58,10 +70,13 @@ const ToolPicker = ({ selectedToolKey, onSelect, filteredTools, isSearching = fa
     padding: "0.5rem 0 0.25rem 0.5rem",
     textTransform: "none",
     color: "var(--text-secondary, rgba(0, 0, 0, 0.6))",
-    opacity: 0.7
+    opacity: 0.7,
   };
   const toTitleCase = (s: string) =>
-    s.replace(/\w\S*/g, (txt) => txt.charAt(0).toUpperCase() + txt.slice(1).toLowerCase());
+    s.replace(
+      /\w\S*/g,
+      (txt) => txt.charAt(0).toUpperCase() + txt.slice(1).toLowerCase(),
+    );
 
   return (
     <Box
@@ -69,7 +84,7 @@ const ToolPicker = ({ selectedToolKey, onSelect, filteredTools, isSearching = fa
       style={{
         display: "flex",
         flexDirection: "column",
-        background: "var(--bg-toolbar)"
+        background: "var(--bg-toolbar)",
       }}
     >
       <Box
@@ -80,7 +95,7 @@ const ToolPicker = ({ selectedToolKey, onSelect, filteredTools, isSearching = fa
           overflowX: "hidden",
           minHeight: 0,
           height: "100%",
-          marginTop: -2
+          marginTop: -2,
         }}
         className="tool-picker-scrollable"
       >
@@ -89,65 +104,86 @@ const ToolPicker = ({ selectedToolKey, onSelect, filteredTools, isSearching = fa
             {searchGroups.length === 0 ? (
               <NoToolsFound />
             ) : (
-                      searchGroups.map(group => renderToolButtons(t, group, selectedToolKey, onSelect, true, false, filteredTools, true))
+              searchGroups.map((group) =>
+                renderToolButtons(
+                  t,
+                  group,
+                  selectedToolKey,
+                  onSelect,
+                  true,
+                  false,
+                  filteredTools,
+                  true,
+                ),
+              )
             )}
           </Stack>
         ) : (
           <>
-        {/* Flat list: favorites and recommended first, then all subcategories */}
-        <Stack p="sm" gap="xs">
-          {favoriteToolItems.length > 0 && (
-            <Box w="100%">
-              <div style={headerTextStyle}>
-                {t('toolPanel.fullscreen.favorites', 'Favourites')}
-              </div>
-              <div>
-                {favoriteToolItems.map(({ id, tool }) => (
-                  <ToolButton
-                    key={`fav-${id}`}
-                    id={id}
-                    tool={tool}
-                    isSelected={selectedToolKey === id}
-                    onSelect={onSelect}
-                    hasStars
-                  />
+            {/* Flat list: favorites and recommended first, then all subcategories */}
+            <Stack p="sm" gap="xs">
+              {favoriteToolItems.length > 0 && (
+                <Box w="100%">
+                  <div style={headerTextStyle}>
+                    {t("toolPanel.fullscreen.favorites", "Favourites")}
+                  </div>
+                  <div>
+                    {favoriteToolItems.map(({ id, tool }) => (
+                      <ToolButton
+                        key={`fav-${id}`}
+                        id={id}
+                        tool={tool}
+                        isSelected={selectedToolKey === id}
+                        onSelect={onSelect}
+                        hasStars
+                      />
+                    ))}
+                  </div>
+                </Box>
+              )}
+              {recommendedItems.length > 0 && (
+                <Box w="100%">
+                  <div style={headerTextStyle}>
+                    {t("toolPanel.fullscreen.recommended", "Recommended")}
+                  </div>
+                  <div>
+                    {recommendedItems.map(({ id, tool }) => (
+                      <ToolButton
+                        key={`rec-${id}`}
+                        id={id as ToolId}
+                        tool={tool}
+                        isSelected={selectedToolKey === id}
+                        onSelect={onSelect}
+                        hasStars
+                      />
+                    ))}
+                  </div>
+                </Box>
+              )}
+              {allSection &&
+                allSection.subcategories.map((sc: SubcategoryGroup) => (
+                  <Box key={sc.subcategoryId} w="100%">
+                    <div style={headerTextStyle}>
+                      {toTitleCase(getSubcategoryLabel(t, sc.subcategoryId))}
+                    </div>
+                    {renderToolButtons(
+                      t,
+                      sc,
+                      selectedToolKey,
+                      onSelect,
+                      false,
+                      false,
+                      undefined,
+                      true,
+                    )}
+                  </Box>
                 ))}
-              </div>
-            </Box>
-          )}
-          {recommendedItems.length > 0 && (
-            <Box w="100%">
-              <div style={headerTextStyle}>
-                {t('toolPanel.fullscreen.recommended', 'Recommended')}
-              </div>
-              <div>
-                {recommendedItems.map(({ id, tool }) => (
-                  <ToolButton
-                    key={`rec-${id}`}
-                    id={id as ToolId}
-                    tool={tool}
-                    isSelected={selectedToolKey === id}
-                    onSelect={onSelect}
-                    hasStars
-                  />
-                ))}
-              </div>
-            </Box>
-          )}
-          {allSection && allSection.subcategories.map((sc: SubcategoryGroup) => (
-            <Box key={sc.subcategoryId} w="100%">
-              <div style={headerTextStyle}>
-                {toTitleCase(getSubcategoryLabel(t, sc.subcategoryId))}
-              </div>
-              {renderToolButtons(t, sc, selectedToolKey, onSelect, false, false, undefined, true)}
-            </Box>
-          ))}
-        </Stack>
+            </Stack>
 
-        {!quickSection && !allSection && <NoToolsFound />}
+            {!quickSection && !allSection && <NoToolsFound />}
 
-        {/* bottom spacer to allow scrolling past the last row */}
-        <div aria-hidden style={{ height: 200 }} />
+            {/* bottom spacer to allow scrolling past the last row */}
+            <div aria-hidden style={{ height: 200 }} />
           </>
         )}
       </Box>
diff --git a/frontend/src/core/components/tools/ToolRenderer.tsx b/frontend/src/core/components/tools/ToolRenderer.tsx
index bfa2eb91a0..0231252f7c 100644
--- a/frontend/src/core/components/tools/ToolRenderer.tsx
+++ b/frontend/src/core/components/tools/ToolRenderer.tsx
@@ -8,7 +8,6 @@ interface ToolRendererProps extends BaseToolProps {
   selectedToolKey: ToolId;
 }
 
-
 const ToolRenderer = ({
   selectedToolKey,
   onPreviewFile,
@@ -17,9 +16,10 @@ const ToolRenderer = ({
 }: ToolRendererProps) => {
   // Get the tool from context (instead of direct hook call)
   const { toolRegistry } = useToolWorkflow();
-  const selectedTool = (selectedToolKey in toolRegistry)
-    ? toolRegistry[selectedToolKey as ToolId]
-    : undefined;
+  const selectedTool =
+    selectedToolKey in toolRegistry
+      ? toolRegistry[selectedToolKey as ToolId]
+      : undefined;
 
   // Handle tools that only work in workbenches (read, multiTool)
   if (selectedTool && !selectedTool.component && selectedTool.workbench) {
diff --git a/frontend/src/core/components/tools/addAttachments/AddAttachmentsSettings.tsx b/frontend/src/core/components/tools/addAttachments/AddAttachmentsSettings.tsx
index f65ab31da5..9df438b429 100644
--- a/frontend/src/core/components/tools/addAttachments/AddAttachmentsSettings.tsx
+++ b/frontend/src/core/components/tools/addAttachments/AddAttachmentsSettings.tsx
@@ -4,7 +4,15 @@
  * Allows selecting files to attach to PDFs with optional PDF/A-3b conversion support.
  */
 
-import { Stack, Text, Group, ActionIcon, ScrollArea, Button, Checkbox } from "@mantine/core";
+import {
+  Stack,
+  Text,
+  Group,
+  ActionIcon,
+  ScrollArea,
+  Button,
+  Checkbox,
+} from "@mantine/core";
 import { useTranslation } from "react-i18next";
 import { AddAttachmentsParameters } from "@app/hooks/tools/addAttachments/useAddAttachmentsParameters";
 import LocalIcon from "@app/components/shared/LocalIcon";
@@ -12,11 +20,18 @@ import { Tooltip } from "@app/components/shared/Tooltip";
 
 interface AddAttachmentsSettingsProps {
   parameters: AddAttachmentsParameters;
-  onParameterChange: <K extends keyof AddAttachmentsParameters>(key: K, value: AddAttachmentsParameters[K]) => void;
+  onParameterChange: <K extends keyof AddAttachmentsParameters>(
+    key: K,
+    value: AddAttachmentsParameters[K],
+  ) => void;
   disabled?: boolean;
 }
 
-const AddAttachmentsSettings = ({ parameters, onParameterChange, disabled = false }: AddAttachmentsSettingsProps) => {
+const AddAttachmentsSettings = ({
+  parameters,
+  onParameterChange,
+  disabled = false,
+}: AddAttachmentsSettingsProps) => {
   const { t } = useTranslation();
 
   return (
@@ -28,13 +43,16 @@ const AddAttachmentsSettings = ({ parameters, onParameterChange, disabled = fals
           onChange={(e) => {
             const files = Array.from(e.target.files || []);
             // Append to existing attachments instead of replacing
-            const newAttachments = [...(parameters.attachments || []), ...files];
-            onParameterChange('attachments', newAttachments);
+            const newAttachments = [
+              ...(parameters.attachments || []),
+              ...files,
+            ];
+            onParameterChange("attachments", newAttachments);
             // Reset the input so the same file can be selected again
-            e.target.value = '';
+            e.target.value = "";
           }}
           disabled={disabled}
-          style={{ display: 'none' }}
+          style={{ display: "none" }}
           id="attachments-input"
         />
         <Button
@@ -47,34 +65,51 @@ const AddAttachmentsSettings = ({ parameters, onParameterChange, disabled = fals
         >
           {parameters.attachments?.length > 0
             ? t("AddAttachmentsRequest.addMoreFiles", "Add more files...")
-            : t("AddAttachmentsRequest.placeholder", "Choose files...")
-          }
+            : t("AddAttachmentsRequest.placeholder", "Choose files...")}
         </Button>
       </Stack>
 
       {parameters.attachments?.length > 0 && (
         <Stack gap="xs">
           <Text size="sm" fw={500}>
-            {t("AddAttachmentsRequest.selectedFiles", "Selected Files")} ({parameters.attachments.length})
+            {t("AddAttachmentsRequest.selectedFiles", "Selected Files")} (
+            {parameters.attachments.length})
           </Text>
-          <ScrollArea.Autosize mah={300} type="scroll" offsetScrollbars styles={{ viewport: { overflowX: 'hidden' } }}>
+          <ScrollArea.Autosize
+            mah={300}
+            type="scroll"
+            offsetScrollbars
+            styles={{ viewport: { overflowX: "hidden" } }}
+          >
             <Stack gap="xs">
               {parameters.attachments.map((file, index) => (
-                <Group key={index} justify="space-between" p="xs" style={{ border: '1px solid var(--mantine-color-gray-3)', borderRadius: 'var(--mantine-radius-sm)', alignItems: 'flex-start' }}>
-                  <Group gap="xs" style={{ flex: 1, minWidth: 0, alignItems: 'flex-start' }}>
+                <Group
+                  key={index}
+                  justify="space-between"
+                  p="xs"
+                  style={{
+                    border: "1px solid var(--mantine-color-gray-3)",
+                    borderRadius: "var(--mantine-radius-sm)",
+                    alignItems: "flex-start",
+                  }}
+                >
+                  <Group
+                    gap="xs"
+                    style={{ flex: 1, minWidth: 0, alignItems: "flex-start" }}
+                  >
                     {/* Filename (two-line clamp, wraps, no icon on the left) */}
                     <div style={{ flex: 1, minWidth: 0 }}>
                       <div
                         style={{
-                          fontSize: 'var(--mantine-font-size-sm)',
+                          fontSize: "var(--mantine-font-size-sm)",
                           fontWeight: 400,
                           lineHeight: 1.2,
-                          display: '-webkit-box',
+                          display: "-webkit-box",
                           WebkitLineClamp: 2 as any,
-                          WebkitBoxOrient: 'vertical' as any,
-                          overflow: 'hidden',
-                          whiteSpace: 'normal',
-                          wordBreak: 'break-word',
+                          WebkitBoxOrient: "vertical" as any,
+                          overflow: "hidden",
+                          whiteSpace: "normal",
+                          wordBreak: "break-word",
                         }}
                         title={file.name}
                       >
@@ -91,8 +126,10 @@ const AddAttachmentsSettings = ({ parameters, onParameterChange, disabled = fals
                     color="red"
                     style={{ flexShrink: 0 }}
                     onClick={() => {
-                      const newAttachments = (parameters.attachments || []).filter((_, i) => i !== index);
-                      onParameterChange('attachments', newAttachments);
+                      const newAttachments = (
+                        parameters.attachments || []
+                      ).filter((_, i) => i !== index);
+                      onParameterChange("attachments", newAttachments);
                     }}
                     disabled={disabled}
                   >
@@ -110,30 +147,48 @@ const AddAttachmentsSettings = ({ parameters, onParameterChange, disabled = fals
         <Checkbox
           label={
             <Group gap={4}>
-              <Text size="sm">{t("attachments.convertToPdfA3b", "Convert to PDF/A-3b")}</Text>
+              <Text size="sm">
+                {t("attachments.convertToPdfA3b", "Convert to PDF/A-3b")}
+              </Text>
               <Tooltip
                 header={{
-                  title: t("attachments.convertToPdfA3bTooltipHeader", "About PDF/A-3b Conversion")
+                  title: t(
+                    "attachments.convertToPdfA3bTooltipHeader",
+                    "About PDF/A-3b Conversion",
+                  ),
                 }}
                 tips={[
                   {
-                    title: t("attachments.convertToPdfA3bTooltipTitle", "What it does"),
+                    title: t(
+                      "attachments.convertToPdfA3bTooltipTitle",
+                      "What it does",
+                    ),
                     description: t(
                       "attachments.convertToPdfA3bTooltip",
-                      "PDF/A-3b is an archival format ensuring long-term preservation. It allows embedding arbitrary file formats as attachments. Conversion requires Ghostscript and may take longer for large files."
-                    )
-                  }
+                      "PDF/A-3b is an archival format ensuring long-term preservation. It allows embedding arbitrary file formats as attachments. Conversion requires Ghostscript and may take longer for large files.",
+                    ),
+                  },
                 ]}
                 sidebarTooltip={true}
                 pinOnClick={true}
               >
-                <LocalIcon icon="info-outline-rounded" width="1.25rem" height="1.25rem" style={{ color: 'var(--icon-files-color)', cursor: 'help' }} />
+                <LocalIcon
+                  icon="info-outline-rounded"
+                  width="1.25rem"
+                  height="1.25rem"
+                  style={{ color: "var(--icon-files-color)", cursor: "help" }}
+                />
               </Tooltip>
             </Group>
           }
-          description={t("attachments.convertToPdfA3bDescription", "Creates an archival PDF with embedded attachments")}
+          description={t(
+            "attachments.convertToPdfA3bDescription",
+            "Creates an archival PDF with embedded attachments",
+          )}
           checked={parameters.convertToPdfA3b}
-          onChange={(event) => onParameterChange('convertToPdfA3b', event.currentTarget.checked)}
+          onChange={(event) =>
+            onParameterChange("convertToPdfA3b", event.currentTarget.checked)
+          }
           disabled={disabled}
           styles={{ root: { flex: 1 } }}
         />
diff --git a/frontend/src/core/components/tools/addPageNumbers/AddPageNumbersAppearanceSettings.tsx b/frontend/src/core/components/tools/addPageNumbers/AddPageNumbersAppearanceSettings.tsx
index 0ff9690d8d..79931d1295 100644
--- a/frontend/src/core/components/tools/addPageNumbers/AddPageNumbersAppearanceSettings.tsx
+++ b/frontend/src/core/components/tools/addPageNumbers/AddPageNumbersAppearanceSettings.tsx
@@ -10,76 +10,121 @@ import { Z_INDEX_AUTOMATE_DROPDOWN } from "@app/styles/zIndex";
 
 interface AddPageNumbersAppearanceSettingsProps {
   parameters: AddPageNumbersParameters;
-  onParameterChange: <K extends keyof AddPageNumbersParameters>(key: K, value: AddPageNumbersParameters[K]) => void;
+  onParameterChange: <K extends keyof AddPageNumbersParameters>(
+    key: K,
+    value: AddPageNumbersParameters[K],
+  ) => void;
   disabled?: boolean;
 }
 
 const AddPageNumbersAppearanceSettings = ({
   parameters,
   onParameterChange,
-  disabled = false
+  disabled = false,
 }: AddPageNumbersAppearanceSettingsProps) => {
   const { t } = useTranslation();
 
   return (
     <Stack gap="md">
-      <Tooltip content={t('marginTooltip', 'Distance between the page number and the edge of the page.')}>
+      <Tooltip
+        content={t(
+          "marginTooltip",
+          "Distance between the page number and the edge of the page.",
+        )}
+      >
         <Select
-          label={t('addPageNumbers.selectText.2', 'Margin')}
+          label={t("addPageNumbers.selectText.2", "Margin")}
           value={parameters.customMargin}
-          onChange={(v) => onParameterChange('customMargin', (v as any) || 'medium')}
+          onChange={(v) =>
+            onParameterChange("customMargin", (v as any) || "medium")
+          }
           data={[
-            { value: 'small', label: t('sizes.small', 'Small') },
-            { value: 'medium', label: t('sizes.medium', 'Medium') },
-            { value: 'large', label: t('sizes.large', 'Large') },
-            { value: 'x-large', label: t('sizes.x-large', 'Extra Large') },
+            { value: "small", label: t("sizes.small", "Small") },
+            { value: "medium", label: t("sizes.medium", "Medium") },
+            { value: "large", label: t("sizes.large", "Large") },
+            { value: "x-large", label: t("sizes.x-large", "Extra Large") },
           ]}
           disabled={disabled}
-          comboboxProps={{ withinPortal: true, zIndex: Z_INDEX_AUTOMATE_DROPDOWN }}
+          comboboxProps={{
+            withinPortal: true,
+            zIndex: Z_INDEX_AUTOMATE_DROPDOWN,
+          }}
         />
       </Tooltip>
 
-      <Tooltip content={t('fontSizeTooltip', 'Size of the page number text in points. Larger numbers create bigger text.')}>
+      <Tooltip
+        content={t(
+          "fontSizeTooltip",
+          "Size of the page number text in points. Larger numbers create bigger text.",
+        )}
+      >
         <NumberInput
-          label={t('addPageNumbers.fontSize', 'Font Size')}
+          label={t("addPageNumbers.fontSize", "Font Size")}
           value={parameters.fontSize}
-          onChange={(v) => onParameterChange('fontSize', typeof v === 'number' ? v : 12)}
+          onChange={(v) =>
+            onParameterChange("fontSize", typeof v === "number" ? v : 12)
+          }
           min={1}
           disabled={disabled}
         />
       </Tooltip>
 
-      <Tooltip content={t('addPageNumbers.zeroPadTooltip', 'Zero-pad (Bates Stamp) page numbers to this width (e.g. 3 => 001). Set 0 to disable.')}>
+      <Tooltip
+        content={t(
+          "addPageNumbers.zeroPadTooltip",
+          "Zero-pad (Bates Stamp) page numbers to this width (e.g. 3 => 001). Set 0 to disable.",
+        )}
+      >
         <NumberInput
-          label={t('addPageNumbers.zeroPad', 'Zero-pad Width (Bates Stamping)')}
+          label={t("addPageNumbers.zeroPad", "Zero-pad Width (Bates Stamping)")}
           value={parameters.zeroPad}
-          onChange={(v) => onParameterChange('zeroPad', typeof v === 'number' ? v : 0)}
+          onChange={(v) =>
+            onParameterChange("zeroPad", typeof v === "number" ? v : 0)
+          }
           min={0}
           disabled={disabled}
         />
       </Tooltip>
 
-      <Tooltip content={t('fontTypeTooltip', 'Font family for the page numbers. Choose based on your document style.')}>
+      <Tooltip
+        content={t(
+          "fontTypeTooltip",
+          "Font family for the page numbers. Choose based on your document style.",
+        )}
+      >
         <Select
-          label={t('addPageNumbers.fontName', 'Font Type')}
+          label={t("addPageNumbers.fontName", "Font Type")}
           value={parameters.fontType}
-          onChange={(v) => onParameterChange('fontType', (v as any) || 'Times')}
+          onChange={(v) => onParameterChange("fontType", (v as any) || "Times")}
           data={[
-            { value: 'Times', label: 'Times Roman' },
-            { value: 'Helvetica', label: 'Helvetica' },
-            { value: 'Courier', label: 'Courier New' },
+            { value: "Times", label: "Times Roman" },
+            { value: "Helvetica", label: "Helvetica" },
+            { value: "Courier", label: "Courier New" },
           ]}
           disabled={disabled}
-          comboboxProps={{ withinPortal: true, zIndex: Z_INDEX_AUTOMATE_DROPDOWN }}
+          comboboxProps={{
+            withinPortal: true,
+            zIndex: Z_INDEX_AUTOMATE_DROPDOWN,
+          }}
         />
       </Tooltip>
 
-      <Tooltip content={t('customTextTooltip', 'Optional custom format for page numbers. Use {n} as placeholder for the number. Example: "Page {n}" will show "Page 1", "Page 2", etc.')}>
+      <Tooltip
+        content={t(
+          "customTextTooltip",
+          'Optional custom format for page numbers. Use {n} as placeholder for the number. Example: "Page {n}" will show "Page 1", "Page 2", etc.',
+        )}
+      >
         <TextInput
-          label={t('addPageNumbers.selectText.6', 'Custom Text Format')}
-          value={parameters.customText || ''}
-          onChange={(e) => onParameterChange('customText', e.currentTarget.value)}
-          placeholder={t('addPageNumbers.customNumberDesc', 'e.g., "Page {n}" or leave blank for just numbers')}
+          label={t("addPageNumbers.selectText.6", "Custom Text Format")}
+          value={parameters.customText || ""}
+          onChange={(e) =>
+            onParameterChange("customText", e.currentTarget.value)
+          }
+          placeholder={t(
+            "addPageNumbers.customNumberDesc",
+            'e.g., "Page {n}" or leave blank for just numbers',
+          )}
           disabled={disabled}
         />
       </Tooltip>
diff --git a/frontend/src/core/components/tools/addPageNumbers/AddPageNumbersAutomationSettings.tsx b/frontend/src/core/components/tools/addPageNumbers/AddPageNumbersAutomationSettings.tsx
index 2cb4ff17cf..06c8b94a26 100644
--- a/frontend/src/core/components/tools/addPageNumbers/AddPageNumbersAutomationSettings.tsx
+++ b/frontend/src/core/components/tools/addPageNumbers/AddPageNumbersAutomationSettings.tsx
@@ -12,14 +12,17 @@ import AddPageNumbersAppearanceSettings from "@app/components/tools/addPageNumbe
 
 interface AddPageNumbersAutomationSettingsProps {
   parameters: AddPageNumbersParameters;
-  onParameterChange: <K extends keyof AddPageNumbersParameters>(key: K, value: AddPageNumbersParameters[K]) => void;
+  onParameterChange: <K extends keyof AddPageNumbersParameters>(
+    key: K,
+    value: AddPageNumbersParameters[K],
+  ) => void;
   disabled?: boolean;
 }
 
 const AddPageNumbersAutomationSettings = ({
   parameters,
   onParameterChange,
-  disabled = false
+  disabled = false,
 }: AddPageNumbersAutomationSettingsProps) => {
   const { t } = useTranslation();
 
@@ -27,7 +30,9 @@ const AddPageNumbersAutomationSettings = ({
     <Stack gap="lg">
       {/* Position & Pages Section */}
       <Stack gap="md">
-        <Text size="sm" fw={600}>{t("addPageNumbers.positionAndPages", "Position & Pages")}</Text>
+        <Text size="sm" fw={600}>
+          {t("addPageNumbers.positionAndPages", "Position & Pages")}
+        </Text>
         <AddPageNumbersPositionSettings
           parameters={parameters}
           onParameterChange={onParameterChange}
@@ -41,7 +46,9 @@ const AddPageNumbersAutomationSettings = ({
 
       {/* Appearance Section */}
       <Stack gap="md">
-        <Text size="sm" fw={600}>{t("addPageNumbers.customize", "Customize Appearance")}</Text>
+        <Text size="sm" fw={600}>
+          {t("addPageNumbers.customize", "Customize Appearance")}
+        </Text>
         <AddPageNumbersAppearanceSettings
           parameters={parameters}
           onParameterChange={onParameterChange}
diff --git a/frontend/src/core/components/tools/addPageNumbers/AddPageNumbersPositionSettings.tsx b/frontend/src/core/components/tools/addPageNumbers/AddPageNumbersPositionSettings.tsx
index c64f1cac12..735eda3e1c 100644
--- a/frontend/src/core/components/tools/addPageNumbers/AddPageNumbersPositionSettings.tsx
+++ b/frontend/src/core/components/tools/addPageNumbers/AddPageNumbersPositionSettings.tsx
@@ -10,7 +10,10 @@ import PageNumberPreview from "@app/components/tools/addPageNumbers/PageNumberPr
 
 interface AddPageNumbersPositionSettingsProps {
   parameters: AddPageNumbersParameters;
-  onParameterChange: <K extends keyof AddPageNumbersParameters>(key: K, value: AddPageNumbersParameters[K]) => void;
+  onParameterChange: <K extends keyof AddPageNumbersParameters>(
+    key: K,
+    value: AddPageNumbersParameters[K],
+  ) => void;
   disabled?: boolean;
   file?: File | null;
   showQuickGrid?: boolean;
@@ -21,7 +24,7 @@ const AddPageNumbersPositionSettings = ({
   onParameterChange,
   disabled = false,
   file = null,
-  showQuickGrid = true
+  showQuickGrid = true,
 }: AddPageNumbersPositionSettingsProps) => {
   const { t } = useTranslation();
 
@@ -41,23 +44,42 @@ const AddPageNumbersPositionSettings = ({
 
       {/* Pages & Starting Number Section */}
       <Stack gap="md">
-        <Text size="sm" fw={500} mb="xs">{t('addPageNumbers.pagesAndStarting', 'Pages & Starting Number')}</Text>
+        <Text size="sm" fw={500} mb="xs">
+          {t("addPageNumbers.pagesAndStarting", "Pages & Starting Number")}
+        </Text>
 
-        <Tooltip content={t('pageSelectionPrompt', 'Custom Page Selection (Enter a comma-separated list of page numbers 1,5,6 or Functions like 2n+1)')}>
+        <Tooltip
+          content={t(
+            "pageSelectionPrompt",
+            "Custom Page Selection (Enter a comma-separated list of page numbers 1,5,6 or Functions like 2n+1)",
+          )}
+        >
           <TextInput
-            label={t('addPageNumbers.selectText.5', 'Pages to Number')}
-            value={parameters.pagesToNumber || ''}
-            onChange={(e) => onParameterChange('pagesToNumber', e.currentTarget.value)}
-            placeholder={t('addPageNumbers.numberPagesDesc', 'e.g., 1,3,5-8 or leave blank for all pages')}
+            label={t("addPageNumbers.selectText.5", "Pages to Number")}
+            value={parameters.pagesToNumber || ""}
+            onChange={(e) =>
+              onParameterChange("pagesToNumber", e.currentTarget.value)
+            }
+            placeholder={t(
+              "addPageNumbers.numberPagesDesc",
+              "e.g., 1,3,5-8 or leave blank for all pages",
+            )}
             disabled={disabled}
           />
         </Tooltip>
 
-        <Tooltip content={t('startingNumberTooltip', 'The first number to display. Subsequent pages will increment from this number.')}>
+        <Tooltip
+          content={t(
+            "startingNumberTooltip",
+            "The first number to display. Subsequent pages will increment from this number.",
+          )}
+        >
           <NumberInput
-            label={t('addPageNumbers.selectText.4', 'Starting Number')}
+            label={t("addPageNumbers.selectText.4", "Starting Number")}
             value={parameters.startingNumber}
-            onChange={(v) => onParameterChange('startingNumber', typeof v === 'number' ? v : 1)}
+            onChange={(v) =>
+              onParameterChange("startingNumber", typeof v === "number" ? v : 1)
+            }
             min={1}
             disabled={disabled}
           />
diff --git a/frontend/src/core/components/tools/addPageNumbers/PageNumberPreview.module.css b/frontend/src/core/components/tools/addPageNumbers/PageNumberPreview.module.css
index eff81e632c..8a20a78340 100644
--- a/frontend/src/core/components/tools/addPageNumbers/PageNumberPreview.module.css
+++ b/frontend/src/core/components/tools/addPageNumbers/PageNumberPreview.module.css
@@ -55,15 +55,48 @@
 }
 
 /* Position numbers at edges within each tile with extra top/bottom spacing */
-.gridTile:nth-child(1) { align-items: flex-start; justify-content: flex-start; padding-top: 4px; } /* top-left */
-.gridTile:nth-child(2) { align-items: flex-start; justify-content: center; padding-top: 4px; }     /* top-center */
-.gridTile:nth-child(3) { align-items: flex-start; justify-content: flex-end; padding-top: 4px; }  /* top-right */
-.gridTile:nth-child(4) { align-items: center; justify-content: flex-start; }    /* middle-left */
-.gridTile:nth-child(5) { align-items: center; justify-content: center; }        /* center */
-.gridTile:nth-child(6) { align-items: center; justify-content: flex-end; }      /* middle-right */
-.gridTile:nth-child(7) { align-items: flex-end; justify-content: flex-start; padding-bottom: 4px; }  /* bottom-left */
-.gridTile:nth-child(8) { align-items: flex-end; justify-content: center; padding-bottom: 4px; }      /* bottom-center */
-.gridTile:nth-child(9) { align-items: flex-end; justify-content: flex-end; padding-bottom: 4px; }    /* bottom-right */
+.gridTile:nth-child(1) {
+  align-items: flex-start;
+  justify-content: flex-start;
+  padding-top: 4px;
+} /* top-left */
+.gridTile:nth-child(2) {
+  align-items: flex-start;
+  justify-content: center;
+  padding-top: 4px;
+} /* top-center */
+.gridTile:nth-child(3) {
+  align-items: flex-start;
+  justify-content: flex-end;
+  padding-top: 4px;
+} /* top-right */
+.gridTile:nth-child(4) {
+  align-items: center;
+  justify-content: flex-start;
+} /* middle-left */
+.gridTile:nth-child(5) {
+  align-items: center;
+  justify-content: center;
+} /* center */
+.gridTile:nth-child(6) {
+  align-items: center;
+  justify-content: flex-end;
+} /* middle-right */
+.gridTile:nth-child(7) {
+  align-items: flex-end;
+  justify-content: flex-start;
+  padding-bottom: 4px;
+} /* bottom-left */
+.gridTile:nth-child(8) {
+  align-items: flex-end;
+  justify-content: center;
+  padding-bottom: 4px;
+} /* bottom-center */
+.gridTile:nth-child(9) {
+  align-items: flex-end;
+  justify-content: flex-end;
+  padding-bottom: 4px;
+} /* bottom-right */
 
 /* Base padding for all tiles */
 .gridTile {
@@ -99,4 +132,4 @@
   margin-top: 8px;
   opacity: 0.7;
   font-size: 12px;
-}
\ No newline at end of file
+}
diff --git a/frontend/src/core/components/tools/addPageNumbers/PageNumberPreview.tsx b/frontend/src/core/components/tools/addPageNumbers/PageNumberPreview.tsx
index 7bf0dab04d..3b5b42cb24 100644
--- a/frontend/src/core/components/tools/addPageNumbers/PageNumberPreview.tsx
+++ b/frontend/src/core/components/tools/addPageNumbers/PageNumberPreview.tsx
@@ -1,20 +1,23 @@
-import { useEffect, useMemo, useRef, useState } from 'react';
-import { useTranslation } from 'react-i18next';
-import { AddPageNumbersParameters } from '@app/components/tools/addPageNumbers/useAddPageNumbersParameters';
-import { pdfWorkerManager } from '@app/services/pdfWorkerManager';
-import { useThumbnailGeneration } from '@app/hooks/useThumbnailGeneration';
-import styles from '@app/components/tools/addPageNumbers/PageNumberPreview.module.css';
-import { PrivateContent } from '@app/components/shared/PrivateContent';
+import { useEffect, useMemo, useRef, useState } from "react";
+import { useTranslation } from "react-i18next";
+import { AddPageNumbersParameters } from "@app/components/tools/addPageNumbers/useAddPageNumbersParameters";
+import { pdfWorkerManager } from "@app/services/pdfWorkerManager";
+import { useThumbnailGeneration } from "@app/hooks/useThumbnailGeneration";
+import styles from "@app/components/tools/addPageNumbers/PageNumberPreview.module.css";
+import { PrivateContent } from "@app/components/shared/PrivateContent";
 
 // Simple utilities for page numbers (adapted from stamp)
 const A4_ASPECT_RATIO = 0.707;
 
 const getFirstSelectedPage = (input: string): number => {
   if (!input) return 1;
-  const parts = input.split(',').map(s => s.trim()).filter(Boolean);
+  const parts = input
+    .split(",")
+    .map((s) => s.trim())
+    .filter(Boolean);
   for (const part of parts) {
     if (/^\d+\s*-\s*\d+$/.test(part)) {
-      const low = parseInt(part.split('-')[0].trim(), 10);
+      const low = parseInt(part.split("-")[0].trim(), 10);
       if (Number.isFinite(low) && low > 0) return low;
     }
     const n = parseInt(part, 10);
@@ -23,23 +26,24 @@ const getFirstSelectedPage = (input: string): number => {
   return 1;
 };
 
-
-const detectOverallBackgroundColor = async (thumbnailSrc: string | null): Promise<'light' | 'dark'> => {
+const detectOverallBackgroundColor = async (
+  thumbnailSrc: string | null,
+): Promise<"light" | "dark"> => {
   if (!thumbnailSrc) {
-    return 'light'; // Default to light background if no thumbnail
+    return "light"; // Default to light background if no thumbnail
   }
 
   return new Promise((resolve) => {
     const img = new Image();
-    img.crossOrigin = 'anonymous';
+    img.crossOrigin = "anonymous";
 
     img.onload = () => {
       try {
-        const canvas = document.createElement('canvas');
-        const ctx = canvas.getContext('2d');
+        const canvas = document.createElement("canvas");
+        const ctx = canvas.getContext("2d");
 
         if (!ctx) {
-          resolve('light');
+          resolve("light");
           return;
         }
 
@@ -57,7 +61,10 @@ const detectOverallBackgroundColor = async (thumbnailSrc: string | null): Promis
         let pixelCount = 0;
 
         // Sample every nth pixel for performance
-        const step = Math.max(1, Math.floor((img.width * img.height) / (sampleWidth * sampleHeight)));
+        const step = Math.max(
+          1,
+          Math.floor((img.width * img.height) / (sampleWidth * sampleHeight)),
+        );
 
         for (let i = 0; i < data.length; i += 4 * step) {
           const r = data[i];
@@ -65,7 +72,7 @@ const detectOverallBackgroundColor = async (thumbnailSrc: string | null): Promis
           const b = data[i + 2];
 
           // Calculate perceived brightness using luminance formula
-          const brightness = (0.299 * r + 0.587 * g + 0.114 * b);
+          const brightness = 0.299 * r + 0.587 * g + 0.114 * b;
           totalBrightness += brightness;
           pixelCount++;
         }
@@ -73,42 +80,61 @@ const detectOverallBackgroundColor = async (thumbnailSrc: string | null): Promis
         const averageBrightness = totalBrightness / pixelCount;
 
         // Threshold: 128 is middle gray
-        resolve(averageBrightness > 128 ? 'light' : 'dark');
+        resolve(averageBrightness > 128 ? "light" : "dark");
       } catch (error) {
-        console.warn('Error detecting background color:', error);
-        resolve('light'); // Default fallback
+        console.warn("Error detecting background color:", error);
+        resolve("light"); // Default fallback
       }
     };
 
-    img.onerror = () => resolve('light');
+    img.onerror = () => resolve("light");
     img.src = thumbnailSrc;
   });
 };
 
 type Props = {
   parameters: AddPageNumbersParameters;
-  onParameterChange: <K extends keyof AddPageNumbersParameters>(key: K, value: AddPageNumbersParameters[K]) => void;
+  onParameterChange: <K extends keyof AddPageNumbersParameters>(
+    key: K,
+    value: AddPageNumbersParameters[K],
+  ) => void;
   file?: File | null;
   showQuickGrid?: boolean;
 };
 
-export default function PageNumberPreview({ parameters, onParameterChange, file, showQuickGrid }: Props) {
+export default function PageNumberPreview({
+  parameters,
+  onParameterChange,
+  file,
+  showQuickGrid,
+}: Props) {
   const { t } = useTranslation();
   const containerRef = useRef<HTMLDivElement>(null);
-  const [, setContainerSize] = useState<{ width: number; height: number }>({ width: 0, height: 0 });
-  const [pageSize, setPageSize] = useState<{ widthPts: number; heightPts: number } | null>(null);
+  const [, setContainerSize] = useState<{ width: number; height: number }>({
+    width: 0,
+    height: 0,
+  });
+  const [pageSize, setPageSize] = useState<{
+    widthPts: number;
+    heightPts: number;
+  } | null>(null);
   const [pageThumbnail, setPageThumbnail] = useState<string | null>(null);
   const { requestThumbnail } = useThumbnailGeneration();
   const [hoverTile, setHoverTile] = useState<number | null>(null);
-  const [textColor, setTextColor] = useState<string>('#fff');
+  const [textColor, setTextColor] = useState<string>("#fff");
 
   // Observe container size for responsive positioning
   useEffect(() => {
     const node = containerRef.current;
     if (!node) return;
     const resize = () => {
-      const aspect = pageSize ? (pageSize.widthPts / pageSize.heightPts) : A4_ASPECT_RATIO;
-      setContainerSize({ width: node.clientWidth, height: node.clientWidth / aspect });
+      const aspect = pageSize
+        ? pageSize.widthPts / pageSize.heightPts
+        : A4_ASPECT_RATIO;
+      setContainerSize({
+        width: node.clientWidth,
+        height: node.clientWidth / aspect,
+      });
     };
     resize();
     const ro = new ResizeObserver(resize);
@@ -120,13 +146,16 @@ export default function PageNumberPreview({ parameters, onParameterChange, file,
   useEffect(() => {
     let cancelled = false;
     const load = async () => {
-      if (!file || file.type !== 'application/pdf') {
+      if (!file || file.type !== "application/pdf") {
         setPageSize(null);
         return;
       }
       try {
         const buffer = await file.arrayBuffer();
-        const pdf = await pdfWorkerManager.createDocument(buffer, { disableAutoFetch: true, disableStream: true });
+        const pdf = await pdfWorkerManager.createDocument(buffer, {
+          disableAutoFetch: true,
+          disableStream: true,
+        });
         const page = await pdf.getPage(1);
         const viewport = page.getViewport({ scale: 1 });
         if (!cancelled) {
@@ -138,19 +167,24 @@ export default function PageNumberPreview({ parameters, onParameterChange, file,
       }
     };
     load();
-    return () => { cancelled = true; };
+    return () => {
+      cancelled = true;
+    };
   }, [file]);
 
   // Load first-page thumbnail for background preview
   useEffect(() => {
     let isActive = true;
     const loadThumb = async () => {
-      if (!file || file.type !== 'application/pdf') {
+      if (!file || file.type !== "application/pdf") {
         setPageThumbnail(null);
         return;
       }
       try {
-        const pageNumber = Math.max(1, getFirstSelectedPage(parameters.pagesToNumber || '1'));
+        const pageNumber = Math.max(
+          1,
+          getFirstSelectedPage(parameters.pagesToNumber || "1"),
+        );
         const pageId = `${file.name}:${file.size}:${file.lastModified}:page:${pageNumber}`;
         const thumb = await requestThumbnail(pageId, file, pageNumber);
         if (isActive) setPageThumbnail(thumb || null);
@@ -159,38 +193,45 @@ export default function PageNumberPreview({ parameters, onParameterChange, file,
       }
     };
     loadThumb();
-    return () => { isActive = false; };
+    return () => {
+      isActive = false;
+    };
   }, [file, parameters.pagesToNumber, requestThumbnail]);
 
   // Detect text color based on overall PDF background
   useEffect(() => {
     if (!pageThumbnail) {
-      setTextColor('#fff'); // Default to white for no thumbnail
+      setTextColor("#fff"); // Default to white for no thumbnail
       return;
     }
 
     const detectColor = async () => {
       const backgroundType = await detectOverallBackgroundColor(pageThumbnail);
-      setTextColor(backgroundType === 'light' ? '#000' : '#fff');
+      setTextColor(backgroundType === "light" ? "#000" : "#fff");
     };
 
     detectColor();
   }, [pageThumbnail]);
 
-  const containerStyle = useMemo(() => ({
-    position: 'relative' as const,
-    width: '100%',
-    aspectRatio: `${(pageSize?.widthPts ?? 595.28) / (pageSize?.heightPts ?? 841.89)} / 1`,
-    backgroundColor: pageThumbnail ? 'white' : 'rgba(255,255,255,0.03)',
-    border: '1px solid var(--border-default, #333)',
-    overflow: 'hidden' as const
-  }), [pageSize, pageThumbnail]);
+  const containerStyle = useMemo(
+    () => ({
+      position: "relative" as const,
+      width: "100%",
+      aspectRatio: `${(pageSize?.widthPts ?? 595.28) / (pageSize?.heightPts ?? 841.89)} / 1`,
+      backgroundColor: pageThumbnail ? "white" : "rgba(255,255,255,0.03)",
+      border: "1px solid var(--border-default, #333)",
+      overflow: "hidden" as const,
+    }),
+    [pageSize, pageThumbnail],
+  );
 
   return (
     <div>
       <div className={styles.previewHeader}>
         <div className={styles.divider} />
-        <div className={styles.previewLabel}>{t('addPageNumbers.preview', 'Preview Page Numbers')}</div>
+        <div className={styles.previewLabel}>
+          {t("addPageNumbers.preview", "Preview Page Numbers")}
+        </div>
       </div>
       <div
         ref={containerRef}
@@ -212,21 +253,22 @@ export default function PageNumberPreview({ parameters, onParameterChange, file,
         {showQuickGrid && (
           <div className={styles.quickGrid}>
             {Array.from({ length: 9 }).map((_, i) => {
-              const idx = (i + 1) as 1|2|3|4|5|6|7|8|9;
+              const idx = (i + 1) as 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9;
               const selected = parameters.position === idx;
               return (
                 <button
                   key={idx}
                   type="button"
-                  className={`${styles.gridTile} ${selected || hoverTile === idx ? styles.gridTileSelected : ''} ${hoverTile === idx ? styles.gridTileHovered : ''}`}
-                  onClick={() => onParameterChange('position', idx as any)}
+                  className={`${styles.gridTile} ${selected || hoverTile === idx ? styles.gridTileSelected : ""} ${hoverTile === idx ? styles.gridTileHovered : ""}`}
+                  onClick={() => onParameterChange("position", idx as any)}
                   onMouseEnter={() => setHoverTile(idx)}
                   onMouseLeave={() => setHoverTile(null)}
                   style={{
                     color: textColor,
-                    textShadow: textColor === '#fff'
-                      ? '1px 1px 2px rgba(0, 0, 0, 0.8)'
-                      : '1px 1px 2px rgba(255, 255, 255, 0.8)'
+                    textShadow:
+                      textColor === "#fff"
+                        ? "1px 1px 2px rgba(0, 0, 0, 0.8)"
+                        : "1px 1px 2px rgba(255, 255, 255, 0.8)",
                   }}
                 >
                   {idx}
@@ -237,7 +279,10 @@ export default function PageNumberPreview({ parameters, onParameterChange, file,
         )}
       </div>
       <div className={styles.previewDisclaimer}>
-        {t('addPageNumbers.previewDisclaimer', 'Preview is approximate. Final output may vary due to PDF font metrics.')}
+        {t(
+          "addPageNumbers.previewDisclaimer",
+          "Preview is approximate. Final output may vary due to PDF font metrics.",
+        )}
       </div>
     </div>
   );
diff --git a/frontend/src/core/components/tools/addPageNumbers/useAddPageNumbersOperation.ts b/frontend/src/core/components/tools/addPageNumbers/useAddPageNumbersOperation.ts
index 48c2d2c45a..f9bf73f4ce 100644
--- a/frontend/src/core/components/tools/addPageNumbers/useAddPageNumbersOperation.ts
+++ b/frontend/src/core/components/tools/addPageNumbers/useAddPageNumbersOperation.ts
@@ -1,19 +1,28 @@
-import { useTranslation } from 'react-i18next';
-import { ToolType, useToolOperation } from '@app/hooks/tools/shared/useToolOperation';
-import { createStandardErrorHandler } from '@app/utils/toolErrorHandler';
-import { AddPageNumbersParameters, defaultParameters } from '@app/components/tools/addPageNumbers/useAddPageNumbersParameters';
+import { useTranslation } from "react-i18next";
+import {
+  ToolType,
+  useToolOperation,
+} from "@app/hooks/tools/shared/useToolOperation";
+import { createStandardErrorHandler } from "@app/utils/toolErrorHandler";
+import {
+  AddPageNumbersParameters,
+  defaultParameters,
+} from "@app/components/tools/addPageNumbers/useAddPageNumbersParameters";
 
-export const buildAddPageNumbersFormData = (parameters: AddPageNumbersParameters, file: File): FormData => {
+export const buildAddPageNumbersFormData = (
+  parameters: AddPageNumbersParameters,
+  file: File,
+): FormData => {
   const formData = new FormData();
-  formData.append('fileInput', file);
-  formData.append('customMargin', parameters.customMargin);
-  formData.append('position', String(parameters.position));
-  formData.append('fontSize', String(parameters.fontSize));
-  formData.append('fontType', parameters.fontType);
-  formData.append('startingNumber', String(parameters.startingNumber));
-  formData.append('pagesToNumber', parameters.pagesToNumber);
-  formData.append('customText', parameters.customText);
-  formData.append('zeroPad', String(parameters.zeroPad));
+  formData.append("fileInput", file);
+  formData.append("customMargin", parameters.customMargin);
+  formData.append("position", String(parameters.position));
+  formData.append("fontSize", String(parameters.fontSize));
+  formData.append("fontType", parameters.fontType);
+  formData.append("startingNumber", String(parameters.startingNumber));
+  formData.append("pagesToNumber", parameters.pagesToNumber);
+  formData.append("customText", parameters.customText);
+  formData.append("zeroPad", String(parameters.zeroPad));
 
   return formData;
 };
@@ -21,8 +30,8 @@ export const buildAddPageNumbersFormData = (parameters: AddPageNumbersParameters
 export const addPageNumbersOperationConfig = {
   toolType: ToolType.singleFile,
   buildFormData: buildAddPageNumbersFormData,
-  operationType: 'addPageNumbers',
-  endpoint: '/api/v1/misc/add-page-numbers',
+  operationType: "addPageNumbers",
+  endpoint: "/api/v1/misc/add-page-numbers",
   defaultParameters,
 } as const;
 
@@ -32,7 +41,10 @@ export const useAddPageNumbersOperation = () => {
   return useToolOperation<AddPageNumbersParameters>({
     ...addPageNumbersOperationConfig,
     getErrorMessage: createStandardErrorHandler(
-      t('addPageNumbers.error.failed', 'An error occurred while adding page numbers to the PDF.')
+      t(
+        "addPageNumbers.error.failed",
+        "An error occurred while adding page numbers to the PDF.",
+      ),
     ),
   });
-};
\ No newline at end of file
+};
diff --git a/frontend/src/core/components/tools/addPageNumbers/useAddPageNumbersParameters.ts b/frontend/src/core/components/tools/addPageNumbers/useAddPageNumbersParameters.ts
index ea5c623cb4..43f2d18ec0 100644
--- a/frontend/src/core/components/tools/addPageNumbers/useAddPageNumbersParameters.ts
+++ b/frontend/src/core/components/tools/addPageNumbers/useAddPageNumbersParameters.ts
@@ -1,11 +1,14 @@
-import { BaseParameters } from '@app/types/parameters';
-import { useBaseParameters, type BaseParametersHook } from '@app/hooks/tools/shared/useBaseParameters';
+import { BaseParameters } from "@app/types/parameters";
+import {
+  useBaseParameters,
+  type BaseParametersHook,
+} from "@app/hooks/tools/shared/useBaseParameters";
 
 export interface AddPageNumbersParameters extends BaseParameters {
-  customMargin: 'small' | 'medium' | 'large' | 'x-large';
+  customMargin: "small" | "medium" | "large" | "x-large";
   position: 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9;
   fontSize: number;
-  fontType: 'Times' | 'Helvetica' | 'Courier';
+  fontType: "Times" | "Helvetica" | "Courier";
   startingNumber: number;
   pagesToNumber: string;
   customText: string;
@@ -14,24 +17,25 @@ export interface AddPageNumbersParameters extends BaseParameters {
 }
 
 export const defaultParameters: AddPageNumbersParameters = {
-  customMargin: 'medium',
+  customMargin: "medium",
   position: 8, // Default to bottom center like the original HTML
   fontSize: 12,
-  fontType: 'Times',
+  fontType: "Times",
   startingNumber: 1,
-  pagesToNumber: '',
-  customText: '',
+  pagesToNumber: "",
+  customText: "",
   zeroPad: 0,
 };
 
-export type AddPageNumbersParametersHook = BaseParametersHook<AddPageNumbersParameters>;
+export type AddPageNumbersParametersHook =
+  BaseParametersHook<AddPageNumbersParameters>;
 
 export const useAddPageNumbersParameters = (): AddPageNumbersParametersHook => {
   return useBaseParameters<AddPageNumbersParameters>({
     defaultParameters,
-    endpointName: 'add-page-numbers',
+    endpointName: "add-page-numbers",
     validateFn: (params): boolean => {
       return params.fontSize > 0 && params.startingNumber > 0;
     },
   });
-};
\ No newline at end of file
+};
diff --git a/frontend/src/core/components/tools/addPassword/AddPasswordSettings.test.tsx b/frontend/src/core/components/tools/addPassword/AddPasswordSettings.test.tsx
index 4dea56e1ea..626092c70d 100644
--- a/frontend/src/core/components/tools/addPassword/AddPasswordSettings.test.tsx
+++ b/frontend/src/core/components/tools/addPassword/AddPasswordSettings.test.tsx
@@ -1,13 +1,13 @@
-import { describe, expect, test, vi, beforeEach } from 'vitest';
-import { render, screen, fireEvent } from '@testing-library/react';
-import { MantineProvider } from '@mantine/core';
-import AddPasswordSettings from '@app/components/tools/addPassword/AddPasswordSettings';
-import { defaultParameters } from '@app/hooks/tools/addPassword/useAddPasswordParameters';
+import { describe, expect, test, vi, beforeEach } from "vitest";
+import { render, screen, fireEvent } from "@testing-library/react";
+import { MantineProvider } from "@mantine/core";
+import AddPasswordSettings from "@app/components/tools/addPassword/AddPasswordSettings";
+import { defaultParameters } from "@app/hooks/tools/addPassword/useAddPasswordParameters";
 
 // Mock useTranslation with predictable return values
 const mockT = vi.fn((key: string) => `mock-${key}`);
-vi.mock('react-i18next', () => ({
-  useTranslation: () => ({ t: mockT })
+vi.mock("react-i18next", () => ({
+  useTranslation: () => ({ t: mockT }),
 }));
 
 // Wrapper component to provide Mantine context
@@ -15,92 +15,108 @@ const TestWrapper = ({ children }: { children: React.ReactNode }) => (
   <MantineProvider>{children}</MantineProvider>
 );
 
-describe('AddPasswordSettings', () => {
+describe("AddPasswordSettings", () => {
   const mockOnParameterChange = vi.fn();
 
   beforeEach(() => {
     vi.clearAllMocks();
   });
 
-  test('should render password input fields', () => {
+  test("should render password input fields", () => {
     render(
       <TestWrapper>
         <AddPasswordSettings
           parameters={defaultParameters}
           onParameterChange={mockOnParameterChange}
         />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
     // Should render user and owner password fields labels
-    expect(screen.getByText('mock-addPassword.passwords.user.label')).toBeInTheDocument();
-    expect(screen.getByText('mock-addPassword.passwords.owner.label')).toBeInTheDocument();
+    expect(
+      screen.getByText("mock-addPassword.passwords.user.label"),
+    ).toBeInTheDocument();
+    expect(
+      screen.getByText("mock-addPassword.passwords.owner.label"),
+    ).toBeInTheDocument();
   });
 
-  test('should render encryption key length select', () => {
+  test("should render encryption key length select", () => {
     render(
       <TestWrapper>
         <AddPasswordSettings
           parameters={defaultParameters}
           onParameterChange={mockOnParameterChange}
         />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
     // Should render key length select input
-    expect(screen.getByRole('textbox', { name: /keyLength/i })).toBeInTheDocument();
+    expect(
+      screen.getByRole("textbox", { name: /keyLength/i }),
+    ).toBeInTheDocument();
   });
 
-  test('should render main component sections', () => {
+  test("should render main component sections", () => {
     render(
       <TestWrapper>
         <AddPasswordSettings
           parameters={defaultParameters}
           onParameterChange={mockOnParameterChange}
         />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
     // Check that main section titles are rendered
-    expect(screen.getByText('mock-addPassword.passwords.user.label')).toBeInTheDocument();
-    expect(screen.getByText('mock-addPassword.encryption.keyLength.label')).toBeInTheDocument();
+    expect(
+      screen.getByText("mock-addPassword.passwords.user.label"),
+    ).toBeInTheDocument();
+    expect(
+      screen.getByText("mock-addPassword.encryption.keyLength.label"),
+    ).toBeInTheDocument();
   });
 
-  test('should call onParameterChange when password fields are modified', () => {
+  test("should call onParameterChange when password fields are modified", () => {
     render(
       <TestWrapper>
         <AddPasswordSettings
           parameters={defaultParameters}
           onParameterChange={mockOnParameterChange}
         />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
     // This test is complex with Mantine's PasswordInput, just verify the component renders
-    expect(screen.getByText('mock-addPassword.passwords.user.label')).toBeInTheDocument();
+    expect(
+      screen.getByText("mock-addPassword.passwords.user.label"),
+    ).toBeInTheDocument();
   });
 
-  test('should call onParameterChange when key length is changed', () => {
+  test("should call onParameterChange when key length is changed", () => {
     render(
       <TestWrapper>
         <AddPasswordSettings
           parameters={defaultParameters}
           onParameterChange={mockOnParameterChange}
         />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
     // Find key length select and change it
-    const keyLengthSelect = screen.getByText('mock-addPassword.encryption.keyLength.128bit');
+    const keyLengthSelect = screen.getByText(
+      "mock-addPassword.encryption.keyLength.128bit",
+    );
 
     fireEvent.mouseDown(keyLengthSelect);
-    const option256 = screen.getByText('mock-addPassword.encryption.keyLength.256bit');
+    const option256 = screen.getByText(
+      "mock-addPassword.encryption.keyLength.256bit",
+    );
     fireEvent.click(option256);
 
-    expect(mockOnParameterChange).toHaveBeenCalledWith('keyLength', 256);
+    expect(mockOnParameterChange).toHaveBeenCalledWith("keyLength", 256);
   });
 
-  test('should disable all form elements when disabled prop is true', () => {
+  test("should disable all form elements when disabled prop is true", () => {
     render(
       <TestWrapper>
         <AddPasswordSettings
@@ -108,20 +124,22 @@ describe('AddPasswordSettings', () => {
           onParameterChange={mockOnParameterChange}
           disabled={true}
         />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
     // Check password inputs are disabled
-    const passwordInputs = screen.getAllByRole('textbox');
-    passwordInputs.forEach(input => {
+    const passwordInputs = screen.getAllByRole("textbox");
+    passwordInputs.forEach((input) => {
       expect(input).toBeDisabled();
     });
 
     // Check key length select is disabled - simplified test due to Mantine complexity
-    expect(screen.getByText('mock-addPassword.encryption.keyLength.128bit')).toBeInTheDocument();
+    expect(
+      screen.getByText("mock-addPassword.encryption.keyLength.128bit"),
+    ).toBeInTheDocument();
   });
 
-  test('should enable all form elements when disabled prop is false', () => {
+  test("should enable all form elements when disabled prop is false", () => {
     render(
       <TestWrapper>
         <AddPasswordSettings
@@ -129,48 +147,68 @@ describe('AddPasswordSettings', () => {
           onParameterChange={mockOnParameterChange}
           disabled={false}
         />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
     // Check password inputs are enabled
-    const passwordInputs = screen.getAllByRole('textbox');
-    passwordInputs.forEach(input => {
+    const passwordInputs = screen.getAllByRole("textbox");
+    passwordInputs.forEach((input) => {
       expect(input).not.toBeDisabled();
     });
 
     // Check key length select is enabled - simplified test due to Mantine complexity
-    expect(screen.getByText('mock-addPassword.encryption.keyLength.128bit')).toBeInTheDocument();
+    expect(
+      screen.getByText("mock-addPassword.encryption.keyLength.128bit"),
+    ).toBeInTheDocument();
   });
 
-  test('should call translation function with correct keys', () => {
+  test("should call translation function with correct keys", () => {
     render(
       <TestWrapper>
         <AddPasswordSettings
           parameters={defaultParameters}
           onParameterChange={mockOnParameterChange}
         />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
     // Verify that translation keys are being called
-    expect(mockT).toHaveBeenCalledWith('addPassword.passwords.user.label', 'User Password');
-    expect(mockT).toHaveBeenCalledWith('addPassword.passwords.owner.label', 'Owner Password');
+    expect(mockT).toHaveBeenCalledWith(
+      "addPassword.passwords.user.label",
+      "User Password",
+    );
+    expect(mockT).toHaveBeenCalledWith(
+      "addPassword.passwords.owner.label",
+      "Owner Password",
+    );
   });
 
   test.each([
-    { keyLength: 40, expectedLabel: 'mock-addPassword.encryption.keyLength.40bit' },
-    { keyLength: 128, expectedLabel: 'mock-addPassword.encryption.keyLength.128bit' },
-    { keyLength: 256, expectedLabel: 'mock-addPassword.encryption.keyLength.256bit' }
-  ])('should handle key length $keyLength correctly', ({ keyLength, expectedLabel }) => {
-    render(
-      <TestWrapper>
-        <AddPasswordSettings
-          parameters={{ ...defaultParameters, keyLength }}
-          onParameterChange={mockOnParameterChange}
-        />
-      </TestWrapper>
-    );
+    {
+      keyLength: 40,
+      expectedLabel: "mock-addPassword.encryption.keyLength.40bit",
+    },
+    {
+      keyLength: 128,
+      expectedLabel: "mock-addPassword.encryption.keyLength.128bit",
+    },
+    {
+      keyLength: 256,
+      expectedLabel: "mock-addPassword.encryption.keyLength.256bit",
+    },
+  ])(
+    "should handle key length $keyLength correctly",
+    ({ keyLength, expectedLabel }) => {
+      render(
+        <TestWrapper>
+          <AddPasswordSettings
+            parameters={{ ...defaultParameters, keyLength }}
+            onParameterChange={mockOnParameterChange}
+          />
+        </TestWrapper>,
+      );
 
-    expect(screen.getByText(expectedLabel)).toBeInTheDocument();
-  });
+      expect(screen.getByText(expectedLabel)).toBeInTheDocument();
+    },
+  );
 });
diff --git a/frontend/src/core/components/tools/addPassword/AddPasswordSettings.tsx b/frontend/src/core/components/tools/addPassword/AddPasswordSettings.tsx
index bc046372c2..9c8010d419 100644
--- a/frontend/src/core/components/tools/addPassword/AddPasswordSettings.tsx
+++ b/frontend/src/core/components/tools/addPassword/AddPasswordSettings.tsx
@@ -5,11 +5,18 @@ import { Z_INDEX_AUTOMATE_DROPDOWN } from "@app/styles/zIndex";
 
 interface AddPasswordSettingsProps {
   parameters: AddPasswordParameters;
-  onParameterChange: <K extends keyof AddPasswordParameters>(key: K, value: AddPasswordParameters[K]) => void;
+  onParameterChange: <K extends keyof AddPasswordParameters>(
+    key: K,
+    value: AddPasswordParameters[K],
+  ) => void;
   disabled?: boolean;
 }
 
-const AddPasswordSettings = ({ parameters, onParameterChange, disabled = false }: AddPasswordSettingsProps) => {
+const AddPasswordSettings = ({
+  parameters,
+  onParameterChange,
+  disabled = false,
+}: AddPasswordSettingsProps) => {
   const { t } = useTranslation();
 
   return (
@@ -17,17 +24,23 @@ const AddPasswordSettings = ({ parameters, onParameterChange, disabled = false }
       {/* Password Settings */}
       <Stack gap="sm">
         <PasswordInput
-          label={t('addPassword.passwords.user.label', 'User Password')}
-          placeholder={t('addPassword.passwords.user.placeholder', 'Enter user password')}
+          label={t("addPassword.passwords.user.label", "User Password")}
+          placeholder={t(
+            "addPassword.passwords.user.placeholder",
+            "Enter user password",
+          )}
           value={parameters.password}
-          onChange={(e) => onParameterChange('password', e.target.value)}
+          onChange={(e) => onParameterChange("password", e.target.value)}
           disabled={disabled}
         />
         <PasswordInput
-          label={t('addPassword.passwords.owner.label', 'Owner Password')}
-          placeholder={t('addPassword.passwords.owner.placeholder', 'Enter owner password')}
+          label={t("addPassword.passwords.owner.label", "Owner Password")}
+          placeholder={t(
+            "addPassword.passwords.owner.placeholder",
+            "Enter owner password",
+          )}
           value={parameters.ownerPassword}
-          onChange={(e) => onParameterChange('ownerPassword', e.target.value)}
+          onChange={(e) => onParameterChange("ownerPassword", e.target.value)}
           disabled={disabled}
         />
       </Stack>
@@ -35,23 +48,46 @@ const AddPasswordSettings = ({ parameters, onParameterChange, disabled = false }
       {/* Encryption Settings */}
       <Stack gap="sm">
         <Select
-          label={t('addPassword.encryption.keyLength.label', 'Encryption Key Length')}
+          label={t(
+            "addPassword.encryption.keyLength.label",
+            "Encryption Key Length",
+          )}
           value={parameters.keyLength.toString()}
           onChange={(value) => {
             if (value) {
-              onParameterChange('keyLength', parseInt(value));
+              onParameterChange("keyLength", parseInt(value));
             }
           }}
           disabled={disabled}
           data={[
-            { value: '40', label: t('addPassword.encryption.keyLength.40bit', '40-bit (Low)') },
-            { value: '128', label: t('addPassword.encryption.keyLength.128bit', '128-bit (Standard)') },
-            { value: '256', label: t('addPassword.encryption.keyLength.256bit', '256-bit (High)') }
+            {
+              value: "40",
+              label: t(
+                "addPassword.encryption.keyLength.40bit",
+                "40-bit (Low)",
+              ),
+            },
+            {
+              value: "128",
+              label: t(
+                "addPassword.encryption.keyLength.128bit",
+                "128-bit (Standard)",
+              ),
+            },
+            {
+              value: "256",
+              label: t(
+                "addPassword.encryption.keyLength.256bit",
+                "256-bit (High)",
+              ),
+            },
           ]}
-          comboboxProps={{ withinPortal: true, zIndex: Z_INDEX_AUTOMATE_DROPDOWN }}
+          comboboxProps={{
+            withinPortal: true,
+            zIndex: Z_INDEX_AUTOMATE_DROPDOWN,
+          }}
         />
       </Stack>
-
     </Stack>
   );
 };
diff --git a/frontend/src/core/components/tools/addStamp/AddStampAutomationSettings.tsx b/frontend/src/core/components/tools/addStamp/AddStampAutomationSettings.tsx
index c9a9dbd968..56507123bb 100644
--- a/frontend/src/core/components/tools/addStamp/AddStampAutomationSettings.tsx
+++ b/frontend/src/core/components/tools/addStamp/AddStampAutomationSettings.tsx
@@ -13,11 +13,18 @@ import StampPositionFormattingSettings from "@app/components/tools/addStamp/Stam
 
 interface AddStampAutomationSettingsProps {
   parameters: AddStampParameters;
-  onParameterChange: <K extends keyof AddStampParameters>(key: K, value: AddStampParameters[K]) => void;
+  onParameterChange: <K extends keyof AddStampParameters>(
+    key: K,
+    value: AddStampParameters[K],
+  ) => void;
   disabled?: boolean;
 }
 
-const AddStampAutomationSettings = ({ parameters, onParameterChange, disabled = false }: AddStampAutomationSettingsProps) => {
+const AddStampAutomationSettings = ({
+  parameters,
+  onParameterChange,
+  disabled = false,
+}: AddStampAutomationSettingsProps) => {
   return (
     <Stack gap="lg">
       {/* Stamp Setup (Type, Text/Image, Page Selection) */}
diff --git a/frontend/src/core/components/tools/addStamp/StampPositionFormattingSettings.tsx b/frontend/src/core/components/tools/addStamp/StampPositionFormattingSettings.tsx
index 9381954f28..7912cd0bcd 100644
--- a/frontend/src/core/components/tools/addStamp/StampPositionFormattingSettings.tsx
+++ b/frontend/src/core/components/tools/addStamp/StampPositionFormattingSettings.tsx
@@ -1,5 +1,14 @@
 import { useTranslation } from "react-i18next";
-import { Group, Select, Stack, ColorInput, Button, Slider, Text, NumberInput } from "@mantine/core";
+import {
+  Group,
+  Select,
+  Stack,
+  ColorInput,
+  Button,
+  Slider,
+  Text,
+  NumberInput,
+} from "@mantine/core";
 import { AddStampParameters } from "@app/components/tools/addStamp/useAddStampParameters";
 import LocalIcon from "@app/components/shared/LocalIcon";
 import styles from "@app/components/tools/addStamp/StampPreview.module.css";
@@ -8,12 +17,20 @@ import { Z_INDEX_AUTOMATE_DROPDOWN } from "@app/styles/zIndex";
 
 interface StampPositionFormattingSettingsProps {
   parameters: AddStampParameters;
-  onParameterChange: <K extends keyof AddStampParameters>(key: K, value: AddStampParameters[K]) => void;
+  onParameterChange: <K extends keyof AddStampParameters>(
+    key: K,
+    value: AddStampParameters[K],
+  ) => void;
   disabled?: boolean;
   showPositionGrid?: boolean; // When true, show the 9-position grid for automation
 }
 
-const StampPositionFormattingSettings = ({ parameters, onParameterChange, disabled = false, showPositionGrid = false }: StampPositionFormattingSettingsProps) => {
+const StampPositionFormattingSettings = ({
+  parameters,
+  onParameterChange,
+  disabled = false,
+  showPositionGrid = false,
+}: StampPositionFormattingSettingsProps) => {
   const { t } = useTranslation();
 
   return (
@@ -21,32 +38,36 @@ const StampPositionFormattingSettings = ({ parameters, onParameterChange, disabl
       {/* Position Grid - shown in automation settings */}
       {showPositionGrid && (
         <Stack gap="xs">
-          <Text size="sm" fw={500}>{t('AddStampRequest.position', 'Stamp Position')}</Text>
-          <div style={{
-            display: 'grid',
-            gridTemplateColumns: 'repeat(3, 1fr)',
-            gap: '0.5rem',
-            maxWidth: '200px'
-          }}>
+          <Text size="sm" fw={500}>
+            {t("AddStampRequest.position", "Stamp Position")}
+          </Text>
+          <div
+            style={{
+              display: "grid",
+              gridTemplateColumns: "repeat(3, 1fr)",
+              gap: "0.5rem",
+              maxWidth: "200px",
+            }}
+          >
             {Array.from({ length: 9 }).map((_, i) => {
-              const idx = (i + 1) as 1|2|3|4|5|6|7|8|9;
+              const idx = (i + 1) as 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9;
               const selected = parameters.position === idx;
               return (
                 <Button
                   key={idx}
-                  variant={selected ? 'filled' : 'outline'}
+                  variant={selected ? "filled" : "outline"}
                   onClick={() => {
-                    onParameterChange('position', idx);
+                    onParameterChange("position", idx);
                     // Ensure we're using grid positioning, not custom overrides
-                    onParameterChange('overrideX', -1 as any);
-                    onParameterChange('overrideY', -1 as any);
+                    onParameterChange("overrideX", -1 as any);
+                    onParameterChange("overrideY", -1 as any);
                   }}
                   disabled={disabled}
                   styles={{
                     root: {
-                      height: '50px',
-                      padding: '0',
-                    }
+                      height: "50px",
+                      padding: "0",
+                    },
                   }}
                 >
                   {idx}
@@ -58,48 +79,79 @@ const StampPositionFormattingSettings = ({ parameters, onParameterChange, disabl
       )}
       {/* Icon pill buttons row */}
       <div className="flex justify-between gap-[0.5rem]">
-        <Tooltip content={t('AddStampRequest.rotation', 'Rotation')} position="top">
+        <Tooltip
+          content={t("AddStampRequest.rotation", "Rotation")}
+          position="top"
+        >
           <Button
-            variant={parameters._activePill === 'rotation' ? 'filled' : 'outline'}
+            variant={
+              parameters._activePill === "rotation" ? "filled" : "outline"
+            }
             className="flex-1"
-            onClick={() => onParameterChange('_activePill', 'rotation')}
+            onClick={() => onParameterChange("_activePill", "rotation")}
           >
-            <LocalIcon icon="rotate-right-rounded" width="1.1rem" height="1.1rem" />
+            <LocalIcon
+              icon="rotate-right-rounded"
+              width="1.1rem"
+              height="1.1rem"
+            />
           </Button>
         </Tooltip>
-        <Tooltip content={t('AddStampRequest.opacity', 'Opacity')} position="top">
+        <Tooltip
+          content={t("AddStampRequest.opacity", "Opacity")}
+          position="top"
+        >
           <Button
-            variant={parameters._activePill === 'opacity' ? 'filled' : 'outline'}
+            variant={
+              parameters._activePill === "opacity" ? "filled" : "outline"
+            }
             className="flex-1"
-            onClick={() => onParameterChange('_activePill', 'opacity')}
+            onClick={() => onParameterChange("_activePill", "opacity")}
           >
             <LocalIcon icon="opacity" width="1.1rem" height="1.1rem" />
           </Button>
         </Tooltip>
-        <Tooltip content={parameters.stampType === 'image' ? t('AddStampRequest.imageSize', 'Image Size') : t('AddStampRequest.fontSize', 'Font Size')} position="top">
+        <Tooltip
+          content={
+            parameters.stampType === "image"
+              ? t("AddStampRequest.imageSize", "Image Size")
+              : t("AddStampRequest.fontSize", "Font Size")
+          }
+          position="top"
+        >
           <Button
-            variant={parameters._activePill === 'fontSize' ? 'filled' : 'outline'}
+            variant={
+              parameters._activePill === "fontSize" ? "filled" : "outline"
+            }
             className="flex-1"
-            onClick={() => onParameterChange('_activePill', 'fontSize')}
+            onClick={() => onParameterChange("_activePill", "fontSize")}
           >
-            <LocalIcon icon="zoom-in-map-rounded" width="1.1rem" height="1.1rem" />
+            <LocalIcon
+              icon="zoom-in-map-rounded"
+              width="1.1rem"
+              height="1.1rem"
+            />
           </Button>
         </Tooltip>
       </div>
 
       {/* Single slider bound to selected pill */}
-      {parameters._activePill === 'fontSize' && (
+      {parameters._activePill === "fontSize" && (
         <Stack gap="xs">
           <Text className={styles.labelText}>
-            {parameters.stampType === 'image'
-              ? t('AddStampRequest.imageSize', 'Image Size')
-              : t('AddStampRequest.fontSize', 'Font Size')
-            }
+            {parameters.stampType === "image"
+              ? t("AddStampRequest.imageSize", "Image Size")
+              : t("AddStampRequest.fontSize", "Font Size")}
           </Text>
           <Group className={styles.sliderGroup} align="center">
             <NumberInput
               value={parameters.fontSize}
-              onChange={(v) => onParameterChange('fontSize', typeof v === 'number' && v > 0 ? v : 1)}
+              onChange={(v) =>
+                onParameterChange(
+                  "fontSize",
+                  typeof v === "number" && v > 0 ? v : 1,
+                )
+              }
               min={1}
               max={400}
               step={1}
@@ -109,7 +161,7 @@ const StampPositionFormattingSettings = ({ parameters, onParameterChange, disabl
             />
             <Slider
               value={parameters.fontSize}
-              onChange={(v) => onParameterChange('fontSize', v as number)}
+              onChange={(v) => onParameterChange("fontSize", v as number)}
               min={1}
               max={400}
               step={1}
@@ -119,13 +171,17 @@ const StampPositionFormattingSettings = ({ parameters, onParameterChange, disabl
           </Group>
         </Stack>
       )}
-      {parameters._activePill === 'rotation' && (
+      {parameters._activePill === "rotation" && (
         <Stack gap="xs">
-          <Text className={styles.labelText}>{t('AddStampRequest.rotation', 'Rotation')}</Text>
+          <Text className={styles.labelText}>
+            {t("AddStampRequest.rotation", "Rotation")}
+          </Text>
           <Group className={styles.sliderGroup} align="center">
             <NumberInput
               value={parameters.rotation}
-              onChange={(v) => onParameterChange('rotation', typeof v === 'number' ? v : 0)}
+              onChange={(v) =>
+                onParameterChange("rotation", typeof v === "number" ? v : 0)
+              }
               min={-180}
               max={180}
               step={1}
@@ -136,7 +192,7 @@ const StampPositionFormattingSettings = ({ parameters, onParameterChange, disabl
             />
             <Slider
               value={parameters.rotation}
-              onChange={(v) => onParameterChange('rotation', v as number)}
+              onChange={(v) => onParameterChange("rotation", v as number)}
               min={-180}
               max={180}
               step={1}
@@ -145,13 +201,17 @@ const StampPositionFormattingSettings = ({ parameters, onParameterChange, disabl
           </Group>
         </Stack>
       )}
-      {parameters._activePill === 'opacity' && (
+      {parameters._activePill === "opacity" && (
         <Stack gap="xs">
-          <Text className={styles.labelText}>{t('AddStampRequest.opacity', 'Opacity')}</Text>
+          <Text className={styles.labelText}>
+            {t("AddStampRequest.opacity", "Opacity")}
+          </Text>
           <Group className={styles.sliderGroup} align="center">
             <NumberInput
               value={parameters.opacity}
-              onChange={(v) => onParameterChange('opacity', typeof v === 'number' ? v : 0)}
+              onChange={(v) =>
+                onParameterChange("opacity", typeof v === "number" ? v : 0)
+              }
               min={0}
               max={100}
               step={1}
@@ -161,7 +221,7 @@ const StampPositionFormattingSettings = ({ parameters, onParameterChange, disabl
             />
             <Slider
               value={parameters.opacity}
-              onChange={(v) => onParameterChange('opacity', v as number)}
+              onChange={(v) => onParameterChange("opacity", v as number)}
               min={0}
               max={100}
               step={1}
@@ -171,31 +231,39 @@ const StampPositionFormattingSettings = ({ parameters, onParameterChange, disabl
         </Stack>
       )}
 
-      {parameters.stampType !== 'image' && (
+      {parameters.stampType !== "image" && (
         <ColorInput
-          label={t('AddStampRequest.customColor', 'Custom Text Color')}
+          label={t("AddStampRequest.customColor", "Custom Text Color")}
           value={parameters.customColor}
-          onChange={(value) => onParameterChange('customColor', value)}
+          onChange={(value) => onParameterChange("customColor", value)}
           format="hex"
           disabled={disabled}
-          popoverProps={{ withinPortal: true, zIndex: Z_INDEX_AUTOMATE_DROPDOWN }}
+          popoverProps={{
+            withinPortal: true,
+            zIndex: Z_INDEX_AUTOMATE_DROPDOWN,
+          }}
         />
       )}
 
       {/* Margin selection for text stamps */}
-      {parameters.stampType === 'text' && (
+      {parameters.stampType === "text" && (
         <Select
-          label={t('AddStampRequest.margin', 'Margin')}
+          label={t("AddStampRequest.margin", "Margin")}
           value={parameters.customMargin}
-          onChange={(v) => onParameterChange('customMargin', (v as any) || 'medium')}
+          onChange={(v) =>
+            onParameterChange("customMargin", (v as any) || "medium")
+          }
           data={[
-            { value: 'small', label: t('margin.small', 'Small') },
-            { value: 'medium', label: t('margin.medium', 'Medium') },
-            { value: 'large', label: t('margin.large', 'Large') },
-            { value: 'x-large', label: t('margin.xLarge', 'Extra Large') },
+            { value: "small", label: t("margin.small", "Small") },
+            { value: "medium", label: t("margin.medium", "Medium") },
+            { value: "large", label: t("margin.large", "Large") },
+            { value: "x-large", label: t("margin.xLarge", "Extra Large") },
           ]}
           disabled={disabled}
-          comboboxProps={{ withinPortal: true, zIndex: Z_INDEX_AUTOMATE_DROPDOWN }}
+          comboboxProps={{
+            withinPortal: true,
+            zIndex: Z_INDEX_AUTOMATE_DROPDOWN,
+          }}
         />
       )}
     </Stack>
diff --git a/frontend/src/core/components/tools/addStamp/StampPreview.tsx b/frontend/src/core/components/tools/addStamp/StampPreview.tsx
index ebc6905502..9659c4317a 100644
--- a/frontend/src/core/components/tools/addStamp/StampPreview.tsx
+++ b/frontend/src/core/components/tools/addStamp/StampPreview.tsx
@@ -1,30 +1,54 @@
-import React, { useEffect, useMemo, useRef, useState } from 'react';
-import { AddStampParameters } from '@app/components/tools/addStamp/useAddStampParameters';
-import { pdfWorkerManager } from '@app/services/pdfWorkerManager';
-import { useThumbnailGeneration } from '@app/hooks/useThumbnailGeneration';
-import { A4_ASPECT_RATIO, getFirstSelectedPage, getFontFamily, computeStampPreviewStyle, getAlphabetPreviewScale } from '@app/components/tools/addStamp/StampPreviewUtils';
-import styles from '@app/components/tools/addStamp/StampPreview.module.css';
-import {PrivateContent} from "@app/components/shared/PrivateContent";
+import React, { useEffect, useMemo, useRef, useState } from "react";
+import { AddStampParameters } from "@app/components/tools/addStamp/useAddStampParameters";
+import { pdfWorkerManager } from "@app/services/pdfWorkerManager";
+import { useThumbnailGeneration } from "@app/hooks/useThumbnailGeneration";
+import {
+  A4_ASPECT_RATIO,
+  getFirstSelectedPage,
+  getFontFamily,
+  computeStampPreviewStyle,
+  getAlphabetPreviewScale,
+} from "@app/components/tools/addStamp/StampPreviewUtils";
+import styles from "@app/components/tools/addStamp/StampPreview.module.css";
+import { PrivateContent } from "@app/components/shared/PrivateContent";
 
 type Props = {
   parameters: AddStampParameters;
-  onParameterChange: <K extends keyof AddStampParameters>(key: K, value: AddStampParameters[K]) => void;
+  onParameterChange: <K extends keyof AddStampParameters>(
+    key: K,
+    value: AddStampParameters[K],
+  ) => void;
   file?: File | null;
   showQuickGrid?: boolean;
 };
 
-export default function StampPreview({ parameters, onParameterChange, file, showQuickGrid }: Props) {
+export default function StampPreview({
+  parameters,
+  onParameterChange,
+  file,
+  showQuickGrid,
+}: Props) {
   const containerRef = useRef<HTMLDivElement>(null);
-  const [containerSize, setContainerSize] = useState<{ width: number; height: number }>({ width: 0, height: 0 });
-  const [imageMeta, setImageMeta] = useState<{ url: string; width: number; height: number } | null>(null);
-  const [pageSize, setPageSize] = useState<{ widthPts: number; heightPts: number } | null>(null);
+  const [containerSize, setContainerSize] = useState<{
+    width: number;
+    height: number;
+  }>({ width: 0, height: 0 });
+  const [imageMeta, setImageMeta] = useState<{
+    url: string;
+    width: number;
+    height: number;
+  } | null>(null);
+  const [pageSize, setPageSize] = useState<{
+    widthPts: number;
+    heightPts: number;
+  } | null>(null);
   const [pageThumbnail, setPageThumbnail] = useState<string | null>(null);
   const { requestThumbnail } = useThumbnailGeneration();
   const [hoverTile, setHoverTile] = useState<number | null>(null);
 
   // Load image URL and meta for aspect ratio if an image is selected
   useEffect(() => {
-    if (parameters.stampType === 'image' && parameters.stampImage) {
+    if (parameters.stampType === "image" && parameters.stampImage) {
       const url = URL.createObjectURL(parameters.stampImage);
       const img = new Image();
       img.onload = () => {
@@ -42,8 +66,13 @@ export default function StampPreview({ parameters, onParameterChange, file, show
     const node = containerRef.current;
     if (!node) return;
     const resize = () => {
-      const aspect = pageSize ? (pageSize.widthPts / pageSize.heightPts) : A4_ASPECT_RATIO;
-      setContainerSize({ width: node.clientWidth, height: node.clientWidth / aspect });
+      const aspect = pageSize
+        ? pageSize.widthPts / pageSize.heightPts
+        : A4_ASPECT_RATIO;
+      setContainerSize({
+        width: node.clientWidth,
+        height: node.clientWidth / aspect,
+      });
     };
     resize();
     const ro = new ResizeObserver(resize);
@@ -55,15 +84,19 @@ export default function StampPreview({ parameters, onParameterChange, file, show
   useEffect(() => {
     let cancelled = false;
     const load = async () => {
-      if (!file || file.type !== 'application/pdf') {
+      if (!file || file.type !== "application/pdf") {
         setPageSize(null);
         return;
       }
       try {
         const buffer = await file.arrayBuffer();
-        const pdf = await pdfWorkerManager.createDocument(buffer, { disableAutoFetch: true, disableStream: true });
+        const pdf = await pdfWorkerManager.createDocument(buffer, {
+          disableAutoFetch: true,
+          disableStream: true,
+        });
         const page = await pdf.getPage(1);
-        const viewport = page.getViewport({ scale: 1 });
+        // Unrotated viewport keeps points to pixels aligned and avoids width and height swaps
+        const viewport = page.getViewport({ scale: 1, rotation: 0 });
         if (!cancelled) {
           setPageSize({ widthPts: viewport.width, heightPts: viewport.height });
         }
@@ -74,19 +107,24 @@ export default function StampPreview({ parameters, onParameterChange, file, show
       }
     };
     load();
-    return () => { cancelled = true; };
+    return () => {
+      cancelled = true;
+    };
   }, [file]);
 
   // Load first-page thumbnail for background preview so users see the content
   useEffect(() => {
     let isActive = true;
     const loadThumb = async () => {
-      if (!file || file.type !== 'application/pdf') {
+      if (!file || file.type !== "application/pdf") {
         setPageThumbnail(null);
         return;
       }
       try {
-        const pageNumber = Math.max(1, getFirstSelectedPage(parameters.pageNumbers));
+        const pageNumber = Math.max(
+          1,
+          getFirstSelectedPage(parameters.pageNumbers),
+        );
         const pageId = `${file.name}:${file.size}:${file.lastModified}:page:${pageNumber}`;
         const thumb = await requestThumbnail(pageId, file, pageNumber);
         if (isActive) setPageThumbnail(thumb || null);
@@ -95,28 +133,47 @@ export default function StampPreview({ parameters, onParameterChange, file, show
       }
     };
     loadThumb();
-    return () => { isActive = false; };
+    return () => {
+      isActive = false;
+    };
   }, [file, parameters.pageNumbers, requestThumbnail]);
 
-  const style = useMemo(() => (
-    computeStampPreviewStyle(
+  const style = useMemo(
+    () =>
+      computeStampPreviewStyle(
+        parameters,
+        imageMeta,
+        pageSize,
+        containerSize,
+        showQuickGrid,
+        hoverTile,
+        !!pageThumbnail,
+      ),
+    [
+      containerSize,
       parameters,
       imageMeta,
       pageSize,
-      containerSize,
       showQuickGrid,
       hoverTile,
-      !!pageThumbnail
-    )
-  ), [containerSize, parameters, imageMeta, pageSize, showQuickGrid, hoverTile, pageThumbnail]);
+      pageThumbnail,
+    ],
+  );
 
   // Keep center fixed when scaling via slider (or any fontSize changes)
-  const prevDimsRef = useRef<{ fontSize: number; widthPx: number; heightPx: number; leftPx: number; bottomPx: number } | null>(null);
+  const prevDimsRef = useRef<{
+    fontSize: number;
+    widthPx: number;
+    heightPx: number;
+    leftPx: number;
+    bottomPx: number;
+  } | null>(null);
   useEffect(() => {
     const itemStyle = style.item as any;
-    if (!itemStyle || containerSize.width <= 0 || containerSize.height <= 0) return;
+    if (!itemStyle || containerSize.width <= 0 || containerSize.height <= 0)
+      return;
 
-    const parse = (v: any) => parseFloat(String(v).replace('px', '')) || 0;
+    const parse = (v: any) => parseFloat(String(v).replace("px", "")) || 0;
     const leftPx = parse(itemStyle.left);
     const bottomPx = parse(itemStyle.bottom);
     const widthPx = parse(itemStyle.width);
@@ -143,17 +200,45 @@ export default function StampPreview({ parameters, onParameterChange, file, show
       const heightPts = pageSize?.heightPts ?? 841.89;
       const scaleX = containerSize.width / widthPts;
       const scaleY = containerSize.height / heightPts;
-      const newLeftPts = Math.max(0, Math.min(containerSize.width, newLeftPx)) / scaleX;
-      const newBottomPts = Math.max(0, Math.min(containerSize.height, newBottomPx)) / scaleY;
-      onParameterChange('overrideX', newLeftPts as any);
-      onParameterChange('overrideY', newBottomPts as any);
+      const maxLeftPx = Math.max(0, containerSize.width - widthPx);
+      const maxBottomPx = Math.max(0, containerSize.height - heightPx);
+      const newLeftPts = Math.max(0, Math.min(maxLeftPx, newLeftPx)) / scaleX;
+      const newBottomPts =
+        Math.max(0, Math.min(maxBottomPx, newBottomPx)) / scaleY;
+      onParameterChange("overrideX", newLeftPts as any);
+      onParameterChange("overrideY", newBottomPts as any);
     }
 
-    prevDimsRef.current = { fontSize: parameters.fontSize, widthPx, heightPx, leftPx, bottomPx };
-  }, [parameters.fontSize, style.item, containerSize, pageSize, showQuickGrid, parameters.overrideX, parameters.overrideY, onParameterChange]);
+    prevDimsRef.current = {
+      fontSize: parameters.fontSize,
+      widthPx,
+      heightPx,
+      leftPx,
+      bottomPx,
+    };
+  }, [
+    parameters.fontSize,
+    style.item,
+    containerSize,
+    pageSize,
+    showQuickGrid,
+    parameters.overrideX,
+    parameters.overrideY,
+    onParameterChange,
+  ]);
 
   // Drag/resize/rotate interactions
-  const draggingRef = useRef<{ type: 'move' | 'resize' | 'rotate'; startX: number; startY: number; initLeft: number; initBottom: number; initHeight: number; centerX: number; centerY: number } | null>(null);
+  const draggingRef = useRef<{
+    type: "move" | "resize" | "rotate";
+    startX: number;
+    startY: number;
+    initLeft: number;
+    initBottom: number;
+    initWidth: number;
+    initHeight: number;
+    centerX: number;
+    centerY: number;
+  } | null>(null);
 
   const ensureOverrides = () => {
     const pageWidth = containerSize.width;
@@ -162,38 +247,58 @@ export default function StampPreview({ parameters, onParameterChange, file, show
 
     // Recompute current x,y from style (so that we start from visual position)
     const itemStyle = style.item as any;
-    const leftPx = parseFloat(String(itemStyle.left).replace('px', '')) || 0;
-    const bottomPx = parseFloat(String(itemStyle.bottom).replace('px', '')) || 0;
+    const leftPx = parseFloat(String(itemStyle.left).replace("px", "")) || 0;
+    const bottomPx =
+      parseFloat(String(itemStyle.bottom).replace("px", "")) || 0;
+    const widthPx = parseFloat(String(itemStyle.width).replace("px", "")) || 0;
+    const heightPx =
+      parseFloat(String(itemStyle.height).replace("px", "")) || 0;
     const widthPts = pageSize?.widthPts ?? 595.28;
     const heightPts = pageSize?.heightPts ?? 841.89;
     const scaleX = containerSize.width / widthPts;
     const scaleY = containerSize.height / heightPts;
     if (parameters.overrideX < 0 || parameters.overrideY < 0) {
-      onParameterChange('overrideX', Math.max(0, Math.min(pageWidth, leftPx)) / scaleX as any);
-      onParameterChange('overrideY', Math.max(0, Math.min(pageHeight, bottomPx)) / scaleY as any);
+      const maxLeftPx = Math.max(0, pageWidth - widthPx);
+      const maxBottomPx = Math.max(0, pageHeight - heightPx);
+      onParameterChange(
+        "overrideX",
+        (Math.max(0, Math.min(maxLeftPx, leftPx)) / scaleX) as any,
+      );
+      onParameterChange(
+        "overrideY",
+        (Math.max(0, Math.min(maxBottomPx, bottomPx)) / scaleY) as any,
+      );
     }
   };
 
-  const handlePointerDown = (e: React.PointerEvent, type: 'move' | 'resize' | 'rotate') => {
+  const handlePointerDown = (
+    e: React.PointerEvent,
+    type: "move" | "resize" | "rotate",
+  ) => {
     e.preventDefault();
     ensureOverrides();
 
     const item = style.item as any;
-    const left = parseFloat(String(item.left).replace('px', '')) || 0;
-    const bottom = parseFloat(String(item.bottom).replace('px', '')) || 0;
-    const width = parseFloat(String(item.width).replace('px', '')) || parameters.fontSize;
-    const height = parseFloat(String(item.height).replace('px', '')) || parameters.fontSize;
+    const left = parseFloat(String(item.left).replace("px", "")) || 0;
+    const bottom = parseFloat(String(item.bottom).replace("px", "")) || 0;
+    const width =
+      parseFloat(String(item.width).replace("px", "")) || parameters.fontSize;
+    const height =
+      parseFloat(String(item.height).replace("px", "")) || parameters.fontSize;
 
-    const rect = (e.currentTarget.parentElement as HTMLElement)?.getBoundingClientRect();
+    const rect = (
+      e.currentTarget.parentElement as HTMLElement
+    )?.getBoundingClientRect();
     const centerX = left + width / 2;
     const centerY = bottom + height / 2;
 
     draggingRef.current = {
       type,
       startX: e.clientX - (rect?.left || 0),
-      startY: (rect ? rect.bottom - e.clientY : 0), // convert to bottom-based coords
+      startY: rect ? rect.bottom - e.clientY : 0, // convert to bottom-based coords
       initLeft: left,
       initBottom: bottom,
+      initWidth: width,
       initHeight: height,
       centerX,
       centerY,
@@ -212,33 +317,39 @@ export default function StampPreview({ parameters, onParameterChange, file, show
 
     const drag = draggingRef.current;
 
-    if (drag.type === 'move') {
+    if (drag.type === "move") {
       const dx = x - drag.startX;
       const dy = y - drag.startY;
-      const newLeftPx = Math.max(0, Math.min(containerSize.width, drag.initLeft + dx));
-      const newBottomPx = Math.max(0, Math.min(containerSize.height, drag.initBottom + dy));
+      const maxLeftPx = Math.max(0, containerSize.width - drag.initWidth);
+      const maxBottomPx = Math.max(0, containerSize.height - drag.initHeight);
+      const newLeftPx = Math.max(0, Math.min(maxLeftPx, drag.initLeft + dx));
+      const newBottomPx = Math.max(
+        0,
+        Math.min(maxBottomPx, drag.initBottom + dy),
+      );
       const widthPts = pageSize?.widthPts ?? 595.28;
       const heightPts = pageSize?.heightPts ?? 841.89;
       const scaleX = containerSize.width / widthPts;
       const scaleY = containerSize.height / heightPts;
       const newLeftPts = newLeftPx / scaleX;
       const newBottomPts = newBottomPx / scaleY;
-      onParameterChange('overrideX', newLeftPts as any);
-      onParameterChange('overrideY', newBottomPts as any);
+      onParameterChange("overrideX", newLeftPts as any);
+      onParameterChange("overrideY", newBottomPts as any);
     }
 
-    if (drag.type === 'resize') {
+    if (drag.type === "resize") {
       // Height is our canonical size (fontSize)
       const heightPts = pageSize?.heightPts ?? 841.89;
       const scaleY = containerSize.height / heightPts;
       const newHeightPx = Math.max(1, drag.initHeight + (y - drag.startY));
       const newHeightPts = newHeightPx / scaleY;
-      onParameterChange('fontSize', newHeightPts as any);
+      onParameterChange("fontSize", newHeightPts as any);
     }
 
-    if (drag.type === 'rotate') {
-      const angle = Math.atan2(y - drag.centerY, x - drag.centerX) * (180 / Math.PI);
-      onParameterChange('rotation', angle as any);
+    if (drag.type === "rotate") {
+      const angle =
+        Math.atan2(y - drag.centerY, x - drag.centerX) * (180 / Math.PI);
+      onParameterChange("rotation", angle as any);
     }
   };
 
@@ -273,32 +384,32 @@ export default function StampPreview({ parameters, onParameterChange, file, show
             />
           </PrivateContent>
         )}
-        {parameters.stampType === 'text' && (
+        {parameters.stampType === "text" && (
           <div
             className={`${styles.stampItem} ${styles.stampItemGridMode}`}
             style={style.item as React.CSSProperties}
           >
-            {(parameters.stampText || '').split('\n').map((line, idx) => (
+            {(parameters.stampText || "").split("\n").map((line, idx) => (
               <span
                 key={idx}
                 className={styles.textLine}
                 style={{
                   fontFamily: getFontFamily(parameters.alphabet),
                   fontSize: `${Math.max(1, (parameters.fontSize * getAlphabetPreviewScale(parameters.alphabet)) / 2)}px`,
-                  whiteSpace: 'nowrap',
+                  whiteSpace: "nowrap",
                 }}
               >
-                {line || '\u00A0'}
+                {line || "\u00A0"}
               </span>
             ))}
             {itemHandles}
           </div>
         )}
-        {parameters.stampType === 'image' && imageMeta && (
+        {parameters.stampType === "image" && imageMeta && (
           <div
             className={`${styles.stampItem} ${showQuickGrid ? styles.stampItemGridMode : styles.stampItemDraggable}`}
             style={style.item as React.CSSProperties}
-            onPointerDown={(e) => handlePointerDown(e, 'move')}
+            onPointerDown={(e) => handlePointerDown(e, "move")}
           >
             <img
               src={imageMeta.url}
@@ -313,18 +424,20 @@ export default function StampPreview({ parameters, onParameterChange, file, show
         {showQuickGrid && (
           <div className={styles.quickGrid}>
             {Array.from({ length: 9 }).map((_, i) => {
-              const idx = (i + 1) as 1|2|3|4|5|6|7|8|9;
-              const selected = parameters.position === idx && (parameters.overrideX < 0 || parameters.overrideY < 0);
+              const idx = (i + 1) as 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9;
+              const selected =
+                parameters.position === idx &&
+                (parameters.overrideX < 0 || parameters.overrideY < 0);
               return (
                 <button
                   key={idx}
                   type="button"
-                  className={`${styles.gridTile} ${selected || hoverTile === idx ? styles.gridTileSelected : ''} ${hoverTile === idx ? styles.gridTileHovered : ''}`}
+                  className={`${styles.gridTile} ${selected || hoverTile === idx ? styles.gridTileSelected : ""} ${hoverTile === idx ? styles.gridTileHovered : ""}`}
                   onClick={() => {
                     // Clear overrides to use grid positioning and set position
-                    onParameterChange('overrideX', -1 as any);
-                    onParameterChange('overrideY', -1 as any);
-                    onParameterChange('position', idx as any);
+                    onParameterChange("overrideX", -1 as any);
+                    onParameterChange("overrideY", -1 as any);
+                    onParameterChange("position", idx as any);
                   }}
                   onMouseEnter={() => setHoverTile(idx)}
                   onMouseLeave={() => setHoverTile(null)}
@@ -342,5 +455,3 @@ export default function StampPreview({ parameters, onParameterChange, file, show
     </div>
   );
 }
-
-
diff --git a/frontend/src/core/components/tools/addStamp/StampPreviewUtils.ts b/frontend/src/core/components/tools/addStamp/StampPreviewUtils.ts
index 6d22ba0d7e..97120c0fcf 100644
--- a/frontend/src/core/components/tools/addStamp/StampPreviewUtils.ts
+++ b/frontend/src/core/components/tools/addStamp/StampPreviewUtils.ts
@@ -1,15 +1,18 @@
-import type { AddStampParameters } from '@app/components/tools/addStamp/useAddStampParameters';
+import type { AddStampParameters } from "@app/components/tools/addStamp/useAddStampParameters";
 
 export type ContainerSize = { width: number; height: number };
 export type PageSizePts = { widthPts: number; heightPts: number } | null;
 export type ImageMeta = { url: string; width: number; height: number } | null;
 
 // Map UI margin option to backend margin factor
-export const marginFactorMap: Record<AddStampParameters['customMargin'], number> = {
-  'small': 0.02,
-  'medium': 0.035,
-  'large': 0.05,
-  'x-large': 0.075,
+export const marginFactorMap: Record<
+  AddStampParameters["customMargin"],
+  number
+> = {
+  small: 0.02,
+  medium: 0.035,
+  large: 0.05,
+  "x-large": 0.075,
 };
 
 export const A4_ASPECT_RATIO = 0.707; // width/height used elsewhere in legacy UI
@@ -17,29 +20,32 @@ export const A4_ASPECT_RATIO = 0.707; // width/height used elsewhere in legacy U
 // Get font family based on selected alphabet (matching backend logic)
 export const getFontFamily = (alphabet: string): string => {
   switch (alphabet) {
-    case 'arabic':
-      return 'Noto Sans Arabic, Arial Unicode MS, sans-serif';
-    case 'japanese':
-      return 'Noto Sans JP, Yu Gothic, Hiragino Sans, sans-serif';
-    case 'korean':
-      return 'Noto Sans KR, Malgun Gothic, Dotum, sans-serif';
-    case 'chinese':
-      return 'Noto Sans SC, Microsoft YaHei, SimSun, sans-serif';
-    case 'thai':
-      return 'Noto Sans Thai, Tahoma, sans-serif';
-    case 'roman':
+    case "arabic":
+      return "Noto Sans Arabic, Arial Unicode MS, sans-serif";
+    case "japanese":
+      return "Noto Sans JP, Yu Gothic, Hiragino Sans, sans-serif";
+    case "korean":
+      return "Noto Sans KR, Malgun Gothic, Dotum, sans-serif";
+    case "chinese":
+      return "Noto Sans SC, Microsoft YaHei, SimSun, sans-serif";
+    case "thai":
+      return "Noto Sans Thai, Tahoma, sans-serif";
+    case "roman":
     default:
-      return 'Noto Sans, Arial, Helvetica, sans-serif';
+      return "Noto Sans, Arial, Helvetica, sans-serif";
   }
 };
 
 // Lightweight parser: returns first page number from CSV/range input, otherwise 1
 export const getFirstSelectedPage = (input: string): number => {
   if (!input) return 1;
-  const parts = input.split(',').map(s => s.trim()).filter(Boolean);
+  const parts = input
+    .split(",")
+    .map((s) => s.trim())
+    .filter(Boolean);
   for (const part of parts) {
     if (/^\d+\s*-\s*\d+$/.test(part)) {
-      const low = parseInt(part.split('-')[0].trim(), 10);
+      const low = parseInt(part.split("-")[0].trim(), 10);
       if (Number.isFinite(low) && low > 0) return low;
     }
     const n = parseInt(part, 10);
@@ -51,18 +57,67 @@ export const getFirstSelectedPage = (input: string): number => {
 export type StampPreviewStyle = { container: any; item: any };
 
 // Unified per-alphabet preview adjustments
-export type Alphabet = 'roman' | 'arabic' | 'japanese' | 'korean' | 'chinese' | 'thai';
-export type AlphabetTweaks = { scale: number; rowOffsetRem: [number, number, number]; lineHeight: number; capHeightRatio: number; defaultFontSize: number };
+export type Alphabet =
+  | "roman"
+  | "arabic"
+  | "japanese"
+  | "korean"
+  | "chinese"
+  | "thai";
+export type AlphabetTweaks = {
+  scale: number;
+  rowOffsetRem: [number, number, number];
+  lineHeight: number;
+  capHeightRatio: number;
+  defaultFontSize: number;
+};
 export const ALPHABET_PREVIEW_TWEAKS: Record<Alphabet, AlphabetTweaks> = {
   // [top, middle, bottom] row offsets in rem
-  roman: { scale: 1.0/1.18, rowOffsetRem: [0, 1, 2.2], lineHeight: 1.28, capHeightRatio: 0.70, defaultFontSize: 80 },
-  arabic: { scale: 1.2, rowOffsetRem: [0, 1.5, 2.5], lineHeight: 1, capHeightRatio: 0.68, defaultFontSize: 80 },
-  japanese: { scale: 1/1.2, rowOffsetRem: [-0.1, 1, 2], lineHeight: 1, capHeightRatio: 0.72, defaultFontSize: 80 },
-  korean: { scale: 1.0/1.05, rowOffsetRem: [-0.2, 0.5, 1.4], lineHeight: 1, capHeightRatio: 0.72, defaultFontSize: 80 },
-  chinese: { scale: 1/1.2, rowOffsetRem: [0, 2, 2.8], lineHeight: 1, capHeightRatio: 0.72, defaultFontSize: 30 }, // temporary default font size so that it fits on the PDF
-  thai: { scale: 1/1.2, rowOffsetRem: [-1, 0, .8], lineHeight: 1, capHeightRatio: 0.66, defaultFontSize: 80 },
+  roman: {
+    scale: 1.0 / 1.18,
+    rowOffsetRem: [0, 1, 2.2],
+    lineHeight: 1.28,
+    capHeightRatio: 0.7,
+    defaultFontSize: 80,
+  },
+  arabic: {
+    scale: 1.2,
+    rowOffsetRem: [0, 1.5, 2.5],
+    lineHeight: 1,
+    capHeightRatio: 0.68,
+    defaultFontSize: 80,
+  },
+  japanese: {
+    scale: 1 / 1.2,
+    rowOffsetRem: [-0.1, 1, 2],
+    lineHeight: 1,
+    capHeightRatio: 0.72,
+    defaultFontSize: 80,
+  },
+  korean: {
+    scale: 1.0 / 1.05,
+    rowOffsetRem: [-0.2, 0.5, 1.4],
+    lineHeight: 1,
+    capHeightRatio: 0.72,
+    defaultFontSize: 80,
+  },
+  chinese: {
+    scale: 1 / 1.2,
+    rowOffsetRem: [0, 2, 2.8],
+    lineHeight: 1,
+    capHeightRatio: 0.72,
+    defaultFontSize: 30,
+  }, // temporary default font size so that it fits on the PDF
+  thai: {
+    scale: 1 / 1.2,
+    rowOffsetRem: [-1, 0, 0.8],
+    lineHeight: 1,
+    capHeightRatio: 0.66,
+    defaultFontSize: 80,
+  },
 };
-export const getAlphabetPreviewScale = (alphabet: string): number => (ALPHABET_PREVIEW_TWEAKS as any)[alphabet]?.scale ?? 1.0;
+export const getAlphabetPreviewScale = (alphabet: string): number =>
+  (ALPHABET_PREVIEW_TWEAKS as any)[alphabet]?.scale ?? 1.0;
 
 export const getDefaultFontSizeForAlphabet = (alphabet: string): number => {
   return (ALPHABET_PREVIEW_TWEAKS as any)[alphabet]?.defaultFontSize ?? 80;
@@ -75,7 +130,7 @@ export function computeStampPreviewStyle(
   containerSize: ContainerSize,
   showQuickGrid: boolean | undefined,
   _hoverTile: number | null,
-  hasPageThumbnail: boolean
+  hasPageThumbnail: boolean,
 ): StampPreviewStyle {
   const pageWidthPx = containerSize.width;
   const pageHeightPx = containerSize.height;
@@ -83,26 +138,31 @@ export function computeStampPreviewStyle(
   const heightPts = pageSize?.heightPts ?? 841.89; // A4 height at 72 DPI
   const scaleX = pageWidthPx / widthPts;
   const scaleY = pageHeightPx / heightPts;
-  if (pageWidthPx <= 0 || pageHeightPx <= 0) return { item: {}, container: {} } as any;
+  if (pageWidthPx <= 0 || pageHeightPx <= 0)
+    return { item: {}, container: {} } as any;
 
-  const marginPts = (widthPts + heightPts) / 2 * (marginFactorMap[parameters.customMargin] ?? 0.035);
+  const marginPts =
+    ((widthPts + heightPts) / 2) *
+    (marginFactorMap[parameters.customMargin] ?? 0.035);
 
   // Compute content dimensions
-  const heightPtsContent = parameters.fontSize * getAlphabetPreviewScale(parameters.alphabet);
+  const heightPtsContent =
+    parameters.stampType === "image"
+      ? parameters.fontSize
+      : parameters.fontSize * getAlphabetPreviewScale(parameters.alphabet);
   let widthPtsContent = heightPtsContent;
 
-
-  if (parameters.stampType === 'image' && imageMeta) {
+  if (parameters.stampType === "image" && imageMeta) {
     const aspect = imageMeta.width / imageMeta.height;
     widthPtsContent = heightPtsContent * aspect;
-  } else if (parameters.stampType === 'text') {
+  } else if (parameters.stampType === "text") {
     // Use Canvas 2D to measure text width for better fidelity than DOM spans
-    const textLine = (parameters.stampText || '').split('\n')[0] ?? '';
+    const textLine = (parameters.stampText || "").split("\n")[0] ?? "";
     const fontPx = heightPtsContent * scaleY; // Convert point size to px using vertical scale
     const fontFamily = getFontFamily(parameters.alphabet);
 
-    const canvas = document.createElement('canvas');
-    const ctx = canvas.getContext('2d');
+    const canvas = document.createElement("canvas");
+    const ctx = canvas.getContext("2d");
     if (ctx) {
       ctx.font = `${fontPx}px ${fontFamily}`;
       const metrics = ctx.measureText(textLine);
@@ -112,16 +172,16 @@ export function computeStampPreviewStyle(
 
       let adjustmentFactor: number;
       switch (parameters.alphabet) {
-        case 'roman':
-          adjustmentFactor = 0.90;
+        case "roman":
+          adjustmentFactor = 0.9;
           break;
-        case 'arabic':
-        case 'thai':
+        case "arabic":
+        case "thai":
           adjustmentFactor = 0.92;
           break;
-        case 'japanese':
-        case 'korean':
-        case 'chinese':
+        case "japanese":
+        case "korean":
+        case "chinese":
           adjustmentFactor = 0.88;
           break;
         default:
@@ -135,7 +195,8 @@ export function computeStampPreviewStyle(
   // Positioning helpers - mirror backend logic
   const position = parameters.position;
   const calcX = () => {
-    if (parameters.overrideX >= 0 && parameters.overrideY >= 0) return parameters.overrideX;
+    if (parameters.overrideX >= 0 && parameters.overrideY >= 0)
+      return parameters.overrideX;
     switch (position % 3) {
       case 1: // Left
         return marginPts;
@@ -148,11 +209,15 @@ export function computeStampPreviewStyle(
     }
   };
   const calcY = () => {
-    if (parameters.overrideX >= 0 && parameters.overrideY >= 0) return parameters.overrideY;
+    if (parameters.overrideX >= 0 && parameters.overrideY >= 0)
+      return parameters.overrideY;
     // For text, backend positions using cap height, not full font size
-    const heightForY = parameters.stampType === 'text'
-      ? heightPtsContent * ((ALPHABET_PREVIEW_TWEAKS as any)[parameters.alphabet]?.capHeightRatio ?? 0.70)
-      : heightPtsContent;
+    const heightForY =
+      parameters.stampType === "text"
+        ? heightPtsContent *
+          ((ALPHABET_PREVIEW_TWEAKS as any)[parameters.alphabet]
+            ?.capHeightRatio ?? 0.7)
+        : heightPtsContent;
     switch (Math.floor((position - 1) / 3)) {
       case 0: // Top
         return heightPts - heightForY - marginPts;
@@ -169,11 +234,15 @@ export function computeStampPreviewStyle(
   const yPts = calcY();
   let xPx = xPts * scaleX;
   let yPx = yPts * scaleY;
-  if (parameters.stampType === 'text') {
+  if (parameters.stampType === "text") {
     try {
-      const rootFontSizePx = parseFloat(getComputedStyle(document.documentElement).fontSize || '16') || 16;
+      const rootFontSizePx =
+        parseFloat(
+          getComputedStyle(document.documentElement).fontSize || "16",
+        ) || 16;
       const rowIndex = Math.floor((position - 1) / 3); // 0 top, 1 middle, 2 bottom
-      const offsets = (ALPHABET_PREVIEW_TWEAKS as any)[parameters.alphabet]?.rowOffsetRem ?? [0, 0, 0];
+      const offsets = (ALPHABET_PREVIEW_TWEAKS as any)[parameters.alphabet]
+        ?.rowOffsetRem ?? [0, 0, 0];
       const offsetRem = offsets[rowIndex] ?? 0;
       yPx += offsetRem * rootFontSizePx;
     } catch (e) {
@@ -190,47 +259,49 @@ export function computeStampPreviewStyle(
   const opacity = Math.max(0, Math.min(1, parameters.opacity / 100));
   const displayOpacity = opacity;
 
-  let alignItems: 'flex-start' | 'center' | 'flex-end' = 'flex-start';
-  if (parameters.stampType === 'text') {
+  let alignItems: "flex-start" | "center" | "flex-end" = "flex-start";
+  if (parameters.stampType === "text") {
     const colIndex = position % 3; // 1: left, 2: center, 0: right
     switch (colIndex) {
       case 2: // center column
-        alignItems = 'center';
+        alignItems = "center";
         break;
       case 0: // right column
-        alignItems = 'flex-end';
+        alignItems = "flex-end";
         break;
       default:
-        alignItems = 'flex-start';
+        alignItems = "flex-start";
     }
   }
 
   return {
     container: {
-      position: 'relative',
-      width: '100%',
+      position: "relative",
+      width: "100%",
       aspectRatio: `${(pageSize?.widthPts ?? 595.28) / (pageSize?.heightPts ?? 841.89)} / 1`,
-      backgroundColor: hasPageThumbnail ? 'white' : 'rgba(255,255,255,0.03)',
-      border: '1px solid var(--border-default, #333)',
-      overflow: 'hidden'
+      backgroundColor: hasPageThumbnail ? "white" : "rgba(255,255,255,0.03)",
+      border: "1px solid var(--border-default, #333)",
+      overflow: "hidden",
     },
     item: {
-      position: 'absolute',
+      position: "absolute",
       left: `${xPx}px`,
       bottom: `${yPx}px`,
       width: `${widthPx}px`,
       height: `${heightPx}px`,
       opacity: displayOpacity,
       transform: `rotate(${-parameters.rotation}deg)`,
-      transformOrigin: 'center center',
+      transformOrigin:
+        parameters.stampType === "image" ? "left bottom" : "center center",
       color: parameters.customColor,
-      display: 'flex',
-      flexDirection: 'column',
-      justifyContent: 'flex-start',
-      lineHeight: (ALPHABET_PREVIEW_TWEAKS as any)[parameters.alphabet]?.lineHeight ?? 1,
+      display: "flex",
+      flexDirection: "column",
+      justifyContent: "flex-start",
+      lineHeight:
+        (ALPHABET_PREVIEW_TWEAKS as any)[parameters.alphabet]?.lineHeight ?? 1,
       alignItems,
-      cursor: showQuickGrid ? 'default' : 'move',
-      pointerEvents: showQuickGrid ? 'none' : 'auto',
-    }
+      cursor: showQuickGrid ? "default" : "move",
+      pointerEvents: showQuickGrid ? "none" : "auto",
+    },
   };
 }
diff --git a/frontend/src/core/components/tools/addStamp/StampSetupSettings.tsx b/frontend/src/core/components/tools/addStamp/StampSetupSettings.tsx
index 54e95b157b..1625affa59 100644
--- a/frontend/src/core/components/tools/addStamp/StampSetupSettings.tsx
+++ b/frontend/src/core/components/tools/addStamp/StampSetupSettings.tsx
@@ -1,6 +1,20 @@
 import { useMemo } from "react";
 import { useTranslation } from "react-i18next";
-import { Stack, Textarea, TextInput, Select, Button, Text, Divider, Accordion, Code, Group, Badge, Box, Paper } from "@mantine/core";
+import {
+  Stack,
+  Textarea,
+  TextInput,
+  Select,
+  Button,
+  Text,
+  Divider,
+  Accordion,
+  Code,
+  Group,
+  Badge,
+  Box,
+  Paper,
+} from "@mantine/core";
 import { AddStampParameters } from "@app/components/tools/addStamp/useAddStampParameters";
 import ButtonSelector from "@app/components/shared/ButtonSelector";
 import styles from "@app/components/tools/addStamp/StampPreview.module.css";
@@ -9,76 +23,79 @@ import { Z_INDEX_AUTOMATE_DROPDOWN } from "@app/styles/zIndex";
 
 const STAMP_TEMPLATES = [
   {
-    id: 'page-numbers',
-    name: 'Page Numbers',
-    text: 'Page @page_number of @total_pages',
+    id: "page-numbers",
+    name: "Page Numbers",
+    text: "Page @page_number of @total_pages",
     position: 2, // bottom center
   },
   {
-    id: 'draft',
-    name: 'Draft Watermark',
-    text: 'DRAFT - @date',
+    id: "draft",
+    name: "Draft Watermark",
+    text: "DRAFT - @date",
     position: 5, // center
   },
   {
-    id: 'doc-info',
-    name: 'Document Info',
-    text: '@filename\nCreated: @date{dd MMM yyyy}',
+    id: "doc-info",
+    name: "Document Info",
+    text: "@filename\nCreated: @date{dd MMM yyyy}",
     position: 7, // top left
   },
   {
-    id: 'legal-footer',
-    name: 'Legal Footer',
-    text: '© @year - All Rights Reserved\n@filename - Page @page_number',
+    id: "legal-footer",
+    name: "Legal Footer",
+    text: "© @year - All Rights Reserved\n@filename - Page @page_number",
     position: 2, // bottom center
   },
   {
-    id: 'european-date',
-    name: 'European Date (DD/MM/YYYY)',
-    text: '@date{dd/MM/yyyy}',
+    id: "european-date",
+    name: "European Date (DD/MM/YYYY)",
+    text: "@date{dd/MM/yyyy}",
     position: 9, // top right
   },
   {
-    id: 'timestamp',
-    name: 'Timestamp',
-    text: '@date{dd/MM/yyyy HH:mm}',
+    id: "timestamp",
+    name: "Timestamp",
+    text: "@date{dd/MM/yyyy HH:mm}",
     position: 9, // top right
   },
 ];
 
-const resolveVariablesForPreview = (text: string, filename?: string): string => {
+const resolveVariablesForPreview = (
+  text: string,
+  filename?: string,
+): string => {
   const now = new Date();
-  const pad = (n: number) => String(n).padStart(2, '0');
+  const pad = (n: number) => String(n).padStart(2, "0");
 
-  const ESCAPED_AT_PLACEHOLDER = '\uE000ESCAPED_AT\uE000';
+  const ESCAPED_AT_PLACEHOLDER = "\uE000ESCAPED_AT\uE000";
   let result = text.replace(/@@/g, ESCAPED_AT_PLACEHOLDER);
 
-  const actualFilename = filename || 'sample-document.pdf';
-  const filenameWithoutExt = actualFilename.includes('.')
-    ? actualFilename.substring(0, actualFilename.lastIndexOf('.'))
+  const actualFilename = filename || "sample-document.pdf";
+  const filenameWithoutExt = actualFilename.includes(".")
+    ? actualFilename.substring(0, actualFilename.lastIndexOf("."))
     : actualFilename;
 
   const sampleData: Record<string, string> = {
-    '@datetime': `${now.getFullYear()}-${pad(now.getMonth() + 1)}-${pad(now.getDate())} ${pad(now.getHours())}:${pad(now.getMinutes())}:${pad(now.getSeconds())}`,
-    '@date': `${now.getFullYear()}-${pad(now.getMonth() + 1)}-${pad(now.getDate())}`,
-    '@time': `${pad(now.getHours())}:${pad(now.getMinutes())}:${pad(now.getSeconds())}`,
-    '@year': String(now.getFullYear()),
-    '@month': pad(now.getMonth() + 1),
-    '@day': pad(now.getDate()),
+    "@datetime": `${now.getFullYear()}-${pad(now.getMonth() + 1)}-${pad(now.getDate())} ${pad(now.getHours())}:${pad(now.getMinutes())}:${pad(now.getSeconds())}`,
+    "@date": `${now.getFullYear()}-${pad(now.getMonth() + 1)}-${pad(now.getDate())}`,
+    "@time": `${pad(now.getHours())}:${pad(now.getMinutes())}:${pad(now.getSeconds())}`,
+    "@year": String(now.getFullYear()),
+    "@month": pad(now.getMonth() + 1),
+    "@day": pad(now.getDate()),
     // Page info - cannot be previewed, show placeholder
-    '@page_number': '?',
-    '@page': '?',
-    '@total_pages': '?',
-    '@page_count': '?',
+    "@page_number": "?",
+    "@page": "?",
+    "@total_pages": "?",
+    "@page_count": "?",
     // Filename - use actual file if provided
-    '@filename': filenameWithoutExt,
-    '@filename_full': actualFilename,
+    "@filename": filenameWithoutExt,
+    "@filename_full": actualFilename,
     // Metadata - cannot be read from PDF in frontend, show placeholder
-    '@author': '?',
-    '@title': '?',
-    '@subject': '?',
+    "@author": "?",
+    "@title": "?",
+    "@subject": "?",
     // UUID - will be random each time
-    '@uuid': '????????',
+    "@uuid": "????????",
   };
 
   result = result.replace(/@date\{([^}]+)\}/g, (match, format) => {
@@ -86,8 +103,8 @@ const resolveVariablesForPreview = (text: string, filename?: string): string =>
       return format
         .replace(/yyyy/g, String(now.getFullYear()))
         .replace(/yy/g, String(now.getFullYear()).slice(-2))
-        .replace(/MMMM/g, now.toLocaleString('default', { month: 'long' }))
-        .replace(/MMM/g, now.toLocaleString('default', { month: 'short' }))
+        .replace(/MMMM/g, now.toLocaleString("default", { month: "long" }))
+        .replace(/MMM/g, now.toLocaleString("default", { month: "short" }))
         .replace(/MM/g, pad(now.getMonth() + 1))
         .replace(/dd/g, pad(now.getDate()))
         .replace(/HH/g, pad(now.getHours()))
@@ -103,9 +120,9 @@ const resolveVariablesForPreview = (text: string, filename?: string): string =>
     result = result.split(key).join(value);
   });
 
-  result = result.replace(new RegExp(ESCAPED_AT_PLACEHOLDER, 'g'), '@');
+  result = result.replace(new RegExp(ESCAPED_AT_PLACEHOLDER, "g"), "@");
 
-  result = result.replace(/\\n/g, '\n');
+  result = result.replace(/\\n/g, "\n");
 
   return result;
 };
@@ -116,17 +133,21 @@ interface ClickableCodeProps {
   block?: boolean;
 }
 
-const ClickableCode = ({ children, onClick, block = false }: ClickableCodeProps) => (
+const ClickableCode = ({
+  children,
+  onClick,
+  block = false,
+}: ClickableCodeProps) => (
   <Code
     tabIndex={0}
     role="button"
     style={{
-      cursor: 'pointer',
-      display: block ? 'block' : undefined,
+      cursor: "pointer",
+      display: block ? "block" : undefined,
     }}
     onClick={onClick}
     onKeyDown={(e: React.KeyboardEvent) => {
-      if (e.key === 'Enter' || e.key === ' ') {
+      if (e.key === "Enter" || e.key === " ") {
         e.preventDefault();
         onClick();
       }
@@ -136,11 +157,17 @@ const ClickableCode = ({ children, onClick, block = false }: ClickableCodeProps)
   </Code>
 );
 
-const StampTextPreview = ({ stampText, filename }: { stampText: string; filename?: string }) => {
+const StampTextPreview = ({
+  stampText,
+  filename,
+}: {
+  stampText: string;
+  filename?: string;
+}) => {
   const { t } = useTranslation();
 
   const resolvedText = useMemo(() => {
-    if (!stampText.trim()) return '';
+    if (!stampText.trim()) return "";
     return resolveVariablesForPreview(stampText, filename);
   }, [stampText, filename]);
 
@@ -148,8 +175,17 @@ const StampTextPreview = ({ stampText, filename }: { stampText: string; filename
 
   return (
     <Paper p="xs" withBorder bg="var(--mantine-color-default)">
-      <Text size="xs" c="dimmed" mb={4}>{t('AddStampRequest.preview', 'Preview:')}</Text>
-      <Text size="sm" style={{ whiteSpace: 'pre-wrap', fontFamily: 'monospace', wordBreak: 'break-word' }}>
+      <Text size="xs" c="dimmed" mb={4}>
+        {t("AddStampRequest.preview", "Preview:")}
+      </Text>
+      <Text
+        size="sm"
+        style={{
+          whiteSpace: "pre-wrap",
+          fontFamily: "monospace",
+          wordBreak: "break-word",
+        }}
+      >
         {resolvedText}
       </Text>
     </Paper>
@@ -158,31 +194,46 @@ const StampTextPreview = ({ stampText, filename }: { stampText: string; filename
 
 interface StampSetupSettingsProps {
   parameters: AddStampParameters;
-  onParameterChange: <K extends keyof AddStampParameters>(key: K, value: AddStampParameters[K]) => void;
+  onParameterChange: <K extends keyof AddStampParameters>(
+    key: K,
+    value: AddStampParameters[K],
+  ) => void;
   disabled?: boolean;
   filename?: string;
 }
 
-const StampSetupSettings = ({ parameters, onParameterChange, disabled = false, filename }: StampSetupSettingsProps) => {
+const StampSetupSettings = ({
+  parameters,
+  onParameterChange,
+  disabled = false,
+  filename,
+}: StampSetupSettingsProps) => {
   const { t } = useTranslation();
 
   return (
     <Stack gap="md">
       <TextInput
-        label={t('pageSelectionPrompt', 'Page Selection (e.g. 1,3,2 or 4-8,2,10-12 or 2n-1)')}
+        label={t(
+          "pageSelectionPrompt",
+          "Page Selection (e.g. 1,3,2 or 4-8,2,10-12 or 2n-1)",
+        )}
         value={parameters.pageNumbers}
-        onChange={(e) => onParameterChange('pageNumbers', e.currentTarget.value)}
+        onChange={(e) =>
+          onParameterChange("pageNumbers", e.currentTarget.value)
+        }
         disabled={disabled}
       />
-      <Divider/>
+      <Divider />
       <div>
-        <Text size="sm" fw={500} mb="xs">{t('AddStampRequest.stampType', 'Stamp Type')}</Text>
+        <Text size="sm" fw={500} mb="xs">
+          {t("AddStampRequest.stampType", "Stamp Type")}
+        </Text>
         <ButtonSelector
           value={parameters.stampType}
-          onChange={(v: 'text' | 'image') => onParameterChange('stampType', v)}
+          onChange={(v: "text" | "image") => onParameterChange("stampType", v)}
           options={[
-            { value: 'text', label: t('watermark.type.1', 'Text') },
-            { value: 'image', label: t('watermark.type.2', 'Image') },
+            { value: "text", label: t("watermark.type.1", "Text") },
+            { value: "image", label: t("watermark.type.2", "Image") },
           ]}
           disabled={disabled}
           buttonClassName={styles.modeToggleButton}
@@ -190,167 +241,391 @@ const StampSetupSettings = ({ parameters, onParameterChange, disabled = false, f
         />
       </div>
 
-      {parameters.stampType === 'text' && (
+      {parameters.stampType === "text" && (
         <>
           {/* Template Selector - always shows placeholder, doesn't persist selection */}
           <Select
-            label={t('AddStampRequest.useTemplate', 'Use Template')}
-            placeholder={t('AddStampRequest.selectTemplate', 'Select a template...')}
+            label={t("AddStampRequest.useTemplate", "Use Template")}
+            placeholder={t(
+              "AddStampRequest.selectTemplate",
+              "Select a template...",
+            )}
             value={null}
-            data={STAMP_TEMPLATES.map(template => ({
+            data={STAMP_TEMPLATES.map((template) => ({
               value: template.id,
-              label: t(`AddStampRequest.template.${template.id}`, template.name)
+              label: t(
+                `AddStampRequest.template.${template.id}`,
+                template.name,
+              ),
             }))}
             onChange={(value) => {
-              const template = STAMP_TEMPLATES.find(t => t.id === value);
+              const template = STAMP_TEMPLATES.find((t) => t.id === value);
               if (template) {
-                onParameterChange('stampText', template.text);
-                onParameterChange('position', template.position as any);
+                onParameterChange("stampText", template.text);
+                onParameterChange("position", template.position as any);
               }
             }}
             clearable
             disabled={disabled}
-            comboboxProps={{ withinPortal: true, zIndex: Z_INDEX_AUTOMATE_DROPDOWN }}
+            comboboxProps={{
+              withinPortal: true,
+              zIndex: Z_INDEX_AUTOMATE_DROPDOWN,
+            }}
           />
 
           <Textarea
-            label={t('AddStampRequest.stampText', 'Stamp Text')}
-            description={t('AddStampRequest.stampTextDescription', 'Use dynamic variables below. Use @@ for literal @. Use \\n for new lines.')}
+            label={t("AddStampRequest.stampText", "Stamp Text")}
+            description={t(
+              "AddStampRequest.stampTextDescription",
+              "Use dynamic variables below. Use @@ for literal @. Use \\n for new lines.",
+            )}
             value={parameters.stampText}
-            onChange={(e) => onParameterChange('stampText', e.currentTarget.value)}
+            onChange={(e) =>
+              onParameterChange("stampText", e.currentTarget.value)
+            }
             autosize
             minRows={2}
             disabled={disabled}
           />
 
           {/* Live Preview */}
-          <StampTextPreview stampText={parameters.stampText} filename={filename} />
+          <StampTextPreview
+            stampText={parameters.stampText}
+            filename={filename}
+          />
 
           <Accordion variant="contained" radius="sm">
             <Accordion.Item value="variables">
               <Accordion.Control>
                 <Group gap="xs">
-                  <Text size="sm" fw={500}>{t('AddStampRequest.dynamicVariables', 'Dynamic Variables')}</Text>
-                  <Badge size="xs" variant="light" color="blue">{t('AddStampRequest.clickToExpand', 'Click to expand')}</Badge>
+                  <Text size="sm" fw={500}>
+                    {t("AddStampRequest.dynamicVariables", "Dynamic Variables")}
+                  </Text>
+                  <Badge size="xs" variant="light" color="blue">
+                    {t("AddStampRequest.clickToExpand", "Click to expand")}
+                  </Badge>
                 </Group>
               </Accordion.Control>
               <Accordion.Panel>
                 <Stack gap="xs">
                   <Text size="xs" c="dimmed" mb="xs">
-                    {t('AddStampRequest.variablesHelp', 'Click on any variable to insert it into your stamp text. Use @@ for literal @.')}
+                    {t(
+                      "AddStampRequest.variablesHelp",
+                      "Click on any variable to insert it into your stamp text. Use @@ for literal @.",
+                    )}
                   </Text>
                   <Box>
-                    <Text size="xs" fw={600} mb={4}>{t('AddStampRequest.dateTimeVars', 'Date & Time')}</Text>
+                    <Text size="xs" fw={600} mb={4}>
+                      {t("AddStampRequest.dateTimeVars", "Date & Time")}
+                    </Text>
                     <Group gap="xs">
-                      <ClickableCode onClick={() => onParameterChange('stampText', parameters.stampText + '@date')}>
+                      <ClickableCode
+                        onClick={() =>
+                          onParameterChange(
+                            "stampText",
+                            parameters.stampText + "@date",
+                          )
+                        }
+                      >
                         @date
                       </ClickableCode>
-                      <Text size="xs" c="dimmed">— {t('AddStampRequest.dateDesc', 'Current date')} (YYYY-MM-DD)</Text>
+                      <Text size="xs" c="dimmed">
+                        — {t("AddStampRequest.dateDesc", "Current date")}{" "}
+                        (YYYY-MM-DD)
+                      </Text>
                     </Group>
                     <Group gap="xs" mt={4}>
-                      <ClickableCode onClick={() => onParameterChange('stampText', parameters.stampText + '@time')}>
+                      <ClickableCode
+                        onClick={() =>
+                          onParameterChange(
+                            "stampText",
+                            parameters.stampText + "@time",
+                          )
+                        }
+                      >
                         @time
                       </ClickableCode>
-                      <Text size="xs" c="dimmed">— {t('AddStampRequest.timeDesc', 'Current time')} (HH:mm:ss)</Text>
+                      <Text size="xs" c="dimmed">
+                        — {t("AddStampRequest.timeDesc", "Current time")}{" "}
+                        (HH:mm:ss)
+                      </Text>
                     </Group>
                     <Group gap="xs" mt={4}>
-                      <ClickableCode onClick={() => onParameterChange('stampText', parameters.stampText + '@datetime')}>
+                      <ClickableCode
+                        onClick={() =>
+                          onParameterChange(
+                            "stampText",
+                            parameters.stampText + "@datetime",
+                          )
+                        }
+                      >
                         @datetime
                       </ClickableCode>
-                      <Text size="xs" c="dimmed">— {t('AddStampRequest.datetimeDesc', 'Date and time combined')}</Text>
+                      <Text size="xs" c="dimmed">
+                        —{" "}
+                        {t(
+                          "AddStampRequest.datetimeDesc",
+                          "Date and time combined",
+                        )}
+                      </Text>
                     </Group>
                     <Group gap="xs" mt={4}>
-                      <ClickableCode onClick={() => onParameterChange('stampText', parameters.stampText + '@date{dd/MM/yyyy}')}>
+                      <ClickableCode
+                        onClick={() =>
+                          onParameterChange(
+                            "stampText",
+                            parameters.stampText + "@date{dd/MM/yyyy}",
+                          )
+                        }
+                      >
                         @date&#123;format&#125;
                       </ClickableCode>
-                      <Text size="xs" c="dimmed">— {t('AddStampRequest.customDateDesc', 'Custom format')}</Text>
+                      <Text size="xs" c="dimmed">
+                        — {t("AddStampRequest.customDateDesc", "Custom format")}
+                      </Text>
                     </Group>
                     <Group gap="xs" mt={4}>
-                      <ClickableCode onClick={() => onParameterChange('stampText', parameters.stampText + '@year')}>
+                      <ClickableCode
+                        onClick={() =>
+                          onParameterChange(
+                            "stampText",
+                            parameters.stampText + "@year",
+                          )
+                        }
+                      >
                         @year
                       </ClickableCode>
-                      <ClickableCode onClick={() => onParameterChange('stampText', parameters.stampText + '@month')}>
+                      <ClickableCode
+                        onClick={() =>
+                          onParameterChange(
+                            "stampText",
+                            parameters.stampText + "@month",
+                          )
+                        }
+                      >
                         @month
                       </ClickableCode>
-                      <ClickableCode onClick={() => onParameterChange('stampText', parameters.stampText + '@day')}>
+                      <ClickableCode
+                        onClick={() =>
+                          onParameterChange(
+                            "stampText",
+                            parameters.stampText + "@day",
+                          )
+                        }
+                      >
                         @day
                       </ClickableCode>
-                      <Text size="xs" c="dimmed">— {t('AddStampRequest.yearMonthDayDesc', 'Individual date parts')}</Text>
+                      <Text size="xs" c="dimmed">
+                        —{" "}
+                        {t(
+                          "AddStampRequest.yearMonthDayDesc",
+                          "Individual date parts",
+                        )}
+                      </Text>
                     </Group>
                   </Box>
                   <Divider my="xs" />
                   <Box>
-                    <Text size="xs" fw={600} mb={4}>{t('AddStampRequest.pageVars', 'Page Information')}</Text>
+                    <Text size="xs" fw={600} mb={4}>
+                      {t("AddStampRequest.pageVars", "Page Information")}
+                    </Text>
                     <Group gap="xs">
-                      <ClickableCode onClick={() => onParameterChange('stampText', parameters.stampText + '@page_number')}>
+                      <ClickableCode
+                        onClick={() =>
+                          onParameterChange(
+                            "stampText",
+                            parameters.stampText + "@page_number",
+                          )
+                        }
+                      >
                         @page_number
                       </ClickableCode>
-                      <Text size="xs" c="dimmed">— {t('AddStampRequest.pageNumberDesc', 'Current page number')}</Text>
+                      <Text size="xs" c="dimmed">
+                        —{" "}
+                        {t(
+                          "AddStampRequest.pageNumberDesc",
+                          "Current page number",
+                        )}
+                      </Text>
                     </Group>
                     <Group gap="xs" mt={4}>
-                      <ClickableCode onClick={() => onParameterChange('stampText', parameters.stampText + '@total_pages')}>
+                      <ClickableCode
+                        onClick={() =>
+                          onParameterChange(
+                            "stampText",
+                            parameters.stampText + "@total_pages",
+                          )
+                        }
+                      >
                         @total_pages
                       </ClickableCode>
-                      <Text size="xs" c="dimmed">— {t('AddStampRequest.totalPagesDesc', 'Total number of pages')}</Text>
+                      <Text size="xs" c="dimmed">
+                        —{" "}
+                        {t(
+                          "AddStampRequest.totalPagesDesc",
+                          "Total number of pages",
+                        )}
+                      </Text>
                     </Group>
                   </Box>
                   <Divider my="xs" />
                   <Box>
-                    <Text size="xs" fw={600} mb={4}>{t('AddStampRequest.fileVars', 'File Information')}</Text>
+                    <Text size="xs" fw={600} mb={4}>
+                      {t("AddStampRequest.fileVars", "File Information")}
+                    </Text>
                     <Group gap="xs">
-                      <ClickableCode onClick={() => onParameterChange('stampText', parameters.stampText + '@filename')}>
+                      <ClickableCode
+                        onClick={() =>
+                          onParameterChange(
+                            "stampText",
+                            parameters.stampText + "@filename",
+                          )
+                        }
+                      >
                         @filename
                       </ClickableCode>
-                      <Text size="xs" c="dimmed">— {t('AddStampRequest.filenameDesc', 'Filename without extension')}</Text>
+                      <Text size="xs" c="dimmed">
+                        —{" "}
+                        {t(
+                          "AddStampRequest.filenameDesc",
+                          "Filename without extension",
+                        )}
+                      </Text>
                     </Group>
                     <Group gap="xs" mt={4}>
-                      <ClickableCode onClick={() => onParameterChange('stampText', parameters.stampText + '@filename_full')}>
+                      <ClickableCode
+                        onClick={() =>
+                          onParameterChange(
+                            "stampText",
+                            parameters.stampText + "@filename_full",
+                          )
+                        }
+                      >
                         @filename_full
                       </ClickableCode>
-                      <Text size="xs" c="dimmed">— {t('AddStampRequest.filenameFullDesc', 'Filename with extension')}</Text>
+                      <Text size="xs" c="dimmed">
+                        —{" "}
+                        {t(
+                          "AddStampRequest.filenameFullDesc",
+                          "Filename with extension",
+                        )}
+                      </Text>
                     </Group>
                   </Box>
                   <Divider my="xs" />
                   <Box>
-                    <Text size="xs" fw={600} mb={4}>{t('AddStampRequest.metadataVars', 'Document Metadata')}</Text>
+                    <Text size="xs" fw={600} mb={4}>
+                      {t("AddStampRequest.metadataVars", "Document Metadata")}
+                    </Text>
                     <Group gap="xs">
-                      <ClickableCode onClick={() => onParameterChange('stampText', parameters.stampText + '@author')}>
+                      <ClickableCode
+                        onClick={() =>
+                          onParameterChange(
+                            "stampText",
+                            parameters.stampText + "@author",
+                          )
+                        }
+                      >
                         @author
                       </ClickableCode>
-                      <ClickableCode onClick={() => onParameterChange('stampText', parameters.stampText + '@title')}>
+                      <ClickableCode
+                        onClick={() =>
+                          onParameterChange(
+                            "stampText",
+                            parameters.stampText + "@title",
+                          )
+                        }
+                      >
                         @title
                       </ClickableCode>
-                      <ClickableCode onClick={() => onParameterChange('stampText', parameters.stampText + '@subject')}>
+                      <ClickableCode
+                        onClick={() =>
+                          onParameterChange(
+                            "stampText",
+                            parameters.stampText + "@subject",
+                          )
+                        }
+                      >
                         @subject
                       </ClickableCode>
                     </Group>
-                    <Text size="xs" c="dimmed" mt={4}>— {t('AddStampRequest.metadataDesc', 'From PDF document properties')}</Text>
+                    <Text size="xs" c="dimmed" mt={4}>
+                      —{" "}
+                      {t(
+                        "AddStampRequest.metadataDesc",
+                        "From PDF document properties",
+                      )}
+                    </Text>
                   </Box>
                   <Divider my="xs" />
                   <Box>
-                    <Text size="xs" fw={600} mb={4}>{t('AddStampRequest.otherVars', 'Other')}</Text>
+                    <Text size="xs" fw={600} mb={4}>
+                      {t("AddStampRequest.otherVars", "Other")}
+                    </Text>
                     <Group gap="xs">
-                      <ClickableCode onClick={() => onParameterChange('stampText', parameters.stampText + '@uuid')}>
+                      <ClickableCode
+                        onClick={() =>
+                          onParameterChange(
+                            "stampText",
+                            parameters.stampText + "@uuid",
+                          )
+                        }
+                      >
                         @uuid
                       </ClickableCode>
-                      <Text size="xs" c="dimmed">— {t('AddStampRequest.uuidDesc', 'Short unique identifier (8 chars)')}</Text>
+                      <Text size="xs" c="dimmed">
+                        —{" "}
+                        {t(
+                          "AddStampRequest.uuidDesc",
+                          "Short unique identifier (8 chars)",
+                        )}
+                      </Text>
                     </Group>
                   </Box>
                   <Divider my="xs" />
                   <Box>
-                    <Text size="xs" fw={600} mb={4}>{t('AddStampRequest.examples', 'Examples')}</Text>
+                    <Text size="xs" fw={600} mb={4}>
+                      {t("AddStampRequest.examples", "Examples")}
+                    </Text>
                     <Stack gap={4}>
-                      <ClickableCode block onClick={() => onParameterChange('stampText', 'Page @page_number of @total_pages')}>
+                      <ClickableCode
+                        block
+                        onClick={() =>
+                          onParameterChange(
+                            "stampText",
+                            "Page @page_number of @total_pages",
+                          )
+                        }
+                      >
                         Page @page_number of @total_pages
                       </ClickableCode>
-                      <ClickableCode block onClick={() => onParameterChange('stampText', 'Created: @date{dd/MM/yyyy HH:mm}')}>
+                      <ClickableCode
+                        block
+                        onClick={() =>
+                          onParameterChange(
+                            "stampText",
+                            "Created: @date{dd/MM/yyyy HH:mm}",
+                          )
+                        }
+                      >
                         Created: @date&#123;dd/MM/yyyy HH:mm&#125;
                       </ClickableCode>
-                      <ClickableCode block onClick={() => onParameterChange('stampText', '© @year @author')}>
+                      <ClickableCode
+                        block
+                        onClick={() =>
+                          onParameterChange("stampText", "© @year @author")
+                        }
+                      >
                         © @year @author
                       </ClickableCode>
-                      <ClickableCode block onClick={() => onParameterChange('stampText', '@filename\\n@date')}>
-                        @filename\n@date ({t('AddStampRequest.multiLine', 'multi-line')})
+                      <ClickableCode
+                        block
+                        onClick={() =>
+                          onParameterChange("stampText", "@filename\\n@date")
+                        }
+                      >
+                        @filename\n@date (
+                        {t("AddStampRequest.multiLine", "multi-line")})
                       </ClickableCode>
                     </Stack>
                   </Box>
@@ -359,39 +634,42 @@ const StampSetupSettings = ({ parameters, onParameterChange, disabled = false, f
             </Accordion.Item>
           </Accordion>
           <Select
-            label={t('AddStampRequest.alphabet', 'Alphabet')}
+            label={t("AddStampRequest.alphabet", "Alphabet")}
             value={parameters.alphabet}
             onChange={(v) => {
-              const nextAlphabet = (v as any) || 'roman';
-              onParameterChange('alphabet', nextAlphabet);
+              const nextAlphabet = (v as any) || "roman";
+              onParameterChange("alphabet", nextAlphabet);
               const nextDefault = getDefaultFontSizeForAlphabet(nextAlphabet);
-              onParameterChange('fontSize', nextDefault);
+              onParameterChange("fontSize", nextDefault);
             }}
             data={[
-              { value: 'roman', label: 'Roman' },
-              { value: 'arabic', label: 'العربية' },
-              { value: 'japanese', label: '日本語' },
-              { value: 'korean', label: '한국어' },
-              { value: 'chinese', label: '简体中文' },
-              { value: 'thai', label: 'ไทย' },
+              { value: "roman", label: "Roman" },
+              { value: "arabic", label: "العربية" },
+              { value: "japanese", label: "日本語" },
+              { value: "korean", label: "한국어" },
+              { value: "chinese", label: "简体中文" },
+              { value: "thai", label: "ไทย" },
             ]}
             disabled={disabled}
-            comboboxProps={{ withinPortal: true, zIndex: Z_INDEX_AUTOMATE_DROPDOWN }}
+            comboboxProps={{
+              withinPortal: true,
+              zIndex: Z_INDEX_AUTOMATE_DROPDOWN,
+            }}
           />
         </>
       )}
 
-      {parameters.stampType === 'image' && (
+      {parameters.stampType === "image" && (
         <Stack gap="xs">
           <input
             type="file"
             accept=".png,.jpg,.jpeg,.gif,.bmp,.tiff,.tif,.webp"
             onChange={(e) => {
               const file = e.target.files?.[0];
-              if (file) onParameterChange('stampImage', file);
+              if (file) onParameterChange("stampImage", file);
             }}
             disabled={disabled}
-            style={{ display: 'none' }}
+            style={{ display: "none" }}
             id="stamp-image-input"
           />
           <Button
@@ -400,7 +678,7 @@ const StampSetupSettings = ({ parameters, onParameterChange, disabled = false, f
             htmlFor="stamp-image-input"
             disabled={disabled}
           >
-            {t('chooseFile', 'Choose File')}
+            {t("chooseFile", "Choose File")}
           </Button>
           {parameters.stampImage && (
             <Stack gap="xs">
diff --git a/frontend/src/core/components/tools/addStamp/useAddStampOperation.ts b/frontend/src/core/components/tools/addStamp/useAddStampOperation.ts
index 12b9c0a1a1..dc34c5d27a 100644
--- a/frontend/src/core/components/tools/addStamp/useAddStampOperation.ts
+++ b/frontend/src/core/components/tools/addStamp/useAddStampOperation.ts
@@ -1,29 +1,43 @@
-import { useTranslation } from 'react-i18next';
-import { ToolType, useToolOperation } from '@app/hooks/tools/shared/useToolOperation';
-import { createStandardErrorHandler } from '@app/utils/toolErrorHandler';
-import { AddStampParameters, defaultParameters } from '@app/components/tools/addStamp/useAddStampParameters';
+import { useTranslation } from "react-i18next";
+import {
+  ToolType,
+  useToolOperation,
+} from "@app/hooks/tools/shared/useToolOperation";
+import { createStandardErrorHandler } from "@app/utils/toolErrorHandler";
+import {
+  AddStampParameters,
+  defaultParameters,
+} from "@app/components/tools/addStamp/useAddStampParameters";
 
-export const buildAddStampFormData = (parameters: AddStampParameters, file: File): FormData => {
+export const buildAddStampFormData = (
+  parameters: AddStampParameters,
+  file: File,
+): FormData => {
   const formData = new FormData();
-  formData.append('fileInput', file);
-  formData.append('pageNumbers', parameters.pageNumbers);
-  formData.append('customMargin', parameters.customMargin || 'medium'); 
-  formData.append('position', String(parameters.position));
+  formData.append("fileInput", file);
+  formData.append("pageNumbers", parameters.pageNumbers);
+  formData.append("customMargin", parameters.customMargin || "medium");
+  formData.append("position", String(parameters.position));
   const effectiveFontSize = parameters.fontSize;
-  formData.append('fontSize', String(effectiveFontSize));
-  formData.append('rotation', String(parameters.rotation));
-  formData.append('opacity', String(parameters.opacity / 100));
-  formData.append('overrideX', String(parameters.overrideX));
-  formData.append('overrideY', String(parameters.overrideY));
-  formData.append('customColor', parameters.customColor.startsWith('#') ? parameters.customColor : `#${parameters.customColor}`);
-  formData.append('alphabet', parameters.alphabet);
+  formData.append("fontSize", String(effectiveFontSize));
+  formData.append("rotation", String(parameters.rotation));
+  formData.append("opacity", String(parameters.opacity / 100));
+  formData.append("overrideX", String(parameters.overrideX));
+  formData.append("overrideY", String(parameters.overrideY));
+  formData.append(
+    "customColor",
+    parameters.customColor.startsWith("#")
+      ? parameters.customColor
+      : `#${parameters.customColor}`,
+  );
+  formData.append("alphabet", parameters.alphabet);
 
   // Stamp type and payload
-  formData.append('stampType', parameters.stampType || 'text');
-  if (parameters.stampType === 'text') {
-    formData.append('stampText', parameters.stampText);
-  } else if (parameters.stampType === 'image' && parameters.stampImage) {
-    formData.append('stampImage', parameters.stampImage);
+  formData.append("stampType", parameters.stampType || "text");
+  if (parameters.stampType === "text") {
+    formData.append("stampText", parameters.stampText);
+  } else if (parameters.stampType === "image" && parameters.stampImage) {
+    formData.append("stampImage", parameters.stampImage);
   }
 
   return formData;
@@ -32,8 +46,8 @@ export const buildAddStampFormData = (parameters: AddStampParameters, file: File
 export const addStampOperationConfig = {
   toolType: ToolType.singleFile,
   buildFormData: buildAddStampFormData,
-  operationType: 'addStamp',
-  endpoint: '/api/v1/misc/add-stamp',
+  operationType: "addStamp",
+  endpoint: "/api/v1/misc/add-stamp",
   defaultParameters,
 } as const;
 
@@ -43,9 +57,10 @@ export const useAddStampOperation = () => {
   return useToolOperation<AddStampParameters>({
     ...addStampOperationConfig,
     getErrorMessage: createStandardErrorHandler(
-      t('AddStampRequest.error.failed', 'An error occurred while adding stamp to the PDF.')
+      t(
+        "AddStampRequest.error.failed",
+        "An error occurred while adding stamp to the PDF.",
+      ),
     ),
   });
 };
-
-
diff --git a/frontend/src/core/components/tools/addStamp/useAddStampParameters.ts b/frontend/src/core/components/tools/addStamp/useAddStampParameters.ts
index df198e1192..637f4c0566 100644
--- a/frontend/src/core/components/tools/addStamp/useAddStampParameters.ts
+++ b/frontend/src/core/components/tools/addStamp/useAddStampParameters.ts
@@ -1,37 +1,40 @@
-import { BaseParameters } from '@app/types/parameters';
-import { useBaseParameters, type BaseParametersHook } from '@app/hooks/tools/shared/useBaseParameters';
+import { BaseParameters } from "@app/types/parameters";
+import {
+  useBaseParameters,
+  type BaseParametersHook,
+} from "@app/hooks/tools/shared/useBaseParameters";
 
 export interface AddStampParameters extends BaseParameters {
-  stampType?: 'text' | 'image';
+  stampType?: "text" | "image";
   stampText: string;
   stampImage?: File;
-  alphabet: 'roman' | 'arabic' | 'japanese' | 'korean' | 'chinese' | 'thai';
-  fontSize: number; 
-  rotation: number; 
+  alphabet: "roman" | "arabic" | "japanese" | "korean" | "chinese" | "thai";
+  fontSize: number;
+  rotation: number;
   opacity: number;
-  position: 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9; 
+  position: 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9;
   overrideX: number;
-  overrideY: number; 
-  customMargin: 'small' | 'medium' | 'large' | 'x-large';
+  overrideY: number;
+  customMargin: "small" | "medium" | "large" | "x-large";
   customColor: string;
   pageNumbers: string;
-  _activePill: 'fontSize' | 'rotation' | 'opacity';
+  _activePill: "fontSize" | "rotation" | "opacity";
 }
 
 export const defaultParameters: AddStampParameters = {
-  stampType: 'text',
-  stampText: '',
-  alphabet: 'roman',
+  stampType: "text",
+  stampText: "",
+  alphabet: "roman",
   fontSize: 40,
   rotation: 0,
   opacity: 50,
   position: 5,
   overrideX: -1,
   overrideY: -1,
-  customMargin: 'medium',
-  customColor: '#d3d3d3',
-  pageNumbers: '1',
-  _activePill: 'fontSize',
+  customMargin: "medium",
+  customColor: "#d3d3d3",
+  pageNumbers: "1",
+  _activePill: "fontSize",
 };
 
 export type AddStampParametersHook = BaseParametersHook<AddStampParameters>;
@@ -39,15 +42,13 @@ export type AddStampParametersHook = BaseParametersHook<AddStampParameters>;
 export const useAddStampParameters = (): AddStampParametersHook => {
   return useBaseParameters<AddStampParameters>({
     defaultParameters,
-    endpointName: 'add-stamp',
+    endpointName: "add-stamp",
     validateFn: (params): boolean => {
       if (!params.stampType) return false;
-      if (params.stampType === 'text') {
+      if (params.stampType === "text") {
         return params.stampText.trim().length > 0;
       }
       return params.stampImage !== undefined;
     },
   });
 };
-
-
diff --git a/frontend/src/core/components/tools/addWatermark/AddWatermarkSingleStepSettings.tsx b/frontend/src/core/components/tools/addWatermark/AddWatermarkSingleStepSettings.tsx
index 347c4f1857..b9f60bf9e9 100644
--- a/frontend/src/core/components/tools/addWatermark/AddWatermarkSingleStepSettings.tsx
+++ b/frontend/src/core/components/tools/addWatermark/AddWatermarkSingleStepSettings.tsx
@@ -16,17 +16,26 @@ import WatermarkFormatting from "@app/components/tools/addWatermark/WatermarkFor
 
 interface AddWatermarkSingleStepSettingsProps {
   parameters: AddWatermarkParameters;
-  onParameterChange: <K extends keyof AddWatermarkParameters>(key: K, value: AddWatermarkParameters[K]) => void;
+  onParameterChange: <K extends keyof AddWatermarkParameters>(
+    key: K,
+    value: AddWatermarkParameters[K],
+  ) => void;
   disabled?: boolean;
 }
 
-const AddWatermarkSingleStepSettings = ({ parameters, onParameterChange, disabled = false }: AddWatermarkSingleStepSettingsProps) => {
+const AddWatermarkSingleStepSettings = ({
+  parameters,
+  onParameterChange,
+  disabled = false,
+}: AddWatermarkSingleStepSettingsProps) => {
   return (
     <Stack gap="lg">
       {/* Watermark Type Selection */}
       <WatermarkTypeSettings
         watermarkType={parameters.watermarkType}
-        onWatermarkTypeChange={(type) => onParameterChange("watermarkType", type)}
+        onWatermarkTypeChange={(type) =>
+          onParameterChange("watermarkType", type)
+        }
         disabled={disabled}
       />
 
diff --git a/frontend/src/core/components/tools/addWatermark/WatermarkFormatting.tsx b/frontend/src/core/components/tools/addWatermark/WatermarkFormatting.tsx
index 1e9b224e84..add0612800 100644
--- a/frontend/src/core/components/tools/addWatermark/WatermarkFormatting.tsx
+++ b/frontend/src/core/components/tools/addWatermark/WatermarkFormatting.tsx
@@ -5,21 +5,30 @@ import NumberInputWithUnit from "@app/components/tools/shared/NumberInputWithUni
 
 interface WatermarkFormattingProps {
   parameters: AddWatermarkParameters;
-  onParameterChange: <K extends keyof AddWatermarkParameters>(key: K, value: AddWatermarkParameters[K]) => void;
+  onParameterChange: <K extends keyof AddWatermarkParameters>(
+    key: K,
+    value: AddWatermarkParameters[K],
+  ) => void;
   disabled?: boolean;
 }
 
-const WatermarkFormatting = ({ parameters, onParameterChange, disabled = false }: WatermarkFormattingProps) => {
+const WatermarkFormatting = ({
+  parameters,
+  onParameterChange,
+  disabled = false,
+}: WatermarkFormattingProps) => {
   const { t } = useTranslation();
 
   return (
     <Stack gap="md">
       {/* Size - single row */}
       <NumberInputWithUnit
-        label={t('watermark.settings.size', 'Size')}
+        label={t("watermark.settings.size", "Size")}
         value={parameters.fontSize}
-        onChange={(value) => onParameterChange('fontSize', typeof value === 'number' ? value : 12)}
-        unit={parameters.watermarkType === 'text' ? 'pt' : 'px'}
+        onChange={(value) =>
+          onParameterChange("fontSize", typeof value === "number" ? value : 12)
+        }
+        unit={parameters.watermarkType === "text" ? "pt" : "px"}
         min={1}
         disabled={disabled}
       />
@@ -27,18 +36,22 @@ const WatermarkFormatting = ({ parameters, onParameterChange, disabled = false }
       {/* Position & Appearance - 2 per row */}
       <Group grow align="flex-start">
         <NumberInputWithUnit
-          label={t('watermark.settings.rotation', 'Rotation')}
+          label={t("watermark.settings.rotation", "Rotation")}
           value={parameters.rotation}
-          onChange={(value) => onParameterChange('rotation', typeof value === 'number' ? value : 0)}
+          onChange={(value) =>
+            onParameterChange("rotation", typeof value === "number" ? value : 0)
+          }
           unit="°"
           min={-360}
           max={360}
           disabled={disabled}
         />
         <NumberInputWithUnit
-          label={t('watermark.settings.opacity', 'Opacity')}
+          label={t("watermark.settings.opacity", "Opacity")}
           value={parameters.opacity}
-          onChange={(value) => onParameterChange('opacity', typeof value === 'number' ? value : 50)}
+          onChange={(value) =>
+            onParameterChange("opacity", typeof value === "number" ? value : 50)
+          }
           unit="%"
           min={0}
           max={100}
@@ -49,18 +62,31 @@ const WatermarkFormatting = ({ parameters, onParameterChange, disabled = false }
       {/* Spacing - 2 per row */}
       <Group grow align="flex-start">
         <NumberInputWithUnit
-          label={t('watermark.settings.spacing.horizontal', 'Horizontal Spacing')}
+          label={t(
+            "watermark.settings.spacing.horizontal",
+            "Horizontal Spacing",
+          )}
           value={parameters.widthSpacer}
-          onChange={(value) => onParameterChange('widthSpacer', typeof value === 'number' ? value : 50)}
+          onChange={(value) =>
+            onParameterChange(
+              "widthSpacer",
+              typeof value === "number" ? value : 50,
+            )
+          }
           unit="px"
           min={0}
           max={200}
           disabled={disabled}
         />
         <NumberInputWithUnit
-          label={t('watermark.settings.spacing.vertical', 'Vertical Spacing')}
+          label={t("watermark.settings.spacing.vertical", "Vertical Spacing")}
           value={parameters.heightSpacer}
-          onChange={(value) => onParameterChange('heightSpacer', typeof value === 'number' ? value : 50)}
+          onChange={(value) =>
+            onParameterChange(
+              "heightSpacer",
+              typeof value === "number" ? value : 50,
+            )
+          }
           unit="px"
           min={0}
           max={200}
@@ -70,9 +96,14 @@ const WatermarkFormatting = ({ parameters, onParameterChange, disabled = false }
 
       {/* Advanced Options */}
       <Checkbox
-        label={t('watermark.settings.convertToImage', 'Flatten PDF pages to images')}
+        label={t(
+          "watermark.settings.convertToImage",
+          "Flatten PDF pages to images",
+        )}
         checked={parameters.convertPDFToImage}
-        onChange={(event) => onParameterChange('convertPDFToImage', event.currentTarget.checked)}
+        onChange={(event) =>
+          onParameterChange("convertPDFToImage", event.currentTarget.checked)
+        }
         disabled={disabled}
       />
     </Stack>
diff --git a/frontend/src/core/components/tools/addWatermark/WatermarkImageFile.tsx b/frontend/src/core/components/tools/addWatermark/WatermarkImageFile.tsx
index 39f614845a..12a3021222 100644
--- a/frontend/src/core/components/tools/addWatermark/WatermarkImageFile.tsx
+++ b/frontend/src/core/components/tools/addWatermark/WatermarkImageFile.tsx
@@ -5,21 +5,30 @@ import FileUploadButton from "@app/components/shared/FileUploadButton";
 
 interface WatermarkImageFileProps {
   parameters: AddWatermarkParameters;
-  onParameterChange: <K extends keyof AddWatermarkParameters>(key: K, value: AddWatermarkParameters[K]) => void;
+  onParameterChange: <K extends keyof AddWatermarkParameters>(
+    key: K,
+    value: AddWatermarkParameters[K],
+  ) => void;
   disabled?: boolean;
 }
 
-const WatermarkImageFile = ({ parameters, onParameterChange, disabled = false }: WatermarkImageFileProps) => {
+const WatermarkImageFile = ({
+  parameters,
+  onParameterChange,
+  disabled = false,
+}: WatermarkImageFileProps) => {
   const { t } = useTranslation();
 
   return (
     <Stack gap="sm">
       <FileUploadButton
         file={parameters.watermarkImage}
-        onChange={(file) => onParameterChange('watermarkImage', file || undefined)}
+        onChange={(file) =>
+          onParameterChange("watermarkImage", file || undefined)
+        }
         accept="image/*"
         disabled={disabled}
-        placeholder={t('watermark.settings.image.choose', 'Choose Image')}
+        placeholder={t("watermark.settings.image.choose", "Choose Image")}
       />
     </Stack>
   );
diff --git a/frontend/src/core/components/tools/addWatermark/WatermarkStyleSettings.tsx b/frontend/src/core/components/tools/addWatermark/WatermarkStyleSettings.tsx
index 89a74076d0..85ecce3917 100644
--- a/frontend/src/core/components/tools/addWatermark/WatermarkStyleSettings.tsx
+++ b/frontend/src/core/components/tools/addWatermark/WatermarkStyleSettings.tsx
@@ -4,30 +4,55 @@ import { AddWatermarkParameters } from "@app/hooks/tools/addWatermark/useAddWate
 
 interface WatermarkStyleSettingsProps {
   parameters: AddWatermarkParameters;
-  onParameterChange: <K extends keyof AddWatermarkParameters>(key: K, value: AddWatermarkParameters[K]) => void;
+  onParameterChange: <K extends keyof AddWatermarkParameters>(
+    key: K,
+    value: AddWatermarkParameters[K],
+  ) => void;
   disabled?: boolean;
 }
 
-const WatermarkStyleSettings = ({ parameters, onParameterChange, disabled = false }: WatermarkStyleSettingsProps) => {
+const WatermarkStyleSettings = ({
+  parameters,
+  onParameterChange,
+  disabled = false,
+}: WatermarkStyleSettingsProps) => {
   const { t } = useTranslation();
 
   return (
     <Stack gap="md">
       {/* Appearance Settings */}
       <Stack gap="sm">
-        <Text size="sm" fw={500}>{t('watermark.settings.rotation', 'Rotation (degrees)')}</Text>
+        <Text size="sm" fw={500}>
+          {t("watermark.settings.rotation", "Rotation (degrees)")}
+        </Text>
         <NumberInput
           value={parameters.rotation}
-          onChange={(value) => onParameterChange('rotation', typeof value === 'number' ? value : (parseInt(value as string, 10) || 0))}
+          onChange={(value) =>
+            onParameterChange(
+              "rotation",
+              typeof value === "number"
+                ? value
+                : parseInt(value as string, 10) || 0,
+            )
+          }
           min={-360}
           max={360}
           disabled={disabled}
         />
 
-        <Text size="sm" fw={500}>{t('watermark.settings.opacity', 'Opacity (%)')}</Text>
+        <Text size="sm" fw={500}>
+          {t("watermark.settings.opacity", "Opacity (%)")}
+        </Text>
         <NumberInput
           value={parameters.opacity}
-          onChange={(value) => onParameterChange('opacity', typeof value === 'number' ? value : (parseInt(value as string, 10) || 50))}
+          onChange={(value) =>
+            onParameterChange(
+              "opacity",
+              typeof value === "number"
+                ? value
+                : parseInt(value as string, 10) || 50,
+            )
+          }
           min={0}
           max={100}
           disabled={disabled}
@@ -36,25 +61,42 @@ const WatermarkStyleSettings = ({ parameters, onParameterChange, disabled = fals
 
       {/* Spacing Settings */}
       <Stack gap="sm">
-        <Text size="sm" fw={500}>{t('watermark.settings.spacing.width', 'Width Spacing')}</Text>
+        <Text size="sm" fw={500}>
+          {t("watermark.settings.spacing.width", "Width Spacing")}
+        </Text>
         <NumberInput
           value={parameters.widthSpacer}
-          onChange={(value) => onParameterChange('widthSpacer', typeof value === 'number' ? value : (parseInt(value as string, 10) || 50))}
+          onChange={(value) =>
+            onParameterChange(
+              "widthSpacer",
+              typeof value === "number"
+                ? value
+                : parseInt(value as string, 10) || 50,
+            )
+          }
           min={0}
           max={200}
           disabled={disabled}
         />
 
-        <Text size="sm" fw={500}>{t('watermark.settings.spacing.height', 'Height Spacing')}</Text>
+        <Text size="sm" fw={500}>
+          {t("watermark.settings.spacing.height", "Height Spacing")}
+        </Text>
         <NumberInput
           value={parameters.heightSpacer}
-          onChange={(value) => onParameterChange('heightSpacer', typeof value === 'number' ? value : (parseInt(value as string, 10) || 50))}
+          onChange={(value) =>
+            onParameterChange(
+              "heightSpacer",
+              typeof value === "number"
+                ? value
+                : parseInt(value as string, 10) || 50,
+            )
+          }
           min={0}
           max={200}
           disabled={disabled}
         />
       </Stack>
-
     </Stack>
   );
 };
diff --git a/frontend/src/core/components/tools/addWatermark/WatermarkTextStyle.tsx b/frontend/src/core/components/tools/addWatermark/WatermarkTextStyle.tsx
index e0aa22a7b3..9e83633400 100644
--- a/frontend/src/core/components/tools/addWatermark/WatermarkTextStyle.tsx
+++ b/frontend/src/core/components/tools/addWatermark/WatermarkTextStyle.tsx
@@ -6,14 +6,20 @@ import { Z_INDEX_AUTOMATE_DROPDOWN } from "@app/styles/zIndex";
 
 interface WatermarkTextStyleProps {
   parameters: AddWatermarkParameters;
-  onParameterChange: <K extends keyof AddWatermarkParameters>(key: K, value: AddWatermarkParameters[K]) => void;
+  onParameterChange: <K extends keyof AddWatermarkParameters>(
+    key: K,
+    value: AddWatermarkParameters[K],
+  ) => void;
   disabled?: boolean;
 }
 
-const WatermarkTextStyle = ({ parameters, onParameterChange, disabled = false }: WatermarkTextStyleProps) => {
+const WatermarkTextStyle = ({
+  parameters,
+  onParameterChange,
+  disabled = false,
+}: WatermarkTextStyleProps) => {
   const { t } = useTranslation();
 
-
   return (
     <Stack gap="sm">
       <Stack gap="xs">
@@ -25,7 +31,10 @@ const WatermarkTextStyle = ({ parameters, onParameterChange, disabled = false }:
           onChange={(value) => onParameterChange("customColor", value)}
           disabled={disabled}
           format="hex"
-          popoverProps={{ withinPortal: true, zIndex: Z_INDEX_AUTOMATE_DROPDOWN }}
+          popoverProps={{
+            withinPortal: true,
+            zIndex: Z_INDEX_AUTOMATE_DROPDOWN,
+          }}
         />
       </Stack>
 
@@ -38,7 +47,10 @@ const WatermarkTextStyle = ({ parameters, onParameterChange, disabled = false }:
           onChange={(value) => value && onParameterChange("alphabet", value)}
           data={alphabetOptions}
           disabled={disabled}
-          comboboxProps={{ withinPortal: true, zIndex: Z_INDEX_AUTOMATE_DROPDOWN }}
+          comboboxProps={{
+            withinPortal: true,
+            zIndex: Z_INDEX_AUTOMATE_DROPDOWN,
+          }}
         />
       </Stack>
     </Stack>
diff --git a/frontend/src/core/components/tools/addWatermark/WatermarkTypeSettings.tsx b/frontend/src/core/components/tools/addWatermark/WatermarkTypeSettings.tsx
index 19bb42d836..0f6f1a727f 100644
--- a/frontend/src/core/components/tools/addWatermark/WatermarkTypeSettings.tsx
+++ b/frontend/src/core/components/tools/addWatermark/WatermarkTypeSettings.tsx
@@ -2,12 +2,16 @@ import { useTranslation } from "react-i18next";
 import ButtonSelector from "@app/components/shared/ButtonSelector";
 
 interface WatermarkTypeSettingsProps {
-  watermarkType?: 'text' | 'image';
-  onWatermarkTypeChange: (type: 'text' | 'image') => void;
+  watermarkType?: "text" | "image";
+  onWatermarkTypeChange: (type: "text" | "image") => void;
   disabled?: boolean;
 }
 
-const WatermarkTypeSettings = ({ watermarkType, onWatermarkTypeChange, disabled = false }: WatermarkTypeSettingsProps) => {
+const WatermarkTypeSettings = ({
+  watermarkType,
+  onWatermarkTypeChange,
+  disabled = false,
+}: WatermarkTypeSettingsProps) => {
   const { t } = useTranslation();
 
   return (
@@ -16,12 +20,12 @@ const WatermarkTypeSettings = ({ watermarkType, onWatermarkTypeChange, disabled
       onChange={onWatermarkTypeChange}
       options={[
         {
-          value: 'text',
-          label: t('watermark.watermarkType.text', 'Text'),
+          value: "text",
+          label: t("watermark.watermarkType.text", "Text"),
         },
         {
-          value: 'image',
-          label: t('watermark.watermarkType.image', 'Image'),
+          value: "image",
+          label: t("watermark.watermarkType.image", "Image"),
         },
       ]}
       disabled={disabled}
diff --git a/frontend/src/core/components/tools/addWatermark/WatermarkWording.tsx b/frontend/src/core/components/tools/addWatermark/WatermarkWording.tsx
index eb3655c860..b5a8bce8e8 100644
--- a/frontend/src/core/components/tools/addWatermark/WatermarkWording.tsx
+++ b/frontend/src/core/components/tools/addWatermark/WatermarkWording.tsx
@@ -6,23 +6,33 @@ import { removeEmojis } from "@app/utils/textUtils";
 
 interface WatermarkWordingProps {
   parameters: AddWatermarkParameters;
-  onParameterChange: <K extends keyof AddWatermarkParameters>(key: K, value: AddWatermarkParameters[K]) => void;
+  onParameterChange: <K extends keyof AddWatermarkParameters>(
+    key: K,
+    value: AddWatermarkParameters[K],
+  ) => void;
   disabled?: boolean;
 }
 
-const WatermarkWording = ({ parameters, onParameterChange, disabled = false }: WatermarkWordingProps) => {
+const WatermarkWording = ({
+  parameters,
+  onParameterChange,
+  disabled = false,
+}: WatermarkWordingProps) => {
   const { t } = useTranslation();
 
   const handleTextChange = (e: React.ChangeEvent<HTMLInputElement>) => {
     const value = e.target.value;
     const filteredValue = removeEmojis(value);
-    onParameterChange('watermarkText', filteredValue);
+    onParameterChange("watermarkText", filteredValue);
   };
 
   return (
     <Stack gap="sm">
       <TextInput
-        placeholder={t('watermark.settings.text.placeholder', 'Enter watermark text')}
+        placeholder={t(
+          "watermark.settings.text.placeholder",
+          "Enter watermark text",
+        )}
         value={parameters.watermarkText}
         onChange={handleTextChange}
         disabled={disabled}
diff --git a/frontend/src/core/components/tools/adjustContrast/AdjustContrastBasicSettings.tsx b/frontend/src/core/components/tools/adjustContrast/AdjustContrastBasicSettings.tsx
index 061eac659c..3d196508ca 100644
--- a/frontend/src/core/components/tools/adjustContrast/AdjustContrastBasicSettings.tsx
+++ b/frontend/src/core/components/tools/adjustContrast/AdjustContrastBasicSettings.tsx
@@ -1,24 +1,44 @@
-import { Stack } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { AdjustContrastParameters } from '@app/hooks/tools/adjustContrast/useAdjustContrastParameters';
-import SliderWithInput from '@app/components/shared/sliderWithInput/SliderWithInput';
+import { Stack } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import { AdjustContrastParameters } from "@app/hooks/tools/adjustContrast/useAdjustContrastParameters";
+import SliderWithInput from "@app/components/shared/sliderWithInput/SliderWithInput";
 
 interface Props {
   parameters: AdjustContrastParameters;
-  onParameterChange: <K extends keyof AdjustContrastParameters>(key: K, value: AdjustContrastParameters[K]) => void;
+  onParameterChange: <K extends keyof AdjustContrastParameters>(
+    key: K,
+    value: AdjustContrastParameters[K],
+  ) => void;
   disabled?: boolean;
 }
 
-export default function AdjustContrastBasicSettings({ parameters, onParameterChange, disabled }: Props) {
+export default function AdjustContrastBasicSettings({
+  parameters,
+  onParameterChange,
+  disabled,
+}: Props) {
   const { t } = useTranslation();
 
   return (
     <Stack gap="md">
-      <SliderWithInput label={t('adjustContrast.contrast', 'Contrast')} value={parameters.contrast} onChange={(v) => onParameterChange('contrast', v as any)} disabled={disabled} />
-      <SliderWithInput label={t('adjustContrast.brightness', 'Brightness')} value={parameters.brightness} onChange={(v) => onParameterChange('brightness', v as any)} disabled={disabled} />
-      <SliderWithInput label={t('adjustContrast.saturation', 'Saturation')} value={parameters.saturation} onChange={(v) => onParameterChange('saturation', v as any)} disabled={disabled} />
+      <SliderWithInput
+        label={t("adjustContrast.contrast", "Contrast")}
+        value={parameters.contrast}
+        onChange={(v) => onParameterChange("contrast", v as any)}
+        disabled={disabled}
+      />
+      <SliderWithInput
+        label={t("adjustContrast.brightness", "Brightness")}
+        value={parameters.brightness}
+        onChange={(v) => onParameterChange("brightness", v as any)}
+        disabled={disabled}
+      />
+      <SliderWithInput
+        label={t("adjustContrast.saturation", "Saturation")}
+        value={parameters.saturation}
+        onChange={(v) => onParameterChange("saturation", v as any)}
+        disabled={disabled}
+      />
     </Stack>
   );
 }
-
-
diff --git a/frontend/src/core/components/tools/adjustContrast/AdjustContrastColorSettings.tsx b/frontend/src/core/components/tools/adjustContrast/AdjustContrastColorSettings.tsx
index f713ca24bd..6c1b927591 100644
--- a/frontend/src/core/components/tools/adjustContrast/AdjustContrastColorSettings.tsx
+++ b/frontend/src/core/components/tools/adjustContrast/AdjustContrastColorSettings.tsx
@@ -1,24 +1,44 @@
-import { Stack } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { AdjustContrastParameters } from '@app/hooks/tools/adjustContrast/useAdjustContrastParameters';
-import SliderWithInput from '@app/components/shared/sliderWithInput/SliderWithInput';
+import { Stack } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import { AdjustContrastParameters } from "@app/hooks/tools/adjustContrast/useAdjustContrastParameters";
+import SliderWithInput from "@app/components/shared/sliderWithInput/SliderWithInput";
 
 interface Props {
   parameters: AdjustContrastParameters;
-  onParameterChange: <K extends keyof AdjustContrastParameters>(key: K, value: AdjustContrastParameters[K]) => void;
+  onParameterChange: <K extends keyof AdjustContrastParameters>(
+    key: K,
+    value: AdjustContrastParameters[K],
+  ) => void;
   disabled?: boolean;
 }
 
-export default function AdjustContrastColorSettings({ parameters, onParameterChange, disabled }: Props) {
+export default function AdjustContrastColorSettings({
+  parameters,
+  onParameterChange,
+  disabled,
+}: Props) {
   const { t } = useTranslation();
 
   return (
     <Stack gap="md">
-      <SliderWithInput label={t('adjustContrast.red', 'Red')} value={parameters.red} onChange={(v) => onParameterChange('red', v as any)} disabled={disabled} />
-      <SliderWithInput label={t('adjustContrast.green', 'Green')} value={parameters.green} onChange={(v) => onParameterChange('green', v as any)} disabled={disabled} />
-      <SliderWithInput label={t('adjustContrast.blue', 'Blue')} value={parameters.blue} onChange={(v) => onParameterChange('blue', v as any)} disabled={disabled} />
+      <SliderWithInput
+        label={t("adjustContrast.red", "Red")}
+        value={parameters.red}
+        onChange={(v) => onParameterChange("red", v as any)}
+        disabled={disabled}
+      />
+      <SliderWithInput
+        label={t("adjustContrast.green", "Green")}
+        value={parameters.green}
+        onChange={(v) => onParameterChange("green", v as any)}
+        disabled={disabled}
+      />
+      <SliderWithInput
+        label={t("adjustContrast.blue", "Blue")}
+        value={parameters.blue}
+        onChange={(v) => onParameterChange("blue", v as any)}
+        disabled={disabled}
+      />
     </Stack>
   );
 }
-
-
diff --git a/frontend/src/core/components/tools/adjustContrast/AdjustContrastPreview.tsx b/frontend/src/core/components/tools/adjustContrast/AdjustContrastPreview.tsx
index 3fb42b46c6..ff21b435e7 100644
--- a/frontend/src/core/components/tools/adjustContrast/AdjustContrastPreview.tsx
+++ b/frontend/src/core/components/tools/adjustContrast/AdjustContrastPreview.tsx
@@ -1,10 +1,10 @@
-import { useEffect, useRef, useState } from 'react';
-import { AdjustContrastParameters } from '@app/hooks/tools/adjustContrast/useAdjustContrastParameters';
-import { useThumbnailGeneration } from '@app/hooks/useThumbnailGeneration';
-import ObscuredOverlay from '@app/components/shared/ObscuredOverlay';
-import { Text } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { applyAdjustmentsToCanvas } from '@app/components/tools/adjustContrast/utils';
+import { useEffect, useRef, useState } from "react";
+import { AdjustContrastParameters } from "@app/hooks/tools/adjustContrast/useAdjustContrastParameters";
+import { useThumbnailGeneration } from "@app/hooks/useThumbnailGeneration";
+import ObscuredOverlay from "@app/components/shared/ObscuredOverlay";
+import { Text } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import { applyAdjustmentsToCanvas } from "@app/components/tools/adjustContrast/utils";
 
 interface Props {
   file: File | null;
@@ -21,13 +21,18 @@ export default function AdjustContrastPreview({ file, parameters }: Props) {
   useEffect(() => {
     let active = true;
     const load = async () => {
-      if (!file || file.type !== 'application/pdf') { setThumb(null); return; }
+      if (!file || file.type !== "application/pdf") {
+        setThumb(null);
+        return;
+      }
       const id = `${file.name}:${file.size}:${file.lastModified}:page:1`;
       const tUrl = await requestThumbnail(id, file, 1);
       if (active) setThumb(tUrl || null);
     };
     load();
-    return () => { active = false; };
+    return () => {
+      active = false;
+    };
   }, [file, requestThumbnail]);
 
   useEffect(() => {
@@ -35,7 +40,7 @@ export default function AdjustContrastPreview({ file, parameters }: Props) {
     const render = async () => {
       if (!thumb || !canvasRef.current) return;
       const img = new Image();
-      img.crossOrigin = 'anonymous';
+      img.crossOrigin = "anonymous";
       img.src = thumb;
       await new Promise<void>((resolve, reject) => {
         img.onload = () => resolve();
@@ -43,10 +48,10 @@ export default function AdjustContrastPreview({ file, parameters }: Props) {
       });
 
       // Draw thumbnail to a source canvas
-      const src = document.createElement('canvas');
+      const src = document.createElement("canvas");
       src.width = img.naturalWidth;
       src.height = img.naturalHeight;
-      const sctx = src.getContext('2d');
+      const sctx = src.getContext("2d");
       if (!sctx) return;
       sctx.drawImage(img, 0, 0);
 
@@ -57,7 +62,7 @@ export default function AdjustContrastPreview({ file, parameters }: Props) {
       const display = canvasRef.current;
       display.width = adjusted.width;
       display.height = adjusted.height;
-      const dctx = display.getContext('2d');
+      const dctx = display.getContext("2d");
       if (!dctx) return;
       dctx.clearRect(0, 0, display.width, display.height);
       dctx.drawImage(adjusted, 0, 0);
@@ -70,24 +75,48 @@ export default function AdjustContrastPreview({ file, parameters }: Props) {
 
   return (
     <div>
-      <div style={{ display: 'flex', alignItems: 'center', gap: 8, marginBottom: 6 }}>
-        <div style={{ flex: 1, height: 1, background: 'var(--border-color)' }} />
-        <div style={{ fontSize: 12, color: 'var(--text-color-muted)' }}>{t('common.preview', 'Preview')}</div>
-        <div style={{ flex: 1, height: 1, background: 'var(--border-color)' }} />
+      <div
+        style={{
+          display: "flex",
+          alignItems: "center",
+          gap: 8,
+          marginBottom: 6,
+        }}
+      >
+        <div
+          style={{ flex: 1, height: 1, background: "var(--border-color)" }}
+        />
+        <div style={{ fontSize: 12, color: "var(--text-color-muted)" }}>
+          {t("common.preview", "Preview")}
+        </div>
+        <div
+          style={{ flex: 1, height: 1, background: "var(--border-color)" }}
+        />
       </div>
       <ObscuredOverlay
         obscured={!thumb}
-        overlayMessage={<Text size="sm" c="white" fw={600}>{t('adjustContrast.noPreview', 'Select a PDF to preview')}</Text>}
+        overlayMessage={
+          <Text size="sm" c="white" fw={600}>
+            {t("adjustContrast.noPreview", "Select a PDF to preview")}
+          </Text>
+        }
         borderRadius={6}
       >
-        <div ref={containerRef} style={{ aspectRatio: '8.5/11', width: '100%', border: '1px solid var(--border-color)', borderRadius: 8, overflow: 'hidden' }}>
+        <div
+          ref={containerRef}
+          style={{
+            aspectRatio: "8.5/11",
+            width: "100%",
+            border: "1px solid var(--border-color)",
+            borderRadius: 8,
+            overflow: "hidden",
+          }}
+        >
           {thumb && (
-            <canvas ref={canvasRef} style={{ width: '100%', height: '100%' }} />
+            <canvas ref={canvasRef} style={{ width: "100%", height: "100%" }} />
           )}
         </div>
       </ObscuredOverlay>
     </div>
   );
 }
-
-
diff --git a/frontend/src/core/components/tools/adjustContrast/AdjustContrastSingleStepSettings.tsx b/frontend/src/core/components/tools/adjustContrast/AdjustContrastSingleStepSettings.tsx
index 5fc9fe10f1..dc93e199df 100644
--- a/frontend/src/core/components/tools/adjustContrast/AdjustContrastSingleStepSettings.tsx
+++ b/frontend/src/core/components/tools/adjustContrast/AdjustContrastSingleStepSettings.tsx
@@ -1,16 +1,23 @@
-import { Stack } from '@mantine/core';
-import { AdjustContrastParameters } from '@app/hooks/tools/adjustContrast/useAdjustContrastParameters';
-import AdjustContrastBasicSettings from '@app/components/tools/adjustContrast/AdjustContrastBasicSettings';
-import AdjustContrastColorSettings from '@app/components/tools/adjustContrast/AdjustContrastColorSettings';
+import { Stack } from "@mantine/core";
+import { AdjustContrastParameters } from "@app/hooks/tools/adjustContrast/useAdjustContrastParameters";
+import AdjustContrastBasicSettings from "@app/components/tools/adjustContrast/AdjustContrastBasicSettings";
+import AdjustContrastColorSettings from "@app/components/tools/adjustContrast/AdjustContrastColorSettings";
 
 interface Props {
   parameters: AdjustContrastParameters;
-  onParameterChange: <K extends keyof AdjustContrastParameters>(key: K, value: AdjustContrastParameters[K]) => void;
+  onParameterChange: <K extends keyof AdjustContrastParameters>(
+    key: K,
+    value: AdjustContrastParameters[K],
+  ) => void;
   disabled?: boolean;
 }
 
 // Single-step settings used by Automate to configure Adjust Contrast in one panel
-export default function AdjustContrastSingleStepSettings({ parameters, onParameterChange, disabled }: Props) {
+export default function AdjustContrastSingleStepSettings({
+  parameters,
+  onParameterChange,
+  disabled,
+}: Props) {
   return (
     <Stack gap="lg">
       <AdjustContrastBasicSettings
@@ -26,5 +33,3 @@ export default function AdjustContrastSingleStepSettings({ parameters, onParamet
     </Stack>
   );
 }
-
-
diff --git a/frontend/src/core/components/tools/adjustContrast/utils.ts b/frontend/src/core/components/tools/adjustContrast/utils.ts
index 939c05acc8..a7774f53c9 100644
--- a/frontend/src/core/components/tools/adjustContrast/utils.ts
+++ b/frontend/src/core/components/tools/adjustContrast/utils.ts
@@ -1,10 +1,13 @@
-import { AdjustContrastParameters } from '@app/hooks/tools/adjustContrast/useAdjustContrastParameters';
+import { AdjustContrastParameters } from "@app/hooks/tools/adjustContrast/useAdjustContrastParameters";
 
-export function applyAdjustmentsToCanvas(src: HTMLCanvasElement, params: AdjustContrastParameters): HTMLCanvasElement {
-  const out = document.createElement('canvas');
+export function applyAdjustmentsToCanvas(
+  src: HTMLCanvasElement,
+  params: AdjustContrastParameters,
+): HTMLCanvasElement {
+  const out = document.createElement("canvas");
   out.width = src.width;
   out.height = src.height;
-  const ctx = out.getContext('2d');
+  const ctx = out.getContext("2d");
   if (!ctx) return src;
   ctx.drawImage(src, 0, 0);
 
@@ -36,36 +39,48 @@ export function applyAdjustmentsToCanvas(src: HTMLCanvasElement, params: AdjustC
     b = clamp(b * brightness);
 
     // Saturation via HSL
-    const rn = r / 255, gn = g / 255, bn = b / 255;
-    const max = Math.max(rn, gn, bn); const min = Math.min(rn, gn, bn);
-    let h = 0, s = 0;
+    const rn = r / 255,
+      gn = g / 255,
+      bn = b / 255;
+    const max = Math.max(rn, gn, bn);
+    const min = Math.min(rn, gn, bn);
+    let h = 0,
+      s = 0;
     const l = (max + min) / 2;
     if (max !== min) {
       const d = max - min;
       s = l > 0.5 ? d / (2 - max - min) : d / (max + min);
       switch (max) {
-        case rn: h = (gn - bn) / d + (gn < bn ? 6 : 0); break;
-        case gn: h = (bn - rn) / d + 2; break;
-        default: h = (rn - gn) / d + 4; break;
+        case rn:
+          h = (gn - bn) / d + (gn < bn ? 6 : 0);
+          break;
+        case gn:
+          h = (bn - rn) / d + 2;
+          break;
+        default:
+          h = (rn - gn) / d + 4;
+          break;
       }
       h /= 6;
     }
     s = Math.min(1, Math.max(0, s * saturation));
     const hue2rgb = (p: number, q: number, t: number) => {
-      if (t < 0) t += 1; if (t > 1) t -= 1;
-      if (t < 1/6) return p + (q - p) * 6 * t;
-      if (t < 1/2) return q;
-      if (t < 2/3) return p + (q - p) * (2/3 - t) * 6;
+      if (t < 0) t += 1;
+      if (t > 1) t -= 1;
+      if (t < 1 / 6) return p + (q - p) * 6 * t;
+      if (t < 1 / 2) return q;
+      if (t < 2 / 3) return p + (q - p) * (2 / 3 - t) * 6;
       return p;
     };
     let r2: number, g2: number, b2: number;
-    if (s === 0) { r2 = g2 = b2 = l; }
-    else {
+    if (s === 0) {
+      r2 = g2 = b2 = l;
+    } else {
       const q = l < 0.5 ? l * (1 + s) : l + s - l * s;
       const p = 2 * l - q;
-      r2 = hue2rgb(p, q, h + 1/3);
+      r2 = hue2rgb(p, q, h + 1 / 3);
       g2 = hue2rgb(p, q, h);
-      b2 = hue2rgb(p, q, h - 1/3);
+      b2 = hue2rgb(p, q, h - 1 / 3);
     }
     data[i] = clamp(Math.round(r2 * 255));
     data[i + 1] = clamp(Math.round(g2 * 255));
@@ -75,5 +90,3 @@ export function applyAdjustmentsToCanvas(src: HTMLCanvasElement, params: AdjustC
   ctx.putImageData(imageData, 0, 0);
   return out;
 }
-
-
diff --git a/frontend/src/core/components/tools/adjustPageScale/AdjustPageScaleSettings.test.tsx b/frontend/src/core/components/tools/adjustPageScale/AdjustPageScaleSettings.test.tsx
index c5e5fc9336..6f11446ed1 100644
--- a/frontend/src/core/components/tools/adjustPageScale/AdjustPageScaleSettings.test.tsx
+++ b/frontend/src/core/components/tools/adjustPageScale/AdjustPageScaleSettings.test.tsx
@@ -1,13 +1,18 @@
-import { describe, expect, test, vi, beforeEach } from 'vitest';
-import { render, screen } from '@testing-library/react';
-import { MantineProvider } from '@mantine/core';
-import AdjustPageScaleSettings from '@app/components/tools/adjustPageScale/AdjustPageScaleSettings';
-import { AdjustPageScaleParameters, PageSize } from '@app/hooks/tools/adjustPageScale/useAdjustPageScaleParameters';
+import { describe, expect, test, vi, beforeEach } from "vitest";
+import { render, screen } from "@testing-library/react";
+import { MantineProvider } from "@mantine/core";
+import AdjustPageScaleSettings from "@app/components/tools/adjustPageScale/AdjustPageScaleSettings";
+import {
+  AdjustPageScaleParameters,
+  PageSize,
+} from "@app/hooks/tools/adjustPageScale/useAdjustPageScaleParameters";
 
 // Mock useTranslation with predictable return values
-const mockT = vi.fn((key: string, fallback?: string) => fallback || `mock-${key}`);
-vi.mock('react-i18next', () => ({
-  useTranslation: () => ({ t: mockT })
+const mockT = vi.fn(
+  (key: string, fallback?: string) => fallback || `mock-${key}`,
+);
+vi.mock("react-i18next", () => ({
+  useTranslation: () => ({ t: mockT }),
 }));
 
 // Wrapper component to provide Mantine context
@@ -15,7 +20,7 @@ const TestWrapper = ({ children }: { children: React.ReactNode }) => (
   <MantineProvider>{children}</MantineProvider>
 );
 
-describe('AdjustPageScaleSettings', () => {
+describe("AdjustPageScaleSettings", () => {
   const defaultParameters: AdjustPageScaleParameters = {
     scaleFactor: 1.0,
     pageSize: PageSize.KEEP,
@@ -27,22 +32,22 @@ describe('AdjustPageScaleSettings', () => {
     vi.clearAllMocks();
   });
 
-  test('should render without crashing', () => {
+  test("should render without crashing", () => {
     render(
       <TestWrapper>
         <AdjustPageScaleSettings
           parameters={defaultParameters}
           onParameterChange={mockOnParameterChange}
         />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
     // Basic render test - component renders without throwing
-    expect(screen.getByText('Scale Factor')).toBeInTheDocument();
-    expect(screen.getByText('Target Page Size')).toBeInTheDocument();
+    expect(screen.getByText("Scale Factor")).toBeInTheDocument();
+    expect(screen.getByText("Target Page Size")).toBeInTheDocument();
   });
 
-  test('should render with custom parameters', () => {
+  test("should render with custom parameters", () => {
     const customParameters: AdjustPageScaleParameters = {
       scaleFactor: 2.5,
       pageSize: PageSize.A4,
@@ -54,11 +59,11 @@ describe('AdjustPageScaleSettings', () => {
           parameters={customParameters}
           onParameterChange={mockOnParameterChange}
         />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
     // Component renders successfully with custom parameters
-    expect(screen.getByText('Scale Factor')).toBeInTheDocument();
-    expect(screen.getByText('Target Page Size')).toBeInTheDocument();
+    expect(screen.getByText("Scale Factor")).toBeInTheDocument();
+    expect(screen.getByText("Target Page Size")).toBeInTheDocument();
   });
 });
diff --git a/frontend/src/core/components/tools/adjustPageScale/AdjustPageScaleSettings.tsx b/frontend/src/core/components/tools/adjustPageScale/AdjustPageScaleSettings.tsx
index 5e2e0aa78e..460988bac1 100644
--- a/frontend/src/core/components/tools/adjustPageScale/AdjustPageScaleSettings.tsx
+++ b/frontend/src/core/components/tools/adjustPageScale/AdjustPageScaleSettings.tsx
@@ -1,36 +1,60 @@
 import { Stack, NumberInput, Select } from "@mantine/core";
 import { useTranslation } from "react-i18next";
-import { AdjustPageScaleParameters, PageSize } from "@app/hooks/tools/adjustPageScale/useAdjustPageScaleParameters";
+import {
+  AdjustPageScaleParameters,
+  PageSize,
+} from "@app/hooks/tools/adjustPageScale/useAdjustPageScaleParameters";
 import { Z_INDEX_AUTOMATE_DROPDOWN } from "@app/styles/zIndex";
 
 interface AdjustPageScaleSettingsProps {
   parameters: AdjustPageScaleParameters;
-  onParameterChange: <K extends keyof AdjustPageScaleParameters>(key: K, value: AdjustPageScaleParameters[K]) => void;
+  onParameterChange: <K extends keyof AdjustPageScaleParameters>(
+    key: K,
+    value: AdjustPageScaleParameters[K],
+  ) => void;
   disabled?: boolean;
 }
 
-const AdjustPageScaleSettings = ({ parameters, onParameterChange, disabled = false }: AdjustPageScaleSettingsProps) => {
+const AdjustPageScaleSettings = ({
+  parameters,
+  onParameterChange,
+  disabled = false,
+}: AdjustPageScaleSettingsProps) => {
   const { t } = useTranslation();
 
   const pageSizeOptions = [
-    { value: PageSize.KEEP, label: t('adjustPageScale.pageSize.keep', 'Keep Original Size') },
-    { value: PageSize.A0, label: 'A0' },
-    { value: PageSize.A1, label: 'A1' },
-    { value: PageSize.A2, label: 'A2' },
-    { value: PageSize.A3, label: 'A3' },
-    { value: PageSize.A4, label: 'A4' },
-    { value: PageSize.A5, label: 'A5' },
-    { value: PageSize.A6, label: 'A6' },
-    { value: PageSize.LETTER, label: t('adjustPageScale.pageSize.letter', 'Letter') },
-    { value: PageSize.LEGAL, label: t('adjustPageScale.pageSize.legal', 'Legal') },
+    {
+      value: PageSize.KEEP,
+      label: t("adjustPageScale.pageSize.keep", "Keep Original Size"),
+    },
+    { value: PageSize.A0, label: "A0" },
+    { value: PageSize.A1, label: "A1" },
+    { value: PageSize.A2, label: "A2" },
+    { value: PageSize.A3, label: "A3" },
+    { value: PageSize.A4, label: "A4" },
+    { value: PageSize.A5, label: "A5" },
+    { value: PageSize.A6, label: "A6" },
+    {
+      value: PageSize.LETTER,
+      label: t("adjustPageScale.pageSize.letter", "Letter"),
+    },
+    {
+      value: PageSize.LEGAL,
+      label: t("adjustPageScale.pageSize.legal", "Legal"),
+    },
   ];
 
   return (
     <Stack gap="md">
       <NumberInput
-        label={t('adjustPageScale.scaleFactor.label', 'Scale Factor')}
+        label={t("adjustPageScale.scaleFactor.label", "Scale Factor")}
         value={parameters.scaleFactor}
-        onChange={(value) => onParameterChange('scaleFactor', typeof value === 'number' ? value : 1.0)}
+        onChange={(value) =>
+          onParameterChange(
+            "scaleFactor",
+            typeof value === "number" ? value : 1.0,
+          )
+        }
         min={0.1}
         max={10.0}
         step={0.1}
@@ -39,16 +63,19 @@ const AdjustPageScaleSettings = ({ parameters, onParameterChange, disabled = fal
       />
 
       <Select
-        label={t('adjustPageScale.pageSize.label', 'Target Page Size')}
+        label={t("adjustPageScale.pageSize.label", "Target Page Size")}
         value={parameters.pageSize}
         onChange={(value) => {
           if (value && Object.values(PageSize).includes(value as PageSize)) {
-            onParameterChange('pageSize', value as PageSize);
+            onParameterChange("pageSize", value as PageSize);
           }
         }}
         data={pageSizeOptions}
         disabled={disabled}
-        comboboxProps={{ withinPortal: true, zIndex: Z_INDEX_AUTOMATE_DROPDOWN }}
+        comboboxProps={{
+          withinPortal: true,
+          zIndex: Z_INDEX_AUTOMATE_DROPDOWN,
+        }}
       />
     </Stack>
   );
diff --git a/frontend/src/core/components/tools/autoRename/AutoRenameSettings.tsx b/frontend/src/core/components/tools/autoRename/AutoRenameSettings.tsx
index f0e268d4ca..b5560eabcc 100644
--- a/frontend/src/core/components/tools/autoRename/AutoRenameSettings.tsx
+++ b/frontend/src/core/components/tools/autoRename/AutoRenameSettings.tsx
@@ -1,21 +1,26 @@
-import React from 'react';
-import { useTranslation } from 'react-i18next';
-import { AutoRenameParameters } from '@app/hooks/tools/autoRename/useAutoRenameParameters';
+import React from "react";
+import { useTranslation } from "react-i18next";
+import { AutoRenameParameters } from "@app/hooks/tools/autoRename/useAutoRenameParameters";
 
 interface AutoRenameSettingsProps {
   parameters: AutoRenameParameters;
-  onParameterChange: <K extends keyof AutoRenameParameters>(parameter: K, value: AutoRenameParameters[K]) => void;
+  onParameterChange: <K extends keyof AutoRenameParameters>(
+    parameter: K,
+    value: AutoRenameParameters[K],
+  ) => void;
   disabled?: boolean;
 }
 
-const AutoRenameSettings: React.FC<AutoRenameSettingsProps> = (
-  ) => {
+const AutoRenameSettings: React.FC<AutoRenameSettingsProps> = () => {
   const { t } = useTranslation();
 
   return (
     <div className="auto-rename-settings">
       <p className="text-muted">
-        {t('autoRename.description', 'This tool will automatically rename PDF files based on their content. It analyzes the document to find the most suitable title from the text.')}
+        {t(
+          "autoRename.description",
+          "This tool will automatically rename PDF files based on their content. It analyzes the document to find the most suitable title from the text.",
+        )}
       </p>
     </div>
   );
diff --git a/frontend/src/core/components/tools/automate/AutomationCreation.tsx b/frontend/src/core/components/tools/automate/AutomationCreation.tsx
index 30c839e55f..f39c30036f 100644
--- a/frontend/src/core/components/tools/automate/AutomationCreation.tsx
+++ b/frontend/src/core/components/tools/automate/AutomationCreation.tsx
@@ -1,5 +1,5 @@
-import { useState } from 'react';
-import { useTranslation } from 'react-i18next';
+import { useState } from "react";
+import { useTranslation } from "react-i18next";
 import {
   Button,
   Text,
@@ -8,19 +8,22 @@ import {
   TextInput,
   Textarea,
   Divider,
-  Modal
-} from '@mantine/core';
-import { Z_INDEX_AUTOMATE_MODAL } from '@app/styles/zIndex';
-import CheckIcon from '@mui/icons-material/Check';
-import DownloadIcon from '@mui/icons-material/Download';
-import { ToolRegistry } from '@app/data/toolsTaxonomy';
-import ToolConfigurationModal from '@app/components/tools/automate/ToolConfigurationModal';
-import ToolList from '@app/components/tools/automate/ToolList';
-import IconSelector from '@app/components/tools/automate/IconSelector';
-import { AutomationConfig, AutomationMode, AutomationTool } from '@app/types/automation';
-import { useAutomationForm } from '@app/hooks/tools/automate/useAutomationForm';
-import { downloadFolderScanningConfig } from '@app/utils/automationConverter';
-
+  Modal,
+} from "@mantine/core";
+import { Z_INDEX_AUTOMATE_MODAL } from "@app/styles/zIndex";
+import CheckIcon from "@mui/icons-material/Check";
+import DownloadIcon from "@mui/icons-material/Download";
+import { ToolRegistry } from "@app/data/toolsTaxonomy";
+import ToolConfigurationModal from "@app/components/tools/automate/ToolConfigurationModal";
+import ToolList from "@app/components/tools/automate/ToolList";
+import IconSelector from "@app/components/tools/automate/IconSelector";
+import {
+  AutomationConfig,
+  AutomationMode,
+  AutomationTool,
+} from "@app/types/automation";
+import { useAutomationForm } from "@app/hooks/tools/automate/useAutomationForm";
+import { downloadFolderScanningConfig } from "@app/utils/automationConverter";
 
 interface AutomationCreationProps {
   mode: AutomationMode;
@@ -30,7 +33,13 @@ interface AutomationCreationProps {
   toolRegistry: Partial<ToolRegistry>;
 }
 
-export default function AutomationCreation({ mode, existingAutomation, onBack, onComplete, toolRegistry }: AutomationCreationProps) {
+export default function AutomationCreation({
+  mode,
+  existingAutomation,
+  onBack,
+  onComplete,
+  toolRegistry,
+}: AutomationCreationProps) {
   const { t } = useTranslation();
 
   const {
@@ -45,14 +54,13 @@ export default function AutomationCreation({ mode, existingAutomation, onBack, o
     updateTool,
     canSaveAutomation,
     getToolName,
-    getToolDefaultParameters
+    getToolDefaultParameters,
   } = useAutomationForm({ mode, existingAutomation, toolRegistry });
 
   const [configModalOpen, setConfigModalOpen] = useState(false);
   const [configuraingToolIndex, setConfiguringToolIndex] = useState(-1);
   const [unsavedWarningOpen, setUnsavedWarningOpen] = useState(false);
 
-
   const configureTool = (index: number) => {
     setConfiguringToolIndex(index);
     setConfigModalOpen(true);
@@ -62,7 +70,7 @@ export default function AutomationCreation({ mode, existingAutomation, onBack, o
     if (configuraingToolIndex >= 0) {
       updateTool(configuraingToolIndex, {
         configured: true,
-        parameters
+        parameters,
       });
     }
     setConfigModalOpen(false);
@@ -77,10 +85,10 @@ export default function AutomationCreation({ mode, existingAutomation, onBack, o
   const handleToolAdd = () => {
     const newTool: AutomationTool = {
       id: `tool-${Date.now()}`,
-      operation: '',
-      name: t('automate.creation.tools.selectTool', 'Select a tool...'),
+      operation: "",
+      name: t("automate.creation.tools.selectTool", "Select a tool..."),
       configured: false,
-      parameters: {}
+      parameters: {},
     };
     updateTool(selectedTools.length, newTool);
   };
@@ -101,14 +109,15 @@ export default function AutomationCreation({ mode, existingAutomation, onBack, o
       name: automationName.trim(),
       description: automationDescription.trim(),
       icon: automationIcon,
-      operations: selectedTools.map(tool => ({
+      operations: selectedTools.map((tool) => ({
         operation: tool.operation,
-        parameters: tool.parameters || {}
-      }))
+        parameters: tool.parameters || {},
+      })),
     };
 
     try {
-      const { automationStorage } = await import('@app/services/automationStorage');
+      const { automationStorage } =
+        await import("@app/services/automationStorage");
       let savedAutomation;
 
       if (mode === AutomationMode.EDIT && existingAutomation) {
@@ -117,35 +126,51 @@ export default function AutomationCreation({ mode, existingAutomation, onBack, o
 
         if (nameChanged) {
           // Name changed - create new automation
-          savedAutomation = await automationStorage.saveAutomation(automationData);
+          savedAutomation =
+            await automationStorage.saveAutomation(automationData);
         } else {
           // Name unchanged - update existing automation
           const updatedAutomation = {
             ...existingAutomation,
             ...automationData,
             id: existingAutomation.id,
-            createdAt: existingAutomation.createdAt
+            createdAt: existingAutomation.createdAt,
           };
-          savedAutomation = await automationStorage.updateAutomation(updatedAutomation);
+          savedAutomation =
+            await automationStorage.updateAutomation(updatedAutomation);
         }
       } else {
         // Create mode - always create new automation
-        savedAutomation = await automationStorage.saveAutomation(automationData);
+        savedAutomation =
+          await automationStorage.saveAutomation(automationData);
       }
 
       onComplete(savedAutomation);
     } catch (error) {
-      console.error('Error saving automation:', error);
+      console.error("Error saving automation:", error);
     }
   };
 
-  const currentConfigTool = configuraingToolIndex >= 0 ? selectedTools[configuraingToolIndex] : null;
+  const currentConfigTool =
+    configuraingToolIndex >= 0 ? selectedTools[configuraingToolIndex] : null;
 
   return (
     <div>
-        <Text size="sm" mb="md" p="md"  style={{borderRadius:'var(--mantine-radius-md)', background: 'var(--color-gray-200)', color: 'var(--mantine-color-text)' }}>
-            {t("automate.creation.intro", "Automations run tools sequentially. To get started, add tools in the order you want them to run.")}
-        </Text>
+      <Text
+        size="sm"
+        mb="md"
+        p="md"
+        style={{
+          borderRadius: "var(--mantine-radius-md)",
+          background: "var(--color-gray-200)",
+          color: "var(--mantine-color-text)",
+        }}
+      >
+        {t(
+          "automate.creation.intro",
+          "Automations run tools sequentially. To get started, add tools in the order you want them to run.",
+        )}
+      </Text>
       <Divider mb="md" />
 
       <Stack gap="md">
@@ -153,17 +178,20 @@ export default function AutomationCreation({ mode, existingAutomation, onBack, o
         <Group gap="xs" align="flex-end">
           <Stack gap="xs" style={{ flex: 1 }}>
             <TextInput
-              placeholder={t('automate.creation.name.placeholder', 'My Automation')}
+              placeholder={t(
+                "automate.creation.name.placeholder",
+                "My Automation",
+              )}
               value={automationName}
               withAsterisk
-              label={t('automate.creation.name.label', 'Automation Name')}
+              label={t("automate.creation.name.label", "Automation Name")}
               onChange={(e) => setAutomationName(e.currentTarget.value)}
               size="sm"
             />
           </Stack>
 
           <IconSelector
-            value={automationIcon || 'SettingsIcon'}
+            value={automationIcon || "SettingsIcon"}
             onChange={setAutomationIcon}
             size="sm"
           />
@@ -171,15 +199,17 @@ export default function AutomationCreation({ mode, existingAutomation, onBack, o
 
         {/* Automation Description */}
         <Textarea
-          placeholder={t('automate.creation.description.placeholder', 'Describe what this automation does...')}
+          placeholder={t(
+            "automate.creation.description.placeholder",
+            "Describe what this automation does...",
+          )}
           value={automationDescription}
-          label={t('automate.creation.description.label', 'Description')}
+          label={t("automate.creation.description.label", "Description")}
           onChange={(e) => setAutomationDescription(e.currentTarget.value)}
           size="sm"
           rows={3}
         />
 
-
         {/* Selected Tools List */}
         {selectedTools.length > 0 && (
           <ToolList
@@ -204,7 +234,7 @@ export default function AutomationCreation({ mode, existingAutomation, onBack, o
             disabled={!canSaveAutomation()}
             fullWidth
           >
-            {t('automate.creation.save', 'Save Automation')}
+            {t("automate.creation.save", "Save Automation")}
           </Button>
 
           <Button
@@ -212,16 +242,17 @@ export default function AutomationCreation({ mode, existingAutomation, onBack, o
             onClick={() => {
               // Create a temporary automation config from current state
               const tempAutomation: AutomationConfig = {
-                id: existingAutomation?.id || 'temp',
+                id: existingAutomation?.id || "temp",
                 name: automationName.trim(),
                 description: automationDescription.trim(),
                 icon: automationIcon,
-                operations: selectedTools.map(tool => ({
+                operations: selectedTools.map((tool) => ({
                   operation: tool.operation,
-                  parameters: tool.parameters || {}
+                  parameters: tool.parameters || {},
                 })),
-                createdAt: existingAutomation?.createdAt || new Date().toISOString(),
-                updatedAt: new Date().toISOString()
+                createdAt:
+                  existingAutomation?.createdAt || new Date().toISOString(),
+                updatedAt: new Date().toISOString(),
               };
               downloadFolderScanningConfig(tempAutomation, toolRegistry);
             }}
@@ -229,7 +260,10 @@ export default function AutomationCreation({ mode, existingAutomation, onBack, o
             variant="light"
             fullWidth
           >
-            {t('automate.creation.exportForFolderScanning', 'Export for Folder Scanning')}
+            {t(
+              "automate.creation.exportForFolderScanning",
+              "Export for Folder Scanning",
+            )}
           </Button>
         </Stack>
       </Stack>
@@ -249,20 +283,23 @@ export default function AutomationCreation({ mode, existingAutomation, onBack, o
       <Modal
         opened={unsavedWarningOpen}
         onClose={handleCancelBack}
-        title={t('automate.creation.unsavedChanges.title', 'Unsaved Changes')}
+        title={t("automate.creation.unsavedChanges.title", "Unsaved Changes")}
         centered
         zIndex={Z_INDEX_AUTOMATE_MODAL}
       >
         <Stack gap="md">
           <Text>
-            {t('automate.creation.unsavedChanges.message', 'You have unsaved changes. Are you sure you want to go back? All changes will be lost.')}
+            {t(
+              "automate.creation.unsavedChanges.message",
+              "You have unsaved changes. Are you sure you want to go back? All changes will be lost.",
+            )}
           </Text>
           <Group gap="md" justify="flex-end">
             <Button variant="outline" onClick={handleCancelBack}>
-              {t('automate.creation.unsavedChanges.cancel', 'Cancel')}
+              {t("automate.creation.unsavedChanges.cancel", "Cancel")}
             </Button>
             <Button color="red" onClick={handleConfirmBack}>
-              {t('automate.creation.unsavedChanges.confirm', 'Go Back')}
+              {t("automate.creation.unsavedChanges.confirm", "Go Back")}
             </Button>
           </Group>
         </Stack>
diff --git a/frontend/src/core/components/tools/automate/AutomationEntry.tsx b/frontend/src/core/components/tools/automate/AutomationEntry.tsx
index 9f40a07aee..e9116951dc 100644
--- a/frontend/src/core/components/tools/automate/AutomationEntry.tsx
+++ b/frontend/src/core/components/tools/automate/AutomationEntry.tsx
@@ -1,14 +1,14 @@
-import React, { useState } from 'react';
-import { useTranslation } from 'react-i18next';
-import { Group, Text, ActionIcon, Menu, Button, Box } from '@mantine/core';
-import MoreVertIcon from '@mui/icons-material/MoreVert';
-import EditIcon from '@mui/icons-material/Edit';
-import DeleteIcon from '@mui/icons-material/Delete';
-import ContentCopyIcon from '@mui/icons-material/ContentCopy';
-import DownloadIcon from '@mui/icons-material/Download';
-import { Tooltip } from '@app/components/shared/Tooltip';
-import { ToolIcon } from '@app/components/shared/ToolIcon';
-import { ToolRegistry } from '@app/data/toolsTaxonomy';
+import React, { useState } from "react";
+import { useTranslation } from "react-i18next";
+import { Group, Text, ActionIcon, Menu, Button, Box } from "@mantine/core";
+import MoreVertIcon from "@mui/icons-material/MoreVert";
+import EditIcon from "@mui/icons-material/Edit";
+import DeleteIcon from "@mui/icons-material/Delete";
+import ContentCopyIcon from "@mui/icons-material/ContentCopy";
+import DownloadIcon from "@mui/icons-material/Download";
+import { Tooltip } from "@app/components/shared/Tooltip";
+import { ToolIcon } from "@app/components/shared/ToolIcon";
+import { ToolRegistry } from "@app/data/toolsTaxonomy";
 import { ToolId } from "@app/types/toolId";
 
 interface AutomationEntryProps {
@@ -50,7 +50,7 @@ export default function AutomationEntry({
   onDelete,
   onCopy,
   onExport,
-  toolRegistry
+  toolRegistry,
 }: AutomationEntryProps) {
   const { t } = useTranslation();
   const [isHovered, setIsHovered] = useState(false);
@@ -80,12 +80,12 @@ export default function AutomationEntry({
           size="sm"
           fw={600}
           style={{
-            color: 'var(--mantine-primary-color-filled)',
-            background: 'var(--mantine-primary-color-light)',
-            padding: '2px 6px',
-            borderRadius: '4px',
-            fontSize: '0.75rem',
-            whiteSpace: 'nowrap'
+            color: "var(--mantine-primary-color-filled)",
+            background: "var(--mantine-primary-color-light)",
+            padding: "2px 6px",
+            borderRadius: "4px",
+            fontSize: "0.75rem",
+            whiteSpace: "nowrap",
           }}
         >
           {getToolDisplayName(op)}
@@ -99,14 +99,25 @@ export default function AutomationEntry({
     ));
 
     return (
-      <div style={{ minWidth: '400px', width: 'auto' }}>
+      <div style={{ minWidth: "400px", width: "auto" }}>
         {description && (
-          <Text size="sm" mb={8} style={{ whiteSpace: 'normal', wordWrap: 'break-word' }}>
+          <Text
+            size="sm"
+            mb={8}
+            style={{ whiteSpace: "normal", wordWrap: "break-word" }}
+          >
             {description}
           </Text>
         )}
         {operations.length > 0 && (
-          <div style={{ display: 'flex', alignItems: 'center', gap: '4px', whiteSpace: 'nowrap' }}>
+          <div
+            style={{
+              display: "flex",
+              alignItems: "center",
+              gap: "4px",
+              whiteSpace: "nowrap",
+            }}
+          >
             {toolChain}
           </div>
         )}
@@ -119,13 +130,23 @@ export default function AutomationEntry({
       {BadgeIcon && (
         <ToolIcon
           icon={<BadgeIcon />}
-          {...(keepIconColor && { color: 'var(--mantine-primary-color-filled)' })}
+          {...(keepIconColor && {
+            color: "var(--mantine-primary-color-filled)",
+          })}
         />
       )}
-      <div style={{ display: 'flex', flexDirection: 'column', alignItems: 'flex-start', flex: 1, overflow: 'visible' }}>
+      <div
+        style={{
+          display: "flex",
+          flexDirection: "column",
+          alignItems: "flex-start",
+          flex: 1,
+          overflow: "visible",
+        }}
+      >
         {title ? (
           // Custom automation with title
-          <Text size="sm" style={{ textAlign: 'left' }}>
+          <Text size="sm" style={{ textAlign: "left" }}>
             {title}
           </Text>
         ) : (
@@ -133,9 +154,7 @@ export default function AutomationEntry({
           <Group gap="xs" justify="flex-start" style={{ flex: 1 }}>
             {operations.map((op, index) => (
               <React.Fragment key={`${op}-${index}`}>
-                <Text size="sm">
-                  {getToolDisplayName(op)}
-                </Text>
+                <Text size="sm">{getToolDisplayName(op)}</Text>
                 {index < operations.length - 1 && (
                   <Text size="sm" c="dimmed">
                     →
@@ -151,7 +170,7 @@ export default function AutomationEntry({
 
   const wrapperContent = (
     <Box
-      style={{ position: 'relative', width: '100%' }}
+      style={{ position: "relative", width: "100%" }}
       onMouseEnter={() => setIsHovered(true)}
       onMouseLeave={() => setIsHovered(false)}
     >
@@ -167,13 +186,15 @@ export default function AutomationEntry({
           root: {
             borderRadius: 0,
             color: "var(--tools-text-and-icon-color)",
-            overflow: 'visible',
-            backgroundColor: shouldShowMenu ? 'var(--automation-entry-hover-bg)' : undefined,
-            '&:hover': {
-              backgroundColor: 'var(--automation-entry-hover-bg)'
-            }
+            overflow: "visible",
+            backgroundColor: shouldShowMenu
+              ? "var(--automation-entry-hover-bg)"
+              : undefined,
+            "&:hover": {
+              backgroundColor: "var(--automation-entry-hover-bg)",
+            },
           },
-          label: { overflow: 'visible' }
+          label: { overflow: "visible" },
         }}
       >
         {buttonContent}
@@ -192,14 +213,14 @@ export default function AutomationEntry({
               size="md"
               onClick={(e) => e.stopPropagation()}
               style={{
-                position: 'absolute',
-                right: '0.5rem',
-                top: '50%',
-                transform: 'translateY(-50%)',
+                position: "absolute",
+                right: "0.5rem",
+                top: "50%",
+                transform: "translateY(-50%)",
                 zIndex: 1,
                 opacity: shouldShowMenu ? 1 : 0,
-                transition: 'opacity 0.2s ease',
-                pointerEvents: shouldShowMenu ? 'auto' : 'none'
+                transition: "opacity 0.2s ease",
+                pointerEvents: shouldShowMenu ? "auto" : "none",
               }}
             >
               <MoreVertIcon style={{ fontSize: 20 }} />
@@ -215,7 +236,7 @@ export default function AutomationEntry({
                   onCopy();
                 }}
               >
-                {t('automate.copyToSaved', 'Copy to Saved')}
+                {t("automate.copyToSaved", "Copy to Saved")}
               </Menu.Item>
             )}
             {onEdit && (
@@ -226,7 +247,7 @@ export default function AutomationEntry({
                   onEdit();
                 }}
               >
-                {t('edit', 'Edit')}
+                {t("edit", "Edit")}
               </Menu.Item>
             )}
             {onExport && (
@@ -237,7 +258,10 @@ export default function AutomationEntry({
                   onExport();
                 }}
               >
-                {t('automate.exportForFolderScanning', 'Export for Folder Scanning')}
+                {t(
+                  "automate.exportForFolderScanning",
+                  "Export for Folder Scanning",
+                )}
               </Menu.Item>
             )}
             {onDelete && (
@@ -248,7 +272,7 @@ export default function AutomationEntry({
                   onDelete();
                 }}
               >
-                {t('delete', 'Delete')}
+                {t("delete", "Delete")}
               </Menu.Item>
             )}
           </Menu.Dropdown>
diff --git a/frontend/src/core/components/tools/automate/AutomationRun.tsx b/frontend/src/core/components/tools/automate/AutomationRun.tsx
index 073916f276..d988f1a4a8 100644
--- a/frontend/src/core/components/tools/automate/AutomationRun.tsx
+++ b/frontend/src/core/components/tools/automate/AutomationRun.tsx
@@ -1,6 +1,14 @@
 import { useEffect, useState } from "react";
 import { useTranslation } from "react-i18next";
-import { Button, Text, Stack, Group, Card, Progress, Loader } from "@mantine/core";
+import {
+  Button,
+  Text,
+  Stack,
+  Group,
+  Card,
+  Progress,
+  Loader,
+} from "@mantine/core";
 import PlayArrowIcon from "@mui/icons-material/PlayArrow";
 import CheckIcon from "@mui/icons-material/Check";
 import { useFileSelection } from "@app/contexts/FileContext";
@@ -15,7 +23,11 @@ interface AutomationRunProps {
   automateOperation?: any; // TODO: Type this properly when available
 }
 
-export default function AutomationRun({ automation, onComplete, automateOperation }: AutomationRunProps) {
+export default function AutomationRun({
+  automation,
+  onComplete,
+  automateOperation,
+}: AutomationRunProps) {
   const { t } = useTranslation();
   const { selectedFiles } = useFileSelection();
   const { regularTools } = useToolRegistry();
@@ -28,7 +40,9 @@ export default function AutomationRun({ automation, onComplete, automateOperatio
 
   // Use the operation hook's loading state
   const isExecuting = automateOperation?.isLoading || false;
-  const hasResults = automateOperation?.files.length > 0 || automateOperation?.downloadUrl !== null;
+  const hasResults =
+    automateOperation?.files.length > 0 ||
+    automateOperation?.downloadUrl !== null;
 
   // Initialize execution steps from automation
   useEffect(() => {
@@ -39,7 +53,7 @@ export default function AutomationRun({ automation, onComplete, automateOperatio
           id: `${op.operation}-${index}`,
           operation: op.operation,
           name: tool?.name || op.operation,
-          status: EXECUTION_STATUS.PENDING
+          status: EXECUTION_STATUS.PENDING,
         };
       });
       setExecutionSteps(steps);
@@ -64,13 +78,19 @@ export default function AutomationRun({ automation, onComplete, automateOperatio
     }
 
     if (!automateOperation) {
-      console.error('No automateOperation provided');
+      console.error("No automateOperation provided");
       return;
     }
 
     // Reset progress tracking
     setCurrentStepIndex(0);
-    setExecutionSteps(prev => prev.map(step => ({ ...step, status: EXECUTION_STATUS.PENDING, error: undefined })));
+    setExecutionSteps((prev) =>
+      prev.map((step) => ({
+        ...step,
+        status: EXECUTION_STATUS.PENDING,
+        error: undefined,
+      })),
+    );
 
     try {
       // Use the automateOperation.executeOperation to handle file consumption properly
@@ -79,22 +99,34 @@ export default function AutomationRun({ automation, onComplete, automateOperatio
           automationConfig: automation,
           onStepStart: (stepIndex: number, _operationName: string) => {
             setCurrentStepIndex(stepIndex);
-            setExecutionSteps(prev => prev.map((step, idx) =>
-              idx === stepIndex ? { ...step, status: EXECUTION_STATUS.RUNNING } : step
-            ));
+            setExecutionSteps((prev) =>
+              prev.map((step, idx) =>
+                idx === stepIndex
+                  ? { ...step, status: EXECUTION_STATUS.RUNNING }
+                  : step,
+              ),
+            );
           },
           onStepComplete: (stepIndex: number, _resultFiles: File[]) => {
-            setExecutionSteps(prev => prev.map((step, idx) =>
-              idx === stepIndex ? { ...step, status: EXECUTION_STATUS.COMPLETED } : step
-            ));
+            setExecutionSteps((prev) =>
+              prev.map((step, idx) =>
+                idx === stepIndex
+                  ? { ...step, status: EXECUTION_STATUS.COMPLETED }
+                  : step,
+              ),
+            );
           },
           onStepError: (stepIndex: number, error: string) => {
-            setExecutionSteps(prev => prev.map((step, idx) =>
-              idx === stepIndex ? { ...step, status: EXECUTION_STATUS.ERROR, error } : step
-            ));
-          }
+            setExecutionSteps((prev) =>
+              prev.map((step, idx) =>
+                idx === stepIndex
+                  ? { ...step, status: EXECUTION_STATUS.ERROR, error }
+                  : step,
+              ),
+            );
+          },
         },
-        selectedFiles
+        selectedFiles,
       );
 
       // Mark all as completed and reset current step
@@ -108,25 +140,31 @@ export default function AutomationRun({ automation, onComplete, automateOperatio
 
   const getProgress = () => {
     if (executionSteps.length === 0) return 0;
-    const completedSteps = executionSteps.filter(step => step.status === EXECUTION_STATUS.COMPLETED).length;
+    const completedSteps = executionSteps.filter(
+      (step) => step.status === EXECUTION_STATUS.COMPLETED,
+    ).length;
     return (completedSteps / executionSteps.length) * 100;
   };
 
   const getStepIcon = (step: ExecutionStep) => {
     switch (step.status) {
       case EXECUTION_STATUS.COMPLETED:
-        return <CheckIcon style={{ fontSize: 16, color: 'green' }} />;
+        return <CheckIcon style={{ fontSize: 16, color: "green" }} />;
       case EXECUTION_STATUS.ERROR:
-        return <span style={{ fontSize: 16, color: 'red' }}>✕</span>;
+        return <span style={{ fontSize: 16, color: "red" }}>✕</span>;
       case EXECUTION_STATUS.RUNNING:
         return <Loader size={16} />;
       default:
-        return <div style={{
-          width: 16,
-          height: 16,
-          border: '2px solid #ccc',
-          borderRadius: '50%'
-        }} />;
+        return (
+          <div
+            style={{
+              width: 16,
+              height: 16,
+              border: "2px solid #ccc",
+              borderRadius: "50%",
+            }}
+          />
+        );
     }
   };
 
@@ -136,10 +174,13 @@ export default function AutomationRun({ automation, onComplete, automateOperatio
         {/* Automation Info */}
         <Card padding="md" withBorder>
           <Text size="sm" fw={500} mb="xs">
-            {automation?.name || t("automate.sequence.unnamed", "Unnamed Automation")}
+            {automation?.name ||
+              t("automate.sequence.unnamed", "Unnamed Automation")}
           </Text>
           <Text size="xs" c="dimmed">
-            {t("automate.sequence.steps", "{{count}} steps", { count: executionSteps.length })}
+            {t("automate.sequence.steps", "{{count}} steps", {
+              count: executionSteps.length,
+            })}
           </Text>
         </Card>
 
@@ -157,7 +198,11 @@ export default function AutomationRun({ automation, onComplete, automateOperatio
         <Stack gap="xs">
           {executionSteps.map((step, index) => (
             <Group key={step.id} gap="sm" align="center">
-              <Text size="xs" c="dimmed" style={{ minWidth: "1rem", textAlign: "center" }}>
+              <Text
+                size="xs"
+                c="dimmed"
+                style={{ minWidth: "1rem", textAlign: "center" }}
+              >
                 {index + 1}
               </Text>
 
@@ -167,8 +212,12 @@ export default function AutomationRun({ automation, onComplete, automateOperatio
                 <Text
                   size="sm"
                   style={{
-                    color: step.status === EXECUTION_STATUS.RUNNING ? 'var(--mantine-color-blue-6)' : 'var(--mantine-color-text)',
-                    fontWeight: step.status === EXECUTION_STATUS.RUNNING ? 500 : 400
+                    color:
+                      step.status === EXECUTION_STATUS.RUNNING
+                        ? "var(--mantine-color-blue-6)"
+                        : "var(--mantine-color-text)",
+                    fontWeight:
+                      step.status === EXECUTION_STATUS.RUNNING ? 500 : 400,
                   }}
                 >
                   {step.name}
@@ -188,7 +237,9 @@ export default function AutomationRun({ automation, onComplete, automateOperatio
           <Button
             leftSection={<PlayArrowIcon />}
             onClick={executeAutomation}
-            disabled={isExecuting || !selectedFiles || selectedFiles.length === 0}
+            disabled={
+              isExecuting || !selectedFiles || selectedFiles.length === 0
+            }
             loading={isExecuting}
           >
             {isExecuting
diff --git a/frontend/src/core/components/tools/automate/AutomationSelection.tsx b/frontend/src/core/components/tools/automate/AutomationSelection.tsx
index b7f600dda6..473559f511 100644
--- a/frontend/src/core/components/tools/automate/AutomationSelection.tsx
+++ b/frontend/src/core/components/tools/automate/AutomationSelection.tsx
@@ -5,9 +5,9 @@ import SettingsIcon from "@mui/icons-material/Settings";
 import AutomationEntry from "@app/components/tools/automate/AutomationEntry";
 import { useSuggestedAutomations } from "@app/hooks/tools/automate/useSuggestedAutomations";
 import { AutomationConfig, SuggestedAutomation } from "@app/types/automation";
-import { iconMap } from '@app/components/tools/automate/iconMap';
-import { ToolRegistry } from '@app/data/toolsTaxonomy';
-import { downloadFolderScanningConfig } from '@app/utils/automationConverter';
+import { iconMap } from "@app/components/tools/automate/iconMap";
+import { ToolRegistry } from "@app/data/toolsTaxonomy";
+import { downloadFolderScanningConfig } from "@app/utils/automationConverter";
 
 interface AutomationSelectionProps {
   savedAutomations: AutomationConfig[];
@@ -26,69 +26,90 @@ export default function AutomationSelection({
   onEdit,
   onDelete,
   onCopyFromSuggested,
-  toolRegistry
+  toolRegistry,
 }: AutomationSelectionProps) {
   const { t } = useTranslation();
   const suggestedAutomations = useSuggestedAutomations();
 
   return (
     <div>
-      <Title order={3} size="h4" fw={600} mb="md" style={{color: 'var(--mantine-color-dimmed)'}}>
+      <Title
+        order={3}
+        size="h4"
+        fw={600}
+        mb="md"
+        style={{ color: "var(--mantine-color-dimmed)" }}
+      >
         {t("automate.selection.saved.title", "Saved")}
       </Title>
 
-    <Stack gap="xs">
-      <AutomationEntry
-        title={t("automate.selection.createNew.title", "Create New Automation")}
-        badgeIcon={AddCircleOutline}
-        operations={[]}
-        onClick={onCreateNew}
-        keepIconColor={true}
-        toolRegistry={toolRegistry}
-      />
-      {/* Saved Automations */}
-      {savedAutomations.map((automation) => {
-        const IconComponent = automation.icon ? iconMap[automation.icon as keyof typeof iconMap] : SettingsIcon;
-        return (
-          <AutomationEntry
-            key={automation.id}
-            title={automation.name}
-            description={automation.description}
-            badgeIcon={IconComponent || SettingsIcon}
-            operations={automation.operations.map(op => typeof op === 'string' ? op : op.operation)}
-            onClick={() => onRun(automation)}
-            showMenu={true}
-            onEdit={() => onEdit(automation)}
-            onExport={() => downloadFolderScanningConfig(automation, toolRegistry)}
-            onDelete={() => onDelete(automation)}
-            toolRegistry={toolRegistry}
-          />
-        );
-      })}
-      <Divider pb='sm' />
-
-      {/* Suggested Automations */}
-      <div>
-        <Title order={3} size="h4" fw={600} mb="md"style={ {color: 'var(--mantine-color-dimmed)'}}>
-          {t("automate.selection.suggested.title", "Suggested")}
-        </Title>
-        <Stack gap="xs">
-          {suggestedAutomations.map((automation) => (
+      <Stack gap="xs">
+        <AutomationEntry
+          title={t(
+            "automate.selection.createNew.title",
+            "Create New Automation",
+          )}
+          badgeIcon={AddCircleOutline}
+          operations={[]}
+          onClick={onCreateNew}
+          keepIconColor={true}
+          toolRegistry={toolRegistry}
+        />
+        {/* Saved Automations */}
+        {savedAutomations.map((automation) => {
+          const IconComponent = automation.icon
+            ? iconMap[automation.icon as keyof typeof iconMap]
+            : SettingsIcon;
+          return (
             <AutomationEntry
               key={automation.id}
               title={automation.name}
               description={automation.description}
-              badgeIcon={automation.icon}
-              operations={automation.operations.map(op => op.operation)}
+              badgeIcon={IconComponent || SettingsIcon}
+              operations={automation.operations.map((op) =>
+                typeof op === "string" ? op : op.operation,
+              )}
               onClick={() => onRun(automation)}
               showMenu={true}
-              onCopy={() => onCopyFromSuggested(automation)}
+              onEdit={() => onEdit(automation)}
+              onExport={() =>
+                downloadFolderScanningConfig(automation, toolRegistry)
+              }
+              onDelete={() => onDelete(automation)}
               toolRegistry={toolRegistry}
             />
-          ))}
-        </Stack>
-      </div>
-    </Stack>
+          );
+        })}
+        <Divider pb="sm" />
+
+        {/* Suggested Automations */}
+        <div>
+          <Title
+            order={3}
+            size="h4"
+            fw={600}
+            mb="md"
+            style={{ color: "var(--mantine-color-dimmed)" }}
+          >
+            {t("automate.selection.suggested.title", "Suggested")}
+          </Title>
+          <Stack gap="xs">
+            {suggestedAutomations.map((automation) => (
+              <AutomationEntry
+                key={automation.id}
+                title={automation.name}
+                description={automation.description}
+                badgeIcon={automation.icon}
+                operations={automation.operations.map((op) => op.operation)}
+                onClick={() => onRun(automation)}
+                showMenu={true}
+                onCopy={() => onCopyFromSuggested(automation)}
+                toolRegistry={toolRegistry}
+              />
+            ))}
+          </Stack>
+        </div>
+      </Stack>
     </div>
   );
 }
diff --git a/frontend/src/core/components/tools/automate/IconSelector.tsx b/frontend/src/core/components/tools/automate/IconSelector.tsx
index 0bfcd01d8b..cd67d1487f 100644
--- a/frontend/src/core/components/tools/automate/IconSelector.tsx
+++ b/frontend/src/core/components/tools/automate/IconSelector.tsx
@@ -1,9 +1,17 @@
 import React, { useState } from "react";
 import { useTranslation } from "react-i18next";
-import { Box, Text, Stack, Button, SimpleGrid, Tooltip, Popover } from "@mantine/core";
+import {
+  Box,
+  Text,
+  Stack,
+  Button,
+  SimpleGrid,
+  Tooltip,
+  Popover,
+} from "@mantine/core";
 import KeyboardArrowDownIcon from "@mui/icons-material/KeyboardArrowDown";
-import { iconMap, iconOptions } from '@app/components/tools/automate/iconMap';
-import { Z_INDEX_AUTOMATE_DROPDOWN } from '@app/styles/zIndex';
+import { iconMap, iconOptions } from "@app/components/tools/automate/iconMap";
+import { Z_INDEX_AUTOMATE_DROPDOWN } from "@app/styles/zIndex";
 
 interface IconSelectorProps {
   value?: string;
@@ -11,11 +19,16 @@ interface IconSelectorProps {
   size?: "sm" | "md" | "lg";
 }
 
-export default function IconSelector({ value = "SettingsIcon", onChange, size = "sm" }: IconSelectorProps) {
+export default function IconSelector({
+  value = "SettingsIcon",
+  onChange,
+  size = "sm",
+}: IconSelectorProps) {
   const { t } = useTranslation();
   const [isDropdownOpen, setIsDropdownOpen] = useState(false);
 
-  const selectedIconComponent = iconMap[value as keyof typeof iconMap] || iconMap.SettingsIcon;
+  const selectedIconComponent =
+    iconMap[value as keyof typeof iconMap] || iconMap.SettingsIcon;
 
   const handleIconSelect = (iconKey: string) => {
     onChange?.(iconKey);
@@ -26,7 +39,11 @@ export default function IconSelector({ value = "SettingsIcon", onChange, size =
 
   return (
     <Stack gap="1px">
-      <Text size="sm" fw={600} style={{ color: "var(--mantine-color-primary)" }}>
+      <Text
+        size="sm"
+        fw={600}
+        style={{ color: "var(--mantine-color-primary)" }}
+      >
         {t("automate.creation.icon.label", "Icon")}
       </Text>
 
@@ -53,10 +70,11 @@ export default function IconSelector({ value = "SettingsIcon", onChange, size =
               paddingLeft: "0.5rem",
               borderColor: "var(--mantine-color-gray-3)",
               color: "var(--mantine-color-text)",
-
             }}
           >
-            {React.createElement(selectedIconComponent, { style: { fontSize: iconSize } })}
+            {React.createElement(selectedIconComponent, {
+              style: { fontSize: iconSize },
+            })}
             <KeyboardArrowDownIcon
               style={{
                 fontSize: iconSize * 0.8,
@@ -73,7 +91,8 @@ export default function IconSelector({ value = "SettingsIcon", onChange, size =
           <Stack gap="xs">
             <SimpleGrid cols={4} spacing="xs">
               {iconOptions.map((option) => {
-                const IconComponent = iconMap[option.value as keyof typeof iconMap];
+                const IconComponent =
+                  iconMap[option.value as keyof typeof iconMap];
                 const isSelected = value === option.value;
 
                 return (
@@ -87,11 +106,14 @@ export default function IconSelector({ value = "SettingsIcon", onChange, size =
                         padding: "0.5rem",
                         borderRadius: "0.25rem",
                         cursor: "pointer",
-                        backgroundColor: isSelected ? "var(--mantine-color-gray-1)" : "transparent",
+                        backgroundColor: isSelected
+                          ? "var(--mantine-color-gray-1)"
+                          : "transparent",
                       }}
                       onMouseEnter={(e) => {
                         if (!isSelected) {
-                          e.currentTarget.style.backgroundColor = "var(--mantine-color-gray-0)";
+                          e.currentTarget.style.backgroundColor =
+                            "var(--mantine-color-gray-0)";
                         }
                       }}
                       onMouseLeave={(e) => {
@@ -103,7 +125,9 @@ export default function IconSelector({ value = "SettingsIcon", onChange, size =
                       <IconComponent
                         style={{
                           fontSize: iconSize,
-                          color: isSelected ? "var(--mantine-color-gray-9)" : "var(--mantine-color-gray-7)",
+                          color: isSelected
+                            ? "var(--mantine-color-gray-9)"
+                            : "var(--mantine-color-gray-7)",
                         }}
                       />
                     </Box>
diff --git a/frontend/src/core/components/tools/automate/ToolConfigurationModal.tsx b/frontend/src/core/components/tools/automate/ToolConfigurationModal.tsx
index fbb51467af..267d88c239 100644
--- a/frontend/src/core/components/tools/automate/ToolConfigurationModal.tsx
+++ b/frontend/src/core/components/tools/automate/ToolConfigurationModal.tsx
@@ -1,22 +1,14 @@
-import { useState, useEffect } from 'react';
-import { useTranslation } from 'react-i18next';
-import {
-  Modal,
-  Title,
-  Button,
-  Group,
-  Stack,
-  Text,
-  Alert
-} from '@mantine/core';
-import { Z_INDEX_AUTOMATE_MODAL } from '@app/styles/zIndex';
-import SettingsIcon from '@mui/icons-material/Settings';
-import CheckIcon from '@mui/icons-material/Check';
-import CloseIcon from '@mui/icons-material/Close';
-import WarningIcon from '@mui/icons-material/Warning';
-import { ToolRegistry } from '@app/data/toolsTaxonomy';
-import { ToolId } from '@app/types/toolId';
-import { getAvailableToExtensions } from '@app/utils/convertUtils';
+import { useState, useEffect } from "react";
+import { useTranslation } from "react-i18next";
+import { Modal, Title, Button, Group, Stack, Text, Alert } from "@mantine/core";
+import { Z_INDEX_AUTOMATE_MODAL } from "@app/styles/zIndex";
+import SettingsIcon from "@mui/icons-material/Settings";
+import CheckIcon from "@mui/icons-material/Check";
+import CloseIcon from "@mui/icons-material/Close";
+import WarningIcon from "@mui/icons-material/Warning";
+import { ToolRegistry } from "@app/data/toolsTaxonomy";
+import { ToolId } from "@app/types/toolId";
+import { getAvailableToExtensions } from "@app/utils/convertUtils";
 interface ToolConfigurationModalProps {
   opened: boolean;
   tool: {
@@ -30,7 +22,13 @@ interface ToolConfigurationModalProps {
   toolRegistry: Partial<ToolRegistry>;
 }
 
-export default function ToolConfigurationModal({ opened, tool, onSave, onCancel, toolRegistry }: ToolConfigurationModalProps) {
+export default function ToolConfigurationModal({
+  opened,
+  tool,
+  onSave,
+  onCancel,
+  toolRegistry,
+}: ToolConfigurationModalProps) {
   const { t } = useTranslation();
 
   const [parameters, setParameters] = useState<any>({});
@@ -58,14 +56,17 @@ export default function ToolConfigurationModal({ opened, tool, onSave, onCancel,
       return (
         <Alert icon={<WarningIcon />} color="orange">
           <Text size="sm">
-            {t('automate.config.noSettings', 'This tool does not have configurable settings.')}
+            {t(
+              "automate.config.noSettings",
+              "This tool does not have configurable settings.",
+            )}
           </Text>
         </Alert>
       );
     }
 
     // Special handling for ConvertSettings which needs additional props
-    if (tool.operation === 'convert') {
+    if (tool.operation === "convert") {
       return (
         <SettingsComponent
           parameters={parameters}
@@ -102,7 +103,9 @@ export default function ToolConfigurationModal({ opened, tool, onSave, onCancel,
         <Group gap="xs">
           <SettingsIcon />
           <Title order={3}>
-            {t('automate.config.title', 'Configure {{toolName}}', { toolName: tool.name })}
+            {t("automate.config.title", "Configure {{toolName}}", {
+              toolName: tool.name,
+            })}
           </Title>
         </Group>
       }
@@ -112,10 +115,15 @@ export default function ToolConfigurationModal({ opened, tool, onSave, onCancel,
     >
       <Stack gap="md">
         <Text size="sm" c="dimmed">
-          {t('automate.config.description', 'Configure the settings for this tool. These settings will be applied when the automation runs.')}
+          {t(
+            "automate.config.description",
+            "Configure the settings for this tool. These settings will be applied when the automation runs.",
+          )}
         </Text>
 
-        <div style={{ maxHeight: '60vh', overflowY: 'auto', overflowX: "hidden" }}>
+        <div
+          style={{ maxHeight: "60vh", overflowY: "auto", overflowX: "hidden" }}
+        >
           {renderToolSettings()}
         </div>
 
@@ -125,13 +133,10 @@ export default function ToolConfigurationModal({ opened, tool, onSave, onCancel,
             leftSection={<CloseIcon />}
             onClick={onCancel}
           >
-            {t('automate.config.cancel', 'Cancel')}
+            {t("automate.config.cancel", "Cancel")}
           </Button>
-          <Button
-            leftSection={<CheckIcon />}
-            onClick={handleSave}
-          >
-            {t('automate.config.save', 'Save Configuration')}
+          <Button leftSection={<CheckIcon />} onClick={handleSave}>
+            {t("automate.config.save", "Save Configuration")}
           </Button>
         </Group>
       </Stack>
diff --git a/frontend/src/core/components/tools/automate/ToolList.tsx b/frontend/src/core/components/tools/automate/ToolList.tsx
index 7a5c668600..5804246fc4 100644
--- a/frontend/src/core/components/tools/automate/ToolList.tsx
+++ b/frontend/src/core/components/tools/automate/ToolList.tsx
@@ -49,8 +49,14 @@ export default function ToolList({
 
   return (
     <div>
-      <Text size="sm" fw={500} mb="xs" style={{ color: "var(--mantine-color-text)" }}>
-        {t("automate.creation.tools.selected", "Selected Tools")} ({tools.length})
+      <Text
+        size="sm"
+        fw={500}
+        mb="xs"
+        style={{ color: "var(--mantine-color-text)" }}
+      >
+        {t("automate.creation.tools.selected", "Selected Tools")} (
+        {tools.length})
       </Text>
       <Stack gap="0">
         {tools.map((tool, index) => (
@@ -58,13 +64,15 @@ export default function ToolList({
             <div
               style={{
                 border: "1px solid var(--mantine-color-gray-2)",
-                borderRadius: tool.operation && !tool.configured
-                  ? "var(--mantine-radius-lg) var(--mantine-radius-lg) 0 0"
-                  : "var(--mantine-radius-lg)",
+                borderRadius:
+                  tool.operation && !tool.configured
+                    ? "var(--mantine-radius-lg) var(--mantine-radius-lg) 0 0"
+                    : "var(--mantine-radius-lg)",
                 backgroundColor: "var(--mantine-color-gray-2)",
                 position: "relative",
                 padding: "var(--mantine-spacing-xs)",
-                borderBottomWidth: tool.operation && !tool.configured ? "0" : "1px",
+                borderBottomWidth:
+                  tool.operation && !tool.configured ? "0" : "1px",
               }}
             >
               {/* Delete X in top right - only show for tools after the first 2 */}
@@ -92,7 +100,9 @@ export default function ToolList({
                   <div style={{ flex: 1, minWidth: 0 }}>
                     <ToolSelector
                       key={`tool-selector-${tool.id}`}
-                      onSelect={(newOperation) => handleToolSelect(index, newOperation)}
+                      onSelect={(newOperation) =>
+                        handleToolSelect(index, newOperation)
+                      }
                       excludeTools={["automate"]}
                       toolRegistry={toolRegistry}
                       selectedValue={tool.operation}
@@ -106,7 +116,10 @@ export default function ToolList({
                       variant="subtle"
                       size="sm"
                       onClick={() => onToolConfigure(index)}
-                      title={t("automate.creation.tools.configure", "Configure tool")}
+                      title={t(
+                        "automate.creation.tools.configure",
+                        "Configure tool",
+                      )}
                       style={{ color: "var(--mantine-color-gray-6)" }}
                     >
                       <SettingsIcon style={{ fontSize: 16 }} />
@@ -122,13 +135,17 @@ export default function ToolList({
                   width: "100%",
                   border: "1px solid var(--mantine-color-gray-2)",
                   borderTop: "none",
-                  borderRadius: "0 0 var(--mantine-radius-lg) var(--mantine-radius-lg)",
+                  borderRadius:
+                    "0 0 var(--mantine-radius-lg) var(--mantine-radius-lg)",
                   backgroundColor: "var(--active-bg)",
                   padding: "var(--mantine-spacing-xs)",
                 }}
               >
-                <Text pl="md" size="xs" >
-                  {t("automate.creation.tools.notConfigured", "! Not Configured")}
+                <Text pl="md" size="xs">
+                  {t(
+                    "automate.creation.tools.notConfigured",
+                    "! Not Configured",
+                  )}
                 </Text>
               </div>
             )}
diff --git a/frontend/src/core/components/tools/automate/ToolSelector.tsx b/frontend/src/core/components/tools/automate/ToolSelector.tsx
index 2d87ae69a9..c5c3998bc0 100644
--- a/frontend/src/core/components/tools/automate/ToolSelector.tsx
+++ b/frontend/src/core/components/tools/automate/ToolSelector.tsx
@@ -1,13 +1,17 @@
-import { useState, useMemo, useCallback, useRef, useEffect } from 'react';
-import { useTranslation } from 'react-i18next';
-import { Stack, Text, ScrollArea } from '@mantine/core';
-import { ToolRegistryEntry, ToolRegistry, getToolSupportsAutomate } from '@app/data/toolsTaxonomy';
-import { useToolSections } from '@app/hooks/useToolSections';
-import { renderToolButtons } from '@app/components/tools/shared/renderToolButtons';
-import ToolSearch from '@app/components/tools/toolPicker/ToolSearch';
-import ToolButton from '@app/components/tools/toolPicker/ToolButton';
-import { ToolId } from '@app/types/toolId';
-import { Z_INDEX_AUTOMATE_DROPDOWN } from '@app/styles/zIndex';
+import { useState, useMemo, useCallback, useRef, useEffect } from "react";
+import { useTranslation } from "react-i18next";
+import { Stack, Text, ScrollArea } from "@mantine/core";
+import {
+  ToolRegistryEntry,
+  ToolRegistry,
+  getToolSupportsAutomate,
+} from "@app/data/toolsTaxonomy";
+import { useToolSections } from "@app/hooks/useToolSections";
+import { renderToolButtons } from "@app/components/tools/shared/renderToolButtons";
+import ToolSearch from "@app/components/tools/toolPicker/ToolSearch";
+import ToolButton from "@app/components/tools/toolPicker/ToolButton";
+import { ToolId } from "@app/types/toolId";
+import { Z_INDEX_AUTOMATE_DROPDOWN } from "@app/styles/zIndex";
 
 interface ToolSelectorProps {
   onSelect: (toolKey: string) => void;
@@ -22,18 +26,21 @@ export default function ToolSelector({
   excludeTools = [],
   toolRegistry,
   selectedValue,
-  placeholder
+  placeholder,
 }: ToolSelectorProps) {
   const { t } = useTranslation();
   const [opened, setOpened] = useState(false);
-  const [searchTerm, setSearchTerm] = useState('');
+  const [searchTerm, setSearchTerm] = useState("");
   const [shouldAutoFocus, setShouldAutoFocus] = useState(false);
   const containerRef = useRef<HTMLDivElement>(null);
 
   // Filter out excluded tools (like 'automate' itself) and tools that don't support automation
   const baseFilteredTools = useMemo(() => {
-    return (Object.entries(toolRegistry) as [ToolId, ToolRegistryEntry][]).filter(([key, tool]) =>
-      !excludeTools.includes(key) && getToolSupportsAutomate(tool)
+    return (
+      Object.entries(toolRegistry) as [ToolId, ToolRegistryEntry][]
+    ).filter(
+      ([key, tool]) =>
+        !excludeTools.includes(key) && getToolSupportsAutomate(tool),
     );
   }, [toolRegistry, excludeTools]);
 
@@ -64,11 +71,15 @@ export default function ToolSelector({
 
   // Transform filteredTools to the expected format for useToolSections
   const transformedFilteredTools = useMemo(() => {
-    return filteredTools.map(([id, tool]) => ({ item: [id as ToolId, tool] as [ToolId, ToolRegistryEntry] }));
+    return filteredTools.map(([id, tool]) => ({
+      item: [id as ToolId, tool] as [ToolId, ToolRegistryEntry],
+    }));
   }, [filteredTools]);
 
   // Use the same tool sections logic as the main ToolPicker
-  const { sections, searchGroups } = useToolSections(transformedFilteredTools as any /* FIX ME */);
+  const { sections, searchGroups } = useToolSections(
+    transformedFilteredTools as any /* FIX ME */,
+  );
 
   // Determine what to display: search results or organized sections
   const isSearching = searchTerm.trim().length > 0;
@@ -80,30 +91,44 @@ export default function ToolSelector({
     if (!sections || sections.length === 0) {
       // If no sections, create a simple group from filtered tools
       if (baseFilteredTools.length > 0) {
-        return [{
-          name: 'Tools',
-          subcategoryId: 'all' as any,
-          tools: baseFilteredTools.map(([key, tool]) => ({ id: key, tool }))
-        }];
+        return [
+          {
+            name: "Tools",
+            subcategoryId: "all" as any,
+            tools: baseFilteredTools.map(([key, tool]) => ({ id: key, tool })),
+          },
+        ];
       }
       return [];
     }
 
     // Find the "all" section which contains all tools without duplicates
-    const allSection = sections.find(s => s.key === 'all');
+    const allSection = sections.find((s) => s.key === "all");
     return allSection?.subcategories || [];
   }, [isSearching, searchGroups, sections, baseFilteredTools]);
 
-  const handleToolSelect = useCallback((toolKey: string) => {
-    onSelect(toolKey);
-    setOpened(false);
-    setSearchTerm(''); // Clear search to show the selected tool display
-  }, [onSelect]);
+  const handleToolSelect = useCallback(
+    (toolKey: string) => {
+      onSelect(toolKey);
+      setOpened(false);
+      setSearchTerm(""); // Clear search to show the selected tool display
+    },
+    [onSelect],
+  );
 
-  const renderedTools = useMemo(() =>
-    displayGroups.map((subcategory) =>
-      renderToolButtons(t, subcategory as any, null, handleToolSelect, !isSearching, true)
-    ), [displayGroups, handleToolSelect, isSearching, t]
+  const renderedTools = useMemo(
+    () =>
+      displayGroups.map((subcategory) =>
+        renderToolButtons(
+          t,
+          subcategory as any,
+          null,
+          handleToolSelect,
+          !isSearching,
+          true,
+        ),
+      ),
+    [displayGroups, handleToolSelect, isSearching, t],
   );
 
   const handleSearchFocus = () => {
@@ -114,19 +139,22 @@ export default function ToolSelector({
   // Handle click outside to close dropdown
   useEffect(() => {
     const handleClickOutside = (event: MouseEvent) => {
-      if (containerRef.current && !containerRef.current.contains(event.target as Node)) {
+      if (
+        containerRef.current &&
+        !containerRef.current.contains(event.target as Node)
+      ) {
         setOpened(false);
-        setSearchTerm('');
+        setSearchTerm("");
       }
     };
 
     if (opened) {
-      document.addEventListener('mousedown', handleClickOutside);
-      return () => document.removeEventListener('mousedown', handleClickOutside);
+      document.addEventListener("mousedown", handleClickOutside);
+      return () =>
+        document.removeEventListener("mousedown", handleClickOutside);
     }
   }, [opened]);
 
-
   const handleSearchChange = (value: string) => {
     setSearchTerm(value);
     if (!opened) {
@@ -143,59 +171,66 @@ export default function ToolSelector({
   };
 
   // Get display value for selected tool
-  const selectedTool = selectedValue ? toolRegistry[selectedValue as ToolId] : undefined;
+  const selectedTool = selectedValue
+    ? toolRegistry[selectedValue as ToolId]
+    : undefined;
 
   const getDisplayValue = () => {
     if (selectedTool) return selectedTool.name;
-    return placeholder || t('automate.creation.tools.add', 'Add a tool...');
+    return placeholder || t("automate.creation.tools.add", "Add a tool...");
   };
 
   return (
-    <div ref={containerRef} className='rounded-xl'>
+    <div ref={containerRef} className="rounded-xl">
       {/* Always show the target - either selected tool or search input */}
 
-        {selectedTool && !opened ? (
-          // Show selected tool in AutomationEntry style when tool is selected and dropdown closed
-          <div onClick={handleSearchFocus} style={{ cursor: 'pointer',
-           borderRadius: "var(--mantine-radius-lg)" }}>
-            <ToolButton
-              id={'tool' as ToolId}
-              tool={selectedTool}
-              isSelected={false}
-              onSelect={()=>{}}
-              rounded={true}
-              disableNavigation={true}
-            />
-          </div>
-        ) : (
-          // Show search input when no tool selected OR when dropdown is opened
-          <ToolSearch
-            value={searchTerm}
-            onChange={handleSearchChange}
-            toolRegistry={filteredToolRegistry}
-            mode="unstyled"
-            placeholder={getDisplayValue()}
-            hideIcon={true}
-            onFocus={handleInputFocus}
-            autoFocus={shouldAutoFocus}
+      {selectedTool && !opened ? (
+        // Show selected tool in AutomationEntry style when tool is selected and dropdown closed
+        <div
+          onClick={handleSearchFocus}
+          style={{
+            cursor: "pointer",
+            borderRadius: "var(--mantine-radius-lg)",
+          }}
+        >
+          <ToolButton
+            id={"tool" as ToolId}
+            tool={selectedTool}
+            isSelected={false}
+            onSelect={() => {}}
+            rounded={true}
+            disableNavigation={true}
           />
-        )}
+        </div>
+      ) : (
+        // Show search input when no tool selected OR when dropdown is opened
+        <ToolSearch
+          value={searchTerm}
+          onChange={handleSearchChange}
+          toolRegistry={filteredToolRegistry}
+          mode="unstyled"
+          placeholder={getDisplayValue()}
+          hideIcon={true}
+          onFocus={handleInputFocus}
+          autoFocus={shouldAutoFocus}
+        />
+      )}
 
       {/* Custom dropdown */}
       {opened && (
         <div
           style={{
-            position: 'absolute',
-            top: '100%',
+            position: "absolute",
+            top: "100%",
             left: 0,
             right: 0,
             zIndex: Z_INDEX_AUTOMATE_DROPDOWN,
-            backgroundColor: 'var(--mantine-color-body)',
-            border: '1px solid var(--mantine-color-gray-3)',
-            borderRadius: 'var(--mantine-radius-sm)',
-            boxShadow: 'var(--mantine-shadow-sm)',
-            marginTop: '4px',
-            minWidth: '16rem'
+            backgroundColor: "var(--mantine-color-body)",
+            border: "1px solid var(--mantine-color-gray-3)",
+            borderRadius: "var(--mantine-radius-sm)",
+            boxShadow: "var(--mantine-shadow-sm)",
+            marginTop: "4px",
+            minWidth: "16rem",
           }}
         >
           <ScrollArea h={350}>
@@ -203,9 +238,8 @@ export default function ToolSelector({
               {displayGroups.length === 0 ? (
                 <Text size="sm" c="dimmed" ta="center" p="md">
                   {isSearching
-                    ? t('tools.noSearchResults', 'No tools found')
-                    : t('tools.noTools', 'No tools available')
-                  }
+                    ? t("tools.noSearchResults", "No tools found")
+                    : t("tools.noTools", "No tools available")}
                 </Text>
               ) : (
                 renderedTools
diff --git a/frontend/src/core/components/tools/automate/iconMap.ts b/frontend/src/core/components/tools/automate/iconMap.ts
index cabd4f2dae..65d3f9421c 100644
--- a/frontend/src/core/components/tools/automate/iconMap.ts
+++ b/frontend/src/core/components/tools/automate/iconMap.ts
@@ -1,31 +1,31 @@
-import SettingsIcon from '@mui/icons-material/Settings';
-import CompressIcon from '@mui/icons-material/Compress';
-import SwapHorizIcon from '@mui/icons-material/SwapHoriz';
-import CleaningServicesIcon from '@mui/icons-material/CleaningServices';
-import CropIcon from '@mui/icons-material/Crop';
-import TextFieldsIcon from '@mui/icons-material/TextFields';
-import PictureAsPdfIcon from '@mui/icons-material/PictureAsPdf';
-import EditIcon from '@mui/icons-material/Edit';
-import DeleteIcon from '@mui/icons-material/Delete';
-import FolderIcon from '@mui/icons-material/Folder';
-import CloudIcon from '@mui/icons-material/Cloud';
-import StorageIcon from '@mui/icons-material/Storage';
-import SearchIcon from '@mui/icons-material/Search';
-import DownloadIcon from '@mui/icons-material/Download';
-import UploadIcon from '@mui/icons-material/Upload';
-import PlayArrowIcon from '@mui/icons-material/PlayArrow';
-import RotateLeftIcon from '@mui/icons-material/RotateLeft';
-import RotateRightIcon from '@mui/icons-material/RotateRight';
-import VisibilityIcon from '@mui/icons-material/Visibility';
-import ContentCutIcon from '@mui/icons-material/ContentCut';
-import ContentCopyIcon from '@mui/icons-material/ContentCopy';
-import WorkIcon from '@mui/icons-material/Work';
-import BuildIcon from '@mui/icons-material/Build';
-import AutoAwesomeIcon from '@mui/icons-material/AutoAwesome';
-import SmartToyIcon from '@mui/icons-material/SmartToy';
-import CheckIcon from '@mui/icons-material/Check';
-import SecurityIcon from '@mui/icons-material/Security';
-import StarIcon from '@mui/icons-material/Star';
+import SettingsIcon from "@mui/icons-material/Settings";
+import CompressIcon from "@mui/icons-material/Compress";
+import SwapHorizIcon from "@mui/icons-material/SwapHoriz";
+import CleaningServicesIcon from "@mui/icons-material/CleaningServices";
+import CropIcon from "@mui/icons-material/Crop";
+import TextFieldsIcon from "@mui/icons-material/TextFields";
+import PictureAsPdfIcon from "@mui/icons-material/PictureAsPdf";
+import EditIcon from "@mui/icons-material/Edit";
+import DeleteIcon from "@mui/icons-material/Delete";
+import FolderIcon from "@mui/icons-material/Folder";
+import CloudIcon from "@mui/icons-material/Cloud";
+import StorageIcon from "@mui/icons-material/Storage";
+import SearchIcon from "@mui/icons-material/Search";
+import DownloadIcon from "@mui/icons-material/Download";
+import UploadIcon from "@mui/icons-material/Upload";
+import PlayArrowIcon from "@mui/icons-material/PlayArrow";
+import RotateLeftIcon from "@mui/icons-material/RotateLeft";
+import RotateRightIcon from "@mui/icons-material/RotateRight";
+import VisibilityIcon from "@mui/icons-material/Visibility";
+import ContentCutIcon from "@mui/icons-material/ContentCut";
+import ContentCopyIcon from "@mui/icons-material/ContentCopy";
+import WorkIcon from "@mui/icons-material/Work";
+import BuildIcon from "@mui/icons-material/Build";
+import AutoAwesomeIcon from "@mui/icons-material/AutoAwesome";
+import SmartToyIcon from "@mui/icons-material/SmartToy";
+import CheckIcon from "@mui/icons-material/Check";
+import SecurityIcon from "@mui/icons-material/Security";
+import StarIcon from "@mui/icons-material/Star";
 
 export const iconMap = {
   SettingsIcon,
@@ -55,38 +55,38 @@ export const iconMap = {
   SmartToyIcon,
   CheckIcon,
   SecurityIcon,
-  StarIcon
+  StarIcon,
 };
 
 export const iconOptions = [
-  { value: 'SettingsIcon', label: 'Settings' },
-  { value: 'CompressIcon', label: 'Compress' },
-  { value: 'SwapHorizIcon', label: 'Convert' },
-  { value: 'CleaningServicesIcon', label: 'Clean' },
-  { value: 'CropIcon', label: 'Crop' },
-  { value: 'TextFieldsIcon', label: 'Text' },
-  { value: 'PictureAsPdfIcon', label: 'PDF' },
-  { value: 'EditIcon', label: 'Edit' },
-  { value: 'DeleteIcon', label: 'Delete' },
-  { value: 'FolderIcon', label: 'Folder' },
-  { value: 'CloudIcon', label: 'Cloud' },
-  { value: 'StorageIcon', label: 'Storage' },
-  { value: 'SearchIcon', label: 'Search' },
-  { value: 'DownloadIcon', label: 'Download' },
-  { value: 'UploadIcon', label: 'Upload' },
-  { value: 'PlayArrowIcon', label: 'Play' },
-  { value: 'RotateLeftIcon', label: 'Rotate Left' },
-  { value: 'RotateRightIcon', label: 'Rotate Right' },
-  { value: 'VisibilityIcon', label: 'View' },
-  { value: 'ContentCutIcon', label: 'Cut' },
-  { value: 'ContentCopyIcon', label: 'Copy' },
-  { value: 'WorkIcon', label: 'Work' },
-  { value: 'BuildIcon', label: 'Build' },
-  { value: 'AutoAwesomeIcon', label: 'Magic' },
-  { value: 'SmartToyIcon', label: 'Robot' },
-  { value: 'CheckIcon', label: 'Check' },
-  { value: 'SecurityIcon', label: 'Security' },
-  { value: 'StarIcon', label: 'Star' }
+  { value: "SettingsIcon", label: "Settings" },
+  { value: "CompressIcon", label: "Compress" },
+  { value: "SwapHorizIcon", label: "Convert" },
+  { value: "CleaningServicesIcon", label: "Clean" },
+  { value: "CropIcon", label: "Crop" },
+  { value: "TextFieldsIcon", label: "Text" },
+  { value: "PictureAsPdfIcon", label: "PDF" },
+  { value: "EditIcon", label: "Edit" },
+  { value: "DeleteIcon", label: "Delete" },
+  { value: "FolderIcon", label: "Folder" },
+  { value: "CloudIcon", label: "Cloud" },
+  { value: "StorageIcon", label: "Storage" },
+  { value: "SearchIcon", label: "Search" },
+  { value: "DownloadIcon", label: "Download" },
+  { value: "UploadIcon", label: "Upload" },
+  { value: "PlayArrowIcon", label: "Play" },
+  { value: "RotateLeftIcon", label: "Rotate Left" },
+  { value: "RotateRightIcon", label: "Rotate Right" },
+  { value: "VisibilityIcon", label: "View" },
+  { value: "ContentCutIcon", label: "Cut" },
+  { value: "ContentCopyIcon", label: "Copy" },
+  { value: "WorkIcon", label: "Work" },
+  { value: "BuildIcon", label: "Build" },
+  { value: "AutoAwesomeIcon", label: "Magic" },
+  { value: "SmartToyIcon", label: "Robot" },
+  { value: "CheckIcon", label: "Check" },
+  { value: "SecurityIcon", label: "Security" },
+  { value: "StarIcon", label: "Star" },
 ];
 
-export type IconKey = keyof typeof iconMap;
\ No newline at end of file
+export type IconKey = keyof typeof iconMap;
diff --git a/frontend/src/core/components/tools/bookletImposition/BookletImpositionSettings.tsx b/frontend/src/core/components/tools/bookletImposition/BookletImpositionSettings.tsx
index d9c6682295..5c2c5059d3 100644
--- a/frontend/src/core/components/tools/bookletImposition/BookletImpositionSettings.tsx
+++ b/frontend/src/core/components/tools/bookletImposition/BookletImpositionSettings.tsx
@@ -1,23 +1,37 @@
 import { useState } from "react";
 import { useTranslation } from "react-i18next";
-import { Stack, Text, Divider, Collapse, Button, NumberInput, Checkbox } from "@mantine/core";
+import {
+  Stack,
+  Text,
+  Divider,
+  Collapse,
+  Button,
+  NumberInput,
+  Checkbox,
+} from "@mantine/core";
 import { BookletImpositionParameters } from "@app/hooks/tools/bookletImposition/useBookletImpositionParameters";
 import ButtonSelector from "@app/components/shared/ButtonSelector";
 
 interface BookletImpositionSettingsProps {
   parameters: BookletImpositionParameters;
-  onParameterChange: (key: keyof BookletImpositionParameters, value: any) => void;
+  onParameterChange: (
+    key: keyof BookletImpositionParameters,
+    value: any,
+  ) => void;
   disabled?: boolean;
 }
 
-const BookletImpositionSettings = ({ parameters, onParameterChange, disabled = false }: BookletImpositionSettingsProps) => {
+const BookletImpositionSettings = ({
+  parameters,
+  onParameterChange,
+  disabled = false,
+}: BookletImpositionSettingsProps) => {
   const { t } = useTranslation();
   const [advancedOpen, setAdvancedOpen] = useState(false);
 
   return (
     <Stack gap="md">
-      <Divider ml='-md'></Divider>
-
+      <Divider ml="-md"></Divider>
 
       {/* Double Sided */}
       <Stack gap="sm">
@@ -25,20 +39,30 @@ const BookletImpositionSettings = ({ parameters, onParameterChange, disabled = f
           checked={parameters.doubleSided}
           onChange={(event) => {
             const isDoubleSided = event.currentTarget.checked;
-            onParameterChange('doubleSided', isDoubleSided);
+            onParameterChange("doubleSided", isDoubleSided);
             // Reset to BOTH when turning double-sided back on
             if (isDoubleSided) {
-              onParameterChange('duplexPass', 'BOTH');
+              onParameterChange("duplexPass", "BOTH");
             } else {
               // Default to FIRST pass when going to manual duplex
-              onParameterChange('duplexPass', 'FIRST');
+              onParameterChange("duplexPass", "FIRST");
             }
           }}
           disabled={disabled}
           label={
             <div>
-              <Text size="sm">{t('bookletImposition.doubleSided.label', 'Double-sided printing')}</Text>
-              <Text size="xs" c="dimmed">{t('bookletImposition.doubleSided.tooltip', 'Creates both front and back sides for proper booklet printing')}</Text>
+              <Text size="sm">
+                {t(
+                  "bookletImposition.doubleSided.label",
+                  "Double-sided printing",
+                )}
+              </Text>
+              <Text size="xs" c="dimmed">
+                {t(
+                  "bookletImposition.doubleSided.tooltip",
+                  "Creates both front and back sides for proper booklet printing",
+                )}
+              </Text>
             </div>
           }
         />
@@ -47,28 +71,42 @@ const BookletImpositionSettings = ({ parameters, onParameterChange, disabled = f
         {!parameters.doubleSided && (
           <Stack gap="xs" ml="lg">
             <Text size="sm" fw={500} c="orange">
-              {t('bookletImposition.manualDuplex.title', 'Manual Duplex Mode')}
+              {t("bookletImposition.manualDuplex.title", "Manual Duplex Mode")}
             </Text>
             <Text size="xs" c="dimmed">
-              {t('bookletImposition.manualDuplex.instructions', 'For printers without automatic duplex. You\'ll need to run this twice:')}
+              {t(
+                "bookletImposition.manualDuplex.instructions",
+                "For printers without automatic duplex. You'll need to run this twice:",
+              )}
             </Text>
 
             <ButtonSelector
-              label={t('bookletImposition.duplexPass.label', 'Print Pass')}
+              label={t("bookletImposition.duplexPass.label", "Print Pass")}
               value={parameters.duplexPass}
-              onChange={(value) => onParameterChange('duplexPass', value)}
+              onChange={(value) => onParameterChange("duplexPass", value)}
               options={[
-                { value: 'FIRST', label: t('bookletImposition.duplexPass.first', '1st Pass') },
-                { value: 'SECOND', label: t('bookletImposition.duplexPass.second', '2nd Pass') }
+                {
+                  value: "FIRST",
+                  label: t("bookletImposition.duplexPass.first", "1st Pass"),
+                },
+                {
+                  value: "SECOND",
+                  label: t("bookletImposition.duplexPass.second", "2nd Pass"),
+                },
               ]}
               disabled={disabled}
             />
 
             <Text size="xs" c="blue" fs="italic">
-              {parameters.duplexPass === 'FIRST'
-                ? t('bookletImposition.duplexPass.firstInstructions', 'Prints front sides → stack face-down → run again with 2nd Pass')
-                : t('bookletImposition.duplexPass.secondInstructions', 'Load printed stack face-down → prints back sides')
-              }
+              {parameters.duplexPass === "FIRST"
+                ? t(
+                    "bookletImposition.duplexPass.firstInstructions",
+                    "Prints front sides → stack face-down → run again with 2nd Pass",
+                  )
+                : t(
+                    "bookletImposition.duplexPass.secondInstructions",
+                    "Load printed stack face-down → prints back sides",
+                  )}
             </Text>
           </Stack>
         )}
@@ -83,20 +121,36 @@ const BookletImpositionSettings = ({ parameters, onParameterChange, disabled = f
           onClick={() => setAdvancedOpen(!advancedOpen)}
           disabled={disabled}
         >
-          {t('bookletImposition.advanced.toggle', 'Advanced Options')} {advancedOpen ? 'â–²' : 'â–¼'}
+          {t("bookletImposition.advanced.toggle", "Advanced Options")}{" "}
+          {advancedOpen ? "â–²" : "â–¼"}
         </Button>
 
         <Collapse in={advancedOpen}>
           <Stack gap="md" mt="md">
             {/* Right-to-Left Binding */}
             <Checkbox
-              checked={parameters.spineLocation === 'RIGHT'}
-              onChange={(event) => onParameterChange('spineLocation', event.currentTarget.checked ? 'RIGHT' : 'LEFT')}
+              checked={parameters.spineLocation === "RIGHT"}
+              onChange={(event) =>
+                onParameterChange(
+                  "spineLocation",
+                  event.currentTarget.checked ? "RIGHT" : "LEFT",
+                )
+              }
               disabled={disabled}
               label={
                 <div>
-                  <Text size="sm">{t('bookletImposition.rtlBinding.label', 'Right-to-left binding')}</Text>
-                  <Text size="xs" c="dimmed">{t('bookletImposition.rtlBinding.tooltip', 'For Arabic, Hebrew, or other right-to-left languages')}</Text>
+                  <Text size="sm">
+                    {t(
+                      "bookletImposition.rtlBinding.label",
+                      "Right-to-left binding",
+                    )}
+                  </Text>
+                  <Text size="xs" c="dimmed">
+                    {t(
+                      "bookletImposition.rtlBinding.tooltip",
+                      "For Arabic, Hebrew, or other right-to-left languages",
+                    )}
+                  </Text>
                 </div>
               }
             />
@@ -104,12 +158,24 @@ const BookletImpositionSettings = ({ parameters, onParameterChange, disabled = f
             {/* Add Border Option */}
             <Checkbox
               checked={parameters.addBorder}
-              onChange={(event) => onParameterChange('addBorder', event.currentTarget.checked)}
+              onChange={(event) =>
+                onParameterChange("addBorder", event.currentTarget.checked)
+              }
               disabled={disabled}
               label={
                 <div>
-                  <Text size="sm">{t('bookletImposition.addBorder.label', 'Add borders around pages')}</Text>
-                  <Text size="xs" c="dimmed">{t('bookletImposition.addBorder.tooltip', 'Adds borders around each page section to help with cutting and alignment')}</Text>
+                  <Text size="sm">
+                    {t(
+                      "bookletImposition.addBorder.label",
+                      "Add borders around pages",
+                    )}
+                  </Text>
+                  <Text size="xs" c="dimmed">
+                    {t(
+                      "bookletImposition.addBorder.tooltip",
+                      "Adds borders around each page section to help with cutting and alignment",
+                    )}
+                  </Text>
                 </div>
               }
             />
@@ -118,21 +184,38 @@ const BookletImpositionSettings = ({ parameters, onParameterChange, disabled = f
             <Stack gap="xs">
               <Checkbox
                 checked={parameters.addGutter}
-                onChange={(event) => onParameterChange('addGutter', event.currentTarget.checked)}
+                onChange={(event) =>
+                  onParameterChange("addGutter", event.currentTarget.checked)
+                }
                 disabled={disabled}
                 label={
                   <div>
-                    <Text size="sm">{t('bookletImposition.addGutter.label', 'Add gutter margin')}</Text>
-                    <Text size="xs" c="dimmed">{t('bookletImposition.addGutter.tooltip', 'Adds inner margin space for binding')}</Text>
+                    <Text size="sm">
+                      {t(
+                        "bookletImposition.addGutter.label",
+                        "Add gutter margin",
+                      )}
+                    </Text>
+                    <Text size="xs" c="dimmed">
+                      {t(
+                        "bookletImposition.addGutter.tooltip",
+                        "Adds inner margin space for binding",
+                      )}
+                    </Text>
                   </div>
                 }
               />
 
               {parameters.addGutter && (
                 <NumberInput
-                  label={t('bookletImposition.gutterSize.label', 'Gutter size (points)')}
+                  label={t(
+                    "bookletImposition.gutterSize.label",
+                    "Gutter size (points)",
+                  )}
                   value={parameters.gutterSize}
-                  onChange={(value) => onParameterChange('gutterSize', value || 12)}
+                  onChange={(value) =>
+                    onParameterChange("gutterSize", value || 12)
+                  }
                   min={6}
                   max={72}
                   step={6}
@@ -145,18 +228,34 @@ const BookletImpositionSettings = ({ parameters, onParameterChange, disabled = f
             {/* Flip on Short Edge */}
             <Checkbox
               checked={parameters.flipOnShortEdge}
-              onChange={(event) => onParameterChange('flipOnShortEdge', event.currentTarget.checked)}
+              onChange={(event) =>
+                onParameterChange(
+                  "flipOnShortEdge",
+                  event.currentTarget.checked,
+                )
+              }
               disabled={disabled || !parameters.doubleSided}
               label={
                 <div>
-                  <Text size="sm" c={!parameters.doubleSided ? "dimmed" : undefined}>
-                    {t('bookletImposition.flipOnShortEdge.label', 'Flip on short edge')}
+                  <Text
+                    size="sm"
+                    c={!parameters.doubleSided ? "dimmed" : undefined}
+                  >
+                    {t(
+                      "bookletImposition.flipOnShortEdge.label",
+                      "Flip on short edge",
+                    )}
                   </Text>
                   <Text size="xs" c="dimmed">
                     {!parameters.doubleSided
-                      ? t('bookletImposition.flipOnShortEdge.manualNote', 'Not needed in manual mode - you flip the stack yourself')
-                      : t('bookletImposition.flipOnShortEdge.tooltip', 'Enable for short-edge duplex printing (automatic duplex only - ignored in manual mode)')
-                    }
+                      ? t(
+                          "bookletImposition.flipOnShortEdge.manualNote",
+                          "Not needed in manual mode - you flip the stack yourself",
+                        )
+                      : t(
+                          "bookletImposition.flipOnShortEdge.tooltip",
+                          "Enable for short-edge duplex printing (automatic duplex only - ignored in manual mode)",
+                        )}
                   </Text>
                 </div>
               }
@@ -164,7 +263,10 @@ const BookletImpositionSettings = ({ parameters, onParameterChange, disabled = f
 
             {/* Paper Size Note */}
             <Text size="xs" c="dimmed" fs="italic">
-              {t('bookletImposition.paperSizeNote', 'Paper size is automatically derived from your first page.')}
+              {t(
+                "bookletImposition.paperSizeNote",
+                "Paper size is automatically derived from your first page.",
+              )}
             </Text>
           </Stack>
         </Collapse>
diff --git a/frontend/src/core/components/tools/certSign/CertSignAutomationSettings.tsx b/frontend/src/core/components/tools/certSign/CertSignAutomationSettings.tsx
index 0c4aed6a3a..7797441027 100644
--- a/frontend/src/core/components/tools/certSign/CertSignAutomationSettings.tsx
+++ b/frontend/src/core/components/tools/certSign/CertSignAutomationSettings.tsx
@@ -15,11 +15,18 @@ import SignatureAppearanceSettings from "@app/components/tools/certSign/Signatur
 
 interface CertSignAutomationSettingsProps {
   parameters: CertSignParameters;
-  onParameterChange: <K extends keyof CertSignParameters>(key: K, value: CertSignParameters[K]) => void;
+  onParameterChange: <K extends keyof CertSignParameters>(
+    key: K,
+    value: CertSignParameters[K],
+  ) => void;
   disabled?: boolean;
 }
 
-const CertSignAutomationSettings = ({ parameters, onParameterChange, disabled = false }: CertSignAutomationSettingsProps) => {
+const CertSignAutomationSettings = ({
+  parameters,
+  onParameterChange,
+  disabled = false,
+}: CertSignAutomationSettingsProps) => {
   return (
     <Stack gap="lg">
       {/* Sign Mode Selection (Manual vs Auto) */}
@@ -30,7 +37,7 @@ const CertSignAutomationSettings = ({ parameters, onParameterChange, disabled =
       />
 
       {/* Certificate Format - only show for Manual mode */}
-      {parameters.signMode === 'MANUAL' && (
+      {parameters.signMode === "MANUAL" && (
         <CertificateFormatSettings
           parameters={parameters}
           onParameterChange={onParameterChange}
@@ -39,7 +46,7 @@ const CertSignAutomationSettings = ({ parameters, onParameterChange, disabled =
       )}
 
       {/* Certificate Files - only show for Manual mode */}
-      {parameters.signMode === 'MANUAL' && (
+      {parameters.signMode === "MANUAL" && (
         <CertificateFilesSettings
           parameters={parameters}
           onParameterChange={onParameterChange}
diff --git a/frontend/src/core/components/tools/certSign/CertificateFilesSettings.tsx b/frontend/src/core/components/tools/certSign/CertificateFilesSettings.tsx
index 6e6df830c1..035f57e5c4 100644
--- a/frontend/src/core/components/tools/certSign/CertificateFilesSettings.tsx
+++ b/frontend/src/core/components/tools/certSign/CertificateFilesSettings.tsx
@@ -9,79 +9,102 @@ interface CertificateFilesSettingsProps {
   disabled?: boolean;
 }
 
-const CertificateFilesSettings = ({ parameters, onParameterChange, disabled = false }: CertificateFilesSettingsProps) => {
+const CertificateFilesSettings = ({
+  parameters,
+  onParameterChange,
+  disabled = false,
+}: CertificateFilesSettingsProps) => {
   const { t } = useTranslation();
 
   return (
     <Stack gap="md">
       {/* Certificate Files based on type */}
-      {parameters.certType === 'PEM' && (
+      {parameters.certType === "PEM" && (
         <Stack gap="sm">
           <FileUploadButton
             file={parameters.privateKeyFile}
-            onChange={(file) => onParameterChange('privateKeyFile', file || undefined)}
+            onChange={(file) =>
+              onParameterChange("privateKeyFile", file || undefined)
+            }
             accept=".pem,.der,.key"
             disabled={disabled}
-            placeholder={t('certSign.choosePrivateKey', 'Choose Private Key File')}
+            placeholder={t(
+              "certSign.choosePrivateKey",
+              "Choose Private Key File",
+            )}
           />
           {parameters.privateKeyFile && (
             <FileUploadButton
               file={parameters.certFile}
-              onChange={(file) => onParameterChange('certFile', file || undefined)}
+              onChange={(file) =>
+                onParameterChange("certFile", file || undefined)
+              }
               accept=".pem,.der,.crt,.cer"
               disabled={disabled}
-              placeholder={t('certSign.chooseCertificate', 'Choose Certificate File')}
+              placeholder={t(
+                "certSign.chooseCertificate",
+                "Choose Certificate File",
+              )}
             />
           )}
         </Stack>
       )}
 
-      {(parameters.certType === 'PKCS12' || parameters.certType === 'PFX') && (
+      {(parameters.certType === "PKCS12" || parameters.certType === "PFX") && (
         <FileUploadButton
           file={parameters.p12File}
-          onChange={(file) => onParameterChange('p12File', file || undefined)}
+          onChange={(file) => onParameterChange("p12File", file || undefined)}
           accept=".p12,.pfx"
           disabled={disabled}
           placeholder={
-            parameters.certType === 'PFX'
-              ? t('certSign.choosePfxFile', 'Choose PFX File')
-              : t('certSign.chooseP12File', 'Choose PKCS12 File')
+            parameters.certType === "PFX"
+              ? t("certSign.choosePfxFile", "Choose PFX File")
+              : t("certSign.chooseP12File", "Choose PKCS12 File")
           }
         />
       )}
 
-      {parameters.certType === 'JKS' && (
+      {parameters.certType === "JKS" && (
         <FileUploadButton
           file={parameters.jksFile}
-          onChange={(file) => onParameterChange('jksFile', file || undefined)}
+          onChange={(file) => onParameterChange("jksFile", file || undefined)}
           accept=".jks,.keystore"
           disabled={disabled}
-          placeholder={t('certSign.chooseJksFile', 'Choose JKS File')}
+          placeholder={t("certSign.chooseJksFile", "Choose JKS File")}
         />
       )}
 
-      {parameters.signMode === 'AUTO' && (
+      {parameters.signMode === "AUTO" && (
         <Text c="dimmed" size="sm">
-          {t('certSign.serverCertMessage', 'Using server certificate - no files or password required')}
+          {t(
+            "certSign.serverCertMessage",
+            "Using server certificate - no files or password required",
+          )}
         </Text>
       )}
 
       {/* Password - only show when files are uploaded */}
-      {parameters.certType && (
-        (parameters.certType === 'PEM' && parameters.privateKeyFile && parameters.certFile) ||
-        (parameters.certType === 'PKCS12' && parameters.p12File) ||
-        (parameters.certType === 'PFX' && parameters.p12File) ||
-        (parameters.certType === 'JKS' && parameters.jksFile)
-      ) && (
-        <TextInput
-          label={t('certSign.password', 'Certificate Password')}
-          placeholder={t('certSign.passwordOptional', 'Leave empty if no password')}
-          type="password"
-          value={parameters.password}
-          onChange={(event) => onParameterChange('password', event.currentTarget.value)}
-          disabled={disabled}
-        />
-      )}
+      {parameters.certType &&
+        ((parameters.certType === "PEM" &&
+          parameters.privateKeyFile &&
+          parameters.certFile) ||
+          (parameters.certType === "PKCS12" && parameters.p12File) ||
+          (parameters.certType === "PFX" && parameters.p12File) ||
+          (parameters.certType === "JKS" && parameters.jksFile)) && (
+          <TextInput
+            label={t("certSign.password", "Certificate Password")}
+            placeholder={t(
+              "certSign.passwordOptional",
+              "Leave empty if no password",
+            )}
+            type="password"
+            value={parameters.password}
+            onChange={(event) =>
+              onParameterChange("password", event.currentTarget.value)
+            }
+            disabled={disabled}
+          />
+        )}
     </Stack>
   );
 };
diff --git a/frontend/src/core/components/tools/certSign/CertificateFormatSettings.tsx b/frontend/src/core/components/tools/certSign/CertificateFormatSettings.tsx
index 6e584618ee..135d564537 100644
--- a/frontend/src/core/components/tools/certSign/CertificateFormatSettings.tsx
+++ b/frontend/src/core/components/tools/certSign/CertificateFormatSettings.tsx
@@ -7,57 +7,106 @@ interface CertificateFormatSettingsProps {
   disabled?: boolean;
 }
 
-const CertificateFormatSettings = ({ parameters, onParameterChange, disabled = false }: CertificateFormatSettingsProps) => {
-
+const CertificateFormatSettings = ({
+  parameters,
+  onParameterChange,
+  disabled = false,
+}: CertificateFormatSettingsProps) => {
   return (
     <Stack gap="md">
-      <div style={{ display: 'flex', flexDirection: 'column', gap: '4px' }}>
+      <div style={{ display: "flex", flexDirection: "column", gap: "4px" }}>
         {/* First row - PKCS#12 and PFX */}
-        <div style={{ display: 'flex', gap: '4px' }}>
+        <div style={{ display: "flex", gap: "4px" }}>
           <Button
-            variant={parameters.certType === 'PKCS12' ? 'filled' : 'outline'}
-            color={parameters.certType === 'PKCS12' ? 'blue' : 'var(--text-muted)'}
-            onClick={() => onParameterChange('certType', 'PKCS12')}
+            variant={parameters.certType === "PKCS12" ? "filled" : "outline"}
+            color={
+              parameters.certType === "PKCS12" ? "blue" : "var(--text-muted)"
+            }
+            onClick={() => onParameterChange("certType", "PKCS12")}
             disabled={disabled}
-            style={{ flex: 1, height: 'auto', minHeight: '40px', fontSize: '11px' }}
+            style={{
+              flex: 1,
+              height: "auto",
+              minHeight: "40px",
+              fontSize: "11px",
+            }}
           >
-            <div style={{ textAlign: 'center', lineHeight: '1.1', fontSize: '11px' }}>
+            <div
+              style={{
+                textAlign: "center",
+                lineHeight: "1.1",
+                fontSize: "11px",
+              }}
+            >
               PKCS12
             </div>
           </Button>
           <Button
-            variant={parameters.certType === 'PFX' ? 'filled' : 'outline'}
-            color={parameters.certType === 'PFX' ? 'blue' : 'var(--text-muted)'}
-            onClick={() => onParameterChange('certType', 'PFX')}
+            variant={parameters.certType === "PFX" ? "filled" : "outline"}
+            color={parameters.certType === "PFX" ? "blue" : "var(--text-muted)"}
+            onClick={() => onParameterChange("certType", "PFX")}
             disabled={disabled}
-            style={{ flex: 1, height: 'auto', minHeight: '40px', fontSize: '11px' }}
+            style={{
+              flex: 1,
+              height: "auto",
+              minHeight: "40px",
+              fontSize: "11px",
+            }}
           >
-            <div style={{ textAlign: 'center', lineHeight: '1.1', fontSize: '11px' }}>
+            <div
+              style={{
+                textAlign: "center",
+                lineHeight: "1.1",
+                fontSize: "11px",
+              }}
+            >
               PFX
             </div>
           </Button>
         </div>
         {/* Second row - PEM and JKS */}
-        <div style={{ display: 'flex', gap: '4px' }}>
+        <div style={{ display: "flex", gap: "4px" }}>
           <Button
-            variant={parameters.certType === 'PEM' ? 'filled' : 'outline'}
-            color={parameters.certType === 'PEM' ? 'blue' : 'var(--text-muted)'}
-            onClick={() => onParameterChange('certType', 'PEM')}
+            variant={parameters.certType === "PEM" ? "filled" : "outline"}
+            color={parameters.certType === "PEM" ? "blue" : "var(--text-muted)"}
+            onClick={() => onParameterChange("certType", "PEM")}
             disabled={disabled}
-            style={{ flex: 1, height: 'auto', minHeight: '40px', fontSize: '11px' }}
+            style={{
+              flex: 1,
+              height: "auto",
+              minHeight: "40px",
+              fontSize: "11px",
+            }}
           >
-            <div style={{ textAlign: 'center', lineHeight: '1.1', fontSize: '11px' }}>
+            <div
+              style={{
+                textAlign: "center",
+                lineHeight: "1.1",
+                fontSize: "11px",
+              }}
+            >
               PEM
             </div>
           </Button>
           <Button
-            variant={parameters.certType === 'JKS' ? 'filled' : 'outline'}
-            color={parameters.certType === 'JKS' ? 'blue' : 'var(--text-muted)'}
-            onClick={() => onParameterChange('certType', 'JKS')}
+            variant={parameters.certType === "JKS" ? "filled" : "outline"}
+            color={parameters.certType === "JKS" ? "blue" : "var(--text-muted)"}
+            onClick={() => onParameterChange("certType", "JKS")}
             disabled={disabled}
-            style={{ flex: 1, height: 'auto', minHeight: '40px', fontSize: '11px' }}
+            style={{
+              flex: 1,
+              height: "auto",
+              minHeight: "40px",
+              fontSize: "11px",
+            }}
           >
-            <div style={{ textAlign: 'center', lineHeight: '1.1', fontSize: '11px' }}>
+            <div
+              style={{
+                textAlign: "center",
+                lineHeight: "1.1",
+                fontSize: "11px",
+              }}
+            >
               JKS
             </div>
           </Button>
@@ -67,4 +116,4 @@ const CertificateFormatSettings = ({ parameters, onParameterChange, disabled = f
   );
 };
 
-export default CertificateFormatSettings;
\ No newline at end of file
+export default CertificateFormatSettings;
diff --git a/frontend/src/core/components/tools/certSign/CertificateSelector.tsx b/frontend/src/core/components/tools/certSign/CertificateSelector.tsx
index ab35e7e3ef..959ea4b192 100644
--- a/frontend/src/core/components/tools/certSign/CertificateSelector.tsx
+++ b/frontend/src/core/components/tools/certSign/CertificateSelector.tsx
@@ -1,11 +1,19 @@
-import { Stack, Radio, Divider, TextInput, Text, Group, Button } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { useEffect } from 'react';
-import { useAppConfig } from '@app/contexts/AppConfigContext';
-import FileUploadButton from '@app/components/shared/FileUploadButton';
+import {
+  Stack,
+  Radio,
+  Divider,
+  TextInput,
+  Text,
+  Group,
+  Button,
+} from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import { useEffect } from "react";
+import { useAppConfig } from "@app/contexts/AppConfigContext";
+import FileUploadButton from "@app/components/shared/FileUploadButton";
 
-export type CertificateType = 'USER_CERT' | 'SERVER' | 'UPLOAD';
-export type UploadFormat = 'PKCS12' | 'PFX' | 'PEM' | 'JKS';
+export type CertificateType = "USER_CERT" | "SERVER" | "UPLOAD";
+export type UploadFormat = "PKCS12" | "PFX" | "PEM" | "JKS";
 
 interface CertificateSelectorProps {
   certType: CertificateType;
@@ -48,8 +56,8 @@ export const CertificateSelector: React.FC<CertificateSelectorProps> = ({
 
   // If managed cert types are not available, reset to UPLOAD
   useEffect(() => {
-    if (!isServerPlan && (certType === 'USER_CERT' || certType === 'SERVER')) {
-      onCertTypeChange('UPLOAD');
+    if (!isServerPlan && (certType === "USER_CERT" || certType === "SERVER")) {
+      onCertTypeChange("UPLOAD");
     }
   }, [isServerPlan, certType, onCertTypeChange]);
 
@@ -59,13 +67,13 @@ export const CertificateSelector: React.FC<CertificateSelectorProps> = ({
     onPrivateKeyFileChange(null);
     onCertFileChange(null);
     onJksFileChange(null);
-    onPasswordChange('');
+    onPasswordChange("");
   };
 
   const showPassword =
-    ((uploadFormat === 'PKCS12' || uploadFormat === 'PFX') && p12File) ||
-    (uploadFormat === 'PEM' && privateKeyFile && certFile) ||
-    (uploadFormat === 'JKS' && jksFile);
+    ((uploadFormat === "PKCS12" || uploadFormat === "PFX") && p12File) ||
+    (uploadFormat === "PEM" && privateKeyFile && certFile) ||
+    (uploadFormat === "JKS" && jksFile);
 
   return (
     <Stack gap="md">
@@ -82,10 +90,16 @@ export const CertificateSelector: React.FC<CertificateSelectorProps> = ({
               label={
                 <Stack gap={1}>
                   <Text size="sm" fw={500}>
-                    {t('certSign.collab.signRequest.usePersonalCert', 'Personal Certificate')}
+                    {t(
+                      "certSign.collab.signRequest.usePersonalCert",
+                      "Personal Certificate",
+                    )}
                   </Text>
                   <Text size="xs" c="dimmed">
-                    {t('certSign.collab.signRequest.usePersonalCertDesc', 'Auto-generated for your account')}
+                    {t(
+                      "certSign.collab.signRequest.usePersonalCertDesc",
+                      "Auto-generated for your account",
+                    )}
                   </Text>
                 </Stack>
               }
@@ -96,10 +110,16 @@ export const CertificateSelector: React.FC<CertificateSelectorProps> = ({
               label={
                 <Stack gap={1}>
                   <Text size="sm" fw={500}>
-                    {t('certSign.collab.signRequest.useServerCert', 'Organization Certificate')}
+                    {t(
+                      "certSign.collab.signRequest.useServerCert",
+                      "Organization Certificate",
+                    )}
                   </Text>
                   <Text size="xs" c="dimmed">
-                    {t('certSign.collab.signRequest.useServerCertDesc', 'Shared organization certificate')}
+                    {t(
+                      "certSign.collab.signRequest.useServerCertDesc",
+                      "Shared organization certificate",
+                    )}
                   </Text>
                 </Stack>
               }
@@ -109,7 +129,10 @@ export const CertificateSelector: React.FC<CertificateSelectorProps> = ({
               disabled={disabled}
               label={
                 <Text size="sm" fw={500}>
-                  {t('certSign.collab.signRequest.uploadCert', 'Custom Certificate')}
+                  {t(
+                    "certSign.collab.signRequest.uploadCert",
+                    "Custom Certificate",
+                  )}
                 </Text>
               }
             />
@@ -118,22 +141,25 @@ export const CertificateSelector: React.FC<CertificateSelectorProps> = ({
       )}
 
       {/* Upload section */}
-      {certType === 'UPLOAD' && (
+      {certType === "UPLOAD" && (
         <Stack gap="sm">
           {isServerPlan && (
             <Divider
-              label={t('certSign.collab.signRequest.uploadCert', 'Custom Certificate')}
+              label={t(
+                "certSign.collab.signRequest.uploadCert",
+                "Custom Certificate",
+              )}
               labelPosition="left"
             />
           )}
 
           {/* Format picker */}
           <Group gap="xs">
-            {(['PKCS12', 'PFX', 'PEM', 'JKS'] as UploadFormat[]).map((fmt) => (
+            {(["PKCS12", "PFX", "PEM", "JKS"] as UploadFormat[]).map((fmt) => (
               <Button
                 key={fmt}
                 size="xs"
-                variant={uploadFormat === fmt ? 'filled' : 'light'}
+                variant={uploadFormat === fmt ? "filled" : "light"}
                 onClick={() => handleFormatChange(fmt)}
                 disabled={disabled}
               >
@@ -143,29 +169,32 @@ export const CertificateSelector: React.FC<CertificateSelectorProps> = ({
           </Group>
 
           {/* PKCS12 / PFX */}
-          {(uploadFormat === 'PKCS12' || uploadFormat === 'PFX') && (
+          {(uploadFormat === "PKCS12" || uploadFormat === "PFX") && (
             <FileUploadButton
               file={p12File ?? undefined}
               onChange={(file) => onP12FileChange(file || null)}
               accept=".p12,.pfx"
               disabled={disabled}
               placeholder={
-                uploadFormat === 'PFX'
-                  ? t('certSign.choosePfxFile', 'Choose PFX File')
-                  : t('certSign.chooseP12File', 'Choose PKCS12 File')
+                uploadFormat === "PFX"
+                  ? t("certSign.choosePfxFile", "Choose PFX File")
+                  : t("certSign.chooseP12File", "Choose PKCS12 File")
               }
             />
           )}
 
           {/* PEM */}
-          {uploadFormat === 'PEM' && (
+          {uploadFormat === "PEM" && (
             <Stack gap="xs">
               <FileUploadButton
                 file={privateKeyFile ?? undefined}
                 onChange={(file) => onPrivateKeyFileChange(file || null)}
                 accept=".pem,.der,.key"
                 disabled={disabled}
-                placeholder={t('certSign.choosePrivateKey', 'Choose Private Key File')}
+                placeholder={t(
+                  "certSign.choosePrivateKey",
+                  "Choose Private Key File",
+                )}
               />
               {privateKeyFile && (
                 <FileUploadButton
@@ -173,29 +202,38 @@ export const CertificateSelector: React.FC<CertificateSelectorProps> = ({
                   onChange={(file) => onCertFileChange(file || null)}
                   accept=".pem,.der,.crt,.cer"
                   disabled={disabled}
-                  placeholder={t('certSign.chooseCertificate', 'Choose Certificate File')}
+                  placeholder={t(
+                    "certSign.chooseCertificate",
+                    "Choose Certificate File",
+                  )}
                 />
               )}
             </Stack>
           )}
 
           {/* JKS */}
-          {uploadFormat === 'JKS' && (
+          {uploadFormat === "JKS" && (
             <FileUploadButton
               file={jksFile ?? undefined}
               onChange={(file) => onJksFileChange(file || null)}
               accept=".jks,.keystore"
               disabled={disabled}
-              placeholder={t('certSign.chooseJksFile', 'Choose JKS File')}
+              placeholder={t("certSign.chooseJksFile", "Choose JKS File")}
             />
           )}
 
           {/* Password */}
           {showPassword && (
             <TextInput
-              label={t('certSign.collab.signRequest.password', 'Certificate Password')}
+              label={t(
+                "certSign.collab.signRequest.password",
+                "Certificate Password",
+              )}
               type="password"
-              placeholder={t('certSign.passwordOptional', 'Leave empty if no password')}
+              placeholder={t(
+                "certSign.passwordOptional",
+                "Leave empty if no password",
+              )}
               value={password}
               onChange={(e) => onPasswordChange(e.target.value)}
               disabled={disabled}
diff --git a/frontend/src/core/components/tools/certSign/CertificateTypeSettings.tsx b/frontend/src/core/components/tools/certSign/CertificateTypeSettings.tsx
index 4cf85c66cd..decfe63a4b 100644
--- a/frontend/src/core/components/tools/certSign/CertificateTypeSettings.tsx
+++ b/frontend/src/core/components/tools/certSign/CertificateTypeSettings.tsx
@@ -8,48 +8,74 @@ interface CertificateTypeSettingsProps {
   disabled?: boolean;
 }
 
-const CertificateTypeSettings = ({ parameters, onParameterChange, disabled = false }: CertificateTypeSettingsProps) => {
+const CertificateTypeSettings = ({
+  parameters,
+  onParameterChange,
+  disabled = false,
+}: CertificateTypeSettingsProps) => {
   const { config } = useAppConfig();
   const isServerCertificateEnabled = config?.serverCertificateEnabled ?? false;
 
   // Reset to MANUAL if AUTO is selected but feature is disabled
-  if (parameters.signMode === 'AUTO' && !isServerCertificateEnabled) {
-    onParameterChange('signMode', 'MANUAL');
+  if (parameters.signMode === "AUTO" && !isServerCertificateEnabled) {
+    onParameterChange("signMode", "MANUAL");
   }
 
   return (
     <Stack gap="md">
-      <div style={{ display: 'flex', gap: '4px' }}>
+      <div style={{ display: "flex", gap: "4px" }}>
         <Button
-          variant={parameters.signMode === 'MANUAL' ? 'filled' : 'outline'}
-          color={parameters.signMode === 'MANUAL' ? 'blue' : 'var(--text-muted)'}
+          variant={parameters.signMode === "MANUAL" ? "filled" : "outline"}
+          color={
+            parameters.signMode === "MANUAL" ? "blue" : "var(--text-muted)"
+          }
           onClick={() => {
-            onParameterChange('signMode', 'MANUAL');
+            onParameterChange("signMode", "MANUAL");
             // Reset cert type when switching to manual
-            if (parameters.signMode === 'AUTO') {
-              onParameterChange('certType', '');
+            if (parameters.signMode === "AUTO") {
+              onParameterChange("certType", "");
             }
           }}
           disabled={disabled}
-          style={{ flex: 1, height: 'auto', minHeight: '40px', fontSize: '11px' }}
+          style={{
+            flex: 1,
+            height: "auto",
+            minHeight: "40px",
+            fontSize: "11px",
+          }}
         >
-          <div style={{ textAlign: 'center', lineHeight: '1.1', fontSize: '11px' }}>
+          <div
+            style={{ textAlign: "center", lineHeight: "1.1", fontSize: "11px" }}
+          >
             Manual
           </div>
         </Button>
         {isServerCertificateEnabled && (
           <Button
-            variant={parameters.signMode === 'AUTO' ? 'filled' : 'outline'}
-            color={parameters.signMode === 'AUTO' ? 'green' : 'var(--text-muted)'}
+            variant={parameters.signMode === "AUTO" ? "filled" : "outline"}
+            color={
+              parameters.signMode === "AUTO" ? "green" : "var(--text-muted)"
+            }
             onClick={() => {
-              onParameterChange('signMode', 'AUTO');
+              onParameterChange("signMode", "AUTO");
               // Clear cert type and files when switching to auto
-              onParameterChange('certType', '');
+              onParameterChange("certType", "");
             }}
             disabled={disabled}
-            style={{ flex: 1, height: 'auto', minHeight: '40px', fontSize: '11px' }}
+            style={{
+              flex: 1,
+              height: "auto",
+              minHeight: "40px",
+              fontSize: "11px",
+            }}
           >
-            <div style={{ textAlign: 'center', lineHeight: '1.1', fontSize: '11px' }}>
+            <div
+              style={{
+                textAlign: "center",
+                lineHeight: "1.1",
+                fontSize: "11px",
+              }}
+            >
               Auto (server)
             </div>
           </Button>
diff --git a/frontend/src/core/components/tools/certSign/SessionDetailWorkbenchView.tsx b/frontend/src/core/components/tools/certSign/SessionDetailWorkbenchView.tsx
index afb4c28a77..3408f76b50 100644
--- a/frontend/src/core/components/tools/certSign/SessionDetailWorkbenchView.tsx
+++ b/frontend/src/core/components/tools/certSign/SessionDetailWorkbenchView.tsx
@@ -1,27 +1,44 @@
-import { useState, useEffect, useMemo, useRef } from 'react';
-import { useTranslation } from 'react-i18next';
-import { Stack, Paper, Text, Group, Badge, Button, Divider, Modal, SegmentedControl } from '@mantine/core';
-import { useIsPhone } from '@app/hooks/useIsMobile';
-import { alert } from '@app/components/toast';
-import ArrowBackIcon from '@mui/icons-material/ArrowBack';
-import DeleteIcon from '@mui/icons-material/Delete';
-import ZoomInIcon from '@mui/icons-material/ZoomIn';
-import ZoomOutIcon from '@mui/icons-material/ZoomOut';
-import ZoomOutMapIcon from '@mui/icons-material/ZoomOutMap';
-import { Z_INDEX_FULLSCREEN_SURFACE } from '@app/styles/zIndex';
-import { SessionDetail } from '@app/types/signingSession';
-import { LocalEmbedPDFWithAnnotations, SignaturePreview, AnnotationAPI } from '@app/components/viewer/LocalEmbedPDFWithAnnotations';
-import { getFileColor } from '@app/components/pageEditor/fileColors';
-import { ParticipantListPanel } from '@app/components/tools/certSign/panels/ParticipantListPanel';
-import { SessionActionsPanel } from '@app/components/tools/certSign/panels/SessionActionsPanel';
-import { AddParticipantsFlow } from '@app/components/tools/certSign/modals/AddParticipantsFlow';
+import { useState, useEffect, useMemo, useRef } from "react";
+import { useTranslation } from "react-i18next";
+import {
+  Stack,
+  Paper,
+  Text,
+  Group,
+  Badge,
+  Button,
+  Divider,
+  Modal,
+  SegmentedControl,
+} from "@mantine/core";
+import { useIsPhone } from "@app/hooks/useIsMobile";
+import { alert } from "@app/components/toast";
+import ArrowBackIcon from "@mui/icons-material/ArrowBack";
+import DeleteIcon from "@mui/icons-material/Delete";
+import ZoomInIcon from "@mui/icons-material/ZoomIn";
+import ZoomOutIcon from "@mui/icons-material/ZoomOut";
+import ZoomOutMapIcon from "@mui/icons-material/ZoomOutMap";
+import { Z_INDEX_FULLSCREEN_SURFACE } from "@app/styles/zIndex";
+import { SessionDetail } from "@app/types/signingSession";
+import {
+  LocalEmbedPDFWithAnnotations,
+  SignaturePreview,
+  AnnotationAPI,
+} from "@app/components/viewer/LocalEmbedPDFWithAnnotations";
+import { getFileColor } from "@app/components/pageEditor/fileColors";
+import { ParticipantListPanel } from "@app/components/tools/certSign/panels/ParticipantListPanel";
+import { SessionActionsPanel } from "@app/components/tools/certSign/panels/SessionActionsPanel";
+import { AddParticipantsFlow } from "@app/components/tools/certSign/modals/AddParticipantsFlow";
 
 export interface SessionDetailWorkbenchData {
   session: SessionDetail;
   pdfFile: File | null;
   onFinalize: () => Promise<void>;
   onLoadSignedPdf: () => Promise<void>;
-  onAddParticipants: (userIds: number[], defaultReason?: string) => Promise<void>;
+  onAddParticipants: (
+    userIds: number[],
+    defaultReason?: string,
+  ) => Promise<void>;
   onRemoveParticipant: (participantId: number) => Promise<void>;
   onDelete: () => Promise<void>;
   onBack: () => void;
@@ -32,10 +49,14 @@ interface SessionDetailWorkbenchViewProps {
   data: SessionDetailWorkbenchData;
 }
 
-const SessionDetailWorkbenchView = ({ data }: SessionDetailWorkbenchViewProps) => {
+const SessionDetailWorkbenchView = ({
+  data,
+}: SessionDetailWorkbenchViewProps) => {
   const { t } = useTranslation();
   const isPhone = useIsPhone();
-  const [mobilePanel, setMobilePanel] = useState<'participants' | 'pdf' | 'actions'>('pdf');
+  const [mobilePanel, setMobilePanel] = useState<
+    "participants" | "pdf" | "actions"
+  >("pdf");
   const {
     session,
     pdfFile,
@@ -52,7 +73,8 @@ const SessionDetailWorkbenchView = ({ data }: SessionDetailWorkbenchViewProps) =
   const annotationApiRef = useRef<AnnotationAPI | null>(null);
 
   const [deleteModalOpen, setDeleteModalOpen] = useState(false);
-  const [addParticipantsModalOpen, setAddParticipantsModalOpen] = useState(false);
+  const [addParticipantsModalOpen, setAddParticipantsModalOpen] =
+    useState(false);
   const [finalizing, setFinalizing] = useState(false);
   const [deleting, setDeleting] = useState(false);
   const [loadingPdf, setLoadingPdf] = useState(false);
@@ -67,19 +89,28 @@ const SessionDetailWorkbenchView = ({ data }: SessionDetailWorkbenchViewProps) =
     }
   }, [session.finalized, onRefresh]);
 
-  const handleAddParticipants = async (userIds: number[], defaultReason?: string) => {
+  const handleAddParticipants = async (
+    userIds: number[],
+    defaultReason?: string,
+  ) => {
     try {
       await onAddParticipants(userIds, defaultReason);
       alert({
-        alertType: 'success',
-        title: t('success'),
-        body: t('certSign.collab.sessionDetail.participantsAdded', 'Participants added successfully'),
+        alertType: "success",
+        title: t("success"),
+        body: t(
+          "certSign.collab.sessionDetail.participantsAdded",
+          "Participants added successfully",
+        ),
       });
     } catch (_error) {
       alert({
-        alertType: 'error',
-        title: t('common.error'),
-        body: t('certSign.collab.sessionDetail.addParticipantsError', 'Failed to add participants'),
+        alertType: "error",
+        title: t("common.error"),
+        body: t(
+          "certSign.collab.sessionDetail.addParticipantsError",
+          "Failed to add participants",
+        ),
       });
       throw _error; // Re-throw so modal can handle loading state
     }
@@ -89,15 +120,21 @@ const SessionDetailWorkbenchView = ({ data }: SessionDetailWorkbenchViewProps) =
     try {
       await onRemoveParticipant(participantId);
       alert({
-        alertType: 'success',
-        title: t('success'),
-        body: t('certSign.collab.sessionDetail.participantRemoved', 'Participant removed'),
+        alertType: "success",
+        title: t("success"),
+        body: t(
+          "certSign.collab.sessionDetail.participantRemoved",
+          "Participant removed",
+        ),
       });
     } catch (_error) {
       alert({
-        alertType: 'error',
-        title: t('common.error'),
-        body: t('certSign.collab.sessionDetail.removeParticipantError', 'Failed to remove participant'),
+        alertType: "error",
+        title: t("common.error"),
+        body: t(
+          "certSign.collab.sessionDetail.removeParticipantError",
+          "Failed to remove participant",
+        ),
       });
     }
   };
@@ -108,9 +145,12 @@ const SessionDetailWorkbenchView = ({ data }: SessionDetailWorkbenchViewProps) =
       await onFinalize();
     } catch (_error) {
       alert({
-        alertType: 'error',
-        title: t('common.error'),
-        body: t('certSign.collab.sessionDetail.finalizeError', 'Failed to finalize session'),
+        alertType: "error",
+        title: t("common.error"),
+        body: t(
+          "certSign.collab.sessionDetail.finalizeError",
+          "Failed to finalize session",
+        ),
       });
     } finally {
       setFinalizing(false);
@@ -123,15 +163,18 @@ const SessionDetailWorkbenchView = ({ data }: SessionDetailWorkbenchViewProps) =
       await onDelete();
       setDeleteModalOpen(false);
       alert({
-        alertType: 'success',
-        title: t('success'),
-        body: t('certSign.collab.sessionDetail.deleted', 'Session deleted'),
+        alertType: "success",
+        title: t("success"),
+        body: t("certSign.collab.sessionDetail.deleted", "Session deleted"),
       });
     } catch (_error) {
       alert({
-        alertType: 'error',
-        title: t('common.error'),
-        body: t('certSign.collab.sessionDetail.deleteError', 'Failed to delete session'),
+        alertType: "error",
+        title: t("common.error"),
+        body: t(
+          "certSign.collab.sessionDetail.deleteError",
+          "Failed to delete session",
+        ),
       });
       setDeleting(false);
     }
@@ -143,9 +186,12 @@ const SessionDetailWorkbenchView = ({ data }: SessionDetailWorkbenchViewProps) =
       await onLoadSignedPdf();
     } catch (_error) {
       alert({
-        alertType: 'error',
-        title: t('common.error'),
-        body: t('certSign.collab.sessionDetail.loadPdfError', 'Failed to load signed PDF'),
+        alertType: "error",
+        title: t("common.error"),
+        body: t(
+          "certSign.collab.sessionDetail.loadPdfError",
+          "Failed to load signed PDF",
+        ),
       });
     } finally {
       setLoadingPdf(false);
@@ -169,7 +215,7 @@ const SessionDetailWorkbenchView = ({ data }: SessionDetailWorkbenchViewProps) =
             width: wetSig.width,
             height: wetSig.height,
             signatureData: wetSig.data,
-            signatureType: 'image' as const,
+            signatureType: "image" as const,
             color,
             participantName,
           });
@@ -181,30 +227,59 @@ const SessionDetailWorkbenchView = ({ data }: SessionDetailWorkbenchViewProps) =
   }, [session.participants]);
 
   return (
-    <div style={{ display: 'flex', flexDirection: 'column', height: '100%', overflow: 'hidden' }}>
+    <div
+      style={{
+        display: "flex",
+        flexDirection: "column",
+        height: "100%",
+        overflow: "hidden",
+      }}
+    >
       {/* Top Control Bar */}
-      <Paper p="sm" shadow="sm" style={{ flexShrink: 0, zIndex: Z_INDEX_FULLSCREEN_SURFACE }}>
+      <Paper
+        p="sm"
+        shadow="sm"
+        style={{ flexShrink: 0, zIndex: Z_INDEX_FULLSCREEN_SURFACE }}
+      >
         <Group justify="space-between">
           <Group gap="md">
-            <Button leftSection={<ArrowBackIcon />} variant="subtle" onClick={onBack} size="sm">
-              {t('certSign.collab.sessionDetail.backToList', 'Back to Sessions')}
+            <Button
+              leftSection={<ArrowBackIcon />}
+              variant="subtle"
+              onClick={onBack}
+              size="sm"
+            >
+              {t(
+                "certSign.collab.sessionDetail.backToList",
+                "Back to Sessions",
+              )}
             </Button>
             <Divider orientation="vertical" />
             <Stack gap={2}>
               <Group gap="sm">
-                <Text size="sm" fw={600} style={{ maxWidth: isPhone ? '140px' : undefined }} truncate={isPhone ? 'end' : undefined}>
+                <Text
+                  size="sm"
+                  fw={600}
+                  style={{ maxWidth: isPhone ? "140px" : undefined }}
+                  truncate={isPhone ? "end" : undefined}
+                >
                   {session.documentName}
                 </Text>
-                <Badge size="sm" color={session.finalized ? 'green' : 'blue'} variant="light">
+                <Badge
+                  size="sm"
+                  color={session.finalized ? "green" : "blue"}
+                  variant="light"
+                >
                   {session.finalized
-                    ? t('certSign.collab.sessionList.finalized', 'Finalized')
-                    : t('certSign.collab.sessionList.active', 'Active')}
+                    ? t("certSign.collab.sessionList.finalized", "Finalized")
+                    : t("certSign.collab.sessionList.active", "Active")}
                 </Badge>
               </Group>
               {!isPhone && (
                 <Text size="xs" c="dimmed">
-                  {session.ownerEmail && `${t('certSign.collab.sessionDetail.owner', 'Owner')}: ${session.ownerEmail}`}
-                  {session.ownerEmail && ' • '}
+                  {session.ownerEmail &&
+                    `${t("certSign.collab.sessionDetail.owner", "Owner")}: ${session.ownerEmail}`}
+                  {session.ownerEmail && " • "}
                   {new Date(session.createdAt).toLocaleDateString()}
                 </Text>
               )}
@@ -219,7 +294,7 @@ const SessionDetailWorkbenchView = ({ data }: SessionDetailWorkbenchViewProps) =
                   variant="default"
                   size="sm"
                   onClick={() => annotationApiRef.current?.zoomOut()}
-                  title={t('viewer.zoomOut', 'Zoom out')}
+                  title={t("viewer.zoomOut", "Zoom out")}
                 >
                   <ZoomOutIcon fontSize="small" />
                 </Button>
@@ -227,7 +302,7 @@ const SessionDetailWorkbenchView = ({ data }: SessionDetailWorkbenchViewProps) =
                   variant="default"
                   size="sm"
                   onClick={() => annotationApiRef.current?.resetZoom()}
-                  title={t('viewer.resetZoom', 'Reset zoom')}
+                  title={t("viewer.resetZoom", "Reset zoom")}
                 >
                   <ZoomOutMapIcon fontSize="small" />
                 </Button>
@@ -235,7 +310,7 @@ const SessionDetailWorkbenchView = ({ data }: SessionDetailWorkbenchViewProps) =
                   variant="default"
                   size="sm"
                   onClick={() => annotationApiRef.current?.zoomIn()}
-                  title={t('viewer.zoomIn', 'Zoom in')}
+                  title={t("viewer.zoomIn", "Zoom in")}
                 >
                   <ZoomInIcon fontSize="small" />
                 </Button>
@@ -251,7 +326,10 @@ const SessionDetailWorkbenchView = ({ data }: SessionDetailWorkbenchViewProps) =
                 onClick={() => setDeleteModalOpen(true)}
                 size="sm"
               >
-                {t('certSign.collab.sessionDetail.deleteSession', 'Delete Session')}
+                {t(
+                  "certSign.collab.sessionDetail.deleteSession",
+                  "Delete Session",
+                )}
               </Button>
             )}
           </Group>
@@ -261,16 +339,16 @@ const SessionDetailWorkbenchView = ({ data }: SessionDetailWorkbenchViewProps) =
       {/* Main Content Area */}
       {isPhone ? (
         // Phone: single-panel view — all three panels stay mounted (CSS display:none preserves state)
-        <div style={{ position: 'relative', flex: 1, overflow: 'hidden' }}>
+        <div style={{ position: "relative", flex: 1, overflow: "hidden" }}>
           <Paper
             p="md"
             shadow="sm"
             style={{
-              display: mobilePanel === 'participants' ? 'flex' : 'none',
-              flexDirection: 'column',
-              position: 'absolute',
+              display: mobilePanel === "participants" ? "flex" : "none",
+              flexDirection: "column",
+              position: "absolute",
               inset: 0,
-              overflowY: 'auto',
+              overflowY: "auto",
             }}
           >
             <ParticipantListPanel
@@ -282,8 +360,8 @@ const SessionDetailWorkbenchView = ({ data }: SessionDetailWorkbenchViewProps) =
 
           <div
             style={{
-              display: mobilePanel === 'pdf' ? 'flex' : 'none',
-              position: 'absolute',
+              display: mobilePanel === "pdf" ? "flex" : "none",
+              position: "absolute",
               inset: 0,
             }}
           >
@@ -299,11 +377,11 @@ const SessionDetailWorkbenchView = ({ data }: SessionDetailWorkbenchViewProps) =
             p="md"
             shadow="sm"
             style={{
-              display: mobilePanel === 'actions' ? 'flex' : 'none',
-              flexDirection: 'column',
-              position: 'absolute',
+              display: mobilePanel === "actions" ? "flex" : "none",
+              flexDirection: "column",
+              position: "absolute",
               inset: 0,
-              overflowY: 'auto',
+              overflowY: "auto",
             }}
           >
             <SessionActionsPanel
@@ -318,16 +396,16 @@ const SessionDetailWorkbenchView = ({ data }: SessionDetailWorkbenchViewProps) =
         </div>
       ) : (
         // Desktop/tablet: three-column flex layout
-        <div style={{ display: 'flex', flex: 1, overflow: 'hidden' }}>
+        <div style={{ display: "flex", flex: 1, overflow: "hidden" }}>
           {/* Left Panel - Participants */}
           <Paper
             p="md"
             shadow="sm"
             style={{
-              width: '280px',
+              width: "280px",
               flexShrink: 0,
-              overflowY: 'auto',
-              borderRight: '1px solid var(--mantine-color-gray-3)',
+              overflowY: "auto",
+              borderRight: "1px solid var(--mantine-color-gray-3)",
             }}
           >
             <ParticipantListPanel
@@ -338,7 +416,7 @@ const SessionDetailWorkbenchView = ({ data }: SessionDetailWorkbenchViewProps) =
           </Paper>
 
           {/* Center - PDF Viewer */}
-          <div style={{ flex: 1, overflow: 'hidden', position: 'relative' }}>
+          <div style={{ flex: 1, overflow: "hidden", position: "relative" }}>
             <LocalEmbedPDFWithAnnotations
               ref={annotationApiRef}
               file={pdfFile ?? undefined}
@@ -352,10 +430,10 @@ const SessionDetailWorkbenchView = ({ data }: SessionDetailWorkbenchViewProps) =
             p="md"
             shadow="sm"
             style={{
-              width: '320px',
+              width: "320px",
               flexShrink: 0,
-              overflowY: 'auto',
-              borderLeft: '1px solid var(--mantine-color-gray-3)',
+              overflowY: "auto",
+              borderLeft: "1px solid var(--mantine-color-gray-3)",
             }}
           >
             <SessionActionsPanel
@@ -372,15 +450,30 @@ const SessionDetailWorkbenchView = ({ data }: SessionDetailWorkbenchViewProps) =
 
       {/* Phone bottom navigation */}
       {isPhone && (
-        <Paper shadow="sm" style={{ flexShrink: 0, borderTop: '1px solid var(--mantine-color-gray-3)' }}>
+        <Paper
+          shadow="sm"
+          style={{
+            flexShrink: 0,
+            borderTop: "1px solid var(--mantine-color-gray-3)",
+          }}
+        >
           <SegmentedControl
             fullWidth
             value={mobilePanel}
             onChange={(v) => setMobilePanel(v as typeof mobilePanel)}
             data={[
-              { value: 'participants', label: t('certSign.mobile.panelPeople', 'People') },
-              { value: 'pdf', label: t('certSign.mobile.panelDocument', 'Document') },
-              { value: 'actions', label: t('certSign.mobile.panelActions', 'Actions') },
+              {
+                value: "participants",
+                label: t("certSign.mobile.panelPeople", "People"),
+              },
+              {
+                value: "pdf",
+                label: t("certSign.mobile.panelDocument", "Document"),
+              },
+              {
+                value: "actions",
+                label: t("certSign.mobile.panelActions", "Actions"),
+              },
             ]}
           />
         </Paper>
@@ -397,16 +490,24 @@ const SessionDetailWorkbenchView = ({ data }: SessionDetailWorkbenchViewProps) =
       <Modal
         opened={deleteModalOpen}
         onClose={() => setDeleteModalOpen(false)}
-        title={t('certSign.collab.sessionDetail.deleteSession', 'Delete Session')}
+        title={t(
+          "certSign.collab.sessionDetail.deleteSession",
+          "Delete Session",
+        )}
       >
         <Stack gap="md">
-          <Text>{t('certSign.collab.sessionDetail.deleteConfirm', 'Are you sure? This cannot be undone.')}</Text>
+          <Text>
+            {t(
+              "certSign.collab.sessionDetail.deleteConfirm",
+              "Are you sure? This cannot be undone.",
+            )}
+          </Text>
           <Group justify="flex-end">
             <Button variant="subtle" onClick={() => setDeleteModalOpen(false)}>
-              {t('cancel', 'Cancel')}
+              {t("cancel", "Cancel")}
             </Button>
             <Button color="red" onClick={handleDelete} loading={deleting}>
-              {t('delete', 'Delete')}
+              {t("delete", "Delete")}
             </Button>
           </Group>
         </Stack>
diff --git a/frontend/src/core/components/tools/certSign/SignControlsStrip.module.css b/frontend/src/core/components/tools/certSign/SignControlsStrip.module.css
index 99f2191f6c..b18b899565 100644
--- a/frontend/src/core/components/tools/certSign/SignControlsStrip.module.css
+++ b/frontend/src/core/components/tools/certSign/SignControlsStrip.module.css
@@ -248,7 +248,8 @@
   flex-wrap: nowrap;
 }
 
-.topBar[data-view="viewer"][data-mobile="true"][data-wrapped="false"] .viewerControls {
+.topBar[data-view="viewer"][data-mobile="true"][data-wrapped="false"]
+  .viewerControls {
   flex: 1 1 auto;
   overflow: hidden;
 }
@@ -328,7 +329,9 @@
   align-items: center;
   justify-content: center;
   cursor: pointer;
-  transition: background-color 0.15s ease, color 0.15s ease;
+  transition:
+    background-color 0.15s ease,
+    color 0.15s ease;
 }
 
 .zoomButton:hover {
@@ -366,7 +369,9 @@
   border: none;
   background: transparent;
   color: var(--text-secondary);
-  transition: background-color 0.15s ease, color 0.15s ease;
+  transition:
+    background-color 0.15s ease,
+    color 0.15s ease;
 }
 
 .iconButton.iconTextButton {
diff --git a/frontend/src/core/components/tools/certSign/SignControlsStrip.tsx b/frontend/src/core/components/tools/certSign/SignControlsStrip.tsx
index 62e61baa9e..0d0228af34 100644
--- a/frontend/src/core/components/tools/certSign/SignControlsStrip.tsx
+++ b/frontend/src/core/components/tools/certSign/SignControlsStrip.tsx
@@ -1,22 +1,44 @@
-import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';
-import { ActionIcon, Box, Button, Group, Menu, Modal, SegmentedControl, Stack, Text } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import DrawIcon from '@mui/icons-material/Draw';
-import ImageIcon from '@mui/icons-material/Image';
-import OpenWithIcon from '@mui/icons-material/OpenWith';
-import TextFieldsIcon from '@mui/icons-material/TextFields';
-import CloseIcon from '@mui/icons-material/Close';
-import DeleteOutlineIcon from '@mui/icons-material/DeleteOutline';
-import CheckIcon from '@mui/icons-material/Check';
+import React, {
+  useCallback,
+  useEffect,
+  useMemo,
+  useRef,
+  useState,
+} from "react";
+import {
+  ActionIcon,
+  Box,
+  Button,
+  Group,
+  Menu,
+  Modal,
+  SegmentedControl,
+  Stack,
+  Text,
+} from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import DrawIcon from "@mui/icons-material/Draw";
+import ImageIcon from "@mui/icons-material/Image";
+import OpenWithIcon from "@mui/icons-material/OpenWith";
+import TextFieldsIcon from "@mui/icons-material/TextFields";
+import CloseIcon from "@mui/icons-material/Close";
+import DeleteOutlineIcon from "@mui/icons-material/DeleteOutline";
+import CheckIcon from "@mui/icons-material/Check";
 
-import { DEFAULT_PARAMETERS, type SignParameters } from '@app/hooks/tools/sign/useSignParameters';
-import { useSavedSignatures, type SavedSignature } from '@app/hooks/tools/sign/useSavedSignatures';
-import { DrawingCanvas } from '@app/components/annotation/shared/DrawingCanvas';
-import { ColorPicker } from '@app/components/annotation/shared/ColorPicker';
-import { TextInputWithFont } from '@app/components/annotation/shared/TextInputWithFont';
-import { buildSignaturePreview } from '@app/utils/signaturePreview';
+import {
+  DEFAULT_PARAMETERS,
+  type SignParameters,
+} from "@app/hooks/tools/sign/useSignParameters";
+import {
+  useSavedSignatures,
+  type SavedSignature,
+} from "@app/hooks/tools/sign/useSavedSignatures";
+import { DrawingCanvas } from "@app/components/annotation/shared/DrawingCanvas";
+import { ColorPicker } from "@app/components/annotation/shared/ColorPicker";
+import { TextInputWithFont } from "@app/components/annotation/shared/TextInputWithFont";
+import { buildSignaturePreview } from "@app/utils/signaturePreview";
 
-import styles from '@app/components/tools/certSign/SignControlsStrip.module.css';
+import styles from "@app/components/tools/certSign/SignControlsStrip.module.css";
 
 interface SignControlsStripProps {
   visible: boolean;
@@ -50,35 +72,45 @@ export default function SignControlsStrip({
     byTypeCounts,
   } = useSavedSignatures();
 
-  const [createSignatureType, setCreateSignatureType] = useState<'canvas' | 'text' | 'image' | null>(null);
+  const [createSignatureType, setCreateSignatureType] = useState<
+    "canvas" | "text" | "image" | null
+  >(null);
   const [canvasColorPickerOpen, setCanvasColorPickerOpen] = useState(false);
-  const [canvasColor, setCanvasColor] = useState('#000000');
+  const [canvasColor, setCanvasColor] = useState("#000000");
   const [canvasPenSize, setCanvasPenSize] = useState(2);
-  const [canvasPenSizeInput, setCanvasPenSizeInput] = useState('2');
+  const [canvasPenSizeInput, setCanvasPenSizeInput] = useState("2");
   const latestCanvasDataRef = useRef<string | undefined>(undefined);
 
   const fileInputRef = useRef<HTMLInputElement | null>(null);
-  const [textSignerName, setTextSignerName] = useState(DEFAULT_PARAMETERS.signerName ?? '');
-  const [textFontFamily, setTextFontFamily] = useState(DEFAULT_PARAMETERS.fontFamily ?? 'Helvetica');
-  const [textFontSize, setTextFontSize] = useState(DEFAULT_PARAMETERS.fontSize ?? 16);
-  const [textColor, setTextColor] = useState(DEFAULT_PARAMETERS.textColor ?? '#000000');
+  const [textSignerName, setTextSignerName] = useState(
+    DEFAULT_PARAMETERS.signerName ?? "",
+  );
+  const [textFontFamily, setTextFontFamily] = useState(
+    DEFAULT_PARAMETERS.fontFamily ?? "Helvetica",
+  );
+  const [textFontSize, setTextFontSize] = useState(
+    DEFAULT_PARAMETERS.fontSize ?? 16,
+  );
+  const [textColor, setTextColor] = useState(
+    DEFAULT_PARAMETERS.textColor ?? "#000000",
+  );
 
   const renderSavedSignaturePreview = useCallback(
     (sig: SavedSignature) => {
-      if (sig.type === 'text') {
+      if (sig.type === "text") {
         return (
           <Box
             component="div"
             style={{
               width: 72,
               height: 28,
-              backgroundColor: '#ffffff',
+              backgroundColor: "#ffffff",
               borderRadius: 8,
-              display: 'flex',
-              alignItems: 'center',
-              justifyContent: 'center',
-              padding: '0 8px',
-              overflow: 'hidden',
+              display: "flex",
+              alignItems: "center",
+              justifyContent: "center",
+              padding: "0 8px",
+              overflow: "hidden",
             }}
           >
             <Text
@@ -86,10 +118,10 @@ export default function SignControlsStrip({
               style={{
                 fontFamily: sig.fontFamily,
                 color: sig.textColor,
-                whiteSpace: 'nowrap',
-                overflow: 'hidden',
-                textOverflow: 'ellipsis',
-                maxWidth: '100%',
+                whiteSpace: "nowrap",
+                overflow: "hidden",
+                textOverflow: "ellipsis",
+                maxWidth: "100%",
               }}
             >
               {sig.signerName}
@@ -104,34 +136,39 @@ export default function SignControlsStrip({
           style={{
             width: 72,
             height: 28,
-            backgroundColor: '#ffffff',
+            backgroundColor: "#ffffff",
             borderRadius: 8,
-            display: 'flex',
-            alignItems: 'center',
-            justifyContent: 'center',
-            padding: '2px 6px',
+            display: "flex",
+            alignItems: "center",
+            justifyContent: "center",
+            padding: "2px 6px",
           }}
         >
           <Box
             component="img"
             src={sig.dataUrl}
-            alt={sig.label || t('certSign.collab.signRequest.saved.defaultLabel', 'Signature')}
+            alt={
+              sig.label ||
+              t("certSign.collab.signRequest.saved.defaultLabel", "Signature")
+            }
             style={{
-              maxWidth: '100%',
-              maxHeight: '100%',
-              objectFit: 'contain',
-              display: 'block',
+              maxWidth: "100%",
+              maxHeight: "100%",
+              objectFit: "contain",
+              display: "block",
             }}
           />
         </Box>
       );
     },
-    [t]
+    [t],
   );
 
   const sortedSavedSignatures = useMemo(() => {
     if (!savedSignatures.length) return [];
-    return [...savedSignatures].sort((a, b) => (b.updatedAt ?? b.createdAt) - (a.updatedAt ?? a.createdAt));
+    return [...savedSignatures].sort(
+      (a, b) => (b.updatedAt ?? b.createdAt) - (a.updatedAt ?? a.createdAt),
+    );
   }, [savedSignatures]);
 
   const hasAutoSelected = useRef(false);
@@ -142,10 +179,10 @@ export default function SignControlsStrip({
 
     hasAutoSelected.current = true;
     const lastSig = sortedSavedSignatures[0];
-    if (lastSig.type === 'text') {
+    if (lastSig.type === "text") {
       onSignatureSelected({
         ...DEFAULT_PARAMETERS,
-        signatureType: 'text',
+        signatureType: "text",
         signerName: lastSig.signerName,
         fontFamily: lastSig.fontFamily,
         fontSize: lastSig.fontSize,
@@ -159,7 +196,11 @@ export default function SignControlsStrip({
         signatureData: lastSig.dataUrl,
       });
     }
-  }, [sortedSavedSignatures, signatureConfig?.signatureData, onSignatureSelected]);
+  }, [
+    sortedSavedSignatures,
+    signatureConfig?.signatureData,
+    onSignatureSelected,
+  ]);
 
   const beginPlacement = useCallback(
     (config: SignParameters) => {
@@ -171,14 +212,14 @@ export default function SignControlsStrip({
       onSignatureSelected(nextConfig);
       onPlacementModeChange(true);
     },
-    [onSignatureSelected, onPlacementModeChange]
+    [onSignatureSelected, onPlacementModeChange],
   );
 
   const applySavedSignature = useCallback(
     (sig: SavedSignature) => {
-      if (sig.type === 'text') {
+      if (sig.type === "text") {
         beginPlacement({
-          signatureType: 'text',
+          signatureType: "text",
           signerName: sig.signerName,
           fontFamily: sig.fontFamily,
           fontSize: sig.fontSize,
@@ -189,7 +230,7 @@ export default function SignControlsStrip({
       }
       beginPlacement({ signatureType: sig.type, signatureData: sig.dataUrl });
     },
-    [beginPlacement]
+    [beginPlacement],
   );
 
   const pausePlacement = useCallback(() => {
@@ -200,21 +241,24 @@ export default function SignControlsStrip({
     onPlacementModeChange(true);
   }, [onPlacementModeChange]);
 
-  const handleCreateSignature = useCallback((type: 'canvas' | 'text' | 'image') => {
-    if (type === 'image') {
-      fileInputRef.current?.click();
-      return;
-    }
-    setCreateSignatureType(type);
-    if (type === 'canvas') {
-      setCanvasColor('#000000');
-      setCanvasPenSize(2);
-      setCanvasPenSizeInput('2');
-      latestCanvasDataRef.current = undefined;
-    } else if (type === 'text') {
-      setTextSignerName('');
-    }
-  }, []);
+  const handleCreateSignature = useCallback(
+    (type: "canvas" | "text" | "image") => {
+      if (type === "image") {
+        fileInputRef.current?.click();
+        return;
+      }
+      setCreateSignatureType(type);
+      if (type === "canvas") {
+        setCanvasColor("#000000");
+        setCanvasPenSize(2);
+        setCanvasPenSizeInput("2");
+        latestCanvasDataRef.current = undefined;
+      } else if (type === "text") {
+        setTextSignerName("");
+      }
+    },
+    [],
+  );
 
   const handleCancelCreate = useCallback(() => {
     setCreateSignatureType(null);
@@ -225,7 +269,7 @@ export default function SignControlsStrip({
     if (!signerName || isAtCapacity) return null;
 
     const preview = await buildSignaturePreview({
-      signatureType: 'text',
+      signatureType: "text",
       signerName,
       fontFamily: textFontFamily,
       fontSize: textFontSize,
@@ -234,10 +278,13 @@ export default function SignControlsStrip({
     if (!preview?.dataUrl) return null;
 
     const nextIndex = (byTypeCounts?.text ?? 0) + 1;
-    const baseLabel = t('certSign.collab.signRequest.saved.defaultTextLabel', 'Typed signature');
+    const baseLabel = t(
+      "certSign.collab.signRequest.saved.defaultTextLabel",
+      "Typed signature",
+    );
     await addSignature(
       {
-        type: 'text',
+        type: "text",
         dataUrl: preview.dataUrl,
         signerName,
         fontFamily: textFontFamily,
@@ -245,7 +292,7 @@ export default function SignControlsStrip({
         textColor,
       },
       `${baseLabel} ${nextIndex}`,
-      'localStorage'
+      "localStorage",
     );
     return {
       signerName,
@@ -269,10 +316,17 @@ export default function SignControlsStrip({
     async (dataUrl: string) => {
       if (!dataUrl || isAtCapacity) return;
       const nextIndex = (byTypeCounts?.image ?? 0) + 1;
-      const baseLabel = t('certSign.collab.signRequest.saved.defaultImageLabel', 'Uploaded signature');
-      await addSignature({ type: 'image', dataUrl }, `${baseLabel} ${nextIndex}`, 'localStorage');
+      const baseLabel = t(
+        "certSign.collab.signRequest.saved.defaultImageLabel",
+        "Uploaded signature",
+      );
+      await addSignature(
+        { type: "image", dataUrl },
+        `${baseLabel} ${nextIndex}`,
+        "localStorage",
+      );
     },
-    [addSignature, byTypeCounts?.image, isAtCapacity, t]
+    [addSignature, byTypeCounts?.image, isAtCapacity, t],
   );
 
   const readFileAsDataUrl = useCallback(async (file: File): Promise<string> => {
@@ -280,10 +334,11 @@ export default function SignControlsStrip({
       const reader = new FileReader();
       reader.onload = () => {
         const value = reader.result;
-        if (typeof value === 'string') resolve(value);
-        else reject(new Error('Failed to read image as data URL'));
+        if (typeof value === "string") resolve(value);
+        else reject(new Error("Failed to read image as data URL"));
       };
-      reader.onerror = () => reject(reader.error ?? new Error('Failed to read file'));
+      reader.onerror = () =>
+        reject(reader.error ?? new Error("Failed to read file"));
       reader.readAsDataURL(file);
     });
   }, []);
@@ -292,10 +347,17 @@ export default function SignControlsStrip({
     async (dataUrl: string) => {
       if (!dataUrl || isAtCapacity) return;
       const nextIndex = (byTypeCounts?.canvas ?? 0) + 1;
-      const baseLabel = t('certSign.collab.signRequest.saved.defaultCanvasLabel', 'Drawing signature');
-      await addSignature({ type: 'canvas', dataUrl }, `${baseLabel} ${nextIndex}`, 'localStorage');
+      const baseLabel = t(
+        "certSign.collab.signRequest.saved.defaultCanvasLabel",
+        "Drawing signature",
+      );
+      await addSignature(
+        { type: "canvas", dataUrl },
+        `${baseLabel} ${nextIndex}`,
+        "localStorage",
+      );
     },
-    [addSignature, byTypeCounts?.canvas, isAtCapacity, t]
+    [addSignature, byTypeCounts?.canvas, isAtCapacity, t],
   );
 
   useEffect(() => {
@@ -304,36 +366,35 @@ export default function SignControlsStrip({
     const onKeyDown = (event: KeyboardEvent) => {
       const target = event.target as HTMLElement | null;
       const isTypingTarget =
-        target?.tagName === 'INPUT' || target?.tagName === 'TEXTAREA' || (target as any)?.isContentEditable;
+        target?.tagName === "INPUT" ||
+        target?.tagName === "TEXTAREA" ||
+        (target as any)?.isContentEditable;
       if (isTypingTarget) return;
 
-      if (event.key === 'Escape') {
+      if (event.key === "Escape") {
         pausePlacement();
         return;
       }
 
-      if (event.key === 'Backspace') {
+      if (event.key === "Backspace") {
         event.preventDefault();
         onDeleteSelected?.();
       }
     };
 
-    window.addEventListener('keydown', onKeyDown);
-    return () => window.removeEventListener('keydown', onKeyDown);
+    window.addEventListener("keydown", onKeyDown);
+    return () => window.removeEventListener("keydown", onKeyDown);
   }, [pausePlacement, onDeleteSelected, signatureConfig, visible]);
 
-  const handleCanvasSignatureChange = useCallback(
-    (dataUrl: string | null) => {
-      latestCanvasDataRef.current = dataUrl ?? undefined;
-    },
-    []
-  );
+  const handleCanvasSignatureChange = useCallback((dataUrl: string | null) => {
+    latestCanvasDataRef.current = dataUrl ?? undefined;
+  }, []);
 
   const handleDrawingComplete = useCallback(async () => {
     const dataUrl = latestCanvasDataRef.current;
     if (!dataUrl) return;
     await saveCanvasToLibrary(dataUrl);
-    beginPlacement({ signatureType: 'canvas', signatureData: dataUrl });
+    beginPlacement({ signatureType: "canvas", signatureData: dataUrl });
     setCreateSignatureType(null);
     latestCanvasDataRef.current = undefined;
   }, [saveCanvasToLibrary, beginPlacement]);
@@ -342,7 +403,7 @@ export default function SignControlsStrip({
     const saved = await saveTextToLibrary();
     if (!saved) return;
     beginPlacement({
-      signatureType: 'text',
+      signatureType: "text",
       signerName: saved.signerName,
       fontFamily: saved.fontFamily,
       fontSize: saved.fontSize,
@@ -350,68 +411,77 @@ export default function SignControlsStrip({
       signatureData: saved.dataUrl,
     });
     setCreateSignatureType(null);
-    setTextSignerName('');
+    setTextSignerName("");
   }, [saveTextToLibrary, beginPlacement]);
 
   const handleImageSelected = useCallback(
     async (e: React.ChangeEvent<HTMLInputElement>) => {
       const file = e.target.files?.[0] ?? null;
-      e.target.value = '';
+      e.target.value = "";
       if (!file) return;
       try {
         const dataUrl = await readFileAsDataUrl(file);
         await saveImageToLibrary(dataUrl);
-        beginPlacement({ signatureType: 'image', signatureData: dataUrl });
+        beginPlacement({ signatureType: "image", signatureData: dataUrl });
         setCreateSignatureType(null);
       } catch (err) {
-        console.error('Failed to read signature image:', err);
+        console.error("Failed to read signature image:", err);
       }
     },
-    [readFileAsDataUrl, saveImageToLibrary, beginPlacement]
+    [readFileAsDataUrl, saveImageToLibrary, beginPlacement],
   );
 
   if (!visible || !signatureConfig) return null;
 
   const previewNode =
-    signatureConfig.signatureType === 'text' ? (
+    signatureConfig.signatureType === "text" ? (
       <div
         className={styles.signingPreviewFrame}
         style={{
-          fontFamily: signatureConfig.fontFamily ?? 'Helvetica',
-          color: signatureConfig.textColor ?? '#000000',
+          fontFamily: signatureConfig.fontFamily ?? "Helvetica",
+          color: signatureConfig.textColor ?? "#000000",
           fontSize: 14,
           lineHeight: 1.1,
-          whiteSpace: 'nowrap',
-          overflow: 'hidden',
-          textOverflow: 'ellipsis',
+          whiteSpace: "nowrap",
+          overflow: "hidden",
+          textOverflow: "ellipsis",
           maxWidth: 160,
         }}
       >
-        {(signatureConfig.signerName ?? '').trim() || t('certSign.collab.signRequest.preview.textFallback', 'Signature')}
+        {(signatureConfig.signerName ?? "").trim() ||
+          t("certSign.collab.signRequest.preview.textFallback", "Signature")}
       </div>
     ) : (
       <div className={styles.signingPreviewFrame}>
         {signatureConfig.signatureData ? (
           <img
             src={signatureConfig.signatureData}
-            alt={t('certSign.collab.signRequest.preview.imageAlt', 'Selected signature')}
-            style={{ maxWidth: 160, maxHeight: 32, objectFit: 'contain', display: 'block' }}
+            alt={t(
+              "certSign.collab.signRequest.preview.imageAlt",
+              "Selected signature",
+            )}
+            style={{
+              maxWidth: 160,
+              maxHeight: 32,
+              objectFit: "contain",
+              display: "block",
+            }}
           />
         ) : (
           <Text size="xs" c="dimmed">
-            {t('certSign.collab.signRequest.preview.missing', 'No preview')}
+            {t("certSign.collab.signRequest.preview.missing", "No preview")}
           </Text>
         )}
       </div>
     );
 
   return (
-    <div className={styles.signStrip} data-open={visible ? 'true' : 'false'}>
+    <div className={styles.signStrip} data-open={visible ? "true" : "false"}>
       <div className={styles.signStripInner}>
         <div className={styles.signingRow}>
           <div className={styles.signingLeft}>
             <Text size="sm" fw={700} className={styles.signingTitle}>
-              {t('certSign.collab.signRequest.signingTitle', 'Signing')}
+              {t("certSign.collab.signRequest.signingTitle", "Signing")}
             </Text>
           </div>
 
@@ -420,34 +490,47 @@ export default function SignControlsStrip({
           <div className={styles.signingMode}>
             <SegmentedControl
               className={styles.signStripModeRadio}
-              value={placementMode ? 'place' : 'move'}
+              value={placementMode ? "place" : "move"}
               onChange={(value) => {
-                if (value === 'place') resumePlacement();
+                if (value === "place") resumePlacement();
                 else pausePlacement();
               }}
               data={[
                 {
-                  value: 'place',
+                  value: "place",
                   label: (
                     <Group gap={6} wrap="nowrap">
-                      <DrawIcon sx={{ fontSize: '1.1rem' }} />
-                      <span>{t('certSign.collab.signRequest.mode.place', 'Place Signature')}</span>
+                      <DrawIcon sx={{ fontSize: "1.1rem" }} />
+                      <span>
+                        {t(
+                          "certSign.collab.signRequest.mode.place",
+                          "Place Signature",
+                        )}
+                      </span>
                     </Group>
                   ),
                 },
                 {
-                  value: 'move',
+                  value: "move",
                   label: (
                     <Group gap={6} wrap="nowrap">
-                      <OpenWithIcon sx={{ fontSize: '1.1rem' }} />
-                      <span>{t('certSign.collab.signRequest.mode.move', 'Move Signature')}</span>
+                      <OpenWithIcon sx={{ fontSize: "1.1rem" }} />
+                      <span>
+                        {t(
+                          "certSign.collab.signRequest.mode.move",
+                          "Move Signature",
+                        )}
+                      </span>
                     </Group>
                   ),
                 },
               ]}
               size="xs"
               radius="xl"
-              aria-label={t('certSign.collab.signRequest.mode.title', 'Sign or move mode')}
+              aria-label={t(
+                "certSign.collab.signRequest.mode.title",
+                "Sign or move mode",
+              )}
             />
           </div>
 
@@ -467,7 +550,10 @@ export default function SignControlsStrip({
                 <button
                   type="button"
                   className={styles.signingPreviewButton}
-                  aria-label={t('certSign.collab.signRequest.changeSignature', 'Change signature')}
+                  aria-label={t(
+                    "certSign.collab.signRequest.changeSignature",
+                    "Change signature",
+                  )}
                 >
                   {previewNode}
                 </button>
@@ -475,7 +561,10 @@ export default function SignControlsStrip({
               <Menu.Dropdown>
                 {sortedSavedSignatures.length ? (
                   sortedSavedSignatures.map((sig) => (
-                    <Menu.Item key={sig.id} onClick={() => applySavedSignature(sig)}>
+                    <Menu.Item
+                      key={sig.id}
+                      onClick={() => applySavedSignature(sig)}
+                    >
                       <Group gap="sm" wrap="nowrap" justify="space-between">
                         {renderSavedSignaturePreview(sig)}
                         <ActionIcon
@@ -483,34 +572,63 @@ export default function SignControlsStrip({
                           size="xs"
                           color="red"
                           variant="subtle"
-                          onClick={(e) => { e.stopPropagation(); removeSignature(sig.id); }}
-                          aria-label={t('certSign.collab.signRequest.saved.delete', 'Delete signature')}
+                          onClick={(e) => {
+                            e.stopPropagation();
+                            removeSignature(sig.id);
+                          }}
+                          aria-label={t(
+                            "certSign.collab.signRequest.saved.delete",
+                            "Delete signature",
+                          )}
                         >
-                          <CloseIcon sx={{ fontSize: '0.9rem' }} />
+                          <CloseIcon sx={{ fontSize: "0.9rem" }} />
                         </ActionIcon>
                       </Group>
                     </Menu.Item>
                   ))
                 ) : (
-                  <Menu.Item disabled>{t('certSign.collab.signRequest.saved.none', 'No saved signatures')}</Menu.Item>
+                  <Menu.Item disabled>
+                    {t(
+                      "certSign.collab.signRequest.saved.none",
+                      "No saved signatures",
+                    )}
+                  </Menu.Item>
                 )}
                 <Menu.Divider />
-                <Menu.Item onClick={() => handleCreateSignature('canvas')} disabled={isAtCapacity}>
+                <Menu.Item
+                  onClick={() => handleCreateSignature("canvas")}
+                  disabled={isAtCapacity}
+                >
                   <Group gap="xs">
-                    <DrawIcon sx={{ fontSize: '1rem' }} />
-                    <span>{t('certSign.collab.signRequest.modeTabs.draw', 'Draw')}</span>
+                    <DrawIcon sx={{ fontSize: "1rem" }} />
+                    <span>
+                      {t("certSign.collab.signRequest.modeTabs.draw", "Draw")}
+                    </span>
                   </Group>
                 </Menu.Item>
-                <Menu.Item onClick={() => handleCreateSignature('text')} disabled={isAtCapacity}>
+                <Menu.Item
+                  onClick={() => handleCreateSignature("text")}
+                  disabled={isAtCapacity}
+                >
                   <Group gap="xs">
-                    <TextFieldsIcon sx={{ fontSize: '1rem' }} />
-                    <span>{t('certSign.collab.signRequest.modeTabs.text', 'Type')}</span>
+                    <TextFieldsIcon sx={{ fontSize: "1rem" }} />
+                    <span>
+                      {t("certSign.collab.signRequest.modeTabs.text", "Type")}
+                    </span>
                   </Group>
                 </Menu.Item>
-                <Menu.Item onClick={() => handleCreateSignature('image')} disabled={isAtCapacity}>
+                <Menu.Item
+                  onClick={() => handleCreateSignature("image")}
+                  disabled={isAtCapacity}
+                >
                   <Group gap="xs">
-                    <ImageIcon sx={{ fontSize: '1rem' }} />
-                    <span>{t('certSign.collab.signRequest.modeTabs.image', 'Upload')}</span>
+                    <ImageIcon sx={{ fontSize: "1rem" }} />
+                    <span>
+                      {t(
+                        "certSign.collab.signRequest.modeTabs.image",
+                        "Upload",
+                      )}
+                    </span>
                   </Group>
                 </Menu.Item>
               </Menu.Dropdown>
@@ -523,10 +641,16 @@ export default function SignControlsStrip({
               className={`${styles.iconButton} ${styles.signStripMobileDelete}`}
               onClick={onDeleteSelected}
               disabled={!hasSelectedAnnotation}
-              aria-label={t('certSign.collab.signRequest.deleteSelected', 'Delete selected signature')}
-              title={t('certSign.collab.signRequest.deleteSelected', 'Delete selected signature')}
+              aria-label={t(
+                "certSign.collab.signRequest.deleteSelected",
+                "Delete selected signature",
+              )}
+              title={t(
+                "certSign.collab.signRequest.deleteSelected",
+                "Delete selected signature",
+              )}
             >
-              <DeleteOutlineIcon sx={{ fontSize: '1.2rem' }} />
+              <DeleteOutlineIcon sx={{ fontSize: "1.2rem" }} />
             </button>
 
             <button
@@ -534,20 +658,31 @@ export default function SignControlsStrip({
               className={`${styles.iconButton} ${styles.iconTextButton}`}
               onClick={onComplete}
               disabled={!canComplete}
-              aria-label={t('certSign.collab.signRequest.completeAndSign', 'Complete & Sign')}
-              title={t('certSign.collab.signRequest.completeAndSign', 'Complete & Sign')}
+              aria-label={t(
+                "certSign.collab.signRequest.completeAndSign",
+                "Complete & Sign",
+              )}
+              title={t(
+                "certSign.collab.signRequest.completeAndSign",
+                "Complete & Sign",
+              )}
             >
               <span className={styles.actionIcon}>
-                <CheckIcon sx={{ fontSize: '1.2rem' }} />
+                <CheckIcon sx={{ fontSize: "1.2rem" }} />
+              </span>
+              <span className={styles.actionLabel}>
+                {t(
+                  "certSign.collab.signRequest.completeAndSign",
+                  "Complete & Sign",
+                )}
               </span>
-              <span className={styles.actionLabel}>{t('certSign.collab.signRequest.completeAndSign', 'Complete & Sign')}</span>
             </button>
           </div>
         </div>
       </div>
 
       {/* Draw Signature — auto-opens its inner canvas modal directly */}
-      {createSignatureType === 'canvas' && (
+      {createSignatureType === "canvas" && (
         <DrawingCanvas
           autoOpen
           selectedColor={canvasColor}
@@ -575,15 +710,18 @@ export default function SignControlsStrip({
 
       {/* Type Signature Modal */}
       <Modal
-        opened={createSignatureType === 'text'}
+        opened={createSignatureType === "text"}
         onClose={handleCancelCreate}
-        title={t('certSign.collab.signRequest.modeTabs.text', 'Type Signature')}
+        title={t("certSign.collab.signRequest.modeTabs.text", "Type Signature")}
         size="md"
         withinPortal
       >
         <Stack gap="md">
           <Text size="sm" c="dimmed">
-            {t('certSign.collab.signRequest.text.modalHint', 'Enter your name, then click Continue to place it on the PDF.')}
+            {t(
+              "certSign.collab.signRequest.text.modalHint",
+              "Enter your name, then click Continue to place it on the PDF.",
+            )}
           </Text>
           <TextInputWithFont
             text={textSignerName}
@@ -594,19 +732,34 @@ export default function SignControlsStrip({
             onFontSizeChange={setTextFontSize}
             textColor={textColor}
             onTextColorChange={setTextColor}
-            label={t('certSign.collab.signRequest.text.label', 'Signature Text')}
-            placeholder={t('certSign.collab.signRequest.text.placeholder', 'Enter your name...')}
-            fontLabel={t('certSign.collab.signRequest.text.fontLabel', 'Font')}
-            fontSizeLabel={t('certSign.collab.signRequest.text.fontSizeLabel', 'Size')}
-            fontSizePlaceholder={t('certSign.collab.signRequest.text.fontSizePlaceholder', '16')}
-            colorLabel={t('certSign.collab.signRequest.text.colorLabel', 'Color')}
+            label={t(
+              "certSign.collab.signRequest.text.label",
+              "Signature Text",
+            )}
+            placeholder={t(
+              "certSign.collab.signRequest.text.placeholder",
+              "Enter your name...",
+            )}
+            fontLabel={t("certSign.collab.signRequest.text.fontLabel", "Font")}
+            fontSizeLabel={t(
+              "certSign.collab.signRequest.text.fontSizeLabel",
+              "Size",
+            )}
+            fontSizePlaceholder={t(
+              "certSign.collab.signRequest.text.fontSizePlaceholder",
+              "16",
+            )}
+            colorLabel={t(
+              "certSign.collab.signRequest.text.colorLabel",
+              "Color",
+            )}
           />
           <Group justify="flex-end">
             <Button variant="subtle" onClick={handleCancelCreate}>
-              {t('cancel', 'Cancel')}
+              {t("cancel", "Cancel")}
             </Button>
             <Button onClick={handleSaveText} disabled={!textSignerName.trim()}>
-              {t('certSign.collab.signRequest.canvas.continue', 'Continue')}
+              {t("certSign.collab.signRequest.canvas.continue", "Continue")}
             </Button>
           </Group>
         </Stack>
@@ -618,7 +771,10 @@ export default function SignControlsStrip({
           onClose={() => setCanvasColorPickerOpen(false)}
           selectedColor={canvasColor}
           onColorChange={setCanvasColor}
-          title={t('certSign.collab.signRequest.canvas.colorPickerTitle', 'Choose stroke colour')}
+          title={t(
+            "certSign.collab.signRequest.canvas.colorPickerTitle",
+            "Choose stroke colour",
+          )}
         />
       )}
 
@@ -626,7 +782,7 @@ export default function SignControlsStrip({
         ref={fileInputRef}
         type="file"
         accept="image/*"
-        style={{ display: 'none' }}
+        style={{ display: "none" }}
         onChange={handleImageSelected}
       />
     </div>
diff --git a/frontend/src/core/components/tools/certSign/SignRequestWorkbenchView.tsx b/frontend/src/core/components/tools/certSign/SignRequestWorkbenchView.tsx
index 5298c61750..04756abdfe 100644
--- a/frontend/src/core/components/tools/certSign/SignRequestWorkbenchView.tsx
+++ b/frontend/src/core/components/tools/certSign/SignRequestWorkbenchView.tsx
@@ -1,22 +1,32 @@
-import { useState, useRef, useEffect } from 'react';
-import { useTranslation } from 'react-i18next';
-import { Paper, Group, Button, Text, Divider, CloseButton } from '@mantine/core';
-import { useIsPhone } from '@app/hooks/useIsMobile';
-import CancelIcon from '@mui/icons-material/Cancel';
-import FolderOpenIcon from '@mui/icons-material/FolderOpen';
-import ZoomInIcon from '@mui/icons-material/ZoomIn';
-import ZoomOutIcon from '@mui/icons-material/ZoomOut';
-import ZoomOutMapIcon from '@mui/icons-material/ZoomOutMap';
-import { LocalIcon } from '@app/components/shared/LocalIcon';
-import { Z_INDEX_FULLSCREEN_SURFACE } from '@app/styles/zIndex';
-import { SignRequestDetail } from '@app/types/signingSession';
-import { LocalEmbedPDFWithAnnotations, AnnotationAPI } from '@app/components/viewer/LocalEmbedPDFWithAnnotations';
-import { alert } from '@app/components/toast';
-import SignControlsStrip from '@app/components/tools/certSign/SignControlsStrip';
-import { CertificateConfigModal } from '@app/components/tools/certSign/modals/CertificateConfigModal';
-import type { CertificateSubmitData } from '@app/components/tools/certSign/modals/CertificateConfigModal';
-import { SignParameters } from '@app/hooks/tools/sign/useSignParameters';
-import { useFileActions } from '@app/contexts/file/fileHooks';
+import { useState, useRef, useEffect } from "react";
+import { useTranslation } from "react-i18next";
+import {
+  Paper,
+  Group,
+  Button,
+  Text,
+  Divider,
+  CloseButton,
+} from "@mantine/core";
+import { useIsPhone } from "@app/hooks/useIsMobile";
+import CancelIcon from "@mui/icons-material/Cancel";
+import FolderOpenIcon from "@mui/icons-material/FolderOpen";
+import ZoomInIcon from "@mui/icons-material/ZoomIn";
+import ZoomOutIcon from "@mui/icons-material/ZoomOut";
+import ZoomOutMapIcon from "@mui/icons-material/ZoomOutMap";
+import { LocalIcon } from "@app/components/shared/LocalIcon";
+import { Z_INDEX_FULLSCREEN_SURFACE } from "@app/styles/zIndex";
+import { SignRequestDetail } from "@app/types/signingSession";
+import {
+  LocalEmbedPDFWithAnnotations,
+  AnnotationAPI,
+} from "@app/components/viewer/LocalEmbedPDFWithAnnotations";
+import { alert } from "@app/components/toast";
+import SignControlsStrip from "@app/components/tools/certSign/SignControlsStrip";
+import { CertificateConfigModal } from "@app/components/tools/certSign/modals/CertificateConfigModal";
+import type { CertificateSubmitData } from "@app/components/tools/certSign/modals/CertificateConfigModal";
+import { SignParameters } from "@app/hooks/tools/sign/useSignParameters";
+import { useFileActions } from "@app/contexts/file/fileHooks";
 
 export interface SignRequestWorkbenchData {
   signRequest: SignRequestDetail;
@@ -44,13 +54,13 @@ const SignRequestWorkbenchView = ({ data }: SignRequestWorkbenchViewProps) => {
   const [signatureConfig, setSignatureConfig] = useState<SignParameters | null>(
     canSign
       ? {
-          signatureType: 'canvas',
-          signerName: '',
-          fontFamily: 'Helvetica',
+          signatureType: "canvas",
+          signerName: "",
+          fontFamily: "Helvetica",
           fontSize: 16,
-          textColor: '#000000',
+          textColor: "#000000",
         }
-      : null
+      : null,
   );
   const [previewCount, setPreviewCount] = useState(0);
   const [placementMode, setPlacementMode] = useState(true);
@@ -73,7 +83,9 @@ const SignRequestWorkbenchView = ({ data }: SignRequestWorkbenchViewProps) => {
       return;
     }
     const check = () => {
-      const has = (annotationApiRef.current as any)?.getHasSelectedAnnotation?.();
+      const has = (
+        annotationApiRef.current as any
+      )?.getHasSelectedAnnotation?.();
       setHasSelectedAnnotation(Boolean(has));
     };
     check();
@@ -88,96 +100,122 @@ const SignRequestWorkbenchView = ({ data }: SignRequestWorkbenchViewProps) => {
   const handleOpenCertificateModal = () => {
     if (previewCount === 0) {
       alert({
-        alertType: 'error',
-        title: t('common.error'),
-        body: t('certSign.collab.signRequest.noSignatures', 'Please place at least one signature on the PDF'),
+        alertType: "error",
+        title: t("common.error"),
+        body: t(
+          "certSign.collab.signRequest.noSignatures",
+          "Please place at least one signature on the PDF",
+        ),
       });
       return;
     }
     setCertificateModalOpen(true);
   };
 
-  const handleSign = async (certData: CertificateSubmitData, reason?: string, location?: string) => {
+  const handleSign = async (
+    certData: CertificateSubmitData,
+    reason?: string,
+    location?: string,
+  ) => {
     const previews = annotationApiRef.current?.getSignaturePreviews() || [];
-    console.log('handleSign called, previews:', previews.length, 'signatures');
+    console.log("handleSign called, previews:", previews.length, "signatures");
 
     setSigning(true);
     try {
       const formData = new FormData();
 
-      if (certData.certType === 'UPLOAD') {
-        const { uploadFormat, p12File, privateKeyFile, certFile, jksFile, password } = certData;
-        formData.append('certType', uploadFormat);
+      if (certData.certType === "UPLOAD") {
+        const {
+          uploadFormat,
+          p12File,
+          privateKeyFile,
+          certFile,
+          jksFile,
+          password,
+        } = certData;
+        formData.append("certType", uploadFormat);
         switch (uploadFormat) {
-          case 'PKCS12':
-          case 'PFX':
+          case "PKCS12":
+          case "PFX":
             if (!p12File) {
               alert({
-                alertType: 'error',
-                title: t('common.error'),
-                body: t('certSign.collab.signRequest.noCertificate', 'Please select a certificate file'),
+                alertType: "error",
+                title: t("common.error"),
+                body: t(
+                  "certSign.collab.signRequest.noCertificate",
+                  "Please select a certificate file",
+                ),
               });
               setSigning(false);
               return;
             }
-            formData.append('p12File', p12File);
+            formData.append("p12File", p12File);
             break;
-          case 'PEM':
+          case "PEM":
             if (!privateKeyFile || !certFile) {
               alert({
-                alertType: 'error',
-                title: t('common.error'),
-                body: t('certSign.collab.signRequest.noCertificate', 'Please select a certificate file'),
+                alertType: "error",
+                title: t("common.error"),
+                body: t(
+                  "certSign.collab.signRequest.noCertificate",
+                  "Please select a certificate file",
+                ),
               });
               setSigning(false);
               return;
             }
-            formData.append('privateKeyFile', privateKeyFile);
-            formData.append('certFile', certFile);
+            formData.append("privateKeyFile", privateKeyFile);
+            formData.append("certFile", certFile);
             break;
-          case 'JKS':
+          case "JKS":
             if (!jksFile) {
               alert({
-                alertType: 'error',
-                title: t('common.error'),
-                body: t('certSign.collab.signRequest.noCertificate', 'Please select a certificate file'),
+                alertType: "error",
+                title: t("common.error"),
+                body: t(
+                  "certSign.collab.signRequest.noCertificate",
+                  "Please select a certificate file",
+                ),
               });
               setSigning(false);
               return;
             }
-            formData.append('jksFile', jksFile);
+            formData.append("jksFile", jksFile);
             break;
         }
         if (password) {
-          formData.append('password', password);
+          formData.append("password", password);
         }
       } else {
-        formData.append('certType', certData.certType);
+        formData.append("certType", certData.certType);
       }
 
       // Add signature appearance settings from sign request
       if (signRequest.showSignature !== undefined) {
-        formData.append('showSignature', signRequest.showSignature.toString());
+        formData.append("showSignature", signRequest.showSignature.toString());
       }
-      if (signRequest.pageNumber !== undefined && signRequest.pageNumber !== null) {
-        formData.append('pageNumber', signRequest.pageNumber.toString());
+      if (
+        signRequest.pageNumber !== undefined &&
+        signRequest.pageNumber !== null
+      ) {
+        formData.append("pageNumber", signRequest.pageNumber.toString());
       }
 
       // Participant-provided reason/location override session defaults
       if (reason && reason.trim()) {
-        formData.append('reason', reason);
+        formData.append("reason", reason);
       } else if (signRequest.reason) {
-        formData.append('reason', signRequest.reason);
+        formData.append("reason", signRequest.reason);
       }
 
       if (location && location.trim()) {
-        formData.append('location', location);
+        formData.append("location", location);
       } else if (signRequest.location) {
-        formData.append('location', signRequest.location);
+        formData.append("location", signRequest.location);
       }
 
       if (signRequest.showLogo !== undefined) {
-        formData.append('showLogo', signRequest.showLogo.toString());
+        formData.append("showLogo", signRequest.showLogo.toString());
       }
 
       // Add all wet signatures from previews
@@ -192,14 +230,18 @@ const SignRequestWorkbenchView = ({ data }: SignRequestWorkbenchViewProps) => {
           height: preview.height,
         }));
 
-        console.log('Sending wet signatures to backend:', wetSignaturesJson.length, 'signatures');
-        formData.append('wetSignaturesData', JSON.stringify(wetSignaturesJson));
+        console.log(
+          "Sending wet signatures to backend:",
+          wetSignaturesJson.length,
+          "signatures",
+        );
+        formData.append("wetSignaturesData", JSON.stringify(wetSignaturesJson));
       }
 
       await onSign(formData);
       setCertificateModalOpen(false);
     } catch (error) {
-      console.error('Failed to sign document:', error);
+      console.error("Failed to sign document:", error);
     } finally {
       setSigning(false);
     }
@@ -210,7 +252,7 @@ const SignRequestWorkbenchView = ({ data }: SignRequestWorkbenchViewProps) => {
     try {
       await onDecline();
     } catch (error) {
-      console.error('Failed to decline request:', error);
+      console.error("Failed to decline request:", error);
       setDeclining(false);
     }
   };
@@ -218,9 +260,12 @@ const SignRequestWorkbenchView = ({ data }: SignRequestWorkbenchViewProps) => {
   const handleAddToActiveFiles = async () => {
     await fileActions.addFiles([pdfFile]);
     alert({
-      alertType: 'success',
-      title: t('success'),
-      body: t('certSign.collab.signRequest.addedToFiles', 'Document added to active files'),
+      alertType: "success",
+      title: t("success"),
+      body: t(
+        "certSign.collab.signRequest.addedToFiles",
+        "Document added to active files",
+      ),
       expandable: false,
       durationMs: 2500,
     });
@@ -237,57 +282,93 @@ const SignRequestWorkbenchView = ({ data }: SignRequestWorkbenchViewProps) => {
     x: number,
     y: number,
     width: number,
-    height: number
+    height: number,
   ) => {
-    console.log('Signature placed:', { id, pageIndex, x, y, width, height });
+    console.log("Signature placed:", { id, pageIndex, x, y, width, height });
   };
 
   return (
-    <div style={{ display: 'flex', flexDirection: 'column', height: '100%', overflow: 'hidden' }}>
+    <div
+      style={{
+        display: "flex",
+        flexDirection: "column",
+        height: "100%",
+        overflow: "hidden",
+      }}
+    >
       {/* Top Control Bar */}
-      <Paper p="sm" shadow="sm" style={{ flexShrink: 0, zIndex: Z_INDEX_FULLSCREEN_SURFACE, position: 'relative' }}>
-        <Group justify="space-between" style={{ flexWrap: isPhone ? 'wrap' : 'nowrap' }}>
+      <Paper
+        p="sm"
+        shadow="sm"
+        style={{
+          flexShrink: 0,
+          zIndex: Z_INDEX_FULLSCREEN_SURFACE,
+          position: "relative",
+        }}
+      >
+        <Group
+          justify="space-between"
+          style={{ flexWrap: isPhone ? "wrap" : "nowrap" }}
+        >
           <Group gap="md">
-            <LocalIcon icon="signature-rounded" width="1.5rem" height="1.5rem" />
+            <LocalIcon
+              icon="signature-rounded"
+              width="1.5rem"
+              height="1.5rem"
+            />
             <div>
-              <Text size="sm" fw={600} style={{ maxWidth: isPhone ? '180px' : undefined }} truncate={isPhone ? 'end' : undefined}>
+              <Text
+                size="sm"
+                fw={600}
+                style={{ maxWidth: isPhone ? "180px" : undefined }}
+                truncate={isPhone ? "end" : undefined}
+              >
                 {signRequest.documentName}
               </Text>
               {!isPhone && (
                 <Text size="xs" c="dimmed">
-                  {t('certSign.collab.signRequest.from', 'From')}: {signRequest.ownerUsername} •{' '}
+                  {t("certSign.collab.signRequest.from", "From")}:{" "}
+                  {signRequest.ownerUsername} •{" "}
                   {new Date(signRequest.createdAt).toLocaleDateString()}
                 </Text>
               )}
             </div>
           </Group>
 
-          <Group gap="xs" style={{ width: isPhone ? '100%' : undefined }} justify={isPhone ? 'flex-end' : undefined}>
+          <Group
+            gap="xs"
+            style={{ width: isPhone ? "100%" : undefined }}
+            justify={isPhone ? "flex-end" : undefined}
+          >
             <Button
               variant="light"
               size="sm"
               leftSection={<FolderOpenIcon fontSize="small" />}
               onClick={handleAddToActiveFiles}
               style={{
-                backgroundColor: 'var(--landing-inner-paper-bg)',
-                color: 'var(--btn-open-file)',
-                border: '1px solid var(--landing-inner-paper-border)',
+                backgroundColor: "var(--landing-inner-paper-bg)",
+                color: "var(--btn-open-file)",
+                border: "1px solid var(--landing-inner-paper-border)",
               }}
             >
-              {t('certSign.collab.signRequest.addToFiles', 'Add to Active Files')}
+              {t(
+                "certSign.collab.signRequest.addToFiles",
+                "Add to Active Files",
+              )}
             </Button>
-            {signRequest.myStatus !== 'SIGNED' && signRequest.myStatus !== 'DECLINED' && (
-              <Button
-                variant="light"
-                color="red"
-                size="sm"
-                leftSection={<CancelIcon fontSize="small" />}
-                onClick={handleDecline}
-                loading={declining}
-              >
-                {t('certSign.collab.signRequest.decline', 'Decline Request')}
-              </Button>
-            )}
+            {signRequest.myStatus !== "SIGNED" &&
+              signRequest.myStatus !== "DECLINED" && (
+                <Button
+                  variant="light"
+                  color="red"
+                  size="sm"
+                  leftSection={<CancelIcon fontSize="small" />}
+                  onClick={handleDecline}
+                  loading={declining}
+                >
+                  {t("certSign.collab.signRequest.decline", "Decline Request")}
+                </Button>
+              )}
             {!isPhone && (
               <>
                 <Divider orientation="vertical" />
@@ -296,7 +377,7 @@ const SignRequestWorkbenchView = ({ data }: SignRequestWorkbenchViewProps) => {
                     variant="subtle"
                     size="sm"
                     onClick={() => annotationApiRef.current?.zoomOut()}
-                    title={t('viewer.zoomOut', 'Zoom out')}
+                    title={t("viewer.zoomOut", "Zoom out")}
                   >
                     <ZoomOutIcon fontSize="small" />
                   </Button>
@@ -304,7 +385,7 @@ const SignRequestWorkbenchView = ({ data }: SignRequestWorkbenchViewProps) => {
                     variant="subtle"
                     size="sm"
                     onClick={() => annotationApiRef.current?.resetZoom()}
-                    title={t('viewer.resetZoom', 'Reset zoom')}
+                    title={t("viewer.resetZoom", "Reset zoom")}
                   >
                     <ZoomOutMapIcon fontSize="small" />
                   </Button>
@@ -312,7 +393,7 @@ const SignRequestWorkbenchView = ({ data }: SignRequestWorkbenchViewProps) => {
                     variant="subtle"
                     size="sm"
                     onClick={() => annotationApiRef.current?.zoomIn()}
-                    title={t('viewer.zoomIn', 'Zoom in')}
+                    title={t("viewer.zoomIn", "Zoom in")}
                   >
                     <ZoomInIcon fontSize="small" />
                   </Button>
@@ -320,7 +401,14 @@ const SignRequestWorkbenchView = ({ data }: SignRequestWorkbenchViewProps) => {
               </>
             )}
             <Divider orientation="vertical" />
-            <CloseButton size="md" onClick={onBack} title={t('certSign.collab.signRequest.backToList', 'Back to Sign Requests')} />
+            <CloseButton
+              size="md"
+              onClick={onBack}
+              title={t(
+                "certSign.collab.signRequest.backToList",
+                "Back to Sign Requests",
+              )}
+            />
           </Group>
         </Group>
       </Paper>
@@ -341,7 +429,7 @@ const SignRequestWorkbenchView = ({ data }: SignRequestWorkbenchViewProps) => {
       )}
 
       {/* PDF Viewer (full width) */}
-      <div style={{ flex: 1, overflow: 'hidden', position: 'relative' }}>
+      <div style={{ flex: 1, overflow: "hidden", position: "relative" }}>
         <LocalEmbedPDFWithAnnotations
           ref={annotationApiRef}
           file={pdfFile}
@@ -362,11 +450,10 @@ const SignRequestWorkbenchView = ({ data }: SignRequestWorkbenchViewProps) => {
           onSign={handleSign}
           signatureCount={previewCount}
           disabled={signing}
-          defaultReason={signRequest.reason || ''}
-          defaultLocation={signRequest.location || ''}
+          defaultReason={signRequest.reason || ""}
+          defaultLocation={signRequest.location || ""}
         />
       )}
-
     </div>
   );
 };
diff --git a/frontend/src/core/components/tools/certSign/SignatureAppearanceSettings.tsx b/frontend/src/core/components/tools/certSign/SignatureAppearanceSettings.tsx
index f6ddbe241f..07387613b5 100644
--- a/frontend/src/core/components/tools/certSign/SignatureAppearanceSettings.tsx
+++ b/frontend/src/core/components/tools/certSign/SignatureAppearanceSettings.tsx
@@ -8,34 +8,60 @@ interface SignatureAppearanceSettingsProps {
   disabled?: boolean;
 }
 
-const SignatureAppearanceSettings = ({ parameters, onParameterChange, disabled = false }: SignatureAppearanceSettingsProps) => {
+const SignatureAppearanceSettings = ({
+  parameters,
+  onParameterChange,
+  disabled = false,
+}: SignatureAppearanceSettingsProps) => {
   const { t } = useTranslation();
 
   return (
     <Stack gap="md">
       {/* Signature Visibility */}
       <Stack gap="sm">
-        <div style={{ display: 'flex', gap: '4px' }}>
+        <div style={{ display: "flex", gap: "4px" }}>
           <Button
-            variant={!parameters.showSignature ? 'filled' : 'outline'}
-            color={!parameters.showSignature ? 'blue' : 'var(--text-muted)'}
-            onClick={() => onParameterChange('showSignature', false)}
+            variant={!parameters.showSignature ? "filled" : "outline"}
+            color={!parameters.showSignature ? "blue" : "var(--text-muted)"}
+            onClick={() => onParameterChange("showSignature", false)}
             disabled={disabled}
-            style={{ flex: 1, height: 'auto', minHeight: '40px', fontSize: '11px' }}
+            style={{
+              flex: 1,
+              height: "auto",
+              minHeight: "40px",
+              fontSize: "11px",
+            }}
           >
-            <div style={{ textAlign: 'center', lineHeight: '1.1', fontSize: '11px' }}>
-              {t('certSign.appearance.invisible', 'Invisible')}
+            <div
+              style={{
+                textAlign: "center",
+                lineHeight: "1.1",
+                fontSize: "11px",
+              }}
+            >
+              {t("certSign.appearance.invisible", "Invisible")}
             </div>
           </Button>
           <Button
-            variant={parameters.showSignature ? 'filled' : 'outline'}
-            color={parameters.showSignature ? 'blue' : 'var(--text-muted)'}
-            onClick={() => onParameterChange('showSignature', true)}
+            variant={parameters.showSignature ? "filled" : "outline"}
+            color={parameters.showSignature ? "blue" : "var(--text-muted)"}
+            onClick={() => onParameterChange("showSignature", true)}
             disabled={disabled}
-            style={{ flex: 1, height: 'auto', minHeight: '40px', fontSize: '11px' }}
+            style={{
+              flex: 1,
+              height: "auto",
+              minHeight: "40px",
+              fontSize: "11px",
+            }}
           >
-            <div style={{ textAlign: 'center', lineHeight: '1.1', fontSize: '11px' }}>
-              {t('certSign.appearance.visible', 'Visible')}
+            <div
+              style={{
+                textAlign: "center",
+                lineHeight: "1.1",
+                fontSize: "11px",
+              }}
+            >
+              {t("certSign.appearance.visible", "Visible")}
             </div>
           </Button>
         </div>
@@ -45,58 +71,86 @@ const SignatureAppearanceSettings = ({ parameters, onParameterChange, disabled =
       {parameters.showSignature && (
         <Stack gap="sm">
           <Text size="sm" fw={500}>
-            {t('certSign.appearance.options.title', 'Signature Details')}
+            {t("certSign.appearance.options.title", "Signature Details")}
           </Text>
           <TextInput
-            label={t('certSign.reason', 'Reason')}
+            label={t("certSign.reason", "Reason")}
             value={parameters.reason}
-            onChange={(event) => onParameterChange('reason', event.currentTarget.value)}
+            onChange={(event) =>
+              onParameterChange("reason", event.currentTarget.value)
+            }
             disabled={disabled}
           />
           <TextInput
-            label={t('certSign.location', 'Location')}
+            label={t("certSign.location", "Location")}
             value={parameters.location}
-            onChange={(event) => onParameterChange('location', event.currentTarget.value)}
+            onChange={(event) =>
+              onParameterChange("location", event.currentTarget.value)
+            }
             disabled={disabled}
           />
           <TextInput
-            label={t('certSign.name', 'Name')}
+            label={t("certSign.name", "Name")}
             value={parameters.name}
-            onChange={(event) => onParameterChange('name', event.currentTarget.value)}
+            onChange={(event) =>
+              onParameterChange("name", event.currentTarget.value)
+            }
             disabled={disabled}
           />
           <NumberInput
-            label={t('certSign.pageNumber', 'Page Number')}
+            label={t("certSign.pageNumber", "Page Number")}
             value={parameters.pageNumber}
-            onChange={(value) => onParameterChange('pageNumber', value || 1)}
+            onChange={(value) => onParameterChange("pageNumber", value || 1)}
             min={1}
             disabled={disabled}
           />
           <Stack gap="xs">
             <Text size="sm" fw={500}>
-              {t('certSign.logoTitle', 'Logo')}
+              {t("certSign.logoTitle", "Logo")}
             </Text>
-            <div style={{ display: 'flex', gap: '4px' }}>
+            <div style={{ display: "flex", gap: "4px" }}>
               <Button
-                variant={!parameters.showLogo ? 'filled' : 'outline'}
-                color={!parameters.showLogo ? 'blue' : 'var(--text-muted)'}
-                onClick={() => onParameterChange('showLogo', false)}
+                variant={!parameters.showLogo ? "filled" : "outline"}
+                color={!parameters.showLogo ? "blue" : "var(--text-muted)"}
+                onClick={() => onParameterChange("showLogo", false)}
                 disabled={disabled}
-                style={{ flex: 1, height: 'auto', minHeight: '40px', fontSize: '11px' }}
+                style={{
+                  flex: 1,
+                  height: "auto",
+                  minHeight: "40px",
+                  fontSize: "11px",
+                }}
               >
-                <div style={{ textAlign: 'center', lineHeight: '1.1', fontSize: '11px' }}>
-                  {t('certSign.noLogo', 'No Logo')}
+                <div
+                  style={{
+                    textAlign: "center",
+                    lineHeight: "1.1",
+                    fontSize: "11px",
+                  }}
+                >
+                  {t("certSign.noLogo", "No Logo")}
                 </div>
               </Button>
               <Button
-                variant={parameters.showLogo ? 'filled' : 'outline'}
-                color={parameters.showLogo ? 'blue' : 'var(--text-muted)'}
-                onClick={() => onParameterChange('showLogo', true)}
+                variant={parameters.showLogo ? "filled" : "outline"}
+                color={parameters.showLogo ? "blue" : "var(--text-muted)"}
+                onClick={() => onParameterChange("showLogo", true)}
                 disabled={disabled}
-                style={{ flex: 1, height: 'auto', minHeight: '40px', fontSize: '11px' }}
+                style={{
+                  flex: 1,
+                  height: "auto",
+                  minHeight: "40px",
+                  fontSize: "11px",
+                }}
               >
-                <div style={{ textAlign: 'center', lineHeight: '1.1', fontSize: '11px' }}>
-                  {t('certSign.showLogo', 'Show Logo')}
+                <div
+                  style={{
+                    textAlign: "center",
+                    lineHeight: "1.1",
+                    fontSize: "11px",
+                  }}
+                >
+                  {t("certSign.showLogo", "Show Logo")}
                 </div>
               </Button>
             </div>
@@ -107,4 +161,4 @@ const SignatureAppearanceSettings = ({ parameters, onParameterChange, disabled =
   );
 };
 
-export default SignatureAppearanceSettings;
\ No newline at end of file
+export default SignatureAppearanceSettings;
diff --git a/frontend/src/core/components/tools/certSign/SignatureSettingsDisplay.tsx b/frontend/src/core/components/tools/certSign/SignatureSettingsDisplay.tsx
index 00d0658bbd..33b62dcc79 100644
--- a/frontend/src/core/components/tools/certSign/SignatureSettingsDisplay.tsx
+++ b/frontend/src/core/components/tools/certSign/SignatureSettingsDisplay.tsx
@@ -1,9 +1,9 @@
-import { useTranslation } from 'react-i18next';
-import { Stack, Paper, Text, Group, Badge } from '@mantine/core';
-import VisibilityIcon from '@mui/icons-material/Visibility';
-import VisibilityOffIcon from '@mui/icons-material/VisibilityOff';
-import CheckIcon from '@mui/icons-material/Check';
-import CloseIcon from '@mui/icons-material/Close';
+import { useTranslation } from "react-i18next";
+import { Stack, Paper, Text, Group, Badge } from "@mantine/core";
+import VisibilityIcon from "@mui/icons-material/Visibility";
+import VisibilityOffIcon from "@mui/icons-material/VisibilityOff";
+import CheckIcon from "@mui/icons-material/Check";
+import CloseIcon from "@mui/icons-material/Close";
 
 interface SignatureSettingsDisplayProps {
   showSignature: boolean;
@@ -28,21 +28,31 @@ const SignatureSettingsDisplay = ({
         <Stack gap="xs">
           <Group gap="xs" justify="space-between">
             <Text size="xs" c="dimmed">
-              {t('certSign.appearance.visibility', 'Visibility')}
+              {t("certSign.appearance.visibility", "Visibility")}
             </Text>
             <Group gap="xs">
               {showSignature ? (
                 <>
-                  <VisibilityIcon style={{ fontSize: '16px', color: 'var(--mantine-color-green-6)' }} />
+                  <VisibilityIcon
+                    style={{
+                      fontSize: "16px",
+                      color: "var(--mantine-color-green-6)",
+                    }}
+                  />
                   <Badge size="sm" color="green" variant="light">
-                    {t('certSign.appearance.visible', 'Visible')}
+                    {t("certSign.appearance.visible", "Visible")}
                   </Badge>
                 </>
               ) : (
                 <>
-                  <VisibilityOffIcon style={{ fontSize: '16px', color: 'var(--mantine-color-gray-6)' }} />
+                  <VisibilityOffIcon
+                    style={{
+                      fontSize: "16px",
+                      color: "var(--mantine-color-gray-6)",
+                    }}
+                  />
                   <Badge size="sm" color="gray" variant="light">
-                    {t('certSign.appearance.invisible', 'Invisible')}
+                    {t("certSign.appearance.invisible", "Invisible")}
                   </Badge>
                 </>
               )}
@@ -54,7 +64,7 @@ const SignatureSettingsDisplay = ({
               {pageNumber && (
                 <Group gap="xs" justify="space-between">
                   <Text size="xs" c="dimmed">
-                    {t('certSign.pageNumber', 'Page Number')}
+                    {t("certSign.pageNumber", "Page Number")}
                   </Text>
                   <Text size="xs" fw={600}>
                     {pageNumber}
@@ -65,7 +75,7 @@ const SignatureSettingsDisplay = ({
               {reason && (
                 <Stack gap={4}>
                   <Text size="xs" c="dimmed">
-                    {t('certSign.reason', 'Reason')}
+                    {t("certSign.reason", "Reason")}
                   </Text>
                   <Paper p="xs" withBorder bg="gray.0">
                     <Text size="xs">{reason}</Text>
@@ -76,7 +86,7 @@ const SignatureSettingsDisplay = ({
               {location && (
                 <Stack gap={4}>
                   <Text size="xs" c="dimmed">
-                    {t('certSign.location', 'Location')}
+                    {t("certSign.location", "Location")}
                   </Text>
                   <Paper p="xs" withBorder bg="gray.0">
                     <Text size="xs">{location}</Text>
@@ -86,21 +96,31 @@ const SignatureSettingsDisplay = ({
 
               <Group gap="xs" justify="space-between">
                 <Text size="xs" c="dimmed">
-                  {t('certSign.logoTitle', 'Logo')}
+                  {t("certSign.logoTitle", "Logo")}
                 </Text>
                 <Group gap="xs">
                   {showLogo ? (
                     <>
-                      <CheckIcon style={{ fontSize: '16px', color: 'var(--mantine-color-green-6)' }} />
+                      <CheckIcon
+                        style={{
+                          fontSize: "16px",
+                          color: "var(--mantine-color-green-6)",
+                        }}
+                      />
                       <Badge size="sm" color="green" variant="light">
-                        {t('certSign.showLogo', 'Show Logo')}
+                        {t("certSign.showLogo", "Show Logo")}
                       </Badge>
                     </>
                   ) : (
                     <>
-                      <CloseIcon style={{ fontSize: '16px', color: 'var(--mantine-color-gray-6)' }} />
+                      <CloseIcon
+                        style={{
+                          fontSize: "16px",
+                          color: "var(--mantine-color-gray-6)",
+                        }}
+                      />
                       <Badge size="sm" color="gray" variant="light">
-                        {t('certSign.noLogo', 'No Logo')}
+                        {t("certSign.noLogo", "No Logo")}
                       </Badge>
                     </>
                   )}
@@ -114,8 +134,8 @@ const SignatureSettingsDisplay = ({
       <Paper p="xs" withBorder bg="blue.0">
         <Text size="xs" c="blue.9">
           {t(
-            'certSign.collab.signRequest.signatureInfo',
-            'These settings are configured by the document owner'
+            "certSign.collab.signRequest.signatureInfo",
+            "These settings are configured by the document owner",
           )}
         </Text>
       </Paper>
diff --git a/frontend/src/core/components/tools/certSign/SignatureSettingsInput.tsx b/frontend/src/core/components/tools/certSign/SignatureSettingsInput.tsx
index 194e0a6d09..812d34749c 100644
--- a/frontend/src/core/components/tools/certSign/SignatureSettingsInput.tsx
+++ b/frontend/src/core/components/tools/certSign/SignatureSettingsInput.tsx
@@ -1,5 +1,12 @@
-import { Stack, Text, Button, TextInput, NumberInput, Switch } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
+import {
+  Stack,
+  Text,
+  Button,
+  TextInput,
+  NumberInput,
+  Switch,
+} from "@mantine/core";
+import { useTranslation } from "react-i18next";
 
 export interface SignatureSettings {
   showSignature?: boolean;
@@ -16,7 +23,11 @@ interface SignatureSettingsInputProps {
   disabled?: boolean;
 }
 
-const SignatureSettingsInput = ({ value, onChange, disabled = false }: SignatureSettingsInputProps) => {
+const SignatureSettingsInput = ({
+  value,
+  onChange,
+  disabled = false,
+}: SignatureSettingsInputProps) => {
   const { t } = useTranslation();
 
   const handleChange = (key: keyof SignatureSettings, val: any) => {
@@ -26,34 +37,51 @@ const SignatureSettingsInput = ({ value, onChange, disabled = false }: Signature
   return (
     <Stack gap="sm">
       <Text size="sm" fw={600}>
-        {t('certSign.collab.signatureSettings.title', 'Signature Appearance')}
+        {t("certSign.collab.signatureSettings.title", "Signature Appearance")}
       </Text>
       <Text size="xs" c="dimmed">
-        {t('certSign.collab.signatureSettings.description', 'Configure how signatures will appear for all participants')}
+        {t(
+          "certSign.collab.signatureSettings.description",
+          "Configure how signatures will appear for all participants",
+        )}
       </Text>
 
       {/* Signature Visibility */}
-      <div style={{ display: 'flex', gap: '4px' }}>
+      <div style={{ display: "flex", gap: "4px" }}>
         <Button
-          variant={!value.showSignature ? 'filled' : 'outline'}
-          color={!value.showSignature ? 'blue' : 'var(--text-muted)'}
-          onClick={() => handleChange('showSignature', false)}
+          variant={!value.showSignature ? "filled" : "outline"}
+          color={!value.showSignature ? "blue" : "var(--text-muted)"}
+          onClick={() => handleChange("showSignature", false)}
           disabled={disabled}
-          style={{ flex: 1, height: 'auto', minHeight: '40px', fontSize: '11px' }}
+          style={{
+            flex: 1,
+            height: "auto",
+            minHeight: "40px",
+            fontSize: "11px",
+          }}
         >
-          <div style={{ textAlign: 'center', lineHeight: '1.1', fontSize: '11px' }}>
-            {t('certSign.appearance.invisible', 'Invisible')}
+          <div
+            style={{ textAlign: "center", lineHeight: "1.1", fontSize: "11px" }}
+          >
+            {t("certSign.appearance.invisible", "Invisible")}
           </div>
         </Button>
         <Button
-          variant={value.showSignature ? 'filled' : 'outline'}
-          color={value.showSignature ? 'blue' : 'var(--text-muted)'}
-          onClick={() => handleChange('showSignature', true)}
+          variant={value.showSignature ? "filled" : "outline"}
+          color={value.showSignature ? "blue" : "var(--text-muted)"}
+          onClick={() => handleChange("showSignature", true)}
           disabled={disabled}
-          style={{ flex: 1, height: 'auto', minHeight: '40px', fontSize: '11px' }}
+          style={{
+            flex: 1,
+            height: "auto",
+            minHeight: "40px",
+            fontSize: "11px",
+          }}
         >
-          <div style={{ textAlign: 'center', lineHeight: '1.1', fontSize: '11px' }}>
-            {t('certSign.appearance.visible', 'Visible')}
+          <div
+            style={{ textAlign: "center", lineHeight: "1.1", fontSize: "11px" }}
+          >
+            {t("certSign.appearance.visible", "Visible")}
           </div>
         </Button>
       </div>
@@ -62,31 +90,37 @@ const SignatureSettingsInput = ({ value, onChange, disabled = false }: Signature
       {value.showSignature && (
         <Stack gap="sm">
           <TextInput
-            label={t('certSign.reason', 'Reason')}
-            value={value.reason || ''}
-            onChange={(event) => handleChange('reason', event.currentTarget.value)}
+            label={t("certSign.reason", "Reason")}
+            value={value.reason || ""}
+            onChange={(event) =>
+              handleChange("reason", event.currentTarget.value)
+            }
             disabled={disabled}
             size="xs"
           />
           <TextInput
-            label={t('certSign.location', 'Location')}
-            value={value.location || ''}
-            onChange={(event) => handleChange('location', event.currentTarget.value)}
+            label={t("certSign.location", "Location")}
+            value={value.location || ""}
+            onChange={(event) =>
+              handleChange("location", event.currentTarget.value)
+            }
             disabled={disabled}
             size="xs"
           />
           <NumberInput
-            label={t('certSign.pageNumber', 'Page Number')}
+            label={t("certSign.pageNumber", "Page Number")}
             value={value.pageNumber || 1}
-            onChange={(val) => handleChange('pageNumber', val || 1)}
+            onChange={(val) => handleChange("pageNumber", val || 1)}
             min={1}
             disabled={disabled}
             size="xs"
           />
           <Switch
-            label={t('certSign.showLogo', 'Show Stirling PDF Logo')}
+            label={t("certSign.showLogo", "Show Stirling PDF Logo")}
             checked={value.showLogo || false}
-            onChange={(event) => handleChange('showLogo', event.currentTarget.checked)}
+            onChange={(event) =>
+              handleChange("showLogo", event.currentTarget.checked)
+            }
             disabled={disabled}
             size="sm"
           />
@@ -95,10 +129,18 @@ const SignatureSettingsInput = ({ value, onChange, disabled = false }: Signature
 
       {/* Summary Page Toggle */}
       <Switch
-        label={t('certSign.collab.sessionCreation.includeSummaryPage', 'Include Signature Summary Page')}
-        description={t('certSign.collab.sessionCreation.includeSummaryPageHelp', 'A summary page will be added at the end with all signature metadata. The digital certificate signature boxes on individual pages will be suppressed (wet signatures are unaffected).')}
+        label={t(
+          "certSign.collab.sessionCreation.includeSummaryPage",
+          "Include Signature Summary Page",
+        )}
+        description={t(
+          "certSign.collab.sessionCreation.includeSummaryPageHelp",
+          "A summary page will be added at the end with all signature metadata. The digital certificate signature boxes on individual pages will be suppressed (wet signatures are unaffected).",
+        )}
         checked={value.includeSummaryPage || false}
-        onChange={(event) => handleChange('includeSummaryPage', event.currentTarget.checked)}
+        onChange={(event) =>
+          handleChange("includeSummaryPage", event.currentTarget.checked)
+        }
         disabled={disabled}
         size="sm"
       />
diff --git a/frontend/src/core/components/tools/certSign/WetSignatureInput.tsx b/frontend/src/core/components/tools/certSign/WetSignatureInput.tsx
index a2350ba1a4..57c0ec27ff 100644
--- a/frontend/src/core/components/tools/certSign/WetSignatureInput.tsx
+++ b/frontend/src/core/components/tools/certSign/WetSignatureInput.tsx
@@ -1,5 +1,5 @@
-import { useState, useCallback, useEffect } from 'react';
-import { useTranslation } from 'react-i18next';
+import { useState, useCallback, useEffect } from "react";
+import { useTranslation } from "react-i18next";
 import {
   Stack,
   SegmentedControl,
@@ -8,14 +8,14 @@ import {
   FileInput,
   PasswordInput,
   Divider,
-} from '@mantine/core';
-import { DrawingCanvas } from '@app/components/annotation/shared/DrawingCanvas';
-import { ImageUploader } from '@app/components/annotation/shared/ImageUploader';
-import { TextInputWithFont } from '@app/components/annotation/shared/TextInputWithFont';
-import { ColorPicker } from '@app/components/annotation/shared/ColorPicker';
+} from "@mantine/core";
+import { DrawingCanvas } from "@app/components/annotation/shared/DrawingCanvas";
+import { ImageUploader } from "@app/components/annotation/shared/ImageUploader";
+import { TextInputWithFont } from "@app/components/annotation/shared/TextInputWithFont";
+import { ColorPicker } from "@app/components/annotation/shared/ColorPicker";
 
-type SignatureType = 'canvas' | 'image' | 'text';
-type CertificateType = 'SERVER' | 'USER_CERT' | 'UPLOAD';
+type SignatureType = "canvas" | "image" | "text";
+type CertificateType = "SERVER" | "USER_CERT" | "UPLOAD";
 
 interface WetSignatureInputProps {
   onSignatureDataChange: (data: string | undefined) => void;
@@ -43,23 +43,27 @@ const WetSignatureInput = ({
   const { t } = useTranslation();
 
   // Signature type state
-  const [signatureType, setSignatureType] = useState<SignatureType>('canvas');
+  const [signatureType, setSignatureType] = useState<SignatureType>("canvas");
 
   // Canvas drawing state
-  const [selectedColor, setSelectedColor] = useState('#000000');
+  const [selectedColor, setSelectedColor] = useState("#000000");
   const [penSize, setPenSize] = useState(2);
-  const [penSizeInput, setPenSizeInput] = useState('2');
+  const [penSizeInput, setPenSizeInput] = useState("2");
   const [isColorPickerOpen, setIsColorPickerOpen] = useState(false);
-  const [canvasSignatureData, setCanvasSignatureData] = useState<string | undefined>();
+  const [canvasSignatureData, setCanvasSignatureData] = useState<
+    string | undefined
+  >();
 
   // Image upload state
-  const [imageSignatureData, setImageSignatureData] = useState<string | undefined>();
+  const [imageSignatureData, setImageSignatureData] = useState<
+    string | undefined
+  >();
 
   // Text signature state
-  const [signerName, setSignerName] = useState('');
+  const [signerName, setSignerName] = useState("");
   const [fontSize, setFontSize] = useState(16);
-  const [fontFamily, setFontFamily] = useState('Helvetica');
-  const [textColor, setTextColor] = useState('#000000');
+  const [fontFamily, setFontFamily] = useState("Helvetica");
+  const [textColor, setTextColor] = useState("#000000");
 
   // Handle signature type change
   const handleSignatureTypeChange = useCallback(
@@ -68,16 +72,22 @@ const WetSignatureInput = ({
       onSignatureTypeChange(type);
 
       // Update signature data based on type
-      if (type === 'canvas') {
+      if (type === "canvas") {
         onSignatureDataChange(canvasSignatureData);
-      } else if (type === 'image') {
+      } else if (type === "image") {
         onSignatureDataChange(imageSignatureData);
-      } else if (type === 'text') {
+      } else if (type === "text") {
         // For text signatures, we pass the signer name
         onSignatureDataChange(signerName || undefined);
       }
     },
-    [canvasSignatureData, imageSignatureData, signerName, onSignatureTypeChange, onSignatureDataChange]
+    [
+      canvasSignatureData,
+      imageSignatureData,
+      signerName,
+      onSignatureTypeChange,
+      onSignatureDataChange,
+    ],
   );
 
   // Handle canvas signature change
@@ -85,11 +95,11 @@ const WetSignatureInput = ({
     (data: string | null) => {
       const nextValue = data ?? undefined;
       setCanvasSignatureData(nextValue);
-      if (signatureType === 'canvas') {
+      if (signatureType === "canvas") {
         onSignatureDataChange(nextValue);
       }
     },
-    [signatureType, onSignatureDataChange]
+    [signatureType, onSignatureDataChange],
   );
 
   // Handle image upload
@@ -103,7 +113,7 @@ const WetSignatureInput = ({
               if (e.target?.result) {
                 resolve(e.target.result as string);
               } else {
-                reject(new Error('Failed to read file'));
+                reject(new Error("Failed to read file"));
               }
             };
             reader.onerror = () => reject(reader.error);
@@ -111,35 +121,38 @@ const WetSignatureInput = ({
           });
 
           setImageSignatureData(result);
-          if (signatureType === 'image') {
+          if (signatureType === "image") {
             onSignatureDataChange(result);
           }
         } catch (error) {
-          console.error('Error reading file:', error);
+          console.error("Error reading file:", error);
         }
       } else if (!file) {
         setImageSignatureData(undefined);
-        if (signatureType === 'image') {
+        if (signatureType === "image") {
           onSignatureDataChange(undefined);
         }
       }
     },
-    [disabled, signatureType, onSignatureDataChange]
+    [disabled, signatureType, onSignatureDataChange],
   );
 
   // Handle text signature changes
   useEffect(() => {
-    if (signatureType === 'text') {
+    if (signatureType === "text") {
       onSignatureDataChange(signerName || undefined);
     }
   }, [signatureType, signerName, onSignatureDataChange]);
 
   const renderSignatureBuilder = () => {
-    if (signatureType === 'canvas') {
+    if (signatureType === "canvas") {
       return (
         <Stack gap="xs">
           <Text size="xs" c="dimmed">
-            {t('certSign.collab.signRequest.drawSignature', 'Draw your signature below')}
+            {t(
+              "certSign.collab.signRequest.drawSignature",
+              "Draw your signature below",
+            )}
           </Text>
           <DrawingCanvas
             selectedColor={selectedColor}
@@ -157,13 +170,19 @@ const WetSignatureInput = ({
       );
     }
 
-    if (signatureType === 'image') {
+    if (signatureType === "image") {
       return (
         <Stack gap="xs">
           <Text size="xs" c="dimmed">
-            {t('certSign.collab.signRequest.uploadSignature', 'Upload your signature image')}
+            {t(
+              "certSign.collab.signRequest.uploadSignature",
+              "Upload your signature image",
+            )}
           </Text>
-          <ImageUploader onImageChange={handleImageChange} disabled={disabled} />
+          <ImageUploader
+            onImageChange={handleImageChange}
+            disabled={disabled}
+          />
         </Stack>
       );
     }
@@ -171,7 +190,10 @@ const WetSignatureInput = ({
     return (
       <Stack gap="xs">
         <Text size="xs" c="dimmed">
-          {t('certSign.collab.signRequest.typeSignature', 'Type your name to create a signature')}
+          {t(
+            "certSign.collab.signRequest.typeSignature",
+            "Type your name to create a signature",
+          )}
         </Text>
         <TextInputWithFont
           text={signerName}
@@ -184,11 +206,20 @@ const WetSignatureInput = ({
           onTextColorChange={setTextColor}
           disabled={disabled}
           onAnyChange={() => {}}
-          label={t('certSign.collab.signRequest.signatureText', 'Signature Text')}
-          placeholder={t('certSign.collab.signRequest.signatureTextPlaceholder', 'Enter your name...')}
-          fontLabel={t('certSign.collab.signRequest.fontFamily', 'Font Family')}
-          fontSizeLabel={t('certSign.collab.signRequest.fontSize', 'Font Size')}
-          fontSizePlaceholder={t('certSign.collab.signRequest.fontSizePlaceholder', 'Size')}
+          label={t(
+            "certSign.collab.signRequest.signatureText",
+            "Signature Text",
+          )}
+          placeholder={t(
+            "certSign.collab.signRequest.signatureTextPlaceholder",
+            "Enter your name...",
+          )}
+          fontLabel={t("certSign.collab.signRequest.fontFamily", "Font Family")}
+          fontSizeLabel={t("certSign.collab.signRequest.fontSize", "Font Size")}
+          fontSizePlaceholder={t(
+            "certSign.collab.signRequest.fontSizePlaceholder",
+            "Size",
+          )}
         />
       </Stack>
     );
@@ -199,16 +230,21 @@ const WetSignatureInput = ({
       {/* Signature Type Selector */}
       <Stack gap="xs">
         <Text size="sm" fw={600}>
-          {t('certSign.collab.signRequest.signatureTypeLabel', 'Signature Type')}
+          {t(
+            "certSign.collab.signRequest.signatureTypeLabel",
+            "Signature Type",
+          )}
         </Text>
         <SegmentedControl
           value={signatureType}
           fullWidth
-          onChange={(value) => handleSignatureTypeChange(value as SignatureType)}
+          onChange={(value) =>
+            handleSignatureTypeChange(value as SignatureType)
+          }
           data={[
-            { label: t('sign.type.canvas', 'Draw'), value: 'canvas' },
-            { label: t('sign.type.image', 'Upload'), value: 'image' },
-            { label: t('sign.type.text', 'Type'), value: 'text' },
+            { label: t("sign.type.canvas", "Draw"), value: "canvas" },
+            { label: t("sign.type.image", "Upload"), value: "image" },
+            { label: t("sign.type.text", "Type"), value: "text" },
           ]}
           disabled={disabled}
         />
@@ -222,7 +258,10 @@ const WetSignatureInput = ({
       {/* Certificate Selection */}
       <Stack gap="xs">
         <Text size="sm" fw={600}>
-          {t('certSign.collab.signRequest.certificateChoice', 'Certificate Choice')}
+          {t(
+            "certSign.collab.signRequest.certificateChoice",
+            "Certificate Choice",
+          )}
         </Text>
         <Radio.Group
           value={certType}
@@ -231,30 +270,54 @@ const WetSignatureInput = ({
           <Stack gap="xs">
             <Radio
               value="USER_CERT"
-              label={t('certSign.collab.signRequest.usePersonalCert', 'Use My Personal Certificate')}
-              description={t('certSign.collab.signRequest.usePersonalCertDesc', 'Auto-generated for your account')}
+              label={t(
+                "certSign.collab.signRequest.usePersonalCert",
+                "Use My Personal Certificate",
+              )}
+              description={t(
+                "certSign.collab.signRequest.usePersonalCertDesc",
+                "Auto-generated for your account",
+              )}
               disabled={disabled}
             />
             <Radio
               value="SERVER"
-              label={t('certSign.collab.signRequest.useServerCert', 'Use Organization Certificate')}
-              description={t('certSign.collab.signRequest.useServerCertDesc', 'Shared organization certificate')}
+              label={t(
+                "certSign.collab.signRequest.useServerCert",
+                "Use Organization Certificate",
+              )}
+              description={t(
+                "certSign.collab.signRequest.useServerCertDesc",
+                "Shared organization certificate",
+              )}
               disabled={disabled}
             />
             <Radio
               value="UPLOAD"
-              label={t('certSign.collab.signRequest.uploadCert', 'Upload Custom Certificate')}
-              description={t('certSign.collab.signRequest.uploadCertDesc', 'Use your own PKCS12 certificate')}
+              label={t(
+                "certSign.collab.signRequest.uploadCert",
+                "Upload Custom Certificate",
+              )}
+              description={t(
+                "certSign.collab.signRequest.uploadCertDesc",
+                "Use your own PKCS12 certificate",
+              )}
               disabled={disabled}
             />
           </Stack>
         </Radio.Group>
 
-        {certType === 'UPLOAD' && (
+        {certType === "UPLOAD" && (
           <Stack gap="xs" mt="xs">
             <FileInput
-              label={t('certSign.collab.signRequest.p12File', 'P12/PFX Certificate File')}
-              placeholder={t('certSign.collab.signRequest.selectFile', 'Select file...')}
+              label={t(
+                "certSign.collab.signRequest.p12File",
+                "P12/PFX Certificate File",
+              )}
+              placeholder={t(
+                "certSign.collab.signRequest.selectFile",
+                "Select file...",
+              )}
               accept=".p12,.pfx"
               value={p12File}
               onChange={onP12FileChange}
@@ -262,7 +325,10 @@ const WetSignatureInput = ({
               disabled={disabled}
             />
             <PasswordInput
-              label={t('certSign.collab.signRequest.password', 'Certificate Password')}
+              label={t(
+                "certSign.collab.signRequest.password",
+                "Certificate Password",
+              )}
               value={password}
               onChange={(event) => onPasswordChange(event.currentTarget.value)}
               size="xs"
@@ -278,7 +344,7 @@ const WetSignatureInput = ({
         onClose={() => setIsColorPickerOpen(false)}
         selectedColor={selectedColor}
         onColorChange={setSelectedColor}
-        title={t('sign.canvas.colorPickerTitle', 'Choose stroke colour')}
+        title={t("sign.canvas.colorPickerTitle", "Choose stroke colour")}
       />
     </Stack>
   );
diff --git a/frontend/src/core/components/tools/certSign/modals/AddParticipantsFlow.tsx b/frontend/src/core/components/tools/certSign/modals/AddParticipantsFlow.tsx
index 81b8d8560f..f9be2f9787 100644
--- a/frontend/src/core/components/tools/certSign/modals/AddParticipantsFlow.tsx
+++ b/frontend/src/core/components/tools/certSign/modals/AddParticipantsFlow.tsx
@@ -1,8 +1,8 @@
-import { useState } from 'react';
-import { Modal, Stack, TextInput, Button, Group } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import AddIcon from '@mui/icons-material/Add';
-import UserSelector from '@app/components/shared/UserSelector';
+import { useState } from "react";
+import { Modal, Stack, TextInput, Button, Group } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import AddIcon from "@mui/icons-material/Add";
+import UserSelector from "@app/components/shared/UserSelector";
 
 interface AddParticipantsFlowProps {
   opened: boolean;
@@ -17,12 +17,12 @@ export const AddParticipantsFlow: React.FC<AddParticipantsFlowProps> = ({
 }) => {
   const { t } = useTranslation();
   const [selectedUserIds, setSelectedUserIds] = useState<number[]>([]);
-  const [defaultReason, setDefaultReason] = useState('');
+  const [defaultReason, setDefaultReason] = useState("");
   const [submitting, setSubmitting] = useState(false);
 
   const handleClose = () => {
     setSelectedUserIds([]);
-    setDefaultReason('');
+    setDefaultReason("");
     onClose();
   };
 
@@ -32,7 +32,7 @@ export const AddParticipantsFlow: React.FC<AddParticipantsFlowProps> = ({
       await onSubmit(selectedUserIds, defaultReason.trim() || undefined);
       handleClose();
     } catch (error) {
-      console.error('Failed to add participants:', error);
+      console.error("Failed to add participants:", error);
     } finally {
       setSubmitting(false);
     }
@@ -42,28 +42,40 @@ export const AddParticipantsFlow: React.FC<AddParticipantsFlowProps> = ({
     <Modal
       opened={opened}
       onClose={handleClose}
-      title={t('certSign.collab.sessionDetail.addParticipants', 'Add Participants')}
+      title={t(
+        "certSign.collab.sessionDetail.addParticipants",
+        "Add Participants",
+      )}
       size="lg"
     >
       <Stack gap="md">
         <UserSelector
           value={selectedUserIds}
           onChange={setSelectedUserIds}
-          placeholder={t('certSign.collab.sessionDetail.selectUsers', 'Select users...')}
+          placeholder={t(
+            "certSign.collab.sessionDetail.selectUsers",
+            "Select users...",
+          )}
         />
 
         <TextInput
-          label={t('certSign.reason', 'Default Reason')}
-          description={t('certSign.collab.addParticipants.reasonHelp', 'Pre-set a signing reason for these participants (optional, they can override when signing)')}
+          label={t("certSign.reason", "Default Reason")}
+          description={t(
+            "certSign.collab.addParticipants.reasonHelp",
+            "Pre-set a signing reason for these participants (optional, they can override when signing)",
+          )}
           value={defaultReason}
           onChange={(e) => setDefaultReason(e.currentTarget.value)}
-          placeholder={t('certSign.collab.addParticipants.reasonPlaceholder', 'e.g. Approval, Review...')}
+          placeholder={t(
+            "certSign.collab.addParticipants.reasonPlaceholder",
+            "e.g. Approval, Review...",
+          )}
           size="sm"
         />
 
         <Group justify="flex-end">
           <Button variant="default" onClick={handleClose}>
-            {t('common.cancel', 'Cancel')}
+            {t("common.cancel", "Cancel")}
           </Button>
           <Button
             onClick={handleSubmit}
@@ -72,9 +84,13 @@ export const AddParticipantsFlow: React.FC<AddParticipantsFlowProps> = ({
             leftSection={<AddIcon sx={{ fontSize: 16 }} />}
             color="green"
           >
-            {t('certSign.collab.addParticipants.add', 'Add {{count}} Participant(s)', {
-              count: selectedUserIds.length,
-            })}
+            {t(
+              "certSign.collab.addParticipants.add",
+              "Add {{count}} Participant(s)",
+              {
+                count: selectedUserIds.length,
+              },
+            )}
           </Button>
         </Group>
       </Stack>
diff --git a/frontend/src/core/components/tools/certSign/modals/CertificateConfigModal.tsx b/frontend/src/core/components/tools/certSign/modals/CertificateConfigModal.tsx
index d70cb7d1c1..5ddc85b54a 100644
--- a/frontend/src/core/components/tools/certSign/modals/CertificateConfigModal.tsx
+++ b/frontend/src/core/components/tools/certSign/modals/CertificateConfigModal.tsx
@@ -1,10 +1,23 @@
-import { Modal, Stack, Group, Button, Text, Collapse, TextInput, Loader } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { useState, useEffect, useRef } from 'react';
-import CheckCircleIcon from '@mui/icons-material/CheckCircle';
-import ErrorIcon from '@mui/icons-material/Error';
-import { CertificateSelector, CertificateType, UploadFormat } from '@app/components/tools/certSign/CertificateSelector';
-import apiClient from '@app/services/apiClient';
+import {
+  Modal,
+  Stack,
+  Group,
+  Button,
+  Text,
+  Collapse,
+  TextInput,
+  Loader,
+} from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import { useState, useEffect, useRef } from "react";
+import CheckCircleIcon from "@mui/icons-material/CheckCircle";
+import ErrorIcon from "@mui/icons-material/Error";
+import {
+  CertificateSelector,
+  CertificateType,
+  UploadFormat,
+} from "@app/components/tools/certSign/CertificateSelector";
+import apiClient from "@app/services/apiClient";
 
 export interface CertificateSubmitData {
   certType: CertificateType;
@@ -17,15 +30,19 @@ export interface CertificateSubmitData {
 }
 
 type CertValidationState =
-  | { status: 'idle' }
-  | { status: 'validating' }
-  | { status: 'valid'; subjectName: string | null; notAfter: string | null }
-  | { status: 'error'; message: string };
+  | { status: "idle" }
+  | { status: "validating" }
+  | { status: "valid"; subjectName: string | null; notAfter: string | null }
+  | { status: "error"; message: string };
 
 interface CertificateConfigModalProps {
   opened: boolean;
   onClose: () => void;
-  onSign: (certData: CertificateSubmitData, reason?: string, location?: string) => Promise<void>;
+  onSign: (
+    certData: CertificateSubmitData,
+    reason?: string,
+    location?: string,
+  ) => Promise<void>;
   signatureCount: number;
   disabled?: boolean;
   defaultReason?: string;
@@ -40,52 +57,54 @@ export const CertificateConfigModal: React.FC<CertificateConfigModalProps> = ({
   onSign,
   signatureCount,
   disabled = false,
-  defaultReason = '',
-  defaultLocation = '',
+  defaultReason = "",
+  defaultLocation = "",
   participantToken,
 }) => {
   const { t } = useTranslation();
 
-  const [certType, setCertType] = useState<CertificateType>('USER_CERT');
-  const [uploadFormat, setUploadFormat] = useState<UploadFormat>('PKCS12');
+  const [certType, setCertType] = useState<CertificateType>("USER_CERT");
+  const [uploadFormat, setUploadFormat] = useState<UploadFormat>("PKCS12");
   const [p12File, setP12File] = useState<File | null>(null);
   const [privateKeyFile, setPrivateKeyFile] = useState<File | null>(null);
   const [certFile, setCertFile] = useState<File | null>(null);
   const [jksFile, setJksFile] = useState<File | null>(null);
-  const [password, setPassword] = useState('');
+  const [password, setPassword] = useState("");
   const [signing, setSigning] = useState(false);
-  const [certValidation, setCertValidation] = useState<CertValidationState>({ status: 'idle' });
+  const [certValidation, setCertValidation] = useState<CertValidationState>({
+    status: "idle",
+  });
   const validationTimerRef = useRef<ReturnType<typeof setTimeout> | null>(null);
 
   // Debounced certificate pre-validation: fires 600ms after cert file or password changes
   useEffect(() => {
     // Only validate uploaded keystores (not SERVER/USER_CERT, not PEM which uses separate files)
-    const keystoreFile = uploadFormat === 'JKS' ? jksFile : p12File;
-    if (certType !== 'UPLOAD' || !keystoreFile || uploadFormat === 'PEM') {
-      setCertValidation({ status: 'idle' });
+    const keystoreFile = uploadFormat === "JKS" ? jksFile : p12File;
+    if (certType !== "UPLOAD" || !keystoreFile || uploadFormat === "PEM") {
+      setCertValidation({ status: "idle" });
       return;
     }
 
     if (validationTimerRef.current) clearTimeout(validationTimerRef.current);
-    setCertValidation({ status: 'validating' });
+    setCertValidation({ status: "validating" });
 
     validationTimerRef.current = setTimeout(async () => {
       try {
         const formData = new FormData();
-        formData.append('certType', uploadFormat === 'JKS' ? 'JKS' : 'P12');
-        formData.append('password', password);
-        if (uploadFormat === 'JKS') {
-          formData.append('jksFile', keystoreFile);
+        formData.append("certType", uploadFormat === "JKS" ? "JKS" : "P12");
+        formData.append("password", password);
+        if (uploadFormat === "JKS") {
+          formData.append("jksFile", keystoreFile);
         } else {
-          formData.append('p12File', keystoreFile);
+          formData.append("p12File", keystoreFile);
         }
 
         const endpoint = participantToken
-          ? '/api/v1/workflow/participant/validate-certificate'
-          : '/api/v1/security/cert-sign/validate-certificate';
+          ? "/api/v1/workflow/participant/validate-certificate"
+          : "/api/v1/security/cert-sign/validate-certificate";
 
         if (participantToken) {
-          formData.append('participantToken', participantToken);
+          formData.append("participantToken", participantToken);
         }
 
         const response = await apiClient.post<{
@@ -93,19 +112,35 @@ export const CertificateConfigModal: React.FC<CertificateConfigModalProps> = ({
           subjectName: string | null;
           notAfter: string | null;
           error: string | null;
-        }>(endpoint, formData, { headers: { 'Content-Type': 'multipart/form-data' } });
+        }>(endpoint, formData, {
+          headers: { "Content-Type": "multipart/form-data" },
+        });
 
         if (response.data.valid) {
           setCertValidation({
-            status: 'valid',
+            status: "valid",
             subjectName: response.data.subjectName,
             notAfter: response.data.notAfter,
           });
         } else {
-          setCertValidation({ status: 'error', message: response.data.error ?? t('certSign.collab.signRequest.certModal.certInvalidFallback', 'Invalid certificate') });
+          setCertValidation({
+            status: "error",
+            message:
+              response.data.error ??
+              t(
+                "certSign.collab.signRequest.certModal.certInvalidFallback",
+                "Invalid certificate",
+              ),
+          });
         }
       } catch {
-        setCertValidation({ status: 'error', message: t('certSign.collab.signRequest.certModal.certNetworkError', 'Could not validate certificate') });
+        setCertValidation({
+          status: "error",
+          message: t(
+            "certSign.collab.signRequest.certModal.certNetworkError",
+            "Could not validate certificate",
+          ),
+        });
       }
     }, 600);
 
@@ -120,22 +155,20 @@ export const CertificateConfigModal: React.FC<CertificateConfigModalProps> = ({
   const [location, setLocation] = useState(defaultLocation);
 
   const isUploadValid = () => {
-    if (certType !== 'UPLOAD') return true;
+    if (certType !== "UPLOAD") return true;
     switch (uploadFormat) {
-      case 'PKCS12':
-      case 'PFX':
+      case "PKCS12":
+      case "PFX":
         return p12File !== null;
-      case 'PEM':
+      case "PEM":
         return privateKeyFile !== null && certFile !== null;
-      case 'JKS':
+      case "JKS":
         return jksFile !== null;
     }
   };
 
   const isValid =
-    certType === 'USER_CERT' ||
-    certType === 'SERVER' ||
-    isUploadValid();
+    certType === "USER_CERT" || certType === "SERVER" || isUploadValid();
 
   const handleSign = async () => {
     if (!isValid) return;
@@ -143,12 +176,20 @@ export const CertificateConfigModal: React.FC<CertificateConfigModalProps> = ({
     setSigning(true);
     try {
       await onSign(
-        { certType, uploadFormat, p12File, privateKeyFile, certFile, jksFile, password },
+        {
+          certType,
+          uploadFormat,
+          p12File,
+          privateKeyFile,
+          certFile,
+          jksFile,
+          password,
+        },
         reason,
-        location
+        location,
       );
     } catch (error) {
-      console.error('Failed to sign document:', error);
+      console.error("Failed to sign document:", error);
     } finally {
       setSigning(false);
     }
@@ -158,16 +199,19 @@ export const CertificateConfigModal: React.FC<CertificateConfigModalProps> = ({
     <Modal
       opened={opened}
       onClose={onClose}
-      title={t('certSign.collab.signRequest.certModal.title', 'Configure Certificate')}
+      title={t(
+        "certSign.collab.signRequest.certModal.title",
+        "Configure Certificate",
+      )}
       centered
       size="lg"
     >
       <Stack gap="md">
         <Text size="sm" c="dimmed">
           {t(
-            'certSign.collab.signRequest.certModal.description',
-            'You have placed {{count}} signature(s). Choose your certificate to complete signing.',
-            { count: signatureCount }
+            "certSign.collab.signRequest.certModal.description",
+            "You have placed {{count}} signature(s). Choose your certificate to complete signing.",
+            { count: signatureCount },
           )}
         </Text>
 
@@ -190,34 +234,53 @@ export const CertificateConfigModal: React.FC<CertificateConfigModalProps> = ({
         />
 
         {/* Certificate validation status */}
-        {certValidation.status === 'validating' && (
+        {certValidation.status === "validating" && (
           <Group gap="xs">
             <Loader size="xs" />
             <Text size="sm" c="dimmed">
-              {t('certSign.collab.signRequest.certModal.certValidating', 'Validating certificate...')}
+              {t(
+                "certSign.collab.signRequest.certModal.certValidating",
+                "Validating certificate...",
+              )}
             </Text>
           </Group>
         )}
-        {certValidation.status === 'valid' && (
+        {certValidation.status === "valid" && (
           <Group gap="xs">
-            <CheckCircleIcon fontSize="small" style={{ color: 'var(--mantine-color-green-6)' }} />
+            <CheckCircleIcon
+              fontSize="small"
+              style={{ color: "var(--mantine-color-green-6)" }}
+            />
             <Text size="sm" c="green">
-              {t('certSign.collab.signRequest.certModal.certValidUntil', 'Certificate valid until {{date}}', {
-                date: certValidation.notAfter
-                  ? new Date(certValidation.notAfter).toLocaleDateString()
-                  : '—',
-              })}
-              {certValidation.subjectName ? ` · ${certValidation.subjectName}` : ''}
+              {t(
+                "certSign.collab.signRequest.certModal.certValidUntil",
+                "Certificate valid until {{date}}",
+                {
+                  date: certValidation.notAfter
+                    ? new Date(certValidation.notAfter).toLocaleDateString()
+                    : "—",
+                },
+              )}
+              {certValidation.subjectName
+                ? ` · ${certValidation.subjectName}`
+                : ""}
             </Text>
           </Group>
         )}
-        {certValidation.status === 'error' && (
+        {certValidation.status === "error" && (
           <Group gap="xs">
-            <ErrorIcon fontSize="small" style={{ color: 'var(--mantine-color-red-6)' }} />
+            <ErrorIcon
+              fontSize="small"
+              style={{ color: "var(--mantine-color-red-6)" }}
+            />
             <Text size="sm" c="red">
-              {t('certSign.collab.signRequest.certModal.certInvalid', 'Certificate invalid: {{error}}', {
-                error: certValidation.message,
-              })}
+              {t(
+                "certSign.collab.signRequest.certModal.certInvalid",
+                "Certificate invalid: {{error}}",
+                {
+                  error: certValidation.message,
+                },
+              )}
             </Text>
           </Group>
         )}
@@ -229,23 +292,38 @@ export const CertificateConfigModal: React.FC<CertificateConfigModalProps> = ({
             size="xs"
             onClick={() => setShowAdvanced(!showAdvanced)}
             disabled={disabled || signing}
-            style={{ marginBottom: '8px' }}
+            style={{ marginBottom: "8px" }}
           >
-            {t('certSign.collab.signRequest.advancedSettings', 'Advanced Settings')}
+            {t(
+              "certSign.collab.signRequest.advancedSettings",
+              "Advanced Settings",
+            )}
           </Button>
 
           <Collapse in={showAdvanced}>
             <Stack gap="sm">
               <TextInput
-                label={t('certSign.collab.signRequest.reason', 'Reason (Optional)')}
-                placeholder={t('certSign.collab.signRequest.reasonPlaceholder', 'Why are you signing?')}
+                label={t(
+                  "certSign.collab.signRequest.reason",
+                  "Reason (Optional)",
+                )}
+                placeholder={t(
+                  "certSign.collab.signRequest.reasonPlaceholder",
+                  "Why are you signing?",
+                )}
                 value={reason}
                 onChange={(e) => setReason(e.currentTarget.value)}
                 disabled={disabled || signing}
               />
               <TextInput
-                label={t('certSign.collab.signRequest.location', 'Location (Optional)')}
-                placeholder={t('certSign.collab.signRequest.locationPlaceholder', 'Where are you signing from?')}
+                label={t(
+                  "certSign.collab.signRequest.location",
+                  "Location (Optional)",
+                )}
+                placeholder={t(
+                  "certSign.collab.signRequest.locationPlaceholder",
+                  "Where are you signing from?",
+                )}
                 value={location}
                 onChange={(e) => setLocation(e.currentTarget.value)}
                 disabled={disabled || signing}
@@ -256,14 +334,19 @@ export const CertificateConfigModal: React.FC<CertificateConfigModalProps> = ({
 
         <Group justify="space-between" wrap="wrap" mt="md">
           <Button variant="default" onClick={onClose} disabled={signing}>
-            {t('cancel', 'Cancel')}
+            {t("cancel", "Cancel")}
           </Button>
           <Button
             onClick={handleSign}
-            disabled={!isValid || disabled || signing || certValidation.status === 'validating'}
+            disabled={
+              !isValid ||
+              disabled ||
+              signing ||
+              certValidation.status === "validating"
+            }
             loading={signing}
           >
-            {t('certSign.collab.signRequest.certModal.sign', 'Sign Document')}
+            {t("certSign.collab.signRequest.certModal.sign", "Sign Document")}
           </Button>
         </Group>
       </Stack>
diff --git a/frontend/src/core/components/tools/certSign/modals/SelectSignatureModal.tsx b/frontend/src/core/components/tools/certSign/modals/SelectSignatureModal.tsx
index 6d79cc193b..f14e3a31e5 100644
--- a/frontend/src/core/components/tools/certSign/modals/SelectSignatureModal.tsx
+++ b/frontend/src/core/components/tools/certSign/modals/SelectSignatureModal.tsx
@@ -1,16 +1,28 @@
-import { Modal, Stack, Button, Text, Group, Box, ActionIcon, UnstyledButton } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { useSavedSignatures, SavedSignature } from '@app/hooks/tools/sign/useSavedSignatures';
-import DrawIcon from '@mui/icons-material/Draw';
-import TextFieldsIcon from '@mui/icons-material/TextFields';
-import ImageIcon from '@mui/icons-material/Image';
-import CloseIcon from '@mui/icons-material/Close';
+import {
+  Modal,
+  Stack,
+  Button,
+  Text,
+  Group,
+  Box,
+  ActionIcon,
+  UnstyledButton,
+} from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import {
+  useSavedSignatures,
+  SavedSignature,
+} from "@app/hooks/tools/sign/useSavedSignatures";
+import DrawIcon from "@mui/icons-material/Draw";
+import TextFieldsIcon from "@mui/icons-material/TextFields";
+import ImageIcon from "@mui/icons-material/Image";
+import CloseIcon from "@mui/icons-material/Close";
 
 interface SelectSignatureModalProps {
   opened: boolean;
   onClose: () => void;
   onSignatureSelected: (signature: SavedSignature) => void;
-  onCreateNew: (type: 'canvas' | 'text' | 'image') => void;
+  onCreateNew: (type: "canvas" | "text" | "image") => void;
 }
 
 export const SelectSignatureModal: React.FC<SelectSignatureModalProps> = ({
@@ -23,24 +35,24 @@ export const SelectSignatureModal: React.FC<SelectSignatureModalProps> = ({
   const { savedSignatures, removeSignature } = useSavedSignatures();
 
   const sortedSavedSignatures = [...savedSignatures].sort(
-    (a, b) => (b.updatedAt ?? b.createdAt) - (a.updatedAt ?? a.createdAt)
+    (a, b) => (b.updatedAt ?? b.createdAt) - (a.updatedAt ?? a.createdAt),
   );
 
   const renderSignaturePreview = (sig: SavedSignature) => {
-    if (sig.type === 'text') {
+    if (sig.type === "text") {
       return (
         <Box
           style={{
             width: 72,
             height: 28,
-            backgroundColor: '#ffffff',
+            backgroundColor: "#ffffff",
             borderRadius: 8,
-            display: 'flex',
-            alignItems: 'center',
-            justifyContent: 'center',
-            padding: '0 8px',
-            overflow: 'hidden',
-            border: '1px solid var(--mantine-color-gray-3)',
+            display: "flex",
+            alignItems: "center",
+            justifyContent: "center",
+            padding: "0 8px",
+            overflow: "hidden",
+            border: "1px solid var(--mantine-color-gray-3)",
           }}
         >
           <Text
@@ -48,10 +60,10 @@ export const SelectSignatureModal: React.FC<SelectSignatureModalProps> = ({
             style={{
               fontFamily: sig.fontFamily,
               color: sig.textColor,
-              whiteSpace: 'nowrap',
-              overflow: 'hidden',
-              textOverflow: 'ellipsis',
-              maxWidth: '100%',
+              whiteSpace: "nowrap",
+              overflow: "hidden",
+              textOverflow: "ellipsis",
+              maxWidth: "100%",
             }}
           >
             {sig.signerName}
@@ -65,24 +77,27 @@ export const SelectSignatureModal: React.FC<SelectSignatureModalProps> = ({
         style={{
           width: 72,
           height: 28,
-          backgroundColor: '#ffffff',
+          backgroundColor: "#ffffff",
           borderRadius: 8,
-          display: 'flex',
-          alignItems: 'center',
-          justifyContent: 'center',
-          padding: '2px 6px',
-          border: '1px solid var(--mantine-color-gray-3)',
+          display: "flex",
+          alignItems: "center",
+          justifyContent: "center",
+          padding: "2px 6px",
+          border: "1px solid var(--mantine-color-gray-3)",
         }}
       >
         <Box
           component="img"
           src={sig.dataUrl}
-          alt={sig.label || t('certSign.collab.signRequest.saved.defaultLabel', 'Signature')}
+          alt={
+            sig.label ||
+            t("certSign.collab.signRequest.saved.defaultLabel", "Signature")
+          }
           style={{
-            maxWidth: '100%',
-            maxHeight: '100%',
-            objectFit: 'contain',
-            display: 'block',
+            maxWidth: "100%",
+            maxHeight: "100%",
+            objectFit: "contain",
+            display: "block",
           }}
         />
       </Box>
@@ -93,7 +108,10 @@ export const SelectSignatureModal: React.FC<SelectSignatureModalProps> = ({
     <Modal
       opened={opened}
       onClose={onClose}
-      title={t('certSign.collab.signRequest.selectSignatureTitle', 'Select or Create Signature')}
+      title={t(
+        "certSign.collab.signRequest.selectSignatureTitle",
+        "Select or Create Signature",
+      )}
       centered
       size="md"
     >
@@ -101,7 +119,10 @@ export const SelectSignatureModal: React.FC<SelectSignatureModalProps> = ({
         {sortedSavedSignatures.length > 0 && (
           <>
             <Text size="sm" fw={600}>
-              {t('certSign.collab.signRequest.savedSignatures', 'Saved Signatures')}
+              {t(
+                "certSign.collab.signRequest.savedSignatures",
+                "Saved Signatures",
+              )}
             </Text>
             <Stack gap="xs">
               {sortedSavedSignatures.map((sig) => (
@@ -109,11 +130,18 @@ export const SelectSignatureModal: React.FC<SelectSignatureModalProps> = ({
                   key={sig.id}
                   gap={0}
                   wrap="nowrap"
-                  style={{ border: '1px solid var(--mantine-color-gray-3)', borderRadius: 8, overflow: 'hidden' }}
+                  style={{
+                    border: "1px solid var(--mantine-color-gray-3)",
+                    borderRadius: 8,
+                    overflow: "hidden",
+                  }}
                 >
                   <UnstyledButton
-                    onClick={() => { onSignatureSelected(sig); onClose(); }}
-                    style={{ flex: 1, padding: '12px' }}
+                    onClick={() => {
+                      onSignatureSelected(sig);
+                      onClose();
+                    }}
+                    style={{ flex: 1, padding: "12px" }}
                   >
                     {renderSignaturePreview(sig)}
                   </UnstyledButton>
@@ -122,10 +150,13 @@ export const SelectSignatureModal: React.FC<SelectSignatureModalProps> = ({
                     variant="subtle"
                     size="sm"
                     onClick={() => removeSignature(sig.id)}
-                    aria-label={t('certSign.collab.signRequest.saved.delete', 'Delete signature')}
-                    style={{ margin: '0 6px' }}
+                    aria-label={t(
+                      "certSign.collab.signRequest.saved.delete",
+                      "Delete signature",
+                    )}
+                    style={{ margin: "0 6px" }}
                   >
-                    <CloseIcon sx={{ fontSize: '1rem' }} />
+                    <CloseIcon sx={{ fontSize: "1rem" }} />
                   </ActionIcon>
                 </Group>
               ))}
@@ -133,8 +164,15 @@ export const SelectSignatureModal: React.FC<SelectSignatureModalProps> = ({
           </>
         )}
 
-        <Text size="sm" fw={600} mt={sortedSavedSignatures.length > 0 ? 'md' : 0}>
-          {t('certSign.collab.signRequest.createNewSignature', 'Create New Signature')}
+        <Text
+          size="sm"
+          fw={600}
+          mt={sortedSavedSignatures.length > 0 ? "md" : 0}
+        >
+          {t(
+            "certSign.collab.signRequest.createNewSignature",
+            "Create New Signature",
+          )}
         </Text>
 
         <Group grow>
@@ -142,31 +180,31 @@ export const SelectSignatureModal: React.FC<SelectSignatureModalProps> = ({
             variant="outline"
             leftSection={<DrawIcon />}
             onClick={() => {
-              onCreateNew('canvas');
+              onCreateNew("canvas");
               onClose();
             }}
           >
-            {t('certSign.collab.signRequest.modeTabs.draw', 'Draw')}
+            {t("certSign.collab.signRequest.modeTabs.draw", "Draw")}
           </Button>
           <Button
             variant="outline"
             leftSection={<TextFieldsIcon />}
             onClick={() => {
-              onCreateNew('text');
+              onCreateNew("text");
               onClose();
             }}
           >
-            {t('certSign.collab.signRequest.modeTabs.text', 'Type')}
+            {t("certSign.collab.signRequest.modeTabs.text", "Type")}
           </Button>
           <Button
             variant="outline"
             leftSection={<ImageIcon />}
             onClick={() => {
-              onCreateNew('image');
+              onCreateNew("image");
               onClose();
             }}
           >
-            {t('certSign.collab.signRequest.modeTabs.image', 'Upload')}
+            {t("certSign.collab.signRequest.modeTabs.image", "Upload")}
           </Button>
         </Group>
       </Stack>
diff --git a/frontend/src/core/components/tools/certSign/panels/ParticipantListPanel.tsx b/frontend/src/core/components/tools/certSign/panels/ParticipantListPanel.tsx
index 202c94c94d..47c6ac008f 100644
--- a/frontend/src/core/components/tools/certSign/panels/ParticipantListPanel.tsx
+++ b/frontend/src/core/components/tools/certSign/panels/ParticipantListPanel.tsx
@@ -1,11 +1,11 @@
-import { Stack, Text, List, Group, Badge, ActionIcon } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import CheckCircleIcon from '@mui/icons-material/CheckCircle';
-import PendingIcon from '@mui/icons-material/Pending';
-import CancelIcon from '@mui/icons-material/Cancel';
-import DeleteIcon from '@mui/icons-material/Delete';
-import type { ParticipantInfo } from '@app/types/signingSession';
-import { getFileColor } from '@app/components/pageEditor/fileColors';
+import { Stack, Text, List, Group, Badge, ActionIcon } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import CheckCircleIcon from "@mui/icons-material/CheckCircle";
+import PendingIcon from "@mui/icons-material/Pending";
+import CancelIcon from "@mui/icons-material/Cancel";
+import DeleteIcon from "@mui/icons-material/Delete";
+import type { ParticipantInfo } from "@app/types/signingSession";
+import { getFileColor } from "@app/components/pageEditor/fileColors";
 
 interface ParticipantListPanelProps {
   participants: ParticipantInfo[];
@@ -21,27 +21,29 @@ export const ParticipantListPanel: React.FC<ParticipantListPanelProps> = ({
   const { t } = useTranslation();
 
   const getIcon = (status: string) => {
-    if (status === 'SIGNED') return <CheckCircleIcon sx={{ color: 'green', fontSize: '1rem' }} />;
-    if (status === 'DECLINED') return <CancelIcon sx={{ color: 'red', fontSize: '1rem' }} />;
-    return <PendingIcon sx={{ color: 'orange', fontSize: '1rem' }} />;
+    if (status === "SIGNED")
+      return <CheckCircleIcon sx={{ color: "green", fontSize: "1rem" }} />;
+    if (status === "DECLINED")
+      return <CancelIcon sx={{ color: "red", fontSize: "1rem" }} />;
+    return <PendingIcon sx={{ color: "orange", fontSize: "1rem" }} />;
   };
 
   const getColor = (status: string) => {
-    if (status === 'SIGNED') return 'green';
-    if (status === 'DECLINED') return 'red';
-    return 'orange';
+    if (status === "SIGNED") return "green";
+    if (status === "DECLINED") return "red";
+    return "orange";
   };
 
   return (
     <Stack gap="md">
       <Text size="md" fw={600}>
-        {t('certSign.collab.sessionDetail.participants', 'Participants')}
+        {t("certSign.collab.sessionDetail.participants", "Participants")}
       </Text>
 
       <List spacing={8} size="sm">
         {participants.map((participant, participantIndex) => {
-          const isSigned = participant.status === 'SIGNED';
-          const isDeclined = participant.status === 'DECLINED';
+          const isSigned = participant.status === "SIGNED";
+          const isDeclined = participant.status === "DECLINED";
           const annotationColor = getFileColor(participantIndex);
 
           return (
@@ -49,18 +51,34 @@ export const ParticipantListPanel: React.FC<ParticipantListPanelProps> = ({
               <Group justify="space-between" wrap="nowrap" gap={4}>
                 <Stack gap={2} style={{ flex: 1, minWidth: 0 }}>
                   <Group gap={6} wrap="nowrap">
-                    <div style={{ width: 10, height: 10, borderRadius: '50%', backgroundColor: annotationColor, flexShrink: 0 }} />
+                    <div
+                      style={{
+                        width: 10,
+                        height: 10,
+                        borderRadius: "50%",
+                        backgroundColor: annotationColor,
+                        flexShrink: 0,
+                      }}
+                    />
                     <Text size="xs" truncate>
                       {participant.name}
                     </Text>
                   </Group>
-                  {participant.email && participant.email !== participant.name && (
-                    <Text size="xs" c="dimmed" truncate>
-                      @{participant.email}
-                    </Text>
-                  )}
-                  <Badge size="xs" color={getColor(participant.status)} variant="light">
-                    {t(`certSign.collab.status.${participant.status.toLowerCase()}`, participant.status)}
+                  {participant.email &&
+                    participant.email !== participant.name && (
+                      <Text size="xs" c="dimmed" truncate>
+                        @{participant.email}
+                      </Text>
+                    )}
+                  <Badge
+                    size="xs"
+                    color={getColor(participant.status)}
+                    variant="light"
+                  >
+                    {t(
+                      `certSign.collab.status.${participant.status.toLowerCase()}`,
+                      participant.status,
+                    )}
                   </Badge>
                 </Stack>
                 {!finalized && !isSigned && !isDeclined && (
@@ -69,9 +87,12 @@ export const ParticipantListPanel: React.FC<ParticipantListPanelProps> = ({
                     variant="subtle"
                     color="red"
                     onClick={() => onRemove(participant.id)}
-                    title={t('certSign.collab.sessionDetail.removeParticipant', 'Remove')}
+                    title={t(
+                      "certSign.collab.sessionDetail.removeParticipant",
+                      "Remove",
+                    )}
                   >
-                    <DeleteIcon sx={{ fontSize: '1rem' }} />
+                    <DeleteIcon sx={{ fontSize: "1rem" }} />
                   </ActionIcon>
                 )}
               </Group>
diff --git a/frontend/src/core/components/tools/certSign/panels/SessionActionsPanel.tsx b/frontend/src/core/components/tools/certSign/panels/SessionActionsPanel.tsx
index c3e9e2b287..39c85d6ff7 100644
--- a/frontend/src/core/components/tools/certSign/panels/SessionActionsPanel.tsx
+++ b/frontend/src/core/components/tools/certSign/panels/SessionActionsPanel.tsx
@@ -1,8 +1,8 @@
-import { Stack, Text, Button, Divider, Paper } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import CheckCircleIcon from '@mui/icons-material/CheckCircle';
-import AddIcon from '@mui/icons-material/Add';
-import type { SessionDetail } from '@app/types/signingSession';
+import { Stack, Text, Button, Divider, Paper } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import CheckCircleIcon from "@mui/icons-material/CheckCircle";
+import AddIcon from "@mui/icons-material/Add";
+import type { SessionDetail } from "@app/types/signingSession";
 
 interface SessionActionsPanelProps {
   session: SessionDetail;
@@ -23,7 +23,7 @@ export const SessionActionsPanel: React.FC<SessionActionsPanelProps> = ({
 }) => {
   const { t } = useTranslation();
 
-  const allSigned = session.participants.every((p) => p.status === 'SIGNED');
+  const allSigned = session.participants.every((p) => p.status === "SIGNED");
 
   return (
     <Stack gap="md">
@@ -31,12 +31,12 @@ export const SessionActionsPanel: React.FC<SessionActionsPanelProps> = ({
       {(session.dueDate || session.message) && (
         <Stack gap="xs">
           <Text size="sm" fw={600}>
-            {t('certSign.collab.sessionDetail.sessionInfo', 'Session Info')}
+            {t("certSign.collab.sessionDetail.sessionInfo", "Session Info")}
           </Text>
           {session.dueDate && (
             <Paper p="xs" withBorder>
               <Text size="xs" fw={600} c="dimmed">
-                {t('certSign.collab.sessionDetail.dueDate', 'Due Date')}
+                {t("certSign.collab.sessionDetail.dueDate", "Due Date")}
               </Text>
               <Text size="xs">{session.dueDate}</Text>
             </Paper>
@@ -44,7 +44,7 @@ export const SessionActionsPanel: React.FC<SessionActionsPanelProps> = ({
           {session.message && (
             <Paper p="xs" withBorder>
               <Text size="xs" fw={600} c="dimmed">
-                {t('certSign.collab.sessionDetail.messageLabel', 'Message')}
+                {t("certSign.collab.sessionDetail.messageLabel", "Message")}
               </Text>
               <Text size="xs">{session.message}</Text>
             </Paper>
@@ -62,21 +62,30 @@ export const SessionActionsPanel: React.FC<SessionActionsPanelProps> = ({
             variant="light"
             fullWidth
           >
-            {t('certSign.collab.sessionDetail.addParticipants', 'Add Participants')}
+            {t(
+              "certSign.collab.sessionDetail.addParticipants",
+              "Add Participants",
+            )}
           </Button>
 
           <Divider />
 
           <Button
             leftSection={<CheckCircleIcon />}
-            color={allSigned ? 'green' : 'orange'}
+            color={allSigned ? "green" : "orange"}
             fullWidth
             onClick={onFinalize}
             loading={finalizing}
           >
             {allSigned
-              ? t('certSign.collab.finalize.button', 'Finalize and Load Signed PDF')
-              : t('certSign.collab.finalize.early', 'Finalize with Current Signatures')}
+              ? t(
+                  "certSign.collab.finalize.button",
+                  "Finalize and Load Signed PDF",
+                )
+              : t(
+                  "certSign.collab.finalize.early",
+                  "Finalize with Current Signatures",
+                )}
           </Button>
         </>
       )}
@@ -90,7 +99,10 @@ export const SessionActionsPanel: React.FC<SessionActionsPanelProps> = ({
             onClick={onLoadSignedPdf}
             loading={loadingPdf}
           >
-            {t('certSign.collab.sessionDetail.loadSignedPdf', 'Load Signed PDF into Active Files')}
+            {t(
+              "certSign.collab.sessionDetail.loadSignedPdf",
+              "Load Signed PDF into Active Files",
+            )}
           </Button>
         </>
       )}
diff --git a/frontend/src/core/components/tools/certSign/steps/AddSignaturesStep.tsx b/frontend/src/core/components/tools/certSign/steps/AddSignaturesStep.tsx
index b69ec0089f..e08ff2361d 100644
--- a/frontend/src/core/components/tools/certSign/steps/AddSignaturesStep.tsx
+++ b/frontend/src/core/components/tools/certSign/steps/AddSignaturesStep.tsx
@@ -1,12 +1,15 @@
-import { useState } from 'react';
-import { Button, Stack, Text, Paper } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import AddIcon from '@mui/icons-material/Add';
-import CancelIcon from '@mui/icons-material/Cancel';
-import { SignatureTypeSelector, SignatureType } from '@app/components/shared/wetSignature/SignatureTypeSelector';
-import { DrawSignatureCanvas } from '@app/components/shared/wetSignature/DrawSignatureCanvas';
-import { UploadSignatureImage } from '@app/components/shared/wetSignature/UploadSignatureImage';
-import { TypeSignatureText } from '@app/components/shared/wetSignature/TypeSignatureText';
+import { useState } from "react";
+import { Button, Stack, Text, Paper } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import AddIcon from "@mui/icons-material/Add";
+import CancelIcon from "@mui/icons-material/Cancel";
+import {
+  SignatureTypeSelector,
+  SignatureType,
+} from "@app/components/shared/wetSignature/SignatureTypeSelector";
+import { DrawSignatureCanvas } from "@app/components/shared/wetSignature/DrawSignatureCanvas";
+import { UploadSignatureImage } from "@app/components/shared/wetSignature/UploadSignatureImage";
+import { TypeSignatureText } from "@app/components/shared/wetSignature/TypeSignatureText";
 
 export interface PlacedSignature {
   id: string;
@@ -35,17 +38,17 @@ export const AddSignaturesStep: React.FC<AddSignaturesStepProps> = ({
   const { t } = useTranslation();
 
   // Current signature being created
-  const [signatureType, setSignatureType] = useState<SignatureType>('draw');
+  const [signatureType, setSignatureType] = useState<SignatureType>("draw");
   const [signature, setSignature] = useState<string | null>(null);
-  const [signatureText, setSignatureText] = useState('');
-  const [fontFamily, setFontFamily] = useState('Arial');
+  const [signatureText, setSignatureText] = useState("");
+  const [fontFamily, setFontFamily] = useState("Arial");
   const [fontSize, setFontSize] = useState(40);
-  const [textColor, setTextColor] = useState('#000000');
+  const [textColor, setTextColor] = useState("#000000");
 
   const hasSignature =
-    (signatureType === 'draw' && signature) ||
-    (signatureType === 'upload' && signature) ||
-    (signatureType === 'type' && signatureText && signature);
+    (signatureType === "draw" && signature) ||
+    (signatureType === "upload" && signature) ||
+    (signatureType === "type" && signatureText && signature);
 
   const handlePlaceSignature = () => {
     if (signature) {
@@ -58,7 +61,10 @@ export const AddSignaturesStep: React.FC<AddSignaturesStepProps> = ({
       {/* Signature Creation */}
       <Paper p="md" withBorder>
         <Text size="sm" fw={600} mb="md">
-          {t('certSign.collab.signRequest.steps.createSignature', 'Create Signature')}
+          {t(
+            "certSign.collab.signRequest.steps.createSignature",
+            "Create Signature",
+          )}
         </Text>
 
         <Stack gap="md">
@@ -68,7 +74,7 @@ export const AddSignaturesStep: React.FC<AddSignaturesStepProps> = ({
             disabled={disabled || placementMode}
           />
 
-          {signatureType === 'draw' && (
+          {signatureType === "draw" && (
             <DrawSignatureCanvas
               signature={signature}
               onChange={setSignature}
@@ -76,7 +82,7 @@ export const AddSignaturesStep: React.FC<AddSignaturesStepProps> = ({
             />
           )}
 
-          {signatureType === 'upload' && (
+          {signatureType === "upload" && (
             <UploadSignatureImage
               signature={signature}
               onChange={setSignature}
@@ -84,7 +90,7 @@ export const AddSignaturesStep: React.FC<AddSignaturesStepProps> = ({
             />
           )}
 
-          {signatureType === 'type' && (
+          {signatureType === "type" && (
             <TypeSignatureText
               text={signatureText}
               fontFamily={fontFamily}
@@ -105,7 +111,10 @@ export const AddSignaturesStep: React.FC<AddSignaturesStepProps> = ({
               onClick={handlePlaceSignature}
               disabled={!hasSignature || disabled}
             >
-              {t('certSign.collab.signRequest.steps.placeOnPdf', 'Place on PDF')}
+              {t(
+                "certSign.collab.signRequest.steps.placeOnPdf",
+                "Place on PDF",
+              )}
             </Button>
           ) : (
             <Button
@@ -115,7 +124,10 @@ export const AddSignaturesStep: React.FC<AddSignaturesStepProps> = ({
               variant="light"
               color="red"
             >
-              {t('certSign.collab.signRequest.steps.cancelPlacement', 'Cancel Placement')}
+              {t(
+                "certSign.collab.signRequest.steps.cancelPlacement",
+                "Cancel Placement",
+              )}
             </Button>
           )}
         </Stack>
@@ -123,7 +135,10 @@ export const AddSignaturesStep: React.FC<AddSignaturesStepProps> = ({
 
       {placementMode && (
         <Text size="xs" c="blue" ta="center">
-          {t('certSign.collab.signRequest.steps.clickMultipleTimes', 'Click on the PDF multiple times to place signatures. Drag any signature to move or resize it.')}
+          {t(
+            "certSign.collab.signRequest.steps.clickMultipleTimes",
+            "Click on the PDF multiple times to place signatures. Drag any signature to move or resize it.",
+          )}
         </Text>
       )}
     </Stack>
diff --git a/frontend/src/core/components/tools/certSign/steps/CertificateSelectionStep.tsx b/frontend/src/core/components/tools/certSign/steps/CertificateSelectionStep.tsx
index 7228156345..6df5368339 100644
--- a/frontend/src/core/components/tools/certSign/steps/CertificateSelectionStep.tsx
+++ b/frontend/src/core/components/tools/certSign/steps/CertificateSelectionStep.tsx
@@ -1,7 +1,11 @@
-import { Button, Stack, Group } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import ArrowBackIcon from '@mui/icons-material/ArrowBack';
-import { CertificateSelector, CertificateType, UploadFormat } from '@app/components/tools/certSign/CertificateSelector';
+import { Button, Stack, Group } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import ArrowBackIcon from "@mui/icons-material/ArrowBack";
+import {
+  CertificateSelector,
+  CertificateType,
+  UploadFormat,
+} from "@app/components/tools/certSign/CertificateSelector";
 
 interface CertificateSelectionStepProps {
   certType: CertificateType;
@@ -23,7 +27,9 @@ interface CertificateSelectionStepProps {
   disabled?: boolean;
 }
 
-export const CertificateSelectionStep: React.FC<CertificateSelectionStepProps> = ({
+export const CertificateSelectionStep: React.FC<
+  CertificateSelectionStepProps
+> = ({
   certType,
   onCertTypeChange,
   uploadFormat,
@@ -46,9 +52,9 @@ export const CertificateSelectionStep: React.FC<CertificateSelectionStepProps> =
 
   // Validation: if UPLOAD type, need file and password
   const isValid =
-    certType === 'USER_CERT' ||
-    certType === 'SERVER' ||
-    (certType === 'UPLOAD' && p12File && password);
+    certType === "USER_CERT" ||
+    certType === "SERVER" ||
+    (certType === "UPLOAD" && p12File && password);
 
   return (
     <Stack gap="md">
@@ -71,11 +77,22 @@ export const CertificateSelectionStep: React.FC<CertificateSelectionStepProps> =
       />
 
       <Group gap="sm">
-        <Button variant="default" onClick={onBack} leftSection={<ArrowBackIcon sx={{ fontSize: 16 }} />}>
-          {t('certSign.collab.signRequest.steps.back', 'Back')}
+        <Button
+          variant="default"
+          onClick={onBack}
+          leftSection={<ArrowBackIcon sx={{ fontSize: 16 }} />}
+        >
+          {t("certSign.collab.signRequest.steps.back", "Back")}
         </Button>
-        <Button onClick={onNext} disabled={!isValid || disabled} style={{ flex: 1 }}>
-          {t('certSign.collab.signRequest.steps.continueToPlacement', 'Continue to Placement')}
+        <Button
+          onClick={onNext}
+          disabled={!isValid || disabled}
+          style={{ flex: 1 }}
+        >
+          {t(
+            "certSign.collab.signRequest.steps.continueToPlacement",
+            "Continue to Placement",
+          )}
         </Button>
       </Group>
     </Stack>
diff --git a/frontend/src/core/components/tools/certSign/steps/ReviewSignatureStep.tsx b/frontend/src/core/components/tools/certSign/steps/ReviewSignatureStep.tsx
index 1f4fe6437f..d46c780309 100644
--- a/frontend/src/core/components/tools/certSign/steps/ReviewSignatureStep.tsx
+++ b/frontend/src/core/components/tools/certSign/steps/ReviewSignatureStep.tsx
@@ -1,13 +1,16 @@
-import { Button, Stack, Text, Group, Divider, Paper } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import ArrowBackIcon from '@mui/icons-material/ArrowBack';
-import DrawIcon from '@mui/icons-material/Draw';
-import SecurityIcon from '@mui/icons-material/Security';
-import SettingsIcon from '@mui/icons-material/Settings';
-import CheckCircleIcon from '@mui/icons-material/CheckCircle';
-import CancelIcon from '@mui/icons-material/Cancel';
-import { CertificateType, UploadFormat } from '@app/components/tools/certSign/CertificateSelector';
-import type { SignRequestDetail } from '@app/types/signingSession';
+import { Button, Stack, Text, Group, Divider, Paper } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import ArrowBackIcon from "@mui/icons-material/ArrowBack";
+import DrawIcon from "@mui/icons-material/Draw";
+import SecurityIcon from "@mui/icons-material/Security";
+import SettingsIcon from "@mui/icons-material/Settings";
+import CheckCircleIcon from "@mui/icons-material/CheckCircle";
+import CancelIcon from "@mui/icons-material/Cancel";
+import {
+  CertificateType,
+  UploadFormat,
+} from "@app/components/tools/certSign/CertificateSelector";
+import type { SignRequestDetail } from "@app/types/signingSession";
 
 interface ReviewSignatureStepProps {
   signatureCount: number;
@@ -36,21 +39,30 @@ export const ReviewSignatureStep: React.FC<ReviewSignatureStepProps> = ({
 
   const getCertTypeName = () => {
     switch (certType) {
-      case 'USER_CERT':
-        return t('certSign.collab.signRequest.usePersonalCert', 'Personal Certificate');
-      case 'SERVER':
-        return t('certSign.collab.signRequest.useServerCert', 'Organization Certificate');
-      case 'UPLOAD':
-        return `${uploadFormat} — ${p12File?.name || t('certSign.collab.signRequest.uploadCert', 'Custom Certificate')}`;
+      case "USER_CERT":
+        return t(
+          "certSign.collab.signRequest.usePersonalCert",
+          "Personal Certificate",
+        );
+      case "SERVER":
+        return t(
+          "certSign.collab.signRequest.useServerCert",
+          "Organization Certificate",
+        );
+      case "UPLOAD":
+        return `${uploadFormat} — ${p12File?.name || t("certSign.collab.signRequest.uploadCert", "Custom Certificate")}`;
       default:
-        return '';
+        return "";
     }
   };
 
   return (
     <Stack gap="md">
       <Text size="sm" fw={600} c="dimmed">
-        {t('certSign.collab.signRequest.steps.reviewTitle', 'Review Before Signing')}
+        {t(
+          "certSign.collab.signRequest.steps.reviewTitle",
+          "Review Before Signing",
+        )}
       </Text>
 
       {/* Signatures Summary */}
@@ -58,18 +70,29 @@ export const ReviewSignatureStep: React.FC<ReviewSignatureStepProps> = ({
         <Group gap="xs" mb="xs">
           <DrawIcon sx={{ fontSize: 18 }} />
           <Text size="sm" fw={600}>
-            {t('certSign.collab.signRequest.steps.yourSignatures', 'Your Signatures ({{count}})', {
-              count: signatureCount,
-            })}
+            {t(
+              "certSign.collab.signRequest.steps.yourSignatures",
+              "Your Signatures ({{count}})",
+              {
+                count: signatureCount,
+              },
+            )}
           </Text>
         </Group>
         <Paper p="sm" withBorder>
           <Text size="sm">
             {signatureCount === 1
-              ? t('certSign.collab.signRequest.steps.oneSignature', '1 signature will be applied to the PDF')
-              : t('certSign.collab.signRequest.steps.multipleSignatures', '{{count}} signatures will be applied to the PDF', {
-                  count: signatureCount,
-                })}
+              ? t(
+                  "certSign.collab.signRequest.steps.oneSignature",
+                  "1 signature will be applied to the PDF",
+                )
+              : t(
+                  "certSign.collab.signRequest.steps.multipleSignatures",
+                  "{{count}} signatures will be applied to the PDF",
+                  {
+                    count: signatureCount,
+                  },
+                )}
           </Text>
         </Paper>
       </div>
@@ -81,7 +104,7 @@ export const ReviewSignatureStep: React.FC<ReviewSignatureStepProps> = ({
         <Group gap="xs" mb="xs">
           <SecurityIcon sx={{ fontSize: 18 }} />
           <Text size="sm" fw={600}>
-            {t('certSign.collab.signRequest.steps.certificate', 'Certificate')}
+            {t("certSign.collab.signRequest.steps.certificate", "Certificate")}
           </Text>
         </Group>
         <Text size="sm">{getCertTypeName()}</Text>
@@ -94,28 +117,44 @@ export const ReviewSignatureStep: React.FC<ReviewSignatureStepProps> = ({
         <Group gap="xs" mb="xs">
           <SettingsIcon sx={{ fontSize: 18 }} />
           <Text size="sm" fw={600}>
-            {t('certSign.collab.signRequest.signatureSettings', 'Signature Settings')}
+            {t(
+              "certSign.collab.signRequest.signatureSettings",
+              "Signature Settings",
+            )}
           </Text>
         </Group>
         <Paper p="sm" withBorder>
           <Text size="xs" c="dimmed" mb="xs">
-            {t('certSign.collab.signRequest.signatureInfo', 'These settings are configured by the document owner')}
+            {t(
+              "certSign.collab.signRequest.signatureInfo",
+              "These settings are configured by the document owner",
+            )}
           </Text>
           <Stack gap="xs">
             <Text size="sm">
-              <strong>{t('certSign.collab.signRequest.steps.visibility', 'Visibility:')}</strong>{' '}
+              <strong>
+                {t(
+                  "certSign.collab.signRequest.steps.visibility",
+                  "Visibility:",
+                )}
+              </strong>{" "}
               {signRequest.showSignature
-                ? t('certSign.collab.signRequest.steps.visible', 'Visible')
-                : t('certSign.collab.signRequest.steps.invisible', 'Invisible')}
+                ? t("certSign.collab.signRequest.steps.visible", "Visible")
+                : t("certSign.collab.signRequest.steps.invisible", "Invisible")}
             </Text>
             {signRequest.reason && (
               <Text size="sm">
-                <strong>{t('certSign.collab.signRequest.steps.reason', 'Reason:')}</strong> {signRequest.reason}
+                <strong>
+                  {t("certSign.collab.signRequest.steps.reason", "Reason:")}
+                </strong>{" "}
+                {signRequest.reason}
               </Text>
             )}
             {signRequest.location && (
               <Text size="sm">
-                <strong>{t('certSign.collab.signRequest.steps.location', 'Location:')}</strong>{' '}
+                <strong>
+                  {t("certSign.collab.signRequest.steps.location", "Location:")}
+                </strong>{" "}
                 {signRequest.location}
               </Text>
             )}
@@ -127,8 +166,12 @@ export const ReviewSignatureStep: React.FC<ReviewSignatureStepProps> = ({
 
       {/* Action Buttons */}
       <Group gap="sm" mt="md">
-        <Button variant="default" onClick={onBack} leftSection={<ArrowBackIcon sx={{ fontSize: 16 }} />}>
-          {t('certSign.collab.signRequest.steps.back', 'Back')}
+        <Button
+          variant="default"
+          onClick={onBack}
+          leftSection={<ArrowBackIcon sx={{ fontSize: 16 }} />}
+        >
+          {t("certSign.collab.signRequest.steps.back", "Back")}
         </Button>
         <Button
           variant="light"
@@ -137,7 +180,7 @@ export const ReviewSignatureStep: React.FC<ReviewSignatureStepProps> = ({
           disabled={disabled}
           leftSection={<CancelIcon sx={{ fontSize: 16 }} />}
         >
-          {t('certSign.collab.signRequest.declineButton', 'Decline')}
+          {t("certSign.collab.signRequest.declineButton", "Decline")}
         </Button>
         <Button
           onClick={onSign}
@@ -146,7 +189,7 @@ export const ReviewSignatureStep: React.FC<ReviewSignatureStepProps> = ({
           color="green"
           leftSection={<CheckCircleIcon sx={{ fontSize: 16 }} />}
         >
-          {t('certSign.collab.signRequest.signButton', 'Sign Document')}
+          {t("certSign.collab.signRequest.signButton", "Sign Document")}
         </Button>
       </Group>
     </Stack>
diff --git a/frontend/src/core/components/tools/certSign/steps/SignatureCreationStep.tsx b/frontend/src/core/components/tools/certSign/steps/SignatureCreationStep.tsx
index 1eb0f6b5dd..71a3502659 100644
--- a/frontend/src/core/components/tools/certSign/steps/SignatureCreationStep.tsx
+++ b/frontend/src/core/components/tools/certSign/steps/SignatureCreationStep.tsx
@@ -1,9 +1,12 @@
-import { Button, Stack } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { SignatureTypeSelector, SignatureType } from '@app/components/shared/wetSignature/SignatureTypeSelector';
-import { DrawSignatureCanvas } from '@app/components/shared/wetSignature/DrawSignatureCanvas';
-import { UploadSignatureImage } from '@app/components/shared/wetSignature/UploadSignatureImage';
-import { TypeSignatureText } from '@app/components/shared/wetSignature/TypeSignatureText';
+import { Button, Stack } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import {
+  SignatureTypeSelector,
+  SignatureType,
+} from "@app/components/shared/wetSignature/SignatureTypeSelector";
+import { DrawSignatureCanvas } from "@app/components/shared/wetSignature/DrawSignatureCanvas";
+import { UploadSignatureImage } from "@app/components/shared/wetSignature/UploadSignatureImage";
+import { TypeSignatureText } from "@app/components/shared/wetSignature/TypeSignatureText";
 
 interface SignatureCreationStepProps {
   signatureType: SignatureType;
@@ -42,9 +45,9 @@ export const SignatureCreationStep: React.FC<SignatureCreationStepProps> = ({
   const { t } = useTranslation();
 
   const hasSignature =
-    (signatureType === 'draw' && signature) ||
-    (signatureType === 'upload' && signature) ||
-    (signatureType === 'type' && signatureText && signature);
+    (signatureType === "draw" && signature) ||
+    (signatureType === "upload" && signature) ||
+    (signatureType === "type" && signatureText && signature);
 
   return (
     <Stack gap="md">
@@ -54,7 +57,7 @@ export const SignatureCreationStep: React.FC<SignatureCreationStepProps> = ({
         disabled={disabled}
       />
 
-      {signatureType === 'draw' && (
+      {signatureType === "draw" && (
         <DrawSignatureCanvas
           signature={signature}
           onChange={onSignatureChange}
@@ -62,7 +65,7 @@ export const SignatureCreationStep: React.FC<SignatureCreationStepProps> = ({
         />
       )}
 
-      {signatureType === 'upload' && (
+      {signatureType === "upload" && (
         <UploadSignatureImage
           signature={signature}
           onChange={onSignatureChange}
@@ -70,7 +73,7 @@ export const SignatureCreationStep: React.FC<SignatureCreationStepProps> = ({
         />
       )}
 
-      {signatureType === 'type' && (
+      {signatureType === "type" && (
         <TypeSignatureText
           text={signatureText}
           fontFamily={fontFamily}
@@ -86,7 +89,10 @@ export const SignatureCreationStep: React.FC<SignatureCreationStepProps> = ({
       )}
 
       <Button onClick={onNext} disabled={!hasSignature || disabled} fullWidth>
-        {t('certSign.collab.signRequest.steps.continue', 'Continue to Certificate Selection')}
+        {t(
+          "certSign.collab.signRequest.steps.continue",
+          "Continue to Certificate Selection",
+        )}
       </Button>
     </Stack>
   );
diff --git a/frontend/src/core/components/tools/certSign/steps/SignaturePlacementStep.tsx b/frontend/src/core/components/tools/certSign/steps/SignaturePlacementStep.tsx
index 529a1c58a5..c6010f27b3 100644
--- a/frontend/src/core/components/tools/certSign/steps/SignaturePlacementStep.tsx
+++ b/frontend/src/core/components/tools/certSign/steps/SignaturePlacementStep.tsx
@@ -1,6 +1,6 @@
-import { Button, Stack, Text, Group } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import ArrowBackIcon from '@mui/icons-material/ArrowBack';
+import { Button, Stack, Text, Group } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import ArrowBackIcon from "@mui/icons-material/ArrowBack";
 
 interface SignaturePlacementStepProps {
   isPlaced: boolean;
@@ -26,25 +26,36 @@ export const SignaturePlacementStep: React.FC<SignaturePlacementStepProps> = ({
       <Text size="xs" c="dimmed">
         {isPlaced
           ? t(
-              'certSign.collab.signRequest.steps.signaturePlaced',
-              'Signature placed on page {{page}}. You can adjust the position by clicking again or continue to review.',
-              { page: placementInfo?.page || 1 }
+              "certSign.collab.signRequest.steps.signaturePlaced",
+              "Signature placed on page {{page}}. You can adjust the position by clicking again or continue to review.",
+              { page: placementInfo?.page || 1 },
             )
           : t(
-              'certSign.collab.signRequest.steps.clickToPlace',
-              'Click on the PDF where you would like your signature to appear.'
+              "certSign.collab.signRequest.steps.clickToPlace",
+              "Click on the PDF where you would like your signature to appear.",
             )}
       </Text>
 
       {/* PDF Viewer (passed as children) */}
-      <div style={{ flex: 1, minHeight: '400px' }}>{children}</div>
+      <div style={{ flex: 1, minHeight: "400px" }}>{children}</div>
 
       <Group gap="sm">
-        <Button variant="default" onClick={onBack} leftSection={<ArrowBackIcon sx={{ fontSize: 16 }} />}>
-          {t('certSign.collab.signRequest.steps.back', 'Back')}
+        <Button
+          variant="default"
+          onClick={onBack}
+          leftSection={<ArrowBackIcon sx={{ fontSize: 16 }} />}
+        >
+          {t("certSign.collab.signRequest.steps.back", "Back")}
         </Button>
-        <Button onClick={onNext} disabled={!isPlaced || disabled} style={{ flex: 1 }}>
-          {t('certSign.collab.signRequest.steps.continueToReview', 'Continue to Review')}
+        <Button
+          onClick={onNext}
+          disabled={!isPlaced || disabled}
+          style={{ flex: 1 }}
+        >
+          {t(
+            "certSign.collab.signRequest.steps.continueToReview",
+            "Continue to Review",
+          )}
         </Button>
       </Group>
     </Stack>
diff --git a/frontend/src/core/components/tools/changeMetadata/ChangeMetadataSingleStep.tsx b/frontend/src/core/components/tools/changeMetadata/ChangeMetadataSingleStep.tsx
index c13bb4f724..2eff20b23b 100644
--- a/frontend/src/core/components/tools/changeMetadata/ChangeMetadataSingleStep.tsx
+++ b/frontend/src/core/components/tools/changeMetadata/ChangeMetadataSingleStep.tsx
@@ -1,6 +1,9 @@
 import { Stack, Divider, Text } from "@mantine/core";
 import { useTranslation } from "react-i18next";
-import { ChangeMetadataParameters, createCustomMetadataFunctions } from "@app/hooks/tools/changeMetadata/useChangeMetadataParameters";
+import {
+  ChangeMetadataParameters,
+  createCustomMetadataFunctions,
+} from "@app/hooks/tools/changeMetadata/useChangeMetadataParameters";
 import { useMetadataExtraction } from "@app/hooks/tools/changeMetadata/useMetadataExtraction";
 import DeleteAllStep from "@app/components/tools/changeMetadata/steps/DeleteAllStep";
 import StandardMetadataStep from "@app/components/tools/changeMetadata/steps/StandardMetadataStep";
@@ -9,22 +12,23 @@ import AdvancedOptionsStep from "@app/components/tools/changeMetadata/steps/Adva
 
 interface ChangeMetadataSingleStepProps {
   parameters: ChangeMetadataParameters;
-  onParameterChange: <K extends keyof ChangeMetadataParameters>(key: K, value: ChangeMetadataParameters[K]) => void;
+  onParameterChange: <K extends keyof ChangeMetadataParameters>(
+    key: K,
+    value: ChangeMetadataParameters[K],
+  ) => void;
   disabled?: boolean;
 }
 
 const ChangeMetadataSingleStep = ({
   parameters,
   onParameterChange,
-  disabled = false
+  disabled = false,
 }: ChangeMetadataSingleStepProps) => {
   const { t } = useTranslation();
 
   // Get custom metadata functions using the utility
-  const { addCustomMetadata, removeCustomMetadata, updateCustomMetadata } = createCustomMetadataFunctions(
-    parameters,
-    onParameterChange
-  );
+  const { addCustomMetadata, removeCustomMetadata, updateCustomMetadata } =
+    createCustomMetadataFunctions(parameters, onParameterChange);
 
   // Extract metadata from uploaded files
   const { isExtractingMetadata } = useMetadataExtraction({
@@ -39,7 +43,7 @@ const ChangeMetadataSingleStep = ({
       {/* Delete All */}
       <Stack gap="md">
         <Text size="sm" fw={500}>
-          {t('changeMetadata.deleteAll.label', 'Delete All Metadata')}
+          {t("changeMetadata.deleteAll.label", "Delete All Metadata")}
         </Text>
         <DeleteAllStep
           parameters={parameters}
@@ -53,7 +57,7 @@ const ChangeMetadataSingleStep = ({
       {/* Standard Metadata Fields */}
       <Stack gap="md">
         <Text size="sm" fw={500}>
-          {t('changeMetadata.standardFields.title', 'Standard Metadata')}
+          {t("changeMetadata.standardFields.title", "Standard Metadata")}
         </Text>
         <StandardMetadataStep
           parameters={parameters}
@@ -67,7 +71,7 @@ const ChangeMetadataSingleStep = ({
       {/* Document Dates */}
       <Stack gap="md">
         <Text size="sm" fw={500}>
-          {t('changeMetadata.dates.title', 'Document Dates')}
+          {t("changeMetadata.dates.title", "Document Dates")}
         </Text>
         <DocumentDatesStep
           parameters={parameters}
@@ -81,7 +85,7 @@ const ChangeMetadataSingleStep = ({
       {/* Advanced Options */}
       <Stack gap="md">
         <Text size="sm" fw={500}>
-          {t('changeMetadata.advanced.title', 'Advanced Options')}
+          {t("changeMetadata.advanced.title", "Advanced Options")}
         </Text>
         <AdvancedOptionsStep
           parameters={parameters}
diff --git a/frontend/src/core/components/tools/changeMetadata/steps/AdvancedOptionsStep.tsx b/frontend/src/core/components/tools/changeMetadata/steps/AdvancedOptionsStep.tsx
index 6907a1018d..ebd481354e 100644
--- a/frontend/src/core/components/tools/changeMetadata/steps/AdvancedOptionsStep.tsx
+++ b/frontend/src/core/components/tools/changeMetadata/steps/AdvancedOptionsStep.tsx
@@ -7,7 +7,10 @@ import { Z_INDEX_AUTOMATE_DROPDOWN } from "@app/styles/zIndex";
 
 interface AdvancedOptionsStepProps {
   parameters: ChangeMetadataParameters;
-  onParameterChange: <K extends keyof ChangeMetadataParameters>(key: K, value: ChangeMetadataParameters[K]) => void;
+  onParameterChange: <K extends keyof ChangeMetadataParameters>(
+    key: K,
+    value: ChangeMetadataParameters[K],
+  ) => void;
   disabled?: boolean;
   addCustomMetadata: (key?: string, value?: string) => void;
   removeCustomMetadata: (id: string) => void;
@@ -20,7 +23,7 @@ const AdvancedOptionsStep = ({
   disabled = false,
   addCustomMetadata,
   removeCustomMetadata,
-  updateCustomMetadata
+  updateCustomMetadata,
 }: AdvancedOptionsStepProps) => {
   const { t } = useTranslation();
 
@@ -28,20 +31,32 @@ const AdvancedOptionsStep = ({
     <Stack gap="md">
       {/* Trapped Status */}
       <Select
-        label={t('changeMetadata.trapped.label', 'Trapped Status')}
+        label={t("changeMetadata.trapped.label", "Trapped Status")}
         value={parameters.trapped}
         onChange={(value) => {
           if (value) {
-            onParameterChange('trapped', value as TrappedStatus);
+            onParameterChange("trapped", value as TrappedStatus);
           }
         }}
         disabled={disabled || parameters.deleteAll}
         data={[
-          { value: TrappedStatus.UNKNOWN, label: t('changeMetadata.trapped.unknown', 'Unknown') },
-          { value: TrappedStatus.TRUE, label: t('changeMetadata.trapped.true', 'True') },
-          { value: TrappedStatus.FALSE, label: t('changeMetadata.trapped.false', 'False') }
+          {
+            value: TrappedStatus.UNKNOWN,
+            label: t("changeMetadata.trapped.unknown", "Unknown"),
+          },
+          {
+            value: TrappedStatus.TRUE,
+            label: t("changeMetadata.trapped.true", "True"),
+          },
+          {
+            value: TrappedStatus.FALSE,
+            label: t("changeMetadata.trapped.false", "False"),
+          },
         ]}
-        comboboxProps={{ withinPortal: true, zIndex: Z_INDEX_AUTOMATE_DROPDOWN }}
+        comboboxProps={{
+          withinPortal: true,
+          zIndex: Z_INDEX_AUTOMATE_DROPDOWN,
+        }}
       />
 
       <Divider />
diff --git a/frontend/src/core/components/tools/changeMetadata/steps/CustomMetadataStep.tsx b/frontend/src/core/components/tools/changeMetadata/steps/CustomMetadataStep.tsx
index 3231144078..ea6e85833a 100644
--- a/frontend/src/core/components/tools/changeMetadata/steps/CustomMetadataStep.tsx
+++ b/frontend/src/core/components/tools/changeMetadata/steps/CustomMetadataStep.tsx
@@ -4,7 +4,10 @@ import { ChangeMetadataParameters } from "@app/hooks/tools/changeMetadata/useCha
 
 interface CustomMetadataStepProps {
   parameters: ChangeMetadataParameters;
-  onParameterChange: <K extends keyof ChangeMetadataParameters>(key: K, value: ChangeMetadataParameters[K]) => void;
+  onParameterChange: <K extends keyof ChangeMetadataParameters>(
+    key: K,
+    value: ChangeMetadataParameters[K],
+  ) => void;
   disabled?: boolean;
   addCustomMetadata: (key?: string, value?: string) => void;
   removeCustomMetadata: (id: string) => void;
@@ -16,7 +19,7 @@ const CustomMetadataStep = ({
   disabled = false,
   addCustomMetadata,
   removeCustomMetadata,
-  updateCustomMetadata
+  updateCustomMetadata,
 }: CustomMetadataStepProps) => {
   const { t } = useTranslation();
 
@@ -24,7 +27,7 @@ const CustomMetadataStep = ({
     <Stack gap="sm">
       <Group justify="space-between" align="center">
         <Text size="sm" fw={500}>
-          {t('changeMetadata.customFields.title', 'Custom Metadata')}
+          {t("changeMetadata.customFields.title", "Custom Metadata")}
         </Text>
         <Button
           size="xs"
@@ -32,28 +35,41 @@ const CustomMetadataStep = ({
           onClick={() => addCustomMetadata()}
           disabled={disabled}
         >
-          {t('changeMetadata.customFields.add', 'Add Field')}
+          {t("changeMetadata.customFields.add", "Add Field")}
         </Button>
       </Group>
 
       {parameters.customMetadata.length > 0 && (
         <Text size="xs" c="dimmed">
-          {t('changeMetadata.customFields.description', 'Add custom metadata fields to the document')}
+          {t(
+            "changeMetadata.customFields.description",
+            "Add custom metadata fields to the document",
+          )}
         </Text>
       )}
 
       {parameters.customMetadata.map((entry) => (
         <Stack key={entry.id} gap="xs">
           <TextInput
-            placeholder={t('changeMetadata.customFields.keyPlaceholder', 'Custom key')}
+            placeholder={t(
+              "changeMetadata.customFields.keyPlaceholder",
+              "Custom key",
+            )}
             value={entry.key}
-            onChange={(e) => updateCustomMetadata(entry.id, e.target.value, entry.value)}
+            onChange={(e) =>
+              updateCustomMetadata(entry.id, e.target.value, entry.value)
+            }
             disabled={disabled}
           />
           <TextInput
-            placeholder={t('changeMetadata.customFields.valuePlaceholder', 'Custom value')}
+            placeholder={t(
+              "changeMetadata.customFields.valuePlaceholder",
+              "Custom value",
+            )}
             value={entry.value}
-            onChange={(e) => updateCustomMetadata(entry.id, entry.key, e.target.value)}
+            onChange={(e) =>
+              updateCustomMetadata(entry.id, entry.key, e.target.value)
+            }
             disabled={disabled}
           />
           <Button
@@ -63,7 +79,7 @@ const CustomMetadataStep = ({
             onClick={() => removeCustomMetadata(entry.id)}
             disabled={disabled}
           >
-            {t('changeMetadata.customFields.remove', 'Remove')}
+            {t("changeMetadata.customFields.remove", "Remove")}
           </Button>
         </Stack>
       ))}
diff --git a/frontend/src/core/components/tools/changeMetadata/steps/DeleteAllStep.tsx b/frontend/src/core/components/tools/changeMetadata/steps/DeleteAllStep.tsx
index ec86ea57dc..29a187631c 100644
--- a/frontend/src/core/components/tools/changeMetadata/steps/DeleteAllStep.tsx
+++ b/frontend/src/core/components/tools/changeMetadata/steps/DeleteAllStep.tsx
@@ -4,22 +4,25 @@ import { ChangeMetadataParameters } from "@app/hooks/tools/changeMetadata/useCha
 
 interface DeleteAllStepProps {
   parameters: ChangeMetadataParameters;
-  onParameterChange: <K extends keyof ChangeMetadataParameters>(key: K, value: ChangeMetadataParameters[K]) => void;
+  onParameterChange: <K extends keyof ChangeMetadataParameters>(
+    key: K,
+    value: ChangeMetadataParameters[K],
+  ) => void;
   disabled?: boolean;
 }
 
 const DeleteAllStep = ({
   parameters,
   onParameterChange,
-  disabled = false
+  disabled = false,
 }: DeleteAllStepProps) => {
   const { t } = useTranslation();
 
   return (
     <Checkbox
-      label={t('changeMetadata.deleteAll.checkbox', 'Delete all metadata')}
+      label={t("changeMetadata.deleteAll.checkbox", "Delete all metadata")}
       checked={parameters.deleteAll}
-      onChange={(e) => onParameterChange('deleteAll', e.target.checked)}
+      onChange={(e) => onParameterChange("deleteAll", e.target.checked)}
       disabled={disabled}
     />
   );
diff --git a/frontend/src/core/components/tools/changeMetadata/steps/DocumentDatesStep.tsx b/frontend/src/core/components/tools/changeMetadata/steps/DocumentDatesStep.tsx
index abcf7330c9..17a304e86e 100644
--- a/frontend/src/core/components/tools/changeMetadata/steps/DocumentDatesStep.tsx
+++ b/frontend/src/core/components/tools/changeMetadata/steps/DocumentDatesStep.tsx
@@ -5,33 +5,46 @@ import { ChangeMetadataParameters } from "@app/hooks/tools/changeMetadata/useCha
 
 interface DocumentDatesStepProps {
   parameters: ChangeMetadataParameters;
-  onParameterChange: <K extends keyof ChangeMetadataParameters>(key: K, value: ChangeMetadataParameters[K]) => void;
+  onParameterChange: <K extends keyof ChangeMetadataParameters>(
+    key: K,
+    value: ChangeMetadataParameters[K],
+  ) => void;
   disabled?: boolean;
 }
 
 const DocumentDatesStep = ({
   parameters,
   onParameterChange,
-  disabled = false
+  disabled = false,
 }: DocumentDatesStepProps) => {
   const { t } = useTranslation();
 
   return (
     <Stack gap="md">
       <DateTimePicker
-        label={t('changeMetadata.creationDate.label', 'Creation Date')}
-        placeholder={t('changeMetadata.creationDate.placeholder', 'Creation date')}
+        label={t("changeMetadata.creationDate.label", "Creation Date")}
+        placeholder={t(
+          "changeMetadata.creationDate.placeholder",
+          "Creation date",
+        )}
         value={parameters.creationDate}
-        onChange={(date) => onParameterChange('creationDate', date ? new Date(date) : null)}
+        onChange={(date) =>
+          onParameterChange("creationDate", date ? new Date(date) : null)
+        }
         disabled={disabled}
         clearable
       />
 
       <DateTimePicker
-        label={t('changeMetadata.modificationDate.label', 'Modification Date')}
-        placeholder={t('changeMetadata.modificationDate.placeholder', 'Modification date')}
+        label={t("changeMetadata.modificationDate.label", "Modification Date")}
+        placeholder={t(
+          "changeMetadata.modificationDate.placeholder",
+          "Modification date",
+        )}
         value={parameters.modificationDate}
-        onChange={(date) => onParameterChange('modificationDate', date ? new Date(date) : null)}
+        onChange={(date) =>
+          onParameterChange("modificationDate", date ? new Date(date) : null)
+        }
         disabled={disabled}
         clearable
       />
diff --git a/frontend/src/core/components/tools/changeMetadata/steps/StandardMetadataStep.tsx b/frontend/src/core/components/tools/changeMetadata/steps/StandardMetadataStep.tsx
index 3086dd587e..9971bcf26d 100644
--- a/frontend/src/core/components/tools/changeMetadata/steps/StandardMetadataStep.tsx
+++ b/frontend/src/core/components/tools/changeMetadata/steps/StandardMetadataStep.tsx
@@ -4,64 +4,79 @@ import { ChangeMetadataParameters } from "@app/hooks/tools/changeMetadata/useCha
 
 interface StandardMetadataStepProps {
   parameters: ChangeMetadataParameters;
-  onParameterChange: <K extends keyof ChangeMetadataParameters>(key: K, value: ChangeMetadataParameters[K]) => void;
+  onParameterChange: <K extends keyof ChangeMetadataParameters>(
+    key: K,
+    value: ChangeMetadataParameters[K],
+  ) => void;
   disabled?: boolean;
 }
 
 const StandardMetadataStep = ({
   parameters,
   onParameterChange,
-  disabled = false
+  disabled = false,
 }: StandardMetadataStepProps) => {
   const { t } = useTranslation();
 
   return (
     <Stack gap="md">
       <TextInput
-        label={t('changeMetadata.title.label', 'Title')}
-        placeholder={t('changeMetadata.title.placeholder', 'Document title')}
+        label={t("changeMetadata.title.label", "Title")}
+        placeholder={t("changeMetadata.title.placeholder", "Document title")}
         value={parameters.title}
-        onChange={(e) => onParameterChange('title', e.target.value)}
+        onChange={(e) => onParameterChange("title", e.target.value)}
         disabled={disabled}
       />
 
       <TextInput
-        label={t('changeMetadata.author.label', 'Author')}
-        placeholder={t('changeMetadata.author.placeholder', 'Document author')}
+        label={t("changeMetadata.author.label", "Author")}
+        placeholder={t("changeMetadata.author.placeholder", "Document author")}
         value={parameters.author}
-        onChange={(e) => onParameterChange('author', e.target.value)}
+        onChange={(e) => onParameterChange("author", e.target.value)}
         disabled={disabled}
       />
 
       <TextInput
-        label={t('changeMetadata.subject.label', 'Subject')}
-        placeholder={t('changeMetadata.subject.placeholder', 'Document subject')}
+        label={t("changeMetadata.subject.label", "Subject")}
+        placeholder={t(
+          "changeMetadata.subject.placeholder",
+          "Document subject",
+        )}
         value={parameters.subject}
-        onChange={(e) => onParameterChange('subject', e.target.value)}
+        onChange={(e) => onParameterChange("subject", e.target.value)}
         disabled={disabled}
       />
 
       <TextInput
-        label={t('changeMetadata.keywords.label', 'Keywords')}
-        placeholder={t('changeMetadata.keywords.placeholder', 'Document keywords')}
+        label={t("changeMetadata.keywords.label", "Keywords")}
+        placeholder={t(
+          "changeMetadata.keywords.placeholder",
+          "Document keywords",
+        )}
         value={parameters.keywords}
-        onChange={(e) => onParameterChange('keywords', e.target.value)}
+        onChange={(e) => onParameterChange("keywords", e.target.value)}
         disabled={disabled}
       />
 
       <TextInput
-        label={t('changeMetadata.creator.label', 'Creator')}
-        placeholder={t('changeMetadata.creator.placeholder', 'Document creator')}
+        label={t("changeMetadata.creator.label", "Creator")}
+        placeholder={t(
+          "changeMetadata.creator.placeholder",
+          "Document creator",
+        )}
         value={parameters.creator}
-        onChange={(e) => onParameterChange('creator', e.target.value)}
+        onChange={(e) => onParameterChange("creator", e.target.value)}
         disabled={disabled}
       />
 
       <TextInput
-        label={t('changeMetadata.producer.label', 'Producer')}
-        placeholder={t('changeMetadata.producer.placeholder', 'Document producer')}
+        label={t("changeMetadata.producer.label", "Producer")}
+        placeholder={t(
+          "changeMetadata.producer.placeholder",
+          "Document producer",
+        )}
         value={parameters.producer}
-        onChange={(e) => onParameterChange('producer', e.target.value)}
+        onChange={(e) => onParameterChange("producer", e.target.value)}
         disabled={disabled}
       />
     </Stack>
diff --git a/frontend/src/core/components/tools/changePermissions/ChangePermissionsSettings.test.tsx b/frontend/src/core/components/tools/changePermissions/ChangePermissionsSettings.test.tsx
index c50d20580c..3c51db3c43 100644
--- a/frontend/src/core/components/tools/changePermissions/ChangePermissionsSettings.test.tsx
+++ b/frontend/src/core/components/tools/changePermissions/ChangePermissionsSettings.test.tsx
@@ -1,14 +1,14 @@
-import { describe, expect, test, vi, beforeEach } from 'vitest';
-import { render, screen, fireEvent } from '@testing-library/react';
-import { MantineProvider } from '@mantine/core';
-import ChangePermissionsSettings from '@app/components/tools/changePermissions/ChangePermissionsSettings';
-import { defaultParameters } from '@app/hooks/tools/changePermissions/useChangePermissionsParameters';
-import type { ChangePermissionsParameters } from '@app/hooks/tools/changePermissions/useChangePermissionsParameters';
+import { describe, expect, test, vi, beforeEach } from "vitest";
+import { render, screen, fireEvent } from "@testing-library/react";
+import { MantineProvider } from "@mantine/core";
+import ChangePermissionsSettings from "@app/components/tools/changePermissions/ChangePermissionsSettings";
+import { defaultParameters } from "@app/hooks/tools/changePermissions/useChangePermissionsParameters";
+import type { ChangePermissionsParameters } from "@app/hooks/tools/changePermissions/useChangePermissionsParameters";
 
 // Mock useTranslation with predictable return values
 const mockT = vi.fn((key: string) => `mock-${key}`);
-vi.mock('react-i18next', () => ({
-  useTranslation: () => ({ t: mockT })
+vi.mock("react-i18next", () => ({
+  useTranslation: () => ({ t: mockT }),
 }));
 
 // Wrapper component to provide Mantine context
@@ -16,74 +16,98 @@ const TestWrapper = ({ children }: { children: React.ReactNode }) => (
   <MantineProvider>{children}</MantineProvider>
 );
 
-describe('ChangePermissionsSettings', () => {
+describe("ChangePermissionsSettings", () => {
   const mockOnParameterChange = vi.fn();
 
   beforeEach(() => {
     vi.clearAllMocks();
   });
 
-  test('should render all permission checkboxes', () => {
+  test("should render all permission checkboxes", () => {
     render(
       <TestWrapper>
         <ChangePermissionsSettings
           parameters={defaultParameters}
           onParameterChange={mockOnParameterChange}
         />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
     // Should render checkboxes for all permission types
-    const permissionKeys = Object.keys(defaultParameters) as Array<keyof ChangePermissionsParameters>;
-    const checkboxes = screen.getAllByRole('checkbox');
+    const permissionKeys = Object.keys(defaultParameters) as Array<
+      keyof ChangePermissionsParameters
+    >;
+    const checkboxes = screen.getAllByRole("checkbox");
     expect(checkboxes).toHaveLength(permissionKeys.length);
 
     // Verify specific permission labels are rendered
-    expect(screen.getByText('mock-changePermissions.permissions.preventAssembly.label')).toBeInTheDocument();
-    expect(screen.getByText('mock-changePermissions.permissions.preventPrinting.label')).toBeInTheDocument();
-    expect(screen.getByText('mock-changePermissions.permissions.preventModify.label')).toBeInTheDocument();
-    expect(screen.getByText('mock-changePermissions.permissions.preventExtractContent.label')).toBeInTheDocument();
+    expect(
+      screen.getByText(
+        "mock-changePermissions.permissions.preventAssembly.label",
+      ),
+    ).toBeInTheDocument();
+    expect(
+      screen.getByText(
+        "mock-changePermissions.permissions.preventPrinting.label",
+      ),
+    ).toBeInTheDocument();
+    expect(
+      screen.getByText(
+        "mock-changePermissions.permissions.preventModify.label",
+      ),
+    ).toBeInTheDocument();
+    expect(
+      screen.getByText(
+        "mock-changePermissions.permissions.preventExtractContent.label",
+      ),
+    ).toBeInTheDocument();
   });
 
-  test('should render all permission types with correct labels', () => {
+  test("should render all permission types with correct labels", () => {
     render(
       <TestWrapper>
         <ChangePermissionsSettings
           parameters={defaultParameters}
           onParameterChange={mockOnParameterChange}
         />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
-    const permissionKeys = Object.keys(defaultParameters) as Array<keyof ChangePermissionsParameters>;
+    const permissionKeys = Object.keys(defaultParameters) as Array<
+      keyof ChangePermissionsParameters
+    >;
 
-    permissionKeys.forEach(permission => {
-      expect(screen.getByText(`mock-changePermissions.permissions.${permission}.label`)).toBeInTheDocument();
+    permissionKeys.forEach((permission) => {
+      expect(
+        screen.getByText(
+          `mock-changePermissions.permissions.${permission}.label`,
+        ),
+      ).toBeInTheDocument();
     });
   });
 
-  test('should show checkboxes as unchecked by default', () => {
+  test("should show checkboxes as unchecked by default", () => {
     render(
       <TestWrapper>
         <ChangePermissionsSettings
           parameters={defaultParameters}
           onParameterChange={mockOnParameterChange}
         />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
-    const checkboxes = screen.getAllByRole('checkbox') as HTMLInputElement[];
-    checkboxes.forEach(checkbox => {
+    const checkboxes = screen.getAllByRole("checkbox") as HTMLInputElement[];
+    checkboxes.forEach((checkbox) => {
       expect(checkbox.checked).toBe(false);
     });
   });
 
-  test('should show checkboxes as checked when parameters are true', () => {
+  test("should show checkboxes as checked when parameters are true", () => {
     const checkedParameters: ChangePermissionsParameters = {
       ...defaultParameters,
       preventAssembly: true,
       preventPrinting: true,
-      preventModify: true
+      preventModify: true,
     };
 
     render(
@@ -92,107 +116,145 @@ describe('ChangePermissionsSettings', () => {
           parameters={checkedParameters}
           onParameterChange={mockOnParameterChange}
         />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
     // Find specific checkboxes by their labels and verify they are checked
-    const assemblyCheckbox = screen.getByLabelText('mock-changePermissions.permissions.preventAssembly.label') as HTMLInputElement;
-    const printingCheckbox = screen.getByLabelText('mock-changePermissions.permissions.preventPrinting.label') as HTMLInputElement;
-    const modifyCheckbox = screen.getByLabelText('mock-changePermissions.permissions.preventModify.label') as HTMLInputElement;
-    const formCheckbox = screen.getByLabelText('mock-changePermissions.permissions.preventFillInForm.label') as HTMLInputElement;
+    const assemblyCheckbox = screen.getByLabelText(
+      "mock-changePermissions.permissions.preventAssembly.label",
+    ) as HTMLInputElement;
+    const printingCheckbox = screen.getByLabelText(
+      "mock-changePermissions.permissions.preventPrinting.label",
+    ) as HTMLInputElement;
+    const modifyCheckbox = screen.getByLabelText(
+      "mock-changePermissions.permissions.preventModify.label",
+    ) as HTMLInputElement;
+    const formCheckbox = screen.getByLabelText(
+      "mock-changePermissions.permissions.preventFillInForm.label",
+    ) as HTMLInputElement;
 
     expect(assemblyCheckbox.checked).toBe(true);
     expect(printingCheckbox.checked).toBe(true);
     expect(modifyCheckbox.checked).toBe(true);
-    expect(formCheckbox.checked).toBe(false);  // Ensure other checkboxes are unaffected
+    expect(formCheckbox.checked).toBe(false); // Ensure other checkboxes are unaffected
   });
 
   test.each([
-    { initialValue: false, expectedValue: true, description: 'checking an unchecked box' },
-    { initialValue: true, expectedValue: false, description: 'unchecking a checked box' }
-  ])('should call onParameterChange with $expectedValue when $description', ({ initialValue, expectedValue }) => {
-    const testParameters: ChangePermissionsParameters = {
-      ...defaultParameters,
-      preventAssembly: initialValue
-    };
+    {
+      initialValue: false,
+      expectedValue: true,
+      description: "checking an unchecked box",
+    },
+    {
+      initialValue: true,
+      expectedValue: false,
+      description: "unchecking a checked box",
+    },
+  ])(
+    "should call onParameterChange with $expectedValue when $description",
+    ({ initialValue, expectedValue }) => {
+      const testParameters: ChangePermissionsParameters = {
+        ...defaultParameters,
+        preventAssembly: initialValue,
+      };
 
-    render(
-      <TestWrapper>
-        <ChangePermissionsSettings
-          parameters={testParameters}
-          onParameterChange={mockOnParameterChange}
-        />
-      </TestWrapper>
-    );
+      render(
+        <TestWrapper>
+          <ChangePermissionsSettings
+            parameters={testParameters}
+            onParameterChange={mockOnParameterChange}
+          />
+        </TestWrapper>,
+      );
 
-    const assemblyCheckbox = screen.getByLabelText('mock-changePermissions.permissions.preventAssembly.label');
-    fireEvent.click(assemblyCheckbox);
+      const assemblyCheckbox = screen.getByLabelText(
+        "mock-changePermissions.permissions.preventAssembly.label",
+      );
+      fireEvent.click(assemblyCheckbox);
 
-    expect(mockOnParameterChange).toHaveBeenCalledWith('preventAssembly', expectedValue);
-  });
+      expect(mockOnParameterChange).toHaveBeenCalledWith(
+        "preventAssembly",
+        expectedValue,
+      );
+    },
+  );
 
-  test('should handle multiple checkbox interactions', () => {
+  test("should handle multiple checkbox interactions", () => {
     render(
       <TestWrapper>
         <ChangePermissionsSettings
           parameters={defaultParameters}
           onParameterChange={mockOnParameterChange}
         />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
     // Click multiple checkboxes
-    const assemblyCheckbox = screen.getByLabelText('mock-changePermissions.permissions.preventAssembly.label');
-    const printingCheckbox = screen.getByLabelText('mock-changePermissions.permissions.preventPrinting.label');
+    const assemblyCheckbox = screen.getByLabelText(
+      "mock-changePermissions.permissions.preventAssembly.label",
+    );
+    const printingCheckbox = screen.getByLabelText(
+      "mock-changePermissions.permissions.preventPrinting.label",
+    );
 
     fireEvent.click(assemblyCheckbox);
     fireEvent.click(printingCheckbox);
 
-    expect(mockOnParameterChange).toHaveBeenCalledWith('preventAssembly', true);
-    expect(mockOnParameterChange).toHaveBeenCalledWith('preventPrinting', true);
+    expect(mockOnParameterChange).toHaveBeenCalledWith("preventAssembly", true);
+    expect(mockOnParameterChange).toHaveBeenCalledWith("preventPrinting", true);
     expect(mockOnParameterChange).toHaveBeenCalledTimes(2);
   });
 
   test.each([
     { disabled: true, expectedState: true },
-    { disabled: false, expectedState: false }
-  ])('should set checkboxes disabled=$disabled when disabled prop is $disabled', ({ disabled, expectedState }) => {
-    render(
-      <TestWrapper>
-        <ChangePermissionsSettings
-          parameters={defaultParameters}
-          onParameterChange={mockOnParameterChange}
-          disabled={disabled}
-        />
-      </TestWrapper>
-    );
+    { disabled: false, expectedState: false },
+  ])(
+    "should set checkboxes disabled=$disabled when disabled prop is $disabled",
+    ({ disabled, expectedState }) => {
+      render(
+        <TestWrapper>
+          <ChangePermissionsSettings
+            parameters={defaultParameters}
+            onParameterChange={mockOnParameterChange}
+            disabled={disabled}
+          />
+        </TestWrapper>,
+      );
 
-    const checkboxes = screen.getAllByRole('checkbox') as HTMLInputElement[];
-    checkboxes.forEach(checkbox => {
-      expect(checkbox.disabled).toBe(expectedState);
-    });
-  });
+      const checkboxes = screen.getAllByRole("checkbox") as HTMLInputElement[];
+      checkboxes.forEach((checkbox) => {
+        expect(checkbox.disabled).toBe(expectedState);
+      });
+    },
+  );
 
-  test('should call translation function with correct keys', () => {
+  test("should call translation function with correct keys", () => {
     render(
       <TestWrapper>
         <ChangePermissionsSettings
           parameters={defaultParameters}
           onParameterChange={mockOnParameterChange}
         />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
-    const permissionKeys = Object.keys(defaultParameters) as Array<keyof ChangePermissionsParameters>;
-    permissionKeys.forEach(permission => {
-      expect(mockT).toHaveBeenCalledWith(`changePermissions.permissions.${permission}.label`, permission);
+    const permissionKeys = Object.keys(defaultParameters) as Array<
+      keyof ChangePermissionsParameters
+    >;
+    permissionKeys.forEach((permission) => {
+      expect(mockT).toHaveBeenCalledWith(
+        `changePermissions.permissions.${permission}.label`,
+        permission,
+      );
     });
   });
 
-  test.each(Object.keys(defaultParameters) as Array<keyof ChangePermissionsParameters>)('should handle %s permission type individually', (permission) => {
+  test.each(
+    Object.keys(defaultParameters) as Array<keyof ChangePermissionsParameters>,
+  )("should handle %s permission type individually", (permission) => {
     const testParameters: ChangePermissionsParameters = {
       ...defaultParameters,
-      [permission]: true
+      [permission]: true,
     };
 
     render(
@@ -201,10 +263,12 @@ describe('ChangePermissionsSettings', () => {
           parameters={testParameters}
           onParameterChange={mockOnParameterChange}
         />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
-    const checkbox = screen.getByLabelText(`mock-changePermissions.permissions.${permission}.label`) as HTMLInputElement;
+    const checkbox = screen.getByLabelText(
+      `mock-changePermissions.permissions.${permission}.label`,
+    ) as HTMLInputElement;
     expect(checkbox.checked).toBe(true);
   });
 });
diff --git a/frontend/src/core/components/tools/changePermissions/ChangePermissionsSettings.tsx b/frontend/src/core/components/tools/changePermissions/ChangePermissionsSettings.tsx
index db6c4e731c..b3cd00fb42 100644
--- a/frontend/src/core/components/tools/changePermissions/ChangePermissionsSettings.tsx
+++ b/frontend/src/core/components/tools/changePermissions/ChangePermissionsSettings.tsx
@@ -4,17 +4,26 @@ import { ChangePermissionsParameters } from "@app/hooks/tools/changePermissions/
 
 interface ChangePermissionsSettingsProps {
   parameters: ChangePermissionsParameters;
-  onParameterChange: <K extends keyof ChangePermissionsParameters>(key: K, value: ChangePermissionsParameters[K]) => void;
+  onParameterChange: <K extends keyof ChangePermissionsParameters>(
+    key: K,
+    value: ChangePermissionsParameters[K],
+  ) => void;
   disabled?: boolean;
 }
 
-const ChangePermissionsSettings = ({ parameters, onParameterChange, disabled = false }: ChangePermissionsSettingsProps) => {
+const ChangePermissionsSettings = ({
+  parameters,
+  onParameterChange,
+  disabled = false,
+}: ChangePermissionsSettingsProps) => {
   const { t } = useTranslation();
 
   return (
     <Stack gap="sm">
       <Stack gap="xs">
-        {(Object.keys(parameters) as Array<keyof ChangePermissionsParameters>).map((key) => (
+        {(
+          Object.keys(parameters) as Array<keyof ChangePermissionsParameters>
+        ).map((key) => (
           <Checkbox
             key={key}
             label={t(`changePermissions.permissions.${key}.label`, key)}
diff --git a/frontend/src/core/components/tools/compare/CompareDocumentPane.tsx b/frontend/src/core/components/tools/compare/CompareDocumentPane.tsx
index c541c60f20..cbb33539a1 100644
--- a/frontend/src/core/components/tools/compare/CompareDocumentPane.tsx
+++ b/frontend/src/core/components/tools/compare/CompareDocumentPane.tsx
@@ -1,10 +1,18 @@
-import { Group, Loader, Stack, Text } from '@mantine/core';
-import { useMemo, useRef, useEffect, useState } from 'react';
-import type { PagePreview } from '@app/types/compare';
-import type { TokenBoundingBox, CompareDocumentPaneProps } from '@app/types/compare';
-import { mergeConnectedRects, normalizeRotation, groupWordRects, computePageLayoutMetrics } from '@app/components/tools/compare/compare';
-import CompareNavigationDropdown from '@app/components/tools/compare/CompareNavigationDropdown';
-import { useIsMobile } from '@app/hooks/useIsMobile';
+import { Group, Loader, Stack, Text } from "@mantine/core";
+import { useMemo, useRef, useEffect, useState } from "react";
+import type { PagePreview } from "@app/types/compare";
+import type {
+  TokenBoundingBox,
+  CompareDocumentPaneProps,
+} from "@app/types/compare";
+import {
+  mergeConnectedRects,
+  normalizeRotation,
+  groupWordRects,
+  computePageLayoutMetrics,
+} from "@app/components/tools/compare/compare";
+import CompareNavigationDropdown from "@app/components/tools/compare/CompareNavigationDropdown";
+import { useIsMobile } from "@app/hooks/useIsMobile";
 
 // utilities moved to compare.ts
 
@@ -45,11 +53,28 @@ const CompareDocumentPane = ({
     return map;
   }, [pairedPages]);
 
-  const HIGHLIGHT_BG_VAR = pane === 'base' ? 'var(--spdf-compare-removed-bg)' : 'var(--spdf-compare-added-bg)';
-  const OFFSET_PIXELS = pane === 'base' ? 4 : 2;
-  const cursorStyle = isPanMode && zoom > 1 ? 'grab' : 'auto';
+  const HIGHLIGHT_BG_VAR =
+    pane === "base"
+      ? "var(--spdf-compare-removed-bg)"
+      : "var(--spdf-compare-added-bg)";
+  const OFFSET_PIXELS = pane === "base" ? 4 : 2;
+  const cursorStyle = isPanMode && zoom > 1 ? "grab" : "auto";
   const pagePanRef = useRef<Map<number, { x: number; y: number }>>(new Map());
-  const dragRef = useRef<{ active: boolean; page: number | null; startX: number; startY: number; startPanX: number; startPanY: number }>({ active: false, page: null, startX: 0, startY: 0, startPanX: 0, startPanY: 0 });
+  const dragRef = useRef<{
+    active: boolean;
+    page: number | null;
+    startX: number;
+    startY: number;
+    startPanX: number;
+    startPanY: number;
+  }>({
+    active: false,
+    page: null,
+    startX: 0,
+    startY: 0,
+    startPanX: 0,
+    startPanY: 0,
+  });
 
   // Track which page images have finished loading to avoid flashing between states
   const imageLoadedRef = useRef<Map<number, boolean>>(new Map());
@@ -76,7 +101,7 @@ const CompareDocumentPane = ({
 
   const renderedPageNumbers = useMemo(
     () => new Set(pages.map((p) => p.pageNumber)),
-    [pages]
+    [pages],
   );
 
   return (
@@ -86,12 +111,16 @@ const CompareDocumentPane = ({
           <Text fw={600} size="lg">
             {title}
           </Text>
-          <Group justify="flex-end" align="center" gap="sm" wrap="nowrap"> 
+          <Group justify="flex-end" align="center" gap="sm" wrap="nowrap">
             {(changes.length > 0 || Boolean(dropdownPlaceholder)) && (
               <CompareNavigationDropdown
                 changes={changes}
                 placeholder={dropdownPlaceholder ?? null}
-                className={pane === 'comparison' ? 'compare-changes-select--comparison' : undefined}
+                className={
+                  pane === "comparison"
+                    ? "compare-changes-select--comparison"
+                    : undefined
+                }
                 onNavigate={onNavigateChange}
                 renderedPageNumbers={renderedPageNumbers}
               />
@@ -115,7 +144,9 @@ const CompareDocumentPane = ({
             let bestDist = Number.POSITIVE_INFINITY;
             let nodes = pageNodesRef.current;
             if (!nodes || nodes.length !== pages.length) {
-              nodes = Array.from(container.querySelectorAll('.compare-diff-page')) as HTMLElement[];
+              nodes = Array.from(
+                container.querySelectorAll(".compare-diff-page"),
+              ) as HTMLElement[];
               pageNodesRef.current = nodes;
             }
             for (const el of nodes) {
@@ -125,12 +156,15 @@ const CompareDocumentPane = ({
               const dist = Math.abs(center - mid);
               if (dist < bestDist) {
                 bestDist = dist;
-                const attr = el.getAttribute('data-page-number');
+                const attr = el.getAttribute("data-page-number");
                 const pn = attr ? parseInt(attr, 10) : NaN;
                 if (!Number.isNaN(pn)) bestPage = pn;
               }
             }
-            if (typeof onVisiblePageChange === 'function' && bestPage !== lastReportedVisiblePageRef.current) {
+            if (
+              typeof onVisiblePageChange === "function" &&
+              bestPage !== lastReportedVisiblePageRef.current
+            ) {
               lastReportedVisiblePageRef.current = bestPage;
               onVisiblePageChange(pane, bestPage);
             }
@@ -141,14 +175,20 @@ const CompareDocumentPane = ({
         onMouseMove={undefined}
         onMouseUp={undefined}
         onMouseLeave={undefined}
-        onWheel={(event) => { handleWheelZoom(pane, event); handleWheelOverscroll(pane, event); }}
+        onWheel={(event) => {
+          handleWheelZoom(pane, event);
+          handleWheelOverscroll(pane, event);
+        }}
         onTouchStart={(event) => onTouchStart(pane, event)}
         onTouchMove={onTouchMove}
         onTouchEnd={onTouchEnd}
         className="compare-pane__scroll"
         style={{ cursor: cursorStyle }}
       >
-        <Stack gap={zoom <= 0.6 ? 2 : zoom <= 0.85 ? 'xs' : 'sm'} className="compare-pane__content">
+        <Stack
+          gap={zoom <= 0.6 ? 2 : zoom <= 0.85 ? "xs" : "sm"}
+          className="compare-pane__content"
+        >
           {isLoading && (
             <Group justify="center" gap="xs" py="md">
               <Loader size="sm" />
@@ -158,7 +198,8 @@ const CompareDocumentPane = ({
 
           {pages.map((page) => {
             const peerPage = pairedPageMap.get(page.pageNumber);
-            const viewportWidth = typeof window !== 'undefined' ? window.innerWidth : 1200;
+            const viewportWidth =
+              typeof window !== "undefined" ? window.innerWidth : 1200;
             const metrics = computePageLayoutMetrics({
               page,
               peerPage: peerPage ?? null,
@@ -170,18 +211,39 @@ const CompareDocumentPane = ({
               offsetPixels: OFFSET_PIXELS,
             });
 
-            const { highlightOffset, containerWidth, containerHeight, innerScale } = metrics;
+            const {
+              highlightOffset,
+              containerWidth,
+              containerHeight,
+              innerScale,
+            } = metrics;
 
             // Compute clamped pan for current zoom so content always touches edges when in bounds
-            const storedPan = pagePanRef.current.get(page.pageNumber) || { x: 0, y: 0 };
-            const contentWidth = Math.max(0, Math.round(containerWidth * innerScale));
-            const contentHeight = Math.max(0, Math.round(containerHeight * innerScale));
-            const maxPanX = Math.max(0, contentWidth - Math.round(containerWidth));
-            const maxPanY = Math.max(0, contentHeight - Math.round(containerHeight));
+            const storedPan = pagePanRef.current.get(page.pageNumber) || {
+              x: 0,
+              y: 0,
+            };
+            const contentWidth = Math.max(
+              0,
+              Math.round(containerWidth * innerScale),
+            );
+            const contentHeight = Math.max(
+              0,
+              Math.round(containerHeight * innerScale),
+            );
+            const maxPanX = Math.max(
+              0,
+              contentWidth - Math.round(containerWidth),
+            );
+            const maxPanY = Math.max(
+              0,
+              contentHeight - Math.round(containerHeight),
+            );
             const clampedPanX = Math.max(0, Math.min(maxPanX, storedPan.x));
             const clampedPanY = Math.max(0, Math.min(maxPanY, storedPan.y));
 
-            const groupedRects = groupedRectsByPage.get(page.pageNumber) ?? new Map();
+            const groupedRects =
+              groupedRectsByPage.get(page.pageNumber) ?? new Map();
 
             return (
               <>
@@ -192,7 +254,11 @@ const CompareDocumentPane = ({
                 >
                   <div
                     className="compare-page-title"
-                    style={{ width: `${containerWidth}px`, marginLeft: 'auto', marginRight: 'auto' }}
+                    style={{
+                      width: `${containerWidth}px`,
+                      marginLeft: "auto",
+                      marginRight: "auto",
+                    }}
                   >
                     <Text size="xs" fw={600} c="dimmed" ta="center">
                       {documentLabel} · {pageLabel} {page.pageNumber}
@@ -200,58 +266,89 @@ const CompareDocumentPane = ({
                   </div>
                   <div
                     className="compare-diff-page__canvas compare-diff-page__canvas--zoom"
-                    style={{ width: `${containerWidth}px`, height: `${containerHeight}px`, marginLeft: 'auto', marginRight: 'auto', overflow: 'hidden' }}
+                    style={{
+                      width: `${containerWidth}px`,
+                      height: `${containerHeight}px`,
+                      marginLeft: "auto",
+                      marginRight: "auto",
+                      overflow: "hidden",
+                    }}
                     onMouseDown={(e) => {
                       if (!isPanMode || zoom <= 1) return;
                       dragRef.current.active = true;
                       dragRef.current.page = page.pageNumber;
                       dragRef.current.startX = e.clientX;
                       dragRef.current.startY = e.clientY;
-                      const curr = pagePanRef.current.get(page.pageNumber) || { x: 0, y: 0 };
+                      const curr = pagePanRef.current.get(page.pageNumber) || {
+                        x: 0,
+                        y: 0,
+                      };
                       dragRef.current.startPanX = curr.x;
                       dragRef.current.startPanY = curr.y;
-                      (e.currentTarget as HTMLElement).style.cursor = 'grabbing';
+                      (e.currentTarget as HTMLElement).style.cursor =
+                        "grabbing";
                       e.preventDefault();
                     }}
                     onMouseMove={(e) => {
-                      if (!dragRef.current.active || dragRef.current.page !== page.pageNumber) return;
+                      if (
+                        !dragRef.current.active ||
+                        dragRef.current.page !== page.pageNumber
+                      )
+                        return;
                       const dx = e.clientX - dragRef.current.startX;
                       const dy = e.clientY - dragRef.current.startY;
                       // Clamp panning based on the actual rendered content size.
                       // The inner layer is width/height of the container, then scaled by innerScale.
-                      const contentWidth = Math.max(0, Math.round(containerWidth * innerScale));
-                      const contentHeight = Math.max(0, Math.round(containerHeight * innerScale));
-                      const maxX = Math.max(0, contentWidth - Math.round(containerWidth));
-                      const maxY = Math.max(0, contentHeight - Math.round(containerHeight));
+                      const contentWidth = Math.max(
+                        0,
+                        Math.round(containerWidth * innerScale),
+                      );
+                      const contentHeight = Math.max(
+                        0,
+                        Math.round(containerHeight * innerScale),
+                      );
+                      const maxX = Math.max(
+                        0,
+                        contentWidth - Math.round(containerWidth),
+                      );
+                      const maxY = Math.max(
+                        0,
+                        contentHeight - Math.round(containerHeight),
+                      );
                       const candX = dragRef.current.startPanX - dx;
                       const candY = dragRef.current.startPanY - dy;
-                      const next = { x: Math.max(0, Math.min(maxX, candX)), y: Math.max(0, Math.min(maxY, candY)) };
+                      const next = {
+                        x: Math.max(0, Math.min(maxX, candX)),
+                        y: Math.max(0, Math.min(maxY, candY)),
+                      };
                       pagePanRef.current.set(page.pageNumber, next);
                       e.preventDefault();
                     }}
                     onMouseUp={(e) => {
                       if (dragRef.current.active) {
                         dragRef.current.active = false;
-                        (e.currentTarget as HTMLElement).style.cursor = cursorStyle;
+                        (e.currentTarget as HTMLElement).style.cursor =
+                          cursorStyle;
                       }
                     }}
                     onMouseLeave={(e) => {
                       if (dragRef.current.active) {
                         dragRef.current.active = false;
-                        (e.currentTarget as HTMLElement).style.cursor = cursorStyle;
+                        (e.currentTarget as HTMLElement).style.cursor =
+                          cursorStyle;
                       }
                     }}
                   >
                     <div
                       className={`compare-diff-page__inner compare-diff-page__inner--${pane}`}
                       style={{
-                        transform: `scale(${innerScale}) translate3d(${-((clampedPanX) / innerScale)}px, ${-((clampedPanY) / innerScale)}px, 0)`,
-                        transformOrigin: 'top left'
+                        transform: `scale(${innerScale}) translate3d(${-(clampedPanX / innerScale)}px, ${-(clampedPanY / innerScale)}px, 0)`,
+                        transformOrigin: "top left",
                       }}
                     >
                       {/* Image layer */}
                       <img
-                        src={page.url ?? ''}
+                        src={page.url ?? ""}
                         alt={altLabel}
                         loading="lazy"
                         decoding="async"
@@ -264,7 +361,9 @@ const CompareDocumentPane = ({
                         }}
                       />
                       {/* Overlay loader until the page image is loaded */}
-                      {!((imageLoadedRef.current.get(page.pageNumber) ?? false)) && (
+                      {!(
+                        imageLoadedRef.current.get(page.pageNumber) ?? false
+                      ) && (
                         <div className="compare-page-loader-overlay">
                           <Loader size="sm" />
                         </div>
@@ -272,7 +371,10 @@ const CompareDocumentPane = ({
                       {[...groupedRects.entries()].flatMap(([id, rects]) =>
                         mergeConnectedRects(rects).map((rect, index) => {
                           const rotation = normalizeRotation(page.rotation);
-                          const verticalOffset = rotation === 180 ? -highlightOffset : highlightOffset;
+                          const verticalOffset =
+                            rotation === 180
+                              ? -highlightOffset
+                              : highlightOffset;
                           return (
                             <span
                               key={`${pane}-highlight-${page.pageNumber}-${id}-${index}`}
@@ -287,12 +389,12 @@ const CompareDocumentPane = ({
                               }}
                             />
                           );
-                        })
+                        }),
                       )}
                     </div>
                   </div>
                 </div>
-                </>
+              </>
             );
           })}
         </Stack>
diff --git a/frontend/src/core/components/tools/compare/CompareNavigationDropdown.tsx b/frontend/src/core/components/tools/compare/CompareNavigationDropdown.tsx
index ab7a746897..d9de877f29 100644
--- a/frontend/src/core/components/tools/compare/CompareNavigationDropdown.tsx
+++ b/frontend/src/core/components/tools/compare/CompareNavigationDropdown.tsx
@@ -1,7 +1,7 @@
-import { Combobox, ScrollArea, useCombobox } from '@mantine/core';
-import { useEffect, useMemo, useRef, useState } from 'react';
-import { useTranslation } from 'react-i18next';
-import type { NavigationDropdownProps } from '@app/types/compare';
+import { Combobox, ScrollArea, useCombobox } from "@mantine/core";
+import { useEffect, useMemo, useRef, useState } from "react";
+import { useTranslation } from "react-i18next";
+import type { NavigationDropdownProps } from "@app/types/compare";
 
 const CompareNavigationDropdown = ({
   changes,
@@ -11,7 +11,7 @@ const CompareNavigationDropdown = ({
   renderedPageNumbers,
 }: NavigationDropdownProps) => {
   const { t } = useTranslation();
-  const newLineLabel = t('compare.newLine', 'new-line');
+  const newLineLabel = t("compare.newLine", "new-line");
   const combobox = useCombobox({
     onDropdownClose: () => {
       combobox.resetSelectedOption();
@@ -26,10 +26,13 @@ const CompareNavigationDropdown = ({
       requestAnimationFrame(() => {
         const viewport = viewportRef.current;
         if (viewport) viewport.scrollTop = scrollTopRef.current;
-        const headers = Array.from((viewportRef.current?.querySelectorAll('.compare-dropdown-group') ?? [])) as HTMLElement[];
+        const headers = Array.from(
+          viewportRef.current?.querySelectorAll(".compare-dropdown-group") ??
+            [],
+        ) as HTMLElement[];
         groupOffsetsRef.current = headers.map((el) => {
-          const text = el.textContent || '';
-          const page = parseInt(text.replace(/[^0-9]/g, ''), 10) || 0;
+          const text = el.textContent || "";
+          const page = parseInt(text.replace(/[^0-9]/g, ""), 10) || 0;
           return { top: el.offsetTop, page };
         });
         // Update sticky label based on current scroll position
@@ -41,42 +44,46 @@ const CompareNavigationDropdown = ({
   const sanitize = (s: string) => {
     // Normalize and remove control/separator characters without regex ranges
     return s
-      .normalize('NFKC')
-      .split('')
-      .map(char => {
+      .normalize("NFKC")
+      .split("")
+      .map((char) => {
         const code = char.charCodeAt(0);
         // Replace control chars (0-31, 127) and special separators with space
-        if (code <= 31 || code === 127 || code === 0x2028 || code === 0x2029 || (code >= 0x200B && code <= 0x200F)) {
-          return ' ';
+        if (
+          code <= 31 ||
+          code === 127 ||
+          code === 0x2028 ||
+          code === 0x2029 ||
+          (code >= 0x200b && code <= 0x200f)
+        ) {
+          return " ";
         }
         return char;
       })
-      .join('')
-      .replace(/\s+/g, ' ')
+      .join("")
+      .replace(/\s+/g, " ")
       .trim();
   };
 
   const isMeaningful = (s: string) => {
     const t = sanitize(s);
-  
+
     // Build a unicode-aware regex if supported; otherwise fall back to a plain ASCII class.
-    const rx =
-      (() => {
-        try {
-          // Construct at runtime so old engines don’t fail parse-time
-          return new RegExp('[\\p{L}\\p{N}\\p{P}\\p{S}]', 'u');
-        } catch {
-          // Fallback (no Unicode props): letters, digits, and common punctuation/symbols
-          return /[A-Za-z0-9.,!?;:(){}"'`~@#$%^&*+=|<>/[\]]/;
-        }
-      })();
-  
+    const rx = (() => {
+      try {
+        // Construct at runtime so old engines don’t fail parse-time
+        return new RegExp("[\\p{L}\\p{N}\\p{P}\\p{S}]", "u");
+      } catch {
+        // Fallback (no Unicode props): letters, digits, and common punctuation/symbols
+        return /[A-Za-z0-9.,!?;:(){}"'`~@#$%^&*+=|<>/[\]]/;
+      }
+    })();
+
     if (!rx.test(t)) return false;
     return t.length > 0;
   };
 
-  
-  const [query, setQuery] = useState('');
+  const [query, setQuery] = useState("");
   const viewportRef = useRef<HTMLDivElement | null>(null);
   const [stickyPage, setStickyPage] = useState<number | null>(null);
   const groupOffsetsRef = useRef<Array<{ top: number; page: number }>>([]);
@@ -85,16 +92,25 @@ const CompareNavigationDropdown = ({
 
   const normalizedChanges = useMemo(() => {
     // Helper to strip localized new-line marker occurrences from labels
-    const esc = (s: string) => s.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
+    const esc = (s: string) => s.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
     const stripNewLine = (s: string) =>
       s
-        .replace(new RegExp(`\\b${esc(newLineLabel)}\\b`, 'gi'), ' ')
-        .replace(/\s+/g, ' ')
+        .replace(new RegExp(`\\b${esc(newLineLabel)}\\b`, "gi"), " ")
+        .replace(/\s+/g, " ")
         .trim();
 
     const cleaned = changes
-      .map((c) => ({ value: c.value, label: stripNewLine(sanitize(c.label)), pageNumber: c.pageNumber }))
-      .filter((c) => isMeaningful(c.label) && c.label.length > 0 && c.label.toLowerCase() !== newLineLabel.toLowerCase());
+      .map((c) => ({
+        value: c.value,
+        label: stripNewLine(sanitize(c.label)),
+        pageNumber: c.pageNumber,
+      }))
+      .filter(
+        (c) =>
+          isMeaningful(c.label) &&
+          c.label.length > 0 &&
+          c.label.toLowerCase() !== newLineLabel.toLowerCase(),
+      );
     const q = sanitize(query).toLowerCase();
     if (!q) return cleaned;
     return cleaned.filter((c) => c.label.toLowerCase().includes(q));
@@ -105,10 +121,12 @@ const CompareNavigationDropdown = ({
     if (!isOpen) return;
     const viewport = viewportRef.current;
     if (!viewport) return;
-    const headers = Array.from(viewport.querySelectorAll('.compare-dropdown-group')) as HTMLElement[];
+    const headers = Array.from(
+      viewport.querySelectorAll(".compare-dropdown-group"),
+    ) as HTMLElement[];
     groupOffsetsRef.current = headers.map((el) => {
-      const text = el.textContent || '';
-      const page = parseInt(text.replace(/[^0-9]/g, ''), 10) || 0;
+      const text = el.textContent || "";
+      const page = parseInt(text.replace(/[^0-9]/g, ""), 10) || 0;
       return { top: el.offsetTop, page };
     });
     // Update sticky based on current scroll position
@@ -124,7 +142,8 @@ const CompareNavigationDropdown = ({
     let idx = 0;
     while (low <= high) {
       const mid = (low + high) >> 1;
-      if (offsets[mid].top <= y + 1) { // +1 to avoid jitter at exact boundary
+      if (offsets[mid].top <= y + 1) {
+        // +1 to avoid jitter at exact boundary
         idx = mid;
         low = mid + 1;
       } else {
@@ -148,10 +167,14 @@ const CompareNavigationDropdown = ({
     >
       <Combobox.Target>
         <div
-          className={['compare-changes-select', className].filter(Boolean).join(' ')}
+          className={["compare-changes-select", className]
+            .filter(Boolean)
+            .join(" ")}
           onClick={() => combobox.toggleDropdown()}
         >
-          <span className="compare-changes-select__placeholder">{placeholder}</span>
+          <span className="compare-changes-select__placeholder">
+            {placeholder}
+          </span>
           <Combobox.Chevron />
         </div>
       </Combobox.Target>
@@ -160,7 +183,10 @@ const CompareNavigationDropdown = ({
         {/* Header sits outside scroll so it stays fixed at top */}
         <div>
           <Combobox.Search
-            placeholder={t('compare.dropdown.searchPlaceholder', 'Search changes...')}
+            placeholder={t(
+              "compare.dropdown.searchPlaceholder",
+              "Search changes...",
+            )}
             value={query}
             onChange={(e) => setQuery(e.currentTarget.value)}
           />
@@ -168,55 +194,82 @@ const CompareNavigationDropdown = ({
         {/* Lazy render the scrollable content only when open */}
         {isOpen && (
           <div className="compare-dropdown-scrollwrap">
-            <ScrollArea.Autosize mah={300} viewportRef={viewportRef} onScrollPositionChange={handleScrollPos}>
+            <ScrollArea.Autosize
+              mah={300}
+              viewportRef={viewportRef}
+              onScrollPositionChange={handleScrollPos}
+            >
               {stickyPage != null && (
                 <div className="compare-dropdown-sticky" style={{ top: 0 }}>
-                  {t('compare.summary.pageLabel', 'Page')}{' '}{stickyPage}
-                  {renderedPageNumbers && !renderedPageNumbers.has(stickyPage) && (
-                    <span className="compare-dropdown-rendering-flag"> — {t('compare.rendering.rendering', 'rendering')}</span>
-                  )}
+                  {t("compare.summary.pageLabel", "Page")} {stickyPage}
+                  {renderedPageNumbers &&
+                    !renderedPageNumbers.has(stickyPage) && (
+                      <span className="compare-dropdown-rendering-flag">
+                        {" "}
+                        — {t("compare.rendering.rendering", "rendering")}
+                      </span>
+                    )}
                 </div>
               )}
               <Combobox.Options className="compare-dropdown-options">
-              {normalizedChanges.length > 0 ? (
-                (() => {
-                  const nodes: React.ReactNode[] = [];
-                  let lastPage: number | null = null;
-                  for (const item of normalizedChanges) {
-                    if (item.pageNumber && item.pageNumber !== lastPage) {
-                      lastPage = item.pageNumber;
+                {normalizedChanges.length > 0 ? (
+                  (() => {
+                    const nodes: React.ReactNode[] = [];
+                    let lastPage: number | null = null;
+                    for (const item of normalizedChanges) {
+                      if (item.pageNumber && item.pageNumber !== lastPage) {
+                        lastPage = item.pageNumber;
+                        nodes.push(
+                          <div
+                            className={[
+                              "compare-dropdown-group",
+                              stickyPage === lastPage
+                                ? "compare-dropdown-group--hidden"
+                                : "",
+                            ]
+                              .filter(Boolean)
+                              .join(" ")}
+                            key={`group-${lastPage}`}
+                          >
+                            {t("compare.summary.pageLabel", "Page")} {lastPage}
+                            {renderedPageNumbers &&
+                              !renderedPageNumbers.has(lastPage) && (
+                                <span className="compare-dropdown-rendering-flag">
+                                  {" "}
+                                  —{" "}
+                                  {t(
+                                    "compare.rendering.rendering",
+                                    "rendering",
+                                  )}
+                                </span>
+                              )}
+                          </div>,
+                        );
+                      }
                       nodes.push(
-                        <div
-                          className={["compare-dropdown-group", stickyPage === lastPage ? "compare-dropdown-group--hidden" : ""].filter(Boolean).join(" ")}
-                          key={`group-${lastPage}`}
+                        <Combobox.Option
+                          value={item.value}
+                          key={item.value}
+                          onClick={() => {
+                            onNavigate(item.value, item.pageNumber);
+                            combobox.closeDropdown();
+                          }}
                         >
-                          {t('compare.summary.pageLabel', 'Page')}{' '}{lastPage}
-                          {renderedPageNumbers && !renderedPageNumbers.has(lastPage) && (
-                            <span className="compare-dropdown-rendering-flag"> — {t('compare.rendering.rendering', 'rendering')}</span>
-                          )}
-                        </div>
+                          <div className="compare-dropdown-option">
+                            <span className="compare-dropdown-option__text">
+                              {item.label}
+                            </span>
+                          </div>
+                        </Combobox.Option>,
                       );
                     }
-                    nodes.push(
-                      <Combobox.Option
-                        value={item.value}
-                        key={item.value}
-                        onClick={() => {
-                          onNavigate(item.value, item.pageNumber);
-                          combobox.closeDropdown();
-                        }}
-                      >
-                        <div className="compare-dropdown-option">
-                          <span className="compare-dropdown-option__text">{item.label}</span>
-                        </div>
-                      </Combobox.Option>
-                    );
-                  }
-                  return nodes;
-                })()
-              ) : (
-                <Combobox.Empty>{t('compare.dropdown.noResults', 'No changes found')}</Combobox.Empty>
-              )}
+                    return nodes;
+                  })()
+                ) : (
+                  <Combobox.Empty>
+                    {t("compare.dropdown.noResults", "No changes found")}
+                  </Combobox.Empty>
+                )}
               </Combobox.Options>
             </ScrollArea.Autosize>
           </div>
diff --git a/frontend/src/core/components/tools/compare/ComparePixelWorkbenchView.tsx b/frontend/src/core/components/tools/compare/ComparePixelWorkbenchView.tsx
new file mode 100644
index 0000000000..d0b16336a7
--- /dev/null
+++ b/frontend/src/core/components/tools/compare/ComparePixelWorkbenchView.tsx
@@ -0,0 +1,211 @@
+import { useMemo, useState } from "react";
+import { Badge, Group, SegmentedControl, Stack, Text } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import type { TFunction } from "i18next";
+
+import type {
+  CompareResultPixelData,
+  ComparePixelPageResult,
+} from "@app/types/compare";
+import "@app/components/tools/compare/compareView.css";
+
+interface ComparePixelWorkbenchViewProps {
+  result: CompareResultPixelData;
+}
+
+type PixelViewMode = "side-by-side" | "diff-only" | "overlay";
+
+const formatPercent = (ratio: number): string => {
+  if (!Number.isFinite(ratio) || ratio <= 0) return "0%";
+  if (ratio < 0.0001) return "<0.01%";
+  return `${(ratio * 100).toFixed(2)}%`;
+};
+
+const PixelPageCard = ({
+  page,
+  viewMode,
+  t,
+}: {
+  page: ComparePixelPageResult;
+  viewMode: PixelViewMode;
+  t: TFunction;
+}) => {
+  const aspectRatio = `${page.width} / ${page.height}`;
+
+  return (
+    <Stack gap="xs" className="compare-pixel-page">
+      <Group justify="space-between" align="center">
+        <Text size="sm" fw={600}>
+          {t("compare.pixel.pageLabel", "Page")} {page.pageNumber}
+        </Text>
+        <Group gap="xs">
+          {page.missingBase && (
+            <Badge size="xs" color="red" variant="light">
+              {t("compare.pixel.missingInBase", "Missing in original")}
+            </Badge>
+          )}
+          {page.missingComparison && (
+            <Badge size="xs" color="red" variant="light">
+              {t("compare.pixel.missingInComparison", "Missing in edited")}
+            </Badge>
+          )}
+          {page.sizeMismatch && (
+            <Badge size="xs" color="yellow" variant="light">
+              {t("compare.pixel.sizeMismatch", "Size mismatch")}
+            </Badge>
+          )}
+          <Badge
+            size="xs"
+            color={page.diffPixels > 0 ? "red" : "green"}
+            variant="light"
+          >
+            {formatPercent(page.diffRatio)}{" "}
+            {t("compare.pixel.changed", "changed")}
+          </Badge>
+        </Group>
+      </Group>
+
+      {viewMode === "side-by-side" && (
+        <div className="compare-pixel-triptych">
+          <figure>
+            <img
+              src={page.baseImageUrl}
+              alt={t("compare.pixel.base", "Original")}
+              loading="lazy"
+              decoding="async"
+              style={{ aspectRatio, width: "100%" }}
+            />
+            <figcaption>{t("compare.pixel.base", "Original")}</figcaption>
+          </figure>
+          <figure>
+            <img
+              src={page.diffImageUrl}
+              alt={t("compare.pixel.diff", "Differences")}
+              loading="lazy"
+              decoding="async"
+              style={{ aspectRatio, width: "100%" }}
+            />
+            <figcaption>{t("compare.pixel.diff", "Differences")}</figcaption>
+          </figure>
+          <figure>
+            <img
+              src={page.comparisonImageUrl}
+              alt={t("compare.pixel.comparison", "Edited")}
+              loading="lazy"
+              decoding="async"
+              style={{ aspectRatio, width: "100%" }}
+            />
+            <figcaption>{t("compare.pixel.comparison", "Edited")}</figcaption>
+          </figure>
+        </div>
+      )}
+
+      {viewMode === "diff-only" && (
+        <figure>
+          <img
+            src={page.diffImageUrl}
+            alt={t("compare.pixel.diff", "Differences")}
+            loading="lazy"
+            decoding="async"
+            style={{ aspectRatio, width: "100%" }}
+          />
+        </figure>
+      )}
+
+      {viewMode === "overlay" && (
+        <div className="compare-pixel-overlay" style={{ aspectRatio }}>
+          <img
+            src={page.baseImageUrl}
+            alt={t("compare.pixel.base", "Original")}
+            loading="lazy"
+            decoding="async"
+            className="compare-pixel-overlay-img"
+          />
+          <img
+            src={page.diffImageUrl}
+            alt={t("compare.pixel.diff", "Differences")}
+            loading="lazy"
+            decoding="async"
+            className="compare-pixel-overlay-img compare-pixel-overlay-top"
+          />
+        </div>
+      )}
+    </Stack>
+  );
+};
+
+const ComparePixelWorkbenchView = ({
+  result,
+}: ComparePixelWorkbenchViewProps) => {
+  const { t } = useTranslation();
+  const [viewMode, setViewMode] = useState<PixelViewMode>("side-by-side");
+
+  const totalPercent = useMemo(
+    () => formatPercent(result.totals.diffRatio),
+    [result.totals.diffRatio],
+  );
+
+  return (
+    <Stack className="compare-workbench compare-pixel-workbench" gap="md">
+      <Group justify="space-between" align="center" wrap="wrap">
+        <Group gap="md">
+          <Text fw={600}>
+            {t("compare.pixel.summaryTitle", "Pixel comparison")}
+          </Text>
+          <Badge
+            color={result.totals.diffPixels > 0 ? "red" : "green"}
+            variant="light"
+          >
+            {totalPercent} {t("compare.pixel.overall", "overall")}
+          </Badge>
+          <Badge color="blue" variant="light">
+            {result.totals.pagesWithChanges}/{result.pages.length}{" "}
+            {t("compare.pixel.pagesChanged", "pages changed")}
+          </Badge>
+          <Badge color="gray" variant="light">
+            {result.settings.dpi} DPI
+          </Badge>
+        </Group>
+        <SegmentedControl
+          size="xs"
+          value={viewMode}
+          onChange={(value) => setViewMode(value as PixelViewMode)}
+          data={[
+            {
+              value: "side-by-side",
+              label: t("compare.pixel.sideBySide", "Side-by-side"),
+            },
+            {
+              value: "diff-only",
+              label: t("compare.pixel.diffOnly", "Diff only"),
+            },
+            { value: "overlay", label: t("compare.pixel.overlay", "Overlay") },
+          ]}
+        />
+      </Group>
+
+      {result.warnings.length > 0 && (
+        <Stack gap={4}>
+          {result.warnings.map((w, i) => (
+            <Text key={i} size="xs" c="yellow.7">
+              {w}
+            </Text>
+          ))}
+        </Stack>
+      )}
+
+      <Stack gap="lg" className="compare-pixel-list">
+        {result.pages.map((page) => (
+          <PixelPageCard
+            key={page.pageNumber}
+            page={page}
+            viewMode={viewMode}
+            t={t}
+          />
+        ))}
+      </Stack>
+    </Stack>
+  );
+};
+
+export default ComparePixelWorkbenchView;
diff --git a/frontend/src/core/components/tools/compare/CompareWorkbenchView.tsx b/frontend/src/core/components/tools/compare/CompareWorkbenchView.tsx
index b7006ae3d2..5d2842cd67 100644
--- a/frontend/src/core/components/tools/compare/CompareWorkbenchView.tsx
+++ b/frontend/src/core/components/tools/compare/CompareWorkbenchView.tsx
@@ -1,7 +1,7 @@
-import { useEffect, useMemo, useRef, useState, useCallback } from 'react';
-import { Loader, Stack } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { useIsMobile } from '@app/hooks/useIsMobile';
+import { useEffect, useMemo, useRef, useState, useCallback } from "react";
+import { Loader, Stack } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import { useIsMobile } from "@app/hooks/useIsMobile";
 import {
   mapChangesForDropdown,
   getFileFromSelection,
@@ -10,22 +10,25 @@ import {
   computeProgressPct,
   computeCountsText,
   computeMaxSharedPages,
-} from '@app/components/tools/compare/compare';
+} from "@app/components/tools/compare/compare";
+import { CompareResultData, CompareWorkbenchData } from "@app/types/compare";
+import ComparePixelWorkbenchView from "@app/components/tools/compare/ComparePixelWorkbenchView";
+import { useFileContext } from "@app/contexts/file/fileHooks";
+import { useRightRailButtons } from "@app/hooks/useRightRailButtons";
+import CompareDocumentPane from "@app/components/tools/compare/CompareDocumentPane";
+import { useComparePagePreviews } from "@app/components/tools/compare/hooks/useComparePagePreviews";
+import { useComparePanZoom } from "@app/components/tools/compare/hooks/useComparePanZoom";
+import { useCompareHighlights } from "@app/components/tools/compare/hooks/useCompareHighlights";
+import { useCompareChangeNavigation } from "@app/components/tools/compare/hooks/useCompareChangeNavigation";
+import "@app/components/tools/compare/compareView.css";
+import { useCompareRightRailButtons } from "@app/components/tools/compare/hooks/useCompareRightRailButtons";
 import {
-  CompareResultData,
-  CompareWorkbenchData,
-} from '@app/types/compare';
-import { useFileContext } from '@app/contexts/file/fileHooks';
-import { useRightRailButtons } from '@app/hooks/useRightRailButtons';
-import CompareDocumentPane from '@app/components/tools/compare/CompareDocumentPane';
-import { useComparePagePreviews } from '@app/components/tools/compare/hooks/useComparePagePreviews';
-import { useComparePanZoom } from '@app/components/tools/compare/hooks/useComparePanZoom';
-import { useCompareHighlights } from '@app/components/tools/compare/hooks/useCompareHighlights';
-import { useCompareChangeNavigation } from '@app/components/tools/compare/hooks/useCompareChangeNavigation';
-import '@app/components/tools/compare/compareView.css';
-import { useCompareRightRailButtons } from '@app/components/tools/compare/hooks/useCompareRightRailButtons';
-import { alert, updateToast, updateToastProgress, dismissToast } from '@app/components/toast';
-import type { ToastLocation } from '@app/components/toast/types';
+  alert,
+  updateToast,
+  updateToastProgress,
+  dismissToast,
+} from "@app/components/toast";
+import type { ToastLocation } from "@app/components/toast/types";
 
 interface CompareWorkbenchViewProps {
   data: CompareWorkbenchData | null;
@@ -34,29 +37,61 @@ interface CompareWorkbenchViewProps {
 // helpers moved to compare.ts
 
 const CompareWorkbenchView = ({ data }: CompareWorkbenchViewProps) => {
+  const rawResult = data?.result ?? null;
+  if (rawResult && rawResult.mode === "pixel") {
+    return <ComparePixelWorkbenchView result={rawResult} />;
+  }
+  return <CompareTextWorkbenchView data={data} />;
+};
+
+interface CompareTextWorkbenchViewProps {
+  data: CompareWorkbenchData | null;
+}
+
+const CompareTextWorkbenchView = ({ data }: CompareTextWorkbenchViewProps) => {
   const { t } = useTranslation();
   const prefersStacked = useIsMobile();
   const { selectors } = useFileContext();
 
-  const result: CompareResultData | null = data?.result ?? null;
+  const rawResult = data?.result ?? null;
+  const result: CompareResultData | null =
+    rawResult && rawResult.mode === "text" ? rawResult : null;
   const baseFileId = data?.baseFileId ?? null;
   const comparisonFileId = data?.comparisonFileId ?? null;
   const isOperationLoading = data?.isLoading ?? false;
 
-  const baseFile = getFileFromSelection(data?.baseLocalFile, baseFileId, selectors);
-  const comparisonFile = getFileFromSelection(data?.comparisonLocalFile, comparisonFileId, selectors);
+  const baseFile = getFileFromSelection(
+    data?.baseLocalFile,
+    baseFileId,
+    selectors,
+  );
+  const comparisonFile = getFileFromSelection(
+    data?.comparisonLocalFile,
+    comparisonFileId,
+    selectors,
+  );
   const baseStub = getStubFromSelection(baseFileId, selectors);
   const comparisonStub = getStubFromSelection(comparisonFileId, selectors);
 
   const processedAt = result?.totals.processedAt ?? null;
 
-  const { pages: basePages, loading: baseLoading, totalPages: baseTotal, renderedPages: baseRendered } = useComparePagePreviews({
+  const {
+    pages: basePages,
+    loading: baseLoading,
+    totalPages: baseTotal,
+    renderedPages: baseRendered,
+  } = useComparePagePreviews({
     file: baseFile,
     enabled: Boolean(result && baseFile),
     cacheKey: processedAt,
   });
 
-  const { pages: comparisonPages, loading: comparisonLoading, totalPages: compTotal, renderedPages: compRendered } = useComparePagePreviews({
+  const {
+    pages: comparisonPages,
+    loading: comparisonLoading,
+    totalPages: compTotal,
+    renderedPages: compRendered,
+  } = useComparePagePreviews({
     file: comparisonFile,
     enabled: Boolean(result && comparisonFile),
     cacheKey: processedAt,
@@ -76,7 +111,7 @@ const CompareWorkbenchView = ({ data }: CompareWorkbenchViewProps) => {
     isPanMode,
     setIsPanMode,
     baseZoom,
-    setBaseZoom,  
+    setBaseZoom,
     comparisonZoom,
     setComparisonZoom,
     setPanToTopLeft,
@@ -101,44 +136,78 @@ const CompareWorkbenchView = ({ data }: CompareWorkbenchViewProps) => {
     getRowHeightPx,
   } = useCompareHighlights(result, basePages, comparisonPages);
 
-  const temporarilySuppressScrollLink = useCallback((fn: () => void, durationMs = 700) => {
-    const wasLinked = isScrollLinked;
-    if (wasLinked) setIsScrollLinked(false);
-    try {
-      fn();
-    } finally {
-      window.setTimeout(() => {
-        if (wasLinked) {
-          // recapture anchors to keep panes aligned when relinking
-          captureScrollLinkDelta();
-          setIsScrollLinked(true);
-        }
-      }, Math.max(200, durationMs));
-    }
-  }, [isScrollLinked, setIsScrollLinked, captureScrollLinkDelta]);
+  const temporarilySuppressScrollLink = useCallback(
+    (fn: () => void, durationMs = 700) => {
+      const wasLinked = isScrollLinked;
+      if (wasLinked) setIsScrollLinked(false);
+      try {
+        fn();
+      } finally {
+        window.setTimeout(
+          () => {
+            if (wasLinked) {
+              // recapture anchors to keep panes aligned when relinking
+              captureScrollLinkDelta();
+              setIsScrollLinked(true);
+            }
+          },
+          Math.max(200, durationMs),
+        );
+      }
+    },
+    [isScrollLinked, setIsScrollLinked, captureScrollLinkDelta],
+  );
 
   const handleChangeNavigation = useCompareChangeNavigation(
     baseScrollRef,
     comparisonScrollRef,
-    { temporarilySuppressScrollLink }
+    {
+      temporarilySuppressScrollLink,
+    },
   );
 
-  const processingMessage = t('compare.status.processing', 'Analyzing differences...');
-  const baseDocumentLabel = t('compare.summary.baseHeading', 'Original document');
-  const comparisonDocumentLabel = t('compare.summary.comparisonHeading', 'Edited document');
-  const pageLabel = t('compare.summary.pageLabel', 'Page');
+  const processingMessage = t(
+    "compare.status.processing",
+    "Analyzing differences...",
+  );
+  const baseDocumentLabel = t(
+    "compare.summary.baseHeading",
+    "Original document",
+  );
+  const comparisonDocumentLabel = t(
+    "compare.summary.comparisonHeading",
+    "Edited document",
+  );
+  const pageLabel = t("compare.summary.pageLabel", "Page");
 
   // Always show the selected file names from the sidebar; they are known before diff results
-  const baseTitle = baseStub?.name || result?.base?.fileName || '';
-  const comparisonTitle = comparisonStub?.name || result?.comparison?.fileName || '';
+  const baseTitle = baseStub?.name || result?.base?.fileName || "";
+  const comparisonTitle =
+    comparisonStub?.name || result?.comparison?.fileName || "";
 
   // During diff processing, show compact spinners in the dropdown badges
-  const baseDropdownPlaceholder = (isOperationLoading || !result)
-    ? (<span className="inline-flex flex-row items-center gap-1">{t('compare.dropdown.deletionsLabel', 'Deletions')} <Loader size="xs" color="currentColor" /></span>)
-    : t('compare.dropdown.deletions', 'Deletions ({{count}})', { count: baseWordChanges.length });
-  const comparisonDropdownPlaceholder = (isOperationLoading || !result)
-    ? (<span className="inline-flex flex-row items-center gap-1">{t('compare.dropdown.additionsLabel', 'Additions')} <Loader size="xs" color="currentColor" /></span>)
-    : t('compare.dropdown.additions', 'Additions ({{count}})', { count: comparisonWordChanges.length });
+  const baseDropdownPlaceholder =
+    isOperationLoading || !result ? (
+      <span className="inline-flex flex-row items-center gap-1">
+        {t("compare.dropdown.deletionsLabel", "Deletions")}{" "}
+        <Loader size="xs" color="currentColor" />
+      </span>
+    ) : (
+      t("compare.dropdown.deletions", "Deletions ({{count}})", {
+        count: baseWordChanges.length,
+      })
+    );
+  const comparisonDropdownPlaceholder =
+    isOperationLoading || !result ? (
+      <span className="inline-flex flex-row items-center gap-1">
+        {t("compare.dropdown.additionsLabel", "Additions")}{" "}
+        <Loader size="xs" color="currentColor" />
+      </span>
+    ) : (
+      t("compare.dropdown.additions", "Additions ({{count}})", {
+        count: comparisonWordChanges.length,
+      })
+    );
 
   const rightRailButtons = useCompareRightRailButtons({
     layout,
@@ -166,11 +235,26 @@ const CompareWorkbenchView = ({ data }: CompareWorkbenchViewProps) => {
   // Rendering progress toast for very large PDFs
   const LARGE_PAGE_THRESHOLD = 400; // show banner when one or both exceed threshold
   const totalsKnown = (baseTotal ?? 0) > 0 && (compTotal ?? 0) > 0;
-  const showProgressBanner = useMemo(() => (
-    computeShowProgressBanner(totalsKnown, baseTotal, compTotal, baseLoading, comparisonLoading, LARGE_PAGE_THRESHOLD)
-  ), [totalsKnown, baseTotal, compTotal, baseLoading, comparisonLoading]);
+  const showProgressBanner = useMemo(
+    () =>
+      computeShowProgressBanner(
+        totalsKnown,
+        baseTotal,
+        compTotal,
+        baseLoading,
+        comparisonLoading,
+        LARGE_PAGE_THRESHOLD,
+      ),
+    [totalsKnown, baseTotal, compTotal, baseLoading, comparisonLoading],
+  );
 
-  const progressPct = computeProgressPct(totalsKnown, baseTotal, compTotal, baseRendered, compRendered);
+  const progressPct = computeProgressPct(
+    totalsKnown,
+    baseTotal,
+    compTotal,
+    baseRendered,
+    compRendered,
+  );
 
   const progressToastIdRef = useRef<string | null>(null);
   const completionTimerRef = useRef<number | null>(null);
@@ -189,10 +273,21 @@ const CompareWorkbenchView = ({ data }: CompareWorkbenchViewProps) => {
   }, []);
 
   const allDone = useMemo(() => {
-    const baseDone = (baseTotal || basePages.length) > 0 && baseRendered >= (baseTotal || basePages.length);
-    const compDone = (compTotal || comparisonPages.length) > 0 && compRendered >= (compTotal || comparisonPages.length);
+    const baseDone =
+      (baseTotal || basePages.length) > 0 &&
+      baseRendered >= (baseTotal || basePages.length);
+    const compDone =
+      (compTotal || comparisonPages.length) > 0 &&
+      compRendered >= (compTotal || comparisonPages.length);
     return baseDone && compDone;
-  }, [baseRendered, compRendered, baseTotal, compTotal, basePages.length, comparisonPages.length]);
+  }, [
+    baseRendered,
+    compRendered,
+    baseTotal,
+    compTotal,
+    basePages.length,
+    comparisonPages.length,
+  ]);
 
   // Drive toast lifecycle and progress updates
   useEffect(() => {
@@ -217,10 +312,13 @@ const CompareWorkbenchView = ({ data }: CompareWorkbenchViewProps) => {
       // Create toast if missing
       if (!progressToastIdRef.current) {
         const id = alert({
-          alertType: 'neutral',
-          title: t('compare.rendering.inProgress', "At least one of these PDFs are very large, scrolling won't be smooth until the rendering is complete"),
-          body: `${countsText} ${t('compare.rendering.pagesRendered', 'pages rendered')}`,
-          location: 'bottom-right' as ToastLocation,
+          alertType: "neutral",
+          title: t(
+            "compare.rendering.inProgress",
+            "At least one of these PDFs are very large, scrolling won't be smooth until the rendering is complete",
+          ),
+          body: `${countsText} ${t("compare.rendering.pagesRendered", "pages rendered")}`,
+          location: "bottom-right" as ToastLocation,
           isPersistentPopup: true,
           durationMs: 0,
           expandable: false,
@@ -229,11 +327,14 @@ const CompareWorkbenchView = ({ data }: CompareWorkbenchViewProps) => {
         progressToastIdRef.current = id;
       } else {
         updateToast(progressToastIdRef.current, {
-          title: t('compare.rendering.inProgress', "At least one of these PDFs are very large, scrolling won't be smooth until the rendering is complete"),
-          body: `${countsText} ${t('compare.rendering.pagesRendered', 'pages rendered')}`,
-          location: 'bottom-right' as ToastLocation,
+          title: t(
+            "compare.rendering.inProgress",
+            "At least one of these PDFs are very large, scrolling won't be smooth until the rendering is complete",
+          ),
+          body: `${countsText} ${t("compare.rendering.pagesRendered", "pages rendered")}`,
+          location: "bottom-right" as ToastLocation,
           isPersistentPopup: true,
-          alertType: 'neutral', // ensure it stays neutral until completion
+          alertType: "neutral", // ensure it stays neutral until completion
         });
         updateToastProgress(progressToastIdRef.current, progressPct);
       }
@@ -241,13 +342,14 @@ const CompareWorkbenchView = ({ data }: CompareWorkbenchViewProps) => {
       // Completed: update then auto-dismiss after 3s
       if (progressToastIdRef.current) {
         updateToast(progressToastIdRef.current, {
-          title: t('compare.rendering.complete', 'Page rendering complete'),
+          title: t("compare.rendering.complete", "Page rendering complete"),
           body: undefined,
           isPersistentPopup: false,
           durationMs: 3000,
         });
         updateToastProgress(progressToastIdRef.current, 100);
-        if (completionTimerRef.current != null) window.clearTimeout(completionTimerRef.current);
+        if (completionTimerRef.current != null)
+          window.clearTimeout(completionTimerRef.current);
         completionTimerRef.current = window.setTimeout(() => {
           if (progressToastIdRef.current) {
             dismissToast(progressToastIdRef.current);
@@ -267,14 +369,32 @@ const CompareWorkbenchView = ({ data }: CompareWorkbenchViewProps) => {
         completionTimerRef.current = null;
       }
     };
-  }, [showProgressBanner, allDone, progressPct, baseRendered, compRendered, baseTotal, compTotal, basePages.length, comparisonPages.length, t]);
+  }, [
+    showProgressBanner,
+    allDone,
+    progressPct,
+    baseRendered,
+    compRendered,
+    baseTotal,
+    compTotal,
+    basePages.length,
+    comparisonPages.length,
+    t,
+  ]);
 
   // Shared page navigation state/input
-  const maxSharedPages = useMemo(() => (
-    computeMaxSharedPages(baseTotal, compTotal, basePages.length, comparisonPages.length)
-  ), [baseTotal, compTotal, basePages.length, comparisonPages.length]);
+  const maxSharedPages = useMemo(
+    () =>
+      computeMaxSharedPages(
+        baseTotal,
+        compTotal,
+        basePages.length,
+        comparisonPages.length,
+      ),
+    [baseTotal, compTotal, basePages.length, comparisonPages.length],
+  );
 
-  const [pageInputValue, setPageInputValue] = useState<string>('1');
+  const [pageInputValue, setPageInputValue] = useState<string>("1");
   const typingTimerRef = useRef<number | null>(null);
   const isTypingRef = useRef(false);
 
@@ -287,133 +407,161 @@ const CompareWorkbenchView = ({ data }: CompareWorkbenchViewProps) => {
     }
   }, [maxSharedPages]);
 
-  const scrollBothToPage = useCallback((pageNum: number) => {
-    const scrollOne = (container: HTMLDivElement | null) => {
-      if (!container) return false;
-      const pageEl = container.querySelector(`.compare-diff-page[data-page-number="${pageNum}"]`) as HTMLElement | null;
-      if (!pageEl) return false;
-      const maxTop = Math.max(0, container.scrollHeight - container.clientHeight);
-      const desired = Math.max(0, Math.min(maxTop, pageEl.offsetTop - Math.round(container.clientHeight * 0.2)));
-      container.scrollTop = desired;
-      return true;
-    };
+  const scrollBothToPage = useCallback(
+    (pageNum: number) => {
+      const scrollOne = (container: HTMLDivElement | null) => {
+        if (!container) return false;
+        const pageEl = container.querySelector(
+          `.compare-diff-page[data-page-number="${pageNum}"]`,
+        ) as HTMLElement | null;
+        if (!pageEl) return false;
+        const maxTop = Math.max(
+          0,
+          container.scrollHeight - container.clientHeight,
+        );
+        const desired = Math.max(
+          0,
+          Math.min(
+            maxTop,
+            pageEl.offsetTop - Math.round(container.clientHeight * 0.2),
+          ),
+        );
+        container.scrollTop = desired;
+        return true;
+      };
 
-    const hitBase = scrollOne(baseScrollRef.current);
-    const hitComp = scrollOne(comparisonScrollRef.current);
+      const hitBase = scrollOne(baseScrollRef.current);
+      const hitComp = scrollOne(comparisonScrollRef.current);
 
-    // Warn if one or both pages are not yet rendered
-    const baseHas = basePages.some(p => p.pageNumber === pageNum);
-    const compHas = comparisonPages.some(p => p.pageNumber === pageNum);
-    if (!baseHas || !compHas) {
-      alert({
-        alertType: 'warning',
-        title: t('compare.rendering.pageNotReadyTitle', 'Page not rendered yet'),
-        body: t('compare.rendering.pageNotReadyBody', 'Some pages are still rendering. Navigation will snap once they are ready.'),
-        location: 'bottom-right' as ToastLocation,
-        isPersistentPopup: false,
-        durationMs: 2500,
-      });
-    }
-
-    return hitBase || hitComp;
-  }, [basePages, comparisonPages, baseScrollRef, comparisonScrollRef, t]);
-
-  const handleTypingChange = useCallback((next: string) => {
-    // Only digits; allow empty while editing
-    const digits = next.replace(/[^0-9]/g, '');
-    if (digits.length === 0) {
-      setPageInputValue('');
-      if (typingTimerRef.current != null) {
-        window.clearTimeout(typingTimerRef.current);
-        typingTimerRef.current = null;
+      // Warn if one or both pages are not yet rendered
+      const baseHas = basePages.some((p) => p.pageNumber === pageNum);
+      const compHas = comparisonPages.some((p) => p.pageNumber === pageNum);
+      if (!baseHas || !compHas) {
+        alert({
+          alertType: "warning",
+          title: t(
+            "compare.rendering.pageNotReadyTitle",
+            "Page not rendered yet",
+          ),
+          body: t(
+            "compare.rendering.pageNotReadyBody",
+            "Some pages are still rendering. Navigation will snap once they are ready.",
+          ),
+          location: "bottom-right" as ToastLocation,
+          isPersistentPopup: false,
+          durationMs: 2500,
+        });
       }
-      return;
-    }
 
-    const parsed = Math.max(1, parseInt(digits, 10));
-    const capped = maxSharedPages > 0 ? Math.min(parsed, maxSharedPages) : parsed;
-    const display = String(capped);
-    setPageInputValue(display);
+      return hitBase || hitComp;
+    },
+    [basePages, comparisonPages, baseScrollRef, comparisonScrollRef, t],
+  );
 
-    isTypingRef.current = true;
-    if (typingTimerRef.current != null) window.clearTimeout(typingTimerRef.current);
-    typingTimerRef.current = window.setTimeout(() => {
-      isTypingRef.current = false;
-      scrollBothToPage(capped);
-    }, 300);
-  }, [maxSharedPages, scrollBothToPage]);
+  const handleTypingChange = useCallback(
+    (next: string) => {
+      // Only digits; allow empty while editing
+      const digits = next.replace(/[^0-9]/g, "");
+      if (digits.length === 0) {
+        setPageInputValue("");
+        if (typingTimerRef.current != null) {
+          window.clearTimeout(typingTimerRef.current);
+          typingTimerRef.current = null;
+        }
+        return;
+      }
+
+      const parsed = Math.max(1, parseInt(digits, 10));
+      const capped =
+        maxSharedPages > 0 ? Math.min(parsed, maxSharedPages) : parsed;
+      const display = String(capped);
+      setPageInputValue(display);
+
+      isTypingRef.current = true;
+      if (typingTimerRef.current != null)
+        window.clearTimeout(typingTimerRef.current);
+      typingTimerRef.current = window.setTimeout(() => {
+        isTypingRef.current = false;
+        scrollBothToPage(capped);
+      }, 300);
+    },
+    [maxSharedPages, scrollBothToPage],
+  );
 
   return (
     <Stack className="compare-workbench">
-
-        <Stack gap="lg" className="compare-workbench__content">
-          <div
-            className={`compare-workbench__columns ${layout === 'stacked' ? 'compare-workbench__columns--stacked' : ''}`}
-          >
-            <CompareDocumentPane
-              pane="base"
-              layout={layout}
-              scrollRef={baseScrollRef}
-              peerScrollRef={comparisonScrollRef}
-              handleScrollSync={handleScrollSync}
-              handleWheelZoom={handleWheelZoom}
-              handleWheelOverscroll={handleWheelOverscroll}
-              onTouchStart={onTouchStart}
-              onTouchMove={onTouchMove}
-              onTouchEnd={onTouchEnd}
-              isPanMode={isPanMode}
-              zoom={baseZoom}
-              title={baseTitle}
-              dropdownPlaceholder={baseDropdownPlaceholder}
-              changes={mapChangesForDropdown(baseWordChanges)}
-              onNavigateChange={(value, pageNumber) => handleChangeNavigation(value, 'base', pageNumber)}
-              isLoading={isOperationLoading || baseLoading}
-              processingMessage={processingMessage}
-              pages={basePages}
-              pairedPages={comparisonPages}
-              getRowHeightPx={getRowHeightPx}
-              wordHighlightMap={wordHighlightMaps.base}
-              metaIndexToGroupId={metaIndexToGroupId.base}
-              documentLabel={baseDocumentLabel}
-              pageLabel={pageLabel}
-              altLabel={baseDocumentLabel}
+      <Stack gap="lg" className="compare-workbench__content">
+        <div
+          className={`compare-workbench__columns ${layout === "stacked" ? "compare-workbench__columns--stacked" : ""}`}
+        >
+          <CompareDocumentPane
+            pane="base"
+            layout={layout}
+            scrollRef={baseScrollRef}
+            peerScrollRef={comparisonScrollRef}
+            handleScrollSync={handleScrollSync}
+            handleWheelZoom={handleWheelZoom}
+            handleWheelOverscroll={handleWheelOverscroll}
+            onTouchStart={onTouchStart}
+            onTouchMove={onTouchMove}
+            onTouchEnd={onTouchEnd}
+            isPanMode={isPanMode}
+            zoom={baseZoom}
+            title={baseTitle}
+            dropdownPlaceholder={baseDropdownPlaceholder}
+            changes={mapChangesForDropdown(baseWordChanges)}
+            onNavigateChange={(value, pageNumber) =>
+              handleChangeNavigation(value, "base", pageNumber)
+            }
+            isLoading={isOperationLoading || baseLoading}
+            processingMessage={processingMessage}
+            pages={basePages}
+            pairedPages={comparisonPages}
+            getRowHeightPx={getRowHeightPx}
+            wordHighlightMap={wordHighlightMaps.base}
+            metaIndexToGroupId={metaIndexToGroupId.base}
+            documentLabel={baseDocumentLabel}
+            pageLabel={pageLabel}
+            altLabel={baseDocumentLabel}
             pageInputValue={pageInputValue}
             onPageInputChange={handleTypingChange}
             maxSharedPages={maxSharedPages}
-            />
-            <CompareDocumentPane
-              pane="comparison"
-              layout={layout}
-              scrollRef={comparisonScrollRef}
-              peerScrollRef={baseScrollRef}
-              handleScrollSync={handleScrollSync}
-              handleWheelZoom={handleWheelZoom}
-              handleWheelOverscroll={handleWheelOverscroll}
-              onTouchStart={onTouchStart}
-              onTouchMove={onTouchMove}
-              onTouchEnd={onTouchEnd}
-              isPanMode={isPanMode}
-              zoom={comparisonZoom}
-              title={comparisonTitle}
-              dropdownPlaceholder={comparisonDropdownPlaceholder}
+          />
+          <CompareDocumentPane
+            pane="comparison"
+            layout={layout}
+            scrollRef={comparisonScrollRef}
+            peerScrollRef={baseScrollRef}
+            handleScrollSync={handleScrollSync}
+            handleWheelZoom={handleWheelZoom}
+            handleWheelOverscroll={handleWheelOverscroll}
+            onTouchStart={onTouchStart}
+            onTouchMove={onTouchMove}
+            onTouchEnd={onTouchEnd}
+            isPanMode={isPanMode}
+            zoom={comparisonZoom}
+            title={comparisonTitle}
+            dropdownPlaceholder={comparisonDropdownPlaceholder}
             changes={mapChangesForDropdown(comparisonWordChanges)}
-              onNavigateChange={(value, pageNumber) => handleChangeNavigation(value, 'comparison', pageNumber)}
-              isLoading={isOperationLoading || comparisonLoading}
-              processingMessage={processingMessage}
-              pages={comparisonPages}
-              pairedPages={basePages}
-              getRowHeightPx={getRowHeightPx}
-              wordHighlightMap={wordHighlightMaps.comparison}
-              metaIndexToGroupId={metaIndexToGroupId.comparison}
-              documentLabel={comparisonDocumentLabel}
-              pageLabel={pageLabel}
-              altLabel={comparisonDocumentLabel}
+            onNavigateChange={(value, pageNumber) =>
+              handleChangeNavigation(value, "comparison", pageNumber)
+            }
+            isLoading={isOperationLoading || comparisonLoading}
+            processingMessage={processingMessage}
+            pages={comparisonPages}
+            pairedPages={basePages}
+            getRowHeightPx={getRowHeightPx}
+            wordHighlightMap={wordHighlightMaps.comparison}
+            metaIndexToGroupId={metaIndexToGroupId.comparison}
+            documentLabel={comparisonDocumentLabel}
+            pageLabel={pageLabel}
+            altLabel={comparisonDocumentLabel}
             pageInputValue={pageInputValue}
             onPageInputChange={handleTypingChange}
             maxSharedPages={maxSharedPages}
-            />
-          </div>
-        </Stack>
+          />
+        </div>
+      </Stack>
     </Stack>
   );
 };
diff --git a/frontend/src/core/components/tools/compare/compare.ts b/frontend/src/core/components/tools/compare/compare.ts
index e8b9fcbc92..cd8d65a2f9 100644
--- a/frontend/src/core/components/tools/compare/compare.ts
+++ b/frontend/src/core/components/tools/compare/compare.ts
@@ -1,11 +1,11 @@
-import type { TokenBoundingBox, WordHighlightEntry } from '@app/types/compare';
-import type { FileId } from '@app/types/file';
-import type { StirlingFile, StirlingFileStub } from '@app/types/fileContext';
-import type { PagePreview } from '@app/types/compare';
+import type { TokenBoundingBox, WordHighlightEntry } from "@app/types/compare";
+import type { FileId } from "@app/types/file";
+import type { StirlingFile, StirlingFileStub } from "@app/types/fileContext";
+import type { PagePreview } from "@app/types/compare";
 
 /** Convert hex color (#rrggbb) to rgba() string with alpha; falls back to input if invalid. */
 export const toRgba = (hexColor: string, alpha: number): string => {
-  const hex = hexColor.replace('#', '');
+  const hex = hexColor.replace("#", "");
   if (hex.length !== 6) return hexColor;
   const r = parseInt(hex.slice(0, 2), 16);
   const g = parseInt(hex.slice(2, 4), 16);
@@ -15,7 +15,7 @@ export const toRgba = (hexColor: string, alpha: number): string => {
 
 /** Normalize rotation to [0, 360). */
 export const normalizeRotation = (deg: number | undefined | null): number => {
-  const n = ((deg ?? 0) % 360 + 360) % 360;
+  const n = (((deg ?? 0) % 360) + 360) % 360;
   return n;
 };
 
@@ -23,7 +23,9 @@ export const normalizeRotation = (deg: number | undefined | null): number => {
  * Merge overlapping or touching rectangles into larger non-overlapping blocks.
  * Robust across rotations (vertical groups) and prevents dark spots from overlaps.
  */
-export const mergeConnectedRects = (rects: TokenBoundingBox[]): TokenBoundingBox[] => {
+export const mergeConnectedRects = (
+  rects: TokenBoundingBox[],
+): TokenBoundingBox[] => {
   if (rects.length === 0) return rects;
   const EPS = 0.004; // small tolerance in normalized page coords
   const sorted = rects
@@ -36,7 +38,12 @@ export const mergeConnectedRects = (rects: TokenBoundingBox[]): TokenBoundingBox
     const aB = a.top + a.height;
     const bR = b.left + b.width;
     const bB = b.top + b.height;
-    return !(b.left > aR + EPS || bR < a.left - EPS || b.top > aB + EPS || bB < a.top - EPS);
+    return !(
+      b.left > aR + EPS ||
+      bR < a.left - EPS ||
+      b.top > aB + EPS ||
+      bB < a.top - EPS
+    );
   };
 
   for (const r of sorted) {
@@ -67,11 +74,12 @@ export const mergeConnectedRects = (rects: TokenBoundingBox[]): TokenBoundingBox
 export const groupWordRects = (
   wordRects: WordHighlightEntry[],
   metaIndexToGroupId: Map<number, string>,
-  pane: 'base' | 'comparison'
+  pane: "base" | "comparison",
 ): Map<string, TokenBoundingBox[]> => {
   const groupedRects = new Map<string, TokenBoundingBox[]>();
   for (const { rect, metaIndex } of wordRects) {
-    const id = metaIndexToGroupId.get(metaIndex) ?? `${pane}-token-${metaIndex}`;
+    const id =
+      metaIndexToGroupId.get(metaIndex) ?? `${pane}-token-${metaIndex}`;
     const current = groupedRects.get(id) ?? [];
     current.push(rect);
     groupedRects.set(id, current);
@@ -83,20 +91,31 @@ export const groupWordRects = (
 export const computePageLayoutMetrics = (args: {
   page: PagePreview;
   peerPage?: PagePreview | null;
-  layout: 'side-by-side' | 'stacked';
+  layout: "side-by-side" | "stacked";
   isMobileViewport: boolean;
   scrollRefWidth: number | null;
   viewportWidth: number;
   zoom: number;
   offsetPixels: number; // highlight offset in px relative to original page height
 }) => {
-  const { page, peerPage, layout, isMobileViewport, scrollRefWidth, viewportWidth, zoom, offsetPixels } = args;
-  const targetHeight = peerPage ? Math.max(page.height, peerPage.height) : page.height;
+  const {
+    page,
+    peerPage,
+    layout,
+    isMobileViewport,
+    scrollRefWidth,
+    viewportWidth,
+    zoom,
+    offsetPixels,
+  } = args;
+  const targetHeight = peerPage
+    ? Math.max(page.height, peerPage.height)
+    : page.height;
   const fit = targetHeight / page.height;
   const highlightOffset = offsetPixels / page.height;
   const rotationNorm = normalizeRotation(page.rotation);
   const isPortrait = rotationNorm === 0 || rotationNorm === 180;
-  const isStackedPortrait = layout === 'stacked' && isPortrait;
+  const isStackedPortrait = layout === "stacked" && isPortrait;
 
   const containerW = scrollRefWidth ?? viewportWidth;
   const stackedWidth = isMobileViewport
@@ -104,8 +123,12 @@ export const computePageLayoutMetrics = (args: {
     : Math.max(320, Math.round(viewportWidth * 0.5));
   const stackedHeight = Math.round(stackedWidth * 1.4142);
 
-  const baseWidth = isStackedPortrait ? stackedWidth : Math.round(page.width * fit);
-  const baseHeight = isStackedPortrait ? stackedHeight : Math.round(targetHeight);
+  const baseWidth = isStackedPortrait
+    ? stackedWidth
+    : Math.round(page.width * fit);
+  const baseHeight = isStackedPortrait
+    ? stackedHeight
+    : Math.round(targetHeight);
   const containerMaxW = scrollRefWidth ?? viewportWidth;
 
   // Container-first zooming with a stable baseline:
@@ -137,9 +160,11 @@ export const computePageLayoutMetrics = (args: {
 
   const containerWidth = Math.max(
     MIN_CONTAINER_WIDTH,
-    Math.min(containerMaxW, Math.round(baseWidth * containerScale))
+    Math.min(containerMaxW, Math.round(baseWidth * containerScale)),
+  );
+  const containerHeight = Math.round(
+    baseHeight * (containerWidth / Math.max(1, baseWidth)),
   );
-  const containerHeight = Math.round(baseHeight * (containerWidth / Math.max(1, baseWidth)));
 
   return {
     targetHeight,
@@ -159,14 +184,15 @@ export const computePageLayoutMetrics = (args: {
 
 /** Map changes to dropdown options tuple. */
 export const mapChangesForDropdown = (
-  changes: Array<{ value: string; label: string; pageNumber: number }>
-) => changes.map(({ value, label, pageNumber }) => ({ value, label, pageNumber }));
+  changes: Array<{ value: string; label: string; pageNumber: number }>,
+) =>
+  changes.map(({ value, label, pageNumber }) => ({ value, label, pageNumber }));
 
 /** File selection helpers */
 export const getFileFromSelection = (
   explicit: StirlingFile | null | undefined,
   fileId: FileId | null,
-  selectors: { getFile: (id: FileId) => StirlingFile | undefined | null }
+  selectors: { getFile: (id: FileId) => StirlingFile | undefined | null },
 ): StirlingFile | null => {
   if (explicit) return explicit;
   if (!fileId) return null;
@@ -175,7 +201,9 @@ export const getFileFromSelection = (
 
 export const getStubFromSelection = (
   fileId: FileId | null,
-  selectors: { getStirlingFileStub: (id: FileId) => StirlingFileStub | undefined }
+  selectors: {
+    getStirlingFileStub: (id: FileId) => StirlingFileStub | undefined;
+  },
 ): StirlingFileStub | null => {
   if (!fileId) return null;
   const stub = selectors.getStirlingFileStub(fileId);
@@ -189,7 +217,7 @@ export const computeShowProgressBanner = (
   compTotal: number | null | undefined,
   baseLoading: boolean,
   compLoading: boolean,
-  threshold: number = 400
+  threshold: number = 400,
 ): boolean => {
   if (!totalsKnown) return false;
   const totals = [baseTotal ?? 0, compTotal ?? 0];
@@ -201,9 +229,9 @@ export const computeProgressPct = (
   baseTotal: number | null | undefined,
   compTotal: number | null | undefined,
   baseRendered: number,
-  compRendered: number
+  compRendered: number,
 ): number => {
-  const totalCombined = totalsKnown ? ((baseTotal ?? 0) + (compTotal ?? 0)) : 0;
+  const totalCombined = totalsKnown ? (baseTotal ?? 0) + (compTotal ?? 0) : 0;
   const renderedCombined = baseRendered + compRendered;
   return totalsKnown && totalCombined > 0
     ? Math.min(100, Math.round((renderedCombined / totalCombined) * 100))
@@ -216,7 +244,7 @@ export const computeCountsText = (
   baseLength: number,
   compRendered: number,
   compTotal: number | null | undefined,
-  compLength: number
+  compLength: number,
 ): string => {
   const baseTotalShown = baseTotal || baseLength;
   const compTotalShown = compTotal || compLength;
@@ -227,7 +255,7 @@ export const computeMaxSharedPages = (
   baseTotal: number | null | undefined,
   compTotal: number | null | undefined,
   baseLen: number,
-  compLen: number
+  compLen: number,
 ): number => {
   const baseMax = baseTotal || baseLen || 0;
   const compMax = compTotal || compLen || 0;
@@ -235,5 +263,3 @@ export const computeMaxSharedPages = (
   if (!Number.isFinite(minKnown)) return 0;
   return Math.max(0, minKnown);
 };
-
-
diff --git a/frontend/src/core/components/tools/compare/compareView.css b/frontend/src/core/components/tools/compare/compareView.css
index fc58fa829b..c4c4278f08 100644
--- a/frontend/src/core/components/tools/compare/compareView.css
+++ b/frontend/src/core/components/tools/compare/compareView.css
@@ -92,7 +92,7 @@
   position: sticky;
   top: 0;
   z-index: 10;
-  background: var(--bg-toolbar);  
+  background: var(--bg-toolbar);
   backdrop-filter: blur(8px);
   border-bottom: 1px solid var(--border-default);
   padding: 0.5rem;
@@ -154,7 +154,9 @@
   padding: 0 !important;
 }
 
-.compare-dropdown-scrollwrap { margin: 0; }
+.compare-dropdown-scrollwrap {
+  margin: 0;
+}
 
 /* Ensure search field sits flush and does not overflow */
 .compare-changes-dropdown .mantine-Combobox-search {
@@ -195,25 +197,30 @@
   border-radius: 3px !important;
 }
 
-.compare-changes-select .mantine-ScrollArea-viewport::-webkit-scrollbar-thumb:hover {
+.compare-changes-select
+  .mantine-ScrollArea-viewport::-webkit-scrollbar-thumb:hover {
   background: var(--text-muted) !important;
 }
 
-.compare-changes-select--comparison .mantine-ScrollArea-viewport::-webkit-scrollbar {
+.compare-changes-select--comparison
+  .mantine-ScrollArea-viewport::-webkit-scrollbar {
   width: 6px !important;
 }
 
-.compare-changes-select--comparison .mantine-ScrollArea-viewport::-webkit-scrollbar-track {
+.compare-changes-select--comparison
+  .mantine-ScrollArea-viewport::-webkit-scrollbar-track {
   background: var(--bg-muted) !important;
   border-radius: 3px !important;
 }
 
-.compare-changes-select--comparison .mantine-ScrollArea-viewport::-webkit-scrollbar-thumb {
+.compare-changes-select--comparison
+  .mantine-ScrollArea-viewport::-webkit-scrollbar-thumb {
   background: var(--border-strong) !important;
   border-radius: 3px !important;
 }
 
-.compare-changes-select--comparison .mantine-ScrollArea-viewport::-webkit-scrollbar-thumb:hover {
+.compare-changes-select--comparison
+  .mantine-ScrollArea-viewport::-webkit-scrollbar-thumb:hover {
   background: var(--text-muted) !important;
 }
 
@@ -267,17 +274,17 @@
 /* Flash/pulse highlight for navigated change */
 @keyframes compare-flash {
   0% {
-    outline: 4px solid rgba(255, 235, 59, 0.0);
-    box-shadow: 0 0 0 rgba(255, 235, 59, 0.0);
+    outline: 4px solid rgba(255, 235, 59, 0);
+    box-shadow: 0 0 0 rgba(255, 235, 59, 0);
     background-color: rgba(255, 235, 59, 0.2) !important;
   }
   25% {
-    outline: 4px solid rgba(255, 235, 59, 1.0);
+    outline: 4px solid rgba(255, 235, 59, 1);
     box-shadow: 0 0 20px rgba(255, 235, 59, 0.8);
     background-color: rgba(255, 235, 59, 0.4) !important;
   }
   50% {
-    outline: 4px solid rgba(255, 235, 59, 1.0);
+    outline: 4px solid rgba(255, 235, 59, 1);
     box-shadow: 0 0 30px rgba(255, 235, 59, 0.9);
     background-color: rgba(255, 235, 59, 0.5) !important;
   }
@@ -287,9 +294,9 @@
     background-color: rgba(255, 235, 59, 0.3) !important;
   }
   100% {
-    outline: 4px solid rgba(255, 235, 59, 0.0);
-    box-shadow: 0 0 0 rgba(255, 235, 59, 0.0);
-    background-color: rgba(255, 235, 59, 0.0) !important;
+    outline: 4px solid rgba(255, 235, 59, 0);
+    box-shadow: 0 0 0 rgba(255, 235, 59, 0);
+    background-color: rgba(255, 235, 59, 0) !important;
   }
 }
 
@@ -415,7 +422,7 @@
 .compare-diff-highlight {
   position: absolute;
   pointer-events: none;
-  mix-blend-mode: normal; 
+  mix-blend-mode: normal;
 }
 
 /* Compare dropdown option formatting (page + clamped text) */
@@ -514,3 +521,58 @@
     margin-right: 0 !important;
   }
 }
+
+/* Pixel compare mode */
+.compare-pixel-workbench {
+  padding: 16px 24px 32px;
+  overflow-y: auto;
+}
+.compare-pixel-list {
+  padding-bottom: 32px;
+}
+.compare-pixel-page {
+  border: 1px solid var(--mantine-color-default-border, #dee2e6);
+  border-radius: 8px;
+  padding: 12px;
+  background: var(--mantine-color-body, #fff);
+}
+.compare-pixel-triptych {
+  display: grid;
+  grid-template-columns: 1fr 1fr 1fr;
+  gap: 12px;
+}
+.compare-pixel-triptych figure {
+  margin: 0;
+  display: flex;
+  flex-direction: column;
+  gap: 4px;
+}
+.compare-pixel-triptych figure img {
+  display: block;
+  border: 1px solid var(--mantine-color-default-border, #dee2e6);
+  background: #fff;
+}
+.compare-pixel-triptych figcaption {
+  font-size: 11px;
+  text-align: center;
+  color: var(--mantine-color-dimmed, #868e96);
+}
+.compare-pixel-overlay {
+  position: relative;
+  width: 100%;
+}
+.compare-pixel-overlay-img {
+  display: block;
+  width: 100%;
+  border: 1px solid var(--mantine-color-default-border, #dee2e6);
+}
+.compare-pixel-overlay-top {
+  position: absolute;
+  inset: 0;
+  mix-blend-mode: normal;
+}
+@media (max-width: 768px) {
+  .compare-pixel-triptych {
+    grid-template-columns: 1fr;
+  }
+}
diff --git a/frontend/src/core/components/tools/compare/hooks/useCompareChangeNavigation.ts b/frontend/src/core/components/tools/compare/hooks/useCompareChangeNavigation.ts
index f137581e88..d7d8e95635 100644
--- a/frontend/src/core/components/tools/compare/hooks/useCompareChangeNavigation.ts
+++ b/frontend/src/core/components/tools/compare/hooks/useCompareChangeNavigation.ts
@@ -1,6 +1,6 @@
-import { RefObject, useCallback } from 'react';
+import { RefObject, useCallback } from "react";
 
-type Pane = 'base' | 'comparison';
+type Pane = "base" | "comparison";
 
 type SuppressOptions = {
   temporarilySuppressScrollLink?: (fn: () => void, durationMs?: number) => void;
@@ -21,7 +21,7 @@ export const useCompareChangeNavigation = (
         }
       };
 
-      const targetRef = pane === 'base' ? baseScrollRef : comparisonScrollRef;
+      const targetRef = pane === "base" ? baseScrollRef : comparisonScrollRef;
       const container = targetRef.current;
       if (!container) {
         return;
@@ -29,30 +29,30 @@ export const useCompareChangeNavigation = (
 
       const findNodes = (): HTMLElement[] => {
         return Array.from(
-          container.querySelectorAll(`[data-change-id="${changeValue}"]`)
+          container.querySelectorAll(`[data-change-id="${changeValue}"]`),
         ) as HTMLElement[];
       };
 
       const scrollToPageIfNeeded = () => {
         if (!pageNumber) return false;
         const pageEl = container.querySelector(
-          `.compare-diff-page[data-page-number="${pageNumber}"]`
+          `.compare-diff-page[data-page-number="${pageNumber}"]`,
         ) as HTMLElement | null;
         if (!pageEl) return false;
         const top = pageEl.offsetTop - Math.round(container.clientHeight * 0.2);
         suppress(() => {
-          container.scrollTo({ top: Math.max(0, top), behavior: 'auto' });
+          container.scrollTo({ top: Math.max(0, top), behavior: "auto" });
         });
         return true;
       };
 
       const scrollPeerPageIfPossible = () => {
         if (!pageNumber) return;
-        const peerRef = pane === 'base' ? comparisonScrollRef : baseScrollRef;
+        const peerRef = pane === "base" ? comparisonScrollRef : baseScrollRef;
         const peer = peerRef.current;
         if (!peer) return;
         const peerPageEl = peer.querySelector(
-          `.compare-diff-page[data-page-number="${pageNumber}"]`
+          `.compare-diff-page[data-page-number="${pageNumber}"]`,
         ) as HTMLElement | null;
         if (!peerPageEl) return;
         const peerMaxTop = Math.max(0, peer.scrollHeight - peer.clientHeight);
@@ -60,11 +60,11 @@ export const useCompareChangeNavigation = (
           0,
           Math.min(
             peerMaxTop,
-            peerPageEl.offsetTop - Math.round(peer.clientHeight * 0.2)
-          )
+            peerPageEl.offsetTop - Math.round(peer.clientHeight * 0.2),
+          ),
         );
         suppress(() => {
-          peer.scrollTo({ top, behavior: 'auto' });
+          peer.scrollTo({ top, behavior: "auto" });
         });
       };
 
@@ -73,20 +73,30 @@ export const useCompareChangeNavigation = (
 
         // Prefer a percent-in-page based vertical scroll, which is resilient to transforms.
         const anchor = nodes[0];
-        const pageEl = anchor.closest('.compare-diff-page') as HTMLElement | null;
-        const inner = anchor.closest('.compare-diff-page__inner') as HTMLElement | null;
-        const topPercent = parseFloat((anchor as HTMLElement).style.top || '0');
+        const pageEl = anchor.closest(
+          ".compare-diff-page",
+        ) as HTMLElement | null;
+        const inner = anchor.closest(
+          ".compare-diff-page__inner",
+        ) as HTMLElement | null;
+        const topPercent = parseFloat((anchor as HTMLElement).style.top || "0");
         if (pageEl && inner && !Number.isNaN(topPercent)) {
           const innerRect = inner.getBoundingClientRect();
           const innerHeight = Math.max(1, innerRect.height);
           const absoluteTopInPage = (topPercent / 100) * innerHeight;
-          const maxTop = Math.max(0, container.scrollHeight - container.clientHeight);
+          const maxTop = Math.max(
+            0,
+            container.scrollHeight - container.clientHeight,
+          );
           const desiredTop = Math.max(
             0,
-            Math.min(maxTop, pageEl.offsetTop + absoluteTopInPage - container.clientHeight / 2)
+            Math.min(
+              maxTop,
+              pageEl.offsetTop + absoluteTopInPage - container.clientHeight / 2,
+            ),
           );
           suppress(() => {
-            container.scrollTo({ top: desiredTop, behavior: 'auto' });
+            container.scrollTo({ top: desiredTop, behavior: "auto" });
           });
         } else {
           // Fallback to bounding-rect based centering if percent approach is unavailable.
@@ -95,7 +105,7 @@ export const useCompareChangeNavigation = (
           let minLeft = Number.POSITIVE_INFINITY;
           let maxBottom = Number.NEGATIVE_INFINITY;
           let maxRight = Number.NEGATIVE_INFINITY;
-  
+
           nodes.forEach((element) => {
             const rect = element.getBoundingClientRect();
             minTop = Math.min(minTop, rect.top);
@@ -103,54 +113,94 @@ export const useCompareChangeNavigation = (
             maxBottom = Math.max(maxBottom, rect.bottom);
             maxRight = Math.max(maxRight, rect.right);
           });
-  
+
           const boxHeight = Math.max(1, maxBottom - minTop);
           const boxWidth = Math.max(1, maxRight - minLeft);
           const absoluteTop = minTop - containerRect.top + container.scrollTop;
-          const absoluteLeft = minLeft - containerRect.left + container.scrollLeft;
-          const maxTop = Math.max(0, container.scrollHeight - container.clientHeight);
-          const desiredTop = Math.max(0, Math.min(maxTop, absoluteTop - (container.clientHeight - boxHeight) / 2));
-          const desiredLeft = Math.max(0, absoluteLeft - (container.clientWidth - boxWidth) / 2);
-  
+          const absoluteLeft =
+            minLeft - containerRect.left + container.scrollLeft;
+          const maxTop = Math.max(
+            0,
+            container.scrollHeight - container.clientHeight,
+          );
+          const desiredTop = Math.max(
+            0,
+            Math.min(
+              maxTop,
+              absoluteTop - (container.clientHeight - boxHeight) / 2,
+            ),
+          );
+          const desiredLeft = Math.max(
+            0,
+            absoluteLeft - (container.clientWidth - boxWidth) / 2,
+          );
+
           suppress(() => {
-            container.scrollTo({ top: desiredTop, left: desiredLeft, behavior: 'auto' });
+            container.scrollTo({
+              top: desiredTop,
+              left: desiredLeft,
+              behavior: "auto",
+            });
           });
         }
 
         // Also scroll the peer container to the corresponding location in the
         // other PDF (same page and approximate vertical position within page),
         // not just the same list/scroll position.
-        const peerRef = pane === 'base' ? comparisonScrollRef : baseScrollRef;
+        const peerRef = pane === "base" ? comparisonScrollRef : baseScrollRef;
         const peer = peerRef.current;
         if (peer) {
           // Use the first node as the anchor
           const anchor = nodes[0];
-          const pageEl = anchor.closest('.compare-diff-page') as HTMLElement | null;
-          const pageNumAttr = pageEl?.getAttribute('data-page-number');
-          const topPercent = parseFloat((anchor as HTMLElement).style.top || '0');
+          const pageEl = anchor.closest(
+            ".compare-diff-page",
+          ) as HTMLElement | null;
+          const pageNumAttr = pageEl?.getAttribute("data-page-number");
+          const topPercent = parseFloat(
+            (anchor as HTMLElement).style.top || "0",
+          );
           if (pageNumAttr) {
             const peerPageEl = peer.querySelector(
-              `.compare-diff-page[data-page-number="${pageNumAttr}"]`
+              `.compare-diff-page[data-page-number="${pageNumAttr}"]`,
+            ) as HTMLElement | null;
+            const peerInner = peerPageEl?.querySelector(
+              ".compare-diff-page__inner",
             ) as HTMLElement | null;
-            const peerInner = peerPageEl?.querySelector('.compare-diff-page__inner') as HTMLElement | null;
             if (peerPageEl && peerInner) {
               const innerRect = peerInner.getBoundingClientRect();
               const innerHeight = Math.max(1, innerRect.height);
               const absoluteTopInPage = (topPercent / 100) * innerHeight;
-              const peerMaxTop = Math.max(0, peer.scrollHeight - peer.clientHeight);
+              const peerMaxTop = Math.max(
+                0,
+                peer.scrollHeight - peer.clientHeight,
+              );
               const peerDesiredTop = Math.max(
                 0,
-                Math.min(peerMaxTop, peerPageEl.offsetTop + absoluteTopInPage - peer.clientHeight / 2)
+                Math.min(
+                  peerMaxTop,
+                  peerPageEl.offsetTop +
+                    absoluteTopInPage -
+                    peer.clientHeight / 2,
+                ),
               );
               suppress(() => {
-                peer.scrollTo({ top: peerDesiredTop, behavior: 'auto' });
+                peer.scrollTo({ top: peerDesiredTop, behavior: "auto" });
               });
             } else if (peerPageEl) {
               // Fallback: Scroll to page top (clamped)
-              const peerMaxTop = Math.max(0, peer.scrollHeight - peer.clientHeight);
-              const top = Math.max(0, Math.min(peerMaxTop, peerPageEl.offsetTop - Math.round(peer.clientHeight * 0.2)));
+              const peerMaxTop = Math.max(
+                0,
+                peer.scrollHeight - peer.clientHeight,
+              );
+              const top = Math.max(
+                0,
+                Math.min(
+                  peerMaxTop,
+                  peerPageEl.offsetTop - Math.round(peer.clientHeight * 0.2),
+                ),
+              );
               suppress(() => {
-                peer.scrollTo({ top, behavior: 'auto' });
+                peer.scrollTo({ top, behavior: "auto" });
               });
             }
           }
@@ -158,7 +208,9 @@ export const useCompareChangeNavigation = (
 
         const groupsByInner = new Map<HTMLElement, HTMLElement[]>();
         nodes.forEach((element) => {
-          const inner = element.closest('.compare-diff-page__inner') as HTMLElement | null;
+          const inner = element.closest(
+            ".compare-diff-page__inner",
+          ) as HTMLElement | null;
           if (!inner) return;
           const list = groupsByInner.get(inner) ?? [];
           list.push(element);
@@ -180,9 +232,9 @@ export const useCompareChangeNavigation = (
             maxR = Math.max(maxR, leftPercent + widthPercent);
             maxB = Math.max(maxB, topPercent + heightPercent);
           });
-          const overlay = document.createElement('span');
-          overlay.className = 'compare-diff-flash-overlay';
-          overlay.style.position = 'absolute';
+          const overlay = document.createElement("span");
+          overlay.className = "compare-diff-flash-overlay";
+          overlay.style.position = "absolute";
           overlay.style.left = `${minL}%`;
           overlay.style.top = `${minT}%`;
           overlay.style.width = `${Math.max(0.1, maxR - minL)}%`;
@@ -192,12 +244,15 @@ export const useCompareChangeNavigation = (
         });
 
         nodes.forEach((element) => {
-          element.classList.remove('compare-diff-highlight--flash');
+          element.classList.remove("compare-diff-highlight--flash");
         });
         void container.clientWidth; // Force reflow
         nodes.forEach((element) => {
-          element.classList.add('compare-diff-highlight--flash');
-          window.setTimeout(() => element.classList.remove('compare-diff-highlight--flash'), 1600);
+          element.classList.add("compare-diff-highlight--flash");
+          window.setTimeout(
+            () => element.classList.remove("compare-diff-highlight--flash"),
+            1600,
+          );
         });
       };
 
@@ -240,8 +295,10 @@ export const useCompareChangeNavigation = (
         // We already scrolled to the page above; nothing else to do.
       }, 5000);
     },
-    [baseScrollRef, comparisonScrollRef]
+    [baseScrollRef, comparisonScrollRef],
   );
 };
 
-export type UseCompareChangeNavigationReturn = ReturnType<typeof useCompareChangeNavigation>;
+export type UseCompareChangeNavigationReturn = ReturnType<
+  typeof useCompareChangeNavigation
+>;
diff --git a/frontend/src/core/components/tools/compare/hooks/useCompareHighlights.ts b/frontend/src/core/components/tools/compare/hooks/useCompareHighlights.ts
index f06b6b499e..fcb743f8f0 100644
--- a/frontend/src/core/components/tools/compare/hooks/useCompareHighlights.ts
+++ b/frontend/src/core/components/tools/compare/hooks/useCompareHighlights.ts
@@ -1,11 +1,11 @@
-import { useCallback, useMemo } from 'react';
+import { useCallback, useMemo } from "react";
 import type {
   CompareFilteredTokenInfo,
   WordHighlightEntry,
   CompareResultData,
   CompareChangeOption,
   PagePreview,
-} from '@app/types/compare';
+} from "@app/types/compare";
 
 interface MetaGroupMap {
   base: Map<number, string>;
@@ -28,7 +28,7 @@ export interface UseCompareHighlightsResult {
 const buildWordChanges = (
   tokens: CompareFilteredTokenInfo[],
   metaIndexToGroupId: Map<number, string>,
-  groupPrefix: string
+  groupPrefix: string,
 ): CompareChangeOption[] => {
   metaIndexToGroupId.clear();
   if (!tokens.length) return [];
@@ -38,7 +38,10 @@ const buildWordChanges = (
 
   const flushRun = () => {
     if (currentRun.length === 0) return;
-    const label = currentRun.map((token) => token.token).join(' ').trim();
+    const label = currentRun
+      .map((token) => token.token)
+      .join(" ")
+      .trim();
     if (label.length === 0) {
       currentRun = [];
       return;
@@ -67,7 +70,7 @@ const buildWordChanges = (
 };
 
 const buildHighlightMap = (
-  tokens: CompareFilteredTokenInfo[]
+  tokens: CompareFilteredTokenInfo[],
 ): Map<number, WordHighlightEntry[]> => {
   const map = new Map<number, WordHighlightEntry[]>();
   for (const token of tokens) {
@@ -85,14 +88,17 @@ export const useCompareHighlights = (
   comparisonPages: PagePreview[],
 ): UseCompareHighlightsResult => {
   const baseMetaIndexToGroupId = useMemo(() => new Map<number, string>(), []);
-  const comparisonMetaIndexToGroupId = useMemo(() => new Map<number, string>(), []);
+  const comparisonMetaIndexToGroupId = useMemo(
+    () => new Map<number, string>(),
+    [],
+  );
 
   const baseWordChanges = useMemo(() => {
     if (!result) return [];
     return buildWordChanges(
       result.filteredTokenData.base,
       baseMetaIndexToGroupId,
-      'base-group'
+      "base-group",
     );
   }, [baseMetaIndexToGroupId, result]);
 
@@ -101,7 +107,7 @@ export const useCompareHighlights = (
     return buildWordChanges(
       result.filteredTokenData.comparison,
       comparisonMetaIndexToGroupId,
-      'comparison-group'
+      "comparison-group",
     );
   }, [comparisonMetaIndexToGroupId, result]);
 
@@ -122,13 +128,15 @@ export const useCompareHighlights = (
   const getRowHeightPx = useCallback(
     (pageNumber: number) => {
       const basePage = basePages.find((page) => page.pageNumber === pageNumber);
-      const comparisonPage = comparisonPages.find((page) => page.pageNumber === pageNumber);
+      const comparisonPage = comparisonPages.find(
+        (page) => page.pageNumber === pageNumber,
+      );
       const baseHeight = basePage ? basePage.height : 0;
       const comparisonHeight = comparisonPage ? comparisonPage.height : 0;
       const rowHeight = Math.max(baseHeight, comparisonHeight);
       return Math.round(rowHeight);
     },
-    [basePages, comparisonPages]
+    [basePages, comparisonPages],
   );
 
   return {
diff --git a/frontend/src/core/components/tools/compare/hooks/useComparePagePreviews.ts b/frontend/src/core/components/tools/compare/hooks/useComparePagePreviews.ts
index 19e4c93632..dce52075c1 100644
--- a/frontend/src/core/components/tools/compare/hooks/useComparePagePreviews.ts
+++ b/frontend/src/core/components/tools/compare/hooks/useComparePagePreviews.ts
@@ -1,13 +1,18 @@
-import { useEffect, useRef, useState } from 'react';
-import { pdfWorkerManager } from '@app/services/pdfWorkerManager';
-import type { PagePreview } from '@app/types/compare';
+import { useEffect, useRef, useState } from "react";
+import { pdfWorkerManager } from "@app/services/pdfWorkerManager";
+import type { PagePreview } from "@app/types/compare";
 
 const DISPLAY_SCALE = 1;
 
-const getDevicePixelRatio = () => (typeof window !== 'undefined' ? window.devicePixelRatio : 1);
+const getDevicePixelRatio = () =>
+  typeof window !== "undefined" ? window.devicePixelRatio : 1;
 
 // Observable preview cache so rendering progress can resume across remounts and view switches
-type CacheEntry = { pages: PagePreview[]; total: number; subscribers: Set<() => void> };
+type CacheEntry = {
+  pages: PagePreview[];
+  total: number;
+  subscribers: Set<() => void>;
+};
 const previewCache: Map<string, CacheEntry> = new Map();
 const latestVersionMap: Map<string, symbol> = new Map();
 
@@ -22,7 +27,11 @@ const getOrCreateEntry = (key: string): CacheEntry => {
 
 const notify = (entry: CacheEntry) => {
   entry.subscribers.forEach((fn) => {
-    try { fn(); } catch { /* no-op */ }
+    try {
+      fn();
+    } catch {
+      /* no-op */
+    }
   });
 };
 
@@ -32,15 +41,21 @@ const subscribe = (key: string, fn: () => void): (() => void) => {
   return () => entry.subscribers.delete(fn);
 };
 
-const appendBatchToCache = (key: string, batch: PagePreview[], provisionalTotal?: number) => {
+const appendBatchToCache = (
+  key: string,
+  batch: PagePreview[],
+  provisionalTotal?: number,
+) => {
   const entry = getOrCreateEntry(key);
   const next = entry.pages.slice();
   for (const p of batch) {
     const idx = next.findIndex((x) => x.pageNumber > p.pageNumber);
-    if (idx === -1) next.push(p); else next.splice(idx, 0, p);
+    if (idx === -1) next.push(p);
+    else next.splice(idx, 0, p);
   }
   entry.pages = next;
-  if (typeof provisionalTotal === 'number' && entry.total === 0) entry.total = provisionalTotal;
+  if (typeof provisionalTotal === "number" && entry.total === 0)
+    entry.total = provisionalTotal;
   notify(entry);
 };
 
@@ -50,14 +65,17 @@ const setTotalInCache = (key: string, total: number) => {
   notify(entry);
 };
 
-const replacePagesInCache = (key: string, pages: PagePreview[], total?: number) => {
+const replacePagesInCache = (
+  key: string,
+  pages: PagePreview[],
+  total?: number,
+) => {
   const entry = getOrCreateEntry(key);
   entry.pages = pages.slice();
-  if (typeof total === 'number') entry.total = total;
+  if (typeof total === "number") entry.total = total;
   notify(entry);
 };
 
-
 const renderPdfDocumentToImages = async (
   file: File,
   onBatch?: (previews: PagePreview[]) => void,
@@ -81,13 +99,17 @@ const renderPdfDocumentToImages = async (
     let batch: PagePreview[] = [];
     const shouldStop = () => Boolean(shouldAbort?.());
 
-    for (let pageNumber = Math.max(1, startAtPage); pageNumber <= pdf.numPages; pageNumber += 1) {
+    for (
+      let pageNumber = Math.max(1, startAtPage);
+      pageNumber <= pdf.numPages;
+      pageNumber += 1
+    ) {
       if (shouldStop()) break;
       const page = await pdf.getPage(pageNumber);
       const displayViewport = page.getViewport({ scale: DISPLAY_SCALE });
       const renderViewport = page.getViewport({ scale: renderScale });
-      const canvas = document.createElement('canvas');
-      const context = canvas.getContext('2d');
+      const canvas = document.createElement("canvas");
+      const context = canvas.getContext("2d");
 
       canvas.width = Math.round(renderViewport.width);
       canvas.height = Math.round(renderViewport.height);
@@ -98,7 +120,11 @@ const renderPdfDocumentToImages = async (
       }
 
       try {
-        await page.render({ canvasContext: context, viewport: renderViewport, canvas }).promise;
+        await page.render({
+          canvasContext: context,
+          viewport: renderViewport,
+          canvas,
+        }).promise;
         if (shouldStop()) break;
 
         const preview: PagePreview = {
@@ -160,13 +186,17 @@ export const useComparePagePreviews = ({
       };
     }
 
-    const key = `${file.name || 'file'}:${file.size || 0}:${cacheKey ?? 'none'}`;
+    const key = `${file.name || "file"}:${file.size || 0}:${cacheKey ?? "none"}`;
     const refreshVersion = Symbol(key);
     latestVersionMap.set(key, refreshVersion);
     const entry = getOrCreateEntry(key);
-    const cachedTotal = entry.total ?? (entry.pages.length ?? 0);
+    const cachedTotal = entry.total ?? entry.pages.length ?? 0;
     let lastKnownTotal = cachedTotal;
-    const isFullyCached = Boolean(entry.pages.length > 0 && cachedTotal > 0 && entry.pages.length >= cachedTotal);
+    const isFullyCached = Boolean(
+      entry.pages.length > 0 &&
+      cachedTotal > 0 &&
+      entry.pages.length >= cachedTotal,
+    );
 
     if (entry.pages.length > 0) {
       const nextPages = entry.pages.slice();
@@ -182,7 +212,8 @@ export const useComparePagePreviews = ({
       const e = getOrCreateEntry(key);
       setPages(e.pages.slice());
       setTotalPages(e.total);
-      const done = e.pages.length > 0 && e.total > 0 && e.pages.length >= e.total;
+      const done =
+        e.pages.length > 0 && e.total > 0 && e.pages.length >= e.total;
       setLoading(!done);
     });
 
@@ -212,7 +243,7 @@ export const useComparePagePreviews = ({
             }
           },
           startAt,
-          () => cancelled || current !== inFlightRef.current
+          () => cancelled || current !== inFlightRef.current,
         );
         if (!cancelled && current === inFlightRef.current) {
           const stillLatest = latestVersionMap.get(key) === refreshVersion;
@@ -220,15 +251,21 @@ export const useComparePagePreviews = ({
             return;
           }
           const cacheEntry = getOrCreateEntry(key);
-          const finalTotal = lastKnownTotal || cachedTotal || cacheEntry.total || previews.length;
+          const finalTotal =
+            lastKnownTotal ||
+            cachedTotal ||
+            cacheEntry.total ||
+            previews.length;
           lastKnownTotal = finalTotal;
           const cachePages = cacheEntry.pages ?? [];
           const preferPreviews = previews.length > cachePages.length;
-          const finalPages = preferPreviews ? previews.slice() : cachePages.slice();
+          const finalPages = preferPreviews
+            ? previews.slice()
+            : cachePages.slice();
           replacePagesInCache(key, finalPages, finalTotal);
         }
       } catch (error) {
-        console.error('[compare] failed to render document preview', error);
+        console.error("[compare] failed to render document preview", error);
         if (!cancelled) {
           setPages([]);
         }
@@ -250,4 +287,6 @@ export const useComparePagePreviews = ({
   return { pages, loading, totalPages, renderedPages: pages.length };
 };
 
-export type UseComparePagePreviewsReturn = ReturnType<typeof useComparePagePreviews>;
+export type UseComparePagePreviewsReturn = ReturnType<
+  typeof useComparePagePreviews
+>;
diff --git a/frontend/src/core/components/tools/compare/hooks/useComparePanZoom.ts b/frontend/src/core/components/tools/compare/hooks/useComparePanZoom.ts
index df5a275b97..c3e9589f22 100644
--- a/frontend/src/core/components/tools/compare/hooks/useComparePanZoom.ts
+++ b/frontend/src/core/components/tools/compare/hooks/useComparePanZoom.ts
@@ -1,15 +1,9 @@
-import {
-  useCallback,
-  useEffect,
-  useMemo,
-  useRef,
-  useState,
-} from 'react';
+import { useCallback, useEffect, useMemo, useRef, useState } from "react";
 import type {
   MouseEvent as ReactMouseEvent,
   TouchEvent as ReactTouchEvent,
   WheelEvent as ReactWheelEvent,
-} from 'react';
+} from "react";
 import type {
   PagePreview,
   ComparePane as Pane,
@@ -20,7 +14,7 @@ import type {
   PinchState,
   UseComparePanZoomOptions,
   UseComparePanZoomReturn,
-} from '@app/types/compare';
+} from "@app/types/compare";
 
 const ZOOM_MIN = 0.5;
 const ZOOM_MAX = 100000;
@@ -41,8 +35,14 @@ export const useComparePanZoom = ({
   const baseScrollRef = useRef<HTMLDivElement>(null);
   const comparisonScrollRef = useRef<HTMLDivElement>(null);
   const isSyncingRef = useRef(false);
-  const userScrollRef = useRef<{ base: boolean; comparison: boolean }>({ base: false, comparison: false });
-  const scrollLinkDeltaRef = useRef<ScrollLinkDelta>({ vertical: 0, horizontal: 0 });
+  const userScrollRef = useRef<{ base: boolean; comparison: boolean }>({
+    base: false,
+    comparison: false,
+  });
+  const scrollLinkDeltaRef = useRef<ScrollLinkDelta>({
+    vertical: 0,
+    horizontal: 0,
+  });
   const scrollLinkAnchorsRef = useRef<ScrollLinkAnchors>({
     deltaPixelsBaseToComp: 0,
     deltaPixelsCompToBase: 0,
@@ -59,37 +59,61 @@ export const useComparePanZoom = ({
     targetStartPanX: 0,
     targetStartPanY: 0,
   });
-  const lastActivePaneRef = useRef<Pane>('base');
+  const lastActivePaneRef = useRef<Pane>("base");
   const [baseZoom, setBaseZoom] = useState(1);
   const [comparisonZoom, setComparisonZoom] = useState(1);
   const [basePan, setBasePan] = useState<PanState>({ x: 0, y: 0 });
   const [comparisonPan, setComparisonPan] = useState<PanState>({ x: 0, y: 0 });
-  const wheelZoomAccumRef = useRef<{ base: number; comparison: number }>({ base: 0, comparison: 0 });
-  const pinchRef = useRef<PinchState>({ active: false, pane: null, startDistance: 0, startZoom: 1 });
-  const edgeOverscrollRef = useRef<{ base: number; comparison: number }>({ base: 0, comparison: 0 });
-  const [rowStructuralExtraPx, setRowStructuralExtraPx] = useState(DEFAULT_ROW_STRUCTURAL_EXTRA);
+  const wheelZoomAccumRef = useRef<{ base: number; comparison: number }>({
+    base: 0,
+    comparison: 0,
+  });
+  const pinchRef = useRef<PinchState>({
+    active: false,
+    pane: null,
+    startDistance: 0,
+    startZoom: 1,
+  });
+  const edgeOverscrollRef = useRef<{ base: number; comparison: number }>({
+    base: 0,
+    comparison: 0,
+  });
+  const [rowStructuralExtraPx, setRowStructuralExtraPx] = useState(
+    DEFAULT_ROW_STRUCTURAL_EXTRA,
+  );
   const [rowGapPx, setRowGapPx] = useState(DEFAULT_ROW_GAP);
 
-  const [layout, setLayoutState] = useState<'side-by-side' | 'stacked'>(prefersStacked ? 'stacked' : 'side-by-side');
-  const setLayout = useCallback((next: 'side-by-side' | 'stacked') => {
+  const [layout, setLayoutState] = useState<"side-by-side" | "stacked">(
+    prefersStacked ? "stacked" : "side-by-side",
+  );
+  const setLayout = useCallback((next: "side-by-side" | "stacked") => {
     setLayoutState(next);
   }, []);
   const toggleLayout = useCallback(() => {
-    setLayoutState(prev => (prev === 'side-by-side' ? 'stacked' : 'side-by-side'));
+    setLayoutState((prev) =>
+      prev === "side-by-side" ? "stacked" : "side-by-side",
+    );
   }, []);
 
   useEffect(() => {
-    setLayoutState(prev => (prefersStacked ? 'stacked' : prev === 'stacked' ? 'side-by-side' : prev));
+    setLayoutState((prev) =>
+      prefersStacked ? "stacked" : prev === "stacked" ? "side-by-side" : prev,
+    );
   }, [prefersStacked]);
 
   const getPagesForPane = useCallback(
-    (pane: Pane) => (pane === 'base' ? basePages : comparisonPages),
-    [basePages, comparisonPages]
+    (pane: Pane) => (pane === "base" ? basePages : comparisonPages),
+    [basePages, comparisonPages],
   );
 
   // rAF-coalesced follower scroll writes
-  const syncRafRef = useRef<{ base: number | null; comparison: number | null }>({ base: null, comparison: null });
-  const desiredTopRef = useRef<{ base: number | null; comparison: number | null }>({ base: null, comparison: null });
+  const syncRafRef = useRef<{ base: number | null; comparison: number | null }>(
+    { base: null, comparison: null },
+  );
+  const desiredTopRef = useRef<{
+    base: number | null;
+    comparison: number | null;
+  }>({ base: null, comparison: null });
 
   const canonicalLayout = useMemo(() => {
     const baseMap = new Map<number, PagePreview>();
@@ -99,15 +123,18 @@ export const useComparePanZoom = ({
 
     const allPageNumbers = Array.from(
       new Set([
-        ...basePages.map(p => p.pageNumber),
-        ...comparisonPages.map(p => p.pageNumber),
-      ])
+        ...basePages.map((p) => p.pageNumber),
+        ...comparisonPages.map((p) => p.pageNumber),
+      ]),
     ).sort((a, b) => a - b);
 
-    const rows = allPageNumbers.map(pageNumber => {
+    const rows = allPageNumbers.map((pageNumber) => {
       const basePage = baseMap.get(pageNumber) ?? null;
       const compPage = compMap.get(pageNumber) ?? null;
-      const canonicalHeight = Math.max(basePage?.height ?? 0, compPage?.height ?? 0);
+      const canonicalHeight = Math.max(
+        basePage?.height ?? 0,
+        compPage?.height ?? 0,
+      );
       return {
         pageNumber,
         canonicalHeight,
@@ -116,7 +143,10 @@ export const useComparePanZoom = ({
       };
     });
 
-    const totalCanonicalHeight = rows.reduce((sum, row) => sum + Math.round(row.canonicalHeight), 0);
+    const totalCanonicalHeight = rows.reduce(
+      (sum, row) => sum + Math.round(row.canonicalHeight),
+      0,
+    );
     return { rows, totalCanonicalHeight };
   }, [basePages, comparisonPages]);
 
@@ -124,29 +154,38 @@ export const useComparePanZoom = ({
   // so the scroll mapper can account for real DOM layout instead of relying on
   // bare page image heights.
   useEffect(() => {
-    if (typeof window === 'undefined') return;
+    if (typeof window === "undefined") return;
     if (canonicalLayout.rows.length === 0) return;
 
     const raf = window.requestAnimationFrame(() => {
       const sourceContent =
-        baseScrollRef.current?.querySelector<HTMLElement>('.compare-pane__content') ??
-        comparisonScrollRef.current?.querySelector<HTMLElement>('.compare-pane__content');
+        baseScrollRef.current?.querySelector<HTMLElement>(
+          ".compare-pane__content",
+        ) ??
+        comparisonScrollRef.current?.querySelector<HTMLElement>(
+          ".compare-pane__content",
+        );
       if (!sourceContent) return;
 
       const style = window.getComputedStyle(sourceContent);
       const gapStr = style.rowGap || style.gap;
       const parsedGap = gapStr ? Number.parseFloat(gapStr) : Number.NaN;
-      const measuredGap = Number.isNaN(parsedGap) ? rowGapPx : Math.max(0, Math.round(parsedGap));
+      const measuredGap = Number.isNaN(parsedGap)
+        ? rowGapPx
+        : Math.max(0, Math.round(parsedGap));
       if (measuredGap !== rowGapPx) {
         setRowGapPx(measuredGap);
       }
 
-      const totalGap = Math.max(0, canonicalLayout.rows.length - 1) * measuredGap;
+      const totalGap =
+        Math.max(0, canonicalLayout.rows.length - 1) * measuredGap;
       const contentHeight = Math.round(sourceContent.scrollHeight);
-      const available = contentHeight - totalGap - canonicalLayout.totalCanonicalHeight;
-      const candidate = canonicalLayout.rows.length > 0
-        ? Math.max(0, Math.round(available / canonicalLayout.rows.length))
-        : 0;
+      const available =
+        contentHeight - totalGap - canonicalLayout.totalCanonicalHeight;
+      const candidate =
+        canonicalLayout.rows.length > 0
+          ? Math.max(0, Math.round(available / canonicalLayout.rows.length))
+          : 0;
 
       if (Math.abs(candidate - rowStructuralExtraPx) >= 1) {
         setRowStructuralExtraPx(candidate);
@@ -163,7 +202,10 @@ export const useComparePanZoom = ({
     for (let index = 0; index < totalRows; index += 1) {
       const row = canonicalLayout.rows[index];
       const canonicalHeight = Math.round(row.canonicalHeight);
-      const structuralHeight = Math.max(0, Math.round(canonicalHeight + rowStructuralExtraPx));
+      const structuralHeight = Math.max(
+        0,
+        Math.round(canonicalHeight + rowStructuralExtraPx),
+      );
       const includeGap = index < totalRows - 1 ? rowGapPx : 0;
       const totalHeight = structuralHeight + includeGap;
       if (row.hasBase) base.push(totalHeight);
@@ -191,8 +233,12 @@ export const useComparePanZoom = ({
     (sourceTop: number, sourceIsBase: boolean): number => {
       const srcHeights = sourceIsBase ? rowHeights.base : rowHeights.comp;
       const dstHeights = sourceIsBase ? rowHeights.comp : rowHeights.base;
-      const srcPrefix = sourceIsBase ? rowHeights.basePrefix : rowHeights.compPrefix;
-      const dstPrefix = sourceIsBase ? rowHeights.compPrefix : rowHeights.basePrefix;
+      const srcPrefix = sourceIsBase
+        ? rowHeights.basePrefix
+        : rowHeights.compPrefix;
+      const dstPrefix = sourceIsBase
+        ? rowHeights.compPrefix
+        : rowHeights.basePrefix;
 
       if (dstHeights.length === 0 || srcHeights.length === 0) return sourceTop;
 
@@ -205,7 +251,8 @@ export const useComparePanZoom = ({
       let hi = srcHeights.length - 1;
       while (lo < hi) {
         const mid = Math.floor((lo + hi + 1) / 2);
-        if (srcPrefix[mid] <= top) lo = mid; else hi = mid - 1;
+        if (srcPrefix[mid] <= top) lo = mid;
+        else hi = mid - 1;
       }
       const i = lo;
       const within = top - srcPrefix[i];
@@ -215,18 +262,20 @@ export const useComparePanZoom = ({
       const dstTop = dstPrefix[j] + frac * (dstHeights[j] || 1);
       return dstTop;
     },
-    [rowHeights]
+    [rowHeights],
   );
 
   const getMaxCanvasSize = useCallback(
     (pane: Pane) => {
       const pages = getPagesForPane(pane);
-      const peers = getPagesForPane(pane === 'base' ? 'comparison' : 'base');
+      const peers = getPagesForPane(pane === "base" ? "comparison" : "base");
       let maxW = 0;
       let maxH = 0;
       for (const page of pages) {
-        const peer = peers.find(p => p.pageNumber === page.pageNumber);
-        const targetHeight = peer ? Math.max(page.height, peer.height) : page.height;
+        const peer = peers.find((p) => p.pageNumber === page.pageNumber);
+        const targetHeight = peer
+          ? Math.max(page.height, peer.height)
+          : page.height;
         const fit = targetHeight / page.height;
         const width = Math.round(page.width * fit);
         const height = Math.round(targetHeight);
@@ -235,13 +284,16 @@ export const useComparePanZoom = ({
       }
       return { maxW, maxH };
     },
-    [getPagesForPane]
+    [getPagesForPane],
   );
 
   const getPanBounds = useCallback(
     (pane: Pane, zoomOverride?: number) => {
-      const container = pane === 'base' ? baseScrollRef.current : comparisonScrollRef.current;
-      const canvasEl = container?.querySelector('.compare-diff-page__canvas') as HTMLElement | null;
+      const container =
+        pane === "base" ? baseScrollRef.current : comparisonScrollRef.current;
+      const canvasEl = container?.querySelector(
+        ".compare-diff-page__canvas",
+      ) as HTMLElement | null;
       let canvasW: number | null = null;
       let canvasH: number | null = null;
       if (canvasEl) {
@@ -253,12 +305,17 @@ export const useComparePanZoom = ({
       const fallback = getMaxCanvasSize(pane);
       const W = canvasW ?? fallback.maxW;
       const H = canvasH ?? fallback.maxH;
-      const zoom = zoomOverride !== undefined ? zoomOverride : pane === 'base' ? baseZoom : comparisonZoom;
+      const zoom =
+        zoomOverride !== undefined
+          ? zoomOverride
+          : pane === "base"
+            ? baseZoom
+            : comparisonZoom;
       const extraX = Math.max(0, W * (Math.max(zoom, 1) - 1));
       const extraY = Math.max(0, H * (Math.max(zoom, 1) - 1));
       return { maxX: extraX, maxY: extraY };
     },
-    [baseZoom, comparisonZoom, getMaxCanvasSize]
+    [baseZoom, comparisonZoom, getMaxCanvasSize],
   );
 
   const getPaneRotation = useCallback(
@@ -268,7 +325,7 @@ export const useComparePanZoom = ({
       const normalized = ((rotation % 360) + 360) % 360;
       return normalized as 0 | 90 | 180 | 270 | number;
     },
-    [getPagesForPane]
+    [getPagesForPane],
   );
 
   const mapPanBetweenOrientations = useCallback(
@@ -278,8 +335,10 @@ export const useComparePanZoom = ({
       const sourceBounds = getPanBounds(source);
       const targetBounds = getPanBounds(target);
 
-      const sx = sourceBounds.maxX === 0 ? 0 : (sourcePan.x / sourceBounds.maxX) * 2 - 1;
-      const sy = sourceBounds.maxY === 0 ? 0 : (sourcePan.y / sourceBounds.maxY) * 2 - 1;
+      const sx =
+        sourceBounds.maxX === 0 ? 0 : (sourcePan.x / sourceBounds.maxX) * 2 - 1;
+      const sy =
+        sourceBounds.maxY === 0 ? 0 : (sourcePan.y / sourceBounds.maxY) * 2 - 1;
 
       const applyRotation = (nx: number, ny: number, rotation: number) => {
         const r = ((rotation % 360) + 360) % 360;
@@ -291,33 +350,46 @@ export const useComparePanZoom = ({
       };
 
       const logical = applyRotation(sx, sy, sourceRotation);
-      const targetCentered = applyRotation(logical.nx, logical.ny, 360 - targetRotation);
+      const targetCentered = applyRotation(
+        logical.nx,
+        logical.ny,
+        360 - targetRotation,
+      );
 
       const targetNormX = (targetCentered.nx + 1) / 2;
       const targetNormY = (targetCentered.ny + 1) / 2;
 
-      const targetX = Math.max(0, Math.min(targetBounds.maxX, targetNormX * targetBounds.maxX));
-      const targetY = Math.max(0, Math.min(targetBounds.maxY, targetNormY * targetBounds.maxY));
+      const targetX = Math.max(
+        0,
+        Math.min(targetBounds.maxX, targetNormX * targetBounds.maxX),
+      );
+      const targetY = Math.max(
+        0,
+        Math.min(targetBounds.maxY, targetNormY * targetBounds.maxY),
+      );
       return { x: targetX, y: targetY };
     },
-    [getPaneRotation, getPanBounds]
+    [getPaneRotation, getPanBounds],
   );
 
   const centerPanForZoom = useCallback(
     (pane: Pane, zoomValue: number) => {
       const bounds = getPanBounds(pane, zoomValue);
-      const center = { x: Math.round(bounds.maxX / 2), y: Math.round(bounds.maxY / 2) };
-      if (pane === 'base') {
+      const center = {
+        x: Math.round(bounds.maxX / 2),
+        y: Math.round(bounds.maxY / 2),
+      };
+      if (pane === "base") {
         setBasePan(center);
       } else {
         setComparisonPan(center);
       }
     },
-    [getPanBounds]
+    [getPanBounds],
   );
 
   const setPanToTopLeft = useCallback((pane: Pane) => {
-    if (pane === 'base') {
+    if (pane === "base") {
       setBasePan({ x: 0, y: 0 });
     } else {
       setComparisonPan({ x: 0, y: 0 });
@@ -327,18 +399,18 @@ export const useComparePanZoom = ({
   const clampPanForZoom = useCallback(
     (pane: Pane, zoomValue: number) => {
       const bounds = getPanBounds(pane, zoomValue);
-      const current = pane === 'base' ? basePan : comparisonPan;
+      const current = pane === "base" ? basePan : comparisonPan;
       const clamped = {
         x: Math.max(0, Math.min(bounds.maxX, current.x)),
         y: Math.max(0, Math.min(bounds.maxY, current.y)),
       };
-      if (pane === 'base') {
+      if (pane === "base") {
         setBasePan(clamped);
       } else {
         setComparisonPan(clamped);
       }
     },
-    [basePan, comparisonPan, getPanBounds]
+    [basePan, comparisonPan, getPanBounds],
   );
 
   const handleScrollSync = useCallback(
@@ -349,7 +421,7 @@ export const useComparePanZoom = ({
       }
 
       const sourceIsBase = source === baseScrollRef.current;
-      const sourceKey = sourceIsBase ? 'base' : 'comparison';
+      const sourceKey = sourceIsBase ? "base" : "comparison";
 
       // Only sync if this scroll was initiated by the user (wheel/scrollbar/keyboard),
       // not by our own programmatic scrolls.
@@ -357,10 +429,16 @@ export const useComparePanZoom = ({
         return;
       }
 
-      lastActivePaneRef.current = sourceIsBase ? 'base' : 'comparison';
+      lastActivePaneRef.current = sourceIsBase ? "base" : "comparison";
 
-      const targetVerticalRange = Math.max(1, target.scrollHeight - target.clientHeight);
-      const mappedTop = mapScrollTopBetweenPanes(source.scrollTop, sourceIsBase);
+      const targetVerticalRange = Math.max(
+        1,
+        target.scrollHeight - target.clientHeight,
+      );
+      const mappedTop = mapScrollTopBetweenPanes(
+        source.scrollTop,
+        sourceIsBase,
+      );
 
       // Use pixel anchors captured at link time to preserve offset
       const deltaPx = sourceIsBase
@@ -373,19 +451,25 @@ export const useComparePanZoom = ({
       // If the mapping requests a position beyond target bounds and the target is already
       // at that bound, skip writing to avoid any subtle feedback that could impede
       // continued scrolling in the source pane.
-      const atTopBound = desiredTop === 0 && target.scrollTop === 0 && rawDesired < 0;
-      const atBottomBound = desiredTop === targetVerticalRange && target.scrollTop === targetVerticalRange && rawDesired > targetVerticalRange;
+      const atTopBound =
+        desiredTop === 0 && target.scrollTop === 0 && rawDesired < 0;
+      const atBottomBound =
+        desiredTop === targetVerticalRange &&
+        target.scrollTop === targetVerticalRange &&
+        rawDesired > targetVerticalRange;
       if (atTopBound || atBottomBound) {
         return;
       }
 
       const targetIsBase = target === baseScrollRef.current;
-      const key = targetIsBase ? 'base' : 'comparison';
+      const key = targetIsBase ? "base" : "comparison";
 
       desiredTopRef.current[key] = desiredTop;
       if (syncRafRef.current[key] == null) {
         syncRafRef.current[key] = requestAnimationFrame(() => {
-          const el = targetIsBase ? baseScrollRef.current : comparisonScrollRef.current;
+          const el = targetIsBase
+            ? baseScrollRef.current
+            : comparisonScrollRef.current;
           const top = desiredTopRef.current[key] ?? 0;
           if (el) {
             isSyncingRef.current = true;
@@ -398,7 +482,7 @@ export const useComparePanZoom = ({
         });
       }
     },
-    [isScrollLinked, mapScrollTopBetweenPanes]
+    [isScrollLinked, mapScrollTopBetweenPanes],
   );
 
   // Track user-initiated scroll state per pane
@@ -407,15 +491,27 @@ export const useComparePanZoom = ({
     const compEl = comparisonScrollRef.current;
     if (!baseEl || !compEl) return;
 
-    const onUserScrollStartBase = () => { userScrollRef.current.base = true; };
-    const onUserScrollStartComp = () => { userScrollRef.current.comparison = true; };
-    const onUserScrollEndBase = () => { userScrollRef.current.base = false; };
-    const onUserScrollEndComp = () => { userScrollRef.current.comparison = false; };
+    const onUserScrollStartBase = () => {
+      userScrollRef.current.base = true;
+    };
+    const onUserScrollStartComp = () => {
+      userScrollRef.current.comparison = true;
+    };
+    const onUserScrollEndBase = () => {
+      userScrollRef.current.base = false;
+    };
+    const onUserScrollEndComp = () => {
+      userScrollRef.current.comparison = false;
+    };
 
-    const addUserListeners = (el: HTMLDivElement, onStart: () => void, onEnd: () => void) => {
-      el.addEventListener('wheel', onStart, { passive: true });
-      el.addEventListener('mousedown', onStart, { passive: true });
-      el.addEventListener('touchstart', onStart, { passive: true });
+    const addUserListeners = (
+      el: HTMLDivElement,
+      onStart: () => void,
+      onEnd: () => void,
+    ) => {
+      el.addEventListener("wheel", onStart, { passive: true });
+      el.addEventListener("mousedown", onStart, { passive: true });
+      el.addEventListener("touchstart", onStart, { passive: true });
       // Heuristic: clear the flag shortly after scroll events settle
       let timeout: number | null = null;
       const onScroll = () => {
@@ -425,27 +521,41 @@ export const useComparePanZoom = ({
         if (timeout != null) window.clearTimeout(timeout);
         timeout = window.setTimeout(onEnd, 120);
       };
-      el.addEventListener('scroll', onScroll, { passive: true });
+      el.addEventListener("scroll", onScroll, { passive: true });
       return () => {
-        el.removeEventListener('wheel', onStart as any);
-        el.removeEventListener('mousedown', onStart as any);
-        el.removeEventListener('touchstart', onStart as any);
-        el.removeEventListener('scroll', onScroll as any);
+        el.removeEventListener("wheel", onStart as any);
+        el.removeEventListener("mousedown", onStart as any);
+        el.removeEventListener("touchstart", onStart as any);
+        el.removeEventListener("scroll", onScroll as any);
         if (timeout != null) window.clearTimeout(timeout);
       };
     };
 
-    const cleanupBase = addUserListeners(baseEl, onUserScrollStartBase, onUserScrollEndBase);
-    const cleanupComp = addUserListeners(compEl, onUserScrollStartComp, onUserScrollEndComp);
-    return () => { cleanupBase(); cleanupComp(); };
+    const cleanupBase = addUserListeners(
+      baseEl,
+      onUserScrollStartBase,
+      onUserScrollEndBase,
+    );
+    const cleanupComp = addUserListeners(
+      compEl,
+      onUserScrollStartComp,
+      onUserScrollEndComp,
+    );
+    return () => {
+      cleanupBase();
+      cleanupComp();
+    };
   }, []);
 
   // Helpers for clearer pan-edge overscroll behavior
-  const getVerticalOverflow = useCallback((rawY: number, maxY: number): number => {
-    if (rawY < 0) return rawY; // negative -> scroll up
-    if (rawY > maxY) return rawY - maxY; // positive -> scroll down
-    return 0;
-  }, []);
+  const getVerticalOverflow = useCallback(
+    (rawY: number, maxY: number): number => {
+      if (rawY < 0) return rawY; // negative -> scroll up
+      if (rawY > maxY) return rawY - maxY; // positive -> scroll down
+      return 0;
+    },
+    [],
+  );
 
   const normalizeApplyCandidate = useCallback((overflowY: number): number => {
     const DEADZONE = 32; // pixels
@@ -454,59 +564,83 @@ export const useComparePanZoom = ({
     return 0;
   }, []);
 
-  const applyIncrementalScroll = useCallback((container: HTMLDivElement, isBase: boolean, applyCandidate: number) => {
-    const STEP = 48; // pixels per incremental scroll
-    const key = isBase ? 'base' : 'comparison';
-    const deltaSinceLast = applyCandidate - edgeOverscrollRef.current[key];
-    const magnitude = Math.abs(deltaSinceLast);
-    if (magnitude < STEP) return;
+  const applyIncrementalScroll = useCallback(
+    (container: HTMLDivElement, isBase: boolean, applyCandidate: number) => {
+      const STEP = 48; // pixels per incremental scroll
+      const key = isBase ? "base" : "comparison";
+      const deltaSinceLast = applyCandidate - edgeOverscrollRef.current[key];
+      const magnitude = Math.abs(deltaSinceLast);
+      if (magnitude < STEP) return;
 
-    const stepDelta = Math.sign(deltaSinceLast) * Math.floor(magnitude / STEP) * STEP;
-    edgeOverscrollRef.current[key] += stepDelta;
+      const stepDelta =
+        Math.sign(deltaSinceLast) * Math.floor(magnitude / STEP) * STEP;
+      edgeOverscrollRef.current[key] += stepDelta;
 
-    const prevTop = container.scrollTop;
-    const nextTop = Math.max(0, Math.min(container.scrollHeight - container.clientHeight, prevTop + stepDelta));
-    if (nextTop === prevTop) return;
+      const prevTop = container.scrollTop;
+      const nextTop = Math.max(
+        0,
+        Math.min(
+          container.scrollHeight - container.clientHeight,
+          prevTop + stepDelta,
+        ),
+      );
+      if (nextTop === prevTop) return;
 
-    container.scrollTop = nextTop;
-    if (isScrollLinked) {
-      const sourceIsBase = isBase;
-      const target = isBase ? comparisonScrollRef.current : baseScrollRef.current;
-      if (target) {
-        const targetVerticalRange = Math.max(1, target.scrollHeight - target.clientHeight);
-        const mappedTop = mapScrollTopBetweenPanes(nextTop, sourceIsBase);
-        const deltaPx = sourceIsBase
-          ? scrollLinkAnchorsRef.current.deltaPixelsBaseToComp
-          : scrollLinkAnchorsRef.current.deltaPixelsCompToBase;
-        const desiredTop = Math.max(0, Math.min(targetVerticalRange, mappedTop + deltaPx));
-        target.scrollTop = desiredTop;
+      container.scrollTop = nextTop;
+      if (isScrollLinked) {
+        const sourceIsBase = isBase;
+        const target = isBase
+          ? comparisonScrollRef.current
+          : baseScrollRef.current;
+        if (target) {
+          const targetVerticalRange = Math.max(
+            1,
+            target.scrollHeight - target.clientHeight,
+          );
+          const mappedTop = mapScrollTopBetweenPanes(nextTop, sourceIsBase);
+          const deltaPx = sourceIsBase
+            ? scrollLinkAnchorsRef.current.deltaPixelsBaseToComp
+            : scrollLinkAnchorsRef.current.deltaPixelsCompToBase;
+          const desiredTop = Math.max(
+            0,
+            Math.min(targetVerticalRange, mappedTop + deltaPx),
+          );
+          target.scrollTop = desiredTop;
+        }
       }
-    }
-  }, [isScrollLinked, mapScrollTopBetweenPanes]);
+    },
+    [isScrollLinked, mapScrollTopBetweenPanes],
+  );
 
-  const handlePanEdgeOverscroll = useCallback((rawY: number, boundsMaxY: number, isBase: boolean) => {
-    const container = isBase ? baseScrollRef.current : comparisonScrollRef.current;
-    if (!container) return;
-    const overflowY = getVerticalOverflow(rawY, boundsMaxY);
-    const applyCandidate = normalizeApplyCandidate(overflowY);
-    if (applyCandidate !== 0) {
-      applyIncrementalScroll(container, isBase, applyCandidate);
-    } else {
-      // Reset accumulator when back within deadzone
-      edgeOverscrollRef.current[isBase ? 'base' : 'comparison'] = 0;
-    }
-  }, [applyIncrementalScroll, getVerticalOverflow, normalizeApplyCandidate]);
+  const handlePanEdgeOverscroll = useCallback(
+    (rawY: number, boundsMaxY: number, isBase: boolean) => {
+      const container = isBase
+        ? baseScrollRef.current
+        : comparisonScrollRef.current;
+      if (!container) return;
+      const overflowY = getVerticalOverflow(rawY, boundsMaxY);
+      const applyCandidate = normalizeApplyCandidate(overflowY);
+      if (applyCandidate !== 0) {
+        applyIncrementalScroll(container, isBase, applyCandidate);
+      } else {
+        // Reset accumulator when back within deadzone
+        edgeOverscrollRef.current[isBase ? "base" : "comparison"] = 0;
+      }
+    },
+    [applyIncrementalScroll, getVerticalOverflow, normalizeApplyCandidate],
+  );
 
   const beginPan = useCallback(
     (pane: Pane, event: ReactMouseEvent<HTMLDivElement>) => {
       if (!isPanMode) return;
-      const zoom = pane === 'base' ? baseZoom : comparisonZoom;
+      const zoom = pane === "base" ? baseZoom : comparisonZoom;
       if (zoom <= 1) return;
-      const container = pane === 'base' ? baseScrollRef.current : comparisonScrollRef.current;
+      const container =
+        pane === "base" ? baseScrollRef.current : comparisonScrollRef.current;
       if (!container) return;
 
       const targetEl = event.target as HTMLElement | null;
-      const isOnImage = !!targetEl?.closest('.compare-diff-page__inner');
+      const isOnImage = !!targetEl?.closest(".compare-diff-page__inner");
       if (!isOnImage) return;
 
       event.preventDefault();
@@ -515,16 +649,16 @@ export const useComparePanZoom = ({
         source: pane,
         startX: event.clientX,
         startY: event.clientY,
-        startPanX: pane === 'base' ? basePan.x : comparisonPan.x,
-        startPanY: pane === 'base' ? basePan.y : comparisonPan.y,
-        targetStartPanX: pane === 'base' ? comparisonPan.x : basePan.x,
-        targetStartPanY: pane === 'base' ? comparisonPan.y : basePan.y,
+        startPanX: pane === "base" ? basePan.x : comparisonPan.x,
+        startPanY: pane === "base" ? basePan.y : comparisonPan.y,
+        targetStartPanX: pane === "base" ? comparisonPan.x : basePan.x,
+        targetStartPanY: pane === "base" ? comparisonPan.y : basePan.y,
       };
       edgeOverscrollRef.current[pane] = 0;
       lastActivePaneRef.current = pane;
-      (container as HTMLDivElement).style.cursor = 'grabbing';
+      (container as HTMLDivElement).style.cursor = "grabbing";
     },
-    [isPanMode, baseZoom, comparisonZoom, basePan, comparisonPan]
+    [isPanMode, baseZoom, comparisonZoom, basePan, comparisonPan],
   );
 
   const continuePan = useCallback(
@@ -536,7 +670,7 @@ export const useComparePanZoom = ({
       const dx = event.clientX - drag.startX;
       const dy = event.clientY - drag.startY;
 
-      const isBase = drag.source === 'base';
+      const isBase = drag.source === "base";
       const bounds = getPanBounds(drag.source);
       const rawX = drag.startPanX - dx;
       const rawY = drag.startPanY - dy;
@@ -554,16 +688,23 @@ export const useComparePanZoom = ({
         setComparisonPan(desired);
       }
     },
-    [getPanBounds, isPanMode, isScrollLinked, mapPanBetweenOrientations]
+    [getPanBounds, isPanMode, isScrollLinked, mapPanBetweenOrientations],
   );
 
   const endPan = useCallback(() => {
     const drag = panDragRef.current;
     if (!drag.active) return;
-    const sourceEl = drag.source === 'base' ? baseScrollRef.current : comparisonScrollRef.current;
+    const sourceEl =
+      drag.source === "base"
+        ? baseScrollRef.current
+        : comparisonScrollRef.current;
     if (sourceEl) {
-      const zoom = drag.source === 'base' ? baseZoom : comparisonZoom;
-      (sourceEl as HTMLDivElement).style.cursor = isPanMode ? (zoom > 1 ? 'grab' : 'auto') : '';
+      const zoom = drag.source === "base" ? baseZoom : comparisonZoom;
+      (sourceEl as HTMLDivElement).style.cursor = isPanMode
+        ? zoom > 1
+          ? "grab"
+          : "auto"
+        : "";
     }
     panDragRef.current.active = false;
     panDragRef.current.source = null;
@@ -573,7 +714,7 @@ export const useComparePanZoom = ({
     (pane: Pane, event: ReactWheelEvent<HTMLDivElement>) => {
       if (!event.ctrlKey) return;
       event.preventDefault();
-      const key = pane === 'base' ? 'base' : 'comparison';
+      const key = pane === "base" ? "base" : "comparison";
       const accum = wheelZoomAccumRef.current;
       const threshold = 180;
       accum[key] += event.deltaY;
@@ -584,33 +725,34 @@ export const useComparePanZoom = ({
       const applySteps = (zoom: number) => {
         let next = zoom;
         for (let i = 0; i < steps; i += 1) {
-          next = direction > 0
-            ? Math.min(ZOOM_MAX, +(next + ZOOM_STEP).toFixed(2))
-            : Math.max(ZOOM_MIN, +(next - ZOOM_STEP).toFixed(2));
+          next =
+            direction > 0
+              ? Math.min(ZOOM_MAX, +(next + ZOOM_STEP).toFixed(2))
+              : Math.max(ZOOM_MIN, +(next - ZOOM_STEP).toFixed(2));
         }
         return next;
       };
-      if (pane === 'base') {
+      if (pane === "base") {
         const prev = baseZoom;
         const next = applySteps(prev);
         setBaseZoom(next);
         if (next < prev) {
-          centerPanForZoom('base', next);
+          centerPanForZoom("base", next);
         } else {
-          clampPanForZoom('base', next);
+          clampPanForZoom("base", next);
         }
       } else {
         const prev = comparisonZoom;
         const next = applySteps(prev);
         setComparisonZoom(next);
         if (next < prev) {
-          centerPanForZoom('comparison', next);
+          centerPanForZoom("comparison", next);
         } else {
-          clampPanForZoom('comparison', next);
+          clampPanForZoom("comparison", next);
         }
       }
     },
-    [baseZoom, clampPanForZoom, centerPanForZoom, comparisonZoom]
+    [baseZoom, clampPanForZoom, centerPanForZoom, comparisonZoom],
   );
 
   // When the source pane hits its scroll limit but the peer still has room,
@@ -620,25 +762,36 @@ export const useComparePanZoom = ({
       if (event.ctrlKey) return; // handled by zoom handler
       if (!isScrollLinked) return;
 
-      const source = pane === 'base' ? baseScrollRef.current : comparisonScrollRef.current;
-      const target = pane === 'base' ? comparisonScrollRef.current : baseScrollRef.current;
+      const source =
+        pane === "base" ? baseScrollRef.current : comparisonScrollRef.current;
+      const target =
+        pane === "base" ? comparisonScrollRef.current : baseScrollRef.current;
       if (!source || !target) return;
 
       const deltaY = event.deltaY;
       if (deltaY === 0) return;
 
       const sourceMax = Math.max(0, source.scrollHeight - source.clientHeight);
-      const nextSource = Math.max(0, Math.min(sourceMax, source.scrollTop + deltaY));
+      const nextSource = Math.max(
+        0,
+        Math.min(sourceMax, source.scrollTop + deltaY),
+      );
 
       // If the source can scroll, let the normal scroll event drive syncing
       if (nextSource !== source.scrollTop) return;
 
       // Source is at a bound; push mapped delta into the target
-      const sourceIsBase = pane === 'base';
+      const sourceIsBase = pane === "base";
 
       // Map the desired new source position (scrollTop + deltaY) into target space
-      const mappedBefore = mapScrollTopBetweenPanes(source.scrollTop, sourceIsBase);
-      const mappedAfter = mapScrollTopBetweenPanes(source.scrollTop + deltaY, sourceIsBase);
+      const mappedBefore = mapScrollTopBetweenPanes(
+        source.scrollTop,
+        sourceIsBase,
+      );
+      const mappedAfter = mapScrollTopBetweenPanes(
+        source.scrollTop + deltaY,
+        sourceIsBase,
+      );
       const mappedDelta = mappedAfter - mappedBefore;
 
       // Include the pixel anchor captured when linking
@@ -647,12 +800,18 @@ export const useComparePanZoom = ({
         : scrollLinkAnchorsRef.current.deltaPixelsCompToBase;
 
       const targetMax = Math.max(0, target.scrollHeight - target.clientHeight);
-      const desired = Math.max(0, Math.min(targetMax, target.scrollTop + (mappedDelta || deltaY)));
+      const desired = Math.max(
+        0,
+        Math.min(targetMax, target.scrollTop + (mappedDelta || deltaY)),
+      );
 
       if (desired !== target.scrollTop) {
         isSyncingRef.current = true;
         // Adjust relative to mapped space to keep the anchor consistent
-        const anchored = Math.max(0, Math.min(targetMax, mappedBefore + deltaPx + (mappedDelta || deltaY)));
+        const anchored = Math.max(
+          0,
+          Math.min(targetMax, mappedBefore + deltaPx + (mappedDelta || deltaY)),
+        );
         target.scrollTop = anchored;
         requestAnimationFrame(() => {
           isSyncingRef.current = false;
@@ -660,7 +819,7 @@ export const useComparePanZoom = ({
         event.preventDefault();
       }
     },
-    [isScrollLinked, mapScrollTopBetweenPanes]
+    [isScrollLinked, mapScrollTopBetweenPanes],
   );
 
   const onTouchStart = useCallback(
@@ -673,15 +832,15 @@ export const useComparePanZoom = ({
           active: true,
           pane,
           startDistance: Math.hypot(dx, dy),
-          startZoom: pane === 'base' ? baseZoom : comparisonZoom,
+          startZoom: pane === "base" ? baseZoom : comparisonZoom,
         };
         event.preventDefault();
       } else if (event.touches.length === 1) {
         if (!isPanMode) return;
-        const zoom = pane === 'base' ? baseZoom : comparisonZoom;
+        const zoom = pane === "base" ? baseZoom : comparisonZoom;
         if (zoom <= 1) return;
         const targetEl = event.target as HTMLElement | null;
-        const isOnImage = !!targetEl?.closest('.compare-diff-page__inner');
+        const isOnImage = !!targetEl?.closest(".compare-diff-page__inner");
         if (!isOnImage) return;
         const touch = event.touches[0];
         panDragRef.current = {
@@ -689,16 +848,16 @@ export const useComparePanZoom = ({
           source: pane,
           startX: touch.clientX,
           startY: touch.clientY,
-          startPanX: pane === 'base' ? basePan.x : comparisonPan.x,
-          startPanY: pane === 'base' ? basePan.y : comparisonPan.y,
-          targetStartPanX: pane === 'base' ? comparisonPan.x : basePan.x,
-          targetStartPanY: pane === 'base' ? comparisonPan.y : basePan.y,
+          startPanX: pane === "base" ? basePan.x : comparisonPan.x,
+          startPanY: pane === "base" ? basePan.y : comparisonPan.y,
+          targetStartPanX: pane === "base" ? comparisonPan.x : basePan.x,
+          targetStartPanY: pane === "base" ? comparisonPan.y : basePan.y,
         };
         edgeOverscrollRef.current[pane] = 0;
         event.preventDefault();
       }
     },
-    [basePan, baseZoom, comparisonPan, comparisonZoom, isPanMode]
+    [basePan, baseZoom, comparisonPan, comparisonZoom, isPanMode],
   );
 
   const onTouchMove = useCallback(
@@ -712,21 +871,24 @@ export const useComparePanZoom = ({
         const dampened = 1 + (scale - 1) * 0.6;
         const pane = pinchRef.current.pane!;
         const startZoom = pinchRef.current.startZoom;
-        const previousZoom = pane === 'base' ? baseZoom : comparisonZoom;
-        const nextZoom = Math.max(ZOOM_MIN, Math.min(ZOOM_MAX, +(startZoom * dampened).toFixed(2)));
-        if (pane === 'base') {
+        const previousZoom = pane === "base" ? baseZoom : comparisonZoom;
+        const nextZoom = Math.max(
+          ZOOM_MIN,
+          Math.min(ZOOM_MAX, +(startZoom * dampened).toFixed(2)),
+        );
+        if (pane === "base") {
           setBaseZoom(nextZoom);
           if (nextZoom < previousZoom) {
-            centerPanForZoom('base', nextZoom);
+            centerPanForZoom("base", nextZoom);
           } else if (nextZoom > previousZoom) {
-            clampPanForZoom('base', nextZoom);
+            clampPanForZoom("base", nextZoom);
           }
         } else {
           setComparisonZoom(nextZoom);
           if (nextZoom < previousZoom) {
-            centerPanForZoom('comparison', nextZoom);
+            centerPanForZoom("comparison", nextZoom);
           } else if (nextZoom > previousZoom) {
-            clampPanForZoom('comparison', nextZoom);
+            clampPanForZoom("comparison", nextZoom);
           }
         }
         event.preventDefault();
@@ -737,7 +899,7 @@ export const useComparePanZoom = ({
         const touch = event.touches[0];
         const dx = touch.clientX - panDragRef.current.startX;
         const dy = touch.clientY - panDragRef.current.startY;
-        const isBase = panDragRef.current.source === 'base';
+        const isBase = panDragRef.current.source === "base";
         const bounds = getPanBounds(panDragRef.current.source!);
         const rawX = panDragRef.current.startPanX - dx;
         const rawY = panDragRef.current.startPanY - dy;
@@ -755,7 +917,15 @@ export const useComparePanZoom = ({
         event.preventDefault();
       }
     },
-    [baseZoom, clampPanForZoom, centerPanForZoom, comparisonZoom, getPanBounds, isScrollLinked, mapPanBetweenOrientations]
+    [
+      baseZoom,
+      clampPanForZoom,
+      centerPanForZoom,
+      comparisonZoom,
+      getPanBounds,
+      isScrollLinked,
+      mapPanBetweenOrientations,
+    ],
   );
 
   const onTouchEnd = useCallback(() => {
@@ -774,31 +944,52 @@ export const useComparePanZoom = ({
   // the follower continues tracking instead of getting stuck at its prior max.
   useEffect(() => {
     if (!isScrollLinked) return;
-    const sourceIsBase = lastActivePaneRef.current === 'base';
-    const source = sourceIsBase ? baseScrollRef.current : comparisonScrollRef.current;
-    const target = sourceIsBase ? comparisonScrollRef.current : baseScrollRef.current;
+    const sourceIsBase = lastActivePaneRef.current === "base";
+    const source = sourceIsBase
+      ? baseScrollRef.current
+      : comparisonScrollRef.current;
+    const target = sourceIsBase
+      ? comparisonScrollRef.current
+      : baseScrollRef.current;
     if (!source || !target) return;
 
     const mappedTop = mapScrollTopBetweenPanes(source.scrollTop, sourceIsBase);
     const deltaPx = sourceIsBase
       ? scrollLinkAnchorsRef.current.deltaPixelsBaseToComp
       : scrollLinkAnchorsRef.current.deltaPixelsCompToBase;
-    const targetVerticalRange = Math.max(1, target.scrollHeight - target.clientHeight);
-    const desiredTop = Math.max(0, Math.min(targetVerticalRange, mappedTop + deltaPx));
+    const targetVerticalRange = Math.max(
+      1,
+      target.scrollHeight - target.clientHeight,
+    );
+    const desiredTop = Math.max(
+      0,
+      Math.min(targetVerticalRange, mappedTop + deltaPx),
+    );
 
     if (Math.abs(target.scrollTop - desiredTop) > 1) {
       isSyncingRef.current = true;
       target.scrollTop = desiredTop;
-      requestAnimationFrame(() => { isSyncingRef.current = false; });
+      requestAnimationFrame(() => {
+        isSyncingRef.current = false;
+      });
     }
-  }, [basePages.length, comparisonPages.length, isScrollLinked, mapScrollTopBetweenPanes]);
+  }, [
+    basePages.length,
+    comparisonPages.length,
+    isScrollLinked,
+    mapScrollTopBetweenPanes,
+  ]);
 
   useEffect(() => {
     const onKeyDown = (event: KeyboardEvent) => {
       if (isScrollLinked) return;
       const target = event.target as HTMLElement | null;
-      const tag = (target?.tagName || '').toLowerCase();
-      const isEditable = target && (tag === 'input' || tag === 'textarea' || target.getAttribute('contenteditable') === 'true');
+      const tag = (target?.tagName || "").toLowerCase();
+      const isEditable =
+        target &&
+        (tag === "input" ||
+          tag === "textarea" ||
+          target.getAttribute("contenteditable") === "true");
       if (isEditable) return;
 
       const baseEl = baseScrollRef.current;
@@ -806,19 +997,31 @@ export const useComparePanZoom = ({
       if (!baseEl || !compEl) return;
 
       const STEP = 80;
-      if (event.key === 'ArrowDown' || event.key === 'ArrowUp') {
+      if (event.key === "ArrowDown" || event.key === "ArrowUp") {
         event.preventDefault();
-        const delta = event.key === 'ArrowDown' ? STEP : -STEP;
+        const delta = event.key === "ArrowDown" ? STEP : -STEP;
         isSyncingRef.current = true;
-        baseEl.scrollTop = Math.max(0, Math.min(baseEl.scrollTop + delta, baseEl.scrollHeight - baseEl.clientHeight));
-        compEl.scrollTop = Math.max(0, Math.min(compEl.scrollTop + delta, compEl.scrollHeight - compEl.clientHeight));
+        baseEl.scrollTop = Math.max(
+          0,
+          Math.min(
+            baseEl.scrollTop + delta,
+            baseEl.scrollHeight - baseEl.clientHeight,
+          ),
+        );
+        compEl.scrollTop = Math.max(
+          0,
+          Math.min(
+            compEl.scrollTop + delta,
+            compEl.scrollHeight - compEl.clientHeight,
+          ),
+        );
         requestAnimationFrame(() => {
           isSyncingRef.current = false;
         });
       }
     };
-    window.addEventListener('keydown', onKeyDown);
-    return () => window.removeEventListener('keydown', onKeyDown);
+    window.addEventListener("keydown", onKeyDown);
+    return () => window.removeEventListener("keydown", onKeyDown);
   }, [isScrollLinked]);
 
   const captureScrollLinkDelta = useCallback(() => {
@@ -826,7 +1029,10 @@ export const useComparePanZoom = ({
     const compEl = comparisonScrollRef.current;
     if (!baseEl || !compEl) {
       scrollLinkDeltaRef.current = { vertical: 0, horizontal: 0 };
-      scrollLinkAnchorsRef.current = { deltaPixelsBaseToComp: 0, deltaPixelsCompToBase: 0 };
+      scrollLinkAnchorsRef.current = {
+        deltaPixelsBaseToComp: 0,
+        deltaPixelsCompToBase: 0,
+      };
       return;
     }
     const baseVMax = Math.max(1, baseEl.scrollHeight - baseEl.clientHeight);
@@ -855,10 +1061,16 @@ export const useComparePanZoom = ({
 
   const clearScrollLinkDelta = useCallback(() => {
     scrollLinkDeltaRef.current = { vertical: 0, horizontal: 0 };
-    scrollLinkAnchorsRef.current = { deltaPixelsBaseToComp: 0, deltaPixelsCompToBase: 0 };
+    scrollLinkAnchorsRef.current = {
+      deltaPixelsBaseToComp: 0,
+      deltaPixelsCompToBase: 0,
+    };
   }, []);
 
-  const zoomLimits = useMemo(() => ({ min: ZOOM_MIN, max: ZOOM_MAX, step: ZOOM_STEP }), []);
+  const zoomLimits = useMemo(
+    () => ({ min: ZOOM_MIN, max: ZOOM_MAX, step: ZOOM_STEP }),
+    [],
+  );
 
   return {
     layout,
diff --git a/frontend/src/core/components/tools/compare/hooks/useCompareRightRailButtons.tsx b/frontend/src/core/components/tools/compare/hooks/useCompareRightRailButtons.tsx
index 525957d95f..273535a05f 100644
--- a/frontend/src/core/components/tools/compare/hooks/useCompareRightRailButtons.tsx
+++ b/frontend/src/core/components/tools/compare/hooks/useCompareRightRailButtons.tsx
@@ -1,16 +1,16 @@
-import { useMemo } from 'react';
-import type React from 'react';
-import { useTranslation } from 'react-i18next';
-import LocalIcon from '@app/components/shared/LocalIcon';
-import { alert } from '@app/components/toast';
-import type { ToastLocation } from '@app/components/toast/types';
-import type { RightRailButtonWithAction } from '@app/hooks/useRightRailButtons';
-import { useIsMobile } from '@app/hooks/useIsMobile';
+import { useMemo } from "react";
+import type React from "react";
+import { useTranslation } from "react-i18next";
+import LocalIcon from "@app/components/shared/LocalIcon";
+import { alert } from "@app/components/toast";
+import type { ToastLocation } from "@app/components/toast/types";
+import type { RightRailButtonWithAction } from "@app/hooks/useRightRailButtons";
+import { useIsMobile } from "@app/hooks/useIsMobile";
 
-type Pane = 'base' | 'comparison';
+type Pane = "base" | "comparison";
 
 export interface UseCompareRightRailButtonsOptions {
-  layout: 'side-by-side' | 'stacked';
+  layout: "side-by-side" | "stacked";
   toggleLayout: () => void;
   isPanMode: boolean;
   setIsPanMode: (value: boolean) => void;
@@ -53,140 +53,165 @@ export const useCompareRightRailButtons = ({
   const { t, i18n } = useTranslation();
   const isMobile = useIsMobile();
 
-  return useMemo<RightRailButtonWithAction[]>(() => [
-    {
-      id: 'compare-toggle-layout',
-      icon: (
-        <LocalIcon
-          icon={layout === 'side-by-side' ? 'vertical-split-rounded' : 'horizontal-split-rounded'}
-          width="1.5rem"
-          height="1.5rem"
-        />
-      ),
-      tooltip: layout === 'side-by-side'
-        ? t('compare.actions.stackVertically', 'Stack vertically')
-        : t('compare.actions.placeSideBySide', 'Place side by side'),
-      ariaLabel: layout === 'side-by-side'
-        ? t('compare.actions.stackVertically', 'Stack vertically')
-        : t('compare.actions.placeSideBySide', 'Place side by side'),
-      section: 'top',
-      order: 10,
-      onClick: toggleLayout,
-    },
-    {
-      id: 'compare-zoom-out',
-      icon: <LocalIcon icon="zoom-out" width="1.5rem" height="1.5rem" />,
-      tooltip: t('compare.actions.zoomOut', 'Zoom out'),
-      ariaLabel: t('compare.actions.zoomOut', 'Zoom out'),
-      section: 'top',
-      order: 13,
-      onClick: () => {
-        const { min, step } = zoomLimits;
-        const nextBase = Math.max(min, +(baseZoom - step).toFixed(2));
-        const nextComparison = Math.max(min, +(comparisonZoom - step).toFixed(2));
-        setBaseZoom(nextBase);
-        setComparisonZoom(nextComparison);
-        centerPanForZoom('base', nextBase);
-        centerPanForZoom('comparison', nextComparison);
+  return useMemo<RightRailButtonWithAction[]>(
+    () => [
+      {
+        id: "compare-toggle-layout",
+        icon: (
+          <LocalIcon
+            icon={
+              layout === "side-by-side"
+                ? "vertical-split-rounded"
+                : "horizontal-split-rounded"
+            }
+            width="1.5rem"
+            height="1.5rem"
+          />
+        ),
+        tooltip:
+          layout === "side-by-side"
+            ? t("compare.actions.stackVertically", "Stack vertically")
+            : t("compare.actions.placeSideBySide", "Place side by side"),
+        ariaLabel:
+          layout === "side-by-side"
+            ? t("compare.actions.stackVertically", "Stack vertically")
+            : t("compare.actions.placeSideBySide", "Place side by side"),
+        section: "top",
+        order: 10,
+        onClick: toggleLayout,
       },
-    },
-    {
-      id: 'compare-zoom-in',
-      icon: <LocalIcon icon="zoom-in" width="1.5rem" height="1.5rem" />,
-      tooltip: t('compare.actions.zoomIn', 'Zoom in'),
-      ariaLabel: t('compare.actions.zoomIn', 'Zoom in'),
-      section: 'top',
-      order: 14,
-      onClick: () => {
-        const { max, step } = zoomLimits;
-        const nextBase = Math.min(max, +(baseZoom + step).toFixed(2));
-        const nextComparison = Math.min(max, +(comparisonZoom + step).toFixed(2));
-        setBaseZoom(nextBase);
-        setComparisonZoom(nextComparison);
-        clampPanForZoom('base', nextBase);
-        clampPanForZoom('comparison', nextComparison);
+      {
+        id: "compare-zoom-out",
+        icon: <LocalIcon icon="zoom-out" width="1.5rem" height="1.5rem" />,
+        tooltip: t("compare.actions.zoomOut", "Zoom out"),
+        ariaLabel: t("compare.actions.zoomOut", "Zoom out"),
+        section: "top",
+        order: 13,
+        onClick: () => {
+          const { min, step } = zoomLimits;
+          const nextBase = Math.max(min, +(baseZoom - step).toFixed(2));
+          const nextComparison = Math.max(
+            min,
+            +(comparisonZoom - step).toFixed(2),
+          );
+          setBaseZoom(nextBase);
+          setComparisonZoom(nextComparison);
+          centerPanForZoom("base", nextBase);
+          centerPanForZoom("comparison", nextComparison);
+        },
       },
-    },
-    {
-      id: 'compare-reset-view',
-      icon: <LocalIcon icon="refresh-rounded" width="1.5rem" height="1.5rem" />,
-      tooltip: t('compare.actions.resetView', 'Reset zoom and pan'),
-      ariaLabel: t('compare.actions.resetView', 'Reset zoom and pan'),
-      section: 'top',
-      order: 14.5,
-      disabled: baseZoom === 1 && comparisonZoom === 1,
-      onClick: () => {
-        setBaseZoom(1);
-        setComparisonZoom(1);
-    setPanToTopLeft('base');
-    setPanToTopLeft('comparison');
-        clearScrollLinkDelta();
-        // Reset scrollTop for both panes to realign view
-        if (baseScrollRef?.current) {
-          baseScrollRef.current.scrollTop = 0;
-        }
-        if (comparisonScrollRef?.current) {
-          comparisonScrollRef.current.scrollTop = 0;
-        }
+      {
+        id: "compare-zoom-in",
+        icon: <LocalIcon icon="zoom-in" width="1.5rem" height="1.5rem" />,
+        tooltip: t("compare.actions.zoomIn", "Zoom in"),
+        ariaLabel: t("compare.actions.zoomIn", "Zoom in"),
+        section: "top",
+        order: 14,
+        onClick: () => {
+          const { max, step } = zoomLimits;
+          const nextBase = Math.min(max, +(baseZoom + step).toFixed(2));
+          const nextComparison = Math.min(
+            max,
+            +(comparisonZoom + step).toFixed(2),
+          );
+          setBaseZoom(nextBase);
+          setComparisonZoom(nextComparison);
+          clampPanForZoom("base", nextBase);
+          clampPanForZoom("comparison", nextComparison);
+        },
       },
-    },
-    {
-      id: 'compare-toggle-scroll-link',
-      icon: (
-        <LocalIcon
-          icon={isScrollLinked ? 'link-rounded' : 'link-off-rounded'}
-          width="1.5rem"
-          height="1.5rem"
-        />
-      ),
-      tooltip: isScrollLinked
-        ? t('compare.actions.unlinkScroll', 'Unlink scroll')
-        : t('compare.actions.linkScroll', 'Link scroll'),
-      ariaLabel: isScrollLinked
-        ? t('compare.actions.unlinkScroll', 'Unlink scroll')
-        : t('compare.actions.linkScroll', 'Link scroll'),
-      section: 'top',
-      order: 15,
-      onClick: () => {
-        const next = !isScrollLinked;
-        if (next) {
-          captureScrollLinkDelta();
-        } else {
-          if (!isMobile) {
-            alert({
-              alertType: 'neutral',
-              title: t('compare.toasts.unlinkedTitle', 'Independent scroll enabled'),
-              body: t('compare.toasts.unlinkedBody', 'Tip: Arrow Up/Down scroll both panes when unlinked is off.'),
-              durationMs: 5000,
-              location: 'bottom-center' as ToastLocation,
-              expandable: false,
-            });
+      {
+        id: "compare-reset-view",
+        icon: (
+          <LocalIcon icon="refresh-rounded" width="1.5rem" height="1.5rem" />
+        ),
+        tooltip: t("compare.actions.resetView", "Reset zoom and pan"),
+        ariaLabel: t("compare.actions.resetView", "Reset zoom and pan"),
+        section: "top",
+        order: 14.5,
+        disabled: baseZoom === 1 && comparisonZoom === 1,
+        onClick: () => {
+          setBaseZoom(1);
+          setComparisonZoom(1);
+          setPanToTopLeft("base");
+          setPanToTopLeft("comparison");
+          clearScrollLinkDelta();
+          // Reset scrollTop for both panes to realign view
+          if (baseScrollRef?.current) {
+            baseScrollRef.current.scrollTop = 0;
           }
-        }
-        setIsScrollLinked(next);
+          if (comparisonScrollRef?.current) {
+            comparisonScrollRef.current.scrollTop = 0;
+          }
+        },
       },
-    },
-  ], [
-    layout,
-    toggleLayout,
-    isPanMode,
-    setIsPanMode,
-    baseZoom,
-    comparisonZoom,
-    setBaseZoom,
-    setComparisonZoom,
-    centerPanForZoom,
-    clampPanForZoom,
-  setPanToTopLeft,
-    clearScrollLinkDelta,
-    captureScrollLinkDelta,
-    isScrollLinked,
-    setIsScrollLinked,
-    zoomLimits,
-    t,
-    i18n.language,
-    isMobile,
-  ]);
+      {
+        id: "compare-toggle-scroll-link",
+        icon: (
+          <LocalIcon
+            icon={isScrollLinked ? "link-rounded" : "link-off-rounded"}
+            width="1.5rem"
+            height="1.5rem"
+          />
+        ),
+        tooltip: isScrollLinked
+          ? t("compare.actions.unlinkScroll", "Unlink scroll")
+          : t("compare.actions.linkScroll", "Link scroll"),
+        ariaLabel: isScrollLinked
+          ? t("compare.actions.unlinkScroll", "Unlink scroll")
+          : t("compare.actions.linkScroll", "Link scroll"),
+        section: "top",
+        order: 15,
+        onClick: () => {
+          const next = !isScrollLinked;
+          if (next) {
+            captureScrollLinkDelta();
+          } else {
+            if (!isMobile) {
+              alert({
+                alertType: "neutral",
+                title: t(
+                  "compare.toasts.unlinkedTitle",
+                  "Independent scroll enabled",
+                ),
+                body: t(
+                  "compare.toasts.unlinkedBody",
+                  "Tip: Arrow Up/Down scroll both panes when unlinked is off.",
+                ),
+                durationMs: 5000,
+                location: "bottom-center" as ToastLocation,
+                expandable: false,
+              });
+            }
+          }
+          setIsScrollLinked(next);
+        },
+      },
+    ],
+    [
+      layout,
+      toggleLayout,
+      isPanMode,
+      setIsPanMode,
+      baseZoom,
+      comparisonZoom,
+      setBaseZoom,
+      setComparisonZoom,
+      centerPanForZoom,
+      clampPanForZoom,
+      setPanToTopLeft,
+      clearScrollLinkDelta,
+      captureScrollLinkDelta,
+      isScrollLinked,
+      setIsScrollLinked,
+      zoomLimits,
+      t,
+      i18n.language,
+      isMobile,
+    ],
+  );
 };
 
-export type UseCompareRightRailButtonsReturn = ReturnType<typeof useCompareRightRailButtons>;
+export type UseCompareRightRailButtonsReturn = ReturnType<
+  typeof useCompareRightRailButtons
+>;
diff --git a/frontend/src/core/components/tools/compress/CompressSettings.tsx b/frontend/src/core/components/tools/compress/CompressSettings.tsx
index a7f9949b7c..a49b075f66 100644
--- a/frontend/src/core/components/tools/compress/CompressSettings.tsx
+++ b/frontend/src/core/components/tools/compress/CompressSettings.tsx
@@ -1,5 +1,16 @@
-import { Stack, Text, NumberInput, Select, Divider, Checkbox, Slider, SegmentedControl, Tooltip, Box } from "@mantine/core";
-import SliderWithInput from '@app/components/shared/sliderWithInput/SliderWithInput';
+import {
+  Stack,
+  Text,
+  NumberInput,
+  Select,
+  Divider,
+  Checkbox,
+  Slider,
+  SegmentedControl,
+  Tooltip,
+  Box,
+} from "@mantine/core";
+import SliderWithInput from "@app/components/shared/sliderWithInput/SliderWithInput";
 import { useTranslation } from "react-i18next";
 import { CompressParameters } from "@app/hooks/tools/compress/useCompressParameters";
 import ButtonSelector from "@app/components/shared/ButtonSelector";
@@ -8,38 +19,53 @@ import { Z_INDEX_AUTOMATE_DROPDOWN } from "@app/styles/zIndex";
 
 interface CompressSettingsProps {
   parameters: CompressParameters;
-  onParameterChange: <K extends keyof CompressParameters>(key: K, value: CompressParameters[K]) => void;
+  onParameterChange: <K extends keyof CompressParameters>(
+    key: K,
+    value: CompressParameters[K],
+  ) => void;
   disabled?: boolean;
 }
 
-const CompressSettings = ({ parameters, onParameterChange, disabled = false }: CompressSettingsProps) => {
+const CompressSettings = ({
+  parameters,
+  onParameterChange,
+  disabled = false,
+}: CompressSettingsProps) => {
   const { t } = useTranslation();
-  const { enabled: imageMagickAvailable, unavailableReason: imageMagickReason } = useGroupEnabled('ImageMagick');
+  const {
+    enabled: imageMagickAvailable,
+    unavailableReason: imageMagickReason,
+  } = useGroupEnabled("ImageMagick");
 
   return (
     <Stack gap="md">
-
-      <Divider ml='-md'></Divider>
+      <Divider ml="-md"></Divider>
       {/* Compression Method */}
       <ButtonSelector
-        label={t('compress.method.title', 'Compression Method')}
+        label={t("compress.method.title", "Compression Method")}
         value={parameters.compressionMethod}
-        onChange={(value) => onParameterChange('compressionMethod', value)}
+        onChange={(value) => onParameterChange("compressionMethod", value)}
         options={[
-          { value: 'quality', label: t('compress.method.quality', 'Quality') },
-          { value: 'filesize', label: t('compress.method.filesize', 'File Size') },
+          { value: "quality", label: t("compress.method.quality", "Quality") },
+          {
+            value: "filesize",
+            label: t("compress.method.filesize", "File Size"),
+          },
         ]}
         disabled={disabled}
       />
 
       {/* Quality Adjustment */}
-      {parameters.compressionMethod === 'quality' && (
+      {parameters.compressionMethod === "quality" && (
         <Stack gap="md">
           <Divider />
           <SliderWithInput
-            label={t('compress.tooltip.qualityAdjustment.title', 'Compression Level')}
+            label={t(
+              "compress.tooltip.qualityAdjustment.title",
+              "Compression Level",
+            )}
             value={parameters.compressionLevel}
-            onChange={(value) => onParameterChange('compressionLevel', value)}
+            onChange={(value) => onParameterChange("compressionLevel", value)}
             disabled={disabled}
             min={1}
             max={9}
@@ -47,24 +73,41 @@ const CompressSettings = ({ parameters, onParameterChange, disabled = false }: C
             suffix=""
           />
           <Text size="xs" c="dimmed" mt={-4}>
-            {parameters.compressionLevel <= 3 && t('compress.compressionLevel.range1to3', 'Lower values preserve quality but result in larger files')}
-            {parameters.compressionLevel >= 4 && parameters.compressionLevel <= 6 && t('compress.compressionLevel.range4to6', 'Medium compression with moderate quality reduction')}
-            {parameters.compressionLevel >= 7 && t('compress.compressionLevel.range7to9', 'Higher values reduce file size significantly but may reduce image clarity')}
+            {parameters.compressionLevel <= 3 &&
+              t(
+                "compress.compressionLevel.range1to3",
+                "Lower values preserve quality but result in larger files",
+              )}
+            {parameters.compressionLevel >= 4 &&
+              parameters.compressionLevel <= 6 &&
+              t(
+                "compress.compressionLevel.range4to6",
+                "Medium compression with moderate quality reduction",
+              )}
+            {parameters.compressionLevel >= 7 &&
+              t(
+                "compress.compressionLevel.range7to9",
+                "Higher values reduce file size significantly but may reduce image clarity",
+              )}
           </Text>
         </Stack>
       )}
 
-      <Divider/>
+      <Divider />
 
       {/* File Size Input */}
-      {parameters.compressionMethod === 'filesize' && (
+      {parameters.compressionMethod === "filesize" && (
         <Stack gap="sm">
-          <Text size="sm" fw={500}>Desired File Size</Text>
-          <div style={{ display: 'flex', gap: '8px', alignItems: 'flex-end' }}>
+          <Text size="sm" fw={500}>
+            Desired File Size
+          </Text>
+          <div style={{ display: "flex", gap: "8px", alignItems: "flex-end" }}>
             <NumberInput
               placeholder="Enter size"
               value={parameters.fileSizeValue}
-              onChange={(value) => onParameterChange('fileSizeValue', value?.toString() || '')}
+              onChange={(value) =>
+                onParameterChange("fileSizeValue", value?.toString() || "")
+              }
               min={0}
               disabled={disabled}
               style={{ flex: 1 }}
@@ -74,16 +117,19 @@ const CompressSettings = ({ parameters, onParameterChange, disabled = false }: C
               onChange={(value) => {
                 // Prevent deselection - if value is null/undefined, keep the current value
                 if (value) {
-                  onParameterChange('fileSizeUnit', value as 'KB' | 'MB');
+                  onParameterChange("fileSizeUnit", value as "KB" | "MB");
                 }
               }}
               disabled={disabled}
               data={[
-                { value: 'KB', label: 'KB' },
-                { value: 'MB', label: 'MB' }
+                { value: "KB", label: "KB" },
+                { value: "MB", label: "MB" },
               ]}
-              style={{ width: '80px' }}
-              comboboxProps={{ withinPortal: true, zIndex: Z_INDEX_AUTOMATE_DROPDOWN }}
+              style={{ width: "80px" }}
+              comboboxProps={{
+                withinPortal: true,
+                zIndex: Z_INDEX_AUTOMATE_DROPDOWN,
+              }}
             />
           </div>
         </Stack>
@@ -93,45 +139,84 @@ const CompressSettings = ({ parameters, onParameterChange, disabled = false }: C
       <Stack gap="sm">
         <Checkbox
           checked={parameters.grayscale}
-          onChange={(event) => onParameterChange('grayscale', event.currentTarget.checked)}
+          onChange={(event) =>
+            onParameterChange("grayscale", event.currentTarget.checked)
+          }
           disabled={disabled}
-          label={t("compress.grayscale.label", "Apply Grayscale for compression")}
+          label={t(
+            "compress.grayscale.label",
+            "Apply Grayscale for compression",
+          )}
         />
 
         {/* Linearize Option */}
         <Stack gap="sm">
           <Checkbox
             checked={parameters.linearize}
-            onChange={(event) => onParameterChange('linearize', event.currentTarget.checked)}
+            onChange={(event) =>
+              onParameterChange("linearize", event.currentTarget.checked)
+            }
             disabled={disabled}
-            label={t("compress.linearize.label", "Linearize PDF for fast web viewing")}
+            label={t(
+              "compress.linearize.label",
+              "Linearize PDF for fast web viewing",
+            )}
           />
         </Stack>
 
         <Tooltip
-          label={imageMagickReason ?? t("compress.lineArt.unavailable", "ImageMagick is not installed or enabled on this server")}
+          label={
+            imageMagickReason ??
+            t(
+              "compress.lineArt.unavailable",
+              "ImageMagick is not installed or enabled on this server",
+            )
+          }
           disabled={imageMagickAvailable !== false}
           multiline
           maw={280}
         >
-          <Box style={{ cursor: imageMagickAvailable === false ? 'not-allowed' : undefined }}>
+          <Box
+            style={{
+              cursor:
+                imageMagickAvailable === false ? "not-allowed" : undefined,
+            }}
+          >
             <Checkbox
               checked={parameters.lineArt}
-              onChange={(event) => onParameterChange('lineArt', event.currentTarget.checked)}
+              onChange={(event) =>
+                onParameterChange("lineArt", event.currentTarget.checked)
+              }
               disabled={disabled || imageMagickAvailable === false}
-              label={t("compress.lineArt.label", "Convert images to line art (bilevel)")}
+              label={t(
+                "compress.lineArt.label",
+                "Convert images to line art (bilevel)",
+              )}
               description={
                 imageMagickAvailable !== false
-                  ? t("compress.lineArt.description", "Uses ImageMagick to reduce pages to high-contrast black and white for maximum size reduction.")
+                  ? t(
+                      "compress.lineArt.description",
+                      "Uses ImageMagick to reduce pages to high-contrast black and white for maximum size reduction.",
+                    )
                   : undefined
               }
-              style={{ pointerEvents: imageMagickAvailable === false ? 'none' : undefined }}
+              style={{
+                pointerEvents:
+                  imageMagickAvailable === false ? "none" : undefined,
+              }}
             />
           </Box>
         </Tooltip>
         {parameters.lineArt && (
-          <Stack gap="xs" style={{ opacity: (disabled || imageMagickAvailable === false) ? 0.6 : 1 }}>
-            <Text size="sm" fw={600}>{t('compress.lineArt.detailLevel', 'Detail level')}</Text>
+          <Stack
+            gap="xs"
+            style={{
+              opacity: disabled || imageMagickAvailable === false ? 0.6 : 1,
+            }}
+          >
+            <Text size="sm" fw={600}>
+              {t("compress.lineArt.detailLevel", "Detail level")}
+            </Text>
             <Slider
               min={1}
               max={5}
@@ -139,15 +224,20 @@ const CompressSettings = ({ parameters, onParameterChange, disabled = false }: C
               value={(() => {
                 // Map threshold to slider position
                 const thresholdMap = [20, 35, 50, 65, 80];
-                const closest = thresholdMap.reduce((prev, curr, idx) =>
-                  Math.abs(curr - parameters.lineArtThreshold) < Math.abs(thresholdMap[prev] - parameters.lineArtThreshold)
-                    ? idx : prev, 0);
+                const closest = thresholdMap.reduce(
+                  (prev, curr, idx) =>
+                    Math.abs(curr - parameters.lineArtThreshold) <
+                    Math.abs(thresholdMap[prev] - parameters.lineArtThreshold)
+                      ? idx
+                      : prev,
+                  0,
+                );
                 return closest + 1;
               })()}
               onChange={(value) => {
                 // Map slider position to threshold: 1=20%, 2=35%, 3=50%, 4=65%, 5=80%
                 const thresholdMap = [20, 35, 50, 65, 80];
-                onParameterChange('lineArtThreshold', thresholdMap[value - 1]);
+                onParameterChange("lineArtThreshold", thresholdMap[value - 1]);
               }}
               disabled={disabled || imageMagickAvailable === false}
               label={null}
@@ -160,17 +250,27 @@ const CompressSettings = ({ parameters, onParameterChange, disabled = false }: C
               ]}
             />
 
-            <Text size="sm" fw={600}>{t('compress.lineArt.edgeEmphasis', 'Edge emphasis')}</Text>
+            <Text size="sm" fw={600}>
+              {t("compress.lineArt.edgeEmphasis", "Edge emphasis")}
+            </Text>
             <SegmentedControl
               fullWidth
               disabled={disabled || imageMagickAvailable === false}
               data={[
-                { value: '1', label: t('compress.lineArt.edgeLow', 'Gentle') },
-                { value: '2', label: t('compress.lineArt.edgeMedium', 'Balanced') },
-                { value: '3', label: t('compress.lineArt.edgeHigh', 'Strong') },
+                { value: "1", label: t("compress.lineArt.edgeLow", "Gentle") },
+                {
+                  value: "2",
+                  label: t("compress.lineArt.edgeMedium", "Balanced"),
+                },
+                { value: "3", label: t("compress.lineArt.edgeHigh", "Strong") },
               ]}
               value={parameters.lineArtEdgeLevel.toString()}
-              onChange={(value) => onParameterChange('lineArtEdgeLevel', parseInt(value) as 1 | 2 | 3)}
+              onChange={(value) =>
+                onParameterChange(
+                  "lineArtEdgeLevel",
+                  parseInt(value) as 1 | 2 | 3,
+                )
+              }
             />
           </Stack>
         )}
diff --git a/frontend/src/core/components/tools/convert/ConvertFromCbrSettings.tsx b/frontend/src/core/components/tools/convert/ConvertFromCbrSettings.tsx
index 8f1a809469..8371db65ff 100644
--- a/frontend/src/core/components/tools/convert/ConvertFromCbrSettings.tsx
+++ b/frontend/src/core/components/tools/convert/ConvertFromCbrSettings.tsx
@@ -1,31 +1,41 @@
-import { Stack, Text, Checkbox } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
+import { Stack, Text, Checkbox } from "@mantine/core";
+import { useTranslation } from "react-i18next";
 import { ConvertParameters } from "@app/hooks/tools/convert/useConvertParameters";
 
 interface ConvertFromCbrSettingsProps {
   parameters: ConvertParameters;
-  onParameterChange: <K extends keyof ConvertParameters>(key: K, value: ConvertParameters[K]) => void;
+  onParameterChange: <K extends keyof ConvertParameters>(
+    key: K,
+    value: ConvertParameters[K],
+  ) => void;
   disabled?: boolean;
 }
 
 const ConvertFromCbrSettings = ({
   parameters,
   onParameterChange,
-  disabled = false
+  disabled = false,
 }: ConvertFromCbrSettingsProps) => {
   const { t } = useTranslation();
 
   return (
     <Stack gap="sm" data-testid="cbr-settings">
-      <Text size="sm" fw={500}>{t("convert.cbrOptions", "CBR Options")}:</Text>
+      <Text size="sm" fw={500}>
+        {t("convert.cbrOptions", "CBR Options")}:
+      </Text>
 
       <Checkbox
-        label={t('convert.optimizeForEbook', 'Optimize PDF for ebook readers (uses Ghostscript)')}
+        label={t(
+          "convert.optimizeForEbook",
+          "Optimize PDF for ebook readers (uses Ghostscript)",
+        )}
         checked={parameters.cbrOptions.optimizeForEbook}
-        onChange={(event) => onParameterChange('cbrOptions', {
-          ...parameters.cbrOptions,
-          optimizeForEbook: event.currentTarget.checked
-        })}
+        onChange={(event) =>
+          onParameterChange("cbrOptions", {
+            ...parameters.cbrOptions,
+            optimizeForEbook: event.currentTarget.checked,
+          })
+        }
         disabled={disabled}
         data-testid="optimize-ebook-checkbox"
       />
diff --git a/frontend/src/core/components/tools/convert/ConvertFromCbzSettings.tsx b/frontend/src/core/components/tools/convert/ConvertFromCbzSettings.tsx
index babb202559..b868b6692c 100644
--- a/frontend/src/core/components/tools/convert/ConvertFromCbzSettings.tsx
+++ b/frontend/src/core/components/tools/convert/ConvertFromCbzSettings.tsx
@@ -1,31 +1,41 @@
-import { Stack, Text, Checkbox } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { ConvertParameters } from '@app/hooks/tools/convert/useConvertParameters';
+import { Stack, Text, Checkbox } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import { ConvertParameters } from "@app/hooks/tools/convert/useConvertParameters";
 
 interface ConvertFromCbzSettingsProps {
   parameters: ConvertParameters;
-  onParameterChange: <K extends keyof ConvertParameters>(key: K, value: ConvertParameters[K]) => void;
+  onParameterChange: <K extends keyof ConvertParameters>(
+    key: K,
+    value: ConvertParameters[K],
+  ) => void;
   disabled?: boolean;
 }
 
 const ConvertFromCbzSettings = ({
   parameters,
   onParameterChange,
-  disabled = false
+  disabled = false,
 }: ConvertFromCbzSettingsProps) => {
   const { t } = useTranslation();
 
   return (
     <Stack gap="sm" data-testid="cbz-settings">
-      <Text size="sm" fw={500}>{t('convert.cbzOptions', 'CBZ to PDF Options')}:</Text>
+      <Text size="sm" fw={500}>
+        {t("convert.cbzOptions", "CBZ to PDF Options")}:
+      </Text>
 
       <Checkbox
-        label={t('convert.optimizeForEbook', 'Optimize PDF for ebook readers (uses Ghostscript)')}
+        label={t(
+          "convert.optimizeForEbook",
+          "Optimize PDF for ebook readers (uses Ghostscript)",
+        )}
         checked={parameters.cbzOptions.optimizeForEbook}
-        onChange={(event) => onParameterChange('cbzOptions', {
-          ...parameters.cbzOptions,
-          optimizeForEbook: event.currentTarget.checked
-        })}
+        onChange={(event) =>
+          onParameterChange("cbzOptions", {
+            ...parameters.cbzOptions,
+            optimizeForEbook: event.currentTarget.checked,
+          })
+        }
         disabled={disabled}
         data-testid="optimize-ebook-checkbox"
       />
diff --git a/frontend/src/core/components/tools/convert/ConvertFromEbookSettings.tsx b/frontend/src/core/components/tools/convert/ConvertFromEbookSettings.tsx
index 5d8d2b28b6..e465113bb1 100644
--- a/frontend/src/core/components/tools/convert/ConvertFromEbookSettings.tsx
+++ b/frontend/src/core/components/tools/convert/ConvertFromEbookSettings.tsx
@@ -4,28 +4,32 @@ import { ConvertParameters } from "@app/hooks/tools/convert/useConvertParameters
 
 interface ConvertFromEbookSettingsProps {
   parameters: ConvertParameters;
-  onParameterChange: <K extends keyof ConvertParameters>(key: K, value: ConvertParameters[K]) => void;
+  onParameterChange: <K extends keyof ConvertParameters>(
+    key: K,
+    value: ConvertParameters[K],
+  ) => void;
   disabled?: boolean;
 }
 
 const ConvertFromEbookSettings = ({
   parameters,
   onParameterChange,
-  disabled = false
+  disabled = false,
 }: ConvertFromEbookSettingsProps) => {
   const { t } = useTranslation();
 
   const handleEmbedAllFontsChange = (value: boolean) => {
-    onParameterChange('ebookOptions', {
+    onParameterChange("ebookOptions", {
       embedAllFonts: value,
-      includeTableOfContents: parameters.ebookOptions?.includeTableOfContents ?? false,
+      includeTableOfContents:
+        parameters.ebookOptions?.includeTableOfContents ?? false,
       includePageNumbers: parameters.ebookOptions?.includePageNumbers ?? false,
       optimizeForEbook: parameters.ebookOptions?.optimizeForEbook ?? false,
     });
   };
 
   const handleIncludeTableOfContentsChange = (value: boolean) => {
-    onParameterChange('ebookOptions', {
+    onParameterChange("ebookOptions", {
       embedAllFonts: parameters.ebookOptions?.embedAllFonts ?? false,
       includeTableOfContents: value,
       includePageNumbers: parameters.ebookOptions?.includePageNumbers ?? false,
@@ -34,18 +38,20 @@ const ConvertFromEbookSettings = ({
   };
 
   const handleIncludePageNumbersChange = (value: boolean) => {
-    onParameterChange('ebookOptions', {
+    onParameterChange("ebookOptions", {
       embedAllFonts: parameters.ebookOptions?.embedAllFonts ?? false,
-      includeTableOfContents: parameters.ebookOptions?.includeTableOfContents ?? false,
+      includeTableOfContents:
+        parameters.ebookOptions?.includeTableOfContents ?? false,
       includePageNumbers: value,
       optimizeForEbook: parameters.ebookOptions?.optimizeForEbook ?? false,
     });
   };
 
   const handleOptimizeForEbookChange = (value: boolean) => {
-    onParameterChange('ebookOptions', {
+    onParameterChange("ebookOptions", {
       embedAllFonts: parameters.ebookOptions?.embedAllFonts ?? false,
-      includeTableOfContents: parameters.ebookOptions?.includeTableOfContents ?? false,
+      includeTableOfContents:
+        parameters.ebookOptions?.includeTableOfContents ?? false,
       includePageNumbers: parameters.ebookOptions?.includePageNumbers ?? false,
       optimizeForEbook: value,
     });
@@ -63,30 +69,59 @@ const ConvertFromEbookSettings = ({
     <Stack gap="sm">
       <Checkbox
         label={t("convert.ebookOptions.embedAllFonts", "Embed all fonts")}
-        description={t("convert.ebookOptions.embedAllFontsDesc", "Embed all fonts from the eBook into the generated PDF")}
+        description={t(
+          "convert.ebookOptions.embedAllFontsDesc",
+          "Embed all fonts from the eBook into the generated PDF",
+        )}
         checked={ebookOptions.embedAllFonts}
-        onChange={(event) => handleEmbedAllFontsChange(event.currentTarget.checked)}
+        onChange={(event) =>
+          handleEmbedAllFontsChange(event.currentTarget.checked)
+        }
         disabled={disabled}
       />
       <Checkbox
-        label={t("convert.ebookOptions.includeTableOfContents", "Include table of contents")}
-        description={t("convert.ebookOptions.includeTableOfContentsDesc", "Add a generated table of contents to the resulting PDF")}
+        label={t(
+          "convert.ebookOptions.includeTableOfContents",
+          "Include table of contents",
+        )}
+        description={t(
+          "convert.ebookOptions.includeTableOfContentsDesc",
+          "Add a generated table of contents to the resulting PDF",
+        )}
         checked={ebookOptions.includeTableOfContents}
-        onChange={(event) => handleIncludeTableOfContentsChange(event.currentTarget.checked)}
+        onChange={(event) =>
+          handleIncludeTableOfContentsChange(event.currentTarget.checked)
+        }
         disabled={disabled}
       />
       <Checkbox
-        label={t("convert.ebookOptions.includePageNumbers", "Include page numbers")}
-        description={t("convert.ebookOptions.includePageNumbersDesc", "Add page numbers to the generated PDF")}
+        label={t(
+          "convert.ebookOptions.includePageNumbers",
+          "Include page numbers",
+        )}
+        description={t(
+          "convert.ebookOptions.includePageNumbersDesc",
+          "Add page numbers to the generated PDF",
+        )}
         checked={ebookOptions.includePageNumbers}
-        onChange={(event) => handleIncludePageNumbersChange(event.currentTarget.checked)}
+        onChange={(event) =>
+          handleIncludePageNumbersChange(event.currentTarget.checked)
+        }
         disabled={disabled}
       />
       <Checkbox
-        label={t("convert.ebookOptions.optimizeForEbookPdf", "Optimize for ebook readers")}
-        description={t("convert.ebookOptions.optimizeForEbookPdfDesc", "Optimize the PDF for eBook reading (smaller file size, better rendering on eInk devices)")}
+        label={t(
+          "convert.ebookOptions.optimizeForEbookPdf",
+          "Optimize for ebook readers",
+        )}
+        description={t(
+          "convert.ebookOptions.optimizeForEbookPdfDesc",
+          "Optimize the PDF for eBook reading (smaller file size, better rendering on eInk devices)",
+        )}
         checked={ebookOptions.optimizeForEbook}
-        onChange={(event) => handleOptimizeForEbookChange(event.currentTarget.checked)}
+        onChange={(event) =>
+          handleOptimizeForEbookChange(event.currentTarget.checked)
+        }
         disabled={disabled}
       />
     </Stack>
diff --git a/frontend/src/core/components/tools/convert/ConvertFromEmailSettings.tsx b/frontend/src/core/components/tools/convert/ConvertFromEmailSettings.tsx
index fd7b1ec977..7df3227dc5 100644
--- a/frontend/src/core/components/tools/convert/ConvertFromEmailSettings.tsx
+++ b/frontend/src/core/components/tools/convert/ConvertFromEmailSettings.tsx
@@ -1,44 +1,55 @@
-import { Stack, Text, NumberInput, Checkbox } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { ConvertParameters } from '@app/hooks/tools/convert/useConvertParameters';
+import { Stack, Text, NumberInput, Checkbox } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import { ConvertParameters } from "@app/hooks/tools/convert/useConvertParameters";
 
 interface ConvertFromEmailSettingsProps {
   parameters: ConvertParameters;
-  onParameterChange: <K extends keyof ConvertParameters>(key: K, value: ConvertParameters[K]) => void;
+  onParameterChange: <K extends keyof ConvertParameters>(
+    key: K,
+    value: ConvertParameters[K],
+  ) => void;
   disabled?: boolean;
 }
 
 const ConvertFromEmailSettings = ({
   parameters,
   onParameterChange,
-  disabled = false
+  disabled = false,
 }: ConvertFromEmailSettingsProps) => {
   const { t } = useTranslation();
 
   return (
     <Stack gap="sm" data-testid="email-settings">
-      <Text size="sm" fw={500}>{t("convert.emailOptions", "Email to PDF Options")}:</Text>
+      <Text size="sm" fw={500}>
+        {t("convert.emailOptions", "Email to PDF Options")}:
+      </Text>
 
       <Checkbox
         label={t("convert.includeAttachments", "Include email attachments")}
         checked={parameters.emailOptions.includeAttachments}
-        onChange={(event) => onParameterChange('emailOptions', {
-          ...parameters.emailOptions,
-          includeAttachments: event.currentTarget.checked
-        })}
+        onChange={(event) =>
+          onParameterChange("emailOptions", {
+            ...parameters.emailOptions,
+            includeAttachments: event.currentTarget.checked,
+          })
+        }
         disabled={disabled}
         data-testid="include-attachments-checkbox"
       />
 
       {parameters.emailOptions.includeAttachments && (
         <Stack gap="xs">
-          <Text size="xs" fw={500}>{t("convert.maxAttachmentSize", "Maximum attachment size (MB)")}:</Text>
+          <Text size="xs" fw={500}>
+            {t("convert.maxAttachmentSize", "Maximum attachment size (MB)")}:
+          </Text>
           <NumberInput
             value={parameters.emailOptions.maxAttachmentSizeMB}
-            onChange={(value) => onParameterChange('emailOptions', {
-              ...parameters.emailOptions,
-              maxAttachmentSizeMB: Number(value) || 10
-            })}
+            onChange={(value) =>
+              onParameterChange("emailOptions", {
+                ...parameters.emailOptions,
+                maxAttachmentSizeMB: Number(value) || 10,
+              })
+            }
             min={1}
             max={100}
             step={1}
@@ -49,23 +60,33 @@ const ConvertFromEmailSettings = ({
       )}
 
       <Checkbox
-        label={t("convert.includeAllRecipients", "Include CC and BCC recipients in header")}
+        label={t(
+          "convert.includeAllRecipients",
+          "Include CC and BCC recipients in header",
+        )}
         checked={parameters.emailOptions.includeAllRecipients}
-        onChange={(event) => onParameterChange('emailOptions', {
-          ...parameters.emailOptions,
-          includeAllRecipients: event.currentTarget.checked
-        })}
+        onChange={(event) =>
+          onParameterChange("emailOptions", {
+            ...parameters.emailOptions,
+            includeAllRecipients: event.currentTarget.checked,
+          })
+        }
         disabled={disabled}
         data-testid="include-all-recipients-checkbox"
       />
 
       <Checkbox
-        label={t("convert.downloadHtml", "Download HTML intermediate file instead of PDF")}
+        label={t(
+          "convert.downloadHtml",
+          "Download HTML intermediate file instead of PDF",
+        )}
         checked={parameters.emailOptions.downloadHtml}
-        onChange={(event) => onParameterChange('emailOptions', {
-          ...parameters.emailOptions,
-          downloadHtml: event.currentTarget.checked
-        })}
+        onChange={(event) =>
+          onParameterChange("emailOptions", {
+            ...parameters.emailOptions,
+            downloadHtml: event.currentTarget.checked,
+          })
+        }
         disabled={disabled}
         data-testid="download-html-checkbox"
       />
diff --git a/frontend/src/core/components/tools/convert/ConvertFromImageSettings.tsx b/frontend/src/core/components/tools/convert/ConvertFromImageSettings.tsx
index ea07b60f54..86e0f3c1a0 100644
--- a/frontend/src/core/components/tools/convert/ConvertFromImageSettings.tsx
+++ b/frontend/src/core/components/tools/convert/ConvertFromImageSettings.tsx
@@ -6,75 +6,117 @@ import { Z_INDEX_AUTOMATE_DROPDOWN } from "@app/styles/zIndex";
 
 interface ConvertFromImageSettingsProps {
   parameters: ConvertParameters;
-  onParameterChange: <K extends keyof ConvertParameters>(key: K, value: ConvertParameters[K]) => void;
+  onParameterChange: <K extends keyof ConvertParameters>(
+    key: K,
+    value: ConvertParameters[K],
+  ) => void;
   disabled?: boolean;
 }
 
 const ConvertFromImageSettings = ({
   parameters,
   onParameterChange,
-  disabled = false
+  disabled = false,
 }: ConvertFromImageSettingsProps) => {
   const { t } = useTranslation();
 
   return (
     <Stack gap="sm" data-testid="pdf-options-section">
-      <Text size="sm" fw={500}>{t("convert.pdfOptions", "PDF Options")}:</Text>
+      <Text size="sm" fw={500}>
+        {t("convert.pdfOptions", "PDF Options")}:
+      </Text>
       <Select
         data-testid="color-type-select"
         label={t("convert.colorType", "Color Type")}
         value={parameters.imageOptions.colorType}
-        onChange={(val) => val && onParameterChange('imageOptions', {
-          ...parameters.imageOptions,
-          colorType: val as typeof COLOR_TYPES[keyof typeof COLOR_TYPES]
-        })}
+        onChange={(val) =>
+          val &&
+          onParameterChange("imageOptions", {
+            ...parameters.imageOptions,
+            colorType: val as (typeof COLOR_TYPES)[keyof typeof COLOR_TYPES],
+          })
+        }
         data={[
           { value: COLOR_TYPES.COLOR, label: t("convert.color", "Color") },
-          { value: COLOR_TYPES.GRAYSCALE, label: t("convert.grayscale", "Grayscale") },
-          { value: COLOR_TYPES.BLACK_WHITE, label: t("convert.blackwhite", "Black & White") },
+          {
+            value: COLOR_TYPES.GRAYSCALE,
+            label: t("convert.grayscale", "Grayscale"),
+          },
+          {
+            value: COLOR_TYPES.BLACK_WHITE,
+            label: t("convert.blackwhite", "Black & White"),
+          },
         ]}
         disabled={disabled}
-        comboboxProps={{ withinPortal: true, zIndex: Z_INDEX_AUTOMATE_DROPDOWN }}
+        comboboxProps={{
+          withinPortal: true,
+          zIndex: Z_INDEX_AUTOMATE_DROPDOWN,
+        }}
       />
 
       <Select
         data-testid="fit-option-select"
         label={t("convert.fitOption", "Fit Option")}
         value={parameters.imageOptions.fitOption}
-        onChange={(val) => val && onParameterChange('imageOptions', {
-          ...parameters.imageOptions,
-          fitOption: val as typeof FIT_OPTIONS[keyof typeof FIT_OPTIONS]
-        })}
+        onChange={(val) =>
+          val &&
+          onParameterChange("imageOptions", {
+            ...parameters.imageOptions,
+            fitOption: val as (typeof FIT_OPTIONS)[keyof typeof FIT_OPTIONS],
+          })
+        }
         data={[
-          { value: FIT_OPTIONS.MAINTAIN_ASPECT, label: t("convert.maintainAspectRatio", "Maintain Aspect Ratio") },
-          { value: FIT_OPTIONS.FIT_PAGE, label: t("convert.fitDocumentToPage", "Fit Document to Page") },
-          { value: FIT_OPTIONS.FILL_PAGE, label: t("convert.fillPage", "Fill Page") },
+          {
+            value: FIT_OPTIONS.MAINTAIN_ASPECT,
+            label: t("convert.maintainAspectRatio", "Maintain Aspect Ratio"),
+          },
+          {
+            value: FIT_OPTIONS.FIT_PAGE,
+            label: t("convert.fitDocumentToPage", "Fit Document to Page"),
+          },
+          {
+            value: FIT_OPTIONS.FILL_PAGE,
+            label: t("convert.fillPage", "Fill Page"),
+          },
         ]}
         disabled={disabled}
-        comboboxProps={{ withinPortal: true, zIndex: Z_INDEX_AUTOMATE_DROPDOWN }}
+        comboboxProps={{
+          withinPortal: true,
+          zIndex: Z_INDEX_AUTOMATE_DROPDOWN,
+        }}
       />
 
       <Switch
         data-testid="auto-rotate-switch"
         label={t("convert.autoRotate", "Auto Rotate")}
-        description={t("convert.autoRotateDescription", "Automatically rotate images to better fit the PDF page")}
+        description={t(
+          "convert.autoRotateDescription",
+          "Automatically rotate images to better fit the PDF page",
+        )}
         checked={parameters.imageOptions.autoRotate}
-        onChange={(event) => onParameterChange('imageOptions', {
-          ...parameters.imageOptions,
-          autoRotate: event.currentTarget.checked
-        })}
+        onChange={(event) =>
+          onParameterChange("imageOptions", {
+            ...parameters.imageOptions,
+            autoRotate: event.currentTarget.checked,
+          })
+        }
         disabled={disabled}
       />
 
       <Switch
         data-testid="combine-images-switch"
         label={t("convert.combineImages", "Combine Images")}
-        description={t("convert.combineImagesDescription", "Combine all images into one PDF, or create separate PDFs for each image")}
+        description={t(
+          "convert.combineImagesDescription",
+          "Combine all images into one PDF, or create separate PDFs for each image",
+        )}
         checked={parameters.imageOptions.combineImages}
-        onChange={(event) => onParameterChange('imageOptions', {
-          ...parameters.imageOptions,
-          combineImages: event.currentTarget.checked
-        })}
+        onChange={(event) =>
+          onParameterChange("imageOptions", {
+            ...parameters.imageOptions,
+            combineImages: event.currentTarget.checked,
+          })
+        }
         disabled={disabled}
       />
     </Stack>
diff --git a/frontend/src/core/components/tools/convert/ConvertFromSvgSettings.tsx b/frontend/src/core/components/tools/convert/ConvertFromSvgSettings.tsx
index eee786250d..f661eb3039 100644
--- a/frontend/src/core/components/tools/convert/ConvertFromSvgSettings.tsx
+++ b/frontend/src/core/components/tools/convert/ConvertFromSvgSettings.tsx
@@ -4,35 +4,48 @@ import { ConvertParameters } from "@app/hooks/tools/convert/useConvertParameters
 
 interface ConvertFromSvgSettingsProps {
   parameters: ConvertParameters;
-  onParameterChange: <K extends keyof ConvertParameters>(key: K, value: ConvertParameters[K]) => void;
+  onParameterChange: <K extends keyof ConvertParameters>(
+    key: K,
+    value: ConvertParameters[K],
+  ) => void;
   disabled?: boolean;
 }
 
 const ConvertFromSvgSettings = ({
   parameters,
   onParameterChange,
-  disabled = false
+  disabled = false,
 }: ConvertFromSvgSettingsProps) => {
   const { t } = useTranslation();
 
   return (
     <Stack gap="sm" data-testid="svg-pdf-options-section">
-      <Text size="sm" fw={500}>{t("convert.svgPdfOptions", "SVG to PDF Options")}:</Text>
-      
+      <Text size="sm" fw={500}>
+        {t("convert.svgPdfOptions", "SVG to PDF Options")}:
+      </Text>
+
       <Switch
         data-testid="combine-svgs-switch"
         label={t("convert.combineSvgs", "Combine SVGs into single PDF")}
-        description={t("convert.combineSvgsDescription", "Combine all SVG files into one PDF with multiple pages, or create separate PDFs for each SVG")}
+        description={t(
+          "convert.combineSvgsDescription",
+          "Combine all SVG files into one PDF with multiple pages, or create separate PDFs for each SVG",
+        )}
         checked={parameters.imageOptions.combineImages}
-        onChange={(event) => onParameterChange('imageOptions', {
-          ...parameters.imageOptions,
-          combineImages: event.currentTarget.checked
-        })}
+        onChange={(event) =>
+          onParameterChange("imageOptions", {
+            ...parameters.imageOptions,
+            combineImages: event.currentTarget.checked,
+          })
+        }
         disabled={disabled}
       />
 
       <Text size="xs" c="dimmed" mt="xs">
-        {t("convert.svgVectorNote", "SVG files are rendered as vector graphics for crisp output at any resolution. Dimensions from the SVG determine the PDF page size.")}
+        {t(
+          "convert.svgVectorNote",
+          "SVG files are rendered as vector graphics for crisp output at any resolution. Dimensions from the SVG determine the PDF page size.",
+        )}
       </Text>
     </Stack>
   );
diff --git a/frontend/src/core/components/tools/convert/ConvertFromWebSettings.tsx b/frontend/src/core/components/tools/convert/ConvertFromWebSettings.tsx
index f2832cb3a0..26509582a4 100644
--- a/frontend/src/core/components/tools/convert/ConvertFromWebSettings.tsx
+++ b/frontend/src/core/components/tools/convert/ConvertFromWebSettings.tsx
@@ -1,32 +1,41 @@
-import { Stack, Text, NumberInput, Slider } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { ConvertParameters } from '@app/hooks/tools/convert/useConvertParameters';
+import { Stack, Text, NumberInput, Slider } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import { ConvertParameters } from "@app/hooks/tools/convert/useConvertParameters";
 
 interface ConvertFromWebSettingsProps {
   parameters: ConvertParameters;
-  onParameterChange: <K extends keyof ConvertParameters>(key: K, value: ConvertParameters[K]) => void;
+  onParameterChange: <K extends keyof ConvertParameters>(
+    key: K,
+    value: ConvertParameters[K],
+  ) => void;
   disabled?: boolean;
 }
 
 const ConvertFromWebSettings = ({
   parameters,
   onParameterChange,
-  disabled = false
+  disabled = false,
 }: ConvertFromWebSettingsProps) => {
   const { t } = useTranslation();
 
   return (
     <Stack gap="sm" data-testid="web-settings">
-      <Text size="sm" fw={500}>{t("convert.webOptions", "Web to PDF Options")}:</Text>
+      <Text size="sm" fw={500}>
+        {t("convert.webOptions", "Web to PDF Options")}:
+      </Text>
 
       <Stack gap="xs">
-        <Text size="xs" fw={500}>{t("convert.zoomLevel", "Zoom Level")}:</Text>
+        <Text size="xs" fw={500}>
+          {t("convert.zoomLevel", "Zoom Level")}:
+        </Text>
         <NumberInput
           value={parameters.htmlOptions.zoomLevel}
-          onChange={(value) => onParameterChange('htmlOptions', {
-            ...parameters.htmlOptions,
-            zoomLevel: Number(value) || 1.0
-          })}
+          onChange={(value) =>
+            onParameterChange("htmlOptions", {
+              ...parameters.htmlOptions,
+              zoomLevel: Number(value) || 1.0,
+            })
+          }
           min={0.1}
           max={3.0}
           step={0.1}
@@ -35,10 +44,12 @@ const ConvertFromWebSettings = ({
         />
         <Slider
           value={parameters.htmlOptions.zoomLevel}
-          onChange={(value) => onParameterChange('htmlOptions', {
-            ...parameters.htmlOptions,
-            zoomLevel: value
-          })}
+          onChange={(value) =>
+            onParameterChange("htmlOptions", {
+              ...parameters.htmlOptions,
+              zoomLevel: value,
+            })
+          }
           min={0.1}
           max={3.0}
           step={0.1}
diff --git a/frontend/src/core/components/tools/convert/ConvertSettings.tsx b/frontend/src/core/components/tools/convert/ConvertSettings.tsx
index 2f3459a436..8b72e20ad5 100644
--- a/frontend/src/core/components/tools/convert/ConvertSettings.tsx
+++ b/frontend/src/core/components/tools/convert/ConvertSettings.tsx
@@ -1,5 +1,12 @@
 import { useMemo } from "react";
-import { Stack, Text, Group, Divider, UnstyledButton, useMantineTheme, useMantineColorScheme } from "@mantine/core";
+import {
+  Stack,
+  Text,
+  Group,
+  Divider,
+  UnstyledButton,
+  useMantineTheme,
+} from "@mantine/core";
 import KeyboardArrowDownIcon from "@mui/icons-material/KeyboardArrowDown";
 import { useTranslation } from "react-i18next";
 import { useMultipleEndpointsEnabled } from "@app/hooks/useEndpointConfig";
@@ -30,14 +37,19 @@ import {
   EXTENSION_TO_ENDPOINT,
   COLOR_TYPES,
   OUTPUT_OPTIONS,
-  FIT_OPTIONS
+  FIT_OPTIONS,
 } from "@app/constants/convertConstants";
 import { StirlingFile } from "@app/types/fileContext";
 
 interface ConvertSettingsProps {
   parameters: ConvertParameters;
-  onParameterChange: <K extends keyof ConvertParameters>(key: K, value: ConvertParameters[K]) => void;
-  getAvailableToExtensions: (fromExtension: string) => Array<{value: string, label: string, group: string}>;
+  onParameterChange: <K extends keyof ConvertParameters>(
+    key: K,
+    value: ConvertParameters[K],
+  ) => void;
+  getAvailableToExtensions: (
+    fromExtension: string,
+  ) => Array<{ value: string; label: string; group: string }>;
   selectedFiles: StirlingFile[];
   disabled?: boolean;
 }
@@ -47,11 +59,10 @@ const ConvertSettings = ({
   onParameterChange,
   getAvailableToExtensions,
   selectedFiles,
-  disabled = false
+  disabled = false,
 }: ConvertSettingsProps) => {
   const { t } = useTranslation();
   const theme = useMantineTheme();
-  const { colorScheme } = useMantineColorScheme();
   const { setSelectedFiles } = useFileSelection();
   const { state, selectors } = useFileState();
   const activeFiles = state.files.ids;
@@ -89,33 +100,37 @@ const ConvertSettings = ({
 
   // Enhanced FROM options with endpoint availability
   const enhancedFromOptions = useMemo(() => {
-    const baseOptions = FROM_FORMAT_OPTIONS.map(option => {
+    const baseOptions = FROM_FORMAT_OPTIONS.map((option) => {
       // Check if this source format has any available conversions
       const availableConversions = getAvailableToExtensions(option.value) || [];
-      const hasAvailableConversions = availableConversions.some(targetOption =>
-        isConversionAvailable(option.value, targetOption.value)
+      const hasAvailableConversions = availableConversions.some(
+        (targetOption) =>
+          isConversionAvailable(option.value, targetOption.value),
       );
 
       return {
         ...option,
-        enabled: hasAvailableConversions
+        enabled: hasAvailableConversions,
       };
     });
 
     // Filter out unavailable source formats if preference is enabled
     let filteredOptions = baseOptions;
     if (preferences.hideUnavailableConversions) {
-      filteredOptions = baseOptions.filter(opt => opt.enabled !== false);
+      filteredOptions = baseOptions.filter((opt) => opt.enabled !== false);
     }
 
     // Add dynamic format option if current selection is a file-<extension> format
-    if (parameters.fromExtension && parameters.fromExtension.startsWith('file-')) {
-      const extension = parameters.fromExtension.replace('file-', '');
+    if (
+      parameters.fromExtension &&
+      parameters.fromExtension.startsWith("file-")
+    ) {
+      const extension = parameters.fromExtension.replace("file-", "");
       const dynamicOption = {
         value: parameters.fromExtension,
         label: extension.toUpperCase(),
-        group: 'File',
-        enabled: true
+        group: "File",
+        enabled: true,
       };
 
       // Add the dynamic option at the beginning
@@ -123,33 +138,50 @@ const ConvertSettings = ({
     }
 
     return filteredOptions;
-  }, [parameters.fromExtension, endpointStatus, preferences.hideUnavailableConversions, conversionStatus]);
+  }, [
+    parameters.fromExtension,
+    endpointStatus,
+    preferences.hideUnavailableConversions,
+    conversionStatus,
+  ]);
 
   // Enhanced TO options with endpoint availability and cloud status
   const enhancedToOptions = useMemo(() => {
     if (!parameters.fromExtension) return [];
 
-    const availableOptions = getAvailableToExtensions(parameters.fromExtension) || [];
-    const enhanced = availableOptions.map(option => {
-      const enabled = isConversionAvailable(parameters.fromExtension, option.value);
-      const usesCloud = doesConversionUseCloud(parameters.fromExtension, option.value);
+    const availableOptions =
+      getAvailableToExtensions(parameters.fromExtension) || [];
+    const enhanced = availableOptions.map((option) => {
+      const enabled = isConversionAvailable(
+        parameters.fromExtension,
+        option.value,
+      );
+      const usesCloud = doesConversionUseCloud(
+        parameters.fromExtension,
+        option.value,
+      );
       return {
         ...option,
         enabled,
-        usesCloud
+        usesCloud,
       };
     });
 
     // Filter out unavailable conversions if preference is enabled
     if (preferences.hideUnavailableConversions) {
-      return enhanced.filter(opt => opt.enabled !== false);
+      return enhanced.filter((opt) => opt.enabled !== false);
     }
 
     return enhanced;
-  }, [parameters.fromExtension, endpointStatus, preferences.hideUnavailableConversions, conversionStatus]);
+  }, [
+    parameters.fromExtension,
+    endpointStatus,
+    preferences.hideUnavailableConversions,
+    conversionStatus,
+  ]);
 
   const resetParametersToDefaults = () => {
-    onParameterChange('imageOptions', {
+    onParameterChange("imageOptions", {
       colorType: COLOR_TYPES.COLOR,
       dpi: 300,
       singleOrMultiple: OUTPUT_OPTIONS.MULTIPLE,
@@ -157,60 +189,63 @@ const ConvertSettings = ({
       autoRotate: true,
       combineImages: true,
     });
-    onParameterChange('emailOptions', {
+    onParameterChange("emailOptions", {
       includeAttachments: true,
       maxAttachmentSizeMB: 10,
       downloadHtml: false,
       includeAllRecipients: false,
     });
-    onParameterChange('pdfaOptions', {
-      outputFormat: 'pdfa-2b',
+    onParameterChange("pdfaOptions", {
+      outputFormat: "pdfa-2b",
       strict: false,
     });
-    onParameterChange('pdfxOptions', {
-      outputFormat: 'pdfx',
+    onParameterChange("pdfxOptions", {
+      outputFormat: "pdfx",
     });
-    onParameterChange('cbrOptions', {
+    onParameterChange("cbrOptions", {
       optimizeForEbook: false,
     });
-    onParameterChange('pdfToCbrOptions', {
+    onParameterChange("pdfToCbrOptions", {
       dpi: 150,
     });
-    onParameterChange('cbzOptions', {
+    onParameterChange("cbzOptions", {
       optimizeForEbook: false,
     });
-    onParameterChange('cbzOutputOptions', {
+    onParameterChange("cbzOutputOptions", {
       dpi: 150,
     });
-    onParameterChange('ebookOptions', {
+    onParameterChange("ebookOptions", {
       embedAllFonts: false,
       includeTableOfContents: false,
       includePageNumbers: false,
       optimizeForEbook: false,
     });
-    onParameterChange('epubOptions', {
+    onParameterChange("epubOptions", {
       detectChapters: true,
-      targetDevice: 'TABLET_PHONE_IMAGES',
-      outputFormat: 'EPUB',
+      targetDevice: "TABLET_PHONE_IMAGES",
+      outputFormat: "EPUB",
     });
-    onParameterChange('isSmartDetection', false);
-    onParameterChange('smartDetectionType', 'none');
+    onParameterChange("isSmartDetection", false);
+    onParameterChange("smartDetectionType", "none");
   };
 
   const setAutoTargetExtension = (fromExtension: string) => {
     const availableToOptions = getAvailableToExtensions(fromExtension);
-    const autoTarget = availableToOptions.length === 1 ? availableToOptions[0].value : '';
-    onParameterChange('toExtension', autoTarget);
+    const autoTarget =
+      availableToOptions.length === 1 ? availableToOptions[0].value : "";
+    onParameterChange("toExtension", autoTarget);
   };
 
   const filterFilesByExtension = (extension: string) => {
-    const files = activeFiles.map(fileId => selectors.getFile(fileId)).filter(Boolean) as StirlingFile[];
-    return files.filter(file => {
+    const files = activeFiles
+      .map((fileId) => selectors.getFile(fileId))
+      .filter(Boolean) as StirlingFile[];
+    return files.filter((file) => {
       const fileExtension = detectFileExtension(file.name);
 
-      if (extension === 'any') {
+      if (extension === "any") {
         return true;
-      } else if (extension === 'image') {
+      } else if (extension === "image") {
         return isImageFormat(fileExtension);
       } else {
         return fileExtension === extension;
@@ -219,12 +254,12 @@ const ConvertSettings = ({
   };
 
   const updateFileSelection = (files: StirlingFile[]) => {
-    const fileIds = files.map(file => file.fileId);
+    const fileIds = files.map((file) => file.fileId);
     setSelectedFiles(fileIds);
   };
 
   const handleFromExtensionChange = (value: string) => {
-    onParameterChange('fromExtension', value);
+    onParameterChange("fromExtension", value);
     setAutoTargetExtension(value);
     resetParametersToDefaults();
 
@@ -237,8 +272,8 @@ const ConvertSettings = ({
   };
 
   const handleToExtensionChange = (value: string) => {
-    onParameterChange('toExtension', value);
-    onParameterChange('imageOptions', {
+    onParameterChange("toExtension", value);
+    onParameterChange("imageOptions", {
       colorType: COLOR_TYPES.COLOR,
       dpi: 300,
       singleOrMultiple: OUTPUT_OPTIONS.MULTIPLE,
@@ -246,37 +281,35 @@ const ConvertSettings = ({
       autoRotate: true,
       combineImages: true,
     });
-    onParameterChange('emailOptions', {
+    onParameterChange("emailOptions", {
       includeAttachments: true,
       maxAttachmentSizeMB: 10,
       downloadHtml: false,
       includeAllRecipients: false,
     });
-    onParameterChange('pdfaOptions', {
-      outputFormat: 'pdfa-2b',
+    onParameterChange("pdfaOptions", {
+      outputFormat: "pdfa-2b",
       strict: false,
     });
-    onParameterChange('pdfxOptions', {
-      outputFormat: 'pdfx',
+    onParameterChange("pdfxOptions", {
+      outputFormat: "pdfx",
     });
-    onParameterChange('cbrOptions', {
+    onParameterChange("cbrOptions", {
       optimizeForEbook: false,
     });
-    onParameterChange('pdfToCbrOptions', {
+    onParameterChange("pdfToCbrOptions", {
       dpi: 150,
     });
-    onParameterChange('cbzOptions', {
+    onParameterChange("cbzOptions", {
       optimizeForEbook: false,
     });
-    onParameterChange('cbzOutputOptions', {
+    onParameterChange("cbzOutputOptions", {
       dpi: 150,
     });
   };
 
-
   return (
     <Stack gap="md">
-
       {/* Format Selection */}
       <Stack gap="sm">
         <Text size="sm" fw={500}>
@@ -301,20 +334,25 @@ const ConvertSettings = ({
         {!parameters.fromExtension ? (
           <UnstyledButton
             style={{
-              padding: '0.5rem 0.75rem',
+              padding: "0.5rem 0.75rem",
               border: `0.0625rem solid ${theme.colors.gray[4]}`,
               borderRadius: theme.radius.sm,
-              backgroundColor: colorScheme === 'dark' ? theme.colors.dark[5] : theme.colors.gray[1],
-              color: colorScheme === 'dark' ? theme.colors.dark[2] : theme.colors.gray[6],
-              cursor: 'not-allowed'
+              backgroundColor: "var(--select-placeholder-bg)",
+              color: "var(--select-placeholder-text)",
+              cursor: "not-allowed",
             }}
           >
             <Group justify="space-between">
-              <Text size="sm">{t("convert.selectSourceFormatFirst", "Select a source format first")}</Text>
+              <Text size="sm">
+                {t(
+                  "convert.selectSourceFormatFirst",
+                  "Select a source format first",
+                )}
+              </Text>
               <KeyboardArrowDownIcon
                 style={{
-                  fontSize: '1rem',
-                  color: colorScheme === 'dark' ? theme.colors.dark[2] : theme.colors.gray[6]
+                  fontSize: "1rem",
+                  color: "var(--select-placeholder-text)",
                 }}
               />
             </Group>
@@ -345,10 +383,11 @@ const ConvertSettings = ({
         </>
       )}
 
-
       {/* Color options for image to PDF conversion */}
-      {(isImageFormat(parameters.fromExtension) && parameters.toExtension === 'pdf') ||
-       (parameters.isSmartDetection && parameters.smartDetectionType === 'images') ? (
+      {(isImageFormat(parameters.fromExtension) &&
+        parameters.toExtension === "pdf") ||
+      (parameters.isSmartDetection &&
+        parameters.smartDetectionType === "images") ? (
         <>
           <Divider />
           <ConvertFromImageSettings
@@ -360,20 +399,23 @@ const ConvertSettings = ({
       ) : null}
 
       {/* SVG to PDF options */}
-      {parameters.fromExtension === 'svg' && parameters.toExtension === 'pdf' && (
-        <>
-          <Divider />
-          <ConvertFromSvgSettings
-            parameters={parameters}
-            onParameterChange={onParameterChange}
-            disabled={disabled}
-          />
-        </>
-      )}
+      {parameters.fromExtension === "svg" &&
+        parameters.toExtension === "pdf" && (
+          <>
+            <Divider />
+            <ConvertFromSvgSettings
+              parameters={parameters}
+              onParameterChange={onParameterChange}
+              disabled={disabled}
+            />
+          </>
+        )}
 
       {/* Web to PDF options */}
-      {((isWebFormat(parameters.fromExtension) && parameters.toExtension === 'pdf') ||
-       (parameters.isSmartDetection && parameters.smartDetectionType === 'web')) ? (
+      {(isWebFormat(parameters.fromExtension) &&
+        parameters.toExtension === "pdf") ||
+      (parameters.isSmartDetection &&
+        parameters.smartDetectionType === "web") ? (
         <>
           <Divider />
           <ConvertFromWebSettings
@@ -385,115 +427,124 @@ const ConvertSettings = ({
       ) : null}
 
       {/* Email to PDF options (EML and MSG formats) */}
-      {(parameters.fromExtension === 'eml' || parameters.fromExtension === 'msg') && parameters.toExtension === 'pdf' && (
-        <>
-          <Divider />
-          <ConvertFromEmailSettings
-            parameters={parameters}
-            onParameterChange={onParameterChange}
-            disabled={disabled}
-          />
-        </>
-      )}
+      {(parameters.fromExtension === "eml" ||
+        parameters.fromExtension === "msg") &&
+        parameters.toExtension === "pdf" && (
+          <>
+            <Divider />
+            <ConvertFromEmailSettings
+              parameters={parameters}
+              onParameterChange={onParameterChange}
+              disabled={disabled}
+            />
+          </>
+        )}
 
       {/* CBZ to PDF options */}
-      {parameters.fromExtension === 'cbz' && parameters.toExtension === 'pdf' && (
-        <>
-          <Divider />
-          <ConvertFromCbzSettings
-            parameters={parameters}
-            onParameterChange={onParameterChange}
-            disabled={disabled}
-          />
-        </>
-      )}
+      {parameters.fromExtension === "cbz" &&
+        parameters.toExtension === "pdf" && (
+          <>
+            <Divider />
+            <ConvertFromCbzSettings
+              parameters={parameters}
+              onParameterChange={onParameterChange}
+              disabled={disabled}
+            />
+          </>
+        )}
 
       {/* PDF to CBZ options */}
-      {parameters.fromExtension === 'pdf' && parameters.toExtension === 'cbz' && (
-        <>
-          <Divider />
-          <ConvertToCbzSettings
-            parameters={parameters}
-            onParameterChange={onParameterChange}
-            disabled={disabled}
-          />
-        </>
-      )}
+      {parameters.fromExtension === "pdf" &&
+        parameters.toExtension === "cbz" && (
+          <>
+            <Divider />
+            <ConvertToCbzSettings
+              parameters={parameters}
+              onParameterChange={onParameterChange}
+              disabled={disabled}
+            />
+          </>
+        )}
 
       {/* PDF to PDF/A options */}
-      {parameters.fromExtension === 'pdf' && parameters.toExtension === 'pdfa' && (
-        <>
-          <Divider />
-          <ConvertToPdfaSettings
-            parameters={parameters}
-            onParameterChange={onParameterChange}
-            selectedFiles={selectedFiles}
-            disabled={disabled}
-          />
-        </>
-      )}
+      {parameters.fromExtension === "pdf" &&
+        parameters.toExtension === "pdfa" && (
+          <>
+            <Divider />
+            <ConvertToPdfaSettings
+              parameters={parameters}
+              onParameterChange={onParameterChange}
+              selectedFiles={selectedFiles}
+              disabled={disabled}
+            />
+          </>
+        )}
 
       {/* PDF to PDF/X options */}
-      {parameters.fromExtension === 'pdf' && parameters.toExtension === 'pdfx' && (
-        <>
-          <Divider />
-          <ConvertToPdfxSettings
-            parameters={parameters}
-            onParameterChange={onParameterChange}
-            selectedFiles={selectedFiles}
-            disabled={disabled}
-          />
-        </>
-      )}
+      {parameters.fromExtension === "pdf" &&
+        parameters.toExtension === "pdfx" && (
+          <>
+            <Divider />
+            <ConvertToPdfxSettings
+              parameters={parameters}
+              onParameterChange={onParameterChange}
+              selectedFiles={selectedFiles}
+              disabled={disabled}
+            />
+          </>
+        )}
 
       {/* eBook to PDF options */}
-      {['epub', 'mobi', 'azw3', 'fb2'].includes(parameters.fromExtension) && parameters.toExtension === 'pdf' && (
-        <>
-          <Divider />
-          <ConvertFromEbookSettings
-            parameters={parameters}
-            onParameterChange={onParameterChange}
-            disabled={disabled}
-          />
-        </>
-      )}
+      {["epub", "mobi", "azw3", "fb2"].includes(parameters.fromExtension) &&
+        parameters.toExtension === "pdf" && (
+          <>
+            <Divider />
+            <ConvertFromEbookSettings
+              parameters={parameters}
+              onParameterChange={onParameterChange}
+              disabled={disabled}
+            />
+          </>
+        )}
 
       {/* CBR to PDF options */}
-      {parameters.fromExtension === 'cbr' && parameters.toExtension === 'pdf' && (
-        <>
-          <Divider />
-          <ConvertFromCbrSettings
-            parameters={parameters}
-            onParameterChange={onParameterChange}
-            disabled={disabled}
-          />
-        </>
-      )}
+      {parameters.fromExtension === "cbr" &&
+        parameters.toExtension === "pdf" && (
+          <>
+            <Divider />
+            <ConvertFromCbrSettings
+              parameters={parameters}
+              onParameterChange={onParameterChange}
+              disabled={disabled}
+            />
+          </>
+        )}
 
       {/* PDF to CBR options */}
-      {parameters.fromExtension === 'pdf' && parameters.toExtension === 'cbr' && (
-        <>
-          <Divider />
-          <ConvertToCbrSettings
-            parameters={parameters}
-            onParameterChange={onParameterChange}
-            disabled={disabled}
-          />
-        </>
-      )}
+      {parameters.fromExtension === "pdf" &&
+        parameters.toExtension === "cbr" && (
+          <>
+            <Divider />
+            <ConvertToCbrSettings
+              parameters={parameters}
+              onParameterChange={onParameterChange}
+              disabled={disabled}
+            />
+          </>
+        )}
 
       {/* PDF to EPUB/AZW3 options */}
-      {parameters.fromExtension === 'pdf' && ['epub', 'azw3'].includes(parameters.toExtension) && (
-        <>
-          <Divider />
-          <ConvertToEpubSettings
-            parameters={parameters}
-            onParameterChange={onParameterChange}
-            disabled={disabled}
-          />
-        </>
-      )}
-
+      {parameters.fromExtension === "pdf" &&
+        ["epub", "azw3"].includes(parameters.toExtension) && (
+          <>
+            <Divider />
+            <ConvertToEpubSettings
+              parameters={parameters}
+              onParameterChange={onParameterChange}
+              disabled={disabled}
+            />
+          </>
+        )}
     </Stack>
   );
 };
diff --git a/frontend/src/core/components/tools/convert/ConvertToCbrSettings.tsx b/frontend/src/core/components/tools/convert/ConvertToCbrSettings.tsx
index db85eda774..4a57e01834 100644
--- a/frontend/src/core/components/tools/convert/ConvertToCbrSettings.tsx
+++ b/frontend/src/core/components/tools/convert/ConvertToCbrSettings.tsx
@@ -4,28 +4,36 @@ import { ConvertParameters } from "@app/hooks/tools/convert/useConvertParameters
 
 interface ConvertToCbrSettingsProps {
   parameters: ConvertParameters;
-  onParameterChange: <K extends keyof ConvertParameters>(key: K, value: ConvertParameters[K]) => void;
+  onParameterChange: <K extends keyof ConvertParameters>(
+    key: K,
+    value: ConvertParameters[K],
+  ) => void;
   disabled?: boolean;
 }
 
 const ConvertToCbrSettings = ({
   parameters,
   onParameterChange,
-  disabled = false
+  disabled = false,
 }: ConvertToCbrSettingsProps) => {
   const { t } = useTranslation();
 
   return (
     <Stack gap="sm" data-testid="cbr-output-settings">
-      <Text size="sm" fw={500}>{t("convert.cbrOutputOptions", "PDF to CBR Options")}:</Text>
+      <Text size="sm" fw={500}>
+        {t("convert.cbrOutputOptions", "PDF to CBR Options")}:
+      </Text>
 
       <NumberInput
         data-testid="cbr-dpi-input"
         label={t("convert.cbrDpi", "DPI for image rendering")}
         value={parameters.pdfToCbrOptions.dpi}
         onChange={(val) =>
-          typeof val === 'number' &&
-          onParameterChange('pdfToCbrOptions', { ...parameters.pdfToCbrOptions, dpi: val })
+          typeof val === "number" &&
+          onParameterChange("pdfToCbrOptions", {
+            ...parameters.pdfToCbrOptions,
+            dpi: val,
+          })
         }
         min={72}
         max={600}
diff --git a/frontend/src/core/components/tools/convert/ConvertToCbzSettings.tsx b/frontend/src/core/components/tools/convert/ConvertToCbzSettings.tsx
index 774219ea57..a9fef27c5a 100644
--- a/frontend/src/core/components/tools/convert/ConvertToCbzSettings.tsx
+++ b/frontend/src/core/components/tools/convert/ConvertToCbzSettings.tsx
@@ -1,32 +1,40 @@
-import { Stack, Text, NumberInput } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { ConvertParameters } from '@app/hooks/tools/convert/useConvertParameters';
+import { Stack, Text, NumberInput } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import { ConvertParameters } from "@app/hooks/tools/convert/useConvertParameters";
 
 interface ConvertToCbzSettingsProps {
   parameters: ConvertParameters;
-  onParameterChange: <K extends keyof ConvertParameters>(key: K, value: ConvertParameters[K]) => void;
+  onParameterChange: <K extends keyof ConvertParameters>(
+    key: K,
+    value: ConvertParameters[K],
+  ) => void;
   disabled?: boolean;
 }
 
 const ConvertToCbzSettings = ({
   parameters,
   onParameterChange,
-  disabled = false
+  disabled = false,
 }: ConvertToCbzSettingsProps) => {
   const { t } = useTranslation();
 
   return (
     <Stack gap="sm" data-testid="cbz-output-settings">
-      <Text size="sm" fw={500}>{t('convert.cbzOutputOptions', 'PDF to CBZ Options')}:</Text>
+      <Text size="sm" fw={500}>
+        {t("convert.cbzOutputOptions", "PDF to CBZ Options")}:
+      </Text>
 
       <NumberInput
         data-testid="cbz-dpi-input"
-        label={t('convert.cbzDpi', 'DPI for image rendering')}
+        label={t("convert.cbzDpi", "DPI for image rendering")}
         value={parameters.cbzOutputOptions.dpi}
-        onChange={(val) => typeof val === 'number' && onParameterChange('cbzOutputOptions', {
-          ...parameters.cbzOutputOptions,
-          dpi: val
-        })}
+        onChange={(val) =>
+          typeof val === "number" &&
+          onParameterChange("cbzOutputOptions", {
+            ...parameters.cbzOutputOptions,
+            dpi: val,
+          })
+        }
         min={72}
         max={600}
         step={1}
diff --git a/frontend/src/core/components/tools/convert/ConvertToEpubSettings.tsx b/frontend/src/core/components/tools/convert/ConvertToEpubSettings.tsx
index e732ea330f..1ef5c70f5e 100644
--- a/frontend/src/core/components/tools/convert/ConvertToEpubSettings.tsx
+++ b/frontend/src/core/components/tools/convert/ConvertToEpubSettings.tsx
@@ -5,40 +5,53 @@ import { Z_INDEX_AUTOMATE_DROPDOWN } from "@app/styles/zIndex";
 
 interface ConvertToEpubSettingsProps {
   parameters: ConvertParameters;
-  onParameterChange: <K extends keyof ConvertParameters>(key: K, value: ConvertParameters[K]) => void;
+  onParameterChange: <K extends keyof ConvertParameters>(
+    key: K,
+    value: ConvertParameters[K],
+  ) => void;
   disabled?: boolean;
 }
 
 const ConvertToEpubSettings = ({
   parameters,
   onParameterChange,
-  disabled = false
+  disabled = false,
 }: ConvertToEpubSettingsProps) => {
   const { t } = useTranslation();
 
   const handleDetectChaptersChange = (value: boolean) => {
-    onParameterChange('epubOptions', {
+    onParameterChange("epubOptions", {
       detectChapters: value,
-      targetDevice: parameters.epubOptions?.targetDevice ?? 'TABLET_PHONE_IMAGES',
-      outputFormat: parameters.epubOptions?.outputFormat ?? parameters.toExtension === 'azw3' ? 'AZW3' : 'EPUB',
+      targetDevice:
+        parameters.epubOptions?.targetDevice ?? "TABLET_PHONE_IMAGES",
+      outputFormat:
+        (parameters.epubOptions?.outputFormat ??
+        parameters.toExtension === "azw3")
+          ? "AZW3"
+          : "EPUB",
     });
   };
 
   const handleTargetDeviceChange = (value: string | null) => {
     if (value) {
-      onParameterChange('epubOptions', {
+      onParameterChange("epubOptions", {
         detectChapters: parameters.epubOptions?.detectChapters ?? true,
         targetDevice: value,
-        outputFormat: parameters.epubOptions?.outputFormat ?? parameters.toExtension === 'azw3' ? 'AZW3' : 'EPUB',
+        outputFormat:
+          (parameters.epubOptions?.outputFormat ??
+          parameters.toExtension === "azw3")
+            ? "AZW3"
+            : "EPUB",
       });
     }
   };
 
   const handleOutputFormatChange = (value: string | null) => {
     if (value) {
-      onParameterChange('epubOptions', {
+      onParameterChange("epubOptions", {
         detectChapters: parameters.epubOptions?.detectChapters ?? true,
-        targetDevice: parameters.epubOptions?.targetDevice ?? 'TABLET_PHONE_IMAGES',
+        targetDevice:
+          parameters.epubOptions?.targetDevice ?? "TABLET_PHONE_IMAGES",
         outputFormat: value,
       });
     }
@@ -47,57 +60,86 @@ const ConvertToEpubSettings = ({
   // Initialize epubOptions if not present, set output format based on toExtension
   const epubOptions = parameters.epubOptions || {
     detectChapters: true,
-    targetDevice: 'TABLET_PHONE_IMAGES',
-    outputFormat: parameters.toExtension === 'azw3' ? 'AZW3' : 'EPUB',
+    targetDevice: "TABLET_PHONE_IMAGES",
+    outputFormat: parameters.toExtension === "azw3" ? "AZW3" : "EPUB",
   };
 
   // Sync output format with selected target extension if not manually set
-  if (parameters.toExtension === 'azw3' && epubOptions.outputFormat !== 'AZW3') {
-    handleOutputFormatChange('AZW3');
-  } else if (parameters.toExtension === 'epub' && epubOptions.outputFormat !== 'EPUB') {
-    handleOutputFormatChange('EPUB');
+  if (
+    parameters.toExtension === "azw3" &&
+    epubOptions.outputFormat !== "AZW3"
+  ) {
+    handleOutputFormatChange("AZW3");
+  } else if (
+    parameters.toExtension === "epub" &&
+    epubOptions.outputFormat !== "EPUB"
+  ) {
+    handleOutputFormatChange("EPUB");
   }
 
   return (
     <Stack gap="sm" data-testid="epub-settings">
       <Checkbox
         label={t("convert.epubOptions.detectChapters", "Detect chapters")}
-        description={t("convert.epubOptions.detectChaptersDesc", "Detect headings that look like chapters and insert EPUB page breaks")}
+        description={t(
+          "convert.epubOptions.detectChaptersDesc",
+          "Detect headings that look like chapters and insert EPUB page breaks",
+        )}
         checked={epubOptions.detectChapters}
-        onChange={(event) => handleDetectChaptersChange(event.currentTarget.checked)}
+        onChange={(event) =>
+          handleDetectChaptersChange(event.currentTarget.checked)
+        }
         disabled={disabled}
       />
-      
+
       <Select
         label={t("convert.epubOptions.targetDevice", "Target device")}
-        description={t("convert.epubOptions.targetDeviceDesc", "Choose an output profile optimized for the reader device")}
+        description={t(
+          "convert.epubOptions.targetDeviceDesc",
+          "Choose an output profile optimized for the reader device",
+        )}
         value={epubOptions.targetDevice}
         onChange={handleTargetDeviceChange}
         disabled={disabled}
         data={[
-          { 
-            value: 'TABLET_PHONE_IMAGES', 
-            label: t("convert.epubOptions.tabletPhone", "Tablet/Phone (with images)") 
+          {
+            value: "TABLET_PHONE_IMAGES",
+            label: t(
+              "convert.epubOptions.tabletPhone",
+              "Tablet/Phone (with images)",
+            ),
+          },
+          {
+            value: "KINDLE_EINK_TEXT",
+            label: t(
+              "convert.epubOptions.kindleEink",
+              "Kindle e-Ink (text optimized)",
+            ),
           },
-          { 
-            value: 'KINDLE_EINK_TEXT', 
-            label: t("convert.epubOptions.kindleEink", "Kindle e-Ink (text optimized)") 
-          }
         ]}
-        comboboxProps={{ withinPortal: true, zIndex: Z_INDEX_AUTOMATE_DROPDOWN }}
+        comboboxProps={{
+          withinPortal: true,
+          zIndex: Z_INDEX_AUTOMATE_DROPDOWN,
+        }}
       />
 
       <Select
         label={t("convert.epubOptions.outputFormat", "Output format")}
-        description={t("convert.epubOptions.outputFormatDesc", "Choose the output format for the ebook")}
+        description={t(
+          "convert.epubOptions.outputFormatDesc",
+          "Choose the output format for the ebook",
+        )}
         value={epubOptions.outputFormat}
         onChange={handleOutputFormatChange}
         disabled={disabled}
         data={[
-          { value: 'EPUB', label: 'EPUB' },
-          { value: 'AZW3', label: 'AZW3' }
+          { value: "EPUB", label: "EPUB" },
+          { value: "AZW3", label: "AZW3" },
         ]}
-        comboboxProps={{ withinPortal: true, zIndex: Z_INDEX_AUTOMATE_DROPDOWN }}
+        comboboxProps={{
+          withinPortal: true,
+          zIndex: Z_INDEX_AUTOMATE_DROPDOWN,
+        }}
       />
     </Stack>
   );
diff --git a/frontend/src/core/components/tools/convert/ConvertToImageSettings.tsx b/frontend/src/core/components/tools/convert/ConvertToImageSettings.tsx
index 98eb66c93e..afa110905f 100644
--- a/frontend/src/core/components/tools/convert/ConvertToImageSettings.tsx
+++ b/frontend/src/core/components/tools/convert/ConvertToImageSettings.tsx
@@ -6,45 +6,65 @@ import { Z_INDEX_AUTOMATE_DROPDOWN } from "@app/styles/zIndex";
 
 interface ConvertToImageSettingsProps {
   parameters: ConvertParameters;
-  onParameterChange: <K extends keyof ConvertParameters>(key: K, value: ConvertParameters[K]) => void;
+  onParameterChange: <K extends keyof ConvertParameters>(
+    key: K,
+    value: ConvertParameters[K],
+  ) => void;
   disabled?: boolean;
 }
 
 const ConvertToImageSettings = ({
   parameters,
   onParameterChange,
-  disabled = false
+  disabled = false,
 }: ConvertToImageSettingsProps) => {
   const { t } = useTranslation();
 
   return (
     <Stack gap="sm" data-testid="image-options-section">
-      <Text size="sm" fw={500} data-testid="image-options-title">{t("convert.imageOptions", "Image Options")}:</Text>
+      <Text size="sm" fw={500} data-testid="image-options-title">
+        {t("convert.imageOptions", "Image Options")}:
+      </Text>
       <Group grow>
         <Select
           data-testid="color-type-select"
           label={t("convert.colorType", "Color Type")}
           value={parameters.imageOptions.colorType}
-          onChange={(val) => val && onParameterChange('imageOptions', {
-            ...parameters.imageOptions,
-            colorType: val as typeof COLOR_TYPES[keyof typeof COLOR_TYPES]
-          })}
+          onChange={(val) =>
+            val &&
+            onParameterChange("imageOptions", {
+              ...parameters.imageOptions,
+              colorType: val as (typeof COLOR_TYPES)[keyof typeof COLOR_TYPES],
+            })
+          }
           data={[
             { value: COLOR_TYPES.COLOR, label: t("convert.color", "Color") },
-            { value: COLOR_TYPES.GRAYSCALE, label: t("convert.grayscale", "Grayscale") },
-            { value: COLOR_TYPES.BLACK_WHITE, label: t("convert.blackwhite", "Black & White") },
+            {
+              value: COLOR_TYPES.GRAYSCALE,
+              label: t("convert.grayscale", "Grayscale"),
+            },
+            {
+              value: COLOR_TYPES.BLACK_WHITE,
+              label: t("convert.blackwhite", "Black & White"),
+            },
           ]}
           disabled={disabled}
-          comboboxProps={{ withinPortal: true, zIndex: Z_INDEX_AUTOMATE_DROPDOWN }}
+          comboboxProps={{
+            withinPortal: true,
+            zIndex: Z_INDEX_AUTOMATE_DROPDOWN,
+          }}
         />
         <NumberInput
           data-testid="dpi-input"
           label={t("convert.dpi", "DPI")}
           value={parameters.imageOptions.dpi}
-          onChange={(val) => typeof val === 'number' && onParameterChange('imageOptions', {
-            ...parameters.imageOptions,
-            dpi: val
-          })}
+          onChange={(val) =>
+            typeof val === "number" &&
+            onParameterChange("imageOptions", {
+              ...parameters.imageOptions,
+              dpi: val,
+            })
+          }
           min={72}
           max={600}
           step={1}
@@ -55,16 +75,29 @@ const ConvertToImageSettings = ({
         data-testid="output-type-select"
         label={t("convert.output", "Output")}
         value={parameters.imageOptions.singleOrMultiple}
-        onChange={(val) => val && onParameterChange('imageOptions', {
-          ...parameters.imageOptions,
-          singleOrMultiple: val as typeof OUTPUT_OPTIONS[keyof typeof OUTPUT_OPTIONS]
-        })}
+        onChange={(val) =>
+          val &&
+          onParameterChange("imageOptions", {
+            ...parameters.imageOptions,
+            singleOrMultiple:
+              val as (typeof OUTPUT_OPTIONS)[keyof typeof OUTPUT_OPTIONS],
+          })
+        }
         data={[
-          { value: OUTPUT_OPTIONS.SINGLE, label: t("convert.single", "Single") },
-          { value: OUTPUT_OPTIONS.MULTIPLE, label: t("convert.multiple", "Multiple") },
+          {
+            value: OUTPUT_OPTIONS.SINGLE,
+            label: t("convert.single", "Single"),
+          },
+          {
+            value: OUTPUT_OPTIONS.MULTIPLE,
+            label: t("convert.multiple", "Multiple"),
+          },
         ]}
         disabled={disabled}
-        comboboxProps={{ withinPortal: true, zIndex: Z_INDEX_AUTOMATE_DROPDOWN }}
+        comboboxProps={{
+          withinPortal: true,
+          zIndex: Z_INDEX_AUTOMATE_DROPDOWN,
+        }}
       />
     </Stack>
   );
diff --git a/frontend/src/core/components/tools/convert/ConvertToPdfaSettings.tsx b/frontend/src/core/components/tools/convert/ConvertToPdfaSettings.tsx
index 85746688e7..9a877889a8 100644
--- a/frontend/src/core/components/tools/convert/ConvertToPdfaSettings.tsx
+++ b/frontend/src/core/components/tools/convert/ConvertToPdfaSettings.tsx
@@ -1,13 +1,16 @@
-import { Stack, Text, Select, Alert, Checkbox } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { ConvertParameters } from '@app/hooks/tools/convert/useConvertParameters';
-import { usePdfSignatureDetection } from '@app/hooks/usePdfSignatureDetection';
-import { StirlingFile } from '@app/types/fileContext';
+import { Stack, Text, Select, Alert, Checkbox } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import { ConvertParameters } from "@app/hooks/tools/convert/useConvertParameters";
+import { usePdfSignatureDetection } from "@app/hooks/usePdfSignatureDetection";
+import { StirlingFile } from "@app/types/fileContext";
 import { Z_INDEX_AUTOMATE_DROPDOWN } from "@app/styles/zIndex";
 
 interface ConvertToPdfaSettingsProps {
   parameters: ConvertParameters;
-  onParameterChange: <K extends keyof ConvertParameters>(key: K, value: ConvertParameters[K]) => void;
+  onParameterChange: <K extends keyof ConvertParameters>(
+    key: K,
+    value: ConvertParameters[K],
+  ) => void;
   selectedFiles: StirlingFile[];
   disabled?: boolean;
 }
@@ -16,55 +19,76 @@ const ConvertToPdfaSettings = ({
   parameters,
   onParameterChange,
   selectedFiles,
-  disabled = false
+  disabled = false,
 }: ConvertToPdfaSettingsProps) => {
   const { t } = useTranslation();
-  const { hasDigitalSignatures, isChecking } = usePdfSignatureDetection(selectedFiles);
+  const { hasDigitalSignatures, isChecking } =
+    usePdfSignatureDetection(selectedFiles);
 
   const pdfaFormatOptions = [
-    { value: 'pdfa-1', label: 'PDF/A-1b' },
-    { value: 'pdfa-2b', label: 'PDF/A-2b' },
-    { value: 'pdfa-3b', label: 'PDF/A-3b' }
+    { value: "pdfa-1", label: "PDF/A-1b" },
+    { value: "pdfa-2b", label: "PDF/A-2b" },
+    { value: "pdfa-3b", label: "PDF/A-3b" },
   ];
 
   return (
     <Stack gap="sm" data-testid="pdfa-settings">
-      <Text size="sm" fw={500}>{t("convert.pdfaOptions", "PDF/A Options")}:</Text>
+      <Text size="sm" fw={500}>
+        {t("convert.pdfaOptions", "PDF/A Options")}:
+      </Text>
 
       {hasDigitalSignatures && (
         <Alert color="yellow">
           <Text size="sm">
-            {t("convert.pdfaDigitalSignatureWarning", "The PDF contains a digital signature. This will be removed in the next step.")}
+            {t(
+              "convert.pdfaDigitalSignatureWarning",
+              "The PDF contains a digital signature. This will be removed in the next step.",
+            )}
           </Text>
         </Alert>
       )}
 
       <Stack gap="xs">
-        <Text size="xs" fw={500}>{t("convert.outputFormat", "Output Format")}:</Text>
+        <Text size="xs" fw={500}>
+          {t("convert.outputFormat", "Output Format")}:
+        </Text>
         <Select
           value={parameters.pdfaOptions.outputFormat}
-          onChange={(value) => onParameterChange('pdfaOptions', {
-            ...parameters.pdfaOptions,
-            outputFormat: value || 'pdfa-2b'
-          })}
+          onChange={(value) =>
+            onParameterChange("pdfaOptions", {
+              ...parameters.pdfaOptions,
+              outputFormat: value || "pdfa-2b",
+            })
+          }
           data={pdfaFormatOptions}
           disabled={disabled || isChecking}
           data-testid="pdfa-output-format-select"
-          comboboxProps={{ withinPortal: true, zIndex: Z_INDEX_AUTOMATE_DROPDOWN }}
+          comboboxProps={{
+            withinPortal: true,
+            zIndex: Z_INDEX_AUTOMATE_DROPDOWN,
+          }}
         />
         <Text size="xs" c="dimmed">
-          {t("convert.pdfaNote", "PDF/A-1b is more compatible, PDF/A-2b supports more features, PDF/A-3b supports embedded files.")}
+          {t(
+            "convert.pdfaNote",
+            "PDF/A-1b is more compatible, PDF/A-2b supports more features, PDF/A-3b supports embedded files.",
+          )}
         </Text>
       </Stack>
 
       <Checkbox
         label={t("convert.strictMode", "Strict Mode")}
-        description={t("convert.strictModeDesc", "Error if conversion is not perfect (uses VeraPDF verification)")}
+        description={t(
+          "convert.strictModeDesc",
+          "Error if conversion is not perfect (uses VeraPDF verification)",
+        )}
         checked={parameters.pdfaOptions.strict}
-        onChange={(event) => onParameterChange('pdfaOptions', {
-          ...parameters.pdfaOptions,
-          strict: event.currentTarget.checked
-        })}
+        onChange={(event) =>
+          onParameterChange("pdfaOptions", {
+            ...parameters.pdfaOptions,
+            strict: event.currentTarget.checked,
+          })
+        }
         disabled={disabled || isChecking}
       />
     </Stack>
diff --git a/frontend/src/core/components/tools/convert/ConvertToPdfxSettings.tsx b/frontend/src/core/components/tools/convert/ConvertToPdfxSettings.tsx
index 6d2d3ce632..5adc41df83 100644
--- a/frontend/src/core/components/tools/convert/ConvertToPdfxSettings.tsx
+++ b/frontend/src/core/components/tools/convert/ConvertToPdfxSettings.tsx
@@ -1,10 +1,13 @@
-import { useEffect } from 'react';
-import { ConvertParameters } from '@app/hooks/tools/convert/useConvertParameters';
-import { StirlingFile } from '@app/types/fileContext';
+import { useEffect } from "react";
+import { ConvertParameters } from "@app/hooks/tools/convert/useConvertParameters";
+import { StirlingFile } from "@app/types/fileContext";
 
 interface ConvertToPdfxSettingsProps {
   parameters: ConvertParameters;
-  onParameterChange: <K extends keyof ConvertParameters>(key: K, value: ConvertParameters[K]) => void;
+  onParameterChange: <K extends keyof ConvertParameters>(
+    key: K,
+    value: ConvertParameters[K],
+  ) => void;
   selectedFiles: StirlingFile[];
   disabled?: boolean;
 }
@@ -13,14 +16,14 @@ const ConvertToPdfxSettings = ({
   parameters,
   onParameterChange,
   selectedFiles: _selectedFiles,
-  disabled: _disabled = false
+  disabled: _disabled = false,
 }: ConvertToPdfxSettingsProps) => {
   // Automatically set PDF/X-3 format when this component is rendered
   useEffect(() => {
-    if (parameters.pdfxOptions.outputFormat !== 'pdfx-3') {
-      onParameterChange('pdfxOptions', {
+    if (parameters.pdfxOptions.outputFormat !== "pdfx-3") {
+      onParameterChange("pdfxOptions", {
         ...parameters.pdfxOptions,
-        outputFormat: 'pdfx-3'
+        outputFormat: "pdfx-3",
       });
     }
   }, [parameters.pdfxOptions.outputFormat, onParameterChange]);
diff --git a/frontend/src/core/components/tools/convert/GroupedFormatDropdown.tsx b/frontend/src/core/components/tools/convert/GroupedFormatDropdown.tsx
index e4b9a040a3..296a91056a 100644
--- a/frontend/src/core/components/tools/convert/GroupedFormatDropdown.tsx
+++ b/frontend/src/core/components/tools/convert/GroupedFormatDropdown.tsx
@@ -1,5 +1,14 @@
 import { useState, useMemo } from "react";
-import { Stack, Text, Group, Button, Box, Popover, UnstyledButton, useMantineTheme, useMantineColorScheme } from "@mantine/core";
+import {
+  Stack,
+  Text,
+  Group,
+  Button,
+  Box,
+  Popover,
+  UnstyledButton,
+  useMantineTheme,
+} from "@mantine/core";
 import KeyboardArrowDownIcon from "@mui/icons-material/KeyboardArrowDown";
 import CloudOutlinedIcon from "@mui/icons-material/CloudOutlined";
 import { Z_INDEX_AUTOMATE_DROPDOWN } from "@app/styles/zIndex";
@@ -33,16 +42,15 @@ const GroupedFormatDropdown = ({
   minWidth = "18.75rem",
   name,
   withinPortal = true,
-  zIndex = Z_INDEX_AUTOMATE_DROPDOWN
+  zIndex = Z_INDEX_AUTOMATE_DROPDOWN,
 }: GroupedFormatDropdownProps) => {
   const [dropdownOpened, setDropdownOpened] = useState(false);
   const theme = useMantineTheme();
-  const { colorScheme } = useMantineColorScheme();
 
   const groupedOptions = useMemo(() => {
     const groups: Record<string, FormatOption[]> = {};
 
-    options.forEach(option => {
+    options.forEach((option) => {
       if (!groups[option.group]) {
         groups[option.group] = [];
       }
@@ -54,8 +62,10 @@ const GroupedFormatDropdown = ({
 
   const selectedLabel = useMemo(() => {
     if (!value) return placeholder;
-    const selected = options.find(opt => opt.value === value);
-    return selected ? `${selected.group} (${selected.label})` : value.toUpperCase();
+    const selected = options.find((opt) => opt.value === value);
+    return selected
+      ? `${selected.group} (${selected.label})`
+      : value.toUpperCase();
   }, [value, options, placeholder]);
 
   const handleOptionSelect = (selectedValue: string) => {
@@ -83,31 +93,29 @@ const GroupedFormatDropdown = ({
           onClick={() => setDropdownOpened(!dropdownOpened)}
           disabled={disabled}
           style={{
-            padding: '0.5rem 0.75rem',
+            padding: "0.5rem 0.75rem",
             border: `0.0625rem solid ${theme.colors.gray[4]}`,
             borderRadius: theme.radius.sm,
             backgroundColor: disabled
               ? theme.colors.gray[1]
-              : colorScheme === 'dark'
-                ? theme.colors.dark[6]
-                : theme.white,
-            cursor: disabled ? 'not-allowed' : 'pointer',
-            width: '100%',
+              : "var(--dropdown-trigger-bg)",
+            cursor: disabled ? "not-allowed" : "pointer",
+            width: "100%",
             color: disabled
-              ? colorScheme === 'dark' ? theme.colors.dark[1] : theme.colors.dark[7]
-              : colorScheme === 'dark' ? theme.colors.dark[0] : theme.colors.dark[9]
+              ? "var(--dropdown-trigger-text-disabled)"
+              : "var(--dropdown-trigger-text)",
           }}
         >
           <Group justify="space-between">
-            <Text size="sm" c={value ? undefined : 'dimmed'}>
+            <Text size="sm" c={value ? undefined : "dimmed"}>
               {selectedLabel}
             </Text>
             <KeyboardArrowDownIcon
               style={{
-                fontSize: '1rem',
-                transform: dropdownOpened ? 'rotate(180deg)' : 'rotate(0deg)',
-                transition: 'transform 0.2s ease',
-                color: colorScheme === 'dark' ? theme.colors.dark[2] : theme.colors.gray[6]
+                fontSize: "1rem",
+                transform: dropdownOpened ? "rotate(180deg)" : "rotate(0deg)",
+                transition: "transform 0.2s ease",
+                color: "var(--dropdown-trigger-icon)",
               }}
             />
           </Group>
@@ -115,12 +123,12 @@ const GroupedFormatDropdown = ({
       </Popover.Target>
       <Popover.Dropdown
         style={{
-          minWidth: Math.min(350, parseInt(minWidth.replace('rem', '')) * 16),
-          maxWidth: '90vw',
-          maxHeight: '40vh',
-          overflow: 'auto',
-          backgroundColor: colorScheme === 'dark' ? theme.colors.dark[7] : theme.white,
-          border: `0.0625rem solid ${colorScheme === 'dark' ? theme.colors.dark[4] : theme.colors.gray[4]}`,
+          minWidth: Math.min(350, parseInt(minWidth.replace("rem", "")) * 16),
+          maxWidth: "90vw",
+          maxHeight: "40vh",
+          overflow: "auto",
+          backgroundColor: "var(--dropdown-panel-bg)",
+          border: `0.0625rem solid var(--dropdown-panel-border)`,
         }}
       >
         <Stack gap="md">
@@ -129,12 +137,12 @@ const GroupedFormatDropdown = ({
               <Text
                 size="sm"
                 fw={600}
-                c={colorScheme === 'dark' ? 'dark.2' : 'gray.6'}
                 mb="xs"
+                style={{ color: "var(--dropdown-group-label)" }}
               >
                 {groupName}
               </Text>
-              <Group gap="xs" style={{ flexWrap: 'wrap' }}>
+              <Group gap="xs" style={{ flexWrap: "wrap" }}>
                 {groupOptions.map((option) => (
                   <Button
                     key={option.value}
@@ -144,20 +152,20 @@ const GroupedFormatDropdown = ({
                     onClick={() => handleOptionSelect(option.value)}
                     disabled={option.enabled === false}
                     style={{
-                      fontSize: '0.75rem',
-                      height: '2rem',
-                      padding: '0 0.75rem',
+                      fontSize: "0.75rem",
+                      height: "2rem",
+                      padding: "0 0.75rem",
                       flexShrink: 0,
-                      position: 'relative'
+                      position: "relative",
                     }}
                   >
                     {option.label}
                     {option.usesCloud && (
                       <CloudOutlinedIcon
                         style={{
-                          fontSize: '0.625rem',
-                          marginLeft: '0.25rem',
-                          opacity: 0.7
+                          fontSize: "0.625rem",
+                          marginLeft: "0.25rem",
+                          opacity: 0.7,
                         }}
                       />
                     )}
diff --git a/frontend/src/core/components/tools/crop/CropAreaSelector.tsx b/frontend/src/core/components/tools/crop/CropAreaSelector.tsx
index 5139f99efe..c43f3f9bf1 100644
--- a/frontend/src/core/components/tools/crop/CropAreaSelector.tsx
+++ b/frontend/src/core/components/tools/crop/CropAreaSelector.tsx
@@ -1,14 +1,14 @@
-import React, { useRef, useState, useCallback, useEffect } from 'react';
-import { Box, useMantineTheme, MantineTheme } from '@mantine/core';
+import React, { useRef, useState, useCallback, useEffect } from "react";
+import { Box, useMantineTheme, MantineTheme } from "@mantine/core";
 import {
   PDFBounds,
   Rectangle,
   domToPDFCoordinates,
   pdfToDOMCoordinates,
   constrainDOMRectToThumbnail,
-  isPointInThumbnail
-} from '@app/utils/cropCoordinates';
-import { type ResizeHandle } from '@app/constants/cropConstants';
+  isPointInThumbnail,
+} from "@app/utils/cropCoordinates";
+import { type ResizeHandle } from "@app/constants/cropConstants";
 
 interface CropAreaSelectorProps {
   /** PDF bounds for coordinate conversion */
@@ -28,7 +28,7 @@ const CropAreaSelector: React.FC<CropAreaSelectorProps> = ({
   cropArea,
   onCropAreaChange,
   disabled = false,
-  children
+  children,
 }) => {
   const theme = useMantineTheme();
   const containerRef = useRef<HTMLDivElement>(null);
@@ -43,87 +43,113 @@ const CropAreaSelector: React.FC<CropAreaSelectorProps> = ({
   const domRect = pdfToDOMCoordinates(cropArea, pdfBounds);
 
   // Handle mouse down on overlay (start dragging or resizing)
-  const handleOverlayMouseDown = useCallback((e: React.MouseEvent) => {
-    if (disabled || !containerRef.current) return;
+  const handleOverlayMouseDown = useCallback(
+    (e: React.MouseEvent) => {
+      if (disabled || !containerRef.current) return;
 
-    e.preventDefault();
-    e.stopPropagation();
+      e.preventDefault();
+      e.stopPropagation();
 
-    const rect = containerRef.current.getBoundingClientRect();
-    const x = e.clientX - rect.left;
-    const y = e.clientY - rect.top;
+      const rect = containerRef.current.getBoundingClientRect();
+      const x = e.clientX - rect.left;
+      const y = e.clientY - rect.top;
 
-    // Check if we're clicking on a resize handle first (higher priority)
-    const handle = getResizeHandle(x, y, domRect);
+      // Check if we're clicking on a resize handle first (higher priority)
+      const handle = getResizeHandle(x, y, domRect);
 
-    if (handle) {
-      setIsResizing(handle);
-      setInitialCropArea(cropArea);
-      setIsDragging(false); // Ensure we're not dragging when resizing
-    } else if (isPointInCropArea(x, y, domRect)) {
-      // Only allow dragging if we're not on a resize handle
-      setIsDragging(true);
-      setIsResizing(null); // Ensure we're not resizing when dragging
-      setDragStart({ x: x - domRect.x, y: y - domRect.y });
-    }
-  }, [disabled, cropArea, domRect]);
+      if (handle) {
+        setIsResizing(handle);
+        setInitialCropArea(cropArea);
+        setIsDragging(false); // Ensure we're not dragging when resizing
+      } else if (isPointInCropArea(x, y, domRect)) {
+        // Only allow dragging if we're not on a resize handle
+        setIsDragging(true);
+        setIsResizing(null); // Ensure we're not resizing when dragging
+        setDragStart({ x: x - domRect.x, y: y - domRect.y });
+      }
+    },
+    [disabled, cropArea, domRect],
+  );
 
   // Handle mouse down on container (start new selection)
-  const handleContainerMouseDown = useCallback((e: React.MouseEvent) => {
-    if (disabled || !containerRef.current) return;
+  const handleContainerMouseDown = useCallback(
+    (e: React.MouseEvent) => {
+      if (disabled || !containerRef.current) return;
 
-    const rect = containerRef.current.getBoundingClientRect();
-    const x = e.clientX - rect.left;
-    const y = e.clientY - rect.top;
+      const rect = containerRef.current.getBoundingClientRect();
+      const x = e.clientX - rect.left;
+      const y = e.clientY - rect.top;
 
-    // Only start new selection if clicking within thumbnail area
-    if (!isPointInThumbnail(x, y, pdfBounds)) return;
+      // Only start new selection if clicking within thumbnail area
+      if (!isPointInThumbnail(x, y, pdfBounds)) return;
 
-    e.preventDefault();
-    e.stopPropagation();
+      e.preventDefault();
+      e.stopPropagation();
 
-    // Start new crop selection
-    const newDomRect: Rectangle = { x, y, width: 20, height: 20 };
-    const constrainedRect = constrainDOMRectToThumbnail(newDomRect, pdfBounds);
-    const newCropArea = domToPDFCoordinates(constrainedRect, pdfBounds);
+      // Start new crop selection
+      const newDomRect: Rectangle = { x, y, width: 20, height: 20 };
+      const constrainedRect = constrainDOMRectToThumbnail(
+        newDomRect,
+        pdfBounds,
+      );
+      const newCropArea = domToPDFCoordinates(constrainedRect, pdfBounds);
 
-    onCropAreaChange(newCropArea);
-    setIsResizing('se'); // Start resizing from the southeast corner
-    setInitialCropArea(newCropArea);
-  }, [disabled, pdfBounds, onCropAreaChange]);
+      onCropAreaChange(newCropArea);
+      setIsResizing("se"); // Start resizing from the southeast corner
+      setInitialCropArea(newCropArea);
+    },
+    [disabled, pdfBounds, onCropAreaChange],
+  );
 
   // Handle mouse move
-  const handleMouseMove = useCallback((e: MouseEvent) => {
-    if (disabled || !containerRef.current) return;
+  const handleMouseMove = useCallback(
+    (e: MouseEvent) => {
+      if (disabled || !containerRef.current) return;
 
-    const rect = containerRef.current.getBoundingClientRect();
-    const x = e.clientX - rect.left;
-    const y = e.clientY - rect.top;
+      const rect = containerRef.current.getBoundingClientRect();
+      const x = e.clientX - rect.left;
+      const y = e.clientY - rect.top;
 
-    if (isDragging) {
-      // Dragging the entire crop area
-      const newX = x - dragStart.x;
-      const newY = y - dragStart.y;
+      if (isDragging) {
+        // Dragging the entire crop area
+        const newX = x - dragStart.x;
+        const newY = y - dragStart.y;
 
-      const newDomRect: Rectangle = {
-        x: newX,
-        y: newY,
-        width: domRect.width,
-        height: domRect.height
-      };
+        const newDomRect: Rectangle = {
+          x: newX,
+          y: newY,
+          width: domRect.width,
+          height: domRect.height,
+        };
 
-      const constrainedRect = constrainDOMRectToThumbnail(newDomRect, pdfBounds);
-      const newCropArea = domToPDFCoordinates(constrainedRect, pdfBounds);
-      onCropAreaChange(newCropArea);
-
-    } else if (isResizing) {
-      // Resizing the crop area
-      const newDomRect = calculateResizedRect(isResizing, domRect, x, y);
-      const constrainedRect = constrainDOMRectToThumbnail(newDomRect, pdfBounds);
-      const newCropArea = domToPDFCoordinates(constrainedRect, pdfBounds);
-      onCropAreaChange(newCropArea);
-    }
-  }, [disabled, isDragging, isResizing, dragStart, domRect, initialCropArea, pdfBounds, onCropAreaChange]);
+        const constrainedRect = constrainDOMRectToThumbnail(
+          newDomRect,
+          pdfBounds,
+        );
+        const newCropArea = domToPDFCoordinates(constrainedRect, pdfBounds);
+        onCropAreaChange(newCropArea);
+      } else if (isResizing) {
+        // Resizing the crop area
+        const newDomRect = calculateResizedRect(isResizing, domRect, x, y);
+        const constrainedRect = constrainDOMRectToThumbnail(
+          newDomRect,
+          pdfBounds,
+        );
+        const newCropArea = domToPDFCoordinates(constrainedRect, pdfBounds);
+        onCropAreaChange(newCropArea);
+      }
+    },
+    [
+      disabled,
+      isDragging,
+      isResizing,
+      dragStart,
+      domRect,
+      initialCropArea,
+      pdfBounds,
+      onCropAreaChange,
+    ],
+  );
 
   // Handle mouse up
   const handleMouseUp = useCallback(() => {
@@ -134,12 +160,12 @@ const CropAreaSelector: React.FC<CropAreaSelectorProps> = ({
   // Add global mouse event listeners
   useEffect(() => {
     if (isDragging || isResizing) {
-      document.addEventListener('mousemove', handleMouseMove);
-      document.addEventListener('mouseup', handleMouseUp);
+      document.addEventListener("mousemove", handleMouseMove);
+      document.addEventListener("mouseup", handleMouseUp);
 
       return () => {
-        document.removeEventListener('mousemove', handleMouseMove);
-        document.removeEventListener('mouseup', handleMouseUp);
+        document.removeEventListener("mousemove", handleMouseMove);
+        document.removeEventListener("mouseup", handleMouseUp);
       };
     }
   }, [isDragging, isResizing, handleMouseMove, handleMouseUp]);
@@ -148,11 +174,11 @@ const CropAreaSelector: React.FC<CropAreaSelectorProps> = ({
     <Box
       ref={containerRef}
       style={{
-        position: 'relative',
-        width: '100%',
-        height: '100%',
-        cursor: 'crosshair',
-        userSelect: 'none'
+        position: "relative",
+        width: "100%",
+        height: "100%",
+        cursor: "crosshair",
+        userSelect: "none",
       }}
       onMouseDown={handleContainerMouseDown}
     >
@@ -164,16 +190,17 @@ const CropAreaSelector: React.FC<CropAreaSelectorProps> = ({
         <Box
           ref={overlayRef}
           style={{
-            position: 'absolute',
+            position: "absolute",
             left: domRect.x,
             top: domRect.y,
             width: domRect.width,
             height: domRect.height,
             border: `2px solid ${theme.other.crop.overlayBorder}`,
             backgroundColor: theme.other.crop.overlayBackground,
-            cursor: 'move',
-            pointerEvents: 'auto',
-            transition: (isDragging || isResizing) ? undefined : 'all 1s ease-in-out'
+            cursor: "move",
+            pointerEvents: "auto",
+            transition:
+              isDragging || isResizing ? undefined : "all 1s ease-in-out",
           }}
           onMouseDown={handleOverlayMouseDown}
         >
@@ -187,21 +214,54 @@ const CropAreaSelector: React.FC<CropAreaSelectorProps> = ({
 
 // Helper functions
 
-function getResizeHandle(x: number, y: number, domRect: Rectangle): ResizeHandle {
+function getResizeHandle(
+  x: number,
+  y: number,
+  domRect: Rectangle,
+): ResizeHandle {
   const handleSize = 8;
   const tolerance = handleSize;
 
   // Corner handles (check these first, they have priority)
-  if (isNear(x, domRect.x, tolerance) && isNear(y, domRect.y, tolerance)) return 'nw';
-  if (isNear(x, domRect.x + domRect.width, tolerance) && isNear(y, domRect.y, tolerance)) return 'ne';
-  if (isNear(x, domRect.x, tolerance) && isNear(y, domRect.y + domRect.height, tolerance)) return 'sw';
-  if (isNear(x, domRect.x + domRect.width, tolerance) && isNear(y, domRect.y + domRect.height, tolerance)) return 'se';
+  if (isNear(x, domRect.x, tolerance) && isNear(y, domRect.y, tolerance))
+    return "nw";
+  if (
+    isNear(x, domRect.x + domRect.width, tolerance) &&
+    isNear(y, domRect.y, tolerance)
+  )
+    return "ne";
+  if (
+    isNear(x, domRect.x, tolerance) &&
+    isNear(y, domRect.y + domRect.height, tolerance)
+  )
+    return "sw";
+  if (
+    isNear(x, domRect.x + domRect.width, tolerance) &&
+    isNear(y, domRect.y + domRect.height, tolerance)
+  )
+    return "se";
 
   // Edge handles (only if not in corner area)
-  if (isNear(x, domRect.x + domRect.width / 2, tolerance) && isNear(y, domRect.y, tolerance)) return 'n';
-  if (isNear(x, domRect.x + domRect.width, tolerance) && isNear(y, domRect.y + domRect.height / 2, tolerance)) return 'e';
-  if (isNear(x, domRect.x + domRect.width / 2, tolerance) && isNear(y, domRect.y + domRect.height, tolerance)) return 's';
-  if (isNear(x, domRect.x, tolerance) && isNear(y, domRect.y + domRect.height / 2, tolerance)) return 'w';
+  if (
+    isNear(x, domRect.x + domRect.width / 2, tolerance) &&
+    isNear(y, domRect.y, tolerance)
+  )
+    return "n";
+  if (
+    isNear(x, domRect.x + domRect.width, tolerance) &&
+    isNear(y, domRect.y + domRect.height / 2, tolerance)
+  )
+    return "e";
+  if (
+    isNear(x, domRect.x + domRect.width / 2, tolerance) &&
+    isNear(y, domRect.y + domRect.height, tolerance)
+  )
+    return "s";
+  if (
+    isNear(x, domRect.x, tolerance) &&
+    isNear(y, domRect.y + domRect.height / 2, tolerance)
+  )
+    return "w";
 
   return null;
 }
@@ -211,8 +271,12 @@ function isNear(a: number, b: number, tolerance: number): boolean {
 }
 
 function isPointInCropArea(x: number, y: number, domRect: Rectangle): boolean {
-  return x >= domRect.x && x <= domRect.x + domRect.width &&
-         y >= domRect.y && y <= domRect.y + domRect.height;
+  return (
+    x >= domRect.x &&
+    x <= domRect.x + domRect.width &&
+    y >= domRect.y &&
+    y <= domRect.y + domRect.height
+  );
 }
 
 function calculateResizedRect(
@@ -224,37 +288,37 @@ function calculateResizedRect(
   let { x, y, width, height } = currentRect;
 
   switch (handle) {
-    case 'nw':
+    case "nw":
       width += x - mouseX;
       height += y - mouseY;
       x = mouseX;
       y = mouseY;
       break;
-    case 'ne':
+    case "ne":
       width = mouseX - x;
       height += y - mouseY;
       y = mouseY;
       break;
-    case 'sw':
+    case "sw":
       width += x - mouseX;
       height = mouseY - y;
       x = mouseX;
       break;
-    case 'se':
+    case "se":
       width = mouseX - x;
       height = mouseY - y;
       break;
-    case 'n':
+    case "n":
       height += y - mouseY;
       y = mouseY;
       break;
-    case 'e':
+    case "e":
       width = mouseX - x;
       break;
-    case 's':
+    case "s":
       height = mouseY - y;
       break;
-    case 'w':
+    case "w":
       width += x - mouseX;
       x = mouseX;
       break;
@@ -272,28 +336,88 @@ function renderResizeHandles(disabled: boolean, theme: MantineTheme) {
 
   const handleSize = 8;
   const handleStyle = {
-    position: 'absolute' as const,
+    position: "absolute" as const,
     width: handleSize,
     height: handleSize,
     backgroundColor: theme.other.crop.handleColor,
     border: `1px solid ${theme.other.crop.handleBorder}`,
-    borderRadius: '2px',
-    pointerEvents: 'auto' as const
+    borderRadius: "2px",
+    pointerEvents: "auto" as const,
   };
 
   return (
     <>
       {/* Corner handles */}
-      <Box style={{ ...handleStyle, left: -handleSize/2, top: -handleSize/2, cursor: 'nw-resize' }} />
-      <Box style={{ ...handleStyle, right: -handleSize/2, top: -handleSize/2, cursor: 'ne-resize' }} />
-      <Box style={{ ...handleStyle, left: -handleSize/2, bottom: -handleSize/2, cursor: 'sw-resize' }} />
-      <Box style={{ ...handleStyle, right: -handleSize/2, bottom: -handleSize/2, cursor: 'se-resize' }} />
+      <Box
+        style={{
+          ...handleStyle,
+          left: -handleSize / 2,
+          top: -handleSize / 2,
+          cursor: "nw-resize",
+        }}
+      />
+      <Box
+        style={{
+          ...handleStyle,
+          right: -handleSize / 2,
+          top: -handleSize / 2,
+          cursor: "ne-resize",
+        }}
+      />
+      <Box
+        style={{
+          ...handleStyle,
+          left: -handleSize / 2,
+          bottom: -handleSize / 2,
+          cursor: "sw-resize",
+        }}
+      />
+      <Box
+        style={{
+          ...handleStyle,
+          right: -handleSize / 2,
+          bottom: -handleSize / 2,
+          cursor: "se-resize",
+        }}
+      />
 
       {/* Edge handles */}
-      <Box style={{ ...handleStyle, left: '50%', marginLeft: -handleSize/2, top: -handleSize/2, cursor: 'n-resize' }} />
-      <Box style={{ ...handleStyle, right: -handleSize/2, top: '50%', marginTop: -handleSize/2, cursor: 'e-resize' }} />
-      <Box style={{ ...handleStyle, left: '50%', marginLeft: -handleSize/2, bottom: -handleSize/2, cursor: 's-resize' }} />
-      <Box style={{ ...handleStyle, left: -handleSize/2, top: '50%', marginTop: -handleSize/2, cursor: 'w-resize' }} />
+      <Box
+        style={{
+          ...handleStyle,
+          left: "50%",
+          marginLeft: -handleSize / 2,
+          top: -handleSize / 2,
+          cursor: "n-resize",
+        }}
+      />
+      <Box
+        style={{
+          ...handleStyle,
+          right: -handleSize / 2,
+          top: "50%",
+          marginTop: -handleSize / 2,
+          cursor: "e-resize",
+        }}
+      />
+      <Box
+        style={{
+          ...handleStyle,
+          left: "50%",
+          marginLeft: -handleSize / 2,
+          bottom: -handleSize / 2,
+          cursor: "s-resize",
+        }}
+      />
+      <Box
+        style={{
+          ...handleStyle,
+          left: -handleSize / 2,
+          top: "50%",
+          marginTop: -handleSize / 2,
+          cursor: "w-resize",
+        }}
+      />
     </>
   );
 }
diff --git a/frontend/src/core/components/tools/crop/CropAutomationSettings.tsx b/frontend/src/core/components/tools/crop/CropAutomationSettings.tsx
index dd668c6072..54539ce1b3 100644
--- a/frontend/src/core/components/tools/crop/CropAutomationSettings.tsx
+++ b/frontend/src/core/components/tools/crop/CropAutomationSettings.tsx
@@ -12,18 +12,28 @@ import CropCoordinateInputs from "@app/components/tools/crop/CropCoordinateInput
 
 interface CropAutomationSettingsProps {
   parameters: CropParameters;
-  onParameterChange: <K extends keyof CropParameters>(key: K, value: CropParameters[K]) => void;
+  onParameterChange: <K extends keyof CropParameters>(
+    key: K,
+    value: CropParameters[K],
+  ) => void;
   disabled?: boolean;
 }
 
-const CropAutomationSettings = ({ parameters, onParameterChange, disabled = false }: CropAutomationSettingsProps) => {
+const CropAutomationSettings = ({
+  parameters,
+  onParameterChange,
+  disabled = false,
+}: CropAutomationSettingsProps) => {
   // Handle coordinate changes
-  const handleCoordinateChange = (field: keyof Rectangle, value: number | string) => {
-    const numValue = typeof value === 'string' ? parseFloat(value) : value;
+  const handleCoordinateChange = (
+    field: keyof Rectangle,
+    value: number | string,
+  ) => {
+    const numValue = typeof value === "string" ? parseFloat(value) : value;
     if (isNaN(numValue)) return;
 
     const newCropArea = { ...parameters.cropArea, [field]: numValue };
-    onParameterChange('cropArea', newCropArea);
+    onParameterChange("cropArea", newCropArea);
   };
 
   return (
diff --git a/frontend/src/core/components/tools/crop/CropCoordinateInputs.tsx b/frontend/src/core/components/tools/crop/CropCoordinateInputs.tsx
index abed4fd47e..f56c04ce22 100644
--- a/frontend/src/core/components/tools/crop/CropCoordinateInputs.tsx
+++ b/frontend/src/core/components/tools/crop/CropCoordinateInputs.tsx
@@ -15,7 +15,7 @@ const CropCoordinateInputs = ({
   onCoordinateChange,
   disabled = false,
   pdfBounds,
-  showAutomationInfo = false
+  showAutomationInfo = false,
 }: CropCoordinateInputsProps) => {
   const { t } = useTranslation();
 
@@ -24,7 +24,10 @@ const CropCoordinateInputs = ({
       {showAutomationInfo && (
         <Alert color="blue" variant="light">
           <Text size="xs">
-            {t("crop.automation.info", "Enter crop coordinates in PDF points. Origin (0,0) is at bottom-left. These values will be applied to all PDFs processed in this automation.")}
+            {t(
+              "crop.automation.info",
+              "Enter crop coordinates in PDF points. Origin (0,0) is at bottom-left. These values will be applied to all PDFs processed in this automation.",
+            )}
           </Text>
         </Alert>
       )}
@@ -36,9 +39,13 @@ const CropCoordinateInputs = ({
       <Group grow>
         <NumberInput
           label={t("crop.coordinates.x.label", "X Position")}
-          description={showAutomationInfo ? t("crop.coordinates.x.desc", "Left edge (points)") : undefined}
+          description={
+            showAutomationInfo
+              ? t("crop.coordinates.x.desc", "Left edge (points)")
+              : undefined
+          }
           value={Math.round(cropArea.x * 10) / 10}
-          onChange={(value) => onCoordinateChange('x', value)}
+          onChange={(value) => onCoordinateChange("x", value)}
           disabled={disabled}
           min={0}
           max={pdfBounds?.actualWidth}
@@ -48,9 +55,13 @@ const CropCoordinateInputs = ({
         />
         <NumberInput
           label={t("crop.coordinates.y.label", "Y Position")}
-          description={showAutomationInfo ? t("crop.coordinates.y.desc", "Bottom edge (points)") : undefined}
+          description={
+            showAutomationInfo
+              ? t("crop.coordinates.y.desc", "Bottom edge (points)")
+              : undefined
+          }
           value={Math.round(cropArea.y * 10) / 10}
-          onChange={(value) => onCoordinateChange('y', value)}
+          onChange={(value) => onCoordinateChange("y", value)}
           disabled={disabled}
           min={0}
           max={pdfBounds?.actualHeight}
@@ -63,9 +74,13 @@ const CropCoordinateInputs = ({
       <Group grow>
         <NumberInput
           label={t("crop.coordinates.width.label", "Width")}
-          description={showAutomationInfo ? t("crop.coordinates.width.desc", "Crop width (points)") : undefined}
+          description={
+            showAutomationInfo
+              ? t("crop.coordinates.width.desc", "Crop width (points)")
+              : undefined
+          }
           value={Math.round(cropArea.width * 10) / 10}
-          onChange={(value) => onCoordinateChange('width', value)}
+          onChange={(value) => onCoordinateChange("width", value)}
           disabled={disabled}
           min={0.1}
           max={pdfBounds?.actualWidth}
@@ -75,9 +90,13 @@ const CropCoordinateInputs = ({
         />
         <NumberInput
           label={t("crop.coordinates.height.label", "Height")}
-          description={showAutomationInfo ? t("crop.coordinates.height.desc", "Crop height (points)") : undefined}
+          description={
+            showAutomationInfo
+              ? t("crop.coordinates.height.desc", "Crop height (points)")
+              : undefined
+          }
           value={Math.round(cropArea.height * 10) / 10}
-          onChange={(value) => onCoordinateChange('height', value)}
+          onChange={(value) => onCoordinateChange("height", value)}
           disabled={disabled}
           min={0.1}
           max={pdfBounds?.actualHeight}
@@ -90,7 +109,10 @@ const CropCoordinateInputs = ({
       {showAutomationInfo && (
         <Alert color="gray" variant="light">
           <Text size="xs">
-            {t("crop.automation.reference", "Reference: A4 page is 595.28 × 841.89 points (210mm × 297mm). 1 inch = 72 points.")}
+            {t(
+              "crop.automation.reference",
+              "Reference: A4 page is 595.28 × 841.89 points (210mm × 297mm). 1 inch = 72 points.",
+            )}
           </Text>
         </Alert>
       )}
diff --git a/frontend/src/core/components/tools/crop/CropSettings.tsx b/frontend/src/core/components/tools/crop/CropSettings.tsx
index 441186e033..8525d44c42 100644
--- a/frontend/src/core/components/tools/crop/CropSettings.tsx
+++ b/frontend/src/core/components/tools/crop/CropSettings.tsx
@@ -1,5 +1,14 @@
 import { useMemo, useState, useEffect } from "react";
-import { Stack, Text, Box, Group, ActionIcon, Center, Alert, Checkbox } from "@mantine/core";
+import {
+  Stack,
+  Text,
+  Box,
+  Group,
+  ActionIcon,
+  Center,
+  Alert,
+  Checkbox,
+} from "@mantine/core";
 import { useTranslation } from "react-i18next";
 import RestartAltIcon from "@mui/icons-material/RestartAlt";
 import { CropParametersHook } from "@app/hooks/tools/crop/useCropParameters";
@@ -11,7 +20,7 @@ import { PAGE_SIZES } from "@app/constants/pageSizeConstants";
 import {
   calculatePDFBounds,
   PDFBounds,
-  Rectangle
+  Rectangle,
 } from "@app/utils/cropCoordinates";
 import { pdfWorkerManager } from "@app/services/pdfWorkerManager";
 import DocumentThumbnail from "@app/components/shared/filePreview/DocumentThumbnail";
@@ -59,7 +68,7 @@ const CropSettings = ({ parameters, disabled = false }: CropSettingsProps) => {
         const pdf = await pdfWorkerManager.createDocument(arrayBuffer, {
           disableAutoFetch: true,
           disableStream: true,
-          stopAtErrors: false
+          stopAtErrors: false,
         });
 
         const firstPage = await pdf.getPage(1);
@@ -68,7 +77,12 @@ const CropSettings = ({ parameters, disabled = false }: CropSettingsProps) => {
         const pdfWidth = viewport.width;
         const pdfHeight = viewport.height;
 
-        const bounds = calculatePDFBounds(pdfWidth, pdfHeight, CONTAINER_SIZE, CONTAINER_SIZE);
+        const bounds = calculatePDFBounds(
+          pdfWidth,
+          pdfHeight,
+          CONTAINER_SIZE,
+          CONTAINER_SIZE,
+        );
         setPdfBounds(bounds);
 
         // Initialize crop area to full PDF if parameters are still default
@@ -79,12 +93,20 @@ const CropSettings = ({ parameters, disabled = false }: CropSettingsProps) => {
         // Cleanup PDF
         pdfWorkerManager.destroyDocument(pdf);
       } catch (error) {
-        console.error('Failed to load PDF dimensions:', error);
+        console.error("Failed to load PDF dimensions:", error);
         // Fallback to A4 dimensions if PDF loading fails
-        const bounds = calculatePDFBounds(PAGE_SIZES.A4.width, PAGE_SIZES.A4.height, CONTAINER_SIZE, CONTAINER_SIZE);
+        const bounds = calculatePDFBounds(
+          PAGE_SIZES.A4.width,
+          PAGE_SIZES.A4.height,
+          CONTAINER_SIZE,
+          CONTAINER_SIZE,
+        );
         setPdfBounds(bounds);
 
-        if (parameters.parameters.cropArea.width === PAGE_SIZES.A4.width && parameters.parameters.cropArea.height === PAGE_SIZES.A4.height) {
+        if (
+          parameters.parameters.cropArea.width === PAGE_SIZES.A4.width &&
+          parameters.parameters.cropArea.height === PAGE_SIZES.A4.height
+        ) {
           parameters.resetToFullPDF(bounds);
         }
       }
@@ -102,14 +124,14 @@ const CropSettings = ({ parameters, disabled = false }: CropSettingsProps) => {
       }
     };
 
-    window.addEventListener('tour:setCropArea', handleSetCropArea);
-    return () => window.removeEventListener('tour:setCropArea', handleSetCropArea);
+    window.addEventListener("tour:setCropArea", handleSetCropArea);
+    return () =>
+      window.removeEventListener("tour:setCropArea", handleSetCropArea);
   }, [parameters, pdfBounds]);
 
   // Current crop area
   const cropArea = parameters.getCropArea();
 
-
   // Handle crop area changes from the selector
   const handleCropAreaChange = (newCropArea: Rectangle) => {
     if (pdfBounds) {
@@ -118,8 +140,11 @@ const CropSettings = ({ parameters, disabled = false }: CropSettingsProps) => {
   };
 
   // Handle manual coordinate input changes
-  const handleCoordinateChange = (field: keyof Rectangle, value: number | string) => {
-    const numValue = typeof value === 'string' ? parseFloat(value) : value;
+  const handleCoordinateChange = (
+    field: keyof Rectangle,
+    value: number | string,
+  ) => {
+    const numValue = typeof value === "string" ? parseFloat(value) : value;
     if (isNaN(numValue)) return;
 
     const newCropArea = { ...cropArea, [field]: numValue };
@@ -135,10 +160,9 @@ const CropSettings = ({ parameters, disabled = false }: CropSettingsProps) => {
     }
   };
 
-
   if (!selectedStub || !pdfBounds) {
     return (
-      <Center style={{ height: '200px' }}>
+      <Center style={{ height: "200px" }}>
         <Text color="dimmed">
           {t("crop.noFileSelected", "Select a PDF file to begin cropping")}
         </Text>
@@ -155,7 +179,9 @@ const CropSettings = ({ parameters, disabled = false }: CropSettingsProps) => {
       <Checkbox
         label={t("crop.autoCrop", "Auto-crop whitespace")}
         checked={parameters.parameters.autoCrop}
-        onChange={(e) => parameters.updateParameter('autoCrop', e.currentTarget.checked)}
+        onChange={(e) =>
+          parameters.updateParameter("autoCrop", e.currentTarget.checked)
+        }
         disabled={disabled}
       />
 
@@ -173,7 +199,7 @@ const CropSettings = ({ parameters, disabled = false }: CropSettingsProps) => {
               title={t("crop.reset", "Reset to full PDF")}
               aria-label={t("crop.reset", "Reset to full PDF")}
             >
-              <RestartAltIcon style={{ fontSize: '1rem' }} />
+              <RestartAltIcon style={{ fontSize: "1rem" }} />
             </ActionIcon>
           </Group>
 
@@ -182,11 +208,11 @@ const CropSettings = ({ parameters, disabled = false }: CropSettingsProps) => {
               style={{
                 width: CONTAINER_SIZE,
                 height: CONTAINER_SIZE,
-                border: '1px solid var(--mantine-color-gray-3)',
-                borderRadius: '8px',
-                backgroundColor: 'var(--mantine-color-gray-0)',
-                overflow: 'hidden',
-                position: 'relative'
+                border: "1px solid var(--mantine-color-gray-3)",
+                borderRadius: "8px",
+                backgroundColor: "var(--mantine-color-gray-0)",
+                overflow: "hidden",
+                position: "relative",
               }}
             >
               <CropAreaSelector
@@ -201,15 +227,14 @@ const CropSettings = ({ parameters, disabled = false }: CropSettingsProps) => {
                   style={{
                     width: pdfBounds.thumbnailWidth,
                     height: pdfBounds.thumbnailHeight,
-                    position: 'absolute',
+                    position: "absolute",
                     left: pdfBounds.offsetX,
-                    top: pdfBounds.offsetY
+                    top: pdfBounds.offsetY,
                   }}
                 />
               </CropAreaSelector>
             </Box>
           </Center>
-
         </Stack>
       )}
 
@@ -228,7 +253,10 @@ const CropSettings = ({ parameters, disabled = false }: CropSettingsProps) => {
       {!parameters.parameters.autoCrop && !isCropValid && (
         <Alert color="red" variant="light">
           <Text size="xs">
-            {t("crop.error.invalidArea", "Crop area extends beyond PDF boundaries")}
+            {t(
+              "crop.error.invalidArea",
+              "Crop area extends beyond PDF boundaries",
+            )}
           </Text>
         </Alert>
       )}
diff --git a/frontend/src/core/components/tools/editTableOfContents/BookmarkEditor.tsx b/frontend/src/core/components/tools/editTableOfContents/BookmarkEditor.tsx
index 2d01cbb8a0..2dbde539ef 100644
--- a/frontend/src/core/components/tools/editTableOfContents/BookmarkEditor.tsx
+++ b/frontend/src/core/components/tools/editTableOfContents/BookmarkEditor.tsx
@@ -1,5 +1,5 @@
-import { Fragment, useState } from 'react';
-import { useTranslation } from 'react-i18next';
+import { Fragment, useState } from "react";
+import { useTranslation } from "react-i18next";
 import {
   ActionIcon,
   Badge,
@@ -12,9 +12,12 @@ import {
   Text,
   TextInput,
   Tooltip,
-} from '@mantine/core';
-import LocalIcon from '@app/components/shared/LocalIcon';
-import { BookmarkNode, createBookmarkNode } from '@app/utils/editTableOfContents';
+} from "@mantine/core";
+import LocalIcon from "@app/components/shared/LocalIcon";
+import {
+  BookmarkNode,
+  createBookmarkNode,
+} from "@app/utils/editTableOfContents";
 
 interface BookmarkEditorProps {
   bookmarks: BookmarkNode[];
@@ -27,7 +30,7 @@ const updateTree = (
   targetId: string,
   updater: (bookmark: BookmarkNode) => BookmarkNode,
 ): BookmarkNode[] => {
-  return nodes.map(node => {
+  return nodes.map((node) => {
     if (node.id === targetId) {
       return updater(node);
     }
@@ -45,10 +48,13 @@ const updateTree = (
   });
 };
 
-const removeFromTree = (nodes: BookmarkNode[], targetId: string): BookmarkNode[] => {
+const removeFromTree = (
+  nodes: BookmarkNode[],
+  targetId: string,
+): BookmarkNode[] => {
   return nodes
-    .filter(node => node.id !== targetId)
-    .map(node => ({
+    .filter((node) => node.id !== targetId)
+    .map((node) => ({
       ...node,
       children: removeFromTree(node.children, targetId),
     }));
@@ -60,7 +66,7 @@ const addChildToTree = (
   child: BookmarkNode,
 ): { nodes: BookmarkNode[]; added: boolean } => {
   let added = false;
-  const next = nodes.map(node => {
+  const next = nodes.map((node) => {
     if (node.id === parentId) {
       added = true;
       return { ...node, expanded: true, children: [...node.children, child] };
@@ -90,7 +96,7 @@ const addSiblingInTree = (
   let added = false;
   const result: BookmarkNode[] = [];
 
-  nodes.forEach(node => {
+  nodes.forEach((node) => {
     let currentNode = node;
 
     if (!added && node.children.length > 0) {
@@ -112,41 +118,62 @@ const addSiblingInTree = (
   return { nodes: added ? result : nodes, added };
 };
 
-export default function BookmarkEditor({ bookmarks, onChange, disabled }: BookmarkEditorProps) {
+export default function BookmarkEditor({
+  bookmarks,
+  onChange,
+  disabled,
+}: BookmarkEditorProps) {
   const { t } = useTranslation();
 
   const [editingId, setEditingId] = useState<string | null>(null);
-  const [currentTitleInput, setCurrentTitleInput] = useState<string>('');
+  const [currentTitleInput, setCurrentTitleInput] = useState<string>("");
 
   const getLatestTree = () => {
     if (editingId) {
-      return updateTree(bookmarks, editingId, bookmark => ({ ...bookmark, title: currentTitleInput }));
+      return updateTree(bookmarks, editingId, (bookmark) => ({
+        ...bookmark,
+        title: currentTitleInput,
+      }));
     }
     return bookmarks;
   };
 
   const handleAddTopLevel = () => {
-    const newBookmark = createBookmarkNode({ title: t('editTableOfContents.editor.defaultTitle', 'New bookmark') });
+    const newBookmark = createBookmarkNode({
+      title: t("editTableOfContents.editor.defaultTitle", "New bookmark"),
+    });
     onChange([...getLatestTree(), newBookmark]);
   };
 
   const handleTitleChange = (id: string, value: string) => {
-    onChange(updateTree(bookmarks, id, bookmark => ({ ...bookmark, title: value })));
+    onChange(
+      updateTree(bookmarks, id, (bookmark) => ({ ...bookmark, title: value })),
+    );
   };
 
   const handlePageChange = (id: string, value: number | string) => {
-    const page = typeof value === 'number' ? value : parseInt(value, 10);
-    onChange(updateTree(getLatestTree(), id, bookmark => ({ ...bookmark, pageNumber: Number.isFinite(page) && page > 0 ? page : 1 })));
+    const page = typeof value === "number" ? value : parseInt(value, 10);
+    onChange(
+      updateTree(getLatestTree(), id, (bookmark) => ({
+        ...bookmark,
+        pageNumber: Number.isFinite(page) && page > 0 ? page : 1,
+      })),
+    );
   };
 
   const handleToggle = (id: string) => {
-    onChange(updateTree(getLatestTree(), id, bookmark => ({ ...bookmark, expanded: !bookmark.expanded })));
+    onChange(
+      updateTree(getLatestTree(), id, (bookmark) => ({
+        ...bookmark,
+        expanded: !bookmark.expanded,
+      })),
+    );
   };
 
   const handleRemove = (id: string) => {
     const confirmation = t(
-      'editTableOfContents.editor.confirmRemove',
-      'Remove this bookmark and all of its children?'
+      "editTableOfContents.editor.confirmRemove",
+      "Remove this bookmark and all of its children?",
     );
     if (window.confirm(confirmation)) {
       onChange(removeFromTree(getLatestTree(), id));
@@ -154,20 +181,36 @@ export default function BookmarkEditor({ bookmarks, onChange, disabled }: Bookma
   };
 
   const handleAddChild = (parentId: string) => {
-    const child = createBookmarkNode({ title: t('editTableOfContents.editor.defaultChildTitle', 'Child bookmark') });
+    const child = createBookmarkNode({
+      title: t(
+        "editTableOfContents.editor.defaultChildTitle",
+        "Child bookmark",
+      ),
+    });
     const { nodes, added } = addChildToTree(getLatestTree(), parentId, child);
     onChange(added ? nodes : [...getLatestTree(), child]);
   };
 
   const handleAddSibling = (targetId: string) => {
-    const sibling = createBookmarkNode({ title: t('editTableOfContents.editor.defaultSiblingTitle', 'New bookmark') });
-    const { nodes, added } = addSiblingInTree(getLatestTree(), targetId, sibling);
+    const sibling = createBookmarkNode({
+      title: t(
+        "editTableOfContents.editor.defaultSiblingTitle",
+        "New bookmark",
+      ),
+    });
+    const { nodes, added } = addSiblingInTree(
+      getLatestTree(),
+      targetId,
+      sibling,
+    );
     onChange(added ? nodes : [...getLatestTree(), sibling]);
   };
 
   const renderBookmark = (bookmark: BookmarkNode, level = 0) => {
     const hasChildren = bookmark.children.length > 0;
-    const chevronIcon = bookmark.expanded ? 'expand-more-rounded' : 'chevron-right-rounded';
+    const chevronIcon = bookmark.expanded
+      ? "expand-more-rounded"
+      : "chevron-right-rounded";
 
     return (
       <Paper
@@ -176,8 +219,8 @@ export default function BookmarkEditor({ bookmarks, onChange, disabled }: Bookma
         withBorder
         p="md"
         style={{
-          borderColor: 'var(--border-default)',
-          background: level === 0 ? 'var(--bg-surface)' : 'var(--bg-muted)',
+          borderColor: "var(--border-default)",
+          background: level === 0 ? "var(--bg-surface)" : "var(--bg-muted)",
         }}
       >
         <Stack gap="sm">
@@ -191,59 +234,85 @@ export default function BookmarkEditor({ bookmarks, onChange, disabled }: Bookma
                   if (hasChildren) handleToggle(bookmark.id);
                 }}
                 disabled={disabled || !hasChildren}
-                aria-label={t('editTableOfContents.editor.actions.toggle', 'Toggle children')}
+                aria-label={t(
+                  "editTableOfContents.editor.actions.toggle",
+                  "Toggle children",
+                )}
                 style={{ marginTop: 4 }}
               >
                 <LocalIcon icon={chevronIcon} />
               </ActionIcon>
               <Stack gap={2}>
                 <Group gap="xs" align="center">
-                  <Text fw={600}>{bookmark.title || t('editTableOfContents.editor.untitled', 'Untitled bookmark')}</Text>
+                  <Text fw={600}>
+                    {bookmark.title ||
+                      t(
+                        "editTableOfContents.editor.untitled",
+                        "Untitled bookmark",
+                      )}
+                  </Text>
                   {level > 0 && (
                     <Badge size="xs" variant="light" color="blue">
-                      {t('editTableOfContents.editor.childBadge', 'Child')}
+                      {t("editTableOfContents.editor.childBadge", "Child")}
                     </Badge>
                   )}
                 </Group>
                 <Text size="sm" c="dimmed">
-                  {t('editTableOfContents.editor.pagePreview', { page: bookmark.pageNumber })}
+                  {t("editTableOfContents.editor.pagePreview", {
+                    page: bookmark.pageNumber,
+                  })}
                 </Text>
               </Stack>
             </Group>
             <Group gap="xs">
-              <Tooltip label={t('editTableOfContents.editor.actions.addChild', 'Add child bookmark')}>
+              <Tooltip
+                label={t(
+                  "editTableOfContents.editor.actions.addChild",
+                  "Add child bookmark",
+                )}
+              >
                 <ActionIcon
                   variant="subtle"
                   color="green"
                   onMouseDown={(e) => {
-                    e.preventDefault()
-                    handleAddChild(bookmark.id)
+                    e.preventDefault();
+                    handleAddChild(bookmark.id);
                   }}
                   disabled={disabled}
                 >
                   <LocalIcon icon="subdirectory-arrow-right-rounded" />
                 </ActionIcon>
               </Tooltip>
-              <Tooltip label={t('editTableOfContents.editor.actions.addSibling', 'Add sibling bookmark')}>
+              <Tooltip
+                label={t(
+                  "editTableOfContents.editor.actions.addSibling",
+                  "Add sibling bookmark",
+                )}
+              >
                 <ActionIcon
                   variant="subtle"
                   color="blue"
                   onMouseDown={(e) => {
-                    e.preventDefault()
-                    handleAddSibling(bookmark.id)
+                    e.preventDefault();
+                    handleAddSibling(bookmark.id);
                   }}
                   disabled={disabled}
                 >
                   <LocalIcon icon="add-rounded" />
                 </ActionIcon>
               </Tooltip>
-              <Tooltip label={t('editTableOfContents.editor.actions.remove', 'Remove bookmark')}>
+              <Tooltip
+                label={t(
+                  "editTableOfContents.editor.actions.remove",
+                  "Remove bookmark",
+                )}
+              >
                 <ActionIcon
                   variant="subtle"
                   color="red"
                   onMouseDown={(e) => {
-                    e.preventDefault()
-                    handleRemove(bookmark.id)
+                    e.preventDefault();
+                    handleRemove(bookmark.id);
                   }}
                   disabled={disabled}
                 >
@@ -257,37 +326,56 @@ export default function BookmarkEditor({ bookmarks, onChange, disabled }: Bookma
             <Stack gap="sm">
               <TextInput
                 size="sm"
-                label={t('editTableOfContents.editor.field.title', 'Bookmark title')}
-                value={editingId === bookmark.id ? currentTitleInput : bookmark.title}
+                label={t(
+                  "editTableOfContents.editor.field.title",
+                  "Bookmark title",
+                )}
+                value={
+                  editingId === bookmark.id ? currentTitleInput : bookmark.title
+                }
                 onFocus={() => {
                   setEditingId(bookmark.id);
                   setCurrentTitleInput(bookmark.title);
                 }}
                 onBlur={() => {
-                  if (editingId === bookmark.id && currentTitleInput !== bookmark.title) {
+                  if (
+                    editingId === bookmark.id &&
+                    currentTitleInput !== bookmark.title
+                  ) {
                     handleTitleChange(bookmark.id, currentTitleInput);
                   }
                   setEditingId(null);
                 }}
-                onChange={event => setCurrentTitleInput(event.currentTarget.value)}
+                onChange={(event) =>
+                  setCurrentTitleInput(event.currentTarget.value)
+                }
                 disabled={disabled}
               />
               <NumberInput
                 size="sm"
-                label={t('editTableOfContents.editor.field.page', 'Target page number')}
+                label={t(
+                  "editTableOfContents.editor.field.page",
+                  "Target page number",
+                )}
                 min={1}
                 clampBehavior="strict"
                 value={bookmark.pageNumber}
-                onChange={value => handlePageChange(bookmark.id, value ?? 1)}
+                onChange={(value) => handlePageChange(bookmark.id, value ?? 1)}
                 disabled={disabled}
               />
             </Stack>
           )}
 
           {bookmark.expanded && hasChildren && (
-            <Stack gap="sm" pl="lg" style={{ borderLeft: '1px solid var(--border-default)' }}>
-              {bookmark.children.map(child => (
-                <Fragment key={child.id}>{renderBookmark(child, level + 1)}</Fragment>
+            <Stack
+              gap="sm"
+              pl="lg"
+              style={{ borderLeft: "1px solid var(--border-default)" }}
+            >
+              {bookmark.children.map((child) => (
+                <Fragment key={child.id}>
+                  {renderBookmark(child, level + 1)}
+                </Fragment>
               ))}
             </Stack>
           )}
@@ -300,9 +388,14 @@ export default function BookmarkEditor({ bookmarks, onChange, disabled }: Bookma
     <Stack gap="md">
       <Group justify="space-between" align="flex-start">
         <div>
-          <Text fw={600}>{t('editTableOfContents.editor.heading', 'Bookmark editor')}</Text>
+          <Text fw={600}>
+            {t("editTableOfContents.editor.heading", "Bookmark editor")}
+          </Text>
           <Text size="sm" c="dimmed">
-            {t('editTableOfContents.editor.description', 'Add, nest, and reorder bookmarks to craft your PDF outline.')}
+            {t(
+              "editTableOfContents.editor.description",
+              "Add, nest, and reorder bookmarks to craft your PDF outline.",
+            )}
           </Text>
         </div>
         <Button
@@ -315,17 +408,28 @@ export default function BookmarkEditor({ bookmarks, onChange, disabled }: Bookma
           }}
           disabled={disabled}
         >
-          {t('editTableOfContents.editor.addTopLevel', 'Add top-level bookmark')}
+          {t(
+            "editTableOfContents.editor.addTopLevel",
+            "Add top-level bookmark",
+          )}
         </Button>
       </Group>
 
       {bookmarks.length === 0 ? (
         <Paper withBorder radius="md" ta="center" py="xl">
           <Stack gap="xs" align="center" px="lg">
-            <LocalIcon icon="bookmark-add-rounded" style={{ fontSize: '2.25rem' }} />
-            <Text fw={600}>{t('editTableOfContents.editor.empty.title', 'No bookmarks yet')}</Text>
+            <LocalIcon
+              icon="bookmark-add-rounded"
+              style={{ fontSize: "2.25rem" }}
+            />
+            <Text fw={600}>
+              {t("editTableOfContents.editor.empty.title", "No bookmarks yet")}
+            </Text>
             <Text size="sm" c="dimmed" maw={420}>
-              {t('editTableOfContents.editor.empty.description', 'Import existing bookmarks or start by adding your first entry.')}
+              {t(
+                "editTableOfContents.editor.empty.description",
+                "Import existing bookmarks or start by adding your first entry.",
+              )}
             </Text>
             <Button
               variant="subtle"
@@ -337,13 +441,16 @@ export default function BookmarkEditor({ bookmarks, onChange, disabled }: Bookma
               }}
               disabled={disabled}
             >
-              {t('editTableOfContents.editor.empty.action', 'Add first bookmark')}
+              {t(
+                "editTableOfContents.editor.empty.action",
+                "Add first bookmark",
+              )}
             </Button>
           </Stack>
         </Paper>
       ) : (
         <Stack gap="sm">
-          {bookmarks.map(bookmark => renderBookmark(bookmark))}
+          {bookmarks.map((bookmark) => renderBookmark(bookmark))}
         </Stack>
       )}
     </Stack>
diff --git a/frontend/src/core/components/tools/editTableOfContents/EditTableOfContentsSettings.tsx b/frontend/src/core/components/tools/editTableOfContents/EditTableOfContentsSettings.tsx
index aa644acfd2..32c5087505 100644
--- a/frontend/src/core/components/tools/editTableOfContents/EditTableOfContentsSettings.tsx
+++ b/frontend/src/core/components/tools/editTableOfContents/EditTableOfContentsSettings.tsx
@@ -1,5 +1,5 @@
-import { useMemo } from 'react';
-import { useTranslation } from 'react-i18next';
+import { useMemo } from "react";
+import { useTranslation } from "react-i18next";
 import {
   Alert,
   Button,
@@ -9,9 +9,9 @@ import {
   Switch,
   Text,
   Tooltip,
-} from '@mantine/core';
-import LocalIcon from '@app/components/shared/LocalIcon';
-import { BookmarkNode } from '@app/utils/editTableOfContents';
+} from "@mantine/core";
+import LocalIcon from "@app/components/shared/LocalIcon";
+import { BookmarkNode } from "@app/utils/editTableOfContents";
 
 interface EditTableOfContentsSettingsProps {
   bookmarks: BookmarkNode[];
@@ -50,20 +50,39 @@ export default function EditTableOfContentsSettings({
 }: EditTableOfContentsSettingsProps) {
   const { t } = useTranslation();
 
-  const infoLines = useMemo(() => ([
-    t('editTableOfContents.info.line1', 'Each bookmark needs a descriptive title and the page it should open.'),
-    t('editTableOfContents.info.line2', 'Use child bookmarks to build a hierarchy for chapters, sections, or subsections.'),
-    t('editTableOfContents.info.line3', 'Import bookmarks from the selected PDF or from a JSON file to save time.'),
-  ]), [t]);
+  const infoLines = useMemo(
+    () => [
+      t(
+        "editTableOfContents.info.line1",
+        "Each bookmark needs a descriptive title and the page it should open.",
+      ),
+      t(
+        "editTableOfContents.info.line2",
+        "Use child bookmarks to build a hierarchy for chapters, sections, or subsections.",
+      ),
+      t(
+        "editTableOfContents.info.line3",
+        "Import bookmarks from the selected PDF or from a JSON file to save time.",
+      ),
+    ],
+    [t],
+  );
 
   return (
     <Stack gap="md">
       <Stack gap="xs">
-        <Text size="sm" fw={500}>{t('editTableOfContents.actions.source', 'Load bookmarks')}</Text>
+        <Text size="sm" fw={500}>
+          {t("editTableOfContents.actions.source", "Load bookmarks")}
+        </Text>
         <Text size="xs" c="dimmed">
           {selectedFileName
-            ? t('editTableOfContents.actions.selectedFile', { file: selectedFileName })
-            : t('editTableOfContents.actions.noFile', 'Select a PDF to extract existing bookmarks.')}
+            ? t("editTableOfContents.actions.selectedFile", {
+                file: selectedFileName,
+              })
+            : t(
+                "editTableOfContents.actions.noFile",
+                "Select a PDF to extract existing bookmarks.",
+              )}
         </Text>
       </Stack>
 
@@ -75,11 +94,21 @@ export default function EditTableOfContentsSettings({
           fullWidth
         >
           {selectedFileName
-            ? t('editTableOfContents.workbench.changeFile', 'Change PDF')
-            : t('editTableOfContents.workbench.selectFile', 'Select PDF')}
+            ? t("editTableOfContents.workbench.changeFile", "Change PDF")
+            : t("editTableOfContents.workbench.selectFile", "Select PDF")}
         </Button>
 
-        <Tooltip label={!selectedFileName ? t('editTableOfContents.actions.noFile', 'Select a PDF to extract existing bookmarks.') : ''} disabled={Boolean(selectedFileName)}>
+        <Tooltip
+          label={
+            !selectedFileName
+              ? t(
+                  "editTableOfContents.actions.noFile",
+                  "Select a PDF to extract existing bookmarks.",
+                )
+              : ""
+          }
+          disabled={Boolean(selectedFileName)}
+        >
           <Button
             variant="default"
             leftSection={<LocalIcon icon="picture-as-pdf-rounded" />}
@@ -88,12 +117,12 @@ export default function EditTableOfContentsSettings({
             disabled={disabled || !selectedFileName}
             fullWidth
           >
-            {t('editTableOfContents.actions.loadFromPdf', 'Load from PDF')}
+            {t("editTableOfContents.actions.loadFromPdf", "Load from PDF")}
           </Button>
         </Tooltip>
 
         <FileButton
-          onChange={file => file && onImportJson(file)}
+          onChange={(file) => file && onImportJson(file)}
           accept="application/json"
           disabled={disabled}
         >
@@ -105,13 +134,20 @@ export default function EditTableOfContentsSettings({
               disabled={disabled}
               fullWidth
             >
-              {t('editTableOfContents.actions.importJson', 'Import JSON')}
+              {t("editTableOfContents.actions.importJson", "Import JSON")}
             </Button>
           )}
         </FileButton>
 
         <Tooltip
-          label={canReadClipboard ? '' : t('editTableOfContents.actions.clipboardUnavailable', 'Clipboard access is not available in this browser.')}
+          label={
+            canReadClipboard
+              ? ""
+              : t(
+                  "editTableOfContents.actions.clipboardUnavailable",
+                  "Clipboard access is not available in this browser.",
+                )
+          }
           disabled={canReadClipboard}
         >
           <Button
@@ -121,13 +157,20 @@ export default function EditTableOfContentsSettings({
             disabled={disabled || !canReadClipboard}
             fullWidth
           >
-            {t('editTableOfContents.actions.importClipboard', 'Paste from clipboard')}
+            {t(
+              "editTableOfContents.actions.importClipboard",
+              "Paste from clipboard",
+            )}
           </Button>
         </Tooltip>
       </Stack>
 
       {loadError && (
-        <Alert color="red" radius="md" icon={<LocalIcon icon="error-outline-rounded" />}>
+        <Alert
+          color="red"
+          radius="md"
+          icon={<LocalIcon icon="error-outline-rounded" />}
+        >
           {loadError}
         </Alert>
       )}
@@ -135,7 +178,9 @@ export default function EditTableOfContentsSettings({
       <Divider />
 
       <Stack gap="xs">
-        <Text size="sm" fw={500}>{t('editTableOfContents.actions.export', 'Export bookmarks')}</Text>
+        <Text size="sm" fw={500}>
+          {t("editTableOfContents.actions.export", "Export bookmarks")}
+        </Text>
       </Stack>
 
       <Stack gap="sm">
@@ -146,11 +191,18 @@ export default function EditTableOfContentsSettings({
           disabled={disabled || bookmarks.length === 0}
           fullWidth
         >
-          {t('editTableOfContents.actions.exportJson', 'Download JSON')}
+          {t("editTableOfContents.actions.exportJson", "Download JSON")}
         </Button>
 
         <Tooltip
-          label={canWriteClipboard ? '' : t('editTableOfContents.actions.clipboardUnavailable', 'Clipboard access is not available in this browser.')}
+          label={
+            canWriteClipboard
+              ? ""
+              : t(
+                  "editTableOfContents.actions.clipboardUnavailable",
+                  "Clipboard access is not available in this browser.",
+                )
+          }
           disabled={canWriteClipboard}
         >
           <Button
@@ -160,7 +212,10 @@ export default function EditTableOfContentsSettings({
             disabled={disabled || bookmarks.length === 0 || !canWriteClipboard}
             fullWidth
           >
-            {t('editTableOfContents.actions.exportClipboard', 'Copy to clipboard')}
+            {t(
+              "editTableOfContents.actions.exportClipboard",
+              "Copy to clipboard",
+            )}
           </Button>
         </Tooltip>
       </Stack>
@@ -169,9 +224,17 @@ export default function EditTableOfContentsSettings({
 
       <Switch
         checked={replaceExisting}
-        onChange={(event) => onReplaceExistingChange(event.currentTarget.checked)}
-        label={t('editTableOfContents.settings.replaceExisting', 'Replace existing bookmarks')}
-        description={t('editTableOfContents.settings.replaceExistingHint', 'When disabled, the new outline is appended after the current bookmarks.')}
+        onChange={(event) =>
+          onReplaceExistingChange(event.currentTarget.checked)
+        }
+        label={t(
+          "editTableOfContents.settings.replaceExisting",
+          "Replace existing bookmarks",
+        )}
+        description={t(
+          "editTableOfContents.settings.replaceExistingHint",
+          "When disabled, the new outline is appended after the current bookmarks.",
+        )}
         disabled={disabled}
       />
 
diff --git a/frontend/src/core/components/tools/editTableOfContents/EditTableOfContentsWorkbenchView.tsx b/frontend/src/core/components/tools/editTableOfContents/EditTableOfContentsWorkbenchView.tsx
index 3cbc3979c2..43702d5c65 100644
--- a/frontend/src/core/components/tools/editTableOfContents/EditTableOfContentsWorkbenchView.tsx
+++ b/frontend/src/core/components/tools/editTableOfContents/EditTableOfContentsWorkbenchView.tsx
@@ -1,21 +1,13 @@
-import { useMemo } from 'react';
-import { useTranslation } from 'react-i18next';
-import {
-  Box,
-  Button,
-  Card,
-  Divider,
-  Group,
-  Stack,
-  Text,
-} from '@mantine/core';
-import LocalIcon from '@app/components/shared/LocalIcon';
-import { BookmarkNode } from '@app/utils/editTableOfContents';
-import ErrorNotification from '@app/components/tools/shared/ErrorNotification';
-import ResultsPreview from '@app/components/tools/shared/ResultsPreview';
-import BookmarkEditor from '@app/components/tools/editTableOfContents/BookmarkEditor';
-import { useFileActionTerminology } from '@app/hooks/useFileActionTerminology';
-import { downloadFromUrl } from '@app/services/downloadService';
+import { useMemo } from "react";
+import { useTranslation } from "react-i18next";
+import { Box, Button, Card, Divider, Group, Stack, Text } from "@mantine/core";
+import LocalIcon from "@app/components/shared/LocalIcon";
+import { BookmarkNode } from "@app/utils/editTableOfContents";
+import ErrorNotification from "@app/components/tools/shared/ErrorNotification";
+import ResultsPreview from "@app/components/tools/shared/ResultsPreview";
+import BookmarkEditor from "@app/components/tools/editTableOfContents/BookmarkEditor";
+import { useFileActionTerminology } from "@app/hooks/useFileActionTerminology";
+import { downloadFromUrl } from "@app/services/downloadService";
 
 export interface EditTableOfContentsWorkbenchViewData {
   bookmarks: BookmarkNode[];
@@ -40,7 +32,9 @@ interface EditTableOfContentsWorkbenchViewProps {
   data: EditTableOfContentsWorkbenchViewData | null;
 }
 
-const EditTableOfContentsWorkbenchView = ({ data }: EditTableOfContentsWorkbenchViewProps) => {
+const EditTableOfContentsWorkbenchView = ({
+  data,
+}: EditTableOfContentsWorkbenchViewProps) => {
   const { t } = useTranslation();
   const terminology = useFileActionTerminology();
   const files = data?.files ?? [];
@@ -51,7 +45,7 @@ const EditTableOfContentsWorkbenchView = ({ data }: EditTableOfContentsWorkbench
         file,
         thumbnail: thumbnails[index],
       })),
-    [files, thumbnails]
+    [files, thumbnails],
   );
 
   if (!data) {
@@ -59,9 +53,17 @@ const EditTableOfContentsWorkbenchView = ({ data }: EditTableOfContentsWorkbench
       <Box p="xl">
         <Card withBorder radius="md">
           <Stack gap="sm">
-            <Text fw={600}>{t('editTableOfContents.workbench.empty.title', 'Open the tool to start editing')}</Text>
+            <Text fw={600}>
+              {t(
+                "editTableOfContents.workbench.empty.title",
+                "Open the tool to start editing",
+              )}
+            </Text>
             <Text size="sm" c="dimmed">
-              {t('editTableOfContents.workbench.empty.description', 'Select the Edit Table of Contents tool to load its workspace.')}
+              {t(
+                "editTableOfContents.workbench.empty.description",
+                "Select the Edit Table of Contents tool to load its workspace.",
+              )}
             </Text>
           </Stack>
         </Card>
@@ -87,26 +89,29 @@ const EditTableOfContentsWorkbenchView = ({ data }: EditTableOfContentsWorkbench
   } = data;
 
   const showResults = Boolean(
-    previewFiles.length > 0 || downloadUrl || errorMessage
+    previewFiles.length > 0 || downloadUrl || errorMessage,
   );
 
   return (
     <Box
       p="lg"
       style={{
-        width: '100%',
-        height: '100%',
-        overflowY: 'auto',
-        background: 'var(--bg-raised)',
+        width: "100%",
+        height: "100%",
+        overflowY: "auto",
+        background: "var(--bg-raised)",
       }}
     >
       <Stack gap="xl" maw={1200} mx="auto">
         <Stack gap={4}>
           <Text size="xl" fw={700}>
-            {t('home.editTableOfContents.title', 'Edit Table of Contents')}
+            {t("home.editTableOfContents.title", "Edit Table of Contents")}
           </Text>
           <Text size="sm" c="dimmed">
-            {t('editTableOfContents.workbench.subtitle', 'Import bookmarks, build hierarchies, and apply the outline without cramped side panels.')}
+            {t(
+              "editTableOfContents.workbench.subtitle",
+              "Import bookmarks, build hierarchies, and apply the outline without cramped side panels.",
+            )}
           </Text>
         </Stack>
 
@@ -115,21 +120,32 @@ const EditTableOfContentsWorkbenchView = ({ data }: EditTableOfContentsWorkbench
           radius="md"
           p="xl"
           style={{
-            backgroundColor: 'var(--bg-surface)',
-            borderColor: 'var(--border-default)',
-            boxShadow: 'var(--shadow-md)',
+            backgroundColor: "var(--bg-surface)",
+            borderColor: "var(--border-default)",
+            boxShadow: "var(--shadow-md)",
           }}
         >
           <Stack gap="md">
             <Stack gap={2}>
-              <Text fw={600}>{t('editTableOfContents.editor.heading', 'Bookmark editor')}</Text>
+              <Text fw={600}>
+                {t("editTableOfContents.editor.heading", "Bookmark editor")}
+              </Text>
               <Text size="sm" c="dimmed">
                 {selectedFileName
-                  ? t('editTableOfContents.actions.selectedFile', { file: selectedFileName })
-                  : t('editTableOfContents.workbench.filePrompt', 'Select a PDF from your library or upload a new one to begin.')}
+                  ? t("editTableOfContents.actions.selectedFile", {
+                      file: selectedFileName,
+                    })
+                  : t(
+                      "editTableOfContents.workbench.filePrompt",
+                      "Select a PDF from your library or upload a new one to begin.",
+                    )}
               </Text>
             </Stack>
-            <BookmarkEditor bookmarks={bookmarks} onChange={onBookmarksChange} disabled={disabled} />
+            <BookmarkEditor
+              bookmarks={bookmarks}
+              onChange={onBookmarksChange}
+              disabled={disabled}
+            />
             <Divider />
             <Group justify="flex-end">
               <Button
@@ -139,7 +155,7 @@ const EditTableOfContentsWorkbenchView = ({ data }: EditTableOfContentsWorkbench
                 disabled={isExecuteDisabled}
                 loading={isExecuting}
               >
-                {t('editTableOfContents.submit', 'Apply table of contents')}
+                {t("editTableOfContents.submit", "Apply table of contents")}
               </Button>
             </Group>
           </Stack>
@@ -151,16 +167,24 @@ const EditTableOfContentsWorkbenchView = ({ data }: EditTableOfContentsWorkbench
             radius="md"
             p="xl"
             style={{
-              backgroundColor: 'var(--bg-surface)',
-              borderColor: 'var(--border-default)',
-              boxShadow: 'var(--shadow-md)',
+              backgroundColor: "var(--bg-surface)",
+              borderColor: "var(--border-default)",
+              boxShadow: "var(--shadow-md)",
             }}
           >
             <Stack gap="md">
               <Stack gap={4}>
-                <Text fw={600}>{t('editTableOfContents.results.title', 'Updated PDF with bookmarks')}</Text>
+                <Text fw={600}>
+                  {t(
+                    "editTableOfContents.results.title",
+                    "Updated PDF with bookmarks",
+                  )}
+                </Text>
                 <Text size="sm" c="dimmed">
-                  {t('editTableOfContents.results.subtitle', 'Download the processed file or undo the operation below.')}
+                  {t(
+                    "editTableOfContents.results.subtitle",
+                    "Download the processed file or undo the operation below.",
+                  )}
                 </Text>
               </Stack>
 
@@ -177,8 +201,13 @@ const EditTableOfContentsWorkbenchView = ({ data }: EditTableOfContentsWorkbench
               <Group justify="flex-end" gap="sm">
                 {downloadUrl && (
                   <Button
-                    leftSection={<LocalIcon icon='download-rounded' />}
-                    onClick={() => downloadFromUrl(downloadUrl, downloadFilename ?? "download")}
+                    leftSection={<LocalIcon icon="download-rounded" />}
+                    onClick={() =>
+                      downloadFromUrl(
+                        downloadUrl,
+                        downloadFilename ?? "download",
+                      )
+                    }
                   >
                     {terminology.download}
                   </Button>
@@ -189,7 +218,7 @@ const EditTableOfContentsWorkbenchView = ({ data }: EditTableOfContentsWorkbench
                   onClick={onUndo}
                   disabled={isExecuting}
                 >
-                  {t('undo', 'Undo')}
+                  {t("undo", "Undo")}
                 </Button>
               </Group>
             </Stack>
diff --git a/frontend/src/core/components/tools/extractImages/ExtractImagesSettings.tsx b/frontend/src/core/components/tools/extractImages/ExtractImagesSettings.tsx
index 9a6b347222..6bf41bef60 100644
--- a/frontend/src/core/components/tools/extractImages/ExtractImagesSettings.tsx
+++ b/frontend/src/core/components/tools/extractImages/ExtractImagesSettings.tsx
@@ -1,38 +1,46 @@
-import { useTranslation } from 'react-i18next';
-import { Stack, Select } from '@mantine/core';
-import { ExtractImagesParameters } from '@app/hooks/tools/extractImages/useExtractImagesParameters';
+import { useTranslation } from "react-i18next";
+import { Stack, Select } from "@mantine/core";
+import { ExtractImagesParameters } from "@app/hooks/tools/extractImages/useExtractImagesParameters";
 import { Z_INDEX_AUTOMATE_DROPDOWN } from "@app/styles/zIndex";
 
 interface ExtractImagesSettingsProps {
   parameters: ExtractImagesParameters;
-  onParameterChange: <K extends keyof ExtractImagesParameters>(key: K, value: ExtractImagesParameters[K]) => void;
+  onParameterChange: <K extends keyof ExtractImagesParameters>(
+    key: K,
+    value: ExtractImagesParameters[K],
+  ) => void;
   disabled?: boolean;
 }
 
 const ExtractImagesSettings = ({
   parameters,
   onParameterChange,
-  disabled = false
+  disabled = false,
 }: ExtractImagesSettingsProps) => {
   const { t } = useTranslation();
 
   return (
     <Stack gap="md">
       <Select
-        label={t('extractImages.selectText', 'Output Format')}
+        label={t("extractImages.selectText", "Output Format")}
         value={parameters.format}
         onChange={(value) => {
-          const allowedFormats = ['png', 'jpg', 'gif'] as const;
-          const format = allowedFormats.includes(value as any) ? (value as typeof allowedFormats[number]) : 'png';
-          onParameterChange('format', format);
+          const allowedFormats = ["png", "jpg", "gif"] as const;
+          const format = allowedFormats.includes(value as any)
+            ? (value as (typeof allowedFormats)[number])
+            : "png";
+          onParameterChange("format", format);
         }}
         data={[
-          { value: 'png', label: 'PNG' },
-          { value: 'jpg', label: 'JPG' },
-          { value: 'gif', label: 'GIF' },
+          { value: "png", label: "PNG" },
+          { value: "jpg", label: "JPG" },
+          { value: "gif", label: "GIF" },
         ]}
         disabled={disabled}
-        comboboxProps={{ withinPortal: true, zIndex: Z_INDEX_AUTOMATE_DROPDOWN }}
+        comboboxProps={{
+          withinPortal: true,
+          zIndex: Z_INDEX_AUTOMATE_DROPDOWN,
+        }}
       />
 
       {/* <Checkbox
@@ -45,4 +53,4 @@ const ExtractImagesSettings = ({
   );
 };
 
-export default ExtractImagesSettings;
\ No newline at end of file
+export default ExtractImagesSettings;
diff --git a/frontend/src/core/components/tools/extractPages/ExtractPagesSettings.tsx b/frontend/src/core/components/tools/extractPages/ExtractPagesSettings.tsx
index 4489458dbd..21f0e5a23e 100644
--- a/frontend/src/core/components/tools/extractPages/ExtractPagesSettings.tsx
+++ b/frontend/src/core/components/tools/extractPages/ExtractPagesSettings.tsx
@@ -5,32 +5,43 @@ import PageSelectionSyntaxHint from "@app/components/shared/PageSelectionSyntaxH
 
 interface ExtractPagesSettingsProps {
   parameters: ExtractPagesParameters;
-  onParameterChange: <K extends keyof ExtractPagesParameters>(key: K, value: ExtractPagesParameters[K]) => void;
+  onParameterChange: <K extends keyof ExtractPagesParameters>(
+    key: K,
+    value: ExtractPagesParameters[K],
+  ) => void;
   disabled?: boolean;
 }
 
-const ExtractPagesSettings = ({ parameters, onParameterChange, disabled = false }: ExtractPagesSettingsProps) => {
+const ExtractPagesSettings = ({
+  parameters,
+  onParameterChange,
+  disabled = false,
+}: ExtractPagesSettingsProps) => {
   const { t } = useTranslation();
 
   const handleChange = (value: string) => {
-    onParameterChange('pageNumbers', value);
+    onParameterChange("pageNumbers", value);
   };
 
   return (
     <Stack gap="md">
       <TextInput
-        label={t('extractPages.pageNumbers.label', 'Pages to Extract')}
-        value={parameters.pageNumbers || ''}
+        label={t("extractPages.pageNumbers.label", "Pages to Extract")}
+        value={parameters.pageNumbers || ""}
         onChange={(event) => handleChange(event.currentTarget.value)}
-        placeholder={t('extractPages.pageNumbers.placeholder', 'e.g., 1,3,5-8 or odd & 1-10')}
+        placeholder={t(
+          "extractPages.pageNumbers.placeholder",
+          "e.g., 1,3,5-8 or odd & 1-10",
+        )}
         disabled={disabled}
         required
       />
-      <PageSelectionSyntaxHint input={parameters.pageNumbers || ''} variant="compact" />
+      <PageSelectionSyntaxHint
+        input={parameters.pageNumbers || ""}
+        variant="compact"
+      />
     </Stack>
   );
 };
 
 export default ExtractPagesSettings;
-
-
diff --git a/frontend/src/core/components/tools/flatten/FlattenSettings.tsx b/frontend/src/core/components/tools/flatten/FlattenSettings.tsx
index b8e97f8ef5..aa3bc42b45 100644
--- a/frontend/src/core/components/tools/flatten/FlattenSettings.tsx
+++ b/frontend/src/core/components/tools/flatten/FlattenSettings.tsx
@@ -4,11 +4,18 @@ import { FlattenParameters } from "@app/hooks/tools/flatten/useFlattenParameters
 
 interface FlattenSettingsProps {
   parameters: FlattenParameters;
-  onParameterChange: <K extends keyof FlattenParameters>(key: K, value: FlattenParameters[K]) => void;
+  onParameterChange: <K extends keyof FlattenParameters>(
+    key: K,
+    value: FlattenParameters[K],
+  ) => void;
   disabled?: boolean;
 }
 
-const FlattenSettings = ({ parameters, onParameterChange, disabled = false }: FlattenSettingsProps) => {
+const FlattenSettings = ({
+  parameters,
+  onParameterChange,
+  disabled = false,
+}: FlattenSettingsProps) => {
   const { t } = useTranslation();
 
   return (
@@ -16,13 +23,23 @@ const FlattenSettings = ({ parameters, onParameterChange, disabled = false }: Fl
       <Stack gap="sm">
         <Checkbox
           checked={parameters.flattenOnlyForms}
-          onChange={(event) => onParameterChange('flattenOnlyForms', event.currentTarget.checked)}
+          onChange={(event) =>
+            onParameterChange("flattenOnlyForms", event.currentTarget.checked)
+          }
           disabled={disabled}
           label={
             <div>
-              <Text size="sm">{t('flatten.options.flattenOnlyForms.label', 'Flatten only forms')}</Text>
+              <Text size="sm">
+                {t(
+                  "flatten.options.flattenOnlyForms.label",
+                  "Flatten only forms",
+                )}
+              </Text>
               <Text size="xs" c="dimmed">
-                {t('flatten.options.flattenOnlyForms.desc', 'Only flatten form fields, leaving other interactive elements intact')}
+                {t(
+                  "flatten.options.flattenOnlyForms.desc",
+                  "Only flatten form fields, leaving other interactive elements intact",
+                )}
               </Text>
             </div>
           }
@@ -31,11 +48,19 @@ const FlattenSettings = ({ parameters, onParameterChange, disabled = false }: Fl
 
       {!parameters.flattenOnlyForms && (
         <NumberInput
-          label={t('flatten.renderDpi.label', 'Rendering DPI')}
-          description={t('flatten.renderDpi.help', 'Leave blank to use the system default. Higher DPI sharpens output but increases processing time and file size.')}
-          placeholder={t('flatten.renderDpi.placeholder', 'e.g. 150')}
+          label={t("flatten.renderDpi.label", "Rendering DPI")}
+          description={t(
+            "flatten.renderDpi.help",
+            "Leave blank to use the system default. Higher DPI sharpens output but increases processing time and file size.",
+          )}
+          placeholder={t("flatten.renderDpi.placeholder", "e.g. 150")}
           value={parameters.renderDpi ?? undefined}
-          onChange={(value) => onParameterChange('renderDpi', value != null && value !== '' ? Number(value) : undefined)}
+          onChange={(value) =>
+            onParameterChange(
+              "renderDpi",
+              value != null && value !== "" ? Number(value) : undefined,
+            )
+          }
           disabled={disabled}
           min={72}
           max={2400}
@@ -46,4 +71,4 @@ const FlattenSettings = ({ parameters, onParameterChange, disabled = false }: Fl
   );
 };
 
-export default FlattenSettings;
\ No newline at end of file
+export default FlattenSettings;
diff --git a/frontend/src/core/components/tools/fullscreen/CompactToolItem.tsx b/frontend/src/core/components/tools/fullscreen/CompactToolItem.tsx
index d52fac33b7..858e1fd572 100644
--- a/frontend/src/core/components/tools/fullscreen/CompactToolItem.tsx
+++ b/frontend/src/core/components/tools/fullscreen/CompactToolItem.tsx
@@ -1,11 +1,20 @@
-import React from 'react';
-import { Text, Badge } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { Tooltip } from '@app/components/shared/Tooltip';
-import HotkeyDisplay from '@app/components/hotkeys/HotkeyDisplay';
-import FavoriteStar from '@app/components/tools/toolPicker/FavoriteStar';
-import { ToolRegistryEntry, getSubcategoryColor } from '@app/data/toolsTaxonomy';
-import { getIconBackground, getIconStyle, getItemClasses, useToolMeta, getDisabledLabel } from '@app/components/tools/fullscreen/shared';
+import React from "react";
+import { Text, Badge } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import { Tooltip } from "@app/components/shared/Tooltip";
+import HotkeyDisplay from "@app/components/hotkeys/HotkeyDisplay";
+import FavoriteStar from "@app/components/tools/toolPicker/FavoriteStar";
+import {
+  ToolRegistryEntry,
+  getSubcategoryColor,
+} from "@app/data/toolsTaxonomy";
+import {
+  getIconBackground,
+  getIconStyle,
+  getItemClasses,
+  useToolMeta,
+  getDisabledLabel,
+} from "@app/components/tools/fullscreen/shared";
 
 interface CompactToolItemProps {
   id: string;
@@ -15,20 +24,29 @@ interface CompactToolItemProps {
   tooltipPortalTarget?: HTMLElement | undefined;
 }
 
-const CompactToolItem: React.FC<CompactToolItemProps> = ({ id, tool, isSelected, onClick, tooltipPortalTarget }) => {
+const CompactToolItem: React.FC<CompactToolItemProps> = ({
+  id,
+  tool,
+  isSelected,
+  onClick,
+  tooltipPortalTarget,
+}) => {
   const { t } = useTranslation();
-  const { binding, isFav, toggleFavorite, disabled, disabledReason } = useToolMeta(id, tool);
+  const { binding, isFav, toggleFavorite, disabled, disabledReason } =
+    useToolMeta(id, tool);
   const categoryColor = getSubcategoryColor(tool.subcategoryId);
   const iconBg = getIconBackground(categoryColor, false);
-  const iconClasses = 'tool-panel__fullscreen-list-icon';
+  const iconClasses = "tool-panel__fullscreen-list-icon";
 
   let iconNode: React.ReactNode;
   if (React.isValidElement<{ style?: React.CSSProperties }>(tool.icon)) {
-    const element = tool.icon as React.ReactElement<{ style?: React.CSSProperties }>;
+    const element = tool.icon as React.ReactElement<{
+      style?: React.CSSProperties;
+    }>;
     iconNode = React.cloneElement(element, {
       style: {
         ...(element.props.style || {}),
-        fontSize: '1.5rem',
+        fontSize: "1.5rem",
       },
     });
   } else {
@@ -38,7 +56,7 @@ const CompactToolItem: React.FC<CompactToolItemProps> = ({ id, tool, isSelected,
   const compactButton = (
     <button
       type="button"
-      className={`tool-panel__fullscreen-list-item ${getItemClasses(false)} ${isSelected ? 'tool-panel__fullscreen-list-item--selected' : ''} ${!disabled ? 'tool-panel__fullscreen-list-item--with-star' : ''}`}
+      className={`tool-panel__fullscreen-list-item ${getItemClasses(false)} ${isSelected ? "tool-panel__fullscreen-list-item--selected" : ""} ${!disabled ? "tool-panel__fullscreen-list-item--with-star" : ""}`}
       onClick={onClick}
       aria-disabled={disabled}
       disabled={disabled}
@@ -57,17 +75,13 @@ const CompactToolItem: React.FC<CompactToolItemProps> = ({ id, tool, isSelected,
         </span>
       ) : null}
       <span className="tool-panel__fullscreen-list-body">
-        <div style={{ display: 'flex', alignItems: 'center', gap: '0.5rem' }}>
+        <div style={{ display: "flex", alignItems: "center", gap: "0.5rem" }}>
           <Text fw={600} size="sm" className="tool-panel__fullscreen-name">
             {tool.name}
           </Text>
-          {tool.versionStatus === 'alpha' && (
-            <Badge
-              size="xs"
-              variant="light"
-              color="orange"
-            >
-              {t('toolPanel.alpha', 'Alpha')}
+          {tool.versionStatus === "alpha" && (
+            <Badge size="xs" variant="light" color="orange">
+              {t("toolPanel.alpha", "Alpha")}
             </Badge>
           )}
         </div>
@@ -84,26 +98,36 @@ const CompactToolItem: React.FC<CompactToolItemProps> = ({ id, tool, isSelected,
     </button>
   );
 
-  const { key: disabledKey, fallback: disabledFallback } = getDisabledLabel(disabledReason);
+  const { key: disabledKey, fallback: disabledFallback } =
+    getDisabledLabel(disabledReason);
   const disabledMessage = t(disabledKey, disabledFallback);
 
-  const tooltipContent = disabled
-    ? (
-      <span><strong>{disabledMessage}</strong> {tool.description}</span>
-    )
-    : (
-      <div style={{ display: 'flex', flexDirection: 'column', gap: '0.35rem' }}>
-        <span>{tool.description}</span>
-        {binding && (
-          <div style={{ display: 'flex', alignItems: 'center', gap: '0.5rem', fontSize: '0.75rem' }}>
-            <span style={{ color: 'var(--mantine-color-dimmed)', fontWeight: 500 }}>
-              {t('settings.hotkeys.shortcut', 'Shortcut')}
-            </span>
-            <HotkeyDisplay binding={binding} />
-          </div>
-        )}
-      </div>
-    );
+  const tooltipContent = disabled ? (
+    <span>
+      <strong>{disabledMessage}</strong> {tool.description}
+    </span>
+  ) : (
+    <div style={{ display: "flex", flexDirection: "column", gap: "0.35rem" }}>
+      <span>{tool.description}</span>
+      {binding && (
+        <div
+          style={{
+            display: "flex",
+            alignItems: "center",
+            gap: "0.5rem",
+            fontSize: "0.75rem",
+          }}
+        >
+          <span
+            style={{ color: "var(--mantine-color-dimmed)", fontWeight: 500 }}
+          >
+            {t("settings.hotkeys.shortcut", "Shortcut")}
+          </span>
+          <HotkeyDisplay binding={binding} />
+        </div>
+      )}
+    </div>
+  );
 
   return (
     <Tooltip
@@ -119,4 +143,3 @@ const CompactToolItem: React.FC<CompactToolItemProps> = ({ id, tool, isSelected,
 };
 
 export default CompactToolItem;
-
diff --git a/frontend/src/core/components/tools/fullscreen/DetailedToolItem.tsx b/frontend/src/core/components/tools/fullscreen/DetailedToolItem.tsx
index 1ff93fbdf8..61372fad05 100644
--- a/frontend/src/core/components/tools/fullscreen/DetailedToolItem.tsx
+++ b/frontend/src/core/components/tools/fullscreen/DetailedToolItem.tsx
@@ -1,10 +1,19 @@
-import React from 'react';
-import { Text, Badge } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import HotkeyDisplay from '@app/components/hotkeys/HotkeyDisplay';
-import FavoriteStar from '@app/components/tools/toolPicker/FavoriteStar';
-import { ToolRegistryEntry, getSubcategoryColor } from '@app/data/toolsTaxonomy';
-import { getIconBackground, getIconStyle, getItemClasses, useToolMeta, getDisabledLabel } from '@app/components/tools/fullscreen/shared';
+import React from "react";
+import { Text, Badge } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import HotkeyDisplay from "@app/components/hotkeys/HotkeyDisplay";
+import FavoriteStar from "@app/components/tools/toolPicker/FavoriteStar";
+import {
+  ToolRegistryEntry,
+  getSubcategoryColor,
+} from "@app/data/toolsTaxonomy";
+import {
+  getIconBackground,
+  getIconStyle,
+  getItemClasses,
+  useToolMeta,
+  getDisabledLabel,
+} from "@app/components/tools/fullscreen/shared";
 
 interface DetailedToolItemProps {
   id: string;
@@ -13,34 +22,43 @@ interface DetailedToolItemProps {
   onClick: () => void;
 }
 
-const DetailedToolItem: React.FC<DetailedToolItemProps> = ({ id, tool, isSelected, onClick }) => {
+const DetailedToolItem: React.FC<DetailedToolItemProps> = ({
+  id,
+  tool,
+  isSelected,
+  onClick,
+}) => {
   const { t } = useTranslation();
-  const { binding, isFav, toggleFavorite, disabled, disabledReason } = useToolMeta(id, tool);
+  const { binding, isFav, toggleFavorite, disabled, disabledReason } =
+    useToolMeta(id, tool);
 
   const categoryColor = getSubcategoryColor(tool.subcategoryId);
   const iconBg = getIconBackground(categoryColor, true);
-  const iconClasses = 'tool-panel__fullscreen-icon';
+  const iconClasses = "tool-panel__fullscreen-icon";
 
   let iconNode: React.ReactNode;
   if (React.isValidElement<{ style?: React.CSSProperties }>(tool.icon)) {
-    const element = tool.icon as React.ReactElement<{ style?: React.CSSProperties }>;
+    const element = tool.icon as React.ReactElement<{
+      style?: React.CSSProperties;
+    }>;
     iconNode = React.cloneElement(element, {
       style: {
         ...(element.props.style || {}),
-        fontSize: '1.75rem',
+        fontSize: "1.75rem",
       },
     });
   } else {
     iconNode = tool.icon;
   }
 
-  const { key: disabledKey, fallback: disabledFallback } = getDisabledLabel(disabledReason);
+  const { key: disabledKey, fallback: disabledFallback } =
+    getDisabledLabel(disabledReason);
   const disabledMessage = t(disabledKey, disabledFallback);
 
   return (
     <button
       type="button"
-      className={`tool-panel__fullscreen-item ${getItemClasses(true)} ${isSelected ? 'tool-panel__fullscreen-item--selected' : ''} tool-panel__fullscreen-item--with-star`}
+      className={`tool-panel__fullscreen-item ${getItemClasses(true)} ${isSelected ? "tool-panel__fullscreen-item--selected" : ""} tool-panel__fullscreen-item--with-star`}
       onClick={onClick}
       aria-disabled={disabled}
       disabled={disabled}
@@ -59,33 +77,40 @@ const DetailedToolItem: React.FC<DetailedToolItemProps> = ({ id, tool, isSelecte
         </span>
       ) : null}
       <span className="tool-panel__fullscreen-body">
-        <div style={{ display: 'flex', alignItems: 'center', gap: '0.5rem' }}>
+        <div style={{ display: "flex", alignItems: "center", gap: "0.5rem" }}>
           <Text fw={600} size="sm" className="tool-panel__fullscreen-name">
             {tool.name}
           </Text>
-          {tool.versionStatus === 'alpha' && (
-            <Badge
-              size="xs"
-              variant="light"
-              color="orange"
-            >
+          {tool.versionStatus === "alpha" && (
+            <Badge size="xs" variant="light" color="orange">
               {/* we can add more translations for different badges in future, like beta, etc. */}
-            {t('toolPanel.alpha', 'Alpha')}
+              {t("toolPanel.alpha", "Alpha")}
             </Badge>
           )}
         </div>
-        <Text size="sm" c="dimmed" className="tool-panel__fullscreen-description">
+        <Text
+          size="sm"
+          c="dimmed"
+          className="tool-panel__fullscreen-description"
+        >
           {disabled ? (
             <>
               <strong>{disabledMessage} </strong>
               {tool.description}
             </>
-          ) : tool.description}
+          ) : (
+            tool.description
+          )}
         </Text>
         {binding && (
           <div className="tool-panel__fullscreen-shortcut">
-            <span style={{ color: 'var(--mantine-color-dimmed)', fontSize: '0.75rem' }}>
-              {t('settings.hotkeys.shortcut', 'Shortcut')}
+            <span
+              style={{
+                color: "var(--mantine-color-dimmed)",
+                fontSize: "0.75rem",
+              }}
+            >
+              {t("settings.hotkeys.shortcut", "Shortcut")}
             </span>
             <HotkeyDisplay binding={binding} size="sm" />
           </div>
@@ -105,4 +130,3 @@ const DetailedToolItem: React.FC<DetailedToolItemProps> = ({ id, tool, isSelecte
 };
 
 export default DetailedToolItem;
-
diff --git a/frontend/src/core/components/tools/fullscreen/shared.ts b/frontend/src/core/components/tools/fullscreen/shared.ts
index 7de37c3e41..b6f451ca1b 100644
--- a/frontend/src/core/components/tools/fullscreen/shared.ts
+++ b/frontend/src/core/components/tools/fullscreen/shared.ts
@@ -1,18 +1,23 @@
-import { useHotkeys } from '@app/contexts/HotkeyContext';
-import { useToolWorkflow } from '@app/contexts/ToolWorkflowContext';
-import { ToolRegistryEntry } from '@app/data/toolsTaxonomy';
-import { ToolId } from '@app/types/toolId';
-import type { ToolAvailabilityMap } from '@app/hooks/useToolManagement';
-import { useAppConfig } from '@app/contexts/AppConfigContext';
+import { useHotkeys } from "@app/contexts/HotkeyContext";
+import { useToolWorkflow } from "@app/contexts/ToolWorkflowContext";
+import { ToolRegistryEntry } from "@app/data/toolsTaxonomy";
+import { ToolId } from "@app/types/toolId";
+import type { ToolAvailabilityMap } from "@app/hooks/useToolManagement";
+import { useAppConfig } from "@app/contexts/AppConfigContext";
 
 export const getItemClasses = (isDetailed: boolean): string => {
-  return isDetailed ? 'tool-panel__fullscreen-item--detailed' : '';
+  return isDetailed ? "tool-panel__fullscreen-item--detailed" : "";
 };
 
-export const getIconBackground = (categoryColor: string, isDetailed: boolean): string => {
-  const baseColor = isDetailed ? 'var(--fullscreen-bg-icon-detailed)' : 'var(--fullscreen-bg-icon-compact)';
-  const blend1 = isDetailed ? '18%' : '15%';
-  const blend2 = isDetailed ? '8%' : '6%';
+export const getIconBackground = (
+  categoryColor: string,
+  isDetailed: boolean,
+): string => {
+  const baseColor = isDetailed
+    ? "var(--fullscreen-bg-icon-detailed)"
+    : "var(--fullscreen-bg-icon-compact)";
+  const blend1 = isDetailed ? "18%" : "15%";
+  const blend2 = isDetailed ? "8%" : "6%";
 
   return `linear-gradient(135deg,
     color-mix(in srgb, ${categoryColor} ${blend1}, ${baseColor}),
@@ -24,70 +29,80 @@ export const getIconStyle = (): Record<string, string> => {
   return {};
 };
 
-export type ToolDisabledReason = 'comingSoon' | 'disabledByAdmin' | 'missingDependency' | 'unknownUnavailable' | 'requiresPremium' | 'selfHostedOffline' | null;
+export type ToolDisabledReason =
+  | "comingSoon"
+  | "disabledByAdmin"
+  | "missingDependency"
+  | "unknownUnavailable"
+  | "requiresPremium"
+  | "selfHostedOffline"
+  | null;
 
 export const getToolDisabledReason = (
   id: string,
   tool: ToolRegistryEntry,
   toolAvailability?: ToolAvailabilityMap,
-  premiumEnabled?: boolean
+  premiumEnabled?: boolean,
 ): ToolDisabledReason => {
-  if (!tool.component && !tool.link && id !== 'read' && id !== 'multiTool') {
-    return 'comingSoon';
+  if (!tool.component && !tool.link && id !== "read" && id !== "multiTool") {
+    return "comingSoon";
   }
 
   // Check if tool requires premium but premium is not enabled
   if (tool.requiresPremium === true && premiumEnabled !== true) {
-    return 'requiresPremium';
+    return "requiresPremium";
   }
 
   const availabilityInfo = toolAvailability?.[id as ToolId];
   if (availabilityInfo && availabilityInfo.available === false) {
-    if (availabilityInfo.reason === 'selfHostedOffline') {
-      return 'selfHostedOffline';
+    if (availabilityInfo.reason === "selfHostedOffline") {
+      return "selfHostedOffline";
     }
-    if (availabilityInfo.reason === 'missingDependency') {
-      return 'missingDependency';
+    if (availabilityInfo.reason === "missingDependency") {
+      return "missingDependency";
     }
-    if (availabilityInfo.reason === 'disabledByAdmin') {
-      return 'disabledByAdmin';
+    if (availabilityInfo.reason === "disabledByAdmin") {
+      return "disabledByAdmin";
     }
-    return 'unknownUnavailable';
+    return "unknownUnavailable";
   }
 
   return null;
 };
 
 export const getDisabledLabel = (
-  disabledReason: ToolDisabledReason
+  disabledReason: ToolDisabledReason,
 ): { key: string; fallback: string } => {
-  if (disabledReason === 'requiresPremium') {
+  if (disabledReason === "requiresPremium") {
     return {
-      key: 'toolPanel.premiumFeature',
-      fallback: 'Premium feature:'
+      key: "toolPanel.premiumFeature",
+      fallback: "Premium feature:",
     };
   }
-  if (disabledReason === 'selfHostedOffline') {
+  if (disabledReason === "selfHostedOffline") {
     return {
-      key: 'toolPanel.fullscreen.selfHostedOffline',
-      fallback: 'Requires your Stirling-PDF server (currently offline):'
+      key: "toolPanel.fullscreen.selfHostedOffline",
+      fallback: "Requires your Stirling-PDF server (currently offline):",
     };
   }
-  if (disabledReason === 'missingDependency') {
+  if (disabledReason === "missingDependency") {
     return {
-      key: 'toolPanel.fullscreen.unavailableDependency',
-      fallback: 'Unavailable - required tool missing on server:'
+      key: "toolPanel.fullscreen.unavailableDependency",
+      fallback: "Unavailable - required tool missing on server:",
     };
   }
-  if (disabledReason === 'disabledByAdmin' || disabledReason === 'unknownUnavailable') {
+  if (
+    disabledReason === "disabledByAdmin" ||
+    disabledReason === "unknownUnavailable"
+  ) {
     return {
-      key: 'toolPanel.fullscreen.unavailable',
-      fallback: 'Disabled by server administrator:'
+      key: "toolPanel.fullscreen.unavailable",
+      fallback: "Disabled by server administrator:",
     };
   }
   return {
-    key: 'toolPanel.fullscreen.comingSoon',
-    fallback: 'Coming soon:'
+    key: "toolPanel.fullscreen.comingSoon",
+    fallback: "Coming soon:",
   };
 };
 
@@ -99,7 +114,12 @@ export function useToolMeta(id: string, tool: ToolRegistryEntry) {
 
   const isFav = isFavorite(id as ToolId);
   const binding = hotkeys[id as ToolId];
-  const disabledReason = getToolDisabledReason(id, tool, toolAvailability, premiumEnabled);
+  const disabledReason = getToolDisabledReason(
+    id,
+    tool,
+    toolAvailability,
+    premiumEnabled,
+  );
   const disabled = disabledReason !== null;
 
   return {
@@ -110,5 +130,3 @@ export function useToolMeta(id: string, tool: ToolRegistryEntry) {
     disabledReason,
   };
 }
-
-
diff --git a/frontend/src/core/components/tools/getPdfInfo/GetPdfInfoReportView.tsx b/frontend/src/core/components/tools/getPdfInfo/GetPdfInfoReportView.tsx
index cda86d9987..8a3e3c381d 100644
--- a/frontend/src/core/components/tools/getPdfInfo/GetPdfInfoReportView.tsx
+++ b/frontend/src/core/components/tools/getPdfInfo/GetPdfInfoReportView.tsx
@@ -1,32 +1,42 @@
-import React, { useEffect, useMemo, useRef } from 'react';
-import { Badge, Divider, Stack, Text } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
+import React, { useEffect, useMemo, useRef } from "react";
+import { Badge, Divider, Stack, Text } from "@mantine/core";
+import { useTranslation } from "react-i18next";
 import type {
   PdfInfoReportData,
   PdfInfoReportEntry,
   PdfInfoBackendData,
   ParsedPdfSections,
-} from '@app/types/getPdfInfo';
-import '@app/components/tools/validateSignature/reportView/styles.css';
-import SummarySection from '@app/components/tools/getPdfInfo/sections/SummarySection';
-import KeyValueSection from '@app/components/tools/getPdfInfo/sections/KeyValueSection';
-import TableOfContentsSection from '@app/components/tools/getPdfInfo/sections/TableOfContentsSection';
-import OtherSection from '@app/components/tools/getPdfInfo/sections/OtherSection';
-import PerPageSection from '@app/components/tools/getPdfInfo/sections/PerPageSection';
-import ComplianceSection from '@app/components/tools/getPdfInfo/sections/ComplianceSection';
-
+} from "@app/types/getPdfInfo";
+import "@app/components/tools/validateSignature/reportView/styles.css";
+import SummarySection from "@app/components/tools/getPdfInfo/sections/SummarySection";
+import KeyValueSection from "@app/components/tools/getPdfInfo/sections/KeyValueSection";
+import TableOfContentsSection from "@app/components/tools/getPdfInfo/sections/TableOfContentsSection";
+import OtherSection from "@app/components/tools/getPdfInfo/sections/OtherSection";
+import PerPageSection from "@app/components/tools/getPdfInfo/sections/PerPageSection";
+import ComplianceSection from "@app/components/tools/getPdfInfo/sections/ComplianceSection";
 
 /** Valid section anchor IDs for navigation */
 const VALID_ANCHORS = new Set([
-  'summary', 'metadata', 'formFields', 'basicInfo', 'documentInfo',
-  'compliance', 'encryption', 'permissions', 'toc', 'other', 'perPage',
+  "summary",
+  "metadata",
+  "formFields",
+  "basicInfo",
+  "documentInfo",
+  "compliance",
+  "encryption",
+  "permissions",
+  "toc",
+  "other",
+  "perPage",
 ]);
 
 interface GetPdfInfoReportViewProps {
   data: PdfInfoReportData & { scrollTo?: string | null };
 }
 
-const GetPdfInfoReportView: React.FC<GetPdfInfoReportViewProps> = ({ data }) => {
+const GetPdfInfoReportView: React.FC<GetPdfInfoReportViewProps> = ({
+  data,
+}) => {
   const { t } = useTranslation();
   const containerRef = useRef<HTMLDivElement>(null);
   const entry: PdfInfoReportEntry | null = data.entries[0] ?? null;
@@ -38,19 +48,24 @@ const GetPdfInfoReportView: React.FC<GetPdfInfoReportViewProps> = ({ data }) =>
     const el = container?.querySelector<HTMLElement>(`#${anchor}`);
     if (el && container) {
       // Calculate scroll position with 4rem buffer from top
-      const bufferPx = parseFloat(getComputedStyle(document.documentElement).fontSize) * 4;
+      const bufferPx =
+        parseFloat(getComputedStyle(document.documentElement).fontSize) * 4;
       const elementTop = el.getBoundingClientRect().top;
       const containerTop = container.getBoundingClientRect().top;
       const currentScroll = container.scrollTop;
-      const targetScroll = currentScroll + (elementTop - containerTop) - bufferPx;
-      
-      container.scrollTo({ top: Math.max(0, targetScroll), behavior: 'smooth' });
-      
+      const targetScroll =
+        currentScroll + (elementTop - containerTop) - bufferPx;
+
+      container.scrollTo({
+        top: Math.max(0, targetScroll),
+        behavior: "smooth",
+      });
+
       // Flash highlight the section
-      el.classList.remove('section-flash-highlight');
+      el.classList.remove("section-flash-highlight");
       void el.offsetWidth; // Force reflow
-      el.classList.add('section-flash-highlight');
-      setTimeout(() => el.classList.remove('section-flash-highlight'), 1500);
+      el.classList.add("section-flash-highlight");
+      setTimeout(() => el.classList.remove("section-flash-highlight"), 1500);
     }
   }, [data.scrollTo]);
 
@@ -58,15 +73,15 @@ const GetPdfInfoReportView: React.FC<GetPdfInfoReportViewProps> = ({ data }) =>
     const raw: PdfInfoBackendData = entry?.data ?? {};
     return {
       metadata: raw.Metadata ?? null,
-      formFields: raw.FormFields ?? raw['Form Fields'] ?? null,
-      basicInfo: raw.BasicInfo ?? raw['Basic Info'] ?? null,
-      documentInfo: raw.DocumentInfo ?? raw['Document Info'] ?? null,
+      formFields: raw.FormFields ?? raw["Form Fields"] ?? null,
+      basicInfo: raw.BasicInfo ?? raw["Basic Info"] ?? null,
+      documentInfo: raw.DocumentInfo ?? raw["Document Info"] ?? null,
       compliance: raw.Compliancy ?? raw.Compliance ?? null,
       encryption: raw.Encryption ?? null,
       permissions: raw.Permissions ?? null,
-      toc: raw['Bookmarks/Outline/TOC'] ?? raw['Table of Contents'] ?? null,
+      toc: raw["Bookmarks/Outline/TOC"] ?? raw["Table of Contents"] ?? null,
       other: raw.Other ?? null,
-      perPage: raw.PerPageInfo ?? raw['Per Page Info'] ?? null,
+      perPage: raw.PerPageInfo ?? raw["Per Page Info"] ?? null,
       summaryData: raw.SummaryData ?? null,
     };
   }, [entry]);
@@ -75,8 +90,12 @@ const GetPdfInfoReportView: React.FC<GetPdfInfoReportViewProps> = ({ data }) =>
     return (
       <div className="report-container">
         <Stack gap="md" align="center">
-          <Badge color="gray" variant="light">No Data</Badge>
-          <Text size="sm" c="dimmed">Run the tool to generate the report.</Text>
+          <Badge color="gray" variant="light">
+            No Data
+          </Badge>
+          <Text size="sm" c="dimmed">
+            Run the tool to generate the report.
+          </Text>
         </Stack>
       </div>
     );
@@ -85,38 +104,71 @@ const GetPdfInfoReportView: React.FC<GetPdfInfoReportViewProps> = ({ data }) =>
   return (
     <div className="report-container" ref={containerRef}>
       <Stack gap="xl" align="center">
-
         <div className="simulated-page">
           <Stack gap="lg">
             <Stack gap="xs">
-              <Text fw={700} size="xl" style={{ lineHeight: 1.3, wordBreak: 'break-word' }}>
+              <Text
+                fw={700}
+                size="xl"
+                style={{ lineHeight: 1.3, wordBreak: "break-word" }}
+              >
                 {entry.fileName}
-                <Text component="span" fw={700}> - {t('getPdfInfo.summary.title', 'PDF Summary')}</Text>
+                <Text component="span" fw={700}>
+                  {" "}
+                  - {t("getPdfInfo.summary.title", "PDF Summary")}
+                </Text>
               </Text>
               <Divider />
             </Stack>
 
             <SummarySection sections={sections} hideSectionTitle />
 
-            <KeyValueSection title={t('getPdfInfo.sections.metadata', 'Metadata')} anchorId="metadata" obj={sections.metadata} />
-
-            <KeyValueSection title={t('getPdfInfo.sections.formFields', 'Form Fields')} anchorId="formFields" obj={sections.formFields} />
-
-            <KeyValueSection title={t('getPdfInfo.sections.basicInfo', 'Basic Info')} anchorId="basicInfo" obj={sections.basicInfo} />
-
-            <KeyValueSection title={t('getPdfInfo.sections.documentInfo', 'Document Info')} anchorId="documentInfo" obj={sections.documentInfo} />
-
-            <ComplianceSection 
-              anchorId="compliance" 
-              complianceSummary={sections.summaryData?.Compliance} 
-              legacyCompliance={sections.compliance} 
+            <KeyValueSection
+              title={t("getPdfInfo.sections.metadata", "Metadata")}
+              anchorId="metadata"
+              obj={sections.metadata}
             />
 
-            <KeyValueSection title={t('getPdfInfo.sections.encryption', 'Encryption')} anchorId="encryption" obj={sections.encryption} />
+            <KeyValueSection
+              title={t("getPdfInfo.sections.formFields", "Form Fields")}
+              anchorId="formFields"
+              obj={sections.formFields}
+            />
 
-            <KeyValueSection title={t('getPdfInfo.sections.permissions', 'Permissions')} anchorId="permissions" obj={sections.permissions} />
+            <KeyValueSection
+              title={t("getPdfInfo.sections.basicInfo", "Basic Info")}
+              anchorId="basicInfo"
+              obj={sections.basicInfo}
+            />
 
-            <TableOfContentsSection anchorId="toc" tocArray={sections.toc ?? []} />
+            <KeyValueSection
+              title={t("getPdfInfo.sections.documentInfo", "Document Info")}
+              anchorId="documentInfo"
+              obj={sections.documentInfo}
+            />
+
+            <ComplianceSection
+              anchorId="compliance"
+              complianceSummary={sections.summaryData?.Compliance}
+              legacyCompliance={sections.compliance}
+            />
+
+            <KeyValueSection
+              title={t("getPdfInfo.sections.encryption", "Encryption")}
+              anchorId="encryption"
+              obj={sections.encryption}
+            />
+
+            <KeyValueSection
+              title={t("getPdfInfo.sections.permissions", "Permissions")}
+              anchorId="permissions"
+              obj={sections.permissions}
+            />
+
+            <TableOfContentsSection
+              anchorId="toc"
+              tocArray={sections.toc ?? []}
+            />
 
             <OtherSection anchorId="other" other={sections.other} />
 
@@ -129,5 +181,3 @@ const GetPdfInfoReportView: React.FC<GetPdfInfoReportViewProps> = ({ data }) =>
 };
 
 export default GetPdfInfoReportView;
-
-
diff --git a/frontend/src/core/components/tools/getPdfInfo/GetPdfInfoResults.tsx b/frontend/src/core/components/tools/getPdfInfo/GetPdfInfoResults.tsx
index a6be1bcc11..7c1c5fe423 100644
--- a/frontend/src/core/components/tools/getPdfInfo/GetPdfInfoResults.tsx
+++ b/frontend/src/core/components/tools/getPdfInfo/GetPdfInfoResults.tsx
@@ -1,8 +1,8 @@
-import { useCallback, useMemo } from 'react';
-import { Alert, Button, Group, Loader, Stack, Text } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import type { GetPdfInfoOperationHook } from '@app/hooks/tools/getPdfInfo/useGetPdfInfoOperation';
-import { downloadFile } from '@app/services/downloadService';
+import { useCallback, useMemo } from "react";
+import { Alert, Button, Group, Loader, Stack, Text } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import type { GetPdfInfoOperationHook } from "@app/hooks/tools/getPdfInfo/useGetPdfInfoOperation";
+import { downloadFile } from "@app/services/downloadService";
 
 interface GetPdfInfoResultsProps {
   operation: GetPdfInfoOperationHook;
@@ -14,12 +14,22 @@ const findFileByExtension = (files: File[], extension: string) => {
   return files.find((file) => file.name.toLowerCase().endsWith(extension));
 };
 
-const GetPdfInfoResults = ({ operation, isLoading, errorMessage }: GetPdfInfoResultsProps) => {
+const GetPdfInfoResults = ({
+  operation,
+  isLoading,
+  errorMessage,
+}: GetPdfInfoResultsProps) => {
   const { t } = useTranslation();
 
-  const jsonFile = useMemo(() => findFileByExtension(operation.files, '.json'), [operation.files]);
+  const jsonFile = useMemo(
+    () => findFileByExtension(operation.files, ".json"),
+    [operation.files],
+  );
   const selectedFile = useMemo(() => jsonFile ?? null, [jsonFile]);
-  const selectedDownloadLabel = useMemo(() => t('getPdfInfo.downloadJson', 'Download JSON'), [t]);
+  const selectedDownloadLabel = useMemo(
+    () => t("getPdfInfo.downloadJson", "Download JSON"),
+    [t],
+  );
 
   const handleDownload = useCallback((file: File) => {
     void downloadFile({ data: file, filename: file.name });
@@ -29,15 +39,21 @@ const GetPdfInfoResults = ({ operation, isLoading, errorMessage }: GetPdfInfoRes
     return (
       <Group justify="center" gap="sm" py="md">
         <Loader size="sm" />
-        <Text>{t('getPdfInfo.processing', 'Extracting information...')}</Text>
+        <Text>{t("getPdfInfo.processing", "Extracting information...")}</Text>
       </Group>
     );
   }
 
   if (!isLoading && operation.results.length === 0) {
     return (
-      <Alert color="gray" variant="light" title={t('getPdfInfo.results', 'Results')}>
-        <Text size="sm">{t('getPdfInfo.noResults', 'Run the tool to generate a report.')}</Text>
+      <Alert
+        color="gray"
+        variant="light"
+        title={t("getPdfInfo.results", "Results")}
+      >
+        <Text size="sm">
+          {t("getPdfInfo.noResults", "Run the tool to generate a report.")}
+        </Text>
       </Alert>
     );
   }
@@ -53,7 +69,7 @@ const GetPdfInfoResults = ({ operation, isLoading, errorMessage }: GetPdfInfoRes
 
       <Stack gap="xs">
         <Text size="sm" fw={600}>
-          {t('getPdfInfo.downloads', 'Downloads')}
+          {t("getPdfInfo.downloads", "Downloads")}
         </Text>
         <Button
           color="blue"
@@ -69,4 +85,3 @@ const GetPdfInfoResults = ({ operation, isLoading, errorMessage }: GetPdfInfoRes
 };
 
 export default GetPdfInfoResults;
-
diff --git a/frontend/src/core/components/tools/getPdfInfo/sections/ComplianceSection.tsx b/frontend/src/core/components/tools/getPdfInfo/sections/ComplianceSection.tsx
index b82128a688..b2d4c3ea1f 100644
--- a/frontend/src/core/components/tools/getPdfInfo/sections/ComplianceSection.tsx
+++ b/frontend/src/core/components/tools/getPdfInfo/sections/ComplianceSection.tsx
@@ -1,11 +1,23 @@
-import React, { useMemo } from 'react';
-import { Badge, Group, Stack, Text, ThemeIcon, Paper, Tooltip, Divider } from '@mantine/core';
-import CheckIcon from '@mui/icons-material/Check';
-import CloseIcon from '@mui/icons-material/Close';
-import InfoIcon from '@mui/icons-material/InfoOutlined';
-import SectionBlock from '@app/components/tools/getPdfInfo/shared/SectionBlock';
-import type { PdfCompliance, PdfComplianceSummary } from '@app/types/getPdfInfo';
-import { useTranslation } from 'react-i18next';
+import React, { useMemo } from "react";
+import {
+  Badge,
+  Group,
+  Stack,
+  Text,
+  ThemeIcon,
+  Paper,
+  Tooltip,
+  Divider,
+} from "@mantine/core";
+import CheckIcon from "@mui/icons-material/Check";
+import CloseIcon from "@mui/icons-material/Close";
+import InfoIcon from "@mui/icons-material/InfoOutlined";
+import SectionBlock from "@app/components/tools/getPdfInfo/shared/SectionBlock";
+import type {
+  PdfCompliance,
+  PdfComplianceSummary,
+} from "@app/types/getPdfInfo";
+import { useTranslation } from "react-i18next";
 
 interface ComplianceSectionProps {
   anchorId: string;
@@ -28,28 +40,33 @@ interface ComplianceCheckResult {
   sortOrder: number;
 }
 
-const parseStandardDisplayName = (standardId: string): { displayName: string; category: string; sortOrder: number } => {
+const parseStandardDisplayName = (
+  standardId: string,
+): { displayName: string; category: string; sortOrder: number } => {
   const id = standardId.toLowerCase().trim();
 
   // PDF/A variants: pdfa-1a, pdfa-1b, pdfa-2a, pdfa-2b, pdfa-2u, pdfa-3a, pdfa-3b, pdfa-3u, pdfa-4, etc.
   const pdfaMatch = id.match(/^pdf[_-]?a[_-]?(\d+)([abuf])?$/i);
   if (pdfaMatch) {
     const version = pdfaMatch[1];
-    const level = pdfaMatch[2]?.toUpperCase() || '';
+    const level = pdfaMatch[2]?.toUpperCase() || "";
     return {
       displayName: `PDF/A-${version}${level}`,
-      category: 'PDF/A',
-      sortOrder: 10 + parseInt(version) * 10 + (level === 'A' ? 1 : level === 'B' ? 2 : level === 'U' ? 3 : 0),
+      category: "PDF/A",
+      sortOrder:
+        10 +
+        parseInt(version) * 10 +
+        (level === "A" ? 1 : level === "B" ? 2 : level === "U" ? 3 : 0),
     };
   }
 
   // PDF/UA variants: pdfua-1, pdfua-2, etc.
   const pdfuaMatch = id.match(/^pdf[_-]?ua[_-]?(\d+)?$/i);
   if (pdfuaMatch) {
-    const version = pdfuaMatch[1] || '1';
+    const version = pdfuaMatch[1] || "1";
     return {
       displayName: `PDF/UA-${version}`,
-      category: 'PDF/UA',
+      category: "PDF/UA",
       sortOrder: 200 + parseInt(version),
     };
   }
@@ -57,10 +74,10 @@ const parseStandardDisplayName = (standardId: string): { displayName: string; ca
   // PDF/X variants
   const pdfxMatch = id.match(/^pdf[_-]?x[_-]?(.+)?$/i);
   if (pdfxMatch) {
-    const version = pdfxMatch[1]?.toUpperCase() || '';
+    const version = pdfxMatch[1]?.toUpperCase() || "";
     return {
-      displayName: `PDF/X${version ? `-${version}` : ''}`,
-      category: 'PDF/X',
+      displayName: `PDF/X${version ? `-${version}` : ""}`,
+      category: "PDF/X",
       sortOrder: 300,
     };
   }
@@ -68,40 +85,44 @@ const parseStandardDisplayName = (standardId: string): { displayName: string; ca
   // PDF/E variants
   const pdfeMatch = id.match(/^pdf[_-]?e[_-]?(.+)?$/i);
   if (pdfeMatch) {
-    const version = pdfeMatch[1]?.toUpperCase() || '';
+    const version = pdfeMatch[1]?.toUpperCase() || "";
     return {
-      displayName: `PDF/E${version ? `-${version}` : ''}`,
-      category: 'PDF/E',
+      displayName: `PDF/E${version ? `-${version}` : ""}`,
+      category: "PDF/E",
       sortOrder: 400,
     };
   }
 
   // PDF/VT
-  if (id.includes('pdfvt') || id.includes('pdf-vt') || id.includes('pdf_vt')) {
-    return { displayName: 'PDF/VT', category: 'PDF/VT', sortOrder: 500 };
+  if (id.includes("pdfvt") || id.includes("pdf-vt") || id.includes("pdf_vt")) {
+    return { displayName: "PDF/VT", category: "PDF/VT", sortOrder: 500 };
   }
 
   // SEC (EDGAR) compliance
-  if (id.includes('sec') || id.includes('edgar')) {
-    return { displayName: 'SEC (EDGAR)', category: 'SEC', sortOrder: 600 };
+  if (id.includes("sec") || id.includes("edgar")) {
+    return { displayName: "SEC (EDGAR)", category: "SEC", sortOrder: 600 };
   }
 
   // Not PDF/A indicator
-  if (id === 'not-pdfa' || id === 'not_pdfa') {
-    return { displayName: 'PDF/A Detection', category: 'Detection', sortOrder: 1 };
+  if (id === "not-pdfa" || id === "not_pdfa") {
+    return {
+      displayName: "PDF/A Detection",
+      category: "Detection",
+      sortOrder: 1,
+    };
   }
 
   // Fallback: capitalize and format
   return {
-    displayName: standardId.toUpperCase().replace(/[-_]/g, '/'),
-    category: 'Other',
+    displayName: standardId.toUpperCase().replace(/[-_]/g, "/"),
+    category: "Other",
     sortOrder: 999,
   };
 };
 
 const buildComplianceResults = (
   complianceSummary?: PdfComplianceSummary[] | null,
-  legacyCompliance?: PdfCompliance | null
+  legacyCompliance?: PdfCompliance | null,
 ): ComplianceCheckResult[] => {
   const results: ComplianceCheckResult[] = [];
   const processedCategories = new Set<string>();
@@ -109,11 +130,13 @@ const buildComplianceResults = (
   if (complianceSummary && complianceSummary.length > 0) {
     for (const item of complianceSummary) {
       // Skip the "not-pdfa" detection marker - it's informational, not a compliance check
-      if (item.Standard.toLowerCase() === 'not-pdfa') {
+      if (item.Standard.toLowerCase() === "not-pdfa") {
         continue;
       }
 
-      const { displayName, category, sortOrder } = parseStandardDisplayName(item.Standard);
+      const { displayName, category, sortOrder } = parseStandardDisplayName(
+        item.Standard,
+      );
       processedCategories.add(category);
 
       results.push({
@@ -129,16 +152,20 @@ const buildComplianceResults = (
 
   // Then, add SEC compliance from legacy data if not already present
   // SEC compliance is checked separately by PDFBox, not VeraPDF
-  if (legacyCompliance && 'IsPDF/SECCompliant' in legacyCompliance && !processedCategories.has('SEC')) {
-    const isSecCompliant = legacyCompliance['IsPDF/SECCompliant'] as boolean;
+  if (
+    legacyCompliance &&
+    "IsPDF/SECCompliant" in legacyCompliance &&
+    !processedCategories.has("SEC")
+  ) {
+    const isSecCompliant = legacyCompliance["IsPDF/SECCompliant"] as boolean;
     results.push({
-      displayName: 'SEC (EDGAR)',
-      category: 'SEC',
+      displayName: "SEC (EDGAR)",
+      category: "SEC",
       isCompliant: isSecCompliant,
       summary: isSecCompliant
-        ? 'Document meets SEC EDGAR filing requirements'
-        : 'Document does not meet SEC EDGAR filing requirements',
-      standardId: 'sec-edgar',
+        ? "Document meets SEC EDGAR filing requirements"
+        : "Document does not meet SEC EDGAR filing requirements",
+      standardId: "sec-edgar",
       sortOrder: 600,
     });
   }
@@ -149,9 +176,11 @@ const buildComplianceResults = (
   return results;
 };
 
-const getConformanceLevel = (results: ComplianceCheckResult[]): string | null => {
+const getConformanceLevel = (
+  results: ComplianceCheckResult[],
+): string | null => {
   const passingPdfA = results
-    .filter(r => r.category === 'PDF/A' && r.isCompliant)
+    .filter((r) => r.category === "PDF/A" && r.isCompliant)
     .sort((a, b) => b.sortOrder - a.sortOrder);
 
   if (passingPdfA.length > 0) {
@@ -166,10 +195,10 @@ const ComplianceRow: React.FC<{
 }> = ({ result }) => {
   const { t } = useTranslation();
   const Icon = result.isCompliant ? CheckIcon : CloseIcon;
-  const color = result.isCompliant ? 'teal' : 'red';
+  const color = result.isCompliant ? "teal" : "red";
   const statusText = result.isCompliant
-    ? t('getPdfInfo.compliance.passed', 'Passed')
-    : t('getPdfInfo.compliance.failed', 'Failed');
+    ? t("getPdfInfo.compliance.passed", "Passed")
+    : t("getPdfInfo.compliance.failed", "Failed");
 
   return (
     <Paper
@@ -183,14 +212,19 @@ const ComplianceRow: React.FC<{
       <Group justify="space-between" wrap="nowrap">
         <Group gap="sm" wrap="nowrap" style={{ minWidth: 0 }}>
           <ThemeIcon color={color} variant="light" size="lg" radius="xl">
-            <Icon style={{ fontSize: '1.2rem' }} />
+            <Icon style={{ fontSize: "1.2rem" }} />
           </ThemeIcon>
           <Stack gap={2} style={{ minWidth: 0 }}>
             <Text size="sm" fw={600} truncate>
               {result.displayName}
             </Text>
             <Tooltip label={result.summary} multiline maw={400} withArrow>
-              <Text size="xs" c="dimmed" lineClamp={1} style={{ cursor: 'help' }}>
+              <Text
+                size="xs"
+                c="dimmed"
+                lineClamp={1}
+                style={{ cursor: "help" }}
+              >
                 {result.summary}
               </Text>
             </Tooltip>
@@ -215,14 +249,20 @@ const EmptyComplianceState: React.FC = () => {
     <Paper p="md" radius="sm" withBorder>
       <Group gap="sm">
         <ThemeIcon color="gray" variant="light" size="lg" radius="xl">
-          <InfoIcon style={{ fontSize: '1.2rem' }} />
+          <InfoIcon style={{ fontSize: "1.2rem" }} />
         </ThemeIcon>
         <Stack gap={2}>
           <Text size="sm" fw={500}>
-            {t('getPdfInfo.compliance.noVerification', 'No Verification Performed')}
+            {t(
+              "getPdfInfo.compliance.noVerification",
+              "No Verification Performed",
+            )}
           </Text>
           <Text size="xs" c="dimmed">
-            {t('getPdfInfo.compliance.noVerificationDesc', 'PDF standards compliance was not verified for this document.')}
+            {t(
+              "getPdfInfo.compliance.noVerificationDesc",
+              "PDF standards compliance was not verified for this document.",
+            )}
           </Text>
         </Stack>
       </Group>
@@ -239,21 +279,24 @@ const ComplianceSection: React.FC<ComplianceSectionProps> = ({
 
   const complianceResults = useMemo(
     () => buildComplianceResults(complianceSummary, legacyCompliance),
-    [complianceSummary, legacyCompliance]
+    [complianceSummary, legacyCompliance],
   );
 
   const conformanceLevel = useMemo(
     () => getConformanceLevel(complianceResults),
-    [complianceResults]
+    [complianceResults],
   );
 
-  const passedCount = complianceResults.filter(r => r.isCompliant).length;
-  const failedCount = complianceResults.filter(r => !r.isCompliant).length;
+  const passedCount = complianceResults.filter((r) => r.isCompliant).length;
+  const failedCount = complianceResults.filter((r) => !r.isCompliant).length;
 
   const hasResults = complianceResults.length > 0;
 
   return (
-    <SectionBlock title={t('getPdfInfo.sections.compliance', 'Compliance')} anchorId={anchorId}>
+    <SectionBlock
+      title={t("getPdfInfo.sections.compliance", "Compliance")}
+      anchorId={anchorId}
+    >
       <Stack gap="md">
         {/* Summary header when there are results */}
         {hasResults && (
@@ -267,12 +310,14 @@ const ComplianceSection: React.FC<ComplianceSectionProps> = ({
                 )}
                 {passedCount > 0 && (
                   <Badge color="teal" variant="outline" size="sm">
-                    {passedCount} {t('getPdfInfo.compliance.passedCount', 'passed')}
+                    {passedCount}{" "}
+                    {t("getPdfInfo.compliance.passedCount", "passed")}
                   </Badge>
                 )}
                 {failedCount > 0 && (
                   <Badge color="red" variant="outline" size="sm">
-                    {failedCount} {t('getPdfInfo.compliance.failedCount', 'failed')}
+                    {failedCount}{" "}
+                    {t("getPdfInfo.compliance.failedCount", "failed")}
                   </Badge>
                 )}
               </Group>
@@ -285,7 +330,10 @@ const ComplianceSection: React.FC<ComplianceSectionProps> = ({
         {hasResults ? (
           <Stack gap="xs">
             {complianceResults.map((result, index) => (
-              <ComplianceRow key={`${result.standardId}-${index}`} result={result} />
+              <ComplianceRow
+                key={`${result.standardId}-${index}`}
+                result={result}
+              />
             ))}
           </Stack>
         ) : (
diff --git a/frontend/src/core/components/tools/getPdfInfo/sections/KeyValueSection.tsx b/frontend/src/core/components/tools/getPdfInfo/sections/KeyValueSection.tsx
index a98a475688..460b7848d9 100644
--- a/frontend/src/core/components/tools/getPdfInfo/sections/KeyValueSection.tsx
+++ b/frontend/src/core/components/tools/getPdfInfo/sections/KeyValueSection.tsx
@@ -1,6 +1,6 @@
-import React from 'react';
-import SectionBlock from '@app/components/tools/getPdfInfo/shared/SectionBlock';
-import KeyValueList from '@app/components/tools/getPdfInfo/shared/KeyValueList';
+import React from "react";
+import SectionBlock from "@app/components/tools/getPdfInfo/shared/SectionBlock";
+import KeyValueList from "@app/components/tools/getPdfInfo/shared/KeyValueList";
 
 interface KeyValueSectionProps {
   title: string;
@@ -9,7 +9,12 @@ interface KeyValueSectionProps {
   emptyLabel?: string;
 }
 
-const KeyValueSection: React.FC<KeyValueSectionProps> = ({ title, anchorId, obj, emptyLabel }) => {
+const KeyValueSection: React.FC<KeyValueSectionProps> = ({
+  title,
+  anchorId,
+  obj,
+  emptyLabel,
+}) => {
   return (
     <SectionBlock title={title} anchorId={anchorId}>
       <KeyValueList obj={obj} emptyLabel={emptyLabel} />
@@ -18,5 +23,3 @@ const KeyValueSection: React.FC<KeyValueSectionProps> = ({ title, anchorId, obj,
 };
 
 export default KeyValueSection;
-
-
diff --git a/frontend/src/core/components/tools/getPdfInfo/sections/OtherSection.tsx b/frontend/src/core/components/tools/getPdfInfo/sections/OtherSection.tsx
index 3bc515a1a2..72d3067910 100644
--- a/frontend/src/core/components/tools/getPdfInfo/sections/OtherSection.tsx
+++ b/frontend/src/core/components/tools/getPdfInfo/sections/OtherSection.tsx
@@ -1,24 +1,39 @@
-import React from 'react';
-import { Accordion, Stack, Text } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import type { PdfOtherInfo, PdfAttachmentInfo, PdfEmbeddedFileInfo } from '@app/types/getPdfInfo';
-import SectionBlock from '@app/components/tools/getPdfInfo/shared/SectionBlock';
-import ScrollableCodeBlock from '@app/components/tools/getPdfInfo/shared/ScrollableCodeBlock';
-import { pdfInfoAccordionStyles } from '@app/components/tools/getPdfInfo/shared/accordionStyles';
+import React from "react";
+import { Accordion, Stack, Text } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import type {
+  PdfOtherInfo,
+  PdfAttachmentInfo,
+  PdfEmbeddedFileInfo,
+} from "@app/types/getPdfInfo";
+import SectionBlock from "@app/components/tools/getPdfInfo/shared/SectionBlock";
+import ScrollableCodeBlock from "@app/components/tools/getPdfInfo/shared/ScrollableCodeBlock";
+import { pdfInfoAccordionStyles } from "@app/components/tools/getPdfInfo/shared/accordionStyles";
 
 interface OtherSectionProps {
   anchorId: string;
   other?: PdfOtherInfo | null;
 }
 
-const renderAttachmentsList = (attachments: PdfAttachmentInfo[] | undefined, emptyText: string) => {
-  if (!attachments || attachments.length === 0) return <Text size="sm" c="dimmed">{emptyText}</Text>;
+const renderAttachmentsList = (
+  attachments: PdfAttachmentInfo[] | undefined,
+  emptyText: string,
+) => {
+  if (!attachments || attachments.length === 0)
+    return (
+      <Text size="sm" c="dimmed">
+        {emptyText}
+      </Text>
+    );
   return (
     <Stack gap={4}>
       {attachments.map((attachment, idx) => (
-        <div key={idx} style={{ wordBreak: 'break-word', overflowWrap: 'break-word' }}>
+        <div
+          key={idx}
+          style={{ wordBreak: "break-word", overflowWrap: "break-word" }}
+        >
           <Text size="sm" c="dimmed">
-            <strong>{attachment.Name || 'Unnamed attachment'}</strong>
+            <strong>{attachment.Name || "Unnamed attachment"}</strong>
             {attachment.Description && ` - ${attachment.Description}`}
             {attachment.FileSize != null && ` (${attachment.FileSize} bytes)`}
           </Text>
@@ -28,14 +43,25 @@ const renderAttachmentsList = (attachments: PdfAttachmentInfo[] | undefined, emp
   );
 };
 
-const renderEmbeddedFilesList = (embeddedFiles: PdfEmbeddedFileInfo[] | undefined, emptyText: string) => {
-  if (!embeddedFiles || embeddedFiles.length === 0) return <Text size="sm" c="dimmed">{emptyText}</Text>;
+const renderEmbeddedFilesList = (
+  embeddedFiles: PdfEmbeddedFileInfo[] | undefined,
+  emptyText: string,
+) => {
+  if (!embeddedFiles || embeddedFiles.length === 0)
+    return (
+      <Text size="sm" c="dimmed">
+        {emptyText}
+      </Text>
+    );
   return (
     <Stack gap={4}>
       {embeddedFiles.map((file, idx) => (
-        <div key={idx} style={{ wordBreak: 'break-word', overflowWrap: 'break-word' }}>
+        <div
+          key={idx}
+          style={{ wordBreak: "break-word", overflowWrap: "break-word" }}
+        >
           <Text size="sm" c="dimmed">
-            <strong>{file.Name || 'Unnamed file'}</strong>
+            <strong>{file.Name || "Unnamed file"}</strong>
             {file.FileSize != null && ` (${file.FileSize} bytes)`}
             {file.MimeType && ` - ${file.MimeType}`}
             {file.CreationDate && ` - Created: ${file.CreationDate}`}
@@ -48,12 +74,22 @@ const renderEmbeddedFilesList = (embeddedFiles: PdfEmbeddedFileInfo[] | undefine
 };
 
 const renderList = (arr: unknown[] | undefined, emptyText: string) => {
-  if (!arr || arr.length === 0) return <Text size="sm" c="dimmed">{emptyText}</Text>;
+  if (!arr || arr.length === 0)
+    return (
+      <Text size="sm" c="dimmed">
+        {emptyText}
+      </Text>
+    );
   return (
     <Stack gap={4}>
       {arr.map((item, idx) => (
-        <Text key={idx} size="sm" c="dimmed" style={{ wordBreak: 'break-word', overflowWrap: 'break-word' }}>
-          {typeof item === 'string' ? item : JSON.stringify(item)}
+        <Text
+          key={idx}
+          size="sm"
+          c="dimmed"
+          style={{ wordBreak: "break-word", overflowWrap: "break-word" }}
+        >
+          {typeof item === "string" ? item : JSON.stringify(item)}
         </Text>
       ))}
     </Stack>
@@ -62,29 +98,41 @@ const renderList = (arr: unknown[] | undefined, emptyText: string) => {
 
 const OtherSection: React.FC<OtherSectionProps> = ({ anchorId, other }) => {
   const { t } = useTranslation();
-  const noneDetected = t('getPdfInfo.noneDetected', 'None detected');
+  const noneDetected = t("getPdfInfo.noneDetected", "None detected");
 
-  const structureTreeContent = Array.isArray(other?.StructureTree) && other.StructureTree.length > 0
-    ? JSON.stringify(other.StructureTree, null, 2)
-    : null;
+  const structureTreeContent =
+    Array.isArray(other?.StructureTree) && other.StructureTree.length > 0
+      ? JSON.stringify(other.StructureTree, null, 2)
+      : null;
 
   return (
-    <SectionBlock title={t('getPdfInfo.sections.other', 'Other')} anchorId={anchorId}>
+    <SectionBlock
+      title={t("getPdfInfo.sections.other", "Other")}
+      anchorId={anchorId}
+    >
       <Stack gap="sm">
         <Stack gap={6}>
-          <Text fw={600} size="sm">{t('getPdfInfo.other.attachments', 'Attachments')}</Text>
+          <Text fw={600} size="sm">
+            {t("getPdfInfo.other.attachments", "Attachments")}
+          </Text>
           {renderAttachmentsList(other?.Attachments, noneDetected)}
         </Stack>
         <Stack gap={6}>
-          <Text fw={600} size="sm">{t('getPdfInfo.other.embeddedFiles', 'Embedded Files')}</Text>
+          <Text fw={600} size="sm">
+            {t("getPdfInfo.other.embeddedFiles", "Embedded Files")}
+          </Text>
           {renderEmbeddedFilesList(other?.EmbeddedFiles, noneDetected)}
         </Stack>
         <Stack gap={6}>
-          <Text fw={600} size="sm">{t('getPdfInfo.other.javaScript', 'JavaScript')}</Text>
+          <Text fw={600} size="sm">
+            {t("getPdfInfo.other.javaScript", "JavaScript")}
+          </Text>
           {renderList(other?.JavaScript, noneDetected)}
         </Stack>
         <Stack gap={6}>
-          <Text fw={600} size="sm">{t('getPdfInfo.other.layers', 'Layers')}</Text>
+          <Text fw={600} size="sm">
+            {t("getPdfInfo.other.layers", "Layers")}
+          </Text>
           {renderList(other?.Layers, noneDetected)}
         </Stack>
         <Accordion
@@ -95,18 +143,28 @@ const OtherSection: React.FC<OtherSectionProps> = ({ anchorId, other }) => {
         >
           <Accordion.Item value="structureTree">
             <Accordion.Control>
-              <Text fw={600} size="sm">{t('getPdfInfo.other.structureTree', 'StructureTree')}</Text>
+              <Text fw={600} size="sm">
+                {t("getPdfInfo.other.structureTree", "StructureTree")}
+              </Text>
             </Accordion.Control>
             <Accordion.Panel>
-              <ScrollableCodeBlock content={structureTreeContent} maxHeight="20rem" />
+              <ScrollableCodeBlock
+                content={structureTreeContent}
+                maxHeight="20rem"
+              />
             </Accordion.Panel>
           </Accordion.Item>
           <Accordion.Item value="xmp">
             <Accordion.Control>
-              <Text fw={600} size="sm">{t('getPdfInfo.other.xmp', 'XMPMetadata')}</Text>
+              <Text fw={600} size="sm">
+                {t("getPdfInfo.other.xmp", "XMPMetadata")}
+              </Text>
             </Accordion.Control>
             <Accordion.Panel>
-              <ScrollableCodeBlock content={other?.XMPMetadata} maxHeight="400px" />
+              <ScrollableCodeBlock
+                content={other?.XMPMetadata}
+                maxHeight="400px"
+              />
             </Accordion.Panel>
           </Accordion.Item>
         </Accordion>
@@ -116,5 +174,3 @@ const OtherSection: React.FC<OtherSectionProps> = ({ anchorId, other }) => {
 };
 
 export default OtherSection;
-
-
diff --git a/frontend/src/core/components/tools/getPdfInfo/sections/PerPageSection.tsx b/frontend/src/core/components/tools/getPdfInfo/sections/PerPageSection.tsx
index 36bd7bf1c1..0c11cf592a 100644
--- a/frontend/src/core/components/tools/getPdfInfo/sections/PerPageSection.tsx
+++ b/frontend/src/core/components/tools/getPdfInfo/sections/PerPageSection.tsx
@@ -1,26 +1,42 @@
-import React from 'react';
-import { Accordion, Stack, Text } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import type { PdfPerPageInfo, PdfPageInfo, PdfFontInfo, PdfImageInfo } from '@app/types/getPdfInfo';
-import SectionBlock from '@app/components/tools/getPdfInfo/shared/SectionBlock';
-import KeyValueList from '@app/components/tools/getPdfInfo/shared/KeyValueList';
-import { pdfInfoAccordionStyles } from '@app/components/tools/getPdfInfo/shared/accordionStyles';
+import React from "react";
+import { Accordion, Stack, Text } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import type {
+  PdfPerPageInfo,
+  PdfPageInfo,
+  PdfFontInfo,
+  PdfImageInfo,
+} from "@app/types/getPdfInfo";
+import SectionBlock from "@app/components/tools/getPdfInfo/shared/SectionBlock";
+import KeyValueList from "@app/components/tools/getPdfInfo/shared/KeyValueList";
+import { pdfInfoAccordionStyles } from "@app/components/tools/getPdfInfo/shared/accordionStyles";
 
 interface PerPageSectionProps {
   anchorId: string;
   perPage?: PdfPerPageInfo | null;
 }
 
-const renderImagesList = (images: PdfImageInfo[] | undefined, emptyText: string) => {
-  if (!images || images.length === 0) return <Text size="sm" c="dimmed">{emptyText}</Text>;
+const renderImagesList = (
+  images: PdfImageInfo[] | undefined,
+  emptyText: string,
+) => {
+  if (!images || images.length === 0)
+    return (
+      <Text size="sm" c="dimmed">
+        {emptyText}
+      </Text>
+    );
   return (
     <Stack gap={4}>
       {images.map((image, idx) => (
-        <div key={idx} style={{ wordBreak: 'break-word', overflowWrap: 'break-word' }}>
+        <div
+          key={idx}
+          style={{ wordBreak: "break-word", overflowWrap: "break-word" }}
+        >
           <Text size="sm" c="dimmed">
-            {image.Name ? `${image.Name} ` : 'Image '}
-            ({image.Width}×{image.Height}px
-            {image.ColorSpace ? `, ${image.ColorSpace}` : ''})
+            {image.Name ? `${image.Name} ` : "Image "}({image.Width}×
+            {image.Height}px
+            {image.ColorSpace ? `, ${image.ColorSpace}` : ""})
           </Text>
         </div>
       ))}
@@ -29,39 +45,68 @@ const renderImagesList = (images: PdfImageInfo[] | undefined, emptyText: string)
 };
 
 const renderList = (arr: unknown[] | undefined, emptyText: string) => {
-  if (!arr || arr.length === 0) return <Text size="sm" c="dimmed">{emptyText}</Text>;
+  if (!arr || arr.length === 0)
+    return (
+      <Text size="sm" c="dimmed">
+        {emptyText}
+      </Text>
+    );
   return (
     <Stack gap={4}>
       {arr.map((item, idx) => (
-        <Text key={idx} size="sm" c="dimmed" style={{ wordBreak: 'break-word', overflowWrap: 'break-word' }}>
-          {typeof item === 'string' ? item : JSON.stringify(item)}
+        <Text
+          key={idx}
+          size="sm"
+          c="dimmed"
+          style={{ wordBreak: "break-word", overflowWrap: "break-word" }}
+        >
+          {typeof item === "string" ? item : JSON.stringify(item)}
         </Text>
       ))}
     </Stack>
   );
 };
 
-const renderFontsList = (fonts: PdfFontInfo[] | undefined, emptyText: string) => {
-  if (!fonts || fonts.length === 0) return <Text size="sm" c="dimmed">{emptyText}</Text>;
+const renderFontsList = (
+  fonts: PdfFontInfo[] | undefined,
+  emptyText: string,
+) => {
+  if (!fonts || fonts.length === 0)
+    return (
+      <Text size="sm" c="dimmed">
+        {emptyText}
+      </Text>
+    );
   return (
     <Stack gap={4}>
       {fonts.map((font, idx) => (
-        <Text key={idx} size="sm" c="dimmed" style={{ wordBreak: 'break-word', overflowWrap: 'break-word' }}>
-          {`${font.Name ?? 'Unknown'}${font.IsEmbedded ? ' (embedded)' : ''}`}
+        <Text
+          key={idx}
+          size="sm"
+          c="dimmed"
+          style={{ wordBreak: "break-word", overflowWrap: "break-word" }}
+        >
+          {`${font.Name ?? "Unknown"}${font.IsEmbedded ? " (embedded)" : ""}`}
         </Text>
       ))}
     </Stack>
   );
 };
 
-const PerPageSection: React.FC<PerPageSectionProps> = ({ anchorId, perPage }) => {
+const PerPageSection: React.FC<PerPageSectionProps> = ({
+  anchorId,
+  perPage,
+}) => {
   const { t } = useTranslation();
-  const noneDetected = t('getPdfInfo.noneDetected', 'None detected');
+  const noneDetected = t("getPdfInfo.noneDetected", "None detected");
 
   const hasPages = perPage && Object.keys(perPage).length > 0;
 
   return (
-    <SectionBlock title={t('getPdfInfo.sections.perPageInfo', 'Per Page Info')} anchorId={anchorId}>
+    <SectionBlock
+      title={t("getPdfInfo.sections.perPageInfo", "Per Page Info")}
+      anchorId={anchorId}
+    >
       {hasPages ? (
         <Accordion
           variant="separated"
@@ -69,71 +114,99 @@ const PerPageSection: React.FC<PerPageSectionProps> = ({ anchorId, perPage }) =>
           defaultValue=""
           styles={pdfInfoAccordionStyles}
         >
-          {Object.entries(perPage).map(([pageLabel, pageInfo]: [string, PdfPageInfo]) => (
-            <Accordion.Item key={pageLabel} value={pageLabel}>
-              <Accordion.Control>
-                <Text fw={600} size="sm">{pageLabel}</Text>
-              </Accordion.Control>
-              <Accordion.Panel>
-                <div style={{ backgroundColor: 'var(--bg-raised)', color: 'var(--text-primary)', borderRadius: 8, padding: 12 }}>
-                  <Stack gap="sm">
-                    {pageInfo?.Size && (
+          {Object.entries(perPage).map(
+            ([pageLabel, pageInfo]: [string, PdfPageInfo]) => (
+              <Accordion.Item key={pageLabel} value={pageLabel}>
+                <Accordion.Control>
+                  <Text fw={600} size="sm">
+                    {pageLabel}
+                  </Text>
+                </Accordion.Control>
+                <Accordion.Panel>
+                  <div
+                    style={{
+                      backgroundColor: "var(--bg-raised)",
+                      color: "var(--text-primary)",
+                      borderRadius: 8,
+                      padding: 12,
+                    }}
+                  >
+                    <Stack gap="sm">
+                      {pageInfo?.Size && (
+                        <Stack gap={4}>
+                          <Text fw={600} size="sm">
+                            {t("getPdfInfo.perPage.size", "Size")}
+                          </Text>
+                          <KeyValueList obj={pageInfo.Size} />
+                        </Stack>
+                      )}
+                      <KeyValueList
+                        obj={{
+                          Rotation: pageInfo?.Rotation,
+                          "Page Orientation": pageInfo?.["Page Orientation"],
+                          MediaBox: pageInfo?.MediaBox,
+                          CropBox: pageInfo?.CropBox,
+                          BleedBox: pageInfo?.BleedBox,
+                          TrimBox: pageInfo?.TrimBox,
+                          ArtBox: pageInfo?.ArtBox,
+                          "Text Characters Count":
+                            pageInfo?.["Text Characters Count"],
+                        }}
+                      />
+                      {pageInfo?.Annotations && (
+                        <Stack gap={4}>
+                          <Text fw={600} size="sm">
+                            {t("getPdfInfo.perPage.annotations", "Annotations")}
+                          </Text>
+                          <KeyValueList obj={pageInfo.Annotations} />
+                        </Stack>
+                      )}
                       <Stack gap={4}>
-                        <Text fw={600} size="sm">{t('getPdfInfo.perPage.size', 'Size')}</Text>
-                        <KeyValueList obj={pageInfo.Size} />
+                        <Text fw={600} size="sm">
+                          {t("getPdfInfo.perPage.images", "Images")}
+                        </Text>
+                        {renderImagesList(pageInfo?.Images, noneDetected)}
                       </Stack>
-                    )}
-                    <KeyValueList obj={{
-                      'Rotation': pageInfo?.Rotation,
-                      'Page Orientation': pageInfo?.['Page Orientation'],
-                      'MediaBox': pageInfo?.MediaBox,
-                      'CropBox': pageInfo?.CropBox,
-                      'BleedBox': pageInfo?.BleedBox,
-                      'TrimBox': pageInfo?.TrimBox,
-                      'ArtBox': pageInfo?.ArtBox,
-                      'Text Characters Count': pageInfo?.['Text Characters Count'],
-                    }} />
-                    {pageInfo?.Annotations && (
                       <Stack gap={4}>
-                        <Text fw={600} size="sm">{t('getPdfInfo.perPage.annotations', 'Annotations')}</Text>
-                        <KeyValueList obj={pageInfo.Annotations} />
+                        <Text fw={600} size="sm">
+                          {t("getPdfInfo.perPage.links", "Links")}
+                        </Text>
+                        {renderList(pageInfo?.Links, noneDetected)}
                       </Stack>
-                    )}
-                    <Stack gap={4}>
-                      <Text fw={600} size="sm">{t('getPdfInfo.perPage.images', 'Images')}</Text>
-                      {renderImagesList(pageInfo?.Images, noneDetected)}
-                    </Stack>
-                    <Stack gap={4}>
-                      <Text fw={600} size="sm">{t('getPdfInfo.perPage.links', 'Links')}</Text>
-                      {renderList(pageInfo?.Links, noneDetected)}
-                    </Stack>
-                    <Stack gap={4}>
-                      <Text fw={600} size="sm">{t('getPdfInfo.perPage.fonts', 'Fonts')}</Text>
-                      {renderFontsList(pageInfo?.Fonts, noneDetected)}
-                    </Stack>
-                    {pageInfo?.XObjectCounts && (
                       <Stack gap={4}>
-                        <Text fw={600} size="sm">{t('getPdfInfo.perPage.xobjects', 'XObject Counts')}</Text>
-                        <KeyValueList obj={pageInfo.XObjectCounts} />
+                        <Text fw={600} size="sm">
+                          {t("getPdfInfo.perPage.fonts", "Fonts")}
+                        </Text>
+                        {renderFontsList(pageInfo?.Fonts, noneDetected)}
+                      </Stack>
+                      {pageInfo?.XObjectCounts && (
+                        <Stack gap={4}>
+                          <Text fw={600} size="sm">
+                            {t("getPdfInfo.perPage.xobjects", "XObject Counts")}
+                          </Text>
+                          <KeyValueList obj={pageInfo.XObjectCounts} />
+                        </Stack>
+                      )}
+                      <Stack gap={4}>
+                        <Text fw={600} size="sm">
+                          {t("getPdfInfo.perPage.multimedia", "Multimedia")}
+                        </Text>
+                        {renderList(pageInfo?.Multimedia, noneDetected)}
                       </Stack>
-                    )}
-                    <Stack gap={4}>
-                      <Text fw={600} size="sm">{t('getPdfInfo.perPage.multimedia', 'Multimedia')}</Text>
-                      {renderList(pageInfo?.Multimedia, noneDetected)}
                     </Stack>
-                  </Stack>
-                </div>
-              </Accordion.Panel>
-            </Accordion.Item>
-          ))}
+                  </div>
+                </Accordion.Panel>
+              </Accordion.Item>
+            ),
+          )}
         </Accordion>
       ) : (
-        <Text size="sm" c="dimmed">{noneDetected}</Text>
+        <Text size="sm" c="dimmed">
+          {noneDetected}
+        </Text>
       )}
     </SectionBlock>
   );
 };
 
 export default PerPageSection;
-
-
diff --git a/frontend/src/core/components/tools/getPdfInfo/sections/SummarySection.tsx b/frontend/src/core/components/tools/getPdfInfo/sections/SummarySection.tsx
index f5e5149b68..6296b71b2b 100644
--- a/frontend/src/core/components/tools/getPdfInfo/sections/SummarySection.tsx
+++ b/frontend/src/core/components/tools/getPdfInfo/sections/SummarySection.tsx
@@ -1,9 +1,13 @@
-import React, { useMemo } from 'react';
-import { Stack, Text } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import type { ParsedPdfSections, PdfFontInfo, PdfComplianceSummary } from '@app/types/getPdfInfo';
-import SectionBlock from '@app/components/tools/getPdfInfo/shared/SectionBlock';
-import KeyValueList from '@app/components/tools/getPdfInfo/shared/KeyValueList';
+import React, { useMemo } from "react";
+import { Stack, Text } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import type {
+  ParsedPdfSections,
+  PdfFontInfo,
+  PdfComplianceSummary,
+} from "@app/types/getPdfInfo";
+import SectionBlock from "@app/components/tools/getPdfInfo/shared/SectionBlock";
+import KeyValueList from "@app/components/tools/getPdfInfo/shared/KeyValueList";
 
 interface SummarySectionProps {
   sections: ParsedPdfSections;
@@ -15,15 +19,19 @@ interface SummarySectionProps {
  * Uses the authoritative complianceSummary data when available.
  */
 const getComplianceSummaryInfo = (
-  complianceSummary?: PdfComplianceSummary[] | null
-): { hasCompliance: boolean; passedStandards: string[]; failedCount: number } => {
+  complianceSummary?: PdfComplianceSummary[] | null,
+): {
+  hasCompliance: boolean;
+  passedStandards: string[];
+  failedCount: number;
+} => {
   if (!complianceSummary || complianceSummary.length === 0) {
     return { hasCompliance: false, passedStandards: [], failedCount: 0 };
   }
 
   // Filter out informational markers like "not-pdfa"
   const actualChecks = complianceSummary.filter(
-    item => item.Standard.toLowerCase() !== 'not-pdfa'
+    (item) => item.Standard.toLowerCase() !== "not-pdfa",
   );
 
   if (actualChecks.length === 0) {
@@ -31,22 +39,22 @@ const getComplianceSummaryInfo = (
   }
 
   const passedStandards = actualChecks
-    .filter(item => item.Compliant)
-    .map(item => {
+    .filter((item) => item.Compliant)
+    .map((item) => {
       // Format standard ID to display name (e.g., "pdfa-3b" -> "PDF/A-3B")
       const id = item.Standard.toLowerCase();
       const pdfaMatch = id.match(/^pdf[_-]?a[_-]?(\d+)([abuf])?$/i);
       if (pdfaMatch) {
-        return `PDF/A-${pdfaMatch[1]}${pdfaMatch[2]?.toUpperCase() || ''}`;
+        return `PDF/A-${pdfaMatch[1]}${pdfaMatch[2]?.toUpperCase() || ""}`;
       }
       const pdfuaMatch = id.match(/^pdf[_-]?ua[_-]?(\d+)?$/i);
       if (pdfuaMatch) {
-        return `PDF/UA-${pdfuaMatch[1] || '1'}`;
+        return `PDF/UA-${pdfuaMatch[1] || "1"}`;
       }
       return item.Standard.toUpperCase();
     });
 
-  const failedCount = actualChecks.filter(item => !item.Compliant).length;
+  const failedCount = actualChecks.filter((item) => !item.Compliant).length;
 
   return { hasCompliance: true, passedStandards, failedCount };
 };
@@ -56,7 +64,10 @@ interface SummarySectionProps {
   hideSectionTitle?: boolean;
 }
 
-const SummarySection: React.FC<SummarySectionProps> = ({ sections, hideSectionTitle = false }) => {
+const SummarySection: React.FC<SummarySectionProps> = ({
+  sections,
+  hideSectionTitle = false,
+}) => {
   const { t } = useTranslation();
 
   const summaryBlocks = useMemo(() => {
@@ -69,83 +80,116 @@ const SummarySection: React.FC<SummarySectionProps> = ({ sections, hideSectionTi
     const other = sections.other ?? {};
     const perPage = sections.perPage ?? {};
 
-    const pages = basic['Number of pages'];
+    const pages = basic["Number of pages"];
     const fileSizeBytes = basic.FileSizeInBytes;
-    const pdfVersion = docInfo['PDF version'];
+    const pdfVersion = docInfo["PDF version"];
     const language = basic.Language;
 
     const basicInformation: Record<string, unknown> = {
-      [t('getPdfInfo.summary.pages', 'Pages')]: pages,
-      [t('getPdfInfo.summary.fileSize', 'File Size')]: typeof fileSizeBytes === 'number' ? `${(fileSizeBytes / 1024).toFixed(2)} KB` : fileSizeBytes,
-      [t('getPdfInfo.summary.pdfVersion', 'PDF Version')]: pdfVersion,
-      [t('getPdfInfo.summary.language', 'Language')]: language,
+      [t("getPdfInfo.summary.pages", "Pages")]: pages,
+      [t("getPdfInfo.summary.fileSize", "File Size")]:
+        typeof fileSizeBytes === "number"
+          ? `${(fileSizeBytes / 1024).toFixed(2)} KB`
+          : fileSizeBytes,
+      [t("getPdfInfo.summary.pdfVersion", "PDF Version")]: pdfVersion,
+      [t("getPdfInfo.summary.language", "Language")]: language,
     };
 
     const documentInformation: Record<string, unknown> = {
-      [t('getPdfInfo.summary.title', 'Title')]: metadata.Title,
-      [t('getPdfInfo.summary.author', 'Author')]: metadata.Author,
-      [t('getPdfInfo.summary.created', 'Created')]: metadata.CreationDate,
-      [t('getPdfInfo.summary.modified', 'Modified')]: metadata.ModificationDate,
+      [t("getPdfInfo.summary.title", "Title")]: metadata.Title,
+      [t("getPdfInfo.summary.author", "Author")]: metadata.Author,
+      [t("getPdfInfo.summary.created", "Created")]: metadata.CreationDate,
+      [t("getPdfInfo.summary.modified", "Modified")]: metadata.ModificationDate,
     };
 
     const securityStatusText = encryption.IsEncrypted
-      ? t('getPdfInfo.summary.security.encrypted', 'Encrypted PDF - Password protection present')
-      : t('getPdfInfo.summary.security.unencrypted', 'Unencrypted PDF - No password protection');
+      ? t(
+          "getPdfInfo.summary.security.encrypted",
+          "Encrypted PDF - Password protection present",
+        )
+      : t(
+          "getPdfInfo.summary.security.unencrypted",
+          "Unencrypted PDF - No password protection",
+        );
 
     const restrictedCount = summary.restrictedPermissionsCount ?? 0;
-    const permissionsAllAllowed = Object.values(permissions).every((v) => v === 'Allowed');
+    const permissionsAllAllowed = Object.values(permissions).every(
+      (v) => v === "Allowed",
+    );
     const permSummary = permissionsAllAllowed
-      ? t('getPdfInfo.summary.permsAll', 'All Permissions Allowed')
+      ? t("getPdfInfo.summary.permsAll", "All Permissions Allowed")
       : restrictedCount > 0
-        ? t('getPdfInfo.summary.permsRestricted', '{{count}} restrictions', { count: restrictedCount })
-        : t('getPdfInfo.summary.permsMixed', 'Some permissions restricted');
+        ? t("getPdfInfo.summary.permsRestricted", "{{count}} restrictions", {
+            count: restrictedCount,
+          })
+        : t("getPdfInfo.summary.permsMixed", "Some permissions restricted");
 
     // Use authoritative VeraPDF results for compliance summary
     const complianceInfo = getComplianceSummaryInfo(summary.Compliance);
     const complianceText = complianceInfo.hasCompliance
       ? complianceInfo.passedStandards.length > 0
-        ? t('getPdfInfo.summary.compliancePassed', '{{standards}} compliant', { 
-            standards: complianceInfo.passedStandards.join(', ') 
+        ? t("getPdfInfo.summary.compliancePassed", "{{standards}} compliant", {
+            standards: complianceInfo.passedStandards.join(", "),
           })
-        : t('getPdfInfo.summary.complianceChecked', 'Standards verified ({{failed}} failed)', { 
-            failed: complianceInfo.failedCount 
-          })
-      : t('getPdfInfo.summary.noCompliance', 'No Compliance Standards');
+        : t(
+            "getPdfInfo.summary.complianceChecked",
+            "Standards verified ({{failed}} failed)",
+            {
+              failed: complianceInfo.failedCount,
+            },
+          )
+      : t("getPdfInfo.summary.noCompliance", "No Compliance Standards");
 
     // Helper to get first page data
-    const firstPage = perPage['Page 1'];
+    const firstPage = perPage["Page 1"];
     const firstPageFonts: PdfFontInfo[] = firstPage?.Fonts ?? [];
 
     const technical: Record<string, unknown> = {
-      [t('getPdfInfo.summary.tech.images', 'Images')]: (() => {
+      [t("getPdfInfo.summary.tech.images", "Images")]: (() => {
         const total = basic.TotalImages;
-        if (typeof total === 'number') return total === 0 ? 'None' : `${total}`;
-        return 'None';
+        if (typeof total === "number") return total === 0 ? "None" : `${total}`;
+        return "None";
       })(),
-      [t('getPdfInfo.summary.tech.fonts', 'Fonts')]: (() => {
-        if (firstPageFonts.length === 0) return 'None';
+      [t("getPdfInfo.summary.tech.fonts", "Fonts")]: (() => {
+        if (firstPageFonts.length === 0) return "None";
         const embedded = firstPageFonts.filter((f) => f.IsEmbedded).length;
         return `${firstPageFonts.length} (${embedded} embedded)`;
       })(),
-      [t('getPdfInfo.summary.tech.formFields', 'Form Fields')]: sections.formFields && Object.keys(sections.formFields).length > 0 ? Object.keys(sections.formFields).length : 'None',
-      [t('getPdfInfo.summary.tech.embeddedFiles', 'Embedded Files')]: other.EmbeddedFiles?.length ?? 'None',
-      [t('getPdfInfo.summary.tech.javaScript', 'JavaScript')]: other.JavaScript?.length ?? 'None',
-      [t('getPdfInfo.summary.tech.layers', 'Layers')]: other.Layers?.length ?? 'None',
-      [t('getPdfInfo.summary.tech.bookmarks', 'Bookmarks')]: sections.toc?.length ?? 'None',
-      [t('getPdfInfo.summary.tech.multimedia', 'Multimedia')]: firstPage?.Multimedia?.length ?? 'None',
+      [t("getPdfInfo.summary.tech.formFields", "Form Fields")]:
+        sections.formFields && Object.keys(sections.formFields).length > 0
+          ? Object.keys(sections.formFields).length
+          : "None",
+      [t("getPdfInfo.summary.tech.embeddedFiles", "Embedded Files")]:
+        other.EmbeddedFiles?.length ?? "None",
+      [t("getPdfInfo.summary.tech.javaScript", "JavaScript")]:
+        other.JavaScript?.length ?? "None",
+      [t("getPdfInfo.summary.tech.layers", "Layers")]:
+        other.Layers?.length ?? "None",
+      [t("getPdfInfo.summary.tech.bookmarks", "Bookmarks")]:
+        sections.toc?.length ?? "None",
+      [t("getPdfInfo.summary.tech.multimedia", "Multimedia")]:
+        firstPage?.Multimedia?.length ?? "None",
     };
 
     const overview = (() => {
-      const tTitle = metadata.Title ? `"${metadata.Title}"` : t('getPdfInfo.summary.overview.untitled', 'an untitled document');
-      const author = metadata.Author || t('getPdfInfo.summary.overview.unknown', 'Unknown Author');
-      const pagesCount = typeof pages === 'number' ? pages : '?';
-      const version = pdfVersion ?? '?';
-      return t('getPdfInfo.summary.overview.text', 'This is a {{pages}}-page PDF titled {{title}} created by {{author}} (PDF version {{version}}).', {
-        pages: pagesCount,
-        title: tTitle,
-        author,
-        version,
-      });
+      const tTitle = metadata.Title
+        ? `"${metadata.Title}"`
+        : t("getPdfInfo.summary.overview.untitled", "an untitled document");
+      const author =
+        metadata.Author ||
+        t("getPdfInfo.summary.overview.unknown", "Unknown Author");
+      const pagesCount = typeof pages === "number" ? pages : "?";
+      const version = pdfVersion ?? "?";
+      return t(
+        "getPdfInfo.summary.overview.text",
+        "This is a {{pages}}-page PDF titled {{title}} created by {{author}} (PDF version {{version}}).",
+        {
+          pages: pagesCount,
+          title: tTitle,
+          author,
+          version,
+        },
+      );
     })();
 
     return {
@@ -162,26 +206,44 @@ const SummarySection: React.FC<SummarySectionProps> = ({ sections, hideSectionTi
   const content = (
     <Stack gap="md">
       <Stack gap={6}>
-        <Text fw={600} size="sm">{t('getPdfInfo.summary.basic', 'Basic Information')}</Text>
+        <Text fw={600} size="sm">
+          {t("getPdfInfo.summary.basic", "Basic Information")}
+        </Text>
         <KeyValueList obj={summaryBlocks.basicInformation} />
       </Stack>
       <Stack gap={6}>
-        <Text fw={600} size="sm">{t('getPdfInfo.summary.documentInfo', 'Document Information')}</Text>
+        <Text fw={600} size="sm">
+          {t("getPdfInfo.summary.documentInfo", "Document Information")}
+        </Text>
         <KeyValueList obj={summaryBlocks.documentInformation} />
       </Stack>
       <Stack gap={6}>
-        <Text fw={600} size="sm">{t('getPdfInfo.summary.securityTitle', 'Security Status')}</Text>
-        <Text size="sm" c="dimmed">{summaryBlocks.securityStatusText}</Text>
-        <Text size="sm" c="dimmed">{summaryBlocks.permSummary}</Text>
-        <Text size="sm" c="dimmed">{summaryBlocks.complianceText}</Text>
+        <Text fw={600} size="sm">
+          {t("getPdfInfo.summary.securityTitle", "Security Status")}
+        </Text>
+        <Text size="sm" c="dimmed">
+          {summaryBlocks.securityStatusText}
+        </Text>
+        <Text size="sm" c="dimmed">
+          {summaryBlocks.permSummary}
+        </Text>
+        <Text size="sm" c="dimmed">
+          {summaryBlocks.complianceText}
+        </Text>
       </Stack>
       <Stack gap={6}>
-        <Text fw={600} size="sm">{t('getPdfInfo.summary.technical', 'Technical')}</Text>
+        <Text fw={600} size="sm">
+          {t("getPdfInfo.summary.technical", "Technical")}
+        </Text>
         <KeyValueList obj={summaryBlocks.technical} />
       </Stack>
       <Stack gap={6}>
-        <Text fw={600} size="sm">{t('getPdfInfo.summary.overviewTitle', 'PDF Overview')}</Text>
-        <Text size="sm" c="dimmed">{summaryBlocks.overview}</Text>
+        <Text fw={600} size="sm">
+          {t("getPdfInfo.summary.overviewTitle", "PDF Overview")}
+        </Text>
+        <Text size="sm" c="dimmed">
+          {summaryBlocks.overview}
+        </Text>
       </Stack>
     </Stack>
   );
@@ -191,12 +253,13 @@ const SummarySection: React.FC<SummarySectionProps> = ({ sections, hideSectionTi
   }
 
   return (
-    <SectionBlock title={t('getPdfInfo.summary.title', 'PDF Summary')} anchorId="summary">
+    <SectionBlock
+      title={t("getPdfInfo.summary.title", "PDF Summary")}
+      anchorId="summary"
+    >
       {content}
     </SectionBlock>
   );
 };
 
 export default SummarySection;
-
-
diff --git a/frontend/src/core/components/tools/getPdfInfo/sections/TableOfContentsSection.tsx b/frontend/src/core/components/tools/getPdfInfo/sections/TableOfContentsSection.tsx
index 57e4ac2fed..40cfbadb0a 100644
--- a/frontend/src/core/components/tools/getPdfInfo/sections/TableOfContentsSection.tsx
+++ b/frontend/src/core/components/tools/getPdfInfo/sections/TableOfContentsSection.tsx
@@ -1,27 +1,35 @@
-import React from 'react';
-import { Stack, Text } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import type { PdfTocEntry } from '@app/types/getPdfInfo';
-import SectionBlock from '@app/components/tools/getPdfInfo/shared/SectionBlock';
+import React from "react";
+import { Stack, Text } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import type { PdfTocEntry } from "@app/types/getPdfInfo";
+import SectionBlock from "@app/components/tools/getPdfInfo/shared/SectionBlock";
 
 interface TableOfContentsSectionProps {
   anchorId: string;
   tocArray: PdfTocEntry[];
 }
 
-const TableOfContentsSection: React.FC<TableOfContentsSectionProps> = ({ anchorId, tocArray }) => {
+const TableOfContentsSection: React.FC<TableOfContentsSectionProps> = ({
+  anchorId,
+  tocArray,
+}) => {
   const { t } = useTranslation();
-  const noneDetected = t('getPdfInfo.noneDetected', 'None detected');
+  const noneDetected = t("getPdfInfo.noneDetected", "None detected");
 
   return (
-    <SectionBlock title={t('getPdfInfo.sections.tableOfContents', 'Table of Contents')} anchorId={anchorId}>
+    <SectionBlock
+      title={t("getPdfInfo.sections.tableOfContents", "Table of Contents")}
+      anchorId={anchorId}
+    >
       {!tocArray || tocArray.length === 0 ? (
-        <Text size="sm" c="dimmed">{noneDetected}</Text>
+        <Text size="sm" c="dimmed">
+          {noneDetected}
+        </Text>
       ) : (
         <Stack gap={4}>
           {tocArray.map((item, idx) => (
             <Text key={idx} size="sm" c="dimmed">
-              {typeof item === 'string' ? item : JSON.stringify(item)}
+              {typeof item === "string" ? item : JSON.stringify(item)}
             </Text>
           ))}
         </Stack>
@@ -31,5 +39,3 @@ const TableOfContentsSection: React.FC<TableOfContentsSectionProps> = ({ anchorI
 };
 
 export default TableOfContentsSection;
-
-
diff --git a/frontend/src/core/components/tools/getPdfInfo/shared/KeyValueList.tsx b/frontend/src/core/components/tools/getPdfInfo/shared/KeyValueList.tsx
index e0cd809cc4..be35732340 100644
--- a/frontend/src/core/components/tools/getPdfInfo/shared/KeyValueList.tsx
+++ b/frontend/src/core/components/tools/getPdfInfo/shared/KeyValueList.tsx
@@ -1,5 +1,5 @@
-import React from 'react';
-import { Group, Stack, Text } from '@mantine/core';
+import React from "react";
+import { Group, Stack, Text } from "@mantine/core";
 
 interface KeyValueListProps {
   obj?: Record<string, unknown> | null;
@@ -8,15 +8,37 @@ interface KeyValueListProps {
 
 const KeyValueList: React.FC<KeyValueListProps> = ({ obj, emptyLabel }) => {
   if (!obj || Object.keys(obj).length === 0) {
-    return <Text size="sm" c="dimmed">{emptyLabel ?? 'None detected'}</Text>;
+    return (
+      <Text size="sm" c="dimmed">
+        {emptyLabel ?? "None detected"}
+      </Text>
+    );
   }
   return (
     <Stack gap={6}>
       {Object.entries(obj).map(([k, v]) => (
-        <Group key={k} wrap="nowrap" align="flex-start" style={{ width: '100%' }}>
-          <Text size="sm" style={{ minWidth: 180, maxWidth: 180, flexShrink: 0 }}>{k}</Text>
-          <Text size="sm" c="dimmed" style={{ wordBreak: 'break-word', overflowWrap: 'break-word', flex: 1 }}>
-            {v == null ? '' : String(v)}
+        <Group
+          key={k}
+          wrap="nowrap"
+          align="flex-start"
+          style={{ width: "100%" }}
+        >
+          <Text
+            size="sm"
+            style={{ minWidth: 180, maxWidth: 180, flexShrink: 0 }}
+          >
+            {k}
+          </Text>
+          <Text
+            size="sm"
+            c="dimmed"
+            style={{
+              wordBreak: "break-word",
+              overflowWrap: "break-word",
+              flex: 1,
+            }}
+          >
+            {v == null ? "" : String(v)}
           </Text>
         </Group>
       ))}
@@ -25,5 +47,3 @@ const KeyValueList: React.FC<KeyValueListProps> = ({ obj, emptyLabel }) => {
 };
 
 export default KeyValueList;
-
-
diff --git a/frontend/src/core/components/tools/getPdfInfo/shared/ScrollableCodeBlock.tsx b/frontend/src/core/components/tools/getPdfInfo/shared/ScrollableCodeBlock.tsx
index bf04264268..4d66e247b8 100644
--- a/frontend/src/core/components/tools/getPdfInfo/shared/ScrollableCodeBlock.tsx
+++ b/frontend/src/core/components/tools/getPdfInfo/shared/ScrollableCodeBlock.tsx
@@ -1,6 +1,6 @@
-import React from 'react';
-import { Code, Text } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
+import React from "react";
+import { Code, Text } from "@mantine/core";
+import { useTranslation } from "react-i18next";
 
 interface ScrollableCodeBlockProps {
   content: string | null | undefined;
@@ -14,7 +14,7 @@ interface ScrollableCodeBlockProps {
  */
 const ScrollableCodeBlock: React.FC<ScrollableCodeBlockProps> = ({
   content,
-  maxHeight = '400px',
+  maxHeight = "400px",
   emptyMessage,
 }) => {
   const { t } = useTranslation();
@@ -22,7 +22,7 @@ const ScrollableCodeBlock: React.FC<ScrollableCodeBlockProps> = ({
   if (!content) {
     return (
       <Text size="sm" c="dimmed">
-        {emptyMessage ?? t('getPdfInfo.noneDetected', 'None detected')}
+        {emptyMessage ?? t("getPdfInfo.noneDetected", "None detected")}
       </Text>
     );
   }
@@ -31,11 +31,11 @@ const ScrollableCodeBlock: React.FC<ScrollableCodeBlockProps> = ({
     <Code
       block
       style={{
-        whiteSpace: 'pre-wrap',
-        backgroundColor: 'var(--bg-raised)',
-        color: 'var(--text-primary)',
+        whiteSpace: "pre-wrap",
+        backgroundColor: "var(--bg-raised)",
+        color: "var(--text-primary)",
         maxHeight,
-        overflowY: 'auto',
+        overflowY: "auto",
       }}
     >
       {content}
@@ -44,4 +44,3 @@ const ScrollableCodeBlock: React.FC<ScrollableCodeBlockProps> = ({
 };
 
 export default ScrollableCodeBlock;
-
diff --git a/frontend/src/core/components/tools/getPdfInfo/shared/SectionBlock.tsx b/frontend/src/core/components/tools/getPdfInfo/shared/SectionBlock.tsx
index 0faa993f60..97f2ae3667 100644
--- a/frontend/src/core/components/tools/getPdfInfo/shared/SectionBlock.tsx
+++ b/frontend/src/core/components/tools/getPdfInfo/shared/SectionBlock.tsx
@@ -1,5 +1,5 @@
-import React from 'react';
-import { Stack, Text, Divider } from '@mantine/core';
+import React from "react";
+import { Stack, Text, Divider } from "@mantine/core";
 
 interface SectionBlockProps {
   title: string;
@@ -7,10 +7,16 @@ interface SectionBlockProps {
   children: React.ReactNode;
 }
 
-const SectionBlock: React.FC<SectionBlockProps> = ({ title, anchorId, children }) => {
+const SectionBlock: React.FC<SectionBlockProps> = ({
+  title,
+  anchorId,
+  children,
+}) => {
   return (
     <Stack gap="sm" id={anchorId}>
-      <Text fw={700} size="lg">{title}</Text>
+      <Text fw={700} size="lg">
+        {title}
+      </Text>
       <Divider />
       {children}
     </Stack>
@@ -18,5 +24,3 @@ const SectionBlock: React.FC<SectionBlockProps> = ({ title, anchorId, children }
 };
 
 export default SectionBlock;
-
-
diff --git a/frontend/src/core/components/tools/getPdfInfo/shared/accordionStyles.ts b/frontend/src/core/components/tools/getPdfInfo/shared/accordionStyles.ts
index e974c98450..73e45eee63 100644
--- a/frontend/src/core/components/tools/getPdfInfo/shared/accordionStyles.ts
+++ b/frontend/src/core/components/tools/getPdfInfo/shared/accordionStyles.ts
@@ -1,14 +1,13 @@
-import type { AccordionStylesNames } from '@mantine/core';
-import type { CSSProperties } from 'react';
+import type { AccordionStylesNames } from "@mantine/core";
+import type { CSSProperties } from "react";
 
 type AccordionStyles = Partial<Record<AccordionStylesNames, CSSProperties>>;
 
 export const pdfInfoAccordionStyles: AccordionStyles = {
   item: {
-    backgroundColor: 'var(--accordion-item-bg)',
+    backgroundColor: "var(--accordion-item-bg)",
   },
   control: {
-    backgroundColor: 'transparent',
+    backgroundColor: "transparent",
   },
 };
-
diff --git a/frontend/src/core/components/tools/merge/MergeFileSorter.test.tsx b/frontend/src/core/components/tools/merge/MergeFileSorter.test.tsx
index b60c7565b1..e95584c203 100644
--- a/frontend/src/core/components/tools/merge/MergeFileSorter.test.tsx
+++ b/frontend/src/core/components/tools/merge/MergeFileSorter.test.tsx
@@ -1,12 +1,12 @@
-import { describe, expect, test, vi, beforeEach } from 'vitest';
-import { render, screen, fireEvent } from '@testing-library/react';
-import { MantineProvider } from '@mantine/core';
-import MergeFileSorter from '@app/components/tools/merge/MergeFileSorter';
+import { describe, expect, test, vi, beforeEach } from "vitest";
+import { render, screen, fireEvent } from "@testing-library/react";
+import { MantineProvider } from "@mantine/core";
+import MergeFileSorter from "@app/components/tools/merge/MergeFileSorter";
 
 // Mock useTranslation with predictable return values
 const mockT = vi.fn((key: string) => `mock-${key}`);
-vi.mock('react-i18next', () => ({
-  useTranslation: () => ({ t: mockT })
+vi.mock("react-i18next", () => ({
+  useTranslation: () => ({ t: mockT }),
 }));
 
 // Wrapper component to provide Mantine context
@@ -14,129 +14,145 @@ const TestWrapper = ({ children }: { children: React.ReactNode }) => (
   <MantineProvider>{children}</MantineProvider>
 );
 
-describe('MergeFileSorter', () => {
+describe("MergeFileSorter", () => {
   const mockOnSortFiles = vi.fn();
 
   beforeEach(() => {
     vi.clearAllMocks();
   });
 
-  test('should render sort options dropdown, direction toggle, and sort button', () => {
+  test("should render sort options dropdown, direction toggle, and sort button", () => {
     render(
       <TestWrapper>
         <MergeFileSorter onSortFiles={mockOnSortFiles} />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
     // Should have a select dropdown (Mantine Select uses textbox role)
-    expect(screen.getByRole('textbox')).toBeInTheDocument();
+    expect(screen.getByRole("textbox")).toBeInTheDocument();
 
     // Should have direction toggle button
-    const buttons = screen.getAllByRole('button');
+    const buttons = screen.getAllByRole("button");
     expect(buttons).toHaveLength(2); // ActionIcon + Sort Button
 
     // Should have sort button with text
-    expect(screen.getByText('mock-merge.sortBy.sort')).toBeInTheDocument();
+    expect(screen.getByText("mock-merge.sortBy.sort")).toBeInTheDocument();
   });
 
-  test('should render description text', () => {
+  test("should render description text", () => {
     render(
       <TestWrapper>
         <MergeFileSorter onSortFiles={mockOnSortFiles} />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
-    expect(screen.getByText('mock-merge.sortBy.description')).toBeInTheDocument();
+    expect(
+      screen.getByText("mock-merge.sortBy.description"),
+    ).toBeInTheDocument();
   });
 
-  test('should have filename selected by default', () => {
+  test("should have filename selected by default", () => {
     render(
       <TestWrapper>
         <MergeFileSorter onSortFiles={mockOnSortFiles} />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
-    const select = screen.getByRole('textbox');
-    expect(select).toHaveValue('mock-merge.sortBy.filename');
+    const select = screen.getByRole("textbox");
+    expect(select).toHaveValue("mock-merge.sortBy.filename");
   });
 
-  test('should show ascending direction by default', () => {
+  test("should show ascending direction by default", () => {
     render(
       <TestWrapper>
         <MergeFileSorter onSortFiles={mockOnSortFiles} />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
     // Should show ascending arrow icon
-    const directionButton = screen.getAllByRole('button')[0];
-    expect(directionButton).toHaveAttribute('title', 'mock-merge.sortBy.ascending');
+    const directionButton = screen.getAllByRole("button")[0];
+    expect(directionButton).toHaveAttribute(
+      "title",
+      "mock-merge.sortBy.ascending",
+    );
   });
 
-  test('should toggle direction when direction button is clicked', () => {
+  test("should toggle direction when direction button is clicked", () => {
     render(
       <TestWrapper>
         <MergeFileSorter onSortFiles={mockOnSortFiles} />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
-    const directionButton = screen.getAllByRole('button')[0];
+    const directionButton = screen.getAllByRole("button")[0];
 
     // Initially ascending
-    expect(directionButton).toHaveAttribute('title', 'mock-merge.sortBy.ascending');
+    expect(directionButton).toHaveAttribute(
+      "title",
+      "mock-merge.sortBy.ascending",
+    );
 
     // Click to toggle to descending
     fireEvent.click(directionButton);
-    expect(directionButton).toHaveAttribute('title', 'mock-merge.sortBy.descending');
+    expect(directionButton).toHaveAttribute(
+      "title",
+      "mock-merge.sortBy.descending",
+    );
 
     // Click again to toggle back to ascending
     fireEvent.click(directionButton);
-    expect(directionButton).toHaveAttribute('title', 'mock-merge.sortBy.ascending');
+    expect(directionButton).toHaveAttribute(
+      "title",
+      "mock-merge.sortBy.ascending",
+    );
   });
 
-  test('should call onSortFiles with correct parameters when sort button is clicked', () => {
+  test("should call onSortFiles with correct parameters when sort button is clicked", () => {
     render(
       <TestWrapper>
         <MergeFileSorter onSortFiles={mockOnSortFiles} />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
-    const sortButton = screen.getByText('mock-merge.sortBy.sort');
+    const sortButton = screen.getByText("mock-merge.sortBy.sort");
     fireEvent.click(sortButton);
 
     // Should be called with default values (filename, ascending)
-    expect(mockOnSortFiles).toHaveBeenCalledWith('filename', true);
+    expect(mockOnSortFiles).toHaveBeenCalledWith("filename", true);
   });
 
-  test('should call onSortFiles with dateModified when dropdown is changed', () => {
+  test("should call onSortFiles with dateModified when dropdown is changed", () => {
     render(
       <TestWrapper>
         <MergeFileSorter onSortFiles={mockOnSortFiles} />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
     // Open the dropdown by clicking on the current selected value
-    const currentSelection = screen.getByText('mock-merge.sortBy.filename');
+    const currentSelection = screen.getByText("mock-merge.sortBy.filename");
     fireEvent.mouseDown(currentSelection);
-    
+
     // Click on the dateModified option
-    const dateModifiedOption = screen.getByText('mock-merge.sortBy.dateModified');
+    const dateModifiedOption = screen.getByText(
+      "mock-merge.sortBy.dateModified",
+    );
     fireEvent.click(dateModifiedOption);
 
-    const sortButton = screen.getByText('mock-merge.sortBy.sort');
+    const sortButton = screen.getByText("mock-merge.sortBy.sort");
     fireEvent.click(sortButton);
 
-    expect(mockOnSortFiles).toHaveBeenCalledWith('dateModified', true);
+    expect(mockOnSortFiles).toHaveBeenCalledWith("dateModified", true);
   });
 
-  test('should call onSortFiles with descending direction when toggled', () => {
+  test("should call onSortFiles with descending direction when toggled", () => {
     render(
       <TestWrapper>
         <MergeFileSorter onSortFiles={mockOnSortFiles} />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
-    const directionButton = screen.getAllByRole('button')[0];
-    const sortButton = screen.getByText('mock-merge.sortBy.sort');
+    const directionButton = screen.getAllByRole("button")[0];
+    const sortButton = screen.getByText("mock-merge.sortBy.sort");
 
     // Toggle to descending
     fireEvent.click(directionButton);
@@ -144,23 +160,25 @@ describe('MergeFileSorter', () => {
     // Click sort
     fireEvent.click(sortButton);
 
-    expect(mockOnSortFiles).toHaveBeenCalledWith('filename', false);
+    expect(mockOnSortFiles).toHaveBeenCalledWith("filename", false);
   });
 
-  test('should handle complex user interaction sequence', () => {
+  test("should handle complex user interaction sequence", () => {
     render(
       <TestWrapper>
         <MergeFileSorter onSortFiles={mockOnSortFiles} />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
-    const directionButton = screen.getAllByRole('button')[0];
-    const sortButton = screen.getByText('mock-merge.sortBy.sort');
+    const directionButton = screen.getAllByRole("button")[0];
+    const sortButton = screen.getByText("mock-merge.sortBy.sort");
 
     // 1. Change to dateModified
-    const currentSelection = screen.getByText('mock-merge.sortBy.filename');
+    const currentSelection = screen.getByText("mock-merge.sortBy.filename");
     fireEvent.mouseDown(currentSelection);
-    const dateModifiedOption = screen.getByText('mock-merge.sortBy.dateModified');
+    const dateModifiedOption = screen.getByText(
+      "mock-merge.sortBy.dateModified",
+    );
     fireEvent.click(dateModifiedOption);
 
     // 2. Toggle to descending
@@ -169,7 +187,7 @@ describe('MergeFileSorter', () => {
     // 3. Click sort
     fireEvent.click(sortButton);
 
-    expect(mockOnSortFiles).toHaveBeenCalledWith('dateModified', false);
+    expect(mockOnSortFiles).toHaveBeenCalledWith("dateModified", false);
 
     // 4. Toggle back to ascending
     fireEvent.click(directionButton);
@@ -177,6 +195,6 @@ describe('MergeFileSorter', () => {
     // 5. Sort again
     fireEvent.click(sortButton);
 
-    expect(mockOnSortFiles).toHaveBeenCalledWith('dateModified', true);
+    expect(mockOnSortFiles).toHaveBeenCalledWith("dateModified", true);
   });
 });
diff --git a/frontend/src/core/components/tools/merge/MergeFileSorter.tsx b/frontend/src/core/components/tools/merge/MergeFileSorter.tsx
index be6d21786e..5a7e8c994f 100644
--- a/frontend/src/core/components/tools/merge/MergeFileSorter.tsx
+++ b/frontend/src/core/components/tools/merge/MergeFileSorter.tsx
@@ -1,13 +1,16 @@
-import React, { useState } from 'react';
-import { Group, Button, Text, ActionIcon, Stack, Select } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import SortIcon from '@mui/icons-material/Sort';
-import ArrowUpwardIcon from '@mui/icons-material/ArrowUpward';
-import ArrowDownwardIcon from '@mui/icons-material/ArrowDownward';
+import React, { useState } from "react";
+import { Group, Button, Text, ActionIcon, Stack, Select } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import SortIcon from "@mui/icons-material/Sort";
+import ArrowUpwardIcon from "@mui/icons-material/ArrowUpward";
+import ArrowDownwardIcon from "@mui/icons-material/ArrowDownward";
 import { Z_INDEX_AUTOMATE_DROPDOWN } from "@app/styles/zIndex";
 
 interface MergeFileSorterProps {
-  onSortFiles: (sortType: 'filename' | 'dateModified', ascending: boolean) => void;
+  onSortFiles: (
+    sortType: "filename" | "dateModified",
+    ascending: boolean,
+  ) => void;
   disabled?: boolean;
 }
 
@@ -16,12 +19,17 @@ const MergeFileSorter: React.FC<MergeFileSorterProps> = ({
   disabled = false,
 }) => {
   const { t } = useTranslation();
-  const [sortType, setSortType] = useState<'filename' | 'dateModified'>('filename');
+  const [sortType, setSortType] = useState<"filename" | "dateModified">(
+    "filename",
+  );
   const [ascending, setAscending] = useState(true);
 
   const sortOptions = [
-    { value: 'filename', label: t('merge.sortBy.filename', 'File Name') },
-    { value: 'dateModified', label: t('merge.sortBy.dateModified', 'Date Modified') },
+    { value: "filename", label: t("merge.sortBy.filename", "File Name") },
+    {
+      value: "dateModified",
+      label: t("merge.sortBy.dateModified", "Date Modified"),
+    },
   ];
 
   const handleSort = () => {
@@ -35,19 +43,27 @@ const MergeFileSorter: React.FC<MergeFileSorterProps> = ({
   return (
     <Stack gap="xs">
       <Text size="sm" fw={500}>
-        {t('merge.sortBy.description', "Files will be merged in the order they're selected. Drag to reorder or sort below.")}
+        {t(
+          "merge.sortBy.description",
+          "Files will be merged in the order they're selected. Drag to reorder or sort below.",
+        )}
       </Text>
       <Stack gap="xs">
         <Group gap="xs" align="end" justify="space-between">
           <Select
             data={sortOptions}
             value={sortType}
-            onChange={(value) => setSortType(value as 'filename' | 'dateModified')}
+            onChange={(value) =>
+              setSortType(value as "filename" | "dateModified")
+            }
             disabled={disabled}
-            label={t('merge.sortBy.label', 'Sort By')}
-            size='xs'
+            label={t("merge.sortBy.label", "Sort By")}
+            size="xs"
             style={{ flex: 1 }}
-            comboboxProps={{ withinPortal: true, zIndex: Z_INDEX_AUTOMATE_DROPDOWN }}
+            comboboxProps={{
+              withinPortal: true,
+              zIndex: Z_INDEX_AUTOMATE_DROPDOWN,
+            }}
           />
 
           <ActionIcon
@@ -55,7 +71,11 @@ const MergeFileSorter: React.FC<MergeFileSorterProps> = ({
             size="md"
             onClick={handleDirectionToggle}
             disabled={disabled}
-            title={ascending ? t('merge.sortBy.ascending', 'Ascending') : t('merge.sortBy.descending', 'Descending')}
+            title={
+              ascending
+                ? t("merge.sortBy.ascending", "Ascending")
+                : t("merge.sortBy.descending", "Descending")
+            }
           >
             {ascending ? <ArrowUpwardIcon /> : <ArrowDownwardIcon />}
           </ActionIcon>
@@ -69,7 +89,7 @@ const MergeFileSorter: React.FC<MergeFileSorterProps> = ({
           disabled={disabled}
           fullWidth
         >
-          {t('merge.sortBy.sort', 'Sort')}
+          {t("merge.sortBy.sort", "Sort")}
         </Button>
       </Stack>
     </Stack>
diff --git a/frontend/src/core/components/tools/merge/MergeSettings.test.tsx b/frontend/src/core/components/tools/merge/MergeSettings.test.tsx
index c467f70307..2249d64c45 100644
--- a/frontend/src/core/components/tools/merge/MergeSettings.test.tsx
+++ b/frontend/src/core/components/tools/merge/MergeSettings.test.tsx
@@ -1,13 +1,13 @@
-import { describe, expect, test, vi, beforeEach } from 'vitest';
-import { render, screen, fireEvent } from '@testing-library/react';
-import { MantineProvider } from '@mantine/core';
-import MergeSettings from '@app/components/tools/merge/MergeSettings';
-import { MergeParameters } from '@app/hooks/tools/merge/useMergeParameters';
+import { describe, expect, test, vi, beforeEach } from "vitest";
+import { render, screen, fireEvent } from "@testing-library/react";
+import { MantineProvider } from "@mantine/core";
+import MergeSettings from "@app/components/tools/merge/MergeSettings";
+import { MergeParameters } from "@app/hooks/tools/merge/useMergeParameters";
 
 // Mock useTranslation with predictable return values
 const mockT = vi.fn((key: string) => `mock-${key}`);
-vi.mock('react-i18next', () => ({
-  useTranslation: () => ({ t: mockT })
+vi.mock("react-i18next", () => ({
+  useTranslation: () => ({ t: mockT }),
 }));
 
 // Wrapper component to provide Mantine context
@@ -15,7 +15,7 @@ const TestWrapper = ({ children }: { children: React.ReactNode }) => (
   <MantineProvider>{children}</MantineProvider>
 );
 
-describe('MergeSettings', () => {
+describe("MergeSettings", () => {
   const defaultParameters: MergeParameters = {
     removeDigitalSignature: false,
     generateTableOfContents: false,
@@ -27,74 +27,85 @@ describe('MergeSettings', () => {
     vi.clearAllMocks();
   });
 
-  test('should render both merge option checkboxes', () => {
+  test("should render both merge option checkboxes", () => {
     render(
       <TestWrapper>
         <MergeSettings
           parameters={defaultParameters}
           onParameterChange={mockOnParameterChange}
         />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
     // Should render one checkbox for each parameter
     const expectedCheckboxCount = Object.keys(defaultParameters).length;
-    const checkboxes = screen.getAllByRole('checkbox');
+    const checkboxes = screen.getAllByRole("checkbox");
     expect(checkboxes).toHaveLength(expectedCheckboxCount);
   });
 
-  test('should show correct initial checkbox states based on parameters', () => {
+  test("should show correct initial checkbox states based on parameters", () => {
     render(
       <TestWrapper>
         <MergeSettings
           parameters={defaultParameters}
           onParameterChange={mockOnParameterChange}
         />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
-    const checkboxes = screen.getAllByRole('checkbox');
+    const checkboxes = screen.getAllByRole("checkbox");
 
     // Both checkboxes should be unchecked initially
-    checkboxes.forEach(checkbox => {
+    checkboxes.forEach((checkbox) => {
       expect(checkbox).not.toBeChecked();
     });
   });
 
-  test('should call onParameterChange with correct parameters when checkboxes are clicked', () => {
+  test("should call onParameterChange with correct parameters when checkboxes are clicked", () => {
     render(
       <TestWrapper>
         <MergeSettings
           parameters={defaultParameters}
           onParameterChange={mockOnParameterChange}
         />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
-    const checkboxes = screen.getAllByRole('checkbox');
+    const checkboxes = screen.getAllByRole("checkbox");
 
     // Click the first checkbox (removeDigitalSignature - should toggle from false to true)
     fireEvent.click(checkboxes[0]);
-    expect(mockOnParameterChange).toHaveBeenCalledWith('removeDigitalSignature', true);
+    expect(mockOnParameterChange).toHaveBeenCalledWith(
+      "removeDigitalSignature",
+      true,
+    );
 
     // Click the second checkbox (generateTableOfContents - should toggle from false to true)
     fireEvent.click(checkboxes[1]);
-    expect(mockOnParameterChange).toHaveBeenCalledWith('generateTableOfContents', true);
+    expect(mockOnParameterChange).toHaveBeenCalledWith(
+      "generateTableOfContents",
+      true,
+    );
   });
 
-  test('should call translation function with correct keys', () => {
+  test("should call translation function with correct keys", () => {
     render(
       <TestWrapper>
         <MergeSettings
           parameters={defaultParameters}
           onParameterChange={mockOnParameterChange}
         />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
     // Verify that translation keys are being called
-    expect(mockT).toHaveBeenCalledWith('merge.removeDigitalSignature.label', 'Remove digital signature in the merged file?');
-    expect(mockT).toHaveBeenCalledWith('merge.generateTableOfContents.label', 'Generate table of contents in the merged file?');
+    expect(mockT).toHaveBeenCalledWith(
+      "merge.removeDigitalSignature.label",
+      "Remove digital signature in the merged file?",
+    );
+    expect(mockT).toHaveBeenCalledWith(
+      "merge.generateTableOfContents.label",
+      "Generate table of contents in the merged file?",
+    );
   });
-  
 });
diff --git a/frontend/src/core/components/tools/merge/MergeSettings.tsx b/frontend/src/core/components/tools/merge/MergeSettings.tsx
index e154d4ddbe..9d91682814 100644
--- a/frontend/src/core/components/tools/merge/MergeSettings.tsx
+++ b/frontend/src/core/components/tools/merge/MergeSettings.tsx
@@ -1,11 +1,14 @@
-import React from 'react';
-import { Stack, Checkbox } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { MergeParameters } from '@app/hooks/tools/merge/useMergeParameters';
+import React from "react";
+import { Stack, Checkbox } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import { MergeParameters } from "@app/hooks/tools/merge/useMergeParameters";
 
 interface MergeSettingsProps {
   parameters: MergeParameters;
-  onParameterChange: <K extends keyof MergeParameters>(key: K, value: MergeParameters[K]) => void;
+  onParameterChange: <K extends keyof MergeParameters>(
+    key: K,
+    value: MergeParameters[K],
+  ) => void;
   disabled?: boolean;
 }
 
@@ -19,16 +22,32 @@ const MergeSettings: React.FC<MergeSettingsProps> = ({
   return (
     <Stack gap="md">
       <Checkbox
-        label={t('merge.removeDigitalSignature.label', 'Remove digital signature in the merged file?')}
+        label={t(
+          "merge.removeDigitalSignature.label",
+          "Remove digital signature in the merged file?",
+        )}
         checked={parameters.removeDigitalSignature}
-        onChange={(event) => onParameterChange('removeDigitalSignature', event.currentTarget.checked)}
+        onChange={(event) =>
+          onParameterChange(
+            "removeDigitalSignature",
+            event.currentTarget.checked,
+          )
+        }
         disabled={disabled}
       />
 
       <Checkbox
-        label={t('merge.generateTableOfContents.label', 'Generate table of contents in the merged file?')}
+        label={t(
+          "merge.generateTableOfContents.label",
+          "Generate table of contents in the merged file?",
+        )}
         checked={parameters.generateTableOfContents}
-        onChange={(event) => onParameterChange('generateTableOfContents', event.currentTarget.checked)}
+        onChange={(event) =>
+          onParameterChange(
+            "generateTableOfContents",
+            event.currentTarget.checked,
+          )
+        }
         disabled={disabled}
       />
     </Stack>
diff --git a/frontend/src/core/components/tools/ocr/AdvancedOCRSettings.tsx b/frontend/src/core/components/tools/ocr/AdvancedOCRSettings.tsx
index ca4d5fc242..c089154438 100644
--- a/frontend/src/core/components/tools/ocr/AdvancedOCRSettings.tsx
+++ b/frontend/src/core/components/tools/ocr/AdvancedOCRSettings.tsx
@@ -1,7 +1,7 @@
-import React from 'react';
-import { Stack, Text, Checkbox } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { OCRParameters } from '@app/hooks/tools/ocr/useOCRParameters';
+import React from "react";
+import { Stack, Text, Checkbox } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import { OCRParameters } from "@app/hooks/tools/ocr/useOCRParameters";
 
 export interface AdvancedOCRParameters {
   advancedOptions: string[];
@@ -16,49 +16,72 @@ interface AdvancedOption {
 interface AdvancedOCRSettingsProps {
   advancedOptions: string[];
   ocrRenderType?: string;
-  onParameterChange: <K extends keyof OCRParameters>(key: K, value: OCRParameters[K]) => void;
+  onParameterChange: <K extends keyof OCRParameters>(
+    key: K,
+    value: OCRParameters[K],
+  ) => void;
   disabled?: boolean;
 }
 
 const AdvancedOCRSettings: React.FC<AdvancedOCRSettingsProps> = ({
   advancedOptions,
-  ocrRenderType = 'hocr',
+  ocrRenderType = "hocr",
   onParameterChange,
-  disabled = false
+  disabled = false,
 }) => {
   const { t } = useTranslation();
 
   // Define the advanced options available
   const advancedOptionsData: AdvancedOption[] = [
-    { value: 'compatibilityMode', label: t('ocr.settings.compatibilityMode.label', 'Compatibility Mode'), isSpecial: true },
-    { value: 'sidecar', label: t('ocr.settings.advancedOptions.sidecar', 'Create a text file'), isSpecial: false },
-    { value: 'deskew', label: t('ocr.settings.advancedOptions.deskew', 'Deskew pages'), isSpecial: false },
-    { value: 'clean', label: t('ocr.settings.advancedOptions.clean', 'Clean input file'), isSpecial: false },
-    { value: 'cleanFinal', label: t('ocr.settings.advancedOptions.cleanFinal', 'Clean final output'), isSpecial: false },
+    {
+      value: "compatibilityMode",
+      label: t("ocr.settings.compatibilityMode.label", "Compatibility Mode"),
+      isSpecial: true,
+    },
+    {
+      value: "sidecar",
+      label: t("ocr.settings.advancedOptions.sidecar", "Create a text file"),
+      isSpecial: false,
+    },
+    {
+      value: "deskew",
+      label: t("ocr.settings.advancedOptions.deskew", "Deskew pages"),
+      isSpecial: false,
+    },
+    {
+      value: "clean",
+      label: t("ocr.settings.advancedOptions.clean", "Clean input file"),
+      isSpecial: false,
+    },
+    {
+      value: "cleanFinal",
+      label: t("ocr.settings.advancedOptions.cleanFinal", "Clean final output"),
+      isSpecial: false,
+    },
   ];
 
   // Handle individual checkbox changes
   const handleCheckboxChange = (optionValue: string, checked: boolean) => {
-    const option = advancedOptionsData.find(opt => opt.value === optionValue);
+    const option = advancedOptionsData.find((opt) => opt.value === optionValue);
 
     if (option?.isSpecial) {
       // Handle special options (like compatibility mode) differently
-      if (optionValue === 'compatibilityMode') {
-        onParameterChange('ocrRenderType', checked ? 'sandwich' : 'hocr');
+      if (optionValue === "compatibilityMode") {
+        onParameterChange("ocrRenderType", checked ? "sandwich" : "hocr");
       }
     } else {
       // Handle regular advanced options
       const newOptions = checked
         ? [...advancedOptions, optionValue]
-        : advancedOptions.filter(option => option !== optionValue);
-      onParameterChange('additionalOptions', newOptions);
+        : advancedOptions.filter((option) => option !== optionValue);
+      onParameterChange("additionalOptions", newOptions);
     }
   };
 
   // Check if a special option is selected
   const isSpecialOptionSelected = (optionValue: string) => {
-    if (optionValue === 'compatibilityMode') {
-      return ocrRenderType === 'sandwich';
+    if (optionValue === "compatibilityMode") {
+      return ocrRenderType === "sandwich";
     }
     return false;
   };
@@ -67,15 +90,21 @@ const AdvancedOCRSettings: React.FC<AdvancedOCRSettingsProps> = ({
     <Stack gap="md">
       <div>
         <Text size="sm" fw={500} mb="md">
-          {t('ocr.settings.advancedOptions.label', 'Processing Options')}
+          {t("ocr.settings.advancedOptions.label", "Processing Options")}
         </Text>
 
         <Stack gap="sm">
           {advancedOptionsData.map((option) => (
             <Checkbox
               key={option.value}
-              checked={option.isSpecial ? isSpecialOptionSelected(option.value) : advancedOptions.includes(option.value)}
-              onChange={(event) => handleCheckboxChange(option.value, event.currentTarget.checked)}
+              checked={
+                option.isSpecial
+                  ? isSpecialOptionSelected(option.value)
+                  : advancedOptions.includes(option.value)
+              }
+              onChange={(event) =>
+                handleCheckboxChange(option.value, event.currentTarget.checked)
+              }
               label={option.label}
               disabled={disabled}
               size="sm"
diff --git a/frontend/src/core/components/tools/ocr/LanguagePicker.module.css b/frontend/src/core/components/tools/ocr/LanguagePicker.module.css
index c44e752915..6f7ae437b1 100644
--- a/frontend/src/core/components/tools/ocr/LanguagePicker.module.css
+++ b/frontend/src/core/components/tools/ocr/LanguagePicker.module.css
@@ -17,17 +17,23 @@
 
 /* Dark mode background */
 [data-mantine-color-scheme="dark"] .languagePicker {
-  background-color: var(--mantine-color-dark-6); /* Use Mantine dark color instead of hardcoded */
+  background-color: var(
+    --mantine-color-dark-6
+  ); /* Use Mantine dark color instead of hardcoded */
 }
 
 .languagePicker:hover {
   border-color: var(--border-strong);
-  background-color: var(--mantine-color-gray-0); /* Light gray on hover for light mode */
+  background-color: var(
+    --mantine-color-gray-0
+  ); /* Light gray on hover for light mode */
 }
 
 /* Dark mode hover */
 [data-mantine-color-scheme="dark"] .languagePicker:hover {
-  background-color: var(--mantine-color-dark-5); /* Use Mantine color variable */
+  background-color: var(
+    --mantine-color-dark-5
+  ); /* Use Mantine color variable */
 }
 
 .languagePicker:disabled {
@@ -75,7 +81,9 @@
 }
 
 .languagePickerOption:hover {
-  background-color: var(--mantine-color-gray-0); /* Light gray on hover for light mode */
+  background-color: var(
+    --mantine-color-gray-0
+  ); /* Light gray on hover for light mode */
 }
 
 /* Dark mode option hover */
@@ -83,8 +91,6 @@
   background-color: var(--mantine-color-dark-5);
 }
 
-
-
 /* Additional helper classes for the component */
 .languagePickerTarget {
   width: 100%;
@@ -123,4 +129,4 @@
 /* Dark mode link */
 [data-mantine-color-scheme="dark"] .languagePickerLink {
   color: var(--mantine-color-blue-4);
-} 
\ No newline at end of file
+}
diff --git a/frontend/src/core/components/tools/ocr/LanguagePicker.tsx b/frontend/src/core/components/tools/ocr/LanguagePicker.tsx
index 7e023e9ccd..8ba91e598b 100644
--- a/frontend/src/core/components/tools/ocr/LanguagePicker.tsx
+++ b/frontend/src/core/components/tools/ocr/LanguagePicker.tsx
@@ -1,9 +1,15 @@
-import React, { useState, useEffect } from 'react';
-import { Text, Loader } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { getAutoOcrLanguage, getBrowserLanguagesForOcr, getOcrDisplayName } from '@app/utils/languageMapping';
-import apiClient from '@app/services/apiClient';
-import DropdownListWithFooter, { DropdownItem } from '@app/components/shared/DropdownListWithFooter';
+import React, { useState, useEffect } from "react";
+import { Text, Loader } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import {
+  getAutoOcrLanguage,
+  getBrowserLanguagesForOcr,
+  getOcrDisplayName,
+} from "@app/utils/languageMapping";
+import apiClient from "@app/services/apiClient";
+import DropdownListWithFooter, {
+  DropdownItem,
+} from "@app/components/shared/DropdownListWithFooter";
 
 export interface LanguageOption {
   value: string;
@@ -23,14 +29,16 @@ export interface LanguagePickerProps {
 const LanguagePicker: React.FC<LanguagePickerProps> = ({
   value,
   onChange,
-  placeholder = 'Select languages',
+  placeholder = "Select languages",
   disabled = false,
   label,
-  languagesEndpoint = '/api/v1/ui-data/ocr-pdf',
+  languagesEndpoint = "/api/v1/ui-data/ocr-pdf",
   autoFillFromBrowserLanguage = true,
 }) => {
   const { t, i18n } = useTranslation();
-  const [availableLanguages, setAvailableLanguages] = useState<DropdownItem[]>([]);
+  const [availableLanguages, setAvailableLanguages] = useState<DropdownItem[]>(
+    [],
+  );
   const [isLoadingLanguages, setIsLoadingLanguages] = useState(true);
   const [hasAutoFilled, setHasAutoFilled] = useState(false);
 
@@ -38,11 +46,14 @@ const LanguagePicker: React.FC<LanguagePickerProps> = ({
     // Fetch available languages from backend
     const fetchLanguages = async () => {
       try {
-        const { data } = await apiClient.get<{ languages: string[] }>(languagesEndpoint);
+        const { data } = await apiClient.get<{ languages: string[] }>(
+          languagesEndpoint,
+        );
 
-        const displayNames = typeof Intl.DisplayNames !== 'undefined'
-          ? new Intl.DisplayNames([i18n.language], { type: 'language' })
-          : null;
+        const displayNames =
+          typeof Intl.DisplayNames !== "undefined"
+            ? new Intl.DisplayNames([i18n.language], { type: "language" })
+            : null;
 
         const languageOptions = [...new Set(data.languages)]
           .map((lang) => {
@@ -60,25 +71,25 @@ const LanguagePicker: React.FC<LanguagePickerProps> = ({
               : null;
 
             const translatedName =
-              (hasKeyTranslation ? translatedFromKey : null)
-              || intlTranslatedName
-              || t(`ocr.languages.${lang}`, displayName);
+              (hasKeyTranslation ? translatedFromKey : null) ||
+              intlTranslatedName ||
+              t(`ocr.languages.${lang}`, displayName);
 
             return {
               value: lang,
               name: translatedName,
-              label: translatedName
+              label: translatedName,
             };
           })
           .sort((a, b) => a.name.localeCompare(b.name, i18n.language));
 
         setAvailableLanguages(languageOptions);
       } catch (error) {
-        console.error('[LanguagePicker] Fetch failed with error:', error);
-        console.error('[LanguagePicker] Error details:', {
-          name: error instanceof Error ? error.name : 'Unknown',
+        console.error("[LanguagePicker] Fetch failed with error:", error);
+        console.error("[LanguagePicker] Error details:", {
+          name: error instanceof Error ? error.name : "Unknown",
           message: error instanceof Error ? error.message : String(error),
-          stack: error instanceof Error ? error.stack : undefined
+          stack: error instanceof Error ? error.stack : undefined,
         });
       } finally {
         setIsLoadingLanguages(false);
@@ -90,30 +101,43 @@ const LanguagePicker: React.FC<LanguagePickerProps> = ({
 
   // Auto-fill OCR language based on browser language when languages are loaded
   useEffect(() => {
-    const shouldAutoFillLanguage = autoFillFromBrowserLanguage && !isLoadingLanguages && availableLanguages.length > 0 && !hasAutoFilled && value.length === 0;
+    const shouldAutoFillLanguage =
+      autoFillFromBrowserLanguage &&
+      !isLoadingLanguages &&
+      availableLanguages.length > 0 &&
+      !hasAutoFilled &&
+      value.length === 0;
 
     if (shouldAutoFillLanguage) {
       // Use the comprehensive language mapping from languageMapping.ts
       const suggestedOcrLanguages = getAutoOcrLanguage(i18n.language);
-      
+
       if (suggestedOcrLanguages.length > 0) {
         // Find the first suggested language that's available in the backend
-        const matchingLanguage = availableLanguages.find(lang => 
-          suggestedOcrLanguages.includes(lang.value)
+        const matchingLanguage = availableLanguages.find((lang) =>
+          suggestedOcrLanguages.includes(lang.value),
         );
-        
+
         if (matchingLanguage) {
           onChange([matchingLanguage.value]);
         }
       }
-      
+
       setHasAutoFilled(true);
     }
-  }, [autoFillFromBrowserLanguage, isLoadingLanguages, availableLanguages, hasAutoFilled, value.length, i18n.language, onChange]);
+  }, [
+    autoFillFromBrowserLanguage,
+    isLoadingLanguages,
+    availableLanguages,
+    hasAutoFilled,
+    value.length,
+    i18n.language,
+    onChange,
+  ]);
 
   if (isLoadingLanguages) {
     return (
-      <div style={{ display: 'flex', alignItems: 'center', gap: '8px' }}>
+      <div style={{ display: "flex", alignItems: "center", gap: "8px" }}>
         <Loader size="xs" />
         <Text size="sm">Loading available languages...</Text>
       </div>
@@ -122,23 +146,31 @@ const LanguagePicker: React.FC<LanguagePickerProps> = ({
 
   const footer = (
     <>
-    <div className="flex flex-col items-center gap-1 text-center">
-      <Text size="xs" c="dimmed" className="text-center">
-        {t('ocr.languagePicker.additionalLanguages', 'Looking for additional languages?')}
-      </Text>
-      <Text 
-        size="xs" 
-        style={{ 
-          color: '#3b82f6', 
-          cursor: 'pointer',
-          textDecoration: 'underline',
-          textAlign: 'center'
-        }}
-        onClick={() => window.open('https://docs.stirlingpdf.com/Configuration/OCR', '_blank')}
-      >
-        {t('ocr.languagePicker.viewSetupGuide', 'View setup guide →')}
-      </Text>
-    </div>
+      <div className="flex flex-col items-center gap-1 text-center">
+        <Text size="xs" c="dimmed" className="text-center">
+          {t(
+            "ocr.languagePicker.additionalLanguages",
+            "Looking for additional languages?",
+          )}
+        </Text>
+        <Text
+          size="xs"
+          style={{
+            color: "#3b82f6",
+            cursor: "pointer",
+            textDecoration: "underline",
+            textAlign: "center",
+          }}
+          onClick={() =>
+            window.open(
+              "https://docs.stirlingpdf.com/Configuration/OCR",
+              "_blank",
+            )
+          }
+        >
+          {t("ocr.languagePicker.viewSetupGuide", "View setup guide →")}
+        </Text>
+      </div>
     </>
   );
 
@@ -158,4 +190,4 @@ const LanguagePicker: React.FC<LanguagePickerProps> = ({
   );
 };
 
-export default LanguagePicker; 
+export default LanguagePicker;
diff --git a/frontend/src/core/components/tools/ocr/OCRSettings.tsx b/frontend/src/core/components/tools/ocr/OCRSettings.tsx
index 487d970705..f39e5a5f30 100644
--- a/frontend/src/core/components/tools/ocr/OCRSettings.tsx
+++ b/frontend/src/core/components/tools/ocr/OCRSettings.tsx
@@ -1,47 +1,70 @@
-import React from 'react';
-import { Stack, Select, Divider } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import LanguagePicker from '@app/components/tools/ocr/LanguagePicker';
-import { OCRParameters } from '@app/hooks/tools/ocr/useOCRParameters';
-import { Z_INDEX_AUTOMATE_DROPDOWN } from '@app/styles/zIndex';
+import React from "react";
+import { Stack, Select, Divider } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import LanguagePicker from "@app/components/tools/ocr/LanguagePicker";
+import { OCRParameters } from "@app/hooks/tools/ocr/useOCRParameters";
+import { Z_INDEX_AUTOMATE_DROPDOWN } from "@app/styles/zIndex";
 
 interface OCRSettingsProps {
   parameters: OCRParameters;
-  onParameterChange: <K extends keyof OCRParameters>(key: K, value: OCRParameters[K]) => void;
+  onParameterChange: <K extends keyof OCRParameters>(
+    key: K,
+    value: OCRParameters[K],
+  ) => void;
   disabled?: boolean;
 }
 
 const OCRSettings: React.FC<OCRSettingsProps> = ({
   parameters,
   onParameterChange,
-  disabled = false
+  disabled = false,
 }) => {
   const { t } = useTranslation();
 
   return (
     <Stack gap="md">
-
       <Select
-        label={t('ocr.settings.ocrMode.label', 'OCR Mode')}
+        label={t("ocr.settings.ocrMode.label", "OCR Mode")}
         value={parameters.ocrType}
-        onChange={(value) => onParameterChange('ocrType', value || 'skip-text')}
+        onChange={(value) => onParameterChange("ocrType", value || "skip-text")}
         data={[
-          { value: 'skip-text', label: t('ocr.settings.ocrMode.auto', 'Auto (skip text layers)') },
-          { value: 'force-ocr', label: t('ocr.settings.ocrMode.force', 'Force (re-OCR all, replace text)') },
-          { value: 'Normal', label: t('ocr.settings.ocrMode.strict', 'Strict (abort if text found)') },
+          {
+            value: "skip-text",
+            label: t("ocr.settings.ocrMode.auto", "Auto (skip text layers)"),
+          },
+          {
+            value: "force-ocr",
+            label: t(
+              "ocr.settings.ocrMode.force",
+              "Force (re-OCR all, replace text)",
+            ),
+          },
+          {
+            value: "Normal",
+            label: t(
+              "ocr.settings.ocrMode.strict",
+              "Strict (abort if text found)",
+            ),
+          },
         ]}
         disabled={disabled}
-        comboboxProps={{ withinPortal: true, zIndex: Z_INDEX_AUTOMATE_DROPDOWN }}
+        comboboxProps={{
+          withinPortal: true,
+          zIndex: Z_INDEX_AUTOMATE_DROPDOWN,
+        }}
       />
 
       <Divider />
 
       <LanguagePicker
         value={parameters.languages || []}
-        onChange={(value) => onParameterChange('languages', value)}
-        placeholder={t('ocr.settings.languages.placeholder', 'Select languages')}
+        onChange={(value) => onParameterChange("languages", value)}
+        placeholder={t(
+          "ocr.settings.languages.placeholder",
+          "Select languages",
+        )}
         disabled={disabled}
-        label={t('ocr.settings.languages.label', 'Languages')}
+        label={t("ocr.settings.languages.label", "Languages")}
       />
     </Stack>
   );
diff --git a/frontend/src/core/components/tools/overlayPdfs/OverlayPdfsSettings.tsx b/frontend/src/core/components/tools/overlayPdfs/OverlayPdfsSettings.tsx
index 512dc6da4d..ce059c9204 100644
--- a/frontend/src/core/components/tools/overlayPdfs/OverlayPdfsSettings.tsx
+++ b/frontend/src/core/components/tools/overlayPdfs/OverlayPdfsSettings.tsx
@@ -1,36 +1,67 @@
-import { Stack, Text, Group, Select, SegmentedControl, NumberInput, Button, ActionIcon, Divider } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { type OverlayPdfsParameters, type OverlayMode } from '@app/hooks/tools/overlayPdfs/useOverlayPdfsParameters';
-import LocalIcon from '@app/components/shared/LocalIcon';
-import { useFilesModalContext } from '@app/contexts/FilesModalContext';
-import styles from '@app/components/tools/overlayPdfs/OverlayPdfsSettings.module.css';
+import {
+  Stack,
+  Text,
+  Group,
+  Select,
+  SegmentedControl,
+  NumberInput,
+  Button,
+  ActionIcon,
+  Divider,
+} from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import {
+  type OverlayPdfsParameters,
+  type OverlayMode,
+} from "@app/hooks/tools/overlayPdfs/useOverlayPdfsParameters";
+import LocalIcon from "@app/components/shared/LocalIcon";
+import { useFilesModalContext } from "@app/contexts/FilesModalContext";
+import styles from "@app/components/tools/overlayPdfs/OverlayPdfsSettings.module.css";
 import { Z_INDEX_AUTOMATE_DROPDOWN } from "@app/styles/zIndex";
 
 interface OverlayPdfsSettingsProps {
   parameters: OverlayPdfsParameters;
-  onParameterChange: <K extends keyof OverlayPdfsParameters>(key: K, value: OverlayPdfsParameters[K]) => void;
+  onParameterChange: <K extends keyof OverlayPdfsParameters>(
+    key: K,
+    value: OverlayPdfsParameters[K],
+  ) => void;
   disabled?: boolean;
 }
 
-export default function OverlayPdfsSettings({ parameters, onParameterChange, disabled = false }: OverlayPdfsSettingsProps) {
+export default function OverlayPdfsSettings({
+  parameters,
+  onParameterChange,
+  disabled = false,
+}: OverlayPdfsSettingsProps) {
   const { t } = useTranslation();
   const { openFilesModal } = useFilesModalContext();
 
   const handleOverlayFilesChange = (files: File[]) => {
-    onParameterChange('overlayFiles', files);
+    onParameterChange("overlayFiles", files);
     // Reset counts to match number of files if in FixedRepeatOverlay
-    if (parameters.overlayMode === 'FixedRepeatOverlay') {
-      const nextCounts = files.map((_, i) => parameters.counts[i] && parameters.counts[i] > 0 ? parameters.counts[i] : 1);
-      onParameterChange('counts', nextCounts);
+    if (parameters.overlayMode === "FixedRepeatOverlay") {
+      const nextCounts = files.map((_, i) =>
+        parameters.counts[i] && parameters.counts[i] > 0
+          ? parameters.counts[i]
+          : 1,
+      );
+      onParameterChange("counts", nextCounts);
     }
   };
 
   const handleModeChange = (mode: OverlayMode) => {
-    onParameterChange('overlayMode', mode);
-    if (mode !== 'FixedRepeatOverlay') {
-      onParameterChange('counts', []);
+    onParameterChange("overlayMode", mode);
+    if (mode !== "FixedRepeatOverlay") {
+      onParameterChange("counts", []);
     } else if (parameters.overlayFiles?.length > 0) {
-      onParameterChange('counts', parameters.overlayFiles.map((_, i) => parameters.counts[i] && parameters.counts[i] > 0 ? parameters.counts[i] : 1));
+      onParameterChange(
+        "counts",
+        parameters.overlayFiles.map((_, i) =>
+          parameters.counts[i] && parameters.counts[i] > 0
+            ? parameters.counts[i]
+            : 1,
+        ),
+      );
     }
   };
 
@@ -38,55 +69,86 @@ export default function OverlayPdfsSettings({ parameters, onParameterChange, dis
     if (disabled) return;
     openFilesModal({
       customHandler: (files: File[]) => {
-        handleOverlayFilesChange([...(parameters.overlayFiles || []), ...files]);
-      }
+        handleOverlayFilesChange([
+          ...(parameters.overlayFiles || []),
+          ...files,
+        ]);
+      },
     });
   };
 
   return (
     <Stack gap="md">
-
       <Stack gap="xs">
-        <Text size="sm" fw={500}>{t('overlay-pdfs.mode.label', 'Overlay Mode')}</Text>
+        <Text size="sm" fw={500}>
+          {t("overlay-pdfs.mode.label", "Overlay Mode")}
+        </Text>
         <Select
           data={[
-            { value: 'SequentialOverlay', label: t('overlay-pdfs.mode.sequential', 'Sequential Overlay') },
-            { value: 'InterleavedOverlay', label: t('overlay-pdfs.mode.interleaved', 'Interleaved Overlay') },
-            { value: 'FixedRepeatOverlay', label: t('overlay-pdfs.mode.fixedRepeat', 'Fixed Repeat Overlay') },
+            {
+              value: "SequentialOverlay",
+              label: t("overlay-pdfs.mode.sequential", "Sequential Overlay"),
+            },
+            {
+              value: "InterleavedOverlay",
+              label: t("overlay-pdfs.mode.interleaved", "Interleaved Overlay"),
+            },
+            {
+              value: "FixedRepeatOverlay",
+              label: t("overlay-pdfs.mode.fixedRepeat", "Fixed Repeat Overlay"),
+            },
           ]}
           value={parameters.overlayMode}
-          onChange={(v) => handleModeChange((v || 'SequentialOverlay') as OverlayMode)}
+          onChange={(v) =>
+            handleModeChange((v || "SequentialOverlay") as OverlayMode)
+          }
           disabled={disabled}
-          comboboxProps={{ withinPortal: true, zIndex: Z_INDEX_AUTOMATE_DROPDOWN }}
+          comboboxProps={{
+            withinPortal: true,
+            zIndex: Z_INDEX_AUTOMATE_DROPDOWN,
+          }}
         />
       </Stack>
 
       <Divider />
 
       <Stack gap="xs">
-        <Text size="sm" fw={500}>{t('overlay-pdfs.position.label', 'Overlay Position')}</Text>
+        <Text size="sm" fw={500}>
+          {t("overlay-pdfs.position.label", "Overlay Position")}
+        </Text>
         <SegmentedControl
           value={String(parameters.overlayPosition)}
-          onChange={(v) => onParameterChange('overlayPosition', (v === '1' ? 1 : 0) as 0 | 1)}
+          onChange={(v) =>
+            onParameterChange("overlayPosition", (v === "1" ? 1 : 0) as 0 | 1)
+          }
           data={[
-            { label: t('overlay-pdfs.position.foreground', 'Foreground'), value: '0' },
-            { label: t('overlay-pdfs.position.background', 'Background'), value: '1' },
+            {
+              label: t("overlay-pdfs.position.foreground", "Foreground"),
+              value: "0",
+            },
+            {
+              label: t("overlay-pdfs.position.background", "Background"),
+              value: "1",
+            },
           ]}
           disabled={disabled}
         />
       </Stack>
 
-      {parameters.overlayMode === 'FixedRepeatOverlay' && (
+      {parameters.overlayMode === "FixedRepeatOverlay" && (
         <>
           <Divider />
           <Stack gap="xs">
-            <Text size="sm" fw={500}>{t('overlay-pdfs.counts.label', 'Overlay Counts')}</Text>
+            <Text size="sm" fw={500}>
+              {t("overlay-pdfs.counts.label", "Overlay Counts")}
+            </Text>
             {parameters.overlayFiles?.length > 0 ? (
               <Stack gap="xs">
                 {parameters.overlayFiles.map((_, index) => (
                   <Group key={index} gap="xs" wrap="nowrap">
                     <Text size="sm" className={styles.countLabel}>
-                      {t('overlay-pdfs.counts.item', 'Count for file')} {index + 1}
+                      {t("overlay-pdfs.counts.item", "Count for file")}{" "}
+                      {index + 1}
                     </Text>
                     <NumberInput
                       min={1}
@@ -95,7 +157,7 @@ export default function OverlayPdfsSettings({ parameters, onParameterChange, dis
                       onChange={(value) => {
                         const next = [...(parameters.counts || [])];
                         next[index] = Number(value) || 1;
-                        onParameterChange('counts', next);
+                        onParameterChange("counts", next);
                       }}
                       disabled={disabled}
                     />
@@ -104,7 +166,10 @@ export default function OverlayPdfsSettings({ parameters, onParameterChange, dis
               </Stack>
             ) : (
               <Text size="sm" c="dimmed">
-                {t('overlay-pdfs.counts.noFiles', 'Add overlay files to configure counts')}
+                {t(
+                  "overlay-pdfs.counts.noFiles",
+                  "Add overlay files to configure counts",
+                )}
               </Text>
             )}
           </Stack>
@@ -114,7 +179,9 @@ export default function OverlayPdfsSettings({ parameters, onParameterChange, dis
       <Divider />
 
       <Stack gap="xs">
-        <Text size="sm" fw={500}>{t('overlay-pdfs.overlayFiles.label', 'Overlay Files')}</Text>
+        <Text size="sm" fw={500}>
+          {t("overlay-pdfs.overlayFiles.label", "Overlay Files")}
+        </Text>
         <Button
           size="xs"
           color="blue"
@@ -124,55 +191,58 @@ export default function OverlayPdfsSettings({ parameters, onParameterChange, dis
           fullWidth
         >
           {parameters.overlayFiles?.length > 0
-            ? t('overlay-pdfs.overlayFiles.addMore', 'Add more PDFs...')
-            : t('overlay-pdfs.overlayFiles.placeholder', 'Choose PDF(s)...')}
+            ? t("overlay-pdfs.overlayFiles.addMore", "Add more PDFs...")
+            : t("overlay-pdfs.overlayFiles.placeholder", "Choose PDF(s)...")}
         </Button>
 
-        {parameters.overlayFiles?.length > 0 && (() => {
-          return (
-            <div className={styles.fileListContainer}>
-              <Stack gap="xs">
-                {parameters.overlayFiles.map((file, index) => (
-                  <Group
-                    key={index}
-                    justify="space-between"
-                    p="xs"
-                    className={styles.fileItem}
-                  >
-                    <Group gap="xs" className={styles.fileGroup}>
-                      <div className={styles.fileNameContainer}>
-                        <div
-                          className={styles.fileName}
-                          title={file.name}
-                        >
-                          {file.name}
-                        </div>
-                      </div>
-                      <Text size="xs" c="dimmed" className={styles.fileSize}>
-                        ({(file.size / 1024).toFixed(1)} KB)
-                      </Text>
-                    </Group>
-                    <ActionIcon
-                      size="sm"
-                      variant="subtle"
-                      color="red"
-                      className={styles.removeButton}
-                      onClick={() => {
-                        const next = (parameters.overlayFiles || []).filter((_, i) => i !== index);
-                        handleOverlayFilesChange(next);
-                      }}
-                      disabled={disabled}
+        {parameters.overlayFiles?.length > 0 &&
+          (() => {
+            return (
+              <div className={styles.fileListContainer}>
+                <Stack gap="xs">
+                  {parameters.overlayFiles.map((file, index) => (
+                    <Group
+                      key={index}
+                      justify="space-between"
+                      p="xs"
+                      className={styles.fileItem}
                     >
-                      <LocalIcon icon="close-rounded" width="14" height="14" />
-                    </ActionIcon>
-                  </Group>
-                ))}
-              </Stack>
-            </div>
-          );
-        })()}
+                      <Group gap="xs" className={styles.fileGroup}>
+                        <div className={styles.fileNameContainer}>
+                          <div className={styles.fileName} title={file.name}>
+                            {file.name}
+                          </div>
+                        </div>
+                        <Text size="xs" c="dimmed" className={styles.fileSize}>
+                          ({(file.size / 1024).toFixed(1)} KB)
+                        </Text>
+                      </Group>
+                      <ActionIcon
+                        size="sm"
+                        variant="subtle"
+                        color="red"
+                        className={styles.removeButton}
+                        onClick={() => {
+                          const next = (parameters.overlayFiles || []).filter(
+                            (_, i) => i !== index,
+                          );
+                          handleOverlayFilesChange(next);
+                        }}
+                        disabled={disabled}
+                      >
+                        <LocalIcon
+                          icon="close-rounded"
+                          width="14"
+                          height="14"
+                        />
+                      </ActionIcon>
+                    </Group>
+                  ))}
+                </Stack>
+              </div>
+            );
+          })()}
       </Stack>
-
     </Stack>
   );
 }
diff --git a/frontend/src/core/components/tools/pageLayout/LayoutPreview.tsx b/frontend/src/core/components/tools/pageLayout/LayoutPreview.tsx
index 04b029d2a0..76e6f0c899 100644
--- a/frontend/src/core/components/tools/pageLayout/LayoutPreview.tsx
+++ b/frontend/src/core/components/tools/pageLayout/LayoutPreview.tsx
@@ -1,18 +1,17 @@
-import { PageLayoutParameters } from '@app/hooks/tools/pageLayout/usePageLayoutParameters';
-import { computeBoxes } from '@app/components/tools/pageLayout/utils/computeBoxes';
+import { PageLayoutParameters } from "@app/hooks/tools/pageLayout/usePageLayoutParameters";
+import { computeBoxes } from "@app/components/tools/pageLayout/utils/computeBoxes";
 
 export default function LayoutPreview({
-  parameters
+  parameters,
 }: {
-  parameters: PageLayoutParameters
+  parameters: PageLayoutParameters;
 }) {
-
   const sheet = {
     x: 0,
     y: 0,
     width: parameters.orientation === "LANDSCAPE" ? 297 : 210,
-    height: parameters.orientation === "LANDSCAPE" ? 210 : 297
-  }
+    height: parameters.orientation === "LANDSCAPE" ? 210 : 297,
+  };
 
   const boxes = computeBoxes(sheet, parameters);
   const aspectRatio = sheet.width / sheet.height;
@@ -22,12 +21,16 @@ export default function LayoutPreview({
       viewBox={`${sheet.x} ${sheet.y} ${sheet.width} ${sheet.height}`}
       preserveAspectRatio="xMidYMid meet"
       style={{
-        width: parameters.orientation === "PORTRAIT" ? "50%" : `${50 * aspectRatio}%`,
+        width:
+          parameters.orientation === "PORTRAIT"
+            ? "50%"
+            : `${50 * aspectRatio}%`,
         aspectRatio: `${aspectRatio}`,
-        display: 'block',
-        margin: '0 auto',
-        padding: '10px',
-      }}>
+        display: "block",
+        margin: "0 auto",
+        padding: "10px",
+      }}
+    >
       <rect
         x={sheet.x}
         y={sheet.y}
@@ -39,7 +42,7 @@ export default function LayoutPreview({
         stroke="black"
         strokeWidth={2}
       />
-      {boxes.map(box => (
+      {boxes.map((box) => (
         <g key={box.label}>
           <rect
             x={box.x}
@@ -64,9 +67,8 @@ export default function LayoutPreview({
           >
             {box.label}
           </text>
-        </g>))
-      }
+        </g>
+      ))}
     </svg>
-
-  )
+  );
 }
diff --git a/frontend/src/core/components/tools/pageLayout/PageLayoutAdvancedSettings.tsx b/frontend/src/core/components/tools/pageLayout/PageLayoutAdvancedSettings.tsx
index 82b0992e24..b48c527ac4 100644
--- a/frontend/src/core/components/tools/pageLayout/PageLayoutAdvancedSettings.tsx
+++ b/frontend/src/core/components/tools/pageLayout/PageLayoutAdvancedSettings.tsx
@@ -1,6 +1,6 @@
-import { Divider, Select, Stack } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { PageLayoutParameters } from '@app/hooks/tools/pageLayout/usePageLayoutParameters';
+import { Divider, Select, Stack } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import { PageLayoutParameters } from "@app/hooks/tools/pageLayout/usePageLayoutParameters";
 import { Z_INDEX_AUTOMATE_DROPDOWN } from "@app/styles/zIndex";
 
 export default function PageLayoutAdvancedSettings({
@@ -11,65 +11,89 @@ export default function PageLayoutAdvancedSettings({
   parameters: PageLayoutParameters;
   onParameterChange: <K extends keyof PageLayoutParameters>(
     key: K,
-    value: PageLayoutParameters[K]
+    value: PageLayoutParameters[K],
   ) => void;
   disabled?: boolean;
 }) {
   const { t } = useTranslation();
   return (
     <Stack gap="sm">
-
       <Select
-        label={t('pageLayout.orientation.label', 'Orientation:')}
+        label={t("pageLayout.orientation.label", "Orientation:")}
         data={[
-          { value: 'PORTRAIT', label: t('pageLayout.orientation.portrait', 'Portrait') },
-          { value: 'LANDSCAPE', label: t('pageLayout.orientation.landscape', 'Landscape') },
+          {
+            value: "PORTRAIT",
+            label: t("pageLayout.orientation.portrait", "Portrait"),
+          },
+          {
+            value: "LANDSCAPE",
+            label: t("pageLayout.orientation.landscape", "Landscape"),
+          },
         ]}
         value={String(parameters.orientation)}
         onChange={(v) => {
           if (v === "PORTRAIT" || v === "LANDSCAPE") {
-            onParameterChange('orientation', v)
+            onParameterChange("orientation", v);
           }
         }}
         disabled={disabled}
-        comboboxProps={{ withinPortal: true, zIndex: Z_INDEX_AUTOMATE_DROPDOWN }}
+        comboboxProps={{
+          withinPortal: true,
+          zIndex: Z_INDEX_AUTOMATE_DROPDOWN,
+        }}
       />
 
       <Divider />
 
       <Select
-        label={t('pageLayout.arrangement.label', 'Page arrangement:')}
+        label={t("pageLayout.arrangement.label", "Page arrangement:")}
         data={[
-          { value: 'BY_ROWS', label: t('pageLayout.arrangement.byRows', 'By Rows') },
-          { value: 'BY_COLUMNS', label: t('pageLayout.arrangement.byColumns', 'By Columns') },
+          {
+            value: "BY_ROWS",
+            label: t("pageLayout.arrangement.byRows", "By Rows"),
+          },
+          {
+            value: "BY_COLUMNS",
+            label: t("pageLayout.arrangement.byColumns", "By Columns"),
+          },
         ]}
         value={String(parameters.arrangement)}
         onChange={(v) => {
           if (v === "BY_COLUMNS" || v === "BY_ROWS") {
-            onParameterChange('arrangement', v)
+            onParameterChange("arrangement", v);
           }
         }}
         disabled={disabled}
-        comboboxProps={{ withinPortal: true, zIndex: Z_INDEX_AUTOMATE_DROPDOWN }}
+        comboboxProps={{
+          withinPortal: true,
+          zIndex: Z_INDEX_AUTOMATE_DROPDOWN,
+        }}
       />
 
       <Select
-        label={t('pageLayout.readingDirection.label', 'Reading Direction:')}
+        label={t("pageLayout.readingDirection.label", "Reading Direction:")}
         data={[
-          { value: 'LTR', label: t('pageLayout.readingDirection.ltr', 'Left to Right') },
-          { value: 'RTL', label: t('pageLayout.readingDirection.rtl', 'Right to Left') },
+          {
+            value: "LTR",
+            label: t("pageLayout.readingDirection.ltr", "Left to Right"),
+          },
+          {
+            value: "RTL",
+            label: t("pageLayout.readingDirection.rtl", "Right to Left"),
+          },
         ]}
         value={String(parameters.readingDirection)}
         onChange={(v) => {
           if (v === "LTR" || v === "RTL") {
-            onParameterChange('readingDirection', v)
+            onParameterChange("readingDirection", v);
           }
         }}
         disabled={disabled}
-        comboboxProps={{ withinPortal: true, zIndex: Z_INDEX_AUTOMATE_DROPDOWN }}
+        comboboxProps={{
+          withinPortal: true,
+          zIndex: Z_INDEX_AUTOMATE_DROPDOWN,
+        }}
       />
     </Stack>
   );
 }
-
-
diff --git a/frontend/src/core/components/tools/pageLayout/PageLayoutMarginsBordersSettings.tsx b/frontend/src/core/components/tools/pageLayout/PageLayoutMarginsBordersSettings.tsx
index 1c6b22b3dd..05fc3786fd 100644
--- a/frontend/src/core/components/tools/pageLayout/PageLayoutMarginsBordersSettings.tsx
+++ b/frontend/src/core/components/tools/pageLayout/PageLayoutMarginsBordersSettings.tsx
@@ -1,6 +1,6 @@
-import { Divider, Stack, NumberInput, Switch } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { PageLayoutParameters } from '@app/hooks/tools/pageLayout/usePageLayoutParameters';
+import { Divider, Stack, NumberInput, Switch } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import { PageLayoutParameters } from "@app/hooks/tools/pageLayout/usePageLayoutParameters";
 
 export default function PageLayoutMarginsBordersSettings({
   parameters,
@@ -10,14 +10,20 @@ export default function PageLayoutMarginsBordersSettings({
   parameters: PageLayoutParameters;
   onParameterChange: <K extends keyof PageLayoutParameters>(
     key: K,
-    value: PageLayoutParameters[K]
+    value: PageLayoutParameters[K],
   ) => void;
   disabled?: boolean;
 }) {
   const { t } = useTranslation();
 
-  const cols = parameters.mode === "DEFAULT" ? Math.ceil(Math.sqrt(parameters.pagesPerSheet)) : parameters.cols;
-  const rows = parameters.mode === "DEFAULT" ? Math.ceil(parameters.pagesPerSheet / cols) : parameters.rows;
+  const cols =
+    parameters.mode === "DEFAULT"
+      ? Math.ceil(Math.sqrt(parameters.pagesPerSheet))
+      : parameters.cols;
+  const rows =
+    parameters.mode === "DEFAULT"
+      ? Math.ceil(parameters.pagesPerSheet / cols)
+      : parameters.rows;
 
   const left = parameters.leftMargin ?? 0;
   const right = parameters.rightMargin ?? 0;
@@ -25,13 +31,15 @@ export default function PageLayoutMarginsBordersSettings({
   const bottom = parameters.bottomMargin ?? 0;
   const inner = parameters.innerMargin ?? 0;
 
-  const pageWidth = parameters.orientation === "PORTRAIT"
-    ? 595.28 // A4 width in points
-    : 841.89 ; // A4 height in points
+  const pageWidth =
+    parameters.orientation === "PORTRAIT"
+      ? 595.28 // A4 width in points
+      : 841.89; // A4 height in points
 
-  const pageHeight = parameters.orientation === "PORTRAIT"
-    ? 841.89 // A4 height in points
-    : 595.28; // A4 width in points
+  const pageHeight =
+    parameters.orientation === "PORTRAIT"
+      ? 841.89 // A4 height in points
+      : 595.28; // A4 width in points
 
   const cellWidth = (pageWidth - left - right) / cols;
   const cellHeight = (pageHeight - top - bottom) / rows;
@@ -43,92 +51,100 @@ export default function PageLayoutMarginsBordersSettings({
   const invalidInnerSize = (innerWidth <= 0 || innerHeight <= 0) && inner > 0;
 
   const outerHeightError = invalidOuterHeight
-    ? t('pageLayout.error.outerVerticalMarginsTooLarge', 'Top/Bottom margins are too large for this page size.')
+    ? t(
+        "pageLayout.error.outerVerticalMarginsTooLarge",
+        "Top/Bottom margins are too large for this page size.",
+      )
     : undefined;
 
   const outerWidthError = invalidOuterWidth
-    ? t('pageLayout.error.outerHorizontalMarginsTooLarge', 'Left/Right margins are too large for this page size.')
+    ? t(
+        "pageLayout.error.outerHorizontalMarginsTooLarge",
+        "Left/Right margins are too large for this page size.",
+      )
     : undefined;
 
   const innerError = invalidInnerSize
-    ? t('pageLayout.error.innerMarginTooLarge', 'Inner margin is too large for the selected layout.')
+    ? t(
+        "pageLayout.error.innerMarginTooLarge",
+        "Inner margin is too large for the selected layout.",
+      )
     : undefined;
 
   return (
     <Stack gap="sm">
       <NumberInput
-        label={t('pageLayout.top', 'Top Margin')}
+        label={t("pageLayout.top", "Top Margin")}
         placeholder="Enter top margin"
         value={parameters.topMargin}
-        onChange={(v) => onParameterChange('topMargin', Number(v))}
+        onChange={(v) => onParameterChange("topMargin", Number(v))}
         min={0}
         disabled={disabled}
         style={{ flex: 1 }}
         error={outerHeightError}
       />
       <NumberInput
-        label={t('pageLayout.bottom', 'Bottom Margin')}
+        label={t("pageLayout.bottom", "Bottom Margin")}
         placeholder="Enter bottom margin"
         value={parameters.bottomMargin}
-        onChange={(v) => onParameterChange('bottomMargin', Number(v))}
+        onChange={(v) => onParameterChange("bottomMargin", Number(v))}
         min={0}
         disabled={disabled}
         style={{ flex: 1 }}
         error={outerHeightError}
       />
       <NumberInput
-        label={t('pageLayout.left', 'Left Margin')}
+        label={t("pageLayout.left", "Left Margin")}
         placeholder="Enter left margin"
         value={parameters.leftMargin}
-        onChange={(v) => onParameterChange('leftMargin', Number(v))}
+        onChange={(v) => onParameterChange("leftMargin", Number(v))}
         min={0}
         disabled={disabled}
         error={outerWidthError}
       />
       <NumberInput
-        label={t('pageLayout.right', 'Right Margin')}
+        label={t("pageLayout.right", "Right Margin")}
         placeholder="Enter right margin"
         value={parameters.rightMargin}
-        onChange={(v) => onParameterChange('rightMargin', Number(v))}
+        onChange={(v) => onParameterChange("rightMargin", Number(v))}
         min={0}
         disabled={disabled}
         style={{ flex: 1 }}
         error={outerWidthError}
       />
       <NumberInput
-        label={t('pageLayout.innerMargin', 'Inner Margin')}
+        label={t("pageLayout.innerMargin", "Inner Margin")}
         placeholder="Enter inner margin"
         value={parameters.innerMargin}
-        onChange={(v) => onParameterChange('innerMargin', Number(v))}
+        onChange={(v) => onParameterChange("innerMargin", Number(v))}
         min={0}
         disabled={disabled}
         style={{ flex: 1 }}
         error={innerError}
       />
 
-    <Divider />
+      <Divider />
 
-    <Switch
-      checked={parameters.addBorder}
-      onChange={(e) => onParameterChange('addBorder', e.currentTarget.checked)}
-      label={t('pageLayout.addBorder', 'Add Borders')}
-      disabled={disabled}
-    />
-
-    {parameters.addBorder && (
-      <NumberInput
-        label={t('pageLayout.borderWidth', 'Border Thickness')}
-        placeholder="Enter border thickness"
-        value={parameters.borderWidth}
-        onChange={(v) => onParameterChange('borderWidth', Number(v))}
-        min={1}
+      <Switch
+        checked={parameters.addBorder}
+        onChange={(e) =>
+          onParameterChange("addBorder", e.currentTarget.checked)
+        }
+        label={t("pageLayout.addBorder", "Add Borders")}
         disabled={disabled}
-        style={{ flex: 1 }}
       />
-    )}
 
+      {parameters.addBorder && (
+        <NumberInput
+          label={t("pageLayout.borderWidth", "Border Thickness")}
+          placeholder="Enter border thickness"
+          value={parameters.borderWidth}
+          onChange={(v) => onParameterChange("borderWidth", Number(v))}
+          min={1}
+          disabled={disabled}
+          style={{ flex: 1 }}
+        />
+      )}
     </Stack>
   );
 }
-
-
diff --git a/frontend/src/core/components/tools/pageLayout/PageLayoutPreview.tsx b/frontend/src/core/components/tools/pageLayout/PageLayoutPreview.tsx
index 5d35c9c379..042a3a9862 100644
--- a/frontend/src/core/components/tools/pageLayout/PageLayoutPreview.tsx
+++ b/frontend/src/core/components/tools/pageLayout/PageLayoutPreview.tsx
@@ -1,18 +1,15 @@
-import { PageLayoutParameters } from '@app/hooks/tools/pageLayout/usePageLayoutParameters';
-import LayoutPreview from '@app/components/tools/pageLayout/LayoutPreview';
-import { Stack } from '@mantine/core';
+import { PageLayoutParameters } from "@app/hooks/tools/pageLayout/usePageLayoutParameters";
+import LayoutPreview from "@app/components/tools/pageLayout/LayoutPreview";
+import { Stack } from "@mantine/core";
 
 export default function PageLayoutPreview({
   parameters,
 }: {
   parameters: PageLayoutParameters;
 }) {
-
   return (
     <Stack gap="sm">
       <LayoutPreview parameters={parameters} />
     </Stack>
   );
 }
-
-
diff --git a/frontend/src/core/components/tools/pageLayout/PageLayoutSettings.tsx b/frontend/src/core/components/tools/pageLayout/PageLayoutSettings.tsx
index 738f863298..1e0711b716 100644
--- a/frontend/src/core/components/tools/pageLayout/PageLayoutSettings.tsx
+++ b/frontend/src/core/components/tools/pageLayout/PageLayoutSettings.tsx
@@ -1,9 +1,9 @@
-import { Select, Stack, NumberInput } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { PageLayoutParameters } from '@app/hooks/tools/pageLayout/usePageLayoutParameters';
-import { getPagesPerSheetOptions } from '@app/components/tools/pageLayout/constants';
+import { Select, Stack, NumberInput } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import { PageLayoutParameters } from "@app/hooks/tools/pageLayout/usePageLayoutParameters";
+import { getPagesPerSheetOptions } from "@app/components/tools/pageLayout/constants";
 import { Z_INDEX_AUTOMATE_DROPDOWN } from "@app/styles/zIndex";
-import ButtonSelector from '@app/components/shared/ButtonSelector';
+import ButtonSelector from "@app/components/shared/ButtonSelector";
 
 export default function PageLayoutSettings({
   parameters,
@@ -13,83 +13,92 @@ export default function PageLayoutSettings({
   parameters: PageLayoutParameters;
   onParameterChange: <K extends keyof PageLayoutParameters>(
     key: K,
-    value: PageLayoutParameters[K]
+    value: PageLayoutParameters[K],
   ) => void;
   disabled?: boolean;
 }) {
   const { t } = useTranslation();
 
   const pagesPerSheetOptions = getPagesPerSheetOptions(t);
-  const selectedPagesPerSheetOption = pagesPerSheetOptions.find((o) => o.value === parameters.pagesPerSheet) || pagesPerSheetOptions[0];
-
+  const selectedPagesPerSheetOption =
+    pagesPerSheetOptions.find((o) => o.value === parameters.pagesPerSheet) ||
+    pagesPerSheetOptions[0];
 
   return (
     <Stack gap="sm">
       <ButtonSelector
-        label={t('pageLayout.mode.label', 'Mode:')}
+        label={t("pageLayout.mode.label", "Mode:")}
         options={[
-          {value: "DEFAULT", label: t('pageLayout.mode.default', 'Default')},
-          {value: "CUSTOM", label: t('pageLayout.mode.custom', 'Custom')}
+          { value: "DEFAULT", label: t("pageLayout.mode.default", "Default") },
+          { value: "CUSTOM", label: t("pageLayout.mode.custom", "Custom") },
         ]}
         value={String(parameters.mode)}
         onChange={(v) => {
-          if (v ===  "CUSTOM" || v === "DEFAULT") {
-            onParameterChange('mode', v)
+          if (v === "CUSTOM" || v === "DEFAULT") {
+            onParameterChange("mode", v);
           }
         }}
         disabled={disabled}
       />
 
-      {parameters.mode === "DEFAULT" && <>
-        <Select
-          label={t('pageLayout.pagesPerSheet', 'Pages per sheet:')}
-          data={pagesPerSheetOptions.map(o => ({ value: String(o.value), label: o.label }))}
-          value={String(parameters.pagesPerSheet)}
-          onChange={(v) => onParameterChange('pagesPerSheet', Number(v))}
-          allowDeselect={false}
-          disabled={disabled}
-          comboboxProps={{ withinPortal: true, zIndex: Z_INDEX_AUTOMATE_DROPDOWN }}
-        />
-        {selectedPagesPerSheetOption && (
-          <div
-            style={{
-              backgroundColor: 'var(--information-text-bg)',
-              color: 'var(--information-text-color)',
-              padding: '8px 12px',
-              borderRadius: '8px',
-              marginTop: '4px',
-              fontSize: '0.75rem',
-              textAlign: 'center',
+      {parameters.mode === "DEFAULT" && (
+        <>
+          <Select
+            label={t("pageLayout.pagesPerSheet", "Pages per sheet:")}
+            data={pagesPerSheetOptions.map((o) => ({
+              value: String(o.value),
+              label: o.label,
+            }))}
+            value={String(parameters.pagesPerSheet)}
+            onChange={(v) => onParameterChange("pagesPerSheet", Number(v))}
+            allowDeselect={false}
+            disabled={disabled}
+            comboboxProps={{
+              withinPortal: true,
+              zIndex: Z_INDEX_AUTOMATE_DROPDOWN,
             }}
-          >
-            {selectedPagesPerSheetOption.description}
-          </div>
-        )}
-      </>}
+          />
+          {selectedPagesPerSheetOption && (
+            <div
+              style={{
+                backgroundColor: "var(--information-text-bg)",
+                color: "var(--information-text-color)",
+                padding: "8px 12px",
+                borderRadius: "8px",
+                marginTop: "4px",
+                fontSize: "0.75rem",
+                textAlign: "center",
+              }}
+            >
+              {selectedPagesPerSheetOption.description}
+            </div>
+          )}
+        </>
+      )}
 
-      {parameters.mode === "CUSTOM" && <>
-        <NumberInput
-          label={t('pageLayout.rows', 'Rows')}
-          placeholder="Enter rows"
-          value={parameters.rows}
-          onChange={(v) => onParameterChange('rows', Number(v))}
-          min={1}
-          disabled={disabled}
-          style={{ flex: 1 }}
-        />
+      {parameters.mode === "CUSTOM" && (
+        <>
+          <NumberInput
+            label={t("pageLayout.rows", "Rows")}
+            placeholder="Enter rows"
+            value={parameters.rows}
+            onChange={(v) => onParameterChange("rows", Number(v))}
+            min={1}
+            disabled={disabled}
+            style={{ flex: 1 }}
+          />
 
-        <NumberInput
-          label={t('pageLayout.cols', 'Columns')}
-          placeholder="Enter columns"
-          value={parameters.cols}
-          onChange={(v) => onParameterChange('cols', Number(v))}
-          min={1}
-          disabled={disabled}
-          style={{ flex: 1 }}
-        />
-      </>}
+          <NumberInput
+            label={t("pageLayout.cols", "Columns")}
+            placeholder="Enter columns"
+            value={parameters.cols}
+            onChange={(v) => onParameterChange("cols", Number(v))}
+            min={1}
+            disabled={disabled}
+            style={{ flex: 1 }}
+          />
+        </>
+      )}
     </Stack>
   );
 }
-
-
diff --git a/frontend/src/core/components/tools/pageLayout/constants.ts b/frontend/src/core/components/tools/pageLayout/constants.ts
index c6114b6f66..7d63a905b7 100644
--- a/frontend/src/core/components/tools/pageLayout/constants.ts
+++ b/frontend/src/core/components/tools/pageLayout/constants.ts
@@ -1,4 +1,4 @@
-import { TFunction } from 'i18next';
+import { TFunction } from "i18next";
 
 export type PagesPerSheetOption = {
   value: number;
@@ -6,27 +6,39 @@ export type PagesPerSheetOption = {
   description: string;
 };
 
-export const getPagesPerSheetOptions = (t: TFunction): PagesPerSheetOption[] => [
+export const getPagesPerSheetOptions = (
+  t: TFunction,
+): PagesPerSheetOption[] => [
   {
     value: 2,
-    label: '2',
-    description: t('pageLayout.desc.2', 'Place 2 pages side-by-side on a single sheet.')
+    label: "2",
+    description: t(
+      "pageLayout.desc.2",
+      "Place 2 pages side-by-side on a single sheet.",
+    ),
   },
   {
     value: 4,
-    label: '4',
-    description: t('pageLayout.desc.4', 'Place 4 pages on a single sheet (2 × 2 grid).')
+    label: "4",
+    description: t(
+      "pageLayout.desc.4",
+      "Place 4 pages on a single sheet (2 × 2 grid).",
+    ),
   },
   {
     value: 9,
-    label: '9',
-    description: t('pageLayout.desc.9', 'Place 9 pages on a single sheet (3 × 3 grid).')
+    label: "9",
+    description: t(
+      "pageLayout.desc.9",
+      "Place 9 pages on a single sheet (3 × 3 grid).",
+    ),
   },
   {
     value: 16,
-    label: '16',
-    description: t('pageLayout.desc.16', 'Place 16 pages on a single sheet (4 × 4 grid).')
+    label: "16",
+    description: t(
+      "pageLayout.desc.16",
+      "Place 16 pages on a single sheet (4 × 4 grid).",
+    ),
   },
 ];
-
-
diff --git a/frontend/src/core/components/tools/pageLayout/utils/computeBoxes.ts b/frontend/src/core/components/tools/pageLayout/utils/computeBoxes.ts
index 2d762644f1..ca1725b4c7 100644
--- a/frontend/src/core/components/tools/pageLayout/utils/computeBoxes.ts
+++ b/frontend/src/core/components/tools/pageLayout/utils/computeBoxes.ts
@@ -6,22 +6,31 @@ export type Box = {
   width: number;
   height: number;
   label: number;
-}
+};
 
 export type Sheet = {
   x: number;
   y: number;
   width: number;
   height: number;
-}
-
-export function computeBoxes(sheet: Sheet, parameters: PageLayoutParameters): Box[] {
+};
 
+export function computeBoxes(
+  sheet: Sheet,
+  parameters: PageLayoutParameters,
+): Box[] {
   const { mode, arrangement, readingDirection } = parameters;
 
-  const cols = mode === "DEFAULT" ? Math.ceil(Math.sqrt(parameters.pagesPerSheet)) : parameters.cols;
-  const rows = mode === "DEFAULT" ? Math.ceil(parameters.pagesPerSheet / cols) : parameters.rows;
-  const pagesPerSheet = mode === "DEFAULT" ? parameters.pagesPerSheet : cols * rows;
+  const cols =
+    mode === "DEFAULT"
+      ? Math.ceil(Math.sqrt(parameters.pagesPerSheet))
+      : parameters.cols;
+  const rows =
+    mode === "DEFAULT"
+      ? Math.ceil(parameters.pagesPerSheet / cols)
+      : parameters.rows;
+  const pagesPerSheet =
+    mode === "DEFAULT" ? parameters.pagesPerSheet : cols * rows;
 
   const boxes: Box[] = [];
 
@@ -31,19 +40,18 @@ export function computeBoxes(sheet: Sheet, parameters: PageLayoutParameters): Bo
   const margin = Math.min(cellWidth, cellHeight) * 0.1;
 
   for (let i = 0; i < pagesPerSheet; i++) {
-
     let rowIndex, colIndex;
 
-    if ( arrangement === "BY_ROWS" ) {
+    if (arrangement === "BY_ROWS") {
       rowIndex = Math.floor(i / cols);
-      if ( readingDirection === "LTR" ) {
+      if (readingDirection === "LTR") {
         colIndex = i % cols;
       } else {
         colIndex = cols - 1 - (i % cols);
       }
     } else {
       rowIndex = i % rows;
-      if ( readingDirection === "LTR" ) {
+      if (readingDirection === "LTR") {
         colIndex = Math.floor(i / rows);
       } else {
         colIndex = cols - 1 - Math.floor(i / rows);
@@ -54,7 +62,7 @@ export function computeBoxes(sheet: Sheet, parameters: PageLayoutParameters): Bo
       y: sheet.y + rowIndex * cellHeight + margin,
       width: cellWidth - margin * 2,
       height: cellHeight - margin * 2,
-      label: i + 1
+      label: i + 1,
     });
   }
 
diff --git a/frontend/src/core/components/tools/pdfTextEditor/FontStatusPanel.tsx b/frontend/src/core/components/tools/pdfTextEditor/FontStatusPanel.tsx
index 2c600c2319..1336997c6f 100644
--- a/frontend/src/core/components/tools/pdfTextEditor/FontStatusPanel.tsx
+++ b/frontend/src/core/components/tools/pdfTextEditor/FontStatusPanel.tsx
@@ -1,4 +1,4 @@
-import React, { useMemo, useState } from 'react';
+import React, { useMemo, useState } from "react";
 import {
   Badge,
   Box,
@@ -12,26 +12,26 @@ import {
   Stack,
   Text,
   Tooltip,
-} from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import CheckCircleIcon from '@mui/icons-material/CheckCircle';
-import WarningIcon from '@mui/icons-material/Warning';
-import ErrorIcon from '@mui/icons-material/Error';
-import InfoIcon from '@mui/icons-material/Info';
-import FontDownloadIcon from '@mui/icons-material/FontDownload';
-import ExpandMoreIcon from '@mui/icons-material/ExpandMore';
-import ExpandLessIcon from '@mui/icons-material/ExpandLess';
+} from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import CheckCircleIcon from "@mui/icons-material/CheckCircle";
+import WarningIcon from "@mui/icons-material/Warning";
+import ErrorIcon from "@mui/icons-material/Error";
+import InfoIcon from "@mui/icons-material/Info";
+import FontDownloadIcon from "@mui/icons-material/FontDownload";
+import ExpandMoreIcon from "@mui/icons-material/ExpandMore";
+import ExpandLessIcon from "@mui/icons-material/ExpandLess";
 
-import { PdfJsonDocument } from '@app/tools/pdfTextEditor/pdfTextEditorTypes';
+import { PdfJsonDocument } from "@app/tools/pdfTextEditor/pdfTextEditorTypes";
 import {
   analyzeDocumentFonts,
   DocumentFontAnalysis,
   FontAnalysis,
   getFontStatusColor,
   getFontStatusDescription,
-} from '@app/tools/pdfTextEditor/fontAnalysis';
-import LocalIcon from '@app/components/shared/LocalIcon';
-import { Tooltip as CustomTooltip } from '@app/components/shared/Tooltip';
+} from "@app/tools/pdfTextEditor/fontAnalysis";
+import LocalIcon from "@app/components/shared/LocalIcon";
+import { Tooltip as CustomTooltip } from "@app/components/shared/Tooltip";
 
 interface FontStatusPanelProps {
   document: PdfJsonDocument | null;
@@ -46,13 +46,13 @@ const FontStatusBadge = ({ analysis }: { analysis: FontAnalysis }) => {
 
   const icon = useMemo(() => {
     switch (analysis.status) {
-      case 'perfect':
+      case "perfect":
         return <CheckCircleIcon sx={{ fontSize: 14 }} />;
-      case 'embedded-subset':
+      case "embedded-subset":
         return <InfoIcon sx={{ fontSize: 14 }} />;
-      case 'system-fallback':
+      case "system-fallback":
         return <WarningIcon sx={{ fontSize: 14 }} />;
-      case 'missing':
+      case "missing":
         return <ErrorIcon sx={{ fontSize: 14 }} />;
       default:
         return <InfoIcon sx={{ fontSize: 14 }} />;
@@ -66,9 +66,9 @@ const FontStatusBadge = ({ analysis }: { analysis: FontAnalysis }) => {
         color={color}
         variant="light"
         leftSection={icon}
-        style={{ cursor: 'help' }}
+        style={{ cursor: "help" }}
       >
-        {analysis.status.replace('-', ' ')}
+        {analysis.status.replace("-", " ")}
       </Badge>
     </Tooltip>
   );
@@ -79,7 +79,13 @@ const FontDetailItem = ({ analysis }: { analysis: FontAnalysis }) => {
   const [expanded, setExpanded] = useState(false);
 
   return (
-    <Paper withBorder px="sm" py="md" style={{ cursor: 'pointer' }} onClick={() => setExpanded(!expanded)}>
+    <Paper
+      withBorder
+      px="sm"
+      py="md"
+      style={{ cursor: "pointer" }}
+      onClick={() => setExpanded(!expanded)}
+    >
       <Stack gap={4}>
         <Flex align="center" justify="space-between" wrap="nowrap">
           <Group gap={4} wrap="nowrap" style={{ flex: 1, minWidth: 0 }}>
@@ -89,19 +95,33 @@ const FontDetailItem = ({ analysis }: { analysis: FontAnalysis }) => {
               content={analysis.baseName}
               position="top"
             >
-              <Text size="xs" fw={500} lineClamp={1} style={{ flex: 1, minWidth: 0 }}>
+              <Text
+                size="xs"
+                fw={500}
+                lineClamp={1}
+                style={{ flex: 1, minWidth: 0 }}
+              >
                 {analysis.baseName}
               </Text>
             </CustomTooltip>
             {analysis.isSubset && (
-              <Badge size="xs" color="gray" variant="outline" style={{ flexShrink: 0 }}>
+              <Badge
+                size="xs"
+                color="gray"
+                variant="outline"
+                style={{ flexShrink: 0 }}
+              >
                 subset
               </Badge>
             )}
           </Group>
           <Group gap={4} wrap="nowrap" style={{ flexShrink: 0 }}>
             <FontStatusBadge analysis={analysis} />
-            {expanded ? <ExpandLessIcon sx={{ fontSize: 16 }} /> : <ExpandMoreIcon sx={{ fontSize: 16 }} />}
+            {expanded ? (
+              <ExpandLessIcon sx={{ fontSize: 16 }} />
+            ) : (
+              <ExpandMoreIcon sx={{ fontSize: 16 }} />
+            )}
           </Group>
         </Flex>
 
@@ -110,29 +130,35 @@ const FontDetailItem = ({ analysis }: { analysis: FontAnalysis }) => {
             {/* Font Details */}
             <Box>
               <Text size="xs" c="dimmed" mb={2}>
-                {t('pdfTextEditor.fontAnalysis.details', 'Font Details')}:
+                {t("pdfTextEditor.fontAnalysis.details", "Font Details")}:
               </Text>
               <Stack gap={2}>
                 <Group gap={4}>
                   <Text size="xs" c="dimmed">
-                    {t('pdfTextEditor.fontAnalysis.embedded', 'Embedded')}:
+                    {t("pdfTextEditor.fontAnalysis.embedded", "Embedded")}:
                   </Text>
-                  <Code style={{ fontSize: '0.65rem', padding: '0 4px' }}>{analysis.embedded ? 'Yes' : 'No'}</Code>
+                  <Code style={{ fontSize: "0.65rem", padding: "0 4px" }}>
+                    {analysis.embedded ? "Yes" : "No"}
+                  </Code>
                 </Group>
                 {analysis.subtype && (
                   <Group gap={4}>
                     <Text size="xs" c="dimmed">
-                      {t('pdfTextEditor.fontAnalysis.type', 'Type')}:
+                      {t("pdfTextEditor.fontAnalysis.type", "Type")}:
                     </Text>
-                    <Code style={{ fontSize: '0.65rem', padding: '0 4px' }}>{analysis.subtype}</Code>
+                    <Code style={{ fontSize: "0.65rem", padding: "0 4px" }}>
+                      {analysis.subtype}
+                    </Code>
                   </Group>
                 )}
                 {analysis.webFormat && (
                   <Group gap={4}>
                     <Text size="xs" c="dimmed">
-                      {t('pdfTextEditor.fontAnalysis.webFormat', 'Web Format')}:
+                      {t("pdfTextEditor.fontAnalysis.webFormat", "Web Format")}:
                     </Text>
-                    <Code style={{ fontSize: '0.65rem', padding: '0 4px' }}>{analysis.webFormat}</Code>
+                    <Code style={{ fontSize: "0.65rem", padding: "0 4px" }}>
+                      {analysis.webFormat}
+                    </Code>
                   </Group>
                 )}
               </Stack>
@@ -142,7 +168,7 @@ const FontDetailItem = ({ analysis }: { analysis: FontAnalysis }) => {
             {analysis.warnings.length > 0 && (
               <Box>
                 <Text size="xs" c="orange" fw={500}>
-                  {t('pdfTextEditor.fontAnalysis.warnings', 'Warnings')}:
+                  {t("pdfTextEditor.fontAnalysis.warnings", "Warnings")}:
                 </Text>
                 <List size="xs" spacing={2} withPadding>
                   {analysis.warnings.map((warning, index) => (
@@ -158,7 +184,7 @@ const FontDetailItem = ({ analysis }: { analysis: FontAnalysis }) => {
             {analysis.suggestions.length > 0 && (
               <Box>
                 <Text size="xs" c="blue" fw={500}>
-                  {t('pdfTextEditor.fontAnalysis.suggestions', 'Notes')}:
+                  {t("pdfTextEditor.fontAnalysis.suggestions", "Notes")}:
                 </Text>
                 <List size="xs" spacing={2} withPadding>
                   {analysis.suggestions.map((suggestion, index) => (
@@ -180,13 +206,13 @@ const FontStatusPanel: React.FC<FontStatusPanelProps> = ({
   document,
   pageIndex,
   isCollapsed = false,
-  onCollapsedChange
+  onCollapsedChange,
 }) => {
   const { t } = useTranslation();
 
   const fontAnalysis: DocumentFontAnalysis = useMemo(
     () => analyzeDocumentFonts(document, pageIndex),
-    [document, pageIndex]
+    [document, pageIndex],
   );
 
   const { canReproducePerfectly, hasWarnings, summary, fonts } = fontAnalysis;
@@ -196,28 +222,33 @@ const FontStatusPanel: React.FC<FontStatusPanelProps> = ({
     return null;
   }
 
-  const statusColor = canReproducePerfectly ? 'green' : hasWarnings ? 'yellow' : 'blue';
+  const statusColor = canReproducePerfectly
+    ? "green"
+    : hasWarnings
+      ? "yellow"
+      : "blue";
 
-  const pageLabel = pageIndex !== undefined
-    ? t('pdfTextEditor.fontAnalysis.currentPageFonts', 'Fonts on this page')
-    : t('pdfTextEditor.fontAnalysis.allFonts', 'All fonts');
+  const pageLabel =
+    pageIndex !== undefined
+      ? t("pdfTextEditor.fontAnalysis.currentPageFonts", "Fonts on this page")
+      : t("pdfTextEditor.fontAnalysis.allFonts", "All fonts");
 
   return (
     <div>
       <div
         style={{
-          padding: '0.5rem',
+          padding: "0.5rem",
           opacity: isCollapsed ? 0.8 : 1,
-          color: isCollapsed ? 'var(--mantine-color-dimmed)' : 'inherit',
-          transition: 'opacity 0.2s ease, color 0.2s ease'
+          color: isCollapsed ? "var(--mantine-color-dimmed)" : "inherit",
+          transition: "opacity 0.2s ease, color 0.2s ease",
         }}
       >
         {/* Header - matches ToolStep style */}
         <Flex
           align="center"
           justify="space-between"
-          mb={isCollapsed ? 0 : 'sm'}
-          style={{ cursor: 'pointer' }}
+          mb={isCollapsed ? 0 : "sm"}
+          style={{ cursor: "pointer" }}
           onClick={() => onCollapsedChange?.(!isCollapsed)}
         >
           <Flex align="center" gap="xs">
@@ -230,13 +261,23 @@ const FontStatusPanel: React.FC<FontStatusPanelProps> = ({
           </Flex>
 
           {isCollapsed ? (
-            <LocalIcon icon="chevron-right-rounded" width="1.2rem" height="1.2rem" style={{
-              color: 'var(--mantine-color-dimmed)'
-            }} />
+            <LocalIcon
+              icon="chevron-right-rounded"
+              width="1.2rem"
+              height="1.2rem"
+              style={{
+                color: "var(--mantine-color-dimmed)",
+              }}
+            />
           ) : (
-            <LocalIcon icon="expand-more-rounded" width="1.2rem" height="1.2rem" style={{
-              color: 'var(--mantine-color-dimmed)'
-            }} />
+            <LocalIcon
+              icon="expand-more-rounded"
+              width="1.2rem"
+              height="1.2rem"
+              style={{
+                color: "var(--mantine-color-dimmed)",
+              }}
+            />
           )}
         </Flex>
 
@@ -247,40 +288,64 @@ const FontStatusPanel: React.FC<FontStatusPanelProps> = ({
             <Text size="xs" c="dimmed">
               {canReproducePerfectly
                 ? t(
-                    'pdfTextEditor.fontAnalysis.perfectMessage',
-                    'All fonts can be reproduced perfectly.'
+                    "pdfTextEditor.fontAnalysis.perfectMessage",
+                    "All fonts can be reproduced perfectly.",
                   )
                 : hasWarnings
-                ? t(
-                    'pdfTextEditor.fontAnalysis.warningMessage',
-                    'Some fonts may not render correctly.'
-                  )
-                : t(
-                    'pdfTextEditor.fontAnalysis.infoMessage',
-                    'Font reproduction information available.'
-                  )}
+                  ? t(
+                      "pdfTextEditor.fontAnalysis.warningMessage",
+                      "Some fonts may not render correctly.",
+                    )
+                  : t(
+                      "pdfTextEditor.fontAnalysis.infoMessage",
+                      "Font reproduction information available.",
+                    )}
             </Text>
 
             {/* Summary Statistics */}
             <Group gap={4} wrap="wrap">
               {summary.perfect > 0 && (
-                <Badge size="xs" color="green" variant="light" leftSection={<CheckCircleIcon sx={{ fontSize: 12 }} />}>
-                  {summary.perfect} {t('pdfTextEditor.fontAnalysis.perfect', 'perfect')}
+                <Badge
+                  size="xs"
+                  color="green"
+                  variant="light"
+                  leftSection={<CheckCircleIcon sx={{ fontSize: 12 }} />}
+                >
+                  {summary.perfect}{" "}
+                  {t("pdfTextEditor.fontAnalysis.perfect", "perfect")}
                 </Badge>
               )}
               {summary.embeddedSubset > 0 && (
-                <Badge size="xs" color="blue" variant="light" leftSection={<InfoIcon sx={{ fontSize: 12 }} />}>
-                  {summary.embeddedSubset} {t('pdfTextEditor.fontAnalysis.subset', 'subset')}
+                <Badge
+                  size="xs"
+                  color="blue"
+                  variant="light"
+                  leftSection={<InfoIcon sx={{ fontSize: 12 }} />}
+                >
+                  {summary.embeddedSubset}{" "}
+                  {t("pdfTextEditor.fontAnalysis.subset", "subset")}
                 </Badge>
               )}
               {summary.systemFallback > 0 && (
-                <Badge size="xs" color="yellow" variant="light" leftSection={<WarningIcon sx={{ fontSize: 12 }} />}>
-                  {summary.systemFallback} {t('pdfTextEditor.fontAnalysis.fallback', 'fallback')}
+                <Badge
+                  size="xs"
+                  color="yellow"
+                  variant="light"
+                  leftSection={<WarningIcon sx={{ fontSize: 12 }} />}
+                >
+                  {summary.systemFallback}{" "}
+                  {t("pdfTextEditor.fontAnalysis.fallback", "fallback")}
                 </Badge>
               )}
               {summary.missing > 0 && (
-                <Badge size="xs" color="red" variant="light" leftSection={<ErrorIcon sx={{ fontSize: 12 }} />}>
-                  {summary.missing} {t('pdfTextEditor.fontAnalysis.missing', 'missing')}
+                <Badge
+                  size="xs"
+                  color="red"
+                  variant="light"
+                  leftSection={<ErrorIcon sx={{ fontSize: 12 }} />}
+                >
+                  {summary.missing}{" "}
+                  {t("pdfTextEditor.fontAnalysis.missing", "missing")}
                 </Badge>
               )}
             </Group>
@@ -288,13 +353,18 @@ const FontStatusPanel: React.FC<FontStatusPanelProps> = ({
             {/* Font List */}
             <Stack gap={4} mt="xs">
               {fonts.map((font, index) => (
-                <FontDetailItem key={`${font.fontId}-${index}`} analysis={font} />
+                <FontDetailItem
+                  key={`${font.fontId}-${index}`}
+                  analysis={font}
+                />
               ))}
             </Stack>
           </Stack>
         )}
       </div>
-      <Divider style={{ color: '#E2E8F0', marginLeft: '1rem', marginRight: '-0.5rem' }} />
+      <Divider
+        style={{ color: "#E2E8F0", marginLeft: "1rem", marginRight: "-0.5rem" }}
+      />
     </div>
   );
 };
diff --git a/frontend/src/core/components/tools/pdfTextEditor/PdfTextEditorSidebar.tsx b/frontend/src/core/components/tools/pdfTextEditor/PdfTextEditorSidebar.tsx
index 6ad1fec331..168d5ffced 100644
--- a/frontend/src/core/components/tools/pdfTextEditor/PdfTextEditorSidebar.tsx
+++ b/frontend/src/core/components/tools/pdfTextEditor/PdfTextEditorSidebar.tsx
@@ -1,4 +1,4 @@
-import React, { useCallback, useMemo, useState } from 'react';
+import React, { useCallback, useMemo, useState } from "react";
 import {
   ActionIcon,
   Badge,
@@ -13,22 +13,25 @@ import {
   Stack,
   Switch,
   Text,
-} from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import AutorenewIcon from '@mui/icons-material/Autorenew';
-import InfoOutlinedIcon from '@mui/icons-material/InfoOutlined';
-import MoreHorizIcon from '@mui/icons-material/MoreHoriz';
-import FileDownloadIcon from '@mui/icons-material/FileDownloadOutlined';
+} from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import AutorenewIcon from "@mui/icons-material/Autorenew";
+import InfoOutlinedIcon from "@mui/icons-material/InfoOutlined";
+import MoreHorizIcon from "@mui/icons-material/MoreHoriz";
+import FileDownloadIcon from "@mui/icons-material/FileDownloadOutlined";
 
-import { PdfTextEditorViewData, TextGroup } from '@app/tools/pdfTextEditor/pdfTextEditorTypes';
-import { pageDimensions } from '@app/tools/pdfTextEditor/pdfTextEditorUtils';
-import FontStatusPanel from '@app/components/tools/pdfTextEditor/FontStatusPanel';
-import ToolStep from '@app/components/tools/shared/ToolStep';
-import { usePdfTextEditorTips } from '@app/components/tooltips/usePdfTextEditorTips';
-import { Tooltip } from '@app/components/shared/Tooltip';
-import LocalIcon from '@app/components/shared/LocalIcon';
+import {
+  PdfTextEditorViewData,
+  TextGroup,
+} from "@app/tools/pdfTextEditor/pdfTextEditorTypes";
+import { pageDimensions } from "@app/tools/pdfTextEditor/pdfTextEditorUtils";
+import FontStatusPanel from "@app/components/tools/pdfTextEditor/FontStatusPanel";
+import ToolStep from "@app/components/tools/shared/ToolStep";
+import { usePdfTextEditorTips } from "@app/components/tooltips/usePdfTextEditorTips";
+import { Tooltip } from "@app/components/shared/Tooltip";
+import LocalIcon from "@app/components/shared/LocalIcon";
 
-type GroupingMode = 'auto' | 'paragraph' | 'singleLine';
+type GroupingMode = "auto" | "paragraph" | "singleLine";
 
 interface PdfTextEditorSidebarProps {
   data: PdfTextEditorViewData;
@@ -46,10 +49,12 @@ const analyzePageContentType = (
   const widths = groups.map((g) => Math.max(g.bounds.right - g.bounds.left, 1));
   const avgWidth = widths.reduce((sum, w) => sum + w, 0) / widths.length;
   const stdDev = Math.sqrt(
-    widths.reduce((sum, w) => sum + Math.pow(w - avgWidth, 2), 0) / widths.length,
+    widths.reduce((sum, w) => sum + Math.pow(w - avgWidth, 2), 0) /
+      widths.length,
   );
   const coefficientOfVariation = avgWidth > 0 ? stdDev / avgWidth : 0;
-  const fullWidthRatio = widths.filter((w) => w > pageWidth * 0.65).length / widths.length;
+  const fullWidthRatio =
+    widths.filter((w) => w > pageWidth * 0.65).length / widths.length;
 
   const criterion1 = groups.length >= 3;
   const criterion2 = avgWidth > pageWidth * 0.3;
@@ -60,8 +65,10 @@ const analyzePageContentType = (
 
 const PdfTextEditorSidebar = ({ data }: PdfTextEditorSidebarProps) => {
   const { t } = useTranslation();
-  const [pendingModeChange, setPendingModeChange] = useState<GroupingMode | null>(null);
-  const [advancedSettingsCollapsed, setAdvancedSettingsCollapsed] = useState(false);
+  const [pendingModeChange, setPendingModeChange] =
+    useState<GroupingMode | null>(null);
+  const [advancedSettingsCollapsed, setAdvancedSettingsCollapsed] =
+    useState(false);
   const [fontsCollapsed, setFontsCollapsed] = useState(false);
   const pdfTextEditorTips = usePdfTextEditorTips();
 
@@ -97,13 +104,16 @@ const PdfTextEditorSidebar = ({ data }: PdfTextEditorSidebarProps) => {
     return analyzePageContentType(pageGroups, pageWidth);
   }, [pageGroups, pageWidth]);
 
-  const handleModeChangeRequest = useCallback((newMode: GroupingMode) => {
-    if (hasChanges && newMode !== externalGroupingMode) {
-      setPendingModeChange(newMode);
-    } else {
-      onGroupingModeChange(newMode);
-    }
-  }, [hasChanges, externalGroupingMode, onGroupingModeChange]);
+  const handleModeChangeRequest = useCallback(
+    (newMode: GroupingMode) => {
+      if (hasChanges && newMode !== externalGroupingMode) {
+        setPendingModeChange(newMode);
+      } else {
+        onGroupingModeChange(newMode);
+      }
+    },
+    [hasChanges, externalGroupingMode, onGroupingModeChange],
+  );
 
   const handleConfirmModeChange = useCallback(() => {
     if (pendingModeChange) {
@@ -118,7 +128,7 @@ const PdfTextEditorSidebar = ({ data }: PdfTextEditorSidebarProps) => {
 
   return (
     <>
-      <Stack style={{ height: '100%', display: 'flex' }} gap={0}>
+      <Stack style={{ height: "100%", display: "flex" }} gap={0}>
         <ScrollArea style={{ flex: 1 }} offsetScrollbars>
           <Stack gap="md">
             <Stack gap="xs" pl="md" pr={0} pt="md">
@@ -126,10 +136,10 @@ const PdfTextEditorSidebar = ({ data }: PdfTextEditorSidebarProps) => {
               <Flex align="center" justify="space-between">
                 <Flex align="center" gap="xs">
                   <Text fw={600} size="sm">
-                    {t('pdfTextEditor.title', 'PDF Text Editor')}
+                    {t("pdfTextEditor.title", "PDF Text Editor")}
                   </Text>
                   <Badge size="xs" variant="light" color="orange">
-                    {t('toolPanel.alpha', 'Alpha')}
+                    {t("toolPanel.alpha", "Alpha")}
                   </Badge>
                 </Flex>
                 <Tooltip
@@ -139,47 +149,72 @@ const PdfTextEditorSidebar = ({ data }: PdfTextEditorSidebarProps) => {
                   pinOnClick
                 >
                   <ActionIcon variant="subtle" color="blue" size="sm">
-                    <LocalIcon icon="info-outline-rounded" width="1.25rem" height="1.25rem" />
+                    <LocalIcon
+                      icon="info-outline-rounded"
+                      width="1.25rem"
+                      height="1.25rem"
+                    />
                   </ActionIcon>
                 </Tooltip>
               </Flex>
 
               {fileName && (
                 <Text size="sm" c="dimmed">
-                  {t('pdfTextEditor.currentFile', 'Current file: {{name}}', { name: fileName })}
+                  {t("pdfTextEditor.currentFile", "Current file: {{name}}", {
+                    name: fileName,
+                  })}
                 </Text>
               )}
             </Stack>
 
             <ToolStep
-              title={t('pdfTextEditor.options.advanced.title', 'Advanced Settings')}
+              title={t(
+                "pdfTextEditor.options.advanced.title",
+                "Advanced Settings",
+              )}
               isCollapsed={advancedSettingsCollapsed}
-              onCollapsedClick={() => setAdvancedSettingsCollapsed(!advancedSettingsCollapsed)}
+              onCollapsedClick={() =>
+                setAdvancedSettingsCollapsed(!advancedSettingsCollapsed)
+              }
             >
               <Stack gap="md">
                 <Divider />
                 <Group justify="space-between" align="center">
-                  <Group gap={4} align="center" style={{ flex: 1, minWidth: 0 }}>
+                  <Group
+                    gap={4}
+                    align="center"
+                    style={{ flex: 1, minWidth: 0 }}
+                  >
                     <Tooltip
                       sidebarTooltip={false}
                       content={t(
-                        'pdfTextEditor.options.autoScaleText.description',
-                        'Automatically scales text horizontally to fit within its original bounding box when font rendering differs from PDF.'
+                        "pdfTextEditor.options.autoScaleText.description",
+                        "Automatically scales text horizontally to fit within its original bounding box when font rendering differs from PDF.",
                       )}
                       position="top"
                     >
-                      <ActionIcon variant="subtle" color="gray" size="sm" style={{ flexShrink: 0 }}>
+                      <ActionIcon
+                        variant="subtle"
+                        color="gray"
+                        size="sm"
+                        style={{ flexShrink: 0 }}
+                      >
                         <InfoOutlinedIcon fontSize="small" />
                       </ActionIcon>
                     </Tooltip>
                     <Text fw={500} size="sm" style={{ flex: 1 }}>
-                      {t('pdfTextEditor.options.autoScaleText.title', 'Auto-scale text to fit boxes')}
+                      {t(
+                        "pdfTextEditor.options.autoScaleText.title",
+                        "Auto-scale text to fit boxes",
+                      )}
                     </Text>
                   </Group>
                   <Switch
                     size="md"
                     checked={autoScaleText}
-                    onChange={(event) => onAutoScaleTextChange(event.currentTarget.checked)}
+                    onChange={(event) =>
+                      onAutoScaleTextChange(event.currentTarget.checked)
+                    }
                   />
                 </Group>
 
@@ -188,42 +223,77 @@ const PdfTextEditorSidebar = ({ data }: PdfTextEditorSidebarProps) => {
                 <Stack gap="xs">
                   <Group gap={4} align="center">
                     <Text fw={500} size="sm">
-                      {t('pdfTextEditor.options.groupingMode.title', 'Text Grouping Mode')}
+                      {t(
+                        "pdfTextEditor.options.groupingMode.title",
+                        "Text Grouping Mode",
+                      )}
                     </Text>
-                    {externalGroupingMode === 'auto' && isParagraphPage && (
-                      <Badge size="xs" color="blue" variant="light" key={`para-${selectedPage}`}>
-                        {t('pdfTextEditor.pageType.paragraph', 'Paragraph page')}
-                      </Badge>
-                    )}
-                    {externalGroupingMode === 'auto' && !isParagraphPage && hasDocument && (
-                      <Badge size="xs" color="gray" variant="light" key={`sparse-${selectedPage}`}>
-                        {t('pdfTextEditor.pageType.sparse', 'Sparse text')}
+                    {externalGroupingMode === "auto" && isParagraphPage && (
+                      <Badge
+                        size="xs"
+                        color="blue"
+                        variant="light"
+                        key={`para-${selectedPage}`}
+                      >
+                        {t(
+                          "pdfTextEditor.pageType.paragraph",
+                          "Paragraph page",
+                        )}
                       </Badge>
                     )}
+                    {externalGroupingMode === "auto" &&
+                      !isParagraphPage &&
+                      hasDocument && (
+                        <Badge
+                          size="xs"
+                          color="gray"
+                          variant="light"
+                          key={`sparse-${selectedPage}`}
+                        >
+                          {t("pdfTextEditor.pageType.sparse", "Sparse text")}
+                        </Badge>
+                      )}
                   </Group>
                   <Text size="xs" c="dimmed">
-                    {externalGroupingMode === 'auto'
+                    {externalGroupingMode === "auto"
                       ? t(
-                          'pdfTextEditor.options.groupingMode.autoDescription',
-                          'Automatically detects page type and groups text appropriately.'
+                          "pdfTextEditor.options.groupingMode.autoDescription",
+                          "Automatically detects page type and groups text appropriately.",
                         )
-                      : externalGroupingMode === 'paragraph'
+                      : externalGroupingMode === "paragraph"
                         ? t(
-                            'pdfTextEditor.options.groupingMode.paragraphDescription',
-                            'Groups aligned lines into multi-line paragraph text boxes.'
+                            "pdfTextEditor.options.groupingMode.paragraphDescription",
+                            "Groups aligned lines into multi-line paragraph text boxes.",
                           )
                         : t(
-                            'pdfTextEditor.options.groupingMode.singleLineDescription',
-                            'Keeps each PDF text line as a separate text box.'
+                            "pdfTextEditor.options.groupingMode.singleLineDescription",
+                            "Keeps each PDF text line as a separate text box.",
                           )}
                   </Text>
                   <SegmentedControl
                     value={externalGroupingMode}
-                    onChange={(value) => handleModeChangeRequest(value as GroupingMode)}
+                    onChange={(value) =>
+                      handleModeChangeRequest(value as GroupingMode)
+                    }
                     data={[
-                      { label: t('pdfTextEditor.groupingMode.auto', 'Auto'), value: 'auto' },
-                      { label: t('pdfTextEditor.groupingMode.paragraph', 'Paragraph'), value: 'paragraph' },
-                      { label: t('pdfTextEditor.groupingMode.singleLine', 'Single Line'), value: 'singleLine' },
+                      {
+                        label: t("pdfTextEditor.groupingMode.auto", "Auto"),
+                        value: "auto",
+                      },
+                      {
+                        label: t(
+                          "pdfTextEditor.groupingMode.paragraph",
+                          "Paragraph",
+                        ),
+                        value: "paragraph",
+                      },
+                      {
+                        label: t(
+                          "pdfTextEditor.groupingMode.singleLine",
+                          "Single Line",
+                        ),
+                        value: "singleLine",
+                      },
                     ]}
                     fullWidth
                   />
@@ -232,27 +302,43 @@ const PdfTextEditorSidebar = ({ data }: PdfTextEditorSidebarProps) => {
                 <Divider />
 
                 <Group justify="space-between" align="center">
-                  <Group gap={4} align="center" style={{ flex: 1, minWidth: 0 }}>
+                  <Group
+                    gap={4}
+                    align="center"
+                    style={{ flex: 1, minWidth: 0 }}
+                  >
                     <Tooltip
                       sidebarTooltip={false}
                       content={t(
-                        'pdfTextEditor.options.forceSingleElement.description',
-                        'When enabled, the editor exports each edited text box as one PDF text element to avoid overlapping glyphs or mixed fonts.'
+                        "pdfTextEditor.options.forceSingleElement.description",
+                        "When enabled, the editor exports each edited text box as one PDF text element to avoid overlapping glyphs or mixed fonts.",
                       )}
                       position="top"
                     >
-                      <ActionIcon variant="subtle" color="gray" size="sm" style={{ flexShrink: 0 }}>
+                      <ActionIcon
+                        variant="subtle"
+                        color="gray"
+                        size="sm"
+                        style={{ flexShrink: 0 }}
+                      >
                         <InfoOutlinedIcon fontSize="small" />
                       </ActionIcon>
                     </Tooltip>
                     <Text fw={500} size="sm" style={{ flex: 1 }}>
-                      {t('pdfTextEditor.options.forceSingleElement.title', 'Lock edited text to a single PDF element')}
+                      {t(
+                        "pdfTextEditor.options.forceSingleElement.title",
+                        "Lock edited text to a single PDF element",
+                      )}
                     </Text>
                   </Group>
                   <Switch
                     size="md"
                     checked={forceSingleTextElement}
-                    onChange={(event) => onForceSingleTextElementChange(event.currentTarget.checked)}
+                    onChange={(event) =>
+                      onForceSingleTextElementChange(
+                        event.currentTarget.checked,
+                      )
+                    }
                   />
                 </Group>
               </Stack>
@@ -270,15 +356,15 @@ const PdfTextEditorSidebar = ({ data }: PdfTextEditorSidebarProps) => {
         </ScrollArea>
 
         <Group gap="xs" wrap="nowrap" p="md">
-            <Button
-              variant="filled"
-              onClick={onSaveToWorkbench}
-              loading={isSavingToWorkbench}
-              disabled={!hasDocument || !hasChanges || isConverting}
-              style={{ flex: 1 }}
-            >
-              {t('pdfTextEditor.actions.applyChanges', 'Apply Changes')}
-            </Button>
+          <Button
+            variant="filled"
+            onClick={onSaveToWorkbench}
+            loading={isSavingToWorkbench}
+            disabled={!hasDocument || !hasChanges || isConverting}
+            style={{ flex: 1 }}
+          >
+            {t("pdfTextEditor.actions.applyChanges", "Apply Changes")}
+          </Button>
           <Menu position="bottom-end" withinPortal>
             <Menu.Target>
               <ActionIcon
@@ -295,14 +381,14 @@ const PdfTextEditorSidebar = ({ data }: PdfTextEditorSidebarProps) => {
                 onClick={() => onGeneratePdf()}
                 disabled={!hasChanges || isGeneratingPdf}
               >
-                {t('pdfTextEditor.actions.downloadCopy', 'Download Copy')}
+                {t("pdfTextEditor.actions.downloadCopy", "Download Copy")}
               </Menu.Item>
               <Menu.Item
                 leftSection={<AutorenewIcon fontSize="small" />}
                 onClick={onReset}
                 color="red"
               >
-                {t('pdfTextEditor.actions.reset', 'Reset Changes')}
+                {t("pdfTextEditor.actions.reset", "Reset Changes")}
               </Menu.Item>
             </Menu.Dropdown>
           </Menu>
@@ -313,22 +399,22 @@ const PdfTextEditorSidebar = ({ data }: PdfTextEditorSidebarProps) => {
       <Modal
         opened={pendingModeChange !== null}
         onClose={handleCancelModeChange}
-        title={t('pdfTextEditor.modeChange.title', 'Confirm Mode Change')}
+        title={t("pdfTextEditor.modeChange.title", "Confirm Mode Change")}
         centered
       >
         <Stack gap="md">
           <Text>
             {t(
-              'pdfTextEditor.modeChange.warning',
-              'Changing the text grouping mode will reset all unsaved changes. Are you sure you want to continue?'
+              "pdfTextEditor.modeChange.warning",
+              "Changing the text grouping mode will reset all unsaved changes. Are you sure you want to continue?",
             )}
           </Text>
           <Group justify="flex-end" gap="sm">
             <Button variant="default" onClick={handleCancelModeChange}>
-              {t('pdfTextEditor.modeChange.cancel', 'Cancel')}
+              {t("pdfTextEditor.modeChange.cancel", "Cancel")}
             </Button>
             <Button color="red" onClick={handleConfirmModeChange}>
-              {t('pdfTextEditor.modeChange.confirm', 'Reset and Change Mode')}
+              {t("pdfTextEditor.modeChange.confirm", "Reset and Change Mode")}
             </Button>
           </Group>
         </Stack>
diff --git a/frontend/src/core/components/tools/pdfTextEditor/PdfTextEditorView.tsx b/frontend/src/core/components/tools/pdfTextEditor/PdfTextEditorView.tsx
index 99cd6ad99a..cc6389845a 100644
--- a/frontend/src/core/components/tools/pdfTextEditor/PdfTextEditorView.tsx
+++ b/frontend/src/core/components/tools/pdfTextEditor/PdfTextEditorView.tsx
@@ -1,4 +1,11 @@
-import React, { useCallback, useEffect, useLayoutEffect, useMemo, useRef, useState } from 'react';
+import React, {
+  useCallback,
+  useEffect,
+  useLayoutEffect,
+  useMemo,
+  useRef,
+  useState,
+} from "react";
 import {
   ActionIcon,
   Alert,
@@ -16,75 +23,78 @@ import {
   Stack,
   Text,
   Tooltip,
-} from '@mantine/core';
-import { Dropzone } from '@mantine/dropzone';
-import { useTranslation } from 'react-i18next';
-import AutorenewIcon from '@mui/icons-material/Autorenew';
-import WarningAmberIcon from '@mui/icons-material/WarningAmber';
-import InfoOutlinedIcon from '@mui/icons-material/InfoOutlined';
-import CloseIcon from '@mui/icons-material/Close';
-import MergeTypeIcon from '@mui/icons-material/MergeType';
-import CallSplitIcon from '@mui/icons-material/CallSplit';
-import MoreVertIcon from '@mui/icons-material/MoreVert';
-import UploadFileIcon from '@mui/icons-material/UploadFileOutlined';
-import { Rnd } from 'react-rnd';
-import NavigationWarningModal from '@app/components/shared/NavigationWarningModal';
+} from "@mantine/core";
+import { Dropzone } from "@mantine/dropzone";
+import { useTranslation } from "react-i18next";
+import AutorenewIcon from "@mui/icons-material/Autorenew";
+import WarningAmberIcon from "@mui/icons-material/WarningAmber";
+import InfoOutlinedIcon from "@mui/icons-material/InfoOutlined";
+import CloseIcon from "@mui/icons-material/Close";
+import MergeTypeIcon from "@mui/icons-material/MergeType";
+import CallSplitIcon from "@mui/icons-material/CallSplit";
+import MoreVertIcon from "@mui/icons-material/MoreVert";
+import UploadFileIcon from "@mui/icons-material/UploadFileOutlined";
+import { Rnd } from "react-rnd";
+import { useNavigationGuard } from "@app/contexts/NavigationContext";
 
-import { useFileContext } from '@app/contexts/FileContext';
+import { useFileContext } from "@app/contexts/FileContext";
 import {
   PdfTextEditorViewData,
   PdfJsonFont,
   PdfJsonPage,
   TextGroup,
-} from '@app/tools/pdfTextEditor/pdfTextEditorTypes';
-import { getImageBounds, pageDimensions } from '@app/tools/pdfTextEditor/pdfTextEditorUtils';
+} from "@app/tools/pdfTextEditor/pdfTextEditorTypes";
+import {
+  getImageBounds,
+  pageDimensions,
+} from "@app/tools/pdfTextEditor/pdfTextEditorUtils";
 
 const MAX_RENDER_WIDTH = 820;
 const MIN_BOX_SIZE = 18;
 
 const normalizeFontFormat = (format?: string | null): string => {
   if (!format) {
-    return 'ttf';
+    return "ttf";
   }
   const lower = format.toLowerCase();
-  if (lower.includes('woff2')) {
-    return 'woff2';
+  if (lower.includes("woff2")) {
+    return "woff2";
   }
-  if (lower.includes('woff')) {
-    return 'woff';
+  if (lower.includes("woff")) {
+    return "woff";
   }
-  if (lower.includes('otf')) {
-    return 'otf';
+  if (lower.includes("otf")) {
+    return "otf";
   }
-  if (lower.includes('cff')) {
-    return 'otf';
+  if (lower.includes("cff")) {
+    return "otf";
   }
-  return 'ttf';
+  return "ttf";
 };
 
 const getFontMimeType = (format: string): string => {
   switch (format) {
-    case 'woff2':
-      return 'font/woff2';
-    case 'woff':
-      return 'font/woff';
-    case 'otf':
-      return 'font/otf';
+    case "woff2":
+      return "font/woff2";
+    case "woff":
+      return "font/woff";
+    case "otf":
+      return "font/otf";
     default:
-      return 'font/ttf';
+      return "font/ttf";
   }
 };
 
 const getFontFormatHint = (format: string): string | null => {
   switch (format) {
-    case 'woff2':
-      return 'woff2';
-    case 'woff':
-      return 'woff';
-    case 'otf':
-      return 'opentype';
-    case 'ttf':
-      return 'truetype';
+    case "woff2":
+      return "woff2";
+    case "woff":
+      return "woff";
+    case "otf":
+      return "opentype";
+    case "ttf":
+      return "truetype";
     default:
       return null;
   }
@@ -100,14 +110,21 @@ const decodeBase64ToUint8Array = (value: string): Uint8Array => {
 };
 
 const buildFontFamilyName = (font: PdfJsonFont): string => {
-  const preferred = (font.baseName ?? '').trim();
-  const identifier = preferred.length > 0 ? preferred : (font.uid ?? font.id ?? 'font').toString();
-  return `pdf-font-${identifier.replace(/[^a-zA-Z0-9_-]/g, '')}`;
+  const preferred = (font.baseName ?? "").trim();
+  const identifier =
+    preferred.length > 0
+      ? preferred
+      : (font.uid ?? font.id ?? "font").toString();
+  return `pdf-font-${identifier.replace(/[^a-zA-Z0-9_-]/g, "")}`;
 };
 
 const getCaretOffset = (element: HTMLElement): number => {
   const selection = window.getSelection();
-  if (!selection || selection.rangeCount === 0 || !element.contains(selection.focusNode)) {
+  if (
+    !selection ||
+    selection.rangeCount === 0 ||
+    !element.contains(selection.focusNode)
+  ) {
     return element.innerText.length;
   }
   const range = selection.getRangeAt(0).cloneRange();
@@ -147,29 +164,36 @@ const setCaretOffset = (element: HTMLElement, offset: number): void => {
   selection.addRange(range);
 };
 
-const extractTextWithSoftBreaks = (element: HTMLElement): { text: string; insertedBreaks: boolean } => {
-  const normalized = element.innerText.replace(/\u00A0/g, ' ');
+const extractTextWithSoftBreaks = (
+  element: HTMLElement,
+): { text: string; insertedBreaks: boolean } => {
+  const normalized = element.innerText.replace(/\u00A0/g, " ");
   if (!element.isConnected) {
     return { text: normalized, insertedBreaks: false };
   }
 
   const walker = document.createTreeWalker(element, NodeFilter.SHOW_TEXT, null);
   const range = document.createRange();
-  let result = '';
+  let result = "";
   let previousTop: number | null = null;
   let insertedBreaks = false;
 
   while (walker.nextNode()) {
     const node = walker.currentNode as Text;
-    const nodeText = node.textContent ?? '';
+    const nodeText = node.textContent ?? "";
     for (let index = 0; index < nodeText.length; index += 1) {
       const char = nodeText[index];
       range.setStart(node, index);
       range.setEnd(node, index + 1);
       const rect = range.getClientRects()[0];
 
-      if (previousTop !== null && rect && Math.abs(rect.top - previousTop) > 0.5 && result[result.length - 1] !== '\n') {
-        result += '\n';
+      if (
+        previousTop !== null &&
+        rect &&
+        Math.abs(rect.top - previousTop) > 0.5 &&
+        result[result.length - 1] !== "\n"
+      ) {
+        result += "\n";
         insertedBreaks = true;
       }
 
@@ -177,14 +201,14 @@ const extractTextWithSoftBreaks = (element: HTMLElement): { text: string; insert
       if (rect) {
         previousTop = rect.top;
       }
-      if (char === '\n') {
+      if (char === "\n") {
         previousTop = null;
       }
     }
   }
 
   return {
-    text: result.replace(/\u00A0/g, ' '),
+    text: result.replace(/\u00A0/g, " "),
     insertedBreaks,
   };
 };
@@ -217,8 +241,14 @@ const toCssBounds = (
   };
 };
 
-const normalizePageNumber = (pageIndex: number | null | undefined): number | null => {
-  if (pageIndex === null || pageIndex === undefined || Number.isNaN(pageIndex)) {
+const normalizePageNumber = (
+  pageIndex: number | null | undefined,
+): number | null => {
+  if (
+    pageIndex === null ||
+    pageIndex === undefined ||
+    Number.isNaN(pageIndex)
+  ) {
     return null;
   }
   return pageIndex + 1;
@@ -248,7 +278,10 @@ const buildFontLookupKeys = (
  * Analyzes text groups on a page to determine if it's paragraph-heavy or sparse.
  * Returns true if the page appears to be document-like with substantial text content.
  */
-const analyzePageContentType = (groups: TextGroup[], pageWidth: number): boolean => {
+const analyzePageContentType = (
+  groups: TextGroup[],
+  pageWidth: number,
+): boolean => {
   if (groups.length === 0) return false;
 
   let totalWords = 0;
@@ -259,7 +292,7 @@ const analyzePageContentType = (groups: TextGroup[], pageWidth: number): boolean
   const fullWidthThreshold = pageWidth * 0.7;
 
   groups.forEach((group) => {
-    const text = (group.text || '').trim();
+    const text = (group.text || "").trim();
     if (text.length === 0) return;
 
     totalGroups++;
@@ -287,12 +320,14 @@ const analyzePageContentType = (groups: TextGroup[], pageWidth: number): boolean
   const fullWidthRatio = fullWidthLines / totalGroups;
 
   // Calculate variance in line lengths
-  const variance = wordCounts.reduce((sum, count) => {
-    const diff = count - avgWordsPerGroup;
-    return sum + diff * diff;
-  }, 0) / totalGroups;
+  const variance =
+    wordCounts.reduce((sum, count) => {
+      const diff = count - avgWordsPerGroup;
+      return sum + diff * diff;
+    }, 0) / totalGroups;
   const stdDev = Math.sqrt(variance);
-  const coefficientOfVariation = avgWordsPerGroup > 0 ? stdDev / avgWordsPerGroup : 0;
+  const coefficientOfVariation =
+    avgWordsPerGroup > 0 ? stdDev / avgWordsPerGroup : 0;
 
   // All 3 criteria must pass for paragraph mode
   const criterion1 = avgWordsPerGroup > 5;
@@ -310,14 +345,20 @@ const PdfTextEditorView = ({ data }: PdfTextEditorViewProps) => {
   const [activeGroupId, setActiveGroupId] = useState<string | null>(null);
   const [editingGroupId, setEditingGroupId] = useState<string | null>(null);
   const [activeImageId, setActiveImageId] = useState<string | null>(null);
-  const [selectedGroupIds, setSelectedGroupIds] = useState<Set<string>>(new Set());
-  const [widthOverrides, setWidthOverrides] = useState<Map<string, number>>(new Map());
+  const [selectedGroupIds, setSelectedGroupIds] = useState<Set<string>>(
+    new Set(),
+  );
+  const [widthOverrides, setWidthOverrides] = useState<Map<string, number>>(
+    new Map(),
+  );
   const draggingImageRef = useRef<string | null>(null);
   const rndRefs = useRef<Map<string, any>>(new Map());
   const pendingDragUpdateRef = useRef<number | null>(null);
-  const [fontFamilies, setFontFamilies] = useState<Map<string, string>>(new Map());
+  const [fontFamilies, setFontFamilies] = useState<Map<string, string>>(
+    new Map(),
+  );
   const [textScales, setTextScales] = useState<Map<string, number>>(new Map());
-  const measurementKeyRef = useRef<string>('');
+  const measurementKeyRef = useRef<string>("");
   const containerRef = useRef<HTMLDivElement | null>(null);
   const editorRefs = useRef<Map<string, HTMLDivElement>>(new Map());
   const caretOffsetsRef = useRef<Map<string, number>>(new Map());
@@ -335,7 +376,9 @@ const PdfTextEditorView = ({ data }: PdfTextEditorViewProps) => {
   // First-time banner state
   const [showWelcomeBanner, setShowWelcomeBanner] = useState(() => {
     try {
-      return localStorage.getItem('pdfTextEditor.welcomeBannerDismissed') !== 'true';
+      return (
+        localStorage.getItem("pdfTextEditor.welcomeBannerDismissed") !== "true"
+      );
     } catch {
       return true;
     }
@@ -349,7 +392,7 @@ const PdfTextEditorView = ({ data }: PdfTextEditorViewProps) => {
   const handleDontShowAgain = useCallback(() => {
     // Save to localStorage to never show again
     try {
-      localStorage.setItem('pdfTextEditor.welcomeBannerDismissed', 'true');
+      localStorage.setItem("pdfTextEditor.welcomeBannerDismissed", "true");
     } catch {
       // Ignore localStorage errors
     }
@@ -403,18 +446,38 @@ const PdfTextEditorView = ({ data }: PdfTextEditorViewProps) => {
   console.log(`� [PdfTextEditor] Page ${selectedPage + 1} Dimensions:`, {
     pageWidth,
     pageHeight,
-    aspectRatio: pageHeight > 0 ? (pageWidth / pageHeight).toFixed(3) : 'N/A',
-    currentPage: currentPage ? {
-      mediaBox: currentPage.mediaBox,
-      cropBox: currentPage.cropBox,
-      rotation: currentPage.rotation,
-    } : null,
-    documentMetadata: pdfDocument?.metadata ? {
-      title: pdfDocument.metadata.title,
-      pageCount: pages.length,
-    } : null,
+    aspectRatio: pageHeight > 0 ? (pageWidth / pageHeight).toFixed(3) : "N/A",
+    currentPage: currentPage
+      ? {
+          mediaBox: currentPage.mediaBox,
+          cropBox: currentPage.cropBox,
+          rotation: currentPage.rotation,
+        }
+      : null,
+    documentMetadata: pdfDocument?.metadata
+      ? {
+          title: pdfDocument.metadata.title,
+          pageCount: pages.length,
+        }
+      : null,
   });
 
+  // Register navigation warning handlers for the global modal
+  const {
+    registerNavigationWarningHandlers,
+    unregisterNavigationWarningHandlers,
+  } = useNavigationGuard();
+  useEffect(() => {
+    registerNavigationWarningHandlers({
+      onApplyAndContinue: onSaveToWorkbench,
+    });
+    return () => unregisterNavigationWarningHandlers();
+  }, [
+    onSaveToWorkbench,
+    registerNavigationWarningHandlers,
+    unregisterNavigationWarningHandlers,
+  ]);
+
   const clearSelection = useCallback(() => {
     setSelectedGroupIds(new Set());
     lastSelectedGroupIdRef.current = null;
@@ -424,62 +487,80 @@ const PdfTextEditorView = ({ data }: PdfTextEditorViewProps) => {
     widthOverridesRef.current = widthOverrides;
   }, [widthOverrides]);
 
-  const resolveFont = useCallback((fontId: string | null | undefined, pageIndex: number | null | undefined): PdfJsonFont | null => {
-    if (!fontId || !pdfDocument?.fonts) {
-      return null;
-    }
-    const fonts = pdfDocument.fonts;
-    const pageNumber = normalizePageNumber(pageIndex);
-    if (pageNumber !== null) {
-      const pageMatch = fonts.find((font) => font?.id === fontId && font?.pageNumber === pageNumber);
-      if (pageMatch) {
-        return pageMatch;
+  const resolveFont = useCallback(
+    (
+      fontId: string | null | undefined,
+      pageIndex: number | null | undefined,
+    ): PdfJsonFont | null => {
+      if (!fontId || !pdfDocument?.fonts) {
+        return null;
       }
-      const uidKey = `${pageNumber}:${fontId}`;
-      const uidMatch = fonts.find((font) => font?.uid === uidKey);
-      if (uidMatch) {
-        return uidMatch;
+      const fonts = pdfDocument.fonts;
+      const pageNumber = normalizePageNumber(pageIndex);
+      if (pageNumber !== null) {
+        const pageMatch = fonts.find(
+          (font) => font?.id === fontId && font?.pageNumber === pageNumber,
+        );
+        if (pageMatch) {
+          return pageMatch;
+        }
+        const uidKey = `${pageNumber}:${fontId}`;
+        const uidMatch = fonts.find((font) => font?.uid === uidKey);
+        if (uidMatch) {
+          return uidMatch;
+        }
       }
-    }
-    const directUid = fonts.find((font) => font?.uid === fontId);
-    if (directUid) {
-      return directUid;
-    }
-    return fonts.find((font) => font?.id === fontId) ?? null;
-  }, [pdfDocument?.fonts]);
-
-  const getFontFamily = useCallback((fontId: string | null | undefined, pageIndex: number | null | undefined): string => {
-    if (!fontId) {
-      return 'sans-serif';
-    }
-
-    const font = resolveFont(fontId, pageIndex);
-    const lookupKeys = buildFontLookupKeys(fontId, font ?? undefined, pageIndex);
-    for (const key of lookupKeys) {
-      const loadedFamily = fontFamilies.get(key);
-      if (loadedFamily) {
-        return `'${loadedFamily}', sans-serif`;
+      const directUid = fonts.find((font) => font?.uid === fontId);
+      if (directUid) {
+        return directUid;
       }
-    }
+      return fonts.find((font) => font?.id === fontId) ?? null;
+    },
+    [pdfDocument?.fonts],
+  );
 
-    const fontName = font?.standard14Name || font?.baseName || '';
-    const lowerName = fontName.toLowerCase();
+  const getFontFamily = useCallback(
+    (
+      fontId: string | null | undefined,
+      pageIndex: number | null | undefined,
+    ): string => {
+      if (!fontId) {
+        return "sans-serif";
+      }
 
-    if (lowerName.includes('times')) {
-      return '"Times New Roman", Times, serif';
-    }
-    if (lowerName.includes('helvetica') || lowerName.includes('arial')) {
-      return 'Arial, Helvetica, sans-serif';
-    }
-    if (lowerName.includes('courier')) {
-      return '"Courier New", Courier, monospace';
-    }
-    if (lowerName.includes('symbol')) {
-      return 'Symbol, serif';
-    }
+      const font = resolveFont(fontId, pageIndex);
+      const lookupKeys = buildFontLookupKeys(
+        fontId,
+        font ?? undefined,
+        pageIndex,
+      );
+      for (const key of lookupKeys) {
+        const loadedFamily = fontFamilies.get(key);
+        if (loadedFamily) {
+          return `'${loadedFamily}', sans-serif`;
+        }
+      }
 
-    return 'Arial, Helvetica, sans-serif';
-  }, [resolveFont, fontFamilies]);
+      const fontName = font?.standard14Name || font?.baseName || "";
+      const lowerName = fontName.toLowerCase();
+
+      if (lowerName.includes("times")) {
+        return '"Times New Roman", Times, serif';
+      }
+      if (lowerName.includes("helvetica") || lowerName.includes("arial")) {
+        return "Arial, Helvetica, sans-serif";
+      }
+      if (lowerName.includes("courier")) {
+        return '"Courier New", Courier, monospace';
+      }
+      if (lowerName.includes("symbol")) {
+        return "Symbol, serif";
+      }
+
+      return "Arial, Helvetica, sans-serif";
+    },
+    [resolveFont, fontFamilies],
+  );
 
   useEffect(() => {
     clearSelection();
@@ -495,7 +576,9 @@ const PdfTextEditorView = ({ data }: PdfTextEditorViewProps) => {
 
   useEffect(() => {
     setSelectedGroupIds((prev) => {
-      const filtered = Array.from(prev).filter((id) => pageGroups.some((group) => group.id === id));
+      const filtered = Array.from(prev).filter((id) =>
+        pageGroups.some((group) => group.id === id),
+      );
       if (filtered.length === prev.size) {
         return prev;
       }
@@ -518,39 +601,55 @@ const PdfTextEditorView = ({ data }: PdfTextEditorViewProps) => {
   // Detect if current page contains paragraph-heavy content
   const isParagraphPage = useMemo(() => {
     const result = analyzePageContentType(pageGroups, pageWidth);
-    console.log(`�� Page ${selectedPage} badge: ${result ? 'PARAGRAPH' : 'SPARSE'} (${pageGroups.length} groups)`);
+    console.log(
+      `�� Page ${selectedPage} badge: ${result ? "PARAGRAPH" : "SPARSE"} (${pageGroups.length} groups)`,
+    );
     return result;
   }, [pageGroups, pageWidth, selectedPage]);
   const isParagraphLayout =
-    externalGroupingMode === 'paragraph' || (externalGroupingMode === 'auto' && isParagraphPage);
+    externalGroupingMode === "paragraph" ||
+    (externalGroupingMode === "auto" && isParagraphPage);
 
   const resolveGroupWidth = useCallback(
     (group: TextGroup): { width: number; base: number; max: number } => {
       const baseWidth = Math.max(group.bounds.right - group.bounds.left, 1);
       const maxWidth = Math.max(pageWidth - group.bounds.left, baseWidth);
       const override = widthOverrides.get(group.id);
-      const resolved = override ? Math.min(Math.max(override, baseWidth), maxWidth) : baseWidth;
+      const resolved = override
+        ? Math.min(Math.max(override, baseWidth), maxWidth)
+        : baseWidth;
       return { width: resolved, base: baseWidth, max: maxWidth };
     },
     [pageWidth, widthOverrides],
   );
 
-  const selectedGroupIdsArray = useMemo(() => Array.from(selectedGroupIds), [selectedGroupIds]);
+  const selectedGroupIdsArray = useMemo(
+    () => Array.from(selectedGroupIds),
+    [selectedGroupIds],
+  );
   const selectionIndices = useMemo(() => {
     return selectedGroupIdsArray
       .map((id) => pageGroups.findIndex((group) => group.id === id))
       .filter((index) => index >= 0)
       .sort((a, b) => a - b);
   }, [pageGroups, selectedGroupIdsArray]);
-  const canMergeSelection = selectionIndices.length >= 2 && selectionIndices.every((value, idx, array) => idx === 0 || value === array[idx - 1] + 1);
-  const paragraphSelectionIds = useMemo(() =>
-    selectedGroupIdsArray.filter((id) => {
-      const target = pageGroups.find((group) => group.id === id);
-      return target ? (target.childLineGroups?.length ?? 0) > 1 : false;
-    }),
-  [pageGroups, selectedGroupIdsArray]);
+  const canMergeSelection =
+    selectionIndices.length >= 2 &&
+    selectionIndices.every(
+      (value, idx, array) => idx === 0 || value === array[idx - 1] + 1,
+    );
+  const paragraphSelectionIds = useMemo(
+    () =>
+      selectedGroupIdsArray.filter((id) => {
+        const target = pageGroups.find((group) => group.id === id);
+        return target ? (target.childLineGroups?.length ?? 0) > 1 : false;
+      }),
+    [pageGroups, selectedGroupIdsArray],
+  );
   const canUngroupSelection = paragraphSelectionIds.length > 0;
-  const hasWidthOverrides = selectedGroupIdsArray.some((id) => widthOverrides.has(id));
+  const hasWidthOverrides = selectedGroupIdsArray.some((id) =>
+    widthOverrides.has(id),
+  );
   const hasSelection = selectedGroupIdsArray.length > 0;
 
   const syncEditorValue = useCallback(
@@ -573,7 +672,8 @@ const PdfTextEditorView = ({ data }: PdfTextEditorViewProps) => {
         }
         const editor = editorRefs.current.get(groupId);
         if (editor) {
-          const savedOffset = caretOffsetsRef.current.get(groupId) ?? editor.innerText.length;
+          const savedOffset =
+            caretOffsetsRef.current.get(groupId) ?? editor.innerText.length;
           setCaretOffset(editor, savedOffset);
         }
       });
@@ -607,7 +707,14 @@ const PdfTextEditorView = ({ data }: PdfTextEditorViewProps) => {
     if (merged) {
       clearSelection();
     }
-  }, [canMergeSelection, selectionIndices, pageGroups, onMergeGroups, selectedPage, clearSelection]);
+  }, [
+    canMergeSelection,
+    selectionIndices,
+    pageGroups,
+    onMergeGroups,
+    selectedPage,
+    clearSelection,
+  ]);
 
   const handleUngroupSelection = useCallback(() => {
     if (!canUngroupSelection) {
@@ -623,14 +730,20 @@ const PdfTextEditorView = ({ data }: PdfTextEditorViewProps) => {
     if (changed) {
       clearSelection();
     }
-  }, [canUngroupSelection, paragraphSelectionIds, onUngroupGroup, selectedPage, clearSelection]);
+  }, [
+    canUngroupSelection,
+    paragraphSelectionIds,
+    onUngroupGroup,
+    selectedPage,
+    clearSelection,
+  ]);
 
   const handleWidthAdjustment = useCallback(
-    (mode: 'expand' | 'reset') => {
-      if (mode === 'expand' && !hasSelection) {
+    (mode: "expand" | "reset") => {
+      if (mode === "expand" && !hasSelection) {
         return;
       }
-      if (mode === 'reset' && !hasWidthOverrides) {
+      if (mode === "reset" && !hasWidthOverrides) {
         return;
       }
       const selectedGroups = selectedGroupIdsArray
@@ -644,7 +757,7 @@ const PdfTextEditorView = ({ data }: PdfTextEditorViewProps) => {
         selectedGroups.forEach((group) => {
           const baseWidth = Math.max(group.bounds.right - group.bounds.left, 1);
           const maxWidth = Math.max(pageWidth - group.bounds.left, baseWidth);
-          if (mode === 'expand') {
+          if (mode === "expand") {
             next.set(group.id, maxWidth);
           } else {
             next.delete(group.id);
@@ -653,7 +766,13 @@ const PdfTextEditorView = ({ data }: PdfTextEditorViewProps) => {
         return next;
       });
     },
-    [hasSelection, hasWidthOverrides, selectedGroupIdsArray, pageGroups, pageWidth],
+    [
+      hasSelection,
+      hasWidthOverrides,
+      selectedGroupIdsArray,
+      pageGroups,
+      pageWidth,
+    ],
   );
 
   const extractPreferredFontId = useCallback((target?: TextGroup | null) => {
@@ -707,12 +826,16 @@ const PdfTextEditorView = ({ data }: PdfTextEditorViewProps) => {
   );
 
   const fontMetrics = useMemo(() => {
-    const metrics = new Map<string, { unitsPerEm: number; ascent: number; descent: number }>();
+    const metrics = new Map<
+      string,
+      { unitsPerEm: number; ascent: number; descent: number }
+    >();
     pdfDocument?.fonts?.forEach((font) => {
       if (!font?.id) {
         return;
       }
-      const unitsPerEm = font.unitsPerEm && font.unitsPerEm > 0 ? font.unitsPerEm : 1000;
+      const unitsPerEm =
+        font.unitsPerEm && font.unitsPerEm > 0 ? font.unitsPerEm : 1000;
       const ascent = font.ascent ?? unitsPerEm;
       const descent = font.descent ?? -(unitsPerEm * 0.2);
       const metric = { unitsPerEm, ascent, descent };
@@ -728,7 +851,7 @@ const PdfTextEditorView = ({ data }: PdfTextEditorViewProps) => {
   }, [pdfDocument?.fonts]);
 
   useEffect(() => {
-    if (typeof FontFace === 'undefined') {
+    if (typeof FontFace === "undefined") {
       setFontFamilies(new Map());
       return undefined;
     }
@@ -745,28 +868,51 @@ const PdfTextEditorView = ({ data }: PdfTextEditorViewProps) => {
 
       const next = new Map<string, string>();
       const pickFontSource = (
-        font: PdfJsonFont
-      ): { data: string; format?: string | null; source: 'pdfProgram' | 'webProgram' | 'program' } | null => {
+        font: PdfJsonFont,
+      ): {
+        data: string;
+        format?: string | null;
+        source: "pdfProgram" | "webProgram" | "program";
+      } | null => {
         if (font.pdfProgram && font.pdfProgram.length > 0) {
-          return { data: font.pdfProgram, format: font.pdfProgramFormat, source: 'pdfProgram' };
+          return {
+            data: font.pdfProgram,
+            format: font.pdfProgramFormat,
+            source: "pdfProgram",
+          };
         }
         if (font.webProgram && font.webProgram.length > 0) {
-          return { data: font.webProgram, format: font.webProgramFormat, source: 'webProgram' };
+          return {
+            data: font.webProgram,
+            format: font.webProgramFormat,
+            source: "webProgram",
+          };
         }
         if (font.program && font.program.length > 0) {
-          return { data: font.program, format: font.programFormat, source: 'program' };
+          return {
+            data: font.program,
+            format: font.programFormat,
+            source: "program",
+          };
         }
         return null;
       };
 
-      const registerLoadedFontKeys = (font: PdfJsonFont, familyName: string) => {
+      const registerLoadedFontKeys = (
+        font: PdfJsonFont,
+        familyName: string,
+      ) => {
         if (font.id) {
           next.set(font.id, familyName);
         }
         if (font.uid) {
           next.set(font.uid, familyName);
         }
-        if (font.pageNumber !== null && font.pageNumber !== undefined && font.id) {
+        if (
+          font.pageNumber !== null &&
+          font.pageNumber !== undefined &&
+          font.id
+        ) {
           next.set(`${font.pageNumber}:${font.id}`, familyName);
         }
       };
@@ -783,23 +929,30 @@ const PdfTextEditorView = ({ data }: PdfTextEditorViewProps) => {
           const formatSource = selection.format;
           const format = normalizeFontFormat(formatSource);
           const data = decodeBase64ToUint8Array(selection.data);
-          const blob = new Blob([data as BlobPart], { type: getFontMimeType(format) });
+          const blob = new Blob([data as BlobPart], {
+            type: getFontMimeType(format),
+          });
           const url = URL.createObjectURL(blob);
           const formatHint = getFontFormatHint(format);
           const familyName = buildFontFamilyName(font);
-          const source = formatHint ? `url(${url}) format('${formatHint}')` : `url(${url})`;
+          const source = formatHint
+            ? `url(${url}) format('${formatHint}')`
+            : `url(${url})`;
           const fontFace = new FontFace(familyName, source);
 
-          console.debug(`[FontLoader] Loading font ${font.id} (${font.baseName}) using ${selection.source}:`, {
-            formatSource,
-            format,
-            formatHint,
-            familyName,
-            dataLength: data.length,
-            hasPdfProgram: !!font.pdfProgram,
-            hasWebProgram: !!font.webProgram,
-            hasProgram: !!font.program
-          });
+          console.debug(
+            `[FontLoader] Loading font ${font.id} (${font.baseName}) using ${selection.source}:`,
+            {
+              formatSource,
+              format,
+              formatHint,
+              familyName,
+              dataLength: data.length,
+              hasPdfProgram: !!font.pdfProgram,
+              hasWebProgram: !!font.webProgram,
+              hasProgram: !!font.program,
+            },
+          );
 
           await fontFace.load();
           if (disposed) {
@@ -812,13 +965,16 @@ const PdfTextEditorView = ({ data }: PdfTextEditorViewProps) => {
           registerLoadedFontKeys(font, familyName);
           console.debug(`[FontLoader] Successfully loaded font ${font.id}`);
         } catch (error) {
-          console.warn(`[FontLoader] Failed to load font ${font.id} (${font.baseName}) using ${selection.source}:`, {
-            error: error instanceof Error ? error.message : String(error),
-            formatSource: selection.format,
-            hasPdfProgram: !!font.pdfProgram,
-            hasWebProgram: !!font.webProgram,
-            hasProgram: !!font.program
-          });
+          console.warn(
+            `[FontLoader] Failed to load font ${font.id} (${font.baseName}) using ${selection.source}:`,
+            {
+              error: error instanceof Error ? error.message : String(error),
+              formatSource: selection.format,
+              hasPdfProgram: !!font.pdfProgram,
+              hasWebProgram: !!font.webProgram,
+              hasProgram: !!font.program,
+            },
+          );
           // Fallback to web-safe fonts is already implemented via getFontFamily()
         }
       }
@@ -849,107 +1005,127 @@ const PdfTextEditorView = ({ data }: PdfTextEditorViewProps) => {
   }, [pdfDocument?.fonts]);
 
   // Define helper functions that depend on hooks AFTER all hook calls
-  const getFontMetricsFor = useCallback((
-    fontId: string | null | undefined,
-    pageIndex: number | null | undefined,
-  ): { unitsPerEm: number; ascent: number; descent: number } | undefined => {
-    if (!fontId) {
-      return undefined;
-    }
-    const font = resolveFont(fontId, pageIndex);
-    const lookupKeys = buildFontLookupKeys(fontId, font ?? undefined, pageIndex);
-    for (const key of lookupKeys) {
-      const metrics = fontMetrics.get(key);
-      if (metrics) {
-        return metrics;
+  const getFontMetricsFor = useCallback(
+    (
+      fontId: string | null | undefined,
+      pageIndex: number | null | undefined,
+    ): { unitsPerEm: number; ascent: number; descent: number } | undefined => {
+      if (!fontId) {
+        return undefined;
+      }
+      const font = resolveFont(fontId, pageIndex);
+      const lookupKeys = buildFontLookupKeys(
+        fontId,
+        font ?? undefined,
+        pageIndex,
+      );
+      for (const key of lookupKeys) {
+        const metrics = fontMetrics.get(key);
+        if (metrics) {
+          return metrics;
+        }
       }
-    }
-    return undefined;
-  }, [resolveFont, fontMetrics]);
-
-  const getLineHeightPx = useCallback((
-    fontId: string | null | undefined,
-    pageIndex: number | null | undefined,
-    fontSizePx: number,
-  ): number => {
-    if (fontSizePx <= 0) {
-      return fontSizePx;
-    }
-    const metrics = getFontMetricsFor(fontId, pageIndex);
-    if (!metrics || metrics.unitsPerEm <= 0) {
-      return fontSizePx * 1.2;
-    }
-    const unitsPerEm = metrics.unitsPerEm > 0 ? metrics.unitsPerEm : 1000;
-    const ascentUnits = metrics.ascent ?? unitsPerEm;
-    const descentUnits = Math.abs(metrics.descent ?? -(unitsPerEm * 0.2));
-    const totalUnits = Math.max(unitsPerEm, ascentUnits + descentUnits);
-    if (totalUnits <= 0) {
-      return fontSizePx * 1.2;
-    }
-    const lineHeight = (totalUnits / unitsPerEm) * fontSizePx;
-    return Math.max(lineHeight, fontSizePx * 1.05);
-  }, [getFontMetricsFor]);
-
-  const getFontGeometry = useCallback((
-    fontId: string | null | undefined,
-    pageIndex: number | null | undefined,
-  ): {
-    unitsPerEm: number;
-    ascentUnits: number;
-    descentUnits: number;
-    totalUnits: number;
-    ascentRatio: number;
-    descentRatio: number;
-  } | undefined => {
-    const metrics = getFontMetricsFor(fontId, pageIndex);
-    if (!metrics) {
       return undefined;
-    }
-    const unitsPerEm = metrics.unitsPerEm > 0 ? metrics.unitsPerEm : 1000;
-    const rawAscent = metrics.ascent ?? unitsPerEm;
-    const rawDescent = metrics.descent ?? -(unitsPerEm * 0.2);
-    const ascentUnits = Number.isFinite(rawAscent) ? rawAscent : unitsPerEm;
-    const descentUnits = Number.isFinite(rawDescent) ? Math.abs(rawDescent) : unitsPerEm * 0.2;
-    const totalUnits = Math.max(unitsPerEm, ascentUnits + descentUnits);
-    if (totalUnits <= 0 || !Number.isFinite(totalUnits)) {
-      return undefined;
-    }
-    return {
-      unitsPerEm,
-      ascentUnits,
-      descentUnits,
-      totalUnits,
-      ascentRatio: ascentUnits / totalUnits,
-      descentRatio: descentUnits / totalUnits,
-    };
-  }, [getFontMetricsFor]);
+    },
+    [resolveFont, fontMetrics],
+  );
 
-  const getFontWeight = useCallback((
-    fontId: string | null | undefined,
-    pageIndex: number | null | undefined,
-  ): number | 'normal' | 'bold' => {
-    if (!fontId) {
-      return 'normal';
-    }
-    const font = resolveFont(fontId, pageIndex);
-    if (!font || !font.fontDescriptorFlags) {
-      return 'normal';
-    }
+  const getLineHeightPx = useCallback(
+    (
+      fontId: string | null | undefined,
+      pageIndex: number | null | undefined,
+      fontSizePx: number,
+    ): number => {
+      if (fontSizePx <= 0) {
+        return fontSizePx;
+      }
+      const metrics = getFontMetricsFor(fontId, pageIndex);
+      if (!metrics || metrics.unitsPerEm <= 0) {
+        return fontSizePx * 1.2;
+      }
+      const unitsPerEm = metrics.unitsPerEm > 0 ? metrics.unitsPerEm : 1000;
+      const ascentUnits = metrics.ascent ?? unitsPerEm;
+      const descentUnits = Math.abs(metrics.descent ?? -(unitsPerEm * 0.2));
+      const totalUnits = Math.max(unitsPerEm, ascentUnits + descentUnits);
+      if (totalUnits <= 0) {
+        return fontSizePx * 1.2;
+      }
+      const lineHeight = (totalUnits / unitsPerEm) * fontSizePx;
+      return Math.max(lineHeight, fontSizePx * 1.05);
+    },
+    [getFontMetricsFor],
+  );
 
-    // PDF font descriptor flag bit 18 (value 262144 = 0x40000) indicates ForceBold
-    const FORCE_BOLD_FLAG = 262144;
-    if ((font.fontDescriptorFlags & FORCE_BOLD_FLAG) !== 0) {
-      return 'bold';
-    }
+  const getFontGeometry = useCallback(
+    (
+      fontId: string | null | undefined,
+      pageIndex: number | null | undefined,
+    ):
+      | {
+          unitsPerEm: number;
+          ascentUnits: number;
+          descentUnits: number;
+          totalUnits: number;
+          ascentRatio: number;
+          descentRatio: number;
+        }
+      | undefined => {
+      const metrics = getFontMetricsFor(fontId, pageIndex);
+      if (!metrics) {
+        return undefined;
+      }
+      const unitsPerEm = metrics.unitsPerEm > 0 ? metrics.unitsPerEm : 1000;
+      const rawAscent = metrics.ascent ?? unitsPerEm;
+      const rawDescent = metrics.descent ?? -(unitsPerEm * 0.2);
+      const ascentUnits = Number.isFinite(rawAscent) ? rawAscent : unitsPerEm;
+      const descentUnits = Number.isFinite(rawDescent)
+        ? Math.abs(rawDescent)
+        : unitsPerEm * 0.2;
+      const totalUnits = Math.max(unitsPerEm, ascentUnits + descentUnits);
+      if (totalUnits <= 0 || !Number.isFinite(totalUnits)) {
+        return undefined;
+      }
+      return {
+        unitsPerEm,
+        ascentUnits,
+        descentUnits,
+        totalUnits,
+        ascentRatio: ascentUnits / totalUnits,
+        descentRatio: descentUnits / totalUnits,
+      };
+    },
+    [getFontMetricsFor],
+  );
 
-    // Also check if font name contains "Bold"
-    const fontName = font.standard14Name || font.baseName || '';
-    if (fontName.toLowerCase().includes('bold')) {
-      return 'bold';
-    }
+  const getFontWeight = useCallback(
+    (
+      fontId: string | null | undefined,
+      pageIndex: number | null | undefined,
+    ): number | "normal" | "bold" => {
+      if (!fontId) {
+        return "normal";
+      }
+      const font = resolveFont(fontId, pageIndex);
+      if (!font || !font.fontDescriptorFlags) {
+        return "normal";
+      }
 
-    return 'normal';
-  }, [resolveFont]);
+      // PDF font descriptor flag bit 18 (value 262144 = 0x40000) indicates ForceBold
+      const FORCE_BOLD_FLAG = 262144;
+      if ((font.fontDescriptorFlags & FORCE_BOLD_FLAG) !== 0) {
+        return "bold";
+      }
+
+      // Also check if font name contains "Bold"
+      const fontName = font.standard14Name || font.baseName || "";
+      if (fontName.toLowerCase().includes("bold")) {
+        return "bold";
+      }
+
+      return "normal";
+    },
+    [resolveFont],
+  );
 
   const visibleGroups = useMemo(
     () =>
@@ -957,47 +1133,66 @@ const PdfTextEditorView = ({ data }: PdfTextEditorViewProps) => {
         .map((group, index) => ({ group, pageGroupIndex: index }))
         .filter(({ group }) => {
           const hasContent =
-            ((group.text ?? '').trim().length > 0) ||
-            ((group.originalText ?? '').trim().length > 0);
+            (group.text ?? "").trim().length > 0 ||
+            (group.originalText ?? "").trim().length > 0;
           return hasContent || editingGroupId === group.id;
         }),
     [editingGroupId, pageGroups],
   );
 
-const orderedImages = useMemo(
-  () =>
-    [...pageImages].sort(
-      (first, second) => (first?.zOrder ?? -1_000_000) - (second?.zOrder ?? -1_000_000),
-    ),
-  [pageImages],
-);
-const scale = useMemo(() => {
-  const calculatedScale = Math.min(MAX_RENDER_WIDTH / pageWidth, 2.5);
-  console.log(`� [PdfTextEditor] Scale Calculation:`, {
-    MAX_RENDER_WIDTH,
-    pageWidth,
+  const orderedImages = useMemo(
+    () =>
+      [...pageImages].sort(
+        (first, second) =>
+          (first?.zOrder ?? -1_000_000) - (second?.zOrder ?? -1_000_000),
+      ),
+    [pageImages],
+  );
+  const scale = useMemo(() => {
+    const calculatedScale = Math.min(MAX_RENDER_WIDTH / pageWidth, 2.5);
+    console.log(`� [PdfTextEditor] Scale Calculation:`, {
+      MAX_RENDER_WIDTH,
+      pageWidth,
+      pageHeight,
+      calculatedScale: calculatedScale.toFixed(3),
+      scaledWidth: (pageWidth * calculatedScale).toFixed(2),
+      scaledHeight: (pageHeight * calculatedScale).toFixed(2),
+    });
+    return calculatedScale;
+  }, [pageWidth, pageHeight]);
+  const scaledWidth = pageWidth * scale;
+  const scaledHeight = pageHeight * scale;
+  const selectionToolbarPosition = useMemo(() => {
+    if (!hasSelection) {
+      return null;
+    }
+    const firstSelected = pageGroups.find((group) =>
+      selectedGroupIds.has(group.id),
+    );
+    if (!firstSelected) {
+      return null;
+    }
+    const bounds = toCssBounds(
+      currentPage,
+      pageHeight,
+      scale,
+      firstSelected.bounds,
+    );
+    const top = Math.max(bounds.top - 40, 8);
+    const left = Math.min(
+      Math.max(bounds.left, 8),
+      Math.max(scaledWidth - 220, 8),
+    );
+    return { left, top };
+  }, [
+    hasSelection,
+    pageGroups,
+    selectedGroupIds,
+    currentPage,
     pageHeight,
-    calculatedScale: calculatedScale.toFixed(3),
-    scaledWidth: (pageWidth * calculatedScale).toFixed(2),
-    scaledHeight: (pageHeight * calculatedScale).toFixed(2),
-  });
-  return calculatedScale;
-}, [pageWidth, pageHeight]);
-const scaledWidth = pageWidth * scale;
-const scaledHeight = pageHeight * scale;
-const selectionToolbarPosition = useMemo(() => {
-  if (!hasSelection) {
-    return null;
-  }
-  const firstSelected = pageGroups.find((group) => selectedGroupIds.has(group.id));
-  if (!firstSelected) {
-    return null;
-  }
-  const bounds = toCssBounds(currentPage, pageHeight, scale, firstSelected.bounds);
-  const top = Math.max(bounds.top - 40, 8);
-  const left = Math.min(Math.max(bounds.left, 8), Math.max(scaledWidth - 220, 8));
-  return { left, top };
-}, [hasSelection, pageGroups, selectedGroupIds, currentPage, pageHeight, scale, scaledWidth]);
+    scale,
+    scaledWidth,
+  ]);
 
   useEffect(() => {
     if (!hasDocument || !hasVectorPreview) {
@@ -1007,14 +1202,21 @@ const selectionToolbarPosition = useMemo(() => {
     if (selectedPage + 1 < pages.length) {
       requestPagePreview(selectedPage + 1, scale);
     }
-  }, [hasDocument, hasVectorPreview, selectedPage, scale, pages.length, requestPagePreview]);
+  }, [
+    hasDocument,
+    hasVectorPreview,
+    selectedPage,
+    scale,
+    pages.length,
+    requestPagePreview,
+  ]);
 
   useEffect(() => {
     setActiveGroupId(null);
     setEditingGroupId(null);
     setActiveImageId(null);
     setTextScales(new Map());
-    measurementKeyRef.current = '';
+    measurementKeyRef.current = "";
   }, [selectedPage]);
 
   // Measure text widths once per page/configuration and apply static scaling
@@ -1022,7 +1224,7 @@ const selectionToolbarPosition = useMemo(() => {
     if (!autoScaleText) {
       // Clear all scales when auto-scale is disabled
       setTextScales(new Map());
-      measurementKeyRef.current = '';
+      measurementKeyRef.current = "";
       return;
     }
 
@@ -1054,7 +1256,7 @@ const selectionToolbarPosition = useMemo(() => {
           return;
         }
 
-        const lineCount = (group.text || '').split('\n').length;
+        const lineCount = (group.text || "").split("\n").length;
 
         // Skip multi-line paragraphs - auto-scaling doesn't work well with wrapped text
         if (lineCount > 1) {
@@ -1062,21 +1264,30 @@ const selectionToolbarPosition = useMemo(() => {
           return;
         }
 
-        const element = document.querySelector<HTMLElement>(`[data-text-group="${group.id}"]`);
+        const element = document.querySelector<HTMLElement>(
+          `[data-text-group="${group.id}"]`,
+        );
         if (!element) {
           return;
         }
 
-        const textSpan = element.querySelector<HTMLSpanElement>('span[data-text-content]');
+        const textSpan = element.querySelector<HTMLSpanElement>(
+          "span[data-text-content]",
+        );
         if (!textSpan) {
           return;
         }
 
         // Temporarily remove any existing transform to get natural width
         const originalTransform = textSpan.style.transform;
-        textSpan.style.transform = 'none';
+        textSpan.style.transform = "none";
 
-        const _bounds = toCssBounds(currentPage, pageHeight, scale, group.bounds);
+        const _bounds = toCssBounds(
+          currentPage,
+          pageHeight,
+          scale,
+          group.bounds,
+        );
         const { width: resolvedWidth } = resolveGroupWidth(group);
         const containerWidth = resolvedWidth * scale;
         const textWidth = textSpan.getBoundingClientRect().width;
@@ -1136,7 +1347,9 @@ const selectionToolbarPosition = useMemo(() => {
     if (!editingGroupId) {
       return;
     }
-    const editor = document.querySelector<HTMLElement>(`[data-editor-group="${editingGroupId}"]`);
+    const editor = document.querySelector<HTMLElement>(
+      `[data-editor-group="${editingGroupId}"]`,
+    );
     if (editor) {
       if (document.activeElement !== editor) {
         editor.focus();
@@ -1196,7 +1409,8 @@ const selectionToolbarPosition = useMemo(() => {
   const handleSelectionInteraction = useCallback(
     (groupId: string, groupIndex: number, event: React.MouseEvent): boolean => {
       const multiSelect = event.metaKey || event.ctrlKey;
-      const rangeSelect = event.shiftKey && lastSelectedGroupIdRef.current !== null;
+      const rangeSelect =
+        event.shiftKey && lastSelectedGroupIdRef.current !== null;
       setSelectedGroupIds((previous) => {
         if (multiSelect) {
           const next = new Set(previous);
@@ -1209,7 +1423,9 @@ const selectionToolbarPosition = useMemo(() => {
         }
         if (rangeSelect) {
           const anchorId = lastSelectedGroupIdRef.current;
-          const anchorIndex = anchorId ? pageGroups.findIndex((group) => group.id === anchorId) : -1;
+          const anchorIndex = anchorId
+            ? pageGroups.findIndex((group) => group.id === anchorId)
+            : -1;
           if (anchorIndex === -1) {
             return new Set([groupId]);
           }
@@ -1265,8 +1481,8 @@ const selectionToolbarPosition = useMemo(() => {
       };
       const handleMouseUp = () => {
         resizingRef.current = null;
-        window.removeEventListener('mousemove', handleMouseMove);
-        window.removeEventListener('mouseup', handleMouseUp);
+        window.removeEventListener("mousemove", handleMouseMove);
+        window.removeEventListener("mouseup", handleMouseUp);
       };
       resizingRef.current = {
         groupId: group.id,
@@ -1275,8 +1491,8 @@ const selectionToolbarPosition = useMemo(() => {
         baseWidth,
         maxWidth,
       };
-      window.addEventListener('mousemove', handleMouseMove);
-      window.addEventListener('mouseup', handleMouseUp);
+      window.addEventListener("mousemove", handleMouseMove);
+      window.addEventListener("mouseup", handleMouseUp);
     },
     [pageWidth, scale],
   );
@@ -1295,34 +1511,34 @@ const selectionToolbarPosition = useMemo(() => {
     <Box
       component="div"
       style={{
-        width: 'calc(100% + 4px)',
-        height: 'calc(100% + 6px)',
-        marginLeft: '-2px',
-        marginTop: '-3px',
+        width: "calc(100% + 4px)",
+        height: "calc(100% + 6px)",
+        marginLeft: "-2px",
+        marginTop: "-3px",
         outline: isActive
-          ? '2px solid var(--mantine-color-blue-5)'
+          ? "2px solid var(--mantine-color-blue-5)"
           : isSelected
-            ? '1px solid var(--mantine-color-violet-5)'
+            ? "1px solid var(--mantine-color-violet-5)"
             : isChanged
-              ? '1px solid var(--mantine-color-yellow-5)'
-              : 'none',
-        outlineOffset: '-1px',
+              ? "1px solid var(--mantine-color-yellow-5)"
+              : "none",
+        outlineOffset: "-1px",
         borderRadius: 6,
         backgroundColor: isActive
-          ? 'rgba(184,212,255,0.35)'
+          ? "rgba(184,212,255,0.35)"
           : isSelected
-            ? 'rgba(206,190,255,0.32)'
+            ? "rgba(206,190,255,0.32)"
             : isChanged
-              ? 'rgba(250,255,189,0.28)'
-              : 'transparent',
-        transition: 'outline 120ms ease, background-color 120ms ease',
-        pointerEvents: 'auto',
-        overflow: 'visible',
-        display: 'flex',
-        alignItems: 'flex-start',
-        justifyContent: 'flex-start',
-        padding: '3px 2px 3px 2px',
-        position: 'relative',
+              ? "rgba(250,255,189,0.28)"
+              : "transparent",
+        transition: "outline 120ms ease, background-color 120ms ease",
+        pointerEvents: "auto",
+        overflow: "visible",
+        display: "flex",
+        alignItems: "flex-start",
+        justifyContent: "flex-start",
+        padding: "3px 2px 3px 2px",
+        position: "relative",
       }}
       onClick={(event) => {
         event.stopPropagation();
@@ -1342,12 +1558,12 @@ const selectionToolbarPosition = useMemo(() => {
           color="red"
           radius="xl"
           style={{
-            position: 'absolute',
+            position: "absolute",
             top: -8,
             right: -8,
             zIndex: 9999,
-            cursor: 'pointer',
-            pointerEvents: 'auto',
+            cursor: "pointer",
+            pointerEvents: "auto",
           }}
           onMouseDown={(event) => {
             console.log(`� MOUSEDOWN on X button for group ${groupId}`);
@@ -1356,8 +1572,8 @@ const selectionToolbarPosition = useMemo(() => {
 
             // Find the current group to check if it's already empty
             const currentGroups = groupsByPage[pageIndex] ?? [];
-            const currentGroup = currentGroups.find(g => g.id === groupId);
-            const currentText = (currentGroup?.text ?? '').trim();
+            const currentGroup = currentGroups.find((g) => g.id === groupId);
+            const currentText = (currentGroup?.text ?? "").trim();
 
             if (currentText.length === 0) {
               // Already empty - remove the textbox entirely
@@ -1368,12 +1584,14 @@ const selectionToolbarPosition = useMemo(() => {
             } else {
               // Has text - clear it but keep the textbox
               console.log(`   Clearing text (textbox remains)`);
-              onGroupEdit(pageIndex, groupId, '');
+              onGroupEdit(pageIndex, groupId, "");
             }
             console.log(`   Operation completed`);
           }}
           onClick={(event) => {
-            console.log(`� X button ONCLICK fired for group ${groupId} on page ${pageIndex}`);
+            console.log(
+              `� X button ONCLICK fired for group ${groupId} on page ${pageIndex}`,
+            );
             event.stopPropagation();
             event.preventDefault();
           }}
@@ -1401,7 +1619,13 @@ const selectionToolbarPosition = useMemo(() => {
       const minTop = Math.min(height, pageHeight);
       const top = Math.min(Math.max(rawTop, minTop), pageHeight);
       const bottom = Math.max(top - height, 0);
-      onImageTransform(selectedPage, imageId, { left, bottom, width, height, transform: [] });
+      onImageTransform(selectedPage, imageId, {
+        left,
+        bottom,
+        width,
+        height,
+        transform: [],
+      });
     },
     [onImageTransform, pageHeight, pageWidth, scale, selectedPage],
   );
@@ -1411,11 +1635,11 @@ const selectionToolbarPosition = useMemo(() => {
       gap="xl"
       className="h-full"
       style={{
-        padding: '1.5rem',
-        overflow: 'hidden',
-        height: '100%',
-        display: 'flex',
-        flexDirection: 'column',
+        padding: "1.5rem",
+        overflow: "hidden",
+        height: "100%",
+        display: "flex",
+        flexDirection: "column",
       }}
     >
       {errorMessage && (
@@ -1433,7 +1657,7 @@ const selectionToolbarPosition = useMemo(() => {
         <Stack
           align="center"
           justify="center"
-          style={{ flex: 1, height: '100%' }}
+          style={{ flex: 1, height: "100%" }}
         >
           <Dropzone
             onDrop={(files) => {
@@ -1441,30 +1665,39 @@ const selectionToolbarPosition = useMemo(() => {
                 onLoadFile(files[0]);
               }
             }}
-            accept={['application/pdf', 'application/json']}
+            accept={["application/pdf", "application/json"]}
             maxFiles={1}
             style={{
-              width: '100%',
+              width: "100%",
               maxWidth: 480,
               minHeight: 200,
-              display: 'flex',
-              alignItems: 'center',
-              justifyContent: 'center',
-              border: '2px dashed var(--mantine-color-gray-4)',
-              borderRadius: 'var(--mantine-radius-lg)',
-              cursor: 'pointer',
-              transition: 'border-color 150ms ease, background-color 150ms ease',
+              display: "flex",
+              alignItems: "center",
+              justifyContent: "center",
+              border: "2px dashed var(--mantine-color-gray-4)",
+              borderRadius: "var(--mantine-radius-lg)",
+              cursor: "pointer",
+              transition:
+                "border-color 150ms ease, background-color 150ms ease",
             }}
           >
-            <Stack align="center" gap="md" style={{ pointerEvents: 'none' }}>
-              <UploadFileIcon sx={{ fontSize: 48, color: 'var(--mantine-color-blue-5)' }} />
+            <Stack align="center" gap="md" style={{ pointerEvents: "none" }}>
+              <UploadFileIcon
+                sx={{ fontSize: 48, color: "var(--mantine-color-blue-5)" }}
+              />
               <Text size="lg" fw={600}>
-                {t('pdfTextEditor.empty.title', 'No document loaded')}
+                {t("pdfTextEditor.empty.title", "No document loaded")}
               </Text>
               <Text size="sm" c="dimmed" ta="center" maw={420}>
                 {activeFiles.length > 0
-                  ? t('pdfTextEditor.empty.dropzoneWithFiles', 'Select a file from the Files tab, or drag and drop a PDF here, or click to browse')
-                  : t('pdfTextEditor.empty.dropzone', 'Drag and drop a PDF here, or click to browse')}
+                  ? t(
+                      "pdfTextEditor.empty.dropzoneWithFiles",
+                      "Select a file from the Files tab, or drag and drop a PDF here, or click to browse",
+                    )
+                  : t(
+                      "pdfTextEditor.empty.dropzone",
+                      "Drag and drop a PDF here, or click to browse",
+                    )}
               </Text>
             </Stack>
           </Dropzone>
@@ -1479,17 +1712,24 @@ const selectionToolbarPosition = useMemo(() => {
                 <Text size="lg" fw={600} mb="xs">
                   {conversionProgress
                     ? conversionProgress.message
-                    : t('pdfTextEditor.converting', 'Converting PDF to editable format...')}
+                    : t(
+                        "pdfTextEditor.converting",
+                        "Converting PDF to editable format...",
+                      )}
                 </Text>
                 {conversionProgress && (
                   <Group gap="xs">
                     <Text size="sm" c="dimmed" tt="capitalize">
-                      {t(`pdfTextEditor.stages.${conversionProgress.stage}`, conversionProgress.stage)}
+                      {t(
+                        `pdfTextEditor.stages.${conversionProgress.stage}`,
+                        conversionProgress.stage,
+                      )}
                     </Text>
                     {conversionProgress.current !== undefined &&
                       conversionProgress.total !== undefined && (
                         <Text size="sm" c="dimmed">
-                          • Page {conversionProgress.current} of {conversionProgress.total}
+                          • Page {conversionProgress.current} of{" "}
+                          {conversionProgress.total}
                         </Text>
                       )}
                   </Group>
@@ -1497,7 +1737,11 @@ const selectionToolbarPosition = useMemo(() => {
               </div>
               <AutorenewIcon sx={{ fontSize: 36 }} className="animate-spin" />
             </Group>
-            <Progress value={conversionProgress?.percent || 0} size="lg" radius="md" />
+            <Progress
+              value={conversionProgress?.percent || 0}
+              size="lg"
+              radius="md"
+            />
           </Stack>
         </Card>
       )}
@@ -1509,24 +1753,28 @@ const selectionToolbarPosition = useMemo(() => {
           style={{
             minHeight: 0,
             flex: 1,
-            overflow: 'hidden',
+            overflow: "hidden",
           }}
         >
           <Group justify="space-between" align="center">
             <Group gap="sm">
               <Text fw={500}>
-                {t('pdfTextEditor.pageSummary', 'Page {{number}} of {{total}}', {
-                  number: selectedPage + 1,
-                  total: pages.length,
-                })}
+                {t(
+                  "pdfTextEditor.pageSummary",
+                  "Page {{number}} of {{total}}",
+                  {
+                    number: selectedPage + 1,
+                    total: pages.length,
+                  },
+                )}
               </Text>
               {dirtyPages[selectedPage] && (
                 <Badge color="yellow" size="xs">
-                  {t('pdfTextEditor.badges.modified', 'Edited')}
+                  {t("pdfTextEditor.badges.modified", "Edited")}
                 </Badge>
               )}
               <Badge color="blue" variant="dot" size="xs">
-                {t('pdfTextEditor.badges.earlyAccess', 'Early Access')}
+                {t("pdfTextEditor.badges.earlyAccess", "Early Access")}
               </Badge>
             </Group>
             {pages.length > 1 && (
@@ -1547,8 +1795,8 @@ const selectionToolbarPosition = useMemo(() => {
                 <InfoOutlinedIcon fontSize="small" />
                 <Text fw={600}>
                   {t(
-                    'pdfTextEditor.welcomeBanner.title',
-                    'Welcome to PDF Text Editor (Early Access)',
+                    "pdfTextEditor.welcomeBanner.title",
+                    "Welcome to PDF Text Editor (Early Access)",
                   )}
                 </Text>
               </Group>
@@ -1559,33 +1807,33 @@ const selectionToolbarPosition = useMemo(() => {
           >
             <div
               style={{
-                display: 'flex',
-                flexDirection: 'column',
-                maxHeight: '70vh',
-                width: '100%',
+                display: "flex",
+                flexDirection: "column",
+                maxHeight: "70vh",
+                width: "100%",
               }}
             >
               {/* Header (fixed) */}
               <div
                 style={{
-                  display: 'flex',
-                  flexDirection: 'column',
-                  gap: '0.5rem',
-                  marginBottom: '0.75rem',
+                  display: "flex",
+                  flexDirection: "column",
+                  gap: "0.5rem",
+                  marginBottom: "0.75rem",
                 }}
               >
                 <Alert color="orange" variant="light" radius="md">
                   <Text size="sm" fw={500}>
                     {t(
-                      'pdfTextEditor.welcomeBanner.experimental',
-                      'This is an experimental feature in active development. Expect some instability and issues during use.',
+                      "pdfTextEditor.welcomeBanner.experimental",
+                      "This is an experimental feature in active development. Expect some instability and issues during use.",
                     )}
                   </Text>
                 </Alert>
                 <Text size="sm">
                   {t(
-                    'pdfTextEditor.welcomeBanner.howItWorks',
-                    'This tool converts your PDF to an editable format where you can modify text content and reposition images. Changes are saved back as a new PDF.',
+                    "pdfTextEditor.welcomeBanner.howItWorks",
+                    "This tool converts your PDF to an editable format where you can modify text content and reposition images. Changes are saved back as a new PDF.",
                   )}
                 </Text>
               </div>
@@ -1595,138 +1843,150 @@ const selectionToolbarPosition = useMemo(() => {
                 style={{
                   flex: 1,
                   minHeight: 0,
-                  overflowY: 'auto',
-                  paddingRight: '0.25rem',
+                  overflowY: "auto",
+                  paddingRight: "0.25rem",
                 }}
               >
                 <div
                   style={{
-                    display: 'flex',
-                    flexDirection: 'column',
-                    gap: '0.5rem',
+                    display: "flex",
+                    flexDirection: "column",
+                    gap: "0.5rem",
                   }}
                 >
                   <Divider />
                   <Text size="sm" fw={500} c="green.7">
-                    {t('pdfTextEditor.welcomeBanner.bestFor', 'Works Best With:')}
+                    {t(
+                      "pdfTextEditor.welcomeBanner.bestFor",
+                      "Works Best With:",
+                    )}
                   </Text>
                   <Text
                     size="sm"
                     component="ul"
-                    style={{ marginLeft: '1rem', marginTop: '0.25rem' }}
+                    style={{ marginLeft: "1rem", marginTop: "0.25rem" }}
                   >
                     <li>
                       {t(
-                        'pdfTextEditor.welcomeBanner.bestFor1',
-                        'Simple PDFs containing primarily text and images',
+                        "pdfTextEditor.welcomeBanner.bestFor1",
+                        "Simple PDFs containing primarily text and images",
                       )}
                     </li>
                     <li>
                       {t(
-                        'pdfTextEditor.welcomeBanner.bestFor2',
-                        'Documents with standard paragraph formatting',
+                        "pdfTextEditor.welcomeBanner.bestFor2",
+                        "Documents with standard paragraph formatting",
                       )}
                     </li>
                     <li>
                       {t(
-                        'pdfTextEditor.welcomeBanner.bestFor3',
-                        'Letters, essays, reports, and basic documents',
+                        "pdfTextEditor.welcomeBanner.bestFor3",
+                        "Letters, essays, reports, and basic documents",
                       )}
                     </li>
                   </Text>
                   <Divider />
                   <Text size="sm" fw={500} c="orange.7">
-                    {t('pdfTextEditor.welcomeBanner.notIdealFor', 'Not Ideal For:')}
+                    {t(
+                      "pdfTextEditor.welcomeBanner.notIdealFor",
+                      "Not Ideal For:",
+                    )}
                   </Text>
                   <Text
                     size="sm"
                     component="ul"
-                    style={{ marginLeft: '1rem', marginTop: '0.25rem' }}
+                    style={{ marginLeft: "1rem", marginTop: "0.25rem" }}
                   >
                     <li>
                       {t(
-                        'pdfTextEditor.welcomeBanner.notIdealFor1',
-                        'PDFs with special formatting like bullet points, tables, or multi-column layouts',
+                        "pdfTextEditor.welcomeBanner.notIdealFor1",
+                        "PDFs with special formatting like bullet points, tables, or multi-column layouts",
                       )}
                     </li>
                     <li>
                       {t(
-                        'pdfTextEditor.welcomeBanner.notIdealFor2',
-                        'Magazines, brochures, or heavily designed documents',
+                        "pdfTextEditor.welcomeBanner.notIdealFor2",
+                        "Magazines, brochures, or heavily designed documents",
                       )}
                     </li>
                     <li>
                       {t(
-                        'pdfTextEditor.welcomeBanner.notIdealFor3',
-                        'Instruction manuals with complex layouts',
+                        "pdfTextEditor.welcomeBanner.notIdealFor3",
+                        "Instruction manuals with complex layouts",
                       )}
                     </li>
                   </Text>
                   <Divider />
                   <Text size="sm" fw={500}>
-                    {t('pdfTextEditor.welcomeBanner.limitations', 'Current Limitations:')}
+                    {t(
+                      "pdfTextEditor.welcomeBanner.limitations",
+                      "Current Limitations:",
+                    )}
                   </Text>
                   <Text
                     size="sm"
                     component="ul"
-                    style={{ marginLeft: '1rem', marginTop: '0.25rem' }}
+                    style={{ marginLeft: "1rem", marginTop: "0.25rem" }}
                   >
                     <li>
                       {t(
-                        'pdfTextEditor.welcomeBanner.limitation1',
-                        'Font rendering may differ slightly from the original PDF',
+                        "pdfTextEditor.welcomeBanner.limitation1",
+                        "Font rendering may differ slightly from the original PDF",
                       )}
                     </li>
                     <li>
                       {t(
-                        'pdfTextEditor.welcomeBanner.limitation2',
-                        'Complex graphics, form fields, and annotations are preserved but not editable',
+                        "pdfTextEditor.welcomeBanner.limitation2",
+                        "Complex graphics, form fields, and annotations are preserved but not editable",
                       )}
                     </li>
                     <li>
                       {t(
-                        'pdfTextEditor.welcomeBanner.limitation3',
-                        'Large files may take time to convert and process',
+                        "pdfTextEditor.welcomeBanner.limitation3",
+                        "Large files may take time to convert and process",
                       )}
                     </li>
                   </Text>
                   <Divider />
                   <Text size="sm" fw={500}>
-                    {t('pdfTextEditor.welcomeBanner.knownIssues', 'Known Issues (Being Fixed):')}
+                    {t(
+                      "pdfTextEditor.welcomeBanner.knownIssues",
+                      "Known Issues (Being Fixed):",
+                    )}
                   </Text>
                   <Text
                     size="sm"
                     component="ul"
-                    style={{ marginLeft: '1rem', marginTop: '0.25rem' }}
+                    style={{ marginLeft: "1rem", marginTop: "0.25rem" }}
                   >
                     <li>
                       {t(
-                        'pdfTextEditor.welcomeBanner.issue1',
-                        'Text colour is not currently preserved (will be added soon)',
+                        "pdfTextEditor.welcomeBanner.issue1",
+                        "Text colour is not currently preserved (will be added soon)",
                       )}
                     </li>
                     <li>
                       {t(
-                        'pdfTextEditor.welcomeBanner.issue2',
-                        'Paragraph mode has more alignment and spacing issues - Single Line mode recommended',
+                        "pdfTextEditor.welcomeBanner.issue2",
+                        "Paragraph mode has more alignment and spacing issues - Single Line mode recommended",
                       )}
                     </li>
                     <li>
                       {t(
-                        'pdfTextEditor.welcomeBanner.issue3',
-                        'The preview display differs from the exported PDF - exported PDFs are closer to the original',
+                        "pdfTextEditor.welcomeBanner.issue3",
+                        "The preview display differs from the exported PDF - exported PDFs are closer to the original",
                       )}
                     </li>
                     <li>
                       {t(
-                        'pdfTextEditor.welcomeBanner.issue4',
-                        'Rotated text alignment may need manual adjustment',
+                        "pdfTextEditor.welcomeBanner.issue4",
+                        "Rotated text alignment may need manual adjustment",
                       )}
                     </li>
                     <li>
                       {t(
-                        'pdfTextEditor.welcomeBanner.issue5',
-                        'Transparency and layering effects may vary from original',
+                        "pdfTextEditor.welcomeBanner.issue5",
+                        "Transparency and layering effects may vary from original",
                       )}
                     </li>
                   </Text>
@@ -1736,22 +1996,28 @@ const selectionToolbarPosition = useMemo(() => {
               {/* Footer (fixed) */}
               <div
                 style={{
-                  marginTop: '0.75rem',
+                  marginTop: "0.75rem",
                 }}
               >
                 <Divider />
                 <Text size="xs" c="dimmed" mt="xs">
                   {t(
-                    'pdfTextEditor.welcomeBanner.feedback',
-                    'This is an early access feature. Please report any issues you encounter to help us improve!',
+                    "pdfTextEditor.welcomeBanner.feedback",
+                    "This is an early access feature. Please report any issues you encounter to help us improve!",
                   )}
                 </Text>
                 <Group justify="flex-end" gap="sm" mt="xs">
-                  <Button variant="default" onClick={handleDismissWelcomeBanner}>
-                    {t('pdfTextEditor.welcomeBanner.gotIt', 'Got it')}
+                  <Button
+                    variant="default"
+                    onClick={handleDismissWelcomeBanner}
+                  >
+                    {t("pdfTextEditor.welcomeBanner.gotIt", "Got it")}
                   </Button>
                   <Button onClick={handleDontShowAgain}>
-                    {t('pdfTextEditor.welcomeBanner.dontShowAgain', "Don't show again")}
+                    {t(
+                      "pdfTextEditor.welcomeBanner.dontShowAgain",
+                      "Don't show again",
+                    )}
                   </Button>
                 </Group>
               </div>
@@ -1763,35 +2029,43 @@ const selectionToolbarPosition = useMemo(() => {
             padding="md"
             radius="md"
             shadow="xs"
-            style={{ flex: 1, minHeight: 0, height: '100%', overflow: 'hidden' }}
+            style={{
+              flex: 1,
+              minHeight: 0,
+              height: "100%",
+              overflow: "hidden",
+            }}
           >
-            <ScrollArea style={{ height: '100%', maxHeight: '100%' }} offsetScrollbars>
+            <ScrollArea
+              style={{ height: "100%", maxHeight: "100%" }}
+              offsetScrollbars
+            >
               <Box
                 style={{
-                  display: 'flex',
-                  justifyContent: 'center',
-                  alignItems: 'flex-start',
-                  width: '100%',
-                  minHeight: '100%',
+                  display: "flex",
+                  justifyContent: "center",
+                  alignItems: "flex-start",
+                  width: "100%",
+                  minHeight: "100%",
                 }}
               >
                 <Box
                   style={{
-                    background: '#f3f4f6',
-                    padding: '0.5rem',
-                    borderRadius: '0.75rem',
+                    background: "#f3f4f6",
+                    padding: "0.5rem",
+                    borderRadius: "0.75rem",
                   }}
                   onClick={handleBackgroundClick}
                 >
                   <Box
                     style={{
-                      position: 'relative',
+                      position: "relative",
                       width: `${scaledWidth}px`,
                       height: `${scaledHeight}px`,
-                      backgroundColor: '#ffffff',
-                      boxShadow: '0 0 12px rgba(15, 23, 42, 0.12)',
-                      borderRadius: '0.5rem',
-                      overflow: 'hidden',
+                      backgroundColor: "#ffffff",
+                      boxShadow: "0 0 12px rgba(15, 23, 42, 0.12)",
+                      borderRadius: "0.5rem",
+                      overflow: "hidden",
                     }}
                     ref={(node) => {
                       containerRef.current = node;
@@ -1809,15 +2083,15 @@ const selectionToolbarPosition = useMemo(() => {
                     {pagePreview && (
                       <img
                         src={pagePreview}
-                        alt={t('pdfTextEditor.pagePreviewAlt', 'Page preview')}
+                        alt={t("pdfTextEditor.pagePreviewAlt", "Page preview")}
                         style={{
-                          position: 'absolute',
+                          position: "absolute",
                           inset: 0,
-                          width: '100%',
-                          height: '100%',
-                          objectFit: 'contain',
-                          pointerEvents: 'none',
-                          userSelect: 'none',
+                          width: "100%",
+                          height: "100%",
+                          objectFit: "contain",
+                          pointerEvents: "none",
+                          userSelect: "none",
                           zIndex: 0,
                         }}
                       />
@@ -1826,15 +2100,15 @@ const selectionToolbarPosition = useMemo(() => {
                       <Group
                         gap={6}
                         style={{
-                          position: 'absolute',
+                          position: "absolute",
                           left: `${selectionToolbarPosition.left}px`,
                           top: `${selectionToolbarPosition.top}px`,
                           zIndex: 3_000_000,
-                          backgroundColor: 'rgba(15, 23, 42, 0.92)',
+                          backgroundColor: "rgba(15, 23, 42, 0.92)",
                           borderRadius: 999,
-                          padding: '4px 8px',
-                          boxShadow: '0 4px 16px rgba(15, 23, 42, 0.45)',
-                          pointerEvents: 'auto',
+                          padding: "4px 8px",
+                          boxShadow: "0 4px 16px rgba(15, 23, 42, 0.45)",
+                          pointerEvents: "auto",
                         }}
                         onMouseDown={(event) => {
                           event.stopPropagation();
@@ -1843,552 +2117,779 @@ const selectionToolbarPosition = useMemo(() => {
                           event.stopPropagation();
                         }}
                       >
-                {canMergeSelection && (
-                  <Tooltip label={t('pdfTextEditor.manual.mergeTooltip', 'Merge selected boxes')}>
-                    <ActionIcon
-                      size="sm"
-                      variant="light"
-                      color="blue"
-                      aria-label={t('pdfTextEditor.manual.merge', 'Merge selection')}
-                      onClick={handleMergeSelection}
-                    >
-                      <MergeTypeIcon fontSize="small" />
-                    </ActionIcon>
-                  </Tooltip>
-                )}
-                {canUngroupSelection && (
-                  <Tooltip label={t('pdfTextEditor.manual.ungroupTooltip', 'Split paragraph back into lines')}>
-                    <ActionIcon
-                      size="sm"
-                      variant="light"
-                      color="blue"
-                      aria-label={t('pdfTextEditor.manual.ungroup', 'Ungroup selection')}
-                      onClick={handleUngroupSelection}
-                    >
-                      <CallSplitIcon fontSize="small" />
-                    </ActionIcon>
-                  </Tooltip>
-                )}
-                <Menu withinPortal position="bottom-end" shadow="md" disabled={!hasSelection && !hasWidthOverrides}>
-                  <Menu.Target>
-                    <ActionIcon
-                      size="sm"
-                      variant="light"
-                      color="blue"
-                      aria-label={t('pdfTextEditor.manual.widthMenu', 'Width options')}
-                      onMouseDown={(event) => event.stopPropagation()}
-                      onClick={(event) => event.stopPropagation()}
-                    >
-                      <MoreVertIcon fontSize="small" />
-                    </ActionIcon>
-                  </Menu.Target>
-                  <Menu.Dropdown>
+                        {canMergeSelection && (
+                          <Tooltip
+                            label={t(
+                              "pdfTextEditor.manual.mergeTooltip",
+                              "Merge selected boxes",
+                            )}
+                          >
+                            <ActionIcon
+                              size="sm"
+                              variant="light"
+                              color="blue"
+                              aria-label={t(
+                                "pdfTextEditor.manual.merge",
+                                "Merge selection",
+                              )}
+                              onClick={handleMergeSelection}
+                            >
+                              <MergeTypeIcon fontSize="small" />
+                            </ActionIcon>
+                          </Tooltip>
+                        )}
+                        {canUngroupSelection && (
+                          <Tooltip
+                            label={t(
+                              "pdfTextEditor.manual.ungroupTooltip",
+                              "Split paragraph back into lines",
+                            )}
+                          >
+                            <ActionIcon
+                              size="sm"
+                              variant="light"
+                              color="blue"
+                              aria-label={t(
+                                "pdfTextEditor.manual.ungroup",
+                                "Ungroup selection",
+                              )}
+                              onClick={handleUngroupSelection}
+                            >
+                              <CallSplitIcon fontSize="small" />
+                            </ActionIcon>
+                          </Tooltip>
+                        )}
+                        <Menu
+                          withinPortal
+                          position="bottom-end"
+                          shadow="md"
+                          disabled={!hasSelection && !hasWidthOverrides}
+                        >
+                          <Menu.Target>
+                            <ActionIcon
+                              size="sm"
+                              variant="light"
+                              color="blue"
+                              aria-label={t(
+                                "pdfTextEditor.manual.widthMenu",
+                                "Width options",
+                              )}
+                              onMouseDown={(event) => event.stopPropagation()}
+                              onClick={(event) => event.stopPropagation()}
+                            >
+                              <MoreVertIcon fontSize="small" />
+                            </ActionIcon>
+                          </Menu.Target>
+                          <Menu.Dropdown>
                             <Menu.Item
                               disabled={!hasSelection}
-                              onClick={() => handleWidthAdjustment('expand')}
+                              onClick={() => handleWidthAdjustment("expand")}
                             >
-                              {t('pdfTextEditor.manual.expandWidth', 'Expand to page edge')}
+                              {t(
+                                "pdfTextEditor.manual.expandWidth",
+                                "Expand to page edge",
+                              )}
                             </Menu.Item>
                             <Menu.Item
                               disabled={!hasWidthOverrides}
-                              onClick={() => handleWidthAdjustment('reset')}
+                              onClick={() => handleWidthAdjustment("reset")}
                             >
-                              {t('pdfTextEditor.manual.resetWidth', 'Reset width')}
+                              {t(
+                                "pdfTextEditor.manual.resetWidth",
+                                "Reset width",
+                              )}
                             </Menu.Item>
                           </Menu.Dropdown>
                         </Menu>
                       </Group>
                     )}
                     {orderedImages.map((image, imageIndex) => {
-                    if (!image?.imageData) {
-                      return null;
-                    }
-                    const bounds = getImageBounds(image);
-                    const width = Math.max(bounds.right - bounds.left, 1);
-                    const height = Math.max(bounds.top - bounds.bottom, 1);
-                    const cssWidth = Math.max(width * scale, 2);
-                    const cssHeight = Math.max(height * scale, 2);
-                    const cssLeft = bounds.left * scale;
-                    const cssTop = (pageHeight - bounds.top) * scale;
-                    const imageId = image.id ?? `page-${selectedPage}-image-${imageIndex}`;
-                    const isActive = activeImageId === imageId;
-                    const src = `data:image/${image.imageFormat ?? 'png'};base64,${image.imageData}`;
-                    const baseZIndex = (image.zOrder ?? -1_000_000) + 1_050_000;
-                    const zIndex = isActive ? baseZIndex + 1_000_000 : baseZIndex;
+                      if (!image?.imageData) {
+                        return null;
+                      }
+                      const bounds = getImageBounds(image);
+                      const width = Math.max(bounds.right - bounds.left, 1);
+                      const height = Math.max(bounds.top - bounds.bottom, 1);
+                      const cssWidth = Math.max(width * scale, 2);
+                      const cssHeight = Math.max(height * scale, 2);
+                      const cssLeft = bounds.left * scale;
+                      const cssTop = (pageHeight - bounds.top) * scale;
+                      const imageId =
+                        image.id ?? `page-${selectedPage}-image-${imageIndex}`;
+                      const isActive = activeImageId === imageId;
+                      const src = `data:image/${image.imageFormat ?? "png"};base64,${image.imageData}`;
+                      const baseZIndex =
+                        (image.zOrder ?? -1_000_000) + 1_050_000;
+                      const zIndex = isActive
+                        ? baseZIndex + 1_000_000
+                        : baseZIndex;
 
-                    return (
-                      <Rnd
-                        ref={(ref) => {
-                          if (ref) {
-                            rndRefs.current.set(imageId, ref);
-                          } else {
-                            rndRefs.current.delete(imageId);
-                          }
-                        }}
-                        key={`image-${imageId}`}
-                        bounds="parent"
-                        size={{ width: cssWidth, height: cssHeight }}
-                        position={{ x: cssLeft, y: cssTop }}
-                        onDragStart={(_event, _data) => {
-                          setActiveGroupId(null);
-                          setEditingGroupId(null);
-                          setActiveImageId(imageId);
-                          draggingImageRef.current = imageId;
-                        }}
-                        onDrag={(_event, data) => {
-                          // Cancel any pending update
-                          if (pendingDragUpdateRef.current) {
-                            cancelAnimationFrame(pendingDragUpdateRef.current);
-                          }
-
-                          // Schedule update on next frame to batch rapid drag events
-                          pendingDragUpdateRef.current = requestAnimationFrame(() => {
-                            const rndRef = rndRefs.current.get(imageId);
-                            if (rndRef && rndRef.updatePosition) {
-                              rndRef.updatePosition({ x: data.x, y: data.y });
+                      return (
+                        <Rnd
+                          ref={(ref) => {
+                            if (ref) {
+                              rndRefs.current.set(imageId, ref);
+                            } else {
+                              rndRefs.current.delete(imageId);
                             }
-                          });
-                        }}
-                        onDragStop={(_event, data) => {
-                          if (pendingDragUpdateRef.current) {
-                            cancelAnimationFrame(pendingDragUpdateRef.current);
-                            pendingDragUpdateRef.current = null;
-                          }
-                          draggingImageRef.current = null;
-                          emitImageTransform(
-                            imageId,
-                            data.x,
-                            data.y,
-                            cssWidth,
-                            cssHeight,
-                          );
-                        }}
-                        onResizeStart={() => {
-                          setActiveImageId(imageId);
-                          setActiveGroupId(null);
-                          setEditingGroupId(null);
-                          draggingImageRef.current = imageId;
-                        }}
-                        onResizeStop={(_event, _direction, ref, _delta, position) => {
-                          draggingImageRef.current = null;
-                          const nextWidth = parseFloat(ref.style.width);
-                          const nextHeight = parseFloat(ref.style.height);
-                          emitImageTransform(
-                            imageId,
-                            position.x,
-                            position.y,
-                            nextWidth,
-                            nextHeight,
-                          );
-                        }}
-                        style={{ zIndex }}
-                      >
-                        <Box
-                          onMouseEnter={() => setActiveImageId(imageId)}
-                          onMouseLeave={() => {
-                            setActiveImageId((current) => (current === imageId ? null : current));
                           }}
-                          onDoubleClick={(event) => {
-                            event.stopPropagation();
-                            onImageReset(selectedPage, imageId);
+                          key={`image-${imageId}`}
+                          bounds="parent"
+                          size={{ width: cssWidth, height: cssHeight }}
+                          position={{ x: cssLeft, y: cssTop }}
+                          onDragStart={(_event, _data) => {
+                            setActiveGroupId(null);
+                            setEditingGroupId(null);
+                            setActiveImageId(imageId);
+                            draggingImageRef.current = imageId;
                           }}
-                          style={{
-                            width: '100%',
-                            height: '100%',
-                            cursor: isActive ? 'grabbing' : 'grab',
-                            outline: isActive
-                              ? '2px solid rgba(59, 130, 246, 0.9)'
-                              : '1px solid rgba(148, 163, 184, 0.4)',
-                            outlineOffset: '-1px',
-                            borderRadius: 4,
-                            backgroundColor: 'rgba(255,255,255,0.04)',
-                            transition: 'outline 120ms ease',
+                          onDrag={(_event, data) => {
+                            // Cancel any pending update
+                            if (pendingDragUpdateRef.current) {
+                              cancelAnimationFrame(
+                                pendingDragUpdateRef.current,
+                              );
+                            }
+
+                            // Schedule update on next frame to batch rapid drag events
+                            pendingDragUpdateRef.current =
+                              requestAnimationFrame(() => {
+                                const rndRef = rndRefs.current.get(imageId);
+                                if (rndRef && rndRef.updatePosition) {
+                                  rndRef.updatePosition({
+                                    x: data.x,
+                                    y: data.y,
+                                  });
+                                }
+                              });
                           }}
+                          onDragStop={(_event, data) => {
+                            if (pendingDragUpdateRef.current) {
+                              cancelAnimationFrame(
+                                pendingDragUpdateRef.current,
+                              );
+                              pendingDragUpdateRef.current = null;
+                            }
+                            draggingImageRef.current = null;
+                            emitImageTransform(
+                              imageId,
+                              data.x,
+                              data.y,
+                              cssWidth,
+                              cssHeight,
+                            );
+                          }}
+                          onResizeStart={() => {
+                            setActiveImageId(imageId);
+                            setActiveGroupId(null);
+                            setEditingGroupId(null);
+                            draggingImageRef.current = imageId;
+                          }}
+                          onResizeStop={(
+                            _event,
+                            _direction,
+                            ref,
+                            _delta,
+                            position,
+                          ) => {
+                            draggingImageRef.current = null;
+                            const nextWidth = parseFloat(ref.style.width);
+                            const nextHeight = parseFloat(ref.style.height);
+                            emitImageTransform(
+                              imageId,
+                              position.x,
+                              position.y,
+                              nextWidth,
+                              nextHeight,
+                            );
+                          }}
+                          style={{ zIndex }}
                         >
-                          <img
-                            src={src}
-                            alt={t('pdfTextEditor.imageLabel', 'Placed image')}
-                            style={{
-                              width: '100%',
-                              height: '100%',
-                              objectFit: 'contain',
-                              pointerEvents: 'none',
-                              userSelect: 'none',
+                          <Box
+                            onMouseEnter={() => setActiveImageId(imageId)}
+                            onMouseLeave={() => {
+                              setActiveImageId((current) =>
+                                current === imageId ? null : current,
+                              );
                             }}
-                          />
-                        </Box>
-                      </Rnd>
-                    );
-                  })}
-                  {visibleGroups.length === 0 && orderedImages.length === 0 ? (
-                    <Group justify="center" align="center" style={{ height: '100%' }}>
-                      <Stack gap={4} align="center">
-                        <Text size="sm" c="dimmed">
-                          {t('pdfTextEditor.noTextOnPage', 'No editable text was detected on this page.')}
-                        </Text>
-                      </Stack>
-                    </Group>
-                  ) : (
-                    visibleGroups.map(({ group, pageGroupIndex }) => {
-                      const bounds = toCssBounds(currentPage, pageHeight, scale, group.bounds);
-                      const changed = group.text !== group.originalText;
-                      const isActive = activeGroupId === group.id || editingGroupId === group.id;
-                      const isEditing = editingGroupId === group.id;
-                      const baseFontSize = group.fontMatrixSize ?? group.fontSize ?? 12;
-                      const fontSizePx = Math.max(baseFontSize * scale, 6);
-                      const effectiveFontId = resolveFontIdForIndex(pageGroupIndex) ?? group.fontId;
-                      const fontFamily = getFontFamily(effectiveFontId, group.pageIndex);
-                      let lineHeightPx = getLineHeightPx(effectiveFontId, group.pageIndex, fontSizePx);
-                      let lineHeightRatio = fontSizePx > 0 ? Math.max(lineHeightPx / fontSizePx, 1.05) : 1.2;
-                      const rotation = group.rotation ?? 0;
-                      const hasRotation = Math.abs(rotation) > 0.5;
-                      const baselineLength = group.baselineLength ?? Math.max(group.bounds.right - group.bounds.left, 0);
-                      const geometry = getFontGeometry(effectiveFontId, group.pageIndex);
-                      const ascentPx = geometry ? Math.max(fontSizePx * geometry.ascentRatio, fontSizePx * 0.7) : fontSizePx * 0.82;
-                      const descentPx = geometry ? Math.max(fontSizePx * geometry.descentRatio, fontSizePx * 0.2) : fontSizePx * 0.22;
-                      lineHeightPx = Math.max(lineHeightPx, ascentPx + descentPx);
-                      if (fontSizePx > 0) {
-                        lineHeightRatio = Math.max(lineHeightRatio, lineHeightPx / fontSizePx);
-                      }
-                      const detectedSpacingPx =
-                        group.lineSpacing && group.lineSpacing > 0 ? group.lineSpacing * scale : undefined;
-                      if (detectedSpacingPx && detectedSpacingPx > 0) {
-                        lineHeightPx = Math.max(lineHeightPx, detectedSpacingPx);
+                            onDoubleClick={(event) => {
+                              event.stopPropagation();
+                              onImageReset(selectedPage, imageId);
+                            }}
+                            style={{
+                              width: "100%",
+                              height: "100%",
+                              cursor: isActive ? "grabbing" : "grab",
+                              outline: isActive
+                                ? "2px solid rgba(59, 130, 246, 0.9)"
+                                : "1px solid rgba(148, 163, 184, 0.4)",
+                              outlineOffset: "-1px",
+                              borderRadius: 4,
+                              backgroundColor: "rgba(255,255,255,0.04)",
+                              transition: "outline 120ms ease",
+                            }}
+                          >
+                            <img
+                              src={src}
+                              alt={t(
+                                "pdfTextEditor.imageLabel",
+                                "Placed image",
+                              )}
+                              style={{
+                                width: "100%",
+                                height: "100%",
+                                objectFit: "contain",
+                                pointerEvents: "none",
+                                userSelect: "none",
+                              }}
+                            />
+                          </Box>
+                        </Rnd>
+                      );
+                    })}
+                    {visibleGroups.length === 0 &&
+                    orderedImages.length === 0 ? (
+                      <Group
+                        justify="center"
+                        align="center"
+                        style={{ height: "100%" }}
+                      >
+                        <Stack gap={4} align="center">
+                          <Text size="sm" c="dimmed">
+                            {t(
+                              "pdfTextEditor.noTextOnPage",
+                              "No editable text was detected on this page.",
+                            )}
+                          </Text>
+                        </Stack>
+                      </Group>
+                    ) : (
+                      visibleGroups.map(({ group, pageGroupIndex }) => {
+                        const bounds = toCssBounds(
+                          currentPage,
+                          pageHeight,
+                          scale,
+                          group.bounds,
+                        );
+                        const changed = group.text !== group.originalText;
+                        const isActive =
+                          activeGroupId === group.id ||
+                          editingGroupId === group.id;
+                        const isEditing = editingGroupId === group.id;
+                        const baseFontSize =
+                          group.fontMatrixSize ?? group.fontSize ?? 12;
+                        const fontSizePx = Math.max(baseFontSize * scale, 6);
+                        const effectiveFontId =
+                          resolveFontIdForIndex(pageGroupIndex) ?? group.fontId;
+                        const fontFamily = getFontFamily(
+                          effectiveFontId,
+                          group.pageIndex,
+                        );
+                        let lineHeightPx = getLineHeightPx(
+                          effectiveFontId,
+                          group.pageIndex,
+                          fontSizePx,
+                        );
+                        let lineHeightRatio =
+                          fontSizePx > 0
+                            ? Math.max(lineHeightPx / fontSizePx, 1.05)
+                            : 1.2;
+                        const rotation = group.rotation ?? 0;
+                        const hasRotation = Math.abs(rotation) > 0.5;
+                        const baselineLength =
+                          group.baselineLength ??
+                          Math.max(group.bounds.right - group.bounds.left, 0);
+                        const geometry = getFontGeometry(
+                          effectiveFontId,
+                          group.pageIndex,
+                        );
+                        const ascentPx = geometry
+                          ? Math.max(
+                              fontSizePx * geometry.ascentRatio,
+                              fontSizePx * 0.7,
+                            )
+                          : fontSizePx * 0.82;
+                        const descentPx = geometry
+                          ? Math.max(
+                              fontSizePx * geometry.descentRatio,
+                              fontSizePx * 0.2,
+                            )
+                          : fontSizePx * 0.22;
+                        lineHeightPx = Math.max(
+                          lineHeightPx,
+                          ascentPx + descentPx,
+                        );
                         if (fontSizePx > 0) {
-                          lineHeightRatio = Math.max(lineHeightRatio, detectedSpacingPx / fontSizePx);
+                          lineHeightRatio = Math.max(
+                            lineHeightRatio,
+                            lineHeightPx / fontSizePx,
+                          );
                         }
-                      }
-                      const lineCount = Math.max(group.text.split('\n').length, 1);
-                      const paragraphHeightPx =
-                        lineCount > 1
-                          ? lineHeightPx + (lineCount - 1) * (detectedSpacingPx ?? lineHeightPx)
-                          : lineHeightPx;
+                        const detectedSpacingPx =
+                          group.lineSpacing && group.lineSpacing > 0
+                            ? group.lineSpacing * scale
+                            : undefined;
+                        if (detectedSpacingPx && detectedSpacingPx > 0) {
+                          lineHeightPx = Math.max(
+                            lineHeightPx,
+                            detectedSpacingPx,
+                          );
+                          if (fontSizePx > 0) {
+                            lineHeightRatio = Math.max(
+                              lineHeightRatio,
+                              detectedSpacingPx / fontSizePx,
+                            );
+                          }
+                        }
+                        const lineCount = Math.max(
+                          group.text.split("\n").length,
+                          1,
+                        );
+                        const paragraphHeightPx =
+                          lineCount > 1
+                            ? lineHeightPx +
+                              (lineCount - 1) *
+                                (detectedSpacingPx ?? lineHeightPx)
+                            : lineHeightPx;
 
-                      let containerLeft = bounds.left;
-                      let containerTop = bounds.top;
-                      const { width: resolvedWidth, base: baseWidth, max: _maxWidth } = resolveGroupWidth(group);
-                      let containerWidth = Math.max(resolvedWidth * scale, fontSizePx);
-                      let containerHeight = Math.max(bounds.height, paragraphHeightPx);
-                      let transform: string | undefined;
-                      let transformOrigin: React.CSSProperties['transformOrigin'];
+                        let containerLeft = bounds.left;
+                        let containerTop = bounds.top;
+                        const {
+                          width: resolvedWidth,
+                          base: baseWidth,
+                          max: _maxWidth,
+                        } = resolveGroupWidth(group);
+                        let containerWidth = Math.max(
+                          resolvedWidth * scale,
+                          fontSizePx,
+                        );
+                        let containerHeight = Math.max(
+                          bounds.height,
+                          paragraphHeightPx,
+                        );
+                        let transform: string | undefined;
+                        let transformOrigin: React.CSSProperties["transformOrigin"];
 
-                      if (hasRotation) {
-                        const anchorX = group.anchor?.x ?? group.bounds.left;
-                        const anchorY = group.anchor?.y ?? group.bounds.bottom;
-                        containerLeft = anchorX * scale;
-                        const anchorTop = Math.max(pageHeight - anchorY, 0) * scale;
-                        containerWidth = Math.max(baselineLength * scale, MIN_BOX_SIZE);
-                        containerHeight = Math.max(lineHeightPx, fontSizePx * lineHeightRatio);
-                        transformOrigin = 'left bottom';
-                        // Negate rotation because Y-axis is flipped from PDF to web coordinates
-                        transform = `rotate(${-rotation}deg)`;
-                        // Align the baseline (PDF anchor) with the bottom edge used as the
-                        // transform origin. Without this adjustment rotated text appears shifted
-                        // downward by roughly one line height.
-                        containerTop = anchorTop - containerHeight;
-                      }
+                        if (hasRotation) {
+                          const anchorX = group.anchor?.x ?? group.bounds.left;
+                          const anchorY =
+                            group.anchor?.y ?? group.bounds.bottom;
+                          containerLeft = anchorX * scale;
+                          const anchorTop =
+                            Math.max(pageHeight - anchorY, 0) * scale;
+                          containerWidth = Math.max(
+                            baselineLength * scale,
+                            MIN_BOX_SIZE,
+                          );
+                          containerHeight = Math.max(
+                            lineHeightPx,
+                            fontSizePx * lineHeightRatio,
+                          );
+                          transformOrigin = "left bottom";
+                          // Negate rotation because Y-axis is flipped from PDF to web coordinates
+                          transform = `rotate(${-rotation}deg)`;
+                          // Align the baseline (PDF anchor) with the bottom edge used as the
+                          // transform origin. Without this adjustment rotated text appears shifted
+                          // downward by roughly one line height.
+                          containerTop = anchorTop - containerHeight;
+                        }
 
-                      if (
-                        lineCount === 1 &&
-                        !hasRotation &&
-                        group.baseline !== null &&
-                        group.baseline !== undefined &&
-                        geometry
-                      ) {
-                        const cssBaselineTop = (pageHeight - group.baseline) * scale;
-                        containerTop = Math.max(cssBaselineTop - ascentPx, 0);
-                        containerHeight = Math.max(containerHeight, ascentPx + descentPx);
-                      }
+                        if (
+                          lineCount === 1 &&
+                          !hasRotation &&
+                          group.baseline !== null &&
+                          group.baseline !== undefined &&
+                          geometry
+                        ) {
+                          const cssBaselineTop =
+                            (pageHeight - group.baseline) * scale;
+                          containerTop = Math.max(cssBaselineTop - ascentPx, 0);
+                          containerHeight = Math.max(
+                            containerHeight,
+                            ascentPx + descentPx,
+                          );
+                        }
 
-                      // Extract styling from group
-                      const textColor = group.color || '#111827';
-                      const fontWeight = group.fontWeight || getFontWeight(effectiveFontId, group.pageIndex);
+                        // Extract styling from group
+                        const textColor = group.color || "#111827";
+                        const fontWeight =
+                          group.fontWeight ||
+                          getFontWeight(effectiveFontId, group.pageIndex);
 
-                      // Determine text wrapping behavior based on whether text has been changed
-                      const hasChanges = changed;
-                      const widthExtended = resolvedWidth - baseWidth > 0.5;
-                      // Only enable wrapping if:
-                      // 1. It's paragraph layout (multi-line groups should wrap)
-                      // 2. Width was manually extended (user explicitly made space for wrapping)
-                      // 3. Has changes AND was already wrapping (preserve existing wrap state)
-                      // DO NOT enable wrapping just because isEditing - text should only wrap when it actually overflows
-                      const wasWrapping = isParagraphLayout || widthExtended;
-                      const enableWrap = wasWrapping || (hasChanges && wasWrapping);
-                      const whiteSpace = enableWrap ? 'pre-wrap' : 'pre';
-                      const wordBreak = enableWrap ? 'break-word' : 'normal';
-                      const overflowWrap = enableWrap ? 'break-word' : 'normal';
+                        // Determine text wrapping behavior based on whether text has been changed
+                        const hasChanges = changed;
+                        const widthExtended = resolvedWidth - baseWidth > 0.5;
+                        // Only enable wrapping if:
+                        // 1. It's paragraph layout (multi-line groups should wrap)
+                        // 2. Width was manually extended (user explicitly made space for wrapping)
+                        // 3. Has changes AND was already wrapping (preserve existing wrap state)
+                        // DO NOT enable wrapping just because isEditing - text should only wrap when it actually overflows
+                        const wasWrapping = isParagraphLayout || widthExtended;
+                        const enableWrap =
+                          wasWrapping || (hasChanges && wasWrapping);
+                        const whiteSpace = enableWrap ? "pre-wrap" : "pre";
+                        const wordBreak = enableWrap ? "break-word" : "normal";
+                        const overflowWrap = enableWrap
+                          ? "break-word"
+                          : "normal";
 
-                      // For paragraph mode, allow height to grow to accommodate lines without wrapping
-                      // For single-line mode, maintain fixed height based on PDF bounds
-                      const useFlexibleHeight = enableWrap || (isParagraphLayout && lineCount > 1);
+                        // For paragraph mode, allow height to grow to accommodate lines without wrapping
+                        // For single-line mode, maintain fixed height based on PDF bounds
+                        const useFlexibleHeight =
+                          enableWrap || (isParagraphLayout && lineCount > 1);
 
-                      // The renderGroupContainer wrapper adds 4px horizontal padding (2px left + 2px right)
-                      // We need to add this to the container width to compensate, so the inner content
-                      // has the full PDF-defined width available for text
-                      const WRAPPER_HORIZONTAL_PADDING = 4;
+                        // The renderGroupContainer wrapper adds 4px horizontal padding (2px left + 2px right)
+                        // We need to add this to the container width to compensate, so the inner content
+                        // has the full PDF-defined width available for text
+                        const WRAPPER_HORIZONTAL_PADDING = 4;
 
-                      const containerStyle: React.CSSProperties = {
-                        position: 'absolute',
-                        left: `${containerLeft}px`,
-                        top: `${containerTop}px`,
-                        width: `${containerWidth + WRAPPER_HORIZONTAL_PADDING}px`,
-                        height: useFlexibleHeight ? 'auto' : `${containerHeight}px`,
-                        minHeight: useFlexibleHeight ? 'auto' : `${containerHeight}px`,
-                        display: 'flex',
-                        alignItems: 'flex-start',
-                        justifyContent: 'flex-start',
-                        pointerEvents: 'auto',
-                        cursor: 'text',
-                        zIndex: 2_000_000,
-                        transform,
-                        transformOrigin,
-                      };
+                        const containerStyle: React.CSSProperties = {
+                          position: "absolute",
+                          left: `${containerLeft}px`,
+                          top: `${containerTop}px`,
+                          width: `${containerWidth + WRAPPER_HORIZONTAL_PADDING}px`,
+                          height: useFlexibleHeight
+                            ? "auto"
+                            : `${containerHeight}px`,
+                          minHeight: useFlexibleHeight
+                            ? "auto"
+                            : `${containerHeight}px`,
+                          display: "flex",
+                          alignItems: "flex-start",
+                          justifyContent: "flex-start",
+                          pointerEvents: "auto",
+                          cursor: "text",
+                          zIndex: 2_000_000,
+                          transform,
+                          transformOrigin,
+                        };
 
-                      const showResizeHandle = !hasRotation && (selectedGroupIds.has(group.id) || activeGroupId === group.id);
-                      const resizeHandle = showResizeHandle ? (
-                        <Box
-                          role="button"
-                          aria-label={t('pdfTextEditor.manual.resizeHandle', 'Adjust text width')}
-                          onMouseDown={(event) => handleResizeStart(event, group, resolvedWidth)}
-                          style={{
-                            position: 'absolute',
-                            top: '50%',
-                            right: -6,
-                            width: 12,
-                            height: 32,
-                            marginTop: -16,
-                            cursor: 'ew-resize',
-                            borderRadius: 6,
-                            backgroundColor: 'rgba(76, 110, 245, 0.35)',
-                            border: '1px solid rgba(76, 110, 245, 0.8)',
-                            display: 'flex',
-                            alignItems: 'center',
-                            justifyContent: 'center',
-                            color: 'white',
-                            fontSize: 9,
-                            userSelect: 'none',
-                          }}
-                        >
-                          ||
-                        </Box>
-                      ) : null;
+                        const showResizeHandle =
+                          !hasRotation &&
+                          (selectedGroupIds.has(group.id) ||
+                            activeGroupId === group.id);
+                        const resizeHandle = showResizeHandle ? (
+                          <Box
+                            role="button"
+                            aria-label={t(
+                              "pdfTextEditor.manual.resizeHandle",
+                              "Adjust text width",
+                            )}
+                            onMouseDown={(event) =>
+                              handleResizeStart(event, group, resolvedWidth)
+                            }
+                            style={{
+                              position: "absolute",
+                              top: "50%",
+                              right: -6,
+                              width: 12,
+                              height: 32,
+                              marginTop: -16,
+                              cursor: "ew-resize",
+                              borderRadius: 6,
+                              backgroundColor: "rgba(76, 110, 245, 0.35)",
+                              border: "1px solid rgba(76, 110, 245, 0.8)",
+                              display: "flex",
+                              alignItems: "center",
+                              justifyContent: "center",
+                              color: "white",
+                              fontSize: 9,
+                              userSelect: "none",
+                            }}
+                          >
+                            ||
+                          </Box>
+                        ) : null;
+
+                        if (isEditing) {
+                          return (
+                            <Box key={group.id} style={containerStyle}>
+                              {renderGroupContainer(
+                                group.id,
+                                group.pageIndex,
+                                true,
+                                changed,
+                                <div
+                                  ref={(node) => {
+                                    if (node) {
+                                      editorRefs.current.set(group.id, node);
+                                    } else {
+                                      editorRefs.current.delete(group.id);
+                                    }
+                                  }}
+                                  contentEditable
+                                  suppressContentEditableWarning
+                                  data-editor-group={group.id}
+                                  onCompositionStart={() =>
+                                    handleCompositionStart(group.id)
+                                  }
+                                  onCompositionEnd={(event) =>
+                                    handleCompositionEnd(
+                                      event.currentTarget,
+                                      group.pageIndex,
+                                      group.id,
+                                    )
+                                  }
+                                  onFocus={(event) => {
+                                    const primaryFont = fontFamily
+                                      .split(",")[0]
+                                      ?.replace(/['"]/g, "")
+                                      .trim();
+                                    if (
+                                      primaryFont &&
+                                      typeof document !== "undefined"
+                                    ) {
+                                      try {
+                                        if (
+                                          document.queryCommandSupported?.(
+                                            "styleWithCSS",
+                                          )
+                                        ) {
+                                          document.execCommand(
+                                            "styleWithCSS",
+                                            false,
+                                            "true",
+                                          );
+                                        }
+                                        if (
+                                          document.queryCommandSupported?.(
+                                            "fontName",
+                                          )
+                                        ) {
+                                          document.execCommand(
+                                            "fontName",
+                                            false,
+                                            primaryFont,
+                                          );
+                                        }
+                                      } catch {
+                                        // ignore execCommand failures; inline style already enforces font
+                                      }
+                                    }
+                                    event.currentTarget.style.fontFamily =
+                                      fontFamily;
+                                  }}
+                                  onClick={(event) => {
+                                    // Allow click position to determine cursor placement
+                                    event.stopPropagation();
+                                  }}
+                                  onBlur={(event) => {
+                                    composingGroupsRef.current.delete(group.id);
+                                    syncEditorValue(
+                                      event.currentTarget,
+                                      group.pageIndex,
+                                      group.id,
+                                      {
+                                        skipCaretRestore: true,
+                                      },
+                                    );
+                                    caretOffsetsRef.current.delete(group.id);
+                                    editorRefs.current.delete(group.id);
+                                    setActiveGroupId(null);
+                                    setEditingGroupId(null);
+                                  }}
+                                  onInput={(event) => {
+                                    if (
+                                      composingGroupsRef.current.has(group.id)
+                                    ) {
+                                      return;
+                                    }
+                                    syncEditorValue(
+                                      event.currentTarget,
+                                      group.pageIndex,
+                                      group.id,
+                                    );
+                                  }}
+                                  style={{
+                                    width: "100%",
+                                    minHeight: "100%",
+                                    height: "auto",
+                                    padding: "2px",
+                                    backgroundColor: "rgba(255,255,255,0.95)",
+                                    color: textColor,
+                                    fontSize: `${fontSizePx}px`,
+                                    fontFamily,
+                                    fontWeight,
+                                    lineHeight: lineHeightRatio,
+                                    outline: "none",
+                                    border: "none",
+                                    display: "block",
+                                    whiteSpace,
+                                    wordBreak,
+                                    overflowWrap,
+                                    cursor: "text",
+                                    overflow: "visible",
+                                  }}
+                                >
+                                  {group.text || "\u00A0"}
+                                </div>,
+                                undefined,
+                                undefined,
+                                selectedGroupIds.has(group.id),
+                                resizeHandle,
+                              )}
+                            </Box>
+                          );
+                        }
+
+                        const textScale = textScales.get(group.id) ?? 1;
+                        const shouldScale = autoScaleText && textScale < 0.98;
 
-                      if (isEditing) {
                         return (
                           <Box key={group.id} style={containerStyle}>
                             {renderGroupContainer(
                               group.id,
                               group.pageIndex,
-                              true,
+                              isActive,
                               changed,
                               <div
-                                ref={(node) => {
-                                  if (node) {
-                                    editorRefs.current.set(group.id, node);
-                                  } else {
-                                    editorRefs.current.delete(group.id);
-                                  }
-                                }}
-                                contentEditable
-                                suppressContentEditableWarning
-                                data-editor-group={group.id}
-                                onCompositionStart={() => handleCompositionStart(group.id)}
-                                onCompositionEnd={(event) =>
-                                  handleCompositionEnd(event.currentTarget, group.pageIndex, group.id)
-                                }
-                                onFocus={(event) => {
-                                  const primaryFont = fontFamily.split(',')[0]?.replace(/['"]/g, '').trim();
-                                  if (primaryFont && typeof document !== 'undefined') {
-                                    try {
-                                      if (document.queryCommandSupported?.('styleWithCSS')) {
-                                        document.execCommand('styleWithCSS', false, 'true');
-                                      }
-                                      if (document.queryCommandSupported?.('fontName')) {
-                                        document.execCommand('fontName', false, primaryFont);
-                                      }
-                                    } catch {
-                                      // ignore execCommand failures; inline style already enforces font
-                                    }
-                                  }
-                                  event.currentTarget.style.fontFamily = fontFamily;
-                                }}
-                                onClick={(event) => {
-                                  // Allow click position to determine cursor placement
-                                  event.stopPropagation();
-                                }}
-                                onBlur={(event) => {
-                                  composingGroupsRef.current.delete(group.id);
-                                  syncEditorValue(event.currentTarget, group.pageIndex, group.id, {
-                                    skipCaretRestore: true,
-                                  });
-                                  caretOffsetsRef.current.delete(group.id);
-                                  editorRefs.current.delete(group.id);
-                                  setActiveGroupId(null);
-                                  setEditingGroupId(null);
-                                }}
-                                onInput={(event) => {
-                                  if (composingGroupsRef.current.has(group.id)) {
-                                    return;
-                                  }
-                                  syncEditorValue(event.currentTarget, group.pageIndex, group.id);
-                                }}
+                                data-text-group={group.id}
                                 style={{
-                                  width: '100%',
-                                  minHeight: '100%',
-                                  height: 'auto',
-                                  padding: '2px',
-                                backgroundColor: 'rgba(255,255,255,0.95)',
-                                  color: textColor,
+                                  width: "100%",
+                                  minHeight: "100%",
+                                  padding: "2px",
+                                  whiteSpace,
+                                  wordBreak,
+                                  overflowWrap,
                                   fontSize: `${fontSizePx}px`,
                                   fontFamily,
                                   fontWeight,
                                   lineHeight: lineHeightRatio,
-                                  outline: 'none',
-                                  border: 'none',
-                                  display: 'block',
-                                  whiteSpace,
-                                  wordBreak,
-                                  overflowWrap,
-                                  cursor: 'text',
-                                  overflow: 'visible',
+                                  color: textColor,
+                                  display: "block",
+                                  cursor: "text",
+                                  overflow: enableWrap ? "visible" : "hidden",
                                 }}
                               >
-                                {group.text || '\u00A0'}
+                                <span
+                                  data-text-content
+                                  style={{
+                                    pointerEvents: "none",
+                                    display: enableWrap
+                                      ? "inline"
+                                      : "inline-block",
+                                    transform: shouldScale
+                                      ? `scaleX(${textScale})`
+                                      : "none",
+                                    transformOrigin: "left center",
+                                    whiteSpace,
+                                  }}
+                                >
+                                  {group.text || "\u00A0"}
+                                </span>
                               </div>,
                               undefined,
-                              undefined,
+                              (event: React.MouseEvent) => {
+                                const shouldActivate =
+                                  handleSelectionInteraction(
+                                    group.id,
+                                    pageGroupIndex,
+                                    event,
+                                  );
+                                if (!shouldActivate) {
+                                  setActiveGroupId(null);
+                                  setEditingGroupId(null);
+                                  return;
+                                }
+
+                                const clickX = event.clientX;
+                                const clickY = event.clientY;
+
+                                setActiveGroupId(group.id);
+                                setEditingGroupId(group.id);
+                                caretOffsetsRef.current.delete(group.id);
+
+                                // Log group stats when selected
+                                const lines = (group.text ?? "").split("\n");
+                                const words = (group.text ?? "")
+                                  .split(/\s+/)
+                                  .filter((w) => w.length > 0).length;
+                                const chars = (group.text ?? "").length;
+                                const width =
+                                  group.bounds.right - group.bounds.left;
+                                const height =
+                                  group.bounds.bottom - group.bounds.top;
+                                const isMultiLine = lines.length > 1;
+                                console.log(
+                                  `� Selected Text Group "${group.id}":`,
+                                );
+                                console.log(
+                                  `   Lines: ${lines.length}, Words: ${words}, Chars: ${chars}`,
+                                );
+                                console.log(
+                                  `   Dimensions: ${width.toFixed(1)}pt × ${height.toFixed(1)}pt`,
+                                );
+                                console.log(
+                                  `   Type: ${isMultiLine ? "MULTI-LINE (paragraph)" : "SINGLE-LINE"}`,
+                                );
+                                console.log(
+                                  `   Text preview: "${(group.text ?? "").substring(0, 80)}${(group.text ?? "").length > 80 ? "..." : ""}"`,
+                                );
+                                if (isMultiLine) {
+                                  console.log(
+                                    `   Line spacing: ${group.lineSpacing?.toFixed(1) ?? "unknown"}pt`,
+                                  );
+                                }
+
+                                requestAnimationFrame(() => {
+                                  const editor =
+                                    document.querySelector<HTMLElement>(
+                                      `[data-editor-group="${group.id}"]`,
+                                    );
+                                  if (!editor) return;
+                                  editor.focus();
+
+                                  setTimeout(() => {
+                                    if (document.caretRangeFromPoint) {
+                                      const range =
+                                        document.caretRangeFromPoint(
+                                          clickX,
+                                          clickY,
+                                        );
+                                      if (range) {
+                                        const selection = window.getSelection();
+                                        if (selection) {
+                                          selection.removeAllRanges();
+                                          selection.addRange(range);
+                                        }
+                                      }
+                                    } else if (
+                                      (document as any).caretPositionFromPoint
+                                    ) {
+                                      const pos = (
+                                        document as any
+                                      ).caretPositionFromPoint(clickX, clickY);
+                                      if (pos) {
+                                        const range = document.createRange();
+                                        range.setStart(
+                                          pos.offsetNode,
+                                          pos.offset,
+                                        );
+                                        range.collapse(true);
+                                        const selection = window.getSelection();
+                                        if (selection) {
+                                          selection.removeAllRanges();
+                                          selection.addRange(range);
+                                        }
+                                      }
+                                    }
+                                  }, 10);
+                                });
+                              },
                               selectedGroupIds.has(group.id),
                               resizeHandle,
                             )}
                           </Box>
                         );
-                      }
-
-                      const textScale = textScales.get(group.id) ?? 1;
-                      const shouldScale = autoScaleText && textScale < 0.98;
-
-                      return (
-                        <Box key={group.id} style={containerStyle}>
-                          {renderGroupContainer(
-                            group.id,
-                            group.pageIndex,
-                            isActive,
-                            changed,
-                            <div
-                              data-text-group={group.id}
-                              style={{
-                                width: '100%',
-                                minHeight: '100%',
-                                padding: '2px',
-                                whiteSpace,
-                                wordBreak,
-                                overflowWrap,
-                                fontSize: `${fontSizePx}px`,
-                                fontFamily,
-                                fontWeight,
-                                lineHeight: lineHeightRatio,
-                                color: textColor,
-                                display: 'block',
-                                cursor: 'text',
-                                overflow: enableWrap ? 'visible' : 'hidden',
-                              }}
-                            >
-                              <span
-                                data-text-content
-                                style={{
-                                  pointerEvents: 'none',
-                                  display: enableWrap ? 'inline' : 'inline-block',
-                                  transform: shouldScale ? `scaleX(${textScale})` : 'none',
-                                  transformOrigin: 'left center',
-                                  whiteSpace,
-                                }}
-                              >
-                                {group.text || '\u00A0'}
-                              </span>
-                            </div>,
-                            undefined,
-                            (event: React.MouseEvent) => {
-                              const shouldActivate = handleSelectionInteraction(group.id, pageGroupIndex, event);
-                              if (!shouldActivate) {
-                                setActiveGroupId(null);
-                                setEditingGroupId(null);
-                                return;
-                              }
-
-                              const clickX = event.clientX;
-                              const clickY = event.clientY;
-
-                              setActiveGroupId(group.id);
-                              setEditingGroupId(group.id);
-                              caretOffsetsRef.current.delete(group.id);
-
-                              // Log group stats when selected
-                              const lines = (group.text ?? '').split('\n');
-                              const words = (group.text ?? '').split(/\s+/).filter(w => w.length > 0).length;
-                              const chars = (group.text ?? '').length;
-                              const width = group.bounds.right - group.bounds.left;
-                              const height = group.bounds.bottom - group.bounds.top;
-                              const isMultiLine = lines.length > 1;
-                              console.log(`� Selected Text Group "${group.id}":`);
-                              console.log(`   Lines: ${lines.length}, Words: ${words}, Chars: ${chars}`);
-                              console.log(`   Dimensions: ${width.toFixed(1)}pt × ${height.toFixed(1)}pt`);
-                              console.log(`   Type: ${isMultiLine ? 'MULTI-LINE (paragraph)' : 'SINGLE-LINE'}`);
-                              console.log(`   Text preview: "${(group.text ?? '').substring(0, 80)}${(group.text ?? '').length > 80 ? '...' : ''}"`);
-                              if (isMultiLine) {
-                                console.log(`   Line spacing: ${group.lineSpacing?.toFixed(1) ?? 'unknown'}pt`);
-                              }
-
-                              requestAnimationFrame(() => {
-                                const editor = document.querySelector<HTMLElement>(`[data-editor-group="${group.id}"]`);
-                                if (!editor) return;
-                                editor.focus();
-
-                                setTimeout(() => {
-                                  if (document.caretRangeFromPoint) {
-                                    const range = document.caretRangeFromPoint(clickX, clickY);
-                                    if (range) {
-                                      const selection = window.getSelection();
-                                      if (selection) {
-                                        selection.removeAllRanges();
-                                        selection.addRange(range);
-                                      }
-                                    }
-                                  } else if ((document as any).caretPositionFromPoint) {
-                                    const pos = (document as any).caretPositionFromPoint(clickX, clickY);
-                                    if (pos) {
-                                      const range = document.createRange();
-                                      range.setStart(pos.offsetNode, pos.offset);
-                                      range.collapse(true);
-                                      const selection = window.getSelection();
-                                      if (selection) {
-                                        selection.removeAllRanges();
-                                        selection.addRange(range);
-                                      }
-                                    }
-                                  }
-                                }, 10);
-                              });
-                            },
-                            selectedGroupIds.has(group.id),
-                            resizeHandle,
-                          )}
-                        </Box>
-                      );
-                    })
-                  )}
+                      })
+                    )}
                   </Box>
                 </Box>
               </Box>
             </ScrollArea>
           </Card>
-
         </Stack>
       )}
-
-      {/* Navigation Warning Modal */}
-      <NavigationWarningModal
-        onApplyAndContinue={onSaveToWorkbench}
-      />
     </Stack>
   );
 };
diff --git a/frontend/src/core/components/tools/redact/ManualRedactionControls.tsx b/frontend/src/core/components/tools/redact/ManualRedactionControls.tsx
index 4c0fa41ef5..f58a6a864a 100644
--- a/frontend/src/core/components/tools/redact/ManualRedactionControls.tsx
+++ b/frontend/src/core/components/tools/redact/ManualRedactionControls.tsx
@@ -1,10 +1,10 @@
-import { useTranslation } from 'react-i18next';
-import { useEffect, useRef, useCallback } from 'react';
-import { Button, Stack, Text, Divider, ColorInput } from '@mantine/core';
-import AutoFixHighIcon from '@mui/icons-material/AutoFixHigh';
-import { useRedaction, useRedactionMode } from '@app/contexts/RedactionContext';
-import { useViewer } from '@app/contexts/ViewerContext';
-import { useSignature } from '@app/contexts/SignatureContext';
+import { useTranslation } from "react-i18next";
+import { useEffect, useRef, useCallback } from "react";
+import { Button, Stack, Text, Divider, ColorInput } from "@mantine/core";
+import { useRedaction, useRedactionMode } from "@app/contexts/RedactionContext";
+import { useViewer } from "@app/contexts/ViewerContext";
+import { useSignature } from "@app/contexts/SignatureContext";
+import { useNavigationGuard } from "@app/contexts/NavigationContext";
 
 interface ManualRedactionControlsProps {
   disabled?: boolean;
@@ -14,53 +14,87 @@ interface ManualRedactionControlsProps {
  * ManualRedactionControls provides UI for manual PDF redaction in the tool panel.
  * Displays controls for marking text/areas for redaction and applying them.
  */
-export default function ManualRedactionControls({ disabled = false }: ManualRedactionControlsProps) {
+export default function ManualRedactionControls({
+  disabled = false,
+}: ManualRedactionControlsProps) {
   const { t } = useTranslation();
 
   // Use our RedactionContext which bridges to EmbedPDF
-  const { activateManualRedact, redactionsApplied, setActiveType, setManualRedactColor } = useRedaction();
-  const { pendingCount, activeType, isBridgeReady, isRedacting, manualRedactColor } = useRedactionMode();
+  const {
+    activateManualRedact,
+    redactionsApplied,
+    setActiveType,
+    setManualRedactColor,
+  } = useRedaction();
+  const {
+    pendingCount,
+    activeType,
+    isBridgeReady,
+    isRedacting,
+    manualRedactColor,
+  } = useRedactionMode();
 
   // Get viewer context to manage annotation mode and save changes
-  const { isAnnotationMode, setAnnotationMode, applyChanges, activeFileIndex } = useViewer();
+  const { isAnnotationMode, setAnnotationMode, applyChanges, activeFileIndex } =
+    useViewer();
 
   // Get signature context to deactivate annotation tools when switching to redaction
   const { signatureApiRef } = useSignature();
 
-  // Check if redaction mode is active
-  const isRedactActive = isRedacting;
-
-  // Track if we've auto-activated for the current bridge session
-  const hasAutoActivated = useRef(false);
+  // Check if user is navigating away (modal shown) — don't fight the save/leave process
+  const { showNavigationWarning } = useNavigationGuard();
 
   // Track the previous file index to detect file switches
   const prevFileIndexRef = useRef<number>(activeFileIndex);
 
-  // Auto-activate selection mode when the API bridge becomes ready
-  // This ensures Mark Text is pre-selected when entering manual redaction mode
+  // Guard: pause auto-reactivation during save/export to avoid interfering with EmbedPDF
+  const isSavingRef = useRef(false);
+
+  // Keep redaction tool active at all times while this component is mounted.
+  // If anything deactivates it (annotation tools, text selection, file switch, etc.)
+  // this re-enables it automatically — no manual "Activate" button needed.
   useEffect(() => {
-    if (isBridgeReady && !disabled && !hasAutoActivated.current) {
-      hasAutoActivated.current = true;
-      // Small delay to ensure EmbedPDF is fully ready
-      const timer = setTimeout(() => {
-        // Deactivate annotation mode to show redaction layer
+    if (
+      disabled ||
+      !isBridgeReady ||
+      isSavingRef.current ||
+      showNavigationWarning
+    )
+      return;
+
+    if (!isRedacting || isAnnotationMode) {
+      // Kill annotation mode if it stole focus
+      if (isAnnotationMode) {
         setAnnotationMode(false);
-        // Pre-select the Redaction tool
-        activateManualRedact();
-      }, 150);
+        if (signatureApiRef?.current) {
+          try {
+            signatureApiRef.current.deactivateTools();
+          } catch (error) {
+            console.log("Unable to deactivate annotation tools:", error);
+          }
+        }
+      }
+      // Small delay to avoid racing with EmbedPDF's own state updates
+      const timer = setTimeout(() => {
+        if (!isSavingRef.current) {
+          activateManualRedact();
+        }
+      }, 50);
       return () => clearTimeout(timer);
     }
-  }, [isBridgeReady, disabled, activateManualRedact, setAnnotationMode]);
-
-  // Reset auto-activation flag when disabled changes or bridge becomes not ready
-  useEffect(() => {
-    if (disabled || !isBridgeReady) {
-      hasAutoActivated.current = false;
-    }
-  }, [disabled, isBridgeReady]);
+  }, [
+    isRedacting,
+    isAnnotationMode,
+    disabled,
+    isBridgeReady,
+    showNavigationWarning,
+    setAnnotationMode,
+    signatureApiRef,
+    activateManualRedact,
+  ]);
 
   // Reset redaction tool when switching between files
-  // The new PDF gets a fresh EmbedPDF instance - forcing user to re-select tool ensures it works properly
+  // The new PDF gets a fresh EmbedPDF instance
   useEffect(() => {
     if (prevFileIndexRef.current !== activeFileIndex) {
       prevFileIndexRef.current = activeFileIndex;
@@ -69,41 +103,24 @@ export default function ManualRedactionControls({ disabled = false }: ManualReda
       if (activeType) {
         setActiveType(null);
       }
-
-      // Reset auto-activation flag so new file can auto-activate
-      hasAutoActivated.current = false;
     }
   }, [activeFileIndex, activeType, setActiveType]);
 
-  const handleRedactClick = () => {
-    // Deactivate annotation mode and tools to switch to redaction layer
-    if (isAnnotationMode) {
-      setAnnotationMode(false);
-      // Deactivate any active annotation tools (like draw)
-      if (signatureApiRef?.current) {
-        try {
-          signatureApiRef.current.deactivateTools();
-        } catch (error) {
-          console.log('Unable to deactivate annotation tools:', error);
-        }
-      }
-    }
-
-    activateManualRedact();
-  };
-
   // Handle saving changes - this will apply pending redactions and save to file
   const handleSaveChanges = useCallback(async () => {
     if (applyChanges) {
-      await applyChanges();
+      isSavingRef.current = true;
+      try {
+        await applyChanges();
+      } finally {
+        isSavingRef.current = false;
+      }
     }
   }, [applyChanges]);
 
   // Check if there are unsaved changes to save (pending redactions OR applied redactions)
-  // Save Changes button will apply pending redactions and then save everything
   const hasUnsavedChanges = pendingCount > 0 || redactionsApplied;
 
-  // Check if API is available - use isBridgeReady state instead of ref (refs don't trigger re-renders)
   const isApiReady = isBridgeReady;
 
   return (
@@ -111,15 +128,18 @@ export default function ManualRedactionControls({ disabled = false }: ManualReda
       <Divider my="sm" />
       <Stack gap="md">
         <Text size="sm" fw={500}>
-          {t('redact.manual.title', 'Redaction Tools')}
+          {t("redact.manual.title", "Redaction Tools")}
         </Text>
 
         <Text size="xs" c="dimmed">
-          {t('redact.manual.instructions', 'Select text or draw areas on the PDF to mark content for redaction.')}
+          {t(
+            "redact.manual.instructions",
+            "Select text or draw areas on the PDF to mark content for redaction.",
+          )}
         </Text>
 
         <ColorInput
-          label={t('redact.manual.colorLabel', 'Redaction Colour')}
+          label={t("redact.manual.colorLabel", "Redaction Colour")}
           value={manualRedactColor}
           onChange={setManualRedactColor}
           disabled={disabled || !isApiReady}
@@ -128,18 +148,6 @@ export default function ManualRedactionControls({ disabled = false }: ManualReda
           popoverProps={{ withinPortal: true }}
         />
 
-        <Button
-          variant={isRedactActive && !isAnnotationMode ? 'filled' : 'outline'}
-          color={isRedactActive && !isAnnotationMode ? 'blue' : 'gray'}
-          leftSection={<AutoFixHighIcon style={{ fontSize: 18, flexShrink: 0 }} />}
-          onClick={handleRedactClick}
-          disabled={disabled || !isApiReady}
-          fullWidth
-          size="sm"
-        >
-          {isRedactActive && !isAnnotationMode ? t('redact.manual.active', 'Redaction Mode Active') : t('redact.manual.activate', 'Activate Redaction Tool')}
-        </Button>
-
         {/* Save Changes Button - applies pending redactions and saves to file */}
         <Button
           fullWidth
@@ -151,10 +159,9 @@ export default function ManualRedactionControls({ disabled = false }: ManualReda
           disabled={!hasUnsavedChanges}
           onClick={handleSaveChanges}
         >
-          {t('annotation.saveChanges', 'Save Changes')}
+          {t("annotation.saveChanges", "Save Changes")}
         </Button>
       </Stack>
     </>
   );
 }
-
diff --git a/frontend/src/core/components/tools/redact/RedactAdvancedSettings.test.tsx b/frontend/src/core/components/tools/redact/RedactAdvancedSettings.test.tsx
index 064a0b2a8b..0cbe0bc27d 100644
--- a/frontend/src/core/components/tools/redact/RedactAdvancedSettings.test.tsx
+++ b/frontend/src/core/components/tools/redact/RedactAdvancedSettings.test.tsx
@@ -1,13 +1,13 @@
-import { describe, expect, test, vi, beforeEach } from 'vitest';
-import { render, screen, fireEvent } from '@testing-library/react';
-import { MantineProvider } from '@mantine/core';
-import RedactAdvancedSettings from '@app/components/tools/redact/RedactAdvancedSettings';
-import { defaultParameters } from '@app/hooks/tools/redact/useRedactParameters';
+import { describe, expect, test, vi, beforeEach } from "vitest";
+import { render, screen, fireEvent } from "@testing-library/react";
+import { MantineProvider } from "@mantine/core";
+import RedactAdvancedSettings from "@app/components/tools/redact/RedactAdvancedSettings";
+import { defaultParameters } from "@app/hooks/tools/redact/useRedactParameters";
 
 // Mock useTranslation
 const mockT = vi.fn((_key: string, fallback: string) => fallback);
-vi.mock('react-i18next', () => ({
-  useTranslation: () => ({ t: mockT })
+vi.mock("react-i18next", () => ({
+  useTranslation: () => ({ t: mockT }),
 }));
 
 // Wrapper component to provide Mantine context
@@ -15,34 +15,38 @@ const TestWrapper = ({ children }: { children: React.ReactNode }) => (
   <MantineProvider>{children}</MantineProvider>
 );
 
-describe('RedactAdvancedSettings', () => {
+describe("RedactAdvancedSettings", () => {
   const mockOnParameterChange = vi.fn();
 
   beforeEach(() => {
     vi.clearAllMocks();
   });
 
-  test('should render all advanced settings controls', () => {
+  test("should render all advanced settings controls", () => {
     render(
       <TestWrapper>
         <RedactAdvancedSettings
           parameters={defaultParameters}
           onParameterChange={mockOnParameterChange}
         />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
-    expect(screen.getByText('Box Colour')).toBeInTheDocument();
-    expect(screen.getByText('Custom Extra Padding')).toBeInTheDocument();
-    expect(screen.getByText('Use Regex')).toBeInTheDocument();
-    expect(screen.getByText('Whole Word Search')).toBeInTheDocument();
-    expect(screen.getByText('Convert PDF to PDF-Image (Used to remove text behind the box)')).toBeInTheDocument();
+    expect(screen.getByText("Box Colour")).toBeInTheDocument();
+    expect(screen.getByText("Custom Extra Padding")).toBeInTheDocument();
+    expect(screen.getByText("Use Regex")).toBeInTheDocument();
+    expect(screen.getByText("Whole Word Search")).toBeInTheDocument();
+    expect(
+      screen.getByText(
+        "Convert PDF to PDF-Image (Used to remove text behind the box)",
+      ),
+    ).toBeInTheDocument();
   });
 
-  test('should display current parameter values', () => {
+  test("should display current parameter values", () => {
     const customParameters = {
       ...defaultParameters,
-      redactColor: '#FF0000',
+      redactColor: "#FF0000",
       customPadding: 0.5,
       useRegex: true,
       wholeWordSearch: true,
@@ -55,157 +59,189 @@ describe('RedactAdvancedSettings', () => {
           parameters={customParameters}
           onParameterChange={mockOnParameterChange}
         />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
     // Check color input value
-    const colorInput = screen.getByDisplayValue('#FF0000');
+    const colorInput = screen.getByDisplayValue("#FF0000");
     expect(colorInput).toBeInTheDocument();
 
     // Check number input value
-    const paddingInput = screen.getByDisplayValue('0.5');
+    const paddingInput = screen.getByDisplayValue("0.5");
     expect(paddingInput).toBeInTheDocument();
 
     // Check checkbox states
-    const useRegexCheckbox = screen.getByLabelText('Use Regex');
-    const wholeWordCheckbox = screen.getByLabelText('Whole Word Search');
-    const convertCheckbox = screen.getByLabelText('Convert PDF to PDF-Image (Used to remove text behind the box)');
+    const useRegexCheckbox = screen.getByLabelText("Use Regex");
+    const wholeWordCheckbox = screen.getByLabelText("Whole Word Search");
+    const convertCheckbox = screen.getByLabelText(
+      "Convert PDF to PDF-Image (Used to remove text behind the box)",
+    );
 
     expect(useRegexCheckbox).toBeChecked();
     expect(wholeWordCheckbox).toBeChecked();
     expect(convertCheckbox).not.toBeChecked();
   });
 
-  test('should call onParameterChange when color is changed', () => {
+  test("should call onParameterChange when color is changed", () => {
     render(
       <TestWrapper>
         <RedactAdvancedSettings
           parameters={defaultParameters}
           onParameterChange={mockOnParameterChange}
         />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
-    const colorInput = screen.getByDisplayValue('#000000');
-    fireEvent.change(colorInput, { target: { value: '#FF0000' } });
+    const colorInput = screen.getByDisplayValue("#000000");
+    fireEvent.change(colorInput, { target: { value: "#FF0000" } });
 
-    expect(mockOnParameterChange).toHaveBeenCalledWith('redactColor', '#FF0000');
+    expect(mockOnParameterChange).toHaveBeenCalledWith(
+      "redactColor",
+      "#FF0000",
+    );
   });
 
-  test('should call onParameterChange when padding is changed', () => {
+  test("should call onParameterChange when padding is changed", () => {
     render(
       <TestWrapper>
         <RedactAdvancedSettings
           parameters={defaultParameters}
           onParameterChange={mockOnParameterChange}
         />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
-    const paddingInput = screen.getByDisplayValue('0.1');
-    fireEvent.change(paddingInput, { target: { value: '0.5' } });
+    const paddingInput = screen.getByDisplayValue("0.1");
+    fireEvent.change(paddingInput, { target: { value: "0.5" } });
 
-    expect(mockOnParameterChange).toHaveBeenCalledWith('customPadding', 0.5);
+    expect(mockOnParameterChange).toHaveBeenCalledWith("customPadding", 0.5);
   });
 
-  test('should handle invalid padding values', () => {
+  test("should handle invalid padding values", () => {
     render(
       <TestWrapper>
         <RedactAdvancedSettings
           parameters={defaultParameters}
           onParameterChange={mockOnParameterChange}
         />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
-    const paddingInput = screen.getByDisplayValue('0.1');
+    const paddingInput = screen.getByDisplayValue("0.1");
 
     // Simulate NumberInput onChange with invalid value (empty string)
-    const numberInput = paddingInput.closest('.mantine-NumberInput-root');
+    const numberInput = paddingInput.closest(".mantine-NumberInput-root");
     if (numberInput) {
       // Find the input and trigger change with empty value
-      fireEvent.change(paddingInput, { target: { value: '' } });
+      fireEvent.change(paddingInput, { target: { value: "" } });
 
       // The component should default to 0.1 for invalid values
-      expect(mockOnParameterChange).toHaveBeenCalledWith('customPadding', 0.1);
+      expect(mockOnParameterChange).toHaveBeenCalledWith("customPadding", 0.1);
     }
   });
 
   test.each([
     {
-      paramName: 'useRegex' as const,
-      label: 'Use Regex',
+      paramName: "useRegex" as const,
+      label: "Use Regex",
       initialValue: false,
       expectedValue: true,
     },
     {
-      paramName: 'wholeWordSearch' as const,
-      label: 'Whole Word Search',
+      paramName: "wholeWordSearch" as const,
+      label: "Whole Word Search",
       initialValue: false,
       expectedValue: true,
     },
     {
-      paramName: 'convertPDFToImage' as const,
-      label: 'Convert PDF to PDF-Image (Used to remove text behind the box)',
+      paramName: "convertPDFToImage" as const,
+      label: "Convert PDF to PDF-Image (Used to remove text behind the box)",
       initialValue: true,
       expectedValue: false,
     },
-  ])('should call onParameterChange when $paramName checkbox is toggled', ({ paramName, label, initialValue, expectedValue }) => {
-    const customParameters = {
-      ...defaultParameters,
-      [paramName]: initialValue,
-    };
+  ])(
+    "should call onParameterChange when $paramName checkbox is toggled",
+    ({ paramName, label, initialValue, expectedValue }) => {
+      const customParameters = {
+        ...defaultParameters,
+        [paramName]: initialValue,
+      };
 
-    render(
-      <TestWrapper>
-        <RedactAdvancedSettings
-          parameters={customParameters}
-          onParameterChange={mockOnParameterChange}
-        />
-      </TestWrapper>
-    );
+      render(
+        <TestWrapper>
+          <RedactAdvancedSettings
+            parameters={customParameters}
+            onParameterChange={mockOnParameterChange}
+          />
+        </TestWrapper>,
+      );
 
-    const checkbox = screen.getByLabelText(label);
-    fireEvent.click(checkbox);
+      const checkbox = screen.getByLabelText(label);
+      fireEvent.click(checkbox);
 
-    expect(mockOnParameterChange).toHaveBeenCalledWith(paramName, expectedValue);
-  });
+      expect(mockOnParameterChange).toHaveBeenCalledWith(
+        paramName,
+        expectedValue,
+      );
+    },
+  );
 
   test.each([
-    { controlType: 'color input', getValue: () => screen.getByDisplayValue('#000000') },
-    { controlType: 'padding input', getValue: () => screen.getByDisplayValue('0.1') },
-    { controlType: 'useRegex checkbox', getValue: () => screen.getByLabelText('Use Regex') },
-    { controlType: 'wholeWordSearch checkbox', getValue: () => screen.getByLabelText('Whole Word Search') },
-    { controlType: 'convertPDFToImage checkbox', getValue: () => screen.getByLabelText('Convert PDF to PDF-Image (Used to remove text behind the box)') },
-  ])('should disable $controlType when disabled prop is true', ({ getValue }) => {
-    render(
-      <TestWrapper>
-        <RedactAdvancedSettings
-          parameters={defaultParameters}
-          onParameterChange={mockOnParameterChange}
-          disabled={true}
-        />
-      </TestWrapper>
-    );
+    {
+      controlType: "color input",
+      getValue: () => screen.getByDisplayValue("#000000"),
+    },
+    {
+      controlType: "padding input",
+      getValue: () => screen.getByDisplayValue("0.1"),
+    },
+    {
+      controlType: "useRegex checkbox",
+      getValue: () => screen.getByLabelText("Use Regex"),
+    },
+    {
+      controlType: "wholeWordSearch checkbox",
+      getValue: () => screen.getByLabelText("Whole Word Search"),
+    },
+    {
+      controlType: "convertPDFToImage checkbox",
+      getValue: () =>
+        screen.getByLabelText(
+          "Convert PDF to PDF-Image (Used to remove text behind the box)",
+        ),
+    },
+  ])(
+    "should disable $controlType when disabled prop is true",
+    ({ getValue }) => {
+      render(
+        <TestWrapper>
+          <RedactAdvancedSettings
+            parameters={defaultParameters}
+            onParameterChange={mockOnParameterChange}
+            disabled={true}
+          />
+        </TestWrapper>,
+      );
 
-    const control = getValue();
-    expect(control).toBeDisabled();
-  });
+      const control = getValue();
+      expect(control).toBeDisabled();
+    },
+  );
 
-  test('should have correct padding input constraints', () => {
+  test("should have correct padding input constraints", () => {
     render(
       <TestWrapper>
         <RedactAdvancedSettings
           parameters={defaultParameters}
           onParameterChange={mockOnParameterChange}
         />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
     // NumberInput in Mantine might not expose these attributes directly on the input element
     // Instead, check that the NumberInput component is rendered with correct placeholder
-    const paddingInput = screen.getByPlaceholderText('0.1');
+    const paddingInput = screen.getByPlaceholderText("0.1");
     expect(paddingInput).toBeInTheDocument();
-    expect(paddingInput).toHaveDisplayValue('0.1');
+    expect(paddingInput).toHaveDisplayValue("0.1");
   });
 });
diff --git a/frontend/src/core/components/tools/redact/RedactAdvancedSettings.tsx b/frontend/src/core/components/tools/redact/RedactAdvancedSettings.tsx
index e9570e84e8..fa685b22ab 100644
--- a/frontend/src/core/components/tools/redact/RedactAdvancedSettings.tsx
+++ b/frontend/src/core/components/tools/redact/RedactAdvancedSettings.tsx
@@ -5,20 +5,27 @@ import { Z_INDEX_AUTOMATE_DROPDOWN } from "@app/styles/zIndex";
 
 interface RedactAdvancedSettingsProps {
   parameters: RedactParameters;
-  onParameterChange: <K extends keyof RedactParameters>(key: K, value: RedactParameters[K]) => void;
+  onParameterChange: <K extends keyof RedactParameters>(
+    key: K,
+    value: RedactParameters[K],
+  ) => void;
   disabled?: boolean;
 }
 
-const RedactAdvancedSettings = ({ parameters, onParameterChange, disabled = false }: RedactAdvancedSettingsProps) => {
+const RedactAdvancedSettings = ({
+  parameters,
+  onParameterChange,
+  disabled = false,
+}: RedactAdvancedSettingsProps) => {
   const { t } = useTranslation();
 
   return (
     <Stack gap="md">
       {/* Box Color */}
       <ColorInput
-        label={t('redact.auto.colorLabel', 'Box Colour')}
+        label={t("redact.auto.colorLabel", "Box Colour")}
         value={parameters.redactColor}
-        onChange={(value) => onParameterChange('redactColor', value)}
+        onChange={(value) => onParameterChange("redactColor", value)}
         disabled={disabled}
         size="sm"
         format="hex"
@@ -27,9 +34,14 @@ const RedactAdvancedSettings = ({ parameters, onParameterChange, disabled = fals
 
       {/* Box Padding */}
       <NumberInput
-        label={t('redact.auto.customPaddingLabel', 'Custom Extra Padding')}
+        label={t("redact.auto.customPaddingLabel", "Custom Extra Padding")}
         value={parameters.customPadding}
-        onChange={(value) => onParameterChange('customPadding', typeof value === 'number' ? value : 0.1)}
+        onChange={(value) =>
+          onParameterChange(
+            "customPadding",
+            typeof value === "number" ? value : 0.1,
+          )
+        }
         min={0}
         max={10}
         step={0.1}
@@ -40,27 +52,34 @@ const RedactAdvancedSettings = ({ parameters, onParameterChange, disabled = fals
 
       {/* Use Regex */}
       <Checkbox
-        label={t('redact.auto.useRegexLabel', 'Use Regex')}
+        label={t("redact.auto.useRegexLabel", "Use Regex")}
         checked={parameters.useRegex}
-        onChange={(e) => onParameterChange('useRegex', e.currentTarget.checked)}
+        onChange={(e) => onParameterChange("useRegex", e.currentTarget.checked)}
         disabled={disabled}
         size="sm"
       />
 
       {/* Whole Word Search */}
       <Checkbox
-        label={t('redact.auto.wholeWordSearchLabel', 'Whole Word Search')}
+        label={t("redact.auto.wholeWordSearchLabel", "Whole Word Search")}
         checked={parameters.wholeWordSearch}
-        onChange={(e) => onParameterChange('wholeWordSearch', e.currentTarget.checked)}
+        onChange={(e) =>
+          onParameterChange("wholeWordSearch", e.currentTarget.checked)
+        }
         disabled={disabled}
         size="sm"
       />
 
       {/* Convert PDF to PDF-Image */}
       <Checkbox
-        label={t('redact.auto.convertPDFToImageLabel', 'Convert PDF to PDF-Image (Used to remove text behind the box)')}
+        label={t(
+          "redact.auto.convertPDFToImageLabel",
+          "Convert PDF to PDF-Image (Used to remove text behind the box)",
+        )}
         checked={parameters.convertPDFToImage}
-        onChange={(e) => onParameterChange('convertPDFToImage', e.currentTarget.checked)}
+        onChange={(e) =>
+          onParameterChange("convertPDFToImage", e.currentTarget.checked)
+        }
         disabled={disabled}
         size="sm"
       />
diff --git a/frontend/src/core/components/tools/redact/RedactModeSelector.tsx b/frontend/src/core/components/tools/redact/RedactModeSelector.tsx
index 7f669ce1e1..12b2e36c26 100644
--- a/frontend/src/core/components/tools/redact/RedactModeSelector.tsx
+++ b/frontend/src/core/components/tools/redact/RedactModeSelector.tsx
@@ -1,41 +1,42 @@
-import { useTranslation } from 'react-i18next';
-import { RedactMode } from '@app/hooks/tools/redact/useRedactParameters';
-import ButtonSelector from '@app/components/shared/ButtonSelector';
+import { useTranslation } from "react-i18next";
+import { RedactMode } from "@app/hooks/tools/redact/useRedactParameters";
+import ButtonSelector from "@app/components/shared/ButtonSelector";
 
 interface RedactModeSelectorProps {
   mode: RedactMode;
   onModeChange: (mode: RedactMode) => void;
   disabled?: boolean;
-  hasFilesSelected?: boolean;  // Files are selected in workbench
-  hasAnyFiles?: boolean;       // Any files exist in workbench (for manual mode)
+  hasAnyFiles?: boolean;
 }
 
-export default function RedactModeSelector({ 
-  mode, 
-  onModeChange, 
-  disabled, 
-  hasFilesSelected = false,
-  hasAnyFiles = false 
+export default function RedactModeSelector({
+  mode,
+  onModeChange,
+  disabled,
+  hasAnyFiles = false,
 }: RedactModeSelectorProps) {
   const { t } = useTranslation();
 
   return (
     <ButtonSelector
-      label={t('redact.modeSelector.mode', 'Mode')}
+      label={t("redact.modeSelector.mode", "Mode")}
       value={mode}
       onChange={onModeChange}
       options={[
         {
-          value: 'automatic' as const,
-          label: t('redact.modeSelector.automatic', 'Automatic'),
-          disabled: !hasFilesSelected, // Automatic requires files to be selected
-          tooltip: !hasFilesSelected 
-            ? t('redact.modeSelector.automaticDisabledTooltip', 'Select files in the file manager to redact multiple files at once')
+          value: "automatic" as const,
+          label: t("redact.modeSelector.automatic", "Automatic"),
+          disabled: !hasAnyFiles, // Allow switching to automatic whenever files exist; selection can happen after
+          tooltip: !hasAnyFiles
+            ? t(
+                "redact.modeSelector.automaticDisabledTooltip",
+                "Upload files to use automatic redaction",
+              )
             : undefined,
         },
         {
-          value: 'manual' as const,
-          label: t('redact.modeSelector.manual', 'Manual'),
+          value: "manual" as const,
+          label: t("redact.modeSelector.manual", "Manual"),
           disabled: !hasAnyFiles, // Manual mode works if any files exist in workbench
         },
       ]}
diff --git a/frontend/src/core/components/tools/redact/RedactSingleStepSettings.test.tsx b/frontend/src/core/components/tools/redact/RedactSingleStepSettings.test.tsx
index 4b516aa3b4..fa320edeff 100644
--- a/frontend/src/core/components/tools/redact/RedactSingleStepSettings.test.tsx
+++ b/frontend/src/core/components/tools/redact/RedactSingleStepSettings.test.tsx
@@ -1,12 +1,14 @@
-import { describe, expect, test, vi, beforeEach } from 'vitest';
-import { render, screen, fireEvent } from '@testing-library/react';
-import { MantineProvider } from '@mantine/core';
-import RedactSingleStepSettings from '@app/components/tools/redact/RedactSingleStepSettings';
-import { defaultParameters } from '@app/hooks/tools/redact/useRedactParameters';
+import { describe, expect, test, vi, beforeEach } from "vitest";
+import { render, screen, fireEvent } from "@testing-library/react";
+import { MantineProvider } from "@mantine/core";
+import RedactSingleStepSettings from "@app/components/tools/redact/RedactSingleStepSettings";
+import { defaultParameters } from "@app/hooks/tools/redact/useRedactParameters";
 
 // Mock useTranslation
-vi.mock('react-i18next', () => ({
-  useTranslation: () => ({ t: vi.fn((_key: string, fallback: string) => fallback) })
+vi.mock("react-i18next", () => ({
+  useTranslation: () => ({
+    t: vi.fn((_key: string, fallback: string) => fallback),
+  }),
 }));
 
 // Wrapper component to provide Mantine context
@@ -14,49 +16,51 @@ const TestWrapper = ({ children }: { children: React.ReactNode }) => (
   <MantineProvider>{children}</MantineProvider>
 );
 
-describe('RedactSingleStepSettings', () => {
+describe("RedactSingleStepSettings", () => {
   const mockOnParameterChange = vi.fn();
 
   beforeEach(() => {
     vi.clearAllMocks();
   });
 
-  test('should render mode selector', () => {
+  test("should render mode selector", () => {
     render(
       <TestWrapper>
         <RedactSingleStepSettings
           parameters={defaultParameters}
           onParameterChange={mockOnParameterChange}
         />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
-    expect(screen.getByText('Mode')).toBeInTheDocument();
-    expect(screen.getByRole('button', { name: 'Automatic' })).toBeInTheDocument();
-    expect(screen.getByRole('button', { name: 'Manual' })).toBeInTheDocument();
+    expect(screen.getByText("Mode")).toBeInTheDocument();
+    expect(
+      screen.getByRole("button", { name: "Automatic" }),
+    ).toBeInTheDocument();
+    expect(screen.getByRole("button", { name: "Manual" })).toBeInTheDocument();
   });
 
-  test('should render automatic mode settings when mode is automatic', () => {
+  test("should render automatic mode settings when mode is automatic", () => {
     render(
       <TestWrapper>
         <RedactSingleStepSettings
           parameters={defaultParameters}
           onParameterChange={mockOnParameterChange}
         />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
     // Default mode is automatic, so these should be visible
-    expect(screen.getByText('Words to Redact')).toBeInTheDocument();
-    expect(screen.getByPlaceholderText('Enter a word')).toBeInTheDocument();
-    expect(screen.getByText('Box Colour')).toBeInTheDocument();
-    expect(screen.getByText('Use Regex')).toBeInTheDocument();
+    expect(screen.getByText("Words to Redact")).toBeInTheDocument();
+    expect(screen.getByPlaceholderText("Enter a word")).toBeInTheDocument();
+    expect(screen.getByText("Box Colour")).toBeInTheDocument();
+    expect(screen.getByText("Use Regex")).toBeInTheDocument();
   });
 
-  test('should render manual mode settings when mode is manual', () => {
+  test("should render manual mode settings when mode is manual", () => {
     const manualParameters = {
       ...defaultParameters,
-      mode: 'manual' as const,
+      mode: "manual" as const,
     };
 
     render(
@@ -65,54 +69,63 @@ describe('RedactSingleStepSettings', () => {
           parameters={manualParameters}
           onParameterChange={mockOnParameterChange}
         />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
     // Manual mode should show placeholder text
-    expect(screen.getByText('Manual redaction interface will be available here when implemented.')).toBeInTheDocument();
+    expect(
+      screen.getByText(
+        "Manual redaction interface will be available here when implemented.",
+      ),
+    ).toBeInTheDocument();
 
     // Automatic mode settings should not be visible
-    expect(screen.queryByText('Words to Redact')).not.toBeInTheDocument();
+    expect(screen.queryByText("Words to Redact")).not.toBeInTheDocument();
   });
 
-  test('should pass through parameter changes from automatic settings', () => {
+  test("should pass through parameter changes from automatic settings", () => {
     render(
       <TestWrapper>
         <RedactSingleStepSettings
           parameters={defaultParameters}
           onParameterChange={mockOnParameterChange}
         />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
     // Test adding a word
-    const input = screen.getByPlaceholderText('Enter a word');
-    const addButton = screen.getByRole('button', { name: '+ Add' });
+    const input = screen.getByPlaceholderText("Enter a word");
+    const addButton = screen.getByRole("button", { name: "+ Add" });
 
-    fireEvent.change(input, { target: { value: 'TestWord' } });
+    fireEvent.change(input, { target: { value: "TestWord" } });
     fireEvent.click(addButton);
 
-    expect(mockOnParameterChange).toHaveBeenCalledWith('wordsToRedact', ['TestWord']);
+    expect(mockOnParameterChange).toHaveBeenCalledWith("wordsToRedact", [
+      "TestWord",
+    ]);
   });
 
-  test('should pass through parameter changes from advanced settings', () => {
+  test("should pass through parameter changes from advanced settings", () => {
     render(
       <TestWrapper>
         <RedactSingleStepSettings
           parameters={defaultParameters}
           onParameterChange={mockOnParameterChange}
         />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
     // Test changing color
-    const colorInput = screen.getByDisplayValue('#000000');
-    fireEvent.change(colorInput, { target: { value: '#FF0000' } });
+    const colorInput = screen.getByDisplayValue("#000000");
+    fireEvent.change(colorInput, { target: { value: "#FF0000" } });
 
-    expect(mockOnParameterChange).toHaveBeenCalledWith('redactColor', '#FF0000');
+    expect(mockOnParameterChange).toHaveBeenCalledWith(
+      "redactColor",
+      "#FF0000",
+    );
   });
 
-  test('should disable all controls when disabled prop is true', () => {
+  test("should disable all controls when disabled prop is true", () => {
     render(
       <TestWrapper>
         <RedactSingleStepSettings
@@ -120,24 +133,24 @@ describe('RedactSingleStepSettings', () => {
           onParameterChange={mockOnParameterChange}
           disabled={true}
         />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
     // Mode selector buttons should be disabled
-    expect(screen.getByRole('button', { name: 'Automatic' })).toBeDisabled();
-    expect(screen.getByRole('button', { name: 'Manual' })).toBeDisabled();
+    expect(screen.getByRole("button", { name: "Automatic" })).toBeDisabled();
+    expect(screen.getByRole("button", { name: "Manual" })).toBeDisabled();
 
     // Automatic settings controls should be disabled
-    expect(screen.getByPlaceholderText('Enter a word')).toBeDisabled();
-    expect(screen.getByRole('button', { name: '+ Add' })).toBeDisabled();
-    expect(screen.getByDisplayValue('#000000')).toBeDisabled();
+    expect(screen.getByPlaceholderText("Enter a word")).toBeDisabled();
+    expect(screen.getByRole("button", { name: "+ Add" })).toBeDisabled();
+    expect(screen.getByDisplayValue("#000000")).toBeDisabled();
   });
 
-  test('should show current parameter values in automatic mode', () => {
+  test("should show current parameter values in automatic mode", () => {
     const customParameters = {
       ...defaultParameters,
-      wordsToRedact: ['Word1', 'Word2'],
-      redactColor: '#FF0000',
+      wordsToRedact: ["Word1", "Word2"],
+      redactColor: "#FF0000",
       useRegex: true,
       customPadding: 0.5,
     };
@@ -148,36 +161,36 @@ describe('RedactSingleStepSettings', () => {
           parameters={customParameters}
           onParameterChange={mockOnParameterChange}
         />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
     // Check that word tags are displayed
-    expect(screen.getByText('Word1')).toBeInTheDocument();
-    expect(screen.getByText('Word2')).toBeInTheDocument();
+    expect(screen.getByText("Word1")).toBeInTheDocument();
+    expect(screen.getByText("Word2")).toBeInTheDocument();
 
     // Check that color is displayed
-    expect(screen.getByDisplayValue('#FF0000')).toBeInTheDocument();
+    expect(screen.getByDisplayValue("#FF0000")).toBeInTheDocument();
 
     // Check that regex checkbox is checked
-    const useRegexCheckbox = screen.getByLabelText('Use Regex');
+    const useRegexCheckbox = screen.getByLabelText("Use Regex");
     expect(useRegexCheckbox).toBeChecked();
 
     // Check that padding value is displayed
-    expect(screen.getByDisplayValue('0.5')).toBeInTheDocument();
+    expect(screen.getByDisplayValue("0.5")).toBeInTheDocument();
   });
 
-  test('should maintain consistent spacing and layout', () => {
+  test("should maintain consistent spacing and layout", () => {
     render(
       <TestWrapper>
         <RedactSingleStepSettings
           parameters={defaultParameters}
           onParameterChange={mockOnParameterChange}
         />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
     // Check that the Stack container exists
-    const container = screen.getByText('Mode').closest('.mantine-Stack-root');
+    const container = screen.getByText("Mode").closest(".mantine-Stack-root");
     expect(container).toBeInTheDocument();
   });
 });
diff --git a/frontend/src/core/components/tools/redact/RedactSingleStepSettings.tsx b/frontend/src/core/components/tools/redact/RedactSingleStepSettings.tsx
index badea46343..cf73302210 100644
--- a/frontend/src/core/components/tools/redact/RedactSingleStepSettings.tsx
+++ b/frontend/src/core/components/tools/redact/RedactSingleStepSettings.tsx
@@ -6,29 +6,36 @@ import RedactAdvancedSettings from "@app/components/tools/redact/RedactAdvancedS
 
 interface RedactSingleStepSettingsProps {
   parameters: RedactParameters;
-  onParameterChange: <K extends keyof RedactParameters>(key: K, value: RedactParameters[K]) => void;
+  onParameterChange: <K extends keyof RedactParameters>(
+    key: K,
+    value: RedactParameters[K],
+  ) => void;
   disabled?: boolean;
 }
 
-const RedactSingleStepSettings = ({ parameters, onParameterChange, disabled = false }: RedactSingleStepSettingsProps) => {
+const RedactSingleStepSettings = ({
+  parameters,
+  onParameterChange,
+  disabled = false,
+}: RedactSingleStepSettingsProps) => {
   return (
     <Stack gap="md">
       {/* Mode Selection */}
       <RedactModeSelector
         mode={parameters.mode}
-        onModeChange={(mode) => onParameterChange('mode', mode)}
+        onModeChange={(mode) => onParameterChange("mode", mode)}
         disabled={disabled}
       />
 
       {/* Automatic Mode Settings */}
-      {parameters.mode === 'automatic' && (
+      {parameters.mode === "automatic" && (
         <>
           <Divider />
 
           {/* Words to Redact */}
           <WordsToRedactInput
             wordsToRedact={parameters.wordsToRedact}
-            onWordsChange={(words) => onParameterChange('wordsToRedact', words)}
+            onWordsChange={(words) => onParameterChange("wordsToRedact", words)}
             disabled={disabled}
           />
 
@@ -44,12 +51,15 @@ const RedactSingleStepSettings = ({ parameters, onParameterChange, disabled = fa
       )}
 
       {/* Manual Mode Placeholder */}
-      {parameters.mode === 'manual' && (
+      {parameters.mode === "manual" && (
         <>
           <Divider />
           <Stack gap="md">
-            <div style={{ padding: '20px', textAlign: 'center', color: '#666' }}>
-              Manual redaction interface will be available here when implemented.
+            <div
+              style={{ padding: "20px", textAlign: "center", color: "#666" }}
+            >
+              Manual redaction interface will be available here when
+              implemented.
             </div>
           </Stack>
         </>
diff --git a/frontend/src/core/components/tools/redact/WordsToRedactInput.test.tsx b/frontend/src/core/components/tools/redact/WordsToRedactInput.test.tsx
index 84d6f65b99..9b5ff2f9a9 100644
--- a/frontend/src/core/components/tools/redact/WordsToRedactInput.test.tsx
+++ b/frontend/src/core/components/tools/redact/WordsToRedactInput.test.tsx
@@ -1,12 +1,12 @@
-import { describe, expect, test, vi, beforeEach } from 'vitest';
-import { render, screen, fireEvent } from '@testing-library/react';
-import { MantineProvider } from '@mantine/core';
-import WordsToRedactInput from '@app/components/tools/redact/WordsToRedactInput';
+import { describe, expect, test, vi, beforeEach } from "vitest";
+import { render, screen, fireEvent } from "@testing-library/react";
+import { MantineProvider } from "@mantine/core";
+import WordsToRedactInput from "@app/components/tools/redact/WordsToRedactInput";
 
 // Mock useTranslation
 const mockT = vi.fn((_key: string, fallback: string) => fallback);
-vi.mock('react-i18next', () => ({
-  useTranslation: () => ({ t: mockT })
+vi.mock("react-i18next", () => ({
+  useTranslation: () => ({ t: mockT }),
 }));
 
 // Wrapper component to provide Mantine context
@@ -14,178 +14,196 @@ const TestWrapper = ({ children }: { children: React.ReactNode }) => (
   <MantineProvider>{children}</MantineProvider>
 );
 
-describe('WordsToRedactInput', () => {
+describe("WordsToRedactInput", () => {
   const mockOnWordsChange = vi.fn();
 
   beforeEach(() => {
     vi.clearAllMocks();
   });
 
-  test('should render with title and input field', () => {
+  test("should render with title and input field", () => {
     render(
       <TestWrapper>
         <WordsToRedactInput
           wordsToRedact={[]}
           onWordsChange={mockOnWordsChange}
         />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
-    expect(screen.getByText('Words to Redact')).toBeInTheDocument();
-    expect(screen.getByPlaceholderText('Enter a word')).toBeInTheDocument();
-    expect(screen.getByRole('button', { name: '+ Add' })).toBeInTheDocument();
+    expect(screen.getByText("Words to Redact")).toBeInTheDocument();
+    expect(screen.getByPlaceholderText("Enter a word")).toBeInTheDocument();
+    expect(screen.getByRole("button", { name: "+ Add" })).toBeInTheDocument();
   });
 
   test.each([
-    { trigger: 'Add button click', action: (_input: HTMLElement, addButton: HTMLElement) => fireEvent.click(addButton) },
-    { trigger: 'Enter key press', action: (input: HTMLElement) => fireEvent.keyDown(input, { key: 'Enter', code: 'Enter' }) },
-  ])('should add word when $trigger', ({ action }) => {
+    {
+      trigger: "Add button click",
+      action: (_input: HTMLElement, addButton: HTMLElement) =>
+        fireEvent.click(addButton),
+    },
+    {
+      trigger: "Enter key press",
+      action: (input: HTMLElement) =>
+        fireEvent.keyDown(input, { key: "Enter", code: "Enter" }),
+    },
+  ])("should add word when $trigger", ({ action }) => {
     render(
       <TestWrapper>
         <WordsToRedactInput
           wordsToRedact={[]}
           onWordsChange={mockOnWordsChange}
         />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
-    const input = screen.getByPlaceholderText('Enter a word');
-    const addButton = screen.getByRole('button', { name: '+ Add' });
+    const input = screen.getByPlaceholderText("Enter a word");
+    const addButton = screen.getByRole("button", { name: "+ Add" });
 
-    fireEvent.change(input, { target: { value: 'TestWord' } });
+    fireEvent.change(input, { target: { value: "TestWord" } });
     action(input, addButton);
 
-    expect(mockOnWordsChange).toHaveBeenCalledWith(['TestWord']);
+    expect(mockOnWordsChange).toHaveBeenCalledWith(["TestWord"]);
   });
 
-  test('should not add empty word', () => {
+  test("should not add empty word", () => {
     render(
       <TestWrapper>
         <WordsToRedactInput
           wordsToRedact={[]}
           onWordsChange={mockOnWordsChange}
         />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
-    const addButton = screen.getByRole('button', { name: '+ Add' });
+    const addButton = screen.getByRole("button", { name: "+ Add" });
 
     fireEvent.click(addButton);
 
     expect(mockOnWordsChange).not.toHaveBeenCalled();
   });
 
-  test('should not add duplicate word', () => {
+  test("should not add duplicate word", () => {
     render(
       <TestWrapper>
         <WordsToRedactInput
-          wordsToRedact={['Existing']}
+          wordsToRedact={["Existing"]}
           onWordsChange={mockOnWordsChange}
         />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
-    const input = screen.getByPlaceholderText('Enter a word');
-    const addButton = screen.getByRole('button', { name: '+ Add' });
+    const input = screen.getByPlaceholderText("Enter a word");
+    const addButton = screen.getByRole("button", { name: "+ Add" });
 
-    fireEvent.change(input, { target: { value: 'Existing' } });
+    fireEvent.change(input, { target: { value: "Existing" } });
     fireEvent.click(addButton);
 
     expect(mockOnWordsChange).not.toHaveBeenCalled();
   });
 
-  test('should trim whitespace when adding word', () => {
+  test("should trim whitespace when adding word", () => {
     render(
       <TestWrapper>
         <WordsToRedactInput
           wordsToRedact={[]}
           onWordsChange={mockOnWordsChange}
         />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
-    const input = screen.getByPlaceholderText('Enter a word');
-    const addButton = screen.getByRole('button', { name: '+ Add' });
+    const input = screen.getByPlaceholderText("Enter a word");
+    const addButton = screen.getByRole("button", { name: "+ Add" });
 
-    fireEvent.change(input, { target: { value: '  TestWord  ' } });
+    fireEvent.change(input, { target: { value: "  TestWord  " } });
     fireEvent.click(addButton);
 
-    expect(mockOnWordsChange).toHaveBeenCalledWith(['TestWord']);
+    expect(mockOnWordsChange).toHaveBeenCalledWith(["TestWord"]);
   });
 
-  test('should remove word when x button is clicked', () => {
+  test("should remove word when x button is clicked", () => {
     render(
       <TestWrapper>
         <WordsToRedactInput
-          wordsToRedact={['Word1', 'Word2']}
+          wordsToRedact={["Word1", "Word2"]}
           onWordsChange={mockOnWordsChange}
         />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
-    const removeButtons = screen.getAllByText('×');
+    const removeButtons = screen.getAllByText("×");
     fireEvent.click(removeButtons[0]);
 
-    expect(mockOnWordsChange).toHaveBeenCalledWith(['Word2']);
+    expect(mockOnWordsChange).toHaveBeenCalledWith(["Word2"]);
   });
 
-  test('should clear input after adding word', () => {
+  test("should clear input after adding word", () => {
     render(
       <TestWrapper>
         <WordsToRedactInput
           wordsToRedact={[]}
           onWordsChange={mockOnWordsChange}
         />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
-    const input = screen.getByPlaceholderText('Enter a word') as HTMLInputElement;
-    const addButton = screen.getByRole('button', { name: '+ Add' });
+    const input = screen.getByPlaceholderText(
+      "Enter a word",
+    ) as HTMLInputElement;
+    const addButton = screen.getByRole("button", { name: "+ Add" });
 
-    fireEvent.change(input, { target: { value: 'TestWord' } });
+    fireEvent.change(input, { target: { value: "TestWord" } });
     fireEvent.click(addButton);
 
-    expect(input.value).toBe('');
+    expect(input.value).toBe("");
   });
 
   test.each([
-    { description: 'disable Add button when input is empty', inputValue: '', expectedDisabled: true },
-    { description: 'enable Add button when input has text', inputValue: 'TestWord', expectedDisabled: false },
-  ])('should $description', ({ inputValue, expectedDisabled }) => {
+    {
+      description: "disable Add button when input is empty",
+      inputValue: "",
+      expectedDisabled: true,
+    },
+    {
+      description: "enable Add button when input has text",
+      inputValue: "TestWord",
+      expectedDisabled: false,
+    },
+  ])("should $description", ({ inputValue, expectedDisabled }) => {
     render(
       <TestWrapper>
         <WordsToRedactInput
           wordsToRedact={[]}
           onWordsChange={mockOnWordsChange}
         />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
-    const input = screen.getByPlaceholderText('Enter a word');
-    const addButton = screen.getByRole('button', { name: '+ Add' });
+    const input = screen.getByPlaceholderText("Enter a word");
+    const addButton = screen.getByRole("button", { name: "+ Add" });
 
     fireEvent.change(input, { target: { value: inputValue } });
 
-    expect(addButton).toHaveProperty('disabled', expectedDisabled);
+    expect(addButton).toHaveProperty("disabled", expectedDisabled);
   });
 
-  test('should disable all controls when disabled prop is true', () => {
+  test("should disable all controls when disabled prop is true", () => {
     render(
       <TestWrapper>
         <WordsToRedactInput
-          wordsToRedact={['Word1']}
+          wordsToRedact={["Word1"]}
           onWordsChange={mockOnWordsChange}
           disabled={true}
         />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
-    const input = screen.getByPlaceholderText('Enter a word');
-    const addButton = screen.getByRole('button', { name: '+ Add' });
-    const removeButton = screen.getByText('×');
+    const input = screen.getByPlaceholderText("Enter a word");
+    const addButton = screen.getByRole("button", { name: "+ Add" });
+    const removeButton = screen.getByText("×");
 
     expect(input).toBeDisabled();
     expect(addButton).toBeDisabled();
-    expect(removeButton.closest('button')).toBeDisabled();
+    expect(removeButton.closest("button")).toBeDisabled();
   });
 });
diff --git a/frontend/src/core/components/tools/redact/WordsToRedactInput.tsx b/frontend/src/core/components/tools/redact/WordsToRedactInput.tsx
index 90c97f0e34..db346bd4ec 100644
--- a/frontend/src/core/components/tools/redact/WordsToRedactInput.tsx
+++ b/frontend/src/core/components/tools/redact/WordsToRedactInput.tsx
@@ -1,6 +1,13 @@
-import React, { useState } from 'react';
-import { useTranslation } from 'react-i18next';
-import { Stack, Text, TextInput, Button, Group, ActionIcon } from '@mantine/core';
+import React, { useState } from "react";
+import { useTranslation } from "react-i18next";
+import {
+  Stack,
+  Text,
+  TextInput,
+  Button,
+  Group,
+  ActionIcon,
+} from "@mantine/core";
 
 interface WordsToRedactInputProps {
   wordsToRedact: string[];
@@ -8,14 +15,18 @@ interface WordsToRedactInputProps {
   disabled?: boolean;
 }
 
-export default function WordsToRedactInput({ wordsToRedact, onWordsChange, disabled }: WordsToRedactInputProps) {
+export default function WordsToRedactInput({
+  wordsToRedact,
+  onWordsChange,
+  disabled,
+}: WordsToRedactInputProps) {
   const { t } = useTranslation();
-  const [currentWord, setCurrentWord] = useState('');
+  const [currentWord, setCurrentWord] = useState("");
 
   const addWord = () => {
     if (currentWord.trim() && !wordsToRedact.includes(currentWord.trim())) {
       onWordsChange([...wordsToRedact, currentWord.trim()]);
-      setCurrentWord('');
+      setCurrentWord("");
     }
   };
 
@@ -24,7 +35,7 @@ export default function WordsToRedactInput({ wordsToRedact, onWordsChange, disab
   };
 
   const handleKeyPress = (e: React.KeyboardEvent) => {
-    if (e.key === 'Enter') {
+    if (e.key === "Enter") {
       e.preventDefault();
       addWord();
     }
@@ -33,23 +44,28 @@ export default function WordsToRedactInput({ wordsToRedact, onWordsChange, disab
   return (
     <Stack gap="sm">
       <Text size="sm" fw={500}>
-        {t('redact.auto.wordsToRedact.title', 'Words to Redact')}
+        {t("redact.auto.wordsToRedact.title", "Words to Redact")}
       </Text>
 
       {/* Current words */}
       {wordsToRedact.map((word, index) => (
-        <Group key={index} justify="space-between" p="sm" style={{
-          borderRadius: 'var(--mantine-radius-sm)',
-          border: `1px solid var(--mantine-color-gray-3)`,
-          backgroundColor: 'var(--mantine-color-gray-0)'
-        }}>
+        <Group
+          key={index}
+          justify="space-between"
+          p="sm"
+          style={{
+            borderRadius: "var(--mantine-radius-sm)",
+            border: `1px solid var(--mantine-color-gray-3)`,
+            backgroundColor: "var(--mantine-color-gray-0)",
+          }}
+        >
           <Text
             size="sm"
             style={{
-              maxWidth: '80%',
-              overflow: 'hidden',
-              textOverflow: 'ellipsis',
-              whiteSpace: 'nowrap'
+              maxWidth: "80%",
+              overflow: "hidden",
+              textOverflow: "ellipsis",
+              whiteSpace: "nowrap",
             }}
             title={word}
           >
@@ -70,7 +86,10 @@ export default function WordsToRedactInput({ wordsToRedact, onWordsChange, disab
       {/* Add new word input */}
       <Group gap="sm" align="end">
         <TextInput
-          placeholder={t('redact.auto.wordsToRedact.placeholder', 'Enter a word')}
+          placeholder={t(
+            "redact.auto.wordsToRedact.placeholder",
+            "Enter a word",
+          )}
           value={currentWord}
           onChange={(e) => setCurrentWord(e.target.value)}
           onKeyDown={handleKeyPress}
@@ -84,14 +103,17 @@ export default function WordsToRedactInput({ wordsToRedact, onWordsChange, disab
           onClick={addWord}
           disabled={disabled || !currentWord.trim()}
         >
-          + {t('redact.auto.wordsToRedact.add', 'Add')}
+          + {t("redact.auto.wordsToRedact.add", "Add")}
         </Button>
       </Group>
 
       {/* Examples */}
       {wordsToRedact.length === 0 && (
         <Text size="xs" c="dimmed">
-          {t('redact.auto.wordsToRedact.examples', 'Examples: Confidential, Top-Secret')}
+          {t(
+            "redact.auto.wordsToRedact.examples",
+            "Examples: Confidential, Top-Secret",
+          )}
         </Text>
       )}
     </Stack>
diff --git a/frontend/src/core/components/tools/removeAnnotations/RemoveAnnotationsSettings.tsx b/frontend/src/core/components/tools/removeAnnotations/RemoveAnnotationsSettings.tsx
index f8eb749c1c..f27368a30f 100644
--- a/frontend/src/core/components/tools/removeAnnotations/RemoveAnnotationsSettings.tsx
+++ b/frontend/src/core/components/tools/removeAnnotations/RemoveAnnotationsSettings.tsx
@@ -1,4 +1,4 @@
-import { Stack } from '@mantine/core';
+import { Stack } from "@mantine/core";
 
 const RemoveAnnotationsSettings = () => {
   return (
@@ -8,4 +8,4 @@ const RemoveAnnotationsSettings = () => {
   );
 };
 
-export default RemoveAnnotationsSettings;
\ No newline at end of file
+export default RemoveAnnotationsSettings;
diff --git a/frontend/src/core/components/tools/removeBlanks/RemoveBlanksSettings.tsx b/frontend/src/core/components/tools/removeBlanks/RemoveBlanksSettings.tsx
index e39cab96ce..b3e2f43ef7 100644
--- a/frontend/src/core/components/tools/removeBlanks/RemoveBlanksSettings.tsx
+++ b/frontend/src/core/components/tools/removeBlanks/RemoveBlanksSettings.tsx
@@ -1,25 +1,44 @@
-import { Stack, Text, Checkbox, Slider, NumberInput, Group } from "@mantine/core";
+import {
+  Stack,
+  Text,
+  Checkbox,
+  Slider,
+  NumberInput,
+  Group,
+} from "@mantine/core";
 import { useTranslation } from "react-i18next";
 import NumberInputWithUnit from "@app/components/tools/shared/NumberInputWithUnit";
 import { RemoveBlanksParameters } from "@app/hooks/tools/removeBlanks/useRemoveBlanksParameters";
 
 interface RemoveBlanksSettingsProps {
   parameters: RemoveBlanksParameters;
-  onParameterChange: <K extends keyof RemoveBlanksParameters>(key: K, value: RemoveBlanksParameters[K]) => void;
+  onParameterChange: <K extends keyof RemoveBlanksParameters>(
+    key: K,
+    value: RemoveBlanksParameters[K],
+  ) => void;
   disabled?: boolean;
 }
 
-const RemoveBlanksSettings = ({ parameters, onParameterChange, disabled = false }: RemoveBlanksSettingsProps) => {
+const RemoveBlanksSettings = ({
+  parameters,
+  onParameterChange,
+  disabled = false,
+}: RemoveBlanksSettingsProps) => {
   const { t } = useTranslation();
 
   return (
     <Stack gap="lg" mt="md">
       <Stack gap="xs">
         <NumberInputWithUnit
-          label={t('removeBlanks.threshold.label', 'Pixel Whiteness Threshold')}
+          label={t("removeBlanks.threshold.label", "Pixel Whiteness Threshold")}
           value={parameters.threshold}
-          onChange={(v) => onParameterChange('threshold', typeof v === 'string' ? Number(v) : v)}
-          unit=''
+          onChange={(v) =>
+            onParameterChange(
+              "threshold",
+              typeof v === "string" ? Number(v) : v,
+            )
+          }
+          unit=""
           min={0}
           max={255}
           disabled={disabled}
@@ -28,23 +47,25 @@ const RemoveBlanksSettings = ({ parameters, onParameterChange, disabled = false
 
       <Stack gap="xs">
         <Text size="sm" fw={500}>
-          {t('removeBlanks.whitePercent.label', 'White Percent')}
+          {t("removeBlanks.whitePercent.label", "White Percent")}
         </Text>
         <Group align="center">
           <NumberInput
             value={parameters.whitePercent}
-            onChange={(v) => onParameterChange('whitePercent', typeof v === 'number' ? v : 0.1)}
+            onChange={(v) =>
+              onParameterChange("whitePercent", typeof v === "number" ? v : 0.1)
+            }
             min={0.1}
             max={100}
             step={0.1}
             size="sm"
             rightSection="%"
-            style={{ width: '80px' }}
+            style={{ width: "80px" }}
             disabled={disabled}
           />
           <Slider
             value={parameters.whitePercent}
-            onChange={(value) => onParameterChange('whitePercent', value)}
+            onChange={(value) => onParameterChange("whitePercent", value)}
             min={0.1}
             max={100}
             step={0.1}
@@ -57,11 +78,18 @@ const RemoveBlanksSettings = ({ parameters, onParameterChange, disabled = false
       <Stack gap="xs">
         <Checkbox
           checked={parameters.includeBlankPages}
-          onChange={(event) => onParameterChange('includeBlankPages', event.currentTarget.checked)}
+          onChange={(event) =>
+            onParameterChange("includeBlankPages", event.currentTarget.checked)
+          }
           disabled={disabled}
           label={
             <div>
-              <Text size="sm">{t('removeBlanks.includeBlankPages.label', 'Include detected blank pages')}</Text>
+              <Text size="sm">
+                {t(
+                  "removeBlanks.includeBlankPages.label",
+                  "Include detected blank pages",
+                )}
+              </Text>
             </div>
           }
         />
@@ -71,5 +99,3 @@ const RemoveBlanksSettings = ({ parameters, onParameterChange, disabled = false
 };
 
 export default RemoveBlanksSettings;
-
-
diff --git a/frontend/src/core/components/tools/removeCertificateSign/RemoveCertificateSignSettings.tsx b/frontend/src/core/components/tools/removeCertificateSign/RemoveCertificateSignSettings.tsx
index c9463ad76c..c0612e6c79 100644
--- a/frontend/src/core/components/tools/removeCertificateSign/RemoveCertificateSignSettings.tsx
+++ b/frontend/src/core/components/tools/removeCertificateSign/RemoveCertificateSignSettings.tsx
@@ -1,20 +1,28 @@
-import React from 'react';
-import { useTranslation } from 'react-i18next';
-import { RemoveCertificateSignParameters } from '@app/hooks/tools/removeCertificateSign/useRemoveCertificateSignParameters';
+import React from "react";
+import { useTranslation } from "react-i18next";
+import { RemoveCertificateSignParameters } from "@app/hooks/tools/removeCertificateSign/useRemoveCertificateSignParameters";
 
 interface RemoveCertificateSignSettingsProps {
   parameters: RemoveCertificateSignParameters;
-  onParameterChange: <K extends keyof RemoveCertificateSignParameters>(parameter: K, value: RemoveCertificateSignParameters[K]) => void;
+  onParameterChange: <K extends keyof RemoveCertificateSignParameters>(
+    parameter: K,
+    value: RemoveCertificateSignParameters[K],
+  ) => void;
   disabled?: boolean;
 }
 
-const RemoveCertificateSignSettings: React.FC<RemoveCertificateSignSettingsProps> = (_) => {
+const RemoveCertificateSignSettings: React.FC<
+  RemoveCertificateSignSettingsProps
+> = (_) => {
   const { t } = useTranslation();
 
   return (
     <div className="remove-certificate-sign-settings">
       <p className="text-muted">
-        {t('removeCertSign.description', 'This tool will remove digital certificate signatures from your PDF document.')}
+        {t(
+          "removeCertSign.description",
+          "This tool will remove digital certificate signatures from your PDF document.",
+        )}
       </p>
     </div>
   );
diff --git a/frontend/src/core/components/tools/removePages/RemovePagesSettings.tsx b/frontend/src/core/components/tools/removePages/RemovePagesSettings.tsx
index 13b3ded2bf..aa9fc0eea7 100644
--- a/frontend/src/core/components/tools/removePages/RemovePagesSettings.tsx
+++ b/frontend/src/core/components/tools/removePages/RemovePagesSettings.tsx
@@ -5,33 +5,50 @@ import { validatePageNumbers } from "@app/utils/pageSelection";
 
 interface RemovePagesSettingsProps {
   parameters: RemovePagesParameters;
-  onParameterChange: <K extends keyof RemovePagesParameters>(key: K, value: RemovePagesParameters[K]) => void;
+  onParameterChange: <K extends keyof RemovePagesParameters>(
+    key: K,
+    value: RemovePagesParameters[K],
+  ) => void;
   disabled?: boolean;
 }
 
-const RemovePagesSettings = ({ parameters, onParameterChange, disabled = false }: RemovePagesSettingsProps) => {
+const RemovePagesSettings = ({
+  parameters,
+  onParameterChange,
+  disabled = false,
+}: RemovePagesSettingsProps) => {
   const { t } = useTranslation();
 
   const handlePageNumbersChange = (value: string) => {
     // Allow user to type naturally - don't normalize input in real-time
-    onParameterChange('pageNumbers', value);
+    onParameterChange("pageNumbers", value);
   };
-  console.log('Current pageNumbers input:', parameters.pageNumbers, disabled);
+  console.log("Current pageNumbers input:", parameters.pageNumbers, disabled);
 
   // Check if current input is valid
-  const isValid = validatePageNumbers(parameters.pageNumbers || '');
+  const isValid = validatePageNumbers(parameters.pageNumbers || "");
   const hasValue = (parameters?.pageNumbers?.trim().length ?? 0) > 0;
 
   return (
     <Stack gap="md">
       <TextInput
-        label={t('removePages.pageNumbers.label', 'Pages to Remove')}
-        value={parameters.pageNumbers || ''}
+        label={t("removePages.pageNumbers.label", "Pages to Remove")}
+        value={parameters.pageNumbers || ""}
         onChange={(event) => handlePageNumbersChange(event.currentTarget.value)}
-        placeholder={t('removePages.pageNumbers.placeholder', 'e.g., 1,3,5-8,10')}
+        placeholder={t(
+          "removePages.pageNumbers.placeholder",
+          "e.g., 1,3,5-8,10",
+        )}
         disabled={disabled}
         required
-        error={hasValue && !isValid ? t('removePages.pageNumbers.error', 'Invalid page number format. Use numbers, ranges (1-5), or mathematical expressions (2n+1)') : undefined}
+        error={
+          hasValue && !isValid
+            ? t(
+                "removePages.pageNumbers.error",
+                "Invalid page number format. Use numbers, ranges (1-5), or mathematical expressions (2n+1)",
+              )
+            : undefined
+        }
       />
     </Stack>
   );
diff --git a/frontend/src/core/components/tools/removePassword/RemovePasswordSettings.test.tsx b/frontend/src/core/components/tools/removePassword/RemovePasswordSettings.test.tsx
index bf0a006d6a..9ee6c1faa8 100644
--- a/frontend/src/core/components/tools/removePassword/RemovePasswordSettings.test.tsx
+++ b/frontend/src/core/components/tools/removePassword/RemovePasswordSettings.test.tsx
@@ -1,13 +1,13 @@
-import { describe, expect, test, vi, beforeEach } from 'vitest';
-import { render, screen, fireEvent } from '@testing-library/react';
-import { MantineProvider } from '@mantine/core';
-import RemovePasswordSettings from '@app/components/tools/removePassword/RemovePasswordSettings';
-import { defaultParameters } from '@app/hooks/tools/removePassword/useRemovePasswordParameters';
+import { describe, expect, test, vi, beforeEach } from "vitest";
+import { render, screen, fireEvent } from "@testing-library/react";
+import { MantineProvider } from "@mantine/core";
+import RemovePasswordSettings from "@app/components/tools/removePassword/RemovePasswordSettings";
+import { defaultParameters } from "@app/hooks/tools/removePassword/useRemovePasswordParameters";
 
 // Mock useTranslation with predictable return values
 const mockT = vi.fn((key: string) => `mock-${key}`);
-vi.mock('react-i18next', () => ({
-  useTranslation: () => ({ t: mockT })
+vi.mock("react-i18next", () => ({
+  useTranslation: () => ({ t: mockT }),
 }));
 
 // Wrapper component to provide Mantine context
@@ -15,44 +15,54 @@ const TestWrapper = ({ children }: { children: React.ReactNode }) => (
   <MantineProvider>{children}</MantineProvider>
 );
 
-describe('RemovePasswordSettings', () => {
+describe("RemovePasswordSettings", () => {
   const mockOnParameterChange = vi.fn();
 
   beforeEach(() => {
     vi.clearAllMocks();
   });
 
-  test('should render password input field', () => {
+  test("should render password input field", () => {
     render(
       <TestWrapper>
         <RemovePasswordSettings
           parameters={defaultParameters}
           onParameterChange={mockOnParameterChange}
         />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
-    expect(screen.getByText('mock-removePassword.password.label')).toBeInTheDocument();
+    expect(
+      screen.getByText("mock-removePassword.password.label"),
+    ).toBeInTheDocument();
   });
 
-  test('should call onParameterChange when password is entered', () => {
+  test("should call onParameterChange when password is entered", () => {
     render(
       <TestWrapper>
         <RemovePasswordSettings
           parameters={defaultParameters}
           onParameterChange={mockOnParameterChange}
         />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
-    const passwordInput = screen.getByPlaceholderText('mock-removePassword.password.placeholder');
-    fireEvent.change(passwordInput, { target: { value: 'test-password' } });
+    const passwordInput = screen.getByPlaceholderText(
+      "mock-removePassword.password.placeholder",
+    );
+    fireEvent.change(passwordInput, { target: { value: "test-password" } });
 
-    expect(mockOnParameterChange).toHaveBeenCalledWith('password', 'test-password');
+    expect(mockOnParameterChange).toHaveBeenCalledWith(
+      "password",
+      "test-password",
+    );
   });
 
-  test('should display current password value', () => {
-    const parametersWithPassword = { ...defaultParameters, password: 'current-password' };
+  test("should display current password value", () => {
+    const parametersWithPassword = {
+      ...defaultParameters,
+      password: "current-password",
+    };
 
     render(
       <TestWrapper>
@@ -60,14 +70,16 @@ describe('RemovePasswordSettings', () => {
           parameters={parametersWithPassword}
           onParameterChange={mockOnParameterChange}
         />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
-    const passwordInput = screen.getByPlaceholderText('mock-removePassword.password.placeholder') as HTMLInputElement;
-    expect(passwordInput.value).toBe('current-password');
+    const passwordInput = screen.getByPlaceholderText(
+      "mock-removePassword.password.placeholder",
+    ) as HTMLInputElement;
+    expect(passwordInput.value).toBe("current-password");
   });
 
-  test('should disable password input when disabled prop is true', () => {
+  test("should disable password input when disabled prop is true", () => {
     render(
       <TestWrapper>
         <RemovePasswordSettings
@@ -75,14 +87,16 @@ describe('RemovePasswordSettings', () => {
           onParameterChange={mockOnParameterChange}
           disabled={true}
         />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
-    const passwordInput = screen.getByPlaceholderText('mock-removePassword.password.placeholder');
+    const passwordInput = screen.getByPlaceholderText(
+      "mock-removePassword.password.placeholder",
+    );
     expect(passwordInput).toBeDisabled();
   });
 
-  test('should enable password input when disabled prop is false', () => {
+  test("should enable password input when disabled prop is false", () => {
     render(
       <TestWrapper>
         <RemovePasswordSettings
@@ -90,38 +104,48 @@ describe('RemovePasswordSettings', () => {
           onParameterChange={mockOnParameterChange}
           disabled={false}
         />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
-    const passwordInput = screen.getByPlaceholderText('mock-removePassword.password.placeholder');
+    const passwordInput = screen.getByPlaceholderText(
+      "mock-removePassword.password.placeholder",
+    );
     expect(passwordInput).not.toBeDisabled();
   });
 
-  test('should show password input as required', () => {
+  test("should show password input as required", () => {
     render(
       <TestWrapper>
         <RemovePasswordSettings
           parameters={defaultParameters}
           onParameterChange={mockOnParameterChange}
         />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
-    const passwordInput = screen.getByPlaceholderText('mock-removePassword.password.placeholder');
-    expect(passwordInput).toHaveAttribute('required');
+    const passwordInput = screen.getByPlaceholderText(
+      "mock-removePassword.password.placeholder",
+    );
+    expect(passwordInput).toHaveAttribute("required");
   });
 
-  test('should call translation function with correct keys', () => {
+  test("should call translation function with correct keys", () => {
     render(
       <TestWrapper>
         <RemovePasswordSettings
           parameters={defaultParameters}
           onParameterChange={mockOnParameterChange}
         />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
-    expect(mockT).toHaveBeenCalledWith('removePassword.password.label', 'Current Password');
-    expect(mockT).toHaveBeenCalledWith('removePassword.password.placeholder', 'Enter current password');
+    expect(mockT).toHaveBeenCalledWith(
+      "removePassword.password.label",
+      "Current Password",
+    );
+    expect(mockT).toHaveBeenCalledWith(
+      "removePassword.password.placeholder",
+      "Enter current password",
+    );
   });
 });
diff --git a/frontend/src/core/components/tools/removePassword/RemovePasswordSettings.tsx b/frontend/src/core/components/tools/removePassword/RemovePasswordSettings.tsx
index edc07de7e3..fcfc5d9e5d 100644
--- a/frontend/src/core/components/tools/removePassword/RemovePasswordSettings.tsx
+++ b/frontend/src/core/components/tools/removePassword/RemovePasswordSettings.tsx
@@ -4,21 +4,31 @@ import { RemovePasswordParameters } from "@app/hooks/tools/removePassword/useRem
 
 interface RemovePasswordSettingsProps {
   parameters: RemovePasswordParameters;
-  onParameterChange: <K extends keyof RemovePasswordParameters>(key: K, value: RemovePasswordParameters[K]) => void;
+  onParameterChange: <K extends keyof RemovePasswordParameters>(
+    key: K,
+    value: RemovePasswordParameters[K],
+  ) => void;
   disabled?: boolean;
 }
 
-const RemovePasswordSettings = ({ parameters, onParameterChange, disabled = false }: RemovePasswordSettingsProps) => {
+const RemovePasswordSettings = ({
+  parameters,
+  onParameterChange,
+  disabled = false,
+}: RemovePasswordSettingsProps) => {
   const { t } = useTranslation();
 
   return (
     <Stack gap="md">
       <Stack gap="sm">
         <PasswordInput
-          label={t('removePassword.password.label', 'Current Password')}
-          placeholder={t('removePassword.password.placeholder', 'Enter current password')}
+          label={t("removePassword.password.label", "Current Password")}
+          placeholder={t(
+            "removePassword.password.placeholder",
+            "Enter current password",
+          )}
           value={parameters.password}
-          onChange={(e) => onParameterChange('password', e.target.value)}
+          onChange={(e) => onParameterChange("password", e.target.value)}
           disabled={disabled}
           required
         />
diff --git a/frontend/src/core/components/tools/reorganizePages/ReorganizePagesSettings.tsx b/frontend/src/core/components/tools/reorganizePages/ReorganizePagesSettings.tsx
index cc3b18cfb7..b01b717bb0 100644
--- a/frontend/src/core/components/tools/reorganizePages/ReorganizePagesSettings.tsx
+++ b/frontend/src/core/components/tools/reorganizePages/ReorganizePagesSettings.tsx
@@ -1,8 +1,8 @@
-import { Divider, Select, Stack, TextInput } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { ReorganizePagesParameters } from '@app/hooks/tools/reorganizePages/useReorganizePagesParameters';
-import { getReorganizePagesModeData } from '@app/components/tools/reorganizePages/constants';
-import { Z_INDEX_AUTOMATE_DROPDOWN } from '@app/styles/zIndex';
+import { Divider, Select, Stack, TextInput } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import { ReorganizePagesParameters } from "@app/hooks/tools/reorganizePages/useReorganizePagesParameters";
+import { getReorganizePagesModeData } from "@app/components/tools/reorganizePages/constants";
+import { Z_INDEX_AUTOMATE_DROPDOWN } from "@app/styles/zIndex";
 
 export default function ReorganizePagesSettings({
   parameters,
@@ -12,35 +12,41 @@ export default function ReorganizePagesSettings({
   parameters: ReorganizePagesParameters;
   onParameterChange: <K extends keyof ReorganizePagesParameters>(
     key: K,
-    value: ReorganizePagesParameters[K]
+    value: ReorganizePagesParameters[K],
   ) => void;
   disabled?: boolean;
 }) {
   const { t } = useTranslation();
   const modeData = getReorganizePagesModeData(t);
 
-  const requiresOrder = parameters.customMode === '' || parameters.customMode === 'DUPLICATE';
-  const selectedMode = modeData.find(mode => mode.value === parameters.customMode) || modeData[0];
+  const requiresOrder =
+    parameters.customMode === "" || parameters.customMode === "DUPLICATE";
+  const selectedMode =
+    modeData.find((mode) => mode.value === parameters.customMode) ||
+    modeData[0];
   return (
     <Stack gap="sm">
       <Select
-        label={t('pdfOrganiser.mode._value', 'Organization mode')}
+        label={t("pdfOrganiser.mode._value", "Organization mode")}
         data={modeData}
         value={parameters.customMode}
-        onChange={(v) => onParameterChange('customMode', v ?? '')}
+        onChange={(v) => onParameterChange("customMode", v ?? "")}
         disabled={disabled}
-        comboboxProps={{ withinPortal: true, zIndex: Z_INDEX_AUTOMATE_DROPDOWN }}
+        comboboxProps={{
+          withinPortal: true,
+          zIndex: Z_INDEX_AUTOMATE_DROPDOWN,
+        }}
       />
       {selectedMode && (
         <div
           style={{
-            backgroundColor: 'var(--information-text-bg)',
-            color: 'var(--information-text-color)',
-            padding: '8px 12px',
-            borderRadius: '8px',
-            marginTop: '4px',
-            fontSize: '0.75rem',
-            textAlign: 'center'
+            backgroundColor: "var(--information-text-bg)",
+            color: "var(--information-text-color)",
+            padding: "8px 12px",
+            borderRadius: "8px",
+            marginTop: "4px",
+            fontSize: "0.75rem",
+            textAlign: "center",
           }}
         >
           {selectedMode.description}
@@ -49,18 +55,18 @@ export default function ReorganizePagesSettings({
 
       {requiresOrder && (
         <>
-        <Divider/>
-        <TextInput
-          label={t('pageOrderPrompt', 'Page order / ranges')}
-          placeholder={t('pdfOrganiser.placeholder', 'e.g. 1,3,2,4-6')}
-          value={parameters.pageNumbers}
-          onChange={(e) => onParameterChange('pageNumbers', e.currentTarget.value)}
-          disabled={disabled}
-        />
+          <Divider />
+          <TextInput
+            label={t("pageOrderPrompt", "Page order / ranges")}
+            placeholder={t("pdfOrganiser.placeholder", "e.g. 1,3,2,4-6")}
+            value={parameters.pageNumbers}
+            onChange={(e) =>
+              onParameterChange("pageNumbers", e.currentTarget.value)
+            }
+            disabled={disabled}
+          />
         </>
       )}
     </Stack>
   );
 }
-
-
diff --git a/frontend/src/core/components/tools/reorganizePages/constants.ts b/frontend/src/core/components/tools/reorganizePages/constants.ts
index a61ec38711..503dc01741 100644
--- a/frontend/src/core/components/tools/reorganizePages/constants.ts
+++ b/frontend/src/core/components/tools/reorganizePages/constants.ts
@@ -1,59 +1,92 @@
-import { TFunction } from 'i18next';
+import { TFunction } from "i18next";
 
 export const getReorganizePagesModeData = (t: TFunction) => [
-  { 
-    value: '', 
-    label: t('pdfOrganiser.mode.1', 'Custom Page Order'),
-    description: t('pdfOrganiser.mode.desc.CUSTOM', 'Use a custom sequence of page numbers or expressions to define a new order.')
+  {
+    value: "",
+    label: t("pdfOrganiser.mode.1", "Custom Page Order"),
+    description: t(
+      "pdfOrganiser.mode.desc.CUSTOM",
+      "Use a custom sequence of page numbers or expressions to define a new order.",
+    ),
   },
-  { 
-    value: 'REVERSE_ORDER', 
-    label: t('pdfOrganiser.mode.2', 'Reverse Order'),
-    description: t('pdfOrganiser.mode.desc.REVERSE_ORDER', 'Flip the document so the last page becomes first and so on.')
+  {
+    value: "REVERSE_ORDER",
+    label: t("pdfOrganiser.mode.2", "Reverse Order"),
+    description: t(
+      "pdfOrganiser.mode.desc.REVERSE_ORDER",
+      "Flip the document so the last page becomes first and so on.",
+    ),
   },
-  { 
-    value: 'DUPLEX_SORT', 
-    label: t('pdfOrganiser.mode.3', 'Duplex Sort'),
-    description: t('pdfOrganiser.mode.desc.DUPLEX_SORT', 'Interleave fronts then backs as if a duplex scanner scanned all fronts, then all backs (1, n, 2, n-1, …).')
+  {
+    value: "DUPLEX_SORT",
+    label: t("pdfOrganiser.mode.3", "Duplex Sort"),
+    description: t(
+      "pdfOrganiser.mode.desc.DUPLEX_SORT",
+      "Interleave fronts then backs as if a duplex scanner scanned all fronts, then all backs (1, n, 2, n-1, …).",
+    ),
   },
-  { 
-    value: 'BOOKLET_SORT', 
-    label: t('pdfOrganiser.mode.4', 'Booklet Sort'),
-    description: t('pdfOrganiser.mode.desc.BOOKLET_SORT', 'Arrange pages for booklet printing (last, first, second, second last, …).')
+  {
+    value: "BOOKLET_SORT",
+    label: t("pdfOrganiser.mode.4", "Booklet Sort"),
+    description: t(
+      "pdfOrganiser.mode.desc.BOOKLET_SORT",
+      "Arrange pages for booklet printing (last, first, second, second last, …).",
+    ),
   },
-  { 
-    value: 'SIDE_STITCH_BOOKLET_SORT', 
-    label: t('pdfOrganiser.mode.5', 'Side Stitch Booklet Sort'),
-    description: t('pdfOrganiser.mode.desc.SIDE_STITCH_BOOKLET_SORT', 'Arrange pages for side‑stitch booklet printing (optimized for binding on the side).')
+  {
+    value: "SIDE_STITCH_BOOKLET_SORT",
+    label: t("pdfOrganiser.mode.5", "Side Stitch Booklet Sort"),
+    description: t(
+      "pdfOrganiser.mode.desc.SIDE_STITCH_BOOKLET_SORT",
+      "Arrange pages for side‑stitch booklet printing (optimized for binding on the side).",
+    ),
   },
-  { 
-    value: 'ODD_EVEN_SPLIT', 
-    label: t('pdfOrganiser.mode.6', 'Odd-Even Split'),
-    description: t('pdfOrganiser.mode.desc.ODD_EVEN_SPLIT', 'Split the document into two outputs: all odd pages and all even pages.')
+  {
+    value: "ODD_EVEN_SPLIT",
+    label: t("pdfOrganiser.mode.6", "Odd-Even Split"),
+    description: t(
+      "pdfOrganiser.mode.desc.ODD_EVEN_SPLIT",
+      "Split the document into two outputs: all odd pages and all even pages.",
+    ),
   },
-  { 
-    value: 'ODD_EVEN_MERGE', 
-    label: t('pdfOrganiser.mode.10', 'Odd-Even Merge'),
-    description: t('pdfOrganiser.mode.desc.ODD_EVEN_MERGE', 'Merge two PDFs by alternating pages: odd from the first, even from the second.')
+  {
+    value: "ODD_EVEN_MERGE",
+    label: t("pdfOrganiser.mode.10", "Odd-Even Merge"),
+    description: t(
+      "pdfOrganiser.mode.desc.ODD_EVEN_MERGE",
+      "Merge two PDFs by alternating pages: odd from the first, even from the second.",
+    ),
   },
-  { 
-    value: 'DUPLICATE', 
-    label: t('pdfOrganiser.mode.11', 'Duplicate all pages'),
-    description: t('pdfOrganiser.mode.desc.DUPLICATE', 'Duplicate each page according to the custom order count (e.g., 4 duplicates each page 4×).')
+  {
+    value: "DUPLICATE",
+    label: t("pdfOrganiser.mode.11", "Duplicate all pages"),
+    description: t(
+      "pdfOrganiser.mode.desc.DUPLICATE",
+      "Duplicate each page according to the custom order count (e.g., 4 duplicates each page 4×).",
+    ),
   },
-  { 
-    value: 'REMOVE_FIRST', 
-    label: t('pdfOrganiser.mode.7', 'Remove First'),
-    description: t('pdfOrganiser.mode.desc.REMOVE_FIRST', 'Remove the first page from the document.')
+  {
+    value: "REMOVE_FIRST",
+    label: t("pdfOrganiser.mode.7", "Remove First"),
+    description: t(
+      "pdfOrganiser.mode.desc.REMOVE_FIRST",
+      "Remove the first page from the document.",
+    ),
   },
-  { 
-    value: 'REMOVE_LAST', 
-    label: t('pdfOrganiser.mode.8', 'Remove Last'),
-    description: t('pdfOrganiser.mode.desc.REMOVE_LAST', 'Remove the last page from the document.')
+  {
+    value: "REMOVE_LAST",
+    label: t("pdfOrganiser.mode.8", "Remove Last"),
+    description: t(
+      "pdfOrganiser.mode.desc.REMOVE_LAST",
+      "Remove the last page from the document.",
+    ),
   },
-  { 
-    value: 'REMOVE_FIRST_AND_LAST', 
-    label: t('pdfOrganiser.mode.9', 'Remove First and Last'),
-    description: t('pdfOrganiser.mode.desc.REMOVE_FIRST_AND_LAST', 'Remove both the first and last pages from the document.')
+  {
+    value: "REMOVE_FIRST_AND_LAST",
+    label: t("pdfOrganiser.mode.9", "Remove First and Last"),
+    description: t(
+      "pdfOrganiser.mode.desc.REMOVE_FIRST_AND_LAST",
+      "Remove both the first and last pages from the document.",
+    ),
   },
 ];
diff --git a/frontend/src/core/components/tools/repair/RepairSettings.tsx b/frontend/src/core/components/tools/repair/RepairSettings.tsx
index a18664f7fa..a284bfcfda 100644
--- a/frontend/src/core/components/tools/repair/RepairSettings.tsx
+++ b/frontend/src/core/components/tools/repair/RepairSettings.tsx
@@ -1,10 +1,13 @@
-import React from 'react';
-import { useTranslation } from 'react-i18next';
-import { RepairParameters } from '@app/hooks/tools/repair/useRepairParameters';
+import React from "react";
+import { useTranslation } from "react-i18next";
+import { RepairParameters } from "@app/hooks/tools/repair/useRepairParameters";
 
 interface RepairSettingsProps {
   parameters: RepairParameters;
-  onParameterChange: <K extends keyof RepairParameters>(parameter: K, value: RepairParameters[K]) => void;
+  onParameterChange: <K extends keyof RepairParameters>(
+    parameter: K,
+    value: RepairParameters[K],
+  ) => void;
   disabled?: boolean;
 }
 
@@ -14,7 +17,10 @@ const RepairSettings: React.FC<RepairSettingsProps> = (_) => {
   return (
     <div className="repair-settings">
       <p className="text-muted">
-        {t('repair.description', 'This tool will attempt to repair corrupted or damaged PDF files. No additional settings are required.')}
+        {t(
+          "repair.description",
+          "This tool will attempt to repair corrupted or damaged PDF files. No additional settings are required.",
+        )}
       </p>
     </div>
   );
diff --git a/frontend/src/core/components/tools/replaceColor/ReplaceColorSettings.tsx b/frontend/src/core/components/tools/replaceColor/ReplaceColorSettings.tsx
index 3617a57f62..36fe99a6b0 100644
--- a/frontend/src/core/components/tools/replaceColor/ReplaceColorSettings.tsx
+++ b/frontend/src/core/components/tools/replaceColor/ReplaceColorSettings.tsx
@@ -5,106 +5,137 @@ import { Z_INDEX_AUTOMATE_DROPDOWN } from "@app/styles/zIndex";
 
 interface ReplaceColorSettingsProps {
   parameters: ReplaceColorParameters;
-  onParameterChange: <K extends keyof ReplaceColorParameters>(key: K, value: ReplaceColorParameters[K]) => void;
+  onParameterChange: <K extends keyof ReplaceColorParameters>(
+    key: K,
+    value: ReplaceColorParameters[K],
+  ) => void;
   disabled?: boolean;
 }
 
-const ReplaceColorSettings = ({ parameters, onParameterChange, disabled = false }: ReplaceColorSettingsProps) => {
+const ReplaceColorSettings = ({
+  parameters,
+  onParameterChange,
+  disabled = false,
+}: ReplaceColorSettingsProps) => {
   const { t } = useTranslation();
 
   const replaceAndInvertOptions = [
     {
-      value: 'HIGH_CONTRAST_COLOR',
-      label: t('replaceColor.options.highContrast', 'High contrast')
+      value: "HIGH_CONTRAST_COLOR",
+      label: t("replaceColor.options.highContrast", "High contrast"),
     },
     {
-      value: 'FULL_INVERSION',
-      label: t('replaceColor.options.invertAll', 'Invert all colours')
+      value: "FULL_INVERSION",
+      label: t("replaceColor.options.invertAll", "Invert all colours"),
     },
     {
-      value: 'CUSTOM_COLOR',
-      label: t('replaceColor.options.custom', 'Custom')
+      value: "CUSTOM_COLOR",
+      label: t("replaceColor.options.custom", "Custom"),
     },
     {
-      value: 'COLOR_SPACE_CONVERSION',
-      label: t('replaceColor.options.cmyk', 'Convert to CMYK')
-    }
+      value: "COLOR_SPACE_CONVERSION",
+      label: t("replaceColor.options.cmyk", "Convert to CMYK"),
+    },
   ];
 
   const highContrastOptions = [
     {
-      value: 'WHITE_TEXT_ON_BLACK',
-      label: t('replace-color.selectText.6', 'White text on black background')
+      value: "WHITE_TEXT_ON_BLACK",
+      label: t("replace-color.selectText.6", "White text on black background"),
     },
     {
-      value: 'BLACK_TEXT_ON_WHITE',
-      label: t('replace-color.selectText.7', 'Black text on white background')
+      value: "BLACK_TEXT_ON_WHITE",
+      label: t("replace-color.selectText.7", "Black text on white background"),
     },
     {
-      value: 'YELLOW_TEXT_ON_BLACK',
-      label: t('replace-color.selectText.8', 'Yellow text on black background')
+      value: "YELLOW_TEXT_ON_BLACK",
+      label: t("replace-color.selectText.8", "Yellow text on black background"),
     },
     {
-      value: 'GREEN_TEXT_ON_BLACK',
-      label: t('replace-color.selectText.9', 'Green text on black background')
-    }
+      value: "GREEN_TEXT_ON_BLACK",
+      label: t("replace-color.selectText.9", "Green text on black background"),
+    },
   ];
 
   return (
     <Stack gap="md">
       <Stack gap="xs">
         <Text size="sm" fw={500}>
-          {t('replaceColor.labels.colourOperation', 'Colour operation')}
+          {t("replaceColor.labels.colourOperation", "Colour operation")}
         </Text>
         <Select
           value={parameters.replaceAndInvertOption}
-          onChange={(value) => value && onParameterChange('replaceAndInvertOption', value as ReplaceColorParameters['replaceAndInvertOption'])}
+          onChange={(value) =>
+            value &&
+            onParameterChange(
+              "replaceAndInvertOption",
+              value as ReplaceColorParameters["replaceAndInvertOption"],
+            )
+          }
           data={replaceAndInvertOptions}
           disabled={disabled}
-          comboboxProps={{ withinPortal: true, zIndex: Z_INDEX_AUTOMATE_DROPDOWN }}
+          comboboxProps={{
+            withinPortal: true,
+            zIndex: Z_INDEX_AUTOMATE_DROPDOWN,
+          }}
         />
       </Stack>
 
-      {parameters.replaceAndInvertOption === 'HIGH_CONTRAST_COLOR' && (
+      {parameters.replaceAndInvertOption === "HIGH_CONTRAST_COLOR" && (
         <Stack gap="xs">
           <Text size="sm" fw={500}>
-            {t('replace-color.selectText.5', 'High contrast color options')}
+            {t("replace-color.selectText.5", "High contrast color options")}
           </Text>
           <Select
             value={parameters.highContrastColorCombination}
-            onChange={(value) => value && onParameterChange('highContrastColorCombination', value as ReplaceColorParameters['highContrastColorCombination'])}
+            onChange={(value) =>
+              value &&
+              onParameterChange(
+                "highContrastColorCombination",
+                value as ReplaceColorParameters["highContrastColorCombination"],
+              )
+            }
             data={highContrastOptions}
             disabled={disabled}
-            comboboxProps={{ withinPortal: true, zIndex: Z_INDEX_AUTOMATE_DROPDOWN }}
+            comboboxProps={{
+              withinPortal: true,
+              zIndex: Z_INDEX_AUTOMATE_DROPDOWN,
+            }}
           />
         </Stack>
       )}
 
-      {parameters.replaceAndInvertOption === 'CUSTOM_COLOR' && (
+      {parameters.replaceAndInvertOption === "CUSTOM_COLOR" && (
         <>
           <Stack gap="xs">
             <Text size="sm" fw={500}>
-              {t('replace-color.selectText.10', 'Choose text Color')}
+              {t("replace-color.selectText.10", "Choose text Color")}
             </Text>
             <ColorInput
               value={parameters.textColor}
-              onChange={(value) => onParameterChange('textColor', value)}
+              onChange={(value) => onParameterChange("textColor", value)}
               format="hex"
               disabled={disabled}
-              popoverProps={{ withinPortal: true, zIndex: Z_INDEX_AUTOMATE_DROPDOWN }}
+              popoverProps={{
+                withinPortal: true,
+                zIndex: Z_INDEX_AUTOMATE_DROPDOWN,
+              }}
             />
           </Stack>
 
           <Stack gap="xs">
             <Text size="sm" fw={500}>
-              {t('replace-color.selectText.11', 'Choose background Color')}
+              {t("replace-color.selectText.11", "Choose background Color")}
             </Text>
             <ColorInput
               value={parameters.backGroundColor}
-              onChange={(value) => onParameterChange('backGroundColor', value)}
+              onChange={(value) => onParameterChange("backGroundColor", value)}
               format="hex"
               disabled={disabled}
-              popoverProps={{ withinPortal: true, zIndex: Z_INDEX_AUTOMATE_DROPDOWN }}
+              popoverProps={{
+                withinPortal: true,
+                zIndex: Z_INDEX_AUTOMATE_DROPDOWN,
+              }}
             />
           </Stack>
         </>
diff --git a/frontend/src/core/components/tools/rotate/RotateAutomationSettings.tsx b/frontend/src/core/components/tools/rotate/RotateAutomationSettings.tsx
index d449578b12..50bb6438fd 100644
--- a/frontend/src/core/components/tools/rotate/RotateAutomationSettings.tsx
+++ b/frontend/src/core/components/tools/rotate/RotateAutomationSettings.tsx
@@ -12,11 +12,18 @@ import ButtonSelector from "@app/components/shared/ButtonSelector";
 
 interface RotateAutomationSettingsProps {
   parameters: RotateParameters;
-  onParameterChange: <K extends keyof RotateParameters>(key: K, value: RotateParameters[K]) => void;
+  onParameterChange: <K extends keyof RotateParameters>(
+    key: K,
+    value: RotateParameters[K],
+  ) => void;
   disabled?: boolean;
 }
 
-const RotateAutomationSettings = ({ parameters, onParameterChange, disabled = false }: RotateAutomationSettingsProps) => {
+const RotateAutomationSettings = ({
+  parameters,
+  onParameterChange,
+  disabled = false,
+}: RotateAutomationSettingsProps) => {
   const { t } = useTranslation();
 
   return (
@@ -27,7 +34,7 @@ const RotateAutomationSettings = ({ parameters, onParameterChange, disabled = fa
 
       <ButtonSelector
         value={parameters.angle}
-        onChange={(value: number) => onParameterChange('angle', value)}
+        onChange={(value: number) => onParameterChange("angle", value)}
         options={[
           { value: 0, label: "0°" },
           { value: 90, label: "90°" },
diff --git a/frontend/src/core/components/tools/rotate/RotateSettings.tsx b/frontend/src/core/components/tools/rotate/RotateSettings.tsx
index 9ac4748aea..134bf97b4e 100644
--- a/frontend/src/core/components/tools/rotate/RotateSettings.tsx
+++ b/frontend/src/core/components/tools/rotate/RotateSettings.tsx
@@ -12,7 +12,10 @@ interface RotateSettingsProps {
   disabled?: boolean;
 }
 
-const RotateSettings = ({ parameters, disabled = false }: RotateSettingsProps) => {
+const RotateSettings = ({
+  parameters,
+  disabled = false,
+}: RotateSettingsProps) => {
   const { t } = useTranslation();
   const { selectedFileStubs } = useSelectedFiles();
 
@@ -33,19 +36,19 @@ const RotateSettings = ({ parameters, disabled = false }: RotateSettingsProps) =
 
   useEffect(() => {
     const handleKeyDown = (event: KeyboardEvent) => {
-      if (event.key === 'ArrowLeft') {
+      if (event.key === "ArrowLeft") {
         event.preventDefault();
         parameters.rotateAnticlockwise();
-      } else if (event.key === 'ArrowRight') {
+      } else if (event.key === "ArrowRight") {
         event.preventDefault();
         parameters.rotateClockwise();
       }
     };
 
-    window.addEventListener('keydown', handleKeyDown);
+    window.addEventListener("keydown", handleKeyDown);
 
     return () => {
-      window.removeEventListener('keydown', handleKeyDown);
+      window.removeEventListener("keydown", handleKeyDown);
     };
   }, [parameters]);
 
@@ -60,32 +63,29 @@ const RotateSettings = ({ parameters, disabled = false }: RotateSettingsProps) =
         <Center>
           <Box
             style={{
-              width: '280px',
-              height: '280px',
-              border: '1px solid var(--mantine-color-gray-3)',
-              borderRadius: '8px',
-              display: 'flex',
-              alignItems: 'center',
-              justifyContent: 'center',
-              backgroundColor: 'var(--mantine-color-gray-0)',
-              overflow: 'hidden',
+              width: "280px",
+              height: "280px",
+              border: "1px solid var(--mantine-color-gray-3)",
+              borderRadius: "8px",
+              display: "flex",
+              alignItems: "center",
+              justifyContent: "center",
+              backgroundColor: "var(--mantine-color-gray-0)",
+              overflow: "hidden",
             }}
           >
             <Box
               style={{
-                width: '100%',
-                height: '100%',
+                width: "100%",
+                height: "100%",
                 transform: `rotate(${currentAngle}deg)`,
-                transition: 'transform 0.3s ease-in-out',
-                display: 'flex',
-                alignItems: 'center',
-                justifyContent: 'center',
+                transition: "transform 0.3s ease-in-out",
+                display: "flex",
+                alignItems: "center",
+                justifyContent: "center",
               }}
             >
-              <DocumentThumbnail
-                file={selectedStub}
-                thumbnail={thumbnail}
-              />
+              <DocumentThumbnail file={selectedStub} thumbnail={thumbnail} />
             </Box>
           </Box>
         </Center>
@@ -101,7 +101,7 @@ const RotateSettings = ({ parameters, disabled = false }: RotateSettingsProps) =
           aria-label={t("rotate.rotateLeft", "Rotate Anticlockwise")}
           title={t("rotate.rotateLeft", "Rotate Anticlockwise")}
         >
-          <RotateLeftIcon style={{ fontSize: '1.5rem' }} />
+          <RotateLeftIcon style={{ fontSize: "1.5rem" }} />
         </ActionIcon>
 
         <ActionIcon
@@ -112,7 +112,7 @@ const RotateSettings = ({ parameters, disabled = false }: RotateSettingsProps) =
           aria-label={t("rotate.rotateRight", "Rotate Clockwise")}
           title={t("rotate.rotateRight", "Rotate Clockwise")}
         >
-          <RotateRightIcon style={{ fontSize: '1.5rem' }} />
+          <RotateRightIcon style={{ fontSize: "1.5rem" }} />
         </ActionIcon>
       </Group>
     </Stack>
diff --git a/frontend/src/core/components/tools/sanitize/SanitizeSettings.test.tsx b/frontend/src/core/components/tools/sanitize/SanitizeSettings.test.tsx
index 2d1c3b68fe..4fde481b8e 100644
--- a/frontend/src/core/components/tools/sanitize/SanitizeSettings.test.tsx
+++ b/frontend/src/core/components/tools/sanitize/SanitizeSettings.test.tsx
@@ -1,13 +1,13 @@
-import { describe, expect, test, vi, beforeEach } from 'vitest';
-import { render, screen, fireEvent } from '@testing-library/react';
-import { MantineProvider } from '@mantine/core';
-import SanitizeSettings from '@app/components/tools/sanitize/SanitizeSettings';
-import { SanitizeParameters } from '@app/hooks/tools/sanitize/useSanitizeParameters';
+import { describe, expect, test, vi, beforeEach } from "vitest";
+import { render, screen, fireEvent } from "@testing-library/react";
+import { MantineProvider } from "@mantine/core";
+import SanitizeSettings from "@app/components/tools/sanitize/SanitizeSettings";
+import { SanitizeParameters } from "@app/hooks/tools/sanitize/useSanitizeParameters";
 
 // Mock useTranslation with predictable return values
 const mockT = vi.fn((key: string) => `mock-${key}`);
-vi.mock('react-i18next', () => ({
-  useTranslation: () => ({ t: mockT })
+vi.mock("react-i18next", () => ({
+  useTranslation: () => ({ t: mockT }),
 }));
 
 // Wrapper component to provide Mantine context
@@ -15,7 +15,7 @@ const TestWrapper = ({ children }: { children: React.ReactNode }) => (
   <MantineProvider>{children}</MantineProvider>
 );
 
-describe('SanitizeSettings', () => {
+describe("SanitizeSettings", () => {
   const defaultParameters: SanitizeParameters = {
     removeJavaScript: true,
     removeEmbeddedFiles: true,
@@ -31,33 +31,33 @@ describe('SanitizeSettings', () => {
     vi.clearAllMocks();
   });
 
-  test('should render all sanitization option checkboxes', () => {
+  test("should render all sanitization option checkboxes", () => {
     render(
       <TestWrapper>
         <SanitizeSettings
           parameters={defaultParameters}
           onParameterChange={mockOnParameterChange}
         />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
     // Should render one checkbox for each parameter
     const expectedCheckboxCount = Object.keys(defaultParameters).length;
-    const checkboxes = screen.getAllByRole('checkbox');
+    const checkboxes = screen.getAllByRole("checkbox");
     expect(checkboxes).toHaveLength(expectedCheckboxCount);
   });
 
-  test('should show correct initial checkbox states based on parameters', () => {
+  test("should show correct initial checkbox states based on parameters", () => {
     render(
       <TestWrapper>
         <SanitizeSettings
           parameters={defaultParameters}
           onParameterChange={mockOnParameterChange}
         />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
-    const checkboxes = screen.getAllByRole('checkbox');
+    const checkboxes = screen.getAllByRole("checkbox");
     const parameterValues = Object.values(defaultParameters);
 
     parameterValues.forEach((value, index) => {
@@ -69,28 +69,34 @@ describe('SanitizeSettings', () => {
     });
   });
 
-  test('should call onParameterChange with correct parameters when checkboxes are clicked', () => {
+  test("should call onParameterChange with correct parameters when checkboxes are clicked", () => {
     render(
       <TestWrapper>
         <SanitizeSettings
           parameters={defaultParameters}
           onParameterChange={mockOnParameterChange}
         />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
-    const checkboxes = screen.getAllByRole('checkbox');
+    const checkboxes = screen.getAllByRole("checkbox");
 
     // Click the first checkbox (removeJavaScript - should toggle from true to false)
     fireEvent.click(checkboxes[0]);
-    expect(mockOnParameterChange).toHaveBeenCalledWith('removeJavaScript', false);
+    expect(mockOnParameterChange).toHaveBeenCalledWith(
+      "removeJavaScript",
+      false,
+    );
 
     // Click the third checkbox (removeXMPMetadata - should toggle from false to true)
     fireEvent.click(checkboxes[2]);
-    expect(mockOnParameterChange).toHaveBeenCalledWith('removeXMPMetadata', true);
+    expect(mockOnParameterChange).toHaveBeenCalledWith(
+      "removeXMPMetadata",
+      true,
+    );
   });
 
-  test('should disable all checkboxes when disabled prop is true', () => {
+  test("should disable all checkboxes when disabled prop is true", () => {
     render(
       <TestWrapper>
         <SanitizeSettings
@@ -98,16 +104,16 @@ describe('SanitizeSettings', () => {
           onParameterChange={mockOnParameterChange}
           disabled={true}
         />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
-    const checkboxes = screen.getAllByRole('checkbox');
-    checkboxes.forEach(checkbox => {
+    const checkboxes = screen.getAllByRole("checkbox");
+    checkboxes.forEach((checkbox) => {
       expect(checkbox).toBeDisabled();
     });
   });
 
-  test('should enable all checkboxes when disabled prop is false or undefined', () => {
+  test("should enable all checkboxes when disabled prop is false or undefined", () => {
     render(
       <TestWrapper>
         <SanitizeSettings
@@ -115,16 +121,16 @@ describe('SanitizeSettings', () => {
           onParameterChange={mockOnParameterChange}
           disabled={false}
         />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
-    const checkboxes = screen.getAllByRole('checkbox');
-    checkboxes.forEach(checkbox => {
+    const checkboxes = screen.getAllByRole("checkbox");
+    checkboxes.forEach((checkbox) => {
       expect(checkbox).not.toBeDisabled();
     });
   });
 
-  test('should handle different parameter combinations', () => {
+  test("should handle different parameter combinations", () => {
     const allEnabledParameters: SanitizeParameters = {
       removeJavaScript: true,
       removeEmbeddedFiles: true,
@@ -140,33 +146,45 @@ describe('SanitizeSettings', () => {
           parameters={allEnabledParameters}
           onParameterChange={mockOnParameterChange}
         />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
-    const checkboxes = screen.getAllByRole('checkbox');
-    checkboxes.forEach(checkbox => {
+    const checkboxes = screen.getAllByRole("checkbox");
+    checkboxes.forEach((checkbox) => {
       expect(checkbox).toBeChecked();
     });
   });
 
-  test('should call translation function with correct keys', () => {
+  test("should call translation function with correct keys", () => {
     render(
       <TestWrapper>
         <SanitizeSettings
           parameters={defaultParameters}
           onParameterChange={mockOnParameterChange}
         />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
     // Verify that translation keys are being called (just check that it was called, not specific order)
-    expect(mockT).toHaveBeenCalledWith('sanitize.options.title', expect.any(String));
-    expect(mockT).toHaveBeenCalledWith('sanitize.options.removeJavaScript.label', expect.any(String));
-    expect(mockT).toHaveBeenCalledWith('sanitize.options.removeEmbeddedFiles.label', expect.any(String));
-    expect(mockT).toHaveBeenCalledWith('sanitize.options.note', expect.any(String));
+    expect(mockT).toHaveBeenCalledWith(
+      "sanitize.options.title",
+      expect.any(String),
+    );
+    expect(mockT).toHaveBeenCalledWith(
+      "sanitize.options.removeJavaScript.label",
+      expect.any(String),
+    );
+    expect(mockT).toHaveBeenCalledWith(
+      "sanitize.options.removeEmbeddedFiles.label",
+      expect.any(String),
+    );
+    expect(mockT).toHaveBeenCalledWith(
+      "sanitize.options.note",
+      expect.any(String),
+    );
   });
 
-  test('should not call onParameterChange when disabled', () => {
+  test("should not call onParameterChange when disabled", () => {
     render(
       <TestWrapper>
         <SanitizeSettings
@@ -174,13 +192,13 @@ describe('SanitizeSettings', () => {
           onParameterChange={mockOnParameterChange}
           disabled={true}
         />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
-    const checkboxes = screen.getAllByRole('checkbox');
+    const checkboxes = screen.getAllByRole("checkbox");
 
     // Verify checkboxes are disabled
-    checkboxes.forEach(checkbox => {
+    checkboxes.forEach((checkbox) => {
       expect(checkbox).toBeDisabled();
     });
 
diff --git a/frontend/src/core/components/tools/sanitize/SanitizeSettings.tsx b/frontend/src/core/components/tools/sanitize/SanitizeSettings.tsx
index ff53def58c..037a3425d7 100644
--- a/frontend/src/core/components/tools/sanitize/SanitizeSettings.tsx
+++ b/frontend/src/core/components/tools/sanitize/SanitizeSettings.tsx
@@ -1,17 +1,29 @@
 import { Stack, Text, Checkbox } from "@mantine/core";
 import { useTranslation } from "react-i18next";
-import { SanitizeParameters, defaultParameters } from "@app/hooks/tools/sanitize/useSanitizeParameters";
+import {
+  SanitizeParameters,
+  defaultParameters,
+} from "@app/hooks/tools/sanitize/useSanitizeParameters";
 
 interface SanitizeSettingsProps {
   parameters: SanitizeParameters;
-  onParameterChange: <K extends keyof SanitizeParameters>(key: K, value: SanitizeParameters[K]) => void;
+  onParameterChange: <K extends keyof SanitizeParameters>(
+    key: K,
+    value: SanitizeParameters[K],
+  ) => void;
   disabled?: boolean;
 }
 
-const SanitizeSettings = ({ parameters, onParameterChange, disabled = false }: SanitizeSettingsProps) => {
+const SanitizeSettings = ({
+  parameters,
+  onParameterChange,
+  disabled = false,
+}: SanitizeSettingsProps) => {
   const { t } = useTranslation();
 
-  const options = (Object.keys(defaultParameters) as Array<keyof SanitizeParameters>).map((key) => ({
+  const options = (
+    Object.keys(defaultParameters) as Array<keyof SanitizeParameters>
+  ).map((key) => ({
     key,
     label: t(`sanitize.options.${key}.label`, key),
     description: t(`sanitize.options.${key}.desc`, `${key} from the PDF`),
@@ -21,7 +33,7 @@ const SanitizeSettings = ({ parameters, onParameterChange, disabled = false }: S
   return (
     <Stack gap="md">
       <Text size="sm" fw={500}>
-        {t('sanitize.options.title', 'Sanitization Options')}
+        {t("sanitize.options.title", "Sanitization Options")}
       </Text>
 
       <Stack gap="sm">
@@ -29,12 +41,16 @@ const SanitizeSettings = ({ parameters, onParameterChange, disabled = false }: S
           <Checkbox
             key={option.key}
             checked={parameters[option.key]}
-            onChange={(event) => onParameterChange(option.key, event.currentTarget.checked)}
+            onChange={(event) =>
+              onParameterChange(option.key, event.currentTarget.checked)
+            }
             disabled={disabled}
             label={
               <div>
                 <Text size="sm">{option.label}</Text>
-                <Text size="xs" c="dimmed">{option.description}</Text>
+                <Text size="xs" c="dimmed">
+                  {option.description}
+                </Text>
               </div>
             }
           />
@@ -42,7 +58,10 @@ const SanitizeSettings = ({ parameters, onParameterChange, disabled = false }: S
       </Stack>
 
       <Text size="xs" c="dimmed">
-        {t('sanitize.options.note', 'Select the elements you want to remove from the PDF. At least one option must be selected.')}
+        {t(
+          "sanitize.options.note",
+          "Select the elements you want to remove from the PDF. At least one option must be selected.",
+        )}
       </Text>
     </Stack>
   );
diff --git a/frontend/src/core/components/tools/scannerImageSplit/ScannerImageSplitSettings.tsx b/frontend/src/core/components/tools/scannerImageSplit/ScannerImageSplitSettings.tsx
index 28afd15d15..90913f64f0 100644
--- a/frontend/src/core/components/tools/scannerImageSplit/ScannerImageSplitSettings.tsx
+++ b/frontend/src/core/components/tools/scannerImageSplit/ScannerImageSplitSettings.tsx
@@ -1,68 +1,96 @@
-import React from 'react';
-import { useTranslation } from 'react-i18next';
-import { NumberInput, Stack } from '@mantine/core';
-import { ScannerImageSplitParameters } from '@app/hooks/tools/scannerImageSplit/useScannerImageSplitParameters';
+import React from "react";
+import { useTranslation } from "react-i18next";
+import { NumberInput, Stack } from "@mantine/core";
+import { ScannerImageSplitParameters } from "@app/hooks/tools/scannerImageSplit/useScannerImageSplitParameters";
 
 interface ScannerImageSplitSettingsProps {
   parameters: ScannerImageSplitParameters;
-  onParameterChange: <K extends keyof ScannerImageSplitParameters>(key: K, value: ScannerImageSplitParameters[K]) => void;
+  onParameterChange: <K extends keyof ScannerImageSplitParameters>(
+    key: K,
+    value: ScannerImageSplitParameters[K],
+  ) => void;
   disabled?: boolean;
 }
 
 const ScannerImageSplitSettings: React.FC<ScannerImageSplitSettingsProps> = ({
   parameters,
   onParameterChange,
-  disabled = false
+  disabled = false,
 }) => {
   const { t } = useTranslation();
 
   return (
     <Stack gap="md">
       <NumberInput
-        label={t('ScannerImageSplit.selectText.1', 'Angle Threshold:')}
-        description={t('ScannerImageSplit.selectText.2', 'Sets the minimum absolute angle required for the image to be rotated (default: 10).')}
+        label={t("ScannerImageSplit.selectText.1", "Angle Threshold:")}
+        description={t(
+          "ScannerImageSplit.selectText.2",
+          "Sets the minimum absolute angle required for the image to be rotated (default: 10).",
+        )}
         value={parameters.angle_threshold}
-        onChange={(value) => onParameterChange('angle_threshold', Number(value) || 10)}
+        onChange={(value) =>
+          onParameterChange("angle_threshold", Number(value) || 10)
+        }
         min={0}
         step={1}
         disabled={disabled}
       />
 
       <NumberInput
-        label={t('ScannerImageSplit.selectText.3', 'Tolerance:')}
-        description={t('ScannerImageSplit.selectText.4', 'Determines the range of colour variation around the estimated background colour (default: 30).')}
+        label={t("ScannerImageSplit.selectText.3", "Tolerance:")}
+        description={t(
+          "ScannerImageSplit.selectText.4",
+          "Determines the range of colour variation around the estimated background colour (default: 30).",
+        )}
         value={parameters.tolerance}
-        onChange={(value) => onParameterChange('tolerance', Number(value) || 30)}
+        onChange={(value) =>
+          onParameterChange("tolerance", Number(value) || 30)
+        }
         min={0}
         step={1}
         disabled={disabled}
       />
 
       <NumberInput
-        label={t('ScannerImageSplit.selectText.5', 'Minimum Area:')}
-        description={t('ScannerImageSplit.selectText.6', 'Sets the minimum area threshold for a photo (default: 10000).')}
+        label={t("ScannerImageSplit.selectText.5", "Minimum Area:")}
+        description={t(
+          "ScannerImageSplit.selectText.6",
+          "Sets the minimum area threshold for a photo (default: 10000).",
+        )}
         value={parameters.min_area}
-        onChange={(value) => onParameterChange('min_area', Number(value) || 10000)}
+        onChange={(value) =>
+          onParameterChange("min_area", Number(value) || 10000)
+        }
         min={0}
         step={100}
         disabled={disabled}
       />
 
       <NumberInput
-        label={t('ScannerImageSplit.selectText.7', 'Minimum Contour Area:')}
-        description={t('ScannerImageSplit.selectText.8', 'Sets the minimum contour area threshold for a photo.')}
+        label={t("ScannerImageSplit.selectText.7", "Minimum Contour Area:")}
+        description={t(
+          "ScannerImageSplit.selectText.8",
+          "Sets the minimum contour area threshold for a photo.",
+        )}
         value={parameters.min_contour_area}
-        onChange={(value) => onParameterChange('min_contour_area', Number(value) || 500)}
+        onChange={(value) =>
+          onParameterChange("min_contour_area", Number(value) || 500)
+        }
         min={0}
         step={10}
         disabled={disabled}
       />
 
       <NumberInput
-        label={t('ScannerImageSplit.selectText.9', 'Border Size:')}
-        description={t('ScannerImageSplit.selectText.10', 'Sets the size of the border added and removed to prevent white borders in the output (default: 1).')}
+        label={t("ScannerImageSplit.selectText.9", "Border Size:")}
+        description={t(
+          "ScannerImageSplit.selectText.10",
+          "Sets the size of the border added and removed to prevent white borders in the output (default: 1).",
+        )}
         value={parameters.border_size}
-        onChange={(value) => onParameterChange('border_size', Number(value) || 1)}
+        onChange={(value) =>
+          onParameterChange("border_size", Number(value) || 1)
+        }
         min={0}
         step={1}
         disabled={disabled}
@@ -71,4 +99,4 @@ const ScannerImageSplitSettings: React.FC<ScannerImageSplitSettingsProps> = ({
   );
 };
 
-export default ScannerImageSplitSettings;
\ No newline at end of file
+export default ScannerImageSplitSettings;
diff --git a/frontend/src/core/components/tools/shared/ErrorNotification.tsx b/frontend/src/core/components/tools/shared/ErrorNotification.tsx
index 5b51ab11ec..b9a4cdcdf6 100644
--- a/frontend/src/core/components/tools/shared/ErrorNotification.tsx
+++ b/frontend/src/core/components/tools/shared/ErrorNotification.tsx
@@ -1,5 +1,5 @@
-import { Notification } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
+import { Notification } from "@mantine/core";
+import { useTranslation } from "react-i18next";
 
 export interface ErrorNotificationProps {
   error: string | null;
@@ -13,8 +13,8 @@ const ErrorNotification = ({
   error,
   onClose,
   title,
-  color = 'red',
-  mb = 'md'
+  color = "red",
+  mb = "md",
 }: ErrorNotificationProps) => {
   const { t } = useTranslation();
 
diff --git a/frontend/src/core/components/tools/shared/FileMetadata.tsx b/frontend/src/core/components/tools/shared/FileMetadata.tsx
index 017934c203..3a11ff1be3 100644
--- a/frontend/src/core/components/tools/shared/FileMetadata.tsx
+++ b/frontend/src/core/components/tools/shared/FileMetadata.tsx
@@ -1,5 +1,5 @@
-import { Stack, Text } from '@mantine/core';
-import { formatFileSize, getFileDate } from '@app/utils/fileUtils';
+import { Stack, Text } from "@mantine/core";
+import { formatFileSize, getFileDate } from "@app/utils/fileUtils";
 
 export interface FileMetadataProps {
   file: File;
@@ -13,7 +13,7 @@ const FileMetadata = ({ file }: FileMetadataProps) => {
           {formatFileSize(file.size)}
         </Text>
         <Text size="xs" c="dimmed">
-          {file.type || 'Unknown'}
+          {file.type || "Unknown"}
         </Text>
         <Text size="xs" c="dimmed">
           {getFileDate(file)}
diff --git a/frontend/src/core/components/tools/shared/FileStatusIndicator.tsx b/frontend/src/core/components/tools/shared/FileStatusIndicator.tsx
index b463b6bb6e..90c24253fe 100644
--- a/frontend/src/core/components/tools/shared/FileStatusIndicator.tsx
+++ b/frontend/src/core/components/tools/shared/FileStatusIndicator.tsx
@@ -1,13 +1,13 @@
 import { useState, useEffect } from "react";
 import { Text, Anchor } from "@mantine/core";
 import { useTranslation } from "react-i18next";
-import FolderIcon from '@mui/icons-material/Folder';
-import UploadIcon from '@mui/icons-material/Upload';
+import FolderIcon from "@mui/icons-material/Folder";
+import UploadIcon from "@mui/icons-material/Upload";
 import { useFilesModalContext } from "@app/contexts/FilesModalContext";
 import { useAllFiles } from "@app/contexts/FileContext";
 import { useFileManager } from "@app/hooks/useFileManager";
 import { StirlingFile } from "@app/types/fileContext";
-import { PrivateContent } from "@app/components/shared/PrivateContent"
+import { PrivateContent } from "@app/components/shared/PrivateContent";
 
 export interface FileStatusIndicatorProps {
   selectedFiles?: StirlingFile[];
@@ -39,10 +39,10 @@ const FileStatusIndicator = ({
 
   // Handle native file picker
   const handleNativeUpload = () => {
-    const input = document.createElement('input');
-    input.type = 'file';
+    const input = document.createElement("input");
+    input.type = "file";
     input.multiple = true;
-    input.accept = '.pdf,application/pdf';
+    input.accept = ".pdf,application/pdf";
     input.onchange = (event) => {
       const files = Array.from((event.target as HTMLInputElement).files || []);
       if (files.length > 0) {
@@ -59,9 +59,18 @@ const FileStatusIndicator = ({
 
   const getPlaceholder = () => {
     if (minFiles === undefined || minFiles === 1) {
-      return t("files.selectFromWorkbench", "Select files from the workbench or ");
+      return t(
+        "files.selectFromWorkbench",
+        "Select files from the workbench or ",
+      );
     } else {
-      return t("files.selectMultipleFromWorkbench", "Select at least {{count}} files from the workbench or ", { count: minFiles });
+      return t(
+        "files.selectMultipleFromWorkbench",
+        "Select at least {{count}} files from the workbench or ",
+        {
+          count: minFiles,
+        },
+      );
     }
   };
 
@@ -74,9 +83,14 @@ const FileStatusIndicator = ({
           <Anchor
             size="sm"
             onClick={handleNativeUpload}
-            style={{ cursor: 'pointer', display: 'inline-flex', alignItems: 'center', gap: '0.25rem' }}
+            style={{
+              cursor: "pointer",
+              display: "inline-flex",
+              alignItems: "center",
+              gap: "0.25rem",
+            }}
           >
-            <UploadIcon style={{ fontSize: '0.875rem' }} />
+            <UploadIcon style={{ fontSize: "0.875rem" }} />
             {t("files.upload", "Upload")}
           </Anchor>
         </Text>
@@ -88,9 +102,14 @@ const FileStatusIndicator = ({
           <Anchor
             size="sm"
             onClick={() => openFilesModal({})}
-            style={{ cursor: 'pointer', display: 'inline-flex', alignItems: 'center', gap: '0.25rem' }}
+            style={{
+              cursor: "pointer",
+              display: "inline-flex",
+              alignItems: "center",
+              gap: "0.25rem",
+            }}
           >
-            <FolderIcon style={{ fontSize: '0.875rem' }} />
+            <FolderIcon style={{ fontSize: "0.875rem" }} />
             {t("files.addFiles", "Add files")}
           </Anchor>
         </Text>
@@ -108,9 +127,14 @@ const FileStatusIndicator = ({
           <Anchor
             size="sm"
             onClick={handleNativeUpload}
-            style={{ cursor: 'pointer', display: 'inline-flex', alignItems: 'center', gap: '0.25rem' }}
+            style={{
+              cursor: "pointer",
+              display: "inline-flex",
+              alignItems: "center",
+              gap: "0.25rem",
+            }}
           >
-            <UploadIcon style={{ fontSize: '0.875rem' }} />
+            <UploadIcon style={{ fontSize: "0.875rem" }} />
             {t("files.uploadFiles", "Upload Files")}
           </Anchor>
         </Text>
@@ -123,9 +147,14 @@ const FileStatusIndicator = ({
           <Anchor
             size="sm"
             onClick={() => openFilesModal({})}
-            style={{ cursor: 'pointer', display: 'inline-flex', alignItems: 'center', gap: '0.25rem' }}
+            style={{
+              cursor: "pointer",
+              display: "inline-flex",
+              alignItems: "center",
+              gap: "0.25rem",
+            }}
           >
-            <FolderIcon style={{ fontSize: '0.875rem' }} />
+            <FolderIcon style={{ fontSize: "0.875rem" }} />
             {t("files.addFiles", "Add files")}
           </Anchor>
         </Text>
@@ -134,10 +163,23 @@ const FileStatusIndicator = ({
   }
 
   return (
-   <Text size="sm" c="dimmed" style={{ wordBreak: 'break-word', whiteSpace: 'normal' }}>
-      ✓ {selectedFiles.length === 1
-          ? <PrivateContent>{t("fileSelected", "Selected: {{filename}}", { filename: selectedFiles[0]?.name }) }</PrivateContent>
-          : t("filesSelected", "{{count}} files selected", { count: selectedFiles.length })}
+    <Text
+      size="sm"
+      c="dimmed"
+      style={{ wordBreak: "break-word", whiteSpace: "normal" }}
+    >
+      ✓{" "}
+      {selectedFiles.length === 1 ? (
+        <PrivateContent>
+          {t("fileSelected", "Selected: {{filename}}", {
+            filename: selectedFiles[0]?.name,
+          })}
+        </PrivateContent>
+      ) : (
+        t("filesSelected", "{{count}} files selected", {
+          count: selectedFiles.length,
+        })
+      )}
     </Text>
   );
 };
diff --git a/frontend/src/core/components/tools/shared/FilesToolStep.tsx b/frontend/src/core/components/tools/shared/FilesToolStep.tsx
index 1d71196ac0..bca4f6aaa8 100644
--- a/frontend/src/core/components/tools/shared/FilesToolStep.tsx
+++ b/frontend/src/core/components/tools/shared/FilesToolStep.tsx
@@ -1,7 +1,7 @@
-import React from 'react';
-import FileStatusIndicator from '@app/components/tools/shared/FileStatusIndicator';
-import { StirlingFile } from '@app/types/fileContext';
-import i18n from '@app/i18n';
+import React from "react";
+import FileStatusIndicator from "@app/components/tools/shared/FileStatusIndicator";
+import { StirlingFile } from "@app/types/fileContext";
+import i18n from "@app/i18n";
 
 export interface FilesToolStepProps {
   selectedFiles: StirlingFile[];
@@ -11,17 +11,23 @@ export interface FilesToolStepProps {
 }
 
 export function createFilesToolStep(
-  createStep: (title: string, props: any, children?: React.ReactNode) => React.ReactElement,
-  props: FilesToolStepProps
+  createStep: (
+    title: string,
+    props: any,
+    children?: React.ReactNode,
+  ) => React.ReactElement,
+  props: FilesToolStepProps,
 ): React.ReactElement {
-  return createStep(i18n.t("files.title", "Files"), {
-    isVisible: true,
-    isCollapsed: props.isCollapsed,
-    onCollapsedClick: props.onCollapsedClick
-  }, (
+  return createStep(
+    i18n.t("files.title", "Files"),
+    {
+      isVisible: true,
+      isCollapsed: props.isCollapsed,
+      onCollapsedClick: props.onCollapsedClick,
+    },
     <FileStatusIndicator
       selectedFiles={props.selectedFiles}
       minFiles={props.minFiles}
-    />
-  ));
+    />,
+  );
 }
diff --git a/frontend/src/core/components/tools/shared/NavigationControls.tsx b/frontend/src/core/components/tools/shared/NavigationControls.tsx
index f67c1ca557..c17e61f252 100644
--- a/frontend/src/core/components/tools/shared/NavigationControls.tsx
+++ b/frontend/src/core/components/tools/shared/NavigationControls.tsx
@@ -1,6 +1,6 @@
-import { Stack, Group, ActionIcon, Text } from '@mantine/core';
-import ChevronLeftIcon from '@mui/icons-material/ChevronLeft';
-import ChevronRightIcon from '@mui/icons-material/ChevronRight';
+import { Stack, Group, ActionIcon, Text } from "@mantine/core";
+import ChevronLeftIcon from "@mui/icons-material/ChevronLeft";
+import ChevronRightIcon from "@mui/icons-material/ChevronRight";
 
 export interface NavigationControlsProps {
   currentIndex: number;
@@ -27,10 +27,10 @@ const NavigationControls = ({
           disabled={totalFiles <= 1}
           data-testid="review-panel-prev"
         >
-          <ChevronLeftIcon style={{ fontSize: '1rem' }} />
+          <ChevronLeftIcon style={{ fontSize: "1rem" }} />
         </ActionIcon>
         <Text size="xs" c="dimmed">
-        {currentIndex + 1} of {totalFiles}
+          {currentIndex + 1} of {totalFiles}
         </Text>
 
         <ActionIcon
@@ -40,7 +40,7 @@ const NavigationControls = ({
           disabled={totalFiles <= 1}
           data-testid="review-panel-next"
         >
-          <ChevronRightIcon style={{ fontSize: '1rem' }} />
+          <ChevronRightIcon style={{ fontSize: "1rem" }} />
         </ActionIcon>
       </Group>
     </Stack>
diff --git a/frontend/src/core/components/tools/shared/NoToolsFound.tsx b/frontend/src/core/components/tools/shared/NoToolsFound.tsx
index 1b60f0cb79..5e0d67eed6 100644
--- a/frontend/src/core/components/tools/shared/NoToolsFound.tsx
+++ b/frontend/src/core/components/tools/shared/NoToolsFound.tsx
@@ -1,10 +1,10 @@
-import React from 'react';
-import { Text } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
+import React from "react";
+import { Text } from "@mantine/core";
+import { useTranslation } from "react-i18next";
 
 const NoToolsFound: React.FC = () => {
   const { t } = useTranslation();
-  
+
   return (
     <Text c="dimmed" size="sm" p="sm">
       {t("toolPicker.noToolsFound", "No tools found")}
diff --git a/frontend/src/core/components/tools/shared/NumberInputWithUnit.tsx b/frontend/src/core/components/tools/shared/NumberInputWithUnit.tsx
index bf28aa0486..46c27ad57f 100644
--- a/frontend/src/core/components/tools/shared/NumberInputWithUnit.tsx
+++ b/frontend/src/core/components/tools/shared/NumberInputWithUnit.tsx
@@ -18,7 +18,7 @@ const NumberInputWithUnit = ({
   unit,
   min,
   max,
-  disabled = false
+  disabled = false,
 }: NumberInputWithUnitProps) => {
   const [localValue, setLocalValue] = useState<number | string>(value);
 
@@ -33,7 +33,15 @@ const NumberInputWithUnit = ({
 
   return (
     <Stack gap="xs" style={{ flex: 1 }}>
-      <Text size="xs" fw={500} style={{ whiteSpace: 'nowrap', overflow: 'hidden', textOverflow: 'ellipsis' }}>
+      <Text
+        size="xs"
+        fw={500}
+        style={{
+          whiteSpace: "nowrap",
+          overflow: "hidden",
+          textOverflow: "ellipsis",
+        }}
+      >
         {label}
       </Text>
       <NumberInput
diff --git a/frontend/src/core/components/tools/shared/OperationButton.tsx b/frontend/src/core/components/tools/shared/OperationButton.tsx
index 0e4399e488..e6db1478e7 100644
--- a/frontend/src/core/components/tools/shared/OperationButton.tsx
+++ b/frontend/src/core/components/tools/shared/OperationButton.tsx
@@ -1,10 +1,10 @@
-import { Button, Box } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { Tooltip } from '@app/components/shared/Tooltip';
-import { useBackendHealth } from '@app/hooks/useBackendHealth';
-import { CloudBadge } from '@app/components/shared/CloudBadge';
-import type { ExecuteDisabledReason } from '@app/hooks/tools/shared/toolOperationTypes';
-import { useToolActions } from '@app/contexts/ToolActionsContext';
+import { Button, Box } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import { Tooltip } from "@app/components/shared/Tooltip";
+import { useBackendHealth } from "@app/hooks/useBackendHealth";
+import { CloudBadge } from "@app/components/shared/CloudBadge";
+import type { ExecuteDisabledReason } from "@app/hooks/tools/shared/toolOperationTypes";
+import { useToolActions } from "@app/contexts/ToolActionsContext";
 
 export interface OperationButtonProps {
   onClick?: () => void;
@@ -13,14 +13,14 @@ export interface OperationButtonProps {
   disabledReason?: ExecuteDisabledReason;
   loadingText?: string;
   submitText?: string;
-  variant?: 'filled' | 'outline' | 'subtle';
+  variant?: "filled" | "outline" | "subtle";
   color?: string;
   fullWidth?: boolean;
   mt?: string;
-  type?: 'button' | 'submit' | 'reset';
+  type?: "button" | "submit" | "reset";
   showCloudBadge?: boolean;
-  'data-testid'?: string;
-  'data-tour'?: string;
+  "data-testid"?: string;
+  "data-tour"?: string;
 }
 
 const OperationButton = ({
@@ -30,42 +30,56 @@ const OperationButton = ({
   disabledReason,
   loadingText,
   submitText,
-  variant = 'filled',
-  color = 'blue',
+  variant = "filled",
+  color = "blue",
   fullWidth = false,
-  mt = 'md',
-  type = 'button',
+  mt = "md",
+  type = "button",
   showCloudBadge = false,
-  'data-testid': dataTestId,
-  'data-tour': dataTour
+  "data-testid": dataTestId,
+  "data-tour": dataTour,
 }: OperationButtonProps) => {
   const { t } = useTranslation();
   const { isOnline, message: backendMessage } = useBackendHealth();
   const { onEndpointUnavailableClick } = useToolActions();
   const blockedByBackend = !isOnline;
 
-  const effectiveDisabled = disabled || disabledReason !== null && disabledReason !== undefined;
+  const effectiveDisabled =
+    disabled || (disabledReason !== null && disabledReason !== undefined);
   const combinedDisabled = effectiveDisabled || blockedByBackend;
 
   const reasonTooltip: Record<NonNullable<ExecuteDisabledReason>, string> = {
     endpointUnavailable: onEndpointUnavailableClick
-      ? t('tool.endpointUnavailableClickable', "Not available in this mode. Click to sign in.")
-      : t('tool.endpointUnavailable', 'This tool is unavailable on your server.'),
-    noFiles: t('tool.noFiles', 'Add a file to get started.'),
-    invalidParams: t('tool.invalidParams', 'Fill in the required settings.'),
+      ? t(
+          "tool.endpointUnavailableClickable",
+          "Not available in this mode. Click to sign in.",
+        )
+      : t(
+          "tool.endpointUnavailable",
+          "This tool is unavailable on your server.",
+        ),
+    noFiles: t("tool.noFiles", "Add a file to get started."),
+    invalidParams: t("tool.invalidParams", "Fill in the required settings."),
+    viewerMode: t(
+      "tool.viewerMode",
+      "Switch to the file editor to select multiple files.",
+    ),
   };
 
   const tooltipLabel = blockedByBackend
-    ? (backendMessage ?? t('backendHealth.checking', 'Checking backend status...'))
-    : (disabledReason ? (reasonTooltip[disabledReason] ?? null) : null);
+    ? (backendMessage ??
+      t("backendHealth.checking", "Checking backend status..."))
+    : disabledReason
+      ? (reasonTooltip[disabledReason] ?? null)
+      : null;
 
   const button = (
     <Button
       type={type}
       onClick={onClick}
       fullWidth={fullWidth || !!tooltipLabel}
-      mr={tooltipLabel ? 0 : 'md'}
-      ml={tooltipLabel ? 0 : 'md'}
+      mr={tooltipLabel ? 0 : "md"}
+      ml={tooltipLabel ? 0 : "md"}
       mt={tooltipLabel ? 0 : mt}
       loading={isLoading}
       disabled={combinedDisabled}
@@ -73,14 +87,13 @@ const OperationButton = ({
       color={color}
       data-testid={dataTestId}
       data-tour={dataTour}
-      style={{ minHeight: '2.5rem', position: 'relative' }}
+      style={{ minHeight: "2.5rem", position: "relative" }}
     >
       {isLoading
-        ? (loadingText || t("loading", "Loading..."))
-        : (submitText || t("submit", "Submit"))
-      }
+        ? loadingText || t("loading", "Loading...")
+        : submitText || t("submit", "Submit")}
       {showCloudBadge && (
-        <Box style={{ position: 'absolute', top: 4, right: 4 }}>
+        <Box style={{ position: "absolute", top: 4, right: 4 }}>
           <CloudBadge />
         </Box>
       )}
@@ -92,14 +105,20 @@ const OperationButton = ({
     // cloneElement handlers would never fire. Wrap in a Box to capture them instead.
     // When endpointUnavailable and a click handler is provided (desktop), the Box
     // also acts as the click target to open the sign-in / connect modal.
-    const boxClickHandler = disabledReason === 'endpointUnavailable' ? onEndpointUnavailableClick : undefined;
+    const boxClickHandler =
+      disabledReason === "endpointUnavailable"
+        ? onEndpointUnavailableClick
+        : undefined;
     return (
       <Tooltip content={tooltipLabel} position="top" arrow>
         <Box
           mr="md"
           ml="md"
           mt={mt}
-          style={{ display: 'block', cursor: boxClickHandler ? 'pointer' : undefined }}
+          style={{
+            display: "block",
+            cursor: boxClickHandler ? "pointer" : undefined,
+          }}
           onClick={boxClickHandler}
         >
           {button}
diff --git a/frontend/src/core/components/tools/shared/ResultsPreview.tsx b/frontend/src/core/components/tools/shared/ResultsPreview.tsx
index 9a4921af0d..5165e76726 100644
--- a/frontend/src/core/components/tools/shared/ResultsPreview.tsx
+++ b/frontend/src/core/components/tools/shared/ResultsPreview.tsx
@@ -1,9 +1,9 @@
-import { useState } from 'react';
-import { Box, Text, Loader, Stack, Center, Flex } from '@mantine/core';
-import FilePreview from '@app/components/shared/FilePreview';
-import FileMetadata from '@app/components/tools/shared/FileMetadata';
-import NavigationControls from '@app/components/tools/shared/NavigationControls';
-import { PrivateContent } from '@app/components/shared/PrivateContent';
+import { useState } from "react";
+import { Box, Text, Loader, Stack, Center, Flex } from "@mantine/core";
+import FilePreview from "@app/components/shared/FilePreview";
+import FileMetadata from "@app/components/tools/shared/FileMetadata";
+import NavigationControls from "@app/components/tools/shared/NavigationControls";
+import { PrivateContent } from "@app/components/shared/PrivateContent";
 
 export interface ReviewFile {
   file: File;
@@ -23,7 +23,7 @@ const ResultsPreview = ({
   isGeneratingThumbnails = false,
   onFileClick,
   emptyMessage = "No files to preview",
-  loadingMessage = "Generating previews..."
+  loadingMessage = "Generating previews...",
 }: ResultsPreviewProps) => {
   const [currentIndex, setCurrentIndex] = useState(0);
 
@@ -48,7 +48,9 @@ const ResultsPreview = ({
       <Center p="lg" data-testid="review-panel-loading">
         <Stack align="center" gap="sm">
           <Loader size="sm" />
-          <Text size="sm" c="dimmed">{loadingMessage}</Text>
+          <Text size="sm" c="dimmed">
+            {loadingMessage}
+          </Text>
         </Stack>
       </Center>
     );
@@ -58,16 +60,26 @@ const ResultsPreview = ({
   if (!currentFile) return null;
 
   return (
-    <Box p="sm" style={{ backgroundColor: 'var(--mantine-color-gray-1)', borderRadius: '0.5rem', maxWidth: '100%' }} data-testid="review-panel-container">
-
+    <Box
+      p="sm"
+      style={{
+        backgroundColor: "var(--mantine-color-gray-1)",
+        borderRadius: "0.5rem",
+        maxWidth: "100%",
+      }}
+      data-testid="review-panel-container"
+    >
       {/* File name at the top */}
-      <Box mb="sm" style={{ minHeight: '3rem', display: 'flex', alignItems: 'flex-start' }}>
+      <Box
+        mb="sm"
+        style={{ minHeight: "3rem", display: "flex", alignItems: "flex-start" }}
+      >
         <Text
           size="sm"
           fw={500}
           style={{
-            wordBreak: 'break-word',
-            lineHeight: 1.4
+            wordBreak: "break-word",
+            lineHeight: 1.4,
           }}
           title={currentFile.file.name}
         >
@@ -75,13 +87,22 @@ const ResultsPreview = ({
         </Text>
       </Box>
 
-      <Flex gap="md" align="flex-start" style={{ minHeight: '7.5rem', maxWidth: '100%' }} data-testid={`review-panel-item-${currentIndex}`}>
-        <Box style={{ width: '6.25rem', height: '7.5rem', flexShrink: 0 }}>
+      <Flex
+        gap="md"
+        align="flex-start"
+        style={{ minHeight: "7.5rem", maxWidth: "100%" }}
+        data-testid={`review-panel-item-${currentIndex}`}
+      >
+        <Box style={{ width: "6.25rem", height: "7.5rem", flexShrink: 0 }}>
           <FilePreview
             file={currentFile.file}
             thumbnail={currentFile.thumbnail}
             showHoverOverlay={true}
-            onFileClick={onFileClick ? (file) => file && onFileClick(file as File) : undefined}
+            onFileClick={
+              onFileClick
+                ? (file) => file && onFileClick(file as File)
+                : undefined
+            }
           />
         </Box>
         <FileMetadata file={currentFile.file} />
diff --git a/frontend/src/core/components/tools/shared/ReviewToolStep.tsx b/frontend/src/core/components/tools/shared/ReviewToolStep.tsx
index 019bb14d36..70bb9408d2 100644
--- a/frontend/src/core/components/tools/shared/ReviewToolStep.tsx
+++ b/frontend/src/core/components/tools/shared/ReviewToolStep.tsx
@@ -70,9 +70,9 @@ function ReviewStepContent<TParams = unknown>({
           const stub = selectors.getStirlingFileStub(fileId as FileId);
           fileActions.updateStirlingFileStub(fileId as FileId, {
             localFilePath: stub?.localFilePath ?? savedPath,
-            isDirty: false
+            isDirty: false,
           });
-        }
+        },
       });
     } catch (error) {
       const message = error instanceof Error ? error.message : String(error);
@@ -83,8 +83,15 @@ function ReviewStepContent<TParams = unknown>({
 
   // Auto-scroll to bottom when content appears
   useEffect(() => {
-    if (stepRef.current && (previewFiles.length > 0 || operation.downloadUrl || operation.errorMessage)) {
-      const scrollableContainer = stepRef.current.closest('[style*="overflow: auto"]') as HTMLElement;
+    if (
+      stepRef.current &&
+      (previewFiles.length > 0 ||
+        operation.downloadUrl ||
+        operation.errorMessage)
+    ) {
+      const scrollableContainer = stepRef.current.closest(
+        '[style*="overflow: auto"]',
+      ) as HTMLElement;
       if (scrollableContainer) {
         setTimeout(() => {
           scrollableContainer.scrollTo({
@@ -98,7 +105,10 @@ function ReviewStepContent<TParams = unknown>({
 
   return (
     <Stack gap="sm" ref={stepRef}>
-      <ErrorNotification error={operation.errorMessage} onClose={operation.clearError} />
+      <ErrorNotification
+        error={operation.errorMessage}
+        onClose={operation.clearError}
+      />
 
       {previewFiles.length > 0 && (
         <ResultsPreview
@@ -109,7 +119,12 @@ function ReviewStepContent<TParams = unknown>({
       )}
 
       {onUndo && (
-        <Tooltip content={t("undoOperationTooltip", "Click to undo the last operation and restore the original files")}>
+        <Tooltip
+          content={t(
+            "undoOperationTooltip",
+            "Click to undo the last operation and restore the original files",
+          )}
+        >
           <Button
             leftSection={<UndoIcon />}
             variant="outline"
@@ -149,9 +164,9 @@ export function createReviewToolStep<TParams = unknown>(
       _excludeFromCount?: boolean;
       _noPadding?: boolean;
     },
-    children?: React.ReactNode
+    children?: React.ReactNode,
   ) => React.ReactElement,
-  props: ReviewToolStepProps<TParams>
+  props: ReviewToolStepProps<TParams>,
 ): React.ReactElement {
   return createStep(
     i18n.t("review", "Review"),
@@ -162,6 +177,10 @@ export function createReviewToolStep<TParams = unknown>(
       _excludeFromCount: true,
       _noPadding: true,
     },
-    <ReviewStepContent operation={props.operation} onFileClick={props.onFileClick} onUndo={props.onUndo} />
+    <ReviewStepContent
+      operation={props.operation}
+      onFileClick={props.onFileClick}
+      onUndo={props.onUndo}
+    />,
   );
 }
diff --git a/frontend/src/core/components/tools/shared/ScopedOperationButton.tsx b/frontend/src/core/components/tools/shared/ScopedOperationButton.tsx
new file mode 100644
index 0000000000..512dc2f956
--- /dev/null
+++ b/frontend/src/core/components/tools/shared/ScopedOperationButton.tsx
@@ -0,0 +1,85 @@
+import { Text } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import OperationButton, {
+  OperationButtonProps,
+} from "@app/components/tools/shared/OperationButton";
+import { StirlingFile } from "@app/types/fileContext";
+import { useAllFiles } from "@app/contexts/FileContext";
+import { useViewer } from "@app/contexts/ViewerContext";
+import { useNavigationState } from "@app/contexts/NavigationContext";
+
+export interface ScopedOperationButtonProps extends OperationButtonProps {
+  selectedFiles: StirlingFile[];
+  disableScopeHints?: boolean;
+}
+
+/**
+ * Wraps OperationButton with scope-aware button text and a filename note.
+ *
+ * - Viewer mode (multiple files loaded): appends "(this file)" to button text and
+ *   shows a note naming the exact file that will be processed.
+ * - File-editor mode with N>1 selected files: appends "(N files)" to button text.
+ * - File-editor mode with 0 selected files: shows a hint to select files.
+ * - All other cases: no change to button text or layout.
+ */
+export function ScopedOperationButton({
+  selectedFiles,
+  disableScopeHints,
+  ...props
+}: ScopedOperationButtonProps) {
+  const { t } = useTranslation();
+  const { workbench } = useNavigationState();
+  const { activeFileIndex } = useViewer();
+  const { files: allFiles } = useAllFiles();
+
+  const isViewerMode = workbench === "viewer";
+  const isFileEditorMode = workbench === "fileEditor";
+  const hasMultipleFilesLoaded = allFiles.length > 1;
+  const baseText = props.submitText ?? t("submit", "Submit");
+
+  const disabledForViewerMode = props.disabledReason === "viewerMode";
+
+  let scopedText = baseText;
+  if (!disableScopeHints && !disabledForViewerMode) {
+    if (isViewerMode && hasMultipleFilesLoaded) {
+      scopedText = `${baseText} (${t("tool.scopeThisFile", "this file")})`;
+    } else if (!isViewerMode && selectedFiles.length > 1) {
+      scopedText = `${baseText} (${selectedFiles.length} ${t("tool.scopeFiles", "files")})`;
+    }
+  }
+
+  const viewerFileName =
+    !disableScopeHints &&
+    !disabledForViewerMode &&
+    isViewerMode &&
+    hasMultipleFilesLoaded
+      ? allFiles[activeFileIndex]?.name
+      : null;
+
+  const showSelectFilesHint =
+    !disableScopeHints &&
+    isFileEditorMode &&
+    allFiles.length > 0 &&
+    selectedFiles.length === 0;
+
+  return (
+    <>
+      <OperationButton {...props} submitText={scopedText} />
+      {viewerFileName && (
+        <Text size="xs" c="dimmed" ta="center" mx="md" mt={2}>
+          {t("tool.singleFileScope", "Only applying to: {{fileName}}", {
+            fileName: viewerFileName,
+          })}
+        </Text>
+      )}
+      {showSelectFilesHint && (
+        <Text size="xs" c="dimmed" ta="center" mx="md" mt={2}>
+          {t(
+            "tool.selectFilesHint",
+            "Select files in Active Files to run this tool",
+          )}
+        </Text>
+      )}
+    </>
+  );
+}
diff --git a/frontend/src/core/components/tools/shared/SubcategoryHeader.tsx b/frontend/src/core/components/tools/shared/SubcategoryHeader.tsx
index b403ebae8d..740dd9dd67 100644
--- a/frontend/src/core/components/tools/shared/SubcategoryHeader.tsx
+++ b/frontend/src/core/components/tools/shared/SubcategoryHeader.tsx
@@ -1,4 +1,4 @@
-import React from 'react';
+import React from "react";
 
 interface SubcategoryHeaderProps {
   label: string;
@@ -6,8 +6,20 @@ interface SubcategoryHeaderProps {
   mb?: string | number;
 }
 
-export const SubcategoryHeader: React.FC<SubcategoryHeaderProps> = ({ label, mt = '1rem', mb = '0.25rem' }) => (
-  <div className="tool-subcategory-row" style={{ marginLeft: '1rem', marginRight: '1rem', marginTop: mt, marginBottom: mb }}>
+export const SubcategoryHeader: React.FC<SubcategoryHeaderProps> = ({
+  label,
+  mt = "1rem",
+  mb = "0.25rem",
+}) => (
+  <div
+    className="tool-subcategory-row"
+    style={{
+      marginLeft: "1rem",
+      marginRight: "1rem",
+      marginTop: mt,
+      marginBottom: mb,
+    }}
+  >
     <div className="tool-subcategory-row-rule" />
     <span className="tool-subcategory-row-title">{label}</span>
     <div className="tool-subcategory-row-rule" />
diff --git a/frontend/src/core/components/tools/shared/SuggestedToolsSection.tsx b/frontend/src/core/components/tools/shared/SuggestedToolsSection.tsx
index bd7517c791..79be895590 100644
--- a/frontend/src/core/components/tools/shared/SuggestedToolsSection.tsx
+++ b/frontend/src/core/components/tools/shared/SuggestedToolsSection.tsx
@@ -1,8 +1,8 @@
-import React from 'react';
-import { Stack, Text, Divider, Card, Group, Anchor } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { useSuggestedTools } from '@app/hooks/useSuggestedTools';
-import { ToolIcon } from '@app/components/shared/ToolIcon';
+import React from "react";
+import { Stack, Text, Divider, Card, Group, Anchor } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import { useSuggestedTools } from "@app/hooks/useSuggestedTools";
+import { ToolIcon } from "@app/components/shared/ToolIcon";
 
 export function SuggestedToolsSection(): React.ReactElement {
   const { t } = useTranslation();
@@ -13,7 +13,7 @@ export function SuggestedToolsSection(): React.ReactElement {
       <Divider />
 
       <Text size="lg" fw={600}>
-        {t('editYourNewFiles', 'Edit your new file(s)')}
+        {t("editYourNewFiles", "Edit your new file(s)")}
       </Text>
 
       <Stack gap="xs">
@@ -24,13 +24,9 @@ export function SuggestedToolsSection(): React.ReactElement {
               key={tool.id}
               href={tool.href}
               onClick={tool.onClick}
-              style={{ textDecoration: 'none', color: 'inherit' }}
+              style={{ textDecoration: "none", color: "inherit" }}
             >
-              <Card
-                p="sm"
-                withBorder
-                style={{ cursor: 'pointer' }}
-              >
+              <Card p="sm" withBorder style={{ cursor: "pointer" }}>
                 <Group gap="xs">
                   <ToolIcon icon={<IconComponent />} />
                   <Text size="sm" fw={500}>
diff --git a/frontend/src/core/components/tools/shared/ToolStep.tsx b/frontend/src/core/components/tools/shared/ToolStep.tsx
index 8d2d95513f..0325b7566c 100644
--- a/frontend/src/core/components/tools/shared/ToolStep.tsx
+++ b/frontend/src/core/components/tools/shared/ToolStep.tsx
@@ -1,10 +1,16 @@
-import React, { createContext, useContext, useMemo } from 'react';
-import { Text, Stack, Flex, Divider } from '@mantine/core';
-import LocalIcon from '@app/components/shared/LocalIcon';
-import { Tooltip } from '@app/components/shared/Tooltip';
-import { TooltipTip } from '@app/types/tips';
-import { createFilesToolStep, FilesToolStepProps } from '@app/components/tools/shared/FilesToolStep';
-import { createReviewToolStep, ReviewToolStepProps } from '@app/components/tools/shared/ReviewToolStep';
+import React, { createContext, useContext, useMemo } from "react";
+import { Text, Stack, Flex, Divider } from "@mantine/core";
+import LocalIcon from "@app/components/shared/LocalIcon";
+import { Tooltip } from "@app/components/shared/Tooltip";
+import { TooltipTip } from "@app/types/tips";
+import {
+  createFilesToolStep,
+  FilesToolStepProps,
+} from "@app/components/tools/shared/FilesToolStep";
+import {
+  createReviewToolStep,
+  ReviewToolStepProps,
+} from "@app/components/tools/shared/ReviewToolStep";
 
 interface ToolStepContextType {
   visibleStepCount: number;
@@ -37,9 +43,9 @@ export interface ToolStepProps {
 
 const renderTooltipTitle = (
   title: string,
-  tooltip: ToolStepProps['tooltip'],
+  tooltip: ToolStepProps["tooltip"],
   isCollapsed: boolean,
-  alwaysShowTooltip: boolean = false
+  alwaysShowTooltip: boolean = false,
 ) => {
   if (tooltip && (!isCollapsed || alwaysShowTooltip)) {
     return (
@@ -54,7 +60,12 @@ const renderTooltipTitle = (
           <Text fw={400} size="sm">
             {title}
           </Text>
-          <LocalIcon icon="info-outline-rounded" width="1.25rem" height="1.25rem" style={{ color: 'var(--icon-files-color)' }} />
+          <LocalIcon
+            icon="info-outline-rounded"
+            width="1.25rem"
+            height="1.25rem"
+            style={{ color: "var(--icon-files-color)" }}
+          />
         </Flex>
       </Tooltip>
     );
@@ -78,7 +89,7 @@ const ToolStep = ({
   _stepNumber,
   _noPadding,
   alwaysShowTooltip = false,
-  tooltip
+  tooltip,
 }: ToolStepProps) => {
   const parent = useContext(ToolStepContext);
 
@@ -97,56 +108,68 @@ const ToolStep = ({
     <div>
       <div
         style={{
-          padding: '0.5rem',
+          padding: "0.5rem",
           opacity: isCollapsed ? 0.8 : 1,
-          color: isCollapsed ? 'var(--mantine-color-dimmed)' : 'inherit',
-          transition: 'opacity 0.2s ease, color 0.2s ease'
+          color: isCollapsed ? "var(--mantine-color-dimmed)" : "inherit",
+          transition: "opacity 0.2s ease, color 0.2s ease",
         }}
       >
-      {/* Chevron icon to collapse/expand the step */}
-      <Flex
-        align="center"
-        justify="space-between"
-        mb="sm"
-        style={{
-          cursor: onCollapsedClick ? 'pointer' : 'default'
-        }}
-        onClick={onCollapsedClick}
-      >
-        <Flex align="center" gap="sm">
-          {shouldShowNumber && (
-            <Text fw={500} size="sm" c="dimmed" mr="0.5rem">
-              {stepNumber}
-            </Text>
+        {/* Chevron icon to collapse/expand the step */}
+        <Flex
+          align="center"
+          justify="space-between"
+          mb="sm"
+          style={{
+            cursor: onCollapsedClick ? "pointer" : "default",
+          }}
+          onClick={onCollapsedClick}
+        >
+          <Flex align="center" gap="sm">
+            {shouldShowNumber && (
+              <Text fw={500} size="sm" c="dimmed" mr="0.5rem">
+                {stepNumber}
+              </Text>
+            )}
+            {renderTooltipTitle(title, tooltip, isCollapsed, alwaysShowTooltip)}
+          </Flex>
+
+          {isCollapsed ? (
+            <LocalIcon
+              icon="chevron-right-rounded"
+              width="1.2rem"
+              height="1.2rem"
+              style={{
+                color: "var(--mantine-color-dimmed)",
+                opacity: onCollapsedClick ? 1 : 0.5,
+              }}
+            />
+          ) : (
+            <LocalIcon
+              icon="expand-more-rounded"
+              width="1.2rem"
+              height="1.2rem"
+              style={{
+                color: "var(--mantine-color-dimmed)",
+                opacity: onCollapsedClick ? 1 : 0.5,
+              }}
+            />
           )}
-          {renderTooltipTitle(title, tooltip, isCollapsed, alwaysShowTooltip)}
         </Flex>
 
-        {isCollapsed ? (
-          <LocalIcon icon="chevron-right-rounded" width="1.2rem" height="1.2rem" style={{
-            color: 'var(--mantine-color-dimmed)',
-            opacity: onCollapsedClick ? 1 : 0.5
-          }} />
-        ) : (
-          <LocalIcon icon="expand-more-rounded" width="1.2rem" height="1.2rem" style={{
-            color: 'var(--mantine-color-dimmed)',
-            opacity: onCollapsedClick ? 1 : 0.5
-          }} />
+        {!isCollapsed && (
+          <Stack gap="sm" pl={_noPadding ? 0 : "sm"}>
+            {helpText && (
+              <Text size="sm" c="dimmed">
+                {helpText}
+              </Text>
+            )}
+            {children}
+          </Stack>
         )}
-      </Flex>
-
-      {!isCollapsed && (
-        <Stack gap="sm" pl={_noPadding ? 0 : "sm"}>
-          {helpText && (
-            <Text size="sm" c="dimmed">
-              {helpText}
-            </Text>
-          )}
-          {children}
-        </Stack>
-      )}
       </div>
-      <Divider style={{ color: '#E2E8F0', marginLeft: '1rem', marginRight: '-0.5rem' }} />
+      <Divider
+        style={{ color: "#E2E8F0", marginLeft: "1rem", marginRight: "-0.5rem" }}
+      />
     </div>
   );
 };
@@ -158,8 +181,8 @@ export function createToolSteps() {
 
   const create = (
     title: string,
-    props: Omit<ToolStepProps, 'title' | '_stepNumber'> = {},
-    children?: React.ReactNode
+    props: Omit<ToolStepProps, "title" | "_stepNumber"> = {},
+    children?: React.ReactNode,
   ): React.ReactElement => {
     const isVisible = props.isVisible !== false;
     const currentStepNumber = isVisible ? stepNumber++ : undefined;
@@ -170,9 +193,9 @@ export function createToolSteps() {
         ...props,
         title,
         _stepNumber: currentStepNumber,
-        key: `step-${title.toLowerCase().replace(/\s+/g, '-')}`
+        key: `step-${title.toLowerCase().replace(/\s+/g, "-")}`,
       },
-      children
+      children,
     );
 
     steps.push(step);
@@ -183,12 +206,14 @@ export function createToolSteps() {
     return createFilesToolStep(create, props);
   };
 
-  const createReviewStep = <TParams = unknown>(props: ReviewToolStepProps<TParams>): React.ReactElement => {
+  const createReviewStep = <TParams = unknown,>(
+    props: ReviewToolStepProps<TParams>,
+  ): React.ReactElement => {
     return createReviewToolStep(create, props);
   };
 
   const getVisibleCount = () => {
-    return steps.filter(step => {
+    return steps.filter((step) => {
       const stepProps = step.props as ToolStepProps;
       const isVisible = stepProps.isVisible !== false;
       const excludeFromCount = stepProps._excludeFromCount === true;
@@ -200,7 +225,13 @@ export function createToolSteps() {
 }
 
 // Context provider wrapper for tools using the factory
-export function ToolStepProvider({ children, forceStepNumbers }: { children: React.ReactNode; forceStepNumbers?: boolean }) {
+export function ToolStepProvider({
+  children,
+  forceStepNumbers,
+}: {
+  children: React.ReactNode;
+  forceStepNumbers?: boolean;
+}) {
   // Count visible steps from children that are ToolStep elements
   const visibleStepCount = useMemo(() => {
     let count = 0;
@@ -215,10 +246,13 @@ export function ToolStepProvider({ children, forceStepNumbers }: { children: Rea
     return count;
   }, [children]);
 
-  const contextValue = useMemo(() => ({
-    visibleStepCount,
-    forceStepNumbers
-  }), [visibleStepCount, forceStepNumbers]);
+  const contextValue = useMemo(
+    () => ({
+      visibleStepCount,
+      forceStepNumbers,
+    }),
+    [visibleStepCount, forceStepNumbers],
+  );
 
   return (
     <ToolStepContext.Provider value={contextValue}>
@@ -227,6 +261,6 @@ export function ToolStepProvider({ children, forceStepNumbers }: { children: Rea
   );
 }
 
-export type { FilesToolStepProps } from '@app/components/tools/shared/FilesToolStep';
-export type { ReviewToolStepProps } from '@app/components/tools/shared/ReviewToolStep';
+export type { FilesToolStepProps } from "@app/components/tools/shared/FilesToolStep";
+export type { ReviewToolStepProps } from "@app/components/tools/shared/ReviewToolStep";
 export default ToolStep;
diff --git a/frontend/src/core/components/tools/shared/ToolWorkflowTitle.tsx b/frontend/src/core/components/tools/shared/ToolWorkflowTitle.tsx
index 8090b85aaa..bc5d362666 100644
--- a/frontend/src/core/components/tools/shared/ToolWorkflowTitle.tsx
+++ b/frontend/src/core/components/tools/shared/ToolWorkflowTitle.tsx
@@ -1,7 +1,7 @@
-import React from 'react';
-import { Flex, Text, Divider } from '@mantine/core';
-import LocalIcon from '@app/components/shared/LocalIcon';
-import { Tooltip } from '@app/components/shared/Tooltip';
+import React from "react";
+import { Flex, Text, Divider } from "@mantine/core";
+import LocalIcon from "@app/components/shared/LocalIcon";
+import { Tooltip } from "@app/components/shared/Tooltip";
 
 export interface ToolWorkflowTitleProps {
   title: string;
@@ -16,13 +16,24 @@ export interface ToolWorkflowTitleProps {
   };
 }
 
-export function ToolWorkflowTitle({ title, tooltip, description }: ToolWorkflowTitleProps) {
+export function ToolWorkflowTitle({
+  title,
+  tooltip,
+  description,
+}: ToolWorkflowTitleProps) {
   const titleContent = (
     <Flex align="center" gap="xs" onClick={(e) => e.stopPropagation()}>
       <Text fw={500} size="lg" p="xs">
         {title}
       </Text>
-      {tooltip && <LocalIcon icon="info-outline-rounded" width="1.25rem" height="1.25rem" style={{ color: 'var(--icon-files-color)' }} />}
+      {tooltip && (
+        <LocalIcon
+          icon="info-outline-rounded"
+          width="1.25rem"
+          height="1.25rem"
+          style={{ color: "var(--icon-files-color)" }}
+        />
+      )}
     </Flex>
   );
 
@@ -43,7 +54,16 @@ export function ToolWorkflowTitle({ title, tooltip, description }: ToolWorkflowT
         titleContent
       )}
 
-      <Text size="sm" mb="md" p="sm" style={{borderRadius:'var(--mantine-radius-md)', background: 'var(--color-gray-200)', color: 'var(--mantine-color-text)' }}>
+      <Text
+        size="sm"
+        mb="md"
+        p="sm"
+        style={{
+          borderRadius: "var(--mantine-radius-md)",
+          background: "var(--color-gray-200)",
+          color: "var(--mantine-color-text)",
+        }}
+      >
         {description}
       </Text>
       <Divider mb="sm" />
diff --git a/frontend/src/core/components/tools/shared/createToolFlow.tsx b/frontend/src/core/components/tools/shared/createToolFlow.tsx
index 0dcc72af88..aafa9b3ea1 100644
--- a/frontend/src/core/components/tools/shared/createToolFlow.tsx
+++ b/frontend/src/core/components/tools/shared/createToolFlow.tsx
@@ -1,12 +1,18 @@
-import React from 'react';
-import { Stack } from '@mantine/core';
-import { createToolSteps, ToolStepProvider } from '@app/components/tools/shared/ToolStep';
-import OperationButton from '@app/components/tools/shared/OperationButton';
-import { ToolOperationHook } from '@app/hooks/tools/shared/useToolOperation';
-import { ToolWorkflowTitle, ToolWorkflowTitleProps } from '@app/components/tools/shared/ToolWorkflowTitle';
-import { StirlingFile } from '@app/types/fileContext';
-import type { TooltipTip } from '@app/types/tips';
-import type { ExecuteDisabledReason } from '@app/hooks/tools/shared/toolOperationTypes';
+import React from "react";
+import { Stack } from "@mantine/core";
+import {
+  createToolSteps,
+  ToolStepProvider,
+} from "@app/components/tools/shared/ToolStep";
+import { ScopedOperationButton } from "@app/components/tools/shared/ScopedOperationButton";
+import { ToolOperationHook } from "@app/hooks/tools/shared/useToolOperation";
+import {
+  ToolWorkflowTitle,
+  ToolWorkflowTitleProps,
+} from "@app/components/tools/shared/ToolWorkflowTitle";
+import { StirlingFile } from "@app/types/fileContext";
+import type { TooltipTip } from "@app/types/tips";
+import type { ExecuteDisabledReason } from "@app/hooks/tools/shared/toolOperationTypes";
 
 export interface FilesStepConfig {
   selectedFiles: StirlingFile[];
@@ -57,6 +63,8 @@ export interface ExecuteButtonConfig {
   disabled?: boolean;
   testId?: string;
   showCloudBadge?: boolean;
+  /** Suppress the automatic "(this file)" / "(N files)" scope hints in the button text. */
+  disableScopeHints?: boolean;
 }
 
 export interface ReviewStepConfig<TParams = unknown> {
@@ -77,6 +85,8 @@ export interface ToolFlowConfig<TParams = unknown> {
   // Optional preview content rendered between steps and the execute button
   preview?: React.ReactNode;
   executeButton?: ExecuteButtonConfig;
+  /** Optional content rendered immediately below the execute button (e.g. contextual help). */
+  belowExecuteButton?: React.ReactNode;
   review: ReviewStepConfig<TParams>;
   forceStepNumbers?: boolean;
 }
@@ -85,62 +95,86 @@ export interface ToolFlowConfig<TParams = unknown> {
  * Creates a flexible tool flow with configurable steps and state management left to the tool.
  * Reduces boilerplate while allowing tools to manage their own collapse/expansion logic.
  */
-export function createToolFlow<TParams = unknown>(config: ToolFlowConfig<TParams>) {
+export function createToolFlow<TParams = unknown>(
+  config: ToolFlowConfig<TParams>,
+) {
   const steps = createToolSteps();
 
   return (
-    <Stack gap="sm" p="sm" >
-    {/* <Stack gap="sm" p="sm" h="100%" w="100%" style={{ overflow: 'auto' }}> */}
+    <Stack gap="sm" p="sm">
+      {/* <Stack gap="sm" p="sm" h="100%" w="100%" style={{ overflow: 'auto' }}> */}
       <ToolStepProvider forceStepNumbers={config.forceStepNumbers}>
         {config.title && <ToolWorkflowTitle {...config.title} />}
 
         {/* Files Step */}
-        {config.files.isVisible !== false && steps.createFilesStep({
-          selectedFiles: config.files.selectedFiles,
-          isCollapsed: config.files.isCollapsed,
-          minFiles: config.files.minFiles,
-          onCollapsedClick: config.files.onCollapsedClick
-        })}
+        {config.files.isVisible !== false &&
+          steps.createFilesStep({
+            selectedFiles: config.files.selectedFiles,
+            isCollapsed: config.files.isCollapsed,
+            minFiles: config.files.minFiles,
+            onCollapsedClick: config.files.onCollapsedClick,
+          })}
 
         {/* Middle Steps */}
         {config.steps.map((stepConfig) =>
-          steps.create(stepConfig.title, {
-            isVisible: stepConfig.isVisible,
-            isCollapsed: stepConfig.isCollapsed,
-            onCollapsedClick: stepConfig.onCollapsedClick,
-            tooltip: stepConfig.tooltip
-          }, stepConfig.content)
+          steps.create(
+            stepConfig.title,
+            {
+              isVisible: stepConfig.isVisible,
+              isCollapsed: stepConfig.isCollapsed,
+              onCollapsedClick: stepConfig.onCollapsedClick,
+              tooltip: stepConfig.tooltip,
+            },
+            stepConfig.content,
+          ),
         )}
 
         {/* Preview (outside steps, above execute button).
             Hide when review is visible or when no files are selected. */}
-        {!config.review.isVisible && (config.files.selectedFiles?.length ?? 0) > 0 && config.preview}
+        {!config.review.isVisible &&
+          (config.files.selectedFiles?.length ?? 0) > 0 &&
+          config.preview}
 
         {/* Execute Button */}
-        {config.executeButton && config.executeButton.isVisible !== false && (() => {
-          const eb = config.executeButton;
-          const hasFiles = (config.files.selectedFiles?.length ?? 0) > 0;
-          // Compute the disabled reason from structured fields; explicit disabledReason wins if set.
-          const effectiveDisabledReason: ExecuteDisabledReason =
-            eb.disabledReason !== undefined ? eb.disabledReason
-            : eb.endpointEnabled === false  ? 'endpointUnavailable'
-            : !hasFiles                     ? 'noFiles'
-            : eb.paramsValid === false       ? 'invalidParams'
-            : null;
-          return (
-            <OperationButton
-              onClick={eb.onClick}
-              isLoading={config.review.operation.isLoading}
-              disabled={eb.disabled}
-              disabledReason={effectiveDisabledReason}
-              loadingText={eb.loadingText}
-              submitText={eb.text}
-              showCloudBadge={eb.showCloudBadge ?? config.review.operation.willUseCloud ?? false}
-              data-testid={eb.testId}
-              data-tour="run-button"
-            />
-          );
-        })()}
+        {config.executeButton &&
+          config.executeButton.isVisible !== false &&
+          (() => {
+            const eb = config.executeButton;
+            const hasFiles = (config.files.selectedFiles?.length ?? 0) > 0;
+            // Compute the disabled reason from structured fields; explicit disabledReason wins if set.
+            const effectiveDisabledReason: ExecuteDisabledReason =
+              eb.disabledReason !== undefined
+                ? eb.disabledReason
+                : eb.endpointEnabled === false
+                  ? "endpointUnavailable"
+                  : !hasFiles
+                    ? "noFiles"
+                    : eb.paramsValid === false
+                      ? "invalidParams"
+                      : null;
+            return (
+              <>
+                <ScopedOperationButton
+                  selectedFiles={config.files.selectedFiles ?? []}
+                  disableScopeHints={eb.disableScopeHints}
+                  onClick={eb.onClick}
+                  isLoading={config.review.operation.isLoading}
+                  disabled={eb.disabled}
+                  disabledReason={effectiveDisabledReason}
+                  loadingText={eb.loadingText}
+                  submitText={eb.text}
+                  showCloudBadge={
+                    eb.showCloudBadge ??
+                    config.review.operation.willUseCloud ??
+                    false
+                  }
+                  data-testid={eb.testId}
+                  data-tour="run-button"
+                />
+                {config.belowExecuteButton}
+              </>
+            );
+          })()}
 
         {/* Review Step */}
         {steps.createReviewStep({
@@ -148,9 +182,9 @@ export function createToolFlow<TParams = unknown>(config: ToolFlowConfig<TParams
           operation: config.review.operation,
           title: config.review.title,
           onFileClick: config.review.onFileClick,
-          onUndo: config.review.onUndo
+          onUndo: config.review.onUndo,
         })}
       </ToolStepProvider>
     </Stack>
   );
-}
\ No newline at end of file
+}
diff --git a/frontend/src/core/components/tools/shared/renderToolButtons.tsx b/frontend/src/core/components/tools/shared/renderToolButtons.tsx
index 8e1b986cf0..b17cad7c61 100644
--- a/frontend/src/core/components/tools/shared/renderToolButtons.tsx
+++ b/frontend/src/core/components/tools/shared/renderToolButtons.tsx
@@ -1,10 +1,10 @@
-import { Box } from '@mantine/core';
-import ToolButton from '@app/components/tools/toolPicker/ToolButton';
-import SubcategoryHeader from '@app/components/tools/shared/SubcategoryHeader';
+import { Box } from "@mantine/core";
+import ToolButton from "@app/components/tools/toolPicker/ToolButton";
+import SubcategoryHeader from "@app/components/tools/shared/SubcategoryHeader";
 
 import { getSubcategoryLabel } from "@app/data/toolsTaxonomy";
-import { TFunction } from 'i18next';
-import { SubcategoryGroup } from '@app/hooks/useToolSections';
+import { TFunction } from "i18next";
+import { SubcategoryGroup } from "@app/hooks/useToolSections";
 import { ToolId } from "@app/types/toolId";
 
 // Helper function to render tool buttons for a subcategory
@@ -16,7 +16,7 @@ export const renderToolButtons = (
   showSubcategoryHeader: boolean = true,
   disableNavigation: boolean = false,
   searchResults?: Array<{ item: [string, any]; matchedText?: string }>,
-  hasStars: boolean = false
+  hasStars: boolean = false,
 ) => {
   // Create a map of matched text for quick lookup
   const matchedTextMap = new Map<string, string>();
@@ -29,7 +29,9 @@ export const renderToolButtons = (
   return (
     <Box key={subcategory.subcategoryId} w="100%">
       {showSubcategoryHeader && (
-        <SubcategoryHeader label={getSubcategoryLabel(t, subcategory.subcategoryId)} />
+        <SubcategoryHeader
+          label={getSubcategoryLabel(t, subcategory.subcategoryId)}
+        />
       )}
       <div>
         {subcategory.tools.map(({ id, tool }) => {
diff --git a/frontend/src/core/components/tools/showJS/ShowJSView.css b/frontend/src/core/components/tools/showJS/ShowJSView.css
index 27e573dbac..3121c2e29a 100644
--- a/frontend/src/core/components/tools/showJS/ShowJSView.css
+++ b/frontend/src/core/components/tools/showJS/ShowJSView.css
@@ -1,5 +1,7 @@
 .showjs-code {
-  font-family: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
+  font-family:
+    SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New",
+    monospace;
   font-size: 12px;
   line-height: 1.5;
   white-space: pre;
diff --git a/frontend/src/core/components/tools/showJS/ShowJSView.tsx b/frontend/src/core/components/tools/showJS/ShowJSView.tsx
index e442265826..6585b1cddf 100644
--- a/frontend/src/core/components/tools/showJS/ShowJSView.tsx
+++ b/frontend/src/core/components/tools/showJS/ShowJSView.tsx
@@ -1,5 +1,20 @@
-import React, { useCallback, useEffect, useMemo, useRef, useState } from "react";
-import { ActionIcon, Box, Button, Group, Stack, Text, ScrollArea, TextInput } from "@mantine/core";
+import React, {
+  useCallback,
+  useEffect,
+  useMemo,
+  useRef,
+  useState,
+} from "react";
+import {
+  ActionIcon,
+  Box,
+  Button,
+  Group,
+  Stack,
+  Text,
+  ScrollArea,
+  TextInput,
+} from "@mantine/core";
 import ContentCopyRoundedIcon from "@mui/icons-material/ContentCopyRounded";
 import ArrowUpwardRoundedIcon from "@mui/icons-material/ArrowUpwardRounded";
 import ArrowDownwardRoundedIcon from "@mui/icons-material/ArrowDownwardRounded";
@@ -59,7 +74,9 @@ const ShowJSView: React.FC<ShowJSViewProps> = ({ data }) => {
   }, [downloadUrl, downloadFilename]);
 
   const [lines, setLines] = useState<ShowJsToken[][]>([]);
-  const [blocks, setBlocks] = useState<Array<{ start: number; end: number }>>([]);
+  const [blocks, setBlocks] = useState<Array<{ start: number; end: number }>>(
+    [],
+  );
   const [collapsed, setCollapsed] = useState<Set<number>>(new Set());
 
   useEffect(() => {
@@ -98,7 +115,9 @@ const ShowJSView: React.FC<ShowJSViewProps> = ({ data }) => {
 
   // Search
   const [query, setQuery] = useState("");
-  const [matches, setMatches] = useState<Array<{ line: number; start: number; end: number }>>([]);
+  const [matches, setMatches] = useState<
+    Array<{ line: number; start: number; end: number }>
+  >([]);
   const [active, setActive] = useState(0);
 
   useEffect(() => {
@@ -125,7 +144,9 @@ const ShowJSView: React.FC<ShowJSViewProps> = ({ data }) => {
       }
     }
     if (scrollAreaInnerRef.current) {
-      const el = scrollAreaInnerRef.current.querySelector(`[data-code-line="${m.line}"]`) as HTMLElement | null;
+      const el = scrollAreaInnerRef.current.querySelector(
+        `[data-code-line="${m.line}"]`,
+      ) as HTMLElement | null;
       if (el) el.scrollIntoView({ block: "nearest", behavior: "smooth" });
     }
   }, [active, matches, startToEnd, collapsed]);
@@ -149,7 +170,8 @@ const ShowJSView: React.FC<ShowJSViewProps> = ({ data }) => {
               size="sm"
               variant="subtle"
               onClick={() => {
-                if (matches.length) setActive((p) => (p - 1 + matches.length) % matches.length);
+                if (matches.length)
+                  setActive((p) => (p - 1 + matches.length) % matches.length);
               }}
               aria-label={t("common.previous", "Previous")}
             >
@@ -184,7 +206,9 @@ const ShowJSView: React.FC<ShowJSViewProps> = ({ data }) => {
               onClick={handleCopy}
               leftSection={<ContentCopyRoundedIcon fontSize="small" />}
             >
-              {copied ? t("common.copied", "Copied!") : t("common.copy", "Copy")}
+              {copied
+                ? t("common.copied", "Copied!")
+                : t("common.copy", "Copy")}
             </Button>
           </Group>
         </div>
@@ -196,7 +220,9 @@ const ShowJSView: React.FC<ShowJSViewProps> = ({ data }) => {
                 const end = startToEnd.get(ln);
                 const folded = end != null && collapsed.has(ln);
                 let pos = 0;
-                const lineMatches = matches.map((m, idx) => ({ ...m, idx })).filter((m) => m.line === ln);
+                const lineMatches = matches
+                  .map((m, idx) => ({ ...m, idx }))
+                  .filter((m) => m.line === ln);
                 const content: React.ReactNode[] = [];
                 tokens.forEach((tok, ti) => {
                   const textSeg = tok.text;
@@ -204,7 +230,8 @@ const ShowJSView: React.FC<ShowJSViewProps> = ({ data }) => {
                   const tokenEnd = pos + textSeg.length;
 
                   if (!query || lineMatches.length === 0) {
-                    const cls = tok.type === "plain" ? undefined : `tok-${tok.type}`;
+                    const cls =
+                      tok.type === "plain" ? undefined : `tok-${tok.type}`;
                     content.push(
                       <span key={`t-${ln}-${ti}`} className={cls}>
                         {textSeg}
@@ -220,7 +247,8 @@ const ShowJSView: React.FC<ShowJSViewProps> = ({ data }) => {
                     .sort((a, b) => a.start - b.start);
 
                   if (matchesInToken.length === 0) {
-                    const cls = tok.type === "plain" ? undefined : `tok-${tok.type}`;
+                    const cls =
+                      tok.type === "plain" ? undefined : `tok-${tok.type}`;
                     content.push(
                       <span key={`t-${ln}-${ti}`} className={cls}>
                         {textSeg}
@@ -231,11 +259,15 @@ const ShowJSView: React.FC<ShowJSViewProps> = ({ data }) => {
                   }
 
                   let cursor = 0;
-                  const tokenCls = tok.type === "plain" ? "" : `tok-${tok.type}`;
+                  const tokenCls =
+                    tok.type === "plain" ? "" : `tok-${tok.type}`;
 
                   matchesInToken.forEach((m, mi) => {
                     const localStart = Math.max(0, m.start - tokenStart);
-                    const localEnd = Math.min(textSeg.length, m.end - tokenStart);
+                    const localEnd = Math.min(
+                      textSeg.length,
+                      m.end - tokenStart,
+                    );
 
                     // before match
                     if (localStart > cursor) {
@@ -250,10 +282,18 @@ const ShowJSView: React.FC<ShowJSViewProps> = ({ data }) => {
                     // matched piece
                     const hitText = textSeg.slice(localStart, localEnd);
                     const hitCls =
-                      ["search-hit", m.idx === active ? "search-hit-active" : "", tokenCls].filter(Boolean).join(" ") ||
-                      undefined;
+                      [
+                        "search-hit",
+                        m.idx === active ? "search-hit-active" : "",
+                        tokenCls,
+                      ]
+                        .filter(Boolean)
+                        .join(" ") || undefined;
                     content.push(
-                      <span key={`t-${ln}-${ti}-h-${localStart}-${mi}`} className={hitCls}>
+                      <span
+                        key={`t-${ln}-${ti}-h-${localStart}-${mi}`}
+                        className={hitCls}
+                      >
                         {hitText}
                       </span>,
                     );
@@ -274,13 +314,21 @@ const ShowJSView: React.FC<ShowJSViewProps> = ({ data }) => {
                   pos = tokenEnd;
                 });
                 return (
-                  <div key={`l-${ln}`} className="code-line" data-code-line={ln}>
+                  <div
+                    key={`l-${ln}`}
+                    className="code-line"
+                    data-code-line={ln}
+                  >
                     <div className="code-gutter">
                       {end != null ? (
                         <button
                           className={`fold-toggle ${folded ? "fold-collapsed" : ""}`}
                           onClick={() => toggleFold(ln)}
-                          aria-label={folded ? t("common.expand", "Expand") : t("common.collapse", "Collapse")}
+                          aria-label={
+                            folded
+                              ? t("common.expand", "Expand")
+                              : t("common.collapse", "Collapse")
+                          }
                         >
                           {folded ? "â–¸" : "â–¾"}
                         </button>
@@ -291,7 +339,9 @@ const ShowJSView: React.FC<ShowJSViewProps> = ({ data }) => {
                     </div>
                     <div className="code-content">
                       {content}
-                      {folded && <span className="collapsed-inline">{"{...}"}</span>}
+                      {folded && (
+                        <span className="collapsed-inline">{"{...}"}</span>
+                      )}
                     </div>
                   </div>
                 );
diff --git a/frontend/src/core/components/tools/showJS/utils.ts b/frontend/src/core/components/tools/showJS/utils.ts
index 0d891ddc53..e946ec271e 100644
--- a/frontend/src/core/components/tools/showJS/utils.ts
+++ b/frontend/src/core/components/tools/showJS/utils.ts
@@ -42,7 +42,10 @@ const JS_KEYWORDS = new Set([
   "of",
 ]);
 
-export function tokenizeToLines(src: string, keywords: Set<string> = JS_KEYWORDS): ShowJsToken[][] {
+export function tokenizeToLines(
+  src: string,
+  keywords: Set<string> = JS_KEYWORDS,
+): ShowJsToken[][] {
   const lines: ShowJsToken[][] = [];
   let current: ShowJsToken[] = [];
   let i = 0;
@@ -204,7 +207,9 @@ export function tokenizeToLines(src: string, keywords: Set<string> = JS_KEYWORDS
   return lines;
 }
 
-export function computeBlocks(src: string): Array<{ start: number; end: number }> {
+export function computeBlocks(
+  src: string,
+): Array<{ start: number; end: number }> {
   const res: Array<{ start: number; end: number }> = [];
   let i = 0;
   let line = 0;
@@ -351,7 +356,10 @@ export function computeSearchMatches(
   return list;
 }
 
-export async function copyTextToClipboard(text: string, fallbackElement?: HTMLElement | null): Promise<boolean> {
+export async function copyTextToClipboard(
+  text: string,
+  fallbackElement?: HTMLElement | null,
+): Promise<boolean> {
   try {
     if (typeof navigator !== "undefined" && navigator.clipboard) {
       await navigator.clipboard.writeText(text || "");
@@ -374,6 +382,9 @@ export async function copyTextToClipboard(text: string, fallbackElement?: HTMLEl
   }
 }
 
-export async function triggerDownload(url: string, filename: string): Promise<void> {
+export async function triggerDownload(
+  url: string,
+  filename: string,
+): Promise<void> {
   await downloadFromUrl(url, filename);
 }
diff --git a/frontend/src/core/components/tools/sign/PenSizeSelector.tsx b/frontend/src/core/components/tools/sign/PenSizeSelector.tsx
index 7c74bf47a3..1acb1d6481 100644
--- a/frontend/src/core/components/tools/sign/PenSizeSelector.tsx
+++ b/frontend/src/core/components/tools/sign/PenSizeSelector.tsx
@@ -1,5 +1,5 @@
-import React from 'react';
-import { TextInput, Combobox, useCombobox } from '@mantine/core';
+import React from "react";
+import { TextInput, Combobox, useCombobox } from "@mantine/core";
 
 interface PenSizeSelectorProps {
   value: number;
@@ -20,11 +20,11 @@ const PenSizeSelector = ({
   disabled = false,
   placeholder = "Type or select pen size (1-200)",
   style,
-  size
+  size,
 }: PenSizeSelectorProps) => {
   const combobox = useCombobox();
 
-  const penSizeOptions = ['1', '2', '3', '4', '5', '8', '10', '12', '15', '20'];
+  const penSizeOptions = ["1", "2", "3", "4", "5", "8", "10", "12", "15", "20"];
 
   return (
     <Combobox
@@ -83,4 +83,4 @@ const PenSizeSelector = ({
   );
 };
 
-export default PenSizeSelector;
\ No newline at end of file
+export default PenSizeSelector;
diff --git a/frontend/src/core/components/tools/sign/SavedSignaturesSection.tsx b/frontend/src/core/components/tools/sign/SavedSignaturesSection.tsx
index 13b828498b..94e06f716f 100644
--- a/frontend/src/core/components/tools/sign/SavedSignaturesSection.tsx
+++ b/frontend/src/core/components/tools/sign/SavedSignaturesSection.tsx
@@ -1,9 +1,23 @@
-import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
-import { useTranslation } from 'react-i18next';
-import { ActionIcon, Alert, Badge, Box, Card, Group, Stack, Text, TextInput, Tooltip } from '@mantine/core';
-import { LocalIcon } from '@app/components/shared/LocalIcon';
-import { SavedSignature, SavedSignatureType } from '@app/hooks/tools/sign/useSavedSignatures';
-import type { StorageType } from '@app/services/signatureStorageService';
+import { useCallback, useEffect, useMemo, useRef, useState } from "react";
+import { useTranslation } from "react-i18next";
+import {
+  ActionIcon,
+  Alert,
+  Badge,
+  Box,
+  Card,
+  Group,
+  Stack,
+  Text,
+  TextInput,
+  Tooltip,
+} from "@mantine/core";
+import { LocalIcon } from "@app/components/shared/LocalIcon";
+import {
+  SavedSignature,
+  SavedSignatureType,
+} from "@app/hooks/tools/sign/useSavedSignatures";
+import type { StorageType } from "@app/services/signatureStorageService";
 
 interface SavedSignaturesSectionProps {
   signatures: SavedSignature[];
@@ -19,9 +33,9 @@ interface SavedSignaturesSectionProps {
 }
 
 const typeBadgeColor: Record<SavedSignatureType, string> = {
-  canvas: 'indigo',
-  image: 'teal',
-  text: 'grape',
+  canvas: "indigo",
+  image: "teal",
+  text: "grape",
 };
 
 export const SavedSignaturesSection = ({
@@ -34,21 +48,23 @@ export const SavedSignaturesSection = ({
   onUseSignature,
   onDeleteSignature,
   onRenameSignature,
-  translationScope = 'sign',
+  translationScope = "sign",
 }: SavedSignaturesSectionProps) => {
   const { t } = useTranslation();
   const translate = useCallback(
     (key: string, defaultValue: string, options?: Record<string, unknown>) =>
       t(`${translationScope}.${key}`, { defaultValue, ...options }),
-    [t, translationScope]
+    [t, translationScope],
   );
   const [labelDrafts, setLabelDrafts] = useState<Record<string, string>>({});
 
   // Group signatures by scope
   const groupedSignatures = useMemo(() => {
-    const personal = signatures.filter(sig => sig.scope === 'personal');
-    const shared = signatures.filter(sig => sig.scope === 'shared');
-    const localStorage = signatures.filter(sig => sig.scope === 'localStorage');
+    const personal = signatures.filter((sig) => sig.scope === "personal");
+    const shared = signatures.filter((sig) => sig.scope === "shared");
+    const localStorage = signatures.filter(
+      (sig) => sig.scope === "localStorage",
+    );
     return { personal, shared, localStorage };
   }, [signatures]);
 
@@ -57,9 +73,11 @@ export const SavedSignaturesSection = ({
   const [activeSharedIndex, setActiveSharedIndex] = useState(0);
   const [activeLocalStorageIndex, setActiveLocalStorageIndex] = useState(0);
 
-  const activePersonalSignature = groupedSignatures.personal[activePersonalIndex];
+  const activePersonalSignature =
+    groupedSignatures.personal[activePersonalIndex];
   const activeSharedSignature = groupedSignatures.shared[activeSharedIndex];
-  const activeLocalStorageSignature = groupedSignatures.localStorage[activeLocalStorageIndex];
+  const activeLocalStorageSignature =
+    groupedSignatures.localStorage[activeLocalStorageIndex];
 
   const onUseSignatureRef = useRef(onUseSignature);
 
@@ -68,10 +86,10 @@ export const SavedSignaturesSection = ({
   }, [onUseSignature]);
 
   useEffect(() => {
-    setLabelDrafts(prev => {
+    setLabelDrafts((prev) => {
       const nextDrafts: Record<string, string> = {};
-      signatures.forEach(sig => {
-        nextDrafts[sig.id] = prev[sig.id] ?? sig.label ?? '';
+      signatures.forEach((sig) => {
+        nextDrafts[sig.id] = prev[sig.id] ?? sig.label ?? "";
       });
       return nextDrafts;
     });
@@ -79,19 +97,25 @@ export const SavedSignaturesSection = ({
 
   // Reset carousel indices when categories change
   useEffect(() => {
-    setActivePersonalIndex(prev => Math.min(prev, Math.max(groupedSignatures.personal.length - 1, 0)));
+    setActivePersonalIndex((prev) =>
+      Math.min(prev, Math.max(groupedSignatures.personal.length - 1, 0)),
+    );
   }, [groupedSignatures.personal.length]);
 
   useEffect(() => {
-    setActiveSharedIndex(prev => Math.min(prev, Math.max(groupedSignatures.shared.length - 1, 0)));
+    setActiveSharedIndex((prev) =>
+      Math.min(prev, Math.max(groupedSignatures.shared.length - 1, 0)),
+    );
   }, [groupedSignatures.shared.length]);
 
   useEffect(() => {
-    setActiveLocalStorageIndex(prev => Math.min(prev, Math.max(groupedSignatures.localStorage.length - 1, 0)));
+    setActiveLocalStorageIndex((prev) =>
+      Math.min(prev, Math.max(groupedSignatures.localStorage.length - 1, 0)),
+    );
   }, [groupedSignatures.localStorage.length]);
 
   const renderPreview = (signature: SavedSignature) => {
-    if (signature.type === 'text') {
+    if (signature.type === "text") {
       return (
         <Box
           component="div"
@@ -99,15 +123,15 @@ export const SavedSignaturesSection = ({
             fontFamily: signature.fontFamily,
             fontSize: `${signature.fontSize}px`,
             color: signature.textColor,
-            display: 'flex',
-            alignItems: 'center',
-            justifyContent: 'center',
-            height: '120px',
-            borderRadius: '0.5rem',
-            backgroundColor: '#ffffff',
-            padding: '0.5rem',
-            textAlign: 'center',
-            overflow: 'hidden',
+            display: "flex",
+            alignItems: "center",
+            justifyContent: "center",
+            height: "120px",
+            borderRadius: "0.5rem",
+            backgroundColor: "#ffffff",
+            padding: "0.5rem",
+            textAlign: "center",
+            overflow: "hidden",
           }}
         >
           <Text
@@ -115,7 +139,7 @@ export const SavedSignaturesSection = ({
             style={{
               fontFamily: signature.fontFamily,
               color: signature.textColor,
-              whiteSpace: 'nowrap',
+              whiteSpace: "nowrap",
             }}
           >
             {signature.signerName}
@@ -128,13 +152,13 @@ export const SavedSignaturesSection = ({
       <Box
         component="div"
         style={{
-          backgroundColor: '#ffffff',
-          borderRadius: '0.5rem',
-          height: '120px',
-          display: 'flex',
-          alignItems: 'center',
-          justifyContent: 'center',
-          padding: '0.5rem',
+          backgroundColor: "#ffffff",
+          borderRadius: "0.5rem",
+          height: "120px",
+          display: "flex",
+          alignItems: "center",
+          justifyContent: "center",
+          padding: "0.5rem",
         }}
       >
         <Box
@@ -142,9 +166,9 @@ export const SavedSignaturesSection = ({
           src={signature.dataUrl}
           alt={signature.label}
           style={{
-            maxWidth: '100%',
-            maxHeight: '100%',
-            objectFit: 'contain',
+            maxWidth: "100%",
+            maxHeight: "100%",
+            objectFit: "contain",
           }}
         />
       </Box>
@@ -154,12 +178,14 @@ export const SavedSignaturesSection = ({
   const emptyState = (
     <Card withBorder>
       <Stack gap="xs">
-        <Text fw={500}>{translate('saved.emptyTitle', 'No saved signatures yet')}</Text>
+        <Text fw={500}>
+          {translate("saved.emptyTitle", "No saved signatures yet")}
+        </Text>
         <Text size="sm" c="dimmed">
           {translate(
-            'saved.emptyDescription',
+            "saved.emptyDescription",
             'Draw, upload, or type a signature above, then use "Save to library" to keep up to {{max}} favourites ready to use.',
-            { max: maxLimit }
+            { max: maxLimit },
           )}
         </Text>
       </Stack>
@@ -168,37 +194,43 @@ export const SavedSignaturesSection = ({
 
   const typeLabel = (type: SavedSignatureType) => {
     switch (type) {
-      case 'canvas':
-        return translate('saved.type.canvas', 'Drawing');
-      case 'image':
-        return translate('saved.type.image', 'Upload');
-      case 'text':
-        return translate('saved.type.text', 'Text');
+      case "canvas":
+        return translate("saved.type.canvas", "Drawing");
+      case "image":
+        return translate("saved.type.image", "Upload");
+      case "text":
+        return translate("saved.type.text", "Text");
       default:
         return type;
     }
   };
 
   const handleLabelBlur = (signature: SavedSignature) => {
-    const nextValue = labelDrafts[signature.id]?.trim() ?? '';
+    const nextValue = labelDrafts[signature.id]?.trim() ?? "";
     if (!nextValue || nextValue === signature.label) {
-      setLabelDrafts(prev => ({ ...prev, [signature.id]: signature.label }));
+      setLabelDrafts((prev) => ({ ...prev, [signature.id]: signature.label }));
       return;
     }
     onRenameSignature(signature.id, nextValue);
   };
 
-  const handleLabelChange = (event: React.ChangeEvent<HTMLInputElement>, signature: SavedSignature) => {
+  const handleLabelChange = (
+    event: React.ChangeEvent<HTMLInputElement>,
+    signature: SavedSignature,
+  ) => {
     const { value } = event.currentTarget;
-    setLabelDrafts(prev => ({ ...prev, [signature.id]: value }));
+    setLabelDrafts((prev) => ({ ...prev, [signature.id]: value }));
   };
 
-  const handleLabelKeyDown = (event: React.KeyboardEvent<HTMLInputElement>, signature: SavedSignature) => {
-    if (event.key === 'Enter') {
+  const handleLabelKeyDown = (
+    event: React.KeyboardEvent<HTMLInputElement>,
+    signature: SavedSignature,
+  ) => {
+    if (event.key === "Enter") {
       event.currentTarget.blur();
     }
-    if (event.key === 'Escape') {
-      setLabelDrafts(prev => ({ ...prev, [signature.id]: signature.label }));
+    if (event.key === "Escape") {
+      setLabelDrafts((prev) => ({ ...prev, [signature.id]: signature.label }));
       event.currentTarget.blur();
     }
   };
@@ -208,20 +240,30 @@ export const SavedSignaturesSection = ({
       <Group justify="space-between" align="flex-start">
         <Stack gap={0}>
           <Text fw={600} size="md">
-            {translate('saved.heading', 'Saved signatures')}
+            {translate("saved.heading", "Saved signatures")}
           </Text>
           <Text size="sm" c="dimmed">
-            {translate('saved.description', 'Reuse saved signatures at any time.')}
+            {translate(
+              "saved.description",
+              "Reuse saved signatures at any time.",
+            )}
           </Text>
         </Stack>
       </Group>
 
       {isAtCapacity && (
-        <Alert color="yellow" title={translate('saved.limitTitle', 'Limit reached')}>
+        <Alert
+          color="yellow"
+          title={translate("saved.limitTitle", "Limit reached")}
+        >
           <Text size="sm">
-            {translate('saved.limitDescription', 'Remove a saved signature before adding new ones (max {{max}}).', {
-              max: maxLimit,
-            })}
+            {translate(
+              "saved.limitDescription",
+              "Remove a saved signature before adding new ones (max {{max}}).",
+              {
+                max: maxLimit,
+              },
+            )}
           </Text>
         </Alert>
       )}
@@ -236,36 +278,64 @@ export const SavedSignaturesSection = ({
               <Group gap="xs">
                 <LocalIcon icon="person-rounded" width={18} height={18} />
                 <Text fw={600} size="sm">
-                  {translate('saved.personalHeading', 'Personal Signatures')}
+                  {translate("saved.personalHeading", "Personal Signatures")}
                 </Text>
               </Group>
               <Text size="xs" c="dimmed">
-                {translate('saved.personalDescription', 'Only you can see these signatures.')}
+                {translate(
+                  "saved.personalDescription",
+                  "Only you can see these signatures.",
+                )}
               </Text>
 
               <Group justify="space-between" align="center">
                 <Text size="sm" c="dimmed">
-                  {translate('saved.carouselPosition', '{{current}} of {{total}}', {
-                    current: activePersonalIndex + 1,
-                    total: groupedSignatures.personal.length,
-                  })}
+                  {translate(
+                    "saved.carouselPosition",
+                    "{{current}} of {{total}}",
+                    {
+                      current: activePersonalIndex + 1,
+                      total: groupedSignatures.personal.length,
+                    },
+                  )}
                 </Text>
                 <Group gap={4}>
                   <ActionIcon
                     variant="light"
-                    aria-label={translate('saved.prev', 'Previous')}
-                    onClick={() => setActivePersonalIndex(prev => Math.max(0, prev - 1))}
+                    aria-label={translate("saved.prev", "Previous")}
+                    onClick={() =>
+                      setActivePersonalIndex((prev) => Math.max(0, prev - 1))
+                    }
                     disabled={disabled || activePersonalIndex === 0}
                   >
-                    <LocalIcon icon="chevron-left-rounded" width={18} height={18} />
+                    <LocalIcon
+                      icon="chevron-left-rounded"
+                      width={18}
+                      height={18}
+                    />
                   </ActionIcon>
                   <ActionIcon
                     variant="light"
-                    aria-label={translate('saved.next', 'Next')}
-                    onClick={() => setActivePersonalIndex(prev => Math.min(groupedSignatures.personal.length - 1, prev + 1))}
-                    disabled={disabled || activePersonalIndex >= groupedSignatures.personal.length - 1}
+                    aria-label={translate("saved.next", "Next")}
+                    onClick={() =>
+                      setActivePersonalIndex((prev) =>
+                        Math.min(
+                          groupedSignatures.personal.length - 1,
+                          prev + 1,
+                        ),
+                      )
+                    }
+                    disabled={
+                      disabled ||
+                      activePersonalIndex >=
+                        groupedSignatures.personal.length - 1
+                    }
                   >
-                    <LocalIcon icon="chevron-right-rounded" width={18} height={18} />
+                    <LocalIcon
+                      icon="chevron-right-rounded"
+                      width={18}
+                      height={18}
+                    />
                   </ActionIcon>
                 </Group>
               </Group>
@@ -273,7 +343,10 @@ export const SavedSignaturesSection = ({
               <Card withBorder padding="sm">
                 <Stack gap="sm">
                   <Group justify="space-between" align="center">
-                    <Badge color={typeBadgeColor[activePersonalSignature.type]} variant="light">
+                    <Badge
+                      color={typeBadgeColor[activePersonalSignature.type]}
+                      variant="light"
+                    >
                       {typeLabel(activePersonalSignature.type)}
                     </Badge>
                     <Group gap="xs">
@@ -284,28 +357,45 @@ export const SavedSignaturesSection = ({
                         onClick={() => onUseSignature(activePersonalSignature)}
                         disabled={disabled}
                       >
-                        <LocalIcon icon="check-circle-outline-rounded" width={18} height={18} />
+                        <LocalIcon
+                          icon="check-circle-outline-rounded"
+                          width={18}
+                          height={18}
+                        />
                       </ActionIcon>
-                      <Tooltip label={translate('saved.delete', 'Remove')}>
+                      <Tooltip label={translate("saved.delete", "Remove")}>
                         <ActionIcon
                           variant="subtle"
                           color="red"
-                          aria-label={translate('saved.delete', 'Remove')}
-                          onClick={() => onDeleteSignature(activePersonalSignature)}
+                          aria-label={translate("saved.delete", "Remove")}
+                          onClick={() =>
+                            onDeleteSignature(activePersonalSignature)
+                          }
                           disabled={disabled}
                         >
-                          <LocalIcon icon="delete-outline-rounded" width={18} height={18} />
+                          <LocalIcon
+                            icon="delete-outline-rounded"
+                            width={18}
+                            height={18}
+                          />
                         </ActionIcon>
                       </Tooltip>
                     </Group>
                   </Group>
                   {renderPreview(activePersonalSignature)}
                   <TextInput
-                    label={translate('saved.label', 'Label')}
-                    value={labelDrafts[activePersonalSignature.id] ?? activePersonalSignature.label}
-                    onChange={event => handleLabelChange(event, activePersonalSignature)}
+                    label={translate("saved.label", "Label")}
+                    value={
+                      labelDrafts[activePersonalSignature.id] ??
+                      activePersonalSignature.label
+                    }
+                    onChange={(event) =>
+                      handleLabelChange(event, activePersonalSignature)
+                    }
                     onBlur={() => handleLabelBlur(activePersonalSignature)}
-                    onKeyDown={event => handleLabelKeyDown(event, activePersonalSignature)}
+                    onKeyDown={(event) =>
+                      handleLabelKeyDown(event, activePersonalSignature)
+                    }
                     disabled={disabled}
                   />
                 </Stack>
@@ -319,36 +409,60 @@ export const SavedSignaturesSection = ({
               <Group gap="xs">
                 <LocalIcon icon="groups-rounded" width={18} height={18} />
                 <Text fw={600} size="sm">
-                  {translate('saved.sharedHeading', 'Shared Signatures')}
+                  {translate("saved.sharedHeading", "Shared Signatures")}
                 </Text>
               </Group>
               <Text size="xs" c="dimmed">
-                {translate('saved.sharedDescription', 'All users can see and use these signatures.')}
+                {translate(
+                  "saved.sharedDescription",
+                  "All users can see and use these signatures.",
+                )}
               </Text>
 
               <Group justify="space-between" align="center">
                 <Text size="sm" c="dimmed">
-                  {translate('saved.carouselPosition', '{{current}} of {{total}}', {
-                    current: activeSharedIndex + 1,
-                    total: groupedSignatures.shared.length,
-                  })}
+                  {translate(
+                    "saved.carouselPosition",
+                    "{{current}} of {{total}}",
+                    {
+                      current: activeSharedIndex + 1,
+                      total: groupedSignatures.shared.length,
+                    },
+                  )}
                 </Text>
                 <Group gap={4}>
                   <ActionIcon
                     variant="light"
-                    aria-label={translate('saved.prev', 'Previous')}
-                    onClick={() => setActiveSharedIndex(prev => Math.max(0, prev - 1))}
+                    aria-label={translate("saved.prev", "Previous")}
+                    onClick={() =>
+                      setActiveSharedIndex((prev) => Math.max(0, prev - 1))
+                    }
                     disabled={disabled || activeSharedIndex === 0}
                   >
-                    <LocalIcon icon="chevron-left-rounded" width={18} height={18} />
+                    <LocalIcon
+                      icon="chevron-left-rounded"
+                      width={18}
+                      height={18}
+                    />
                   </ActionIcon>
                   <ActionIcon
                     variant="light"
-                    aria-label={translate('saved.next', 'Next')}
-                    onClick={() => setActiveSharedIndex(prev => Math.min(groupedSignatures.shared.length - 1, prev + 1))}
-                    disabled={disabled || activeSharedIndex >= groupedSignatures.shared.length - 1}
+                    aria-label={translate("saved.next", "Next")}
+                    onClick={() =>
+                      setActiveSharedIndex((prev) =>
+                        Math.min(groupedSignatures.shared.length - 1, prev + 1),
+                      )
+                    }
+                    disabled={
+                      disabled ||
+                      activeSharedIndex >= groupedSignatures.shared.length - 1
+                    }
                   >
-                    <LocalIcon icon="chevron-right-rounded" width={18} height={18} />
+                    <LocalIcon
+                      icon="chevron-right-rounded"
+                      width={18}
+                      height={18}
+                    />
                   </ActionIcon>
                 </Group>
               </Group>
@@ -356,7 +470,10 @@ export const SavedSignaturesSection = ({
               <Card withBorder padding="sm">
                 <Stack gap="sm">
                   <Group justify="space-between" align="center">
-                    <Badge color={typeBadgeColor[activeSharedSignature.type]} variant="light">
+                    <Badge
+                      color={typeBadgeColor[activeSharedSignature.type]}
+                      variant="light"
+                    >
                       {typeLabel(activeSharedSignature.type)}
                     </Badge>
                     <Group gap="xs">
@@ -367,18 +484,28 @@ export const SavedSignaturesSection = ({
                         onClick={() => onUseSignature(activeSharedSignature)}
                         disabled={disabled}
                       >
-                        <LocalIcon icon="check-circle-outline-rounded" width={18} height={18} />
+                        <LocalIcon
+                          icon="check-circle-outline-rounded"
+                          width={18}
+                          height={18}
+                        />
                       </ActionIcon>
                       {isAdmin && (
-                        <Tooltip label={translate('saved.delete', 'Remove')}>
+                        <Tooltip label={translate("saved.delete", "Remove")}>
                           <ActionIcon
                             variant="subtle"
                             color="red"
-                            aria-label={translate('saved.delete', 'Remove')}
-                            onClick={() => onDeleteSignature(activeSharedSignature)}
+                            aria-label={translate("saved.delete", "Remove")}
+                            onClick={() =>
+                              onDeleteSignature(activeSharedSignature)
+                            }
                             disabled={disabled}
                           >
-                            <LocalIcon icon="delete-outline-rounded" width={18} height={18} />
+                            <LocalIcon
+                              icon="delete-outline-rounded"
+                              width={18}
+                              height={18}
+                            />
                           </ActionIcon>
                         </Tooltip>
                       )}
@@ -386,11 +513,18 @@ export const SavedSignaturesSection = ({
                   </Group>
                   {renderPreview(activeSharedSignature)}
                   <TextInput
-                    label={translate('saved.label', 'Label')}
-                    value={labelDrafts[activeSharedSignature.id] ?? activeSharedSignature.label}
-                    onChange={event => handleLabelChange(event, activeSharedSignature)}
+                    label={translate("saved.label", "Label")}
+                    value={
+                      labelDrafts[activeSharedSignature.id] ??
+                      activeSharedSignature.label
+                    }
+                    onChange={(event) =>
+                      handleLabelChange(event, activeSharedSignature)
+                    }
                     onBlur={() => handleLabelBlur(activeSharedSignature)}
-                    onKeyDown={event => handleLabelKeyDown(event, activeSharedSignature)}
+                    onKeyDown={(event) =>
+                      handleLabelKeyDown(event, activeSharedSignature)
+                    }
                     disabled={disabled}
                   />
                 </Stack>
@@ -399,86 +533,144 @@ export const SavedSignaturesSection = ({
           )}
 
           {/* Browser Storage (localStorage) - Temporary */}
-          {groupedSignatures.localStorage.length > 0 && activeLocalStorageSignature && (
-            <Stack gap="xs">
-              <Alert color="blue" title={translate('saved.tempStorageTitle', 'Temporary browser storage')}>
-                <Text size="xs">
-                  {translate(
-                    'saved.tempStorageDescription',
-                    'Signatures are stored in your browser only. They will be lost if you clear browser data or switch browsers.'
+          {groupedSignatures.localStorage.length > 0 &&
+            activeLocalStorageSignature && (
+              <Stack gap="xs">
+                <Alert
+                  color="blue"
+                  title={translate(
+                    "saved.tempStorageTitle",
+                    "Temporary browser storage",
                   )}
-                </Text>
-              </Alert>
+                >
+                  <Text size="xs">
+                    {translate(
+                      "saved.tempStorageDescription",
+                      "Signatures are stored in your browser only. They will be lost if you clear browser data or switch browsers.",
+                    )}
+                  </Text>
+                </Alert>
 
-              <Group justify="space-between" align="center">
-                <Text size="sm" c="dimmed">
-                  {translate('saved.carouselPosition', '{{current}} of {{total}}', {
-                    current: activeLocalStorageIndex + 1,
-                    total: groupedSignatures.localStorage.length,
-                  })}
-                </Text>
-                <Group gap={4}>
-                  <ActionIcon
-                    variant="light"
-                    aria-label={translate('saved.prev', 'Previous')}
-                    onClick={() => setActiveLocalStorageIndex(prev => Math.max(0, prev - 1))}
-                    disabled={disabled || activeLocalStorageIndex === 0}
-                  >
-                    <LocalIcon icon="chevron-left-rounded" width={18} height={18} />
-                  </ActionIcon>
-                  <ActionIcon
-                    variant="light"
-                    aria-label={translate('saved.next', 'Next')}
-                    onClick={() => setActiveLocalStorageIndex(prev => Math.min(groupedSignatures.localStorage.length - 1, prev + 1))}
-                    disabled={disabled || activeLocalStorageIndex >= groupedSignatures.localStorage.length - 1}
-                  >
-                    <LocalIcon icon="chevron-right-rounded" width={18} height={18} />
-                  </ActionIcon>
+                <Group justify="space-between" align="center">
+                  <Text size="sm" c="dimmed">
+                    {translate(
+                      "saved.carouselPosition",
+                      "{{current}} of {{total}}",
+                      {
+                        current: activeLocalStorageIndex + 1,
+                        total: groupedSignatures.localStorage.length,
+                      },
+                    )}
+                  </Text>
+                  <Group gap={4}>
+                    <ActionIcon
+                      variant="light"
+                      aria-label={translate("saved.prev", "Previous")}
+                      onClick={() =>
+                        setActiveLocalStorageIndex((prev) =>
+                          Math.max(0, prev - 1),
+                        )
+                      }
+                      disabled={disabled || activeLocalStorageIndex === 0}
+                    >
+                      <LocalIcon
+                        icon="chevron-left-rounded"
+                        width={18}
+                        height={18}
+                      />
+                    </ActionIcon>
+                    <ActionIcon
+                      variant="light"
+                      aria-label={translate("saved.next", "Next")}
+                      onClick={() =>
+                        setActiveLocalStorageIndex((prev) =>
+                          Math.min(
+                            groupedSignatures.localStorage.length - 1,
+                            prev + 1,
+                          ),
+                        )
+                      }
+                      disabled={
+                        disabled ||
+                        activeLocalStorageIndex >=
+                          groupedSignatures.localStorage.length - 1
+                      }
+                    >
+                      <LocalIcon
+                        icon="chevron-right-rounded"
+                        width={18}
+                        height={18}
+                      />
+                    </ActionIcon>
+                  </Group>
                 </Group>
-              </Group>
 
-              <Card withBorder padding="sm">
-                <Stack gap="sm">
-                  <Group justify="space-between" align="center">
-                    <Badge color={typeBadgeColor[activeLocalStorageSignature.type]} variant="light">
-                      {typeLabel(activeLocalStorageSignature.type)}
-                    </Badge>
-                    <Group gap="xs">
-                      <ActionIcon
-                        variant="subtle"
-                        color="blue"
-                        aria-label="Use signature"
-                        onClick={() => onUseSignature(activeLocalStorageSignature)}
-                        disabled={disabled}
+                <Card withBorder padding="sm">
+                  <Stack gap="sm">
+                    <Group justify="space-between" align="center">
+                      <Badge
+                        color={typeBadgeColor[activeLocalStorageSignature.type]}
+                        variant="light"
                       >
-                        <LocalIcon icon="check-circle-outline-rounded" width={18} height={18} />
-                      </ActionIcon>
-                      <Tooltip label={translate('saved.delete', 'Remove')}>
+                        {typeLabel(activeLocalStorageSignature.type)}
+                      </Badge>
+                      <Group gap="xs">
                         <ActionIcon
                           variant="subtle"
-                          color="red"
-                          aria-label={translate('saved.delete', 'Remove')}
-                          onClick={() => onDeleteSignature(activeLocalStorageSignature)}
+                          color="blue"
+                          aria-label="Use signature"
+                          onClick={() =>
+                            onUseSignature(activeLocalStorageSignature)
+                          }
                           disabled={disabled}
                         >
-                          <LocalIcon icon="delete-outline-rounded" width={18} height={18} />
+                          <LocalIcon
+                            icon="check-circle-outline-rounded"
+                            width={18}
+                            height={18}
+                          />
                         </ActionIcon>
-                      </Tooltip>
+                        <Tooltip label={translate("saved.delete", "Remove")}>
+                          <ActionIcon
+                            variant="subtle"
+                            color="red"
+                            aria-label={translate("saved.delete", "Remove")}
+                            onClick={() =>
+                              onDeleteSignature(activeLocalStorageSignature)
+                            }
+                            disabled={disabled}
+                          >
+                            <LocalIcon
+                              icon="delete-outline-rounded"
+                              width={18}
+                              height={18}
+                            />
+                          </ActionIcon>
+                        </Tooltip>
+                      </Group>
                     </Group>
-                  </Group>
-                  {renderPreview(activeLocalStorageSignature)}
-                  <TextInput
-                    label={translate('saved.label', 'Label')}
-                    value={labelDrafts[activeLocalStorageSignature.id] ?? activeLocalStorageSignature.label}
-                    onChange={event => handleLabelChange(event, activeLocalStorageSignature)}
-                    onBlur={() => handleLabelBlur(activeLocalStorageSignature)}
-                    onKeyDown={event => handleLabelKeyDown(event, activeLocalStorageSignature)}
-                    disabled={disabled}
-                  />
-                </Stack>
-              </Card>
-            </Stack>
-          )}
+                    {renderPreview(activeLocalStorageSignature)}
+                    <TextInput
+                      label={translate("saved.label", "Label")}
+                      value={
+                        labelDrafts[activeLocalStorageSignature.id] ??
+                        activeLocalStorageSignature.label
+                      }
+                      onChange={(event) =>
+                        handleLabelChange(event, activeLocalStorageSignature)
+                      }
+                      onBlur={() =>
+                        handleLabelBlur(activeLocalStorageSignature)
+                      }
+                      onKeyDown={(event) =>
+                        handleLabelKeyDown(event, activeLocalStorageSignature)
+                      }
+                      disabled={disabled}
+                    />
+                  </Stack>
+                </Card>
+              </Stack>
+            )}
         </Stack>
       )}
     </Stack>
diff --git a/frontend/src/core/components/tools/sign/SignSettings.tsx b/frontend/src/core/components/tools/sign/SignSettings.tsx
index 921091eca2..17a348ed82 100644
--- a/frontend/src/core/components/tools/sign/SignSettings.tsx
+++ b/frontend/src/core/components/tools/sign/SignSettings.tsx
@@ -1,11 +1,25 @@
-import { useState, useEffect, useMemo, useRef, useCallback } from 'react';
+import { useState, useEffect, useMemo, useRef, useCallback } from "react";
 import { useTranslation } from "react-i18next";
-import { Stack, Button, Text, Alert, SegmentedControl, Divider, ActionIcon, Tooltip, Group, Box } from '@mantine/core';
+import {
+  Stack,
+  Button,
+  Text,
+  Alert,
+  SegmentedControl,
+  Divider,
+  ActionIcon,
+  Tooltip,
+  Group,
+  Box,
+} from "@mantine/core";
 import { SignParameters } from "@app/hooks/tools/sign/useSignParameters";
 import { SuggestedToolsSection } from "@app/components/tools/shared/SuggestedToolsSection";
 import { useSignature } from "@app/contexts/SignatureContext";
 import { useViewer } from "@app/contexts/ViewerContext";
-import { PLACEMENT_ACTIVATION_DELAY, FILE_SWITCH_ACTIVATION_DELAY } from '@app/constants/signConstants';
+import {
+  PLACEMENT_ACTIVATION_DELAY,
+  FILE_SWITCH_ACTIVATION_DELAY,
+} from "@app/constants/signConstants";
 
 // Import the new reusable components
 import { DrawingCanvas } from "@app/components/annotation/shared/DrawingCanvas";
@@ -14,9 +28,15 @@ import { ImageUploader } from "@app/components/annotation/shared/ImageUploader";
 import { TextInputWithFont } from "@app/components/annotation/shared/TextInputWithFont";
 import { ColorPicker } from "@app/components/annotation/shared/ColorPicker";
 import { LocalIcon } from "@app/components/shared/LocalIcon";
-import { useSavedSignatures, SavedSignature, SavedSignaturePayload, SavedSignatureType, AddSignatureResult } from '@app/hooks/tools/sign/useSavedSignatures';
-import { SavedSignaturesSection } from '@app/components/tools/sign/SavedSignaturesSection';
-import { buildSignaturePreview } from '@app/utils/signaturePreview';
+import {
+  useSavedSignatures,
+  SavedSignature,
+  SavedSignaturePayload,
+  SavedSignatureType,
+  AddSignatureResult,
+} from "@app/hooks/tools/sign/useSavedSignatures";
+import { SavedSignaturesSection } from "@app/components/tools/sign/SavedSignaturesSection";
+import { buildSignaturePreview } from "@app/utils/signaturePreview";
 
 type SignatureDrafts = {
   canvas?: string;
@@ -31,7 +51,10 @@ type SignatureDrafts = {
 
 interface SignSettingsProps {
   parameters: SignParameters;
-  onParameterChange: <K extends keyof SignParameters>(key: K, value: SignParameters[K]) => void;
+  onParameterChange: <K extends keyof SignParameters>(
+    key: K,
+    value: SignParameters[K],
+  ) => void;
   disabled?: boolean;
   onActivateDrawMode?: () => void;
   onActivateSignaturePlacement?: () => void;
@@ -45,9 +68,14 @@ interface SignSettingsProps {
   defaultSignatureSource?: SignatureSource;
 }
 
-export type SignatureSource = 'canvas' | 'image' | 'text' | 'saved';
+export type SignatureSource = "canvas" | "image" | "text" | "saved";
 
-const DEFAULT_SIGNATURE_SOURCES: SignatureSource[] = ['canvas', 'image', 'text', 'saved'];
+const DEFAULT_SIGNATURE_SOURCES: SignatureSource[] = [
+  "canvas",
+  "image",
+  "text",
+  "saved",
+];
 
 const SignSettings = ({
   parameters,
@@ -59,38 +87,47 @@ const SignSettings = ({
   onUndo,
   onRedo,
   onSave,
-  translationScope = 'sign',
+  translationScope = "sign",
   allowedSignatureSources = DEFAULT_SIGNATURE_SOURCES,
   defaultSignatureSource,
 }: SignSettingsProps) => {
   const { t } = useTranslation();
   const { isPlacementMode, signaturesApplied, historyApiRef } = useSignature();
   const { activeFileIndex } = useViewer();
-  const [historyAvailability, setHistoryAvailability] = useState({ canUndo: false, canRedo: false });
+  const [historyAvailability, setHistoryAvailability] = useState({
+    canUndo: false,
+    canRedo: false,
+  });
   const historyApiInstance = historyApiRef.current;
   const translate = useCallback(
     (key: string, defaultValue: string, options?: Record<string, unknown>) =>
       t(`${translationScope}.${key}`, { defaultValue, ...options }),
-    [t, translationScope]
+    [t, translationScope],
   );
   const effectiveDefaultSource =
-    (defaultSignatureSource && allowedSignatureSources.includes(defaultSignatureSource)
+    (defaultSignatureSource &&
+    allowedSignatureSources.includes(defaultSignatureSource)
       ? defaultSignatureSource
-      : allowedSignatureSources[0]) ?? 'text';
-  const canUseSavedLibrary = allowedSignatureSources.includes('saved');
+      : allowedSignatureSources[0]) ?? "text";
+  const canUseSavedLibrary = allowedSignatureSources.includes("saved");
 
   // State for drawing
-  const [selectedColor, setSelectedColor] = useState('#000000');
+  const [selectedColor, setSelectedColor] = useState("#000000");
   const [penSize, setPenSize] = useState(2);
-  const [penSizeInput, setPenSizeInput] = useState('2');
+  const [penSizeInput, setPenSizeInput] = useState("2");
   const [isColorPickerOpen, setIsColorPickerOpen] = useState(false);
-  const [isPlacementManuallyPaused, setPlacementManuallyPaused] = useState(false);
+  const [isPlacementManuallyPaused, setPlacementManuallyPaused] =
+    useState(false);
 
   // State for different signature types
-  const [canvasSignatureData, setCanvasSignatureData] = useState<string | undefined>();
-  const [imageSignatureData, setImageSignatureData] = useState<string | undefined>();
+  const [canvasSignatureData, setCanvasSignatureData] = useState<
+    string | undefined
+  >();
+  const [imageSignatureData, setImageSignatureData] = useState<
+    string | undefined
+  >();
   const [signatureDrafts, setSignatureDrafts] = useState<SignatureDrafts>({});
-  const lastSyncedTextDraft = useRef<SignatureDrafts['text'] | null>(null);
+  const lastSyncedTextDraft = useRef<SignatureDrafts["text"] | null>(null);
   const lastAppliedPlacementKey = useRef<string | null>(null);
   const previousFileIndexRef = useRef(activeFileIndex);
   const {
@@ -104,145 +141,186 @@ const SignSettings = ({
     storageType,
     isAdmin,
   } = useSavedSignatures();
-  const [signatureSource, setSignatureSource] = useState<SignatureSource>(() => {
-    const paramSource = parameters.signatureType as SignatureSource;
-    if (allowedSignatureSources.includes(paramSource)) {
-      return paramSource;
-    }
-    return effectiveDefaultSource;
-  });
-  const [lastSavedSignatureKeys, setLastSavedSignatureKeys] = useState<Record<SavedSignatureType, string | null>>({
+  const [signatureSource, setSignatureSource] = useState<SignatureSource>(
+    () => {
+      const paramSource = parameters.signatureType as SignatureSource;
+      if (allowedSignatureSources.includes(paramSource)) {
+        return paramSource;
+      }
+      return effectiveDefaultSource;
+    },
+  );
+  const [lastSavedSignatureKeys, setLastSavedSignatureKeys] = useState<
+    Record<SavedSignatureType, string | null>
+  >({
     canvas: null,
     image: null,
     text: null,
   });
 
   const buildTextSignatureKey = useCallback(
-    (signerName: string, fontSize: number, fontFamily: string, textColor: string) =>
+    (
+      signerName: string,
+      fontSize: number,
+      fontFamily: string,
+      textColor: string,
+    ) =>
       JSON.stringify({
         signerName: signerName.trim(),
         fontSize,
         fontFamily,
         textColor,
       }),
-    []
+    [],
   );
 
   const getDefaultSavedLabel = useCallback(
     (type: SavedSignatureType) => {
       const nextIndex = (byTypeCounts[type] ?? 0) + 1;
-      let baseLabel = translate('saved.defaultLabel', 'Signature');
-      if (type === 'canvas') {
-        baseLabel = translate('saved.defaultCanvasLabel', 'Drawing signature');
-      } else if (type === 'image') {
-        baseLabel = translate('saved.defaultImageLabel', 'Uploaded signature');
-      } else if (type === 'text') {
-        baseLabel = translate('saved.defaultTextLabel', 'Typed signature');
+      let baseLabel = translate("saved.defaultLabel", "Signature");
+      if (type === "canvas") {
+        baseLabel = translate("saved.defaultCanvasLabel", "Drawing signature");
+      } else if (type === "image") {
+        baseLabel = translate("saved.defaultImageLabel", "Uploaded signature");
+      } else if (type === "text") {
+        baseLabel = translate("saved.defaultTextLabel", "Typed signature");
       }
       return `${baseLabel} ${nextIndex}`;
     },
-    [byTypeCounts, t, translate]
+    [byTypeCounts, t, translate],
   );
 
   const signatureKeysByType = useMemo(() => {
     const canvasKey = canvasSignatureData ?? null;
     const imageKey = imageSignatureData ?? null;
     const textKey = buildTextSignatureKey(
-      parameters.signerName ?? '',
+      parameters.signerName ?? "",
       parameters.fontSize ?? 16,
-      parameters.fontFamily ?? 'Helvetica',
-      parameters.textColor ?? '#000000'
+      parameters.fontFamily ?? "Helvetica",
+      parameters.textColor ?? "#000000",
     );
     return {
       canvas: canvasKey,
       image: imageKey,
       text: textKey,
     };
-  }, [canvasSignatureData, imageSignatureData, buildTextSignatureKey, parameters.signerName, parameters.fontSize, parameters.fontFamily, parameters.textColor]);
+  }, [
+    canvasSignatureData,
+    imageSignatureData,
+    buildTextSignatureKey,
+    parameters.signerName,
+    parameters.fontSize,
+    parameters.fontFamily,
+    parameters.textColor,
+  ]);
 
   const saveSignatureToLibrary = useCallback(
-    async (payload: SavedSignaturePayload, type: SavedSignatureType, scope: 'personal' | 'shared'): Promise<AddSignatureResult> => {
+    async (
+      payload: SavedSignaturePayload,
+      type: SavedSignatureType,
+      scope: "personal" | "shared",
+    ): Promise<AddSignatureResult> => {
       if (isSavedSignatureLimitReached) {
-        return { success: false, reason: 'limit' };
+        return { success: false, reason: "limit" };
       }
       return await addSignature(payload, getDefaultSavedLabel(type), scope);
     },
-    [addSignature, getDefaultSavedLabel, isSavedSignatureLimitReached]
+    [addSignature, getDefaultSavedLabel, isSavedSignatureLimitReached],
   );
 
   const setLastSavedKeyForType = useCallback(
     (type: SavedSignatureType, explicitKey?: string | null) => {
-      setLastSavedSignatureKeys(prev => ({
+      setLastSavedSignatureKeys((prev) => ({
         ...prev,
-        [type]: explicitKey !== undefined ? explicitKey : signatureKeysByType[type] ?? null,
+        [type]:
+          explicitKey !== undefined
+            ? explicitKey
+            : (signatureKeysByType[type] ?? null),
       }));
     },
-    [signatureKeysByType]
+    [signatureKeysByType],
   );
 
-  const handleSaveCanvasSignature = useCallback(async (scope: 'personal' | 'shared') => {
-    if (!canvasSignatureData) {
-      return;
-    }
-    const result = await saveSignatureToLibrary({ type: 'canvas', dataUrl: canvasSignatureData }, 'canvas', scope);
-    if (result.success) {
-      setLastSavedKeyForType('canvas');
-    }
-  }, [canvasSignatureData, saveSignatureToLibrary, setLastSavedKeyForType]);
+  const handleSaveCanvasSignature = useCallback(
+    async (scope: "personal" | "shared") => {
+      if (!canvasSignatureData) {
+        return;
+      }
+      const result = await saveSignatureToLibrary(
+        { type: "canvas", dataUrl: canvasSignatureData },
+        "canvas",
+        scope,
+      );
+      if (result.success) {
+        setLastSavedKeyForType("canvas");
+      }
+    },
+    [canvasSignatureData, saveSignatureToLibrary, setLastSavedKeyForType],
+  );
 
-  const handleSaveImageSignature = useCallback(async (scope: 'personal' | 'shared') => {
-    if (!imageSignatureData) {
-      return;
-    }
-    const result = await saveSignatureToLibrary({ type: 'image', dataUrl: imageSignatureData }, 'image', scope);
-    if (result.success) {
-      setLastSavedKeyForType('image');
-    }
-  }, [imageSignatureData, saveSignatureToLibrary, setLastSavedKeyForType]);
+  const handleSaveImageSignature = useCallback(
+    async (scope: "personal" | "shared") => {
+      if (!imageSignatureData) {
+        return;
+      }
+      const result = await saveSignatureToLibrary(
+        { type: "image", dataUrl: imageSignatureData },
+        "image",
+        scope,
+      );
+      if (result.success) {
+        setLastSavedKeyForType("image");
+      }
+    },
+    [imageSignatureData, saveSignatureToLibrary, setLastSavedKeyForType],
+  );
 
-  const handleSaveTextSignature = useCallback(async (scope: 'personal' | 'shared') => {
-    const signerName = (parameters.signerName ?? '').trim();
-    if (!signerName) {
-      return;
-    }
+  const handleSaveTextSignature = useCallback(
+    async (scope: "personal" | "shared") => {
+      const signerName = (parameters.signerName ?? "").trim();
+      if (!signerName) {
+        return;
+      }
 
-    // Generate image from text signature
-    const preview = await buildSignaturePreview({
-      signatureType: 'text',
-      signerName,
-      fontFamily: parameters.fontFamily ?? 'Helvetica',
-      fontSize: parameters.fontSize ?? 16,
-      textColor: parameters.textColor ?? '#000000',
-    });
-
-    if (!preview?.dataUrl) {
-      console.error('Failed to generate text signature preview');
-      return;
-    }
-
-    const result = await saveSignatureToLibrary(
-      {
-        type: 'text',
-        dataUrl: preview.dataUrl,
+      // Generate image from text signature
+      const preview = await buildSignaturePreview({
+        signatureType: "text",
         signerName,
-        fontFamily: parameters.fontFamily ?? 'Helvetica',
+        fontFamily: parameters.fontFamily ?? "Helvetica",
         fontSize: parameters.fontSize ?? 16,
-        textColor: parameters.textColor ?? '#000000',
-      },
-      'text',
-      scope
-    );
-    if (result.success) {
-      setLastSavedKeyForType('text');
-    }
-  }, [
-    parameters.fontFamily,
-    parameters.fontSize,
-    parameters.signerName,
-    parameters.textColor,
-    saveSignatureToLibrary,
-    setLastSavedKeyForType,
-  ]);
+        textColor: parameters.textColor ?? "#000000",
+      });
+
+      if (!preview?.dataUrl) {
+        console.error("Failed to generate text signature preview");
+        return;
+      }
+
+      const result = await saveSignatureToLibrary(
+        {
+          type: "text",
+          dataUrl: preview.dataUrl,
+          signerName,
+          fontFamily: parameters.fontFamily ?? "Helvetica",
+          fontSize: parameters.fontSize ?? 16,
+          textColor: parameters.textColor ?? "#000000",
+        },
+        "text",
+        scope,
+      );
+      if (result.success) {
+        setLastSavedKeyForType("text");
+      }
+    },
+    [
+      parameters.fontFamily,
+      parameters.fontSize,
+      parameters.signerName,
+      parameters.textColor,
+      saveSignatureToLibrary,
+      setLastSavedKeyForType,
+    ],
+  );
 
   const handleUseSavedSignature = useCallback(
     (signature: SavedSignature) => {
@@ -251,34 +329,39 @@ const SignSettings = ({
       // Use the data URL directly (already converted to base64 when loaded)
       const dataUrlToUse = signature.dataUrl;
 
-      if (signature.type === 'canvas') {
-        if (parameters.signatureType !== 'canvas') {
-          onParameterChange('signatureType', 'canvas');
+      if (signature.type === "canvas") {
+        if (parameters.signatureType !== "canvas") {
+          onParameterChange("signatureType", "canvas");
         }
         setCanvasSignatureData(dataUrlToUse);
-      } else if (signature.type === 'image') {
-        if (parameters.signatureType !== 'image') {
-          onParameterChange('signatureType', 'image');
+      } else if (signature.type === "image") {
+        if (parameters.signatureType !== "image") {
+          onParameterChange("signatureType", "image");
         }
         setImageSignatureData(dataUrlToUse);
-      } else if (signature.type === 'text') {
-        if (parameters.signatureType !== 'text') {
-          onParameterChange('signatureType', 'text');
+      } else if (signature.type === "text") {
+        if (parameters.signatureType !== "text") {
+          onParameterChange("signatureType", "text");
         }
-        onParameterChange('signerName', signature.signerName);
-        onParameterChange('fontFamily', signature.fontFamily);
-        onParameterChange('fontSize', signature.fontSize);
-        onParameterChange('textColor', signature.textColor);
+        onParameterChange("signerName", signature.signerName);
+        onParameterChange("fontFamily", signature.fontFamily);
+        onParameterChange("fontSize", signature.fontSize);
+        onParameterChange("textColor", signature.textColor);
       }
 
       const savedKey =
-        signature.type === 'text'
-          ? buildTextSignatureKey(signature.signerName, signature.fontSize, signature.fontFamily, signature.textColor)
+        signature.type === "text"
+          ? buildTextSignatureKey(
+              signature.signerName,
+              signature.fontSize,
+              signature.fontFamily,
+              signature.textColor,
+            )
           : dataUrlToUse;
       setLastSavedKeyForType(signature.type, savedKey);
 
       const activate = () => onActivateSignaturePlacement?.();
-      if (typeof window !== 'undefined') {
+      if (typeof window !== "undefined") {
         window.setTimeout(activate, PLACEMENT_ACTIVATION_DELAY);
       } else {
         activate();
@@ -293,24 +376,31 @@ const SignSettings = ({
       setImageSignatureData,
       setPlacementManuallyPaused,
       setLastSavedKeyForType,
-    ]
+    ],
   );
 
   const handleDeleteSavedSignature = useCallback(
     (signature: SavedSignature) => {
       removeSignature(signature.id);
     },
-    [removeSignature]
+    [removeSignature],
   );
 
   const handleRenameSavedSignature = useCallback(
     (id: string, label: string) => {
       updateSignatureLabel(id, label);
     },
-    [updateSignatureLabel]
+    [updateSignatureLabel],
   );
 
-  const renderSaveButton = (type: SavedSignatureType, isReady: boolean, onClick: (scope: 'personal' | 'shared') => void, scope: 'personal' | 'shared', icon: string, label: string) => {
+  const renderSaveButton = (
+    type: SavedSignatureType,
+    isReady: boolean,
+    onClick: (scope: "personal" | "shared") => void,
+    scope: "personal" | "shared",
+    icon: string,
+    label: string,
+  ) => {
     if (!canUseSavedLibrary) {
       return null;
     }
@@ -320,29 +410,41 @@ const SignSettings = ({
     const isSaved = isReady && !hasChanges;
 
     // Only show backend storage buttons when backend is available
-    const showButton = storageType === 'backend' || storageType === null;
+    const showButton = storageType === "backend" || storageType === null;
     if (!showButton) {
       return null;
     }
 
     let tooltipMessage: string | undefined;
     if (!isReady) {
-      tooltipMessage = translate('saved.saveUnavailable', 'Create a signature first to save it.');
+      tooltipMessage = translate(
+        "saved.saveUnavailable",
+        "Create a signature first to save it.",
+      );
     } else if (isSaved) {
-      tooltipMessage = translate('saved.noChanges', 'Current signature is already saved.');
+      tooltipMessage = translate(
+        "saved.noChanges",
+        "Current signature is already saved.",
+      );
     } else if (isSavedSignatureLimitReached) {
-      tooltipMessage = translate('saved.limitDescription', 'You have reached the maximum limit of {{max}} saved signatures. Remove a saved signature before adding new ones.', {
-        max: maxLimit,
-      });
+      tooltipMessage = translate(
+        "saved.limitDescription",
+        "You have reached the maximum limit of {{max}} saved signatures. Remove a saved signature before adding new ones.",
+        {
+          max: maxLimit,
+        },
+      );
     }
 
     const button = (
       <Button
         size="xs"
         variant="outline"
-        color={isSaved ? 'green' : undefined}
+        color={isSaved ? "green" : undefined}
         onClick={() => onClick(scope)}
-        disabled={!isReady || disabled || isSavedSignatureLimitReached || !hasChanges}
+        disabled={
+          !isReady || disabled || isSavedSignatureLimitReached || !hasChanges
+        }
         leftSection={<LocalIcon icon={icon} width={16} height={16} />}
       >
         {label}
@@ -352,7 +454,7 @@ const SignSettings = ({
     if (tooltipMessage) {
       return (
         <Tooltip label={tooltipMessage}>
-          <span style={{ display: 'inline-block' }}>{button}</span>
+          <span style={{ display: "inline-block" }}>{button}</span>
         </Tooltip>
       );
     }
@@ -360,7 +462,11 @@ const SignSettings = ({
     return button;
   };
 
-  const renderSaveButtonRow = (type: SavedSignatureType, isReady: boolean, onClick: (scope: 'personal' | 'shared') => void) => {
+  const renderSaveButtonRow = (
+    type: SavedSignatureType,
+    isReady: boolean,
+    onClick: (scope: "personal" | "shared") => void,
+  ) => {
     if (!canUseSavedLibrary) {
       return null;
     }
@@ -369,18 +475,18 @@ const SignSettings = ({
       type,
       isReady,
       onClick,
-      'personal',
-      'person-rounded',
-      translate('saved.savePersonal', 'Save Personal')
+      "personal",
+      "person-rounded",
+      translate("saved.savePersonal", "Save Personal"),
     );
 
     const sharedButton = renderSaveButton(
       type,
       isReady,
       onClick,
-      'shared',
-      'groups-rounded',
-      translate('saved.saveShared', 'Save Shared')
+      "shared",
+      "groups-rounded",
+      translate("saved.saveShared", "Save Shared"),
     );
 
     if (!personalButton && !sharedButton) {
@@ -388,7 +494,7 @@ const SignSettings = ({
     }
 
     return (
-      <Group gap="xs" style={{ alignSelf: 'flex-start', marginTop: '0.4rem' }}>
+      <Group gap="xs" style={{ alignSelf: "flex-start", marginTop: "0.4rem" }}>
         {personalButton}
         {sharedButton}
       </Group>
@@ -396,20 +502,28 @@ const SignSettings = ({
   };
 
   useEffect(() => {
-    if (signatureSource === 'saved' && !canUseSavedLibrary) {
+    if (signatureSource === "saved" && !canUseSavedLibrary) {
       setSignatureSource(effectiveDefaultSource);
       return;
     }
-    if (signatureSource === 'saved') {
+    if (signatureSource === "saved") {
       return;
     }
-    const nextSource = allowedSignatureSources.includes(parameters.signatureType as SignatureSource)
+    const nextSource = allowedSignatureSources.includes(
+      parameters.signatureType as SignatureSource,
+    )
       ? (parameters.signatureType as SignatureSource)
       : effectiveDefaultSource;
     if (signatureSource !== nextSource) {
       setSignatureSource(nextSource);
     }
-  }, [parameters.signatureType, signatureSource, allowedSignatureSources, effectiveDefaultSource, canUseSavedLibrary]);
+  }, [
+    parameters.signatureType,
+    signatureSource,
+    allowedSignatureSources,
+    effectiveDefaultSource,
+    canUseSavedLibrary,
+  ]);
 
   useEffect(() => {
     if (!disabled) {
@@ -420,14 +534,14 @@ const SignSettings = ({
   const handleSignatureSourceChange = useCallback(
     (value: SignatureSource) => {
       setSignatureSource(value);
-      if (value === 'saved') {
+      if (value === "saved") {
         return;
       }
       if (parameters.signatureType !== value) {
-        onParameterChange('signatureType', value);
+        onParameterChange("signatureType", value);
       }
     },
-    [onParameterChange, parameters.signatureType]
+    [onParameterChange, parameters.signatureType],
   );
 
   useEffect(() => {
@@ -470,13 +584,16 @@ const SignSettings = ({
         // try to set the image data, potentially with the wrong version
 
         // Directly activate placement on image upload
-        if (typeof window !== 'undefined') {
-          window.setTimeout(() => onActivateSignaturePlacement?.(), PLACEMENT_ACTIVATION_DELAY);
+        if (typeof window !== "undefined") {
+          window.setTimeout(
+            () => onActivateSignaturePlacement?.(),
+            PLACEMENT_ACTIVATION_DELAY,
+          );
         } else {
           onActivateSignaturePlacement?.();
         }
       } catch (error) {
-        console.error('Error reading file:', error);
+        console.error("Error reading file:", error);
       }
     } else if (!file) {
       setImageSignatureData(undefined);
@@ -485,46 +602,64 @@ const SignSettings = ({
   };
 
   // Handle signature data changes
-  const handleCanvasSignatureChange = useCallback((data: string | null) => {
-    const nextValue = data ?? undefined;
-    setCanvasSignatureData(prevData => {
-      // Reset pause state and trigger placement for signature changes
-      // (onDrawingComplete handles initial activation)
-      if (prevData && prevData !== nextValue && nextValue) {
-        setPlacementManuallyPaused(false);
-        lastAppliedPlacementKey.current = null;
-        // Directly activate placement on signature change
-        if (typeof window !== 'undefined') {
-          window.setTimeout(() => onActivateSignaturePlacement?.(), PLACEMENT_ACTIVATION_DELAY);
-        } else {
-          onActivateSignaturePlacement?.();
+  const handleCanvasSignatureChange = useCallback(
+    (data: string | null) => {
+      const nextValue = data ?? undefined;
+      setCanvasSignatureData((prevData) => {
+        // Reset pause state and trigger placement for signature changes
+        // (onDrawingComplete handles initial activation)
+        if (prevData && prevData !== nextValue && nextValue) {
+          setPlacementManuallyPaused(false);
+          lastAppliedPlacementKey.current = null;
+          // Directly activate placement on signature change
+          if (typeof window !== "undefined") {
+            window.setTimeout(
+              () => onActivateSignaturePlacement?.(),
+              PLACEMENT_ACTIVATION_DELAY,
+            );
+          } else {
+            onActivateSignaturePlacement?.();
+          }
         }
-      }
-      return nextValue;
-    });
-  }, [onActivateSignaturePlacement]);
-
-  const hasCanvasSignature = useMemo(() => Boolean(canvasSignatureData), [canvasSignatureData]);
-  const hasImageSignature = useMemo(() => Boolean(imageSignatureData), [imageSignatureData]);
-  const hasTextSignature = useMemo(
-    () => Boolean(parameters.signerName && parameters.signerName.trim() !== ''),
-    [parameters.signerName]
+        return nextValue;
+      });
+    },
+    [onActivateSignaturePlacement],
   );
 
-  const hasAnySignature = hasCanvasSignature || hasImageSignature || hasTextSignature;
+  const hasCanvasSignature = useMemo(
+    () => Boolean(canvasSignatureData),
+    [canvasSignatureData],
+  );
+  const hasImageSignature = useMemo(
+    () => Boolean(imageSignatureData),
+    [imageSignatureData],
+  );
+  const hasTextSignature = useMemo(
+    () => Boolean(parameters.signerName && parameters.signerName.trim() !== ""),
+    [parameters.signerName],
+  );
+
+  const hasAnySignature =
+    hasCanvasSignature || hasImageSignature || hasTextSignature;
 
   const isCurrentTypeReady = useMemo(() => {
     switch (parameters.signatureType) {
-      case 'canvas':
+      case "canvas":
         return hasCanvasSignature;
-      case 'image':
+      case "image":
         return hasImageSignature;
-      case 'text':
+      case "text":
         return hasTextSignature;
       default:
         return false;
     }
-  }, [parameters.signatureType, hasCanvasSignature, hasImageSignature, hasTextSignature]);
+  }, [
+    parameters.signatureType,
+    hasCanvasSignature,
+    hasImageSignature,
+    hasTextSignature,
+  ]);
 
   const placementSignatureKey = useMemo(() => {
     if (!isCurrentTypeReady) {
@@ -538,10 +673,11 @@ const SignSettings = ({
     return isCurrentTypeReady;
   }, [disabled, isCurrentTypeReady]);
 
-  const shouldAutoActivate = shouldEnablePlacement && !isPlacementManuallyPaused && !signaturesApplied;
+  const shouldAutoActivate =
+    shouldEnablePlacement && !isPlacementManuallyPaused && !signaturesApplied;
 
   useEffect(() => {
-    setSignatureDrafts(prev => {
+    setSignatureDrafts((prev) => {
       if (canvasSignatureData) {
         if (prev.canvas === canvasSignatureData) {
           return prev;
@@ -560,7 +696,7 @@ const SignSettings = ({
   }, [canvasSignatureData]);
 
   useEffect(() => {
-    setSignatureDrafts(prev => {
+    setSignatureDrafts((prev) => {
       if (imageSignatureData) {
         if (prev.image === imageSignatureData) {
           return prev;
@@ -580,13 +716,13 @@ const SignSettings = ({
 
   useEffect(() => {
     const nextDraft = {
-      signerName: parameters.signerName || '',
+      signerName: parameters.signerName || "",
       fontSize: parameters.fontSize || 16,
-      fontFamily: parameters.fontFamily || 'Helvetica',
-      textColor: parameters.textColor || '#000000',
+      fontFamily: parameters.fontFamily || "Helvetica",
+      textColor: parameters.textColor || "#000000",
     };
 
-    setSignatureDrafts(prev => {
+    setSignatureDrafts((prev) => {
       const prevDraft = prev.text;
       if (
         prevDraft &&
@@ -600,20 +736,25 @@ const SignSettings = ({
 
       return { ...prev, text: nextDraft };
     });
-  }, [parameters.signerName, parameters.fontSize, parameters.fontFamily, parameters.textColor]);
+  }, [
+    parameters.signerName,
+    parameters.fontSize,
+    parameters.fontFamily,
+    parameters.textColor,
+  ]);
 
   useEffect(() => {
-    if (parameters.signatureType === 'text') {
+    if (parameters.signatureType === "text") {
       const draft = signatureDrafts.text;
       if (!draft) {
         lastSyncedTextDraft.current = null;
         return;
       }
 
-      const currentSignerName = parameters.signerName ?? '';
+      const currentSignerName = parameters.signerName ?? "";
       const currentFontSize = parameters.fontSize ?? 16;
-      const currentFontFamily = parameters.fontFamily ?? 'Helvetica';
-      const currentTextColor = parameters.textColor ?? '#000000';
+      const currentFontFamily = parameters.fontFamily ?? "Helvetica";
+      const currentTextColor = parameters.textColor ?? "#000000";
 
       const isSynced =
         draft.signerName === currentSignerName &&
@@ -637,16 +778,16 @@ const SignSettings = ({
       if (!alreadyAttempted) {
         lastSyncedTextDraft.current = draft;
         if (draft.signerName !== currentSignerName) {
-          onParameterChange('signerName', draft.signerName);
+          onParameterChange("signerName", draft.signerName);
         }
         if (draft.fontSize !== currentFontSize) {
-          onParameterChange('fontSize', draft.fontSize);
+          onParameterChange("fontSize", draft.fontSize);
         }
         if (draft.fontFamily !== currentFontFamily) {
-          onParameterChange('fontFamily', draft.fontFamily);
+          onParameterChange("fontFamily", draft.fontFamily);
         }
         if (draft.textColor !== currentTextColor) {
-          onParameterChange('textColor', draft.textColor);
+          onParameterChange("textColor", draft.textColor);
         }
       }
     } else {
@@ -665,16 +806,22 @@ const SignSettings = ({
   useEffect(() => {
     let newSignatureData: string | undefined = undefined;
 
-    if (parameters.signatureType === 'image' && imageSignatureData) {
+    if (parameters.signatureType === "image" && imageSignatureData) {
       newSignatureData = imageSignatureData;
-    } else if (parameters.signatureType === 'canvas' && canvasSignatureData) {
+    } else if (parameters.signatureType === "canvas" && canvasSignatureData) {
       newSignatureData = canvasSignatureData;
     }
 
     if (parameters.signatureData !== newSignatureData) {
-      onParameterChange('signatureData', newSignatureData);
+      onParameterChange("signatureData", newSignatureData);
     }
-  }, [parameters.signatureType, parameters.signatureData, canvasSignatureData, imageSignatureData, onParameterChange]);
+  }, [
+    parameters.signatureType,
+    parameters.signatureData,
+    canvasSignatureData,
+    imageSignatureData,
+    onParameterChange,
+  ]);
 
   useEffect(() => {
     if (!shouldEnablePlacement) {
@@ -691,7 +838,7 @@ const SignSettings = ({
       return;
     }
 
-    if (typeof window !== 'undefined') {
+    if (typeof window !== "undefined") {
       const timer = window.setTimeout(() => {
         onActivateSignaturePlacement?.();
       }, PLACEMENT_ACTIVATION_DELAY);
@@ -731,13 +878,19 @@ const SignSettings = ({
       lastAppliedPlacementKey.current = placementSignatureKey;
     };
 
-    if (typeof window !== 'undefined') {
+    if (typeof window !== "undefined") {
       const timer = window.setTimeout(trigger, PLACEMENT_ACTIVATION_DELAY);
       return () => window.clearTimeout(timer);
     }
 
     trigger();
-  }, [placementSignatureKey, shouldAutoActivate, shouldEnablePlacement, isPlacementMode, onActivateSignaturePlacement]);
+  }, [
+    placementSignatureKey,
+    shouldAutoActivate,
+    shouldEnablePlacement,
+    isPlacementMode,
+    onActivateSignaturePlacement,
+  ]);
   useEffect(() => {
     if (activeFileIndex === previousFileIndexRef.current) {
       return;
@@ -752,7 +905,7 @@ const SignSettings = ({
     setPlacementManuallyPaused(false);
     lastAppliedPlacementKey.current = null;
 
-    if (typeof window !== 'undefined') {
+    if (typeof window !== "undefined") {
       const timer = window.setTimeout(() => {
         onActivateSignaturePlacement?.();
       }, FILE_SWITCH_ACTIVATION_DELAY);
@@ -760,22 +913,27 @@ const SignSettings = ({
     }
 
     onActivateSignaturePlacement?.();
-  }, [activeFileIndex, shouldEnablePlacement, signaturesApplied, onActivateSignaturePlacement]);
+  }, [
+    activeFileIndex,
+    shouldEnablePlacement,
+    signaturesApplied,
+    onActivateSignaturePlacement,
+  ]);
 
   const sourceLabels: Record<SignatureSource, string> = {
-    canvas: translate('type.canvas', 'Draw'),
-    image: translate('type.image', 'Upload'),
-    text: translate('type.text', 'Type'),
-    saved: translate('type.saved', 'Saved'),
+    canvas: translate("type.canvas", "Draw"),
+    image: translate("type.image", "Upload"),
+    text: translate("type.text", "Type"),
+    saved: translate("type.saved", "Saved"),
   };
 
-  const sourceOptions = allowedSignatureSources.map(source => ({
+  const sourceOptions = allowedSignatureSources.map((source) => ({
     label: sourceLabels[source],
     value: source,
   }));
 
   const renderSignatureBuilder = () => {
-    if (signatureSource === 'saved') {
+    if (signatureSource === "saved") {
       if (!canUseSavedLibrary) {
         return null;
       }
@@ -795,7 +953,7 @@ const SignSettings = ({
       );
     }
 
-    if (signatureSource === 'canvas') {
+    if (signatureSource === "canvas") {
       return (
         <Stack gap="xs">
           <DrawingCanvas
@@ -812,12 +970,16 @@ const SignSettings = ({
             disabled={disabled}
             initialSignatureData={canvasSignatureData}
           />
-          {renderSaveButtonRow('canvas', hasCanvasSignature, handleSaveCanvasSignature)}
+          {renderSaveButtonRow(
+            "canvas",
+            hasCanvasSignature,
+            handleSaveCanvasSignature,
+          )}
         </Stack>
       );
     }
 
-    if (signatureSource === 'image') {
+    if (signatureSource === "image") {
       return (
         <Stack gap="xs">
           <ImageUploader
@@ -830,7 +992,11 @@ const SignSettings = ({
               }
             }}
           />
-          {renderSaveButtonRow('image', hasImageSignature, handleSaveImageSignature)}
+          {renderSaveButtonRow(
+            "image",
+            hasImageSignature,
+            handleSaveImageSignature,
+          )}
         </Stack>
       );
     }
@@ -838,76 +1004,90 @@ const SignSettings = ({
     return (
       <Stack gap="xs">
         <TextInputWithFont
-          text={parameters.signerName || ''}
-          onTextChange={(text) => onParameterChange('signerName', text)}
+          text={parameters.signerName || ""}
+          onTextChange={(text) => onParameterChange("signerName", text)}
           fontSize={parameters.fontSize || 16}
-          onFontSizeChange={(size) => onParameterChange('fontSize', size)}
-          fontFamily={parameters.fontFamily || 'Helvetica'}
-          onFontFamilyChange={(family) => onParameterChange('fontFamily', family)}
-          textColor={parameters.textColor || '#000000'}
-          onTextColorChange={(color) => onParameterChange('textColor', color)}
+          onFontSizeChange={(size) => onParameterChange("fontSize", size)}
+          fontFamily={parameters.fontFamily || "Helvetica"}
+          onFontFamilyChange={(family) =>
+            onParameterChange("fontFamily", family)
+          }
+          textColor={parameters.textColor || "#000000"}
+          onTextColorChange={(color) => onParameterChange("textColor", color)}
           disabled={disabled}
-          label={translate('text.name', 'Text')}
-          placeholder={translate('text.placeholder', 'Enter text')}
-          fontLabel={translate('text.fontLabel', 'Font')}
-          fontSizeLabel={translate('text.fontSizeLabel', 'Font size')}
-          fontSizePlaceholder={translate('text.fontSizePlaceholder', 'Type or select font size (8-200)')}
-          colorLabel={translate('text.colorLabel', 'Text colour')}
+          label={translate("text.name", "Text")}
+          placeholder={translate("text.placeholder", "Enter text")}
+          fontLabel={translate("text.fontLabel", "Font")}
+          fontSizeLabel={translate("text.fontSizeLabel", "Font size")}
+          fontSizePlaceholder={translate(
+            "text.fontSizePlaceholder",
+            "Type or select font size (8-200)",
+          )}
+          colorLabel={translate("text.colorLabel", "Text colour")}
           onAnyChange={() => {
             setPlacementManuallyPaused(false);
             lastAppliedPlacementKey.current = null;
             // Directly activate placement on text changes
-            if (typeof window !== 'undefined') {
-              window.setTimeout(() => onActivateSignaturePlacement?.(), PLACEMENT_ACTIVATION_DELAY);
+            if (typeof window !== "undefined") {
+              window.setTimeout(
+                () => onActivateSignaturePlacement?.(),
+                PLACEMENT_ACTIVATION_DELAY,
+              );
             } else {
               onActivateSignaturePlacement?.();
             }
           }}
         />
-        {renderSaveButtonRow('text', hasTextSignature, handleSaveTextSignature)}
+        {renderSaveButtonRow("text", hasTextSignature, handleSaveTextSignature)}
       </Stack>
     );
   };
 
   const placementInstructions = () => {
-    if (signatureSource === 'saved') {
+    if (signatureSource === "saved") {
       return translate(
-        'instructions.saved',
-        'Select a saved signature above, then click anywhere on the PDF to place it.'
+        "instructions.saved",
+        "Select a saved signature above, then click anywhere on the PDF to place it.",
       );
     }
-    if (parameters.signatureType === 'canvas') {
+    if (parameters.signatureType === "canvas") {
       return translate(
-        'instructions.canvas',
-        'After drawing your signature and closing the canvas, click anywhere on the PDF to place it.'
+        "instructions.canvas",
+        "After drawing your signature and closing the canvas, click anywhere on the PDF to place it.",
       );
     }
-    if (parameters.signatureType === 'image') {
+    if (parameters.signatureType === "image") {
       return translate(
-        'instructions.image',
-        'After uploading your signature image, click anywhere on the PDF to place it.'
+        "instructions.image",
+        "After uploading your signature image, click anywhere on the PDF to place it.",
       );
     }
     return translate(
-      'instructions.text',
-      'After entering your name above, click anywhere on the PDF to place your signature.'
+      "instructions.text",
+      "After entering your name above, click anywhere on the PDF to place your signature.",
     );
   };
 
   const placementAlert = isCurrentTypeReady
     ? {
-        color: isPlacementMode ? 'blue' : 'teal',
+        color: isPlacementMode ? "blue" : "teal",
         title: isPlacementMode
-          ? translate('instructions.title', 'How to add your signature')
-          : translate('instructions.paused', 'Placement paused'),
+          ? translate("instructions.title", "How to add your signature")
+          : translate("instructions.paused", "Placement paused"),
         message: isPlacementMode
           ? placementInstructions()
-          : translate('instructions.resumeHint', 'Resume placement to click and add your signature.'),
+          : translate(
+              "instructions.resumeHint",
+              "Resume placement to click and add your signature.",
+            ),
       }
     : {
-        color: 'yellow',
-        title: translate('instructions.title', 'How to add your signature'),
-        message: translate('instructions.noSignature', 'Create a signature above to enable placement tools.'),
+        color: "yellow",
+        title: translate("instructions.title", "How to add your signature"),
+        message: translate(
+          "instructions.noSignature",
+          "Create a signature above to enable placement tools.",
+        ),
       };
 
   const handlePausePlacement = () => {
@@ -925,7 +1105,7 @@ const SignSettings = ({
     if (!isCurrentTypeReady) return;
 
     const handleKeyDown = (e: KeyboardEvent) => {
-      if (e.key === 'Escape') {
+      if (e.key === "Escape") {
         e.preventDefault();
         if (isPlacementMode) {
           handlePausePlacement();
@@ -935,72 +1115,77 @@ const SignSettings = ({
       }
     };
 
-    window.addEventListener('keydown', handleKeyDown);
-    return () => window.removeEventListener('keydown', handleKeyDown);
+    window.addEventListener("keydown", handleKeyDown);
+    return () => window.removeEventListener("keydown", handleKeyDown);
   }, [isCurrentTypeReady, isPlacementMode, isPlacementManuallyPaused]);
 
   const placementToggleControl =
-    onActivateSignaturePlacement || onDeactivateSignature
-      ? isPlacementMode
-        ? (
-            <Tooltip label={translate('mode.pause', 'Pause placement')}>
-              <ActionIcon
-                variant="default"
-                size="lg"
-                aria-label={translate('mode.pause', 'Pause placement')}
-                onClick={handlePausePlacement}
-                disabled={disabled || !onDeactivateSignature}
-                style={{
-                  width: 'auto',
-                  paddingInline: '0.75rem',
-                  display: 'inline-flex',
-                  alignItems: 'center',
-                  gap: '0.4rem',
-                }}
-              >
-                <LocalIcon icon="pause-rounded" width={20} height={20} />
-                <Text component="span" size="sm" fw={500}>
-                  {translate('mode.pause', 'Pause placement')}
-                </Text>
-              </ActionIcon>
-            </Tooltip>
-          )
-        : (
-            <Tooltip label={translate('mode.resume', 'Resume placement')}>
-              <ActionIcon
-                variant="default"
-                size="lg"
-                aria-label={translate('mode.resume', 'Resume placement')}
-                onClick={handleResumePlacement}
-                disabled={disabled || !isCurrentTypeReady || !onActivateSignaturePlacement}
-                style={{
-                  width: 'auto',
-                  paddingInline: '0.75rem',
-                  display: 'inline-flex',
-                  alignItems: 'center',
-                  gap: '0.4rem',
-                }}
-              >
-                <LocalIcon icon="play-arrow-rounded" width={20} height={20} />
-                <Text component="span" size="sm" fw={500}>
-                  {translate('mode.resume', 'Resume placement')}
-                </Text>
-              </ActionIcon>
-            </Tooltip>
-          )
-      : null;
+    onActivateSignaturePlacement || onDeactivateSignature ? (
+      isPlacementMode ? (
+        <Tooltip label={translate("mode.pause", "Pause placement")}>
+          <ActionIcon
+            variant="default"
+            size="lg"
+            aria-label={translate("mode.pause", "Pause placement")}
+            onClick={handlePausePlacement}
+            disabled={disabled || !onDeactivateSignature}
+            style={{
+              width: "auto",
+              paddingInline: "0.75rem",
+              display: "inline-flex",
+              alignItems: "center",
+              gap: "0.4rem",
+            }}
+          >
+            <LocalIcon icon="pause-rounded" width={20} height={20} />
+            <Text component="span" size="sm" fw={500}>
+              {translate("mode.pause", "Pause placement")}
+            </Text>
+          </ActionIcon>
+        </Tooltip>
+      ) : (
+        <Tooltip label={translate("mode.resume", "Resume placement")}>
+          <ActionIcon
+            variant="default"
+            size="lg"
+            aria-label={translate("mode.resume", "Resume placement")}
+            onClick={handleResumePlacement}
+            disabled={
+              disabled || !isCurrentTypeReady || !onActivateSignaturePlacement
+            }
+            style={{
+              width: "auto",
+              paddingInline: "0.75rem",
+              display: "inline-flex",
+              alignItems: "center",
+              gap: "0.4rem",
+            }}
+          >
+            <LocalIcon icon="play-arrow-rounded" width={20} height={20} />
+            <Text component="span" size="sm" fw={500}>
+              {translate("mode.resume", "Resume placement")}
+            </Text>
+          </ActionIcon>
+        </Tooltip>
+      )
+    ) : null;
 
   return (
     <Stack>
       <Stack gap="sm">
         <Text size="sm" c="dimmed">
-          {translate('step.createDesc', 'Choose how you want to create the signature')}
+          {translate(
+            "step.createDesc",
+            "Choose how you want to create the signature",
+          )}
         </Text>
         {sourceOptions.length > 1 && (
           <SegmentedControl
             value={signatureSource}
             fullWidth
-            onChange={(value) => handleSignatureSourceChange(value as SignatureSource)}
+            onChange={(value) =>
+              handleSignatureSourceChange(value as SignatureSource)
+            }
             data={sourceOptions}
           />
         )}
@@ -1011,10 +1196,10 @@ const SignSettings = ({
 
       <Stack gap="sm">
         <Text fw={600} size="md">
-          {translate('step.place', 'Place & save')}
+          {translate("step.place", "Place & save")}
         </Text>
         <Text size="sm" c="dimmed">
-          {translate('step.placeDesc', 'Position the signature on your PDF')}
+          {translate("step.placeDesc", "Position the signature on your PDF")}
         </Text>
 
         <Group gap="xs" wrap="nowrap" align="center">
@@ -1027,17 +1212,12 @@ const SignSettings = ({
             disabled={disabled}
             showPlaceButton={false}
           />
-          <Box style={{ marginLeft: 'auto' }}>
-            {placementToggleControl}
-          </Box>
+          <Box style={{ marginLeft: "auto" }}>{placementToggleControl}</Box>
         </Group>
 
         <Alert color={placementAlert.color} title={placementAlert.title}>
-          <Text size="sm">
-            {placementAlert.message}
-          </Text>
+          <Text size="sm">{placementAlert.message}</Text>
         </Alert>
-
       </Stack>
 
       <ColorPicker
@@ -1045,17 +1225,12 @@ const SignSettings = ({
         onClose={() => setIsColorPickerOpen(false)}
         selectedColor={selectedColor}
         onColorChange={setSelectedColor}
-        title={translate('canvas.colorPickerTitle', 'Choose stroke colour')}
+        title={translate("canvas.colorPickerTitle", "Choose stroke colour")}
       />
 
       {onSave && (
-        <Button
-          onClick={onSave}
-          color="blue"
-          variant="filled"
-          fullWidth
-        >
-          {translate('applySignatures', 'Apply Signatures')}
+        <Button onClick={onSave} color="blue" variant="filled" fullWidth>
+          {translate("applySignatures", "Apply Signatures")}
         </Button>
       )}
 
diff --git a/frontend/src/core/components/tools/singleLargePage/SingleLargePageSettings.tsx b/frontend/src/core/components/tools/singleLargePage/SingleLargePageSettings.tsx
index dbd9ccb1a8..59c31967b5 100644
--- a/frontend/src/core/components/tools/singleLargePage/SingleLargePageSettings.tsx
+++ b/frontend/src/core/components/tools/singleLargePage/SingleLargePageSettings.tsx
@@ -1,10 +1,13 @@
-import React from 'react';
-import { useTranslation } from 'react-i18next';
-import { SingleLargePageParameters } from '@app/hooks/tools/singleLargePage/useSingleLargePageParameters';
+import React from "react";
+import { useTranslation } from "react-i18next";
+import { SingleLargePageParameters } from "@app/hooks/tools/singleLargePage/useSingleLargePageParameters";
 
 interface SingleLargePageSettingsProps {
   parameters: SingleLargePageParameters;
-  onParameterChange: <K extends keyof SingleLargePageParameters>(parameter: K, value: SingleLargePageParameters[K]) => void;
+  onParameterChange: <K extends keyof SingleLargePageParameters>(
+    parameter: K,
+    value: SingleLargePageParameters[K],
+  ) => void;
   disabled?: boolean;
 }
 
@@ -14,7 +17,10 @@ const SingleLargePageSettings: React.FC<SingleLargePageSettingsProps> = (_) => {
   return (
     <div className="single-large-page-settings">
       <p className="text-muted">
-        {t('pdfToSinglePage.description', 'This tool will merge all pages of your PDF into one large single page. The width will remain the same as the original pages, but the height will be the sum of all page heights.')}
+        {t(
+          "pdfToSinglePage.description",
+          "This tool will merge all pages of your PDF into one large single page. The width will remain the same as the original pages, but the height will be the sum of all page heights.",
+        )}
       </p>
     </div>
   );
diff --git a/frontend/src/core/components/tools/split/SplitAutomationSettings.tsx b/frontend/src/core/components/tools/split/SplitAutomationSettings.tsx
index 7ae1971928..6effef8a1d 100644
--- a/frontend/src/core/components/tools/split/SplitAutomationSettings.tsx
+++ b/frontend/src/core/components/tools/split/SplitAutomationSettings.tsx
@@ -14,11 +14,18 @@ import { Z_INDEX_AUTOMATE_DROPDOWN } from "@app/styles/zIndex";
 
 interface SplitAutomationSettingsProps {
   parameters: SplitParameters;
-  onParameterChange: <K extends keyof SplitParameters>(key: K, value: SplitParameters[K]) => void;
+  onParameterChange: <K extends keyof SplitParameters>(
+    key: K,
+    value: SplitParameters[K],
+  ) => void;
   disabled?: boolean;
 }
 
-const SplitAutomationSettings = ({ parameters, onParameterChange, disabled = false }: SplitAutomationSettingsProps) => {
+const SplitAutomationSettings = ({
+  parameters,
+  onParameterChange,
+  disabled = false,
+}: SplitAutomationSettingsProps) => {
   const { t } = useTranslation();
 
   // Convert METHOD_OPTIONS to Select data format
@@ -38,10 +45,15 @@ const SplitAutomationSettings = ({ parameters, onParameterChange, disabled = fal
         label={t("split.steps.chooseMethod", "Choose Method")}
         placeholder={t("split.selectMethod", "Select a split method")}
         value={parameters.method}
-        onChange={(value) => onParameterChange('method', value as SplitMethod | null)}
+        onChange={(value) =>
+          onParameterChange("method", value as SplitMethod | null)
+        }
         data={methodSelectOptions}
         disabled={disabled}
-        comboboxProps={{ withinPortal: true, zIndex: Z_INDEX_AUTOMATE_DROPDOWN }}
+        comboboxProps={{
+          withinPortal: true,
+          zIndex: Z_INDEX_AUTOMATE_DROPDOWN,
+        }}
       />
 
       {/* Method-Specific Settings */}
diff --git a/frontend/src/core/components/tools/split/SplitSettings.tsx b/frontend/src/core/components/tools/split/SplitSettings.tsx
index ee33210c87..8c1832242a 100644
--- a/frontend/src/core/components/tools/split/SplitSettings.tsx
+++ b/frontend/src/core/components/tools/split/SplitSettings.tsx
@@ -1,20 +1,30 @@
-import { Stack, TextInput, Checkbox, Anchor, Text, Select } from '@mantine/core';
-import LocalIcon from '@app/components/shared/LocalIcon';
-import { useTranslation } from 'react-i18next';
-import { SPLIT_METHODS } from '@app/constants/splitConstants';
-import { SplitParameters } from '@app/hooks/tools/split/useSplitParameters';
+import {
+  Stack,
+  TextInput,
+  Checkbox,
+  Anchor,
+  Text,
+  Select,
+} from "@mantine/core";
+import LocalIcon from "@app/components/shared/LocalIcon";
+import { useTranslation } from "react-i18next";
+import { SPLIT_METHODS } from "@app/constants/splitConstants";
+import { SplitParameters } from "@app/hooks/tools/split/useSplitParameters";
 import { Z_INDEX_AUTOMATE_DROPDOWN } from "@app/styles/zIndex";
 
 export interface SplitSettingsProps {
   parameters: SplitParameters;
-  onParameterChange: <K extends keyof SplitParameters>(key: K, value: SplitParameters[K]) => void;
+  onParameterChange: <K extends keyof SplitParameters>(
+    key: K,
+    value: SplitParameters[K],
+  ) => void;
   disabled?: boolean;
 }
 
 const SplitSettings = ({
   parameters,
   onParameterChange,
-  disabled = false
+  disabled = false,
 }: SplitSettingsProps) => {
   const { t } = useTranslation();
 
@@ -23,7 +33,7 @@ const SplitSettings = ({
       label={t("split.splitPages", "Pages")}
       placeholder={t("pageSelectionPrompt", "e.g. 1,3,5-10")}
       value={parameters.pages}
-      onChange={(e) => onParameterChange('pages', e.target.value)}
+      onChange={(e) => onParameterChange("pages", e.target.value)}
       disabled={disabled}
     />
   );
@@ -36,8 +46,11 @@ const SplitSettings = ({
         min="0"
         max="300"
         value={parameters.hDiv}
-        onChange={(e) => onParameterChange('hDiv', e.target.value)}
-        placeholder={t("split-by-sections.horizontal.placeholder", "Enter number of horizontal divisions")}
+        onChange={(e) => onParameterChange("hDiv", e.target.value)}
+        placeholder={t(
+          "split-by-sections.horizontal.placeholder",
+          "Enter number of horizontal divisions",
+        )}
         disabled={disabled}
       />
       <TextInput
@@ -46,38 +59,79 @@ const SplitSettings = ({
         min="0"
         max="300"
         value={parameters.vDiv}
-        onChange={(e) => onParameterChange('vDiv', e.target.value)}
-        placeholder={t("split-by-sections.vertical.placeholder", "Enter number of vertical divisions")}
+        onChange={(e) => onParameterChange("vDiv", e.target.value)}
+        placeholder={t(
+          "split-by-sections.vertical.placeholder",
+          "Enter number of vertical divisions",
+        )}
         disabled={disabled}
       />
       <Select
         label={t("split-by-sections.splitMode.label", "Split Mode")}
-        value={parameters.splitMode || 'SPLIT_ALL'}
-        onChange={(value) => onParameterChange('splitMode', value || 'SPLIT_ALL')}
-        description={t("split-by-sections.splitMode.description", "Choose how to split the pages")}
+        value={parameters.splitMode || "SPLIT_ALL"}
+        onChange={(value) =>
+          onParameterChange("splitMode", value || "SPLIT_ALL")
+        }
+        description={t(
+          "split-by-sections.splitMode.description",
+          "Choose how to split the pages",
+        )}
         data={[
-          { value: 'SPLIT_ALL', label: t("split-by-sections.splitMode.splitAll", "Split all pages") },
-          { value: 'SPLIT_ALL_EXCEPT_FIRST', label: t("split-by-sections.splitMode.splitAllExceptFirst", "Split all except first") },
-          { value: 'SPLIT_ALL_EXCEPT_LAST', label: t("split-by-sections.splitMode.splitAllExceptLast", "Split all except last") },
-          { value: 'SPLIT_ALL_EXCEPT_FIRST_AND_LAST', label: t("split-by-sections.splitMode.splitAllExceptFirstAndLast", "Split all except first and last") },
-          { value: 'CUSTOM', label: t("split-by-sections.splitMode.custom", "Custom pages") },
+          {
+            value: "SPLIT_ALL",
+            label: t("split-by-sections.splitMode.splitAll", "Split all pages"),
+          },
+          {
+            value: "SPLIT_ALL_EXCEPT_FIRST",
+            label: t(
+              "split-by-sections.splitMode.splitAllExceptFirst",
+              "Split all except first",
+            ),
+          },
+          {
+            value: "SPLIT_ALL_EXCEPT_LAST",
+            label: t(
+              "split-by-sections.splitMode.splitAllExceptLast",
+              "Split all except last",
+            ),
+          },
+          {
+            value: "SPLIT_ALL_EXCEPT_FIRST_AND_LAST",
+            label: t(
+              "split-by-sections.splitMode.splitAllExceptFirstAndLast",
+              "Split all except first and last",
+            ),
+          },
+          {
+            value: "CUSTOM",
+            label: t("split-by-sections.splitMode.custom", "Custom pages"),
+          },
         ]}
         disabled={disabled}
-        comboboxProps={{ withinPortal: true, zIndex: Z_INDEX_AUTOMATE_DROPDOWN }}
+        comboboxProps={{
+          withinPortal: true,
+          zIndex: Z_INDEX_AUTOMATE_DROPDOWN,
+        }}
       />
-      {parameters.splitMode === 'CUSTOM' && (
+      {parameters.splitMode === "CUSTOM" && (
         <TextInput
-          label={t("split-by-sections.customPages.label", "Custom Page Numbers")}
-          placeholder={t("split-by-sections.customPages.placeholder", "e.g. 2,4,6")}
-          value={parameters.customPages || ''}
-          onChange={(e) => onParameterChange('customPages', e.target.value)}
+          label={t(
+            "split-by-sections.customPages.label",
+            "Custom Page Numbers",
+          )}
+          placeholder={t(
+            "split-by-sections.customPages.placeholder",
+            "e.g. 2,4,6",
+          )}
+          value={parameters.customPages || ""}
+          onChange={(e) => onParameterChange("customPages", e.target.value)}
           disabled={disabled}
         />
       )}
       <Checkbox
         label={t("split-by-sections.merge", "Merge sections into one PDF")}
         checked={parameters.merge}
-        onChange={(e) => onParameterChange('merge', e.currentTarget.checked)}
+        onChange={(e) => onParameterChange("merge", e.currentTarget.checked)}
         disabled={disabled}
       />
     </Stack>
@@ -101,7 +155,10 @@ const SplitSettings = ({
         break;
       default:
         label = t("split-by-size-or-count.value.label", "Split Value");
-        placeholder = t("split-by-size-or-count.value.placeholder", "e.g. 10MB or 5 pages");
+        placeholder = t(
+          "split-by-size-or-count.value.placeholder",
+          "e.g. 10MB or 5 pages",
+        );
     }
 
     return (
@@ -109,7 +166,7 @@ const SplitSettings = ({
         label={label}
         placeholder={placeholder}
         value={parameters.splitValue}
-        onChange={(e) => onParameterChange('splitValue', e.target.value)}
+        onChange={(e) => onParameterChange("splitValue", e.target.value)}
         disabled={disabled}
       />
     );
@@ -121,19 +178,26 @@ const SplitSettings = ({
         label={t("splitByChapters.bookmarkLevel", "Bookmark Level")}
         type="number"
         value={parameters.bookmarkLevel}
-        onChange={(e) => onParameterChange('bookmarkLevel', e.target.value)}
+        onChange={(e) => onParameterChange("bookmarkLevel", e.target.value)}
         disabled={disabled}
       />
       <Checkbox
         label={t("splitByChapters.includeMetadata", "Include Metadata")}
         checked={parameters.includeMetadata}
-        onChange={(e) => onParameterChange('includeMetadata', e.currentTarget.checked)}
+        onChange={(e) =>
+          onParameterChange("includeMetadata", e.currentTarget.checked)
+        }
         disabled={disabled}
       />
       <Checkbox
-        label={t("splitByChapters.allowDuplicates", "Allow Duplicate Bookmarks")}
+        label={t(
+          "splitByChapters.allowDuplicates",
+          "Allow Duplicate Bookmarks",
+        )}
         checked={parameters.allowDuplicates}
-        onChange={(e) => onParameterChange('allowDuplicates', e.currentTarget.checked)}
+        onChange={(e) =>
+          onParameterChange("allowDuplicates", e.currentTarget.checked)
+        }
         disabled={disabled}
       />
     </Stack>
@@ -145,16 +209,24 @@ const SplitSettings = ({
         href="https://stirlingpdf.io/files/Auto%20Splitter%20Divider%20(with%20instructions).pdf"
         target="_blank"
         size="sm"
-        style={{ display: 'flex', alignItems: 'center', gap: '0.5rem' }}
+        style={{ display: "flex", alignItems: "center", gap: "0.5rem" }}
       >
         <LocalIcon icon="download-rounded" width="2rem" height="2rem" />
-        {t("autoSplitPDF.dividerDownload2", "Download 'Auto Splitter Divider (with instructions).pdf'")}
+        {t(
+          "autoSplitPDF.dividerDownload2",
+          "Download 'Auto Splitter Divider (with instructions).pdf'",
+        )}
       </Anchor>
 
       <Checkbox
-        label={t("autoSplitPDF.duplexMode", "Duplex Mode (Front and back scanning)")}
+        label={t(
+          "autoSplitPDF.duplexMode",
+          "Duplex Mode (Front and back scanning)",
+        )}
         checked={parameters.duplexMode}
-        onChange={(e) => onParameterChange('duplexMode', e.currentTarget.checked)}
+        onChange={(e) =>
+          onParameterChange("duplexMode", e.currentTarget.checked)
+        }
         disabled={disabled}
       />
     </Stack>
@@ -164,46 +236,60 @@ const SplitSettings = ({
     <Stack gap="sm">
       <Select
         label={t("split.poster.pageSize.label", "Target Page Size")}
-        description={t("split.poster.pageSize.description", "Size of output pages for printing")}
-        value={parameters.pageSize || 'A4'}
-        onChange={(value) => onParameterChange('pageSize', value || 'A4')}
+        description={t(
+          "split.poster.pageSize.description",
+          "Size of output pages for printing",
+        )}
+        value={parameters.pageSize || "A4"}
+        onChange={(value) => onParameterChange("pageSize", value || "A4")}
         data={[
-          { value: 'A4', label: 'A4 (210 × 297 mm)' },
-          { value: 'Letter', label: 'Letter (8.5 × 11 in)' },
-          { value: 'A3', label: 'A3 (297 × 420 mm)' },
-          { value: 'A5', label: 'A5 (148 × 210 mm)' },
-          { value: 'Legal', label: 'Legal (8.5 × 14 in)' },
-          { value: 'Tabloid', label: 'Tabloid (11 × 17 in)' },
+          { value: "A4", label: "A4 (210 × 297 mm)" },
+          { value: "Letter", label: "Letter (8.5 × 11 in)" },
+          { value: "A3", label: "A3 (297 × 420 mm)" },
+          { value: "A5", label: "A5 (148 × 210 mm)" },
+          { value: "Legal", label: "Legal (8.5 × 14 in)" },
+          { value: "Tabloid", label: "Tabloid (11 × 17 in)" },
         ]}
         disabled={disabled}
-        comboboxProps={{ withinPortal: true, zIndex: Z_INDEX_AUTOMATE_DROPDOWN }}
+        comboboxProps={{
+          withinPortal: true,
+          zIndex: Z_INDEX_AUTOMATE_DROPDOWN,
+        }}
       />
       <TextInput
         label={t("split.poster.xFactor.label", "Horizontal Divisions")}
-        description={t("split.poster.xFactor.description", "Number of columns to split each page into")}
+        description={t(
+          "split.poster.xFactor.description",
+          "Number of columns to split each page into",
+        )}
         type="number"
         min="1"
         max="10"
         value={parameters.xFactor || 2}
-        onChange={(e) => onParameterChange('xFactor', e.target.value)}
+        onChange={(e) => onParameterChange("xFactor", e.target.value)}
         placeholder="2"
         disabled={disabled}
       />
       <TextInput
         label={t("split.poster.yFactor.label", "Vertical Divisions")}
-        description={t("split.poster.yFactor.description", "Number of rows to split each page into")}
+        description={t(
+          "split.poster.yFactor.description",
+          "Number of rows to split each page into",
+        )}
         type="number"
         min="1"
         max="10"
         value={parameters.yFactor || 2}
-        onChange={(e) => onParameterChange('yFactor', e.target.value)}
+        onChange={(e) => onParameterChange("yFactor", e.target.value)}
         placeholder="2"
         disabled={disabled}
       />
       <Checkbox
         label={t("split.poster.rightToLeft", "Split right-to-left")}
         checked={parameters.rightToLeft || false}
-        onChange={(e) => onParameterChange('rightToLeft', e.currentTarget.checked)}
+        onChange={(e) =>
+          onParameterChange("rightToLeft", e.currentTarget.checked)
+        }
         disabled={disabled}
       />
     </Stack>
@@ -214,7 +300,10 @@ const SplitSettings = ({
     return (
       <Stack gap="sm">
         <Text c="dimmed" ta="center">
-          {t("split.settings.selectMethodFirst", "Please select a split method first")}
+          {t(
+            "split.settings.selectMethodFirst",
+            "Please select a split method first",
+          )}
         </Text>
       </Stack>
     );
@@ -224,12 +313,16 @@ const SplitSettings = ({
     <Stack gap="md">
       {/* Method-Specific Form */}
       {parameters.method === SPLIT_METHODS.BY_PAGES && renderByPagesForm()}
-      {parameters.method === SPLIT_METHODS.BY_SECTIONS && renderBySectionsForm()}
+      {parameters.method === SPLIT_METHODS.BY_SECTIONS &&
+        renderBySectionsForm()}
       {(parameters.method === SPLIT_METHODS.BY_SIZE ||
         parameters.method === SPLIT_METHODS.BY_PAGE_COUNT ||
-        parameters.method === SPLIT_METHODS.BY_DOC_COUNT) && renderSplitValueForm()}
-      {parameters.method === SPLIT_METHODS.BY_CHAPTERS && renderByChaptersForm()}
-      {parameters.method === SPLIT_METHODS.BY_PAGE_DIVIDER && renderByPageDividerForm()}
+        parameters.method === SPLIT_METHODS.BY_DOC_COUNT) &&
+        renderSplitValueForm()}
+      {parameters.method === SPLIT_METHODS.BY_CHAPTERS &&
+        renderByChaptersForm()}
+      {parameters.method === SPLIT_METHODS.BY_PAGE_DIVIDER &&
+        renderByPageDividerForm()}
       {parameters.method === SPLIT_METHODS.BY_POSTER && renderByPosterForm()}
     </Stack>
   );
diff --git a/frontend/src/core/components/tools/timestampPdf/TimestampPdfSettings.tsx b/frontend/src/core/components/tools/timestampPdf/TimestampPdfSettings.tsx
index 55eb923961..167eb37cfd 100644
--- a/frontend/src/core/components/tools/timestampPdf/TimestampPdfSettings.tsx
+++ b/frontend/src/core/components/tools/timestampPdf/TimestampPdfSettings.tsx
@@ -11,7 +11,7 @@ interface TimestampPdfSettingsProps {
   parameters: TimestampPdfParameters;
   onParameterChange: <K extends keyof TimestampPdfParameters>(
     key: K,
-    value: TimestampPdfParameters[K]
+    value: TimestampPdfParameters[K],
   ) => void;
   disabled?: boolean;
 }
@@ -31,7 +31,7 @@ const TimestampPdfSettings = ({
   // Build dropdown: presets + admin custom URLs, deduplicated (TASK-9)
   const presetUrls = new Set(presets.map((p) => p.url));
   const adminCustomUrls = (config?.timestampCustomTsaUrls ?? []).filter(
-    (url) => !presetUrls.has(url)
+    (url) => !presetUrls.has(url),
   );
   const selectData = [
     ...presets.map((preset) => ({ value: preset.url, label: preset.label })),
@@ -59,18 +59,20 @@ const TimestampPdfSettings = ({
         label={t("timestampPdf.options.tsaUrl.label", "Select a TSA server")}
         description={t(
           "timestampPdf.options.tsaUrl.desc",
-          "Pick a trusted Time Stamp Authority"
+          "Pick a trusted Time Stamp Authority",
         )}
         data={selectData}
         value={parameters.tsaUrl}
-        onChange={(value) => onParameterChange("tsaUrl", value ?? presets[0].url)}
+        onChange={(value) =>
+          onParameterChange("tsaUrl", value ?? presets[0].url)
+        }
         disabled={disabled}
       />
 
       <Text size="xs" c="dimmed">
         {t(
           "timestampPdf.options.note",
-          "Only a SHA-256 hash of your document is sent to the TSA server; the PDF file itself is never sent to the TSA server."
+          "Only a SHA-256 hash of your document is sent to the TSA server; the PDF file itself is never sent to the TSA server.",
         )}
       </Text>
     </Stack>
diff --git a/frontend/src/core/components/tools/toolPicker/FavoriteStar.tsx b/frontend/src/core/components/tools/toolPicker/FavoriteStar.tsx
index c0f7e8af9e..d951951421 100644
--- a/frontend/src/core/components/tools/toolPicker/FavoriteStar.tsx
+++ b/frontend/src/core/components/tools/toolPicker/FavoriteStar.tsx
@@ -2,8 +2,8 @@ import React from "react";
 import { ActionIcon } from "@mantine/core";
 import type { MantineSize } from "@mantine/core";
 import { useTranslation } from "react-i18next";
-import StarRoundedIcon from '@mui/icons-material/StarRounded';
-import StarBorderRoundedIcon from '@mui/icons-material/StarBorderRounded';
+import StarRoundedIcon from "@mui/icons-material/StarRounded";
+import StarBorderRoundedIcon from "@mui/icons-material/StarBorderRounded";
 
 interface FavoriteStarProps {
   isFavorite: boolean;
@@ -12,7 +12,12 @@ interface FavoriteStarProps {
   size?: MantineSize;
 }
 
-const FavoriteStar: React.FC<FavoriteStarProps> = ({ isFavorite, onToggle, className, size = "xs" }) => {
+const FavoriteStar: React.FC<FavoriteStarProps> = ({
+  isFavorite,
+  onToggle,
+  className,
+  size = "xs",
+}) => {
   const { t } = useTranslation();
 
   return (
@@ -32,17 +37,25 @@ const FavoriteStar: React.FC<FavoriteStarProps> = ({ isFavorite, onToggle, class
         e.stopPropagation();
       }}
       className={className}
-      aria-label={isFavorite ? t('toolPanel.fullscreen.unfavorite', 'Remove from favourites') : t('toolPanel.fullscreen.favorite', 'Add to favourites')}
+      aria-label={
+        isFavorite
+          ? t("toolPanel.fullscreen.unfavorite", "Remove from favourites")
+          : t("toolPanel.fullscreen.favorite", "Add to favourites")
+      }
     >
       {isFavorite ? (
-        <StarRoundedIcon fontSize="inherit" style={{ color: 'var(--special-color-favorites)', fontSize: '1rem' }} />
+        <StarRoundedIcon
+          fontSize="inherit"
+          style={{ color: "var(--special-color-favorites)", fontSize: "1rem" }}
+        />
       ) : (
-        <StarBorderRoundedIcon fontSize="inherit" style={{ fontSize: '1rem' }} />
+        <StarBorderRoundedIcon
+          fontSize="inherit"
+          style={{ fontSize: "1rem" }}
+        />
       )}
     </ActionIcon>
   );
 };
 
 export default FavoriteStar;
-
-
diff --git a/frontend/src/core/components/tools/toolPicker/ToolButton.tsx b/frontend/src/core/components/tools/toolPicker/ToolButton.tsx
index 6202a6af8c..1983163360 100644
--- a/frontend/src/core/components/tools/toolPicker/ToolButton.tsx
+++ b/frontend/src/core/components/tools/toolPicker/ToolButton.tsx
@@ -12,7 +12,10 @@ import HotkeyDisplay from "@app/components/hotkeys/HotkeyDisplay";
 import FavoriteStar from "@app/components/tools/toolPicker/FavoriteStar";
 import { useToolWorkflow } from "@app/contexts/ToolWorkflowContext";
 import type { ToolId } from "@app/types/toolId";
-import { getToolDisabledReason, getDisabledLabel } from "@app/components/tools/fullscreen/shared";
+import {
+  getToolDisabledReason,
+  getDisabledLabel,
+} from "@app/components/tools/fullscreen/shared";
 import { useAppConfig } from "@app/contexts/AppConfigContext";
 import { CloudBadge } from "@app/components/shared/CloudBadge";
 import { useWillUseCloud } from "@app/hooks/useWillUseCloud";
@@ -30,16 +33,34 @@ interface ToolButtonProps {
   onUnavailableClick?: () => void;
 }
 
-const ToolButton: React.FC<ToolButtonProps> = ({ id, tool, isSelected, onSelect, disableNavigation = false, matchedSynonym, hasStars = false, onUnavailableClick }) => {
+const ToolButton: React.FC<ToolButtonProps> = ({
+  id,
+  tool,
+  isSelected,
+  onSelect,
+  disableNavigation = false,
+  matchedSynonym,
+  hasStars = false,
+  onUnavailableClick,
+}) => {
   const { t } = useTranslation();
   const { config } = useAppConfig();
   const premiumEnabled = config?.premiumEnabled;
   const { isFavorite, toggleFavorite, toolAvailability } = useToolWorkflow();
-  const disabledReason = getToolDisabledReason(id, tool, toolAvailability, premiumEnabled);
+  const disabledReason = getToolDisabledReason(
+    id,
+    tool,
+    toolAvailability,
+    premiumEnabled,
+  );
   const isUnavailable = disabledReason !== null;
   // If onUnavailableClick is provided for a non-comingSoon tool, render as "cloud-available":
   // full opacity, cloud badge, normal tooltip — clicking still fires onUnavailableClick (e.g. sign-in).
-  const showAsCloudAvailable = isUnavailable && !!onUnavailableClick && disabledReason !== 'comingSoon' && disabledReason !== 'selfHostedOffline';
+  const showAsCloudAvailable =
+    isUnavailable &&
+    !!onUnavailableClick &&
+    disabledReason !== "comingSoon" &&
+    disabledReason !== "selfHostedOffline";
   const visuallyUnavailable = isUnavailable && !showAsCloudAvailable;
   const { hotkeys } = useHotkeys();
   const binding = hotkeys[id];
@@ -48,7 +69,8 @@ const ToolButton: React.FC<ToolButtonProps> = ({ id, tool, isSelected, onSelect,
 
   // Check if this tool will route to SaaS backend (desktop only)
   const rawEndpoint = tool.operationConfig?.endpoint;
-  const endpointString = typeof rawEndpoint === 'string' ? rawEndpoint : undefined;
+  const endpointString =
+    typeof rawEndpoint === "string" ? rawEndpoint : undefined;
   const usesCloud = useWillUseCloud(endpointString);
 
   const handleClick = (id: ToolId) => {
@@ -58,7 +80,7 @@ const ToolButton: React.FC<ToolButtonProps> = ({ id, tool, isSelected, onSelect,
     }
     if (tool.link) {
       // Open external link in new tab
-      window.open(tool.link, '_blank', 'noopener,noreferrer');
+      window.open(tool.link, "_blank", "noopener,noreferrer");
       return;
     }
     // Normal tool selection
@@ -66,67 +88,108 @@ const ToolButton: React.FC<ToolButtonProps> = ({ id, tool, isSelected, onSelect,
   };
 
   // Get navigation props for URL support (only if navigation is not disabled)
-  const navProps = !isUnavailable && !tool.link && !disableNavigation ? getToolNavigation(id, tool) : null;
+  const navProps =
+    !isUnavailable && !tool.link && !disableNavigation
+      ? getToolNavigation(id, tool)
+      : null;
 
-  const { key: disabledKey, fallback: disabledFallback } = getDisabledLabel(disabledReason);
+  const { key: disabledKey, fallback: disabledFallback } =
+    getDisabledLabel(disabledReason);
   const disabledMessage = t(disabledKey, disabledFallback);
 
-  const tooltipContent = visuallyUnavailable
-    ? (<span><strong>{disabledMessage}</strong> {tool.description}</span>)
-    : (
-      <div style={{ display: 'flex', flexDirection: 'column', gap: '0.35rem' }}>
-        <span>{tool.description}</span>
-        <div style={{ display: 'flex', alignItems: 'center', gap: '0.5rem', fontSize: '0.75rem' }}>
+  const tooltipContent = visuallyUnavailable ? (
+    <span>
+      <strong>{disabledMessage}</strong> {tool.description}
+    </span>
+  ) : (
+    <div style={{ display: "flex", flexDirection: "column", gap: "0.35rem" }}>
+      <span>{tool.description}</span>
+      <div
+        style={{
+          display: "flex",
+          alignItems: "center",
+          gap: "0.5rem",
+          fontSize: "0.75rem",
+        }}
+      >
         {binding ? (
           <>
-            <span style={{ color: 'var(--mantine-color-dimmed)', fontWeight: 500 }}>{t('settings.hotkeys.shortcut', 'Shortcut')}</span>
+            <span
+              style={{ color: "var(--mantine-color-dimmed)", fontWeight: 500 }}
+            >
+              {t("settings.hotkeys.shortcut", "Shortcut")}
+            </span>
             <HotkeyDisplay binding={binding} />
           </>
         ) : (
-          <span style={{ color: 'var(--mantine-color-dimmed)', fontWeight: 500, fontStyle: 'italic' }}>{t('settings.hotkeys.noShortcut', 'No shortcut set')}</span>
+          <span
+            style={{
+              color: "var(--mantine-color-dimmed)",
+              fontWeight: 500,
+              fontStyle: "italic",
+            }}
+          >
+            {t("settings.hotkeys.noShortcut", "No shortcut set")}
+          </span>
         )}
-        </div>
       </div>
-    );
+    </div>
+  );
 
   const buttonContent = (
     <>
-      <ToolIcon
-        icon={tool.icon}
-        opacity={visuallyUnavailable ? 0.25 : 1}
-      />
-      <div style={{ display: 'flex', flexDirection: 'column', alignItems: 'flex-start', flex: 1, overflow: 'visible' }}>
-        <div style={{ display: 'flex', alignItems: 'center', gap: '0.5rem', width: '100%' }}>
+      <ToolIcon icon={tool.icon} opacity={visuallyUnavailable ? 0.25 : 1} />
+      <div
+        style={{
+          display: "flex",
+          flexDirection: "column",
+          alignItems: "flex-start",
+          flex: 1,
+          overflow: "visible",
+        }}
+      >
+        <div
+          style={{
+            display: "flex",
+            alignItems: "center",
+            gap: "0.5rem",
+            width: "100%",
+          }}
+        >
           <FitText
             text={tool.name}
             lines={1}
             minimumFontScale={0.8}
             as="span"
-            style={{ display: 'inline-block', maxWidth: '100%', opacity: visuallyUnavailable ? 0.25 : 1 }}
+            style={{
+              display: "inline-block",
+              maxWidth: "100%",
+              opacity: visuallyUnavailable ? 0.25 : 1,
+            }}
           />
-          {tool.versionStatus === 'alpha' && (
+          {tool.versionStatus === "alpha" && (
             <Badge
               size="xs"
               variant="light"
               color="orange"
               style={{ flexShrink: 0, opacity: visuallyUnavailable ? 0.25 : 1 }}
             >
-              {t('toolPanel.alpha', 'Alpha')}
+              {t("toolPanel.alpha", "Alpha")}
             </Badge>
           )}
-          {(usesCloud && !visuallyUnavailable) && (
-            <CloudBadge />
-          )}
+          {usesCloud && !visuallyUnavailable && <CloudBadge />}
         </div>
         {matchedSynonym && (
-          <span style={{
-            fontSize: '0.75rem',
-            color: 'var(--mantine-color-dimmed)',
-            opacity: visuallyUnavailable ? 0.25 : 1,
-            marginTop: '1px',
-            overflow: 'visible',
-            whiteSpace: 'nowrap'
-          }}>
+          <span
+            style={{
+              fontSize: "0.75rem",
+              color: "var(--mantine-color-dimmed)",
+              opacity: visuallyUnavailable ? 0.25 : 1,
+              marginTop: "1px",
+              overflow: "visible",
+              whiteSpace: "nowrap",
+            }}
+          >
             {matchedSynonym}
           </span>
         )}
@@ -155,9 +218,9 @@ const ToolButton: React.FC<ToolButtonProps> = ({ id, tool, isSelected, onSelect,
         root: {
           borderRadius: 0,
           color: "var(--tools-text-and-icon-color)",
-          overflow: 'visible'
+          overflow: "visible",
         },
-        label: { overflow: 'visible' }
+        label: { overflow: "visible" },
       }}
     >
       {buttonContent}
@@ -181,9 +244,9 @@ const ToolButton: React.FC<ToolButtonProps> = ({ id, tool, isSelected, onSelect,
         root: {
           borderRadius: 0,
           color: "var(--tools-text-and-icon-color)",
-          overflow: 'visible'
+          overflow: "visible",
         },
-        label: { overflow: 'visible' }
+        label: { overflow: "visible" },
       }}
     >
       {buttonContent}
@@ -204,29 +267,35 @@ const ToolButton: React.FC<ToolButtonProps> = ({ id, tool, isSelected, onSelect,
         root: {
           borderRadius: 0,
           color: "var(--tools-text-and-icon-color)",
-          cursor: visuallyUnavailable ? 'not-allowed' : undefined,
-          overflow: 'visible'
+          cursor: visuallyUnavailable ? "not-allowed" : undefined,
+          overflow: "visible",
         },
-        label: { overflow: 'visible' }
+        label: { overflow: "visible" },
       }}
     >
       {buttonContent}
     </Button>
   );
 
-  const star = hasStars && !visuallyUnavailable ? (
-    <FavoriteStar
-      isFavorite={fav}
-      onToggle={() => toggleFavorite(id as ToolId)}
-      className="tool-button-star"
-      size="xs"
-    />
-  ) : null;
+  const star =
+    hasStars && !visuallyUnavailable ? (
+      <FavoriteStar
+        isFavorite={fav}
+        onToggle={() => toggleFavorite(id as ToolId)}
+        className="tool-button-star"
+        size="xs"
+      />
+    ) : null;
 
   return (
     <div className="tool-button-container">
       {star}
-      <Tooltip content={tooltipContent} position="right" arrow={true} delay={500}>
+      <Tooltip
+        content={tooltipContent}
+        position="right"
+        arrow={true}
+        delay={500}
+      >
         {buttonElement}
       </Tooltip>
     </div>
diff --git a/frontend/src/core/components/tools/toolPicker/ToolPicker.css b/frontend/src/core/components/tools/toolPicker/ToolPicker.css
index b88215471a..a7b73bee54 100644
--- a/frontend/src/core/components/tools/toolPicker/ToolPicker.css
+++ b/frontend/src/core/components/tools/toolPicker/ToolPicker.css
@@ -63,7 +63,7 @@
 }
 
 .tool-button .mantine-Button-label {
-  font-size: .85rem;
+  font-size: 0.85rem;
 }
 
 .tool-button-icon {
diff --git a/frontend/src/core/components/tools/toolPicker/ToolSearch.tsx b/frontend/src/core/components/tools/toolPicker/ToolSearch.tsx
index 00c6de54d2..b2a2c01e91 100644
--- a/frontend/src/core/components/tools/toolPicker/ToolSearch.tsx
+++ b/frontend/src/core/components/tools/toolPicker/ToolSearch.tsx
@@ -1,7 +1,7 @@
 import { useState, useRef, useEffect, useMemo } from "react";
 import { Stack, Button, Text } from "@mantine/core";
 import { useTranslation } from "react-i18next";
-import LocalIcon from '@app/components/shared/LocalIcon';
+import LocalIcon from "@app/components/shared/LocalIcon";
 import { ToolRegistryEntry } from "@app/data/toolsTaxonomy";
 import { TextInput } from "@app/components/shared/TextInput";
 import "@app/components/tools/toolPicker/ToolPicker.css";
@@ -40,12 +40,14 @@ const ToolSearch = ({
 
   const filteredTools = useMemo(() => {
     if (!value.trim()) return [];
-    const entries = Object.entries(toolRegistry).filter(([id]) => !(mode === "dropdown" && id === selectedToolKey));
+    const entries = Object.entries(toolRegistry).filter(
+      ([id]) => !(mode === "dropdown" && id === selectedToolKey),
+    );
     const ranked = rankByFuzzy(entries, value, [
       ([key]) => idToWords(key),
       ([, v]) => v.name,
       ([, v]) => v.description,
-      ([, v]) => v.synonyms?.join(' ') || '',
+      ([, v]) => v.synonyms?.join(" ") || "",
     ]).slice(0, 6);
     return ranked.map(({ item: [id, tool] }) => ({ id, tool }));
   }, [value, toolRegistry, mode, selectedToolKey]);
@@ -53,7 +55,9 @@ const ToolSearch = ({
   const handleSearchChange = (searchValue: string) => {
     onChange(searchValue);
     if (mode === "dropdown") {
-      setDropdownOpen(searchValue.trim().length > 0 && filteredTools.length > 0);
+      setDropdownOpen(
+        searchValue.trim().length > 0 && filteredTools.length > 0,
+      );
     }
   };
 
@@ -82,17 +86,23 @@ const ToolSearch = ({
   }, [autoFocus]);
 
   const searchInput = (
-      <TextInput
-        id="tool-search-input"
-        name="tool-search-input"
-        ref={searchRef}
-        value={value}
-        onChange={handleSearchChange}
-        placeholder={placeholder || t("toolPicker.searchPlaceholder", "Search tools...")}
-        icon={hideIcon ? undefined : <LocalIcon icon="search-rounded" width="1.5rem" height="1.5rem" />}
-        autoComplete="off"
-        onFocus={onFocus}
-      />
+    <TextInput
+      id="tool-search-input"
+      name="tool-search-input"
+      ref={searchRef}
+      value={value}
+      onChange={handleSearchChange}
+      placeholder={
+        placeholder || t("toolPicker.searchPlaceholder", "Search tools...")
+      }
+      icon={
+        hideIcon ? undefined : (
+          <LocalIcon icon="search-rounded" width="1.5rem" height="1.5rem" />
+        )
+      }
+      autoComplete="off"
+      onFocus={onFocus}
+    />
   );
 
   if (mode === "filter") {
@@ -132,7 +142,11 @@ const ToolSearch = ({
                   onToolSelect?.(id as ToolId);
                   setDropdownOpen(false);
                 }}
-                leftSection={<div style={{ color: "var(--tools-text-and-icon-color)" }}>{tool.icon}</div>}
+                leftSection={
+                  <div style={{ color: "var(--tools-text-and-icon-color)" }}>
+                    {tool.icon}
+                  </div>
+                }
                 fullWidth
                 justify="flex-start"
                 style={{
diff --git a/frontend/src/core/components/tools/unlockPdfForms/UnlockPdfFormsSettings.tsx b/frontend/src/core/components/tools/unlockPdfForms/UnlockPdfFormsSettings.tsx
index d1eea7debe..69563c3eb9 100644
--- a/frontend/src/core/components/tools/unlockPdfForms/UnlockPdfFormsSettings.tsx
+++ b/frontend/src/core/components/tools/unlockPdfForms/UnlockPdfFormsSettings.tsx
@@ -1,10 +1,13 @@
-import React from 'react';
-import { useTranslation } from 'react-i18next';
-import { UnlockPdfFormsParameters } from '@app/hooks/tools/unlockPdfForms/useUnlockPdfFormsParameters';
+import React from "react";
+import { useTranslation } from "react-i18next";
+import { UnlockPdfFormsParameters } from "@app/hooks/tools/unlockPdfForms/useUnlockPdfFormsParameters";
 
 interface UnlockPdfFormsSettingsProps {
   parameters: UnlockPdfFormsParameters;
-  onParameterChange: <K extends keyof UnlockPdfFormsParameters>(parameter: K, value: UnlockPdfFormsParameters[K]) => void;
+  onParameterChange: <K extends keyof UnlockPdfFormsParameters>(
+    parameter: K,
+    value: UnlockPdfFormsParameters[K],
+  ) => void;
   disabled?: boolean;
 }
 
@@ -14,7 +17,10 @@ const UnlockPdfFormsSettings: React.FC<UnlockPdfFormsSettingsProps> = (_) => {
   return (
     <div className="unlock-pdf-forms-settings">
       <p className="text-muted">
-        {t('unlockPDFForms.description', 'This tool will remove read-only restrictions from PDF form fields, making them editable and fillable.')}
+        {t(
+          "unlockPDFForms.description",
+          "This tool will remove read-only restrictions from PDF form fields, making them editable and fillable.",
+        )}
       </p>
     </div>
   );
diff --git a/frontend/src/core/components/tools/validateSignature/ValidateSignatureReportView.tsx b/frontend/src/core/components/tools/validateSignature/ValidateSignatureReportView.tsx
index 16e0b90a77..87880f7f78 100644
--- a/frontend/src/core/components/tools/validateSignature/ValidateSignatureReportView.tsx
+++ b/frontend/src/core/components/tools/validateSignature/ValidateSignatureReportView.tsx
@@ -1,34 +1,55 @@
-import React, { useMemo } from 'react';
-import { Badge, Group, Stack, Text, Divider } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import type { SignatureValidationReportData } from '@app/types/validateSignature';
-import '@app/components/tools/validateSignature/reportView/styles.css';
-import ThumbnailPreview from '@app/components/tools/validateSignature/reportView/ThumbnailPreview';
-import FileSummaryHeader from '@app/components/tools/validateSignature/reportView/FileSummaryHeader';
-import SignatureSection from '@app/components/tools/validateSignature/reportView/SignatureSection';
+import React, { useMemo } from "react";
+import { Badge, Group, Stack, Text, Divider } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import type { SignatureValidationReportData } from "@app/types/validateSignature";
+import "@app/components/tools/validateSignature/reportView/styles.css";
+import ThumbnailPreview from "@app/components/tools/validateSignature/reportView/ThumbnailPreview";
+import FileSummaryHeader from "@app/components/tools/validateSignature/reportView/FileSummaryHeader";
+import SignatureSection from "@app/components/tools/validateSignature/reportView/SignatureSection";
 
 interface ValidateSignatureReportViewProps {
   data: SignatureValidationReportData;
 }
 
-const NoSignatureSection = ({ message, label }: { message: string; label: string }) => (
-  <Stack align="center" justify="center" gap="xs" style={{ minHeight: 360, width: '100%' }}>
-    <Badge color="gray" variant="light" size="lg" style={{ textTransform: 'uppercase' }}>
+const NoSignatureSection = ({
+  message,
+  label,
+}: {
+  message: string;
+  label: string;
+}) => (
+  <Stack
+    align="center"
+    justify="center"
+    gap="xs"
+    style={{ minHeight: 360, width: "100%" }}
+  >
+    <Badge
+      color="gray"
+      variant="light"
+      size="lg"
+      style={{ textTransform: "uppercase" }}
+    >
       {label}
     </Badge>
-    <Text size="sm" c="dimmed" style={{ textAlign: 'center' }}>
+    <Text size="sm" c="dimmed" style={{ textAlign: "center" }}>
       {message}
     </Text>
   </Stack>
 );
 
-const ValidateSignatureReportView: React.FC<ValidateSignatureReportViewProps> = ({ data }) => {
+const ValidateSignatureReportView: React.FC<
+  ValidateSignatureReportViewProps
+> = ({ data }) => {
   const { t } = useTranslation();
-  const noSignaturesLabel = t('validateSignature.noSignaturesShort', 'No signatures');
+  const noSignaturesLabel = t(
+    "validateSignature.noSignaturesShort",
+    "No signatures",
+  );
 
   const pages = useMemo(() => {
     const result: Array<{
-      entry: SignatureValidationReportData['entries'][number];
+      entry: SignatureValidationReportData["entries"][number];
       signatureIndex: number | null;
       includeSummary: boolean;
     }> = [];
@@ -56,16 +77,19 @@ const ValidateSignatureReportView: React.FC<ValidateSignatureReportViewProps> =
       <Stack gap="xl" align="center">
         <Stack gap="xs" align="center">
           <Badge size="lg" color="blue" variant="light">
-            {t('validateSignature.report.title', 'Signature Validation Report')}
+            {t("validateSignature.report.title", "Signature Validation Report")}
           </Badge>
           <Text size="sm" c="dimmed">
-            {t('validateSignature.report.generatedAt', 'Generated')}{' '}
+            {t("validateSignature.report.generatedAt", "Generated")}{" "}
             {new Date(data.generatedAt).toLocaleString()}
           </Text>
         </Stack>
 
         {pages.map((pageDef, index) => (
-          <div className="simulated-page" key={`${pageDef.entry.fileId}-${index}`}>
+          <div
+            className="simulated-page"
+            key={`${pageDef.entry.fileId}-${index}`}
+          >
             <Stack gap="lg" style={{ flex: 1 }}>
               {pageDef.includeSummary && (
                 <>
@@ -81,11 +105,15 @@ const ValidateSignatureReportView: React.FC<ValidateSignatureReportViewProps> =
                             {pageDef.entry.fileName}
                           </Text>
                           <Text size="sm" c="dimmed">
-                            {t('validateSignature.report.entryLabel', 'Signature Summary')}
+                            {t(
+                              "validateSignature.report.entryLabel",
+                              "Signature Summary",
+                            )}
                           </Text>
                         </div>
                         <Badge color="gray" variant="light">
-                          {t('validateSignature.report.page', 'Page')} {index + 1}
+                          {t("validateSignature.report.page", "Page")}{" "}
+                          {index + 1}
                         </Badge>
                       </Group>
 
@@ -93,7 +121,9 @@ const ValidateSignatureReportView: React.FC<ValidateSignatureReportViewProps> =
                         fileSize={pageDef.entry.fileSize}
                         createdAt={pageDef.entry.createdAtLabel ?? null}
                         totalSignatures={pageDef.entry.signatures.length}
-                        lastSignatureDate={pageDef.entry.signatures[0]?.signatureDate}
+                        lastSignatureDate={
+                          pageDef.entry.signatures[0]?.signatureDate
+                        }
                       />
                     </Stack>
                   </Group>
@@ -105,13 +135,13 @@ const ValidateSignatureReportView: React.FC<ValidateSignatureReportViewProps> =
               {pageDef.entry.error ? (
                 <NoSignatureSection
                   message={pageDef.entry.error}
-                  label={t('validateSignature.status.invalid', 'Invalid')}
+                  label={t("validateSignature.status.invalid", "Invalid")}
                 />
               ) : pageDef.entry.signatures.length === 0 ? (
                 <NoSignatureSection
                   message={t(
-                    'validateSignature.noSignatures',
-                    'No digital signatures found in this document'
+                    "validateSignature.noSignatures",
+                    "No digital signatures found in this document",
                   )}
                   label={noSignaturesLabel}
                 />
@@ -119,7 +149,9 @@ const ValidateSignatureReportView: React.FC<ValidateSignatureReportViewProps> =
                 <Stack gap="xl">
                   {pageDef.signatureIndex === null ? null : (
                     <SignatureSection
-                      signature={pageDef.entry.signatures[pageDef.signatureIndex]}
+                      signature={
+                        pageDef.entry.signatures[pageDef.signatureIndex]
+                      }
                       index={pageDef.signatureIndex}
                     />
                   )}
@@ -129,10 +161,14 @@ const ValidateSignatureReportView: React.FC<ValidateSignatureReportViewProps> =
 
             <Group justify="space-between" align="center" mt="auto" pt="md">
               <Text size="xs" c="dimmed">
-                {t('validateSignature.report.footer', 'Validated via Stirling PDF')}
+                {t(
+                  "validateSignature.report.footer",
+                  "Validated via Stirling PDF",
+                )}
               </Text>
               <Text size="xs" c="dimmed">
-                {t('validateSignature.report.page', 'Page')} {index + 1} / {pages.length}
+                {t("validateSignature.report.page", "Page")} {index + 1} /{" "}
+                {pages.length}
               </Text>
             </Group>
           </div>
diff --git a/frontend/src/core/components/tools/validateSignature/ValidateSignatureResults.tsx b/frontend/src/core/components/tools/validateSignature/ValidateSignatureResults.tsx
index acbc1158e0..cd20363954 100644
--- a/frontend/src/core/components/tools/validateSignature/ValidateSignatureResults.tsx
+++ b/frontend/src/core/components/tools/validateSignature/ValidateSignatureResults.tsx
@@ -1,12 +1,22 @@
-import { useCallback, useMemo, useState } from 'react';
-import { Alert, Badge, Button, Divider, Group, Loader, Stack, Text, SegmentedControl } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import type { SignatureValidationReportEntry } from '@app/types/validateSignature';
-import type { ValidateSignatureOperationHook } from '@app/hooks/tools/validateSignature/useValidateSignatureOperation';
-import '@app/components/tools/validateSignature/reportView/styles.css';
-import FitText from '@app/components/shared/FitText';
-import { SuggestedToolsSection } from '@app/components/tools/shared/SuggestedToolsSection';
-import { downloadFile } from '@app/services/downloadService';
+import { useCallback, useMemo, useState } from "react";
+import {
+  Alert,
+  Badge,
+  Button,
+  Divider,
+  Group,
+  Loader,
+  Stack,
+  Text,
+  SegmentedControl,
+} from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import type { SignatureValidationReportEntry } from "@app/types/validateSignature";
+import type { ValidateSignatureOperationHook } from "@app/hooks/tools/validateSignature/useValidateSignatureOperation";
+import "@app/components/tools/validateSignature/reportView/styles.css";
+import FitText from "@app/components/shared/FitText";
+import { SuggestedToolsSection } from "@app/components/tools/shared/SuggestedToolsSection";
+import { downloadFile } from "@app/services/downloadService";
 
 interface ValidateSignatureResultsProps {
   operation: ValidateSignatureOperationHook;
@@ -56,28 +66,41 @@ const ValidateSignatureResults = ({
   const { t } = useTranslation();
   const summary = useFileSummary(results);
 
-  const pdfFile = useMemo(() => findFileByExtension(operation.files, '.pdf'), [operation.files]);
-  const csvFile = useMemo(() => findFileByExtension(operation.files, '.csv'), [operation.files]);
-  const jsonFile = useMemo(() => findFileByExtension(operation.files, '.json'), [operation.files]);
+  const pdfFile = useMemo(
+    () => findFileByExtension(operation.files, ".pdf"),
+    [operation.files],
+  );
+  const csvFile = useMemo(
+    () => findFileByExtension(operation.files, ".csv"),
+    [operation.files],
+  );
+  const jsonFile = useMemo(
+    () => findFileByExtension(operation.files, ".json"),
+    [operation.files],
+  );
 
-  const [selectedType, setSelectedType] = useState<'pdf' | 'csv' | 'json'>('pdf');
+  const [selectedType, setSelectedType] = useState<"pdf" | "csv" | "json">(
+    "pdf",
+  );
 
   const selectedFile = useMemo(() => {
-    if (selectedType === 'pdf') return pdfFile ?? null;
-    if (selectedType === 'csv') return csvFile ?? null;
+    if (selectedType === "pdf") return pdfFile ?? null;
+    if (selectedType === "csv") return csvFile ?? null;
     return jsonFile ?? null;
   }, [selectedType, pdfFile, csvFile, jsonFile]);
 
   const selectedDownloadLabel = useMemo(() => {
-    if (selectedType === 'pdf') return t('validateSignature.downloadPdf', 'Download PDF Report');
-    if (selectedType === 'csv') return t('validateSignature.downloadCsv', 'Download CSV');
-    return t('validateSignature.downloadJson', 'Download JSON');
+    if (selectedType === "pdf")
+      return t("validateSignature.downloadPdf", "Download PDF Report");
+    if (selectedType === "csv")
+      return t("validateSignature.downloadCsv", "Download CSV");
+    return t("validateSignature.downloadJson", "Download JSON");
   }, [selectedType, t]);
 
   const downloadTypeOptions = [
-    { label: t('validateSignature.downloadType.pdf', 'PDF'), value: 'pdf' },
-    { label: t('validateSignature.downloadType.csv', 'CSV'), value: 'csv' },
-    { label: t('validateSignature.downloadType.json', 'JSON'), value: 'json' },
+    { label: t("validateSignature.downloadType.pdf", "PDF"), value: "pdf" },
+    { label: t("validateSignature.downloadType.csv", "CSV"), value: "csv" },
+    { label: t("validateSignature.downloadType.json", "JSON"), value: "json" },
   ];
 
   const handleDownload = useCallback((file: File) => {
@@ -89,15 +112,26 @@ const ValidateSignatureResults = ({
     return (
       <Group justify="center" gap="sm" py="md">
         <Loader size="sm" />
-        <Text>{t('validateSignature.processing', 'Validating signatures...')}</Text>
+        <Text>
+          {t("validateSignature.processing", "Validating signatures...")}
+        </Text>
       </Group>
     );
   }
 
   if (!isLoading && results.length === 0) {
     return (
-      <Alert color="gray" variant="light" title={t('validateSignature.results', 'Validation Results')}>
-        <Text size="sm">{t('validateSignature.noResults', 'Run the validation to generate a report.')}</Text>
+      <Alert
+        color="gray"
+        variant="light"
+        title={t("validateSignature.results", "Validation Results")}
+      >
+        <Text size="sm">
+          {t(
+            "validateSignature.noResults",
+            "Run the validation to generate a report.",
+          )}
+        </Text>
       </Alert>
     );
   }
@@ -109,7 +143,9 @@ const ValidateSignatureResults = ({
       {isLoading && results.length > 0 && (
         <Group justify="center" gap="xs">
           <Loader size="xs" />
-          <Text size="sm">{t('validateSignature.finalizing', 'Preparing downloads...')}</Text>
+          <Text size="sm">
+            {t("validateSignature.finalizing", "Preparing downloads...")}
+          </Text>
         </Group>
       )}
       {errorMessage && (
@@ -120,62 +156,94 @@ const ValidateSignatureResults = ({
 
       <Group gap="sm">
         <Badge color="blue" variant="light">
-          {t('validateSignature.report.filesEvaluated', '{{count}} files evaluated', {
-            count: summary.fileCount,
-          })}
+          {t(
+            "validateSignature.report.filesEvaluated",
+            "{{count}} files evaluated",
+            {
+              count: summary.fileCount,
+            },
+          )}
         </Badge>
         <Badge color="teal" variant="light">
-          {t('validateSignature.report.signaturesFound', '{{count}} signatures detected', {
-            count: summary.signatureCount,
-          })}
+          {t(
+            "validateSignature.report.signaturesFound",
+            "{{count}} signatures detected",
+            {
+              count: summary.signatureCount,
+            },
+          )}
         </Badge>
         {summary.signatureCount > 0 && (
           <Badge color="green" variant="light">
-            {t('validateSignature.report.signaturesValid', '{{count}} fully valid', {
-              count: summary.fullyValidCount,
-            })}
+            {t(
+              "validateSignature.report.signaturesValid",
+              "{{count}} fully valid",
+              {
+                count: summary.fullyValidCount,
+              },
+            )}
           </Badge>
         )}
       </Group>
 
-      <Stack gap="sm" style={{ maxHeight: '20rem', overflowY: 'auto' }}>
+      <Stack gap="sm" style={{ maxHeight: "20rem", overflowY: "auto" }}>
         {results.map((result) => {
           const hasError = Boolean(result.error);
           const hasSignatures = result.signatures.length > 0;
-          const allValid = hasSignatures && result.signatures.every((signature) => signature.valid);
+          const allValid =
+            hasSignatures &&
+            result.signatures.every((signature) => signature.valid);
           const badgeLabel = hasError
-            ? t('validateSignature.status.invalid', 'Invalid')
+            ? t("validateSignature.status.invalid", "Invalid")
             : hasSignatures
-            ? allValid
-              ? t('validateSignature.status.valid', 'Valid')
-              : t('validateSignature.status.invalid', 'Invalid')
-            : t('validateSignature.noSignaturesShort', 'No signatures');
+              ? allValid
+                ? t("validateSignature.status.valid", "Valid")
+                : t("validateSignature.status.invalid", "Invalid")
+              : t("validateSignature.noSignaturesShort", "No signatures");
           const badgeClass = hasError
-            ? 'status-badge status-badge--invalid'
+            ? "status-badge status-badge--invalid"
             : hasSignatures
-            ? allValid
-              ? 'status-badge status-badge--valid'
-              : 'status-badge status-badge--warning'
-            : 'status-badge status-badge--neutral';
+              ? allValid
+                ? "status-badge status-badge--valid"
+                : "status-badge status-badge--warning"
+              : "status-badge status-badge--neutral";
 
           return (
-            <Stack key={result.fileId} gap={4} p="xs" style={{ borderLeft: '2px solid var(--mantine-color-gray-4)' }}>
+            <Stack
+              key={result.fileId}
+              gap={4}
+              p="xs"
+              style={{ borderLeft: "2px solid var(--mantine-color-gray-4)" }}
+            >
               <Group justify="space-between" align="flex-start">
                 <div style={{ flex: 1, minWidth: 0 }}>
-                  <FitText text={result.fileName} lines={2} as="div" minimumFontScale={0.5} style={{ fontWeight: 600 }} />
+                  <FitText
+                    text={result.fileName}
+                    lines={2}
+                    as="div"
+                    minimumFontScale={0.5}
+                    style={{ fontWeight: 600 }}
+                  />
                 </div>
                 <Badge className={badgeClass} variant="light">
                   {badgeLabel}
                 </Badge>
               </Group>
               <Text size="xs" c="dimmed">
-                {t('validateSignature.report.signatureCountLabel', '{{count}} signatures', {
-                  count: result.signatures.length,
-                })}
+                {t(
+                  "validateSignature.report.signatureCountLabel",
+                  "{{count}} signatures",
+                  {
+                    count: result.signatures.length,
+                  },
+                )}
               </Text>
               {!result.error && result.signatures.length === 0 && (
                 <Text size="xs" c="dimmed">
-                  {t('validateSignature.noSignatures', 'No digital signatures found in this document')}
+                  {t(
+                    "validateSignature.noSignatures",
+                    "No digital signatures found in this document",
+                  )}
                 </Text>
               )}
             </Stack>
@@ -187,11 +255,11 @@ const ValidateSignatureResults = ({
 
       <Stack gap="xs">
         <Text size="sm" fw={600}>
-          {t('validateSignature.report.downloads', 'Downloads')}
+          {t("validateSignature.report.downloads", "Downloads")}
         </Text>
         <SegmentedControl
           value={selectedType}
-          onChange={(v) => setSelectedType(v as 'pdf' | 'csv' | 'json')}
+          onChange={(v) => setSelectedType(v as "pdf" | "csv" | "json")}
           data={downloadTypeOptions}
         />
         <Button
@@ -202,9 +270,12 @@ const ValidateSignatureResults = ({
         >
           {selectedDownloadLabel}
         </Button>
-        {selectedType === 'pdf' && !pdfFile && (
+        {selectedType === "pdf" && !pdfFile && (
           <Text size="xs" c="dimmed">
-            {t('validateSignature.report.noPdf', 'PDF report will be available after a successful validation.')}
+            {t(
+              "validateSignature.report.noPdf",
+              "PDF report will be available after a successful validation.",
+            )}
           </Text>
         )}
       </Stack>
diff --git a/frontend/src/core/components/tools/validateSignature/ValidateSignatureSettings.tsx b/frontend/src/core/components/tools/validateSignature/ValidateSignatureSettings.tsx
index a744212a4a..018afc5fea 100644
--- a/frontend/src/core/components/tools/validateSignature/ValidateSignatureSettings.tsx
+++ b/frontend/src/core/components/tools/validateSignature/ValidateSignatureSettings.tsx
@@ -1,11 +1,14 @@
-import { Card, Group, Stack, Text, Button } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import FileUploadButton from '@app/components/shared/FileUploadButton';
-import { ValidateSignatureParameters } from '@app/hooks/tools/validateSignature/useValidateSignatureParameters';
+import { Card, Group, Stack, Text, Button } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import FileUploadButton from "@app/components/shared/FileUploadButton";
+import { ValidateSignatureParameters } from "@app/hooks/tools/validateSignature/useValidateSignatureParameters";
 
 interface ValidateSignatureSettingsProps {
   parameters: ValidateSignatureParameters;
-  onParameterChange: <K extends keyof ValidateSignatureParameters>(parameter: K, value: ValidateSignatureParameters[K]) => void;
+  onParameterChange: <K extends keyof ValidateSignatureParameters>(
+    parameter: K,
+    value: ValidateSignatureParameters[K],
+  ) => void;
   disabled?: boolean;
 }
 
@@ -18,18 +21,23 @@ const ValidateSignatureSettings = ({
   const certFile = parameters.certFile;
 
   const handleCertFileChange = (file: File | null) => {
-    onParameterChange('certFile', file);
+    onParameterChange("certFile", file);
   };
 
   return (
     <Card withBorder radius="md" padding="md">
       <Stack gap="sm">
         <div>
-          <Text fw={600}>{t('validateSignature.selectCustomCert', 'Custom Certificate File X.509 (Optional)')}</Text>
+          <Text fw={600}>
+            {t(
+              "validateSignature.selectCustomCert",
+              "Custom Certificate File X.509 (Optional)",
+            )}
+          </Text>
           <Text size="sm" c="dimmed">
             {t(
-              'validateSignature.settings.certHint',
-              'Upload a trusted X.509 certificate to validate against a custom trust source.'
+              "validateSignature.settings.certHint",
+              "Upload a trusted X.509 certificate to validate against a custom trust source.",
             )}
           </Text>
         </div>
@@ -49,14 +57,14 @@ const ValidateSignatureSettings = ({
               onClick={() => handleCertFileChange(null)}
               disabled={disabled}
             >
-              {t('sign.clear', 'Clear')}
+              {t("sign.clear", "Clear")}
             </Button>
           )}
         </Group>
 
         {certFile && (
           <Text size="xs" c="dimmed">
-            {t('size', 'Size')}: {Math.round(certFile.size / 1024)} KB
+            {t("size", "Size")}: {Math.round(certFile.size / 1024)} KB
           </Text>
         )}
       </Stack>
diff --git a/frontend/src/core/components/tools/validateSignature/reportView/FieldBlock.tsx b/frontend/src/core/components/tools/validateSignature/reportView/FieldBlock.tsx
index d981662e16..3d2b084508 100644
--- a/frontend/src/core/components/tools/validateSignature/reportView/FieldBlock.tsx
+++ b/frontend/src/core/components/tools/validateSignature/reportView/FieldBlock.tsx
@@ -1,18 +1,28 @@
-import React from 'react';
-import { Text } from '@mantine/core';
-import '@app/components/tools/validateSignature/reportView/styles.css';
+import React from "react";
+import { Text } from "@mantine/core";
+import "@app/components/tools/validateSignature/reportView/styles.css";
 
 const FieldBlock = (label: string, value: React.ReactNode) => {
   const displayValue =
-    value === null || value === undefined || value === '' ? '-' : value;
+    value === null || value === undefined || value === "" ? "-" : value;
 
   return (
     <div className="field-container" key={label}>
-      <Text size="xs" fw={600} c="dimmed" tt="uppercase" style={{ letterSpacing: 0.6 }}>
+      <Text
+        size="xs"
+        fw={600}
+        c="dimmed"
+        tt="uppercase"
+        style={{ letterSpacing: 0.6 }}
+      >
         {label}
       </Text>
       <div className="field-value">
-        <Text size="sm" fw={500} style={{ lineHeight: 1.35, whiteSpace: 'pre-wrap' }}>
+        <Text
+          size="sm"
+          fw={500}
+          style={{ lineHeight: 1.35, whiteSpace: "pre-wrap" }}
+        >
           {displayValue}
         </Text>
       </div>
diff --git a/frontend/src/core/components/tools/validateSignature/reportView/FileSummaryHeader.tsx b/frontend/src/core/components/tools/validateSignature/reportView/FileSummaryHeader.tsx
index 68b95e3b7a..f03ec18231 100644
--- a/frontend/src/core/components/tools/validateSignature/reportView/FileSummaryHeader.tsx
+++ b/frontend/src/core/components/tools/validateSignature/reportView/FileSummaryHeader.tsx
@@ -1,9 +1,9 @@
-import { useTranslation } from 'react-i18next';
-import '@app/components/tools/validateSignature/reportView/styles.css';
-import FieldBlock from '@app/components/tools/validateSignature/reportView/FieldBlock';
+import { useTranslation } from "react-i18next";
+import "@app/components/tools/validateSignature/reportView/styles.css";
+import FieldBlock from "@app/components/tools/validateSignature/reportView/FieldBlock";
 
 const formatDate = (value?: string | null) => {
-  if (!value) return '--';
+  if (!value) return "--";
   const parsed = Date.parse(value);
   if (!Number.isNaN(parsed)) {
     return new Date(parsed).toLocaleString();
@@ -12,10 +12,13 @@ const formatDate = (value?: string | null) => {
 };
 
 const formatFileSize = (bytes?: number | null) => {
-  if (bytes === undefined || bytes === null) return '--';
-  if (bytes === 0) return '0 B';
-  const units = ['B', 'KB', 'MB', 'GB', 'TB'];
-  const exponent = Math.min(Math.floor(Math.log(bytes) / Math.log(1024)), units.length - 1);
+  if (bytes === undefined || bytes === null) return "--";
+  if (bytes === 0) return "0 B";
+  const units = ["B", "KB", "MB", "GB", "TB"];
+  const exponent = Math.min(
+    Math.floor(Math.log(bytes) / Math.log(1024)),
+    units.length - 1,
+  );
   const size = bytes / Math.pow(1024, exponent);
   return `${size.toFixed(exponent === 0 ? 0 : 1)} ${units[exponent]}`;
 };
@@ -33,14 +36,19 @@ const FileSummaryHeader = ({
 }) => {
   const { t } = useTranslation();
   const infoBlocks = [
-    FieldBlock(t('files.size', 'File Size'), formatFileSize(fileSize ?? null)),
-    FieldBlock(t('files.created', 'Created'), createdAt || '-'),
-    FieldBlock(t('validateSignature.signatureDate', 'Signature Date'), formatDate(lastSignatureDate)),
-    FieldBlock(t('validateSignature.totalSignatures', 'Total Signatures'), totalSignatures.toString()),
+    FieldBlock(t("files.size", "File Size"), formatFileSize(fileSize ?? null)),
+    FieldBlock(t("files.created", "Created"), createdAt || "-"),
+    FieldBlock(
+      t("validateSignature.signatureDate", "Signature Date"),
+      formatDate(lastSignatureDate),
+    ),
+    FieldBlock(
+      t("validateSignature.totalSignatures", "Total Signatures"),
+      totalSignatures.toString(),
+    ),
   ];
 
   return <div className="grid-container">{infoBlocks}</div>;
 };
 
 export default FileSummaryHeader;
-
diff --git a/frontend/src/core/components/tools/validateSignature/reportView/SignatureSection.tsx b/frontend/src/core/components/tools/validateSignature/reportView/SignatureSection.tsx
index c6bef701fb..405b0ef8b9 100644
--- a/frontend/src/core/components/tools/validateSignature/reportView/SignatureSection.tsx
+++ b/frontend/src/core/components/tools/validateSignature/reportView/SignatureSection.tsx
@@ -1,12 +1,12 @@
-import { Divider, Group, Stack, Text } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import type { SignatureValidationSignature } from '@app/types/validateSignature';
-import SignatureStatusBadge from '@app/components/tools/validateSignature/reportView/SignatureStatusBadge';
-import FieldBlock from '@app/components/tools/validateSignature/reportView/FieldBlock';
-import '@app/components/tools/validateSignature/reportView/styles.css';
+import { Divider, Group, Stack, Text } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import type { SignatureValidationSignature } from "@app/types/validateSignature";
+import SignatureStatusBadge from "@app/components/tools/validateSignature/reportView/SignatureStatusBadge";
+import FieldBlock from "@app/components/tools/validateSignature/reportView/FieldBlock";
+import "@app/components/tools/validateSignature/reportView/styles.css";
 
 const formatDate = (value?: string | null) => {
-  if (!value) return '-';
+  if (!value) return "-";
   const parsed = Date.parse(value);
   if (!Number.isNaN(parsed)) {
     return new Date(parsed).toLocaleString();
@@ -23,29 +23,67 @@ const SignatureSection = ({
 }) => {
   const { t } = useTranslation();
   const signatureFields = [
-    FieldBlock(t('validateSignature.signer', 'Signer'), signature.signerName || '-'),
-    FieldBlock(t('validateSignature.date', 'Date'), formatDate(signature.signatureDate)),
-    FieldBlock(t('validateSignature.reason', 'Reason'), signature.reason || '-'),
-    FieldBlock(t('validateSignature.location', 'Location'), signature.location || '-'),
+    FieldBlock(
+      t("validateSignature.signer", "Signer"),
+      signature.signerName || "-",
+    ),
+    FieldBlock(
+      t("validateSignature.date", "Date"),
+      formatDate(signature.signatureDate),
+    ),
+    FieldBlock(
+      t("validateSignature.reason", "Reason"),
+      signature.reason || "-",
+    ),
+    FieldBlock(
+      t("validateSignature.location", "Location"),
+      signature.location || "-",
+    ),
   ];
 
   const certificateFields = [
-    FieldBlock(t('validateSignature.cert.issuer', 'Issuer'), signature.issuerDN || '-'),
-    FieldBlock(t('validateSignature.cert.subject', 'Subject'), signature.subjectDN || '-'),
-    FieldBlock(t('validateSignature.cert.serialNumber', 'Serial Number'), signature.serialNumber || '-'),
-    FieldBlock(t('validateSignature.cert.validFrom', 'Valid From'), formatDate(signature.validFrom)),
-    FieldBlock(t('validateSignature.cert.validUntil', 'Valid Until'), formatDate(signature.validUntil)),
-    FieldBlock(t('validateSignature.cert.algorithm', 'Algorithm'), signature.signatureAlgorithm || '-'),
     FieldBlock(
-      t('validateSignature.cert.keySize', 'Key Size'),
-      signature.keySize != null ? `${signature.keySize} ${t('validateSignature.cert.bits', 'bits')}` : '--'
+      t("validateSignature.cert.issuer", "Issuer"),
+      signature.issuerDN || "-",
     ),
-    FieldBlock(t('validateSignature.cert.version', 'Version'), signature.version || '-'),
     FieldBlock(
-      t('validateSignature.cert.keyUsage', 'Key Usage'),
-      signature.keyUsages.length > 0 ? signature.keyUsages.join(', ') : '--'
+      t("validateSignature.cert.subject", "Subject"),
+      signature.subjectDN || "-",
+    ),
+    FieldBlock(
+      t("validateSignature.cert.serialNumber", "Serial Number"),
+      signature.serialNumber || "-",
+    ),
+    FieldBlock(
+      t("validateSignature.cert.validFrom", "Valid From"),
+      formatDate(signature.validFrom),
+    ),
+    FieldBlock(
+      t("validateSignature.cert.validUntil", "Valid Until"),
+      formatDate(signature.validUntil),
+    ),
+    FieldBlock(
+      t("validateSignature.cert.algorithm", "Algorithm"),
+      signature.signatureAlgorithm || "-",
+    ),
+    FieldBlock(
+      t("validateSignature.cert.keySize", "Key Size"),
+      signature.keySize != null
+        ? `${signature.keySize} ${t("validateSignature.cert.bits", "bits")}`
+        : "--",
+    ),
+    FieldBlock(
+      t("validateSignature.cert.version", "Version"),
+      signature.version || "-",
+    ),
+    FieldBlock(
+      t("validateSignature.cert.keyUsage", "Key Usage"),
+      signature.keyUsages.length > 0 ? signature.keyUsages.join(", ") : "--",
+    ),
+    FieldBlock(
+      t("validateSignature.cert.selfSigned", "Self-Signed"),
+      signature.selfSigned ? t("yes", "Yes") : t("no", "No"),
     ),
-    FieldBlock(t('validateSignature.cert.selfSigned', 'Self-Signed'), signature.selfSigned ? t('yes', 'Yes') : t('no', 'No')),
   ];
 
   return (
@@ -53,12 +91,14 @@ const SignatureSection = ({
       <Group justify="space-between" align="center">
         <Group gap="sm">
           <Text fw={700} size="lg">
-            {t('validateSignature.signature._value', 'Signature')} {index + 1}
+            {t("validateSignature.signature._value", "Signature")} {index + 1}
           </Text>
           <SignatureStatusBadge signature={signature} />
         </Group>
         {signature.errorMessage && (
-          <Text c="red" size="sm">{signature.errorMessage}</Text>
+          <Text c="red" size="sm">
+            {signature.errorMessage}
+          </Text>
         )}
       </Group>
 
@@ -66,8 +106,14 @@ const SignatureSection = ({
 
       <Divider my="sm" />
 
-      <Text fw={600} size="sm" c="dimmed" tt="uppercase" style={{ letterSpacing: 0.8 }}>
-        {t('validateSignature.cert.details', 'Certificate Details')}
+      <Text
+        fw={600}
+        size="sm"
+        c="dimmed"
+        tt="uppercase"
+        style={{ letterSpacing: 0.8 }}
+      >
+        {t("validateSignature.cert.details", "Certificate Details")}
       </Text>
       <div className="grid-container">{certificateFields}</div>
     </Stack>
diff --git a/frontend/src/core/components/tools/validateSignature/reportView/SignatureStatusBadge.tsx b/frontend/src/core/components/tools/validateSignature/reportView/SignatureStatusBadge.tsx
index 342c6713e6..773eb81c8f 100644
--- a/frontend/src/core/components/tools/validateSignature/reportView/SignatureStatusBadge.tsx
+++ b/frontend/src/core/components/tools/validateSignature/reportView/SignatureStatusBadge.tsx
@@ -1,29 +1,45 @@
-import { Badge, Popover, Text } from '@mantine/core';
-import '@app/components/tools/validateSignature/reportView/styles.css';
-import { useTranslation } from 'react-i18next';
-import { computeSignatureStatus } from '@app/hooks/tools/validateSignature/utils/signatureStatus';
-import type { SignatureValidationSignature } from '@app/types/validateSignature';
+import { Badge, Popover, Text } from "@mantine/core";
+import "@app/components/tools/validateSignature/reportView/styles.css";
+import { useTranslation } from "react-i18next";
+import { computeSignatureStatus } from "@app/hooks/tools/validateSignature/utils/signatureStatus";
+import type { SignatureValidationSignature } from "@app/types/validateSignature";
 
-const SignatureStatusBadge = ({ signature }: { signature: SignatureValidationSignature }) => {
+const SignatureStatusBadge = ({
+  signature,
+}: {
+  signature: SignatureValidationSignature;
+}) => {
   const { t } = useTranslation();
   const status = computeSignatureStatus(signature, t);
   const classMap = {
-    valid: 'status-badge status-badge--valid',
-    warning: 'status-badge status-badge--warning',
-    invalid: 'status-badge status-badge--invalid',
-    neutral: 'status-badge status-badge--neutral',
+    valid: "status-badge status-badge--valid",
+    warning: "status-badge status-badge--warning",
+    invalid: "status-badge status-badge--invalid",
+    neutral: "status-badge status-badge--neutral",
   } as const;
 
   return (
-    <Popover withinPortal position="bottom" withArrow shadow="md" disabled={status.details.length === 0}>
+    <Popover
+      withinPortal
+      position="bottom"
+      withArrow
+      shadow="md"
+      disabled={status.details.length === 0}
+    >
       <Popover.Target>
-        <Badge className={classMap[status.kind]} variant="light" style={{ cursor: status.details.length ? 'pointer' : 'default' }}>
+        <Badge
+          className={classMap[status.kind]}
+          variant="light"
+          style={{ cursor: status.details.length ? "pointer" : "default" }}
+        >
           {status.label}
         </Badge>
       </Popover.Target>
       {status.details.length > 0 && (
         <Popover.Dropdown>
-          <Text size="sm" fw={600} mb={4}>{t('details', 'Details')}</Text>
+          <Text size="sm" fw={600} mb={4}>
+            {t("details", "Details")}
+          </Text>
           {status.details.map((d, i) => (
             <Text size="sm" key={i}>
               - {d}
@@ -36,4 +52,3 @@ const SignatureStatusBadge = ({ signature }: { signature: SignatureValidationSig
 };
 
 export default SignatureStatusBadge;
-
diff --git a/frontend/src/core/components/tools/validateSignature/reportView/ThumbnailPreview.tsx b/frontend/src/core/components/tools/validateSignature/reportView/ThumbnailPreview.tsx
index 33d76144f3..378280bbac 100644
--- a/frontend/src/core/components/tools/validateSignature/reportView/ThumbnailPreview.tsx
+++ b/frontend/src/core/components/tools/validateSignature/reportView/ThumbnailPreview.tsx
@@ -1,5 +1,5 @@
-import PictureAsPdfIcon from '@mui/icons-material/PictureAsPdf';
-import '@app/components/tools/validateSignature/reportView/styles.css';
+import PictureAsPdfIcon from "@mui/icons-material/PictureAsPdf";
+import "@app/components/tools/validateSignature/reportView/styles.css";
 
 const ThumbnailPreview = ({
   thumbnailUrl,
diff --git a/frontend/src/core/components/tools/validateSignature/reportView/styles.css b/frontend/src/core/components/tools/validateSignature/reportView/styles.css
index 27b1081d4c..096470305e 100644
--- a/frontend/src/core/components/tools/validateSignature/reportView/styles.css
+++ b/frontend/src/core/components/tools/validateSignature/reportView/styles.css
@@ -101,7 +101,11 @@
   align-items: center;
   justify-content: center;
   color: rgb(var(--pdf-light-text-muted));
-  background: linear-gradient(145deg, var(--mantine-color-gray-1) 0%, var(--mantine-color-gray-0) 100%);
+  background: linear-gradient(
+    145deg,
+    var(--mantine-color-gray-1) 0%,
+    var(--mantine-color-gray-0) 100%
+  );
 }
 
 /* Flash highlight animation for section navigation */
diff --git a/frontend/src/core/components/tooltips/PageLayout/usePageLayoutAdvancedTips.ts b/frontend/src/core/components/tooltips/PageLayout/usePageLayoutAdvancedTips.ts
index 8cfa963348..e33d19864c 100644
--- a/frontend/src/core/components/tooltips/PageLayout/usePageLayoutAdvancedTips.ts
+++ b/frontend/src/core/components/tooltips/PageLayout/usePageLayoutAdvancedTips.ts
@@ -1,41 +1,65 @@
-import { useTranslation } from 'react-i18next';
-import { TooltipContent } from '@app/types/tips';
+import { useTranslation } from "react-i18next";
+import { TooltipContent } from "@app/types/tips";
 
 export const usePageLayoutAdvancedTips = (): TooltipContent => {
   const { t } = useTranslation();
 
   return {
     header: {
-      title: t('pageLayout.advanced.tooltip.header.title', 'Advanced Layout Options'),
+      title: t(
+        "pageLayout.advanced.tooltip.header.title",
+        "Advanced Layout Options",
+      ),
     },
     tips: [
       {
-        title: t('pageLayout.advanced.tooltip.orientation.title', 'Orientation'),
+        title: t(
+          "pageLayout.advanced.tooltip.orientation.title",
+          "Orientation",
+        ),
         description: t(
-          'pageLayout.advanced.tooltip.orientation.text',
-          'Choose the final sheet direction. Portrait works better for tall content, while landscape fits wider layouts.'
+          "pageLayout.advanced.tooltip.orientation.text",
+          "Choose the final sheet direction. Portrait works better for tall content, while landscape fits wider layouts.",
         ),
       },
       {
-        title: t('pageLayout.advanced.tooltip.arrangement.title', 'Page Arrangement'),
+        title: t(
+          "pageLayout.advanced.tooltip.arrangement.title",
+          "Page Arrangement",
+        ),
         description: t(
-          'pageLayout.advanced.tooltip.arrangement.text',
-          'Controls whether pages fill the grid row-by-row or column-by-column.'
+          "pageLayout.advanced.tooltip.arrangement.text",
+          "Controls whether pages fill the grid row-by-row or column-by-column.",
         ),
         bullets: [
-          t('pageLayout.advanced.tooltip.arrangement.bullet1', 'By Rows: Fill each row first.'),
-          t('pageLayout.advanced.tooltip.arrangement.bullet2', 'By Columns: Fill each column first.'),
+          t(
+            "pageLayout.advanced.tooltip.arrangement.bullet1",
+            "By Rows: Fill each row first.",
+          ),
+          t(
+            "pageLayout.advanced.tooltip.arrangement.bullet2",
+            "By Columns: Fill each column first.",
+          ),
         ],
       },
       {
-        title: t('pageLayout.advanced.tooltip.readingDirection.title', 'Reading Direction'),
+        title: t(
+          "pageLayout.advanced.tooltip.readingDirection.title",
+          "Reading Direction",
+        ),
         description: t(
-          'pageLayout.advanced.tooltip.readingDirection.text',
-          'Sets horizontal ordering in the grid, useful for left-to-right and right-to-left document conventions.'
+          "pageLayout.advanced.tooltip.readingDirection.text",
+          "Sets horizontal ordering in the grid, useful for left-to-right and right-to-left document conventions.",
         ),
         bullets: [
-          t('pageLayout.advanced.tooltip.readingDirection.bullet1', 'LTR: Left to right order.'),
-          t('pageLayout.advanced.tooltip.readingDirection.bullet2', 'RTL: Right to left order.'),
+          t(
+            "pageLayout.advanced.tooltip.readingDirection.bullet1",
+            "LTR: Left to right order.",
+          ),
+          t(
+            "pageLayout.advanced.tooltip.readingDirection.bullet2",
+            "RTL: Right to left order.",
+          ),
         ],
       },
     ],
diff --git a/frontend/src/core/components/tooltips/PageLayout/usePageLayoutMarginsBordersTips.ts b/frontend/src/core/components/tooltips/PageLayout/usePageLayoutMarginsBordersTips.ts
index ae36f9c84e..b95f316f0e 100644
--- a/frontend/src/core/components/tooltips/PageLayout/usePageLayoutMarginsBordersTips.ts
+++ b/frontend/src/core/components/tooltips/PageLayout/usePageLayoutMarginsBordersTips.ts
@@ -1,40 +1,52 @@
-import { useTranslation } from 'react-i18next';
-import { TooltipContent } from '@app/types/tips';
+import { useTranslation } from "react-i18next";
+import { TooltipContent } from "@app/types/tips";
 
 export const usePageLayoutMarginsBordersTips = (): TooltipContent => {
   const { t } = useTranslation();
 
   return {
     header: {
-      title: t('pageLayout.marginsBorders.tooltip.header.title', 'Margins and Borders'),
+      title: t(
+        "pageLayout.marginsBorders.tooltip.header.title",
+        "Margins and Borders",
+      ),
     },
     tips: [
       {
-        title: t('pageLayout.marginsBorders.tooltip.margins.title', 'Margins'),
+        title: t("pageLayout.marginsBorders.tooltip.margins.title", "Margins"),
         description: t(
-          'pageLayout.marginsBorders.tooltip.margins.text',
-          'Use top, bottom, left, and right margins to control spacing around the full sheet output.'
+          "pageLayout.marginsBorders.tooltip.margins.text",
+          "Use top, bottom, left, and right margins to control spacing around the full sheet output.",
         ),
       },
       {
-        title: t('pageLayout.marginsBorders.tooltip.innerMargin.title', 'Inner Margin'),
+        title: t(
+          "pageLayout.marginsBorders.tooltip.innerMargin.title",
+          "Inner Margin",
+        ),
         description: t(
-          'pageLayout.marginsBorders.tooltip.innerMargin.text',
-          'Inner margin adds spacing between cells in the page grid to improve separation and readability.'
+          "pageLayout.marginsBorders.tooltip.innerMargin.text",
+          "Inner margin adds spacing between cells in the page grid to improve separation and readability.",
         ),
       },
       {
-        title: t('pageLayout.marginsBorders.tooltip.borders.title', 'Add Borders'),
+        title: t(
+          "pageLayout.marginsBorders.tooltip.borders.title",
+          "Add Borders",
+        ),
         description: t(
-          'pageLayout.marginsBorders.tooltip.borders.text',
-          'Enable borders to draw lines around each placed page. This can help visual separation or trimming.'
+          "pageLayout.marginsBorders.tooltip.borders.text",
+          "Enable borders to draw lines around each placed page. This can help visual separation or trimming.",
         ),
       },
       {
-        title: t('pageLayout.marginsBorders.tooltip.borderWidth.title', 'Border Thickness'),
+        title: t(
+          "pageLayout.marginsBorders.tooltip.borderWidth.title",
+          "Border Thickness",
+        ),
         description: t(
-          'pageLayout.marginsBorders.tooltip.borderWidth.text',
-          'Border thickness is only applied when borders are enabled. Higher values produce thicker lines.'
+          "pageLayout.marginsBorders.tooltip.borderWidth.text",
+          "Border thickness is only applied when borders are enabled. Higher values produce thicker lines.",
         ),
       },
     ],
diff --git a/frontend/src/core/components/tooltips/PageLayout/usePageLayoutTips.ts b/frontend/src/core/components/tooltips/PageLayout/usePageLayoutTips.ts
index 4b3d158d02..d72dcefe1f 100644
--- a/frontend/src/core/components/tooltips/PageLayout/usePageLayoutTips.ts
+++ b/frontend/src/core/components/tooltips/PageLayout/usePageLayoutTips.ts
@@ -1,34 +1,58 @@
-import { useTranslation } from 'react-i18next';
-import { TooltipContent } from '@app/types/tips';
+import { useTranslation } from "react-i18next";
+import { TooltipContent } from "@app/types/tips";
 
 export const usePageLayoutTips = (): TooltipContent => {
   const { t } = useTranslation();
 
   return {
     header: {
-      title: t("pageLayout.tooltip.header.title", "Page Layout Guide")
+      title: t("pageLayout.tooltip.header.title", "Page Layout Guide"),
     },
     tips: [
       {
         title: t("pageLayout.tooltip.overview.title", "What is Page Layout?"),
-        description: t("pageLayout.tooltip.overview.text", "Fit multiple pages onto a single sheet for handouts or to save paper.")
+        description: t(
+          "pageLayout.tooltip.overview.text",
+          "Fit multiple pages onto a single sheet for handouts or to save paper.",
+        ),
       },
       {
         title: t("pageLayout.tooltip.mode.title", "Mode"),
-        description: t("pageLayout.tooltip.mode.text", "Choose how the grid is configured:"),
+        description: t(
+          "pageLayout.tooltip.mode.text",
+          "Choose how the grid is configured:",
+        ),
         bullets: [
-          t("pageLayout.tooltip.mode.bullet1", "Default: Pick a preset and the grid is calculated automatically."),
-          t("pageLayout.tooltip.mode.bullet2", "Custom: Set rows and columns manually.")
-        ]
+          t(
+            "pageLayout.tooltip.mode.bullet1",
+            "Default: Pick a preset and the grid is calculated automatically.",
+          ),
+          t(
+            "pageLayout.tooltip.mode.bullet2",
+            "Custom: Set rows and columns manually.",
+          ),
+        ],
       },
       {
-        title: t("pageLayout.tooltip.pagesPerSheet.title", "Pages per Sheet (Default Mode)"),
-        description: t("pageLayout.tooltip.pagesPerSheet.text", "Choose how many pages per sheet (e.g. 4 → 2×2, 9 → 3×3).")
+        title: t(
+          "pageLayout.tooltip.pagesPerSheet.title",
+          "Pages per Sheet (Default Mode)",
+        ),
+        description: t(
+          "pageLayout.tooltip.pagesPerSheet.text",
+          "Choose how many pages per sheet (e.g. 4 → 2×2, 9 → 3×3).",
+        ),
       },
       {
-        title: t("pageLayout.tooltip.rowsCols.title", "Rows & Columns (Custom Mode)"),
-        description: t("pageLayout.tooltip.rowsCols.text", "Set exact grid dimensions. Total pages per sheet = rows × columns.")
-      }
-    ]
+        title: t(
+          "pageLayout.tooltip.rowsCols.title",
+          "Rows & Columns (Custom Mode)",
+        ),
+        description: t(
+          "pageLayout.tooltip.rowsCols.text",
+          "Set exact grid dimensions. Total pages per sheet = rows × columns.",
+        ),
+      },
+    ],
   };
 };
diff --git a/frontend/src/core/components/tooltips/useAddAttachmentsTips.ts b/frontend/src/core/components/tooltips/useAddAttachmentsTips.ts
index 50f924501b..9af5a5ff6e 100644
--- a/frontend/src/core/components/tooltips/useAddAttachmentsTips.ts
+++ b/frontend/src/core/components/tooltips/useAddAttachmentsTips.ts
@@ -1,18 +1,27 @@
-import { useTranslation } from 'react-i18next';
-import { TooltipContent } from '@app/types/tips';
+import { useTranslation } from "react-i18next";
+import { TooltipContent } from "@app/types/tips";
 
 export const useAddAttachmentsTips = (): TooltipContent => {
   const { t } = useTranslation();
 
   return {
     header: {
-      title: t("AddAttachmentsRequest.tooltip.header.title", "About Add Attachments")
+      title: t(
+        "AddAttachmentsRequest.tooltip.header.title",
+        "About Add Attachments",
+      ),
     },
     tips: [
       {
-        title: t("AddAttachmentsRequest.tooltip.description.title", "What it does"),
-        description: t("AddAttachmentsRequest.info", "Select files to attach to your PDF. These files will be embedded and accessible through the PDF's attachment panel."),
-      }
-    ]
+        title: t(
+          "AddAttachmentsRequest.tooltip.description.title",
+          "What it does",
+        ),
+        description: t(
+          "AddAttachmentsRequest.info",
+          "Select files to attach to your PDF. These files will be embedded and accessible through the PDF's attachment panel.",
+        ),
+      },
+    ],
   };
 };
diff --git a/frontend/src/core/components/tooltips/useAddPasswordPermissionsTips.ts b/frontend/src/core/components/tooltips/useAddPasswordPermissionsTips.ts
index 624dc31dba..83004cb54c 100644
--- a/frontend/src/core/components/tooltips/useAddPasswordPermissionsTips.ts
+++ b/frontend/src/core/components/tooltips/useAddPasswordPermissionsTips.ts
@@ -1,17 +1,20 @@
-import { useTranslation } from 'react-i18next';
-import { TooltipContent } from '@app/types/tips';
+import { useTranslation } from "react-i18next";
+import { TooltipContent } from "@app/types/tips";
 
 export const useAddPasswordPermissionsTips = (): TooltipContent => {
   const { t } = useTranslation();
 
   return {
     header: {
-      title: t("addPassword.tooltip.permissions.title", "Change Permissions")
+      title: t("addPassword.tooltip.permissions.title", "Change Permissions"),
     },
     tips: [
       {
-        description: t("addPassword.tooltip.permissions.text", "These permissions control what users can do with the PDF. Most effective when combined with an owner password."),
-      }
-    ]
+        description: t(
+          "addPassword.tooltip.permissions.text",
+          "These permissions control what users can do with the PDF. Most effective when combined with an owner password.",
+        ),
+      },
+    ],
   };
 };
diff --git a/frontend/src/core/components/tooltips/useAddPasswordTips.ts b/frontend/src/core/components/tooltips/useAddPasswordTips.ts
index 7a361a64c5..29321ff558 100644
--- a/frontend/src/core/components/tooltips/useAddPasswordTips.ts
+++ b/frontend/src/core/components/tooltips/useAddPasswordTips.ts
@@ -1,31 +1,55 @@
-import { useTranslation } from 'react-i18next';
-import { TooltipContent } from '@app/types/tips';
+import { useTranslation } from "react-i18next";
+import { TooltipContent } from "@app/types/tips";
 
 export const useAddPasswordTips = (): TooltipContent => {
   const { t } = useTranslation();
 
   return {
     header: {
-      title: t("addPassword.tooltip.header.title", "Password Protection Overview")
+      title: t(
+        "addPassword.tooltip.header.title",
+        "Password Protection Overview",
+      ),
     },
     tips: [
       {
         title: t("addPassword.tooltip.passwords.title", "Password Types"),
-        description: t("addPassword.tooltip.passwords.text", "User passwords restrict opening the document, while owner passwords control what can be done with the document once opened. You can set both or just one."),
+        description: t(
+          "addPassword.tooltip.passwords.text",
+          "User passwords restrict opening the document, while owner passwords control what can be done with the document once opened. You can set both or just one.",
+        ),
         bullets: [
-          t("addPassword.tooltip.passwords.bullet1", "User Password: Required to open the PDF"),
-          t("addPassword.tooltip.passwords.bullet2", "Owner Password: Controls document permissions (not supported by all PDF viewers)")
-        ]
+          t(
+            "addPassword.tooltip.passwords.bullet1",
+            "User Password: Required to open the PDF",
+          ),
+          t(
+            "addPassword.tooltip.passwords.bullet2",
+            "Owner Password: Controls document permissions (not supported by all PDF viewers)",
+          ),
+        ],
       },
       {
         title: t("addPassword.tooltip.encryption.title", "Encryption Levels"),
-        description: t("addPassword.tooltip.encryption.text", "Higher encryption levels provide better security but may not be supported by older PDF viewers."),
+        description: t(
+          "addPassword.tooltip.encryption.text",
+          "Higher encryption levels provide better security but may not be supported by older PDF viewers.",
+        ),
         bullets: [
-          t("addPassword.tooltip.encryption.bullet1", "40-bit: Basic security, compatible with older viewers"),
-          t("addPassword.tooltip.encryption.bullet2", "128-bit: Standard security, widely supported"),
-          t("addPassword.tooltip.encryption.bullet3", "256-bit: Maximum security, requires modern viewers")
-        ]
+          t(
+            "addPassword.tooltip.encryption.bullet1",
+            "40-bit: Basic security, compatible with older viewers",
+          ),
+          t(
+            "addPassword.tooltip.encryption.bullet2",
+            "128-bit: Standard security, widely supported",
+          ),
+          t(
+            "addPassword.tooltip.encryption.bullet3",
+            "256-bit: Maximum security, requires modern viewers",
+          ),
+        ],
       },
-    ]
+    ],
   };
 };
diff --git a/frontend/src/core/components/tooltips/useAdjustPageScaleTips.ts b/frontend/src/core/components/tooltips/useAdjustPageScaleTips.ts
index 71bef0dd6c..629a7387b6 100644
--- a/frontend/src/core/components/tooltips/useAdjustPageScaleTips.ts
+++ b/frontend/src/core/components/tooltips/useAdjustPageScaleTips.ts
@@ -1,31 +1,52 @@
-import { useTranslation } from 'react-i18next';
-import { TooltipContent } from '@app/types/tips';
+import { useTranslation } from "react-i18next";
+import { TooltipContent } from "@app/types/tips";
 
 export const useAdjustPageScaleTips = (): TooltipContent => {
   const { t } = useTranslation();
 
   return {
     header: {
-      title: t("adjustPageScale.tooltip.header.title", "Page Scale Settings Overview")
+      title: t(
+        "adjustPageScale.tooltip.header.title",
+        "Page Scale Settings Overview",
+      ),
     },
     tips: [
       {
         title: t("adjustPageScale.tooltip.description.title", "Description"),
-        description: t("adjustPageScale.tooltip.description.text", "Adjust the size of PDF content and change the page dimensions.")
+        description: t(
+          "adjustPageScale.tooltip.description.text",
+          "Adjust the size of PDF content and change the page dimensions.",
+        ),
       },
       {
         title: t("adjustPageScale.tooltip.scaleFactor.title", "Scale Factor"),
-        description: t("adjustPageScale.tooltip.scaleFactor.text", "Controls how large or small the content appears on the page. Content is scaled and centered - if scaled content is larger than the page size, it may be cropped."),
+        description: t(
+          "adjustPageScale.tooltip.scaleFactor.text",
+          "Controls how large or small the content appears on the page. Content is scaled and centered - if scaled content is larger than the page size, it may be cropped.",
+        ),
         bullets: [
-          t("adjustPageScale.tooltip.scaleFactor.bullet1", "1.0 = Original size"),
-          t("adjustPageScale.tooltip.scaleFactor.bullet2", "0.5 = Half size (50% smaller)"),
-          t("adjustPageScale.tooltip.scaleFactor.bullet3", "2.0 = Double size (200% larger, may crop)")
-        ]
+          t(
+            "adjustPageScale.tooltip.scaleFactor.bullet1",
+            "1.0 = Original size",
+          ),
+          t(
+            "adjustPageScale.tooltip.scaleFactor.bullet2",
+            "0.5 = Half size (50% smaller)",
+          ),
+          t(
+            "adjustPageScale.tooltip.scaleFactor.bullet3",
+            "2.0 = Double size (200% larger, may crop)",
+          ),
+        ],
       },
       {
         title: t("adjustPageScale.tooltip.pageSize.title", "Target Page Size"),
-        description: t("adjustPageScale.tooltip.pageSize.text", "Sets the dimensions of the output PDF pages. 'Keep Original Size' maintains current dimensions, while other options resize to standard paper sizes.")
-      }
-    ]
+        description: t(
+          "adjustPageScale.tooltip.pageSize.text",
+          "Sets the dimensions of the output PDF pages. 'Keep Original Size' maintains current dimensions, while other options resize to standard paper sizes.",
+        ),
+      },
+    ],
   };
 };
diff --git a/frontend/src/core/components/tooltips/useAdvancedOCRTips.ts b/frontend/src/core/components/tooltips/useAdvancedOCRTips.ts
index 004a970664..557b35420d 100644
--- a/frontend/src/core/components/tooltips/useAdvancedOCRTips.ts
+++ b/frontend/src/core/components/tooltips/useAdvancedOCRTips.ts
@@ -1,5 +1,5 @@
-import { useTranslation } from 'react-i18next';
-import { TooltipContent } from '@app/types/tips';
+import { useTranslation } from "react-i18next";
+import { TooltipContent } from "@app/types/tips";
 
 export const useAdvancedOCRTips = (): TooltipContent => {
   const { t } = useTranslation();
@@ -10,25 +10,43 @@ export const useAdvancedOCRTips = (): TooltipContent => {
     },
     tips: [
       {
-        title: t("ocr.tooltip.advanced.compatibility.title", "Compatibility Mode"),
-        description: t("ocr.tooltip.advanced.compatibility.text", "Uses OCR 'sandwich PDF' mode: results in larger files, but more reliable with certain languages and older PDF software. By default we use hOCR for smaller, modern PDFs.")
+        title: t(
+          "ocr.tooltip.advanced.compatibility.title",
+          "Compatibility Mode",
+        ),
+        description: t(
+          "ocr.tooltip.advanced.compatibility.text",
+          "Uses OCR 'sandwich PDF' mode: results in larger files, but more reliable with certain languages and older PDF software. By default we use hOCR for smaller, modern PDFs.",
+        ),
       },
       {
         title: t("ocr.tooltip.advanced.sidecar.title", "Create Text File"),
-        description: t("ocr.tooltip.advanced.sidecar.text", "Generates a separate .txt file alongside the PDF containing all extracted text content for easy access and processing.")
+        description: t(
+          "ocr.tooltip.advanced.sidecar.text",
+          "Generates a separate .txt file alongside the PDF containing all extracted text content for easy access and processing.",
+        ),
       },
       {
         title: t("ocr.tooltip.advanced.deskew.title", "Deskew Pages"),
-        description: t("ocr.tooltip.advanced.deskew.text", "Automatically corrects skewed or tilted pages to improve OCR accuracy. Useful for scanned documents that weren't perfectly aligned.")
+        description: t(
+          "ocr.tooltip.advanced.deskew.text",
+          "Automatically corrects skewed or tilted pages to improve OCR accuracy. Useful for scanned documents that weren't perfectly aligned.",
+        ),
       },
       {
         title: t("ocr.tooltip.advanced.clean.title", "Clean Input File"),
-        description: t("ocr.tooltip.advanced.clean.text", "Preprocesses the input by removing noise, enhancing contrast, and optimising the image for better OCR recognition before processing.")
+        description: t(
+          "ocr.tooltip.advanced.clean.text",
+          "Preprocesses the input by removing noise, enhancing contrast, and optimising the image for better OCR recognition before processing.",
+        ),
       },
       {
         title: t("ocr.tooltip.advanced.cleanFinal.title", "Clean Final Output"),
-        description: t("ocr.tooltip.advanced.cleanFinal.text", "Post-processes the final PDF by removing OCR artefacts and optimising the text layer for better readability and smaller file size.")
-      }
-    ]
+        description: t(
+          "ocr.tooltip.advanced.cleanFinal.text",
+          "Post-processes the final PDF by removing OCR artefacts and optimising the text layer for better readability and smaller file size.",
+        ),
+      },
+    ],
   };
 };
diff --git a/frontend/src/core/components/tooltips/useAutoRenameTips.ts b/frontend/src/core/components/tooltips/useAutoRenameTips.ts
index d46c86c75f..3239cc0eaa 100644
--- a/frontend/src/core/components/tooltips/useAutoRenameTips.ts
+++ b/frontend/src/core/components/tooltips/useAutoRenameTips.ts
@@ -1,26 +1,38 @@
-import { useTranslation } from 'react-i18next';
-import { TooltipContent } from '@app/types/tips';
+import { useTranslation } from "react-i18next";
+import { TooltipContent } from "@app/types/tips";
 
 export const useAutoRenameTips = (): TooltipContent => {
   const { t } = useTranslation();
 
   return {
     header: {
-      title: t("auto-rename.tooltip.header.title", "How Auto-Rename Works")
+      title: t("auto-rename.tooltip.header.title", "How Auto-Rename Works"),
     },
     tips: [
       {
         title: t("auto-rename.tooltip.description.title", "What it does"),
-        description: t("auto-rename.description", "Automatically finds the title from your PDF content and uses it as the filename."),
+        description: t(
+          "auto-rename.description",
+          "Automatically finds the title from your PDF content and uses it as the filename.",
+        ),
       },
       {
         title: t("auto-rename.tooltip.howItWorks.title", "Smart Renaming"),
         bullets: [
-          t("auto-rename.tooltip.howItWorks.bullet1", "Looks for text that appears to be a title or heading"),
-          t("auto-rename.tooltip.howItWorks.bullet2", "Creates a clean, valid filename from the detected title"),
-          t("auto-rename.tooltip.howItWorks.bullet3", "Keeps the original name if no suitable title is found")
-        ]
-      }
-    ]
+          t(
+            "auto-rename.tooltip.howItWorks.bullet1",
+            "Looks for text that appears to be a title or heading",
+          ),
+          t(
+            "auto-rename.tooltip.howItWorks.bullet2",
+            "Creates a clean, valid filename from the detected title",
+          ),
+          t(
+            "auto-rename.tooltip.howItWorks.bullet3",
+            "Keeps the original name if no suitable title is found",
+          ),
+        ],
+      },
+    ],
   };
 };
diff --git a/frontend/src/core/components/tooltips/useBookletImpositionTips.ts b/frontend/src/core/components/tooltips/useBookletImpositionTips.ts
index f453f22b8b..af885e6ba2 100644
--- a/frontend/src/core/components/tooltips/useBookletImpositionTips.ts
+++ b/frontend/src/core/components/tooltips/useBookletImpositionTips.ts
@@ -1,57 +1,135 @@
-import { useTranslation } from 'react-i18next';
-import { TooltipContent } from '@app/types/tips';
+import { useTranslation } from "react-i18next";
+import { TooltipContent } from "@app/types/tips";
 
 export const useBookletImpositionTips = (): TooltipContent => {
   const { t } = useTranslation();
 
   return {
     header: {
-      title: t("bookletImposition.tooltip.header.title", "Booklet Creation Guide")
+      title: t(
+        "bookletImposition.tooltip.header.title",
+        "Booklet Creation Guide",
+      ),
     },
     tips: [
       {
-        title: t("bookletImposition.tooltip.description.title", "What is Booklet Imposition?"),
-        description: t("bookletImposition.tooltip.description.text", "Creates professional booklets by arranging pages in the correct printing order. Your PDF pages are placed 2-up on landscape sheets so when folded and bound, they read in proper sequence like a real book.")
+        title: t(
+          "bookletImposition.tooltip.description.title",
+          "What is Booklet Imposition?",
+        ),
+        description: t(
+          "bookletImposition.tooltip.description.text",
+          "Creates professional booklets by arranging pages in the correct printing order. Your PDF pages are placed 2-up on landscape sheets so when folded and bound, they read in proper sequence like a real book.",
+        ),
       },
       {
-        title: t("bookletImposition.tooltip.example.title", "Example: 8-Page Booklet"),
-        description: t("bookletImposition.tooltip.example.text", "Your 8-page document becomes 2 sheets:"),
+        title: t(
+          "bookletImposition.tooltip.example.title",
+          "Example: 8-Page Booklet",
+        ),
+        description: t(
+          "bookletImposition.tooltip.example.text",
+          "Your 8-page document becomes 2 sheets:",
+        ),
         bullets: [
-          t("bookletImposition.tooltip.example.bullet1", "Sheet 1 Front: Pages 8, 1  |  Back: Pages 2, 7"),
-          t("bookletImposition.tooltip.example.bullet2", "Sheet 2 Front: Pages 6, 3  |  Back: Pages 4, 5"),
-          t("bookletImposition.tooltip.example.bullet3", "When folded & stacked: Reads 1→2→3→4→5→6→7→8")
-        ]
+          t(
+            "bookletImposition.tooltip.example.bullet1",
+            "Sheet 1 Front: Pages 8, 1  |  Back: Pages 2, 7",
+          ),
+          t(
+            "bookletImposition.tooltip.example.bullet2",
+            "Sheet 2 Front: Pages 6, 3  |  Back: Pages 4, 5",
+          ),
+          t(
+            "bookletImposition.tooltip.example.bullet3",
+            "When folded & stacked: Reads 1→2→3→4→5→6→7→8",
+          ),
+        ],
       },
       {
-        title: t("bookletImposition.tooltip.printing.title", "How to Print & Assemble"),
-        description: t("bookletImposition.tooltip.printing.text", "Follow these steps for perfect booklets:"),
+        title: t(
+          "bookletImposition.tooltip.printing.title",
+          "How to Print & Assemble",
+        ),
+        description: t(
+          "bookletImposition.tooltip.printing.text",
+          "Follow these steps for perfect booklets:",
+        ),
         bullets: [
-          t("bookletImposition.tooltip.printing.bullet1", "Print double-sided with 'Flip on long edge'"),
-          t("bookletImposition.tooltip.printing.bullet2", "Stack sheets in order, fold in half"),
-          t("bookletImposition.tooltip.printing.bullet3", "Staple or bind along the folded spine"),
-          t("bookletImposition.tooltip.printing.bullet4", "For short-edge printers: Enable 'Flip on short edge' option")
-        ]
+          t(
+            "bookletImposition.tooltip.printing.bullet1",
+            "Print double-sided with 'Flip on long edge'",
+          ),
+          t(
+            "bookletImposition.tooltip.printing.bullet2",
+            "Stack sheets in order, fold in half",
+          ),
+          t(
+            "bookletImposition.tooltip.printing.bullet3",
+            "Staple or bind along the folded spine",
+          ),
+          t(
+            "bookletImposition.tooltip.printing.bullet4",
+            "For short-edge printers: Enable 'Flip on short edge' option",
+          ),
+        ],
       },
       {
-        title: t("bookletImposition.tooltip.manualDuplex.title", "Manual Duplex (Single-sided Printers)"),
-        description: t("bookletImposition.tooltip.manualDuplex.text", "For printers without automatic duplex:"),
+        title: t(
+          "bookletImposition.tooltip.manualDuplex.title",
+          "Manual Duplex (Single-sided Printers)",
+        ),
+        description: t(
+          "bookletImposition.tooltip.manualDuplex.text",
+          "For printers without automatic duplex:",
+        ),
         bullets: [
-          t("bookletImposition.tooltip.manualDuplex.bullet1", "Turn OFF 'Double-sided printing'"),
-          t("bookletImposition.tooltip.manualDuplex.bullet2", "Select '1st Pass' → Print → Stack face-down"),
-          t("bookletImposition.tooltip.manualDuplex.bullet3", "Select '2nd Pass' → Load stack → Print backs"),
-          t("bookletImposition.tooltip.manualDuplex.bullet4", "Fold and assemble as normal")
-        ]
+          t(
+            "bookletImposition.tooltip.manualDuplex.bullet1",
+            "Turn OFF 'Double-sided printing'",
+          ),
+          t(
+            "bookletImposition.tooltip.manualDuplex.bullet2",
+            "Select '1st Pass' → Print → Stack face-down",
+          ),
+          t(
+            "bookletImposition.tooltip.manualDuplex.bullet3",
+            "Select '2nd Pass' → Load stack → Print backs",
+          ),
+          t(
+            "bookletImposition.tooltip.manualDuplex.bullet4",
+            "Fold and assemble as normal",
+          ),
+        ],
       },
       {
-        title: t("bookletImposition.tooltip.advanced.title", "Advanced Options"),
-        description: t("bookletImposition.tooltip.advanced.text", "Fine-tune your booklet:"),
+        title: t(
+          "bookletImposition.tooltip.advanced.title",
+          "Advanced Options",
+        ),
+        description: t(
+          "bookletImposition.tooltip.advanced.text",
+          "Fine-tune your booklet:",
+        ),
         bullets: [
-          t("bookletImposition.tooltip.advanced.bullet1", "Right-to-Left Binding: For Arabic, Hebrew, or RTL languages"),
-          t("bookletImposition.tooltip.advanced.bullet2", "Borders: Shows cut lines for trimming"),
-          t("bookletImposition.tooltip.advanced.bullet3", "Gutter Margin: Adds space for binding/stapling"),
-          t("bookletImposition.tooltip.advanced.bullet4", "Short-edge Flip: Only for automatic duplex printers")
-        ]
-      }
-    ]
+          t(
+            "bookletImposition.tooltip.advanced.bullet1",
+            "Right-to-Left Binding: For Arabic, Hebrew, or RTL languages",
+          ),
+          t(
+            "bookletImposition.tooltip.advanced.bullet2",
+            "Borders: Shows cut lines for trimming",
+          ),
+          t(
+            "bookletImposition.tooltip.advanced.bullet3",
+            "Gutter Margin: Adds space for binding/stapling",
+          ),
+          t(
+            "bookletImposition.tooltip.advanced.bullet4",
+            "Short-edge Flip: Only for automatic duplex printers",
+          ),
+        ],
+      },
+    ],
   };
-};
\ No newline at end of file
+};
diff --git a/frontend/src/core/components/tooltips/useCertSignTooltips.ts b/frontend/src/core/components/tooltips/useCertSignTooltips.ts
index 4cc4805020..1588e9fea1 100644
--- a/frontend/src/core/components/tooltips/useCertSignTooltips.ts
+++ b/frontend/src/core/components/tooltips/useCertSignTooltips.ts
@@ -1,45 +1,93 @@
-import { useTranslation } from 'react-i18next';
-import { TooltipContent } from '@app/types/tips';
+import { useTranslation } from "react-i18next";
+import { TooltipContent } from "@app/types/tips";
 
 export const useCertSignTooltips = (): TooltipContent => {
   const { t } = useTranslation();
 
   return {
     header: {
-      title: t("certSign.tooltip.header.title", "About Managing Signatures")
+      title: t("certSign.tooltip.header.title", "About Managing Signatures"),
     },
     tips: [
       {
         title: t("certSign.tooltip.overview.title", "What can this tool do?"),
-        description: t("certSign.tooltip.overview.text", "This tool lets you check if your PDFs are digitally signed and add new digital signatures. Digital signatures prove who created or approved a document and show if it has been changed since signing."),
+        description: t(
+          "certSign.tooltip.overview.text",
+          "This tool lets you check if your PDFs are digitally signed and add new digital signatures. Digital signatures prove who created or approved a document and show if it has been changed since signing.",
+        ),
         bullets: [
-          t("certSign.tooltip.overview.bullet1", "Check existing signatures and their validity"),
-          t("certSign.tooltip.overview.bullet2", "View detailed information about signers and certificates"),
-          t("certSign.tooltip.overview.bullet3", "Add new digital signatures to secure your documents"),
-          t("certSign.tooltip.overview.bullet4", "Multiple files supported with easy navigation")
-        ]
+          t(
+            "certSign.tooltip.overview.bullet1",
+            "Check existing signatures and their validity",
+          ),
+          t(
+            "certSign.tooltip.overview.bullet2",
+            "View detailed information about signers and certificates",
+          ),
+          t(
+            "certSign.tooltip.overview.bullet3",
+            "Add new digital signatures to secure your documents",
+          ),
+          t(
+            "certSign.tooltip.overview.bullet4",
+            "Multiple files supported with easy navigation",
+          ),
+        ],
       },
       {
         title: t("certSign.tooltip.validation.title", "Checking Signatures"),
-        description: t("certSign.tooltip.validation.text", "When you check signatures, the tool tells you if they're valid, who signed the document, when it was signed, and whether the document has been changed since signing."),
+        description: t(
+          "certSign.tooltip.validation.text",
+          "When you check signatures, the tool tells you if they're valid, who signed the document, when it was signed, and whether the document has been changed since signing.",
+        ),
         bullets: [
-          t("certSign.tooltip.validation.bullet1", "Shows if signatures are valid or invalid"),
-          t("certSign.tooltip.validation.bullet2", "Displays signer information and signing date"),
-          t("certSign.tooltip.validation.bullet3", "Checks if the document was modified after signing"),
-          t("certSign.tooltip.validation.bullet4", "Can use custom certificates for verification")
-        ]
+          t(
+            "certSign.tooltip.validation.bullet1",
+            "Shows if signatures are valid or invalid",
+          ),
+          t(
+            "certSign.tooltip.validation.bullet2",
+            "Displays signer information and signing date",
+          ),
+          t(
+            "certSign.tooltip.validation.bullet3",
+            "Checks if the document was modified after signing",
+          ),
+          t(
+            "certSign.tooltip.validation.bullet4",
+            "Can use custom certificates for verification",
+          ),
+        ],
       },
       {
         title: t("certSign.tooltip.signing.title", "Adding Signatures"),
-        description: t("certSign.tooltip.signing.text", "To sign a PDF, you need a digital certificate (like PEM, PKCS12, or JKS). You can choose to make the signature visible on the document or keep it invisible for security only."),
+        description: t(
+          "certSign.tooltip.signing.text",
+          "To sign a PDF, you need a digital certificate (like PEM, PKCS12, or JKS). You can choose to make the signature visible on the document or keep it invisible for security only.",
+        ),
         bullets: [
-          t("certSign.tooltip.signing.bullet1", "Supports PEM, PKCS12, JKS, and server certificate formats"),
-          t("certSign.tooltip.signing.bullet2", "Option to show or hide signature on the PDF"),
-          t("certSign.tooltip.signing.bullet3", "Add reason, location, and signer name"),
-          t("certSign.tooltip.signing.bullet4", "Choose which page to place visible signatures"),
-          t("certSign.tooltip.signing.bullet5", "Use server certificate for simple 'Sign with Stirling-PDF' option")
-        ]
-      }
-    ]
+          t(
+            "certSign.tooltip.signing.bullet1",
+            "Supports PEM, PKCS12, JKS, and server certificate formats",
+          ),
+          t(
+            "certSign.tooltip.signing.bullet2",
+            "Option to show or hide signature on the PDF",
+          ),
+          t(
+            "certSign.tooltip.signing.bullet3",
+            "Add reason, location, and signer name",
+          ),
+          t(
+            "certSign.tooltip.signing.bullet4",
+            "Choose which page to place visible signatures",
+          ),
+          t(
+            "certSign.tooltip.signing.bullet5",
+            "Use server certificate for simple 'Sign with Stirling-PDF' option",
+          ),
+        ],
+      },
+    ],
   };
-};
\ No newline at end of file
+};
diff --git a/frontend/src/core/components/tooltips/useCertificateChoiceTips.ts b/frontend/src/core/components/tooltips/useCertificateChoiceTips.ts
index 26f1d41f72..12f132c40a 100644
--- a/frontend/src/core/components/tooltips/useCertificateChoiceTips.ts
+++ b/frontend/src/core/components/tooltips/useCertificateChoiceTips.ts
@@ -1,51 +1,93 @@
-import { useTranslation } from 'react-i18next';
-import { TooltipContent } from '@app/types/tips';
+import { useTranslation } from "react-i18next";
+import { TooltipContent } from "@app/types/tips";
 
 export const useCertificateChoiceTips = (): TooltipContent => {
   const { t } = useTranslation();
 
   return {
     header: {
-      title: t('certificateChoice.tooltip.header', 'Certificate Types'),
+      title: t("certificateChoice.tooltip.header", "Certificate Types"),
     },
     tips: [
       {
-        title: t('certificateChoice.tooltip.personal.title', 'Personal Certificate'),
+        title: t(
+          "certificateChoice.tooltip.personal.title",
+          "Personal Certificate",
+        ),
         description: t(
-          'certificateChoice.tooltip.personal.description',
-          'An auto-generated certificate unique to your user account. Suitable for individual signatures.'
+          "certificateChoice.tooltip.personal.description",
+          "An auto-generated certificate unique to your user account. Suitable for individual signatures.",
         ),
         bullets: [
-          t('certificateChoice.tooltip.personal.bullet1', 'Generated automatically on first use'),
-          t('certificateChoice.tooltip.personal.bullet2', 'Tied to your user account'),
-          t('certificateChoice.tooltip.personal.bullet3', 'Cannot be shared with other users'),
-          t('certificateChoice.tooltip.personal.bullet4', 'Best for: Personal documents, individual accountability'),
+          t(
+            "certificateChoice.tooltip.personal.bullet1",
+            "Generated automatically on first use",
+          ),
+          t(
+            "certificateChoice.tooltip.personal.bullet2",
+            "Tied to your user account",
+          ),
+          t(
+            "certificateChoice.tooltip.personal.bullet3",
+            "Cannot be shared with other users",
+          ),
+          t(
+            "certificateChoice.tooltip.personal.bullet4",
+            "Best for: Personal documents, individual accountability",
+          ),
         ],
       },
       {
-        title: t('certificateChoice.tooltip.organization.title', 'Organization Certificate'),
+        title: t(
+          "certificateChoice.tooltip.organization.title",
+          "Organization Certificate",
+        ),
         description: t(
-          'certificateChoice.tooltip.organization.description',
-          'A shared certificate provided by your organization. Used for company-wide signing authority.'
+          "certificateChoice.tooltip.organization.description",
+          "A shared certificate provided by your organization. Used for company-wide signing authority.",
         ),
         bullets: [
-          t('certificateChoice.tooltip.organization.bullet1', 'Managed by system administrators'),
-          t('certificateChoice.tooltip.organization.bullet2', 'Shared across authorized users'),
-          t('certificateChoice.tooltip.organization.bullet3', 'Represents company identity, not individual'),
-          t('certificateChoice.tooltip.organization.bullet4', 'Best for: Official documents, team signatures'),
+          t(
+            "certificateChoice.tooltip.organization.bullet1",
+            "Managed by system administrators",
+          ),
+          t(
+            "certificateChoice.tooltip.organization.bullet2",
+            "Shared across authorized users",
+          ),
+          t(
+            "certificateChoice.tooltip.organization.bullet3",
+            "Represents company identity, not individual",
+          ),
+          t(
+            "certificateChoice.tooltip.organization.bullet4",
+            "Best for: Official documents, team signatures",
+          ),
         ],
       },
       {
-        title: t('certificateChoice.tooltip.upload.title', 'Upload Custom P12'),
+        title: t("certificateChoice.tooltip.upload.title", "Upload Custom P12"),
         description: t(
-          'certificateChoice.tooltip.upload.description',
-          'Use your own PKCS#12 certificate file. Provides full control over certificate properties.'
+          "certificateChoice.tooltip.upload.description",
+          "Use your own PKCS#12 certificate file. Provides full control over certificate properties.",
         ),
         bullets: [
-          t('certificateChoice.tooltip.upload.bullet1', 'Requires P12/PFX file and password'),
-          t('certificateChoice.tooltip.upload.bullet2', 'Can be issued by external Certificate Authorities'),
-          t('certificateChoice.tooltip.upload.bullet3', 'Higher trust level for legal documents'),
-          t('certificateChoice.tooltip.upload.bullet4', 'Best for: Legally binding contracts, external validation'),
+          t(
+            "certificateChoice.tooltip.upload.bullet1",
+            "Requires P12/PFX file and password",
+          ),
+          t(
+            "certificateChoice.tooltip.upload.bullet2",
+            "Can be issued by external Certificate Authorities",
+          ),
+          t(
+            "certificateChoice.tooltip.upload.bullet3",
+            "Higher trust level for legal documents",
+          ),
+          t(
+            "certificateChoice.tooltip.upload.bullet4",
+            "Best for: Legally binding contracts, external validation",
+          ),
         ],
       },
     ],
diff --git a/frontend/src/core/components/tooltips/useCertificateTypeTips.ts b/frontend/src/core/components/tooltips/useCertificateTypeTips.ts
index 23633e8a49..4e68ebb76b 100644
--- a/frontend/src/core/components/tooltips/useCertificateTypeTips.ts
+++ b/frontend/src/core/components/tooltips/useCertificateTypeTips.ts
@@ -1,32 +1,62 @@
-import { useTranslation } from 'react-i18next';
-import { TooltipContent } from '@app/types/tips';
+import { useTranslation } from "react-i18next";
+import { TooltipContent } from "@app/types/tips";
 
 export const useCertificateTypeTips = (): TooltipContent => {
   const { t } = useTranslation();
 
   return {
     header: {
-      title: t("certSign.certType.tooltip.header.title", "About Certificate Types")
+      title: t(
+        "certSign.certType.tooltip.header.title",
+        "About Certificate Types",
+      ),
     },
     tips: [
       {
-        title: t("certSign.certType.tooltip.what.title", "What's a certificate?"),
-        description: t("certSign.certType.tooltip.what.text", "It's a secure ID for your signature that proves you signed. Unless you're required to sign via certificate, we recommend using another secure method like Type, Draw, or Upload.")
+        title: t(
+          "certSign.certType.tooltip.what.title",
+          "What's a certificate?",
+        ),
+        description: t(
+          "certSign.certType.tooltip.what.text",
+          "It's a secure ID for your signature that proves you signed. Unless you're required to sign via certificate, we recommend using another secure method like Type, Draw, or Upload.",
+        ),
       },
       {
-        title: t("certSign.certType.tooltip.which.title", "Which option should I use?"),
-        description: t("certSign.certType.tooltip.which.text", "Choose the format that matches your certificate file:"),
+        title: t(
+          "certSign.certType.tooltip.which.title",
+          "Which option should I use?",
+        ),
+        description: t(
+          "certSign.certType.tooltip.which.text",
+          "Choose the format that matches your certificate file:",
+        ),
         bullets: [
-          t("certSign.certType.tooltip.which.bullet1", "PKCS12 (.p12) – one combined file (most common)"),
-          t("certSign.certType.tooltip.which.bullet2", "PFX (.pfx) – Microsoft's version of PKCS12"),
-          t("certSign.certType.tooltip.which.bullet3", "PEM – separate private-key and certificate .pem files"),
-          t("certSign.certType.tooltip.which.bullet4", "JKS – Java .jks keystore for dev / CI-CD workflows")
-        ]
+          t(
+            "certSign.certType.tooltip.which.bullet1",
+            "PKCS12 (.p12) – one combined file (most common)",
+          ),
+          t(
+            "certSign.certType.tooltip.which.bullet2",
+            "PFX (.pfx) – Microsoft's version of PKCS12",
+          ),
+          t(
+            "certSign.certType.tooltip.which.bullet3",
+            "PEM – separate private-key and certificate .pem files",
+          ),
+          t(
+            "certSign.certType.tooltip.which.bullet4",
+            "JKS – Java .jks keystore for dev / CI-CD workflows",
+          ),
+        ],
       },
       {
         title: t("certSign.certType.tooltip.convert.title", "Key not listed?"),
-        description: t("certSign.certType.tooltip.convert.text", "Convert your file to a Java keystore (.jks) with keytool, then pick JKS.")
-      }
-    ]
+        description: t(
+          "certSign.certType.tooltip.convert.text",
+          "Convert your file to a Java keystore (.jks) with keytool, then pick JKS.",
+        ),
+      },
+    ],
   };
-};
\ No newline at end of file
+};
diff --git a/frontend/src/core/components/tooltips/useChangeMetadataTips.ts b/frontend/src/core/components/tooltips/useChangeMetadataTips.ts
index 60e2e17d26..26975f000d 100644
--- a/frontend/src/core/components/tooltips/useChangeMetadataTips.ts
+++ b/frontend/src/core/components/tooltips/useChangeMetadataTips.ts
@@ -1,18 +1,24 @@
-import { useTranslation } from 'react-i18next';
-import { TooltipContent } from '@app/types/tips';
+import { useTranslation } from "react-i18next";
+import { TooltipContent } from "@app/types/tips";
 
 export const useDeleteAllTips = (): TooltipContent => {
   const { t } = useTranslation();
 
   return {
     header: {
-      title: t("changeMetadata.tooltip.deleteAll.title", "Remove Existing Metadata")
+      title: t(
+        "changeMetadata.tooltip.deleteAll.title",
+        "Remove Existing Metadata",
+      ),
     },
     tips: [
       {
-        description: t("changeMetadata.tooltip.deleteAll.text", "Complete metadata deletion to ensure privacy."),
-      }
-    ]
+        description: t(
+          "changeMetadata.tooltip.deleteAll.text",
+          "Complete metadata deletion to ensure privacy.",
+        ),
+      },
+    ],
   };
 };
 
@@ -21,20 +27,41 @@ export const useStandardMetadataTips = (): TooltipContent => {
 
   return {
     header: {
-      title: t("changeMetadata.tooltip.standardFields.title", "Standard Fields")
+      title: t(
+        "changeMetadata.tooltip.standardFields.title",
+        "Standard Fields",
+      ),
     },
     tips: [
       {
-        description: t("changeMetadata.tooltip.standardFields.text", "Common PDF metadata fields that describe the document."),
+        description: t(
+          "changeMetadata.tooltip.standardFields.text",
+          "Common PDF metadata fields that describe the document.",
+        ),
         bullets: [
-          t("changeMetadata.tooltip.standardFields.bullet1", "Title: Document name or heading"),
-          t("changeMetadata.tooltip.standardFields.bullet2", "Author: Person who created the document"),
-          t("changeMetadata.tooltip.standardFields.bullet3", "Subject: Brief description of content"),
-          t("changeMetadata.tooltip.standardFields.bullet4", "Keywords: Search terms for the document"),
-          t("changeMetadata.tooltip.standardFields.bullet5", "Creator/Producer: Software used to create the PDF")
-        ]
-      }
-    ]
+          t(
+            "changeMetadata.tooltip.standardFields.bullet1",
+            "Title: Document name or heading",
+          ),
+          t(
+            "changeMetadata.tooltip.standardFields.bullet2",
+            "Author: Person who created the document",
+          ),
+          t(
+            "changeMetadata.tooltip.standardFields.bullet3",
+            "Subject: Brief description of content",
+          ),
+          t(
+            "changeMetadata.tooltip.standardFields.bullet4",
+            "Keywords: Search terms for the document",
+          ),
+          t(
+            "changeMetadata.tooltip.standardFields.bullet5",
+            "Creator/Producer: Software used to create the PDF",
+          ),
+        ],
+      },
+    ],
   };
 };
 
@@ -43,17 +70,26 @@ export const useDocumentDatesTips = (): TooltipContent => {
 
   return {
     header: {
-      title: t("changeMetadata.tooltip.dates.title", "Date Fields")
+      title: t("changeMetadata.tooltip.dates.title", "Date Fields"),
     },
     tips: [
       {
-        description: t("changeMetadata.tooltip.dates.text", "When the document was created and modified."),
+        description: t(
+          "changeMetadata.tooltip.dates.text",
+          "When the document was created and modified.",
+        ),
         bullets: [
-          t("changeMetadata.tooltip.dates.bullet1", "Creation Date: When original document was made"),
-          t("changeMetadata.tooltip.dates.bullet2", "Modification Date: When last changed"),
-        ]
-      }
-    ]
+          t(
+            "changeMetadata.tooltip.dates.bullet1",
+            "Creation Date: When original document was made",
+          ),
+          t(
+            "changeMetadata.tooltip.dates.bullet2",
+            "Modification Date: When last changed",
+          ),
+        ],
+      },
+    ],
   };
 };
 
@@ -62,18 +98,30 @@ export const useCustomMetadataTips = (): TooltipContent => {
 
   return {
     header: {
-      title: t("changeMetadata.tooltip.customFields.title", "Custom Metadata")
+      title: t("changeMetadata.tooltip.customFields.title", "Custom Metadata"),
     },
     tips: [
       {
-        description: t("changeMetadata.tooltip.customFields.text", "Add your own custom key-value metadata pairs."),
+        description: t(
+          "changeMetadata.tooltip.customFields.text",
+          "Add your own custom key-value metadata pairs.",
+        ),
         bullets: [
-          t("changeMetadata.tooltip.customFields.bullet1", "Add any custom fields relevant to your document"),
-          t("changeMetadata.tooltip.customFields.bullet2", "Examples: Department, Project, Version, Status"),
-          t("changeMetadata.tooltip.customFields.bullet3", "Both key and value are required for each entry")
-        ]
-      }
-    ]
+          t(
+            "changeMetadata.tooltip.customFields.bullet1",
+            "Add any custom fields relevant to your document",
+          ),
+          t(
+            "changeMetadata.tooltip.customFields.bullet2",
+            "Examples: Department, Project, Version, Status",
+          ),
+          t(
+            "changeMetadata.tooltip.customFields.bullet3",
+            "Both key and value are required for each entry",
+          ),
+        ],
+      },
+    ],
   };
 };
 
@@ -82,27 +130,57 @@ export const useAdvancedOptionsTips = (): TooltipContent => {
 
   return {
     header: {
-      title: t("changeMetadata.tooltip.advanced.title", "Advanced Options")
+      title: t("changeMetadata.tooltip.advanced.title", "Advanced Options"),
     },
     tips: [
       {
-        title: t("changeMetadata.tooltip.advanced.trapped.title", "Trapped Status"),
-        description: t("changeMetadata.tooltip.advanced.trapped.description", "Indicates if document is prepared for high-quality printing."),
+        title: t(
+          "changeMetadata.tooltip.advanced.trapped.title",
+          "Trapped Status",
+        ),
+        description: t(
+          "changeMetadata.tooltip.advanced.trapped.description",
+          "Indicates if document is prepared for high-quality printing.",
+        ),
         bullets: [
-          t("changeMetadata.tooltip.advanced.trapped.bullet1", "True: Document has been trapped for printing"),
-          t("changeMetadata.tooltip.advanced.trapped.bullet2", "False: Document has not been trapped"),
-          t("changeMetadata.tooltip.advanced.trapped.bullet3", "Unknown: Trapped status is not specified")
-        ]
+          t(
+            "changeMetadata.tooltip.advanced.trapped.bullet1",
+            "True: Document has been trapped for printing",
+          ),
+          t(
+            "changeMetadata.tooltip.advanced.trapped.bullet2",
+            "False: Document has not been trapped",
+          ),
+          t(
+            "changeMetadata.tooltip.advanced.trapped.bullet3",
+            "Unknown: Trapped status is not specified",
+          ),
+        ],
       },
       {
-        title: t("changeMetadata.tooltip.customFields.title", "Custom Metadata"),
-        description: t("changeMetadata.tooltip.customFields.text", "Add your own custom key-value metadata pairs."),
+        title: t(
+          "changeMetadata.tooltip.customFields.title",
+          "Custom Metadata",
+        ),
+        description: t(
+          "changeMetadata.tooltip.customFields.text",
+          "Add your own custom key-value metadata pairs.",
+        ),
         bullets: [
-          t("changeMetadata.tooltip.customFields.bullet1", "Add any custom fields relevant to your document"),
-          t("changeMetadata.tooltip.customFields.bullet2", "Examples: Department, Project, Version, Status"),
-          t("changeMetadata.tooltip.customFields.bullet3", "Both key and value are required for each entry")
-        ]
-      }
-    ]
+          t(
+            "changeMetadata.tooltip.customFields.bullet1",
+            "Add any custom fields relevant to your document",
+          ),
+          t(
+            "changeMetadata.tooltip.customFields.bullet2",
+            "Examples: Department, Project, Version, Status",
+          ),
+          t(
+            "changeMetadata.tooltip.customFields.bullet3",
+            "Both key and value are required for each entry",
+          ),
+        ],
+      },
+    ],
   };
 };
diff --git a/frontend/src/core/components/tooltips/useChangePermissionsTips.ts b/frontend/src/core/components/tooltips/useChangePermissionsTips.ts
index 9075f8a960..9bd20bc207 100644
--- a/frontend/src/core/components/tooltips/useChangePermissionsTips.ts
+++ b/frontend/src/core/components/tooltips/useChangePermissionsTips.ts
@@ -1,21 +1,27 @@
-import { useTranslation } from 'react-i18next';
-import { TooltipContent } from '@app/types/tips';
+import { useTranslation } from "react-i18next";
+import { TooltipContent } from "@app/types/tips";
 
 export const useChangePermissionsTips = (): TooltipContent => {
   const { t } = useTranslation();
 
   return {
     header: {
-      title: t("changePermissions.tooltip.header.title", "Change Permissions")
+      title: t("changePermissions.tooltip.header.title", "Change Permissions"),
     },
     tips: [
       {
-        description: t("changePermissions.tooltip.description.text", "Changes document permissions, allowing/disallowing access to different features in PDF readers.")
+        description: t(
+          "changePermissions.tooltip.description.text",
+          "Changes document permissions, allowing/disallowing access to different features in PDF readers.",
+        ),
       },
       {
         title: t("warning.tooltipTitle", "Warning"),
-        description: t("changePermissions.tooltip.warning.text", "To make these permissions unchangeable, use the Add Password tool to set an owner password.")
-      }
-    ]
+        description: t(
+          "changePermissions.tooltip.warning.text",
+          "To make these permissions unchangeable, use the Add Password tool to set an owner password.",
+        ),
+      },
+    ],
   };
 };
diff --git a/frontend/src/core/components/tooltips/useCompressTips.ts b/frontend/src/core/components/tooltips/useCompressTips.ts
index 3b5299e08e..0c69a0436a 100644
--- a/frontend/src/core/components/tooltips/useCompressTips.ts
+++ b/frontend/src/core/components/tooltips/useCompressTips.ts
@@ -1,37 +1,55 @@
-import { useTranslation } from 'react-i18next';
-import { TooltipContent } from '@app/types/tips';
+import { useTranslation } from "react-i18next";
+import { TooltipContent } from "@app/types/tips";
 
 export const useCompressTips = (): TooltipContent => {
   const { t } = useTranslation();
 
   return {
     header: {
-      title: t("compress.tooltip.header.title", "Compress Settings Overview")
+      title: t("compress.tooltip.header.title", "Compress Settings Overview"),
     },
     tips: [
       {
         title: t("compress.tooltip.description.title", "Description"),
-        description: t("compress.tooltip.description.text", "Compression is an easy way to reduce your file size. Pick File Size to enter a target size and have us adjust quality for you. Pick Quality to set compression strength manually.")
+        description: t(
+          "compress.tooltip.description.text",
+          "Compression is an easy way to reduce your file size. Pick File Size to enter a target size and have us adjust quality for you. Pick Quality to set compression strength manually.",
+        ),
       },
       {
-        title: t("compress.tooltip.qualityAdjustment.title", "Quality Adjustment"),
-        description: t("compress.tooltip.qualityAdjustment.text", "Drag the slider to adjust the compression strength. Lower values (1-3) preserve quality but result in larger files. Higher values (7-9) shrink the file more but reduce image clarity."),
+        title: t(
+          "compress.tooltip.qualityAdjustment.title",
+          "Quality Adjustment",
+        ),
+        description: t(
+          "compress.tooltip.qualityAdjustment.text",
+          "Drag the slider to adjust the compression strength. Lower values (1-3) preserve quality but result in larger files. Higher values (7-9) shrink the file more but reduce image clarity.",
+        ),
         bullets: [
-          t("compress.tooltip.qualityAdjustment.bullet1", "Lower values preserve quality"),
-          t("compress.tooltip.qualityAdjustment.bullet2", "Higher values reduce file size")
-        ]
+          t(
+            "compress.tooltip.qualityAdjustment.bullet1",
+            "Lower values preserve quality",
+          ),
+          t(
+            "compress.tooltip.qualityAdjustment.bullet2",
+            "Higher values reduce file size",
+          ),
+        ],
       },
       {
         title: t("compress.tooltip.grayscale.title", "Grayscale"),
-        description: t("compress.tooltip.grayscale.text", "Select this option to convert all images to black and white, which can significantly reduce file size especially for scanned PDFs or image-heavy documents.")
+        description: t(
+          "compress.tooltip.grayscale.text",
+          "Select this option to convert all images to black and white, which can significantly reduce file size especially for scanned PDFs or image-heavy documents.",
+        ),
       },
       {
         title: t("compress.tooltip.lineArt.title", "Line Art"),
         description: t(
           "compress.tooltip.lineArt.text",
-          "Convert pages to high-contrast black and white using ImageMagick. Use line thickness to control the threshold percentage and detection strength to choose how aggressively edges are outlined."
-        )
-      }
-    ]
+          "Convert pages to high-contrast black and white using ImageMagick. Use line thickness to control the threshold percentage and detection strength to choose how aggressively edges are outlined.",
+        ),
+      },
+    ],
   };
 };
diff --git a/frontend/src/core/components/tooltips/useCropTooltips.ts b/frontend/src/core/components/tooltips/useCropTooltips.ts
index 5ca0ebaecc..d9bab45481 100644
--- a/frontend/src/core/components/tooltips/useCropTooltips.ts
+++ b/frontend/src/core/components/tooltips/useCropTooltips.ts
@@ -1,21 +1,30 @@
-import { useTranslation } from 'react-i18next';
+import { useTranslation } from "react-i18next";
 
 export function useCropTooltips() {
   const { t } = useTranslation();
 
   return {
     header: {
-      title: t("crop.tooltip.title", "How to Crop PDFs")
+      title: t("crop.tooltip.title", "How to Crop PDFs"),
     },
     tips: [
       {
-        description: t("crop.tooltip.description", "Select the area to crop from your PDF by dragging and resizing the blue overlay on the thumbnail."),
+        description: t(
+          "crop.tooltip.description",
+          "Select the area to crop from your PDF by dragging and resizing the blue overlay on the thumbnail.",
+        ),
         bullets: [
           t("crop.tooltip.drag", "Drag the overlay to move the crop area"),
-          t("crop.tooltip.resize", "Drag the corner and edge handles to resize"),
-          t("crop.tooltip.precision", "Use coordinate inputs for precise positioning"),
-        ]
-      }
-    ]
+          t(
+            "crop.tooltip.resize",
+            "Drag the corner and edge handles to resize",
+          ),
+          t(
+            "crop.tooltip.precision",
+            "Use coordinate inputs for precise positioning",
+          ),
+        ],
+      },
+    ],
   };
 }
diff --git a/frontend/src/core/components/tooltips/useExtractPagesTips.ts b/frontend/src/core/components/tooltips/useExtractPagesTips.ts
index 7c13b30c2a..5dcaf031a4 100644
--- a/frontend/src/core/components/tooltips/useExtractPagesTips.ts
+++ b/frontend/src/core/components/tooltips/useExtractPagesTips.ts
@@ -1,6 +1,6 @@
-import { useTranslation } from 'react-i18next';
-import { TooltipContent } from '@app/types/tips';
-import { usePageSelectionTips } from '@app/components/tooltips/usePageSelectionTips';
+import { useTranslation } from "react-i18next";
+import { TooltipContent } from "@app/types/tips";
+import { usePageSelectionTips } from "@app/components/tooltips/usePageSelectionTips";
 
 export const useExtractPagesTips = (): TooltipContent => {
   const { t } = useTranslation();
@@ -10,13 +10,14 @@ export const useExtractPagesTips = (): TooltipContent => {
     header: base.header,
     tips: [
       {
-        description: t('extractPages.tooltip.description', 'Extracts the selected pages into a new PDF, preserving order.')
+        description: t(
+          "extractPages.tooltip.description",
+          "Extracts the selected pages into a new PDF, preserving order.",
+        ),
       },
-      ...(base.tips || [])
-    ]
+      ...(base.tips || []),
+    ],
   };
 };
 
 export default useExtractPagesTips;
-
-
diff --git a/frontend/src/core/components/tooltips/useFlattenTips.ts b/frontend/src/core/components/tooltips/useFlattenTips.ts
index aa927594ba..cc4d07620a 100644
--- a/frontend/src/core/components/tooltips/useFlattenTips.ts
+++ b/frontend/src/core/components/tooltips/useFlattenTips.ts
@@ -1,34 +1,67 @@
-import { useTranslation } from 'react-i18next';
-import { TooltipContent } from '@app/types/tips';
+import { useTranslation } from "react-i18next";
+import { TooltipContent } from "@app/types/tips";
 
 export const useFlattenTips = (): TooltipContent => {
   const { t } = useTranslation();
 
   return {
     header: {
-      title: t("flatten.tooltip.header.title", "About Flattening PDFs")
+      title: t("flatten.tooltip.header.title", "About Flattening PDFs"),
     },
     tips: [
       {
-        title: t("flatten.tooltip.description.title", "What does flattening do?"),
-        description: t("flatten.tooltip.description.text", "Flattening makes your PDF non-editable by turning fillable forms and buttons into regular text and images. The PDF will look exactly the same, but no one can change or fill in the forms anymore. Perfect for sharing completed forms, creating final documents for records, or ensuring the PDF looks the same everywhere."),
+        title: t(
+          "flatten.tooltip.description.title",
+          "What does flattening do?",
+        ),
+        description: t(
+          "flatten.tooltip.description.text",
+          "Flattening makes your PDF non-editable by turning fillable forms and buttons into regular text and images. The PDF will look exactly the same, but no one can change or fill in the forms anymore. Perfect for sharing completed forms, creating final documents for records, or ensuring the PDF looks the same everywhere.",
+        ),
         bullets: [
-          t("flatten.tooltip.description.bullet1", "Text boxes become regular text (can't be edited)"),
-          t("flatten.tooltip.description.bullet2", "Checkboxes and buttons become pictures"),
-          t("flatten.tooltip.description.bullet3", "Great for final versions you don't want changed"),
-          t("flatten.tooltip.description.bullet4", "Ensures consistent appearance across all devices")
-        ]
+          t(
+            "flatten.tooltip.description.bullet1",
+            "Text boxes become regular text (can't be edited)",
+          ),
+          t(
+            "flatten.tooltip.description.bullet2",
+            "Checkboxes and buttons become pictures",
+          ),
+          t(
+            "flatten.tooltip.description.bullet3",
+            "Great for final versions you don't want changed",
+          ),
+          t(
+            "flatten.tooltip.description.bullet4",
+            "Ensures consistent appearance across all devices",
+          ),
+        ],
       },
       {
-        title: t("flatten.tooltip.formsOnly.title", "What does 'Flatten only forms' mean?"),
-        description: t("flatten.tooltip.formsOnly.text", "This option only removes the ability to fill in forms, but keeps other features working like clicking links, viewing bookmarks, and reading comments."),
+        title: t(
+          "flatten.tooltip.formsOnly.title",
+          "What does 'Flatten only forms' mean?",
+        ),
+        description: t(
+          "flatten.tooltip.formsOnly.text",
+          "This option only removes the ability to fill in forms, but keeps other features working like clicking links, viewing bookmarks, and reading comments.",
+        ),
         bullets: [
           t("flatten.tooltip.formsOnly.bullet1", "Forms become non-editable"),
-          t("flatten.tooltip.formsOnly.bullet2", "Links still work when clicked"),
-          t("flatten.tooltip.formsOnly.bullet3", "Comments and notes remain visible"),
-          t("flatten.tooltip.formsOnly.bullet4", "Bookmarks still help you navigate")
-        ]
-      }
-    ]
+          t(
+            "flatten.tooltip.formsOnly.bullet2",
+            "Links still work when clicked",
+          ),
+          t(
+            "flatten.tooltip.formsOnly.bullet3",
+            "Comments and notes remain visible",
+          ),
+          t(
+            "flatten.tooltip.formsOnly.bullet4",
+            "Bookmarks still help you navigate",
+          ),
+        ],
+      },
+    ],
   };
-};
\ No newline at end of file
+};
diff --git a/frontend/src/core/components/tooltips/useGroupSigningTips.ts b/frontend/src/core/components/tooltips/useGroupSigningTips.ts
index d653b59560..34b55a7a57 100644
--- a/frontend/src/core/components/tooltips/useGroupSigningTips.ts
+++ b/frontend/src/core/components/tooltips/useGroupSigningTips.ts
@@ -1,48 +1,78 @@
-import { useTranslation } from 'react-i18next';
-import { TooltipContent } from '@app/types/tips';
+import { useTranslation } from "react-i18next";
+import { TooltipContent } from "@app/types/tips";
 
 export const useGroupSigningTips = (): TooltipContent => {
   const { t } = useTranslation();
 
   return {
     header: {
-      title: t('groupSigning.tooltip.header', 'About Group Signing'),
+      title: t("groupSigning.tooltip.header", "About Group Signing"),
     },
     tips: [
       {
-        title: t('groupSigning.tooltip.sequential.title', 'Sequential Signing'),
+        title: t("groupSigning.tooltip.sequential.title", "Sequential Signing"),
         description: t(
-          'groupSigning.tooltip.sequential.description',
-          'Participants sign documents in the order you specify. Each signer receives a notification when it is their turn.'
+          "groupSigning.tooltip.sequential.description",
+          "Participants sign documents in the order you specify. Each signer receives a notification when it is their turn.",
         ),
         bullets: [
-          t('groupSigning.tooltip.sequential.bullet1', 'First participant must sign before the second can access the document'),
-          t('groupSigning.tooltip.sequential.bullet2', 'Ensures proper signing order for legal compliance'),
-          t('groupSigning.tooltip.sequential.bullet3', 'You can reorder participants by dragging them in the list'),
+          t(
+            "groupSigning.tooltip.sequential.bullet1",
+            "First participant must sign before the second can access the document",
+          ),
+          t(
+            "groupSigning.tooltip.sequential.bullet2",
+            "Ensures proper signing order for legal compliance",
+          ),
+          t(
+            "groupSigning.tooltip.sequential.bullet3",
+            "You can reorder participants by dragging them in the list",
+          ),
         ],
       },
       {
-        title: t('groupSigning.tooltip.roles.title', 'Participant Roles'),
+        title: t("groupSigning.tooltip.roles.title", "Participant Roles"),
         description: t(
-          'groupSigning.tooltip.roles.description',
-          'You control the signature appearance settings for all participants.'
+          "groupSigning.tooltip.roles.description",
+          "You control the signature appearance settings for all participants.",
         ),
         bullets: [
-          t('groupSigning.tooltip.roles.bullet1', 'Owner (you): Creates session, configures signature defaults, finalizes document'),
-          t('groupSigning.tooltip.roles.bullet2', 'Participants: Create their signature, choose certificate, place on PDF'),
-          t('groupSigning.tooltip.roles.bullet3', 'Participants cannot modify signature visibility, reason, or location settings'),
+          t(
+            "groupSigning.tooltip.roles.bullet1",
+            "Owner (you): Creates session, configures signature defaults, finalizes document",
+          ),
+          t(
+            "groupSigning.tooltip.roles.bullet2",
+            "Participants: Create their signature, choose certificate, place on PDF",
+          ),
+          t(
+            "groupSigning.tooltip.roles.bullet3",
+            "Participants cannot modify signature visibility, reason, or location settings",
+          ),
         ],
       },
       {
-        title: t('groupSigning.tooltip.finalization.title', 'Finalization Process'),
+        title: t(
+          "groupSigning.tooltip.finalization.title",
+          "Finalization Process",
+        ),
         description: t(
-          'groupSigning.tooltip.finalization.description',
-          'Once all participants have signed (or you choose to finalize early), you can generate the final signed PDF.'
+          "groupSigning.tooltip.finalization.description",
+          "Once all participants have signed (or you choose to finalize early), you can generate the final signed PDF.",
         ),
         bullets: [
-          t('groupSigning.tooltip.finalization.bullet1', 'All signatures are applied in the participant order you specified'),
-          t('groupSigning.tooltip.finalization.bullet2', 'You can finalize with partial signatures if needed'),
-          t('groupSigning.tooltip.finalization.bullet3', 'Once finalized, the session cannot be modified'),
+          t(
+            "groupSigning.tooltip.finalization.bullet1",
+            "All signatures are applied in the participant order you specified",
+          ),
+          t(
+            "groupSigning.tooltip.finalization.bullet2",
+            "You can finalize with partial signatures if needed",
+          ),
+          t(
+            "groupSigning.tooltip.finalization.bullet3",
+            "Once finalized, the session cannot be modified",
+          ),
         ],
       },
     ],
diff --git a/frontend/src/core/components/tooltips/useMergeTips.tsx b/frontend/src/core/components/tooltips/useMergeTips.tsx
index 741adccce5..9f9a95fcdb 100644
--- a/frontend/src/core/components/tooltips/useMergeTips.tsx
+++ b/frontend/src/core/components/tooltips/useMergeTips.tsx
@@ -1,22 +1,34 @@
-import { useTranslation } from 'react-i18next';
-import { TooltipContent } from '@app/types/tips';
+import { useTranslation } from "react-i18next";
+import { TooltipContent } from "@app/types/tips";
 
 export const useMergeTips = (): TooltipContent => {
   const { t } = useTranslation();
 
   return {
     header: {
-      title: t('merge.tooltip.header.title', 'Merge Settings Overview')
+      title: t("merge.tooltip.header.title", "Merge Settings Overview"),
     },
     tips: [
       {
-        title: t('merge.removeDigitalSignature.tooltip.title', 'Remove Digital Signature'),
-        description: t('merge.removeDigitalSignature.tooltip.description', 'Digital signatures will be invalidated when merging files. Check this to remove them from the final merged PDF.')
+        title: t(
+          "merge.removeDigitalSignature.tooltip.title",
+          "Remove Digital Signature",
+        ),
+        description: t(
+          "merge.removeDigitalSignature.tooltip.description",
+          "Digital signatures will be invalidated when merging files. Check this to remove them from the final merged PDF.",
+        ),
       },
       {
-        title: t('merge.generateTableOfContents.tooltip.title', 'Generate Table of Contents'),
-        description: t('merge.generateTableOfContents.tooltip.description', 'Automatically creates a clickable table of contents in the merged PDF based on the original file names and page numbers.')
-      }
-    ]
+        title: t(
+          "merge.generateTableOfContents.tooltip.title",
+          "Generate Table of Contents",
+        ),
+        description: t(
+          "merge.generateTableOfContents.tooltip.description",
+          "Automatically creates a clickable table of contents in the merged PDF based on the original file names and page numbers.",
+        ),
+      },
+    ],
   };
 };
diff --git a/frontend/src/core/components/tooltips/useOCRTips.ts b/frontend/src/core/components/tooltips/useOCRTips.ts
index d571827119..54b8196765 100644
--- a/frontend/src/core/components/tooltips/useOCRTips.ts
+++ b/frontend/src/core/components/tooltips/useOCRTips.ts
@@ -1,5 +1,5 @@
-import { useTranslation } from 'react-i18next';
-import { TooltipContent } from '@app/types/tips';
+import { useTranslation } from "react-i18next";
+import { TooltipContent } from "@app/types/tips";
 
 export const useOCRTips = (): TooltipContent => {
   const { t } = useTranslation();
@@ -11,26 +11,53 @@ export const useOCRTips = (): TooltipContent => {
     tips: [
       {
         title: t("ocr.tooltip.mode.title", "OCR Mode"),
-        description: t("ocr.tooltip.mode.text", "Optical Character Recognition (OCR) helps you turn scanned or screenshotted pages into text you can search, copy, or highlight."),
+        description: t(
+          "ocr.tooltip.mode.text",
+          "Optical Character Recognition (OCR) helps you turn scanned or screenshotted pages into text you can search, copy, or highlight.",
+        ),
         bullets: [
-          t("ocr.tooltip.mode.bullet1", "Auto skips pages that already contain text layers."),
-          t("ocr.tooltip.mode.bullet2", "Force re-OCRs every page and replaces all the text."),
-          t("ocr.tooltip.mode.bullet3", "Strict halts if any selectable text is found.")
-        ]
+          t(
+            "ocr.tooltip.mode.bullet1",
+            "Auto skips pages that already contain text layers.",
+          ),
+          t(
+            "ocr.tooltip.mode.bullet2",
+            "Force re-OCRs every page and replaces all the text.",
+          ),
+          t(
+            "ocr.tooltip.mode.bullet3",
+            "Strict halts if any selectable text is found.",
+          ),
+        ],
       },
       {
         title: t("ocr.tooltip.languages.title", "Languages"),
-        description: t("ocr.tooltip.languages.text", "Improve OCR accuracy by specifying the expected languages. Choose one or more languages to guide detection.")
+        description: t(
+          "ocr.tooltip.languages.text",
+          "Improve OCR accuracy by specifying the expected languages. Choose one or more languages to guide detection.",
+        ),
       },
       {
         title: t("ocr.tooltip.output.title", "Output"),
-        description: t("ocr.tooltip.output.text", "Decide how you want the text output formatted:"),
+        description: t(
+          "ocr.tooltip.output.text",
+          "Decide how you want the text output formatted:",
+        ),
         bullets: [
-          t("ocr.tooltip.output.bullet1", "Searchable PDF embeds text behind the original image."),
-          t("ocr.tooltip.output.bullet2", "HOCR XML returns a structured machine-readable file."),
-          t("ocr.tooltip.output.bullet3", "Plain-text sidecar creates a separate .txt file with raw content.")
-        ]
-      }
-    ]
+          t(
+            "ocr.tooltip.output.bullet1",
+            "Searchable PDF embeds text behind the original image.",
+          ),
+          t(
+            "ocr.tooltip.output.bullet2",
+            "HOCR XML returns a structured machine-readable file.",
+          ),
+          t(
+            "ocr.tooltip.output.bullet3",
+            "Plain-text sidecar creates a separate .txt file with raw content.",
+          ),
+        ],
+      },
+    ],
   };
 };
diff --git a/frontend/src/core/components/tooltips/useOverlayPdfsTips.ts b/frontend/src/core/components/tooltips/useOverlayPdfsTips.ts
index cde2cd33b9..d7a8d9237f 100644
--- a/frontend/src/core/components/tooltips/useOverlayPdfsTips.ts
+++ b/frontend/src/core/components/tooltips/useOverlayPdfsTips.ts
@@ -1,56 +1,66 @@
-import { useTranslation } from 'react-i18next';
-import { TooltipContent } from '@app/types/tips';
+import { useTranslation } from "react-i18next";
+import { TooltipContent } from "@app/types/tips";
 
 export const useOverlayPdfsTips = (): TooltipContent => {
   const { t } = useTranslation();
 
   return {
     header: {
-      title: t('overlay-pdfs.tooltip.header.title', 'Overlay PDFs Overview')
+      title: t("overlay-pdfs.tooltip.header.title", "Overlay PDFs Overview"),
     },
     tips: [
       {
-        title: t('overlay-pdfs.tooltip.description.title', 'Description'),
+        title: t("overlay-pdfs.tooltip.description.title", "Description"),
         description: t(
-          'overlay-pdfs.tooltip.description.text',
-          'Combine a original PDF with one or more overlay PDFs. Overlays can be applied page-by-page in different modes and placed in the foreground or background.'
-        )
+          "overlay-pdfs.tooltip.description.text",
+          "Combine a original PDF with one or more overlay PDFs. Overlays can be applied page-by-page in different modes and placed in the foreground or background.",
+        ),
       },
       {
-        title: t('overlay-pdfs.tooltip.mode.title', 'Overlay Mode'),
+        title: t("overlay-pdfs.tooltip.mode.title", "Overlay Mode"),
         description: t(
-          'overlay-pdfs.tooltip.mode.text',
-          'Choose how to distribute overlay pages across the original PDF pages.'
+          "overlay-pdfs.tooltip.mode.text",
+          "Choose how to distribute overlay pages across the original PDF pages.",
         ),
         bullets: [
-          t('overlay-pdfs.tooltip.mode.sequential', 'Sequential Overlay: Use pages from the first overlay PDF until it ends, then move to the next.'),
-          t('overlay-pdfs.tooltip.mode.interleaved', 'Interleaved Overlay: Take one page from each overlay in turn.'),
-          t('overlay-pdfs.tooltip.mode.fixedRepeat', 'Fixed Repeat Overlay: Take a set number of pages from each overlay before moving to the next. Use Counts to set the numbers.')
-        ]
+          t(
+            "overlay-pdfs.tooltip.mode.sequential",
+            "Sequential Overlay: Use pages from the first overlay PDF until it ends, then move to the next.",
+          ),
+          t(
+            "overlay-pdfs.tooltip.mode.interleaved",
+            "Interleaved Overlay: Take one page from each overlay in turn.",
+          ),
+          t(
+            "overlay-pdfs.tooltip.mode.fixedRepeat",
+            "Fixed Repeat Overlay: Take a set number of pages from each overlay before moving to the next. Use Counts to set the numbers.",
+          ),
+        ],
       },
       {
-        title: t('overlay-pdfs.tooltip.position.title', 'Overlay Position'),
+        title: t("overlay-pdfs.tooltip.position.title", "Overlay Position"),
         description: t(
-          'overlay-pdfs.tooltip.position.text',
-          'Foreground places the overlay on top of the page. Background places it behind.'
-        )
+          "overlay-pdfs.tooltip.position.text",
+          "Foreground places the overlay on top of the page. Background places it behind.",
+        ),
       },
       {
-        title: t('overlay-pdfs.tooltip.overlayFiles.title', 'Overlay Files'),
+        title: t("overlay-pdfs.tooltip.overlayFiles.title", "Overlay Files"),
         description: t(
-          'overlay-pdfs.tooltip.overlayFiles.text',
-          'Select one or more PDFs to overlay on the original. The order of these files affects how pages are applied in Sequential and Fixed Repeat modes.'
-        )
+          "overlay-pdfs.tooltip.overlayFiles.text",
+          "Select one or more PDFs to overlay on the original. The order of these files affects how pages are applied in Sequential and Fixed Repeat modes.",
+        ),
       },
       {
-        title: t('overlay-pdfs.tooltip.counts.title', 'Counts (Fixed Repeat only)'),
+        title: t(
+          "overlay-pdfs.tooltip.counts.title",
+          "Counts (Fixed Repeat only)",
+        ),
         description: t(
-          'overlay-pdfs.tooltip.counts.text',
-          'Provide a positive number for each overlay file showing how many pages to take before moving to the next. Required when mode is Fixed Repeat.'
-        )
-      }
-    ]
+          "overlay-pdfs.tooltip.counts.text",
+          "Provide a positive number for each overlay file showing how many pages to take before moving to the next. Required when mode is Fixed Repeat.",
+        ),
+      },
+    ],
   };
 };
-
-
diff --git a/frontend/src/core/components/tooltips/usePageSelectionTips.ts b/frontend/src/core/components/tooltips/usePageSelectionTips.ts
index 19c03116fa..b29869f7d5 100644
--- a/frontend/src/core/components/tooltips/usePageSelectionTips.ts
+++ b/frontend/src/core/components/tooltips/usePageSelectionTips.ts
@@ -1,44 +1,60 @@
-import { useTranslation } from 'react-i18next';
-import { TooltipContent } from '@app/types/tips';
+import { useTranslation } from "react-i18next";
+import { TooltipContent } from "@app/types/tips";
 
 export const usePageSelectionTips = (): TooltipContent => {
   const { t } = useTranslation();
 
   return {
     header: {
-      title: t('bulkSelection.header.title', 'Page Selection Guide'),
+      title: t("bulkSelection.header.title", "Page Selection Guide"),
     },
     tips: [
       {
-        title: t('bulkSelection.syntax.title', 'Syntax Basics'),
-        description: t('bulkSelection.syntax.text', 'Use numbers, ranges, keywords, and progressions (n starts at 0). Parentheses are supported.'),
+        title: t("bulkSelection.syntax.title", "Syntax Basics"),
+        description: t(
+          "bulkSelection.syntax.text",
+          "Use numbers, ranges, keywords, and progressions (n starts at 0). Parentheses are supported.",
+        ),
         bullets: [
-          t('bulkSelection.syntax.bullets.numbers', 'Numbers/ranges: 5, 10-20'),
-          t('bulkSelection.syntax.bullets.keywords', 'Keywords: odd, even'),
-          t('bulkSelection.syntax.bullets.progressions', 'Progressions: 3n, 4n+1'),
-        ]
+          t("bulkSelection.syntax.bullets.numbers", "Numbers/ranges: 5, 10-20"),
+          t("bulkSelection.syntax.bullets.keywords", "Keywords: odd, even"),
+          t(
+            "bulkSelection.syntax.bullets.progressions",
+            "Progressions: 3n, 4n+1",
+          ),
+        ],
       },
       {
-        title: t('bulkSelection.operators.title', 'Operators'),
-        description: t('bulkSelection.operators.text', 'AND has higher precedence than comma. NOT applies within the document range.'),
+        title: t("bulkSelection.operators.title", "Operators"),
+        description: t(
+          "bulkSelection.operators.text",
+          "AND has higher precedence than comma. NOT applies within the document range.",
+        ),
         bullets: [
-          t('bulkSelection.operators.and', 'AND: & or "and" — require both conditions (e.g., 1-50 & even)'),
-          t('bulkSelection.operators.comma', 'Comma: , or | — combine selections (e.g., 1-10, 20)'),
-          t('bulkSelection.operators.not', 'NOT: ! or "not" — exclude pages (e.g., 3n & not 30)'),
-        ]
+          t(
+            "bulkSelection.operators.and",
+            'AND: & or "and" — require both conditions (e.g., 1-50 & even)',
+          ),
+          t(
+            "bulkSelection.operators.comma",
+            "Comma: , or | — combine selections (e.g., 1-10, 20)",
+          ),
+          t(
+            "bulkSelection.operators.not",
+            'NOT: ! or "not" — exclude pages (e.g., 3n & not 30)',
+          ),
+        ],
       },
       {
-        title: t('bulkSelection.examples.title', 'Examples'),
+        title: t("bulkSelection.examples.title", "Examples"),
         bullets: [
-          `${t('bulkSelection.examples.first50', 'First 50')}: 1-50`,
-          `${t('bulkSelection.examples.last50', 'Last 50')}: 451-500`,
-          `${t('bulkSelection.examples.every3rd', 'Every 3rd')}: 3n`,
-          `${t('bulkSelection.examples.oddWithinExcluding', 'Odd within 1-20 excluding 5-7')}: 1-20 & odd & !5-7`,
-          `${t('bulkSelection.examples.combineSets', 'Combine sets')}: 1-50, 451-500`,
-        ]
-      }
-    ]
+          `${t("bulkSelection.examples.first50", "First 50")}: 1-50`,
+          `${t("bulkSelection.examples.last50", "Last 50")}: 451-500`,
+          `${t("bulkSelection.examples.every3rd", "Every 3rd")}: 3n`,
+          `${t("bulkSelection.examples.oddWithinExcluding", "Odd within 1-20 excluding 5-7")}: 1-20 & odd & !5-7`,
+          `${t("bulkSelection.examples.combineSets", "Combine sets")}: 1-50, 451-500`,
+        ],
+      },
+    ],
   };
 };
-
-
diff --git a/frontend/src/core/components/tooltips/usePageSelectionTips.tsx b/frontend/src/core/components/tooltips/usePageSelectionTips.tsx
index aed449cd40..dd18923ef8 100644
--- a/frontend/src/core/components/tooltips/usePageSelectionTips.tsx
+++ b/frontend/src/core/components/tooltips/usePageSelectionTips.tsx
@@ -1,5 +1,5 @@
-import { useTranslation } from 'react-i18next';
-import { TooltipContent } from '@app/types/tips';
+import { useTranslation } from "react-i18next";
+import { TooltipContent } from "@app/types/tips";
 
 /**
  * Reusable tooltip for page selection functionality.
@@ -10,53 +10,107 @@ export const usePageSelectionTips = (): TooltipContent => {
 
   return {
     header: {
-      title: t("pageSelection.tooltip.header.title", "Page Selection Guide")
+      title: t("pageSelection.tooltip.header.title", "Page Selection Guide"),
     },
     tips: [
       {
-        description: t("pageSelection.tooltip.description", "Choose which pages to use for the operation. Supports single pages, ranges, formulas, and the all keyword.")
+        description: t(
+          "pageSelection.tooltip.description",
+          "Choose which pages to use for the operation. Supports single pages, ranges, formulas, and the all keyword.",
+        ),
       },
       {
         title: t("pageSelection.tooltip.individual.title", "Individual Pages"),
-        description: t("pageSelection.tooltip.individual.description", "Enter numbers separated by commas."),
+        description: t(
+          "pageSelection.tooltip.individual.description",
+          "Enter numbers separated by commas.",
+        ),
         bullets: [
-          t("pageSelection.tooltip.individual.bullet1", "<strong>1,3,5</strong> → selects pages 1, 3, 5"),
-          t("pageSelection.tooltip.individual.bullet2", "<strong>2,7,12</strong> → selects pages 2, 7, 12")
-        ]
+          t(
+            "pageSelection.tooltip.individual.bullet1",
+            "<strong>1,3,5</strong> → selects pages 1, 3, 5",
+          ),
+          t(
+            "pageSelection.tooltip.individual.bullet2",
+            "<strong>2,7,12</strong> → selects pages 2, 7, 12",
+          ),
+        ],
       },
       {
         title: t("pageSelection.tooltip.ranges.title", "Page Ranges"),
-        description: t("pageSelection.tooltip.ranges.description", "Use - for consecutive pages."),
+        description: t(
+          "pageSelection.tooltip.ranges.description",
+          "Use - for consecutive pages.",
+        ),
         bullets: [
-          t("pageSelection.tooltip.ranges.bullet1", "<strong>3-6</strong> → selects pages 3–6"),
-          t("pageSelection.tooltip.ranges.bullet2", "<strong>10-15</strong> → selects pages 10–15"),
-          t("pageSelection.tooltip.ranges.bullet3", "<strong>5-</strong> → selects pages 5 to end")
-        ]
+          t(
+            "pageSelection.tooltip.ranges.bullet1",
+            "<strong>3-6</strong> → selects pages 3–6",
+          ),
+          t(
+            "pageSelection.tooltip.ranges.bullet2",
+            "<strong>10-15</strong> → selects pages 10–15",
+          ),
+          t(
+            "pageSelection.tooltip.ranges.bullet3",
+            "<strong>5-</strong> → selects pages 5 to end",
+          ),
+        ],
       },
       {
-        title: t("pageSelection.tooltip.mathematical.title", "Mathematical Functions"),
-        description: t("pageSelection.tooltip.mathematical.description", "Use n in formulas for patterns."),
+        title: t(
+          "pageSelection.tooltip.mathematical.title",
+          "Mathematical Functions",
+        ),
+        description: t(
+          "pageSelection.tooltip.mathematical.description",
+          "Use n in formulas for patterns.",
+        ),
         bullets: [
-		  t("pageSelection.tooltip.mathematical.bullet2", "<strong>2n-1</strong> → all odd pages (1, 3, 5…)"),
-          t("pageSelection.tooltip.mathematical.bullet1", "<strong>2n</strong> → all even pages (2, 4, 6…)"),
-          t("pageSelection.tooltip.mathematical.bullet3", "<strong>3n</strong> → every 3rd page (3, 6, 9…)"),
-          t("pageSelection.tooltip.mathematical.bullet4", "<strong>4n-1</strong> → pages 3, 7, 11, 15…")
-        ]
+          t(
+            "pageSelection.tooltip.mathematical.bullet2",
+            "<strong>2n-1</strong> → all odd pages (1, 3, 5…)",
+          ),
+          t(
+            "pageSelection.tooltip.mathematical.bullet1",
+            "<strong>2n</strong> → all even pages (2, 4, 6…)",
+          ),
+          t(
+            "pageSelection.tooltip.mathematical.bullet3",
+            "<strong>3n</strong> → every 3rd page (3, 6, 9…)",
+          ),
+          t(
+            "pageSelection.tooltip.mathematical.bullet4",
+            "<strong>4n-1</strong> → pages 3, 7, 11, 15…",
+          ),
+        ],
       },
       {
         title: t("pageSelection.tooltip.special.title", "Special Keywords"),
         bullets: [
-          t("pageSelection.tooltip.special.bullet1", "<strong>all</strong> → selects all pages"),
-        ]
+          t(
+            "pageSelection.tooltip.special.bullet1",
+            "<strong>all</strong> → selects all pages",
+          ),
+        ],
       },
       {
         title: t("pageSelection.tooltip.complex.title", "Complex Combinations"),
-        description: t("pageSelection.tooltip.complex.description", "Mix different types."),
+        description: t(
+          "pageSelection.tooltip.complex.description",
+          "Mix different types.",
+        ),
         bullets: [
-          t("pageSelection.tooltip.complex.bullet1", "<strong>1,3-5,8,2n</strong> → pages 1, 3–5, 8, plus evens"),
-          t("pageSelection.tooltip.complex.bullet2", "<strong>10-,2n-1</strong> → from page 10 to end + odd pages")
-        ]
-      }
-    ]
+          t(
+            "pageSelection.tooltip.complex.bullet1",
+            "<strong>1,3-5,8,2n</strong> → pages 1, 3–5, 8, plus evens",
+          ),
+          t(
+            "pageSelection.tooltip.complex.bullet2",
+            "<strong>10-,2n-1</strong> → from page 10 to end + odd pages",
+          ),
+        ],
+      },
+    ],
   };
-};
\ No newline at end of file
+};
diff --git a/frontend/src/core/components/tooltips/usePdfTextEditorTips.ts b/frontend/src/core/components/tooltips/usePdfTextEditorTips.ts
index 3d9e473b1a..8a8457c733 100644
--- a/frontend/src/core/components/tooltips/usePdfTextEditorTips.ts
+++ b/frontend/src/core/components/tooltips/usePdfTextEditorTips.ts
@@ -1,36 +1,41 @@
-import { useTranslation } from 'react-i18next';
-import { TooltipContent } from '@app/types/tips';
+import { useTranslation } from "react-i18next";
+import { TooltipContent } from "@app/types/tips";
 
 export const usePdfTextEditorTips = (): TooltipContent => {
   const { t } = useTranslation();
 
   return {
     header: {
-      title: t('pdfTextEditor.tooltip.header.title', 'Preview Limitations'),
+      title: t("pdfTextEditor.tooltip.header.title", "Preview Limitations"),
     },
     tips: [
       {
-        title: t('pdfTextEditor.tooltip.textFocus.title', 'Text and Image Focus'),
+        title: t(
+          "pdfTextEditor.tooltip.textFocus.title",
+          "Text and Image Focus",
+        ),
         description: t(
-          'pdfTextEditor.tooltip.textFocus.text',
-          'This workspace focuses on editing text and repositioning embedded images. Complex page artwork, form widgets, and layered graphics are preserved for export but are not fully editable here.'
+          "pdfTextEditor.tooltip.textFocus.text",
+          "This workspace focuses on editing text and repositioning embedded images. Complex page artwork, form widgets, and layered graphics are preserved for export but are not fully editable here.",
         ),
       },
       {
-        title: t('pdfTextEditor.tooltip.previewVariance.title', 'Preview Variance'),
+        title: t(
+          "pdfTextEditor.tooltip.previewVariance.title",
+          "Preview Variance",
+        ),
         description: t(
-          'pdfTextEditor.tooltip.previewVariance.text',
-          'Some visuals (such as table borders, shapes, or annotation appearances) may not display exactly in the preview. The exported PDF keeps the original drawing commands whenever possible.'
+          "pdfTextEditor.tooltip.previewVariance.text",
+          "Some visuals (such as table borders, shapes, or annotation appearances) may not display exactly in the preview. The exported PDF keeps the original drawing commands whenever possible.",
         ),
       },
       {
-        title: t('pdfTextEditor.tooltip.alpha.title', 'Alpha Viewer'),
+        title: t("pdfTextEditor.tooltip.alpha.title", "Alpha Viewer"),
         description: t(
-          'pdfTextEditor.tooltip.alpha.text',
-          'This alpha viewer is still evolving—certain fonts, colours, transparency effects, and layout details may shift slightly. Please double-check the generated PDF before sharing.'
+          "pdfTextEditor.tooltip.alpha.text",
+          "This alpha viewer is still evolving—certain fonts, colours, transparency effects, and layout details may shift slightly. Please double-check the generated PDF before sharing.",
         ),
       },
     ],
   };
 };
-
diff --git a/frontend/src/core/components/tooltips/useRedactTips.ts b/frontend/src/core/components/tooltips/useRedactTips.ts
index e76cb032f6..80f14f3cde 100644
--- a/frontend/src/core/components/tooltips/useRedactTips.ts
+++ b/frontend/src/core/components/tooltips/useRedactTips.ts
@@ -1,23 +1,29 @@
-import { useTranslation } from 'react-i18next';
-import { TooltipContent } from '@app/types/tips';
+import { useTranslation } from "react-i18next";
+import { TooltipContent } from "@app/types/tips";
 
 export const useRedactModeTips = (): TooltipContent => {
   const { t } = useTranslation();
 
   return {
     header: {
-      title: t("redact.tooltip.mode.header.title", "Redaction Method")
+      title: t("redact.tooltip.mode.header.title", "Redaction Method"),
     },
     tips: [
       {
         title: t("redact.tooltip.mode.automatic.title", "Automatic Redaction"),
-        description: t("redact.tooltip.mode.automatic.text", "Automatically finds and redacts specified text throughout the document. Perfect for removing consistent sensitive information like names, SSNs, or confidential markers.")
+        description: t(
+          "redact.tooltip.mode.automatic.text",
+          "Automatically finds and redacts specified text throughout the document. Perfect for removing consistent sensitive information like names, SSNs, or confidential markers.",
+        ),
       },
       {
         title: t("redact.tooltip.mode.manual.title", "Manual Redaction"),
-        description: t("redact.tooltip.mode.manual.text", "Click and drag to manually select specific areas to redact. Gives you precise control over what gets redacted. (Coming soon)")
-      }
-    ]
+        description: t(
+          "redact.tooltip.mode.manual.text",
+          "Click and drag to manually select specific areas to redact. Gives you precise control over what gets redacted. (Coming soon)",
+        ),
+      },
+    ],
   };
 };
 
@@ -26,23 +32,32 @@ export const useRedactWordsTips = (): TooltipContent => {
 
   return {
     header: {
-      title: t("redact.tooltip.words.header.title", "Words to Redact")
+      title: t("redact.tooltip.words.header.title", "Words to Redact"),
     },
     tips: [
       {
         title: t("redact.tooltip.words.description.title", "Text Matching"),
-        description: t("redact.tooltip.words.description.text", "Enter words or phrases to find and redact in your document. Each word will be searched for separately."),
+        description: t(
+          "redact.tooltip.words.description.text",
+          "Enter words or phrases to find and redact in your document. Each word will be searched for separately.",
+        ),
         bullets: [
           t("redact.tooltip.words.bullet1", "Add one word at a time"),
-          t("redact.tooltip.words.bullet2", "Press Enter or click 'Add Another' to add"),
-          t("redact.tooltip.words.bullet3", "Click × to remove words")
-        ]
+          t(
+            "redact.tooltip.words.bullet2",
+            "Press Enter or click 'Add Another' to add",
+          ),
+          t("redact.tooltip.words.bullet3", "Click × to remove words"),
+        ],
       },
       {
         title: t("redact.tooltip.words.examples.title", "Common Examples"),
-        description: t("redact.tooltip.words.examples.text", "Typical words to redact include: bank details, email addresses, or specific names.")
-      }
-    ]
+        description: t(
+          "redact.tooltip.words.examples.text",
+          "Typical words to redact include: bank details, email addresses, or specific names.",
+        ),
+      },
+    ],
   };
 };
 
@@ -51,30 +66,57 @@ export const useRedactAdvancedTips = (): TooltipContent => {
 
   return {
     header: {
-      title: t("redact.tooltip.advanced.header.title", "Advanced Redaction Settings")
+      title: t(
+        "redact.tooltip.advanced.header.title",
+        "Advanced Redaction Settings",
+      ),
     },
     tips: [
       {
         title: t("redact.tooltip.advanced.color.title", "Box Colour & Padding"),
-        description: t("redact.tooltip.advanced.color.text", "Customise the appearance of redaction boxes. Black is standard, but you can choose any colour. Padding adds extra space around the found text."),
+        description: t(
+          "redact.tooltip.advanced.color.text",
+          "Customise the appearance of redaction boxes. Black is standard, but you can choose any colour. Padding adds extra space around the found text.",
+        ),
       },
       {
         title: t("redact.tooltip.advanced.regex.title", "Use Regex"),
-        description: t("redact.tooltip.advanced.regex.text", "Enable regular expressions for advanced pattern matching. Useful for finding phone numbers, emails, or complex patterns."),
+        description: t(
+          "redact.tooltip.advanced.regex.text",
+          "Enable regular expressions for advanced pattern matching. Useful for finding phone numbers, emails, or complex patterns.",
+        ),
         bullets: [
-          t("redact.tooltip.advanced.regex.bullet1", "Example: \\d{4}-\\d{2}-\\d{2} to match any dates in YYYY-MM-DD format"),
-          t("redact.tooltip.advanced.regex.bullet2", "Use with caution - test thoroughly")
-        ]
+          t(
+            "redact.tooltip.advanced.regex.bullet1",
+            "Example: \\d{4}-\\d{2}-\\d{2} to match any dates in YYYY-MM-DD format",
+          ),
+          t(
+            "redact.tooltip.advanced.regex.bullet2",
+            "Use with caution - test thoroughly",
+          ),
+        ],
       },
       {
-        title: t("redact.tooltip.advanced.wholeWord.title", "Whole Word Search"),
-        description: t("redact.tooltip.advanced.wholeWord.text", "Only match complete words, not partial matches. 'John' won't match 'Johnson' when enabled.")
+        title: t(
+          "redact.tooltip.advanced.wholeWord.title",
+          "Whole Word Search",
+        ),
+        description: t(
+          "redact.tooltip.advanced.wholeWord.text",
+          "Only match complete words, not partial matches. 'John' won't match 'Johnson' when enabled.",
+        ),
       },
       {
-        title: t("redact.tooltip.advanced.convert.title", "Convert to PDF-Image"),
-        description: t("redact.tooltip.advanced.convert.text", "Converts the PDF to an image-based PDF after redaction. This ensures text behind redaction boxes is completely removed and unrecoverable.")
-      }
-    ]
+        title: t(
+          "redact.tooltip.advanced.convert.title",
+          "Convert to PDF-Image",
+        ),
+        description: t(
+          "redact.tooltip.advanced.convert.text",
+          "Converts the PDF to an image-based PDF after redaction. This ensures text behind redaction boxes is completely removed and unrecoverable.",
+        ),
+      },
+    ],
   };
 };
 
@@ -83,26 +125,47 @@ export const useRedactManualTips = (): TooltipContent => {
 
   return {
     header: {
-      title: t("redact.tooltip.manual.header.title", "Manual Redaction Controls")
+      title: t(
+        "redact.tooltip.manual.header.title",
+        "Manual Redaction Controls",
+      ),
     },
     tips: [
       {
         title: t("redact.tooltip.manual.markText.title", "Mark Text Tool"),
-        description: t("redact.tooltip.manual.markText.text", "Select text directly on the PDF to mark it for redaction. Click and drag to highlight specific text that you want to redact."),
+        description: t(
+          "redact.tooltip.manual.markText.text",
+          "Select text directly on the PDF to mark it for redaction. Click and drag to highlight specific text that you want to redact.",
+        ),
       },
       {
         title: t("redact.tooltip.manual.markArea.title", "Mark Area Tool"),
-        description: t("redact.tooltip.manual.markArea.text", "Draw rectangular areas on the PDF to mark regions for redaction. Useful for redacting images, signatures, or irregular shapes."),
+        description: t(
+          "redact.tooltip.manual.markArea.text",
+          "Draw rectangular areas on the PDF to mark regions for redaction. Useful for redacting images, signatures, or irregular shapes.",
+        ),
       },
       {
         title: t("redact.tooltip.manual.apply.title", "Apply Redactions"),
-        description: t("redact.tooltip.manual.apply.text", "After marking content, click 'Apply' to permanently redact all marked areas. The pending count shows how many redactions are ready to be applied."),
+        description: t(
+          "redact.tooltip.manual.apply.text",
+          "After marking content, click 'Apply' to permanently redact all marked areas. The pending count shows how many redactions are ready to be applied.",
+        ),
         bullets: [
-          t("redact.tooltip.manual.apply.bullet1", "Mark as many areas as needed before applying"),
-          t("redact.tooltip.manual.apply.bullet2", "All pending redactions are applied at once"),
-          t("redact.tooltip.manual.apply.bullet3", "Redactions cannot be undone after applying")
-        ]
-      }
-    ]
+          t(
+            "redact.tooltip.manual.apply.bullet1",
+            "Mark as many areas as needed before applying",
+          ),
+          t(
+            "redact.tooltip.manual.apply.bullet2",
+            "All pending redactions are applied at once",
+          ),
+          t(
+            "redact.tooltip.manual.apply.bullet3",
+            "Redactions cannot be undone after applying",
+          ),
+        ],
+      },
+    ],
   };
 };
diff --git a/frontend/src/core/components/tooltips/useRemoveAnnotationsTips.ts b/frontend/src/core/components/tooltips/useRemoveAnnotationsTips.ts
index edaa039236..d263935548 100644
--- a/frontend/src/core/components/tooltips/useRemoveAnnotationsTips.ts
+++ b/frontend/src/core/components/tooltips/useRemoveAnnotationsTips.ts
@@ -1,20 +1,24 @@
-import { useTranslation } from 'react-i18next';
-import { TooltipContent } from '@app/types/tips';
+import { useTranslation } from "react-i18next";
+import { TooltipContent } from "@app/types/tips";
 
 export const useRemoveAnnotationsTips = (): TooltipContent => {
   const { t } = useTranslation();
 
   return {
     header: {
-      title: t("removeAnnotations.tooltip.header.title", "About Remove Annotations")
+      title: t(
+        "removeAnnotations.tooltip.header.title",
+        "About Remove Annotations",
+      ),
     },
     tips: [
       {
         title: t("removeAnnotations.tooltip.description.title", "What it does"),
-        description: t('removeAnnotations.info.description',
-          'This tool will remove all annotations (comments, highlights, notes, etc.) from your PDF documents.'
+        description: t(
+          "removeAnnotations.info.description",
+          "This tool will remove all annotations (comments, highlights, notes, etc.) from your PDF documents.",
         ),
-      }
-    ]
+      },
+    ],
   };
 };
diff --git a/frontend/src/core/components/tooltips/useRemoveBlanksTips.ts b/frontend/src/core/components/tooltips/useRemoveBlanksTips.ts
index ef054bdb83..5999e92b06 100644
--- a/frontend/src/core/components/tooltips/useRemoveBlanksTips.ts
+++ b/frontend/src/core/components/tooltips/useRemoveBlanksTips.ts
@@ -1,41 +1,86 @@
-import { useTranslation } from 'react-i18next';
-import { TooltipContent } from '@app/types/tips';
+import { useTranslation } from "react-i18next";
+import { TooltipContent } from "@app/types/tips";
 
 export const useRemoveBlanksTips = (): TooltipContent => {
   const { t } = useTranslation();
 
   return {
     header: {
-      title: t("removeBlanks.tooltip.header.title", "Remove Blank Pages Settings"),
+      title: t(
+        "removeBlanks.tooltip.header.title",
+        "Remove Blank Pages Settings",
+      ),
     },
     tips: [
       {
-        title: t("removeBlanks.tooltip.threshold.title", "Pixel Whiteness Threshold"),
-        description: t("removeBlanks.tooltip.threshold.text", "Controls how white a pixel must be to be considered 'white'. This helps determine what counts as a blank area on the page."),
+        title: t(
+          "removeBlanks.tooltip.threshold.title",
+          "Pixel Whiteness Threshold",
+        ),
+        description: t(
+          "removeBlanks.tooltip.threshold.text",
+          "Controls how white a pixel must be to be considered 'white'. This helps determine what counts as a blank area on the page.",
+        ),
         bullets: [
-          t("removeBlanks.tooltip.threshold.bullet1", "0 = Pure black (most restrictive)"),
+          t(
+            "removeBlanks.tooltip.threshold.bullet1",
+            "0 = Pure black (most restrictive)",
+          ),
           t("removeBlanks.tooltip.threshold.bullet2", "128 = Medium gray"),
-          t("removeBlanks.tooltip.threshold.bullet3", "255 = Pure white (least restrictive)")
-        ]
+          t(
+            "removeBlanks.tooltip.threshold.bullet3",
+            "255 = Pure white (least restrictive)",
+          ),
+        ],
       },
       {
-        title: t("removeBlanks.tooltip.whitePercent.title", "White Percentage Threshold"),
-        description: t("removeBlanks.tooltip.whitePercent.text", "Sets the minimum percentage of white pixels required for a page to be considered blank and removed."),
+        title: t(
+          "removeBlanks.tooltip.whitePercent.title",
+          "White Percentage Threshold",
+        ),
+        description: t(
+          "removeBlanks.tooltip.whitePercent.text",
+          "Sets the minimum percentage of white pixels required for a page to be considered blank and removed.",
+        ),
         bullets: [
-          t("removeBlanks.tooltip.whitePercent.bullet1", "Lower values (e.g., 80%) = More pages removed"),
-          t("removeBlanks.tooltip.whitePercent.bullet2", "Higher values (e.g., 95%) = Only very blank pages removed"),
-          t("removeBlanks.tooltip.whitePercent.bullet3", "Use higher values for documents with light backgrounds")
-        ]
+          t(
+            "removeBlanks.tooltip.whitePercent.bullet1",
+            "Lower values (e.g., 80%) = More pages removed",
+          ),
+          t(
+            "removeBlanks.tooltip.whitePercent.bullet2",
+            "Higher values (e.g., 95%) = Only very blank pages removed",
+          ),
+          t(
+            "removeBlanks.tooltip.whitePercent.bullet3",
+            "Use higher values for documents with light backgrounds",
+          ),
+        ],
       },
       {
-        title: t("removeBlanks.tooltip.includeBlankPages.title", "Include Detected Blank Pages"),
-        description: t("removeBlanks.tooltip.includeBlankPages.text", "When enabled, creates a separate PDF containing all the blank pages that were detected and removed from the original document."),
+        title: t(
+          "removeBlanks.tooltip.includeBlankPages.title",
+          "Include Detected Blank Pages",
+        ),
+        description: t(
+          "removeBlanks.tooltip.includeBlankPages.text",
+          "When enabled, creates a separate PDF containing all the blank pages that were detected and removed from the original document.",
+        ),
         bullets: [
-          t("removeBlanks.tooltip.includeBlankPages.bullet1", "Useful for reviewing what was removed"),
-          t("removeBlanks.tooltip.includeBlankPages.bullet2", "Helps verify the detection accuracy"),
-          t("removeBlanks.tooltip.includeBlankPages.bullet3", "Can be disabled to reduce output file size")
-        ]
-      }
-    ]
+          t(
+            "removeBlanks.tooltip.includeBlankPages.bullet1",
+            "Useful for reviewing what was removed",
+          ),
+          t(
+            "removeBlanks.tooltip.includeBlankPages.bullet2",
+            "Helps verify the detection accuracy",
+          ),
+          t(
+            "removeBlanks.tooltip.includeBlankPages.bullet3",
+            "Can be disabled to reduce output file size",
+          ),
+        ],
+      },
+    ],
   };
 };
diff --git a/frontend/src/core/components/tooltips/useRemovePagesTips.ts b/frontend/src/core/components/tooltips/useRemovePagesTips.ts
index a20fbc81da..58fc738052 100644
--- a/frontend/src/core/components/tooltips/useRemovePagesTips.ts
+++ b/frontend/src/core/components/tooltips/useRemovePagesTips.ts
@@ -1,5 +1,5 @@
-import { useTranslation } from 'react-i18next';
-import { TooltipContent } from '@app/types/tips';
+import { useTranslation } from "react-i18next";
+import { TooltipContent } from "@app/types/tips";
 
 export const useRemovePagesTips = (): TooltipContent => {
   const { t } = useTranslation();
@@ -11,24 +11,48 @@ export const useRemovePagesTips = (): TooltipContent => {
     tips: [
       {
         title: t("removePages.tooltip.pageNumbers.title", "Page Selection"),
-        description: t("removePages.tooltip.pageNumbers.text", "Specify which pages to remove from your PDF. You can select individual pages, ranges, or use mathematical expressions."),
+        description: t(
+          "removePages.tooltip.pageNumbers.text",
+          "Specify which pages to remove from your PDF. You can select individual pages, ranges, or use mathematical expressions.",
+        ),
         bullets: [
-          t("removePages.tooltip.pageNumbers.bullet1", "Individual pages: 1,3,5 (removes pages 1, 3, and 5)"),
-          t("removePages.tooltip.pageNumbers.bullet2", "Page ranges: 1-5,10-15 (removes pages 1-5 and 10-15)"),
-          t("removePages.tooltip.pageNumbers.bullet3", "Mathematical: 2n+1 (removes odd pages)"),
-          t("removePages.tooltip.pageNumbers.bullet4", "Open ranges: 5- (removes from page 5 to end)")
-        ]
+          t(
+            "removePages.tooltip.pageNumbers.bullet1",
+            "Individual pages: 1,3,5 (removes pages 1, 3, and 5)",
+          ),
+          t(
+            "removePages.tooltip.pageNumbers.bullet2",
+            "Page ranges: 1-5,10-15 (removes pages 1-5 and 10-15)",
+          ),
+          t(
+            "removePages.tooltip.pageNumbers.bullet3",
+            "Mathematical: 2n+1 (removes odd pages)",
+          ),
+          t(
+            "removePages.tooltip.pageNumbers.bullet4",
+            "Open ranges: 5- (removes from page 5 to end)",
+          ),
+        ],
       },
       {
         title: t("removePages.tooltip.examples.title", "Common Examples"),
-        description: t("removePages.tooltip.examples.text", "Here are some common page selection patterns:"),
+        description: t(
+          "removePages.tooltip.examples.text",
+          "Here are some common page selection patterns:",
+        ),
         bullets: [
           t("removePages.tooltip.examples.bullet1", "Remove first page: 1"),
           t("removePages.tooltip.examples.bullet2", "Remove last 3 pages: -3"),
-          t("removePages.tooltip.examples.bullet3", "Remove every other page: 2n"),
-          t("removePages.tooltip.examples.bullet4", "Remove specific scattered pages: 1,5,10,15")
-        ]
-      }
-    ]
+          t(
+            "removePages.tooltip.examples.bullet3",
+            "Remove every other page: 2n",
+          ),
+          t(
+            "removePages.tooltip.examples.bullet4",
+            "Remove specific scattered pages: 1,5,10,15",
+          ),
+        ],
+      },
+    ],
   };
 };
diff --git a/frontend/src/core/components/tooltips/useRemovePasswordTips.ts b/frontend/src/core/components/tooltips/useRemovePasswordTips.ts
index 06ad72abf6..6148e9c8be 100644
--- a/frontend/src/core/components/tooltips/useRemovePasswordTips.ts
+++ b/frontend/src/core/components/tooltips/useRemovePasswordTips.ts
@@ -1,20 +1,20 @@
-import { useTranslation } from 'react-i18next';
-import { TooltipContent } from '@app/types/tips';
+import { useTranslation } from "react-i18next";
+import { TooltipContent } from "@app/types/tips";
 
 export const useRemovePasswordTips = (): TooltipContent => {
   const { t } = useTranslation();
 
   return {
     header: {
-      title: t("removePassword.title", "Remove Password")
+      title: t("removePassword.title", "Remove Password"),
     },
     tips: [
       {
         description: t(
           "removePassword.tooltip.description",
-          "Removing password protection requires the current password that was used to encrypt the PDF. This will decrypt the document, making it accessible without a password."
-        )
-      }
-    ]
+          "Removing password protection requires the current password that was used to encrypt the PDF. This will decrypt the document, making it accessible without a password.",
+        ),
+      },
+    ],
   };
 };
diff --git a/frontend/src/core/components/tooltips/useReplaceColorTips.ts b/frontend/src/core/components/tooltips/useReplaceColorTips.ts
index a6c3808d11..482281cbb1 100644
--- a/frontend/src/core/components/tooltips/useReplaceColorTips.ts
+++ b/frontend/src/core/components/tooltips/useReplaceColorTips.ts
@@ -1,44 +1,80 @@
-import { useTranslation } from 'react-i18next';
-import { TooltipContent } from '@app/types/tips';
+import { useTranslation } from "react-i18next";
+import { TooltipContent } from "@app/types/tips";
 
 export const useReplaceColorTips = (): TooltipContent => {
   const { t } = useTranslation();
 
   return {
     header: {
-      title: t("replaceColor.tooltip.header.title", "Replace & Invert Colour Settings Overview")
+      title: t(
+        "replaceColor.tooltip.header.title",
+        "Replace & Invert Colour Settings Overview",
+      ),
     },
     tips: [
       {
         title: t("replaceColor.tooltip.description.title", "Description"),
-        description: t("replaceColor.tooltip.description.text", "Transform PDF colours to improve readability and accessibility. Choose from high contrast presets, invert all colours, or create custom colour schemes.")
+        description: t(
+          "replaceColor.tooltip.description.text",
+          "Transform PDF colours to improve readability and accessibility. Choose from high contrast presets, invert all colours, or create custom colour schemes.",
+        ),
       },
       {
         title: t("replaceColor.tooltip.highContrast.title", "High Contrast"),
-        description: t("replaceColor.tooltip.highContrast.text", "Apply predefined high contrast colour combinations designed for better readability and accessibility compliance."),
+        description: t(
+          "replaceColor.tooltip.highContrast.text",
+          "Apply predefined high contrast colour combinations designed for better readability and accessibility compliance.",
+        ),
         bullets: [
-          t("replaceColor.tooltip.highContrast.bullet1", "White text on black background - Classic dark mode"),
-          t("replaceColor.tooltip.highContrast.bullet2", "Black text on white background - Standard high contrast"),
-          t("replaceColor.tooltip.highContrast.bullet3", "Yellow text on black background - High visibility option"),
-          t("replaceColor.tooltip.highContrast.bullet4", "Green text on black background - Alternative high contrast")
-        ]
+          t(
+            "replaceColor.tooltip.highContrast.bullet1",
+            "White text on black background - Classic dark mode",
+          ),
+          t(
+            "replaceColor.tooltip.highContrast.bullet2",
+            "Black text on white background - Standard high contrast",
+          ),
+          t(
+            "replaceColor.tooltip.highContrast.bullet3",
+            "Yellow text on black background - High visibility option",
+          ),
+          t(
+            "replaceColor.tooltip.highContrast.bullet4",
+            "Green text on black background - Alternative high contrast",
+          ),
+        ],
       },
       {
         title: t("replaceColor.tooltip.invertAll.title", "Invert All Colours"),
-        description: t("replaceColor.tooltip.invertAll.text", "Completely invert all colours in the PDF, creating a negative-like effect. Useful for creating dark mode versions of documents or reducing eye strain in low-light conditions.")
+        description: t(
+          "replaceColor.tooltip.invertAll.text",
+          "Completely invert all colours in the PDF, creating a negative-like effect. Useful for creating dark mode versions of documents or reducing eye strain in low-light conditions.",
+        ),
       },
       {
         title: t("replaceColor.tooltip.custom.title", "Custom Colours"),
-        description: t("replaceColor.tooltip.custom.text", "Define your own text and background colours using the colour pickers. Perfect for creating branded documents or specific accessibility requirements."),
+        description: t(
+          "replaceColor.tooltip.custom.text",
+          "Define your own text and background colours using the colour pickers. Perfect for creating branded documents or specific accessibility requirements.",
+        ),
         bullets: [
-          t("replaceColor.tooltip.custom.bullet1", "Text colour - Choose the colour for text elements"),
-          t("replaceColor.tooltip.custom.bullet2", "Background colour - Set the background colour for the document")
-        ]
+          t(
+            "replaceColor.tooltip.custom.bullet1",
+            "Text colour - Choose the colour for text elements",
+          ),
+          t(
+            "replaceColor.tooltip.custom.bullet2",
+            "Background colour - Set the background colour for the document",
+          ),
+        ],
       },
       {
         title: t("replaceColor.tooltip.cmyk.title", "Convert to CMYK"),
-        description: t("replaceColor.tooltip.cmyk.text", "Convert the PDF from RGB colour space to CMYK colour space, optimized for professional printing. This process converts colours to the Cyan, Magenta, Yellow, Black model used by printers.")
-      }
-    ]
+        description: t(
+          "replaceColor.tooltip.cmyk.text",
+          "Convert the PDF from RGB colour space to CMYK colour space, optimized for professional printing. This process converts colours to the Cyan, Magenta, Yellow, Black model used by printers.",
+        ),
+      },
+    ],
   };
 };
diff --git a/frontend/src/core/components/tooltips/useRotateTips.ts b/frontend/src/core/components/tooltips/useRotateTips.ts
index 83ad3e85ec..6da47f909b 100644
--- a/frontend/src/core/components/tooltips/useRotateTips.ts
+++ b/frontend/src/core/components/tooltips/useRotateTips.ts
@@ -1,5 +1,5 @@
-import { useTranslation } from 'react-i18next';
-import { TooltipContent } from '@app/types/tips';
+import { useTranslation } from "react-i18next";
+import { TooltipContent } from "@app/types/tips";
 
 export const useRotateTips = (): TooltipContent => {
   const { t } = useTranslation();
@@ -10,11 +10,17 @@ export const useRotateTips = (): TooltipContent => {
     },
     tips: [
       {
-        description: t("rotate.tooltip.description.text", "Rotate your PDF pages clockwise or anticlockwise in 90-degree increments. All pages in the PDF will be rotated. The preview shows how your document will look after rotation."),
+        description: t(
+          "rotate.tooltip.description.text",
+          "Rotate your PDF pages clockwise or anticlockwise in 90-degree increments. All pages in the PDF will be rotated. The preview shows how your document will look after rotation.",
+        ),
       },
       {
         title: t("rotate.tooltip.controls.title", "Controls"),
-        description: t("rotate.tooltip.controls.text", "Use the rotation buttons to adjust orientation. Left button rotates anticlockwise, right button rotates clockwise. Each click rotates by 90 degrees."),
+        description: t(
+          "rotate.tooltip.controls.text",
+          "Use the rotation buttons to adjust orientation. Left button rotates anticlockwise, right button rotates clockwise. Each click rotates by 90 degrees.",
+        ),
       },
     ],
   };
diff --git a/frontend/src/core/components/tooltips/useScannerImageSplitTips.ts b/frontend/src/core/components/tooltips/useScannerImageSplitTips.ts
index 022a305534..96a35efc49 100644
--- a/frontend/src/core/components/tooltips/useScannerImageSplitTips.ts
+++ b/frontend/src/core/components/tooltips/useScannerImageSplitTips.ts
@@ -1,54 +1,83 @@
-import { useTranslation } from 'react-i18next';
-import { TooltipContent } from '@app/types/tips';
+import { useTranslation } from "react-i18next";
+import { TooltipContent } from "@app/types/tips";
 
 export const useScannerImageSplitTips = (): TooltipContent => {
   const { t } = useTranslation();
 
   return {
     header: {
-      title: t('scannerImageSplit.tooltip.title', 'Photo Splitter')
+      title: t("scannerImageSplit.tooltip.title", "Photo Splitter"),
     },
     tips: [
       {
-        title: t('scannerImageSplit.tooltip.whatThisDoes', 'What this does'),
-        description: t('scannerImageSplit.tooltip.whatThisDoesDesc',
-          'Automatically finds and extracts each photo from a scanned page or composite image—no manual cropping.'
-        )
+        title: t("scannerImageSplit.tooltip.whatThisDoes", "What this does"),
+        description: t(
+          "scannerImageSplit.tooltip.whatThisDoesDesc",
+          "Automatically finds and extracts each photo from a scanned page or composite image—no manual cropping.",
+        ),
       },
       {
-        title: t('scannerImageSplit.tooltip.whenToUse', 'When to use'),
+        title: t("scannerImageSplit.tooltip.whenToUse", "When to use"),
         bullets: [
-          t('scannerImageSplit.tooltip.useCase1', 'Scan whole album pages in one go'),
-          t('scannerImageSplit.tooltip.useCase2', 'Split flatbed batches into separate files'),
-          t('scannerImageSplit.tooltip.useCase3', 'Break collages into individual photos'),
-          t('scannerImageSplit.tooltip.useCase4', 'Pull photos from documents')
-        ]
+          t(
+            "scannerImageSplit.tooltip.useCase1",
+            "Scan whole album pages in one go",
+          ),
+          t(
+            "scannerImageSplit.tooltip.useCase2",
+            "Split flatbed batches into separate files",
+          ),
+          t(
+            "scannerImageSplit.tooltip.useCase3",
+            "Break collages into individual photos",
+          ),
+          t("scannerImageSplit.tooltip.useCase4", "Pull photos from documents"),
+        ],
       },
       {
-        title: t('scannerImageSplit.tooltip.quickFixes', 'Quick fixes'),
+        title: t("scannerImageSplit.tooltip.quickFixes", "Quick fixes"),
         bullets: [
-          t('scannerImageSplit.tooltip.problem1', 'Photos not detected → increase Tolerance to 30–50'),
-          t('scannerImageSplit.tooltip.problem2', 'Too many false detections → increase Minimum Area to 15,000–20,000'),
-          t('scannerImageSplit.tooltip.problem3', 'Crops are too tight → increase Border Size to 5–10'),
-          t('scannerImageSplit.tooltip.problem4', 'Tilted photos not straightened → lower Angle Threshold to ~5°'),
-          t('scannerImageSplit.tooltip.problem5', 'Dust/noise boxes → increase Minimum Contour Area to 1000–2000')
-        ]
+          t(
+            "scannerImageSplit.tooltip.problem1",
+            "Photos not detected → increase Tolerance to 30–50",
+          ),
+          t(
+            "scannerImageSplit.tooltip.problem2",
+            "Too many false detections → increase Minimum Area to 15,000–20,000",
+          ),
+          t(
+            "scannerImageSplit.tooltip.problem3",
+            "Crops are too tight → increase Border Size to 5–10",
+          ),
+          t(
+            "scannerImageSplit.tooltip.problem4",
+            "Tilted photos not straightened → lower Angle Threshold to ~5°",
+          ),
+          t(
+            "scannerImageSplit.tooltip.problem5",
+            "Dust/noise boxes → increase Minimum Contour Area to 1000–2000",
+          ),
+        ],
       },
       {
-        title: t('scannerImageSplit.tooltip.setupTips', 'Setup tips'),
+        title: t("scannerImageSplit.tooltip.setupTips", "Setup tips"),
         bullets: [
-          t('scannerImageSplit.tooltip.tip1', 'Use a plain, light background'),
-          t('scannerImageSplit.tooltip.tip2', 'Leave a small gap (≈1 cm) between photos'),
-          t('scannerImageSplit.tooltip.tip3', 'Scan at 300–600 DPI'),
-          t('scannerImageSplit.tooltip.tip4', 'Clean the scanner glass')
-        ]
+          t("scannerImageSplit.tooltip.tip1", "Use a plain, light background"),
+          t(
+            "scannerImageSplit.tooltip.tip2",
+            "Leave a small gap (≈1 cm) between photos",
+          ),
+          t("scannerImageSplit.tooltip.tip3", "Scan at 300–600 DPI"),
+          t("scannerImageSplit.tooltip.tip4", "Clean the scanner glass"),
+        ],
       },
       {
-        title: t('scannerImageSplit.tooltip.headsUp', 'Heads-up'),
-        description: t('scannerImageSplit.tooltip.headsUpDesc',
-          'Overlapping photos or backgrounds very close in colour to the photos can reduce accuracy—try a lighter or darker background and leave more space.'
-        )
-      }
-    ]
+        title: t("scannerImageSplit.tooltip.headsUp", "Heads-up"),
+        description: t(
+          "scannerImageSplit.tooltip.headsUpDesc",
+          "Overlapping photos or backgrounds very close in colour to the photos can reduce accuracy—try a lighter or darker background and leave more space.",
+        ),
+      },
+    ],
   };
-};
\ No newline at end of file
+};
diff --git a/frontend/src/core/components/tooltips/useSessionManagementTips.ts b/frontend/src/core/components/tooltips/useSessionManagementTips.ts
index e532bed049..dd36f7fc83 100644
--- a/frontend/src/core/components/tooltips/useSessionManagementTips.ts
+++ b/frontend/src/core/components/tooltips/useSessionManagementTips.ts
@@ -1,61 +1,112 @@
-import { useTranslation } from 'react-i18next';
-import { TooltipContent } from '@app/types/tips';
+import { useTranslation } from "react-i18next";
+import { TooltipContent } from "@app/types/tips";
 
 export const useSessionManagementTips = (): TooltipContent => {
   const { t } = useTranslation();
 
   return {
     header: {
-      title: t('sessionManagement.tooltip.header', 'Managing Signing Sessions'),
+      title: t("sessionManagement.tooltip.header", "Managing Signing Sessions"),
     },
     tips: [
       {
-        title: t('sessionManagement.tooltip.addParticipants.title', 'Adding Participants'),
+        title: t(
+          "sessionManagement.tooltip.addParticipants.title",
+          "Adding Participants",
+        ),
         description: t(
-          'sessionManagement.tooltip.addParticipants.description',
-          'You can add more participants to an active session at any time before finalization.'
+          "sessionManagement.tooltip.addParticipants.description",
+          "You can add more participants to an active session at any time before finalization.",
         ),
         bullets: [
-          t('sessionManagement.tooltip.addParticipants.bullet1', 'New participants added to the end of signing order'),
-          t('sessionManagement.tooltip.addParticipants.bullet2', 'Cannot add participants after session is finalized'),
-          t('sessionManagement.tooltip.addParticipants.bullet3', 'Each participant receives a notification when it\'s their turn'),
+          t(
+            "sessionManagement.tooltip.addParticipants.bullet1",
+            "New participants added to the end of signing order",
+          ),
+          t(
+            "sessionManagement.tooltip.addParticipants.bullet2",
+            "Cannot add participants after session is finalized",
+          ),
+          t(
+            "sessionManagement.tooltip.addParticipants.bullet3",
+            "Each participant receives a notification when it's their turn",
+          ),
         ],
       },
       {
-        title: t('sessionManagement.tooltip.finalization.title', 'Session Finalization'),
+        title: t(
+          "sessionManagement.tooltip.finalization.title",
+          "Session Finalization",
+        ),
         description: t(
-          'sessionManagement.tooltip.finalization.description',
-          'Finalization combines all signatures into a single signed PDF. This action cannot be undone.'
+          "sessionManagement.tooltip.finalization.description",
+          "Finalization combines all signatures into a single signed PDF. This action cannot be undone.",
         ),
         bullets: [
-          t('sessionManagement.tooltip.finalization.bullet1', '<b>Full finalization</b>: All participants have signed'),
-          t('sessionManagement.tooltip.finalization.bullet2', '<b>Partial finalization</b>: Some participants haven\'t signed yet'),
-          t('sessionManagement.tooltip.finalization.bullet3', 'Unsigned participants will be excluded from the final document'),
-          t('sessionManagement.tooltip.finalization.bullet4', 'Once finalized, you can load the signed PDF into active files'),
+          t(
+            "sessionManagement.tooltip.finalization.bullet1",
+            "<b>Full finalization</b>: All participants have signed",
+          ),
+          t(
+            "sessionManagement.tooltip.finalization.bullet2",
+            "<b>Partial finalization</b>: Some participants haven't signed yet",
+          ),
+          t(
+            "sessionManagement.tooltip.finalization.bullet3",
+            "Unsigned participants will be excluded from the final document",
+          ),
+          t(
+            "sessionManagement.tooltip.finalization.bullet4",
+            "Once finalized, you can load the signed PDF into active files",
+          ),
         ],
       },
       {
-        title: t('sessionManagement.tooltip.signatureOrder.title', 'Signature Order'),
+        title: t(
+          "sessionManagement.tooltip.signatureOrder.title",
+          "Signature Order",
+        ),
         description: t(
-          'sessionManagement.tooltip.signatureOrder.description',
-          'The order you specify when creating the session determines who signs first.'
+          "sessionManagement.tooltip.signatureOrder.description",
+          "The order you specify when creating the session determines who signs first.",
         ),
         bullets: [
-          t('sessionManagement.tooltip.signatureOrder.bullet1', 'Each signature is applied sequentially to the PDF'),
-          t('sessionManagement.tooltip.signatureOrder.bullet2', 'Later signers can see earlier signatures'),
-          t('sessionManagement.tooltip.signatureOrder.bullet3', 'Critical for approval workflows and legal chains of custody'),
+          t(
+            "sessionManagement.tooltip.signatureOrder.bullet1",
+            "Each signature is applied sequentially to the PDF",
+          ),
+          t(
+            "sessionManagement.tooltip.signatureOrder.bullet2",
+            "Later signers can see earlier signatures",
+          ),
+          t(
+            "sessionManagement.tooltip.signatureOrder.bullet3",
+            "Critical for approval workflows and legal chains of custody",
+          ),
         ],
       },
       {
-        title: t('sessionManagement.tooltip.participantRemoval.title', 'Removing Participants'),
+        title: t(
+          "sessionManagement.tooltip.participantRemoval.title",
+          "Removing Participants",
+        ),
         description: t(
-          'sessionManagement.tooltip.participantRemoval.description',
-          'Participants can be removed from sessions before they sign.'
+          "sessionManagement.tooltip.participantRemoval.description",
+          "Participants can be removed from sessions before they sign.",
         ),
         bullets: [
-          t('sessionManagement.tooltip.participantRemoval.bullet1', 'Cannot remove participants who have already signed'),
-          t('sessionManagement.tooltip.participantRemoval.bullet2', 'Removed participants no longer receive notifications'),
-          t('sessionManagement.tooltip.participantRemoval.bullet3', 'Signing order adjusts automatically'),
+          t(
+            "sessionManagement.tooltip.participantRemoval.bullet1",
+            "Cannot remove participants who have already signed",
+          ),
+          t(
+            "sessionManagement.tooltip.participantRemoval.bullet2",
+            "Removed participants no longer receive notifications",
+          ),
+          t(
+            "sessionManagement.tooltip.participantRemoval.bullet3",
+            "Signing order adjusts automatically",
+          ),
         ],
       },
     ],
diff --git a/frontend/src/core/components/tooltips/useSignModeTips.ts b/frontend/src/core/components/tooltips/useSignModeTips.ts
index a8cbaf49ec..8784abc5f9 100644
--- a/frontend/src/core/components/tooltips/useSignModeTips.ts
+++ b/frontend/src/core/components/tooltips/useSignModeTips.ts
@@ -1,36 +1,66 @@
-import { useTranslation } from 'react-i18next';
-import { TooltipContent } from '@app/types/tips';
+import { useTranslation } from "react-i18next";
+import { TooltipContent } from "@app/types/tips";
 
 export const useSignModeTips = (): TooltipContent => {
   const { t } = useTranslation();
 
   return {
     header: {
-      title: t("certSign.signMode.tooltip.header.title", "About PDF Signatures")
+      title: t(
+        "certSign.signMode.tooltip.header.title",
+        "About PDF Signatures",
+      ),
     },
     tips: [
       {
-        title: t("certSign.signMode.tooltip.overview.title", "How signatures work"),
-        description: t("certSign.signMode.tooltip.overview.text", "Both modes seal the document (any edits are flagged as tampering) and record who/when/how for auditing. Viewer trust depends on the certificate chain.")
+        title: t(
+          "certSign.signMode.tooltip.overview.title",
+          "How signatures work",
+        ),
+        description: t(
+          "certSign.signMode.tooltip.overview.text",
+          "Both modes seal the document (any edits are flagged as tampering) and record who/when/how for auditing. Viewer trust depends on the certificate chain.",
+        ),
       },
       {
-        title: t("certSign.signMode.tooltip.manual.title", "Manual - Bring your certificate"),
-        description: t("certSign.signMode.tooltip.manual.text", "Use your own certificate files for brand-aligned identity. Can display <b>Trusted</b> when your CA/chain is recognized."),
+        title: t(
+          "certSign.signMode.tooltip.manual.title",
+          "Manual - Bring your certificate",
+        ),
+        description: t(
+          "certSign.signMode.tooltip.manual.text",
+          "Use your own certificate files for brand-aligned identity. Can display <b>Trusted</b> when your CA/chain is recognized.",
+        ),
         bullets: [
-          t("certSign.signMode.tooltip.manual.use", "Use for: customer-facing, legal, compliance.")
-        ]
+          t(
+            "certSign.signMode.tooltip.manual.use",
+            "Use for: customer-facing, legal, compliance.",
+          ),
+        ],
       },
       {
-        title: t("certSign.signMode.tooltip.auto.title", "Auto - Zero-setup, instant system seal"),
-        description: t("certSign.signMode.tooltip.auto.text", "Signs with a server <b>self-signed</b> certificate. Same <b>tamper-evident seal</b> and <b>audit trail</b>; typically shows <b>Unverified</b> in viewers."),
+        title: t(
+          "certSign.signMode.tooltip.auto.title",
+          "Auto - Zero-setup, instant system seal",
+        ),
+        description: t(
+          "certSign.signMode.tooltip.auto.text",
+          "Signs with a server <b>self-signed</b> certificate. Same <b>tamper-evident seal</b> and <b>audit trail</b>; typically shows <b>Unverified</b> in viewers.",
+        ),
         bullets: [
-          t("certSign.signMode.tooltip.auto.use", "Use when: you need speed and consistent internal identity across reviews and records.")
-        ]
+          t(
+            "certSign.signMode.tooltip.auto.use",
+            "Use when: you need speed and consistent internal identity across reviews and records.",
+          ),
+        ],
       },
       {
         title: t("certSign.signMode.tooltip.rule.title", "Rule of thumb"),
-        description: t("certSign.signMode.tooltip.rule.text", "Need recipient <b>Trusted</b> status? <b>Manual</b>. Need a fast, tamper-evident seal and audit trail with no setup? <b>Auto</b>.")
-      }
-    ]
+        description: t(
+          "certSign.signMode.tooltip.rule.text",
+          "Need recipient <b>Trusted</b> status? <b>Manual</b>. Need a fast, tamper-evident seal and audit trail with no setup? <b>Auto</b>.",
+        ),
+      },
+    ],
   };
-};
\ No newline at end of file
+};
diff --git a/frontend/src/core/components/tooltips/useSignatureAppearanceTips.ts b/frontend/src/core/components/tooltips/useSignatureAppearanceTips.ts
index 43ec619143..641191853c 100644
--- a/frontend/src/core/components/tooltips/useSignatureAppearanceTips.ts
+++ b/frontend/src/core/components/tooltips/useSignatureAppearanceTips.ts
@@ -1,33 +1,69 @@
-import { useTranslation } from 'react-i18next';
-import { TooltipContent } from '@app/types/tips';
+import { useTranslation } from "react-i18next";
+import { TooltipContent } from "@app/types/tips";
 
 export const useSignatureAppearanceTips = (): TooltipContent => {
   const { t } = useTranslation();
 
   return {
     header: {
-      title: t("certSign.appearance.tooltip.header.title", "About Signature Appearance")
+      title: t(
+        "certSign.appearance.tooltip.header.title",
+        "About Signature Appearance",
+      ),
     },
     tips: [
       {
-        title: t("certSign.appearance.tooltip.invisible.title", "Invisible Signatures"),
-        description: t("certSign.appearance.tooltip.invisible.text", "The signature is added to the PDF for security but won't be visible when viewing the document. Perfect for legal requirements without changing the document's appearance."),
+        title: t(
+          "certSign.appearance.tooltip.invisible.title",
+          "Invisible Signatures",
+        ),
+        description: t(
+          "certSign.appearance.tooltip.invisible.text",
+          "The signature is added to the PDF for security but won't be visible when viewing the document. Perfect for legal requirements without changing the document's appearance.",
+        ),
         bullets: [
-          t("certSign.appearance.tooltip.invisible.bullet1", "Provides security without visual changes"),
-          t("certSign.appearance.tooltip.invisible.bullet2", "Meets legal requirements for digital signing"),
-          t("certSign.appearance.tooltip.invisible.bullet3", "Doesn't affect document layout or design")
-        ]
+          t(
+            "certSign.appearance.tooltip.invisible.bullet1",
+            "Provides security without visual changes",
+          ),
+          t(
+            "certSign.appearance.tooltip.invisible.bullet2",
+            "Meets legal requirements for digital signing",
+          ),
+          t(
+            "certSign.appearance.tooltip.invisible.bullet3",
+            "Doesn't affect document layout or design",
+          ),
+        ],
       },
       {
-        title: t("certSign.appearance.tooltip.visible.title", "Visible Signatures"),
-        description: t("certSign.appearance.tooltip.visible.text", "Shows a signature block on the PDF with your name, date, and optional details. Useful when you want readers to clearly see the document is signed."),
+        title: t(
+          "certSign.appearance.tooltip.visible.title",
+          "Visible Signatures",
+        ),
+        description: t(
+          "certSign.appearance.tooltip.visible.text",
+          "Shows a signature block on the PDF with your name, date, and optional details. Useful when you want readers to clearly see the document is signed.",
+        ),
         bullets: [
-          t("certSign.appearance.tooltip.visible.bullet1", "Shows signer name and date on the document"),
-          t("certSign.appearance.tooltip.visible.bullet2", "Can include reason and location for signing"),
-          t("certSign.appearance.tooltip.visible.bullet3", "Choose which page to place the signature"),
-          t("certSign.appearance.tooltip.visible.bullet4", "Optional logo can be included")
-        ]
-      }
-    ]
+          t(
+            "certSign.appearance.tooltip.visible.bullet1",
+            "Shows signer name and date on the document",
+          ),
+          t(
+            "certSign.appearance.tooltip.visible.bullet2",
+            "Can include reason and location for signing",
+          ),
+          t(
+            "certSign.appearance.tooltip.visible.bullet3",
+            "Choose which page to place the signature",
+          ),
+          t(
+            "certSign.appearance.tooltip.visible.bullet4",
+            "Optional logo can be included",
+          ),
+        ],
+      },
+    ],
   };
-};
\ No newline at end of file
+};
diff --git a/frontend/src/core/components/tooltips/useSignatureSettingsTips.ts b/frontend/src/core/components/tooltips/useSignatureSettingsTips.ts
index c1da24955f..9a94f06ad5 100644
--- a/frontend/src/core/components/tooltips/useSignatureSettingsTips.ts
+++ b/frontend/src/core/components/tooltips/useSignatureSettingsTips.ts
@@ -1,60 +1,105 @@
-import { useTranslation } from 'react-i18next';
-import { TooltipContent } from '@app/types/tips';
+import { useTranslation } from "react-i18next";
+import { TooltipContent } from "@app/types/tips";
 
 export const useSignatureSettingsTips = (): TooltipContent => {
   const { t } = useTranslation();
 
   return {
     header: {
-      title: t('signatureSettings.tooltip.header', 'Signature Appearance Settings'),
+      title: t(
+        "signatureSettings.tooltip.header",
+        "Signature Appearance Settings",
+      ),
     },
     tips: [
       {
-        title: t('signatureSettings.tooltip.visibility.title', 'Signature Visibility'),
+        title: t(
+          "signatureSettings.tooltip.visibility.title",
+          "Signature Visibility",
+        ),
         description: t(
-          'signatureSettings.tooltip.visibility.description',
-          'Controls whether the signature is visible on the document or embedded invisibly.'
+          "signatureSettings.tooltip.visibility.description",
+          "Controls whether the signature is visible on the document or embedded invisibly.",
         ),
         bullets: [
-          t('signatureSettings.tooltip.visibility.bullet1', '<b>Visible</b>: Signature appears on PDF with custom appearance'),
-          t('signatureSettings.tooltip.visibility.bullet2', '<b>Invisible</b>: Certificate embedded without visual mark'),
-          t('signatureSettings.tooltip.visibility.bullet3', 'Invisible signatures still provide cryptographic validation'),
+          t(
+            "signatureSettings.tooltip.visibility.bullet1",
+            "<b>Visible</b>: Signature appears on PDF with custom appearance",
+          ),
+          t(
+            "signatureSettings.tooltip.visibility.bullet2",
+            "<b>Invisible</b>: Certificate embedded without visual mark",
+          ),
+          t(
+            "signatureSettings.tooltip.visibility.bullet3",
+            "Invisible signatures still provide cryptographic validation",
+          ),
         ],
       },
       {
-        title: t('signatureSettings.tooltip.reason.title', 'Signature Reason'),
+        title: t("signatureSettings.tooltip.reason.title", "Signature Reason"),
         description: t(
-          'signatureSettings.tooltip.reason.description',
-          'Optional text explaining why the document is being signed. Stored in certificate metadata.'
+          "signatureSettings.tooltip.reason.description",
+          "Optional text explaining why the document is being signed. Stored in certificate metadata.",
         ),
         bullets: [
-          t('signatureSettings.tooltip.reason.bullet1', 'Examples: "Approval", "Contract Agreement", "Review Complete"'),
-          t('signatureSettings.tooltip.reason.bullet2', 'Visible in PDF signature properties'),
-          t('signatureSettings.tooltip.reason.bullet3', 'Useful for audit trails and compliance'),
+          t(
+            "signatureSettings.tooltip.reason.bullet1",
+            'Examples: "Approval", "Contract Agreement", "Review Complete"',
+          ),
+          t(
+            "signatureSettings.tooltip.reason.bullet2",
+            "Visible in PDF signature properties",
+          ),
+          t(
+            "signatureSettings.tooltip.reason.bullet3",
+            "Useful for audit trails and compliance",
+          ),
         ],
       },
       {
-        title: t('signatureSettings.tooltip.location.title', 'Signature Location'),
+        title: t(
+          "signatureSettings.tooltip.location.title",
+          "Signature Location",
+        ),
         description: t(
-          'signatureSettings.tooltip.location.description',
-          'Optional geographic location where the signature was applied. Stored in certificate metadata.'
+          "signatureSettings.tooltip.location.description",
+          "Optional geographic location where the signature was applied. Stored in certificate metadata.",
         ),
         bullets: [
-          t('signatureSettings.tooltip.location.bullet1', 'Examples: "New York, USA", "London Office", "Remote"'),
-          t('signatureSettings.tooltip.location.bullet2', 'Not the same as page position'),
-          t('signatureSettings.tooltip.location.bullet3', 'May be required for certain legal jurisdictions'),
+          t(
+            "signatureSettings.tooltip.location.bullet1",
+            'Examples: "New York, USA", "London Office", "Remote"',
+          ),
+          t(
+            "signatureSettings.tooltip.location.bullet2",
+            "Not the same as page position",
+          ),
+          t(
+            "signatureSettings.tooltip.location.bullet3",
+            "May be required for certain legal jurisdictions",
+          ),
         ],
       },
       {
-        title: t('signatureSettings.tooltip.logo.title', 'Company Logo'),
+        title: t("signatureSettings.tooltip.logo.title", "Company Logo"),
         description: t(
-          'signatureSettings.tooltip.logo.description',
-          'Add a company logo to visible signatures for branding and authenticity.'
+          "signatureSettings.tooltip.logo.description",
+          "Add a company logo to visible signatures for branding and authenticity.",
         ),
         bullets: [
-          t('signatureSettings.tooltip.logo.bullet1', 'Displayed alongside signature and text'),
-          t('signatureSettings.tooltip.logo.bullet2', 'Supports PNG, JPG formats'),
-          t('signatureSettings.tooltip.logo.bullet3', 'Enhances professional appearance'),
+          t(
+            "signatureSettings.tooltip.logo.bullet1",
+            "Displayed alongside signature and text",
+          ),
+          t(
+            "signatureSettings.tooltip.logo.bullet2",
+            "Supports PNG, JPG formats",
+          ),
+          t(
+            "signatureSettings.tooltip.logo.bullet3",
+            "Enhances professional appearance",
+          ),
         ],
       },
     ],
diff --git a/frontend/src/core/components/tooltips/useSplitMethodTips.ts b/frontend/src/core/components/tooltips/useSplitMethodTips.ts
index 57105be6e8..1a12d000ee 100644
--- a/frontend/src/core/components/tooltips/useSplitMethodTips.ts
+++ b/frontend/src/core/components/tooltips/useSplitMethodTips.ts
@@ -1,24 +1,45 @@
-import { useTranslation } from 'react-i18next';
-import { TooltipContent } from '@app/types/tips';
+import { useTranslation } from "react-i18next";
+import { TooltipContent } from "@app/types/tips";
 
 export const useSplitMethodTips = (): TooltipContent => {
   const { t } = useTranslation();
 
   return {
     header: {
-      title: t("split.methodSelection.tooltip.title", "Choose Your Split Method")
+      title: t(
+        "split.methodSelection.tooltip.title",
+        "Choose Your Split Method",
+      ),
     },
     tips: [
       {
-        title: t("split.methodSelection.tooltip.header.title", "Split Method Selection"),
-        description: t("split.methodSelection.tooltip.header.text", "Choose how you want to split your PDF document. Each method is optimized for different use cases and document types."),
+        title: t(
+          "split.methodSelection.tooltip.header.title",
+          "Split Method Selection",
+        ),
+        description: t(
+          "split.methodSelection.tooltip.header.text",
+          "Choose how you want to split your PDF document. Each method is optimized for different use cases and document types.",
+        ),
         bullets: [
-          t("split.methodSelection.tooltip.bullet1", "Click on a method card to select it"),
-          t("split.methodSelection.tooltip.bullet2", "Hover over each card to see a quick description"),
-          t("split.methodSelection.tooltip.bullet3", "The settings step will appear after you select a method"),
-          t("split.methodSelection.tooltip.bullet4", "You can change methods at any time before processing")
-        ]
-      }
-    ]
+          t(
+            "split.methodSelection.tooltip.bullet1",
+            "Click on a method card to select it",
+          ),
+          t(
+            "split.methodSelection.tooltip.bullet2",
+            "Hover over each card to see a quick description",
+          ),
+          t(
+            "split.methodSelection.tooltip.bullet3",
+            "The settings step will appear after you select a method",
+          ),
+          t(
+            "split.methodSelection.tooltip.bullet4",
+            "You can change methods at any time before processing",
+          ),
+        ],
+      },
+    ],
   };
-};
\ No newline at end of file
+};
diff --git a/frontend/src/core/components/tooltips/useSplitSettingsTips.ts b/frontend/src/core/components/tooltips/useSplitSettingsTips.ts
index 37fff5aa57..2d0df05833 100644
--- a/frontend/src/core/components/tooltips/useSplitSettingsTips.ts
+++ b/frontend/src/core/components/tooltips/useSplitSettingsTips.ts
@@ -1,8 +1,10 @@
-import { useTranslation } from 'react-i18next';
-import { TooltipContent } from '@app/types/tips';
-import { SPLIT_METHODS, type SplitMethod } from '@app/constants/splitConstants';
+import { useTranslation } from "react-i18next";
+import { TooltipContent } from "@app/types/tips";
+import { SPLIT_METHODS, type SplitMethod } from "@app/constants/splitConstants";
 
-export const useSplitSettingsTips = (method: SplitMethod | null): TooltipContent | null => {
+export const useSplitSettingsTips = (
+  method: SplitMethod | null,
+): TooltipContent | null => {
   const { t } = useTranslation();
 
   if (!method) return null;
@@ -10,142 +12,241 @@ export const useSplitSettingsTips = (method: SplitMethod | null): TooltipContent
   const tooltipMap: Record<SplitMethod, TooltipContent> = {
     [SPLIT_METHODS.BY_PAGES]: {
       header: {
-        title: t("split.tooltip.byPages.title", "Split at Page Numbers")
+        title: t("split.tooltip.byPages.title", "Split at Page Numbers"),
       },
       tips: [
         {
           title: t("split.tooltip.byPages.title", "Split at Page Numbers"),
-          description: t("split.tooltip.byPages.text", "Extract specific pages or ranges from your PDF. Use commas to separate individual pages and hyphens for ranges."),
+          description: t(
+            "split.tooltip.byPages.text",
+            "Extract specific pages or ranges from your PDF. Use commas to separate individual pages and hyphens for ranges.",
+          ),
           bullets: [
             t("split.tooltip.byPages.bullet1", "Single pages: 1,3,5"),
             t("split.tooltip.byPages.bullet2", "Page ranges: 1-5,10-15"),
-            t("split.tooltip.byPages.bullet3", "Mixed: 1,3-7,12,15-20")
-          ]
-        }
-      ]
+            t("split.tooltip.byPages.bullet3", "Mixed: 1,3-7,12,15-20"),
+          ],
+        },
+      ],
     },
 
     [SPLIT_METHODS.BY_SECTIONS]: {
       header: {
-        title: t("split.tooltip.bySections.title", "Split by Grid Sections")
+        title: t("split.tooltip.bySections.title", "Split by Grid Sections"),
       },
       tips: [
         {
           title: t("split.tooltip.bySections.title", "Split by Grid Sections"),
-          description: t("split.tooltip.bySections.text", "Divide each page into a grid of sections. Useful for splitting documents with multiple columns or extracting specific areas."),
+          description: t(
+            "split.tooltip.bySections.text",
+            "Divide each page into a grid of sections. Useful for splitting documents with multiple columns or extracting specific areas.",
+          ),
           bullets: [
-            t("split.tooltip.bySections.bullet1", "Horizontal: Number of rows to create"),
-            t("split.tooltip.bySections.bullet2", "Vertical: Number of columns to create"),
-            t("split.tooltip.bySections.bullet3", "Merge: Combine all sections into one PDF")
-          ]
-        }
-      ]
+            t(
+              "split.tooltip.bySections.bullet1",
+              "Horizontal: Number of rows to create",
+            ),
+            t(
+              "split.tooltip.bySections.bullet2",
+              "Vertical: Number of columns to create",
+            ),
+            t(
+              "split.tooltip.bySections.bullet3",
+              "Merge: Combine all sections into one PDF",
+            ),
+          ],
+        },
+      ],
     },
 
     [SPLIT_METHODS.BY_SIZE]: {
       header: {
-        title: t("split.tooltip.bySize.title", "Split by File Size")
+        title: t("split.tooltip.bySize.title", "Split by File Size"),
       },
       tips: [
         {
           title: t("split.tooltip.bySize.title", "Split by File Size"),
-          description: t("split.tooltip.bySize.text", "Create multiple PDFs that don't exceed a specified file size. Ideal for file size limitations or email attachments."),
+          description: t(
+            "split.tooltip.bySize.text",
+            "Create multiple PDFs that don't exceed a specified file size. Ideal for file size limitations or email attachments.",
+          ),
           bullets: [
-            t("split.tooltip.bySize.bullet1", "Use MB for larger files (e.g., 10MB)"),
-            t("split.tooltip.bySize.bullet2", "Use KB for smaller files (e.g., 500KB)"),
-            t("split.tooltip.bySize.bullet3", "System will split at page boundaries")
-          ]
-        }
-      ]
+            t(
+              "split.tooltip.bySize.bullet1",
+              "Use MB for larger files (e.g., 10MB)",
+            ),
+            t(
+              "split.tooltip.bySize.bullet2",
+              "Use KB for smaller files (e.g., 500KB)",
+            ),
+            t(
+              "split.tooltip.bySize.bullet3",
+              "System will split at page boundaries",
+            ),
+          ],
+        },
+      ],
     },
 
     [SPLIT_METHODS.BY_PAGE_COUNT]: {
       header: {
-        title: t("split.tooltip.byPageCount.title", "Split by Page Count")
+        title: t("split.tooltip.byPageCount.title", "Split by Page Count"),
       },
       tips: [
         {
           title: t("split.tooltip.byPageCount.title", "Split by Page Count"),
-          description: t("split.tooltip.byPageCount.text", "Create multiple PDFs with a specific number of pages each. Perfect for creating uniform document chunks."),
+          description: t(
+            "split.tooltip.byPageCount.text",
+            "Create multiple PDFs with a specific number of pages each. Perfect for creating uniform document chunks.",
+          ),
           bullets: [
-            t("split.tooltip.byPageCount.bullet1", "Enter the number of pages per output file"),
-            t("split.tooltip.byPageCount.bullet2", "Last file may have fewer pages if not evenly divisible"),
-            t("split.tooltip.byPageCount.bullet3", "Useful for batch processing workflows")
-          ]
-        }
-      ]
+            t(
+              "split.tooltip.byPageCount.bullet1",
+              "Enter the number of pages per output file",
+            ),
+            t(
+              "split.tooltip.byPageCount.bullet2",
+              "Last file may have fewer pages if not evenly divisible",
+            ),
+            t(
+              "split.tooltip.byPageCount.bullet3",
+              "Useful for batch processing workflows",
+            ),
+          ],
+        },
+      ],
     },
 
     [SPLIT_METHODS.BY_DOC_COUNT]: {
       header: {
-        title: t("split.tooltip.byDocCount.title", "Split by Document Count")
+        title: t("split.tooltip.byDocCount.title", "Split by Document Count"),
       },
       tips: [
         {
           title: t("split.tooltip.byDocCount.title", "Split by Document Count"),
-          description: t("split.tooltip.byDocCount.text", "Create a specific number of output files by evenly distributing pages across them."),
+          description: t(
+            "split.tooltip.byDocCount.text",
+            "Create a specific number of output files by evenly distributing pages across them.",
+          ),
           bullets: [
-            t("split.tooltip.byDocCount.bullet1", "Enter the number of output files you want"),
-            t("split.tooltip.byDocCount.bullet2", "Pages are distributed as evenly as possible"),
-            t("split.tooltip.byDocCount.bullet3", "Useful when you need a specific number of files")
-          ]
-        }
-      ]
+            t(
+              "split.tooltip.byDocCount.bullet1",
+              "Enter the number of output files you want",
+            ),
+            t(
+              "split.tooltip.byDocCount.bullet2",
+              "Pages are distributed as evenly as possible",
+            ),
+            t(
+              "split.tooltip.byDocCount.bullet3",
+              "Useful when you need a specific number of files",
+            ),
+          ],
+        },
+      ],
     },
 
     [SPLIT_METHODS.BY_CHAPTERS]: {
       header: {
-        title: t("split.tooltip.byChapters.title", "Split by Chapters")
+        title: t("split.tooltip.byChapters.title", "Split by Chapters"),
       },
       tips: [
         {
           title: t("split.tooltip.byChapters.title", "Split by Chapters"),
-          description: t("split.tooltip.byChapters.text", "Use PDF bookmarks to automatically split at chapter boundaries. Requires PDFs with bookmark structure."),
+          description: t(
+            "split.tooltip.byChapters.text",
+            "Use PDF bookmarks to automatically split at chapter boundaries. Requires PDFs with bookmark structure.",
+          ),
           bullets: [
-            t("split.tooltip.byChapters.bullet1", "Bookmark Level: Which level to split on (1=top level)"),
-            t("split.tooltip.byChapters.bullet2", "Include Metadata: Preserve document properties"),
-            t("split.tooltip.byChapters.bullet3", "Allow Duplicates: Handle repeated bookmark names")
-          ]
-        }
-      ]
+            t(
+              "split.tooltip.byChapters.bullet1",
+              "Bookmark Level: Which level to split on (1=top level)",
+            ),
+            t(
+              "split.tooltip.byChapters.bullet2",
+              "Include Metadata: Preserve document properties",
+            ),
+            t(
+              "split.tooltip.byChapters.bullet3",
+              "Allow Duplicates: Handle repeated bookmark names",
+            ),
+          ],
+        },
+      ],
     },
 
     [SPLIT_METHODS.BY_PAGE_DIVIDER]: {
       header: {
-        title: t("split.tooltip.byPageDivider.title", "Split by Page Divider")
+        title: t("split.tooltip.byPageDivider.title", "Split by Page Divider"),
       },
       tips: [
         {
-          title: t("split.tooltip.byPageDivider.title", "Split by Page Divider"),
-          description: t("split.tooltip.byPageDivider.text", "Automatically split scanned documents using physical divider sheets with QR codes. Perfect for processing multiple documents scanned together."),
+          title: t(
+            "split.tooltip.byPageDivider.title",
+            "Split by Page Divider",
+          ),
+          description: t(
+            "split.tooltip.byPageDivider.text",
+            "Automatically split scanned documents using physical divider sheets with QR codes. Perfect for processing multiple documents scanned together.",
+          ),
           bullets: [
-            t("split.tooltip.byPageDivider.bullet1", "Print divider sheets from the download link"),
-            t("split.tooltip.byPageDivider.bullet2", "Insert divider sheets between your documents"),
-            t("split.tooltip.byPageDivider.bullet3", "Scan all documents together as one PDF"),
-            t("split.tooltip.byPageDivider.bullet4", "Upload - divider pages are automatically detected and removed"),
-            t("split.tooltip.byPageDivider.bullet5", "Enable Duplex Mode if scanning both sides of divider sheets")
-          ]
-        }
-      ]
+            t(
+              "split.tooltip.byPageDivider.bullet1",
+              "Print divider sheets from the download link",
+            ),
+            t(
+              "split.tooltip.byPageDivider.bullet2",
+              "Insert divider sheets between your documents",
+            ),
+            t(
+              "split.tooltip.byPageDivider.bullet3",
+              "Scan all documents together as one PDF",
+            ),
+            t(
+              "split.tooltip.byPageDivider.bullet4",
+              "Upload - divider pages are automatically detected and removed",
+            ),
+            t(
+              "split.tooltip.byPageDivider.bullet5",
+              "Enable Duplex Mode if scanning both sides of divider sheets",
+            ),
+          ],
+        },
+      ],
     },
 
     [SPLIT_METHODS.BY_POSTER]: {
       header: {
-        title: t("split.tooltip.byPoster.title", "Split for Poster Print")
+        title: t("split.tooltip.byPoster.title", "Split for Poster Print"),
       },
       tips: [
         {
           title: t("split.tooltip.byPoster.title", "Split for Poster Print"),
-          description: t("split.tooltip.byPoster.text", "Split large PDF pages into smaller printable chunks suitable for standard paper sizes. Perfect for creating poster prints from oversized pages."),
+          description: t(
+            "split.tooltip.byPoster.text",
+            "Split large PDF pages into smaller printable chunks suitable for standard paper sizes. Perfect for creating poster prints from oversized pages.",
+          ),
           bullets: [
-            t("split.tooltip.byPoster.bullet1", "Target Page Size: Choose output paper size (A4, Letter, etc.)"),
-            t("split.tooltip.byPoster.bullet2", "Horizontal/Vertical Divisions: Grid size for splitting"),
-            t("split.tooltip.byPoster.bullet3", "Right-to-Left: Reverse column order for RTL layouts"),
-            t("split.tooltip.byPoster.bullet4", "Print and assemble the pieces to create your poster")
-          ]
-        }
-      ]
-    }
+            t(
+              "split.tooltip.byPoster.bullet1",
+              "Target Page Size: Choose output paper size (A4, Letter, etc.)",
+            ),
+            t(
+              "split.tooltip.byPoster.bullet2",
+              "Horizontal/Vertical Divisions: Grid size for splitting",
+            ),
+            t(
+              "split.tooltip.byPoster.bullet3",
+              "Right-to-Left: Reverse column order for RTL layouts",
+            ),
+            t(
+              "split.tooltip.byPoster.bullet4",
+              "Print and assemble the pieces to create your poster",
+            ),
+          ],
+        },
+      ],
+    },
   };
 
   return tooltipMap[method];
diff --git a/frontend/src/core/components/tooltips/useWatermarkTips.ts b/frontend/src/core/components/tooltips/useWatermarkTips.ts
index ede2b0bf39..c96024713a 100644
--- a/frontend/src/core/components/tooltips/useWatermarkTips.ts
+++ b/frontend/src/core/components/tooltips/useWatermarkTips.ts
@@ -1,5 +1,5 @@
-import { useTranslation } from 'react-i18next';
-import { TooltipContent, TooltipTip } from '@app/types/tips';
+import { useTranslation } from "react-i18next";
+import { TooltipContent, TooltipTip } from "@app/types/tips";
 
 // Shared tooltip content to reduce duplication
 const useSharedWatermarkContent = () => {
@@ -7,27 +7,54 @@ const useSharedWatermarkContent = () => {
 
   const languageSupportTip: TooltipTip = {
     title: t("watermark.tooltip.language.title", "Language Support"),
-    description: t("watermark.tooltip.language.text", "Choose the appropriate language setting to ensure proper font rendering for your text.")
+    description: t(
+      "watermark.tooltip.language.text",
+      "Choose the appropriate language setting to ensure proper font rendering for your text.",
+    ),
   };
 
   const appearanceTip: TooltipTip = {
     title: t("watermark.tooltip.appearance.title", "Appearance Settings"),
-    description: t("watermark.tooltip.appearance.text", "Control how your watermark looks and blends with the document."),
+    description: t(
+      "watermark.tooltip.appearance.text",
+      "Control how your watermark looks and blends with the document.",
+    ),
     bullets: [
-      t("watermark.tooltip.appearance.bullet1", "Rotation: -360° to 360° for angled watermarks"),
-      t("watermark.tooltip.appearance.bullet2", "Opacity: 0-100% for transparency control"),
-      t("watermark.tooltip.appearance.bullet3", "Lower opacity creates subtle watermarks")
-    ]
+      t(
+        "watermark.tooltip.appearance.bullet1",
+        "Rotation: -360° to 360° for angled watermarks",
+      ),
+      t(
+        "watermark.tooltip.appearance.bullet2",
+        "Opacity: 0-100% for transparency control",
+      ),
+      t(
+        "watermark.tooltip.appearance.bullet3",
+        "Lower opacity creates subtle watermarks",
+      ),
+    ],
   };
 
   const spacingTip: TooltipTip = {
     title: t("watermark.tooltip.spacing.title", "Spacing Control"),
-    description: t("watermark.tooltip.spacing.text", "Adjust the spacing between repeated watermarks across the page."),
+    description: t(
+      "watermark.tooltip.spacing.text",
+      "Adjust the spacing between repeated watermarks across the page.",
+    ),
     bullets: [
-      t("watermark.tooltip.spacing.bullet1", "Width spacing: Horizontal distance between watermarks"),
-      t("watermark.tooltip.spacing.bullet2", "Height spacing: Vertical distance between watermarks"),
-      t("watermark.tooltip.spacing.bullet3", "Higher values create more spread out patterns")
-    ]
+      t(
+        "watermark.tooltip.spacing.bullet1",
+        "Width spacing: Horizontal distance between watermarks",
+      ),
+      t(
+        "watermark.tooltip.spacing.bullet2",
+        "Height spacing: Vertical distance between watermarks",
+      ),
+      t(
+        "watermark.tooltip.spacing.bullet3",
+        "Higher values create more spread out patterns",
+      ),
+    ],
   };
 
   return { languageSupportTip, appearanceTip, spacingTip };
@@ -38,55 +65,92 @@ export const useWatermarkTypeTips = (): TooltipContent => {
 
   return {
     header: {
-      title: t("watermark.tooltip.type.header.title", "Watermark Type Selection")
+      title: t(
+        "watermark.tooltip.type.header.title",
+        "Watermark Type Selection",
+      ),
     },
     tips: [
       {
-        title: t("watermark.tooltip.type.description.title", "Choose Your Watermark"),
-        description: t("watermark.tooltip.type.description.text", "Select between text or image watermarks based on your needs.")
+        title: t(
+          "watermark.tooltip.type.description.title",
+          "Choose Your Watermark",
+        ),
+        description: t(
+          "watermark.tooltip.type.description.text",
+          "Select between text or image watermarks based on your needs.",
+        ),
       },
       {
         title: t("watermark.tooltip.type.text.title", "Text Watermarks"),
-        description: t("watermark.tooltip.type.text.text", "Perfect for adding copyright notices, company names, or confidentiality labels. Supports multiple languages and custom colors."),
+        description: t(
+          "watermark.tooltip.type.text.text",
+          "Perfect for adding copyright notices, company names, or confidentiality labels. Supports multiple languages and custom colors.",
+        ),
         bullets: [
-          t("watermark.tooltip.type.text.bullet1", "Customizable fonts and languages"),
-          t("watermark.tooltip.type.text.bullet2", "Adjustable colors and transparency"),
-          t("watermark.tooltip.type.text.bullet3", "Ideal for legal or branding text")
-        ]
+          t(
+            "watermark.tooltip.type.text.bullet1",
+            "Customizable fonts and languages",
+          ),
+          t(
+            "watermark.tooltip.type.text.bullet2",
+            "Adjustable colors and transparency",
+          ),
+          t(
+            "watermark.tooltip.type.text.bullet3",
+            "Ideal for legal or branding text",
+          ),
+        ],
       },
       {
         title: t("watermark.tooltip.type.image.title", "Image Watermarks"),
-        description: t("watermark.tooltip.type.image.text", "Use logos, stamps, or any image as a watermark. Great for branding and visual identification."),
+        description: t(
+          "watermark.tooltip.type.image.text",
+          "Use logos, stamps, or any image as a watermark. Great for branding and visual identification.",
+        ),
         bullets: [
           t("watermark.tooltip.type.image.bullet1", "Upload any image format"),
           t("watermark.tooltip.type.image.bullet2", "Maintains image quality"),
-          t("watermark.tooltip.type.image.bullet3", "Perfect for logos and stamps")
-        ]
-      }
-    ]
+          t(
+            "watermark.tooltip.type.image.bullet3",
+            "Perfect for logos and stamps",
+          ),
+        ],
+      },
+    ],
   };
 };
 
-
-
 export const useWatermarkWordingTips = (): TooltipContent => {
   const { t } = useTranslation();
 
   return {
     header: {
-      title: t("watermark.tooltip.wording.header.title", "Text Content")
+      title: t("watermark.tooltip.wording.header.title", "Text Content"),
     },
     tips: [
       {
         title: t("watermark.tooltip.wording.text.title", "Watermark Text"),
-        description: t("watermark.tooltip.wording.text.text", "Enter the text that will appear as your watermark across the document."),
+        description: t(
+          "watermark.tooltip.wording.text.text",
+          "Enter the text that will appear as your watermark across the document.",
+        ),
         bullets: [
-          t("watermark.tooltip.wording.text.bullet1", "Keep it concise for better readability"),
-          t("watermark.tooltip.wording.text.bullet2", "Common examples: 'CONFIDENTIAL', 'DRAFT', company name"),
-          t("watermark.tooltip.wording.text.bullet3", "Emoji characters are not supported and will be filtered out")
-        ]
-      }
-    ]
+          t(
+            "watermark.tooltip.wording.text.bullet1",
+            "Keep it concise for better readability",
+          ),
+          t(
+            "watermark.tooltip.wording.text.bullet2",
+            "Common examples: 'CONFIDENTIAL', 'DRAFT', company name",
+          ),
+          t(
+            "watermark.tooltip.wording.text.bullet3",
+            "Emoji characters are not supported and will be filtered out",
+          ),
+        ],
+      },
+    ],
   };
 };
 
@@ -96,20 +160,32 @@ export const useWatermarkTextStyleTips = (): TooltipContent => {
 
   return {
     header: {
-      title: t("watermark.tooltip.textStyle.header.title", "Text Style")
+      title: t("watermark.tooltip.textStyle.header.title", "Text Style"),
     },
     tips: [
       {
         title: t("watermark.tooltip.textStyle.color.title", "Color Selection"),
-        description: t("watermark.tooltip.textStyle.color.text", "Choose a color that provides good contrast with your document content."),
+        description: t(
+          "watermark.tooltip.textStyle.color.text",
+          "Choose a color that provides good contrast with your document content.",
+        ),
         bullets: [
-          t("watermark.tooltip.textStyle.color.bullet1", "Light gray (#d3d3d3) for subtle watermarks"),
-          t("watermark.tooltip.textStyle.color.bullet2", "Black or dark colors for high contrast"),
-          t("watermark.tooltip.textStyle.color.bullet3", "Custom colors for branding purposes")
-        ]
+          t(
+            "watermark.tooltip.textStyle.color.bullet1",
+            "Light gray (#d3d3d3) for subtle watermarks",
+          ),
+          t(
+            "watermark.tooltip.textStyle.color.bullet2",
+            "Black or dark colors for high contrast",
+          ),
+          t(
+            "watermark.tooltip.textStyle.color.bullet3",
+            "Custom colors for branding purposes",
+          ),
+        ],
       },
-      languageSupportTip
-    ]
+      languageSupportTip,
+    ],
   };
 };
 
@@ -118,28 +194,55 @@ export const useWatermarkFileTips = (): TooltipContent => {
 
   return {
     header: {
-      title: t("watermark.tooltip.file.header.title", "Image Upload")
+      title: t("watermark.tooltip.file.header.title", "Image Upload"),
     },
     tips: [
       {
         title: t("watermark.tooltip.file.upload.title", "Image Selection"),
-        description: t("watermark.tooltip.file.upload.text", "Upload an image file to use as your watermark."),
+        description: t(
+          "watermark.tooltip.file.upload.text",
+          "Upload an image file to use as your watermark.",
+        ),
         bullets: [
-          t("watermark.tooltip.file.upload.bullet1", "Supports common formats: PNG, JPG, GIF, BMP"),
-          t("watermark.tooltip.file.upload.bullet2", "PNG with transparency works best"),
-          t("watermark.tooltip.file.upload.bullet3", "Higher resolution images maintain quality better")
-        ]
+          t(
+            "watermark.tooltip.file.upload.bullet1",
+            "Supports common formats: PNG, JPG, GIF, BMP",
+          ),
+          t(
+            "watermark.tooltip.file.upload.bullet2",
+            "PNG with transparency works best",
+          ),
+          t(
+            "watermark.tooltip.file.upload.bullet3",
+            "Higher resolution images maintain quality better",
+          ),
+        ],
       },
       {
-        title: t("watermark.tooltip.file.recommendations.title", "Best Practices"),
-        description: t("watermark.tooltip.file.recommendations.text", "Tips for optimal image watermark results."),
+        title: t(
+          "watermark.tooltip.file.recommendations.title",
+          "Best Practices",
+        ),
+        description: t(
+          "watermark.tooltip.file.recommendations.text",
+          "Tips for optimal image watermark results.",
+        ),
         bullets: [
-          t("watermark.tooltip.file.recommendations.bullet1", "Use logos or stamps with transparent backgrounds"),
-          t("watermark.tooltip.file.recommendations.bullet2", "Simple designs work better than complex images"),
-          t("watermark.tooltip.file.recommendations.bullet3", "Consider the final document size when choosing resolution")
-        ]
-      }
-    ]
+          t(
+            "watermark.tooltip.file.recommendations.bullet1",
+            "Use logos or stamps with transparent backgrounds",
+          ),
+          t(
+            "watermark.tooltip.file.recommendations.bullet2",
+            "Simple designs work better than complex images",
+          ),
+          t(
+            "watermark.tooltip.file.recommendations.bullet3",
+            "Consider the final document size when choosing resolution",
+          ),
+        ],
+      },
+    ],
   };
 };
 
@@ -149,28 +252,55 @@ export const useWatermarkFormattingTips = (): TooltipContent => {
 
   return {
     header: {
-      title: t("watermark.tooltip.formatting.header.title", "Formatting & Layout")
+      title: t(
+        "watermark.tooltip.formatting.header.title",
+        "Formatting & Layout",
+      ),
     },
     tips: [
       {
         title: t("watermark.tooltip.formatting.size.title", "Size Control"),
-        description: t("watermark.tooltip.formatting.size.text", "Adjust the size of your watermark (text or image)."),
+        description: t(
+          "watermark.tooltip.formatting.size.text",
+          "Adjust the size of your watermark (text or image).",
+        ),
         bullets: [
-          t("watermark.tooltip.formatting.size.bullet1", "Larger sizes create more prominent watermarks")
-        ]
+          t(
+            "watermark.tooltip.formatting.size.bullet1",
+            "Larger sizes create more prominent watermarks",
+          ),
+        ],
       },
       appearanceTip,
       spacingTip,
       {
-        title: t("watermark.tooltip.formatting.security.title", "Security Option"),
-        description: t("watermark.tooltip.formatting.security.text", "Convert the final PDF to an image-based format for enhanced security."),
+        title: t(
+          "watermark.tooltip.formatting.security.title",
+          "Security Option",
+        ),
+        description: t(
+          "watermark.tooltip.formatting.security.text",
+          "Convert the final PDF to an image-based format for enhanced security.",
+        ),
         bullets: [
-          t("watermark.tooltip.formatting.security.bullet1", "Prevents text selection and copying"),
-          t("watermark.tooltip.formatting.security.bullet2", "Makes watermarks harder to remove"),
-          t("watermark.tooltip.formatting.security.bullet3", "Results in larger file sizes"),
-          t("watermark.tooltip.formatting.security.bullet4", "Best for sensitive or copyrighted content")
-        ]
-      }
-    ]
+          t(
+            "watermark.tooltip.formatting.security.bullet1",
+            "Prevents text selection and copying",
+          ),
+          t(
+            "watermark.tooltip.formatting.security.bullet2",
+            "Makes watermarks harder to remove",
+          ),
+          t(
+            "watermark.tooltip.formatting.security.bullet3",
+            "Results in larger file sizes",
+          ),
+          t(
+            "watermark.tooltip.formatting.security.bullet4",
+            "Best for sensitive or copyrighted content",
+          ),
+        ],
+      },
+    ],
   };
-};
\ No newline at end of file
+};
diff --git a/frontend/src/core/components/tooltips/useWetSignatureTips.ts b/frontend/src/core/components/tooltips/useWetSignatureTips.ts
index 00e7c39025..aff3e69fea 100644
--- a/frontend/src/core/components/tooltips/useWetSignatureTips.ts
+++ b/frontend/src/core/components/tooltips/useWetSignatureTips.ts
@@ -1,48 +1,72 @@
-import { useTranslation } from 'react-i18next';
-import { TooltipContent } from '@app/types/tips';
+import { useTranslation } from "react-i18next";
+import { TooltipContent } from "@app/types/tips";
 
 export const useWetSignatureTips = (): TooltipContent => {
   const { t } = useTranslation();
 
   return {
     header: {
-      title: t('wetSignature.tooltip.header', 'Signature Creation Methods'),
+      title: t("wetSignature.tooltip.header", "Signature Creation Methods"),
     },
     tips: [
       {
-        title: t('wetSignature.tooltip.draw.title', 'Draw Signature'),
+        title: t("wetSignature.tooltip.draw.title", "Draw Signature"),
         description: t(
-          'wetSignature.tooltip.draw.description',
-          'Create a handwritten signature using your mouse or touchscreen. Best for personal, authentic signatures.'
+          "wetSignature.tooltip.draw.description",
+          "Create a handwritten signature using your mouse or touchscreen. Best for personal, authentic signatures.",
         ),
         bullets: [
-          t('wetSignature.tooltip.draw.bullet1', 'Customize pen color and thickness'),
-          t('wetSignature.tooltip.draw.bullet2', 'Clear and redraw until satisfied'),
-          t('wetSignature.tooltip.draw.bullet3', 'Works on touch devices (tablets, phones)'),
+          t(
+            "wetSignature.tooltip.draw.bullet1",
+            "Customize pen color and thickness",
+          ),
+          t(
+            "wetSignature.tooltip.draw.bullet2",
+            "Clear and redraw until satisfied",
+          ),
+          t(
+            "wetSignature.tooltip.draw.bullet3",
+            "Works on touch devices (tablets, phones)",
+          ),
         ],
       },
       {
-        title: t('wetSignature.tooltip.upload.title', 'Upload Signature Image'),
+        title: t("wetSignature.tooltip.upload.title", "Upload Signature Image"),
         description: t(
-          'wetSignature.tooltip.upload.description',
-          'Upload a pre-created signature image. Ideal if you have a scanned signature or company logo.'
+          "wetSignature.tooltip.upload.description",
+          "Upload a pre-created signature image. Ideal if you have a scanned signature or company logo.",
         ),
         bullets: [
-          t('wetSignature.tooltip.upload.bullet1', 'Supports PNG, JPG, and other image formats'),
-          t('wetSignature.tooltip.upload.bullet2', 'Transparent backgrounds recommended for best results'),
-          t('wetSignature.tooltip.upload.bullet3', 'Image will be resized to fit signature area'),
+          t(
+            "wetSignature.tooltip.upload.bullet1",
+            "Supports PNG, JPG, and other image formats",
+          ),
+          t(
+            "wetSignature.tooltip.upload.bullet2",
+            "Transparent backgrounds recommended for best results",
+          ),
+          t(
+            "wetSignature.tooltip.upload.bullet3",
+            "Image will be resized to fit signature area",
+          ),
         ],
       },
       {
-        title: t('wetSignature.tooltip.type.title', 'Type Signature'),
+        title: t("wetSignature.tooltip.type.title", "Type Signature"),
         description: t(
-          'wetSignature.tooltip.type.description',
-          'Generate a signature from typed text. Fast and consistent, suitable for business documents.'
+          "wetSignature.tooltip.type.description",
+          "Generate a signature from typed text. Fast and consistent, suitable for business documents.",
         ),
         bullets: [
-          t('wetSignature.tooltip.type.bullet1', 'Choose from multiple fonts'),
-          t('wetSignature.tooltip.type.bullet2', 'Customize text size and color'),
-          t('wetSignature.tooltip.type.bullet3', 'Perfect for standardized signatures'),
+          t("wetSignature.tooltip.type.bullet1", "Choose from multiple fonts"),
+          t(
+            "wetSignature.tooltip.type.bullet2",
+            "Customize text size and color",
+          ),
+          t(
+            "wetSignature.tooltip.type.bullet3",
+            "Perfect for standardized signatures",
+          ),
         ],
       },
     ],
diff --git a/frontend/src/core/components/viewer/ActiveDocumentContext.tsx b/frontend/src/core/components/viewer/ActiveDocumentContext.tsx
index 663f6e6d43..a9029abda8 100644
--- a/frontend/src/core/components/viewer/ActiveDocumentContext.tsx
+++ b/frontend/src/core/components/viewer/ActiveDocumentContext.tsx
@@ -1,13 +1,25 @@
-import React, { createContext, useContext, useState, useEffect, useRef } from 'react';
-import { useDocumentManagerPlugin } from '@embedpdf/plugin-document-manager/react';
+import React, {
+  createContext,
+  useContext,
+  useState,
+  useEffect,
+  useRef,
+} from "react";
+import { useDocumentManagerPlugin } from "@embedpdf/plugin-document-manager/react";
 
 interface ActiveDocumentContextType {
   documentId: string | null;
 }
 
-const ActiveDocumentContext = createContext<ActiveDocumentContextType>({ documentId: null });
+const ActiveDocumentContext = createContext<ActiveDocumentContextType>({
+  documentId: null,
+});
 
-export function ActiveDocumentProvider({ children }: { children: React.ReactNode }) {
+export function ActiveDocumentProvider({
+  children,
+}: {
+  children: React.ReactNode;
+}) {
   const { plugin, isLoading } = useDocumentManagerPlugin();
   const [documentId, setDocumentId] = useState<string | null>(null);
   const unsubscribeRef = useRef<(() => void) | null>(null);
diff --git a/frontend/src/core/components/viewer/AnnotationAPIBridge.tsx b/frontend/src/core/components/viewer/AnnotationAPIBridge.tsx
index b5626b18c2..bc2fe4b777 100644
--- a/frontend/src/core/components/viewer/AnnotationAPIBridge.tsx
+++ b/frontend/src/core/components/viewer/AnnotationAPIBridge.tsx
@@ -1,6 +1,6 @@
-import { useImperativeHandle, forwardRef, useCallback } from 'react';
-import { useAnnotationCapability } from '@embedpdf/plugin-annotation/react';
-import { PdfAnnotationSubtype, PdfAnnotationIcon } from '@embedpdf/models';
+import { useImperativeHandle, forwardRef, useCallback } from "react";
+import { useAnnotationCapability } from "@embedpdf/plugin-annotation/react";
+import { PdfAnnotationSubtype, PdfAnnotationIcon } from "@embedpdf/models";
 import type {
   AnnotationToolId,
   AnnotationToolOptions,
@@ -9,10 +9,10 @@ import type {
   AnnotationPatch,
   AnnotationRect,
   AnnotationSelection,
-} from '@app/components/viewer/viewerTypes';
-import { useDocumentReady } from '@app/components/viewer/hooks/useDocumentReady';
+} from "@app/components/viewer/viewerTypes";
+import { useDocumentReady } from "@app/components/viewer/hooks/useDocumentReady";
 
-type NoteIcon = NonNullable<AnnotationToolOptions['icon']>;
+type NoteIcon = NonNullable<AnnotationToolOptions["icon"]>;
 
 type AnnotationDefaults =
   | {
@@ -51,7 +51,10 @@ type AnnotationDefaults =
       customData?: Record<string, unknown>;
     }
   | {
-      type: PdfAnnotationSubtype.SQUARE | PdfAnnotationSubtype.CIRCLE | PdfAnnotationSubtype.POLYGON;
+      type:
+        | PdfAnnotationSubtype.SQUARE
+        | PdfAnnotationSubtype.CIRCLE
+        | PdfAnnotationSubtype.POLYGON;
       color: string;
       strokeColor: string;
       opacity: number;
@@ -98,21 +101,41 @@ type AnnotationDefaults =
 type AnnotationApiSurface = {
   setActiveTool: (toolId: AnnotationToolId | null) => void;
   getActiveTool?: () => { id: AnnotationToolId } | null;
-  setToolDefaults?: (toolId: AnnotationToolId, defaults: AnnotationDefaults) => void;
+  setToolDefaults?: (
+    toolId: AnnotationToolId,
+    defaults: AnnotationDefaults,
+  ) => void;
   getSelectedAnnotation?: () => AnnotationSelection | null;
   deselectAnnotation?: () => void;
-  updateAnnotation?: (pageIndex: number, annotationId: string, patch: AnnotationPatch) => void;
+  updateAnnotation?: (
+    pageIndex: number,
+    annotationId: string,
+    patch: AnnotationPatch,
+  ) => void;
   deleteAnnotation?: (pageIndex: number, annotationId: string) => void;
-  deleteAnnotations?: (annotations: Array<{ pageIndex: number; id: string }>) => void;
-  createAnnotation?: (pageIndex: number, annotation: Record<string, unknown>) => void;
+  deleteAnnotations?: (
+    annotations: Array<{ pageIndex: number; id: string }>,
+  ) => void;
+  createAnnotation?: (
+    pageIndex: number,
+    annotation: Record<string, unknown>,
+  ) => void;
   getSelectedAnnotations?: () => AnnotationSelection[];
-  onAnnotationEvent?: (listener: (event: AnnotationEvent) => void) => void | (() => void);
+  onAnnotationEvent?: (
+    listener: (event: AnnotationEvent) => void,
+  ) => void | (() => void);
   purgeAnnotation?: (pageIndex: number, annotationId: string) => void;
   /** v2.7.0: move annotation without regenerating its appearance stream */
-  moveAnnotation?: (pageIndex: number, annotationId: string, newRect: AnnotationRect) => void;
+  moveAnnotation?: (
+    pageIndex: number,
+    annotationId: string,
+    newRect: AnnotationRect,
+  ) => void;
 };
 
-type ToolDefaultsBuilder = (options?: AnnotationToolOptions) => AnnotationDefaults;
+type ToolDefaultsBuilder = (
+  options?: AnnotationToolOptions,
+) => AnnotationDefaults;
 
 const NOTE_ICON_MAP: Record<NoteIcon, PdfAnnotationIcon> = {
   Comment: PdfAnnotationIcon.Comment,
@@ -125,23 +148,24 @@ const NOTE_ICON_MAP: Record<NoteIcon, PdfAnnotationIcon> = {
 };
 
 const DEFAULTS = {
-  highlight: '#ffd54f',
-  underline: '#ffb300',
-  strikeout: '#e53935',
-  squiggly: '#00acc1',
-  ink: '#1f2933',
-  inkHighlighter: '#ffd54f',
-  text: '#111111',
-  note: '#ffd54f',
-  shapeFill: '#0000ff',
-  shapeStroke: '#cf5b5b',
+  highlight: "#ffd54f",
+  underline: "#ffb300",
+  strikeout: "#e53935",
+  squiggly: "#00acc1",
+  ink: "#1f2933",
+  inkHighlighter: "#ffd54f",
+  text: "#111111",
+  note: "#ffd54f",
+  shapeFill: "#0000ff",
+  shapeStroke: "#cf5b5b",
   shapeOpacity: 0.5,
 };
 
 const withCustomData = (options?: AnnotationToolOptions) =>
   options?.customData ? { customData: options.customData } : {};
 
-const getIconEnum = (icon?: NoteIcon) => NOTE_ICON_MAP[icon ?? 'Comment'] ?? PdfAnnotationIcon.Comment;
+const getIconEnum = (icon?: NoteIcon) =>
+  NOTE_ICON_MAP[icon ?? "Comment"] ?? PdfAnnotationIcon.Comment;
 
 const buildStampDefaults: ToolDefaultsBuilder = (options) => ({
   type: PdfAnnotationSubtype.STAMP,
@@ -150,8 +174,13 @@ const buildStampDefaults: ToolDefaultsBuilder = (options) => ({
   ...withCustomData(options),
 });
 
-const buildInkDefaults = (options?: AnnotationToolOptions, opacityOverride?: number): AnnotationDefaults => {
-  const colorValue = options?.color ?? (opacityOverride ? DEFAULTS.inkHighlighter : DEFAULTS.ink);
+const buildInkDefaults = (
+  options?: AnnotationToolOptions,
+  opacityOverride?: number,
+): AnnotationDefaults => {
+  const colorValue =
+    options?.color ??
+    (opacityOverride ? DEFAULTS.inkHighlighter : DEFAULTS.ink);
   return {
     type: PdfAnnotationSubtype.INK,
     strokeColor: colorValue,
@@ -207,16 +236,19 @@ const TOOL_DEFAULT_BUILDERS: Record<AnnotationToolId, ToolDefaultsBuilder> = {
     };
   },
   ink: (options) => buildInkDefaults(options),
-  inkHighlighter: (options) => buildInkDefaults(options, options?.opacity ?? 0.6),
+  inkHighlighter: (options) =>
+    buildInkDefaults(options, options?.opacity ?? 0.6),
   text: (options) => ({
     type: PdfAnnotationSubtype.FREETEXT,
     fontColor: options?.color ?? DEFAULTS.text,
     fontSize: options?.fontSize ?? 14,
-    fontFamily: options?.fontFamily ?? 'Helvetica',
+    fontFamily: options?.fontFamily ?? "Helvetica",
     textAlign: options?.textAlign ?? 0,
     opacity: options?.opacity ?? 1,
     borderWidth: options?.thickness ?? 1,
-    ...(options?.fillColor ? { color: options.fillColor, interiorColor: options.fillColor } : {}),
+    ...(options?.fillColor
+      ? { color: options.fillColor, interiorColor: options.fillColor }
+      : {}),
     ...withCustomData(options),
   }),
   note: (options) => {
@@ -225,14 +257,14 @@ const TOOL_DEFAULT_BUILDERS: Record<AnnotationToolId, ToolDefaultsBuilder> = {
     return {
       type: PdfAnnotationSubtype.FREETEXT,
       fontColor,
-      fontFamily: options?.fontFamily ?? 'Helvetica',
+      fontFamily: options?.fontFamily ?? "Helvetica",
       textAlign: options?.textAlign ?? 0,
       fontSize: options?.fontSize ?? 12,
       opacity: options?.opacity ?? 1,
       color: bgColor,
       interiorColor: bgColor,
       borderWidth: options?.thickness ?? 0,
-      contents: options?.contents ?? 'Note',
+      contents: options?.contents ?? "Note",
       icon: getIconEnum(options?.icon),
       ...withCustomData(options),
     };
@@ -263,8 +295,8 @@ const TOOL_DEFAULT_BUILDERS: Record<AnnotationToolId, ToolDefaultsBuilder> = {
   }),
   line: (options) => ({
     type: PdfAnnotationSubtype.LINE,
-    color: options?.color ?? '#1565c0',
-    strokeColor: options?.color ?? '#1565c0',
+    color: options?.color ?? "#1565c0",
+    strokeColor: options?.color ?? "#1565c0",
     opacity: options?.opacity ?? 1,
     borderWidth: options?.borderWidth ?? 2,
     strokeWidth: options?.borderWidth ?? 2,
@@ -273,20 +305,20 @@ const TOOL_DEFAULT_BUILDERS: Record<AnnotationToolId, ToolDefaultsBuilder> = {
   }),
   lineArrow: (options) => ({
     type: PdfAnnotationSubtype.LINE,
-    color: options?.color ?? '#1565c0',
-    strokeColor: options?.color ?? '#1565c0',
+    color: options?.color ?? "#1565c0",
+    strokeColor: options?.color ?? "#1565c0",
     opacity: options?.opacity ?? 1,
     borderWidth: options?.borderWidth ?? 2,
     strokeWidth: options?.borderWidth ?? 2,
     lineWidth: options?.borderWidth ?? 2,
-    startStyle: 'None',
-    endStyle: 'ClosedArrow',
-    lineEndingStyles: { start: 'None', end: 'ClosedArrow' },
+    startStyle: "None",
+    endStyle: "ClosedArrow",
+    lineEndingStyles: { start: "None", end: "ClosedArrow" },
     ...withCustomData(options),
   }),
   polyline: (options) => ({
     type: PdfAnnotationSubtype.POLYLINE,
-    color: options?.color ?? '#1565c0',
+    color: options?.color ?? "#1565c0",
     opacity: options?.opacity ?? 1,
     borderWidth: options?.borderWidth ?? 2,
     ...withCustomData(options),
@@ -314,139 +346,192 @@ const TOOL_DEFAULT_BUILDERS: Record<AnnotationToolId, ToolDefaultsBuilder> = {
   }),
   insertText: (options) => ({
     type: PdfAnnotationSubtype.CARET,
-    strokeColor: options?.color ?? '#E44234',
+    strokeColor: options?.color ?? "#E44234",
     opacity: options?.opacity ?? 1,
     ...withCustomData(options),
   }),
   replaceText: (options) => ({
     type: PdfAnnotationSubtype.CARET,
-    strokeColor: options?.color ?? '#E44234',
+    strokeColor: options?.color ?? "#E44234",
     opacity: options?.opacity ?? 1,
     ...withCustomData(options),
   }),
 };
 
-export const AnnotationAPIBridge = forwardRef<AnnotationAPI>(function AnnotationAPIBridge(_props, ref) {
-  // Use the provided annotation API just like SignatureAPIBridge/HistoryAPIBridge
-  const { provides: annotationApi } = useAnnotationCapability();
-  const documentReady = useDocumentReady();
+export const AnnotationAPIBridge = forwardRef<AnnotationAPI>(
+  function AnnotationAPIBridge(_props, ref) {
+    // Use the provided annotation API just like SignatureAPIBridge/HistoryAPIBridge
+    const { provides: annotationApi } = useAnnotationCapability();
+    const documentReady = useDocumentReady();
 
-  const buildAnnotationDefaults = useCallback(
-    (toolId: AnnotationToolId, options?: AnnotationToolOptions) =>
-      TOOL_DEFAULT_BUILDERS[toolId]?.(options) ?? null,
-    []
-  );
+    const buildAnnotationDefaults = useCallback(
+      (toolId: AnnotationToolId, options?: AnnotationToolOptions) =>
+        TOOL_DEFAULT_BUILDERS[toolId]?.(options) ?? null,
+      [],
+    );
 
-  const configureAnnotationTool = useCallback(
-    (toolId: AnnotationToolId, options?: AnnotationToolOptions) => {
-      const api = annotationApi as unknown as AnnotationApiSurface | undefined;
-      if (!api?.setActiveTool) return;
+    const configureAnnotationTool = useCallback(
+      (toolId: AnnotationToolId, options?: AnnotationToolOptions) => {
+        const api = annotationApi as unknown as
+          | AnnotationApiSurface
+          | undefined;
+        if (!api?.setActiveTool) return;
 
-      const defaults = buildAnnotationDefaults(toolId, options);
-
-      // Reset tool first, then activate (like SignatureAPIBridge does)
-      api.setActiveTool(null);
-      api.setActiveTool(toolId === 'select' ? null : toolId);
-
-      // Verify tool was activated before setting defaults (like SignatureAPIBridge does)
-      const activeTool = api.getActiveTool?.();
-      if (activeTool && activeTool.id === toolId && defaults) {
-        api.setToolDefaults?.(toolId, defaults);
-      }
-    },
-    [annotationApi, buildAnnotationDefaults]
-  );
-
-  useImperativeHandle(
-    ref,
-    () => ({
-      activateAnnotationTool: (toolId: AnnotationToolId, options?: AnnotationToolOptions) => {
-        configureAnnotationTool(toolId, options);
-      },
-      isReady: () => !!annotationApi && documentReady,
-      setAnnotationStyle: (toolId: AnnotationToolId, options?: AnnotationToolOptions) => {
         const defaults = buildAnnotationDefaults(toolId, options);
-        const api = annotationApi as unknown as AnnotationApiSurface | undefined;
-        if (defaults && api?.setToolDefaults) {
-          api.setToolDefaults(toolId, defaults);
+
+        // Reset tool first, then activate (like SignatureAPIBridge does)
+        api.setActiveTool(null);
+        api.setActiveTool(toolId === "select" ? null : toolId);
+
+        // Verify tool was activated before setting defaults (like SignatureAPIBridge does)
+        const activeTool = api.getActiveTool?.();
+        if (activeTool && activeTool.id === toolId && defaults) {
+          api.setToolDefaults?.(toolId, defaults);
         }
       },
-      getSelectedAnnotation: () => {
-        const api = annotationApi as unknown as AnnotationApiSurface | undefined;
-        if (!api?.getSelectedAnnotation) {
-          return null;
-        }
-        try {
-          return api.getSelectedAnnotation();
-        } catch (error) {
-          // Some EmbedPDF builds expose getSelectedAnnotation with an internal
-          // `this`/state dependency (e.g. reading `selectedUid` from undefined).
-          // If that happens, fail gracefully and treat it as "no selection"
-          // instead of crashing the entire annotations tool.
-          // Only log unexpected errors - "No active document" is a common expected state during init
-          const errorMessage = error instanceof Error ? error.message : String(error);
-          if (!errorMessage.includes('No active document')) {
-            console.error('[AnnotationAPIBridge] getSelectedAnnotation failed:', error);
+      [annotationApi, buildAnnotationDefaults],
+    );
+
+    useImperativeHandle(
+      ref,
+      () => ({
+        activateAnnotationTool: (
+          toolId: AnnotationToolId,
+          options?: AnnotationToolOptions,
+        ) => {
+          configureAnnotationTool(toolId, options);
+        },
+        isReady: () => !!annotationApi && documentReady,
+        setAnnotationStyle: (
+          toolId: AnnotationToolId,
+          options?: AnnotationToolOptions,
+        ) => {
+          const defaults = buildAnnotationDefaults(toolId, options);
+          const api = annotationApi as unknown as
+            | AnnotationApiSurface
+            | undefined;
+          if (defaults && api?.setToolDefaults) {
+            api.setToolDefaults(toolId, defaults);
           }
-          return null;
-        }
-      },
-      deselectAnnotation: () => {
-        const api = annotationApi as unknown as AnnotationApiSurface | undefined;
-        api?.deselectAnnotation?.();
-      },
-      updateAnnotation: (pageIndex: number, annotationId: string, patch: AnnotationPatch) => {
-        const api = annotationApi as unknown as AnnotationApiSurface | undefined;
-        api?.updateAnnotation?.(pageIndex, annotationId, patch);
-      },
-      deactivateTools: () => {
-        const api = annotationApi as unknown as AnnotationApiSurface | undefined;
-        api?.setActiveTool?.(null);
-      },
-      onAnnotationEvent: (listener: (event: AnnotationEvent) => void) => {
-        const api = annotationApi as unknown as AnnotationApiSurface | undefined;
-        if (api?.onAnnotationEvent) {
-          return api.onAnnotationEvent(listener);
-        }
-        return undefined;
-      },
-      getActiveTool: () => {
-        const api = annotationApi as unknown as AnnotationApiSurface | undefined;
-        return api?.getActiveTool?.() ?? null;
-      },
+        },
+        getSelectedAnnotation: () => {
+          const api = annotationApi as unknown as
+            | AnnotationApiSurface
+            | undefined;
+          if (!api?.getSelectedAnnotation) {
+            return null;
+          }
+          try {
+            return api.getSelectedAnnotation();
+          } catch (error) {
+            // Some EmbedPDF builds expose getSelectedAnnotation with an internal
+            // `this`/state dependency (e.g. reading `selectedUid` from undefined).
+            // If that happens, fail gracefully and treat it as "no selection"
+            // instead of crashing the entire annotations tool.
+            // Only log unexpected errors - "No active document" is a common expected state during init
+            const errorMessage =
+              error instanceof Error ? error.message : String(error);
+            if (!errorMessage.includes("No active document")) {
+              console.error(
+                "[AnnotationAPIBridge] getSelectedAnnotation failed:",
+                error,
+              );
+            }
+            return null;
+          }
+        },
+        deselectAnnotation: () => {
+          const api = annotationApi as unknown as
+            | AnnotationApiSurface
+            | undefined;
+          api?.deselectAnnotation?.();
+        },
+        updateAnnotation: (
+          pageIndex: number,
+          annotationId: string,
+          patch: AnnotationPatch,
+        ) => {
+          const api = annotationApi as unknown as
+            | AnnotationApiSurface
+            | undefined;
+          api?.updateAnnotation?.(pageIndex, annotationId, patch);
+        },
+        deactivateTools: () => {
+          const api = annotationApi as unknown as
+            | AnnotationApiSurface
+            | undefined;
+          api?.setActiveTool?.(null);
+        },
+        onAnnotationEvent: (listener: (event: AnnotationEvent) => void) => {
+          const api = annotationApi as unknown as
+            | AnnotationApiSurface
+            | undefined;
+          if (api?.onAnnotationEvent) {
+            return api.onAnnotationEvent(listener);
+          }
+          return undefined;
+        },
+        getActiveTool: () => {
+          const api = annotationApi as unknown as
+            | AnnotationApiSurface
+            | undefined;
+          return api?.getActiveTool?.() ?? null;
+        },
 
-      deleteAnnotation: (pageIndex: number, annotationId: string) => {
-        const api = annotationApi as unknown as AnnotationApiSurface | undefined;
-        api?.deleteAnnotation?.(pageIndex, annotationId);
-      },
+        deleteAnnotation: (pageIndex: number, annotationId: string) => {
+          const api = annotationApi as unknown as
+            | AnnotationApiSurface
+            | undefined;
+          api?.deleteAnnotation?.(pageIndex, annotationId);
+        },
 
-      deleteAnnotations: (annotations: Array<{ pageIndex: number; id: string }>) => {
-        const api = annotationApi as unknown as AnnotationApiSurface | undefined;
-        api?.deleteAnnotations?.(annotations);
-      },
+        deleteAnnotations: (
+          annotations: Array<{ pageIndex: number; id: string }>,
+        ) => {
+          const api = annotationApi as unknown as
+            | AnnotationApiSurface
+            | undefined;
+          api?.deleteAnnotations?.(annotations);
+        },
 
-      createAnnotation: (pageIndex: number, annotation: Record<string, unknown>) => {
-        const api = annotationApi as unknown as AnnotationApiSurface | undefined;
-        api?.createAnnotation?.(pageIndex, annotation);
-      },
+        createAnnotation: (
+          pageIndex: number,
+          annotation: Record<string, unknown>,
+        ) => {
+          const api = annotationApi as unknown as
+            | AnnotationApiSurface
+            | undefined;
+          api?.createAnnotation?.(pageIndex, annotation);
+        },
 
-      getSelectedAnnotations: () => {
-        const api = annotationApi as unknown as AnnotationApiSurface | undefined;
-        return api?.getSelectedAnnotations?.() ?? [];
-      },
+        getSelectedAnnotations: () => {
+          const api = annotationApi as unknown as
+            | AnnotationApiSurface
+            | undefined;
+          return api?.getSelectedAnnotations?.() ?? [];
+        },
 
-      purgeAnnotation: (pageIndex: number, annotationId: string) => {
-        const api = annotationApi as unknown as AnnotationApiSurface | undefined;
-        api?.purgeAnnotation?.(pageIndex, annotationId);
-      },
+        purgeAnnotation: (pageIndex: number, annotationId: string) => {
+          const api = annotationApi as unknown as
+            | AnnotationApiSurface
+            | undefined;
+          api?.purgeAnnotation?.(pageIndex, annotationId);
+        },
 
-      moveAnnotation: (pageIndex: number, annotationId: string, newRect: AnnotationRect) => {
-        const api = annotationApi as unknown as AnnotationApiSurface | undefined;
-        api?.moveAnnotation?.(pageIndex, annotationId, newRect);
-      },
-    }),
-    [annotationApi, configureAnnotationTool, buildAnnotationDefaults]
-  );
+        moveAnnotation: (
+          pageIndex: number,
+          annotationId: string,
+          newRect: AnnotationRect,
+        ) => {
+          const api = annotationApi as unknown as
+            | AnnotationApiSurface
+            | undefined;
+          api?.moveAnnotation?.(pageIndex, annotationId, newRect);
+        },
+      }),
+      [annotationApi, configureAnnotationTool, buildAnnotationDefaults],
+    );
 
-  return null;
-});
+    return null;
+  },
+);
diff --git a/frontend/src/core/components/viewer/AnnotationMenuButtons.tsx b/frontend/src/core/components/viewer/AnnotationMenuButtons.tsx
index 8a471d7a52..2b6608d582 100644
--- a/frontend/src/core/components/viewer/AnnotationMenuButtons.tsx
+++ b/frontend/src/core/components/viewer/AnnotationMenuButtons.tsx
@@ -1,24 +1,31 @@
-import { ActionIcon, Tooltip, Popover, TextInput, Button, Stack } from '@mantine/core';
-import { useState } from 'react';
-import { useTranslation } from 'react-i18next';
-import DeleteIcon from '@mui/icons-material/Delete';
-import EditIcon from '@mui/icons-material/Edit';
-import CommentIcon from '@mui/icons-material/ChatBubbleOutlineRounded';
-import AddCommentIcon from '@mui/icons-material/AddCommentOutlined';
-import OpenInNewIcon from '@mui/icons-material/OpenInNewRounded';
-import LocalIcon from '@app/components/shared/LocalIcon';
-import type { FirstLinkTarget } from '@app/components/viewer/useAnnotationMenuHandlers';
+import {
+  ActionIcon,
+  Tooltip,
+  Popover,
+  TextInput,
+  Button,
+  Stack,
+} from "@mantine/core";
+import { useState } from "react";
+import { useTranslation } from "react-i18next";
+import DeleteIcon from "@mui/icons-material/Delete";
+import EditIcon from "@mui/icons-material/Edit";
+import CommentIcon from "@mui/icons-material/ChatBubbleOutlineRounded";
+import AddCommentIcon from "@mui/icons-material/AddCommentOutlined";
+import OpenInNewIcon from "@mui/icons-material/OpenInNewRounded";
+import LocalIcon from "@app/components/shared/LocalIcon";
+import type { FirstLinkTarget } from "@app/components/viewer/useAnnotationMenuHandlers";
 
 export const commonButtonStyles = {
   root: {
     flexShrink: 0,
-    backgroundColor: 'var(--bg-raised)',
-    border: '1px solid var(--border-default)',
-    color: 'var(--text-secondary)',
-    '&:hover': {
-      backgroundColor: 'var(--hover-bg)',
-      borderColor: 'var(--border-strong)',
-      color: 'var(--text-primary)',
+    backgroundColor: "var(--bg-raised)",
+    border: "1px solid var(--border-default)",
+    color: "var(--text-secondary)",
+    "&:hover": {
+      backgroundColor: "var(--hover-bg)",
+      borderColor: "var(--border-strong)",
+      color: "var(--text-primary)",
     },
   },
 };
@@ -26,7 +33,7 @@ export const commonButtonStyles = {
 export function DeleteButton({ onDelete }: { onDelete: () => void }) {
   const { t } = useTranslation();
   return (
-    <Tooltip label={t('annotation.delete', 'Delete')}>
+    <Tooltip label={t("annotation.delete", "Delete")}>
       <ActionIcon
         variant="subtle"
         color="red"
@@ -35,10 +42,10 @@ export function DeleteButton({ onDelete }: { onDelete: () => void }) {
         styles={{
           root: {
             ...commonButtonStyles.root,
-            '&:hover': {
-              backgroundColor: 'var(--mantine-color-red-1)',
-              borderColor: 'var(--mantine-color-red-4)',
-              color: 'var(--mantine-color-red-7)',
+            "&:hover": {
+              backgroundColor: "var(--mantine-color-red-1)",
+              borderColor: "var(--mantine-color-red-4)",
+              color: "var(--mantine-color-red-7)",
             },
           },
         }}
@@ -52,8 +59,14 @@ export function DeleteButton({ onDelete }: { onDelete: () => void }) {
 export function EditTextButton({ onEdit }: { onEdit: () => void }) {
   const { t } = useTranslation();
   return (
-    <Tooltip label={t('annotation.editText', 'Edit Text')}>
-      <ActionIcon variant="subtle" color="gray" size="md" onClick={onEdit} styles={commonButtonStyles}>
+    <Tooltip label={t("annotation.editText", "Edit Text")}>
+      <ActionIcon
+        variant="subtle"
+        color="gray"
+        size="md"
+        onClick={onEdit}
+        styles={commonButtonStyles}
+      >
         <EditIcon style={{ fontSize: 18 }} />
       </ActionIcon>
     </Tooltip>
@@ -66,13 +79,23 @@ interface AttachCommentButtonProps {
   onAdd: () => void;
 }
 
-export function AttachCommentButton({ isInSidebar, onView, onAdd }: AttachCommentButtonProps) {
+export function AttachCommentButton({
+  isInSidebar,
+  onView,
+  onAdd,
+}: AttachCommentButtonProps) {
   const { t } = useTranslation();
   return (
-    <Tooltip label={isInSidebar ? t('viewer.comments.viewComment', 'View comment') : t('viewer.comments.addComment', 'Add comment')}>
+    <Tooltip
+      label={
+        isInSidebar
+          ? t("viewer.comments.viewComment", "View comment")
+          : t("viewer.comments.addComment", "Add comment")
+      }
+    >
       <ActionIcon
-        variant={isInSidebar ? 'filled' : 'subtle'}
-        color={isInSidebar ? 'blue' : 'gray'}
+        variant={isInSidebar ? "filled" : "subtle"}
+        color={isInSidebar ? "blue" : "gray"}
         size="md"
         onClick={isInSidebar ? onView : onAdd}
         styles={isInSidebar ? undefined : commonButtonStyles}
@@ -91,8 +114,20 @@ interface CommentButtonProps {
 export function CommentButton({ hasContent, onClick }: CommentButtonProps) {
   const { t } = useTranslation();
   return (
-    <Tooltip label={hasContent ? t('viewer.comments.viewComment', 'View comment') : t('viewer.comments.addComment', 'Add comment')}>
-      <ActionIcon variant="subtle" color="gray" size="md" onClick={onClick} styles={commonButtonStyles}>
+    <Tooltip
+      label={
+        hasContent
+          ? t("viewer.comments.viewComment", "View comment")
+          : t("viewer.comments.addComment", "Add comment")
+      }
+    >
+      <ActionIcon
+        variant="subtle"
+        color="gray"
+        size="md"
+        onClick={onClick}
+        styles={commonButtonStyles}
+      >
         <CommentIcon style={{ fontSize: 18 }} />
       </ActionIcon>
     </Tooltip>
@@ -105,15 +140,25 @@ interface LinkButtonProps {
   onAddLink: (url: string) => void;
 }
 
-export function LinkButton({ firstLinkTarget, onGoToLink, onAddLink }: LinkButtonProps) {
+export function LinkButton({
+  firstLinkTarget,
+  onGoToLink,
+  onAddLink,
+}: LinkButtonProps) {
   const { t } = useTranslation();
   const [open, setOpen] = useState(false);
-  const [url, setUrl] = useState('');
+  const [url, setUrl] = useState("");
 
   if (firstLinkTarget) {
     return (
-      <Tooltip label={t('viewer.comments.goToLink', 'Go to link')}>
-        <ActionIcon variant="subtle" color="gray" size="md" onClick={onGoToLink} styles={commonButtonStyles}>
+      <Tooltip label={t("viewer.comments.goToLink", "Go to link")}>
+        <ActionIcon
+          variant="subtle"
+          color="gray"
+          size="md"
+          onClick={onGoToLink}
+          styles={commonButtonStyles}
+        >
           <OpenInNewIcon style={{ fontSize: 18 }} />
         </ActionIcon>
       </Tooltip>
@@ -123,8 +168,14 @@ export function LinkButton({ firstLinkTarget, onGoToLink, onAddLink }: LinkButto
   return (
     <Popover opened={open} onClose={() => setOpen(false)} position="top">
       <Popover.Target>
-        <Tooltip label={t('viewer.comments.addLink', 'Add link')}>
-          <ActionIcon variant="subtle" color="gray" size="md" onClick={() => setOpen((o) => !o)} styles={commonButtonStyles}>
+        <Tooltip label={t("viewer.comments.addLink", "Add link")}>
+          <ActionIcon
+            variant="subtle"
+            color="gray"
+            size="md"
+            onClick={() => setOpen((o) => !o)}
+            styles={commonButtonStyles}
+          >
             <LocalIcon icon="link" width="1.25rem" height="1.25rem" />
           </ActionIcon>
         </Tooltip>
@@ -143,11 +194,11 @@ export function LinkButton({ firstLinkTarget, onGoToLink, onAddLink }: LinkButto
             disabled={!url.trim()}
             onClick={() => {
               onAddLink(url);
-              setUrl('');
+              setUrl("");
               setOpen(false);
             }}
           >
-            {t('viewer.comments.addLink', 'Add link')}
+            {t("viewer.comments.addLink", "Add link")}
           </Button>
         </Stack>
       </Popover.Dropdown>
diff --git a/frontend/src/core/components/viewer/AnnotationSelectionMenu.tsx b/frontend/src/core/components/viewer/AnnotationSelectionMenu.tsx
index ceae6587e3..0b1e5f03e7 100644
--- a/frontend/src/core/components/viewer/AnnotationSelectionMenu.tsx
+++ b/frontend/src/core/components/viewer/AnnotationSelectionMenu.tsx
@@ -1,14 +1,17 @@
-import { Group } from '@mantine/core';
-import { createPortal } from 'react-dom';
-import { useEffect, useState, useRef, useCallback } from 'react';
-import { useAnnotation } from '@embedpdf/plugin-annotation/react';
-import type { TrackedAnnotation } from '@embedpdf/plugin-annotation';
-import { PdfAnnotationSubtype, type PdfAnnotationObject } from '@embedpdf/models';
-import type { AnnotationObject } from '@app/components/viewer/viewerTypes';
-import { useActiveDocumentId } from '@app/components/viewer/useActiveDocumentId';
-import { useViewer } from '@app/contexts/ViewerContext';
-import { useAnnotationMenuHandlers } from '@app/components/viewer/useAnnotationMenuHandlers';
-import { AnnotationTypeButtons } from '@app/components/viewer/AnnotationTypeButtons';
+import { Group } from "@mantine/core";
+import { createPortal } from "react-dom";
+import { useEffect, useState, useRef, useCallback } from "react";
+import { useAnnotation } from "@embedpdf/plugin-annotation/react";
+import type { TrackedAnnotation } from "@embedpdf/plugin-annotation";
+import {
+  PdfAnnotationSubtype,
+  type PdfAnnotationObject,
+} from "@embedpdf/models";
+import type { AnnotationObject } from "@app/components/viewer/viewerTypes";
+import { useActiveDocumentId } from "@app/components/viewer/useActiveDocumentId";
+import { useViewer } from "@app/contexts/ViewerContext";
+import { useAnnotationMenuHandlers } from "@app/components/viewer/useAnnotationMenuHandlers";
+import { AnnotationTypeButtons } from "@app/components/viewer/AnnotationTypeButtons";
 
 /**
  * Props interface matching EmbedPDF's annotation selection menu pattern
@@ -17,7 +20,7 @@ import { AnnotationTypeButtons } from '@app/components/viewer/AnnotationTypeButt
 export interface AnnotationSelectionMenuProps {
   documentId?: string;
   context?: {
-    type: 'annotation';
+    type: "annotation";
     annotation: TrackedAnnotation<PdfAnnotationObject>;
     pageIndex: number;
   };
@@ -31,7 +34,9 @@ export interface AnnotationSelectionMenuProps {
 export function AnnotationSelectionMenu(props: AnnotationSelectionMenuProps) {
   const activeDocumentId = useActiveDocumentId();
   if (!activeDocumentId) return null;
-  return <AnnotationSelectionMenuInner documentId={activeDocumentId} {...props} />;
+  return (
+    <AnnotationSelectionMenuInner documentId={activeDocumentId} {...props} />
+  );
 }
 
 function AnnotationSelectionMenuInner({
@@ -45,7 +50,10 @@ function AnnotationSelectionMenuInner({
   const { provides } = useAnnotation(documentId);
   const { scrollActions, requestCommentFocus } = useViewer();
   const wrapperRef = useRef<HTMLDivElement>(null);
-  const [menuPosition, setMenuPosition] = useState<{ top: number; left: number } | null>(null);
+  const [menuPosition, setMenuPosition] = useState<{
+    top: number;
+    left: number;
+  } | null>(null);
 
   const handlers = useAnnotationMenuHandlers({
     annotation,
@@ -65,10 +73,16 @@ function AnnotationSelectionMenuInner({
     const toolId = annObj?.customData?.toolId;
     const annType = annObj?.type;
     const isComment =
-      (annType === PdfAnnotationSubtype.TEXT && toolId === 'textComment') ||
-      (annType === PdfAnnotationSubtype.CARET && (toolId === 'insertText' || toolId === 'replaceText'));
+      (annType === PdfAnnotationSubtype.TEXT && toolId === "textComment") ||
+      (annType === PdfAnnotationSubtype.CARET &&
+        (toolId === "insertText" || toolId === "replaceText"));
     if (!isComment) return;
-    requestCommentFocus(documentId, pageIndex, annId, (annObj?.contents ?? '').trim().length > 0);
+    requestCommentFocus(
+      documentId,
+      pageIndex,
+      annId,
+      (annObj?.contents ?? "").trim().length > 0,
+    );
   }, [selected, annotation?.object]);
 
   // Click outside to deselect
@@ -76,20 +90,23 @@ function AnnotationSelectionMenuInner({
     if (!selected) return;
     const handlePointerDown = (e: PointerEvent) => {
       const target = e.target as HTMLElement;
-      if (target.closest('[data-annotation-selection-menu]')) return;
-      if (target.closest('[data-no-interaction]')) return;
-      if (target.closest('.mantine-Popover-dropdown')) return;
+      if (target.closest("[data-annotation-selection-menu]")) return;
+      if (target.closest("[data-no-interaction]")) return;
+      if (target.closest(".mantine-Popover-dropdown")) return;
       provides?.deselectAnnotation?.();
     };
-    document.addEventListener('pointerdown', handlePointerDown);
-    return () => document.removeEventListener('pointerdown', handlePointerDown);
+    document.addEventListener("pointerdown", handlePointerDown);
+    return () => document.removeEventListener("pointerdown", handlePointerDown);
   }, [selected, provides]);
 
   // Merge refs — menuWrapperProps.ref is a callback ref from EmbedPDF
-  const setRef = useCallback((node: HTMLDivElement | null) => {
-    wrapperRef.current = node;
-    menuWrapperProps?.ref?.(node);
-  }, [menuWrapperProps]);
+  const setRef = useCallback(
+    (node: HTMLDivElement | null) => {
+      wrapperRef.current = node;
+      menuWrapperProps?.ref?.(node);
+    },
+    [menuWrapperProps],
+  );
 
   // Track menu position via MutationObserver (handles drag repositioning)
   useEffect(() => {
@@ -100,22 +117,31 @@ function AnnotationSelectionMenuInner({
 
     const updatePosition = () => {
       const wrapper = wrapperRef.current;
-      if (!wrapper) { setMenuPosition(null); return; }
+      if (!wrapper) {
+        setMenuPosition(null);
+        return;
+      }
       const rect = wrapper.getBoundingClientRect();
-      setMenuPosition({ top: rect.bottom + 8, left: rect.left + rect.width / 2 });
+      setMenuPosition({
+        top: rect.bottom + 8,
+        left: rect.left + rect.width / 2,
+      });
     };
 
     updatePosition();
 
     const observer = new MutationObserver(updatePosition);
-    observer.observe(wrapperRef.current, { attributes: true, attributeFilter: ['style'] });
-    window.addEventListener('scroll', updatePosition, true);
-    window.addEventListener('resize', updatePosition);
+    observer.observe(wrapperRef.current, {
+      attributes: true,
+      attributeFilter: ["style"],
+    });
+    window.addEventListener("scroll", updatePosition, true);
+    window.addEventListener("resize", updatePosition);
 
     return () => {
       observer.disconnect();
-      window.removeEventListener('scroll', updatePosition, true);
-      window.removeEventListener('resize', updatePosition);
+      window.removeEventListener("scroll", updatePosition, true);
+      window.removeEventListener("resize", updatePosition);
     };
   }, [selected]);
 
@@ -125,20 +151,20 @@ function AnnotationSelectionMenuInner({
     <div
       data-annotation-selection-menu
       style={{
-        position: 'fixed',
+        position: "fixed",
         top: `${menuPosition.top}px`,
         left: `${menuPosition.left}px`,
-        transform: 'translateX(-50%)',
-        pointerEvents: 'auto',
+        transform: "translateX(-50%)",
+        pointerEvents: "auto",
         zIndex: 10000,
-        backgroundColor: 'var(--mantine-color-body)',
+        backgroundColor: "var(--mantine-color-body)",
         borderRadius: 8,
-        padding: '8px 12px',
-        boxShadow: '0 2px 12px rgba(0, 0, 0, 0.25)',
-        border: '1px solid var(--mantine-color-default-border)',
-        fontSize: '14px',
+        padding: "8px 12px",
+        boxShadow: "0 2px 12px rgba(0, 0, 0, 0.25)",
+        border: "1px solid var(--mantine-color-default-border)",
+        fontSize: "14px",
         minWidth: `${handlers.menuWidth}px`,
-        transition: 'min-width 0.2s ease',
+        transition: "min-width 0.2s ease",
       }}
     >
       <Group gap="sm" wrap="nowrap" justify="center">
@@ -156,8 +182,17 @@ function AnnotationSelectionMenuInner({
   return (
     <>
       {/* Invisible wrapper for EmbedPDF positioning — pointer-events:none so drag still works */}
-      <div ref={setRef} style={{ ...menuWrapperProps?.style, opacity: 0, pointerEvents: 'none' }} />
-      {typeof document !== 'undefined' && menuContent ? createPortal(menuContent, document.body) : null}
+      <div
+        ref={setRef}
+        style={{
+          ...menuWrapperProps?.style,
+          opacity: 0,
+          pointerEvents: "none",
+        }}
+      />
+      {typeof document !== "undefined" && menuContent
+        ? createPortal(menuContent, document.body)
+        : null}
     </>
   );
 }
diff --git a/frontend/src/core/components/viewer/AnnotationTypeButtons.tsx b/frontend/src/core/components/viewer/AnnotationTypeButtons.tsx
index ec626291bd..b9f38c1238 100644
--- a/frontend/src/core/components/viewer/AnnotationTypeButtons.tsx
+++ b/frontend/src/core/components/viewer/AnnotationTypeButtons.tsx
@@ -1,20 +1,28 @@
-import { useTranslation } from 'react-i18next';
-import type { TrackedAnnotation } from '@embedpdf/plugin-annotation';
-import type { PdfAnnotationObject } from '@embedpdf/models';
-import { OpacityControl } from '@app/components/annotation/shared/OpacityControl';
-import { WidthControl } from '@app/components/annotation/shared/WidthControl';
-import { PropertiesPopover, type PropertiesAnnotationType } from '@app/components/annotation/shared/PropertiesPopover';
-import { ColorControl } from '@app/components/annotation/shared/ColorControl';
+import { useTranslation } from "react-i18next";
+import type { TrackedAnnotation } from "@embedpdf/plugin-annotation";
+import type { PdfAnnotationObject } from "@embedpdf/models";
+import { OpacityControl } from "@app/components/annotation/shared/OpacityControl";
+import { WidthControl } from "@app/components/annotation/shared/WidthControl";
+import {
+  PropertiesPopover,
+  type PropertiesAnnotationType,
+} from "@app/components/annotation/shared/PropertiesPopover";
+import { ColorControl } from "@app/components/annotation/shared/ColorControl";
 import {
   DeleteButton,
   EditTextButton,
   AttachCommentButton,
   CommentButton,
   LinkButton,
-} from '@app/components/viewer/AnnotationMenuButtons';
-import type { AnnotationType, AnnotationMenuState, AnnotationMenuHandlers } from '@app/components/viewer/useAnnotationMenuHandlers';
+} from "@app/components/viewer/AnnotationMenuButtons";
+import type {
+  AnnotationType,
+  AnnotationMenuState,
+  AnnotationMenuHandlers,
+} from "@app/components/viewer/useAnnotationMenuHandlers";
 
-export interface AnnotationTypeButtonsProps extends AnnotationMenuState, AnnotationMenuHandlers {
+export interface AnnotationTypeButtonsProps
+  extends AnnotationMenuState, AnnotationMenuHandlers {
   annotation: TrackedAnnotation<PdfAnnotationObject> | undefined;
   documentId: string;
   pageIndex: number | undefined;
@@ -51,67 +59,81 @@ export function AnnotationTypeButtons(props: AnnotationTypeButtonsProps) {
   } = props;
 
   const attachCommentButton = (
-    <AttachCommentButton isInSidebar={isInSidebar} onView={onViewComment} onAdd={onAddToSidebar} />
+    <AttachCommentButton
+      isInSidebar={isInSidebar}
+      onView={onViewComment}
+      onAdd={onAddToSidebar}
+    />
   );
 
   switch (annotationType as AnnotationType) {
-    case 'textMarkup':
+    case "textMarkup":
       return (
         <>
           {attachCommentButton}
           <ColorControl
             value={currentColor}
-            onChange={(color) => onColorChange(color, 'main')}
-            label={t('annotation.changeColor', 'Change Colour')}
+            onChange={(color) => onColorChange(color, "main")}
+            label={t("annotation.changeColor", "Change Colour")}
           />
           <OpacityControl value={currentOpacity} onChange={onOpacityChange} />
           <DeleteButton onDelete={onDelete} />
         </>
       );
 
-    case 'ink':
+    case "ink":
       return (
         <>
           {attachCommentButton}
           <ColorControl
             value={currentColor}
-            onChange={(color) => onColorChange(color, 'main')}
-            label={t('annotation.changeColor', 'Change Colour')}
+            onChange={(color) => onColorChange(color, "main")}
+            label={t("annotation.changeColor", "Change Colour")}
+          />
+          <WidthControl
+            value={currentWidth}
+            onChange={onWidthChange}
+            min={1}
+            max={12}
           />
-          <WidthControl value={currentWidth} onChange={onWidthChange} min={1} max={12} />
           <DeleteButton onDelete={onDelete} />
         </>
       );
 
-    case 'inkHighlighter':
+    case "inkHighlighter":
       return (
         <>
           {attachCommentButton}
           <ColorControl
             value={currentColor}
-            onChange={(color) => onColorChange(color, 'main')}
-            label={t('annotation.changeColor', 'Change Colour')}
+            onChange={(color) => onColorChange(color, "main")}
+            label={t("annotation.changeColor", "Change Colour")}
+          />
+          <WidthControl
+            value={currentWidth}
+            onChange={onWidthChange}
+            min={1}
+            max={20}
           />
-          <WidthControl value={currentWidth} onChange={onWidthChange} min={1} max={20} />
           <OpacityControl value={currentOpacity} onChange={onOpacityChange} />
           <DeleteButton onDelete={onDelete} />
         </>
       );
 
-    case 'text':
-    case 'note':
+    case "text":
+    case "note":
       return (
         <>
           {attachCommentButton}
           <ColorControl
             value={textColor}
-            onChange={(color) => onColorChange(color, 'text')}
-            label={t('annotation.color', 'Color')}
+            onChange={(color) => onColorChange(color, "text")}
+            label={t("annotation.color", "Color")}
           />
           <ColorControl
             value={backgroundColor}
-            onChange={(color) => onColorChange(color, 'background')}
-            label={t('annotation.backgroundColor', 'Background color')}
+            onChange={(color) => onColorChange(color, "background")}
+            label={t("annotation.backgroundColor", "Background color")}
           />
           <EditTextButton onEdit={onEdit} />
           <PropertiesPopover
@@ -123,34 +145,41 @@ export function AnnotationTypeButtons(props: AnnotationTypeButtonsProps) {
         </>
       );
 
-    case 'comment':
+    case "comment":
       return (
         <>
-          <CommentButton hasContent={hasCommentContent} onClick={onViewComment} />
+          <CommentButton
+            hasContent={hasCommentContent}
+            onClick={onViewComment}
+          />
           <EditTextButton onEdit={onEdit} />
           <ColorControl
-            value={obj?.strokeColor || obj?.color || '#ffa000'}
+            value={obj?.strokeColor || obj?.color || "#ffa000"}
             onChange={onCommentColorChange}
-            label={t('annotation.annotationStyle', 'Annotation style')}
+            label={t("annotation.annotationStyle", "Annotation style")}
+          />
+          <LinkButton
+            firstLinkTarget={firstLinkTarget}
+            onGoToLink={onGoToLink}
+            onAddLink={onAddLink}
           />
-          <LinkButton firstLinkTarget={firstLinkTarget} onGoToLink={onGoToLink} onAddLink={onAddLink} />
           <DeleteButton onDelete={onDelete} />
         </>
       );
 
-    case 'shape':
+    case "shape":
       return (
         <>
           {attachCommentButton}
           <ColorControl
             value={strokeColor}
-            onChange={(color) => onColorChange(color, 'stroke')}
-            label={t('annotation.strokeColor', 'Stroke Colour')}
+            onChange={(color) => onColorChange(color, "stroke")}
+            label={t("annotation.strokeColor", "Stroke Colour")}
           />
           <ColorControl
             value={fillColor}
-            onChange={(color) => onColorChange(color, 'fill')}
-            label={t('annotation.fillColor', 'Fill Colour')}
+            onChange={(color) => onColorChange(color, "fill")}
+            label={t("annotation.fillColor", "Fill Colour")}
           />
           <PropertiesPopover
             annotationType="shape"
@@ -161,21 +190,26 @@ export function AnnotationTypeButtons(props: AnnotationTypeButtonsProps) {
         </>
       );
 
-    case 'line':
+    case "line":
       return (
         <>
           {attachCommentButton}
           <ColorControl
             value={currentColor}
-            onChange={(color) => onColorChange(color, 'main')}
-            label={t('annotation.changeColor', 'Change Colour')}
+            onChange={(color) => onColorChange(color, "main")}
+            label={t("annotation.changeColor", "Change Colour")}
+          />
+          <WidthControl
+            value={currentWidth}
+            onChange={onWidthChange}
+            min={1}
+            max={12}
           />
-          <WidthControl value={currentWidth} onChange={onWidthChange} min={1} max={12} />
           <DeleteButton onDelete={onDelete} />
         </>
       );
 
-    case 'stamp':
+    case "stamp":
       return (
         <>
           {attachCommentButton}
@@ -187,12 +221,19 @@ export function AnnotationTypeButtons(props: AnnotationTypeButtonsProps) {
       return (
         <>
           {attachCommentButton}
-          <CommentButton hasContent={hasCommentContent} onClick={onViewComment} />
-          <LinkButton firstLinkTarget={firstLinkTarget} onGoToLink={onGoToLink} onAddLink={onAddLink} />
+          <CommentButton
+            hasContent={hasCommentContent}
+            onClick={onViewComment}
+          />
+          <LinkButton
+            firstLinkTarget={firstLinkTarget}
+            onGoToLink={onGoToLink}
+            onAddLink={onAddLink}
+          />
           <ColorControl
             value={currentColor}
-            onChange={(color) => onColorChange(color, 'main')}
-            label={t('annotation.changeColor', 'Change Colour')}
+            onChange={(color) => onColorChange(color, "main")}
+            label={t("annotation.changeColor", "Change Colour")}
           />
           <DeleteButton onDelete={onDelete} />
         </>
diff --git a/frontend/src/core/components/viewer/AttachmentAPIBridge.tsx b/frontend/src/core/components/viewer/AttachmentAPIBridge.tsx
index 26e722a3bc..07ceb0a3cd 100644
--- a/frontend/src/core/components/viewer/AttachmentAPIBridge.tsx
+++ b/frontend/src/core/components/viewer/AttachmentAPIBridge.tsx
@@ -1,9 +1,12 @@
-import { useEffect, useMemo, useState, useCallback } from 'react';
-import { useAttachmentCapability } from '@embedpdf/plugin-attachment/react';
-import { useViewer } from '@app/contexts/ViewerContext';
-import { AttachmentState, AttachmentAPIWrapper } from '@app/contexts/viewer/viewerBridges';
-import { PdfAttachmentObject } from '@embedpdf/models';
-import { useDocumentReady } from '@app/components/viewer/hooks/useDocumentReady';
+import { useEffect, useMemo, useState, useCallback } from "react";
+import { useAttachmentCapability } from "@embedpdf/plugin-attachment/react";
+import { useViewer } from "@app/contexts/ViewerContext";
+import {
+  AttachmentState,
+  AttachmentAPIWrapper,
+} from "@app/contexts/viewer/viewerBridges";
+import { PdfAttachmentObject } from "@embedpdf/models";
+import { useDocumentReady } from "@app/components/viewer/hooks/useDocumentReady";
 
 /**
  * Connects the PDF attachment plugin to the shared ViewerContext.
@@ -18,45 +21,46 @@ export function AttachmentAPIBridge() {
   });
   const documentReady = useDocumentReady();
 
-  const fetchAttachments = useCallback(
-    async () => {
-      if (!attachmentCapability || !documentReady) {
-        // Set error state instead of throwing for better user experience
-        setState(prev => ({
-          ...prev,
-          error: 'Document not ready or attachment capability not available',
-          isLoading: false
-        }));
-        return [];
-      }
+  const fetchAttachments = useCallback(async () => {
+    if (!attachmentCapability || !documentReady) {
+      // Set error state instead of throwing for better user experience
+      setState((prev) => ({
+        ...prev,
+        error: "Document not ready or attachment capability not available",
+        isLoading: false,
+      }));
+      return [];
+    }
 
-      setState(prev => ({ ...prev, isLoading: true, error: null }));
-      try {
-        const task = attachmentCapability.getAttachments();
+    setState((prev) => ({ ...prev, isLoading: true, error: null }));
+    try {
+      const task = attachmentCapability.getAttachments();
 
-        const timeoutPromise = new Promise<never>((_, reject) => {
-          setTimeout(() => reject(new Error('Attachment fetch timeout after 10 seconds')), 10000);
-        });
+      const timeoutPromise = new Promise<never>((_, reject) => {
+        setTimeout(
+          () => reject(new Error("Attachment fetch timeout after 10 seconds")),
+          10000,
+        );
+      });
 
-        const result = await Promise.race([task.toPromise(), timeoutPromise]);
-        setState({
-          attachments: result ?? [],
-          isLoading: false,
-          error: null,
-        });
-        return result ?? [];
-      } catch (error) {
-        const message = error instanceof Error ? error.message : 'Failed to load attachments';
-        setState({
-          attachments: null,
-          isLoading: false,
-          error: message,
-        });
-        throw error;
-      }
-    },
-    [attachmentCapability, documentReady]
-  );
+      const result = await Promise.race([task.toPromise(), timeoutPromise]);
+      setState({
+        attachments: result ?? [],
+        isLoading: false,
+        error: null,
+      });
+      return result ?? [];
+    } catch (error) {
+      const message =
+        error instanceof Error ? error.message : "Failed to load attachments";
+      setState({
+        attachments: null,
+        isLoading: false,
+        error: message,
+      });
+      throw error;
+    }
+  }, [attachmentCapability, documentReady]);
 
   const api = useMemo<AttachmentAPIWrapper | null>(() => {
     // Only provide API when both capability AND document are ready
@@ -70,17 +74,17 @@ export function AttachmentAPIBridge() {
           const buffer = await task.toPromise();
 
           // Create a blob and trigger download
-          const blob = new Blob([buffer], { type: 'application/octet-stream' });
+          const blob = new Blob([buffer], { type: "application/octet-stream" });
           const url = window.URL.createObjectURL(blob);
-          const link = document.createElement('a');
+          const link = document.createElement("a");
           link.href = url;
-          link.download = attachment.name || 'attachment';
+          link.download = attachment.name || "attachment";
           document.body.appendChild(link);
           link.click();
           document.body.removeChild(link);
           window.URL.revokeObjectURL(url);
         } catch (error) {
-          console.error('Failed to download attachment:', error);
+          console.error("Failed to download attachment:", error);
         }
       },
       clearAttachments: () => {
@@ -103,17 +107,17 @@ export function AttachmentAPIBridge() {
   useEffect(() => {
     if (!api) {
       // If API becomes null (e.g. document transitions), ensure we unregister stale bridge
-      registerBridge('attachment', null);
+      registerBridge("attachment", null);
       return;
     }
 
-    registerBridge('attachment', {
+    registerBridge("attachment", {
       state,
       api,
     });
 
     return () => {
-      registerBridge('attachment', null);
+      registerBridge("attachment", null);
     };
   }, [api, state, registerBridge]);
 
diff --git a/frontend/src/core/components/viewer/AttachmentSidebar.css b/frontend/src/core/components/viewer/AttachmentSidebar.css
index 03f1dbd43c..6c20964ab3 100644
--- a/frontend/src/core/components/viewer/AttachmentSidebar.css
+++ b/frontend/src/core/components/viewer/AttachmentSidebar.css
@@ -32,7 +32,11 @@
 
 .attachment-item:hover {
   background: color-mix(in srgb, var(--text-primary) 8%, var(--bg-toolbar));
-  border-color: color-mix(in srgb, var(--text-primary) 20%, var(--border-subtle));
+  border-color: color-mix(
+    in srgb,
+    var(--text-primary) 20%,
+    var(--border-subtle)
+  );
   transform: translateX(2px);
 }
 
@@ -41,7 +45,8 @@
 }
 
 .attachment-item:focus-visible {
-  outline: 2px solid color-mix(in srgb, var(--text-primary) 30%, var(--border-subtle));
+  outline: 2px solid
+    color-mix(in srgb, var(--text-primary) 30%, var(--border-subtle));
   outline-offset: 2px;
 }
 
diff --git a/frontend/src/core/components/viewer/AttachmentSidebar.tsx b/frontend/src/core/components/viewer/AttachmentSidebar.tsx
index 1e5d6cd91a..29f9806342 100644
--- a/frontend/src/core/components/viewer/AttachmentSidebar.tsx
+++ b/frontend/src/core/components/viewer/AttachmentSidebar.tsx
@@ -1,13 +1,21 @@
-import { useEffect, useMemo, useRef, useState, useCallback } from 'react';
-import { Box, ScrollArea, Text, ActionIcon, Loader, Stack, TextInput } from '@mantine/core';
-import LocalIcon from '@app/components/shared/LocalIcon';
-import { useViewer } from '@app/contexts/ViewerContext';
-import { PdfAttachmentObject } from '@embedpdf/models';
-import AttachmentIcon from '@mui/icons-material/AttachmentRounded';
-import DownloadIcon from '@mui/icons-material/DownloadRounded';
-import { useTranslation } from 'react-i18next';
-import '@app/components/viewer/SidebarBase.css';
-import '@app/components/viewer/AttachmentSidebar.css';
+import { useEffect, useMemo, useRef, useState, useCallback } from "react";
+import {
+  Box,
+  ScrollArea,
+  Text,
+  ActionIcon,
+  Loader,
+  Stack,
+  TextInput,
+} from "@mantine/core";
+import LocalIcon from "@app/components/shared/LocalIcon";
+import { useViewer } from "@app/contexts/ViewerContext";
+import { PdfAttachmentObject } from "@embedpdf/models";
+import AttachmentIcon from "@mui/icons-material/AttachmentRounded";
+import DownloadIcon from "@mui/icons-material/DownloadRounded";
+import { useTranslation } from "react-i18next";
+import "@app/components/viewer/SidebarBase.css";
+import "@app/components/viewer/AttachmentSidebar.css";
 
 interface AttachmentSidebarProps {
   visible: boolean;
@@ -17,29 +25,41 @@ interface AttachmentSidebarProps {
   preloadCacheKeys?: string[];
 }
 
-const SIDEBAR_WIDTH = '15rem';
+const SIDEBAR_WIDTH = "15rem";
 
 interface AttachmentCacheEntry {
-  status: 'idle' | 'loading' | 'success' | 'error';
+  status: "idle" | "loading" | "success" | "error";
   attachments: PdfAttachmentObject[] | null;
   error: string | null;
   lastFetched: number | null;
 }
 
-const createEntry = (overrides: Partial<AttachmentCacheEntry> = {}): AttachmentCacheEntry => ({
-  status: 'idle',
+const createEntry = (
+  overrides: Partial<AttachmentCacheEntry> = {},
+): AttachmentCacheEntry => ({
+  status: "idle",
   attachments: null,
   error: null,
   lastFetched: null,
   ...overrides,
 });
 
-export const AttachmentSidebar = ({ visible, thumbnailVisible, bookmarkVisible, documentCacheKey, preloadCacheKeys = [] }: AttachmentSidebarProps) => {
+export const AttachmentSidebar = ({
+  visible,
+  thumbnailVisible,
+  bookmarkVisible,
+  documentCacheKey,
+  preloadCacheKeys = [],
+}: AttachmentSidebarProps) => {
   const { t } = useTranslation();
   const { attachmentActions, hasAttachmentSupport } = useViewer();
-  const [searchTerm, setSearchTerm] = useState('');
-  const [attachmentSupport, setAttachmentSupport] = useState(() => hasAttachmentSupport());
-  const [activeEntry, setActiveEntry] = useState<AttachmentCacheEntry>(() => createEntry());
+  const [searchTerm, setSearchTerm] = useState("");
+  const [attachmentSupport, setAttachmentSupport] = useState(() =>
+    hasAttachmentSupport(),
+  );
+  const [activeEntry, setActiveEntry] = useState<AttachmentCacheEntry>(() =>
+    createEntry(),
+  );
   const cacheRef = useRef<Map<string, AttachmentCacheEntry>>(new Map());
   const [fetchNonce, setFetchNonce] = useState(0);
   const currentKeyRef = useRef<string | null>(documentCacheKey ?? null);
@@ -67,7 +87,7 @@ export const AttachmentSidebar = ({ visible, thumbnailVisible, bookmarkVisible,
 
   // Reset UI and load cached entry (if any) when switching documents
   useEffect(() => {
-    setSearchTerm('');
+    setSearchTerm("");
 
     if (!documentCacheKey) {
       setActiveEntry(createEntry());
@@ -78,10 +98,13 @@ export const AttachmentSidebar = ({ visible, thumbnailVisible, bookmarkVisible,
     const cached = cacheRef.current.get(documentCacheKey);
     if (cached) {
       setActiveEntry(cached);
-      if (cached.status === 'success') {
+      if (cached.status === "success") {
         attachmentActions.setLocalAttachments(cached.attachments ?? [], null);
-      } else if (cached.status === 'error') {
-        attachmentActions.setLocalAttachments(cached.attachments ?? null, cached.error);
+      } else if (cached.status === "error") {
+        attachmentActions.setLocalAttachments(
+          cached.attachments ?? null,
+          cached.error,
+        );
       } else {
         attachmentActions.clearAttachments();
       }
@@ -97,7 +120,7 @@ export const AttachmentSidebar = ({ visible, thumbnailVisible, bookmarkVisible,
     if (documentCacheKey) {
       allowed.add(documentCacheKey);
     }
-    preloadCacheKeys.forEach(key => {
+    preloadCacheKeys.forEach((key) => {
       if (key) {
         allowed.add(key);
       }
@@ -116,7 +139,10 @@ export const AttachmentSidebar = ({ visible, thumbnailVisible, bookmarkVisible,
 
     const key = documentCacheKey;
     const cached = cacheRef.current.get(key);
-    if (cached && (cached.status === 'loading' || cached.status === 'success')) {
+    if (
+      cached &&
+      (cached.status === "loading" || cached.status === "success")
+    ) {
       return;
     }
 
@@ -128,11 +154,13 @@ export const AttachmentSidebar = ({ visible, thumbnailVisible, bookmarkVisible,
       }
     };
 
-    updateEntry(createEntry({
-      status: 'loading',
-      attachments: cached?.attachments ?? null,
-      lastFetched: cached?.lastFetched ?? null,
-    }));
+    updateEntry(
+      createEntry({
+        status: "loading",
+        attachments: cached?.attachments ?? null,
+        lastFetched: cached?.lastFetched ?? null,
+      }),
+    );
 
     const fetchWithRetry = async () => {
       const maxAttempts = 10;
@@ -141,27 +169,30 @@ export const AttachmentSidebar = ({ visible, thumbnailVisible, bookmarkVisible,
           const result = await attachmentActions.getAttachments();
           return Array.isArray(result) ? result : [];
         } catch (error: any) {
-          const message = typeof error?.message === 'string' ? error.message.toLowerCase() : '';
+          const message =
+            typeof error?.message === "string"
+              ? error.message.toLowerCase()
+              : "";
           const notReady =
-            message.includes('document') &&
-            message.includes('not') &&
-            message.includes('open');
+            message.includes("document") &&
+            message.includes("not") &&
+            message.includes("open");
 
           if (!notReady || attempt === maxAttempts - 1) {
             throw error;
           }
 
-          await new Promise(resolve => setTimeout(resolve, 50));
+          await new Promise((resolve) => setTimeout(resolve, 50));
         }
       }
       return [];
     };
 
     fetchWithRetry()
-      .then(attachments => {
+      .then((attachments) => {
         if (cancelled) return;
         const entry = createEntry({
-          status: 'success',
+          status: "success",
           attachments,
           lastFetched: Date.now(),
         });
@@ -170,12 +201,13 @@ export const AttachmentSidebar = ({ visible, thumbnailVisible, bookmarkVisible,
           attachmentActions.setLocalAttachments(attachments, null);
         }
       })
-      .catch(error => {
+      .catch((error) => {
         if (cancelled) return;
-        const message = error instanceof Error ? error.message : 'Failed to load attachments';
+        const message =
+          error instanceof Error ? error.message : "Failed to load attachments";
         const fallback = cacheRef.current.get(key);
         const entry = createEntry({
-          status: 'error',
+          status: "error",
           attachments: fallback?.attachments ?? null,
           error: message,
           lastFetched: fallback?.lastFetched ?? null,
@@ -196,40 +228,48 @@ export const AttachmentSidebar = ({ visible, thumbnailVisible, bookmarkVisible,
     cacheRef.current.delete(documentCacheKey);
     setActiveEntry(createEntry());
     attachmentActions.clearAttachments();
-    setFetchNonce(value => value + 1);
+    setFetchNonce((value) => value + 1);
   }, [documentCacheKey, attachmentActions]);
 
-  const handleDownload = (attachment: PdfAttachmentObject, event: React.MouseEvent) => {
+  const handleDownload = (
+    attachment: PdfAttachmentObject,
+    event: React.MouseEvent,
+  ) => {
     event.stopPropagation();
     attachmentActions.downloadAttachment(attachment);
   };
 
   const filteredAttachments = useMemo(() => {
-    const attachments = Array.isArray(activeEntry.attachments) ? activeEntry.attachments : [];
+    const attachments = Array.isArray(activeEntry.attachments)
+      ? activeEntry.attachments
+      : [];
     if (!searchTerm.trim()) return attachments;
     const term = searchTerm.trim().toLowerCase();
-    return attachments.filter(a => a.name?.toLowerCase().includes(term));
+    return attachments.filter((a) => a.name?.toLowerCase().includes(term));
   }, [activeEntry.attachments, searchTerm]);
 
   const formatFileSize = (bytes?: number) => {
-    if (bytes === undefined) return '';
-    if (bytes === 0) return '0 B';
+    if (bytes === undefined) return "";
+    if (bytes === 0) return "0 B";
     const k = 1024;
-    const sizes = ['B', 'KB', 'MB', 'GB'];
+    const sizes = ["B", "KB", "MB", "GB"];
     const i = Math.floor(Math.log(bytes) / Math.log(k));
-    return parseFloat((bytes / Math.pow(k, i)).toFixed(1)) + ' ' + sizes[i];
+    return parseFloat((bytes / Math.pow(k, i)).toFixed(1)) + " " + sizes[i];
   };
 
   const renderAttachments = (attachments: PdfAttachmentObject[]) => {
     return attachments.map((attachment, index) => (
-      <div key={`${attachment.name}-${index}`} className="attachment-item-wrapper">
+      <div
+        key={`${attachment.name}-${index}`}
+        className="attachment-item-wrapper"
+      >
         <div
           className="attachment-item"
           onClick={(event) => handleDownload(attachment, event)}
           role="button"
           tabIndex={0}
           onKeyDown={(event) => {
-            if (event.key === 'Enter' || event.key === ' ') {
+            if (event.key === "Enter" || event.key === " ") {
               event.preventDefault();
               handleDownload(attachment, event as any);
             }
@@ -237,11 +277,13 @@ export const AttachmentSidebar = ({ visible, thumbnailVisible, bookmarkVisible,
         >
           <div className="attachment-item__content">
             <Text size="sm" fw={500} className="attachment-item__title">
-              {attachment.name || 'Untitled'}
+              {attachment.name || "Untitled"}
             </Text>
             {(attachment.size !== undefined || attachment.description) && (
               <Text size="xs" c="dimmed" className="attachment-item__meta">
-                {[formatFileSize(attachment.size), attachment.description].filter(Boolean).join(' • ')}
+                {[formatFileSize(attachment.size), attachment.description]
+                  .filter(Boolean)
+                  .join(" • ")}
               </Text>
             )}
           </div>
@@ -251,7 +293,7 @@ export const AttachmentSidebar = ({ visible, thumbnailVisible, bookmarkVisible,
             className="attachment-item__download-icon"
             onClick={(event) => handleDownload(attachment, event)}
           >
-            <DownloadIcon sx={{ fontSize: '1.2rem' }} />
+            <DownloadIcon sx={{ fontSize: "1.2rem" }} />
           </ActionIcon>
         </div>
       </div>
@@ -263,17 +305,23 @@ export const AttachmentSidebar = ({ visible, thumbnailVisible, bookmarkVisible,
   }
 
   const isSearchActive = searchTerm.trim().length > 0;
-  const hasAttachments = Array.isArray(activeEntry.attachments) && activeEntry.attachments.length > 0;
-  const isLocalLoading = attachmentSupport && activeEntry.status === 'loading';
-  const currentError = attachmentSupport && activeEntry.status === 'error' ? activeEntry.error : null;
+  const hasAttachments =
+    Array.isArray(activeEntry.attachments) &&
+    activeEntry.attachments.length > 0;
+  const isLocalLoading = attachmentSupport && activeEntry.status === "loading";
+  const currentError =
+    attachmentSupport && activeEntry.status === "error"
+      ? activeEntry.error
+      : null;
 
-  const showAttachmentList = attachmentSupport && documentCacheKey && filteredAttachments.length > 0;
+  const showAttachmentList =
+    attachmentSupport && documentCacheKey && filteredAttachments.length > 0;
   const showEmptyState =
     attachmentSupport &&
     documentCacheKey &&
     !isLocalLoading &&
     !currentError &&
-    activeEntry.status === 'success' &&
+    activeEntry.status === "success" &&
     !hasAttachments;
   const showSearchEmpty =
     attachmentSupport &&
@@ -287,7 +335,7 @@ export const AttachmentSidebar = ({ visible, thumbnailVisible, bookmarkVisible,
     <Box
       className="sidebar-base attachment-sidebar"
       style={{
-        position: 'fixed',
+        position: "fixed",
         right: `${(thumbnailVisible ? 15 : 0) + (bookmarkVisible ? 15 : 0)}rem`,
         top: 0,
         bottom: 0,
@@ -301,27 +349,42 @@ export const AttachmentSidebar = ({ visible, thumbnailVisible, bookmarkVisible,
             <AttachmentIcon />
           </span>
           <Text fw={600} size="sm" tt="uppercase" lts={0.5}>
-            {t('viewer.attachments.title', 'Attachments')}
+            {t("viewer.attachments.title", "Attachments")}
           </Text>
         </div>
       </div>
 
-      <Box px="sm" pb="sm" className="sidebar-base__search attachment-sidebar__search">
+      <Box
+        px="sm"
+        pb="sm"
+        className="sidebar-base__search attachment-sidebar__search"
+      >
         <TextInput
           value={searchTerm}
-          placeholder={t('viewer.attachments.searchPlaceholder', 'Search attachments')}
+          placeholder={t(
+            "viewer.attachments.searchPlaceholder",
+            "Search attachments",
+          )}
           onChange={(event) => setSearchTerm(event.currentTarget.value)}
-          leftSection={<LocalIcon icon="search" width="1.1rem" height="1.1rem" />}
+          leftSection={
+            <LocalIcon icon="search" width="1.1rem" height="1.1rem" />
+          }
           size="xs"
         />
       </Box>
 
       <ScrollArea style={{ flex: 1 }}>
-        <Box p="sm" className="sidebar-base__content attachment-sidebar__content">
+        <Box
+          p="sm"
+          className="sidebar-base__content attachment-sidebar__content"
+        >
           {!attachmentSupport && (
             <div className="sidebar-base__empty-state">
               <Text size="sm" c="dimmed" ta="center">
-                {t('viewer.attachments.noSupport', 'Attachment support is unavailable for this viewer.')}
+                {t(
+                  "viewer.attachments.noSupport",
+                  "Attachment support is unavailable for this viewer.",
+                )}
               </Text>
             </div>
           )}
@@ -329,7 +392,10 @@ export const AttachmentSidebar = ({ visible, thumbnailVisible, bookmarkVisible,
           {attachmentSupport && showNoDocument && (
             <div className="sidebar-base__empty-state">
               <Text size="sm" c="dimmed" ta="center">
-                {t('viewer.attachments.noDocument', 'Open a PDF to view its attachments.')}
+                {t(
+                  "viewer.attachments.noDocument",
+                  "Open a PDF to view its attachments.",
+                )}
               </Text>
             </div>
           )}
@@ -346,10 +412,16 @@ export const AttachmentSidebar = ({ visible, thumbnailVisible, bookmarkVisible,
           )}
 
           {attachmentSupport && documentCacheKey && isLocalLoading && (
-            <Stack gap="md" align="center" c="dimmed" py="xl" className="sidebar-base__loading">
+            <Stack
+              gap="md"
+              align="center"
+              c="dimmed"
+              py="xl"
+              className="sidebar-base__loading"
+            >
               <Loader size="md" type="dots" />
               <Text size="sm" ta="center">
-                {t('viewer.attachments.loading', 'Loading attachments...')}
+                {t("viewer.attachments.loading", "Loading attachments...")}
               </Text>
             </Stack>
           )}
@@ -357,7 +429,10 @@ export const AttachmentSidebar = ({ visible, thumbnailVisible, bookmarkVisible,
           {showEmptyState && (
             <div className="sidebar-base__empty-state">
               <Text size="sm" c="dimmed" ta="center">
-                {t('viewer.attachments.empty', 'No attachments in this document')}
+                {t(
+                  "viewer.attachments.empty",
+                  "No attachments in this document",
+                )}
               </Text>
             </div>
           )}
@@ -371,7 +446,10 @@ export const AttachmentSidebar = ({ visible, thumbnailVisible, bookmarkVisible,
           {showSearchEmpty && (
             <div className="sidebar-base__empty-state">
               <Text size="sm" c="dimmed" ta="center">
-                {t('viewer.attachments.noMatch', 'No attachments match your search')}
+                {t(
+                  "viewer.attachments.noMatch",
+                  "No attachments match your search",
+                )}
               </Text>
             </div>
           )}
diff --git a/frontend/src/core/components/viewer/BookmarkAPIBridge.tsx b/frontend/src/core/components/viewer/BookmarkAPIBridge.tsx
index 900dcb8090..6d57a82d01 100644
--- a/frontend/src/core/components/viewer/BookmarkAPIBridge.tsx
+++ b/frontend/src/core/components/viewer/BookmarkAPIBridge.tsx
@@ -1,8 +1,14 @@
-import { useEffect, useMemo, useState, useCallback } from 'react';
-import { useBookmarkCapability, BookmarkCapability } from '@embedpdf/plugin-bookmark/react';
-import { useViewer } from '@app/contexts/ViewerContext';
-import { BookmarkState, BookmarkAPIWrapper } from '@app/contexts/viewer/viewerBridges';
-import { useDocumentReady } from '@app/components/viewer/hooks/useDocumentReady';
+import { useEffect, useMemo, useState, useCallback } from "react";
+import {
+  useBookmarkCapability,
+  BookmarkCapability,
+} from "@embedpdf/plugin-bookmark/react";
+import { useViewer } from "@app/contexts/ViewerContext";
+import {
+  BookmarkState,
+  BookmarkAPIWrapper,
+} from "@app/contexts/viewer/viewerBridges";
+import { useDocumentReady } from "@app/components/viewer/hooks/useDocumentReady";
 
 /**
  * Connects the PDF bookmark plugin to the shared ViewerContext.
@@ -20,15 +26,15 @@ export function BookmarkAPIBridge() {
   const fetchBookmarks = useCallback(
     async (capability: BookmarkCapability) => {
       if (!documentReady) {
-        setState(prev => ({
+        setState((prev) => ({
           ...prev,
-          error: 'Document not ready or bookmark capability not available',
+          error: "Document not ready or bookmark capability not available",
           isLoading: false,
         }));
         return [];
       }
 
-      setState(prev => ({ ...prev, isLoading: true, error: null }));
+      setState((prev) => ({ ...prev, isLoading: true, error: null }));
       try {
         const task = capability.getBookmarks();
         const result = await task.toPromise();
@@ -39,7 +45,8 @@ export function BookmarkAPIBridge() {
         });
         return result.bookmarks ?? [];
       } catch (error) {
-        const message = error instanceof Error ? error.message : 'Failed to load bookmarks';
+        const message =
+          error instanceof Error ? error.message : "Failed to load bookmarks";
         setState({
           bookmarks: null,
           isLoading: false,
@@ -48,7 +55,7 @@ export function BookmarkAPIBridge() {
         throw error;
       }
     },
-    [documentReady]
+    [documentReady],
   );
 
   const api = useMemo<BookmarkAPIWrapper | null>(() => {
@@ -76,17 +83,17 @@ export function BookmarkAPIBridge() {
 
   useEffect(() => {
     if (!api) {
-      registerBridge('bookmark', null);
+      registerBridge("bookmark", null);
       return;
     }
 
-    registerBridge('bookmark', {
+    registerBridge("bookmark", {
       state,
       api,
     });
 
     return () => {
-      registerBridge('bookmark', null);
+      registerBridge("bookmark", null);
     };
   }, [api, state, registerBridge]);
 
diff --git a/frontend/src/core/components/viewer/BookmarkSidebar.css b/frontend/src/core/components/viewer/BookmarkSidebar.css
index 8e4fb0328d..74214fe8b9 100644
--- a/frontend/src/core/components/viewer/BookmarkSidebar.css
+++ b/frontend/src/core/components/viewer/BookmarkSidebar.css
@@ -37,7 +37,11 @@
 
 .bookmark-item--clickable:hover {
   background: color-mix(in srgb, var(--text-primary) 8%, var(--bg-toolbar));
-  border-color: color-mix(in srgb, var(--text-primary) 20%, var(--border-subtle));
+  border-color: color-mix(
+    in srgb,
+    var(--text-primary) 20%,
+    var(--border-subtle)
+  );
   transform: translateX(2px);
 }
 
@@ -46,7 +50,8 @@
 }
 
 .bookmark-item--clickable:focus-visible {
-  outline: 2px solid color-mix(in srgb, var(--text-primary) 30%, var(--border-subtle));
+  outline: 2px solid
+    color-mix(in srgb, var(--text-primary) 30%, var(--border-subtle));
   outline-offset: 2px;
 }
 
diff --git a/frontend/src/core/components/viewer/BookmarkSidebar.tsx b/frontend/src/core/components/viewer/BookmarkSidebar.tsx
index 505ccaca6f..c87c783bdf 100644
--- a/frontend/src/core/components/viewer/BookmarkSidebar.tsx
+++ b/frontend/src/core/components/viewer/BookmarkSidebar.tsx
@@ -1,11 +1,20 @@
-import { useEffect, useMemo, useRef, useState, useCallback } from 'react';
-import { Box, ScrollArea, Text, ActionIcon, Loader, Stack, TextInput, Button } from '@mantine/core';
-import LocalIcon from '@app/components/shared/LocalIcon';
-import { useViewer } from '@app/contexts/ViewerContext';
-import { PdfBookmarkObject, PdfActionType } from '@embedpdf/models';
-import BookmarksIcon from '@mui/icons-material/BookmarksRounded';
-import '@app/components/viewer/SidebarBase.css';
-import '@app/components/viewer/BookmarkSidebar.css';
+import { useEffect, useMemo, useRef, useState, useCallback } from "react";
+import {
+  Box,
+  ScrollArea,
+  Text,
+  ActionIcon,
+  Loader,
+  Stack,
+  TextInput,
+  Button,
+} from "@mantine/core";
+import LocalIcon from "@app/components/shared/LocalIcon";
+import { useViewer } from "@app/contexts/ViewerContext";
+import { PdfBookmarkObject, PdfActionType } from "@embedpdf/models";
+import BookmarksIcon from "@mui/icons-material/BookmarksRounded";
+import "@app/components/viewer/SidebarBase.css";
+import "@app/components/viewer/BookmarkSidebar.css";
 
 interface BookmarkSidebarProps {
   visible: boolean;
@@ -14,11 +23,11 @@ interface BookmarkSidebarProps {
   preloadCacheKeys?: string[];
 }
 
-const SIDEBAR_WIDTH = '15rem';
+const SIDEBAR_WIDTH = "15rem";
 
 type BookmarkNode = PdfBookmarkObject & { id: string };
 
-type BookmarkCacheStatus = 'idle' | 'loading' | 'success' | 'error';
+type BookmarkCacheStatus = "idle" | "loading" | "success" | "error";
 
 interface BookmarkCacheEntry {
   status: BookmarkCacheStatus;
@@ -27,8 +36,10 @@ interface BookmarkCacheEntry {
   lastFetched: number | null;
 }
 
-const createEntry = (overrides: Partial<BookmarkCacheEntry> = {}): BookmarkCacheEntry => ({
-  status: 'idle',
+const createEntry = (
+  overrides: Partial<BookmarkCacheEntry> = {},
+): BookmarkCacheEntry => ({
+  status: "idle",
   bookmarks: null,
   error: null,
   lastFetched: null,
@@ -39,11 +50,11 @@ const resolvePageNumber = (bookmark: PdfBookmarkObject): number | null => {
   const target = bookmark.target;
   if (!target) return null;
 
-  if (target.type === 'destination') {
+  if (target.type === "destination") {
     return target.destination.pageIndex + 1;
   }
 
-  if (target.type === 'action') {
+  if (target.type === "action") {
     const action = target.action;
     if (
       action.type === PdfActionType.Goto ||
@@ -58,12 +69,21 @@ const resolvePageNumber = (bookmark: PdfBookmarkObject): number | null => {
   return null;
 };
 
-export const BookmarkSidebar = ({ visible, thumbnailVisible, documentCacheKey, preloadCacheKeys = [] }: BookmarkSidebarProps) => {
+export const BookmarkSidebar = ({
+  visible,
+  thumbnailVisible,
+  documentCacheKey,
+  preloadCacheKeys = [],
+}: BookmarkSidebarProps) => {
   const { bookmarkActions, scrollActions, hasBookmarkSupport } = useViewer();
   const [expanded, setExpanded] = useState<Record<string, boolean>>({});
-  const [searchTerm, setSearchTerm] = useState('');
-  const [bookmarkSupport, setBookmarkSupport] = useState(() => hasBookmarkSupport());
-  const [activeEntry, setActiveEntry] = useState<BookmarkCacheEntry>(() => createEntry());
+  const [searchTerm, setSearchTerm] = useState("");
+  const [bookmarkSupport, setBookmarkSupport] = useState(() =>
+    hasBookmarkSupport(),
+  );
+  const [activeEntry, setActiveEntry] = useState<BookmarkCacheEntry>(() =>
+    createEntry(),
+  );
   const cacheRef = useRef<Map<string, BookmarkCacheEntry>>(new Map());
   const [fetchNonce, setFetchNonce] = useState(0);
   const currentKeyRef = useRef<string | null>(documentCacheKey ?? null);
@@ -92,7 +112,7 @@ export const BookmarkSidebar = ({ visible, thumbnailVisible, documentCacheKey, p
   // Reset UI and load cached entry (if any) when switching documents
   useEffect(() => {
     setExpanded({});
-    setSearchTerm('');
+    setSearchTerm("");
 
     if (!documentCacheKey) {
       setActiveEntry(createEntry());
@@ -103,10 +123,13 @@ export const BookmarkSidebar = ({ visible, thumbnailVisible, documentCacheKey, p
     const cached = cacheRef.current.get(documentCacheKey);
     if (cached) {
       setActiveEntry(cached);
-      if (cached.status === 'success') {
+      if (cached.status === "success") {
         bookmarkActions.setLocalBookmarks(cached.bookmarks ?? [], null);
-      } else if (cached.status === 'error') {
-        bookmarkActions.setLocalBookmarks(cached.bookmarks ?? null, cached.error);
+      } else if (cached.status === "error") {
+        bookmarkActions.setLocalBookmarks(
+          cached.bookmarks ?? null,
+          cached.error,
+        );
       } else {
         bookmarkActions.clearBookmarks();
       }
@@ -122,7 +145,7 @@ export const BookmarkSidebar = ({ visible, thumbnailVisible, documentCacheKey, p
     if (documentCacheKey) {
       allowed.add(documentCacheKey);
     }
-    preloadCacheKeys.forEach(key => {
+    preloadCacheKeys.forEach((key) => {
       if (key) {
         allowed.add(key);
       }
@@ -141,7 +164,10 @@ export const BookmarkSidebar = ({ visible, thumbnailVisible, documentCacheKey, p
 
     const key = documentCacheKey;
     const cached = cacheRef.current.get(key);
-    if (cached && (cached.status === 'loading' || cached.status === 'success')) {
+    if (
+      cached &&
+      (cached.status === "loading" || cached.status === "success")
+    ) {
       return;
     }
 
@@ -153,11 +179,13 @@ export const BookmarkSidebar = ({ visible, thumbnailVisible, documentCacheKey, p
       }
     };
 
-    updateEntry(createEntry({
-      status: 'loading',
-      bookmarks: cached?.bookmarks ?? null,
-      lastFetched: cached?.lastFetched ?? null,
-    }));
+    updateEntry(
+      createEntry({
+        status: "loading",
+        bookmarks: cached?.bookmarks ?? null,
+        lastFetched: cached?.lastFetched ?? null,
+      }),
+    );
 
     const fetchWithRetry = async () => {
       const maxAttempts = 10;
@@ -166,27 +194,30 @@ export const BookmarkSidebar = ({ visible, thumbnailVisible, documentCacheKey, p
           const result = await bookmarkActions.fetchBookmarks();
           return Array.isArray(result) ? result : [];
         } catch (error: any) {
-          const message = typeof error?.message === 'string' ? error.message.toLowerCase() : '';
+          const message =
+            typeof error?.message === "string"
+              ? error.message.toLowerCase()
+              : "";
           const notReady =
-            message.includes('document') &&
-            message.includes('not') &&
-            message.includes('open');
+            message.includes("document") &&
+            message.includes("not") &&
+            message.includes("open");
 
           if (!notReady || attempt === maxAttempts - 1) {
             throw error;
           }
 
-          await new Promise(resolve => setTimeout(resolve, 50));
+          await new Promise((resolve) => setTimeout(resolve, 50));
         }
       }
       return [];
     };
 
     fetchWithRetry()
-      .then(bookmarks => {
+      .then((bookmarks) => {
         if (cancelled) return;
         const entry = createEntry({
-          status: 'success',
+          status: "success",
           bookmarks,
           lastFetched: Date.now(),
         });
@@ -195,12 +226,13 @@ export const BookmarkSidebar = ({ visible, thumbnailVisible, documentCacheKey, p
           bookmarkActions.setLocalBookmarks(bookmarks, null);
         }
       })
-      .catch(error => {
+      .catch((error) => {
         if (cancelled) return;
-        const message = error instanceof Error ? error.message : 'Failed to load bookmarks';
+        const message =
+          error instanceof Error ? error.message : "Failed to load bookmarks";
         const fallback = cacheRef.current.get(key);
         const entry = createEntry({
-          status: 'error',
+          status: "error",
           bookmarks: fallback?.bookmarks ?? null,
           error: message,
           lastFetched: fallback?.lastFetched ?? null,
@@ -221,11 +253,14 @@ export const BookmarkSidebar = ({ visible, thumbnailVisible, documentCacheKey, p
     cacheRef.current.delete(documentCacheKey);
     setActiveEntry(createEntry());
     bookmarkActions.clearBookmarks();
-    setFetchNonce(value => value + 1);
+    setFetchNonce((value) => value + 1);
   }, [documentCacheKey, bookmarkActions]);
 
   const bookmarksWithIds = useMemo(() => {
-    const assignIds = (nodes: PdfBookmarkObject[], prefix = 'root'): BookmarkNode[] => {
+    const assignIds = (
+      nodes: PdfBookmarkObject[],
+      prefix = "root",
+    ): BookmarkNode[] => {
       if (!Array.isArray(nodes)) {
         return [];
       }
@@ -240,16 +275,19 @@ export const BookmarkSidebar = ({ visible, thumbnailVisible, documentCacheKey, p
       });
     };
 
-    const bookmarks = Array.isArray(activeEntry.bookmarks) ? activeEntry.bookmarks : [];
+    const bookmarks = Array.isArray(activeEntry.bookmarks)
+      ? activeEntry.bookmarks
+      : [];
     return assignIds(bookmarks);
   }, [activeEntry.bookmarks]);
 
   const currentStatus = activeEntry.status;
-  const isLocalLoading = bookmarkSupport && currentStatus === 'loading';
-  const currentError = bookmarkSupport && currentStatus === 'error' ? activeEntry.error : null;
+  const isLocalLoading = bookmarkSupport && currentStatus === "loading";
+  const currentError =
+    bookmarkSupport && currentStatus === "error" ? activeEntry.error : null;
 
   const toggleNode = (nodeId: string) => {
-    setExpanded(prev => ({
+    setExpanded((prev) => ({
       ...prev,
       [nodeId]: !(prev[nodeId] ?? true),
     }));
@@ -258,7 +296,7 @@ export const BookmarkSidebar = ({ visible, thumbnailVisible, documentCacheKey, p
   const expandAll = useCallback(() => {
     const allExpanded: Record<string, boolean> = {};
     const expandRecursive = (nodes: BookmarkNode[]) => {
-      nodes.forEach(node => {
+      nodes.forEach((node) => {
         if (node.children && node.children.length > 0) {
           allExpanded[node.id] = true;
           expandRecursive(node.children as BookmarkNode[]);
@@ -272,7 +310,7 @@ export const BookmarkSidebar = ({ visible, thumbnailVisible, documentCacheKey, p
   const collapseAll = useCallback(() => {
     const allCollapsed: Record<string, boolean> = {};
     const collapseRecursive = (nodes: BookmarkNode[]) => {
-      nodes.forEach(node => {
+      nodes.forEach((node) => {
         if (node.children && node.children.length > 0) {
           allCollapsed[node.id] = false;
           collapseRecursive(node.children as BookmarkNode[]);
@@ -283,18 +321,21 @@ export const BookmarkSidebar = ({ visible, thumbnailVisible, documentCacheKey, p
     setExpanded(allCollapsed);
   }, [bookmarksWithIds]);
 
-  const handleBookmarkClick = (bookmark: PdfBookmarkObject, event: React.MouseEvent) => {
+  const handleBookmarkClick = (
+    bookmark: PdfBookmarkObject,
+    event: React.MouseEvent,
+  ) => {
     const target = bookmark.target;
-    if (target?.type === 'action') {
+    if (target?.type === "action") {
       const action = target.action;
       if (action.type === PdfActionType.URI && action.uri) {
         event.preventDefault();
-        window.open(action.uri, '_blank', 'noopener');
+        window.open(action.uri, "_blank", "noopener");
         return;
       }
       if (action.type === PdfActionType.LaunchAppOrOpenFile && action.path) {
         event.preventDefault();
-        window.open(action.path, '_blank', 'noopener');
+        window.open(action.path, "_blank", "noopener");
         return;
       }
     }
@@ -313,11 +354,16 @@ export const BookmarkSidebar = ({ visible, thumbnailVisible, documentCacheKey, p
       const results: BookmarkNode[] = [];
 
       for (const node of nodeList) {
-        const childMatches = node.children ? applyFilter(node.children as BookmarkNode[]) : [];
+        const childMatches = node.children
+          ? applyFilter(node.children as BookmarkNode[])
+          : [];
         const matchesSelf = node.title?.toLowerCase().includes(term) ?? false;
 
         if (matchesSelf || childMatches.length > 0) {
-          results.push({ ...node, children: childMatches.length > 0 ? childMatches : node.children });
+          results.push({
+            ...node,
+            children: childMatches.length > 0 ? childMatches : node.children,
+          });
         }
       }
 
@@ -337,7 +383,8 @@ export const BookmarkSidebar = ({ visible, thumbnailVisible, documentCacheKey, p
         return null;
       }
 
-      const hasChildren = Array.isArray(node.children) && node.children.length > 0;
+      const hasChildren =
+        Array.isArray(node.children) && node.children.length > 0;
       const isNodeExpanded = expanded[node.id] ?? true;
 
       const pageNumber = resolvePageNumber(node);
@@ -347,20 +394,24 @@ export const BookmarkSidebar = ({ visible, thumbnailVisible, documentCacheKey, p
           key={node.id}
           className="bookmark-item-wrapper"
           style={{
-            marginLeft: depth > 0 ? `${depth * 0.75}rem` : '0',
+            marginLeft: depth > 0 ? `${depth * 0.75}rem` : "0",
           }}
         >
           <div
-            className={`bookmark-item ${pageNumber ? 'bookmark-item--clickable' : ''}`}
+            className={`bookmark-item ${pageNumber ? "bookmark-item--clickable" : ""}`}
             onClick={(event) => handleBookmarkClick(node, event)}
             role={pageNumber ? "button" : undefined}
             tabIndex={pageNumber ? 0 : undefined}
-            onKeyDown={pageNumber ? (event) => {
-              if (event.key === 'Enter' || event.key === ' ') {
-                event.preventDefault();
-                handleBookmarkClick(node, event as any);
-              }
-            } : undefined}
+            onKeyDown={
+              pageNumber
+                ? (event) => {
+                    if (event.key === "Enter" || event.key === " ") {
+                      event.preventDefault();
+                      handleBookmarkClick(node, event as any);
+                    }
+                  }
+                : undefined
+            }
           >
             {hasChildren ? (
               <ActionIcon
@@ -373,7 +424,9 @@ export const BookmarkSidebar = ({ visible, thumbnailVisible, documentCacheKey, p
                 }}
               >
                 <LocalIcon
-                  icon={isNodeExpanded ? 'keyboard-arrow-up' : 'keyboard-arrow-down'}
+                  icon={
+                    isNodeExpanded ? "keyboard-arrow-up" : "keyboard-arrow-down"
+                  }
                   width="1rem"
                   height="1rem"
                 />
@@ -382,12 +435,8 @@ export const BookmarkSidebar = ({ visible, thumbnailVisible, documentCacheKey, p
               <span className="bookmark-item__dash">-</span>
             )}
             <div className="bookmark-item__content">
-              <Text
-                size="sm"
-                fw={500}
-                className="bookmark-item__title"
-              >
-                {node.title || 'Untitled'}
+              <Text size="sm" fw={500} className="bookmark-item__title">
+                {node.title || "Untitled"}
               </Text>
               {pageNumber && (
                 <Text size="xs" c="dimmed" className="bookmark-item__page">
@@ -408,13 +457,14 @@ export const BookmarkSidebar = ({ visible, thumbnailVisible, documentCacheKey, p
 
   const isSearchActive = searchTerm.trim().length > 0;
   const hasBookmarks = bookmarksWithIds.length > 0;
-  const showBookmarkList = bookmarkSupport && documentCacheKey && filteredBookmarks.length > 0;
+  const showBookmarkList =
+    bookmarkSupport && documentCacheKey && filteredBookmarks.length > 0;
   const showEmptyState =
     bookmarkSupport &&
     documentCacheKey &&
     !isLocalLoading &&
     !currentError &&
-    currentStatus === 'success' &&
+    currentStatus === "success" &&
     !hasBookmarks;
   const showSearchEmpty =
     bookmarkSupport &&
@@ -432,7 +482,7 @@ export const BookmarkSidebar = ({ visible, thumbnailVisible, documentCacheKey, p
     <Box
       className="sidebar-base bookmark-sidebar"
       style={{
-        position: 'fixed',
+        position: "fixed",
         right: thumbnailVisible ? SIDEBAR_WIDTH : 0,
         top: 0,
         bottom: 0,
@@ -451,7 +501,7 @@ export const BookmarkSidebar = ({ visible, thumbnailVisible, documentCacheKey, p
         </div>
         {bookmarkSupport && bookmarksWithIds.length > 0 && (
           <>
-            {Object.values(expanded).some(val => val === false) ? (
+            {Object.values(expanded).some((val) => val === false) ? (
               <ActionIcon
                 variant="subtle"
                 size="sm"
@@ -476,12 +526,18 @@ export const BookmarkSidebar = ({ visible, thumbnailVisible, documentCacheKey, p
         )}
       </div>
 
-      <Box px="sm" pb="sm" className="sidebar-base__search bookmark-sidebar__search">
+      <Box
+        px="sm"
+        pb="sm"
+        className="sidebar-base__search bookmark-sidebar__search"
+      >
         <TextInput
           value={searchTerm}
           placeholder="Search bookmarks"
           onChange={(event) => setSearchTerm(event.currentTarget.value)}
-          leftSection={<LocalIcon icon="search" width="1.1rem" height="1.1rem" />}
+          leftSection={
+            <LocalIcon icon="search" width="1.1rem" height="1.1rem" />
+          }
           size="xs"
         />
       </Box>
@@ -516,7 +572,13 @@ export const BookmarkSidebar = ({ visible, thumbnailVisible, documentCacheKey, p
           )}
 
           {bookmarkSupport && documentCacheKey && isLocalLoading && (
-            <Stack gap="md" align="center" c="dimmed" py="xl" className="sidebar-base__loading">
+            <Stack
+              gap="md"
+              align="center"
+              c="dimmed"
+              py="xl"
+              className="sidebar-base__loading"
+            >
               <Loader size="md" type="dots" />
               <Text size="sm" ta="center">
                 Loading bookmarks...
diff --git a/frontend/src/core/components/viewer/CommentsSidebar.tsx b/frontend/src/core/components/viewer/CommentsSidebar.tsx
index b037c8f157..a2c47fecd1 100644
--- a/frontend/src/core/components/viewer/CommentsSidebar.tsx
+++ b/frontend/src/core/components/viewer/CommentsSidebar.tsx
@@ -1,27 +1,50 @@
-import { useMemo, useState, useCallback, useEffect, useRef } from 'react';
-import { Box, ScrollArea, Text, Textarea, Stack, ActionIcon, Group, Tooltip, TextInput, Menu, Modal, Button, UnstyledButton } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import DeleteIcon from '@mui/icons-material/Delete';
-import CheckIcon from '@mui/icons-material/CheckRounded';
-import MoreHorizIcon from '@mui/icons-material/MoreHoriz';
-import EditIcon from '@mui/icons-material/Edit';
-import VisibilityIcon from '@mui/icons-material/Visibility';
-import { useAnnotation } from '@embedpdf/plugin-annotation/react';
-import { getSidebarAnnotationsWithRepliesGroupedByPage } from '@embedpdf/plugin-annotation';
-import { PdfAnnotationSubtype, PdfAnnotationReplyType } from '@embedpdf/models';
-import { useCommentAuthor } from '@app/contexts/CommentAuthorContext';
-import { useViewer } from '@app/contexts/ViewerContext';
-import LocalIcon from '@app/components/shared/LocalIcon';
+import { useMemo, useState, useCallback, useEffect, useRef } from "react";
+import {
+  Box,
+  ScrollArea,
+  Text,
+  Textarea,
+  Stack,
+  ActionIcon,
+  Group,
+  Tooltip,
+  TextInput,
+  Menu,
+  Modal,
+  Button,
+  UnstyledButton,
+} from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import DeleteIcon from "@mui/icons-material/Delete";
+import CheckIcon from "@mui/icons-material/CheckRounded";
+import MoreHorizIcon from "@mui/icons-material/MoreHoriz";
+import EditIcon from "@mui/icons-material/Edit";
+import VisibilityIcon from "@mui/icons-material/Visibility";
+import { useAnnotation } from "@embedpdf/plugin-annotation/react";
+import { getSidebarAnnotationsWithRepliesGroupedByPage } from "@embedpdf/plugin-annotation";
+import { PdfAnnotationSubtype, PdfAnnotationReplyType } from "@embedpdf/models";
+import { useCommentAuthor } from "@app/contexts/CommentAuthorContext";
+import { useViewer } from "@app/contexts/ViewerContext";
+import LocalIcon from "@app/components/shared/LocalIcon";
 
-const SIDEBAR_WIDTH = '18rem';
+const SIDEBAR_WIDTH = "18rem";
 
 /** Format annotation date for display (e.g. "Mar 11, 6:05 PM"). */
 function formatCommentDate(obj: any): string {
-  const raw = obj?.modifiedDate ?? obj?.creationDate ?? obj?.customData?.modifiedDate ?? obj?.M;
-  if (raw == null) return '';
+  const raw =
+    obj?.modifiedDate ??
+    obj?.creationDate ??
+    obj?.customData?.modifiedDate ??
+    obj?.M;
+  if (raw == null) return "";
   const d = raw instanceof Date ? raw : new Date(raw);
-  if (Number.isNaN(d.getTime())) return '';
-  return d.toLocaleString(undefined, { month: 'short', day: 'numeric', hour: 'numeric', minute: '2-digit' });
+  if (Number.isNaN(d.getTime())) return "";
+  return d.toLocaleString(undefined, {
+    month: "short",
+    day: "numeric",
+    hour: "numeric",
+    minute: "2-digit",
+  });
 }
 
 interface CommentsSidebarProps {
@@ -30,80 +53,94 @@ interface CommentsSidebarProps {
   rightOffset: string;
 }
 
-function getCommentDisplayContent(entry: { annotation: { object: any }; replies: Array<{ object: any }> }): string {
+function getCommentDisplayContent(entry: {
+  annotation: { object: any };
+  replies: Array<{ object: any }>;
+}): string {
   const main = entry.annotation?.object?.contents;
   if (main != null && String(main).trim()) return String(main).trim();
   const firstReply = entry.replies?.[0]?.object?.contents;
-  if (firstReply != null && String(firstReply).trim()) return String(firstReply).trim();
-  return '';
+  if (firstReply != null && String(firstReply).trim())
+    return String(firstReply).trim();
+  return "";
 }
 
 /** Placeholder authors we never show; use current user's name from context instead. */
-const PLACEHOLDER_AUTHORS = new Set(['Guest', 'Digital Signature', '']);
+const PLACEHOLDER_AUTHORS = new Set(["Guest", "Digital Signature", ""]);
 
 function getAuthorName(obj: any, currentDisplayName: string): string {
-  const stored = (obj?.author ?? 'Guest').trim() || 'Guest';
-  if (PLACEHOLDER_AUTHORS.has(stored)) return currentDisplayName || 'Guest';
+  const stored = (obj?.author ?? "Guest").trim() || "Guest";
+  if (PLACEHOLDER_AUTHORS.has(stored)) return currentDisplayName || "Guest";
   return stored;
 }
 
 /** Replies store an explicit author; only allow edit when it matches the current comment author name. */
-function isReplyAuthoredByCurrentUser(obj: any, currentDisplayName: string): boolean {
-  const stored = (obj?.author ?? '').trim() || 'Guest';
+function isReplyAuthoredByCurrentUser(
+  obj: any,
+  currentDisplayName: string,
+): boolean {
+  const stored = (obj?.author ?? "").trim() || "Guest";
   // Resolve current user the same way getAuthorName does
-  const resolvedMine = PLACEHOLDER_AUTHORS.has((currentDisplayName ?? '').trim())
-    ? 'Guest'
-    : (currentDisplayName ?? '').trim();
-  const resolvedStored = PLACEHOLDER_AUTHORS.has(stored) ? 'Guest' : stored;
+  const resolvedMine = PLACEHOLDER_AUTHORS.has(
+    (currentDisplayName ?? "").trim(),
+  )
+    ? "Guest"
+    : (currentDisplayName ?? "").trim();
+  const resolvedStored = PLACEHOLDER_AUTHORS.has(stored) ? "Guest" : stored;
   // Both are guest/anonymous → same unauthenticated user, allow editing
-  if (resolvedStored === 'Guest' && resolvedMine === 'Guest') return true;
+  if (resolvedStored === "Guest" && resolvedMine === "Guest") return true;
   if (!resolvedMine) return false;
   return resolvedStored === resolvedMine;
 }
 
 // Map toolId → LocalIcon icon name (matches AnnotationPanel icon definitions)
 const TOOL_ICON_MAP: Record<string, string> = {
-  highlight: 'highlight',
-  underline: 'format-underlined',
-  strikeout: 'strikethrough-s',
-  squiggly: 'show-chart',
-  ink: 'edit',
-  inkHighlighter: 'brush',
-  square: 'crop-square',
-  circle: 'radio-button-unchecked',
-  line: 'show-chart',
-  lineArrow: 'show-chart',
-  polyline: 'show-chart',
-  polygon: 'change-history',
-  text: 'text-fields',
-  note: 'sticky-note-2',
-  stamp: 'add-photo-alternate',
-  textComment: 'comment',
-  insertText: 'add-comment',
-  replaceText: 'find-replace',
+  highlight: "highlight",
+  underline: "format-underlined",
+  strikeout: "strikethrough-s",
+  squiggly: "show-chart",
+  ink: "edit",
+  inkHighlighter: "brush",
+  square: "crop-square",
+  circle: "radio-button-unchecked",
+  line: "show-chart",
+  lineArrow: "show-chart",
+  polyline: "show-chart",
+  polygon: "change-history",
+  text: "text-fields",
+  note: "sticky-note-2",
+  stamp: "add-photo-alternate",
+  textComment: "comment",
+  insertText: "add-comment",
+  replaceText: "find-replace",
 };
 
 // Type-based fallback icon when no toolId is present
 function getIconByType(type: number | undefined): string {
-  if (type === 1) return 'comment';
-  if (type === 3) return 'sticky-note-2';
-  if (type === 4 || type === 8) return 'show-chart';
-  if (type === 5) return 'crop-square';
-  if (type === 6) return 'radio-button-unchecked';
-  if (type === 7 || type === 8) return 'change-history';
-  if (type === 9) return 'highlight';
-  if (type === 10) return 'format-underlined';
-  if (type === 11) return 'show-chart';
-  if (type === 12) return 'strikethrough-s';
-  if (type === 13) return 'add-photo-alternate';
-  if (type === 14) return 'add-comment';
-  if (type === 15) return 'edit';
-  return 'comment';
+  if (type === 1) return "comment";
+  if (type === 3) return "sticky-note-2";
+  if (type === 4 || type === 8) return "show-chart";
+  if (type === 5) return "crop-square";
+  if (type === 6) return "radio-button-unchecked";
+  if (type === 7 || type === 8) return "change-history";
+  if (type === 9) return "highlight";
+  if (type === 10) return "format-underlined";
+  if (type === 11) return "show-chart";
+  if (type === 12) return "strikethrough-s";
+  if (type === 13) return "add-photo-alternate";
+  if (type === 14) return "add-comment";
+  if (type === 15) return "edit";
+  return "comment";
 }
 
 function isCommentAnnotation(ann: any): boolean {
   const toolId = ann?.customData?.toolId ?? ann?.customData?.annotationToolId;
-  if (toolId === 'textComment' || toolId === 'insertText' || toolId === 'replaceText') return true;
+  if (
+    toolId === "textComment" ||
+    toolId === "insertText" ||
+    toolId === "replaceText"
+  )
+    return true;
   // Any annotation explicitly added to comments via the "Add comment" button
   if (ann?.customData?.isComment === true) return true;
   // CARET (type 14) = insertText/replaceText; TEXT (type 1) = textComment
@@ -112,37 +149,40 @@ function isCommentAnnotation(ann: any): boolean {
 }
 
 function getAnnotationToolId(ann: any): string {
-  return ann?.customData?.toolId ?? ann?.customData?.annotationToolId ?? '';
+  return ann?.customData?.toolId ?? ann?.customData?.annotationToolId ?? "";
 }
 
-function getAnnotationTypeLabel(ann: any, t: (key: string, fallback: string) => string): string {
+function getAnnotationTypeLabel(
+  ann: any,
+  t: (key: string, fallback: string) => string,
+): string {
   const toolId = getAnnotationToolId(ann);
   const labels: Record<string, string> = {
-    highlight: t('annotation.highlight', 'Highlight'),
-    underline: t('annotation.underline', 'Underline'),
-    strikeout: t('annotation.strikeout', 'Strikeout'),
-    squiggly: t('annotation.squiggly', 'Squiggly'),
-    ink: t('annotation.pen', 'Pen'),
-    inkHighlighter: t('annotation.freehandHighlighter', 'Freehand Highlighter'),
-    square: t('annotation.square', 'Square'),
-    circle: t('annotation.circle', 'Circle'),
-    line: t('annotation.line', 'Line'),
-    lineArrow: t('annotation.lineArrow', 'Arrow'),
-    polyline: t('annotation.polyline', 'Polyline'),
-    polygon: t('annotation.polygon', 'Polygon'),
-    text: t('annotation.text', 'Text box'),
-    note: t('annotation.note', 'Note'),
-    stamp: t('annotation.stamp', 'Stamp'),
-    textComment: t('viewer.comments.typeComment', 'Comment'),
-    insertText: t('viewer.comments.typeInsertText', 'Insert Text'),
-    replaceText: t('viewer.comments.typeReplaceText', 'Replace Text'),
+    highlight: t("annotation.highlight", "Highlight"),
+    underline: t("annotation.underline", "Underline"),
+    strikeout: t("annotation.strikeout", "Strikeout"),
+    squiggly: t("annotation.squiggly", "Squiggly"),
+    ink: t("annotation.pen", "Pen"),
+    inkHighlighter: t("annotation.freehandHighlighter", "Freehand Highlighter"),
+    square: t("annotation.square", "Square"),
+    circle: t("annotation.circle", "Circle"),
+    line: t("annotation.line", "Line"),
+    lineArrow: t("annotation.lineArrow", "Arrow"),
+    polyline: t("annotation.polyline", "Polyline"),
+    polygon: t("annotation.polygon", "Polygon"),
+    text: t("annotation.text", "Text box"),
+    note: t("annotation.note", "Note"),
+    stamp: t("annotation.stamp", "Stamp"),
+    textComment: t("viewer.comments.typeComment", "Comment"),
+    insertText: t("viewer.comments.typeInsertText", "Insert Text"),
+    replaceText: t("viewer.comments.typeReplaceText", "Replace Text"),
   };
   if (labels[toolId]) return labels[toolId];
   // Type-based fallback (mirrors getIconByType) for annotations without customData.toolId
   const type = ann?.type;
-  if (type === 14) return t('viewer.comments.typeInsertText', 'Insert Text');
-  if (type === 1) return t('viewer.comments.typeComment', 'Comment');
-  return t('viewer.comments.typeComment', 'Comment');
+  if (type === 14) return t("viewer.comments.typeInsertText", "Insert Text");
+  if (type === 1) return t("viewer.comments.typeComment", "Comment");
+  return t("viewer.comments.typeComment", "Comment");
 }
 
 function AnnotationTypeIcon({ ann }: { ann: any }) {
@@ -153,21 +193,34 @@ function AnnotationTypeIcon({ ann }: { ann: any }) {
       icon={iconName}
       width="1.25rem"
       height="1.25rem"
-      style={{ flexShrink: 0, color: 'var(--mantine-color-blue-5)' }}
+      style={{ flexShrink: 0, color: "var(--mantine-color-blue-5)" }}
     />
   );
 }
 
-export function CommentsSidebar({ documentId, visible, rightOffset }: CommentsSidebarProps) {
+export function CommentsSidebar({
+  documentId,
+  visible,
+  rightOffset,
+}: CommentsSidebarProps) {
   const { t } = useTranslation();
   const { displayName } = useCommentAuthor();
-  const { highlightCommentRequest, clearHighlightCommentRequest, scrollActions, getZoomState } = useViewer() ?? {};
+  const {
+    highlightCommentRequest,
+    clearHighlightCommentRequest,
+    scrollActions,
+    getZoomState,
+  } = useViewer() ?? {};
   const scrollViewportRef = useRef<HTMLDivElement | null>(null);
   const { state, provides } = useAnnotation(documentId);
-  const [draftContents, setDraftContents] = useState<Record<string, string>>({});
+  const [draftContents, setDraftContents] = useState<Record<string, string>>(
+    {},
+  );
   const [replyDrafts, setReplyDrafts] = useState<Record<string, string>>({});
   /** Draft text while editing an existing reply (`${pageIndex}_${parentId}_${replyId}`). */
-  const [replyEditDrafts, setReplyEditDrafts] = useState<Record<string, string>>({});
+  const [replyEditDrafts, setReplyEditDrafts] = useState<
+    Record<string, string>
+  >({});
   /** When set, this card's main comment is in edit mode (show textarea for main comment). */
   const [editingMainKey, setEditingMainKey] = useState<string | null>(null);
   /** Which reply is in edit mode (same key shape as replyEditDrafts). */
@@ -175,47 +228,67 @@ export function CommentsSidebar({ documentId, visible, rightOffset }: CommentsSi
 
   // React to request to focus or highlight a comment card (e.g. from "Add comment" / "View comment" in selection menu)
   useEffect(() => {
-    if (!visible || !highlightCommentRequest || highlightCommentRequest.documentId !== documentId) return;
+    if (
+      !visible ||
+      !highlightCommentRequest ||
+      highlightCommentRequest.documentId !== documentId
+    )
+      return;
     const { pageIndex, annotationId, action } = highlightCommentRequest;
     const cardKey = `${pageIndex}_${annotationId}`;
     const root = scrollViewportRef.current;
     if (!root) return;
-    const card = root.querySelector<HTMLElement>(`[data-comment-card="${cardKey}"]`);
+    const card = root.querySelector<HTMLElement>(
+      `[data-comment-card="${cardKey}"]`,
+    );
     if (!card) {
       clearHighlightCommentRequest?.();
       return;
     }
-    card.scrollIntoView({ behavior: 'smooth', block: 'center' });
-    if (action === 'highlight') {
-      card.classList.remove('comment-card-flash-highlight');
+    card.scrollIntoView({ behavior: "smooth", block: "center" });
+    if (action === "highlight") {
+      card.classList.remove("comment-card-flash-highlight");
       void card.offsetWidth;
-      card.classList.add('comment-card-flash-highlight');
+      card.classList.add("comment-card-flash-highlight");
       const tId = window.setTimeout(() => {
-        card.classList.remove('comment-card-flash-highlight');
+        card.classList.remove("comment-card-flash-highlight");
         clearHighlightCommentRequest?.();
       }, 1500);
       return () => window.clearTimeout(tId);
     }
     // action === 'focus': focus the first textarea or reply input in the card
-    const input = card.querySelector<HTMLTextAreaElement | HTMLInputElement>('textarea, input');
+    const input = card.querySelector<HTMLTextAreaElement | HTMLInputElement>(
+      "textarea, input",
+    );
     if (input) {
       requestAnimationFrame(() => {
         input.focus();
       });
     }
     clearHighlightCommentRequest?.();
-  }, [visible, highlightCommentRequest, documentId, clearHighlightCommentRequest]);
+  }, [
+    visible,
+    highlightCommentRequest,
+    documentId,
+    clearHighlightCommentRequest,
+  ]);
 
-  const handleLocateAnnotation = useCallback((pageIndex: number, ann: any) => {
-    scrollActions?.scrollToPage(pageIndex + 1, 'smooth');
-    setTimeout(() => {
-      const pageEl = document.querySelector<HTMLElement>(`[data-page-index="${pageIndex}"]`);
-      if (!pageEl || !ann?.rect) return;
-      const zoom = getZoomState?.()?.currentZoom ?? 1;
-      const { origin, size } = ann.rect as { origin: { x: number; y: number }; size: { width: number; height: number } };
-      const flashEl = document.createElement('div');
-      // Append to page element so it scrolls with the page (position: absolute relative to page)
-      flashEl.style.cssText = `
+  const handleLocateAnnotation = useCallback(
+    (pageIndex: number, ann: any) => {
+      scrollActions?.scrollToPage(pageIndex + 1, "smooth");
+      setTimeout(() => {
+        const pageEl = document.querySelector<HTMLElement>(
+          `[data-page-index="${pageIndex}"]`,
+        );
+        if (!pageEl || !ann?.rect) return;
+        const zoom = getZoomState?.()?.currentZoom ?? 1;
+        const { origin, size } = ann.rect as {
+          origin: { x: number; y: number };
+          size: { width: number; height: number };
+        };
+        const flashEl = document.createElement("div");
+        // Append to page element so it scrolls with the page (position: absolute relative to page)
+        flashEl.style.cssText = `
         position: absolute;
         left: ${origin.x * zoom}px;
         top: ${origin.y * zoom}px;
@@ -228,29 +301,31 @@ export function CommentsSidebar({ documentId, visible, rightOffset }: CommentsSi
         z-index: 9998;
         animation: annotation-locate-flash 1.6s ease-out forwards;
       `;
-      if (!document.getElementById('annotation-locate-flash-style')) {
-        const style = document.createElement('style');
-        style.id = 'annotation-locate-flash-style';
-        style.textContent = `@keyframes annotation-locate-flash {
+        if (!document.getElementById("annotation-locate-flash-style")) {
+          const style = document.createElement("style");
+          style.id = "annotation-locate-flash-style";
+          style.textContent = `@keyframes annotation-locate-flash {
           0%   { opacity: 0; transform: scale(1.08); }
           15%  { opacity: 1; transform: scale(1); }
           70%  { opacity: 1; }
           100% { opacity: 0; }
         }`;
-        document.head.appendChild(style);
-      }
-      pageEl.appendChild(flashEl);
-      setTimeout(() => flashEl.remove(), 1700);
-    }, 550);
-  }, [scrollActions, getZoomState]);
+          document.head.appendChild(style);
+        }
+        pageEl.appendChild(flashEl);
+        setTimeout(() => flashEl.remove(), 1700);
+      }, 550);
+    },
+    [scrollActions, getZoomState],
+  );
 
   const byPage = useMemo(() => {
     try {
       const all = getSidebarAnnotationsWithRepliesGroupedByPage(state) ?? {};
       const filtered: typeof all = {};
       for (const [page, entries] of Object.entries(all)) {
-        const commentEntries = (entries as typeof entries).filter(
-          (e) => isCommentAnnotation((e as any).annotation?.object)
+        const commentEntries = (entries as typeof entries).filter((e) =>
+          isCommentAnnotation((e as any).annotation?.object),
         );
         if (commentEntries.length > 0) {
           filtered[Number(page)] = commentEntries;
@@ -277,24 +352,44 @@ export function CommentsSidebar({ documentId, visible, rightOffset }: CommentsSi
     return ids;
   }, [state]);
 
-  const pageNumbers = useMemo(() => Object.keys(byPage).map(Number).sort((a, b) => a - b), [byPage]);
-  const totalCount = useMemo(() => pageNumbers.reduce((sum, p) => sum + (byPage[p]?.length ?? 0), 0), [pageNumbers, byPage]);
+  const pageNumbers = useMemo(
+    () =>
+      Object.keys(byPage)
+        .map(Number)
+        .sort((a, b) => a - b),
+    [byPage],
+  );
+  const totalCount = useMemo(
+    () => pageNumbers.reduce((sum, p) => sum + (byPage[p]?.length ?? 0), 0),
+    [pageNumbers, byPage],
+  );
 
   const handleContentsChange = useCallback(
     (pageIndex: number, annotationId: string, value: string) => {
-      setDraftContents((prev) => ({ ...prev, [pageIndex + '_' + annotationId]: value }));
+      setDraftContents((prev) => ({
+        ...prev,
+        [pageIndex + "_" + annotationId]: value,
+      }));
       if (!provides?.updateAnnotation) return;
       provides.updateAnnotation(pageIndex, annotationId, { contents: value });
     },
-    [provides]
+    [provides],
   );
 
-  const [deleteModal, setDeleteModal] = useState<{ pageIndex: number; id: string; ann: any } | null>(null);
+  const [deleteModal, setDeleteModal] = useState<{
+    pageIndex: number;
+    id: string;
+    ann: any;
+  } | null>(null);
 
   const isLinkedAnnotation = (ann: any) => {
     const toolId = ann?.customData?.toolId ?? ann?.customData?.annotationToolId;
-    return ann?.customData?.isComment === true &&
-      toolId !== 'textComment' && toolId !== 'insertText' && toolId !== 'replaceText';
+    return (
+      ann?.customData?.isComment === true &&
+      toolId !== "textComment" &&
+      toolId !== "insertText" &&
+      toolId !== "replaceText"
+    );
   };
 
   const handleDeleteClick = useCallback(
@@ -305,7 +400,7 @@ export function CommentsSidebar({ documentId, visible, rightOffset }: CommentsSi
         provides?.deleteAnnotation?.(pageIndex, annotationId);
       }
     },
-    [provides]
+    [provides],
   );
 
   const handleRemoveFromSidebar = useCallback(() => {
@@ -327,10 +422,16 @@ export function CommentsSidebar({ documentId, visible, rightOffset }: CommentsSi
     (pageIndex: number, annotationId: string, value: string) => {
       const trimmed = value.trim();
       if (!trimmed || !provides?.updateAnnotation) return;
-      provides.updateAnnotation(pageIndex, annotationId, { contents: trimmed, author: displayName });
-      setDraftContents((prev) => ({ ...prev, [pageIndex + '_' + annotationId]: trimmed }));
+      provides.updateAnnotation(pageIndex, annotationId, {
+        contents: trimmed,
+        author: displayName,
+      });
+      setDraftContents((prev) => ({
+        ...prev,
+        [pageIndex + "_" + annotationId]: trimmed,
+      }));
     },
-    [provides, displayName]
+    [provides, displayName],
   );
 
   const handleSendReply = useCallback(
@@ -338,7 +439,10 @@ export function CommentsSidebar({ documentId, visible, rightOffset }: CommentsSi
       const key = `${pageIndex}_${parentId}_reply`;
       const text = replyDrafts[key]?.trim();
       if (!text || !provides?.createAnnotation) return;
-      const rect = parentRect ?? { origin: { x: 0, y: 0 }, size: { width: 1, height: 1 } };
+      const rect = parentRect ?? {
+        origin: { x: 0, y: 0 },
+        size: { width: 1, height: 1 },
+      };
       provides.createAnnotation(pageIndex, {
         type: PdfAnnotationSubtype.TEXT,
         id: `reply-${Date.now()}-${Math.random().toString(36).slice(2, 9)}`,
@@ -349,16 +453,19 @@ export function CommentsSidebar({ documentId, visible, rightOffset }: CommentsSi
         replyType: PdfAnnotationReplyType.Reply,
         author: displayName,
       } as any);
-      setReplyDrafts((prev) => ({ ...prev, [key]: '' }));
+      setReplyDrafts((prev) => ({ ...prev, [key]: "" }));
     },
-    [provides, replyDrafts, displayName]
+    [provides, replyDrafts, displayName],
   );
 
   const handleSaveReplyEdit = useCallback(
     (editKey: string, pageIndex: number, replyId: string, value: string) => {
       const trimmed = value.trim();
       if (!trimmed || !provides?.updateAnnotation) return;
-      provides.updateAnnotation(pageIndex, replyId, { contents: trimmed, author: displayName });
+      provides.updateAnnotation(pageIndex, replyId, {
+        contents: trimmed,
+        author: displayName,
+      });
       setReplyEditDrafts((prev) => {
         const next = { ...prev };
         delete next[editKey];
@@ -366,7 +473,7 @@ export function CommentsSidebar({ documentId, visible, rightOffset }: CommentsSi
       });
       setEditingReplyKey(null);
     },
-    [provides, displayName]
+    [provides, displayName],
   );
 
   if (!visible) return null;
@@ -375,38 +482,46 @@ export function CommentsSidebar({ documentId, visible, rightOffset }: CommentsSi
     <Box
       ref={scrollViewportRef}
       style={{
-        position: 'fixed',
+        position: "fixed",
         right: rightOffset,
         top: 0,
         bottom: 0,
         width: SIDEBAR_WIDTH,
-        backgroundColor: 'var(--right-rail-bg)',
-        borderLeft: '1px solid var(--border-subtle)',
+        backgroundColor: "var(--right-rail-bg)",
+        borderLeft: "1px solid var(--border-subtle)",
         zIndex: 998,
-        display: 'flex',
-        flexDirection: 'column',
-        boxShadow: '-2px 0 8px rgba(0, 0, 0, 0.1)',
+        display: "flex",
+        flexDirection: "column",
+        boxShadow: "-2px 0 8px rgba(0, 0, 0, 0.1)",
       }}
     >
       <div
         style={{
-          padding: '0.75rem 1rem',
-          borderBottom: '1px solid var(--border-subtle)',
-          display: 'flex',
-          alignItems: 'center',
-          gap: '0.5rem',
+          padding: "0.75rem 1rem",
+          borderBottom: "1px solid var(--border-subtle)",
+          display: "flex",
+          alignItems: "center",
+          gap: "0.5rem",
         }}
       >
-        <LocalIcon icon="comment" width="1.25rem" height="1.25rem" style={{ color: 'var(--mantine-color-dimmed)', flexShrink: 0 }} />
+        <LocalIcon
+          icon="comment"
+          width="1.25rem"
+          height="1.25rem"
+          style={{ color: "var(--mantine-color-dimmed)", flexShrink: 0 }}
+        />
         <Text fw={600} size="sm" tt="uppercase" lts={0.5}>
-          {t('viewer.comments.title', 'Comments')}
+          {t("viewer.comments.title", "Comments")}
         </Text>
       </div>
       <ScrollArea style={{ flex: 1 }}>
         <Stack p="sm" gap="md">
           {totalCount === 0 ? (
             <Text size="sm" c="dimmed">
-              {t('viewer.comments.hint', 'Place comments with the Comment, Insert Text, or Replace Text tools. They will appear here by page.')}
+              {t(
+                "viewer.comments.hint",
+                "Place comments with the Comment, Insert Text, or Replace Text tools. They will appear here by page.",
+              )}
             </Text>
           ) : (
             pageNumbers.map((pageIndex) => {
@@ -415,17 +530,21 @@ export function CommentsSidebar({ documentId, visible, rightOffset }: CommentsSi
               return (
                 <Box key={pageIndex} mb="md">
                   <Text size="sm" fw={700} mb={2}>
-                    {t('viewer.comments.pageLabel', 'Page {{page}}', { page: pageNum })}
+                    {t("viewer.comments.pageLabel", "Page {{page}}", {
+                      page: pageNum,
+                    })}
                   </Text>
                   <Text size="xs" c="dimmed" mb="sm">
                     {entries.length === 1
-                      ? t('viewer.comments.oneComment', '1 comment')
-                      : t('viewer.comments.nComments', '{{count}} comments', { count: entries.length })}
+                      ? t("viewer.comments.oneComment", "1 comment")
+                      : t("viewer.comments.nComments", "{{count}} comments", {
+                          count: entries.length,
+                        })}
                   </Text>
                   <Box
                     mb="xs"
                     style={{
-                      borderBottom: '1px solid var(--border-subtle)',
+                      borderBottom: "1px solid var(--border-subtle)",
                     }}
                   />
                   <Stack gap="sm">
@@ -436,11 +555,15 @@ export function CommentsSidebar({ documentId, visible, rightOffset }: CommentsSi
                       const key = `${pageIndex}_${id}`;
                       const replyKey = `${pageIndex}_${id}_reply`;
                       const displayContent = getCommentDisplayContent(entry);
-                      const draft = draftContents[key] !== undefined ? draftContents[key] : displayContent;
-                      const replyDraft = replyDrafts[replyKey] ?? '';
+                      const draft =
+                        draftContents[key] !== undefined
+                          ? draftContents[key]
+                          : displayContent;
+                      const replyDraft = replyDrafts[replyKey] ?? "";
                       const authorName = getAuthorName(ann, displayName);
                       /** Only treat as "comment posted" when annotation actually has content (user clicked Send), not on every keystroke. */
-                      const hasMainContent = (displayContent ?? '').trim().length > 0;
+                      const hasMainContent =
+                        (displayContent ?? "").trim().length > 0;
                       const isEditingMain = editingMainKey === key;
 
                       const mainTimestamp = formatCommentDate(ann);
@@ -453,58 +576,95 @@ export function CommentsSidebar({ documentId, visible, rightOffset }: CommentsSi
                           p="sm"
                           style={{
                             border: selectedAnnotationIds.has(id)
-                              ? '1px solid var(--mantine-color-blue-3)'
-                              : '1px solid var(--border-subtle)',
+                              ? "1px solid var(--mantine-color-blue-3)"
+                              : "1px solid var(--border-subtle)",
                             borderRadius: 8,
-                            backgroundColor: 'var(--bg-raised)',
+                            backgroundColor: "var(--bg-raised)",
                           }}
                         >
-                          <Group wrap="nowrap" gap="xs" justify="space-between" align="flex-start" mb="xs">
-                            <Group wrap="nowrap" gap="xs" style={{ minWidth: 0, flex: 1 }}>
+                          <Group
+                            wrap="nowrap"
+                            gap="xs"
+                            justify="space-between"
+                            align="flex-start"
+                            mb="xs"
+                          >
+                            <Group
+                              wrap="nowrap"
+                              gap="xs"
+                              style={{ minWidth: 0, flex: 1 }}
+                            >
                               <AnnotationTypeIcon ann={ann} />
                               <Box style={{ minWidth: 0 }}>
                                 <Text size="sm" fw={600}>
                                   {authorName}
                                 </Text>
                                 <Text size="xs" c="dimmed">
-                                  {typeLabel}{mainTimestamp ? ` · ${mainTimestamp}` : ''}
+                                  {typeLabel}
+                                  {mainTimestamp ? ` · ${mainTimestamp}` : ""}
                                 </Text>
                               </Box>
                             </Group>
-                            <Group gap={2} wrap="nowrap" style={{ flexShrink: 0 }}>
-                              <Tooltip label={t('viewer.comments.locateAnnotation', 'Locate in document')}>
+                            <Group
+                              gap={2}
+                              wrap="nowrap"
+                              style={{ flexShrink: 0 }}
+                            >
+                              <Tooltip
+                                label={t(
+                                  "viewer.comments.locateAnnotation",
+                                  "Locate in document",
+                                )}
+                              >
                                 <ActionIcon
                                   variant="subtle"
                                   size="sm"
                                   color="gray"
-                                  onClick={() => handleLocateAnnotation(pageIndex, ann)}
+                                  onClick={() =>
+                                    handleLocateAnnotation(pageIndex, ann)
+                                  }
                                 >
                                   <VisibilityIcon style={{ fontSize: 16 }} />
                                 </ActionIcon>
                               </Tooltip>
                               <Menu position="bottom-end" withArrow>
-                              <Menu.Target>
-                                <Tooltip label={t('viewer.comments.moreActions', 'More actions')}>
-                                  <ActionIcon variant="subtle" size="sm" color="gray">
-                                    <MoreHorizIcon style={{ fontSize: 20 }} />
-                                  </ActionIcon>
-                                </Tooltip>
-                              </Menu.Target>
-                              <Menu.Dropdown>
-                                <Menu.Item
-                                  leftSection={<EditIcon style={{ fontSize: 18 }} />}
-                                  onClick={() => setEditingMainKey(key)}
-                                >
-                                  {t('annotation.editText', 'Edit')}
-                                </Menu.Item>
-                                <Menu.Item
-                                  leftSection={<DeleteIcon style={{ fontSize: 18 }} />}
-                                  color="red"
-                                  onClick={() => handleDeleteClick(pageIndex, id, ann)}
-                                >
-                                  {t('annotation.delete', 'Delete')}
-                                </Menu.Item>
-                              </Menu.Dropdown>
+                                <Menu.Target>
+                                  <Tooltip
+                                    label={t(
+                                      "viewer.comments.moreActions",
+                                      "More actions",
+                                    )}
+                                  >
+                                    <ActionIcon
+                                      variant="subtle"
+                                      size="sm"
+                                      color="gray"
+                                    >
+                                      <MoreHorizIcon style={{ fontSize: 20 }} />
+                                    </ActionIcon>
+                                  </Tooltip>
+                                </Menu.Target>
+                                <Menu.Dropdown>
+                                  <Menu.Item
+                                    leftSection={
+                                      <EditIcon style={{ fontSize: 18 }} />
+                                    }
+                                    onClick={() => setEditingMainKey(key)}
+                                  >
+                                    {t("annotation.editText", "Edit")}
+                                  </Menu.Item>
+                                  <Menu.Item
+                                    leftSection={
+                                      <DeleteIcon style={{ fontSize: 18 }} />
+                                    }
+                                    color="red"
+                                    onClick={() =>
+                                      handleDeleteClick(pageIndex, id, ann)
+                                    }
+                                  >
+                                    {t("annotation.delete", "Delete")}
+                                  </Menu.Item>
+                                </Menu.Dropdown>
                               </Menu>
                             </Group>
                           </Group>
@@ -512,40 +672,63 @@ export function CommentsSidebar({ documentId, visible, rightOffset }: CommentsSi
                           {!hasMainContent || isEditingMain ? (
                             <>
                               <Textarea
-                                placeholder={t('viewer.comments.addCommentPlaceholder', 'Add comment...')}
+                                placeholder={t(
+                                  "viewer.comments.addCommentPlaceholder",
+                                  "Add comment...",
+                                )}
                                 minRows={2}
                                 autosize
-                                value={draft ?? ''}
+                                value={draft ?? ""}
                                 onChange={(e) => {
-                                  const v = (e?.currentTarget ?? e?.target)?.value ?? '';
-                                  setDraftContents((prev) => ({ ...prev, [key]: v }));
+                                  const v =
+                                    (e?.currentTarget ?? e?.target)?.value ??
+                                    "";
+                                  setDraftContents((prev) => ({
+                                    ...prev,
+                                    [key]: v,
+                                  }));
                                   if (isEditingMain) {
                                     handleContentsChange(pageIndex, id, v);
                                   }
                                 }}
-                                styles={{ root: { width: '100%' } }}
+                                styles={{ root: { width: "100%" } }}
                                 mb="xs"
                               />
                               <Group gap={4} wrap="nowrap" justify="flex-end">
-                                <Tooltip label={t('viewer.comments.addComment', 'Add comment')}>
+                                <Tooltip
+                                  label={t(
+                                    "viewer.comments.addComment",
+                                    "Add comment",
+                                  )}
+                                >
                                   <ActionIcon
                                     variant="filled"
                                     size="sm"
                                     color="blue"
                                     onClick={() => {
-                                      handleSendMainComment(pageIndex, id, draft ?? '');
+                                      handleSendMainComment(
+                                        pageIndex,
+                                        id,
+                                        draft ?? "",
+                                      );
                                       setEditingMainKey(null);
                                     }}
-                                    disabled={!(draft ?? '').trim()}
+                                    disabled={!(draft ?? "").trim()}
                                   >
-                                    <CheckIcon style={{ fontSize: 18, color: 'white' }} />
+                                    <CheckIcon
+                                      style={{ fontSize: 18, color: "white" }}
+                                    />
                                   </ActionIcon>
                                 </Tooltip>
                               </Group>
                             </>
                           ) : (
                             <>
-                              <Text size="sm" mb="sm" style={{ whiteSpace: 'pre-wrap' }}>
+                              <Text
+                                size="sm"
+                                mb="sm"
+                                style={{ whiteSpace: "pre-wrap" }}
+                              >
                                 {displayContent}
                               </Text>
 
@@ -555,35 +738,69 @@ export function CommentsSidebar({ documentId, visible, rightOffset }: CommentsSi
                                     const rObj = r?.object;
                                     const rId = rObj?.id;
                                     if (!rId) return null;
-                                    const rAuthor = getAuthorName(rObj, displayName);
+                                    const rAuthor = getAuthorName(
+                                      rObj,
+                                      displayName,
+                                    );
                                     const rTimestamp = formatCommentDate(rObj);
                                     const replyEditKey = `${pageIndex}_${id}_${rId}`;
-                                    const isEditingReply = editingReplyKey === replyEditKey;
-                                    const canEditReply = isReplyAuthoredByCurrentUser(rObj, displayName);
+                                    const isEditingReply =
+                                      editingReplyKey === replyEditKey;
+                                    const canEditReply =
+                                      isReplyAuthoredByCurrentUser(
+                                        rObj,
+                                        displayName,
+                                      );
                                     const replyBody =
-                                      replyEditDrafts[replyEditKey] !== undefined
+                                      replyEditDrafts[replyEditKey] !==
+                                      undefined
                                         ? replyEditDrafts[replyEditKey]
-                                        : (rObj?.contents ?? '');
+                                        : (rObj?.contents ?? "");
                                     return (
-                                      <Box key={rId} pl="xs" style={{ borderLeft: '2px solid var(--mantine-color-blue-3)' }}>
+                                      <Box
+                                        key={rId}
+                                        pl="xs"
+                                        style={{
+                                          borderLeft:
+                                            "2px solid var(--mantine-color-blue-3)",
+                                        }}
+                                      >
                                         <Box style={{ minWidth: 0 }}>
-                                          <Group wrap="nowrap" justify="space-between" align="flex-start" gap={4} mb={2}>
+                                          <Group
+                                            wrap="nowrap"
+                                            justify="space-between"
+                                            align="flex-start"
+                                            gap={4}
+                                            mb={2}
+                                          >
                                             <Text size="sm" fw={600}>
                                               {rAuthor}
                                             </Text>
-                                            <Group wrap="nowrap" gap="xs" align="center">
-                                              {canEditReply && !isEditingReply ? (
+                                            <Group
+                                              wrap="nowrap"
+                                              gap="xs"
+                                              align="center"
+                                            >
+                                              {canEditReply &&
+                                              !isEditingReply ? (
                                                 <UnstyledButton
                                                   type="button"
                                                   onClick={() => {
-                                                    setEditingReplyKey(replyEditKey);
+                                                    setEditingReplyKey(
+                                                      replyEditKey,
+                                                    );
                                                     setReplyEditDrafts(() => ({
-                                                      [replyEditKey]: String(rObj?.contents ?? ''),
+                                                      [replyEditKey]: String(
+                                                        rObj?.contents ?? "",
+                                                      ),
                                                     }));
                                                   }}
                                                 >
                                                   <Text size="xs" c="blue">
-                                                    {t('annotation.editText', 'Edit')}
+                                                    {t(
+                                                      "annotation.editText",
+                                                      "Edit",
+                                                    )}
                                                   </Text>
                                                 </UnstyledButton>
                                               ) : null}
@@ -601,31 +818,62 @@ export function CommentsSidebar({ documentId, visible, rightOffset }: CommentsSi
                                                 autosize
                                                 value={replyBody}
                                                 onChange={(e) => {
-                                                  const v = (e?.currentTarget ?? e?.target)?.value ?? '';
-                                                  setReplyEditDrafts((p) => ({ ...p, [replyEditKey]: v }));
+                                                  const v =
+                                                    (
+                                                      e?.currentTarget ??
+                                                      e?.target
+                                                    )?.value ?? "";
+                                                  setReplyEditDrafts((p) => ({
+                                                    ...p,
+                                                    [replyEditKey]: v,
+                                                  }));
+                                                }}
+                                                styles={{
+                                                  root: { width: "100%" },
                                                 }}
-                                                styles={{ root: { width: '100%' } }}
                                                 mb="xs"
                                               />
-                                              <Group gap={4} wrap="nowrap" justify="flex-end">
-                                                <Tooltip label={t('viewer.comments.saveReply', 'Save reply')}>
+                                              <Group
+                                                gap={4}
+                                                wrap="nowrap"
+                                                justify="flex-end"
+                                              >
+                                                <Tooltip
+                                                  label={t(
+                                                    "viewer.comments.saveReply",
+                                                    "Save reply",
+                                                  )}
+                                                >
                                                   <ActionIcon
                                                     variant="filled"
                                                     size="sm"
                                                     color="blue"
                                                     onClick={() =>
-                                                      handleSaveReplyEdit(replyEditKey, pageIndex, rId, replyBody)
+                                                      handleSaveReplyEdit(
+                                                        replyEditKey,
+                                                        pageIndex,
+                                                        rId,
+                                                        replyBody,
+                                                      )
                                                     }
                                                     disabled={!replyBody.trim()}
                                                   >
-                                                    <CheckIcon style={{ fontSize: 18, color: 'white' }} />
+                                                    <CheckIcon
+                                                      style={{
+                                                        fontSize: 18,
+                                                        color: "white",
+                                                      }}
+                                                    />
                                                   </ActionIcon>
                                                 </Tooltip>
                                               </Group>
                                             </>
                                           ) : (
-                                            <Text size="sm" style={{ whiteSpace: 'pre-wrap' }}>
-                                              {rObj?.contents ?? ''}
+                                            <Text
+                                              size="sm"
+                                              style={{ whiteSpace: "pre-wrap" }}
+                                            >
+                                              {rObj?.contents ?? ""}
                                             </Text>
                                           )}
                                         </Box>
@@ -637,30 +885,51 @@ export function CommentsSidebar({ documentId, visible, rightOffset }: CommentsSi
 
                               <Group gap="xs" wrap="nowrap" align="flex-end">
                                 <TextInput
-                                  placeholder={t('viewer.comments.addReplyPlaceholder', 'Add reply...')}
+                                  placeholder={t(
+                                    "viewer.comments.addReplyPlaceholder",
+                                    "Add reply...",
+                                  )}
                                   size="xs"
                                   value={replyDraft}
                                   onChange={(e) => {
-                                    const v = (e?.currentTarget ?? e?.target)?.value ?? '';
-                                    setReplyDrafts((p) => ({ ...p, [replyKey]: v }));
+                                    const v =
+                                      (e?.currentTarget ?? e?.target)?.value ??
+                                      "";
+                                    setReplyDrafts((p) => ({
+                                      ...p,
+                                      [replyKey]: v,
+                                    }));
                                   }}
                                   style={{ flex: 1, minWidth: 0 }}
                                   styles={{
                                     input: {
-                                      borderColor: 'var(--mantine-color-blue-3)',
+                                      borderColor:
+                                        "var(--mantine-color-blue-3)",
                                     },
                                   }}
                                 />
-                                <Tooltip label={t('viewer.comments.addComment', 'Add comment')}>
+                                <Tooltip
+                                  label={t(
+                                    "viewer.comments.addComment",
+                                    "Add comment",
+                                  )}
+                                >
                                   <ActionIcon
                                     variant="filled"
                                     size="md"
                                     color="blue"
-                                    style={{ backgroundColor: 'var(--mantine-color-blue-6)' }}
-                                    onClick={() => handleSendReply(pageIndex, id, ann?.rect)}
+                                    style={{
+                                      backgroundColor:
+                                        "var(--mantine-color-blue-6)",
+                                    }}
+                                    onClick={() =>
+                                      handleSendReply(pageIndex, id, ann?.rect)
+                                    }
                                     disabled={!replyDraft.trim()}
                                   >
-                                    <CheckIcon style={{ fontSize: 20, color: 'white' }} />
+                                    <CheckIcon
+                                      style={{ fontSize: 20, color: "white" }}
+                                    />
                                   </ActionIcon>
                                 </Tooltip>
                               </Group>
@@ -680,22 +949,28 @@ export function CommentsSidebar({ documentId, visible, rightOffset }: CommentsSi
       <Modal
         opened={!!deleteModal}
         onClose={() => setDeleteModal(null)}
-        title={t('viewer.comments.deleteTitle', 'Remove annotation from comments?')}
+        title={t(
+          "viewer.comments.deleteTitle",
+          "Remove annotation from comments?",
+        )}
         centered
         size="sm"
       >
         <Text size="sm" c="dimmed" mb="lg">
           {t(
-            'viewer.comments.deleteDescription',
-            'This annotation has a comment attached. You can remove just the comment from the sidebar while keeping the annotation, or delete everything.'
+            "viewer.comments.deleteDescription",
+            "This annotation has a comment attached. You can remove just the comment from the sidebar while keeping the annotation, or delete everything.",
           )}
         </Text>
         <Group justify="flex-end" gap="sm">
           <Button variant="default" onClick={handleRemoveFromSidebar}>
-            {t('viewer.comments.removeCommentOnly', 'Remove comment only')}
+            {t("viewer.comments.removeCommentOnly", "Remove comment only")}
           </Button>
           <Button color="red" onClick={handleDeleteAnnotation}>
-            {t('viewer.comments.deleteAnnotationAndComment', 'Delete annotation & comment')}
+            {t(
+              "viewer.comments.deleteAnnotationAndComment",
+              "Delete annotation & comment",
+            )}
           </Button>
         </Group>
       </Modal>
diff --git a/frontend/src/core/components/viewer/CustomSearchLayer.tsx b/frontend/src/core/components/viewer/CustomSearchLayer.tsx
index 7320e1bdb4..50711ab406 100644
--- a/frontend/src/core/components/viewer/CustomSearchLayer.tsx
+++ b/frontend/src/core/components/viewer/CustomSearchLayer.tsx
@@ -1,7 +1,7 @@
-import { useState, useEffect, useMemo } from 'react';
-import { useDocumentState } from '@embedpdf/core/react';
-import { useSearch } from '@embedpdf/plugin-search/react';
-import { SEARCH_CONSTANTS } from '@app/components/viewer/constants/search';
+import { useState, useEffect, useMemo } from "react";
+import { useDocumentState } from "@embedpdf/core/react";
+import { useSearch } from "@embedpdf/plugin-search/react";
+import { SEARCH_CONSTANTS } from "@app/components/viewer/constants/search";
 
 interface SearchLayerProps {
   documentId?: string;
@@ -26,18 +26,19 @@ interface SearchResultState {
 }
 
 export function CustomSearchLayer({
-  documentId = '',
+  documentId = "",
   pageIndex,
   scale: scaleProp,
   highlightColor = SEARCH_CONSTANTS.HIGHLIGHT_COLORS.BACKGROUND,
   activeHighlightColor = SEARCH_CONSTANTS.HIGHLIGHT_COLORS.ACTIVE_BACKGROUND,
   opacity = SEARCH_CONSTANTS.HIGHLIGHT_COLORS.OPACITY,
   padding = SEARCH_CONSTANTS.UI.HIGHLIGHT_PADDING,
-  borderRadius = 4
+  borderRadius = 4,
 }: SearchLayerProps) {
   const { provides: searchProvides } = useSearch(documentId);
   const documentState = useDocumentState(documentId);
-  const [searchResultState, setSearchResultState] = useState<SearchResultState | null>(null);
+  const [searchResultState, setSearchResultState] =
+    useState<SearchResultState | null>(null);
 
   // Use document scale from EmbedPDF state, fallback to prop, then to 1
   const scale = documentState?.scale ?? scaleProp ?? 1;
@@ -48,13 +49,14 @@ export function CustomSearchLayer({
       return;
     }
 
-    const unsubscribe = searchProvides.onSearchResultStateChange?.((state: SearchResultState) => {
-      if (!state) return;
-      // Only update state - do NOT auto-scroll here
-      // Scrolling should only happen when user explicitly navigates via next/previous
-      setSearchResultState(state);
-    });
-
+    const unsubscribe = searchProvides.onSearchResultStateChange?.(
+      (state: SearchResultState) => {
+        if (!state) return;
+        // Only update state - do NOT auto-scroll here
+        // Scrolling should only happen when user explicitly navigates via next/previous
+        setSearchResultState(state);
+      },
+    );
 
     return unsubscribe;
   }, [searchProvides, pageIndex]);
@@ -77,38 +79,43 @@ export function CustomSearchLayer({
   }
 
   return (
-    <div style={{
-      position: 'absolute',
-      top: 0,
-      left: 0,
-      width: '100%',
-      height: '100%',
-      pointerEvents: 'none',
-      zIndex: 10
-    }}>
+    <div
+      style={{
+        position: "absolute",
+        top: 0,
+        left: 0,
+        width: "100%",
+        height: "100%",
+        pointerEvents: "none",
+        zIndex: 10,
+      }}
+    >
       {pageResults.map(({ result, originalIndex }, idx) => (
         <div key={`result-${idx}`}>
           {result.rects.map((rect, rectIdx) => (
             <div
               key={`rect-${idx}-${rectIdx}`}
               style={{
-                position: 'absolute',
+                position: "absolute",
                 top: `${rect.origin.y * scale - padding}px`,
                 left: `${rect.origin.x * scale - padding}px`,
-                width: `${rect.size.width * scale + (padding * 2)}px`,
-                height: `${rect.size.height * scale + (padding * 2)}px`,
-                backgroundColor: originalIndex === searchResultState?.activeResultIndex
-                  ? activeHighlightColor
-                  : highlightColor,
+                width: `${rect.size.width * scale + padding * 2}px`,
+                height: `${rect.size.height * scale + padding * 2}px`,
+                backgroundColor:
+                  originalIndex === searchResultState?.activeResultIndex
+                    ? activeHighlightColor
+                    : highlightColor,
                 opacity: opacity,
                 borderRadius: `${borderRadius}px`,
-                transform: 'scale(1.02)',
-                transformOrigin: 'center',
-                transition: 'opacity 0.2s ease-in-out, background-color 0.2s ease-in-out',
-                pointerEvents: 'none',
-                boxShadow: originalIndex === searchResultState?.activeResultIndex
-                  ? `0 0 0 1px ${SEARCH_CONSTANTS.HIGHLIGHT_COLORS.ACTIVE_BACKGROUND}80`
-                  : 'none'
+                transform: "scale(1.02)",
+                transformOrigin: "center",
+                transition:
+                  "opacity 0.2s ease-in-out, background-color 0.2s ease-in-out",
+                pointerEvents: "none",
+                boxShadow:
+                  originalIndex === searchResultState?.activeResultIndex
+                    ? `0 0 0 1px ${SEARCH_CONSTANTS.HIGHLIGHT_COLORS.ACTIVE_BACKGROUND}80`
+                    : "none",
               }}
             />
           ))}
diff --git a/frontend/src/core/components/viewer/DocumentPermissionsAPIBridge.tsx b/frontend/src/core/components/viewer/DocumentPermissionsAPIBridge.tsx
index c16b37b432..006e62f8cf 100644
--- a/frontend/src/core/components/viewer/DocumentPermissionsAPIBridge.tsx
+++ b/frontend/src/core/components/viewer/DocumentPermissionsAPIBridge.tsx
@@ -1,13 +1,16 @@
-import { useEffect, useMemo } from 'react';
-import { useViewer } from '@app/contexts/ViewerContext';
-import { useDocumentReady } from '@app/components/viewer/hooks/useDocumentReady';
+import { useEffect, useMemo } from "react";
+import { useViewer } from "@app/contexts/ViewerContext";
+import { useDocumentReady } from "@app/components/viewer/hooks/useDocumentReady";
 import {
   PdfPermissionFlag,
   DocumentPermissionsState,
   DocumentPermissionsAPIWrapper,
-} from '@app/contexts/viewer/viewerBridges';
+} from "@app/contexts/viewer/viewerBridges";
 
-function hasPermissionFlag(permissions: number, flag: PdfPermissionFlag): boolean {
+function hasPermissionFlag(
+  permissions: number,
+  flag: PdfPermissionFlag,
+): boolean {
   if (permissions === 0 || permissions === PdfPermissionFlag.AllowAll) {
     return true;
   }
@@ -28,40 +31,65 @@ export function DocumentPermissionsAPIBridge({
   const { registerBridge } = useViewer();
   const documentReady = useDocumentReady();
 
-  const state = useMemo<DocumentPermissionsState>(() => ({
-    isEncrypted,
-    isOwnerUnlocked,
-    permissions,
-    canPrint: hasPermissionFlag(permissions, PdfPermissionFlag.Print),
-    canModifyContents: hasPermissionFlag(permissions, PdfPermissionFlag.ModifyContents),
-    canCopyContents: hasPermissionFlag(permissions, PdfPermissionFlag.CopyContents),
-    canModifyAnnotations: hasPermissionFlag(permissions, PdfPermissionFlag.ModifyAnnotations),
-    canFillForms: hasPermissionFlag(permissions, PdfPermissionFlag.FillForms),
-    canExtractForAccessibility: hasPermissionFlag(permissions, PdfPermissionFlag.ExtractForAccessibility),
-    canAssembleDocument: hasPermissionFlag(permissions, PdfPermissionFlag.AssembleDocument),
-    canPrintHighQuality: hasPermissionFlag(permissions, PdfPermissionFlag.PrintHighQuality),
-  }), [isEncrypted, isOwnerUnlocked, permissions]);
+  const state = useMemo<DocumentPermissionsState>(
+    () => ({
+      isEncrypted,
+      isOwnerUnlocked,
+      permissions,
+      canPrint: hasPermissionFlag(permissions, PdfPermissionFlag.Print),
+      canModifyContents: hasPermissionFlag(
+        permissions,
+        PdfPermissionFlag.ModifyContents,
+      ),
+      canCopyContents: hasPermissionFlag(
+        permissions,
+        PdfPermissionFlag.CopyContents,
+      ),
+      canModifyAnnotations: hasPermissionFlag(
+        permissions,
+        PdfPermissionFlag.ModifyAnnotations,
+      ),
+      canFillForms: hasPermissionFlag(permissions, PdfPermissionFlag.FillForms),
+      canExtractForAccessibility: hasPermissionFlag(
+        permissions,
+        PdfPermissionFlag.ExtractForAccessibility,
+      ),
+      canAssembleDocument: hasPermissionFlag(
+        permissions,
+        PdfPermissionFlag.AssembleDocument,
+      ),
+      canPrintHighQuality: hasPermissionFlag(
+        permissions,
+        PdfPermissionFlag.PrintHighQuality,
+      ),
+    }),
+    [isEncrypted, isOwnerUnlocked, permissions],
+  );
 
-  const api = useMemo<DocumentPermissionsAPIWrapper>(() => ({
-    hasPermission: (flag: PdfPermissionFlag) => hasPermissionFlag(permissions, flag),
-    hasAllPermissions: (flags: PdfPermissionFlag[]) =>
-      flags.every(flag => hasPermissionFlag(permissions, flag)),
-    getEffectivePermission: (flag: PdfPermissionFlag) => {
-      if (isOwnerUnlocked) return true;
-      return hasPermissionFlag(permissions, flag);
-    },
-  }), [permissions, isOwnerUnlocked]);
+  const api = useMemo<DocumentPermissionsAPIWrapper>(
+    () => ({
+      hasPermission: (flag: PdfPermissionFlag) =>
+        hasPermissionFlag(permissions, flag),
+      hasAllPermissions: (flags: PdfPermissionFlag[]) =>
+        flags.every((flag) => hasPermissionFlag(permissions, flag)),
+      getEffectivePermission: (flag: PdfPermissionFlag) => {
+        if (isOwnerUnlocked) return true;
+        return hasPermissionFlag(permissions, flag);
+      },
+    }),
+    [permissions, isOwnerUnlocked],
+  );
 
   useEffect(() => {
     if (documentReady) {
-      registerBridge('permissions', {
+      registerBridge("permissions", {
         state,
         api,
       });
     }
 
     return () => {
-      registerBridge('permissions', null);
+      registerBridge("permissions", null);
     };
   }, [registerBridge, state, api, documentReady]);
 
diff --git a/frontend/src/core/components/viewer/DocumentReadyWrapper.tsx b/frontend/src/core/components/viewer/DocumentReadyWrapper.tsx
index 879ba9288b..520417afd0 100644
--- a/frontend/src/core/components/viewer/DocumentReadyWrapper.tsx
+++ b/frontend/src/core/components/viewer/DocumentReadyWrapper.tsx
@@ -1,12 +1,15 @@
-import React, { useState, useEffect } from 'react';
-import { useDocumentManagerPlugin } from '@embedpdf/plugin-document-manager/react';
+import React, { useState, useEffect } from "react";
+import { useDocumentManagerPlugin } from "@embedpdf/plugin-document-manager/react";
 
 interface DocumentReadyWrapperProps {
   children: (documentId: string) => React.ReactNode;
   fallback?: React.ReactNode;
 }
 
-export function DocumentReadyWrapper({ children, fallback = null }: DocumentReadyWrapperProps) {
+export function DocumentReadyWrapper({
+  children,
+  fallback = null,
+}: DocumentReadyWrapperProps) {
   const { plugin, isLoading, ready } = useDocumentManagerPlugin();
   const [activeDocumentId, setActiveDocumentId] = useState<string | null>(null);
 
@@ -38,7 +41,7 @@ export function DocumentReadyWrapper({ children, fallback = null }: DocumentRead
       });
 
       return () => {
-        if (typeof unsubscribe === 'function') {
+        if (typeof unsubscribe === "function") {
           unsubscribe();
         }
       };
diff --git a/frontend/src/core/components/viewer/EmbedPdfViewer.tsx b/frontend/src/core/components/viewer/EmbedPdfViewer.tsx
index 6d525be5c4..81e421abdf 100644
--- a/frontend/src/core/components/viewer/EmbedPdfViewer.tsx
+++ b/frontend/src/core/components/viewer/EmbedPdfViewer.tsx
@@ -1,55 +1,87 @@
-import React, { useCallback, useEffect, useLayoutEffect, useRef, useState } from 'react';
-import { Box, Center, Text, ActionIcon } from '@mantine/core';
-import CloseIcon from '@mui/icons-material/Close';
+import React, {
+  useCallback,
+  useEffect,
+  useLayoutEffect,
+  useRef,
+  useState,
+} from "react";
+import { Box, Center, Text, ActionIcon, Button, Stack } from "@mantine/core";
+import CloseIcon from "@mui/icons-material/Close";
+import LockIcon from "@mui/icons-material/Lock";
 
 import { useFileState, useFileActions } from "@app/contexts/FileContext";
 import { useFileWithUrl } from "@app/hooks/useFileWithUrl";
 import { useViewer } from "@app/contexts/ViewerContext";
-import { LocalEmbedPDF } from '@app/components/viewer/LocalEmbedPDF';
-import { PdfViewerToolbar } from '@app/components/viewer/PdfViewerToolbar';
-import { ThumbnailSidebar } from '@app/components/viewer/ThumbnailSidebar';
-import { BookmarkSidebar } from '@app/components/viewer/BookmarkSidebar';
-import { AttachmentSidebar } from '@app/components/viewer/AttachmentSidebar';
-import { LayerSidebar } from '@app/components/viewer/LayerSidebar';
-import { useNavigationGuard, useNavigationState } from '@app/contexts/NavigationContext';
-import { useSignature } from '@app/contexts/SignatureContext';
-import { useRedaction } from '@app/contexts/RedactionContext';
-import type { RedactionPendingTrackerAPI } from '@app/components/viewer/RedactionPendingTracker';
-import { createStirlingFilesAndStubs } from '@app/services/fileStubHelpers';
-import NavigationWarningModal from '@app/components/shared/NavigationWarningModal';
-import { isStirlingFile, getFormFillFileId } from '@app/types/fileContext';
-import { useViewerRightRailButtons } from '@app/components/viewer/useViewerRightRailButtons';
-import { StampPlacementOverlay } from '@app/components/viewer/StampPlacementOverlay';
-import { RulerOverlay, type PageMeasureScales, type PageScaleInfo, type ViewportScale } from '@app/components/viewer/RulerOverlay';
-import type { PDFDict, PDFNumber } from '@cantoo/pdf-lib';
-import { useWheelZoom } from '@app/hooks/useWheelZoom';
-import { useFormFill } from '@app/tools/formFill/FormFillContext';
-import { FormSaveBar } from '@app/tools/formFill/FormSaveBar';
+import { LocalEmbedPDF } from "@app/components/viewer/LocalEmbedPDF";
+import { PdfViewerToolbar } from "@app/components/viewer/PdfViewerToolbar";
+import { ThumbnailSidebar } from "@app/components/viewer/ThumbnailSidebar";
+import { BookmarkSidebar } from "@app/components/viewer/BookmarkSidebar";
+import { AttachmentSidebar } from "@app/components/viewer/AttachmentSidebar";
+import { LayerSidebar } from "@app/components/viewer/LayerSidebar";
+import {
+  useNavigationGuard,
+  useNavigationState,
+} from "@app/contexts/NavigationContext";
+import { useSignature } from "@app/contexts/SignatureContext";
+import { useRedaction } from "@app/contexts/RedactionContext";
+import type { RedactionPendingTrackerAPI } from "@app/components/viewer/RedactionPendingTracker";
+import { createStirlingFilesAndStubs } from "@app/services/fileStubHelpers";
+import { isStirlingFile, getFormFillFileId } from "@app/types/fileContext";
+import { useViewerRightRailButtons } from "@app/components/viewer/useViewerRightRailButtons";
+import { StampPlacementOverlay } from "@app/components/viewer/StampPlacementOverlay";
+import {
+  RulerOverlay,
+  type PageMeasureScales,
+  type PageScaleInfo,
+  type ViewportScale,
+} from "@app/components/viewer/RulerOverlay";
+import type { PDFDict, PDFNumber } from "@cantoo/pdf-lib";
+import { useWheelZoom } from "@app/hooks/useWheelZoom";
+import { useFormFill } from "@app/tools/formFill/FormFillContext";
+import { FormSaveBar } from "@app/tools/formFill/FormSaveBar";
+import { useViewerKeyCommand } from "@app/hooks/useViewerKeyCommand";
 
 // ─── Measure dictionary extraction ────────────────────────────────────────────
 
-async function extractPageMeasureScales(file: Blob): Promise<PageMeasureScales | null> {
+async function extractPageMeasureScales(
+  file: Blob,
+): Promise<PageMeasureScales | null> {
   try {
-    const { PDFDocument, PDFDict, PDFName, PDFArray, PDFNumber, PDFString, PDFHexString } = await import('@cantoo/pdf-lib');
-    const pdfDoc = await PDFDocument.load(await file.arrayBuffer(), { ignoreEncryption: true });
+    const {
+      PDFDocument,
+      PDFDict,
+      PDFName,
+      PDFArray,
+      PDFNumber,
+      PDFString,
+      PDFHexString,
+    } = await import("@cantoo/pdf-lib");
+    const pdfDoc = await PDFDocument.load(await file.arrayBuffer(), {
+      ignoreEncryption: true,
+    });
 
     // Parse a Measure dict into a MeasureScale, or return null if malformed.
     const parseScale = (measureObj: unknown) => {
       if (!(measureObj instanceof PDFDict)) return null;
-      const rObj = measureObj.lookup(PDFName.of('R'));
-      const ratioLabel = (rObj instanceof PDFString || rObj instanceof PDFHexString)
-              ? rObj.decodeText() : '';
+      const rObj = measureObj.lookup(PDFName.of("R"));
+      const ratioLabel =
+        rObj instanceof PDFString || rObj instanceof PDFHexString
+          ? rObj.decodeText()
+          : "";
       // D = distance array, X = x-axis fallback
-      let fmtArray = measureObj.lookup(PDFName.of('D'));
-      if (!(fmtArray instanceof PDFArray)) fmtArray = measureObj.lookup(PDFName.of('X'));
+      let fmtArray = measureObj.lookup(PDFName.of("D"));
+      if (!(fmtArray instanceof PDFArray))
+        fmtArray = measureObj.lookup(PDFName.of("X"));
       if (!(fmtArray instanceof PDFArray)) return null;
       const firstFmt = fmtArray.lookup(0);
       if (!(firstFmt instanceof PDFDict)) return null;
-      const cObj = firstFmt.lookup(PDFName.of('C'));
-      const uObj = firstFmt.lookup(PDFName.of('U'));
+      const cObj = firstFmt.lookup(PDFName.of("C"));
+      const uObj = firstFmt.lookup(PDFName.of("U"));
       if (!(cObj instanceof PDFNumber) || cObj.asNumber() <= 0) return null;
-      const unit = (uObj instanceof PDFString || uObj instanceof PDFHexString)
-        ? uObj.decodeText() : 'units';
+      const unit =
+        uObj instanceof PDFString || uObj instanceof PDFHexString
+          ? uObj.decodeText()
+          : "units";
       return { factor: cObj.asNumber(), unit, ratioLabel };
     };
 
@@ -62,15 +94,15 @@ async function extractPageMeasureScales(file: Blob): Promise<PageMeasureScales |
       const viewports: ViewportScale[] = [];
 
       // Spec-conformant: /VP array — each viewport can have its own scale and BBox
-      const vpObj = pageNode.lookup(PDFName.of('VP'));
+      const vpObj = pageNode.lookup(PDFName.of("VP"));
       if (vpObj instanceof PDFArray) {
         for (let j = 0; j < vpObj.size(); j++) {
           const vpEntry = vpObj.lookup(j);
           if (!(vpEntry instanceof PDFDict)) continue;
-          const scale = parseScale(vpEntry.lookup(PDFName.of('Measure')));
+          const scale = parseScale(vpEntry.lookup(PDFName.of("Measure")));
           if (!scale) continue;
-          let bbox: ViewportScale['bbox'] = null;
-          const bboxObj = vpEntry.lookup(PDFName.of('BBox'));
+          let bbox: ViewportScale["bbox"] = null;
+          const bboxObj = vpEntry.lookup(PDFName.of("BBox"));
           if (bboxObj instanceof PDFArray && bboxObj.size() >= 4) {
             bbox = [
               (bboxObj.lookup(0) as PDFNumber).asNumber(),
@@ -85,11 +117,12 @@ async function extractPageMeasureScales(file: Blob): Promise<PageMeasureScales |
 
       // Fallback: /Measure directly on page (non-conforming but seen in the wild)
       if (viewports.length === 0) {
-        const scale = parseScale(pageNode.lookup(PDFName.of('Measure')));
+        const scale = parseScale(pageNode.lookup(PDFName.of("Measure")));
         if (scale) viewports.push({ bbox: null, scale });
       }
 
-      if (viewports.length > 0) result.set(i, { viewports, pageHeight } satisfies PageScaleInfo);
+      if (viewports.length > 0)
+        result.set(i, { viewports, pageHeight } satisfies PageScaleInfo);
     }
 
     return result.size > 0 ? result : null;
@@ -153,13 +186,22 @@ const EmbedPdfViewerContent = ({
   // Track initial rotation to detect changes
   const initialRotationRef = useRef<number | null>(null);
   useEffect(() => {
-    if (initialRotationRef.current === null && rotationState.rotation !== undefined) {
+    if (
+      initialRotationRef.current === null &&
+      rotationState.rotation !== undefined
+    ) {
       initialRotationRef.current = rotationState.rotation;
     }
   }, [rotationState.rotation]);
 
   // Get signature and annotation contexts
-  const { signatureApiRef, annotationApiRef, historyApiRef, signatureConfig, isPlacementMode } = useSignature();
+  const {
+    signatureApiRef,
+    annotationApiRef,
+    historyApiRef,
+    signatureConfig,
+    isPlacementMode,
+  } = useSignature();
 
   // Track whether there are unsaved annotation changes in this viewer session.
   // This is our source of truth for navigation guards; it is set when the
@@ -176,8 +218,6 @@ const EmbedPdfViewerContent = ({
   // Similar to scroll preservation - track rotation across file reloads
   const pendingRotationRestoreRef = useRef<number | null>(null);
   const rotationRestoreAttemptsRef = useRef<number>(0);
-  // Track the file ID we should be viewing after a save (to handle list reordering)
-  const pendingFileIdRef = useRef<string | null>(null);
 
   const formApplyInProgressRef = useRef(false);
 
@@ -188,33 +228,45 @@ const EmbedPdfViewerContent = ({
   const redactionTrackerRef = useRef<RedactionPendingTrackerAPI>(null);
 
   // Get current file from FileContext
-  const { selectors, state } = useFileState();
+  const { selectors } = useFileState();
   const { actions } = useFileActions();
   const activeFiles = selectors.getFiles();
-  const activeFileIds = activeFiles.map(f => f.fileId);
-  const selectedFileIds = state.ui.selectedFileIds;
+  const activeFilesRef = useRef(activeFiles);
+  activeFilesRef.current = activeFiles;
+  const activeFileIds = activeFiles.map((f) => f.fileId);
 
   // Navigation guard for unsaved changes
-  const { setHasUnsavedChanges, registerUnsavedChangesChecker, unregisterUnsavedChangesChecker } = useNavigationGuard();
+  const {
+    setHasUnsavedChanges,
+    registerUnsavedChangesChecker,
+    unregisterUnsavedChangesChecker,
+    registerNavigationWarningHandlers,
+    unregisterNavigationWarningHandlers,
+  } = useNavigationGuard();
 
   const { selectedTool } = useNavigationState();
 
   // Form fill context
   const { fetchFields: fetchFormFields, setProviderMode } = useFormFill();
 
-  const isInAnnotationTool = selectedTool === 'sign' || selectedTool === 'addText' || selectedTool === 'addImage' || selectedTool === 'annotate';
+  const isInAnnotationTool =
+    selectedTool === "sign" ||
+    selectedTool === "addText" ||
+    selectedTool === "addImage" ||
+    selectedTool === "annotate";
   const isSignatureMode = isInAnnotationTool;
-  const isManualRedactMode = selectedTool === 'redact';
+  const isManualRedactMode = selectedTool === "redact";
 
   // Enable annotations when annotation tool is selected OR when annotations are visible
   // (so users can interact with existing comment annotations in reader/viewer mode)
-  const shouldEnableAnnotations = selectedTool === 'annotate' || isSignatureMode || isAnnotationsVisible;
+  const shouldEnableAnnotations =
+    selectedTool === "annotate" || isSignatureMode || isAnnotationsVisible;
 
   // Enable redaction only when redaction tool is selected
-  const shouldEnableRedaction = selectedTool === 'redact';
+  const shouldEnableRedaction = selectedTool === "redact";
 
   // FormFill tool mode — uses PDFBox backend for full-fidelity form handling
-  const isFormFillToolActive = (selectedTool as string) === 'formFill';
+  const isFormFillToolActive = (selectedTool as string) === "formFill";
 
   // Form overlays are shown in BOTH modes:
   // - Normal viewer: form overlays visible (PDFium WASM, frontend-only)
@@ -223,7 +275,7 @@ const EmbedPdfViewerContent = ({
 
   // Switch the provider when the tool mode changes
   useEffect(() => {
-    setProviderMode(isFormFillToolActive ? 'pdfbox' : 'pdflib');
+    setProviderMode(isFormFillToolActive ? "pdfbox" : "pdflib");
   }, [isFormFillToolActive, setProviderMode]);
 
   // Track previous annotation/redaction state to detect tool switches
@@ -241,8 +293,10 @@ const EmbedPdfViewerContent = ({
   // Preserve scroll position when switching between annotation and redaction tools
   // Using useLayoutEffect to capture synchronously before DOM updates
   useLayoutEffect(() => {
-    const annotationsChanged = prevEnableAnnotationsRef.current !== shouldEnableAnnotations;
-    const redactionChanged = prevEnableRedactionRef.current !== shouldEnableRedaction;
+    const annotationsChanged =
+      prevEnableAnnotationsRef.current !== shouldEnableAnnotations;
+    const redactionChanged =
+      prevEnableRedactionRef.current !== shouldEnableRedaction;
 
     if (annotationsChanged || redactionChanged) {
       // Read scroll state directly AND use the tracked value - take whichever is valid
@@ -270,48 +324,54 @@ const EmbedPdfViewerContent = ({
     }
   }, [isInAnnotationTool, setAnnotationMode]);
   const isPlacementOverlayActive = Boolean(
-    isInAnnotationTool && isPlacementMode && signatureConfig
+    isInAnnotationTool && isPlacementMode && signatureConfig,
   );
 
   // Track which file tab is active
   const [internalActiveFileIndex, setInternalActiveFileIndex] = useState(0);
   const activeFileIndex = externalActiveFileIndex ?? internalActiveFileIndex;
-  const setActiveFileIndex = externalSetActiveFileIndex ?? setInternalActiveFileIndex;
-  const hasInitializedFromSelection = useRef(false);
+  const setActiveFileIndex =
+    externalSetActiveFileIndex ?? setInternalActiveFileIndex;
 
-  // When viewer opens with a selected file, switch to that file
+  // activeFileId (from ViewerContext) is the stable source of truth.
+  // We derive activeFileIndex from it so reorders after tool operations don't lose the viewed file.
+  const { activeFileId, setActiveFileId } = useViewer();
+
+  // Stable string key representing the current file list order.
+  // Using a joined ID string avoids depending on the activeFiles array reference,
+  // which is a new object every render and would cause an infinite effect loop.
+  const fileIdsKey = activeFiles.map((f) => f.fileId).join(",");
+
+  // When the file list actually changes, re-derive activeFileIndex from the stable activeFileId.
   useEffect(() => {
-    if (!hasInitializedFromSelection.current && selectedFileIds.length > 0 && activeFiles.length > 0) {
-      const selectedFileId = selectedFileIds[0];
-      const index = activeFiles.findIndex(f => f.fileId === selectedFileId);
-      if (index !== -1 && index !== activeFileIndex) {
-        setActiveFileIndex(index);
-      }
-      hasInitializedFromSelection.current = true;
+    if (!activeFileId || activeFiles.length === 0) return;
+    const newIndex = activeFiles.findIndex((f) => f.fileId === activeFileId);
+    if (newIndex !== -1 && newIndex !== activeFileIndex) {
+      setActiveFileIndex(newIndex);
     }
-  }, [selectedFileIds, activeFiles, activeFileIndex]);
+  }, [fileIdsKey, activeFileId]); // stable primitives — no infinite loop
 
-  // Reset active tab if it's out of bounds
+  // When the user manually switches file tabs, keep activeFileId in sync.
+  // Skips the initial mount to avoid overwriting an activeFileId set by handleViewFile.
+  const activeFileIndexMountedRef = useRef(false);
+  useEffect(() => {
+    if (!activeFileIndexMountedRef.current) {
+      activeFileIndexMountedRef.current = true;
+      return;
+    }
+    const fileId = activeFilesRef.current[activeFileIndex]?.fileId;
+    if (fileId && fileId !== activeFileId) {
+      setActiveFileId(fileId);
+    }
+  }, [activeFileIndex]);
+
+  // Reset active tab if it's out of bounds (safety net)
   useEffect(() => {
     if (activeFileIndex >= activeFiles.length && activeFiles.length > 0) {
       setActiveFileIndex(0);
     }
   }, [activeFiles.length, activeFileIndex]);
 
-  // After saving a file, the list may reorder (sorted by version).
-  // Track the saved file's ID and update activeFileIndex to follow it.
-  useEffect(() => {
-    if (pendingFileIdRef.current && activeFiles.length > 0) {
-      const targetFileId = pendingFileIdRef.current;
-      const newIndex = activeFiles.findIndex(f => f.fileId === targetFileId);
-      if (newIndex !== -1 && newIndex !== activeFileIndex) {
-        setActiveFileIndex(newIndex);
-      }
-      // Clear the pending file ID once we've found and switched to it
-      pendingFileIdRef.current = null;
-    }
-  }, [activeFiles, activeFileIndex, setActiveFileIndex]);
-
   // Determine which file to display
   const currentFile = React.useMemo(() => {
     if (previewFile) {
@@ -338,13 +398,20 @@ const EmbedPdfViewerContent = ({
     }
   }, [previewFile, fileWithUrl]);
 
+  // Check if the current file is encrypted (gate the viewer to prevent PDFium crash)
+  const isCurrentFileEncrypted = React.useMemo(() => {
+    if (!currentFile || !isStirlingFile(currentFile)) return false;
+    const stub = selectors.getStirlingFileStub(currentFile.fileId);
+    return stub?.processedFile?.isEncrypted === true;
+  }, [currentFile, selectors]);
+
   const bookmarkCacheKey = React.useMemo(() => {
     if (currentFile && isStirlingFile(currentFile)) {
       return currentFile.fileId;
     }
 
     if (previewFile) {
-      const uniquePreviewId = `${previewFile.name}-${previewFile.size}-${previewFile.lastModified ?? 'na'}`;
+      const uniquePreviewId = `${previewFile.name}-${previewFile.size}-${previewFile.lastModified ?? "na"}`;
       return `preview-${uniquePreviewId}`;
     }
 
@@ -354,7 +421,7 @@ const EmbedPdfViewerContent = ({
 
     if (effectiveFile?.file instanceof File) {
       const fileObj = effectiveFile.file;
-      return `file-${fileObj.name}-${fileObj.size}-${fileObj.lastModified ?? 'na'}`;
+      return `file-${fileObj.name}-${fileObj.size}-${fileObj.lastModified ?? "na"}`;
     }
 
     return undefined;
@@ -366,12 +433,14 @@ const EmbedPdfViewerContent = ({
       return [bookmarkCacheKey].filter(Boolean) as string[];
     }
 
-    return activeFiles.map(file => {
-      if (isStirlingFile(file)) {
-        return file.fileId;
-      }
-      return undefined;
-    }).filter(Boolean) as string[];
+    return activeFiles
+      .map((file) => {
+        if (isStirlingFile(file)) {
+          return file.fileId;
+        }
+        return undefined;
+      })
+      .filter(Boolean) as string[];
   }, [activeFiles, previewFile, bookmarkCacheKey]);
 
   useWheelZoom({
@@ -380,29 +449,36 @@ const EmbedPdfViewerContent = ({
     onZoomOut: zoomActions.zoomOut,
   });
 
+  const viewerKeyCommand = useViewerKeyCommand();
+
   // Handle keyboard shortcuts
   useEffect(() => {
     const handleKeyDown = (event: KeyboardEvent) => {
       const mod = event.ctrlKey || event.metaKey;
 
-      // Ctrl+P (print) and Ctrl+R (rotate) must be intercepted unconditionally
+      // Ctrl+P (print) must be intercepted unconditionally
       // whenever the viewer is mounted, even before the user has hovered over it.
+      // Ctrl+R (rotate) is intercepted only on desktop (Tauri), while on web it still falls through to browser refresh.
       // Without this, the browser falls through to its native "print HTML page"
       // or "reload page" behaviour.
+
       if (mod) {
         const target = event.target as Element;
         const isInTextInput =
-          target.tagName === 'INPUT' ||
-          target.tagName === 'TEXTAREA' ||
+          target.tagName === "INPUT" ||
+          target.tagName === "TEXTAREA" ||
           (target as HTMLElement).isContentEditable;
 
         if (!isInTextInput) {
-          switch (event.key) {
-            case 'p':
-            case 'P':
-              event.preventDefault();
-              printActions.print();
-              return;
+          const wasOverridden = viewerKeyCommand(event);
+          if (!wasOverridden) {
+            switch (event.key) {
+              case "p":
+              case "P":
+                event.preventDefault();
+                printActions.print();
+                return;
+            }
           }
         }
       }
@@ -415,37 +491,37 @@ const EmbedPdfViewerContent = ({
       // Modifier key shortcuts (Ctrl/Cmd + key)
       if (mod) {
         switch (event.key) {
-          case '=':
-          case '+':
+          case "=":
+          case "+":
             event.preventDefault();
             zoomActions.zoomIn();
             return;
-          case '-':
-          case '_':
+          case "-":
+          case "_":
             event.preventDefault();
             zoomActions.zoomOut();
             return;
-          case '0':
+          case "0":
             // Ctrl+0: Reset zoom to fit width
             event.preventDefault();
-            zoomActions.requestZoom('fit-width');
+            zoomActions.requestZoom("fit-width");
             return;
-          case 'a':
-          case 'A':
+          case "a":
+          case "A":
             // Ctrl+A: Prevent browser from selecting all UI text
             event.preventDefault();
             return;
-          case 'f':
-          case 'F':
+          case "f":
+          case "F":
             event.preventDefault();
             if (isSearchInterfaceVisible) {
-              window.dispatchEvent(new CustomEvent('refocus-search-input'));
+              window.dispatchEvent(new CustomEvent("refocus-search-input"));
             } else {
               searchInterfaceActions.open();
             }
             return;
-          case 's':
-          case 'S':
+          case "s":
+          case "S":
             // Ctrl+S: Save/apply changes
             if (!event.shiftKey) {
               event.preventDefault();
@@ -455,8 +531,8 @@ const EmbedPdfViewerContent = ({
             }
             return;
 
-          case 'z':
-          case 'Z':
+          case "z":
+          case "Z":
             // Ctrl+Z: Undo; Ctrl+Shift+Z: Redo
             event.preventDefault();
             if (event.shiftKey) {
@@ -465,8 +541,8 @@ const EmbedPdfViewerContent = ({
               historyApiRef.current?.undo?.();
             }
             return;
-          case 'y':
-          case 'Y':
+          case "y":
+          case "Y":
             // Ctrl+Y: Redo
             event.preventDefault();
             historyApiRef.current?.redo?.();
@@ -477,23 +553,23 @@ const EmbedPdfViewerContent = ({
 
       // Non-modifier shortcuts
       switch (event.key) {
-        case 'Home':
+        case "Home":
           event.preventDefault();
           scrollActions.scrollToFirstPage();
           return;
-        case 'End':
+        case "End":
           event.preventDefault();
           scrollActions.scrollToLastPage();
           return;
-        case 'PageUp':
+        case "PageUp":
           event.preventDefault();
           scrollActions.scrollToPreviousPage();
           return;
-        case 'PageDown':
+        case "PageDown":
           event.preventDefault();
           scrollActions.scrollToNextPage();
           return;
-        case 'Escape':
+        case "Escape":
           if (isSearchInterfaceVisible) {
             event.preventDefault();
             searchInterfaceActions.close();
@@ -502,14 +578,23 @@ const EmbedPdfViewerContent = ({
       }
     };
 
-    document.addEventListener('keydown', handleKeyDown);
+    document.addEventListener("keydown", handleKeyDown);
     return () => {
-      document.removeEventListener('keydown', handleKeyDown);
+      document.removeEventListener("keydown", handleKeyDown);
     };
   }, [
-    isViewerHovered, isSearchInterfaceVisible, zoomActions, searchInterfaceActions,
-    scrollActions, printActions, exportActions, rotationActions, historyApiRef,
-    viewerApplyChanges, cyclePdfRenderMode,
+    isViewerHovered,
+    isSearchInterfaceVisible,
+    zoomActions,
+    searchInterfaceActions,
+    scrollActions,
+    printActions,
+    exportActions,
+    rotationActions,
+    historyApiRef,
+    viewerApplyChanges,
+    cyclePdfRenderMode,
+    viewerKeyCommand,
   ]);
 
   // Watch the annotation history API to detect when the document becomes "dirty".
@@ -531,7 +616,7 @@ const EmbedPdfViewerContent = ({
 
     const unsubscribe = historyApi.subscribe(updateHasChanges);
     return () => {
-      if (typeof unsubscribe === 'function') {
+      if (typeof unsubscribe === "function") {
         unsubscribe();
       }
     };
@@ -548,12 +633,15 @@ const EmbedPdfViewerContent = ({
       const hasAnnotationChanges = hasAnnotationChangesRef.current;
 
       // Check for pending redactions
-      const hasPendingRedactions = (redactionTrackerRef.current?.getPendingCount() ?? 0) > 0;
+      const hasPendingRedactions =
+        (redactionTrackerRef.current?.getPendingCount() ?? 0) > 0;
 
       // Always consider applied redactions as unsaved until export
       const hasAppliedRedactions = redactionsApplied;
 
-      return hasAnnotationChanges || hasPendingRedactions || hasAppliedRedactions;
+      return (
+        hasAnnotationChanges || hasPendingRedactions || hasAppliedRedactions
+      );
     };
 
     registerUnsavedChangesChecker(checkForChanges);
@@ -561,14 +649,23 @@ const EmbedPdfViewerContent = ({
     return () => {
       unregisterUnsavedChangesChecker();
     };
-  }, [historyApiRef, previewFile, registerUnsavedChangesChecker, unregisterUnsavedChangesChecker, isManualRedactMode, redactionsApplied]);
+  }, [
+    historyApiRef,
+    previewFile,
+    registerUnsavedChangesChecker,
+    unregisterUnsavedChangesChecker,
+    isManualRedactMode,
+    redactionsApplied,
+  ]);
 
   // Save changes - save annotations and redactions to file (overwrites active file)
   const applyChanges = useCallback(async () => {
     if (!currentFile || activeFileIds.length === 0) return;
 
     try {
-      console.log('[Viewer] Applying changes - exporting PDF with annotations/redactions');
+      console.log(
+        "[Viewer] Applying changes - exporting PDF with annotations/redactions",
+      );
 
       // Use the continuously tracked scroll position - more reliable than reading at this moment
       const pageToRestore = lastKnownScrollPageRef.current;
@@ -577,7 +674,8 @@ const EmbedPdfViewerContent = ({
       const currentRotation = rotationState.rotation ?? 0;
 
       // Step 0: Commit any pending redactions before export
-      const hadPendingRedactions = (redactionTrackerRef.current?.getPendingCount() ?? 0) > 0;
+      const hadPendingRedactions =
+        (redactionTrackerRef.current?.getPendingCount() ?? 0) > 0;
 
       // Mark redactions as applied BEFORE committing, so the button stays enabled during the save process
       // This ensures the button doesn't become disabled when pendingCount becomes 0
@@ -586,32 +684,36 @@ const EmbedPdfViewerContent = ({
       }
 
       if (hadPendingRedactions) {
-        console.log('[Viewer] Committing pending redactions before export');
+        console.log("[Viewer] Committing pending redactions before export");
         redactionTrackerRef.current?.commitAllPending();
         // Give a small delay for the commit to process
-        await new Promise(resolve => setTimeout(resolve, 100));
+        await new Promise((resolve) => setTimeout(resolve, 100));
       }
 
       // Step 1: Export PDF with annotations using EmbedPDF
       const arrayBuffer = await exportActions.saveAsCopy();
       if (!arrayBuffer) {
-        throw new Error('Failed to export PDF');
+        throw new Error("Failed to export PDF");
       }
 
       // Step 2: Convert ArrayBuffer to File
-      const blob = new Blob([arrayBuffer], { type: 'application/pdf' });
-      const filename = currentFile.name || 'document.pdf';
-      const file = new File([blob], filename, { type: 'application/pdf' });
+      const blob = new Blob([arrayBuffer], { type: "application/pdf" });
+      const filename = currentFile.name || "document.pdf";
+      const file = new File([blob], filename, { type: "application/pdf" });
 
       // Step 3: Create StirlingFiles and stubs for version history
       // Only consume the current file, not all active files
       const currentFileId = activeFiles[activeFileIndex]?.fileId;
-      if (!currentFileId) throw new Error('Current file ID not found');
+      if (!currentFileId) throw new Error("Current file ID not found");
 
       const parentStub = selectors.getStirlingFileStub(currentFileId);
-      if (!parentStub) throw new Error('Parent stub not found');
+      if (!parentStub) throw new Error("Parent stub not found");
 
-      const { stirlingFiles, stubs } = await createStirlingFilesAndStubs([file], parentStub, 'multiTool');
+      const { stirlingFiles, stubs } = await createStirlingFilesAndStubs(
+        [file],
+        parentStub,
+        selectedTool ?? "multiTool",
+      );
 
       // Store the page to restore after file replacement triggers re-render
       pendingScrollRestoreRef.current = pageToRestore;
@@ -620,11 +722,9 @@ const EmbedPdfViewerContent = ({
       // Store the rotation to restore after file replacement
       pendingRotationRestoreRef.current = currentRotation;
       rotationRestoreAttemptsRef.current = 0;
-      // Store the new file ID so we can track it after the list reorders
+      // Track the new file ID so the viewer follows it after the list reorders
       const newFileId = stubs[0]?.id;
-      if (newFileId) {
-        pendingFileIdRef.current = newFileId;
-      }
+      if (newFileId) setActiveFileId(newFileId);
 
       // Step 4: Consume only the current file (replace in context)
       await actions.consumeFiles([currentFileId], stirlingFiles, stubs);
@@ -634,63 +734,90 @@ const EmbedPdfViewerContent = ({
       setHasUnsavedChanges(false);
       setRedactionsApplied(false);
     } catch (error) {
-      console.error('Apply changes failed:', error);
+      console.error("Apply changes failed:", error);
     }
-  }, [currentFile, activeFiles, activeFileIndex, exportActions, actions, selectors, setHasUnsavedChanges, setRedactionsApplied, rotationState.rotation]);
+  }, [
+    currentFile,
+    activeFiles,
+    activeFileIndex,
+    exportActions,
+    actions,
+    selectors,
+    setHasUnsavedChanges,
+    setRedactionsApplied,
+    rotationState.rotation,
+  ]);
 
   // Apply form fill changes - reload the filled PDF into the viewer
-  const handleFormApply = useCallback(async (filledBlob: Blob) => {
-    if (formApplyInProgressRef.current) return;
-    if (!currentFile || activeFileIds.length === 0) return;
+  const handleFormApply = useCallback(
+    async (filledBlob: Blob) => {
+      if (formApplyInProgressRef.current) return;
+      if (!currentFile || activeFileIds.length === 0) return;
 
-    formApplyInProgressRef.current = true;
-    try {
-      console.log('[Viewer] Applying form fill changes - reloading filled PDF');
+      formApplyInProgressRef.current = true;
+      try {
+        console.log(
+          "[Viewer] Applying form fill changes - reloading filled PDF",
+        );
 
-      // Use the continuously tracked scroll position
-      const pageToRestore = lastKnownScrollPageRef.current;
+        // Use the continuously tracked scroll position
+        const pageToRestore = lastKnownScrollPageRef.current;
 
-      // Save the current rotation to restore after reload
-      const currentRotation = rotationState.rotation ?? 0;
+        // Save the current rotation to restore after reload
+        const currentRotation = rotationState.rotation ?? 0;
 
-      // Convert Blob to File
-      const filename = currentFile.name || 'document.pdf';
-      const file = new File([filledBlob], filename, { type: 'application/pdf' });
+        // Convert Blob to File
+        const filename = currentFile.name || "document.pdf";
+        const file = new File([filledBlob], filename, {
+          type: "application/pdf",
+        });
 
-      // Get current file info for creating the updated version
-      const currentFileId = activeFiles[activeFileIndex]?.fileId;
-      if (!currentFileId) throw new Error('Current file ID not found');
+        // Get current file info for creating the updated version
+        const currentFileId = activeFiles[activeFileIndex]?.fileId;
+        if (!currentFileId) throw new Error("Current file ID not found");
 
-      const parentStub = selectors.getStirlingFileStub(currentFileId);
-      if (!parentStub) throw new Error('Parent stub not found');
+        const parentStub = selectors.getStirlingFileStub(currentFileId);
+        if (!parentStub) throw new Error("Parent stub not found");
 
-      // Create StirlingFiles and stubs for version history
-      const { stirlingFiles, stubs } = await createStirlingFilesAndStubs([file], parentStub, 'multiTool');
+        // Create StirlingFiles and stubs for version history
+        const { stirlingFiles, stubs } = await createStirlingFilesAndStubs(
+          [file],
+          parentStub,
+          selectedTool ?? "multiTool",
+        );
 
-      // Store the page to restore after file replacement
-      pendingScrollRestoreRef.current = pageToRestore;
-      scrollRestoreAttemptsRef.current = 0;
+        // Store the page to restore after file replacement
+        pendingScrollRestoreRef.current = pageToRestore;
+        scrollRestoreAttemptsRef.current = 0;
 
-      // Store the rotation to restore after file replacement
-      pendingRotationRestoreRef.current = currentRotation;
-      rotationRestoreAttemptsRef.current = 0;
+        // Store the rotation to restore after file replacement
+        pendingRotationRestoreRef.current = currentRotation;
+        rotationRestoreAttemptsRef.current = 0;
 
-      // Store the new file ID for tracking
-      const newFileId = stubs[0]?.id;
-      if (newFileId) {
-        pendingFileIdRef.current = newFileId;
+        // Track the new file ID so the viewer follows it after the list reorders
+        const newFileId = stubs[0]?.id;
+        if (newFileId) setActiveFileId(newFileId);
+
+        // Replace the current file in context
+        await actions.consumeFiles([currentFileId], stirlingFiles, stubs);
+
+        console.log("[Viewer] Form fill changes applied successfully");
+      } catch (error) {
+        console.error("[Viewer] Apply form changes failed:", error);
+      } finally {
+        formApplyInProgressRef.current = false;
       }
-
-      // Replace the current file in context
-      await actions.consumeFiles([currentFileId], stirlingFiles, stubs);
-
-      console.log('[Viewer] Form fill changes applied successfully');
-    } catch (error) {
-      console.error('[Viewer] Apply form changes failed:', error);
-    } finally {
-      formApplyInProgressRef.current = false;
-    }
-  }, [currentFile, activeFiles, activeFileIndex, actions, selectors, activeFileIds.length, rotationState.rotation]);
+    },
+    [
+      currentFile,
+      activeFiles,
+      activeFileIndex,
+      actions,
+      selectors,
+      activeFileIds.length,
+      rotationState.rotation,
+    ],
+  );
 
   useEffect(() => {
     const handler = (e: Event) => {
@@ -699,49 +826,64 @@ const EmbedPdfViewerContent = ({
         handleFormApply(blob);
       }
     };
-    window.addEventListener('formfill:apply', handler);
-    return () => window.removeEventListener('formfill:apply', handler);
+    window.addEventListener("formfill:apply", handler);
+    return () => window.removeEventListener("formfill:apply", handler);
   }, [handleFormApply]);
 
   // Apply layer visibility changes - reload the modified PDF into the viewer
   const layerApplyInProgressRef = useRef(false);
-  const handleLayerApply = useCallback(async (modifiedBlob: Blob) => {
-    if (layerApplyInProgressRef.current) return;
-    if (!currentFile || activeFileIds.length === 0) return;
+  const handleLayerApply = useCallback(
+    async (modifiedBlob: Blob) => {
+      if (layerApplyInProgressRef.current) return;
+      if (!currentFile || activeFileIds.length === 0) return;
 
-    layerApplyInProgressRef.current = true;
-    try {
-      const pageToRestore = lastKnownScrollPageRef.current;
-      const currentRotation = rotationState.rotation ?? 0;
+      layerApplyInProgressRef.current = true;
+      try {
+        const pageToRestore = lastKnownScrollPageRef.current;
+        const currentRotation = rotationState.rotation ?? 0;
 
-      const filename = currentFile.name || 'document.pdf';
-      const file = new File([modifiedBlob], filename, { type: 'application/pdf' });
+        const filename = currentFile.name || "document.pdf";
+        const file = new File([modifiedBlob], filename, {
+          type: "application/pdf",
+        });
 
-      const currentFileId = activeFiles[activeFileIndex]?.fileId;
-      if (!currentFileId) throw new Error('Current file ID not found');
+        const currentFileId = activeFiles[activeFileIndex]?.fileId;
+        if (!currentFileId) throw new Error("Current file ID not found");
 
-      const parentStub = selectors.getStirlingFileStub(currentFileId);
-      if (!parentStub) throw new Error('Parent stub not found');
+        const parentStub = selectors.getStirlingFileStub(currentFileId);
+        if (!parentStub) throw new Error("Parent stub not found");
 
-      const { stirlingFiles, stubs } = await createStirlingFilesAndStubs([file], parentStub, 'multiTool');
+        const { stirlingFiles, stubs } = await createStirlingFilesAndStubs(
+          [file],
+          parentStub,
+          selectedTool ?? "multiTool",
+        );
 
-      pendingScrollRestoreRef.current = pageToRestore;
-      scrollRestoreAttemptsRef.current = 0;
-      pendingRotationRestoreRef.current = currentRotation;
-      rotationRestoreAttemptsRef.current = 0;
+        pendingScrollRestoreRef.current = pageToRestore;
+        scrollRestoreAttemptsRef.current = 0;
+        pendingRotationRestoreRef.current = currentRotation;
+        rotationRestoreAttemptsRef.current = 0;
 
-      const newFileId = stubs[0]?.id;
-      if (newFileId) {
-        pendingFileIdRef.current = newFileId;
+        const newFileId = stubs[0]?.id;
+        if (newFileId) setActiveFileId(newFileId);
+
+        await actions.consumeFiles([currentFileId], stirlingFiles, stubs);
+      } catch (error) {
+        console.error("[Viewer] Apply layer changes failed:", error);
+      } finally {
+        layerApplyInProgressRef.current = false;
       }
-
-      await actions.consumeFiles([currentFileId], stirlingFiles, stubs);
-    } catch (error) {
-      console.error('[Viewer] Apply layer changes failed:', error);
-    } finally {
-      layerApplyInProgressRef.current = false;
-    }
-  }, [currentFile, activeFiles, activeFileIndex, actions, selectors, activeFileIds.length, rotationState.rotation]);
+    },
+    [
+      currentFile,
+      activeFiles,
+      activeFileIndex,
+      actions,
+      selectors,
+      activeFileIds.length,
+      rotationState.rotation,
+    ],
+  );
 
   // Discard pending redactions but save already-applied ones
   // This is called when user clicks "Discard & Leave" - we want to:
@@ -754,7 +896,9 @@ const EmbedPdfViewerContent = ({
     }
 
     try {
-      console.log('[Viewer] Discarding pending marks but saving applied redactions');
+      console.log(
+        "[Viewer] Discarding pending marks but saving applied redactions",
+      );
 
       // Save current view state to restore after file replacement
       const pageToRestore = lastKnownScrollPageRef.current;
@@ -763,22 +907,26 @@ const EmbedPdfViewerContent = ({
       // Export PDF WITHOUT committing pending marks - this saves only applied redactions
       const arrayBuffer = await exportActions.saveAsCopy();
       if (!arrayBuffer) {
-        throw new Error('Failed to export PDF');
+        throw new Error("Failed to export PDF");
       }
 
       // Convert ArrayBuffer to File
-      const blob = new Blob([arrayBuffer], { type: 'application/pdf' });
-      const filename = currentFile.name || 'document.pdf';
-      const file = new File([blob], filename, { type: 'application/pdf' });
+      const blob = new Blob([arrayBuffer], { type: "application/pdf" });
+      const filename = currentFile.name || "document.pdf";
+      const file = new File([blob], filename, { type: "application/pdf" });
 
       // Create StirlingFiles and stubs for version history
       const currentFileId = activeFiles[activeFileIndex]?.fileId;
-      if (!currentFileId) throw new Error('Current file ID not found');
+      if (!currentFileId) throw new Error("Current file ID not found");
 
       const parentStub = selectors.getStirlingFileStub(currentFileId);
-      if (!parentStub) throw new Error('Parent stub not found');
+      if (!parentStub) throw new Error("Parent stub not found");
 
-      const { stirlingFiles, stubs } = await createStirlingFilesAndStubs([file], parentStub, 'multiTool');
+      const { stirlingFiles, stubs } = await createStirlingFilesAndStubs(
+        [file],
+        parentStub,
+        selectedTool ?? "multiTool",
+      );
 
       // Store view state to restore after file replacement
       pendingScrollRestoreRef.current = pageToRestore;
@@ -793,11 +941,50 @@ const EmbedPdfViewerContent = ({
       hasAnnotationChangesRef.current = false;
       setRedactionsApplied(false);
 
-      console.log('[Viewer] Applied redactions saved, pending marks discarded');
+      console.log("[Viewer] Applied redactions saved, pending marks discarded");
     } catch (error) {
-      console.error('Failed to save applied redactions:', error);
+      console.error("Failed to save applied redactions:", error);
     }
-  }, [redactionsApplied, currentFile, activeFiles, activeFileIndex, activeFileIds.length, exportActions, actions, selectors, setRedactionsApplied, rotationState.rotation]);
+  }, [
+    redactionsApplied,
+    currentFile,
+    activeFiles,
+    activeFileIndex,
+    activeFileIds.length,
+    exportActions,
+    actions,
+    selectors,
+    setRedactionsApplied,
+    rotationState.rotation,
+  ]);
+
+  // Register navigation warning handlers so the global modal can call our save/discard logic
+  useEffect(() => {
+    if (previewFile) return;
+
+    registerNavigationWarningHandlers({
+      onApplyAndContinue: async () => {
+        await applyChanges();
+      },
+      onDiscardAndContinue: async () => {
+        await discardAndSaveApplied();
+        const historyApi = historyApiRef.current;
+        if (historyApi?.canUndo) {
+          while (historyApi.canUndo()) {
+            historyApi.undo?.();
+          }
+        }
+        hasAnnotationChangesRef.current = false;
+      },
+    });
+    return () => unregisterNavigationWarningHandlers();
+  }, [
+    previewFile,
+    applyChanges,
+    discardAndSaveApplied,
+    registerNavigationWarningHandlers,
+    unregisterNavigationWarningHandlers,
+  ]);
 
   // Restore scroll position after file replacement or tool switch
   // Uses polling with retries to ensure the scroll succeeds
@@ -814,12 +1001,15 @@ const EmbedPdfViewerContent = ({
 
       // Only attempt if we have valid state (totalPages > 0 means PDF is loaded)
       if (currentState.totalPages > 0 && targetPage > 0) {
-        scrollActions.scrollToPage(targetPage, 'instant');
+        scrollActions.scrollToPage(targetPage, "instant");
 
         // Check if scroll succeeded after a brief delay
         setTimeout(() => {
           const afterState = getScrollState();
-          if (afterState.currentPage === targetPage || scrollRestoreAttemptsRef.current >= maxAttempts) {
+          if (
+            afterState.currentPage === targetPage ||
+            scrollRestoreAttemptsRef.current >= maxAttempts
+          ) {
             // Success or max attempts reached - clear pending
             pendingScrollRestoreRef.current = null;
             scrollRestoreAttemptsRef.current = 0;
@@ -870,7 +1060,10 @@ const EmbedPdfViewerContent = ({
         // Check if rotation succeeded after a brief delay
         setTimeout(() => {
           const currentRotation = rotationActions.getRotation();
-          if (currentRotation === rotationToRestore || rotationRestoreAttemptsRef.current >= maxAttempts) {
+          if (
+            currentRotation === rotationToRestore ||
+            rotationRestoreAttemptsRef.current >= maxAttempts
+          ) {
             // Success or max attempts reached - clear pending
             pendingRotationRestoreRef.current = null;
             rotationRestoreAttemptsRef.current = 0;
@@ -912,14 +1105,22 @@ const EmbedPdfViewerContent = ({
 
   // Ruler / measurement tool state
   const [isRulerActive, setIsRulerActive] = useState(false);
-  const [pageMeasureScales, setPageMeasureScales] = useState<PageMeasureScales | null>(null);
+  const [pageMeasureScales, setPageMeasureScales] =
+    useState<PageMeasureScales | null>(null);
 
   useEffect(() => {
     const file = effectiveFile?.file;
-    if (!file) { setPageMeasureScales(null); return; }
+    if (!file) {
+      setPageMeasureScales(null);
+      return;
+    }
     let cancelled = false;
-    extractPageMeasureScales(file).then(scales => { if (!cancelled) setPageMeasureScales(scales); });
-    return () => { cancelled = true; };
+    extractPageMeasureScales(file).then((scales) => {
+      if (!cancelled) setPageMeasureScales(scales);
+    });
+    return () => {
+      cancelled = true;
+    };
   }, [effectiveFile]);
 
   // Register viewer right-rail buttons
@@ -938,11 +1139,17 @@ const EmbedPdfViewerContent = ({
 
   useEffect(() => {
     const fileChanged = currentFileId !== formFillFileIdRef.current;
-    const providerChanged = formFillProviderRef.current !== isFormFillToolActive;
+    const providerChanged =
+      formFillProviderRef.current !== isFormFillToolActive;
     formFillProviderRef.current = isFormFillToolActive;
 
     if (fileChanged) {
-      console.log('[FormFill] File changed. Old:', formFillFileIdRef.current, 'New:', currentFileId);
+      console.log(
+        "[FormFill] File changed. Old:",
+        formFillFileIdRef.current,
+        "New:",
+        currentFileId,
+      );
       formFillFileIdRef.current = currentFileId;
       // NOTE: Don't call resetFormFill() here — fetchFormFields() handles
       // clearing old state internally. Calling reset() before fetch() would
@@ -951,10 +1158,16 @@ const EmbedPdfViewerContent = ({
     }
 
     if (currentFile && (fileChanged || providerChanged)) {
-      console.log('[FormFill] Fetching form fields for:', currentFileId);
+      console.log("[FormFill] Fetching form fields for:", currentFileId);
       fetchFormFields(currentFile, currentFileId ?? undefined);
     }
-  }, [isFormFillToolActive, currentFile, currentFileId, fetchFormFields]);
+  }, [
+    isFormFillToolActive,
+    currentFile,
+    currentFileId,
+    fetchFormFields,
+    isCurrentFileEncrypted,
+  ]);
 
   const sidebarWidthRem = 15;
   const commentsSidebarWidthRem = 18;
@@ -971,20 +1184,27 @@ const EmbedPdfViewerContent = ({
       onMouseEnter={() => setIsViewerHovered(true)}
       onMouseLeave={() => setIsViewerHovered(false)}
       style={{
-        position: 'relative',
-        height: '100%',
-        display: 'flex',
-        flexDirection: 'column',
-        overflow: 'hidden',
-        contain: 'layout style paint'
-      }}>
+        position: "relative",
+        height: "100%",
+        display: "flex",
+        flexDirection: "column",
+        overflow: "hidden",
+        contain: "layout style paint",
+      }}
+    >
       {/* Close Button - Only show in preview mode */}
       {onClose && previewFile && (
         <ActionIcon
           variant="filled"
           color="gray"
           size="lg"
-          style={{ position: 'absolute', top: '1rem', right: '1rem', zIndex: 1000, borderRadius: '50%' }}
+          style={{
+            position: "absolute",
+            top: "1rem",
+            right: "1rem",
+            zIndex: 1000,
+            borderRadius: "50%",
+          }}
           onClick={onClose}
         >
           <CloseIcon />
@@ -995,32 +1215,54 @@ const EmbedPdfViewerContent = ({
         <Center style={{ flex: 1 }}>
           <Text c="red">Error: No file provided to viewer</Text>
         </Center>
+      ) : isCurrentFileEncrypted ? (
+        <Center style={{ flex: 1 }}>
+          <Stack align="center" gap="md">
+            <LockIcon style={{ fontSize: 48, opacity: 0.5 }} />
+            <Text fw={500}>This PDF is password-protected</Text>
+            <Button
+              variant="filled"
+              onClick={() => {
+                if (currentFile && isStirlingFile(currentFile)) {
+                  actions.openEncryptedUnlockPrompt(currentFile.fileId);
+                }
+              }}
+            >
+              Unlock
+            </Button>
+          </Stack>
+        </Center>
       ) : (
         <>
           {/* EmbedPDF Viewer */}
           <Box
             ref={pdfContainerRef}
             style={{
-              position: 'relative',
+              position: "relative",
               flex: 1,
-              overflow: 'hidden',
+              overflow: "hidden",
               minHeight: 0,
               minWidth: 0,
               marginRight: `${totalRightMargin}rem`,
-              transition: 'margin-right 0.3s ease'
-            }}>
+              transition: "margin-right 0.3s ease",
+            }}
+          >
             <LocalEmbedPDF
-              key={currentFileId || 'no-file'}
+              key={currentFileId || "no-file"}
               pdfRenderMode={pdfRenderMode}
               file={effectiveFile.file}
               url={effectiveFile.url}
               fileName={
-                previewFile ? previewFile.name :
-                (currentFile && isStirlingFile(currentFile) ? currentFile.name :
-                (effectiveFile?.file instanceof File ? effectiveFile.file.name : undefined))
+                previewFile
+                  ? previewFile.name
+                  : currentFile && isStirlingFile(currentFile)
+                    ? currentFile.name
+                    : effectiveFile?.file instanceof File
+                      ? effectiveFile.file.name
+                      : undefined
               }
               enableAnnotations={shouldEnableAnnotations}
-              isSignMode={selectedTool === 'sign'}
+              isSignMode={selectedTool === "sign"}
               showBakedAnnotations={isAnnotationsVisible}
               enableRedaction={shouldEnableRedaction}
               enableFormFill={shouldEnableFormFill}
@@ -1028,7 +1270,9 @@ const EmbedPdfViewerContent = ({
               signatureApiRef={signatureApiRef as React.RefObject<any>}
               annotationApiRef={annotationApiRef as React.RefObject<any>}
               historyApiRef={historyApiRef as React.RefObject<any>}
-              redactionTrackerRef={redactionTrackerRef as React.RefObject<RedactionPendingTrackerAPI>}
+              redactionTrackerRef={
+                redactionTrackerRef as React.RefObject<RedactionPendingTrackerAPI>
+              }
               fileId={currentFileId}
               isCommentsSidebarVisible={isCommentsSidebarVisible}
               commentsSidebarRightOffset={`${(isThumbnailSidebarVisible ? sidebarWidthRem : 0) + (isBookmarkSidebarVisible ? sidebarWidthRem : 0) + (isAttachmentSidebarVisible ? sidebarWidthRem : 0) + (isLayerSidebarVisible ? sidebarWidthRem : 0)}rem`}
@@ -1081,7 +1325,6 @@ const EmbedPdfViewerContent = ({
         </div>
       )}
 
-
       {/* Thumbnail Sidebar */}
       <ThumbnailSidebar
         visible={isThumbnailSidebarVisible}
@@ -1113,29 +1356,12 @@ const EmbedPdfViewerContent = ({
         onApplyLayers={handleLayerApply}
         onLayersDetected={setHasLayers}
       />
-
-      {/* Navigation Warning Modal */}
-      {!previewFile && (
-        <NavigationWarningModal
-          onApplyAndContinue={async () => {
-            await applyChanges();
-          }}
-          onDiscardAndContinue={async () => {
-            // Save applied redactions (if any) while discarding pending ones
-            await discardAndSaveApplied();
-            // Reset annotation changes ref so future show/hide doesn't re-prompt
-            hasAnnotationChangesRef.current = false;
-          }}
-        />
-      )}
     </Box>
   );
 };
 
 const EmbedPdfViewer = (props: EmbedPdfViewerProps) => {
-  return (
-    <EmbedPdfViewerContent {...props} />
-  );
+  return <EmbedPdfViewerContent {...props} />;
 };
 
 export default EmbedPdfViewer;
diff --git a/frontend/src/core/components/viewer/ExportAPIBridge.tsx b/frontend/src/core/components/viewer/ExportAPIBridge.tsx
index 9ae2b1bb41..ec81bef5e6 100644
--- a/frontend/src/core/components/viewer/ExportAPIBridge.tsx
+++ b/frontend/src/core/components/viewer/ExportAPIBridge.tsx
@@ -1,7 +1,7 @@
-import { useEffect } from 'react';
-import { useExportCapability } from '@embedpdf/plugin-export/react';
-import { useViewer } from '@app/contexts/ViewerContext';
-import { useDocumentReady } from '@app/components/viewer/hooks/useDocumentReady';
+import { useEffect } from "react";
+import { useExportCapability } from "@embedpdf/plugin-export/react";
+import { useViewer } from "@app/contexts/ViewerContext";
+import { useDocumentReady } from "@app/components/viewer/hooks/useDocumentReady";
 
 /**
  * Component that runs inside EmbedPDF context and provides export functionality
@@ -14,16 +14,16 @@ export function ExportAPIBridge() {
   useEffect(() => {
     if (exportApi && documentReady) {
       // Register this bridge with ViewerContext
-      registerBridge('export', {
+      registerBridge("export", {
         state: {
           canExport: true,
         },
-        api: exportApi
+        api: exportApi,
       });
     }
 
     return () => {
-      registerBridge('export', null);
+      registerBridge("export", null);
     };
   }, [exportApi, documentReady, registerBridge]);
 
diff --git a/frontend/src/core/components/viewer/HistoryAPIBridge.tsx b/frontend/src/core/components/viewer/HistoryAPIBridge.tsx
index e6fed94713..82cf1a23c1 100644
--- a/frontend/src/core/components/viewer/HistoryAPIBridge.tsx
+++ b/frontend/src/core/components/viewer/HistoryAPIBridge.tsx
@@ -1,183 +1,234 @@
-import { useImperativeHandle, forwardRef, useEffect, useRef } from 'react';
-import { useHistoryCapability } from '@embedpdf/plugin-history/react';
-import { useAnnotationCapability } from '@embedpdf/plugin-annotation/react';
-import { useSignature } from '@app/contexts/SignatureContext';
-import { uuidV4, PdfAnnotationSubtype } from '@embedpdf/models';
-import type { HistoryAPI } from '@app/components/viewer/viewerTypes';
-import { ANNOTATION_RECREATION_DELAY_MS, ANNOTATION_VERIFICATION_DELAY_MS } from '@app/constants/app';
-import { useDocumentReady } from '@app/components/viewer/hooks/useDocumentReady';
+import { useImperativeHandle, forwardRef, useEffect, useRef } from "react";
+import { useHistoryCapability } from "@embedpdf/plugin-history/react";
+import { useAnnotationCapability } from "@embedpdf/plugin-annotation/react";
+import { useSignature } from "@app/contexts/SignatureContext";
+import { uuidV4, PdfAnnotationSubtype } from "@embedpdf/models";
+import type { HistoryAPI } from "@app/components/viewer/viewerTypes";
+import {
+  ANNOTATION_RECREATION_DELAY_MS,
+  ANNOTATION_VERIFICATION_DELAY_MS,
+} from "@app/constants/app";
+import { useDocumentReady } from "@app/components/viewer/hooks/useDocumentReady";
 
 /**
  * Connects the PDF history (undo/redo) plugin to the shared ViewerContext.
  */
 
-export const HistoryAPIBridge = forwardRef<HistoryAPI>(function HistoryAPIBridge(_, ref) {
-  const { provides: historyApi } = useHistoryCapability();
-  const { provides: annotationApi } = useAnnotationCapability();
-  const { getImageData, storeImageData } = useSignature();
-  const documentReady = useDocumentReady();
-  const restoringIds = useRef<Set<string>>(new Set());
+export const HistoryAPIBridge = forwardRef<HistoryAPI>(
+  function HistoryAPIBridge(_, ref) {
+    const { provides: historyApi } = useHistoryCapability();
+    const { provides: annotationApi } = useAnnotationCapability();
+    const { getImageData, storeImageData } = useSignature();
+    const documentReady = useDocumentReady();
+    const restoringIds = useRef<Set<string>>(new Set());
 
-  // Monitor annotation events to detect when annotations are restored
-  useEffect(() => {
-    if (!annotationApi || !documentReady) return;
+    // Monitor annotation events to detect when annotations are restored
+    useEffect(() => {
+      if (!annotationApi || !documentReady) return;
 
-    const handleAnnotationEvent = (event: any) => {
-      const annotation = event.annotation;
+      const handleAnnotationEvent = (event: any) => {
+        const annotation = event.annotation;
 
-      // Store image data for all STAMP annotations immediately when created or modified
-      if (annotation && annotation.type === PdfAnnotationSubtype.STAMP && annotation.id && annotation.imageSrc) {
-        const storedImageData = getImageData(annotation.id);
-        if (!storedImageData) {
-          storeImageData(annotation.id, annotation.imageSrc);
-        }
-      }
-
-      if (annotation && annotation.type === PdfAnnotationSubtype.STAMP && annotation.id) {
-        // Prevent infinite loops when we recreate annotations
-        if (restoringIds.current.has(annotation.id)) {
-          restoringIds.current.delete(annotation.id);
-          return;
-        }
-
-        const storedImageData = getImageData(annotation.id);
-        // If EmbedPDF cropped the image (imageSrc changed), recreate annotation using stored data
-        if (storedImageData && annotation.imageSrc && annotation.imageSrc !== storedImageData) {
-          const newId = uuidV4();
-          restoringIds.current.add(newId);
-          storeImageData(newId, storedImageData);
-
-          const pageIndex = event.pageIndex ?? annotation.pageIndex ?? annotation.object?.pageIndex ?? 0;
-          const rect = annotation.rect || annotation.bounds || annotation.rectangle || annotation.position;
-
-          try {
-            annotationApi.deleteAnnotation(pageIndex, annotation.id);
-            setTimeout(() => {
-              annotationApi.createAnnotation(pageIndex, {
-                type: annotation.type,
-                rect,
-                author: annotation.author || 'Digital Signature',
-                subject: annotation.subject || 'Digital Signature',
-                pageIndex,
-                id: newId,
-                created: annotation.created || new Date(),
-                imageSrc: storedImageData,
-                contents: storedImageData,
-                data: storedImageData,
-                appearance: storedImageData,
-              });
-            }, ANNOTATION_RECREATION_DELAY_MS);
-          } catch (restoreError) {
-            console.error('HistoryAPI: Failed to restore cropped signature:', restoreError);
+        // Store image data for all STAMP annotations immediately when created or modified
+        if (
+          annotation &&
+          annotation.type === PdfAnnotationSubtype.STAMP &&
+          annotation.id &&
+          annotation.imageSrc
+        ) {
+          const storedImageData = getImageData(annotation.id);
+          if (!storedImageData) {
+            storeImageData(annotation.id, annotation.imageSrc);
           }
-          return;
         }
-      }
 
-      // Handle annotation restoration after undo operations
-      if (event.type === 'create' && event.committed) {
-        // Check if this is a STAMP annotation (signature) that might need image data restoration
-        if (annotation && annotation.type === PdfAnnotationSubtype.STAMP && annotation.id) {
-          getImageData(annotation.id);
+        if (
+          annotation &&
+          annotation.type === PdfAnnotationSubtype.STAMP &&
+          annotation.id
+        ) {
+          // Prevent infinite loops when we recreate annotations
+          if (restoringIds.current.has(annotation.id)) {
+            restoringIds.current.delete(annotation.id);
+            return;
+          }
 
-          // Delay the check to allow the annotation to be fully created
-          setTimeout(() => {
-            const currentStoredData = getImageData(annotation.id);
-            // Check if the annotation lacks image data but we have it stored
-            if (currentStoredData && (!annotation.imageSrc || annotation.imageSrc !== currentStoredData)) {
+          const storedImageData = getImageData(annotation.id);
+          // If EmbedPDF cropped the image (imageSrc changed), recreate annotation using stored data
+          if (
+            storedImageData &&
+            annotation.imageSrc &&
+            annotation.imageSrc !== storedImageData
+          ) {
+            const newId = uuidV4();
+            restoringIds.current.add(newId);
+            storeImageData(newId, storedImageData);
 
-              // Generate new ID to avoid React key conflicts
-              const newId = uuidV4();
+            const pageIndex =
+              event.pageIndex ??
+              annotation.pageIndex ??
+              annotation.object?.pageIndex ??
+              0;
+            const rect =
+              annotation.rect ||
+              annotation.bounds ||
+              annotation.rectangle ||
+              annotation.position;
 
-              // Recreation with stored image data
-              const restoredData = {
-                type: annotation.type,
-                rect: annotation.rect,
-                author: annotation.author || 'Digital Signature',
-                subject: annotation.subject || 'Digital Signature',
-                pageIndex: event.pageIndex,
-                id: newId,
-                created: annotation.created || new Date(),
-                imageSrc: currentStoredData
-              };
-
-              // Update stored data to use new ID
-              storeImageData(newId, currentStoredData);
-
-              // Replace the annotation with one that has proper image data
-              try {
-                annotationApi.deleteAnnotation(event.pageIndex, annotation.id);
-                // Small delay to ensure deletion completes
-                setTimeout(() => {
-                  annotationApi.createAnnotation(event.pageIndex, restoredData);
-                }, ANNOTATION_RECREATION_DELAY_MS);
-              } catch (error) {
-                console.error('HistoryAPI: Failed to restore annotation:', error);
-              }
+            try {
+              annotationApi.deleteAnnotation(pageIndex, annotation.id);
+              setTimeout(() => {
+                annotationApi.createAnnotation(pageIndex, {
+                  type: annotation.type,
+                  rect,
+                  author: annotation.author || "Digital Signature",
+                  subject: annotation.subject || "Digital Signature",
+                  pageIndex,
+                  id: newId,
+                  created: annotation.created || new Date(),
+                  imageSrc: storedImageData,
+                  contents: storedImageData,
+                  data: storedImageData,
+                  appearance: storedImageData,
+                });
+              }, ANNOTATION_RECREATION_DELAY_MS);
+            } catch (restoreError) {
+              console.error(
+                "HistoryAPI: Failed to restore cropped signature:",
+                restoreError,
+              );
             }
-          }, ANNOTATION_VERIFICATION_DELAY_MS);
+            return;
+          }
         }
-      }
-    };
 
-    // Add the event listener
-    annotationApi.onAnnotationEvent(handleAnnotationEvent);
+        // Handle annotation restoration after undo operations
+        if (event.type === "create" && event.committed) {
+          // Check if this is a STAMP annotation (signature) that might need image data restoration
+          if (
+            annotation &&
+            annotation.type === PdfAnnotationSubtype.STAMP &&
+            annotation.id
+          ) {
+            getImageData(annotation.id);
 
-    // Cleanup function
-    return () => {
-      // Note: EmbedPDF doesn't provide a way to remove event listeners
-      // This is a limitation of the current API
-    };
-  }, [annotationApi, getImageData, storeImageData]);
+            // Delay the check to allow the annotation to be fully created
+            setTimeout(() => {
+              const currentStoredData = getImageData(annotation.id);
+              // Check if the annotation lacks image data but we have it stored
+              if (
+                currentStoredData &&
+                (!annotation.imageSrc ||
+                  annotation.imageSrc !== currentStoredData)
+              ) {
+                // Generate new ID to avoid React key conflicts
+                const newId = uuidV4();
 
+                // Recreation with stored image data
+                const restoredData = {
+                  type: annotation.type,
+                  rect: annotation.rect,
+                  author: annotation.author || "Digital Signature",
+                  subject: annotation.subject || "Digital Signature",
+                  pageIndex: event.pageIndex,
+                  id: newId,
+                  created: annotation.created || new Date(),
+                  imageSrc: currentStoredData,
+                };
 
-  useImperativeHandle(ref, () => ({
-    undo: () => {
-      if (historyApi) {
-        historyApi.undo();
-      }
-    },
+                // Update stored data to use new ID
+                storeImageData(newId, currentStoredData);
 
-    redo: () => {
-      if (historyApi) {
-        historyApi.redo();
-      }
-    },
+                // Replace the annotation with one that has proper image data
+                try {
+                  annotationApi.deleteAnnotation(
+                    event.pageIndex,
+                    annotation.id,
+                  );
+                  // Small delay to ensure deletion completes
+                  setTimeout(() => {
+                    annotationApi.createAnnotation(
+                      event.pageIndex,
+                      restoredData,
+                    );
+                  }, ANNOTATION_RECREATION_DELAY_MS);
+                } catch (error) {
+                  console.error(
+                    "HistoryAPI: Failed to restore annotation:",
+                    error,
+                  );
+                }
+              }
+            }, ANNOTATION_VERIFICATION_DELAY_MS);
+          }
+        }
+      };
 
-    canUndo: () => {
-      return historyApi ? historyApi.canUndo() : false;
-    },
+      // Add the event listener
+      annotationApi.onAnnotationEvent(handleAnnotationEvent);
 
-    canRedo: () => {
-      return historyApi ? historyApi.canRedo() : false;
-    },
+      // Cleanup function
+      return () => {
+        // Note: EmbedPDF doesn't provide a way to remove event listeners
+        // This is a limitation of the current API
+      };
+    }, [annotationApi, getImageData, storeImageData]);
 
-    isReady: () => !!historyApi && documentReady,
+    useImperativeHandle(
+      ref,
+      () => ({
+        undo: () => {
+          if (historyApi) {
+            historyApi.undo();
+          }
+        },
 
-    purgeByMetadata: <T,>(predicate: (metadata: T | undefined) => boolean, topic?: string) => {
-      if (historyApi?.purgeByMetadata) {
-        return historyApi.purgeByMetadata(predicate, topic);
-      }
-      return 0;
-    },
+        redo: () => {
+          if (historyApi) {
+            historyApi.redo();
+          }
+        },
 
-    subscribe: (listener: () => void) => {
-      if (!historyApi?.onHistoryChange) {
-        return () => {};
-      }
+        canUndo: () => {
+          return historyApi ? historyApi.canUndo() : false;
+        },
 
-      const wrapped = () => listener();
-      const unsubscribe = historyApi.onHistoryChange(wrapped);
-      listener();
+        canRedo: () => {
+          return historyApi ? historyApi.canRedo() : false;
+        },
 
-      if (typeof unsubscribe === 'function') {
-        return unsubscribe;
-      }
-      return () => {};
-    },
-  }), [historyApi]);
+        isReady: () => !!historyApi && documentReady,
 
-  return null; // This is a bridge component with no UI
-});
+        purgeByMetadata: <T,>(
+          predicate: (metadata: T | undefined) => boolean,
+          topic?: string,
+        ) => {
+          if (historyApi?.purgeByMetadata) {
+            return historyApi.purgeByMetadata(predicate, topic);
+          }
+          return 0;
+        },
 
-HistoryAPIBridge.displayName = 'HistoryAPIBridge';
+        subscribe: (listener: () => void) => {
+          if (!historyApi?.onHistoryChange) {
+            return () => {};
+          }
+
+          const wrapped = () => listener();
+          const unsubscribe = historyApi.onHistoryChange(wrapped);
+          listener();
+
+          if (typeof unsubscribe === "function") {
+            return unsubscribe;
+          }
+          return () => {};
+        },
+      }),
+      [historyApi],
+    );
+
+    return null; // This is a bridge component with no UI
+  },
+);
+
+HistoryAPIBridge.displayName = "HistoryAPIBridge";
diff --git a/frontend/src/core/components/viewer/LayerSidebar.css b/frontend/src/core/components/viewer/LayerSidebar.css
index 66d0d90862..40ff79ae9b 100644
--- a/frontend/src/core/components/viewer/LayerSidebar.css
+++ b/frontend/src/core/components/viewer/LayerSidebar.css
@@ -28,7 +28,9 @@
   padding: 0.375rem 0.65rem;
   border-radius: 0.5rem;
   cursor: pointer;
-  transition: background 0.15s ease, border-color 0.15s ease;
+  transition:
+    background 0.15s ease,
+    border-color 0.15s ease;
   background: transparent;
   border: 1px solid transparent;
   width: 100%;
@@ -37,7 +39,11 @@
 
 .layer-item:hover {
   background: color-mix(in srgb, var(--text-primary) 6%, var(--bg-toolbar));
-  border-color: color-mix(in srgb, var(--text-primary) 14%, var(--border-subtle));
+  border-color: color-mix(
+    in srgb,
+    var(--text-primary) 14%,
+    var(--border-subtle)
+  );
 }
 
 .layer-item:active {
@@ -90,7 +96,8 @@
   flex-direction: column;
   gap: 0.125rem;
   margin-top: 0.125rem;
-  border-left: 2px solid color-mix(in srgb, var(--border-subtle) 60%, transparent);
+  border-left: 2px solid
+    color-mix(in srgb, var(--border-subtle) 60%, transparent);
   margin-left: 0.875rem;
   padding-left: 0.25rem;
 }
diff --git a/frontend/src/core/components/viewer/LayerSidebar.tsx b/frontend/src/core/components/viewer/LayerSidebar.tsx
index 0234b49318..cc282632a3 100644
--- a/frontend/src/core/components/viewer/LayerSidebar.tsx
+++ b/frontend/src/core/components/viewer/LayerSidebar.tsx
@@ -1,13 +1,26 @@
-import { useState, useEffect, useCallback, useRef } from 'react';
-import { Box, ScrollArea, Text, Checkbox, Stack, Loader, ActionIcon, Tooltip } from '@mantine/core';
-import LayersIcon from '@mui/icons-material/Layers';
-import VisibilityIcon from '@mui/icons-material/Visibility';
-import VisibilityOffIcon from '@mui/icons-material/VisibilityOff';
-import '@app/components/viewer/SidebarBase.css';
-import '@app/components/viewer/LayerSidebar.css';
-import { readPdfLayers, applyOCGVisibilityToPdf, collectLeafIds } from '@app/components/viewer/layerUtils';
+import { useState, useEffect, useCallback, useRef } from "react";
+import {
+  Box,
+  ScrollArea,
+  Text,
+  Checkbox,
+  Stack,
+  Loader,
+  ActionIcon,
+  Tooltip,
+} from "@mantine/core";
+import LayersIcon from "@mui/icons-material/Layers";
+import VisibilityIcon from "@mui/icons-material/Visibility";
+import VisibilityOffIcon from "@mui/icons-material/VisibilityOff";
+import "@app/components/viewer/SidebarBase.css";
+import "@app/components/viewer/LayerSidebar.css";
+import {
+  readPdfLayers,
+  applyOCGVisibilityToPdf,
+  collectLeafIds,
+} from "@app/components/viewer/layerUtils";
 
-import type { LayerInfo } from '@app/components/viewer/layerUtils';
+import type { LayerInfo } from "@app/components/viewer/layerUtils";
 export type { LayerInfo };
 
 interface LayerSidebarProps {
@@ -24,9 +37,9 @@ interface LayerSidebarProps {
   onLayersDetected?: (hasLayers: boolean) => void;
 }
 
-const SIDEBAR_WIDTH = '15rem';
+const SIDEBAR_WIDTH = "15rem";
 
-type LoadStatus = 'idle' | 'loading' | 'ready' | 'no-layers' | 'error';
+type LoadStatus = "idle" | "loading" | "ready" | "no-layers" | "error";
 
 export function LayerSidebar({
   visible,
@@ -38,7 +51,7 @@ export function LayerSidebar({
 }: LayerSidebarProps) {
   const [layers, setLayers] = useState<LayerInfo[]>([]);
   const [visibility, setVisibility] = useState<Record<string, boolean>>({});
-  const [status, setStatus] = useState<LoadStatus>('idle');
+  const [status, setStatus] = useState<LoadStatus>("idle");
   const [loadError, setLoadError] = useState<string | null>(null);
   const [isApplying, setIsApplying] = useState(false);
   const [expanded, setExpanded] = useState<Record<string, boolean>>({});
@@ -49,7 +62,7 @@ export function LayerSidebar({
   // Load layers when the document changes
   useEffect(() => {
     if (!file || !documentCacheKey) {
-      setStatus('idle');
+      setStatus("idle");
       setLayers([]);
       setVisibility({});
       loadedKeyRef.current = null;
@@ -60,18 +73,18 @@ export function LayerSidebar({
 
     if (loadedKeyRef.current === documentCacheKey) return;
 
-    setStatus('loading');
+    setStatus("loading");
     setLoadError(null);
     userChangedRef.current = false;
 
     let cancelled = false;
 
     readPdfLayers(file)
-      .then(layerList => {
+      .then((layerList) => {
         if (cancelled) return;
 
         if (layerList.length === 0) {
-          setStatus('no-layers');
+          setStatus("no-layers");
           setLayers([]);
           setVisibility({});
           loadedKeyRef.current = documentCacheKey;
@@ -94,14 +107,16 @@ export function LayerSidebar({
 
         setLayers(layerList);
         setVisibility(visMap);
-        setStatus('ready');
+        setStatus("ready");
         loadedKeyRef.current = documentCacheKey;
         onLayersDetected?.(true);
       })
-      .catch(err => {
+      .catch((err) => {
         if (cancelled) return;
-        setStatus('error');
-        setLoadError(err instanceof Error ? err.message : 'Failed to read PDF layers');
+        setStatus("error");
+        setLoadError(
+          err instanceof Error ? err.message : "Failed to read PDF layers",
+        );
         onLayersDetected?.(false);
       });
 
@@ -118,7 +133,8 @@ export function LayerSidebar({
 
   // Auto-apply: debounce visibility changes from user interaction
   useEffect(() => {
-    if (!userChangedRef.current || !file || isApplying || layers.length === 0) return;
+    if (!userChangedRef.current || !file || isApplying || layers.length === 0)
+      return;
 
     const timer = setTimeout(async () => {
       setIsApplying(true);
@@ -136,12 +152,17 @@ export function LayerSidebar({
         collectNames(layers);
 
         const arrayBuffer = await file.arrayBuffer();
-        const modifiedBytes = await applyOCGVisibilityToPdf(arrayBuffer, nameVisibility);
-        const blob = new Blob([new Uint8Array(modifiedBytes)], { type: 'application/pdf' });
+        const modifiedBytes = await applyOCGVisibilityToPdf(
+          arrayBuffer,
+          nameVisibility,
+        );
+        const blob = new Blob([new Uint8Array(modifiedBytes)], {
+          type: "application/pdf",
+        });
 
         await onApplyLayers(blob);
       } catch (err) {
-        console.error('[LayerSidebar] Failed to apply layer changes:', err);
+        console.error("[LayerSidebar] Failed to apply layer changes:", err);
       } finally {
         setIsApplying(false);
         userChangedRef.current = false;
@@ -153,12 +174,12 @@ export function LayerSidebar({
 
   const toggleLayerVisibility = useCallback((id: string) => {
     userChangedRef.current = true;
-    setVisibility(prev => ({ ...prev, [id]: !prev[id] }));
+    setVisibility((prev) => ({ ...prev, [id]: !prev[id] }));
   }, []);
 
   const showAll = useCallback(() => {
     userChangedRef.current = true;
-    setVisibility(prev => {
+    setVisibility((prev) => {
       const updated: Record<string, boolean> = {};
       for (const id of Object.keys(prev)) {
         updated[id] = true;
@@ -169,7 +190,7 @@ export function LayerSidebar({
 
   const hideAll = useCallback(() => {
     userChangedRef.current = true;
-    setVisibility(prev => {
+    setVisibility((prev) => {
       const updated: Record<string, boolean> = {};
       for (const id of Object.keys(prev)) {
         updated[id] = false;
@@ -179,7 +200,7 @@ export function LayerSidebar({
   }, []);
 
   const toggleExpanded = useCallback((id: string) => {
-    setExpanded(prev => ({ ...prev, [id]: !(prev[id] ?? true) }));
+    setExpanded((prev) => ({ ...prev, [id]: !(prev[id] ?? true) }));
   }, []);
 
   const renderLayer = (layer: LayerInfo & { depth: number }) => {
@@ -188,17 +209,21 @@ export function LayerSidebar({
     const isLeaf = !hasChildren;
 
     const isVisible = isLeaf
-      ? visibility[layer.id] ?? layer.visible
-      : collectLeafIds(layer.children ?? []).every(id => visibility[id] ?? true);
+      ? (visibility[layer.id] ?? layer.visible)
+      : collectLeafIds(layer.children ?? []).every(
+          (id) => visibility[id] ?? true,
+        );
 
     return (
       <div
         key={layer.id}
         className="layer-item-wrapper"
-        style={{ marginLeft: layer.depth > 0 ? `${layer.depth * 0.875}rem` : '0' }}
+        style={{
+          marginLeft: layer.depth > 0 ? `${layer.depth * 0.875}rem` : "0",
+        }}
       >
         <div
-          className={`layer-item ${!isVisible ? 'layer-item--hidden' : ''}`}
+          className={`layer-item ${!isVisible ? "layer-item--hidden" : ""}`}
           onClick={() => {
             if (hasChildren) {
               toggleExpanded(layer.id);
@@ -208,8 +233,8 @@ export function LayerSidebar({
           }}
           role="button"
           tabIndex={0}
-          onKeyDown={e => {
-            if (e.key === 'Enter' || e.key === ' ') {
+          onKeyDown={(e) => {
+            if (e.key === "Enter" || e.key === " ") {
               e.preventDefault();
               if (hasChildren) {
                 toggleExpanded(layer.id);
@@ -222,17 +247,27 @@ export function LayerSidebar({
           {hasChildren ? (
             <span
               className="layer-item__expand-btn"
-              onClick={e => {
+              onClick={(e) => {
                 e.stopPropagation();
                 toggleExpanded(layer.id);
               }}
             >
               {isExpanded ? (
-                <svg width="12" height="12" viewBox="0 0 12 12" fill="currentColor">
+                <svg
+                  width="12"
+                  height="12"
+                  viewBox="0 0 12 12"
+                  fill="currentColor"
+                >
                   <path d="M2 4l4 4 4-4z" />
                 </svg>
               ) : (
-                <svg width="12" height="12" viewBox="0 0 12 12" fill="currentColor">
+                <svg
+                  width="12"
+                  height="12"
+                  viewBox="0 0 12 12"
+                  fill="currentColor"
+                >
                   <path d="M4 2l4 4-4 4z" />
                 </svg>
               )}
@@ -246,7 +281,7 @@ export function LayerSidebar({
               size="xs"
               checked={visibility[layer.id] ?? layer.visible}
               onChange={() => toggleLayerVisibility(layer.id)}
-              onClick={e => e.stopPropagation()}
+              onClick={(e) => e.stopPropagation()}
               style={{ flexShrink: 0 }}
             />
           )}
@@ -257,15 +292,15 @@ export function LayerSidebar({
             withinPortal
             disabled={layer.name.length < 20}
           >
-            <span className="layer-item__label">
-              {layer.name}
-            </span>
+            <span className="layer-item__label">{layer.name}</span>
           </Tooltip>
         </div>
 
         {hasChildren && isExpanded && (
           <div className="layer-item__children">
-            {(layer.children ?? []).map(child => renderLayer({ ...child, depth: 0 }))}
+            {(layer.children ?? []).map((child) =>
+              renderLayer({ ...child, depth: 0 }),
+            )}
           </div>
         )}
       </div>
@@ -275,14 +310,14 @@ export function LayerSidebar({
   if (!visible) return null;
 
   const leafIds = collectLeafIds(layers);
-  const allVisible = leafIds.every(id => visibility[id] !== false);
-  const allHidden = leafIds.every(id => visibility[id] === false);
+  const allVisible = leafIds.every((id) => visibility[id] !== false);
+  const allHidden = leafIds.every((id) => visibility[id] === false);
 
   return (
     <Box
       className="sidebar-base layer-sidebar"
       style={{
-        position: 'fixed',
+        position: "fixed",
         right: `${rightOffset}rem`,
         top: 0,
         bottom: 0,
@@ -302,7 +337,7 @@ export function LayerSidebar({
           {isApplying && <Loader size="xs" type="dots" />}
         </div>
 
-        {status === 'ready' && leafIds.length > 0 && (
+        {status === "ready" && leafIds.length > 0 && (
           <div className="layer-sidebar__header-actions">
             <ActionIcon
               variant="subtle"
@@ -312,7 +347,7 @@ export function LayerSidebar({
               aria-label="Show all layers"
               title="Show all"
             >
-              <VisibilityIcon sx={{ fontSize: '1rem' }} />
+              <VisibilityIcon sx={{ fontSize: "1rem" }} />
             </ActionIcon>
             <ActionIcon
               variant="subtle"
@@ -322,7 +357,7 @@ export function LayerSidebar({
               aria-label="Hide all layers"
               title="Hide all"
             >
-              <VisibilityOffIcon sx={{ fontSize: '1rem' }} />
+              <VisibilityOffIcon sx={{ fontSize: "1rem" }} />
             </ActionIcon>
           </div>
         )}
@@ -331,7 +366,7 @@ export function LayerSidebar({
       {/* Content */}
       <ScrollArea style={{ flex: 1 }}>
         <Box p="sm" className="sidebar-base__content">
-          {status === 'idle' && (
+          {status === "idle" && (
             <div className="sidebar-base__empty-state">
               <Text size="sm" c="dimmed" ta="center">
                 Open a PDF to view its layers.
@@ -339,8 +374,14 @@ export function LayerSidebar({
             </div>
           )}
 
-          {status === 'loading' && (
-            <Stack gap="md" align="center" c="dimmed" py="xl" className="sidebar-base__loading">
+          {status === "loading" && (
+            <Stack
+              gap="md"
+              align="center"
+              c="dimmed"
+              py="xl"
+              className="sidebar-base__loading"
+            >
               <Loader size="md" type="dots" />
               <Text size="sm" ta="center">
                 Loading layers...
@@ -348,15 +389,15 @@ export function LayerSidebar({
             </Stack>
           )}
 
-          {status === 'error' && (
+          {status === "error" && (
             <div className="sidebar-base__error">
               <Text size="sm" c="red" ta="center">
-                {loadError ?? 'Failed to load layers.'}
+                {loadError ?? "Failed to load layers."}
               </Text>
             </div>
           )}
 
-          {status === 'no-layers' && (
+          {status === "no-layers" && (
             <div className="sidebar-base__empty-state">
               <Text size="sm" c="dimmed" ta="center">
                 This document has no layers.
@@ -364,14 +405,13 @@ export function LayerSidebar({
             </div>
           )}
 
-          {status === 'ready' && layers.length > 0 && (
+          {status === "ready" && layers.length > 0 && (
             <div className="layer-list">
-              {layers.map(layer => renderLayer({ ...layer, depth: 0 }))}
+              {layers.map((layer) => renderLayer({ ...layer, depth: 0 }))}
             </div>
           )}
         </Box>
       </ScrollArea>
-
     </Box>
   );
 }
diff --git a/frontend/src/core/components/viewer/LinkLayer.tsx b/frontend/src/core/components/viewer/LinkLayer.tsx
index 34e12f71d9..55a2a4faa8 100644
--- a/frontend/src/core/components/viewer/LinkLayer.tsx
+++ b/frontend/src/core/components/viewer/LinkLayer.tsx
@@ -1,15 +1,25 @@
-import React, { useCallback, useState, useMemo, useRef } from 'react';
-import { useDocumentState } from '@embedpdf/core/react';
-import { useScroll } from '@embedpdf/plugin-scroll/react';
-import { useAnnotation } from '@embedpdf/plugin-annotation/react';
-import { PdfAnnotationSubtype, PdfActionType, type PdfLinkAnnoObject } from '@embedpdf/models';
+import React, { useCallback, useState, useMemo, useRef } from "react";
+import { useDocumentState } from "@embedpdf/core/react";
+import { useScroll } from "@embedpdf/plugin-scroll/react";
+import { useAnnotation } from "@embedpdf/plugin-annotation/react";
+import {
+  PdfAnnotationSubtype,
+  PdfActionType,
+  type PdfLinkAnnoObject,
+} from "@embedpdf/models";
 
 // ---------------------------------------------------------------------------
 // Inline SVG icons (thin-stroke, modern)
 // ---------------------------------------------------------------------------
 
 const TrashIcon: React.FC<{ size?: number }> = ({ size = 13 }) => (
-  <svg width={size} height={size} viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <svg
+    width={size}
+    height={size}
+    viewBox="0 0 14 14"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+  >
     <path
       d="M3 4h8M5.5 4v-1a0.5 0 0 1 0.5-0.5h2a0.5 0 0 1 0.5 0.5v1M4.5 4l0.4 7a0.8 0 0 0 0.8 0.7h2.6a0.8 0 0 0 0.8-0.7l0.4-7"
       stroke="currentColor"
@@ -21,7 +31,13 @@ const TrashIcon: React.FC<{ size?: number }> = ({ size = 13 }) => (
 );
 
 const ExternalLinkIcon: React.FC<{ size?: number }> = ({ size = 12 }) => (
-  <svg width={size} height={size} viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <svg
+    width={size}
+    height={size}
+    viewBox="0 0 12 12"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+  >
     <path
       d="M8.5 3.5l-3.5 3.5m3.5-3.5v2.5m0-2.5h-2.5M3.5 3.5h-0.5a1 1 0 0 0-1 1v4a1 1 0 0 0 1 1h4a1 1 0 0 0 1-1v-0.5"
       stroke="currentColor"
@@ -33,7 +49,13 @@ const ExternalLinkIcon: React.FC<{ size?: number }> = ({ size = 12 }) => (
 );
 
 const PageIcon: React.FC<{ size?: number }> = ({ size = 12 }) => (
-  <svg width={size} height={size} viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <svg
+    width={size}
+    height={size}
+    viewBox="0 0 12 12"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+  >
     <path
       d="M3 2.5h3l2 2v4.5a1 1 0 0 1-1 1h-4a1 1 0 0 1-1-1v-6.5a1 1 0 0 1 1-1z"
       stroke="currentColor"
@@ -58,32 +80,36 @@ const PageIcon: React.FC<{ size?: number }> = ({ size = 12 }) => (
 function truncateUrl(url: string, maxLen = 32): string {
   try {
     const u = new URL(url);
-    const display = u.hostname + (u.pathname !== '/' ? u.pathname : '');
-    return display.length > maxLen ? display.slice(0, maxLen) + '\u2026' : display;
+    const display = u.hostname + (u.pathname !== "/" ? u.pathname : "");
+    return display.length > maxLen
+      ? display.slice(0, maxLen) + "\u2026"
+      : display;
   } catch {
-    return url.length > maxLen ? url.slice(0, maxLen) + '\u2026' : url;
+    return url.length > maxLen ? url.slice(0, maxLen) + "\u2026" : url;
   }
 }
 
 function getLinkLabel(annotationLink: PdfLinkAnnoObject): string {
-  if (!annotationLink.target) return 'Open Link';
+  if (!annotationLink.target) return "Open Link";
 
-  if (annotationLink.target.type === 'action') {
+  if (annotationLink.target.type === "action") {
     const action = annotationLink.target.action;
     if (action.type === PdfActionType.URI) return truncateUrl(action.uri);
-    if (action.type === PdfActionType.Goto) return `Page ${action.destination.pageIndex + 1}`;
-    if (action.type === PdfActionType.RemoteGoto) return `Page ${action.destination.pageIndex + 1}`;
-  } else if (annotationLink.target.type === 'destination') {
+    if (action.type === PdfActionType.Goto)
+      return `Page ${action.destination.pageIndex + 1}`;
+    if (action.type === PdfActionType.RemoteGoto)
+      return `Page ${action.destination.pageIndex + 1}`;
+  } else if (annotationLink.target.type === "destination") {
     return `Page ${annotationLink.target.destination.pageIndex + 1}`;
   }
 
-  return 'Open Link';
+  return "Open Link";
 }
 
 function isInternalLink(annotationLink: PdfLinkAnnoObject): boolean {
   if (!annotationLink.target) return false;
-  if (annotationLink.target.type === 'destination') return true;
-  if (annotationLink.target.type === 'action') {
+  if (annotationLink.target.type === "destination") return true;
+  if (annotationLink.target.type === "action") {
     const { type } = annotationLink.target.action;
     return type === PdfActionType.Goto || type === PdfActionType.RemoteGoto;
   }
@@ -108,10 +134,22 @@ const TOOLBAR_HEIGHT = 32;
 const TOOLBAR_GAP = 8;
 
 const LinkToolbar: React.FC<LinkToolbarProps> = React.memo(
-  ({ annotationLink, scale, flipped, onNavigate, onDelete, onMouseEnter, onMouseLeave }) => {
-    const centerX = (annotationLink.rect.origin.x + annotationLink.rect.size.width / 2) * scale;
+  ({
+    annotationLink,
+    scale,
+    flipped,
+    onNavigate,
+    onDelete,
+    onMouseEnter,
+    onMouseLeave,
+  }) => {
+    const centerX =
+      (annotationLink.rect.origin.x + annotationLink.rect.size.width / 2) *
+      scale;
     const topY = flipped
-      ? (annotationLink.rect.origin.y + annotationLink.rect.size.height) * scale + TOOLBAR_GAP
+      ? (annotationLink.rect.origin.y + annotationLink.rect.size.height) *
+          scale +
+        TOOLBAR_GAP
       : annotationLink.rect.origin.y * scale - TOOLBAR_HEIGHT - TOOLBAR_GAP;
 
     const internal = isInternalLink(annotationLink);
@@ -119,7 +157,7 @@ const LinkToolbar: React.FC<LinkToolbarProps> = React.memo(
 
     return (
       <div
-        className={`pdf-link-toolbar${flipped ? ' pdf-link-toolbar--below' : ''}`}
+        className={`pdf-link-toolbar${flipped ? " pdf-link-toolbar--below" : ""}`}
         style={{ left: `${centerX}px`, top: `${topY}px` }}
         onMouseEnter={onMouseEnter}
         onMouseLeave={onMouseLeave}
@@ -148,7 +186,11 @@ const LinkToolbar: React.FC<LinkToolbarProps> = React.memo(
             e.stopPropagation();
             onNavigate(annotationLink);
           }}
-          aria-label={internal ? `Go to page ${annotationLink.target?.type === 'destination' ? annotationLink.target.destination.pageIndex + 1 : ''}` : 'Open link'}
+          aria-label={
+            internal
+              ? `Go to page ${annotationLink.target?.type === "destination" ? annotationLink.target.destination.pageIndex + 1 : ""}`
+              : "Open link"
+          }
           title={label}
         >
           {internal ? <PageIcon /> : <ExternalLinkIcon />}
@@ -159,7 +201,7 @@ const LinkToolbar: React.FC<LinkToolbarProps> = React.memo(
   },
 );
 
-LinkToolbar.displayName = 'LinkToolbar';
+LinkToolbar.displayName = "LinkToolbar";
 
 // ---------------------------------------------------------------------------
 // LinkLayer
@@ -170,7 +212,10 @@ interface LinkLayerProps {
   pageIndex: number;
 }
 
-export const LinkLayer: React.FC<LinkLayerProps> = ({ documentId, pageIndex }) => {
+export const LinkLayer: React.FC<LinkLayerProps> = ({
+  documentId,
+  pageIndex,
+}) => {
   const { provides: scroll } = useScroll(documentId);
   const { state, provides: scope } = useAnnotation(documentId);
   const documentState = useDocumentState(documentId);
@@ -187,11 +232,14 @@ export const LinkLayer: React.FC<LinkLayerProps> = ({ documentId, pageIndex }) =
       const ta = state.byUid[uid];
       if (
         ta &&
-        ta.commitState !== 'deleted' &&
+        ta.commitState !== "deleted" &&
         ta.object.type === PdfAnnotationSubtype.LINK
       ) {
         const annotationLink = ta.object as PdfLinkAnnoObject;
-        if (annotationLink.rect.size.width > 0 && annotationLink.rect.size.height > 0) {
+        if (
+          annotationLink.rect.size.width > 0 &&
+          annotationLink.rect.size.height > 0
+        ) {
           result.push(annotationLink);
         }
       }
@@ -243,34 +291,37 @@ export const LinkLayer: React.FC<LinkLayerProps> = ({ documentId, pageIndex }) =
         return;
       }
 
-      if (annotationLink.target.type === 'destination' && scroll) {
+      if (annotationLink.target.type === "destination" && scroll) {
         scroll.scrollToPage({
           pageNumber: annotationLink.target.destination.pageIndex + 1,
-          behavior: 'smooth',
+          behavior: "smooth",
         });
-      } else if (annotationLink.target.type === 'action') {
+      } else if (annotationLink.target.type === "action") {
         const action = annotationLink.target.action;
         if (action.type === PdfActionType.Goto && scroll) {
           scroll.scrollToPage({
             pageNumber: action.destination.pageIndex + 1,
-            behavior: 'smooth',
+            behavior: "smooth",
           });
         } else if (action.type === PdfActionType.RemoteGoto && scroll) {
           scroll.scrollToPage({
             pageNumber: action.destination.pageIndex + 1,
-            behavior: 'smooth',
+            behavior: "smooth",
           });
         } else if (action.type === PdfActionType.URI) {
           const uri = action.uri;
           try {
             const url = new URL(uri, window.location.href);
-            if (['http:', 'https:', 'mailto:'].includes(url.protocol)) {
-              window.open(uri, '_blank', 'noopener,noreferrer');
+            if (["http:", "https:", "mailto:"].includes(url.protocol)) {
+              window.open(uri, "_blank", "noopener,noreferrer");
             } else {
-              console.warn('[LinkLayer] Blocked unsafe URL protocol:', url.protocol);
+              console.warn(
+                "[LinkLayer] Blocked unsafe URL protocol:",
+                url.protocol,
+              );
             }
           } catch {
-            window.open(uri, '_blank', 'noopener,noreferrer');
+            window.open(uri, "_blank", "noopener,noreferrer");
           }
         }
       }
@@ -294,7 +345,7 @@ export const LinkLayer: React.FC<LinkLayerProps> = ({ documentId, pageIndex }) =
   return (
     <div
       className="absolute inset-0"
-      style={{ pointerEvents: 'none', zIndex: 10 }}
+      style={{ pointerEvents: "none", zIndex: 10 }}
     >
       {linkAnnotations.map((annotationLink) => {
         const isHovered = hoveredLinkId === annotationLink.id;
@@ -304,7 +355,9 @@ export const LinkLayer: React.FC<LinkLayerProps> = ({ documentId, pageIndex }) =
         const height = annotationLink.rect.size.height * scale;
 
         // Flip toolbar below if link is near the top of the page
-        const flipped = annotationLink.rect.origin.y * scale < TOOLBAR_HEIGHT + TOOLBAR_GAP + 4;
+        const flipped =
+          annotationLink.rect.origin.y * scale <
+          TOOLBAR_HEIGHT + TOOLBAR_GAP + 4;
 
         return (
           <React.Fragment key={annotationLink.id}>
@@ -319,14 +372,14 @@ export const LinkLayer: React.FC<LinkLayerProps> = ({ documentId, pageIndex }) =
               onMouseDown={(e) => e.stopPropagation()}
               onMouseEnter={() => handleLinkMouseEnter(annotationLink.id)}
               onMouseLeave={handleLinkMouseLeave}
-              className={`pdf-link-overlay${isHovered ? ' pdf-link-overlay--active' : ''}`}
+              className={`pdf-link-overlay${isHovered ? " pdf-link-overlay--active" : ""}`}
               style={{
                 left: `${left}px`,
                 top: `${top}px`,
                 width: `${width}px`,
                 height: `${height}px`,
-                minWidth: '6px',
-                minHeight: '6px',
+                minWidth: "6px",
+                minHeight: "6px",
               }}
               role="link"
               tabIndex={0}
diff --git a/frontend/src/core/components/viewer/LocalEmbedPDF.tsx b/frontend/src/core/components/viewer/LocalEmbedPDF.tsx
index 9050cf20e6..d3625762bb 100644
--- a/frontend/src/core/components/viewer/LocalEmbedPDF.tsx
+++ b/frontend/src/core/components/viewer/LocalEmbedPDF.tsx
@@ -1,71 +1,101 @@
-import React, { useEffect, useMemo, useState } from 'react';
-import { createPluginRegistration } from '@embedpdf/core';
-import type { PluginRegistry } from '@embedpdf/core';
-import { EmbedPDF } from '@embedpdf/core/react';
-import { usePdfiumEngine } from '@embedpdf/engines/react';
-import { PrivateContent } from '@app/components/shared/PrivateContent';
+import React, { useEffect, useMemo, useState } from "react";
+import { createPluginRegistration } from "@embedpdf/core";
+import type { PluginRegistry } from "@embedpdf/core";
+import { EmbedPDF } from "@embedpdf/core/react";
+import { usePdfiumEngine } from "@embedpdf/engines/react";
+import { PrivateContent } from "@app/components/shared/PrivateContent";
+import { useAppConfig } from "@app/contexts/AppConfigContext";
 
 // Import the essential plugins
-import { Viewport, ViewportPluginPackage } from '@embedpdf/plugin-viewport/react';
-import { Scroller, ScrollPluginPackage } from '@embedpdf/plugin-scroll/react';
-import { DocumentManagerPluginPackage } from '@embedpdf/plugin-document-manager/react';
-import { RenderPluginPackage } from '@embedpdf/plugin-render/react';
-import { ZoomPluginPackage, ZoomMode } from '@embedpdf/plugin-zoom/react';
-import { InteractionManagerPluginPackage, PagePointerProvider, GlobalPointerProvider } from '@embedpdf/plugin-interaction-manager/react';
-import { SelectionLayer, SelectionPluginPackage } from '@embedpdf/plugin-selection/react';
-import { TilingLayer, TilingPluginPackage } from '@embedpdf/plugin-tiling/react';
-import { PanPluginPackage } from '@embedpdf/plugin-pan/react';
-import { SpreadPluginPackage, SpreadMode } from '@embedpdf/plugin-spread/react';
-import { SearchPluginPackage } from '@embedpdf/plugin-search/react';
-import { ThumbnailPluginPackage } from '@embedpdf/plugin-thumbnail/react';
-import { RotatePluginPackage, Rotate } from '@embedpdf/plugin-rotate/react';
-import { ExportPluginPackage } from '@embedpdf/plugin-export/react';
-import { BookmarkPluginPackage } from '@embedpdf/plugin-bookmark/react';
-import { AttachmentPluginPackage } from '@embedpdf/plugin-attachment/react';
-import { PrintPluginPackage } from '@embedpdf/plugin-print/react';
-import { HistoryPluginPackage } from '@embedpdf/plugin-history/react';
-import { AnnotationLayer, AnnotationPluginPackage } from '@embedpdf/plugin-annotation/react';
-import type { AnnotationTool, AnnotationEvent } from '@embedpdf/plugin-annotation';
-import { PdfAnnotationSubtype } from '@embedpdf/models';
-import type { PdfAnnotationObject, Rect } from '@embedpdf/models';
-import { RedactionPluginPackage, RedactionLayer } from '@embedpdf/plugin-redaction/react';
-import { CustomSearchLayer } from '@app/components/viewer/CustomSearchLayer';
-import { ZoomAPIBridge } from '@app/components/viewer/ZoomAPIBridge';
-import ToolLoadingFallback from '@app/components/tools/ToolLoadingFallback';
-import { Center, Stack, Text } from '@mantine/core';
-import { ScrollAPIBridge } from '@app/components/viewer/ScrollAPIBridge';
-import { SelectionAPIBridge } from '@app/components/viewer/SelectionAPIBridge';
-import { PanAPIBridge } from '@app/components/viewer/PanAPIBridge';
-import { SpreadAPIBridge } from '@app/components/viewer/SpreadAPIBridge';
-import { SearchAPIBridge } from '@app/components/viewer/SearchAPIBridge';
-import { ThumbnailAPIBridge } from '@app/components/viewer/ThumbnailAPIBridge';
-import { RotateAPIBridge } from '@app/components/viewer/RotateAPIBridge';
-import { SignatureAPIBridge } from '@app/components/viewer/SignatureAPIBridge';
-import { AnnotationAPIBridge } from '@app/components/viewer/AnnotationAPIBridge';
-import { HistoryAPIBridge } from '@app/components/viewer/HistoryAPIBridge';
-import type { SignatureAPI, AnnotationAPI, HistoryAPI } from '@app/components/viewer/viewerTypes';
-import { ExportAPIBridge } from '@app/components/viewer/ExportAPIBridge';
-import { BookmarkAPIBridge } from '@app/components/viewer/BookmarkAPIBridge';
-import { AttachmentAPIBridge } from '@app/components/viewer/AttachmentAPIBridge';
-import { PrintAPIBridge } from '@app/components/viewer/PrintAPIBridge';
-import { isPdfFile } from '@app/utils/fileUtils';
-import { useTranslation } from 'react-i18next';
-import { LinkLayer } from '@app/components/viewer/LinkLayer';
-import { TextSelectionHandler } from '@app/components/viewer/TextSelectionHandler';
-import { RedactionSelectionMenu } from '@app/components/viewer/RedactionSelectionMenu';
-import { AnnotationSelectionMenu } from '@app/components/viewer/AnnotationSelectionMenu';
-import { RedactionPendingTracker, RedactionPendingTrackerAPI } from '@app/components/viewer/RedactionPendingTracker';
-import { RedactionAPIBridge } from '@app/components/viewer/RedactionAPIBridge';
-import { DocumentPermissionsAPIBridge } from '@app/components/viewer/DocumentPermissionsAPIBridge';
-import { DocumentReadyWrapper } from '@app/components/viewer/DocumentReadyWrapper';
-import { ActiveDocumentProvider } from '@app/components/viewer/ActiveDocumentContext';
-import { absoluteWithBasePath } from '@app/constants/app';
-import { FormFieldOverlay } from '@app/tools/formFill/FormFieldOverlay';
-import { ButtonAppearanceOverlay } from '@app/tools/formFill/ButtonAppearanceOverlay';
-import SignatureFieldOverlay from '@app/components/viewer/SignatureFieldOverlay';
-import { CommentsSidebar } from '@app/components/viewer/CommentsSidebar';
-import { CommentAuthorProvider } from '@app/contexts/CommentAuthorContext';
-import { accountService } from '@app/services/accountService';
+import {
+  Viewport,
+  ViewportPluginPackage,
+} from "@embedpdf/plugin-viewport/react";
+import { Scroller, ScrollPluginPackage } from "@embedpdf/plugin-scroll/react";
+import { DocumentManagerPluginPackage } from "@embedpdf/plugin-document-manager/react";
+import { RenderPluginPackage } from "@embedpdf/plugin-render/react";
+import { ZoomPluginPackage, ZoomMode } from "@embedpdf/plugin-zoom/react";
+import {
+  InteractionManagerPluginPackage,
+  PagePointerProvider,
+  GlobalPointerProvider,
+} from "@embedpdf/plugin-interaction-manager/react";
+import {
+  SelectionLayer,
+  SelectionPluginPackage,
+} from "@embedpdf/plugin-selection/react";
+import {
+  TilingLayer,
+  TilingPluginPackage,
+} from "@embedpdf/plugin-tiling/react";
+import { PanPluginPackage } from "@embedpdf/plugin-pan/react";
+import { SpreadPluginPackage, SpreadMode } from "@embedpdf/plugin-spread/react";
+import { SearchPluginPackage } from "@embedpdf/plugin-search/react";
+import { ThumbnailPluginPackage } from "@embedpdf/plugin-thumbnail/react";
+import { RotatePluginPackage, Rotate } from "@embedpdf/plugin-rotate/react";
+import { ExportPluginPackage } from "@embedpdf/plugin-export/react";
+import { BookmarkPluginPackage } from "@embedpdf/plugin-bookmark/react";
+import { AttachmentPluginPackage } from "@embedpdf/plugin-attachment/react";
+import { PrintPluginPackage } from "@embedpdf/plugin-print/react";
+import { HistoryPluginPackage } from "@embedpdf/plugin-history/react";
+import {
+  AnnotationLayer,
+  AnnotationPluginPackage,
+} from "@embedpdf/plugin-annotation/react";
+import type {
+  AnnotationTool,
+  AnnotationEvent,
+} from "@embedpdf/plugin-annotation";
+import { PdfAnnotationSubtype } from "@embedpdf/models";
+import type { PdfAnnotationObject, Rect } from "@embedpdf/models";
+import {
+  RedactionPluginPackage,
+  RedactionLayer,
+} from "@embedpdf/plugin-redaction/react";
+import { CustomSearchLayer } from "@app/components/viewer/CustomSearchLayer";
+import { ZoomAPIBridge } from "@app/components/viewer/ZoomAPIBridge";
+import ToolLoadingFallback from "@app/components/tools/ToolLoadingFallback";
+import { Center, Stack, Text } from "@mantine/core";
+import { ScrollAPIBridge } from "@app/components/viewer/ScrollAPIBridge";
+import { SelectionAPIBridge } from "@app/components/viewer/SelectionAPIBridge";
+import { PanAPIBridge } from "@app/components/viewer/PanAPIBridge";
+import { SpreadAPIBridge } from "@app/components/viewer/SpreadAPIBridge";
+import { SearchAPIBridge } from "@app/components/viewer/SearchAPIBridge";
+import { ThumbnailAPIBridge } from "@app/components/viewer/ThumbnailAPIBridge";
+import { RotateAPIBridge } from "@app/components/viewer/RotateAPIBridge";
+import { SignatureAPIBridge } from "@app/components/viewer/SignatureAPIBridge";
+import { AnnotationAPIBridge } from "@app/components/viewer/AnnotationAPIBridge";
+import { HistoryAPIBridge } from "@app/components/viewer/HistoryAPIBridge";
+import type {
+  SignatureAPI,
+  AnnotationAPI,
+  HistoryAPI,
+} from "@app/components/viewer/viewerTypes";
+import { ExportAPIBridge } from "@app/components/viewer/ExportAPIBridge";
+import { BookmarkAPIBridge } from "@app/components/viewer/BookmarkAPIBridge";
+import { AttachmentAPIBridge } from "@app/components/viewer/AttachmentAPIBridge";
+import { PrintAPIBridge } from "@app/components/viewer/PrintAPIBridge";
+import { isPdfFile } from "@app/utils/fileUtils";
+import { useTranslation } from "react-i18next";
+import { LinkLayer } from "@app/components/viewer/LinkLayer";
+import { TextSelectionHandler } from "@app/components/viewer/TextSelectionHandler";
+import { RedactionSelectionMenu } from "@app/components/viewer/RedactionSelectionMenu";
+import { AnnotationSelectionMenu } from "@app/components/viewer/AnnotationSelectionMenu";
+import {
+  RedactionPendingTracker,
+  RedactionPendingTrackerAPI,
+} from "@app/components/viewer/RedactionPendingTracker";
+import { RedactionAPIBridge } from "@app/components/viewer/RedactionAPIBridge";
+import { DocumentPermissionsAPIBridge } from "@app/components/viewer/DocumentPermissionsAPIBridge";
+import { DocumentReadyWrapper } from "@app/components/viewer/DocumentReadyWrapper";
+import { ActiveDocumentProvider } from "@app/components/viewer/ActiveDocumentContext";
+import { absoluteWithBasePath } from "@app/constants/app";
+import { FormFieldOverlay } from "@app/tools/formFill/FormFieldOverlay";
+import { ButtonAppearanceOverlay } from "@app/tools/formFill/ButtonAppearanceOverlay";
+import SignatureFieldOverlay from "@app/components/viewer/SignatureFieldOverlay";
+import { CommentsSidebar } from "@app/components/viewer/CommentsSidebar";
+import { CommentAuthorProvider } from "@app/contexts/CommentAuthorContext";
+import { accountService } from "@app/services/accountService";
 
 interface LocalEmbedPDFProps {
   file?: File | Blob;
@@ -89,20 +119,48 @@ interface LocalEmbedPDFProps {
   /** When true, blocks the general ink/pen annotation tool (sign tool context). */
   isSignMode?: boolean;
   /** Controls CSS filter applied only to rendered PDF canvas tiles */
-  pdfRenderMode?: 'normal' | 'dark' | 'sepia';
+  pdfRenderMode?: "normal" | "dark" | "sepia";
 }
 
-export function LocalEmbedPDF({ file, url, fileName, enableAnnotations = false, enableRedaction = false, enableFormFill = false, isManualRedactionMode = false, showBakedAnnotations = true, onSignatureAdded, signatureApiRef, annotationApiRef, historyApiRef, redactionTrackerRef, fileId, isCommentsSidebarVisible = false, commentsSidebarRightOffset = '0rem', isSignMode = false, pdfRenderMode = 'normal' }: LocalEmbedPDFProps) {
+export function LocalEmbedPDF({
+  file,
+  url,
+  fileName,
+  enableAnnotations = false,
+  enableRedaction = false,
+  enableFormFill = false,
+  isManualRedactionMode = false,
+  showBakedAnnotations = true,
+  onSignatureAdded,
+  signatureApiRef,
+  annotationApiRef,
+  historyApiRef,
+  redactionTrackerRef,
+  fileId,
+  isCommentsSidebarVisible = false,
+  commentsSidebarRightOffset = "0rem",
+  isSignMode = false,
+  pdfRenderMode = "normal",
+}: LocalEmbedPDFProps) {
   const { t } = useTranslation();
+  const { config } = useAppConfig();
   const [pdfUrl, setPdfUrl] = useState<string | null>(null);
-  const [, setAnnotations] = useState<Array<{id: string, pageIndex: number, rect: Rect}>>([]);
-  const [commentAuthorName, setCommentAuthorName] = useState<string>('Guest');
+  const [, setAnnotations] = useState<
+    Array<{ id: string; pageIndex: number; rect: Rect }>
+  >([]);
+  const [commentAuthorName, setCommentAuthorName] = useState<string>("Guest");
 
   useEffect(() => {
-    accountService.getAccountData().then((data) => {
-      if (data?.username) setCommentAuthorName(data.username);
-    }).catch(() => {/* not logged in or security disabled */});
-  }, []);
+    if (!config?.enableLogin) return;
+    accountService
+      .getAccountData()
+      .then((data) => {
+        if (data?.username) setCommentAuthorName(data.username);
+      })
+      .catch(() => {
+        /* not logged in or security disabled */
+      });
+  }, [config?.enableLogin]);
 
   // Convert File to URL if needed
   useEffect(() => {
@@ -120,26 +178,30 @@ export function LocalEmbedPDF({ file, url, fileName, enableAnnotations = false,
     if (!pdfUrl) return [];
 
     // Calculate 3.5rem in pixels dynamically based on root font size
-    const rootFontSize = parseFloat(getComputedStyle(document.documentElement).fontSize);
+    const rootFontSize = parseFloat(
+      getComputedStyle(document.documentElement).fontSize,
+    );
     const viewportGap = rootFontSize * 3.5;
 
     // Determine export filename - use provided fileName, or extract from file/url
-    let exportFileName = 'document.pdf';
+    let exportFileName = "document.pdf";
     if (fileName) {
       exportFileName = fileName;
-    } else if (file && 'name' in file) {
+    } else if (file && "name" in file) {
       exportFileName = file.name;
     } else if (url) {
-      const urlPath = url.split('/').pop() || 'document.pdf';
-      exportFileName = urlPath.split('?')[0]; // Remove query params
+      const urlPath = url.split("/").pop() || "document.pdf";
+      exportFileName = urlPath.split("?")[0]; // Remove query params
     }
 
     return [
       createPluginRegistration(DocumentManagerPluginPackage, {
-        initialDocuments: [{
-          url: pdfUrl,
-          name: exportFileName,
-        }],
+        initialDocuments: [
+          {
+            url: pdfUrl,
+            name: exportFileName,
+          },
+        ],
       }),
       createPluginRegistration(ViewportPluginPackage, {
         viewportGap,
@@ -166,7 +228,7 @@ export function LocalEmbedPDF({ file, url, fileName, enableAnnotations = false,
       // Register annotation plugin (depends on InteractionManager, Selection, History)
       // Always register for reading existing annotations like links
       createPluginRegistration(AnnotationPluginPackage, {
-        annotationAuthor: 'Digital Signature',
+        annotationAuthor: "Digital Signature",
         autoCommit: true,
         deactivateToolAfterCreate: false,
         selectAfterCreate: true,
@@ -181,7 +243,7 @@ export function LocalEmbedPDF({ file, url, fileName, enableAnnotations = false,
 
       // Register pan plugin (depends on Viewport, InteractionManager)
       createPluginRegistration(PanPluginPackage, {
-        defaultMode: 'mobile', // Try mobile mode which might be more permissive
+        defaultMode: "mobile", // Try mobile mode which might be more permissive
       }),
       // Register pan plugin (depends on Viewport, InteractionManager) - keep disabled to prevent drag panning
       createPluginRegistration(PanPluginPackage, {}),
@@ -232,16 +294,15 @@ export function LocalEmbedPDF({ file, url, fileName, enableAnnotations = false,
 
   // Initialize the engine with the React hook - use local WASM for offline support
   const { engine, isLoading, error } = usePdfiumEngine({
-    wasmUrl: absoluteWithBasePath('/pdfium/pdfium.wasm'),
+    wasmUrl: absoluteWithBasePath("/pdfium/pdfium.wasm"),
   });
 
-
   // Early return if no file or URL provided
   if (!file && !url) {
     return (
       <Center h="100%" w="100%">
         <Stack align="center" gap="md">
-          <div style={{ fontSize: '24px' }}>📄</div>
+          <div style={{ fontSize: "24px" }}>📄</div>
           <Text c="dimmed" size="sm">
             No PDF provided
           </Text>
@@ -252,19 +313,23 @@ export function LocalEmbedPDF({ file, url, fileName, enableAnnotations = false,
 
   // Check if the file is actually a PDF
   if (file && !isPdfFile(file)) {
-    const fileName = 'name' in file ? file.name : t('viewer.unknownFile');
+    const fileName = "name" in file ? file.name : t("viewer.unknownFile");
     return (
       <Center h="100%" w="100%">
         <Stack align="center" gap="md">
-          <div style={{ fontSize: '48px' }}>📄</div>
+          <div style={{ fontSize: "48px" }}>📄</div>
           <Text size="lg" fw={600} c="dimmed">
-            {t('viewer.cannotPreviewFile')}
+            {t("viewer.cannotPreviewFile")}
           </Text>
-          <Text c="dimmed" size="sm" style={{ textAlign: 'center', maxWidth: '400px' }}>
-            {t('viewer.onlyPdfSupported')}
+          <Text
+            c="dimmed"
+            size="sm"
+            style={{ textAlign: "center", maxWidth: "400px" }}
+          >
+            {t("viewer.onlyPdfSupported")}
           </Text>
           <PrivateContent>
-            <Text c="dimmed" size="xs" style={{ fontFamily: 'monospace' }}>
+            <Text c="dimmed" size="xs" style={{ fontFamily: "monospace" }}>
               {fileName}
             </Text>
           </PrivateContent>
@@ -281,8 +346,8 @@ export function LocalEmbedPDF({ file, url, fileName, enableAnnotations = false,
     return (
       <Center h="100%" w="100%">
         <Stack align="center" gap="md">
-          <div style={{ fontSize: '24px' }}>�</div>
-          <Text c="red" size="sm" style={{ textAlign: 'center' }}>
+          <div style={{ fontSize: "24px" }}>�</div>
+          <Text c="red" size="sm" style={{ textAlign: "center" }}>
             Error loading PDF engine: {error.message}
           </Text>
         </Stack>
@@ -295,596 +360,735 @@ export function LocalEmbedPDF({ file, url, fileName, enableAnnotations = false,
     <PrivateContent>
       <div
         style={{
-          height: '100%',
-          width: '100%',
-          position: 'relative',
+          height: "100%",
+          width: "100%",
+          position: "relative",
           flex: 1,
           minHeight: 0,
           minWidth: 0,
-      }}>
-      <EmbedPDF
-        engine={engine}
-        plugins={plugins}
-        onInitialized={async (registry: PluginRegistry) => {
-          // v2.0: Use registry.getPlugin() to access plugin APIs
-          const annotationPlugin = registry.getPlugin('annotation');
-          if (!annotationPlugin || !annotationPlugin.provides) return;
-
-          const annotationApi = annotationPlugin.provides();
-          if (!annotationApi) return;
-
-          if (enableAnnotations) {
-            // LooseAnnotationTool bypasses strict Partial<T> defaults typing from the library —
-            // EmbedPDF accepts extra runtime properties (borderWidth, textColor, finishOnDoubleClick,
-            // etc.) that aren't reflected in the TypeScript model types.
-            type LooseAnnotationTool = {
-              id: string;
-              name: string;
-              interaction?: { exclusive: boolean; cursor: string; textSelection?: boolean; isRotatable?: boolean };
-              matchScore?: (annotation: PdfAnnotationObject) => number;
-              defaults?: Record<string, unknown>;
-              clickBehavior?: Record<string, unknown>;
-              behavior?: { deactivateToolAfterCreate?: boolean; selectAfterCreate?: boolean };
-            };
-            const ensureTool = (tool: LooseAnnotationTool) => {
-              const existing = annotationApi.getTool?.(tool.id);
-              if (!existing) {
-                annotationApi.addTool(tool as unknown as AnnotationTool);
-              }
-            };
-
-            ensureTool({
-              id: 'highlight',
-              name: 'Highlight',
-              interaction: { exclusive: true, cursor: 'text', textSelection: true },
-              matchScore: (annotation: PdfAnnotationObject) => (annotation.type === PdfAnnotationSubtype.HIGHLIGHT ? 10 : 0),
-              defaults: {
-                type: PdfAnnotationSubtype.HIGHLIGHT,
-                strokeColor: '#ffd54f',
-                color: '#ffd54f',
-                opacity: 0.6,
-              },
-              behavior: {
-                deactivateToolAfterCreate: false,
-                selectAfterCreate: true,
-              },
-            });
-
-            ensureTool({
-              id: 'underline',
-              name: 'Underline',
-              interaction: { exclusive: true, cursor: 'text', textSelection: true },
-              matchScore: (annotation: PdfAnnotationObject) => (annotation.type === PdfAnnotationSubtype.UNDERLINE ? 10 : 0),
-              defaults: {
-                type: PdfAnnotationSubtype.UNDERLINE,
-                strokeColor: '#ffb300',
-                color: '#ffb300',
-                opacity: 1,
-              },
-              behavior: {
-                deactivateToolAfterCreate: false,
-                selectAfterCreate: true,
-              },
-            });
-
-            ensureTool({
-              id: 'strikeout',
-              name: 'Strikeout',
-              interaction: { exclusive: true, cursor: 'text', textSelection: true },
-              matchScore: (annotation: PdfAnnotationObject) => (annotation.type === PdfAnnotationSubtype.STRIKEOUT ? 10 : 0),
-              defaults: {
-                type: PdfAnnotationSubtype.STRIKEOUT,
-                strokeColor: '#e53935',
-                color: '#e53935',
-                opacity: 1,
-              },
-              behavior: {
-                deactivateToolAfterCreate: false,
-                selectAfterCreate: true,
-              },
-            });
-
-            ensureTool({
-              id: 'squiggly',
-              name: 'Squiggly',
-              interaction: { exclusive: true, cursor: 'text', textSelection: true },
-              matchScore: (annotation: PdfAnnotationObject) => (annotation.type === PdfAnnotationSubtype.SQUIGGLY ? 10 : 0),
-              defaults: {
-                type: PdfAnnotationSubtype.SQUIGGLY,
-                strokeColor: '#00acc1',
-                color: '#00acc1',
-                opacity: 1,
-              },
-              behavior: {
-                deactivateToolAfterCreate: false,
-                selectAfterCreate: true,
-              },
-            });
-
-            ensureTool({
-              id: 'ink',
-              name: 'Pen',
-              interaction: { exclusive: true, cursor: 'crosshair' },
-              matchScore: (annotation: PdfAnnotationObject) => (annotation.type === PdfAnnotationSubtype.INK ? 10 : 0),
-              defaults: {
-                type: PdfAnnotationSubtype.INK,
-                strokeColor: '#1f2933',
-                color: '#1f2933',
-                opacity: 1,
-                borderWidth: 2,
-                lineWidth: 2,
-                strokeWidth: 2,
-              },
-              behavior: {
-                deactivateToolAfterCreate: false,
-                selectAfterCreate: true,
-              },
-            });
-
-            ensureTool({
-              id: 'inkHighlighter',
-              name: 'Ink Highlighter',
-              interaction: { exclusive: true, cursor: 'crosshair' },
-              matchScore: (annotation: PdfAnnotationObject) => (annotation.type === PdfAnnotationSubtype.INK && (annotation.strokeColor === '#ffd54f' || annotation.color === '#ffd54f') ? 8 : 0),
-              defaults: {
-                type: PdfAnnotationSubtype.INK,
-                strokeColor: '#ffd54f',
-                color: '#ffd54f',
-                opacity: 0.5,
-                borderWidth: 6,
-                lineWidth: 6,
-                strokeWidth: 6,
-              },
-              behavior: {
-                deactivateToolAfterCreate: false,
-                selectAfterCreate: true,
-              },
-            });
-
-            ensureTool({
-              id: 'square',
-              name: 'Square',
-              interaction: { exclusive: true, cursor: 'crosshair' },
-              matchScore: (annotation: PdfAnnotationObject) => (annotation.type === PdfAnnotationSubtype.SQUARE ? 10 : 0),
-              defaults: {
-                type: PdfAnnotationSubtype.SQUARE,
-                color: '#0000ff', // fill color (blue)
-                strokeColor: '#cf5b5b', // border color (reddish pink)
-                opacity: 0.5,
-                borderWidth: 1,
-                strokeWidth: 1,
-                lineWidth: 1,
-              },
-              clickBehavior: {
-                enabled: true,
-                defaultSize: { width: 120, height: 90 },
-              },
-              behavior: {
-                deactivateToolAfterCreate: true,
-                selectAfterCreate: true,
-              },
-            });
-
-            ensureTool({
-              id: 'circle',
-              name: 'Circle',
-              interaction: { exclusive: true, cursor: 'crosshair' },
-              matchScore: (annotation: PdfAnnotationObject) => (annotation.type === PdfAnnotationSubtype.CIRCLE ? 10 : 0),
-              defaults: {
-                type: PdfAnnotationSubtype.CIRCLE,
-                color: '#0000ff', // fill color (blue)
-                strokeColor: '#cf5b5b', // border color (reddish pink)
-                opacity: 0.5,
-                borderWidth: 1,
-                strokeWidth: 1,
-                lineWidth: 1,
-              },
-              clickBehavior: {
-                enabled: true,
-                defaultSize: { width: 100, height: 100 },
-              },
-              behavior: {
-                deactivateToolAfterCreate: true,
-                selectAfterCreate: true,
-              },
-            });
-
-            ensureTool({
-              id: 'line',
-              name: 'Line',
-              interaction: { exclusive: true, cursor: 'crosshair' },
-              matchScore: (annotation: PdfAnnotationObject) => (annotation.type === PdfAnnotationSubtype.LINE ? 10 : 0),
-              defaults: {
-                type: PdfAnnotationSubtype.LINE,
-                color: '#1565c0',
-                opacity: 1,
-                borderWidth: 2,
-                strokeWidth: 2,
-                lineWidth: 2,
-              },
-              clickBehavior: {
-                enabled: true,
-                defaultLength: 120,
-                defaultAngle: 0,
-              },
-              behavior: {
-                deactivateToolAfterCreate: true,
-                selectAfterCreate: true,
-              },
-            });
-
-            ensureTool({
-              id: 'lineArrow',
-              name: 'Arrow',
-              interaction: { exclusive: true, cursor: 'crosshair' },
-              matchScore: (annotation: PdfAnnotationObject) => {
-                if (annotation.type !== PdfAnnotationSubtype.LINE) return 0;
-                // EmbedPDF stores endStyle/lineEndingStyles at runtime; library types use lineEndings
-                const ann = annotation as PdfAnnotationObject & { endStyle?: string; lineEndingStyles?: { end?: string } };
-                return (ann.endStyle === 'ClosedArrow' || ann.lineEndingStyles?.end === 'ClosedArrow') ? 9 : 0;
-              },
-              defaults: {
-                type: PdfAnnotationSubtype.LINE,
-                color: '#1565c0',
-                opacity: 1,
-                borderWidth: 2,
-                startStyle: 'None',
-                endStyle: 'ClosedArrow',
-                lineEndingStyles: { start: 'None', end: 'ClosedArrow' },
-              },
-              clickBehavior: {
-                enabled: true,
-                defaultLength: 120,
-                defaultAngle: 0,
-              },
-              behavior: {
-                deactivateToolAfterCreate: true,
-                selectAfterCreate: true,
-              },
-            });
-
-            ensureTool({
-              id: 'polyline',
-              name: 'Polyline',
-              interaction: { exclusive: true, cursor: 'crosshair' },
-              matchScore: (annotation: PdfAnnotationObject) => (annotation.type === PdfAnnotationSubtype.POLYLINE ? 10 : 0),
-              defaults: {
-                type: PdfAnnotationSubtype.POLYLINE,
-                color: '#1565c0',
-                opacity: 1,
-                borderWidth: 2,
-              },
-              clickBehavior: {
-                enabled: true,
-                finishOnDoubleClick: true,
-              },
-              behavior: {
-                deactivateToolAfterCreate: true,
-                selectAfterCreate: true,
-              },
-            });
-
-            ensureTool({
-              id: 'polygon',
-              name: 'Polygon',
-              interaction: { exclusive: true, cursor: 'crosshair' },
-              matchScore: (annotation: PdfAnnotationObject) => (annotation.type === PdfAnnotationSubtype.POLYGON ? 10 : 0),
-              defaults: {
-                type: PdfAnnotationSubtype.POLYGON,
-                color: '#0000ff', // fill color (blue)
-                strokeColor: '#cf5b5b', // border color (reddish pink)
-                opacity: 0.5,
-                borderWidth: 1,
-              },
-              clickBehavior: {
-                enabled: true,
-                finishOnDoubleClick: true,
-                defaultSize: { width: 140, height: 100 },
-              },
-              behavior: {
-                deactivateToolAfterCreate: true,
-                selectAfterCreate: true,
-              },
-            });
-
-            ensureTool({
-              id: 'text',
-              name: 'Text',
-              interaction: { exclusive: true, cursor: 'text', isRotatable: false },
-              matchScore: (annotation: PdfAnnotationObject) => (annotation.type === PdfAnnotationSubtype.FREETEXT ? 10 : 0),
-              defaults: {
-                type: PdfAnnotationSubtype.FREETEXT,
-                textColor: '#111111',
-                fontSize: 14,
-                fontFamily: 'Helvetica',
-                opacity: 1,
-                interiorColor: '#fffef7',
-                contents: 'Text',
-              },
-              behavior: {
-                deactivateToolAfterCreate: true,
-                selectAfterCreate: true,
-              },
-            });
-
-            ensureTool({
-              id: 'note',
-              name: 'Note',
-              interaction: { exclusive: true, cursor: 'pointer', isRotatable: false },
-              matchScore: (annotation: PdfAnnotationObject) => (annotation.type === PdfAnnotationSubtype.FREETEXT ? 8 : 0),
-              defaults: {
-                type: PdfAnnotationSubtype.FREETEXT,
-                textColor: '#1b1b1b',
-                color: '#ffa000',
-                interiorColor: '#fff8e1',
-                opacity: 1,
-                contents: 'Note',
-                fontSize: 12,
-              },
-              clickBehavior: {
-                enabled: true,
-                defaultSize: { width: 160, height: 100 },
-              },
-              behavior: {
-                deactivateToolAfterCreate: true,
-                selectAfterCreate: true,
-              },
-            });
-
-            ensureTool({
-              id: 'stamp',
-              name: 'Image Stamp',
-              interaction: { exclusive: false, cursor: 'copy' },
-              matchScore: (annotation: PdfAnnotationObject) => (annotation.type === PdfAnnotationSubtype.STAMP ? 5 : 0),
-              defaults: {
-                type: PdfAnnotationSubtype.STAMP,
-              },
-              behavior: {
-                deactivateToolAfterCreate: true,
-                selectAfterCreate: true,
-              },
-            });
-
-            ensureTool({
-              id: 'signatureStamp',
-              name: 'Digital Signature',
-              interaction: { exclusive: false, cursor: 'copy' },
-              matchScore: () => 0,
-              defaults: {
-                type: PdfAnnotationSubtype.STAMP,
-              },
-            });
-
-            ensureTool({
-              id: 'signatureInk',
-              name: 'Signature Draw',
-              interaction: { exclusive: true, cursor: 'crosshair' },
-              matchScore: () => 0,
-              defaults: {
-                type: PdfAnnotationSubtype.INK,
-                strokeColor: '#000000',
-                color: '#000000',
-                opacity: 1.0,
-                borderWidth: 2,
-              },
-            });
-
-            annotationApi.onAnnotationEvent((event: AnnotationEvent) => {
-              if (event.type === 'create' && event.committed) {
-                setAnnotations(prev => [...prev, {
-                  id: event.annotation.id,
-                  pageIndex: event.pageIndex,
-                  rect: event.annotation.rect
-                }]);
-
-                // If the annotation doesn't have customData.toolId, patch it from the active tool.
-                // EmbedPDF doesn't always persist customData from setToolDefaults into created annotations.
-                const annotationId = event.annotation.id;
-                const existingCustomData = (event.annotation as unknown as { customData?: Record<string, unknown> }).customData;
-                if (annotationId && !existingCustomData?.toolId) {
-                  const activeTool = (annotationApi as unknown as { getActiveTool?: () => { id: string } | null }).getActiveTool?.();
-                  if (activeTool?.id && activeTool.id !== 'select') {
-                    (annotationApi as unknown as { updateAnnotation?: (page: number, id: string, patch: Record<string, unknown>) => void })
-                      .updateAnnotation?.(event.pageIndex, annotationId, {
-                        customData: { ...(existingCustomData ?? {}), toolId: activeTool.id },
-                      });
-                  }
-                }
-
-                // Auto-select the annotation after creation so the selection menu appears immediately,
-                // letting users discover the editing options before they click away.
-                if (annotationId) {
-                  (annotationApi as unknown as { selectAnnotation?: (pageIndex: number, id: string) => void })
-                    .selectAnnotation?.(event.pageIndex, annotationId);
-                }
-
-                if (onSignatureAdded) {
-                  onSignatureAdded(event.annotation);
-                }
-              } else if (event.type === 'delete' && event.committed) {
-                setAnnotations(prev => prev.filter(ann => ann.id !== event.annotation.id));
-              }
-            });
-          }
         }}
       >
-        <ActiveDocumentProvider>
-        <ZoomAPIBridge />
-        <ScrollAPIBridge />
-        <SelectionAPIBridge />
-        <PanAPIBridge />
-        <SpreadAPIBridge />
-        <SearchAPIBridge />
-        <ThumbnailAPIBridge />
-        <RotateAPIBridge />
-        {(enableAnnotations || enableRedaction || isManualRedactionMode) && <HistoryAPIBridge ref={historyApiRef} />}
-        {/* Always render RedactionAPIBridge when in manual redaction mode so buttons can switch from annotation mode */}
-        {(enableRedaction || isManualRedactionMode) && <RedactionAPIBridge />}
-        {/* Always render SignatureAPIBridge so annotation tools (draw) can be activated even when starting in redaction mode */}
-        {(enableAnnotations || enableRedaction || isManualRedactionMode) && <SignatureAPIBridge ref={signatureApiRef} isSignMode={isSignMode} />}
-        {(enableRedaction || isManualRedactionMode) && <RedactionPendingTracker ref={redactionTrackerRef} />}
-        {enableAnnotations && <AnnotationAPIBridge ref={annotationApiRef} />}
+        <EmbedPDF
+          engine={engine}
+          plugins={plugins}
+          onInitialized={async (registry: PluginRegistry) => {
+            // v2.0: Use registry.getPlugin() to access plugin APIs
+            const annotationPlugin = registry.getPlugin("annotation");
+            if (!annotationPlugin || !annotationPlugin.provides) return;
 
-        <ExportAPIBridge />
-        <BookmarkAPIBridge />
-        <AttachmentAPIBridge />
-        <PrintAPIBridge
-          file={file}
-          url={pdfUrl}
-          fileName={fileName}
-        />
-        <DocumentPermissionsAPIBridge />
-        <DocumentReadyWrapper
-          fallback={
-            <Center style={{ height: '100%', width: '100%' }}>
-              <ToolLoadingFallback />
-            </Center>
-          }
-        >
-          {(documentId) => (
-            <>
-            <GlobalPointerProvider documentId={documentId}>
-              <Viewport
-                documentId={documentId}
-                style={{
-                  backgroundColor: 'var(--bg-background)',
-                  height: '100%',
-                  width: '100%',
-                  maxHeight: '100%',
-                  maxWidth: '100%',
-                  overflow: 'auto',
-                  position: 'relative',
-                  flex: 1,
-                  minHeight: 0,
-                  minWidth: 0,
-                  contain: 'strict',
-                }}
-              >
-              <Scroller
-                documentId={documentId}
-                renderPage={({ width, height, pageIndex }) => {
-                  return (
-                    <Rotate key={`${documentId}-${pageIndex}`} documentId={documentId} pageIndex={pageIndex}>
-                      <PagePointerProvider documentId={documentId} pageIndex={pageIndex}>
-                        <div
-                          data-page-index={pageIndex}
-                          data-page-width={width}
-                          data-page-height={height}
-                          style={{
-                            width,
-                            height,
-                            position: 'relative',
-                            overflow: 'hidden', // clip overlays (buttons, fields) that extend beyond the page rect
-                            userSelect: 'none',
-                            WebkitUserSelect: 'none',
-                            MozUserSelect: 'none',
-                            msUserSelect: 'none',
-                            boxShadow: '0 2px 8px rgba(0, 0, 0, 0.15)'
-                          }}
-                          draggable={false}
-                          onDragStart={(e) => e.preventDefault()}
-                          onDrop={(e) => e.preventDefault()}
-                          onDragOver={(e) => e.preventDefault()}
-                        >
-                          <div style={{
-                            position: 'absolute',
-                            inset: 0,
-                            transition: 'filter 0.25s ease',
-                            filter:
-                              pdfRenderMode === 'dark'
-                                ? 'invert(1) hue-rotate(180deg)'
-                                : pdfRenderMode === 'sepia'
-                                  ? 'sepia(0.7) brightness(0.85)'
-                                  : undefined,
-                          }}>
-                            <TilingLayer documentId={documentId} pageIndex={pageIndex} />
-                          </div>
+            const annotationApi = annotationPlugin.provides();
+            if (!annotationApi) return;
 
-                          <CustomSearchLayer documentId={documentId} pageIndex={pageIndex} />
+            if (enableAnnotations) {
+              // LooseAnnotationTool bypasses strict Partial<T> defaults typing from the library —
+              // EmbedPDF accepts extra runtime properties (borderWidth, textColor, finishOnDoubleClick,
+              // etc.) that aren't reflected in the TypeScript model types.
+              type LooseAnnotationTool = {
+                id: string;
+                name: string;
+                interaction?: {
+                  exclusive: boolean;
+                  cursor: string;
+                  textSelection?: boolean;
+                  isRotatable?: boolean;
+                };
+                matchScore?: (annotation: PdfAnnotationObject) => number;
+                defaults?: Record<string, unknown>;
+                clickBehavior?: Record<string, unknown>;
+                behavior?: {
+                  deactivateToolAfterCreate?: boolean;
+                  selectAfterCreate?: boolean;
+                };
+              };
+              const ensureTool = (tool: LooseAnnotationTool) => {
+                const existing = annotationApi.getTool?.(tool.id);
+                if (!existing) {
+                  annotationApi.addTool(tool as unknown as AnnotationTool);
+                }
+              };
 
-                          <div className="pdf-selection-layer" style={{ position: 'absolute', inset: 0, pointerEvents: 'none' }}>
-                            <SelectionLayer documentId={documentId} pageIndex={pageIndex} background="var(--pdf-selection-bg)" />
-                          </div>
-                          <TextSelectionHandler documentId={documentId} pageIndex={pageIndex} />
+              ensureTool({
+                id: "highlight",
+                name: "Highlight",
+                interaction: {
+                  exclusive: true,
+                  cursor: "text",
+                  textSelection: true,
+                },
+                matchScore: (annotation: PdfAnnotationObject) =>
+                  annotation.type === PdfAnnotationSubtype.HIGHLIGHT ? 10 : 0,
+                defaults: {
+                  type: PdfAnnotationSubtype.HIGHLIGHT,
+                  strokeColor: "#ffd54f",
+                  color: "#ffd54f",
+                  opacity: 0.6,
+                },
+                behavior: {
+                  deactivateToolAfterCreate: false,
+                  selectAfterCreate: true,
+                },
+              });
 
-                          {/* ButtonAppearanceOverlay — renders PDF-native button visuals as bitmaps */}
-                          {enableFormFill && file && (
-                            <ButtonAppearanceOverlay
-                              pageIndex={pageIndex}
-                              pdfSource={file}
-                              pageWidth={width}
-                              pageHeight={height}
-                            />
-                          )}
+              ensureTool({
+                id: "underline",
+                name: "Underline",
+                interaction: {
+                  exclusive: true,
+                  cursor: "text",
+                  textSelection: true,
+                },
+                matchScore: (annotation: PdfAnnotationObject) =>
+                  annotation.type === PdfAnnotationSubtype.UNDERLINE ? 10 : 0,
+                defaults: {
+                  type: PdfAnnotationSubtype.UNDERLINE,
+                  strokeColor: "#ffb300",
+                  color: "#ffb300",
+                  opacity: 1,
+                },
+                behavior: {
+                  deactivateToolAfterCreate: false,
+                  selectAfterCreate: true,
+                },
+              });
 
-                          {/* FormFieldOverlay for interactive form filling */}
-                          {enableFormFill && (
-                            <FormFieldOverlay
-                              documentId={documentId}
-                              pageIndex={pageIndex}
-                              pageWidth={width}
-                              pageHeight={height}
-                              fileId={fileId}
-                            />
-                          )}
+              ensureTool({
+                id: "strikeout",
+                name: "Strikeout",
+                interaction: {
+                  exclusive: true,
+                  cursor: "text",
+                  textSelection: true,
+                },
+                matchScore: (annotation: PdfAnnotationObject) =>
+                  annotation.type === PdfAnnotationSubtype.STRIKEOUT ? 10 : 0,
+                defaults: {
+                  type: PdfAnnotationSubtype.STRIKEOUT,
+                  strokeColor: "#e53935",
+                  color: "#e53935",
+                  opacity: 1,
+                },
+                behavior: {
+                  deactivateToolAfterCreate: false,
+                  selectAfterCreate: true,
+                },
+              });
 
-                          {/* SignatureFieldOverlay — bitmaps of digital-signature appearances */}
-                          {file && (
-                            <SignatureFieldOverlay
-                              documentId={documentId}
-                              pageIndex={pageIndex}
-                              pdfSource={file}
-                              pageWidth={width}
-                              pageHeight={height}
-                            />
-                          )}
+              ensureTool({
+                id: "squiggly",
+                name: "Squiggly",
+                interaction: {
+                  exclusive: true,
+                  cursor: "text",
+                  textSelection: true,
+                },
+                matchScore: (annotation: PdfAnnotationObject) =>
+                  annotation.type === PdfAnnotationSubtype.SQUIGGLY ? 10 : 0,
+                defaults: {
+                  type: PdfAnnotationSubtype.SQUIGGLY,
+                  strokeColor: "#00acc1",
+                  color: "#00acc1",
+                  opacity: 1,
+                },
+                behavior: {
+                  deactivateToolAfterCreate: false,
+                  selectAfterCreate: true,
+                },
+              });
 
-                          {/* AnnotationLayer for annotation editing and annotation-based redactions */}
-                          {(enableAnnotations || enableRedaction) && (
-                            <AnnotationLayer
-                              documentId={documentId}
-                              pageIndex={pageIndex}
-                              selectionOutline={{ color: "#007ACC" }}
-                              selectionMenu={(props) => <AnnotationSelectionMenu {...props} />}
-                              style={!showBakedAnnotations ? { opacity: 0, pointerEvents: 'none' } : undefined}
-                            />
-                          )}
+              ensureTool({
+                id: "ink",
+                name: "Pen",
+                interaction: { exclusive: true, cursor: "crosshair" },
+                matchScore: (annotation: PdfAnnotationObject) =>
+                  annotation.type === PdfAnnotationSubtype.INK ? 10 : 0,
+                defaults: {
+                  type: PdfAnnotationSubtype.INK,
+                  strokeColor: "#1f2933",
+                  color: "#1f2933",
+                  opacity: 1,
+                  borderWidth: 2,
+                  lineWidth: 2,
+                  strokeWidth: 2,
+                },
+                behavior: {
+                  deactivateToolAfterCreate: false,
+                  selectAfterCreate: true,
+                },
+              });
 
-                          {enableRedaction && (
-                            <RedactionLayer
-                              documentId={documentId}
-                              pageIndex={pageIndex}
-                              selectionMenu={(props) => <RedactionSelectionMenu {...props} />}
-                            />
-                          )}
+              ensureTool({
+                id: "inkHighlighter",
+                name: "Ink Highlighter",
+                interaction: { exclusive: true, cursor: "crosshair" },
+                matchScore: (annotation: PdfAnnotationObject) =>
+                  annotation.type === PdfAnnotationSubtype.INK &&
+                  (annotation.strokeColor === "#ffd54f" ||
+                    annotation.color === "#ffd54f")
+                    ? 8
+                    : 0,
+                defaults: {
+                  type: PdfAnnotationSubtype.INK,
+                  strokeColor: "#ffd54f",
+                  color: "#ffd54f",
+                  opacity: 0.5,
+                  borderWidth: 6,
+                  lineWidth: 6,
+                  strokeWidth: 6,
+                },
+                behavior: {
+                  deactivateToolAfterCreate: false,
+                  selectAfterCreate: true,
+                },
+              });
 
-                          {/* LinkLayer – uses EmbedPDF annotation state for link rendering */}
-                          <LinkLayer
-                            documentId={documentId}
-                            pageIndex={pageIndex}
-                          />
-                        </div>
-                      </PagePointerProvider>
-                    </Rotate>
+              ensureTool({
+                id: "square",
+                name: "Square",
+                interaction: { exclusive: true, cursor: "crosshair" },
+                matchScore: (annotation: PdfAnnotationObject) =>
+                  annotation.type === PdfAnnotationSubtype.SQUARE ? 10 : 0,
+                defaults: {
+                  type: PdfAnnotationSubtype.SQUARE,
+                  color: "#0000ff", // fill color (blue)
+                  strokeColor: "#cf5b5b", // border color (reddish pink)
+                  opacity: 0.5,
+                  borderWidth: 1,
+                  strokeWidth: 1,
+                  lineWidth: 1,
+                },
+                clickBehavior: {
+                  enabled: true,
+                  defaultSize: { width: 120, height: 90 },
+                },
+                behavior: {
+                  deactivateToolAfterCreate: true,
+                  selectAfterCreate: true,
+                },
+              });
+
+              ensureTool({
+                id: "circle",
+                name: "Circle",
+                interaction: { exclusive: true, cursor: "crosshair" },
+                matchScore: (annotation: PdfAnnotationObject) =>
+                  annotation.type === PdfAnnotationSubtype.CIRCLE ? 10 : 0,
+                defaults: {
+                  type: PdfAnnotationSubtype.CIRCLE,
+                  color: "#0000ff", // fill color (blue)
+                  strokeColor: "#cf5b5b", // border color (reddish pink)
+                  opacity: 0.5,
+                  borderWidth: 1,
+                  strokeWidth: 1,
+                  lineWidth: 1,
+                },
+                clickBehavior: {
+                  enabled: true,
+                  defaultSize: { width: 100, height: 100 },
+                },
+                behavior: {
+                  deactivateToolAfterCreate: true,
+                  selectAfterCreate: true,
+                },
+              });
+
+              ensureTool({
+                id: "line",
+                name: "Line",
+                interaction: { exclusive: true, cursor: "crosshair" },
+                matchScore: (annotation: PdfAnnotationObject) =>
+                  annotation.type === PdfAnnotationSubtype.LINE ? 10 : 0,
+                defaults: {
+                  type: PdfAnnotationSubtype.LINE,
+                  color: "#1565c0",
+                  opacity: 1,
+                  borderWidth: 2,
+                  strokeWidth: 2,
+                  lineWidth: 2,
+                },
+                clickBehavior: {
+                  enabled: true,
+                  defaultLength: 120,
+                  defaultAngle: 0,
+                },
+                behavior: {
+                  deactivateToolAfterCreate: true,
+                  selectAfterCreate: true,
+                },
+              });
+
+              ensureTool({
+                id: "lineArrow",
+                name: "Arrow",
+                interaction: { exclusive: true, cursor: "crosshair" },
+                matchScore: (annotation: PdfAnnotationObject) => {
+                  if (annotation.type !== PdfAnnotationSubtype.LINE) return 0;
+                  // EmbedPDF stores endStyle/lineEndingStyles at runtime; library types use lineEndings
+                  const ann = annotation as PdfAnnotationObject & {
+                    endStyle?: string;
+                    lineEndingStyles?: { end?: string };
+                  };
+                  return ann.endStyle === "ClosedArrow" ||
+                    ann.lineEndingStyles?.end === "ClosedArrow"
+                    ? 9
+                    : 0;
+                },
+                defaults: {
+                  type: PdfAnnotationSubtype.LINE,
+                  color: "#1565c0",
+                  opacity: 1,
+                  borderWidth: 2,
+                  startStyle: "None",
+                  endStyle: "ClosedArrow",
+                  lineEndingStyles: { start: "None", end: "ClosedArrow" },
+                },
+                clickBehavior: {
+                  enabled: true,
+                  defaultLength: 120,
+                  defaultAngle: 0,
+                },
+                behavior: {
+                  deactivateToolAfterCreate: true,
+                  selectAfterCreate: true,
+                },
+              });
+
+              ensureTool({
+                id: "polyline",
+                name: "Polyline",
+                interaction: { exclusive: true, cursor: "crosshair" },
+                matchScore: (annotation: PdfAnnotationObject) =>
+                  annotation.type === PdfAnnotationSubtype.POLYLINE ? 10 : 0,
+                defaults: {
+                  type: PdfAnnotationSubtype.POLYLINE,
+                  color: "#1565c0",
+                  opacity: 1,
+                  borderWidth: 2,
+                },
+                clickBehavior: {
+                  enabled: true,
+                  finishOnDoubleClick: true,
+                },
+                behavior: {
+                  deactivateToolAfterCreate: true,
+                  selectAfterCreate: true,
+                },
+              });
+
+              ensureTool({
+                id: "polygon",
+                name: "Polygon",
+                interaction: { exclusive: true, cursor: "crosshair" },
+                matchScore: (annotation: PdfAnnotationObject) =>
+                  annotation.type === PdfAnnotationSubtype.POLYGON ? 10 : 0,
+                defaults: {
+                  type: PdfAnnotationSubtype.POLYGON,
+                  color: "#0000ff", // fill color (blue)
+                  strokeColor: "#cf5b5b", // border color (reddish pink)
+                  opacity: 0.5,
+                  borderWidth: 1,
+                },
+                clickBehavior: {
+                  enabled: true,
+                  finishOnDoubleClick: true,
+                  defaultSize: { width: 140, height: 100 },
+                },
+                behavior: {
+                  deactivateToolAfterCreate: true,
+                  selectAfterCreate: true,
+                },
+              });
+
+              ensureTool({
+                id: "text",
+                name: "Text",
+                interaction: {
+                  exclusive: true,
+                  cursor: "text",
+                  isRotatable: false,
+                },
+                matchScore: (annotation: PdfAnnotationObject) =>
+                  annotation.type === PdfAnnotationSubtype.FREETEXT ? 10 : 0,
+                defaults: {
+                  type: PdfAnnotationSubtype.FREETEXT,
+                  textColor: "#111111",
+                  fontSize: 14,
+                  fontFamily: "Helvetica",
+                  opacity: 1,
+                  interiorColor: "#fffef7",
+                  contents: "Text",
+                },
+                behavior: {
+                  deactivateToolAfterCreate: true,
+                  selectAfterCreate: true,
+                },
+              });
+
+              ensureTool({
+                id: "note",
+                name: "Note",
+                interaction: {
+                  exclusive: true,
+                  cursor: "pointer",
+                  isRotatable: false,
+                },
+                matchScore: (annotation: PdfAnnotationObject) =>
+                  annotation.type === PdfAnnotationSubtype.FREETEXT ? 8 : 0,
+                defaults: {
+                  type: PdfAnnotationSubtype.FREETEXT,
+                  textColor: "#1b1b1b",
+                  color: "#ffa000",
+                  interiorColor: "#fff8e1",
+                  opacity: 1,
+                  contents: "Note",
+                  fontSize: 12,
+                },
+                clickBehavior: {
+                  enabled: true,
+                  defaultSize: { width: 160, height: 100 },
+                },
+                behavior: {
+                  deactivateToolAfterCreate: true,
+                  selectAfterCreate: true,
+                },
+              });
+
+              ensureTool({
+                id: "stamp",
+                name: "Image Stamp",
+                interaction: { exclusive: false, cursor: "copy" },
+                matchScore: (annotation: PdfAnnotationObject) =>
+                  annotation.type === PdfAnnotationSubtype.STAMP ? 5 : 0,
+                defaults: {
+                  type: PdfAnnotationSubtype.STAMP,
+                },
+                behavior: {
+                  deactivateToolAfterCreate: true,
+                  selectAfterCreate: true,
+                },
+              });
+
+              ensureTool({
+                id: "signatureStamp",
+                name: "Digital Signature",
+                interaction: { exclusive: false, cursor: "copy" },
+                matchScore: () => 0,
+                defaults: {
+                  type: PdfAnnotationSubtype.STAMP,
+                },
+              });
+
+              ensureTool({
+                id: "signatureInk",
+                name: "Signature Draw",
+                interaction: { exclusive: true, cursor: "crosshair" },
+                matchScore: () => 0,
+                defaults: {
+                  type: PdfAnnotationSubtype.INK,
+                  strokeColor: "#000000",
+                  color: "#000000",
+                  opacity: 1.0,
+                  borderWidth: 2,
+                },
+              });
+
+              annotationApi.onAnnotationEvent((event: AnnotationEvent) => {
+                if (event.type === "create" && event.committed) {
+                  setAnnotations((prev) => [
+                    ...prev,
+                    {
+                      id: event.annotation.id,
+                      pageIndex: event.pageIndex,
+                      rect: event.annotation.rect,
+                    },
+                  ]);
+
+                  // If the annotation doesn't have customData.toolId, patch it from the active tool.
+                  // EmbedPDF doesn't always persist customData from setToolDefaults into created annotations.
+                  const annotationId = event.annotation.id;
+                  const existingCustomData = (
+                    event.annotation as unknown as {
+                      customData?: Record<string, unknown>;
+                    }
+                  ).customData;
+                  if (annotationId && !existingCustomData?.toolId) {
+                    const activeTool = (
+                      annotationApi as unknown as {
+                        getActiveTool?: () => { id: string } | null;
+                      }
+                    ).getActiveTool?.();
+                    if (activeTool?.id && activeTool.id !== "select") {
+                      (
+                        annotationApi as unknown as {
+                          updateAnnotation?: (
+                            page: number,
+                            id: string,
+                            patch: Record<string, unknown>,
+                          ) => void;
+                        }
+                      ).updateAnnotation?.(event.pageIndex, annotationId, {
+                        customData: {
+                          ...(existingCustomData ?? {}),
+                          toolId: activeTool.id,
+                        },
+                      });
+                    }
+                  }
+
+                  // Auto-select the annotation after creation so the selection menu appears immediately,
+                  // letting users discover the editing options before they click away.
+                  if (annotationId) {
+                    (
+                      annotationApi as unknown as {
+                        selectAnnotation?: (
+                          pageIndex: number,
+                          id: string,
+                        ) => void;
+                      }
+                    ).selectAnnotation?.(event.pageIndex, annotationId);
+                  }
+
+                  if (onSignatureAdded) {
+                    onSignatureAdded(event.annotation);
+                  }
+                } else if (event.type === "delete" && event.committed) {
+                  setAnnotations((prev) =>
+                    prev.filter((ann) => ann.id !== event.annotation.id),
                   );
-                }}
-              />
-              </Viewport>
-            </GlobalPointerProvider>
-            {enableAnnotations && (
-              <CommentAuthorProvider displayName={commentAuthorName}>
-                <CommentsSidebar
-                  documentId={documentId}
-                  visible={isCommentsSidebarVisible}
-                  rightOffset={commentsSidebarRightOffset}
-                />
-              </CommentAuthorProvider>
+                }
+              });
+            }
+          }}
+        >
+          <ActiveDocumentProvider>
+            <ZoomAPIBridge />
+            <ScrollAPIBridge />
+            <SelectionAPIBridge />
+            <PanAPIBridge />
+            <SpreadAPIBridge />
+            <SearchAPIBridge />
+            <ThumbnailAPIBridge />
+            <RotateAPIBridge />
+            {(enableAnnotations ||
+              enableRedaction ||
+              isManualRedactionMode) && (
+              <HistoryAPIBridge ref={historyApiRef} />
             )}
-            </>
-          )}
-        </DocumentReadyWrapper>
-        </ActiveDocumentProvider>
-      </EmbedPDF>
+            {/* Always render RedactionAPIBridge when in manual redaction mode so buttons can switch from annotation mode */}
+            {(enableRedaction || isManualRedactionMode) && (
+              <RedactionAPIBridge />
+            )}
+            {/* Always render SignatureAPIBridge so annotation tools (draw) can be activated even when starting in redaction mode */}
+            {(enableAnnotations ||
+              enableRedaction ||
+              isManualRedactionMode) && (
+              <SignatureAPIBridge
+                ref={signatureApiRef}
+                isSignMode={isSignMode}
+              />
+            )}
+            {(enableRedaction || isManualRedactionMode) && (
+              <RedactionPendingTracker ref={redactionTrackerRef} />
+            )}
+            {enableAnnotations && (
+              <AnnotationAPIBridge ref={annotationApiRef} />
+            )}
+
+            <ExportAPIBridge />
+            <BookmarkAPIBridge />
+            <AttachmentAPIBridge />
+            <PrintAPIBridge file={file} url={pdfUrl} fileName={fileName} />
+            <DocumentPermissionsAPIBridge />
+            <DocumentReadyWrapper
+              fallback={
+                <Center style={{ height: "100%", width: "100%" }}>
+                  <ToolLoadingFallback />
+                </Center>
+              }
+            >
+              {(documentId) => (
+                <>
+                  <GlobalPointerProvider documentId={documentId}>
+                    <Viewport
+                      documentId={documentId}
+                      style={{
+                        backgroundColor: "var(--bg-background)",
+                        height: "100%",
+                        width: "100%",
+                        maxHeight: "100%",
+                        maxWidth: "100%",
+                        overflow: "auto",
+                        position: "relative",
+                        flex: 1,
+                        minHeight: 0,
+                        minWidth: 0,
+                        contain: "strict",
+                      }}
+                    >
+                      <Scroller
+                        documentId={documentId}
+                        renderPage={({ width, height, pageIndex }) => {
+                          return (
+                            <Rotate
+                              key={`${documentId}-${pageIndex}`}
+                              documentId={documentId}
+                              pageIndex={pageIndex}
+                            >
+                              <PagePointerProvider
+                                documentId={documentId}
+                                pageIndex={pageIndex}
+                              >
+                                <div
+                                  data-page-index={pageIndex}
+                                  data-page-width={width}
+                                  data-page-height={height}
+                                  style={{
+                                    width,
+                                    height,
+                                    position: "relative",
+                                    overflow: "hidden", // clip overlays (buttons, fields) that extend beyond the page rect
+                                    userSelect: "none",
+                                    WebkitUserSelect: "none",
+                                    MozUserSelect: "none",
+                                    msUserSelect: "none",
+                                    boxShadow: "0 2px 8px rgba(0, 0, 0, 0.15)",
+                                  }}
+                                  draggable={false}
+                                  onDragStart={(e) => e.preventDefault()}
+                                  onDrop={(e) => e.preventDefault()}
+                                  onDragOver={(e) => e.preventDefault()}
+                                >
+                                  <div
+                                    style={{
+                                      position: "absolute",
+                                      inset: 0,
+                                      transition: "filter 0.25s ease",
+                                      filter:
+                                        pdfRenderMode === "dark"
+                                          ? "invert(1) hue-rotate(180deg)"
+                                          : pdfRenderMode === "sepia"
+                                            ? "sepia(0.7) brightness(0.85)"
+                                            : undefined,
+                                    }}
+                                  >
+                                    <TilingLayer
+                                      documentId={documentId}
+                                      pageIndex={pageIndex}
+                                    />
+                                  </div>
+
+                                  <CustomSearchLayer
+                                    documentId={documentId}
+                                    pageIndex={pageIndex}
+                                  />
+
+                                  <div
+                                    className="pdf-selection-layer"
+                                    style={{
+                                      position: "absolute",
+                                      inset: 0,
+                                      pointerEvents: "none",
+                                    }}
+                                  >
+                                    <SelectionLayer
+                                      documentId={documentId}
+                                      pageIndex={pageIndex}
+                                      background="var(--pdf-selection-bg)"
+                                    />
+                                  </div>
+                                  <TextSelectionHandler
+                                    documentId={documentId}
+                                    pageIndex={pageIndex}
+                                  />
+
+                                  {/* ButtonAppearanceOverlay — renders PDF-native button visuals as bitmaps */}
+                                  {enableFormFill && file && (
+                                    <ButtonAppearanceOverlay
+                                      pageIndex={pageIndex}
+                                      pdfSource={file}
+                                      pageWidth={width}
+                                      pageHeight={height}
+                                    />
+                                  )}
+
+                                  {/* FormFieldOverlay for interactive form filling */}
+                                  {enableFormFill && (
+                                    <FormFieldOverlay
+                                      documentId={documentId}
+                                      pageIndex={pageIndex}
+                                      pageWidth={width}
+                                      pageHeight={height}
+                                      fileId={fileId}
+                                    />
+                                  )}
+
+                                  {/* SignatureFieldOverlay — bitmaps of digital-signature appearances */}
+                                  {file && (
+                                    <SignatureFieldOverlay
+                                      documentId={documentId}
+                                      pageIndex={pageIndex}
+                                      pdfSource={file}
+                                      pageWidth={width}
+                                      pageHeight={height}
+                                    />
+                                  )}
+
+                                  {/* AnnotationLayer for annotation editing and annotation-based redactions */}
+                                  {(enableAnnotations || enableRedaction) && (
+                                    <AnnotationLayer
+                                      documentId={documentId}
+                                      pageIndex={pageIndex}
+                                      selectionOutline={{ color: "#007ACC" }}
+                                      selectionMenu={(props) => (
+                                        <AnnotationSelectionMenu {...props} />
+                                      )}
+                                      style={
+                                        !showBakedAnnotations
+                                          ? {
+                                              opacity: 0,
+                                              pointerEvents: "none",
+                                            }
+                                          : undefined
+                                      }
+                                    />
+                                  )}
+
+                                  {enableRedaction && (
+                                    <RedactionLayer
+                                      documentId={documentId}
+                                      pageIndex={pageIndex}
+                                      selectionMenu={(props) => (
+                                        <RedactionSelectionMenu {...props} />
+                                      )}
+                                    />
+                                  )}
+
+                                  {/* LinkLayer – uses EmbedPDF annotation state for link rendering */}
+                                  <LinkLayer
+                                    documentId={documentId}
+                                    pageIndex={pageIndex}
+                                  />
+                                </div>
+                              </PagePointerProvider>
+                            </Rotate>
+                          );
+                        }}
+                      />
+                    </Viewport>
+                  </GlobalPointerProvider>
+                  {enableAnnotations && (
+                    <CommentAuthorProvider displayName={commentAuthorName}>
+                      <CommentsSidebar
+                        documentId={documentId}
+                        visible={isCommentsSidebarVisible}
+                        rightOffset={commentsSidebarRightOffset}
+                      />
+                    </CommentAuthorProvider>
+                  )}
+                </>
+              )}
+            </DocumentReadyWrapper>
+          </ActiveDocumentProvider>
+        </EmbedPDF>
       </div>
     </PrivateContent>
   );
diff --git a/frontend/src/core/components/viewer/LocalEmbedPDFWithAnnotations.tsx b/frontend/src/core/components/viewer/LocalEmbedPDFWithAnnotations.tsx
index fc234c6d9c..5ac95b1fc9 100644
--- a/frontend/src/core/components/viewer/LocalEmbedPDFWithAnnotations.tsx
+++ b/frontend/src/core/components/viewer/LocalEmbedPDFWithAnnotations.tsx
@@ -1,63 +1,96 @@
-import { useEffect, useMemo, useState, useImperativeHandle, forwardRef, useRef } from 'react';
-import { createPluginRegistration } from '@embedpdf/core';
-import type { PluginRegistry } from '@embedpdf/core';
-import { EmbedPDF } from '@embedpdf/core/react';
-import { usePdfiumEngine } from '@embedpdf/engines/react';
+import {
+  useEffect,
+  useMemo,
+  useState,
+  useImperativeHandle,
+  forwardRef,
+  useRef,
+} from "react";
+import { createPluginRegistration } from "@embedpdf/core";
+import type { PluginRegistry } from "@embedpdf/core";
+import { EmbedPDF } from "@embedpdf/core/react";
+import { usePdfiumEngine } from "@embedpdf/engines/react";
 
 // Import the essential plugins
-import { Viewport, ViewportPluginPackage } from '@embedpdf/plugin-viewport/react';
-import { Scroller, ScrollPluginPackage } from '@embedpdf/plugin-scroll/react';
-import { DocumentManagerPluginPackage } from '@embedpdf/plugin-document-manager/react';
-import { RenderPluginPackage } from '@embedpdf/plugin-render/react';
-import { ZoomPluginPackage, ZoomMode } from '@embedpdf/plugin-zoom/react';
-import { InteractionManagerPluginPackage, PagePointerProvider, GlobalPointerProvider, useInteractionManagerCapability } from '@embedpdf/plugin-interaction-manager/react';
-import { SelectionLayer, SelectionPluginPackage } from '@embedpdf/plugin-selection/react';
-import { TilingLayer, TilingPluginPackage } from '@embedpdf/plugin-tiling/react';
-import { PanPluginPackage } from '@embedpdf/plugin-pan/react';
-import { SpreadPluginPackage, SpreadMode } from '@embedpdf/plugin-spread/react';
-import { SearchPluginPackage } from '@embedpdf/plugin-search/react';
-import { ThumbnailPluginPackage } from '@embedpdf/plugin-thumbnail/react';
-import { RotatePluginPackage, Rotate } from '@embedpdf/plugin-rotate/react';
-import { Rotation, PdfAnnotationSubtype } from '@embedpdf/models';
-
+import {
+  Viewport,
+  ViewportPluginPackage,
+} from "@embedpdf/plugin-viewport/react";
+import { Scroller, ScrollPluginPackage } from "@embedpdf/plugin-scroll/react";
+import { DocumentManagerPluginPackage } from "@embedpdf/plugin-document-manager/react";
+import { RenderPluginPackage } from "@embedpdf/plugin-render/react";
+import { ZoomPluginPackage, ZoomMode } from "@embedpdf/plugin-zoom/react";
+import {
+  InteractionManagerPluginPackage,
+  PagePointerProvider,
+  GlobalPointerProvider,
+  useInteractionManagerCapability,
+} from "@embedpdf/plugin-interaction-manager/react";
+import {
+  SelectionLayer,
+  SelectionPluginPackage,
+} from "@embedpdf/plugin-selection/react";
+import {
+  TilingLayer,
+  TilingPluginPackage,
+} from "@embedpdf/plugin-tiling/react";
+import { PanPluginPackage } from "@embedpdf/plugin-pan/react";
+import { SpreadPluginPackage, SpreadMode } from "@embedpdf/plugin-spread/react";
+import { SearchPluginPackage } from "@embedpdf/plugin-search/react";
+import { ThumbnailPluginPackage } from "@embedpdf/plugin-thumbnail/react";
+import { RotatePluginPackage, Rotate } from "@embedpdf/plugin-rotate/react";
+import { Rotation, PdfAnnotationSubtype } from "@embedpdf/models";
 
 // Import annotation plugins
-import { HistoryPluginPackage } from '@embedpdf/plugin-history/react';
-import { AnnotationLayer, AnnotationPluginPackage } from '@embedpdf/plugin-annotation/react';
+import { HistoryPluginPackage } from "@embedpdf/plugin-history/react";
+import {
+  AnnotationLayer,
+  AnnotationPluginPackage,
+} from "@embedpdf/plugin-annotation/react";
 
-import { CustomSearchLayer } from '@app/components/viewer/CustomSearchLayer';
-import ToolLoadingFallback from '@app/components/tools/ToolLoadingFallback';
-import { ActionIcon, Center, Stack, Text, Tooltip } from '@mantine/core';
-import CloseIcon from '@mui/icons-material/Close';
-import { ScrollAPIBridge } from '@app/components/viewer/ScrollAPIBridge';
-import { SelectionAPIBridge } from '@app/components/viewer/SelectionAPIBridge';
-import { PanAPIBridge } from '@app/components/viewer/PanAPIBridge';
-import { SpreadAPIBridge } from '@app/components/viewer/SpreadAPIBridge';
-import { SearchAPIBridge } from '@app/components/viewer/SearchAPIBridge';
-import { ThumbnailAPIBridge } from '@app/components/viewer/ThumbnailAPIBridge';
-import { RotateAPIBridge } from '@app/components/viewer/RotateAPIBridge';
-import { DocumentReadyWrapper } from '@app/components/viewer/DocumentReadyWrapper';
+import { CustomSearchLayer } from "@app/components/viewer/CustomSearchLayer";
+import ToolLoadingFallback from "@app/components/tools/ToolLoadingFallback";
+import { ActionIcon, Center, Stack, Text, Tooltip } from "@mantine/core";
+import CloseIcon from "@mui/icons-material/Close";
+import { ScrollAPIBridge } from "@app/components/viewer/ScrollAPIBridge";
+import { SelectionAPIBridge } from "@app/components/viewer/SelectionAPIBridge";
+import { PanAPIBridge } from "@app/components/viewer/PanAPIBridge";
+import { SpreadAPIBridge } from "@app/components/viewer/SpreadAPIBridge";
+import { SearchAPIBridge } from "@app/components/viewer/SearchAPIBridge";
+import { ThumbnailAPIBridge } from "@app/components/viewer/ThumbnailAPIBridge";
+import { RotateAPIBridge } from "@app/components/viewer/RotateAPIBridge";
+import { DocumentReadyWrapper } from "@app/components/viewer/DocumentReadyWrapper";
 import {
   Z_INDEX_SIGNATURE_OVERLAY,
   Z_INDEX_SIGNATURE_OVERLAY_DELETE,
   Z_INDEX_SIGNATURE_OVERLAY_HANDLE,
-} from '@app/styles/zIndex';
+} from "@app/styles/zIndex";
 
 /** Rendered inside EmbedPDF context; exposes interaction manager pause/resume via ref. */
-function InteractionPauseBridge({ bridgeRef }: {
-  bridgeRef: React.MutableRefObject<{ pause: () => void; resume: () => void } | null>;
+function InteractionPauseBridge({
+  bridgeRef,
+}: {
+  bridgeRef: React.MutableRefObject<{
+    pause: () => void;
+    resume: () => void;
+  } | null>;
 }) {
   const { provides } = useInteractionManagerCapability();
   useEffect(() => {
     if (provides) {
-      bridgeRef.current = { pause: () => provides.pause(), resume: () => provides.resume() };
+      bridgeRef.current = {
+        pause: () => provides.pause(),
+        resume: () => provides.resume(),
+      };
     }
-    return () => { bridgeRef.current = null; };
+    return () => {
+      bridgeRef.current = null;
+    };
   }, [provides, bridgeRef]);
   return null;
 }
 
-const DOCUMENT_NAME = 'stirling-pdf-signing-viewer';
+const DOCUMENT_NAME = "stirling-pdf-signing-viewer";
 
 export interface SignaturePreview {
   id: string;
@@ -67,7 +100,7 @@ export interface SignaturePreview {
   width: number;
   height: number;
   signatureData: string; // Base64 PNG image
-  signatureType: 'canvas' | 'image' | 'text';
+  signatureType: "canvas" | "image" | "text";
   color?: string; // Per-participant color (rgb(...) string); falls back to default blue
   participantName?: string; // Shown in tooltip on hover
 }
@@ -78,8 +111,15 @@ interface LocalEmbedPDFWithAnnotationsProps {
   onAnnotationChange?: (annotations: SignaturePreview[]) => void;
   placementMode?: boolean;
   signatureData?: string;
-  signatureType?: 'canvas' | 'image' | 'text';
-  onPlaceSignature?: (id: string, pageIndex: number, x: number, y: number, width: number, height: number) => void;
+  signatureType?: "canvas" | "image" | "text";
+  onPlaceSignature?: (
+    id: string,
+    pageIndex: number,
+    x: number,
+    y: number,
+    width: number,
+    height: number,
+  ) => void;
   onPreviewCountChange?: (count: number) => void;
   initialSignatures?: SignaturePreview[]; // Initial signatures to display (read-only preview)
   readOnly?: boolean; // If true, signature previews cannot be moved or deleted
@@ -98,622 +138,863 @@ export interface AnnotationAPI {
   resetZoom: () => void;
 }
 
-export const LocalEmbedPDFWithAnnotations = forwardRef<AnnotationAPI | null, LocalEmbedPDFWithAnnotationsProps>(({
-  file,
-  url,
-  onAnnotationChange,
-  placementMode = false,
-  signatureData,
-  signatureType,
-  onPlaceSignature,
-  onPreviewCountChange,
-  initialSignatures = [],
-  readOnly = false
-}, ref) => {
-  const [pdfUrl, setPdfUrl] = useState<string | null>(null);
-  const annotationApiRef = useRef<any>(null);
-  const zoomApiRef = useRef<any>(null);
-  const containerRef = useRef<HTMLDivElement>(null);
-
-  // State for signature preview overlays (support multiple)
-  const [signaturePreviews, setSignaturePreviews] = useState<SignaturePreview[]>(initialSignatures);
-
-  // Track if a drag operation just occurred to prevent click from firing
-  const isDraggingRef = useRef(false);
-  const interactionPauseRef = useRef<{ pause: () => void; resume: () => void } | null>(null);
-
-  // Track cursor position over a specific page for hover preview
-  const [cursorOnPage, setCursorOnPage] = useState<{ pageIndex: number; x: number; y: number } | null>(null);
-
-  // Expose annotation API to parent
-  useImperativeHandle(ref, () => ({
-    setActiveTool: (toolId: string | null) => {
-      annotationApiRef.current?.setActiveTool(toolId);
+export const LocalEmbedPDFWithAnnotations = forwardRef<
+  AnnotationAPI | null,
+  LocalEmbedPDFWithAnnotationsProps
+>(
+  (
+    {
+      file,
+      url,
+      onAnnotationChange,
+      placementMode = false,
+      signatureData,
+      signatureType,
+      onPlaceSignature,
+      onPreviewCountChange,
+      initialSignatures = [],
+      readOnly = false,
     },
-    setToolDefaults: (toolId: string, defaults: any) => {
-      annotationApiRef.current?.setToolDefaults(toolId, defaults);
-    },
-    getActiveTool: () => {
-      return annotationApiRef.current?.getActiveTool();
-    },
-    getPageAnnotations: async (pageIndex: number) => {
-      if (!annotationApiRef.current?.getPageAnnotations) return [];
-      const task = annotationApiRef.current.getPageAnnotations({ pageIndex });
-      if (task?.toPromise) {
-        return await task.toPromise();
-      }
-      return [];
-    },
-    getAllAnnotations: async () => {
-      // Get all annotations across all pages
-      // Note: In practice, we'll use getPageAnnotations for the specific page
-      // where the user placed their signature, so this method is optional
-      if (!annotationApiRef.current?.getPageAnnotations) return [];
+    ref,
+  ) => {
+    const [pdfUrl, setPdfUrl] = useState<string | null>(null);
+    const annotationApiRef = useRef<any>(null);
+    const zoomApiRef = useRef<any>(null);
+    const containerRef = useRef<HTMLDivElement>(null);
 
-      // Would need document page count to iterate through all pages
-      // For signing workflow, we track annotations via onAnnotationChange callback instead
-      return [];
-    },
-    getSignaturePreviews: () => {
-      return signaturePreviews;
-    },
-    clearPreviews: () => {
-      setSignaturePreviews([]);
-    },
-    zoomIn: () => {
-      zoomApiRef.current?.zoomIn();
-    },
-    zoomOut: () => {
-      zoomApiRef.current?.zoomOut();
-    },
-    resetZoom: () => {
-      zoomApiRef.current?.resetZoom();
-    },
-  }), [signaturePreviews]);
+    // State for signature preview overlays (support multiple)
+    const [signaturePreviews, setSignaturePreviews] =
+      useState<SignaturePreview[]>(initialSignatures);
 
-  // Convert File to URL if needed
-  useEffect(() => {
-    if (file) {
-      const objectUrl = URL.createObjectURL(file);
-      setPdfUrl(objectUrl);
-      return () => URL.revokeObjectURL(objectUrl);
-    } else if (url) {
-      setPdfUrl(url);
-    }
-  }, [file, url]);
+    // Track if a drag operation just occurred to prevent click from firing
+    const isDraggingRef = useRef(false);
+    const interactionPauseRef = useRef<{
+      pause: () => void;
+      resume: () => void;
+    } | null>(null);
 
-  // Notify parent when signature previews change
-  useEffect(() => {
-    if (onAnnotationChange) {
-      onAnnotationChange(signaturePreviews);
-    }
-    if (onPreviewCountChange) {
-      onPreviewCountChange(signaturePreviews.length);
-    }
-  }, [signaturePreviews, onAnnotationChange, onPreviewCountChange]);
+    // Track cursor position over a specific page for hover preview
+    const [cursorOnPage, setCursorOnPage] = useState<{
+      pageIndex: number;
+      x: number;
+      y: number;
+    } | null>(null);
 
-  // Create plugins configuration with annotation support
-  const plugins = useMemo(() => {
-    if (!pdfUrl) return [];
-
-    // Calculate 3.5rem in pixels dynamically based on root font size
-    const rootFontSize = parseFloat(getComputedStyle(document.documentElement).fontSize);
-    const viewportGap = rootFontSize * 3.5;
-
-    return [
-      createPluginRegistration(DocumentManagerPluginPackage, {
-        initialDocuments: [{
-          url: pdfUrl,
-          name: DOCUMENT_NAME,
-        }],
-      }),
-      createPluginRegistration(ViewportPluginPackage, {
-        viewportGap,
-      }),
-      createPluginRegistration(ScrollPluginPackage),
-      createPluginRegistration(RenderPluginPackage, {
-        withForms: true,
-        withAnnotations: true,
-      }),
-
-      // Register interaction manager (required for annotations)
-      createPluginRegistration(InteractionManagerPluginPackage),
-
-      // Register selection plugin (depends on InteractionManager)
-      createPluginRegistration(SelectionPluginPackage),
-
-      // Register history plugin for undo/redo (recommended for annotations)
-      createPluginRegistration(HistoryPluginPackage),
-
-      // Register annotation plugin (depends on InteractionManager, Selection, History)
-      createPluginRegistration(AnnotationPluginPackage, {
-        annotationAuthor: 'Digital Signature',
-        autoCommit: true,
-        deactivateToolAfterCreate: false,
-        selectAfterCreate: true,
-      }),
-
-      // Register pan plugin
-      createPluginRegistration(PanPluginPackage, {
-        defaultMode: 'mobile',
-      }),
-
-      // Register zoom plugin
-      createPluginRegistration(ZoomPluginPackage, {
-        defaultZoomLevel: ZoomMode.FitWidth,
-        minZoom: 0.2,
-        maxZoom: 3.0,
-      }),
-
-      // Register tiling plugin
-      createPluginRegistration(TilingPluginPackage, {
-        tileSize: 768,
-        overlapPx: 5,
-        extraRings: 1,
-      }),
-
-      // Register spread plugin
-      createPluginRegistration(SpreadPluginPackage, {
-        defaultSpreadMode: SpreadMode.None,
-      }),
-
-      // Register search plugin
-      createPluginRegistration(SearchPluginPackage),
-
-      // Register thumbnail plugin
-      createPluginRegistration(ThumbnailPluginPackage),
-
-      // Register rotate plugin
-      createPluginRegistration(RotatePluginPackage, {
-        defaultRotation: Rotation.Degree0,
-      }),
-    ];
-  }, [pdfUrl]);
-
-  // Initialize the engine
-  const { engine, isLoading, error } = usePdfiumEngine();
-
-  // Early return if no file or URL provided
-  if (!file && !url) {
-    return (
-      <Center h="100%" w="100%">
-        <Stack align="center" gap="md">
-          <div style={{ fontSize: '24px' }}>📄</div>
-          <Text c="dimmed" size="sm">
-            No PDF provided
-          </Text>
-        </Stack>
-      </Center>
-    );
-  }
-
-  if (isLoading || !engine || !pdfUrl) {
-    return <ToolLoadingFallback toolName="PDF Engine" />;
-  }
-
-  if (error) {
-    return (
-      <Center h="100%" w="100%">
-        <Stack align="center" gap="md">
-          <div style={{ fontSize: '24px' }}>�</div>
-          <Text c="red" size="sm" style={{ textAlign: 'center' }}>
-            Error loading PDF engine: {error.message}
-          </Text>
-        </Stack>
-      </Center>
-    );
-  }
-
-  return (
-    <div ref={containerRef} style={{
-      height: '100%',
-      width: '100%',
-      position: 'relative',
-      overflow: 'hidden',
-      flex: 1,
-      minHeight: 0,
-      minWidth: 0
-    }}>
-      <EmbedPDF
-        key={pdfUrl}
-        engine={engine}
-        plugins={plugins}
-        onInitialized={async (registry: PluginRegistry) => {
-          // v2.0: Use registry.getPlugin() to access plugin APIs
-          const annotationPlugin = registry.getPlugin('annotation');
-          if (!annotationPlugin || !annotationPlugin.provides) return;
-
-          const annotationApi = annotationPlugin.provides();
-          if (!annotationApi) return;
-
-          // Store reference for parent component access
-          annotationApiRef.current = annotationApi;
-
-          // Add custom signature image tool
-          // Using FreeText with appearance for better image support
-          annotationApi.addTool({
-            id: 'signatureStamp',
-            name: 'Digital Signature',
-            interaction: { exclusive: false, cursor: 'crosshair' },
-            matchScore: () => 0,
-            defaults: {
-              type: PdfAnnotationSubtype.STAMP,
-              // Image data will be set dynamically via setToolDefaults
-              width: 150,
-              height: 75,
-            },
+    // Expose annotation API to parent
+    useImperativeHandle(
+      ref,
+      () => ({
+        setActiveTool: (toolId: string | null) => {
+          annotationApiRef.current?.setActiveTool(toolId);
+        },
+        setToolDefaults: (toolId: string, defaults: any) => {
+          annotationApiRef.current?.setToolDefaults(toolId, defaults);
+        },
+        getActiveTool: () => {
+          return annotationApiRef.current?.getActiveTool();
+        },
+        getPageAnnotations: async (pageIndex: number) => {
+          if (!annotationApiRef.current?.getPageAnnotations) return [];
+          const task = annotationApiRef.current.getPageAnnotations({
+            pageIndex,
           });
-
-          // Add custom ink signature tool
-          annotationApi.addTool({
-            id: 'signatureInk',
-            name: 'Signature Draw',
-            interaction: { exclusive: true, cursor: 'crosshair' },
-            matchScore: () => 0,
-            defaults: {
-              type: PdfAnnotationSubtype.INK,
-              color: '#000000',
-              opacity: 1.0,
-              borderWidth: 2,
-            },
-          });
-
-          // Wire zoom API so parent can call zoomIn/zoomOut/resetZoom
-          const zoomPlugin = registry.getPlugin('zoom');
-          if (zoomPlugin?.provides) {
-            const zoomApi = zoomPlugin.provides();
-            zoomApiRef.current = {
-              zoomIn:    () => zoomApi.zoomIn?.(),
-              zoomOut:   () => zoomApi.zoomOut?.(),
-              resetZoom: () => zoomApi.requestZoom?.(ZoomMode.FitWidth, { vx: 0.5, vy: 0 }),
-            };
+          if (task?.toPromise) {
+            return await task.toPromise();
           }
+          return [];
+        },
+        getAllAnnotations: async () => {
+          // Get all annotations across all pages
+          // Note: In practice, we'll use getPageAnnotations for the specific page
+          // where the user placed their signature, so this method is optional
+          if (!annotationApiRef.current?.getPageAnnotations) return [];
 
+          // Would need document page count to iterate through all pages
+          // For signing workflow, we track annotations via onAnnotationChange callback instead
+          return [];
+        },
+        getSignaturePreviews: () => {
+          return signaturePreviews;
+        },
+        clearPreviews: () => {
+          setSignaturePreviews([]);
+        },
+        zoomIn: () => {
+          zoomApiRef.current?.zoomIn();
+        },
+        zoomOut: () => {
+          zoomApiRef.current?.zoomOut();
+        },
+        resetZoom: () => {
+          zoomApiRef.current?.resetZoom();
+        },
+      }),
+      [signaturePreviews],
+    );
 
+    // Convert File to URL if needed
+    useEffect(() => {
+      if (file) {
+        const objectUrl = URL.createObjectURL(file);
+        setPdfUrl(objectUrl);
+        return () => URL.revokeObjectURL(objectUrl);
+      } else if (url) {
+        setPdfUrl(url);
+      }
+    }, [file, url]);
+
+    // Notify parent when signature previews change
+    useEffect(() => {
+      if (onAnnotationChange) {
+        onAnnotationChange(signaturePreviews);
+      }
+      if (onPreviewCountChange) {
+        onPreviewCountChange(signaturePreviews.length);
+      }
+    }, [signaturePreviews, onAnnotationChange, onPreviewCountChange]);
+
+    // Create plugins configuration with annotation support
+    const plugins = useMemo(() => {
+      if (!pdfUrl) return [];
+
+      // Calculate 3.5rem in pixels dynamically based on root font size
+      const rootFontSize = parseFloat(
+        getComputedStyle(document.documentElement).fontSize,
+      );
+      const viewportGap = rootFontSize * 3.5;
+
+      return [
+        createPluginRegistration(DocumentManagerPluginPackage, {
+          initialDocuments: [
+            {
+              url: pdfUrl,
+              name: DOCUMENT_NAME,
+            },
+          ],
+        }),
+        createPluginRegistration(ViewportPluginPackage, {
+          viewportGap,
+        }),
+        createPluginRegistration(ScrollPluginPackage),
+        createPluginRegistration(RenderPluginPackage, {
+          withForms: true,
+          withAnnotations: true,
+        }),
+
+        // Register interaction manager (required for annotations)
+        createPluginRegistration(InteractionManagerPluginPackage),
+
+        // Register selection plugin (depends on InteractionManager)
+        createPluginRegistration(SelectionPluginPackage),
+
+        // Register history plugin for undo/redo (recommended for annotations)
+        createPluginRegistration(HistoryPluginPackage),
+
+        // Register annotation plugin (depends on InteractionManager, Selection, History)
+        createPluginRegistration(AnnotationPluginPackage, {
+          annotationAuthor: "Digital Signature",
+          autoCommit: true,
+          deactivateToolAfterCreate: false,
+          selectAfterCreate: true,
+        }),
+
+        // Register pan plugin
+        createPluginRegistration(PanPluginPackage, {
+          defaultMode: "mobile",
+        }),
+
+        // Register zoom plugin
+        createPluginRegistration(ZoomPluginPackage, {
+          defaultZoomLevel: ZoomMode.FitWidth,
+          minZoom: 0.2,
+          maxZoom: 3.0,
+        }),
+
+        // Register tiling plugin
+        createPluginRegistration(TilingPluginPackage, {
+          tileSize: 768,
+          overlapPx: 5,
+          extraRings: 1,
+        }),
+
+        // Register spread plugin
+        createPluginRegistration(SpreadPluginPackage, {
+          defaultSpreadMode: SpreadMode.None,
+        }),
+
+        // Register search plugin
+        createPluginRegistration(SearchPluginPackage),
+
+        // Register thumbnail plugin
+        createPluginRegistration(ThumbnailPluginPackage),
+
+        // Register rotate plugin
+        createPluginRegistration(RotatePluginPackage, {
+          defaultRotation: Rotation.Degree0,
+        }),
+      ];
+    }, [pdfUrl]);
+
+    // Initialize the engine
+    const { engine, isLoading, error } = usePdfiumEngine();
+
+    // Early return if no file or URL provided
+    if (!file && !url) {
+      return (
+        <Center h="100%" w="100%">
+          <Stack align="center" gap="md">
+            <div style={{ fontSize: "24px" }}>📄</div>
+            <Text c="dimmed" size="sm">
+              No PDF provided
+            </Text>
+          </Stack>
+        </Center>
+      );
+    }
+
+    if (isLoading || !engine || !pdfUrl) {
+      return <ToolLoadingFallback toolName="PDF Engine" />;
+    }
+
+    if (error) {
+      return (
+        <Center h="100%" w="100%">
+          <Stack align="center" gap="md">
+            <div style={{ fontSize: "24px" }}>�</div>
+            <Text c="red" size="sm" style={{ textAlign: "center" }}>
+              Error loading PDF engine: {error.message}
+            </Text>
+          </Stack>
+        </Center>
+      );
+    }
+
+    return (
+      <div
+        ref={containerRef}
+        style={{
+          height: "100%",
+          width: "100%",
+          position: "relative",
+          overflow: "hidden",
+          flex: 1,
+          minHeight: 0,
+          minWidth: 0,
         }}
       >
-        <InteractionPauseBridge bridgeRef={interactionPauseRef} />
-        <ScrollAPIBridge />
-        <SelectionAPIBridge />
-        <PanAPIBridge />
-        <SpreadAPIBridge />
-        <SearchAPIBridge />
-        <ThumbnailAPIBridge />
-        <RotateAPIBridge />
-        <DocumentReadyWrapper
-          fallback={
-            <Center style={{ height: '100%', width: '100%' }}>
-              <ToolLoadingFallback />
-            </Center>
-          }
+        <EmbedPDF
+          key={pdfUrl}
+          engine={engine}
+          plugins={plugins}
+          onInitialized={async (registry: PluginRegistry) => {
+            // v2.0: Use registry.getPlugin() to access plugin APIs
+            const annotationPlugin = registry.getPlugin("annotation");
+            if (!annotationPlugin || !annotationPlugin.provides) return;
+
+            const annotationApi = annotationPlugin.provides();
+            if (!annotationApi) return;
+
+            // Store reference for parent component access
+            annotationApiRef.current = annotationApi;
+
+            // Add custom signature image tool
+            // Using FreeText with appearance for better image support
+            annotationApi.addTool({
+              id: "signatureStamp",
+              name: "Digital Signature",
+              interaction: { exclusive: false, cursor: "crosshair" },
+              matchScore: () => 0,
+              defaults: {
+                type: PdfAnnotationSubtype.STAMP,
+                // Image data will be set dynamically via setToolDefaults
+                width: 150,
+                height: 75,
+              },
+            });
+
+            // Add custom ink signature tool
+            annotationApi.addTool({
+              id: "signatureInk",
+              name: "Signature Draw",
+              interaction: { exclusive: true, cursor: "crosshair" },
+              matchScore: () => 0,
+              defaults: {
+                type: PdfAnnotationSubtype.INK,
+                color: "#000000",
+                opacity: 1.0,
+                borderWidth: 2,
+              },
+            });
+
+            // Wire zoom API so parent can call zoomIn/zoomOut/resetZoom
+            const zoomPlugin = registry.getPlugin("zoom");
+            if (zoomPlugin?.provides) {
+              const zoomApi = zoomPlugin.provides();
+              zoomApiRef.current = {
+                zoomIn: () => zoomApi.zoomIn?.(),
+                zoomOut: () => zoomApi.zoomOut?.(),
+                resetZoom: () =>
+                  zoomApi.requestZoom?.(ZoomMode.FitWidth, { vx: 0.5, vy: 0 }),
+              };
+            }
+          }}
         >
-          {(documentId) => (
-            <GlobalPointerProvider documentId={documentId}>
-              <Viewport
-                documentId={documentId}
-                style={{
-                  backgroundColor: 'var(--bg-background)',
-                  height: '100%',
-                  width: '100%',
-                  maxHeight: '100%',
-                  maxWidth: '100%',
-                  overflow: 'auto',
-                  position: 'relative',
-                  flex: 1,
-                  minHeight: 0,
-                  minWidth: 0,
-                  contain: 'strict',
-                }}
-              >
-                <Scroller
+          <InteractionPauseBridge bridgeRef={interactionPauseRef} />
+          <ScrollAPIBridge />
+          <SelectionAPIBridge />
+          <PanAPIBridge />
+          <SpreadAPIBridge />
+          <SearchAPIBridge />
+          <ThumbnailAPIBridge />
+          <RotateAPIBridge />
+          <DocumentReadyWrapper
+            fallback={
+              <Center style={{ height: "100%", width: "100%" }}>
+                <ToolLoadingFallback />
+              </Center>
+            }
+          >
+            {(documentId) => (
+              <GlobalPointerProvider documentId={documentId}>
+                <Viewport
                   documentId={documentId}
-                  renderPage={({ width, height, pageIndex }) => (
-                    <Rotate key={`${documentId}-${pageIndex}`} documentId={documentId} pageIndex={pageIndex}>
-                      <PagePointerProvider documentId={documentId} pageIndex={pageIndex}>
-                        <div
-                          style={{
-                            width,
-                            height,
-                            position: 'relative',
-                            userSelect: 'none',
-                            WebkitUserSelect: 'none',
-                            MozUserSelect: 'none',
-                            msUserSelect: 'none',
-                            cursor: placementMode ? 'crosshair' : 'default',
-                            boxShadow: '0 2px 8px rgba(0, 0, 0, 0.15)',
-                          }}
-                          draggable={false}
-                          onDragStart={(e) => e.preventDefault()}
-                          onDrop={(e) => e.preventDefault()}
-                          onDragOver={(e) => e.preventDefault()}
-                          onMouseMove={(e) => {
-                            if (!placementMode || !signatureData) return;
-                            const rect = e.currentTarget.getBoundingClientRect();
-                            setCursorOnPage({ pageIndex, x: e.clientX - rect.left, y: e.clientY - rect.top });
-                          }}
-                          onMouseLeave={() => {
-                            setCursorOnPage(prev => prev?.pageIndex === pageIndex ? null : prev);
-                          }}
-                          onClick={(e) => {
-                            if (isDraggingRef.current) return;
-
-                            if (placementMode && onPlaceSignature) {
-                              const rect = e.currentTarget.getBoundingClientRect();
-                              // Store as fractions (0–1) of the rendered page so overlays
-                              // remain correct at any zoom level (scale not in new API)
-                              const sigWidth = 150 / width;
-                              const sigHeight = 75 / height;
-                              const rawX = (e.clientX - rect.left) / width;
-                              const rawY = (e.clientY - rect.top) / height;
-                              const x = Math.max(0, Math.min(rawX - sigWidth / 2, 1 - sigWidth));
-                              const y = Math.max(0, Math.min(rawY - sigHeight / 2, 1 - sigHeight));
-
-                              const newPreview = {
-                                id: `sig-preview-${Date.now()}-${Math.random()}`,
-                                pageIndex,
-                                x,
-                                y,
-                                width: sigWidth,
-                                height: sigHeight,
-                                signatureData: signatureData || '',
-                                signatureType: signatureType || 'image',
-                              };
-                              setSignaturePreviews(prev => [...prev, newPreview]);
-                              onPlaceSignature(newPreview.id, pageIndex, x * width, y * height, sigWidth * width, sigHeight * height);
-                            }
-                          }}
+                  style={{
+                    backgroundColor: "var(--bg-background)",
+                    height: "100%",
+                    width: "100%",
+                    maxHeight: "100%",
+                    maxWidth: "100%",
+                    overflow: "auto",
+                    position: "relative",
+                    flex: 1,
+                    minHeight: 0,
+                    minWidth: 0,
+                    contain: "strict",
+                  }}
+                >
+                  <Scroller
+                    documentId={documentId}
+                    renderPage={({ width, height, pageIndex }) => (
+                      <Rotate
+                        key={`${documentId}-${pageIndex}`}
+                        documentId={documentId}
+                        pageIndex={pageIndex}
+                      >
+                        <PagePointerProvider
+                          documentId={documentId}
+                          pageIndex={pageIndex}
                         >
-                          <TilingLayer documentId={documentId} pageIndex={pageIndex} />
-
-                          <CustomSearchLayer documentId={documentId} pageIndex={pageIndex} />
-
-                          <SelectionLayer documentId={documentId} pageIndex={pageIndex} />
-
-                          {/* Annotation layer for signatures */}
-                          <AnnotationLayer
-                            documentId={documentId}
-                            pageIndex={pageIndex}
-                            selectionOutline={{ color: "#007ACC" }}
-                          />
-
-                          {/* Signature preview overlays (support multiple) */}
-                          {signaturePreviews
-                            .filter(preview => preview.pageIndex === pageIndex)
-                            .map((preview) => {
-                              if (!preview.signatureData) return null;
-                              const color = preview.color ?? 'rgb(0, 122, 204)';
-                              const colorOpacity = (opacity: number) =>
-                                color.startsWith('rgb(')
-                                  ? color.replace('rgb(', 'rgba(').replace(')', `, ${opacity})`)
-                                  : color;
-                              return (
-                              <Tooltip
-                                key={preview.id}
-                                label={preview.participantName ?? ''}
-                                position="top"
-                                withArrow
-                                disabled={!preview.participantName}
-                              >
-                              <div
-                                style={{
-                                  position: 'absolute',
-                                  left: preview.x * width,
-                                  top: preview.y * height,
-                                  width: preview.width * width,
-                                  height: preview.height * height,
-                                  border: readOnly ? `1px dashed ${colorOpacity(0.4)}` : `2px solid ${color}`,
-                                  boxShadow: readOnly ? 'none' : `0 0 10px ${colorOpacity(0.5)}`,
-                                  cursor: readOnly ? 'default' : 'move',
-                                  zIndex: Z_INDEX_SIGNATURE_OVERLAY,
-                                  backgroundColor: readOnly ? 'transparent' : 'rgba(255, 255, 255, 0.1)',
-                                  pointerEvents: 'auto',
-                                }}
-                              >
-                                {/* Delete button - only show when not read-only */}
-                                {!readOnly && (
-                                  <ActionIcon
-                                    size="sm"
-                                    radius="xl"
-                                    variant="filled"
-                                    color="red"
-                                    style={{
-                                      position: 'absolute',
-                                      top: -10,
-                                      right: -10,
-                                      zIndex: Z_INDEX_SIGNATURE_OVERLAY_DELETE,
-                                      pointerEvents: 'auto',
-                                      boxShadow: '0 1px 4px rgba(0,0,0,0.25)',
-                                      border: '2px solid white',
-                                    }}
-                                    onClick={(e) => {
-                                      e.stopPropagation();
-                                      setSignaturePreviews(prev => prev.filter(p => p.id !== preview.id));
-                                    }}
-                                    aria-label="Delete signature"
-                                  >
-                                    <CloseIcon style={{ fontSize: '0.8rem' }} />
-                                  </ActionIcon>
-                                )}
-
-                                <div
-                                  style={{
-                                    width: '100%',
-                                    height: '100%',
-                                    pointerEvents: readOnly ? 'none' : 'auto',
-                                  }}
-                                  onPointerDown={readOnly ? undefined : (e) => {
-                                    if ((e.target as HTMLElement).dataset.resizeHandle) return;
-                                    e.stopPropagation();
-                                    e.preventDefault();
-                                    const el = e.currentTarget;
-                                    el.setPointerCapture(e.pointerId);
-                                    interactionPauseRef.current?.pause();
-
-                                    const startX = e.clientX;
-                                    const startY = e.clientY;
-                                    const startLeft = preview.x;
-                                    const startTop = preview.y;
-
-                                    const handlePointerMove = (moveEvent: PointerEvent) => {
-                                      isDraggingRef.current = true;
-                                      const deltaX = (moveEvent.clientX - startX) / width;
-                                      const deltaY = (moveEvent.clientY - startY) / height;
-                                      setSignaturePreviews(prev => prev.map(p =>
-                                        p.id === preview.id
-                                          ? { ...p, x: startLeft + deltaX, y: startTop + deltaY }
-                                          : p
-                                      ));
-                                    };
-
-                                    const handlePointerUp = (upEvent: PointerEvent) => {
-                                      el.removeEventListener('pointermove', handlePointerMove);
-                                      el.removeEventListener('pointerup', handlePointerUp);
-                                      el.releasePointerCapture(upEvent.pointerId);
-                                      interactionPauseRef.current?.resume();
-                                      window.getSelection()?.removeAllRanges();
-                                      setTimeout(() => { isDraggingRef.current = false; }, 10);
-                                    };
-
-                                    el.addEventListener('pointermove', handlePointerMove);
-                                    el.addEventListener('pointerup', handlePointerUp);
-                                  }}
-                                >
-                                  <img
-                                    src={preview.signatureData}
-                                    alt="Signature preview"
-                                    style={{
-                                      width: '100%',
-                                      height: '100%',
-                                      objectFit: 'contain',
-                                      pointerEvents: 'none',
-                                    }}
-                                  />
-
-                                  {/* Resize handles */}
-                                  {[
-                                    { position: 'nw', cursor: 'nw-resize', top: -4, left: -4 },
-                                    { position: 'ne', cursor: 'ne-resize', top: -4, right: -4 },
-                                    { position: 'sw', cursor: 'sw-resize', bottom: -4, left: -4 },
-                                    { position: 'se', cursor: 'se-resize', bottom: -4, right: -4 },
-                                  ].map((handle) => (
-                                    <div
-                                      key={handle.position}
-                                      data-resize-handle="true"
-                                      style={{
-                                        position: 'absolute',
-                                        width: 8,
-                                        height: 8,
-                                        backgroundColor: color,
-                                        border: '1px solid white',
-                                        cursor: handle.cursor,
-                                        zIndex: Z_INDEX_SIGNATURE_OVERLAY_HANDLE,
-                                        ...(handle.top !== undefined && { top: handle.top }),
-                                        ...(handle.bottom !== undefined && { bottom: handle.bottom }),
-                                        ...(handle.left !== undefined && { left: handle.left }),
-                                        ...(handle.right !== undefined && { right: handle.right }),
-                                      }}
-                                      onPointerDown={(e) => {
-                                        e.stopPropagation();
-                                        e.preventDefault();
-                                        const el = e.currentTarget;
-                                        el.setPointerCapture(e.pointerId);
-                                        interactionPauseRef.current?.pause();
-
-                                        const startX = e.clientX;
-                                        const startY = e.clientY;
-                                        const startWidth = preview.width;
-                                        const startHeight = preview.height;
-                                        const startLeft = preview.x;
-                                        const startTop = preview.y;
-
-                                        const handlePointerMove = (moveEvent: PointerEvent) => {
-                                          isDraggingRef.current = true;
-                                          const deltaX = (moveEvent.clientX - startX) / width;
-                                          const deltaY = (moveEvent.clientY - startY) / height;
-
-                                          let newWidth = startWidth;
-                                          let newHeight = startHeight;
-                                          let newX = startLeft;
-                                          let newY = startTop;
-
-                                          // Min sizes as fractions: 50px / pageWidth, 25px / pageHeight
-                                          const minW = 50 / width;
-                                          const minH = 25 / height;
-
-                                          if (handle.position.includes('e')) {
-                                            newWidth = Math.max(minW, startWidth + deltaX);
-                                          }
-                                          if (handle.position.includes('w')) {
-                                            newWidth = Math.max(minW, startWidth - deltaX);
-                                            newX = startLeft + (startWidth - newWidth);
-                                          }
-                                          if (handle.position.includes('s')) {
-                                            newHeight = Math.max(minH, startHeight + deltaY);
-                                          }
-                                          if (handle.position.includes('n')) {
-                                            newHeight = Math.max(minH, startHeight - deltaY);
-                                            newY = startTop + (startHeight - newHeight);
-                                          }
-
-                                          setSignaturePreviews(prev => prev.map(p =>
-                                            p.id === preview.id
-                                              ? { ...p, x: newX, y: newY, width: newWidth, height: newHeight }
-                                              : p
-                                          ));
-                                        };
-
-                                        const handlePointerUp = (upEvent: PointerEvent) => {
-                                          el.removeEventListener('pointermove', handlePointerMove);
-                                          el.removeEventListener('pointerup', handlePointerUp);
-                                          el.releasePointerCapture(upEvent.pointerId);
-                                          interactionPauseRef.current?.resume();
-                                          window.getSelection()?.removeAllRanges();
-                                          setTimeout(() => { isDraggingRef.current = false; }, 10);
-                                        };
-
-                                        el.addEventListener('pointermove', handlePointerMove);
-                                        el.addEventListener('pointerup', handlePointerUp);
-                                      }}
-                                    />
-                                  ))}
-                                </div>
-                              </div>
-                              </Tooltip>
+                          <div
+                            style={{
+                              width,
+                              height,
+                              position: "relative",
+                              userSelect: "none",
+                              WebkitUserSelect: "none",
+                              MozUserSelect: "none",
+                              msUserSelect: "none",
+                              cursor: placementMode ? "crosshair" : "default",
+                              boxShadow: "0 2px 8px rgba(0, 0, 0, 0.15)",
+                            }}
+                            draggable={false}
+                            onDragStart={(e) => e.preventDefault()}
+                            onDrop={(e) => e.preventDefault()}
+                            onDragOver={(e) => e.preventDefault()}
+                            onMouseMove={(e) => {
+                              if (!placementMode || !signatureData) return;
+                              const rect =
+                                e.currentTarget.getBoundingClientRect();
+                              setCursorOnPage({
+                                pageIndex,
+                                x: e.clientX - rect.left,
+                                y: e.clientY - rect.top,
+                              });
+                            }}
+                            onMouseLeave={() => {
+                              setCursorOnPage((prev) =>
+                                prev?.pageIndex === pageIndex ? null : prev,
                               );
-                            })}
+                            }}
+                            onClick={(e) => {
+                              if (isDraggingRef.current) return;
 
-                          {/* Hover preview: ghost signature following cursor in placement mode */}
-                          {placementMode && signatureData && cursorOnPage?.pageIndex === pageIndex && (
-                            <img
-                              src={signatureData}
-                              alt=""
-                              style={{
-                                position: 'absolute',
-                                left: Math.max(0, Math.min(cursorOnPage.x - 75, width - 150)),
-                                top: Math.max(0, Math.min(cursorOnPage.y - 37.5, height - 75)),
-                                width: 150,
-                                height: 75,
-                                opacity: 0.6,
-                                pointerEvents: 'none',
-                                objectFit: 'contain',
-                                boxShadow: '0 0 0 1px rgba(30, 136, 229, 0.55), 0 6px 18px rgba(30, 136, 229, 0.25)',
-                                borderRadius: '4px',
-                                zIndex: Z_INDEX_SIGNATURE_OVERLAY + 1,
-                              }}
+                              if (placementMode && onPlaceSignature) {
+                                const rect =
+                                  e.currentTarget.getBoundingClientRect();
+                                // Store as fractions (0–1) of the rendered page so overlays
+                                // remain correct at any zoom level (scale not in new API)
+                                const sigWidth = 150 / width;
+                                const sigHeight = 75 / height;
+                                const rawX = (e.clientX - rect.left) / width;
+                                const rawY = (e.clientY - rect.top) / height;
+                                const x = Math.max(
+                                  0,
+                                  Math.min(rawX - sigWidth / 2, 1 - sigWidth),
+                                );
+                                const y = Math.max(
+                                  0,
+                                  Math.min(rawY - sigHeight / 2, 1 - sigHeight),
+                                );
+
+                                const newPreview = {
+                                  id: `sig-preview-${Date.now()}-${Math.random()}`,
+                                  pageIndex,
+                                  x,
+                                  y,
+                                  width: sigWidth,
+                                  height: sigHeight,
+                                  signatureData: signatureData || "",
+                                  signatureType: signatureType || "image",
+                                };
+                                setSignaturePreviews((prev) => [
+                                  ...prev,
+                                  newPreview,
+                                ]);
+                                onPlaceSignature(
+                                  newPreview.id,
+                                  pageIndex,
+                                  x * width,
+                                  y * height,
+                                  sigWidth * width,
+                                  sigHeight * height,
+                                );
+                              }
+                            }}
+                          >
+                            <TilingLayer
+                              documentId={documentId}
+                              pageIndex={pageIndex}
                             />
-                          )}
-                        </div>
-                      </PagePointerProvider>
-                    </Rotate>
-                  )}
-                />
-              </Viewport>
-            </GlobalPointerProvider>
-          )}
-        </DocumentReadyWrapper>
-      </EmbedPDF>
-    </div>
-  );
-});
 
-LocalEmbedPDFWithAnnotations.displayName = 'LocalEmbedPDFWithAnnotations';
+                            <CustomSearchLayer
+                              documentId={documentId}
+                              pageIndex={pageIndex}
+                            />
+
+                            <SelectionLayer
+                              documentId={documentId}
+                              pageIndex={pageIndex}
+                            />
+
+                            {/* Annotation layer for signatures */}
+                            <AnnotationLayer
+                              documentId={documentId}
+                              pageIndex={pageIndex}
+                              selectionOutline={{ color: "#007ACC" }}
+                            />
+
+                            {/* Signature preview overlays (support multiple) */}
+                            {signaturePreviews
+                              .filter(
+                                (preview) => preview.pageIndex === pageIndex,
+                              )
+                              .map((preview) => {
+                                if (!preview.signatureData) return null;
+                                const color =
+                                  preview.color ?? "rgb(0, 122, 204)";
+                                const colorOpacity = (opacity: number) =>
+                                  color.startsWith("rgb(")
+                                    ? color
+                                        .replace("rgb(", "rgba(")
+                                        .replace(")", `, ${opacity})`)
+                                    : color;
+                                return (
+                                  <Tooltip
+                                    key={preview.id}
+                                    label={preview.participantName ?? ""}
+                                    position="top"
+                                    withArrow
+                                    disabled={!preview.participantName}
+                                  >
+                                    <div
+                                      style={{
+                                        position: "absolute",
+                                        left: preview.x * width,
+                                        top: preview.y * height,
+                                        width: preview.width * width,
+                                        height: preview.height * height,
+                                        border: readOnly
+                                          ? `1px dashed ${colorOpacity(0.4)}`
+                                          : `2px solid ${color}`,
+                                        boxShadow: readOnly
+                                          ? "none"
+                                          : `0 0 10px ${colorOpacity(0.5)}`,
+                                        cursor: readOnly ? "default" : "move",
+                                        zIndex: Z_INDEX_SIGNATURE_OVERLAY,
+                                        backgroundColor: readOnly
+                                          ? "transparent"
+                                          : "rgba(255, 255, 255, 0.1)",
+                                        pointerEvents: "auto",
+                                      }}
+                                    >
+                                      {/* Delete button - only show when not read-only */}
+                                      {!readOnly && (
+                                        <ActionIcon
+                                          size="sm"
+                                          radius="xl"
+                                          variant="filled"
+                                          color="red"
+                                          style={{
+                                            position: "absolute",
+                                            top: -10,
+                                            right: -10,
+                                            zIndex:
+                                              Z_INDEX_SIGNATURE_OVERLAY_DELETE,
+                                            pointerEvents: "auto",
+                                            boxShadow:
+                                              "0 1px 4px rgba(0,0,0,0.25)",
+                                            border: "2px solid white",
+                                          }}
+                                          onClick={(e) => {
+                                            e.stopPropagation();
+                                            setSignaturePreviews((prev) =>
+                                              prev.filter(
+                                                (p) => p.id !== preview.id,
+                                              ),
+                                            );
+                                          }}
+                                          aria-label="Delete signature"
+                                        >
+                                          <CloseIcon
+                                            style={{ fontSize: "0.8rem" }}
+                                          />
+                                        </ActionIcon>
+                                      )}
+
+                                      <div
+                                        style={{
+                                          width: "100%",
+                                          height: "100%",
+                                          pointerEvents: readOnly
+                                            ? "none"
+                                            : "auto",
+                                        }}
+                                        onPointerDown={
+                                          readOnly
+                                            ? undefined
+                                            : (e) => {
+                                                if (
+                                                  (e.target as HTMLElement)
+                                                    .dataset.resizeHandle
+                                                )
+                                                  return;
+                                                e.stopPropagation();
+                                                e.preventDefault();
+                                                const el = e.currentTarget;
+                                                el.setPointerCapture(
+                                                  e.pointerId,
+                                                );
+                                                interactionPauseRef.current?.pause();
+
+                                                const startX = e.clientX;
+                                                const startY = e.clientY;
+                                                const startLeft = preview.x;
+                                                const startTop = preview.y;
+
+                                                const handlePointerMove = (
+                                                  moveEvent: PointerEvent,
+                                                ) => {
+                                                  isDraggingRef.current = true;
+                                                  const deltaX =
+                                                    (moveEvent.clientX -
+                                                      startX) /
+                                                    width;
+                                                  const deltaY =
+                                                    (moveEvent.clientY -
+                                                      startY) /
+                                                    height;
+                                                  setSignaturePreviews((prev) =>
+                                                    prev.map((p) =>
+                                                      p.id === preview.id
+                                                        ? {
+                                                            ...p,
+                                                            x:
+                                                              startLeft +
+                                                              deltaX,
+                                                            y:
+                                                              startTop + deltaY,
+                                                          }
+                                                        : p,
+                                                    ),
+                                                  );
+                                                };
+
+                                                const handlePointerUp = (
+                                                  upEvent: PointerEvent,
+                                                ) => {
+                                                  el.removeEventListener(
+                                                    "pointermove",
+                                                    handlePointerMove,
+                                                  );
+                                                  el.removeEventListener(
+                                                    "pointerup",
+                                                    handlePointerUp,
+                                                  );
+                                                  el.releasePointerCapture(
+                                                    upEvent.pointerId,
+                                                  );
+                                                  interactionPauseRef.current?.resume();
+                                                  window
+                                                    .getSelection()
+                                                    ?.removeAllRanges();
+                                                  setTimeout(() => {
+                                                    isDraggingRef.current = false;
+                                                  }, 10);
+                                                };
+
+                                                el.addEventListener(
+                                                  "pointermove",
+                                                  handlePointerMove,
+                                                );
+                                                el.addEventListener(
+                                                  "pointerup",
+                                                  handlePointerUp,
+                                                );
+                                              }
+                                        }
+                                      >
+                                        <img
+                                          src={preview.signatureData}
+                                          alt="Signature preview"
+                                          style={{
+                                            width: "100%",
+                                            height: "100%",
+                                            objectFit: "contain",
+                                            pointerEvents: "none",
+                                          }}
+                                        />
+
+                                        {/* Resize handles */}
+                                        {[
+                                          {
+                                            position: "nw",
+                                            cursor: "nw-resize",
+                                            top: -4,
+                                            left: -4,
+                                          },
+                                          {
+                                            position: "ne",
+                                            cursor: "ne-resize",
+                                            top: -4,
+                                            right: -4,
+                                          },
+                                          {
+                                            position: "sw",
+                                            cursor: "sw-resize",
+                                            bottom: -4,
+                                            left: -4,
+                                          },
+                                          {
+                                            position: "se",
+                                            cursor: "se-resize",
+                                            bottom: -4,
+                                            right: -4,
+                                          },
+                                        ].map((handle) => (
+                                          <div
+                                            key={handle.position}
+                                            data-resize-handle="true"
+                                            style={{
+                                              position: "absolute",
+                                              width: 8,
+                                              height: 8,
+                                              backgroundColor: color,
+                                              border: "1px solid white",
+                                              cursor: handle.cursor,
+                                              zIndex:
+                                                Z_INDEX_SIGNATURE_OVERLAY_HANDLE,
+                                              ...(handle.top !== undefined && {
+                                                top: handle.top,
+                                              }),
+                                              ...(handle.bottom !==
+                                                undefined && {
+                                                bottom: handle.bottom,
+                                              }),
+                                              ...(handle.left !== undefined && {
+                                                left: handle.left,
+                                              }),
+                                              ...(handle.right !==
+                                                undefined && {
+                                                right: handle.right,
+                                              }),
+                                            }}
+                                            onPointerDown={(e) => {
+                                              e.stopPropagation();
+                                              e.preventDefault();
+                                              const el = e.currentTarget;
+                                              el.setPointerCapture(e.pointerId);
+                                              interactionPauseRef.current?.pause();
+
+                                              const startX = e.clientX;
+                                              const startY = e.clientY;
+                                              const startWidth = preview.width;
+                                              const startHeight =
+                                                preview.height;
+                                              const startLeft = preview.x;
+                                              const startTop = preview.y;
+
+                                              const handlePointerMove = (
+                                                moveEvent: PointerEvent,
+                                              ) => {
+                                                isDraggingRef.current = true;
+                                                const deltaX =
+                                                  (moveEvent.clientX - startX) /
+                                                  width;
+                                                const deltaY =
+                                                  (moveEvent.clientY - startY) /
+                                                  height;
+
+                                                let newWidth = startWidth;
+                                                let newHeight = startHeight;
+                                                let newX = startLeft;
+                                                let newY = startTop;
+
+                                                // Min sizes as fractions: 50px / pageWidth, 25px / pageHeight
+                                                const minW = 50 / width;
+                                                const minH = 25 / height;
+
+                                                if (
+                                                  handle.position.includes("e")
+                                                ) {
+                                                  newWidth = Math.max(
+                                                    minW,
+                                                    startWidth + deltaX,
+                                                  );
+                                                }
+                                                if (
+                                                  handle.position.includes("w")
+                                                ) {
+                                                  newWidth = Math.max(
+                                                    minW,
+                                                    startWidth - deltaX,
+                                                  );
+                                                  newX =
+                                                    startLeft +
+                                                    (startWidth - newWidth);
+                                                }
+                                                if (
+                                                  handle.position.includes("s")
+                                                ) {
+                                                  newHeight = Math.max(
+                                                    minH,
+                                                    startHeight + deltaY,
+                                                  );
+                                                }
+                                                if (
+                                                  handle.position.includes("n")
+                                                ) {
+                                                  newHeight = Math.max(
+                                                    minH,
+                                                    startHeight - deltaY,
+                                                  );
+                                                  newY =
+                                                    startTop +
+                                                    (startHeight - newHeight);
+                                                }
+
+                                                setSignaturePreviews((prev) =>
+                                                  prev.map((p) =>
+                                                    p.id === preview.id
+                                                      ? {
+                                                          ...p,
+                                                          x: newX,
+                                                          y: newY,
+                                                          width: newWidth,
+                                                          height: newHeight,
+                                                        }
+                                                      : p,
+                                                  ),
+                                                );
+                                              };
+
+                                              const handlePointerUp = (
+                                                upEvent: PointerEvent,
+                                              ) => {
+                                                el.removeEventListener(
+                                                  "pointermove",
+                                                  handlePointerMove,
+                                                );
+                                                el.removeEventListener(
+                                                  "pointerup",
+                                                  handlePointerUp,
+                                                );
+                                                el.releasePointerCapture(
+                                                  upEvent.pointerId,
+                                                );
+                                                interactionPauseRef.current?.resume();
+                                                window
+                                                  .getSelection()
+                                                  ?.removeAllRanges();
+                                                setTimeout(() => {
+                                                  isDraggingRef.current = false;
+                                                }, 10);
+                                              };
+
+                                              el.addEventListener(
+                                                "pointermove",
+                                                handlePointerMove,
+                                              );
+                                              el.addEventListener(
+                                                "pointerup",
+                                                handlePointerUp,
+                                              );
+                                            }}
+                                          />
+                                        ))}
+                                      </div>
+                                    </div>
+                                  </Tooltip>
+                                );
+                              })}
+
+                            {/* Hover preview: ghost signature following cursor in placement mode */}
+                            {placementMode &&
+                              signatureData &&
+                              cursorOnPage?.pageIndex === pageIndex && (
+                                <img
+                                  src={signatureData}
+                                  alt=""
+                                  style={{
+                                    position: "absolute",
+                                    left: Math.max(
+                                      0,
+                                      Math.min(
+                                        cursorOnPage.x - 75,
+                                        width - 150,
+                                      ),
+                                    ),
+                                    top: Math.max(
+                                      0,
+                                      Math.min(
+                                        cursorOnPage.y - 37.5,
+                                        height - 75,
+                                      ),
+                                    ),
+                                    width: 150,
+                                    height: 75,
+                                    opacity: 0.6,
+                                    pointerEvents: "none",
+                                    objectFit: "contain",
+                                    boxShadow:
+                                      "0 0 0 1px rgba(30, 136, 229, 0.55), 0 6px 18px rgba(30, 136, 229, 0.25)",
+                                    borderRadius: "4px",
+                                    zIndex: Z_INDEX_SIGNATURE_OVERLAY + 1,
+                                  }}
+                                />
+                              )}
+                          </div>
+                        </PagePointerProvider>
+                      </Rotate>
+                    )}
+                  />
+                </Viewport>
+              </GlobalPointerProvider>
+            )}
+          </DocumentReadyWrapper>
+        </EmbedPDF>
+      </div>
+    );
+  },
+);
+
+LocalEmbedPDFWithAnnotations.displayName = "LocalEmbedPDFWithAnnotations";
diff --git a/frontend/src/core/components/viewer/NonPdfViewer.tsx b/frontend/src/core/components/viewer/NonPdfViewer.tsx
index dd13a4a889..ec24efe562 100644
--- a/frontend/src/core/components/viewer/NonPdfViewer.tsx
+++ b/frontend/src/core/components/viewer/NonPdfViewer.tsx
@@ -1,20 +1,23 @@
-import { useCallback, useMemo } from 'react';
-import { Box, Button, Center, Stack, Text } from '@mantine/core';
-import ArticleIcon from '@mui/icons-material/Article';
-import PictureAsPdfIcon from '@mui/icons-material/PictureAsPdf';
+import { useCallback, useMemo } from "react";
+import { Box, Button, Center, Stack, Text } from "@mantine/core";
+import ArticleIcon from "@mui/icons-material/Article";
+import PictureAsPdfIcon from "@mui/icons-material/PictureAsPdf";
 
-import { useFileState } from '@app/contexts/FileContext';
-import { useToolWorkflow } from '@app/contexts/ToolWorkflowContext';
-import { detectFileExtension, detectNonPdfFileType } from '@app/utils/fileUtils';
-import { CONVERSION_MATRIX } from '@app/constants/convertConstants';
+import { useFileState } from "@app/contexts/FileContext";
+import { useToolWorkflow } from "@app/contexts/ToolWorkflowContext";
+import {
+  detectFileExtension,
+  detectNonPdfFileType,
+} from "@app/utils/fileUtils";
+import { CONVERSION_MATRIX } from "@app/constants/convertConstants";
 
-import { NonPdfBanner } from '@app/components/viewer/nonpdf/NonPdfBanner';
-import { getFileTypeMeta } from '@app/components/viewer/nonpdf/types';
-import { ImageViewer } from '@app/components/viewer/nonpdf/ImageViewer';
-import { CsvViewer } from '@app/components/viewer/nonpdf/CsvViewer';
-import { JsonViewer } from '@app/components/viewer/nonpdf/JsonViewer';
-import { TextViewer } from '@app/components/viewer/nonpdf/TextViewer';
-import { HtmlViewer } from '@app/components/viewer/nonpdf/HtmlViewer';
+import { NonPdfBanner } from "@app/components/viewer/nonpdf/NonPdfBanner";
+import { getFileTypeMeta } from "@app/components/viewer/nonpdf/types";
+import { ImageViewer } from "@app/components/viewer/nonpdf/ImageViewer";
+import { CsvViewer } from "@app/components/viewer/nonpdf/CsvViewer";
+import { JsonViewer } from "@app/components/viewer/nonpdf/JsonViewer";
+import { TextViewer } from "@app/components/viewer/nonpdf/TextViewer";
+import { HtmlViewer } from "@app/components/viewer/nonpdf/HtmlViewer";
 
 export interface ViewerProps {
   sidebarsVisible: boolean;
@@ -31,43 +34,64 @@ export interface NonPdfViewerProps extends ViewerProps {
 
 export function NonPdfViewer({ file }: NonPdfViewerProps) {
   const fileType = useMemo(() => detectNonPdfFileType(file), [file]);
-  const meta = useMemo(() => getFileTypeMeta(fileType, file.name), [fileType, file.name]);
+  const meta = useMemo(
+    () => getFileTypeMeta(fileType, file.name),
+    [fileType, file.name],
+  );
 
   const { handleToolSelect, toolAvailability } = useToolWorkflow();
 
   const fileExtension = detectFileExtension(file.name);
   // Only show convert when the extension has an explicit entry in the conversion matrix
   // (skip the 'any'/'image' wildcard fallbacks that would match everything)
-  const isConvertAvailable = toolAvailability['convert']?.available === true
-    && fileExtension !== ''
-    && fileExtension in CONVERSION_MATRIX;
+  const isConvertAvailable =
+    toolAvailability["convert"]?.available === true &&
+    fileExtension !== "" &&
+    fileExtension in CONVERSION_MATRIX;
 
   const handleConvertToPdf = useCallback(() => {
-    handleToolSelect('convert');
+    handleToolSelect("convert");
   }, [handleToolSelect]);
 
   const renderContent = () => {
     switch (fileType) {
-      case 'image':
+      case "image":
         return <ImageViewer file={file} fileName={file.name} />;
-      case 'csv':
-        return <CsvViewer file={file} isTsv={file.name.toLowerCase().endsWith('.tsv')} />;
-      case 'json':
+      case "csv":
+        return (
+          <CsvViewer
+            file={file}
+            isTsv={file.name.toLowerCase().endsWith(".tsv")}
+          />
+        );
+      case "json":
         return <JsonViewer file={file} />;
-      case 'markdown':
+      case "markdown":
         return <TextViewer file={file} isMarkdown />;
-      case 'text':
+      case "text":
         return <TextViewer file={file} isMarkdown={false} />;
-      case 'html':
+      case "html":
         return <HtmlViewer file={file} />;
       default:
         return (
           <Center style={{ flex: 1 }}>
             <Stack align="center" gap="sm">
-              <ArticleIcon style={{ fontSize: '3rem', color: 'var(--mantine-color-gray-4)' }} />
-              <Text c="dimmed" size="sm">Preview not available for this file type</Text>
+              <ArticleIcon
+                style={{
+                  fontSize: "3rem",
+                  color: "var(--mantine-color-gray-4)",
+                }}
+              />
+              <Text c="dimmed" size="sm">
+                Preview not available for this file type
+              </Text>
               {isConvertAvailable && (
-                <Button variant="light" color="orange" leftSection={<PictureAsPdfIcon />} onClick={handleConvertToPdf}>
+                <Button
+                  variant="light"
+                  color="orange"
+                  leftSection={<PictureAsPdfIcon />}
+                  onClick={handleConvertToPdf}
+                >
                   Convert to PDF
                 </Button>
               )}
@@ -78,12 +102,27 @@ export function NonPdfViewer({ file }: NonPdfViewerProps) {
   };
 
   return (
-    <Stack gap={0} style={{ height: '100%', flex: 1, overflow: 'hidden', position: 'relative' }}>
+    <Stack
+      gap={0}
+      style={{
+        height: "100%",
+        flex: 1,
+        overflow: "hidden",
+        position: "relative",
+      }}
+    >
       <NonPdfBanner
         meta={meta}
         onConvertToPdf={isConvertAvailable ? handleConvertToPdf : undefined}
       />
-      <Box style={{ flex: 1, display: 'flex', flexDirection: 'column', overflow: 'hidden' }}>
+      <Box
+        style={{
+          flex: 1,
+          display: "flex",
+          flexDirection: "column",
+          overflow: "hidden",
+        }}
+      >
         {renderContent()}
       </Box>
     </Stack>
@@ -97,12 +136,15 @@ export function NonPdfViewerWrapper(props: ViewerProps) {
   const activeFiles = selectors.getFiles();
   const activeFileIndex = props.activeFileIndex ?? 0;
 
-  const file = props.previewFile ?? activeFiles[activeFileIndex] ?? activeFiles[0] ?? null;
+  const file =
+    props.previewFile ?? activeFiles[activeFileIndex] ?? activeFiles[0] ?? null;
 
   if (!file) {
     return (
       <Center style={{ flex: 1 }}>
-        <Text c="dimmed" size="sm">No file selected</Text>
+        <Text c="dimmed" size="sm">
+          No file selected
+        </Text>
       </Center>
     );
   }
diff --git a/frontend/src/core/components/viewer/PanAPIBridge.tsx b/frontend/src/core/components/viewer/PanAPIBridge.tsx
index 057a316cbb..772af6d5ac 100644
--- a/frontend/src/core/components/viewer/PanAPIBridge.tsx
+++ b/frontend/src/core/components/viewer/PanAPIBridge.tsx
@@ -1,8 +1,8 @@
-import { useEffect, useRef } from 'react';
-import { usePan } from '@embedpdf/plugin-pan/react';
-import { useViewer } from '@app/contexts/ViewerContext';
-import { useActiveDocumentId } from '@app/components/viewer/useActiveDocumentId';
-import { useDocumentReady } from '@app/components/viewer/hooks/useDocumentReady';
+import { useEffect, useRef } from "react";
+import { usePan } from "@embedpdf/plugin-pan/react";
+import { useViewer } from "@app/contexts/ViewerContext";
+import { useActiveDocumentId } from "@app/components/viewer/useActiveDocumentId";
+import { useDocumentReady } from "@app/components/viewer/hooks/useDocumentReady";
 
 /**
  * Connects the PDF pan (hand tool) plugin to the shared ViewerContext.
@@ -36,11 +36,11 @@ function PanAPIBridgeInner({ documentId }: { documentId: string }) {
     const currentPan = panRef.current;
     if (currentPan) {
       const newState = {
-        isPanning
+        isPanning,
       };
 
       // Register this bridge with ViewerContext
-      registerBridge('pan', {
+      registerBridge("pan", {
         state: newState,
         api: {
           enable: () => {
@@ -54,13 +54,16 @@ function PanAPIBridgeInner({ documentId }: { documentId: string }) {
           },
           makePanDefault: () => {
             // v2.5.0: makePanDefault may not exist, enable pan as fallback
-            if ('makePanDefault' in currentPan && typeof (currentPan as any).makePanDefault === 'function') {
+            if (
+              "makePanDefault" in currentPan &&
+              typeof (currentPan as any).makePanDefault === "function"
+            ) {
               (currentPan as any).makePanDefault();
             } else {
               currentPan.enablePan();
             }
           },
-        }
+        },
       });
 
       if (prevIsPanningRef.current !== isPanning) {
@@ -70,7 +73,7 @@ function PanAPIBridgeInner({ documentId }: { documentId: string }) {
     }
 
     return () => {
-      registerBridge('pan', null);
+      registerBridge("pan", null);
     };
   }, [isPanning, registerBridge, triggerImmediatePanUpdate]);
 
diff --git a/frontend/src/core/components/viewer/PdfViewerToolbar.tsx b/frontend/src/core/components/viewer/PdfViewerToolbar.tsx
index 0fa11e360e..7ce3b99180 100644
--- a/frontend/src/core/components/viewer/PdfViewerToolbar.tsx
+++ b/frontend/src/core/components/viewer/PdfViewerToolbar.tsx
@@ -1,17 +1,17 @@
-import { useState, useEffect } from 'react';
-import { Button, Paper, Group, NumberInput } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { useViewer } from '@app/contexts/ViewerContext';
-import { Tooltip } from '@app/components/shared/Tooltip';
-import FirstPageIcon from '@mui/icons-material/FirstPage';
-import ArrowBackIosIcon from '@mui/icons-material/ArrowBackIos';
-import ArrowForwardIosIcon from '@mui/icons-material/ArrowForwardIos';
-import LastPageIcon from '@mui/icons-material/LastPage';
-import DescriptionIcon from '@mui/icons-material/Description';
-import ViewWeekIcon from '@mui/icons-material/ViewWeek';
-import DarkModeIcon from '@mui/icons-material/DarkMode';
-import WbSunnyIcon from '@mui/icons-material/WbSunny';
-import WbTwilightIcon from '@mui/icons-material/WbTwilight';
+import { useState, useEffect } from "react";
+import { Button, Paper, Group, NumberInput } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import { useViewer } from "@app/contexts/ViewerContext";
+import { Tooltip } from "@app/components/shared/Tooltip";
+import FirstPageIcon from "@mui/icons-material/FirstPage";
+import ArrowBackIosIcon from "@mui/icons-material/ArrowBackIos";
+import ArrowForwardIosIcon from "@mui/icons-material/ArrowForwardIos";
+import LastPageIcon from "@mui/icons-material/LastPage";
+import DescriptionIcon from "@mui/icons-material/Description";
+import ViewWeekIcon from "@mui/icons-material/ViewWeek";
+import DarkModeIcon from "@mui/icons-material/DarkMode";
+import WbSunnyIcon from "@mui/icons-material/WbSunny";
+import WbTwilightIcon from "@mui/icons-material/WbTwilight";
 
 interface PdfViewerToolbarProps {
   // Page navigation props (placeholders for now)
@@ -43,15 +43,23 @@ export function PdfViewerToolbar({
   const scrollState = getScrollState();
   const zoomState = getZoomState();
   const spreadState = getSpreadState();
-  const [pageInput, setPageInput] = useState(scrollState.currentPage || currentPage);
-  const [displayZoomPercent, setDisplayZoomPercent] = useState(zoomState.zoomPercent || 140);
-  const [isDualPageActive, setIsDualPageActive] = useState(spreadState.isDualPage);
+  const [pageInput, setPageInput] = useState(
+    scrollState.currentPage || currentPage,
+  );
+  const [displayZoomPercent, setDisplayZoomPercent] = useState(
+    zoomState.zoomPercent || 140,
+  );
+  const [isDualPageActive, setIsDualPageActive] = useState(
+    spreadState.isDualPage,
+  );
 
   // Register for immediate scroll updates and sync with actual scroll state
   useEffect(() => {
-    const unregister = registerImmediateScrollUpdate((currentPage, _totalPages) => {
-      setPageInput(currentPage);
-    });
+    const unregister = registerImmediateScrollUpdate(
+      (currentPage, _totalPages) => {
+        setPageInput(currentPage);
+      },
+    );
     setPageInput(scrollState.currentPage);
     return () => {
       unregister?.();
@@ -117,190 +125,198 @@ export function PdfViewerToolbar({
 
   return (
     <Paper
-        radius="xl xl 0 0"
-        shadow="sm"
-        p={12}
-        pb={12}
-        style={{
-          display: "flex",
-          alignItems: "center",
-          gap: 10,
-          borderTopLeftRadius: 16,
-          borderTopRightRadius: 16,
-          borderBottomLeftRadius: 0,
-          borderBottomRightRadius: 0,
-          boxShadow: "0 -2px 8px rgba(0,0,0,0.04)",
-          pointerEvents: "auto",
-          minWidth: '30rem',
-        }}
+      radius="xl xl 0 0"
+      shadow="sm"
+      p={12}
+      pb={12}
+      style={{
+        display: "flex",
+        alignItems: "center",
+        gap: 10,
+        borderTopLeftRadius: 16,
+        borderTopRightRadius: 16,
+        borderBottomLeftRadius: 0,
+        borderBottomRightRadius: 0,
+        boxShadow: "0 -2px 8px rgba(0,0,0,0.04)",
+        pointerEvents: "auto",
+        minWidth: "30rem",
+      }}
+    >
+      {/* First Page Button */}
+      <Button
+        variant="subtle"
+        color="blue"
+        size="md"
+        px={8}
+        radius="xl"
+        onClick={handleFirstPage}
+        disabled={scrollState.currentPage === 1}
+        style={{ minWidth: "2.5rem" }}
+        title={t("viewer.firstPage", "First Page")}
       >
-        {/* First Page Button */}
-        <Button
-          variant="subtle"
-          color="blue"
-          size="md"
-          px={8}
-          radius="xl"
-          onClick={handleFirstPage}
-          disabled={scrollState.currentPage === 1}
-          style={{ minWidth: '2.5rem' }}
-          title={t("viewer.firstPage", "First Page")}
-        >
-          <FirstPageIcon fontSize="small" />
-        </Button>
+        <FirstPageIcon fontSize="small" />
+      </Button>
 
-        {/* Previous Page Button */}
-        <Button
-          variant="subtle"
-          color="blue"
-          size="md"
-          px={8}
-          radius="xl"
-          onClick={handlePreviousPage}
-          disabled={scrollState.currentPage === 1}
-          style={{ minWidth: '2.5rem' }}
-          title={t("viewer.previousPage", "Previous Page")}
-        >
-          <ArrowBackIosIcon fontSize="small" />
-        </Button>
+      {/* Previous Page Button */}
+      <Button
+        variant="subtle"
+        color="blue"
+        size="md"
+        px={8}
+        radius="xl"
+        onClick={handlePreviousPage}
+        disabled={scrollState.currentPage === 1}
+        style={{ minWidth: "2.5rem" }}
+        title={t("viewer.previousPage", "Previous Page")}
+      >
+        <ArrowBackIosIcon fontSize="small" />
+      </Button>
 
-        {/* Page Input */}
-        <NumberInput
-          value={pageInput}
-          onChange={(value) => {
-            const page = Number(value);
-            setPageInput(page);
-            if (!isNaN(page) && page >= 1 && page <= scrollState.totalPages) {
-              handlePageNavigation(page);
-            }
-          }}
-          min={1}
-          max={scrollState.totalPages}
-          hideControls
-          styles={{
-            input: { width: 48, textAlign: "center", fontWeight: 500, fontSize: 16 },
-          }}
-        />
-
-        <span style={{ fontWeight: 500, fontSize: 16 }}>
-          / {scrollState.totalPages}
-        </span>
-
-        {/* Next Page Button */}
-        <Button
-          variant="subtle"
-          color="blue"
-          size="md"
-          px={8}
-          radius="xl"
-          onClick={handleNextPage}
-          disabled={scrollState.currentPage === scrollState.totalPages}
-          style={{ minWidth: '2.5rem' }}
-          title={t("viewer.nextPage", "Next Page")}
-        >
-          <ArrowForwardIosIcon fontSize="small" />
-        </Button>
-
-        {/* Last Page Button */}
-        <Button
-          variant="subtle"
-          color="blue"
-          size="md"
-          px={8}
-          radius="xl"
-          onClick={handleLastPage}
-          disabled={scrollState.currentPage === scrollState.totalPages}
-          style={{ minWidth: '2.5rem' }}
-          title={t("viewer.lastPage", "Last Page")}
-        >
-          <LastPageIcon fontSize="small" />
-        </Button>
-
-        {/* Dual Page Toggle */}
-        <Tooltip
-          content={
-            isDualPageActive
-              ? t("viewer.singlePageView", "Single Page View")
-              : t("viewer.dualPageView", "Dual Page View")
+      {/* Page Input */}
+      <NumberInput
+        value={pageInput}
+        onChange={(value) => {
+          const page = Number(value);
+          setPageInput(page);
+          if (!isNaN(page) && page >= 1 && page <= scrollState.totalPages) {
+            handlePageNavigation(page);
           }
-          position="top"
-          arrow
-        >
-          <Button
-            variant={isDualPageActive ? "filled" : "light"}
-            color="blue"
-            size="md"
-            radius="xl"
-            onClick={handleDualPageToggle}
-            disabled={scrollState.totalPages <= 1}
-            style={{ minWidth: '2.5rem' }}
-          >
-            {isDualPageActive ? <DescriptionIcon fontSize="small" /> : <ViewWeekIcon fontSize="small" />}
-          </Button>
-        </Tooltip>
+        }}
+        min={1}
+        max={scrollState.totalPages}
+        hideControls
+        styles={{
+          input: {
+            width: 48,
+            textAlign: "center",
+            fontWeight: 500,
+            fontSize: 16,
+          },
+        }}
+      />
 
-        {/* PDF Render Mode Toggle */}
-        <Tooltip
-          content={
-            pdfRenderMode === 'normal'
+      <span style={{ fontWeight: 500, fontSize: 16 }}>
+        / {scrollState.totalPages}
+      </span>
+
+      {/* Next Page Button */}
+      <Button
+        variant="subtle"
+        color="blue"
+        size="md"
+        px={8}
+        radius="xl"
+        onClick={handleNextPage}
+        disabled={scrollState.currentPage === scrollState.totalPages}
+        style={{ minWidth: "2.5rem" }}
+        title={t("viewer.nextPage", "Next Page")}
+      >
+        <ArrowForwardIosIcon fontSize="small" />
+      </Button>
+
+      {/* Last Page Button */}
+      <Button
+        variant="subtle"
+        color="blue"
+        size="md"
+        px={8}
+        radius="xl"
+        onClick={handleLastPage}
+        disabled={scrollState.currentPage === scrollState.totalPages}
+        style={{ minWidth: "2.5rem" }}
+        title={t("viewer.lastPage", "Last Page")}
+      >
+        <LastPageIcon fontSize="small" />
+      </Button>
+
+      {/* Dual Page Toggle */}
+      <Tooltip
+        content={
+          isDualPageActive
+            ? t("viewer.singlePageView", "Single Page View")
+            : t("viewer.dualPageView", "Dual Page View")
+        }
+        position="top"
+        arrow
+      >
+        <Button
+          variant={isDualPageActive ? "filled" : "light"}
+          color="blue"
+          size="md"
+          radius="xl"
+          onClick={handleDualPageToggle}
+          disabled={scrollState.totalPages <= 1}
+          style={{ minWidth: "2.5rem" }}
+        >
+          {isDualPageActive ? (
+            <DescriptionIcon fontSize="small" />
+          ) : (
+            <ViewWeekIcon fontSize="small" />
+          )}
+        </Button>
+      </Tooltip>
+
+      {/* PDF Render Mode Toggle */}
+      <Tooltip
+        content={
+          pdfRenderMode === "normal"
+            ? t("viewer.enableDarkFilter", "Enable Dark Filter")
+            : pdfRenderMode === "dark"
+              ? t("viewer.enableSepiaFilter", "Enable Sepia Filter")
+              : t("viewer.disableColorFilter", "Disable Color Filter")
+        }
+        position="top"
+        arrow
+      >
+        <Button
+          variant={pdfRenderMode !== "normal" ? "filled" : "light"}
+          color="blue"
+          size="md"
+          radius="xl"
+          onClick={cyclePdfRenderMode}
+          style={{ minWidth: "2.5rem" }}
+          aria-label={
+            pdfRenderMode === "normal"
               ? t("viewer.enableDarkFilter", "Enable Dark Filter")
-              : pdfRenderMode === 'dark'
+              : pdfRenderMode === "dark"
                 ? t("viewer.enableSepiaFilter", "Enable Sepia Filter")
                 : t("viewer.disableColorFilter", "Disable Color Filter")
           }
-          position="top"
-          arrow
         >
-          <Button
-            variant={pdfRenderMode !== 'normal' ? "filled" : "light"}
-            color="blue"
-            size="md"
-            radius="xl"
-            onClick={cyclePdfRenderMode}
-            style={{ minWidth: '2.5rem' }}
-            aria-label={
-              pdfRenderMode === 'normal'
-                ? t("viewer.enableDarkFilter", "Enable Dark Filter")
-                : pdfRenderMode === 'dark'
-                  ? t("viewer.enableSepiaFilter", "Enable Sepia Filter")
-                  : t("viewer.disableColorFilter", "Disable Color Filter")
-            }
-          >
-            {pdfRenderMode === 'normal' && <DarkModeIcon fontSize="small" />}
-            {pdfRenderMode === 'dark' && <WbTwilightIcon fontSize="small" />}
-            {pdfRenderMode === 'sepia' && <WbSunnyIcon fontSize="small" />}
-          </Button>
-        </Tooltip>
+          {pdfRenderMode === "normal" && <DarkModeIcon fontSize="small" />}
+          {pdfRenderMode === "dark" && <WbTwilightIcon fontSize="small" />}
+          {pdfRenderMode === "sepia" && <WbSunnyIcon fontSize="small" />}
+        </Button>
+      </Tooltip>
 
-        {/* Zoom Controls */}
-        <Group gap={4} align="center" style={{ marginLeft: 16 }}>
-          <Button
-            variant="subtle"
-            color="blue"
-            size="md"
-            radius="xl"
-            onClick={handleZoomOut}
-            style={{ minWidth: '2rem', padding: 0 }}
-            title={t("viewer.zoomOut", "Zoom out")}
-          >
-            −
-          </Button>
-          <span style={{ minWidth: '2.5rem', textAlign: "center" }}>
-            {displayZoomPercent}%
-          </span>
-          <Button
-            variant="subtle"
-            color="blue"
-            size="md"
-            radius="xl"
-            onClick={handleZoomIn}
-            style={{ minWidth: '2rem', padding: 0 }}
-            title={t("viewer.zoomIn", "Zoom in")}
-          >
-            +
-          </Button>
-
-        </Group>
-      </Paper>
+      {/* Zoom Controls */}
+      <Group gap={4} align="center" style={{ marginLeft: 16 }}>
+        <Button
+          variant="subtle"
+          color="blue"
+          size="md"
+          radius="xl"
+          onClick={handleZoomOut}
+          style={{ minWidth: "2rem", padding: 0 }}
+          title={t("viewer.zoomOut", "Zoom out")}
+        >
+          −
+        </Button>
+        <span style={{ minWidth: "2.5rem", textAlign: "center" }}>
+          {displayZoomPercent}%
+        </span>
+        <Button
+          variant="subtle"
+          color="blue"
+          size="md"
+          radius="xl"
+          onClick={handleZoomIn}
+          style={{ minWidth: "2rem", padding: 0 }}
+          title={t("viewer.zoomIn", "Zoom in")}
+        >
+          +
+        </Button>
+      </Group>
+    </Paper>
   );
 }
diff --git a/frontend/src/core/components/viewer/PrintAPIBridge.tsx b/frontend/src/core/components/viewer/PrintAPIBridge.tsx
index d56a42cae6..fd3492a2b5 100644
--- a/frontend/src/core/components/viewer/PrintAPIBridge.tsx
+++ b/frontend/src/core/components/viewer/PrintAPIBridge.tsx
@@ -1,7 +1,7 @@
-import { useEffect } from 'react';
-import { usePrintCapability } from '@embedpdf/plugin-print/react';
-import { useViewer } from '@app/contexts/ViewerContext';
-import { useDocumentReady } from '@app/components/viewer/hooks/useDocumentReady';
+import { useEffect } from "react";
+import { usePrintCapability } from "@embedpdf/plugin-print/react";
+import { useViewer } from "@app/contexts/ViewerContext";
+import { useDocumentReady } from "@app/components/viewer/hooks/useDocumentReady";
 
 export interface PrintAPIBridgeProps {
   file?: File | Blob;
@@ -20,16 +20,16 @@ export function PrintAPIBridge(_props: PrintAPIBridgeProps) {
   useEffect(() => {
     if (print && documentReady) {
       // Register this bridge with ViewerContext
-      registerBridge('print', {
+      registerBridge("print", {
         state: {},
         api: {
           print: () => print.print(),
-        }
+        },
       });
     }
 
     return () => {
-      registerBridge('print', null);
+      registerBridge("print", null);
     };
   }, [print, documentReady, registerBridge]);
 
diff --git a/frontend/src/core/components/viewer/RedactionAPIBridge.tsx b/frontend/src/core/components/viewer/RedactionAPIBridge.tsx
index 4d78abce05..c860e074d0 100644
--- a/frontend/src/core/components/viewer/RedactionAPIBridge.tsx
+++ b/frontend/src/core/components/viewer/RedactionAPIBridge.tsx
@@ -1,10 +1,10 @@
-import { useEffect, useImperativeHandle } from 'react';
-import { useRedaction as useEmbedPdfRedaction } from '@embedpdf/plugin-redaction/react';
-import { PdfAnnotationSubtype } from '@embedpdf/models';
-import { useRedaction } from '@app/contexts/RedactionContext';
-import { useActiveDocumentId } from '@app/components/viewer/useActiveDocumentId';
-import { useAnnotationCapability } from '@embedpdf/plugin-annotation/react';
-import { useDocumentReady } from '@app/components/viewer/hooks/useDocumentReady';
+import { useEffect, useImperativeHandle } from "react";
+import { useRedaction as useEmbedPdfRedaction } from "@embedpdf/plugin-redaction/react";
+import { PdfAnnotationSubtype } from "@embedpdf/models";
+import { useRedaction } from "@app/contexts/RedactionContext";
+import { useActiveDocumentId } from "@app/components/viewer/useActiveDocumentId";
+import { useAnnotationCapability } from "@embedpdf/plugin-annotation/react";
+import { useDocumentReady } from "@app/components/viewer/hooks/useDocumentReady";
 
 /**
  * Bridges between the EmbedPDF redaction plugin and the Stirling-PDF RedactionContext.
@@ -23,7 +23,8 @@ export function RedactionAPIBridge() {
 }
 
 function RedactionAPIBridgeInner({ documentId }: { documentId: string }) {
-  const { state, provides: redactionProvides } = useEmbedPdfRedaction(documentId);
+  const { state, provides: redactionProvides } =
+    useEmbedPdfRedaction(documentId);
   const { provides: annotationProvides } = useAnnotationCapability();
   const {
     redactionApiRef,
@@ -31,7 +32,7 @@ function RedactionAPIBridgeInner({ documentId }: { documentId: string }) {
     setActiveType,
     setIsRedacting,
     setBridgeReady,
-    manualRedactColor
+    manualRedactColor,
   } = useRedaction();
 
   // Mark bridge as ready on mount, not ready on unmount
@@ -56,7 +57,7 @@ function RedactionAPIBridgeInner({ documentId }: { documentId: string }) {
   useEffect(() => {
     const annotationApi = annotationProvides as any;
     if (annotationApi?.setToolDefaults) {
-      annotationApi.setToolDefaults('redact', {
+      annotationApi.setToolDefaults("redact", {
         type: PdfAnnotationSubtype.REDACT,
         strokeColor: manualRedactColor,
         color: manualRedactColor,
@@ -64,34 +65,38 @@ function RedactionAPIBridgeInner({ documentId }: { documentId: string }) {
         fillColor: manualRedactColor,
         interiorColor: manualRedactColor,
         backgroundColor: manualRedactColor,
-        opacity: 1
+        opacity: 1,
       });
     }
   }, [annotationProvides, manualRedactColor]);
 
   // Expose the EmbedPDF API through our context's ref
-  useImperativeHandle(redactionApiRef, () => ({
-    toggleRedact: () => {
-      redactionProvides?.toggleRedact();
-    },
-    enableRedact: () => {
-      redactionProvides?.enableRedact();
-    },
-    isRedactActive: () => {
-      return redactionProvides?.isRedactActive() ?? false;
-    },
-    endRedact: () => {
-      redactionProvides?.endRedact();
-    },
-    // Common methods
-    commitAllPending: () => {
-      redactionProvides?.commitAllPending();
-      // Don't set redactionsApplied here - it should only be set after the file is saved
-      // The save operation in applyChanges will handle setting/clearing this flag
-    },
-    getActiveType: () => state?.activeType ?? null,
-    getPendingCount: () => state?.pendingCount ?? 0,
-  }), [redactionProvides, state]);
+  useImperativeHandle(
+    redactionApiRef,
+    () => ({
+      toggleRedact: () => {
+        redactionProvides?.toggleRedact();
+      },
+      enableRedact: () => {
+        redactionProvides?.enableRedact();
+      },
+      isRedactActive: () => {
+        return redactionProvides?.isRedactActive() ?? false;
+      },
+      endRedact: () => {
+        redactionProvides?.endRedact();
+      },
+      // Common methods
+      commitAllPending: () => {
+        redactionProvides?.commitAllPending();
+        // Don't set redactionsApplied here - it should only be set after the file is saved
+        // The save operation in applyChanges will handle setting/clearing this flag
+      },
+      getActiveType: () => state?.activeType ?? null,
+      getPendingCount: () => state?.pendingCount ?? 0,
+    }),
+    [redactionProvides, state],
+  );
 
   return null;
 }
diff --git a/frontend/src/core/components/viewer/RedactionPendingTracker.tsx b/frontend/src/core/components/viewer/RedactionPendingTracker.tsx
index f5cf3b4f7d..bcd8b950ad 100644
--- a/frontend/src/core/components/viewer/RedactionPendingTracker.tsx
+++ b/frontend/src/core/components/viewer/RedactionPendingTracker.tsx
@@ -1,6 +1,6 @@
-import { useEffect, useRef, useImperativeHandle, forwardRef } from 'react';
-import { useRedaction as useEmbedPdfRedaction } from '@embedpdf/plugin-redaction/react';
-import { useActiveDocumentId } from '@app/components/viewer/useActiveDocumentId';
+import { useEffect, useRef, useImperativeHandle, forwardRef } from "react";
+import { useRedaction as useEmbedPdfRedaction } from "@embedpdf/plugin-redaction/react";
+import { useActiveDocumentId } from "@app/components/viewer/useActiveDocumentId";
 
 export interface RedactionPendingTrackerAPI {
   commitAllPending: () => void;
@@ -10,38 +10,44 @@ export interface RedactionPendingTrackerAPI {
 export const RedactionPendingTracker = forwardRef<RedactionPendingTrackerAPI>(
   function RedactionPendingTracker(_, ref) {
     const activeDocumentId = useActiveDocumentId();
-    
+
     // Don't render the inner component until we have a valid document ID
     if (!activeDocumentId) {
       return null;
     }
-    
-    return <RedactionPendingTrackerInner documentId={activeDocumentId} ref={ref} />;
-  }
+
+    return (
+      <RedactionPendingTrackerInner documentId={activeDocumentId} ref={ref} />
+    );
+  },
 );
 
-const RedactionPendingTrackerInner = forwardRef<RedactionPendingTrackerAPI, { documentId: string }>(
-  function RedactionPendingTrackerInner({ documentId }, ref) {
-    const { state, provides } = useEmbedPdfRedaction(documentId);
-    
-    const pendingCountRef = useRef(0);
-    
-    // Expose API through ref
-    useImperativeHandle(ref, () => ({
+const RedactionPendingTrackerInner = forwardRef<
+  RedactionPendingTrackerAPI,
+  { documentId: string }
+>(function RedactionPendingTrackerInner({ documentId }, ref) {
+  const { state, provides } = useEmbedPdfRedaction(documentId);
+
+  const pendingCountRef = useRef(0);
+
+  // Expose API through ref
+  useImperativeHandle(
+    ref,
+    () => ({
       commitAllPending: () => {
         if (provides?.commitAllPending) {
           provides.commitAllPending();
         }
       },
       getPendingCount: () => pendingCountRef.current,
-    }), [provides]);
-    
-    // Update ref when pending count changes
-    useEffect(() => {
-      pendingCountRef.current = state?.pendingCount ?? 0;
-    }, [state?.pendingCount]);
+    }),
+    [provides],
+  );
 
-    return null;
-  }
-);
+  // Update ref when pending count changes
+  useEffect(() => {
+    pendingCountRef.current = state?.pendingCount ?? 0;
+  }, [state?.pendingCount]);
 
+  return null;
+});
diff --git a/frontend/src/core/components/viewer/RedactionSelectionMenu.tsx b/frontend/src/core/components/viewer/RedactionSelectionMenu.tsx
index 995a2ddda3..9a97312efd 100644
--- a/frontend/src/core/components/viewer/RedactionSelectionMenu.tsx
+++ b/frontend/src/core/components/viewer/RedactionSelectionMenu.tsx
@@ -1,13 +1,16 @@
-import { useRedaction as useEmbedPdfRedaction, RedactionSelectionMenuProps } from '@embedpdf/plugin-redaction/react';
-import { PdfAnnotationSubtype } from '@embedpdf/models';
-import { ActionIcon, Tooltip, Button, Group } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { createPortal } from 'react-dom';
-import { useEffect, useState, useRef, useCallback } from 'react';
-import DeleteIcon from '@mui/icons-material/Delete';
-import CheckCircleIcon from '@mui/icons-material/CheckCircle';
-import { useRedaction } from '@app/contexts/RedactionContext';
-import { useActiveDocumentId } from '@app/components/viewer/useActiveDocumentId';
+import {
+  useRedaction as useEmbedPdfRedaction,
+  RedactionSelectionMenuProps,
+} from "@embedpdf/plugin-redaction/react";
+import { PdfAnnotationSubtype } from "@embedpdf/models";
+import { ActionIcon, Tooltip, Button, Group } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import { createPortal } from "react-dom";
+import { useEffect, useState, useRef, useCallback } from "react";
+import DeleteIcon from "@mui/icons-material/Delete";
+import CheckCircleIcon from "@mui/icons-material/CheckCircle";
+import { useRedaction } from "@app/contexts/RedactionContext";
+import { useActiveDocumentId } from "@app/components/viewer/useActiveDocumentId";
 
 export type { RedactionSelectionMenuProps };
 
@@ -20,10 +23,7 @@ export function RedactionSelectionMenu(props: any) {
   }
 
   return (
-    <RedactionSelectionMenuInner
-      documentId={activeDocumentId}
-      {...props}
-    />
+    <RedactionSelectionMenuInner documentId={activeDocumentId} {...props} />
   );
 }
 
@@ -33,25 +33,37 @@ function RedactionSelectionMenuInner({
   selected,
   menuWrapperProps,
 }: RedactionSelectionMenuProps & { documentId: string }) {
-  const item = context?.type === 'redaction'
-    ? context.item
-    : (context?.type === 'annotation' ? (context as any).annotation?.object : null);
+  const item =
+    context?.type === "redaction"
+      ? context.item
+      : context?.type === "annotation"
+        ? (context as any).annotation?.object
+        : null;
 
-  const isRedaction = context?.type === 'redaction' || (context?.type === 'annotation' && item?.type === PdfAnnotationSubtype.REDACT);
+  const isRedaction =
+    context?.type === "redaction" ||
+    (context?.type === "annotation" &&
+      item?.type === PdfAnnotationSubtype.REDACT);
 
   const pageIndex = context?.pageIndex;
   const { t } = useTranslation();
   const { provides } = useEmbedPdfRedaction(documentId);
   const { setRedactionsApplied } = useRedaction();
   const wrapperRef = useRef<HTMLDivElement>(null);
-  const [menuPosition, setMenuPosition] = useState<{ top: number; left: number } | null>(null);
+  const [menuPosition, setMenuPosition] = useState<{
+    top: number;
+    left: number;
+  } | null>(null);
 
   // Merge refs - menuWrapperProps.ref is a callback ref
-  const setRef = useCallback((node: HTMLDivElement | null) => {
-    wrapperRef.current = node;
-    // Call the EmbedPDF ref callback
-    menuWrapperProps?.ref?.(node);
-  }, [menuWrapperProps]);
+  const setRef = useCallback(
+    (node: HTMLDivElement | null) => {
+      wrapperRef.current = node;
+      // Call the EmbedPDF ref callback
+      menuWrapperProps?.ref?.(node);
+    },
+    [menuWrapperProps],
+  );
 
   const handleRemove = useCallback(() => {
     if (provides?.removePending && item && pageIndex !== undefined) {
@@ -95,12 +107,12 @@ function RedactionSelectionMenuInner({
     updatePosition();
 
     // Update position on scroll/resize
-    window.addEventListener('scroll', updatePosition, true);
-    window.addEventListener('resize', updatePosition);
+    window.addEventListener("scroll", updatePosition, true);
+    window.addEventListener("resize", updatePosition);
 
     return () => {
-      window.removeEventListener('scroll', updatePosition, true);
-      window.removeEventListener('resize', updatePosition);
+      window.removeEventListener("scroll", updatePosition, true);
+      window.removeEventListener("resize", updatePosition);
     };
   }, [selected, item]);
 
@@ -110,68 +122,71 @@ function RedactionSelectionMenuInner({
   const menuContent = menuPosition ? (
     <div
       style={{
-        position: 'fixed',
+        position: "fixed",
         top: `${menuPosition.top}px`,
         left: `${menuPosition.left}px`,
-        transform: 'translateX(-50%)',
-        pointerEvents: 'auto',
+        transform: "translateX(-50%)",
+        pointerEvents: "auto",
         zIndex: 10000, // Very high z-index to appear above everything
-        backgroundColor: 'var(--mantine-color-body)',
+        backgroundColor: "var(--mantine-color-body)",
         borderRadius: 8,
-        padding: '8px 12px',
-        boxShadow: '0 2px 12px rgba(0, 0, 0, 0.25)',
-        border: '1px solid var(--mantine-color-default-border)',
+        padding: "8px 12px",
+        boxShadow: "0 2px 12px rgba(0, 0, 0, 0.25)",
+        border: "1px solid var(--mantine-color-default-border)",
         // Fixed size to prevent browser zoom affecting layout
-        fontSize: '14px',
-        minWidth: '180px',
+        fontSize: "14px",
+        minWidth: "180px",
       }}
     >
-        <Group gap="sm" wrap="nowrap" justify="center">
-          <Tooltip label="Remove this mark">
-            <ActionIcon
-              variant="subtle"
-              color="gray"
-              size="md"
-              onClick={handleRemove}
-              styles={{
-                root: {
-                  flexShrink: 0,
-                  backgroundColor: 'var(--bg-raised)',
-                  border: '1px solid var(--border-default)',
-                  color: 'var(--text-secondary)',
-                  '&:hover': {
-                    backgroundColor: 'var(--hover-bg)',
-                    borderColor: 'var(--border-strong)',
-                    color: 'var(--text-primary)',
-                  },
+      <Group gap="sm" wrap="nowrap" justify="center">
+        <Tooltip label="Remove this mark">
+          <ActionIcon
+            variant="subtle"
+            color="gray"
+            size="md"
+            onClick={handleRemove}
+            styles={{
+              root: {
+                flexShrink: 0,
+                backgroundColor: "var(--bg-raised)",
+                border: "1px solid var(--border-default)",
+                color: "var(--text-secondary)",
+                "&:hover": {
+                  backgroundColor: "var(--hover-bg)",
+                  borderColor: "var(--border-strong)",
+                  color: "var(--text-primary)",
                 },
-              }}
-            >
-              <DeleteIcon style={{ fontSize: 18 }} />
-            </ActionIcon>
-          </Tooltip>
-
-          <Tooltip
-            label={t('redact.manual.applyWarning', '⚠� Permanent application, cannot be undone and the data underneath will be deleted')}
-            withArrow
-            position="top"
+              },
+            }}
           >
-            <Button
-              variant="filled"
-              color="red"
-              size="xs"
-              onClick={handleApply}
-              leftSection={<CheckCircleIcon style={{ fontSize: 16 }} />}
-              styles={{
-                root: { flexShrink: 0, whiteSpace: 'nowrap' },
-              }}
-            >
-              Apply (permanent)
-            </Button>
-          </Tooltip>
-        </Group>
-      </div>
-    ) : null;
+            <DeleteIcon style={{ fontSize: 18 }} />
+          </ActionIcon>
+        </Tooltip>
+
+        <Tooltip
+          label={t(
+            "redact.manual.applyWarning",
+            "⚠� Permanent application, cannot be undone and the data underneath will be deleted",
+          )}
+          withArrow
+          position="top"
+        >
+          <Button
+            variant="filled"
+            color="red"
+            size="xs"
+            onClick={handleApply}
+            leftSection={<CheckCircleIcon style={{ fontSize: 16 }} />}
+            styles={{
+              root: { flexShrink: 0, whiteSpace: "nowrap" },
+            }}
+          >
+            Apply (permanent)
+          </Button>
+        </Tooltip>
+      </Group>
+    </div>
+  ) : null;
 
   return (
     <>
@@ -183,10 +198,10 @@ function RedactionSelectionMenuInner({
           ...menuWrapperProps?.style,
           // Keep the wrapper invisible but still occupying space for positioning
           opacity: 0,
-          pointerEvents: 'none',
+          pointerEvents: "none",
         }}
       />
-      {typeof document !== 'undefined' && menuContent
+      {typeof document !== "undefined" && menuContent
         ? createPortal(menuContent, document.body)
         : null}
     </>
diff --git a/frontend/src/core/components/viewer/RotateAPIBridge.tsx b/frontend/src/core/components/viewer/RotateAPIBridge.tsx
index 762e805989..b33b8a6819 100644
--- a/frontend/src/core/components/viewer/RotateAPIBridge.tsx
+++ b/frontend/src/core/components/viewer/RotateAPIBridge.tsx
@@ -1,8 +1,8 @@
-import { useEffect, useRef } from 'react';
-import { useRotate } from '@embedpdf/plugin-rotate/react';
-import { useViewer } from '@app/contexts/ViewerContext';
-import { useActiveDocumentId } from '@app/components/viewer/useActiveDocumentId';
-import { useDocumentReady } from '@app/components/viewer/hooks/useDocumentReady';
+import { useEffect, useRef } from "react";
+import { useRotate } from "@embedpdf/plugin-rotate/react";
+import { useViewer } from "@app/contexts/ViewerContext";
+import { useActiveDocumentId } from "@app/components/viewer/useActiveDocumentId";
+import { useDocumentReady } from "@app/components/viewer/hooks/useDocumentReady";
 
 /**
  * Connects the PDF rotation plugin to the shared ViewerContext.
@@ -33,23 +33,24 @@ function RotateAPIBridgeInner({ documentId }: { documentId: string }) {
     const currentRotate = rotateRef.current;
     if (currentRotate) {
       const newState = {
-        rotation
+        rotation,
       };
 
       // Register this bridge with ViewerContext
-      registerBridge('rotation', {
+      registerBridge("rotation", {
         state: newState,
         api: {
           rotateForward: () => currentRotate.rotateForward(),
           rotateBackward: () => currentRotate.rotateBackward(),
-          setRotation: (rotationValue: number) => currentRotate.setRotation(rotationValue),
+          setRotation: (rotationValue: number) =>
+            currentRotate.setRotation(rotationValue),
           getRotation: () => rotation,
-        }
+        },
       });
     }
 
     return () => {
-      registerBridge('rotation', null);
+      registerBridge("rotation", null);
     };
   }, [rotation, registerBridge]);
 
diff --git a/frontend/src/core/components/viewer/RulerOverlay.tsx b/frontend/src/core/components/viewer/RulerOverlay.tsx
index 3d8f91a74d..7fa7debeb7 100644
--- a/frontend/src/core/components/viewer/RulerOverlay.tsx
+++ b/frontend/src/core/components/viewer/RulerOverlay.tsx
@@ -1,5 +1,5 @@
-import React, { useCallback, useEffect, useRef, useState } from 'react';
-import { useViewer } from '@app/contexts/ViewerContext';
+import React, { useCallback, useEffect, useRef, useState } from "react";
+import { useViewer } from "@app/contexts/ViewerContext";
 
 // ─── Types ────────────────────────────────────────────────────────────────────
 
@@ -63,7 +63,7 @@ function angleDeg(a: Point, b: Point): number {
 
 function formatDist(pts: number): string {
   const mm = (pts / 72) * 25.4;
-  if (mm < 100)  return `${mm.toFixed(1)} mm`;
+  if (mm < 100) return `${mm.toFixed(1)} mm`;
   if (mm < 1000) return `${(mm / 10).toFixed(1)} cm`;
   return `${(mm / 1000).toFixed(2)} m`;
 }
@@ -119,8 +119,12 @@ function pickScale(
   for (const { bbox, scale } of info.viewports) {
     if (!bbox) return scale; // whole-page viewport
     const [x0, y0, x1, y1] = bbox;
-    if (mx >= Math.min(x0, x1) && mx <= Math.max(x0, x1) &&
-        my >= Math.min(y0, y1) && my <= Math.max(y0, y1)) {
+    if (
+      mx >= Math.min(x0, x1) &&
+      mx <= Math.max(x0, x1) &&
+      my >= Math.min(y0, y1) &&
+      my <= Math.max(y0, y1)
+    ) {
       return scale;
     }
   }
@@ -130,25 +134,31 @@ function pickScale(
 function formatScaled(pts: number, scale: MeasureScale): string {
   const val = pts * scale.factor;
   if (val >= 1000) return `${val.toFixed(0)} ${scale.unit}`;
-  if (val >= 100)  return `${val.toFixed(1)} ${scale.unit}`;
-  if (val >= 10)   return `${val.toFixed(2)} ${scale.unit}`;
+  if (val >= 100) return `${val.toFixed(1)} ${scale.unit}`;
+  if (val >= 10) return `${val.toFixed(2)} ${scale.unit}`;
   return `${val.toFixed(3)} ${scale.unit}`;
 }
 
 // Conversion factors to metres for known units
 const TO_METRES: Record<string, number> = {
-  m: 1, cm: 0.01, mm: 0.001, km: 1000,
-  ft: 0.3048, in: 0.0254, yd: 0.9144, mi: 1609.344,
+  m: 1,
+  cm: 0.01,
+  mm: 0.001,
+  km: 1000,
+  ft: 0.3048,
+  in: 0.0254,
+  yd: 0.9144,
+  mi: 1609.344,
 };
 
 function isImperialUnit(unit: string): boolean {
-  return ['ft', 'in', 'yd', 'mi'].includes(unit.toLowerCase().trim());
+  return ["ft", "in", "yd", "mi"].includes(unit.toLowerCase().trim());
 }
 
 function formatMetricFromMetres(m: number): string {
   if (m >= 1000) return `${(m / 1000).toFixed(2)} km`;
-  if (m >= 1)    return `${m.toFixed(1)} m`;
-  if (m >= 0.1)  return `${(m * 100).toFixed(1)} cm`;
+  if (m >= 1) return `${m.toFixed(1)} m`;
+  if (m >= 0.1) return `${(m * 100).toFixed(1)} cm`;
   return `${(m * 1000).toFixed(1)} mm`;
 }
 
@@ -181,7 +191,11 @@ function findScrollEl(root: HTMLElement): HTMLElement | null {
     const el = node as HTMLElement;
     if (el === root) continue;
     const { overflow, overflowY, overflowX } = window.getComputedStyle(el);
-    if ([overflow, overflowY, overflowX].some(v => v === 'auto' || v === 'scroll')) {
+    if (
+      [overflow, overflowY, overflowX].some(
+        (v) => v === "auto" || v === "scroll",
+      )
+    ) {
       return el;
     }
   }
@@ -189,7 +203,7 @@ function findScrollEl(root: HTMLElement): HTMLElement | null {
 }
 
 function isOverPage(e: MouseEvent): boolean {
-  return !!(e.target as Element).closest?.('[data-page-index]');
+  return !!(e.target as Element).closest?.("[data-page-index]");
 }
 
 /**
@@ -202,28 +216,28 @@ function nearestPageDocPt(
   container: HTMLElement,
   zoom: number,
 ): { screenPt: Point; docPt: PagePoint } | null {
-  const pages = container.querySelectorAll('[data-page-index]');
+  const pages = container.querySelectorAll("[data-page-index]");
   if (!pages.length) return null;
 
   const cr = container.getBoundingClientRect();
   let bestDist = Infinity;
   let best: { screenPt: Point; docPt: PagePoint } | null = null;
 
-  pages.forEach(pageNode => {
+  pages.forEach((pageNode) => {
     const pageEl = pageNode as HTMLElement;
     const r = pageEl.getBoundingClientRect();
-    const pageIndex = parseInt(pageEl.dataset.pageIndex ?? '0', 10);
+    const pageIndex = parseInt(pageEl.dataset.pageIndex ?? "0", 10);
 
     // Page bounds in SVG (container-relative) space
-    const left   = r.left   - cr.left;
-    const top    = r.top    - cr.top;
-    const right  = r.right  - cr.left;
+    const left = r.left - cr.left;
+    const top = r.top - cr.top;
+    const right = r.right - cr.left;
     const bottom = r.bottom - cr.top;
 
     // Nearest point on this rect to the cursor (SVG space)
-    const cx = Math.max(left, Math.min(right,  cursor.x));
-    const cy = Math.max(top,  Math.min(bottom, cursor.y));
-    const d  = Math.sqrt((cursor.x - cx) ** 2 + (cursor.y - cy) ** 2);
+    const cx = Math.max(left, Math.min(right, cursor.x));
+    const cy = Math.max(top, Math.min(bottom, cursor.y));
+    const d = Math.sqrt((cursor.x - cx) ** 2 + (cursor.y - cy) ** 2);
 
     if (d < bestDist) {
       bestDist = d;
@@ -236,7 +250,7 @@ function nearestPageDocPt(
         docPt: {
           pageIndex,
           x: (cr.left + cx - r.left) / zoom,
-          y: (cr.top  + cy - r.top ) / zoom,
+          y: (cr.top + cy - r.top) / zoom,
         },
       };
     }
@@ -249,10 +263,10 @@ function nearestPageDocPt(
 
 const TICK = 10;
 const DOT_R = 5;
-const LH  = 26;   // label height (normal — 1 line)
-const LH2 = 44;   // label height (hovered, no scale — 2 lines)
-const LH3 = 62;   // label height (hovered, with scale — 3 lines)
-const LP  = 10;   // label horizontal padding
+const LH = 26; // label height (normal — 1 line)
+const LH2 = 44; // label height (hovered, no scale — 2 lines)
+const LH3 = 62; // label height (hovered, with scale — 3 lines)
+const LP = 10; // label horizontal padding
 const DEL_R = 8;
 
 interface MeasurementLineProps {
@@ -267,7 +281,16 @@ interface MeasurementLineProps {
   measureScale?: MeasureScale | null;
 }
 
-function MeasurementLine({ id, startS, endS, distPts, hovered, onDelete, onHover, measureScale }: MeasurementLineProps) {
+function MeasurementLine({
+  id,
+  startS,
+  endS,
+  distPts,
+  hovered,
+  onDelete,
+  onHover,
+  measureScale,
+}: MeasurementLineProps) {
   const mid = midpoint(startS, endS);
   const { nx, ny } = perpUnit(startS, endS);
   const ang = angleDeg(startS, endS);
@@ -277,7 +300,9 @@ function MeasurementLine({ id, startS, endS, distPts, hovered, onDelete, onHover
   const imperialFirst = !!measureScale && isImperialUnit(measureScale.unit);
 
   // Idle: scaled primary if scale present, else physical metric
-  const distLabel = measureScale ? formatScaled(distPts, measureScale) : formatDist(distPts);
+  const distLabel = measureScale
+    ? formatScaled(distPts, measureScale)
+    : formatDist(distPts);
 
   // Hover line 1 — both real-world values ordered by PDF unit system:
   //   imperial PDF: "10.000 ft / 3.048 m"
@@ -285,8 +310,8 @@ function MeasurementLine({ id, startS, endS, distPts, hovered, onDelete, onHover
   //   no scale:     "25.4 mm / 1.00 in"  (metric first, default)
   const hoverLine1 = measureScale
     ? (() => {
-        const primary  = formatScaled(distPts, measureScale);
-        const cross    = scaledCross(distPts, measureScale);
+        const primary = formatScaled(distPts, measureScale);
+        const cross = scaledCross(distPts, measureScale);
         return cross ? `${primary} / ${cross}` : primary;
       })()
     : `${formatDist(distPts)} / ${formatInches(distPts)}`;
@@ -295,9 +320,9 @@ function MeasurementLine({ id, startS, endS, distPts, hovered, onDelete, onHover
   //   imperial PDF: "1.00 in / 25.4 mm"
   //   metric PDF or no scale: "25.4 mm / 1.00 in"
   const hoverLine2 = measureScale
-    ? (imperialFirst
-        ? `${formatInches(distPts)} / ${formatDist(distPts)}`
-        : `${formatDist(distPts)} / ${formatInches(distPts)}`)
+    ? imperialFirst
+      ? `${formatInches(distPts)} / ${formatDist(distPts)}`
+      : `${formatDist(distPts)} / ${formatInches(distPts)}`
     : null;
 
   // Hover line 3 (scaled) / line 2 (no scale) — ratio label + angle
@@ -309,7 +334,7 @@ function MeasurementLine({ id, startS, endS, distPts, hovered, onDelete, onHover
   const lh = hovered ? maxHoverLh : LH;
 
   const lwNormal = Math.max(distLabel.length * 8 + LP * 2, 80);
-  const lwHover  = Math.max(
+  const lwHover = Math.max(
     hoverLine1.length * 8 + LP * 2,
     (hoverLine2?.length ?? 0) * 8 + LP * 2,
     contextLabel.length * 8 + LP * 2,
@@ -321,9 +346,9 @@ function MeasurementLine({ id, startS, endS, distPts, hovered, onDelete, onHover
   const delX = mid.x + lwHover / 2 + DEL_R + 4;
   const delY = mid.y;
 
-  const hitLeft   = mid.x - lwHover / 2 - 4;
-  const hitTop    = mid.y - maxHoverLh / 2 - 4;
-  const hitWidth  = (delX + DEL_R + 4) - hitLeft;
+  const hitLeft = mid.x - lwHover / 2 - 4;
+  const hitTop = mid.y - maxHoverLh / 2 - 4;
+  const hitWidth = delX + DEL_R + 4 - hitLeft;
   const hitHeight = maxHoverLh + 8;
 
   const mono = "'Roboto Mono','Consolas',monospace";
@@ -332,60 +357,192 @@ function MeasurementLine({ id, startS, endS, distPts, hovered, onDelete, onHover
     <g
       onMouseEnter={() => onHover(id)}
       onMouseLeave={() => onHover(null)}
-      style={{ pointerEvents: 'all' }}
+      style={{ pointerEvents: "all" }}
     >
-      <rect x={hitLeft} y={hitTop} width={hitWidth} height={hitHeight}
-        fill="transparent" stroke="none" style={{ pointerEvents: 'all' }} />
+      <rect
+        x={hitLeft}
+        y={hitTop}
+        width={hitWidth}
+        height={hitHeight}
+        fill="transparent"
+        stroke="none"
+        style={{ pointerEvents: "all" }}
+      />
 
-      <line x1={startS.x} y1={startS.y} x2={endS.x} y2={endS.y}
-        stroke="#1e88e5" strokeWidth={sw} strokeLinecap="round" />
-      <line x1={startS.x + nx * TICK / 2} y1={startS.y + ny * TICK / 2}
-            x2={startS.x - nx * TICK / 2} y2={startS.y - ny * TICK / 2}
-            stroke="#1e88e5" strokeWidth={sw} strokeLinecap="round" />
-      <line x1={endS.x + nx * TICK / 2} y1={endS.y + ny * TICK / 2}
-            x2={endS.x - nx * TICK / 2} y2={endS.y - ny * TICK / 2}
-            stroke="#1e88e5" strokeWidth={sw} strokeLinecap="round" />
-      <circle cx={startS.x} cy={startS.y} r={DOT_R} fill="#1e88e5" stroke="white" strokeWidth={2} />
-      <circle cx={endS.x} cy={endS.y} r={DOT_R} fill="#1e88e5" stroke="white" strokeWidth={2} />
+      <line
+        x1={startS.x}
+        y1={startS.y}
+        x2={endS.x}
+        y2={endS.y}
+        stroke="#1e88e5"
+        strokeWidth={sw}
+        strokeLinecap="round"
+      />
+      <line
+        x1={startS.x + (nx * TICK) / 2}
+        y1={startS.y + (ny * TICK) / 2}
+        x2={startS.x - (nx * TICK) / 2}
+        y2={startS.y - (ny * TICK) / 2}
+        stroke="#1e88e5"
+        strokeWidth={sw}
+        strokeLinecap="round"
+      />
+      <line
+        x1={endS.x + (nx * TICK) / 2}
+        y1={endS.y + (ny * TICK) / 2}
+        x2={endS.x - (nx * TICK) / 2}
+        y2={endS.y - (ny * TICK) / 2}
+        stroke="#1e88e5"
+        strokeWidth={sw}
+        strokeLinecap="round"
+      />
+      <circle
+        cx={startS.x}
+        cy={startS.y}
+        r={DOT_R}
+        fill="#1e88e5"
+        stroke="white"
+        strokeWidth={2}
+      />
+      <circle
+        cx={endS.x}
+        cy={endS.y}
+        r={DOT_R}
+        fill="#1e88e5"
+        stroke="white"
+        strokeWidth={2}
+      />
 
-      <g style={{ pointerEvents: 'all', cursor: 'default' }}>
-        <rect x={mid.x - lw / 2} y={mid.y - lh / 2} width={lw} height={lh}
-          rx={5} fill="white" stroke="#1e88e5" strokeWidth={1.5} filter="url(#ruler-shadow)" />
+      <g style={{ pointerEvents: "all", cursor: "default" }}>
+        <rect
+          x={mid.x - lw / 2}
+          y={mid.y - lh / 2}
+          width={lw}
+          height={lh}
+          rx={5}
+          fill="white"
+          stroke="#1e88e5"
+          strokeWidth={1.5}
+          filter="url(#ruler-shadow)"
+        />
 
         {hovered && measureScale ? (
           // 3-line scaled hover
           <>
-            <text x={mid.x} y={mid.y - 17} textAnchor="middle" dominantBaseline="middle"
-              fill="#1e88e5" fontSize={12} fontFamily={mono} fontWeight={600}
-              style={{ userSelect: 'none' }}>{hoverLine1}</text>
-            <text x={mid.x} y={mid.y} textAnchor="middle" dominantBaseline="middle"
-              fill="#546e7a" fontSize={11} fontFamily={mono} fontWeight={500}
-              style={{ userSelect: 'none' }}>{hoverLine2}</text>
-            <text x={mid.x} y={mid.y + 17} textAnchor="middle" dominantBaseline="middle"
-              fill="#5c6bc0" fontSize={10} fontFamily={mono} fontWeight={500}
-              style={{ userSelect: 'none' }}>{contextLabel}</text>
+            <text
+              x={mid.x}
+              y={mid.y - 17}
+              textAnchor="middle"
+              dominantBaseline="middle"
+              fill="#1e88e5"
+              fontSize={12}
+              fontFamily={mono}
+              fontWeight={600}
+              style={{ userSelect: "none" }}
+            >
+              {hoverLine1}
+            </text>
+            <text
+              x={mid.x}
+              y={mid.y}
+              textAnchor="middle"
+              dominantBaseline="middle"
+              fill="#546e7a"
+              fontSize={11}
+              fontFamily={mono}
+              fontWeight={500}
+              style={{ userSelect: "none" }}
+            >
+              {hoverLine2}
+            </text>
+            <text
+              x={mid.x}
+              y={mid.y + 17}
+              textAnchor="middle"
+              dominantBaseline="middle"
+              fill="#5c6bc0"
+              fontSize={10}
+              fontFamily={mono}
+              fontWeight={500}
+              style={{ userSelect: "none" }}
+            >
+              {contextLabel}
+            </text>
           </>
         ) : hovered ? (
           // 2-line no-scale hover
           <>
-            <text x={mid.x} y={mid.y - 6} textAnchor="middle" dominantBaseline="middle"
-              fill="#1e88e5" fontSize={12} fontFamily={mono} fontWeight={600}
-              style={{ userSelect: 'none' }}>{hoverLine1}</text>
-            <text x={mid.x} y={mid.y + 13} textAnchor="middle" dominantBaseline="middle"
-              fill="#5c6bc0" fontSize={11} fontFamily={mono} fontWeight={500}
-              style={{ userSelect: 'none' }}>{contextLabel}</text>
+            <text
+              x={mid.x}
+              y={mid.y - 6}
+              textAnchor="middle"
+              dominantBaseline="middle"
+              fill="#1e88e5"
+              fontSize={12}
+              fontFamily={mono}
+              fontWeight={600}
+              style={{ userSelect: "none" }}
+            >
+              {hoverLine1}
+            </text>
+            <text
+              x={mid.x}
+              y={mid.y + 13}
+              textAnchor="middle"
+              dominantBaseline="middle"
+              fill="#5c6bc0"
+              fontSize={11}
+              fontFamily={mono}
+              fontWeight={500}
+              style={{ userSelect: "none" }}
+            >
+              {contextLabel}
+            </text>
           </>
         ) : (
           // Idle — single line
-          <text x={mid.x} y={mid.y + 1} textAnchor="middle" dominantBaseline="middle"
-            fill="#1e88e5" fontSize={12} fontFamily={mono} fontWeight={600}
-            style={{ userSelect: 'none' }}>{distLabel}</text>
+          <text
+            x={mid.x}
+            y={mid.y + 1}
+            textAnchor="middle"
+            dominantBaseline="middle"
+            fill="#1e88e5"
+            fontSize={12}
+            fontFamily={mono}
+            fontWeight={600}
+            style={{ userSelect: "none" }}
+          >
+            {distLabel}
+          </text>
         )}
 
-        <g style={{ cursor: 'pointer' }} onClick={(e) => { e.stopPropagation(); onDelete(id); }}>
-          <circle cx={delX} cy={delY} r={DEL_R} fill="#ef5350" stroke="white" strokeWidth={1.5} />
-          <text x={delX} y={delY} textAnchor="middle" dominantBaseline="middle"
-            fill="white" fontSize={12} fontWeight={700} style={{ userSelect: 'none' }}>×</text>
+        <g
+          style={{ cursor: "pointer" }}
+          onClick={(e) => {
+            e.stopPropagation();
+            onDelete(id);
+          }}
+        >
+          <circle
+            cx={delX}
+            cy={delY}
+            r={DEL_R}
+            fill="#ef5350"
+            stroke="white"
+            strokeWidth={1.5}
+          />
+          <text
+            x={delX}
+            y={delY}
+            textAnchor="middle"
+            dominantBaseline="middle"
+            fill="white"
+            fontSize={12}
+            fontWeight={700}
+            style={{ userSelect: "none" }}
+          >
+            ×
+          </text>
         </g>
       </g>
     </g>
@@ -404,33 +561,69 @@ function LiveLine({ startS, endS, zoom, measureScale }: LiveLineProps) {
   const mid = midpoint(startS, endS);
   const { nx, ny } = perpUnit(startS, endS);
   const ang = angleDeg(startS, endS);
-  const distLabel = measureScale ? formatScaled(d, measureScale) : formatDist(d);
+  const distLabel = measureScale
+    ? formatScaled(d, measureScale)
+    : formatDist(d);
   const lw = Math.max(distLabel.length * 8 + LP * 2, 80);
 
   return (
     <g>
-      <line x1={startS.x} y1={startS.y} x2={endS.x} y2={endS.y}
-        stroke="#1e88e5" strokeWidth={2} strokeDasharray="7 4"
-        strokeLinecap="round" opacity={0.85} />
-      <line x1={startS.x + nx * TICK / 2} y1={startS.y + ny * TICK / 2}
-            x2={startS.x - nx * TICK / 2} y2={startS.y - ny * TICK / 2}
-            stroke="#1e88e5" strokeWidth={2} strokeLinecap="round" />
+      <line
+        x1={startS.x}
+        y1={startS.y}
+        x2={endS.x}
+        y2={endS.y}
+        stroke="#1e88e5"
+        strokeWidth={2}
+        strokeDasharray="7 4"
+        strokeLinecap="round"
+        opacity={0.85}
+      />
+      <line
+        x1={startS.x + (nx * TICK) / 2}
+        y1={startS.y + (ny * TICK) / 2}
+        x2={startS.x - (nx * TICK) / 2}
+        y2={startS.y - (ny * TICK) / 2}
+        stroke="#1e88e5"
+        strokeWidth={2}
+        strokeLinecap="round"
+      />
       {d > 4 && (
         <g>
-          <rect x={mid.x - lw / 2} y={mid.y - LH2 / 2} width={lw} height={LH2}
-            rx={5} fill="#1e88e5" stroke="white" strokeWidth={1} />
-          <text x={mid.x} y={mid.y - 6}
-            textAnchor="middle" dominantBaseline="middle"
-            fill="white" fontSize={12}
-            fontFamily="'Roboto Mono','Consolas',monospace" fontWeight={600}
-            style={{ userSelect: 'none' }}>
+          <rect
+            x={mid.x - lw / 2}
+            y={mid.y - LH2 / 2}
+            width={lw}
+            height={LH2}
+            rx={5}
+            fill="#1e88e5"
+            stroke="white"
+            strokeWidth={1}
+          />
+          <text
+            x={mid.x}
+            y={mid.y - 6}
+            textAnchor="middle"
+            dominantBaseline="middle"
+            fill="white"
+            fontSize={12}
+            fontFamily="'Roboto Mono','Consolas',monospace"
+            fontWeight={600}
+            style={{ userSelect: "none" }}
+          >
             {distLabel}
           </text>
-          <text x={mid.x} y={mid.y + 13}
-            textAnchor="middle" dominantBaseline="middle"
-            fill="rgba(255,255,255,0.85)" fontSize={11}
-            fontFamily="'Roboto Mono','Consolas',monospace" fontWeight={500}
-            style={{ userSelect: 'none' }}>
+          <text
+            x={mid.x}
+            y={mid.y + 13}
+            textAnchor="middle"
+            dominantBaseline="middle"
+            fill="rgba(255,255,255,0.85)"
+            fontSize={11}
+            fontFamily="'Roboto Mono','Consolas',monospace"
+            fontWeight={500}
+            style={{ userSelect: "none" }}
+          >
             {`∠ ${ang.toFixed(1)}°`}
           </text>
         </g>
@@ -441,307 +634,399 @@ function LiveLine({ startS, endS, zoom, measureScale }: LiveLineProps) {
 
 // ─── Main ─────────────────────────────────────────────────────────────────────
 
-export const RulerOverlay = React.forwardRef<RulerOverlayHandle, RulerOverlayProps>(
-  ({ containerRef, isActive, pageMeasureScales }, ref) => {
-    const [measurements, setMeasurements] = useState<Measurement[]>([]);
-    const [firstPt, setFirstPt] = useState<PagePoint | null>(null);
-    /** Current cursor in SVG screen-space — for live crosshair and live line rendering. */
-    const [cursorS, setCursorS] = useState<Point | null>(null);
-    /** Current cursor in page-relative PDF units — for finalising off-page clicks. */
-    const [cursorDoc, setCursorDoc] = useState<PagePoint | null>(null);
-    const [hoveredId, setHoveredId] = useState<string | null>(null);
+export const RulerOverlay = React.forwardRef<
+  RulerOverlayHandle,
+  RulerOverlayProps
+>(({ containerRef, isActive, pageMeasureScales }, ref) => {
+  const [measurements, setMeasurements] = useState<Measurement[]>([]);
+  const [firstPt, setFirstPt] = useState<PagePoint | null>(null);
+  /** Current cursor in SVG screen-space — for live crosshair and live line rendering. */
+  const [cursorS, setCursorS] = useState<Point | null>(null);
+  /** Current cursor in page-relative PDF units — for finalising off-page clicks. */
+  const [cursorDoc, setCursorDoc] = useState<PagePoint | null>(null);
+  const [hoveredId, setHoveredId] = useState<string | null>(null);
 
-    /**
-     * Incremented on scroll to trigger re-renders.
-     * We no longer store the scroll value — getBoundingClientRect handles that
-     * automatically and is always accurate regardless of scroll position.
-     */
-    const [, setScrollVersion] = useState(0);
+  /**
+   * Incremented on scroll to trigger re-renders.
+   * We no longer store the scroll value — getBoundingClientRect handles that
+   * automatically and is always accurate regardless of scroll position.
+   */
+  const [, setScrollVersion] = useState(0);
 
-    const scrollElRef = useRef<HTMLElement | null>(null);
-    const scrollCleanupRef = useRef<(() => void) | null>(null);
-    const idCounter = useRef(0);
+  const scrollElRef = useRef<HTMLElement | null>(null);
+  const scrollCleanupRef = useRef<(() => void) | null>(null);
+  const idCounter = useRef(0);
 
-    const firstPtRef = useRef<PagePoint | null>(null);
-    useEffect(() => { firstPtRef.current = firstPt; }, [firstPt]);
+  const firstPtRef = useRef<PagePoint | null>(null);
+  useEffect(() => {
+    firstPtRef.current = firstPt;
+  }, [firstPt]);
 
-    const cursorDocRef = useRef<PagePoint | null>(null);
+  const cursorDocRef = useRef<PagePoint | null>(null);
 
-    // ── Zoom ──────────────────────────────────────────────────────────────────
-    const viewer = useViewer();
-    const { registerImmediateZoomUpdate } = viewer;
+  // ── Zoom ──────────────────────────────────────────────────────────────────
+  const viewer = useViewer();
+  const { registerImmediateZoomUpdate } = viewer;
 
-    const [zoom, setZoom] = useState<number>(() => {
-      try { return ((viewer.getZoomState() as any)?.zoomPercent ?? 140) / 100; }
-      catch { return 1.4; }
+  const [zoom, setZoom] = useState<number>(() => {
+    try {
+      return ((viewer.getZoomState() as any)?.zoomPercent ?? 140) / 100;
+    } catch {
+      return 1.4;
+    }
+  });
+
+  const zoomRef = useRef(zoom);
+  useEffect(() => {
+    zoomRef.current = zoom;
+  }, [zoom]);
+
+  useEffect(() => {
+    return registerImmediateZoomUpdate((pct) => {
+      const newZoom = pct / 100;
+      zoomRef.current = newZoom; // immediate for event-listener closures
+      setZoom(newZoom); // re-render #1: zoom updated, but PDF.js DOM may not be yet
+      // re-render #2: after PDF.js has updated page element dimensions in the DOM,
+      // so getBoundingClientRect returns the correct positions for the new zoom level.
+      requestAnimationFrame(() => setScrollVersion((n) => n + 1));
     });
+  }, [registerImmediateZoomUpdate]);
 
-    const zoomRef = useRef(zoom);
-    useEffect(() => { zoomRef.current = zoom; }, [zoom]);
+  // ── Scroll tracking ────────────────────────────────────────────────────────
+  // We only need re-renders on scroll; getBoundingClientRect gives us accurate
+  // positions without needing to know the scroll offset ourselves.
 
-    useEffect(() => {
-      return registerImmediateZoomUpdate((pct) => {
-        const newZoom = pct / 100;
-        zoomRef.current = newZoom; // immediate for event-listener closures
-        setZoom(newZoom);          // re-render #1: zoom updated, but PDF.js DOM may not be yet
-        // re-render #2: after PDF.js has updated page element dimensions in the DOM,
-        // so getBoundingClientRect returns the correct positions for the new zoom level.
-        requestAnimationFrame(() => setScrollVersion(n => n + 1));
-      });
-    }, [registerImmediateZoomUpdate]);
+  const attachScrollEl = useCallback((el: HTMLElement) => {
+    scrollCleanupRef.current?.();
+    scrollElRef.current = el;
+    const handler = () => setScrollVersion((n) => n + 1);
+    el.addEventListener("scroll", handler, { passive: true });
+    scrollCleanupRef.current = () => el.removeEventListener("scroll", handler);
+  }, []);
 
-    // ── Scroll tracking ────────────────────────────────────────────────────────
-    // We only need re-renders on scroll; getBoundingClientRect gives us accurate
-    // positions without needing to know the scroll offset ourselves.
+  useEffect(() => {
+    const container = containerRef.current;
+    if (!container) return;
 
-    const attachScrollEl = useCallback((el: HTMLElement) => {
-      scrollCleanupRef.current?.();
-      scrollElRef.current = el;
-      const handler = () => setScrollVersion(n => n + 1);
-      el.addEventListener('scroll', handler, { passive: true });
-      scrollCleanupRef.current = () => el.removeEventListener('scroll', handler);
-    }, []);
-
-    useEffect(() => {
-      const container = containerRef.current;
-      if (!container) return;
-
-      const tryAttach = () => {
-        const el = findScrollEl(container);
-        if (el) { attachScrollEl(el); return true; }
-        return false;
-      };
-
-      if (!tryAttach()) {
-        const timer = setTimeout(() => tryAttach(), 600);
-        return () => { clearTimeout(timer); scrollCleanupRef.current?.(); };
-      }
-      return () => scrollCleanupRef.current?.();
-    }, [containerRef, attachScrollEl]);
-
-    // Re-find scroll element when zoom changes (PDF.js may recreate the scroll DOM).
-    useEffect(() => {
-      const container = containerRef.current;
-      if (!container) return;
+    const tryAttach = () => {
       const el = findScrollEl(container);
-      if (el && el !== scrollElRef.current) attachScrollEl(el);
-    }, [zoom, containerRef, attachScrollEl]);
+      if (el) {
+        attachScrollEl(el);
+        return true;
+      }
+      return false;
+    };
 
-    // ── Imperative handle ──────────────────────────────────────────────────────
-    React.useImperativeHandle(ref, () => ({
-      clearAll: () => { setMeasurements([]); setFirstPt(null); setCursorS(null); setCursorDoc(null); },
-    }));
-
-    // ── Reset when deactivated ─────────────────────────────────────────────────
-    useEffect(() => {
-      if (!isActive) { setFirstPt(null); setCursorS(null); setCursorDoc(null); }
-    }, [isActive]);
-
-    // ── Mouse events ───────────────────────────────────────────────────────────
-    useEffect(() => {
-      const el = containerRef.current;
-      if (!isActive || !el) return;
-
-      const toScreenPt = (e: MouseEvent): Point => {
-        const r = el.getBoundingClientRect();
-        return { x: e.clientX - r.left, y: e.clientY - r.top };
-      };
-
-      /**
-       * Convert a mouse event to a page-relative PagePoint.
-       * Returns null if the cursor is not directly over a page element.
-       */
-      const toDocPagePt = (e: MouseEvent): PagePoint | null => {
-        const pageEl = (e.target as Element).closest?.('[data-page-index]') as HTMLElement | null;
-        if (!pageEl) return null;
-        const pageIndex = parseInt(pageEl.dataset.pageIndex ?? '0', 10);
-        const r = pageEl.getBoundingClientRect();
-        const z = zoomRef.current;
-        return { pageIndex, x: (e.clientX - r.left) / z, y: (e.clientY - r.top) / z };
-      };
-
-      const clearCursor = () => {
-        setCursorS(null);
-        setCursorDoc(null);
-        cursorDocRef.current = null;
-      };
-
-      const onMove = (e: MouseEvent) => {
-        const screenPt = toScreenPt(e);
-
-        if (isOverPage(e)) {
-          el.style.cursor = 'crosshair';
-          const docPt = toDocPagePt(e);
-          setCursorS(screenPt);
-          setCursorDoc(docPt);
-          cursorDocRef.current = docPt;
-        } else if (firstPtRef.current !== null) {
-          // First point placed, cursor wandered off page — clamp to nearest edge
-          el.style.cursor = 'crosshair';
-          const result = nearestPageDocPt(screenPt, el, zoomRef.current);
-          if (result) {
-            setCursorS(result.screenPt);
-            setCursorDoc(result.docPt);
-            cursorDocRef.current = result.docPt;
-          }
-        } else {
-          el.style.cursor = 'default';
-          clearCursor();
-        }
-      };
-
-      const onClick = (e: MouseEvent) => {
-        if (e.button !== 0) return;
-        if ((e.target as Element).closest?.('[data-ruler-interactive]')) return;
-
-        const overPage = isOverPage(e);
-        if (!overPage && firstPtRef.current === null) return;
-        e.preventDefault();
-
-        const dp = overPage ? toDocPagePt(e) : cursorDocRef.current;
-        if (!dp) return;
-
-        setFirstPt(prev => {
-          if (!prev) { firstPtRef.current = dp; return dp; }
-          firstPtRef.current = null;
-          const id = `ruler-${++idCounter.current}`;
-          setMeasurements(m => [...m, { id, start: prev, end: dp }]);
-          return null;
-        });
-      };
-
-      const onLeave = () => {
-        el.style.cursor = '';
-        if (firstPtRef.current === null) clearCursor();
-      };
-      const onKey = (e: KeyboardEvent) => {
-        if (e.key === 'Escape') { setFirstPt(null); setCursorS(null); setCursorDoc(null); }
-      };
-
-      el.addEventListener('mousemove', onMove);
-      el.addEventListener('click', onClick);
-      el.addEventListener('mouseleave', onLeave);
-      document.addEventListener('keydown', onKey);
+    if (!tryAttach()) {
+      const timer = setTimeout(() => tryAttach(), 600);
       return () => {
-        el.removeEventListener('mousemove', onMove);
-        el.removeEventListener('click', onClick);
-        el.removeEventListener('mouseleave', onLeave);
-        document.removeEventListener('keydown', onKey);
-        el.style.cursor = '';
+        clearTimeout(timer);
+        scrollCleanupRef.current?.();
       };
-    }, [containerRef, isActive]);
+    }
+    return () => scrollCleanupRef.current?.();
+  }, [containerRef, attachScrollEl]);
 
-    const deleteMeasurement = useCallback((id: string) => {
-      setMeasurements(prev => prev.filter(m => m.id !== id));
-    }, []);
+  // Re-find scroll element when zoom changes (PDF.js may recreate the scroll DOM).
+  useEffect(() => {
+    const container = containerRef.current;
+    if (!container) return;
+    const el = findScrollEl(container);
+    if (el && el !== scrollElRef.current) attachScrollEl(el);
+  }, [zoom, containerRef, attachScrollEl]);
 
-    if (!isActive && measurements.length === 0) return null;
+  // ── Imperative handle ──────────────────────────────────────────────────────
+  React.useImperativeHandle(ref, () => ({
+    clearAll: () => {
+      setMeasurements([]);
+      setFirstPt(null);
+      setCursorS(null);
+      setCursorDoc(null);
+    },
+  }));
+
+  // ── Reset when deactivated ─────────────────────────────────────────────────
+  useEffect(() => {
+    if (!isActive) {
+      setFirstPt(null);
+      setCursorS(null);
+      setCursorDoc(null);
+    }
+  }, [isActive]);
+
+  // ── Mouse events ───────────────────────────────────────────────────────────
+  useEffect(() => {
+    const el = containerRef.current;
+    if (!isActive || !el) return;
+
+    const toScreenPt = (e: MouseEvent): Point => {
+      const r = el.getBoundingClientRect();
+      return { x: e.clientX - r.left, y: e.clientY - r.top };
+    };
 
-    // ── PagePoint → SVG screen coordinates ────────────────────────────────────
     /**
-     * Convert a page-anchored point to SVG screen coordinates.
-     *
-     * Uses getBoundingClientRect so the browser computes the exact screen position
-     * accounting for scroll, zoom, page margins, centering — everything. This is
-     * why we no longer need to track scroll offsets.
-     *
-     * Returns null if the page element isn't in the DOM (shouldn't happen with
-     * PDF.js placeholder divs, but guard anyway).
+     * Convert a mouse event to a page-relative PagePoint.
+     * Returns null if the cursor is not directly over a page element.
      */
-    const pagePointToScreen = (pt: PagePoint): Point | null => {
-      const container = containerRef.current;
-      if (!container) return null;
-      const pageEl = container.querySelector(`[data-page-index="${pt.pageIndex}"]`) as HTMLElement | null;
+    const toDocPagePt = (e: MouseEvent): PagePoint | null => {
+      const pageEl = (e.target as Element).closest?.(
+        "[data-page-index]",
+      ) as HTMLElement | null;
       if (!pageEl) return null;
-      const pageRect = pageEl.getBoundingClientRect();
-      const containerRect = container.getBoundingClientRect();
+      const pageIndex = parseInt(pageEl.dataset.pageIndex ?? "0", 10);
+      const r = pageEl.getBoundingClientRect();
+      const z = zoomRef.current;
       return {
-        x: pageRect.left - containerRect.left + pt.x * zoom,
-        y: pageRect.top  - containerRect.top  + pt.y * zoom,
+        pageIndex,
+        x: (e.clientX - r.left) / z,
+        y: (e.clientY - r.top) / z,
       };
     };
 
-    const firstPtS = firstPt ? pagePointToScreen(firstPt) : null;
+    const clearCursor = () => {
+      setCursorS(null);
+      setCursorDoc(null);
+      cursorDocRef.current = null;
+    };
 
-    return (
-      <svg
-        style={{
-          position: 'absolute',
-          top: 0,
-          left: 0,
-          width: '100%',
-          height: '100%',
-          pointerEvents: 'none',
-          overflow: 'visible',
-          zIndex: 100,
-        }}
-      >
-        <defs>
-          <filter id="ruler-shadow" x="-20%" y="-50%" width="140%" height="200%">
-            <feDropShadow dx="0" dy="1" stdDeviation="2" floodColor="rgba(0,0,0,0.22)" />
-          </filter>
-        </defs>
+    const onMove = (e: MouseEvent) => {
+      const screenPt = toScreenPt(e);
 
-        {/* Completed measurements */}
-        {measurements.map(m => {
-          const startS = pagePointToScreen(m.start);
-          const endS   = pagePointToScreen(m.end);
-          if (!startS || !endS) return null;
-          const mScale = pageMeasureScales ? pickScale(m.start, m.end, pageMeasureScales) : null;
-          return (
-            <MeasurementLine
-              key={m.id}
-              id={m.id}
-              startS={startS}
-              endS={endS}
-              distPts={dist(startS, endS) / zoom}
-              hovered={hoveredId === m.id}
-              onDelete={deleteMeasurement}
-              onHover={setHoveredId}
-              measureScale={mScale}
-            />
-          );
-        })}
+      if (isOverPage(e)) {
+        el.style.cursor = "crosshair";
+        const docPt = toDocPagePt(e);
+        setCursorS(screenPt);
+        setCursorDoc(docPt);
+        cursorDocRef.current = docPt;
+      } else if (firstPtRef.current !== null) {
+        // First point placed, cursor wandered off page — clamp to nearest edge
+        el.style.cursor = "crosshair";
+        const result = nearestPageDocPt(screenPt, el, zoomRef.current);
+        if (result) {
+          setCursorS(result.screenPt);
+          setCursorDoc(result.docPt);
+          cursorDocRef.current = result.docPt;
+        }
+      } else {
+        el.style.cursor = "default";
+        clearCursor();
+      }
+    };
 
-        {/* Live line while drawing */}
-        {isActive && firstPtS && cursorS && (
-          <LiveLine
-            startS={firstPtS} endS={cursorS} zoom={zoom}
-            measureScale={pageMeasureScales && firstPt && cursorDoc
-              ? pickScale(firstPt, cursorDoc, pageMeasureScales)
-              : null}
+    const onClick = (e: MouseEvent) => {
+      if (e.button !== 0) return;
+      if ((e.target as Element).closest?.("[data-ruler-interactive]")) return;
+
+      const overPage = isOverPage(e);
+      if (!overPage && firstPtRef.current === null) return;
+      e.preventDefault();
+
+      const dp = overPage ? toDocPagePt(e) : cursorDocRef.current;
+      if (!dp) return;
+
+      setFirstPt((prev) => {
+        if (!prev) {
+          firstPtRef.current = dp;
+          return dp;
+        }
+        firstPtRef.current = null;
+        const id = `ruler-${++idCounter.current}`;
+        setMeasurements((m) => [...m, { id, start: prev, end: dp }]);
+        return null;
+      });
+    };
+
+    const onLeave = () => {
+      el.style.cursor = "";
+      if (firstPtRef.current === null) clearCursor();
+    };
+    const onKey = (e: KeyboardEvent) => {
+      if (e.key === "Escape") {
+        setFirstPt(null);
+        setCursorS(null);
+        setCursorDoc(null);
+      }
+    };
+
+    el.addEventListener("mousemove", onMove);
+    el.addEventListener("click", onClick);
+    el.addEventListener("mouseleave", onLeave);
+    document.addEventListener("keydown", onKey);
+    return () => {
+      el.removeEventListener("mousemove", onMove);
+      el.removeEventListener("click", onClick);
+      el.removeEventListener("mouseleave", onLeave);
+      document.removeEventListener("keydown", onKey);
+      el.style.cursor = "";
+    };
+  }, [containerRef, isActive]);
+
+  const deleteMeasurement = useCallback((id: string) => {
+    setMeasurements((prev) => prev.filter((m) => m.id !== id));
+  }, []);
+
+  if (!isActive && measurements.length === 0) return null;
+
+  // ── PagePoint → SVG screen coordinates ────────────────────────────────────
+  /**
+   * Convert a page-anchored point to SVG screen coordinates.
+   *
+   * Uses getBoundingClientRect so the browser computes the exact screen position
+   * accounting for scroll, zoom, page margins, centering — everything. This is
+   * why we no longer need to track scroll offsets.
+   *
+   * Returns null if the page element isn't in the DOM (shouldn't happen with
+   * PDF.js placeholder divs, but guard anyway).
+   */
+  const pagePointToScreen = (pt: PagePoint): Point | null => {
+    const container = containerRef.current;
+    if (!container) return null;
+    const pageEl = container.querySelector(
+      `[data-page-index="${pt.pageIndex}"]`,
+    ) as HTMLElement | null;
+    if (!pageEl) return null;
+    const pageRect = pageEl.getBoundingClientRect();
+    const containerRect = container.getBoundingClientRect();
+    return {
+      x: pageRect.left - containerRect.left + pt.x * zoom,
+      y: pageRect.top - containerRect.top + pt.y * zoom,
+    };
+  };
+
+  const firstPtS = firstPt ? pagePointToScreen(firstPt) : null;
+
+  return (
+    <svg
+      style={{
+        position: "absolute",
+        top: 0,
+        left: 0,
+        width: "100%",
+        height: "100%",
+        pointerEvents: "none",
+        overflow: "visible",
+        zIndex: 100,
+      }}
+    >
+      <defs>
+        <filter id="ruler-shadow" x="-20%" y="-50%" width="140%" height="200%">
+          <feDropShadow
+            dx="0"
+            dy="1"
+            stdDeviation="2"
+            floodColor="rgba(0,0,0,0.22)"
           />
-        )}
+        </filter>
+      </defs>
 
-        {/* First-point anchor dot */}
-        {isActive && firstPtS && (
-          <circle cx={firstPtS.x} cy={firstPtS.y} r={DOT_R} fill="#1e88e5" stroke="white" strokeWidth={2} />
-        )}
+      {/* Completed measurements */}
+      {measurements.map((m) => {
+        const startS = pagePointToScreen(m.start);
+        const endS = pagePointToScreen(m.end);
+        if (!startS || !endS) return null;
+        const mScale = pageMeasureScales
+          ? pickScale(m.start, m.end, pageMeasureScales)
+          : null;
+        return (
+          <MeasurementLine
+            key={m.id}
+            id={m.id}
+            startS={startS}
+            endS={endS}
+            distPts={dist(startS, endS) / zoom}
+            hovered={hoveredId === m.id}
+            onDelete={deleteMeasurement}
+            onHover={setHoveredId}
+            measureScale={mScale}
+          />
+        );
+      })}
 
-        {/* Crosshair */}
-        {isActive && cursorS && (
-          <g opacity={0.75}>
-            <line x1={cursorS.x - 12} y1={cursorS.y} x2={cursorS.x + 12} y2={cursorS.y} stroke="#1e88e5" strokeWidth={1.5} />
-            <line x1={cursorS.x} y1={cursorS.y - 12} x2={cursorS.x} y2={cursorS.y + 12} stroke="#1e88e5" strokeWidth={1.5} />
-            <circle cx={cursorS.x} cy={cursorS.y} r={2} fill="#1e88e5" />
-          </g>
-        )}
+      {/* Live line while drawing */}
+      {isActive && firstPtS && cursorS && (
+        <LiveLine
+          startS={firstPtS}
+          endS={cursorS}
+          zoom={zoom}
+          measureScale={
+            pageMeasureScales && firstPt && cursorDoc
+              ? pickScale(firstPt, cursorDoc, pageMeasureScales)
+              : null
+          }
+        />
+      )}
 
-        {/* Clear all */}
-        {measurements.length > 0 && (
-          <g data-ruler-interactive="true" style={{ pointerEvents: 'all', cursor: 'pointer' }}
-            onClick={(e) => { e.stopPropagation(); setMeasurements([]); }}>
-            <rect x={8} y={8} width={88} height={26} rx={5}
-              fill="rgba(239,83,80,0.9)" stroke="white" strokeWidth={1} />
-            <text x={52} y={25} textAnchor="middle" fill="white" fontSize={12}
-              fontFamily="sans-serif" fontWeight={600} style={{ userSelect: 'none' }}>
-              Clear all
-            </text>
-          </g>
-        )}
-      </svg>
-    );
-  }
-);
+      {/* First-point anchor dot */}
+      {isActive && firstPtS && (
+        <circle
+          cx={firstPtS.x}
+          cy={firstPtS.y}
+          r={DOT_R}
+          fill="#1e88e5"
+          stroke="white"
+          strokeWidth={2}
+        />
+      )}
 
-RulerOverlay.displayName = 'RulerOverlay';
+      {/* Crosshair */}
+      {isActive && cursorS && (
+        <g opacity={0.75}>
+          <line
+            x1={cursorS.x - 12}
+            y1={cursorS.y}
+            x2={cursorS.x + 12}
+            y2={cursorS.y}
+            stroke="#1e88e5"
+            strokeWidth={1.5}
+          />
+          <line
+            x1={cursorS.x}
+            y1={cursorS.y - 12}
+            x2={cursorS.x}
+            y2={cursorS.y + 12}
+            stroke="#1e88e5"
+            strokeWidth={1.5}
+          />
+          <circle cx={cursorS.x} cy={cursorS.y} r={2} fill="#1e88e5" />
+        </g>
+      )}
+
+      {/* Clear all */}
+      {measurements.length > 0 && (
+        <g
+          data-ruler-interactive="true"
+          style={{ pointerEvents: "all", cursor: "pointer" }}
+          onClick={(e) => {
+            e.stopPropagation();
+            setMeasurements([]);
+          }}
+        >
+          <rect
+            x={8}
+            y={8}
+            width={88}
+            height={26}
+            rx={5}
+            fill="rgba(239,83,80,0.9)"
+            stroke="white"
+            strokeWidth={1}
+          />
+          <text
+            x={52}
+            y={25}
+            textAnchor="middle"
+            fill="white"
+            fontSize={12}
+            fontFamily="sans-serif"
+            fontWeight={600}
+            style={{ userSelect: "none" }}
+          >
+            Clear all
+          </text>
+        </g>
+      )}
+    </svg>
+  );
+});
+
+RulerOverlay.displayName = "RulerOverlay";
diff --git a/frontend/src/core/components/viewer/ScrollAPIBridge.tsx b/frontend/src/core/components/viewer/ScrollAPIBridge.tsx
index 9e1add3d6a..a3e497835f 100644
--- a/frontend/src/core/components/viewer/ScrollAPIBridge.tsx
+++ b/frontend/src/core/components/viewer/ScrollAPIBridge.tsx
@@ -1,8 +1,8 @@
-import { useEffect, useRef } from 'react';
-import { useScroll } from '@embedpdf/plugin-scroll/react';
-import { useViewer } from '@app/contexts/ViewerContext';
-import { useActiveDocumentId } from '@app/components/viewer/useActiveDocumentId';
-import { useDocumentReady } from '@app/components/viewer/hooks/useDocumentReady';
+import { useEffect, useRef } from "react";
+import { useScroll } from "@embedpdf/plugin-scroll/react";
+import { useViewer } from "@app/contexts/ViewerContext";
+import { useActiveDocumentId } from "@app/components/viewer/useActiveDocumentId";
+import { useDocumentReady } from "@app/components/viewer/hooks/useDocumentReady";
 
 /**
  * Connects the PDF scroll plugin to the shared ViewerContext.
@@ -35,7 +35,11 @@ function ScrollAPIBridgeInner({ documentId }: { documentId: string }) {
 
   useEffect(() => {
     const currentScroll = scrollRef.current;
-    if (currentScroll && currentPage !== undefined && totalPages !== undefined) {
+    if (
+      currentScroll &&
+      currentPage !== undefined &&
+      totalPages !== undefined
+    ) {
       const newState = {
         currentPage,
         totalPages,
@@ -44,14 +48,14 @@ function ScrollAPIBridgeInner({ documentId }: { documentId: string }) {
       // Trigger immediate update for responsive UI
       triggerImmediateScrollUpdate(newState.currentPage, newState.totalPages);
 
-      registerBridge('scroll', {
+      registerBridge("scroll", {
         state: newState,
-        api: currentScroll
+        api: currentScroll,
       });
     }
 
     return () => {
-      registerBridge('scroll', null);
+      registerBridge("scroll", null);
     };
   }, [currentPage, totalPages, registerBridge, triggerImmediateScrollUpdate]);
 
diff --git a/frontend/src/core/components/viewer/SearchAPIBridge.tsx b/frontend/src/core/components/viewer/SearchAPIBridge.tsx
index af06221b7a..5c62692a7c 100644
--- a/frontend/src/core/components/viewer/SearchAPIBridge.tsx
+++ b/frontend/src/core/components/viewer/SearchAPIBridge.tsx
@@ -1,8 +1,8 @@
-import { useEffect, useState, useRef } from 'react';
-import { useSearch } from '@embedpdf/plugin-search/react';
-import { useViewer } from '@app/contexts/ViewerContext';
-import { useActiveDocumentId } from '@app/components/viewer/useActiveDocumentId';
-import { useDocumentReady } from '@app/components/viewer/hooks/useDocumentReady';
+import { useEffect, useState, useRef } from "react";
+import { useSearch } from "@embedpdf/plugin-search/react";
+import { useViewer } from "@app/contexts/ViewerContext";
+import { useActiveDocumentId } from "@app/components/viewer/useActiveDocumentId";
+import { useDocumentReady } from "@app/components/viewer/hooks/useDocumentReady";
 
 interface SearchResult {
   pageIndex: number;
@@ -43,7 +43,7 @@ function SearchAPIBridgeInner({ documentId }: { documentId: string }) {
 
   const [localState, setLocalState] = useState({
     results: null as SearchResult[] | null,
-    activeIndex: 0
+    activeIndex: 0,
   });
 
   // Subscribe to search result changes from EmbedPDF
@@ -58,22 +58,26 @@ function SearchAPIBridgeInner({ documentId }: { documentId: string }) {
 
     if (!search) return;
 
-    subscriptionRef.current = search.onSearchResultStateChange?.((state: any) => {
-      if (!state) return;
+    subscriptionRef.current =
+      search.onSearchResultStateChange?.((state: any) => {
+        if (!state) return;
 
-      const newState = {
-        results: state.results || null,
-        activeIndex: (state.activeResultIndex || 0) + 1 // Convert to 1-based index
-      };
+        const newState = {
+          results: state.results || null,
+          activeIndex: (state.activeResultIndex || 0) + 1, // Convert to 1-based index
+        };
 
-      setLocalState(prevState => {
-        // Only update if state actually changed
-        if (prevState.results !== newState.results || prevState.activeIndex !== newState.activeIndex) {
-          return newState;
-        }
-        return prevState;
-      });
-    }) ?? null;
+        setLocalState((prevState) => {
+          // Only update if state actually changed
+          if (
+            prevState.results !== newState.results ||
+            prevState.activeIndex !== newState.activeIndex
+          ) {
+            return newState;
+          }
+          return prevState;
+        });
+      }) ?? null;
 
     return () => {
       if (subscriptionRef.current) {
@@ -96,9 +100,11 @@ function SearchAPIBridgeInner({ documentId }: { documentId: string }) {
 
     // Only scroll if the active index actually changed
     const activeResultIndex = localActiveIndex - 1; // Convert back to 0-based
-    if (activeResultIndex >= 0 &&
-        activeResultIndex < localResults.length &&
-        lastScrolledIndexRef.current !== activeResultIndex) {
+    if (
+      activeResultIndex >= 0 &&
+      activeResultIndex < localResults.length &&
+      lastScrolledIndexRef.current !== activeResultIndex
+    ) {
       const activeResult = localResults[activeResultIndex];
       if (activeResult) {
         const pageNumber = activeResult.pageIndex + 1; // Convert to 1-based page number
@@ -112,7 +118,7 @@ function SearchAPIBridgeInner({ documentId }: { documentId: string }) {
   useEffect(() => {
     const currentSearch = searchRef.current;
     if (currentSearch) {
-      registerBridge('search', {
+      registerBridge("search", {
         state: { results: localResults, activeIndex: localActiveIndex },
         api: {
           search: async (query: string) => {
@@ -133,11 +139,14 @@ function SearchAPIBridgeInner({ documentId }: { documentId: string }) {
               return results;
             } catch (error: any) {
               // Handle abort errors gracefully - these occur when searches overlap
-              if (error?.type === 'abort' || error?.message?.includes('abort')) {
+              if (
+                error?.type === "abort" ||
+                error?.message?.includes("abort")
+              ) {
                 // Silently handle abort - this is expected when user types quickly
                 return null;
               }
-              console.error('Search failed:', error);
+              console.error("Search failed:", error);
               return null;
             } finally {
               isSearchingRef.current = false;
@@ -149,7 +158,7 @@ function SearchAPIBridgeInner({ documentId }: { documentId: string }) {
                 currentSearch.stopSearch();
               }
             } catch (error) {
-              console.warn('Error stopping search:', error);
+              console.warn("Error stopping search:", error);
             }
             setLocalState({ results: null, activeIndex: 0 });
           },
@@ -157,29 +166,29 @@ function SearchAPIBridgeInner({ documentId }: { documentId: string }) {
             try {
               currentSearch?.nextResult?.();
             } catch (error) {
-              console.warn('Error navigating to next result:', error);
+              console.warn("Error navigating to next result:", error);
             }
           },
           previous: () => {
             try {
               currentSearch?.previousResult?.();
             } catch (error) {
-              console.warn('Error navigating to previous result:', error);
+              console.warn("Error navigating to previous result:", error);
             }
           },
           goToResult: (index: number) => {
             try {
               currentSearch?.goToResult?.(index);
             } catch (error) {
-              console.warn('Error going to result:', error);
+              console.warn("Error going to result:", error);
             }
           },
-        }
+        },
       });
     }
 
     return () => {
-      registerBridge('search', null);
+      registerBridge("search", null);
     };
   }, [localResults, localActiveIndex, registerBridge]);
 
diff --git a/frontend/src/core/components/viewer/SearchInterface.tsx b/frontend/src/core/components/viewer/SearchInterface.tsx
index eefac81544..d2e157cf34 100644
--- a/frontend/src/core/components/viewer/SearchInterface.tsx
+++ b/frontend/src/core/components/viewer/SearchInterface.tsx
@@ -1,8 +1,8 @@
-import React, { useState, useEffect, useRef } from 'react';
-import { Box, TextInput, ActionIcon, Text, Group } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { LocalIcon } from '@app/components/shared/LocalIcon';
-import { ViewerContext } from '@app/contexts/ViewerContext';
+import React, { useState, useEffect, useRef } from "react";
+import { Box, TextInput, ActionIcon, Text, Group } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import { LocalIcon } from "@app/components/shared/LocalIcon";
+import { ViewerContext } from "@app/contexts/ViewerContext";
 
 interface SearchInterfaceProps {
   visible: boolean;
@@ -19,8 +19,8 @@ export function SearchInterface({ visible, onClose }: SearchInterfaceProps) {
   const searchResults = searchState?.results;
   const searchActiveIndex = searchState?.activeIndex;
   const searchActions = viewerContext?.searchActions;
-  const [searchQuery, setSearchQuery] = useState('');
-  const [jumpToValue, setJumpToValue] = useState('');
+  const [searchQuery, setSearchQuery] = useState("");
+  const [jumpToValue, setJumpToValue] = useState("");
   const [resultInfo, setResultInfo] = useState<{
     currentIndex: number;
     totalResults: number;
@@ -42,9 +42,9 @@ export function SearchInterface({ visible, onClose }: SearchInterfaceProps) {
       inputRef.current?.select();
     };
 
-    window.addEventListener('refocus-search-input', handleRefocus);
+    window.addEventListener("refocus-search-input", handleRefocus);
     return () => {
-      window.removeEventListener('refocus-search-input', handleRefocus);
+      window.removeEventListener("refocus-search-input", handleRefocus);
     };
   }, []);
 
@@ -69,7 +69,7 @@ export function SearchInterface({ visible, onClose }: SearchInterfaceProps) {
         try {
           await searchActions.search(searchQuery.trim());
         } catch (error) {
-          console.error('Search failed:', error);
+          console.error("Search failed:", error);
         } finally {
           setIsSearching(false);
         }
@@ -95,14 +95,14 @@ export function SearchInterface({ visible, onClose }: SearchInterfaceProps) {
         setResultInfo({
           currentIndex: activeIndex,
           totalResults: searchResults.length,
-          query: searchQuery // Use local search query
+          query: searchQuery, // Use local search query
         });
       } else if (searchQuery && searchResults?.length === 0) {
         // Show "no results" state
         setResultInfo({
           currentIndex: 0,
           totalResults: 0,
-          query: searchQuery
+          query: searchQuery,
         });
       } else {
         setResultInfo(null);
@@ -117,17 +117,17 @@ export function SearchInterface({ visible, onClose }: SearchInterfaceProps) {
   }, [visible, searchResults, searchActiveIndex, searchQuery]);
 
   const handleKeyDown = (event: React.KeyboardEvent<HTMLInputElement>) => {
-    if (event.key === 'Enter') {
+    if (event.key === "Enter") {
       // Navigate to next result on Enter
       event.preventDefault();
       handleNext();
-    } else if (event.key === 'Escape') {
+    } else if (event.key === "Escape") {
       onClose();
-    } else if (event.key === 'ArrowDown') {
+    } else if (event.key === "ArrowDown") {
       // Navigate to next result
       event.preventDefault();
       handleNext();
-    } else if (event.key === 'ArrowUp') {
+    } else if (event.key === "ArrowUp") {
       // Navigate to previous result
       event.preventDefault();
       handlePrevious();
@@ -144,7 +144,7 @@ export function SearchInterface({ visible, onClose }: SearchInterfaceProps) {
 
   const handleClearSearch = () => {
     searchActions?.clear();
-    setSearchQuery('');
+    setSearchQuery("");
     setResultInfo(null);
   };
 
@@ -159,14 +159,19 @@ export function SearchInterface({ visible, onClose }: SearchInterfaceProps) {
 
   const handleJumpToSubmit = () => {
     const index = parseInt(jumpToValue, 10);
-    if (!isNaN(index) && resultInfo && index >= 1 && index <= resultInfo.totalResults) {
+    if (
+      !isNaN(index) &&
+      resultInfo &&
+      index >= 1 &&
+      index <= resultInfo.totalResults
+    ) {
       handleJumpToResult(index);
-      setJumpToValue(''); // Clear the input after jumping
+      setJumpToValue(""); // Clear the input after jumping
     }
   };
 
   const handleJumpToKeyDown = (e: React.KeyboardEvent) => {
-    if (e.key === 'Enter') {
+    if (e.key === "Enter") {
       handleJumpToSubmit();
     }
   };
@@ -183,17 +188,16 @@ export function SearchInterface({ visible, onClose }: SearchInterfaceProps) {
     onClose();
   };
 
-
   return (
     <Box
       style={{
-        padding: '0px'
+        padding: "0px",
       }}
     >
       {/* Header with close button */}
       <Group mb="md" justify="space-between">
         <Text size="sm" fw={600}>
-          {t('search.title', 'Search PDF')}
+          {t("search.title", "Search PDF")}
         </Text>
         <ActionIcon
           variant="subtle"
@@ -209,7 +213,7 @@ export function SearchInterface({ visible, onClose }: SearchInterfaceProps) {
       <Group mb="md">
         <TextInput
           ref={inputRef}
-          placeholder={t('search.placeholder', 'Enter search term...')}
+          placeholder={t("search.placeholder", "Enter search term...")}
           value={searchQuery}
           onChange={(e) => {
             const newValue = e.currentTarget.value;
@@ -244,14 +248,19 @@ export function SearchInterface({ visible, onClose }: SearchInterfaceProps) {
 
               // Jump immediately as user types
               const index = parseInt(newValue, 10);
-              if (resultInfo && !isNaN(index) && index >= 1 && index <= resultInfo.totalResults) {
+              if (
+                resultInfo &&
+                !isNaN(index) &&
+                index >= 1 &&
+                index <= resultInfo.totalResults
+              ) {
                 handleJumpToResult(index);
               }
             }}
             onKeyDown={handleJumpToKeyDown}
-            onBlur={() => setJumpToValue('')} // Clear on blur instead of submit
+            onBlur={() => setJumpToValue("")} // Clear on blur instead of submit
             placeholder={(resultInfo?.currentIndex || 0).toString()}
-            style={{ width: '3rem' }}
+            style={{ width: "3rem" }}
             type="number"
             min="1"
             max={resultInfo?.totalResults || 0}
@@ -276,7 +285,9 @@ export function SearchInterface({ visible, onClose }: SearchInterfaceProps) {
             variant="subtle"
             size="sm"
             onClick={handleNext}
-            disabled={!resultInfo || resultInfo.currentIndex >= resultInfo.totalResults}
+            disabled={
+              !resultInfo || resultInfo.currentIndex >= resultInfo.totalResults
+            }
             aria-label="Next result"
           >
             <LocalIcon icon="keyboard-arrow-down" width="1rem" height="1rem" />
@@ -287,9 +298,9 @@ export function SearchInterface({ visible, onClose }: SearchInterfaceProps) {
       {/* Loading state */}
       {isSearching && (
         <Text size="xs" c="dimmed" ta="center" mt="sm">
-          {t('search.searching', 'Searching...')}
+          {t("search.searching", "Searching...")}
         </Text>
       )}
     </Box>
   );
-}
\ No newline at end of file
+}
diff --git a/frontend/src/core/components/viewer/SelectionAPIBridge.tsx b/frontend/src/core/components/viewer/SelectionAPIBridge.tsx
index 78eff1d1ae..ced28e3417 100644
--- a/frontend/src/core/components/viewer/SelectionAPIBridge.tsx
+++ b/frontend/src/core/components/viewer/SelectionAPIBridge.tsx
@@ -1,7 +1,7 @@
-import { useEffect, useRef } from 'react';
-import { useSelectionCapability } from '@embedpdf/plugin-selection/react';
-import { useViewer } from '@app/contexts/ViewerContext';
-import { useDocumentReady } from '@app/components/viewer/hooks/useDocumentReady';
+import { useEffect, useRef } from "react";
+import { useSelectionCapability } from "@embedpdf/plugin-selection/react";
+import { useViewer } from "@app/contexts/ViewerContext";
+import { useDocumentReady } from "@app/components/viewer/hooks/useDocumentReady";
 
 /**
  * Connects the PDF selection plugin to the shared ViewerContext.
@@ -11,9 +11,8 @@ export function SelectionAPIBridge() {
   const { registerBridge } = useViewer();
   const documentReady = useDocumentReady();
 
-
   const hasSelectionRef = useRef(false);
-  const selectedTextRef = useRef('');
+  const selectedTextRef = useRef("");
 
   useEffect(() => {
     if (!selection || !documentReady) return;
@@ -24,56 +23,75 @@ export function SelectionAPIBridge() {
       getFormattedSelection: () => selection.getFormattedSelection(),
     });
 
-    registerBridge('selection', { state: { hasSelection: false }, api: buildApi() });
+    registerBridge("selection", {
+      state: { hasSelection: false },
+      api: buildApi(),
+    });
 
     const unsubChange = selection.onSelectionChange((event: any) => {
       const hasText = !!event?.selection;
       hasSelectionRef.current = hasText;
 
-      registerBridge('selection', { state: { hasSelection: hasText }, api: buildApi() });
+      registerBridge("selection", {
+        state: { hasSelection: hasText },
+        api: buildApi(),
+      });
 
       if (hasText) {
         try {
           const result = selection.getSelectedText();
-          result?.wait?.((texts: string[]) => {
-            selectedTextRef.current = texts.join('\n');
-          }, () => { /* ignore errors */ });
+          result?.wait?.(
+            (texts: string[]) => {
+              selectedTextRef.current = texts.join("\n");
+            },
+            () => {
+              /* ignore errors */
+            },
+          );
         } catch {
           // Engine access failed
         }
       } else {
-        selectedTextRef.current = '';
+        selectedTextRef.current = "";
       }
     });
 
     // Fallback: subscribe to the plugin's copy event for navigator.clipboard writes
-    const unsubCopy = selection.onCopyToClipboard(({ text }: { text: string }) => {
-      if (text) {
-        navigator.clipboard.writeText(text).catch(() => { /* ignore */ });
-      }
-    });
+    const unsubCopy = selection.onCopyToClipboard(
+      ({ text }: { text: string }) => {
+        if (text) {
+          navigator.clipboard.writeText(text).catch(() => {
+            /* ignore */
+          });
+        }
+      },
+    );
 
     const handleCopy = (event: ClipboardEvent) => {
       if (!hasSelectionRef.current || !selectedTextRef.current) return;
-      event.clipboardData?.setData('text/plain', selectedTextRef.current);
+      event.clipboardData?.setData("text/plain", selectedTextRef.current);
       event.preventDefault();
     };
 
     const handleKeyDown = (event: KeyboardEvent) => {
-      if ((event.ctrlKey || event.metaKey) && event.key === 'c' && hasSelectionRef.current) {
+      if (
+        (event.ctrlKey || event.metaKey) &&
+        event.key === "c" &&
+        hasSelectionRef.current
+      ) {
         selection.copyToClipboard();
       }
     };
 
-    document.addEventListener('copy', handleCopy);
-    document.addEventListener('keydown', handleKeyDown);
+    document.addEventListener("copy", handleCopy);
+    document.addEventListener("keydown", handleKeyDown);
 
     return () => {
       unsubChange?.();
       unsubCopy?.();
-      document.removeEventListener('copy', handleCopy);
-      document.removeEventListener('keydown', handleKeyDown);
-      registerBridge('selection', null);
+      document.removeEventListener("copy", handleCopy);
+      document.removeEventListener("keydown", handleKeyDown);
+      registerBridge("selection", null);
     };
   }, [selection, documentReady, registerBridge]);
 
diff --git a/frontend/src/core/components/viewer/SidebarBase.css b/frontend/src/core/components/viewer/SidebarBase.css
index 7eef71965c..058796038d 100644
--- a/frontend/src/core/components/viewer/SidebarBase.css
+++ b/frontend/src/core/components/viewer/SidebarBase.css
@@ -9,8 +9,14 @@
     color-mix(in srgb, var(--bg-toolbar) 96%, transparent),
     color-mix(in srgb, var(--bg-background) 90%, transparent)
   );
-  border-left: 1px solid color-mix(in srgb, var(--border-subtle) 75%, transparent);
-  box-shadow: -2px 0 16px color-mix(in srgb, var(--shadow-color, rgba(15, 23, 42, 0.35)) 20%, transparent);
+  border-left: 1px solid
+    color-mix(in srgb, var(--border-subtle) 75%, transparent);
+  box-shadow: -2px 0 16px
+    color-mix(
+      in srgb,
+      var(--shadow-color, rgba(15, 23, 42, 0.35)) 20%,
+      transparent
+    );
   backdrop-filter: blur(12px);
 }
 
@@ -41,7 +47,8 @@
 /* Search Section (used by bookmark & attachment sidebars) */
 .sidebar-base__search {
   background: var(--tool-panel-search-bg, var(--bg-toolbar));
-  border-bottom: 1px solid var(--tool-panel-search-border-bottom, var(--border-subtle));
+  border-bottom: 1px solid
+    var(--tool-panel-search-border-bottom, var(--border-subtle));
   padding-top: 0.75rem !important;
 }
 
diff --git a/frontend/src/core/components/viewer/SignatureAPIBridge.tsx b/frontend/src/core/components/viewer/SignatureAPIBridge.tsx
index 1aac54bd0a..b585eb8d31 100644
--- a/frontend/src/core/components/viewer/SignatureAPIBridge.tsx
+++ b/frontend/src/core/components/viewer/SignatureAPIBridge.tsx
@@ -1,11 +1,21 @@
-import { useImperativeHandle, forwardRef, useEffect, useCallback, useRef, useState } from 'react';
-import { useAnnotationCapability } from '@embedpdf/plugin-annotation/react';
-import { PdfAnnotationSubtype, uuidV4 } from '@embedpdf/models';
-import { useSignature } from '@app/contexts/SignatureContext';
-import type { SignatureAPI, AnnotationRect } from '@app/components/viewer/viewerTypes';
-import type { SignParameters } from '@app/hooks/tools/sign/useSignParameters';
-import { useViewer } from '@app/contexts/ViewerContext';
-import { useDocumentReady } from '@app/components/viewer/hooks/useDocumentReady';
+import {
+  useImperativeHandle,
+  forwardRef,
+  useEffect,
+  useCallback,
+  useRef,
+  useState,
+} from "react";
+import { useAnnotationCapability } from "@embedpdf/plugin-annotation/react";
+import { PdfAnnotationSubtype, uuidV4 } from "@embedpdf/models";
+import { useSignature } from "@app/contexts/SignatureContext";
+import type {
+  SignatureAPI,
+  AnnotationRect,
+} from "@app/components/viewer/viewerTypes";
+import type { SignParameters } from "@app/hooks/tools/sign/useSignParameters";
+import { useViewer } from "@app/contexts/ViewerContext";
+import { useDocumentReady } from "@app/components/viewer/hooks/useDocumentReady";
 
 /**
  * Connects the PDF signature (stamp/ink) tools to the shared ViewerContext and SignatureContext.
@@ -19,19 +29,23 @@ const MIN_SIGNATURE_DIMENSION = 12;
 // This provides a good balance between visual fidelity and performance/memory usage.
 const TEXT_OVERSAMPLE_FACTOR = 2;
 
-const extractDataUrl = (value: unknown, depth = 0, visited: Set<unknown> = new Set()): string | undefined => {
+const extractDataUrl = (
+  value: unknown,
+  depth = 0,
+  visited: Set<unknown> = new Set(),
+): string | undefined => {
   if (!value || depth > 6) return undefined;
 
   // Prevent circular references
-  if (typeof value === 'object' && visited.has(value)) {
+  if (typeof value === "object" && visited.has(value)) {
     return undefined;
   }
 
-  if (typeof value === 'string') {
-    return value.startsWith('data:image') ? value : undefined;
+  if (typeof value === "string") {
+    return value.startsWith("data:image") ? value : undefined;
   }
 
-  if (typeof value === 'object') {
+  if (typeof value === "object") {
     visited.add(value);
 
     if (Array.isArray(value)) {
@@ -41,7 +55,11 @@ const extractDataUrl = (value: unknown, depth = 0, visited: Set<unknown> = new S
       }
     } else {
       for (const key of Object.keys(value as Record<string, unknown>)) {
-        const result = extractDataUrl((value as Record<string, unknown>)[key], depth + 1, visited);
+        const result = extractDataUrl(
+          (value as Record<string, unknown>)[key],
+          depth + 1,
+          visited,
+        );
         if (result) return result;
       }
     }
@@ -52,22 +70,28 @@ const extractDataUrl = (value: unknown, depth = 0, visited: Set<unknown> = new S
 
 const createTextStampImage = (
   config: SignParameters,
-  displaySize?: { width: number; height: number } | null
-): { dataUrl: string; pixelWidth: number; pixelHeight: number; displayWidth: number; displayHeight: number } | null => {
-  const text = (config.signerName ?? '').trim();
+  displaySize?: { width: number; height: number } | null,
+): {
+  dataUrl: string;
+  pixelWidth: number;
+  pixelHeight: number;
+  displayWidth: number;
+  displayHeight: number;
+} | null => {
+  const text = (config.signerName ?? "").trim();
   if (!text) {
     return null;
   }
 
   const fontSize = config.fontSize ?? 16;
-  const fontFamily = config.fontFamily ?? 'Helvetica';
-  const textColor = config.textColor ?? '#000000';
+  const fontFamily = config.fontFamily ?? "Helvetica";
+  const textColor = config.textColor ?? "#000000";
 
   const paddingX = Math.max(4, Math.round(fontSize * 0.8));
   const paddingY = Math.max(4, Math.round(fontSize * 0.6));
 
-  const measureCanvas = document.createElement('canvas');
-  const measureCtx = measureCanvas.getContext('2d');
+  const measureCanvas = document.createElement("canvas");
+  const measureCtx = measureCanvas.getContext("2d");
   if (!measureCtx) {
     return null;
   }
@@ -75,31 +99,43 @@ const createTextStampImage = (
   measureCtx.font = `${fontSize}px ${fontFamily}`;
   const metrics = measureCtx.measureText(text);
   const textWidth = Math.ceil(metrics.width);
-  const naturalWidth = Math.max(MIN_SIGNATURE_DIMENSION, textWidth + paddingX * 2);
-  const naturalHeight = Math.max(MIN_SIGNATURE_DIMENSION, Math.ceil(fontSize + paddingY * 2));
+  const naturalWidth = Math.max(
+    MIN_SIGNATURE_DIMENSION,
+    textWidth + paddingX * 2,
+  );
+  const naturalHeight = Math.max(
+    MIN_SIGNATURE_DIMENSION,
+    Math.ceil(fontSize + paddingY * 2),
+  );
 
   const scale =
     displaySize && naturalWidth > 0 && naturalHeight > 0
-      ? Math.min(displaySize.width / naturalWidth, displaySize.height / naturalHeight)
+      ? Math.min(
+          displaySize.width / naturalWidth,
+          displaySize.height / naturalHeight,
+        )
       : 1;
 
   const displayWidth = Math.max(MIN_SIGNATURE_DIMENSION, naturalWidth * scale);
-  const displayHeight = Math.max(MIN_SIGNATURE_DIMENSION, naturalHeight * scale);
+  const displayHeight = Math.max(
+    MIN_SIGNATURE_DIMENSION,
+    naturalHeight * scale,
+  );
 
   const canvasWidth = Math.max(
     MIN_SIGNATURE_DIMENSION,
-    Math.round(displayWidth * TEXT_OVERSAMPLE_FACTOR)
+    Math.round(displayWidth * TEXT_OVERSAMPLE_FACTOR),
   );
   const canvasHeight = Math.max(
     MIN_SIGNATURE_DIMENSION,
-    Math.round(displayHeight * TEXT_OVERSAMPLE_FACTOR)
+    Math.round(displayHeight * TEXT_OVERSAMPLE_FACTOR),
   );
 
-  const canvas = document.createElement('canvas');
+  const canvas = document.createElement("canvas");
   canvas.width = canvasWidth;
   canvas.height = canvasHeight;
 
-  const ctx = canvas.getContext('2d');
+  const ctx = canvas.getContext("2d");
   if (!ctx) {
     return null;
   }
@@ -109,23 +145,23 @@ const createTextStampImage = (
 
   ctx.fillStyle = textColor;
   ctx.font = `${fontSize}px ${fontFamily}`;
-  ctx.textAlign = config.textAlign || 'left';
-  ctx.textBaseline = 'middle';
+  ctx.textAlign = config.textAlign || "left";
+  ctx.textBaseline = "middle";
 
   const horizontalPadding = paddingX;
   const verticalCenter = naturalHeight / 2;
 
   let xPosition = horizontalPadding;
-  if (config.textAlign === 'center') {
+  if (config.textAlign === "center") {
     xPosition = naturalWidth / 2;
-  } else if (config.textAlign === 'right') {
+  } else if (config.textAlign === "right") {
     xPosition = naturalWidth - horizontalPadding;
   }
 
   ctx.fillText(text, xPosition, verticalCenter);
 
   return {
-    dataUrl: canvas.toDataURL('image/png'),
+    dataUrl: canvas.toDataURL("image/png"),
     pixelWidth: canvasWidth,
     pixelHeight: canvasHeight,
     displayWidth,
@@ -138,17 +174,28 @@ interface SignatureAPIBridgeProps {
   isSignMode?: boolean;
 }
 
-export const SignatureAPIBridge = forwardRef<SignatureAPI, SignatureAPIBridgeProps>(function SignatureAPIBridge({ isSignMode = false }, ref) {
+export const SignatureAPIBridge = forwardRef<
+  SignatureAPI,
+  SignatureAPIBridgeProps
+>(function SignatureAPIBridge({ isSignMode = false }, ref) {
   const { provides: annotationApi } = useAnnotationCapability();
-  const { signatureConfig, storeImageData, isPlacementMode, placementPreviewSize, setSignaturesApplied } = useSignature();
+  const {
+    signatureConfig,
+    storeImageData,
+    isPlacementMode,
+    placementPreviewSize,
+    setSignaturesApplied,
+  } = useSignature();
   const { getZoomState, registerImmediateZoomUpdate } = useViewer();
   const documentReady = useDocumentReady();
-  const [currentZoom, setCurrentZoom] = useState(() => getZoomState()?.currentZoom ?? 1);
+  const [currentZoom, setCurrentZoom] = useState(
+    () => getZoomState()?.currentZoom ?? 1,
+  );
   const lastStampImageRef = useRef<string | null>(null);
 
   useEffect(() => {
     setCurrentZoom(getZoomState()?.currentZoom ?? 1);
-    const unregister = registerImmediateZoomUpdate(percent => {
+    const unregister = registerImmediateZoomUpdate((percent) => {
       setCurrentZoom(Math.max(percent / 100, 0.01));
     });
     return () => {
@@ -173,25 +220,31 @@ export const SignatureAPIBridge = forwardRef<SignatureAPI, SignatureAPIBridgePro
         height: size.height * factor,
       };
     },
-    [currentZoom]
+    [currentZoom],
   );
 
   const applyStampDefaults = useCallback(
-    (imageSrc: string, subject: string, size?: { width: number; height: number }) => {
+    (
+      imageSrc: string,
+      subject: string,
+      size?: { width: number; height: number },
+    ) => {
       if (!annotationApi) return;
 
       annotationApi.setActiveTool(null);
-      annotationApi.setActiveTool('stamp');
+      annotationApi.setActiveTool("stamp");
       const stampTool = annotationApi.getActiveTool();
-      if (stampTool && stampTool.id === 'stamp') {
-        annotationApi.setToolDefaults('stamp', {
+      if (stampTool && stampTool.id === "stamp") {
+        annotationApi.setToolDefaults("stamp", {
           imageSrc,
           subject,
-          ...(size ? { imageSize: { width: size.width, height: size.height } } : {}),
+          ...(size
+            ? { imageSize: { width: size.width, height: size.height } }
+            : {}),
         });
       }
     },
-    [annotationApi]
+    [annotationApi],
   );
 
   const configureStampDefaults = useCallback(async () => {
@@ -200,48 +253,69 @@ export const SignatureAPIBridge = forwardRef<SignatureAPI, SignatureAPIBridgePro
     }
 
     try {
-      if (signatureConfig.signatureType === 'text' && signatureConfig.signerName) {
-        const textStamp = createTextStampImage(signatureConfig, placementPreviewSize);
+      if (
+        signatureConfig.signatureType === "text" &&
+        signatureConfig.signerName
+      ) {
+        const textStamp = createTextStampImage(
+          signatureConfig,
+          placementPreviewSize,
+        );
         if (textStamp) {
-          const displaySize =
-            placementPreviewSize ?? {
-              width: textStamp.displayWidth,
-              height: textStamp.displayHeight,
-            };
+          const displaySize = placementPreviewSize ?? {
+            width: textStamp.displayWidth,
+            height: textStamp.displayHeight,
+          };
           const pdfSize = cssToPdfSize(displaySize);
           lastStampImageRef.current = textStamp.dataUrl;
-          applyStampDefaults(textStamp.dataUrl, `Text Signature - ${signatureConfig.signerName}`, pdfSize);
+          applyStampDefaults(
+            textStamp.dataUrl,
+            `Text Signature - ${signatureConfig.signerName}`,
+            pdfSize,
+          );
         }
         return;
       }
 
       if (signatureConfig.signatureData) {
-        const pdfSize = placementPreviewSize ? cssToPdfSize(placementPreviewSize) : undefined;
+        const pdfSize = placementPreviewSize
+          ? cssToPdfSize(placementPreviewSize)
+          : undefined;
         lastStampImageRef.current = signatureConfig.signatureData;
-        applyStampDefaults(signatureConfig.signatureData, `Digital Signature - ${signatureConfig.reason || 'Document signing'}`, pdfSize);
+        applyStampDefaults(
+          signatureConfig.signatureData,
+          `Digital Signature - ${signatureConfig.reason || "Document signing"}`,
+          pdfSize,
+        );
         return;
       }
     } catch (error) {
-      console.error('Error preparing signature defaults:', error);
+      console.error("Error preparing signature defaults:", error);
     }
-  }, [annotationApi, signatureConfig, placementPreviewSize, applyStampDefaults, cssToPdfSize]);
-
+  }, [
+    annotationApi,
+    signatureConfig,
+    placementPreviewSize,
+    applyStampDefaults,
+    cssToPdfSize,
+  ]);
 
   // Enable keyboard deletion of selected annotations
   useEffect(() => {
     // Always enable delete key when we have annotation API and are in sign mode
-    if (!annotationApi || (isPlacementMode === undefined) || !documentReady) return;
+    if (!annotationApi || isPlacementMode === undefined || !documentReady)
+      return;
 
     const handleKeyDown = (event: KeyboardEvent) => {
       // Skip delete/backspace while a text input/textarea is focused (e.g., editing textbox)
       const target = event.target as HTMLElement | null;
       const tag = target?.tagName?.toLowerCase();
-      const editable = target?.getAttribute?.('contenteditable');
-      if (tag === 'input' || tag === 'textarea' || editable === 'true') {
+      const editable = target?.getAttribute?.("contenteditable");
+      if (tag === "input" || tag === "textarea" || editable === "true") {
         return;
       }
 
-      if (event.key === 'Delete' || event.key === 'Backspace') {
+      if (event.key === "Delete" || event.key === "Backspace") {
         const selectedAnnotation = annotationApi.getSelectedAnnotation?.();
 
         if (selectedAnnotation) {
@@ -252,15 +326,22 @@ export const SignatureAPIBridge = forwardRef<SignatureAPI, SignatureAPIBridgePro
           // For STAMP annotations, ensure image data is preserved before deletion
           if (annotation.object?.type === 13 && id) {
             // Get current annotation data to ensure we have latest image data stored
-            const pageAnnotationsTask = annotationApi.getPageAnnotations?.({ pageIndex });
+            const pageAnnotationsTask = annotationApi.getPageAnnotations?.({
+              pageIndex,
+            });
             if (pageAnnotationsTask) {
-              pageAnnotationsTask.toPromise().then((pageAnnotations: any) => {
-                const currentAnn = pageAnnotations?.find((ann: any) => ann.id === id);
-                if (currentAnn && currentAnn.imageSrc) {
-                  // Ensure the image data is stored in our persistent store
-                  storeImageData(id, currentAnn.imageSrc);
-                }
-              }).catch(console.error);
+              pageAnnotationsTask
+                .toPromise()
+                .then((pageAnnotations: any) => {
+                  const currentAnn = pageAnnotations?.find(
+                    (ann: any) => ann.id === id,
+                  );
+                  if (currentAnn && currentAnn.imageSrc) {
+                    // Ensure the image data is stored in our persistent store
+                    storeImageData(id, currentAnn.imageSrc);
+                  }
+                })
+                .catch(console.error);
             }
           }
 
@@ -277,156 +358,191 @@ export const SignatureAPIBridge = forwardRef<SignatureAPI, SignatureAPIBridgePro
       }
     };
 
-    document.addEventListener('keydown', handleKeyDown);
-    return () => document.removeEventListener('keydown', handleKeyDown);
+    document.addEventListener("keydown", handleKeyDown);
+    return () => document.removeEventListener("keydown", handleKeyDown);
   }, [annotationApi, storeImageData, isPlacementMode]);
 
-  useImperativeHandle(ref, () => ({
-    addImageSignature: (signatureData: string, x: number, y: number, width: number, height: number, pageIndex: number) => {
-      if (!annotationApi) return;
+  useImperativeHandle(
+    ref,
+    () => ({
+      addImageSignature: (
+        signatureData: string,
+        x: number,
+        y: number,
+        width: number,
+        height: number,
+        pageIndex: number,
+      ) => {
+        if (!annotationApi) return;
 
-      // Create image stamp annotation with proper image data
+        // Create image stamp annotation with proper image data
 
-      const annotationId = uuidV4();
+        const annotationId = uuidV4();
 
-      // Store image data in our persistent store
-      storeImageData(annotationId, signatureData);
+        // Store image data in our persistent store
+        storeImageData(annotationId, signatureData);
 
-      annotationApi.createAnnotation(pageIndex, {
-        type: PdfAnnotationSubtype.STAMP,
-        rect: {
-          origin: { x, y },
-          size: { width, height }
-        },
-        author: 'Digital Signature',
-        subject: 'Digital Signature',
-        pageIndex: pageIndex,
-        id: annotationId,
-        created: new Date(),
-        // Store image data in multiple places to ensure history captures it
-        imageSrc: signatureData,
-        contents: signatureData, // Some annotation systems use contents
-        data: signatureData, // Try data field
-        imageData: signatureData, // Try imageData field
-        appearance: signatureData // Try appearance field
-      });
-    },
-
-    activateDrawMode: () => {
-      if (!annotationApi) return;
-
-      // Use signatureInk (not ink) so the annotation pen tool stays unaffected
-      annotationApi.setActiveTool('signatureInk');
-
-      const activeTool = annotationApi.getActiveTool();
-      if (activeTool && activeTool.id === 'signatureInk') {
-        annotationApi.setToolDefaults('signatureInk', {
-          color: '#000000',
-          thickness: 2,
-          lineWidth: 2,
-          strokeWidth: 2,
-          width: 2
+        annotationApi.createAnnotation(pageIndex, {
+          type: PdfAnnotationSubtype.STAMP,
+          rect: {
+            origin: { x, y },
+            size: { width, height },
+          },
+          author: "Digital Signature",
+          subject: "Digital Signature",
+          pageIndex: pageIndex,
+          id: annotationId,
+          created: new Date(),
+          // Store image data in multiple places to ensure history captures it
+          imageSrc: signatureData,
+          contents: signatureData, // Some annotation systems use contents
+          data: signatureData, // Try data field
+          imageData: signatureData, // Try imageData field
+          appearance: signatureData, // Try appearance field
         });
-      }
-    },
+      },
 
-    activateSignaturePlacementMode: () => {
-      if (!annotationApi || !signatureConfig) return;
+      activateDrawMode: () => {
+        if (!annotationApi) return;
 
-      configureStampDefaults().catch((error) => {
-        console.error('Error activating signature tool:', error);
-      });
-    },
+        // Use signatureInk (not ink) so the annotation pen tool stays unaffected
+        annotationApi.setActiveTool("signatureInk");
 
-    updateDrawSettings: (color: string, size: number) => {
-      if (!annotationApi) return;
-
-      // Always update ink tool defaults - use multiple property names for compatibility
-      annotationApi.setToolDefaults('ink', {
-        color: color,
-        thickness: size,
-        lineWidth: size,
-        strokeWidth: size,
-        width: size
-      });
-
-      // Only reactivate ink if it was already the active tool — never auto-activate it.
-      // This prevents the ink (pen annotation) tool from being activated when
-      // updateDrawSettings is called on sign-tool mount.
-      const currentTool = annotationApi.getActiveTool();
-      if (currentTool?.id === 'ink') {
-        annotationApi.setActiveTool(null);
-        setTimeout(() => {
-          annotationApi.setActiveTool('ink');
-        }, 50);
-      }
-    },
-
-    activateDeleteMode: () => {
-      if (!annotationApi) return;
-      // Activate selection tool to allow selecting and deleting annotations
-      // Users can click annotations to select them, then press Delete key or right-click to delete
-      annotationApi.setActiveTool('select');
-    },
-
-    deleteAnnotation: (annotationId: string, pageIndex: number) => {
-      if (!annotationApi) return;
-
-      // Before deleting, try to preserve image data for potential undo
-      const pageAnnotationsTask = annotationApi.getPageAnnotations?.({ pageIndex });
-      if (pageAnnotationsTask) {
-        pageAnnotationsTask.toPromise().then((pageAnnotations: any) => {
-          const annotation = pageAnnotations?.find((ann: any) => ann.id === annotationId);
-          if (annotation && annotation.type === PdfAnnotationSubtype.STAMP && annotation.imageSrc) {
-            // Store image data before deletion
-            storeImageData(annotationId, annotation.imageSrc);
-          }
-        }).catch(console.error);
-      }
-
-      // Delete specific annotation by ID
-      annotationApi.deleteAnnotation(pageIndex, annotationId);
-    },
-
-    deactivateTools: () => {
-      if (!annotationApi) return;
-      annotationApi.setActiveTool(null);
-    },
-
-    getPageAnnotations: async (pageIndex: number): Promise<any[]> => {
-      if (!annotationApi || !annotationApi.getPageAnnotations) {
-        console.warn('getPageAnnotations not available');
-        return [];
-      }
-
-      try {
-        const pageAnnotationsTask = annotationApi.getPageAnnotations({ pageIndex });
-        if (pageAnnotationsTask && pageAnnotationsTask.toPromise) {
-          const annotations = await pageAnnotationsTask.toPromise();
-          return annotations || [];
+        const activeTool = annotationApi.getActiveTool();
+        if (activeTool && activeTool.id === "signatureInk") {
+          annotationApi.setToolDefaults("signatureInk", {
+            color: "#000000",
+            thickness: 2,
+            lineWidth: 2,
+            strokeWidth: 2,
+            width: 2,
+          });
         }
-        return [];
-      } catch (error) {
-        console.error(`Error getting annotations for page ${pageIndex}:`, error);
-        return [];
-      }
-    },
+      },
 
-    moveAnnotation: (pageIndex: number, annotationId: string, newRect: AnnotationRect) => {
-      if (!annotationApi) return;
-      // v2.7.0: move signature stamp to newRect without regenerating the AP stream,
-      // preserving the original appearance (image data stays intact).
-      (annotationApi as any).moveAnnotation?.(pageIndex, annotationId, newRect);
-    },
-  }), [annotationApi, signatureConfig, placementPreviewSize, applyStampDefaults]);
+      activateSignaturePlacementMode: () => {
+        if (!annotationApi || !signatureConfig) return;
+
+        configureStampDefaults().catch((error) => {
+          console.error("Error activating signature tool:", error);
+        });
+      },
+
+      updateDrawSettings: (color: string, size: number) => {
+        if (!annotationApi) return;
+
+        // Always update ink tool defaults - use multiple property names for compatibility
+        annotationApi.setToolDefaults("ink", {
+          color: color,
+          thickness: size,
+          lineWidth: size,
+          strokeWidth: size,
+          width: size,
+        });
+
+        // Only reactivate ink if it was already the active tool — never auto-activate it.
+        // This prevents the ink (pen annotation) tool from being activated when
+        // updateDrawSettings is called on sign-tool mount.
+        const currentTool = annotationApi.getActiveTool();
+        if (currentTool?.id === "ink") {
+          annotationApi.setActiveTool(null);
+          setTimeout(() => {
+            annotationApi.setActiveTool("ink");
+          }, 50);
+        }
+      },
+
+      activateDeleteMode: () => {
+        if (!annotationApi) return;
+        // Activate selection tool to allow selecting and deleting annotations
+        // Users can click annotations to select them, then press Delete key or right-click to delete
+        annotationApi.setActiveTool("select");
+      },
+
+      deleteAnnotation: (annotationId: string, pageIndex: number) => {
+        if (!annotationApi) return;
+
+        // Before deleting, try to preserve image data for potential undo
+        const pageAnnotationsTask = annotationApi.getPageAnnotations?.({
+          pageIndex,
+        });
+        if (pageAnnotationsTask) {
+          pageAnnotationsTask
+            .toPromise()
+            .then((pageAnnotations: any) => {
+              const annotation = pageAnnotations?.find(
+                (ann: any) => ann.id === annotationId,
+              );
+              if (
+                annotation &&
+                annotation.type === PdfAnnotationSubtype.STAMP &&
+                annotation.imageSrc
+              ) {
+                // Store image data before deletion
+                storeImageData(annotationId, annotation.imageSrc);
+              }
+            })
+            .catch(console.error);
+        }
+
+        // Delete specific annotation by ID
+        annotationApi.deleteAnnotation(pageIndex, annotationId);
+      },
+
+      deactivateTools: () => {
+        if (!annotationApi) return;
+        annotationApi.setActiveTool(null);
+      },
+
+      getPageAnnotations: async (pageIndex: number): Promise<any[]> => {
+        if (!annotationApi || !annotationApi.getPageAnnotations) {
+          console.warn("getPageAnnotations not available");
+          return [];
+        }
+
+        try {
+          const pageAnnotationsTask = annotationApi.getPageAnnotations({
+            pageIndex,
+          });
+          if (pageAnnotationsTask && pageAnnotationsTask.toPromise) {
+            const annotations = await pageAnnotationsTask.toPromise();
+            return annotations || [];
+          }
+          return [];
+        } catch (error) {
+          console.error(
+            `Error getting annotations for page ${pageIndex}:`,
+            error,
+          );
+          return [];
+        }
+      },
+
+      moveAnnotation: (
+        pageIndex: number,
+        annotationId: string,
+        newRect: AnnotationRect,
+      ) => {
+        if (!annotationApi) return;
+        // v2.7.0: move signature stamp to newRect without regenerating the AP stream,
+        // preserving the original appearance (image data stays intact).
+        (annotationApi as any).moveAnnotation?.(
+          pageIndex,
+          annotationId,
+          newRect,
+        );
+      },
+    }),
+    [annotationApi, signatureConfig, placementPreviewSize, applyStampDefaults],
+  );
 
   useEffect(() => {
     if (!annotationApi?.onAnnotationEvent || !documentReady) {
       return;
     }
 
-    const unsubscribe = annotationApi.onAnnotationEvent(event => {
-      if (event.type !== 'create' && event.type !== 'update') {
+    const unsubscribe = annotationApi.onAnnotationEvent((event) => {
+      if (event.type !== "create" && event.type !== "update") {
         return;
       }
 
@@ -437,7 +553,7 @@ export const SignatureAPIBridge = forwardRef<SignatureAPI, SignatureAPIBridgePro
       }
 
       // Mark signatures as not applied when a new signature is placed
-      if (event.type === 'create') {
+      if (event.type === "create") {
         setSignaturesApplied(false);
       }
 
@@ -470,17 +586,22 @@ export const SignatureAPIBridge = forwardRef<SignatureAPI, SignatureAPIBridgePro
     let cancelled = false;
     configureStampDefaults().catch((error) => {
       if (!cancelled) {
-        console.error('Error updating signature defaults:', error);
+        console.error("Error updating signature defaults:", error);
       }
     });
 
     return () => {
       cancelled = true;
     };
-  }, [isPlacementMode, configureStampDefaults, placementPreviewSize, signatureConfig, documentReady]);
-
+  }, [
+    isPlacementMode,
+    configureStampDefaults,
+    placementPreviewSize,
+    signatureConfig,
+    documentReady,
+  ]);
 
   return null; // This is a bridge component with no UI
 });
 
-SignatureAPIBridge.displayName = 'SignatureAPIBridge';
+SignatureAPIBridge.displayName = "SignatureAPIBridge";
diff --git a/frontend/src/core/components/viewer/SignatureFieldOverlay.tsx b/frontend/src/core/components/viewer/SignatureFieldOverlay.tsx
index a311460e63..afd04bf6b2 100644
--- a/frontend/src/core/components/viewer/SignatureFieldOverlay.tsx
+++ b/frontend/src/core/components/viewer/SignatureFieldOverlay.tsx
@@ -11,12 +11,12 @@
  * For widgets without an appearance stream (unsigned fields, or fields whose
  * PDF writer didn't embed one), we fall back to a translucent badge overlay.
  */
-import React, { useEffect, useMemo, useRef, useState, memo } from 'react';
+import React, { useEffect, useMemo, useRef, useState, memo } from "react";
 import {
   renderSignatureFieldAppearances,
   extractSignatures,
   type SignatureFieldAppearance,
-} from '@app/services/pdfiumService';
+} from "@app/services/pdfiumService";
 
 interface SignatureFieldOverlayProps {
   pageIndex: number;
@@ -69,7 +69,6 @@ async function resolveFields(
         time: matchedSig?.time,
       };
     });
-
   })();
 
   _cachedFields = await _cachePromise;
@@ -92,7 +91,7 @@ function SignatureBitmapCanvas({
     if (!canvas) return;
     canvas.width = imageData.width;
     canvas.height = imageData.height;
-    const ctx = canvas.getContext('2d');
+    const ctx = canvas.getContext("2d");
     if (ctx) ctx.putImageData(imageData, 0, 0);
   }, [imageData]);
 
@@ -102,7 +101,7 @@ function SignatureBitmapCanvas({
       style={{
         width: cssWidth,
         height: cssHeight,
-        display: 'block',
+        display: "block",
       }}
     />
   );
@@ -123,12 +122,16 @@ function SignatureFieldOverlayInner({
       return;
     }
     let cancelled = false;
-    resolveFields(pdfSource).then((res) => {
-      if (!cancelled) setFields(res);
-    }).catch(() => {
-      if (!cancelled) setFields([]);
-    });
-    return () => { cancelled = true; };
+    resolveFields(pdfSource)
+      .then((res) => {
+        if (!cancelled) setFields(res);
+      })
+      .catch(() => {
+        if (!cancelled) setFields([]);
+      });
+    return () => {
+      cancelled = true;
+    };
   }, [pdfSource]);
 
   const pageFields = useMemo(
@@ -141,12 +144,12 @@ function SignatureFieldOverlayInner({
   return (
     <div
       style={{
-        position: 'absolute',
+        position: "absolute",
         top: 0,
         left: 0,
-        width: '100%',
-        height: '100%',
-        pointerEvents: 'none',
+        width: "100%",
+        height: "100%",
+        pointerEvents: "none",
         zIndex: 6,
       }}
       data-signature-overlay-page={pageIndex}
@@ -155,8 +158,10 @@ function SignatureFieldOverlayInner({
         // Use the source PDF page dimensions that the extraction used for
         // coordinate computation. This avoids mismatches with pdfPage.size
         // from EmbedPDF which may report different dimensions.
-        const sx = field.sourcePageWidth  > 0 ? pageWidth  / field.sourcePageWidth  : 1;
-        const sy = field.sourcePageHeight > 0 ? pageHeight / field.sourcePageHeight : 1;
+        const sx =
+          field.sourcePageWidth > 0 ? pageWidth / field.sourcePageWidth : 1;
+        const sy =
+          field.sourcePageHeight > 0 ? pageHeight / field.sourcePageHeight : 1;
         const left = field.x * sx;
         const top = field.y * sy;
         const width = field.width * sx;
@@ -168,18 +173,18 @@ function SignatureFieldOverlayInner({
             <div
               key={`sig-${field.fieldName}-${idx}`}
               style={{
-                position: 'absolute',
+                position: "absolute",
                 left,
                 top,
                 width,
                 height,
-                overflow: 'hidden',
-                pointerEvents: 'auto',
-                cursor: 'default',
+                overflow: "hidden",
+                pointerEvents: "auto",
+                cursor: "default",
               }}
               title={
                 field.isSigned
-                  ? `Signed${field.reason ? `: ${field.reason}` : ''}${field.time ? ` (${field.time})` : ''}`
+                  ? `Signed${field.reason ? `: ${field.reason}` : ""}${field.time ? ` (${field.time})` : ""}`
                   : `Signature field: ${field.fieldName}`
               }
             >
@@ -197,47 +202,49 @@ function SignatureFieldOverlayInner({
           <div
             key={`sig-${field.fieldName}-${idx}`}
             style={{
-              position: 'absolute',
+              position: "absolute",
               left,
               top,
               width,
               height,
               border: field.isSigned
-                ? '2px solid rgba(34, 139, 34, 0.7)'
-                : '2px dashed rgba(180, 180, 180, 0.7)',
+                ? "2px solid rgba(34, 139, 34, 0.7)"
+                : "2px dashed rgba(180, 180, 180, 0.7)",
               borderRadius: 4,
               background: field.isSigned
-                ? 'rgba(34, 139, 34, 0.08)'
-                : 'rgba(200, 200, 200, 0.08)',
-              display: 'flex',
-              alignItems: 'center',
-              justifyContent: 'center',
-              overflow: 'hidden',
-              pointerEvents: 'auto',
-              cursor: 'default',
+                ? "rgba(34, 139, 34, 0.08)"
+                : "rgba(200, 200, 200, 0.08)",
+              display: "flex",
+              alignItems: "center",
+              justifyContent: "center",
+              overflow: "hidden",
+              pointerEvents: "auto",
+              cursor: "default",
             }}
             title={
               field.isSigned
-                ? `Signed${field.reason ? `: ${field.reason}` : ''}${field.time ? ` (${field.time})` : ''}`
+                ? `Signed${field.reason ? `: ${field.reason}` : ""}${field.time ? ` (${field.time})` : ""}`
                 : `Unsigned signature field: ${field.fieldName}`
             }
           >
             <span
               style={{
                 fontSize: Math.min(height * 0.35, 14),
-                color: field.isSigned ? 'rgba(34, 139, 34, 0.85)' : 'rgba(120, 120, 120, 0.85)',
+                color: field.isSigned
+                  ? "rgba(34, 139, 34, 0.85)"
+                  : "rgba(120, 120, 120, 0.85)",
                 fontWeight: 600,
-                textAlign: 'center',
+                textAlign: "center",
                 lineHeight: 1.2,
-                padding: '2px 4px',
-                userSelect: 'none',
-                whiteSpace: 'nowrap',
-                textOverflow: 'ellipsis',
-                overflow: 'hidden',
-                maxWidth: '100%',
+                padding: "2px 4px",
+                userSelect: "none",
+                whiteSpace: "nowrap",
+                textOverflow: "ellipsis",
+                overflow: "hidden",
+                maxWidth: "100%",
               }}
             >
-              {field.isSigned ? '🔒 Signed' : '✎ Signature'}
+              {field.isSigned ? "🔒 Signed" : "✎ Signature"}
             </span>
           </div>
         );
diff --git a/frontend/src/core/components/viewer/SignaturePlacementOverlay.tsx b/frontend/src/core/components/viewer/SignaturePlacementOverlay.tsx
index be5257deb8..bcfdab7169 100644
--- a/frontend/src/core/components/viewer/SignaturePlacementOverlay.tsx
+++ b/frontend/src/core/components/viewer/SignaturePlacementOverlay.tsx
@@ -1,8 +1,11 @@
-import React, { useEffect, useMemo, useState } from 'react';
-import { Box } from '@mantine/core';
-import type { SignParameters } from '@app/hooks/tools/sign/useSignParameters';
-import { buildSignaturePreview, SignaturePreview } from '@app/utils/signaturePreview';
-import { useSignature } from '@app/contexts/SignatureContext';
+import React, { useEffect, useMemo, useState } from "react";
+import { Box } from "@mantine/core";
+import type { SignParameters } from "@app/hooks/tools/sign/useSignParameters";
+import {
+  buildSignaturePreview,
+  SignaturePreview,
+} from "@app/utils/signaturePreview";
+import { useSignature } from "@app/contexts/SignatureContext";
 import {
   MAX_PREVIEW_WIDTH_RATIO,
   MAX_PREVIEW_HEIGHT_RATIO,
@@ -10,10 +13,11 @@ import {
   MAX_PREVIEW_HEIGHT_REM,
   MIN_SIGNATURE_DIMENSION_REM,
   OVERLAY_EDGE_PADDING_REM,
-} from '@app/constants/signConstants';
+} from "@app/constants/signConstants";
 
 // Convert rem to pixels using browser's base font size (typically 16px)
-const remToPx = (rem: number) => rem * parseFloat(getComputedStyle(document.documentElement).fontSize);
+const remToPx = (rem: number) =>
+  rem * parseFloat(getComputedStyle(document.documentElement).fontSize);
 
 interface SignaturePlacementOverlayProps {
   containerRef: React.RefObject<HTMLElement | null>;
@@ -21,11 +25,9 @@ interface SignaturePlacementOverlayProps {
   signatureConfig: SignParameters | null;
 }
 
-export const SignaturePlacementOverlay: React.FC<SignaturePlacementOverlayProps> = ({
-  containerRef,
-  isActive,
-  signatureConfig,
-}) => {
+export const SignaturePlacementOverlay: React.FC<
+  SignaturePlacementOverlayProps
+> = ({ containerRef, isActive, signatureConfig }) => {
   const [preview, setPreview] = useState<SignaturePreview | null>(null);
   const [cursor, setCursor] = useState<{ x: number; y: number } | null>(null);
   const { setPlacementPreviewSize } = useSignature();
@@ -40,7 +42,7 @@ export const SignaturePlacementOverlay: React.FC<SignaturePlacementOverlayProps>
           setPreview(value);
         }
       } catch (error) {
-        console.error('Failed to build signature preview:', error);
+        console.error("Failed to build signature preview:", error);
         if (!cancelled) {
           setPreview(null);
         }
@@ -71,12 +73,12 @@ export const SignaturePlacementOverlay: React.FC<SignaturePlacementOverlayProps>
 
     const handleLeave = () => setCursor(null);
 
-    element.addEventListener('mousemove', handleMove);
-    element.addEventListener('mouseleave', handleLeave);
+    element.addEventListener("mousemove", handleMove);
+    element.addEventListener("mouseleave", handleLeave);
 
     return () => {
-      element.removeEventListener('mousemove', handleMove);
-      element.removeEventListener('mouseleave', handleLeave);
+      element.removeEventListener("mousemove", handleMove);
+      element.removeEventListener("mouseleave", handleLeave);
     };
   }, [containerRef, isActive]);
 
@@ -89,18 +91,30 @@ export const SignaturePlacementOverlay: React.FC<SignaturePlacementOverlayProps>
     const containerWidth = container.clientWidth || 1;
     const containerHeight = container.clientHeight || 1;
 
-    const maxWidth = Math.min(containerWidth * MAX_PREVIEW_WIDTH_RATIO, remToPx(MAX_PREVIEW_WIDTH_REM));
-    const maxHeight = Math.min(containerHeight * MAX_PREVIEW_HEIGHT_RATIO, remToPx(MAX_PREVIEW_HEIGHT_REM));
+    const maxWidth = Math.min(
+      containerWidth * MAX_PREVIEW_WIDTH_RATIO,
+      remToPx(MAX_PREVIEW_WIDTH_REM),
+    );
+    const maxHeight = Math.min(
+      containerHeight * MAX_PREVIEW_HEIGHT_RATIO,
+      remToPx(MAX_PREVIEW_HEIGHT_REM),
+    );
 
     const scale = Math.min(
       1,
       maxWidth / Math.max(preview.width, 1),
-      maxHeight / Math.max(preview.height, 1)
+      maxHeight / Math.max(preview.height, 1),
     );
 
     return {
-      width: Math.max(remToPx(MIN_SIGNATURE_DIMENSION_REM), preview.width * scale),
-      height: Math.max(remToPx(MIN_SIGNATURE_DIMENSION_REM), preview.height * scale),
+      width: Math.max(
+        remToPx(MIN_SIGNATURE_DIMENSION_REM),
+        preview.width * scale,
+      ),
+      height: Math.max(
+        remToPx(MIN_SIGNATURE_DIMENSION_REM),
+        preview.height * scale,
+      ),
     };
   }, [preview, containerRef]);
 
@@ -131,8 +145,14 @@ export const SignaturePlacementOverlay: React.FC<SignaturePlacementOverlayProps>
     const height = scaledSize.height;
     const edgePadding = remToPx(OVERLAY_EDGE_PADDING_REM);
 
-    const clampedLeft = Math.max(edgePadding, Math.min(cursor.x - width / 2, containerWidth - width - edgePadding));
-    const clampedTop = Math.max(edgePadding, Math.min(cursor.y - height / 2, containerHeight - height - edgePadding));
+    const clampedLeft = Math.max(
+      edgePadding,
+      Math.min(cursor.x - width / 2, containerWidth - width - edgePadding),
+    );
+    const clampedTop = Math.max(
+      edgePadding,
+      Math.min(cursor.y - height / 2, containerHeight - height - edgePadding),
+    );
 
     return {
       left: clampedLeft,
@@ -150,20 +170,21 @@ export const SignaturePlacementOverlay: React.FC<SignaturePlacementOverlayProps>
   return (
     <Box
       style={{
-        position: 'absolute',
-        pointerEvents: 'none',
+        position: "absolute",
+        pointerEvents: "none",
         left: `${display.left}px`,
         top: `${display.top}px`,
         width: `${display.width}px`,
         height: `${display.height}px`,
         backgroundImage: `url(${display.dataUrl})`,
-        backgroundSize: '100% 100%',
-        backgroundRepeat: 'no-repeat',
-        backgroundPosition: 'center',
-        boxShadow: '0 0 0 1px rgba(30, 136, 229, 0.55), 0 6px 18px rgba(30, 136, 229, 0.25)',
-        borderRadius: '4px',
-        transition: 'transform 70ms ease-out',
-        transform: 'translateZ(0)',
+        backgroundSize: "100% 100%",
+        backgroundRepeat: "no-repeat",
+        backgroundPosition: "center",
+        boxShadow:
+          "0 0 0 1px rgba(30, 136, 229, 0.55), 0 6px 18px rgba(30, 136, 229, 0.25)",
+        borderRadius: "4px",
+        transition: "transform 70ms ease-out",
+        transform: "translateZ(0)",
         opacity: 0.6,
       }}
     />
diff --git a/frontend/src/core/components/viewer/SpreadAPIBridge.tsx b/frontend/src/core/components/viewer/SpreadAPIBridge.tsx
index 46f11c876c..9beeb78a78 100644
--- a/frontend/src/core/components/viewer/SpreadAPIBridge.tsx
+++ b/frontend/src/core/components/viewer/SpreadAPIBridge.tsx
@@ -1,8 +1,8 @@
-import { useEffect, useRef } from 'react';
-import { useSpread, SpreadMode } from '@embedpdf/plugin-spread/react';
-import { useViewer } from '@app/contexts/ViewerContext';
-import { useActiveDocumentId } from '@app/components/viewer/useActiveDocumentId';
-import { useDocumentReady } from '@app/components/viewer/hooks/useDocumentReady';
+import { useEffect, useRef } from "react";
+import { useSpread, SpreadMode } from "@embedpdf/plugin-spread/react";
+import { useViewer } from "@app/contexts/ViewerContext";
+import { useActiveDocumentId } from "@app/components/viewer/useActiveDocumentId";
+import { useDocumentReady } from "@app/components/viewer/hooks/useDocumentReady";
 
 /**
  * SpreadAPIBridge - Updated for embedPDF v2.6.0
@@ -41,7 +41,7 @@ function SpreadAPIBridgeInner({ documentId }: { documentId: string }) {
       isDualPage: spreadMode !== SpreadMode.None,
     };
 
-    registerBridge('spread', {
+    registerBridge("spread", {
       state: newState,
       api: {
         setSpreadMode: (mode: SpreadMode) => {
@@ -50,7 +50,8 @@ function SpreadAPIBridgeInner({ documentId }: { documentId: string }) {
         getSpreadMode: () => currentSpread.getSpreadMode(),
         toggleSpreadMode: () => {
           const current = currentSpread.getSpreadMode();
-          const nextMode = current === SpreadMode.None ? SpreadMode.Odd : SpreadMode.None;
+          const nextMode =
+            current === SpreadMode.None ? SpreadMode.Odd : SpreadMode.None;
           currentSpread.setSpreadMode(nextMode);
         },
         SpreadMode,
@@ -60,7 +61,7 @@ function SpreadAPIBridgeInner({ documentId }: { documentId: string }) {
     triggerImmediateSpreadUpdate(spreadMode);
 
     return () => {
-      registerBridge('spread', null);
+      registerBridge("spread", null);
     };
   }, [spreadMode, registerBridge, triggerImmediateSpreadUpdate]);
 
diff --git a/frontend/src/core/components/viewer/StampPlacementOverlay.tsx b/frontend/src/core/components/viewer/StampPlacementOverlay.tsx
index 92417e53b9..e1c85986c3 100644
--- a/frontend/src/core/components/viewer/StampPlacementOverlay.tsx
+++ b/frontend/src/core/components/viewer/StampPlacementOverlay.tsx
@@ -1,8 +1,11 @@
-import React, { useEffect, useMemo, useState } from 'react';
-import { Box } from '@mantine/core';
-import type { SignParameters } from '@app/hooks/tools/sign/useSignParameters';
-import { buildSignaturePreview, SignaturePreview } from '@app/utils/signaturePreview';
-import { useSignature } from '@app/contexts/SignatureContext';
+import React, { useEffect, useMemo, useState } from "react";
+import { Box } from "@mantine/core";
+import type { SignParameters } from "@app/hooks/tools/sign/useSignParameters";
+import {
+  buildSignaturePreview,
+  SignaturePreview,
+} from "@app/utils/signaturePreview";
+import { useSignature } from "@app/contexts/SignatureContext";
 import {
   MAX_PREVIEW_WIDTH_RATIO,
   MAX_PREVIEW_HEIGHT_RATIO,
@@ -10,10 +13,11 @@ import {
   MAX_PREVIEW_HEIGHT_REM,
   MIN_SIGNATURE_DIMENSION_REM,
   OVERLAY_EDGE_PADDING_REM,
-} from '@app/constants/signConstants';
+} from "@app/constants/signConstants";
 
 // Convert rem to pixels using browser's base font size (typically 16px)
-const remToPx = (rem: number) => rem * parseFloat(getComputedStyle(document.documentElement).fontSize);
+const remToPx = (rem: number) =>
+  rem * parseFloat(getComputedStyle(document.documentElement).fontSize);
 
 interface StampPlacementOverlayProps {
   containerRef: React.RefObject<HTMLElement | null>;
@@ -40,7 +44,7 @@ export const StampPlacementOverlay: React.FC<StampPlacementOverlayProps> = ({
           setPreview(value);
         }
       } catch (error) {
-        console.error('Failed to build signature preview:', error);
+        console.error("Failed to build signature preview:", error);
         if (!cancelled) {
           setPreview(null);
         }
@@ -71,12 +75,12 @@ export const StampPlacementOverlay: React.FC<StampPlacementOverlayProps> = ({
 
     const handleLeave = () => setCursor(null);
 
-    element.addEventListener('mousemove', handleMove);
-    element.addEventListener('mouseleave', handleLeave);
+    element.addEventListener("mousemove", handleMove);
+    element.addEventListener("mouseleave", handleLeave);
 
     return () => {
-      element.removeEventListener('mousemove', handleMove);
-      element.removeEventListener('mouseleave', handleLeave);
+      element.removeEventListener("mousemove", handleMove);
+      element.removeEventListener("mouseleave", handleLeave);
     };
   }, [containerRef, isActive]);
 
@@ -89,18 +93,30 @@ export const StampPlacementOverlay: React.FC<StampPlacementOverlayProps> = ({
     const containerWidth = container.clientWidth || 1;
     const containerHeight = container.clientHeight || 1;
 
-    const maxWidth = Math.min(containerWidth * MAX_PREVIEW_WIDTH_RATIO, remToPx(MAX_PREVIEW_WIDTH_REM));
-    const maxHeight = Math.min(containerHeight * MAX_PREVIEW_HEIGHT_RATIO, remToPx(MAX_PREVIEW_HEIGHT_REM));
+    const maxWidth = Math.min(
+      containerWidth * MAX_PREVIEW_WIDTH_RATIO,
+      remToPx(MAX_PREVIEW_WIDTH_REM),
+    );
+    const maxHeight = Math.min(
+      containerHeight * MAX_PREVIEW_HEIGHT_RATIO,
+      remToPx(MAX_PREVIEW_HEIGHT_REM),
+    );
 
     const scale = Math.min(
       1,
       maxWidth / Math.max(preview.width, 1),
-      maxHeight / Math.max(preview.height, 1)
+      maxHeight / Math.max(preview.height, 1),
     );
 
     return {
-      width: Math.max(remToPx(MIN_SIGNATURE_DIMENSION_REM), preview.width * scale),
-      height: Math.max(remToPx(MIN_SIGNATURE_DIMENSION_REM), preview.height * scale),
+      width: Math.max(
+        remToPx(MIN_SIGNATURE_DIMENSION_REM),
+        preview.width * scale,
+      ),
+      height: Math.max(
+        remToPx(MIN_SIGNATURE_DIMENSION_REM),
+        preview.height * scale,
+      ),
     };
   }, [preview, containerRef]);
 
@@ -131,8 +147,14 @@ export const StampPlacementOverlay: React.FC<StampPlacementOverlayProps> = ({
     const height = scaledSize.height;
     const edgePadding = remToPx(OVERLAY_EDGE_PADDING_REM);
 
-    const clampedLeft = Math.max(edgePadding, Math.min(cursor.x - width / 2, containerWidth - width - edgePadding));
-    const clampedTop = Math.max(edgePadding, Math.min(cursor.y - height / 2, containerHeight - height - edgePadding));
+    const clampedLeft = Math.max(
+      edgePadding,
+      Math.min(cursor.x - width / 2, containerWidth - width - edgePadding),
+    );
+    const clampedTop = Math.max(
+      edgePadding,
+      Math.min(cursor.y - height / 2, containerHeight - height - edgePadding),
+    );
 
     return {
       left: clampedLeft,
@@ -150,20 +172,21 @@ export const StampPlacementOverlay: React.FC<StampPlacementOverlayProps> = ({
   return (
     <Box
       style={{
-        position: 'absolute',
-        pointerEvents: 'none',
+        position: "absolute",
+        pointerEvents: "none",
         left: `${display.left}px`,
         top: `${display.top}px`,
         width: `${display.width}px`,
         height: `${display.height}px`,
         backgroundImage: `url(${display.dataUrl})`,
-        backgroundSize: '100% 100%',
-        backgroundRepeat: 'no-repeat',
-        backgroundPosition: 'center',
-        boxShadow: '0 0 0 1px rgba(30, 136, 229, 0.55), 0 6px 18px rgba(30, 136, 229, 0.25)',
-        borderRadius: '4px',
-        transition: 'transform 70ms ease-out',
-        transform: 'translateZ(0)',
+        backgroundSize: "100% 100%",
+        backgroundRepeat: "no-repeat",
+        backgroundPosition: "center",
+        boxShadow:
+          "0 0 0 1px rgba(30, 136, 229, 0.55), 0 6px 18px rgba(30, 136, 229, 0.25)",
+        borderRadius: "4px",
+        transition: "transform 70ms ease-out",
+        transform: "translateZ(0)",
         opacity: 0.6,
       }}
     />
diff --git a/frontend/src/core/components/viewer/TextSelectionHandler.tsx b/frontend/src/core/components/viewer/TextSelectionHandler.tsx
index d1d2ab2deb..22e42d1ed1 100644
--- a/frontend/src/core/components/viewer/TextSelectionHandler.tsx
+++ b/frontend/src/core/components/viewer/TextSelectionHandler.tsx
@@ -1,7 +1,11 @@
-import { useEffect, useRef } from 'react';
-import { useSelectionPlugin, useSelectionCapability, glyphAt } from '@embedpdf/plugin-selection/react';
-import { useInteractionManagerCapability } from '@embedpdf/plugin-interaction-manager/react';
-import type { Position, PdfPageGeometry, PdfRun } from '@embedpdf/models';
+import { useEffect, useRef } from "react";
+import {
+  useSelectionPlugin,
+  useSelectionCapability,
+  glyphAt,
+} from "@embedpdf/plugin-selection/react";
+import { useInteractionManagerCapability } from "@embedpdf/plugin-interaction-manager/react";
+import type { Position, PdfPageGeometry, PdfRun } from "@embedpdf/models";
 
 interface TextSelectionHandlerProps {
   documentId: string;
@@ -15,7 +19,10 @@ const TRIPLE_CLICK_POSITION_THRESHOLD = 20;
 
 const WORD_CHAR_REGEX = /[\p{L}\p{N}_]/u;
 
-function findRunForGlyph(geo: PdfPageGeometry, glyphIndex: number): PdfRun | null {
+function findRunForGlyph(
+  geo: PdfPageGeometry,
+  glyphIndex: number,
+): PdfRun | null {
   for (const run of geo.runs) {
     const runEnd = run.charStart + run.glyphs.length - 1;
     if (glyphIndex >= run.charStart && glyphIndex <= runEnd) {
@@ -34,7 +41,10 @@ function findRunForGlyph(geo: PdfPageGeometry, glyphIndex: number): PdfRun | nul
  * - Double-click on punctuation: selects just that character
  * - Double-click on whitespace: no selection
  */
-function findWordBoundariesInText(text: string, charIndex: number): { start: number; end: number } | null {
+function findWordBoundariesInText(
+  text: string,
+  charIndex: number,
+): { start: number; end: number } | null {
   if (charIndex < 0 || charIndex >= text.length) return null;
 
   const char = text[charIndex];
@@ -59,7 +69,10 @@ function findWordBoundariesInText(text: string, charIndex: number): { start: num
  * Finds line boundaries around the given glyph index.
  * A "line" is defined as consecutive runs sharing a similar Y position.
  */
-function findLineBoundaries(geo: PdfPageGeometry, glyphIndex: number): { start: number; end: number } | null {
+function findLineBoundaries(
+  geo: PdfPageGeometry,
+  glyphIndex: number,
+): { start: number; end: number } | null {
   let targetRunIndex = -1;
   for (let i = 0; i < geo.runs.length; i++) {
     const run = geo.runs[i];
@@ -111,7 +124,7 @@ function setSelectionRange(
   documentId: string,
   pageIndex: number,
   startIndex: number,
-  endIndex: number
+  endIndex: number,
 ): void {
   selPlugin.clearSelection(documentId);
   selPlugin.beginSelection(documentId, pageIndex, startIndex);
@@ -124,12 +137,17 @@ function setSelectionRange(
  * - Double-click to select a whole word
  * - Triple-click to select an entire line
  */
-export function TextSelectionHandler({ documentId, pageIndex }: TextSelectionHandlerProps) {
+export function TextSelectionHandler({
+  documentId,
+  pageIndex,
+}: TextSelectionHandlerProps) {
   const { plugin: selPlugin } = useSelectionPlugin();
   const { provides: selCapability } = useSelectionCapability();
   const { provides: imCapability } = useInteractionManagerCapability();
 
-  const lastDblClickRef = useRef<{ time: number; x: number; y: number } | null>(null);
+  const lastDblClickRef = useRef<{ time: number; x: number; y: number } | null>(
+    null,
+  );
   const tripleClickTimeRef = useRef(0);
 
   useEffect(() => {
@@ -137,7 +155,10 @@ export function TextSelectionHandler({ documentId, pageIndex }: TextSelectionHan
 
     const handlers = {
       onDoubleClick: (pos: Position, _evt: any, modeId: string) => {
-        if (Date.now() - tripleClickTimeRef.current < TRIPLE_CLICK_TIME_THRESHOLD) {
+        if (
+          Date.now() - tripleClickTimeRef.current <
+          TRIPLE_CLICK_TIME_THRESHOLD
+        ) {
           return;
         }
 
@@ -160,27 +181,40 @@ export function TextSelectionHandler({ documentId, pageIndex }: TextSelectionHan
           const coreDoc = plugin.getCoreDocument(documentId);
           if (!coreDoc?.document) return;
 
-          const task = plugin.engine.getTextSlices(coreDoc.document, [{
-            pageIndex,
-            charIndex: run.charStart,
-            charCount: run.glyphs.length,
-          }]);
+          const task = plugin.engine.getTextSlices(coreDoc.document, [
+            {
+              pageIndex,
+              charIndex: run.charStart,
+              charCount: run.glyphs.length,
+            },
+          ]);
 
-          task.wait((texts: string[]) => {
-            const text = texts[0];
-            if (!text) return;
+          task.wait(
+            (texts: string[]) => {
+              const text = texts[0];
+              if (!text) return;
 
-            const boundaries = findWordBoundariesInText(text, localIndex);
-            if (!boundaries) return;
+              const boundaries = findWordBoundariesInText(text, localIndex);
+              if (!boundaries) return;
 
-            lastDblClickRef.current = { time: Date.now(), x: pos.x, y: pos.y };
+              lastDblClickRef.current = {
+                time: Date.now(),
+                x: pos.x,
+                y: pos.y,
+              };
 
-            setSelectionRange(
-              selPlugin, documentId, pageIndex,
-              run.charStart + boundaries.start,
-              run.charStart + boundaries.end
-            );
-          }, () => { /* ignore errors */ });
+              setSelectionRange(
+                selPlugin,
+                documentId,
+                pageIndex,
+                run.charStart + boundaries.start,
+                run.charStart + boundaries.end,
+              );
+            },
+            () => {
+              /* ignore errors */
+            },
+          );
         } catch {
           // Engine access failed - silently ignore
         }
@@ -216,13 +250,19 @@ export function TextSelectionHandler({ documentId, pageIndex }: TextSelectionHan
           tripleClickTimeRef.current = now;
           lastDblClickRef.current = null;
 
-          setSelectionRange(selPlugin, documentId, pageIndex, line.start, line.end);
+          setSelectionRange(
+            selPlugin,
+            documentId,
+            pageIndex,
+            line.start,
+            line.end,
+          );
         }
       },
     };
 
     return imCapability.registerAlways({
-      scope: { type: 'page', documentId, pageIndex },
+      scope: { type: "page", documentId, pageIndex },
       handlers,
     });
   }, [selPlugin, selCapability, imCapability, documentId, pageIndex]);
diff --git a/frontend/src/core/components/viewer/ThumbnailAPIBridge.tsx b/frontend/src/core/components/viewer/ThumbnailAPIBridge.tsx
index b1786b4eed..19b9c8442f 100644
--- a/frontend/src/core/components/viewer/ThumbnailAPIBridge.tsx
+++ b/frontend/src/core/components/viewer/ThumbnailAPIBridge.tsx
@@ -1,7 +1,7 @@
-import { useEffect } from 'react';
-import { useThumbnailCapability } from '@embedpdf/plugin-thumbnail/react';
-import { useViewer } from '@app/contexts/ViewerContext';
-import { useDocumentReady } from '@app/components/viewer/hooks/useDocumentReady';
+import { useEffect } from "react";
+import { useThumbnailCapability } from "@embedpdf/plugin-thumbnail/react";
+import { useViewer } from "@app/contexts/ViewerContext";
+import { useDocumentReady } from "@app/components/viewer/hooks/useDocumentReady";
 
 /**
  * ThumbnailAPIBridge - Updated for embedPDF v2.6.0
@@ -14,14 +14,14 @@ export function ThumbnailAPIBridge() {
 
   useEffect(() => {
     if (thumbnail && documentReady) {
-      registerBridge('thumbnail', {
+      registerBridge("thumbnail", {
         state: null, // No state - just provides API
-        api: thumbnail
+        api: thumbnail,
       });
     }
 
     return () => {
-      registerBridge('thumbnail', null);
+      registerBridge("thumbnail", null);
     };
   }, [thumbnail, documentReady, registerBridge]);
 
diff --git a/frontend/src/core/components/viewer/ThumbnailSidebar.tsx b/frontend/src/core/components/viewer/ThumbnailSidebar.tsx
index 45eb3b710a..1876cf5812 100644
--- a/frontend/src/core/components/viewer/ThumbnailSidebar.tsx
+++ b/frontend/src/core/components/viewer/ThumbnailSidebar.tsx
@@ -1,7 +1,7 @@
-import { useState, useEffect, useRef } from 'react';
-import { Box, ScrollArea } from '@mantine/core';
-import { useViewer } from '@app/contexts/ViewerContext';
-import { PrivateContent } from '@app/components/shared/PrivateContent';
+import { useState, useEffect, useRef } from "react";
+import { Box, ScrollArea } from "@mantine/core";
+import { useViewer } from "@app/contexts/ViewerContext";
+import { PrivateContent } from "@app/components/shared/PrivateContent";
 
 interface ThumbnailSidebarProps {
   visible: boolean;
@@ -9,7 +9,11 @@ interface ThumbnailSidebarProps {
   activeFileIndex?: number;
 }
 
-export function ThumbnailSidebar({ visible, onToggle: _onToggle, activeFileIndex }: ThumbnailSidebarProps) {
+export function ThumbnailSidebar({
+  visible,
+  onToggle: _onToggle,
+  activeFileIndex,
+}: ThumbnailSidebarProps) {
   const { getScrollState, scrollActions, getThumbnailAPI } = useViewer();
   const [thumbnails, setThumbnails] = useState<{ [key: number]: string }>({});
 
@@ -20,7 +24,7 @@ export function ThumbnailSidebar({ visible, onToggle: _onToggle, activeFileIndex
   useEffect(() => {
     // Revoke old blob URLs to prevent memory leaks
     Object.values(thumbnails).forEach((thumbUrl) => {
-      if (typeof thumbUrl === 'string' && thumbUrl.startsWith('blob:')) {
+      if (typeof thumbUrl === "string" && thumbUrl.startsWith("blob:")) {
         URL.revokeObjectURL(thumbUrl);
       }
     });
@@ -38,7 +42,7 @@ export function ThumbnailSidebar({ visible, onToggle: _onToggle, activeFileIndex
     if (!visible) {
       Object.values(thumbnailsRef.current).forEach((thumbUrl) => {
         // Only revoke if it's a blob URL (not 'error')
-        if (typeof thumbUrl === 'string' && thumbUrl.startsWith('blob:')) {
+        if (typeof thumbUrl === "string" && thumbUrl.startsWith("blob:")) {
           URL.revokeObjectURL(thumbUrl);
         }
       });
@@ -50,7 +54,7 @@ export function ThumbnailSidebar({ visible, onToggle: _onToggle, activeFileIndex
   useEffect(() => {
     return () => {
       Object.values(thumbnailsRef.current).forEach((thumbUrl) => {
-        if (typeof thumbUrl === 'string' && thumbUrl.startsWith('blob:')) {
+        if (typeof thumbUrl === "string" && thumbUrl.startsWith("blob:")) {
           URL.revokeObjectURL(thumbUrl);
         }
       });
@@ -65,7 +69,10 @@ export function ThumbnailSidebar({ visible, onToggle: _onToggle, activeFileIndex
     let isCancelled = false;
 
     const generateThumbnails = async () => {
-      const allPages = Array.from({ length: scrollState.totalPages }, (_, i) => i);
+      const allPages = Array.from(
+        { length: scrollState.totalPages },
+        (_, i) => i,
+      );
       const currentPage = scrollState.currentPage - 1;
 
       // Group pages by priority:
@@ -73,9 +80,11 @@ export function ThumbnailSidebar({ visible, onToggle: _onToggle, activeFileIndex
       // 2. Visible neighbors (current +/- 3)
       // 3. Everything else
       const prioritized = [
-        ...allPages.filter(i => i === currentPage),
-        ...allPages.filter(i => i !== currentPage && Math.abs(i - currentPage) <= 3),
-        ...allPages.filter(i => Math.abs(i - currentPage) > 3)
+        ...allPages.filter((i) => i === currentPage),
+        ...allPages.filter(
+          (i) => i !== currentPage && Math.abs(i - currentPage) <= 3,
+        ),
+        ...allPages.filter((i) => Math.abs(i - currentPage) > 3),
       ];
 
       const CONCURRENCY_LIMIT = 3;
@@ -99,16 +108,20 @@ export function ThumbnailSidebar({ visible, onToggle: _onToggle, activeFileIndex
           }
           const thumbUrl = URL.createObjectURL(thumbBlob);
 
-          setThumbnails(prev => ({
+          setThumbnails((prev) => ({
             ...prev,
-            [pageIndex]: thumbUrl
+            [pageIndex]: thumbUrl,
           }));
         } catch (error) {
-          console.error('Failed to generate thumbnail for page', pageIndex + 1, error);
+          console.error(
+            "Failed to generate thumbnail for page",
+            pageIndex + 1,
+            error,
+          );
           if (!isCancelled) {
-            setThumbnails(prev => ({
+            setThumbnails((prev) => ({
               ...prev,
-              [pageIndex]: 'error'
+              [pageIndex]: "error",
             }));
           }
         }
@@ -117,7 +130,9 @@ export function ThumbnailSidebar({ visible, onToggle: _onToggle, activeFileIndex
       };
 
       // Start initial concurrent batch
-      const workers = Array.from({ length: CONCURRENCY_LIMIT }, () => processNext());
+      const workers = Array.from({ length: CONCURRENCY_LIMIT }, () =>
+        processNext(),
+      );
       await Promise.all(workers);
     };
 
@@ -139,117 +154,133 @@ export function ThumbnailSidebar({ visible, onToggle: _onToggle, activeFileIndex
       {visible && (
         <Box
           style={{
-            position: 'fixed',
+            position: "fixed",
             right: 0,
             top: 0,
             bottom: 0,
-            width: '15rem',
-            backgroundColor: 'var(--bg-surface)',
-            borderLeft: '1px solid var(--border-subtle)',
+            width: "15rem",
+            backgroundColor: "var(--bg-surface)",
+            borderLeft: "1px solid var(--border-subtle)",
             zIndex: 998,
-            display: 'flex',
-            flexDirection: 'column',
-            boxShadow: '-2px 0 8px rgba(0, 0, 0, 0.1)'
+            display: "flex",
+            flexDirection: "column",
+            boxShadow: "-2px 0 8px rgba(0, 0, 0, 0.1)",
           }}
         >
           {/* Thumbnails Container */}
           <ScrollArea style={{ flex: 1 }}>
             <Box p="sm">
-              <div style={{
-                display: 'flex',
-                flexDirection: 'column',
-                gap: '12px'
-              }}>
-                {Array.from({ length: scrollState.totalPages }, (_, pageIndex) => (
-                  <Box
-                    key={pageIndex}
-                    onClick={() => handlePageClick(pageIndex)}
-                    style={{
-                      cursor: 'pointer',
-                      borderRadius: '8px',
-                      padding: '8px',
-                      backgroundColor: scrollState.currentPage === pageIndex + 1
-                        ? 'var(--color-primary-100)'
-                        : 'transparent',
-                      border: scrollState.currentPage === pageIndex + 1
-                        ? '2px solid var(--color-primary-500)'
-                        : '2px solid transparent',
-                      transition: 'all 0.2s ease',
-                      display: 'flex',
-                      flexDirection: 'column',
-                      alignItems: 'center',
-                      gap: '8px'
-                    }}
-                    onMouseEnter={(e) => {
-                      if (scrollState.currentPage !== pageIndex + 1) {
-                        e.currentTarget.style.backgroundColor = 'var(--hover-bg)';
-                      }
-                    }}
-                    onMouseLeave={(e) => {
-                      if (scrollState.currentPage !== pageIndex + 1) {
-                        e.currentTarget.style.backgroundColor = 'transparent';
-                      }
-                    }}
-                  >
-                    {/* Thumbnail Image */}
-                    {thumbnails[pageIndex] && thumbnails[pageIndex] !== 'error' ? (
-                      <PrivateContent>
-                        <img
-                          src={thumbnails[pageIndex]}
-                          alt={`Page ${pageIndex + 1} thumbnail`}
+              <div
+                style={{
+                  display: "flex",
+                  flexDirection: "column",
+                  gap: "12px",
+                }}
+              >
+                {Array.from(
+                  { length: scrollState.totalPages },
+                  (_, pageIndex) => (
+                    <Box
+                      key={pageIndex}
+                      onClick={() => handlePageClick(pageIndex)}
+                      style={{
+                        cursor: "pointer",
+                        borderRadius: "8px",
+                        padding: "8px",
+                        backgroundColor:
+                          scrollState.currentPage === pageIndex + 1
+                            ? "var(--color-primary-100)"
+                            : "transparent",
+                        border:
+                          scrollState.currentPage === pageIndex + 1
+                            ? "2px solid var(--color-primary-500)"
+                            : "2px solid transparent",
+                        transition: "all 0.2s ease",
+                        display: "flex",
+                        flexDirection: "column",
+                        alignItems: "center",
+                        gap: "8px",
+                      }}
+                      onMouseEnter={(e) => {
+                        if (scrollState.currentPage !== pageIndex + 1) {
+                          e.currentTarget.style.backgroundColor =
+                            "var(--hover-bg)";
+                        }
+                      }}
+                      onMouseLeave={(e) => {
+                        if (scrollState.currentPage !== pageIndex + 1) {
+                          e.currentTarget.style.backgroundColor = "transparent";
+                        }
+                      }}
+                    >
+                      {/* Thumbnail Image */}
+                      {thumbnails[pageIndex] &&
+                      thumbnails[pageIndex] !== "error" ? (
+                        <PrivateContent>
+                          <img
+                            src={thumbnails[pageIndex]}
+                            alt={`Page ${pageIndex + 1} thumbnail`}
+                            style={{
+                              maxWidth: "100%",
+                              height: "auto",
+                              borderRadius: "4px",
+                              boxShadow: "0 2px 4px rgba(0, 0, 0, 0.1)",
+                              border: "1px solid var(--border-subtle)",
+                            }}
+                          />
+                        </PrivateContent>
+                      ) : thumbnails[pageIndex] === "error" ? (
+                        <div
                           style={{
-                            maxWidth: '100%',
-                            height: 'auto',
-                            borderRadius: '4px',
-                            boxShadow: '0 2px 4px rgba(0, 0, 0, 0.1)',
-                            border: '1px solid var(--border-subtle)'
+                            width: "11.5rem",
+                            height: "15rem",
+                            backgroundColor: "var(--color-red-50)",
+                            border: "1px solid var(--color-red-200)",
+                            borderRadius: "4px",
+                            display: "flex",
+                            alignItems: "center",
+                            justifyContent: "center",
+                            color: "var(--color-red-500)",
+                            fontSize: "12px",
                           }}
-                        />
-                      </PrivateContent>
-                    ) : thumbnails[pageIndex] === 'error' ? (
-                      <div style={{
-                        width: '11.5rem',
-                        height: '15rem',
-                        backgroundColor: 'var(--color-red-50)',
-                        border: '1px solid var(--color-red-200)',
-                        borderRadius: '4px',
-                        display: 'flex',
-                        alignItems: 'center',
-                        justifyContent: 'center',
-                        color: 'var(--color-red-500)',
-                        fontSize: '12px'
-                      }}>
-                        Failed
-                      </div>
-                    ) : (
-                      <div style={{
-                        width: '11.5rem',
-                        height: '15rem',
-                        backgroundColor: 'var(--bg-muted)',
-                        border: '1px solid var(--border-subtle)',
-                        borderRadius: '4px',
-                        display: 'flex',
-                        alignItems: 'center',
-                        justifyContent: 'center',
-                        color: 'var(--text-muted)',
-                        fontSize: '12px'
-                      }}>
-                        Loading...
-                      </div>
-                    )}
+                        >
+                          Failed
+                        </div>
+                      ) : (
+                        <div
+                          style={{
+                            width: "11.5rem",
+                            height: "15rem",
+                            backgroundColor: "var(--bg-muted)",
+                            border: "1px solid var(--border-subtle)",
+                            borderRadius: "4px",
+                            display: "flex",
+                            alignItems: "center",
+                            justifyContent: "center",
+                            color: "var(--text-muted)",
+                            fontSize: "12px",
+                          }}
+                        >
+                          Loading...
+                        </div>
+                      )}
 
-                    {/* Page Number */}
-                    <div style={{
-                      fontSize: '12px',
-                      fontWeight: 500,
-                      color: scrollState.currentPage === pageIndex + 1
-                        ? 'var(--color-primary-500)'
-                        : 'var(--text-muted)'
-                    }}>
-                      Page {pageIndex + 1}
-                    </div>
-                  </Box>
-                ))}
+                      {/* Page Number */}
+                      <div
+                        style={{
+                          fontSize: "12px",
+                          fontWeight: 500,
+                          color:
+                            scrollState.currentPage === pageIndex + 1
+                              ? "var(--color-primary-500)"
+                              : "var(--text-muted)",
+                        }}
+                      >
+                        Page {pageIndex + 1}
+                      </div>
+                    </Box>
+                  ),
+                )}
               </div>
             </Box>
           </ScrollArea>
diff --git a/frontend/src/core/components/viewer/Viewer.tsx b/frontend/src/core/components/viewer/Viewer.tsx
index adea7d8145..b8fec6defb 100644
--- a/frontend/src/core/components/viewer/Viewer.tsx
+++ b/frontend/src/core/components/viewer/Viewer.tsx
@@ -1,8 +1,11 @@
-import { useMemo } from 'react';
-import EmbedPdfViewer from '@app/components/viewer/EmbedPdfViewer';
-import { NonPdfViewerWrapper, type ViewerProps } from '@app/components/viewer/NonPdfViewer';
-import { useFileState } from '@app/contexts/FileContext';
-import { isPdfFile } from '@app/utils/fileUtils';
+import { useMemo } from "react";
+import EmbedPdfViewer from "@app/components/viewer/EmbedPdfViewer";
+import {
+  NonPdfViewerWrapper,
+  type ViewerProps,
+} from "@app/components/viewer/NonPdfViewer";
+import { useFileState } from "@app/contexts/FileContext";
+import { isPdfFile } from "@app/utils/fileUtils";
 
 export type { ViewerProps };
 
diff --git a/frontend/src/core/components/viewer/ZoomAPIBridge.tsx b/frontend/src/core/components/viewer/ZoomAPIBridge.tsx
index 1b0ea744d4..2501ddfb79 100644
--- a/frontend/src/core/components/viewer/ZoomAPIBridge.tsx
+++ b/frontend/src/core/components/viewer/ZoomAPIBridge.tsx
@@ -1,17 +1,21 @@
-import { useCallback, useEffect, useRef, useState } from 'react';
-import { useZoom, ZoomMode } from '@embedpdf/plugin-zoom/react';
-import { useSpread, SpreadMode } from '@embedpdf/plugin-spread/react';
-import { useViewer } from '@app/contexts/ViewerContext';
-import { useActiveDocumentId } from '@app/components/viewer/useActiveDocumentId';
-import { useFileState } from '@app/contexts/FileContext';
+import { useCallback, useEffect, useRef, useState } from "react";
+import { useZoom, ZoomMode } from "@embedpdf/plugin-zoom/react";
+import { useSpread, SpreadMode } from "@embedpdf/plugin-spread/react";
+import { useViewer } from "@app/contexts/ViewerContext";
+import { useActiveDocumentId } from "@app/components/viewer/useActiveDocumentId";
+import { useFileState } from "@app/contexts/FileContext";
 import {
   determineAutoZoom,
   DEFAULT_FALLBACK_ZOOM,
   DEFAULT_VISIBILITY_THRESHOLD,
   useFitWidthResize,
-} from '@app/utils/viewerZoom';
-import { getFirstPageAspectRatioFromStub } from '@app/utils/pageMetadata';
-import { useDocumentReady } from '@app/components/viewer/hooks/useDocumentReady';
+} from "@app/utils/viewerZoom";
+import { getFirstPageAspectRatioFromStub } from "@app/utils/pageMetadata";
+import { useDocumentReady } from "@app/components/viewer/hooks/useDocumentReady";
+import {
+  preferencesService,
+  type ViewerZoomSetting,
+} from "@app/services/preferencesService";
 
 /**
  * Connects the PDF zoom plugin to the shared ViewerContext.
@@ -100,7 +104,6 @@ function ZoomAPIBridgeInner({ documentId }: { documentId: string }) {
     }
   }, [spreadMode, zoomLevel, scheduleAutoZoom, requestFitWidth]);
 
-
   const isManagedZoom =
     !!zoom &&
     (zoomLevel === ZoomMode.FitWidth ||
@@ -138,7 +141,10 @@ function ZoomAPIBridgeInner({ documentId }: { documentId: string }) {
       return;
     }
 
-    const applyTrackedZoom = (level: number | ZoomMode, effectiveZoom: number) => {
+    const applyTrackedZoom = (
+      level: number | ZoomMode,
+      effectiveZoom: number,
+    ) => {
       zoom.requestZoom(level, { vx: 0.5, vy: 0 });
       lastAppliedZoom.current = effectiveZoom;
       triggerImmediateZoomUpdate(Math.round(effectiveZoom * 100));
@@ -155,6 +161,22 @@ function ZoomAPIBridgeInner({ documentId }: { documentId: string }) {
         return;
       }
 
+      // Check user preference for default viewer zoom
+      const zoomPref: ViewerZoomSetting =
+        preferencesService.getPreference("defaultViewerZoom");
+      if (zoomPref !== "auto") {
+        if (zoomPref === "fitWidth") {
+          applyTrackedZoom(ZoomMode.FitWidth, fitWidthZoom);
+        } else if (zoomPref === "fitPage") {
+          applyTrackedZoom(ZoomMode.FitPage, fitWidthZoom);
+        } else {
+          // Numeric zoom: '50', '75', '100', '125', '150', '200'
+          const numericZoom = parseInt(zoomPref, 10) / 100;
+          applyTrackedZoom(numericZoom, numericZoom);
+        }
+        return;
+      }
+
       const viewportWidth = window.innerWidth ?? 0;
       const viewportHeight = window.innerHeight ?? 0;
 
@@ -173,12 +195,12 @@ function ZoomAPIBridgeInner({ documentId }: { documentId: string }) {
         fallbackZoom: DEFAULT_FALLBACK_ZOOM,
       });
 
-      if (decision.type === 'fallback') {
+      if (decision.type === "fallback") {
         applyTrackedZoom(decision.zoom, decision.zoom);
         return;
       }
 
-      if (decision.type === 'fitWidth') {
+      if (decision.type === "fitWidth") {
         applyTrackedZoom(ZoomMode.FitWidth, fitWidthZoom);
         return;
       }
@@ -217,13 +239,15 @@ function ZoomAPIBridgeInner({ documentId }: { documentId: string }) {
       return;
     }
 
-    zoomSubscriptionRef.current = zoom.onZoomChange((event: { newZoom?: number }) => {
-      if (typeof event?.newZoom !== 'number') {
-        return;
-      }
-      lastAppliedZoom.current = event.newZoom;
-      triggerImmediateZoomUpdate(Math.round(event.newZoom * 100));
-    });
+    zoomSubscriptionRef.current = zoom.onZoomChange(
+      (event: { newZoom?: number }) => {
+        if (typeof event?.newZoom !== "number") {
+          return;
+        }
+        lastAppliedZoom.current = event.newZoom;
+        triggerImmediateZoomUpdate(Math.round(event.newZoom * 100));
+      },
+    );
 
     return () => {
       if (zoomSubscriptionRef.current) {
@@ -253,7 +277,7 @@ function ZoomAPIBridgeInner({ documentId }: { documentId: string }) {
 
     triggerImmediateZoomUpdate(newState.zoomPercent);
 
-    registerBridge('zoom', {
+    registerBridge("zoom", {
       state: newState,
       api: currentZoom,
     });
diff --git a/frontend/src/core/components/viewer/constants/search.ts b/frontend/src/core/components/viewer/constants/search.ts
index 0da10a7cb6..7b9df3a736 100644
--- a/frontend/src/core/components/viewer/constants/search.ts
+++ b/frontend/src/core/components/viewer/constants/search.ts
@@ -1,7 +1,7 @@
 export const SEARCH_CONSTANTS = {
   HIGHLIGHT_COLORS: {
-    BACKGROUND: '#ffff00',
-    ACTIVE_BACKGROUND: '#ff6b35',
+    BACKGROUND: "#ffff00",
+    ACTIVE_BACKGROUND: "#ff6b35",
     OPACITY: 0.4,
   },
   TIMING: {
@@ -11,5 +11,5 @@ export const SEARCH_CONSTANTS = {
     HIGHLIGHT_PADDING: 2,
     MIN_SEARCH_LENGTH: 1,
     MAX_RESULTS_DISPLAY: 100,
-  }
-} as const;
\ No newline at end of file
+  },
+} as const;
diff --git a/frontend/src/core/components/viewer/hooks/useDocumentReady.ts b/frontend/src/core/components/viewer/hooks/useDocumentReady.ts
index ba52a73802..10c0dba8cb 100644
--- a/frontend/src/core/components/viewer/hooks/useDocumentReady.ts
+++ b/frontend/src/core/components/viewer/hooks/useDocumentReady.ts
@@ -1,5 +1,5 @@
-import { useState, useEffect } from 'react';
-import { useDocumentManagerCapability } from '@embedpdf/plugin-document-manager/react';
+import { useState, useEffect } from "react";
+import { useDocumentManagerCapability } from "@embedpdf/plugin-document-manager/react";
 
 /**
  * useDocumentReady - Custom hook to track whether a PDF document is fully loaded
@@ -13,7 +13,8 @@ import { useDocumentManagerCapability } from '@embedpdf/plugin-document-manager/
  * needed.
  */
 export function useDocumentReady() {
-  const { provides: documentManagerCapability } = useDocumentManagerCapability();
+  const { provides: documentManagerCapability } =
+    useDocumentManagerCapability();
   const [documentReady, setDocumentReady] = useState(false);
 
   useEffect(() => {
@@ -24,11 +25,13 @@ export function useDocumentReady() {
 
     let mounted = true;
 
-    const unsubOpen = documentManagerCapability.onDocumentOpened?.((event: any) => {
-      if (mounted && (event?.documentId || event?.id)) {
-        setDocumentReady(true);
-      }
-    });
+    const unsubOpen = documentManagerCapability.onDocumentOpened?.(
+      (event: any) => {
+        if (mounted && (event?.documentId || event?.id)) {
+          setDocumentReady(true);
+        }
+      },
+    );
 
     const unsubClose = documentManagerCapability.onDocumentClosed?.(() => {
       if (!mounted) return;
@@ -54,10 +57,10 @@ export function useDocumentReady() {
 
     return () => {
       mounted = false;
-      if (typeof unsubOpen === 'function') {
+      if (typeof unsubOpen === "function") {
         unsubOpen();
       }
-      if (typeof unsubClose === 'function') {
+      if (typeof unsubClose === "function") {
         unsubClose();
       }
     };
diff --git a/frontend/src/core/components/viewer/layerUtils.ts b/frontend/src/core/components/viewer/layerUtils.ts
index d7923b3d4b..0843fde3b6 100644
--- a/frontend/src/core/components/viewer/layerUtils.ts
+++ b/frontend/src/core/components/viewer/layerUtils.ts
@@ -10,12 +10,13 @@ export interface LayerInfo {
  * Returns a flat list of all OCG groups with their names and default visibility.
  */
 export async function readPdfLayers(file: Blob): Promise<LayerInfo[]> {
-  const { getDocument, GlobalWorkerOptions } = await import('pdfjs-dist/legacy/build/pdf.mjs');
+  const { getDocument, GlobalWorkerOptions } =
+    await import("pdfjs-dist/legacy/build/pdf.mjs");
 
   if (!GlobalWorkerOptions.workerSrc) {
     GlobalWorkerOptions.workerSrc = new URL(
-      'pdfjs-dist/legacy/build/pdf.worker.min.mjs',
-      import.meta.url
+      "pdfjs-dist/legacy/build/pdf.worker.min.mjs",
+      import.meta.url,
     ).toString();
   }
 
@@ -68,12 +69,12 @@ export async function readPdfLayers(file: Blob): Promise<LayerInfo[]> {
 function buildLayerTree(
   order: any[],
   groups: Record<string, any>,
-  visited = new Set<string>()
+  visited = new Set<string>(),
 ): LayerInfo[] {
   const result: LayerInfo[] = [];
 
   for (const item of order) {
-    if (typeof item === 'string') {
+    if (typeof item === "string") {
       // It's an OCG id
       if (visited.has(item)) continue;
       visited.add(item);
@@ -89,16 +90,21 @@ function buildLayerTree(
       // Nested group (unlabeled)
       const children = buildLayerTree(item, groups, visited);
       result.push(...children);
-    } else if (item && typeof item === 'object') {
+    } else if (item && typeof item === "object") {
       // Named group with nested items
-      const { name, order: subOrder } = item as { name?: string; order?: any[] };
-      const children = subOrder ? buildLayerTree(subOrder, groups, visited) : [];
+      const { name, order: subOrder } = item as {
+        name?: string;
+        order?: any[];
+      };
+      const children = subOrder
+        ? buildLayerTree(subOrder, groups, visited)
+        : [];
       if (name && children.length > 0) {
         // Use the first child's id as a synthetic group id
         result.push({
           id: `group-${name}`,
           name: name,
-          visible: children.every(c => c.visible),
+          visible: children.every((c) => c.visible),
           children,
         });
       } else {
@@ -121,20 +127,22 @@ function buildLayerTree(
  */
 export async function applyOCGVisibilityToPdf(
   pdfBytes: ArrayBuffer,
-  layerVisibility: Record<string, boolean>
+  layerVisibility: Record<string, boolean>,
 ): Promise<Uint8Array> {
   const { PDFDocument, PDFDict, PDFName, PDFArray, PDFString, PDFHexString } =
-    await import('@cantoo/pdf-lib');
+    await import("@cantoo/pdf-lib");
 
   const doc = await PDFDocument.load(pdfBytes, { ignoreEncryption: true });
   const context = doc.context;
 
   // Access the catalog via the trailer's Root reference
   const catalogRef = context.trailerInfo.Root;
-  const catalog = context.lookup(catalogRef) as unknown as typeof PDFDict.prototype;
+  const catalog = context.lookup(
+    catalogRef,
+  ) as unknown as typeof PDFDict.prototype;
 
   // Get OCProperties dict (may be a direct dict or an indirect reference)
-  const ocPropsRaw = (catalog as any).lookup(PDFName.of('OCProperties'));
+  const ocPropsRaw = (catalog as any).lookup(PDFName.of("OCProperties"));
   if (!ocPropsRaw) {
     return doc.save();
   }
@@ -143,14 +151,14 @@ export async function applyOCGVisibilityToPdf(
     : context.lookup(ocPropsRaw)) as unknown as typeof PDFDict.prototype;
 
   // Get the /OCGs array
-  const ocgsRaw = (ocProps as any).lookup(PDFName.of('OCGs'));
+  const ocgsRaw = (ocProps as any).lookup(PDFName.of("OCGs"));
   if (!(ocgsRaw instanceof PDFArray)) {
     return doc.save();
   }
   const ocgsArray = ocgsRaw as unknown as typeof PDFArray.prototype;
 
   // Get or create the /D (default config) dict
-  const dRaw = (ocProps as any).lookup(PDFName.of('D'));
+  const dRaw = (ocProps as any).lookup(PDFName.of("D"));
   if (!dRaw) {
     return doc.save();
   }
@@ -165,14 +173,17 @@ export async function applyOCGVisibilityToPdf(
   const size = (ocgsArray as any).size() as number;
   for (let i = 0; i < size; i++) {
     const ocgRef = (ocgsArray as any).get(i);
-    const ocgDict = context.lookup(ocgRef) as unknown as typeof PDFDict.prototype;
+    const ocgDict = context.lookup(
+      ocgRef,
+    ) as unknown as typeof PDFDict.prototype;
     if (!ocgDict) continue;
 
     // Get the OCG name
-    const nameRaw = (ocgDict as any).lookup(PDFName.of('Name'));
-    let ocgName = '';
+    const nameRaw = (ocgDict as any).lookup(PDFName.of("Name"));
+    let ocgName = "";
     if (nameRaw instanceof PDFString || nameRaw instanceof PDFHexString) {
-      ocgName = (nameRaw as any).decodeText?.() ?? (nameRaw as any).asString?.() ?? '';
+      ocgName =
+        (nameRaw as any).decodeText?.() ?? (nameRaw as any).asString?.() ?? "";
     } else if (nameRaw) {
       ocgName = String(nameRaw);
     }
@@ -189,25 +200,25 @@ export async function applyOCGVisibilityToPdf(
 
   // Set /BaseState to /OFF so all layers start hidden, then /ON lists visible ones.
   // This is unambiguous and avoids conflicts between /BaseState and /ON//OFF.
-  (dDict as any).set(PDFName.of('BaseState'), PDFName.of('OFF'));
+  (dDict as any).set(PDFName.of("BaseState"), PDFName.of("OFF"));
 
   // Set /ON to only the visible layers
   if (onRefs.length > 0) {
-    (dDict as any).set(PDFName.of('ON'), context.obj(onRefs));
+    (dDict as any).set(PDFName.of("ON"), context.obj(onRefs));
   } else {
-    (dDict as any).delete?.(PDFName.of('ON'));
+    (dDict as any).delete?.(PDFName.of("ON"));
   }
 
   // Set /OFF to only the hidden layers (for viewers that check it)
   if (offRefs.length > 0) {
-    (dDict as any).set(PDFName.of('OFF'), context.obj(offRefs));
+    (dDict as any).set(PDFName.of("OFF"), context.obj(offRefs));
   } else {
-    (dDict as any).delete?.(PDFName.of('OFF'));
+    (dDict as any).delete?.(PDFName.of("OFF"));
   }
 
   // Remove /AS (auto-state) array — it can contain usage-based overrides
   // (e.g., print vs view) that conflict with our explicit visibility settings.
-  (dDict as any).delete?.(PDFName.of('AS'));
+  (dDict as any).delete?.(PDFName.of("AS"));
 
   return doc.save();
 }
diff --git a/frontend/src/core/components/viewer/nonpdf/CsvViewer.tsx b/frontend/src/core/components/viewer/nonpdf/CsvViewer.tsx
index 298109a9e7..ac01d40d60 100644
--- a/frontend/src/core/components/viewer/nonpdf/CsvViewer.tsx
+++ b/frontend/src/core/components/viewer/nonpdf/CsvViewer.tsx
@@ -1,15 +1,24 @@
-import React, { useEffect, useMemo, useState } from 'react';
-import { Badge, Center, Group, Paper, ScrollArea, Stack, Table, Text } from '@mantine/core';
-import SortIcon from '@mui/icons-material/Sort';
-import { useTranslation } from 'react-i18next';
+import React, { useEffect, useMemo, useState } from "react";
+import {
+  Badge,
+  Center,
+  Group,
+  Paper,
+  ScrollArea,
+  Stack,
+  Table,
+  Text,
+} from "@mantine/core";
+import SortIcon from "@mui/icons-material/Sort";
+import { useTranslation } from "react-i18next";
 
-import { formatFileSize } from '@app/utils/fileUtils';
+import { formatFileSize } from "@app/utils/fileUtils";
 
 // ─── CSV parser ───────────────────────────────────────────────────────────────
 
 function parseCsv(text: string, delimiter: string): string[][] {
   const rows: string[][] = [];
-  let field = '';
+  let field = "";
   let inQuotes = false;
   let row: string[] = [];
 
@@ -30,16 +39,16 @@ function parseCsv(text: string, delimiter: string): string[][] {
       inQuotes = true;
     } else if (ch === delimiter) {
       row.push(field);
-      field = '';
-    } else if (ch === '\r' && next === '\n') {
+      field = "";
+    } else if (ch === "\r" && next === "\n") {
       row.push(field);
-      field = '';
+      field = "";
       rows.push(row);
       row = [];
       i++;
-    } else if (ch === '\n' || ch === '\r') {
+    } else if (ch === "\n" || ch === "\r") {
       row.push(field);
-      field = '';
+      field = "";
       rows.push(row);
       row = [];
     } else {
@@ -51,7 +60,7 @@ function parseCsv(text: string, delimiter: string): string[][] {
     rows.push(row);
   }
   // Remove trailing empty row
-  if (rows.length > 0 && rows[rows.length - 1].every(f => f === '')) {
+  if (rows.length > 0 && rows[rows.length - 1].every((f) => f === "")) {
     rows.pop();
   }
   return rows;
@@ -73,8 +82,8 @@ export function CsvViewer({ file, isTsv }: CsvViewerProps) {
 
   useEffect(() => {
     setLoading(true);
-    file.text().then(text => {
-      const delimiter = isTsv ? '\t' : ',';
+    file.text().then((text) => {
+      const delimiter = isTsv ? "\t" : ",";
       setRows(parseCsv(text, delimiter));
       setLoading(false);
     });
@@ -86,18 +95,19 @@ export function CsvViewer({ file, isTsv }: CsvViewerProps) {
   const sortedDataRows = useMemo(() => {
     if (sortCol === null) return dataRows;
     return [...dataRows].sort((a, b) => {
-      const av = a[sortCol] ?? '';
-      const bv = b[sortCol] ?? '';
+      const av = a[sortCol] ?? "";
+      const bv = b[sortCol] ?? "";
       const numA = Number(av);
       const numB = Number(bv);
-      const cmp = (!isNaN(numA) && !isNaN(numB)) ? numA - numB : av.localeCompare(bv);
+      const cmp =
+        !isNaN(numA) && !isNaN(numB) ? numA - numB : av.localeCompare(bv);
       return sortAsc ? cmp : -cmp;
     });
   }, [dataRows, sortCol, sortAsc]);
 
   const handleSort = (colIdx: number) => {
     if (sortCol === colIdx) {
-      setSortAsc(a => !a);
+      setSortAsc((a) => !a);
     } else {
       setSortCol(colIdx);
       setSortAsc(true);
@@ -105,30 +115,61 @@ export function CsvViewer({ file, isTsv }: CsvViewerProps) {
   };
 
   if (loading) {
-    return <Center style={{ flex: 1 }}><Text c="dimmed" size="sm">{t('viewer.nonPdf.loading')}</Text></Center>;
+    return (
+      <Center style={{ flex: 1 }}>
+        <Text c="dimmed" size="sm">
+          {t("viewer.nonPdf.loading")}
+        </Text>
+      </Center>
+    );
   }
 
   if (rows.length === 0) {
-    return <Center style={{ flex: 1 }}><Text c="dimmed" size="sm">{t('viewer.nonPdf.emptyFile')}</Text></Center>;
+    return (
+      <Center style={{ flex: 1 }}>
+        <Text c="dimmed" size="sm">
+          {t("viewer.nonPdf.emptyFile")}
+        </Text>
+      </Center>
+    );
   }
 
   return (
-    <Stack gap={0} style={{ height: '100%', flex: 1 }}>
+    <Stack gap={0} style={{ height: "100%", flex: 1 }}>
       {/* Stats bar */}
-      <Paper radius={0} p="xs" style={{ borderBottom: '1px solid var(--mantine-color-gray-2)', flexShrink: 0 }}>
+      <Paper
+        radius={0}
+        p="xs"
+        style={{
+          borderBottom: "1px solid var(--mantine-color-gray-2)",
+          flexShrink: 0,
+        }}
+      >
         <Group gap="md" align="center">
           <Text size="xs" c="dimmed">
-            {t('viewer.nonPdf.csvStats', { rows: dataRows.length.toLocaleString(), columns: headers.length, size: formatFileSize(file.size) })}
+            {t("viewer.nonPdf.csvStats", {
+              rows: dataRows.length.toLocaleString(),
+              columns: headers.length,
+              size: formatFileSize(file.size),
+            })}
           </Text>
           {sortCol !== null && (
             <Badge
               variant="light"
               color="teal"
               size="xs"
-              style={{ cursor: 'pointer' }}
-              onClick={() => { setSortCol(null); setSortAsc(true); }}
+              style={{ cursor: "pointer" }}
+              onClick={() => {
+                setSortCol(null);
+                setSortAsc(true);
+              }}
             >
-              {t('viewer.nonPdf.sortedBy', { column: headers[sortCol] || t('viewer.nonPdf.columnDefault', { index: sortCol + 1 }) })} {sortAsc ? '\u2191' : '\u2193'} \u2715
+              {t("viewer.nonPdf.sortedBy", {
+                column:
+                  headers[sortCol] ||
+                  t("viewer.nonPdf.columnDefault", { index: sortCol + 1 }),
+              })}{" "}
+              {sortAsc ? "\u2191" : "\u2193"} \u2715
             </Badge>
           )}
         </Group>
@@ -141,28 +182,44 @@ export function CsvViewer({ file, isTsv }: CsvViewerProps) {
           highlightOnHover
           withColumnBorders
           withTableBorder={false}
-          style={{ fontSize: 'var(--mantine-font-size-xs)', whiteSpace: 'nowrap' }}
+          style={{
+            fontSize: "var(--mantine-font-size-xs)",
+            whiteSpace: "nowrap",
+          }}
           stickyHeader
         >
           <Table.Thead>
             <Table.Tr>
-              <Table.Th style={{ width: 48, color: 'var(--mantine-color-dimmed)', textAlign: 'center', paddingInline: 8 }}>
+              <Table.Th
+                style={{
+                  width: 48,
+                  color: "var(--mantine-color-dimmed)",
+                  textAlign: "center",
+                  paddingInline: 8,
+                }}
+              >
                 #
               </Table.Th>
               {headers.map((h, i) => (
                 <Table.Th
                   key={i}
-                  style={{ cursor: 'pointer', paddingInline: 8 }}
+                  style={{ cursor: "pointer", paddingInline: 8 }}
                   onClick={() => handleSort(i)}
                 >
                   <Group gap={4} align="center" wrap="nowrap">
-                    <Text size="xs" fw={600} truncate style={{ maxWidth: 200 }}>{h || t('viewer.nonPdf.columnDefault', { index: i + 1 })}</Text>
+                    <Text size="xs" fw={600} truncate style={{ maxWidth: 200 }}>
+                      {h || t("viewer.nonPdf.columnDefault", { index: i + 1 })}
+                    </Text>
                     <SortIcon
                       style={{
-                        fontSize: '0.85rem',
+                        fontSize: "0.85rem",
                         opacity: sortCol === i ? 1 : 0.3,
-                        color: sortCol === i ? 'var(--mantine-color-teal-6)' : undefined,
-                        transform: sortCol === i && !sortAsc ? 'scaleY(-1)' : undefined,
+                        color:
+                          sortCol === i
+                            ? "var(--mantine-color-teal-6)"
+                            : undefined,
+                        transform:
+                          sortCol === i && !sortAsc ? "scaleY(-1)" : undefined,
                       }}
                     />
                   </Group>
@@ -173,12 +230,23 @@ export function CsvViewer({ file, isTsv }: CsvViewerProps) {
           <Table.Tbody>
             {sortedDataRows.map((row, ri) => (
               <Table.Tr key={ri}>
-                <Table.Td style={{ color: 'var(--mantine-color-dimmed)', textAlign: 'center', paddingInline: 8 }}>
+                <Table.Td
+                  style={{
+                    color: "var(--mantine-color-dimmed)",
+                    textAlign: "center",
+                    paddingInline: 8,
+                  }}
+                >
                   {ri + 1}
                 </Table.Td>
                 {headers.map((_, ci) => (
-                  <Table.Td key={ci} style={{ paddingInline: 8, maxWidth: 300 }}>
-                    <Text size="xs" truncate title={row[ci]}>{row[ci] ?? ''}</Text>
+                  <Table.Td
+                    key={ci}
+                    style={{ paddingInline: 8, maxWidth: 300 }}
+                  >
+                    <Text size="xs" truncate title={row[ci]}>
+                      {row[ci] ?? ""}
+                    </Text>
                   </Table.Td>
                 ))}
               </Table.Tr>
diff --git a/frontend/src/core/components/viewer/nonpdf/HtmlViewer.tsx b/frontend/src/core/components/viewer/nonpdf/HtmlViewer.tsx
index d970c353b8..ee9016b926 100644
--- a/frontend/src/core/components/viewer/nonpdf/HtmlViewer.tsx
+++ b/frontend/src/core/components/viewer/nonpdf/HtmlViewer.tsx
@@ -1,8 +1,8 @@
-import { useEffect, useState } from 'react';
-import { Box, Paper, Text } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
+import { useEffect, useState } from "react";
+import { Box, Paper, Text } from "@mantine/core";
+import { useTranslation } from "react-i18next";
 
-import { formatFileSize } from '@app/utils/fileUtils';
+import { formatFileSize } from "@app/utils/fileUtils";
 
 interface HtmlViewerProps {
   file: File;
@@ -19,16 +19,27 @@ export function HtmlViewer({ file }: HtmlViewerProps) {
   }, [file]);
 
   return (
-    <Box style={{ flex: 1, display: 'flex', flexDirection: 'column' }}>
-      <Paper radius={0} p="xs" style={{ borderBottom: '1px solid var(--mantine-color-gray-2)', flexShrink: 0 }}>
-        <Text size="xs" c="dimmed">{t('viewer.nonPdf.htmlPreviewWarning', { size: formatFileSize(file.size) })}</Text>
+    <Box style={{ flex: 1, display: "flex", flexDirection: "column" }}>
+      <Paper
+        radius={0}
+        p="xs"
+        style={{
+          borderBottom: "1px solid var(--mantine-color-gray-2)",
+          flexShrink: 0,
+        }}
+      >
+        <Text size="xs" c="dimmed">
+          {t("viewer.nonPdf.htmlPreviewWarning", {
+            size: formatFileSize(file.size),
+          })}
+        </Text>
       </Paper>
       {objectUrl && (
         <iframe
           src={objectUrl}
-          title={t('viewer.nonPdf.htmlPreview')}
+          title={t("viewer.nonPdf.htmlPreview")}
           sandbox="allow-scripts"
-          style={{ flex: 1, border: 'none', background: '#fff' }}
+          style={{ flex: 1, border: "none", background: "#fff" }}
         />
       )}
     </Box>
diff --git a/frontend/src/core/components/viewer/nonpdf/ImageViewer.tsx b/frontend/src/core/components/viewer/nonpdf/ImageViewer.tsx
index 187d2b17fb..7d5acad0cc 100644
--- a/frontend/src/core/components/viewer/nonpdf/ImageViewer.tsx
+++ b/frontend/src/core/components/viewer/nonpdf/ImageViewer.tsx
@@ -1,5 +1,5 @@
-import { useEffect, useState } from 'react';
-import { Box } from '@mantine/core';
+import { useEffect, useState } from "react";
+import { Box } from "@mantine/core";
 
 interface ImageViewerProps {
   file: File;
@@ -19,11 +19,11 @@ export function ImageViewer({ file, fileName }: ImageViewerProps) {
     <Box
       style={{
         flex: 1,
-        overflow: 'hidden',
-        background: 'var(--mantine-color-gray-1)',
-        display: 'flex',
-        alignItems: 'center',
-        justifyContent: 'center',
+        overflow: "hidden",
+        background: "var(--mantine-color-gray-1)",
+        display: "flex",
+        alignItems: "center",
+        justifyContent: "center",
       }}
     >
       {objectUrl && (
@@ -32,10 +32,10 @@ export function ImageViewer({ file, fileName }: ImageViewerProps) {
           alt={fileName}
           draggable={false}
           style={{
-            maxWidth: '100%',
-            maxHeight: '100%',
-            objectFit: 'contain',
-            display: 'block',
+            maxWidth: "100%",
+            maxHeight: "100%",
+            objectFit: "contain",
+            display: "block",
           }}
         />
       )}
diff --git a/frontend/src/core/components/viewer/nonpdf/JsonViewer.tsx b/frontend/src/core/components/viewer/nonpdf/JsonViewer.tsx
index 9dabf3f6e1..87551b48eb 100644
--- a/frontend/src/core/components/viewer/nonpdf/JsonViewer.tsx
+++ b/frontend/src/core/components/viewer/nonpdf/JsonViewer.tsx
@@ -1,6 +1,6 @@
-import { useEffect, useState } from 'react';
-import { Box, Center, Paper, ScrollArea, Stack, Text } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
+import { useEffect, useState } from "react";
+import { Box, Center, Paper, ScrollArea, Stack, Text } from "@mantine/core";
+import { useTranslation } from "react-i18next";
 
 interface JsonViewerProps {
   file: File;
@@ -12,7 +12,7 @@ export function JsonViewer({ file }: JsonViewerProps) {
   const [isInvalidJson, setIsInvalidJson] = useState(false);
 
   useEffect(() => {
-    file.text().then(text => {
+    file.text().then((text) => {
       try {
         const parsed = JSON.parse(text);
         setContent(JSON.stringify(parsed, null, 2));
@@ -26,14 +26,30 @@ export function JsonViewer({ file }: JsonViewerProps) {
   }, [file]);
 
   if (content === null) {
-    return <Center style={{ flex: 1 }}><Text c="dimmed" size="sm">{t('viewer.nonPdf.loading')}</Text></Center>;
+    return (
+      <Center style={{ flex: 1 }}>
+        <Text c="dimmed" size="sm">
+          {t("viewer.nonPdf.loading")}
+        </Text>
+      </Center>
+    );
   }
 
   return (
-    <Stack gap={0} style={{ height: '100%', flex: 1 }}>
+    <Stack gap={0} style={{ height: "100%", flex: 1 }}>
       {isInvalidJson && (
-        <Paper radius={0} p="xs" style={{ borderBottom: '1px solid var(--mantine-color-red-2)', background: 'var(--mantine-color-red-0)', flexShrink: 0 }}>
-          <Text size="xs" c="red">{t('viewer.nonPdf.invalidJson')}</Text>
+        <Paper
+          radius={0}
+          p="xs"
+          style={{
+            borderBottom: "1px solid var(--mantine-color-red-2)",
+            background: "var(--mantine-color-red-0)",
+            flexShrink: 0,
+          }}
+        >
+          <Text size="xs" c="red">
+            {t("viewer.nonPdf.invalidJson")}
+          </Text>
         </Paper>
       )}
       <ScrollArea style={{ flex: 1 }} type="auto">
@@ -41,12 +57,12 @@ export function JsonViewer({ file }: JsonViewerProps) {
           component="pre"
           style={{
             margin: 0,
-            padding: 'var(--mantine-spacing-sm)',
-            fontFamily: 'monospace',
-            fontSize: '0.8rem',
+            padding: "var(--mantine-spacing-sm)",
+            fontFamily: "monospace",
+            fontSize: "0.8rem",
             lineHeight: 1.6,
-            whiteSpace: 'pre',
-            overflowX: 'auto',
+            whiteSpace: "pre",
+            overflowX: "auto",
           }}
         >
           {content}
diff --git a/frontend/src/core/components/viewer/nonpdf/NonPdfBanner.tsx b/frontend/src/core/components/viewer/nonpdf/NonPdfBanner.tsx
index b890f889ac..91e73c79c1 100644
--- a/frontend/src/core/components/viewer/nonpdf/NonPdfBanner.tsx
+++ b/frontend/src/core/components/viewer/nonpdf/NonPdfBanner.tsx
@@ -1,8 +1,8 @@
-import { Badge, Box, Button, Group } from '@mantine/core';
-import PictureAsPdfIcon from '@mui/icons-material/PictureAsPdf';
-import { useTranslation } from 'react-i18next';
+import { Badge, Box, Button, Group } from "@mantine/core";
+import PictureAsPdfIcon from "@mui/icons-material/PictureAsPdf";
+import { useTranslation } from "react-i18next";
 
-import type { FileTypeMeta } from '@app/components/viewer/nonpdf/types';
+import type { FileTypeMeta } from "@app/components/viewer/nonpdf/types";
 
 interface NonPdfBannerProps {
   meta: FileTypeMeta;
@@ -18,34 +18,40 @@ export function NonPdfBanner({ meta, onConvertToPdf }: NonPdfBannerProps) {
       wrap="nowrap"
       align="center"
       style={{
-        position: 'absolute',
+        position: "absolute",
         top: 8,
         right: 8,
         zIndex: 10,
-        pointerEvents: 'auto',
+        pointerEvents: "auto",
       }}
     >
       <Badge
         variant="default"
         size="lg"
         leftSection={
-          <Box style={{ display: 'flex', alignItems: 'center', fontSize: '0.85rem' }}>
+          <Box
+            style={{
+              display: "flex",
+              alignItems: "center",
+              fontSize: "0.85rem",
+            }}
+          >
             {meta.icon}
           </Box>
         }
         style={{ fontWeight: 600 }}
       >
-        {t('viewer.nonPdf.fileTypeBadge', { type: meta.label })}
+        {t("viewer.nonPdf.fileTypeBadge", { type: meta.label })}
       </Badge>
       {onConvertToPdf && (
         <Button
           size="xs"
           variant="light"
           color="orange"
-          leftSection={<PictureAsPdfIcon style={{ fontSize: '0.9rem' }} />}
+          leftSection={<PictureAsPdfIcon style={{ fontSize: "0.9rem" }} />}
           onClick={onConvertToPdf}
         >
-          {t('viewer.nonPdf.convertToPdf')}
+          {t("viewer.nonPdf.convertToPdf")}
         </Button>
       )}
     </Group>
diff --git a/frontend/src/core/components/viewer/nonpdf/TextViewer.tsx b/frontend/src/core/components/viewer/nonpdf/TextViewer.tsx
index f25daa21c6..da5c51d21a 100644
--- a/frontend/src/core/components/viewer/nonpdf/TextViewer.tsx
+++ b/frontend/src/core/components/viewer/nonpdf/TextViewer.tsx
@@ -1,8 +1,17 @@
-import React, { useEffect, useState } from 'react';
-import { Box, Center, Checkbox, Group, Paper, ScrollArea, Stack, Text } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
+import React, { useEffect, useState } from "react";
+import {
+  Box,
+  Center,
+  Checkbox,
+  Group,
+  Paper,
+  ScrollArea,
+  Stack,
+  Text,
+} from "@mantine/core";
+import { useTranslation } from "react-i18next";
 
-import { formatFileSize } from '@app/utils/fileUtils';
+import { formatFileSize } from "@app/utils/fileUtils";
 
 // ─── Markdown renderer ────────────────────────────────────────────────────────
 
@@ -17,8 +26,33 @@ function renderInline(text: string): React.ReactNode[] {
     if (match.index > last) parts.push(text.slice(last, match.index));
     if (match[2]) parts.push(<strong key={key++}>{match[2]}</strong>);
     else if (match[3]) parts.push(<em key={key++}>{match[3]}</em>);
-    else if (match[4]) parts.push(<code key={key++} style={{ background: 'var(--mantine-color-gray-1)', padding: '0 3px', borderRadius: 3, fontFamily: 'monospace', fontSize: '0.85em' }}>{match[4]}</code>);
-    else if (match[5]) parts.push(<a key={key++} href={match[6]} target="_blank" rel="noopener noreferrer" style={{ color: 'var(--mantine-color-blue-6)' }}>{match[5]}</a>);
+    else if (match[4])
+      parts.push(
+        <code
+          key={key++}
+          style={{
+            background: "var(--mantine-color-gray-1)",
+            padding: "0 3px",
+            borderRadius: 3,
+            fontFamily: "monospace",
+            fontSize: "0.85em",
+          }}
+        >
+          {match[4]}
+        </code>,
+      );
+    else if (match[5])
+      parts.push(
+        <a
+          key={key++}
+          href={match[6]}
+          target="_blank"
+          rel="noopener noreferrer"
+          style={{ color: "var(--mantine-color-blue-6)" }}
+        >
+          {match[5]}
+        </a>,
+      );
     last = match.index + match[0].length;
   }
   if (last < text.length) parts.push(text.slice(last));
@@ -26,7 +60,7 @@ function renderInline(text: string): React.ReactNode[] {
 }
 
 function renderMarkdown(text: string): React.ReactNode[] {
-  const lines = text.split('\n');
+  const lines = text.split("\n");
   const elements: React.ReactNode[] = [];
   let inCodeBlock = false;
   let codeLines: string[] = [];
@@ -35,12 +69,22 @@ function renderMarkdown(text: string): React.ReactNode[] {
   while (i < lines.length) {
     const line = lines[i];
 
-    if (line.startsWith('```')) {
+    if (line.startsWith("```")) {
       if (inCodeBlock) {
         elements.push(
-          <pre key={i} style={{ background: 'var(--mantine-color-gray-1)', padding: '8px 12px', borderRadius: 4, overflowX: 'auto', fontSize: '0.85em', margin: '4px 0' }}>
-            <code>{codeLines.join('\n')}</code>
-          </pre>
+          <pre
+            key={i}
+            style={{
+              background: "var(--mantine-color-gray-1)",
+              padding: "8px 12px",
+              borderRadius: 4,
+              overflowX: "auto",
+              fontSize: "0.85em",
+              margin: "4px 0",
+            }}
+          >
+            <code>{codeLines.join("\n")}</code>
+          </pre>,
         );
         codeLines = [];
         inCodeBlock = false;
@@ -57,32 +101,56 @@ function renderMarkdown(text: string): React.ReactNode[] {
       continue;
     }
 
-    if (line.startsWith('### ')) {
-      elements.push(<Text key={i} fw={600} size="md" mt="xs" mb={2}>{renderInline(line.slice(4))}</Text>);
-    } else if (line.startsWith('## ')) {
-      elements.push(<Text key={i} fw={700} size="lg" mt="sm" mb={4}>{renderInline(line.slice(3))}</Text>);
-    } else if (line.startsWith('# ')) {
-      elements.push(<Text key={i} fw={800} size="xl" mt="md" mb={6}>{renderInline(line.slice(2))}</Text>);
-    } else if (line.startsWith('- ') || line.startsWith('* ')) {
+    if (line.startsWith("### ")) {
+      elements.push(
+        <Text key={i} fw={600} size="md" mt="xs" mb={2}>
+          {renderInline(line.slice(4))}
+        </Text>,
+      );
+    } else if (line.startsWith("## ")) {
+      elements.push(
+        <Text key={i} fw={700} size="lg" mt="sm" mb={4}>
+          {renderInline(line.slice(3))}
+        </Text>,
+      );
+    } else if (line.startsWith("# ")) {
+      elements.push(
+        <Text key={i} fw={800} size="xl" mt="md" mb={6}>
+          {renderInline(line.slice(2))}
+        </Text>,
+      );
+    } else if (line.startsWith("- ") || line.startsWith("* ")) {
       elements.push(
         <Group key={i} gap={6} align="flex-start" style={{ paddingLeft: 16 }}>
-          <Text size="sm" style={{ lineHeight: 1.6, flexShrink: 0 }}>{'\u2022'}</Text>
-          <Text size="sm" style={{ lineHeight: 1.6 }}>{renderInline(line.slice(2))}</Text>
-        </Group>
+          <Text size="sm" style={{ lineHeight: 1.6, flexShrink: 0 }}>
+            {"\u2022"}
+          </Text>
+          <Text size="sm" style={{ lineHeight: 1.6 }}>
+            {renderInline(line.slice(2))}
+          </Text>
+        </Group>,
       );
     } else if (/^\d+\.\s/.test(line)) {
       const num = line.match(/^(\d+)\.\s/)?.[1];
-      const rest = line.replace(/^\d+\.\s/, '');
+      const rest = line.replace(/^\d+\.\s/, "");
       elements.push(
         <Group key={i} gap={6} align="flex-start" style={{ paddingLeft: 16 }}>
-          <Text size="sm" style={{ lineHeight: 1.6, flexShrink: 0 }}>{num}.</Text>
-          <Text size="sm" style={{ lineHeight: 1.6 }}>{renderInline(rest)}</Text>
-        </Group>
+          <Text size="sm" style={{ lineHeight: 1.6, flexShrink: 0 }}>
+            {num}.
+          </Text>
+          <Text size="sm" style={{ lineHeight: 1.6 }}>
+            {renderInline(rest)}
+          </Text>
+        </Group>,
       );
-    } else if (line.trim() === '' || line === '---' || line === '***') {
+    } else if (line.trim() === "" || line === "---" || line === "***") {
       elements.push(<Box key={i} style={{ height: 8 }} />);
     } else {
-      elements.push(<Text key={i} size="sm" style={{ lineHeight: 1.7 }}>{renderInline(line)}</Text>);
+      elements.push(
+        <Text key={i} size="sm" style={{ lineHeight: 1.7 }}>
+          {renderInline(line)}
+        </Text>,
+      );
     }
     i++;
   }
@@ -107,27 +175,39 @@ export function TextViewer({ file, isMarkdown }: TextViewerProps) {
     file.text().then(setContent);
   }, [file]);
 
-  const lines = content?.split('\n') ?? [];
+  const lines = content?.split("\n") ?? [];
 
   return (
-    <Stack gap={0} style={{ height: '100%', flex: 1 }}>
+    <Stack gap={0} style={{ height: "100%", flex: 1 }}>
       {/* Toolbar */}
-      <Paper radius={0} p="xs" style={{ borderBottom: '1px solid var(--mantine-color-gray-2)', flexShrink: 0 }}>
+      <Paper
+        radius={0}
+        p="xs"
+        style={{
+          borderBottom: "1px solid var(--mantine-color-gray-2)",
+          flexShrink: 0,
+        }}
+      >
         <Group gap="md" align="center">
-          <Text size="xs" c="dimmed">{t('viewer.nonPdf.textStats', { lines: lines.length.toLocaleString(), size: formatFileSize(file.size) })}</Text>
+          <Text size="xs" c="dimmed">
+            {t("viewer.nonPdf.textStats", {
+              lines: lines.length.toLocaleString(),
+              size: formatFileSize(file.size),
+            })}
+          </Text>
           {!isMarkdown && (
             <Checkbox
-              label={<Text size="xs">{t('viewer.nonPdf.lineNumbers')}</Text>}
+              label={<Text size="xs">{t("viewer.nonPdf.lineNumbers")}</Text>}
               checked={showLineNumbers}
-              onChange={e => setShowLineNumbers(e.currentTarget.checked)}
+              onChange={(e) => setShowLineNumbers(e.currentTarget.checked)}
               size="xs"
             />
           )}
           {isMarkdown && (
             <Checkbox
-              label={<Text size="xs">{t('viewer.nonPdf.renderMarkdown')}</Text>}
+              label={<Text size="xs">{t("viewer.nonPdf.renderMarkdown")}</Text>}
               checked={renderMd}
-              onChange={e => setRenderMd(e.currentTarget.checked)}
+              onChange={(e) => setRenderMd(e.currentTarget.checked)}
               size="xs"
             />
           )}
@@ -137,50 +217,56 @@ export function TextViewer({ file, isMarkdown }: TextViewerProps) {
       {/* Content */}
       <ScrollArea style={{ flex: 1 }} p="md">
         {content === null ? (
-          <Center><Text c="dimmed" size="sm">{t('viewer.nonPdf.loading')}</Text></Center>
+          <Center>
+            <Text c="dimmed" size="sm">
+              {t("viewer.nonPdf.loading")}
+            </Text>
+          </Center>
         ) : isMarkdown && renderMd ? (
-          <Box style={{ maxWidth: 800, margin: '0 auto', padding: '8px 0' }}>
+          <Box style={{ maxWidth: 800, margin: "0 auto", padding: "8px 0" }}>
             {renderMarkdown(content)}
           </Box>
         ) : (
           <Box
             component="pre"
             style={{
-              fontFamily: 'monospace',
-              fontSize: '0.8rem',
+              fontFamily: "monospace",
+              fontSize: "0.8rem",
               lineHeight: 1.6,
               margin: 0,
-              whiteSpace: 'pre-wrap',
-              wordBreak: 'break-word',
-              display: 'table',
-              width: '100%',
+              whiteSpace: "pre-wrap",
+              wordBreak: "break-word",
+              display: "table",
+              width: "100%",
             }}
           >
             {lines.map((line, i) => (
-              <Box
-                key={i}
-                component="div"
-                style={{ display: 'table-row' }}
-              >
+              <Box key={i} component="div" style={{ display: "table-row" }}>
                 {showLineNumbers && (
                   <Box
                     component="span"
                     style={{
-                      display: 'table-cell',
+                      display: "table-cell",
                       paddingRight: 16,
                       paddingLeft: 4,
-                      textAlign: 'right',
-                      color: 'var(--mantine-color-gray-5)',
-                      userSelect: 'none',
-                      borderRight: '1px solid var(--mantine-color-gray-2)',
+                      textAlign: "right",
+                      color: "var(--mantine-color-gray-5)",
+                      userSelect: "none",
+                      borderRight: "1px solid var(--mantine-color-gray-2)",
                       minWidth: `${String(lines.length).length + 1}ch`,
                     }}
                   >
                     {i + 1}
                   </Box>
                 )}
-                <Box component="span" style={{ display: 'table-cell', paddingLeft: showLineNumbers ? 12 : 0 }}>
-                  {line || '\u00A0'}
+                <Box
+                  component="span"
+                  style={{
+                    display: "table-cell",
+                    paddingLeft: showLineNumbers ? 12 : 0,
+                  }}
+                >
+                  {line || "\u00A0"}
                 </Box>
               </Box>
             ))}
diff --git a/frontend/src/core/components/viewer/nonpdf/types.ts b/frontend/src/core/components/viewer/nonpdf/types.ts
index 92c69fd88d..6d06d0ffb0 100644
--- a/frontend/src/core/components/viewer/nonpdf/types.ts
+++ b/frontend/src/core/components/viewer/nonpdf/types.ts
@@ -1,12 +1,12 @@
-import React from 'react';
-import ImageIcon from '@mui/icons-material/Image';
-import TableChartIcon from '@mui/icons-material/TableChart';
-import ArticleIcon from '@mui/icons-material/Article';
-import CodeIcon from '@mui/icons-material/Code';
-import DataObjectIcon from '@mui/icons-material/DataObject';
-import HtmlIcon from '@mui/icons-material/Html';
+import React from "react";
+import ImageIcon from "@mui/icons-material/Image";
+import TableChartIcon from "@mui/icons-material/TableChart";
+import ArticleIcon from "@mui/icons-material/Article";
+import CodeIcon from "@mui/icons-material/Code";
+import DataObjectIcon from "@mui/icons-material/DataObject";
+import HtmlIcon from "@mui/icons-material/Html";
 
-import type { NonPdfFileType } from '@app/utils/fileUtils';
+import type { NonPdfFileType } from "@app/utils/fileUtils";
 
 export interface FileTypeMeta {
   label: string;
@@ -20,32 +20,63 @@ export interface FileTypeMeta {
 
 // Shared neutral color scheme for all file type badges — consistent in light & dark mode
 const BADGE_COLORS = {
-  color: 'gray' as const,
-  accentColor: 'var(--mantine-color-gray-6)',
-  borderColor: 'var(--mantine-color-gray-3)',
-  bgColor: 'var(--mantine-color-gray-0)',
-  textColor: 'var(--mantine-color-gray-9)',
+  color: "gray" as const,
+  accentColor: "var(--mantine-color-gray-6)",
+  borderColor: "var(--mantine-color-gray-3)",
+  bgColor: "var(--mantine-color-gray-0)",
+  textColor: "var(--mantine-color-gray-9)",
 };
 
-export function getFileTypeMeta(type: NonPdfFileType, fileName?: string): FileTypeMeta {
+export function getFileTypeMeta(
+  type: NonPdfFileType,
+  fileName?: string,
+): FileTypeMeta {
   switch (type) {
-    case 'image':
-      return { label: 'Image', icon: React.createElement(ImageIcon, { fontSize: 'small' }), ...BADGE_COLORS };
-    case 'csv':
-      return { label: 'Spreadsheet', icon: React.createElement(TableChartIcon, { fontSize: 'small' }), ...BADGE_COLORS };
-    case 'json':
-      return { label: 'JSON', icon: React.createElement(DataObjectIcon, { fontSize: 'small' }), ...BADGE_COLORS };
-    case 'markdown':
-      return { label: 'Markdown', icon: React.createElement(CodeIcon, { fontSize: 'small' }), ...BADGE_COLORS };
-    case 'html':
-      return { label: 'HTML', icon: React.createElement(HtmlIcon, { fontSize: 'small' }), ...BADGE_COLORS };
-    case 'text':
-      return { label: 'Text', icon: React.createElement(ArticleIcon, { fontSize: 'small' }), ...BADGE_COLORS };
+    case "image":
+      return {
+        label: "Image",
+        icon: React.createElement(ImageIcon, { fontSize: "small" }),
+        ...BADGE_COLORS,
+      };
+    case "csv":
+      return {
+        label: "Spreadsheet",
+        icon: React.createElement(TableChartIcon, { fontSize: "small" }),
+        ...BADGE_COLORS,
+      };
+    case "json":
+      return {
+        label: "JSON",
+        icon: React.createElement(DataObjectIcon, { fontSize: "small" }),
+        ...BADGE_COLORS,
+      };
+    case "markdown":
+      return {
+        label: "Markdown",
+        icon: React.createElement(CodeIcon, { fontSize: "small" }),
+        ...BADGE_COLORS,
+      };
+    case "html":
+      return {
+        label: "HTML",
+        icon: React.createElement(HtmlIcon, { fontSize: "small" }),
+        ...BADGE_COLORS,
+      };
+    case "text":
+      return {
+        label: "Text",
+        icon: React.createElement(ArticleIcon, { fontSize: "small" }),
+        ...BADGE_COLORS,
+      };
     default: {
       // For unknown types, derive label from the file extension (e.g. ".docx" → "DOCX")
-      const ext = fileName?.split('.').pop()?.toUpperCase();
-      const label = ext || 'File';
-      return { label, icon: React.createElement(ArticleIcon, { fontSize: 'small' }), ...BADGE_COLORS };
+      const ext = fileName?.split(".").pop()?.toUpperCase();
+      const label = ext || "File";
+      return {
+        label,
+        icon: React.createElement(ArticleIcon, { fontSize: "small" }),
+        ...BADGE_COLORS,
+      };
     }
   }
 }
diff --git a/frontend/src/core/components/viewer/readAloudHighlight.test.ts b/frontend/src/core/components/viewer/readAloudHighlight.test.ts
index 6f1cd540fd..cf2ca9a764 100644
--- a/frontend/src/core/components/viewer/readAloudHighlight.test.ts
+++ b/frontend/src/core/components/viewer/readAloudHighlight.test.ts
@@ -1,15 +1,15 @@
-import { describe, expect, it } from 'vitest';
-import { computeReadAloudHighlightRect } from '@app/components/viewer/readAloudHighlight';
+import { describe, expect, it } from "vitest";
+import { computeReadAloudHighlightRect } from "@app/components/viewer/readAloudHighlight";
 
-describe('computeReadAloudHighlightRect', () => {
-  it('returns page-relative coordinates for an unrotated text item', () => {
+describe("computeReadAloudHighlightRect", () => {
+  it("returns page-relative coordinates for an unrotated text item", () => {
     expect(
       computeReadAloudHighlightRect({
         viewportTransform: [2, 0, 0, -2, 0, 1000],
         textTransform: [1, 0, 0, 1, 120, 300],
         itemWidth: 40,
         itemHeight: 10,
-      })
+      }),
     ).toEqual({
       left: 240,
       top: 380,
@@ -18,14 +18,14 @@ describe('computeReadAloudHighlightRect', () => {
     });
   });
 
-  it('enforces minimum visible highlight dimensions', () => {
+  it("enforces minimum visible highlight dimensions", () => {
     expect(
       computeReadAloudHighlightRect({
         viewportTransform: [1, 0, 0, -1, 0, 600],
         textTransform: [1, 0, 0, 1, 12, 40],
         itemWidth: 2,
         itemHeight: 4,
-      })
+      }),
     ).toEqual({
       left: 12,
       top: 548,
@@ -34,25 +34,25 @@ describe('computeReadAloudHighlightRect', () => {
     });
   });
 
-  it('returns null for invalid geometry', () => {
+  it("returns null for invalid geometry", () => {
     expect(
       computeReadAloudHighlightRect({
         viewportTransform: [1, 0, 0, -1, 0, 600],
         textTransform: [1, 0, 0, 1, 0, 0],
         itemWidth: 10,
         itemHeight: 0,
-      })
+      }),
     ).toBeNull();
   });
 
-  it('returns the correct box for a 90 degree rotated viewport', () => {
+  it("returns the correct box for a 90 degree rotated viewport", () => {
     expect(
       computeReadAloudHighlightRect({
         viewportTransform: [0, 2, 2, 0, 0, 0],
         textTransform: [1, 0, 0, 1, 120, 300],
         itemWidth: 40,
         itemHeight: 10,
-      })
+      }),
     ).toEqual({
       left: 600,
       top: 220,
diff --git a/frontend/src/core/components/viewer/readAloudHighlight.ts b/frontend/src/core/components/viewer/readAloudHighlight.ts
index 5a5db8f765..e50ba178da 100644
--- a/frontend/src/core/components/viewer/readAloudHighlight.ts
+++ b/frontend/src/core/components/viewer/readAloudHighlight.ts
@@ -32,7 +32,12 @@ export function computeReadAloudHighlightRect({
   itemWidth,
   itemHeight,
 }: ReadAloudHighlightParams): ReadAloudHighlightRect | null {
-  if (viewportTransform.length < 6 || textTransform.length < 6 || itemWidth <= 0 || itemHeight <= 0) {
+  if (
+    viewportTransform.length < 6 ||
+    textTransform.length < 6 ||
+    itemWidth <= 0 ||
+    itemHeight <= 0
+  ) {
     return null;
   }
 
diff --git a/frontend/src/core/components/viewer/useActiveDocumentId.ts b/frontend/src/core/components/viewer/useActiveDocumentId.ts
index aff97eeda4..f889e6f8e3 100644
--- a/frontend/src/core/components/viewer/useActiveDocumentId.ts
+++ b/frontend/src/core/components/viewer/useActiveDocumentId.ts
@@ -1,4 +1,4 @@
-import { useActiveDocument } from '@app/components/viewer/ActiveDocumentContext';
+import { useActiveDocument } from "@app/components/viewer/ActiveDocumentContext";
 
 /**
  * Hook to get the currently active document ID.
diff --git a/frontend/src/core/components/viewer/useAnnotationMenuHandlers.ts b/frontend/src/core/components/viewer/useAnnotationMenuHandlers.ts
index 56b4ee9d1d..ae50f5f944 100644
--- a/frontend/src/core/components/viewer/useAnnotationMenuHandlers.ts
+++ b/frontend/src/core/components/viewer/useAnnotationMenuHandlers.ts
@@ -1,24 +1,35 @@
-import { useCallback, useMemo, type RefObject } from 'react';
-import { PdfActionType, PdfAnnotationSubtype, PdfAnnotationReplyType, type PdfAnnotationObject } from '@embedpdf/models';
-import type { TrackedAnnotation, AnnotationScope } from '@embedpdf/plugin-annotation';
-import type { AnnotationObject, AnnotationPatch } from '@app/components/viewer/viewerTypes';
-import type { ScrollActions } from '@app/contexts/viewer/viewerActions';
+import { useCallback, useMemo, type RefObject } from "react";
+import {
+  PdfActionType,
+  PdfAnnotationSubtype,
+  PdfAnnotationReplyType,
+  type PdfAnnotationObject,
+} from "@embedpdf/models";
+import type {
+  TrackedAnnotation,
+  AnnotationScope,
+} from "@embedpdf/plugin-annotation";
+import type {
+  AnnotationObject,
+  AnnotationPatch,
+} from "@app/components/viewer/viewerTypes";
+import type { ScrollActions } from "@app/contexts/viewer/viewerActions";
 
 export type AnnotationType =
-  | 'textMarkup'
-  | 'ink'
-  | 'inkHighlighter'
-  | 'text'
-  | 'note'
-  | 'comment'
-  | 'shape'
-  | 'line'
-  | 'stamp'
-  | 'unknown';
+  | "textMarkup"
+  | "ink"
+  | "inkHighlighter"
+  | "text"
+  | "note"
+  | "comment"
+  | "shape"
+  | "line"
+  | "stamp"
+  | "unknown";
 
 export type FirstLinkTarget =
-  | { type: 'uri'; uri: string }
-  | { type: 'goto'; pageIndex: number };
+  | { type: "uri"; uri: string }
+  | { type: "goto"; pageIndex: number };
 
 interface UseAnnotationMenuHandlersParams {
   annotation: TrackedAnnotation<PdfAnnotationObject> | undefined;
@@ -26,7 +37,12 @@ interface UseAnnotationMenuHandlersParams {
   documentId: string;
   provides: AnnotationScope | null;
   scrollActions: ScrollActions;
-  requestCommentFocus: (documentId: string, pageIndex: number, annotationId: string, hasContent: boolean) => void;
+  requestCommentFocus: (
+    documentId: string,
+    pageIndex: number,
+    annotationId: string,
+    hasContent: boolean,
+  ) => void;
   wrapperRef: RefObject<HTMLDivElement | null>;
 }
 
@@ -50,7 +66,10 @@ export interface AnnotationMenuState {
 export interface AnnotationMenuHandlers {
   onDelete: () => void;
   onEdit: () => void;
-  onColorChange: (color: string, target: 'main' | 'stroke' | 'fill' | 'text' | 'background') => void;
+  onColorChange: (
+    color: string,
+    target: "main" | "stroke" | "fill" | "text" | "background",
+  ) => void;
   onOpacityChange: (opacity: number) => void;
   onWidthChange: (width: number) => void;
   onPropertiesUpdate: (patch: AnnotationPatch) => void;
@@ -69,7 +88,8 @@ export function useAnnotationMenuHandlers({
   scrollActions,
   requestCommentFocus,
   wrapperRef,
-}: UseAnnotationMenuHandlersParams): AnnotationMenuState & AnnotationMenuHandlers {
+}: UseAnnotationMenuHandlersParams): AnnotationMenuState &
+  AnnotationMenuHandlers {
   const obj = annotation?.object as AnnotationObject | undefined;
   const annotationId = obj?.id;
 
@@ -83,65 +103,94 @@ export function useAnnotationMenuHandlers({
   }, [annotationId, provides]);
 
   const firstLinkTarget = useMemo<FirstLinkTarget | null>(() => {
-    const linkObj = (attachedLinks[0]?.object as {
-      target?: {
-        type: string;
-        action?: { type: number; uri?: string; destination?: { pageIndex: number } };
-      };
-    } | undefined);
-    if (!linkObj?.target || linkObj.target.type !== 'action') return null;
+    const linkObj = attachedLinks[0]?.object as
+      | {
+          target?: {
+            type: string;
+            action?: {
+              type: number;
+              uri?: string;
+              destination?: { pageIndex: number };
+            };
+          };
+        }
+      | undefined;
+    if (!linkObj?.target || linkObj.target.type !== "action") return null;
     const act = linkObj.target.action;
-    if (act && act.type === PdfActionType.URI && act.uri) return { type: 'uri', uri: act.uri };
-    if (act && (act.type === PdfActionType.Goto || act.type === PdfActionType.RemoteGoto) && act.destination)
-      return { type: 'goto', pageIndex: act.destination.pageIndex };
+    if (act && act.type === PdfActionType.URI && act.uri)
+      return { type: "uri", uri: act.uri };
+    if (
+      act &&
+      (act.type === PdfActionType.Goto ||
+        act.type === PdfActionType.RemoteGoto) &&
+      act.destination
+    )
+      return { type: "goto", pageIndex: act.destination.pageIndex };
     return null;
   }, [attachedLinks]);
 
   const annotationType = useMemo((): AnnotationType => {
     const type = annotation?.object?.type;
-    const toolId = (annotation?.object as AnnotationObject | undefined)?.customData?.toolId;
+    const toolId = (annotation?.object as AnnotationObject | undefined)
+      ?.customData?.toolId;
 
-    if (type !== undefined && [9, 10, 11, 12].includes(type)) return 'textMarkup';
-    if (type === 15) return toolId === 'inkHighlighter' ? 'inkHighlighter' : 'ink';
-    if (type === 1 && toolId === 'textComment') return 'comment';
-    if (type === 14 && (toolId === 'insertText' || toolId === 'replaceText')) return 'comment';
-    if (type === 3) return 'note';
-    if (type !== undefined && [5, 6, 7].includes(type)) return 'shape';
-    if (type !== undefined && [4, 8].includes(type)) return 'line';
-    if (type === 13) return 'stamp';
-    return 'unknown';
+    if (type !== undefined && [9, 10, 11, 12].includes(type))
+      return "textMarkup";
+    if (type === 15)
+      return toolId === "inkHighlighter" ? "inkHighlighter" : "ink";
+    if (type === 1 && toolId === "textComment") return "comment";
+    if (type === 14 && (toolId === "insertText" || toolId === "replaceText"))
+      return "comment";
+    if (type === 3) return "note";
+    if (type !== undefined && [5, 6, 7].includes(type)) return "shape";
+    if (type !== undefined && [4, 8].includes(type)) return "line";
+    if (type === 13) return "stamp";
+    return "unknown";
   }, [annotation]);
 
   const menuWidth = useMemo((): number => {
     switch (annotationType) {
-      case 'stamp': return 80;
-      case 'inkHighlighter':
-      case 'comment':
-      case 'textMarkup':
-      case 'text':
-      case 'note': return 280;
-      case 'shape': return 200;
-      default: return 260;
+      case "stamp":
+        return 80;
+      case "inkHighlighter":
+      case "comment":
+      case "textMarkup":
+      case "text":
+      case "note":
+        return 280;
+      case "shape":
+        return 200;
+      default:
+        return 260;
     }
   }, [annotationType]);
 
-  const hasCommentContent = (obj?.contents ?? '').trim().length > 0;
-  const isInSidebar = (obj?.customData as Record<string, unknown> | undefined)?.isComment === true;
+  const hasCommentContent = (obj?.contents ?? "").trim().length > 0;
+  const isInSidebar =
+    (obj?.customData as Record<string, unknown> | undefined)?.isComment ===
+    true;
 
   // Derived style values
   const currentColor = (() => {
-    if (!obj) return '#000000';
+    if (!obj) return "#000000";
     const type = obj.type;
-    if (type === 3) return obj.textColor || obj.color || '#000000';
-    if (type !== undefined && [4, 5, 6, 7, 8].includes(type)) return obj.strokeColor || obj.color || '#000000';
-    return obj.color || obj.strokeColor || '#000000';
+    if (type === 3) return obj.textColor || obj.color || "#000000";
+    if (type !== undefined && [4, 5, 6, 7, 8].includes(type))
+      return obj.strokeColor || obj.color || "#000000";
+    return obj.color || obj.strokeColor || "#000000";
   })();
-  const strokeColor = obj?.strokeColor || obj?.color || '#000000';
-  const fillColor = obj?.color || obj?.fillColor || '#0000ff';
-  const backgroundColor = obj?.backgroundColor || obj?.fillColor || obj?.color || '#ffffff';
-  const textColor = obj?.textColor || obj?.color || '#000000';
+  const strokeColor = obj?.strokeColor || obj?.color || "#000000";
+  const fillColor = obj?.color || obj?.fillColor || "#0000ff";
+  const backgroundColor =
+    obj?.backgroundColor || obj?.fillColor || obj?.color || "#ffffff";
+  const textColor = obj?.textColor || obj?.color || "#000000";
   const currentOpacity = Math.round((obj?.opacity ?? 1) * 100);
-  const currentWidth = obj?.strokeWidth ?? obj?.borderWidth ?? obj?.lineWidth ?? obj?.thickness ?? 2;
+  const currentWidth =
+    obj?.strokeWidth ??
+    obj?.borderWidth ??
+    obj?.lineWidth ??
+    obj?.thickness ??
+    2;
 
   // Handlers
   const onDelete = useCallback(() => {
@@ -151,99 +200,158 @@ export function useAnnotationMenuHandlers({
   }, [provides, annotationId, pageIndex]);
 
   const onEdit = useCallback(() => {
-    const root = wrapperRef.current?.closest('[data-no-interaction]');
+    const root = wrapperRef.current?.closest("[data-no-interaction]");
     const main = root?.firstElementChild;
     const hitArea = main?.lastElementChild ?? main?.firstElementChild;
     if (!hitArea) return;
-    hitArea.dispatchEvent(new MouseEvent('dblclick', { bubbles: true, cancelable: true, view: window }));
+    hitArea.dispatchEvent(
+      new MouseEvent("dblclick", {
+        bubbles: true,
+        cancelable: true,
+        view: window,
+      }),
+    );
   }, [wrapperRef]);
 
-  const onColorChange = useCallback((color: string, target: 'main' | 'stroke' | 'fill' | 'text' | 'background') => {
-    if (!provides?.updateAnnotation || !annotationId || pageIndex === undefined) return;
-    const type = obj?.type;
-    const patch: AnnotationPatch = {};
+  const onColorChange = useCallback(
+    (
+      color: string,
+      target: "main" | "stroke" | "fill" | "text" | "background",
+    ) => {
+      if (
+        !provides?.updateAnnotation ||
+        !annotationId ||
+        pageIndex === undefined
+      )
+        return;
+      const type = obj?.type;
+      const patch: AnnotationPatch = {};
 
-    if (target === 'stroke') {
-      patch.strokeColor = color;
-      patch.color = obj?.color || '#0000ff';
-      patch.strokeWidth = currentWidth;
-    } else if (target === 'fill') {
-      patch.color = color;
-      patch.strokeColor = obj?.strokeColor || '#000000';
-      patch.strokeWidth = currentWidth;
-    } else if (target === 'background') {
-      patch.backgroundColor = color;
-      patch.fillColor = color;
-      patch.color = color;
-    } else if (target === 'text') {
-      patch.textColor = color;
-      patch.fontColor = color;
-      patch.fontSize = obj?.fontSize ?? 14;
-      patch.fontFamily = obj?.fontFamily ?? 'Helvetica';
-      patch.contents = obj?.contents ?? '';
-    } else {
-      patch.color = color;
-      if (type !== undefined && [9, 10, 11, 12].includes(type)) {
+      if (target === "stroke") {
         patch.strokeColor = color;
+        patch.color = obj?.color || "#0000ff";
+        patch.strokeWidth = currentWidth;
+      } else if (target === "fill") {
+        patch.color = color;
+        patch.strokeColor = obj?.strokeColor || "#000000";
+        patch.strokeWidth = currentWidth;
+      } else if (target === "background") {
+        patch.backgroundColor = color;
         patch.fillColor = color;
-        patch.opacity = obj?.opacity ?? 1;
+        patch.color = color;
+      } else if (target === "text") {
+        patch.textColor = color;
+        patch.fontColor = color;
+        patch.fontSize = obj?.fontSize ?? 14;
+        patch.fontFamily = obj?.fontFamily ?? "Helvetica";
+        patch.contents = obj?.contents ?? "";
+      } else {
+        patch.color = color;
+        if (type !== undefined && [9, 10, 11, 12].includes(type)) {
+          patch.strokeColor = color;
+          patch.fillColor = color;
+          patch.opacity = obj?.opacity ?? 1;
+        }
+        if (type !== undefined && [4, 8].includes(type)) {
+          patch.strokeColor = color;
+          patch.strokeWidth = obj?.strokeWidth ?? obj?.lineWidth ?? 2;
+          patch.lineWidth = obj?.lineWidth ?? obj?.strokeWidth ?? 2;
+        }
+        if (type === 15) {
+          patch.strokeColor = color;
+          patch.strokeWidth = obj?.strokeWidth ?? obj?.thickness ?? 2;
+          patch.opacity = obj?.opacity ?? 1;
+        }
       }
-      if (type !== undefined && [4, 8].includes(type)) {
-        patch.strokeColor = color;
-        patch.strokeWidth = obj?.strokeWidth ?? obj?.lineWidth ?? 2;
-        patch.lineWidth = obj?.lineWidth ?? obj?.strokeWidth ?? 2;
-      }
-      if (type === 15) {
-        patch.strokeColor = color;
-        patch.strokeWidth = obj?.strokeWidth ?? obj?.thickness ?? 2;
-        patch.opacity = obj?.opacity ?? 1;
-      }
-    }
 
-    provides.updateAnnotation(pageIndex, annotationId, patch);
-  }, [provides, annotationId, pageIndex, obj, currentWidth]);
+      provides.updateAnnotation(pageIndex, annotationId, patch);
+    },
+    [provides, annotationId, pageIndex, obj, currentWidth],
+  );
 
-  const onOpacityChange = useCallback((opacity: number) => {
-    if (!provides?.updateAnnotation || !annotationId || pageIndex === undefined) return;
-    provides.updateAnnotation(pageIndex, annotationId, { opacity: opacity / 100 });
-  }, [provides, annotationId, pageIndex]);
+  const onOpacityChange = useCallback(
+    (opacity: number) => {
+      if (
+        !provides?.updateAnnotation ||
+        !annotationId ||
+        pageIndex === undefined
+      )
+        return;
+      provides.updateAnnotation(pageIndex, annotationId, {
+        opacity: opacity / 100,
+      });
+    },
+    [provides, annotationId, pageIndex],
+  );
 
-  const onWidthChange = useCallback((width: number) => {
-    if (!provides?.updateAnnotation || !annotationId || pageIndex === undefined) return;
-    provides.updateAnnotation(pageIndex, annotationId, { strokeWidth: width });
-  }, [provides, annotationId, pageIndex]);
+  const onWidthChange = useCallback(
+    (width: number) => {
+      if (
+        !provides?.updateAnnotation ||
+        !annotationId ||
+        pageIndex === undefined
+      )
+        return;
+      provides.updateAnnotation(pageIndex, annotationId, {
+        strokeWidth: width,
+      });
+    },
+    [provides, annotationId, pageIndex],
+  );
 
-  const onPropertiesUpdate = useCallback((patch: Record<string, unknown>) => {
-    if (!provides?.updateAnnotation || !annotationId || pageIndex === undefined) return;
-    provides.updateAnnotation(pageIndex, annotationId, patch);
-  }, [provides, annotationId, pageIndex]);
+  const onPropertiesUpdate = useCallback(
+    (patch: Record<string, unknown>) => {
+      if (
+        !provides?.updateAnnotation ||
+        !annotationId ||
+        pageIndex === undefined
+      )
+        return;
+      provides.updateAnnotation(pageIndex, annotationId, patch);
+    },
+    [provides, annotationId, pageIndex],
+  );
 
   const onGoToLink = useCallback(() => {
     if (!firstLinkTarget) return;
-    if (firstLinkTarget.type === 'uri') {
-      window.open(firstLinkTarget.uri, '_blank', 'noopener,noreferrer');
+    if (firstLinkTarget.type === "uri") {
+      window.open(firstLinkTarget.uri, "_blank", "noopener,noreferrer");
     } else {
       scrollActions.scrollToPage(firstLinkTarget.pageIndex + 1);
     }
   }, [firstLinkTarget, scrollActions]);
 
-  const onAddLink = useCallback((url: string) => {
-    const uri = url.trim();
-    if (!uri || !provides?.createAnnotation || pageIndex === undefined || !annotationId || !obj?.rect) return;
-    provides.createAnnotation(pageIndex, {
-      type: PdfAnnotationSubtype.LINK,
-      id: `link-${Date.now()}-${Math.random().toString(36).slice(2, 9)}`,
-      pageIndex,
-      rect: obj.rect,
-      target: { type: 'action', action: { type: PdfActionType.URI, uri } },
-      inReplyToId: annotationId,
-      replyType: PdfAnnotationReplyType.Group,
-    });
-  }, [provides, pageIndex, annotationId, obj?.rect]);
+  const onAddLink = useCallback(
+    (url: string) => {
+      const uri = url.trim();
+      if (
+        !uri ||
+        !provides?.createAnnotation ||
+        pageIndex === undefined ||
+        !annotationId ||
+        !obj?.rect
+      )
+        return;
+      provides.createAnnotation(pageIndex, {
+        type: PdfAnnotationSubtype.LINK,
+        id: `link-${Date.now()}-${Math.random().toString(36).slice(2, 9)}`,
+        pageIndex,
+        rect: obj.rect,
+        target: { type: "action", action: { type: PdfActionType.URI, uri } },
+        inReplyToId: annotationId,
+        replyType: PdfAnnotationReplyType.Group,
+      });
+    },
+    [provides, pageIndex, annotationId, obj?.rect],
+  );
 
   const onAddToSidebar = useCallback(() => {
-    if (!provides?.updateAnnotation || !annotationId || pageIndex === undefined) return;
-    const existingCustomData = (obj?.customData ?? {}) as Record<string, unknown>;
+    if (!provides?.updateAnnotation || !annotationId || pageIndex === undefined)
+      return;
+    const existingCustomData = (obj?.customData ?? {}) as Record<
+      string,
+      unknown
+    >;
     provides.updateAnnotation(pageIndex, annotationId, {
       customData: { ...existingCustomData, isComment: true },
     } as AnnotationPatch);
@@ -251,13 +359,35 @@ export function useAnnotationMenuHandlers({
   }, [provides, annotationId, pageIndex, obj, documentId, requestCommentFocus]);
 
   const onViewComment = useCallback(() => {
-    requestCommentFocus(documentId, pageIndex ?? 0, annotationId ?? '', hasCommentContent);
-  }, [requestCommentFocus, documentId, pageIndex, annotationId, hasCommentContent]);
+    requestCommentFocus(
+      documentId,
+      pageIndex ?? 0,
+      annotationId ?? "",
+      hasCommentContent,
+    );
+  }, [
+    requestCommentFocus,
+    documentId,
+    pageIndex,
+    annotationId,
+    hasCommentContent,
+  ]);
 
-  const onCommentColorChange = useCallback((color: string) => {
-    if (!provides?.updateAnnotation || !annotationId || pageIndex === undefined) return;
-    provides.updateAnnotation(pageIndex, annotationId, { strokeColor: color, color });
-  }, [provides, annotationId, pageIndex]);
+  const onCommentColorChange = useCallback(
+    (color: string) => {
+      if (
+        !provides?.updateAnnotation ||
+        !annotationId ||
+        pageIndex === undefined
+      )
+        return;
+      provides.updateAnnotation(pageIndex, annotationId, {
+        strokeColor: color,
+        color,
+      });
+    },
+    [provides, annotationId, pageIndex],
+  );
 
   return {
     annotationType,
diff --git a/frontend/src/core/components/viewer/useStopReadAloudOnNavigation.ts b/frontend/src/core/components/viewer/useStopReadAloudOnNavigation.ts
index 5faa82964e..47d5345f03 100644
--- a/frontend/src/core/components/viewer/useStopReadAloudOnNavigation.ts
+++ b/frontend/src/core/components/viewer/useStopReadAloudOnNavigation.ts
@@ -1,6 +1,6 @@
-import { useEffect, useRef } from 'react';
-import { useNavigationState } from '@app/contexts/NavigationContext';
-import { useViewer } from '@app/contexts/ViewerContext';
+import { useEffect, useRef } from "react";
+import { useNavigationState } from "@app/contexts/NavigationContext";
+import { useViewer } from "@app/contexts/ViewerContext";
 
 /**
  * Hook that automatically stops read-aloud when navigating away from the viewer.
@@ -8,7 +8,7 @@ import { useViewer } from '@app/contexts/ViewerContext';
  */
 export function useStopReadAloudOnNavigation(
   isReadingAloud: boolean,
-  onStop: () => void
+  onStop: () => void,
 ) {
   const { workbench } = useNavigationState();
   const viewer = useViewer();
@@ -28,7 +28,10 @@ export function useStopReadAloudOnNavigation(
     }
 
     // Stop on active file change
-    if (isReadingAloud && previousStateRef.current.activeFileIndex !== viewer.activeFileIndex) {
+    if (
+      isReadingAloud &&
+      previousStateRef.current.activeFileIndex !== viewer.activeFileIndex
+    ) {
       onStop();
       previousStateRef.current.activeFileIndex = viewer.activeFileIndex;
       return;
@@ -46,7 +49,7 @@ export function useStopReadAloudOnNavigation(
       onStop();
     };
 
-    window.addEventListener('beforeunload', handleBeforeUnload);
-    return () => window.removeEventListener('beforeunload', handleBeforeUnload);
+    window.addEventListener("beforeunload", handleBeforeUnload);
+    return () => window.removeEventListener("beforeunload", handleBeforeUnload);
   }, [isReadingAloud, onStop]);
 }
diff --git a/frontend/src/core/components/viewer/useViewerReadAloud.ts b/frontend/src/core/components/viewer/useViewerReadAloud.ts
index cf8eb3ed31..c2ccdec1be 100644
--- a/frontend/src/core/components/viewer/useViewerReadAloud.ts
+++ b/frontend/src/core/components/viewer/useViewerReadAloud.ts
@@ -1,11 +1,11 @@
-import { useCallback, useEffect, useRef, useState } from 'react';
-import { computeReadAloudHighlightRect } from '@app/components/viewer/readAloudHighlight';
-import { useFileState } from '@app/contexts/FileContext';
-import { useViewer } from '@app/contexts/ViewerContext';
-import { useStopReadAloudOnNavigation } from '@app/components/viewer/useStopReadAloudOnNavigation';
-import { pdfWorkerManager } from '@app/services/pdfWorkerManager';
-import { StirlingFile } from '@app/types/fileContext';
-import { ZINDEX } from '@app/constants/zIndex';
+import { useCallback, useEffect, useRef, useState } from "react";
+import { computeReadAloudHighlightRect } from "@app/components/viewer/readAloudHighlight";
+import { useFileState } from "@app/contexts/FileContext";
+import { useViewer } from "@app/contexts/ViewerContext";
+import { useStopReadAloudOnNavigation } from "@app/components/viewer/useStopReadAloudOnNavigation";
+import { pdfWorkerManager } from "@app/services/pdfWorkerManager";
+import { StirlingFile } from "@app/types/fileContext";
+import { ZINDEX } from "@app/constants/zIndex";
 
 interface TextItemWithGeometry {
   str: string;
@@ -21,17 +21,20 @@ function isTextItem(value: unknown): value is {
   width: number;
   height: number;
 } {
-  if (!value || typeof value !== 'object') return false;
+  if (!value || typeof value !== "object") return false;
   const item = value as Record<string, unknown>;
   return (
-    typeof item.str === 'string' &&
+    typeof item.str === "string" &&
     Array.isArray(item.transform) &&
-    typeof item.width === 'number' &&
-    typeof item.height === 'number'
+    typeof item.width === "number" &&
+    typeof item.height === "number"
   );
 }
 
-function createHighlightElement(item: TextItemWithGeometry, pageEl: HTMLElement): HTMLElement | null {
+function createHighlightElement(
+  item: TextItemWithGeometry,
+  pageEl: HTMLElement,
+): HTMLElement | null {
   const highlightRect = computeReadAloudHighlightRect({
     viewportTransform: item.viewportTransform,
     textTransform: item.transform,
@@ -40,16 +43,16 @@ function createHighlightElement(item: TextItemWithGeometry, pageEl: HTMLElement)
   });
   if (!highlightRect) return null;
 
-  const highlight = document.createElement('div');
-  highlight.style.position = 'absolute';
+  const highlight = document.createElement("div");
+  highlight.style.position = "absolute";
   highlight.style.left = `${highlightRect.left}px`;
   highlight.style.top = `${highlightRect.top}px`;
   highlight.style.width = `${highlightRect.width}px`;
   highlight.style.height = `${highlightRect.height}px`;
-  highlight.style.backgroundColor = 'rgba(255, 193, 7, 0.6)';
-  highlight.style.pointerEvents = 'none';
+  highlight.style.backgroundColor = "rgba(255, 193, 7, 0.6)";
+  highlight.style.pointerEvents = "none";
   highlight.style.zIndex = String(ZINDEX.VIEWER_HIGHLIGHT);
-  highlight.style.borderRadius = '2px';
+  highlight.style.borderRadius = "2px";
   pageEl.appendChild(highlight);
 
   return highlight;
@@ -61,14 +64,20 @@ export function useViewerReadAloud(defaultLanguage?: string) {
 
   const [isReadingAloud, setIsReadingAloud] = useState(false);
   const [speechRate, setSpeechRate] = useState(1);
-  const [speechLanguage, setSpeechLanguage] = useState(defaultLanguage || 'en-US');
-  const [speechVoice, setSpeechVoice] = useState<SpeechSynthesisVoice | null>(null);
-  const [supportedLanguageCodes, setSupportedLanguageCodes] = useState<Set<string>>(new Set());
+  const [speechLanguage, setSpeechLanguage] = useState(
+    defaultLanguage || "en-US",
+  );
+  const [speechVoice, setSpeechVoice] = useState<SpeechSynthesisVoice | null>(
+    null,
+  );
+  const [supportedLanguageCodes, setSupportedLanguageCodes] = useState<
+    Set<string>
+  >(new Set());
 
   const utteranceRef = useRef<SpeechSynthesisUtterance | null>(null);
   const highlightedElementsRef = useRef<HTMLElement[]>([]);
   const textItemsRef = useRef<TextItemWithGeometry[]>([]);
-  const speechTextRef = useRef('');
+  const speechTextRef = useRef("");
   const speechWordsRef = useRef<string[]>([]);
   const speechCharIndexRef = useRef(0);
   const currentWordIndexRef = useRef(0);
@@ -78,41 +87,46 @@ export function useViewerReadAloud(defaultLanguage?: string) {
   const pageAdvanceTimeoutRef = useRef<number | null>(null);
   const currentFileRef = useRef<StirlingFile | null>(null);
   const totalPagesRef = useRef(0);
-  const speechRateRef = useRef(1);  // Keep track of current rate without recreating dependent functions
-  const speechLanguageRef = useRef(defaultLanguage || 'en-US');
+  const speechRateRef = useRef(1); // Keep track of current rate without recreating dependent functions
+  const speechLanguageRef = useRef(defaultLanguage || "en-US");
 
   // Cache parsed PDF document and page text items to avoid reparsing on every zoom/scroll
-  const cachedPdfDocRef = useRef<Awaited<ReturnType<typeof pdfWorkerManager.createDocument>> | null>(null);
+  const cachedPdfDocRef = useRef<Awaited<
+    ReturnType<typeof pdfWorkerManager.createDocument>
+  > | null>(null);
   const cachedPageNumberRef = useRef<number | null>(null);
   const cachedTextItemsRef = useRef<TextItemWithGeometry[] | null>(null);
 
   // Helper to find best voice for language
-  const findVoiceForLanguage = useCallback((languageCode: string): SpeechSynthesisVoice | null => {
-    if (typeof window === 'undefined' || !window.speechSynthesis) return null;
+  const findVoiceForLanguage = useCallback(
+    (languageCode: string): SpeechSynthesisVoice | null => {
+      if (typeof window === "undefined" || !window.speechSynthesis) return null;
 
-    const voices = window.speechSynthesis.getVoices();
-    if (!voices || voices.length === 0) return null;
+      const voices = window.speechSynthesis.getVoices();
+      if (!voices || voices.length === 0) return null;
 
-    // Try exact match first
-    const exactMatch = voices.find(v => v.lang === languageCode);
-    if (exactMatch) return exactMatch;
+      // Try exact match first
+      const exactMatch = voices.find((v) => v.lang === languageCode);
+      if (exactMatch) return exactMatch;
 
-    // Try matching just the language part (e.g., 'es' from 'es-ES')
-    const baseLang = languageCode.split('-')[0];
-    const baseMatch = voices.find(v => v.lang.startsWith(baseLang));
-    if (baseMatch) {
-      return baseMatch;
-    }
+      // Try matching just the language part (e.g., 'es' from 'es-ES')
+      const baseLang = languageCode.split("-")[0];
+      const baseMatch = voices.find((v) => v.lang.startsWith(baseLang));
+      if (baseMatch) {
+        return baseMatch;
+      }
 
-    // Fallback to any English voice if requested language not found
-    const englishMatch = voices.find(v => v.lang.startsWith('en'));
-    if (englishMatch) {
-      return englishMatch;
-    }
+      // Fallback to any English voice if requested language not found
+      const englishMatch = voices.find((v) => v.lang.startsWith("en"));
+      if (englishMatch) {
+        return englishMatch;
+      }
 
-    // Last resort: use any available voice
-    return voices[0] || null;
-  }, []);
+      // Last resort: use any available voice
+      return voices[0] || null;
+    },
+    [],
+  );
 
   // Sync speechRate state to ref so page advance callbacks always have current rate
   useEffect(() => {
@@ -126,29 +140,30 @@ export function useViewerReadAloud(defaultLanguage?: string) {
 
   // Helper to get supported language codes from available voices
   const getSupportedLanguageCodes = useCallback((): Set<string> => {
-    if (typeof window === 'undefined' || !window.speechSynthesis) return new Set();
+    if (typeof window === "undefined" || !window.speechSynthesis)
+      return new Set();
 
     const voices = window.speechSynthesis.getVoices();
     const supportedCodes = new Set<string>();
 
     // For each voice, add its language code and base language code
-    voices.forEach(voice => {
+    voices.forEach((voice) => {
       supportedCodes.add(voice.lang);
-      const baseLang = voice.lang.split('-')[0];
+      const baseLang = voice.lang.split("-")[0];
       supportedCodes.add(baseLang);
     });
 
     // Also add English as fallback
-    supportedCodes.add('en');
-    supportedCodes.add('en-GB');
-    supportedCodes.add('en-US');
+    supportedCodes.add("en");
+    supportedCodes.add("en-GB");
+    supportedCodes.add("en-US");
 
     return supportedCodes;
   }, []);
 
   // Wait for voices to load, then check if default language has a voice
   useEffect(() => {
-    if (typeof window === 'undefined' || !window.speechSynthesis) return;
+    if (typeof window === "undefined" || !window.speechSynthesis) return;
 
     const handleVoicesChanged = () => {
       const supportedCodes = getSupportedLanguageCodes();
@@ -166,9 +181,15 @@ export function useViewerReadAloud(defaultLanguage?: string) {
       setSpeechVoice(voice);
     } else {
       // Voices not loaded yet, listen for voiceschanged event
-      window.speechSynthesis.addEventListener('voiceschanged', handleVoicesChanged);
+      window.speechSynthesis.addEventListener(
+        "voiceschanged",
+        handleVoicesChanged,
+      );
       return () => {
-        window.speechSynthesis.removeEventListener('voiceschanged', handleVoicesChanged);
+        window.speechSynthesis.removeEventListener(
+          "voiceschanged",
+          handleVoicesChanged,
+        );
       };
     }
   }, [speechLanguage, findVoiceForLanguage, getSupportedLanguageCodes]);
@@ -189,7 +210,7 @@ export function useViewerReadAloud(defaultLanguage?: string) {
   }, []);
 
   const stopReadingAloud = useCallback(() => {
-    if (typeof window !== 'undefined' && window.speechSynthesis) {
+    if (typeof window !== "undefined" && window.speechSynthesis) {
       window.speechSynthesis.cancel();
     }
     if (pageAdvanceTimeoutRef.current !== null) {
@@ -206,288 +227,335 @@ export function useViewerReadAloud(defaultLanguage?: string) {
   // Stop reading when navigating away (workbench, file, or window change)
   useStopReadAloudOnNavigation(isReadingAloud, stopReadingAloud);
 
-  const highlightWord = useCallback((wordIndex: number, words: string[], pageNumber: number) => {
-    clearHighlights();
-    if (wordIndex < 0 || wordIndex >= words.length) return;
+  const highlightWord = useCallback(
+    (wordIndex: number, words: string[], pageNumber: number) => {
+      clearHighlights();
+      if (wordIndex < 0 || wordIndex >= words.length) return;
 
-    const wordToFind = words[wordIndex];
-    if (!wordToFind) return;
+      const wordToFind = words[wordIndex];
+      if (!wordToFind) return;
 
-    try {
-      let currentWordCount = 0;
-      const currentPageIndex = pageNumber - 1;
-      const pageEl = document.querySelector(`[data-page-index="${currentPageIndex}"]`) as HTMLElement | null;
-      if (!pageEl) return;
+      try {
+        let currentWordCount = 0;
+        const currentPageIndex = pageNumber - 1;
+        const pageEl = document.querySelector(
+          `[data-page-index="${currentPageIndex}"]`,
+        ) as HTMLElement | null;
+        if (!pageEl) return;
 
-      for (const item of textItemsRef.current) {
-        const itemText = item.str.trim();
-        if (!itemText) continue;
+        for (const item of textItemsRef.current) {
+          const itemText = item.str.trim();
+          if (!itemText) continue;
 
-        const subWords = itemText.split(/\s+/);
-        for (let i = 0; i < subWords.length; i++) {
-          if (currentWordCount === wordIndex && subWords[i].toLowerCase() === wordToFind.toLowerCase()) {
-            const highlight = createHighlightElement(item, pageEl);
-            if (highlight) {
-              highlightedElementsRef.current.push(highlight);
+          const subWords = itemText.split(/\s+/);
+          for (let i = 0; i < subWords.length; i++) {
+            if (
+              currentWordCount === wordIndex &&
+              subWords[i].toLowerCase() === wordToFind.toLowerCase()
+            ) {
+              const highlight = createHighlightElement(item, pageEl);
+              if (highlight) {
+                highlightedElementsRef.current.push(highlight);
+              }
+              return;
             }
-            return;
+            currentWordCount++;
           }
-          currentWordCount++;
         }
+      } catch {
+        // Highlighting is best-effort only.
       }
-    } catch {
-      // Highlighting is best-effort only.
-    }
-  }, [clearHighlights]);
+    },
+    [clearHighlights],
+  );
 
-  const readPage = useCallback(async (
-    currentFile: StirlingFile | File,
-    pageNumber: number,
-    options?: {
-      preserveSpeechState?: boolean;
-      highlightWordIndex?: number;
-    }
-  ) => {
-    let pdfDoc: Awaited<ReturnType<typeof pdfWorkerManager.createDocument>> | null = null;
+  const readPage = useCallback(
+    async (
+      currentFile: StirlingFile | File,
+      pageNumber: number,
+      options?: {
+        preserveSpeechState?: boolean;
+        highlightWordIndex?: number;
+      },
+    ) => {
+      let pdfDoc: Awaited<
+        ReturnType<typeof pdfWorkerManager.createDocument>
+      > | null = null;
 
-    try {
-      const zoom = (viewer.getZoomState().zoomPercent || 100) / 100;
+      try {
+        const zoom = (viewer.getZoomState().zoomPercent || 100) / 100;
 
-      // If we have a cached document for the same file, reuse it instead of recreating
-      if (cachedPdfDocRef.current) {
-        pdfDoc = cachedPdfDocRef.current;
-      } else {
-        pdfDoc = await pdfWorkerManager.createDocument(await currentFile.arrayBuffer());
-        cachedPdfDocRef.current = pdfDoc;
-      }
+        // If we have a cached document for the same file, reuse it instead of recreating
+        if (cachedPdfDocRef.current) {
+          pdfDoc = cachedPdfDocRef.current;
+        } else {
+          pdfDoc = await pdfWorkerManager.createDocument(
+            await currentFile.arrayBuffer(),
+          );
+          cachedPdfDocRef.current = pdfDoc;
+        }
 
-      const page = await pdfDoc.getPage(pageNumber);
-      const textContent = await page.getTextContent();
-      // The highlight is rendered inside the page element, so we keep geometry in
-      // page-local coordinates and let the viewer's own rotation transform it.
-      const viewportTransform = page.getViewport({ scale: zoom }).transform;
+        const page = await pdfDoc.getPage(pageNumber);
+        const textContent = await page.getTextContent();
+        // The highlight is rendered inside the page element, so we keep geometry in
+        // page-local coordinates and let the viewer's own rotation transform it.
+        const viewportTransform = page.getViewport({ scale: zoom }).transform;
 
-      const textItems: TextItemWithGeometry[] = [];
-      for (const item of textContent.items) {
-        if (!isTextItem(item)) continue;
-        textItems.push({
-          ...item,
-          viewportTransform,
+        const textItems: TextItemWithGeometry[] = [];
+        for (const item of textContent.items) {
+          if (!isTextItem(item)) continue;
+          textItems.push({
+            ...item,
+            viewportTransform,
+          });
+        }
+
+        // Sort text items by visual position (top-to-bottom, then left-to-right)
+        // to preserve reading order instead of PDF internal order
+        const sortedItems = [...textItems].sort((a, b) => {
+          // transform array is [a, b, c, d, e, f] where e=x, f=y (translation components)
+          const yA = a.transform[5] ?? 0; // y position
+          const yB = b.transform[5] ?? 0;
+          const xA = a.transform[4] ?? 0; // x position
+          const xB = b.transform[4] ?? 0;
+
+          // Sort top-to-bottom (higher y first in PDF coordinates), then left-to-right
+          // 5px threshold for "same line" to group text on same horizontal line
+          if (Math.abs(yA - yB) > 5) {
+            return yB - yA; // Top to bottom
+          }
+          return xA - xB; // Left to right
         });
-      }
 
-      // Sort text items by visual position (top-to-bottom, then left-to-right)
-      // to preserve reading order instead of PDF internal order
-      const sortedItems = [...textItems].sort((a, b) => {
-        // transform array is [a, b, c, d, e, f] where e=x, f=y (translation components)
-        const yA = a.transform[5] ?? 0;  // y position
-        const yB = b.transform[5] ?? 0;
-        const xA = a.transform[4] ?? 0;  // x position
-        const xB = b.transform[4] ?? 0;
+        // Merge adjacent text items on same line, using PDF spaces as word boundaries
+        // This fixes PDFs where characters/syllables are individual text items
+        const mergedItems: TextItemWithGeometry[] = [];
+        const CHAR_MERGE_THRESHOLD = 5; // px - merge adjacent chars/syllables closer than this
 
-        // Sort top-to-bottom (higher y first in PDF coordinates), then left-to-right
-        // 5px threshold for "same line" to group text on same horizontal line
-        if (Math.abs(yA - yB) > 5) {
-          return yB - yA; // Top to bottom
-        }
-        return xA - xB; // Left to right
-      });
+        for (const item of sortedItems) {
+          const itemText = item.str;
+          const isSpace = itemText.trim() === "";
 
-      // Merge adjacent text items on same line, using PDF spaces as word boundaries
-      // This fixes PDFs where characters/syllables are individual text items
-      const mergedItems: TextItemWithGeometry[] = [];
-      const CHAR_MERGE_THRESHOLD = 5; // px - merge adjacent chars/syllables closer than this
-
-      for (const item of sortedItems) {
-        const itemText = item.str;
-        const isSpace = itemText.trim() === '';
-
-        // Spaces mark word boundaries - always push them separately
-        if (isSpace) {
-          mergedItems.push(item);
-          continue;
-        }
-
-        const lastItem = mergedItems[mergedItems.length - 1];
-
-        // Only merge if last item exists, is not a space, and items are on same line
-        if (lastItem && lastItem.str.trim()) {
-          const yDiff = Math.abs((lastItem.transform[5] ?? 0) - (item.transform[5] ?? 0));
-          const xGap = (item.transform[4] ?? 0) - ((lastItem.transform[4] ?? 0) + (lastItem.width ?? 0));
-
-          // Same line and very close horizontally?
-          if (yDiff < 5 && xGap < CHAR_MERGE_THRESHOLD) {
-            lastItem.str += itemText;
-            // Update width: add the new item's width plus any gap between them
-            lastItem.width = (lastItem.width ?? 0) + Math.max(0, xGap) + (item.width ?? 0);
+          // Spaces mark word boundaries - always push them separately
+          if (isSpace) {
+            mergedItems.push(item);
             continue;
           }
-        }
-        mergedItems.push({ ...item, str: itemText });
-      }
 
-      // Use merged items for both highlighting and caching
-      // This ensures word counting in highlightWord matches the spoken text order
-      textItemsRef.current = mergedItems;
-      cachedTextItemsRef.current = mergedItems;
-      cachedPageNumberRef.current = pageNumber;
+          const lastItem = mergedItems[mergedItems.length - 1];
 
-      const spokenText = mergedItems
-        .map((item) => item.str)
-        .join(' ')
-        .replace(/\s+/g, ' ')
-        .trim();
+          // Only merge if last item exists, is not a space, and items are on same line
+          if (lastItem && lastItem.str.trim()) {
+            const yDiff = Math.abs(
+              (lastItem.transform[5] ?? 0) - (item.transform[5] ?? 0),
+            );
+            const xGap =
+              (item.transform[4] ?? 0) -
+              ((lastItem.transform[4] ?? 0) + (lastItem.width ?? 0));
 
-      if (!spokenText) {
-        return null;
-      }
-
-      const words = spokenText.split(/\s+/).filter(Boolean);
-
-      if (!options?.preserveSpeechState) {
-        speechTextRef.current = spokenText;
-        speechWordsRef.current = words;
-        speechCharIndexRef.current = 0;
-        currentWordIndexRef.current = 0;
-      }
-
-      const highlightIndex = Math.max(0, Math.min(options?.highlightWordIndex ?? 0, Math.max(words.length - 1, 0)));
-      highlightWord(highlightIndex, words, pageNumber);
-      return { spokenText, words };
-    } catch (error) {
-      // Clear cache on error to avoid stale state
-      if (pdfDoc && pdfDoc === cachedPdfDocRef.current) {
-        cachedPdfDocRef.current = null;
-      }
-      throw error;
-    }
-  }, [highlightWord, viewer]);
-
-  const speakFromCharIndex = useCallback((
-    spokenText: string,
-    words: string[],
-    startCharIndex: number,
-    pageNumber: number,
-    rateOverride?: number,
-    languageOverride?: string,
-  ) => {
-    if (typeof window === 'undefined' || !window.speechSynthesis) {
-      return;
-    }
-
-    const clampedStart = Math.max(0, Math.min(startCharIndex, spokenText.length));
-    const remainingText = spokenText.slice(clampedStart).trimStart();
-    const trimmedDelta = spokenText.slice(clampedStart).length - remainingText.length;
-    const baseCharIndex = clampedStart + trimmedDelta;
-
-    if (!remainingText) {
-      clearHighlights();
-      setIsReadingAloud(false);
-      currentFileRef.current = null;
-      currentWordIndexRef.current = 0;
-      utteranceRef.current = null;
-      cleanupReadingSession();
-      return;
-    }
-
-    const utterance = new SpeechSynthesisUtterance(remainingText);
-    utterance.rate = rateOverride ?? speechRateRef.current;
-    const currentLang = languageOverride ?? speechLanguageRef.current;
-    utterance.lang = currentLang;
-
-    // Set specific voice if available
-    const voice = findVoiceForLanguage(currentLang);
-    if (voice) {
-      utterance.voice = voice;
-    }
-
-    utterance.onstart = () => setIsReadingAloud(true);
-    utterance.onend = () => {
-      utteranceRef.current = null;
-      if (restartingSpeechRef.current) {
-        return;
-      }
-      if (currentFileRef.current && pageNumber < totalPagesRef.current) {
-        clearHighlights();
-        speechCharIndexRef.current = 0;
-        currentWordIndexRef.current = 0;
-        currentPageNumberRef.current = pageNumber + 1;
-        viewer.scrollActions.scrollToPage(pageNumber + 1, 'smooth');
-        if (pageAdvanceTimeoutRef.current !== null) {
-          window.clearTimeout(pageAdvanceTimeoutRef.current);
-        }
-        pageAdvanceTimeoutRef.current = window.setTimeout(async () => {
-          pageAdvanceTimeoutRef.current = null;
-          try {
-            if (!currentFileRef.current) {
-              currentFileRef.current = null;
-              setIsReadingAloud(false);
-              cleanupReadingSession();
-              return;
+            // Same line and very close horizontally?
+            if (yDiff < 5 && xGap < CHAR_MERGE_THRESHOLD) {
+              lastItem.str += itemText;
+              // Update width: add the new item's width plus any gap between them
+              lastItem.width =
+                (lastItem.width ?? 0) + Math.max(0, xGap) + (item.width ?? 0);
+              continue;
             }
-            const nextPageData = await readPage(currentFileRef.current, pageNumber + 1);
-            if (!nextPageData) {
-              currentFileRef.current = null;
-              setIsReadingAloud(false);
-              cleanupReadingSession();
-              return;
-            }
-            speakFromCharIndex(nextPageData.spokenText, nextPageData.words, 0, pageNumber + 1, speechRateRef.current, speechLanguageRef.current);
-          } catch (error) {
-            console.error('Read aloud page advance failed', error);
-            currentFileRef.current = null;
-            clearHighlights();
-            setIsReadingAloud(false);
-            cleanupReadingSession();
           }
-        }, 250);
-        return;
-      }
-      clearHighlights();
-      setIsReadingAloud(false);
-      speechCharIndexRef.current = spokenText.length;
-      currentFileRef.current = null;
-      currentWordIndexRef.current = 0;
-      cleanupReadingSession();
-    };
-    utterance.onerror = () => {
-      utteranceRef.current = null;
-      if (restartingSpeechRef.current) {
-        return;
-      }
-      restartingSpeechRef.current = false;
-      currentFileRef.current = null;
-      currentWordIndexRef.current = 0;
-      clearHighlights();
-      setIsReadingAloud(false);
-      cleanupReadingSession();
-    };
-    utterance.onboundary = (event: SpeechSynthesisEvent) => {
-      if (event.name !== 'word') return;
-
-      const absoluteCharIndex = baseCharIndex + event.charIndex;
-      speechCharIndexRef.current = absoluteCharIndex;
-
-      let charCount = 0;
-      for (let i = 0; i < words.length; i++) {
-        const wordStart = charCount;
-        const wordEnd = charCount + words[i].length;
-        if (absoluteCharIndex >= wordStart && absoluteCharIndex < wordEnd) {
-          currentWordIndexRef.current = i;
-          currentPageNumberRef.current = pageNumber;
-          highlightWord(i, words, pageNumber);
-          break;
+          mergedItems.push({ ...item, str: itemText });
         }
-        charCount = wordEnd + 1;
-      }
-    };
 
-    utteranceRef.current = utterance;
-    window.speechSynthesis.speak(utterance);
-  }, [clearHighlights, cleanupReadingSession, readPage, viewer.scrollActions]);
+        // Use merged items for both highlighting and caching
+        // This ensures word counting in highlightWord matches the spoken text order
+        textItemsRef.current = mergedItems;
+        cachedTextItemsRef.current = mergedItems;
+        cachedPageNumberRef.current = pageNumber;
+
+        const spokenText = mergedItems
+          .map((item) => item.str)
+          .join(" ")
+          .replace(/\s+/g, " ")
+          .trim();
+
+        if (!spokenText) {
+          return null;
+        }
+
+        const words = spokenText.split(/\s+/).filter(Boolean);
+
+        if (!options?.preserveSpeechState) {
+          speechTextRef.current = spokenText;
+          speechWordsRef.current = words;
+          speechCharIndexRef.current = 0;
+          currentWordIndexRef.current = 0;
+        }
+
+        const highlightIndex = Math.max(
+          0,
+          Math.min(
+            options?.highlightWordIndex ?? 0,
+            Math.max(words.length - 1, 0),
+          ),
+        );
+        highlightWord(highlightIndex, words, pageNumber);
+        return { spokenText, words };
+      } catch (error) {
+        // Clear cache on error to avoid stale state
+        if (pdfDoc && pdfDoc === cachedPdfDocRef.current) {
+          cachedPdfDocRef.current = null;
+        }
+        throw error;
+      }
+    },
+    [highlightWord, viewer],
+  );
+
+  const speakFromCharIndex = useCallback(
+    (
+      spokenText: string,
+      words: string[],
+      startCharIndex: number,
+      pageNumber: number,
+      rateOverride?: number,
+      languageOverride?: string,
+    ) => {
+      if (typeof window === "undefined" || !window.speechSynthesis) {
+        return;
+      }
+
+      const clampedStart = Math.max(
+        0,
+        Math.min(startCharIndex, spokenText.length),
+      );
+      const remainingText = spokenText.slice(clampedStart).trimStart();
+      const trimmedDelta =
+        spokenText.slice(clampedStart).length - remainingText.length;
+      const baseCharIndex = clampedStart + trimmedDelta;
+
+      if (!remainingText) {
+        clearHighlights();
+        setIsReadingAloud(false);
+        currentFileRef.current = null;
+        currentWordIndexRef.current = 0;
+        utteranceRef.current = null;
+        cleanupReadingSession();
+        return;
+      }
+
+      const utterance = new SpeechSynthesisUtterance(remainingText);
+      utterance.rate = rateOverride ?? speechRateRef.current;
+      const currentLang = languageOverride ?? speechLanguageRef.current;
+      utterance.lang = currentLang;
+
+      // Set specific voice if available
+      const voice = findVoiceForLanguage(currentLang);
+      if (voice) {
+        utterance.voice = voice;
+      }
+
+      utterance.onstart = () => setIsReadingAloud(true);
+      utterance.onend = () => {
+        utteranceRef.current = null;
+        if (restartingSpeechRef.current) {
+          return;
+        }
+        if (currentFileRef.current && pageNumber < totalPagesRef.current) {
+          clearHighlights();
+          speechCharIndexRef.current = 0;
+          currentWordIndexRef.current = 0;
+          currentPageNumberRef.current = pageNumber + 1;
+          viewer.scrollActions.scrollToPage(pageNumber + 1, "smooth");
+          if (pageAdvanceTimeoutRef.current !== null) {
+            window.clearTimeout(pageAdvanceTimeoutRef.current);
+          }
+          pageAdvanceTimeoutRef.current = window.setTimeout(async () => {
+            pageAdvanceTimeoutRef.current = null;
+            try {
+              if (!currentFileRef.current) {
+                currentFileRef.current = null;
+                setIsReadingAloud(false);
+                cleanupReadingSession();
+                return;
+              }
+              const nextPageData = await readPage(
+                currentFileRef.current,
+                pageNumber + 1,
+              );
+              if (!nextPageData) {
+                currentFileRef.current = null;
+                setIsReadingAloud(false);
+                cleanupReadingSession();
+                return;
+              }
+              speakFromCharIndex(
+                nextPageData.spokenText,
+                nextPageData.words,
+                0,
+                pageNumber + 1,
+                speechRateRef.current,
+                speechLanguageRef.current,
+              );
+            } catch (error) {
+              console.error("Read aloud page advance failed", error);
+              currentFileRef.current = null;
+              clearHighlights();
+              setIsReadingAloud(false);
+              cleanupReadingSession();
+            }
+          }, 250);
+          return;
+        }
+        clearHighlights();
+        setIsReadingAloud(false);
+        speechCharIndexRef.current = spokenText.length;
+        currentFileRef.current = null;
+        currentWordIndexRef.current = 0;
+        cleanupReadingSession();
+      };
+      utterance.onerror = () => {
+        utteranceRef.current = null;
+        if (restartingSpeechRef.current) {
+          return;
+        }
+        restartingSpeechRef.current = false;
+        currentFileRef.current = null;
+        currentWordIndexRef.current = 0;
+        clearHighlights();
+        setIsReadingAloud(false);
+        cleanupReadingSession();
+      };
+      utterance.onboundary = (event: SpeechSynthesisEvent) => {
+        if (event.name !== "word") return;
+
+        const absoluteCharIndex = baseCharIndex + event.charIndex;
+        speechCharIndexRef.current = absoluteCharIndex;
+
+        let charCount = 0;
+        for (let i = 0; i < words.length; i++) {
+          const wordStart = charCount;
+          const wordEnd = charCount + words[i].length;
+          if (absoluteCharIndex >= wordStart && absoluteCharIndex < wordEnd) {
+            currentWordIndexRef.current = i;
+            currentPageNumberRef.current = pageNumber;
+            highlightWord(i, words, pageNumber);
+            break;
+          }
+          charCount = wordEnd + 1;
+        }
+      };
+
+      utteranceRef.current = utterance;
+      window.speechSynthesis.speak(utterance);
+    },
+    [clearHighlights, cleanupReadingSession, readPage, viewer.scrollActions],
+  );
 
   const refreshActiveHighlight = useCallback(() => {
-    if (!isReadingAloud || !currentFileRef.current || !cachedTextItemsRef.current) {
+    if (
+      !isReadingAloud ||
+      !currentFileRef.current ||
+      !cachedTextItemsRef.current
+    ) {
       return;
     }
 
@@ -501,7 +569,7 @@ export function useViewerReadAloud(defaultLanguage?: string) {
   }, [isReadingAloud, highlightWord]);
 
   const handleReadAloud = useCallback(async () => {
-    if (typeof window === 'undefined' || !window.speechSynthesis) {
+    if (typeof window === "undefined" || !window.speechSynthesis) {
       return;
     }
 
@@ -522,7 +590,8 @@ export function useViewerReadAloud(defaultLanguage?: string) {
 
     try {
       const selectedFiles = selectors.getSelectedFiles();
-      const currentFile = selectedFiles[viewer.activeFileIndex] ?? selectedFiles[0];
+      const currentFile =
+        selectedFiles[viewer.activeFileIndex] ?? selectedFiles[0];
       if (!currentFile) return;
       currentFileRef.current = currentFile;
       totalPagesRef.current = viewer.getScrollState().totalPages || 0;
@@ -540,49 +609,73 @@ export function useViewerReadAloud(defaultLanguage?: string) {
         }
 
         window.speechSynthesis.cancel();
-        speakFromCharIndex(pageData.spokenText, pageData.words, 0, currentPage, speechRateRef.current, speechLanguageRef.current);
+        speakFromCharIndex(
+          pageData.spokenText,
+          pageData.words,
+          0,
+          currentPage,
+          speechRateRef.current,
+          speechLanguageRef.current,
+        );
       } finally {
         // readPage handles pdf worker cleanup
       }
     } catch (error) {
-      console.error('Read aloud failed', error);
+      console.error("Read aloud failed", error);
       currentFileRef.current = null;
       clearHighlights();
       setIsReadingAloud(false);
       cleanupReadingSession();
     }
-  }, [clearHighlights, cleanupReadingSession, highlightWord, isReadingAloud, selectors, speakFromCharIndex, viewer]);
+  }, [
+    clearHighlights,
+    cleanupReadingSession,
+    highlightWord,
+    isReadingAloud,
+    selectors,
+    speakFromCharIndex,
+    viewer,
+  ]);
 
-  const handleSpeechRateChange = useCallback((nextRate: number) => {
-    setSpeechRate(nextRate);
+  const handleSpeechRateChange = useCallback(
+    (nextRate: number) => {
+      setSpeechRate(nextRate);
 
-    if (!isReadingAloud || !utteranceRef.current || !speechTextRef.current || typeof window === 'undefined' || !window.speechSynthesis) {
-      return;
-    }
-
-    restartingSpeechRef.current = true;
-    setIsReadingAloud(true);
-    window.speechSynthesis.cancel();
-    utteranceRef.current = null;
-    if (restartTimeoutRef.current !== null) {
-      window.clearTimeout(restartTimeoutRef.current);
-    }
-    restartTimeoutRef.current = window.setTimeout(() => {
-      restartTimeoutRef.current = null;
-      if (!restartingSpeechRef.current) {
+      if (
+        !isReadingAloud ||
+        !utteranceRef.current ||
+        !speechTextRef.current ||
+        typeof window === "undefined" ||
+        !window.speechSynthesis
+      ) {
         return;
       }
-      restartingSpeechRef.current = false;
-      speakFromCharIndex(
-        speechTextRef.current,
-        speechWordsRef.current,
-        speechCharIndexRef.current,
-        currentPageNumberRef.current,
-        nextRate,
-        speechLanguageRef.current
-      );
-    }, 80);
-  }, [isReadingAloud, speakFromCharIndex, viewer]);
+
+      restartingSpeechRef.current = true;
+      setIsReadingAloud(true);
+      window.speechSynthesis.cancel();
+      utteranceRef.current = null;
+      if (restartTimeoutRef.current !== null) {
+        window.clearTimeout(restartTimeoutRef.current);
+      }
+      restartTimeoutRef.current = window.setTimeout(() => {
+        restartTimeoutRef.current = null;
+        if (!restartingSpeechRef.current) {
+          return;
+        }
+        restartingSpeechRef.current = false;
+        speakFromCharIndex(
+          speechTextRef.current,
+          speechWordsRef.current,
+          speechCharIndexRef.current,
+          currentPageNumberRef.current,
+          nextRate,
+          speechLanguageRef.current,
+        );
+      }, 80);
+    },
+    [isReadingAloud, speakFromCharIndex, viewer],
+  );
 
   useEffect(() => {
     return viewer.registerImmediateZoomUpdate(() => {
@@ -608,7 +701,7 @@ export function useViewerReadAloud(defaultLanguage?: string) {
       if (pageAdvanceTimeoutRef.current !== null) {
         window.clearTimeout(pageAdvanceTimeoutRef.current);
       }
-      if (typeof window !== 'undefined' && window.speechSynthesis) {
+      if (typeof window !== "undefined" && window.speechSynthesis) {
         window.speechSynthesis.cancel();
       }
       restartingSpeechRef.current = false;
@@ -620,39 +713,48 @@ export function useViewerReadAloud(defaultLanguage?: string) {
     };
   }, [clearHighlights, cleanupReadingSession]);
 
-  const handleSpeechLanguageChange = useCallback((nextLanguage: string) => {
-    setSpeechLanguage(nextLanguage);
-    speechLanguageRef.current = nextLanguage;
-    const voice = findVoiceForLanguage(nextLanguage);
-    setSpeechVoice(voice);
+  const handleSpeechLanguageChange = useCallback(
+    (nextLanguage: string) => {
+      setSpeechLanguage(nextLanguage);
+      speechLanguageRef.current = nextLanguage;
+      const voice = findVoiceForLanguage(nextLanguage);
+      setSpeechVoice(voice);
 
-    if (!isReadingAloud || !utteranceRef.current || !speechTextRef.current || typeof window === 'undefined' || !window.speechSynthesis) {
-      return;
-    }
-
-    restartingSpeechRef.current = true;
-    setIsReadingAloud(true);
-    window.speechSynthesis.cancel();
-    utteranceRef.current = null;
-    if (restartTimeoutRef.current !== null) {
-      window.clearTimeout(restartTimeoutRef.current);
-    }
-    restartTimeoutRef.current = window.setTimeout(() => {
-      restartTimeoutRef.current = null;
-      if (!restartingSpeechRef.current) {
+      if (
+        !isReadingAloud ||
+        !utteranceRef.current ||
+        !speechTextRef.current ||
+        typeof window === "undefined" ||
+        !window.speechSynthesis
+      ) {
         return;
       }
-      restartingSpeechRef.current = false;
-      speakFromCharIndex(
-        speechTextRef.current,
-        speechWordsRef.current,
-        speechCharIndexRef.current,
-        currentPageNumberRef.current,
-        speechRateRef.current,
-        nextLanguage
-      );
-    }, 80);
-  }, [isReadingAloud, speakFromCharIndex]);
+
+      restartingSpeechRef.current = true;
+      setIsReadingAloud(true);
+      window.speechSynthesis.cancel();
+      utteranceRef.current = null;
+      if (restartTimeoutRef.current !== null) {
+        window.clearTimeout(restartTimeoutRef.current);
+      }
+      restartTimeoutRef.current = window.setTimeout(() => {
+        restartTimeoutRef.current = null;
+        if (!restartingSpeechRef.current) {
+          return;
+        }
+        restartingSpeechRef.current = false;
+        speakFromCharIndex(
+          speechTextRef.current,
+          speechWordsRef.current,
+          speechCharIndexRef.current,
+          currentPageNumberRef.current,
+          speechRateRef.current,
+          nextLanguage,
+        );
+      }, 80);
+    },
+    [isReadingAloud, speakFromCharIndex],
+  );
 
   return {
     isReadingAloud,
diff --git a/frontend/src/core/components/viewer/useViewerRightRailButtons.tsx b/frontend/src/core/components/viewer/useViewerRightRailButtons.tsx
index 1e20542a6d..7d54437fb9 100644
--- a/frontend/src/core/components/viewer/useViewerRightRailButtons.tsx
+++ b/frontend/src/core/components/viewer/useViewerRightRailButtons.tsx
@@ -1,25 +1,31 @@
-import { useMemo, useState, useEffect, useCallback } from 'react';
-import { ActionIcon, Slider, Popover, Select } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { supportedLanguages } from '@app/i18n';
-import { useViewer } from '@app/contexts/ViewerContext';
-import { useRightRailButtons, RightRailButtonWithAction } from '@app/hooks/useRightRailButtons';
-import LocalIcon from '@app/components/shared/LocalIcon';
-import { Tooltip } from '@app/components/shared/Tooltip';
-import { SearchInterface } from '@app/components/viewer/SearchInterface';
-import ViewerAnnotationControls from '@app/components/shared/rightRail/ViewerAnnotationControls';
-import { useSidebarContext } from '@app/contexts/SidebarContext';
-import { useRightRailTooltipSide } from '@app/hooks/useRightRailTooltipSide';
-import { useToolWorkflow } from '@app/contexts/ToolWorkflowContext';
-import { useNavigationState, useNavigationGuard } from '@app/contexts/NavigationContext';
-import { BASE_PATH, withBasePath } from '@app/constants/app';
-import { useRedaction, useRedactionMode } from '@app/contexts/RedactionContext';
-import TextFieldsIcon from '@mui/icons-material/TextFields';
-import StraightenIcon from '@mui/icons-material/Straighten';
-import LayersIcon from '@mui/icons-material/Layers';
-import VolumeUpIcon from '@mui/icons-material/VolumeUp';
-import StopIcon from '@mui/icons-material/Stop';
-import { useViewerReadAloud } from '@app/components/viewer/useViewerReadAloud';
+import { useMemo, useState, useEffect, useCallback } from "react";
+import { ActionIcon, Slider, Popover, Select } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import { supportedLanguages } from "@app/i18n";
+import { useViewer } from "@app/contexts/ViewerContext";
+import {
+  useRightRailButtons,
+  RightRailButtonWithAction,
+} from "@app/hooks/useRightRailButtons";
+import LocalIcon from "@app/components/shared/LocalIcon";
+import { Tooltip } from "@app/components/shared/Tooltip";
+import { SearchInterface } from "@app/components/viewer/SearchInterface";
+import ViewerAnnotationControls from "@app/components/shared/rightRail/ViewerAnnotationControls";
+import { useSidebarContext } from "@app/contexts/SidebarContext";
+import { useRightRailTooltipSide } from "@app/hooks/useRightRailTooltipSide";
+import { useToolWorkflow } from "@app/contexts/ToolWorkflowContext";
+import {
+  useNavigationState,
+  useNavigationGuard,
+} from "@app/contexts/NavigationContext";
+import { BASE_PATH, withBasePath } from "@app/constants/app";
+import { useRedaction, useRedactionMode } from "@app/contexts/RedactionContext";
+import TextFieldsIcon from "@mui/icons-material/TextFields";
+import StraightenIcon from "@mui/icons-material/Straighten";
+import LayersIcon from "@mui/icons-material/Layers";
+import VolumeUpIcon from "@mui/icons-material/VolumeUp";
+import StopIcon from "@mui/icons-material/Stop";
+import { useViewerReadAloud } from "@app/components/viewer/useViewerReadAloud";
 
 export function useViewerRightRailButtons(
   isRulerActive?: boolean,
@@ -27,18 +33,39 @@ export function useViewerRightRailButtons(
 ) {
   const { t, i18n } = useTranslation();
   const viewer = useViewer();
-  const { isThumbnailSidebarVisible, isBookmarkSidebarVisible, isAttachmentSidebarVisible, isLayerSidebarVisible, hasLayers, isCommentsSidebarVisible, toggleCommentsSidebar, isSearchInterfaceVisible, registerImmediatePanUpdate } = viewer;
-  const [isPanning, setIsPanning] = useState<boolean>(() => viewer.getPanState()?.isPanning ?? false);
+  const {
+    isThumbnailSidebarVisible,
+    isBookmarkSidebarVisible,
+    isAttachmentSidebarVisible,
+    isLayerSidebarVisible,
+    hasLayers,
+    isCommentsSidebarVisible,
+    toggleCommentsSidebar,
+    isSearchInterfaceVisible,
+    registerImmediatePanUpdate,
+  } = viewer;
+  const [isPanning, setIsPanning] = useState<boolean>(false);
   const { sidebarRefs } = useSidebarContext();
-  const { position: tooltipPosition } = useRightRailTooltipSide(sidebarRefs, 12);
-  const { handleToolSelect, handleBackToTools } = useToolWorkflow();
+  const { position: tooltipPosition } = useRightRailTooltipSide(
+    sidebarRefs,
+    12,
+  );
+  const { handleToolSelect, handleToolSelectForced, handleBackToTools } =
+    useToolWorkflow();
   const { selectedTool } = useNavigationState();
   const { requestNavigation } = useNavigationGuard();
   const { redactionsApplied, activeType: redactionActiveType } = useRedaction();
   const { pendingCount } = useRedactionMode();
-  const { isReadingAloud, speechRate, speechLanguage, speechVoice, supportedLanguageCodes, handleReadAloud, handleSpeechRateChange, handleSpeechLanguageChange } = useViewerReadAloud(
-    i18n.language || 'en-US'
-  );
+  const {
+    isReadingAloud,
+    speechRate,
+    speechLanguage,
+    speechVoice,
+    supportedLanguageCodes,
+    handleReadAloud,
+    handleSpeechRateChange,
+    handleSpeechLanguageChange,
+  } = useViewerReadAloud(i18n.language || "en-US");
 
   useEffect(() => {
     return registerImmediatePanUpdate((newIsPanning) => {
@@ -48,20 +75,22 @@ export function useViewerRightRailButtons(
 
   const stripBasePath = useCallback((path: string) => {
     if (BASE_PATH && path.startsWith(BASE_PATH)) {
-      return path.slice(BASE_PATH.length) || '/';
+      return path.slice(BASE_PATH.length) || "/";
     }
     return path;
   }, []);
 
   const isAnnotationsPath = useCallback(() => {
     const cleanPath = stripBasePath(window.location.pathname).toLowerCase();
-    return cleanPath === '/annotations' || cleanPath.endsWith('/annotations');
+    return cleanPath === "/annotations" || cleanPath.endsWith("/annotations");
   }, [stripBasePath]);
 
-  const [isAnnotationsActive, setIsAnnotationsActive] = useState<boolean>(() => isAnnotationsPath());
+  const [isAnnotationsActive, setIsAnnotationsActive] = useState<boolean>(() =>
+    isAnnotationsPath(),
+  );
 
   useEffect(() => {
-    if (selectedTool === 'annotate') {
+    if (selectedTool === "annotate") {
       setIsAnnotationsActive(true);
     } else if (selectedTool) {
       setIsAnnotationsActive(false);
@@ -72,52 +101,71 @@ export function useViewerRightRailButtons(
 
   useEffect(() => {
     const handlePopState = () => setIsAnnotationsActive(isAnnotationsPath());
-    window.addEventListener('popstate', handlePopState);
-    return () => window.removeEventListener('popstate', handlePopState);
+    window.addEventListener("popstate", handlePopState);
+    return () => window.removeEventListener("popstate", handlePopState);
   }, [isAnnotationsPath]);
 
-  const searchLabel = t('rightRail.search', 'Search PDF');
-  const panLabel = t('rightRail.panMode', 'Pan Mode');
-  const applyRedactionsLabel = t('rightRail.applyRedactionsFirst', 'Apply redactions first');
-  const rotateLeftLabel = t('rightRail.rotateLeft', 'Rotate Left');
-  const rotateRightLabel = t('rightRail.rotateRight', 'Rotate Right');
-  const sidebarLabel = t('rightRail.toggleSidebar', 'Toggle Sidebar');
-  const bookmarkLabel = t('rightRail.toggleBookmarks', 'Toggle Bookmarks');
-  const attachmentLabel = t('rightRail.toggleAttachments', 'Toggle Attachments');
-  const layersLabel = t('rightRail.toggleLayers', 'Toggle Layers');
-  const commentsLabel = t('rightRail.toggleComments', 'Comments');
-  const printLabel = t('rightRail.print', 'Print PDF');
-  const annotationsLabel = t('rightRail.annotations', 'Annotations');
-  const formFillLabel = t('rightRail.formFill', 'Fill Form');
-  const rulerLabel = t('rightRail.ruler', 'Ruler / Measure');
-  const readAloudLabel = t('rightRail.readAloud', 'Read Aloud');
-  const readAloudSpeedLabel = t('rightRail.readAloudSpeed', 'Speed');
+  const searchLabel = t("rightRail.search", "Search PDF");
+  const panLabel = t("rightRail.panMode", "Pan Mode");
+  const applyRedactionsLabel = t(
+    "rightRail.applyRedactionsFirst",
+    "Apply redactions first",
+  );
+  const rotateLeftLabel = t("rightRail.rotateLeft", "Rotate Left");
+  const rotateRightLabel = t("rightRail.rotateRight", "Rotate Right");
+  const sidebarLabel = t("rightRail.toggleSidebar", "Toggle Sidebar");
+  const bookmarkLabel = t("rightRail.toggleBookmarks", "Toggle Bookmarks");
+  const attachmentLabel = t(
+    "rightRail.toggleAttachments",
+    "Toggle Attachments",
+  );
+  const layersLabel = t("rightRail.toggleLayers", "Toggle Layers");
+  const commentsLabel = t("rightRail.toggleComments", "Comments");
+  const printLabel = t("rightRail.print", "Print PDF");
+  const annotationsLabel = t("rightRail.annotations", "Annotations");
+  const formFillLabel = t("rightRail.formFill", "Fill Form");
+  const rulerLabel = t("rightRail.ruler", "Ruler / Measure");
+  const readAloudLabel = t("rightRail.readAloud", "Read Aloud");
+  const readAloudSpeedLabel = t("rightRail.readAloudSpeed", "Speed");
 
-  const isFormFillActive = (selectedTool as string) === 'formFill';
+  const isFormFillActive = (selectedTool as string) === "formFill";
 
   // Filter languages based on available voices
-  const filteredLanguages = useMemo(() =>
-    Object.entries(supportedLanguages)
-      .filter(([code]) => supportedLanguageCodes.size === 0 || supportedLanguageCodes.has(code) || supportedLanguageCodes.has(code.split('-')[0]))
-      .map(([code, label]) => ({
-        value: code,
-        label: label,
-      })),
-    [supportedLanguageCodes]
+  const filteredLanguages = useMemo(
+    () =>
+      Object.entries(supportedLanguages)
+        .filter(
+          ([code]) =>
+            supportedLanguageCodes.size === 0 ||
+            supportedLanguageCodes.has(code) ||
+            supportedLanguageCodes.has(code.split("-")[0]),
+        )
+        .map(([code, label]) => ({
+          value: code,
+          label: label,
+        })),
+    [supportedLanguageCodes],
   );
 
-  const shouldShowLanguageSelector = supportedLanguageCodes.size === 0 || filteredLanguages.length > 1;
+  const shouldShowLanguageSelector =
+    supportedLanguageCodes.size === 0 || filteredLanguages.length > 1;
 
   const viewerButtons = useMemo<RightRailButtonWithAction[]>(() => {
     const buttons: RightRailButtonWithAction[] = [
       {
-        id: 'viewer-search',
+        id: "viewer-search",
         tooltip: searchLabel,
         ariaLabel: searchLabel,
-        section: 'top' as const,
+        section: "top" as const,
         order: 10,
         render: ({ disabled }) => (
-          <Tooltip content={searchLabel} position={tooltipPosition} offset={12} arrow portalTarget={document.body}>
+          <Tooltip
+            content={searchLabel}
+            position={tooltipPosition}
+            offset={12}
+            arrow
+            portalTarget={document.body}
+          >
             <Popover
               position={tooltipPosition}
               withArrow
@@ -127,7 +175,7 @@ export function useViewerRightRailButtons(
               onClose={viewer.searchInterfaceActions.close}
             >
               <Popover.Target>
-                <div style={{ display: 'inline-flex' }}>
+                <div style={{ display: "inline-flex" }}>
                   <ActionIcon
                     variant="subtle"
                     radius="md"
@@ -141,143 +189,166 @@ export function useViewerRightRailButtons(
                 </div>
               </Popover.Target>
               <Popover.Dropdown>
-                <div style={{ minWidth: '20rem' }}>
-                  <SearchInterface visible={isSearchInterfaceVisible} onClose={viewer.searchInterfaceActions.close} />
+                <div style={{ minWidth: "20rem" }}>
+                  <SearchInterface
+                    visible={isSearchInterfaceVisible}
+                    onClose={viewer.searchInterfaceActions.close}
+                  />
                 </div>
               </Popover.Dropdown>
             </Popover>
           </Tooltip>
-        )
+        ),
       },
       {
-        id: 'viewer-pan-mode',
-        icon: <LocalIcon icon="pan-tool-rounded" width="1.5rem" height="1.5rem" />,
-        tooltip: (!isPanning && pendingCount > 0 && redactionActiveType !== null) ? applyRedactionsLabel : panLabel,
-        ariaLabel: (!isPanning && pendingCount > 0 && redactionActiveType !== null) ? applyRedactionsLabel : panLabel,
-        section: 'top' as const,
+        id: "viewer-pan-mode",
+        icon: (
+          <LocalIcon icon="pan-tool-rounded" width="1.5rem" height="1.5rem" />
+        ),
+        tooltip:
+          !isPanning && pendingCount > 0 && redactionActiveType !== null
+            ? applyRedactionsLabel
+            : panLabel,
+        ariaLabel:
+          !isPanning && pendingCount > 0 && redactionActiveType !== null
+            ? applyRedactionsLabel
+            : panLabel,
+        section: "top" as const,
         order: 20,
         active: isPanning,
-        disabled: !isPanning && pendingCount > 0 && redactionActiveType !== null,
+        disabled:
+          !isPanning && pendingCount > 0 && redactionActiveType !== null,
         onClick: () => {
           viewer.panActions.togglePan();
-          setIsPanning(prev => !prev);
+          setIsPanning((prev) => !prev);
         },
       },
       {
-        id: 'viewer-ruler',
-        icon: <StraightenIcon sx={{ fontSize: '1.5rem' }} />,
+        id: "viewer-ruler",
+        icon: <StraightenIcon sx={{ fontSize: "1.5rem" }} />,
         tooltip: rulerLabel,
         ariaLabel: rulerLabel,
-        section: 'top' as const,
+        section: "top" as const,
         order: 25,
         active: Boolean(isRulerActive),
         onClick: () => {
           const next = !isRulerActive;
           setIsRulerActive?.(next);
-          if (next && viewer.getPanState()?.isPanning) {
-            viewer.panActions.togglePan();
-            setIsPanning(false);
+          if (next && isPanning) {
+            viewer.panActions.disablePan();
           }
         },
       },
       {
-        id: 'viewer-rotate-left',
+        id: "viewer-rotate-left",
         icon: <LocalIcon icon="rotate-left" width="1.5rem" height="1.5rem" />,
         tooltip: rotateLeftLabel,
         ariaLabel: rotateLeftLabel,
-        section: 'top' as const,
+        section: "top" as const,
         order: 30,
         onClick: () => {
           viewer.rotationActions.rotateBackward();
-        }
+        },
       },
       {
-        id: 'viewer-rotate-right',
+        id: "viewer-rotate-right",
         icon: <LocalIcon icon="rotate-right" width="1.5rem" height="1.5rem" />,
         tooltip: rotateRightLabel,
         ariaLabel: rotateRightLabel,
-        section: 'top' as const,
+        section: "top" as const,
         order: 40,
         onClick: () => {
           viewer.rotationActions.rotateForward();
-        }
+        },
       },
       {
-        id: 'viewer-toggle-sidebar',
+        id: "viewer-toggle-sidebar",
         icon: <LocalIcon icon="view-list" width="1.5rem" height="1.5rem" />,
         tooltip: sidebarLabel,
         ariaLabel: sidebarLabel,
-        section: 'top' as const,
+        section: "top" as const,
         order: 50,
         active: isThumbnailSidebarVisible,
         onClick: () => {
           viewer.toggleThumbnailSidebar();
-        }
+        },
       },
       {
-        id: 'viewer-toggle-bookmarks',
-        icon: <LocalIcon icon="bookmark-add-rounded" width="1.5rem" height="1.5rem" />,
+        id: "viewer-toggle-bookmarks",
+        icon: (
+          <LocalIcon
+            icon="bookmark-add-rounded"
+            width="1.5rem"
+            height="1.5rem"
+          />
+        ),
         tooltip: bookmarkLabel,
         ariaLabel: bookmarkLabel,
-        section: 'top' as const,
+        section: "top" as const,
         order: 55,
         active: isBookmarkSidebarVisible,
         onClick: () => {
           viewer.toggleBookmarkSidebar();
-        }
+        },
       },
       {
-        id: 'viewer-toggle-attachments',
-        icon: <LocalIcon icon="attachment-rounded" width="1.5rem" height="1.5rem" />,
+        id: "viewer-toggle-attachments",
+        icon: (
+          <LocalIcon icon="attachment-rounded" width="1.5rem" height="1.5rem" />
+        ),
         tooltip: attachmentLabel,
         ariaLabel: attachmentLabel,
-        section: 'top' as const,
+        section: "top" as const,
         order: 56,
         active: isAttachmentSidebarVisible,
         onClick: () => {
           viewer.toggleAttachmentSidebar();
-        }
+        },
       },
-      ...(hasLayers ? [{
-        id: 'viewer-toggle-layers',
-        icon: <LayersIcon sx={{ fontSize: '1.5rem' }} />,
-        tooltip: layersLabel,
-        ariaLabel: layersLabel,
-        section: 'top' as const,
-        order: 56.3,
-        active: isLayerSidebarVisible,
-        onClick: () => {
-          viewer.toggleLayerSidebar();
-        }
-      }] : []),
+      ...(hasLayers
+        ? [
+            {
+              id: "viewer-toggle-layers",
+              icon: <LayersIcon sx={{ fontSize: "1.5rem" }} />,
+              tooltip: layersLabel,
+              ariaLabel: layersLabel,
+              section: "top" as const,
+              order: 56.3,
+              active: isLayerSidebarVisible,
+              onClick: () => {
+                viewer.toggleLayerSidebar();
+              },
+            },
+          ]
+        : []),
       {
-        id: 'viewer-toggle-comments',
+        id: "viewer-toggle-comments",
         icon: <LocalIcon icon="comment" width="1.5rem" height="1.5rem" />,
         tooltip: commentsLabel,
         ariaLabel: commentsLabel,
-        section: 'top' as const,
+        section: "top" as const,
         order: 56.5,
         active: isCommentsSidebarVisible,
         onClick: () => {
           toggleCommentsSidebar();
-        }
+        },
       },
       {
-        id: 'viewer-print',
+        id: "viewer-print",
         icon: <LocalIcon icon="print" width="1.5rem" height="1.5rem" />,
         tooltip: printLabel,
         ariaLabel: printLabel,
-        section: 'top' as const,
+        section: "top" as const,
         order: 57,
         onClick: () => {
           viewer.printActions.print();
-        }
+        },
       },
       {
-        id: 'viewer-read-aloud',
+        id: "viewer-read-aloud",
         tooltip: readAloudLabel,
         ariaLabel: readAloudLabel,
-        section: 'top' as const,
+        section: "top" as const,
         order: 57,
         active: isReadingAloud,
         render: ({ disabled }) => (
@@ -291,25 +362,45 @@ export function useViewerRightRailButtons(
             withinPortal
           >
             <Popover.Target>
-              <div style={{ display: 'inline-flex' }}>
-                <Tooltip content={readAloudLabel} position={tooltipPosition} offset={12} arrow portalTarget={document.body}>
+              <div style={{ display: "inline-flex" }}>
+                <Tooltip
+                  content={readAloudLabel}
+                  position={tooltipPosition}
+                  offset={12}
+                  arrow
+                  portalTarget={document.body}
+                >
                   <ActionIcon
-                    variant={isReadingAloud ? 'filled' : 'subtle'}
+                    variant={isReadingAloud ? "filled" : "subtle"}
                     radius="md"
                     className="right-rail-icon"
-                    disabled={disabled || typeof window === 'undefined' || !window.speechSynthesis}
+                    disabled={
+                      disabled ||
+                      typeof window === "undefined" ||
+                      !window.speechSynthesis
+                    }
                     aria-label={readAloudLabel}
                     onClick={handleReadAloud}
-                    color={isReadingAloud ? 'blue' : undefined}
+                    color={isReadingAloud ? "blue" : undefined}
                   >
-                    {isReadingAloud ? <StopIcon sx={{ fontSize: '1.5rem' }} /> : <VolumeUpIcon sx={{ fontSize: '1.5rem' }} />}
+                    {isReadingAloud ? (
+                      <StopIcon sx={{ fontSize: "1.5rem" }} />
+                    ) : (
+                      <VolumeUpIcon sx={{ fontSize: "1.5rem" }} />
+                    )}
                   </ActionIcon>
                 </Tooltip>
               </div>
             </Popover.Target>
             <Popover.Dropdown>
-              <div style={{ width: '16rem', padding: '0.5rem' }}>
-                <div style={{ fontSize: '0.75rem', marginBottom: '0.5rem', textAlign: 'center' }}>
+              <div style={{ width: "16rem", padding: "0.5rem" }}>
+                <div
+                  style={{
+                    fontSize: "0.75rem",
+                    marginBottom: "0.5rem",
+                    textAlign: "center",
+                  }}
+                >
                   {readAloudSpeedLabel}: {speechRate.toFixed(1)}x
                 </div>
                 <Slider
@@ -319,19 +410,22 @@ export function useViewerRightRailButtons(
                   max={2}
                   step={0.1}
                   marks={[
-                    { value: 0.5, label: '0.5x' },
-                    { value: 1, label: '1x' },
-                    { value: 2, label: '2x' },
+                    { value: 0.5, label: "0.5x" },
+                    { value: 1, label: "1x" },
+                    { value: 2, label: "2x" },
                   ]}
                   styles={{
-                    markLabel: { fontSize: '0.6rem' },
+                    markLabel: { fontSize: "0.6rem" },
                   }}
                   mb="md"
                 />
                 {shouldShowLanguageSelector && (
                   <Select
-                    label={t('rightRail.readAloudLanguage', 'Language')}
-                    placeholder={t('rightRail.selectLanguage', 'Select language')}
+                    label={t("rightRail.readAloudLanguage", "Language")}
+                    placeholder={t(
+                      "rightRail.selectLanguage",
+                      "Select language",
+                    )}
                     value={speechLanguage}
                     onChange={(value) => {
                       if (value) {
@@ -347,33 +441,42 @@ export function useViewerRightRailButtons(
               </div>
             </Popover.Dropdown>
           </Popover>
-        )
+        ),
       },
       {
-        id: 'viewer-annotations',
+        id: "viewer-annotations",
         tooltip: annotationsLabel,
         ariaLabel: annotationsLabel,
-        section: 'top' as const,
+        section: "top" as const,
         order: 58,
         active: isAnnotationsActive,
         render: ({ disabled }) => (
-          <Tooltip content={annotationsLabel} position={tooltipPosition} offset={12} arrow portalTarget={document.body}>
+          <Tooltip
+            content={annotationsLabel}
+            position={tooltipPosition}
+            offset={12}
+            arrow
+            portalTarget={document.body}
+          >
             <ActionIcon
-              variant={isAnnotationsActive ? 'filled' : 'subtle'}
+              variant={isAnnotationsActive ? "filled" : "subtle"}
               radius="md"
               className="right-rail-icon"
               onClick={() => {
                 if (disabled || isAnnotationsActive) return;
 
-                const hasRedactionChanges = pendingCount > 0 || redactionsApplied;
+                const hasRedactionChanges =
+                  pendingCount > 0 || redactionsApplied;
 
                 const switchToAnnotations = () => {
-                  const targetPath = withBasePath('/annotations');
+                  const targetPath = withBasePath("/annotations");
                   if (window.location.pathname !== targetPath) {
-                    window.history.pushState(null, '', targetPath);
+                    window.history.pushState(null, "", targetPath);
                   }
                   setIsAnnotationsActive(true);
-                  handleToolSelect('annotate');
+                  // Use handleToolSelectForced to bypass the unsaved-changes guard —
+                  // the navigation warning modal already handled that check.
+                  handleToolSelectForced("annotate");
                 };
 
                 if (hasRedactionChanges) {
@@ -384,31 +487,37 @@ export function useViewerRightRailButtons(
               }}
               disabled={disabled}
               aria-pressed={isAnnotationsActive}
-              color={isAnnotationsActive ? 'blue' : undefined}
+              color={isAnnotationsActive ? "blue" : undefined}
             >
               <LocalIcon icon="edit" width="1.5rem" height="1.5rem" />
             </ActionIcon>
           </Tooltip>
-        )
+        ),
       },
       {
-        id: 'viewer-annotation-controls',
-        section: 'top' as const,
+        id: "viewer-annotation-controls",
+        section: "top" as const,
         order: 60,
         render: ({ disabled }) => (
           <ViewerAnnotationControls currentView="viewer" disabled={disabled} />
-        )
+        ),
       },
       {
-        id: 'viewer-form-fill',
+        id: "viewer-form-fill",
         tooltip: formFillLabel,
         ariaLabel: formFillLabel,
-        section: 'top' as const,
+        section: "top" as const,
         order: 62,
         render: ({ disabled }) => (
-          <Tooltip content={formFillLabel} position={tooltipPosition} offset={12} arrow portalTarget={document.body}>
+          <Tooltip
+            content={formFillLabel}
+            position={tooltipPosition}
+            offset={12}
+            arrow
+            portalTarget={document.body}
+          >
             <ActionIcon
-              variant={isFormFillActive ? 'filled' : 'subtle'}
+              variant={isFormFillActive ? "filled" : "subtle"}
               radius="md"
               className="right-rail-icon"
               onClick={() => {
@@ -416,17 +525,17 @@ export function useViewerRightRailButtons(
                 if (isFormFillActive) {
                   handleBackToTools();
                 } else {
-                  handleToolSelect('formFill' as any);
+                  handleToolSelect("formFill" as any);
                 }
               }}
               disabled={disabled}
               aria-pressed={isFormFillActive}
-              color={isFormFillActive ? 'blue' : undefined}
+              color={isFormFillActive ? "blue" : undefined}
             >
-              <TextFieldsIcon sx={{ fontSize: '1.5rem' }} />
+              <TextFieldsIcon sx={{ fontSize: "1.5rem" }} />
             </ActionIcon>
           </Tooltip>
-        )
+        ),
       },
     ];
 
diff --git a/frontend/src/core/components/viewer/viewerTypes.ts b/frontend/src/core/components/viewer/viewerTypes.ts
index c904919b80..22342337d5 100644
--- a/frontend/src/core/components/viewer/viewerTypes.ts
+++ b/frontend/src/core/components/viewer/viewerTypes.ts
@@ -10,7 +10,7 @@ export interface SignatureAPI {
     y: number,
     width: number,
     height: number,
-    pageIndex: number
+    pageIndex: number,
   ) => void;
   activateDrawMode: () => void;
   activateSignaturePlacementMode: () => void;
@@ -19,21 +19,42 @@ export interface SignatureAPI {
   updateDrawSettings: (color: string, size: number) => void;
   deactivateTools: () => void;
   getPageAnnotations: (pageIndex: number) => Promise<any[]>;
-  moveAnnotation?: (pageIndex: number, annotationId: string, newRect: AnnotationRect) => void;
+  moveAnnotation?: (
+    pageIndex: number,
+    annotationId: string,
+    newRect: AnnotationRect,
+  ) => void;
 }
 
 export interface AnnotationAPI {
-  activateAnnotationTool: (toolId: AnnotationToolId, options?: AnnotationToolOptions) => void;
-  setAnnotationStyle: (toolId: AnnotationToolId, options?: AnnotationToolOptions) => void;
+  activateAnnotationTool: (
+    toolId: AnnotationToolId,
+    options?: AnnotationToolOptions,
+  ) => void;
+  setAnnotationStyle: (
+    toolId: AnnotationToolId,
+    options?: AnnotationToolOptions,
+  ) => void;
   getSelectedAnnotation: () => AnnotationSelection | null;
   deselectAnnotation: () => void;
-  updateAnnotation: (pageIndex: number, annotationId: string, patch: AnnotationPatch) => void;
+  updateAnnotation: (
+    pageIndex: number,
+    annotationId: string,
+    patch: AnnotationPatch,
+  ) => void;
   deleteAnnotation?: (pageIndex: number, annotationId: string) => void;
-  deleteAnnotations?: (annotations: Array<{ pageIndex: number; id: string }>) => void;
-  createAnnotation?: (pageIndex: number, annotation: Record<string, unknown>) => void;
+  deleteAnnotations?: (
+    annotations: Array<{ pageIndex: number; id: string }>,
+  ) => void;
+  createAnnotation?: (
+    pageIndex: number,
+    annotation: Record<string, unknown>,
+  ) => void;
   getSelectedAnnotations?: () => AnnotationSelection[];
   deactivateTools: () => void;
-  onAnnotationEvent?: (listener: (event: AnnotationEvent) => void) => void | (() => void);
+  onAnnotationEvent?: (
+    listener: (event: AnnotationEvent) => void,
+  ) => void | (() => void);
   getActiveTool?: () => { id: AnnotationToolId } | null;
   purgeAnnotation?: (pageIndex: number, annotationId: string) => void;
   /**
@@ -41,7 +62,11 @@ export interface AnnotationAPI {
    * Uses the embedPDF v2.7.0 moveAnnotation API for efficient repositioning of annotations
    * that have existing AP streams (e.g. stamps, signatures).
    */
-  moveAnnotation?: (pageIndex: number, annotationId: string, newRect: AnnotationRect) => void;
+  moveAnnotation?: (
+    pageIndex: number,
+    annotationId: string,
+    newRect: AnnotationRect,
+  ) => void;
 }
 
 export interface HistoryAPI {
@@ -58,35 +83,38 @@ export interface HistoryAPI {
    * @param topic If provided, only purges entries for that specific topic
    * @returns The number of entries that were purged
    */
-  purgeByMetadata?: <T>(predicate: (metadata: T | undefined) => boolean, topic?: string) => number;
+  purgeByMetadata?: <T>(
+    predicate: (metadata: T | undefined) => boolean,
+    topic?: string,
+  ) => number;
 }
 
 export type AnnotationToolId =
-  | 'select'
-  | 'highlight'
-  | 'underline'
-  | 'strikeout'
-  | 'squiggly'
-  | 'ink'
-  | 'inkHighlighter'
-  | 'text'
-  | 'note'
-  | 'textComment'
-  | 'insertText'
-  | 'replaceText'
-  | 'square'
-  | 'circle'
-  | 'line'
-  | 'lineArrow'
-  | 'polyline'
-  | 'polygon'
-  | 'stamp'
-  | 'signatureStamp'
-  | 'signatureInk';
+  | "select"
+  | "highlight"
+  | "underline"
+  | "strikeout"
+  | "squiggly"
+  | "ink"
+  | "inkHighlighter"
+  | "text"
+  | "note"
+  | "textComment"
+  | "insertText"
+  | "replaceText"
+  | "square"
+  | "circle"
+  | "line"
+  | "lineArrow"
+  | "polyline"
+  | "polygon"
+  | "stamp"
+  | "signatureStamp"
+  | "signatureInk";
 
 // Import for internal use within this file, and re-export for external consumers
-import type { AnnotationEvent } from '@embedpdf/plugin-annotation';
-export type { AnnotationEvent } from '@embedpdf/plugin-annotation';
+import type { AnnotationEvent } from "@embedpdf/plugin-annotation";
+export type { AnnotationEvent } from "@embedpdf/plugin-annotation";
 
 export type AnnotationPatch = Record<string, unknown>;
 
@@ -125,7 +153,9 @@ export interface AnnotationObject {
  * Selection returned by getSelectedAnnotation — EmbedPDF may wrap the annotation
  * in an `.object` property or surface fields directly on the selection.
  */
-export type AnnotationSelection = AnnotationObject & { object?: AnnotationObject };
+export type AnnotationSelection = AnnotationObject & {
+  object?: AnnotationObject;
+};
 
 export interface AnnotationToolOptions {
   color?: string;
@@ -141,8 +171,25 @@ export interface AnnotationToolOptions {
   textAlign?: number; // 0 = Left, 1 = Center, 2 = Right
   imageSrc?: string;
   imageSize?: { width: number; height: number };
-  icon?: 'Comment' | 'Key' | 'Note' | 'Help' | 'NewParagraph' | 'Paragraph' | 'Insert';
+  icon?:
+    | "Comment"
+    | "Key"
+    | "Note"
+    | "Help"
+    | "NewParagraph"
+    | "Paragraph"
+    | "Insert";
   contents?: string;
   customData?: Record<string, unknown>;
-  flags?: ('invisible' | 'hidden' | 'print' | 'noZoom' | 'noRotate' | 'noView' | 'readOnly' | 'locked' | 'toggleNoView')[];
+  flags?: (
+    | "invisible"
+    | "hidden"
+    | "print"
+    | "noZoom"
+    | "noRotate"
+    | "noView"
+    | "readOnly"
+    | "locked"
+    | "toggleNoView"
+  )[];
 }
diff --git a/frontend/src/core/constants/app.ts b/frontend/src/core/constants/app.ts
index aedb81a681..e8daed89c1 100644
--- a/frontend/src/core/constants/app.ts
+++ b/frontend/src/core/constants/app.ts
@@ -1,21 +1,23 @@
-
 // Base path - read from <base> tag at runtime to support dynamic subpaths
 // Falls back to Vite's BASE_URL for build-time subpaths
 // Normalized: no trailing slash, empty string instead of '.' or '/'
 function getBasePath(): string {
   // Try to read from <base> tag first (runtime subpath support)
-  if (typeof document !== 'undefined') {
-    const baseElement = document.querySelector('base');
+  if (typeof document !== "undefined") {
+    const baseElement = document.querySelector("base");
     if (baseElement) {
-      const href = baseElement.getAttribute('href');
-      if (href && href !== '%BASE_URL%') {
-        return href.replace(/\/$/, '').replace(/^\.$/, '').replace(/^\/$/, '');
+      const href = baseElement.getAttribute("href");
+      if (href && href !== "%BASE_URL%") {
+        return href.replace(/\/$/, "").replace(/^\.$/, "").replace(/^\/$/, "");
       }
     }
   }
 
   // Fall back to Vite's BASE_URL (build-time subpath)
-  return (import.meta.env.BASE_URL || '/').replace(/\/$/, '').replace(/^\.$/, '').replace(/^\/$/, '');
+  return (import.meta.env.BASE_URL || "/")
+    .replace(/\/$/, "")
+    .replace(/^\.$/, "")
+    .replace(/^\/$/, "");
 }
 
 export const BASE_PATH = getBasePath();
@@ -27,12 +29,12 @@ export const ANNOTATION_VERIFICATION_DELAY_MS = 100;
 
 /** For in-app navigations when you must touch window.location (rare). */
 export const withBasePath = (path: string): string => {
-  const clean = path.startsWith('/') ? path : `/${path}`;
+  const clean = path.startsWith("/") ? path : `/${path}`;
   return `${BASE_PATH}${clean}`;
 };
 
 /** For OAuth (needs absolute URL with scheme+host) */
 export const absoluteWithBasePath = (path: string): string => {
-  const clean = path.startsWith('/') ? path : `/${path}`;
+  const clean = path.startsWith("/") ? path : `/${path}`;
   return `${window.location.origin}${BASE_PATH}${clean}`;
 };
diff --git a/frontend/src/core/constants/automation.ts b/frontend/src/core/constants/automation.ts
index c1aeaeff0a..56fc7ee35f 100644
--- a/frontend/src/core/constants/automation.ts
+++ b/frontend/src/core/constants/automation.ts
@@ -5,38 +5,38 @@
 export const AUTOMATION_CONSTANTS = {
   // Timeouts
   OPERATION_TIMEOUT: 300000, // 5 minutes in milliseconds
-  
+
   // Default values
   DEFAULT_TOOL_COUNT: 2,
   MIN_TOOL_COUNT: 2,
-  
+
   // File prefixes
-  FILE_PREFIX: 'automated_',
-  RESPONSE_ZIP_PREFIX: 'response_',
-  RESULT_FILE_PREFIX: 'result_',
-  PROCESSED_FILE_PREFIX: 'processed_',
-  
+  FILE_PREFIX: "automated_",
+  RESPONSE_ZIP_PREFIX: "response_",
+  RESULT_FILE_PREFIX: "result_",
+  PROCESSED_FILE_PREFIX: "processed_",
+
   // Operation types
-  CONVERT_OPERATION_TYPE: 'convert',
-  
+  CONVERT_OPERATION_TYPE: "convert",
+
   // Storage keys
-  DB_NAME: 'StirlingPDF_Automations',
+  DB_NAME: "StirlingPDF_Automations",
   DB_VERSION: 1,
-  STORE_NAME: 'automations',
-  
+  STORE_NAME: "automations",
+
   // UI delays
-  SPINNER_ANIMATION_DURATION: '1s'
+  SPINNER_ANIMATION_DURATION: "1s",
 } as const;
 
 export const AUTOMATION_STEPS = {
-  SELECTION: 'selection',
-  CREATION: 'creation',
-  RUN: 'run'
+  SELECTION: "selection",
+  CREATION: "creation",
+  RUN: "run",
 } as const;
 
 export const EXECUTION_STATUS = {
-  PENDING: 'pending',
-  RUNNING: 'running',
-  COMPLETED: 'completed',
-  ERROR: 'error'
-} as const;
\ No newline at end of file
+  PENDING: "pending",
+  RUNNING: "running",
+  COMPLETED: "completed",
+  ERROR: "error",
+} as const;
diff --git a/frontend/src/core/constants/convertConstants.ts b/frontend/src/core/constants/convertConstants.ts
index 1016d5f6c0..a29d05ee5a 100644
--- a/frontend/src/core/constants/convertConstants.ts
+++ b/frontend/src/core/constants/convertConstants.ts
@@ -1,221 +1,286 @@
-
 export const COLOR_TYPES = {
-  COLOR: 'color',
-  GRAYSCALE: 'grayscale',
-  BLACK_WHITE: 'blackwhite'
+  COLOR: "color",
+  GRAYSCALE: "grayscale",
+  BLACK_WHITE: "blackwhite",
 } as const;
 
 export const OUTPUT_OPTIONS = {
-  SINGLE: 'single',
-  MULTIPLE: 'multiple'
+  SINGLE: "single",
+  MULTIPLE: "multiple",
 } as const;
 
 export const FIT_OPTIONS = {
-  FIT_PAGE: 'fitDocumentToPage',
-  MAINTAIN_ASPECT: 'maintainAspectRatio',
-  FILL_PAGE: 'fillPage'
+  FIT_PAGE: "fitDocumentToPage",
+  MAINTAIN_ASPECT: "maintainAspectRatio",
+  FILL_PAGE: "fillPage",
 } as const;
 
-
 export const CONVERSION_ENDPOINTS = {
-  'office-pdf': '/api/v1/convert/file/pdf',
-  'pdf-image': '/api/v1/convert/pdf/img',
-  'image-pdf': '/api/v1/convert/img/pdf',
-  'svg-pdf': '/api/v1/convert/svg/pdf',
-  'cbz-pdf': '/api/v1/convert/cbz/pdf',
-  'pdf-cbz': '/api/v1/convert/pdf/cbz',
-  'pdf-office-word': '/api/v1/convert/pdf/word',
-  'pdf-office-presentation': '/api/v1/convert/pdf/presentation',
-  'pdf-office-text': '/api/v1/convert/pdf/text',
-  'pdf-csv': '/api/v1/convert/pdf/csv',
-  'pdf-xlsx': '/api/v1/convert/pdf/xlsx',
-  'pdf-markdown': '/api/v1/convert/pdf/markdown',
-  'pdf-html': '/api/v1/convert/pdf/html',
-  'pdf-xml': '/api/v1/convert/pdf/xml',
-  'pdf-pdfa': '/api/v1/convert/pdf/pdfa',
-  'html-pdf': '/api/v1/convert/html/pdf',
-  'markdown-pdf': '/api/v1/convert/markdown/pdf',
-  'eml-pdf': '/api/v1/convert/eml/pdf',
-  'cbr-pdf': '/api/v1/convert/cbr/pdf',
-  'pdf-cbr': '/api/v1/convert/pdf/cbr',
-  'ebook-pdf': '/api/v1/convert/ebook/pdf',
-  'pdf-epub': '/api/v1/convert/pdf/epub',
-  'pdf-text-editor': '/api/v1/convert/pdf/text-editor',
-  'text-editor-pdf': '/api/v1/convert/text-editor/pdf'
+  "office-pdf": "/api/v1/convert/file/pdf",
+  "pdf-image": "/api/v1/convert/pdf/img",
+  "image-pdf": "/api/v1/convert/img/pdf",
+  "svg-pdf": "/api/v1/convert/svg/pdf",
+  "cbz-pdf": "/api/v1/convert/cbz/pdf",
+  "pdf-cbz": "/api/v1/convert/pdf/cbz",
+  "pdf-office-word": "/api/v1/convert/pdf/word",
+  "pdf-office-presentation": "/api/v1/convert/pdf/presentation",
+  "pdf-office-text": "/api/v1/convert/pdf/text",
+  "pdf-csv": "/api/v1/convert/pdf/csv",
+  "pdf-xlsx": "/api/v1/convert/pdf/xlsx",
+  "pdf-markdown": "/api/v1/convert/pdf/markdown",
+  "pdf-html": "/api/v1/convert/pdf/html",
+  "pdf-xml": "/api/v1/convert/pdf/xml",
+  "pdf-pdfa": "/api/v1/convert/pdf/pdfa",
+  "html-pdf": "/api/v1/convert/html/pdf",
+  "markdown-pdf": "/api/v1/convert/markdown/pdf",
+  "eml-pdf": "/api/v1/convert/eml/pdf",
+  "cbr-pdf": "/api/v1/convert/cbr/pdf",
+  "pdf-cbr": "/api/v1/convert/pdf/cbr",
+  "ebook-pdf": "/api/v1/convert/ebook/pdf",
+  "pdf-epub": "/api/v1/convert/pdf/epub",
+  "pdf-text-editor": "/api/v1/convert/pdf/text-editor",
+  "text-editor-pdf": "/api/v1/convert/text-editor/pdf",
 } as const;
 
 export const ENDPOINT_NAMES = {
-  'office-pdf': 'file-to-pdf',
-  'pdf-image': 'pdf-to-img',
-  'image-pdf': 'img-to-pdf',
-  'svg-pdf': 'svg-to-pdf',
-  'cbz-pdf': 'cbz-to-pdf',
-  'pdf-cbz': 'pdf-to-cbz',
-  'pdf-office-word': 'pdf-to-word',
-  'pdf-office-presentation': 'pdf-to-presentation',
-  'pdf-office-text': 'pdf-to-text',
-  'pdf-csv': 'pdf-to-csv',
-  'pdf-xlsx': 'pdf-to-xlsx',
-  'pdf-markdown': 'pdf-to-markdown',
-  'pdf-html': 'pdf-to-html',
-  'pdf-xml': 'pdf-to-xml',
-  'pdf-pdfa': 'pdf-to-pdfa',
-  'html-pdf': 'html-to-pdf',
-  'markdown-pdf': 'markdown-to-pdf',
-  'eml-pdf': 'eml-to-pdf',
-  'ebook-pdf': 'ebook-to-pdf',
-  'cbr-pdf': 'cbr-to-pdf',
-  'pdf-cbr': 'pdf-to-cbr',
-  'pdf-epub': 'pdf-to-epub',
-  'pdf-text-editor': 'pdf-to-text-editor',
-  'text-editor-pdf': 'text-editor-to-pdf'
+  "office-pdf": "file-to-pdf",
+  "pdf-image": "pdf-to-img",
+  "image-pdf": "img-to-pdf",
+  "svg-pdf": "svg-to-pdf",
+  "cbz-pdf": "cbz-to-pdf",
+  "pdf-cbz": "pdf-to-cbz",
+  "pdf-office-word": "pdf-to-word",
+  "pdf-office-presentation": "pdf-to-presentation",
+  "pdf-office-text": "pdf-to-text",
+  "pdf-csv": "pdf-to-csv",
+  "pdf-xlsx": "pdf-to-xlsx",
+  "pdf-markdown": "pdf-to-markdown",
+  "pdf-html": "pdf-to-html",
+  "pdf-xml": "pdf-to-xml",
+  "pdf-pdfa": "pdf-to-pdfa",
+  "html-pdf": "html-to-pdf",
+  "markdown-pdf": "markdown-to-pdf",
+  "eml-pdf": "eml-to-pdf",
+  "ebook-pdf": "ebook-to-pdf",
+  "cbr-pdf": "cbr-to-pdf",
+  "pdf-cbr": "pdf-to-cbr",
+  "pdf-epub": "pdf-to-epub",
+  "pdf-text-editor": "pdf-to-text-editor",
+  "text-editor-pdf": "text-editor-to-pdf",
 } as const;
 
 /** Maps conversion endpoint → [i18n key, English fallback] for display names */
 export const ENDPOINT_I18N: Record<string, [string, string]> = {
-  'img-to-pdf':          ['imageToPDF.header',         'Image → PDF'],
-  'html-to-pdf':         ['HTMLToPDF.header',          'HTML → PDF'],
-  'markdown-to-pdf':     ['MarkdownToPDF.header',      'Markdown → PDF'],
-  'pdf-to-img':          ['pdfToImage.title',          'PDF → Image'],
-  'pdf-to-word':         ['PDFToWord.header',          'PDF → Word'],
-  'pdf-to-presentation': ['PDFToPresentation.header',  'PDF → Presentation'],
-  'pdf-to-text':         ['PDFToText.header',          'PDF → Text'],
-  'pdf-to-csv':          ['PDFToCSV.header',           'PDF → CSV'],
-  'pdf-to-xlsx':         ['PDFToXLSX.header',          'PDF → Excel'],
-  'pdf-to-markdown':     ['PDFToMarkdown.header',      'PDF → Markdown'],
-  'pdf-to-html':         ['PDFToHTML.header',          'PDF → HTML'],
-  'pdf-to-xml':          ['PDFToXML.header',           'PDF → XML'],
-  'pdf-to-pdfa':         ['pdfToPDFA.header',          'PDF → PDF/A'],
-  'file-to-pdf':         ['convert.fileToPdf',         'Office/Document → PDF'],
-  'cbr-to-pdf':          ['convert.cbrToPdf',          'CBR → PDF'],
-  'cbz-to-pdf':          ['convert.cbzToPdf',          'CBZ → PDF'],
-  'eml-to-pdf':          ['convert.emlToPdf',          'Email → PDF'],
-  'ebook-to-pdf':        ['convert.ebookToPdf',        'eBook → PDF'],
-  'svg-to-pdf':          ['convert.svgToPdf',          'SVG → PDF'],
-  'pdf-to-cbr':          ['convert.pdfToCbr',          'PDF → CBR'],
-  'pdf-to-cbz':          ['convert.pdfToCbz',          'PDF → CBZ'],
-  'pdf-to-epub':         ['convert.pdfToEpub',         'PDF → EPUB'],
+  "img-to-pdf": ["imageToPDF.header", "Image → PDF"],
+  "html-to-pdf": ["HTMLToPDF.header", "HTML → PDF"],
+  "markdown-to-pdf": ["MarkdownToPDF.header", "Markdown → PDF"],
+  "pdf-to-img": ["pdfToImage.title", "PDF → Image"],
+  "pdf-to-word": ["PDFToWord.header", "PDF → Word"],
+  "pdf-to-presentation": ["PDFToPresentation.header", "PDF → Presentation"],
+  "pdf-to-text": ["PDFToText.header", "PDF → Text"],
+  "pdf-to-csv": ["PDFToCSV.header", "PDF → CSV"],
+  "pdf-to-xlsx": ["PDFToXLSX.header", "PDF → Excel"],
+  "pdf-to-markdown": ["PDFToMarkdown.header", "PDF → Markdown"],
+  "pdf-to-html": ["PDFToHTML.header", "PDF → HTML"],
+  "pdf-to-xml": ["PDFToXML.header", "PDF → XML"],
+  "pdf-to-pdfa": ["pdfToPDFA.header", "PDF → PDF/A"],
+  "file-to-pdf": ["convert.fileToPdf", "Office/Document → PDF"],
+  "cbr-to-pdf": ["convert.cbrToPdf", "CBR → PDF"],
+  "cbz-to-pdf": ["convert.cbzToPdf", "CBZ → PDF"],
+  "eml-to-pdf": ["convert.emlToPdf", "Email → PDF"],
+  "ebook-to-pdf": ["convert.ebookToPdf", "eBook → PDF"],
+  "svg-to-pdf": ["convert.svgToPdf", "SVG → PDF"],
+  "pdf-to-cbr": ["convert.pdfToCbr", "PDF → CBR"],
+  "pdf-to-cbz": ["convert.pdfToCbz", "PDF → CBZ"],
+  "pdf-to-epub": ["convert.pdfToEpub", "PDF → EPUB"],
 };
 
 // Grouped file extensions for dropdowns
 export const FROM_FORMAT_OPTIONS = [
-  { value: 'any', label: 'Any', group: 'Multiple Files' },
-  { value: 'image', label: 'Images', group: 'Multiple Files' },
-  { value: 'pdf', label: 'PDF', group: 'Document' },
-  { value: 'cbz', label: 'CBZ', group: 'Archive' },
-  { value: 'cbr', label: 'CBR', group: 'Archive' },
-  { value: 'docx', label: 'DOCX', group: 'Document' },
-  { value: 'doc', label: 'DOC', group: 'Document' },
-  { value: 'odt', label: 'ODT', group: 'Document' },
-  { value: 'xlsx', label: 'XLSX', group: 'Spreadsheet' },
-  { value: 'xls', label: 'XLS', group: 'Spreadsheet' },
-  { value: 'ods', label: 'ODS', group: 'Spreadsheet' },
-  { value: 'pptx', label: 'PPTX', group: 'Presentation' },
-  { value: 'ppt', label: 'PPT', group: 'Presentation' },
-  { value: 'odp', label: 'ODP', group: 'Presentation' },
-  { value: 'jpg', label: 'JPG', group: 'Image' },
-  { value: 'jpeg', label: 'JPEG', group: 'Image' },
-  { value: 'png', label: 'PNG', group: 'Image' },
-  { value: 'gif', label: 'GIF', group: 'Image' },
-  { value: 'bmp', label: 'BMP', group: 'Image' },
-  { value: 'tiff', label: 'TIFF', group: 'Image' },
-  { value: 'webp', label: 'WEBP', group: 'Image' },
-  { value: 'svg', label: 'SVG', group: 'Image' },
-  { value: 'html', label: 'HTML', group: 'Web' },
-  { value: 'zip', label: 'ZIP', group: 'Web' },
-  { value: 'md', label: 'MD', group: 'Text' },
-  { value: 'txt', label: 'TXT', group: 'Text' },
-  { value: 'rtf', label: 'RTF', group: 'Text' },
-  { value: 'eml', label: 'EML', group: 'Email' },
-  { value: 'msg', label: 'MSG (Outlook)', group: 'Email' },
-  { value: 'epub', label: 'EPUB', group: 'eBook' },
-  { value: 'mobi', label: 'MOBI', group: 'eBook' },
-  { value: 'azw3', label: 'AZW3', group: 'eBook' },
-  { value: 'fb2', label: 'FB2', group: 'eBook' },
+  { value: "any", label: "Any", group: "Multiple Files" },
+  { value: "image", label: "Images", group: "Multiple Files" },
+  { value: "pdf", label: "PDF", group: "Document" },
+  { value: "cbz", label: "CBZ", group: "Archive" },
+  { value: "cbr", label: "CBR", group: "Archive" },
+  { value: "docx", label: "DOCX", group: "Document" },
+  { value: "doc", label: "DOC", group: "Document" },
+  { value: "odt", label: "ODT", group: "Document" },
+  { value: "xlsx", label: "XLSX", group: "Spreadsheet" },
+  { value: "xls", label: "XLS", group: "Spreadsheet" },
+  { value: "ods", label: "ODS", group: "Spreadsheet" },
+  { value: "pptx", label: "PPTX", group: "Presentation" },
+  { value: "ppt", label: "PPT", group: "Presentation" },
+  { value: "odp", label: "ODP", group: "Presentation" },
+  { value: "jpg", label: "JPG", group: "Image" },
+  { value: "jpeg", label: "JPEG", group: "Image" },
+  { value: "png", label: "PNG", group: "Image" },
+  { value: "gif", label: "GIF", group: "Image" },
+  { value: "bmp", label: "BMP", group: "Image" },
+  { value: "tiff", label: "TIFF", group: "Image" },
+  { value: "webp", label: "WEBP", group: "Image" },
+  { value: "svg", label: "SVG", group: "Image" },
+  { value: "html", label: "HTML", group: "Web" },
+  { value: "zip", label: "ZIP", group: "Web" },
+  { value: "md", label: "MD", group: "Text" },
+  { value: "txt", label: "TXT", group: "Text" },
+  { value: "rtf", label: "RTF", group: "Text" },
+  { value: "eml", label: "EML", group: "Email" },
+  { value: "msg", label: "MSG (Outlook)", group: "Email" },
+  { value: "epub", label: "EPUB", group: "eBook" },
+  { value: "mobi", label: "MOBI", group: "eBook" },
+  { value: "azw3", label: "AZW3", group: "eBook" },
+  { value: "fb2", label: "FB2", group: "eBook" },
 ];
 
 export const TO_FORMAT_OPTIONS = [
-  { value: 'pdf', label: 'PDF', group: 'Document' },
-  { value: 'pdfa', label: 'PDF/A', group: 'Document' },
-  { value: 'pdfx', label: 'PDF/X', group: 'Document' },
-  { value: 'docx', label: 'DOCX', group: 'Document' },
-  { value: 'odt', label: 'ODT', group: 'Document' },
-  { value: 'cbz', label: 'CBZ', group: 'Archive' },
-  { value: 'cbr', label: 'CBR', group: 'Archive' },
-  { value: 'csv', label: 'CSV', group: 'Spreadsheet' },
-  { value: 'xlsx', label: 'XLSX', group: 'Spreadsheet' },
-  { value: 'pptx', label: 'PPTX', group: 'Presentation' },
-  { value: 'odp', label: 'ODP', group: 'Presentation' },
-  { value: 'txt', label: 'TXT', group: 'Text' },
-  { value: 'rtf', label: 'RTF', group: 'Text' },
-  { value: 'md', label: 'MD', group: 'Text' },
-  { value: 'png', label: 'PNG', group: 'Image' },
-  { value: 'jpg', label: 'JPG', group: 'Image' },
-  { value: 'gif', label: 'GIF', group: 'Image' },
-  { value: 'tiff', label: 'TIFF', group: 'Image' },
-  { value: 'bmp', label: 'BMP', group: 'Image' },
-  { value: 'webp', label: 'WEBP', group: 'Image' },
-  { value: 'html', label: 'HTML', group: 'Web' },
-  { value: 'xml', label: 'XML', group: 'Web' },
-  { value: 'epub', label: 'EPUB', group: 'eBook' },
-  { value: 'azw3', label: 'AZW3', group: 'eBook' },
+  { value: "pdf", label: "PDF", group: "Document" },
+  { value: "pdfa", label: "PDF/A", group: "Document" },
+  { value: "pdfx", label: "PDF/X", group: "Document" },
+  { value: "docx", label: "DOCX", group: "Document" },
+  { value: "odt", label: "ODT", group: "Document" },
+  { value: "cbz", label: "CBZ", group: "Archive" },
+  { value: "cbr", label: "CBR", group: "Archive" },
+  { value: "csv", label: "CSV", group: "Spreadsheet" },
+  { value: "xlsx", label: "XLSX", group: "Spreadsheet" },
+  { value: "pptx", label: "PPTX", group: "Presentation" },
+  { value: "odp", label: "ODP", group: "Presentation" },
+  { value: "txt", label: "TXT", group: "Text" },
+  { value: "rtf", label: "RTF", group: "Text" },
+  { value: "md", label: "MD", group: "Text" },
+  { value: "png", label: "PNG", group: "Image" },
+  { value: "jpg", label: "JPG", group: "Image" },
+  { value: "gif", label: "GIF", group: "Image" },
+  { value: "tiff", label: "TIFF", group: "Image" },
+  { value: "bmp", label: "BMP", group: "Image" },
+  { value: "webp", label: "WEBP", group: "Image" },
+  { value: "html", label: "HTML", group: "Web" },
+  { value: "xml", label: "XML", group: "Web" },
+  { value: "epub", label: "EPUB", group: "eBook" },
+  { value: "azw3", label: "AZW3", group: "eBook" },
 ];
 
 // Conversion matrix - what each source format can convert to
 export const CONVERSION_MATRIX: Record<string, string[]> = {
-  'any': ['pdf'], // Mixed files always convert to PDF
-  'image': ['pdf'], // Multiple images always convert to PDF
-  'pdf': ['png', 'jpg', 'gif', 'tiff', 'bmp', 'webp', 'docx', 'odt', 'pptx', 'odp', 'csv', 'xlsx', 'txt', 'rtf', 'md', 'html', 'xml', 'pdfa', 'pdfx', 'cbz', 'cbr', 'epub', 'azw3'],
-  'cbz': ['pdf'],
-  'docx': ['pdf'], 'doc': ['pdf'], 'odt': ['pdf'],
-  'xlsx': ['pdf'], 'xls': ['pdf'], 'ods': ['pdf'],
-  'pptx': ['pdf'], 'ppt': ['pdf'], 'odp': ['pdf'],
-  'jpg': ['pdf'], 'jpeg': ['pdf'], 'png': ['pdf'], 'gif': ['pdf'], 'bmp': ['pdf'], 'tiff': ['pdf'], 'webp': ['pdf'], 'svg': ['pdf'],
-  'html': ['pdf'],
-  'zip': ['pdf'],
-  'md': ['pdf'],
-  'txt': ['pdf'], 'rtf': ['pdf'],
-  'eml': ['pdf'],
-  'msg': ['pdf'],
-  'cbr': ['pdf'],
-  'epub': ['pdf'], 'mobi': ['pdf'], 'azw3': ['pdf'], 'fb2': ['pdf']
+  any: ["pdf"], // Mixed files always convert to PDF
+  image: ["pdf"], // Multiple images always convert to PDF
+  pdf: [
+    "png",
+    "jpg",
+    "gif",
+    "tiff",
+    "bmp",
+    "webp",
+    "docx",
+    "odt",
+    "pptx",
+    "odp",
+    "csv",
+    "xlsx",
+    "txt",
+    "rtf",
+    "md",
+    "html",
+    "xml",
+    "pdfa",
+    "pdfx",
+    "cbz",
+    "cbr",
+    "epub",
+    "azw3",
+  ],
+  cbz: ["pdf"],
+  docx: ["pdf"],
+  doc: ["pdf"],
+  odt: ["pdf"],
+  xlsx: ["pdf"],
+  xls: ["pdf"],
+  ods: ["pdf"],
+  pptx: ["pdf"],
+  ppt: ["pdf"],
+  odp: ["pdf"],
+  jpg: ["pdf"],
+  jpeg: ["pdf"],
+  png: ["pdf"],
+  gif: ["pdf"],
+  bmp: ["pdf"],
+  tiff: ["pdf"],
+  webp: ["pdf"],
+  svg: ["pdf"],
+  html: ["pdf"],
+  zip: ["pdf"],
+  md: ["pdf"],
+  txt: ["pdf"],
+  rtf: ["pdf"],
+  eml: ["pdf"],
+  msg: ["pdf"],
+  cbr: ["pdf"],
+  epub: ["pdf"],
+  mobi: ["pdf"],
+  azw3: ["pdf"],
+  fb2: ["pdf"],
 };
 
 // Map extensions to endpoint keys
 export const EXTENSION_TO_ENDPOINT: Record<string, Record<string, string>> = {
-  'any': { 'pdf': 'file-to-pdf' }, // Mixed files use file-to-pdf endpoint
-  'image': { 'pdf': 'img-to-pdf' }, // Multiple images use img-to-pdf endpoint
-  'pdf': {
-    'png': 'pdf-to-img', 'jpg': 'pdf-to-img', 'gif': 'pdf-to-img', 'tiff': 'pdf-to-img', 'bmp': 'pdf-to-img', 'webp': 'pdf-to-img',
-    'docx': 'pdf-to-word', 'odt': 'pdf-to-word',
-    'pptx': 'pdf-to-presentation', 'odp': 'pdf-to-presentation',
-    'csv': 'pdf-to-csv',
-    'xlsx': 'pdf-to-xlsx',
-    'txt': 'pdf-to-text', 'rtf': 'pdf-to-text', 'md': 'pdf-to-markdown',
-    'html': 'pdf-to-html', 'xml': 'pdf-to-xml',
-    'pdfa': 'pdf-to-pdfa',
-    'pdfx': 'pdf-to-pdfa',  // PDF/X uses the same endpoint as PDF/A
-    'cbr': 'pdf-to-cbr',
-    'cbz': 'pdf-to-cbz',
-    'epub': 'pdf-to-epub', 'azw3': 'pdf-to-epub'
+  any: { pdf: "file-to-pdf" }, // Mixed files use file-to-pdf endpoint
+  image: { pdf: "img-to-pdf" }, // Multiple images use img-to-pdf endpoint
+  pdf: {
+    png: "pdf-to-img",
+    jpg: "pdf-to-img",
+    gif: "pdf-to-img",
+    tiff: "pdf-to-img",
+    bmp: "pdf-to-img",
+    webp: "pdf-to-img",
+    docx: "pdf-to-word",
+    odt: "pdf-to-word",
+    pptx: "pdf-to-presentation",
+    odp: "pdf-to-presentation",
+    csv: "pdf-to-csv",
+    xlsx: "pdf-to-xlsx",
+    txt: "pdf-to-text",
+    rtf: "pdf-to-text",
+    md: "pdf-to-markdown",
+    html: "pdf-to-html",
+    xml: "pdf-to-xml",
+    pdfa: "pdf-to-pdfa",
+    pdfx: "pdf-to-pdfa", // PDF/X uses the same endpoint as PDF/A
+    cbr: "pdf-to-cbr",
+    cbz: "pdf-to-cbz",
+    epub: "pdf-to-epub",
+    azw3: "pdf-to-epub",
   },
-  'cbz': { 'pdf': 'cbz-to-pdf' },
-  'docx': { 'pdf': 'file-to-pdf' }, 'doc': { 'pdf': 'file-to-pdf' }, 'odt': { 'pdf': 'file-to-pdf' },
-  'xlsx': { 'pdf': 'file-to-pdf' }, 'xls': { 'pdf': 'file-to-pdf' }, 'ods': { 'pdf': 'file-to-pdf' },
-  'pptx': { 'pdf': 'file-to-pdf' }, 'ppt': { 'pdf': 'file-to-pdf' }, 'odp': { 'pdf': 'file-to-pdf' },
-  'jpg': { 'pdf': 'img-to-pdf' }, 'jpeg': { 'pdf': 'img-to-pdf' }, 'png': { 'pdf': 'img-to-pdf' },
-  'gif': { 'pdf': 'img-to-pdf' }, 'bmp': { 'pdf': 'img-to-pdf' }, 'tiff': { 'pdf': 'img-to-pdf' }, 'webp': { 'pdf': 'img-to-pdf' },
-  'svg': { 'pdf': 'svg-to-pdf' },
-  'html': { 'pdf': 'html-to-pdf' },
-  'zip': { 'pdf': 'html-to-pdf' },
-  'md': { 'pdf': 'markdown-to-pdf' },
-  'txt': { 'pdf': 'file-to-pdf' }, 'rtf': { 'pdf': 'file-to-pdf' },
-  'cbr': { 'pdf': 'cbr-to-pdf' },
-  'eml': { 'pdf': 'eml-to-pdf' },
-  'msg': { 'pdf': 'eml-to-pdf' }, // MSG uses same endpoint as EML
-  'epub': { 'pdf': 'ebook-to-pdf' }, 'mobi': { 'pdf': 'ebook-to-pdf' }, 'azw3': { 'pdf': 'ebook-to-pdf' }, 'fb2': { 'pdf': 'ebook-to-pdf' }
+  cbz: { pdf: "cbz-to-pdf" },
+  docx: { pdf: "file-to-pdf" },
+  doc: { pdf: "file-to-pdf" },
+  odt: { pdf: "file-to-pdf" },
+  xlsx: { pdf: "file-to-pdf" },
+  xls: { pdf: "file-to-pdf" },
+  ods: { pdf: "file-to-pdf" },
+  pptx: { pdf: "file-to-pdf" },
+  ppt: { pdf: "file-to-pdf" },
+  odp: { pdf: "file-to-pdf" },
+  jpg: { pdf: "img-to-pdf" },
+  jpeg: { pdf: "img-to-pdf" },
+  png: { pdf: "img-to-pdf" },
+  gif: { pdf: "img-to-pdf" },
+  bmp: { pdf: "img-to-pdf" },
+  tiff: { pdf: "img-to-pdf" },
+  webp: { pdf: "img-to-pdf" },
+  svg: { pdf: "svg-to-pdf" },
+  html: { pdf: "html-to-pdf" },
+  zip: { pdf: "html-to-pdf" },
+  md: { pdf: "markdown-to-pdf" },
+  txt: { pdf: "file-to-pdf" },
+  rtf: { pdf: "file-to-pdf" },
+  cbr: { pdf: "cbr-to-pdf" },
+  eml: { pdf: "eml-to-pdf" },
+  msg: { pdf: "eml-to-pdf" }, // MSG uses same endpoint as EML
+  epub: { pdf: "ebook-to-pdf" },
+  mobi: { pdf: "ebook-to-pdf" },
+  azw3: { pdf: "ebook-to-pdf" },
+  fb2: { pdf: "ebook-to-pdf" },
 };
 
-export type ColorType = typeof COLOR_TYPES[keyof typeof COLOR_TYPES];
-export type OutputOption = typeof OUTPUT_OPTIONS[keyof typeof OUTPUT_OPTIONS];
-export type FitOption = typeof FIT_OPTIONS[keyof typeof FIT_OPTIONS];
+export type ColorType = (typeof COLOR_TYPES)[keyof typeof COLOR_TYPES];
+export type OutputOption = (typeof OUTPUT_OPTIONS)[keyof typeof OUTPUT_OPTIONS];
+export type FitOption = (typeof FIT_OPTIONS)[keyof typeof FIT_OPTIONS];
diff --git a/frontend/src/core/constants/convertSupportedFornats.ts b/frontend/src/core/constants/convertSupportedFornats.ts
index adfcce7e3d..9d829a0770 100644
--- a/frontend/src/core/constants/convertSupportedFornats.ts
+++ b/frontend/src/core/constants/convertSupportedFornats.ts
@@ -1,21 +1,89 @@
 // Central list of formats supported by Convert operations
 export const CONVERT_SUPPORTED_FORMATS = [
   // Microsoft Office
-  'doc', 'docx', 'dot', 'dotx', 'csv', 'xls', 'xlsx', 'xlt', 'xltx', 'slk', 'dif', 'ppt', 'pptx',
+  "doc",
+  "docx",
+  "dot",
+  "dotx",
+  "csv",
+  "xls",
+  "xlsx",
+  "xlt",
+  "xltx",
+  "slk",
+  "dif",
+  "ppt",
+  "pptx",
   // OpenDocument
-  'odt', 'ott', 'ods', 'ots', 'odp', 'otp', 'odg', 'otg',
+  "odt",
+  "ott",
+  "ods",
+  "ots",
+  "odp",
+  "otp",
+  "odg",
+  "otg",
   // Text formats
-  'txt', 'text', 'xml', 'rtf', 'html', 'lwp', 'md', 'json',
+  "txt",
+  "text",
+  "xml",
+  "rtf",
+  "html",
+  "lwp",
+  "md",
+  "json",
   // Images
-  'bmp', 'gif', 'jpeg', 'jpg', 'png', 'tif', 'tiff', 'pbm', 'pgm', 'ppm', 'ras', 'xbm', 'xpm', 'svg', 'svm', 'wmf', 'webp',
+  "bmp",
+  "gif",
+  "jpeg",
+  "jpg",
+  "png",
+  "tif",
+  "tiff",
+  "pbm",
+  "pgm",
+  "ppm",
+  "ras",
+  "xbm",
+  "xpm",
+  "svg",
+  "svm",
+  "wmf",
+  "webp",
   // StarOffice
-  'sda', 'sdc', 'sdd', 'sdw', 'stc', 'std', 'sti', 'stw', 'sxd', 'sxg', 'sxi', 'sxw',
+  "sda",
+  "sdc",
+  "sdd",
+  "sdw",
+  "stc",
+  "std",
+  "sti",
+  "stw",
+  "sxd",
+  "sxg",
+  "sxi",
+  "sxw",
   // Email formats
-  'eml', 'msg',
+  "eml",
+  "msg",
   // Ebook formats
-  'epub', 'mobi', 'azw3', 'fb2',
+  "epub",
+  "mobi",
+  "azw3",
+  "fb2",
   // Archive formats
-  'zip', 'cbr', 'cbz',
+  "zip",
+  "cbr",
+  "cbz",
   // Other
-  'dbf', 'fods', 'vsd', 'vor', 'vor3', 'vor4', 'uop', 'pct', 'ps', 'pdf',
+  "dbf",
+  "fods",
+  "vsd",
+  "vor",
+  "vor3",
+  "vor4",
+  "uop",
+  "pct",
+  "ps",
+  "pdf",
 ];
diff --git a/frontend/src/core/constants/cropConstants.ts b/frontend/src/core/constants/cropConstants.ts
index deff3cfe4f..9a8c7977ef 100644
--- a/frontend/src/core/constants/cropConstants.ts
+++ b/frontend/src/core/constants/cropConstants.ts
@@ -8,5 +8,13 @@ export const DEFAULT_CROP_AREA = {
   height: PAGE_SIZES.A4.height,
 } as const;
 
-
-export type ResizeHandle = 'nw' | 'ne' | 'sw' | 'se' | 'n' | 'e' | 's' | 'w' | null;
+export type ResizeHandle =
+  | "nw"
+  | "ne"
+  | "sw"
+  | "se"
+  | "n"
+  | "e"
+  | "s"
+  | "w"
+  | null;
diff --git a/frontend/src/core/constants/downloads.ts b/frontend/src/core/constants/downloads.ts
index 5eee10a281..e67f8f7daf 100644
--- a/frontend/src/core/constants/downloads.ts
+++ b/frontend/src/core/constants/downloads.ts
@@ -1,10 +1,9 @@
 // Centralized download URLs for Stirling PDF desktop installers
 export const DOWNLOAD_URLS = {
-  WINDOWS: 'https://files.stirlingpdf.com/win-installer.exe',
-  MAC_APPLE_SILICON: 'https://files.stirlingpdf.com/mac-installer.dmg',
-  MAC_INTEL: 'https://files.stirlingpdf.com/mac-x86_64-installer.dmg',
-  LINUX_DOCS: 'https://docs.stirlingpdf.com/Installation/Unix%20Installation/',
+  WINDOWS: "https://files.stirlingpdf.com/win-installer.exe",
+  MAC_APPLE_SILICON: "https://files.stirlingpdf.com/mac-installer.dmg",
+  MAC_INTEL: "https://files.stirlingpdf.com/mac-x86_64-installer.dmg",
+  LINUX_DOCS: "https://docs.stirlingpdf.com/Installation/Unix%20Installation/",
 } as const;
 
-export const DOWNLOAD_BASE_URL = 'https://files.stirlingpdf.com/';
-
+export const DOWNLOAD_BASE_URL = "https://files.stirlingpdf.com/";
diff --git a/frontend/src/core/constants/events.ts b/frontend/src/core/constants/events.ts
index a7455fc3fe..aa93ebcfaf 100644
--- a/frontend/src/core/constants/events.ts
+++ b/frontend/src/core/constants/events.ts
@@ -1,10 +1,10 @@
-import type { LicenseNotice } from '@app/types/types';
+import type { LicenseNotice } from "@app/types/types";
 
-export const SERVER_LICENSE_REQUEST_EVENT = 'stirling:server-license-requested';
-export const UPGRADE_BANNER_TEST_EVENT = 'stirling:upgrade-banner-test';
-export const UPGRADE_BANNER_ALERT_EVENT = 'stirling:upgrade-banner-alert';
-export const START_TOUR_EVENT = 'stirling:start-tour';
-export const TOUR_STATE_EVENT = 'stirling:tour-state';
+export const SERVER_LICENSE_REQUEST_EVENT = "stirling:server-license-requested";
+export const UPGRADE_BANNER_TEST_EVENT = "stirling:upgrade-banner-test";
+export const UPGRADE_BANNER_ALERT_EVENT = "stirling:upgrade-banner-alert";
+export const START_TOUR_EVENT = "stirling:start-tour";
+export const TOUR_STATE_EVENT = "stirling:tour-state";
 
 export interface ServerLicenseRequestPayload {
   licenseNotice?: Partial<LicenseNotice>;
@@ -12,7 +12,11 @@ export interface ServerLicenseRequestPayload {
   selfReportedAdmin?: boolean;
 }
 
-export type UpgradeBannerTestScenario = 'friendly' | 'urgent-admin' | 'urgent-user' | null;
+export type UpgradeBannerTestScenario =
+  | "friendly"
+  | "urgent-admin"
+  | "urgent-user"
+  | null;
 
 export interface UpgradeBannerTestPayload {
   scenario: UpgradeBannerTestScenario;
@@ -20,12 +24,12 @@ export interface UpgradeBannerTestPayload {
 
 export interface UpgradeBannerAlertPayload {
   active: boolean;
-  audience?: 'admin' | 'user';
+  audience?: "admin" | "user";
   totalUsers?: number | null;
   freeTierLimit?: number;
 }
 
-export type TourType = 'admin' | 'tools' | 'whatsnew';
+export type TourType = "admin" | "tools" | "whatsnew";
 
 export interface StartTourPayload {
   tourType: TourType;
@@ -37,17 +41,18 @@ export interface TourStatePayload {
 
 /** Helper to dispatch the start tour event */
 export function requestStartTour(tourType: TourType): void {
-  if (typeof window === 'undefined') return;
+  if (typeof window === "undefined") return;
   window.dispatchEvent(
-    new CustomEvent<StartTourPayload>(START_TOUR_EVENT, { detail: { tourType } })
+    new CustomEvent<StartTourPayload>(START_TOUR_EVENT, {
+      detail: { tourType },
+    }),
   );
 }
 
 /** Helper to dispatch tour state changes (for hiding cookie consent during tour) */
 export function dispatchTourState(isOpen: boolean): void {
-  if (typeof window === 'undefined') return;
+  if (typeof window === "undefined") return;
   window.dispatchEvent(
-    new CustomEvent<TourStatePayload>(TOUR_STATE_EVENT, { detail: { isOpen } })
+    new CustomEvent<TourStatePayload>(TOUR_STATE_EVENT, { detail: { isOpen } }),
   );
 }
-
diff --git a/frontend/src/core/constants/logo.ts b/frontend/src/core/constants/logo.ts
index 7838f396b3..d73f14b4a7 100644
--- a/frontend/src/core/constants/logo.ts
+++ b/frontend/src/core/constants/logo.ts
@@ -1,15 +1,14 @@
-import type { LogoVariant } from '@app/services/preferencesService';
+import type { LogoVariant } from "@app/services/preferencesService";
 
 export const LOGO_FOLDER_BY_VARIANT: Record<LogoVariant, string> = {
-  modern: 'modern-logo',
-  classic: 'classic-logo',
+  modern: "modern-logo",
+  classic: "classic-logo",
 };
 
 export const ensureLogoVariant = (value?: string | null): LogoVariant => {
-  return value === 'classic' ? 'classic' : 'modern';
+  return value === "classic" ? "classic" : "modern";
 };
 
 export const getLogoFolder = (variant?: LogoVariant | null): string => {
   return LOGO_FOLDER_BY_VARIANT[ensureLogoVariant(variant)];
 };
-
diff --git a/frontend/src/core/constants/routes.ts b/frontend/src/core/constants/routes.ts
index 98081b7c4f..91af374cbe 100644
--- a/frontend/src/core/constants/routes.ts
+++ b/frontend/src/core/constants/routes.ts
@@ -8,12 +8,12 @@
  * the main app chrome is not displayed.
  */
 export const AUTH_ROUTES = [
-  '/login',
-  '/signup',
-  '/auth',
-  '/invite',
-  '/forgot-password',
-  '/reset-password',
+  "/login",
+  "/signup",
+  "/auth",
+  "/invite",
+  "/forgot-password",
+  "/reset-password",
 ];
 
 /**
@@ -22,4 +22,3 @@ export const AUTH_ROUTES = [
 export function isAuthRoute(pathname: string): boolean {
   return AUTH_ROUTES.some((route) => pathname.startsWith(route));
 }
-
diff --git a/frontend/src/core/constants/signConstants.ts b/frontend/src/core/constants/signConstants.ts
index ade726a6c5..c7e46ef852 100644
--- a/frontend/src/core/constants/signConstants.ts
+++ b/frontend/src/core/constants/signConstants.ts
@@ -1,14 +1,14 @@
 // Timeout delays (ms) to allow PDF viewer to complete rendering before activating placement mode
-export const PLACEMENT_ACTIVATION_DELAY = 60;  // Standard delay for signature changes
+export const PLACEMENT_ACTIVATION_DELAY = 60; // Standard delay for signature changes
 export const FILE_SWITCH_ACTIVATION_DELAY = 80; // Slightly longer delay when switching files
 
 // Signature preview sizing
-export const MAX_PREVIEW_WIDTH_RATIO = 0.35;   // Max preview width as percentage of container
-export const MAX_PREVIEW_HEIGHT_RATIO = 0.35;  // Max preview height as percentage of container
-export const MAX_PREVIEW_WIDTH_REM = 15;       // Absolute max width in rem
-export const MAX_PREVIEW_HEIGHT_REM = 10;      // Absolute max height in rem
+export const MAX_PREVIEW_WIDTH_RATIO = 0.35; // Max preview width as percentage of container
+export const MAX_PREVIEW_HEIGHT_RATIO = 0.35; // Max preview height as percentage of container
+export const MAX_PREVIEW_WIDTH_REM = 15; // Absolute max width in rem
+export const MAX_PREVIEW_HEIGHT_REM = 10; // Absolute max height in rem
 export const MIN_SIGNATURE_DIMENSION_REM = 0.75; // Min dimension for visibility
-export const OVERLAY_EDGE_PADDING_REM = 0.25;  // Padding from container edges
+export const OVERLAY_EDGE_PADDING_REM = 0.25; // Padding from container edges
 
 // Text signature padding (relative to font size)
 export const HORIZONTAL_PADDING_RATIO = 0.8;
diff --git a/frontend/src/core/constants/splitConstants.ts b/frontend/src/core/constants/splitConstants.ts
index c4add6ed25..5561ae957f 100644
--- a/frontend/src/core/constants/splitConstants.ts
+++ b/frontend/src/core/constants/splitConstants.ts
@@ -1,32 +1,31 @@
 export const SPLIT_METHODS = {
-  BY_PAGES: 'byPages',
-  BY_SECTIONS: 'bySections',
-  BY_SIZE: 'bySize',
-  BY_PAGE_COUNT: 'byPageCount',
-  BY_DOC_COUNT: 'byDocCount',
-  BY_CHAPTERS: 'byChapters',
-  BY_PAGE_DIVIDER: 'byPageDivider',
-  BY_POSTER: 'byPoster'
+  BY_PAGES: "byPages",
+  BY_SECTIONS: "bySections",
+  BY_SIZE: "bySize",
+  BY_PAGE_COUNT: "byPageCount",
+  BY_DOC_COUNT: "byDocCount",
+  BY_CHAPTERS: "byChapters",
+  BY_PAGE_DIVIDER: "byPageDivider",
+  BY_POSTER: "byPoster",
 } as const;
 
-
 export const ENDPOINTS = {
-  [SPLIT_METHODS.BY_PAGES]: 'split-pages',
-  [SPLIT_METHODS.BY_SECTIONS]: 'split-pdf-by-sections',
-  [SPLIT_METHODS.BY_SIZE]: 'split-by-size-or-count',
-  [SPLIT_METHODS.BY_PAGE_COUNT]: 'split-by-size-or-count',
-  [SPLIT_METHODS.BY_DOC_COUNT]: 'split-by-size-or-count',
-  [SPLIT_METHODS.BY_CHAPTERS]: 'split-pdf-by-chapters',
-  [SPLIT_METHODS.BY_PAGE_DIVIDER]: 'auto-split-pdf',
-  [SPLIT_METHODS.BY_POSTER]: 'split-for-poster-print'
+  [SPLIT_METHODS.BY_PAGES]: "split-pages",
+  [SPLIT_METHODS.BY_SECTIONS]: "split-pdf-by-sections",
+  [SPLIT_METHODS.BY_SIZE]: "split-by-size-or-count",
+  [SPLIT_METHODS.BY_PAGE_COUNT]: "split-by-size-or-count",
+  [SPLIT_METHODS.BY_DOC_COUNT]: "split-by-size-or-count",
+  [SPLIT_METHODS.BY_CHAPTERS]: "split-pdf-by-chapters",
+  [SPLIT_METHODS.BY_PAGE_DIVIDER]: "auto-split-pdf",
+  [SPLIT_METHODS.BY_POSTER]: "split-for-poster-print",
 } as const;
 
-export type SplitMethod = typeof SPLIT_METHODS[keyof typeof SPLIT_METHODS];
+export type SplitMethod = (typeof SPLIT_METHODS)[keyof typeof SPLIT_METHODS];
 export const isSplitMethod = (value: string | null): value is SplitMethod => {
   return Object.values(SPLIT_METHODS).includes(value as SplitMethod);
 };
 
-import { CardOption } from '@app/components/shared/CardSelector';
+import { CardOption } from "@app/components/shared/CardSelector";
 
 export interface MethodOption extends CardOption<SplitMethod> {
   tooltipKey: string;
@@ -37,50 +36,48 @@ export const METHOD_OPTIONS: MethodOption[] = [
     value: SPLIT_METHODS.BY_PAGES,
     prefixKey: "split.methods.prefix.splitAt",
     nameKey: "split.methods.byPages.name",
-    tooltipKey: "split.methods.byPages.tooltip"
+    tooltipKey: "split.methods.byPages.tooltip",
   },
   {
     value: SPLIT_METHODS.BY_CHAPTERS,
     prefixKey: "split.methods.prefix.splitBy",
     nameKey: "split.methods.byChapters.name",
-    tooltipKey: "split.methods.byChapters.tooltip"
+    tooltipKey: "split.methods.byChapters.tooltip",
   },
   {
     value: SPLIT_METHODS.BY_SECTIONS,
     prefixKey: "split.methods.prefix.splitBy",
     nameKey: "split.methods.bySections.name",
-    tooltipKey: "split.methods.bySections.tooltip"
+    tooltipKey: "split.methods.bySections.tooltip",
   },
   {
     value: SPLIT_METHODS.BY_SIZE,
     prefixKey: "split.methods.prefix.splitBy",
     nameKey: "split.methods.bySize.name",
-    tooltipKey: "split.methods.bySize.tooltip"
+    tooltipKey: "split.methods.bySize.tooltip",
   },
   {
     value: SPLIT_METHODS.BY_PAGE_COUNT,
     prefixKey: "split.methods.prefix.splitBy",
     nameKey: "split.methods.byPageCount.name",
-    tooltipKey: "split.methods.byPageCount.tooltip"
+    tooltipKey: "split.methods.byPageCount.tooltip",
   },
   {
     value: SPLIT_METHODS.BY_DOC_COUNT,
     prefixKey: "split.methods.prefix.splitBy",
     nameKey: "split.methods.byDocCount.name",
-    tooltipKey: "split.methods.byDocCount.tooltip"
+    tooltipKey: "split.methods.byDocCount.tooltip",
   },
   {
     value: SPLIT_METHODS.BY_PAGE_DIVIDER,
     prefixKey: "split.methods.prefix.splitBy",
     nameKey: "split.methods.byPageDivider.name",
-    tooltipKey: "split.methods.byPageDivider.tooltip"
+    tooltipKey: "split.methods.byPageDivider.tooltip",
   },
   {
     value: SPLIT_METHODS.BY_POSTER,
     prefixKey: "split.methods.prefix.splitInto",
     nameKey: "split.methods.byPoster.name",
-    tooltipKey: "split.methods.byPoster.tooltip"
-  }
+    tooltipKey: "split.methods.byPoster.tooltip",
+  },
 ];
-
-
diff --git a/frontend/src/core/constants/theme.ts b/frontend/src/core/constants/theme.ts
index f16c1c4554..2de5b145cb 100644
--- a/frontend/src/core/constants/theme.ts
+++ b/frontend/src/core/constants/theme.ts
@@ -1,8 +1,10 @@
 // Theme constants and utilities
 
-export type ThemeMode = 'light' | 'dark' | 'rainbow';
+export type ThemeMode = "light" | "dark" | "rainbow";
 
 // Detect OS theme preference
-export function getSystemTheme(): 'light' | 'dark' {
-  return window?.matchMedia?.('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
+export function getSystemTheme(): "light" | "dark" {
+  return window?.matchMedia?.("(prefers-color-scheme: dark)").matches
+    ? "dark"
+    : "light";
 }
diff --git a/frontend/src/core/constants/toolPanel.ts b/frontend/src/core/constants/toolPanel.ts
index 01e556fcf5..e292d7e926 100644
--- a/frontend/src/core/constants/toolPanel.ts
+++ b/frontend/src/core/constants/toolPanel.ts
@@ -1,5 +1,5 @@
 // Tool panel constants
 
-export type ToolPanelMode = 'sidebar' | 'fullscreen';
+export type ToolPanelMode = "sidebar" | "fullscreen";
 
-export const DEFAULT_TOOL_PANEL_MODE: ToolPanelMode = 'sidebar';
+export const DEFAULT_TOOL_PANEL_MODE: ToolPanelMode = "sidebar";
diff --git a/frontend/src/core/contexts/AdminTourOrchestrationContext.tsx b/frontend/src/core/contexts/AdminTourOrchestrationContext.tsx
index 3bac8f101e..5fd1b3f4c6 100644
--- a/frontend/src/core/contexts/AdminTourOrchestrationContext.tsx
+++ b/frontend/src/core/contexts/AdminTourOrchestrationContext.tsx
@@ -1,5 +1,5 @@
-import React, { createContext, useContext, useCallback, useRef } from 'react';
-import { useNavigate, useLocation } from 'react-router-dom';
+import React, { createContext, useContext, useCallback, useRef } from "react";
+import { useNavigate, useLocation } from "react-router-dom";
 
 interface AdminTourOrchestrationContextType {
   // State management
@@ -16,48 +16,62 @@ interface AdminTourOrchestrationContextType {
   scrollToSetting: (settingId: string) => void;
 }
 
-const AdminTourOrchestrationContext = createContext<AdminTourOrchestrationContextType | undefined>(undefined);
+const AdminTourOrchestrationContext = createContext<
+  AdminTourOrchestrationContextType | undefined
+>(undefined);
 
-export const AdminTourOrchestrationProvider: React.FC<{ children: React.ReactNode }> = ({ children }) => {
+export const AdminTourOrchestrationProvider: React.FC<{
+  children: React.ReactNode;
+}> = ({ children }) => {
   const navigate = useNavigate();
   const location = useLocation();
 
   // Store the user's location before tour starts
-  const savedLocationRef = useRef<string>('');
+  const savedLocationRef = useRef<string>("");
 
   const saveAdminState = useCallback(() => {
     savedLocationRef.current = location.pathname;
-    console.log('Saving admin state, location:', location.pathname);
+    console.log("Saving admin state, location:", location.pathname);
   }, [location.pathname]);
 
   const restoreAdminState = useCallback(() => {
-    console.log('Restoring admin state, saved location:', savedLocationRef.current);
+    console.log(
+      "Restoring admin state, saved location:",
+      savedLocationRef.current,
+    );
 
     // Navigate back to saved location or home
-    const targetPath = savedLocationRef.current || '/';
+    const targetPath = savedLocationRef.current || "/";
     navigate(targetPath, { replace: true });
 
-    savedLocationRef.current = '';
+    savedLocationRef.current = "";
   }, [navigate]);
 
   const openConfigModal = useCallback(() => {
     // Navigate to settings overview to open the modal
-    navigate('/settings/overview');
+    navigate("/settings/overview");
   }, [navigate]);
 
   const closeConfigModal = useCallback(() => {
     // Navigate back to home to close the modal
-    navigate('/', { replace: true });
+    navigate("/", { replace: true });
   }, [navigate]);
 
-  const navigateToSection = useCallback((section: string) => {
-    navigate(`/settings/${section}`);
-  }, [navigate]);
+  const navigateToSection = useCallback(
+    (section: string) => {
+      navigate(`/settings/${section}`);
+    },
+    [navigate],
+  );
 
   const scrollNavToSection = useCallback((section: string): Promise<void> => {
     return new Promise((resolve) => {
-      const navElement = document.querySelector(`[data-tour="admin-${section}-nav"]`) as HTMLElement;
-      const scrollContainer = document.querySelector('.modal-nav-scroll') as HTMLElement;
+      const navElement = document.querySelector(
+        `[data-tour="admin-${section}-nav"]`,
+      ) as HTMLElement;
+      const scrollContainer = document.querySelector(
+        ".modal-nav-scroll",
+      ) as HTMLElement;
 
       if (navElement && scrollContainer) {
         // Get the position of the nav element relative to the scroll container
@@ -66,12 +80,12 @@ export const AdminTourOrchestrationProvider: React.FC<{ children: React.ReactNod
         const navHeight = navElement.offsetHeight;
 
         // Calculate scroll position to center the element
-        const scrollTo = navTop - (containerHeight / 2) + (navHeight / 2);
+        const scrollTo = navTop - containerHeight / 2 + navHeight / 2;
 
         // Instant scroll to avoid timing issues
         scrollContainer.scrollTo({
           top: Math.max(0, scrollTo),
-          behavior: 'auto'
+          behavior: "auto",
         });
 
         // Use multiple animation frames to ensure browser has fully updated
@@ -93,7 +107,7 @@ export const AdminTourOrchestrationProvider: React.FC<{ children: React.ReactNod
     setTimeout(() => {
       const element = document.querySelector(`[data-tour="${settingId}"]`);
       if (element) {
-        element.scrollIntoView({ behavior: 'smooth', block: 'center' });
+        element.scrollIntoView({ behavior: "smooth", block: "center" });
       }
     }, 300);
   }, []);
@@ -115,10 +129,13 @@ export const AdminTourOrchestrationProvider: React.FC<{ children: React.ReactNod
   );
 };
 
-export const useAdminTourOrchestration = (): AdminTourOrchestrationContextType => {
-  const context = useContext(AdminTourOrchestrationContext);
-  if (!context) {
-    throw new Error('useAdminTourOrchestration must be used within AdminTourOrchestrationProvider');
-  }
-  return context;
-};
+export const useAdminTourOrchestration =
+  (): AdminTourOrchestrationContextType => {
+    const context = useContext(AdminTourOrchestrationContext);
+    if (!context) {
+      throw new Error(
+        "useAdminTourOrchestration must be used within AdminTourOrchestrationProvider",
+      );
+    }
+    return context;
+  };
diff --git a/frontend/src/core/contexts/AnnotationContext.tsx b/frontend/src/core/contexts/AnnotationContext.tsx
index fff0a7d94f..cfddc0e14c 100644
--- a/frontend/src/core/contexts/AnnotationContext.tsx
+++ b/frontend/src/core/contexts/AnnotationContext.tsx
@@ -1,26 +1,34 @@
-import React, { createContext, useContext, ReactNode, useRef } from 'react';
-import type { AnnotationAPI } from '@app/components/viewer/viewerTypes';
+import React, { createContext, useContext, ReactNode, useRef } from "react";
+import type { AnnotationAPI } from "@app/components/viewer/viewerTypes";
 
 interface AnnotationContextValue {
   annotationApiRef: React.RefObject<AnnotationAPI | null>;
 }
 
-const AnnotationContext = createContext<AnnotationContextValue | undefined>(undefined);
+const AnnotationContext = createContext<AnnotationContextValue | undefined>(
+  undefined,
+);
 
-export const AnnotationProvider: React.FC<{ children: ReactNode }> = ({ children }) => {
+export const AnnotationProvider: React.FC<{ children: ReactNode }> = ({
+  children,
+}) => {
   const annotationApiRef = useRef<AnnotationAPI>(null);
 
   const value: AnnotationContextValue = {
     annotationApiRef,
   };
 
-  return <AnnotationContext.Provider value={value}>{children}</AnnotationContext.Provider>;
+  return (
+    <AnnotationContext.Provider value={value}>
+      {children}
+    </AnnotationContext.Provider>
+  );
 };
 
 export const useAnnotation = (): AnnotationContextValue => {
   const context = useContext(AnnotationContext);
   if (!context) {
-    throw new Error('useAnnotation must be used within an AnnotationProvider');
+    throw new Error("useAnnotation must be used within an AnnotationProvider");
   }
   return context;
 };
diff --git a/frontend/src/core/contexts/AppConfigContext.test.tsx b/frontend/src/core/contexts/AppConfigContext.test.tsx
index 8ec3a79ad0..eb630b7715 100644
--- a/frontend/src/core/contexts/AppConfigContext.test.tsx
+++ b/frontend/src/core/contexts/AppConfigContext.test.tsx
@@ -1,18 +1,21 @@
-import { describe, it, expect, beforeEach, vi, afterEach } from 'vitest';
-import { waitFor, renderHook, act } from '@testing-library/react';
-import { AppConfigProvider, useAppConfig } from '@app/contexts/AppConfigContext';
-import apiClient from '@app/services/apiClient';
-import { ReactNode } from 'react';
+import { describe, it, expect, beforeEach, vi, afterEach } from "vitest";
+import { waitFor, renderHook, act } from "@testing-library/react";
+import {
+  AppConfigProvider,
+  useAppConfig,
+} from "@app/contexts/AppConfigContext";
+import apiClient from "@app/services/apiClient";
+import { ReactNode } from "react";
 
 // Mock apiClient
-vi.mock('@app/services/apiClient');
+vi.mock("@app/services/apiClient");
 
-describe('AppConfigContext', () => {
+describe("AppConfigContext", () => {
   beforeEach(() => {
     vi.clearAllMocks();
     // Mock window.location.pathname
-    Object.defineProperty(window, 'location', {
-      value: { pathname: '/' },
+    Object.defineProperty(window, "location", {
+      value: { pathname: "/" },
       writable: true,
     });
   });
@@ -25,11 +28,11 @@ describe('AppConfigContext', () => {
     <AppConfigProvider>{children}</AppConfigProvider>
   );
 
-  it('should fetch and provide app config on non-auth pages', async () => {
+  it("should fetch and provide app config on non-auth pages", async () => {
     const mockConfig = {
       enableLogin: false,
-      appNameNavbar: 'Stirling PDF',
-      languages: ['en-US', 'en-GB'],
+      appNameNavbar: "Stirling PDF",
+      languages: ["en-US", "en-GB"],
     };
 
     vi.mocked(apiClient.get).mockResolvedValueOnce({
@@ -49,16 +52,16 @@ describe('AppConfigContext', () => {
       expect(result.current.error).toBeNull();
     });
 
-    expect(apiClient.get).toHaveBeenCalledWith('/api/v1/config/app-config', {
+    expect(apiClient.get).toHaveBeenCalledWith("/api/v1/config/app-config", {
       suppressErrorToast: true,
       skipAuthRedirect: true,
     });
   });
 
-  it('should skip fetch on auth pages and use default config', async () => {
+  it("should skip fetch on auth pages and use default config", async () => {
     // Mock being on login page
-    Object.defineProperty(window, 'location', {
-      value: { pathname: '/login' },
+    Object.defineProperty(window, "location", {
+      value: { pathname: "/login" },
       writable: true,
     });
 
@@ -73,8 +76,8 @@ describe('AppConfigContext', () => {
     expect(apiClient.get).not.toHaveBeenCalled();
   });
 
-  it('should handle 401 error gracefully', async () => {
-    const mockError = Object.assign(new Error('Unauthorized'), {
+  it("should handle 401 error gracefully", async () => {
+    const mockError = Object.assign(new Error("Unauthorized"), {
       response: { status: 401, data: {} },
     });
     vi.mocked(apiClient.get).mockRejectedValueOnce(mockError);
@@ -88,8 +91,8 @@ describe('AppConfigContext', () => {
     });
   });
 
-  it('should handle network errors', async () => {
-    const errorMessage = 'Network error occurred';
+  it("should handle network errors", async () => {
+    const errorMessage = "Network error occurred";
     const mockError = new Error(errorMessage);
     // Network errors don't have response property
     // Mock rejection for all retry attempts (default is 3 attempts)
@@ -107,9 +110,9 @@ describe('AppConfigContext', () => {
     });
   });
 
-  it('should skip fetch on signup page', async () => {
-    Object.defineProperty(window, 'location', {
-      value: { pathname: '/signup' },
+  it("should skip fetch on signup page", async () => {
+    Object.defineProperty(window, "location", {
+      value: { pathname: "/signup" },
       writable: true,
     });
 
@@ -123,9 +126,9 @@ describe('AppConfigContext', () => {
     expect(apiClient.get).not.toHaveBeenCalled();
   });
 
-  it('should skip fetch on auth callback page', async () => {
-    Object.defineProperty(window, 'location', {
-      value: { pathname: '/auth/callback' },
+  it("should skip fetch on auth callback page", async () => {
+    Object.defineProperty(window, "location", {
+      value: { pathname: "/auth/callback" },
       writable: true,
     });
 
@@ -139,9 +142,9 @@ describe('AppConfigContext', () => {
     expect(apiClient.get).not.toHaveBeenCalled();
   });
 
-  it('should skip fetch on invite accept page', async () => {
-    Object.defineProperty(window, 'location', {
-      value: { pathname: '/invite/abc123' },
+  it("should skip fetch on invite accept page", async () => {
+    Object.defineProperty(window, "location", {
+      value: { pathname: "/invite/abc123" },
       writable: true,
     });
 
@@ -155,15 +158,15 @@ describe('AppConfigContext', () => {
     expect(apiClient.get).not.toHaveBeenCalled();
   });
 
-  it('should refetch config when jwt-available event is triggered', async () => {
+  it("should refetch config when jwt-available event is triggered", async () => {
     const initialConfig = {
       enableLogin: true,
-      appNameNavbar: 'Stirling PDF',
+      appNameNavbar: "Stirling PDF",
     };
 
     const updatedConfig = {
       enableLogin: true,
-      appNameNavbar: 'Stirling PDF',
+      appNameNavbar: "Stirling PDF",
       isAdmin: true,
       enableAnalytics: true,
     };
@@ -188,7 +191,7 @@ describe('AppConfigContext', () => {
 
     // Trigger jwt-available event wrapped in act
     await act(async () => {
-      window.dispatchEvent(new CustomEvent('jwt-available'));
+      window.dispatchEvent(new CustomEvent("jwt-available"));
       // Wait a tick for event handler to run
       await new Promise((resolve) => setTimeout(resolve, 0));
     });
@@ -200,10 +203,10 @@ describe('AppConfigContext', () => {
     expect(apiClient.get).toHaveBeenCalledTimes(2);
   });
 
-  it('should provide refetch function', async () => {
+  it("should provide refetch function", async () => {
     const mockConfig = {
       enableLogin: false,
-      appNameNavbar: 'Test App',
+      appNameNavbar: "Test App",
     };
 
     vi.mocked(apiClient.get).mockResolvedValue({
@@ -225,7 +228,7 @@ describe('AppConfigContext', () => {
     expect(apiClient.get).toHaveBeenCalledTimes(2);
   });
 
-  it('should not fetch twice without force flag', async () => {
+  it("should not fetch twice without force flag", async () => {
     const mockConfig = {
       enableLogin: false,
     };
@@ -245,10 +248,10 @@ describe('AppConfigContext', () => {
     expect(apiClient.get).toHaveBeenCalledTimes(1);
   });
 
-  it('should handle initial config prop', async () => {
+  it("should handle initial config prop", async () => {
     const initialConfig = {
       enableLogin: false,
-      appNameNavbar: 'Initial App',
+      appNameNavbar: "Initial App",
     };
 
     const customWrapper = ({ children }: { children: ReactNode }) => (
@@ -270,7 +273,7 @@ describe('AppConfigContext', () => {
     expect(apiClient.get).toHaveBeenCalled();
   });
 
-  it('should use suppressErrorToast for all config requests', async () => {
+  it("should use suppressErrorToast for all config requests", async () => {
     const mockConfig = { enableLogin: true };
 
     vi.mocked(apiClient.get).mockResolvedValueOnce({
@@ -281,7 +284,7 @@ describe('AppConfigContext', () => {
     renderHook(() => useAppConfig(), { wrapper });
 
     await waitFor(() => {
-      expect(apiClient.get).toHaveBeenCalledWith('/api/v1/config/app-config', {
+      expect(apiClient.get).toHaveBeenCalledWith("/api/v1/config/app-config", {
         suppressErrorToast: true,
         skipAuthRedirect: true,
       });
diff --git a/frontend/src/core/contexts/AppConfigContext.tsx b/frontend/src/core/contexts/AppConfigContext.tsx
index 8ffac68772..021508c36c 100644
--- a/frontend/src/core/contexts/AppConfigContext.tsx
+++ b/frontend/src/core/contexts/AppConfigContext.tsx
@@ -1,14 +1,21 @@
-import React, { createContext, useContext, useState, useEffect, ReactNode, useCallback } from 'react';
-import apiClient from '@app/services/apiClient';
-import { getSimulatedAppConfig } from '@app/testing/serverExperienceSimulations';
-import type { AppConfig, AppConfigBootstrapMode } from '@app/types/appConfig';
-import { useJwtConfigSync } from '@app/hooks/useJwtConfigSync';
+import React, {
+  createContext,
+  useContext,
+  useState,
+  useEffect,
+  ReactNode,
+  useCallback,
+} from "react";
+import apiClient from "@app/services/apiClient";
+import { getSimulatedAppConfig } from "@app/testing/serverExperienceSimulations";
+import type { AppConfig, AppConfigBootstrapMode } from "@app/types/appConfig";
+import { useJwtConfigSync } from "@app/hooks/useJwtConfigSync";
 
 /**
  * Sleep utility for delays
  */
 function sleep(ms: number): Promise<void> {
-  return new Promise(resolve => setTimeout(resolve, ms));
+  return new Promise((resolve) => setTimeout(resolve, ms));
 }
 
 export interface AppConfigRetryOptions {
@@ -49,16 +56,18 @@ export const AppConfigProvider: React.FC<AppConfigProviderProps> = ({
   children,
   retryOptions,
   initialConfig = null,
-  bootstrapMode = 'blocking',
+  bootstrapMode = "blocking",
   autoFetch = true,
   onConfigLoaded,
 }) => {
-  const isBlockingMode = bootstrapMode === 'blocking';
+  const isBlockingMode = bootstrapMode === "blocking";
   const [config, setConfig] = useState<AppConfig | null>(initialConfig);
   const [error, setError] = useState<string | null>(null);
   // Track how many times we've attempted to fetch. useRef avoids re-renders that can trigger loops.
   const fetchCountRef = React.useRef(0);
-  const [hasResolvedConfig, setHasResolvedConfig] = useState(Boolean(initialConfig) && !isBlockingMode);
+  const [hasResolvedConfig, setHasResolvedConfig] = useState(
+    Boolean(initialConfig) && !isBlockingMode,
+  );
   const [loading, setLoading] = useState(!hasResolvedConfig);
 
   const onConfigLoadedRef = React.useRef(onConfigLoaded);
@@ -67,102 +76,136 @@ export const AppConfigProvider: React.FC<AppConfigProviderProps> = ({
   const maxRetries = retryOptions?.maxRetries ?? 0;
   const initialDelay = retryOptions?.initialDelay ?? 1000;
 
-  const fetchConfig = useCallback(async (force = false) => {
-    // Prevent duplicate fetches unless forced
-    if (!force && fetchCountRef.current > 0) {
-      console.debug('[AppConfig] Already fetched, skipping');
-      return;
-    }
-
-    // Mark that we've attempted a fetch to prevent repeated auto-fetch loops
-    fetchCountRef.current += 1;
-
-    const shouldBlockUI = !hasResolvedConfig || isBlockingMode;
-    if (shouldBlockUI) {
-      setLoading(true);
-    }
-    setError(null);
-
-    const startTime = performance.now();
-    for (let attempt = 0; attempt <= maxRetries; attempt++) {
-      try {
-        const testConfig = getSimulatedAppConfig();
-        if (testConfig) {
-          setConfig(testConfig);
-          setHasResolvedConfig(true);
-          setLoading(false);
-          return;
-        }
-
-        if (attempt > 0) {
-          const delay = initialDelay * Math.pow(2, attempt - 1);
-          console.log(`[AppConfig] Retry attempt ${attempt}/${maxRetries} after ${delay}ms delay...`);
-          await sleep(delay);
-        } else {
-          console.log('[AppConfig] Fetching app config...');
-        }
-
-        // apiClient automatically adds JWT header if available via interceptors
-        // Always suppress error toast - we handle 401 errors locally
-        console.debug('[AppConfig] Fetching app config', { attempt, force, path: window.location.pathname });
-        const response = await apiClient.get<AppConfig>(
-          '/api/v1/config/app-config',
-          {
-            suppressErrorToast: true,
-            skipAuthRedirect: true,
-          } as any,
-        );
-        const data = response.data;
-
-        console.debug('[AppConfig] Config fetched successfully:', data);
-        console.debug('[AppConfig] Fetch duration ms:', (performance.now() - startTime).toFixed(2));
-        setConfig(data);
-        setHasResolvedConfig(true);
-        setLoading(false);
-        onConfigLoadedRef.current?.(data);
-        return; // Success - exit function
-      } catch (err: any) {
-        const status = err?.response?.status;
-
-        // On 401 (not authenticated), use default config with login enabled
-        // This allows the app to work even without authentication
-        if (status === 401) {
-          console.debug('[AppConfig] 401 error - using default config (login enabled)');
-          console.debug('[AppConfig] Fetch duration ms:', (performance.now() - startTime).toFixed(2));
-          setConfig({ enableLogin: true });
-          setHasResolvedConfig(true);
-          setLoading(false);
-          return;
-        }
-
-        // Check if we should retry (network errors or 5xx errors)
-        const shouldRetry = (!status || status >= 500) && attempt < maxRetries;
-
-        if (shouldRetry) {
-          console.warn(`[AppConfig] Attempt ${attempt + 1} failed (status ${status || 'network error'}):`, err.message, '- will retry...');
-          continue;
-        }
-
-        // Final attempt failed or non-retryable error (4xx)
-        const errorMessage = err?.response?.data?.message || err?.message || 'Unknown error occurred';
-        setError(errorMessage);
-        console.error(`[AppConfig] Failed to fetch app config after ${attempt + 1} attempts:`, err);
-        console.debug('[AppConfig] Fetch duration ms:', (performance.now() - startTime).toFixed(2));
-        // Preserve existing config (initial default or previous fetch). If nothing is set, assume login enabled.
-        setConfig((current) => current ?? { enableLogin: true });
-        setHasResolvedConfig(true);
-        break;
+  const fetchConfig = useCallback(
+    async (force = false) => {
+      // Prevent duplicate fetches unless forced
+      if (!force && fetchCountRef.current > 0) {
+        console.debug("[AppConfig] Already fetched, skipping");
+        return;
       }
-    }
 
-    setLoading(false);
-  }, [hasResolvedConfig, isBlockingMode, maxRetries, initialDelay]);
+      // Mark that we've attempted a fetch to prevent repeated auto-fetch loops
+      fetchCountRef.current += 1;
+
+      const shouldBlockUI = !hasResolvedConfig || isBlockingMode;
+      if (shouldBlockUI) {
+        setLoading(true);
+      }
+      setError(null);
+
+      const startTime = performance.now();
+      for (let attempt = 0; attempt <= maxRetries; attempt++) {
+        try {
+          const testConfig = getSimulatedAppConfig();
+          if (testConfig) {
+            setConfig(testConfig);
+            setHasResolvedConfig(true);
+            setLoading(false);
+            return;
+          }
+
+          if (attempt > 0) {
+            const delay = initialDelay * Math.pow(2, attempt - 1);
+            console.log(
+              `[AppConfig] Retry attempt ${attempt}/${maxRetries} after ${delay}ms delay...`,
+            );
+            await sleep(delay);
+          } else {
+            console.log("[AppConfig] Fetching app config...");
+          }
+
+          // apiClient automatically adds JWT header if available via interceptors
+          // Always suppress error toast - we handle 401 errors locally
+          console.debug("[AppConfig] Fetching app config", {
+            attempt,
+            force,
+            path: window.location.pathname,
+          });
+          const response = await apiClient.get<AppConfig>(
+            "/api/v1/config/app-config",
+            {
+              suppressErrorToast: true,
+              skipAuthRedirect: true,
+            } as any,
+          );
+          const data = response.data;
+
+          console.debug("[AppConfig] Config fetched successfully:", data);
+          console.debug(
+            "[AppConfig] Fetch duration ms:",
+            (performance.now() - startTime).toFixed(2),
+          );
+          setConfig(data);
+          setHasResolvedConfig(true);
+          setLoading(false);
+          onConfigLoadedRef.current?.(data);
+          return; // Success - exit function
+        } catch (err: any) {
+          const status = err?.response?.status;
+
+          // On 401 (not authenticated), use default config with login enabled
+          // This allows the app to work even without authentication
+          if (status === 401) {
+            console.debug(
+              "[AppConfig] 401 error - using default config (login enabled)",
+            );
+            console.debug(
+              "[AppConfig] Fetch duration ms:",
+              (performance.now() - startTime).toFixed(2),
+            );
+            setConfig({ enableLogin: true });
+            setHasResolvedConfig(true);
+            setLoading(false);
+            return;
+          }
+
+          // Check if we should retry (network errors or 5xx errors)
+          const shouldRetry =
+            (!status || status >= 500) && attempt < maxRetries;
+
+          if (shouldRetry) {
+            console.warn(
+              `[AppConfig] Attempt ${attempt + 1} failed (status ${status || "network error"}):`,
+              err.message,
+              "- will retry...",
+            );
+            continue;
+          }
+
+          // Final attempt failed or non-retryable error (4xx)
+          const errorMessage =
+            err?.response?.data?.message ||
+            err?.message ||
+            "Unknown error occurred";
+          setError(errorMessage);
+          console.error(
+            `[AppConfig] Failed to fetch app config after ${attempt + 1} attempts:`,
+            err,
+          );
+          console.debug(
+            "[AppConfig] Fetch duration ms:",
+            (performance.now() - startTime).toFixed(2),
+          );
+          // Preserve existing config (initial default or previous fetch). If nothing is set, assume login enabled.
+          setConfig((current) => current ?? { enableLogin: true });
+          setHasResolvedConfig(true);
+          break;
+        }
+      }
+
+      setLoading(false);
+    },
+    [hasResolvedConfig, isBlockingMode, maxRetries, initialDelay],
+  );
 
   const { isAuthPage } = useJwtConfigSync(fetchConfig);
 
   useEffect(() => {
     if (isAuthPage) {
-      console.debug('[AppConfig] On auth page - using default config, skipping fetch', { path: window.location.pathname });
+      console.debug(
+        "[AppConfig] On auth page - using default config, skipping fetch",
+        { path: window.location.pathname },
+      );
       setConfig({ enableLogin: true });
       setHasResolvedConfig(true);
       setLoading(false);
@@ -198,7 +241,7 @@ export function useAppConfig(): AppConfigContextValue {
   const context = useContext(AppConfigContext);
 
   if (context === undefined) {
-    throw new Error('useAppConfig must be used within AppConfigProvider');
+    throw new Error("useAppConfig must be used within AppConfigProvider");
   }
 
   return context;
diff --git a/frontend/src/core/contexts/BannerContext.tsx b/frontend/src/core/contexts/BannerContext.tsx
index 810d50bd65..241387fc02 100644
--- a/frontend/src/core/contexts/BannerContext.tsx
+++ b/frontend/src/core/contexts/BannerContext.tsx
@@ -1,4 +1,4 @@
-import { createContext, useContext, useState, ReactNode } from 'react';
+import { createContext, useContext, useState, ReactNode } from "react";
 
 interface BannerContextType {
   banner: ReactNode;
@@ -20,7 +20,7 @@ export function BannerProvider({ children }: { children: ReactNode }) {
 export function useBanner() {
   const context = useContext(BannerContext);
   if (!context) {
-    throw new Error('useBanner must be used within BannerProvider');
+    throw new Error("useBanner must be used within BannerProvider");
   }
   return context;
 }
diff --git a/frontend/src/core/contexts/CommentAuthorContext.tsx b/frontend/src/core/contexts/CommentAuthorContext.tsx
index 67602c0a3b..1378d628f9 100644
--- a/frontend/src/core/contexts/CommentAuthorContext.tsx
+++ b/frontend/src/core/contexts/CommentAuthorContext.tsx
@@ -1,16 +1,16 @@
-import { createContext, useContext, type ReactNode } from 'react';
+import { createContext, useContext, type ReactNode } from "react";
 
 export interface CommentAuthorValue {
   displayName: string;
 }
 
-const defaultValue: CommentAuthorValue = { displayName: 'Guest' };
+const defaultValue: CommentAuthorValue = { displayName: "Guest" };
 
 const CommentAuthorContext = createContext<CommentAuthorValue>(defaultValue);
 
 export function CommentAuthorProvider({
   children,
-  displayName = 'Guest',
+  displayName = "Guest",
 }: {
   children: ReactNode;
   displayName?: string;
diff --git a/frontend/src/core/contexts/FileContext.tsx b/frontend/src/core/contexts/FileContext.tsx
index 2e2eb1aa44..c7f1fbee2b 100644
--- a/frontend/src/core/contexts/FileContext.tsx
+++ b/frontend/src/core/contexts/FileContext.tsx
@@ -12,7 +12,14 @@
  * Memory management handled by FileLifecycleManager (PDF.js cleanup, blob URL revocation).
  */
 
-import { useReducer, useCallback, useEffect, useRef, useMemo, useState } from 'react';
+import {
+  useReducer,
+  useCallback,
+  useEffect,
+  useRef,
+  useMemo,
+  useState,
+} from "react";
 import {
   FileContextProviderProps,
   FileContextSelectors,
@@ -23,36 +30,55 @@ import {
   StirlingFileStub,
   StirlingFile,
   createStirlingFile,
-} from '@app/types/fileContext';
+} from "@app/types/fileContext";
 
 // Import modular components
-import { fileContextReducer, initialFileContextState } from '@app/contexts/file/FileReducer';
-import { createFileSelectors } from '@app/contexts/file/fileSelectors';
-import { addFiles, addStirlingFileStubs, consumeFiles, undoConsumeFiles, createFileActions, createChildStub, generateProcessedFileMetadata } from '@app/contexts/file/fileActions';
-import { FileLifecycleManager } from '@app/contexts/file/lifecycle';
-import { FileStateContext, FileActionsContext } from '@app/contexts/file/contexts';
-import { IndexedDBProvider, useIndexedDB } from '@app/contexts/IndexedDBContext';
-import { useZipConfirmation } from '@app/hooks/useZipConfirmation';
-import ZipWarningModal from '@app/components/shared/ZipWarningModal';
-import EncryptedPdfUnlockModal from '@app/components/shared/EncryptedPdfUnlockModal';
-import { useTranslation } from 'react-i18next';
-import { alert } from '@app/components/toast';
-import { buildRemovePasswordFormData } from '@app/hooks/tools/removePassword/buildRemovePasswordFormData';
-import type { RemovePasswordParameters } from '@app/hooks/tools/removePassword/useRemovePasswordParameters';
-import apiClient from '@app/services/apiClient';
-import { processResponse } from '@app/utils/toolResponseProcessor';
-import { ToolOperation } from '@app/types/file';
-import { handlePasswordError } from '@app/utils/toolErrorHandler';
-
-const DEBUG = process.env.NODE_ENV === 'development';
+import {
+  fileContextReducer,
+  initialFileContextState,
+} from "@app/contexts/file/FileReducer";
+import { createFileSelectors } from "@app/contexts/file/fileSelectors";
+import {
+  addFiles,
+  addStirlingFileStubs,
+  consumeFiles,
+  undoConsumeFiles,
+  createFileActions,
+  createChildStub,
+  generateProcessedFileMetadata,
+} from "@app/contexts/file/fileActions";
+import { FileLifecycleManager } from "@app/contexts/file/lifecycle";
+import {
+  FileStateContext,
+  FileActionsContext,
+} from "@app/contexts/file/contexts";
+import {
+  IndexedDBProvider,
+  useIndexedDB,
+} from "@app/contexts/IndexedDBContext";
+import { useZipConfirmation } from "@app/hooks/useZipConfirmation";
+import ZipWarningModal from "@app/components/shared/ZipWarningModal";
+import EncryptedPdfUnlockModal from "@app/components/shared/EncryptedPdfUnlockModal";
+import { useTranslation } from "react-i18next";
+import { alert } from "@app/components/toast";
+import { buildRemovePasswordFormData } from "@app/hooks/tools/removePassword/buildRemovePasswordFormData";
+import type { RemovePasswordParameters } from "@app/hooks/tools/removePassword/useRemovePasswordParameters";
+import apiClient from "@app/services/apiClient";
+import { processResponse } from "@app/utils/toolResponseProcessor";
+import { ToolOperation } from "@app/types/file";
+import { handlePasswordError } from "@app/utils/toolErrorHandler";
 
+const DEBUG = process.env.NODE_ENV === "development";
 
 // Inner provider component that has access to IndexedDB
 function FileContextInner({
   children,
-  enablePersistence = true
+  enablePersistence = true,
 }: FileContextProviderProps) {
-  const [state, dispatch] = useReducer(fileContextReducer, initialFileContextState);
+  const [state, dispatch] = useReducer(
+    fileContextReducer,
+    initialFileContextState,
+  );
 
   // Always call the hook unconditionally to satisfy React's rules of hooks.
   // IndexedDB context is only used when enablePersistence is true.
@@ -67,7 +93,12 @@ function FileContextInner({
   stateRef.current = state;
 
   // ZIP confirmation dialog
-  const { confirmationState, requestConfirmation, handleConfirm, handleCancel } = useZipConfirmation();
+  const {
+    confirmationState,
+    requestConfirmation,
+    handleConfirm,
+    handleCancel,
+  } = useZipConfirmation();
 
   // Create lifecycle manager
   const lifecycleManagerRef = useRef<FileLifecycleManager | null>(null);
@@ -78,28 +109,32 @@ function FileContextInner({
   const { t } = useTranslation();
 
   const [encryptedQueue, setEncryptedQueue] = useState<FileId[]>([]);
-  const [activeEncryptedFileId, setActiveEncryptedFileId] = useState<FileId | null>(null);
-  const [unlockPassword, setUnlockPassword] = useState('');
+  const [activeEncryptedFileId, setActiveEncryptedFileId] =
+    useState<FileId | null>(null);
+  const [unlockPassword, setUnlockPassword] = useState("");
   const [unlockError, setUnlockError] = useState<string | null>(null);
   const [isUnlocking, setIsUnlocking] = useState(false);
   const dismissedEncryptedFilesRef = useRef<Set<FileId>>(new Set());
   const observedFileIdsRef = useRef<Set<FileId>>(new Set());
 
-  const enqueueEncryptedFiles = useCallback((fileIds: FileId[]) => {
-    if (fileIds.length === 0) return;
-    setEncryptedQueue(prevQueue => {
-      const existing = new Set(prevQueue);
-      const next = [...prevQueue];
-      for (const id of fileIds) {
-        if (dismissedEncryptedFilesRef.current.has(id)) continue;
-        if (id === activeEncryptedFileId) continue;
-        if (existing.has(id)) continue;
-        existing.add(id);
-        next.push(id);
-      }
-      return next;
-    });
-  }, [activeEncryptedFileId]);
+  const enqueueEncryptedFiles = useCallback(
+    (fileIds: FileId[]) => {
+      if (fileIds.length === 0) return;
+      setEncryptedQueue((prevQueue) => {
+        const existing = new Set(prevQueue);
+        const next = [...prevQueue];
+        for (const id of fileIds) {
+          if (dismissedEncryptedFilesRef.current.has(id)) continue;
+          if (id === activeEncryptedFileId) continue;
+          if (existing.has(id)) continue;
+          existing.add(id);
+          next.push(id);
+        }
+        return next;
+      });
+    },
+    [activeEncryptedFileId],
+  );
 
   useEffect(() => {
     const previousIds = observedFileIdsRef.current;
@@ -109,7 +144,10 @@ function FileContextInner({
     for (const id of state.files.ids) {
       if (!previousIds.has(id)) {
         const stub = state.files.byId[id];
-        if ((stub?.versionNumber ?? 1) <= 1 && stub?.processedFile?.isEncrypted) {
+        if (
+          (stub?.versionNumber ?? 1) <= 1 &&
+          stub?.processedFile?.isEncrypted
+        ) {
           newEncryptedIds.push(id);
         }
       }
@@ -125,18 +163,21 @@ function FileContextInner({
   useEffect(() => {
     if (!activeEncryptedFileId && encryptedQueue.length > 0) {
       setActiveEncryptedFileId(encryptedQueue[0]);
-      setEncryptedQueue(prev => prev.slice(1));
+      setEncryptedQueue((prev) => prev.slice(1));
     }
   }, [activeEncryptedFileId, encryptedQueue]);
 
   useEffect(() => {
-    if (activeEncryptedFileId && !state.files.ids.includes(activeEncryptedFileId)) {
+    if (
+      activeEncryptedFileId &&
+      !state.files.ids.includes(activeEncryptedFileId)
+    ) {
       setActiveEncryptedFileId(null);
     }
   }, [activeEncryptedFileId, state.files.ids]);
 
   useEffect(() => {
-    setUnlockPassword('');
+    setUnlockPassword("");
     setUnlockError(null);
   }, [activeEncryptedFileId]);
 
@@ -155,12 +196,14 @@ function FileContextInner({
 
     dismissedEncryptedFilesRef.current.delete(fileId);
 
-    setEncryptedQueue(prevQueue => prevQueue.filter(id => id !== fileId));
+    setEncryptedQueue((prevQueue) => prevQueue.filter((id) => id !== fileId));
 
-    setActiveEncryptedFileId(currentActiveId => {
+    setActiveEncryptedFileId((currentActiveId) => {
       if (currentActiveId && currentActiveId !== fileId) {
-        setEncryptedQueue(prevQueue => {
-          const withoutDuplicates = prevQueue.filter(id => id !== currentActiveId && id !== fileId);
+        setEncryptedQueue((prevQueue) => {
+          const withoutDuplicates = prevQueue.filter(
+            (id) => id !== currentActiveId && id !== fileId,
+          );
           return [currentActiveId, ...withoutDuplicates];
         });
       }
@@ -169,50 +212,63 @@ function FileContextInner({
   }, []);
 
   // Create stable selectors (memoized once to avoid re-renders)
-  const selectors = useMemo<FileContextSelectors>(() =>
-    createFileSelectors(stateRef, filesRef),
-    [] // Empty deps - selectors are stable
+  const selectors = useMemo<FileContextSelectors>(
+    () => createFileSelectors(stateRef, filesRef),
+    [], // Empty deps - selectors are stable
   );
 
   // Navigation management removed - moved to NavigationContext
 
   // Navigation guard system functions
   const setHasUnsavedChanges = useCallback((hasChanges: boolean) => {
-    dispatch({ type: 'SET_UNSAVED_CHANGES', payload: { hasChanges } });
+    dispatch({ type: "SET_UNSAVED_CHANGES", payload: { hasChanges } });
   }, []);
 
   const selectFiles = (stirlingFiles: StirlingFile[]) => {
     const currentSelection = stateRef.current.ui.selectedFileIds;
-    const newFileIds = stirlingFiles.map(stirlingFile => stirlingFile.fileId);
-    dispatch({ type: 'SET_SELECTED_FILES', payload: { fileIds: [...currentSelection, ...newFileIds] } });
+    const newFileIds = stirlingFiles.map((stirlingFile) => stirlingFile.fileId);
+    dispatch({
+      type: "SET_SELECTED_FILES",
+      payload: { fileIds: [...currentSelection, ...newFileIds] },
+    });
   };
 
   // File operations using unified addFiles helper with persistence
-  const addRawFiles = useCallback(async (files: File[], options?: { insertAfterPageId?: string; selectFiles?: boolean; skipAutoUnzip?: boolean }): Promise<StirlingFile[]> => {
-    const stirlingFiles = await addFiles(
-      {
-        files,
-        ...options,
-        // For direct file uploads: ALWAYS unzip (except HTML ZIPs)
-        // skipAutoUnzip bypasses preference checks - HTML detection still applies
-        skipAutoUnzip: true,
-        // Provide confirmation callback for large ZIP files
-        confirmLargeExtraction: requestConfirmation
+  const addRawFiles = useCallback(
+    async (
+      files: File[],
+      options?: {
+        insertAfterPageId?: string;
+        selectFiles?: boolean;
+        skipAutoUnzip?: boolean;
       },
-      stateRef,
-      filesRef,
-      dispatch,
-      lifecycleManager,
-      enablePersistence
-    );
+    ): Promise<StirlingFile[]> => {
+      const stirlingFiles = await addFiles(
+        {
+          files,
+          ...options,
+          // For direct file uploads: ALWAYS unzip (except HTML ZIPs)
+          // skipAutoUnzip bypasses preference checks - HTML detection still applies
+          skipAutoUnzip: true,
+          // Provide confirmation callback for large ZIP files
+          confirmLargeExtraction: requestConfirmation,
+        },
+        stateRef,
+        filesRef,
+        dispatch,
+        lifecycleManager,
+        enablePersistence,
+      );
 
-    // Auto-select the newly added files if requested
-    if (options?.selectFiles && stirlingFiles.length > 0) {
-      selectFiles(stirlingFiles);
-    }
+      // Auto-select the newly added files if requested
+      if (options?.selectFiles && stirlingFiles.length > 0) {
+        selectFiles(stirlingFiles);
+      }
 
-    return stirlingFiles;
-  }, [enablePersistence, requestConfirmation]);
+      return stirlingFiles;
+    },
+    [enablePersistence, requestConfirmation],
+  );
 
   const addFilesWithOptions = useCallback(
     async (
@@ -223,9 +279,12 @@ function FileContextInner({
         autoUnzip?: boolean;
         autoUnzipFileLimit?: number;
         skipAutoUnzip?: boolean;
-        confirmLargeExtraction?: (fileCount: number, fileName: string) => Promise<boolean>;
+        confirmLargeExtraction?: (
+          fileCount: number,
+          fileName: string,
+        ) => Promise<boolean>;
         allowDuplicates?: boolean;
-      }
+      },
     ): Promise<StirlingFile[]> => {
       const stirlingFiles = await addFiles(
         {
@@ -236,7 +295,7 @@ function FileContextInner({
         filesRef,
         dispatch,
         lifecycleManager,
-        enablePersistence
+        enablePersistence,
       );
 
       if (options?.selectFiles && stirlingFiles.length > 0) {
@@ -245,87 +304,147 @@ function FileContextInner({
 
       return stirlingFiles;
     },
-    [enablePersistence]
+    [enablePersistence],
   );
 
-  const addStirlingFileStubsAction = useCallback(async (stirlingFileStubs: StirlingFileStub[], options?: { insertAfterPageId?: string; selectFiles?: boolean }): Promise<StirlingFile[]> => {
-    // StirlingFileStubs preserve all metadata - perfect for FileManager use case!
-    const result = await addStirlingFileStubs(stirlingFileStubs, options, stateRef, filesRef, dispatch, lifecycleManager);
+  const addStirlingFileStubsAction = useCallback(
+    async (
+      stirlingFileStubs: StirlingFileStub[],
+      options?: { insertAfterPageId?: string; selectFiles?: boolean },
+    ): Promise<StirlingFile[]> => {
+      // StirlingFileStubs preserve all metadata - perfect for FileManager use case!
+      const result = await addStirlingFileStubs(
+        stirlingFileStubs,
+        options,
+        stateRef,
+        filesRef,
+        dispatch,
+        lifecycleManager,
+      );
 
-    // Auto-select the newly added files if requested
-    if (options?.selectFiles && result.length > 0) {
-      selectFiles(result);
-    }
-
-    return result;
-  }, []);
+      // Auto-select the newly added files if requested
+      if (options?.selectFiles && result.length > 0) {
+        selectFiles(result);
+      }
 
+      return result;
+    },
+    [],
+  );
 
   // Action creators
   const baseActions = useMemo(() => createFileActions(dispatch), []);
 
   // Helper functions for pinned files
-  const consumeFilesWrapper = useCallback(async (inputFileIds: FileId[], outputStirlingFiles: StirlingFile[], outputStirlingFileStubs: StirlingFileStub[]): Promise<FileId[]> => {
-    return consumeFiles(inputFileIds, outputStirlingFiles, outputStirlingFileStubs, filesRef, dispatch);
-  }, []);
+  const consumeFilesWrapper = useCallback(
+    async (
+      inputFileIds: FileId[],
+      outputStirlingFiles: StirlingFile[],
+      outputStirlingFileStubs: StirlingFileStub[],
+    ): Promise<FileId[]> => {
+      return consumeFiles(
+        inputFileIds,
+        outputStirlingFiles,
+        outputStirlingFileStubs,
+        filesRef,
+        dispatch,
+      );
+    },
+    [],
+  );
 
-  const runAutomaticPasswordRemoval = useCallback(async (fileId: FileId, password: string): Promise<void> => {
-    const file = filesRef.current.get(fileId);
-    const parentStub = stateRef.current.files.byId[fileId];
+  const runAutomaticPasswordRemoval = useCallback(
+    async (fileId: FileId, password: string): Promise<void> => {
+      const file = filesRef.current.get(fileId);
+      const parentStub = stateRef.current.files.byId[fileId];
 
-    if (!file || !parentStub) {
-      throw new Error(t('encryptedPdfUnlock.missingFile', 'The selected file is no longer available.'));
-    }
+      if (!file || !parentStub) {
+        throw new Error(
+          t(
+            "encryptedPdfUnlock.missingFile",
+            "The selected file is no longer available.",
+          ),
+        );
+      }
 
-    const params: RemovePasswordParameters = { password };
-    const formData = buildRemovePasswordFormData(params, file);
+      const params: RemovePasswordParameters = { password };
+      const formData = buildRemovePasswordFormData(params, file);
 
-    const response = await apiClient.post('/api/v1/security/remove-password', formData, {
-      responseType: 'blob',
-      suppressErrorToast: true  // Handle errors in modal UI instead of toast
-    });
-    const responseFiles = await processResponse(response.data, [file]);
+      const response = await apiClient.post(
+        "/api/v1/security/remove-password",
+        formData,
+        {
+          responseType: "blob",
+          suppressErrorToast: true, // Handle errors in modal UI instead of toast
+        },
+      );
+      const responseFiles = await processResponse(response.data, [file]);
 
-    const unlockedFile = responseFiles[0];
-    if (!unlockedFile) {
-      throw new Error(t('encryptedPdfUnlock.emptyResponse', 'Password removal did not produce a file.'));
-    }
+      const unlockedFile = responseFiles[0];
+      if (!unlockedFile) {
+        throw new Error(
+          t(
+            "encryptedPdfUnlock.emptyResponse",
+            "Password removal did not produce a file.",
+          ),
+        );
+      }
 
-    const processedMetadata = await generateProcessedFileMetadata(unlockedFile);
-    const thumbnail = processedMetadata?.thumbnailUrl;
+      const processedMetadata =
+        await generateProcessedFileMetadata(unlockedFile);
+      const thumbnail = processedMetadata?.thumbnailUrl;
 
-    const operation: ToolOperation = {
-      toolId: 'removePassword',
-      timestamp: Date.now()
-    };
+      const operation: ToolOperation = {
+        toolId: "removePassword",
+        timestamp: Date.now(),
+      };
 
-    const childStub = createChildStub(parentStub, operation, unlockedFile, thumbnail, processedMetadata);
-    const stirlingUnlockedFile = createStirlingFile(unlockedFile, childStub.id);
+      const childStub = createChildStub(
+        parentStub,
+        operation,
+        unlockedFile,
+        thumbnail,
+        processedMetadata,
+      );
+      const stirlingUnlockedFile = createStirlingFile(
+        unlockedFile,
+        childStub.id,
+      );
 
-    await consumeFilesWrapper([fileId], [stirlingUnlockedFile], [childStub]);
-  }, [consumeFilesWrapper, t]);
+      await consumeFilesWrapper([fileId], [stirlingUnlockedFile], [childStub]);
+    },
+    [consumeFilesWrapper, t],
+  );
 
   const handleUnlockSubmit = useCallback(async () => {
     if (!activeEncryptedFileId) return;
     if (!unlockPassword.trim()) {
-      setUnlockError(t('encryptedPdfUnlock.required', 'Enter the password to continue.'));
+      setUnlockError(
+        t("encryptedPdfUnlock.required", "Enter the password to continue."),
+      );
       return;
     }
 
     setIsUnlocking(true);
     setUnlockError(null);
     try {
-      await runAutomaticPasswordRemoval(activeEncryptedFileId, unlockPassword.trim());
+      await runAutomaticPasswordRemoval(
+        activeEncryptedFileId,
+        unlockPassword.trim(),
+      );
       const fileName = stateRef.current.files.byId[activeEncryptedFileId]?.name;
       alert({
-        alertType: 'success',
-        title: t('encryptedPdfUnlock.successTitle', 'Password removed'),
+        alertType: "success",
+        title: t("encryptedPdfUnlock.successTitle", "Password removed"),
         body: fileName
-          ? t('encryptedPdfUnlock.successBodyWithName', {
-              defaultValue: 'Removed password from {{fileName}}',
+          ? t("encryptedPdfUnlock.successBodyWithName", {
+              defaultValue: "Removed password from {{fileName}}",
               fileName,
             })
-          : t('encryptedPdfUnlock.successBody', 'Password removed successfully.'),
+          : t(
+              "encryptedPdfUnlock.successBody",
+              "Password removed successfully.",
+            ),
         expandable: false,
         isPersistentPopup: false,
       });
@@ -334,8 +453,11 @@ function FileContextInner({
     } catch (error) {
       const errorMessage = await handlePasswordError(
         error,
-        t('encryptedPdfUnlock.incorrectPassword', 'Incorrect password'),
-        t('removePassword.error.failed', 'An error occurred while removing the password from the PDF.')
+        t("encryptedPdfUnlock.incorrectPassword", "Incorrect password"),
+        t(
+          "removePassword.error.failed",
+          "An error occurred while removing the password from the PDF.",
+        ),
       );
       setUnlockError(errorMessage);
     } finally {
@@ -343,105 +465,209 @@ function FileContextInner({
     }
   }, [activeEncryptedFileId, unlockPassword, runAutomaticPasswordRemoval, t]);
 
-  const undoConsumeFilesWrapper = useCallback(async (inputFiles: File[], inputStirlingFileStubs: StirlingFileStub[], outputFileIds: FileId[]): Promise<void> => {
-    return undoConsumeFiles(inputFiles, inputStirlingFileStubs, outputFileIds, filesRef, dispatch, indexedDB);
-  }, [indexedDB]);
+  const handleUnlockAll = useCallback(async () => {
+    if (!activeEncryptedFileId) return;
+    const pw = unlockPassword.trim();
+    if (!pw) {
+      setUnlockError(
+        t("encryptedPdfUnlock.required", "Enter the password to continue."),
+      );
+      return;
+    }
 
-  // File pinning functions - use StirlingFile directly
-  const pinFileWrapper = useCallback((file: StirlingFile) => {
-    baseActions.pinFile(file.fileId);
-  }, [baseActions]);
+    setIsUnlocking(true);
+    setUnlockError(null);
 
-  const unpinFileWrapper = useCallback((file: StirlingFile) => {
-    baseActions.unpinFile(file.fileId);
-  }, [baseActions]);
+    const allIds = [activeEncryptedFileId, ...encryptedQueue];
+    let successCount = 0;
+    const failedNames: string[] = [];
 
-  // Complete actions object
-  const actions = useMemo<FileContextActions>(() => ({
-    ...baseActions,
-    addFiles: addRawFiles,
-    addFilesWithOptions,
-    addStirlingFileStubs: addStirlingFileStubsAction,
-    removeFiles: async (fileIds: FileId[], deleteFromStorage?: boolean) => {
-      // Remove from memory and cleanup resources
-      lifecycleManager.removeFiles(fileIds, stateRef);
-
-      // Remove from IndexedDB if enabled
-      if (indexedDB && enablePersistence && deleteFromStorage !== false) {
-        try {
-          await indexedDB.deleteMultiple(fileIds);
-        } catch (error) {
-          console.error('Failed to delete files from IndexedDB:', error);
-        }
+    for (const fileId of allIds) {
+      try {
+        await runAutomaticPasswordRemoval(fileId, pw);
+        dismissedEncryptedFilesRef.current.delete(fileId);
+        successCount++;
+      } catch {
+        const name = stateRef.current.files.byId[fileId]?.name ?? fileId;
+        failedNames.push(name);
       }
-    },
-    updateStirlingFileStub: (fileId: FileId, updates: Partial<StirlingFileStub>) =>
-      lifecycleManager.updateStirlingFileStub(fileId, updates, stateRef),
-    reorderFiles: (orderedFileIds: FileId[]) => {
-      dispatch({ type: 'REORDER_FILES', payload: { orderedFileIds } });
-    },
-    clearAllFiles: async () => {
-      lifecycleManager.cleanupAllFiles();
-      filesRef.current.clear();
-      dispatch({ type: 'RESET_CONTEXT' });
+    }
 
-      // Don't clear IndexedDB automatically - only clear in-memory state
-      // IndexedDB should only be cleared when explicitly requested by user
-    },
-    clearAllData: async () => {
-      // First clear all files from memory
-      lifecycleManager.cleanupAllFiles();
-      filesRef.current.clear();
-      dispatch({ type: 'RESET_CONTEXT' });
+    if (successCount > 0) {
+      alert({
+        alertType: "success",
+        title: t("encryptedPdfUnlock.successTitle", "Password removed"),
+        body: t("encryptedPdfUnlock.unlockAllSuccess", {
+          defaultValue: "Unlocked {{count}} file(s).",
+          count: successCount,
+        }),
+        expandable: false,
+        isPersistentPopup: false,
+      });
+    }
 
-      // Then clear IndexedDB storage
-      if (indexedDB && enablePersistence) {
-        try {
-          await indexedDB.clearAll();
-        } catch (error) {
-          console.error('Failed to clear IndexedDB:', error);
-        }
-      }
-    },
-    // Pinned files functionality with File object wrappers
-    pinFile: pinFileWrapper,
-    unpinFile: unpinFileWrapper,
-    consumeFiles: consumeFilesWrapper,
-    undoConsumeFiles: undoConsumeFilesWrapper,
-    setHasUnsavedChanges,
-    trackBlobUrl: lifecycleManager.trackBlobUrl,
-    cleanupFile: (fileId: FileId) => lifecycleManager.cleanupFile(fileId, stateRef),
-    scheduleCleanup: (fileId: FileId, delay?: number) =>
-      lifecycleManager.scheduleCleanup(fileId, delay, stateRef),
-    openEncryptedUnlockPrompt: promptEncryptedUnlock
-  }), [
-    baseActions,
-    addRawFiles,
-    addStirlingFileStubsAction,
-    lifecycleManager,
-    setHasUnsavedChanges,
-    consumeFilesWrapper,
-    undoConsumeFilesWrapper,
-    pinFileWrapper,
-    unpinFileWrapper,
-    indexedDB,
-    enablePersistence,
-    promptEncryptedUnlock
+    if (failedNames.length > 0) {
+      setUnlockError(
+        t("encryptedPdfUnlock.unlockAllPartialFail", {
+          defaultValue: "Wrong password for: {{names}}",
+          names: failedNames.join(", "),
+        }),
+      );
+      const failedIds = allIds.filter((id) => {
+        const name = stateRef.current.files.byId[id]?.name ?? id;
+        return failedNames.includes(name);
+      });
+      setEncryptedQueue(failedIds.slice(1));
+      setActiveEncryptedFileId(failedIds[0]);
+    } else {
+      setEncryptedQueue([]);
+      setActiveEncryptedFileId(null);
+    }
+
+    setIsUnlocking(false);
+  }, [
+    activeEncryptedFileId,
+    encryptedQueue,
+    unlockPassword,
+    runAutomaticPasswordRemoval,
+    t,
   ]);
 
+  const undoConsumeFilesWrapper = useCallback(
+    async (
+      inputFiles: File[],
+      inputStirlingFileStubs: StirlingFileStub[],
+      outputFileIds: FileId[],
+    ): Promise<void> => {
+      return undoConsumeFiles(
+        inputFiles,
+        inputStirlingFileStubs,
+        outputFileIds,
+        filesRef,
+        dispatch,
+        indexedDB,
+      );
+    },
+    [indexedDB],
+  );
+
+  // File pinning functions - use StirlingFile directly
+  const pinFileWrapper = useCallback(
+    (file: StirlingFile) => {
+      baseActions.pinFile(file.fileId);
+    },
+    [baseActions],
+  );
+
+  const unpinFileWrapper = useCallback(
+    (file: StirlingFile) => {
+      baseActions.unpinFile(file.fileId);
+    },
+    [baseActions],
+  );
+
+  // Complete actions object
+  const actions = useMemo<FileContextActions>(
+    () => ({
+      ...baseActions,
+      addFiles: addRawFiles,
+      addFilesWithOptions,
+      addStirlingFileStubs: addStirlingFileStubsAction,
+      removeFiles: async (fileIds: FileId[], deleteFromStorage?: boolean) => {
+        // Remove from memory and cleanup resources
+        lifecycleManager.removeFiles(fileIds, stateRef);
+
+        // Remove from IndexedDB if enabled
+        if (indexedDB && enablePersistence && deleteFromStorage !== false) {
+          try {
+            await indexedDB.deleteMultiple(fileIds);
+          } catch (error) {
+            console.error("Failed to delete files from IndexedDB:", error);
+          }
+        }
+      },
+      updateStirlingFileStub: (
+        fileId: FileId,
+        updates: Partial<StirlingFileStub>,
+      ) => lifecycleManager.updateStirlingFileStub(fileId, updates, stateRef),
+      reorderFiles: (orderedFileIds: FileId[]) => {
+        dispatch({ type: "REORDER_FILES", payload: { orderedFileIds } });
+      },
+      clearAllFiles: async () => {
+        lifecycleManager.cleanupAllFiles();
+        filesRef.current.clear();
+        dispatch({ type: "RESET_CONTEXT" });
+
+        // Don't clear IndexedDB automatically - only clear in-memory state
+        // IndexedDB should only be cleared when explicitly requested by user
+      },
+      clearAllData: async () => {
+        // First clear all files from memory
+        lifecycleManager.cleanupAllFiles();
+        filesRef.current.clear();
+        dispatch({ type: "RESET_CONTEXT" });
+
+        // Then clear IndexedDB storage
+        if (indexedDB && enablePersistence) {
+          try {
+            await indexedDB.clearAll();
+          } catch (error) {
+            console.error("Failed to clear IndexedDB:", error);
+          }
+        }
+      },
+      // Pinned files functionality with File object wrappers
+      pinFile: pinFileWrapper,
+      unpinFile: unpinFileWrapper,
+      consumeFiles: consumeFilesWrapper,
+      undoConsumeFiles: undoConsumeFilesWrapper,
+      setHasUnsavedChanges,
+      trackBlobUrl: lifecycleManager.trackBlobUrl,
+      cleanupFile: (fileId: FileId) =>
+        lifecycleManager.cleanupFile(fileId, stateRef),
+      scheduleCleanup: (fileId: FileId, delay?: number) =>
+        lifecycleManager.scheduleCleanup(fileId, delay, stateRef),
+      openEncryptedUnlockPrompt: promptEncryptedUnlock,
+    }),
+    [
+      baseActions,
+      addRawFiles,
+      addStirlingFileStubsAction,
+      lifecycleManager,
+      setHasUnsavedChanges,
+      consumeFilesWrapper,
+      undoConsumeFilesWrapper,
+      pinFileWrapper,
+      unpinFileWrapper,
+      indexedDB,
+      enablePersistence,
+      promptEncryptedUnlock,
+    ],
+  );
+
   // Split context values to minimize re-renders
-  const stateValue = useMemo<FileContextStateValue>(() => ({
-    state,
-    selectors
-  }), [state, selectors]);
+  const stateValue = useMemo<FileContextStateValue>(
+    () => ({
+      state,
+      selectors,
+    }),
+    [state, selectors],
+  );
 
-  const actionsValue = useMemo<FileContextActionsValue>(() => ({
-    actions,
-    dispatch
-  }), [actions]);
+  const actionsValue = useMemo<FileContextActionsValue>(
+    () => ({
+      actions,
+      dispatch,
+    }),
+    [actions],
+  );
 
-  const activeEncryptedStub = activeEncryptedFileId ? state.files.byId[activeEncryptedFileId] : undefined;
-  const isUnlockModalOpen = Boolean(activeEncryptedFileId && activeEncryptedStub);
+  const activeEncryptedStub = activeEncryptedFileId
+    ? state.files.byId[activeEncryptedFileId]
+    : undefined;
+  const isUnlockModalOpen = Boolean(
+    activeEncryptedFileId && activeEncryptedStub,
+  );
 
   // Persistence loading disabled - files only loaded on explicit user action
   // useEffect(() => {
@@ -453,7 +679,8 @@ function FileContextInner({
   // Cleanup on unmount
   useEffect(() => {
     return () => {
-      if (DEBUG) console.log('FileContext unmounting - cleaning up all resources');
+      if (DEBUG)
+        console.log("FileContext unmounting - cleaning up all resources");
       lifecycleManager.destroy();
     };
   }, [lifecycleManager]);
@@ -475,8 +702,10 @@ function FileContextInner({
           password={unlockPassword}
           errorMessage={unlockError}
           isProcessing={isUnlocking}
+          remainingCount={encryptedQueue.length}
           onPasswordChange={setUnlockPassword}
           onUnlock={handleUnlockSubmit}
+          onUnlockAll={handleUnlockAll}
           onSkip={handleUnlockSkip}
         />
       </FileActionsContext.Provider>
@@ -488,7 +717,7 @@ function FileContextInner({
 export function FileContextProvider({
   children,
   enableUrlSync = true,
-  enablePersistence = true
+  enablePersistence = true,
 }: FileContextProviderProps) {
   if (enablePersistence) {
     return (
@@ -525,5 +754,5 @@ export {
   useAllFiles,
   useSelectedFiles,
   // Primary API hooks for tools
-  useFileContext
-} from '@app/contexts/file/fileHooks';
+  useFileContext,
+} from "@app/contexts/file/fileHooks";
diff --git a/frontend/src/core/contexts/FileManagerContext.tsx b/frontend/src/core/contexts/FileManagerContext.tsx
index 3ca5307314..07bcd0924b 100644
--- a/frontend/src/core/contexts/FileManagerContext.tsx
+++ b/frontend/src/core/contexts/FileManagerContext.tsx
@@ -1,28 +1,36 @@
-import React, { createContext, useContext, useState, useRef, useCallback, useEffect, useMemo } from 'react';
-import { Button, Group, Modal, Stack, Text } from '@mantine/core';
-import { fileStorage } from '@app/services/fileStorage';
-import { useFileActions } from '@app/contexts/FileContext';
-import { zipFileService } from '@app/services/zipFileService';
-import { StirlingFileStub } from '@app/types/fileContext';
-import { downloadFiles } from '@app/utils/downloadUtils';
-import { FileId } from '@app/types/file';
-import { groupFilesByOriginal } from '@app/utils/fileHistoryUtils';
-import { Z_INDEX_OVER_FILE_MANAGER_MODAL } from '@app/styles/zIndex';
-import apiClient from '@app/services/apiClient';
-import { alert } from '@app/components/toast';
+import React, {
+  createContext,
+  useContext,
+  useState,
+  useRef,
+  useCallback,
+  useEffect,
+  useMemo,
+} from "react";
+import { Button, Group, Modal, Stack, Text } from "@mantine/core";
+import { fileStorage } from "@app/services/fileStorage";
+import { useFileActions } from "@app/contexts/FileContext";
+import { zipFileService } from "@app/services/zipFileService";
+import { StirlingFileStub } from "@app/types/fileContext";
+import { downloadFiles } from "@app/utils/downloadUtils";
+import { FileId } from "@app/types/file";
+import { groupFilesByOriginal } from "@app/utils/fileHistoryUtils";
+import { Z_INDEX_OVER_FILE_MANAGER_MODAL } from "@app/styles/zIndex";
+import apiClient from "@app/services/apiClient";
+import { alert } from "@app/components/toast";
 import {
   extractLatestFilesFromBundle,
   parseContentDispositionFilename,
-} from '@app/services/shareBundleUtils';
-import { useTranslation } from 'react-i18next';
-import { openFilesFromDisk } from '@app/services/openFilesFromDisk';
-export { pendingFilePathMappings } from '@app/services/pendingFilePathMappings';
+} from "@app/services/shareBundleUtils";
+import { useTranslation } from "react-i18next";
+import { openFilesFromDisk } from "@app/services/openFilesFromDisk";
+export { pendingFilePathMappings } from "@app/services/pendingFilePathMappings";
 
 // Type for the context value - now contains everything directly
 interface FileManagerContextValue {
   // State
-  activeSource: 'recent' | 'local' | 'drive';
-  storageFilter: 'all' | 'local' | 'sharedWithMe' | 'sharedByMe';
+  activeSource: "recent" | "local" | "drive";
+  storageFilter: "all" | "local" | "sharedWithMe" | "sharedByMe";
   selectedFileIds: FileId[];
   searchTerm: string;
   selectedFiles: StirlingFileStub[];
@@ -36,10 +44,16 @@ interface FileManagerContextValue {
   activeFileIds: FileId[];
 
   // Handlers
-  onSourceChange: (source: 'recent' | 'local' | 'drive') => void;
-  onStorageFilterChange: (filter: 'all' | 'local' | 'sharedWithMe' | 'sharedByMe') => void;
+  onSourceChange: (source: "recent" | "local" | "drive") => void;
+  onStorageFilterChange: (
+    filter: "all" | "local" | "sharedWithMe" | "sharedByMe",
+  ) => void;
   onLocalFileClick: () => void;
-  onFileSelect: (file: StirlingFileStub, index: number, shiftKey?: boolean) => void;
+  onFileSelect: (
+    file: StirlingFileStub,
+    index: number,
+    shiftKey?: boolean,
+  ) => void;
   onFileRemove: (index: number) => void;
   onHistoryFileRemove: (file: StirlingFileStub) => void;
   onFileDoubleClick: (file: StirlingFileStub) => void;
@@ -83,7 +97,7 @@ interface FileManagerProviderProps {
   activeFileIds: FileId[];
 }
 
-type RemoteDeleteChoice = 'local' | 'server' | 'both' | 'leave' | 'cancel';
+type RemoteDeleteChoice = "local" | "server" | "both" | "leave" | "cancel";
 
 export const FileManagerProvider: React.FC<FileManagerProviderProps> = ({
   children,
@@ -99,25 +113,33 @@ export const FileManagerProvider: React.FC<FileManagerProviderProps> = ({
   isLoading,
   activeFileIds,
 }) => {
-  const [activeSource, setActiveSource] = useState<'recent' | 'local' | 'drive'>('recent');
+  const [activeSource, setActiveSource] = useState<
+    "recent" | "local" | "drive"
+  >("recent");
   const [storageFilter, setStorageFilter] = useState<
-    'all' | 'local' | 'sharedWithMe' | 'sharedByMe'
-  >('all');
+    "all" | "local" | "sharedWithMe" | "sharedByMe"
+  >("all");
   const [selectedFileIds, setSelectedFileIds] = useState<FileId[]>([]);
-  const [searchTerm, setSearchTerm] = useState('');
+  const [searchTerm, setSearchTerm] = useState("");
   const [lastClickedIndex, setLastClickedIndex] = useState<number | null>(null);
-  const [expandedFileIds, setExpandedFileIds] = useState<Set<FileId>>(new Set());
-  const [loadedHistoryFiles, setLoadedHistoryFiles] = useState<Map<FileId, StirlingFileStub[]>>(new Map()); // Cache for loaded history
+  const [expandedFileIds, setExpandedFileIds] = useState<Set<FileId>>(
+    new Set(),
+  );
+  const [loadedHistoryFiles, setLoadedHistoryFiles] = useState<
+    Map<FileId, StirlingFileStub[]>
+  >(new Map()); // Cache for loaded history
   const fileInputRef = useRef<HTMLInputElement>(null);
-  const [deletePromptFile, setDeletePromptFile] = useState<StirlingFileStub | null>(null);
-  const deletePromptResolveRef = useRef<((choice: RemoteDeleteChoice) => void) | null>(null);
+  const [deletePromptFile, setDeletePromptFile] =
+    useState<StirlingFileStub | null>(null);
+  const deletePromptResolveRef = useRef<
+    ((choice: RemoteDeleteChoice) => void) | null
+  >(null);
   const { t } = useTranslation();
   const { actions } = useFileActions();
 
   // Track blob URLs for cleanup
   const createdBlobUrls = useRef<Set<string>>(new Set());
 
-
   // Computed values (with null safety)
   const selectedFilesSet = new Set(selectedFileIds);
 
@@ -126,10 +148,10 @@ export const FileManagerProvider: React.FC<FileManagerProviderProps> = ({
     if (!recentFiles || recentFiles.length === 0) return new Map();
 
     // Convert StirlingFileStub to FileRecord-like objects for grouping utility
-    const recordsForGrouping = recentFiles.map(file => ({
+    const recordsForGrouping = recentFiles.map((file) => ({
       ...file,
       originalFileId: file.originalFileId,
-      versionNumber: file.versionNumber || 1
+      versionNumber: file.versionNumber || 1,
     }));
 
     return groupFilesByOriginal(recordsForGrouping);
@@ -140,55 +162,67 @@ export const FileManagerProvider: React.FC<FileManagerProviderProps> = ({
     if (!recentFiles || recentFiles.length === 0) return [];
 
     // Only return leaf files - history files will be handled by separate components
-    if (storageFilter === 'sharedWithMe') {
+    if (storageFilter === "sharedWithMe") {
       return recentFiles.filter(
-        (file) => file.remoteOwnedByCurrentUser === false || file.remoteSharedViaLink
+        (file) =>
+          file.remoteOwnedByCurrentUser === false || file.remoteSharedViaLink,
       );
     }
-    if (storageFilter === 'sharedByMe') {
+    if (storageFilter === "sharedByMe") {
       return recentFiles.filter(
-        (file) => file.remoteOwnedByCurrentUser !== false && file.remoteHasShareLinks
+        (file) =>
+          file.remoteOwnedByCurrentUser !== false && file.remoteHasShareLinks,
       );
     }
-    if (storageFilter === 'local') {
+    if (storageFilter === "local") {
       return recentFiles.filter(
-        (file) => !file.remoteStorageId && !file.remoteSharedViaLink
+        (file) => !file.remoteStorageId && !file.remoteSharedViaLink,
       );
     }
     return recentFiles;
   }, [recentFiles, storageFilter]);
 
-  const selectedFiles = selectedFileIds.length === 0 ? [] :
-    displayFiles.filter(file => selectedFilesSet.has(file.id));
+  const selectedFiles =
+    selectedFileIds.length === 0
+      ? []
+      : displayFiles.filter((file) => selectedFilesSet.has(file.id));
 
+  const filteredFiles = !searchTerm
+    ? displayFiles
+    : displayFiles.filter((file) =>
+        file.name.toLowerCase().includes(searchTerm.toLowerCase()),
+      );
 
-  const filteredFiles = !searchTerm ? displayFiles :
-    displayFiles.filter(file =>
-      file.name.toLowerCase().includes(searchTerm.toLowerCase())
-    );
+  const handleSourceChange = useCallback(
+    (source: "recent" | "local" | "drive") => {
+      setActiveSource(source);
+      if (source !== "recent") {
+        setSelectedFileIds([]);
+        setSearchTerm("");
+        setLastClickedIndex(null);
+      }
+    },
+    [],
+  );
 
-  const handleSourceChange = useCallback((source: 'recent' | 'local' | 'drive') => {
-    setActiveSource(source);
-    if (source !== 'recent') {
+  const handleStorageFilterChange = useCallback(
+    (filter: "all" | "local" | "sharedWithMe" | "sharedByMe") => {
+      setStorageFilter(filter);
       setSelectedFileIds([]);
-      setSearchTerm('');
       setLastClickedIndex(null);
-    }
-  }, []);
+    },
+    [],
+  );
 
-  const handleStorageFilterChange = useCallback((filter: 'all' | 'local' | 'sharedWithMe' | 'sharedByMe') => {
-    setStorageFilter(filter);
-    setSelectedFileIds([]);
-    setLastClickedIndex(null);
-  }, []);
-
-
-  const requestDeleteChoice = useCallback((file: StirlingFileStub): Promise<RemoteDeleteChoice> => {
-    return new Promise((resolve) => {
-      deletePromptResolveRef.current = resolve;
-      setDeletePromptFile(file);
-    });
-  }, []);
+  const requestDeleteChoice = useCallback(
+    (file: StirlingFileStub): Promise<RemoteDeleteChoice> => {
+      return new Promise((resolve) => {
+        deletePromptResolveRef.current = resolve;
+        setDeletePromptFile(file);
+      });
+    },
+    [],
+  );
 
   const resolveDeleteChoice = useCallback((choice: RemoteDeleteChoice) => {
     const resolver = deletePromptResolveRef.current;
@@ -198,16 +232,19 @@ export const FileManagerProvider: React.FC<FileManagerProviderProps> = ({
   }, []);
 
   const handleLocalFileClick = useCallback(async () => {
-    console.log('[FileManager] Opening file dialog...');
+    console.log("[FileManager] Opening file dialog...");
 
     // Try native dialog first (desktop), falls back to empty array (web)
     const files = await openFilesFromDisk({
       multiple: true,
-      onFallbackOpen: () => fileInputRef.current?.click()
+      onFallbackOpen: () => fileInputRef.current?.click(),
     });
 
     if (files.length > 0) {
-      console.log('[FileManager] Passing files to FileContext:', files.map(f => f.name));
+      console.log(
+        "[FileManager] Passing files to FileContext:",
+        files.map((f) => f.name),
+      );
       onNewFilesSelect(files);
 
       await refreshRecentFiles();
@@ -215,347 +252,398 @@ export const FileManagerProvider: React.FC<FileManagerProviderProps> = ({
     }
   }, [onNewFilesSelect, refreshRecentFiles, onClose]);
 
-  const handleFileSelect = useCallback((file: StirlingFileStub, currentIndex: number, shiftKey?: boolean) => {
-    const fileId = file.id;
-    if (!fileId) return;
+  const handleFileSelect = useCallback(
+    (file: StirlingFileStub, currentIndex: number, shiftKey?: boolean) => {
+      const fileId = file.id;
+      if (!fileId) return;
 
-    if (shiftKey && lastClickedIndex !== null) {
-      // Range selection with shift-click
-      const startIndex = Math.min(lastClickedIndex, currentIndex);
-      const endIndex = Math.max(lastClickedIndex, currentIndex);
+      if (shiftKey && lastClickedIndex !== null) {
+        // Range selection with shift-click
+        const startIndex = Math.min(lastClickedIndex, currentIndex);
+        const endIndex = Math.max(lastClickedIndex, currentIndex);
 
-      setSelectedFileIds(prev => {
-        const selectedSet = new Set(prev);
+        setSelectedFileIds((prev) => {
+          const selectedSet = new Set(prev);
 
-        // Add all files in the range to selection
-        for (let i = startIndex; i <= endIndex; i++) {
-          const rangeFileId = filteredFiles[i]?.id;
-          if (rangeFileId) {
-            selectedSet.add(rangeFileId);
+          // Add all files in the range to selection
+          for (let i = startIndex; i <= endIndex; i++) {
+            const rangeFileId = filteredFiles[i]?.id;
+            if (rangeFileId) {
+              selectedSet.add(rangeFileId);
+            }
+          }
+
+          return Array.from(selectedSet);
+        });
+      } else {
+        // Normal click behavior - optimized with Set for O(1) lookup
+        setSelectedFileIds((prev) => {
+          const selectedSet = new Set(prev);
+
+          if (selectedSet.has(fileId)) {
+            selectedSet.delete(fileId);
+          } else {
+            selectedSet.add(fileId);
+          }
+
+          return Array.from(selectedSet);
+        });
+
+        // Update last clicked index for future range selections
+        setLastClickedIndex(currentIndex);
+      }
+    },
+    [filteredFiles, lastClickedIndex],
+  );
+
+  // Helper function to safely determine which files can be deleted
+  const getSafeFilesToDelete = useCallback(
+    (fileIds: FileId[], allStoredStubs: StirlingFileStub[]): FileId[] => {
+      const fileMap = new Map(allStoredStubs.map((f) => [f.id, f]));
+      const filesToDelete = new Set<FileId>();
+      const filesToPreserve = new Set<FileId>();
+
+      // First, identify all files in the lineages of the leaf files being deleted
+      for (const leafFileId of fileIds) {
+        const currentFile = fileMap.get(leafFileId);
+        if (!currentFile) continue;
+
+        // Always include the leaf file itself for deletion
+        filesToDelete.add(leafFileId);
+
+        // If this is a processed file with history, trace back through its lineage
+        if (currentFile.versionNumber && currentFile.versionNumber > 1) {
+          const originalFileId = currentFile.originalFileId || currentFile.id;
+
+          // Find all files in this history chain
+          const chainFiles = allStoredStubs.filter(
+            (file: StirlingFileStub) =>
+              (file.originalFileId || file.id) === originalFileId,
+          );
+
+          // Add all files in this lineage as candidates for deletion
+          chainFiles.forEach((file) => filesToDelete.add(file.id));
+        }
+      }
+
+      // Now identify files that must be preserved because they're referenced by OTHER lineages
+      for (const file of allStoredStubs) {
+        const fileOriginalId = file.originalFileId || file.id;
+
+        // If this file is a leaf node (not being deleted) and its lineage overlaps with files we want to delete
+        if (file.isLeaf !== false && !fileIds.includes(file.id)) {
+          // Find all files in this preserved lineage
+          const preservedChainFiles = allStoredStubs.filter(
+            (chainFile: StirlingFileStub) =>
+              (chainFile.originalFileId || chainFile.id) === fileOriginalId,
+          );
+
+          // Mark all files in this preserved lineage as must-preserve
+          preservedChainFiles.forEach((chainFile) =>
+            filesToPreserve.add(chainFile.id),
+          );
+        }
+      }
+
+      // Final list: files to delete minus files that must be preserved
+      let safeToDelete = Array.from(filesToDelete).filter(
+        (fileId) => !filesToPreserve.has(fileId),
+      );
+
+      // Check for orphaned non-leaf files after main deletion
+      const remainingFiles = allStoredStubs.filter(
+        (file) => !safeToDelete.includes(file.id),
+      );
+      const orphanedNonLeafFiles: FileId[] = [];
+
+      for (const file of remainingFiles) {
+        // Only check non-leaf files (files that have been processed and have children)
+        if (file.isLeaf === false) {
+          const fileOriginalId = file.originalFileId || file.id;
+
+          // Check if this non-leaf file has any living descendants
+          const hasLivingDescendants = remainingFiles.some((otherFile) => {
+            // Check if otherFile is a descendant of this file
+            const otherOriginalId = otherFile.originalFileId || otherFile.id;
+            return (
+              // Direct parent relationship
+              otherFile.parentFileId === file.id ||
+              // Same lineage but different from this file
+              (otherOriginalId === fileOriginalId && otherFile.id !== file.id)
+            );
+          });
+
+          if (!hasLivingDescendants) {
+            orphanedNonLeafFiles.push(file.id);
+          }
+        }
+      }
+
+      // Add orphaned non-leaf files to deletion list
+      safeToDelete = [...safeToDelete, ...orphanedNonLeafFiles];
+
+      return safeToDelete;
+    },
+    [],
+  );
+
+  // Shared internal delete logic
+  const performFileDelete = useCallback(
+    async (fileToRemove: StirlingFileStub, fileIndex: number) => {
+      let deleteChoice: RemoteDeleteChoice = "local";
+      if (fileToRemove.remoteStorageId) {
+        deleteChoice = await requestDeleteChoice(fileToRemove);
+        if (deleteChoice === "cancel") {
+          return;
+        }
+      }
+
+      const canDeleteServer = fileToRemove.remoteOwnedByCurrentUser !== false;
+      const shouldDeleteServer =
+        canDeleteServer &&
+        (deleteChoice === "server" || deleteChoice === "both");
+      const shouldDeleteLocal =
+        deleteChoice === "local" || deleteChoice === "both";
+      const isServerOnly =
+        Boolean(fileToRemove.remoteStorageId) &&
+        fileToRemove.id.startsWith("server-");
+      const canLeaveShare =
+        fileToRemove.remoteOwnedByCurrentUser === false &&
+        !fileToRemove.remoteSharedViaLink &&
+        Boolean(fileToRemove.remoteStorageId);
+
+      if (
+        deleteChoice === "leave" &&
+        canLeaveShare &&
+        fileToRemove.remoteStorageId
+      ) {
+        try {
+          await apiClient.delete(
+            `/api/v1/storage/files/${fileToRemove.remoteStorageId}/shares/self`,
+            {
+              suppressErrorToast: true,
+            } as any,
+          );
+          await refreshRecentFiles();
+          alert({
+            alertType: "success",
+            title: t(
+              "fileManager.leaveShareSuccess",
+              "Removed from your shared list.",
+            ),
+            expandable: false,
+            durationMs: 2500,
+          });
+          return;
+        } catch (error) {
+          console.error("Failed to leave shared file:", error);
+          alert({
+            alertType: "error",
+            title: t(
+              "fileManager.leaveShareFailed",
+              "Could not remove the shared file.",
+            ),
+            expandable: false,
+            durationMs: 3500,
+          });
+          return;
+        }
+      }
+
+      if (shouldDeleteServer && fileToRemove.remoteStorageId) {
+        try {
+          await apiClient.delete(
+            `/api/v1/storage/files/${fileToRemove.remoteStorageId}`,
+            { suppressErrorToast: true } as any,
+          );
+        } catch (error) {
+          console.error("Failed to delete file from server:", error);
+          alert({
+            alertType: "error",
+            title: t(
+              "fileManager.removeServerFailed",
+              "Could not remove the file from the server.",
+            ),
+            expandable: false,
+            durationMs: 3500,
+          });
+          return;
+        }
+
+        if (!shouldDeleteLocal) {
+          const originalFileId = (fileToRemove.originalFileId ||
+            fileToRemove.id) as FileId;
+          const chain = await fileStorage.getHistoryChainStubs(originalFileId);
+          for (const stub of chain) {
+            await fileStorage.updateFileMetadata(stub.id, {
+              remoteStorageId: undefined,
+              remoteStorageUpdatedAt: undefined,
+            });
+          }
+          await refreshRecentFiles();
+          alert({
+            alertType: "success",
+            title: t("fileManager.removeServerSuccess", "Removed from server."),
+            expandable: false,
+            durationMs: 2500,
+          });
+          return;
+        }
+      }
+
+      if (shouldDeleteLocal && isServerOnly) {
+        await refreshRecentFiles();
+        return;
+      }
+
+      const deletedFileId = fileToRemove.id;
+
+      // Get all stored files to analyze lineages
+      const allStoredStubs = await fileStorage.getAllStirlingFileStubs();
+
+      // Get safe files to delete (respecting shared lineages)
+      const filesToDelete = getSafeFilesToDelete(
+        [deletedFileId],
+        allStoredStubs,
+      );
+
+      // Clear from selection immediately
+      setSelectedFileIds((prev) =>
+        prev.filter((id) => !filesToDelete.includes(id)),
+      );
+
+      // Clear from expanded state to prevent ghost entries
+      setExpandedFileIds((prev) => {
+        const newExpanded = new Set(prev);
+        filesToDelete.forEach((id) => newExpanded.delete(id));
+        return newExpanded;
+      });
+
+      // Clear from history cache - remove all files in the chain
+      setLoadedHistoryFiles((prev) => {
+        const newCache = new Map(prev);
+
+        // Remove cache entries for all deleted files
+        filesToDelete.forEach((id) => newCache.delete(id as FileId));
+
+        // Also remove deleted files from any other file's history cache
+        for (const [mainFileId, historyFiles] of newCache.entries()) {
+          const filteredHistory = historyFiles.filter(
+            (histFile) => !filesToDelete.includes(histFile.id),
+          );
+          if (filteredHistory.length !== historyFiles.length) {
+            newCache.set(mainFileId, filteredHistory);
           }
         }
 
-        return Array.from(selectedSet);
-      });
-    } else {
-      // Normal click behavior - optimized with Set for O(1) lookup
-      setSelectedFileIds(prev => {
-        const selectedSet = new Set(prev);
-
-        if (selectedSet.has(fileId)) {
-          selectedSet.delete(fileId);
-        } else {
-          selectedSet.add(fileId);
-        }
-
-        return Array.from(selectedSet);
+        return newCache;
       });
 
-      // Update last clicked index for future range selections
-      setLastClickedIndex(currentIndex);
-    }
-  }, [filteredFiles, lastClickedIndex]);
-
-  // Helper function to safely determine which files can be deleted
-  const getSafeFilesToDelete = useCallback((
-    fileIds: FileId[],
-    allStoredStubs: StirlingFileStub[]
-  ): FileId[] => {
-    const fileMap = new Map(allStoredStubs.map(f => [f.id, f]));
-    const filesToDelete = new Set<FileId>();
-    const filesToPreserve = new Set<FileId>();
-
-    // First, identify all files in the lineages of the leaf files being deleted
-    for (const leafFileId of fileIds) {
-      const currentFile = fileMap.get(leafFileId);
-      if (!currentFile) continue;
-
-      // Always include the leaf file itself for deletion
-      filesToDelete.add(leafFileId);
-
-      // If this is a processed file with history, trace back through its lineage
-      if (currentFile.versionNumber && currentFile.versionNumber > 1) {
-        const originalFileId = currentFile.originalFileId || currentFile.id;
-
-        // Find all files in this history chain
-        const chainFiles = allStoredStubs.filter((file: StirlingFileStub) =>
-          (file.originalFileId || file.id) === originalFileId
-        );
-
-        // Add all files in this lineage as candidates for deletion
-        chainFiles.forEach(file => filesToDelete.add(file.id));
-      }
-    }
-
-    // Now identify files that must be preserved because they're referenced by OTHER lineages
-    for (const file of allStoredStubs) {
-      const fileOriginalId = file.originalFileId || file.id;
-
-      // If this file is a leaf node (not being deleted) and its lineage overlaps with files we want to delete
-      if (file.isLeaf !== false && !fileIds.includes(file.id)) {
-        // Find all files in this preserved lineage
-        const preservedChainFiles = allStoredStubs.filter((chainFile: StirlingFileStub) =>
-          (chainFile.originalFileId || chainFile.id) === fileOriginalId
-        );
-
-        // Mark all files in this preserved lineage as must-preserve
-        preservedChainFiles.forEach(chainFile => filesToPreserve.add(chainFile.id));
-      }
-    }
-
-    // Final list: files to delete minus files that must be preserved
-    let safeToDelete = Array.from(filesToDelete).filter(fileId => !filesToPreserve.has(fileId));
-
-    // Check for orphaned non-leaf files after main deletion
-    const remainingFiles = allStoredStubs.filter(file => !safeToDelete.includes(file.id));
-    const orphanedNonLeafFiles: FileId[] = [];
-
-    for (const file of remainingFiles) {
-      // Only check non-leaf files (files that have been processed and have children)
-      if (file.isLeaf === false) {
-        const fileOriginalId = file.originalFileId || file.id;
-
-        // Check if this non-leaf file has any living descendants
-        const hasLivingDescendants = remainingFiles.some(otherFile => {
-          // Check if otherFile is a descendant of this file
-          const otherOriginalId = otherFile.originalFileId || otherFile.id;
-          return (
-            // Direct parent relationship
-            otherFile.parentFileId === file.id ||
-            // Same lineage but different from this file
-            (otherOriginalId === fileOriginalId && otherFile.id !== file.id)
-          );
-        });
-
-        if (!hasLivingDescendants) {
-          orphanedNonLeafFiles.push(file.id);
-        }
-      }
-    }
-
-    // Add orphaned non-leaf files to deletion list
-    safeToDelete = [...safeToDelete, ...orphanedNonLeafFiles];
-
-    return safeToDelete;
-  }, []);
-
-  // Shared internal delete logic
-  const performFileDelete = useCallback(async (fileToRemove: StirlingFileStub, fileIndex: number) => {
-    let deleteChoice: RemoteDeleteChoice = 'local';
-    if (fileToRemove.remoteStorageId) {
-      deleteChoice = await requestDeleteChoice(fileToRemove);
-      if (deleteChoice === 'cancel') {
-        return;
-      }
-    }
-
-    const canDeleteServer = fileToRemove.remoteOwnedByCurrentUser !== false;
-    const shouldDeleteServer =
-      canDeleteServer && (deleteChoice === 'server' || deleteChoice === 'both');
-    const shouldDeleteLocal = deleteChoice === 'local' || deleteChoice === 'both';
-    const isServerOnly =
-      Boolean(fileToRemove.remoteStorageId) && fileToRemove.id.startsWith('server-');
-    const canLeaveShare =
-      fileToRemove.remoteOwnedByCurrentUser === false &&
-      !fileToRemove.remoteSharedViaLink &&
-      Boolean(fileToRemove.remoteStorageId);
-
-    if (deleteChoice === 'leave' && canLeaveShare && fileToRemove.remoteStorageId) {
+      // Delete safe files from IndexedDB
       try {
-        await apiClient.delete(
-          `/api/v1/storage/files/${fileToRemove.remoteStorageId}/shares/self`,
-          { suppressErrorToast: true } as any
-        );
-        await refreshRecentFiles();
-        alert({
-          alertType: 'success',
-          title: t('fileManager.leaveShareSuccess', 'Removed from your shared list.'),
-          expandable: false,
-          durationMs: 2500,
-        });
-        return;
-      } catch (error) {
-        console.error('Failed to leave shared file:', error);
-        alert({
-          alertType: 'error',
-          title: t('fileManager.leaveShareFailed', 'Could not remove the shared file.'),
-          expandable: false,
-          durationMs: 3500,
-        });
-        return;
-      }
-    }
-
-    if (shouldDeleteServer && fileToRemove.remoteStorageId) {
-      try {
-        await apiClient.delete(
-          `/api/v1/storage/files/${fileToRemove.remoteStorageId}`,
-          { suppressErrorToast: true } as any
-        );
-      } catch (error) {
-        console.error('Failed to delete file from server:', error);
-        alert({
-          alertType: 'error',
-          title: t(
-            'fileManager.removeServerFailed',
-            'Could not remove the file from the server.'
-          ),
-          expandable: false,
-          durationMs: 3500,
-        });
-        return;
-      }
-
-      if (!shouldDeleteLocal) {
-        const originalFileId = (fileToRemove.originalFileId || fileToRemove.id) as FileId;
-        const chain = await fileStorage.getHistoryChainStubs(originalFileId);
-        for (const stub of chain) {
-          await fileStorage.updateFileMetadata(stub.id, {
-            remoteStorageId: undefined,
-            remoteStorageUpdatedAt: undefined,
-          });
+        for (const fileId of filesToDelete) {
+          await fileStorage.deleteStirlingFile(fileId as FileId);
         }
-        await refreshRecentFiles();
-        alert({
-          alertType: 'success',
-          title: t('fileManager.removeServerSuccess', 'Removed from server.'),
-          expandable: false,
-          durationMs: 2500,
-        });
-        return;
+      } catch (error) {
+        console.error("Failed to delete files from chain:", error);
       }
-    }
 
-    if (shouldDeleteLocal && isServerOnly) {
+      // Call the parent's deletion logic for the main file only
+      onFileRemove(fileIndex);
+
+      // Refresh to ensure consistent state
       await refreshRecentFiles();
-      return;
-    }
+    },
+    [
+      getSafeFilesToDelete,
+      setSelectedFileIds,
+      setExpandedFileIds,
+      setLoadedHistoryFiles,
+      onFileRemove,
+      refreshRecentFiles,
+      requestDeleteChoice,
+      t,
+    ],
+  );
 
-    const deletedFileId = fileToRemove.id;
-
-    // Get all stored files to analyze lineages
-    const allStoredStubs = await fileStorage.getAllStirlingFileStubs();
-
-    // Get safe files to delete (respecting shared lineages)
-    const filesToDelete = getSafeFilesToDelete([deletedFileId], allStoredStubs);
-
-    // Clear from selection immediately
-    setSelectedFileIds(prev => prev.filter(id => !filesToDelete.includes(id)));
-
-    // Clear from expanded state to prevent ghost entries
-    setExpandedFileIds(prev => {
-      const newExpanded = new Set(prev);
-      filesToDelete.forEach(id => newExpanded.delete(id));
-      return newExpanded;
-    });
-
-    // Clear from history cache - remove all files in the chain
-    setLoadedHistoryFiles(prev => {
-      const newCache = new Map(prev);
-
-      // Remove cache entries for all deleted files
-      filesToDelete.forEach(id => newCache.delete(id as FileId));
-
-      // Also remove deleted files from any other file's history cache
-      for (const [mainFileId, historyFiles] of newCache.entries()) {
-        const filteredHistory = historyFiles.filter(histFile => !filesToDelete.includes(histFile.id));
-        if (filteredHistory.length !== historyFiles.length) {
-          newCache.set(mainFileId, filteredHistory);
-        }
+  const handleFileRemove = useCallback(
+    async (index: number) => {
+      const fileToRemove = filteredFiles[index];
+      if (fileToRemove) {
+        await performFileDelete(fileToRemove, index);
       }
-
-      return newCache;
-    });
-
-    // Delete safe files from IndexedDB
-    try {
-      for (const fileId of filesToDelete) {
-        await fileStorage.deleteStirlingFile(fileId as FileId);
-      }
-    } catch (error) {
-      console.error('Failed to delete files from chain:', error);
-    }
-
-    // Call the parent's deletion logic for the main file only
-    onFileRemove(fileIndex);
-
-    // Refresh to ensure consistent state
-    await refreshRecentFiles();
-  }, [
-    getSafeFilesToDelete,
-    setSelectedFileIds,
-    setExpandedFileIds,
-    setLoadedHistoryFiles,
-    onFileRemove,
-    refreshRecentFiles,
-    requestDeleteChoice,
-    t,
-  ]);
-
-  const handleFileRemove = useCallback(async (index: number) => {
-    const fileToRemove = filteredFiles[index];
-    if (fileToRemove) {
-      await performFileDelete(fileToRemove, index);
-    }
-  }, [filteredFiles, performFileDelete]);
+    },
+    [filteredFiles, performFileDelete],
+  );
 
   // Handle deletion by fileId (more robust than index-based)
-  const handleFileRemoveById = useCallback(async (fileId: FileId) => {
-    // Find the file and its index in filteredFiles
-    const fileIndex = filteredFiles.findIndex(file => file.id === fileId);
-    const fileToRemove = filteredFiles[fileIndex];
+  const handleFileRemoveById = useCallback(
+    async (fileId: FileId) => {
+      // Find the file and its index in filteredFiles
+      const fileIndex = filteredFiles.findIndex((file) => file.id === fileId);
+      const fileToRemove = filteredFiles[fileIndex];
 
-    if (fileToRemove && fileIndex !== -1) {
-      await performFileDelete(fileToRemove, fileIndex);
-    }
-  }, [filteredFiles, performFileDelete]);
+      if (fileToRemove && fileIndex !== -1) {
+        await performFileDelete(fileToRemove, fileIndex);
+      }
+    },
+    [filteredFiles, performFileDelete],
+  );
 
   // Handle deletion of specific history files (not index-based)
-  const handleHistoryFileRemove = useCallback(async (fileToRemove: StirlingFileStub) => {
-    const deletedFileId = fileToRemove.id;
+  const handleHistoryFileRemove = useCallback(
+    async (fileToRemove: StirlingFileStub) => {
+      const deletedFileId = fileToRemove.id;
 
-    // Clear from expanded state to prevent ghost entries
-    setExpandedFileIds(prev => {
-      const newExpanded = new Set(prev);
-      newExpanded.delete(deletedFileId);
-      return newExpanded;
-    });
+      // Clear from expanded state to prevent ghost entries
+      setExpandedFileIds((prev) => {
+        const newExpanded = new Set(prev);
+        newExpanded.delete(deletedFileId);
+        return newExpanded;
+      });
 
-    // Clear from history cache - remove all files in the chain
-    setLoadedHistoryFiles(prev => {
-      const newCache = new Map(prev);
+      // Clear from history cache - remove all files in the chain
+      setLoadedHistoryFiles((prev) => {
+        const newCache = new Map(prev);
 
-      // Remove cache entries for all deleted files
-      newCache.delete(deletedFileId);
+        // Remove cache entries for all deleted files
+        newCache.delete(deletedFileId);
 
-      // Also remove deleted files from any other file's history cache
-      for (const [mainFileId, historyFiles] of newCache.entries()) {
-        const filteredHistory = historyFiles.filter(histFile => deletedFileId != histFile.id);
-        if (filteredHistory.length !== historyFiles.length) {
-          newCache.set(mainFileId, filteredHistory);
+        // Also remove deleted files from any other file's history cache
+        for (const [mainFileId, historyFiles] of newCache.entries()) {
+          const filteredHistory = historyFiles.filter(
+            (histFile) => deletedFileId != histFile.id,
+          );
+          if (filteredHistory.length !== historyFiles.length) {
+            newCache.set(mainFileId, filteredHistory);
+          }
         }
+
+        return newCache;
+      });
+
+      // Delete safe files from IndexedDB
+      try {
+        await fileStorage.deleteStirlingFile(deletedFileId);
+      } catch (error) {
+        console.error("Failed to delete files from chain:", error);
       }
 
-      return newCache;
-    });
+      // Refresh to ensure consistent state
+      await refreshRecentFiles();
+    },
+    [filteredFiles, onFileRemove, refreshRecentFiles, getSafeFilesToDelete],
+  );
 
-    // Delete safe files from IndexedDB
-    try {
-        await fileStorage.deleteStirlingFile(deletedFileId);
-    } catch (error) {
-      console.error('Failed to delete files from chain:', error);
-    }
-
-    // Refresh to ensure consistent state
-    await refreshRecentFiles();
-  }, [filteredFiles, onFileRemove, refreshRecentFiles, getSafeFilesToDelete]);
-
-  const handleFileDoubleClick = useCallback((file: StirlingFileStub) => {
-    if (isFileSupported(file.name)) {
-      onRecentFilesSelected([file]);
-      onClose();
-    }
-  }, [isFileSupported, onRecentFilesSelected, onClose]);
+  const handleFileDoubleClick = useCallback(
+    (file: StirlingFileStub) => {
+      if (isFileSupported(file.name)) {
+        onRecentFilesSelected([file]);
+        onClose();
+      }
+    },
+    [isFileSupported, onRecentFilesSelected, onClose],
+  );
 
   const handleOpenFiles = useCallback(() => {
     if (selectedFiles.length > 0) {
@@ -568,30 +656,35 @@ export const FileManagerProvider: React.FC<FileManagerProviderProps> = ({
     setSearchTerm(value);
   }, []);
 
-  const handleFileInputChange = useCallback(async (event: React.ChangeEvent<HTMLInputElement>) => {
-    const files = Array.from(event.target.files || []);
-    if (files.length > 0) {
-      try {
-        // For local file uploads, pass File objects directly to FileContext
-        onNewFilesSelect(files);
-        await refreshRecentFiles();
-        onClose();
-      } catch (error) {
-        console.error('Failed to process selected files:', error);
+  const handleFileInputChange = useCallback(
+    async (event: React.ChangeEvent<HTMLInputElement>) => {
+      const files = Array.from(event.target.files || []);
+      if (files.length > 0) {
+        try {
+          // For local file uploads, pass File objects directly to FileContext
+          onNewFilesSelect(files);
+          await refreshRecentFiles();
+          onClose();
+        } catch (error) {
+          console.error("Failed to process selected files:", error);
+        }
       }
-    }
-    event.target.value = '';
-  }, [onNewFilesSelect, refreshRecentFiles, onClose]);
+      event.target.value = "";
+    },
+    [onNewFilesSelect, refreshRecentFiles, onClose],
+  );
 
   const handleSelectAll = useCallback(() => {
-    const allFilesSelected = filteredFiles.length > 0 && selectedFileIds.length === filteredFiles.length;
+    const allFilesSelected =
+      filteredFiles.length > 0 &&
+      selectedFileIds.length === filteredFiles.length;
     if (allFilesSelected) {
       // Deselect all
       setSelectedFileIds([]);
       setLastClickedIndex(null);
     } else {
       // Select all filtered files
-      setSelectedFileIds(filteredFiles.map(file => file.id).filter(Boolean));
+      setSelectedFileIds(filteredFiles.map((file) => file.id).filter(Boolean));
       setLastClickedIndex(null);
     }
   }, [filteredFiles, selectedFileIds]);
@@ -605,7 +698,7 @@ export const FileManagerProvider: React.FC<FileManagerProviderProps> = ({
         await handleFileRemoveById(fileId);
       }
     } catch (error) {
-      console.error('Failed to delete selected files:', error);
+      console.error("Failed to delete selected files:", error);
     }
   }, [selectedFileIds, handleFileRemoveById]);
 
@@ -614,16 +707,16 @@ export const FileManagerProvider: React.FC<FileManagerProviderProps> = ({
 
     try {
       // Get selected files
-      const selectedFilesToDownload = filteredFiles.filter(file =>
-        selectedFileIds.includes(file.id)
+      const selectedFilesToDownload = filteredFiles.filter((file) =>
+        selectedFileIds.includes(file.id),
       );
 
       // Use generic download utility
       await downloadFiles(selectedFilesToDownload, {
-        zipFilename: `selected-files-${new Date().toISOString().slice(0, 19).replace(/[:-]/g, '')}.zip`
+        zipFilename: `selected-files-${new Date().toISOString().slice(0, 19).replace(/[:-]/g, "")}.zip`,
       });
     } catch (error) {
-      console.error('Failed to download selected files:', error);
+      console.error("Failed to download selected files:", error);
     }
   }, [selectedFileIds, filteredFiles]);
 
@@ -631,135 +724,160 @@ export const FileManagerProvider: React.FC<FileManagerProviderProps> = ({
     try {
       await downloadFiles([file]);
     } catch (error) {
-      console.error('Failed to download file:', error);
+      console.error("Failed to download file:", error);
     }
   }, []);
 
-  const handleToggleExpansion = useCallback(async (fileId: FileId) => {
-    const isCurrentlyExpanded = expandedFileIds.has(fileId);
+  const handleToggleExpansion = useCallback(
+    async (fileId: FileId) => {
+      const isCurrentlyExpanded = expandedFileIds.has(fileId);
 
-    // Update expansion state
-    setExpandedFileIds(prev => {
-      const newSet = new Set(prev);
-      if (newSet.has(fileId)) {
-        newSet.delete(fileId);
-      } else {
-        newSet.add(fileId);
-      }
-      return newSet;
-    });
+      // Update expansion state
+      setExpandedFileIds((prev) => {
+        const newSet = new Set(prev);
+        if (newSet.has(fileId)) {
+          newSet.delete(fileId);
+        } else {
+          newSet.add(fileId);
+        }
+        return newSet;
+      });
 
-    // Load complete history chain if expanding
-    if (!isCurrentlyExpanded) {
-      const currentFileMetadata = recentFiles.find(f => f.id === fileId);
-      if (currentFileMetadata && (currentFileMetadata.versionNumber || 1) > 1) {
-        try {
-          // Get all stored file metadata for chain traversal
-          const allStoredStubs = await fileStorage.getAllStirlingFileStubs();
-          const fileMap = new Map(allStoredStubs.map(f => [f.id, f]));
+      // Load complete history chain if expanding
+      if (!isCurrentlyExpanded) {
+        const currentFileMetadata = recentFiles.find((f) => f.id === fileId);
+        if (
+          currentFileMetadata &&
+          (currentFileMetadata.versionNumber || 1) > 1
+        ) {
+          try {
+            // Get all stored file metadata for chain traversal
+            const allStoredStubs = await fileStorage.getAllStirlingFileStubs();
+            const fileMap = new Map(allStoredStubs.map((f) => [f.id, f]));
 
-          // Get the current file's IndexedDB data
-          const currentStoredStub = fileMap.get(fileId as FileId);
-          if (!currentStoredStub) {
-            console.warn(`No stored file found for ${fileId}`);
-            return;
-          }
-
-          // Build complete history chain using IndexedDB metadata
-          const historyFiles: StirlingFileStub[] = [];
-
-          // Find the original file
-
-          // Collect only files in this specific branch (ancestors of current file)
-          const chainFiles: StirlingFileStub[] = [];
-          const allFiles = Array.from(fileMap.values());
-
-          // Build a map for fast parent lookups
-          const fileIdMap = new Map<FileId, StirlingFileStub>();
-          allFiles.forEach(f => fileIdMap.set(f.id, f));
-
-          // Trace back from current file through parent chain
-          let currentFile = fileIdMap.get(fileId);
-          while (currentFile?.parentFileId) {
-            const parentFile = fileIdMap.get(currentFile.parentFileId);
-            if (parentFile) {
-              chainFiles.push(parentFile);
-              currentFile = parentFile;
-            } else {
-              break; // Parent not found, stop tracing
+            // Get the current file's IndexedDB data
+            const currentStoredStub = fileMap.get(fileId as FileId);
+            if (!currentStoredStub) {
+              console.warn(`No stored file found for ${fileId}`);
+              return;
             }
+
+            // Build complete history chain using IndexedDB metadata
+            const historyFiles: StirlingFileStub[] = [];
+
+            // Find the original file
+
+            // Collect only files in this specific branch (ancestors of current file)
+            const chainFiles: StirlingFileStub[] = [];
+            const allFiles = Array.from(fileMap.values());
+
+            // Build a map for fast parent lookups
+            const fileIdMap = new Map<FileId, StirlingFileStub>();
+            allFiles.forEach((f) => fileIdMap.set(f.id, f));
+
+            // Trace back from current file through parent chain
+            let currentFile = fileIdMap.get(fileId);
+            while (currentFile?.parentFileId) {
+              const parentFile = fileIdMap.get(currentFile.parentFileId);
+              if (parentFile) {
+                chainFiles.push(parentFile);
+                currentFile = parentFile;
+              } else {
+                break; // Parent not found, stop tracing
+              }
+            }
+
+            // Sort by version number (oldest first for history display)
+            chainFiles.sort(
+              (a, b) => (a.versionNumber || 1) - (b.versionNumber || 1),
+            );
+
+            // StirlingFileStubs already have all the data we need - no conversion required!
+            historyFiles.push(...chainFiles);
+
+            // Cache the loaded history files
+            setLoadedHistoryFiles(
+              (prev) => new Map(prev.set(fileId as FileId, historyFiles)),
+            );
+          } catch (error) {
+            console.warn(
+              `Failed to load history chain for file ${fileId}:`,
+              error,
+            );
           }
+        }
+      } else {
+        // Clear loaded history when collapsing
+        setLoadedHistoryFiles((prev) => {
+          const newMap = new Map(prev);
+          newMap.delete(fileId as FileId);
+          return newMap;
+        });
+      }
+    },
+    [expandedFileIds, recentFiles],
+  );
 
-          // Sort by version number (oldest first for history display)
-          chainFiles.sort((a, b) => (a.versionNumber || 1) - (b.versionNumber || 1));
+  const handleAddToRecents = useCallback(
+    async (file: StirlingFileStub) => {
+      try {
+        // Mark the file as a leaf node so it appears in recent files
+        await fileStorage.markFileAsLeaf(file.id);
 
-          // StirlingFileStubs already have all the data we need - no conversion required!
-          historyFiles.push(...chainFiles);
+        // Refresh the recent files list to show updated state
+        await refreshRecentFiles();
+      } catch (error) {
+        console.error("Failed to add to recents:", error);
+      }
+    },
+    [refreshRecentFiles],
+  );
 
-          // Cache the loaded history files
-          setLoadedHistoryFiles(prev => new Map(prev.set(fileId as FileId, historyFiles)));
+  const handleGoogleDriveSelect = useCallback(
+    async (files: File[]) => {
+      if (files.length > 0) {
+        try {
+          // Process Google Drive files same as local files
+          onNewFilesSelect(files);
+          await refreshRecentFiles();
+          onClose();
         } catch (error) {
-          console.warn(`Failed to load history chain for file ${fileId}:`, error);
+          console.error("Failed to process Google Drive files:", error);
         }
       }
-    } else {
-      // Clear loaded history when collapsing
-      setLoadedHistoryFiles(prev => {
-        const newMap = new Map(prev);
-        newMap.delete(fileId as FileId);
-        return newMap;
-      });
-    }
-  }, [expandedFileIds, recentFiles]);
+    },
+    [onNewFilesSelect, refreshRecentFiles, onClose],
+  );
 
-  const handleAddToRecents = useCallback(async (file: StirlingFileStub) => {
-    try {
-      // Mark the file as a leaf node so it appears in recent files
-      await fileStorage.markFileAsLeaf(file.id);
-
-      // Refresh the recent files list to show updated state
-      await refreshRecentFiles();
-    } catch (error) {
-      console.error('Failed to add to recents:', error);
-    }
-  }, [refreshRecentFiles]);
-
-  const handleGoogleDriveSelect = useCallback(async (files: File[]) => {
-    if (files.length > 0) {
+  const handleUnzipFile = useCallback(
+    async (file: StirlingFileStub) => {
       try {
-        // Process Google Drive files same as local files
-        onNewFilesSelect(files);
-        await refreshRecentFiles();
-        onClose();
+        // Load the full file from storage
+        const stirlingFile = await fileStorage.getStirlingFile(file.id);
+        if (!stirlingFile) {
+          return;
+        }
+
+        // Extract and store files using shared service method
+        const result = await zipFileService.extractAndStoreFilesWithHistory(
+          stirlingFile,
+          file,
+        );
+
+        if (result.success) {
+          // Refresh file manager to show new files
+          await refreshRecentFiles();
+        }
+
+        if (result.errors.length > 0) {
+          console.error("Errors during unzip:", result.errors);
+        }
       } catch (error) {
-        console.error('Failed to process Google Drive files:', error);
+        console.error("Failed to unzip file:", error);
       }
-    }
-  }, [onNewFilesSelect, refreshRecentFiles, onClose]);
-
-  const handleUnzipFile = useCallback(async (file: StirlingFileStub) => {
-    try {
-      // Load the full file from storage
-      const stirlingFile = await fileStorage.getStirlingFile(file.id);
-      if (!stirlingFile) {
-        return;
-      }
-
-      // Extract and store files using shared service method
-      const result = await zipFileService.extractAndStoreFilesWithHistory(stirlingFile, file);
-
-      if (result.success) {
-        // Refresh file manager to show new files
-        await refreshRecentFiles();
-      }
-
-      if (result.errors.length > 0) {
-        console.error('Errors during unzip:', result.errors);
-      }
-    } catch (error) {
-      console.error('Failed to unzip file:', error);
-    }
-  }, [refreshRecentFiles]);
+    },
+    [refreshRecentFiles],
+  );
 
   const handleMakeCopy = useCallback(
     async (file: StirlingFileStub) => {
@@ -769,23 +887,32 @@ export const FileManagerProvider: React.FC<FileManagerProviderProps> = ({
       try {
         const response = await apiClient.get(
           `/api/v1/storage/files/${file.remoteStorageId}/download`,
-          { responseType: 'blob', suppressErrorToast: true, skipAuthRedirect: true } as any
+          {
+            responseType: "blob",
+            suppressErrorToast: true,
+            skipAuthRedirect: true,
+          } as any,
         );
         const contentType =
           (response.headers &&
-            (response.headers['content-type'] || response.headers['Content-Type'])) ||
-          '';
+            (response.headers["content-type"] ||
+              response.headers["Content-Type"])) ||
+          "";
         const disposition =
           (response.headers &&
-            (response.headers['content-disposition'] || response.headers['Content-Disposition'])) ||
-          '';
-        const filename = parseContentDispositionFilename(disposition) || file.name || 'shared-file';
+            (response.headers["content-disposition"] ||
+              response.headers["Content-Disposition"])) ||
+          "";
+        const filename =
+          parseContentDispositionFilename(disposition) ||
+          file.name ||
+          "shared-file";
         const blob = response.data as Blob;
         const contentTypeValue = contentType || blob.type;
         const latestFiles = await extractLatestFilesFromBundle(
           blob,
           filename,
-          contentTypeValue
+          contentTypeValue,
         );
         if (latestFiles.length > 0) {
           await actions.addFilesWithOptions(latestFiles, {
@@ -796,30 +923,30 @@ export const FileManagerProvider: React.FC<FileManagerProviderProps> = ({
           });
           await refreshRecentFiles();
           alert({
-            alertType: 'success',
-            title: t('fileManager.copyCreated', 'Copy saved to this device.'),
+            alertType: "success",
+            title: t("fileManager.copyCreated", "Copy saved to this device."),
             expandable: false,
             durationMs: 2500,
           });
         }
       } catch (error) {
-        console.error('Failed to create a copy:', error);
+        console.error("Failed to create a copy:", error);
         alert({
-          alertType: 'error',
-          title: t('fileManager.copyFailed', 'Could not create a copy.'),
+          alertType: "error",
+          title: t("fileManager.copyFailed", "Could not create a copy."),
           expandable: false,
           durationMs: 3500,
         });
       }
     },
-    [actions, refreshRecentFiles, t]
+    [actions, refreshRecentFiles, t],
   );
 
   // Cleanup blob URLs when component unmounts
   useEffect(() => {
     return () => {
       // Clean up all created blob URLs
-      createdBlobUrls.current.forEach(url => {
+      createdBlobUrls.current.forEach((url) => {
         URL.revokeObjectURL(url);
       });
       createdBlobUrls.current.clear();
@@ -829,99 +956,104 @@ export const FileManagerProvider: React.FC<FileManagerProviderProps> = ({
   // Reset state when modal closes
   useEffect(() => {
     if (!isOpen) {
-      setActiveSource('recent');
-      setStorageFilter('all');
+      setActiveSource("recent");
+      setStorageFilter("all");
       setSelectedFileIds([]);
-      setSearchTerm('');
+      setSearchTerm("");
       setLastClickedIndex(null);
     }
   }, [isOpen]);
 
-  const contextValue: FileManagerContextValue = useMemo(() => ({
-    // State
-    activeSource,
-    storageFilter,
-    selectedFileIds,
-    searchTerm,
-    selectedFiles,
-    filteredFiles,
-    fileInputRef,
-    selectedFilesSet,
-    expandedFileIds,
-    fileGroups,
-    loadedHistoryFiles,
-    isLoading,
-    activeFileIds,
+  const contextValue: FileManagerContextValue = useMemo(
+    () => ({
+      // State
+      activeSource,
+      storageFilter,
+      selectedFileIds,
+      searchTerm,
+      selectedFiles,
+      filteredFiles,
+      fileInputRef,
+      selectedFilesSet,
+      expandedFileIds,
+      fileGroups,
+      loadedHistoryFiles,
+      isLoading,
+      activeFileIds,
 
-    // Handlers
-    onSourceChange: handleSourceChange,
-    onStorageFilterChange: handleStorageFilterChange,
-    onLocalFileClick: handleLocalFileClick,
-    onFileSelect: handleFileSelect,
-    onFileRemove: handleFileRemove,
-    onHistoryFileRemove: handleHistoryFileRemove,
-    onFileDoubleClick: handleFileDoubleClick,
-    onOpenFiles: handleOpenFiles,
-    onSearchChange: handleSearchChange,
-    onFileInputChange: handleFileInputChange,
-    onSelectAll: handleSelectAll,
-    onDeleteSelected: handleDeleteSelected,
-    onDownloadSelected: handleDownloadSelected,
-    onDownloadSingle: handleDownloadSingle,
-    onToggleExpansion: handleToggleExpansion,
-    onAddToRecents: handleAddToRecents,
-    onUnzipFile: handleUnzipFile,
-    onMakeCopy: handleMakeCopy,
-    onNewFilesSelect,
-    onGoogleDriveSelect: handleGoogleDriveSelect,
-    refreshRecentFiles,
+      // Handlers
+      onSourceChange: handleSourceChange,
+      onStorageFilterChange: handleStorageFilterChange,
+      onLocalFileClick: handleLocalFileClick,
+      onFileSelect: handleFileSelect,
+      onFileRemove: handleFileRemove,
+      onHistoryFileRemove: handleHistoryFileRemove,
+      onFileDoubleClick: handleFileDoubleClick,
+      onOpenFiles: handleOpenFiles,
+      onSearchChange: handleSearchChange,
+      onFileInputChange: handleFileInputChange,
+      onSelectAll: handleSelectAll,
+      onDeleteSelected: handleDeleteSelected,
+      onDownloadSelected: handleDownloadSelected,
+      onDownloadSingle: handleDownloadSingle,
+      onToggleExpansion: handleToggleExpansion,
+      onAddToRecents: handleAddToRecents,
+      onUnzipFile: handleUnzipFile,
+      onMakeCopy: handleMakeCopy,
+      onNewFilesSelect,
+      onGoogleDriveSelect: handleGoogleDriveSelect,
+      refreshRecentFiles,
 
-    // External props
-    recentFiles,
-    isFileSupported,
-    modalHeight,
-  }), [
-    activeSource,
-    storageFilter,
-    selectedFileIds,
-    searchTerm,
-    selectedFiles,
-    filteredFiles,
-    fileInputRef,
-    expandedFileIds,
-    fileGroups,
-    loadedHistoryFiles,
-    isLoading,
-    activeFileIds,
-    handleSourceChange,
-    handleStorageFilterChange,
-    handleLocalFileClick,
-    handleFileSelect,
-    handleFileRemove,
-    handleFileRemoveById,
-    performFileDelete,
-    handleFileDoubleClick,
-    handleOpenFiles,
-    handleSearchChange,
-    handleFileInputChange,
-    handleSelectAll,
-    handleDeleteSelected,
-    handleDownloadSelected,
-    handleToggleExpansion,
-    handleAddToRecents,
-    handleUnzipFile,
-    handleMakeCopy,
-    onNewFilesSelect,
-    handleGoogleDriveSelect,
-    recentFiles,
-    isFileSupported,
-    modalHeight,
-   refreshRecentFiles,
- ]);
+      // External props
+      recentFiles,
+      isFileSupported,
+      modalHeight,
+    }),
+    [
+      activeSource,
+      storageFilter,
+      selectedFileIds,
+      searchTerm,
+      selectedFiles,
+      filteredFiles,
+      fileInputRef,
+      expandedFileIds,
+      fileGroups,
+      loadedHistoryFiles,
+      isLoading,
+      activeFileIds,
+      handleSourceChange,
+      handleStorageFilterChange,
+      handleLocalFileClick,
+      handleFileSelect,
+      handleFileRemove,
+      handleFileRemoveById,
+      performFileDelete,
+      handleFileDoubleClick,
+      handleOpenFiles,
+      handleSearchChange,
+      handleFileInputChange,
+      handleSelectAll,
+      handleDeleteSelected,
+      handleDownloadSelected,
+      handleToggleExpansion,
+      handleAddToRecents,
+      handleUnzipFile,
+      handleMakeCopy,
+      onNewFilesSelect,
+      handleGoogleDriveSelect,
+      recentFiles,
+      isFileSupported,
+      modalHeight,
+      refreshRecentFiles,
+    ],
+  );
 
   const deletePromptIsServerOnly =
-    Boolean(deletePromptFile?.remoteStorageId) && deletePromptFile?.id?.startsWith('server-');
-  const deletePromptIsShared = deletePromptFile?.remoteOwnedByCurrentUser === false;
+    Boolean(deletePromptFile?.remoteStorageId) &&
+    deletePromptFile?.id?.startsWith("server-");
+  const deletePromptIsShared =
+    deletePromptFile?.remoteOwnedByCurrentUser === false;
   const deletePromptCanLeaveShare =
     deletePromptIsShared &&
     !deletePromptFile?.remoteSharedViaLink &&
@@ -932,9 +1064,9 @@ export const FileManagerProvider: React.FC<FileManagerProviderProps> = ({
       {children}
       <Modal
         opened={Boolean(deletePromptFile)}
-        onClose={() => resolveDeleteChoice('cancel')}
+        onClose={() => resolveDeleteChoice("cancel")}
         centered
-        title={t('fileManager.removeFileTitle', 'Remove file')}
+        title={t("fileManager.removeFileTitle", "Remove file")}
         zIndex={Z_INDEX_OVER_FILE_MANAGER_MODAL}
       >
         <Stack gap="sm">
@@ -943,52 +1075,67 @@ export const FileManagerProvider: React.FC<FileManagerProviderProps> = ({
               ? deletePromptIsShared
                 ? deletePromptCanLeaveShare
                   ? t(
-                      'fileManager.removeSharedServerOnlyPrompt',
-                      'This file is shared with you and stored only on the server. Remove it from your list?'
+                      "fileManager.removeSharedServerOnlyPrompt",
+                      "This file is shared with you and stored only on the server. Remove it from your list?",
                     )
                   : t(
-                      'fileManager.removeSharedServerOnlyBlockedPrompt',
-                      'This file is shared with you and stored only on the server.'
+                      "fileManager.removeSharedServerOnlyBlockedPrompt",
+                      "This file is shared with you and stored only on the server.",
                     )
                 : t(
-                    'fileManager.removeServerOnlyPrompt',
-                    'This file is stored only on your server. Would you like to remove it from the server?'
+                    "fileManager.removeServerOnlyPrompt",
+                    "This file is stored only on your server. Would you like to remove it from the server?",
                   )
               : deletePromptIsShared
                 ? t(
-                    'fileManager.removeSharedPrompt',
-                    'This file is shared with you. You can remove it from this device or your shared list.'
+                    "fileManager.removeSharedPrompt",
+                    "This file is shared with you. You can remove it from this device or your shared list.",
                   )
                 : t(
-                    'fileManager.removeFilePrompt',
-                    'This file is saved on this device and on your server. Where would you like to remove it from?'
+                    "fileManager.removeFilePrompt",
+                    "This file is saved on this device and on your server. Where would you like to remove it from?",
                   )}
           </Text>
           <Text size="sm" c="dimmed">
             {deletePromptFile?.name}
           </Text>
           <Group justify="flex-end" gap="sm">
-            <Button variant="default" onClick={() => resolveDeleteChoice('cancel')}>
-              {t('cancel', 'Cancel')}
+            <Button
+              variant="default"
+              onClick={() => resolveDeleteChoice("cancel")}
+            >
+              {t("cancel", "Cancel")}
             </Button>
             {!deletePromptIsServerOnly && (
-              <Button variant="light" onClick={() => resolveDeleteChoice('local')}>
-                {t('fileManager.removeLocalOnly', 'This device only')}
+              <Button
+                variant="light"
+                onClick={() => resolveDeleteChoice("local")}
+              >
+                {t("fileManager.removeLocalOnly", "This device only")}
               </Button>
             )}
             {deletePromptCanLeaveShare && (
-              <Button variant="light" onClick={() => resolveDeleteChoice('leave')}>
-                {t('fileManager.leaveShare', 'Remove from my list')}
+              <Button
+                variant="light"
+                onClick={() => resolveDeleteChoice("leave")}
+              >
+                {t("fileManager.leaveShare", "Remove from my list")}
               </Button>
             )}
             {deletePromptFile?.remoteOwnedByCurrentUser !== false && (
               <>
-                <Button variant="light" onClick={() => resolveDeleteChoice('server')}>
-                  {t('fileManager.removeServerOnly', 'Server only')}
+                <Button
+                  variant="light"
+                  onClick={() => resolveDeleteChoice("server")}
+                >
+                  {t("fileManager.removeServerOnly", "Server only")}
                 </Button>
                 {!deletePromptIsServerOnly && (
-                  <Button color="red" onClick={() => resolveDeleteChoice('both')}>
-                    {t('fileManager.removeBoth', 'Remove from both')}
+                  <Button
+                    color="red"
+                    onClick={() => resolveDeleteChoice("both")}
+                  >
+                    {t("fileManager.removeBoth", "Remove from both")}
                   </Button>
                 )}
               </>
@@ -1006,8 +1153,8 @@ export const useFileManagerContext = (): FileManagerContextValue => {
 
   if (!context) {
     throw new Error(
-      'useFileManagerContext must be used within a FileManagerProvider. ' +
-      'Make sure you wrap your component with <FileManagerProvider>.'
+      "useFileManagerContext must be used within a FileManagerProvider. " +
+        "Make sure you wrap your component with <FileManagerProvider>.",
     );
   }
 
diff --git a/frontend/src/core/contexts/FilesModalContext.tsx b/frontend/src/core/contexts/FilesModalContext.tsx
index d9d1c3a406..aec1915954 100644
--- a/frontend/src/core/contexts/FilesModalContext.tsx
+++ b/frontend/src/core/contexts/FilesModalContext.tsx
@@ -1,23 +1,32 @@
-import React, { createContext, useContext, useState, useCallback, useMemo } from 'react';
-import { useFileHandler } from '@app/hooks/useFileHandler';
-import { useFileActions } from '@app/contexts/FileContext';
-import { useFileContext } from '@app/contexts/file/fileHooks';
-import { StirlingFileStub } from '@app/types/fileContext';
-import type { FileId } from '@app/types/file';
-import { fileStorage } from '@app/services/fileStorage';
-import apiClient from '@app/services/apiClient';
-import { alert } from '@app/components/toast';
+import React, {
+  createContext,
+  useContext,
+  useState,
+  useCallback,
+  useMemo,
+} from "react";
+import { useFileHandler } from "@app/hooks/useFileHandler";
+import { useFileActions } from "@app/contexts/FileContext";
+import { useFileContext } from "@app/contexts/file/fileHooks";
+import { StirlingFileStub } from "@app/types/fileContext";
+import type { FileId } from "@app/types/file";
+import { fileStorage } from "@app/services/fileStorage";
+import apiClient from "@app/services/apiClient";
+import { alert } from "@app/components/toast";
 import {
   extractLatestFilesFromBundle,
   getShareBundleEntryRootId,
   isZipBundle,
   loadShareBundleEntries,
   parseContentDispositionFilename,
-} from '@app/services/shareBundleUtils';
+} from "@app/services/shareBundleUtils";
 
 interface FilesModalContextType {
   isFilesModalOpen: boolean;
-  openFilesModal: (options?: { insertAfterPage?: number; customHandler?: (files: File[], insertAfterPage?: number) => void }) => void;
+  openFilesModal: (options?: {
+    insertAfterPage?: number;
+    customHandler?: (files: File[], insertAfterPage?: number) => void;
+  }) => void;
   closeFilesModal: () => void;
   onFileUpload: (files: File[]) => void;
   onRecentFileSelect: (stirlingFileStubs: StirlingFileStub[]) => void;
@@ -27,14 +36,18 @@ interface FilesModalContextType {
 
 const FilesModalContext = createContext<FilesModalContextType | null>(null);
 
-export const FilesModalProvider: React.FC<{ children: React.ReactNode }> = ({ children }) => {
+export const FilesModalProvider: React.FC<{ children: React.ReactNode }> = ({
+  children,
+}) => {
   const { addFiles } = useFileHandler();
   const { actions } = useFileActions();
   const fileCtx = useFileContext();
   const [isFilesModalOpen, setIsFilesModalOpen] = useState(false);
   const [onModalClose, setOnModalClose] = useState<(() => void) | undefined>();
   const [insertAfterPage, setInsertAfterPage] = useState<number | undefined>();
-  const [customHandler, setCustomHandler] = useState<((files: File[], insertAfterPage?: number) => void) | undefined>();
+  const [customHandler, setCustomHandler] = useState<
+    ((files: File[], insertAfterPage?: number) => void) | undefined
+  >();
 
   const importBundleToWorkbench = useCallback(
     async (
@@ -46,9 +59,11 @@ export const FilesModalProvider: React.FC<{ children: React.ReactNode }> = ({ ch
       remoteOwnerUsername?: string,
       remoteOwnedByCurrentUser?: boolean,
       remoteSharedViaLink?: boolean,
-      remoteShareToken?: string
+      remoteShareToken?: string,
     ): Promise<FileId[]> => {
-      const bundle = isZipBundle(contentType, filename) ? await loadShareBundleEntries(blob) : null;
+      const bundle = isZipBundle(contentType, filename)
+        ? await loadShareBundleEntries(blob)
+        : null;
       if (bundle) {
         const { manifest, rootOrder, sortedEntries, files } = bundle;
 
@@ -61,7 +76,10 @@ export const FilesModalProvider: React.FC<{ children: React.ReactNode }> = ({ ch
 
         const idMap = new Map<string, FileId>();
         for (let i = 0; i < stirlingFiles.length; i += 1) {
-          idMap.set(sortedEntries[i].logicalId, stirlingFiles[i].fileId as FileId);
+          idMap.set(
+            sortedEntries[i].logicalId,
+            stirlingFiles[i].fileId as FileId,
+          );
         }
 
         const rootIdMap = new Map<string, FileId>();
@@ -103,7 +121,7 @@ export const FilesModalProvider: React.FC<{ children: React.ReactNode }> = ({ ch
         const selectedIds: FileId[] = [];
         for (const rootId of rootOrder) {
           const rootEntries = sortedEntries.filter(
-            (entry) => getShareBundleEntryRootId(manifest, entry) === rootId
+            (entry) => getShareBundleEntryRootId(manifest, entry) === rootId,
           );
           const latestEntry = rootEntries[rootEntries.length - 1];
           if (!latestEntry) {
@@ -118,7 +136,9 @@ export const FilesModalProvider: React.FC<{ children: React.ReactNode }> = ({ ch
         return selectedIds;
       }
 
-      const file = new File([blob], filename, { type: contentType || blob.type });
+      const file = new File([blob], filename, {
+        type: contentType || blob.type,
+      });
       const stirlingFiles = await actions.addFilesWithOptions([file], {
         selectFiles: false,
         autoUnzip: false,
@@ -141,52 +161,72 @@ export const FilesModalProvider: React.FC<{ children: React.ReactNode }> = ({ ch
       }
       return fileId ? [fileId] : [];
     },
-    [actions, fileStorage]
+    [actions, fileStorage],
   );
 
   const downloadServerFile = useCallback(async (remoteId: number) => {
-    const response = await apiClient.get(`/api/v1/storage/files/${remoteId}/download`, {
-      responseType: 'blob',
-      suppressErrorToast: true,
-      skipAuthRedirect: true,
-    } as any);
+    const response = await apiClient.get(
+      `/api/v1/storage/files/${remoteId}/download`,
+      {
+        responseType: "blob",
+        suppressErrorToast: true,
+        skipAuthRedirect: true,
+      } as any,
+    );
     const contentType =
-      (response.headers && (response.headers['content-type'] || response.headers['Content-Type'])) ||
-      '';
+      (response.headers &&
+        (response.headers["content-type"] ||
+          response.headers["Content-Type"])) ||
+      "";
     const disposition =
       (response.headers &&
-        (response.headers['content-disposition'] || response.headers['Content-Disposition'])) ||
-      '';
-    const filename = parseContentDispositionFilename(disposition) || 'server-file';
+        (response.headers["content-disposition"] ||
+          response.headers["Content-Disposition"])) ||
+      "";
+    const filename =
+      parseContentDispositionFilename(disposition) || "server-file";
     const blob = response.data as Blob;
     const contentTypeValue = contentType || blob.type;
     return { blob, filename, contentType: contentTypeValue };
   }, []);
 
   const downloadShareLinkFile = useCallback(async (shareToken: string) => {
-    const response = await apiClient.get(`/api/v1/storage/share-links/${shareToken}`, {
-      responseType: 'blob',
-      suppressErrorToast: true,
-      skipAuthRedirect: true,
-    } as any);
+    const response = await apiClient.get(
+      `/api/v1/storage/share-links/${shareToken}`,
+      {
+        responseType: "blob",
+        suppressErrorToast: true,
+        skipAuthRedirect: true,
+      } as any,
+    );
     const contentType =
-      (response.headers && (response.headers['content-type'] || response.headers['Content-Type'])) ||
-      '';
+      (response.headers &&
+        (response.headers["content-type"] ||
+          response.headers["Content-Type"])) ||
+      "";
     const disposition =
       (response.headers &&
-        (response.headers['content-disposition'] || response.headers['Content-Disposition'])) ||
-      '';
-    const filename = parseContentDispositionFilename(disposition) || 'shared-file';
+        (response.headers["content-disposition"] ||
+          response.headers["Content-Disposition"])) ||
+      "";
+    const filename =
+      parseContentDispositionFilename(disposition) || "shared-file";
     const blob = response.data as Blob;
     const contentTypeValue = contentType || blob.type;
     return { blob, filename, contentType: contentTypeValue };
   }, []);
 
-  const openFilesModal = useCallback((options?: { insertAfterPage?: number; customHandler?: (files: File[], insertAfterPage?: number) => void }) => {
-    setInsertAfterPage(options?.insertAfterPage);
-    setCustomHandler(() => options?.customHandler);
-    setIsFilesModalOpen(true);
-  }, []);
+  const openFilesModal = useCallback(
+    (options?: {
+      insertAfterPage?: number;
+      customHandler?: (files: File[], insertAfterPage?: number) => void;
+    }) => {
+      setInsertAfterPage(options?.insertAfterPage);
+      setCustomHandler(() => options?.customHandler);
+      setIsFilesModalOpen(true);
+    },
+    [],
+  );
 
   const closeFilesModal = useCallback(() => {
     setIsFilesModalOpen(false);
@@ -195,165 +235,208 @@ export const FilesModalProvider: React.FC<{ children: React.ReactNode }> = ({ ch
     onModalClose?.();
   }, [onModalClose]);
 
-  const handleFileUpload = useCallback(async (files: File[]) => {
-    if (customHandler) {
-      // Use custom handler for special cases (like page insertion)
-      customHandler(files, insertAfterPage);
-    } else {
-      // 1) Add via standard flow (auto-selects new files)
-      await addFiles(files);
-      // 2) Merge all requested file IDs (covers already-present files too)
-      const ids = files
-        .map((f) => fileCtx.findFileId(f) as FileId | undefined)
-        .filter((id): id is FileId => Boolean(id));
-      if (ids.length > 0) {
-        const currentSelected = fileCtx.selectors.getSelectedStirlingFileStubs().map((s) => s.id);
-        const nextSelection = Array.from(new Set([...currentSelected, ...ids]));
-        actions.setSelectedFiles(nextSelection);
-      }
-    }
-    closeFilesModal();
-  }, [addFiles, closeFilesModal, insertAfterPage, customHandler, actions, fileCtx]);
-
-  const handleRecentFileSelect = useCallback(async (stirlingFileStubs: StirlingFileStub[]) => {
-    const serverOnlyStubs = stirlingFileStubs.filter(
-      (stub) => stub.remoteStorageId && stub.id.startsWith('server-')
-    );
-    const sharedLinkStubs = stirlingFileStubs.filter(
-      (stub) => stub.remoteShareToken
-    );
-    const localStubs = stirlingFileStubs.filter(
-      (stub) => !serverOnlyStubs.includes(stub) && !sharedLinkStubs.includes(stub)
-    );
-
-    if (customHandler) {
-      try {
-        const loadedFiles: File[] = [];
-        for (const stub of localStubs) {
-          const stirlingFile = await fileStorage.getStirlingFile(stub.id);
-          if (stirlingFile) {
-            loadedFiles.push(stirlingFile);
-          }
+  const handleFileUpload = useCallback(
+    async (files: File[]) => {
+      if (customHandler) {
+        // Use custom handler for special cases (like page insertion)
+        customHandler(files, insertAfterPage);
+      } else {
+        // 1) Add via standard flow (auto-selects new files)
+        await addFiles(files);
+        // 2) Merge all requested file IDs (covers already-present files too)
+        const ids = files
+          .map((f) => fileCtx.findFileId(f) as FileId | undefined)
+          .filter((id): id is FileId => Boolean(id));
+        if (ids.length > 0) {
+          const currentSelected = fileCtx.selectors
+            .getSelectedStirlingFileStubs()
+            .map((s) => s.id);
+          const nextSelection = Array.from(
+            new Set([...currentSelected, ...ids]),
+          );
+          actions.setSelectedFiles(nextSelection);
         }
+      }
+      closeFilesModal();
+    },
+    [
+      addFiles,
+      closeFilesModal,
+      insertAfterPage,
+      customHandler,
+      actions,
+      fileCtx,
+    ],
+  );
+
+  const handleRecentFileSelect = useCallback(
+    async (stirlingFileStubs: StirlingFileStub[]) => {
+      const serverOnlyStubs = stirlingFileStubs.filter(
+        (stub) => stub.remoteStorageId && stub.id.startsWith("server-"),
+      );
+      const sharedLinkStubs = stirlingFileStubs.filter(
+        (stub) => stub.remoteShareToken,
+      );
+      const localStubs = stirlingFileStubs.filter(
+        (stub) =>
+          !serverOnlyStubs.includes(stub) && !sharedLinkStubs.includes(stub),
+      );
+
+      if (customHandler) {
+        try {
+          const loadedFiles: File[] = [];
+          for (const stub of localStubs) {
+            const stirlingFile = await fileStorage.getStirlingFile(stub.id);
+            if (stirlingFile) {
+              loadedFiles.push(stirlingFile);
+            }
+          }
+          for (const stub of serverOnlyStubs) {
+            if (!stub.remoteStorageId) continue;
+            const { blob, filename, contentType } = await downloadServerFile(
+              stub.remoteStorageId,
+            );
+            const latestFiles = await extractLatestFilesFromBundle(
+              blob,
+              filename,
+              contentType,
+            );
+            loadedFiles.push(...latestFiles);
+          }
+          for (const stub of sharedLinkStubs) {
+            if (!stub.remoteShareToken) continue;
+            const { blob, filename, contentType } = await downloadShareLinkFile(
+              stub.remoteShareToken,
+            );
+            const latestFiles = await extractLatestFilesFromBundle(
+              blob,
+              filename,
+              contentType,
+            );
+            loadedFiles.push(...latestFiles);
+          }
+
+          if (loadedFiles.length > 0) {
+            customHandler(loadedFiles, insertAfterPage);
+          }
+        } catch (error) {
+          console.error("Failed to load files for custom handler:", error);
+          alert({
+            alertType: "error",
+            title: "Unable to download one or more server files.",
+            expandable: false,
+            durationMs: 3500,
+          });
+        }
+        closeFilesModal();
+        return;
+      }
+
+      const selectedFromServer: FileId[] = [];
+      try {
         for (const stub of serverOnlyStubs) {
           if (!stub.remoteStorageId) continue;
-          const { blob, filename, contentType } = await downloadServerFile(stub.remoteStorageId);
-          const latestFiles = await extractLatestFilesFromBundle(blob, filename, contentType);
-          loadedFiles.push(...latestFiles);
+          const { blob, filename, contentType } = await downloadServerFile(
+            stub.remoteStorageId,
+          );
+          const importedIds = await importBundleToWorkbench(
+            blob,
+            filename,
+            contentType,
+            stub.remoteStorageId,
+            stub.remoteStorageUpdatedAt,
+            stub.remoteOwnerUsername,
+            stub.remoteOwnedByCurrentUser,
+            stub.remoteSharedViaLink,
+            stub.remoteShareToken,
+          );
+          selectedFromServer.push(...importedIds);
         }
         for (const stub of sharedLinkStubs) {
           if (!stub.remoteShareToken) continue;
-          const { blob, filename, contentType } = await downloadShareLinkFile(stub.remoteShareToken);
-          const latestFiles = await extractLatestFilesFromBundle(blob, filename, contentType);
-          loadedFiles.push(...latestFiles);
-        }
-
-        if (loadedFiles.length > 0) {
-          customHandler(loadedFiles, insertAfterPage);
+          const { blob, filename, contentType } = await downloadShareLinkFile(
+            stub.remoteShareToken,
+          );
+          const importedIds = await importBundleToWorkbench(
+            blob,
+            filename,
+            contentType,
+            stub.remoteStorageId,
+            stub.remoteStorageUpdatedAt,
+            stub.remoteOwnerUsername,
+            stub.remoteOwnedByCurrentUser,
+            true,
+            stub.remoteShareToken,
+          );
+          selectedFromServer.push(...importedIds);
         }
       } catch (error) {
-        console.error('Failed to load files for custom handler:', error);
+        console.error("Failed to load server files:", error);
         alert({
-          alertType: 'error',
-          title: 'Unable to download one or more server files.',
+          alertType: "error",
+          title: "Unable to download one or more server files.",
           expandable: false,
           durationMs: 3500,
         });
       }
+
+      if (actions.addStirlingFileStubs) {
+        await actions.addStirlingFileStubs(localStubs, { selectFiles: false });
+        // Union newly picked files with the current selection so tools like
+        // Compare that depend on multi-file selection don't lose existing
+        // selections when the user picks an additional file from the modal.
+        const requestedIds = localStubs.map((s) => s.id);
+        const currentSelected = fileCtx.selectors
+          .getSelectedStirlingFileStubs()
+          .map((s) => s.id);
+        const nextSelection = Array.from(
+          new Set([...currentSelected, ...requestedIds, ...selectedFromServer]),
+        );
+        actions.setSelectedFiles(nextSelection);
+      } else {
+        console.error("addStirlingFileStubs action not available");
+      }
+
       closeFilesModal();
-      return;
-    }
-
-    const selectedFromServer: FileId[] = [];
-    try {
-      for (const stub of serverOnlyStubs) {
-        if (!stub.remoteStorageId) continue;
-        const { blob, filename, contentType } = await downloadServerFile(stub.remoteStorageId);
-        const importedIds = await importBundleToWorkbench(
-          blob,
-          filename,
-          contentType,
-          stub.remoteStorageId,
-          stub.remoteStorageUpdatedAt,
-          stub.remoteOwnerUsername,
-          stub.remoteOwnedByCurrentUser,
-          stub.remoteSharedViaLink,
-          stub.remoteShareToken
-        );
-        selectedFromServer.push(...importedIds);
-      }
-      for (const stub of sharedLinkStubs) {
-        if (!stub.remoteShareToken) continue;
-        const { blob, filename, contentType } = await downloadShareLinkFile(stub.remoteShareToken);
-        const importedIds = await importBundleToWorkbench(
-          blob,
-          filename,
-          contentType,
-          stub.remoteStorageId,
-          stub.remoteStorageUpdatedAt,
-          stub.remoteOwnerUsername,
-          stub.remoteOwnedByCurrentUser,
-          true,
-          stub.remoteShareToken
-        );
-        selectedFromServer.push(...importedIds);
-      }
-    } catch (error) {
-      console.error('Failed to load server files:', error);
-      alert({
-        alertType: 'error',
-        title: 'Unable to download one or more server files.',
-        expandable: false,
-        durationMs: 3500,
-      });
-    }
-
-    if (actions.addStirlingFileStubs) {
-      await actions.addStirlingFileStubs(localStubs, { selectFiles: false });
-      const requestedIds = localStubs.map((s) => s.id);
-      const nextSelection = Array.from(
-        new Set([...requestedIds, ...selectedFromServer])
-      );
-      actions.setSelectedFiles(nextSelection);
-    } else {
-      console.error('addStirlingFileStubs action not available');
-    }
-
-    closeFilesModal();
-  }, [
-    actions.addStirlingFileStubs,
-    actions,
-    closeFilesModal,
-    customHandler,
-    insertAfterPage,
-    fileCtx,
-    downloadServerFile,
-    downloadShareLinkFile,
-    extractLatestFilesFromBundle,
-    importBundleToWorkbench,
-  ]);
+    },
+    [
+      actions.addStirlingFileStubs,
+      actions,
+      closeFilesModal,
+      customHandler,
+      insertAfterPage,
+      fileCtx,
+      downloadServerFile,
+      downloadShareLinkFile,
+      extractLatestFilesFromBundle,
+      importBundleToWorkbench,
+    ],
+  );
 
   const setModalCloseCallback = useCallback((callback: () => void) => {
     setOnModalClose(() => callback);
   }, []);
 
-  const contextValue: FilesModalContextType = useMemo(() => ({
-    isFilesModalOpen,
-    openFilesModal,
-    closeFilesModal,
-    onFileUpload: handleFileUpload,
-    onRecentFileSelect: handleRecentFileSelect,
-    onModalClose,
-    setOnModalClose: setModalCloseCallback,
-  }), [
-    isFilesModalOpen,
-    openFilesModal,
-    closeFilesModal,
-    handleFileUpload,
-    handleRecentFileSelect,
-    onModalClose,
-    setModalCloseCallback,
-  ]);
+  const contextValue: FilesModalContextType = useMemo(
+    () => ({
+      isFilesModalOpen,
+      openFilesModal,
+      closeFilesModal,
+      onFileUpload: handleFileUpload,
+      onRecentFileSelect: handleRecentFileSelect,
+      onModalClose,
+      setOnModalClose: setModalCloseCallback,
+    }),
+    [
+      isFilesModalOpen,
+      openFilesModal,
+      closeFilesModal,
+      handleFileUpload,
+      handleRecentFileSelect,
+      onModalClose,
+      setModalCloseCallback,
+    ],
+  );
 
   return (
     <FilesModalContext.Provider value={contextValue}>
@@ -365,7 +448,9 @@ export const FilesModalProvider: React.FC<{ children: React.ReactNode }> = ({ ch
 export const useFilesModalContext = () => {
   const context = useContext(FilesModalContext);
   if (!context) {
-    throw new Error('useFilesModalContext must be used within FilesModalProvider');
+    throw new Error(
+      "useFilesModalContext must be used within FilesModalProvider",
+    );
   }
   return context;
 };
diff --git a/frontend/src/core/contexts/HotkeyContext.tsx b/frontend/src/core/contexts/HotkeyContext.tsx
index c7d353c410..e8751b63a8 100644
--- a/frontend/src/core/contexts/HotkeyContext.tsx
+++ b/frontend/src/core/contexts/HotkeyContext.tsx
@@ -1,8 +1,24 @@
-import React, { createContext, useCallback, useContext, useEffect, useMemo, useState } from 'react';
-import { HotkeyBinding, bindingEquals, bindingMatchesEvent, deserializeBindings, getDisplayParts, isMacLike, normalizeBinding, serializeBindings } from '@app/utils/hotkeys';
-import { useToolWorkflow } from '@app/contexts/ToolWorkflowContext';
-import { ToolId } from '@app/types/toolId';
-import { ToolCategoryId, ToolRegistryEntry } from '@app/data/toolsTaxonomy';
+import React, {
+  createContext,
+  useCallback,
+  useContext,
+  useEffect,
+  useMemo,
+  useState,
+} from "react";
+import {
+  HotkeyBinding,
+  bindingEquals,
+  bindingMatchesEvent,
+  deserializeBindings,
+  getDisplayParts,
+  isMacLike,
+  normalizeBinding,
+  serializeBindings,
+} from "@app/utils/hotkeys";
+import { useToolWorkflow } from "@app/contexts/ToolWorkflowContext";
+import { ToolId } from "@app/types/toolId";
+import { ToolCategoryId, ToolRegistryEntry } from "@app/data/toolsTaxonomy";
 
 type Bindings = Partial<Record<ToolId, HotkeyBinding>>;
 
@@ -12,7 +28,10 @@ interface HotkeyContextValue {
   isMac: boolean;
   updateHotkey: (toolId: ToolId, binding: HotkeyBinding) => void;
   resetHotkey: (toolId: ToolId) => void;
-  isBindingAvailable: (binding: HotkeyBinding, excludeToolId?: ToolId) => boolean;
+  isBindingAvailable: (
+    binding: HotkeyBinding,
+    excludeToolId?: ToolId,
+  ) => boolean;
   pauseHotkeys: () => void;
   resumeHotkeys: () => void;
   areHotkeysPaused: boolean;
@@ -21,9 +40,12 @@ interface HotkeyContextValue {
 
 const HotkeyContext = createContext<HotkeyContextValue | undefined>(undefined);
 
-const STORAGE_KEY = 'stirlingpdf.hotkeys';
+const STORAGE_KEY = "stirlingpdf.hotkeys";
 
-const generateDefaultHotkeys = (toolEntries: [ToolId, ToolRegistryEntry][], macLike: boolean): Bindings => {
+const generateDefaultHotkeys = (
+  toolEntries: [ToolId, ToolRegistryEntry][],
+  macLike: boolean,
+): Bindings => {
   const defaults: Bindings = {};
 
   // Get Quick Access tools (RECOMMENDED_TOOLS category) from registry
@@ -33,7 +55,8 @@ const generateDefaultHotkeys = (toolEntries: [ToolId, ToolRegistryEntry][], macL
 
   // Assign Cmd+Option+Number (Mac) or Ctrl+Alt+Number (Windows) to Quick Access tools
   quickAccessTools.forEach((toolId, index) => {
-    if (index < 9) { // Limit to Digit1-9
+    if (index < 9) {
+      // Limit to Digit1-9
       const digitNumber = index + 1;
       defaults[toolId] = {
         code: `Digit${digitNumber}`,
@@ -53,37 +76,49 @@ const shouldIgnoreTarget = (target: EventTarget | null): boolean => {
   if (!target || !(target instanceof HTMLElement)) {
     return false;
   }
-  const editable = target.closest('input, textarea, [contenteditable="true"], [role="textbox"]');
+  const editable = target.closest(
+    'input, textarea, [contenteditable="true"], [role="textbox"]',
+  );
   return Boolean(editable);
 };
 
-export const HotkeyProvider: React.FC<{ children: React.ReactNode }> = ({ children }) => {
+export const HotkeyProvider: React.FC<{ children: React.ReactNode }> = ({
+  children,
+}) => {
   const { toolRegistry, handleToolSelect } = useToolWorkflow();
   const isMac = useMemo(() => isMacLike(), []);
   const [customBindings, setCustomBindings] = useState<Bindings>(() => {
-    if (typeof window === 'undefined') {
+    if (typeof window === "undefined") {
       return {};
     }
     return deserializeBindings(window.localStorage?.getItem(STORAGE_KEY));
   });
   const [areHotkeysPaused, setHotkeysPaused] = useState(false);
 
-  const toolEntries = useMemo(() => Object.entries(toolRegistry), [toolRegistry]) as [ToolId, ToolRegistryEntry][];
+  const toolEntries = useMemo(
+    () => Object.entries(toolRegistry),
+    [toolRegistry],
+  ) as [ToolId, ToolRegistryEntry][];
 
-  const defaults = useMemo(() => generateDefaultHotkeys(toolEntries, isMac), [toolRegistry, isMac]);
+  const defaults = useMemo(
+    () => generateDefaultHotkeys(toolEntries, isMac),
+    [toolRegistry, isMac],
+  );
 
   // Remove bindings for tools that are no longer present
   useEffect(() => {
-    setCustomBindings(prev => {
+    setCustomBindings((prev) => {
       const next: Bindings = {};
       let changed = false;
-      (Object.entries(prev) as [ToolId, HotkeyBinding][]).forEach(([toolId, binding]) => {
-        if (toolRegistry[toolId]) {
-          next[toolId] = binding;
-        } else {
-          changed = true;
-        }
-      });
+      (Object.entries(prev) as [ToolId, HotkeyBinding][]).forEach(
+        ([toolId, binding]) => {
+          if (toolRegistry[toolId]) {
+            next[toolId] = binding;
+          } else {
+            changed = true;
+          }
+        },
+      );
       return changed ? next : prev;
     });
   }, [toolRegistry]);
@@ -106,38 +141,44 @@ export const HotkeyProvider: React.FC<{ children: React.ReactNode }> = ({ childr
   }, [customBindings, defaults, toolEntries]);
 
   useEffect(() => {
-    if (typeof window === 'undefined') {
+    if (typeof window === "undefined") {
       return;
     }
     window.localStorage.setItem(STORAGE_KEY, serializeBindings(customBindings));
   }, [customBindings]);
 
-  const isBindingAvailable = useCallback((binding: HotkeyBinding, excludeToolId?: ToolId) => {
-    const normalized = normalizeBinding(binding);
-    return Object.entries(resolved).every(([toolId, existing]) => {
-      if (toolId === excludeToolId) {
-        return true;
-      }
-      return !bindingEquals(existing, normalized);
-    });
-  }, [resolved]);
-
-  const updateHotkey = useCallback((toolId: ToolId, binding: HotkeyBinding) => {
-    setCustomBindings(prev => {
+  const isBindingAvailable = useCallback(
+    (binding: HotkeyBinding, excludeToolId?: ToolId) => {
       const normalized = normalizeBinding(binding);
-      const defaultsForTool = defaults[toolId];
-      const next = { ...prev };
-      if (defaultsForTool && bindingEquals(defaultsForTool, normalized)) {
-        delete next[toolId];
-      } else {
-        next[toolId] = normalized;
-      }
-      return next;
-    });
-  }, [defaults]);
+      return Object.entries(resolved).every(([toolId, existing]) => {
+        if (toolId === excludeToolId) {
+          return true;
+        }
+        return !bindingEquals(existing, normalized);
+      });
+    },
+    [resolved],
+  );
+
+  const updateHotkey = useCallback(
+    (toolId: ToolId, binding: HotkeyBinding) => {
+      setCustomBindings((prev) => {
+        const normalized = normalizeBinding(binding);
+        const defaultsForTool = defaults[toolId];
+        const next = { ...prev };
+        if (defaultsForTool && bindingEquals(defaultsForTool, normalized)) {
+          delete next[toolId];
+        } else {
+          next[toolId] = normalized;
+        }
+        return next;
+      });
+    },
+    [defaults],
+  );
 
   const resetHotkey = useCallback((toolId: ToolId) => {
-    setCustomBindings(prev => {
+    setCustomBindings((prev) => {
       if (!(toolId in prev)) {
         return prev;
       }
@@ -170,24 +211,37 @@ export const HotkeyProvider: React.FC<{ children: React.ReactNode }> = ({ childr
       }
     };
 
-    window.addEventListener('keydown', handler, true);
+    window.addEventListener("keydown", handler, true);
     return () => {
-      window.removeEventListener('keydown', handler, true);
+      window.removeEventListener("keydown", handler, true);
     };
   }, [resolved, areHotkeysPaused, handleToolSelect]);
 
-  const contextValue = useMemo<HotkeyContextValue>(() => ({
-    hotkeys: resolved,
-    defaults,
-    isMac,
-    updateHotkey,
-    resetHotkey,
-    isBindingAvailable,
-    pauseHotkeys,
-    resumeHotkeys,
-    areHotkeysPaused,
-    getDisplayParts: (binding) => getDisplayParts(binding ?? null, isMac),
-  }), [resolved, defaults, isMac, updateHotkey, resetHotkey, isBindingAvailable, pauseHotkeys, resumeHotkeys, areHotkeysPaused]);
+  const contextValue = useMemo<HotkeyContextValue>(
+    () => ({
+      hotkeys: resolved,
+      defaults,
+      isMac,
+      updateHotkey,
+      resetHotkey,
+      isBindingAvailable,
+      pauseHotkeys,
+      resumeHotkeys,
+      areHotkeysPaused,
+      getDisplayParts: (binding) => getDisplayParts(binding ?? null, isMac),
+    }),
+    [
+      resolved,
+      defaults,
+      isMac,
+      updateHotkey,
+      resetHotkey,
+      isBindingAvailable,
+      pauseHotkeys,
+      resumeHotkeys,
+      areHotkeysPaused,
+    ],
+  );
 
   return (
     <HotkeyContext.Provider value={contextValue}>
@@ -199,7 +253,7 @@ export const HotkeyProvider: React.FC<{ children: React.ReactNode }> = ({ childr
 export const useHotkeys = (): HotkeyContextValue => {
   const context = useContext(HotkeyContext);
   if (!context) {
-    throw new Error('useHotkeys must be used within a HotkeyProvider');
+    throw new Error("useHotkeys must be used within a HotkeyProvider");
   }
   return context;
 };
diff --git a/frontend/src/core/contexts/IndexedDBContext.tsx b/frontend/src/core/contexts/IndexedDBContext.tsx
index 4a29cd97ed..e2c8315aa0 100644
--- a/frontend/src/core/contexts/IndexedDBContext.tsx
+++ b/frontend/src/core/contexts/IndexedDBContext.tsx
@@ -3,17 +3,25 @@
  * Integrates with FileContext to provide transparent file persistence
  */
 
-import React, { createContext, useContext, useCallback, useRef } from 'react';
-import { fileStorage } from '@app/services/fileStorage';
-import { FileId } from '@app/types/file';
-import { StirlingFileStub, createStirlingFile, createQuickKey } from '@app/types/fileContext';
-import { generateThumbnailForFile } from '@app/utils/thumbnailUtils';
+import React, { createContext, useContext, useCallback, useRef } from "react";
+import { fileStorage } from "@app/services/fileStorage";
+import { FileId } from "@app/types/file";
+import {
+  StirlingFileStub,
+  createStirlingFile,
+  createQuickKey,
+} from "@app/types/fileContext";
+import { generateThumbnailForFile } from "@app/utils/thumbnailUtils";
 
-const DEBUG = process.env.NODE_ENV === 'development';
+const DEBUG = process.env.NODE_ENV === "development";
 
 interface IndexedDBContextValue {
   // Core CRUD operations
-  saveFile: (file: File, fileId: FileId, existingThumbnail?: string) => Promise<StirlingFileStub>;
+  saveFile: (
+    file: File,
+    fileId: FileId,
+    existingThumbnail?: string,
+  ) => Promise<StirlingFileStub>;
   loadFile: (fileId: FileId) => Promise<File | null>;
   loadMetadata: (fileId: FileId) => Promise<StirlingFileStub | null>;
   deleteFile: (fileId: FileId) => Promise<void>;
@@ -25,7 +33,11 @@ interface IndexedDBContextValue {
   clearAll: () => Promise<void>;
 
   // Utilities
-  getStorageStats: () => Promise<{ used: number; available: number; fileCount: number }>;
+  getStorageStats: () => Promise<{
+    used: number;
+    available: number;
+    fileCount: number;
+  }>;
   updateThumbnail: (fileId: FileId, thumbnail: string) => Promise<boolean>;
   markFileAsProcessed: (fileId: FileId) => Promise<boolean>;
 }
@@ -38,7 +50,9 @@ interface IndexedDBProviderProps {
 
 export function IndexedDBProvider({ children }: IndexedDBProviderProps) {
   // LRU File cache to avoid repeated ArrayBuffer→File conversions
-  const fileCache = useRef(new Map<FileId, { file: File; lastAccessed: number }>());
+  const fileCache = useRef(
+    new Map<FileId, { file: File; lastAccessed: number }>(),
+  );
   const MAX_CACHE_SIZE = 50; // Maximum number of files to cache
 
   // LRU cache management
@@ -46,8 +60,9 @@ export function IndexedDBProvider({ children }: IndexedDBProviderProps) {
     if (fileCache.current.size <= MAX_CACHE_SIZE) return;
 
     // Convert to array and sort by last accessed time (oldest first)
-    const entries = Array.from(fileCache.current.entries())
-      .sort(([, a], [, b]) => a.lastAccessed - b.lastAccessed);
+    const entries = Array.from(fileCache.current.entries()).sort(
+      ([, a], [, b]) => a.lastAccessed - b.lastAccessed,
+    );
 
     // Remove the least recently used entries
     const toRemove = entries.slice(0, fileCache.current.size - MAX_CACHE_SIZE);
@@ -58,71 +73,87 @@ export function IndexedDBProvider({ children }: IndexedDBProviderProps) {
     if (DEBUG) console.log(`🗂� Evicted ${toRemove.length} LRU cache entries`);
   }, []);
 
-  const saveFile = useCallback(async (file: File, fileId: FileId, existingThumbnail?: string): Promise<StirlingFileStub> => {
-    // Use existing thumbnail or generate new one if none provided
-    const thumbnail = existingThumbnail || await generateThumbnailForFile(file);
+  const saveFile = useCallback(
+    async (
+      file: File,
+      fileId: FileId,
+      existingThumbnail?: string,
+    ): Promise<StirlingFileStub> => {
+      // Use existing thumbnail or generate new one if none provided
+      const thumbnail =
+        existingThumbnail || (await generateThumbnailForFile(file));
 
-    // Store in IndexedDB (no history data - that's handled by direct fileStorage calls now)
-    const stirlingFile = createStirlingFile(file, fileId);
+      // Store in IndexedDB (no history data - that's handled by direct fileStorage calls now)
+      const stirlingFile = createStirlingFile(file, fileId);
 
-    // Create minimal stub for storage
-    const stub: StirlingFileStub = {
-      id: fileId,
-      name: file.name,
-      size: file.size,
-      type: file.type,
-      lastModified: file.lastModified,
-      quickKey: createQuickKey(file),
-      thumbnailUrl: thumbnail,
-      isLeaf: true,
-      createdAt: Date.now(),
-      versionNumber: 1,
-      originalFileId: fileId,
-      toolHistory: []
-    };
+      // Create minimal stub for storage
+      const stub: StirlingFileStub = {
+        id: fileId,
+        name: file.name,
+        size: file.size,
+        type: file.type,
+        lastModified: file.lastModified,
+        quickKey: createQuickKey(file),
+        thumbnailUrl: thumbnail,
+        isLeaf: true,
+        createdAt: Date.now(),
+        versionNumber: 1,
+        originalFileId: fileId,
+        toolHistory: [],
+      };
 
-    await fileStorage.storeStirlingFile(stirlingFile, stub);
-    const storedFile = await fileStorage.getStirlingFileStub(fileId);
+      await fileStorage.storeStirlingFile(stirlingFile, stub);
+      const storedFile = await fileStorage.getStirlingFileStub(fileId);
 
-    // Cache the file object for immediate reuse
-    fileCache.current.set(fileId, { file, lastAccessed: Date.now() });
-    evictLRUEntries();
+      // Cache the file object for immediate reuse
+      fileCache.current.set(fileId, { file, lastAccessed: Date.now() });
+      evictLRUEntries();
 
-    // Return StirlingFileStub from the stored file (no conversion needed)
-    if (!storedFile) {
-      throw new Error(`Failed to retrieve stored file after saving: ${file.name}`);
-    }
+      // Return StirlingFileStub from the stored file (no conversion needed)
+      if (!storedFile) {
+        throw new Error(
+          `Failed to retrieve stored file after saving: ${file.name}`,
+        );
+      }
 
-    return storedFile;
-  }, []);
+      return storedFile;
+    },
+    [],
+  );
 
-  const loadFile = useCallback(async (fileId: FileId): Promise<File | null> => {
-    // Check cache first
-    const cached = fileCache.current.get(fileId);
-    if (cached) {
-      // Update last accessed time for LRU
-      cached.lastAccessed = Date.now();
-      return cached.file;
-    }
+  const loadFile = useCallback(
+    async (fileId: FileId): Promise<File | null> => {
+      // Check cache first
+      const cached = fileCache.current.get(fileId);
+      if (cached) {
+        // Update last accessed time for LRU
+        cached.lastAccessed = Date.now();
+        return cached.file;
+      }
 
-    // Load from IndexedDB
-    const storedFile = await fileStorage.getStirlingFile(fileId);
-    if (!storedFile) return null;
+      // Load from IndexedDB
+      const storedFile = await fileStorage.getStirlingFile(fileId);
+      if (!storedFile) return null;
 
-    // StirlingFile is already a File object, no reconstruction needed
-    const file = storedFile;
+      // StirlingFile is already a File object, no reconstruction needed
+      const file = storedFile;
 
-    // Cache for future use with LRU eviction
-    fileCache.current.set(fileId, { file, lastAccessed: Date.now() });
-    evictLRUEntries();
+      // Cache for future use with LRU eviction
+      fileCache.current.set(fileId, { file, lastAccessed: Date.now() });
+      evictLRUEntries();
 
-    return file;
-  }, [evictLRUEntries]);
+      return file;
+    },
+    [evictLRUEntries],
+  );
 
-  const loadMetadata = useCallback(async (fileId: FileId): Promise<StirlingFileStub | null> => {
-    // Load stub directly from storage service
-    return await fileStorage.getStirlingFileStub(fileId);
-  }, []);
+  const loadMetadata = useCallback(
+    async (fileId: FileId): Promise<StirlingFileStub | null> => {
+      // Load stub directly from storage service
+      return await fileStorage.getStirlingFileStub(fileId);
+    },
+    [],
+  );
 
   const deleteFile = useCallback(async (fileId: FileId): Promise<void> => {
     // Remove from cache
@@ -132,12 +163,13 @@ export function IndexedDBProvider({ children }: IndexedDBProviderProps) {
     await fileStorage.deleteStirlingFile(fileId);
   }, []);
 
-  const loadLeafMetadata = useCallback(async (): Promise<StirlingFileStub[]> => {
+  const loadLeafMetadata = useCallback(async (): Promise<
+    StirlingFileStub[]
+  > => {
     const metadata = await fileStorage.getLeafStirlingFileStubs(); // Only get leaf files
 
     // All files are already StirlingFileStub objects, no processing needed
     return metadata;
-
   }, []);
 
   const loadAllMetadata = useCallback(async (): Promise<StirlingFileStub[]> => {
@@ -147,13 +179,18 @@ export function IndexedDBProvider({ children }: IndexedDBProviderProps) {
     return metadata;
   }, []);
 
-  const deleteMultiple = useCallback(async (fileIds: FileId[]): Promise<void> => {
-    // Remove from cache
-    fileIds.forEach(id => fileCache.current.delete(id));
+  const deleteMultiple = useCallback(
+    async (fileIds: FileId[]): Promise<void> => {
+      // Remove from cache
+      fileIds.forEach((id) => fileCache.current.delete(id));
 
-    // Remove from IndexedDB in parallel
-    await Promise.all(fileIds.map(id => fileStorage.deleteStirlingFile(id)));
-  }, []);
+      // Remove from IndexedDB in parallel
+      await Promise.all(
+        fileIds.map((id) => fileStorage.deleteStirlingFile(id)),
+      );
+    },
+    [],
+  );
 
   const clearAll = useCallback(async (): Promise<void> => {
     // Clear cache
@@ -167,13 +204,19 @@ export function IndexedDBProvider({ children }: IndexedDBProviderProps) {
     return await fileStorage.getStorageStats();
   }, []);
 
-  const updateThumbnail = useCallback(async (fileId: FileId, thumbnail: string): Promise<boolean> => {
-    return await fileStorage.updateThumbnail(fileId, thumbnail);
-  }, []);
+  const updateThumbnail = useCallback(
+    async (fileId: FileId, thumbnail: string): Promise<boolean> => {
+      return await fileStorage.updateThumbnail(fileId, thumbnail);
+    },
+    [],
+  );
 
-  const markFileAsProcessed = useCallback(async (fileId: FileId): Promise<boolean> => {
-    return await fileStorage.markFileAsProcessed(fileId);
-  }, []);
+  const markFileAsProcessed = useCallback(
+    async (fileId: FileId): Promise<boolean> => {
+      return await fileStorage.markFileAsProcessed(fileId);
+    },
+    [],
+  );
 
   const value: IndexedDBContextValue = {
     saveFile,
@@ -186,7 +229,7 @@ export function IndexedDBProvider({ children }: IndexedDBProviderProps) {
     clearAll,
     getStorageStats,
     updateThumbnail,
-    markFileAsProcessed
+    markFileAsProcessed,
   };
 
   return (
@@ -199,7 +242,7 @@ export function IndexedDBProvider({ children }: IndexedDBProviderProps) {
 export function useIndexedDB() {
   const context = useContext(IndexedDBContext);
   if (!context) {
-    throw new Error('useIndexedDB must be used within an IndexedDBProvider');
+    throw new Error("useIndexedDB must be used within an IndexedDBProvider");
   }
   return context;
 }
diff --git a/frontend/src/core/contexts/NavigationContext.tsx b/frontend/src/core/contexts/NavigationContext.tsx
index 7485821b34..ae1ee43e0d 100644
--- a/frontend/src/core/contexts/NavigationContext.tsx
+++ b/frontend/src/core/contexts/NavigationContext.tsx
@@ -1,7 +1,14 @@
-import React, { createContext, useContext, useReducer, useCallback, useMemo } from 'react';
-import { WorkbenchType, getDefaultWorkbench } from '@app/types/workbench';
-import { ToolId, isValidToolId } from '@app/types/toolId';
-import { useToolRegistry } from '@app/contexts/ToolRegistryContext';
+import React, {
+  createContext,
+  useContext,
+  useReducer,
+  useCallback,
+  useMemo,
+  useRef,
+} from "react";
+import { WorkbenchType, getDefaultWorkbench } from "@app/types/workbench";
+import { ToolId, isValidToolId } from "@app/types/toolId";
+import { useToolRegistry } from "@app/contexts/ToolRegistryContext";
 
 /**
  * NavigationContext - Complete navigation management system
@@ -22,36 +29,45 @@ interface NavigationContextState {
 
 // Navigation actions
 type NavigationAction =
-  | { type: 'SET_WORKBENCH'; payload: { workbench: WorkbenchType } }
-  | { type: 'SET_SELECTED_TOOL'; payload: { toolId: ToolId | null } }
-  | { type: 'SET_TOOL_AND_WORKBENCH'; payload: { toolId: ToolId | null; workbench: WorkbenchType } }
-  | { type: 'SET_UNSAVED_CHANGES'; payload: { hasChanges: boolean } }
-  | { type: 'SET_PENDING_NAVIGATION'; payload: { navigationFn: (() => void) | null } }
-  | { type: 'SHOW_NAVIGATION_WARNING'; payload: { show: boolean } };
+  | { type: "SET_WORKBENCH"; payload: { workbench: WorkbenchType } }
+  | { type: "SET_SELECTED_TOOL"; payload: { toolId: ToolId | null } }
+  | {
+      type: "SET_TOOL_AND_WORKBENCH";
+      payload: { toolId: ToolId | null; workbench: WorkbenchType };
+    }
+  | { type: "SET_UNSAVED_CHANGES"; payload: { hasChanges: boolean } }
+  | {
+      type: "SET_PENDING_NAVIGATION";
+      payload: { navigationFn: (() => void) | null };
+    }
+  | { type: "SHOW_NAVIGATION_WARNING"; payload: { show: boolean } };
 
 // Navigation reducer
-const navigationReducer = (state: NavigationContextState, action: NavigationAction): NavigationContextState => {
+const navigationReducer = (
+  state: NavigationContextState,
+  action: NavigationAction,
+): NavigationContextState => {
   switch (action.type) {
-    case 'SET_WORKBENCH':
+    case "SET_WORKBENCH":
       return { ...state, workbench: action.payload.workbench };
 
-    case 'SET_SELECTED_TOOL':
+    case "SET_SELECTED_TOOL":
       return { ...state, selectedTool: action.payload.toolId };
 
-    case 'SET_TOOL_AND_WORKBENCH':
+    case "SET_TOOL_AND_WORKBENCH":
       return {
         ...state,
         selectedTool: action.payload.toolId,
-        workbench: action.payload.workbench
+        workbench: action.payload.workbench,
       };
 
-    case 'SET_UNSAVED_CHANGES':
+    case "SET_UNSAVED_CHANGES":
       return { ...state, hasUnsavedChanges: action.payload.hasChanges };
 
-    case 'SET_PENDING_NAVIGATION':
+    case "SET_PENDING_NAVIGATION":
       return { ...state, pendingNavigation: action.payload.navigationFn };
 
-    case 'SHOW_NAVIGATION_WARNING':
+    case "SHOW_NAVIGATION_WARNING":
       return { ...state, showNavigationWarning: action.payload.show };
 
     default:
@@ -65,14 +81,24 @@ const initialState: NavigationContextState = {
   selectedTool: null,
   hasUnsavedChanges: false,
   pendingNavigation: null,
-  showNavigationWarning: false
+  showNavigationWarning: false,
 };
 
+// Handlers that editors register for the navigation warning modal
+export interface NavigationWarningHandlers {
+  onApplyAndContinue?: () => Promise<void>;
+  onExportAndContinue?: () => Promise<void>;
+  onDiscardAndContinue?: () => Promise<void>;
+}
+
 // Navigation context actions interface
 export interface NavigationContextActions {
   setWorkbench: (workbench: WorkbenchType) => void;
   setSelectedTool: (toolId: ToolId | null) => void;
-  setToolAndWorkbench: (toolId: ToolId | null, workbench: WorkbenchType) => void;
+  setToolAndWorkbench: (
+    toolId: ToolId | null,
+    workbench: WorkbenchType,
+  ) => void;
   setHasUnsavedChanges: (hasChanges: boolean) => void;
   registerUnsavedChangesChecker: (checker: () => boolean) => void;
   unregisterUnsavedChangesChecker: () => void;
@@ -82,6 +108,11 @@ export interface NavigationContextActions {
   cancelNavigation: () => void;
   clearToolSelection: () => void;
   handleToolSelect: (toolId: string) => void;
+  registerNavigationWarningHandlers: (
+    handlers: NavigationWarningHandlers,
+  ) => void;
+  unregisterNavigationWarningHandlers: () => void;
+  navigationWarningHandlersRef: React.RefObject<NavigationWarningHandlers | null>;
 }
 
 // Context state values
@@ -98,8 +129,12 @@ export interface NavigationContextActionsValue {
 }
 
 // Create contexts
-const NavigationStateContext = createContext<NavigationContextStateValue | undefined>(undefined);
-const NavigationActionsContext = createContext<NavigationContextActionsValue | undefined>(undefined);
+const NavigationStateContext = createContext<
+  NavigationContextStateValue | undefined
+>(undefined);
+const NavigationActionsContext = createContext<
+  NavigationContextActionsValue | undefined
+>(undefined);
 
 // Provider component
 export const NavigationProvider: React.FC<{
@@ -109,201 +144,308 @@ export const NavigationProvider: React.FC<{
   const [state, dispatch] = useReducer(navigationReducer, initialState);
   const { allTools: toolRegistry } = useToolRegistry();
   const unsavedChangesCheckerRef = React.useRef<(() => boolean) | null>(null);
+  const navigationWarningHandlersRef = useRef<NavigationWarningHandlers | null>(
+    null,
+  );
 
   // Memoize individual callbacks
-  const setWorkbench = useCallback((workbench: WorkbenchType) => {
+  const setWorkbench = useCallback(
+    (workbench: WorkbenchType) => {
       // Check for unsaved changes using registered checker or state
-      const hasUnsavedChanges = unsavedChangesCheckerRef.current?.() || state.hasUnsavedChanges;
-      console.log('[NavigationContext] setWorkbench:', {
+      const hasUnsavedChanges =
+        unsavedChangesCheckerRef.current?.() || state.hasUnsavedChanges;
+      console.log("[NavigationContext] setWorkbench:", {
         from: state.workbench,
         to: workbench,
         hasChecker: !!unsavedChangesCheckerRef.current,
-        hasUnsavedChanges
+        hasUnsavedChanges,
       });
 
       // If we're leaving pageEditor, viewer, or custom workbench and have unsaved changes, request navigation
       const leavingWorkbenchWithChanges =
-        (state.workbench === 'pageEditor' && workbench !== 'pageEditor' && hasUnsavedChanges) ||
-        (state.workbench === 'viewer' && workbench !== 'viewer' && hasUnsavedChanges) ||
-        (state.workbench.startsWith('custom:') && workbench !== state.workbench && hasUnsavedChanges);
+        (state.workbench === "pageEditor" &&
+          workbench !== "pageEditor" &&
+          hasUnsavedChanges) ||
+        (state.workbench === "viewer" &&
+          workbench !== "viewer" &&
+          hasUnsavedChanges) ||
+        (state.workbench.startsWith("custom:") &&
+          workbench !== state.workbench &&
+          hasUnsavedChanges);
 
       if (leavingWorkbenchWithChanges) {
         // Update state to reflect unsaved changes so modal knows
         if (!state.hasUnsavedChanges) {
-          dispatch({ type: 'SET_UNSAVED_CHANGES', payload: { hasChanges: true } });
+          dispatch({
+            type: "SET_UNSAVED_CHANGES",
+            payload: { hasChanges: true },
+          });
         }
         const performWorkbenchChange = () => {
           // When leaving a custom workbench, clear the selected tool
-          console.log('[NavigationContext] performWorkbenchChange executing', {
+          console.log("[NavigationContext] performWorkbenchChange executing", {
             from: state.workbench,
             to: workbench,
-            isCustom: state.workbench.startsWith('custom:')
+            isCustom: state.workbench.startsWith("custom:"),
           });
-          if (state.workbench.startsWith('custom:')) {
-            console.log('[NavigationContext] Clearing tool and changing workbench to:', workbench);
-            dispatch({ type: 'SET_TOOL_AND_WORKBENCH', payload: { toolId: null, workbench } });
+          if (state.workbench.startsWith("custom:")) {
+            console.log(
+              "[NavigationContext] Clearing tool and changing workbench to:",
+              workbench,
+            );
+            dispatch({
+              type: "SET_TOOL_AND_WORKBENCH",
+              payload: { toolId: null, workbench },
+            });
           } else {
-            console.log('[NavigationContext] Just changing workbench to:', workbench);
-            dispatch({ type: 'SET_WORKBENCH', payload: { workbench } });
+            console.log(
+              "[NavigationContext] Just changing workbench to:",
+              workbench,
+            );
+            dispatch({ type: "SET_WORKBENCH", payload: { workbench } });
           }
         };
-        dispatch({ type: 'SET_PENDING_NAVIGATION', payload: { navigationFn: performWorkbenchChange } });
-        dispatch({ type: 'SHOW_NAVIGATION_WARNING', payload: { show: true } });
+        dispatch({
+          type: "SET_PENDING_NAVIGATION",
+          payload: { navigationFn: performWorkbenchChange },
+        });
+        dispatch({ type: "SHOW_NAVIGATION_WARNING", payload: { show: true } });
       } else {
-        dispatch({ type: 'SET_WORKBENCH', payload: { workbench } });
+        dispatch({ type: "SET_WORKBENCH", payload: { workbench } });
       }
-    }, [state.workbench, state.hasUnsavedChanges]);
+    },
+    [state.workbench, state.hasUnsavedChanges],
+  );
 
-    const setSelectedTool = useCallback((toolId: ToolId | null) => {
-      dispatch({ type: 'SET_SELECTED_TOOL', payload: { toolId } });
-    }, []);
+  const setSelectedTool = useCallback((toolId: ToolId | null) => {
+    dispatch({ type: "SET_SELECTED_TOOL", payload: { toolId } });
+  }, []);
 
-    const setToolAndWorkbench = useCallback((toolId: ToolId | null, workbench: WorkbenchType) => {
+  const setToolAndWorkbench = useCallback(
+    (toolId: ToolId | null, workbench: WorkbenchType) => {
       // Check for unsaved changes using registered checker or state
-      const hasUnsavedChanges = unsavedChangesCheckerRef.current?.() || state.hasUnsavedChanges;
+      const hasUnsavedChanges =
+        unsavedChangesCheckerRef.current?.() || state.hasUnsavedChanges;
 
       // If we're leaving pageEditor, viewer, or custom workbench and have unsaved changes, request navigation
       const leavingWorkbenchWithChanges =
-        (state.workbench === 'pageEditor' && workbench !== 'pageEditor' && hasUnsavedChanges) ||
-        (state.workbench === 'viewer' && workbench !== 'viewer' && hasUnsavedChanges) ||
-        (state.workbench.startsWith('custom:') && workbench !== state.workbench && hasUnsavedChanges);
+        (state.workbench === "pageEditor" &&
+          workbench !== "pageEditor" &&
+          hasUnsavedChanges) ||
+        (state.workbench === "viewer" &&
+          workbench !== "viewer" &&
+          hasUnsavedChanges) ||
+        (state.workbench.startsWith("custom:") &&
+          workbench !== state.workbench &&
+          hasUnsavedChanges);
 
       if (leavingWorkbenchWithChanges) {
         const performWorkbenchChange = () => {
-          dispatch({ type: 'SET_TOOL_AND_WORKBENCH', payload: { toolId, workbench } });
+          dispatch({
+            type: "SET_TOOL_AND_WORKBENCH",
+            payload: { toolId, workbench },
+          });
         };
-        dispatch({ type: 'SET_PENDING_NAVIGATION', payload: { navigationFn: performWorkbenchChange } });
-        dispatch({ type: 'SHOW_NAVIGATION_WARNING', payload: { show: true } });
+        dispatch({
+          type: "SET_PENDING_NAVIGATION",
+          payload: { navigationFn: performWorkbenchChange },
+        });
+        dispatch({ type: "SHOW_NAVIGATION_WARNING", payload: { show: true } });
       } else {
-        dispatch({ type: 'SET_TOOL_AND_WORKBENCH', payload: { toolId, workbench } });
+        dispatch({
+          type: "SET_TOOL_AND_WORKBENCH",
+          payload: { toolId, workbench },
+        });
       }
-    }, [state.workbench, state.hasUnsavedChanges]);
+    },
+    [state.workbench, state.hasUnsavedChanges],
+  );
 
-    const setHasUnsavedChanges = useCallback((hasChanges: boolean) => {
-      dispatch({ type: 'SET_UNSAVED_CHANGES', payload: { hasChanges } });
-    }, []);
+  const setHasUnsavedChanges = useCallback((hasChanges: boolean) => {
+    dispatch({ type: "SET_UNSAVED_CHANGES", payload: { hasChanges } });
+  }, []);
 
-    const registerUnsavedChangesChecker = useCallback((checker: () => boolean) => {
+  const registerUnsavedChangesChecker = useCallback(
+    (checker: () => boolean) => {
       unsavedChangesCheckerRef.current = checker;
-    }, []);
+    },
+    [],
+  );
 
-    const unregisterUnsavedChangesChecker = useCallback(() => {
-      unsavedChangesCheckerRef.current = null;
-    }, []);
+  const unregisterUnsavedChangesChecker = useCallback(() => {
+    unsavedChangesCheckerRef.current = null;
+  }, []);
 
-    const showNavigationWarning = useCallback((show: boolean) => {
-      dispatch({ type: 'SHOW_NAVIGATION_WARNING', payload: { show } });
-    }, []);
+  const registerNavigationWarningHandlers = useCallback(
+    (handlers: NavigationWarningHandlers) => {
+      navigationWarningHandlersRef.current = handlers;
+    },
+    [],
+  );
 
-    const requestNavigation = useCallback((navigationFn: () => void) => {
+  const unregisterNavigationWarningHandlers = useCallback(() => {
+    navigationWarningHandlersRef.current = null;
+  }, []);
+
+  const showNavigationWarning = useCallback((show: boolean) => {
+    dispatch({ type: "SHOW_NAVIGATION_WARNING", payload: { show } });
+  }, []);
+
+  const requestNavigation = useCallback(
+    (navigationFn: () => void) => {
       if (!state.hasUnsavedChanges) {
         navigationFn();
         return;
       }
 
-      dispatch({ type: 'SET_PENDING_NAVIGATION', payload: { navigationFn } });
-      dispatch({ type: 'SHOW_NAVIGATION_WARNING', payload: { show: true } });
-    }, [state.hasUnsavedChanges]);
+      dispatch({ type: "SET_PENDING_NAVIGATION", payload: { navigationFn } });
+      dispatch({ type: "SHOW_NAVIGATION_WARNING", payload: { show: true } });
+    },
+    [state.hasUnsavedChanges],
+  );
 
-    const confirmNavigation = useCallback(() => {
-      console.log('[NavigationContext] confirmNavigation called', {
-        hasPendingNav: !!state.pendingNavigation,
-        currentWorkbench: state.workbench,
-        currentTool: state.selectedTool
-      });
-      if (state.pendingNavigation) {
-        state.pendingNavigation();
-      }
+  const confirmNavigation = useCallback(() => {
+    console.log("[NavigationContext] confirmNavigation called", {
+      hasPendingNav: !!state.pendingNavigation,
+      currentWorkbench: state.workbench,
+      currentTool: state.selectedTool,
+    });
+    if (state.pendingNavigation) {
+      state.pendingNavigation();
+    }
 
-      dispatch({ type: 'SET_PENDING_NAVIGATION', payload: { navigationFn: null } });
-      dispatch({ type: 'SHOW_NAVIGATION_WARNING', payload: { show: false } });
-      console.log('[NavigationContext] confirmNavigation completed');
-    }, [state.pendingNavigation, state.workbench, state.selectedTool]);
+    dispatch({
+      type: "SET_PENDING_NAVIGATION",
+      payload: { navigationFn: null },
+    });
+    dispatch({ type: "SHOW_NAVIGATION_WARNING", payload: { show: false } });
+    console.log("[NavigationContext] confirmNavigation completed");
+  }, [state.pendingNavigation, state.workbench, state.selectedTool]);
 
-    const cancelNavigation = useCallback(() => {
-      dispatch({ type: 'SET_PENDING_NAVIGATION', payload: { navigationFn: null } });
-      dispatch({ type: 'SHOW_NAVIGATION_WARNING', payload: { show: false } });
-    }, []);
+  const cancelNavigation = useCallback(() => {
+    dispatch({
+      type: "SET_PENDING_NAVIGATION",
+      payload: { navigationFn: null },
+    });
+    dispatch({ type: "SHOW_NAVIGATION_WARNING", payload: { show: false } });
+  }, []);
 
-    const clearToolSelection = useCallback(() => {
-      dispatch({ type: 'SET_TOOL_AND_WORKBENCH', payload: { toolId: null, workbench: getDefaultWorkbench() } });
-    }, []);
+  const clearToolSelection = useCallback(() => {
+    dispatch({
+      type: "SET_TOOL_AND_WORKBENCH",
+      payload: { toolId: null, workbench: getDefaultWorkbench() },
+    });
+  }, []);
 
-    const handleToolSelect = useCallback((toolId: string) => {
+  const handleToolSelect = useCallback(
+    (toolId: string) => {
       const performToolSelect = () => {
-        if (toolId === 'allTools') {
-          dispatch({ type: 'SET_TOOL_AND_WORKBENCH', payload: { toolId: null, workbench: getDefaultWorkbench() } });
+        if (toolId === "allTools") {
+          dispatch({
+            type: "SET_TOOL_AND_WORKBENCH",
+            payload: { toolId: null, workbench: getDefaultWorkbench() },
+          });
           return;
         }
 
-        if (toolId === 'read' || toolId === 'view-pdf') {
-          dispatch({ type: 'SET_TOOL_AND_WORKBENCH', payload: { toolId: null, workbench: 'viewer' } });
+        if (toolId === "read" || toolId === "view-pdf") {
+          dispatch({
+            type: "SET_TOOL_AND_WORKBENCH",
+            payload: { toolId: null, workbench: "viewer" },
+          });
           return;
         }
 
-        // Look up the tool in the registry to get its proper workbench
-        const tool = isValidToolId(toolId)? toolRegistry[toolId] : null;
-        const workbench = tool ? (tool.workbench || getDefaultWorkbench()) : getDefaultWorkbench();
+        // Look up the tool in the registry to get its proper workbench.
+        // Regular tools have no workbench preference — keep the current view so
+        // opening a tool doesn't unexpectedly switch the user to the viewer.
+        const tool = isValidToolId(toolId) ? toolRegistry[toolId] : null;
+        const workbench =
+          tool && tool.workbench ? tool.workbench : state.workbench;
 
         // Validate toolId and convert to ToolId type
         const validToolId = isValidToolId(toolId) ? toolId : null;
-        dispatch({ type: 'SET_TOOL_AND_WORKBENCH', payload: { toolId: validToolId, workbench } });
+        dispatch({
+          type: "SET_TOOL_AND_WORKBENCH",
+          payload: { toolId: validToolId, workbench },
+        });
       };
 
       // Check for unsaved changes using registered checker or state
-      const hasUnsavedChanges = unsavedChangesCheckerRef.current?.() || state.hasUnsavedChanges;
-      
+      const hasUnsavedChanges =
+        unsavedChangesCheckerRef.current?.() || state.hasUnsavedChanges;
+
       // If switching away from current tool and have unsaved changes, show warning
-      if (hasUnsavedChanges && state.selectedTool && state.selectedTool !== toolId) {
-        dispatch({ type: 'SET_PENDING_NAVIGATION', payload: { navigationFn: performToolSelect } });
-        dispatch({ type: 'SHOW_NAVIGATION_WARNING', payload: { show: true } });
+      if (
+        hasUnsavedChanges &&
+        state.selectedTool &&
+        state.selectedTool !== toolId
+      ) {
+        dispatch({
+          type: "SET_PENDING_NAVIGATION",
+          payload: { navigationFn: performToolSelect },
+        });
+        dispatch({ type: "SHOW_NAVIGATION_WARNING", payload: { show: true } });
       } else {
         performToolSelect();
       }
-    }, [toolRegistry, state.hasUnsavedChanges, state.selectedTool]);
+    },
+    [toolRegistry, state.hasUnsavedChanges, state.selectedTool],
+  );
 
   // Memoize the actions object to prevent unnecessary context updates
   // This is critical to avoid infinite loops when effects depend on actions
-  const actions: NavigationContextActions = useMemo(() => ({
-    setWorkbench,
-    setSelectedTool,
-    setToolAndWorkbench,
-    setHasUnsavedChanges,
-    registerUnsavedChangesChecker,
-    unregisterUnsavedChangesChecker,
-    showNavigationWarning,
-    requestNavigation,
-    confirmNavigation,
-    cancelNavigation,
-    clearToolSelection,
-    handleToolSelect,
-  }), [
-    setWorkbench,
-    setSelectedTool,
-    setToolAndWorkbench,
-    setHasUnsavedChanges,
-    registerUnsavedChangesChecker,
-    unregisterUnsavedChangesChecker,
-    showNavigationWarning,
-    requestNavigation,
-    confirmNavigation,
-    cancelNavigation,
-    clearToolSelection,
-    handleToolSelect,
-  ]);
+  const actions: NavigationContextActions = useMemo(
+    () => ({
+      setWorkbench,
+      setSelectedTool,
+      setToolAndWorkbench,
+      setHasUnsavedChanges,
+      registerUnsavedChangesChecker,
+      unregisterUnsavedChangesChecker,
+      showNavigationWarning,
+      requestNavigation,
+      confirmNavigation,
+      cancelNavigation,
+      clearToolSelection,
+      handleToolSelect,
+      registerNavigationWarningHandlers,
+      unregisterNavigationWarningHandlers,
+      navigationWarningHandlersRef,
+    }),
+    [
+      setWorkbench,
+      setSelectedTool,
+      setToolAndWorkbench,
+      setHasUnsavedChanges,
+      registerUnsavedChangesChecker,
+      unregisterUnsavedChangesChecker,
+      showNavigationWarning,
+      requestNavigation,
+      confirmNavigation,
+      cancelNavigation,
+      clearToolSelection,
+      handleToolSelect,
+      registerNavigationWarningHandlers,
+      unregisterNavigationWarningHandlers,
+    ],
+  );
 
   const stateValue: NavigationContextStateValue = {
     workbench: state.workbench,
     selectedTool: state.selectedTool,
     hasUnsavedChanges: state.hasUnsavedChanges,
     pendingNavigation: state.pendingNavigation,
-    showNavigationWarning: state.showNavigationWarning
+    showNavigationWarning: state.showNavigationWarning,
   };
 
   // Also memoize the context value to prevent unnecessary re-renders
-  const actionsValue: NavigationContextActionsValue = useMemo(() => ({
-    actions
-  }), [actions]);
+  const actionsValue: NavigationContextActionsValue = useMemo(
+    () => ({
+      actions,
+    }),
+    [actions],
+  );
 
   return (
     <NavigationStateContext.Provider value={stateValue}>
@@ -318,7 +460,9 @@ export const NavigationProvider: React.FC<{
 export const useNavigationState = () => {
   const context = useContext(NavigationStateContext);
   if (context === undefined) {
-    throw new Error('useNavigationState must be used within NavigationProvider');
+    throw new Error(
+      "useNavigationState must be used within NavigationProvider",
+    );
   }
   return context;
 };
@@ -326,7 +470,9 @@ export const useNavigationState = () => {
 export const useNavigationActions = () => {
   const context = useContext(NavigationActionsContext);
   if (context === undefined) {
-    throw new Error('useNavigationActions must be used within NavigationProvider');
+    throw new Error(
+      "useNavigationActions must be used within NavigationProvider",
+    );
   }
   return context;
 };
@@ -353,6 +499,11 @@ export const useNavigationGuard = () => {
     setHasUnsavedChanges: actions.setHasUnsavedChanges,
     setShowNavigationWarning: actions.showNavigationWarning,
     registerUnsavedChangesChecker: actions.registerUnsavedChangesChecker,
-    unregisterUnsavedChangesChecker: actions.unregisterUnsavedChangesChecker
+    unregisterUnsavedChangesChecker: actions.unregisterUnsavedChangesChecker,
+    registerNavigationWarningHandlers:
+      actions.registerNavigationWarningHandlers,
+    unregisterNavigationWarningHandlers:
+      actions.unregisterNavigationWarningHandlers,
+    navigationWarningHandlersRef: actions.navigationWarningHandlersRef,
   };
 };
diff --git a/frontend/src/core/contexts/PageEditorContext.tsx b/frontend/src/core/contexts/PageEditorContext.tsx
index 60e5969d83..0386ab2421 100644
--- a/frontend/src/core/contexts/PageEditorContext.tsx
+++ b/frontend/src/core/contexts/PageEditorContext.tsx
@@ -1,9 +1,18 @@
-import React, { createContext, useContext, useState, useCallback, ReactNode, useMemo, useRef, useEffect } from 'react';
-import { FileId } from '@app/types/file';
-import { useFileActions, useFileState } from '@app/contexts/FileContext';
-import { PDFDocument, PDFPage } from '@app/types/pageEditor';
-import { MAX_PAGE_EDITOR_FILES } from '@app/components/pageEditor/fileColors';
-import { useNavigationState } from '@app/contexts/NavigationContext';
+import React, {
+  createContext,
+  useContext,
+  useState,
+  useCallback,
+  ReactNode,
+  useMemo,
+  useRef,
+  useEffect,
+} from "react";
+import { FileId } from "@app/types/file";
+import { useFileActions, useFileState } from "@app/contexts/FileContext";
+import { PDFDocument, PDFPage } from "@app/types/pageEditor";
+import { MAX_PAGE_EDITOR_FILES } from "@app/components/pageEditor/fileColors";
+import { useNavigationState } from "@app/contexts/NavigationContext";
 
 // PageEditorFile is now defined locally in consuming components
 // Components should derive file list directly from FileContext
@@ -29,7 +38,7 @@ function computeFileOrderFromPages(pages: PDFPage[]): FileId[] {
   // Sort files by their first page position
   const fileOrder = Array.from(fileFirstPagePositions.entries())
     .sort((a, b) => a[1] - b[1])
-    .map(entry => entry[0]);
+    .map((entry) => entry[0]);
 
   return fileOrder;
 }
@@ -46,7 +55,7 @@ function reorderPagesForFileMove(
   currentPages: PDFPage[],
   fromIndex: number,
   toIndex: number,
-  orderedFileIds: FileId[]
+  orderedFileIds: FileId[],
 ): PDFPage[] {
   // Get the file ID being moved
   const movedFileId = orderedFileIds[fromIndex];
@@ -56,7 +65,7 @@ function reorderPagesForFileMove(
   const movedFilePages: PDFPage[] = [];
   const remainingPages: PDFPage[] = [];
 
-  currentPages.forEach(page => {
+  currentPages.forEach((page) => {
     if (page.originalFileId === movedFileId) {
       movedFilePages.push(page);
     } else {
@@ -92,13 +101,13 @@ function reorderPagesForFileMove(
   const reorderedPages = [
     ...remainingPages.slice(0, insertionIndex),
     ...movedFilePages,
-    ...remainingPages.slice(insertionIndex)
+    ...remainingPages.slice(insertionIndex),
   ];
 
   // Renumber all pages sequentially (clone to avoid mutation)
   return reorderedPages.map((page, index) => ({
     ...page,
-    pageNumber: index + 1
+    pageNumber: index + 1,
   }));
 }
 
@@ -136,7 +145,9 @@ interface PageEditorContextValue {
   clearPersistedDocument: () => void;
 }
 
-const PageEditorContext = createContext<PageEditorContextValue | undefined>(undefined);
+const PageEditorContext = createContext<PageEditorContextValue | undefined>(
+  undefined,
+);
 
 interface PageEditorProviderProps {
   children: ReactNode;
@@ -146,16 +157,22 @@ export function PageEditorProvider({ children }: PageEditorProviderProps) {
   const [currentPages, setCurrentPages] = useState<PDFPage[] | null>(null);
   const [reorderedPages, setReorderedPages] = useState<PDFPage[] | null>(null);
 
-  const [persistedDocument, setPersistedDocument] = useState<PDFDocument | null>(null);
-  const [persistedDocumentSignature, setPersistedDocumentSignature] = useState<string | null>(null);
+  const [persistedDocument, setPersistedDocument] =
+    useState<PDFDocument | null>(null);
+  const [persistedDocumentSignature, setPersistedDocumentSignature] = useState<
+    string | null
+  >(null);
 
-  const savePersistedDocument = useCallback((document: PDFDocument, signature: string) => {
-    setPersistedDocument(document);
-    setPersistedDocumentSignature(signature);
-  }, []);
+  const savePersistedDocument = useCallback(
+    (document: PDFDocument, signature: string) => {
+      setPersistedDocument(document);
+      setPersistedDocumentSignature(signature);
+    },
+    [],
+  );
 
   const clearPersistedDocument = useCallback(() => {
-    console.log('[PageEditorContext] Clearing persisted document');
+    console.log("[PageEditorContext] Clearing persisted document");
     setPersistedDocument(null);
     setPersistedDocumentSignature(null);
     setCurrentPages(null);
@@ -173,8 +190,10 @@ export function PageEditorProvider({ children }: PageEditorProviderProps) {
   useEffect(() => {
     const prevWorkbench = prevWorkbenchRef.current;
     const nextWorkbench = navigationState.workbench;
-    const isLeavingPageEditor = prevWorkbench === 'pageEditor' && nextWorkbench !== 'pageEditor';
-    const isEnteringPageEditor = prevWorkbench !== 'pageEditor' && nextWorkbench === 'pageEditor';
+    const isLeavingPageEditor =
+      prevWorkbench === "pageEditor" && nextWorkbench !== "pageEditor";
+    const isEnteringPageEditor =
+      prevWorkbench !== "pageEditor" && nextWorkbench === "pageEditor";
 
     if (isLeavingPageEditor) {
       clearPersistedDocument();
@@ -184,9 +203,11 @@ export function PageEditorProvider({ children }: PageEditorProviderProps) {
       prevFileContextIdsRef.current = state.files.ids;
       setReorderedPages(null);
       setCurrentPages(null); // Force clear current pages when entering
-      setFileOrder(currentOrder => {
-        const validOrder = currentOrder.filter(id => state.files.ids.includes(id));
-        const newIds = state.files.ids.filter(id => !validOrder.includes(id));
+      setFileOrder((currentOrder) => {
+        const validOrder = currentOrder.filter((id) =>
+          state.files.ids.includes(id),
+        );
+        const newIds = state.files.ids.filter((id) => !validOrder.includes(id));
         if (newIds.length === 0 && validOrder.length === currentOrder.length) {
           return currentOrder;
         }
@@ -206,8 +227,8 @@ export function PageEditorProvider({ children }: PageEditorProviderProps) {
 
   const fileContextSignature = useMemo(() => {
     return state.files.ids
-      .map(id => `${id}:${state.files.byId[id]?.versionNumber ?? 0}`)
-      .join(',');
+      .map((id) => `${id}:${state.files.byId[id]?.versionNumber ?? 0}`)
+      .join(",");
   }, [state.files.ids, state.files.byId]);
 
   const prevFileContextSignature = useRef<string | null>(null);
@@ -228,7 +249,10 @@ export function PageEditorProvider({ children }: PageEditorProviderProps) {
     const prevFileIds = prevFileContextIdsRef.current;
     const idsChanged = haveFileIdSetsChanged(prevFileIds, currentFileIds);
 
-    if (!idsChanged && prevFileContextSignature.current === fileContextSignature) {
+    if (
+      !idsChanged &&
+      prevFileContextSignature.current === fileContextSignature
+    ) {
       return;
     }
 
@@ -240,10 +264,13 @@ export function PageEditorProvider({ children }: PageEditorProviderProps) {
       return;
     }
 
-    console.log('[PageEditorContext] File signature changed (IDs/versions changed), clearing persisted document:', {
-      prev: previousSignature?.substring(0, 50),
-      current: fileContextSignature.substring(0, 50),
-    });
+    console.log(
+      "[PageEditorContext] File signature changed (IDs/versions changed), clearing persisted document:",
+      {
+        prev: previousSignature?.substring(0, 50),
+        current: fileContextSignature.substring(0, 50),
+      },
+    );
     clearPersistedDocument();
   }, [fileContextSignature, clearPersistedDocument, state.files.ids]);
 
@@ -262,17 +289,20 @@ export function PageEditorProvider({ children }: PageEditorProviderProps) {
     const prevFileIds = prevFileContextIdsRef.current;
 
     // Only react to FileContext changes, not our own fileOrder changes
-    const fileContextChanged = haveFileIdSetsChanged(prevFileIds, currentFileIds);
+    const fileContextChanged = haveFileIdSetsChanged(
+      prevFileIds,
+      currentFileIds,
+    );
 
     if (!fileContextChanged) {
       return;
     }
 
-    console.log('[PageEditorContext] FileContext files changed:', {
+    console.log("[PageEditorContext] FileContext files changed:", {
       prevCount: prevFileIds.length,
       currentCount: currentFileIds.length,
-      added: currentFileIds.filter(id => !prevFileIds.includes(id)).length,
-      removed: prevFileIds.filter(id => !currentFileIds.includes(id)).length,
+      added: currentFileIds.filter((id) => !prevFileIds.includes(id)).length,
+      removed: prevFileIds.filter((id) => !currentFileIds.includes(id)).length,
     });
 
     clearPersistedDocument();
@@ -283,15 +313,22 @@ export function PageEditorProvider({ children }: PageEditorProviderProps) {
     let newFileIdsToProcess: FileId[] = [];
 
     // Use functional setState to read latest fileOrder without depending on it
-    setFileOrder(currentOrder => {
+    setFileOrder((currentOrder) => {
       // Identify new files
-      const newFileIds = currentFileIds.filter(id => !currentOrder.includes(id));
+      const newFileIds = currentFileIds.filter(
+        (id) => !currentOrder.includes(id),
+      );
       newFileIdsToProcess = newFileIds; // Store for cleanup
 
       // Remove deleted files
-      const validFileOrder = currentOrder.filter(id => currentFileIds.includes(id));
+      const validFileOrder = currentOrder.filter((id) =>
+        currentFileIds.includes(id),
+      );
 
-      if (newFileIds.length === 0 && validFileOrder.length === currentOrder.length) {
+      if (
+        newFileIds.length === 0 &&
+        validFileOrder.length === currentOrder.length
+      ) {
         return currentOrder; // No changes needed
       }
 
@@ -302,14 +339,16 @@ export function PageEditorProvider({ children }: PageEditorProviderProps) {
 
     // Clear insertAfterPageId after a delay to allow usePageDocument to consume it first
     setTimeout(() => {
-      newFileIdsToProcess.forEach(fileId => {
+      newFileIdsToProcess.forEach((fileId) => {
         const stub = state.files.byId[fileId];
         if (stub?.insertAfterPageId) {
-          fileActions.updateStirlingFileStub(fileId, { insertAfterPageId: undefined });
+          fileActions.updateStirlingFileStub(fileId, {
+            insertAfterPageId: undefined,
+          });
         }
       });
     }, 100);
-    }, [state.files.ids, state.files.byId, fileActions]);
+  }, [state.files.ids, state.files.byId, fileActions]);
 
   const updateCurrentPages = useCallback((pages: PDFPage[] | null) => {
     setCurrentPages(pages);
@@ -319,47 +358,66 @@ export function PageEditorProvider({ children }: PageEditorProviderProps) {
     setReorderedPages(null);
   }, []);
 
-  const setFileSelection = useCallback((fileId: FileId, selected: boolean) => {
-    const currentSelection = stateRef.current.ui.selectedFileIds;
-    const isAlreadySelected = currentSelection.includes(fileId);
+  const setFileSelection = useCallback(
+    (fileId: FileId, selected: boolean) => {
+      const currentSelection = stateRef.current.ui.selectedFileIds;
+      const isAlreadySelected = currentSelection.includes(fileId);
 
-    // Check if we're trying to select when at limit
-    if (selected && !isAlreadySelected && currentSelection.length >= MAX_PAGE_EDITOR_FILES) {
-      console.warn(`Page editor supports maximum ${MAX_PAGE_EDITOR_FILES} files. Cannot select more files.`);
-      return;
-    }
+      // Check if we're trying to select when at limit
+      if (
+        selected &&
+        !isAlreadySelected &&
+        currentSelection.length >= MAX_PAGE_EDITOR_FILES
+      ) {
+        console.warn(
+          `Page editor supports maximum ${MAX_PAGE_EDITOR_FILES} files. Cannot select more files.`,
+        );
+        return;
+      }
 
-    // Update FileContext selection
-    const newSelectedIds = selected
-      ? [...currentSelection, fileId]
-      : currentSelection.filter(id => id !== fileId);
+      // Update FileContext selection
+      const newSelectedIds = selected
+        ? [...currentSelection, fileId]
+        : currentSelection.filter((id) => id !== fileId);
 
-    fileActions.setSelectedFiles(newSelectedIds);
-  }, [fileActions]);
+      fileActions.setSelectedFiles(newSelectedIds);
+    },
+    [fileActions],
+  );
 
-  const toggleFileSelection = useCallback((fileId: FileId) => {
-    const currentSelection = stateRef.current.ui.selectedFileIds;
-    const isCurrentlySelected = currentSelection.includes(fileId);
+  const toggleFileSelection = useCallback(
+    (fileId: FileId) => {
+      const currentSelection = stateRef.current.ui.selectedFileIds;
+      const isCurrentlySelected = currentSelection.includes(fileId);
 
-    // If toggling on and at limit, don't allow
-    if (!isCurrentlySelected && currentSelection.length >= MAX_PAGE_EDITOR_FILES) {
-      console.warn(`Page editor supports maximum ${MAX_PAGE_EDITOR_FILES} files. Cannot select more files.`);
-      return;
-    }
+      // If toggling on and at limit, don't allow
+      if (
+        !isCurrentlySelected &&
+        currentSelection.length >= MAX_PAGE_EDITOR_FILES
+      ) {
+        console.warn(
+          `Page editor supports maximum ${MAX_PAGE_EDITOR_FILES} files. Cannot select more files.`,
+        );
+        return;
+      }
 
-    // Update FileContext selection
-    const newSelectedIds = isCurrentlySelected
-      ? currentSelection.filter(id => id !== fileId)
-      : [...currentSelection, fileId];
+      // Update FileContext selection
+      const newSelectedIds = isCurrentlySelected
+        ? currentSelection.filter((id) => id !== fileId)
+        : [...currentSelection, fileId];
 
-    fileActions.setSelectedFiles(newSelectedIds);
-  }, [fileActions]);
+      fileActions.setSelectedFiles(newSelectedIds);
+    },
+    [fileActions],
+  );
 
   const selectAll = useCallback(() => {
     const allFileIds = stateRef.current.files.ids;
 
     if (allFileIds.length > MAX_PAGE_EDITOR_FILES) {
-      console.warn(`Page editor supports maximum ${MAX_PAGE_EDITOR_FILES} files. Only first ${MAX_PAGE_EDITOR_FILES} files will be selected.`);
+      console.warn(
+        `Page editor supports maximum ${MAX_PAGE_EDITOR_FILES} files. Only first ${MAX_PAGE_EDITOR_FILES} files will be selected.`,
+      );
       fileActions.setSelectedFiles(allFileIds.slice(0, MAX_PAGE_EDITOR_FILES));
     } else {
       fileActions.setSelectedFiles(allFileIds);
@@ -370,44 +428,57 @@ export function PageEditorProvider({ children }: PageEditorProviderProps) {
     fileActions.setSelectedFiles([]);
   }, [fileActions]);
 
-  const reorderFiles = useCallback((fromIndex: number, toIndex: number) => {
-    // Reorder local fileOrder array (page editor workspace only)
-    const newOrder = [...fileOrder];
-    const [movedFileId] = newOrder.splice(fromIndex, 1);
-    newOrder.splice(toIndex, 0, movedFileId);
-    setFileOrder(newOrder);
+  const reorderFiles = useCallback(
+    (fromIndex: number, toIndex: number) => {
+      // Reorder local fileOrder array (page editor workspace only)
+      const newOrder = [...fileOrder];
+      const [movedFileId] = newOrder.splice(fromIndex, 1);
+      newOrder.splice(toIndex, 0, movedFileId);
+      setFileOrder(newOrder);
 
-    // If current pages available, reorder them based on file move
-    if (currentPages && currentPages.length > 0 && fromIndex !== toIndex) {
-      // Get the current file order from pages (files that have pages loaded)
-      const currentFileOrder: FileId[] = [];
-      const filesSeen = new Set<FileId>();
-      currentPages.forEach(page => {
-        const fileId = page.originalFileId;
-        if (fileId && !filesSeen.has(fileId)) {
-          filesSeen.add(fileId);
-          currentFileOrder.push(fileId);
+      // If current pages available, reorder them based on file move
+      if (currentPages && currentPages.length > 0 && fromIndex !== toIndex) {
+        // Get the current file order from pages (files that have pages loaded)
+        const currentFileOrder: FileId[] = [];
+        const filesSeen = new Set<FileId>();
+        currentPages.forEach((page) => {
+          const fileId = page.originalFileId;
+          if (fileId && !filesSeen.has(fileId)) {
+            filesSeen.add(fileId);
+            currentFileOrder.push(fileId);
+          }
+        });
+
+        // Get the target file ID from the NEW order (after the move)
+        // When moving down: we want to position after the file at toIndex-1 (file just before insertion)
+        // When moving up: we want to position before the file at toIndex+1 (file just after insertion)
+        const targetFileId =
+          fromIndex < toIndex
+            ? newOrder[toIndex - 1] // Moving down: target is the file just before where we inserted
+            : newOrder[toIndex + 1]; // Moving up: target is the file just after where we inserted
+
+        // Find their positions in the current page order (not the full file list)
+        const pageOrderFromIndex = currentFileOrder.findIndex(
+          (id) => id === movedFileId,
+        );
+        const pageOrderToIndex = currentFileOrder.findIndex(
+          (id) => id === targetFileId,
+        );
+
+        // Only reorder pages if both files have pages loaded
+        if (pageOrderFromIndex >= 0 && pageOrderToIndex >= 0) {
+          const reorderedPagesResult = reorderPagesForFileMove(
+            currentPages,
+            pageOrderFromIndex,
+            pageOrderToIndex,
+            currentFileOrder,
+          );
+          setReorderedPages(reorderedPagesResult);
         }
-      });
-
-      // Get the target file ID from the NEW order (after the move)
-      // When moving down: we want to position after the file at toIndex-1 (file just before insertion)
-      // When moving up: we want to position before the file at toIndex+1 (file just after insertion)
-      const targetFileId = fromIndex < toIndex
-        ? newOrder[toIndex - 1]  // Moving down: target is the file just before where we inserted
-        : newOrder[toIndex + 1];  // Moving up: target is the file just after where we inserted
-
-      // Find their positions in the current page order (not the full file list)
-      const pageOrderFromIndex = currentFileOrder.findIndex(id => id === movedFileId);
-      const pageOrderToIndex = currentFileOrder.findIndex(id => id === targetFileId);
-
-      // Only reorder pages if both files have pages loaded
-      if (pageOrderFromIndex >= 0 && pageOrderToIndex >= 0) {
-        const reorderedPagesResult = reorderPagesForFileMove(currentPages, pageOrderFromIndex, pageOrderToIndex, currentFileOrder);
-        setReorderedPages(reorderedPagesResult);
       }
-    }
-  }, [fileOrder, currentPages]);
+    },
+    [fileOrder, currentPages],
+  );
 
   const updateFileOrderFromPages = useCallback((pages: PDFPage[]) => {
     if (!pages || pages.length === 0) return;
@@ -421,41 +492,43 @@ export function PageEditorProvider({ children }: PageEditorProviderProps) {
     }
   }, []);
 
-
-  const value: PageEditorContextValue = useMemo(() => ({
-    currentPages,
-    updateCurrentPages,
-    reorderedPages,
-    clearReorderedPages,
-    fileOrder,
-    setFileOrder,
-    setFileSelection,
-    toggleFileSelection,
-    selectAll,
-    deselectAll,
-    reorderFiles,
-    updateFileOrderFromPages,
-    persistedDocument,
-    persistedDocumentSignature,
-    savePersistedDocument,
-    clearPersistedDocument,
-  }), [
-    currentPages,
-    updateCurrentPages,
-    reorderedPages,
-    clearReorderedPages,
-    fileOrder,
-    setFileSelection,
-    toggleFileSelection,
-    selectAll,
-    deselectAll,
-    reorderFiles,
-    updateFileOrderFromPages,
-    persistedDocument,
-    persistedDocumentSignature,
-    savePersistedDocument,
-    clearPersistedDocument,
-  ]);
+  const value: PageEditorContextValue = useMemo(
+    () => ({
+      currentPages,
+      updateCurrentPages,
+      reorderedPages,
+      clearReorderedPages,
+      fileOrder,
+      setFileOrder,
+      setFileSelection,
+      toggleFileSelection,
+      selectAll,
+      deselectAll,
+      reorderFiles,
+      updateFileOrderFromPages,
+      persistedDocument,
+      persistedDocumentSignature,
+      savePersistedDocument,
+      clearPersistedDocument,
+    }),
+    [
+      currentPages,
+      updateCurrentPages,
+      reorderedPages,
+      clearReorderedPages,
+      fileOrder,
+      setFileSelection,
+      toggleFileSelection,
+      selectAll,
+      deselectAll,
+      reorderFiles,
+      updateFileOrderFromPages,
+      persistedDocument,
+      persistedDocumentSignature,
+      savePersistedDocument,
+      clearPersistedDocument,
+    ],
+  );
 
   return (
     <PageEditorContext.Provider value={value}>
@@ -467,7 +540,7 @@ export function PageEditorProvider({ children }: PageEditorProviderProps) {
 export function usePageEditor() {
   const context = useContext(PageEditorContext);
   if (!context) {
-    throw new Error('usePageEditor must be used within PageEditorProvider');
+    throw new Error("usePageEditor must be used within PageEditorProvider");
   }
   return context;
 }
diff --git a/frontend/src/core/contexts/PreferencesContext.tsx b/frontend/src/core/contexts/PreferencesContext.tsx
index e8dc32eb4d..b14deb88cf 100644
--- a/frontend/src/core/contexts/PreferencesContext.tsx
+++ b/frontend/src/core/contexts/PreferencesContext.tsx
@@ -1,17 +1,22 @@
-import React, { createContext, useContext, useState, useCallback } from 'react';
-import { preferencesService, UserPreferences } from '@app/services/preferencesService';
+import React, { createContext, useContext, useState, useCallback } from "react";
+import {
+  preferencesService,
+  UserPreferences,
+} from "@app/services/preferencesService";
 
 interface PreferencesContextValue {
   preferences: UserPreferences;
   updatePreference: <K extends keyof UserPreferences>(
     key: K,
-    value: UserPreferences[K]
+    value: UserPreferences[K],
   ) => void;
   resetPreferences: () => void;
   updateServerDefaults: (defaults: Partial<UserPreferences>) => void;
 }
 
-const PreferencesContext = createContext<PreferencesContextValue | undefined>(undefined);
+const PreferencesContext = createContext<PreferencesContextValue | undefined>(
+  undefined,
+);
 
 export const PreferencesProvider: React.FC<{
   children: React.ReactNode;
@@ -29,7 +34,7 @@ export const PreferencesProvider: React.FC<{
         [key]: value,
       }));
     },
-    []
+    [],
   );
 
   const resetPreferences = useCallback(() => {
@@ -37,11 +42,14 @@ export const PreferencesProvider: React.FC<{
     setPreferences(preferencesService.getAllPreferences());
   }, []);
 
-  const updateServerDefaults = useCallback((defaults: Partial<UserPreferences>) => {
-    preferencesService.setServerDefaults(defaults);
-    // Reload preferences to apply server defaults
-    setPreferences(preferencesService.getAllPreferences());
-  }, []);
+  const updateServerDefaults = useCallback(
+    (defaults: Partial<UserPreferences>) => {
+      preferencesService.setServerDefaults(defaults);
+      // Reload preferences to apply server defaults
+      setPreferences(preferencesService.getAllPreferences());
+    },
+    [],
+  );
 
   return (
     <PreferencesContext.Provider
@@ -60,7 +68,7 @@ export const PreferencesProvider: React.FC<{
 export const usePreferences = (): PreferencesContextValue => {
   const context = useContext(PreferencesContext);
   if (!context) {
-    throw new Error('usePreferences must be used within a PreferencesProvider');
+    throw new Error("usePreferences must be used within a PreferencesProvider");
   }
   return context;
 };
diff --git a/frontend/src/core/contexts/RedactionContext.tsx b/frontend/src/core/contexts/RedactionContext.tsx
index f1b98adc52..0391642cda 100644
--- a/frontend/src/core/contexts/RedactionContext.tsx
+++ b/frontend/src/core/contexts/RedactionContext.tsx
@@ -1,7 +1,15 @@
-import React, { createContext, useContext, useState, ReactNode, useCallback, useRef, useEffect } from 'react';
-import { RedactParameters } from '@app/hooks/tools/redact/useRedactParameters';
-import { useNavigationGuard } from '@app/contexts/NavigationContext';
-import { RedactionMode } from '@embedpdf/plugin-redaction';
+import React, {
+  createContext,
+  useContext,
+  useState,
+  ReactNode,
+  useCallback,
+  useRef,
+  useEffect,
+} from "react";
+import { RedactParameters } from "@app/hooks/tools/redact/useRedactParameters";
+import { useNavigationGuard } from "@app/contexts/NavigationContext";
+import { RedactionMode } from "@embedpdf/plugin-redaction";
 
 /**
  * API interface that the EmbedPDF bridge will implement
@@ -73,7 +81,9 @@ interface RedactionContextValue extends RedactionState, RedactionActions {
 }
 
 // Create context
-const RedactionContext = createContext<RedactionContextValue | undefined>(undefined);
+const RedactionContext = createContext<RedactionContextValue | undefined>(
+  undefined,
+);
 
 // Initial state
 const initialState: RedactionState = {
@@ -84,35 +94,37 @@ const initialState: RedactionState = {
   activeType: null,
   isRedacting: false,
   isBridgeReady: false,
-  manualRedactColor: '#000000',
+  manualRedactColor: "#000000",
 };
 
 /**
  * Provider component for redaction functionality
  * Bridges between the tool panel (outside EmbedPDF) and the viewer (inside EmbedPDF)
  */
-export const RedactionProvider: React.FC<{ children: ReactNode }> = ({ children }) => {
+export const RedactionProvider: React.FC<{ children: ReactNode }> = ({
+  children,
+}) => {
   const [state, setState] = useState<RedactionState>(initialState);
   const redactionApiRef = useRef<RedactionAPI | null>(null);
   const { setHasUnsavedChanges } = useNavigationGuard();
 
   // Actions for tool configuration
   const setRedactionConfig = useCallback((config: RedactParameters | null) => {
-    setState(prev => ({
+    setState((prev) => ({
       ...prev,
       redactionConfig: config,
     }));
   }, []);
 
   const setRedactionMode = useCallback((enabled: boolean) => {
-    setState(prev => ({
+    setState((prev) => ({
       ...prev,
       isRedactionMode: enabled,
     }));
   }, []);
 
   const setRedactionsApplied = useCallback((applied: boolean) => {
-    setState(prev => ({
+    setState((prev) => ({
       ...prev,
       redactionsApplied: applied,
     }));
@@ -120,35 +132,35 @@ export const RedactionProvider: React.FC<{ children: ReactNode }> = ({ children
 
   // Synced state setters (called from bridge inside EmbedPDF)
   const setPendingCount = useCallback((count: number) => {
-    setState(prev => ({
+    setState((prev) => ({
       ...prev,
       pendingCount: count,
     }));
   }, []);
 
   const setActiveType = useCallback((type: RedactionMode | null) => {
-    setState(prev => ({
+    setState((prev) => ({
       ...prev,
       activeType: type,
     }));
   }, []);
 
   const setIsRedacting = useCallback((isRedacting: boolean) => {
-    setState(prev => ({
+    setState((prev) => ({
       ...prev,
       isRedacting,
     }));
   }, []);
 
   const setBridgeReady = useCallback((ready: boolean) => {
-    setState(prev => ({
+    setState((prev) => ({
       ...prev,
       isBridgeReady: ready,
     }));
   }, []);
 
   const setManualRedactColor = useCallback((color: string) => {
-    setState(prev => ({
+    setState((prev) => ({
       ...prev,
       manualRedactColor: color,
     }));
@@ -164,7 +176,12 @@ export const RedactionProvider: React.FC<{ children: ReactNode }> = ({ children
       // When there are no pending redactions and nothing has been applied, we're "clean"
       setHasUnsavedChanges(false);
     }
-  }, [state.pendingCount, state.redactionsApplied, state.isRedactionMode, setHasUnsavedChanges]);
+  }, [
+    state.pendingCount,
+    state.redactionsApplied,
+    state.isRedactionMode,
+    setHasUnsavedChanges,
+  ]);
 
   // Unified redaction actions (v2.5.0)
   const activateRedact = useCallback(() => {
@@ -200,14 +217,14 @@ export const RedactionProvider: React.FC<{ children: ReactNode }> = ({ children
   const activateTextSelection = useCallback(() => {
     if (redactionApiRef.current) {
       redactionApiRef.current.enableRedact();
-      setActiveType('redactSelection' as RedactionMode);
+      setActiveType("redactSelection" as RedactionMode);
     }
   }, [setActiveType]);
 
   const activateMarquee = useCallback(() => {
     if (redactionApiRef.current) {
       redactionApiRef.current.enableRedact();
-      setActiveType('marqueeRedact' as RedactionMode);
+      setActiveType("marqueeRedact" as RedactionMode);
     }
   }, [setActiveType]);
 
@@ -243,7 +260,7 @@ export const RedactionProvider: React.FC<{ children: ReactNode }> = ({ children
 export const useRedaction = (): RedactionContextValue => {
   const context = useContext(RedactionContext);
   if (context === undefined) {
-    throw new Error('useRedaction must be used within a RedactionProvider');
+    throw new Error("useRedaction must be used within a RedactionProvider");
   }
   return context;
 };
@@ -260,7 +277,6 @@ export const useRedactionMode = () => {
     activeType: context?.activeType || null,
     isRedacting: context?.isRedacting || false,
     isBridgeReady: context?.isBridgeReady || false,
-    manualRedactColor: context?.manualRedactColor || '#000000',
+    manualRedactColor: context?.manualRedactColor || "#000000",
   };
 };
-
diff --git a/frontend/src/core/contexts/RightRailContext.tsx b/frontend/src/core/contexts/RightRailContext.tsx
index 5919a53e41..331292b3cd 100644
--- a/frontend/src/core/contexts/RightRailContext.tsx
+++ b/frontend/src/core/contexts/RightRailContext.tsx
@@ -1,88 +1,116 @@
-import React, { createContext, useCallback, useContext, useMemo, useState } from 'react';
-import { RightRailAction, RightRailButtonConfig } from '@app/types/rightRail';
+import React, {
+  createContext,
+  useCallback,
+  useContext,
+  useMemo,
+  useState,
+} from "react";
+import { RightRailAction, RightRailButtonConfig } from "@app/types/rightRail";
 
 interface RightRailContextValue {
-	buttons: RightRailButtonConfig[];
-	actions: Record<string, RightRailAction>;
-	allButtonsDisabled: boolean;
-	registerButtons: (buttons: RightRailButtonConfig[]) => void;
-	unregisterButtons: (ids: string[]) => void;
-	setAction: (id: string, action?: RightRailAction) => void;
-	setAllRightRailButtonsDisabled: (disabled: boolean) => void;
-	clear: () => void;
+  buttons: RightRailButtonConfig[];
+  actions: Record<string, RightRailAction>;
+  allButtonsDisabled: boolean;
+  registerButtons: (buttons: RightRailButtonConfig[]) => void;
+  unregisterButtons: (ids: string[]) => void;
+  setAction: (id: string, action?: RightRailAction) => void;
+  setAllRightRailButtonsDisabled: (disabled: boolean) => void;
+  clear: () => void;
 }
 
-const RightRailContext = createContext<RightRailContextValue | undefined>(undefined);
+const RightRailContext = createContext<RightRailContextValue | undefined>(
+  undefined,
+);
 
 export function RightRailProvider({ children }: { children: React.ReactNode }) {
-	const [buttons, setButtons] = useState<RightRailButtonConfig[]>([]);
-	const [actions, setActions] = useState<Record<string, RightRailAction>>({});
-	const [allButtonsDisabled, setAllButtonsDisabled] = useState<boolean>(false);
+  const [buttons, setButtons] = useState<RightRailButtonConfig[]>([]);
+  const [actions, setActions] = useState<Record<string, RightRailAction>>({});
+  const [allButtonsDisabled, setAllButtonsDisabled] = useState<boolean>(false);
 
-	const registerButtons = useCallback((newButtons: RightRailButtonConfig[]) => {
-		setButtons(prev => {
-			const byId = new Map(prev.map(b => [b.id, b] as const));
-			newButtons.forEach(nb => {
-				const existing = byId.get(nb.id) || ({} as RightRailButtonConfig);
-				byId.set(nb.id, { ...existing, ...nb });
-			});
-			const merged = Array.from(byId.values());
-			merged.sort((a, b) => (a.order ?? 0) - (b.order ?? 0) || a.id.localeCompare(b.id));
-			if (process.env.NODE_ENV === 'development') {
-				const ids = newButtons.map(b => b.id);
-				const dupes = ids.filter((id, idx) => ids.indexOf(id) !== idx);
-				if (dupes.length) console.warn('[RightRail] Duplicate ids in registerButtons:', dupes);
-			}
-			return merged;
-		});
-	}, []);
+  const registerButtons = useCallback((newButtons: RightRailButtonConfig[]) => {
+    setButtons((prev) => {
+      const byId = new Map(prev.map((b) => [b.id, b] as const));
+      newButtons.forEach((nb) => {
+        const existing = byId.get(nb.id) || ({} as RightRailButtonConfig);
+        byId.set(nb.id, { ...existing, ...nb });
+      });
+      const merged = Array.from(byId.values());
+      merged.sort(
+        (a, b) => (a.order ?? 0) - (b.order ?? 0) || a.id.localeCompare(b.id),
+      );
+      if (process.env.NODE_ENV === "development") {
+        const ids = newButtons.map((b) => b.id);
+        const dupes = ids.filter((id, idx) => ids.indexOf(id) !== idx);
+        if (dupes.length)
+          console.warn("[RightRail] Duplicate ids in registerButtons:", dupes);
+      }
+      return merged;
+    });
+  }, []);
 
-	const unregisterButtons = useCallback((ids: string[]) => {
-		setButtons(prev => prev.filter(b => !ids.includes(b.id)));
-		setActions(prev => Object.fromEntries(Object.entries(prev).filter(([id]) => !ids.includes(id))));
-	}, []);
+  const unregisterButtons = useCallback((ids: string[]) => {
+    setButtons((prev) => prev.filter((b) => !ids.includes(b.id)));
+    setActions((prev) =>
+      Object.fromEntries(
+        Object.entries(prev).filter(([id]) => !ids.includes(id)),
+      ),
+    );
+  }, []);
 
-	const setAction = useCallback((id: string, action?: RightRailAction) => {
-		setActions(prev => {
-			if (!action) {
-				if (!(id in prev)) return prev;
-				const next = { ...prev };
-				delete next[id];
-				return next;
-			}
-			return { ...prev, [id]: action };
-		});
-	}, []);
+  const setAction = useCallback((id: string, action?: RightRailAction) => {
+    setActions((prev) => {
+      if (!action) {
+        if (!(id in prev)) return prev;
+        const next = { ...prev };
+        delete next[id];
+        return next;
+      }
+      return { ...prev, [id]: action };
+    });
+  }, []);
 
-	const setAllRightRailButtonsDisabled = useCallback((disabled: boolean) => {
-		setAllButtonsDisabled(disabled);
-	}, []);
+  const setAllRightRailButtonsDisabled = useCallback((disabled: boolean) => {
+    setAllButtonsDisabled(disabled);
+  }, []);
 
-	const clear = useCallback(() => {
-		setButtons([]);
-		setActions({});
-	}, []);
+  const clear = useCallback(() => {
+    setButtons([]);
+    setActions({});
+  }, []);
 
-	const value = useMemo<RightRailContextValue>(() => ({ 
-		buttons, 
-		actions, 
-		allButtonsDisabled, 
-		registerButtons, 
-		unregisterButtons, 
-		setAction, 
-		setAllRightRailButtonsDisabled, 
-		clear 
-	}), [buttons, actions, allButtonsDisabled, registerButtons, unregisterButtons, setAction, setAllRightRailButtonsDisabled, clear]);
+  const value = useMemo<RightRailContextValue>(
+    () => ({
+      buttons,
+      actions,
+      allButtonsDisabled,
+      registerButtons,
+      unregisterButtons,
+      setAction,
+      setAllRightRailButtonsDisabled,
+      clear,
+    }),
+    [
+      buttons,
+      actions,
+      allButtonsDisabled,
+      registerButtons,
+      unregisterButtons,
+      setAction,
+      setAllRightRailButtonsDisabled,
+      clear,
+    ],
+  );
 
-	return (
-		<RightRailContext.Provider value={value}>
-			{children}
-		</RightRailContext.Provider>
-	);
+  return (
+    <RightRailContext.Provider value={value}>
+      {children}
+    </RightRailContext.Provider>
+  );
 }
 
 export function useRightRail() {
-	const ctx = useContext(RightRailContext);
-	if (!ctx) throw new Error('useRightRail must be used within RightRailProvider');
-	return ctx;
+  const ctx = useContext(RightRailContext);
+  if (!ctx)
+    throw new Error("useRightRail must be used within RightRailProvider");
+  return ctx;
 }
diff --git a/frontend/src/core/contexts/SaaSTeamContext.tsx b/frontend/src/core/contexts/SaaSTeamContext.tsx
index 81baeb2bc1..b91ef05a6a 100644
--- a/frontend/src/core/contexts/SaaSTeamContext.tsx
+++ b/frontend/src/core/contexts/SaaSTeamContext.tsx
@@ -1,4 +1,4 @@
-import { createContext, ReactNode } from 'react';
+import { createContext, ReactNode } from "react";
 
 /**
  * Core stub for SaaS Team Context
@@ -45,7 +45,9 @@ export interface SaaSTeamContextValue {
   refreshTeams: () => Promise<void>;
 }
 
-const SaaSTeamContext = createContext<SaaSTeamContextValue | undefined>(undefined);
+const SaaSTeamContext = createContext<SaaSTeamContextValue | undefined>(
+  undefined,
+);
 
 export function SaaSTeamProvider({ children }: { children: ReactNode }) {
   // Core stub - no-op implementation
diff --git a/frontend/src/core/contexts/SaasBillingContext.tsx b/frontend/src/core/contexts/SaasBillingContext.tsx
index 8e16044fa8..37fc956af2 100644
--- a/frontend/src/core/contexts/SaasBillingContext.tsx
+++ b/frontend/src/core/contexts/SaasBillingContext.tsx
@@ -5,6 +5,10 @@
  */
 export const useSaaSBilling = (): null => null;
 
-export function SaasBillingProvider({ children }: { children: React.ReactNode }) {
+export function SaasBillingProvider({
+  children,
+}: {
+  children: React.ReactNode;
+}) {
   return <>{children}</>;
 }
diff --git a/frontend/src/core/contexts/SidebarContext.tsx b/frontend/src/core/contexts/SidebarContext.tsx
index 6568c9ff40..9099c436e9 100644
--- a/frontend/src/core/contexts/SidebarContext.tsx
+++ b/frontend/src/core/contexts/SidebarContext.tsx
@@ -1,7 +1,14 @@
-import { createContext, useContext, useState, useRef, useMemo } from 'react';
-import { SidebarState, SidebarRefs, SidebarContextValue, SidebarProviderProps } from '@app/types/sidebar';
+import { createContext, useContext, useState, useRef, useMemo } from "react";
+import {
+  SidebarState,
+  SidebarRefs,
+  SidebarContextValue,
+  SidebarProviderProps,
+} from "@app/types/sidebar";
 
-const SidebarContext = createContext<SidebarContextValue | undefined>(undefined);
+const SidebarContext = createContext<SidebarContextValue | undefined>(
+  undefined,
+);
 
 export function SidebarProvider({ children }: SidebarProviderProps) {
   // All sidebar state management
@@ -10,28 +17,45 @@ export function SidebarProvider({ children }: SidebarProviderProps) {
   const rightRailRef = useRef<HTMLDivElement>(null);
 
   const [sidebarsVisible, setSidebarsVisible] = useState(true);
-  const [leftPanelView, setLeftPanelView] = useState<'toolPicker' | 'toolContent'>('toolPicker');
+  const [leftPanelView, setLeftPanelView] = useState<
+    "toolPicker" | "toolContent"
+  >("toolPicker");
   const [readerMode, setReaderMode] = useState(false);
 
-  const sidebarState: SidebarState = useMemo(() => ({
-    sidebarsVisible,
-    leftPanelView,
-    readerMode,
-  }), [sidebarsVisible, leftPanelView, readerMode]);
+  const sidebarState: SidebarState = useMemo(
+    () => ({
+      sidebarsVisible,
+      leftPanelView,
+      readerMode,
+    }),
+    [sidebarsVisible, leftPanelView, readerMode],
+  );
 
-  const sidebarRefs: SidebarRefs = useMemo(() => ({
-    quickAccessRef,
-    toolPanelRef,
-    rightRailRef,
-  }), [quickAccessRef, toolPanelRef, rightRailRef]);
+  const sidebarRefs: SidebarRefs = useMemo(
+    () => ({
+      quickAccessRef,
+      toolPanelRef,
+      rightRailRef,
+    }),
+    [quickAccessRef, toolPanelRef, rightRailRef],
+  );
 
-  const contextValue: SidebarContextValue = useMemo(() => ({
-    sidebarState,
-    sidebarRefs,
-    setSidebarsVisible,
-    setLeftPanelView,
-    setReaderMode,
-  }), [sidebarState, sidebarRefs, setSidebarsVisible, setLeftPanelView, setReaderMode]);
+  const contextValue: SidebarContextValue = useMemo(
+    () => ({
+      sidebarState,
+      sidebarRefs,
+      setSidebarsVisible,
+      setLeftPanelView,
+      setReaderMode,
+    }),
+    [
+      sidebarState,
+      sidebarRefs,
+      setSidebarsVisible,
+      setLeftPanelView,
+      setReaderMode,
+    ],
+  );
 
   return (
     <SidebarContext.Provider value={contextValue}>
@@ -43,7 +67,7 @@ export function SidebarProvider({ children }: SidebarProviderProps) {
 export function useSidebarContext(): SidebarContextValue {
   const context = useContext(SidebarContext);
   if (context === undefined) {
-    throw new Error('useSidebarContext must be used within a SidebarProvider');
+    throw new Error("useSidebarContext must be used within a SidebarProvider");
   }
   return context;
 }
diff --git a/frontend/src/core/contexts/SignatureContext.tsx b/frontend/src/core/contexts/SignatureContext.tsx
index e8f10fc40f..1c1a53e05f 100644
--- a/frontend/src/core/contexts/SignatureContext.tsx
+++ b/frontend/src/core/contexts/SignatureContext.tsx
@@ -1,6 +1,17 @@
-import React, { createContext, useContext, useState, ReactNode, useCallback, useRef } from 'react';
-import { SignParameters } from '@app/hooks/tools/sign/useSignParameters';
-import type { SignatureAPI, HistoryAPI, AnnotationAPI } from '@app/components/viewer/viewerTypes';
+import React, {
+  createContext,
+  useContext,
+  useState,
+  ReactNode,
+  useCallback,
+  useRef,
+} from "react";
+import { SignParameters } from "@app/hooks/tools/sign/useSignParameters";
+import type {
+  SignatureAPI,
+  HistoryAPI,
+  AnnotationAPI,
+} from "@app/components/viewer/viewerTypes";
 
 // Signature state interface
 interface SignatureState {
@@ -28,7 +39,9 @@ interface SignatureActions {
   storeImageData: (id: string, data: string) => void;
   getImageData: (id: string) => string | undefined;
   setSignaturesApplied: (applied: boolean) => void;
-  setPlacementPreviewSize: (size: { width: number; height: number } | null) => void;
+  setPlacementPreviewSize: (
+    size: { width: number; height: number } | null,
+  ) => void;
 }
 
 // Combined context interface
@@ -39,7 +52,9 @@ interface SignatureContextValue extends SignatureState, SignatureActions {
 }
 
 // Create context
-const SignatureContext = createContext<SignatureContextValue | undefined>(undefined);
+const SignatureContext = createContext<SignatureContextValue | undefined>(
+  undefined,
+);
 
 // Initial state
 const initialState: SignatureState = {
@@ -50,7 +65,9 @@ const initialState: SignatureState = {
 };
 
 // Provider component
-export const SignatureProvider: React.FC<{ children: ReactNode }> = ({ children }) => {
+export const SignatureProvider: React.FC<{ children: ReactNode }> = ({
+  children,
+}) => {
   const [state, setState] = useState<SignatureState>(initialState);
   const signatureApiRef = useRef<SignatureAPI>(null);
   const annotationApiRef = useRef<AnnotationAPI>(null);
@@ -59,14 +76,14 @@ export const SignatureProvider: React.FC<{ children: ReactNode }> = ({ children
 
   // Actions
   const setSignatureConfig = useCallback((config: SignParameters | null) => {
-    setState(prev => ({
+    setState((prev) => ({
       ...prev,
       signatureConfig: config,
     }));
   }, []);
 
   const setPlacementMode = useCallback((enabled: boolean) => {
-    setState(prev => ({
+    setState((prev) => ({
       ...prev,
       isPlacementMode: enabled,
     }));
@@ -127,32 +144,35 @@ export const SignatureProvider: React.FC<{ children: ReactNode }> = ({ children
   }, []);
 
   const setSignaturesApplied = useCallback((applied: boolean) => {
-    setState(prev => ({
+    setState((prev) => ({
       ...prev,
       signaturesApplied: applied,
     }));
   }, []);
 
-  const setPlacementPreviewSize = useCallback((size: { width: number; height: number } | null) => {
-    setState(prev => {
-      const prevSize = prev.placementPreviewSize;
-      const same =
-        (prevSize === null && size === null) ||
-        (prevSize !== null &&
-          size !== null &&
-          Math.abs(prevSize.width - size.width) < 0.5 &&
-          Math.abs(prevSize.height - size.height) < 0.5);
+  const setPlacementPreviewSize = useCallback(
+    (size: { width: number; height: number } | null) => {
+      setState((prev) => {
+        const prevSize = prev.placementPreviewSize;
+        const same =
+          (prevSize === null && size === null) ||
+          (prevSize !== null &&
+            size !== null &&
+            Math.abs(prevSize.width - size.width) < 0.5 &&
+            Math.abs(prevSize.height - size.height) < 0.5);
 
-      if (same) {
-        return prev;
-      }
+        if (same) {
+          return prev;
+        }
 
-      return {
-        ...prev,
-        placementPreviewSize: size,
-      };
-    });
-  }, []);
+        return {
+          ...prev,
+          placementPreviewSize: size,
+        };
+      });
+    },
+    [],
+  );
 
   // No auto-activation - all modes use manual buttons
 
@@ -187,7 +207,7 @@ export const SignatureProvider: React.FC<{ children: ReactNode }> = ({ children
 export const useSignature = (): SignatureContextValue => {
   const context = useContext(SignatureContext);
   if (context === undefined) {
-    throw new Error('useSignature must be used within a SignatureProvider');
+    throw new Error("useSignature must be used within a SignatureProvider");
   }
   return context;
 };
diff --git a/frontend/src/core/contexts/ToolActionsContext.tsx b/frontend/src/core/contexts/ToolActionsContext.tsx
index 6d87543e0c..8a2e6e5356 100644
--- a/frontend/src/core/contexts/ToolActionsContext.tsx
+++ b/frontend/src/core/contexts/ToolActionsContext.tsx
@@ -1,4 +1,4 @@
-import { createContext, useContext } from 'react';
+import { createContext, useContext } from "react";
 
 interface ToolActionsContextValue {
   /**
diff --git a/frontend/src/core/contexts/ToolRegistryContext.tsx b/frontend/src/core/contexts/ToolRegistryContext.tsx
index 6a131ebed2..a027556421 100644
--- a/frontend/src/core/contexts/ToolRegistryContext.tsx
+++ b/frontend/src/core/contexts/ToolRegistryContext.tsx
@@ -1,4 +1,4 @@
-import { createContext, useContext } from 'react';
+import { createContext, useContext } from "react";
 
 import type {
   ToolRegistryEntry,
@@ -6,8 +6,8 @@ import type {
   RegularToolRegistry,
   SuperToolRegistry,
   LinkToolRegistry,
-} from '@app/data/toolsTaxonomy';
-import type { ToolId } from '@app/types/toolId';
+} from "@app/data/toolsTaxonomy";
+import type { ToolId } from "@app/types/toolId";
 
 export interface ToolRegistryCatalog {
   regularTools: RegularToolRegistry;
@@ -22,7 +22,9 @@ const ToolRegistryContext = createContext<ToolRegistryCatalog | null>(null);
 export const useToolRegistry = (): ToolRegistryCatalog => {
   const context = useContext(ToolRegistryContext);
   if (context === null) {
-    throw new Error('useToolRegistry must be used within a ToolRegistryProvider');
+    throw new Error(
+      "useToolRegistry must be used within a ToolRegistryProvider",
+    );
   }
   return context;
 };
diff --git a/frontend/src/core/contexts/ToolRegistryProvider.tsx b/frontend/src/core/contexts/ToolRegistryProvider.tsx
index fb8e5e48f6..c6c077dd51 100644
--- a/frontend/src/core/contexts/ToolRegistryProvider.tsx
+++ b/frontend/src/core/contexts/ToolRegistryProvider.tsx
@@ -1,15 +1,19 @@
-import { useMemo } from 'react';
+import { useMemo } from "react";
 
-import type { ToolId } from '@app/types/toolId';
-import type { ToolRegistry } from '@app/data/toolsTaxonomy';
-import ToolRegistryContext, { ToolRegistryCatalog } from '@app/contexts/ToolRegistryContext';
-import { useTranslatedToolCatalog } from '@app/data/useTranslatedToolRegistry';
+import type { ToolId } from "@app/types/toolId";
+import type { ToolRegistry } from "@app/data/toolsTaxonomy";
+import ToolRegistryContext, {
+  ToolRegistryCatalog,
+} from "@app/contexts/ToolRegistryContext";
+import { useTranslatedToolCatalog } from "@app/data/useTranslatedToolRegistry";
 
 interface ToolRegistryProviderProps {
   children: React.ReactNode;
 }
 
-export const ToolRegistryProvider: React.FC<ToolRegistryProviderProps> = ({ children }) => {
+export const ToolRegistryProvider: React.FC<ToolRegistryProviderProps> = ({
+  children,
+}) => {
   const catalog = useTranslatedToolCatalog();
 
   const contextValue = useMemo<ToolRegistryCatalog>(() => {
diff --git a/frontend/src/core/contexts/ToolWorkflowContext.tsx b/frontend/src/core/contexts/ToolWorkflowContext.tsx
index dbc74ddda9..bf410c11b6 100644
--- a/frontend/src/core/contexts/ToolWorkflowContext.tsx
+++ b/frontend/src/core/contexts/ToolWorkflowContext.tsx
@@ -3,24 +3,41 @@
  * Eliminates prop drilling with a single, simple context
  */
 
-import React, { createContext, useContext, useReducer, useCallback, useMemo, useEffect } from 'react';
-import { useToolManagement, type ToolAvailabilityMap } from '@app/hooks/useToolManagement';
-import { PageEditorFunctions } from '@app/types/pageEditor';
-import { ToolRegistryEntry, ToolRegistry } from '@app/data/toolsTaxonomy';
-import { useNavigationActions, useNavigationState } from '@app/contexts/NavigationContext';
-import { ToolId, isValidToolId } from '@app/types/toolId';
-import { WorkbenchType, getDefaultWorkbench, isBaseWorkbench } from '@app/types/workbench';
-import { useNavigationUrlSync } from '@app/hooks/useUrlSync';
-import { filterToolRegistryByQuery } from '@app/utils/toolSearch';
-import { useToolHistory } from '@app/hooks/tools/useUserToolActivity';
+import React, {
+  createContext,
+  useContext,
+  useReducer,
+  useCallback,
+  useMemo,
+  useEffect,
+} from "react";
+import {
+  useToolManagement,
+  type ToolAvailabilityMap,
+} from "@app/hooks/useToolManagement";
+import { PageEditorFunctions } from "@app/types/pageEditor";
+import { ToolRegistryEntry, ToolRegistry } from "@app/data/toolsTaxonomy";
+import {
+  useNavigationActions,
+  useNavigationState,
+} from "@app/contexts/NavigationContext";
+import { ToolId, isValidToolId } from "@app/types/toolId";
+import {
+  WorkbenchType,
+  getDefaultWorkbench,
+  isBaseWorkbench,
+} from "@app/types/workbench";
+import { useNavigationUrlSync } from "@app/hooks/useUrlSync";
+import { filterToolRegistryByQuery } from "@app/utils/toolSearch";
+import { useToolHistory } from "@app/hooks/tools/useUserToolActivity";
 import {
   ToolWorkflowState,
   createInitialState,
   toolWorkflowReducer,
-} from '@app/contexts/toolWorkflow/toolWorkflowState';
-import type { ToolPanelMode } from '@app/constants/toolPanel';
-import { usePreferences } from '@app/contexts/PreferencesContext';
-import { useToolRegistry } from '@app/contexts/ToolRegistryContext';
+} from "@app/contexts/toolWorkflow/toolWorkflowState";
+import type { ToolPanelMode } from "@app/constants/toolPanel";
+import { usePreferences } from "@app/contexts/PreferencesContext";
+import { useToolRegistry } from "@app/contexts/ToolRegistryContext";
 
 // State interface
 // Types and reducer/state moved to './toolWorkflow/state'
@@ -50,14 +67,13 @@ interface ToolWorkflowContextValue extends ToolWorkflowState {
 
   // UI Actions
   setSidebarsVisible: (visible: boolean) => void;
-  setLeftPanelView: (view: 'toolPicker' | 'toolContent' | 'hidden') => void;
+  setLeftPanelView: (view: "toolPicker" | "toolContent" | "hidden") => void;
   setReaderMode: (mode: boolean) => void;
   setToolPanelMode: (mode: ToolPanelMode) => void;
   setPreviewFile: (file: File | null) => void;
   setPageEditorFunctions: (functions: PageEditorFunctions | null) => void;
   setSearchQuery: (query: string) => void;
 
-
   selectTool: (toolId: ToolId | null) => void;
   clearToolSelection: () => void;
 
@@ -76,7 +92,10 @@ interface ToolWorkflowContextValue extends ToolWorkflowState {
   handleReaderToggle: () => void;
 
   // Computed values
-  filteredTools: Array<{ item: [ToolId, ToolRegistryEntry]; matchedText?: string }>; // Filtered by search
+  filteredTools: Array<{
+    item: [ToolId, ToolRegistryEntry];
+    matchedText?: string;
+  }>; // Filtered by search
   isPanelVisible: boolean;
 
   // Tool History
@@ -92,9 +111,13 @@ interface ToolWorkflowContextValue extends ToolWorkflowState {
 }
 
 // Ensure a single context instance across HMR to avoid provider/consumer mismatches
-const __GLOBAL_CONTEXT_KEY__ = '__ToolWorkflowContext__';
-const existingContext = (globalThis as any)[__GLOBAL_CONTEXT_KEY__] as React.Context<ToolWorkflowContextValue | undefined> | undefined;
-const ToolWorkflowContext = existingContext ?? createContext<ToolWorkflowContextValue | undefined>(undefined);
+const __GLOBAL_CONTEXT_KEY__ = "__ToolWorkflowContext__";
+const existingContext = (globalThis as any)[__GLOBAL_CONTEXT_KEY__] as
+  | React.Context<ToolWorkflowContextValue | undefined>
+  | undefined;
+const ToolWorkflowContext =
+  existingContext ??
+  createContext<ToolWorkflowContextValue | undefined>(undefined);
 if (!existingContext) {
   (globalThis as any)[__GLOBAL_CONTEXT_KEY__] = ToolWorkflowContext;
 }
@@ -105,116 +128,150 @@ interface ToolWorkflowProviderProps {
 }
 
 export function ToolWorkflowProvider({ children }: ToolWorkflowProviderProps) {
-  const [state, dispatch] = useReducer(toolWorkflowReducer, undefined, createInitialState);
+  const [state, dispatch] = useReducer(
+    toolWorkflowReducer,
+    undefined,
+    createInitialState,
+  );
   const { preferences, updatePreference } = usePreferences();
 
   // Store reset functions for tools
-  const [toolResetFunctions, setToolResetFunctions] = React.useState<Record<string, () => void>>({});
+  const [toolResetFunctions, setToolResetFunctions] = React.useState<
+    Record<string, () => void>
+  >({});
 
-  const [customViewRegistry, setCustomViewRegistry] = React.useState<Record<string, CustomWorkbenchViewRegistration>>({});
-  const [customViewData, setCustomViewData] = React.useState<Record<string, any>>({});
+  const [customViewRegistry, setCustomViewRegistry] = React.useState<
+    Record<string, CustomWorkbenchViewRegistration>
+  >({});
+  const [customViewData, setCustomViewData] = React.useState<
+    Record<string, any>
+  >({});
 
   // Navigation actions and state are available since we're inside NavigationProvider
   const { actions } = useNavigationActions();
   const navigationState = useNavigationState();
 
   // Tool management hook
-  const { toolRegistry, getSelectedTool, toolAvailability } = useToolManagement();
+  const { toolRegistry, getSelectedTool, toolAvailability } =
+    useToolManagement();
   const { allTools } = useToolRegistry();
 
   // Tool history hook
-  const {
-    favoriteTools,
-    toggleFavorite,
-    isFavorite,
-  } = useToolHistory();
+  const { favoriteTools, toggleFavorite, isFavorite } = useToolHistory();
 
   // Get selected tool from navigation context
   const selectedTool = getSelectedTool(navigationState.selectedTool);
 
   // UI Action creators
   const setSidebarsVisible = useCallback((visible: boolean) => {
-    dispatch({ type: 'SET_SIDEBARS_VISIBLE', payload: visible });
+    dispatch({ type: "SET_SIDEBARS_VISIBLE", payload: visible });
   }, []);
 
-  const setLeftPanelView = useCallback((view: 'toolPicker' | 'toolContent' | 'hidden') => {
-    dispatch({ type: 'SET_LEFT_PANEL_VIEW', payload: view });
-  }, []);
+  const setLeftPanelView = useCallback(
+    (view: "toolPicker" | "toolContent" | "hidden") => {
+      dispatch({ type: "SET_LEFT_PANEL_VIEW", payload: view });
+    },
+    [],
+  );
 
-  const setReaderMode = useCallback((mode: boolean) => {
-    if (mode) {
-      actions.setWorkbench('viewer');
-      actions.setSelectedTool('read');
-    }
-    dispatch({ type: 'SET_READER_MODE', payload: mode });
-  }, [actions]);
+  const setReaderMode = useCallback(
+    (mode: boolean) => {
+      if (mode) {
+        actions.setWorkbench("viewer");
+        actions.setSelectedTool("read");
+      }
+      dispatch({ type: "SET_READER_MODE", payload: mode });
+    },
+    [actions],
+  );
 
-  const setToolPanelMode = useCallback((mode: ToolPanelMode) => {
-    dispatch({ type: 'SET_TOOL_PANEL_MODE', payload: mode });
-    updatePreference('defaultToolPanelMode', mode);
-    updatePreference('hasSelectedToolPanelMode', true);
-  }, [updatePreference]);
+  const setToolPanelMode = useCallback(
+    (mode: ToolPanelMode) => {
+      dispatch({ type: "SET_TOOL_PANEL_MODE", payload: mode });
+      updatePreference("defaultToolPanelMode", mode);
+      updatePreference("hasSelectedToolPanelMode", true);
+    },
+    [updatePreference],
+  );
 
+  const setPreviewFile = useCallback(
+    (file: File | null) => {
+      dispatch({ type: "SET_PREVIEW_FILE", payload: file });
+      if (file) {
+        actions.setWorkbench("viewer");
+      }
+    },
+    [actions],
+  );
 
-  const setPreviewFile = useCallback((file: File | null) => {
-    dispatch({ type: 'SET_PREVIEW_FILE', payload: file });
-    if (file) {
-      actions.setWorkbench('viewer');
-    }
-  }, [actions]);
-
-  const setPageEditorFunctions = useCallback((functions: PageEditorFunctions | null) => {
-    dispatch({ type: 'SET_PAGE_EDITOR_FUNCTIONS', payload: functions });
-  }, []);
+  const setPageEditorFunctions = useCallback(
+    (functions: PageEditorFunctions | null) => {
+      dispatch({ type: "SET_PAGE_EDITOR_FUNCTIONS", payload: functions });
+    },
+    [],
+  );
 
   const setSearchQuery = useCallback((query: string) => {
-    dispatch({ type: 'SET_SEARCH_QUERY', payload: query });
+    dispatch({ type: "SET_SEARCH_QUERY", payload: query });
   }, []);
 
-  const registerCustomWorkbenchView = useCallback((view: CustomWorkbenchViewRegistration) => {
-    setCustomViewRegistry(prev => ({ ...prev, [view.id]: view }));
-  }, []);
+  const registerCustomWorkbenchView = useCallback(
+    (view: CustomWorkbenchViewRegistration) => {
+      setCustomViewRegistry((prev) => ({ ...prev, [view.id]: view }));
+    },
+    [],
+  );
 
-  const unregisterCustomWorkbenchView = useCallback((id: string) => {
-    let removedView: CustomWorkbenchViewRegistration | undefined;
+  const unregisterCustomWorkbenchView = useCallback(
+    (id: string) => {
+      let removedView: CustomWorkbenchViewRegistration | undefined;
 
-    setCustomViewRegistry(prev => {
-      const existing = prev[id];
-      if (!existing) {
-        return prev;
+      setCustomViewRegistry((prev) => {
+        const existing = prev[id];
+        if (!existing) {
+          return prev;
+        }
+        removedView = existing;
+        const updated = { ...prev };
+        delete updated[id];
+        return updated;
+      });
+
+      setCustomViewData((prev) => {
+        if (!(id in prev)) {
+          return prev;
+        }
+        const updated = { ...prev };
+        delete updated[id];
+        return updated;
+      });
+
+      if (
+        removedView &&
+        navigationState.workbench === removedView.workbenchId
+      ) {
+        actions.setWorkbench(getDefaultWorkbench());
       }
-      removedView = existing;
-      const updated = { ...prev };
-      delete updated[id];
-      return updated;
-    });
+    },
+    [actions, navigationState.workbench],
+  );
 
-    setCustomViewData(prev => {
-      if (!(id in prev)) {
-        return prev;
-      }
-      const updated = { ...prev };
-      delete updated[id];
-      return updated;
-    });
-
-    if (removedView && navigationState.workbench === removedView.workbenchId) {
-      actions.setWorkbench(getDefaultWorkbench());
-    }
-  }, [actions, navigationState.workbench]);
-
-  const setCustomWorkbenchViewData = useCallback((id: string, dataOrUpdater: any | ((prev: any) => any)) => {
-    setCustomViewData(prev => {
-      const currentData = prev[id];
-      const newData = typeof dataOrUpdater === 'function'
-        ? dataOrUpdater(currentData)
-        : dataOrUpdater;
-      return { ...prev, [id]: newData };
-    });
-  }, []);
+  const setCustomWorkbenchViewData = useCallback(
+    (id: string, dataOrUpdater: any | ((prev: any) => any)) => {
+      setCustomViewData((prev) => {
+        const currentData = prev[id];
+        const newData =
+          typeof dataOrUpdater === "function"
+            ? dataOrUpdater(currentData)
+            : dataOrUpdater;
+        return { ...prev, [id]: newData };
+      });
+    },
+    [],
+  );
 
   const clearCustomWorkbenchViewData = useCallback((id: string) => {
-    setCustomViewData(prev => {
+    setCustomViewData((prev) => {
       if (!(id in prev)) {
         return prev;
       }
@@ -225,9 +282,11 @@ export function ToolWorkflowProvider({ children }: ToolWorkflowProviderProps) {
   }, []);
 
   const customWorkbenchViews = useMemo<CustomWorkbenchViewInstance[]>(() => {
-    return Object.values(customViewRegistry).map(view => ({
+    return Object.values(customViewRegistry).map((view) => ({
       ...view,
-      data: Object.prototype.hasOwnProperty.call(customViewData, view.id) ? customViewData[view.id] : null,
+      data: Object.prototype.hasOwnProperty.call(customViewData, view.id)
+        ? customViewData[view.id]
+        : null,
     }));
   }, [customViewRegistry, customViewData]);
 
@@ -236,15 +295,26 @@ export function ToolWorkflowProvider({ children }: ToolWorkflowProviderProps) {
       return;
     }
 
-    if (navigationState.pendingNavigation || navigationState.showNavigationWarning) {
+    if (
+      navigationState.pendingNavigation ||
+      navigationState.showNavigationWarning
+    ) {
       return;
     }
 
-    const currentCustomView = customWorkbenchViews.find(view => view.workbenchId === navigationState.workbench);
+    const currentCustomView = customWorkbenchViews.find(
+      (view) => view.workbenchId === navigationState.workbench,
+    );
     if (!currentCustomView || currentCustomView.data == null) {
       actions.setWorkbench(getDefaultWorkbench());
     }
-  }, [actions, customWorkbenchViews, navigationState.workbench, navigationState.pendingNavigation, navigationState.showNavigationWarning]);
+  }, [
+    actions,
+    customWorkbenchViews,
+    navigationState.workbench,
+    navigationState.pendingNavigation,
+    navigationState.showNavigationWarning,
+  ]);
 
   // Persisted via PreferencesContext; no direct localStorage writes needed here
 
@@ -254,18 +324,48 @@ export function ToolWorkflowProvider({ children }: ToolWorkflowProviderProps) {
   useEffect(() => {
     const preferredMode = preferences.defaultToolPanelMode;
     if (preferredMode !== state.toolPanelMode) {
-      dispatch({ type: 'SET_TOOL_PANEL_MODE', payload: preferredMode });
+      dispatch({ type: "SET_TOOL_PANEL_MODE", payload: preferredMode });
     }
   }, [preferences.defaultToolPanelMode, state.toolPanelMode]);
 
+  // Apply default startup view preference on initial load.
+  // This runs once to navigate to the user's preferred tab (read/automate)
+  // instead of always starting on the tools tab.
+  const hasAppliedStartupView = React.useRef(false);
+  useEffect(() => {
+    if (hasAppliedStartupView.current) return;
+    const startupView = preferences.defaultStartupView;
+    if (startupView === "read") {
+      hasAppliedStartupView.current = true;
+      setReaderMode(true);
+      actions.setSelectedTool("read");
+    } else if (startupView === "automate") {
+      hasAppliedStartupView.current = true;
+      actions.setSelectedTool("automate");
+      setLeftPanelView("toolContent");
+    }
+    // 'tools' is the default — no action needed
+    if (startupView === "tools") {
+      hasAppliedStartupView.current = true;
+    }
+  }, [
+    preferences.defaultStartupView,
+    actions,
+    setReaderMode,
+    setLeftPanelView,
+  ]);
+
   // Tool reset methods
-  const registerToolReset = useCallback((toolId: string, resetFunction: () => void) => {
-    setToolResetFunctions(prev => ({ ...prev, [toolId]: resetFunction }));
-  }, []);
+  const registerToolReset = useCallback(
+    (toolId: string, resetFunction: () => void) => {
+      setToolResetFunctions((prev) => ({ ...prev, [toolId]: resetFunction }));
+    },
+    [],
+  );
 
   const resetTool = useCallback((toolId: string) => {
     // Use the current state directly instead of depending on the state in the closure
-    setToolResetFunctions(current => {
+    setToolResetFunctions((current) => {
       const resetFunction = current[toolId];
       if (resetFunction) {
         resetFunction();
@@ -275,83 +375,112 @@ export function ToolWorkflowProvider({ children }: ToolWorkflowProviderProps) {
   }, []); // Empty dependency array makes this stable
 
   // Workflow actions (compound actions that coordinate multiple state changes)
-  const handleToolSelect = useCallback((toolId: ToolId) => {
-    const availabilityInfo = toolAvailability[toolId];
-    const isExplicitlyDisabled = availabilityInfo ? availabilityInfo.available === false : false;
-    if (toolId !== 'read' && toolId !== 'multiTool' && isExplicitlyDisabled) {
-      return;
-    }
+  const handleToolSelect = useCallback(
+    (toolId: ToolId) => {
+      const availabilityInfo = toolAvailability[toolId];
+      const isExplicitlyDisabled = availabilityInfo
+        ? availabilityInfo.available === false
+        : false;
+      if (toolId !== "read" && toolId !== "multiTool" && isExplicitlyDisabled) {
+        return;
+      }
 
-    // Guard: if there are unsaved changes and we're switching away from the current tool,
-    // show the save modal before proceeding.
-    const hasUnsavedChanges = navigationState.hasUnsavedChanges;
-    if (hasUnsavedChanges && navigationState.selectedTool && navigationState.selectedTool !== toolId) {
-      actions.requestNavigation(() => handleToolSelect(toolId));
-      return;
-    }
+      // Guard: if there are unsaved changes and we're switching away from the current tool,
+      // show the save modal before proceeding.
+      const hasUnsavedChanges = navigationState.hasUnsavedChanges;
+      if (
+        hasUnsavedChanges &&
+        navigationState.selectedTool &&
+        navigationState.selectedTool !== toolId
+      ) {
+        actions.requestNavigation(() => handleToolSelect(toolId));
+        return;
+      }
 
-    // If we're currently on a custom workbench (e.g., Validate Signature report),
-    // selecting any tool should take the user back to the default file manager view.
-    const wasInCustomWorkbench = !isBaseWorkbench(navigationState.workbench);
+      // If we're currently on a custom workbench (e.g., Validate Signature report),
+      // selecting any tool should take the user back to the default file manager view.
+      const wasInCustomWorkbench = !isBaseWorkbench(navigationState.workbench);
 
-    // Handle read tool selection - should behave exactly like QuickAccessBar read button
-    if (toolId === 'read') {
-      setReaderMode(true);
-      actions.setSelectedTool('read');
-      actions.setWorkbench(wasInCustomWorkbench ? getDefaultWorkbench() : 'viewer');
-      setSearchQuery('');
-      return;
-    }
+      // Handle read tool selection - should behave exactly like QuickAccessBar read button
+      if (toolId === "read") {
+        setReaderMode(true);
+        actions.setSelectedTool("read");
+        actions.setWorkbench(
+          wasInCustomWorkbench ? getDefaultWorkbench() : "viewer",
+        );
+        setSearchQuery("");
+        return;
+      }
 
-    // Handle multiTool selection - enable page editor workbench
-    if (toolId === 'multiTool') {
+      // Handle multiTool selection - enable page editor workbench
+      if (toolId === "multiTool") {
+        setReaderMode(false);
+        setLeftPanelView("hidden");
+        actions.setSelectedTool("multiTool");
+        actions.setWorkbench(
+          wasInCustomWorkbench ? getDefaultWorkbench() : "pageEditor",
+        );
+        setSearchQuery("");
+        return;
+      }
+
+      // Set the selected tool and determine the appropriate workbench
+      const validToolId = isValidToolId(toolId) ? toolId : null;
+      actions.setSelectedTool(validToolId);
+
+      // Switch workbench only when required: leaving a custom view, or the tool declares one.
+      const tool = getSelectedTool(toolId);
+      if (wasInCustomWorkbench) {
+        actions.setWorkbench(getDefaultWorkbench());
+      } else if (tool && tool.workbench) {
+        actions.setWorkbench(tool.workbench);
+      }
+
+      // Clear search query when selecting a tool
+      setSearchQuery("");
+      setLeftPanelView("toolContent");
+      setReaderMode(false); // Disable read mode when selecting tools
+    },
+    [
+      actions,
+      getSelectedTool,
+      navigationState.workbench,
+      navigationState.hasUnsavedChanges,
+      navigationState.selectedTool,
+      setLeftPanelView,
+      setReaderMode,
+      setSearchQuery,
+      toolAvailability,
+    ],
+  );
+
+  const handleToolSelectForced = useCallback(
+    (toolId: ToolId) => {
+      const validToolId = isValidToolId(toolId) ? toolId : null;
+      actions.setSelectedTool(validToolId);
+      const tool = getSelectedTool(toolId);
+      const wasInCustomWorkbench = !isBaseWorkbench(navigationState.workbench);
+      if (wasInCustomWorkbench) {
+        actions.setWorkbench(getDefaultWorkbench());
+      } else if (tool && tool.workbench) {
+        actions.setWorkbench(tool.workbench);
+      }
+      setSearchQuery("");
+      setLeftPanelView("toolContent");
       setReaderMode(false);
-      setLeftPanelView('hidden');
-      actions.setSelectedTool('multiTool');
-      actions.setWorkbench(wasInCustomWorkbench ? getDefaultWorkbench() : 'pageEditor');
-      setSearchQuery('');
-      return;
-    }
-
-    // Set the selected tool and determine the appropriate workbench
-    const validToolId = isValidToolId(toolId) ? toolId : null;
-    actions.setSelectedTool(validToolId);
-
-    // Get the tool from registry to determine workbench
-    const tool = getSelectedTool(toolId);
-    if (wasInCustomWorkbench) {
-      actions.setWorkbench(getDefaultWorkbench());
-    } else if (tool && tool.workbench) {
-      actions.setWorkbench(tool.workbench);
-    } else {
-      actions.setWorkbench(getDefaultWorkbench());
-    }
-
-    // Clear search query when selecting a tool
-    setSearchQuery('');
-    setLeftPanelView('toolContent');
-    setReaderMode(false); // Disable read mode when selecting tools
-  }, [actions, getSelectedTool, navigationState.workbench, navigationState.hasUnsavedChanges, navigationState.selectedTool, setLeftPanelView, setReaderMode, setSearchQuery, toolAvailability]);
-
-  const handleToolSelectForced = useCallback((toolId: ToolId) => {
-    const validToolId = isValidToolId(toolId) ? toolId : null;
-    actions.setSelectedTool(validToolId);
-    const tool = getSelectedTool(toolId);
-    const wasInCustomWorkbench = !isBaseWorkbench(navigationState.workbench);
-    if (wasInCustomWorkbench) {
-      actions.setWorkbench(getDefaultWorkbench());
-    } else if (tool && tool.workbench) {
-      actions.setWorkbench(tool.workbench);
-    } else {
-      actions.setWorkbench(getDefaultWorkbench());
-    }
-    setSearchQuery('');
-    setLeftPanelView('toolContent');
-    setReaderMode(false);
-  }, [actions, getSelectedTool, navigationState.workbench, setLeftPanelView, setReaderMode, setSearchQuery]);
+    },
+    [
+      actions,
+      getSelectedTool,
+      navigationState.workbench,
+      setLeftPanelView,
+      setReaderMode,
+      setSearchQuery,
+    ],
+  );
 
   const handleBackToTools = useCallback(() => {
-    setLeftPanelView('toolPicker');
+    setLeftPanelView("toolPicker");
     setReaderMode(false);
     actions.setSelectedTool(null);
   }, [setLeftPanelView, setReaderMode, actions.setSelectedTool]);
@@ -366,9 +495,12 @@ export function ToolWorkflowProvider({ children }: ToolWorkflowProviderProps) {
     return filterToolRegistryByQuery(toolRegistry, state.searchQuery);
   }, [toolRegistry, state.searchQuery]);
 
-  const isPanelVisible = useMemo(() =>
-    state.sidebarsVisible && !state.readerMode && state.leftPanelView !== 'hidden',
-    [state.sidebarsVisible, state.readerMode, state.leftPanelView]
+  const isPanelVisible = useMemo(
+    () =>
+      state.sidebarsVisible &&
+      !state.readerMode &&
+      state.leftPanelView !== "hidden",
+    [state.sidebarsVisible, state.readerMode, state.leftPanelView],
   );
 
   useNavigationUrlSync(
@@ -376,87 +508,90 @@ export function ToolWorkflowProvider({ children }: ToolWorkflowProviderProps) {
     handleToolSelect,
     handleBackToTools,
     allTools,
-    true
+    true,
   );
 
   // Properly memoized context value
-  const contextValue = useMemo((): ToolWorkflowContextValue => ({
-    // State
-    ...state,
-    selectedToolKey: navigationState.selectedTool,
-    selectedTool,
-    toolRegistry,
-    getSelectedTool,
+  const contextValue = useMemo(
+    (): ToolWorkflowContextValue => ({
+      // State
+      ...state,
+      selectedToolKey: navigationState.selectedTool,
+      selectedTool,
+      toolRegistry,
+      getSelectedTool,
 
-    // Actions
-    setSidebarsVisible,
-    setLeftPanelView,
-    setReaderMode,
-    setToolPanelMode,
-    setPreviewFile,
-    setPageEditorFunctions,
-    setSearchQuery,
-    selectTool: actions.setSelectedTool,
-    clearToolSelection: () => actions.setSelectedTool(null),
+      // Actions
+      setSidebarsVisible,
+      setLeftPanelView,
+      setReaderMode,
+      setToolPanelMode,
+      setPreviewFile,
+      setPageEditorFunctions,
+      setSearchQuery,
+      selectTool: actions.setSelectedTool,
+      clearToolSelection: () => actions.setSelectedTool(null),
 
-    // Tool Reset Actions
-    toolResetFunctions,
-    registerToolReset,
-    resetTool,
-    toolAvailability,
+      // Tool Reset Actions
+      toolResetFunctions,
+      registerToolReset,
+      resetTool,
+      toolAvailability,
 
-    // Workflow Actions
-    handleToolSelect,
-    handleToolSelectForced,
-    handleBackToTools,
-    handleReaderToggle,
+      // Workflow Actions
+      handleToolSelect,
+      handleToolSelectForced,
+      handleBackToTools,
+      handleReaderToggle,
 
-    // Computed
-    filteredTools,
-    isPanelVisible,
+      // Computed
+      filteredTools,
+      isPanelVisible,
 
-    // Tool History
-    favoriteTools,
-    toggleFavorite,
-    isFavorite,
+      // Tool History
+      favoriteTools,
+      toggleFavorite,
+      isFavorite,
 
-    // Custom workbench views
-    customWorkbenchViews,
-    registerCustomWorkbenchView,
-    unregisterCustomWorkbenchView,
-    setCustomWorkbenchViewData,
-    clearCustomWorkbenchViewData,
-  }), [
-    state,
-    navigationState.selectedTool,
-    selectedTool,
-    toolRegistry,
-    getSelectedTool,
-    toolAvailability,
-    setSidebarsVisible,
-    setLeftPanelView,
-    setReaderMode,
-    setToolPanelMode,
-    setPreviewFile,
-    setPageEditorFunctions,
-    setSearchQuery,
-    actions.setSelectedTool,
-    registerToolReset,
-    resetTool,
-    handleToolSelect,
-    handleBackToTools,
-    handleReaderToggle,
-    filteredTools,
-    isPanelVisible,
-    favoriteTools,
-    toggleFavorite,
-    isFavorite,
-    customWorkbenchViews,
-    registerCustomWorkbenchView,
-    unregisterCustomWorkbenchView,
-    setCustomWorkbenchViewData,
-    clearCustomWorkbenchViewData,
-  ]);
+      // Custom workbench views
+      customWorkbenchViews,
+      registerCustomWorkbenchView,
+      unregisterCustomWorkbenchView,
+      setCustomWorkbenchViewData,
+      clearCustomWorkbenchViewData,
+    }),
+    [
+      state,
+      navigationState.selectedTool,
+      selectedTool,
+      toolRegistry,
+      getSelectedTool,
+      toolAvailability,
+      setSidebarsVisible,
+      setLeftPanelView,
+      setReaderMode,
+      setToolPanelMode,
+      setPreviewFile,
+      setPageEditorFunctions,
+      setSearchQuery,
+      actions.setSelectedTool,
+      registerToolReset,
+      resetTool,
+      handleToolSelect,
+      handleBackToTools,
+      handleReaderToggle,
+      filteredTools,
+      isPanelVisible,
+      favoriteTools,
+      toggleFavorite,
+      isFavorite,
+      customWorkbenchViews,
+      registerCustomWorkbenchView,
+      unregisterCustomWorkbenchView,
+      setCustomWorkbenchViewData,
+      clearCustomWorkbenchViewData,
+    ],
+  );
 
   return (
     <ToolWorkflowContext.Provider value={contextValue}>
@@ -469,8 +604,13 @@ export function ToolWorkflowProvider({ children }: ToolWorkflowProviderProps) {
 export function useToolWorkflow(): ToolWorkflowContextValue {
   const context = useContext(ToolWorkflowContext);
   if (!context) {
-    console.error('ToolWorkflowContext not found. Current stack:', new Error().stack);
-    throw new Error('useToolWorkflow must be used within a ToolWorkflowProvider');
+    console.error(
+      "ToolWorkflowContext not found. Current stack:",
+      new Error().stack,
+    );
+    throw new Error(
+      "useToolWorkflow must be used within a ToolWorkflowProvider",
+    );
   }
   return context;
-}
\ No newline at end of file
+}
diff --git a/frontend/src/core/contexts/TourOrchestrationContext.tsx b/frontend/src/core/contexts/TourOrchestrationContext.tsx
index 2c5b9dda52..1a338b6b59 100644
--- a/frontend/src/core/contexts/TourOrchestrationContext.tsx
+++ b/frontend/src/core/contexts/TourOrchestrationContext.tsx
@@ -1,12 +1,12 @@
-import React, { createContext, useContext, useCallback, useRef } from 'react';
-import { BASE_PATH } from '@app/constants/app';
-import { useFileHandler } from '@app/hooks/useFileHandler';
-import { useFilesModalContext } from '@app/contexts/FilesModalContext';
-import { useNavigationActions } from '@app/contexts/NavigationContext';
-import { useToolWorkflow } from '@app/contexts/ToolWorkflowContext';
-import { useAllFiles, useFileManagement } from '@app/contexts/FileContext';
-import { StirlingFile } from '@app/types/fileContext';
-import { fileStorage } from '@app/services/fileStorage';
+import React, { createContext, useContext, useCallback, useRef } from "react";
+import { BASE_PATH } from "@app/constants/app";
+import { useFileHandler } from "@app/hooks/useFileHandler";
+import { useFilesModalContext } from "@app/contexts/FilesModalContext";
+import { useNavigationActions } from "@app/contexts/NavigationContext";
+import { useToolWorkflow } from "@app/contexts/ToolWorkflowContext";
+import { useAllFiles, useFileManagement } from "@app/contexts/FileContext";
+import { StirlingFile } from "@app/types/fileContext";
+import { fileStorage } from "@app/services/fileStorage";
 
 interface TourOrchestrationContextType {
   // State management
@@ -38,9 +38,13 @@ interface TourOrchestrationContextType {
   executeTool: () => void;
 }
 
-const TourOrchestrationContext = createContext<TourOrchestrationContextType | undefined>(undefined);
+const TourOrchestrationContext = createContext<
+  TourOrchestrationContextType | undefined
+>(undefined);
 
-export const TourOrchestrationProvider: React.FC<{ children: React.ReactNode }> = ({ children }) => {
+export const TourOrchestrationProvider: React.FC<{
+  children: React.ReactNode;
+}> = ({ children }) => {
   const { addFiles } = useFileHandler();
   const { closeFilesModal } = useFilesModalContext();
   const { actions: navActions } = useNavigationActions();
@@ -60,14 +64,17 @@ export const TourOrchestrationProvider: React.FC<{ children: React.ReactNode }>
   const saveWorkbenchState = useCallback(() => {
     // Get fresh files from ref
     const currentFiles = filesRef.current;
-    console.log('Saving workbench state, files count:', currentFiles.length);
+    console.log("Saving workbench state, files count:", currentFiles.length);
     savedFilesRef.current = [...currentFiles];
     // Clear all files for clean demo
     clearAllFiles();
   }, [clearAllFiles]);
 
   const restoreWorkbenchState = useCallback(async () => {
-    console.log('Restoring workbench state, saved files count:', savedFilesRef.current.length);
+    console.log(
+      "Restoring workbench state, saved files count:",
+      savedFilesRef.current.length,
+    );
 
     // Go back to Tools
     handleBackToTools();
@@ -79,10 +86,14 @@ export const TourOrchestrationProvider: React.FC<{ children: React.ReactNode }>
     const currentFiles = filesRef.current;
     if (currentFiles.length > 0) {
       try {
-        await Promise.all(currentFiles.map(file => fileStorage.deleteStirlingFile(file.fileId)));
+        await Promise.all(
+          currentFiles.map((file) =>
+            fileStorage.deleteStirlingFile(file.fileId),
+          ),
+        );
         console.log(`Deleted ${currentFiles.length} file(s) from storage`);
       } catch (error) {
-        console.error('Failed to delete files from storage:', error);
+        console.error("Failed to delete files from storage:", error);
       }
     }
 
@@ -92,10 +103,16 @@ export const TourOrchestrationProvider: React.FC<{ children: React.ReactNode }>
       const filesToRestore = await Promise.all(
         savedFilesRef.current.map(async (sf) => {
           const buffer = await sf.arrayBuffer();
-          return new File([buffer], sf.name, { type: sf.type, lastModified: sf.lastModified });
-        })
+          return new File([buffer], sf.name, {
+            type: sf.type,
+            lastModified: sf.lastModified,
+          });
+        }),
+      );
+      console.log(
+        "Restoring files:",
+        filesToRestore.map((f) => f.name),
       );
-      console.log('Restoring files:', filesToRestore.map(f => f.name));
       await addFiles(filesToRestore);
       savedFilesRef.current = [];
     }
@@ -106,7 +123,7 @@ export const TourOrchestrationProvider: React.FC<{ children: React.ReactNode }>
   }, [handleBackToTools]);
 
   const selectCropTool = useCallback(() => {
-    handleToolSelect('crop');
+    handleToolSelect("crop");
   }, [handleToolSelect]);
 
   const loadSampleFile = useCallback(async () => {
@@ -115,34 +132,36 @@ export const TourOrchestrationProvider: React.FC<{ children: React.ReactNode }>
       closeFilesModal();
       const response = await fetch(`${BASE_PATH}/samples/Sample.pdf`);
       const blob = await response.blob();
-      const file = new File([blob], 'Sample.pdf', { type: 'application/pdf' });
+      const file = new File([blob], "Sample.pdf", { type: "application/pdf" });
 
       await addFiles([file]);
       closeFilesModal();
     } catch (error) {
-      console.error('Failed to load sample file:', error);
+      console.error("Failed to load sample file:", error);
     }
   }, [addFiles, closeFilesModal]);
 
   const switchToViewer = useCallback(() => {
-    navActions.setWorkbench('viewer');
+    navActions.setWorkbench("viewer");
   }, [navActions]);
 
   const switchToPageEditor = useCallback(() => {
-    navActions.setWorkbench('pageEditor');
+    navActions.setWorkbench("pageEditor");
   }, [navActions]);
 
   const switchToActiveFiles = useCallback(() => {
-    navActions.setWorkbench('fileEditor');
+    navActions.setWorkbench("fileEditor");
   }, [navActions]);
 
   const selectFirstFile = useCallback(() => {
     // File selection is handled by FileCard onClick
     // This function could trigger a click event on the first file card
-    const firstFileCard = document.querySelector('[data-tour="file-card-checkbox"]') as HTMLElement;
+    const firstFileCard = document.querySelector(
+      '[data-tour="file-card-checkbox"]',
+    ) as HTMLElement;
     if (firstFileCard) {
       // Check if already selected (data-selected attribute)
-      const isSelected = firstFileCard.getAttribute('data-selected') === 'true';
+      const isSelected = firstFileCard.getAttribute("data-selected") === "true";
       // Only click if not already selected (to avoid toggling off)
       if (!isSelected) {
         firstFileCard.click();
@@ -152,7 +171,9 @@ export const TourOrchestrationProvider: React.FC<{ children: React.ReactNode }>
 
   const pinFile = useCallback(() => {
     // Click the pin button directly
-    const pinButton = document.querySelector('[data-tour="file-card-pin"]') as HTMLElement;
+    const pinButton = document.querySelector(
+      '[data-tour="file-card-pin"]',
+    ) as HTMLElement;
     if (pinButton) {
       pinButton.click();
     }
@@ -160,20 +181,22 @@ export const TourOrchestrationProvider: React.FC<{ children: React.ReactNode }>
 
   const modifyCropSettings = useCallback(() => {
     // Dispatch a custom event to modify crop settings
-    const event = new CustomEvent('tour:setCropArea', {
+    const event = new CustomEvent("tour:setCropArea", {
       detail: {
         x: 80,
         y: 435,
         width: 440,
         height: 170,
-      }
+      },
     });
     window.dispatchEvent(event);
   }, []);
 
   const executeTool = useCallback(() => {
     // Trigger the run button click
-    const runButton = document.querySelector('[data-tour="run-button"]') as HTMLElement;
+    const runButton = document.querySelector(
+      '[data-tour="run-button"]',
+    ) as HTMLElement;
     if (runButton) {
       runButton.click();
     }
@@ -204,7 +227,9 @@ export const TourOrchestrationProvider: React.FC<{ children: React.ReactNode }>
 export const useTourOrchestration = (): TourOrchestrationContextType => {
   const context = useContext(TourOrchestrationContext);
   if (!context) {
-    throw new Error('useTourOrchestration must be used within TourOrchestrationProvider');
+    throw new Error(
+      "useTourOrchestration must be used within TourOrchestrationProvider",
+    );
   }
   return context;
 };
diff --git a/frontend/src/core/contexts/UnsavedChangesContext.tsx b/frontend/src/core/contexts/UnsavedChangesContext.tsx
index 057239400a..51ca85371d 100644
--- a/frontend/src/core/contexts/UnsavedChangesContext.tsx
+++ b/frontend/src/core/contexts/UnsavedChangesContext.tsx
@@ -1,6 +1,12 @@
-import React, { createContext, useContext, useState, useCallback, ReactNode } from 'react';
-import { Modal, Text, Button, Group, Stack } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
+import React, {
+  createContext,
+  useContext,
+  useState,
+  useCallback,
+  ReactNode,
+} from "react";
+import { Modal, Text, Button, Group, Stack } from "@mantine/core";
+import { useTranslation } from "react-i18next";
 
 interface UnsavedChangesContextType {
   isDirty: boolean;
@@ -16,17 +22,23 @@ interface UnsavedChangesContextType {
   markClean: () => void;
 }
 
-const UnsavedChangesContext = createContext<UnsavedChangesContextType | undefined>(undefined);
+const UnsavedChangesContext = createContext<
+  UnsavedChangesContextType | undefined
+>(undefined);
 
 interface UnsavedChangesProviderProps {
   children: ReactNode;
 }
 
-export function UnsavedChangesProvider({ children }: UnsavedChangesProviderProps) {
+export function UnsavedChangesProvider({
+  children,
+}: UnsavedChangesProviderProps) {
   const { t } = useTranslation();
   const [isDirty, setIsDirty] = useState(false);
   const [modalOpen, setModalOpen] = useState(false);
-  const [resolvePromise, setResolvePromise] = useState<((value: boolean) => void) | null>(null);
+  const [resolvePromise, setResolvePromise] = useState<
+    ((value: boolean) => void) | null
+  >(null);
 
   const confirmIfDirty = useCallback((): Promise<boolean> => {
     if (!isDirty) {
@@ -57,26 +69,31 @@ export function UnsavedChangesProvider({ children }: UnsavedChangesProviderProps
   };
 
   return (
-    <UnsavedChangesContext.Provider value={{ isDirty, setIsDirty, confirmIfDirty, markClean }}>
+    <UnsavedChangesContext.Provider
+      value={{ isDirty, setIsDirty, confirmIfDirty, markClean }}
+    >
       {children}
       <Modal
         opened={modalOpen}
         onClose={handleCancel}
-        title={t('admin.settings.unsavedChanges.title', 'Unsaved Changes')}
+        title={t("admin.settings.unsavedChanges.title", "Unsaved Changes")}
         centered
         size="sm"
         zIndex={1500}
       >
         <Stack gap="md">
           <Text size="sm">
-            {t('admin.settings.unsavedChanges.message', 'You have unsaved changes. Do you want to discard them?')}
+            {t(
+              "admin.settings.unsavedChanges.message",
+              "You have unsaved changes. Do you want to discard them?",
+            )}
           </Text>
           <Group justify="flex-end" gap="sm">
             <Button variant="default" onClick={handleCancel}>
-              {t('admin.settings.unsavedChanges.cancel', 'Keep Editing')}
+              {t("admin.settings.unsavedChanges.cancel", "Keep Editing")}
             </Button>
             <Button color="red" onClick={handleDiscard}>
-              {t('admin.settings.unsavedChanges.discard', 'Discard Changes')}
+              {t("admin.settings.unsavedChanges.discard", "Discard Changes")}
             </Button>
           </Group>
         </Stack>
@@ -88,8 +105,9 @@ export function UnsavedChangesProvider({ children }: UnsavedChangesProviderProps
 export function useUnsavedChanges(): UnsavedChangesContextType {
   const context = useContext(UnsavedChangesContext);
   if (!context) {
-    throw new Error('useUnsavedChanges must be used within an UnsavedChangesProvider');
+    throw new Error(
+      "useUnsavedChanges must be used within an UnsavedChangesProvider",
+    );
   }
   return context;
 }
-
diff --git a/frontend/src/core/contexts/ViewerContext.tsx b/frontend/src/core/contexts/ViewerContext.tsx
index 566288c845..4a6931b7c8 100644
--- a/frontend/src/core/contexts/ViewerContext.tsx
+++ b/frontend/src/core/contexts/ViewerContext.tsx
@@ -5,9 +5,12 @@ import React, {
   ReactNode,
   useRef,
   useCallback,
-} from 'react';
-import { useNavigation } from '@app/contexts/NavigationContext';
-import { preferencesService, type PdfRenderMode } from '@app/services/preferencesService';
+} from "react";
+import { useNavigation } from "@app/contexts/NavigationContext";
+import {
+  preferencesService,
+  type PdfRenderMode,
+} from "@app/services/preferencesService";
 import {
   createViewerActions,
   ScrollActions,
@@ -21,7 +24,7 @@ import {
   BookmarkActions,
   AttachmentActions,
   PrintActions,
-} from '@app/contexts/viewer/viewerActions';
+} from "@app/contexts/viewer/viewerActions";
 import {
   BridgeRef,
   BridgeApiMap,
@@ -43,8 +46,8 @@ import {
   AttachmentState,
   DocumentPermissionsState,
   PdfPermissionFlag,
-} from '@app/contexts/viewer/viewerBridges';
-import { SpreadMode } from '@embedpdf/plugin-spread/react';
+} from "@app/contexts/viewer/viewerBridges";
+import { SpreadMode } from "@embedpdf/plugin-spread/react";
 
 function useImmediateNotifier<Args extends unknown[]>() {
   const callbacksRef = useRef(new Set<(...args: Args) => void>());
@@ -57,11 +60,11 @@ function useImmediateNotifier<Args extends unknown[]>() {
   }, []);
 
   const trigger = useCallback((...args: Args) => {
-    callbacksRef.current.forEach(cb => {
+    callbacksRef.current.forEach((cb) => {
       try {
         cb(...args);
       } catch (error) {
-        console.error('Immediate callback error:', error);
+        console.error("Immediate callback error:", error);
       }
     });
   }, []);
@@ -99,9 +102,14 @@ export interface ViewerContextType {
     documentId: string;
     pageIndex: number;
     annotationId: string;
-    action: 'focus' | 'highlight';
+    action: "focus" | "highlight";
   } | null;
-  requestCommentFocus: (documentId: string, pageIndex: number, annotationId: string, hasContent: boolean) => void;
+  requestCommentFocus: (
+    documentId: string,
+    pageIndex: number,
+    annotationId: string,
+    hasContent: boolean,
+  ) => void;
   clearHighlightCommentRequest: () => void;
 
   // Search interface visibility
@@ -120,7 +128,9 @@ export interface ViewerContextType {
   isAnnotationMode: boolean;
   setAnnotationMode: (enabled: boolean) => void;
 
-  // Active file index for multi-file viewing
+  // Active file tracking — ID is the stable source of truth; index is derived from it
+  activeFileId: string | null;
+  setActiveFileId: (id: string | null) => void;
   activeFileIndex: number;
   setActiveFileIndex: (index: number) => void;
 
@@ -142,15 +152,29 @@ export interface ViewerContextType {
   hasPermission: (flag: PdfPermissionFlag) => boolean;
 
   // Immediate update callbacks
-  registerImmediateZoomUpdate: (callback: (percent: number) => void) => () => void;
-  registerImmediateScrollUpdate: (callback: (currentPage: number, totalPages: number) => void) => () => void;
-  registerImmediateSpreadUpdate: (callback: (mode: SpreadMode, isDualPage: boolean) => void) => () => void;
-  registerImmediatePanUpdate: (callback: (isPanning: boolean) => void) => () => void;
+  registerImmediateZoomUpdate: (
+    callback: (percent: number) => void,
+  ) => () => void;
+  registerImmediateScrollUpdate: (
+    callback: (currentPage: number, totalPages: number) => void,
+  ) => () => void;
+  registerImmediateSpreadUpdate: (
+    callback: (mode: SpreadMode, isDualPage: boolean) => void,
+  ) => () => void;
+  registerImmediatePanUpdate: (
+    callback: (isPanning: boolean) => void,
+  ) => () => void;
 
   // Internal - for bridges to trigger immediate updates
-  triggerImmediateScrollUpdate: (currentPage: number, totalPages: number) => void;
+  triggerImmediateScrollUpdate: (
+    currentPage: number,
+    totalPages: number,
+  ) => void;
   triggerImmediateZoomUpdate: (zoomPercent: number) => void;
-  triggerImmediateSpreadUpdate: (mode: SpreadMode, isDualPage?: boolean) => void;
+  triggerImmediateSpreadUpdate: (
+    mode: SpreadMode,
+    isDualPage?: boolean,
+  ) => void;
   triggerImmediatePanUpdate: (isPanning: boolean) => void;
 
   // Action handlers - call EmbedPDF APIs directly
@@ -169,7 +193,7 @@ export interface ViewerContextType {
   // Bridge registration - internal use by bridges
   registerBridge: <K extends BridgeKey>(
     type: K,
-    ref: BridgeRef<BridgeStateMap[K], BridgeApiMap[K]> | null
+    ref: BridgeRef<BridgeStateMap[K], BridgeApiMap[K]> | null,
   ) => void;
 
   // Save changes function - registered by EmbedPdfViewer
@@ -189,24 +213,29 @@ interface ViewerProviderProps {
 
 export const ViewerProvider: React.FC<ViewerProviderProps> = ({ children }) => {
   // UI state - only state directly managed by this context
-  const [isThumbnailSidebarVisible, setIsThumbnailSidebarVisible] = useState(false);
-  const [isBookmarkSidebarVisible, setIsBookmarkSidebarVisible] = useState(false);
-  const [isAttachmentSidebarVisible, setIsAttachmentSidebarVisible] = useState(false);
+  const [isThumbnailSidebarVisible, setIsThumbnailSidebarVisible] =
+    useState(false);
+  const [isBookmarkSidebarVisible, setIsBookmarkSidebarVisible] =
+    useState(false);
+  const [isAttachmentSidebarVisible, setIsAttachmentSidebarVisible] =
+    useState(false);
   const [isLayerSidebarVisible, setIsLayerSidebarVisible] = useState(false);
   const [hasLayers, setHasLayers] = useState(false);
-  const [isCommentsSidebarVisible, setIsCommentsSidebarVisible] = useState(false);
+  const [isCommentsSidebarVisible, setIsCommentsSidebarVisible] =
+    useState(false);
   const [highlightCommentRequest, setHighlightCommentRequest] = useState<{
     documentId: string;
     pageIndex: number;
     annotationId: string;
-    action: 'focus' | 'highlight';
+    action: "focus" | "highlight";
   } | null>(null);
   const [isSearchInterfaceVisible, setSearchInterfaceVisible] = useState(false);
   const [isAnnotationsVisible, setIsAnnotationsVisible] = useState(true);
   const [isAnnotationMode, setIsAnnotationModeState] = useState(false);
+  const [activeFileId, setActiveFileId] = useState<string | null>(null);
   const [activeFileIndex, setActiveFileIndex] = useState(0);
-  const [pdfRenderMode, setPdfRenderModeState] = useState<PdfRenderMode>(
-    () => preferencesService.getPreference('pdfRenderMode')
+  const [pdfRenderMode, setPdfRenderModeState] = useState<PdfRenderMode>(() =>
+    preferencesService.getPreference("pdfRenderMode"),
   );
 
   // Get current navigation state to check if we're in sign mode
@@ -249,54 +278,54 @@ export const ViewerProvider: React.FC<ViewerProviderProps> = ({ children }) => {
     (percent: number) => {
       triggerImmediateZoomInternal(percent);
     },
-    [triggerImmediateZoomInternal]
+    [triggerImmediateZoomInternal],
   );
 
   const triggerImmediateScrollUpdate = useCallback(
     (currentPage: number, totalPages: number) => {
       triggerImmediateScrollInternal(currentPage, totalPages);
     },
-    [triggerImmediateScrollInternal]
+    [triggerImmediateScrollInternal],
   );
 
   const triggerImmediateSpreadUpdate = useCallback(
     (mode: SpreadMode, isDualPage: boolean = mode !== SpreadMode.None) => {
       triggerImmediateSpreadInternal(mode, isDualPage);
     },
-    [triggerImmediateSpreadInternal]
+    [triggerImmediateSpreadInternal],
   );
 
   const triggerImmediatePanUpdate = useCallback(
     (isPanning: boolean) => {
       triggerImmediatePanInternal(isPanning);
     },
-    [triggerImmediatePanInternal]
+    [triggerImmediatePanInternal],
   );
 
   const registerBridge = useCallback(
     <K extends BridgeKey>(
       type: K,
-      ref: BridgeRef<BridgeStateMap[K], BridgeApiMap[K]> | null
+      ref: BridgeRef<BridgeStateMap[K], BridgeApiMap[K]> | null,
     ) => {
       setBridgeRef(bridgeRefs.current, type, ref);
     },
-    []
+    [],
   );
 
   const toggleThumbnailSidebar = () => {
-    setIsThumbnailSidebarVisible(prev => !prev);
+    setIsThumbnailSidebarVisible((prev) => !prev);
   };
 
   const toggleBookmarkSidebar = () => {
-    setIsBookmarkSidebarVisible(prev => !prev);
+    setIsBookmarkSidebarVisible((prev) => !prev);
   };
 
   const toggleAttachmentSidebar = () => {
-    setIsAttachmentSidebarVisible(prev => !prev);
+    setIsAttachmentSidebarVisible((prev) => !prev);
   };
 
   const toggleLayerSidebar = () => {
-    setIsLayerSidebarVisible(prev => !prev);
+    setIsLayerSidebarVisible((prev) => !prev);
   };
 
   const setCommentsSidebarVisible = (visible: boolean) => {
@@ -304,20 +333,25 @@ export const ViewerProvider: React.FC<ViewerProviderProps> = ({ children }) => {
   };
 
   const toggleCommentsSidebar = () => {
-    setIsCommentsSidebarVisible(prev => !prev);
+    setIsCommentsSidebarVisible((prev) => !prev);
   };
 
   const requestCommentFocus = useCallback(
-    (documentId: string, pageIndex: number, annotationId: string, hasContent: boolean) => {
+    (
+      documentId: string,
+      pageIndex: number,
+      annotationId: string,
+      hasContent: boolean,
+    ) => {
       setIsCommentsSidebarVisible(true);
       setHighlightCommentRequest({
         documentId,
         pageIndex,
         annotationId,
-        action: hasContent ? 'highlight' : 'focus',
+        action: hasContent ? "highlight" : "focus",
       });
     },
-    []
+    [],
   );
 
   const clearHighlightCommentRequest = useCallback(() => {
@@ -327,11 +361,11 @@ export const ViewerProvider: React.FC<ViewerProviderProps> = ({ children }) => {
   const searchInterfaceActions = {
     open: () => setSearchInterfaceVisible(true),
     close: () => setSearchInterfaceVisible(false),
-    toggle: () => setSearchInterfaceVisible(prev => !prev),
+    toggle: () => setSearchInterfaceVisible((prev) => !prev),
   };
 
   const toggleAnnotationsVisibility = () => {
-    setIsAnnotationsVisible(prev => !prev);
+    setIsAnnotationsVisible((prev) => !prev);
   };
 
   const setAnnotationMode = (enabled: boolean) => {
@@ -339,21 +373,25 @@ export const ViewerProvider: React.FC<ViewerProviderProps> = ({ children }) => {
   };
 
   const cyclePdfRenderMode = useCallback(() => {
-    setPdfRenderModeState(prev => {
+    setPdfRenderModeState((prev) => {
       const next: PdfRenderMode =
-        prev === 'normal' ? 'dark' : prev === 'dark' ? 'sepia' : 'normal';
-      preferencesService.setPreference('pdfRenderMode', next);
+        prev === "normal" ? "dark" : prev === "dark" ? "sepia" : "normal";
+      preferencesService.setPreference("pdfRenderMode", next);
       return next;
     });
   }, []);
 
   // State getters - read from bridge refs
   const getScrollState = (): ScrollState => {
-    return bridgeRefs.current.scroll?.state || { currentPage: 1, totalPages: 0 };
+    return (
+      bridgeRefs.current.scroll?.state || { currentPage: 1, totalPages: 0 }
+    );
   };
 
   const getZoomState = (): ZoomState => {
-    return bridgeRefs.current.zoom?.state || { currentZoom: 1.4, zoomPercent: 140 };
+    return (
+      bridgeRefs.current.zoom?.state || { currentZoom: 1.4, zoomPercent: 140 }
+    );
   };
 
   const getPanState = (): PanState => {
@@ -365,7 +403,12 @@ export const ViewerProvider: React.FC<ViewerProviderProps> = ({ children }) => {
   };
 
   const getSpreadState = (): SpreadState => {
-    return bridgeRefs.current.spread?.state || { spreadMode: SpreadMode.None, isDualPage: false };
+    return (
+      bridgeRefs.current.spread?.state || {
+        spreadMode: SpreadMode.None,
+        isDualPage: false,
+      }
+    );
   };
 
   const getRotationState = (): RotationState => {
@@ -373,7 +416,9 @@ export const ViewerProvider: React.FC<ViewerProviderProps> = ({ children }) => {
   };
 
   const getSearchState = (): SearchState => {
-    return bridgeRefs.current.search?.state || { results: null, activeIndex: 0 };
+    return (
+      bridgeRefs.current.search?.state || { results: null, activeIndex: 0 }
+    );
   };
 
   const getThumbnailAPI = () => {
@@ -409,19 +454,21 @@ export const ViewerProvider: React.FC<ViewerProviderProps> = ({ children }) => {
   const hasAttachmentSupport = () => Boolean(bridgeRefs.current.attachment);
 
   const getDocumentPermissions = (): DocumentPermissionsState => {
-    return bridgeRefs.current.permissions?.state || {
-      isEncrypted: false,
-      isOwnerUnlocked: false,
-      permissions: PdfPermissionFlag.AllowAll,
-      canPrint: true,
-      canModifyContents: true,
-      canCopyContents: true,
-      canModifyAnnotations: true,
-      canFillForms: true,
-      canExtractForAccessibility: true,
-      canAssembleDocument: true,
-      canPrintHighQuality: true,
-    };
+    return (
+      bridgeRefs.current.permissions?.state || {
+        isEncrypted: false,
+        isOwnerUnlocked: false,
+        permissions: PdfPermissionFlag.AllowAll,
+        canPrint: true,
+        canModifyContents: true,
+        canCopyContents: true,
+        canModifyAnnotations: true,
+        canFillForms: true,
+        canExtractForAccessibility: true,
+        canAssembleDocument: true,
+        canPrintHighQuality: true,
+      }
+    );
   };
 
   const hasPermission = (flag: PdfPermissionFlag): boolean => {
@@ -430,8 +477,10 @@ export const ViewerProvider: React.FC<ViewerProviderProps> = ({ children }) => {
       return api.hasPermission(flag);
     }
     // Default: allow all permissions - warn in development
-    if (process.env.NODE_ENV === 'development') {
-      console.warn('[ViewerContext] Permissions API not available, defaulting to allow');
+    if (process.env.NODE_ENV === "development") {
+      console.warn(
+        "[ViewerContext] Permissions API not available, defaulting to allow",
+      );
     }
     return true;
   };
@@ -485,7 +534,9 @@ export const ViewerProvider: React.FC<ViewerProviderProps> = ({ children }) => {
     isAnnotationMode,
     setAnnotationMode,
 
-    // Active file index
+    // Active file tracking
+    activeFileId,
+    setActiveFileId,
     activeFileIndex,
     setActiveFileIndex,
 
@@ -542,16 +593,14 @@ export const ViewerProvider: React.FC<ViewerProviderProps> = ({ children }) => {
   };
 
   return (
-    <ViewerContext.Provider value={value}>
-      {children}
-    </ViewerContext.Provider>
+    <ViewerContext.Provider value={value}>{children}</ViewerContext.Provider>
   );
 };
 
 export const useViewer = (): ViewerContextType => {
   const context = useContext(ViewerContext);
   if (!context) {
-    throw new Error('useViewer must be used within a ViewerProvider');
+    throw new Error("useViewer must be used within a ViewerProvider");
   }
   return context;
 };
diff --git a/frontend/src/core/contexts/file/FileReducer.ts b/frontend/src/core/contexts/file/FileReducer.ts
index db567b1288..0af9ce9e42 100644
--- a/frontend/src/core/contexts/file/FileReducer.ts
+++ b/frontend/src/core/contexts/file/FileReducer.ts
@@ -2,18 +2,18 @@
  * FileContext reducer - Pure state management for file operations
  */
 
-import { FileId } from '@app/types/file';
+import { FileId } from "@app/types/file";
 import {
   FileContextState,
   FileContextAction,
-  StirlingFileStub
-} from '@app/types/fileContext';
+  StirlingFileStub,
+} from "@app/types/fileContext";
 
 // Initial state
 export const initialFileContextState: FileContextState = {
   files: {
     ids: [],
-    byId: {}
+    byId: {},
   },
   pinnedFiles: new Set(),
   ui: {
@@ -22,29 +22,33 @@ export const initialFileContextState: FileContextState = {
     isProcessing: false,
     processingProgress: 0,
     hasUnsavedChanges: false,
-    errorFileIds: []
-  }
+    errorFileIds: [],
+  },
 };
 
 // Helper function for consume/undo operations
 function processFileSwap(
   state: FileContextState,
   filesToRemove: FileId[],
-  filesToAdd: StirlingFileStub[]
+  filesToAdd: StirlingFileStub[],
 ): FileContextState {
   // Only remove unpinned files
-  const unpinnedRemoveIds = filesToRemove.filter(id => !state.pinnedFiles.has(id));
-  const remainingIds = state.files.ids.filter(id => !unpinnedRemoveIds.includes(id));
+  const unpinnedRemoveIds = filesToRemove.filter(
+    (id) => !state.pinnedFiles.has(id),
+  );
+  const remainingIds = state.files.ids.filter(
+    (id) => !unpinnedRemoveIds.includes(id),
+  );
 
   // Remove unpinned files from state
   const newById = { ...state.files.byId };
-  unpinnedRemoveIds.forEach(id => {
+  unpinnedRemoveIds.forEach((id) => {
     delete newById[id];
   });
 
   // Add new files
   const addedIds: FileId[] = [];
-  filesToAdd.forEach(record => {
+  filesToAdd.forEach((record) => {
     if (!newById[record.id]) {
       addedIds.push(record.id);
       newById[record.id] = record;
@@ -52,31 +56,36 @@ function processFileSwap(
   });
 
   // Clear selections that reference removed files and add new files to selection
-  const validSelectedFileIds = state.ui.selectedFileIds.filter(id => !unpinnedRemoveIds.includes(id));
+  const validSelectedFileIds = state.ui.selectedFileIds.filter(
+    (id) => !unpinnedRemoveIds.includes(id),
+  );
   const newSelectedFileIds = [...validSelectedFileIds, ...addedIds];
 
   return {
     ...state,
     files: {
       ids: [...addedIds, ...remainingIds],
-      byId: newById
+      byId: newById,
     },
     ui: {
       ...state.ui,
-      selectedFileIds: newSelectedFileIds
-    }
+      selectedFileIds: newSelectedFileIds,
+    },
   };
 }
 
 // Pure reducer function
-export function fileContextReducer(state: FileContextState, action: FileContextAction): FileContextState {
+export function fileContextReducer(
+  state: FileContextState,
+  action: FileContextAction,
+): FileContextState {
   switch (action.type) {
-    case 'ADD_FILES': {
+    case "ADD_FILES": {
       const { stirlingFileStubs } = action.payload;
       const newIds: FileId[] = [];
       const newById: Record<FileId, StirlingFileStub> = { ...state.files.byId };
 
-      stirlingFileStubs.forEach(record => {
+      stirlingFileStubs.forEach((record) => {
         // Only add if not already present (dedupe by stable ID)
         if (!newById[record.id]) {
           newIds.push(record.id);
@@ -88,38 +97,42 @@ export function fileContextReducer(state: FileContextState, action: FileContextA
         ...state,
         files: {
           ids: [...state.files.ids, ...newIds],
-          byId: newById
-        }
+          byId: newById,
+        },
       };
     }
 
-    case 'REMOVE_FILES': {
+    case "REMOVE_FILES": {
       const { fileIds } = action.payload;
-      const remainingIds = state.files.ids.filter(id => !fileIds.includes(id));
+      const remainingIds = state.files.ids.filter(
+        (id) => !fileIds.includes(id),
+      );
       const newById = { ...state.files.byId };
 
       // Remove files from state (resource cleanup handled by lifecycle manager)
-      fileIds.forEach(id => {
+      fileIds.forEach((id) => {
         delete newById[id];
       });
 
       // Clear selections that reference removed files
-      const validSelectedFileIds = state.ui.selectedFileIds.filter(id => !fileIds.includes(id));
+      const validSelectedFileIds = state.ui.selectedFileIds.filter(
+        (id) => !fileIds.includes(id),
+      );
 
       return {
         ...state,
         files: {
           ids: remainingIds,
-          byId: newById
+          byId: newById,
         },
         ui: {
           ...state.ui,
-          selectedFileIds: validSelectedFileIds
-        }
+          selectedFileIds: validSelectedFileIds,
+        },
       };
     }
 
-    case 'UPDATE_FILE_RECORD': {
+    case "UPDATE_FILE_RECORD": {
       const { id, updates } = action.payload;
       const existingRecord = state.files.byId[id];
 
@@ -129,7 +142,7 @@ export function fileContextReducer(state: FileContextState, action: FileContextA
 
       const updatedRecord = {
         ...existingRecord,
-        ...updates
+        ...updates,
       };
 
       return {
@@ -138,149 +151,153 @@ export function fileContextReducer(state: FileContextState, action: FileContextA
           ...state.files,
           byId: {
             ...state.files.byId,
-            [id]: updatedRecord
-          }
-        }
+            [id]: updatedRecord,
+          },
+        },
       };
     }
 
-    case 'REORDER_FILES': {
+    case "REORDER_FILES": {
       const { orderedFileIds } = action.payload;
 
       // Validate that all IDs exist in current state
-      const validIds = orderedFileIds.filter(id => state.files.byId[id]);
+      const validIds = orderedFileIds.filter((id) => state.files.byId[id]);
 
       // Reorder selected files by passed order
-      const selectedFileIds = orderedFileIds.filter(id => state.ui.selectedFileIds.includes(id));
+      const selectedFileIds = orderedFileIds.filter((id) =>
+        state.ui.selectedFileIds.includes(id),
+      );
 
       return {
         ...state,
         files: {
           ...state.files,
-          ids: validIds
+          ids: validIds,
         },
         ui: {
           ...state.ui,
           selectedFileIds,
-        }
+        },
       };
     }
 
-    case 'SET_SELECTED_FILES': {
+    case "SET_SELECTED_FILES": {
       const { fileIds } = action.payload;
       return {
         ...state,
         ui: {
           ...state.ui,
-          selectedFileIds: fileIds
-        }
+          selectedFileIds: fileIds,
+        },
       };
     }
 
-    case 'SET_SELECTED_PAGES': {
+    case "SET_SELECTED_PAGES": {
       const { pageNumbers } = action.payload;
       return {
         ...state,
         ui: {
           ...state.ui,
-          selectedPageNumbers: pageNumbers
-        }
+          selectedPageNumbers: pageNumbers,
+        },
       };
     }
 
-    case 'CLEAR_SELECTIONS': {
+    case "CLEAR_SELECTIONS": {
       return {
         ...state,
         ui: {
           ...state.ui,
           selectedFileIds: [],
-          selectedPageNumbers: []
-        }
+          selectedPageNumbers: [],
+        },
       };
     }
 
-    case 'SET_PROCESSING': {
+    case "SET_PROCESSING": {
       const { isProcessing, progress } = action.payload;
       return {
         ...state,
         ui: {
           ...state.ui,
           isProcessing,
-          processingProgress: progress
-        }
+          processingProgress: progress,
+        },
       };
     }
 
-    case 'SET_UNSAVED_CHANGES': {
+    case "SET_UNSAVED_CHANGES": {
       return {
         ...state,
         ui: {
           ...state.ui,
-          hasUnsavedChanges: action.payload.hasChanges
-        }
+          hasUnsavedChanges: action.payload.hasChanges,
+        },
       };
     }
 
-    case 'MARK_FILE_ERROR': {
+    case "MARK_FILE_ERROR": {
       const { fileId } = action.payload;
       if (state.ui.errorFileIds.includes(fileId)) return state;
       return {
         ...state,
-        ui: { ...state.ui, errorFileIds: [...state.ui.errorFileIds, fileId] }
+        ui: { ...state.ui, errorFileIds: [...state.ui.errorFileIds, fileId] },
       };
     }
 
-    case 'CLEAR_FILE_ERROR': {
+    case "CLEAR_FILE_ERROR": {
       const { fileId } = action.payload;
       return {
         ...state,
-        ui: { ...state.ui, errorFileIds: state.ui.errorFileIds.filter(id => id !== fileId) }
+        ui: {
+          ...state.ui,
+          errorFileIds: state.ui.errorFileIds.filter((id) => id !== fileId),
+        },
       };
     }
 
-    case 'CLEAR_ALL_FILE_ERRORS': {
+    case "CLEAR_ALL_FILE_ERRORS": {
       return {
         ...state,
-        ui: { ...state.ui, errorFileIds: [] }
+        ui: { ...state.ui, errorFileIds: [] },
       };
     }
 
-    case 'PIN_FILE': {
+    case "PIN_FILE": {
       const { fileId } = action.payload;
       const newPinnedFiles = new Set(state.pinnedFiles);
       newPinnedFiles.add(fileId);
 
       return {
         ...state,
-        pinnedFiles: newPinnedFiles
+        pinnedFiles: newPinnedFiles,
       };
     }
 
-    case 'UNPIN_FILE': {
+    case "UNPIN_FILE": {
       const { fileId } = action.payload;
       const newPinnedFiles = new Set(state.pinnedFiles);
       newPinnedFiles.delete(fileId);
 
       return {
         ...state,
-        pinnedFiles: newPinnedFiles
+        pinnedFiles: newPinnedFiles,
       };
     }
 
-    case 'CONSUME_FILES': {
+    case "CONSUME_FILES": {
       const { inputFileIds, outputStirlingFileStubs } = action.payload;
 
       return processFileSwap(state, inputFileIds, outputStirlingFileStubs);
     }
 
-
-    case 'UNDO_CONSUME_FILES': {
+    case "UNDO_CONSUME_FILES": {
       const { inputStirlingFileStubs, outputFileIds } = action.payload;
 
       return processFileSwap(state, outputFileIds, inputStirlingFileStubs);
     }
 
-    case 'RESET_CONTEXT': {
+    case "RESET_CONTEXT": {
       // Reset UI state to clean slate (resource cleanup handled by lifecycle manager)
       return { ...initialFileContextState };
     }
diff --git a/frontend/src/core/contexts/file/contexts.ts b/frontend/src/core/contexts/file/contexts.ts
index c37da46bbc..c17a178043 100644
--- a/frontend/src/core/contexts/file/contexts.ts
+++ b/frontend/src/core/contexts/file/contexts.ts
@@ -2,12 +2,19 @@
  * React contexts for file state and actions
  */
 
-import { createContext } from 'react';
-import { FileContextStateValue, FileContextActionsValue } from '@app/types/fileContext';
+import { createContext } from "react";
+import {
+  FileContextStateValue,
+  FileContextActionsValue,
+} from "@app/types/fileContext";
 
 // Split contexts for performance
-export const FileStateContext = createContext<FileContextStateValue | undefined>(undefined);
-export const FileActionsContext = createContext<FileContextActionsValue | undefined>(undefined);
+export const FileStateContext = createContext<
+  FileContextStateValue | undefined
+>(undefined);
+export const FileActionsContext = createContext<
+  FileContextActionsValue | undefined
+>(undefined);
 
 // Export types for use in hooks
-export type { FileContextStateValue, FileContextActionsValue };
\ No newline at end of file
+export type { FileContextStateValue, FileContextActionsValue };
diff --git a/frontend/src/core/contexts/file/fileActions.ts b/frontend/src/core/contexts/file/fileActions.ts
index 771247ef11..5d6188d821 100644
--- a/frontend/src/core/contexts/file/fileActions.ts
+++ b/frontend/src/core/contexts/file/fileActions.ts
@@ -11,15 +11,16 @@ import {
   createQuickKey,
   createStirlingFile,
   ProcessedFileMetadata,
-} from '@app/types/fileContext';
-import { FileId, ToolOperation } from '@app/types/file';
-import { generateThumbnailWithMetadata } from '@app/utils/thumbnailUtils';
-import { FileLifecycleManager } from '@app/contexts/file/lifecycle';
-import { buildQuickKeySet } from '@app/contexts/file/fileSelectors';
-import { StirlingFile } from '@app/types/fileContext';
-import { fileStorage } from '@app/services/fileStorage';
-import { zipFileService } from '@app/services/zipFileService';
-const DEBUG = process.env.NODE_ENV === 'development';
+} from "@app/types/fileContext";
+import { FileId, ToolOperation } from "@app/types/file";
+import { generateThumbnailWithMetadata } from "@app/utils/thumbnailUtils";
+import { FileLifecycleManager } from "@app/contexts/file/lifecycle";
+import { buildQuickKeySet } from "@app/contexts/file/fileSelectors";
+import { StirlingFile } from "@app/types/fileContext";
+import { fileStorage } from "@app/services/fileStorage";
+import { zipFileService } from "@app/services/zipFileService";
+import { FileAnalyzer } from "@app/services/fileAnalyzer";
+const DEBUG = process.env.NODE_ENV === "development";
 const HYDRATION_CONCURRENCY = 2;
 let activeHydrations = 0;
 const hydrationQueue: Array<() => Promise<void>> = [];
@@ -40,7 +41,7 @@ const drainHydrationQueue = (): void => {
   activeHydrations++;
   nextTask()
     .catch((error) => {
-      console.error('[Hydration] Task failed with error:', error);
+      console.error("[Hydration] Task failed with error:", error);
     })
     .finally(() => {
       activeHydrations--;
@@ -89,7 +90,7 @@ export function createProcessedFile(
   pageCount: number,
   thumbnail?: string,
   pageRotations?: number[],
-  pageDimensions?: Array<{ width: number; height: number }>
+  pageDimensions?: Array<{ width: number; height: number }>,
 ): ProcessedFileMetadata {
   return {
     totalPages: pageCount,
@@ -99,10 +100,10 @@ export function createProcessedFile(
       rotation: pageRotations?.[index] ?? 0,
       splitBefore: false,
       width: pageDimensions?.[index]?.width,
-      height: pageDimensions?.[index]?.height
+      height: pageDimensions?.[index]?.height,
     })),
     thumbnailUrl: thumbnail,
-    lastProcessed: Date.now()
+    lastProcessed: Date.now(),
   };
 }
 
@@ -110,9 +111,11 @@ export function createProcessedFile(
  * Generate fresh ProcessedFileMetadata for a file
  * Used when tools process files to ensure metadata matches actual file content
  */
-export async function generateProcessedFileMetadata(file: File): Promise<ProcessedFileMetadata | undefined> {
+export async function generateProcessedFileMetadata(
+  file: File,
+): Promise<ProcessedFileMetadata | undefined> {
   // Only generate metadata for PDF files
-  if (!file.type.startsWith('application/pdf')) {
+  if (!file.type.startsWith("application/pdf")) {
     return undefined;
   }
 
@@ -127,7 +130,7 @@ export async function generateProcessedFileMetadata(file: File): Promise<Process
       unrotatedResult.pageCount,
       unrotatedResult.thumbnail, // Page thumbnails (unrotated)
       unrotatedResult.pageRotations,
-      unrotatedResult.pageDimensions
+      unrotatedResult.pageDimensions,
     );
 
     // Use rotated thumbnail for file manager
@@ -139,7 +142,11 @@ export async function generateProcessedFileMetadata(file: File): Promise<Process
 
     return processedFile;
   } catch (error) {
-    if (DEBUG) console.warn(`📄 Failed to generate processedFileMetadata for ${file.name}:`, error);
+    if (DEBUG)
+      console.warn(
+        `📄 Failed to generate processedFileMetadata for ${file.name}:`,
+        error,
+      );
   }
 
   return undefined;
@@ -161,7 +168,7 @@ export function createChildStub(
   operation: ToolOperation,
   resultingFile: File,
   thumbnail?: string,
-  processedFileMetadata?: ProcessedFileMetadata
+  processedFileMetadata?: ProcessedFileMetadata,
 ): StirlingFileStub {
   const newFileId = createFileId();
 
@@ -200,17 +207,17 @@ export function createChildStub(
     processedFile: processedFileMetadata,
 
     // Mark as dirty if parent has a localFilePath (modified file not yet saved to disk)
-    isDirty: parentStub.localFilePath ? true : undefined
+    isDirty: parentStub.localFilePath ? true : undefined,
   };
 
   if (DEBUG) {
-    console.log('[createChildStub] Created child:', {
+    console.log("[createChildStub] Created child:", {
       childId: newFileId,
       parentId: parentStub.id,
       parentLocalFilePath: parentStub.localFilePath,
       childLocalFilePath: childStub.localFilePath,
       childIsDirty: childStub.isDirty,
-      versionNumber: newVersionNumber
+      versionNumber: newVersionNumber,
     });
   }
 
@@ -221,7 +228,11 @@ interface AddFileOptions {
   files?: File[];
 
   // For 'processed' files
-  filesWithThumbnails?: Array<{ file: File; thumbnail?: string; pageCount?: number }>;
+  filesWithThumbnails?: Array<{
+    file: File;
+    thumbnail?: string;
+    pageCount?: number;
+  }>;
 
   // Insertion position
   insertAfterPageId?: string;
@@ -233,7 +244,10 @@ interface AddFileOptions {
   autoUnzip?: boolean;
   autoUnzipFileLimit?: number;
   skipAutoUnzip?: boolean; // When true: always unzip (except HTML). Used for file uploads. When false: respect autoUnzip/autoUnzipFileLimit preferences. Used for tool outputs.
-  confirmLargeExtraction?: (fileCount: number, fileName: string) => Promise<boolean>; // Optional callback to confirm extraction of large ZIP files
+  confirmLargeExtraction?: (
+    fileCount: number,
+    fileName: string,
+  ) => Promise<boolean>; // Optional callback to confirm extraction of large ZIP files
   allowDuplicates?: boolean;
 }
 
@@ -246,7 +260,7 @@ export async function addFiles(
   filesRef: React.MutableRefObject<Map<FileId, File>>,
   dispatch: React.Dispatch<FileContextAction>,
   lifecycleManager: FileLifecycleManager,
-  enablePersistence: boolean = false
+  enablePersistence: boolean = false,
 ): Promise<StirlingFile[]> {
   // Acquire mutex to prevent race conditions
   await addFilesMutex.lock();
@@ -256,181 +270,256 @@ export async function addFiles(
     const stirlingFiles: StirlingFile[] = [];
     // Hydration tasks are scheduled per-file to update thumbnails/metadata without blocking add flow
 
-  // Build quickKey lookup from existing files for deduplication
-  const existingQuickKeys = buildQuickKeySet(stateRef.current.files.byId);
+    // Build quickKey lookup from existing files for deduplication
+    const existingQuickKeys = buildQuickKeySet(stateRef.current.files.byId);
 
-  const { files = [], allowDuplicates = false } = options;
+    const { files = [], allowDuplicates = false } = options;
 
-  // ZIP pre-processing: Extract ZIP files with configurable behavior
-  // - File uploads: skipAutoUnzip=true → always extract (except HTML)
-  // - Tool outputs: skipAutoUnzip=false → respect user preferences
-  const filesToProcess: File[] = [];
-  const autoUnzip = options.autoUnzip ?? true; // Default to true
-  const autoUnzipFileLimit = options.autoUnzipFileLimit ?? 4; // Default limit
-  const skipAutoUnzip = options.skipAutoUnzip ?? false;
-  const confirmLargeExtraction = options.confirmLargeExtraction;
+    // ZIP pre-processing: Extract ZIP files with configurable behavior
+    // - File uploads: skipAutoUnzip=true → always extract (except HTML)
+    // - Tool outputs: skipAutoUnzip=false → respect user preferences
+    const filesToProcess: File[] = [];
+    const autoUnzip = options.autoUnzip ?? true; // Default to true
+    const autoUnzipFileLimit = options.autoUnzipFileLimit ?? 4; // Default limit
+    const skipAutoUnzip = options.skipAutoUnzip ?? false;
+    const confirmLargeExtraction = options.confirmLargeExtraction;
 
-  for (const file of files) {
-    // Check if file is a ZIP
-    if (zipFileService.isZipFile(file)) {
-      try {
-        if (DEBUG) console.log(`📄 addFiles: Detected ZIP file: ${file.name}`);
+    for (const file of files) {
+      // Check if file is a ZIP
+      if (zipFileService.isZipFile(file)) {
+        try {
+          if (DEBUG)
+            console.log(`📄 addFiles: Detected ZIP file: ${file.name}`);
 
-        // Check if ZIP contains HTML files - if so, keep as ZIP
-        const containsHtml = await zipFileService.containsHtmlFiles(file);
-        if (containsHtml) {
-          if (DEBUG) console.log(`📄 addFiles: ZIP contains HTML, keeping as ZIP: ${file.name}`);
+          // Check if ZIP contains HTML files - if so, keep as ZIP
+          const containsHtml = await zipFileService.containsHtmlFiles(file);
+          if (containsHtml) {
+            if (DEBUG)
+              console.log(
+                `📄 addFiles: ZIP contains HTML, keeping as ZIP: ${file.name}`,
+              );
+            filesToProcess.push(file);
+            continue;
+          }
+
+          // Apply extraction with preferences
+          const extractedFiles = await zipFileService.extractWithPreferences(
+            file,
+            {
+              autoUnzip,
+              autoUnzipFileLimit,
+              skipAutoUnzip,
+              confirmLargeExtraction,
+            },
+          );
+
+          if (extractedFiles.length === 1 && extractedFiles[0] === file) {
+            // ZIP was not extracted (over limit or autoUnzip disabled)
+            if (DEBUG)
+              console.log(
+                `📄 addFiles: ZIP not extracted (preferences): ${file.name}`,
+              );
+          } else {
+            // ZIP was extracted
+            if (DEBUG)
+              console.log(
+                `📄 addFiles: Extracted ${extractedFiles.length} files from ZIP: ${file.name}`,
+              );
+          }
+
+          filesToProcess.push(...extractedFiles);
+        } catch (error) {
+          console.error(
+            `📄 addFiles: Failed to process ZIP file ${file.name}:`,
+            error,
+          );
+          // On error, keep the ZIP file as-is
           filesToProcess.push(file);
-          continue;
         }
-
-        // Apply extraction with preferences
-        const extractedFiles = await zipFileService.extractWithPreferences(file, {
-          autoUnzip,
-          autoUnzipFileLimit,
-          skipAutoUnzip,
-          confirmLargeExtraction
-        });
-
-        if (extractedFiles.length === 1 && extractedFiles[0] === file) {
-          // ZIP was not extracted (over limit or autoUnzip disabled)
-          if (DEBUG) console.log(`📄 addFiles: ZIP not extracted (preferences): ${file.name}`);
-        } else {
-          // ZIP was extracted
-          if (DEBUG) console.log(`📄 addFiles: Extracted ${extractedFiles.length} files from ZIP: ${file.name}`);
-        }
-
-        filesToProcess.push(...extractedFiles);
-      } catch (error) {
-        console.error(`📄 addFiles: Failed to process ZIP file ${file.name}:`, error);
-        // On error, keep the ZIP file as-is
+      } else {
+        // Not a ZIP file, add as-is
         filesToProcess.push(file);
       }
-    } else {
-      // Not a ZIP file, add as-is
-      filesToProcess.push(file);
-    }
-  }
-
-  if (DEBUG) console.log(`📄 addFiles: After ZIP processing, ${filesToProcess.length} files to add`);
-
-  for (const file of filesToProcess) {
-    const quickKey = createQuickKey(file);
-
-    // Soft deduplication: Check if file already exists by metadata
-    if (!allowDuplicates && existingQuickKeys.has(quickKey)) {
-      continue;
     }
 
-    const fileId = createFileId();
-    filesRef.current.set(fileId, file);
+    if (DEBUG)
+      console.log(
+        `📄 addFiles: After ZIP processing, ${filesToProcess.length} files to add`,
+      );
 
-    // Create new filestub with minimal metadata; hydrate thumbnails/processedFile asynchronously
-    const fileStub = createNewStirlingFileStub(file, fileId);
+    for (const file of filesToProcess) {
+      const quickKey = createQuickKey(file);
 
-    // Check for pending file path mapping from Tauri file dialog (desktop only)
-    try {
-      const { pendingFilePathMappings } = await import('@app/services/pendingFilePathMappings');
-      console.log(`[FileActions] Checking for localFilePath mapping for quickKey: ${quickKey}`);
-      console.log(`[FileActions] Available mappings:`, Array.from(pendingFilePathMappings.keys()));
-      const localFilePath = pendingFilePathMappings.get(quickKey);
-      if (localFilePath) {
-        console.log(`[FileActions] ✓ Found localFilePath: ${localFilePath}`);
-        fileStub.localFilePath = localFilePath;
-        pendingFilePathMappings.delete(quickKey); // Clean up after use
-        console.log(`[FileActions] Applied localFilePath to file: ${file.name}`);
-      } else {
-        console.log(`[FileActions] ✗ No localFilePath found for this file`);
-      }
-    } catch (error) {
-      console.log('[FileActions] Could not check for localFilePath:', error);
-      // FileManagerContext may not be available in all contexts
-    }
-
-    // Store insertion position if provided
-    if (options.insertAfterPageId !== undefined) {
-      fileStub.insertAfterPageId = options.insertAfterPageId;
-    }
-
-    if (!allowDuplicates) {
-      existingQuickKeys.add(quickKey);
-    }
-    stirlingFileStubs.push(fileStub);
-
-    // Dispatch immediately so each file appears as soon as it is processed
-    dispatch({ type: 'ADD_FILES', payload: { stirlingFileStubs: [fileStub] } });
-
-    // Create StirlingFile directly
-    const stirlingFile = createStirlingFile(file, fileId);
-    stirlingFiles.push(stirlingFile);
-
-    // Queue background hydration so add flow doesn't block on thumbnail/metadata work
-    scheduleMetadataHydration(async () => {
-      const targetFile = filesRef.current.get(fileId);
-      if (!targetFile) {
-        return;
+      // Soft deduplication: Check if file already exists by metadata
+      if (!allowDuplicates && existingQuickKeys.has(quickKey)) {
+        continue;
       }
 
-      let processedFileMetadata: ProcessedFileMetadata | undefined;
-      let thumbnail: string | undefined;
+      const fileId = createFileId();
+      filesRef.current.set(fileId, file);
 
-      if (targetFile.type.startsWith('application/pdf')) {
-        processedFileMetadata = await generateProcessedFileMetadata(targetFile);
-        thumbnail = processedFileMetadata?.thumbnailUrl;
-      } else {
+      // Create new filestub with minimal metadata; hydrate thumbnails/processedFile asynchronously
+      const fileStub = createNewStirlingFileStub(file, fileId);
+
+      // Early encryption detection for PDFs — set the flag before dispatch so the
+      // viewer gate and modal queue pick it up immediately instead of after hydration
+      if (file.type === "application/pdf") {
         try {
-          const { generateThumbnailForFile } = await import('@app/utils/thumbnailUtils');
-          thumbnail = await generateThumbnailForFile(targetFile);
+          if (await FileAnalyzer.isPDFUserPasswordProtected(file)) {
+            fileStub.processedFile = (fileStub.processedFile || {
+              pages: [],
+            }) as any;
+            fileStub.processedFile!.isEncrypted = true;
+          }
         } catch (error) {
-          console.warn(`[addFiles] Thumbnail generation failed for ${fileId}:`, error);
+          // Never block upload on analysis failure — but log so it's debuggable
+          // if an unencrypted file later appears to "hang" during processing.
+          console.warn(
+            "[FileActions] Early encryption detection failed for",
+            file.name,
+            error,
+          );
         }
       }
 
-      const updates: Partial<StirlingFileStub> = {};
-      const primaryThumbnail = thumbnail || processedFileMetadata?.thumbnailUrl || processedFileMetadata?.pages?.[0]?.thumbnail;
-
-      if (processedFileMetadata) {
-        updates.processedFile = processedFileMetadata;
-        updates.thumbnailUrl = primaryThumbnail;
-      } else if (thumbnail) {
-        updates.thumbnailUrl = primaryThumbnail;
-      }
-
-      if (primaryThumbnail && primaryThumbnail.startsWith('blob:')) {
-        lifecycleManager.trackBlobUrl(primaryThumbnail);
-      }
-
-      if (Object.keys(updates).length > 0) {
-        lifecycleManager.updateStirlingFileStub(fileId, updates, stateRef);
-      }
-    });
-  }
-
-  // Persist to storage if enabled using fileStorage service
-  if (enablePersistence && stirlingFiles.length > 0) {
-    await Promise.all(stirlingFiles.map(async (stirlingFile, index) => {
+      // Check for pending file path mapping from Tauri file dialog (desktop only)
       try {
-        // Get corresponding stub with all metadata
-        const fileStub = stirlingFileStubs[index];
-
-        // Store using the cleaner signature - pass StirlingFile + StirlingFileStub directly
-        await fileStorage.storeStirlingFile(stirlingFile, fileStub);
-
-        if (DEBUG) console.log(`📄 addFiles: Stored file ${stirlingFile.name} with metadata:`, fileStub);
+        const { pendingFilePathMappings } =
+          await import("@app/services/pendingFilePathMappings");
+        console.log(
+          `[FileActions] Checking for localFilePath mapping for quickKey: ${quickKey}`,
+        );
+        console.log(
+          `[FileActions] Available mappings:`,
+          Array.from(pendingFilePathMappings.keys()),
+        );
+        const localFilePath = pendingFilePathMappings.get(quickKey);
+        if (localFilePath) {
+          console.log(`[FileActions] ✓ Found localFilePath: ${localFilePath}`);
+          fileStub.localFilePath = localFilePath;
+          pendingFilePathMappings.delete(quickKey); // Clean up after use
+          console.log(
+            `[FileActions] Applied localFilePath to file: ${file.name}`,
+          );
+        } else {
+          console.log(`[FileActions] ✗ No localFilePath found for this file`);
+        }
       } catch (error) {
-        console.error('Failed to persist file to storage:', stirlingFile.name, error);
+        console.log("[FileActions] Could not check for localFilePath:", error);
+        // FileManagerContext may not be available in all contexts
       }
-    }));
-  }
 
-  return stirlingFiles;
+      // Store insertion position if provided
+      if (options.insertAfterPageId !== undefined) {
+        fileStub.insertAfterPageId = options.insertAfterPageId;
+      }
+
+      if (!allowDuplicates) {
+        existingQuickKeys.add(quickKey);
+      }
+      stirlingFileStubs.push(fileStub);
+
+      // Dispatch immediately so each file appears as soon as it is processed
+      dispatch({
+        type: "ADD_FILES",
+        payload: { stirlingFileStubs: [fileStub] },
+      });
+
+      // Create StirlingFile directly
+      const stirlingFile = createStirlingFile(file, fileId);
+      stirlingFiles.push(stirlingFile);
+
+      // Queue background hydration so add flow doesn't block on thumbnail/metadata work
+      scheduleMetadataHydration(async () => {
+        const targetFile = filesRef.current.get(fileId);
+        if (!targetFile) {
+          return;
+        }
+
+        let processedFileMetadata: ProcessedFileMetadata | undefined;
+        let thumbnail: string | undefined;
+
+        if (targetFile.type.startsWith("application/pdf")) {
+          if (fileStub.processedFile?.isEncrypted) {
+            // Pre-dispatch detection already flagged this PDF as encrypted; PDF.js
+            // can't produce thumbnails/metadata without the password, so re-parsing
+            // here would just duplicate work. Metadata is refreshed after unlock.
+            processedFileMetadata = fileStub.processedFile;
+          } else {
+            processedFileMetadata =
+              await generateProcessedFileMetadata(targetFile);
+            thumbnail = processedFileMetadata?.thumbnailUrl;
+          }
+        } else {
+          try {
+            const { generateThumbnailForFile } =
+              await import("@app/utils/thumbnailUtils");
+            thumbnail = await generateThumbnailForFile(targetFile);
+          } catch (error) {
+            console.warn(
+              `[addFiles] Thumbnail generation failed for ${fileId}:`,
+              error,
+            );
+          }
+        }
+
+        const updates: Partial<StirlingFileStub> = {};
+        const primaryThumbnail =
+          thumbnail ||
+          processedFileMetadata?.thumbnailUrl ||
+          processedFileMetadata?.pages?.[0]?.thumbnail;
+
+        if (processedFileMetadata) {
+          updates.processedFile = processedFileMetadata;
+          updates.thumbnailUrl = primaryThumbnail;
+        } else if (thumbnail) {
+          updates.thumbnailUrl = primaryThumbnail;
+        }
+
+        if (primaryThumbnail && primaryThumbnail.startsWith("blob:")) {
+          lifecycleManager.trackBlobUrl(primaryThumbnail);
+        }
+
+        if (Object.keys(updates).length > 0) {
+          lifecycleManager.updateStirlingFileStub(fileId, updates, stateRef);
+        }
+      });
+    }
+
+    // Persist to storage if enabled using fileStorage service
+    if (enablePersistence && stirlingFiles.length > 0) {
+      await Promise.all(
+        stirlingFiles.map(async (stirlingFile, index) => {
+          try {
+            // Get corresponding stub with all metadata
+            const fileStub = stirlingFileStubs[index];
+
+            // Store using the cleaner signature - pass StirlingFile + StirlingFileStub directly
+            await fileStorage.storeStirlingFile(stirlingFile, fileStub);
+
+            if (DEBUG)
+              console.log(
+                `📄 addFiles: Stored file ${stirlingFile.name} with metadata:`,
+                fileStub,
+              );
+          } catch (error) {
+            console.error(
+              "Failed to persist file to storage:",
+              stirlingFile.name,
+              error,
+            );
+          }
+        }),
+      );
+    }
+
+    return stirlingFiles;
   } finally {
     // Always release mutex even if error occurs
     addFilesMutex.unlock();
   }
 }
 
-
 /**
  * Consume files helper - replace unpinned input files with output files
  * Now accepts pre-created StirlingFiles and StirlingFileStubs to preserve all metadata
@@ -440,13 +529,18 @@ export async function consumeFiles(
   outputStirlingFiles: StirlingFile[],
   outputStirlingFileStubs: StirlingFileStub[],
   filesRef: React.MutableRefObject<Map<FileId, File>>,
-  dispatch: React.Dispatch<FileContextAction>
+  dispatch: React.Dispatch<FileContextAction>,
 ): Promise<FileId[]> {
-  if (DEBUG) console.log(`📄 consumeFiles: Processing ${inputFileIds.length} input files, ${outputStirlingFiles.length} output files with pre-created stubs`);
+  if (DEBUG)
+    console.log(
+      `📄 consumeFiles: Processing ${inputFileIds.length} input files, ${outputStirlingFiles.length} output files with pre-created stubs`,
+    );
 
   // Validate that we have matching files and stubs
   if (outputStirlingFiles.length !== outputStirlingFileStubs.length) {
-    throw new Error(`Mismatch between output files (${outputStirlingFiles.length}) and stubs (${outputStirlingFileStubs.length})`);
+    throw new Error(
+      `Mismatch between output files (${outputStirlingFiles.length}) and stubs (${outputStirlingFileStubs.length})`,
+    );
   }
 
   // Store StirlingFiles in filesRef using their existing IDs (no ID generation needed)
@@ -455,25 +549,42 @@ export async function consumeFiles(
     const stub = outputStirlingFileStubs[i];
 
     if (stirlingFile.fileId !== stub.id) {
-      console.warn(`📄 consumeFiles: ID mismatch between StirlingFile (${stirlingFile.fileId}) and stub (${stub.id})`);
+      console.warn(
+        `📄 consumeFiles: ID mismatch between StirlingFile (${stirlingFile.fileId}) and stub (${stub.id})`,
+      );
     }
 
     filesRef.current.set(stirlingFile.fileId, stirlingFile);
 
-    if (DEBUG) console.log(`📄 consumeFiles: Stored StirlingFile ${stirlingFile.name} with ID ${stirlingFile.fileId}`);
+    if (DEBUG)
+      console.log(
+        `📄 consumeFiles: Stored StirlingFile ${stirlingFile.name} with ID ${stirlingFile.fileId}`,
+      );
   }
 
   // Mark input files as processed in storage (no longer leaf nodes)
-  if(!outputStirlingFileStubs.reduce((areAllV1, stub) => areAllV1 && (stub.versionNumber == 1), true)) {
+  if (
+    !outputStirlingFileStubs.reduce(
+      (areAllV1, stub) => areAllV1 && stub.versionNumber == 1,
+      true,
+    )
+  ) {
     await Promise.all(
       inputFileIds.map(async (fileId) => {
         try {
           await fileStorage.markFileAsProcessed(fileId);
-          if (DEBUG) console.log(`📄 Marked file ${fileId} as processed (no longer leaf)`);
+          if (DEBUG)
+            console.log(
+              `📄 Marked file ${fileId} as processed (no longer leaf)`,
+            );
         } catch (error) {
-          if (DEBUG) console.warn(`📄 Failed to mark file ${fileId} as processed:`, error);
+          if (DEBUG)
+            console.warn(
+              `📄 Failed to mark file ${fileId} as processed:`,
+              error,
+            );
         }
-      })
+      }),
     );
   }
 
@@ -486,30 +597,41 @@ export async function consumeFiles(
       // Use fileStorage directly with complete metadata from stub
       await fileStorage.storeStirlingFile(stirlingFile, stub);
 
-      if (DEBUG) console.log(`📄 Saved StirlingFile ${stirlingFile.name} directly to storage with complete metadata:`, {
-        fileId: stirlingFile.fileId,
-        versionNumber: stub.versionNumber,
-        originalFileId: stub.originalFileId,
-        parentFileId: stub.parentFileId,
-        toolChainLength: stub.toolHistory?.length || 0
-      });
+      if (DEBUG)
+        console.log(
+          `📄 Saved StirlingFile ${stirlingFile.name} directly to storage with complete metadata:`,
+          {
+            fileId: stirlingFile.fileId,
+            versionNumber: stub.versionNumber,
+            originalFileId: stub.originalFileId,
+            parentFileId: stub.parentFileId,
+            toolChainLength: stub.toolHistory?.length || 0,
+          },
+        );
     } catch (error) {
-      console.error('Failed to persist output file to fileStorage:', stirlingFile.name, error);
+      console.error(
+        "Failed to persist output file to fileStorage:",
+        stirlingFile.name,
+        error,
+      );
     }
   }
 
   // Dispatch the consume action with pre-created stubs (no processing needed)
   dispatch({
-    type: 'CONSUME_FILES',
+    type: "CONSUME_FILES",
     payload: {
       inputFileIds,
-      outputStirlingFileStubs: outputStirlingFileStubs
-    }
+      outputStirlingFileStubs: outputStirlingFileStubs,
+    },
   });
 
-  if (DEBUG) console.log(`📄 consumeFiles: Successfully consumed files - removed ${inputFileIds.length} inputs, added ${outputStirlingFileStubs.length} outputs`);
+  if (DEBUG)
+    console.log(
+      `📄 consumeFiles: Successfully consumed files - removed ${inputFileIds.length} inputs, added ${outputStirlingFileStubs.length} outputs`,
+    );
   // Return the output file IDs for undo tracking
-  return outputStirlingFileStubs.map(stub => stub.id);
+  return outputStirlingFileStubs.map((stub) => stub.id);
 }
 
 /**
@@ -519,10 +641,10 @@ async function restoreFilesAndCleanup(
   filesToRestore: Array<{ file: File; record: StirlingFileStub }>,
   fileIdsToRemove: FileId[],
   filesRef: React.MutableRefObject<Map<FileId, File>>,
-  indexedDB?: { deleteFile: (fileId: FileId) => Promise<void> } | null
+  indexedDB?: { deleteFile: (fileId: FileId) => Promise<void> } | null,
 ): Promise<void> {
   // Remove files from filesRef
-  fileIdsToRemove.forEach(id => {
+  fileIdsToRemove.forEach((id) => {
     if (filesRef.current.has(id)) {
       if (DEBUG) console.log(`📄 Removing file ${id} from filesRef`);
       filesRef.current.delete(id);
@@ -541,18 +663,21 @@ async function restoreFilesAndCleanup(
       }
 
       // Restore the file to filesRef
-      if (DEBUG) console.log(`📄 Restoring file ${file.name} with id ${record.id} to filesRef`);
+      if (DEBUG)
+        console.log(
+          `📄 Restoring file ${file.name} with id ${record.id} to filesRef`,
+        );
       filesRef.current.set(record.id, file);
     }
   });
 
   // Clean up IndexedDB
   if (indexedDB) {
-    const indexedDBPromises = fileIdsToRemove.map(fileId =>
-      indexedDB.deleteFile(fileId).catch(error => {
-        console.error('Failed to delete file from IndexedDB:', fileId, error);
+    const indexedDBPromises = fileIdsToRemove.map((fileId) =>
+      indexedDB.deleteFile(fileId).catch((error) => {
+        console.error("Failed to delete file from IndexedDB:", fileId, error);
         throw error; // Re-throw to trigger rollback
-      })
+      }),
     );
 
     // Execute all IndexedDB operations
@@ -569,13 +694,25 @@ export async function undoConsumeFiles(
   outputFileIds: FileId[],
   filesRef: React.MutableRefObject<Map<FileId, File>>,
   dispatch: React.Dispatch<FileContextAction>,
-  indexedDB?: { saveFile: (file: File, fileId: FileId, existingThumbnail?: string) => Promise<any>; deleteFile: (fileId: FileId) => Promise<void> } | null
+  indexedDB?: {
+    saveFile: (
+      file: File,
+      fileId: FileId,
+      existingThumbnail?: string,
+    ) => Promise<any>;
+    deleteFile: (fileId: FileId) => Promise<void>;
+  } | null,
 ): Promise<void> {
-  if (DEBUG) console.log(`📄 undoConsumeFiles: Restoring ${inputStirlingFileStubs.length} input files, removing ${outputFileIds.length} output files`);
+  if (DEBUG)
+    console.log(
+      `📄 undoConsumeFiles: Restoring ${inputStirlingFileStubs.length} input files, removing ${outputFileIds.length} output files`,
+    );
 
   // Validate inputs
   if (inputFiles.length !== inputStirlingFileStubs.length) {
-    throw new Error(`Mismatch between input files (${inputFiles.length}) and records (${inputStirlingFileStubs.length})`);
+    throw new Error(
+      `Mismatch between input files (${inputFiles.length}) and records (${inputStirlingFileStubs.length})`,
+    );
   }
 
   // Create a backup of current filesRef state for rollback
@@ -585,7 +722,7 @@ export async function undoConsumeFiles(
     // Prepare files to restore
     const filesToRestore = inputFiles.map((file, index) => ({
       file,
-      record: inputStirlingFileStubs[index]
+      record: inputStirlingFileStubs[index],
     }));
 
     // Restore input files and clean up output files
@@ -593,12 +730,12 @@ export async function undoConsumeFiles(
       filesToRestore,
       outputFileIds,
       filesRef,
-      indexedDB
+      indexedDB,
     );
 
     // Mark restored files as dirty if they have localFilePath
     // (they now differ from what's saved on disk)
-    const stubsWithDirtyMarked = inputStirlingFileStubs.map(stub => {
+    const stubsWithDirtyMarked = inputStirlingFileStubs.map((stub) => {
       if (stub.localFilePath) {
         return { ...stub, isDirty: true };
       }
@@ -607,17 +744,24 @@ export async function undoConsumeFiles(
 
     // Dispatch the undo action (only if everything else succeeded)
     dispatch({
-      type: 'UNDO_CONSUME_FILES',
+      type: "UNDO_CONSUME_FILES",
       payload: {
         inputStirlingFileStubs: stubsWithDirtyMarked,
-        outputFileIds
-      }
+        outputFileIds,
+      },
     });
 
-    if (DEBUG) console.log(`📄 undoConsumeFiles: Successfully undone consume operation - restored ${inputStirlingFileStubs.length} inputs, removed ${outputFileIds.length} outputs`);
+    if (DEBUG)
+      console.log(
+        `📄 undoConsumeFiles: Successfully undone consume operation - restored ${inputStirlingFileStubs.length} inputs, removed ${outputFileIds.length} outputs`,
+      );
   } catch (error) {
     // Rollback filesRef to previous state
-    if (DEBUG) console.error('📄 undoConsumeFiles: Error during undo, rolling back filesRef', error);
+    if (DEBUG)
+      console.error(
+        "📄 undoConsumeFiles: Error during undo, rolling back filesRef",
+        error,
+      );
     filesRef.current.clear();
     backupFilesRef.forEach((file, id) => {
       filesRef.current.set(id, file);
@@ -641,14 +785,17 @@ export async function addStirlingFileStubs(
   stateRef: React.MutableRefObject<FileContextState>,
   filesRef: React.MutableRefObject<Map<FileId, File>>,
   dispatch: React.Dispatch<FileContextAction>,
-  lifecycleManager: FileLifecycleManager
+  lifecycleManager: FileLifecycleManager,
 ): Promise<StirlingFile[]> {
   await addFilesMutex.lock();
 
   try {
     // Show loading indicator while preparing files from storage
     if (stirlingFileStubs.length > 0) {
-      dispatch({ type: 'SET_PROCESSING', payload: { isProcessing: true, progress: 0 } });
+      dispatch({
+        type: "SET_PROCESSING",
+        payload: { isProcessing: true, progress: 0 },
+      });
     }
 
     const existingQuickKeys = buildQuickKeySet(stateRef.current.files.byId);
@@ -658,8 +805,9 @@ export async function addStirlingFileStubs(
     // Process and dispatch files one by one for progressive UI updates
     for (const stub of stirlingFileStubs) {
       // Check for duplicates using quickKey
-      if (existingQuickKeys.has(stub.quickKey || '')) {
-        if (DEBUG) console.log(`📄 Skipping duplicate StirlingFileStub: ${stub.name}`);
+      if (existingQuickKeys.has(stub.quickKey || "")) {
+        if (DEBUG)
+          console.log(`📄 Skipping duplicate StirlingFileStub: ${stub.name}`);
         continue;
       }
 
@@ -671,15 +819,18 @@ export async function addStirlingFileStubs(
         record.insertAfterPageId = options.insertAfterPageId;
       }
 
-      existingQuickKeys.add(stub.quickKey || '');
+      existingQuickKeys.add(stub.quickKey || "");
 
       // Dispatch each file immediately as we process it (progressive loading)
-      dispatch({ type: 'ADD_FILES', payload: { stirlingFileStubs: [record] } });
+      dispatch({ type: "ADD_FILES", payload: { stirlingFileStubs: [record] } });
 
       // Clear loading indicator after first file appears
       if (!firstFileDispatched) {
         firstFileDispatched = true;
-        dispatch({ type: 'SET_PROCESSING', payload: { isProcessing: false, progress: 0 } });
+        dispatch({
+          type: "SET_PROCESSING",
+          payload: { isProcessing: false, progress: 0 },
+        });
       }
 
       // Load File object and hydrate metadata in background (non-blocking)
@@ -696,31 +847,42 @@ export async function addStirlingFileStubs(
         filesRef.current.set(fileId, stirlingFile);
 
         // Check if processedFile data needs regeneration
-        if (stirlingFile.type.startsWith('application/pdf')) {
-          const needsProcessing = !stub.processedFile ||
-                                  !stub.processedFile.pages ||
-                                  stub.processedFile.pages.length === 0 ||
-                                  stub.processedFile.totalPages !== stub.processedFile.pages.length;
+        if (stirlingFile.type.startsWith("application/pdf")) {
+          const needsProcessing =
+            !stub.processedFile ||
+            !stub.processedFile.pages ||
+            stub.processedFile.pages.length === 0 ||
+            stub.processedFile.totalPages !== stub.processedFile.pages.length;
 
           if (needsProcessing) {
             // Regenerate metadata
-            const processedFileMetadata = await generateProcessedFileMetadata(stirlingFile);
+            const processedFileMetadata =
+              await generateProcessedFileMetadata(stirlingFile);
 
             if (processedFileMetadata) {
               const updates: Partial<StirlingFileStub> = {
-                processedFile: processedFileMetadata
+                processedFile: processedFileMetadata,
               };
 
               // Update thumbnail only if current stub doesn't have one
               const currentStub = stateRef.current.files.byId[fileId];
-              if (!currentStub?.thumbnailUrl && processedFileMetadata.thumbnailUrl) {
+              if (
+                !currentStub?.thumbnailUrl &&
+                processedFileMetadata.thumbnailUrl
+              ) {
                 updates.thumbnailUrl = processedFileMetadata.thumbnailUrl;
-                if (processedFileMetadata.thumbnailUrl.startsWith('blob:')) {
-                  lifecycleManager.trackBlobUrl(processedFileMetadata.thumbnailUrl);
+                if (processedFileMetadata.thumbnailUrl.startsWith("blob:")) {
+                  lifecycleManager.trackBlobUrl(
+                    processedFileMetadata.thumbnailUrl,
+                  );
                 }
               }
 
-              lifecycleManager.updateStirlingFileStub(fileId, updates, stateRef);
+              lifecycleManager.updateStirlingFileStub(
+                fileId,
+                updates,
+                stateRef,
+              );
             }
           }
         }
@@ -733,17 +895,31 @@ export async function addStirlingFileStubs(
   }
 }
 
-export const createFileActions = (dispatch: React.Dispatch<FileContextAction>) => ({
-  setSelectedFiles: (fileIds: FileId[]) => dispatch({ type: 'SET_SELECTED_FILES', payload: { fileIds } }),
-  setSelectedPages: (pageNumbers: number[]) => dispatch({ type: 'SET_SELECTED_PAGES', payload: { pageNumbers } }),
-  clearSelections: () => dispatch({ type: 'CLEAR_SELECTIONS' }),
-  setProcessing: (isProcessing: boolean, progress = 0) => dispatch({ type: 'SET_PROCESSING', payload: { isProcessing, progress } }),
-  setHasUnsavedChanges: (hasChanges: boolean) => dispatch({ type: 'SET_UNSAVED_CHANGES', payload: { hasChanges } }),
-  pinFile: (fileId: FileId) => dispatch({ type: 'PIN_FILE', payload: { fileId } }),
-  unpinFile: (fileId: FileId) => dispatch({ type: 'UNPIN_FILE', payload: { fileId } }),
-  resetContext: () => dispatch({ type: 'RESET_CONTEXT' }),
-  markFileError: (fileId: FileId) => dispatch({ type: 'MARK_FILE_ERROR', payload: { fileId } }),
-  clearFileError: (fileId: FileId) => dispatch({ type: 'CLEAR_FILE_ERROR', payload: { fileId } }),
-  clearAllFileErrors: () => dispatch({ type: 'CLEAR_ALL_FILE_ERRORS' }),
-  updateStirlingFileStub: (fileId: FileId, updates: Partial<StirlingFileStub>) => dispatch({ type: 'UPDATE_FILE_RECORD', payload: { id: fileId, updates } })
+export const createFileActions = (
+  dispatch: React.Dispatch<FileContextAction>,
+) => ({
+  setSelectedFiles: (fileIds: FileId[]) =>
+    dispatch({ type: "SET_SELECTED_FILES", payload: { fileIds } }),
+  setSelectedPages: (pageNumbers: number[]) =>
+    dispatch({ type: "SET_SELECTED_PAGES", payload: { pageNumbers } }),
+  clearSelections: () => dispatch({ type: "CLEAR_SELECTIONS" }),
+  setProcessing: (isProcessing: boolean, progress = 0) =>
+    dispatch({ type: "SET_PROCESSING", payload: { isProcessing, progress } }),
+  setHasUnsavedChanges: (hasChanges: boolean) =>
+    dispatch({ type: "SET_UNSAVED_CHANGES", payload: { hasChanges } }),
+  pinFile: (fileId: FileId) =>
+    dispatch({ type: "PIN_FILE", payload: { fileId } }),
+  unpinFile: (fileId: FileId) =>
+    dispatch({ type: "UNPIN_FILE", payload: { fileId } }),
+  resetContext: () => dispatch({ type: "RESET_CONTEXT" }),
+  markFileError: (fileId: FileId) =>
+    dispatch({ type: "MARK_FILE_ERROR", payload: { fileId } }),
+  clearFileError: (fileId: FileId) =>
+    dispatch({ type: "CLEAR_FILE_ERROR", payload: { fileId } }),
+  clearAllFileErrors: () => dispatch({ type: "CLEAR_ALL_FILE_ERRORS" }),
+  updateStirlingFileStub: (
+    fileId: FileId,
+    updates: Partial<StirlingFileStub>,
+  ) =>
+    dispatch({ type: "UPDATE_FILE_RECORD", payload: { id: fileId, updates } }),
 });
diff --git a/frontend/src/core/contexts/file/fileHooks.ts b/frontend/src/core/contexts/file/fileHooks.ts
index 6b5614c118..fcd3ba7ef7 100644
--- a/frontend/src/core/contexts/file/fileHooks.ts
+++ b/frontend/src/core/contexts/file/fileHooks.ts
@@ -2,15 +2,15 @@
  * Performant file hooks - Clean API using FileContext
  */
 
-import { useContext, useMemo } from 'react';
+import { useContext, useMemo } from "react";
 import {
   FileStateContext,
   FileActionsContext,
   FileContextStateValue,
-  FileContextActionsValue
-} from '@app/contexts/file/contexts';
-import { StirlingFileStub, StirlingFile } from '@app/types/fileContext';
-import { FileId } from '@app/types/file';
+  FileContextActionsValue,
+} from "@app/contexts/file/contexts";
+import { StirlingFileStub, StirlingFile } from "@app/types/fileContext";
+import { FileId } from "@app/types/file";
 
 /**
  * Hook for accessing file state (will re-render on any state change)
@@ -19,7 +19,7 @@ import { FileId } from '@app/types/file';
 export function useFileState(): FileContextStateValue {
   const context = useContext(FileStateContext);
   if (!context) {
-    throw new Error('useFileState must be used within a FileContextProvider');
+    throw new Error("useFileState must be used within a FileContextProvider");
   }
   return context;
 }
@@ -30,7 +30,7 @@ export function useFileState(): FileContextStateValue {
 export function useFileActions(): FileContextActionsValue {
   const context = useContext(FileActionsContext);
   if (!context) {
-    throw new Error('useFileActions must be used within a FileContextProvider');
+    throw new Error("useFileActions must be used within a FileContextProvider");
   }
   return context;
 }
@@ -42,12 +42,19 @@ export function useCurrentFile(): { file?: File; record?: StirlingFileStub } {
   const { state, selectors } = useFileState();
 
   const primaryFileId = state.files.ids[0];
-  const primaryFileRecord = primaryFileId ? state.files.byId[primaryFileId] : undefined;
+  const primaryFileRecord = primaryFileId
+    ? state.files.byId[primaryFileId]
+    : undefined;
 
-  return useMemo(() => ({
-    file: primaryFileId ? selectors.getFile(primaryFileId) : undefined,
-    record: primaryFileId ? selectors.getStirlingFileStub(primaryFileId) : undefined
-  }), [primaryFileId, primaryFileRecord, selectors]);
+  return useMemo(
+    () => ({
+      file: primaryFileId ? selectors.getFile(primaryFileId) : undefined,
+      record: primaryFileId
+        ? selectors.getStirlingFileStub(primaryFileId)
+        : undefined,
+    }),
+    [primaryFileId, primaryFileRecord, selectors],
+  );
 }
 
 /**
@@ -62,21 +69,24 @@ export function useFileSelection() {
     return selectors.getSelectedFiles();
   }, [state.ui.selectedFileIds, state.files.byId, selectors]);
 
-  return useMemo(() => ({
-    selectedFiles,
-    selectedFileIds: state.ui.selectedFileIds,
-    selectedPageNumbers: state.ui.selectedPageNumbers,
-    setSelectedFiles: actions.setSelectedFiles,
-    setSelectedPages: actions.setSelectedPages,
-    clearSelections: actions.clearSelections
-  }), [
-    selectedFiles,
-    state.ui.selectedFileIds,
-    state.ui.selectedPageNumbers,
-    actions.setSelectedFiles,
-    actions.setSelectedPages,
-    actions.clearSelections
-  ]);
+  return useMemo(
+    () => ({
+      selectedFiles,
+      selectedFileIds: state.ui.selectedFileIds,
+      selectedPageNumbers: state.ui.selectedPageNumbers,
+      setSelectedFiles: actions.setSelectedFiles,
+      setSelectedPages: actions.setSelectedPages,
+      clearSelections: actions.clearSelections,
+    }),
+    [
+      selectedFiles,
+      state.ui.selectedFileIds,
+      state.ui.selectedPageNumbers,
+      actions.setSelectedFiles,
+      actions.setSelectedPages,
+      actions.clearSelections,
+    ],
+  );
 }
 
 /**
@@ -85,13 +95,16 @@ export function useFileSelection() {
 export function useFileManagement() {
   const { actions } = useFileActions();
 
-  return useMemo(() => ({
-    addFiles: actions.addFiles,
-    removeFiles: actions.removeFiles,
-    clearAllFiles: actions.clearAllFiles,
-    updateStirlingFileStub: actions.updateStirlingFileStub,
-    reorderFiles: actions.reorderFiles
-  }), [actions]);
+  return useMemo(
+    () => ({
+      addFiles: actions.addFiles,
+      removeFiles: actions.removeFiles,
+      clearAllFiles: actions.clearAllFiles,
+      updateStirlingFileStub: actions.updateStirlingFileStub,
+      reorderFiles: actions.reorderFiles,
+    }),
+    [actions],
+  );
 }
 
 /**
@@ -101,52 +114,75 @@ export function useFileUI() {
   const { state } = useFileState();
   const { actions } = useFileActions();
 
-  return useMemo(() => ({
-    isProcessing: state.ui.isProcessing,
-    processingProgress: state.ui.processingProgress,
-    hasUnsavedChanges: state.ui.hasUnsavedChanges,
-    setProcessing: actions.setProcessing,
-    setUnsavedChanges: actions.setHasUnsavedChanges
-  }), [state.ui, actions]);
+  return useMemo(
+    () => ({
+      isProcessing: state.ui.isProcessing,
+      processingProgress: state.ui.processingProgress,
+      hasUnsavedChanges: state.ui.hasUnsavedChanges,
+      setProcessing: actions.setProcessing,
+      setUnsavedChanges: actions.setHasUnsavedChanges,
+    }),
+    [state.ui, actions],
+  );
 }
 
 /**
  * Hook for specific file by ID (optimized for individual file access)
  */
-export function useStirlingFileStub(fileId: FileId): { file?: File; record?: StirlingFileStub } {
+export function useStirlingFileStub(fileId: FileId): {
+  file?: File;
+  record?: StirlingFileStub;
+} {
   const { state, selectors } = useFileState();
   const fileRecord = state.files.byId[fileId];
 
-  return useMemo(() => ({
-    file: selectors.getFile(fileId),
-    record: selectors.getStirlingFileStub(fileId)
-  }), [fileId, fileRecord, selectors]);
+  return useMemo(
+    () => ({
+      file: selectors.getFile(fileId),
+      record: selectors.getStirlingFileStub(fileId),
+    }),
+    [fileId, fileRecord, selectors],
+  );
 }
 
 /**
  * Hook for all files (use sparingly - causes re-renders on file list changes)
  */
-export function useAllFiles(): { files: StirlingFile[]; fileStubs: StirlingFileStub[]; fileIds: FileId[] } {
+export function useAllFiles(): {
+  files: StirlingFile[];
+  fileStubs: StirlingFileStub[];
+  fileIds: FileId[];
+} {
   const { state, selectors } = useFileState();
 
-  return useMemo(() => ({
-    files: selectors.getFiles(),
-    fileStubs: selectors.getStirlingFileStubs(),
-    fileIds: state.files.ids
-  }), [state.files.ids, state.files.byId, selectors]);
+  return useMemo(
+    () => ({
+      files: selectors.getFiles(),
+      fileStubs: selectors.getStirlingFileStubs(),
+      fileIds: state.files.ids,
+    }),
+    [state.files.ids, state.files.byId, selectors],
+  );
 }
 
 /**
  * Hook for selected files (optimized for selection-based UI)
  */
-export function useSelectedFiles(): { selectedFiles: StirlingFile[]; selectedFileStubs: StirlingFileStub[]; selectedFileIds: FileId[] } {
+export function useSelectedFiles(): {
+  selectedFiles: StirlingFile[];
+  selectedFileStubs: StirlingFileStub[];
+  selectedFileIds: FileId[];
+} {
   const { state, selectors } = useFileState();
 
-  return useMemo(() => ({
-    selectedFiles: selectors.getSelectedFiles(),
-    selectedFileStubs: selectors.getSelectedStirlingFileStubs(),
-    selectedFileIds: state.ui.selectedFileIds
-  }), [state.ui.selectedFileIds, state.files.byId, selectors]);
+  return useMemo(
+    () => ({
+      selectedFiles: selectors.getSelectedFiles(),
+      selectedFileStubs: selectors.getSelectedStirlingFileStubs(),
+      selectedFileIds: state.ui.selectedFileIds,
+    }),
+    [state.ui.selectedFileIds, state.files.byId, selectors],
+  );
 }
 
 // Navigation management removed - moved to NavigationContext
@@ -159,44 +195,51 @@ export function useFileContext() {
   const { state, selectors } = useFileState();
   const { actions } = useFileActions();
 
-  return useMemo(() => ({
-    // Lifecycle management
-    trackBlobUrl: actions.trackBlobUrl,
-    scheduleCleanup: actions.scheduleCleanup,
-    setUnsavedChanges: actions.setHasUnsavedChanges,
+  return useMemo(
+    () => ({
+      // Lifecycle management
+      trackBlobUrl: actions.trackBlobUrl,
+      scheduleCleanup: actions.scheduleCleanup,
+      setUnsavedChanges: actions.setHasUnsavedChanges,
 
-    // File management
-    addFiles: actions.addFiles,
-    consumeFiles: actions.consumeFiles,
-    undoConsumeFiles: actions.undoConsumeFiles,
-    recordOperation: (_fileId: FileId, _operation: any) => {}, // Operation tracking not implemented
-    markOperationApplied: (_fileId: FileId, _operationId: string) => {}, // Operation tracking not implemented
-    markOperationFailed: (_fileId: FileId, _operationId: string, _error: string) => {}, // Operation tracking not implemented
-    // File ID lookup
-    findFileId: (file: File) => {
-      return state.files.ids.find(id => {
-        const record = state.files.byId[id];
-        return record &&
-               record.name === file.name &&
-               record.size === file.size &&
-               record.lastModified === file.lastModified;
-      });
-    },
+      // File management
+      addFiles: actions.addFiles,
+      consumeFiles: actions.consumeFiles,
+      undoConsumeFiles: actions.undoConsumeFiles,
+      recordOperation: (_fileId: FileId, _operation: any) => {}, // Operation tracking not implemented
+      markOperationApplied: (_fileId: FileId, _operationId: string) => {}, // Operation tracking not implemented
+      markOperationFailed: (
+        _fileId: FileId,
+        _operationId: string,
+        _error: string,
+      ) => {}, // Operation tracking not implemented
+      // File ID lookup
+      findFileId: (file: File) => {
+        return state.files.ids.find((id) => {
+          const record = state.files.byId[id];
+          return (
+            record &&
+            record.name === file.name &&
+            record.size === file.size &&
+            record.lastModified === file.lastModified
+          );
+        });
+      },
 
-    // Pinned files
-    pinnedFiles: state.pinnedFiles,
-    pinFile: actions.pinFile,
-    unpinFile: actions.unpinFile,
-    isFilePinned: selectors.isFilePinned,
+      // Pinned files
+      pinnedFiles: state.pinnedFiles,
+      pinFile: actions.pinFile,
+      unpinFile: actions.unpinFile,
+      isFilePinned: selectors.isFilePinned,
 
-    // Active files
-    activeFiles: selectors.getFiles(),
-    openEncryptedUnlockPrompt: actions.openEncryptedUnlockPrompt,
+      // Active files
+      activeFiles: selectors.getFiles(),
+      openEncryptedUnlockPrompt: actions.openEncryptedUnlockPrompt,
 
-    // Direct access to actions and selectors (for advanced use cases)
-    actions,
-    selectors
-  }), [state, selectors, actions]);
+      // Direct access to actions and selectors (for advanced use cases)
+      actions,
+      selectors,
+    }),
+    [state, selectors, actions],
+  );
 }
-
-
diff --git a/frontend/src/core/contexts/file/fileSelectors.ts b/frontend/src/core/contexts/file/fileSelectors.ts
index 5fa54f33c5..6a53b11a48 100644
--- a/frontend/src/core/contexts/file/fileSelectors.ts
+++ b/frontend/src/core/contexts/file/fileSelectors.ts
@@ -2,21 +2,21 @@
  * File selectors - Pure functions for accessing file state
  */
 
-import { FileId } from '@app/types/file';
+import { FileId } from "@app/types/file";
 import {
   StirlingFileStub,
   FileContextState,
   FileContextSelectors,
   StirlingFile,
-  createStirlingFile
-} from '@app/types/fileContext';
+  createStirlingFile,
+} from "@app/types/fileContext";
 
 /**
  * Create stable selectors using stateRef and filesRef
  */
 export function createFileSelectors(
   stateRef: React.MutableRefObject<FileContextState>,
-  filesRef: React.MutableRefObject<Map<FileId, File>>
+  filesRef: React.MutableRefObject<Map<FileId, File>>,
 ): FileContextSelectors {
   return {
     getFile: (id: FileId) => {
@@ -27,7 +27,7 @@ export function createFileSelectors(
     getFiles: (ids?: FileId[]) => {
       const currentIds = ids || stateRef.current.files.ids;
       return currentIds
-        .map(id => {
+        .map((id) => {
           const file = filesRef.current.get(id);
           return file ? createStirlingFile(file, id) : undefined;
         })
@@ -38,14 +38,16 @@ export function createFileSelectors(
 
     getStirlingFileStubs: (ids?: FileId[]) => {
       const currentIds = ids || stateRef.current.files.ids;
-      return currentIds.map(id => stateRef.current.files.byId[id]).filter(Boolean);
+      return currentIds
+        .map((id) => stateRef.current.files.byId[id])
+        .filter(Boolean);
     },
 
     getAllFileIds: () => stateRef.current.files.ids,
 
     getSelectedFiles: () => {
       return stateRef.current.ui.selectedFileIds
-        .map(id => {
+        .map((id) => {
           const file = filesRef.current.get(id);
           return file ? createStirlingFile(file, id) : undefined;
         })
@@ -54,7 +56,7 @@ export function createFileSelectors(
 
     getSelectedStirlingFileStubs: () => {
       return stateRef.current.ui.selectedFileIds
-        .map(id => stateRef.current.files.byId[id])
+        .map((id) => stateRef.current.files.byId[id])
         .filter(Boolean);
     },
 
@@ -65,7 +67,7 @@ export function createFileSelectors(
 
     getPinnedFiles: () => {
       return Array.from(stateRef.current.pinnedFiles)
-        .map(id => {
+        .map((id) => {
           const file = filesRef.current.get(id);
           return file ? createStirlingFile(file, id) : undefined;
         })
@@ -74,7 +76,7 @@ export function createFileSelectors(
 
     getPinnedStirlingFileStubs: () => {
       return Array.from(stateRef.current.pinnedFiles)
-        .map(id => stateRef.current.files.byId[id])
+        .map((id) => stateRef.current.files.byId[id])
         .filter(Boolean);
     },
 
@@ -85,22 +87,23 @@ export function createFileSelectors(
     // Stable signature for effects - prevents unnecessary re-renders
     getFilesSignature: () => {
       return stateRef.current.files.ids
-        .map(id => {
+        .map((id) => {
           const record = stateRef.current.files.byId[id];
-          return record ? `${id}:${record.size}:${record.lastModified}` : '';
+          return record ? `${id}:${record.size}:${record.lastModified}` : "";
         })
-        .join('|');
+        .join("|");
     },
-
   };
 }
 
 /**
  * Helper for building quickKey sets for deduplication
  */
-export function buildQuickKeySet(stirlingFileStubs: Record<FileId, StirlingFileStub>): Set<string> {
+export function buildQuickKeySet(
+  stirlingFileStubs: Record<FileId, StirlingFileStub>,
+): Set<string> {
   const quickKeys = new Set<string>();
-  Object.values(stirlingFileStubs).forEach(record => {
+  Object.values(stirlingFileStubs).forEach((record) => {
     if (record.quickKey) {
       quickKeys.add(record.quickKey);
     }
@@ -111,9 +114,11 @@ export function buildQuickKeySet(stirlingFileStubs: Record<FileId, StirlingFileS
 /**
  * Helper for building quickKey sets from IndexedDB metadata
  */
-export function buildQuickKeySetFromMetadata(metadata: Array<{ name: string; size: number; lastModified: number }>): Set<string> {
+export function buildQuickKeySetFromMetadata(
+  metadata: Array<{ name: string; size: number; lastModified: number }>,
+): Set<string> {
   const quickKeys = new Set<string>();
-  metadata.forEach(meta => {
+  metadata.forEach((meta) => {
     // Format: name|size|lastModified (same as createQuickKey)
     const quickKey = `${meta.name}|${meta.size}|${meta.lastModified}`;
     quickKeys.add(quickKey);
@@ -126,13 +131,13 @@ export function buildQuickKeySetFromMetadata(metadata: Array<{ name: string; siz
  */
 export function getPrimaryFile(
   stateRef: React.MutableRefObject<FileContextState>,
-  filesRef: React.MutableRefObject<Map<FileId, File>>
+  filesRef: React.MutableRefObject<Map<FileId, File>>,
 ): { file?: File; record?: StirlingFileStub } {
   const primaryFileId = stateRef.current.files.ids[0];
   if (!primaryFileId) return {};
 
   return {
     file: filesRef.current.get(primaryFileId),
-    record: stateRef.current.files.byId[primaryFileId]
+    record: stateRef.current.files.byId[primaryFileId],
   };
 }
diff --git a/frontend/src/core/contexts/file/lifecycle.ts b/frontend/src/core/contexts/file/lifecycle.ts
index 93feac3754..7e072d7db0 100644
--- a/frontend/src/core/contexts/file/lifecycle.ts
+++ b/frontend/src/core/contexts/file/lifecycle.ts
@@ -2,10 +2,14 @@
  * File lifecycle management - Resource cleanup and memory management
  */
 
-import { FileId } from '@app/types/file';
-import { FileContextAction, StirlingFileStub, ProcessedFilePage } from '@app/types/fileContext';
+import { FileId } from "@app/types/file";
+import {
+  FileContextAction,
+  StirlingFileStub,
+  ProcessedFilePage,
+} from "@app/types/fileContext";
 
-const DEBUG = process.env.NODE_ENV === 'development';
+const DEBUG = process.env.NODE_ENV === "development";
 
 /**
  * Resource tracking and cleanup utilities
@@ -17,7 +21,7 @@ export class FileLifecycleManager {
 
   constructor(
     private filesRef: React.MutableRefObject<Map<FileId, File>>,
-    private dispatch: React.Dispatch<FileContextAction>
+    private dispatch: React.Dispatch<FileContextAction>,
   ) {}
 
   /**
@@ -25,21 +29,23 @@ export class FileLifecycleManager {
    */
   trackBlobUrl = (url: string): void => {
     // Only track actual blob URLs to avoid trying to revoke other schemes
-    if (url.startsWith('blob:')) {
+    if (url.startsWith("blob:")) {
       this.blobUrls.add(url);
     }
   };
 
-
   /**
    * Clean up resources for a specific file (with stateRef access for complete cleanup)
    */
-  cleanupFile = (fileId: FileId, stateRef?: React.MutableRefObject<any>): void => {
+  cleanupFile = (
+    fileId: FileId,
+    stateRef?: React.MutableRefObject<any>,
+  ): void => {
     // Use comprehensive cleanup (same as removeFiles)
     this.cleanupAllResourcesForFile(fileId, stateRef);
 
     // Remove file from state
-    this.dispatch({ type: 'REMOVE_FILES', payload: { fileIds: [fileId] } });
+    this.dispatch({ type: "REMOVE_FILES", payload: { fileIds: [fileId] } });
   };
 
   /**
@@ -47,7 +53,7 @@ export class FileLifecycleManager {
    */
   cleanupAllFiles = (): void => {
     // Revoke all blob URLs
-    this.blobUrls.forEach(url => {
+    this.blobUrls.forEach((url) => {
       try {
         URL.revokeObjectURL(url);
       } catch {
@@ -57,7 +63,7 @@ export class FileLifecycleManager {
     this.blobUrls.clear();
 
     // Clear all cleanup timers and generations
-    this.cleanupTimers.forEach(timer => clearTimeout(timer));
+    this.cleanupTimers.forEach((timer) => clearTimeout(timer));
     this.cleanupTimers.clear();
     this.fileGenerations.clear();
 
@@ -68,7 +74,11 @@ export class FileLifecycleManager {
   /**
    * Schedule delayed cleanup for a file with generation token to prevent stale cleanup
    */
-  scheduleCleanup = (fileId: FileId, delay: number = 30000, stateRef?: React.MutableRefObject<any>): void => {
+  scheduleCleanup = (
+    fileId: FileId,
+    delay: number = 30000,
+    stateRef?: React.MutableRefObject<any>,
+  ): void => {
     // Cancel existing timer
     const existingTimer = this.cleanupTimers.get(fileId);
     if (existingTimer) {
@@ -91,7 +101,10 @@ export class FileLifecycleManager {
       if (this.fileGenerations.get(fileId) === currentGen) {
         this.cleanupFile(fileId, stateRef);
       } else {
-        if (DEBUG) console.log(`🗂� Skipped stale cleanup for file ${fileId} (generation mismatch)`);
+        if (DEBUG)
+          console.log(
+            `🗂� Skipped stale cleanup for file ${fileId} (generation mismatch)`,
+          );
       }
     }, delay);
 
@@ -101,20 +114,26 @@ export class FileLifecycleManager {
   /**
    * Remove a file immediately with complete resource cleanup
    */
-  removeFiles = (fileIds: FileId[], stateRef?: React.MutableRefObject<any>): void => {
-    fileIds.forEach(fileId => {
+  removeFiles = (
+    fileIds: FileId[],
+    stateRef?: React.MutableRefObject<any>,
+  ): void => {
+    fileIds.forEach((fileId) => {
       // Clean up all resources for this file
       this.cleanupAllResourcesForFile(fileId, stateRef);
     });
 
     // Dispatch removal action once for all files (reducer only updates state)
-    this.dispatch({ type: 'REMOVE_FILES', payload: { fileIds } });
+    this.dispatch({ type: "REMOVE_FILES", payload: { fileIds } });
   };
 
   /**
    * Complete resource cleanup for a single file
    */
-  private cleanupAllResourcesForFile = (fileId: FileId, stateRef?: React.MutableRefObject<any>): void => {
+  private cleanupAllResourcesForFile = (
+    fileId: FileId,
+    stateRef?: React.MutableRefObject<any>,
+  ): void => {
     // Remove from files ref
     this.filesRef.current.delete(fileId);
 
@@ -131,7 +150,7 @@ export class FileLifecycleManager {
       const record = stateRef.current.files.byId[fileId];
       if (record) {
         // Clean up thumbnail blob URLs
-        if (record.thumbnailUrl && record.thumbnailUrl.startsWith('blob:')) {
+        if (record.thumbnailUrl && record.thumbnailUrl.startsWith("blob:")) {
           try {
             URL.revokeObjectURL(record.thumbnailUrl);
           } catch {
@@ -139,7 +158,7 @@ export class FileLifecycleManager {
           }
         }
 
-        if (record.blobUrl && record.blobUrl.startsWith('blob:')) {
+        if (record.blobUrl && record.blobUrl.startsWith("blob:")) {
           try {
             URL.revokeObjectURL(record.blobUrl);
           } catch {
@@ -150,7 +169,7 @@ export class FileLifecycleManager {
         // Clean up processed file thumbnails
         if (record.processedFile?.pages) {
           record.processedFile.pages.forEach((page: ProcessedFilePage) => {
-            if (page.thumbnail && page.thumbnail.startsWith('blob:')) {
+            if (page.thumbnail && page.thumbnail.startsWith("blob:")) {
               try {
                 URL.revokeObjectURL(page.thumbnail);
               } catch {
@@ -166,20 +185,31 @@ export class FileLifecycleManager {
   /**
    * Update file record with race condition guards
    */
-  updateStirlingFileStub = (fileId: FileId, updates: Partial<StirlingFileStub>, stateRef?: React.MutableRefObject<any>): void => {
+  updateStirlingFileStub = (
+    fileId: FileId,
+    updates: Partial<StirlingFileStub>,
+    stateRef?: React.MutableRefObject<any>,
+  ): void => {
     // Guard against updating removed files (race condition protection)
     if (!this.filesRef.current.has(fileId)) {
-      if (DEBUG) console.warn(`🗂� Attempted to update removed file (filesRef): ${fileId}`);
+      if (DEBUG)
+        console.warn(
+          `🗂� Attempted to update removed file (filesRef): ${fileId}`,
+        );
       return;
     }
 
     // Additional state guard for rare race conditions
     if (stateRef && !stateRef.current.files.byId[fileId]) {
-      if (DEBUG) console.warn(`🗂� Attempted to update removed file (state): ${fileId}`);
+      if (DEBUG)
+        console.warn(`🗂� Attempted to update removed file (state): ${fileId}`);
       return;
     }
 
-    this.dispatch({ type: 'UPDATE_FILE_RECORD', payload: { id: fileId, updates } });
+    this.dispatch({
+      type: "UPDATE_FILE_RECORD",
+      payload: { id: fileId, updates },
+    });
   };
 
   /**
diff --git a/frontend/src/core/contexts/toolWorkflow/toolWorkflowState.ts b/frontend/src/core/contexts/toolWorkflow/toolWorkflowState.ts
index 42fdd6f159..bb7193d3e8 100644
--- a/frontend/src/core/contexts/toolWorkflow/toolWorkflowState.ts
+++ b/frontend/src/core/contexts/toolWorkflow/toolWorkflowState.ts
@@ -1,10 +1,13 @@
-import { PageEditorFunctions } from '@app/types/pageEditor';
-import { type ToolPanelMode, DEFAULT_TOOL_PANEL_MODE } from '@app/constants/toolPanel';
+import { PageEditorFunctions } from "@app/types/pageEditor";
+import {
+  type ToolPanelMode,
+  DEFAULT_TOOL_PANEL_MODE,
+} from "@app/constants/toolPanel";
 
 export interface ToolWorkflowState {
   // UI State
   sidebarsVisible: boolean;
-  leftPanelView: 'toolPicker' | 'toolContent' | 'hidden';
+  leftPanelView: "toolPicker" | "toolContent" | "hidden";
   readerMode: boolean;
   toolPanelMode: ToolPanelMode;
 
@@ -17,23 +20,25 @@ export interface ToolWorkflowState {
 
 // Actions
 export type ToolWorkflowAction =
-  | { type: 'SET_SIDEBARS_VISIBLE'; payload: boolean }
-  | { type: 'SET_LEFT_PANEL_VIEW'; payload: 'toolPicker' | 'toolContent' | 'hidden' }
-  | { type: 'SET_READER_MODE'; payload: boolean }
-  | { type: 'SET_TOOL_PANEL_MODE'; payload: ToolPanelMode }
-  | { type: 'SET_PREVIEW_FILE'; payload: File | null }
-  | { type: 'SET_PAGE_EDITOR_FUNCTIONS'; payload: PageEditorFunctions | null }
-  | { type: 'SET_SEARCH_QUERY'; payload: string }
-  | { type: 'RESET_UI_STATE' };
+  | { type: "SET_SIDEBARS_VISIBLE"; payload: boolean }
+  | {
+      type: "SET_LEFT_PANEL_VIEW";
+      payload: "toolPicker" | "toolContent" | "hidden";
+    }
+  | { type: "SET_READER_MODE"; payload: boolean }
+  | { type: "SET_TOOL_PANEL_MODE"; payload: ToolPanelMode }
+  | { type: "SET_PREVIEW_FILE"; payload: File | null }
+  | { type: "SET_PAGE_EDITOR_FUNCTIONS"; payload: PageEditorFunctions | null }
+  | { type: "SET_SEARCH_QUERY"; payload: string }
+  | { type: "RESET_UI_STATE" };
 
-  
-export const baseState: Omit<ToolWorkflowState, 'toolPanelMode'> = {
+export const baseState: Omit<ToolWorkflowState, "toolPanelMode"> = {
   sidebarsVisible: true,
-  leftPanelView: 'toolPicker',
+  leftPanelView: "toolPicker",
   readerMode: false,
   previewFile: null,
   pageEditorFunctions: null,
-  searchQuery: '',
+  searchQuery: "",
 };
 
 export const createInitialState = (): ToolWorkflowState => ({
@@ -41,23 +46,26 @@ export const createInitialState = (): ToolWorkflowState => ({
   toolPanelMode: DEFAULT_TOOL_PANEL_MODE,
 });
 
-export function toolWorkflowReducer(state: ToolWorkflowState, action: ToolWorkflowAction): ToolWorkflowState {
+export function toolWorkflowReducer(
+  state: ToolWorkflowState,
+  action: ToolWorkflowAction,
+): ToolWorkflowState {
   switch (action.type) {
-    case 'SET_SIDEBARS_VISIBLE':
+    case "SET_SIDEBARS_VISIBLE":
       return { ...state, sidebarsVisible: action.payload };
-    case 'SET_LEFT_PANEL_VIEW':
+    case "SET_LEFT_PANEL_VIEW":
       return { ...state, leftPanelView: action.payload };
-    case 'SET_READER_MODE':
+    case "SET_READER_MODE":
       return { ...state, readerMode: action.payload };
-    case 'SET_TOOL_PANEL_MODE':
+    case "SET_TOOL_PANEL_MODE":
       return { ...state, toolPanelMode: action.payload };
-    case 'SET_PREVIEW_FILE':
+    case "SET_PREVIEW_FILE":
       return { ...state, previewFile: action.payload };
-    case 'SET_PAGE_EDITOR_FUNCTIONS':
+    case "SET_PAGE_EDITOR_FUNCTIONS":
       return { ...state, pageEditorFunctions: action.payload };
-    case 'SET_SEARCH_QUERY':
+    case "SET_SEARCH_QUERY":
       return { ...state, searchQuery: action.payload };
-    case 'RESET_UI_STATE':
+    case "RESET_UI_STATE":
       return {
         ...baseState,
         toolPanelMode: state.toolPanelMode,
@@ -67,5 +75,3 @@ export function toolWorkflowReducer(state: ToolWorkflowState, action: ToolWorkfl
       return state;
   }
 }
-
-
diff --git a/frontend/src/core/contexts/viewer/viewerActions.ts b/frontend/src/core/contexts/viewer/viewerActions.ts
index 2a704163e4..d1d695a451 100644
--- a/frontend/src/core/contexts/viewer/viewerActions.ts
+++ b/frontend/src/core/contexts/viewer/viewerActions.ts
@@ -1,14 +1,14 @@
-import { MutableRefObject } from 'react';
-import { SpreadMode } from '@embedpdf/plugin-spread/react';
+import { MutableRefObject } from "react";
+import { SpreadMode } from "@embedpdf/plugin-spread/react";
 import {
   ViewerBridgeRegistry,
   ScrollState,
   ZoomState,
-} from '@app/contexts/viewer/viewerBridges';
-import { PdfBookmarkObject, PdfAttachmentObject } from '@embedpdf/models';
+} from "@app/contexts/viewer/viewerBridges";
+import { PdfBookmarkObject, PdfAttachmentObject } from "@embedpdf/models";
 
 export interface ScrollActions {
-  scrollToPage: (page: number, behavior?: 'smooth' | 'instant') => void;
+  scrollToPage: (page: number, behavior?: "smooth" | "instant") => void;
   scrollToFirstPage: () => void;
   scrollToPreviousPage: () => void;
   scrollToNextPage: () => void;
@@ -62,14 +62,20 @@ export interface ExportActions {
 export interface BookmarkActions {
   fetchBookmarks: () => Promise<PdfBookmarkObject[] | null>;
   clearBookmarks: () => void;
-  setLocalBookmarks: (bookmarks: PdfBookmarkObject[] | null, error?: string | null) => void;
+  setLocalBookmarks: (
+    bookmarks: PdfBookmarkObject[] | null,
+    error?: string | null,
+  ) => void;
 }
 
 export interface AttachmentActions {
   getAttachments: () => Promise<PdfAttachmentObject[] | null>;
   downloadAttachment: (attachment: PdfAttachmentObject) => void;
   clearAttachments: () => void;
-  setLocalAttachments: (attachments: PdfAttachmentObject[] | null, error?: string | null) => void;
+  setLocalAttachments: (
+    attachments: PdfAttachmentObject[] | null,
+    error?: string | null,
+  ) => void;
 }
 
 export interface PrintActions {
@@ -104,15 +110,21 @@ export function createViewerActions({
   triggerImmediateZoomUpdate,
 }: ViewerActionDependencies): ViewerActionsBundle {
   const scrollActions: ScrollActions = {
-    scrollToPage: (page: number, behavior?: 'smooth' | 'instant') => {
+    scrollToPage: (page: number, behavior?: "smooth" | "instant") => {
       const api = registry.current.scroll?.api;
       if (api?.scrollToPage) {
         try {
-          api.scrollToPage({ pageNumber: page, behavior: behavior || 'smooth' });
+          api.scrollToPage({
+            pageNumber: page,
+            behavior: behavior || "smooth",
+          });
         } catch (error) {
           // Silently handle "Strategy not found" errors that occur during document transitions
-          if (process.env.NODE_ENV === 'development') {
-            console.warn('[ScrollActions] scrollToPage failed (document may be transitioning):', error);
+          if (process.env.NODE_ENV === "development") {
+            console.warn(
+              "[ScrollActions] scrollToPage failed (document may be transitioning):",
+              error,
+            );
           }
         }
       }
@@ -123,8 +135,8 @@ export function createViewerActions({
         try {
           api.scrollToPage({ pageNumber: 1 });
         } catch (error) {
-          if (process.env.NODE_ENV === 'development') {
-            console.warn('[ScrollActions] scrollToFirstPage failed:', error);
+          if (process.env.NODE_ENV === "development") {
+            console.warn("[ScrollActions] scrollToFirstPage failed:", error);
           }
         }
       }
@@ -135,8 +147,8 @@ export function createViewerActions({
         try {
           api.scrollToPreviousPage();
         } catch (error) {
-          if (process.env.NODE_ENV === 'development') {
-            console.warn('[ScrollActions] scrollToPreviousPage failed:', error);
+          if (process.env.NODE_ENV === "development") {
+            console.warn("[ScrollActions] scrollToPreviousPage failed:", error);
           }
         }
       }
@@ -147,8 +159,8 @@ export function createViewerActions({
         try {
           api.scrollToNextPage();
         } catch (error) {
-          if (process.env.NODE_ENV === 'development') {
-            console.warn('[ScrollActions] scrollToNextPage failed:', error);
+          if (process.env.NODE_ENV === "development") {
+            console.warn("[ScrollActions] scrollToNextPage failed:", error);
           }
         }
       }
@@ -160,8 +172,8 @@ export function createViewerActions({
         try {
           api.scrollToPage({ pageNumber: state.totalPages });
         } catch (error) {
-          if (process.env.NODE_ENV === 'development') {
-            console.warn('[ScrollActions] scrollToLastPage failed:', error);
+          if (process.env.NODE_ENV === "development") {
+            console.warn("[ScrollActions] scrollToLastPage failed:", error);
           }
         }
       }
@@ -175,7 +187,7 @@ export function createViewerActions({
         const currentState = getZoomState();
         const newPercent = Math.min(
           Math.round(currentState.zoomPercent * 1.2),
-          300
+          300,
         );
         triggerImmediateZoomUpdate(newPercent);
         api.zoomIn();
@@ -187,7 +199,7 @@ export function createViewerActions({
         const currentState = getZoomState();
         const newPercent = Math.max(
           Math.round(currentState.zoomPercent / 1.2),
-          20
+          20,
         );
         triggerImmediateZoomUpdate(newPercent);
         api.zoomOut();
@@ -238,9 +250,9 @@ export function createViewerActions({
     getSelectedText: () => {
       const api = registry.current.selection?.api;
       if (api?.getSelectedText) {
-        return api.getSelectedText() ?? '';
+        return api.getSelectedText() ?? "";
       }
-      return '';
+      return "";
     },
     getFormattedSelection: () => {
       const api = registry.current.selection?.api;
@@ -342,7 +354,7 @@ export function createViewerActions({
           const result = api.saveAsCopy();
           return await result.toPromise();
         } catch (error) {
-          console.error('Failed to save PDF copy:', error);
+          console.error("Failed to save PDF copy:", error);
           return null;
         }
       }
diff --git a/frontend/src/core/contexts/viewer/viewerBridges.ts b/frontend/src/core/contexts/viewer/viewerBridges.ts
index 3812acaf59..85739cccfd 100644
--- a/frontend/src/core/contexts/viewer/viewerBridges.ts
+++ b/frontend/src/core/contexts/viewer/viewerBridges.ts
@@ -1,5 +1,5 @@
-import { SpreadMode } from '@embedpdf/plugin-spread/react';
-import { PdfBookmarkObject, PdfAttachmentObject } from '@embedpdf/models';
+import { SpreadMode } from "@embedpdf/plugin-spread/react";
+import { PdfBookmarkObject, PdfAttachmentObject } from "@embedpdf/models";
 
 export enum PdfPermissionFlag {
   Print = 0x0004,
@@ -34,7 +34,10 @@ export interface DocumentPermissionsAPIWrapper {
 }
 
 export interface ScrollAPIWrapper {
-  scrollToPage: (params: { pageNumber: number; behavior?: ScrollBehavior }) => void;
+  scrollToPage: (params: {
+    pageNumber: number;
+    behavior?: ScrollBehavior;
+  }) => void;
   scrollToPreviousPage: () => void;
   scrollToNextPage: () => void;
 }
@@ -86,7 +89,10 @@ export interface PrintAPIWrapper {
 }
 
 export interface ThumbnailAPIWrapper {
-  renderThumb: (pageIndex: number, scale: number) => {
+  renderThumb: (
+    pageIndex: number,
+    scale: number,
+  ) => {
     toPromise: () => Promise<Blob>;
   };
 }
@@ -98,14 +104,20 @@ export interface ExportAPIWrapper {
 export interface BookmarkAPIWrapper {
   fetchBookmarks: () => Promise<PdfBookmarkObject[]>;
   clearBookmarks: () => void;
-  setLocalBookmarks: (bookmarks: PdfBookmarkObject[] | null, error?: string | null) => void;
+  setLocalBookmarks: (
+    bookmarks: PdfBookmarkObject[] | null,
+    error?: string | null,
+  ) => void;
 }
 
 export interface AttachmentAPIWrapper {
   getAttachments: () => Promise<PdfAttachmentObject[]>;
   downloadAttachment: (attachment: PdfAttachmentObject) => void;
   clearAttachments: () => void;
-  setLocalAttachments: (attachments: PdfAttachmentObject[] | null, error?: string | null) => void;
+  setLocalAttachments: (
+    attachments: PdfAttachmentObject[] | null,
+    error?: string | null,
+  ) => void;
 }
 
 export interface ScrollState {
@@ -226,7 +238,7 @@ export const createBridgeRegistry = (): ViewerBridgeRegistry => ({
 export function registerBridge<K extends BridgeKey>(
   registry: ViewerBridgeRegistry,
   type: K,
-  ref: BridgeRef<BridgeStateMap[K], BridgeApiMap[K]> | null
+  ref: BridgeRef<BridgeStateMap[K], BridgeApiMap[K]> | null,
 ): void {
   registry[type] = ref as ViewerBridgeRegistry[K];
 }
@@ -234,14 +246,14 @@ export function registerBridge<K extends BridgeKey>(
 export function getBridgeState<K extends BridgeKey>(
   registry: ViewerBridgeRegistry,
   type: K,
-  fallback: BridgeStateMap[K]
+  fallback: BridgeStateMap[K],
 ): BridgeStateMap[K] {
   return registry[type]?.state ?? fallback;
 }
 
 export function getBridgeApi<K extends BridgeKey>(
   registry: ViewerBridgeRegistry,
-  type: K
+  type: K,
 ): BridgeApiMap[K] | null {
   return registry[type]?.api ?? null;
 }
diff --git a/frontend/src/core/data/toolsTaxonomy.ts b/frontend/src/core/data/toolsTaxonomy.ts
index bb22dfeb7b..7ad144c63d 100644
--- a/frontend/src/core/data/toolsTaxonomy.ts
+++ b/frontend/src/core/data/toolsTaxonomy.ts
@@ -1,75 +1,84 @@
-import { type TFunction } from 'i18next';
-import React from 'react';
-import { ToolOperationConfig } from '@app/hooks/tools/shared/toolOperationTypes';
-import { BaseToolProps } from '@app/types/tool';
-import { WorkbenchType } from '@app/types/workbench';
-import { LinkToolId, RegularToolId, SuperToolId, ToolId, ToolKind } from '@app/types/toolId';
-import DrawRoundedIcon from '@mui/icons-material/DrawRounded';
-import SecurityRoundedIcon from '@mui/icons-material/SecurityRounded';
-import VerifiedUserRoundedIcon from '@mui/icons-material/VerifiedUserRounded';
-import RateReviewRoundedIcon from '@mui/icons-material/RateReviewRounded';
-import ViewAgendaRoundedIcon from '@mui/icons-material/ViewAgendaRounded';
-import FileDownloadRoundedIcon from '@mui/icons-material/FileDownloadRounded';
-import DeleteSweepRoundedIcon from '@mui/icons-material/DeleteSweepRounded';
-import SmartToyRoundedIcon from '@mui/icons-material/SmartToyRounded';
-import BuildRoundedIcon from '@mui/icons-material/BuildRounded';
-import TuneRoundedIcon from '@mui/icons-material/TuneRounded';
-import CodeRoundedIcon from '@mui/icons-material/CodeRounded';
-import { ProprietaryToolId } from '@app/types/proprietaryToolId';
+import { type TFunction } from "i18next";
+import React from "react";
+import { ToolOperationConfig } from "@app/hooks/tools/shared/toolOperationTypes";
+import { BaseToolProps } from "@app/types/tool";
+import { WorkbenchType } from "@app/types/workbench";
+import {
+  LinkToolId,
+  RegularToolId,
+  SuperToolId,
+  ToolId,
+  ToolKind,
+} from "@app/types/toolId";
+import DrawRoundedIcon from "@mui/icons-material/DrawRounded";
+import SecurityRoundedIcon from "@mui/icons-material/SecurityRounded";
+import VerifiedUserRoundedIcon from "@mui/icons-material/VerifiedUserRounded";
+import RateReviewRoundedIcon from "@mui/icons-material/RateReviewRounded";
+import ViewAgendaRoundedIcon from "@mui/icons-material/ViewAgendaRounded";
+import FileDownloadRoundedIcon from "@mui/icons-material/FileDownloadRounded";
+import DeleteSweepRoundedIcon from "@mui/icons-material/DeleteSweepRounded";
+import SmartToyRoundedIcon from "@mui/icons-material/SmartToyRounded";
+import BuildRoundedIcon from "@mui/icons-material/BuildRounded";
+import TuneRoundedIcon from "@mui/icons-material/TuneRounded";
+import CodeRoundedIcon from "@mui/icons-material/CodeRounded";
+import { ProprietaryToolId } from "@app/types/proprietaryToolId";
 
 export enum SubcategoryId {
-  SIGNING = 'signing',
-  DOCUMENT_SECURITY = 'documentSecurity',
-  VERIFICATION = 'verification',
-  DOCUMENT_REVIEW = 'documentReview',
-  PAGE_FORMATTING = 'pageFormatting',
-  EXTRACTION = 'extraction',
-  REMOVAL = 'removal',
-  AUTOMATION = 'automation',
-  GENERAL = 'general',
-  ADVANCED_FORMATTING = 'advancedFormatting',
-  DEVELOPER_TOOLS = 'developerTools'
+  SIGNING = "signing",
+  DOCUMENT_SECURITY = "documentSecurity",
+  VERIFICATION = "verification",
+  DOCUMENT_REVIEW = "documentReview",
+  PAGE_FORMATTING = "pageFormatting",
+  EXTRACTION = "extraction",
+  REMOVAL = "removal",
+  AUTOMATION = "automation",
+  GENERAL = "general",
+  ADVANCED_FORMATTING = "advancedFormatting",
+  DEVELOPER_TOOLS = "developerTools",
 }
 
 export enum ToolCategoryId {
-  STANDARD_TOOLS = 'standardTools',
-  ADVANCED_TOOLS = 'advancedTools',
-  RECOMMENDED_TOOLS = 'recommendedTools'
+  STANDARD_TOOLS = "standardTools",
+  ADVANCED_TOOLS = "advancedTools",
+  RECOMMENDED_TOOLS = "recommendedTools",
 }
 
 export type ToolRegistryEntry = {
-	icon: React.ReactNode;
-	name: string;
-	component: React.ComponentType<BaseToolProps> | null;
-	description: string;
-	categoryId: ToolCategoryId;
-	subcategoryId: SubcategoryId;
-	maxFiles?: number;
-	supportedFormats?: string[];
-	endpoints?: string[];
-	link?: string;
-	kind?: ToolKind;
-	// Workbench type for navigation
-	workbench?: WorkbenchType;
-	// Operation configuration for automation
-	operationConfig?: ToolOperationConfig<any>;
-	// Settings component for automation configuration
-	automationSettings: React.ComponentType<any> | null;
-	// Whether this tool supports automation (defaults to true)
-	supportsAutomate?: boolean;
-	// Synonyms for search (optional)
-	synonyms?: string[];
-	// Version status indicator (e.g., "alpha", "beta")
-	versionStatus?: "alpha" | "beta";
-	// Whether this tool requires premium access
-	requiresPremium?: boolean;
-}
+  icon: React.ReactNode;
+  name: string;
+  component: React.ComponentType<BaseToolProps> | null;
+  description: string;
+  categoryId: ToolCategoryId;
+  subcategoryId: SubcategoryId;
+  maxFiles?: number;
+  supportedFormats?: string[];
+  endpoints?: string[];
+  link?: string;
+  kind?: ToolKind;
+  // Workbench type for navigation
+  workbench?: WorkbenchType;
+  // Operation configuration for automation
+  operationConfig?: ToolOperationConfig<any>;
+  // Settings component for automation configuration
+  automationSettings: React.ComponentType<any> | null;
+  // Whether this tool supports automation (defaults to true)
+  supportsAutomate?: boolean;
+  // Synonyms for search (optional)
+  synonyms?: string[];
+  // Version status indicator (e.g., "alpha", "beta")
+  versionStatus?: "alpha" | "beta";
+  // Whether this tool requires premium access
+  requiresPremium?: boolean;
+};
 
 export type RegularToolRegistry = Record<RegularToolId, ToolRegistryEntry>;
 export type SuperToolRegistry = Record<SuperToolId, ToolRegistryEntry>;
 export type LinkToolRegistry = Record<LinkToolId, ToolRegistryEntry>;
 export type ToolRegistry = Record<ToolId, ToolRegistryEntry>;
-export type ProprietaryToolRegistry = Record<ProprietaryToolId, ToolRegistryEntry>;
+export type ProprietaryToolRegistry = Record<
+  ProprietaryToolId,
+  ToolRegistryEntry
+>;
 
 export const SUBCATEGORY_ORDER: SubcategoryId[] = [
   SubcategoryId.SIGNING,
@@ -86,20 +95,22 @@ export const SUBCATEGORY_ORDER: SubcategoryId[] = [
 ];
 
 export const SUBCATEGORY_COLOR_MAP: Record<SubcategoryId, string> = {
-  [SubcategoryId.SIGNING]: 'var(--category-color-signing)',           // Green
-  [SubcategoryId.DOCUMENT_SECURITY]: 'var(--category-color-security)', // Orange
-  [SubcategoryId.VERIFICATION]: 'var(--category-color-verification)',      // Orange
-  [SubcategoryId.DOCUMENT_REVIEW]: 'var(--category-color-general)',   // Blue
-  [SubcategoryId.PAGE_FORMATTING]: 'var(--category-color-formatting)',   // Purple
-  [SubcategoryId.EXTRACTION]: 'var(--category-color-extraction)',        // Cyan
-  [SubcategoryId.REMOVAL]: 'var(--category-color-removal)',           // Red
-  [SubcategoryId.AUTOMATION]: 'var(--category-color-automation)',        // Pink
-  [SubcategoryId.GENERAL]: 'var(--category-color-general)',           // Blue
-  [SubcategoryId.ADVANCED_FORMATTING]: 'var(--category-color-formatting)', // Purple
-  [SubcategoryId.DEVELOPER_TOOLS]: 'var(--category-color-developer)',   // Gray
+  [SubcategoryId.SIGNING]: "var(--category-color-signing)", // Green
+  [SubcategoryId.DOCUMENT_SECURITY]: "var(--category-color-security)", // Orange
+  [SubcategoryId.VERIFICATION]: "var(--category-color-verification)", // Orange
+  [SubcategoryId.DOCUMENT_REVIEW]: "var(--category-color-general)", // Blue
+  [SubcategoryId.PAGE_FORMATTING]: "var(--category-color-formatting)", // Purple
+  [SubcategoryId.EXTRACTION]: "var(--category-color-extraction)", // Cyan
+  [SubcategoryId.REMOVAL]: "var(--category-color-removal)", // Red
+  [SubcategoryId.AUTOMATION]: "var(--category-color-automation)", // Pink
+  [SubcategoryId.GENERAL]: "var(--category-color-general)", // Blue
+  [SubcategoryId.ADVANCED_FORMATTING]: "var(--category-color-formatting)", // Purple
+  [SubcategoryId.DEVELOPER_TOOLS]: "var(--category-color-developer)", // Gray
 };
 
-export const getSubcategoryIcon = (subcategory: SubcategoryId): React.ReactNode => {
+export const getSubcategoryIcon = (
+  subcategory: SubcategoryId,
+): React.ReactNode => {
   switch (subcategory) {
     case SubcategoryId.SIGNING:
       return React.createElement(DrawRoundedIcon);
@@ -128,15 +139,16 @@ export const getSubcategoryIcon = (subcategory: SubcategoryId): React.ReactNode
   }
 };
 
-export const getCategoryLabel = (t: TFunction, id: ToolCategoryId): string => t(`toolPicker.categories.${id}`, id);
-export const getSubcategoryLabel = (t: TFunction, id: SubcategoryId): string => t(`toolPicker.subcategories.${id}`, id);
-export const getSubcategoryColor = (subcategory: SubcategoryId): string => SUBCATEGORY_COLOR_MAP[subcategory] || '#7882FF';
-
-
+export const getCategoryLabel = (t: TFunction, id: ToolCategoryId): string =>
+  t(`toolPicker.categories.${id}`, id);
+export const getSubcategoryLabel = (t: TFunction, id: SubcategoryId): string =>
+  t(`toolPicker.subcategories.${id}`, id);
+export const getSubcategoryColor = (subcategory: SubcategoryId): string =>
+  SUBCATEGORY_COLOR_MAP[subcategory] || "#7882FF";
 
 export const getAllEndpoints = (registry: ToolRegistry): string[] => {
   const lists: string[][] = [];
-  Object.values(registry).forEach(entry => {
+  Object.values(registry).forEach((entry) => {
     if (entry.endpoints && entry.endpoints.length > 0) {
       lists.push(entry.endpoints);
     }
@@ -144,10 +156,12 @@ export const getAllEndpoints = (registry: ToolRegistry): string[] => {
   return Array.from(new Set(lists.flat()));
 };
 
-export const getConversionEndpoints = (extensionToEndpoint: Record<string, Record<string, string>>): string[] => {
+export const getConversionEndpoints = (
+  extensionToEndpoint: Record<string, Record<string, string>>,
+): string[] => {
   const endpoints = new Set<string>();
-  Object.values(extensionToEndpoint).forEach(toEndpoints => {
-    Object.values(toEndpoints).forEach(endpoint => {
+  Object.values(extensionToEndpoint).forEach((toEndpoints) => {
+    Object.values(toEndpoints).forEach((endpoint) => {
       endpoints.add(endpoint);
     });
   });
@@ -156,10 +170,12 @@ export const getConversionEndpoints = (extensionToEndpoint: Record<string, Recor
 
 export const getAllApplicationEndpoints = (
   registry: ToolRegistry,
-  extensionToEndpoint?: Record<string, Record<string, string>>
+  extensionToEndpoint?: Record<string, Record<string, string>>,
 ): string[] => {
   const toolEp = getAllEndpoints(registry);
-  const convEp = extensionToEndpoint ? getConversionEndpoints(extensionToEndpoint) : [];
+  const convEp = extensionToEndpoint
+    ? getConversionEndpoints(extensionToEndpoint)
+    : [];
   return Array.from(new Set([...toolEp, ...convEp]));
 };
 
@@ -167,7 +183,7 @@ export const getAllApplicationEndpoints = (
  * Default workbench for tools that don't specify one
  * Returns null to trigger the default case in Workbench component (ToolRenderer)
  */
-export const getDefaultToolWorkbench = (): WorkbenchType => 'fileEditor';
+export const getDefaultToolWorkbench = (): WorkbenchType => "fileEditor";
 
 /**
  * Get workbench type for a tool
@@ -180,13 +196,16 @@ export const getToolWorkbench = (tool: ToolRegistryEntry): WorkbenchType => {
  * Get URL path for a tool
  */
 export const getToolUrlPath = (toolId: string): string => {
-  return `/${toolId.replace(/([A-Z])/g, '-$1').toLowerCase()}`;
+  return `/${toolId.replace(/([A-Z])/g, "-$1").toLowerCase()}`;
 };
 
 /**
  * Check if a tool ID exists in the registry
  */
-export const isValidToolId = (toolId: string, registry: ToolRegistry): boolean => {
+export const isValidToolId = (
+  toolId: string,
+  registry: ToolRegistry,
+): boolean => {
   return toolId in registry;
 };
 
diff --git a/frontend/src/core/data/useProprietaryToolRegistry.tsx b/frontend/src/core/data/useProprietaryToolRegistry.tsx
index d0a64efa58..8b0d0440cf 100644
--- a/frontend/src/core/data/useProprietaryToolRegistry.tsx
+++ b/frontend/src/core/data/useProprietaryToolRegistry.tsx
@@ -11,5 +11,5 @@ import { type ProprietaryToolRegistry } from "@app/data/toolsTaxonomy";
 
 // Empty hook that returns empty registry (overridden in proprietary version)
 export function useProprietaryToolRegistry(): ProprietaryToolRegistry {
-  return useMemo(() => ({} as ProprietaryToolRegistry), []);
+  return useMemo(() => ({}) as ProprietaryToolRegistry, []);
 }
diff --git a/frontend/src/core/data/useTranslatedToolRegistry.tsx b/frontend/src/core/data/useTranslatedToolRegistry.tsx
index 6469ec471f..d1e40b54d9 100644
--- a/frontend/src/core/data/useTranslatedToolRegistry.tsx
+++ b/frontend/src/core/data/useTranslatedToolRegistry.tsx
@@ -22,7 +22,7 @@ import {
   SuperToolRegistry,
   LinkToolRegistry,
 } from "@app/data/toolsTaxonomy";
-import { isSuperToolId, isLinkToolId } from '@app/types/toolId';
+import { isSuperToolId, isLinkToolId } from "@app/types/toolId";
 import AdjustContrast from "@app/tools/AdjustContrast";
 import AdjustContrastSingleStepSettings from "@app/components/tools/adjustContrast/AdjustContrastSingleStepSettings";
 import { adjustContrastOperationConfig } from "@app/hooks/tools/adjustContrast/useAdjustContrastOperation";
@@ -32,8 +32,8 @@ import GetPdfInfo from "@app/tools/GetPdfInfo";
 import AddWatermark from "@app/tools/AddWatermark";
 import AddStamp from "@app/tools/AddStamp";
 import AddAttachments from "@app/tools/AddAttachments";
-import Merge from '@app/tools/Merge';
-import EditTableOfContents from '@app/tools/EditTableOfContents';
+import Merge from "@app/tools/Merge";
+import EditTableOfContents from "@app/tools/EditTableOfContents";
 import Repair from "@app/tools/Repair";
 import AutoRename from "@app/tools/AutoRename";
 import SingleLargePage from "@app/tools/SingleLargePage";
@@ -73,8 +73,8 @@ import { changePermissionsOperationConfig } from "@app/hooks/tools/changePermiss
 import { certSignOperationConfig } from "@app/hooks/tools/certSign/useCertSignOperation";
 import { timestampPdfOperationConfig } from "@app/hooks/tools/timestampPdf/useTimestampPdfOperation";
 import { bookletImpositionOperationConfig } from "@app/hooks/tools/bookletImposition/useBookletImpositionOperation";
-import { mergeOperationConfig } from '@app/hooks/tools/merge/useMergeOperation';
-import { editTableOfContentsOperationConfig } from '@app/hooks/tools/editTableOfContents/useEditTableOfContentsOperation';
+import { mergeOperationConfig } from "@app/hooks/tools/merge/useMergeOperation";
+import { editTableOfContentsOperationConfig } from "@app/hooks/tools/editTableOfContents/useEditTableOfContentsOperation";
 import { autoRenameOperationConfig } from "@app/hooks/tools/autoRename/useAutoRenameOperation";
 import { flattenOperationConfig } from "@app/hooks/tools/flatten/useFlattenOperation";
 import { redactOperationConfig } from "@app/hooks/tools/redact/useRedactOperation";
@@ -92,7 +92,7 @@ import { adjustPageScaleOperationConfig } from "@app/hooks/tools/adjustPageScale
 import { scannerImageSplitOperationConfig } from "@app/hooks/tools/scannerImageSplit/useScannerImageSplitOperation";
 import { addPageNumbersOperationConfig } from "@app/components/tools/addPageNumbers/useAddPageNumbersOperation";
 import { extractPagesOperationConfig } from "@app/hooks/tools/extractPages/useExtractPagesOperation";
-import { ENDPOINTS as SPLIT_ENDPOINT_NAMES } from '@app/constants/splitConstants';
+import { ENDPOINTS as SPLIT_ENDPOINT_NAMES } from "@app/constants/splitConstants";
 import CompressSettings from "@app/components/tools/compress/CompressSettings";
 import AddPasswordSettings from "@app/components/tools/addPassword/AddPasswordSettings";
 import RemovePasswordSettings from "@app/components/tools/removePassword/RemovePasswordSettings";
@@ -110,7 +110,7 @@ import ReplaceColor from "@app/tools/ReplaceColor";
 import ScannerImageSplit from "@app/tools/ScannerImageSplit";
 import OverlayPdfs from "@app/tools/OverlayPdfs";
 import { ToolId } from "@app/types/toolId";
-import MergeSettings from '@app/components/tools/merge/MergeSettings';
+import MergeSettings from "@app/components/tools/merge/MergeSettings";
 import AdjustPageScaleSettings from "@app/components/tools/adjustPageScale/AdjustPageScaleSettings";
 import ScannerImageSplitSettings from "@app/components/tools/scannerImageSplit/ScannerImageSplitSettings";
 import ChangeMetadataSingleStep from "@app/components/tools/changeMetadata/ChangeMetadataSingleStep";
@@ -139,8 +139,6 @@ import Automate from "@app/tools/Automate";
 import Compare from "@app/tools/Compare";
 import { CONVERT_SUPPORTED_FORMATS } from "@app/constants/convertSupportedFornats";
 
-
-
 export interface TranslatedToolCatalog {
   allTools: ToolRegistry;
   regularTools: RegularToolRegistry;
@@ -159,12 +157,18 @@ export function useTranslatedToolCatalog(): TranslatedToolCatalog {
       ...proprietaryTools,
       // Recommended Tools in order
       pdfTextEditor: {
-        icon: <LocalIcon icon="edit-square-outline-rounded" width="1.5rem" height="1.5rem" />,
+        icon: (
+          <LocalIcon
+            icon="edit-square-outline-rounded"
+            width="1.5rem"
+            height="1.5rem"
+          />
+        ),
         name: t("home.pdfTextEditor.title", "PDF Text Editor"),
         component: PdfTextEditor,
         description: t(
           "home.pdfTextEditor.desc",
-          "Review and edit text and images in PDFs with grouped text editing and PDF regeneration"
+          "Review and edit text and images in PDFs with grouped text editing and PDF regeneration",
         ),
         categoryId: ToolCategoryId.RECOMMENDED_TOOLS,
         subcategoryId: SubcategoryId.GENERAL,
@@ -176,38 +180,65 @@ export function useTranslatedToolCatalog(): TranslatedToolCatalog {
         versionStatus: "alpha",
       },
       multiTool: {
-        icon: <LocalIcon icon="dashboard-customize-rounded" width="1.5rem" height="1.5rem" />,
+        icon: (
+          <LocalIcon
+            icon="dashboard-customize-rounded"
+            width="1.5rem"
+            height="1.5rem"
+          />
+        ),
         name: t("home.multiTool.title", "Multi-Tool"),
         component: null,
         workbench: "pageEditor",
-        description: t("home.multiTool.desc", "Use multiple tools on a single PDF document"),
+        description: t(
+          "home.multiTool.desc",
+          "Use multiple tools on a single PDF document",
+        ),
         categoryId: ToolCategoryId.RECOMMENDED_TOOLS,
         subcategoryId: SubcategoryId.GENERAL,
         maxFiles: -1,
         endpoints: ["multi-tool"],
         synonyms: getSynonyms(t, "multiTool"),
         supportsAutomate: false,
-        automationSettings: null
+        automationSettings: null,
       },
       merge: {
-        icon: <LocalIcon icon="library-add-rounded" width="1.5rem" height="1.5rem" />,
+        icon: (
+          <LocalIcon
+            icon="library-add-rounded"
+            width="1.5rem"
+            height="1.5rem"
+          />
+        ),
         name: t("home.merge.title", "Merge"),
         component: Merge,
-        description: t("home.merge.desc", "Merge multiple PDFs into a single document"),
+        description: t(
+          "home.merge.desc",
+          "Merge multiple PDFs into a single document",
+        ),
         categoryId: ToolCategoryId.RECOMMENDED_TOOLS,
         subcategoryId: SubcategoryId.GENERAL,
         maxFiles: -1,
         endpoints: ["merge-pdfs"],
         operationConfig: mergeOperationConfig,
         automationSettings: MergeSettings,
-        synonyms: getSynonyms(t, "merge")
+        synonyms: getSynonyms(t, "merge"),
       },
       // Signing
       certSign: {
-        icon: <LocalIcon icon="workspace-premium-rounded" width="1.5rem" height="1.5rem" />,
+        icon: (
+          <LocalIcon
+            icon="workspace-premium-rounded"
+            width="1.5rem"
+            height="1.5rem"
+          />
+        ),
         name: t("home.certSign.title", "Certificate Sign"),
         component: CertSign,
-        description: t("home.certSign.desc", "Sign PDF documents using digital certificates"),
+        description: t(
+          "home.certSign.desc",
+          "Sign PDF documents using digital certificates",
+        ),
         categoryId: ToolCategoryId.STANDARD_TOOLS,
         subcategoryId: SubcategoryId.SIGNING,
         synonyms: getSynonyms(t, "certSign"),
@@ -217,10 +248,15 @@ export function useTranslatedToolCatalog(): TranslatedToolCatalog {
         automationSettings: CertSignAutomationSettings,
       },
       timestampPdf: {
-        icon: <LocalIcon icon="schedule-rounded" width="1.5rem" height="1.5rem" />,
+        icon: (
+          <LocalIcon icon="schedule-rounded" width="1.5rem" height="1.5rem" />
+        ),
         name: t("home.timestampPdf.title", "Timestamp PDF"),
         component: TimestampPdf,
-        description: t("home.timestampPdf.desc", "Add an RFC 3161 document timestamp to prove when your PDF existed"),
+        description: t(
+          "home.timestampPdf.desc",
+          "Add an RFC 3161 document timestamp to prove when your PDF existed",
+        ),
         categoryId: ToolCategoryId.STANDARD_TOOLS,
         subcategoryId: SubcategoryId.SIGNING,
         maxFiles: -1,
@@ -230,10 +266,15 @@ export function useTranslatedToolCatalog(): TranslatedToolCatalog {
         synonyms: getSynonyms(t, "timestampPdf"),
       },
       sign: {
-        icon: <LocalIcon icon="signature-rounded" width="1.5rem" height="1.5rem" />,
+        icon: (
+          <LocalIcon icon="signature-rounded" width="1.5rem" height="1.5rem" />
+        ),
         name: t("home.sign.title", "Sign"),
         component: Sign,
-        description: t("home.sign.desc", "Adds signature to PDF by drawing, text or image"),
+        description: t(
+          "home.sign.desc",
+          "Adds signature to PDF by drawing, text or image",
+        ),
         categoryId: ToolCategoryId.STANDARD_TOOLS,
         subcategoryId: SubcategoryId.SIGNING,
         endpoints: ["sign"],
@@ -243,79 +284,110 @@ export function useTranslatedToolCatalog(): TranslatedToolCatalog {
         supportsAutomate: false, //TODO make support Sign
       },
       addText: {
-        icon: <LocalIcon icon="text-fields-rounded" width="1.5rem" height="1.5rem" />,
-        name: t('home.addText.title', 'Add Text'),
+        icon: (
+          <LocalIcon
+            icon="text-fields-rounded"
+            width="1.5rem"
+            height="1.5rem"
+          />
+        ),
+        name: t("home.addText.title", "Add Text"),
         component: AddText,
-        description: t('home.addText.desc', 'Add custom text anywhere in your PDF'),
+        description: t(
+          "home.addText.desc",
+          "Add custom text anywhere in your PDF",
+        ),
         categoryId: ToolCategoryId.STANDARD_TOOLS,
         subcategoryId: SubcategoryId.GENERAL,
         endpoints: ["sign"],
         operationConfig: signOperationConfig,
         automationSettings: null,
-        synonyms: getSynonyms(t, 'addText'),
+        synonyms: getSynonyms(t, "addText"),
         supportsAutomate: false,
       },
       addImage: {
         icon: <LocalIcon icon="image-rounded" width="1.5rem" height="1.5rem" />,
-        name: t('home.addImage.title', 'Add Image'),
+        name: t("home.addImage.title", "Add Image"),
         component: AddImage,
-        description: t('home.addImage.desc', 'Add images anywhere in your PDF'),
+        description: t("home.addImage.desc", "Add images anywhere in your PDF"),
         categoryId: ToolCategoryId.STANDARD_TOOLS,
         subcategoryId: SubcategoryId.GENERAL,
         endpoints: ["add-image"],
         operationConfig: signOperationConfig,
         automationSettings: null,
-        synonyms: getSynonyms(t, 'addImage'),
+        synonyms: getSynonyms(t, "addImage"),
         supportsAutomate: false,
       },
       annotate: {
         icon: <LocalIcon icon="edit" width="1.5rem" height="1.5rem" />,
-        name: t('home.annotate.title', 'Annotate'),
+        name: t("home.annotate.title", "Annotate"),
         component: Annotate,
-        description: t('home.annotate.desc', 'Highlight, draw, add notes, and shapes directly in the viewer'),
+        description: t(
+          "home.annotate.desc",
+          "Highlight, draw, add notes, and shapes directly in the viewer",
+        ),
         categoryId: ToolCategoryId.STANDARD_TOOLS,
         subcategoryId: SubcategoryId.GENERAL,
-        workbench: 'viewer',
+        workbench: "viewer",
         endpoints: ["view-pdf"],
         operationConfig: signOperationConfig,
         automationSettings: null,
-        synonyms: getSynonyms(t, 'annotate'),
+        synonyms: getSynonyms(t, "annotate"),
         supportsAutomate: false,
       },
 
       // Document Security
 
       addPassword: {
-        icon: <LocalIcon icon="password-rounded" width="1.5rem" height="1.5rem" />,
+        icon: (
+          <LocalIcon icon="password-rounded" width="1.5rem" height="1.5rem" />
+        ),
         name: t("home.addPassword.title", "Add Password"),
         component: AddPassword,
-        description: t("home.addPassword.desc", "Add password protection and restrictions to PDF files"),
+        description: t(
+          "home.addPassword.desc",
+          "Add password protection and restrictions to PDF files",
+        ),
         categoryId: ToolCategoryId.STANDARD_TOOLS,
         subcategoryId: SubcategoryId.DOCUMENT_SECURITY,
         maxFiles: -1,
         endpoints: ["add-password"],
         operationConfig: addPasswordOperationConfig,
         automationSettings: AddPasswordSettings,
-        synonyms: getSynonyms(t, "addPassword")
-     },
+        synonyms: getSynonyms(t, "addPassword"),
+      },
       watermark: {
-        icon: <LocalIcon icon="branding-watermark-outline-rounded" width="1.5rem" height="1.5rem" />,
+        icon: (
+          <LocalIcon
+            icon="branding-watermark-outline-rounded"
+            width="1.5rem"
+            height="1.5rem"
+          />
+        ),
         name: t("home.watermark.title", "Add Watermark"),
         component: AddWatermark,
         maxFiles: -1,
-        description: t("home.watermark.desc", "Add a custom watermark to your PDF document."),
+        description: t(
+          "home.watermark.desc",
+          "Add a custom watermark to your PDF document.",
+        ),
         categoryId: ToolCategoryId.STANDARD_TOOLS,
         subcategoryId: SubcategoryId.DOCUMENT_SECURITY,
         endpoints: ["add-watermark"],
         operationConfig: addWatermarkOperationConfig,
         automationSettings: AddWatermarkSingleStepSettings,
-        synonyms: getSynonyms(t, "watermark")
+        synonyms: getSynonyms(t, "watermark"),
       },
       addStamp: {
-        icon: <LocalIcon icon="approval-rounded" width="1.5rem" height="1.5rem" />,
+        icon: (
+          <LocalIcon icon="approval-rounded" width="1.5rem" height="1.5rem" />
+        ),
         name: t("home.addStamp.title", "Add Stamp to PDF"),
         component: AddStamp,
-        description: t("home.addStamp.desc", "Add text or add image stamps at set locations"),
+        description: t(
+          "home.addStamp.desc",
+          "Add text or add image stamps at set locations",
+        ),
         categoryId: ToolCategoryId.STANDARD_TOOLS,
         subcategoryId: SubcategoryId.DOCUMENT_SECURITY,
         synonyms: getSynonyms(t, "addStamp"),
@@ -325,56 +397,92 @@ export function useTranslatedToolCatalog(): TranslatedToolCatalog {
         automationSettings: AddStampAutomationSettings,
       },
       sanitize: {
-        icon: <LocalIcon icon="cleaning-services-outline-rounded" width="1.5rem" height="1.5rem" />,
+        icon: (
+          <LocalIcon
+            icon="cleaning-services-outline-rounded"
+            width="1.5rem"
+            height="1.5rem"
+          />
+        ),
         name: t("home.sanitize.title", "Sanitize"),
         component: Sanitize,
         maxFiles: -1,
         categoryId: ToolCategoryId.STANDARD_TOOLS,
         subcategoryId: SubcategoryId.DOCUMENT_SECURITY,
-        description: t("home.sanitize.desc", "Remove potentially harmful elements from PDF files"),
+        description: t(
+          "home.sanitize.desc",
+          "Remove potentially harmful elements from PDF files",
+        ),
         endpoints: ["sanitize-pdf"],
         operationConfig: sanitizeOperationConfig,
         automationSettings: SanitizeSettings,
-        synonyms: getSynonyms(t, "sanitize")
+        synonyms: getSynonyms(t, "sanitize"),
       },
       flatten: {
-        icon: <LocalIcon icon="layers-clear-rounded" width="1.5rem" height="1.5rem" />,
+        icon: (
+          <LocalIcon
+            icon="layers-clear-rounded"
+            width="1.5rem"
+            height="1.5rem"
+          />
+        ),
         name: t("home.flatten.title", "Flatten"),
         component: Flatten,
-        description: t("home.flatten.desc", "Remove all interactive elements and forms from a PDF"),
+        description: t(
+          "home.flatten.desc",
+          "Remove all interactive elements and forms from a PDF",
+        ),
         categoryId: ToolCategoryId.STANDARD_TOOLS,
         subcategoryId: SubcategoryId.DOCUMENT_SECURITY,
         maxFiles: -1,
         endpoints: ["flatten"],
         operationConfig: flattenOperationConfig,
         automationSettings: FlattenSettings,
-        synonyms: getSynonyms(t, "flatten")
+        synonyms: getSynonyms(t, "flatten"),
       },
       unlockPDFForms: {
-        icon: <LocalIcon icon="preview-off-rounded" width="1.5rem" height="1.5rem" />,
+        icon: (
+          <LocalIcon
+            icon="preview-off-rounded"
+            width="1.5rem"
+            height="1.5rem"
+          />
+        ),
         name: t("home.unlockPDFForms.title", "Unlock PDF Forms"),
         component: UnlockPdfForms,
-        description: t("home.unlockPDFForms.desc", "Remove read-only property of form fields in a PDF document."),
+        description: t(
+          "home.unlockPDFForms.desc",
+          "Remove read-only property of form fields in a PDF document.",
+        ),
         categoryId: ToolCategoryId.STANDARD_TOOLS,
         subcategoryId: SubcategoryId.DOCUMENT_SECURITY,
         maxFiles: -1,
         endpoints: ["unlock-pdf-forms"],
         operationConfig: unlockPdfFormsOperationConfig,
         synonyms: getSynonyms(t, "unlockPDFForms"),
-        automationSettings: null
+        automationSettings: null,
       },
       formFill: {
-        icon: <LocalIcon icon="text-fields-rounded" width="1.5rem" height="1.5rem" />,
-        name: t('home.formFill.title', 'Fill Form'),
+        icon: (
+          <LocalIcon
+            icon="text-fields-rounded"
+            width="1.5rem"
+            height="1.5rem"
+          />
+        ),
+        name: t("home.formFill.title", "Fill Form"),
         component: FormFill,
-        description: t('home.formFill.desc', 'Fill PDF form fields interactively with a visual editor'),
+        description: t(
+          "home.formFill.desc",
+          "Fill PDF form fields interactively with a visual editor",
+        ),
         categoryId: ToolCategoryId.STANDARD_TOOLS,
         subcategoryId: SubcategoryId.GENERAL,
-        workbench: 'viewer' as const,
-        endpoints: ['form-fill'],
+        workbench: "viewer" as const,
+        endpoints: ["form-fill"],
         automationSettings: null,
         supportsAutomate: false,
-        synonyms: ['form', 'fill', 'fillable', 'input', 'field', 'acroform'],
+        synonyms: ["form", "fill", "fillable", "input", "field", "acroform"],
       },
       aiFormFill: {
         icon: <LocalIcon icon="auto-awesome" width="1.5rem" height="1.5rem" />,
@@ -393,7 +501,10 @@ export function useTranslatedToolCatalog(): TranslatedToolCatalog {
         icon: <LocalIcon icon="lock-outline" width="1.5rem" height="1.5rem" />,
         name: t("home.changePermissions.title", "Change Permissions"),
         component: ChangePermissions,
-        description: t("home.changePermissions.desc", "Change document restrictions and permissions"),
+        description: t(
+          "home.changePermissions.desc",
+          "Change document restrictions and permissions",
+        ),
         categoryId: ToolCategoryId.STANDARD_TOOLS,
         subcategoryId: SubcategoryId.DOCUMENT_SECURITY,
         maxFiles: -1,
@@ -403,10 +514,15 @@ export function useTranslatedToolCatalog(): TranslatedToolCatalog {
         synonyms: getSynonyms(t, "changePermissions"),
       },
       getPdfInfo: {
-        icon: <LocalIcon icon="fact-check-rounded" width="1.5rem" height="1.5rem" />,
+        icon: (
+          <LocalIcon icon="fact-check-rounded" width="1.5rem" height="1.5rem" />
+        ),
         name: t("home.getPdfInfo.title", "Get ALL Info on PDF"),
         component: GetPdfInfo,
-        description: t("home.getPdfInfo.desc", "Grabs any and all information possible on PDFs"),
+        description: t(
+          "home.getPdfInfo.desc",
+          "Grabs any and all information possible on PDFs",
+        ),
         categoryId: ToolCategoryId.STANDARD_TOOLS,
         subcategoryId: SubcategoryId.VERIFICATION,
         endpoints: ["get-info-on-pdf"],
@@ -416,48 +532,60 @@ export function useTranslatedToolCatalog(): TranslatedToolCatalog {
         maxFiles: 1,
       },
       validateSignature: {
-        icon: <LocalIcon icon="verified-rounded" width="1.5rem" height="1.5rem" />,
+        icon: (
+          <LocalIcon icon="verified-rounded" width="1.5rem" height="1.5rem" />
+        ),
         name: t("home.validateSignature.title", "Validate PDF Signature"),
         component: ValidateSignature,
-        description: t("home.validateSignature.desc", "Verify digital signatures and certificates in PDF documents"),
+        description: t(
+          "home.validateSignature.desc",
+          "Verify digital signatures and certificates in PDF documents",
+        ),
         categoryId: ToolCategoryId.STANDARD_TOOLS,
         subcategoryId: SubcategoryId.VERIFICATION,
         maxFiles: -1,
         endpoints: ["validate-signature"],
         synonyms: getSynonyms(t, "validateSignature"),
-        automationSettings: null
+        automationSettings: null,
       },
 
       // Document Review
 
       read: {
-        icon: <LocalIcon icon="article-rounded" width="1.5rem" height="1.5rem" />,
+        icon: (
+          <LocalIcon icon="article-rounded" width="1.5rem" height="1.5rem" />
+        ),
         name: t("home.read.title", "Read"),
         component: null,
         workbench: "viewer",
         description: t(
           "home.read.desc",
-          "View and annotate PDFs. Highlight text, draw, or insert comments for review and collaboration."
+          "View and annotate PDFs. Highlight text, draw, or insert comments for review and collaboration.",
         ),
         categoryId: ToolCategoryId.STANDARD_TOOLS,
         subcategoryId: SubcategoryId.DOCUMENT_REVIEW,
         endpoints: ["view-pdf"],
         synonyms: getSynonyms(t, "read"),
         supportsAutomate: false,
-        automationSettings: null
+        automationSettings: null,
       },
       changeMetadata: {
-        icon: <LocalIcon icon="assignment-rounded" width="1.5rem" height="1.5rem" />,
+        icon: (
+          <LocalIcon icon="assignment-rounded" width="1.5rem" height="1.5rem" />
+        ),
         name: t("home.changeMetadata.title", "Change Metadata"),
         component: ChangeMetadata,
-        description: t("home.changeMetadata.desc", "Change/Remove/Add metadata from a PDF document"),
+        description: t(
+          "home.changeMetadata.desc",
+          "Change/Remove/Add metadata from a PDF document",
+        ),
         categoryId: ToolCategoryId.STANDARD_TOOLS,
         subcategoryId: SubcategoryId.DOCUMENT_REVIEW,
         maxFiles: -1,
         endpoints: ["update-metadata"],
         operationConfig: changeMetadataOperationConfig,
         automationSettings: ChangeMetadataSingleStep,
-        synonyms: getSynonyms(t, "changeMetadata")
+        synonyms: getSynonyms(t, "changeMetadata"),
       },
       editTableOfContents: {
         icon: <LocalIcon icon="toc-rounded" width="1.5rem" height="1.5rem" />,
@@ -465,7 +593,7 @@ export function useTranslatedToolCatalog(): TranslatedToolCatalog {
         component: EditTableOfContents,
         description: t(
           "home.editTableOfContents.desc",
-          "Add or edit bookmarks and table of contents in PDF documents"
+          "Add or edit bookmarks and table of contents in PDF documents",
         ),
         categoryId: ToolCategoryId.STANDARD_TOOLS,
         subcategoryId: SubcategoryId.DOCUMENT_REVIEW,
@@ -482,7 +610,10 @@ export function useTranslatedToolCatalog(): TranslatedToolCatalog {
         icon: <LocalIcon icon="crop-rounded" width="1.5rem" height="1.5rem" />,
         name: t("home.crop.title", "Crop PDF"),
         component: Crop,
-        description: t("home.crop.desc", "Crop a PDF to reduce its size (maintains text!)"),
+        description: t(
+          "home.crop.desc",
+          "Crop a PDF to reduce its size (maintains text!)",
+        ),
         categoryId: ToolCategoryId.STANDARD_TOOLS,
         subcategoryId: SubcategoryId.PAGE_FORMATTING,
         maxFiles: -1,
@@ -491,7 +622,13 @@ export function useTranslatedToolCatalog(): TranslatedToolCatalog {
         automationSettings: CropAutomationSettings,
       },
       rotate: {
-        icon: <LocalIcon icon="rotate-right-rounded" width="1.5rem" height="1.5rem" />,
+        icon: (
+          <LocalIcon
+            icon="rotate-right-rounded"
+            width="1.5rem"
+            height="1.5rem"
+          />
+        ),
         name: t("home.rotate.title", "Rotate"),
         component: Rotate,
         description: t("home.rotate.desc", "Easily rotate your PDFs."),
@@ -501,10 +638,16 @@ export function useTranslatedToolCatalog(): TranslatedToolCatalog {
         endpoints: ["rotate-pdf"],
         operationConfig: rotateOperationConfig,
         automationSettings: RotateAutomationSettings,
-        synonyms: getSynonyms(t, "rotate")
+        synonyms: getSynonyms(t, "rotate"),
       },
       split: {
-        icon: <LocalIcon icon="content-cut-rounded" width="1.5rem" height="1.5rem" />,
+        icon: (
+          <LocalIcon
+            icon="content-cut-rounded"
+            width="1.5rem"
+            height="1.5rem"
+          />
+        ),
         name: t("home.split.title", "Split"),
         component: SplitPdfPanel,
         description: t("home.split.desc", "Split PDFs into multiple documents"),
@@ -513,80 +656,107 @@ export function useTranslatedToolCatalog(): TranslatedToolCatalog {
         endpoints: Array.from(new Set(Object.values(SPLIT_ENDPOINT_NAMES))),
         operationConfig: splitOperationConfig,
         automationSettings: SplitAutomationSettings,
-        synonyms: getSynonyms(t, "split")
+        synonyms: getSynonyms(t, "split"),
       },
       reorganizePages: {
-        icon: <LocalIcon icon="move-down-rounded" width="1.5rem" height="1.5rem" />,
+        icon: (
+          <LocalIcon icon="move-down-rounded" width="1.5rem" height="1.5rem" />
+        ),
         name: t("home.reorganizePages.title", "Reorganize Pages"),
         component: ReorganizePages,
         description: t(
           "home.reorganizePages.desc",
-          "Rearrange, duplicate, or delete PDF pages with visual drag-and-drop control."
+          "Rearrange, duplicate, or delete PDF pages with visual drag-and-drop control.",
         ),
         categoryId: ToolCategoryId.STANDARD_TOOLS,
         subcategoryId: SubcategoryId.PAGE_FORMATTING,
         endpoints: ["rearrange-pages"],
         operationConfig: reorganizePagesOperationConfig,
         synonyms: getSynonyms(t, "reorganizePages"),
-        automationSettings: null
-
+        automationSettings: null,
       },
       scalePages: {
-        icon: <LocalIcon icon="crop-free-rounded" width="1.5rem" height="1.5rem" />,
+        icon: (
+          <LocalIcon icon="crop-free-rounded" width="1.5rem" height="1.5rem" />
+        ),
         name: t("home.scalePages.title", "Adjust page size/scale"),
         component: AdjustPageScale,
-        description: t("home.scalePages.desc", "Change the size/scale of a page and/or its contents."),
+        description: t(
+          "home.scalePages.desc",
+          "Change the size/scale of a page and/or its contents.",
+        ),
         categoryId: ToolCategoryId.STANDARD_TOOLS,
         subcategoryId: SubcategoryId.PAGE_FORMATTING,
         maxFiles: -1,
         endpoints: ["scale-pages"],
         operationConfig: adjustPageScaleOperationConfig,
         automationSettings: AdjustPageScaleSettings,
-        synonyms: getSynonyms(t, "scalePages")
+        synonyms: getSynonyms(t, "scalePages"),
       },
       addPageNumbers: {
         icon: <LocalIcon icon="123-rounded" width="1.5rem" height="1.5rem" />,
         name: t("home.addPageNumbers.title", "Add Page Numbers"),
         component: AddPageNumbers,
-        description: t("home.addPageNumbers.desc", "Add Page numbers throughout a document in a set location"),
+        description: t(
+          "home.addPageNumbers.desc",
+          "Add Page numbers throughout a document in a set location",
+        ),
         categoryId: ToolCategoryId.STANDARD_TOOLS,
         subcategoryId: SubcategoryId.PAGE_FORMATTING,
         automationSettings: AddPageNumbersAutomationSettings,
         maxFiles: -1,
         endpoints: ["add-page-numbers"],
         operationConfig: addPageNumbersOperationConfig,
-        synonyms: getSynonyms(t, "addPageNumbers")
+        synonyms: getSynonyms(t, "addPageNumbers"),
       },
       pageLayout: {
-        icon: <LocalIcon icon="dashboard-rounded" width="1.5rem" height="1.5rem" />,
+        icon: (
+          <LocalIcon icon="dashboard-rounded" width="1.5rem" height="1.5rem" />
+        ),
         name: t("home.pageLayout.title", "Multi-Page Layout"),
         component: PageLayout,
-        description: t("home.pageLayout.desc", "Merge multiple pages of a PDF document into a single page"),
+        description: t(
+          "home.pageLayout.desc",
+          "Merge multiple pages of a PDF document into a single page",
+        ),
         categoryId: ToolCategoryId.STANDARD_TOOLS,
         subcategoryId: SubcategoryId.PAGE_FORMATTING,
         maxFiles: -1,
         endpoints: ["multi-page-layout"],
         automationSettings: PageLayoutSettings,
-        synonyms: getSynonyms(t, "pageLayout")
+        synonyms: getSynonyms(t, "pageLayout"),
       },
       bookletImposition: {
-        icon: <LocalIcon icon="menu-book-rounded" width="1.5rem" height="1.5rem" />,
+        icon: (
+          <LocalIcon icon="menu-book-rounded" width="1.5rem" height="1.5rem" />
+        ),
         name: t("home.bookletImposition.title", "Booklet Imposition"),
         component: BookletImposition,
         operationConfig: bookletImpositionOperationConfig,
         automationSettings: BookletImpositionSettings,
-        description: t("home.bookletImposition.desc", "Create booklets with proper page ordering and multi-page layout for printing and binding"),
+        description: t(
+          "home.bookletImposition.desc",
+          "Create booklets with proper page ordering and multi-page layout for printing and binding",
+        ),
         categoryId: ToolCategoryId.STANDARD_TOOLS,
         subcategoryId: SubcategoryId.PAGE_FORMATTING,
         endpoints: ["booklet-imposition"],
       },
       pdfToSinglePage: {
-
-        icon: <LocalIcon icon="looks-one-outline-rounded" width="1.5rem" height="1.5rem" />,
+        icon: (
+          <LocalIcon
+            icon="looks-one-outline-rounded"
+            width="1.5rem"
+            height="1.5rem"
+          />
+        ),
         name: t("home.pdfToSinglePage.title", "PDF to Single Large Page"),
         component: SingleLargePage,
 
-        description: t("home.pdfToSinglePage.desc", "Merges all PDF pages into one large single page"),
+        description: t(
+          "home.pdfToSinglePage.desc",
+          "Merges all PDF pages into one large single page",
+        ),
         categoryId: ToolCategoryId.STANDARD_TOOLS,
         subcategoryId: SubcategoryId.PAGE_FORMATTING,
         maxFiles: -1,
@@ -596,10 +766,15 @@ export function useTranslatedToolCatalog(): TranslatedToolCatalog {
         automationSettings: null,
       },
       addAttachments: {
-        icon: <LocalIcon icon="attachment-rounded" width="1.5rem" height="1.5rem" />,
+        icon: (
+          <LocalIcon icon="attachment-rounded" width="1.5rem" height="1.5rem" />
+        ),
         name: t("home.addAttachments.title", "Add Attachments"),
         component: AddAttachments,
-        description: t("home.addAttachments.desc", "Add or remove embedded files (attachments) to/from a PDF"),
+        description: t(
+          "home.addAttachments.desc",
+          "Add or remove embedded files (attachments) to/from a PDF",
+        ),
         categoryId: ToolCategoryId.STANDARD_TOOLS,
         subcategoryId: SubcategoryId.PAGE_FORMATTING,
         synonyms: getSynonyms(t, "addAttachments"),
@@ -612,10 +787,15 @@ export function useTranslatedToolCatalog(): TranslatedToolCatalog {
       // Extraction
 
       extractPages: {
-        icon: <LocalIcon icon="upload-rounded" width="1.5rem" height="1.5rem" />,
+        icon: (
+          <LocalIcon icon="upload-rounded" width="1.5rem" height="1.5rem" />
+        ),
         name: t("home.extractPages.title", "Extract Pages"),
         component: ExtractPages,
-        description: t("home.extractPages.desc", "Extract specific pages from a PDF document"),
+        description: t(
+          "home.extractPages.desc",
+          "Extract specific pages from a PDF document",
+        ),
         categoryId: ToolCategoryId.STANDARD_TOOLS,
         subcategoryId: SubcategoryId.EXTRACTION,
         synonyms: getSynonyms(t, "extractPages"),
@@ -624,26 +804,44 @@ export function useTranslatedToolCatalog(): TranslatedToolCatalog {
         endpoints: ["rearrange-pages"],
       },
       extractImages: {
-        icon: <LocalIcon icon="photo-library-rounded" width="1.5rem" height="1.5rem" />,
+        icon: (
+          <LocalIcon
+            icon="photo-library-rounded"
+            width="1.5rem"
+            height="1.5rem"
+          />
+        ),
         name: t("home.extractImages.title", "Extract Images"),
         component: ExtractImages,
-        description: t("home.extractImages.desc", "Extract images from PDF documents"),
+        description: t(
+          "home.extractImages.desc",
+          "Extract images from PDF documents",
+        ),
         categoryId: ToolCategoryId.STANDARD_TOOLS,
         subcategoryId: SubcategoryId.EXTRACTION,
         maxFiles: -1,
         endpoints: ["extract-images"],
         operationConfig: extractImagesOperationConfig,
         automationSettings: ExtractImagesSettings,
-        synonyms: getSynonyms(t, "extractImages")
+        synonyms: getSynonyms(t, "extractImages"),
       },
 
       // Removal
 
       removePages: {
-        icon: <LocalIcon icon="delete-outline-rounded" width="1.5rem" height="1.5rem" />,
+        icon: (
+          <LocalIcon
+            icon="delete-outline-rounded"
+            width="1.5rem"
+            height="1.5rem"
+          />
+        ),
         name: t("home.removePages.title", "Remove Pages"),
         component: RemovePages,
-        description: t("home.removePages.desc", "Remove specific pages from a PDF document"),
+        description: t(
+          "home.removePages.desc",
+          "Remove specific pages from a PDF document",
+        ),
         categoryId: ToolCategoryId.STANDARD_TOOLS,
         subcategoryId: SubcategoryId.REMOVAL,
         maxFiles: 1,
@@ -653,10 +851,19 @@ export function useTranslatedToolCatalog(): TranslatedToolCatalog {
         automationSettings: RemovePagesSettings,
       },
       removeBlanks: {
-        icon: <LocalIcon icon="scan-delete-rounded" width="1.5rem" height="1.5rem" />,
+        icon: (
+          <LocalIcon
+            icon="scan-delete-rounded"
+            width="1.5rem"
+            height="1.5rem"
+          />
+        ),
         name: t("home.removeBlanks.title", "Remove Blank Pages"),
         component: RemoveBlanks,
-        description: t("home.removeBlanks.desc", "Remove blank pages from PDF documents"),
+        description: t(
+          "home.removeBlanks.desc",
+          "Remove blank pages from PDF documents",
+        ),
         categoryId: ToolCategoryId.STANDARD_TOOLS,
         subcategoryId: SubcategoryId.REMOVAL,
         maxFiles: 1,
@@ -666,23 +873,41 @@ export function useTranslatedToolCatalog(): TranslatedToolCatalog {
         automationSettings: RemoveBlanksSettings,
       },
       removeAnnotations: {
-        icon: <LocalIcon icon="thread-unread-rounded" width="1.5rem" height="1.5rem" />,
+        icon: (
+          <LocalIcon
+            icon="thread-unread-rounded"
+            width="1.5rem"
+            height="1.5rem"
+          />
+        ),
         name: t("home.removeAnnotations.title", "Remove Annotations"),
         component: RemoveAnnotations,
-        description: t("home.removeAnnotations.desc", "Remove annotations and comments from PDF documents"),
+        description: t(
+          "home.removeAnnotations.desc",
+          "Remove annotations and comments from PDF documents",
+        ),
         categoryId: ToolCategoryId.STANDARD_TOOLS,
         subcategoryId: SubcategoryId.REMOVAL,
         maxFiles: -1,
         endpoints: ["remove-annotations"],
         operationConfig: removeAnnotationsOperationConfig,
         automationSettings: null,
-        synonyms: getSynonyms(t, "removeAnnotations")
+        synonyms: getSynonyms(t, "removeAnnotations"),
       },
       removeImage: {
-        icon: <LocalIcon icon="remove-selection-rounded" width="1.5rem" height="1.5rem" />,
+        icon: (
+          <LocalIcon
+            icon="remove-selection-rounded"
+            width="1.5rem"
+            height="1.5rem"
+          />
+        ),
         name: t("home.removeImage.title", "Remove Images"),
         component: RemoveImage,
-        description: t("home.removeImage.desc", "Remove all images from a PDF document"),
+        description: t(
+          "home.removeImage.desc",
+          "Remove all images from a PDF document",
+        ),
         categoryId: ToolCategoryId.STANDARD_TOOLS,
         subcategoryId: SubcategoryId.REMOVAL,
         maxFiles: -1,
@@ -692,23 +917,41 @@ export function useTranslatedToolCatalog(): TranslatedToolCatalog {
         automationSettings: null,
       },
       removePassword: {
-        icon: <LocalIcon icon="lock-open-right-outline-rounded" width="1.5rem" height="1.5rem" />,
+        icon: (
+          <LocalIcon
+            icon="lock-open-right-outline-rounded"
+            width="1.5rem"
+            height="1.5rem"
+          />
+        ),
         name: t("home.removePassword.title", "Remove Password"),
         component: RemovePassword,
-        description: t("home.removePassword.desc", "Remove password protection from PDF documents"),
+        description: t(
+          "home.removePassword.desc",
+          "Remove password protection from PDF documents",
+        ),
         categoryId: ToolCategoryId.STANDARD_TOOLS,
         subcategoryId: SubcategoryId.REMOVAL,
         endpoints: ["remove-password"],
         maxFiles: -1,
         operationConfig: removePasswordOperationConfig,
         automationSettings: RemovePasswordSettings,
-        synonyms: getSynonyms(t, "removePassword")
+        synonyms: getSynonyms(t, "removePassword"),
       },
       removeCertSign: {
-        icon: <LocalIcon icon="remove-moderator-outline-rounded" width="1.5rem" height="1.5rem" />,
+        icon: (
+          <LocalIcon
+            icon="remove-moderator-outline-rounded"
+            width="1.5rem"
+            height="1.5rem"
+          />
+        ),
         name: t("home.removeCertSign.title", "Remove Certificate Sign"),
         component: RemoveCertificateSign,
-        description: t("home.removeCertSign.desc", "Remove digital signature from PDF documents"),
+        description: t(
+          "home.removeCertSign.desc",
+          "Remove digital signature from PDF documents",
+        ),
         categoryId: ToolCategoryId.STANDARD_TOOLS,
         subcategoryId: SubcategoryId.REMOVAL,
         maxFiles: -1,
@@ -721,12 +964,14 @@ export function useTranslatedToolCatalog(): TranslatedToolCatalog {
       // Automation
 
       automate: {
-        icon: <LocalIcon icon="automation-outline" width="1.5rem" height="1.5rem" />,
+        icon: (
+          <LocalIcon icon="automation-outline" width="1.5rem" height="1.5rem" />
+        ),
         name: t("home.automate.title", "Automate"),
         component: Automate,
         description: t(
           "home.automate.desc",
-          "Build multi-step workflows by chaining together PDF actions. Ideal for recurring tasks."
+          "Build multi-step workflows by chaining together PDF actions. Ideal for recurring tasks.",
         ),
         categoryId: ToolCategoryId.ADVANCED_TOOLS,
         subcategoryId: SubcategoryId.AUTOMATION,
@@ -737,13 +982,18 @@ export function useTranslatedToolCatalog(): TranslatedToolCatalog {
         automationSettings: null,
       },
       autoRename: {
-        icon: <LocalIcon icon="match-word-rounded" width="1.5rem" height="1.5rem" />,
+        icon: (
+          <LocalIcon icon="match-word-rounded" width="1.5rem" height="1.5rem" />
+        ),
         name: t("home.autoRename.title", "Auto Rename PDF File"),
         component: AutoRename,
         maxFiles: -1,
         endpoints: ["auto-rename"],
         operationConfig: autoRenameOperationConfig,
-        description: t("home.autoRename.desc", "Automatically rename PDF files based on their content"),
+        description: t(
+          "home.autoRename.desc",
+          "Automatically rename PDF files based on their content",
+        ),
         categoryId: ToolCategoryId.ADVANCED_TOOLS,
         subcategoryId: SubcategoryId.AUTOMATION,
         synonyms: getSynonyms(t, "autoRename"),
@@ -756,7 +1006,10 @@ export function useTranslatedToolCatalog(): TranslatedToolCatalog {
         icon: <LocalIcon icon="palette" width="1.5rem" height="1.5rem" />,
         name: t("home.adjustContrast.title", "Adjust Colors/Contrast"),
         component: AdjustContrast,
-        description: t("home.adjustContrast.desc", "Adjust colors and contrast of PDF documents"),
+        description: t(
+          "home.adjustContrast.desc",
+          "Adjust colors and contrast of PDF documents",
+        ),
         categoryId: ToolCategoryId.ADVANCED_TOOLS,
         subcategoryId: SubcategoryId.ADVANCED_FORMATTING,
         maxFiles: -1,
@@ -766,23 +1019,40 @@ export function useTranslatedToolCatalog(): TranslatedToolCatalog {
         synonyms: getSynonyms(t, "adjustContrast"),
       },
       repair: {
-        icon: <LocalIcon icon="build-outline-rounded" width="1.5rem" height="1.5rem" />,
+        icon: (
+          <LocalIcon
+            icon="build-outline-rounded"
+            width="1.5rem"
+            height="1.5rem"
+          />
+        ),
         name: t("home.repair.title", "Repair"),
         component: Repair,
-        description: t("home.repair.desc", "Repair corrupted or damaged PDF files"),
+        description: t(
+          "home.repair.desc",
+          "Repair corrupted or damaged PDF files",
+        ),
         categoryId: ToolCategoryId.ADVANCED_TOOLS,
         subcategoryId: SubcategoryId.ADVANCED_FORMATTING,
         maxFiles: -1,
         endpoints: ["repair"],
         operationConfig: repairOperationConfig,
         synonyms: getSynonyms(t, "repair"),
-        automationSettings: null
+        automationSettings: null,
       },
       scannerImageSplit: {
-        icon: <LocalIcon icon="scanner-rounded" width="1.5rem" height="1.5rem" />,
-        name: t("home.scannerImageSplit.title", "Detect & Split Scanned Photos"),
+        icon: (
+          <LocalIcon icon="scanner-rounded" width="1.5rem" height="1.5rem" />
+        ),
+        name: t(
+          "home.scannerImageSplit.title",
+          "Detect & Split Scanned Photos",
+        ),
         component: ScannerImageSplit,
-        description: t("home.scannerImageSplit.desc", "Detect and split scanned photos into separate pages"),
+        description: t(
+          "home.scannerImageSplit.desc",
+          "Detect and split scanned photos into separate pages",
+        ),
         categoryId: ToolCategoryId.ADVANCED_TOOLS,
         subcategoryId: SubcategoryId.ADVANCED_FORMATTING,
         maxFiles: -1,
@@ -792,22 +1062,36 @@ export function useTranslatedToolCatalog(): TranslatedToolCatalog {
         synonyms: getSynonyms(t, "ScannerImageSplit"),
       },
       overlayPdfs: {
-        icon: <LocalIcon icon="layers-rounded" width="1.5rem" height="1.5rem" />,
+        icon: (
+          <LocalIcon icon="layers-rounded" width="1.5rem" height="1.5rem" />
+        ),
         name: t("home.overlay-pdfs.title", "Overlay PDFs"),
         component: OverlayPdfs,
-        description: t("home.overlay-pdfs.desc", "Overlay one PDF on top of another"),
+        description: t(
+          "home.overlay-pdfs.desc",
+          "Overlay one PDF on top of another",
+        ),
         categoryId: ToolCategoryId.ADVANCED_TOOLS,
         subcategoryId: SubcategoryId.ADVANCED_FORMATTING,
         endpoints: ["overlay-pdf"],
         operationConfig: overlayPdfsOperationConfig,
         synonyms: getSynonyms(t, "overlay-pdfs"),
-        automationSettings: OverlayPdfsSettings
+        automationSettings: OverlayPdfsSettings,
       },
       replaceColor: {
-        icon: <LocalIcon icon="format-color-fill-rounded" width="1.5rem" height="1.5rem" />,
+        icon: (
+          <LocalIcon
+            icon="format-color-fill-rounded"
+            width="1.5rem"
+            height="1.5rem"
+          />
+        ),
         name: t("home.replaceColor.title", "Replace & Invert Color"),
         component: ReplaceColor,
-        description: t("home.replaceColor.desc", "Replace or invert colors in PDF documents"),
+        description: t(
+          "home.replaceColor.desc",
+          "Replace or invert colors in PDF documents",
+        ),
         categoryId: ToolCategoryId.ADVANCED_TOOLS,
         subcategoryId: SubcategoryId.ADVANCED_FORMATTING,
         maxFiles: -1,
@@ -817,34 +1101,51 @@ export function useTranslatedToolCatalog(): TranslatedToolCatalog {
         synonyms: getSynonyms(t, "replaceColor"),
       },
       scannerEffect: {
-        icon: <LocalIcon icon="scanner-rounded" width="1.5rem" height="1.5rem" />,
+        icon: (
+          <LocalIcon icon="scanner-rounded" width="1.5rem" height="1.5rem" />
+        ),
         name: t("home.scannerEffect.title", "Scanner Effect"),
         component: null,
-        description: t("home.scannerEffect.desc", "Create a PDF that looks like it was scanned"),
+        description: t(
+          "home.scannerEffect.desc",
+          "Create a PDF that looks like it was scanned",
+        ),
         categoryId: ToolCategoryId.ADVANCED_TOOLS,
         subcategoryId: SubcategoryId.ADVANCED_FORMATTING,
         endpoints: ["scanner-effect"],
         synonyms: getSynonyms(t, "scannerEffect"),
-        automationSettings: null
+        automationSettings: null,
       },
 
       // Developer Tools
 
       showJS: {
-        icon: <LocalIcon icon="javascript-rounded" width="1.5rem" height="1.5rem" />,
+        icon: (
+          <LocalIcon icon="javascript-rounded" width="1.5rem" height="1.5rem" />
+        ),
         name: t("home.showJS.title", "Show JavaScript"),
         component: ShowJS,
-        description: t("home.showJS.desc", "Extract and display JavaScript code from PDF documents"),
+        description: t(
+          "home.showJS.desc",
+          "Extract and display JavaScript code from PDF documents",
+        ),
         categoryId: ToolCategoryId.ADVANCED_TOOLS,
         subcategoryId: SubcategoryId.DEVELOPER_TOOLS,
         maxFiles: 1,
         endpoints: ["show-javascript"],
         synonyms: getSynonyms(t, "showJS"),
         supportsAutomate: false,
-        automationSettings: null
+        automationSettings: null,
       },
       devApi: {
-        icon: <LocalIcon icon="open-in-new-rounded" width="1.5rem" height="1.5rem" style={{ color: "#2F7BF6" }} />,
+        icon: (
+          <LocalIcon
+            icon="open-in-new-rounded"
+            width="1.5rem"
+            height="1.5rem"
+            style={{ color: "#2F7BF6" }}
+          />
+        ),
         name: t("home.devApi.title", "API"),
         component: null,
         description: t("home.devApi.desc", "Link to API documentation"),
@@ -854,23 +1155,40 @@ export function useTranslatedToolCatalog(): TranslatedToolCatalog {
         endpoints: ["dev-api-docs"],
         synonyms: getSynonyms(t, "devApi"),
         supportsAutomate: false,
-        automationSettings: null
+        automationSettings: null,
       },
       devFolderScanning: {
-        icon: <LocalIcon icon="open-in-new-rounded" width="1.5rem" height="1.5rem" style={{ color: "#2F7BF6" }} />,
+        icon: (
+          <LocalIcon
+            icon="open-in-new-rounded"
+            width="1.5rem"
+            height="1.5rem"
+            style={{ color: "#2F7BF6" }}
+          />
+        ),
         name: t("home.devFolderScanning.title", "Automated Folder Scanning"),
         component: null,
-        description: t("home.devFolderScanning.desc", "Link to automated folder scanning guide"),
+        description: t(
+          "home.devFolderScanning.desc",
+          "Link to automated folder scanning guide",
+        ),
         categoryId: ToolCategoryId.ADVANCED_TOOLS,
         subcategoryId: SubcategoryId.DEVELOPER_TOOLS,
         link: "https://docs.stirlingpdf.com/Configuration/Folder%20Scanning/",
         endpoints: ["dev-folder-scanning-docs"],
         synonyms: getSynonyms(t, "devFolderScanning"),
         supportsAutomate: false,
-        automationSettings: null
+        automationSettings: null,
       },
       devSsoGuide: {
-        icon: <LocalIcon icon="open-in-new-rounded" width="1.5rem" height="1.5rem" style={{ color: "#2F7BF6" }} />,
+        icon: (
+          <LocalIcon
+            icon="open-in-new-rounded"
+            width="1.5rem"
+            height="1.5rem"
+            style={{ color: "#2F7BF6" }}
+          />
+        ),
         name: t("home.devSsoGuide.title", "SSO Guide"),
         component: null,
         description: t("home.devSsoGuide.desc", "Link to SSO guide"),
@@ -880,28 +1198,43 @@ export function useTranslatedToolCatalog(): TranslatedToolCatalog {
         endpoints: ["dev-sso-guide-docs"],
         synonyms: getSynonyms(t, "devSsoGuide"),
         supportsAutomate: false,
-        automationSettings: null
+        automationSettings: null,
       },
       devAirgapped: {
-        icon: <LocalIcon icon="open-in-new-rounded" width="1.5rem" height="1.5rem" style={{ color: "#2F7BF6" }} />,
+        icon: (
+          <LocalIcon
+            icon="open-in-new-rounded"
+            width="1.5rem"
+            height="1.5rem"
+            style={{ color: "#2F7BF6" }}
+          />
+        ),
         name: t("home.devAirgapped.title", "Air-gapped Setup"),
         component: null,
-        description: t("home.devAirgapped.desc", "Link to air-gapped setup guide"),
+        description: t(
+          "home.devAirgapped.desc",
+          "Link to air-gapped setup guide",
+        ),
         categoryId: ToolCategoryId.ADVANCED_TOOLS,
         subcategoryId: SubcategoryId.DEVELOPER_TOOLS,
         link: "https://docs.stirlingpdf.com/Paid-Offerings/#activating-your-license",
         endpoints: ["dev-airgapped-docs"],
         synonyms: getSynonyms(t, "devAirgapped"),
         supportsAutomate: false,
-        automationSettings: null
+        automationSettings: null,
       },
 
       // Recommended Tools
       compare: {
-        icon: <LocalIcon icon="compare-rounded" width="1.5rem" height="1.5rem" />,
+        icon: (
+          <LocalIcon icon="compare-rounded" width="1.5rem" height="1.5rem" />
+        ),
         name: t("home.compare.title", "Compare"),
         component: Compare,
-        description: t("home.compare.desc", "Compare two PDF documents and highlight differences"),
+        description: t(
+          "home.compare.desc",
+          "Compare two PDF documents and highlight differences",
+        ),
         categoryId: ToolCategoryId.RECOMMENDED_TOOLS,
         subcategoryId: SubcategoryId.GENERAL,
         maxFiles: 2,
@@ -909,26 +1242,40 @@ export function useTranslatedToolCatalog(): TranslatedToolCatalog {
         operationConfig: undefined,
         automationSettings: null,
         synonyms: getSynonyms(t, "compare"),
-        supportsAutomate: false
+        supportsAutomate: false,
       },
       compress: {
-        icon: <LocalIcon icon="zoom-in-map-rounded" width="1.5rem" height="1.5rem" />,
+        icon: (
+          <LocalIcon
+            icon="zoom-in-map-rounded"
+            width="1.5rem"
+            height="1.5rem"
+          />
+        ),
         name: t("home.compress.title", "Compress"),
         component: CompressPdfPanel,
-        description: t("home.compress.desc", "Compress PDFs to reduce their file size."),
+        description: t(
+          "home.compress.desc",
+          "Compress PDFs to reduce their file size.",
+        ),
         categoryId: ToolCategoryId.RECOMMENDED_TOOLS,
         subcategoryId: SubcategoryId.GENERAL,
         maxFiles: -1,
         endpoints: ["compress-pdf"],
         operationConfig: compressOperationConfig,
         automationSettings: CompressSettings,
-        synonyms: getSynonyms(t, "compress")
+        synonyms: getSynonyms(t, "compress"),
       },
       convert: {
-        icon: <LocalIcon icon="sync-alt-rounded" width="1.5rem" height="1.5rem" />,
+        icon: (
+          <LocalIcon icon="sync-alt-rounded" width="1.5rem" height="1.5rem" />
+        ),
         name: t("home.convert.title", "Convert"),
         component: ConvertPanel,
-        description: t("home.convert.desc", "Convert files to and from PDF format"),
+        description: t(
+          "home.convert.desc",
+          "Convert files to and from PDF format",
+        ),
         categoryId: ToolCategoryId.RECOMMENDED_TOOLS,
         subcategoryId: SubcategoryId.GENERAL,
         maxFiles: -1,
@@ -954,34 +1301,52 @@ export function useTranslatedToolCatalog(): TranslatedToolCatalog {
 
         operationConfig: convertOperationConfig,
         automationSettings: ConvertSettings,
-        synonyms: getSynonyms(t, "convert")
+        synonyms: getSynonyms(t, "convert"),
       },
 
       ocr: {
-        icon: <LocalIcon icon="quick-reference-all-outline-rounded" width="1.5rem" height="1.5rem" />,
+        icon: (
+          <LocalIcon
+            icon="quick-reference-all-outline-rounded"
+            width="1.5rem"
+            height="1.5rem"
+          />
+        ),
         name: t("home.ocr.title", "OCR"),
         component: OCRPanel,
-        description: t("home.ocr.desc", "Extract text from scanned PDFs using Optical Character Recognition"),
+        description: t(
+          "home.ocr.desc",
+          "Extract text from scanned PDFs using Optical Character Recognition",
+        ),
         categoryId: ToolCategoryId.RECOMMENDED_TOOLS,
         subcategoryId: SubcategoryId.GENERAL,
         maxFiles: -1,
         endpoints: ["ocr-pdf"],
         operationConfig: ocrOperationConfig,
         automationSettings: OCRSettings,
-        synonyms: getSynonyms(t, "ocr")
+        synonyms: getSynonyms(t, "ocr"),
       },
       redact: {
-        icon: <LocalIcon icon="visibility-off-rounded" width="1.5rem" height="1.5rem" />,
+        icon: (
+          <LocalIcon
+            icon="visibility-off-rounded"
+            width="1.5rem"
+            height="1.5rem"
+          />
+        ),
         name: t("home.redact.title", "Redact"),
         component: Redact,
-        description: t("home.redact.desc", "Permanently remove sensitive information from PDF documents"),
+        description: t(
+          "home.redact.desc",
+          "Permanently remove sensitive information from PDF documents",
+        ),
         categoryId: ToolCategoryId.RECOMMENDED_TOOLS,
         subcategoryId: SubcategoryId.GENERAL,
         maxFiles: -1,
         endpoints: ["auto-redact"],
         operationConfig: redactOperationConfig,
         automationSettings: RedactSingleStepSettings,
-        synonyms: getSynonyms(t, "redact")
+        synonyms: getSynonyms(t, "redact"),
       },
     };
 
diff --git a/frontend/src/core/env.test.ts b/frontend/src/core/env.test.ts
index 794f0551b4..00a8b9a0f8 100644
--- a/frontend/src/core/env.test.ts
+++ b/frontend/src/core/env.test.ts
@@ -1,16 +1,16 @@
-import { readFileSync, readdirSync, statSync } from 'fs';
-import { join, extname } from 'path';
-import { fileURLToPath } from 'url';
-import { describe, it, expect } from 'vitest';
+import { readFileSync, readdirSync, statSync } from "fs";
+import { join, extname } from "path";
+import { fileURLToPath } from "url";
+import { describe, it, expect } from "vitest";
 
 // frontend/ root — this file lives at src/core/env.test.ts
-const frontendRoot = join(fileURLToPath(import.meta.url), '../../..');
+const frontendRoot = join(fileURLToPath(import.meta.url), "../../..");
 
 function parseEnvKeys(content: string): Set<string> {
   const keys = new Set<string>();
-  for (const line of content.split('\n')) {
+  for (const line of content.split("\n")) {
     const trimmed = line.trim();
-    if (trimmed && !trimmed.startsWith('#')) {
+    if (trimmed && !trimmed.startsWith("#")) {
       const match = trimmed.match(/^([A-Z_][A-Z0-9_]*)=/);
       if (match) keys.add(match[1]);
     }
@@ -23,9 +23,13 @@ function collectSourceFiles(dir: string): string[] {
   for (const entry of readdirSync(dir)) {
     const fullPath = join(dir, entry);
     const stat = statSync(fullPath);
-    if (stat.isDirectory() && entry !== 'node_modules' && entry !== 'assets') {
+    if (stat.isDirectory() && entry !== "node_modules" && entry !== "assets") {
       files.push(...collectSourceFiles(fullPath));
-    } else if (stat.isFile() && (extname(entry) === '.ts' || extname(entry) === '.tsx') && !entry.endsWith('.d.ts')) {
+    } else if (
+      stat.isFile() &&
+      (extname(entry) === ".ts" || extname(entry) === ".tsx") &&
+      !entry.endsWith(".d.ts")
+    ) {
       files.push(fullPath);
     }
   }
@@ -35,7 +39,7 @@ function collectSourceFiles(dir: string): string[] {
 function findViteEnvVars(srcDir: string): Set<string> {
   const vars = new Set<string>();
   for (const file of collectSourceFiles(srcDir)) {
-    const content = readFileSync(file, 'utf-8');
+    const content = readFileSync(file, "utf-8");
     for (const match of content.matchAll(/import\.meta\.env\.(VITE_\w+)/g)) {
       vars.add(match[1]);
     }
@@ -43,16 +47,32 @@ function findViteEnvVars(srcDir: string): Set<string> {
   return vars;
 }
 
-describe('env vars', () => {
-  it('every VITE_ var used in source is present in an example env file', () => {
-    const baseEnv = readFileSync(join(frontendRoot, 'config/.env.example'), 'utf-8');
-    const desktopEnv = readFileSync(join(frontendRoot, 'config/.env.desktop.example'), 'utf-8');
-    const saasEnv = readFileSync(join(frontendRoot, 'config/.env.saas.example'), 'utf-8');
+describe("env vars", () => {
+  it("every VITE_ var used in source is present in an example env file", () => {
+    const baseEnv = readFileSync(
+      join(frontendRoot, "config/.env.example"),
+      "utf-8",
+    );
+    const desktopEnv = readFileSync(
+      join(frontendRoot, "config/.env.desktop.example"),
+      "utf-8",
+    );
+    const saasEnv = readFileSync(
+      join(frontendRoot, "config/.env.saas.example"),
+      "utf-8",
+    );
 
-    const exampleKeys = new Set([...parseEnvKeys(baseEnv), ...parseEnvKeys(desktopEnv), ...parseEnvKeys(saasEnv)]);
-    const sourceVars = findViteEnvVars(join(frontendRoot, 'src'));
+    const exampleKeys = new Set([
+      ...parseEnvKeys(baseEnv),
+      ...parseEnvKeys(desktopEnv),
+      ...parseEnvKeys(saasEnv),
+    ]);
+    const sourceVars = findViteEnvVars(join(frontendRoot, "src"));
 
-    const missing = [...sourceVars].filter(v => !exampleKeys.has(v));
-    expect(missing, `Missing from 'frontend/config/.env.example' files: ${missing.join(', ')}`).toHaveLength(0);
+    const missing = [...sourceVars].filter((v) => !exampleKeys.has(v));
+    expect(
+      missing,
+      `Missing from 'frontend/config/.env.example' files: ${missing.join(", ")}`,
+    ).toHaveLength(0);
   });
 });
diff --git a/frontend/src/core/extensions/accountLogout.ts b/frontend/src/core/extensions/accountLogout.ts
index dba0114574..e4eddd7274 100644
--- a/frontend/src/core/extensions/accountLogout.ts
+++ b/frontend/src/core/extensions/accountLogout.ts
@@ -10,10 +10,16 @@ interface AccountLogoutDeps {
  * Proprietary/desktop builds override this file via path resolution.
  */
 export function useAccountLogout() {
-  return async ({ signOut, redirectToLogin }: AccountLogoutDeps): Promise<void> => {
+  return async ({
+    signOut,
+    redirectToLogin,
+  }: AccountLogoutDeps): Promise<void> => {
     try {
-      if (typeof window !== 'undefined') {
-        window.sessionStorage.setItem('stirling_sso_auto_login_logged_out', '1');
+      if (typeof window !== "undefined") {
+        window.sessionStorage.setItem(
+          "stirling_sso_auto_login_logged_out",
+          "1",
+        );
       }
       await signOut();
     } finally {
diff --git a/frontend/src/core/hooks/signing/useSigningSessions.ts b/frontend/src/core/hooks/signing/useSigningSessions.ts
index 8f049d6a1d..519e43c24a 100644
--- a/frontend/src/core/hooks/signing/useSigningSessions.ts
+++ b/frontend/src/core/hooks/signing/useSigningSessions.ts
@@ -1,8 +1,8 @@
-import { useState, useCallback, useEffect } from 'react';
-import { useTranslation } from 'react-i18next';
-import apiClient from '@app/services/apiClient';
-import { alert } from '@app/components/toast';
-import { SignRequestSummary, SessionSummary } from '@app/types/signingSession';
+import { useState, useCallback, useEffect } from "react";
+import { useTranslation } from "react-i18next";
+import apiClient from "@app/services/apiClient";
+import { alert } from "@app/components/toast";
+import { SignRequestSummary, SessionSummary } from "@app/types/signingSession";
 
 export interface UseSigningSessionsOptions {
   enabled?: boolean;
@@ -22,7 +22,7 @@ export interface UseSigningSessionsResult {
  * Supports auto-refresh for real-time updates.
  */
 export const useSigningSessions = (
-  options: UseSigningSessionsOptions = {}
+  options: UseSigningSessionsOptions = {},
 ): UseSigningSessionsResult => {
   const { enabled = true, autoRefreshInterval = 0 } = options;
   const { t } = useTranslation();
@@ -40,21 +40,24 @@ export const useSigningSessions = (
 
     try {
       const [requestsResponse, sessionsResponse] = await Promise.all([
-        apiClient.get<SignRequestSummary[]>('/api/v1/security/cert-sign/sign-requests'),
-        apiClient.get<SessionSummary[]>('/api/v1/security/cert-sign/sessions'),
+        apiClient.get<SignRequestSummary[]>(
+          "/api/v1/security/cert-sign/sign-requests",
+        ),
+        apiClient.get<SessionSummary[]>("/api/v1/security/cert-sign/sessions"),
       ]);
 
       setSignRequests(requestsResponse.data);
       setMySessions(sessionsResponse.data);
     } catch (err) {
-      const errorObj = err instanceof Error ? err : new Error('Failed to fetch signing data');
+      const errorObj =
+        err instanceof Error ? err : new Error("Failed to fetch signing data");
       setError(errorObj);
-      console.error('Failed to fetch signing data:', err);
+      console.error("Failed to fetch signing data:", err);
 
       alert({
-        alertType: 'warning',
-        title: t('common.error'),
-        body: t('certSign.fetchFailed', 'Failed to load signing data'),
+        alertType: "warning",
+        title: t("common.error"),
+        body: t("certSign.fetchFailed", "Failed to load signing data"),
         expandable: false,
         durationMs: 2500,
       });
diff --git a/frontend/src/core/hooks/signing/useSigningWorkbench.ts b/frontend/src/core/hooks/signing/useSigningWorkbench.ts
index 63a6e8b3bc..64991283ca 100644
--- a/frontend/src/core/hooks/signing/useSigningWorkbench.ts
+++ b/frontend/src/core/hooks/signing/useSigningWorkbench.ts
@@ -1,8 +1,8 @@
-import { useEffect, useMemo } from 'react';
-import { useTranslation } from 'react-i18next';
-import { useToolWorkflow } from '@app/contexts/ToolWorkflowContext';
-import SignRequestWorkbenchView from '@app/components/tools/certSign/SignRequestWorkbenchView';
-import SessionDetailWorkbenchView from '@app/components/tools/certSign/SessionDetailWorkbenchView';
+import { useEffect, useMemo } from "react";
+import { useTranslation } from "react-i18next";
+import { useToolWorkflow } from "@app/contexts/ToolWorkflowContext";
+import SignRequestWorkbenchView from "@app/components/tools/certSign/SignRequestWorkbenchView";
+import SessionDetailWorkbenchView from "@app/components/tools/certSign/SessionDetailWorkbenchView";
 
 export interface WorkbenchRegistration {
   id: string;
@@ -28,30 +28,32 @@ export interface UseSigningWorkbenchResult {
  */
 export const useSigningWorkbench = (): UseSigningWorkbenchResult => {
   const { t } = useTranslation();
-  const {
-    registerCustomWorkbenchView,
-    unregisterCustomWorkbenchView,
-  } = useToolWorkflow();
+  const { registerCustomWorkbenchView, unregisterCustomWorkbenchView } =
+    useToolWorkflow();
 
   // Define workbench IDs as constants
-  const SIGN_REQUEST_WORKBENCH_ID = 'signRequestWorkbench';
-  const SIGN_REQUEST_WORKBENCH_TYPE = 'custom:signRequestWorkbench' as const;
-  const SESSION_DETAIL_WORKBENCH_ID = 'sessionDetailWorkbench';
-  const SESSION_DETAIL_WORKBENCH_TYPE = 'custom:sessionDetailWorkbench' as const;
+  const SIGN_REQUEST_WORKBENCH_ID = "signRequestWorkbench";
+  const SIGN_REQUEST_WORKBENCH_TYPE = "custom:signRequestWorkbench" as const;
+  const SESSION_DETAIL_WORKBENCH_ID = "sessionDetailWorkbench";
+  const SESSION_DETAIL_WORKBENCH_TYPE =
+    "custom:sessionDetailWorkbench" as const;
 
   // Register workbenches on mount
   useEffect(() => {
     registerCustomWorkbenchView({
       id: SIGN_REQUEST_WORKBENCH_ID,
       workbenchId: SIGN_REQUEST_WORKBENCH_TYPE,
-      label: t('certSign.collab.signRequest.workbenchTitle', 'Sign Request'),
+      label: t("certSign.collab.signRequest.workbenchTitle", "Sign Request"),
       component: SignRequestWorkbenchView,
     });
 
     registerCustomWorkbenchView({
       id: SESSION_DETAIL_WORKBENCH_ID,
       workbenchId: SESSION_DETAIL_WORKBENCH_TYPE,
-      label: t('certSign.collab.sessionDetail.workbenchTitle', 'Session Management'),
+      label: t(
+        "certSign.collab.sessionDetail.workbenchTitle",
+        "Session Management",
+      ),
       component: SessionDetailWorkbenchView,
     });
 
@@ -72,6 +74,6 @@ export const useSigningWorkbench = (): UseSigningWorkbenchResult => {
         type: SESSION_DETAIL_WORKBENCH_TYPE,
       },
     }),
-    []
+    [],
   );
 };
diff --git a/frontend/src/core/hooks/tools/addAttachments/useAddAttachmentsOperation.ts b/frontend/src/core/hooks/tools/addAttachments/useAddAttachmentsOperation.ts
index 4614a9cbf7..2b66bbdc34 100644
--- a/frontend/src/core/hooks/tools/addAttachments/useAddAttachmentsOperation.ts
+++ b/frontend/src/core/hooks/tools/addAttachments/useAddAttachmentsOperation.ts
@@ -1,9 +1,16 @@
-import { useTranslation } from 'react-i18next';
-import { useToolOperation, ToolOperationConfig, ToolType } from '@app/hooks/tools/shared/useToolOperation';
-import { createStandardErrorHandler } from '@app/utils/toolErrorHandler';
-import { AddAttachmentsParameters } from '@app/hooks/tools/addAttachments/useAddAttachmentsParameters';
+import { useTranslation } from "react-i18next";
+import {
+  useToolOperation,
+  ToolOperationConfig,
+  ToolType,
+} from "@app/hooks/tools/shared/useToolOperation";
+import { createStandardErrorHandler } from "@app/utils/toolErrorHandler";
+import { AddAttachmentsParameters } from "@app/hooks/tools/addAttachments/useAddAttachmentsParameters";
 
-const buildFormData = (parameters: AddAttachmentsParameters, file: File): FormData => {
+const buildFormData = (
+  parameters: AddAttachmentsParameters,
+  file: File,
+): FormData => {
   const formData = new FormData();
 
   // Add the main PDF file (single file per request in singleFile mode)
@@ -22,18 +29,24 @@ const buildFormData = (parameters: AddAttachmentsParameters, file: File): FormDa
 };
 
 // Operation configuration for automation
-export const addAttachmentsOperationConfig: ToolOperationConfig<AddAttachmentsParameters> = {
-  toolType: ToolType.singleFile,
-  buildFormData,
-  operationType: 'addAttachments',
-  endpoint: '/api/v1/misc/add-attachments',
-};
+export const addAttachmentsOperationConfig: ToolOperationConfig<AddAttachmentsParameters> =
+  {
+    toolType: ToolType.singleFile,
+    buildFormData,
+    operationType: "addAttachments",
+    endpoint: "/api/v1/misc/add-attachments",
+  };
 
 export const useAddAttachmentsOperation = () => {
   const { t } = useTranslation();
 
   return useToolOperation<AddAttachmentsParameters>({
     ...addAttachmentsOperationConfig,
-    getErrorMessage: createStandardErrorHandler(t('addAttachments.error.failed', 'An error occurred while adding attachments to the PDF.'))
+    getErrorMessage: createStandardErrorHandler(
+      t(
+        "addAttachments.error.failed",
+        "An error occurred while adding attachments to the PDF.",
+      ),
+    ),
   });
 };
diff --git a/frontend/src/core/hooks/tools/addAttachments/useAddAttachmentsParameters.ts b/frontend/src/core/hooks/tools/addAttachments/useAddAttachmentsParameters.ts
index 1e66120b7c..cce87c6126 100644
--- a/frontend/src/core/hooks/tools/addAttachments/useAddAttachmentsParameters.ts
+++ b/frontend/src/core/hooks/tools/addAttachments/useAddAttachmentsParameters.ts
@@ -1,4 +1,4 @@
-import { useState } from 'react';
+import { useState } from "react";
 
 export interface AddAttachmentsParameters {
   attachments: File[];
@@ -7,17 +7,18 @@ export interface AddAttachmentsParameters {
 
 const defaultParameters: AddAttachmentsParameters = {
   attachments: [],
-  convertToPdfA3b: false
+  convertToPdfA3b: false,
 };
 
 export const useAddAttachmentsParameters = () => {
-  const [parameters, setParameters] = useState<AddAttachmentsParameters>(defaultParameters);
+  const [parameters, setParameters] =
+    useState<AddAttachmentsParameters>(defaultParameters);
 
   const updateParameter = <K extends keyof AddAttachmentsParameters>(
     key: K,
-    value: AddAttachmentsParameters[K]
+    value: AddAttachmentsParameters[K],
   ) => {
-    setParameters(prev => ({ ...prev, [key]: value }));
+    setParameters((prev) => ({ ...prev, [key]: value }));
   };
 
   const resetParameters = () => {
@@ -32,8 +33,9 @@ export const useAddAttachmentsParameters = () => {
     parameters,
     updateParameter,
     resetParameters,
-    validateParameters
+    validateParameters,
   };
 };
 
-export const DEFAULT_ADD_ATTACHMENTS_PARAMETERS: AddAttachmentsParameters = defaultParameters;
+export const DEFAULT_ADD_ATTACHMENTS_PARAMETERS: AddAttachmentsParameters =
+  defaultParameters;
diff --git a/frontend/src/core/hooks/tools/addPassword/useAddPasswordOperation.test.ts b/frontend/src/core/hooks/tools/addPassword/useAddPasswordOperation.test.ts
index 7a1b1753ea..3045c69450 100644
--- a/frontend/src/core/hooks/tools/addPassword/useAddPasswordOperation.test.ts
+++ b/frontend/src/core/hooks/tools/addPassword/useAddPasswordOperation.test.ts
@@ -1,45 +1,51 @@
-import { describe, expect, test, vi, beforeEach } from 'vitest';
-import { renderHook } from '@testing-library/react';
-import { useAddPasswordOperation } from '@app/hooks/tools/addPassword/useAddPasswordOperation';
-import type { AddPasswordFullParameters } from '@app/hooks/tools/addPassword/useAddPasswordParameters';
+import { describe, expect, test, vi, beforeEach } from "vitest";
+import { renderHook } from "@testing-library/react";
+import { useAddPasswordOperation } from "@app/hooks/tools/addPassword/useAddPasswordOperation";
+import type { AddPasswordFullParameters } from "@app/hooks/tools/addPassword/useAddPasswordParameters";
 
 // Mock the useToolOperation hook
-vi.mock('../shared/useToolOperation', async () => {
-  const actual = await vi.importActual('../shared/useToolOperation');  // Need to keep ToolType etc.
+vi.mock("../shared/useToolOperation", async () => {
+  const actual = await vi.importActual("../shared/useToolOperation"); // Need to keep ToolType etc.
   return {
     ...actual,
-    useToolOperation: vi.fn()
+    useToolOperation: vi.fn(),
   };
 });
 
 // Mock the translation hook
 const mockT = vi.fn((key: string) => `translated-${key}`);
-vi.mock('react-i18next', () => ({
-  useTranslation: () => ({ t: mockT })
+vi.mock("react-i18next", () => ({
+  useTranslation: () => ({ t: mockT }),
 }));
 
 // Mock the error handler
-vi.mock('../../../utils/toolErrorHandler', () => ({
-  createStandardErrorHandler: vi.fn(() => 'error-handler-function')
+vi.mock("../../../utils/toolErrorHandler", () => ({
+  createStandardErrorHandler: vi.fn(() => "error-handler-function"),
 }));
 
 // Import the mocked function
-import { SingleFileToolOperationConfig, ToolOperationHook, ToolType, useToolOperation } from '@app/hooks/tools/shared/useToolOperation';
+import {
+  SingleFileToolOperationConfig,
+  ToolOperationHook,
+  ToolType,
+  useToolOperation,
+} from "@app/hooks/tools/shared/useToolOperation";
 
-
-describe('useAddPasswordOperation', () => {
+describe("useAddPasswordOperation", () => {
   const mockUseToolOperation = vi.mocked(useToolOperation);
 
-  const getToolConfig = () => mockUseToolOperation.mock.calls[0][0] as SingleFileToolOperationConfig<AddPasswordFullParameters>;
+  const getToolConfig = () =>
+    mockUseToolOperation.mock
+      .calls[0][0] as SingleFileToolOperationConfig<AddPasswordFullParameters>;
 
   const mockToolOperationReturn: ToolOperationHook<unknown> = {
     files: [],
     thumbnails: [],
     downloadUrl: null,
-    downloadFilename: '',
+    downloadFilename: "",
     isLoading: false,
     errorMessage: null,
-    status: '',
+    status: "",
     isGeneratingThumbnails: false,
     progress: null,
     executeOperation: vi.fn(),
@@ -56,71 +62,79 @@ describe('useAddPasswordOperation', () => {
 
   test.each([
     {
-      description: 'with all parameters filled',
-      password: 'user-password',
-      ownerPassword: 'owner-password',
-      keyLength: 256
+      description: "with all parameters filled",
+      password: "user-password",
+      ownerPassword: "owner-password",
+      keyLength: 256,
     },
     {
-      description: 'with empty passwords',
-      password: '',
-      ownerPassword: '',
-      keyLength: 128
+      description: "with empty passwords",
+      password: "",
+      ownerPassword: "",
+      keyLength: 128,
     },
     {
-      description: 'with 40-bit key length',
-      password: 'test',
-      ownerPassword: '',
-      keyLength: 40
-    }
-  ])('should create form data correctly $description', ({ password, ownerPassword, keyLength }) => {
-    renderHook(() => useAddPasswordOperation());
+      description: "with 40-bit key length",
+      password: "test",
+      ownerPassword: "",
+      keyLength: 40,
+    },
+  ])(
+    "should create form data correctly $description",
+    ({ password, ownerPassword, keyLength }) => {
+      renderHook(() => useAddPasswordOperation());
 
-    const callArgs = getToolConfig();
-    const buildFormData = callArgs.buildFormData;
+      const callArgs = getToolConfig();
+      const buildFormData = callArgs.buildFormData;
 
-    const testParameters: AddPasswordFullParameters = {
-      password,
-      ownerPassword,
-      keyLength,
-      permissions: {
-        preventAssembly: false,
-        preventExtractContent: false,
-        preventExtractForAccessibility: false,
-        preventFillInForm: false,
-        preventModify: false,
-        preventModifyAnnotations: false,
-        preventPrinting: false,
-        preventPrintingFaithful: false
-      }
-    };
+      const testParameters: AddPasswordFullParameters = {
+        password,
+        ownerPassword,
+        keyLength,
+        permissions: {
+          preventAssembly: false,
+          preventExtractContent: false,
+          preventExtractForAccessibility: false,
+          preventFillInForm: false,
+          preventModify: false,
+          preventModifyAnnotations: false,
+          preventPrinting: false,
+          preventPrintingFaithful: false,
+        },
+      };
 
-    const testFile = new File(['test content'], 'test.pdf', { type: 'application/pdf' });
-    const formData = buildFormData(testParameters, testFile);
+      const testFile = new File(["test content"], "test.pdf", {
+        type: "application/pdf",
+      });
+      const formData = buildFormData(testParameters, testFile);
 
-    // Verify the form data contains the file
-    expect(formData.get('fileInput')).toBe(testFile);
+      // Verify the form data contains the file
+      expect(formData.get("fileInput")).toBe(testFile);
 
-    // Verify password parameters
-    expect(formData.get('password')).toBe(password);
-    expect(formData.get('ownerPassword')).toBe(ownerPassword);
-    expect(formData.get('keyLength')).toBe(keyLength.toString());
-  });
+      // Verify password parameters
+      expect(formData.get("password")).toBe(password);
+      expect(formData.get("ownerPassword")).toBe(ownerPassword);
+      expect(formData.get("keyLength")).toBe(keyLength.toString());
+    },
+  );
 
-  test('should use correct translation for error messages', () => {
+  test("should use correct translation for error messages", () => {
     renderHook(() => useAddPasswordOperation());
 
     expect(mockT).toHaveBeenCalledWith(
-      'addPassword.error.failed',
-      'An error occurred while encrypting the PDF.'
+      "addPassword.error.failed",
+      "An error occurred while encrypting the PDF.",
     );
   });
 
   test.each([
-    { property: 'toolType' as const, expectedValue: ToolType.singleFile },
-    { property: 'endpoint' as const, expectedValue: '/api/v1/security/add-password' },
-    { property: 'operationType' as const, expectedValue: 'addPassword' }
-  ])('should configure $property correctly', ({ property, expectedValue }) => {
+    { property: "toolType" as const, expectedValue: ToolType.singleFile },
+    {
+      property: "endpoint" as const,
+      expectedValue: "/api/v1/security/add-password",
+    },
+    { property: "operationType" as const, expectedValue: "addPassword" },
+  ])("should configure $property correctly", ({ property, expectedValue }) => {
     renderHook(() => useAddPasswordOperation());
 
     const callArgs = getToolConfig();
diff --git a/frontend/src/core/hooks/tools/addPassword/useAddPasswordOperation.ts b/frontend/src/core/hooks/tools/addPassword/useAddPasswordOperation.ts
index 7b8e003f78..c09a740250 100644
--- a/frontend/src/core/hooks/tools/addPassword/useAddPasswordOperation.ts
+++ b/frontend/src/core/hooks/tools/addPassword/useAddPasswordOperation.ts
@@ -1,12 +1,21 @@
-import { useTranslation } from 'react-i18next';
-import { ToolType, useToolOperation } from '@app/hooks/tools/shared/useToolOperation';
-import { createStandardErrorHandler } from '@app/utils/toolErrorHandler';
-import { AddPasswordFullParameters, defaultParameters } from '@app/hooks/tools/addPassword/useAddPasswordParameters';
-import { defaultParameters as permissionsDefaults } from '@app/hooks/tools/changePermissions/useChangePermissionsParameters';
-import { getFormData } from '@app/hooks/tools/changePermissions/useChangePermissionsOperation';
+import { useTranslation } from "react-i18next";
+import {
+  ToolType,
+  useToolOperation,
+} from "@app/hooks/tools/shared/useToolOperation";
+import { createStandardErrorHandler } from "@app/utils/toolErrorHandler";
+import {
+  AddPasswordFullParameters,
+  defaultParameters,
+} from "@app/hooks/tools/addPassword/useAddPasswordParameters";
+import { defaultParameters as permissionsDefaults } from "@app/hooks/tools/changePermissions/useChangePermissionsParameters";
+import { getFormData } from "@app/hooks/tools/changePermissions/useChangePermissionsOperation";
 
 // Static function that can be used by both the hook and automation executor
-export const buildAddPasswordFormData = (parameters: AddPasswordFullParameters, file: File): FormData => {
+export const buildAddPasswordFormData = (
+  parameters: AddPasswordFullParameters,
+  file: File,
+): FormData => {
   const formData = new FormData();
   formData.append("fileInput", file);
   formData.append("password", parameters.password);
@@ -28,8 +37,8 @@ const fullDefaultParameters: AddPasswordFullParameters = {
 export const addPasswordOperationConfig = {
   toolType: ToolType.singleFile,
   buildFormData: buildAddPasswordFormData,
-  operationType: 'addPassword',
-  endpoint: '/api/v1/security/add-password',
+  operationType: "addPassword",
+  endpoint: "/api/v1/security/add-password",
   defaultParameters: fullDefaultParameters,
 } as const;
 
@@ -38,6 +47,11 @@ export const useAddPasswordOperation = () => {
 
   return useToolOperation<AddPasswordFullParameters>({
     ...addPasswordOperationConfig,
-    getErrorMessage: createStandardErrorHandler(t('addPassword.error.failed', 'An error occurred while encrypting the PDF.'))
+    getErrorMessage: createStandardErrorHandler(
+      t(
+        "addPassword.error.failed",
+        "An error occurred while encrypting the PDF.",
+      ),
+    ),
   });
 };
diff --git a/frontend/src/core/hooks/tools/addPassword/useAddPasswordParameters.test.ts b/frontend/src/core/hooks/tools/addPassword/useAddPasswordParameters.test.ts
index 7c09938c57..1ff96f5f15 100644
--- a/frontend/src/core/hooks/tools/addPassword/useAddPasswordParameters.test.ts
+++ b/frontend/src/core/hooks/tools/addPassword/useAddPasswordParameters.test.ts
@@ -1,20 +1,27 @@
-import { describe, expect, test } from 'vitest';
-import { renderHook, act } from '@testing-library/react';
-import { useAddPasswordParameters, defaultParameters, AddPasswordParametersHook } from '@app/hooks/tools/addPassword/useAddPasswordParameters';
-import { defaultParameters as defaultChangePermissionsParameters, ChangePermissionsParameters } from '@app/hooks/tools/changePermissions/useChangePermissionsParameters';
+import { describe, expect, test } from "vitest";
+import { renderHook, act } from "@testing-library/react";
+import {
+  useAddPasswordParameters,
+  defaultParameters,
+  AddPasswordParametersHook,
+} from "@app/hooks/tools/addPassword/useAddPasswordParameters";
+import {
+  defaultParameters as defaultChangePermissionsParameters,
+  ChangePermissionsParameters,
+} from "@app/hooks/tools/changePermissions/useChangePermissionsParameters";
 
-describe('useAddPasswordParameters', () => {
-  test('should initialize with default parameters', () => {
+describe("useAddPasswordParameters", () => {
+  test("should initialize with default parameters", () => {
     const { result } = renderHook(() => useAddPasswordParameters());
 
     expect(result.current.parameters).toStrictEqual(defaultParameters);
   });
 
   test.each([
-    { paramName: 'password' as const, value: 'test-password' },
-    { paramName: 'ownerPassword' as const, value: 'owner-password' },
-    { paramName: 'keyLength' as const, value: 256 }
-  ])('should update parameter $paramName', ({ paramName, value }) => {
+    { paramName: "password" as const, value: "test-password" },
+    { paramName: "ownerPassword" as const, value: "owner-password" },
+    { paramName: "keyLength" as const, value: 256 },
+  ])("should update parameter $paramName", ({ paramName, value }) => {
     const { result } = renderHook(() => useAddPasswordParameters());
 
     act(() => {
@@ -25,29 +32,32 @@ describe('useAddPasswordParameters', () => {
   });
 
   test.each([
-    { paramName: 'preventAssembly' as const },
-    { paramName: 'preventPrinting' as const }
-  ])('should update boolean permission parameter $paramName', ({ paramName }) => {
-    const { result } = renderHook(() => useAddPasswordParameters());
+    { paramName: "preventAssembly" as const },
+    { paramName: "preventPrinting" as const },
+  ])(
+    "should update boolean permission parameter $paramName",
+    ({ paramName }) => {
+      const { result } = renderHook(() => useAddPasswordParameters());
 
-    act(() => {
-      result.current.permissions.updateParameter(paramName, true);
-    });
+      act(() => {
+        result.current.permissions.updateParameter(paramName, true);
+      });
 
-    expect(result.current.permissions.parameters[paramName]).toBe(true);
-  });
+      expect(result.current.permissions.parameters[paramName]).toBe(true);
+    },
+  );
 
-  test('should reset parameters to defaults', () => {
+  test("should reset parameters to defaults", () => {
     const { result } = renderHook(() => useAddPasswordParameters());
 
     // First, change some parameters
     act(() => {
-      result.current.updateParameter('password', 'test');
-      result.current.updateParameter('keyLength', 256);
-      result.current.permissions.updateParameter('preventAssembly', true);
+      result.current.updateParameter("password", "test");
+      result.current.updateParameter("keyLength", 256);
+      result.current.permissions.updateParameter("preventAssembly", true);
     });
 
-    expect(result.current.parameters.password).toBe('test');
+    expect(result.current.parameters.password).toBe("test");
     expect(result.current.parameters.keyLength).toBe(256);
     expect(result.current.permissions.parameters.preventAssembly).toBe(true);
 
@@ -59,59 +69,59 @@ describe('useAddPasswordParameters', () => {
     expect(result.current.parameters).toStrictEqual(defaultParameters);
   });
 
-  test('should return correct endpoint name', () => {
+  test("should return correct endpoint name", () => {
     const { result } = renderHook(() => useAddPasswordParameters());
 
-    expect(result.current.getEndpointName()).toBe('add-password');
+    expect(result.current.getEndpointName()).toBe("add-password");
   });
 
   test.each([
     {
-      description: 'with user password only',
+      description: "with user password only",
       setup: (hook: AddPasswordParametersHook) => {
-        hook.updateParameter('password', 'user-password');
-      }
+        hook.updateParameter("password", "user-password");
+      },
     },
     {
-      description: 'with owner password only',
+      description: "with owner password only",
       setup: (hook: AddPasswordParametersHook) => {
-        hook.updateParameter('ownerPassword', 'owner-password');
-      }
+        hook.updateParameter("ownerPassword", "owner-password");
+      },
     },
     {
-      description: 'with both passwords',
+      description: "with both passwords",
       setup: (hook: AddPasswordParametersHook) => {
-        hook.updateParameter('password', 'user-password');
-        hook.updateParameter('ownerPassword', 'owner-password');
-      }
+        hook.updateParameter("password", "user-password");
+        hook.updateParameter("ownerPassword", "owner-password");
+      },
     },
     {
-      description: 'with whitespace only password',
+      description: "with whitespace only password",
       setup: (hook: AddPasswordParametersHook) => {
-        hook.updateParameter('password', '  \t  ');
-      }
+        hook.updateParameter("password", "  \t  ");
+      },
     },
     {
-      description: 'with whitespace only owner password',
+      description: "with whitespace only owner password",
       setup: (hook: AddPasswordParametersHook) => {
-        hook.updateParameter('ownerPassword', '  \t  ');
-      }
+        hook.updateParameter("ownerPassword", "  \t  ");
+      },
     },
     {
-      description: 'with restrictions only',
+      description: "with restrictions only",
       setup: (hook: AddPasswordParametersHook) => {
-        hook.permissions.updateParameter('preventAssembly', true);
-        hook.permissions.updateParameter('preventPrinting', true);
-      }
+        hook.permissions.updateParameter("preventAssembly", true);
+        hook.permissions.updateParameter("preventPrinting", true);
+      },
     },
     {
-      description: 'with passwords and restrictions',
+      description: "with passwords and restrictions",
       setup: (hook: AddPasswordParametersHook) => {
-        hook.updateParameter('password', 'test-password');
-        hook.permissions.updateParameter('preventAssembly', true);
-      }
-    }
-  ])('should validate parameters correctly $description', ({ setup }) => {
+        hook.updateParameter("password", "test-password");
+        hook.permissions.updateParameter("preventAssembly", true);
+      },
+    },
+  ])("should validate parameters correctly $description", ({ setup }) => {
     const { result } = renderHook(() => useAddPasswordParameters());
 
     // Default state should be valid
@@ -125,7 +135,11 @@ describe('useAddPasswordParameters', () => {
     expect(result.current.validateParameters()).toBe(true);
   });
 
-  test.each(Object.keys(defaultChangePermissionsParameters) as Array<keyof ChangePermissionsParameters>)('should handle boolean restriction parameter %s', (param) => {
+  test.each(
+    Object.keys(defaultChangePermissionsParameters) as Array<
+      keyof ChangePermissionsParameters
+    >,
+  )("should handle boolean restriction parameter %s", (param) => {
     const { result } = renderHook(() => useAddPasswordParameters());
 
     act(() => {
@@ -136,16 +150,16 @@ describe('useAddPasswordParameters', () => {
     expect(result.current.validateParameters()).toBe(true);
   });
 
-  test('should handle mixed parameter types in updateParameter', () => {
+  test("should handle mixed parameter types in updateParameter", () => {
     const { result } = renderHook(() => useAddPasswordParameters());
 
     act(() => {
-      result.current.updateParameter('password', 'test-string');
-      result.current.updateParameter('keyLength', 40);
-      result.current.permissions.updateParameter('preventAssembly', true);
+      result.current.updateParameter("password", "test-string");
+      result.current.updateParameter("keyLength", 40);
+      result.current.permissions.updateParameter("preventAssembly", true);
     });
 
-    expect(result.current.parameters.password).toBe('test-string');
+    expect(result.current.parameters.password).toBe("test-string");
     expect(result.current.parameters.keyLength).toBe(40);
     expect(result.current.permissions.parameters.preventAssembly).toBe(true);
   });
diff --git a/frontend/src/core/hooks/tools/addPassword/useAddPasswordParameters.ts b/frontend/src/core/hooks/tools/addPassword/useAddPasswordParameters.ts
index 9c05e8f015..25e68f7e6a 100644
--- a/frontend/src/core/hooks/tools/addPassword/useAddPasswordParameters.ts
+++ b/frontend/src/core/hooks/tools/addPassword/useAddPasswordParameters.ts
@@ -1,6 +1,13 @@
-import { ChangePermissionsParameters, ChangePermissionsParametersHook, useChangePermissionsParameters } from '@app/hooks/tools/changePermissions/useChangePermissionsParameters';
-import { BaseParameters } from '@app/types/parameters';
-import { useBaseParameters, BaseParametersHook } from '@app/hooks/tools/shared/useBaseParameters';
+import {
+  ChangePermissionsParameters,
+  ChangePermissionsParametersHook,
+  useChangePermissionsParameters,
+} from "@app/hooks/tools/changePermissions/useChangePermissionsParameters";
+import { BaseParameters } from "@app/types/parameters";
+import {
+  useBaseParameters,
+  BaseParametersHook,
+} from "@app/hooks/tools/shared/useBaseParameters";
 
 export interface AddPasswordParameters extends BaseParameters {
   password: string;
@@ -18,8 +25,8 @@ export interface AddPasswordParametersHook extends BaseParametersHook<AddPasswor
 }
 
 export const defaultParameters: AddPasswordParameters = {
-  password: '',
-  ownerPassword: '',
+  password: "",
+  ownerPassword: "",
   keyLength: 128,
 };
 
@@ -28,7 +35,7 @@ export const useAddPasswordParameters = (): AddPasswordParametersHook => {
 
   const baseHook = useBaseParameters({
     defaultParameters,
-    endpointName: 'add-password',
+    endpointName: "add-password",
     validateFn: () => {
       // No required parameters for Add Password. Defer to permissions validation.
       return permissions.validateParameters();
diff --git a/frontend/src/core/hooks/tools/addWatermark/useAddWatermarkOperation.ts b/frontend/src/core/hooks/tools/addWatermark/useAddWatermarkOperation.ts
index a02b95290c..19700f43e7 100644
--- a/frontend/src/core/hooks/tools/addWatermark/useAddWatermarkOperation.ts
+++ b/frontend/src/core/hooks/tools/addWatermark/useAddWatermarkOperation.ts
@@ -1,10 +1,19 @@
-import { useTranslation } from 'react-i18next';
-import { ToolType, useToolOperation } from '@app/hooks/tools/shared/useToolOperation';
-import { createStandardErrorHandler } from '@app/utils/toolErrorHandler';
-import { AddWatermarkParameters, defaultParameters } from '@app/hooks/tools/addWatermark/useAddWatermarkParameters';
+import { useTranslation } from "react-i18next";
+import {
+  ToolType,
+  useToolOperation,
+} from "@app/hooks/tools/shared/useToolOperation";
+import { createStandardErrorHandler } from "@app/utils/toolErrorHandler";
+import {
+  AddWatermarkParameters,
+  defaultParameters,
+} from "@app/hooks/tools/addWatermark/useAddWatermarkParameters";
 
 // Static function that can be used by both the hook and automation executor
-export const buildAddWatermarkFormData = (parameters: AddWatermarkParameters, file: File): FormData => {
+export const buildAddWatermarkFormData = (
+  parameters: AddWatermarkParameters,
+  file: File,
+): FormData => {
   const formData = new FormData();
   formData.append("fileInput", file);
 
@@ -12,9 +21,12 @@ export const buildAddWatermarkFormData = (parameters: AddWatermarkParameters, fi
   formData.append("watermarkType", parameters.watermarkType || "text");
 
   // Add watermark content based on type
-  if (parameters.watermarkType === 'text') {
+  if (parameters.watermarkType === "text") {
     formData.append("watermarkText", parameters.watermarkText);
-  } else if (parameters.watermarkType === 'image' && parameters.watermarkImage) {
+  } else if (
+    parameters.watermarkType === "image" &&
+    parameters.watermarkImage
+  ) {
     formData.append("watermarkImage", parameters.watermarkImage);
   }
 
@@ -28,7 +40,10 @@ export const buildAddWatermarkFormData = (parameters: AddWatermarkParameters, fi
   // Backend-expected parameters from user input
   formData.append("alphabet", parameters.alphabet || "");
   formData.append("customColor", parameters.customColor || "");
-  formData.append("convertPDFToImage", (parameters.convertPDFToImage ?? false).toString());
+  formData.append(
+    "convertPDFToImage",
+    (parameters.convertPDFToImage ?? false).toString(),
+  );
 
   return formData;
 };
@@ -37,8 +52,8 @@ export const buildAddWatermarkFormData = (parameters: AddWatermarkParameters, fi
 export const addWatermarkOperationConfig = {
   toolType: ToolType.singleFile,
   buildFormData: buildAddWatermarkFormData,
-  operationType: 'watermark',
-  endpoint: '/api/v1/security/add-watermark',
+  operationType: "watermark",
+  endpoint: "/api/v1/security/add-watermark",
   defaultParameters,
 } as const;
 
@@ -47,6 +62,11 @@ export const useAddWatermarkOperation = () => {
 
   return useToolOperation<AddWatermarkParameters>({
     ...addWatermarkOperationConfig,
-    getErrorMessage: createStandardErrorHandler(t('watermark.error.failed', 'An error occurred while adding watermark to the PDF.'))
+    getErrorMessage: createStandardErrorHandler(
+      t(
+        "watermark.error.failed",
+        "An error occurred while adding watermark to the PDF.",
+      ),
+    ),
   });
 };
diff --git a/frontend/src/core/hooks/tools/addWatermark/useAddWatermarkParameters.ts b/frontend/src/core/hooks/tools/addWatermark/useAddWatermarkParameters.ts
index 53a89abb9b..72f29e840b 100644
--- a/frontend/src/core/hooks/tools/addWatermark/useAddWatermarkParameters.ts
+++ b/frontend/src/core/hooks/tools/addWatermark/useAddWatermarkParameters.ts
@@ -1,8 +1,11 @@
-import { BaseParameters } from '@app/types/parameters';
-import { useBaseParameters, BaseParametersHook } from '@app/hooks/tools/shared/useBaseParameters';
+import { BaseParameters } from "@app/types/parameters";
+import {
+  useBaseParameters,
+  BaseParametersHook,
+} from "@app/hooks/tools/shared/useBaseParameters";
 
 export interface AddWatermarkParameters extends BaseParameters {
-  watermarkType?: 'text' | 'image';
+  watermarkType?: "text" | "image";
   watermarkText: string;
   watermarkImage?: File;
   fontSize: number; // Used for both text size and image size
@@ -17,28 +20,29 @@ export interface AddWatermarkParameters extends BaseParameters {
 
 export const defaultParameters: AddWatermarkParameters = {
   watermarkType: undefined,
-  watermarkText: '',
+  watermarkText: "",
   fontSize: 12,
   rotation: 0,
   opacity: 50,
   widthSpacer: 50,
   heightSpacer: 50,
-  alphabet: 'roman',
-  customColor: '#d3d3d3',
-  convertPDFToImage: false
+  alphabet: "roman",
+  customColor: "#d3d3d3",
+  convertPDFToImage: false,
 };
 
-export type AddWatermarkParametersHook = BaseParametersHook<AddWatermarkParameters>;
+export type AddWatermarkParametersHook =
+  BaseParametersHook<AddWatermarkParameters>;
 
 export const useAddWatermarkParameters = (): AddWatermarkParametersHook => {
   return useBaseParameters({
     defaultParameters: defaultParameters,
-    endpointName: 'add-watermark',
+    endpointName: "add-watermark",
     validateFn: (params): boolean => {
       if (!params.watermarkType) {
         return false;
       }
-      if (params.watermarkType === 'text') {
+      if (params.watermarkType === "text") {
         return params.watermarkText.trim().length > 0;
       } else {
         return params.watermarkImage !== undefined;
@@ -46,4 +50,3 @@ export const useAddWatermarkParameters = (): AddWatermarkParametersHook => {
     },
   });
 };
-
diff --git a/frontend/src/core/hooks/tools/adjustContrast/useAdjustContrastOperation.ts b/frontend/src/core/hooks/tools/adjustContrast/useAdjustContrastOperation.ts
index fe862fb392..4a26de244d 100644
--- a/frontend/src/core/hooks/tools/adjustContrast/useAdjustContrastOperation.ts
+++ b/frontend/src/core/hooks/tools/adjustContrast/useAdjustContrastOperation.ts
@@ -1,139 +1,193 @@
-import { useTranslation } from 'react-i18next';
-import { ToolType, useToolOperation, CustomProcessorResult } from '@app/hooks/tools/shared/useToolOperation';
-import { AdjustContrastParameters, defaultParameters } from '@app/hooks/tools/adjustContrast/useAdjustContrastParameters';
-import { applyAdjustmentsToCanvas } from '@app/components/tools/adjustContrast/utils';
-import { pdfWorkerManager } from '@app/services/pdfWorkerManager';
-import { createFileFromApiResponse } from '@app/utils/fileResponseUtils';
+import { useTranslation } from "react-i18next";
 import {
-  getPdfiumModule,
-  saveRawDocument,
-} from '@app/services/pdfiumService';
-import { copyRgbaToBgraHeap } from '@app/utils/pdfiumBitmapUtils';
+  ToolType,
+  useToolOperation,
+  CustomProcessorResult,
+} from "@app/hooks/tools/shared/useToolOperation";
+import {
+  AdjustContrastParameters,
+  defaultParameters,
+} from "@app/hooks/tools/adjustContrast/useAdjustContrastParameters";
+import { applyAdjustmentsToCanvas } from "@app/components/tools/adjustContrast/utils";
+import { pdfWorkerManager } from "@app/services/pdfWorkerManager";
+import { createFileFromApiResponse } from "@app/utils/fileResponseUtils";
+import { getPdfiumModule, saveRawDocument } from "@app/services/pdfiumService";
+import { copyRgbaToBgraHeap } from "@app/utils/pdfiumBitmapUtils";
 
-async function renderPdfPageToCanvas(pdf: any, pageNumber: number, scale: number): Promise<HTMLCanvasElement> {
+async function renderPdfPageToCanvas(
+  pdf: any,
+  pageNumber: number,
+  scale: number,
+): Promise<HTMLCanvasElement> {
   const page = await pdf.getPage(pageNumber);
   const viewport = page.getViewport({ scale });
-  const canvas = document.createElement('canvas');
+  const canvas = document.createElement("canvas");
   canvas.width = viewport.width;
   canvas.height = viewport.height;
-  const ctx = canvas.getContext('2d');
-  if (!ctx) throw new Error('Canvas 2D context unavailable');
+  const ctx = canvas.getContext("2d");
+  if (!ctx) throw new Error("Canvas 2D context unavailable");
   await page.render({ canvasContext: ctx, viewport }).promise;
   return canvas;
 }
 
 // Render, adjust, and assemble all pages of a single PDF into a new PDF using PDFium
-async function buildAdjustedPdfForFile(file: File, params: AdjustContrastParameters): Promise<File> {
-    const m = await getPdfiumModule();
-    const arrayBuffer = await file.arrayBuffer();
-    const pdf = await pdfWorkerManager.createDocument(arrayBuffer, {});
-    const pageCount = pdf.numPages;
+async function buildAdjustedPdfForFile(
+  file: File,
+  params: AdjustContrastParameters,
+): Promise<File> {
+  const m = await getPdfiumModule();
+  const arrayBuffer = await file.arrayBuffer();
+  const pdf = await pdfWorkerManager.createDocument(arrayBuffer, {});
+  const pageCount = pdf.numPages;
 
-    const docPtr = m.FPDF_CreateNewDocument();
-    if (!docPtr) throw new Error('PDFium: failed to create document');
+  const docPtr = m.FPDF_CreateNewDocument();
+  if (!docPtr) throw new Error("PDFium: failed to create document");
 
-    try {
-      for (let p = 1; p <= pageCount; p++) {
-        const srcCanvas = await renderPdfPageToCanvas(pdf, p, 2);
-        const adjusted = applyAdjustmentsToCanvas(srcCanvas, params);
-        const ctx = adjusted.getContext('2d');
-        if (!ctx) {
-          console.warn(`[adjustContrast] Skipping page ${p}: failed to get canvas context`);
-          continue;
-        }
-
-        const imageData = ctx.getImageData(0, 0, adjusted.width, adjusted.height);
-        const imgWidth = imageData.width;
-        const imgHeight = imageData.height;
-
-        // Since we render at scale 2, the actual PDF page size is half
-        const pdfPageWidth = imgWidth / 2;
-        const pdfPageHeight = imgHeight / 2;
-
-        const pagePtr = m.FPDFPage_New(docPtr, p - 1, pdfPageWidth, pdfPageHeight);
-        if (!pagePtr) {
-          console.warn(`[adjustContrast] Skipping page ${p}: failed to create PDFium page`);
-          continue;
-        }
-
-        let bitmapPtr = 0;
-        try {
-          bitmapPtr = m.FPDFBitmap_Create(imgWidth, imgHeight, 1);
-          if (!bitmapPtr) {
-            console.warn(`[adjustContrast] Skipping page ${p}: failed to create bitmap`);
-            continue;
-          }
-
-          const bufferPtr = m.FPDFBitmap_GetBuffer(bitmapPtr);
-          const stride = m.FPDFBitmap_GetStride(bitmapPtr);
-          copyRgbaToBgraHeap(m, new Uint8Array(imageData.data.buffer), bufferPtr, imgWidth, imgHeight, stride);
-
-          const imageObjPtr = m.FPDFPageObj_NewImageObj(docPtr);
-          if (imageObjPtr) {
-            const setBitmapOk = m.FPDFImageObj_SetBitmap(pagePtr, 0, imageObjPtr, bitmapPtr);
-            if (setBitmapOk) {
-              const matrixPtr = m.pdfium.wasmExports.malloc(6 * 4);
-              try {
-                m.pdfium.setValue(matrixPtr, pdfPageWidth, 'float');
-                m.pdfium.setValue(matrixPtr + 4, 0, 'float');
-                m.pdfium.setValue(matrixPtr + 8, 0, 'float');
-                m.pdfium.setValue(matrixPtr + 12, pdfPageHeight, 'float');
-                m.pdfium.setValue(matrixPtr + 16, 0, 'float');
-                m.pdfium.setValue(matrixPtr + 20, 0, 'float');
-
-                if (m.FPDFPageObj_SetMatrix(imageObjPtr, matrixPtr)) {
-                  m.FPDFPage_InsertObject(pagePtr, imageObjPtr);
-                } else {
-                  m.FPDFPageObj_Destroy(imageObjPtr);
-                }
-              } finally {
-                m.pdfium.wasmExports.free(matrixPtr);
-              }
-            } else {
-              m.FPDFPageObj_Destroy(imageObjPtr);
-            }
-          }
-        } finally {
-          if (bitmapPtr) m.FPDFBitmap_Destroy(bitmapPtr);
-          m.FPDFPage_GenerateContent(pagePtr);
-          m.FPDF_ClosePage(pagePtr);
-        }
+  try {
+    for (let p = 1; p <= pageCount; p++) {
+      const srcCanvas = await renderPdfPageToCanvas(pdf, p, 2);
+      const adjusted = applyAdjustmentsToCanvas(srcCanvas, params);
+      const ctx = adjusted.getContext("2d");
+      if (!ctx) {
+        console.warn(
+          `[adjustContrast] Skipping page ${p}: failed to get canvas context`,
+        );
+        continue;
       }
 
-      const pdfBytes = await saveRawDocument(docPtr);
-      const out = createFileFromApiResponse(pdfBytes, { 'content-type': 'application/pdf' }, file.name);
-      pdfWorkerManager.destroyDocument(pdf);
-      return out;
-    } finally {
-      m.FPDF_CloseDocument(docPtr);
+      const imageData = ctx.getImageData(0, 0, adjusted.width, adjusted.height);
+      const imgWidth = imageData.width;
+      const imgHeight = imageData.height;
+
+      // Since we render at scale 2, the actual PDF page size is half
+      const pdfPageWidth = imgWidth / 2;
+      const pdfPageHeight = imgHeight / 2;
+
+      const pagePtr = m.FPDFPage_New(
+        docPtr,
+        p - 1,
+        pdfPageWidth,
+        pdfPageHeight,
+      );
+      if (!pagePtr) {
+        console.warn(
+          `[adjustContrast] Skipping page ${p}: failed to create PDFium page`,
+        );
+        continue;
+      }
+
+      let bitmapPtr = 0;
+      try {
+        bitmapPtr = m.FPDFBitmap_Create(imgWidth, imgHeight, 1);
+        if (!bitmapPtr) {
+          console.warn(
+            `[adjustContrast] Skipping page ${p}: failed to create bitmap`,
+          );
+          continue;
+        }
+
+        const bufferPtr = m.FPDFBitmap_GetBuffer(bitmapPtr);
+        const stride = m.FPDFBitmap_GetStride(bitmapPtr);
+        copyRgbaToBgraHeap(
+          m,
+          new Uint8Array(imageData.data.buffer),
+          bufferPtr,
+          imgWidth,
+          imgHeight,
+          stride,
+        );
+
+        const imageObjPtr = m.FPDFPageObj_NewImageObj(docPtr);
+        if (imageObjPtr) {
+          const setBitmapOk = m.FPDFImageObj_SetBitmap(
+            pagePtr,
+            0,
+            imageObjPtr,
+            bitmapPtr,
+          );
+          if (setBitmapOk) {
+            const matrixPtr = m.pdfium.wasmExports.malloc(6 * 4);
+            try {
+              m.pdfium.setValue(matrixPtr, pdfPageWidth, "float");
+              m.pdfium.setValue(matrixPtr + 4, 0, "float");
+              m.pdfium.setValue(matrixPtr + 8, 0, "float");
+              m.pdfium.setValue(matrixPtr + 12, pdfPageHeight, "float");
+              m.pdfium.setValue(matrixPtr + 16, 0, "float");
+              m.pdfium.setValue(matrixPtr + 20, 0, "float");
+
+              if (m.FPDFPageObj_SetMatrix(imageObjPtr, matrixPtr)) {
+                m.FPDFPage_InsertObject(pagePtr, imageObjPtr);
+              } else {
+                m.FPDFPageObj_Destroy(imageObjPtr);
+              }
+            } finally {
+              m.pdfium.wasmExports.free(matrixPtr);
+            }
+          } else {
+            m.FPDFPageObj_Destroy(imageObjPtr);
+          }
+        }
+      } finally {
+        if (bitmapPtr) m.FPDFBitmap_Destroy(bitmapPtr);
+        m.FPDFPage_GenerateContent(pagePtr);
+        m.FPDF_ClosePage(pagePtr);
+      }
     }
+
+    const pdfBytes = await saveRawDocument(docPtr);
+    const out = createFileFromApiResponse(
+      pdfBytes,
+      { "content-type": "application/pdf" },
+      file.name,
+    );
+    pdfWorkerManager.destroyDocument(pdf);
+    return out;
+  } finally {
+    m.FPDF_CloseDocument(docPtr);
+  }
 }
 
-async function processPdfClientSide(params: AdjustContrastParameters, files: File[]): Promise<CustomProcessorResult> {
+async function processPdfClientSide(
+  params: AdjustContrastParameters,
+  files: File[],
+): Promise<CustomProcessorResult> {
   let CONCURRENCY_LIMIT = 2;
-  if (typeof navigator !== 'undefined' && typeof navigator.hardwareConcurrency === 'number') {
+  if (
+    typeof navigator !== "undefined" &&
+    typeof navigator.hardwareConcurrency === "number"
+  ) {
     if (navigator.hardwareConcurrency >= 8) CONCURRENCY_LIMIT = 4;
     else if (navigator.hardwareConcurrency >= 4) CONCURRENCY_LIMIT = 3;
   }
   CONCURRENCY_LIMIT = Math.min(CONCURRENCY_LIMIT, files.length);
 
-  const mapWithConcurrency = async <T, R>(items: T[], limit: number, worker: (item: T, index: number) => Promise<R>): Promise<R[]> => {
+  const mapWithConcurrency = async <T, R>(
+    items: T[],
+    limit: number,
+    worker: (item: T, index: number) => Promise<R>,
+  ): Promise<R[]> => {
     const results: R[] = new Array(items.length);
     let nextIndex = 0;
 
-    const workers = new Array(Math.min(limit, items.length)).fill(0).map(async () => {
-      let current = nextIndex++;
-      while (current < items.length) {
-        results[current] = await worker(items[current], current);
-        current = nextIndex++;
-      }
-    });
+    const workers = new Array(Math.min(limit, items.length))
+      .fill(0)
+      .map(async () => {
+        let current = nextIndex++;
+        while (current < items.length) {
+          results[current] = await worker(items[current], current);
+          current = nextIndex++;
+        }
+      });
 
     await Promise.all(workers);
     return results;
   };
 
-  const processedFiles = await mapWithConcurrency(files, CONCURRENCY_LIMIT, (file) => buildAdjustedPdfForFile(file, params));
+  const processedFiles = await mapWithConcurrency(
+    files,
+    CONCURRENCY_LIMIT,
+    (file) => buildAdjustedPdfForFile(file, params),
+  );
 
   return {
     files: processedFiles,
@@ -144,15 +198,17 @@ async function processPdfClientSide(params: AdjustContrastParameters, files: Fil
 export const adjustContrastOperationConfig = {
   toolType: ToolType.custom,
   customProcessor: processPdfClientSide,
-  operationType: 'adjustContrast',
+  operationType: "adjustContrast",
   defaultParameters,
-  settingsComponentPath: 'components/tools/adjustContrast/AdjustContrastSingleStepSettings',
+  settingsComponentPath:
+    "components/tools/adjustContrast/AdjustContrastSingleStepSettings",
 } as const;
 
 export const useAdjustContrastOperation = () => {
   const { t } = useTranslation();
   return useToolOperation<AdjustContrastParameters>({
     ...adjustContrastOperationConfig,
-    getErrorMessage: () => t('adjustContrast.error.failed', 'Failed to adjust colors/contrast')
+    getErrorMessage: () =>
+      t("adjustContrast.error.failed", "Failed to adjust colors/contrast"),
   });
 };
diff --git a/frontend/src/core/hooks/tools/adjustContrast/useAdjustContrastParameters.ts b/frontend/src/core/hooks/tools/adjustContrast/useAdjustContrastParameters.ts
index 9160c0ce74..399d7720f4 100644
--- a/frontend/src/core/hooks/tools/adjustContrast/useAdjustContrastParameters.ts
+++ b/frontend/src/core/hooks/tools/adjustContrast/useAdjustContrastParameters.ts
@@ -1,4 +1,7 @@
-import { useBaseParameters, BaseParametersHook } from '@app/hooks/tools/shared/useBaseParameters';
+import {
+  useBaseParameters,
+  BaseParametersHook,
+} from "@app/hooks/tools/shared/useBaseParameters";
 
 export interface AdjustContrastParameters {
   contrast: number; // 0-200 (%), 100 = neutral
@@ -18,13 +21,12 @@ export const defaultParameters: AdjustContrastParameters = {
   blue: 100,
 };
 
-export type AdjustContrastParametersHook = BaseParametersHook<AdjustContrastParameters>;
+export type AdjustContrastParametersHook =
+  BaseParametersHook<AdjustContrastParameters>;
 
 export const useAdjustContrastParameters = (): AdjustContrastParametersHook => {
   return useBaseParameters<AdjustContrastParameters>({
     defaultParameters,
-    endpointName: '',
+    endpointName: "",
   });
 };
-
-
diff --git a/frontend/src/core/hooks/tools/adjustPageScale/useAdjustPageScaleOperation.ts b/frontend/src/core/hooks/tools/adjustPageScale/useAdjustPageScaleOperation.ts
index bf95b9854f..d19e55ac56 100644
--- a/frontend/src/core/hooks/tools/adjustPageScale/useAdjustPageScaleOperation.ts
+++ b/frontend/src/core/hooks/tools/adjustPageScale/useAdjustPageScaleOperation.ts
@@ -1,9 +1,18 @@
-import { useTranslation } from 'react-i18next';
-import { useToolOperation, ToolType } from '@app/hooks/tools/shared/useToolOperation';
-import { createStandardErrorHandler } from '@app/utils/toolErrorHandler';
-import { AdjustPageScaleParameters, defaultParameters } from '@app/hooks/tools/adjustPageScale/useAdjustPageScaleParameters';
+import { useTranslation } from "react-i18next";
+import {
+  useToolOperation,
+  ToolType,
+} from "@app/hooks/tools/shared/useToolOperation";
+import { createStandardErrorHandler } from "@app/utils/toolErrorHandler";
+import {
+  AdjustPageScaleParameters,
+  defaultParameters,
+} from "@app/hooks/tools/adjustPageScale/useAdjustPageScaleParameters";
 
-export const buildAdjustPageScaleFormData = (parameters: AdjustPageScaleParameters, file: File): FormData => {
+export const buildAdjustPageScaleFormData = (
+  parameters: AdjustPageScaleParameters,
+  file: File,
+): FormData => {
   const formData = new FormData();
   formData.append("fileInput", file);
   formData.append("scaleFactor", parameters.scaleFactor.toString());
@@ -14,8 +23,8 @@ export const buildAdjustPageScaleFormData = (parameters: AdjustPageScaleParamete
 export const adjustPageScaleOperationConfig = {
   toolType: ToolType.singleFile,
   buildFormData: buildAdjustPageScaleFormData,
-  operationType: 'scalePages',
-  endpoint: '/api/v1/general/scale-pages',
+  operationType: "scalePages",
+  endpoint: "/api/v1/general/scale-pages",
   defaultParameters,
 } as const;
 
@@ -24,6 +33,11 @@ export const useAdjustPageScaleOperation = () => {
 
   return useToolOperation<AdjustPageScaleParameters>({
     ...adjustPageScaleOperationConfig,
-    getErrorMessage: createStandardErrorHandler(t('adjustPageScale.error.failed', 'An error occurred while adjusting the page scale.'))
+    getErrorMessage: createStandardErrorHandler(
+      t(
+        "adjustPageScale.error.failed",
+        "An error occurred while adjusting the page scale.",
+      ),
+    ),
   });
 };
diff --git a/frontend/src/core/hooks/tools/adjustPageScale/useAdjustPageScaleParameters.test.ts b/frontend/src/core/hooks/tools/adjustPageScale/useAdjustPageScaleParameters.test.ts
index 6fb9ef71e3..16d4cb781f 100644
--- a/frontend/src/core/hooks/tools/adjustPageScale/useAdjustPageScaleParameters.test.ts
+++ b/frontend/src/core/hooks/tools/adjustPageScale/useAdjustPageScaleParameters.test.ts
@@ -1,9 +1,14 @@
-import { describe, expect, test } from 'vitest';
-import { renderHook, act } from '@testing-library/react';
-import { useAdjustPageScaleParameters, defaultParameters, PageSize, AdjustPageScaleParametersHook } from '@app/hooks/tools/adjustPageScale/useAdjustPageScaleParameters';
+import { describe, expect, test } from "vitest";
+import { renderHook, act } from "@testing-library/react";
+import {
+  useAdjustPageScaleParameters,
+  defaultParameters,
+  PageSize,
+  AdjustPageScaleParametersHook,
+} from "@app/hooks/tools/adjustPageScale/useAdjustPageScaleParameters";
 
-describe('useAdjustPageScaleParameters', () => {
-  test('should initialize with default parameters', () => {
+describe("useAdjustPageScaleParameters", () => {
+  test("should initialize with default parameters", () => {
     const { result } = renderHook(() => useAdjustPageScaleParameters());
 
     expect(result.current.parameters).toStrictEqual(defaultParameters);
@@ -12,13 +17,13 @@ describe('useAdjustPageScaleParameters', () => {
   });
 
   test.each([
-    { paramName: 'scaleFactor' as const, value: 0.5 },
-    { paramName: 'scaleFactor' as const, value: 2.0 },
-    { paramName: 'scaleFactor' as const, value: 10.0 },
-    { paramName: 'pageSize' as const, value: PageSize.A4 },
-    { paramName: 'pageSize' as const, value: PageSize.LETTER },
-    { paramName: 'pageSize' as const, value: PageSize.LEGAL },
-  ])('should update parameter $paramName to $value', ({ paramName, value }) => {
+    { paramName: "scaleFactor" as const, value: 0.5 },
+    { paramName: "scaleFactor" as const, value: 2.0 },
+    { paramName: "scaleFactor" as const, value: 10.0 },
+    { paramName: "pageSize" as const, value: PageSize.A4 },
+    { paramName: "pageSize" as const, value: PageSize.LETTER },
+    { paramName: "pageSize" as const, value: PageSize.LEGAL },
+  ])("should update parameter $paramName to $value", ({ paramName, value }) => {
     const { result } = renderHook(() => useAdjustPageScaleParameters());
 
     act(() => {
@@ -28,13 +33,13 @@ describe('useAdjustPageScaleParameters', () => {
     expect(result.current.parameters[paramName]).toBe(value);
   });
 
-  test('should reset parameters to defaults', () => {
+  test("should reset parameters to defaults", () => {
     const { result } = renderHook(() => useAdjustPageScaleParameters());
 
     // First, change some parameters
     act(() => {
-      result.current.updateParameter('scaleFactor', 2.5);
-      result.current.updateParameter('pageSize', PageSize.A3);
+      result.current.updateParameter("scaleFactor", 2.5);
+      result.current.updateParameter("pageSize", PageSize.A3);
     });
 
     expect(result.current.parameters.scaleFactor).toBe(2.5);
@@ -48,69 +53,72 @@ describe('useAdjustPageScaleParameters', () => {
     expect(result.current.parameters).toStrictEqual(defaultParameters);
   });
 
-  test('should return correct endpoint name', () => {
+  test("should return correct endpoint name", () => {
     const { result } = renderHook(() => useAdjustPageScaleParameters());
 
-    expect(result.current.getEndpointName()).toBe('scale-pages');
+    expect(result.current.getEndpointName()).toBe("scale-pages");
   });
 
   test.each([
     {
-      description: 'with default parameters',
+      description: "with default parameters",
       setup: () => {},
-      expected: true
+      expected: true,
     },
     {
-      description: 'with valid scale factor 0.1',
+      description: "with valid scale factor 0.1",
       setup: (hook: AdjustPageScaleParametersHook) => {
-        hook.updateParameter('scaleFactor', 0.1);
+        hook.updateParameter("scaleFactor", 0.1);
       },
-      expected: true
+      expected: true,
     },
     {
-      description: 'with valid scale factor 10.0',
+      description: "with valid scale factor 10.0",
       setup: (hook: AdjustPageScaleParametersHook) => {
-        hook.updateParameter('scaleFactor', 10.0);
+        hook.updateParameter("scaleFactor", 10.0);
       },
-      expected: true
+      expected: true,
     },
     {
-      description: 'with A4 page size',
+      description: "with A4 page size",
       setup: (hook: AdjustPageScaleParametersHook) => {
-        hook.updateParameter('pageSize', PageSize.A4);
+        hook.updateParameter("pageSize", PageSize.A4);
       },
-      expected: true
+      expected: true,
     },
     {
-      description: 'with invalid scale factor 0',
+      description: "with invalid scale factor 0",
       setup: (hook: AdjustPageScaleParametersHook) => {
-        hook.updateParameter('scaleFactor', 0);
+        hook.updateParameter("scaleFactor", 0);
       },
-      expected: false
+      expected: false,
     },
     {
-      description: 'with negative scale factor',
+      description: "with negative scale factor",
       setup: (hook: AdjustPageScaleParametersHook) => {
-        hook.updateParameter('scaleFactor', -0.5);
+        hook.updateParameter("scaleFactor", -0.5);
       },
-      expected: false
-    }
-  ])('should validate parameters correctly $description', ({ setup, expected }) => {
-    const { result } = renderHook(() => useAdjustPageScaleParameters());
+      expected: false,
+    },
+  ])(
+    "should validate parameters correctly $description",
+    ({ setup, expected }) => {
+      const { result } = renderHook(() => useAdjustPageScaleParameters());
 
-    act(() => {
-      setup(result.current);
-    });
-
-    expect(result.current.validateParameters()).toBe(expected);
-  });
-
-  test('should handle all PageSize enum values', () => {
-    const { result } = renderHook(() => useAdjustPageScaleParameters());
-
-    Object.values(PageSize).forEach(pageSize => {
       act(() => {
-        result.current.updateParameter('pageSize', pageSize);
+        setup(result.current);
+      });
+
+      expect(result.current.validateParameters()).toBe(expected);
+    },
+  );
+
+  test("should handle all PageSize enum values", () => {
+    const { result } = renderHook(() => useAdjustPageScaleParameters());
+
+    Object.values(PageSize).forEach((pageSize) => {
+      act(() => {
+        result.current.updateParameter("pageSize", pageSize);
       });
 
       expect(result.current.parameters.pageSize).toBe(pageSize);
@@ -118,24 +126,24 @@ describe('useAdjustPageScaleParameters', () => {
     });
   });
 
-  test('should handle scale factor edge cases', () => {
+  test("should handle scale factor edge cases", () => {
     const { result } = renderHook(() => useAdjustPageScaleParameters());
 
     // Test very small valid scale factor
     act(() => {
-      result.current.updateParameter('scaleFactor', 0.01);
+      result.current.updateParameter("scaleFactor", 0.01);
     });
     expect(result.current.validateParameters()).toBe(true);
 
     // Test scale factor just above zero
     act(() => {
-      result.current.updateParameter('scaleFactor', 0.001);
+      result.current.updateParameter("scaleFactor", 0.001);
     });
     expect(result.current.validateParameters()).toBe(true);
 
     // Test exactly zero (invalid)
     act(() => {
-      result.current.updateParameter('scaleFactor', 0);
+      result.current.updateParameter("scaleFactor", 0);
     });
     expect(result.current.validateParameters()).toBe(false);
   });
diff --git a/frontend/src/core/hooks/tools/adjustPageScale/useAdjustPageScaleParameters.ts b/frontend/src/core/hooks/tools/adjustPageScale/useAdjustPageScaleParameters.ts
index 07c6dff842..09d9a1cd26 100644
--- a/frontend/src/core/hooks/tools/adjustPageScale/useAdjustPageScaleParameters.ts
+++ b/frontend/src/core/hooks/tools/adjustPageScale/useAdjustPageScaleParameters.ts
@@ -1,17 +1,20 @@
-import { BaseParameters } from '@app/types/parameters';
-import { useBaseParameters, BaseParametersHook } from '@app/hooks/tools/shared/useBaseParameters';
+import { BaseParameters } from "@app/types/parameters";
+import {
+  useBaseParameters,
+  BaseParametersHook,
+} from "@app/hooks/tools/shared/useBaseParameters";
 
 export enum PageSize {
-  KEEP = 'KEEP',
-  A0 = 'A0',
-  A1 = 'A1',
-  A2 = 'A2',
-  A3 = 'A3',
-  A4 = 'A4',
-  A5 = 'A5',
-  A6 = 'A6',
-  LETTER = 'LETTER',
-  LEGAL = 'LEGAL'
+  KEEP = "KEEP",
+  A0 = "A0",
+  A1 = "A1",
+  A2 = "A2",
+  A3 = "A3",
+  A4 = "A4",
+  A5 = "A5",
+  A6 = "A6",
+  LETTER = "LETTER",
+  LEGAL = "LEGAL",
 }
 
 export interface AdjustPageScaleParameters extends BaseParameters {
@@ -24,14 +27,16 @@ export const defaultParameters: AdjustPageScaleParameters = {
   pageSize: PageSize.KEEP,
 };
 
-export type AdjustPageScaleParametersHook = BaseParametersHook<AdjustPageScaleParameters>;
+export type AdjustPageScaleParametersHook =
+  BaseParametersHook<AdjustPageScaleParameters>;
 
-export const useAdjustPageScaleParameters = (): AdjustPageScaleParametersHook => {
-  return useBaseParameters({
-    defaultParameters,
-    endpointName: 'scale-pages',
-    validateFn: (params) => {
-      return params.scaleFactor > 0;
-    },
-  });
-};
+export const useAdjustPageScaleParameters =
+  (): AdjustPageScaleParametersHook => {
+    return useBaseParameters({
+      defaultParameters,
+      endpointName: "scale-pages",
+      validateFn: (params) => {
+        return params.scaleFactor > 0;
+      },
+    });
+  };
diff --git a/frontend/src/core/hooks/tools/autoRename/useAutoRenameOperation.ts b/frontend/src/core/hooks/tools/autoRename/useAutoRenameOperation.ts
index 60c7887ff7..26c900df66 100644
--- a/frontend/src/core/hooks/tools/autoRename/useAutoRenameOperation.ts
+++ b/frontend/src/core/hooks/tools/autoRename/useAutoRenameOperation.ts
@@ -1,16 +1,25 @@
-import { useTranslation } from 'react-i18next';
-import { ToolType, useToolOperation } from '@app/hooks/tools/shared/useToolOperation';
-import { createStandardErrorHandler } from '@app/utils/toolErrorHandler';
-import { AutoRenameParameters, defaultParameters } from '@app/hooks/tools/autoRename/useAutoRenameParameters';
+import { useTranslation } from "react-i18next";
+import {
+  ToolType,
+  useToolOperation,
+} from "@app/hooks/tools/shared/useToolOperation";
+import { createStandardErrorHandler } from "@app/utils/toolErrorHandler";
+import {
+  AutoRenameParameters,
+  defaultParameters,
+} from "@app/hooks/tools/autoRename/useAutoRenameParameters";
 
-export const getFormData = ((parameters: AutoRenameParameters) =>
-  Object.entries(parameters).map(([key, value]) =>
-    [key, value.toString()]
-  ) as string[][]
-);
+export const getFormData = (parameters: AutoRenameParameters) =>
+  Object.entries(parameters).map(([key, value]) => [
+    key,
+    value.toString(),
+  ]) as string[][];
 
 // Static function that can be used by both the hook and automation executor
-export const buildAutoRenameFormData = (parameters: AutoRenameParameters, file: File): FormData => {
+export const buildAutoRenameFormData = (
+  parameters: AutoRenameParameters,
+  file: File,
+): FormData => {
   const formData = new FormData();
   formData.append("fileInput", file);
 
@@ -26,8 +35,8 @@ export const buildAutoRenameFormData = (parameters: AutoRenameParameters, file:
 export const autoRenameOperationConfig = {
   toolType: ToolType.singleFile,
   buildFormData: buildAutoRenameFormData,
-  operationType: 'autoRename',
-  endpoint: '/api/v1/misc/auto-rename',
+  operationType: "autoRename",
+  endpoint: "/api/v1/misc/auto-rename",
   preserveBackendFilename: true, // Use filename from backend response headers
   defaultParameters,
 } as const;
@@ -37,6 +46,11 @@ export const useAutoRenameOperation = () => {
 
   return useToolOperation({
     ...autoRenameOperationConfig,
-    getErrorMessage: createStandardErrorHandler(t('auto-rename.error.failed', 'An error occurred while auto-renaming the PDF.'))
+    getErrorMessage: createStandardErrorHandler(
+      t(
+        "auto-rename.error.failed",
+        "An error occurred while auto-renaming the PDF.",
+      ),
+    ),
   });
 };
diff --git a/frontend/src/core/hooks/tools/autoRename/useAutoRenameParameters.ts b/frontend/src/core/hooks/tools/autoRename/useAutoRenameParameters.ts
index 7e6e149ce3..84558e7c0d 100644
--- a/frontend/src/core/hooks/tools/autoRename/useAutoRenameParameters.ts
+++ b/frontend/src/core/hooks/tools/autoRename/useAutoRenameParameters.ts
@@ -1,5 +1,8 @@
-import { BaseParameters } from '@app/types/parameters';
-import { useBaseParameters, BaseParametersHook } from '@app/hooks/tools/shared/useBaseParameters';
+import { BaseParameters } from "@app/types/parameters";
+import {
+  useBaseParameters,
+  BaseParametersHook,
+} from "@app/hooks/tools/shared/useBaseParameters";
 
 export interface AutoRenameParameters extends BaseParameters {
   useFirstTextAsFallback: boolean;
@@ -14,6 +17,6 @@ export type AutoRenameParametersHook = BaseParametersHook<AutoRenameParameters>;
 export const useAutoRenameParameters = (): AutoRenameParametersHook => {
   return useBaseParameters({
     defaultParameters,
-    endpointName: 'auto-rename',
+    endpointName: "auto-rename",
   });
-};
\ No newline at end of file
+};
diff --git a/frontend/src/core/hooks/tools/automate/useAutomateOperation.ts b/frontend/src/core/hooks/tools/automate/useAutomateOperation.ts
index d885076360..2ef3d33d96 100644
--- a/frontend/src/core/hooks/tools/automate/useAutomateOperation.ts
+++ b/frontend/src/core/hooks/tools/automate/useAutomateOperation.ts
@@ -1,50 +1,63 @@
-import { ToolType, useToolOperation } from '@app/hooks/tools/shared/useToolOperation';
-import { useCallback } from 'react';
-import { executeAutomationSequence } from '@app/utils/automationExecutor';
-import { useToolRegistry } from '@app/contexts/ToolRegistryContext';
-import { AutomateParameters } from '@app/types/automation';
+import {
+  ToolType,
+  useToolOperation,
+} from "@app/hooks/tools/shared/useToolOperation";
+import { useCallback } from "react";
+import { executeAutomationSequence } from "@app/utils/automationExecutor";
+import { useToolRegistry } from "@app/contexts/ToolRegistryContext";
+import { AutomateParameters } from "@app/types/automation";
 
 export function useAutomateOperation() {
   const { allTools } = useToolRegistry();
   const toolRegistry = allTools;
 
-  const customProcessor = useCallback(async (params: AutomateParameters, files: File[]) => {
-    console.log('🚀 Starting automation execution via customProcessor', { params, files });
+  const customProcessor = useCallback(
+    async (params: AutomateParameters, files: File[]) => {
+      console.log("🚀 Starting automation execution via customProcessor", {
+        params,
+        files,
+      });
 
-    if (!params.automationConfig) {
-      throw new Error('No automation configuration provided');
-    }
-
-    // Execute the automation sequence and return the final results
-    const finalResults = await executeAutomationSequence(
-      params.automationConfig!,
-      files,
-      toolRegistry,
-      (stepIndex: number, operationName: string) => {
-        console.log(`Step ${stepIndex + 1} started: ${operationName}`);
-        params.onStepStart?.(stepIndex, operationName);
-      },
-      (stepIndex: number, resultFiles: File[]) => {
-        console.log(`Step ${stepIndex + 1} completed with ${resultFiles.length} files`);
-        params.onStepComplete?.(stepIndex, resultFiles);
-      },
-      (stepIndex: number, error: string) => {
-        console.error(`Step ${stepIndex + 1} failed:`, error);
-        params.onStepError?.(stepIndex, error);
-        throw new Error(`Automation step ${stepIndex + 1} failed: ${error}`);
+      if (!params.automationConfig) {
+        throw new Error("No automation configuration provided");
       }
-    );
 
-    console.log(`✅ Automation completed, returning ${finalResults.length} files`);
-    return {
-      files: finalResults,
-      consumedAllInputs: true,
-    };
-  }, [toolRegistry]);
+      // Execute the automation sequence and return the final results
+      const finalResults = await executeAutomationSequence(
+        params.automationConfig!,
+        files,
+        toolRegistry,
+        (stepIndex: number, operationName: string) => {
+          console.log(`Step ${stepIndex + 1} started: ${operationName}`);
+          params.onStepStart?.(stepIndex, operationName);
+        },
+        (stepIndex: number, resultFiles: File[]) => {
+          console.log(
+            `Step ${stepIndex + 1} completed with ${resultFiles.length} files`,
+          );
+          params.onStepComplete?.(stepIndex, resultFiles);
+        },
+        (stepIndex: number, error: string) => {
+          console.error(`Step ${stepIndex + 1} failed:`, error);
+          params.onStepError?.(stepIndex, error);
+          throw new Error(`Automation step ${stepIndex + 1} failed: ${error}`);
+        },
+      );
+
+      console.log(
+        `✅ Automation completed, returning ${finalResults.length} files`,
+      );
+      return {
+        files: finalResults,
+        consumedAllInputs: true,
+      };
+    },
+    [toolRegistry],
+  );
 
   return useToolOperation<AutomateParameters>({
     toolType: ToolType.custom,
-    operationType: 'automate',
+    operationType: "automate",
     customProcessor,
     consumesAllInputs: true,
   });
diff --git a/frontend/src/core/hooks/tools/automate/useAutomationForm.ts b/frontend/src/core/hooks/tools/automate/useAutomationForm.ts
index 3bcfad53ba..023948c51f 100644
--- a/frontend/src/core/hooks/tools/automate/useAutomationForm.ts
+++ b/frontend/src/core/hooks/tools/automate/useAutomationForm.ts
@@ -1,71 +1,97 @@
-import { useState, useEffect, useCallback } from 'react';
-import { useTranslation } from 'react-i18next';
-import { AutomationTool, AutomationConfig, AutomationMode } from '@app/types/automation';
-import { AUTOMATION_CONSTANTS } from '@app/constants/automation';
-import { ToolRegistry } from '@app/data/toolsTaxonomy';
+import { useState, useEffect, useCallback } from "react";
+import { useTranslation } from "react-i18next";
+import {
+  AutomationTool,
+  AutomationConfig,
+  AutomationMode,
+} from "@app/types/automation";
+import { AUTOMATION_CONSTANTS } from "@app/constants/automation";
+import { ToolRegistry } from "@app/data/toolsTaxonomy";
 import { ToolId } from "@app/types/toolId";
 
-
 interface UseAutomationFormProps {
   mode: AutomationMode;
   existingAutomation?: AutomationConfig;
   toolRegistry: Partial<ToolRegistry>;
 }
 
-export function useAutomationForm({ mode, existingAutomation, toolRegistry }: UseAutomationFormProps) {
+export function useAutomationForm({
+  mode,
+  existingAutomation,
+  toolRegistry,
+}: UseAutomationFormProps) {
   const { t } = useTranslation();
 
-  const [automationName, setAutomationName] = useState('');
-  const [automationDescription, setAutomationDescription] = useState('');
-  const [automationIcon, setAutomationIcon] = useState<string>('');
+  const [automationName, setAutomationName] = useState("");
+  const [automationDescription, setAutomationDescription] = useState("");
+  const [automationIcon, setAutomationIcon] = useState<string>("");
   const [selectedTools, setSelectedTools] = useState<AutomationTool[]>([]);
 
-  const getToolName = useCallback((operation: string) => {
-    const tool = toolRegistry?.[operation as ToolId] as any;
-    return tool?.name || t(`tools.${operation}.name`, operation);
-  }, [toolRegistry, t]);
+  const getToolName = useCallback(
+    (operation: string) => {
+      const tool = toolRegistry?.[operation as ToolId] as any;
+      return tool?.name || t(`tools.${operation}.name`, operation);
+    },
+    [toolRegistry, t],
+  );
 
-  const getToolDefaultParameters = useCallback((operation: string): Record<string, any> => {
-    const config = toolRegistry[operation as ToolId]?.operationConfig;
-    if (config?.defaultParameters) {
-      return { ...config.defaultParameters };
-    }
-    return {};
-  }, [toolRegistry]);
+  const getToolDefaultParameters = useCallback(
+    (operation: string): Record<string, any> => {
+      const config = toolRegistry[operation as ToolId]?.operationConfig;
+      if (config?.defaultParameters) {
+        return { ...config.defaultParameters };
+      }
+      return {};
+    },
+    [toolRegistry],
+  );
 
   // Initialize based on mode and existing automation
   useEffect(() => {
-    if ((mode === AutomationMode.SUGGESTED || mode === AutomationMode.EDIT) && existingAutomation) {
-      setAutomationName(existingAutomation.name || '');
-      setAutomationDescription(existingAutomation.description || '');
-      setAutomationIcon(existingAutomation.icon || '');
+    if (
+      (mode === AutomationMode.SUGGESTED || mode === AutomationMode.EDIT) &&
+      existingAutomation
+    ) {
+      setAutomationName(existingAutomation.name || "");
+      setAutomationDescription(existingAutomation.description || "");
+      setAutomationIcon(existingAutomation.icon || "");
 
       const operations = existingAutomation.operations || [];
       const tools = operations.map((op, index) => {
-        const operation = typeof op === 'string' ? op : op.operation;
+        const operation = typeof op === "string" ? op : op.operation;
         const toolEntry = toolRegistry[operation as ToolId];
         // If tool has no settingsComponent, it's automatically configured
-        const isConfigured = mode === AutomationMode.EDIT ? true : !toolEntry?.automationSettings;
+        const isConfigured =
+          mode === AutomationMode.EDIT ? true : !toolEntry?.automationSettings;
 
         return {
           id: `${operation}-${Date.now()}-${index}`,
           operation: operation,
           name: getToolName(operation),
           configured: isConfigured,
-          parameters: typeof op === 'object' ? { ...getToolDefaultParameters(operation), ...(op.parameters || {}) } : getToolDefaultParameters(operation)
+          parameters:
+            typeof op === "object"
+              ? {
+                  ...getToolDefaultParameters(operation),
+                  ...(op.parameters || {}),
+                }
+              : getToolDefaultParameters(operation),
         };
       });
 
       setSelectedTools(tools);
     } else if (mode === AutomationMode.CREATE && selectedTools.length === 0) {
       // Initialize with default empty tools for new automation
-      const defaultTools = Array.from({ length: AUTOMATION_CONSTANTS.DEFAULT_TOOL_COUNT }, (_, index) => ({
-        id: `tool-${index + 1}-${Date.now()}`,
-        operation: '',
-        name: t('automate.creation.tools.selectTool', 'Select a tool...'),
-        configured: false,
-        parameters: {}
-      }));
+      const defaultTools = Array.from(
+        { length: AUTOMATION_CONSTANTS.DEFAULT_TOOL_COUNT },
+        (_, index) => ({
+          id: `tool-${index + 1}-${Date.now()}`,
+          operation: "",
+          name: t("automate.creation.tools.selectTool", "Select a tool..."),
+          configured: false,
+          parameters: {},
+        }),
+      );
       setSelectedTools(defaultTools);
     }
   }, [mode, existingAutomation, t, getToolName, getToolDefaultParameters]);
@@ -80,7 +106,7 @@ export function useAutomationForm({ mode, existingAutomation, toolRegistry }: Us
       operation,
       name: getToolName(operation),
       configured: isConfigured,
-      parameters: getToolDefaultParameters(operation)
+      parameters: getToolDefaultParameters(operation),
     };
 
     setSelectedTools([...selectedTools, newTool]);
@@ -99,16 +125,16 @@ export function useAutomationForm({ mode, existingAutomation, toolRegistry }: Us
 
   const hasUnsavedChanges = () => {
     return (
-      automationName.trim() !== '' ||
-      selectedTools.some(tool => tool.operation !== '' || tool.configured)
+      automationName.trim() !== "" ||
+      selectedTools.some((tool) => tool.operation !== "" || tool.configured)
     );
   };
 
   const canSaveAutomation = () => {
     return (
-      automationName.trim() !== '' &&
+      automationName.trim() !== "" &&
       selectedTools.length > 0 &&
-      selectedTools.every(tool => tool.configured && tool.operation !== '')
+      selectedTools.every((tool) => tool.configured && tool.operation !== "")
     );
   };
 
@@ -127,6 +153,6 @@ export function useAutomationForm({ mode, existingAutomation, toolRegistry }: Us
     hasUnsavedChanges,
     canSaveAutomation,
     getToolName,
-    getToolDefaultParameters
+    getToolDefaultParameters,
   };
 }
diff --git a/frontend/src/core/hooks/tools/automate/useSavedAutomations.ts b/frontend/src/core/hooks/tools/automate/useSavedAutomations.ts
index a4bba4857a..e6fae8db93 100644
--- a/frontend/src/core/hooks/tools/automate/useSavedAutomations.ts
+++ b/frontend/src/core/hooks/tools/automate/useSavedAutomations.ts
@@ -1,11 +1,13 @@
-import { useState, useEffect, useCallback } from 'react';
-import { AutomationConfig } from '@app/services/automationStorage';
-import { SuggestedAutomation } from '@app/types/automation';
+import { useState, useEffect, useCallback } from "react";
+import { AutomationConfig } from "@app/services/automationStorage";
+import { SuggestedAutomation } from "@app/types/automation";
 
 export interface SavedAutomation extends AutomationConfig {}
 
 export function useSavedAutomations() {
-  const [savedAutomations, setSavedAutomations] = useState<SavedAutomation[]>([]);
+  const [savedAutomations, setSavedAutomations] = useState<SavedAutomation[]>(
+    [],
+  );
   const [loading, setLoading] = useState(true);
   const [error, setError] = useState<Error | null>(null);
 
@@ -13,11 +15,12 @@ export function useSavedAutomations() {
     try {
       setLoading(true);
       setError(null);
-      const { automationStorage } = await import('@app/services/automationStorage');
+      const { automationStorage } =
+        await import("@app/services/automationStorage");
       const automations = await automationStorage.getAllAutomations();
       setSavedAutomations(automations);
     } catch (err) {
-      console.error('Error loading saved automations:', err);
+      console.error("Error loading saved automations:", err);
       setError(err as Error);
       setSavedAutomations([]);
     } finally {
@@ -29,54 +32,62 @@ export function useSavedAutomations() {
     loadSavedAutomations();
   }, [loadSavedAutomations]);
 
-  const deleteAutomation = useCallback(async (id: string) => {
-    try {
-      const { automationStorage } = await import('@app/services/automationStorage');
-      await automationStorage.deleteAutomation(id);
-      // Refresh the list after deletion
-      refreshAutomations();
-    } catch (err) {
-      console.error('Error deleting automation:', err);
-      throw err;
-    }
-  }, [refreshAutomations]);
+  const deleteAutomation = useCallback(
+    async (id: string) => {
+      try {
+        const { automationStorage } =
+          await import("@app/services/automationStorage");
+        await automationStorage.deleteAutomation(id);
+        // Refresh the list after deletion
+        refreshAutomations();
+      } catch (err) {
+        console.error("Error deleting automation:", err);
+        throw err;
+      }
+    },
+    [refreshAutomations],
+  );
 
-  const copyFromSuggested = useCallback(async (suggestedAutomation: SuggestedAutomation) => {
-    try {
-      const { automationStorage } = await import('@app/services/automationStorage');
+  const copyFromSuggested = useCallback(
+    async (suggestedAutomation: SuggestedAutomation) => {
+      try {
+        const { automationStorage } =
+          await import("@app/services/automationStorage");
 
-      // Map suggested automation icons to MUI icon keys
-      const getIconKey = (_suggestedIcon: {id: string}): string => {
-        // Check the automation ID or name to determine the appropriate icon
-        switch (suggestedAutomation.id) {
-          case 'secure-pdf-ingestion':
-          case 'secure-workflow':
-            return 'SecurityIcon'; // Security icon for security workflows
-          case 'email-preparation':
-            return 'CompressIcon'; // Compression icon
-          case 'process-images':
-            return 'StarIcon'; // Star icon for process images
-          default:
-            return 'SettingsIcon'; // Default fallback
-        }
-      };
+        // Map suggested automation icons to MUI icon keys
+        const getIconKey = (_suggestedIcon: { id: string }): string => {
+          // Check the automation ID or name to determine the appropriate icon
+          switch (suggestedAutomation.id) {
+            case "secure-pdf-ingestion":
+            case "secure-workflow":
+              return "SecurityIcon"; // Security icon for security workflows
+            case "email-preparation":
+              return "CompressIcon"; // Compression icon
+            case "process-images":
+              return "StarIcon"; // Star icon for process images
+            default:
+              return "SettingsIcon"; // Default fallback
+          }
+        };
 
-      // Convert suggested automation to saved automation format
-      const savedAutomation = {
-        name: suggestedAutomation.name,
-        description: suggestedAutomation.description,
-        icon: getIconKey(suggestedAutomation.icon),
-        operations: suggestedAutomation.operations
-      };
+        // Convert suggested automation to saved automation format
+        const savedAutomation = {
+          name: suggestedAutomation.name,
+          description: suggestedAutomation.description,
+          icon: getIconKey(suggestedAutomation.icon),
+          operations: suggestedAutomation.operations,
+        };
 
-      await automationStorage.saveAutomation(savedAutomation);
-      // Refresh the list after saving
-      refreshAutomations();
-    } catch (err) {
-      console.error('Error copying suggested automation:', err);
-      throw err;
-    }
-  }, [refreshAutomations]);
+        await automationStorage.saveAutomation(savedAutomation);
+        // Refresh the list after saving
+        refreshAutomations();
+      } catch (err) {
+        console.error("Error copying suggested automation:", err);
+        throw err;
+      }
+    },
+    [refreshAutomations],
+  );
 
   // Load automations on mount
   useEffect(() => {
@@ -89,6 +100,6 @@ export function useSavedAutomations() {
     error,
     refreshAutomations,
     deleteAutomation,
-    copyFromSuggested
+    copyFromSuggested,
   };
 }
diff --git a/frontend/src/core/hooks/tools/automate/useSuggestedAutomations.ts b/frontend/src/core/hooks/tools/automate/useSuggestedAutomations.ts
index 082a2f975f..541e8234dc 100644
--- a/frontend/src/core/hooks/tools/automate/useSuggestedAutomations.ts
+++ b/frontend/src/core/hooks/tools/automate/useSuggestedAutomations.ts
@@ -1,15 +1,35 @@
-import { useMemo } from 'react';
-import { useTranslation } from 'react-i18next';
-import React from 'react';
-import LocalIcon from '@app/components/shared/LocalIcon';
-import { SuggestedAutomation } from '@app/types/automation';
-import { SPLIT_METHODS } from '@app/constants/splitConstants';
+import { useMemo } from "react";
+import { useTranslation } from "react-i18next";
+import React from "react";
+import LocalIcon from "@app/components/shared/LocalIcon";
+import { SuggestedAutomation } from "@app/types/automation";
+import { SPLIT_METHODS } from "@app/constants/splitConstants";
 
 // Create icon components
-const CompressIcon = () => React.createElement(LocalIcon, { icon: 'compress', width: '1.5rem', height: '1.5rem' });
-const SecurityIcon = () => React.createElement(LocalIcon, { icon: 'security', width: '1.5rem', height: '1.5rem' });
-const StarIcon = () => React.createElement(LocalIcon, { icon: 'star', width: '1.5rem', height: '1.5rem' });
-const PrivacyIcon = () => React.createElement(LocalIcon, { icon: 'shield-lock', width: '1.5rem', height: '1.5rem' });
+const CompressIcon = () =>
+  React.createElement(LocalIcon, {
+    icon: "compress",
+    width: "1.5rem",
+    height: "1.5rem",
+  });
+const SecurityIcon = () =>
+  React.createElement(LocalIcon, {
+    icon: "security",
+    width: "1.5rem",
+    height: "1.5rem",
+  });
+const StarIcon = () =>
+  React.createElement(LocalIcon, {
+    icon: "star",
+    width: "1.5rem",
+    height: "1.5rem",
+  });
+const PrivacyIcon = () =>
+  React.createElement(LocalIcon, {
+    icon: "shield-lock",
+    width: "1.5rem",
+    height: "1.5rem",
+  });
 
 export function useSuggestedAutomations(): SuggestedAutomation[] {
   const { t } = useTranslation();
@@ -19,8 +39,14 @@ export function useSuggestedAutomations(): SuggestedAutomation[] {
     return [
       {
         id: "secure-pdf-ingestion",
-        name: t("automation.suggested.securePdfIngestion", "Secure PDF Ingestion"),
-        description: t("automation.suggested.securePdfIngestionDesc", "Comprehensive PDF processing workflow that sanitizes documents, applies OCR with cleanup, converts to PDF/A format for long-term archival, and optimizes file size."),
+        name: t(
+          "automation.suggested.securePdfIngestion",
+          "Secure PDF Ingestion",
+        ),
+        description: t(
+          "automation.suggested.securePdfIngestionDesc",
+          "Comprehensive PDF processing workflow that sanitizes documents, applies OCR with cleanup, converts to PDF/A format for long-term archival, and optimizes file size.",
+        ),
         operations: [
           {
             operation: "sanitize",
@@ -31,39 +57,39 @@ export function useSuggestedAutomations(): SuggestedAutomation[] {
               removeMetadata: true,
               removeLinks: false,
               removeFonts: false,
-            }
+            },
           },
           {
             operation: "ocr",
             parameters: {
-              languages: ['eng'],
-              ocrType: 'skip-text',
-              ocrRenderType: 'hocr',
-              additionalOptions: ['clean', 'cleanFinal'],
-            }
+              languages: ["eng"],
+              ocrType: "skip-text",
+              ocrRenderType: "hocr",
+              additionalOptions: ["clean", "cleanFinal"],
+            },
           },
           {
             operation: "convert",
             parameters: {
-              fromExtension: 'pdf',
-              toExtension: 'pdfa',
+              fromExtension: "pdf",
+              toExtension: "pdfa",
               pdfaOptions: {
-                outputFormat: 'pdfa-2b',
+                outputFormat: "pdfa-2b",
                 strict: false,
-              }
-            }
+              },
+            },
           },
           {
             operation: "compress",
             parameters: {
               compressionLevel: 5,
               grayscale: false,
-              expectedSize: '',
-              compressionMethod: 'quality',
-              fileSizeValue: '',
-              fileSizeUnit: 'MB',
-            }
-          }
+              expectedSize: "",
+              compressionMethod: "quality",
+              fileSizeValue: "",
+              fileSizeUnit: "MB",
+            },
+          },
         ],
         createdAt: now,
         updatedAt: now,
@@ -71,8 +97,14 @@ export function useSuggestedAutomations(): SuggestedAutomation[] {
       },
       {
         id: "pre-publish-sanitization",
-        name: t("automation.suggested.prePublishSanitization", "Pre-publish Sanitization"),
-        description: t("automation.suggested.prePublishSanitizationDesc", "Sanitization workflow that removes all hidden metadata, JavaScript, embedded files, annotations, and flattens forms to prevent data leakage before publishing PDFs online."),
+        name: t(
+          "automation.suggested.prePublishSanitization",
+          "Pre-publish Sanitization",
+        ),
+        description: t(
+          "automation.suggested.prePublishSanitizationDesc",
+          "Sanitization workflow that removes all hidden metadata, JavaScript, embedded files, annotations, and flattens forms to prevent data leakage before publishing PDFs online.",
+        ),
         operations: [
           {
             operation: "sanitize",
@@ -83,43 +115,43 @@ export function useSuggestedAutomations(): SuggestedAutomation[] {
               removeMetadata: true,
               removeLinks: true,
               removeFonts: false,
-            }
+            },
           },
           {
             operation: "flatten",
             parameters: {
               flattenOnlyForms: true,
-            }
+            },
           },
           {
             operation: "removeAnnotations",
-            parameters: {}
+            parameters: {},
           },
           {
             operation: "changeMetadata",
             parameters: {
               deleteAll: true,
-              author: '',
-              creationDate: '',
-              creator: '',
-              keywords: '',
-              modificationDate: '',
-              producer: '',
-              subject: '',
-              title: '',
-              trapped: '',
-            }
+              author: "",
+              creationDate: "",
+              creator: "",
+              keywords: "",
+              modificationDate: "",
+              producer: "",
+              subject: "",
+              title: "",
+              trapped: "",
+            },
           },
           {
             operation: "compress",
             parameters: {
               compressionLevel: 3,
               grayscale: false,
-              expectedSize: '',
-              compressionMethod: 'quality',
-              fileSizeValue: '',
-              fileSizeUnit: 'MB',
-            }
+              expectedSize: "",
+              compressionMethod: "quality",
+              fileSizeValue: "",
+              fileSizeUnit: "MB",
+            },
           },
         ],
         createdAt: now,
@@ -129,33 +161,36 @@ export function useSuggestedAutomations(): SuggestedAutomation[] {
       {
         id: "email-preparation",
         name: t("automation.suggested.emailPreparation", "Email Preparation"),
-        description: t("automation.suggested.emailPreparationDesc", "Optimizes PDFs for email distribution by compressing files, splitting large documents into 20MB chunks for email compatibility, and removing metadata for privacy."),
+        description: t(
+          "automation.suggested.emailPreparationDesc",
+          "Optimizes PDFs for email distribution by compressing files, splitting large documents into 20MB chunks for email compatibility, and removing metadata for privacy.",
+        ),
         operations: [
           {
             operation: "compress",
             parameters: {
               compressionLevel: 5,
               grayscale: false,
-              expectedSize: '',
-              compressionMethod: 'quality',
-              fileSizeValue: '',
-              fileSizeUnit: 'MB',
-            }
+              expectedSize: "",
+              compressionMethod: "quality",
+              fileSizeValue: "",
+              fileSizeUnit: "MB",
+            },
           },
           {
             operation: "split",
             parameters: {
               method: SPLIT_METHODS.BY_SIZE,
-              pages: '',
-              hDiv: '1',
-              vDiv: '1',
+              pages: "",
+              hDiv: "1",
+              vDiv: "1",
               merge: false,
-              splitValue: '20MB',
-              bookmarkLevel: '1',
+              splitValue: "20MB",
+              bookmarkLevel: "1",
               includeMetadata: false,
               allowDuplicates: false,
               duplexMode: false,
-            }
+            },
           },
           {
             operation: "sanitize",
@@ -166,8 +201,8 @@ export function useSuggestedAutomations(): SuggestedAutomation[] {
               removeMetadata: true,
               removeLinks: false,
               removeFonts: false,
-            }
-          }
+            },
+          },
         ],
         createdAt: now,
         updatedAt: now,
@@ -176,7 +211,10 @@ export function useSuggestedAutomations(): SuggestedAutomation[] {
       {
         id: "secure-workflow",
         name: t("automation.suggested.secureWorkflow", "Security Workflow"),
-        description: t("automation.suggested.secureWorkflowDesc", "Secures PDF documents by removing potentially malicious content like JavaScript and embedded files, then adds password protection to prevent unauthorized access. Password is set to 'password' by default."),
+        description: t(
+          "automation.suggested.secureWorkflowDesc",
+          "Secures PDF documents by removing potentially malicious content like JavaScript and embedded files, then adds password protection to prevent unauthorized access. Password is set to 'password' by default.",
+        ),
         operations: [
           {
             operation: "sanitize",
@@ -187,13 +225,13 @@ export function useSuggestedAutomations(): SuggestedAutomation[] {
               removeMetadata: false,
               removeLinks: false,
               removeFonts: false,
-            }
+            },
           },
           {
             operation: "addPassword",
             parameters: {
-              password: 'password',
-              ownerPassword: '',
+              password: "password",
+              ownerPassword: "",
               keyLength: 128,
               permissions: {
                 preventAssembly: false,
@@ -204,9 +242,9 @@ export function useSuggestedAutomations(): SuggestedAutomation[] {
                 preventModifyAnnotations: false,
                 preventPrinting: false,
                 preventPrintingFaithful: false,
-              }
-            }
-          }
+              },
+            },
+          },
         ],
         createdAt: now,
         updatedAt: now,
@@ -215,32 +253,35 @@ export function useSuggestedAutomations(): SuggestedAutomation[] {
       {
         id: "process-images",
         name: t("automation.suggested.processImages", "Process Images"),
-        description: t("automation.suggested.processImagesDesc", "Converts multiple image files into a single PDF document, then applies OCR technology to extract searchable text from the images."),
+        description: t(
+          "automation.suggested.processImagesDesc",
+          "Converts multiple image files into a single PDF document, then applies OCR technology to extract searchable text from the images.",
+        ),
         operations: [
           {
             operation: "convert",
             parameters: {
-              fromExtension: 'image',
-              toExtension: 'pdf',
+              fromExtension: "image",
+              toExtension: "pdf",
               imageOptions: {
-                colorType: 'color',
+                colorType: "color",
                 dpi: 300,
-                singleOrMultiple: 'multiple',
-                fitOption: 'maintainAspectRatio',
+                singleOrMultiple: "multiple",
+                fitOption: "maintainAspectRatio",
                 autoRotate: true,
                 combineImages: true,
-              }
-            }
+              },
+            },
           },
           {
             operation: "ocr",
             parameters: {
-              languages: ['eng'],
-              ocrType: 'skip-text',
-              ocrRenderType: 'hocr',
+              languages: ["eng"],
+              ocrType: "skip-text",
+              ocrRenderType: "hocr",
               additionalOptions: [],
-            }
-          }
+            },
+          },
         ],
         createdAt: now,
         updatedAt: now,
diff --git a/frontend/src/core/hooks/tools/bookletImposition/useBookletImpositionOperation.ts b/frontend/src/core/hooks/tools/bookletImposition/useBookletImpositionOperation.ts
index c01fde036d..6da2b66320 100644
--- a/frontend/src/core/hooks/tools/bookletImposition/useBookletImpositionOperation.ts
+++ b/frontend/src/core/hooks/tools/bookletImposition/useBookletImpositionOperation.ts
@@ -1,10 +1,19 @@
-import { useTranslation } from 'react-i18next';
-import { useToolOperation, ToolType } from '@app/hooks/tools/shared/useToolOperation';
-import { createStandardErrorHandler } from '@app/utils/toolErrorHandler';
-import { BookletImpositionParameters, defaultParameters } from '@app/hooks/tools/bookletImposition/useBookletImpositionParameters';
+import { useTranslation } from "react-i18next";
+import {
+  useToolOperation,
+  ToolType,
+} from "@app/hooks/tools/shared/useToolOperation";
+import { createStandardErrorHandler } from "@app/utils/toolErrorHandler";
+import {
+  BookletImpositionParameters,
+  defaultParameters,
+} from "@app/hooks/tools/bookletImposition/useBookletImpositionParameters";
 
 // Static configuration that can be used by both the hook and automation executor
-export const buildBookletImpositionFormData = (parameters: BookletImpositionParameters, file: File): FormData => {
+export const buildBookletImpositionFormData = (
+  parameters: BookletImpositionParameters,
+  file: File,
+): FormData => {
   const formData = new FormData();
   formData.append("fileInput", file);
   formData.append("pagesPerSheet", parameters.pagesPerSheet.toString());
@@ -22,8 +31,8 @@ export const buildBookletImpositionFormData = (parameters: BookletImpositionPara
 export const bookletImpositionOperationConfig = {
   toolType: ToolType.singleFile,
   buildFormData: buildBookletImpositionFormData,
-  operationType: 'bookletImposition',
-  endpoint: '/api/v1/general/booklet-imposition',
+  operationType: "bookletImposition",
+  endpoint: "/api/v1/general/booklet-imposition",
   defaultParameters,
 } as const;
 
@@ -32,6 +41,11 @@ export const useBookletImpositionOperation = () => {
 
   return useToolOperation<BookletImpositionParameters>({
     ...bookletImpositionOperationConfig,
-    getErrorMessage: createStandardErrorHandler(t('bookletImposition.error.failed', 'An error occurred while creating the booklet imposition.'))
+    getErrorMessage: createStandardErrorHandler(
+      t(
+        "bookletImposition.error.failed",
+        "An error occurred while creating the booklet imposition.",
+      ),
+    ),
   });
-};
\ No newline at end of file
+};
diff --git a/frontend/src/core/hooks/tools/bookletImposition/useBookletImpositionParameters.ts b/frontend/src/core/hooks/tools/bookletImposition/useBookletImpositionParameters.ts
index dd7442398d..1c90b8ba9e 100644
--- a/frontend/src/core/hooks/tools/bookletImposition/useBookletImpositionParameters.ts
+++ b/frontend/src/core/hooks/tools/bookletImposition/useBookletImpositionParameters.ts
@@ -1,36 +1,41 @@
-import { BaseParameters } from '@app/types/parameters';
-import { useBaseParameters, BaseParametersHook } from '@app/hooks/tools/shared/useBaseParameters';
+import { BaseParameters } from "@app/types/parameters";
+import {
+  useBaseParameters,
+  BaseParametersHook,
+} from "@app/hooks/tools/shared/useBaseParameters";
 
 export interface BookletImpositionParameters extends BaseParameters {
   pagesPerSheet: 2;
   addBorder: boolean;
-  spineLocation: 'LEFT' | 'RIGHT';
+  spineLocation: "LEFT" | "RIGHT";
   addGutter: boolean;
   gutterSize: number;
   doubleSided: boolean;
-  duplexPass: 'BOTH' | 'FIRST' | 'SECOND';
+  duplexPass: "BOTH" | "FIRST" | "SECOND";
   flipOnShortEdge: boolean;
 }
 
 export const defaultParameters: BookletImpositionParameters = {
   pagesPerSheet: 2,
   addBorder: false,
-  spineLocation: 'LEFT',
+  spineLocation: "LEFT",
   addGutter: false,
   gutterSize: 12,
   doubleSided: true,
-  duplexPass: 'BOTH',
+  duplexPass: "BOTH",
   flipOnShortEdge: false,
 };
 
-export type BookletImpositionParametersHook = BaseParametersHook<BookletImpositionParameters>;
+export type BookletImpositionParametersHook =
+  BaseParametersHook<BookletImpositionParameters>;
 
-export const useBookletImpositionParameters = (): BookletImpositionParametersHook => {
-  return useBaseParameters({
-    defaultParameters,
-    endpointName: 'booklet-imposition',
-    validateFn: (params) => {
-      return params.pagesPerSheet === 2;
-    },
-  });
-};
\ No newline at end of file
+export const useBookletImpositionParameters =
+  (): BookletImpositionParametersHook => {
+    return useBaseParameters({
+      defaultParameters,
+      endpointName: "booklet-imposition",
+      validateFn: (params) => {
+        return params.pagesPerSheet === 2;
+      },
+    });
+  };
diff --git a/frontend/src/core/hooks/tools/certSign/useCertSignOperation.ts b/frontend/src/core/hooks/tools/certSign/useCertSignOperation.ts
index d8c580fe2a..ccd2f8c417 100644
--- a/frontend/src/core/hooks/tools/certSign/useCertSignOperation.ts
+++ b/frontend/src/core/hooks/tools/certSign/useCertSignOperation.ts
@@ -1,39 +1,48 @@
-import { useTranslation } from 'react-i18next';
-import { ToolType, useToolOperation } from '@app/hooks/tools/shared/useToolOperation';
-import { createStandardErrorHandler } from '@app/utils/toolErrorHandler';
-import { CertSignParameters, defaultParameters } from '@app/hooks/tools/certSign/useCertSignParameters';
+import { useTranslation } from "react-i18next";
+import {
+  ToolType,
+  useToolOperation,
+} from "@app/hooks/tools/shared/useToolOperation";
+import { createStandardErrorHandler } from "@app/utils/toolErrorHandler";
+import {
+  CertSignParameters,
+  defaultParameters,
+} from "@app/hooks/tools/certSign/useCertSignParameters";
 
 // Build form data for signing
-export const buildCertSignFormData = (parameters: CertSignParameters, file: File): FormData => {
+export const buildCertSignFormData = (
+  parameters: CertSignParameters,
+  file: File,
+): FormData => {
   const formData = new FormData();
-  formData.append('fileInput', file);
+  formData.append("fileInput", file);
 
   // Handle sign mode
-  if (parameters.signMode === 'AUTO') {
-    formData.append('certType', 'SERVER');
+  if (parameters.signMode === "AUTO") {
+    formData.append("certType", "SERVER");
   } else {
-    formData.append('certType', parameters.certType);
-    formData.append('password', parameters.password);
+    formData.append("certType", parameters.certType);
+    formData.append("password", parameters.password);
 
     // Add certificate files based on type (only for manual mode)
     switch (parameters.certType) {
-      case 'PEM':
+      case "PEM":
         if (parameters.privateKeyFile) {
-          formData.append('privateKeyFile', parameters.privateKeyFile);
+          formData.append("privateKeyFile", parameters.privateKeyFile);
         }
         if (parameters.certFile) {
-          formData.append('certFile', parameters.certFile);
+          formData.append("certFile", parameters.certFile);
         }
         break;
-      case 'PKCS12':
-      case 'PFX':
+      case "PKCS12":
+      case "PFX":
         if (parameters.p12File) {
-          formData.append('p12File', parameters.p12File);
+          formData.append("p12File", parameters.p12File);
         }
         break;
-      case 'JKS':
+      case "JKS":
         if (parameters.jksFile) {
-          formData.append('jksFile', parameters.jksFile);
+          formData.append("jksFile", parameters.jksFile);
         }
         break;
     }
@@ -41,12 +50,12 @@ export const buildCertSignFormData = (parameters: CertSignParameters, file: File
 
   // Add signature appearance options if enabled
   if (parameters.showSignature) {
-    formData.append('showSignature', 'true');
-    formData.append('reason', parameters.reason);
-    formData.append('location', parameters.location);
-    formData.append('name', parameters.name);
-    formData.append('pageNumber', parameters.pageNumber.toString());
-    formData.append('showLogo', parameters.showLogo.toString());
+    formData.append("showSignature", "true");
+    formData.append("reason", parameters.reason);
+    formData.append("location", parameters.location);
+    formData.append("name", parameters.name);
+    formData.append("pageNumber", parameters.pageNumber.toString());
+    formData.append("showLogo", parameters.showLogo.toString());
   }
 
   return formData;
@@ -56,8 +65,8 @@ export const buildCertSignFormData = (parameters: CertSignParameters, file: File
 export const certSignOperationConfig = {
   toolType: ToolType.singleFile,
   buildFormData: buildCertSignFormData,
-  operationType: 'certSign',
-  endpoint: '/api/v1/security/cert-sign',
+  operationType: "certSign",
+  endpoint: "/api/v1/security/cert-sign",
   multiFileEndpoint: false,
   defaultParameters,
 } as const;
@@ -67,6 +76,11 @@ export const useCertSignOperation = () => {
 
   return useToolOperation<CertSignParameters>({
     ...certSignOperationConfig,
-    getErrorMessage: createStandardErrorHandler(t('certSign.error.failed', 'An error occurred while processing signatures.'))
+    getErrorMessage: createStandardErrorHandler(
+      t(
+        "certSign.error.failed",
+        "An error occurred while processing signatures.",
+      ),
+    ),
   });
 };
diff --git a/frontend/src/core/hooks/tools/certSign/useCertSignParameters.ts b/frontend/src/core/hooks/tools/certSign/useCertSignParameters.ts
index 374cffd2c3..ef65a6ecc5 100644
--- a/frontend/src/core/hooks/tools/certSign/useCertSignParameters.ts
+++ b/frontend/src/core/hooks/tools/certSign/useCertSignParameters.ts
@@ -1,17 +1,20 @@
-import { BaseParameters } from '@app/types/parameters';
-import { useBaseParameters, BaseParametersHook } from '@app/hooks/tools/shared/useBaseParameters';
+import { BaseParameters } from "@app/types/parameters";
+import {
+  useBaseParameters,
+  BaseParametersHook,
+} from "@app/hooks/tools/shared/useBaseParameters";
 
 export interface CertSignParameters extends BaseParameters {
   // Sign mode selection
-  signMode: 'MANUAL' | 'AUTO';
+  signMode: "MANUAL" | "AUTO";
   // Certificate signing options (only for manual mode)
-  certType: '' | 'PEM' | 'PKCS12' | 'PFX' | 'JKS';
+  certType: "" | "PEM" | "PKCS12" | "PFX" | "JKS";
   privateKeyFile?: File;
   certFile?: File;
   p12File?: File;
   jksFile?: File;
   password: string;
-  
+
   // Signature appearance options
   showSignature: boolean;
   reason: string;
@@ -22,13 +25,13 @@ export interface CertSignParameters extends BaseParameters {
 }
 
 export const defaultParameters: CertSignParameters = {
-  signMode: 'MANUAL',
-  certType: '',
-  password: '',
+  signMode: "MANUAL",
+  certType: "",
+  password: "",
   showSignature: false,
-  reason: '',
-  location: '',
-  name: '',
+  reason: "",
+  location: "",
+  name: "",
   pageNumber: 1,
   showLogo: true,
 };
@@ -38,30 +41,30 @@ export type CertSignParametersHook = BaseParametersHook<CertSignParameters>;
 export const useCertSignParameters = (): CertSignParametersHook => {
   return useBaseParameters({
     defaultParameters,
-    endpointName: 'cert-sign',
+    endpointName: "cert-sign",
     validateFn: (params) => {
       // Auto mode (server certificate) - no additional validation needed
-      if (params.signMode === 'AUTO') {
+      if (params.signMode === "AUTO") {
         return true;
       }
-      
+
       // Manual mode - requires certificate type and files
       if (!params.certType) {
         return false;
       }
-      
+
       // Check for required files based on cert type
       switch (params.certType) {
-        case 'PEM':
+        case "PEM":
           return !!(params.privateKeyFile && params.certFile);
-        case 'PKCS12':
-        case 'PFX':
+        case "PKCS12":
+        case "PFX":
           return !!params.p12File;
-        case 'JKS':
+        case "JKS":
           return !!params.jksFile;
         default:
           return false;
       }
     },
   });
-};
\ No newline at end of file
+};
diff --git a/frontend/src/core/hooks/tools/changeMetadata/useChangeMetadataOperation.test.ts b/frontend/src/core/hooks/tools/changeMetadata/useChangeMetadataOperation.test.ts
index cade2be5a6..6444f5f05d 100644
--- a/frontend/src/core/hooks/tools/changeMetadata/useChangeMetadataOperation.test.ts
+++ b/frontend/src/core/hooks/tools/changeMetadata/useChangeMetadataOperation.test.ts
@@ -1,18 +1,18 @@
-import { buildChangeMetadataFormData } from '@app/hooks/tools/changeMetadata/useChangeMetadataOperation';
-import { ChangeMetadataParameters } from '@app/hooks/tools/changeMetadata/useChangeMetadataParameters';
-import { TrappedStatus } from '@app/types/metadata';
-import { describe, expect, test } from 'vitest';
+import { buildChangeMetadataFormData } from "@app/hooks/tools/changeMetadata/useChangeMetadataOperation";
+import { ChangeMetadataParameters } from "@app/hooks/tools/changeMetadata/useChangeMetadataParameters";
+import { TrappedStatus } from "@app/types/metadata";
+import { describe, expect, test } from "vitest";
 
-describe('buildChangeMetadataFormData', () => {
-  const mockFile = new File(['test'], 'test.pdf', { type: 'application/pdf' });
+describe("buildChangeMetadataFormData", () => {
+  const mockFile = new File(["test"], "test.pdf", { type: "application/pdf" });
 
   const defaultParams: ChangeMetadataParameters = {
-    title: '',
-    author: '',
-    subject: '',
-    keywords: '',
-    creator: '',
-    producer: '',
+    title: "",
+    author: "",
+    subject: "",
+    keywords: "",
+    creator: "",
+    producer: "",
     creationDate: null,
     modificationDate: null,
     trapped: TrappedStatus.UNKNOWN,
@@ -22,63 +22,63 @@ describe('buildChangeMetadataFormData', () => {
 
   test.each([
     {
-      name: 'should build FormData with basic parameters',
+      name: "should build FormData with basic parameters",
       params: {
         ...defaultParams,
-        title: 'Test Document',
-        author: 'John Doe',
+        title: "Test Document",
+        author: "John Doe",
         deleteAll: true,
       },
       expectedFormData: {
         fileInput: mockFile,
-        title: 'Test Document',
-        author: 'John Doe',
-        deleteAll: 'true',
+        title: "Test Document",
+        author: "John Doe",
+        deleteAll: "true",
       },
     },
     {
-      name: 'should handle empty string values',
+      name: "should handle empty string values",
       params: defaultParams,
       expectedFormData: {
-        title: '',
-        author: '',
-        subject: '',
-        keywords: '',
-        creator: '',
-        producer: '',
-        creationDate: '',
-        modificationDate: '',
+        title: "",
+        author: "",
+        subject: "",
+        keywords: "",
+        creator: "",
+        producer: "",
+        creationDate: "",
+        modificationDate: "",
         trapped: TrappedStatus.UNKNOWN,
-        deleteAll: 'false',
+        deleteAll: "false",
       },
     },
     {
-      name: 'should include all standard metadata fields',
+      name: "should include all standard metadata fields",
       params: {
         ...defaultParams,
-        title: 'Test Title',
-        author: 'Test Author',
-        subject: 'Test Subject',
-        keywords: 'test, keywords',
-        creator: 'Test Creator',
-        producer: 'Test Producer',
-        creationDate: new Date('2025/01/17 14:30:00'),
-        modificationDate: new Date('2025/01/17 15:30:00'),
+        title: "Test Title",
+        author: "Test Author",
+        subject: "Test Subject",
+        keywords: "test, keywords",
+        creator: "Test Creator",
+        producer: "Test Producer",
+        creationDate: new Date("2025/01/17 14:30:00"),
+        modificationDate: new Date("2025/01/17 15:30:00"),
         trapped: TrappedStatus.TRUE,
       },
       expectedFormData: {
-        title: 'Test Title',
-        author: 'Test Author',
-        subject: 'Test Subject',
-        keywords: 'test, keywords',
-        creator: 'Test Creator',
-        producer: 'Test Producer',
-        creationDate: '2025/01/17 14:30:00',
-        modificationDate: '2025/01/17 15:30:00',
+        title: "Test Title",
+        author: "Test Author",
+        subject: "Test Subject",
+        keywords: "test, keywords",
+        creator: "Test Creator",
+        producer: "Test Producer",
+        creationDate: "2025/01/17 14:30:00",
+        modificationDate: "2025/01/17 15:30:00",
         trapped: TrappedStatus.TRUE,
       },
     },
-  ])('$name', ({ params, expectedFormData }) => {
+  ])("$name", ({ params, expectedFormData }) => {
     const formData = buildChangeMetadataFormData(params, mockFile);
 
     Object.entries(expectedFormData).forEach(([key, value]) => {
@@ -86,59 +86,59 @@ describe('buildChangeMetadataFormData', () => {
     });
   });
 
-  test('should handle custom metadata with proper indexing', () => {
+  test("should handle custom metadata with proper indexing", () => {
     const params = {
       ...defaultParams,
       customMetadata: [
-        { key: 'Department', value: 'Engineering', id: 'custom1' },
-        { key: 'Project', value: 'Test Project', id: 'custom2' },
-        { key: 'Status', value: 'Draft', id: 'custom3' },
+        { key: "Department", value: "Engineering", id: "custom1" },
+        { key: "Project", value: "Test Project", id: "custom2" },
+        { key: "Status", value: "Draft", id: "custom3" },
       ],
     };
 
     const formData = buildChangeMetadataFormData(params, mockFile);
 
-    expect(formData.get('allRequestParams[customKey1]')).toBe('Department');
-    expect(formData.get('allRequestParams[customValue1]')).toBe('Engineering');
-    expect(formData.get('allRequestParams[customKey2]')).toBe('Project');
-    expect(formData.get('allRequestParams[customValue2]')).toBe('Test Project');
-    expect(formData.get('allRequestParams[customKey3]')).toBe('Status');
-    expect(formData.get('allRequestParams[customValue3]')).toBe('Draft');
+    expect(formData.get("allRequestParams[customKey1]")).toBe("Department");
+    expect(formData.get("allRequestParams[customValue1]")).toBe("Engineering");
+    expect(formData.get("allRequestParams[customKey2]")).toBe("Project");
+    expect(formData.get("allRequestParams[customValue2]")).toBe("Test Project");
+    expect(formData.get("allRequestParams[customKey3]")).toBe("Status");
+    expect(formData.get("allRequestParams[customValue3]")).toBe("Draft");
   });
 
-  test('should skip custom metadata with empty keys or values', () => {
+  test("should skip custom metadata with empty keys or values", () => {
     const params = {
       ...defaultParams,
       customMetadata: [
-        { key: 'Department', value: 'Engineering', id: 'custom1' },
-        { key: '', value: 'No Key', id: 'custom2' },
-        { key: 'No Value', value: '', id: 'custom3' },
-        { key: '   ', value: 'Whitespace Key', id: 'custom4' },
-        { key: 'Valid', value: 'Valid Value', id: 'custom5' },
+        { key: "Department", value: "Engineering", id: "custom1" },
+        { key: "", value: "No Key", id: "custom2" },
+        { key: "No Value", value: "", id: "custom3" },
+        { key: "   ", value: "Whitespace Key", id: "custom4" },
+        { key: "Valid", value: "Valid Value", id: "custom5" },
       ],
     };
 
     const formData = buildChangeMetadataFormData(params, mockFile);
 
-    expect(formData.get('allRequestParams[customKey1]')).toBe('Department');
-    expect(formData.get('allRequestParams[customValue1]')).toBe('Engineering');
-    expect(formData.get('allRequestParams[customKey2]')).toBe('Valid');
-    expect(formData.get('allRequestParams[customValue2]')).toBe('Valid Value');
-    expect(formData.get('allRequestParams[customKey3]')).toBeNull();
-    expect(formData.get('allRequestParams[customKey4]')).toBeNull();
+    expect(formData.get("allRequestParams[customKey1]")).toBe("Department");
+    expect(formData.get("allRequestParams[customValue1]")).toBe("Engineering");
+    expect(formData.get("allRequestParams[customKey2]")).toBe("Valid");
+    expect(formData.get("allRequestParams[customValue2]")).toBe("Valid Value");
+    expect(formData.get("allRequestParams[customKey3]")).toBeNull();
+    expect(formData.get("allRequestParams[customKey4]")).toBeNull();
   });
 
-  test('should trim whitespace from custom metadata', () => {
+  test("should trim whitespace from custom metadata", () => {
     const params = {
       ...defaultParams,
       customMetadata: [
-        { key: '  Department  ', value: '  Engineering  ', id: 'custom1' },
+        { key: "  Department  ", value: "  Engineering  ", id: "custom1" },
       ],
     };
 
     const formData = buildChangeMetadataFormData(params, mockFile);
 
-    expect(formData.get('allRequestParams[customKey1]')).toBe('Department');
-    expect(formData.get('allRequestParams[customValue1]')).toBe('Engineering');
+    expect(formData.get("allRequestParams[customKey1]")).toBe("Department");
+    expect(formData.get("allRequestParams[customValue1]")).toBe("Engineering");
   });
 });
diff --git a/frontend/src/core/hooks/tools/changeMetadata/useChangeMetadataOperation.ts b/frontend/src/core/hooks/tools/changeMetadata/useChangeMetadataOperation.ts
index b0692e5d6a..045b029522 100644
--- a/frontend/src/core/hooks/tools/changeMetadata/useChangeMetadataOperation.ts
+++ b/frontend/src/core/hooks/tools/changeMetadata/useChangeMetadataOperation.ts
@@ -1,22 +1,31 @@
-import { useTranslation } from 'react-i18next';
-import { useToolOperation, ToolType } from '@app/hooks/tools/shared/useToolOperation';
-import { createStandardErrorHandler } from '@app/utils/toolErrorHandler';
-import { ChangeMetadataParameters, defaultParameters } from '@app/hooks/tools/changeMetadata/useChangeMetadataParameters';
+import { useTranslation } from "react-i18next";
+import {
+  useToolOperation,
+  ToolType,
+} from "@app/hooks/tools/shared/useToolOperation";
+import { createStandardErrorHandler } from "@app/utils/toolErrorHandler";
+import {
+  ChangeMetadataParameters,
+  defaultParameters,
+} from "@app/hooks/tools/changeMetadata/useChangeMetadataParameters";
 
 // Helper function to format Date object to string
 const formatDateForBackend = (date: Date | null): string => {
-  if (!date) return '';
+  if (!date) return "";
   const year = date.getFullYear();
-  const month = String(date.getMonth() + 1).padStart(2, '0');
-  const day = String(date.getDate()).padStart(2, '0');
-  const hours = String(date.getHours()).padStart(2, '0');
-  const minutes = String(date.getMinutes()).padStart(2, '0');
-  const seconds = String(date.getSeconds()).padStart(2, '0');
+  const month = String(date.getMonth() + 1).padStart(2, "0");
+  const day = String(date.getDate()).padStart(2, "0");
+  const hours = String(date.getHours()).padStart(2, "0");
+  const minutes = String(date.getMinutes()).padStart(2, "0");
+  const seconds = String(date.getSeconds()).padStart(2, "0");
   return `${year}/${month}/${day} ${hours}:${minutes}:${seconds}`;
 };
 
 // Static function that can be used by both the hook and automation executor
-export const buildChangeMetadataFormData = (parameters: ChangeMetadataParameters, file: File): FormData => {
+export const buildChangeMetadataFormData = (
+  parameters: ChangeMetadataParameters,
+  file: File,
+): FormData => {
   const formData = new FormData();
   formData.append("fileInput", file);
 
@@ -29,8 +38,14 @@ export const buildChangeMetadataFormData = (parameters: ChangeMetadataParameters
   formData.append("producer", parameters.producer || "");
 
   // Date fields - convert Date objects to strings
-  formData.append("creationDate", formatDateForBackend(parameters.creationDate));
-  formData.append("modificationDate", formatDateForBackend(parameters.modificationDate));
+  formData.append(
+    "creationDate",
+    formatDateForBackend(parameters.creationDate),
+  );
+  formData.append(
+    "modificationDate",
+    formatDateForBackend(parameters.modificationDate),
+  );
 
   // Trapped status
   formData.append("trapped", parameters.trapped || "");
@@ -44,8 +59,14 @@ export const buildChangeMetadataFormData = (parameters: ChangeMetadataParameters
     parameters.customMetadata.forEach((entry) => {
       if (entry.key.trim() && entry.value.trim()) {
         keyNumber += 1;
-        formData.append(`allRequestParams[customKey${keyNumber}]`, entry.key.trim());
-        formData.append(`allRequestParams[customValue${keyNumber}]`, entry.value.trim());
+        formData.append(
+          `allRequestParams[customKey${keyNumber}]`,
+          entry.key.trim(),
+        );
+        formData.append(
+          `allRequestParams[customValue${keyNumber}]`,
+          entry.value.trim(),
+        );
       }
     });
   }
@@ -57,8 +78,8 @@ export const buildChangeMetadataFormData = (parameters: ChangeMetadataParameters
 export const changeMetadataOperationConfig = {
   toolType: ToolType.singleFile,
   buildFormData: buildChangeMetadataFormData,
-  operationType: 'changeMetadata',
-  endpoint: '/api/v1/misc/update-metadata',
+  operationType: "changeMetadata",
+  endpoint: "/api/v1/misc/update-metadata",
   defaultParameters,
 } as const;
 
@@ -67,7 +88,12 @@ export const useChangeMetadataOperation = () => {
 
   return useToolOperation<ChangeMetadataParameters>({
     ...changeMetadataOperationConfig,
-    filePrefix: t('changeMetadata.filenamePrefix', 'metadata') + '_',
-    getErrorMessage: createStandardErrorHandler(t('changeMetadata.error.failed', 'An error occurred while changing the PDF metadata.'))
+    filePrefix: t("changeMetadata.filenamePrefix", "metadata") + "_",
+    getErrorMessage: createStandardErrorHandler(
+      t(
+        "changeMetadata.error.failed",
+        "An error occurred while changing the PDF metadata.",
+      ),
+    ),
   });
 };
diff --git a/frontend/src/core/hooks/tools/changeMetadata/useChangeMetadataParameters.test.ts b/frontend/src/core/hooks/tools/changeMetadata/useChangeMetadataParameters.test.ts
index f932f658f1..b7f8d6bf30 100644
--- a/frontend/src/core/hooks/tools/changeMetadata/useChangeMetadataParameters.test.ts
+++ b/frontend/src/core/hooks/tools/changeMetadata/useChangeMetadataParameters.test.ts
@@ -1,83 +1,157 @@
-import { renderHook, act } from '@testing-library/react';
-import { defaultParameters, useChangeMetadataParameters } from '@app/hooks/tools/changeMetadata/useChangeMetadataParameters';
-import { TrappedStatus } from '@app/types/metadata';
-import { describe, expect, test } from 'vitest';
+import { renderHook, act } from "@testing-library/react";
+import {
+  defaultParameters,
+  useChangeMetadataParameters,
+} from "@app/hooks/tools/changeMetadata/useChangeMetadataParameters";
+import { TrappedStatus } from "@app/types/metadata";
+import { describe, expect, test } from "vitest";
 
-describe('useChangeMetadataParameters', () => {
-  test('should initialize with default parameters', () => {
+describe("useChangeMetadataParameters", () => {
+  test("should initialize with default parameters", () => {
     const { result } = renderHook(() => useChangeMetadataParameters());
 
     expect(result.current.parameters).toStrictEqual(defaultParameters);
   });
 
-  describe('parameter updates', () => {
+  describe("parameter updates", () => {
     test.each([
-      { paramName: 'title', value: 'Test Document' },
-      { paramName: 'author', value: 'John Doe' },
-      { paramName: 'subject', value: 'Test Subject' },
-      { paramName: 'keywords', value: 'test, metadata' },
-      { paramName: 'creator', value: 'Test Creator' },
-      { paramName: 'producer', value: 'Test Producer' },
-      { paramName: 'creationDate', value: new Date('2025/01/17 14:30:00') },
-      { paramName: 'modificationDate', value: new Date('2025/01/17 15:30:00') },
-      { paramName: 'trapped', value: TrappedStatus.TRUE },
-      { paramName: 'deleteAll', value: true },
-    ] as const)('should update $paramName parameter', ({ paramName, value }) => {
-      const { result } = renderHook(() => useChangeMetadataParameters());
+      { paramName: "title", value: "Test Document" },
+      { paramName: "author", value: "John Doe" },
+      { paramName: "subject", value: "Test Subject" },
+      { paramName: "keywords", value: "test, metadata" },
+      { paramName: "creator", value: "Test Creator" },
+      { paramName: "producer", value: "Test Producer" },
+      { paramName: "creationDate", value: new Date("2025/01/17 14:30:00") },
+      { paramName: "modificationDate", value: new Date("2025/01/17 15:30:00") },
+      { paramName: "trapped", value: TrappedStatus.TRUE },
+      { paramName: "deleteAll", value: true },
+    ] as const)(
+      "should update $paramName parameter",
+      ({ paramName, value }) => {
+        const { result } = renderHook(() => useChangeMetadataParameters());
 
-      act(() => {
-        result.current.updateParameter(paramName, value);
-      });
+        act(() => {
+          result.current.updateParameter(paramName, value);
+        });
 
-      expect(result.current.parameters[paramName]).toBe(value);
-    });
+        expect(result.current.parameters[paramName]).toBe(value);
+      },
+    );
   });
 
-  describe('validation', () => {
+  describe("validation", () => {
     test.each([
-      { description: 'deleteAll is true', updates: { deleteAll: true }, expected: true },
-      { description: 'has title', updates: { title: 'Test Document' }, expected: true },
-      { description: 'has author', updates: { author: 'John Doe' }, expected: true },
-      { description: 'has subject', updates: { subject: 'Test Subject' }, expected: true },
-      { description: 'has keywords', updates: { keywords: 'test' }, expected: true },
-      { description: 'has creator', updates: { creator: 'Test Creator' }, expected: true },
-      { description: 'has producer', updates: { producer: 'Test Producer' }, expected: true },
-      { description: 'has creation date', updates: { creationDate: new Date('2025/01/17 14:30:00') }, expected: true },
-      { description: 'has modification date', updates: { modificationDate: new Date('2025/01/17 14:30:00') }, expected: true },
-      { description: 'has trapped status', updates: { trapped: TrappedStatus.TRUE }, expected: true },
-      { description: 'no meaningful content', updates: {}, expected: false },
-      { description: 'whitespace only', updates: { title: '   ', author: '   ' }, expected: false },
-    ])('should validate correctly when $description', ({ updates, expected }) => {
-      const { result } = renderHook(() => useChangeMetadataParameters());
+      {
+        description: "deleteAll is true",
+        updates: { deleteAll: true },
+        expected: true,
+      },
+      {
+        description: "has title",
+        updates: { title: "Test Document" },
+        expected: true,
+      },
+      {
+        description: "has author",
+        updates: { author: "John Doe" },
+        expected: true,
+      },
+      {
+        description: "has subject",
+        updates: { subject: "Test Subject" },
+        expected: true,
+      },
+      {
+        description: "has keywords",
+        updates: { keywords: "test" },
+        expected: true,
+      },
+      {
+        description: "has creator",
+        updates: { creator: "Test Creator" },
+        expected: true,
+      },
+      {
+        description: "has producer",
+        updates: { producer: "Test Producer" },
+        expected: true,
+      },
+      {
+        description: "has creation date",
+        updates: { creationDate: new Date("2025/01/17 14:30:00") },
+        expected: true,
+      },
+      {
+        description: "has modification date",
+        updates: { modificationDate: new Date("2025/01/17 14:30:00") },
+        expected: true,
+      },
+      {
+        description: "has trapped status",
+        updates: { trapped: TrappedStatus.TRUE },
+        expected: true,
+      },
+      { description: "no meaningful content", updates: {}, expected: false },
+      {
+        description: "whitespace only",
+        updates: { title: "   ", author: "   " },
+        expected: false,
+      },
+    ])(
+      "should validate correctly when $description",
+      ({ updates, expected }) => {
+        const { result } = renderHook(() => useChangeMetadataParameters());
 
-      act(() => {
-        Object.entries(updates).forEach(([key, value]) => {
-          result.current.updateParameter(key as keyof typeof updates, value);
+        act(() => {
+          Object.entries(updates).forEach(([key, value]) => {
+            result.current.updateParameter(key as keyof typeof updates, value);
+          });
         });
-      });
 
-      expect(result.current.validateParameters()).toBe(expected);
-    });
+        expect(result.current.validateParameters()).toBe(expected);
+      },
+    );
 
     test.each([
-      { description: 'valid creation date', updates: { title: 'Test', creationDate: new Date('2025/01/17 14:30:00') }, expected: true },
-      { description: 'valid modification date', updates: { title: 'Test', modificationDate: new Date('2025/01/17 14:30:00') }, expected: true },
-      { description: 'empty dates are valid', updates: { title: 'Test', creationDate: null, modificationDate: null }, expected: true },
-    ])('should validate dates correctly with $description', ({ updates, expected }) => {
-      const { result } = renderHook(() => useChangeMetadataParameters());
+      {
+        description: "valid creation date",
+        updates: {
+          title: "Test",
+          creationDate: new Date("2025/01/17 14:30:00"),
+        },
+        expected: true,
+      },
+      {
+        description: "valid modification date",
+        updates: {
+          title: "Test",
+          modificationDate: new Date("2025/01/17 14:30:00"),
+        },
+        expected: true,
+      },
+      {
+        description: "empty dates are valid",
+        updates: { title: "Test", creationDate: null, modificationDate: null },
+        expected: true,
+      },
+    ])(
+      "should validate dates correctly with $description",
+      ({ updates, expected }) => {
+        const { result } = renderHook(() => useChangeMetadataParameters());
 
-      act(() => {
-        Object.entries(updates).forEach(([key, value]) => {
-          result.current.updateParameter(key as keyof typeof updates, value);
+        act(() => {
+          Object.entries(updates).forEach(([key, value]) => {
+            result.current.updateParameter(key as keyof typeof updates, value);
+          });
         });
-      });
 
-      expect(result.current.validateParameters()).toBe(expected);
-    });
+        expect(result.current.validateParameters()).toBe(expected);
+      },
+    );
   });
 
-  describe('custom metadata', () => {
-    test('should add custom metadata with sequential IDs', () => {
+  describe("custom metadata", () => {
+    test("should add custom metadata with sequential IDs", () => {
       const { result } = renderHook(() => useChangeMetadataParameters());
 
       act(() => {
@@ -86,13 +160,13 @@ describe('useChangeMetadataParameters', () => {
 
       expect(result.current.parameters.customMetadata).toHaveLength(1);
       expect(result.current.parameters.customMetadata[0]).toEqual({
-        key: '',
-        value: '',
-        id: expect.stringMatching(/^custom\d+$/)
+        key: "",
+        value: "",
+        id: expect.stringMatching(/^custom\d+$/),
       });
     });
 
-    test('should remove custom metadata by ID', () => {
+    test("should remove custom metadata by ID", () => {
       const { result } = renderHook(() => useChangeMetadataParameters());
 
       act(() => {
@@ -108,7 +182,7 @@ describe('useChangeMetadataParameters', () => {
       expect(result.current.parameters.customMetadata).toHaveLength(0);
     });
 
-    test('should update custom metadata by ID', () => {
+    test("should update custom metadata by ID", () => {
       const { result } = renderHook(() => useChangeMetadataParameters());
 
       act(() => {
@@ -118,17 +192,21 @@ describe('useChangeMetadataParameters', () => {
       const customId = result.current.parameters.customMetadata[0].id;
 
       act(() => {
-        result.current.updateCustomMetadata(customId, 'Department', 'Engineering');
+        result.current.updateCustomMetadata(
+          customId,
+          "Department",
+          "Engineering",
+        );
       });
 
       expect(result.current.parameters.customMetadata[0]).toEqual({
-        key: 'Department',
-        value: 'Engineering',
-        id: customId
+        key: "Department",
+        value: "Engineering",
+        id: customId,
       });
     });
 
-    test('should validate with custom metadata', () => {
+    test("should validate with custom metadata", () => {
       const { result } = renderHook(() => useChangeMetadataParameters());
 
       act(() => {
@@ -138,13 +216,17 @@ describe('useChangeMetadataParameters', () => {
       const customId = result.current.parameters.customMetadata[0].id;
 
       act(() => {
-        result.current.updateCustomMetadata(customId, 'Department', 'Engineering');
+        result.current.updateCustomMetadata(
+          customId,
+          "Department",
+          "Engineering",
+        );
       });
 
       expect(result.current.validateParameters()).toBe(true);
     });
 
-    test('should generate unique IDs for multiple custom entries', () => {
+    test("should generate unique IDs for multiple custom entries", () => {
       const { result } = renderHook(() => useChangeMetadataParameters());
 
       for (let i = 0; i < 3; i++) {
@@ -153,16 +235,18 @@ describe('useChangeMetadataParameters', () => {
         });
       }
 
-      const ids = result.current.parameters.customMetadata.map(entry => entry.id);
+      const ids = result.current.parameters.customMetadata.map(
+        (entry) => entry.id,
+      );
       expect(ids).toHaveLength(3);
       expect(new Set(ids).size).toBe(3); // All unique
-      expect(ids.every(id => id.startsWith('custom'))).toBe(true);
+      expect(ids.every((id) => id.startsWith("custom"))).toBe(true);
     });
   });
 
-  test('should return correct endpoint name', () => {
+  test("should return correct endpoint name", () => {
     const { result } = renderHook(() => useChangeMetadataParameters());
 
-    expect(result.current.getEndpointName()).toBe('update-metadata');
+    expect(result.current.getEndpointName()).toBe("update-metadata");
   });
 });
diff --git a/frontend/src/core/hooks/tools/changeMetadata/useChangeMetadataParameters.ts b/frontend/src/core/hooks/tools/changeMetadata/useChangeMetadataParameters.ts
index cbc07ed6c9..4966f4b40f 100644
--- a/frontend/src/core/hooks/tools/changeMetadata/useChangeMetadataParameters.ts
+++ b/frontend/src/core/hooks/tools/changeMetadata/useChangeMetadataParameters.ts
@@ -1,6 +1,9 @@
-import { BaseParameters } from '@app/types/parameters';
-import { TrappedStatus, CustomMetadataEntry } from '@app/types/metadata';
-import { useBaseParameters, BaseParametersHook } from '@app/hooks/tools/shared/useBaseParameters';
+import { BaseParameters } from "@app/types/parameters";
+import { TrappedStatus, CustomMetadataEntry } from "@app/types/metadata";
+import {
+  useBaseParameters,
+  BaseParametersHook,
+} from "@app/hooks/tools/shared/useBaseParameters";
 
 export interface ChangeMetadataParameters extends BaseParameters {
   // Standard PDF metadata fields
@@ -26,12 +29,12 @@ export interface ChangeMetadataParameters extends BaseParameters {
 }
 
 export const defaultParameters: ChangeMetadataParameters = {
-  title: '',
-  author: '',
-  subject: '',
-  keywords: '',
-  creator: '',
-  producer: '',
+  title: "",
+  author: "",
+  subject: "",
+  keywords: "",
+  creator: "",
+  producer: "",
   creationDate: null,
   modificationDate: null,
   trapped: TrappedStatus.UNKNOWN,
@@ -45,39 +48,44 @@ let customMetadataIdCounter = 1;
 // Utility functions that can work with external parameters
 export const createCustomMetadataFunctions = (
   parameters: ChangeMetadataParameters,
-  onParameterChange: <K extends keyof ChangeMetadataParameters>(key: K, value: ChangeMetadataParameters[K]) => void
+  onParameterChange: <K extends keyof ChangeMetadataParameters>(
+    key: K,
+    value: ChangeMetadataParameters[K],
+  ) => void,
 ) => {
-  const addCustomMetadata = (key: string = '', value: string = '') => {
+  const addCustomMetadata = (key: string = "", value: string = "") => {
     const newEntry: CustomMetadataEntry = {
       key,
       value,
       id: `custom${customMetadataIdCounter++}`,
     };
 
-    onParameterChange('customMetadata', [
+    onParameterChange("customMetadata", [
       ...parameters.customMetadata,
       newEntry,
     ]);
   };
 
   const removeCustomMetadata = (id: string) => {
-    onParameterChange('customMetadata',
-      parameters.customMetadata.filter(entry => entry.id !== id)
+    onParameterChange(
+      "customMetadata",
+      parameters.customMetadata.filter((entry) => entry.id !== id),
     );
   };
 
   const updateCustomMetadata = (id: string, key: string, value: string) => {
-    onParameterChange('customMetadata',
-      parameters.customMetadata.map(entry =>
-        entry.id === id ? { ...entry, key, value } : entry
-      )
+    onParameterChange(
+      "customMetadata",
+      parameters.customMetadata.map((entry) =>
+        entry.id === id ? { ...entry, key, value } : entry,
+      ),
     );
   };
 
   return {
     addCustomMetadata,
     removeCustomMetadata,
-    updateCustomMetadata
+    updateCustomMetadata,
   };
 };
 
@@ -90,47 +98,46 @@ const validateParameters = (params: ChangeMetadataParameters): boolean => {
 
   // At least one field should have content for the operation to be meaningful
   const hasStandardMetadata = !!(
-    params.title.trim()
-    || params.author.trim()
-    || params.subject.trim()
-    || params.keywords.trim()
-    || params.creator.trim()
-    || params.producer.trim()
-    || params.creationDate
-    || params.modificationDate
-    || params.trapped !== TrappedStatus.UNKNOWN
+    params.title.trim() ||
+    params.author.trim() ||
+    params.subject.trim() ||
+    params.keywords.trim() ||
+    params.creator.trim() ||
+    params.producer.trim() ||
+    params.creationDate ||
+    params.modificationDate ||
+    params.trapped !== TrappedStatus.UNKNOWN
   );
 
   const hasCustomMetadata = params.customMetadata.some(
-    entry => entry.key.trim() && entry.value.trim()
+    (entry) => entry.key.trim() && entry.value.trim(),
   );
 
   return hasStandardMetadata || hasCustomMetadata;
 };
 
-export type ChangeMetadataParametersHook = BaseParametersHook<ChangeMetadataParameters> & {
-  addCustomMetadata: (key?: string, value?: string) => void;
-  removeCustomMetadata: (id: string) => void;
-  updateCustomMetadata: (id: string, key: string, value: string) => void;
-};
+export type ChangeMetadataParametersHook =
+  BaseParametersHook<ChangeMetadataParameters> & {
+    addCustomMetadata: (key?: string, value?: string) => void;
+    removeCustomMetadata: (id: string) => void;
+    updateCustomMetadata: (id: string, key: string, value: string) => void;
+  };
 
 export const useChangeMetadataParameters = (): ChangeMetadataParametersHook => {
   const base = useBaseParameters({
     defaultParameters,
-    endpointName: 'update-metadata',
+    endpointName: "update-metadata",
     validateFn: validateParameters,
   });
 
   // Use the utility functions with the hook's parameters and updateParameter
-  const { addCustomMetadata, removeCustomMetadata, updateCustomMetadata } = createCustomMetadataFunctions(
-    base.parameters,
-    base.updateParameter,
-  );
+  const { addCustomMetadata, removeCustomMetadata, updateCustomMetadata } =
+    createCustomMetadataFunctions(base.parameters, base.updateParameter);
 
   return {
     ...base,
     addCustomMetadata,
     removeCustomMetadata,
-    updateCustomMetadata
+    updateCustomMetadata,
   };
 };
diff --git a/frontend/src/core/hooks/tools/changeMetadata/useMetadataExtraction.ts b/frontend/src/core/hooks/tools/changeMetadata/useMetadataExtraction.ts
index 9df398b661..41c20a6e2c 100644
--- a/frontend/src/core/hooks/tools/changeMetadata/useMetadataExtraction.ts
+++ b/frontend/src/core/hooks/tools/changeMetadata/useMetadataExtraction.ts
@@ -4,7 +4,10 @@ import { useSelectedFiles } from "@app/contexts/file/fileHooks";
 import { ChangeMetadataParameters } from "@app/hooks/tools/changeMetadata/useChangeMetadataParameters";
 
 interface MetadataExtractionParams {
-  updateParameter: <K extends keyof ChangeMetadataParameters>(key: K, value: ChangeMetadataParameters[K]) => void;
+  updateParameter: <K extends keyof ChangeMetadataParameters>(
+    key: K,
+    value: ChangeMetadataParameters[K],
+  ) => void;
 }
 
 export const useMetadataExtraction = (params: MetadataExtractionParams) => {
@@ -41,20 +44,28 @@ export const useMetadataExtraction = (params: MetadataExtractionParams) => {
         const metadata = result.metadata;
 
         // Pre-populate all fields with extracted metadata
-        params.updateParameter('title', metadata.title);
-        params.updateParameter('author', metadata.author);
-        params.updateParameter('subject', metadata.subject);
-        params.updateParameter('keywords', metadata.keywords);
-        params.updateParameter('creator', metadata.creator);
-        params.updateParameter('producer', metadata.producer);
-        params.updateParameter('creationDate', metadata.creationDate ? new Date(metadata.creationDate) : null);
-        params.updateParameter('modificationDate', metadata.modificationDate ? new Date(metadata.modificationDate) : null);
-        params.updateParameter('trapped', metadata.trapped);
-        params.updateParameter('customMetadata', metadata.customMetadata);
+        params.updateParameter("title", metadata.title);
+        params.updateParameter("author", metadata.author);
+        params.updateParameter("subject", metadata.subject);
+        params.updateParameter("keywords", metadata.keywords);
+        params.updateParameter("creator", metadata.creator);
+        params.updateParameter("producer", metadata.producer);
+        params.updateParameter(
+          "creationDate",
+          metadata.creationDate ? new Date(metadata.creationDate) : null,
+        );
+        params.updateParameter(
+          "modificationDate",
+          metadata.modificationDate
+            ? new Date(metadata.modificationDate)
+            : null,
+        );
+        params.updateParameter("trapped", metadata.trapped);
+        params.updateParameter("customMetadata", metadata.customMetadata);
 
         setHasExtractedMetadata(true);
       } else {
-        console.warn('Failed to extract metadata:', result.error);
+        console.warn("Failed to extract metadata:", result.error);
       }
 
       setIsExtractingMetadata(false);
diff --git a/frontend/src/core/hooks/tools/changePermissions/useChangePermissionsOperation.test.ts b/frontend/src/core/hooks/tools/changePermissions/useChangePermissionsOperation.test.ts
index 22cd5c67c5..2be13c3466 100644
--- a/frontend/src/core/hooks/tools/changePermissions/useChangePermissionsOperation.test.ts
+++ b/frontend/src/core/hooks/tools/changePermissions/useChangePermissionsOperation.test.ts
@@ -1,44 +1,51 @@
-import { describe, expect, test, vi, beforeEach } from 'vitest';
-import { renderHook } from '@testing-library/react';
-import { useChangePermissionsOperation } from '@app/hooks/tools/changePermissions/useChangePermissionsOperation';
-import type { ChangePermissionsParameters } from '@app/hooks/tools/changePermissions/useChangePermissionsParameters';
+import { describe, expect, test, vi, beforeEach } from "vitest";
+import { renderHook } from "@testing-library/react";
+import { useChangePermissionsOperation } from "@app/hooks/tools/changePermissions/useChangePermissionsOperation";
+import type { ChangePermissionsParameters } from "@app/hooks/tools/changePermissions/useChangePermissionsParameters";
 
 // Mock the useToolOperation hook
-vi.mock('../shared/useToolOperation', async () => {
-  const actual = await vi.importActual('../shared/useToolOperation');  // Need to keep ToolType etc.
+vi.mock("../shared/useToolOperation", async () => {
+  const actual = await vi.importActual("../shared/useToolOperation"); // Need to keep ToolType etc.
   return {
     ...actual,
-    useToolOperation: vi.fn()
+    useToolOperation: vi.fn(),
   };
 });
 
 // Mock the translation hook
 const mockT = vi.fn((key: string) => `translated-${key}`);
-vi.mock('react-i18next', () => ({
-  useTranslation: () => ({ t: mockT })
+vi.mock("react-i18next", () => ({
+  useTranslation: () => ({ t: mockT }),
 }));
 
 // Mock the error handler
-vi.mock('../../../utils/toolErrorHandler', () => ({
-  createStandardErrorHandler: vi.fn(() => 'error-handler-function')
+vi.mock("../../../utils/toolErrorHandler", () => ({
+  createStandardErrorHandler: vi.fn(() => "error-handler-function"),
 }));
 
 // Import the mocked function
-import { SingleFileToolOperationConfig, ToolOperationHook, ToolType, useToolOperation } from '@app/hooks/tools/shared/useToolOperation';
+import {
+  SingleFileToolOperationConfig,
+  ToolOperationHook,
+  ToolType,
+  useToolOperation,
+} from "@app/hooks/tools/shared/useToolOperation";
 
-describe('useChangePermissionsOperation', () => {
+describe("useChangePermissionsOperation", () => {
   const mockUseToolOperation = vi.mocked(useToolOperation);
 
-  const getToolConfig = () => mockUseToolOperation.mock.calls[0][0] as SingleFileToolOperationConfig<ChangePermissionsParameters>;
+  const getToolConfig = () =>
+    mockUseToolOperation.mock
+      .calls[0][0] as SingleFileToolOperationConfig<ChangePermissionsParameters>;
 
   const mockToolOperationReturn: ToolOperationHook<unknown> = {
     files: [],
     thumbnails: [],
     downloadUrl: null,
-    downloadFilename: '',
+    downloadFilename: "",
     isLoading: false,
     errorMessage: null,
-    status: '',
+    status: "",
     isGeneratingThumbnails: false,
     progress: null,
     executeOperation: vi.fn(),
@@ -84,37 +91,50 @@ describe('useChangePermissionsOperation', () => {
       preventPrinting: true,
       preventPrintingFaithful: true,
     },
-  ])('should create form data correctly', (testParameters: ChangePermissionsParameters) => {
-    renderHook(() => useChangePermissionsOperation());
+  ])(
+    "should create form data correctly",
+    (testParameters: ChangePermissionsParameters) => {
+      renderHook(() => useChangePermissionsOperation());
 
-    const callArgs = getToolConfig();
-    const buildFormData = callArgs.buildFormData;
+      const callArgs = getToolConfig();
+      const buildFormData = callArgs.buildFormData;
 
-    const testFile = new File(['test content'], 'test.pdf', { type: 'application/pdf' });
-    const formData = buildFormData(testParameters, testFile);
+      const testFile = new File(["test content"], "test.pdf", {
+        type: "application/pdf",
+      });
+      const formData = buildFormData(testParameters, testFile);
 
-    // Verify the form data contains the file
-    expect(formData.get('fileInput')).toBe(testFile);
+      // Verify the form data contains the file
+      expect(formData.get("fileInput")).toBe(testFile);
 
-    (Object.keys(testParameters) as Array<keyof ChangePermissionsParameters>).forEach(key => {
-      expect(formData.get(key), `Parameter ${key} should be set correctly`).toBe(testParameters[key].toString());
-    });
-  });
+      (
+        Object.keys(testParameters) as Array<keyof ChangePermissionsParameters>
+      ).forEach((key) => {
+        expect(
+          formData.get(key),
+          `Parameter ${key} should be set correctly`,
+        ).toBe(testParameters[key].toString());
+      });
+    },
+  );
 
-  test('should use correct translation for error messages', () => {
+  test("should use correct translation for error messages", () => {
     renderHook(() => useChangePermissionsOperation());
 
     expect(mockT).toHaveBeenCalledWith(
-      'changePermissions.error.failed',
-      'An error occurred while changing PDF permissions.'
+      "changePermissions.error.failed",
+      "An error occurred while changing PDF permissions.",
     );
   });
 
   test.each([
-    { property: 'toolType' as const, expectedValue: ToolType.singleFile },
-    { property: 'endpoint' as const, expectedValue: '/api/v1/security/add-password' },
-    { property: 'operationType' as const, expectedValue: 'changePermissions' }
-  ])('should configure $property correctly', ({ property, expectedValue }) => {
+    { property: "toolType" as const, expectedValue: ToolType.singleFile },
+    {
+      property: "endpoint" as const,
+      expectedValue: "/api/v1/security/add-password",
+    },
+    { property: "operationType" as const, expectedValue: "changePermissions" },
+  ])("should configure $property correctly", ({ property, expectedValue }) => {
     renderHook(() => useChangePermissionsOperation());
 
     const callArgs = getToolConfig();
diff --git a/frontend/src/core/hooks/tools/changePermissions/useChangePermissionsOperation.ts b/frontend/src/core/hooks/tools/changePermissions/useChangePermissionsOperation.ts
index e854b58655..0500d86417 100644
--- a/frontend/src/core/hooks/tools/changePermissions/useChangePermissionsOperation.ts
+++ b/frontend/src/core/hooks/tools/changePermissions/useChangePermissionsOperation.ts
@@ -1,17 +1,27 @@
-import { useTranslation } from 'react-i18next';
-import { ToolType, useToolOperation } from '@app/hooks/tools/shared/useToolOperation';
-import { createStandardErrorHandler } from '@app/utils/toolErrorHandler';
-import { ChangePermissionsParameters, defaultParameters } from '@app/hooks/tools/changePermissions/useChangePermissionsParameters';
+import { useTranslation } from "react-i18next";
+import {
+  ToolType,
+  useToolOperation,
+} from "@app/hooks/tools/shared/useToolOperation";
+import { createStandardErrorHandler } from "@app/utils/toolErrorHandler";
+import {
+  ChangePermissionsParameters,
+  defaultParameters,
+} from "@app/hooks/tools/changePermissions/useChangePermissionsParameters";
 
-export const getFormData = ((parameters: ChangePermissionsParameters) => {
+export const getFormData = (parameters: ChangePermissionsParameters) => {
   if (!parameters) return [];
-  return Object.entries(parameters).map(([key, value]) =>
-    [key, (value ?? false).toString()]
-  ) as string[][];
-});
+  return Object.entries(parameters).map(([key, value]) => [
+    key,
+    (value ?? false).toString(),
+  ]) as string[][];
+};
 
 // Static function that can be used by both the hook and automation executor
-export const buildChangePermissionsFormData = (parameters: ChangePermissionsParameters, file: File): FormData => {
+export const buildChangePermissionsFormData = (
+  parameters: ChangePermissionsParameters,
+  file: File,
+): FormData => {
   const formData = new FormData();
   formData.append("fileInput", file);
 
@@ -27,8 +37,8 @@ export const buildChangePermissionsFormData = (parameters: ChangePermissionsPara
 export const changePermissionsOperationConfig = {
   toolType: ToolType.singleFile,
   buildFormData: buildChangePermissionsFormData,
-  operationType: 'changePermissions',
-  endpoint: '/api/v1/security/add-password', // Change Permissions is a fake endpoint for the Add Password tool
+  operationType: "changePermissions",
+  endpoint: "/api/v1/security/add-password", // Change Permissions is a fake endpoint for the Add Password tool
   defaultParameters,
 } as const;
 
@@ -38,7 +48,10 @@ export const useChangePermissionsOperation = () => {
   return useToolOperation({
     ...changePermissionsOperationConfig,
     getErrorMessage: createStandardErrorHandler(
-      t('changePermissions.error.failed', 'An error occurred while changing PDF permissions.')
+      t(
+        "changePermissions.error.failed",
+        "An error occurred while changing PDF permissions.",
+      ),
     ),
   });
 };
diff --git a/frontend/src/core/hooks/tools/changePermissions/useChangePermissionsParameters.test.ts b/frontend/src/core/hooks/tools/changePermissions/useChangePermissionsParameters.test.ts
index 585f1c1725..3d62efb9b5 100644
--- a/frontend/src/core/hooks/tools/changePermissions/useChangePermissionsParameters.test.ts
+++ b/frontend/src/core/hooks/tools/changePermissions/useChangePermissionsParameters.test.ts
@@ -1,68 +1,74 @@
-import { describe, expect, test } from 'vitest';
-import { renderHook, act } from '@testing-library/react';
-import { useChangePermissionsParameters, defaultParameters, ChangePermissionsParameters } from '@app/hooks/tools/changePermissions/useChangePermissionsParameters';
+import { describe, expect, test } from "vitest";
+import { renderHook, act } from "@testing-library/react";
+import {
+  useChangePermissionsParameters,
+  defaultParameters,
+  ChangePermissionsParameters,
+} from "@app/hooks/tools/changePermissions/useChangePermissionsParameters";
 
-describe('useChangePermissionsParameters', () => {
-  test('should initialize with default parameters', () => {
+describe("useChangePermissionsParameters", () => {
+  test("should initialize with default parameters", () => {
     const { result } = renderHook(() => useChangePermissionsParameters());
 
     expect(result.current.parameters).toStrictEqual(defaultParameters);
   });
 
-  test('should update individual boolean parameters', () => {
+  test("should update individual boolean parameters", () => {
     const { result } = renderHook(() => useChangePermissionsParameters());
 
     act(() => {
-      result.current.updateParameter('preventAssembly', true);
+      result.current.updateParameter("preventAssembly", true);
     });
 
     expect(result.current.parameters.preventAssembly).toBe(true);
     expect(result.current.parameters.preventPrinting).toBe(false); // Other parameters should remain unchanged
 
     act(() => {
-      result.current.updateParameter('preventPrinting', true);
+      result.current.updateParameter("preventPrinting", true);
     });
 
     expect(result.current.parameters.preventPrinting).toBe(true);
     expect(result.current.parameters.preventAssembly).toBe(true);
   });
 
-  test('should update all permission parameters', () => {
+  test("should update all permission parameters", () => {
     const { result } = renderHook(() => useChangePermissionsParameters());
 
-    const permissionKeys = Object.keys(defaultParameters) as Array<keyof ChangePermissionsParameters>;
+    const permissionKeys = Object.keys(defaultParameters) as Array<
+      keyof ChangePermissionsParameters
+    >;
 
     // Set all to true
     act(() => {
-      permissionKeys.forEach(key => {
+      permissionKeys.forEach((key) => {
         result.current.updateParameter(key, true);
       });
     });
 
-    permissionKeys.forEach(key => {
+    permissionKeys.forEach((key) => {
       expect(result.current.parameters[key]).toBe(true);
     });
 
     // Set all to false
     act(() => {
-      permissionKeys.forEach(key => {
+      permissionKeys.forEach((key) => {
         result.current.updateParameter(key, false);
       });
     });
 
-    permissionKeys.forEach(key => {
+    permissionKeys.forEach((key) => {
       expect(result.current.parameters[key]).toBe(false);
     });
   });
 
-  test('should reset parameters to defaults', () => {
+  test("should reset parameters to defaults", () => {
     const { result } = renderHook(() => useChangePermissionsParameters());
 
     // First, change some parameters
     act(() => {
-      result.current.updateParameter('preventAssembly', true);
-      result.current.updateParameter('preventPrinting', true);
-      result.current.updateParameter('preventModify', true);
+      result.current.updateParameter("preventAssembly", true);
+      result.current.updateParameter("preventPrinting", true);
+      result.current.updateParameter("preventModify", true);
     });
 
     expect(result.current.parameters.preventAssembly).toBe(true);
@@ -77,13 +83,13 @@ describe('useChangePermissionsParameters', () => {
     expect(result.current.parameters).toStrictEqual(defaultParameters);
   });
 
-  test('should return correct endpoint name', () => {
+  test("should return correct endpoint name", () => {
     const { result } = renderHook(() => useChangePermissionsParameters());
 
-    expect(result.current.getEndpointName()).toBe('add-password');
+    expect(result.current.getEndpointName()).toBe("add-password");
   });
 
-  test('should always validate as true', () => {
+  test("should always validate as true", () => {
     const { result } = renderHook(() => useChangePermissionsParameters());
 
     // Default state should be valid
@@ -91,16 +97,18 @@ describe('useChangePermissionsParameters', () => {
 
     // Set some restrictions - should still be valid
     act(() => {
-      result.current.updateParameter('preventAssembly', true);
-      result.current.updateParameter('preventPrinting', true);
+      result.current.updateParameter("preventAssembly", true);
+      result.current.updateParameter("preventPrinting", true);
     });
 
     expect(result.current.validateParameters()).toBe(true);
 
     // Set all restrictions - should still be valid
     act(() => {
-      const permissionKeys = Object.keys(defaultParameters) as Array<keyof ChangePermissionsParameters>;
-      permissionKeys.forEach(key => {
+      const permissionKeys = Object.keys(defaultParameters) as Array<
+        keyof ChangePermissionsParameters
+      >;
+      permissionKeys.forEach((key) => {
         result.current.updateParameter(key, true);
       });
     });
diff --git a/frontend/src/core/hooks/tools/changePermissions/useChangePermissionsParameters.ts b/frontend/src/core/hooks/tools/changePermissions/useChangePermissionsParameters.ts
index 4a28df2a54..30220c13e3 100644
--- a/frontend/src/core/hooks/tools/changePermissions/useChangePermissionsParameters.ts
+++ b/frontend/src/core/hooks/tools/changePermissions/useChangePermissionsParameters.ts
@@ -1,5 +1,8 @@
-import { BaseParameters } from '@app/types/parameters';
-import { useBaseParameters, BaseParametersHook } from '@app/hooks/tools/shared/useBaseParameters';
+import { BaseParameters } from "@app/types/parameters";
+import {
+  useBaseParameters,
+  BaseParametersHook,
+} from "@app/hooks/tools/shared/useBaseParameters";
 
 export interface ChangePermissionsParameters extends BaseParameters {
   preventAssembly: boolean;
@@ -23,11 +26,13 @@ export const defaultParameters: ChangePermissionsParameters = {
   preventPrintingFaithful: false,
 };
 
-export type ChangePermissionsParametersHook = BaseParametersHook<ChangePermissionsParameters>;
+export type ChangePermissionsParametersHook =
+  BaseParametersHook<ChangePermissionsParameters>;
 
-export const useChangePermissionsParameters = (): ChangePermissionsParametersHook => {
-  return useBaseParameters({
-    defaultParameters,
-    endpointName: 'add-password', // Change Permissions is a fake endpoint for the Add Password tool
-  });
-};
+export const useChangePermissionsParameters =
+  (): ChangePermissionsParametersHook => {
+    return useBaseParameters({
+      defaultParameters,
+      endpointName: "add-password", // Change Permissions is a fake endpoint for the Add Password tool
+    });
+  };
diff --git a/frontend/src/core/hooks/tools/compare/operationUtils.ts b/frontend/src/core/hooks/tools/compare/operationUtils.ts
index 552ee8dd37..c1849ab9b3 100644
--- a/frontend/src/core/hooks/tools/compare/operationUtils.ts
+++ b/frontend/src/core/hooks/tools/compare/operationUtils.ts
@@ -1,15 +1,19 @@
-import { pdfWorkerManager } from '@app/services/pdfWorkerManager';
-import { appendWord as sharedAppendWord } from '@app/utils/textDiff';
-import { PARAGRAPH_SENTINEL } from '@app/types/compare';
-import type { StirlingFile } from '@app/types/fileContext';
-import type { PDFPageProxy, TextContent, TextItem } from 'pdfjs-dist/types/src/display/api';
+import { pdfWorkerManager } from "@app/services/pdfWorkerManager";
+import { appendWord as sharedAppendWord } from "@app/utils/textDiff";
+import { PARAGRAPH_SENTINEL } from "@app/types/compare";
+import type { StirlingFile } from "@app/types/fileContext";
+import type {
+  PDFPageProxy,
+  TextContent,
+  TextItem,
+} from "pdfjs-dist/types/src/display/api";
 import type {
   CompareChange,
   CompareDiffToken,
   CompareResultData,
   TokenBoundingBox,
   CompareParagraph,
-} from '@app/types/compare';
+} from "@app/types/compare";
 
 export interface TokenMetadata {
   page: number;
@@ -24,10 +28,15 @@ export interface ExtractedContent {
   paragraphs: CompareParagraph[];
 }
 
-const measurementCanvas = typeof document !== 'undefined' ? document.createElement('canvas') : null;
-const measurementContext = measurementCanvas ? measurementCanvas.getContext('2d') : null;
-const textMeasurementCache: Map<string, number> | null = measurementContext ? new Map() : null;
-let lastMeasurementFont = '';
+const measurementCanvas =
+  typeof document !== "undefined" ? document.createElement("canvas") : null;
+const measurementContext = measurementCanvas
+  ? measurementCanvas.getContext("2d")
+  : null;
+const textMeasurementCache: Map<string, number> | null = measurementContext
+  ? new Map()
+  : null;
+let lastMeasurementFont = "";
 
 const DEFAULT_CHAR_WIDTH = 1;
 const DEFAULT_SPACE_WIDTH = 0.33;
@@ -35,7 +44,7 @@ const DEFAULT_SPACE_WIDTH = 0.33;
 export const measureTextWidth = (fontSpec: string, text: string): number => {
   if (!measurementContext) {
     if (!text) return 0;
-    if (text === ' ') return DEFAULT_SPACE_WIDTH;
+    if (text === " ") return DEFAULT_SPACE_WIDTH;
     return text.length * DEFAULT_CHAR_WIDTH;
   }
 
@@ -57,7 +66,7 @@ export const measureTextWidth = (fontSpec: string, text: string): number => {
 
 export const appendWord = (existing: string, word: string) => {
   if (!existing) {
-    return sharedAppendWord('', word);
+    return sharedAppendWord("", word);
   }
   return sharedAppendWord(existing, word);
 };
@@ -65,14 +74,15 @@ export const appendWord = (existing: string, word: string) => {
 export const aggregateTotals = (tokens: CompareDiffToken[]) => {
   return tokens.reduce(
     (totals, token) => {
-      if (token.text === '\uE000PARA') { // PARAGRAPH_SENTINEL safeguard if serialized
+      if (token.text === "\uE000PARA") {
+        // PARAGRAPH_SENTINEL safeguard if serialized
         return totals;
       }
       switch (token.type) {
-        case 'added':
+        case "added":
           totals.added += 1;
           break;
-        case 'removed':
+        case "removed":
           totals.removed += 1;
           break;
         default:
@@ -80,14 +90,14 @@ export const aggregateTotals = (tokens: CompareDiffToken[]) => {
       }
       return totals;
     },
-    { added: 0, removed: 0, unchanged: 0 }
+    { added: 0, removed: 0, unchanged: 0 },
   );
 };
 
 export const buildChanges = (
   tokens: CompareDiffToken[],
   baseMetadata: TokenMetadata[],
-  comparisonMetadata: TokenMetadata[]
+  comparisonMetadata: TokenMetadata[],
 ): CompareChange[] => {
   const changes: CompareChange[] = [];
   let baseIndex = 0;
@@ -116,7 +126,10 @@ export const buildChanges = (
         current.comparison.text = current.comparison.text.trim();
       }
 
-      if ((current.base?.text && current.base.text.length > 0) || (current.comparison?.text && current.comparison.text.length > 0)) {
+      if (
+        (current.base?.text && current.base.text.length > 0) ||
+        (current.comparison?.text && current.comparison.text.length > 0)
+      ) {
         changes.push(current);
       }
     }
@@ -126,7 +139,7 @@ export const buildChanges = (
   };
 
   for (const token of tokens) {
-    if (token.type === 'removed') {
+    if (token.type === "removed") {
       const meta = baseMetadata[baseIndex] ?? null;
       const active = ensureCurrent();
       const paragraph = meta?.paragraph ?? null;
@@ -170,7 +183,7 @@ export const buildChanges = (
       continue;
     }
 
-    if (token.type === 'added') {
+    if (token.type === "added") {
       const meta = comparisonMetadata[comparisonIndex] ?? null;
       const active = ensureCurrent();
       const paragraph = meta?.paragraph ?? null;
@@ -196,7 +209,10 @@ export const buildChanges = (
             paragraph: paragraph,
           };
         } else {
-          active.comparison.text = appendWord(active.comparison.text, token.text);
+          active.comparison.text = appendWord(
+            active.comparison.text,
+            token.text,
+          );
         }
         if (meta && active.comparison.page === null) {
           active.comparison.page = meta.page;
@@ -253,15 +269,21 @@ export const createSummaryFile = (result: CompareResultData): File => {
     warnings: result.warnings,
   };
 
-  const filename = `compare-summary-${new Date(result.totals.processedAt).toISOString().replace(/[:.]/g, '-')}.json`;
-  return new File([JSON.stringify(exportPayload, null, 2)], filename, { type: 'application/json' });
+  const filename = `compare-summary-${new Date(result.totals.processedAt).toISOString().replace(/[:.]/g, "-")}.json`;
+  return new File([JSON.stringify(exportPayload, null, 2)], filename, {
+    type: "application/json",
+  });
 };
 
 export const clamp = (value: number): number => Math.min(1, Math.max(0, value));
 
-export const getWorkerErrorCode = (value: unknown): 'EMPTY_TEXT' | 'TOO_LARGE' | 'TOO_DISSIMILAR' | undefined => {
-  if (typeof value === 'object' && value !== null && 'code' in value) {
-    const potentialCode = (value as { code?: 'EMPTY_TEXT' | 'TOO_LARGE' | 'TOO_DISSIMILAR' }).code;
+export const getWorkerErrorCode = (
+  value: unknown,
+): "EMPTY_TEXT" | "TOO_LARGE" | "TOO_DISSIMILAR" | undefined => {
+  if (typeof value === "object" && value !== null && "code" in value) {
+    const potentialCode = (
+      value as { code?: "EMPTY_TEXT" | "TOO_LARGE" | "TOO_DISSIMILAR" }
+    ).code;
     return potentialCode;
   }
   return undefined;
@@ -272,13 +294,18 @@ export const getWorkerErrorCode = (value: unknown): 'EMPTY_TEXT' | 'TOO_LARGE' |
 export const filterTokensForDiff = (
   tokens: string[],
   metadata: TokenMetadata[],
-): { tokens: string[]; metadata: TokenMetadata[]; filteredToOriginal: number[] } => {
+): {
+  tokens: string[];
+  metadata: TokenMetadata[];
+  filteredToOriginal: number[];
+} => {
   const outTokens: string[] = [];
   const outMeta: TokenMetadata[] = [];
   const map: number[] = [];
   for (let i = 0; i < tokens.length; i += 1) {
     const t = tokens[i];
-    const isPara = t === PARAGRAPH_SENTINEL || t.startsWith('\uE000') || t.includes('PARA');
+    const isPara =
+      t === PARAGRAPH_SENTINEL || t.startsWith("\uE000") || t.includes("PARA");
     if (!isPara) {
       outTokens.push(t);
       if (metadata[i]) outMeta.push(metadata[i]);
@@ -288,7 +315,9 @@ export const filterTokensForDiff = (
   return { tokens: outTokens, metadata: outMeta, filteredToOriginal: map };
 };
 
-export const extractContentFromPdf = async (file: StirlingFile): Promise<ExtractedContent> => {
+export const extractContentFromPdf = async (
+  file: StirlingFile,
+): Promise<ExtractedContent> => {
   const arrayBuffer = await file.arrayBuffer();
   const pdfDoc = await pdfWorkerManager.createDocument(arrayBuffer, {
     disableAutoFetch: true,
@@ -305,28 +334,31 @@ export const extractContentFromPdf = async (file: StirlingFile): Promise<Extract
       const viewport = page.getViewport({ scale: 1 });
       const content: TextContent = await page.getTextContent({
         disableCombineTextItems: true,
-      } as Parameters<PDFPageProxy['getTextContent']>[0]);
-      const styles: Record<string, { fontFamily?: string; ascent?: number; descent?: number }> = content.styles ?? {};
+      } as Parameters<PDFPageProxy["getTextContent"]>[0]);
+      const styles: Record<
+        string,
+        { fontFamily?: string; ascent?: number; descent?: number }
+      > = content.styles ?? {};
 
       let paragraphIndex = 1;
-      let paragraphBuffer = '';
+      let paragraphBuffer = "";
       let prevItem: TextItem | null = null;
 
       pageSizes.push({ width: viewport.width, height: viewport.height });
 
       const normalizeToken = (s: string) =>
         s
-          .normalize('NFKC')
-          .replace(/[\u00AD\u200B-\u200F\u202A-\u202E]/g, '')
+          .normalize("NFKC")
+          .replace(/[\u00AD\u200B-\u200F\u202A-\u202E]/g, "")
           .replace(/[“�]/g, '"')
           .replace(/[‘’]/g, "'")
-          .replace(/[–—]/g, '-')
-          .replace(/\u00A0/g, ' ')
-          .replace(/\s+/g, ' ')
+          .replace(/[–—]/g, "-")
+          .replace(/\u00A0/g, " ")
+          .replace(/\s+/g, " ")
           .trim();
 
       const isParagraphBreak = (curr: TextItem, prev: TextItem | null) => {
-        const hasHardBreak = 'hasEOL' in curr && (curr as TextItem).hasEOL;
+        const hasHardBreak = "hasEOL" in curr && (curr as TextItem).hasEOL;
         if (hasHardBreak) return true;
         if (!prev) return false;
         const prevY = prev.transform[5];
@@ -334,13 +366,21 @@ export const extractContentFromPdf = async (file: StirlingFile): Promise<Extract
         const dy = Math.abs(currY - prevY);
         const currX = curr.transform[4];
         const prevX = prev.transform[4];
-        const approxLine = Math.max(10, Math.abs((curr as any).height ?? 0) * 0.9);
+        const approxLine = Math.max(
+          10,
+          Math.abs((curr as any).height ?? 0) * 0.9,
+        );
         const looksLikeParagraph = dy > approxLine * 1.8;
         const likelySoftWrap = currX < prevX && dy < approxLine * 0.6;
         return looksLikeParagraph && !likelySoftWrap;
       };
 
-      const adjustBoundingBox = (left: number, top: number, width: number, height: number): TokenBoundingBox | null => {
+      const adjustBoundingBox = (
+        left: number,
+        top: number,
+        width: number,
+        height: number,
+      ): TokenBoundingBox | null => {
         if (width <= 0 || height <= 0) {
           return null;
         }
@@ -351,8 +391,14 @@ export const extractContentFromPdf = async (file: StirlingFile): Promise<Extract
         const MIN_VERTICAL_PAD = 0.0008;
         const VERTICAL_PAD_RATIO = 0.18;
 
-        const horizontalPad = Math.max(width * HORIZONTAL_PAD_RATIO, MIN_HORIZONTAL_PAD);
-        const verticalPad = Math.max(height * VERTICAL_PAD_RATIO, MIN_VERTICAL_PAD);
+        const horizontalPad = Math.max(
+          width * HORIZONTAL_PAD_RATIO,
+          MIN_HORIZONTAL_PAD,
+        );
+        const verticalPad = Math.max(
+          height * VERTICAL_PAD_RATIO,
+          MIN_VERTICAL_PAD,
+        );
 
         let expandedLeft = left - horizontalPad;
         let expandedRight = left + width + horizontalPad;
@@ -391,31 +437,37 @@ export const extractContentFromPdf = async (file: StirlingFile): Promise<Extract
         const rawText = item.str;
         const totalLen = Math.max(rawText.length, 1);
         const textStyle = item.fontName ? styles[item.fontName] : undefined;
-        const fontFamily = textStyle?.fontFamily ?? 'sans-serif';
-        const fontScale = Math.max(0.5, Math.hypot(item.transform[0], item.transform[1]) || 0);
+        const fontFamily = textStyle?.fontFamily ?? "sans-serif";
+        const fontScale = Math.max(
+          0.5,
+          Math.hypot(item.transform[0], item.transform[1]) || 0,
+        );
         const fontSpec = `${fontScale}px ${fontFamily}`;
 
         const weights: number[] = new Array(totalLen);
-        let runningText = '';
+        let runningText = "";
         let previousAdvance = 0;
         for (let i = 0; i < totalLen; i += 1) {
           runningText += rawText[i];
           const advance = measureTextWidth(fontSpec, runningText);
           let width = advance - previousAdvance;
           if (!Number.isFinite(width) || width <= 0) {
-            width = rawText[i] === ' ' ? DEFAULT_SPACE_WIDTH : DEFAULT_CHAR_WIDTH;
+            width =
+              rawText[i] === " " ? DEFAULT_SPACE_WIDTH : DEFAULT_CHAR_WIDTH;
           }
           weights[i] = width;
           previousAdvance = advance;
         }
         if (!Number.isFinite(previousAdvance) || previousAdvance <= 0) {
           for (let i = 0; i < totalLen; i += 1) {
-            weights[i] = rawText[i] === ' ' ? DEFAULT_SPACE_WIDTH : DEFAULT_CHAR_WIDTH;
+            weights[i] =
+              rawText[i] === " " ? DEFAULT_SPACE_WIDTH : DEFAULT_CHAR_WIDTH;
           }
         }
         const prefix: number[] = new Array(totalLen + 1);
         prefix[0] = 0;
-        for (let i = 0; i < totalLen; i += 1) prefix[i + 1] = prefix[i] + weights[i];
+        for (let i = 0; i < totalLen; i += 1)
+          prefix[i + 1] = prefix[i] + weights[i];
         const totalWeight = prefix[totalLen] || 1;
 
         const rawX = item.transform[4];
@@ -424,7 +476,10 @@ export const extractContentFromPdf = async (file: StirlingFile): Promise<Extract
           viewport.convertToViewportPoint(rawX, rawY),
           viewport.convertToViewportPoint(rawX + item.width, rawY),
           viewport.convertToViewportPoint(rawX, rawY + item.height),
-          viewport.convertToViewportPoint(rawX + item.width, rawY + item.height),
+          viewport.convertToViewportPoint(
+            rawX + item.width,
+            rawY + item.height,
+          ),
         ];
         const xs = transformed.map(([px]) => px);
         const ys = transformed.map(([, py]) => py);
@@ -433,7 +488,12 @@ export const extractContentFromPdf = async (file: StirlingFile): Promise<Extract
         const top = Math.min(...ys);
         const bottom = Math.max(...ys);
 
-        if (!Number.isFinite(left) || !Number.isFinite(right) || !Number.isFinite(top) || !Number.isFinite(bottom)) {
+        if (
+          !Number.isFinite(left) ||
+          !Number.isFinite(right) ||
+          !Number.isFinite(top) ||
+          !Number.isFinite(bottom)
+        ) {
           prevItem = item;
           continue;
         }
@@ -447,13 +507,26 @@ export const extractContentFromPdf = async (file: StirlingFile): Promise<Extract
           verticalEnd[0] - baselineStart[0],
           verticalEnd[1] - baselineStart[1],
         ];
-        const baselineMagnitude = Math.hypot(baselineVector[0], baselineVector[1]);
-        const verticalMagnitude = Math.hypot(verticalVector[0], verticalVector[1]);
-        const hasOrientationVectors = baselineMagnitude > 1e-6 && verticalMagnitude > 1e-6;
+        const baselineMagnitude = Math.hypot(
+          baselineVector[0],
+          baselineVector[1],
+        );
+        const verticalMagnitude = Math.hypot(
+          verticalVector[0],
+          verticalVector[1],
+        );
+        const hasOrientationVectors =
+          baselineMagnitude > 1e-6 && verticalMagnitude > 1e-6;
 
         const font = item.fontName ? styles[item.fontName] : undefined;
-        const ascent = typeof font?.ascent === 'number' ? Math.max(0.7, Math.min(1.1, font.ascent)) : 0.9;
-        const descent = typeof font?.descent === 'number' ? Math.max(0.0, Math.min(0.5, Math.abs(font.descent))) : 0.2;
+        const ascent =
+          typeof font?.ascent === "number"
+            ? Math.max(0.7, Math.min(1.1, font.ascent))
+            : 0.9;
+        const descent =
+          typeof font?.descent === "number"
+            ? Math.max(0.0, Math.min(0.5, Math.abs(font.descent)))
+            : 0.2;
         const verticalScale = Math.min(1, Math.max(0.75, ascent + descent));
 
         const wordRegex = /[A-Za-z0-9]+|[^\sA-Za-z0-9]/g;
@@ -486,7 +559,10 @@ export const extractContentFromPdf = async (file: StirlingFile): Promise<Extract
             ];
             const cornerPoints: Array<[number, number]> = [
               segStart,
-              [segStart[0] + verticalVector[0], segStart[1] + verticalVector[1]],
+              [
+                segStart[0] + verticalVector[0],
+                segStart[1] + verticalVector[1],
+              ],
               [segEnd[0] + verticalVector[0], segEnd[1] + verticalVector[1]],
               segEnd,
             ];
@@ -519,14 +595,24 @@ export const extractContentFromPdf = async (file: StirlingFile): Promise<Extract
             const newTop = clamp(midY - half);
             const newBottom = clamp(midY + half);
             wordHeight = Math.max(0, newBottom - newTop);
-            const bbox = adjustBoundingBox(wordLeft, newTop, wordWidth, wordHeight);
+            const bbox = adjustBoundingBox(
+              wordLeft,
+              newTop,
+              wordWidth,
+              wordHeight,
+            );
             tokens.push(normalizedWord);
             metadata.push({ page: pageIndex, paragraph: paragraphIndex, bbox });
             paragraphBuffer = appendWord(paragraphBuffer, normalizedWord);
             continue;
           }
 
-          const bbox = adjustBoundingBox(wordLeft, wordTop, wordWidth, wordHeight);
+          const bbox = adjustBoundingBox(
+            wordLeft,
+            wordTop,
+            wordWidth,
+            wordHeight,
+          );
 
           tokens.push(normalizedWord);
           metadata.push({
@@ -540,21 +626,37 @@ export const extractContentFromPdf = async (file: StirlingFile): Promise<Extract
 
         if (isParagraphBreak(item as TextItem, prevItem)) {
           if (paragraphBuffer.trim().length > 0) {
-            paragraphs.push({ page: pageIndex, paragraph: paragraphIndex, text: paragraphBuffer.trim() });
-            paragraphBuffer = '';
+            paragraphs.push({
+              page: pageIndex,
+              paragraph: paragraphIndex,
+              text: paragraphBuffer.trim(),
+            });
+            paragraphBuffer = "";
           }
-          tokens.push('\uE000PARA');
-          metadata.push({ page: pageIndex, paragraph: paragraphIndex, bbox: null });
+          tokens.push("\uE000PARA");
+          metadata.push({
+            page: pageIndex,
+            paragraph: paragraphIndex,
+            bbox: null,
+          });
           paragraphIndex += 1;
         }
         prevItem = item as TextItem;
       }
 
       if (paragraphBuffer.trim().length > 0) {
-        paragraphs.push({ page: pageIndex, paragraph: paragraphIndex, text: paragraphBuffer.trim() });
-        paragraphBuffer = '';
-        tokens.push('\uE000PARA');
-        metadata.push({ page: pageIndex, paragraph: paragraphIndex, bbox: null });
+        paragraphs.push({
+          page: pageIndex,
+          paragraph: paragraphIndex,
+          text: paragraphBuffer.trim(),
+        });
+        paragraphBuffer = "";
+        tokens.push("\uE000PARA");
+        metadata.push({
+          page: pageIndex,
+          paragraph: paragraphIndex,
+          bbox: null,
+        });
       }
     }
     return { tokens, metadata, pageSizes, paragraphs };
@@ -562,5 +664,3 @@ export const extractContentFromPdf = async (file: StirlingFile): Promise<Extract
     pdfWorkerManager.destroyDocument(pdfDoc);
   }
 };
-
-
diff --git a/frontend/src/core/hooks/tools/compare/useCompareOperation.ts b/frontend/src/core/hooks/tools/compare/useCompareOperation.ts
index 0dd3706f05..cee12c8511 100644
--- a/frontend/src/core/hooks/tools/compare/useCompareOperation.ts
+++ b/frontend/src/core/hooks/tools/compare/useCompareOperation.ts
@@ -1,7 +1,8 @@
-import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
-import { useTranslation } from 'react-i18next';
+import { useCallback, useEffect, useMemo, useRef, useState } from "react";
+import { useTranslation } from "react-i18next";
 import {
   ADDITION_HIGHLIGHT,
+  CompareAnyResult,
   CompareDiffToken,
   CompareFilteredTokenInfo,
   CompareResultData,
@@ -9,11 +10,15 @@ import {
   CompareWorkerResponse,
   CompareWorkerWarnings,
   REMOVAL_HIGHLIGHT,
-} from '@app/types/compare';
-import { CompareParameters } from '@app/hooks/tools/compare/useCompareParameters';
-import { ToolOperationHook } from '@app/hooks/tools/shared/useToolOperation';
-import type { StirlingFile } from '@app/types/fileContext';
-import { useFileContext } from '@app/contexts/file/fileHooks';
+} from "@app/types/compare";
+import {
+  runPixelCompare,
+  revokePixelResult,
+} from "@app/services/pixelCompareService";
+import { CompareParameters } from "@app/hooks/tools/compare/useCompareParameters";
+import { ToolOperationHook } from "@app/hooks/tools/shared/useToolOperation";
+import type { StirlingFile } from "@app/types/fileContext";
+import { useFileContext } from "@app/contexts/file/fileHooks";
 import {
   aggregateTotals,
   buildChanges,
@@ -21,15 +26,16 @@ import {
   extractContentFromPdf,
   getWorkerErrorCode,
   filterTokensForDiff,
-} from '@app/hooks/tools/compare/operationUtils';
-import { alert, dismissToast } from '@app/components/toast';
-import type { ToastLocation } from '@app/components/toast/types';
-import CompareWorkerCtor from '@app/workers/compareWorker?worker';
+} from "@app/hooks/tools/compare/operationUtils";
+import { alert, dismissToast } from "@app/components/toast";
+import type { ToastLocation } from "@app/components/toast/types";
+import CompareWorkerCtor from "@app/workers/compareWorker?worker";
 const LONG_RUNNING_PAGE_THRESHOLD = 2000;
 
 export interface CompareOperationHook extends ToolOperationHook<CompareParameters> {
-  result: CompareResultData | null;
+  result: CompareAnyResult | null;
   warnings: string[];
+  pixelProgress: { current: number; total: number } | null;
 }
 
 // extractContentFromPdf moved to utils
@@ -42,16 +48,37 @@ export const useCompareOperation = (): CompareOperationHook => {
   const activeRunIdRef = useRef(0);
   const cancelledRef = useRef(false);
 
-  type OperationStatus = 'idle' | 'extracting' | 'processing' | 'complete' | 'cancelled' | 'error';
+  type OperationStatus =
+    | "idle"
+    | "extracting"
+    | "processing"
+    | "complete"
+    | "cancelled"
+    | "error";
   const [isLoading, setIsLoading] = useState(false);
-  const [statusState, setStatusState] = useState<OperationStatus>('idle');
+  const [statusState, setStatusState] = useState<OperationStatus>("idle");
   const [statusDetailMs, setStatusDetailMs] = useState<number | null>(null);
   const [errorMessage, setErrorMessage] = useState<string | null>(null);
   const [files, setFiles] = useState<File[]>([]);
   const [downloadUrl, setDownloadUrl] = useState<string | null>(null);
-  const [downloadFilename, setDownloadFilename] = useState('');
-  const [result, setResult] = useState<CompareResultData | null>(null);
+  const [downloadFilename, setDownloadFilename] = useState("");
+  const [result, setResult] = useState<CompareAnyResult | null>(null);
   const [warnings, setWarnings] = useState<string[]>([]);
+  const [pixelProgress, setPixelProgress] = useState<{
+    current: number;
+    total: number;
+  } | null>(null);
+  const pixelSignalRef = useRef<{ cancelled: boolean }>({ cancelled: false });
+  const pixelResultRef = useRef<
+    import("@app/types/compare").CompareResultPixelData | null
+  >(null);
+
+  const revokePixelUrls = useCallback(() => {
+    if (pixelResultRef.current) {
+      revokePixelResult(pixelResultRef.current);
+      pixelResultRef.current = null;
+    }
+  }, []);
   const longRunningToastIdRef = useRef<string | null>(null);
   const dissimilarityToastIdRef = useRef<string | null>(null);
   const dissimilarityToastShownRef = useRef<boolean>(false);
@@ -71,28 +98,39 @@ export const useCompareOperation = (): CompareOperationHook => {
   }, []);
 
   const resetResults = useCallback(() => {
+    revokePixelUrls();
     setResult(null);
     setWarnings([]);
     setFiles([]);
+    setPixelProgress(null);
     cleanupDownloadUrl();
     setDownloadUrl(null);
-    setDownloadFilename('');
-    setStatusState('idle');
+    setDownloadFilename("");
+    setStatusState("idle");
     setStatusDetailMs(null);
     setErrorMessage(null);
-  }, [cleanupDownloadUrl]);
+  }, [cleanupDownloadUrl, revokePixelUrls]);
 
   const clearError = useCallback(() => {
     setErrorMessage(null);
   }, []);
 
   const runCompareWorker = useCallback(
-    async (baseTokens: string[], comparisonTokens: string[], warningMessages: CompareWorkerWarnings, onChunk?: (chunk: CompareDiffToken[]) => void) => {
+    async (
+      baseTokens: string[],
+      comparisonTokens: string[],
+      warningMessages: CompareWorkerWarnings,
+      onChunk?: (chunk: CompareDiffToken[]) => void,
+    ) => {
       const worker = ensureWorker();
 
       return await new Promise<{
         tokens: CompareDiffToken[];
-        stats: { baseWordCount: number; comparisonWordCount: number; durationMs: number };
+        stats: {
+          baseWordCount: number;
+          comparisonWordCount: number;
+          durationMs: number;
+        };
         warnings: string[];
       }>((resolve, reject) => {
         const collectedWarnings: string[] = [];
@@ -101,7 +139,11 @@ export const useCompareOperation = (): CompareOperationHook => {
         const handleMessage = (event: MessageEvent<CompareWorkerResponse>) => {
           if (cancelledRef.current) {
             cleanup();
-            reject(Object.assign(new Error('Operation cancelled'), { code: 'CANCELLED' as const }));
+            reject(
+              Object.assign(new Error("Operation cancelled"), {
+                code: "CANCELLED" as const,
+              }),
+            );
             return;
           }
           const message = event.data;
@@ -110,14 +152,14 @@ export const useCompareOperation = (): CompareOperationHook => {
           }
 
           switch (message.type) {
-            case 'chunk': {
+            case "chunk": {
               if (message.tokens.length > 0) {
                 collectedTokens.push(...message.tokens);
                 onChunk?.(message.tokens);
               }
               break;
             }
-            case 'success':
+            case "success":
               cleanup();
               if (longRunningToastIdRef.current) {
                 dismissToast(longRunningToastIdRef.current);
@@ -129,16 +171,18 @@ export const useCompareOperation = (): CompareOperationHook => {
                 warnings: collectedWarnings,
               });
               break;
-            case 'warning':
+            case "warning":
               collectedWarnings.push(message.message);
               break;
-            case 'error': {
+            case "error": {
               cleanup();
               if (longRunningToastIdRef.current) {
                 dismissToast(longRunningToastIdRef.current);
                 longRunningToastIdRef.current = null;
               }
-              const error: Error & { code?: 'EMPTY_TEXT' | 'TOO_LARGE' | 'TOO_DISSIMILAR' } = new Error(message.message);
+              const error: Error & {
+                code?: "EMPTY_TEXT" | "TOO_LARGE" | "TOO_DISSIMILAR";
+              } = new Error(message.message);
               error.code = message.code;
               reject(error);
               break;
@@ -151,22 +195,26 @@ export const useCompareOperation = (): CompareOperationHook => {
         const handleError = (event: ErrorEvent) => {
           cleanup();
           if (cancelledRef.current) {
-            reject(Object.assign(new Error('Operation cancelled'), { code: 'CANCELLED' as const }));
+            reject(
+              Object.assign(new Error("Operation cancelled"), {
+                code: "CANCELLED" as const,
+              }),
+            );
           } else {
             reject(event.error ?? new Error(event.message));
           }
         };
 
         const cleanup = () => {
-          worker.removeEventListener('message', handleMessage as EventListener);
-          worker.removeEventListener('error', handleError as EventListener);
+          worker.removeEventListener("message", handleMessage as EventListener);
+          worker.removeEventListener("error", handleError as EventListener);
         };
 
-        worker.addEventListener('message', handleMessage as EventListener);
-        worker.addEventListener('error', handleError as EventListener);
+        worker.addEventListener("message", handleMessage as EventListener);
+        worker.addEventListener("error", handleError as EventListener);
 
         const request: CompareWorkerRequest = {
-          type: 'compare',
+          type: "compare",
           payload: {
             baseTokens,
             comparisonTokens,
@@ -183,7 +231,7 @@ export const useCompareOperation = (): CompareOperationHook => {
         worker.postMessage(request);
       });
     },
-    [ensureWorker]
+    [ensureWorker],
   );
 
   const executeOperation = useCallback(
@@ -192,44 +240,123 @@ export const useCompareOperation = (): CompareOperationHook => {
       const runId = ++activeRunIdRef.current;
       cancelledRef.current = false;
       if (!params.baseFileId || !params.comparisonFileId) {
-        setErrorMessage(t('compare.error.selectRequired', 'Select the original and edited document.'));
+        setErrorMessage(
+          t(
+            "compare.error.selectRequired",
+            "Select the original and edited document.",
+          ),
+        );
         return;
       }
 
-      const baseFile = selectedFiles.find((file) => file.fileId === params.baseFileId)
-        ?? selectors.getFile(params.baseFileId);
-      const comparisonFile = selectedFiles.find((file) => file.fileId === params.comparisonFileId)
-        ?? selectors.getFile(params.comparisonFileId);
+      const baseFile =
+        selectedFiles.find((file) => file.fileId === params.baseFileId) ??
+        selectors.getFile(params.baseFileId);
+      const comparisonFile =
+        selectedFiles.find((file) => file.fileId === params.comparisonFileId) ??
+        selectors.getFile(params.comparisonFileId);
 
       if (!baseFile || !comparisonFile) {
-        setErrorMessage(t('compare.error.filesMissing', 'Unable to locate the selected files. Please re-select them.'));
+        setErrorMessage(
+          t(
+            "compare.error.filesMissing",
+            "Unable to locate the selected files. Please re-select them.",
+          ),
+        );
         return;
       }
 
       setIsLoading(true);
-      setStatusState('extracting');
+      setStatusState("extracting");
       setStatusDetailMs(null);
       setErrorMessage(null);
       setWarnings([]);
+      revokePixelUrls();
       setResult(null);
       setFiles([]);
+      setPixelProgress(null);
       cleanupDownloadUrl();
       setDownloadUrl(null);
-      setDownloadFilename('');
+      setDownloadFilename("");
+
+      if (params.mode === "pixel") {
+        const operationStartPx = performance.now();
+        pixelSignalRef.current = { cancelled: false };
+        try {
+          setStatusState("processing");
+          const pixelResult = await runPixelCompare({
+            baseFile,
+            comparisonFile,
+            baseFileId: baseFile.fileId,
+            comparisonFileId: comparisonFile.fileId,
+            dpi: params.pixelDpi,
+            threshold: params.pixelThreshold,
+            onProgress: (current, total) => {
+              if (activeRunIdRef.current === runId)
+                setPixelProgress({ current, total });
+            },
+            signal: pixelSignalRef.current,
+            warnings: {
+              pageCountMismatch: t(
+                "compare.pixel.warnings.pageCountMismatch",
+                "Page count mismatch: original has {{base}} page(s), edited has {{comparison}}. Extra pages are shown one-sided and marked as fully removed/added.",
+              ),
+              noPages: t(
+                "compare.pixel.warnings.noPages",
+                "One or both documents have no pages.",
+              ),
+            },
+            errors: {
+              canvasContextUnavailable: t(
+                "compare.pixel.errors.canvasContextUnavailable",
+                "Unable to acquire 2D canvas context for pixel comparison.",
+              ),
+            },
+          });
+          if (cancelledRef.current || activeRunIdRef.current !== runId) {
+            revokePixelResult(pixelResult);
+            return;
+          }
+          pixelResultRef.current = pixelResult;
+          setResult(pixelResult);
+          setWarnings(pixelResult.warnings);
+          setStatusState("complete");
+        } catch (error: unknown) {
+          if (error instanceof Error && error.message === "CANCELLED") {
+            setStatusState("cancelled");
+          } else {
+            console.error("[compare] pixel operation failed", error);
+            const fallback = t(
+              "compare.error.generic",
+              "Unable to compare these files.",
+            );
+            setErrorMessage(
+              error instanceof Error && error.message
+                ? error.message
+                : fallback,
+            );
+          }
+        } finally {
+          setStatusDetailMs(Math.round(performance.now() - operationStartPx));
+          setIsLoading(false);
+          setPixelProgress(null);
+        }
+        return;
+      }
 
       const warningMessages: CompareWorkerWarnings = {
         // No accuracy warning any more
         tooLargeMessage: t(
-          'compare.large.file.message',
-          'These documents are very large; comparison may take several minutes. Please keep this tab open.'
+          "compare.large.file.message",
+          "These documents are very large; comparison may take several minutes. Please keep this tab open.",
         ),
         emptyTextMessage: t(
-          'compare.no.text.message',
-          'One or both of the selected PDFs have no text content. Please choose PDFs with text for comparison.'
+          "compare.no.text.message",
+          "One or both of the selected PDFs have no text content. Please choose PDFs with text for comparison.",
         ),
         tooDissimilarMessage: t(
-          'compare.too.dissimilar.message',
-          'These documents appear highly dissimilar. Comparison was stopped to save time.'
+          "compare.too.dissimilar.message",
+          "These documents appear highly dissimilar. Comparison was stopped to save time.",
         ),
       };
 
@@ -243,31 +370,43 @@ export const useCompareOperation = (): CompareOperationHook => {
 
         if (cancelledRef.current || activeRunIdRef.current !== runId) return;
 
-        if (baseContent.tokens.length === 0 || comparisonContent.tokens.length === 0) {
-          throw Object.assign(new Error(warningMessages.emptyTextMessage), { code: 'EMPTY_TEXT' });
+        if (
+          baseContent.tokens.length === 0 ||
+          comparisonContent.tokens.length === 0
+        ) {
+          throw Object.assign(new Error(warningMessages.emptyTextMessage), {
+            code: "EMPTY_TEXT",
+          });
         }
 
-        setStatusState('processing');
+        setStatusState("processing");
 
         // Filter out paragraph sentinels before diffing to avoid large false-positive runs
-        const baseFiltered = filterTokensForDiff(baseContent.tokens, baseContent.metadata);
-        const comparisonFiltered = filterTokensForDiff(comparisonContent.tokens, comparisonContent.metadata);
+        const baseFiltered = filterTokensForDiff(
+          baseContent.tokens,
+          baseContent.metadata,
+        );
+        const comparisonFiltered = filterTokensForDiff(
+          comparisonContent.tokens,
+          comparisonContent.metadata,
+        );
 
         const combinedPageCount =
-          (baseContent.pageSizes?.length ?? 0) + (comparisonContent.pageSizes?.length ?? 0);
+          (baseContent.pageSizes?.length ?? 0) +
+          (comparisonContent.pageSizes?.length ?? 0);
 
         if (
           combinedPageCount >= LONG_RUNNING_PAGE_THRESHOLD &&
           !longRunningToastIdRef.current
         ) {
           const toastId = alert({
-            alertType: 'neutral',
-            title: t('compare.longJob.title', 'Large comparison in progress'),
+            alertType: "neutral",
+            title: t("compare.longJob.title", "Large comparison in progress"),
             body: t(
-              'compare.longJob.body',
-              'These PDFs together exceed 2,000 pages. Processing can take several minutes.'
+              "compare.longJob.body",
+              "These PDFs together exceed 2,000 pages. Processing can take several minutes.",
             ),
-            location: 'bottom-right' as ToastLocation,
+            location: "bottom-right" as ToastLocation,
             isPersistentPopup: true,
             expandable: false,
           });
@@ -276,29 +415,43 @@ export const useCompareOperation = (): CompareOperationHook => {
 
         // Heuristic: surface an early warning toast when we observe a very high ratio of differences
         const EARLY_TOAST_MIN_TOKENS = 15000; // wait for some signal before warning
-        const EARLY_TOAST_DIFF_RATIO = 0.8;   // 80% added/removed vs unchanged
+        const EARLY_TOAST_DIFF_RATIO = 0.8; // 80% added/removed vs unchanged
         let observedAddedRemoved = 0;
         let observedUnchanged = 0;
 
         const handleEarlyDissimilarity = () => {
-          if (dissimilarityToastShownRef.current || dissimilarityToastIdRef.current) return;
+          if (
+            dissimilarityToastShownRef.current ||
+            dissimilarityToastIdRef.current
+          )
+            return;
           const toastId = alert({
-            alertType: 'warning',
-            title: t('compare.earlyDissimilarity.title', 'These PDFs look highly different'),
-            body: t(
-              'compare.earlyDissimilarity.body',
-              "We're seeing very few similarities so far. You can stop the comparison if these aren't related documents."
+            alertType: "warning",
+            title: t(
+              "compare.earlyDissimilarity.title",
+              "These PDFs look highly different",
             ),
-            location: 'bottom-right' as ToastLocation,
+            body: t(
+              "compare.earlyDissimilarity.body",
+              "We're seeing very few similarities so far. You can stop the comparison if these aren't related documents.",
+            ),
+            location: "bottom-right" as ToastLocation,
             isPersistentPopup: true,
             expandable: false,
-            buttonText: t('compare.earlyDissimilarity.stopButton', 'Stop comparison'),
+            buttonText: t(
+              "compare.earlyDissimilarity.stopButton",
+              "Stop comparison",
+            ),
             buttonCallback: () => {
-              try { cancelOperation(); } catch {
-                console.error('Failed to cancel operation');
+              try {
+                cancelOperation();
+              } catch {
+                console.error("Failed to cancel operation");
               }
-              try { window.dispatchEvent(new CustomEvent('compare:clear-selected')); } catch {
-                console.error('Failed to dispatch clear selected event');
+              try {
+                window.dispatchEvent(new CustomEvent("compare:clear-selected"));
+              } catch {
+                console.error("Failed to dispatch clear selected event");
               }
               if (dissimilarityToastIdRef.current) {
                 dismissToast(dissimilarityToastIdRef.current);
@@ -310,14 +463,18 @@ export const useCompareOperation = (): CompareOperationHook => {
           dissimilarityToastShownRef.current = true;
         };
 
-        const { tokens, stats, warnings: workerWarnings } = await runCompareWorker(
+        const {
+          tokens,
+          stats,
+          warnings: workerWarnings,
+        } = await runCompareWorker(
           baseFiltered.tokens,
           comparisonFiltered.tokens,
           warningMessages,
           (chunk) => {
             // Incremental ratio tracking for early warning
             for (const tok of chunk) {
-              if (tok.type === 'unchanged') observedUnchanged += 1;
+              if (tok.type === "unchanged") observedUnchanged += 1;
               else observedAddedRemoved += 1;
             }
             const seen = observedAddedRemoved + observedUnchanged;
@@ -328,23 +485,27 @@ export const useCompareOperation = (): CompareOperationHook => {
             ) {
               handleEarlyDissimilarity();
             }
-          }
+          },
         );
 
         if (cancelledRef.current || activeRunIdRef.current !== runId) return;
 
-        const baseHasHighlight = new Array<boolean>(baseFiltered.tokens.length).fill(false);
-        const comparisonHasHighlight = new Array<boolean>(comparisonFiltered.tokens.length).fill(false);
+        const baseHasHighlight = new Array<boolean>(
+          baseFiltered.tokens.length,
+        ).fill(false);
+        const comparisonHasHighlight = new Array<boolean>(
+          comparisonFiltered.tokens.length,
+        ).fill(false);
 
         let baseTokenPointer = 0;
         let comparisonTokenPointer = 0;
         for (const diffToken of tokens) {
-          if (diffToken.type === 'removed') {
+          if (diffToken.type === "removed") {
             if (baseTokenPointer < baseHasHighlight.length) {
               baseHasHighlight[baseTokenPointer] = true;
             }
             baseTokenPointer += 1;
-          } else if (diffToken.type === 'added') {
+          } else if (diffToken.type === "added") {
             if (comparisonTokenPointer < comparisonHasHighlight.length) {
               comparisonHasHighlight[comparisonTokenPointer] = true;
             }
@@ -362,7 +523,7 @@ export const useCompareOperation = (): CompareOperationHook => {
         const buildFilteredTokenData = (
           tokensList: typeof baseFiltered.tokens,
           metadataList: typeof baseFiltered.metadata,
-          highlightFlags: boolean[]
+          highlightFlags: boolean[],
         ): CompareFilteredTokenInfo[] =>
           tokensList.map((token, index) => {
             const meta = metadataList[index];
@@ -385,6 +546,7 @@ export const useCompareOperation = (): CompareOperationHook => {
         const changes = buildChanges(tokens, baseMetadata, comparisonMetadata);
 
         const comparisonResult: CompareResultData = {
+          mode: "text",
           base: {
             fileId: baseFile.fileId,
             fileName: baseFile.name,
@@ -410,11 +572,15 @@ export const useCompareOperation = (): CompareOperationHook => {
             comparison: comparisonMetadata,
           },
           filteredTokenData: {
-            base: buildFilteredTokenData(baseFiltered.tokens, baseFiltered.metadata, baseHasHighlight),
+            base: buildFilteredTokenData(
+              baseFiltered.tokens,
+              baseFiltered.metadata,
+              baseHasHighlight,
+            ),
             comparison: buildFilteredTokenData(
               comparisonFiltered.tokens,
               comparisonFiltered.metadata,
-              comparisonHasHighlight
+              comparisonHasHighlight,
             ),
           },
           sourceTokens: {
@@ -439,17 +605,23 @@ export const useCompareOperation = (): CompareOperationHook => {
         setDownloadUrl(blobUrl);
         setDownloadFilename(summaryFile.name);
 
-        setStatusState('complete');
+        setStatusState("complete");
       } catch (error: unknown) {
-        console.error('[compare] operation failed', error);
+        console.error("[compare] operation failed", error);
         const errorCode = getWorkerErrorCode(error);
-        if (errorCode === 'EMPTY_TEXT') {
-          setErrorMessage(warningMessages.emptyTextMessage ?? t('compare.error.generic', 'Unable to compare these files.'));
+        if (errorCode === "EMPTY_TEXT") {
+          setErrorMessage(
+            warningMessages.emptyTextMessage ??
+              t("compare.error.generic", "Unable to compare these files."),
+          );
         } else {
-          const fallbackMessage = t('compare.error.generic', 'Unable to compare these files.');
+          const fallbackMessage = t(
+            "compare.error.generic",
+            "Unable to compare these files.",
+          );
           if (error instanceof Error && error.message) {
             setErrorMessage(error.message);
-          } else if (typeof error === 'string' && error.trim().length > 0) {
+          } else if (typeof error === "string" && error.trim().length > 0) {
             setErrorMessage(error);
           } else {
             setErrorMessage(fallbackMessage);
@@ -470,18 +642,20 @@ export const useCompareOperation = (): CompareOperationHook => {
         dissimilarityToastShownRef.current = false;
       }
     },
-    [cleanupDownloadUrl, runCompareWorker, selectors, t]
+    [cleanupDownloadUrl, runCompareWorker, selectors, t],
   );
 
   const cancelOperation = useCallback(() => {
     if (!isLoading) return;
     cancelledRef.current = true;
+    pixelSignalRef.current.cancelled = true;
     setIsLoading(false);
-    setStatusState('cancelled');
+    setStatusState("cancelled");
+    setPixelProgress(null);
     if (workerRef.current) {
       try {
         workerRef.current.terminate();
-      // eslint-disable-next-line no-empty
+        // eslint-disable-next-line no-empty
       } catch {}
       workerRef.current = null;
     }
@@ -498,6 +672,7 @@ export const useCompareOperation = (): CompareOperationHook => {
   useEffect(() => {
     return () => {
       cleanupDownloadUrl();
+      revokePixelUrls();
       if (workerRef.current) {
         workerRef.current.terminate();
         workerRef.current = null;
@@ -507,17 +682,23 @@ export const useCompareOperation = (): CompareOperationHook => {
         longRunningToastIdRef.current = null;
       }
     };
-  }, [cleanupDownloadUrl]);
+  }, [cleanupDownloadUrl, revokePixelUrls]);
 
   const status = useMemo(() => {
     const label =
-      statusState === 'idle' ? ''
-        : statusState === 'extracting' ? t('compare.status.extracting', 'Extracting text...')
-        : statusState === 'processing' ? t('compare.status.processing', 'Analyzing differences...')
-        : statusState === 'complete' ? t('compare.status.complete', 'Comparison ready')
-        : statusState === 'cancelled' ? t('operationCancelled', 'Operation cancelled')
-        : '';
-    if (label && statusDetailMs != null) return `${label} (${statusDetailMs} ms)`;
+      statusState === "idle"
+        ? ""
+        : statusState === "extracting"
+          ? t("compare.status.extracting", "Extracting text...")
+          : statusState === "processing"
+            ? t("compare.status.processing", "Analyzing differences...")
+            : statusState === "complete"
+              ? t("compare.status.complete", "Comparison ready")
+              : statusState === "cancelled"
+                ? t("operationCancelled", "Operation cancelled")
+                : "";
+    if (label && statusDetailMs != null)
+      return `${label} (${statusDetailMs} ms)`;
     return label;
   }, [statusState, statusDetailMs, t]);
 
@@ -539,6 +720,7 @@ export const useCompareOperation = (): CompareOperationHook => {
       undoOperation,
       result,
       warnings,
+      pixelProgress,
     }),
     [
       cancelOperation,
@@ -549,11 +731,12 @@ export const useCompareOperation = (): CompareOperationHook => {
       executeOperation,
       files,
       isLoading,
+      pixelProgress,
       resetResults,
       result,
       status,
       undoOperation,
       warnings,
-    ]
+    ],
   );
 };
diff --git a/frontend/src/core/hooks/tools/compare/useCompareParameters.ts b/frontend/src/core/hooks/tools/compare/useCompareParameters.ts
index 98cba87539..693f537fa6 100644
--- a/frontend/src/core/hooks/tools/compare/useCompareParameters.ts
+++ b/frontend/src/core/hooks/tools/compare/useCompareParameters.ts
@@ -1,14 +1,27 @@
-import { BaseParametersHook, useBaseParameters } from '@app/hooks/tools/shared/useBaseParameters';
-import type { FileId } from '@app/types/file';
+import {
+  BaseParametersHook,
+  useBaseParameters,
+} from "@app/hooks/tools/shared/useBaseParameters";
+import type { CompareMode } from "@app/types/compare";
+import type { FileId } from "@app/types/file";
+
+export const DEFAULT_PIXEL_DPI = 150;
+export const DEFAULT_PIXEL_THRESHOLD = 0.1;
 
 export interface CompareParameters {
   baseFileId: FileId | null;
   comparisonFileId: FileId | null;
+  mode: CompareMode;
+  pixelDpi: number;
+  pixelThreshold: number;
 }
 
 export const defaultParameters: CompareParameters = {
   baseFileId: null,
   comparisonFileId: null,
+  mode: "text",
+  pixelDpi: DEFAULT_PIXEL_DPI,
+  pixelThreshold: DEFAULT_PIXEL_THRESHOLD,
 };
 
 export type CompareParametersHook = BaseParametersHook<CompareParameters>;
@@ -16,8 +29,12 @@ export type CompareParametersHook = BaseParametersHook<CompareParameters>;
 export const useCompareParameters = (): CompareParametersHook => {
   return useBaseParameters({
     defaultParameters,
-    endpointName: 'compare',
+    endpointName: "compare",
     validateFn: (params) =>
-      Boolean(params.baseFileId && params.comparisonFileId && params.baseFileId !== params.comparisonFileId),
+      Boolean(
+        params.baseFileId &&
+        params.comparisonFileId &&
+        params.baseFileId !== params.comparisonFileId,
+      ),
   });
 };
diff --git a/frontend/src/core/hooks/tools/compress/useCompressOperation.ts b/frontend/src/core/hooks/tools/compress/useCompressOperation.ts
index c10bea5355..6efa24e5d3 100644
--- a/frontend/src/core/hooks/tools/compress/useCompressOperation.ts
+++ b/frontend/src/core/hooks/tools/compress/useCompressOperation.ts
@@ -1,18 +1,29 @@
-import { useTranslation } from 'react-i18next';
-import { useToolOperation, ToolType } from '@app/hooks/tools/shared/useToolOperation';
-import { createStandardErrorHandler } from '@app/utils/toolErrorHandler';
-import { CompressParameters, defaultParameters } from '@app/hooks/tools/compress/useCompressParameters';
+import { useTranslation } from "react-i18next";
+import {
+  useToolOperation,
+  ToolType,
+} from "@app/hooks/tools/shared/useToolOperation";
+import { createStandardErrorHandler } from "@app/utils/toolErrorHandler";
+import {
+  CompressParameters,
+  defaultParameters,
+} from "@app/hooks/tools/compress/useCompressParameters";
 
 // Static configuration that can be used by both the hook and automation executor
-export const buildCompressFormData = (parameters: CompressParameters, file: File): FormData => {
+export const buildCompressFormData = (
+  parameters: CompressParameters,
+  file: File,
+): FormData => {
   const formData = new FormData();
   formData.append("fileInput", file);
 
-  if (parameters.compressionMethod === 'quality') {
+  if (parameters.compressionMethod === "quality") {
     formData.append("optimizeLevel", parameters.compressionLevel.toString());
   } else {
     // File size method
-    const fileSize = parameters.fileSizeValue ? `${parameters.fileSizeValue}${parameters.fileSizeUnit}` : '';
+    const fileSize = parameters.fileSizeValue
+      ? `${parameters.fileSizeValue}${parameters.fileSizeUnit}`
+      : "";
     if (fileSize) {
       formData.append("expectedOutputSize", fileSize);
     }
@@ -32,8 +43,8 @@ export const buildCompressFormData = (parameters: CompressParameters, file: File
 export const compressOperationConfig = {
   toolType: ToolType.singleFile,
   buildFormData: buildCompressFormData,
-  operationType: 'compress',
-  endpoint: '/api/v1/misc/compress-pdf',
+  operationType: "compress",
+  endpoint: "/api/v1/misc/compress-pdf",
   defaultParameters,
 } as const;
 
@@ -42,6 +53,11 @@ export const useCompressOperation = () => {
 
   return useToolOperation<CompressParameters>({
     ...compressOperationConfig,
-    getErrorMessage: createStandardErrorHandler(t('compress.error.failed', 'An error occurred while compressing the PDF.'))
+    getErrorMessage: createStandardErrorHandler(
+      t(
+        "compress.error.failed",
+        "An error occurred while compressing the PDF.",
+      ),
+    ),
   });
 };
diff --git a/frontend/src/core/hooks/tools/compress/useCompressParameters.ts b/frontend/src/core/hooks/tools/compress/useCompressParameters.ts
index 1df68b6adc..a6e9bfe631 100644
--- a/frontend/src/core/hooks/tools/compress/useCompressParameters.ts
+++ b/frontend/src/core/hooks/tools/compress/useCompressParameters.ts
@@ -1,5 +1,8 @@
-import { BaseParameters } from '@app/types/parameters';
-import { useBaseParameters, BaseParametersHook } from '@app/hooks/tools/shared/useBaseParameters';
+import { BaseParameters } from "@app/types/parameters";
+import {
+  useBaseParameters,
+  BaseParametersHook,
+} from "@app/hooks/tools/shared/useBaseParameters";
 
 export interface CompressParameters extends BaseParameters {
   compressionLevel: number;
@@ -8,9 +11,9 @@ export interface CompressParameters extends BaseParameters {
   lineArtThreshold: number;
   lineArtEdgeLevel: 1 | 2 | 3;
   expectedSize: string;
-  compressionMethod: 'quality' | 'filesize';
+  compressionMethod: "quality" | "filesize";
   fileSizeValue: string;
-  fileSizeUnit: 'KB' | 'MB';
+  fileSizeUnit: "KB" | "MB";
   linearize: boolean;
 }
 
@@ -20,10 +23,10 @@ export const defaultParameters: CompressParameters = {
   lineArt: false,
   lineArtThreshold: 50,
   lineArtEdgeLevel: 3,
-  expectedSize: '',
-  compressionMethod: 'quality',
-  fileSizeValue: '',
-  fileSizeUnit: 'MB',
+  expectedSize: "",
+  compressionMethod: "quality",
+  fileSizeValue: "",
+  fileSizeUnit: "MB",
   linearize: false,
 };
 
@@ -32,7 +35,7 @@ export type CompressParametersHook = BaseParametersHook<CompressParameters>;
 export const useCompressParameters = (): CompressParametersHook => {
   return useBaseParameters({
     defaultParameters,
-    endpointName: 'compress-pdf',
+    endpointName: "compress-pdf",
     validateFn: (params) => {
       // For compression, we only need to validate that compression level is within range
       return params.compressionLevel >= 1 && params.compressionLevel <= 9;
diff --git a/frontend/src/core/hooks/tools/convert/useConvertOperation.ts b/frontend/src/core/hooks/tools/convert/useConvertOperation.ts
index 945199ee16..1da1b96b31 100644
--- a/frontend/src/core/hooks/tools/convert/useConvertOperation.ts
+++ b/frontend/src/core/hooks/tools/convert/useConvertOperation.ts
@@ -1,110 +1,207 @@
-import { useCallback, useMemo } from 'react';
-import apiClient from '@app/services/apiClient';
-import { useTranslation } from 'react-i18next';
-import { ConvertParameters, defaultParameters } from '@app/hooks/tools/convert/useConvertParameters';
-import { createFileFromApiResponse } from '@app/utils/fileResponseUtils';
-import { useToolOperation, ToolType, CustomProcessorResult } from '@app/hooks/tools/shared/useToolOperation';
-import { getEndpointUrl, getEndpointName, isImageFormat, isWebFormat, isOfficeFormat } from '@app/utils/convertUtils';
-import { useToolCloudStatus } from '@app/hooks/useToolCloudStatus';
+import { useCallback, useMemo } from "react";
+import apiClient from "@app/services/apiClient";
+import { useTranslation } from "react-i18next";
+import {
+  ConvertParameters,
+  defaultParameters,
+} from "@app/hooks/tools/convert/useConvertParameters";
+import { createFileFromApiResponse } from "@app/utils/fileResponseUtils";
+import {
+  useToolOperation,
+  ToolType,
+  CustomProcessorResult,
+} from "@app/hooks/tools/shared/useToolOperation";
+import {
+  getEndpointUrl,
+  getEndpointName,
+  isImageFormat,
+  isWebFormat,
+  isOfficeFormat,
+} from "@app/utils/convertUtils";
+import { useToolCloudStatus } from "@app/hooks/useToolCloudStatus";
 
 // Static function that can be used by both the hook and automation executor
 export const shouldProcessFilesSeparately = (
   selectedFiles: File[],
-  parameters: ConvertParameters
+  parameters: ConvertParameters,
 ): boolean => {
-  return selectedFiles.length > 1 && (
+  return (
+    selectedFiles.length > 1 &&
     // Image to PDF with combineImages = false
-    ((isImageFormat(parameters.fromExtension) || parameters.fromExtension === 'image') &&
-     parameters.toExtension === 'pdf' && !parameters.imageOptions.combineImages) ||
-    // SVG to PDF with combineIntoSinglePdf = false
-    (parameters.fromExtension === 'svg' && parameters.toExtension === 'pdf' && !parameters.imageOptions.combineImages) ||
-    // PDF to image conversions (each PDF should generate its own image file)
-    (parameters.fromExtension === 'pdf' && isImageFormat(parameters.toExtension)) ||
-    // PDF to PDF/A and PDF/X conversions (each PDF should be processed separately)
-    (parameters.fromExtension === 'pdf' && (parameters.toExtension === 'pdfa' || parameters.toExtension === 'pdfx')) ||
-    // PDF to text-like/spreadsheet formats should be one output per input
-    (parameters.fromExtension === 'pdf' && ['txt', 'rtf', 'csv', 'xlsx'].includes(parameters.toExtension)) ||
-  // PDF to CBR conversions (each PDF should generate its own archive)
-  (parameters.fromExtension === 'pdf' && parameters.toExtension === 'cbr') ||
-    // PDF to EPUB/AZW3 conversions (each PDF should generate its own ebook)
-    (parameters.fromExtension === 'pdf' && ['epub', 'azw3'].includes(parameters.toExtension)) ||
-    // PDF to office format conversions (each PDF should generate its own office file)
-    (parameters.fromExtension === 'pdf' && isOfficeFormat(parameters.toExtension)) ||
-    // Office files to PDF conversions (each file should be processed separately via LibreOffice)
-    (isOfficeFormat(parameters.fromExtension) && parameters.toExtension === 'pdf') ||
-    // Web files to PDF conversions (each web file should generate its own PDF)
-    ((isWebFormat(parameters.fromExtension) || parameters.fromExtension === 'web') &&
-     parameters.toExtension === 'pdf') ||
-    // eBook files to PDF conversions (each file should be processed separately via Calibre)
-    (['epub', 'mobi', 'azw3', 'fb2'].includes(parameters.fromExtension) && parameters.toExtension === 'pdf') ||
-    // Web files smart detection
-    (parameters.isSmartDetection && parameters.smartDetectionType === 'web') ||
-    // Mixed file types (smart detection)
-    (parameters.isSmartDetection && parameters.smartDetectionType === 'mixed')
+    (((isImageFormat(parameters.fromExtension) ||
+      parameters.fromExtension === "image") &&
+      parameters.toExtension === "pdf" &&
+      !parameters.imageOptions.combineImages) ||
+      // SVG to PDF with combineIntoSinglePdf = false
+      (parameters.fromExtension === "svg" &&
+        parameters.toExtension === "pdf" &&
+        !parameters.imageOptions.combineImages) ||
+      // PDF to image conversions (each PDF should generate its own image file)
+      (parameters.fromExtension === "pdf" &&
+        isImageFormat(parameters.toExtension)) ||
+      // PDF to PDF/A and PDF/X conversions (each PDF should be processed separately)
+      (parameters.fromExtension === "pdf" &&
+        (parameters.toExtension === "pdfa" ||
+          parameters.toExtension === "pdfx")) ||
+      // PDF to text-like/spreadsheet formats should be one output per input
+      (parameters.fromExtension === "pdf" &&
+        ["txt", "rtf", "csv", "xlsx"].includes(parameters.toExtension)) ||
+      // PDF to CBR conversions (each PDF should generate its own archive)
+      (parameters.fromExtension === "pdf" &&
+        parameters.toExtension === "cbr") ||
+      // PDF to EPUB/AZW3 conversions (each PDF should generate its own ebook)
+      (parameters.fromExtension === "pdf" &&
+        ["epub", "azw3"].includes(parameters.toExtension)) ||
+      // PDF to office format conversions (each PDF should generate its own office file)
+      (parameters.fromExtension === "pdf" &&
+        isOfficeFormat(parameters.toExtension)) ||
+      // Office files to PDF conversions (each file should be processed separately via LibreOffice)
+      (isOfficeFormat(parameters.fromExtension) &&
+        parameters.toExtension === "pdf") ||
+      // Web files to PDF conversions (each web file should generate its own PDF)
+      ((isWebFormat(parameters.fromExtension) ||
+        parameters.fromExtension === "web") &&
+        parameters.toExtension === "pdf") ||
+      // eBook files to PDF conversions (each file should be processed separately via Calibre)
+      (["epub", "mobi", "azw3", "fb2"].includes(parameters.fromExtension) &&
+        parameters.toExtension === "pdf") ||
+      // Web files smart detection
+      (parameters.isSmartDetection &&
+        parameters.smartDetectionType === "web") ||
+      // Mixed file types (smart detection)
+      (parameters.isSmartDetection &&
+        parameters.smartDetectionType === "mixed"))
   );
 };
 
 // Static function that can be used by both the hook and automation executor
-export const buildConvertFormData = (parameters: ConvertParameters, selectedFiles: File[]): FormData => {
+export const buildConvertFormData = (
+  parameters: ConvertParameters,
+  selectedFiles: File[],
+): FormData => {
   const formData = new FormData();
-  const { fromExtension, toExtension, imageOptions, htmlOptions, emailOptions, pdfaOptions, pdfxOptions, cbrOptions, pdfToCbrOptions, cbzOptions, cbzOutputOptions, ebookOptions, epubOptions } = parameters;
+  const {
+    fromExtension,
+    toExtension,
+    imageOptions,
+    htmlOptions,
+    emailOptions,
+    pdfaOptions,
+    pdfxOptions,
+    cbrOptions,
+    pdfToCbrOptions,
+    cbzOptions,
+    cbzOutputOptions,
+    ebookOptions,
+    epubOptions,
+  } = parameters;
 
-  selectedFiles.forEach(file => {
+  selectedFiles.forEach((file) => {
     formData.append("fileInput", file);
   });
 
-
   if (isImageFormat(toExtension)) {
     formData.append("imageFormat", toExtension);
     formData.append("colorType", imageOptions.colorType);
     formData.append("dpi", imageOptions.dpi.toString());
     formData.append("singleOrMultiple", imageOptions.singleOrMultiple);
-  } else if (fromExtension === 'pdf' && ['docx', 'odt'].includes(toExtension)) {
+  } else if (fromExtension === "pdf" && ["docx", "odt"].includes(toExtension)) {
     formData.append("outputFormat", toExtension);
-  } else if (fromExtension === 'pdf' && ['pptx', 'odp'].includes(toExtension)) {
+  } else if (fromExtension === "pdf" && ["pptx", "odp"].includes(toExtension)) {
     formData.append("outputFormat", toExtension);
-  } else if (fromExtension === 'pdf' && ['txt', 'rtf'].includes(toExtension)) {
+  } else if (fromExtension === "pdf" && ["txt", "rtf"].includes(toExtension)) {
     formData.append("outputFormat", toExtension);
-  } else if ((isImageFormat(fromExtension) || fromExtension === 'image') && toExtension === 'pdf') {
+  } else if (
+    (isImageFormat(fromExtension) || fromExtension === "image") &&
+    toExtension === "pdf"
+  ) {
     formData.append("fitOption", imageOptions.fitOption);
     formData.append("colorType", imageOptions.colorType);
     formData.append("autoRotate", imageOptions.autoRotate.toString());
-  } else if (fromExtension === 'svg' && toExtension === 'pdf') {
-    formData.append("combineIntoSinglePdf", imageOptions.combineImages.toString());
-  } else if ((fromExtension === 'html' || fromExtension === 'zip') && toExtension === 'pdf') {
+  } else if (fromExtension === "svg" && toExtension === "pdf") {
+    formData.append(
+      "combineIntoSinglePdf",
+      imageOptions.combineImages.toString(),
+    );
+  } else if (
+    (fromExtension === "html" || fromExtension === "zip") &&
+    toExtension === "pdf"
+  ) {
     formData.append("zoom", htmlOptions.zoomLevel.toString());
-  } else if ((fromExtension === 'eml' || fromExtension === 'msg') && toExtension === 'pdf') {
-    formData.append("includeAttachments", emailOptions.includeAttachments.toString());
-    formData.append("maxAttachmentSizeMB", emailOptions.maxAttachmentSizeMB.toString());
+  } else if (
+    (fromExtension === "eml" || fromExtension === "msg") &&
+    toExtension === "pdf"
+  ) {
+    formData.append(
+      "includeAttachments",
+      emailOptions.includeAttachments.toString(),
+    );
+    formData.append(
+      "maxAttachmentSizeMB",
+      emailOptions.maxAttachmentSizeMB.toString(),
+    );
     formData.append("downloadHtml", emailOptions.downloadHtml.toString());
-    formData.append("includeAllRecipients", emailOptions.includeAllRecipients.toString());
-  } else if (fromExtension === 'pdf' && toExtension === 'pdfa') {
+    formData.append(
+      "includeAllRecipients",
+      emailOptions.includeAllRecipients.toString(),
+    );
+  } else if (fromExtension === "pdf" && toExtension === "pdfa") {
     formData.append("outputFormat", pdfaOptions.outputFormat);
     formData.append("strict", String(!!pdfaOptions.strict));
-  } else if (fromExtension === 'pdf' && toExtension === 'pdfx') {
+  } else if (fromExtension === "pdf" && toExtension === "pdfx") {
     // Use PDF/A endpoint with PDF/X format parameter
-    formData.append("outputFormat", pdfxOptions?.outputFormat || 'pdfx');
-  } else if (fromExtension === 'pdf' && toExtension === 'csv') {
+    formData.append("outputFormat", pdfxOptions?.outputFormat || "pdfx");
+  } else if (fromExtension === "pdf" && toExtension === "csv") {
     formData.append("pageNumbers", "all");
-  } else if (fromExtension === 'pdf' && toExtension === 'xlsx') {
+  } else if (fromExtension === "pdf" && toExtension === "xlsx") {
     formData.append("pageNumbers", "all");
-  } else if (fromExtension === 'cbr' && toExtension === 'pdf') {
+  } else if (fromExtension === "cbr" && toExtension === "pdf") {
     formData.append("optimizeForEbook", cbrOptions.optimizeForEbook.toString());
-  } else if (fromExtension === 'pdf' && toExtension === 'cbr') {
+  } else if (fromExtension === "pdf" && toExtension === "cbr") {
     formData.append("dpi", pdfToCbrOptions.dpi.toString());
-  } else if (fromExtension === 'cbz' && toExtension === 'pdf') {
-    formData.append("optimizeForEbook", (cbzOptions?.optimizeForEbook ?? false).toString());
-  } else if (fromExtension === 'pdf' && toExtension === 'cbz') {
+  } else if (fromExtension === "cbz" && toExtension === "pdf") {
+    formData.append(
+      "optimizeForEbook",
+      (cbzOptions?.optimizeForEbook ?? false).toString(),
+    );
+  } else if (fromExtension === "pdf" && toExtension === "cbz") {
     formData.append("dpi", (cbzOutputOptions?.dpi ?? 150).toString());
-  } else if (['epub', 'mobi', 'azw3', 'fb2'].includes(fromExtension) && toExtension === 'pdf') {
-    formData.append("embedAllFonts", (ebookOptions?.embedAllFonts ?? false).toString());
-    formData.append("includeTableOfContents", (ebookOptions?.includeTableOfContents ?? false).toString());
-    formData.append("includePageNumbers", (ebookOptions?.includePageNumbers ?? false).toString());
-    formData.append("optimizeForEbook", (ebookOptions?.optimizeForEbook ?? false).toString());
-  } else if (fromExtension === 'pdf' && ['epub', 'azw3'].includes(toExtension)) {
-    formData.append("detectChapters", (epubOptions?.detectChapters ?? true).toString());
-    formData.append("targetDevice", epubOptions?.targetDevice ?? 'TABLET_PHONE_IMAGES');
-    formData.append("outputFormat", epubOptions?.outputFormat ?? (toExtension === 'azw3' ? 'AZW3' : 'EPUB'));
+  } else if (
+    ["epub", "mobi", "azw3", "fb2"].includes(fromExtension) &&
+    toExtension === "pdf"
+  ) {
+    formData.append(
+      "embedAllFonts",
+      (ebookOptions?.embedAllFonts ?? false).toString(),
+    );
+    formData.append(
+      "includeTableOfContents",
+      (ebookOptions?.includeTableOfContents ?? false).toString(),
+    );
+    formData.append(
+      "includePageNumbers",
+      (ebookOptions?.includePageNumbers ?? false).toString(),
+    );
+    formData.append(
+      "optimizeForEbook",
+      (ebookOptions?.optimizeForEbook ?? false).toString(),
+    );
+  } else if (
+    fromExtension === "pdf" &&
+    ["epub", "azw3"].includes(toExtension)
+  ) {
+    formData.append(
+      "detectChapters",
+      (epubOptions?.detectChapters ?? true).toString(),
+    );
+    formData.append(
+      "targetDevice",
+      epubOptions?.targetDevice ?? "TABLET_PHONE_IMAGES",
+    );
+    formData.append(
+      "outputFormat",
+      epubOptions?.outputFormat ?? (toExtension === "azw3" ? "AZW3" : "EPUB"),
+    );
   }
 
   return formData;
@@ -115,13 +212,13 @@ export const createFileFromResponse = (
   responseData: any,
   headers: any,
   originalFileName: string,
-  targetExtension: string
+  targetExtension: string,
 ): File => {
-  const originalName = originalFileName.split('.')[0];
+  const originalName = originalFileName.split(".")[0];
 
   // Map both pdfa and pdfx to pdf since they both result in PDF files
-  if (targetExtension == 'pdfa' || targetExtension == 'pdfx') {
-    targetExtension = 'pdf';
+  if (targetExtension == "pdfa" || targetExtension == "pdfx") {
+    targetExtension = "pdf";
   }
 
   const fallbackFilename = `${originalName}.${targetExtension}`;
@@ -132,23 +229,24 @@ export const createFileFromResponse = (
 // Static processor that can be used by both the hook and automation executor
 export const convertProcessor = async (
   parameters: ConvertParameters,
-  selectedFiles: File[]
+  selectedFiles: File[],
 ): Promise<CustomProcessorResult> => {
   const processedFiles: File[] = [];
 
   // Map PDF/X to use PDF/A endpoint
-  const actualToExtension = parameters.toExtension === 'pdfx' ? 'pdfa' : parameters.toExtension;
+  const actualToExtension =
+    parameters.toExtension === "pdfx" ? "pdfa" : parameters.toExtension;
   const endpoint = getEndpointUrl(parameters.fromExtension, actualToExtension);
 
   if (!endpoint) {
-    throw new Error('Unsupported conversion format');
+    throw new Error("Unsupported conversion format");
   }
 
   // Convert-specific routing logic: decide batch vs individual processing
   // For PDF/X, we want to treat it similar to PDF/A (separate processing)
   const isSeparateProcessing = shouldProcessFilesSeparately(selectedFiles, {
     ...parameters,
-    toExtension: actualToExtension  // Use the mapped extension for decision logic
+    toExtension: actualToExtension, // Use the mapped extension for decision logic
   });
 
   if (isSeparateProcessing) {
@@ -156,9 +254,16 @@ export const convertProcessor = async (
     for (const file of selectedFiles) {
       try {
         const formData = buildConvertFormData(parameters, [file]);
-        const response = await apiClient.post(endpoint, formData, { responseType: 'blob' });
+        const response = await apiClient.post(endpoint, formData, {
+          responseType: "blob",
+        });
 
-        const convertedFile = createFileFromResponse(response.data, response.headers, file.name, actualToExtension === 'pdfa' ? 'pdfx' : parameters.toExtension);
+        const convertedFile = createFileFromResponse(
+          response.data,
+          response.headers,
+          file.name,
+          actualToExtension === "pdfa" ? "pdfx" : parameters.toExtension,
+        );
 
         processedFiles.push(convertedFile);
       } catch (error) {
@@ -168,13 +273,19 @@ export const convertProcessor = async (
   } else {
     // Batch processing for simple cases (image→PDF combine)
     const formData = buildConvertFormData(parameters, selectedFiles);
-    const response = await apiClient.post(endpoint, formData, { responseType: 'blob' });
+    const response = await apiClient.post(endpoint, formData, {
+      responseType: "blob",
+    });
 
-    const baseFilename = selectedFiles.length === 1
-      ? selectedFiles[0].name
-      : 'converted_files';
+    const baseFilename =
+      selectedFiles.length === 1 ? selectedFiles[0].name : "converted_files";
 
-    const convertedFile = createFileFromResponse(response.data, response.headers, baseFilename, actualToExtension === 'pdfa' ? 'pdfx' : parameters.toExtension);
+    const convertedFile = createFileFromResponse(
+      response.data,
+      response.headers,
+      baseFilename,
+      actualToExtension === "pdfa" ? "pdfx" : parameters.toExtension,
+    );
     processedFiles.push(convertedFile);
   }
 
@@ -192,11 +303,12 @@ export const convertProcessor = async (
 export const convertOperationConfig = {
   toolType: ToolType.custom,
   customProcessor: convertProcessor, // Can't use callback version here
-  operationType: 'convert',
+  operationType: "convert",
   defaultParameters,
   endpoint: (params: ConvertParameters): string | undefined => {
     if (!params.fromExtension || !params.toExtension) return undefined;
-    const actualToExtension = params.toExtension === 'pdfx' ? 'pdfa' : params.toExtension;
+    const actualToExtension =
+      params.toExtension === "pdfx" ? "pdfa" : params.toExtension;
     return getEndpointUrl(params.fromExtension, actualToExtension) ?? undefined;
   },
 } as const;
@@ -206,34 +318,42 @@ export const useConvertOperation = (parameters?: ConvertParameters) => {
 
   // Calculate current endpoint name for cloud detection
   const currentEndpointName = useMemo(() => {
-    if (!parameters?.fromExtension || !parameters?.toExtension) return undefined;
+    if (!parameters?.fromExtension || !parameters?.toExtension)
+      return undefined;
 
     // Map PDF/X to use PDF/A endpoint (same as in convertProcessor)
-    const actualToExtension = parameters.toExtension === 'pdfx' ? 'pdfa' : parameters.toExtension;
+    const actualToExtension =
+      parameters.toExtension === "pdfx" ? "pdfa" : parameters.toExtension;
     return getEndpointName(parameters.fromExtension, actualToExtension);
   }, [parameters?.fromExtension, parameters?.toExtension]);
 
   // Check if current conversion will use cloud
   const willUseCloud = useToolCloudStatus(currentEndpointName);
 
-  const customConvertProcessor = useCallback(async (
-    parameters: ConvertParameters,
-    selectedFiles: File[]
-  ): Promise<CustomProcessorResult> => {
-    return convertProcessor(parameters, selectedFiles);
-  }, []);
+  const customConvertProcessor = useCallback(
+    async (
+      parameters: ConvertParameters,
+      selectedFiles: File[],
+    ): Promise<CustomProcessorResult> => {
+      return convertProcessor(parameters, selectedFiles);
+    },
+    [],
+  );
 
   const operation = useToolOperation<ConvertParameters>({
     ...convertOperationConfig,
     customProcessor: customConvertProcessor, // Use instance-specific processor for translation support
     getErrorMessage: (error) => {
-      if (error.response?.data && typeof error.response.data === 'string') {
+      if (error.response?.data && typeof error.response.data === "string") {
         return error.response.data;
       }
       if (error.message) {
         return error.message;
       }
-      return t("convert.errorConversion", "An error occurred while converting the file.");
+      return t(
+        "convert.errorConversion",
+        "An error occurred while converting the file.",
+      );
     },
   });
 
diff --git a/frontend/src/core/hooks/tools/convert/useConvertParameters.test.ts b/frontend/src/core/hooks/tools/convert/useConvertParameters.test.ts
index 70299b8bf9..6a9aa53349 100644
--- a/frontend/src/core/hooks/tools/convert/useConvertParameters.test.ts
+++ b/frontend/src/core/hooks/tools/convert/useConvertParameters.test.ts
@@ -2,129 +2,148 @@
  * Unit tests for useConvertParameters hook
  */
 
-import { describe, test, expect } from 'vitest';
-import { renderHook, act } from '@testing-library/react';
-import { useConvertParameters } from '@app/hooks/tools/convert/useConvertParameters';
-import { FIT_OPTIONS } from '@app/constants/convertConstants';
+import { describe, test, expect } from "vitest";
+import { renderHook, act } from "@testing-library/react";
+import { useConvertParameters } from "@app/hooks/tools/convert/useConvertParameters";
+import { FIT_OPTIONS } from "@app/constants/convertConstants";
 
-describe('useConvertParameters', () => {
-
-  describe('Parameter Management', () => {
-
-    test('should initialize with default parameters', () => {
+describe("useConvertParameters", () => {
+  describe("Parameter Management", () => {
+    test("should initialize with default parameters", () => {
       const { result } = renderHook(() => useConvertParameters());
 
-      expect(result.current.parameters.fromExtension).toBe('');
-      expect(result.current.parameters.toExtension).toBe('');
-      expect(result.current.parameters.imageOptions.colorType).toBe('color');
+      expect(result.current.parameters.fromExtension).toBe("");
+      expect(result.current.parameters.toExtension).toBe("");
+      expect(result.current.parameters.imageOptions.colorType).toBe("color");
       expect(result.current.parameters.imageOptions.dpi).toBe(300);
-      expect(result.current.parameters.imageOptions.singleOrMultiple).toBe('multiple');
+      expect(result.current.parameters.imageOptions.singleOrMultiple).toBe(
+        "multiple",
+      );
       expect(result.current.parameters.htmlOptions.zoomLevel).toBe(1.0);
-      expect(result.current.parameters.emailOptions.includeAttachments).toBe(true);
-      expect(result.current.parameters.emailOptions.maxAttachmentSizeMB).toBe(10);
+      expect(result.current.parameters.emailOptions.includeAttachments).toBe(
+        true,
+      );
+      expect(result.current.parameters.emailOptions.maxAttachmentSizeMB).toBe(
+        10,
+      );
       expect(result.current.parameters.emailOptions.downloadHtml).toBe(false);
-      expect(result.current.parameters.emailOptions.includeAllRecipients).toBe(false);
-      expect(result.current.parameters.pdfaOptions.outputFormat).toBe('pdfa-2b');
+      expect(result.current.parameters.emailOptions.includeAllRecipients).toBe(
+        false,
+      );
+      expect(result.current.parameters.pdfaOptions.outputFormat).toBe(
+        "pdfa-2b",
+      );
     });
 
-    test('should update individual parameters', () => {
+    test("should update individual parameters", () => {
       const { result } = renderHook(() => useConvertParameters());
 
       act(() => {
-        result.current.updateParameter('fromExtension', 'pdf');
+        result.current.updateParameter("fromExtension", "pdf");
       });
 
-      expect(result.current.parameters.fromExtension).toBe('pdf');
-      expect(result.current.parameters.toExtension).toBe(''); // Should not affect other params
+      expect(result.current.parameters.fromExtension).toBe("pdf");
+      expect(result.current.parameters.toExtension).toBe(""); // Should not affect other params
     });
 
-    test('should update nested image options', () => {
+    test("should update nested image options", () => {
       const { result } = renderHook(() => useConvertParameters());
 
       act(() => {
-        result.current.updateParameter('imageOptions', {
-          colorType: 'grayscale',
+        result.current.updateParameter("imageOptions", {
+          colorType: "grayscale",
           dpi: 150,
-          singleOrMultiple: 'single',
+          singleOrMultiple: "single",
           fitOption: FIT_OPTIONS.FILL_PAGE,
           autoRotate: false,
           combineImages: false,
         });
       });
 
-      expect(result.current.parameters.imageOptions.colorType).toBe('grayscale');
+      expect(result.current.parameters.imageOptions.colorType).toBe(
+        "grayscale",
+      );
       expect(result.current.parameters.imageOptions.dpi).toBe(150);
-      expect(result.current.parameters.imageOptions.singleOrMultiple).toBe('single');
-      expect(result.current.parameters.imageOptions.fitOption).toBe(FIT_OPTIONS.FILL_PAGE);
+      expect(result.current.parameters.imageOptions.singleOrMultiple).toBe(
+        "single",
+      );
+      expect(result.current.parameters.imageOptions.fitOption).toBe(
+        FIT_OPTIONS.FILL_PAGE,
+      );
       expect(result.current.parameters.imageOptions.autoRotate).toBe(false);
       expect(result.current.parameters.imageOptions.combineImages).toBe(false);
     });
 
-    test('should update nested HTML options', () => {
+    test("should update nested HTML options", () => {
       const { result } = renderHook(() => useConvertParameters());
 
       act(() => {
-        result.current.updateParameter('htmlOptions', {
-          zoomLevel: 1.5
+        result.current.updateParameter("htmlOptions", {
+          zoomLevel: 1.5,
         });
       });
 
       expect(result.current.parameters.htmlOptions.zoomLevel).toBe(1.5);
     });
 
-    test('should update nested email options', () => {
+    test("should update nested email options", () => {
       const { result } = renderHook(() => useConvertParameters());
 
       act(() => {
-        result.current.updateParameter('emailOptions', {
+        result.current.updateParameter("emailOptions", {
           includeAttachments: false,
           maxAttachmentSizeMB: 20,
           downloadHtml: true,
-          includeAllRecipients: true
+          includeAllRecipients: true,
         });
       });
 
-      expect(result.current.parameters.emailOptions.includeAttachments).toBe(false);
-      expect(result.current.parameters.emailOptions.maxAttachmentSizeMB).toBe(20);
+      expect(result.current.parameters.emailOptions.includeAttachments).toBe(
+        false,
+      );
+      expect(result.current.parameters.emailOptions.maxAttachmentSizeMB).toBe(
+        20,
+      );
       expect(result.current.parameters.emailOptions.downloadHtml).toBe(true);
-      expect(result.current.parameters.emailOptions.includeAllRecipients).toBe(true);
+      expect(result.current.parameters.emailOptions.includeAllRecipients).toBe(
+        true,
+      );
     });
 
-    test('should update nested PDF/A options', () => {
+    test("should update nested PDF/A options", () => {
       const { result } = renderHook(() => useConvertParameters());
 
       act(() => {
-        result.current.updateParameter('pdfaOptions', {
-          outputFormat: 'pdfa',
-          strict: false
+        result.current.updateParameter("pdfaOptions", {
+          outputFormat: "pdfa",
+          strict: false,
         });
       });
 
-      expect(result.current.parameters.pdfaOptions.outputFormat).toBe('pdfa');
+      expect(result.current.parameters.pdfaOptions.outputFormat).toBe("pdfa");
     });
 
-    test('should reset parameters to defaults', () => {
+    test("should reset parameters to defaults", () => {
       const { result } = renderHook(() => useConvertParameters());
 
       act(() => {
-        result.current.updateParameter('fromExtension', 'pdf');
-        result.current.updateParameter('toExtension', 'png');
+        result.current.updateParameter("fromExtension", "pdf");
+        result.current.updateParameter("toExtension", "png");
       });
 
-      expect(result.current.parameters.fromExtension).toBe('pdf');
+      expect(result.current.parameters.fromExtension).toBe("pdf");
 
       act(() => {
         result.current.resetParameters();
       });
 
-      expect(result.current.parameters.fromExtension).toBe('');
-      expect(result.current.parameters.toExtension).toBe('');
+      expect(result.current.parameters.fromExtension).toBe("");
+      expect(result.current.parameters.toExtension).toBe("");
     });
   });
 
-  describe('Parameter Validation', () => {
-
-    test('should validate parameters correctly', () => {
+  describe("Parameter Validation", () => {
+    test("should validate parameters correctly", () => {
       const { result } = renderHook(() => useConvertParameters());
 
       // No parameters - should be invalid
@@ -132,100 +151,100 @@ describe('useConvertParameters', () => {
 
       // Only fromExtension - should be invalid
       act(() => {
-        result.current.updateParameter('fromExtension', 'pdf');
+        result.current.updateParameter("fromExtension", "pdf");
       });
       expect(result.current.validateParameters()).toBe(false);
 
       // Both extensions with supported conversion - should be valid
       act(() => {
-        result.current.updateParameter('toExtension', 'png');
+        result.current.updateParameter("toExtension", "png");
       });
       expect(result.current.validateParameters()).toBe(true);
     });
 
-    test('should validate unsupported conversions', () => {
+    test("should validate unsupported conversions", () => {
       const { result } = renderHook(() => useConvertParameters());
 
       act(() => {
-        result.current.updateParameter('fromExtension', 'pdf');
-        result.current.updateParameter('toExtension', 'unsupported');
+        result.current.updateParameter("fromExtension", "pdf");
+        result.current.updateParameter("toExtension", "unsupported");
       });
 
       expect(result.current.validateParameters()).toBe(false);
     });
-
   });
 
-  describe('Endpoint Generation', () => {
-
-    test('should generate correct endpoint names', () => {
+  describe("Endpoint Generation", () => {
+    test("should generate correct endpoint names", () => {
       const { result } = renderHook(() => useConvertParameters());
 
       act(() => {
-        result.current.updateParameter('fromExtension', 'pdf');
-        result.current.updateParameter('toExtension', 'png');
+        result.current.updateParameter("fromExtension", "pdf");
+        result.current.updateParameter("toExtension", "png");
       });
 
       const endpointName = result.current.getEndpointName();
-      expect(endpointName).toBe('pdf-to-img');
+      expect(endpointName).toBe("pdf-to-img");
     });
 
-    test('should generate correct endpoint URLs', () => {
+    test("should generate correct endpoint URLs", () => {
       const { result } = renderHook(() => useConvertParameters());
 
       act(() => {
-        result.current.updateParameter('fromExtension', 'pdf');
-        result.current.updateParameter('toExtension', 'png');
+        result.current.updateParameter("fromExtension", "pdf");
+        result.current.updateParameter("toExtension", "png");
       });
 
       const endpoint = result.current.getEndpoint();
-      expect(endpoint).toBe('/api/v1/convert/pdf/img');
+      expect(endpoint).toBe("/api/v1/convert/pdf/img");
     });
 
-    test('should return empty strings for invalid conversions', () => {
+    test("should return empty strings for invalid conversions", () => {
       const { result } = renderHook(() => useConvertParameters());
 
       act(() => {
-        result.current.updateParameter('fromExtension', 'invalid');
-        result.current.updateParameter('toExtension', 'invalid');
+        result.current.updateParameter("fromExtension", "invalid");
+        result.current.updateParameter("toExtension", "invalid");
       });
 
-      expect(result.current.getEndpointName()).toBe('');
-      expect(result.current.getEndpoint()).toBe('');
+      expect(result.current.getEndpointName()).toBe("");
+      expect(result.current.getEndpoint()).toBe("");
     });
   });
 
-  describe('Available Extensions', () => {
-
-    test('should return available extensions for valid source format', () => {
+  describe("Available Extensions", () => {
+    test("should return available extensions for valid source format", () => {
       const { result } = renderHook(() => useConvertParameters());
 
-      const availableExtensions = result.current.getAvailableToExtensions('pdf');
+      const availableExtensions =
+        result.current.getAvailableToExtensions("pdf");
 
       expect(availableExtensions.length).toBeGreaterThan(0);
-      expect(availableExtensions.some(ext => ext.value === 'png')).toBe(true);
-      expect(availableExtensions.some(ext => ext.value === 'jpg')).toBe(true);
+      expect(availableExtensions.some((ext) => ext.value === "png")).toBe(true);
+      expect(availableExtensions.some((ext) => ext.value === "jpg")).toBe(true);
     });
 
-    test('should return empty array for invalid source format', () => {
+    test("should return empty array for invalid source format", () => {
       const { result } = renderHook(() => useConvertParameters());
 
-      const availableExtensions = result.current.getAvailableToExtensions('invalid');
+      const availableExtensions =
+        result.current.getAvailableToExtensions("invalid");
 
-      expect(availableExtensions).toEqual([{
-        "group": "Document",
-        "label": "PDF",
-        "value": "pdf",
-      }]);
+      expect(availableExtensions).toEqual([
+        {
+          group: "Document",
+          label: "PDF",
+          value: "pdf",
+        },
+      ]);
     });
 
-    test('should return empty array for empty source format', () => {
+    test("should return empty array for empty source format", () => {
       const { result } = renderHook(() => useConvertParameters());
 
-      const availableExtensions = result.current.getAvailableToExtensions('');
+      const availableExtensions = result.current.getAvailableToExtensions("");
 
       expect(availableExtensions).toEqual([]);
     });
   });
-
 });
diff --git a/frontend/src/core/hooks/tools/convert/useConvertParameters.ts b/frontend/src/core/hooks/tools/convert/useConvertParameters.ts
index ed9df40513..c2e3ba2e1a 100644
--- a/frontend/src/core/hooks/tools/convert/useConvertParameters.ts
+++ b/frontend/src/core/hooks/tools/convert/useConvertParameters.ts
@@ -5,13 +5,22 @@ import {
   CONVERSION_MATRIX,
   type ColorType,
   type OutputOption,
-  type FitOption
-} from '@app/constants/convertConstants';
-import { getEndpointName as getEndpointNameUtil, getEndpointUrl, isImageFormat, isWebFormat, getAvailableToExtensions as getAvailableToExtensionsUtil } from '@app/utils/convertUtils';
-import { detectFileExtension as detectFileExtensionUtil } from '@app/utils/fileUtils';
-import { BaseParameters } from '@app/types/parameters';
-import { useBaseParameters, BaseParametersHook } from '@app/hooks/tools/shared/useBaseParameters';
-import { useCallback, useMemo } from 'react';
+  type FitOption,
+} from "@app/constants/convertConstants";
+import {
+  getEndpointName as getEndpointNameUtil,
+  getEndpointUrl,
+  isImageFormat,
+  isWebFormat,
+  getAvailableToExtensions as getAvailableToExtensionsUtil,
+} from "@app/utils/convertUtils";
+import { detectFileExtension as detectFileExtensionUtil } from "@app/utils/fileUtils";
+import { BaseParameters } from "@app/types/parameters";
+import {
+  useBaseParameters,
+  BaseParametersHook,
+} from "@app/hooks/tools/shared/useBaseParameters";
+import { useCallback, useMemo } from "react";
 
 export interface ConvertParameters extends BaseParameters {
   fromExtension: string;
@@ -64,18 +73,20 @@ export interface ConvertParameters extends BaseParameters {
     outputFormat: string;
   };
   isSmartDetection: boolean;
-  smartDetectionType: 'mixed' | 'images' | 'web' | 'none';
+  smartDetectionType: "mixed" | "images" | "web" | "none";
 }
 
 export interface ConvertParametersHook extends BaseParametersHook<ConvertParameters> {
   getEndpoint: () => string;
-  getAvailableToExtensions: (fromExtension: string) => Array<{value: string, label: string, group: string}>;
-  analyzeFileTypes: (files: Array<{name: string}>) => void;
+  getAvailableToExtensions: (
+    fromExtension: string,
+  ) => Array<{ value: string; label: string; group: string }>;
+  analyzeFileTypes: (files: Array<{ name: string }>) => void;
 }
 
 export const defaultParameters: ConvertParameters = {
-  fromExtension: '',
-  toExtension: '',
+  fromExtension: "",
+  toExtension: "",
   imageOptions: {
     colorType: COLOR_TYPES.COLOR,
     dpi: 300,
@@ -94,11 +105,11 @@ export const defaultParameters: ConvertParameters = {
     includeAllRecipients: false,
   },
   pdfaOptions: {
-    outputFormat: 'pdfa-2b',
+    outputFormat: "pdfa-2b",
     strict: false,
   },
   pdfxOptions: {
-    outputFormat: 'pdfx',
+    outputFormat: "pdfx",
   },
   cbrOptions: {
     optimizeForEbook: false,
@@ -120,11 +131,11 @@ export const defaultParameters: ConvertParameters = {
   },
   epubOptions: {
     detectChapters: true,
-    targetDevice: 'TABLET_PHONE_IMAGES',
-    outputFormat: 'EPUB',
+    targetDevice: "TABLET_PHONE_IMAGES",
+    outputFormat: "EPUB",
   },
   isSmartDetection: false,
-  smartDetectionType: 'none',
+  smartDetectionType: "none",
 };
 
 const validateParameters = (params: ConvertParameters): boolean => {
@@ -134,9 +145,9 @@ const validateParameters = (params: ConvertParameters): boolean => {
 
   // Handle dynamic format identifiers (file-<extension>)
   let supportedToExtensions: string[];
-  if (fromExtension.startsWith('file-')) {
+  if (fromExtension.startsWith("file-")) {
     // Dynamic format - use 'any' conversion options
-    supportedToExtensions = CONVERSION_MATRIX['any'] || [];
+    supportedToExtensions = CONVERSION_MATRIX["any"] || [];
   } else {
     // Regular format - check conversion matrix
     supportedToExtensions = CONVERSION_MATRIX[fromExtension] || [];
@@ -150,59 +161,64 @@ const validateParameters = (params: ConvertParameters): boolean => {
 };
 
 const getEndpointName = (params: ConvertParameters): string => {
-  const { fromExtension, toExtension, isSmartDetection, smartDetectionType } = params;
+  const { fromExtension, toExtension, isSmartDetection, smartDetectionType } =
+    params;
 
   if (isSmartDetection) {
-    if (smartDetectionType === 'mixed') {
+    if (smartDetectionType === "mixed") {
       // Mixed file types -> PDF using file-to-pdf endpoint
-      return 'file-to-pdf';
-    } else if (smartDetectionType === 'images') {
+      return "file-to-pdf";
+    } else if (smartDetectionType === "images") {
       // All images -> PDF using img-to-pdf endpoint
-      return 'img-to-pdf';
-    } else if (smartDetectionType === 'web') {
+      return "img-to-pdf";
+    } else if (smartDetectionType === "web") {
       // All web files -> PDF using html-to-pdf endpoint
-      return 'html-to-pdf';
+      return "html-to-pdf";
     }
   }
 
   // Handle dynamic format identifiers (file-<extension>)
-  if (fromExtension.startsWith('file-')) {
+  if (fromExtension.startsWith("file-")) {
     // Dynamic format - use file-to-pdf endpoint
-    return 'file-to-pdf';
+    return "file-to-pdf";
   }
 
   return getEndpointNameUtil(fromExtension, toExtension);
 };
 
 export const useConvertParameters = (): ConvertParametersHook => {
-  const config = useMemo(() => ({
-    defaultParameters,
-    endpointName: getEndpointName,
-    validateFn: validateParameters,
-  }), []);
+  const config = useMemo(
+    () => ({
+      defaultParameters,
+      endpointName: getEndpointName,
+      validateFn: validateParameters,
+    }),
+    [],
+  );
 
   const baseHook = useBaseParameters(config);
 
   const getEndpoint = () => {
-    const { fromExtension, toExtension, isSmartDetection, smartDetectionType } = baseHook.parameters;
+    const { fromExtension, toExtension, isSmartDetection, smartDetectionType } =
+      baseHook.parameters;
 
     if (isSmartDetection) {
-      if (smartDetectionType === 'mixed') {
+      if (smartDetectionType === "mixed") {
         // Mixed file types -> PDF using file-to-pdf endpoint
-        return '/api/v1/convert/file/pdf';
-      } else if (smartDetectionType === 'images') {
+        return "/api/v1/convert/file/pdf";
+      } else if (smartDetectionType === "images") {
         // All images -> PDF using img-to-pdf endpoint
-        return '/api/v1/convert/img/pdf';
-      } else if (smartDetectionType === 'web') {
+        return "/api/v1/convert/img/pdf";
+      } else if (smartDetectionType === "web") {
         // All web files -> PDF using html-to-pdf endpoint
-        return '/api/v1/convert/html/pdf';
+        return "/api/v1/convert/html/pdf";
       }
     }
 
     // Handle dynamic format identifiers (file-<extension>)
-    if (fromExtension.startsWith('file-')) {
+    if (fromExtension.startsWith("file-")) {
       // Dynamic format - use file-to-pdf endpoint
-      return '/api/v1/convert/file/pdf';
+      return "/api/v1/convert/file/pdf";
     }
 
     return getEndpointUrl(fromExtension, toExtension);
@@ -210,195 +226,212 @@ export const useConvertParameters = (): ConvertParametersHook => {
 
   const getAvailableToExtensions = getAvailableToExtensionsUtil;
 
-
-  const analyzeFileTypes = useCallback((files: Array<{name: string}>) => {
-    if (files.length === 0) {
-      // No files - only reset smart detection, keep user's format choices
-      baseHook.setParameters(prev => {
-        // Only update if something actually changed
-        if (prev.isSmartDetection === false && prev.smartDetectionType === 'none') {
-          return prev; // No change needed
-        }
-
-        return {
-          ...prev,
-          isSmartDetection: false,
-          smartDetectionType: 'none'
-          // Don't reset fromExtension and toExtension - let user keep their choices
-        };
-      });
-      return;
-    }
-
-    if (files.length === 1) {
-      // Single file - use regular detection with smart target selection
-      const detectedExt = detectFileExtensionUtil(files[0].name);
-      let fromExt = detectedExt;
-      let availableTargets = detectedExt ? CONVERSION_MATRIX[detectedExt] || [] : [];
-
-      // If no explicit conversion exists for this file type, create a dynamic format entry
-      // and fall back to 'any' conversion logic for the actual endpoint
-      if (availableTargets.length === 0 && detectedExt) {
-        fromExt = `file-${detectedExt}`; // Create dynamic format identifier
-        availableTargets = CONVERSION_MATRIX['any'] || [];
-      } else if (availableTargets.length === 0) {
-        // No extension detected - fall back to 'any'
-        fromExt = 'any';
-        availableTargets = CONVERSION_MATRIX['any'] || [];
-      }
-
-      baseHook.setParameters(prev => {
-        // Check if current toExtension is still valid for the new fromExtension
-        const currentToExt = prev.toExtension;
-        const isCurrentToExtValid = availableTargets.includes(currentToExt);
-
-        // Auto-select target only if:
-        // 1. No current target is set, OR
-        // 2. Current target is invalid for new source type, OR
-        // 3. There's only one possible target (forced conversion)
-        let newToExtension = currentToExt;
-        if (!currentToExt || !isCurrentToExtValid) {
-          newToExtension = availableTargets.length === 1 ? availableTargets[0] : '';
-        }
-
-        const newState = {
-          ...prev,
-          isSmartDetection: false,
-          smartDetectionType: 'none' as const,
-          fromExtension: fromExt,
-          toExtension: newToExtension
-        };
-
-        // Only update if something actually changed
-        if (
-          prev.isSmartDetection === newState.isSmartDetection &&
-          prev.smartDetectionType === newState.smartDetectionType &&
-          prev.fromExtension === newState.fromExtension &&
-          prev.toExtension === newState.toExtension
-        ) {
-          return prev; // Return the same object to prevent re-render
-        }
-
-        return newState;
-      });
-      return;
-    }
-
-    // Multiple files - analyze file types
-    const extensions = files.map(file => detectFileExtensionUtil(file.name));
-    const uniqueExtensions = [...new Set(extensions)];
-
-    if (uniqueExtensions.length === 1) {
-      // All files are the same type - use regular detection with smart target selection
-      const detectedExt = uniqueExtensions[0];
-      let fromExt = detectedExt;
-      let availableTargets = CONVERSION_MATRIX[detectedExt] || [];
-
-      // If no explicit conversion exists for this file type, fall back to 'any'
-      if (availableTargets.length === 0) {
-        fromExt = 'any';
-        availableTargets = CONVERSION_MATRIX['any'] || [];
-      }
-
-      baseHook.setParameters(prev => {
-        // Check if current toExtension is still valid for the new fromExtension
-        const currentToExt = prev.toExtension;
-        const isCurrentToExtValid = availableTargets.includes(currentToExt);
-
-        // Auto-select target only if:
-        // 1. No current target is set, OR
-        // 2. Current target is invalid for new source type, OR
-        // 3. There's only one possible target (forced conversion)
-        let newToExtension = currentToExt;
-        if (!currentToExt || !isCurrentToExtValid) {
-          newToExtension = availableTargets.length === 1 ? availableTargets[0] : '';
-        }
-
-        const newState = {
-          ...prev,
-          isSmartDetection: false,
-          smartDetectionType: 'none' as const,
-          fromExtension: fromExt,
-          toExtension: newToExtension
-        };
-
-        // Only update if something actually changed
-        if (
-          prev.isSmartDetection === newState.isSmartDetection &&
-          prev.smartDetectionType === newState.smartDetectionType &&
-          prev.fromExtension === newState.fromExtension &&
-          prev.toExtension === newState.toExtension
-        ) {
-          return prev; // Return the same object to prevent re-render
-        }
-
-        return newState;
-      });
-    } else {
-      // Mixed file types
-      const allImages = uniqueExtensions.every(ext => isImageFormat(ext));
-      const allWeb = uniqueExtensions.every(ext => isWebFormat(ext));
-
-      if (allImages) {
-        // All files are images - use image-to-pdf conversion
-        baseHook.setParameters(prev => {
+  const analyzeFileTypes = useCallback(
+    (files: Array<{ name: string }>) => {
+      if (files.length === 0) {
+        // No files - only reset smart detection, keep user's format choices
+        baseHook.setParameters((prev) => {
           // Only update if something actually changed
-          if (prev.isSmartDetection === true &&
-              prev.smartDetectionType === 'images' &&
-              prev.fromExtension === 'image' &&
-              prev.toExtension === 'pdf') {
+          if (
+            prev.isSmartDetection === false &&
+            prev.smartDetectionType === "none"
+          ) {
             return prev; // No change needed
           }
 
           return {
             ...prev,
-            isSmartDetection: true,
-            smartDetectionType: 'images',
-            fromExtension: 'image',
-            toExtension: 'pdf'
+            isSmartDetection: false,
+            smartDetectionType: "none",
+            // Don't reset fromExtension and toExtension - let user keep their choices
           };
         });
-      } else if (allWeb) {
-        // All files are web files - use html-to-pdf conversion
-        baseHook.setParameters(prev => {
-          // Only update if something actually changed
-          if (prev.isSmartDetection === true &&
-              prev.smartDetectionType === 'web' &&
-              prev.fromExtension === 'html' &&
-              prev.toExtension === 'pdf') {
-            return prev; // No change needed
+        return;
+      }
+
+      if (files.length === 1) {
+        // Single file - use regular detection with smart target selection
+        const detectedExt = detectFileExtensionUtil(files[0].name);
+        let fromExt = detectedExt;
+        let availableTargets = detectedExt
+          ? CONVERSION_MATRIX[detectedExt] || []
+          : [];
+
+        // If no explicit conversion exists for this file type, create a dynamic format entry
+        // and fall back to 'any' conversion logic for the actual endpoint
+        if (availableTargets.length === 0 && detectedExt) {
+          fromExt = `file-${detectedExt}`; // Create dynamic format identifier
+          availableTargets = CONVERSION_MATRIX["any"] || [];
+        } else if (availableTargets.length === 0) {
+          // No extension detected - fall back to 'any'
+          fromExt = "any";
+          availableTargets = CONVERSION_MATRIX["any"] || [];
+        }
+
+        baseHook.setParameters((prev) => {
+          // Check if current toExtension is still valid for the new fromExtension
+          const currentToExt = prev.toExtension;
+          const isCurrentToExtValid = availableTargets.includes(currentToExt);
+
+          // Auto-select target only if:
+          // 1. No current target is set, OR
+          // 2. Current target is invalid for new source type, OR
+          // 3. There's only one possible target (forced conversion)
+          let newToExtension = currentToExt;
+          if (!currentToExt || !isCurrentToExtValid) {
+            newToExtension =
+              availableTargets.length === 1 ? availableTargets[0] : "";
           }
 
-          return {
+          const newState = {
             ...prev,
-            isSmartDetection: true,
-            smartDetectionType: 'web',
-            fromExtension: 'html',
-            toExtension: 'pdf'
+            isSmartDetection: false,
+            smartDetectionType: "none" as const,
+            fromExtension: fromExt,
+            toExtension: newToExtension,
           };
+
+          // Only update if something actually changed
+          if (
+            prev.isSmartDetection === newState.isSmartDetection &&
+            prev.smartDetectionType === newState.smartDetectionType &&
+            prev.fromExtension === newState.fromExtension &&
+            prev.toExtension === newState.toExtension
+          ) {
+            return prev; // Return the same object to prevent re-render
+          }
+
+          return newState;
+        });
+        return;
+      }
+
+      // Multiple files - analyze file types
+      const extensions = files.map((file) =>
+        detectFileExtensionUtil(file.name),
+      );
+      const uniqueExtensions = [...new Set(extensions)];
+
+      if (uniqueExtensions.length === 1) {
+        // All files are the same type - use regular detection with smart target selection
+        const detectedExt = uniqueExtensions[0];
+        let fromExt = detectedExt;
+        let availableTargets = CONVERSION_MATRIX[detectedExt] || [];
+
+        // If no explicit conversion exists for this file type, fall back to 'any'
+        if (availableTargets.length === 0) {
+          fromExt = "any";
+          availableTargets = CONVERSION_MATRIX["any"] || [];
+        }
+
+        baseHook.setParameters((prev) => {
+          // Check if current toExtension is still valid for the new fromExtension
+          const currentToExt = prev.toExtension;
+          const isCurrentToExtValid = availableTargets.includes(currentToExt);
+
+          // Auto-select target only if:
+          // 1. No current target is set, OR
+          // 2. Current target is invalid for new source type, OR
+          // 3. There's only one possible target (forced conversion)
+          let newToExtension = currentToExt;
+          if (!currentToExt || !isCurrentToExtValid) {
+            newToExtension =
+              availableTargets.length === 1 ? availableTargets[0] : "";
+          }
+
+          const newState = {
+            ...prev,
+            isSmartDetection: false,
+            smartDetectionType: "none" as const,
+            fromExtension: fromExt,
+            toExtension: newToExtension,
+          };
+
+          // Only update if something actually changed
+          if (
+            prev.isSmartDetection === newState.isSmartDetection &&
+            prev.smartDetectionType === newState.smartDetectionType &&
+            prev.fromExtension === newState.fromExtension &&
+            prev.toExtension === newState.toExtension
+          ) {
+            return prev; // Return the same object to prevent re-render
+          }
+
+          return newState;
         });
       } else {
-        // Mixed non-image types - use file-to-pdf conversion
-        baseHook.setParameters(prev => {
-          // Only update if something actually changed
-          if (prev.isSmartDetection === true &&
-              prev.smartDetectionType === 'mixed' &&
-              prev.fromExtension === 'any' &&
-              prev.toExtension === 'pdf') {
-            return prev; // No change needed
-          }
+        // Mixed file types
+        const allImages = uniqueExtensions.every((ext) => isImageFormat(ext));
+        const allWeb = uniqueExtensions.every((ext) => isWebFormat(ext));
 
-          return {
-            ...prev,
-            isSmartDetection: true,
-            smartDetectionType: 'mixed',
-            fromExtension: 'any',
-            toExtension: 'pdf'
-          };
-        });
+        if (allImages) {
+          // All files are images - use image-to-pdf conversion
+          baseHook.setParameters((prev) => {
+            // Only update if something actually changed
+            if (
+              prev.isSmartDetection === true &&
+              prev.smartDetectionType === "images" &&
+              prev.fromExtension === "image" &&
+              prev.toExtension === "pdf"
+            ) {
+              return prev; // No change needed
+            }
+
+            return {
+              ...prev,
+              isSmartDetection: true,
+              smartDetectionType: "images",
+              fromExtension: "image",
+              toExtension: "pdf",
+            };
+          });
+        } else if (allWeb) {
+          // All files are web files - use html-to-pdf conversion
+          baseHook.setParameters((prev) => {
+            // Only update if something actually changed
+            if (
+              prev.isSmartDetection === true &&
+              prev.smartDetectionType === "web" &&
+              prev.fromExtension === "html" &&
+              prev.toExtension === "pdf"
+            ) {
+              return prev; // No change needed
+            }
+
+            return {
+              ...prev,
+              isSmartDetection: true,
+              smartDetectionType: "web",
+              fromExtension: "html",
+              toExtension: "pdf",
+            };
+          });
+        } else {
+          // Mixed non-image types - use file-to-pdf conversion
+          baseHook.setParameters((prev) => {
+            // Only update if something actually changed
+            if (
+              prev.isSmartDetection === true &&
+              prev.smartDetectionType === "mixed" &&
+              prev.fromExtension === "any" &&
+              prev.toExtension === "pdf"
+            ) {
+              return prev; // No change needed
+            }
+
+            return {
+              ...prev,
+              isSmartDetection: true,
+              smartDetectionType: "mixed",
+              fromExtension: "any",
+              toExtension: "pdf",
+            };
+          });
+        }
       }
-    }
-  }, [baseHook.setParameters]);
+    },
+    [baseHook.setParameters],
+  );
 
   return {
     ...baseHook,
diff --git a/frontend/src/core/hooks/tools/convert/useConvertParametersAutoDetection.test.ts b/frontend/src/core/hooks/tools/convert/useConvertParametersAutoDetection.test.ts
index e626671f91..efe8695929 100644
--- a/frontend/src/core/hooks/tools/convert/useConvertParametersAutoDetection.test.ts
+++ b/frontend/src/core/hooks/tools/convert/useConvertParametersAutoDetection.test.ts
@@ -3,219 +3,196 @@
  * This covers the analyzeFileTypes function and related smart detection logic
  */
 
-import { describe, test, expect } from 'vitest';
-import { renderHook, act } from '@testing-library/react';
-import { useConvertParameters } from '@app/hooks/tools/convert/useConvertParameters';
+import { describe, test, expect } from "vitest";
+import { renderHook, act } from "@testing-library/react";
+import { useConvertParameters } from "@app/hooks/tools/convert/useConvertParameters";
 
-describe('useConvertParameters - Auto Detection & Smart Conversion', () => {
-
-  describe('Single File Detection', () => {
-
-    test('should detect single file extension and set auto-target', () => {
+describe("useConvertParameters - Auto Detection & Smart Conversion", () => {
+  describe("Single File Detection", () => {
+    test("should detect single file extension and set auto-target", () => {
       const { result } = renderHook(() => useConvertParameters());
 
-      const pdfFile = [{ name: 'document.pdf' }];
+      const pdfFile = [{ name: "document.pdf" }];
 
       act(() => {
         result.current.analyzeFileTypes(pdfFile);
       });
 
-      expect(result.current.parameters.fromExtension).toBe('pdf');
-      expect(result.current.parameters.toExtension).toBe(''); // No auto-selection for multiple targets
+      expect(result.current.parameters.fromExtension).toBe("pdf");
+      expect(result.current.parameters.toExtension).toBe(""); // No auto-selection for multiple targets
       expect(result.current.parameters.isSmartDetection).toBe(false);
-      expect(result.current.parameters.smartDetectionType).toBe('none');
+      expect(result.current.parameters.smartDetectionType).toBe("none");
     });
 
-    test('should handle unknown file types with file-to-pdf fallback', () => {
+    test("should handle unknown file types with file-to-pdf fallback", () => {
       const { result } = renderHook(() => useConvertParameters());
 
-      const unknownFile = [{ name: 'document.xyz' }, { name: 'image.jpggg' }];
+      const unknownFile = [{ name: "document.xyz" }, { name: "image.jpggg" }];
 
       act(() => {
         result.current.analyzeFileTypes(unknownFile);
       });
 
-      expect(result.current.parameters.fromExtension).toBe('any');
-      expect(result.current.parameters.toExtension).toBe('pdf'); // Fallback to file-to-pdf
+      expect(result.current.parameters.fromExtension).toBe("any");
+      expect(result.current.parameters.toExtension).toBe("pdf"); // Fallback to file-to-pdf
       expect(result.current.parameters.isSmartDetection).toBe(true);
     });
 
-    test('should handle files without extensions', () => {
+    test("should handle files without extensions", () => {
       const { result } = renderHook(() => useConvertParameters());
 
-      const noExtFile = [{ name: 'document' }];
+      const noExtFile = [{ name: "document" }];
 
       act(() => {
         result.current.analyzeFileTypes(noExtFile);
       });
 
-      expect(result.current.parameters.fromExtension).toBe('any');
-      expect(result.current.parameters.toExtension).toBe('pdf'); // Fallback to file-to-pdf
+      expect(result.current.parameters.fromExtension).toBe("any");
+      expect(result.current.parameters.toExtension).toBe("pdf"); // Fallback to file-to-pdf
     });
-
-
   });
 
-  describe('Multiple Identical Files', () => {
-
-    test('should detect multiple PDF files and set auto-target', () => {
+  describe("Multiple Identical Files", () => {
+    test("should detect multiple PDF files and set auto-target", () => {
       const { result } = renderHook(() => useConvertParameters());
 
       const pdfFiles = [
-        { name: 'doc1.pdf' },
-        { name: 'doc2.pdf' },
-        { name: 'doc3.pdf' }
+        { name: "doc1.pdf" },
+        { name: "doc2.pdf" },
+        { name: "doc3.pdf" },
       ];
 
       act(() => {
         result.current.analyzeFileTypes(pdfFiles);
       });
 
-      expect(result.current.parameters.fromExtension).toBe('pdf');
-      expect(result.current.parameters.toExtension).toBe(''); // Auto-selected
+      expect(result.current.parameters.fromExtension).toBe("pdf");
+      expect(result.current.parameters.toExtension).toBe(""); // Auto-selected
       expect(result.current.parameters.isSmartDetection).toBe(false);
-      expect(result.current.parameters.smartDetectionType).toBe('none');
+      expect(result.current.parameters.smartDetectionType).toBe("none");
     });
 
-    test('should handle multiple unknown file types with fallback', () => {
+    test("should handle multiple unknown file types with fallback", () => {
       const { result } = renderHook(() => useConvertParameters());
 
-      const unknownFiles = [
-        { name: 'file1.xyz' },
-        { name: 'file2.xyz' }
-      ];
+      const unknownFiles = [{ name: "file1.xyz" }, { name: "file2.xyz" }];
 
       act(() => {
         result.current.analyzeFileTypes(unknownFiles);
       });
 
-      expect(result.current.parameters.fromExtension).toBe('any');
-      expect(result.current.parameters.toExtension).toBe('pdf');
+      expect(result.current.parameters.fromExtension).toBe("any");
+      expect(result.current.parameters.toExtension).toBe("pdf");
       expect(result.current.parameters.isSmartDetection).toBe(false);
     });
   });
 
-  describe('Smart Detection - All Images', () => {
-
-    test('should detect all image files and enable smart detection', () => {
+  describe("Smart Detection - All Images", () => {
+    test("should detect all image files and enable smart detection", () => {
       const { result } = renderHook(() => useConvertParameters());
 
       const imageFiles = [
-        { name: 'photo1.jpg' },
-        { name: 'photo2.png' },
-        { name: 'photo3.gif' }
+        { name: "photo1.jpg" },
+        { name: "photo2.png" },
+        { name: "photo3.gif" },
       ];
 
       act(() => {
         result.current.analyzeFileTypes(imageFiles);
       });
 
-      expect(result.current.parameters.fromExtension).toBe('image');
-      expect(result.current.parameters.toExtension).toBe('pdf');
+      expect(result.current.parameters.fromExtension).toBe("image");
+      expect(result.current.parameters.toExtension).toBe("pdf");
       expect(result.current.parameters.isSmartDetection).toBe(true);
-      expect(result.current.parameters.smartDetectionType).toBe('images');
+      expect(result.current.parameters.smartDetectionType).toBe("images");
     });
 
-    test('should handle mixed case image extensions', () => {
+    test("should handle mixed case image extensions", () => {
       const { result } = renderHook(() => useConvertParameters());
 
-      const imageFiles = [
-        { name: 'photo1.JPG' },
-        { name: 'photo2.PNG' }
-      ];
+      const imageFiles = [{ name: "photo1.JPG" }, { name: "photo2.PNG" }];
 
       act(() => {
         result.current.analyzeFileTypes(imageFiles);
       });
 
       expect(result.current.parameters.isSmartDetection).toBe(true);
-      expect(result.current.parameters.smartDetectionType).toBe('images');
+      expect(result.current.parameters.smartDetectionType).toBe("images");
     });
   });
 
-  describe('Smart Detection - All Web Files', () => {
-
-    test('should detect all web files and enable web smart detection', () => {
+  describe("Smart Detection - All Web Files", () => {
+    test("should detect all web files and enable web smart detection", () => {
       const { result } = renderHook(() => useConvertParameters());
 
-      const webFiles = [
-        { name: 'page1.html' },
-        { name: 'archive.zip' }
-      ];
+      const webFiles = [{ name: "page1.html" }, { name: "archive.zip" }];
 
       act(() => {
         result.current.analyzeFileTypes(webFiles);
       });
 
-      expect(result.current.parameters.fromExtension).toBe('html');
-      expect(result.current.parameters.toExtension).toBe('pdf');
+      expect(result.current.parameters.fromExtension).toBe("html");
+      expect(result.current.parameters.toExtension).toBe("pdf");
       expect(result.current.parameters.isSmartDetection).toBe(true);
-      expect(result.current.parameters.smartDetectionType).toBe('web');
+      expect(result.current.parameters.smartDetectionType).toBe("web");
     });
 
-    test('should handle mixed case web extensions', () => {
+    test("should handle mixed case web extensions", () => {
       const { result } = renderHook(() => useConvertParameters());
 
-      const webFiles = [
-        { name: 'page1.HTML' },
-        { name: 'archive.ZIP' }
-      ];
+      const webFiles = [{ name: "page1.HTML" }, { name: "archive.ZIP" }];
 
       act(() => {
         result.current.analyzeFileTypes(webFiles);
       });
 
       expect(result.current.parameters.isSmartDetection).toBe(true);
-      expect(result.current.parameters.smartDetectionType).toBe('web');
+      expect(result.current.parameters.smartDetectionType).toBe("web");
     });
 
-    test('should detect multiple web files and enable web smart detection', () => {
+    test("should detect multiple web files and enable web smart detection", () => {
       const { result } = renderHook(() => useConvertParameters());
 
-      const zipFiles = [
-        { name: 'site1.zip' },
-        { name: 'site2.html' }
-      ];
+      const zipFiles = [{ name: "site1.zip" }, { name: "site2.html" }];
 
       act(() => {
         result.current.analyzeFileTypes(zipFiles);
       });
 
-      expect(result.current.parameters.fromExtension).toBe('html');
-      expect(result.current.parameters.toExtension).toBe('pdf');
+      expect(result.current.parameters.fromExtension).toBe("html");
+      expect(result.current.parameters.toExtension).toBe("pdf");
       expect(result.current.parameters.isSmartDetection).toBe(true);
-      expect(result.current.parameters.smartDetectionType).toBe('web');
+      expect(result.current.parameters.smartDetectionType).toBe("web");
     });
   });
 
-  describe('Smart Detection - Mixed File Types', () => {
-
-    test('should detect mixed file types and enable smart detection', () => {
+  describe("Smart Detection - Mixed File Types", () => {
+    test("should detect mixed file types and enable smart detection", () => {
       const { result } = renderHook(() => useConvertParameters());
 
       const mixedFiles = [
-        { name: 'document.pdf' },
-        { name: 'spreadsheet.xlsx' },
-        { name: 'presentation.pptx' }
+        { name: "document.pdf" },
+        { name: "spreadsheet.xlsx" },
+        { name: "presentation.pptx" },
       ];
 
       act(() => {
         result.current.analyzeFileTypes(mixedFiles);
       });
 
-      expect(result.current.parameters.fromExtension).toBe('any');
-      expect(result.current.parameters.toExtension).toBe('pdf');
+      expect(result.current.parameters.fromExtension).toBe("any");
+      expect(result.current.parameters.toExtension).toBe("pdf");
       expect(result.current.parameters.isSmartDetection).toBe(true);
-      expect(result.current.parameters.smartDetectionType).toBe('mixed');
+      expect(result.current.parameters.smartDetectionType).toBe("mixed");
     });
 
-    test('should detect mixed images and documents as mixed type', () => {
+    test("should detect mixed images and documents as mixed type", () => {
       const { result } = renderHook(() => useConvertParameters());
 
       const mixedFiles = [
-        { name: 'photo.jpg' },
-        { name: 'document.pdf' },
-        { name: 'text.txt' }
+        { name: "photo.jpg" },
+        { name: "document.pdf" },
+        { name: "text.txt" },
       ];
 
       act(() => {
@@ -223,16 +200,16 @@ describe('useConvertParameters - Auto Detection & Smart Conversion', () => {
       });
 
       expect(result.current.parameters.isSmartDetection).toBe(true);
-      expect(result.current.parameters.smartDetectionType).toBe('mixed');
+      expect(result.current.parameters.smartDetectionType).toBe("mixed");
     });
 
-    test('should handle mixed with unknown file types', () => {
+    test("should handle mixed with unknown file types", () => {
       const { result } = renderHook(() => useConvertParameters());
 
       const mixedFiles = [
-        { name: 'document.pdf' },
-        { name: 'unknown.xyz' },
-        { name: 'noextension' }
+        { name: "document.pdf" },
+        { name: "unknown.xyz" },
+        { name: "noextension" },
       ];
 
       act(() => {
@@ -240,117 +217,108 @@ describe('useConvertParameters - Auto Detection & Smart Conversion', () => {
       });
 
       expect(result.current.parameters.isSmartDetection).toBe(true);
-      expect(result.current.parameters.smartDetectionType).toBe('mixed');
+      expect(result.current.parameters.smartDetectionType).toBe("mixed");
     });
   });
 
-  describe('Smart Detection Endpoint Resolution', () => {
-
-    test('should return correct endpoint for image smart detection', () => {
+  describe("Smart Detection Endpoint Resolution", () => {
+    test("should return correct endpoint for image smart detection", () => {
       const { result } = renderHook(() => useConvertParameters());
 
-      const imageFiles = [
-        { name: 'photo1.jpg' },
-        { name: 'photo2.png' }
-      ];
+      const imageFiles = [{ name: "photo1.jpg" }, { name: "photo2.png" }];
 
       act(() => {
         result.current.analyzeFileTypes(imageFiles);
       });
 
-      expect(result.current.getEndpointName()).toBe('img-to-pdf');
-      expect(result.current.getEndpoint()).toBe('/api/v1/convert/img/pdf');
+      expect(result.current.getEndpointName()).toBe("img-to-pdf");
+      expect(result.current.getEndpoint()).toBe("/api/v1/convert/img/pdf");
     });
 
-    test('should return correct endpoint for web smart detection', () => {
+    test("should return correct endpoint for web smart detection", () => {
       const { result } = renderHook(() => useConvertParameters());
 
-      const webFiles = [
-        { name: 'page1.html' },
-        { name: 'archive.zip' }
-      ];
+      const webFiles = [{ name: "page1.html" }, { name: "archive.zip" }];
 
       act(() => {
         result.current.analyzeFileTypes(webFiles);
       });
 
-      expect(result.current.getEndpointName()).toBe('html-to-pdf');
-      expect(result.current.getEndpoint()).toBe('/api/v1/convert/html/pdf');
+      expect(result.current.getEndpointName()).toBe("html-to-pdf");
+      expect(result.current.getEndpoint()).toBe("/api/v1/convert/html/pdf");
     });
 
-    test('should return correct endpoint for mixed smart detection', () => {
+    test("should return correct endpoint for mixed smart detection", () => {
       const { result } = renderHook(() => useConvertParameters());
 
       const mixedFiles = [
-        { name: 'document.pdf' },
-        { name: 'spreadsheet.xlsx' }
+        { name: "document.pdf" },
+        { name: "spreadsheet.xlsx" },
       ];
 
       act(() => {
         result.current.analyzeFileTypes(mixedFiles);
       });
 
-      expect(result.current.getEndpointName()).toBe('file-to-pdf');
-      expect(result.current.getEndpoint()).toBe('/api/v1/convert/file/pdf');
+      expect(result.current.getEndpointName()).toBe("file-to-pdf");
+      expect(result.current.getEndpoint()).toBe("/api/v1/convert/file/pdf");
     });
   });
 
-  describe('Auto-Target Selection Logic', () => {
-
-    test('should select single available target automatically', () => {
+  describe("Auto-Target Selection Logic", () => {
+    test("should select single available target automatically", () => {
       const { result } = renderHook(() => useConvertParameters());
 
       // Markdown has only one conversion target (PDF)
-      const mdFile = [{ name: 'readme.md' }];
+      const mdFile = [{ name: "readme.md" }];
 
       act(() => {
         result.current.analyzeFileTypes(mdFile);
       });
 
-      expect(result.current.parameters.fromExtension).toBe('md');
-      expect(result.current.parameters.toExtension).toBe('pdf'); // Only available target
+      expect(result.current.parameters.fromExtension).toBe("md");
+      expect(result.current.parameters.toExtension).toBe("pdf"); // Only available target
     });
 
-    test('should not auto-select when multiple targets available', () => {
+    test("should not auto-select when multiple targets available", () => {
       const { result } = renderHook(() => useConvertParameters());
 
       // PDF has multiple conversion targets, so no auto-selection
-      const pdfFile = [{ name: 'document.pdf' }];
+      const pdfFile = [{ name: "document.pdf" }];
 
       act(() => {
         result.current.analyzeFileTypes(pdfFile);
       });
 
-      expect(result.current.parameters.fromExtension).toBe('pdf');
+      expect(result.current.parameters.fromExtension).toBe("pdf");
       // Should NOT auto-select when multiple targets available
-      expect(result.current.parameters.toExtension).toBe('');
+      expect(result.current.parameters.toExtension).toBe("");
     });
   });
 
-  describe('Edge Cases', () => {
-
-    test('should handle empty file names', () => {
+  describe("Edge Cases", () => {
+    test("should handle empty file names", () => {
       const { result } = renderHook(() => useConvertParameters());
 
-      const emptyFiles = [{ name: '' }];
+      const emptyFiles = [{ name: "" }];
 
       act(() => {
         result.current.analyzeFileTypes(emptyFiles);
       });
 
-      expect(result.current.parameters.fromExtension).toBe('any');
-      expect(result.current.parameters.toExtension).toBe('pdf');
+      expect(result.current.parameters.fromExtension).toBe("any");
+      expect(result.current.parameters.toExtension).toBe("pdf");
     });
 
-    test('should handle malformed file objects', () => {
+    test("should handle malformed file objects", () => {
       const { result } = renderHook(() => useConvertParameters());
 
-      const malformedFiles: Array<{name: string}> = [
-        { name: 'valid.pdf' },
+      const malformedFiles: Array<{ name: string }> = [
+        { name: "valid.pdf" },
         // @ts-expect-error - Testing runtime resilience
         { name: null },
         // @ts-expect-error - Testing runtime resilience
-        { name: undefined }
+        { name: undefined },
       ];
 
       act(() => {
@@ -359,7 +327,7 @@ describe('useConvertParameters - Auto Detection & Smart Conversion', () => {
 
       // Should still process the valid file and handle gracefully
       expect(result.current.parameters.isSmartDetection).toBe(true);
-      expect(result.current.parameters.smartDetectionType).toBe('mixed');
+      expect(result.current.parameters.smartDetectionType).toBe("mixed");
     });
   });
 });
diff --git a/frontend/src/core/hooks/tools/crop/useCropOperation.ts b/frontend/src/core/hooks/tools/crop/useCropOperation.ts
index 6cc9aa469c..67d72c8df0 100644
--- a/frontend/src/core/hooks/tools/crop/useCropOperation.ts
+++ b/frontend/src/core/hooks/tools/crop/useCropOperation.ts
@@ -1,10 +1,19 @@
-import { useTranslation } from 'react-i18next';
-import { useToolOperation, ToolType } from '@app/hooks/tools/shared/useToolOperation';
-import { createStandardErrorHandler } from '@app/utils/toolErrorHandler';
-import { CropParameters, defaultParameters } from '@app/hooks/tools/crop/useCropParameters';
+import { useTranslation } from "react-i18next";
+import {
+  useToolOperation,
+  ToolType,
+} from "@app/hooks/tools/shared/useToolOperation";
+import { createStandardErrorHandler } from "@app/utils/toolErrorHandler";
+import {
+  CropParameters,
+  defaultParameters,
+} from "@app/hooks/tools/crop/useCropParameters";
 
 // Static configuration that can be used by both the hook and automation executor
-export const buildCropFormData = (parameters: CropParameters, file: File): FormData => {
+export const buildCropFormData = (
+  parameters: CropParameters,
+  file: File,
+): FormData => {
   const formData = new FormData();
   formData.append("fileInput", file);
 
@@ -26,8 +35,8 @@ export const buildCropFormData = (parameters: CropParameters, file: File): FormD
 export const cropOperationConfig = {
   toolType: ToolType.singleFile,
   buildFormData: buildCropFormData,
-  operationType: 'crop',
-  endpoint: '/api/v1/general/crop',
+  operationType: "crop",
+  endpoint: "/api/v1/general/crop",
   defaultParameters,
 } as const;
 
@@ -37,7 +46,7 @@ export const useCropOperation = () => {
   return useToolOperation<CropParameters>({
     ...cropOperationConfig,
     getErrorMessage: createStandardErrorHandler(
-      t('crop.error.failed', 'An error occurred while cropping the PDF.')
-    )
+      t("crop.error.failed", "An error occurred while cropping the PDF."),
+    ),
   });
 };
diff --git a/frontend/src/core/hooks/tools/crop/useCropParameters.ts b/frontend/src/core/hooks/tools/crop/useCropParameters.ts
index 16314160e8..920f2cb6c5 100644
--- a/frontend/src/core/hooks/tools/crop/useCropParameters.ts
+++ b/frontend/src/core/hooks/tools/crop/useCropParameters.ts
@@ -1,8 +1,18 @@
-import { BaseParameters } from '@app/types/parameters';
-import { useBaseParameters, BaseParametersHook } from '@app/hooks/tools/shared/useBaseParameters';
-import { useCallback } from 'react';
-import { Rectangle, PDFBounds, constrainCropAreaToPDF, createFullPDFCropArea, roundCropArea, isRectangle } from '@app/utils/cropCoordinates';
-import { DEFAULT_CROP_AREA } from '@app/constants/cropConstants';
+import { BaseParameters } from "@app/types/parameters";
+import {
+  useBaseParameters,
+  BaseParametersHook,
+} from "@app/hooks/tools/shared/useBaseParameters";
+import { useCallback } from "react";
+import {
+  Rectangle,
+  PDFBounds,
+  constrainCropAreaToPDF,
+  createFullPDFCropArea,
+  roundCropArea,
+  isRectangle,
+} from "@app/utils/cropCoordinates";
+import { DEFAULT_CROP_AREA } from "@app/constants/cropConstants";
 
 export interface CropParameters extends BaseParameters {
   cropArea: Rectangle;
@@ -26,20 +36,20 @@ export type CropParametersHook = BaseParametersHook<CropParameters> & {
   /** Check if crop area covers the entire PDF */
   isFullPDFCrop: (pdfBounds?: PDFBounds) => boolean;
   /** Update crop area with constraints applied */
-  updateCropAreaConstrained: (cropArea: Partial<Rectangle>, pdfBounds?: PDFBounds) => void;
+  updateCropAreaConstrained: (
+    cropArea: Partial<Rectangle>,
+    pdfBounds?: PDFBounds,
+  ) => void;
 };
 
 export const useCropParameters = (): CropParametersHook => {
   const baseHook = useBaseParameters({
     defaultParameters,
-    endpointName: 'crop',
+    endpointName: "crop",
     validateFn: (params) => {
       const rect = params.cropArea;
       // Basic validation - coordinates and dimensions must be positive
-      return rect.x >= 0 &&
-             rect.y >= 0 &&
-             rect.width > 0 &&
-             rect.height > 0;
+      return rect.x >= 0 && rect.y >= 0 && rect.width > 0 && rect.height > 0;
     },
   });
 
@@ -49,85 +59,110 @@ export const useCropParameters = (): CropParametersHook => {
   }, [baseHook.parameters]);
 
   // Set crop area with optional PDF bounds validation
-  const setCropArea = useCallback((cropArea: Rectangle, pdfBounds?: PDFBounds) => {
-    let finalCropArea = roundCropArea(cropArea);
+  const setCropArea = useCallback(
+    (cropArea: Rectangle, pdfBounds?: PDFBounds) => {
+      let finalCropArea = roundCropArea(cropArea);
 
-    // Apply PDF bounds constraints if provided
-    if (pdfBounds) {
-      finalCropArea = constrainCropAreaToPDF(finalCropArea, pdfBounds);
-    }
-    baseHook.updateParameter('cropArea', finalCropArea);
-  }, [baseHook]);
+      // Apply PDF bounds constraints if provided
+      if (pdfBounds) {
+        finalCropArea = constrainCropAreaToPDF(finalCropArea, pdfBounds);
+      }
+      baseHook.updateParameter("cropArea", finalCropArea);
+    },
+    [baseHook],
+  );
 
   // Reset to cover entire PDF
-  const resetToFullPDF = useCallback((pdfBounds: PDFBounds) => {
-    const fullCropArea = createFullPDFCropArea(pdfBounds);
-    setCropArea(fullCropArea);
-  }, [setCropArea]);
+  const resetToFullPDF = useCallback(
+    (pdfBounds: PDFBounds) => {
+      const fullCropArea = createFullPDFCropArea(pdfBounds);
+      setCropArea(fullCropArea);
+    },
+    [setCropArea],
+  );
 
   // Check if current crop area is valid for the given PDF bounds
-  const isCropAreaValid = useCallback((pdfBounds?: PDFBounds): boolean => {
-    const cropArea = getCropArea();
+  const isCropAreaValid = useCallback(
+    (pdfBounds?: PDFBounds): boolean => {
+      const cropArea = getCropArea();
 
-    // Basic validation
-    if (cropArea.x < 0 || cropArea.y < 0 || cropArea.width <= 0 || cropArea.height <= 0) {
-      return false;
-    }
+      // Basic validation
+      if (
+        cropArea.x < 0 ||
+        cropArea.y < 0 ||
+        cropArea.width <= 0 ||
+        cropArea.height <= 0
+      ) {
+        return false;
+      }
 
-    // PDF bounds validation if provided
-    if (pdfBounds) {
-      const tolerance = 0.01; // Small tolerance for floating point precision
-      return cropArea.x + cropArea.width <= pdfBounds.actualWidth + tolerance &&
-             cropArea.y + cropArea.height <= pdfBounds.actualHeight + tolerance;
-    }
+      // PDF bounds validation if provided
+      if (pdfBounds) {
+        const tolerance = 0.01; // Small tolerance for floating point precision
+        return (
+          cropArea.x + cropArea.width <= pdfBounds.actualWidth + tolerance &&
+          cropArea.y + cropArea.height <= pdfBounds.actualHeight + tolerance
+        );
+      }
 
-    return true;
-  }, [getCropArea]);
+      return true;
+    },
+    [getCropArea],
+  );
 
   // Check if crop area covers the entire PDF
-  const isFullPDFCrop = useCallback((pdfBounds?: PDFBounds): boolean => {
-    if (!pdfBounds) return false;
+  const isFullPDFCrop = useCallback(
+    (pdfBounds?: PDFBounds): boolean => {
+      if (!pdfBounds) return false;
 
-    const cropArea = getCropArea();
-    const tolerance = 0.5; // Allow 0.5 point tolerance for floating point precision
+      const cropArea = getCropArea();
+      const tolerance = 0.5; // Allow 0.5 point tolerance for floating point precision
 
-    return Math.abs(cropArea.x) < tolerance &&
-           Math.abs(cropArea.y) < tolerance &&
-           Math.abs(cropArea.width - pdfBounds.actualWidth) < tolerance &&
-           Math.abs(cropArea.height - pdfBounds.actualHeight) < tolerance;
-  }, [getCropArea]);
+      return (
+        Math.abs(cropArea.x) < tolerance &&
+        Math.abs(cropArea.y) < tolerance &&
+        Math.abs(cropArea.width - pdfBounds.actualWidth) < tolerance &&
+        Math.abs(cropArea.height - pdfBounds.actualHeight) < tolerance
+      );
+    },
+    [getCropArea],
+  );
 
   // Update crop area with constraints applied
-  const updateCropAreaConstrained = useCallback((
-    partialCropArea: Partial<Rectangle>,
-    pdfBounds?: PDFBounds
-  ) => {
-    const currentCropArea = getCropArea();
-    const newCropArea = { ...currentCropArea, ...partialCropArea };
-    setCropArea(newCropArea, pdfBounds);
-  }, [getCropArea, setCropArea]);
+  const updateCropAreaConstrained = useCallback(
+    (partialCropArea: Partial<Rectangle>, pdfBounds?: PDFBounds) => {
+      const currentCropArea = getCropArea();
+      const newCropArea = { ...currentCropArea, ...partialCropArea };
+      setCropArea(newCropArea, pdfBounds);
+    },
+    [getCropArea, setCropArea],
+  );
 
   // Enhanced validation that considers PDF bounds
-  const validateParameters = useCallback((pdfBounds?: PDFBounds): boolean => {
-    return baseHook.validateParameters() && isCropAreaValid(pdfBounds);
-  }, [baseHook, isCropAreaValid]);
+  const validateParameters = useCallback(
+    (pdfBounds?: PDFBounds): boolean => {
+      return baseHook.validateParameters() && isCropAreaValid(pdfBounds);
+    },
+    [baseHook, isCropAreaValid],
+  );
 
   // Override updateParameter to ensure positive values
-  const updateParameter = useCallback(<K extends keyof CropParameters>(
-    parameter: K,
-    value: CropParameters[K]
-  ) => {
-
-    if(isRectangle(value)) {
-      value.x = Math.max(0.1, value.x); // Minimum 0.1 point
-      value.x = Math.max(0.1, value.y); // Minimum 0.1 point
-      value.width = Math.max(0, value.width); // Minimum 0 point
-      value.height = Math.max(0, value.height); // Minimum 0 point
-    }
-
-    baseHook.updateParameter(parameter, value);
-  }, [baseHook]);
+  const updateParameter = useCallback(
+    <K extends keyof CropParameters>(
+      parameter: K,
+      value: CropParameters[K],
+    ) => {
+      if (isRectangle(value)) {
+        value.x = Math.max(0.1, value.x); // Minimum 0.1 point
+        value.x = Math.max(0.1, value.y); // Minimum 0.1 point
+        value.width = Math.max(0, value.width); // Minimum 0 point
+        value.height = Math.max(0, value.height); // Minimum 0 point
+      }
 
+      baseHook.updateParameter(parameter, value);
+    },
+    [baseHook],
+  );
 
   return {
     ...baseHook,
diff --git a/frontend/src/core/hooks/tools/editTableOfContents/useEditTableOfContentsOperation.ts b/frontend/src/core/hooks/tools/editTableOfContents/useEditTableOfContentsOperation.ts
index 58878d8115..7f94008503 100644
--- a/frontend/src/core/hooks/tools/editTableOfContents/useEditTableOfContentsOperation.ts
+++ b/frontend/src/core/hooks/tools/editTableOfContents/useEditTableOfContentsOperation.ts
@@ -1,31 +1,44 @@
-import { useTranslation } from 'react-i18next';
-import { ToolType, type ToolOperationConfig, useToolOperation } from '@app/hooks/tools/shared/useToolOperation';
-import { createStandardErrorHandler } from '@app/utils/toolErrorHandler';
-import { EditTableOfContentsParameters } from '@app/hooks/tools/editTableOfContents/useEditTableOfContentsParameters';
-import { serializeBookmarkNodes } from '@app/utils/editTableOfContents';
+import { useTranslation } from "react-i18next";
+import {
+  ToolType,
+  type ToolOperationConfig,
+  useToolOperation,
+} from "@app/hooks/tools/shared/useToolOperation";
+import { createStandardErrorHandler } from "@app/utils/toolErrorHandler";
+import { EditTableOfContentsParameters } from "@app/hooks/tools/editTableOfContents/useEditTableOfContentsParameters";
+import { serializeBookmarkNodes } from "@app/utils/editTableOfContents";
 
-const buildFormData = (parameters: EditTableOfContentsParameters, file: File): FormData => {
+const buildFormData = (
+  parameters: EditTableOfContentsParameters,
+  file: File,
+): FormData => {
   const formData = new FormData();
-  formData.append('fileInput', file);
-  formData.append('replaceExisting', String(parameters.replaceExisting));
-  formData.append('bookmarkData', JSON.stringify(serializeBookmarkNodes(parameters.bookmarks)));
+  formData.append("fileInput", file);
+  formData.append("replaceExisting", String(parameters.replaceExisting));
+  formData.append(
+    "bookmarkData",
+    JSON.stringify(serializeBookmarkNodes(parameters.bookmarks)),
+  );
   return formData;
 };
 
-export const editTableOfContentsOperationConfig: ToolOperationConfig<EditTableOfContentsParameters> = {
-  toolType: ToolType.singleFile,
-  operationType: 'editTableOfContents',
-  endpoint: '/api/v1/general/edit-table-of-contents',
-  buildFormData,
-};
+export const editTableOfContentsOperationConfig: ToolOperationConfig<EditTableOfContentsParameters> =
+  {
+    toolType: ToolType.singleFile,
+    operationType: "editTableOfContents",
+    endpoint: "/api/v1/general/edit-table-of-contents",
+    buildFormData,
+  };
 
 export const useEditTableOfContentsOperation = () => {
   const { t } = useTranslation();
   return useToolOperation<EditTableOfContentsParameters>({
     ...editTableOfContentsOperationConfig,
     getErrorMessage: createStandardErrorHandler(
-      t('editTableOfContents.error.failed', 'Failed to update the table of contents')
+      t(
+        "editTableOfContents.error.failed",
+        "Failed to update the table of contents",
+      ),
     ),
   });
 };
-
diff --git a/frontend/src/core/hooks/tools/editTableOfContents/useEditTableOfContentsParameters.ts b/frontend/src/core/hooks/tools/editTableOfContents/useEditTableOfContentsParameters.ts
index 5c68661682..2974681470 100644
--- a/frontend/src/core/hooks/tools/editTableOfContents/useEditTableOfContentsParameters.ts
+++ b/frontend/src/core/hooks/tools/editTableOfContents/useEditTableOfContentsParameters.ts
@@ -1,6 +1,9 @@
-import { useCallback } from 'react';
-import { useBaseParameters, type BaseParametersHook } from '@app/hooks/tools/shared/useBaseParameters';
-import { BookmarkNode } from '@app/utils/editTableOfContents';
+import { useCallback } from "react";
+import {
+  useBaseParameters,
+  type BaseParametersHook,
+} from "@app/hooks/tools/shared/useBaseParameters";
+import { BookmarkNode } from "@app/utils/editTableOfContents";
 
 export interface EditTableOfContentsParameters {
   replaceExisting: boolean;
@@ -16,22 +19,25 @@ const defaultParameters: EditTableOfContentsParameters = {
   bookmarks: [],
 };
 
-export const useEditTableOfContentsParameters = (): EditTableOfContentsParametersHook => {
-  const base = useBaseParameters<EditTableOfContentsParameters>({
-    defaultParameters,
-    endpointName: 'edit-table-of-contents',
-  });
+export const useEditTableOfContentsParameters =
+  (): EditTableOfContentsParametersHook => {
+    const base = useBaseParameters<EditTableOfContentsParameters>({
+      defaultParameters,
+      endpointName: "edit-table-of-contents",
+    });
 
-  const setBookmarks = useCallback((bookmarks: BookmarkNode[]) => {
-    base.setParameters(prev => ({
-      ...prev,
-      bookmarks,
-    }));
-  }, [base.setParameters]);
+    const setBookmarks = useCallback(
+      (bookmarks: BookmarkNode[]) => {
+        base.setParameters((prev) => ({
+          ...prev,
+          bookmarks,
+        }));
+      },
+      [base.setParameters],
+    );
 
-  return {
-    ...base,
-    setBookmarks,
+    return {
+      ...base,
+      setBookmarks,
+    };
   };
-};
-
diff --git a/frontend/src/core/hooks/tools/extractImages/useExtractImagesOperation.ts b/frontend/src/core/hooks/tools/extractImages/useExtractImagesOperation.ts
index ac691baf08..e52a9d6f2e 100644
--- a/frontend/src/core/hooks/tools/extractImages/useExtractImagesOperation.ts
+++ b/frontend/src/core/hooks/tools/extractImages/useExtractImagesOperation.ts
@@ -1,12 +1,21 @@
-import { useCallback } from 'react';
-import { useTranslation } from 'react-i18next';
-import { useToolOperation, ToolType } from '@app/hooks/tools/shared/useToolOperation';
-import { createStandardErrorHandler } from '@app/utils/toolErrorHandler';
-import { ExtractImagesParameters, defaultParameters } from '@app/hooks/tools/extractImages/useExtractImagesParameters';
-import { useToolResources } from '@app/hooks/tools/shared/useToolResources';
+import { useCallback } from "react";
+import { useTranslation } from "react-i18next";
+import {
+  useToolOperation,
+  ToolType,
+} from "@app/hooks/tools/shared/useToolOperation";
+import { createStandardErrorHandler } from "@app/utils/toolErrorHandler";
+import {
+  ExtractImagesParameters,
+  defaultParameters,
+} from "@app/hooks/tools/extractImages/useExtractImagesParameters";
+import { useToolResources } from "@app/hooks/tools/shared/useToolResources";
 
 // Static configuration that can be used by both the hook and automation executor
-export const buildExtractImagesFormData = (parameters: ExtractImagesParameters, file: File): FormData => {
+export const buildExtractImagesFormData = (
+  parameters: ExtractImagesParameters,
+  file: File,
+): FormData => {
   const formData = new FormData();
   formData.append("fileInput", file);
   formData.append("format", parameters.format);
@@ -18,8 +27,8 @@ export const buildExtractImagesFormData = (parameters: ExtractImagesParameters,
 export const extractImagesOperationConfig = {
   toolType: ToolType.singleFile,
   buildFormData: buildExtractImagesFormData,
-  operationType: 'extractImages',
-  endpoint: '/api/v1/misc/extract-images',
+  operationType: "extractImages",
+  endpoint: "/api/v1/misc/extract-images",
   defaultParameters,
 } as const;
 
@@ -28,14 +37,22 @@ export const useExtractImagesOperation = () => {
   const { extractZipFiles } = useToolResources();
 
   // Response handler that respects auto-unzip preferences
-  const responseHandler = useCallback(async (blob: Blob, _originalFiles: File[]): Promise<File[]> => {
-    // Extract images returns a ZIP file - use preference-aware extraction
-    return await extractZipFiles(blob);
-  }, [extractZipFiles]);
+  const responseHandler = useCallback(
+    async (blob: Blob, _originalFiles: File[]): Promise<File[]> => {
+      // Extract images returns a ZIP file - use preference-aware extraction
+      return await extractZipFiles(blob);
+    },
+    [extractZipFiles],
+  );
 
   return useToolOperation<ExtractImagesParameters>({
     ...extractImagesOperationConfig,
     responseHandler,
-    getErrorMessage: createStandardErrorHandler(t('extractImages.error.failed', 'An error occurred while extracting images from the PDF.'))
+    getErrorMessage: createStandardErrorHandler(
+      t(
+        "extractImages.error.failed",
+        "An error occurred while extracting images from the PDF.",
+      ),
+    ),
   });
-};
\ No newline at end of file
+};
diff --git a/frontend/src/core/hooks/tools/extractImages/useExtractImagesParameters.ts b/frontend/src/core/hooks/tools/extractImages/useExtractImagesParameters.ts
index 4321bfe9f2..5d8805c465 100644
--- a/frontend/src/core/hooks/tools/extractImages/useExtractImagesParameters.ts
+++ b/frontend/src/core/hooks/tools/extractImages/useExtractImagesParameters.ts
@@ -1,19 +1,19 @@
-import { useBaseParameters } from '@app/hooks/tools/shared/useBaseParameters';
+import { useBaseParameters } from "@app/hooks/tools/shared/useBaseParameters";
 
 export interface ExtractImagesParameters {
-  format: 'png' | 'jpg' | 'gif';
+  format: "png" | "jpg" | "gif";
   // allowDuplicates: boolean;
 }
 
 export const defaultParameters: ExtractImagesParameters = {
-  format: 'png',
+  format: "png",
   // allowDuplicates: false,
 };
 
 export const useExtractImagesParameters = () => {
   return useBaseParameters<ExtractImagesParameters>({
     defaultParameters,
-    endpointName: 'extract-images',
+    endpointName: "extract-images",
     validateFn: () => true, // All parameters have valid defaults
   });
-};
\ No newline at end of file
+};
diff --git a/frontend/src/core/hooks/tools/extractPages/useExtractPagesOperation.ts b/frontend/src/core/hooks/tools/extractPages/useExtractPagesOperation.ts
index 687dde1700..4119ed191b 100644
--- a/frontend/src/core/hooks/tools/extractPages/useExtractPagesOperation.ts
+++ b/frontend/src/core/hooks/tools/extractPages/useExtractPagesOperation.ts
@@ -1,20 +1,33 @@
-import apiClient from '@app/services/apiClient';
-import { useTranslation } from 'react-i18next';
-import { ToolType, useToolOperation, CustomProcessorResult } from '@app/hooks/tools/shared/useToolOperation';
-import { createStandardErrorHandler } from '@app/utils/toolErrorHandler';
-import { ExtractPagesParameters, defaultParameters } from '@app/hooks/tools/extractPages/useExtractPagesParameters';
-import { pdfWorkerManager } from '@app/services/pdfWorkerManager';
-import { parseSelection } from '@app/utils/bulkselection/parseSelection';
+import apiClient from "@app/services/apiClient";
+import { useTranslation } from "react-i18next";
+import {
+  ToolType,
+  useToolOperation,
+  CustomProcessorResult,
+} from "@app/hooks/tools/shared/useToolOperation";
+import { createStandardErrorHandler } from "@app/utils/toolErrorHandler";
+import {
+  ExtractPagesParameters,
+  defaultParameters,
+} from "@app/hooks/tools/extractPages/useExtractPagesParameters";
+import { pdfWorkerManager } from "@app/services/pdfWorkerManager";
+import { parseSelection } from "@app/utils/bulkselection/parseSelection";
 
 // Convert advanced page selection expression into CSV of explicit one-based page numbers
-async function resolveSelectionToCsv(expression: string, file: File): Promise<string> {
+async function resolveSelectionToCsv(
+  expression: string,
+  file: File,
+): Promise<string> {
   // Load PDF to determine max pages
   const arrayBuffer = await file.arrayBuffer();
-  const pdf = await pdfWorkerManager.createDocument(arrayBuffer, { disableAutoFetch: true, disableStream: true });
+  const pdf = await pdfWorkerManager.createDocument(arrayBuffer, {
+    disableAutoFetch: true,
+    disableStream: true,
+  });
   try {
     const maxPages = pdf.numPages;
-    const pages = parseSelection(expression || '', maxPages);
-    return pages.join(',');
+    const pages = parseSelection(expression || "", maxPages);
+    return pages.join(",");
   } finally {
     pdfWorkerManager.destroyDocument(pdf);
   }
@@ -22,8 +35,11 @@ async function resolveSelectionToCsv(expression: string, file: File): Promise<st
 
 export const extractPagesOperationConfig = {
   toolType: ToolType.custom,
-  operationType: 'extractPages',
-  customProcessor: async (parameters: ExtractPagesParameters, files: File[]): Promise<CustomProcessorResult> => {
+  operationType: "extractPages",
+  customProcessor: async (
+    parameters: ExtractPagesParameters,
+    files: File[],
+  ): Promise<CustomProcessorResult> => {
     const outputs: File[] = [];
 
     for (const file of files) {
@@ -31,15 +47,21 @@ export const extractPagesOperationConfig = {
       const csv = await resolveSelectionToCsv(parameters.pageNumbers, file);
 
       const formData = new FormData();
-      formData.append('fileInput', file);
-      formData.append('pageNumbers', csv);
+      formData.append("fileInput", file);
+      formData.append("pageNumbers", csv);
 
-      const response = await apiClient.post('/api/v1/general/rearrange-pages', formData, { responseType: 'blob' });
+      const response = await apiClient.post(
+        "/api/v1/general/rearrange-pages",
+        formData,
+        { responseType: "blob" },
+      );
 
       // Name output file with suffix
-      const base = (file.name || 'document.pdf').replace(/\.[^.]+$/, '');
+      const base = (file.name || "document.pdf").replace(/\.[^.]+$/, "");
       const outName = `${base}_extracted_pages.pdf`;
-      const outFile = new File([response.data], outName, { type: 'application/pdf' });
+      const outFile = new File([response.data], outName, {
+        type: "application/pdf",
+      });
       outputs.push(outFile);
     }
 
@@ -55,8 +77,8 @@ export const useExtractPagesOperation = () => {
   const { t } = useTranslation();
   return useToolOperation<ExtractPagesParameters>({
     ...extractPagesOperationConfig,
-    getErrorMessage: createStandardErrorHandler(t('extractPages.error.failed', 'Failed to extract pages'))
+    getErrorMessage: createStandardErrorHandler(
+      t("extractPages.error.failed", "Failed to extract pages"),
+    ),
   });
 };
-
-
diff --git a/frontend/src/core/hooks/tools/extractPages/useExtractPagesParameters.ts b/frontend/src/core/hooks/tools/extractPages/useExtractPagesParameters.ts
index 8ff2201662..60bb2b5848 100644
--- a/frontend/src/core/hooks/tools/extractPages/useExtractPagesParameters.ts
+++ b/frontend/src/core/hooks/tools/extractPages/useExtractPagesParameters.ts
@@ -1,22 +1,24 @@
-import { BaseParameters } from '@app/types/parameters';
-import { useBaseParameters, BaseParametersHook } from '@app/hooks/tools/shared/useBaseParameters';
+import { BaseParameters } from "@app/types/parameters";
+import {
+  useBaseParameters,
+  BaseParametersHook,
+} from "@app/hooks/tools/shared/useBaseParameters";
 
 export interface ExtractPagesParameters extends BaseParameters {
   pageNumbers: string;
 }
 
 export const defaultParameters: ExtractPagesParameters = {
-  pageNumbers: '',
+  pageNumbers: "",
 };
 
-export type ExtractPagesParametersHook = BaseParametersHook<ExtractPagesParameters>;
+export type ExtractPagesParametersHook =
+  BaseParametersHook<ExtractPagesParameters>;
 
 export const useExtractPagesParameters = (): ExtractPagesParametersHook => {
   return useBaseParameters({
     defaultParameters,
-    endpointName: 'rearrange-pages',
-    validateFn: (p) => (p.pageNumbers || '').trim().length > 0,
+    endpointName: "rearrange-pages",
+    validateFn: (p) => (p.pageNumbers || "").trim().length > 0,
   });
 };
-
-
diff --git a/frontend/src/core/hooks/tools/flatten/useFlattenOperation.ts b/frontend/src/core/hooks/tools/flatten/useFlattenOperation.ts
index 49b83a0bb1..9138b824ed 100644
--- a/frontend/src/core/hooks/tools/flatten/useFlattenOperation.ts
+++ b/frontend/src/core/hooks/tools/flatten/useFlattenOperation.ts
@@ -1,15 +1,24 @@
-import { useTranslation } from 'react-i18next';
-import { ToolType, useToolOperation } from '@app/hooks/tools/shared/useToolOperation';
-import { createStandardErrorHandler } from '@app/utils/toolErrorHandler';
-import { FlattenParameters, defaultParameters } from '@app/hooks/tools/flatten/useFlattenParameters';
+import { useTranslation } from "react-i18next";
+import {
+  ToolType,
+  useToolOperation,
+} from "@app/hooks/tools/shared/useToolOperation";
+import { createStandardErrorHandler } from "@app/utils/toolErrorHandler";
+import {
+  FlattenParameters,
+  defaultParameters,
+} from "@app/hooks/tools/flatten/useFlattenParameters";
 
 // Static function that can be used by both the hook and automation executor
-export const buildFlattenFormData = (parameters: FlattenParameters, file: File): FormData => {
+export const buildFlattenFormData = (
+  parameters: FlattenParameters,
+  file: File,
+): FormData => {
   const formData = new FormData();
-  formData.append('fileInput', file);
-  formData.append('flattenOnlyForms', parameters.flattenOnlyForms.toString());
+  formData.append("fileInput", file);
+  formData.append("flattenOnlyForms", parameters.flattenOnlyForms.toString());
   if (parameters.renderDpi != null) {
-    formData.append('renderDpi', parameters.renderDpi.toString());
+    formData.append("renderDpi", parameters.renderDpi.toString());
   }
   return formData;
 };
@@ -18,8 +27,8 @@ export const buildFlattenFormData = (parameters: FlattenParameters, file: File):
 export const flattenOperationConfig = {
   toolType: ToolType.singleFile,
   buildFormData: buildFlattenFormData,
-  operationType: 'flatten',
-  endpoint: '/api/v1/misc/flatten',
+  operationType: "flatten",
+  endpoint: "/api/v1/misc/flatten",
   multiFileEndpoint: false,
   defaultParameters,
 } as const;
@@ -29,6 +38,8 @@ export const useFlattenOperation = () => {
 
   return useToolOperation<FlattenParameters>({
     ...flattenOperationConfig,
-    getErrorMessage: createStandardErrorHandler(t('flatten.error.failed', 'An error occurred while flattening the PDF.'))
+    getErrorMessage: createStandardErrorHandler(
+      t("flatten.error.failed", "An error occurred while flattening the PDF."),
+    ),
   });
 };
diff --git a/frontend/src/core/hooks/tools/flatten/useFlattenParameters.ts b/frontend/src/core/hooks/tools/flatten/useFlattenParameters.ts
index 3a383d6740..cba98c6cbe 100644
--- a/frontend/src/core/hooks/tools/flatten/useFlattenParameters.ts
+++ b/frontend/src/core/hooks/tools/flatten/useFlattenParameters.ts
@@ -1,5 +1,8 @@
-import { BaseParameters } from '@app/types/parameters';
-import { useBaseParameters, BaseParametersHook } from '@app/hooks/tools/shared/useBaseParameters';
+import { BaseParameters } from "@app/types/parameters";
+import {
+  useBaseParameters,
+  BaseParametersHook,
+} from "@app/hooks/tools/shared/useBaseParameters";
 
 export interface FlattenParameters extends BaseParameters {
   flattenOnlyForms: boolean;
@@ -16,6 +19,6 @@ export type FlattenParametersHook = BaseParametersHook<FlattenParameters>;
 export const useFlattenParameters = (): FlattenParametersHook => {
   return useBaseParameters({
     defaultParameters,
-    endpointName: 'flatten',
+    endpointName: "flatten",
   });
-};
\ No newline at end of file
+};
diff --git a/frontend/src/core/hooks/tools/getPdfInfo/useGetPdfInfoOperation.ts b/frontend/src/core/hooks/tools/getPdfInfo/useGetPdfInfoOperation.ts
index 019968bcac..d52dc5c326 100644
--- a/frontend/src/core/hooks/tools/getPdfInfo/useGetPdfInfoOperation.ts
+++ b/frontend/src/core/hooks/tools/getPdfInfo/useGetPdfInfoOperation.ts
@@ -1,15 +1,12 @@
-import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
-import { useTranslation } from 'react-i18next';
-import apiClient from '@app/services/apiClient';
-import { useFileContext } from '@app/contexts/file/fileHooks';
-import { ToolOperationHook } from '@app/hooks/tools/shared/useToolOperation';
-import type { StirlingFile } from '@app/types/fileContext';
-import { extractErrorMessage } from '@app/utils/toolErrorHandler';
-import {
-  PdfInfoReportEntry,
-  INFO_JSON_FILENAME,
-} from '@app/types/getPdfInfo';
-import type { GetPdfInfoParameters } from '@app/hooks/tools/getPdfInfo/useGetPdfInfoParameters';
+import { useCallback, useEffect, useMemo, useRef, useState } from "react";
+import { useTranslation } from "react-i18next";
+import apiClient from "@app/services/apiClient";
+import { useFileContext } from "@app/contexts/file/fileHooks";
+import { ToolOperationHook } from "@app/hooks/tools/shared/useToolOperation";
+import type { StirlingFile } from "@app/types/fileContext";
+import { extractErrorMessage } from "@app/utils/toolErrorHandler";
+import { PdfInfoReportEntry, INFO_JSON_FILENAME } from "@app/types/getPdfInfo";
+import type { GetPdfInfoParameters } from "@app/hooks/tools/getPdfInfo/useGetPdfInfoParameters";
 
 export interface GetPdfInfoOperationHook extends ToolOperationHook<GetPdfInfoParameters> {
   results: PdfInfoReportEntry[];
@@ -19,11 +16,11 @@ export const useGetPdfInfoOperation = (): GetPdfInfoOperationHook => {
   const { t } = useTranslation();
   const { selectors } = useFileContext();
   const [isLoading, setIsLoading] = useState(false);
-  const [status, setStatus] = useState('');
+  const [status, setStatus] = useState("");
   const [errorMessage, setErrorMessage] = useState<string | null>(null);
   const [files, setFiles] = useState<File[]>([]);
   const [downloadUrl, setDownloadUrl] = useState<string | null>(null);
-  const [downloadFilename, setDownloadFilename] = useState('');
+  const [downloadFilename, setDownloadFilename] = useState("");
   const [results, setResults] = useState<PdfInfoReportEntry[]>([]);
 
   const cancelRequested = useRef(false);
@@ -42,8 +39,8 @@ export const useGetPdfInfoOperation = (): GetPdfInfoOperationHook => {
     setFiles([]);
     cleanupDownloadUrl();
     setDownloadUrl(null);
-    setDownloadFilename('');
-    setStatus('');
+    setDownloadFilename("");
+    setStatus("");
     setErrorMessage(null);
   }, [cleanupDownloadUrl]);
 
@@ -54,19 +51,19 @@ export const useGetPdfInfoOperation = (): GetPdfInfoOperationHook => {
   const executeOperation = useCallback(
     async (_params: GetPdfInfoParameters, selectedFiles: StirlingFile[]) => {
       if (selectedFiles.length === 0) {
-        setErrorMessage(t('noFileSelected', 'No files selected'));
+        setErrorMessage(t("noFileSelected", "No files selected"));
         return;
       }
 
       cancelRequested.current = false;
       setIsLoading(true);
-      setStatus(t('getPdfInfo.processing', 'Extracting information...'));
+      setStatus(t("getPdfInfo.processing", "Extracting information..."));
       setErrorMessage(null);
       setResults([]);
       setFiles([]);
       cleanupDownloadUrl();
       setDownloadUrl(null);
-      setDownloadFilename('');
+      setDownloadFilename("");
 
       try {
         const aggregated: PdfInfoReportEntry[] = [];
@@ -76,12 +73,16 @@ export const useGetPdfInfoOperation = (): GetPdfInfoOperationHook => {
           if (cancelRequested.current) break;
 
           const formData = new FormData();
-          formData.append('fileInput', file);
+          formData.append("fileInput", file);
 
           try {
-            const response = await apiClient.post('/api/v1/security/get-info-on-pdf', formData, {
-              headers: { 'Content-Type': 'multipart/form-data' },
-            });
+            const response = await apiClient.post(
+              "/api/v1/security/get-info-on-pdf",
+              formData,
+              {
+                headers: { "Content-Type": "multipart/form-data" },
+              },
+            );
 
             const stub = selectors.getStirlingFileStub(file.fileId);
             const entry: PdfInfoReportEntry = {
@@ -119,31 +120,43 @@ export const useGetPdfInfoOperation = (): GetPdfInfoOperationHook => {
               .map((e) => e.data);
             const content = payloads.length === 1 ? payloads[0] : payloads;
             const json = JSON.stringify(content, null, 2);
-            const resultFile = new File([json], INFO_JSON_FILENAME, { type: 'application/json' });
+            const resultFile = new File([json], INFO_JSON_FILENAME, {
+              type: "application/json",
+            });
             setFiles([resultFile]);
           }
 
           const anyError = aggregated.some((item) => item.error);
           if (anyError) {
-            setErrorMessage(t('getPdfInfo.error.partial', 'Some files could not be processed.'));
+            setErrorMessage(
+              t(
+                "getPdfInfo.error.partial",
+                "Some files could not be processed.",
+              ),
+            );
           }
-          setStatus(t('getPdfInfo.status.complete', 'Extraction complete'));
+          setStatus(t("getPdfInfo.status.complete", "Extraction complete"));
         }
       } catch (e) {
-        console.error('[getPdfInfo] unexpected failure', e);
-        setErrorMessage(t('getPdfInfo.error.unexpected', 'Unexpected error during extraction.'));
+        console.error("[getPdfInfo] unexpected failure", e);
+        setErrorMessage(
+          t(
+            "getPdfInfo.error.unexpected",
+            "Unexpected error during extraction.",
+          ),
+        );
       } finally {
         setIsLoading(false);
       }
     },
-    [cleanupDownloadUrl, selectors, t]
+    [cleanupDownloadUrl, selectors, t],
   );
 
   const cancelOperation = useCallback(() => {
     if (isLoading) {
       cancelRequested.current = true;
       setIsLoading(false);
-      setStatus(t('operationCancelled', 'Operation cancelled'));
+      setStatus(t("operationCancelled", "Operation cancelled"));
     }
   }, [isLoading, t]);
 
@@ -187,8 +200,6 @@ export const useGetPdfInfoOperation = (): GetPdfInfoOperationHook => {
       resetResults,
       results,
       status,
-    ]
+    ],
   );
 };
-
-
diff --git a/frontend/src/core/hooks/tools/getPdfInfo/useGetPdfInfoParameters.ts b/frontend/src/core/hooks/tools/getPdfInfo/useGetPdfInfoParameters.ts
index 488484809a..61fd380a28 100644
--- a/frontend/src/core/hooks/tools/getPdfInfo/useGetPdfInfoParameters.ts
+++ b/frontend/src/core/hooks/tools/getPdfInfo/useGetPdfInfoParameters.ts
@@ -1,5 +1,8 @@
-import { BaseParameters } from '@app/types/parameters';
-import { useBaseParameters, BaseParametersHook } from '@app/hooks/tools/shared/useBaseParameters';
+import { BaseParameters } from "@app/types/parameters";
+import {
+  useBaseParameters,
+  BaseParametersHook,
+} from "@app/hooks/tools/shared/useBaseParameters";
 
 export interface GetPdfInfoParameters extends BaseParameters {
   // No parameters needed
@@ -12,8 +15,6 @@ export type GetPdfInfoParametersHook = BaseParametersHook<GetPdfInfoParameters>;
 export const useGetPdfInfoParameters = (): GetPdfInfoParametersHook => {
   return useBaseParameters({
     defaultParameters,
-    endpointName: 'get-info-on-pdf',
+    endpointName: "get-info-on-pdf",
   });
 };
-
-
diff --git a/frontend/src/core/hooks/tools/merge/useMergeOperation.test.ts b/frontend/src/core/hooks/tools/merge/useMergeOperation.test.ts
index bcdd621679..c637f2fe53 100644
--- a/frontend/src/core/hooks/tools/merge/useMergeOperation.test.ts
+++ b/frontend/src/core/hooks/tools/merge/useMergeOperation.test.ts
@@ -1,44 +1,50 @@
-import { describe, expect, test, vi, beforeEach } from 'vitest';
-import { renderHook } from '@testing-library/react';
-import { useMergeOperation } from '@app/hooks/tools/merge/useMergeOperation';
-import type { MergeParameters } from '@app/hooks/tools/merge/useMergeParameters';
+import { describe, expect, test, vi, beforeEach } from "vitest";
+import { renderHook } from "@testing-library/react";
+import { useMergeOperation } from "@app/hooks/tools/merge/useMergeOperation";
+import type { MergeParameters } from "@app/hooks/tools/merge/useMergeParameters";
 
 // Mock the useToolOperation hook
-vi.mock('../shared/useToolOperation', async () => {
-  const actual = await vi.importActual('../shared/useToolOperation');
+vi.mock("../shared/useToolOperation", async () => {
+  const actual = await vi.importActual("../shared/useToolOperation");
   return {
     ...actual,
-    useToolOperation: vi.fn()
+    useToolOperation: vi.fn(),
   };
 });
 
 // Mock the translation hook
 const mockT = vi.fn((key: string) => `translated-${key}`);
-vi.mock('react-i18next', () => ({
-  useTranslation: () => ({ t: mockT })
+vi.mock("react-i18next", () => ({
+  useTranslation: () => ({ t: mockT }),
 }));
 
 // Mock the error handler
-vi.mock('../../../utils/toolErrorHandler', () => ({
-  createStandardErrorHandler: vi.fn(() => 'error-handler-function')
+vi.mock("../../../utils/toolErrorHandler", () => ({
+  createStandardErrorHandler: vi.fn(() => "error-handler-function"),
 }));
 
 // Import the mocked function
-import { MultiFileToolOperationConfig, ToolOperationHook, useToolOperation } from '@app/hooks/tools/shared/useToolOperation';
+import {
+  MultiFileToolOperationConfig,
+  ToolOperationHook,
+  useToolOperation,
+} from "@app/hooks/tools/shared/useToolOperation";
 
-describe('useMergeOperation', () => {
+describe("useMergeOperation", () => {
   const mockUseToolOperation = vi.mocked(useToolOperation<MergeParameters>);
 
-  const getToolConfig = () => mockUseToolOperation.mock.calls[0][0] as MultiFileToolOperationConfig<MergeParameters>;
+  const getToolConfig = () =>
+    mockUseToolOperation.mock
+      .calls[0][0] as MultiFileToolOperationConfig<MergeParameters>;
 
   const mockToolOperationReturn: ToolOperationHook<unknown> = {
     files: [],
     thumbnails: [],
     downloadUrl: null,
-    downloadFilename: '',
+    downloadFilename: "",
     isLoading: false,
     errorMessage: null,
-    status: '',
+    status: "",
     isGeneratingThumbnails: false,
     progress: null,
     executeOperation: vi.fn(),
@@ -46,8 +52,8 @@ describe('useMergeOperation', () => {
     clearError: vi.fn(),
     cancelOperation: vi.fn(),
     undoOperation: function (): Promise<void> {
-      throw new Error('Function not implemented.');
-    }
+      throw new Error("Function not implemented.");
+    },
   };
 
   beforeEach(() => {
@@ -55,66 +61,71 @@ describe('useMergeOperation', () => {
     mockUseToolOperation.mockReturnValue(mockToolOperationReturn);
   });
 
-  test('should build FormData correctly', () => {
+  test("should build FormData correctly", () => {
     renderHook(() => useMergeOperation());
 
     const config = getToolConfig();
     const mockFiles = [
-      new File(['content1'], 'file1.pdf', { type: 'application/pdf' }),
-      new File(['content2'], 'file2.pdf', { type: 'application/pdf' })
+      new File(["content1"], "file1.pdf", { type: "application/pdf" }),
+      new File(["content2"], "file2.pdf", { type: "application/pdf" }),
     ];
     const parameters: MergeParameters = {
       removeDigitalSignature: true,
-      generateTableOfContents: false
+      generateTableOfContents: false,
     };
 
     const formData = config.buildFormData(parameters, mockFiles);
 
     // Verify files are appended
-    expect(formData.getAll('fileInput')).toHaveLength(2);
-    expect(formData.getAll('fileInput')[0]).toBe(mockFiles[0]);
-    expect(formData.getAll('fileInput')[1]).toBe(mockFiles[1]);
+    expect(formData.getAll("fileInput")).toHaveLength(2);
+    expect(formData.getAll("fileInput")[0]).toBe(mockFiles[0]);
+    expect(formData.getAll("fileInput")[1]).toBe(mockFiles[1]);
 
     // Verify parameters are appended correctly
-    expect(formData.get('sortType')).toBe('orderProvided');
-    expect(formData.get('removeCertSign')).toBe('true');
-    expect(formData.get('generateToc')).toBe('false');
+    expect(formData.get("sortType")).toBe("orderProvided");
+    expect(formData.get("removeCertSign")).toBe("true");
+    expect(formData.get("generateToc")).toBe("false");
   });
 
-  test('should return the hook result from useToolOperation', () => {
+  test("should return the hook result from useToolOperation", () => {
     const { result } = renderHook(() => useMergeOperation());
 
     expect(result.current).toBe(mockToolOperationReturn);
   });
 
-  test('should use correct translation keys for error handling', () => {
+  test("should use correct translation keys for error handling", () => {
     renderHook(() => useMergeOperation());
 
-    expect(mockT).toHaveBeenCalledWith('merge.error.failed', 'An error occurred while merging the PDFs.');
+    expect(mockT).toHaveBeenCalledWith(
+      "merge.error.failed",
+      "An error occurred while merging the PDFs.",
+    );
   });
 
-  test('should build FormData with different parameter combinations', () => {
+  test("should build FormData with different parameter combinations", () => {
     renderHook(() => useMergeOperation());
 
     const config = getToolConfig();
-    const mockFiles = [new File(['test'], 'test.pdf', { type: 'application/pdf' })];
+    const mockFiles = [
+      new File(["test"], "test.pdf", { type: "application/pdf" }),
+    ];
 
     // Test case 1: All options disabled
     const params1: MergeParameters = {
       removeDigitalSignature: false,
-      generateTableOfContents: false
+      generateTableOfContents: false,
     };
     const formData1 = config.buildFormData(params1, mockFiles);
-    expect(formData1.get('removeCertSign')).toBe('false');
-    expect(formData1.get('generateToc')).toBe('false');
+    expect(formData1.get("removeCertSign")).toBe("false");
+    expect(formData1.get("generateToc")).toBe("false");
 
     // Test case 2: All options enabled
     const params2: MergeParameters = {
       removeDigitalSignature: true,
-      generateTableOfContents: true
+      generateTableOfContents: true,
     };
     const formData2 = config.buildFormData(params2, mockFiles);
-    expect(formData2.get('removeCertSign')).toBe('true');
-    expect(formData2.get('generateToc')).toBe('true');
+    expect(formData2.get("removeCertSign")).toBe("true");
+    expect(formData2.get("generateToc")).toBe("true");
   });
 });
diff --git a/frontend/src/core/hooks/tools/merge/useMergeOperation.ts b/frontend/src/core/hooks/tools/merge/useMergeOperation.ts
index 3bed214796..f4e163a56d 100644
--- a/frontend/src/core/hooks/tools/merge/useMergeOperation.ts
+++ b/frontend/src/core/hooks/tools/merge/useMergeOperation.ts
@@ -1,20 +1,38 @@
-import { useTranslation } from 'react-i18next';
-import { useToolOperation, ToolOperationConfig, ToolType } from '@app/hooks/tools/shared/useToolOperation';
-import { createStandardErrorHandler } from '@app/utils/toolErrorHandler';
-import { MergeParameters, defaultParameters } from '@app/hooks/tools/merge/useMergeParameters';
+import { useTranslation } from "react-i18next";
+import {
+  useToolOperation,
+  ToolOperationConfig,
+  ToolType,
+} from "@app/hooks/tools/shared/useToolOperation";
+import { createStandardErrorHandler } from "@app/utils/toolErrorHandler";
+import {
+  MergeParameters,
+  defaultParameters,
+} from "@app/hooks/tools/merge/useMergeParameters";
 
-const buildFormData = (parameters: MergeParameters, files: File[]): FormData => {
+const buildFormData = (
+  parameters: MergeParameters,
+  files: File[],
+): FormData => {
   const formData = new FormData();
 
   files.forEach((file) => {
     formData.append("fileInput", file);
   });
   // Provide stable client file IDs (align with files order)
-  const clientIds: string[] = files.map((f: any) => String((f as any).fileId || f.name));
-  formData.append('clientFileIds', JSON.stringify(clientIds));
+  const clientIds: string[] = files.map((f: any) =>
+    String((f as any).fileId || f.name),
+  );
+  formData.append("clientFileIds", JSON.stringify(clientIds));
   formData.append("sortType", "orderProvided"); // Always use orderProvided since UI handles sorting
-  formData.append("removeCertSign", (parameters.removeDigitalSignature ?? false).toString());
-  formData.append("generateToc", (parameters.generateTableOfContents ?? false).toString());
+  formData.append(
+    "removeCertSign",
+    (parameters.removeDigitalSignature ?? false).toString(),
+  );
+  formData.append(
+    "generateToc",
+    (parameters.generateTableOfContents ?? false).toString(),
+  );
 
   return formData;
 };
@@ -23,9 +41,9 @@ const buildFormData = (parameters: MergeParameters, files: File[]): FormData =>
 export const mergeOperationConfig: ToolOperationConfig<MergeParameters> = {
   toolType: ToolType.multiFile,
   buildFormData,
-  operationType: 'merge',
-  endpoint: '/api/v1/general/merge-pdfs',
-  filePrefix: 'merged_',
+  operationType: "merge",
+  endpoint: "/api/v1/general/merge-pdfs",
+  filePrefix: "merged_",
   defaultParameters,
 };
 
@@ -34,6 +52,8 @@ export const useMergeOperation = () => {
 
   return useToolOperation<MergeParameters>({
     ...mergeOperationConfig,
-    getErrorMessage: createStandardErrorHandler(t('merge.error.failed', 'An error occurred while merging the PDFs.'))
+    getErrorMessage: createStandardErrorHandler(
+      t("merge.error.failed", "An error occurred while merging the PDFs."),
+    ),
   });
 };
diff --git a/frontend/src/core/hooks/tools/merge/useMergeParameters.test.ts b/frontend/src/core/hooks/tools/merge/useMergeParameters.test.ts
index d5fbf5ef91..ca86222ee4 100644
--- a/frontend/src/core/hooks/tools/merge/useMergeParameters.test.ts
+++ b/frontend/src/core/hooks/tools/merge/useMergeParameters.test.ts
@@ -1,20 +1,23 @@
-import { describe, expect, test } from 'vitest';
-import { renderHook, act } from '@testing-library/react';
-import { useMergeParameters, defaultParameters } from '@app/hooks/tools/merge/useMergeParameters';
+import { describe, expect, test } from "vitest";
+import { renderHook, act } from "@testing-library/react";
+import {
+  useMergeParameters,
+  defaultParameters,
+} from "@app/hooks/tools/merge/useMergeParameters";
 
-describe('useMergeParameters', () => {
-  test('should initialize with default parameters', () => {
+describe("useMergeParameters", () => {
+  test("should initialize with default parameters", () => {
     const { result } = renderHook(() => useMergeParameters());
 
     expect(result.current.parameters).toStrictEqual(defaultParameters);
   });
 
   test.each([
-    { paramName: 'removeDigitalSignature' as const, value: true },
-    { paramName: 'removeDigitalSignature' as const, value: false },
-    { paramName: 'generateTableOfContents' as const, value: true },
-    { paramName: 'generateTableOfContents' as const, value: false }
-  ])('should update parameter $paramName to $value', ({ paramName, value }) => {
+    { paramName: "removeDigitalSignature" as const, value: true },
+    { paramName: "removeDigitalSignature" as const, value: false },
+    { paramName: "generateTableOfContents" as const, value: true },
+    { paramName: "generateTableOfContents" as const, value: false },
+  ])("should update parameter $paramName to $value", ({ paramName, value }) => {
     const { result } = renderHook(() => useMergeParameters());
 
     act(() => {
@@ -24,13 +27,13 @@ describe('useMergeParameters', () => {
     expect(result.current.parameters[paramName]).toBe(value);
   });
 
-  test('should reset parameters to defaults', () => {
+  test("should reset parameters to defaults", () => {
     const { result } = renderHook(() => useMergeParameters());
 
     // First, change some parameters
     act(() => {
-      result.current.updateParameter('removeDigitalSignature', true);
-      result.current.updateParameter('generateTableOfContents', true);
+      result.current.updateParameter("removeDigitalSignature", true);
+      result.current.updateParameter("generateTableOfContents", true);
     });
 
     expect(result.current.parameters.removeDigitalSignature).toBe(true);
@@ -44,7 +47,7 @@ describe('useMergeParameters', () => {
     expect(result.current.parameters).toStrictEqual(defaultParameters);
   });
 
-  test('should validate parameters correctly - always returns true', () => {
+  test("should validate parameters correctly - always returns true", () => {
     const { result } = renderHook(() => useMergeParameters());
 
     // Default state should be valid
@@ -52,8 +55,8 @@ describe('useMergeParameters', () => {
 
     // Change parameters and validate again
     act(() => {
-      result.current.updateParameter('removeDigitalSignature', true);
-      result.current.updateParameter('generateTableOfContents', true);
+      result.current.updateParameter("removeDigitalSignature", true);
+      result.current.updateParameter("generateTableOfContents", true);
     });
 
     expect(result.current.validateParameters()).toBe(true);
diff --git a/frontend/src/core/hooks/tools/merge/useMergeParameters.ts b/frontend/src/core/hooks/tools/merge/useMergeParameters.ts
index b9b0c3b7a9..4bfa3534cf 100644
--- a/frontend/src/core/hooks/tools/merge/useMergeParameters.ts
+++ b/frontend/src/core/hooks/tools/merge/useMergeParameters.ts
@@ -1,10 +1,13 @@
-import { BaseParameters } from '@app/types/parameters';
-import { BaseParametersHook, useBaseParameters } from '@app/hooks/tools/shared/useBaseParameters';
+import { BaseParameters } from "@app/types/parameters";
+import {
+  BaseParametersHook,
+  useBaseParameters,
+} from "@app/hooks/tools/shared/useBaseParameters";
 
 export interface MergeParameters extends BaseParameters {
   removeDigitalSignature: boolean;
   generateTableOfContents: boolean;
-};
+}
 
 export const defaultParameters: MergeParameters = {
   removeDigitalSignature: false,
diff --git a/frontend/src/core/hooks/tools/ocr/useOCROperation.ts b/frontend/src/core/hooks/tools/ocr/useOCROperation.ts
index 8b3950e7f3..b7d6d56564 100644
--- a/frontend/src/core/hooks/tools/ocr/useOCROperation.ts
+++ b/frontend/src/core/hooks/tools/ocr/useOCROperation.ts
@@ -1,30 +1,41 @@
-import { useCallback } from 'react';
-import { useTranslation } from 'react-i18next';
-import { OCRParameters, defaultParameters } from '@app/hooks/tools/ocr/useOCRParameters';
-import { useToolOperation, ToolOperationConfig, ToolType } from '@app/hooks/tools/shared/useToolOperation';
-import { createStandardErrorHandler } from '@app/utils/toolErrorHandler';
-import { useToolResources } from '@app/hooks/tools/shared/useToolResources';
+import { useCallback } from "react";
+import { useTranslation } from "react-i18next";
+import {
+  OCRParameters,
+  defaultParameters,
+} from "@app/hooks/tools/ocr/useOCRParameters";
+import {
+  useToolOperation,
+  ToolOperationConfig,
+  ToolType,
+} from "@app/hooks/tools/shared/useToolOperation";
+import { createStandardErrorHandler } from "@app/utils/toolErrorHandler";
+import { useToolResources } from "@app/hooks/tools/shared/useToolResources";
 
 // Helper: get MIME type based on file extension
 function getMimeType(filename: string): string {
-  const ext = filename.toLowerCase().split('.').pop();
+  const ext = filename.toLowerCase().split(".").pop();
   switch (ext) {
-    case 'pdf': return 'application/pdf';
-    case 'txt': return 'text/plain';
-    case 'zip': return 'application/zip';
-    default: return 'application/octet-stream';
+    case "pdf":
+      return "application/pdf";
+    case "txt":
+      return "text/plain";
+    case "zip":
+      return "application/zip";
+    default:
+      return "application/octet-stream";
   }
 }
 
 // Lightweight ZIP extractor (keep or replace with a shared util if you have one)
 async function extractZipFile(zipBlob: Blob): Promise<File[]> {
-  const JSZip = await import('jszip');
+  const JSZip = await import("jszip");
   const zip = new JSZip.default();
   const zipContent = await zip.loadAsync(await zipBlob.arrayBuffer());
   const out: File[] = [];
   for (const [filename, file] of Object.entries(zipContent.files)) {
     if (!file.dir) {
-      const content = await file.async('blob');
+      const content = await file.async("blob");
       out.push(new File([content], filename, { type: getMimeType(filename) }));
     }
   }
@@ -33,73 +44,89 @@ async function extractZipFile(zipBlob: Blob): Promise<File[]> {
 
 // Helper: strip extension
 function stripExt(name: string): string {
-  const i = name.lastIndexOf('.');
+  const i = name.lastIndexOf(".");
   return i > 0 ? name.slice(0, i) : name;
 }
 
 // Static function that can be used by both the hook and automation executor
-export const buildOCRFormData = (parameters: OCRParameters, file: File): FormData => {
+export const buildOCRFormData = (
+  parameters: OCRParameters,
+  file: File,
+): FormData => {
   const formData = new FormData();
-  formData.append('fileInput', file);
-  parameters.languages.forEach((lang) => formData.append('languages', lang));
-  formData.append('ocrType', parameters.ocrType);
-  formData.append('ocrRenderType', parameters.ocrRenderType);
-  
+  formData.append("fileInput", file);
+  parameters.languages.forEach((lang) => formData.append("languages", lang));
+  formData.append("ocrType", parameters.ocrType);
+  formData.append("ocrRenderType", parameters.ocrRenderType);
+
   const options = parameters.additionalOptions || [];
-  formData.append('sidecar', options.includes('sidecar').toString());
-  formData.append('deskew', options.includes('deskew').toString());
-  formData.append('clean', options.includes('clean').toString());
-  formData.append('cleanFinal', options.includes('cleanFinal').toString());
-  formData.append('removeImagesAfter', options.includes('removeImagesAfter').toString());
+  formData.append("sidecar", options.includes("sidecar").toString());
+  formData.append("deskew", options.includes("deskew").toString());
+  formData.append("clean", options.includes("clean").toString());
+  formData.append("cleanFinal", options.includes("cleanFinal").toString());
+  formData.append(
+    "removeImagesAfter",
+    options.includes("removeImagesAfter").toString(),
+  );
   return formData;
 };
 
 // Static response handler for OCR - can be used by automation executor
-export const ocrResponseHandler = async (blob: Blob, originalFiles: File[], extractZipFiles: (blob: Blob) => Promise<File[]>): Promise<File[]> => {
+export const ocrResponseHandler = async (
+  blob: Blob,
+  originalFiles: File[],
+  extractZipFiles: (blob: Blob) => Promise<File[]>,
+): Promise<File[]> => {
   const headBuf = await blob.slice(0, 8).arrayBuffer();
   const head = new TextDecoder().decode(new Uint8Array(headBuf));
 
   // ZIP: sidecar or multi-asset output
-  if (head.startsWith('PK')) {
+  if (head.startsWith("PK")) {
     const base = stripExt(originalFiles[0].name);
     try {
       const extractedFiles = await extractZipFiles(blob);
       if (extractedFiles.length > 0) return extractedFiles;
-    } catch { /* ignore and try local extractor */ }
+    } catch {
+      /* ignore and try local extractor */
+    }
     try {
       const local = await extractZipFile(blob); // local fallback
       if (local.length > 0) return local;
-    } catch { /* fall through */ }
-    return [new File([blob], `ocr_${base}.zip`, { type: 'application/zip' })];
+    } catch {
+      /* fall through */
+    }
+    return [new File([blob], `ocr_${base}.zip`, { type: "application/zip" })];
   }
 
   // Not a PDF: surface error details if present
-  if (!head.startsWith('%PDF')) {
+  if (!head.startsWith("%PDF")) {
     const textBuf = await blob.slice(0, 1024).arrayBuffer();
     const text = new TextDecoder().decode(new Uint8Array(textBuf));
     if (/error|exception|html/i.test(text)) {
-      if (text.includes('OCR tools') && text.includes('not installed')) {
-        throw new Error('OCR tools (OCRmyPDF or Tesseract) are not installed on the server. Use the standard or fat Docker image instead of ultra-lite, or install OCR tools manually.');
+      if (text.includes("OCR tools") && text.includes("not installed")) {
+        throw new Error(
+          "OCR tools (OCRmyPDF or Tesseract) are not installed on the server. Use the standard or fat Docker image instead of ultra-lite, or install OCR tools manually.",
+        );
       }
       const title =
         text.match(/<title[^>]*>([^<]+)<\/title>/i)?.[1] ||
         text.match(/<h1[^>]*>([^<]+)<\/h1>/i)?.[1] ||
-        'Unknown error';
+        "Unknown error";
       throw new Error(`OCR service error: ${title}`);
     }
     throw new Error(`Response is not a valid PDF. Header: "${head}"`);
   }
 
   const originalName = originalFiles[0].name;
-  return [new File([blob], originalName, { type: 'application/pdf' })];
+  return [new File([blob], originalName, { type: "application/pdf" })];
 };
 
 // Static configuration object (without t function dependencies)
 export const ocrOperationConfig = {
   toolType: ToolType.singleFile,
   buildFormData: buildOCRFormData,
-  operationType: 'ocr',
-  endpoint: '/api/v1/misc/ocr-pdf',
+  operationType: "ocr",
+  endpoint: "/api/v1/misc/ocr-pdf",
   defaultParameters,
 } as const;
 
@@ -108,19 +135,25 @@ export const useOCROperation = () => {
   const { extractZipFiles } = useToolResources();
 
   // OCR-specific parsing: ZIP (sidecar) vs PDF vs HTML error
-  const responseHandler = useCallback(async (blob: Blob, originalFiles: File[]): Promise<File[]> => {
-    // extractZipFiles from useToolResources already returns File[] directly
-    const simpleExtractZipFiles = extractZipFiles;
-    return ocrResponseHandler(blob, originalFiles, simpleExtractZipFiles);
-  }, [extractZipFiles]);
+  const responseHandler = useCallback(
+    async (blob: Blob, originalFiles: File[]): Promise<File[]> => {
+      // extractZipFiles from useToolResources already returns File[] directly
+      const simpleExtractZipFiles = extractZipFiles;
+      return ocrResponseHandler(blob, originalFiles, simpleExtractZipFiles);
+    },
+    [extractZipFiles],
+  );
 
   const ocrConfig: ToolOperationConfig<OCRParameters> = {
     ...ocrOperationConfig,
     responseHandler,
     getErrorMessage: (error) =>
-      error.message?.includes('OCR tools') && error.message?.includes('not installed')
-        ? 'OCR tools (OCRmyPDF or Tesseract) are not installed on the server. Use the standard or fat Docker image instead of ultra-lite, or install OCR tools manually.'
-        : createStandardErrorHandler(t('ocr.error.failed', 'OCR operation failed'))(error),
+      error.message?.includes("OCR tools") &&
+      error.message?.includes("not installed")
+        ? "OCR tools (OCRmyPDF or Tesseract) are not installed on the server. Use the standard or fat Docker image instead of ultra-lite, or install OCR tools manually."
+        : createStandardErrorHandler(
+            t("ocr.error.failed", "OCR operation failed"),
+          )(error),
   };
 
   return useToolOperation(ocrConfig);
diff --git a/frontend/src/core/hooks/tools/ocr/useOCRParameters.ts b/frontend/src/core/hooks/tools/ocr/useOCRParameters.ts
index a2b6870317..a8bd5abb8d 100644
--- a/frontend/src/core/hooks/tools/ocr/useOCRParameters.ts
+++ b/frontend/src/core/hooks/tools/ocr/useOCRParameters.ts
@@ -1,5 +1,8 @@
-import { BaseParameters } from '@app/types/parameters';
-import { useBaseParameters, BaseParametersHook } from '@app/hooks/tools/shared/useBaseParameters';
+import { BaseParameters } from "@app/types/parameters";
+import {
+  useBaseParameters,
+  BaseParametersHook,
+} from "@app/hooks/tools/shared/useBaseParameters";
 
 export interface OCRParameters extends BaseParameters {
   languages: string[];
@@ -12,15 +15,15 @@ export type OCRParametersHook = BaseParametersHook<OCRParameters>;
 
 export const defaultParameters: OCRParameters = {
   languages: [],
-  ocrType: 'skip-text',
-  ocrRenderType: 'hocr',
+  ocrType: "skip-text",
+  ocrRenderType: "hocr",
   additionalOptions: [],
 };
 
 export const useOCRParameters = (): OCRParametersHook => {
   return useBaseParameters({
     defaultParameters,
-    endpointName: 'ocr-pdf',
+    endpointName: "ocr-pdf",
     validateFn: (params) => {
       // At minimum, we need at least one language selected
       return params.languages.length > 0;
diff --git a/frontend/src/core/hooks/tools/overlayPdfs/useOverlayPdfsOperation.ts b/frontend/src/core/hooks/tools/overlayPdfs/useOverlayPdfsOperation.ts
index a3499eb78f..02b72e9e1d 100644
--- a/frontend/src/core/hooks/tools/overlayPdfs/useOverlayPdfsOperation.ts
+++ b/frontend/src/core/hooks/tools/overlayPdfs/useOverlayPdfsOperation.ts
@@ -1,46 +1,55 @@
-import { useTranslation } from 'react-i18next';
-import { useToolOperation, ToolType, type ToolOperationConfig } from '@app/hooks/tools/shared/useToolOperation';
-import { createStandardErrorHandler } from '@app/utils/toolErrorHandler';
-import { type OverlayPdfsParameters } from '@app/hooks/tools/overlayPdfs/useOverlayPdfsParameters';
+import { useTranslation } from "react-i18next";
+import {
+  useToolOperation,
+  ToolType,
+  type ToolOperationConfig,
+} from "@app/hooks/tools/shared/useToolOperation";
+import { createStandardErrorHandler } from "@app/utils/toolErrorHandler";
+import { type OverlayPdfsParameters } from "@app/hooks/tools/overlayPdfs/useOverlayPdfsParameters";
 
-const buildFormData = (parameters: OverlayPdfsParameters, file: File): FormData => {
+const buildFormData = (
+  parameters: OverlayPdfsParameters,
+  file: File,
+): FormData => {
   const formData = new FormData();
-  formData.append('fileInput', file);
+  formData.append("fileInput", file);
 
   // Overlay files
   for (const overlay of parameters.overlayFiles || []) {
-    formData.append('overlayFiles', overlay);
+    formData.append("overlayFiles", overlay);
   }
 
   // Mode and position
-  formData.append('overlayMode', parameters.overlayMode);
-  formData.append('overlayPosition', String(parameters.overlayPosition));
+  formData.append("overlayMode", parameters.overlayMode);
+  formData.append("overlayPosition", String(parameters.overlayPosition));
 
   // Counts (only relevant for FixedRepeatOverlay, server accepts repeated 'counts' fields)
-  if (parameters.overlayMode === 'FixedRepeatOverlay') {
+  if (parameters.overlayMode === "FixedRepeatOverlay") {
     for (const count of parameters.counts || []) {
-      formData.append('counts', String(count));
+      formData.append("counts", String(count));
     }
   }
 
   return formData;
 };
 
-export const overlayPdfsOperationConfig: ToolOperationConfig<OverlayPdfsParameters> = {
-  toolType: ToolType.singleFile,
-  buildFormData,
-  operationType: 'overlayPdfs',
-  endpoint: '/api/v1/general/overlay-pdfs'
-};
+export const overlayPdfsOperationConfig: ToolOperationConfig<OverlayPdfsParameters> =
+  {
+    toolType: ToolType.singleFile,
+    buildFormData,
+    operationType: "overlayPdfs",
+    endpoint: "/api/v1/general/overlay-pdfs",
+  };
 
 export const useOverlayPdfsOperation = () => {
   const { t } = useTranslation();
   return useToolOperation<OverlayPdfsParameters>({
     ...overlayPdfsOperationConfig,
     getErrorMessage: createStandardErrorHandler(
-      t('overlay-pdfs.error.failed', 'An error occurred while overlaying PDFs.')
+      t(
+        "overlay-pdfs.error.failed",
+        "An error occurred while overlaying PDFs.",
+      ),
     ),
   });
 };
-
-
diff --git a/frontend/src/core/hooks/tools/overlayPdfs/useOverlayPdfsParameters.ts b/frontend/src/core/hooks/tools/overlayPdfs/useOverlayPdfsParameters.ts
index 056747e847..fc88ad4ef0 100644
--- a/frontend/src/core/hooks/tools/overlayPdfs/useOverlayPdfsParameters.ts
+++ b/frontend/src/core/hooks/tools/overlayPdfs/useOverlayPdfsParameters.ts
@@ -1,7 +1,14 @@
-import { BaseParameters } from '@app/types/parameters';
-import { useBaseParameters, type BaseParametersHook } from '@app/hooks/tools/shared/useBaseParameters';
+import { useCallback } from "react";
+import { BaseParameters } from "@app/types/parameters";
+import {
+  useBaseParameters,
+  type BaseParametersHook,
+} from "@app/hooks/tools/shared/useBaseParameters";
 
-export type OverlayMode = 'SequentialOverlay' | 'InterleavedOverlay' | 'FixedRepeatOverlay';
+export type OverlayMode =
+  | "SequentialOverlay"
+  | "InterleavedOverlay"
+  | "FixedRepeatOverlay";
 
 export interface OverlayPdfsParameters extends BaseParameters {
   overlayFiles: File[];
@@ -12,26 +19,43 @@ export interface OverlayPdfsParameters extends BaseParameters {
 
 export const defaultParameters: OverlayPdfsParameters = {
   overlayFiles: [],
-  overlayMode: 'SequentialOverlay',
+  overlayMode: "SequentialOverlay",
   overlayPosition: 0,
-  counts: []
+  counts: [],
 };
 
-export type OverlayPdfsParametersHook = BaseParametersHook<OverlayPdfsParameters>;
+export type OverlayPdfsParametersHook =
+  BaseParametersHook<OverlayPdfsParameters>;
 
 export const useOverlayPdfsParameters = (): OverlayPdfsParametersHook => {
-  return useBaseParameters<OverlayPdfsParameters>({
+  const base = useBaseParameters<OverlayPdfsParameters>({
     defaultParameters,
-    endpointName: 'overlay-pdfs',
+    endpointName: "overlay-pdfs",
     validateFn: (params) => {
-      if (!params.overlayFiles || params.overlayFiles.length === 0) return false;
-      if (params.overlayMode === 'FixedRepeatOverlay') {
-        if (!params.counts || params.counts.length !== params.overlayFiles.length) return false;
-        if (params.counts.some((c) => !Number.isFinite(c) || c <= 0)) return false;
+      if (!params.overlayFiles || params.overlayFiles.length === 0)
+        return false;
+      if (params.overlayMode === "FixedRepeatOverlay") {
+        if (
+          !params.counts ||
+          params.counts.length !== params.overlayFiles.length
+        )
+          return false;
+        if (params.counts.some((c) => !Number.isFinite(c) || c <= 0))
+          return false;
       }
       return true;
     },
   });
+
+  // Overlay files are chosen independently of the base file selection, so they
+  // must survive the parameter reset that fires when the workbench selection
+  // transitions from 0 → 1+ files. Only mode/position/counts are reset.
+  const resetParameters = useCallback(() => {
+    base.setParameters((prev) => ({
+      ...defaultParameters,
+      overlayFiles: prev.overlayFiles,
+    }));
+  }, [base.setParameters]);
+
+  return { ...base, resetParameters };
 };
-
-
diff --git a/frontend/src/core/hooks/tools/pageLayout/usePageLayoutOperation.ts b/frontend/src/core/hooks/tools/pageLayout/usePageLayoutOperation.ts
index 905f232459..b168f15f6f 100644
--- a/frontend/src/core/hooks/tools/pageLayout/usePageLayoutOperation.ts
+++ b/frontend/src/core/hooks/tools/pageLayout/usePageLayoutOperation.ts
@@ -1,33 +1,42 @@
-import { useTranslation } from 'react-i18next';
-import { ToolType, useToolOperation } from '@app/hooks/tools/shared/useToolOperation';
-import { createStandardErrorHandler } from '@app/utils/toolErrorHandler';
-import { PageLayoutParameters, defaultParameters } from '@app/hooks/tools/pageLayout/usePageLayoutParameters';
+import { useTranslation } from "react-i18next";
+import {
+  ToolType,
+  useToolOperation,
+} from "@app/hooks/tools/shared/useToolOperation";
+import { createStandardErrorHandler } from "@app/utils/toolErrorHandler";
+import {
+  PageLayoutParameters,
+  defaultParameters,
+} from "@app/hooks/tools/pageLayout/usePageLayoutParameters";
 
-export const buildPageLayoutFormData = (parameters: PageLayoutParameters, file: File): FormData => {
+export const buildPageLayoutFormData = (
+  parameters: PageLayoutParameters,
+  file: File,
+): FormData => {
   const formData = new FormData();
-  formData.append('fileInput', file);
-  formData.append('mode', String(parameters.mode));
-  formData.append('pagesPerSheet', String(parameters.pagesPerSheet));
-  formData.append('rows', String(parameters.rows));
-  formData.append('cols', String(parameters.cols));
-  formData.append('orientation', String(parameters.orientation));
-  formData.append('arrangement', String(parameters.arrangement));
-  formData.append('readingDirection', String(parameters.readingDirection));
-  formData.append('innerMargin', String(parameters.innerMargin ?? 0));
-  formData.append('topMargin', String(parameters.topMargin ?? 0));
-  formData.append('bottomMargin', String(parameters.bottomMargin ?? 0));
-  formData.append('leftMargin', String(parameters.leftMargin ?? 0));
-  formData.append('rightMargin', String(parameters.rightMargin ?? 0));
-  formData.append('addBorder', String(parameters.addBorder));
-  formData.append('borderWidth', String(parameters.borderWidth ?? 1));
+  formData.append("fileInput", file);
+  formData.append("mode", String(parameters.mode));
+  formData.append("pagesPerSheet", String(parameters.pagesPerSheet));
+  formData.append("rows", String(parameters.rows));
+  formData.append("cols", String(parameters.cols));
+  formData.append("orientation", String(parameters.orientation));
+  formData.append("arrangement", String(parameters.arrangement));
+  formData.append("readingDirection", String(parameters.readingDirection));
+  formData.append("innerMargin", String(parameters.innerMargin ?? 0));
+  formData.append("topMargin", String(parameters.topMargin ?? 0));
+  formData.append("bottomMargin", String(parameters.bottomMargin ?? 0));
+  formData.append("leftMargin", String(parameters.leftMargin ?? 0));
+  formData.append("rightMargin", String(parameters.rightMargin ?? 0));
+  formData.append("addBorder", String(parameters.addBorder));
+  formData.append("borderWidth", String(parameters.borderWidth ?? 1));
   return formData;
 };
 
 export const pageLayoutOperationConfig = {
   toolType: ToolType.singleFile,
   buildFormData: buildPageLayoutFormData,
-  operationType: 'pageLayout',
-  endpoint: '/api/v1/general/multi-page-layout',
+  operationType: "pageLayout",
+  endpoint: "/api/v1/general/multi-page-layout",
   defaultParameters,
 } as const;
 
@@ -37,9 +46,10 @@ export const usePageLayoutOperation = () => {
   return useToolOperation<PageLayoutParameters>({
     ...pageLayoutOperationConfig,
     getErrorMessage: createStandardErrorHandler(
-      t('pageLayout.error.failed', 'An error occurred while creating the multi-page layout.')
-    )
+      t(
+        "pageLayout.error.failed",
+        "An error occurred while creating the multi-page layout.",
+      ),
+    ),
   });
 };
-
-
diff --git a/frontend/src/core/hooks/tools/pageLayout/usePageLayoutParameters.ts b/frontend/src/core/hooks/tools/pageLayout/usePageLayoutParameters.ts
index 592ec9c2ef..89ae157ef8 100644
--- a/frontend/src/core/hooks/tools/pageLayout/usePageLayoutParameters.ts
+++ b/frontend/src/core/hooks/tools/pageLayout/usePageLayoutParameters.ts
@@ -1,14 +1,17 @@
-import { BaseParameters } from '@app/types/parameters';
-import { useBaseParameters, BaseParametersHook } from '@app/hooks/tools/shared/useBaseParameters';
+import { BaseParameters } from "@app/types/parameters";
+import {
+  useBaseParameters,
+  BaseParametersHook,
+} from "@app/hooks/tools/shared/useBaseParameters";
 
 export interface PageLayoutParameters extends BaseParameters {
-  mode: 'DEFAULT' | 'CUSTOM';
+  mode: "DEFAULT" | "CUSTOM";
   pagesPerSheet: number;
   rows: number;
   cols: number;
-  orientation: 'PORTRAIT' | 'LANDSCAPE';
-  arrangement: 'BY_COLUMNS' | 'BY_ROWS';
-  readingDirection: 'LTR' | 'RTL';
+  orientation: "PORTRAIT" | "LANDSCAPE";
+  arrangement: "BY_COLUMNS" | "BY_ROWS";
+  readingDirection: "LTR" | "RTL";
   innerMargin?: number;
   topMargin?: number;
   bottomMargin?: number;
@@ -19,13 +22,13 @@ export interface PageLayoutParameters extends BaseParameters {
 }
 
 export const defaultParameters: PageLayoutParameters = {
-  mode: 'DEFAULT',
+  mode: "DEFAULT",
   pagesPerSheet: 4,
   rows: 1,
   cols: 1,
-  orientation: 'PORTRAIT',
-  arrangement: 'BY_COLUMNS',
-  readingDirection: 'LTR',
+  orientation: "PORTRAIT",
+  arrangement: "BY_COLUMNS",
+  readingDirection: "LTR",
   addBorder: false,
   innerMargin: 0,
   topMargin: 0,
@@ -40,19 +43,21 @@ export type PageLayoutParametersHook = BaseParametersHook<PageLayoutParameters>;
 export const usePageLayoutParameters = (): PageLayoutParametersHook => {
   return useBaseParameters<PageLayoutParameters>({
     defaultParameters,
-    endpointName: 'multi-page-layout',
+    endpointName: "multi-page-layout",
     validateFn: (params) => {
-      const cols = params.mode === 'DEFAULT'
-        ? Math.ceil(Math.sqrt(params.pagesPerSheet))
-        : params.cols;
-      const rows = params.mode === 'DEFAULT'
-        ? Math.ceil(params.pagesPerSheet / cols)
-        : params.rows;
+      const cols =
+        params.mode === "DEFAULT"
+          ? Math.ceil(Math.sqrt(params.pagesPerSheet))
+          : params.cols;
+      const rows =
+        params.mode === "DEFAULT"
+          ? Math.ceil(params.pagesPerSheet / cols)
+          : params.rows;
 
       if (cols <= 0 || rows <= 0) return false;
 
-      const pageWidth = params.orientation === 'PORTRAIT' ? 595.28 : 841.89;
-      const pageHeight = params.orientation === 'PORTRAIT' ? 841.89 : 595.28;
+      const pageWidth = params.orientation === "PORTRAIT" ? 595.28 : 841.89;
+      const pageHeight = params.orientation === "PORTRAIT" ? 841.89 : 595.28;
 
       const left = params.leftMargin ?? 0;
       const right = params.rightMargin ?? 0;
@@ -73,5 +78,3 @@ export const usePageLayoutParameters = (): PageLayoutParametersHook => {
     },
   });
 };
-
-
diff --git a/frontend/src/core/hooks/tools/redact/useRedactOperation.test.ts b/frontend/src/core/hooks/tools/redact/useRedactOperation.test.ts
index a7a46bc3b9..77dc8c549d 100644
--- a/frontend/src/core/hooks/tools/redact/useRedactOperation.test.ts
+++ b/frontend/src/core/hooks/tools/redact/useRedactOperation.test.ts
@@ -1,96 +1,115 @@
-import { describe, expect, test, vi, beforeEach } from 'vitest';
-import { renderHook } from '@testing-library/react';
-import { buildRedactFormData, redactOperationConfig, useRedactOperation } from '@app/hooks/tools/redact/useRedactOperation';
-import { defaultParameters, RedactParameters } from '@app/hooks/tools/redact/useRedactParameters';
+import { describe, expect, test, vi, beforeEach } from "vitest";
+import { renderHook } from "@testing-library/react";
+import {
+  buildRedactFormData,
+  redactOperationConfig,
+  useRedactOperation,
+} from "@app/hooks/tools/redact/useRedactOperation";
+import {
+  defaultParameters,
+  RedactParameters,
+} from "@app/hooks/tools/redact/useRedactParameters";
 
 // Mock the useToolOperation hook
-vi.mock('../shared/useToolOperation', async () => {
-  const actual = await vi.importActual('../shared/useToolOperation');  // Need to keep ToolType etc.
+vi.mock("../shared/useToolOperation", async () => {
+  const actual = await vi.importActual("../shared/useToolOperation"); // Need to keep ToolType etc.
   return {
     ...actual,
-    useToolOperation: vi.fn()
+    useToolOperation: vi.fn(),
   };
 });
 
 // Mock the translation hook
-vi.mock('react-i18next', () => ({
-  useTranslation: () => ({ t: vi.fn((_key: string, fallback: string) => fallback) })
+vi.mock("react-i18next", () => ({
+  useTranslation: () => ({
+    t: vi.fn((_key: string, fallback: string) => fallback),
+  }),
 }));
 
 // Mock the error handler utility
-vi.mock('../../../utils/toolErrorHandler', () => ({
-  createStandardErrorHandler: vi.fn(() => vi.fn())
+vi.mock("../../../utils/toolErrorHandler", () => ({
+  createStandardErrorHandler: vi.fn(() => vi.fn()),
 }));
 
-describe('buildRedactFormData', () => {
-  const mockFile = new File(['test content'], 'test.pdf', { type: 'application/pdf' });
+describe("buildRedactFormData", () => {
+  const mockFile = new File(["test content"], "test.pdf", {
+    type: "application/pdf",
+  });
 
-  test('should build form data for automatic mode', () => {
+  test("should build form data for automatic mode", () => {
     const parameters: RedactParameters = {
       ...defaultParameters,
-      mode: 'automatic',
-      wordsToRedact: ['Confidential', 'Secret'],
+      mode: "automatic",
+      wordsToRedact: ["Confidential", "Secret"],
       useRegex: true,
       wholeWordSearch: true,
-      redactColor: '#FF0000',
+      redactColor: "#FF0000",
       customPadding: 0.5,
       convertPDFToImage: false,
     };
 
     const formData = buildRedactFormData(parameters, mockFile);
 
-    expect(formData.get('fileInput')).toBe(mockFile);
-    expect(formData.get('listOfText')).toBe('Confidential\nSecret');
-    expect(formData.get('useRegex')).toBe('true');
-    expect(formData.get('wholeWordSearch')).toBe('true');
-    expect(formData.get('redactColor')).toBe('FF0000'); // Hash should be removed
-    expect(formData.get('customPadding')).toBe('0.5');
-    expect(formData.get('convertPDFToImage')).toBe('false');
+    expect(formData.get("fileInput")).toBe(mockFile);
+    expect(formData.get("listOfText")).toBe("Confidential\nSecret");
+    expect(formData.get("useRegex")).toBe("true");
+    expect(formData.get("wholeWordSearch")).toBe("true");
+    expect(formData.get("redactColor")).toBe("FF0000"); // Hash should be removed
+    expect(formData.get("customPadding")).toBe("0.5");
+    expect(formData.get("convertPDFToImage")).toBe("false");
   });
 
-  test('should handle empty words array', () => {
+  test("should handle empty words array", () => {
     const parameters: RedactParameters = {
       ...defaultParameters,
-      mode: 'automatic',
+      mode: "automatic",
       wordsToRedact: [],
     };
 
     const formData = buildRedactFormData(parameters, mockFile);
 
-    expect(formData.get('listOfText')).toBe('');
+    expect(formData.get("listOfText")).toBe("");
   });
 
-  test('should join multiple words with newlines', () => {
+  test("should join multiple words with newlines", () => {
     const parameters: RedactParameters = {
       ...defaultParameters,
-      mode: 'automatic',
-      wordsToRedact: ['Word1', 'Word2', 'Word3'],
+      mode: "automatic",
+      wordsToRedact: ["Word1", "Word2", "Word3"],
     };
 
     const formData = buildRedactFormData(parameters, mockFile);
 
-    expect(formData.get('listOfText')).toBe('Word1\nWord2\nWord3');
+    expect(formData.get("listOfText")).toBe("Word1\nWord2\nWord3");
   });
 
   test.each([
-    { description: 'remove hash from redact color', redactColor: '#123456', expected: '123456' },
-    { description: 'handle redact color without hash', redactColor: 'ABCDEF', expected: 'ABCDEF' },
-  ])('should $description', ({ redactColor, expected }) => {
+    {
+      description: "remove hash from redact color",
+      redactColor: "#123456",
+      expected: "123456",
+    },
+    {
+      description: "handle redact color without hash",
+      redactColor: "ABCDEF",
+      expected: "ABCDEF",
+    },
+  ])("should $description", ({ redactColor, expected }) => {
     const parameters: RedactParameters = {
       ...defaultParameters,
-      mode: 'automatic',
+      mode: "automatic",
       redactColor,
     };
 
     const formData = buildRedactFormData(parameters, mockFile);
 
-    expect(formData.get('redactColor')).toBe(expected);
+    expect(formData.get("redactColor")).toBe(expected);
   });
 
-  test('should convert boolean parameters to strings', () => {
+  test("should convert boolean parameters to strings", () => {
     const parameters: RedactParameters = {
       ...defaultParameters,
-      mode: 'automatic',
+      mode: "automatic",
       useRegex: false,
       wholeWordSearch: true,
       convertPDFToImage: false,
@@ -98,29 +117,30 @@ describe('buildRedactFormData', () => {
 
     const formData = buildRedactFormData(parameters, mockFile);
 
-    expect(formData.get('useRegex')).toBe('false');
-    expect(formData.get('wholeWordSearch')).toBe('true');
-    expect(formData.get('convertPDFToImage')).toBe('false');
+    expect(formData.get("useRegex")).toBe("false");
+    expect(formData.get("wholeWordSearch")).toBe("true");
+    expect(formData.get("convertPDFToImage")).toBe("false");
   });
 
-  test('should return empty form data for manual mode (handled client-side)', () => {
+  test("should return empty form data for manual mode (handled client-side)", () => {
     const parameters: RedactParameters = {
       ...defaultParameters,
-      mode: 'manual',
+      mode: "manual",
     };
 
     const formData = buildRedactFormData(parameters, mockFile);
-    expect(formData.get('fileInput')).toBeNull();
+    expect(formData.get("fileInput")).toBeNull();
   });
 });
 
-describe('useRedactOperation', () => {
+describe("useRedactOperation", () => {
   beforeEach(() => {
     vi.clearAllMocks();
   });
 
-  test('should call useToolOperation with correct configuration', async () => {
-    const { useToolOperation } = await import('@app/hooks/tools/shared/useToolOperation');
+  test("should call useToolOperation with correct configuration", async () => {
+    const { useToolOperation } =
+      await import("@app/hooks/tools/shared/useToolOperation");
     const mockUseToolOperation = vi.mocked(useToolOperation);
 
     renderHook(() => useRedactOperation());
@@ -131,13 +151,14 @@ describe('useRedactOperation', () => {
     });
   });
 
-  test('should provide error handler to useToolOperation', async () => {
-    const { useToolOperation } = await import('@app/hooks/tools/shared/useToolOperation');
+  test("should provide error handler to useToolOperation", async () => {
+    const { useToolOperation } =
+      await import("@app/hooks/tools/shared/useToolOperation");
     const mockUseToolOperation = vi.mocked(useToolOperation);
 
     renderHook(() => useRedactOperation());
 
     const callArgs = mockUseToolOperation.mock.calls[0][0];
-    expect(typeof callArgs.getErrorMessage).toBe('function');
+    expect(typeof callArgs.getErrorMessage).toBe("function");
   });
 });
diff --git a/frontend/src/core/hooks/tools/redact/useRedactOperation.ts b/frontend/src/core/hooks/tools/redact/useRedactOperation.ts
index fea3c53fdb..bc4db5b6c3 100644
--- a/frontend/src/core/hooks/tools/redact/useRedactOperation.ts
+++ b/frontend/src/core/hooks/tools/redact/useRedactOperation.ts
@@ -1,22 +1,34 @@
-import { useTranslation } from 'react-i18next';
-import { useToolOperation, ToolType } from '@app/hooks/tools/shared/useToolOperation';
-import { createStandardErrorHandler } from '@app/utils/toolErrorHandler';
-import { RedactParameters, defaultParameters } from '@app/hooks/tools/redact/useRedactParameters';
+import { useTranslation } from "react-i18next";
+import {
+  useToolOperation,
+  ToolType,
+} from "@app/hooks/tools/shared/useToolOperation";
+import { createStandardErrorHandler } from "@app/utils/toolErrorHandler";
+import {
+  RedactParameters,
+  defaultParameters,
+} from "@app/hooks/tools/redact/useRedactParameters";
 
 // Static configuration that can be used by both the hook and automation executor
-export const buildRedactFormData = (parameters: RedactParameters, file: File): FormData => {
+export const buildRedactFormData = (
+  parameters: RedactParameters,
+  file: File,
+): FormData => {
   const formData = new FormData();
 
   // For automatic mode we hit the backend and need full payload
-  if (parameters.mode === 'automatic') {
+  if (parameters.mode === "automatic") {
     formData.append("fileInput", file);
     // Convert array to newline-separated string as expected by backend
-    formData.append("listOfText", parameters.wordsToRedact.join('\n'));
+    formData.append("listOfText", parameters.wordsToRedact.join("\n"));
     formData.append("useRegex", parameters.useRegex.toString());
     formData.append("wholeWordSearch", parameters.wholeWordSearch.toString());
-    formData.append("redactColor", parameters.redactColor.replace('#', ''));
+    formData.append("redactColor", parameters.redactColor.replace("#", ""));
     formData.append("customPadding", parameters.customPadding.toString());
-    formData.append("convertPDFToImage", parameters.convertPDFToImage.toString());
+    formData.append(
+      "convertPDFToImage",
+      parameters.convertPDFToImage.toString(),
+    );
   } else {
     // Manual redaction uses EmbedPDF in-viewer; we don't call the API.
     // Return an empty formData to satisfy shared interfaces without throwing.
@@ -29,13 +41,13 @@ export const buildRedactFormData = (parameters: RedactParameters, file: File): F
 export const redactOperationConfig = {
   toolType: ToolType.singleFile,
   buildFormData: buildRedactFormData,
-  operationType: 'redact',
+  operationType: "redact",
   endpoint: (parameters: RedactParameters) => {
-    if (parameters.mode === 'automatic') {
-      return '/api/v1/security/auto-redact';
+    if (parameters.mode === "automatic") {
+      return "/api/v1/security/auto-redact";
     }
     // Manual redaction is handled by EmbedPDF in the viewer; no endpoint call.
-    return "";  
+    return "";
   },
   defaultParameters,
 } as const;
@@ -45,6 +57,8 @@ export const useRedactOperation = () => {
 
   return useToolOperation<RedactParameters>({
     ...redactOperationConfig,
-    getErrorMessage: createStandardErrorHandler(t('redact.error.failed', 'An error occurred while redacting the PDF.'))
+    getErrorMessage: createStandardErrorHandler(
+      t("redact.error.failed", "An error occurred while redacting the PDF."),
+    ),
   });
 };
diff --git a/frontend/src/core/hooks/tools/redact/useRedactParameters.test.ts b/frontend/src/core/hooks/tools/redact/useRedactParameters.test.ts
index 8689e6715e..1a519d519e 100644
--- a/frontend/src/core/hooks/tools/redact/useRedactParameters.test.ts
+++ b/frontend/src/core/hooks/tools/redact/useRedactParameters.test.ts
@@ -1,23 +1,26 @@
-import { describe, expect, test } from 'vitest';
-import { renderHook, act } from '@testing-library/react';
-import { useRedactParameters, defaultParameters } from '@app/hooks/tools/redact/useRedactParameters';
+import { describe, expect, test } from "vitest";
+import { renderHook, act } from "@testing-library/react";
+import {
+  useRedactParameters,
+  defaultParameters,
+} from "@app/hooks/tools/redact/useRedactParameters";
 
-describe('useRedactParameters', () => {
-  test('should initialize with default parameters', () => {
+describe("useRedactParameters", () => {
+  test("should initialize with default parameters", () => {
     const { result } = renderHook(() => useRedactParameters());
 
     expect(result.current.parameters).toStrictEqual(defaultParameters);
   });
 
   test.each([
-    { paramName: 'mode' as const, value: 'manual' as const },
-    { paramName: 'wordsToRedact' as const, value: ['word1', 'word2'] },
-    { paramName: 'useRegex' as const, value: true },
-    { paramName: 'wholeWordSearch' as const, value: true },
-    { paramName: 'redactColor' as const, value: '#FF0000' },
-    { paramName: 'customPadding' as const, value: 0.5 },
-    { paramName: 'convertPDFToImage' as const, value: false }
-  ])('should update parameter $paramName', ({ paramName, value }) => {
+    { paramName: "mode" as const, value: "manual" as const },
+    { paramName: "wordsToRedact" as const, value: ["word1", "word2"] },
+    { paramName: "useRegex" as const, value: true },
+    { paramName: "wholeWordSearch" as const, value: true },
+    { paramName: "redactColor" as const, value: "#FF0000" },
+    { paramName: "customPadding" as const, value: 0.5 },
+    { paramName: "convertPDFToImage" as const, value: false },
+  ])("should update parameter $paramName", ({ paramName, value }) => {
     const { result } = renderHook(() => useRedactParameters());
 
     act(() => {
@@ -27,14 +30,14 @@ describe('useRedactParameters', () => {
     expect(result.current.parameters[paramName]).toStrictEqual(value);
   });
 
-  test('should reset parameters to defaults', () => {
+  test("should reset parameters to defaults", () => {
     const { result } = renderHook(() => useRedactParameters());
 
     // Modify some parameters
     act(() => {
-      result.current.updateParameter('mode', 'manual');
-      result.current.updateParameter('wordsToRedact', ['test']);
-      result.current.updateParameter('useRegex', true);
+      result.current.updateParameter("mode", "manual");
+      result.current.updateParameter("wordsToRedact", ["test"]);
+      result.current.updateParameter("useRegex", true);
     });
 
     // Reset parameters
@@ -45,90 +48,115 @@ describe('useRedactParameters', () => {
     expect(result.current.parameters).toStrictEqual(defaultParameters);
   });
 
-  describe('validation', () => {
+  describe("validation", () => {
     test.each([
-      { description: 'validate when wordsToRedact has non-empty words in automatic mode', wordsToRedact: ['word1', 'word2'], expected: true },
-      { description: 'not validate when wordsToRedact is empty in automatic mode', wordsToRedact: [], expected: false },
-      { description: 'not validate when wordsToRedact contains only empty strings in automatic mode', wordsToRedact: ['', '  ', ''], expected: false },
-      { description: 'validate when wordsToRedact contains at least one non-empty word in automatic mode', wordsToRedact: ['', 'valid', '  '], expected: true },
-    ])('should $description', ({ wordsToRedact, expected }) => {
+      {
+        description:
+          "validate when wordsToRedact has non-empty words in automatic mode",
+        wordsToRedact: ["word1", "word2"],
+        expected: true,
+      },
+      {
+        description:
+          "not validate when wordsToRedact is empty in automatic mode",
+        wordsToRedact: [],
+        expected: false,
+      },
+      {
+        description:
+          "not validate when wordsToRedact contains only empty strings in automatic mode",
+        wordsToRedact: ["", "  ", ""],
+        expected: false,
+      },
+      {
+        description:
+          "validate when wordsToRedact contains at least one non-empty word in automatic mode",
+        wordsToRedact: ["", "valid", "  "],
+        expected: true,
+      },
+    ])("should $description", ({ wordsToRedact, expected }) => {
       const { result } = renderHook(() => useRedactParameters());
 
       act(() => {
-        result.current.updateParameter('mode', 'automatic');
-        result.current.updateParameter('wordsToRedact', wordsToRedact);
+        result.current.updateParameter("mode", "automatic");
+        result.current.updateParameter("wordsToRedact", wordsToRedact);
       });
 
       expect(result.current.validateParameters()).toBe(expected);
     });
 
-    test('should not validate in manual mode (not implemented)', () => {
+    test("should not validate in manual mode (not implemented)", () => {
       const { result } = renderHook(() => useRedactParameters());
 
       act(() => {
-        result.current.updateParameter('mode', 'manual');
+        result.current.updateParameter("mode", "manual");
       });
 
       expect(result.current.validateParameters()).toBe(false);
     });
   });
 
-  describe('endpoint handling', () => {
-    test('should return correct endpoint for automatic mode', () => {
+  describe("endpoint handling", () => {
+    test("should return correct endpoint for automatic mode", () => {
       const { result } = renderHook(() => useRedactParameters());
 
       act(() => {
-        result.current.updateParameter('mode', 'automatic');
+        result.current.updateParameter("mode", "automatic");
       });
 
-      expect(result.current.getEndpointName()).toBe('/api/v1/security/auto-redact');
+      expect(result.current.getEndpointName()).toBe(
+        "/api/v1/security/auto-redact",
+      );
     });
 
-    test('should return empty endpoint for manual mode (handled client-side)', () => {
+    test("should return empty endpoint for manual mode (handled client-side)", () => {
       const { result } = renderHook(() => useRedactParameters());
 
       act(() => {
-        result.current.updateParameter('mode', 'manual');
+        result.current.updateParameter("mode", "manual");
       });
 
-      expect(result.current.getEndpointName()).toBe('');
+      expect(result.current.getEndpointName()).toBe("");
     });
   });
 
-  test('should maintain parameter state across updates', () => {
+  test("should maintain parameter state across updates", () => {
     const { result } = renderHook(() => useRedactParameters());
 
     act(() => {
-      result.current.updateParameter('redactColor', '#FF0000');
-      result.current.updateParameter('customPadding', 0.5);
-      result.current.updateParameter('wordsToRedact', ['word1']);
+      result.current.updateParameter("redactColor", "#FF0000");
+      result.current.updateParameter("customPadding", 0.5);
+      result.current.updateParameter("wordsToRedact", ["word1"]);
     });
 
     // All parameters should be updated
-    expect(result.current.parameters.redactColor).toBe('#FF0000');
+    expect(result.current.parameters.redactColor).toBe("#FF0000");
     expect(result.current.parameters.customPadding).toBe(0.5);
-    expect(result.current.parameters.wordsToRedact).toEqual(['word1']);
+    expect(result.current.parameters.wordsToRedact).toEqual(["word1"]);
 
     // Other parameters should remain at defaults
-    expect(result.current.parameters.mode).toBe('automatic');
+    expect(result.current.parameters.mode).toBe("automatic");
     expect(result.current.parameters.useRegex).toBe(false);
     expect(result.current.parameters.wholeWordSearch).toBe(false);
     expect(result.current.parameters.convertPDFToImage).toBe(true);
   });
 
-  test('should handle array parameter updates correctly', () => {
+  test("should handle array parameter updates correctly", () => {
     const { result } = renderHook(() => useRedactParameters());
 
     act(() => {
-      result.current.updateParameter('wordsToRedact', ['initial']);
+      result.current.updateParameter("wordsToRedact", ["initial"]);
     });
 
-    expect(result.current.parameters.wordsToRedact).toEqual(['initial']);
+    expect(result.current.parameters.wordsToRedact).toEqual(["initial"]);
 
     act(() => {
-      result.current.updateParameter('wordsToRedact', ['updated', 'multiple']);
+      result.current.updateParameter("wordsToRedact", ["updated", "multiple"]);
     });
 
-    expect(result.current.parameters.wordsToRedact).toEqual(['updated', 'multiple']);
+    expect(result.current.parameters.wordsToRedact).toEqual([
+      "updated",
+      "multiple",
+    ]);
   });
 });
diff --git a/frontend/src/core/hooks/tools/redact/useRedactParameters.ts b/frontend/src/core/hooks/tools/redact/useRedactParameters.ts
index 630592838c..e41b9d2216 100644
--- a/frontend/src/core/hooks/tools/redact/useRedactParameters.ts
+++ b/frontend/src/core/hooks/tools/redact/useRedactParameters.ts
@@ -1,7 +1,10 @@
-import { BaseParameters } from '@app/types/parameters';
-import { useBaseParameters, BaseParametersHook } from '@app/hooks/tools/shared/useBaseParameters';
+import { BaseParameters } from "@app/types/parameters";
+import {
+  useBaseParameters,
+  BaseParametersHook,
+} from "@app/hooks/tools/shared/useBaseParameters";
 
-export type RedactMode = 'automatic' | 'manual';
+export type RedactMode = "automatic" | "manual";
 
 export interface RedactParameters extends BaseParameters {
   mode: RedactMode;
@@ -16,11 +19,11 @@ export interface RedactParameters extends BaseParameters {
 }
 
 export const defaultParameters: RedactParameters = {
-  mode: 'automatic',
+  mode: "automatic",
   wordsToRedact: [],
   useRegex: false,
   wholeWordSearch: false,
-  redactColor: '#000000',
+  redactColor: "#000000",
   customPadding: 0.1,
   convertPDFToImage: true,
 };
@@ -31,18 +34,21 @@ export const useRedactParameters = (): RedactParametersHook => {
   return useBaseParameters({
     defaultParameters,
     endpointName: (params) => {
-      if (params.mode === 'automatic') {
-        return '/api/v1/security/auto-redact';
+      if (params.mode === "automatic") {
+        return "/api/v1/security/auto-redact";
       }
       // Manual redaction handled client-side (validation prevents this path)
-      return '';
+      return "";
     },
     validateFn: (params) => {
-      if (params.mode === 'automatic') {
-        return params.wordsToRedact.length > 0 && params.wordsToRedact.some(word => word.trim().length > 0);
+      if (params.mode === "automatic") {
+        return (
+          params.wordsToRedact.length > 0 &&
+          params.wordsToRedact.some((word) => word.trim().length > 0)
+        );
       }
       // Manual mode is not yet supported via this flow
       return false;
-    }
+    },
   });
 };
diff --git a/frontend/src/core/hooks/tools/removeAnnotations/useRemoveAnnotationsOperation.ts b/frontend/src/core/hooks/tools/removeAnnotations/useRemoveAnnotationsOperation.ts
index 0f60593bc3..4f9d3fbc7d 100644
--- a/frontend/src/core/hooks/tools/removeAnnotations/useRemoveAnnotationsOperation.ts
+++ b/frontend/src/core/hooks/tools/removeAnnotations/useRemoveAnnotationsOperation.ts
@@ -1,16 +1,26 @@
-import { useTranslation } from 'react-i18next';
-import { useToolOperation, ToolType, CustomProcessorResult } from '@app/hooks/tools/shared/useToolOperation';
-import { createStandardErrorHandler } from '@app/utils/toolErrorHandler';
-import { RemoveAnnotationsParameters, defaultParameters } from '@app/hooks/tools/removeAnnotations/useRemoveAnnotationsParameters';
+import { useTranslation } from "react-i18next";
+import {
+  useToolOperation,
+  ToolType,
+  CustomProcessorResult,
+} from "@app/hooks/tools/shared/useToolOperation";
+import { createStandardErrorHandler } from "@app/utils/toolErrorHandler";
+import {
+  RemoveAnnotationsParameters,
+  defaultParameters,
+} from "@app/hooks/tools/removeAnnotations/useRemoveAnnotationsParameters";
 import {
   getPdfiumModule,
   openRawDocumentSafe,
   closeDocAndFreeBuffer,
   saveRawDocument,
-} from '@app/services/pdfiumService';
+} from "@app/services/pdfiumService";
 
 // Client-side PDF processing using PDFium WASM
-const removeAnnotationsProcessor = async (_parameters: RemoveAnnotationsParameters, files: File[]): Promise<CustomProcessorResult> => {
+const removeAnnotationsProcessor = async (
+  _parameters: RemoveAnnotationsParameters,
+  files: File[],
+): Promise<CustomProcessorResult> => {
   const processedFiles: File[] = [];
 
   for (const file of files) {
@@ -32,7 +42,10 @@ const removeAnnotationsProcessor = async (_parameters: RemoveAnnotationsParamete
             try {
               m.FPDFPage_RemoveAnnot(pagePtr, j);
             } catch (err) {
-              console.warn(`Failed to remove annotation ${j} on page ${i + 1}:`, err);
+              console.warn(
+                `Failed to remove annotation ${j} on page ${i + 1}:`,
+                err,
+              );
             }
           }
 
@@ -40,16 +53,20 @@ const removeAnnotationsProcessor = async (_parameters: RemoveAnnotationsParamete
         }
 
         const outBytes = await saveRawDocument(docPtr);
-        const processedFile = new File([outBytes], file.name, { type: 'application/pdf' });
+        const processedFile = new File([outBytes], file.name, {
+          type: "application/pdf",
+        });
         processedFiles.push(processedFile);
       } finally {
         closeDocAndFreeBuffer(m, docPtr);
       }
     } catch (error) {
-      console.error('Error processing file:', file.name, error);
+      console.error("Error processing file:", file.name, error);
       throw new Error(
-        `Failed to process ${file.name}: ${error instanceof Error ? error.message : 'Unknown error'}`,
-        { cause: error }
+        `Failed to process ${file.name}: ${error instanceof Error ? error.message : "Unknown error"}`,
+        {
+          cause: error,
+        },
       );
     }
   }
@@ -63,7 +80,7 @@ const removeAnnotationsProcessor = async (_parameters: RemoveAnnotationsParamete
 // Static configuration object
 export const removeAnnotationsOperationConfig = {
   toolType: ToolType.custom,
-  operationType: 'removeAnnotations',
+  operationType: "removeAnnotations",
   customProcessor: removeAnnotationsProcessor,
   defaultParameters,
 } as const;
@@ -73,6 +90,11 @@ export const useRemoveAnnotationsOperation = () => {
 
   return useToolOperation<RemoveAnnotationsParameters>({
     ...removeAnnotationsOperationConfig,
-    getErrorMessage: createStandardErrorHandler(t('removeAnnotations.error.failed', 'An error occurred while removing annotations from the PDF.'))
+    getErrorMessage: createStandardErrorHandler(
+      t(
+        "removeAnnotations.error.failed",
+        "An error occurred while removing annotations from the PDF.",
+      ),
+    ),
   });
 };
diff --git a/frontend/src/core/hooks/tools/removeAnnotations/useRemoveAnnotationsParameters.ts b/frontend/src/core/hooks/tools/removeAnnotations/useRemoveAnnotationsParameters.ts
index 55a5c81f9a..2da2f4005b 100644
--- a/frontend/src/core/hooks/tools/removeAnnotations/useRemoveAnnotationsParameters.ts
+++ b/frontend/src/core/hooks/tools/removeAnnotations/useRemoveAnnotationsParameters.ts
@@ -1,14 +1,13 @@
-import { useBaseParameters } from '@app/hooks/tools/shared/useBaseParameters';
+import { useBaseParameters } from "@app/hooks/tools/shared/useBaseParameters";
 
-export type RemoveAnnotationsParameters = Record<string, never>
+export type RemoveAnnotationsParameters = Record<string, never>;
 
-export const defaultParameters: RemoveAnnotationsParameters = {
-};
+export const defaultParameters: RemoveAnnotationsParameters = {};
 
 export const useRemoveAnnotationsParameters = () => {
   return useBaseParameters<RemoveAnnotationsParameters>({
     defaultParameters,
-    endpointName: 'remove-annotations', // Not used for client-side processing, but required by base hook
+    endpointName: "remove-annotations", // Not used for client-side processing, but required by base hook
     validateFn: () => true, // No parameters to validate
   });
-};
\ No newline at end of file
+};
diff --git a/frontend/src/core/hooks/tools/removeBlanks/useRemoveBlanksOperation.ts b/frontend/src/core/hooks/tools/removeBlanks/useRemoveBlanksOperation.ts
index ddb0ba2d24..5f24a28dd8 100644
--- a/frontend/src/core/hooks/tools/removeBlanks/useRemoveBlanksOperation.ts
+++ b/frontend/src/core/hooks/tools/removeBlanks/useRemoveBlanksOperation.ts
@@ -1,15 +1,25 @@
-import { useCallback } from 'react';
-import { useTranslation } from 'react-i18next';
-import { ToolType, useToolOperation, ToolOperationConfig } from '@app/hooks/tools/shared/useToolOperation';
-import { createStandardErrorHandler } from '@app/utils/toolErrorHandler';
-import { RemoveBlanksParameters, defaultParameters } from '@app/hooks/tools/removeBlanks/useRemoveBlanksParameters';
-import { useToolResources } from '@app/hooks/tools/shared/useToolResources';
+import { useCallback } from "react";
+import { useTranslation } from "react-i18next";
+import {
+  ToolType,
+  useToolOperation,
+  ToolOperationConfig,
+} from "@app/hooks/tools/shared/useToolOperation";
+import { createStandardErrorHandler } from "@app/utils/toolErrorHandler";
+import {
+  RemoveBlanksParameters,
+  defaultParameters,
+} from "@app/hooks/tools/removeBlanks/useRemoveBlanksParameters";
+import { useToolResources } from "@app/hooks/tools/shared/useToolResources";
 
-export const buildRemoveBlanksFormData = (parameters: RemoveBlanksParameters, file: File): FormData => {
+export const buildRemoveBlanksFormData = (
+  parameters: RemoveBlanksParameters,
+  file: File,
+): FormData => {
   const formData = new FormData();
-  formData.append('fileInput', file);
-  formData.append('threshold', String(parameters.threshold));
-  formData.append('whitePercent', String(parameters.whitePercent));
+  formData.append("fileInput", file);
+  formData.append("threshold", String(parameters.threshold));
+  formData.append("whitePercent", String(parameters.whitePercent));
   // Note: includeBlankPages is not sent to backend as it always returns both files in a ZIP
   return formData;
 };
@@ -17,8 +27,8 @@ export const buildRemoveBlanksFormData = (parameters: RemoveBlanksParameters, fi
 export const removeBlanksOperationConfig = {
   toolType: ToolType.singleFile,
   buildFormData: buildRemoveBlanksFormData,
-  operationType: 'removeBlanks',
-  endpoint: '/api/v1/misc/remove-blanks',
+  operationType: "removeBlanks",
+  endpoint: "/api/v1/misc/remove-blanks",
   defaultParameters,
 } as const satisfies ToolOperationConfig<RemoveBlanksParameters>;
 
@@ -26,18 +36,19 @@ export const useRemoveBlanksOperation = () => {
   const { t } = useTranslation();
   const { extractZipFiles } = useToolResources();
 
-  const responseHandler = useCallback(async (blob: Blob): Promise<File[]> => {
-    // Backend always returns a ZIP file containing the processed PDFs
-    return await extractZipFiles(blob);
-  }, [extractZipFiles]);
+  const responseHandler = useCallback(
+    async (blob: Blob): Promise<File[]> => {
+      // Backend always returns a ZIP file containing the processed PDFs
+      return await extractZipFiles(blob);
+    },
+    [extractZipFiles],
+  );
 
   return useToolOperation<RemoveBlanksParameters>({
     ...removeBlanksOperationConfig,
     responseHandler,
     getErrorMessage: createStandardErrorHandler(
-      t('removeBlanks.error.failed', 'Failed to remove blank pages')
-    )
+      t("removeBlanks.error.failed", "Failed to remove blank pages"),
+    ),
   });
 };
-
-
diff --git a/frontend/src/core/hooks/tools/removeBlanks/useRemoveBlanksParameters.ts b/frontend/src/core/hooks/tools/removeBlanks/useRemoveBlanksParameters.ts
index 4a57f8bf84..2eb5c9bce5 100644
--- a/frontend/src/core/hooks/tools/removeBlanks/useRemoveBlanksParameters.ts
+++ b/frontend/src/core/hooks/tools/removeBlanks/useRemoveBlanksParameters.ts
@@ -1,5 +1,8 @@
-import { BaseParameters } from '@app/types/parameters';
-import { useBaseParameters, BaseParametersHook } from '@app/hooks/tools/shared/useBaseParameters';
+import { BaseParameters } from "@app/types/parameters";
+import {
+  useBaseParameters,
+  BaseParametersHook,
+} from "@app/hooks/tools/shared/useBaseParameters";
 
 export interface RemoveBlanksParameters extends BaseParameters {
   threshold: number; // 0-255
@@ -13,14 +16,17 @@ export const defaultParameters: RemoveBlanksParameters = {
   includeBlankPages: false,
 };
 
-export type RemoveBlanksParametersHook = BaseParametersHook<RemoveBlanksParameters>;
+export type RemoveBlanksParametersHook =
+  BaseParametersHook<RemoveBlanksParameters>;
 
 export const useRemoveBlanksParameters = (): RemoveBlanksParametersHook => {
   return useBaseParameters({
     defaultParameters,
-    endpointName: 'remove-blanks',
-    validateFn: (p) => p.threshold >= 0 && p.threshold <= 255 && p.whitePercent > 0 && p.whitePercent <= 100,
+    endpointName: "remove-blanks",
+    validateFn: (p) =>
+      p.threshold >= 0 &&
+      p.threshold <= 255 &&
+      p.whitePercent > 0 &&
+      p.whitePercent <= 100,
   });
 };
-
-
diff --git a/frontend/src/core/hooks/tools/removeCertificateSign/useRemoveCertificateSignOperation.ts b/frontend/src/core/hooks/tools/removeCertificateSign/useRemoveCertificateSignOperation.ts
index a2a1277b90..1d6604f0ef 100644
--- a/frontend/src/core/hooks/tools/removeCertificateSign/useRemoveCertificateSignOperation.ts
+++ b/frontend/src/core/hooks/tools/removeCertificateSign/useRemoveCertificateSignOperation.ts
@@ -1,10 +1,19 @@
-import { useTranslation } from 'react-i18next';
-import { ToolType, useToolOperation } from '@app/hooks/tools/shared/useToolOperation';
-import { createStandardErrorHandler } from '@app/utils/toolErrorHandler';
-import { RemoveCertificateSignParameters, defaultParameters } from '@app/hooks/tools/removeCertificateSign/useRemoveCertificateSignParameters';
+import { useTranslation } from "react-i18next";
+import {
+  ToolType,
+  useToolOperation,
+} from "@app/hooks/tools/shared/useToolOperation";
+import { createStandardErrorHandler } from "@app/utils/toolErrorHandler";
+import {
+  RemoveCertificateSignParameters,
+  defaultParameters,
+} from "@app/hooks/tools/removeCertificateSign/useRemoveCertificateSignParameters";
 
 // Static function that can be used by both the hook and automation executor
-export const buildRemoveCertificateSignFormData = (_parameters: RemoveCertificateSignParameters, file: File): FormData => {
+export const buildRemoveCertificateSignFormData = (
+  _parameters: RemoveCertificateSignParameters,
+  file: File,
+): FormData => {
   const formData = new FormData();
   formData.append("fileInput", file);
   return formData;
@@ -14,8 +23,8 @@ export const buildRemoveCertificateSignFormData = (_parameters: RemoveCertificat
 export const removeCertificateSignOperationConfig = {
   toolType: ToolType.singleFile,
   buildFormData: buildRemoveCertificateSignFormData,
-  operationType: 'removeCertSign',
-  endpoint: '/api/v1/security/remove-cert-sign',
+  operationType: "removeCertSign",
+  endpoint: "/api/v1/security/remove-cert-sign",
   defaultParameters,
 } as const;
 
@@ -24,6 +33,11 @@ export const useRemoveCertificateSignOperation = () => {
 
   return useToolOperation<RemoveCertificateSignParameters>({
     ...removeCertificateSignOperationConfig,
-    getErrorMessage: createStandardErrorHandler(t('removeCertSign.error.failed', 'An error occurred while removing certificate signatures.'))
+    getErrorMessage: createStandardErrorHandler(
+      t(
+        "removeCertSign.error.failed",
+        "An error occurred while removing certificate signatures.",
+      ),
+    ),
   });
 };
diff --git a/frontend/src/core/hooks/tools/removeCertificateSign/useRemoveCertificateSignParameters.ts b/frontend/src/core/hooks/tools/removeCertificateSign/useRemoveCertificateSignParameters.ts
index 838d672e5c..31045de85b 100644
--- a/frontend/src/core/hooks/tools/removeCertificateSign/useRemoveCertificateSignParameters.ts
+++ b/frontend/src/core/hooks/tools/removeCertificateSign/useRemoveCertificateSignParameters.ts
@@ -1,5 +1,8 @@
-import { BaseParameters } from '@app/types/parameters';
-import { useBaseParameters, BaseParametersHook } from '@app/hooks/tools/shared/useBaseParameters';
+import { BaseParameters } from "@app/types/parameters";
+import {
+  useBaseParameters,
+  BaseParametersHook,
+} from "@app/hooks/tools/shared/useBaseParameters";
 
 export interface RemoveCertificateSignParameters extends BaseParameters {
   // Extends BaseParameters - ready for future parameter additions if needed
@@ -9,11 +12,13 @@ export const defaultParameters: RemoveCertificateSignParameters = {
   // No parameters needed
 };
 
-export type RemoveCertificateSignParametersHook = BaseParametersHook<RemoveCertificateSignParameters>;
+export type RemoveCertificateSignParametersHook =
+  BaseParametersHook<RemoveCertificateSignParameters>;
 
-export const useRemoveCertificateSignParameters = (): RemoveCertificateSignParametersHook => {
-  return useBaseParameters({
-    defaultParameters,
-    endpointName: 'remove-cert-sign',
-  });
-};
\ No newline at end of file
+export const useRemoveCertificateSignParameters =
+  (): RemoveCertificateSignParametersHook => {
+    return useBaseParameters({
+      defaultParameters,
+      endpointName: "remove-cert-sign",
+    });
+  };
diff --git a/frontend/src/core/hooks/tools/removeImage/useRemoveImageOperation.ts b/frontend/src/core/hooks/tools/removeImage/useRemoveImageOperation.ts
index e975cf8d5b..3441623cf6 100644
--- a/frontend/src/core/hooks/tools/removeImage/useRemoveImageOperation.ts
+++ b/frontend/src/core/hooks/tools/removeImage/useRemoveImageOperation.ts
@@ -1,20 +1,28 @@
-import { useTranslation } from 'react-i18next';
-import { useToolOperation, ToolOperationConfig, ToolType } from '@app/hooks/tools/shared/useToolOperation';
-import { createStandardErrorHandler } from '@app/utils/toolErrorHandler';
-import type { RemoveImageParameters } from '@app/hooks/tools/removeImage/useRemoveImageParameters';
+import { useTranslation } from "react-i18next";
+import {
+  useToolOperation,
+  ToolOperationConfig,
+  ToolType,
+} from "@app/hooks/tools/shared/useToolOperation";
+import { createStandardErrorHandler } from "@app/utils/toolErrorHandler";
+import type { RemoveImageParameters } from "@app/hooks/tools/removeImage/useRemoveImageParameters";
 
-export const buildRemoveImageFormData = (_params: RemoveImageParameters, file: File): FormData => {
+export const buildRemoveImageFormData = (
+  _params: RemoveImageParameters,
+  file: File,
+): FormData => {
   const formData = new FormData();
-  formData.append('fileInput', file);
+  formData.append("fileInput", file);
   return formData;
 };
 
-export const removeImageOperationConfig: ToolOperationConfig<RemoveImageParameters> = {
-  toolType: ToolType.singleFile,
-  buildFormData: buildRemoveImageFormData,
-  operationType: 'removeImage',
-  endpoint: '/api/v1/general/remove-image-pdf',
-};
+export const removeImageOperationConfig: ToolOperationConfig<RemoveImageParameters> =
+  {
+    toolType: ToolType.singleFile,
+    buildFormData: buildRemoveImageFormData,
+    operationType: "removeImage",
+    endpoint: "/api/v1/general/remove-image-pdf",
+  };
 
 export const useRemoveImageOperation = () => {
   const { t } = useTranslation();
@@ -22,9 +30,7 @@ export const useRemoveImageOperation = () => {
   return useToolOperation<RemoveImageParameters>({
     ...removeImageOperationConfig,
     getErrorMessage: createStandardErrorHandler(
-      t('removeImage.error.failed', 'Failed to remove images from the PDF.')
+      t("removeImage.error.failed", "Failed to remove images from the PDF."),
     ),
   });
 };
-
-
diff --git a/frontend/src/core/hooks/tools/removeImage/useRemoveImageParameters.ts b/frontend/src/core/hooks/tools/removeImage/useRemoveImageParameters.ts
index 5684bc003d..9df419b951 100644
--- a/frontend/src/core/hooks/tools/removeImage/useRemoveImageParameters.ts
+++ b/frontend/src/core/hooks/tools/removeImage/useRemoveImageParameters.ts
@@ -1,17 +1,16 @@
-import { useBaseParameters } from '@app/hooks/tools/shared/useBaseParameters';
-import type { BaseParametersHook } from '@app/hooks/tools/shared/useBaseParameters';
+import { useBaseParameters } from "@app/hooks/tools/shared/useBaseParameters";
+import type { BaseParametersHook } from "@app/hooks/tools/shared/useBaseParameters";
 
 export type RemoveImageParameters = Record<string, never>;
 
 export const defaultParameters: RemoveImageParameters = {};
 
-export type RemoveImageParametersHook = BaseParametersHook<RemoveImageParameters>;
+export type RemoveImageParametersHook =
+  BaseParametersHook<RemoveImageParameters>;
 
 export const useRemoveImageParameters = (): RemoveImageParametersHook => {
   return useBaseParameters({
     defaultParameters,
-    endpointName: 'remove-image-pdf',
+    endpointName: "remove-image-pdf",
   });
 };
-
-
diff --git a/frontend/src/core/hooks/tools/removePages/useRemovePagesOperation.ts b/frontend/src/core/hooks/tools/removePages/useRemovePagesOperation.ts
index 85ca86545a..9ff5e6fb62 100644
--- a/frontend/src/core/hooks/tools/removePages/useRemovePagesOperation.ts
+++ b/frontend/src/core/hooks/tools/removePages/useRemovePagesOperation.ts
@@ -1,22 +1,32 @@
-import { useTranslation } from 'react-i18next';
-import { ToolType, useToolOperation, ToolOperationConfig } from '@app/hooks/tools/shared/useToolOperation';
-import { createStandardErrorHandler } from '@app/utils/toolErrorHandler';
-import { RemovePagesParameters, defaultParameters } from '@app/hooks/tools/removePages/useRemovePagesParameters';
+import { useTranslation } from "react-i18next";
+import {
+  ToolType,
+  useToolOperation,
+  ToolOperationConfig,
+} from "@app/hooks/tools/shared/useToolOperation";
+import { createStandardErrorHandler } from "@app/utils/toolErrorHandler";
+import {
+  RemovePagesParameters,
+  defaultParameters,
+} from "@app/hooks/tools/removePages/useRemovePagesParameters";
 // import { useToolResources } from '@app/hooks/tools/shared/useToolResources';
 
-export const buildRemovePagesFormData = (parameters: RemovePagesParameters, file: File): FormData => {
+export const buildRemovePagesFormData = (
+  parameters: RemovePagesParameters,
+  file: File,
+): FormData => {
   const formData = new FormData();
-  formData.append('fileInput', file);
-  const cleaned = parameters.pageNumbers.replace(/\s+/g, '');
-  formData.append('pageNumbers', cleaned);
+  formData.append("fileInput", file);
+  const cleaned = parameters.pageNumbers.replace(/\s+/g, "");
+  formData.append("pageNumbers", cleaned);
   return formData;
 };
 
 export const removePagesOperationConfig = {
   toolType: ToolType.singleFile,
   buildFormData: buildRemovePagesFormData,
-  operationType: 'removePages',
-  endpoint: '/api/v1/general/remove-pages',
+  operationType: "removePages",
+  endpoint: "/api/v1/general/remove-pages",
   defaultParameters,
 } as const satisfies ToolOperationConfig<RemovePagesParameters>;
 
@@ -26,7 +36,7 @@ export const useRemovePagesOperation = () => {
   return useToolOperation<RemovePagesParameters>({
     ...removePagesOperationConfig,
     getErrorMessage: createStandardErrorHandler(
-      t('removePages.error.failed', 'Failed to remove pages')
-    )
+      t("removePages.error.failed", "Failed to remove pages"),
+    ),
   });
 };
diff --git a/frontend/src/core/hooks/tools/removePages/useRemovePagesParameters.ts b/frontend/src/core/hooks/tools/removePages/useRemovePagesParameters.ts
index e2b0139098..97a4953203 100644
--- a/frontend/src/core/hooks/tools/removePages/useRemovePagesParameters.ts
+++ b/frontend/src/core/hooks/tools/removePages/useRemovePagesParameters.ts
@@ -1,21 +1,25 @@
-import { BaseParameters } from '@app/types/parameters';
-import { useBaseParameters, BaseParametersHook } from '@app/hooks/tools/shared/useBaseParameters';
-import { validatePageNumbers } from '@app/utils/pageSelection';
+import { BaseParameters } from "@app/types/parameters";
+import {
+  useBaseParameters,
+  BaseParametersHook,
+} from "@app/hooks/tools/shared/useBaseParameters";
+import { validatePageNumbers } from "@app/utils/pageSelection";
 
 export interface RemovePagesParameters extends BaseParameters {
   pageNumbers: string; // comma-separated page numbers or ranges (e.g., "1,3,5-8")
 }
 
 export const defaultParameters: RemovePagesParameters = {
-  pageNumbers: '',
+  pageNumbers: "",
 };
 
-export type RemovePagesParametersHook = BaseParametersHook<RemovePagesParameters>;
+export type RemovePagesParametersHook =
+  BaseParametersHook<RemovePagesParameters>;
 
 export const useRemovePagesParameters = (): RemovePagesParametersHook => {
   return useBaseParameters({
     defaultParameters,
-    endpointName: 'remove-pages',
+    endpointName: "remove-pages",
     validateFn: (p) => validatePageNumbers(p.pageNumbers),
   });
 };
diff --git a/frontend/src/core/hooks/tools/removePassword/buildRemovePasswordFormData.ts b/frontend/src/core/hooks/tools/removePassword/buildRemovePasswordFormData.ts
index cf3619afc3..8f04c4806f 100644
--- a/frontend/src/core/hooks/tools/removePassword/buildRemovePasswordFormData.ts
+++ b/frontend/src/core/hooks/tools/removePassword/buildRemovePasswordFormData.ts
@@ -1,10 +1,13 @@
-import { RemovePasswordParameters } from '@app/hooks/tools/removePassword/useRemovePasswordParameters';
+import { RemovePasswordParameters } from "@app/hooks/tools/removePassword/useRemovePasswordParameters";
 
 /**
  * Builds FormData for remove password API request.
  * Separated from operation config to avoid circular dependencies with FileContext.
  */
-export const buildRemovePasswordFormData = (parameters: RemovePasswordParameters, file: File): FormData => {
+export const buildRemovePasswordFormData = (
+  parameters: RemovePasswordParameters,
+  file: File,
+): FormData => {
   const formData = new FormData();
   formData.append("fileInput", file);
   formData.append("password", parameters.password);
diff --git a/frontend/src/core/hooks/tools/removePassword/useRemovePasswordOperation.test.ts b/frontend/src/core/hooks/tools/removePassword/useRemovePasswordOperation.test.ts
index f29ba15111..b60aa09762 100644
--- a/frontend/src/core/hooks/tools/removePassword/useRemovePasswordOperation.test.ts
+++ b/frontend/src/core/hooks/tools/removePassword/useRemovePasswordOperation.test.ts
@@ -1,43 +1,50 @@
-import { describe, expect, test, vi, beforeEach } from 'vitest';
-import { renderHook } from '@testing-library/react';
-import { useRemovePasswordOperation } from '@app/hooks/tools/removePassword/useRemovePasswordOperation';
-import type { RemovePasswordParameters } from '@app/hooks/tools/removePassword/useRemovePasswordParameters';
+import { describe, expect, test, vi, beforeEach } from "vitest";
+import { renderHook } from "@testing-library/react";
+import { useRemovePasswordOperation } from "@app/hooks/tools/removePassword/useRemovePasswordOperation";
+import type { RemovePasswordParameters } from "@app/hooks/tools/removePassword/useRemovePasswordParameters";
 
-vi.mock('../shared/useToolOperation', async () => {
-  const actual = await vi.importActual('../shared/useToolOperation');  // Need to keep ToolType etc.
+vi.mock("../shared/useToolOperation", async () => {
+  const actual = await vi.importActual("../shared/useToolOperation"); // Need to keep ToolType etc.
   return {
     ...actual,
-    useToolOperation: vi.fn()
+    useToolOperation: vi.fn(),
   };
 });
 
 // Mock the translation hook
 const mockT = vi.fn((key: string) => `translated-${key}`);
-vi.mock('react-i18next', () => ({
-  useTranslation: () => ({ t: mockT })
+vi.mock("react-i18next", () => ({
+  useTranslation: () => ({ t: mockT }),
 }));
 
 // Mock the error handler
-vi.mock('../../../utils/toolErrorHandler', () => ({
-  createStandardErrorHandler: vi.fn(() => 'error-handler-function')
+vi.mock("../../../utils/toolErrorHandler", () => ({
+  createStandardErrorHandler: vi.fn(() => "error-handler-function"),
 }));
 
 // Import the mocked function
-import { SingleFileToolOperationConfig, ToolOperationHook, ToolType, useToolOperation } from '@app/hooks/tools/shared/useToolOperation';
+import {
+  SingleFileToolOperationConfig,
+  ToolOperationHook,
+  ToolType,
+  useToolOperation,
+} from "@app/hooks/tools/shared/useToolOperation";
 
-describe('useRemovePasswordOperation', () => {
+describe("useRemovePasswordOperation", () => {
   const mockUseToolOperation = vi.mocked(useToolOperation);
 
-  const getToolConfig = () => mockUseToolOperation.mock.calls[0][0] as SingleFileToolOperationConfig<RemovePasswordParameters>;
+  const getToolConfig = () =>
+    mockUseToolOperation.mock
+      .calls[0][0] as SingleFileToolOperationConfig<RemovePasswordParameters>;
 
   const mockToolOperationReturn: ToolOperationHook<unknown> = {
     files: [],
     thumbnails: [],
     downloadUrl: null,
-    downloadFilename: '',
+    downloadFilename: "",
     isLoading: false,
     errorMessage: null,
-    status: '',
+    status: "",
     isGeneratingThumbnails: false,
     progress: null,
     executeOperation: vi.fn(),
@@ -54,51 +61,56 @@ describe('useRemovePasswordOperation', () => {
 
   test.each([
     {
-      description: 'with valid password',
-      password: 'test-password'
+      description: "with valid password",
+      password: "test-password",
     },
     {
-      description: 'with complex password',
-      password: 'C0mpl3x@P@ssw0rd!'
+      description: "with complex password",
+      password: "C0mpl3x@P@ssw0rd!",
     },
     {
-      description: 'with single character password',
-      password: 'a'
-    }
-  ])('should create form data correctly $description', ({ password }) => {
+      description: "with single character password",
+      password: "a",
+    },
+  ])("should create form data correctly $description", ({ password }) => {
     renderHook(() => useRemovePasswordOperation());
 
     const callArgs = getToolConfig();
     const buildFormData = callArgs.buildFormData;
 
     const testParameters: RemovePasswordParameters = {
-      password
+      password,
     };
 
-    const testFile = new File(['test content'], 'test.pdf', { type: 'application/pdf' });
+    const testFile = new File(["test content"], "test.pdf", {
+      type: "application/pdf",
+    });
     const formData = buildFormData(testParameters, testFile as any);
 
     // Verify the form data contains the file
-    expect(formData.get('fileInput')).toBe(testFile);
+    expect(formData.get("fileInput")).toBe(testFile);
 
     // Verify password parameter
-    expect(formData.get('password')).toBe(password);
+    expect(formData.get("password")).toBe(password);
   });
 
-  test('should use correct translation for error messages', () => {
+  test("should use correct translation for error messages", () => {
     renderHook(() => useRemovePasswordOperation());
 
     expect(mockT).toHaveBeenCalledWith(
-      'removePassword.error.failed',
-      'An error occurred while removing the password from the PDF.'
+      "removePassword.error.failed",
+      "An error occurred while removing the password from the PDF.",
     );
   });
 
   test.each([
-    { property: 'toolType' as const, expectedValue: ToolType.singleFile },
-    { property: 'endpoint' as const, expectedValue: '/api/v1/security/remove-password' },
-    { property: 'operationType' as const, expectedValue: 'removePassword' }
-  ])('should configure $property correctly', ({ property, expectedValue }) => {
+    { property: "toolType" as const, expectedValue: ToolType.singleFile },
+    {
+      property: "endpoint" as const,
+      expectedValue: "/api/v1/security/remove-password",
+    },
+    { property: "operationType" as const, expectedValue: "removePassword" },
+  ])("should configure $property correctly", ({ property, expectedValue }) => {
     renderHook(() => useRemovePasswordOperation());
 
     const callArgs = getToolConfig();
diff --git a/frontend/src/core/hooks/tools/removePassword/useRemovePasswordOperation.ts b/frontend/src/core/hooks/tools/removePassword/useRemovePasswordOperation.ts
index 4f31e8078f..aa71a5befb 100644
--- a/frontend/src/core/hooks/tools/removePassword/useRemovePasswordOperation.ts
+++ b/frontend/src/core/hooks/tools/removePassword/useRemovePasswordOperation.ts
@@ -1,8 +1,14 @@
-import { useTranslation } from 'react-i18next';
-import { ToolType, useToolOperation } from '@app/hooks/tools/shared/useToolOperation';
-import { createStandardErrorHandler } from '@app/utils/toolErrorHandler';
-import { RemovePasswordParameters, defaultParameters } from '@app/hooks/tools/removePassword/useRemovePasswordParameters';
-import { buildRemovePasswordFormData } from '@app/hooks/tools/removePassword/buildRemovePasswordFormData';
+import { useTranslation } from "react-i18next";
+import {
+  ToolType,
+  useToolOperation,
+} from "@app/hooks/tools/shared/useToolOperation";
+import { createStandardErrorHandler } from "@app/utils/toolErrorHandler";
+import {
+  RemovePasswordParameters,
+  defaultParameters,
+} from "@app/hooks/tools/removePassword/useRemovePasswordParameters";
+import { buildRemovePasswordFormData } from "@app/hooks/tools/removePassword/buildRemovePasswordFormData";
 
 // Re-export for backwards compatibility with any other imports
 export { buildRemovePasswordFormData };
@@ -11,8 +17,8 @@ export { buildRemovePasswordFormData };
 export const removePasswordOperationConfig = {
   toolType: ToolType.singleFile,
   buildFormData: buildRemovePasswordFormData,
-  operationType: 'removePassword',
-  endpoint: '/api/v1/security/remove-password',
+  operationType: "removePassword",
+  endpoint: "/api/v1/security/remove-password",
   defaultParameters,
 } as const;
 
@@ -21,6 +27,11 @@ export const useRemovePasswordOperation = () => {
 
   return useToolOperation<RemovePasswordParameters>({
     ...removePasswordOperationConfig,
-    getErrorMessage: createStandardErrorHandler(t('removePassword.error.failed', 'An error occurred while removing the password from the PDF.'))
+    getErrorMessage: createStandardErrorHandler(
+      t(
+        "removePassword.error.failed",
+        "An error occurred while removing the password from the PDF.",
+      ),
+    ),
   });
 };
diff --git a/frontend/src/core/hooks/tools/removePassword/useRemovePasswordParameters.test.ts b/frontend/src/core/hooks/tools/removePassword/useRemovePasswordParameters.test.ts
index d3d2a4c5cb..84c488cc13 100644
--- a/frontend/src/core/hooks/tools/removePassword/useRemovePasswordParameters.test.ts
+++ b/frontend/src/core/hooks/tools/removePassword/useRemovePasswordParameters.test.ts
@@ -1,33 +1,36 @@
-import { describe, expect, test } from 'vitest';
-import { renderHook, act } from '@testing-library/react';
-import { useRemovePasswordParameters, defaultParameters } from '@app/hooks/tools/removePassword/useRemovePasswordParameters';
+import { describe, expect, test } from "vitest";
+import { renderHook, act } from "@testing-library/react";
+import {
+  useRemovePasswordParameters,
+  defaultParameters,
+} from "@app/hooks/tools/removePassword/useRemovePasswordParameters";
 
-describe('useRemovePasswordParameters', () => {
-  test('should initialize with default parameters', () => {
+describe("useRemovePasswordParameters", () => {
+  test("should initialize with default parameters", () => {
     const { result } = renderHook(() => useRemovePasswordParameters());
 
     expect(result.current.parameters).toStrictEqual(defaultParameters);
   });
 
-  test('should update password parameter', () => {
+  test("should update password parameter", () => {
     const { result } = renderHook(() => useRemovePasswordParameters());
 
     act(() => {
-      result.current.updateParameter('password', 'test-password');
+      result.current.updateParameter("password", "test-password");
     });
 
-    expect(result.current.parameters.password).toBe('test-password');
+    expect(result.current.parameters.password).toBe("test-password");
   });
 
-  test('should reset parameters to defaults', () => {
+  test("should reset parameters to defaults", () => {
     const { result } = renderHook(() => useRemovePasswordParameters());
 
     // First, change the password
     act(() => {
-      result.current.updateParameter('password', 'test-password');
+      result.current.updateParameter("password", "test-password");
     });
 
-    expect(result.current.parameters.password).toBe('test-password');
+    expect(result.current.parameters.password).toBe("test-password");
 
     // Then reset
     act(() => {
@@ -37,45 +40,48 @@ describe('useRemovePasswordParameters', () => {
     expect(result.current.parameters).toStrictEqual(defaultParameters);
   });
 
-  test('should return correct endpoint name', () => {
+  test("should return correct endpoint name", () => {
     const { result } = renderHook(() => useRemovePasswordParameters());
 
-    expect(result.current.getEndpointName()).toBe('remove-password');
+    expect(result.current.getEndpointName()).toBe("remove-password");
   });
 
   test.each([
     {
-      description: 'with valid password',
-      password: 'valid-password',
-      expectedValid: true
+      description: "with valid password",
+      password: "valid-password",
+      expectedValid: true,
     },
     {
-      description: 'with empty password',
-      password: '',
-      expectedValid: false
+      description: "with empty password",
+      password: "",
+      expectedValid: false,
     },
     {
-      description: 'with whitespace only password',
-      password: '   \t   ',
-      expectedValid: true
+      description: "with whitespace only password",
+      password: "   \t   ",
+      expectedValid: true,
     },
     {
-      description: 'with password containing special characters',
-      password: 'p@ssw0rd!',
-      expectedValid: true
+      description: "with password containing special characters",
+      password: "p@ssw0rd!",
+      expectedValid: true,
     },
     {
-      description: 'with single character password',
-      password: 'a',
-      expectedValid: true
-    }
-  ])('should validate parameters correctly $description', ({ password, expectedValid }) => {
-    const { result } = renderHook(() => useRemovePasswordParameters());
+      description: "with single character password",
+      password: "a",
+      expectedValid: true,
+    },
+  ])(
+    "should validate parameters correctly $description",
+    ({ password, expectedValid }) => {
+      const { result } = renderHook(() => useRemovePasswordParameters());
 
-    act(() => {
-      result.current.updateParameter('password', password);
-    });
+      act(() => {
+        result.current.updateParameter("password", password);
+      });
 
-    expect(result.current.validateParameters()).toBe(expectedValid);
-  });
+      expect(result.current.validateParameters()).toBe(expectedValid);
+    },
+  );
 });
diff --git a/frontend/src/core/hooks/tools/removePassword/useRemovePasswordParameters.ts b/frontend/src/core/hooks/tools/removePassword/useRemovePasswordParameters.ts
index 9c2ad4981a..ebb0dd317f 100644
--- a/frontend/src/core/hooks/tools/removePassword/useRemovePasswordParameters.ts
+++ b/frontend/src/core/hooks/tools/removePassword/useRemovePasswordParameters.ts
@@ -1,22 +1,26 @@
-import { BaseParameters } from '@app/types/parameters';
-import { useBaseParameters, BaseParametersHook } from '@app/hooks/tools/shared/useBaseParameters';
+import { BaseParameters } from "@app/types/parameters";
+import {
+  useBaseParameters,
+  BaseParametersHook,
+} from "@app/hooks/tools/shared/useBaseParameters";
 
 export interface RemovePasswordParameters extends BaseParameters {
   password: string;
 }
 
-export type RemovePasswordParametersHook = BaseParametersHook<RemovePasswordParameters>;
+export type RemovePasswordParametersHook =
+  BaseParametersHook<RemovePasswordParameters>;
 
 export const defaultParameters: RemovePasswordParameters = {
-  password: '',
+  password: "",
 };
 
 export const useRemovePasswordParameters = (): RemovePasswordParametersHook => {
   return useBaseParameters({
     defaultParameters,
-    endpointName: 'remove-password',
+    endpointName: "remove-password",
     validateFn: (params) => {
-      return params.password !== '';
+      return params.password !== "";
     },
   });
 };
diff --git a/frontend/src/core/hooks/tools/reorganizePages/useReorganizePagesOperation.ts b/frontend/src/core/hooks/tools/reorganizePages/useReorganizePagesOperation.ts
index de18207fbd..de5aaf5c53 100644
--- a/frontend/src/core/hooks/tools/reorganizePages/useReorganizePagesOperation.ts
+++ b/frontend/src/core/hooks/tools/reorganizePages/useReorganizePagesOperation.ts
@@ -1,36 +1,42 @@
-import { useTranslation } from 'react-i18next';
-import { ToolOperationConfig, ToolType, useToolOperation } from '@app/hooks/tools/shared/useToolOperation';
-import { createStandardErrorHandler } from '@app/utils/toolErrorHandler';
-import { ReorganizePagesParameters } from '@app/hooks/tools/reorganizePages/useReorganizePagesParameters';
+import { useTranslation } from "react-i18next";
+import {
+  ToolOperationConfig,
+  ToolType,
+  useToolOperation,
+} from "@app/hooks/tools/shared/useToolOperation";
+import { createStandardErrorHandler } from "@app/utils/toolErrorHandler";
+import { ReorganizePagesParameters } from "@app/hooks/tools/reorganizePages/useReorganizePagesParameters";
 
-const buildFormData = (parameters: ReorganizePagesParameters, file: File): FormData => {
+const buildFormData = (
+  parameters: ReorganizePagesParameters,
+  file: File,
+): FormData => {
   const formData = new FormData();
-  formData.append('fileInput', file);
+  formData.append("fileInput", file);
   if (parameters.customMode) {
-    formData.append('customMode', parameters.customMode);
+    formData.append("customMode", parameters.customMode);
   }
   if (parameters.pageNumbers) {
-    const cleaned = parameters.pageNumbers.replace(/\s+/g, '');
-    formData.append('pageNumbers', cleaned);
+    const cleaned = parameters.pageNumbers.replace(/\s+/g, "");
+    formData.append("pageNumbers", cleaned);
   }
   return formData;
 };
 
-export const reorganizePagesOperationConfig: ToolOperationConfig<ReorganizePagesParameters> = {
-  toolType: ToolType.singleFile,
-  buildFormData,
-  operationType: 'reorganizePages',
-  endpoint: '/api/v1/general/rearrange-pages',
-};
+export const reorganizePagesOperationConfig: ToolOperationConfig<ReorganizePagesParameters> =
+  {
+    toolType: ToolType.singleFile,
+    buildFormData,
+    operationType: "reorganizePages",
+    endpoint: "/api/v1/general/rearrange-pages",
+  };
 
 export const useReorganizePagesOperation = () => {
   const { t } = useTranslation();
   return useToolOperation<ReorganizePagesParameters>({
     ...reorganizePagesOperationConfig,
     getErrorMessage: createStandardErrorHandler(
-      t('reorganizePages.error.failed', 'Failed to reorganize pages')
-    )
+      t("reorganizePages.error.failed", "Failed to reorganize pages"),
+    ),
   });
 };
-
-
diff --git a/frontend/src/core/hooks/tools/reorganizePages/useReorganizePagesParameters.ts b/frontend/src/core/hooks/tools/reorganizePages/useReorganizePagesParameters.ts
index 799ed26df1..6201053751 100644
--- a/frontend/src/core/hooks/tools/reorganizePages/useReorganizePagesParameters.ts
+++ b/frontend/src/core/hooks/tools/reorganizePages/useReorganizePagesParameters.ts
@@ -1,4 +1,4 @@
-import { useState } from 'react';
+import { useState } from "react";
 
 export interface ReorganizePagesParameters {
   customMode: string; // empty string means custom order using pageNumbers
@@ -6,25 +6,28 @@ export interface ReorganizePagesParameters {
 }
 
 export const defaultReorganizePagesParameters: ReorganizePagesParameters = {
-  customMode: '',
-  pageNumbers: '',
+  customMode: "",
+  pageNumbers: "",
 };
 
 export const useReorganizePagesParameters = () => {
-  const [parameters, setParameters] = useState<ReorganizePagesParameters>(defaultReorganizePagesParameters);
+  const [parameters, setParameters] = useState<ReorganizePagesParameters>(
+    defaultReorganizePagesParameters,
+  );
 
   const updateParameter = <K extends keyof ReorganizePagesParameters>(
     key: K,
-    value: ReorganizePagesParameters[K]
+    value: ReorganizePagesParameters[K],
   ) => {
-    setParameters(prev => ({ ...prev, [key]: value }));
+    setParameters((prev) => ({ ...prev, [key]: value }));
   };
 
   const resetParameters = () => setParameters(defaultReorganizePagesParameters);
 
   // If customMode is '' (custom) or 'DUPLICATE', a page order is required; otherwise it's optional/ignored
   const validateParameters = (): boolean => {
-    const requiresOrder = parameters.customMode === '' || parameters.customMode === 'DUPLICATE';
+    const requiresOrder =
+      parameters.customMode === "" || parameters.customMode === "DUPLICATE";
     return requiresOrder ? parameters.pageNumbers.trim().length > 0 : true;
   };
 
@@ -35,5 +38,3 @@ export const useReorganizePagesParameters = () => {
     validateParameters,
   };
 };
-
-
diff --git a/frontend/src/core/hooks/tools/repair/useRepairOperation.ts b/frontend/src/core/hooks/tools/repair/useRepairOperation.ts
index 59f8c9eeae..a62f448bac 100644
--- a/frontend/src/core/hooks/tools/repair/useRepairOperation.ts
+++ b/frontend/src/core/hooks/tools/repair/useRepairOperation.ts
@@ -1,10 +1,19 @@
-import { useTranslation } from 'react-i18next';
-import { ToolType, useToolOperation } from '@app/hooks/tools/shared/useToolOperation';
-import { createStandardErrorHandler } from '@app/utils/toolErrorHandler';
-import { RepairParameters, defaultParameters } from '@app/hooks/tools/repair/useRepairParameters';
+import { useTranslation } from "react-i18next";
+import {
+  ToolType,
+  useToolOperation,
+} from "@app/hooks/tools/shared/useToolOperation";
+import { createStandardErrorHandler } from "@app/utils/toolErrorHandler";
+import {
+  RepairParameters,
+  defaultParameters,
+} from "@app/hooks/tools/repair/useRepairParameters";
 
 // Static function that can be used by both the hook and automation executor
-export const buildRepairFormData = (_parameters: RepairParameters, file: File): FormData => {
+export const buildRepairFormData = (
+  _parameters: RepairParameters,
+  file: File,
+): FormData => {
   const formData = new FormData();
   formData.append("fileInput", file);
   return formData;
@@ -14,8 +23,8 @@ export const buildRepairFormData = (_parameters: RepairParameters, file: File):
 export const repairOperationConfig = {
   toolType: ToolType.singleFile,
   buildFormData: buildRepairFormData,
-  operationType: 'repair',
-  endpoint: '/api/v1/misc/repair',
+  operationType: "repair",
+  endpoint: "/api/v1/misc/repair",
   defaultParameters,
 } as const;
 
@@ -24,6 +33,8 @@ export const useRepairOperation = () => {
 
   return useToolOperation<RepairParameters>({
     ...repairOperationConfig,
-    getErrorMessage: createStandardErrorHandler(t('repair.error.failed', 'An error occurred while repairing the PDF.'))
+    getErrorMessage: createStandardErrorHandler(
+      t("repair.error.failed", "An error occurred while repairing the PDF."),
+    ),
   });
 };
diff --git a/frontend/src/core/hooks/tools/repair/useRepairParameters.ts b/frontend/src/core/hooks/tools/repair/useRepairParameters.ts
index 9b613d764b..d7f8e233bb 100644
--- a/frontend/src/core/hooks/tools/repair/useRepairParameters.ts
+++ b/frontend/src/core/hooks/tools/repair/useRepairParameters.ts
@@ -1,5 +1,8 @@
-import { BaseParameters } from '@app/types/parameters';
-import { useBaseParameters, BaseParametersHook } from '@app/hooks/tools/shared/useBaseParameters';
+import { BaseParameters } from "@app/types/parameters";
+import {
+  useBaseParameters,
+  BaseParametersHook,
+} from "@app/hooks/tools/shared/useBaseParameters";
 
 export interface RepairParameters extends BaseParameters {
   // Extends BaseParameters - ready for future parameter additions if needed
@@ -14,7 +17,7 @@ export type RepairParametersHook = BaseParametersHook<RepairParameters>;
 export const useRepairParameters = (): RepairParametersHook => {
   return useBaseParameters({
     defaultParameters,
-    endpointName: 'repair',
+    endpointName: "repair",
     // validateFn: optional custom validation if needed in future
   });
-};
\ No newline at end of file
+};
diff --git a/frontend/src/core/hooks/tools/replaceColor/useReplaceColorOperation.ts b/frontend/src/core/hooks/tools/replaceColor/useReplaceColorOperation.ts
index 87713a5b4b..dd24c10e22 100644
--- a/frontend/src/core/hooks/tools/replaceColor/useReplaceColorOperation.ts
+++ b/frontend/src/core/hooks/tools/replaceColor/useReplaceColorOperation.ts
@@ -1,19 +1,31 @@
-import { useTranslation } from 'react-i18next';
-import { ToolType, useToolOperation } from '@app/hooks/tools/shared/useToolOperation';
-import { createStandardErrorHandler } from '@app/utils/toolErrorHandler';
-import { ReplaceColorParameters, defaultParameters } from '@app/hooks/tools/replaceColor/useReplaceColorParameters';
+import { useTranslation } from "react-i18next";
+import {
+  ToolType,
+  useToolOperation,
+} from "@app/hooks/tools/shared/useToolOperation";
+import { createStandardErrorHandler } from "@app/utils/toolErrorHandler";
+import {
+  ReplaceColorParameters,
+  defaultParameters,
+} from "@app/hooks/tools/replaceColor/useReplaceColorParameters";
 
-export const buildReplaceColorFormData = (parameters: ReplaceColorParameters, file: File): FormData => {
+export const buildReplaceColorFormData = (
+  parameters: ReplaceColorParameters,
+  file: File,
+): FormData => {
   const formData = new FormData();
-  formData.append('fileInput', file);
+  formData.append("fileInput", file);
 
-  formData.append('replaceAndInvertOption', parameters.replaceAndInvertOption);
+  formData.append("replaceAndInvertOption", parameters.replaceAndInvertOption);
 
-  if (parameters.replaceAndInvertOption === 'HIGH_CONTRAST_COLOR') {
-    formData.append('highContrastColorCombination', parameters.highContrastColorCombination);
-  } else if (parameters.replaceAndInvertOption === 'CUSTOM_COLOR') {
-    formData.append('textColor', parameters.textColor);
-    formData.append('backGroundColor', parameters.backGroundColor);
+  if (parameters.replaceAndInvertOption === "HIGH_CONTRAST_COLOR") {
+    formData.append(
+      "highContrastColorCombination",
+      parameters.highContrastColorCombination,
+    );
+  } else if (parameters.replaceAndInvertOption === "CUSTOM_COLOR") {
+    formData.append("textColor", parameters.textColor);
+    formData.append("backGroundColor", parameters.backGroundColor);
   }
 
   return formData;
@@ -22,8 +34,8 @@ export const buildReplaceColorFormData = (parameters: ReplaceColorParameters, fi
 export const replaceColorOperationConfig = {
   toolType: ToolType.singleFile,
   buildFormData: buildReplaceColorFormData,
-  operationType: 'replaceColor',
-  endpoint: '/api/v1/misc/replace-invert-pdf',
+  operationType: "replaceColor",
+  endpoint: "/api/v1/misc/replace-invert-pdf",
   multiFileEndpoint: false,
   defaultParameters,
 } as const;
@@ -33,6 +45,11 @@ export const useReplaceColorOperation = () => {
 
   return useToolOperation<ReplaceColorParameters>({
     ...replaceColorOperationConfig,
-    getErrorMessage: createStandardErrorHandler(t('replaceColor.error.failed', 'An error occurred while processing the colour replacement.'))
+    getErrorMessage: createStandardErrorHandler(
+      t(
+        "replaceColor.error.failed",
+        "An error occurred while processing the colour replacement.",
+      ),
+    ),
   });
 };
diff --git a/frontend/src/core/hooks/tools/replaceColor/useReplaceColorParameters.ts b/frontend/src/core/hooks/tools/replaceColor/useReplaceColorParameters.ts
index a0a0099c4c..5304210ce3 100644
--- a/frontend/src/core/hooks/tools/replaceColor/useReplaceColorParameters.ts
+++ b/frontend/src/core/hooks/tools/replaceColor/useReplaceColorParameters.ts
@@ -1,29 +1,41 @@
-import { BaseParameters } from '@app/types/parameters';
-import { useBaseParameters, BaseParametersHook } from '@app/hooks/tools/shared/useBaseParameters';
+import { BaseParameters } from "@app/types/parameters";
+import {
+  useBaseParameters,
+  BaseParametersHook,
+} from "@app/hooks/tools/shared/useBaseParameters";
 
 export interface ReplaceColorParameters extends BaseParameters {
-  replaceAndInvertOption: 'HIGH_CONTRAST_COLOR' | 'CUSTOM_COLOR' | 'FULL_INVERSION' | 'COLOR_SPACE_CONVERSION';
-  highContrastColorCombination: 'WHITE_TEXT_ON_BLACK' | 'BLACK_TEXT_ON_WHITE' | 'YELLOW_TEXT_ON_BLACK' | 'GREEN_TEXT_ON_BLACK';
+  replaceAndInvertOption:
+    | "HIGH_CONTRAST_COLOR"
+    | "CUSTOM_COLOR"
+    | "FULL_INVERSION"
+    | "COLOR_SPACE_CONVERSION";
+  highContrastColorCombination:
+    | "WHITE_TEXT_ON_BLACK"
+    | "BLACK_TEXT_ON_WHITE"
+    | "YELLOW_TEXT_ON_BLACK"
+    | "GREEN_TEXT_ON_BLACK";
   textColor: string;
   backGroundColor: string;
 }
 
 export const defaultParameters: ReplaceColorParameters = {
-  replaceAndInvertOption: 'HIGH_CONTRAST_COLOR',
-  highContrastColorCombination: 'WHITE_TEXT_ON_BLACK',
-  textColor: '#000000',
-  backGroundColor: '#ffffff',
+  replaceAndInvertOption: "HIGH_CONTRAST_COLOR",
+  highContrastColorCombination: "WHITE_TEXT_ON_BLACK",
+  textColor: "#000000",
+  backGroundColor: "#ffffff",
 };
 
-export type ReplaceColorParametersHook = BaseParametersHook<ReplaceColorParameters>;
+export type ReplaceColorParametersHook =
+  BaseParametersHook<ReplaceColorParameters>;
 
 export const useReplaceColorParameters = (): ReplaceColorParametersHook => {
   return useBaseParameters({
     defaultParameters,
-    endpointName: 'replace-invert-pdf',
+    endpointName: "replace-invert-pdf",
     validateFn: () => {
       // All parameters are always valid as they have defaults
       return true;
     },
   });
-};
\ No newline at end of file
+};
diff --git a/frontend/src/core/hooks/tools/rotate/useRotateOperation.test.ts b/frontend/src/core/hooks/tools/rotate/useRotateOperation.test.ts
index 93dd6a5604..5db2b30788 100644
--- a/frontend/src/core/hooks/tools/rotate/useRotateOperation.test.ts
+++ b/frontend/src/core/hooks/tools/rotate/useRotateOperation.test.ts
@@ -1,44 +1,51 @@
-import { describe, expect, test, vi, beforeEach } from 'vitest';
-import { renderHook } from '@testing-library/react';
-import { useRotateOperation } from '@app/hooks/tools/rotate/useRotateOperation';
-import type { RotateParameters } from '@app/hooks/tools/rotate/useRotateParameters';
+import { describe, expect, test, vi, beforeEach } from "vitest";
+import { renderHook } from "@testing-library/react";
+import { useRotateOperation } from "@app/hooks/tools/rotate/useRotateOperation";
+import type { RotateParameters } from "@app/hooks/tools/rotate/useRotateParameters";
 
 // Mock the useToolOperation hook
-vi.mock('../shared/useToolOperation', async () => {
-  const actual = await vi.importActual('../shared/useToolOperation');
+vi.mock("../shared/useToolOperation", async () => {
+  const actual = await vi.importActual("../shared/useToolOperation");
   return {
     ...actual,
-    useToolOperation: vi.fn()
+    useToolOperation: vi.fn(),
   };
 });
 
 // Mock the translation hook
 const mockT = vi.fn((key: string) => `translated-${key}`);
-vi.mock('react-i18next', () => ({
-  useTranslation: () => ({ t: mockT })
+vi.mock("react-i18next", () => ({
+  useTranslation: () => ({ t: mockT }),
 }));
 
 // Mock the error handler
-vi.mock('../../../utils/toolErrorHandler', () => ({
-  createStandardErrorHandler: vi.fn(() => 'error-handler-function')
+vi.mock("../../../utils/toolErrorHandler", () => ({
+  createStandardErrorHandler: vi.fn(() => "error-handler-function"),
 }));
 
 // Import the mocked function
-import { SingleFileToolOperationConfig, ToolOperationHook, ToolType, useToolOperation } from '@app/hooks/tools/shared/useToolOperation';
+import {
+  SingleFileToolOperationConfig,
+  ToolOperationHook,
+  ToolType,
+  useToolOperation,
+} from "@app/hooks/tools/shared/useToolOperation";
 
-describe('useRotateOperation', () => {
+describe("useRotateOperation", () => {
   const mockUseToolOperation = vi.mocked(useToolOperation);
 
-  const getToolConfig = () => mockUseToolOperation.mock.calls[0][0] as SingleFileToolOperationConfig<RotateParameters>;
+  const getToolConfig = () =>
+    mockUseToolOperation.mock
+      .calls[0][0] as SingleFileToolOperationConfig<RotateParameters>;
 
   const mockToolOperationReturn: ToolOperationHook<unknown> = {
     files: [],
     thumbnails: [],
     downloadUrl: null,
-    downloadFilename: '',
+    downloadFilename: "",
     isLoading: false,
     errorMessage: null,
-    status: '',
+    status: "",
     isGeneratingThumbnails: false,
     progress: null,
     executeOperation: vi.fn(),
@@ -63,36 +70,44 @@ describe('useRotateOperation', () => {
     { angle: -180, expectedNormalized: 180 },
     { angle: -270, expectedNormalized: 90 },
     { angle: 450, expectedNormalized: 90 },
-  ])('should create form data correctly with angle $angle (normalized to $expectedNormalized)', ({ angle, expectedNormalized }) => {
-    renderHook(() => useRotateOperation());
+  ])(
+    "should create form data correctly with angle $angle (normalized to $expectedNormalized)",
+    ({ angle, expectedNormalized }) => {
+      renderHook(() => useRotateOperation());
 
-    const callArgs = getToolConfig();
+      const callArgs = getToolConfig();
 
-    const testParameters: RotateParameters = { angle };
-    const testFile = new File(['test content'], 'test.pdf', { type: 'application/pdf' });
-    const formData = callArgs.buildFormData(testParameters, testFile);
+      const testParameters: RotateParameters = { angle };
+      const testFile = new File(["test content"], "test.pdf", {
+        type: "application/pdf",
+      });
+      const formData = callArgs.buildFormData(testParameters, testFile);
 
-    // Verify the form data contains the file
-    expect(formData.get('fileInput')).toBe(testFile);
+      // Verify the form data contains the file
+      expect(formData.get("fileInput")).toBe(testFile);
 
-    // Verify angle parameter is normalized for backend
-    expect(formData.get('angle')).toBe(expectedNormalized.toString());
-  });
+      // Verify angle parameter is normalized for backend
+      expect(formData.get("angle")).toBe(expectedNormalized.toString());
+    },
+  );
 
-  test('should use correct translation for error messages', () => {
+  test("should use correct translation for error messages", () => {
     renderHook(() => useRotateOperation());
 
     expect(mockT).toHaveBeenCalledWith(
-      'rotate.error.failed',
-      'An error occurred while rotating the PDF.'
+      "rotate.error.failed",
+      "An error occurred while rotating the PDF.",
     );
   });
 
   test.each([
-    { property: 'toolType' as const, expectedValue: ToolType.singleFile },
-    { property: 'endpoint' as const, expectedValue: '/api/v1/general/rotate-pdf' },
-    { property: 'operationType' as const, expectedValue: 'rotate' }
-  ])('should configure $property correctly', ({ property, expectedValue }) => {
+    { property: "toolType" as const, expectedValue: ToolType.singleFile },
+    {
+      property: "endpoint" as const,
+      expectedValue: "/api/v1/general/rotate-pdf",
+    },
+    { property: "operationType" as const, expectedValue: "rotate" },
+  ])("should configure $property correctly", ({ property, expectedValue }) => {
     renderHook(() => useRotateOperation());
 
     const callArgs = getToolConfig();
diff --git a/frontend/src/core/hooks/tools/rotate/useRotateOperation.ts b/frontend/src/core/hooks/tools/rotate/useRotateOperation.ts
index c7b1e1a5e7..e675610eb9 100644
--- a/frontend/src/core/hooks/tools/rotate/useRotateOperation.ts
+++ b/frontend/src/core/hooks/tools/rotate/useRotateOperation.ts
@@ -1,10 +1,20 @@
-import { useTranslation } from 'react-i18next';
-import { useToolOperation, ToolType } from '@app/hooks/tools/shared/useToolOperation';
-import { createStandardErrorHandler } from '@app/utils/toolErrorHandler';
-import { RotateParameters, defaultParameters, normalizeAngle } from '@app/hooks/tools/rotate/useRotateParameters';
+import { useTranslation } from "react-i18next";
+import {
+  useToolOperation,
+  ToolType,
+} from "@app/hooks/tools/shared/useToolOperation";
+import { createStandardErrorHandler } from "@app/utils/toolErrorHandler";
+import {
+  RotateParameters,
+  defaultParameters,
+  normalizeAngle,
+} from "@app/hooks/tools/rotate/useRotateParameters";
 
 // Static configuration that can be used by both the hook and automation executor
-export const buildRotateFormData = (parameters: RotateParameters, file: File): FormData => {
+export const buildRotateFormData = (
+  parameters: RotateParameters,
+  file: File,
+): FormData => {
   const formData = new FormData();
   formData.append("fileInput", file);
   // Normalize angle for backend (0, 90, 180, 270)
@@ -16,8 +26,8 @@ export const buildRotateFormData = (parameters: RotateParameters, file: File): F
 export const rotateOperationConfig = {
   toolType: ToolType.singleFile,
   buildFormData: buildRotateFormData,
-  operationType: 'rotate',
-  endpoint: '/api/v1/general/rotate-pdf',
+  operationType: "rotate",
+  endpoint: "/api/v1/general/rotate-pdf",
   defaultParameters,
 } as const;
 
@@ -26,6 +36,8 @@ export const useRotateOperation = () => {
 
   return useToolOperation<RotateParameters>({
     ...rotateOperationConfig,
-    getErrorMessage: createStandardErrorHandler(t('rotate.error.failed', 'An error occurred while rotating the PDF.'))
+    getErrorMessage: createStandardErrorHandler(
+      t("rotate.error.failed", "An error occurred while rotating the PDF."),
+    ),
   });
 };
diff --git a/frontend/src/core/hooks/tools/rotate/useRotateParameters.test.ts b/frontend/src/core/hooks/tools/rotate/useRotateParameters.test.ts
index 1c9233e9a5..1b9737ab10 100644
--- a/frontend/src/core/hooks/tools/rotate/useRotateParameters.test.ts
+++ b/frontend/src/core/hooks/tools/rotate/useRotateParameters.test.ts
@@ -1,9 +1,13 @@
-import { describe, expect, test } from 'vitest';
-import { renderHook, act } from '@testing-library/react';
-import { useRotateParameters, defaultParameters, normalizeAngle } from '@app/hooks/tools/rotate/useRotateParameters';
+import { describe, expect, test } from "vitest";
+import { renderHook, act } from "@testing-library/react";
+import {
+  useRotateParameters,
+  defaultParameters,
+  normalizeAngle,
+} from "@app/hooks/tools/rotate/useRotateParameters";
 
-describe('useRotateParameters', () => {
-  test('should initialize with default parameters', () => {
+describe("useRotateParameters", () => {
+  test("should initialize with default parameters", () => {
     const { result } = renderHook(() => useRotateParameters());
 
     expect(result.current.parameters).toEqual(defaultParameters);
@@ -11,7 +15,7 @@ describe('useRotateParameters', () => {
     expect(result.current.hasRotation).toBe(false);
   });
 
-  test('should validate parameters correctly', () => {
+  test("should validate parameters correctly", () => {
     const { result } = renderHook(() => useRotateParameters());
 
     // Default should be valid
@@ -19,18 +23,18 @@ describe('useRotateParameters', () => {
 
     // Set invalid angle
     act(() => {
-      result.current.updateParameter('angle', 45);
+      result.current.updateParameter("angle", 45);
     });
     expect(result.current.validateParameters()).toBe(false);
 
     // Set valid angle
     act(() => {
-      result.current.updateParameter('angle', 90);
+      result.current.updateParameter("angle", 90);
     });
     expect(result.current.validateParameters()).toBe(true);
   });
 
-  test('should rotate clockwise correctly', () => {
+  test("should rotate clockwise correctly", () => {
     const { result } = renderHook(() => useRotateParameters());
 
     act(() => {
@@ -57,7 +61,7 @@ describe('useRotateParameters', () => {
     expect(result.current.hasRotation).toBe(false);
   });
 
-  test('should rotate anticlockwise correctly', () => {
+  test("should rotate anticlockwise correctly", () => {
     const { result } = renderHook(() => useRotateParameters());
 
     act(() => {
@@ -84,7 +88,7 @@ describe('useRotateParameters', () => {
     expect(result.current.hasRotation).toBe(false);
   });
 
-  test('should normalize angles correctly', () => {
+  test("should normalize angles correctly", () => {
     const { result } = renderHook(() => useRotateParameters());
 
     expect(result.current.normalizeAngle(360)).toBe(0);
@@ -93,7 +97,7 @@ describe('useRotateParameters', () => {
     expect(result.current.normalizeAngle(-180)).toBe(180);
   });
 
-  test('should reset parameters correctly', () => {
+  test("should reset parameters correctly", () => {
     const { result } = renderHook(() => useRotateParameters());
 
     // Set some rotation
@@ -115,29 +119,29 @@ describe('useRotateParameters', () => {
     expect(result.current.hasRotation).toBe(false);
   });
 
-  test('should update parameters', () => {
+  test("should update parameters", () => {
     const { result } = renderHook(() => useRotateParameters());
 
     act(() => {
-      result.current.updateParameter('angle', 450);
+      result.current.updateParameter("angle", 450);
     });
     expect(result.current.parameters.angle).toBe(450);
     expect(normalizeAngle(result.current.parameters.angle)).toBe(90);
 
     act(() => {
-      result.current.updateParameter('angle', -90);
+      result.current.updateParameter("angle", -90);
     });
     expect(result.current.parameters.angle).toBe(-90);
     expect(normalizeAngle(result.current.parameters.angle)).toBe(270);
   });
 
-  test('should return correct endpoint name', () => {
+  test("should return correct endpoint name", () => {
     const { result } = renderHook(() => useRotateParameters());
 
-    expect(result.current.getEndpointName()).toBe('rotate-pdf');
+    expect(result.current.getEndpointName()).toBe("rotate-pdf");
   });
 
-  test('should detect rotation state correctly', () => {
+  test("should detect rotation state correctly", () => {
     const { result } = renderHook(() => useRotateParameters());
 
     // Initially no rotation
diff --git a/frontend/src/core/hooks/tools/rotate/useRotateParameters.ts b/frontend/src/core/hooks/tools/rotate/useRotateParameters.ts
index f69f98caf7..870fb10ecc 100644
--- a/frontend/src/core/hooks/tools/rotate/useRotateParameters.ts
+++ b/frontend/src/core/hooks/tools/rotate/useRotateParameters.ts
@@ -1,6 +1,9 @@
-import { BaseParameters } from '@app/types/parameters';
-import { useBaseParameters, BaseParametersHook } from '@app/hooks/tools/shared/useBaseParameters';
-import { useMemo, useCallback } from 'react';
+import { BaseParameters } from "@app/types/parameters";
+import {
+  useBaseParameters,
+  BaseParametersHook,
+} from "@app/hooks/tools/shared/useBaseParameters";
+import { useMemo, useCallback } from "react";
 
 // Normalize angle to number between 0 and 359
 export const normalizeAngle = (angle: number): number => {
@@ -25,7 +28,7 @@ export type RotateParametersHook = BaseParametersHook<RotateParameters> & {
 export const useRotateParameters = (): RotateParametersHook => {
   const baseHook = useBaseParameters({
     defaultParameters,
-    endpointName: 'rotate-pdf',
+    endpointName: "rotate-pdf",
     validateFn: (params) => {
       // Angle must be a multiple of 90
       return params.angle % 90 === 0;
@@ -34,12 +37,12 @@ export const useRotateParameters = (): RotateParametersHook => {
 
   // Rotate clockwise by 90 degrees
   const rotateClockwise = useCallback(() => {
-    baseHook.updateParameter('angle', baseHook.parameters.angle + 90);
+    baseHook.updateParameter("angle", baseHook.parameters.angle + 90);
   }, [baseHook]);
 
   // Rotate anticlockwise by 90 degrees
   const rotateAnticlockwise = useCallback(() => {
-    baseHook.updateParameter('angle', baseHook.parameters.angle - 90);
+    baseHook.updateParameter("angle", baseHook.parameters.angle - 90);
   }, [baseHook]);
 
   // Check if rotation will actually change the document
@@ -49,12 +52,15 @@ export const useRotateParameters = (): RotateParametersHook => {
   }, [baseHook.parameters.angle, normalizeAngle]);
 
   // Override updateParameter - no longer normalize angles here
-  const updateParameter = useCallback(<K extends keyof RotateParameters>(
-    parameter: K,
-    value: RotateParameters[K]
-  ) => {
-    baseHook.updateParameter(parameter, value);
-  }, [baseHook]);
+  const updateParameter = useCallback(
+    <K extends keyof RotateParameters>(
+      parameter: K,
+      value: RotateParameters[K],
+    ) => {
+      baseHook.updateParameter(parameter, value);
+    },
+    [baseHook],
+  );
 
   return {
     ...baseHook,
diff --git a/frontend/src/core/hooks/tools/sanitize/useSanitizeOperation.ts b/frontend/src/core/hooks/tools/sanitize/useSanitizeOperation.ts
index b4de356016..9c98b7d57f 100644
--- a/frontend/src/core/hooks/tools/sanitize/useSanitizeOperation.ts
+++ b/frontend/src/core/hooks/tools/sanitize/useSanitizeOperation.ts
@@ -1,20 +1,41 @@
-import { useTranslation } from 'react-i18next';
-import { ToolType, useToolOperation } from '@app/hooks/tools/shared/useToolOperation';
-import { createStandardErrorHandler } from '@app/utils/toolErrorHandler';
-import { SanitizeParameters, defaultParameters } from '@app/hooks/tools/sanitize/useSanitizeParameters';
+import { useTranslation } from "react-i18next";
+import {
+  ToolType,
+  useToolOperation,
+} from "@app/hooks/tools/shared/useToolOperation";
+import { createStandardErrorHandler } from "@app/utils/toolErrorHandler";
+import {
+  SanitizeParameters,
+  defaultParameters,
+} from "@app/hooks/tools/sanitize/useSanitizeParameters";
 
 // Static function that can be used by both the hook and automation executor
-export const buildSanitizeFormData = (parameters: SanitizeParameters, file: File): FormData => {
+export const buildSanitizeFormData = (
+  parameters: SanitizeParameters,
+  file: File,
+): FormData => {
   const formData = new FormData();
-  formData.append('fileInput', file);
+  formData.append("fileInput", file);
 
   // Add parameters
-  formData.append('removeJavaScript', (parameters.removeJavaScript ?? false).toString());
-  formData.append('removeEmbeddedFiles', (parameters.removeEmbeddedFiles ?? false).toString());
-  formData.append('removeXMPMetadata', (parameters.removeXMPMetadata ?? false).toString());
-  formData.append('removeMetadata', (parameters.removeMetadata ?? false).toString());
-  formData.append('removeLinks', (parameters.removeLinks ?? false).toString());
-  formData.append('removeFonts', (parameters.removeFonts ?? false).toString());
+  formData.append(
+    "removeJavaScript",
+    (parameters.removeJavaScript ?? false).toString(),
+  );
+  formData.append(
+    "removeEmbeddedFiles",
+    (parameters.removeEmbeddedFiles ?? false).toString(),
+  );
+  formData.append(
+    "removeXMPMetadata",
+    (parameters.removeXMPMetadata ?? false).toString(),
+  );
+  formData.append(
+    "removeMetadata",
+    (parameters.removeMetadata ?? false).toString(),
+  );
+  formData.append("removeLinks", (parameters.removeLinks ?? false).toString());
+  formData.append("removeFonts", (parameters.removeFonts ?? false).toString());
 
   return formData;
 };
@@ -23,8 +44,8 @@ export const buildSanitizeFormData = (parameters: SanitizeParameters, file: File
 export const sanitizeOperationConfig = {
   toolType: ToolType.singleFile,
   buildFormData: buildSanitizeFormData,
-  operationType: 'sanitize',
-  endpoint: '/api/v1/security/sanitize-pdf',
+  operationType: "sanitize",
+  endpoint: "/api/v1/security/sanitize-pdf",
   multiFileEndpoint: false,
   defaultParameters,
 } as const;
@@ -34,6 +55,8 @@ export const useSanitizeOperation = () => {
 
   return useToolOperation<SanitizeParameters>({
     ...sanitizeOperationConfig,
-    getErrorMessage: createStandardErrorHandler(t('sanitize.error.failed', 'An error occurred while sanitising the PDF.'))
+    getErrorMessage: createStandardErrorHandler(
+      t("sanitize.error.failed", "An error occurred while sanitising the PDF."),
+    ),
   });
 };
diff --git a/frontend/src/core/hooks/tools/sanitize/useSanitizeParameters.test.ts b/frontend/src/core/hooks/tools/sanitize/useSanitizeParameters.test.ts
index 60559e5487..96d7e2e53e 100644
--- a/frontend/src/core/hooks/tools/sanitize/useSanitizeParameters.test.ts
+++ b/frontend/src/core/hooks/tools/sanitize/useSanitizeParameters.test.ts
@@ -1,19 +1,22 @@
-import { describe, expect, test } from 'vitest';
-import { renderHook, act } from '@testing-library/react';
-import { defaultParameters, useSanitizeParameters } from '@app/hooks/tools/sanitize/useSanitizeParameters';
+import { describe, expect, test } from "vitest";
+import { renderHook, act } from "@testing-library/react";
+import {
+  defaultParameters,
+  useSanitizeParameters,
+} from "@app/hooks/tools/sanitize/useSanitizeParameters";
 
-describe('useSanitizeParameters', () => {
-  test('should initialize with default parameters', () => {
+describe("useSanitizeParameters", () => {
+  test("should initialize with default parameters", () => {
     const { result } = renderHook(() => useSanitizeParameters());
 
     expect(result.current.parameters).toStrictEqual(defaultParameters);
   });
 
-  test('should update individual parameters', () => {
+  test("should update individual parameters", () => {
     const { result } = renderHook(() => useSanitizeParameters());
 
     act(() => {
-      result.current.updateParameter('removeXMPMetadata', true);
+      result.current.updateParameter("removeXMPMetadata", true);
     });
 
     expect(result.current.parameters).toStrictEqual({
@@ -22,13 +25,13 @@ describe('useSanitizeParameters', () => {
     });
   });
 
-  test('should reset parameters to defaults', () => {
+  test("should reset parameters to defaults", () => {
     const { result } = renderHook(() => useSanitizeParameters());
 
     // First, change some parameters
     act(() => {
-      result.current.updateParameter('removeXMPMetadata', true);
-      result.current.updateParameter('removeJavaScript', false);
+      result.current.updateParameter("removeXMPMetadata", true);
+      result.current.updateParameter("removeJavaScript", false);
     });
 
     expect(result.current.parameters.removeXMPMetadata).toBe(true);
@@ -42,13 +45,13 @@ describe('useSanitizeParameters', () => {
     expect(result.current.parameters).toStrictEqual(defaultParameters);
   });
 
-  test('should return correct endpoint name', () => {
+  test("should return correct endpoint name", () => {
     const { result } = renderHook(() => useSanitizeParameters());
 
-    expect(result.current.getEndpointName()).toBe('sanitize-pdf');
+    expect(result.current.getEndpointName()).toBe("sanitize-pdf");
   });
 
-  test('should validate parameters correctly', () => {
+  test("should validate parameters correctly", () => {
     const { result } = renderHook(() => useSanitizeParameters());
 
     // Default state should be valid (has removeJavaScript and removeEmbeddedFiles enabled)
@@ -56,26 +59,28 @@ describe('useSanitizeParameters', () => {
 
     // Turn off all parameters - should be invalid
     act(() => {
-      result.current.updateParameter('removeJavaScript', false);
-      result.current.updateParameter('removeEmbeddedFiles', false);
+      result.current.updateParameter("removeJavaScript", false);
+      result.current.updateParameter("removeEmbeddedFiles", false);
     });
 
     expect(result.current.validateParameters()).toBe(false);
 
     // Turn on one parameter - should be valid again
     act(() => {
-      result.current.updateParameter('removeLinks', true);
+      result.current.updateParameter("removeLinks", true);
     });
 
     expect(result.current.validateParameters()).toBe(true);
   });
 
-  test('should handle all parameter types correctly', () => {
+  test("should handle all parameter types correctly", () => {
     const { result } = renderHook(() => useSanitizeParameters());
 
-    const allParameters = Object.keys(defaultParameters) as (keyof typeof defaultParameters)[];
+    const allParameters = Object.keys(
+      defaultParameters,
+    ) as (keyof typeof defaultParameters)[];
 
-    allParameters.forEach(param => {
+    allParameters.forEach((param) => {
       act(() => {
         result.current.updateParameter(param, true);
       });
diff --git a/frontend/src/core/hooks/tools/sanitize/useSanitizeParameters.ts b/frontend/src/core/hooks/tools/sanitize/useSanitizeParameters.ts
index 18978f9459..f2e7ec2193 100644
--- a/frontend/src/core/hooks/tools/sanitize/useSanitizeParameters.ts
+++ b/frontend/src/core/hooks/tools/sanitize/useSanitizeParameters.ts
@@ -1,5 +1,8 @@
-import { BaseParameters } from '@app/types/parameters';
-import { useBaseParameters, BaseParametersHook } from '@app/hooks/tools/shared/useBaseParameters';
+import { BaseParameters } from "@app/types/parameters";
+import {
+  useBaseParameters,
+  BaseParametersHook,
+} from "@app/hooks/tools/shared/useBaseParameters";
 
 export interface SanitizeParameters extends BaseParameters {
   removeJavaScript: boolean;
@@ -24,9 +27,9 @@ export type SanitizeParametersHook = BaseParametersHook<SanitizeParameters>;
 export const useSanitizeParameters = (): SanitizeParametersHook => {
   return useBaseParameters({
     defaultParameters,
-    endpointName: 'sanitize-pdf',
+    endpointName: "sanitize-pdf",
     validateFn: (params) => {
-      return Object.values(params).some(value => value === true);
+      return Object.values(params).some((value) => value === true);
     },
   });
 };
diff --git a/frontend/src/core/hooks/tools/scannerImageSplit/useScannerImageSplitOperation.ts b/frontend/src/core/hooks/tools/scannerImageSplit/useScannerImageSplitOperation.ts
index 144a316785..e035c90ce5 100644
--- a/frontend/src/core/hooks/tools/scannerImageSplit/useScannerImageSplitOperation.ts
+++ b/frontend/src/core/hooks/tools/scannerImageSplit/useScannerImageSplitOperation.ts
@@ -1,18 +1,28 @@
-import { useCallback } from 'react';
-import { useTranslation } from 'react-i18next';
-import { ToolType, useToolOperation, ToolOperationConfig } from '@app/hooks/tools/shared/useToolOperation';
-import { createStandardErrorHandler } from '@app/utils/toolErrorHandler';
-import { ScannerImageSplitParameters, defaultParameters } from '@app/hooks/tools/scannerImageSplit/useScannerImageSplitParameters';
-import { useToolResources } from '@app/hooks/tools/shared/useToolResources';
+import { useCallback } from "react";
+import { useTranslation } from "react-i18next";
+import {
+  ToolType,
+  useToolOperation,
+  ToolOperationConfig,
+} from "@app/hooks/tools/shared/useToolOperation";
+import { createStandardErrorHandler } from "@app/utils/toolErrorHandler";
+import {
+  ScannerImageSplitParameters,
+  defaultParameters,
+} from "@app/hooks/tools/scannerImageSplit/useScannerImageSplitParameters";
+import { useToolResources } from "@app/hooks/tools/shared/useToolResources";
 
-export const buildScannerImageSplitFormData = (parameters: ScannerImageSplitParameters, file: File): FormData => {
+export const buildScannerImageSplitFormData = (
+  parameters: ScannerImageSplitParameters,
+  file: File,
+): FormData => {
   const formData = new FormData();
-  formData.append('fileInput', file);
-  formData.append('angle_threshold', parameters.angle_threshold.toString());
-  formData.append('tolerance', parameters.tolerance.toString());
-  formData.append('min_area', parameters.min_area.toString());
-  formData.append('min_contour_area', parameters.min_contour_area.toString());
-  formData.append('border_size', parameters.border_size.toString());
+  formData.append("fileInput", file);
+  formData.append("angle_threshold", parameters.angle_threshold.toString());
+  formData.append("tolerance", parameters.tolerance.toString());
+  formData.append("min_area", parameters.min_area.toString());
+  formData.append("min_contour_area", parameters.min_contour_area.toString());
+  formData.append("border_size", parameters.border_size.toString());
   return formData;
 };
 
@@ -20,8 +30,8 @@ export const buildScannerImageSplitFormData = (parameters: ScannerImageSplitPara
 export const scannerImageSplitOperationConfig = {
   toolType: ToolType.singleFile,
   buildFormData: buildScannerImageSplitFormData,
-  operationType: 'scannerImageSplit',
-  endpoint: '/api/v1/misc/extract-image-scans',
+  operationType: "scannerImageSplit",
+  endpoint: "/api/v1/misc/extract-image-scans",
   defaultParameters,
 } as const;
 
@@ -31,31 +41,44 @@ export const useScannerImageSplitOperation = () => {
 
   // Custom response handler that extracts ZIP files containing images
   // Can't add to exported config because it requires access to the hook so must be part of the hook
-  const responseHandler = useCallback(async (blob: Blob, originalFiles: File[]): Promise<File[]> => {
-    try {
-      // Scanner image split returns ZIP files with multiple images
-      const extractedFiles = await extractZipFiles(blob);
+  const responseHandler = useCallback(
+    async (blob: Blob, originalFiles: File[]): Promise<File[]> => {
+      try {
+        // Scanner image split returns ZIP files with multiple images
+        const extractedFiles = await extractZipFiles(blob);
 
-      // If extraction succeeded and returned files, use them
-      if (extractedFiles.length > 0) {
-        return extractedFiles;
+        // If extraction succeeded and returned files, use them
+        if (extractedFiles.length > 0) {
+          return extractedFiles;
+        }
+      } catch (error) {
+        console.warn(
+          "Failed to extract as ZIP, treating as single file:",
+          error,
+        );
       }
-    } catch (error) {
-      console.warn('Failed to extract as ZIP, treating as single file:', error);
-    }
 
-    // Fallback: treat as single file (PNG image)
-    const inputFileName = originalFiles[0]?.name || 'document';
-    const baseFileName = inputFileName.replace(/\.[^.]+$/, '');
-    const singleFile = new File([blob], `${baseFileName}.png`, { type: 'image/png' });
-    return [singleFile];
-  }, [extractZipFiles]);
+      // Fallback: treat as single file (PNG image)
+      const inputFileName = originalFiles[0]?.name || "document";
+      const baseFileName = inputFileName.replace(/\.[^.]+$/, "");
+      const singleFile = new File([blob], `${baseFileName}.png`, {
+        type: "image/png",
+      });
+      return [singleFile];
+    },
+    [extractZipFiles],
+  );
 
   const config: ToolOperationConfig<ScannerImageSplitParameters> = {
     ...scannerImageSplitOperationConfig,
     responseHandler,
-    getErrorMessage: createStandardErrorHandler(t('scannerImageSplit.error.failed', 'An error occurred while extracting image scans.'))
+    getErrorMessage: createStandardErrorHandler(
+      t(
+        "scannerImageSplit.error.failed",
+        "An error occurred while extracting image scans.",
+      ),
+    ),
   };
 
   return useToolOperation(config);
-};
\ No newline at end of file
+};
diff --git a/frontend/src/core/hooks/tools/scannerImageSplit/useScannerImageSplitParameters.ts b/frontend/src/core/hooks/tools/scannerImageSplit/useScannerImageSplitParameters.ts
index ef4b89b94c..5a40c3034e 100644
--- a/frontend/src/core/hooks/tools/scannerImageSplit/useScannerImageSplitParameters.ts
+++ b/frontend/src/core/hooks/tools/scannerImageSplit/useScannerImageSplitParameters.ts
@@ -1,5 +1,8 @@
-import { BaseParameters } from '@app/types/parameters';
-import { useBaseParameters, BaseParametersHook } from '@app/hooks/tools/shared/useBaseParameters';
+import { BaseParameters } from "@app/types/parameters";
+import {
+  useBaseParameters,
+  BaseParametersHook,
+} from "@app/hooks/tools/shared/useBaseParameters";
 
 export interface ScannerImageSplitParameters extends BaseParameters {
   angle_threshold: number;
@@ -17,15 +20,17 @@ export const defaultParameters: ScannerImageSplitParameters = {
   border_size: 1,
 };
 
-export type ScannerImageSplitParametersHook = BaseParametersHook<ScannerImageSplitParameters>;
+export type ScannerImageSplitParametersHook =
+  BaseParametersHook<ScannerImageSplitParameters>;
 
-export const useScannerImageSplitParameters = (): ScannerImageSplitParametersHook => {
-  return useBaseParameters({
-    defaultParameters,
-    endpointName: 'extract-image-scans',
-    validateFn: () => {
-      // All parameters are numeric with defaults, validation handled by form
-      return true;
-    },
-  });
-};
\ No newline at end of file
+export const useScannerImageSplitParameters =
+  (): ScannerImageSplitParametersHook => {
+    return useBaseParameters({
+      defaultParameters,
+      endpointName: "extract-image-scans",
+      validateFn: () => {
+        // All parameters are numeric with defaults, validation handled by form
+        return true;
+      },
+    });
+  };
diff --git a/frontend/src/core/hooks/tools/shared/toolOperationHelpers.ts b/frontend/src/core/hooks/tools/shared/toolOperationHelpers.ts
index 56551fcc6c..37d52eacb5 100644
--- a/frontend/src/core/hooks/tools/shared/toolOperationHelpers.ts
+++ b/frontend/src/core/hooks/tools/shared/toolOperationHelpers.ts
@@ -1,4 +1,11 @@
-import { StirlingFile, FileId, StirlingFileStub, createStirlingFile, ProcessedFileMetadata, createNewStirlingFileStub } from '@app/types/fileContext';
+import {
+  StirlingFile,
+  FileId,
+  StirlingFileStub,
+  createStirlingFile,
+  ProcessedFileMetadata,
+  createNewStirlingFileStub,
+} from "@app/types/fileContext";
 
 /**
  * Builds parallel inputFileIds and inputStirlingFileStubs arrays from the valid input files.
@@ -7,7 +14,9 @@ import { StirlingFile, FileId, StirlingFileStub, createStirlingFile, ProcessedFi
  */
 export function buildInputTracking(
   validFiles: StirlingFile[],
-  selectors: { getStirlingFileStub: (id: FileId) => StirlingFileStub | undefined }
+  selectors: {
+    getStirlingFileStub: (id: FileId) => StirlingFileStub | undefined;
+  },
 ): { inputFileIds: FileId[]; inputStirlingFileStubs: StirlingFileStub[] } {
   const inputFileIds: FileId[] = [];
   const inputStirlingFileStubs: StirlingFileStub[] = [];
@@ -34,13 +43,21 @@ export function buildOutputPairs(
   processedFiles: File[],
   thumbnails: string[],
   metadataArray: Array<ProcessedFileMetadata | undefined>,
-  stubFactory: (file: File, thumbnail: string, metadata: ProcessedFileMetadata | undefined, index: number) => StirlingFileStub
-): { outputStirlingFileStubs: StirlingFileStub[]; outputStirlingFiles: StirlingFile[] } {
+  stubFactory: (
+    file: File,
+    thumbnail: string,
+    metadata: ProcessedFileMetadata | undefined,
+    index: number,
+  ) => StirlingFileStub,
+): {
+  outputStirlingFileStubs: StirlingFileStub[];
+  outputStirlingFiles: StirlingFile[];
+} {
   const outputStirlingFileStubs = processedFiles.map((file, index) =>
-    stubFactory(file, thumbnails[index], metadataArray[index], index)
+    stubFactory(file, thumbnails[index], metadataArray[index], index),
   );
   const outputStirlingFiles = processedFiles.map((file, index) =>
-    createStirlingFile(file, outputStirlingFileStubs[index].id)
+    createStirlingFile(file, outputStirlingFileStubs[index].id),
   );
   return { outputStirlingFileStubs, outputStirlingFiles };
 }
diff --git a/frontend/src/core/hooks/tools/shared/toolOperationTypes.ts b/frontend/src/core/hooks/tools/shared/toolOperationTypes.ts
index 455c18ee50..dd9b49e43f 100644
--- a/frontend/src/core/hooks/tools/shared/toolOperationTypes.ts
+++ b/frontend/src/core/hooks/tools/shared/toolOperationTypes.ts
@@ -1,7 +1,7 @@
-import { StirlingFile } from '@app/types/fileContext';
-import type { ResponseHandler } from '@app/utils/toolResponseProcessor';
-import { ToolId } from '@app/types/toolId';
-import type { ProcessingProgress } from '@app/hooks/tools/shared/useToolState';
+import { StirlingFile } from "@app/types/fileContext";
+import type { ResponseHandler } from "@app/utils/toolResponseProcessor";
+import { ToolId } from "@app/types/toolId";
+import type { ProcessingProgress } from "@app/hooks/tools/shared/useToolState";
 
 export type { ProcessingProgress, ResponseHandler };
 
@@ -16,9 +16,10 @@ export enum ToolType {
  * null means the button is enabled.
  */
 export type ExecuteDisabledReason =
-  | 'endpointUnavailable'
-  | 'noFiles'
-  | 'invalidParams'
+  | "endpointUnavailable"
+  | "noFiles"
+  | "invalidParams"
+  | "viewerMode"
   | null;
 
 /**
@@ -77,12 +78,14 @@ interface BaseToolOperationConfig<TParams> {
   consumesAllInputs?: boolean;
 }
 
-export interface SingleFileToolOperationConfig<TParams> extends BaseToolOperationConfig<TParams> {
+export interface SingleFileToolOperationConfig<
+  TParams,
+> extends BaseToolOperationConfig<TParams> {
   /** This tool processes one file at a time. */
   toolType: ToolType.singleFile;
 
   /** Builds FormData for API request. */
-  buildFormData: ((params: TParams, file: File) => FormData);
+  buildFormData: (params: TParams, file: File) => FormData;
 
   /** API endpoint for the operation. Can be static string or function for dynamic routing. */
   endpoint: string | ((params: TParams) => string);
@@ -90,7 +93,9 @@ export interface SingleFileToolOperationConfig<TParams> extends BaseToolOperatio
   customProcessor?: undefined;
 }
 
-export interface MultiFileToolOperationConfig<TParams> extends BaseToolOperationConfig<TParams> {
+export interface MultiFileToolOperationConfig<
+  TParams,
+> extends BaseToolOperationConfig<TParams> {
   /** This tool processes multiple files at once. */
   toolType: ToolType.multiFile;
 
@@ -98,7 +103,7 @@ export interface MultiFileToolOperationConfig<TParams> extends BaseToolOperation
   filePrefix: string;
 
   /** Builds FormData for API request. */
-  buildFormData: ((params: TParams, files: File[]) => FormData);
+  buildFormData: (params: TParams, files: File[]) => FormData;
 
   /** API endpoint for the operation. Can be static string or function for dynamic routing. */
   endpoint: string | ((params: TParams) => string);
@@ -106,7 +111,9 @@ export interface MultiFileToolOperationConfig<TParams> extends BaseToolOperation
   customProcessor?: undefined;
 }
 
-export interface CustomToolOperationConfig<TParams> extends BaseToolOperationConfig<TParams> {
+export interface CustomToolOperationConfig<
+  TParams,
+> extends BaseToolOperationConfig<TParams> {
   /** This tool has custom behaviour. */
   toolType: ToolType.custom;
 
@@ -128,7 +135,10 @@ export interface CustomToolOperationConfig<TParams> extends BaseToolOperationCon
    * - files: Processed output files
    * - consumedAllInputs: true if operation combines N inputs → fewer outputs
    */
-  customProcessor: (params: TParams, files: File[]) => Promise<CustomProcessorResult>;
+  customProcessor: (
+    params: TParams,
+    files: File[],
+  ) => Promise<CustomProcessorResult>;
 }
 
 export type ToolOperationConfig<TParams = void> =
@@ -155,7 +165,10 @@ export interface ToolOperationHook<TParams = void> {
   willUseCloud?: boolean;
 
   // Actions
-  executeOperation: (params: TParams, selectedFiles: StirlingFile[]) => Promise<void>;
+  executeOperation: (
+    params: TParams,
+    selectedFiles: StirlingFile[],
+  ) => Promise<void>;
   resetResults: () => void;
   clearError: () => void;
   cancelOperation: () => void;
diff --git a/frontend/src/core/hooks/tools/shared/useAccordionSteps.ts b/frontend/src/core/hooks/tools/shared/useAccordionSteps.ts
index cfd3def258..b1a2214b9f 100644
--- a/frontend/src/core/hooks/tools/shared/useAccordionSteps.ts
+++ b/frontend/src/core/hooks/tools/shared/useAccordionSteps.ts
@@ -1,4 +1,4 @@
-import { useState, useCallback, useMemo, useEffect } from 'react';
+import { useState, useCallback, useMemo, useEffect } from "react";
 
 /**
  * State conditions that affect accordion behavior
@@ -49,7 +49,7 @@ export interface AccordionStepsAPI<T extends string | number | symbol> {
  * with configurable collapse conditions.
  */
 export function useAccordionSteps<T extends string | number | symbol>(
-  config: UseAccordionStepsConfig<T>
+  config: UseAccordionStepsConfig<T>,
 ): AccordionStepsAPI<T> {
   const { initialStep, stateConditions, noneValue } = config;
 
@@ -62,43 +62,54 @@ export function useAccordionSteps<T extends string | number | symbol>(
     }
 
     return (
-      (stateConditions.hasFiles === false) ||
-      (stateConditions.hasResults === true) ||
-      (stateConditions.disabled === true)
+      stateConditions.hasFiles === false ||
+      stateConditions.hasResults === true ||
+      stateConditions.disabled === true
     );
   }, [stateConditions]);
 
   // Get collapsed state for a specific step
-  const getCollapsedState = useCallback((step: T): boolean => {
-    if (shouldCollapseAll) {
-      return true;
-    } else {
-      return openStep !== step;
-    }
-  }, [openStep, shouldCollapseAll]);
+  const getCollapsedState = useCallback(
+    (step: T): boolean => {
+      if (shouldCollapseAll) {
+        return true;
+      } else {
+        return openStep !== step;
+      }
+    },
+    [openStep, shouldCollapseAll],
+  );
 
   // Handle step toggle with accordion behavior
-  const handleStepToggle = useCallback((step: T) => {
-    if (stateConditions?.hasResults) {
-      config.afterResults?.();
-    }
-
-    // If all steps should be collapsed, don't allow opening
-    if (shouldCollapseAll) {
-      return;
-    }
-
-    // Accordion behavior: if clicking the open step, close it; otherwise open the clicked step
-    setOpenStep(currentStep => {
-      if (currentStep === step) {
-        // Clicking the open step - close it
-        return noneValue;
-      } else {
-        // Open the clicked step
-        return step;
+  const handleStepToggle = useCallback(
+    (step: T) => {
+      if (stateConditions?.hasResults) {
+        config.afterResults?.();
       }
-    });
-  }, [shouldCollapseAll, noneValue, stateConditions?.hasResults, config.afterResults]);
+
+      // If all steps should be collapsed, don't allow opening
+      if (shouldCollapseAll) {
+        return;
+      }
+
+      // Accordion behavior: if clicking the open step, close it; otherwise open the clicked step
+      setOpenStep((currentStep) => {
+        if (currentStep === step) {
+          // Clicking the open step - close it
+          return noneValue;
+        } else {
+          // Open the clicked step
+          return step;
+        }
+      });
+    },
+    [
+      shouldCollapseAll,
+      noneValue,
+      stateConditions?.hasResults,
+      config.afterResults,
+    ],
+  );
 
   // Close all steps
   const closeAllSteps = useCallback(() => {
@@ -118,6 +129,6 @@ export function useAccordionSteps<T extends string | number | symbol>(
     getCollapsedState,
     handleStepToggle,
     setOpenStep,
-    closeAllSteps
+    closeAllSteps,
   };
 }
diff --git a/frontend/src/core/hooks/tools/shared/useBaseParameters.ts b/frontend/src/core/hooks/tools/shared/useBaseParameters.ts
index 099883c841..4f11a52c1e 100644
--- a/frontend/src/core/hooks/tools/shared/useBaseParameters.ts
+++ b/frontend/src/core/hooks/tools/shared/useBaseParameters.ts
@@ -1,4 +1,4 @@
-import { useState, useCallback, Dispatch, SetStateAction } from 'react';
+import { useState, useCallback, Dispatch, SetStateAction } from "react";
 
 export interface BaseParametersHook<T> {
   parameters: T;
@@ -15,15 +15,20 @@ export interface BaseParametersConfig<T> {
   validateFn?: (params: T) => boolean;
 }
 
-export function useBaseParameters<T>(config: BaseParametersConfig<T>): BaseParametersHook<T> {
+export function useBaseParameters<T>(
+  config: BaseParametersConfig<T>,
+): BaseParametersHook<T> {
   const [parameters, setParameters] = useState<T>(config.defaultParameters);
 
-  const updateParameter = useCallback(<K extends keyof T>(parameter: K, value: T[K]) => {
-    setParameters(prev => ({
-      ...prev,
-      [parameter]: value,
-    }));
-  }, []);
+  const updateParameter = useCallback(
+    <K extends keyof T>(parameter: K, value: T[K]) => {
+      setParameters((prev) => ({
+        ...prev,
+        [parameter]: value,
+      }));
+    },
+    [],
+  );
 
   const resetParameters = useCallback(() => {
     setParameters(config.defaultParameters);
diff --git a/frontend/src/core/hooks/tools/shared/useBaseTool.ts b/frontend/src/core/hooks/tools/shared/useBaseTool.ts
index f07689e0d1..df21dc3b3b 100644
--- a/frontend/src/core/hooks/tools/shared/useBaseTool.ts
+++ b/frontend/src/core/hooks/tools/shared/useBaseTool.ts
@@ -1,12 +1,15 @@
-import { useEffect, useCallback, useRef } from 'react';
-import { useFileSelection } from '@app/contexts/FileContext';
-import { useEndpointEnabled } from '@app/hooks/useEndpointConfig';
-import { BaseToolProps } from '@app/types/tool';
-import { ToolOperationHook } from '@app/hooks/tools/shared/useToolOperation';
-import { BaseParametersHook } from '@app/hooks/tools/shared/useBaseParameters';
-import { StirlingFile } from '@app/types/fileContext';
+import { useEffect, useCallback, useRef } from "react";
+import { useEndpointEnabled } from "@app/hooks/useEndpointConfig";
+import { useViewScopedFiles } from "@app/hooks/tools/shared/useViewScopedFiles";
+import { BaseToolProps } from "@app/types/tool";
+import { ToolOperationHook } from "@app/hooks/tools/shared/useToolOperation";
+import { BaseParametersHook } from "@app/hooks/tools/shared/useBaseParameters";
+import { StirlingFile } from "@app/types/fileContext";
 
-interface BaseToolReturn<TParams, TParamsHook extends BaseParametersHook<TParams>> {
+interface BaseToolReturn<
+  TParams,
+  TParamsHook extends BaseParametersHook<TParams>,
+> {
   // File management
   selectedFiles: StirlingFile[];
 
@@ -33,34 +36,58 @@ interface BaseToolReturn<TParams, TParamsHook extends BaseParametersHook<TParams
 /**
  * Base tool hook for tool components. Manages standard behaviour for tools.
  */
-export function useBaseTool<TParams, TParamsHook extends BaseParametersHook<TParams>>(
+export function useBaseTool<
+  TParams,
+  TParamsHook extends BaseParametersHook<TParams>,
+>(
   toolName: string,
   useParams: () => TParamsHook,
   useOperation: () => ToolOperationHook<TParams>,
   props: BaseToolProps,
-  options?: { minFiles?: number }
+  options?: {
+    minFiles?: number;
+    /** When true, uses the full file selection rather than the viewer-scoped single file. */
+    ignoreViewerScope?: boolean;
+    /**
+     * When true, skips the "reset params on 0→N files" effect. Tools that
+     * manage their own parameter lifecycle (e.g. Compare, which auto-fills slots
+     * from the loaded files) opt out so useBaseTool's reset doesn't race and
+     * clobber the tool's own setParameters.
+     */
+    skipResetParamsOnFirstFiles?: boolean;
+  },
 ): BaseToolReturn<TParams, TParamsHook> {
   const minFiles = options?.minFiles ?? 1;
+  const ignoreViewerScope = options?.ignoreViewerScope ?? false;
+  const skipResetParamsOnFirstFiles =
+    options?.skipResetParamsOnFirstFiles ?? false;
   const { onPreviewFile, onComplete, onError } = props;
 
-  // File selection
-  const { selectedFiles } = useFileSelection();
-  const previousFileCount = useRef(selectedFiles.length);
+  const viewerScopedFiles = useViewScopedFiles(ignoreViewerScope);
+
+  // In viewer mode: scope to the single displayed file (unless ignoreViewerScope).
+  // In fileEditor with a selection: scope to the selected files.
+  // All other cases (pageEditor, custom, no selection): use all loaded files.
+  const effectiveFiles = viewerScopedFiles;
+
+  const previousFileCount = useRef(effectiveFiles.length);
 
   // Prevent reset immediately after operation completes (when consumeFiles auto-selects outputs)
   const skipNextSelectionResetRef = useRef(false);
-  const previousSelectionRef = useRef<string>('');
+  const previousSelectionRef = useRef<string>("");
 
   // Tool-specific hooks
   const params = useParams();
   const operation = useOperation();
 
   // Endpoint validation using parameters hook
-  const { enabled: endpointEnabled, loading: endpointLoading } = useEndpointEnabled(params.getEndpointName());
+  const { enabled: endpointEnabled, loading: endpointLoading } =
+    useEndpointEnabled(params.getEndpointName());
 
   // Standard computed state - defined early so it's available in useEffects
-  const hasFiles = selectedFiles.length >= minFiles;
-  const hasResults = operation.files.length > 0 || operation.downloadUrl !== null;
+  const hasFiles = effectiveFiles.length >= minFiles;
+  const hasResults =
+    operation.files.length > 0 || operation.downloadUrl !== null;
   const settingsCollapsed = !hasFiles || hasResults;
 
   // Reset results when parameters change
@@ -77,13 +104,16 @@ export function useBaseTool<TParams, TParamsHook extends BaseParametersHook<TPar
     }
   }, [hasResults]);
 
-  // Reset results when user manually changes file selection
+  // Reset results when effective files change (viewer file switch or selection change)
   useEffect(() => {
-    if (selectedFiles.length === 0) return;
+    if (effectiveFiles.length === 0) return;
 
-    const currentSelection = selectedFiles.map(f => f.fileId).sort().join(',');
+    const currentSelection = effectiveFiles
+      .map((f) => f.fileId)
+      .sort()
+      .join(",");
 
-    if (currentSelection === previousSelectionRef.current) return; // No change
+    if (currentSelection === previousSelectionRef.current) return;
 
     // Skip reset if this is the auto-selection after operation completed
     if (skipNextSelectionResetRef.current) {
@@ -92,43 +122,59 @@ export function useBaseTool<TParams, TParamsHook extends BaseParametersHook<TPar
       return;
     }
 
-    // User manually selected different files - reset results
     previousSelectionRef.current = currentSelection;
     operation.resetResults();
     onPreviewFile?.(null);
-  }, [selectedFiles]);
+  }, [effectiveFiles]);
 
   // Reset parameters when transitioning from 0 files to at least 1 file
   useEffect(() => {
-    const currentFileCount = selectedFiles.length;
+    const currentFileCount = effectiveFiles.length;
     const prevFileCount = previousFileCount.current;
 
-    if (prevFileCount === 0 && currentFileCount > 0) {
+    if (
+      prevFileCount === 0 &&
+      currentFileCount > 0 &&
+      !skipResetParamsOnFirstFiles
+    ) {
       params.resetParameters();
     }
 
     previousFileCount.current = currentFileCount;
-  }, [selectedFiles.length]);
+  }, [effectiveFiles.length, skipResetParamsOnFirstFiles]);
 
   // Standard handlers
   const handleExecute = useCallback(async () => {
     try {
-      await operation.executeOperation(params.parameters, selectedFiles);
+      await operation.executeOperation(params.parameters, effectiveFiles);
       if (operation.files && onComplete) {
         onComplete(operation.files);
       }
     } catch (error) {
       if (onError) {
-        const message = error instanceof Error ? error.message : `${toolName} operation failed`;
+        const message =
+          error instanceof Error
+            ? error.message
+            : `${toolName} operation failed`;
         onError(message);
       }
     }
-  }, [operation, params.parameters, selectedFiles, onComplete, onError, toolName]);
+  }, [
+    operation,
+    params.parameters,
+    effectiveFiles,
+    onComplete,
+    onError,
+    toolName,
+  ]);
 
-  const handleThumbnailClick = useCallback((file: File) => {
-    onPreviewFile?.(file);
-    sessionStorage.setItem('previousMode', toolName);
-  }, [onPreviewFile, toolName]);
+  const handleThumbnailClick = useCallback(
+    (file: File) => {
+      onPreviewFile?.(file);
+      sessionStorage.setItem("previousMode", toolName);
+    },
+    [onPreviewFile, toolName],
+  );
 
   const handleSettingsReset = useCallback(() => {
     skipNextSelectionResetRef.current = false;
@@ -143,7 +189,7 @@ export function useBaseTool<TParams, TParamsHook extends BaseParametersHook<TPar
 
   return {
     // File management
-    selectedFiles,
+    selectedFiles: effectiveFiles,
 
     // Tool-specific hooks
     params,
@@ -161,6 +207,6 @@ export function useBaseTool<TParams, TParamsHook extends BaseParametersHook<TPar
     // State
     hasFiles,
     hasResults,
-    settingsCollapsed
+    settingsCollapsed,
   };
 }
diff --git a/frontend/src/core/hooks/tools/shared/useOperationResults.ts b/frontend/src/core/hooks/tools/shared/useOperationResults.ts
index fca4f922a3..0e085fb920 100644
--- a/frontend/src/core/hooks/tools/shared/useOperationResults.ts
+++ b/frontend/src/core/hooks/tools/shared/useOperationResults.ts
@@ -1,4 +1,4 @@
-import { useState, useCallback } from 'react';
+import { useState, useCallback } from "react";
 
 export interface OperationResult {
   files: File[];
@@ -12,13 +12,13 @@ export interface OperationResultsHook {
   status: string;
   errorMessage: string | null;
   isLoading: boolean;
-  
+
   setResults: (results: OperationResult) => void;
   setDownloadUrl: (url: string | null) => void;
   setStatus: (status: string) => void;
   setErrorMessage: (error: string | null) => void;
   setIsLoading: (loading: boolean) => void;
-  
+
   resetResults: () => void;
   clearError: () => void;
 }
@@ -32,14 +32,14 @@ const initialResults: OperationResult = {
 export const useOperationResults = (): OperationResultsHook => {
   const [results, setResults] = useState<OperationResult>(initialResults);
   const [downloadUrl, setDownloadUrl] = useState<string | null>(null);
-  const [status, setStatus] = useState('');
+  const [status, setStatus] = useState("");
   const [errorMessage, setErrorMessage] = useState<string | null>(null);
   const [isLoading, setIsLoading] = useState(false);
 
   const resetResults = useCallback(() => {
     setResults(initialResults);
     setDownloadUrl(null);
-    setStatus('');
+    setStatus("");
     setErrorMessage(null);
     setIsLoading(false);
   }, []);
@@ -54,14 +54,14 @@ export const useOperationResults = (): OperationResultsHook => {
     status,
     errorMessage,
     isLoading,
-    
+
     setResults,
     setDownloadUrl,
     setStatus,
     setErrorMessage,
     setIsLoading,
-    
+
     resetResults,
     clearError,
   };
-};
\ No newline at end of file
+};
diff --git a/frontend/src/core/hooks/tools/shared/useToolApiCalls.ts b/frontend/src/core/hooks/tools/shared/useToolApiCalls.ts
index ee79122e28..28da62484a 100644
--- a/frontend/src/core/hooks/tools/shared/useToolApiCalls.ts
+++ b/frontend/src/core/hooks/tools/shared/useToolApiCalls.ts
@@ -1,10 +1,13 @@
-import { useCallback, useRef } from 'react';
-import axios, {type CancelTokenSource} from 'axios'; // Real axios for static methods (CancelToken, isCancel)
-import apiClient from '@app/services/apiClient'; // Our configured instance
-import { processResponse, ResponseHandler } from '@app/utils/toolResponseProcessor';
-import { isEmptyOutput } from '@app/services/errorUtils';
-import type { ProcessingProgress } from '@app/hooks/tools/shared/useToolState';
-import type { StirlingFile, FileId } from '@app/types/fileContext';
+import { useCallback, useRef } from "react";
+import axios, { type CancelTokenSource } from "axios"; // Real axios for static methods (CancelToken, isCancel)
+import apiClient from "@app/services/apiClient"; // Our configured instance
+import {
+  processResponse,
+  ResponseHandler,
+} from "@app/utils/toolResponseProcessor";
+import { isEmptyOutput } from "@app/services/errorUtils";
+import type { ProcessingProgress } from "@app/hooks/tools/shared/useToolState";
+import type { StirlingFile, FileId } from "@app/types/fileContext";
 
 export interface ApiCallsConfig<TParams = void> {
   endpoint: string | ((params: TParams) => string);
@@ -17,96 +20,125 @@ export interface ApiCallsConfig<TParams = void> {
 export const useToolApiCalls = <TParams = void>() => {
   const cancelTokenRef = useRef<CancelTokenSource | null>(null);
 
-  const processFiles = useCallback(async (
-    params: TParams,
-    validFiles: StirlingFile[],
-    config: ApiCallsConfig<TParams>,
-    onProgress: (progress: ProcessingProgress) => void,
-    onStatus: (status: string) => void,
-    markFileError?: (fileId: FileId) => void,
-  ): Promise<{ outputFiles: File[]; successSourceIds: FileId[] }> => {
-    const processedFiles: File[] = [];
-    const successSourceIds: FileId[] = [];
-    const failedFiles: string[] = [];
-    const total = validFiles.length;
+  const processFiles = useCallback(
+    async (
+      params: TParams,
+      validFiles: StirlingFile[],
+      config: ApiCallsConfig<TParams>,
+      onProgress: (progress: ProcessingProgress) => void,
+      onStatus: (status: string) => void,
+      markFileError?: (fileId: FileId) => void,
+    ): Promise<{ outputFiles: File[]; successSourceIds: FileId[] }> => {
+      const processedFiles: File[] = [];
+      const successSourceIds: FileId[] = [];
+      const failedFiles: string[] = [];
+      const total = validFiles.length;
 
-    // Create cancel token for this operation
-    cancelTokenRef.current = axios.CancelToken.source();
+      // Create cancel token for this operation
+      cancelTokenRef.current = axios.CancelToken.source();
 
-    for (let i = 0; i < validFiles.length; i++) {
-      const file = validFiles[i];
+      for (let i = 0; i < validFiles.length; i++) {
+        const file = validFiles[i];
 
-      console.debug('[processFiles] Start', { index: i, total, name: file.name, fileId: file.fileId });
-      onProgress({ current: i + 1, total, currentFileName: file.name });
-      onStatus(`Processing ${file.name} (${i + 1}/${total})`);
-
-      try {
-        const formData = config.buildFormData(params, file);
-        const endpoint = typeof config.endpoint === 'function' ? config.endpoint(params) : config.endpoint;
-        console.debug('[processFiles] POST', { endpoint, name: file.name });
-        const response = await apiClient.post(endpoint, formData, {
-          responseType: 'blob',
-          cancelToken: cancelTokenRef.current?.token,
+        console.debug("[processFiles] Start", {
+          index: i,
+          total,
+          name: file.name,
+          fileId: file.fileId,
         });
-        console.debug('[processFiles] Response OK', { name: file.name, status: response.status });
+        onProgress({ current: i + 1, total, currentFileName: file.name });
+        onStatus(`Processing ${file.name} (${i + 1}/${total})`);
 
-        // Forward to shared response processor (uses tool-specific responseHandler if provided)
-        const responseFiles = await processResponse(
-          response.data,
-          [file],
-          config.filePrefix,
-          config.responseHandler,
-          config.preserveBackendFilename ? response.headers : undefined
-        );
-        // Guard: some endpoints may return an empty/0-byte file with 200
-        const empty = isEmptyOutput(responseFiles);
-        if (empty) {
-          console.warn('[processFiles] Empty output treated as failure', { name: file.name });
+        try {
+          const formData = config.buildFormData(params, file);
+          const endpoint =
+            typeof config.endpoint === "function"
+              ? config.endpoint(params)
+              : config.endpoint;
+          console.debug("[processFiles] POST", { endpoint, name: file.name });
+          const response = await apiClient.post(endpoint, formData, {
+            responseType: "blob",
+            cancelToken: cancelTokenRef.current?.token,
+          });
+          console.debug("[processFiles] Response OK", {
+            name: file.name,
+            status: response.status,
+          });
+
+          // Forward to shared response processor (uses tool-specific responseHandler if provided)
+          const responseFiles = await processResponse(
+            response.data,
+            [file],
+            config.filePrefix,
+            config.responseHandler,
+            config.preserveBackendFilename ? response.headers : undefined,
+          );
+          // Guard: some endpoints may return an empty/0-byte file with 200
+          const empty = isEmptyOutput(responseFiles);
+          if (empty) {
+            console.warn("[processFiles] Empty output treated as failure", {
+              name: file.name,
+            });
+            failedFiles.push(file.name);
+            try {
+              markFileError?.(file.fileId);
+            } catch (e) {
+              console.debug("markFileError", e);
+            }
+            continue;
+          }
+          processedFiles.push(...responseFiles);
+          // record source id as successful
+          successSourceIds.push(file.fileId);
+          console.debug("[processFiles] Success", {
+            name: file.name,
+            produced: responseFiles.length,
+          });
+        } catch (error) {
+          if (axios.isCancel(error)) {
+            throw new Error("Operation was cancelled", { cause: error });
+          }
+          console.error("[processFiles] Failed", { name: file.name, error });
           failedFiles.push(file.name);
+          // mark errored file so UI can highlight
           try {
             markFileError?.(file.fileId);
           } catch (e) {
-            console.debug('markFileError', e);
+            console.debug("markFileError", e);
           }
-          continue;
-        }
-        processedFiles.push(...responseFiles);
-        // record source id as successful
-        successSourceIds.push(file.fileId);
-        console.debug('[processFiles] Success', { name: file.name, produced: responseFiles.length });
-
-      } catch (error) {
-        if (axios.isCancel(error)) {
-          throw new Error('Operation was cancelled', { cause: error });
-        }
-        console.error('[processFiles] Failed', { name: file.name, error });
-        failedFiles.push(file.name);
-        // mark errored file so UI can highlight
-        try {
-          markFileError?.(file.fileId);
-        } catch (e) {
-          console.debug('markFileError', e);
         }
       }
-    }
 
-    if (failedFiles.length > 0 && processedFiles.length === 0) {
-      throw new Error(`Failed to process all files: ${failedFiles.join(', ')}`);
-    }
+      if (failedFiles.length > 0 && processedFiles.length === 0) {
+        throw new Error(
+          `Failed to process all files: ${failedFiles.join(", ")}`,
+        );
+      }
 
-    if (failedFiles.length > 0) {
-      onStatus(`Processed ${processedFiles.length}/${total} files. Failed: ${failedFiles.join(', ')}`);
-    } else {
-      onStatus(`Successfully processed ${processedFiles.length} file${processedFiles.length === 1 ? '' : 's'}`);
-    }
+      if (failedFiles.length > 0) {
+        onStatus(
+          `Processed ${processedFiles.length}/${total} files. Failed: ${failedFiles.join(", ")}`,
+        );
+      } else {
+        onStatus(
+          `Successfully processed ${processedFiles.length} file${processedFiles.length === 1 ? "" : "s"}`,
+        );
+      }
 
-    console.debug('[processFiles] Completed batch', { total, successes: successSourceIds.length, outputs: processedFiles.length, failed: failedFiles.length });
-    return { outputFiles: processedFiles, successSourceIds };
-  }, []);
+      console.debug("[processFiles] Completed batch", {
+        total,
+        successes: successSourceIds.length,
+        outputs: processedFiles.length,
+        failed: failedFiles.length,
+      });
+      return { outputFiles: processedFiles, successSourceIds };
+    },
+    [],
+  );
 
   const cancelOperation = useCallback(() => {
     if (cancelTokenRef.current) {
-      cancelTokenRef.current.cancel('Operation cancelled by user');
+      cancelTokenRef.current.cancel("Operation cancelled by user");
       cancelTokenRef.current = null;
     }
   }, []);
diff --git a/frontend/src/core/hooks/tools/shared/useToolOperation.ts b/frontend/src/core/hooks/tools/shared/useToolOperation.ts
index 7f3857c27f..8c4d41a7f1 100644
--- a/frontend/src/core/hooks/tools/shared/useToolOperation.ts
+++ b/frontend/src/core/hooks/tools/shared/useToolOperation.ts
@@ -1,23 +1,41 @@
-import { useCallback, useRef, useEffect } from 'react';
-import apiClient from '@app/services/apiClient';
-import { useTranslation } from 'react-i18next';
-import { useFileContext } from '@app/contexts/FileContext';
-import { useNavigationActions } from '@app/contexts/NavigationContext';
-import { useToolState } from '@app/hooks/tools/shared/useToolState';
-import { useToolApiCalls, type ApiCallsConfig } from '@app/hooks/tools/shared/useToolApiCalls';
-import { useToolResources } from '@app/hooks/tools/shared/useToolResources';
-import { extractErrorMessage, handle422Error } from '@app/utils/toolErrorHandler';
-import { StirlingFile, extractFiles, FileId, StirlingFileStub } from '@app/types/fileContext';
-import { FILE_EVENTS } from '@app/services/errorUtils';
-import { getFilenameWithoutExtension } from '@app/utils/fileUtils';
-import { createChildStub, generateProcessedFileMetadata } from '@app/contexts/file/fileActions';
-import { createNewStirlingFileStub } from '@app/types/fileContext';
-import { ToolOperation } from '@app/types/file';
-import { ensureBackendReady } from '@app/services/backendReadinessGuard';
-import { useWillUseCloud } from '@app/hooks/useWillUseCloud';
-import { useCreditCheck } from '@app/hooks/useCreditCheck';
-import { notifyPdfProcessingComplete } from '@app/services/desktopNotificationService';
-import { buildInputTracking, buildOutputPairs } from '@app/hooks/tools/shared/toolOperationHelpers';
+import { useCallback, useRef, useEffect, useContext } from "react";
+import apiClient from "@app/services/apiClient";
+import { useTranslation } from "react-i18next";
+import { useFileContext } from "@app/contexts/FileContext";
+import { useNavigationActions } from "@app/contexts/NavigationContext";
+import { ViewerContext } from "@app/contexts/ViewerContext";
+import { useToolState } from "@app/hooks/tools/shared/useToolState";
+import {
+  useToolApiCalls,
+  type ApiCallsConfig,
+} from "@app/hooks/tools/shared/useToolApiCalls";
+import { useToolResources } from "@app/hooks/tools/shared/useToolResources";
+import {
+  extractErrorMessage,
+  handle422Error,
+} from "@app/utils/toolErrorHandler";
+import {
+  StirlingFile,
+  extractFiles,
+  FileId,
+  StirlingFileStub,
+} from "@app/types/fileContext";
+import { FILE_EVENTS } from "@app/services/errorUtils";
+import { getFilenameWithoutExtension } from "@app/utils/fileUtils";
+import {
+  createChildStub,
+  generateProcessedFileMetadata,
+} from "@app/contexts/file/fileActions";
+import { createNewStirlingFileStub } from "@app/types/fileContext";
+import { ToolOperation } from "@app/types/file";
+import { ensureBackendReady } from "@app/services/backendReadinessGuard";
+import { useWillUseCloud } from "@app/hooks/useWillUseCloud";
+import { useCreditCheck } from "@app/hooks/useCreditCheck";
+import { notifyPdfProcessingComplete } from "@app/services/desktopNotificationService";
+import {
+  buildInputTracking,
+  buildOutputPairs,
+} from "@app/hooks/tools/shared/toolOperationHelpers";
 import {
   ToolType,
   ToolOperationConfig,
@@ -28,7 +46,7 @@ import {
   CustomToolOperationConfig,
   ProcessingProgress,
   ResponseHandler,
-} from '@app/hooks/tools/shared/toolOperationTypes';
+} from "@app/hooks/tools/shared/toolOperationTypes";
 
 export { ToolType };
 export type {
@@ -43,7 +61,7 @@ export type {
 };
 
 // Re-export for backwards compatibility
-export { createStandardErrorHandler } from '@app/utils/toolErrorHandler';
+export { createStandardErrorHandler } from "@app/utils/toolErrorHandler";
 
 /**
  * Shared hook for tool operations providing consistent error handling, progress tracking,
@@ -58,24 +76,35 @@ export { createStandardErrorHandler } from '@app/utils/toolErrorHandler';
  * @returns Hook interface with state and execution methods
  */
 export const useToolOperation = <TParams>(
-  config: ToolOperationConfig<TParams>
+  config: ToolOperationConfig<TParams>,
 ): ToolOperationHook<TParams> => {
   const { t } = useTranslation();
-  const { addFiles, consumeFiles, undoConsumeFiles, selectors } = useFileContext();
+  const { addFiles, consumeFiles, undoConsumeFiles, selectors } =
+    useFileContext();
   const { actions: navActions } = useNavigationActions();
+  const viewerContext = useContext(ViewerContext);
+  const setActiveFileId = viewerContext?.setActiveFileId ?? (() => {});
 
   // Composed hooks
   const { state, actions } = useToolState();
   const { actions: fileActions } = useFileContext();
-  const { processFiles, cancelOperation: cancelApiCalls } = useToolApiCalls<TParams>();
-  const { generateThumbnails, createDownloadInfo, cleanupBlobUrls, extractZipFiles } = useToolResources();
+  const { processFiles, cancelOperation: cancelApiCalls } =
+    useToolApiCalls<TParams>();
+  const {
+    generateThumbnails,
+    createDownloadInfo,
+    cleanupBlobUrls,
+    extractZipFiles,
+  } = useToolResources();
 
   // Determine endpoint for cloud usage check and credit routing.
   // For function endpoints, use defaultParameters to get a representative static value.
   const endpointString = config.endpoint
-    ? (typeof config.endpoint === 'function'
-        ? (config.defaultParameters ? (config.endpoint(config.defaultParameters) ?? undefined) : undefined)
-        : config.endpoint)
+    ? typeof config.endpoint === "function"
+      ? config.defaultParameters
+        ? (config.endpoint(config.defaultParameters) ?? undefined)
+        : undefined
+      : config.endpoint
     : undefined;
 
   const { checkCredits } = useCreditCheck(config.operationType, endpointString);
@@ -88,344 +117,505 @@ export const useToolOperation = <TParams>(
     outputFileIds: FileId[];
   } | null>(null);
 
-  const executeOperation = useCallback(async (
-    params: TParams,
-    selectedFiles: StirlingFile[]
-  ): Promise<void> => {
-    // Validation
-    if (selectedFiles.length === 0) {
-      actions.setError(t('noFileSelected', 'No files selected'));
-      return;
-    }
+  const executeOperation = useCallback(
+    async (params: TParams, selectedFiles: StirlingFile[]): Promise<void> => {
+      // Validation
+      if (selectedFiles.length === 0) {
+        actions.setError(t("noFileSelected", "No files selected"));
+        return;
+      }
 
-    // Handle zero-byte inputs explicitly: mark as error and continue with others
-    const zeroByteFiles = selectedFiles.filter(file => file.size === 0);
-    if (zeroByteFiles.length > 0) {
-      try {
-        for (const f of zeroByteFiles) {
-          fileActions.markFileError(f.fileId);
+      // Handle zero-byte inputs explicitly: mark as error and continue with others
+      const zeroByteFiles = selectedFiles.filter((file) => file.size === 0);
+      if (zeroByteFiles.length > 0) {
+        try {
+          for (const f of zeroByteFiles) {
+            fileActions.markFileError(f.fileId);
+          }
+        } catch (e) {
+          console.log("markFileError", e);
         }
-      } catch (e) {
-        console.log('markFileError', e);
       }
-    }
-    const validFiles: StirlingFile[] = selectedFiles.filter(file => file.size > 0);
-    if (validFiles.length === 0) {
-      actions.setError(t('noValidFiles', 'No valid files to process'));
-      return;
-    }
-
-    // Resolve the runtime endpoint from params (static string or function result).
-    // Custom processors may omit endpoint entirely — result is undefined in that case.
-    const runtimeEndpoint: string | undefined = config.endpoint
-      ? (typeof config.endpoint === 'function' ? (config.endpoint(params) ?? undefined) : config.endpoint)
-      : undefined;
-
-    // Credit check — no-op in core builds, real check in desktop/SaaS versions.
-    // Pass runtime endpoint so the check can determine if this routes locally (no credits needed).
-    const creditError = await checkCredits(runtimeEndpoint);
-    if (creditError !== null) {
-      actions.setError(creditError);
-      return;
-    }
-
-    // Backend readiness check (will skip for SaaS-routed endpoints).
-    // Custom processors without an endpoint skip this — they manage their own backend calls.
-    const endpointForReadyCheck = config.toolType !== ToolType.custom ? runtimeEndpoint : undefined;
-    const backendReady = await ensureBackendReady(endpointForReadyCheck);
-    if (!backendReady) {
-      actions.setError(t('backendHealth.offline', 'Embedded backend is offline. Please try again shortly.'));
-      return;
-    }
-
-    // Reset state
-    actions.setLoading(true);
-    actions.setError(null);
-    actions.resetResults();
-    cleanupBlobUrls();
-
-    // Prepare files with history metadata injection (for PDFs)
-    actions.setStatus('Processing files...');
-
-    // Listen for global error file id events from HTTP interceptor during this run
-    let externalErrorFileIds: string[] = [];
-    const errorListener = (e: Event) => {
-      const detail = (e as CustomEvent)?.detail as any;
-      if (detail?.fileIds) {
-        externalErrorFileIds = Array.isArray(detail.fileIds) ? detail.fileIds : [];
+      const validFiles: StirlingFile[] = selectedFiles.filter(
+        (file) => file.size > 0,
+      );
+      if (validFiles.length === 0) {
+        actions.setError(t("noValidFiles", "No valid files to process"));
+        return;
       }
-    };
-    window.addEventListener(FILE_EVENTS.markError, errorListener as EventListener);
+
+      // Block encrypted files from being sent to backend tools
+      const encryptedFiles = validFiles.filter((f) => {
+        const stub = selectors.getStirlingFileStub(f.fileId);
+        return stub?.processedFile?.isEncrypted === true;
+      });
+      if (encryptedFiles.length > 0) {
+        for (const ef of encryptedFiles) {
+          fileActions.openEncryptedUnlockPrompt(ef.fileId);
+        }
+        actions.setError(
+          encryptedFiles.length === 1
+            ? t(
+                "encryptedFileBlocked",
+                "File is password-protected. Unlock it first.",
+              )
+            : t(
+                "encryptedFilesBlocked",
+                "{{count}} files are password-protected. Unlock them first.",
+                {
+                  count: encryptedFiles.length,
+                },
+              ),
+        );
+        return;
+      }
+
+      // Resolve the runtime endpoint from params (static string or function result).
+      // Custom processors may omit endpoint entirely — result is undefined in that case.
+      const runtimeEndpoint: string | undefined = config.endpoint
+        ? typeof config.endpoint === "function"
+          ? (config.endpoint(params) ?? undefined)
+          : config.endpoint
+        : undefined;
+
+      // Credit check — no-op in core builds, real check in desktop/SaaS versions.
+      // Pass runtime endpoint so the check can determine if this routes locally (no credits needed).
+      const creditError = await checkCredits(runtimeEndpoint);
+      if (creditError !== null) {
+        actions.setError(creditError);
+        return;
+      }
+
+      // Backend readiness check (will skip for SaaS-routed endpoints).
+      // Custom processors without an endpoint skip this — they manage their own backend calls.
+      const endpointForReadyCheck =
+        config.toolType !== ToolType.custom ? runtimeEndpoint : undefined;
+      const backendReady = await ensureBackendReady(endpointForReadyCheck);
+      if (!backendReady) {
+        actions.setError(
+          t(
+            "backendHealth.offline",
+            "Embedded backend is offline. Please try again shortly.",
+          ),
+        );
+        return;
+      }
+
+      // Reset state
+      actions.setLoading(true);
+      actions.setError(null);
+      actions.resetResults();
+      cleanupBlobUrls();
+
+      // Prepare files with history metadata injection (for PDFs)
+      actions.setStatus("Processing files...");
+
+      // Listen for global error file id events from HTTP interceptor during this run
+      let externalErrorFileIds: string[] = [];
+      const errorListener = (e: Event) => {
+        const detail = (e as CustomEvent)?.detail as any;
+        if (detail?.fileIds) {
+          externalErrorFileIds = Array.isArray(detail.fileIds)
+            ? detail.fileIds
+            : [];
+        }
+      };
+      window.addEventListener(
+        FILE_EVENTS.markError,
+        errorListener as EventListener,
+      );
 
       try {
-      let processedFiles: File[];
+        let processedFiles: File[];
         let successSourceIds: FileId[] = [];
 
-      // Use original files directly (no PDF metadata injection - history stored in IndexedDB)
-      const filesForAPI = extractFiles(validFiles);
+        // Use original files directly (no PDF metadata injection - history stored in IndexedDB)
+        const filesForAPI = extractFiles(validFiles);
 
-      switch (config.toolType) {
-        case ToolType.singleFile: {
-          // Individual file processing - separate API call per file
-          const apiCallsConfig: ApiCallsConfig<TParams> = {
-            endpoint: config.endpoint,
-            buildFormData: config.buildFormData,
-            filePrefix: config.filePrefix,
-            responseHandler: config.responseHandler,
-            preserveBackendFilename: config.preserveBackendFilename
-          };
-          console.debug('[useToolOperation] Multi-file start', { count: filesForAPI.length });
-          const result = await processFiles(
-            params,
-            validFiles,
-            apiCallsConfig,
-            actions.setProgress,
-            actions.setStatus,
-            fileActions.markFileError
-          );
-          processedFiles = result.outputFiles;
-          successSourceIds = result.successSourceIds;
-          console.debug('[useToolOperation] Multi-file results', { outputFiles: processedFiles.length, successSources: result.successSourceIds.length });
-          break;
-        }
-        case ToolType.multiFile: {
-          // Multi-file processing - single API call with all files
-          actions.setStatus('Processing files...');
-          const formData = config.buildFormData(params, filesForAPI);
-          const endpoint = typeof config.endpoint === 'function' ? config.endpoint(params) : config.endpoint;
-
-          const response = await apiClient.post(endpoint, formData, { responseType: 'blob' });
-
-          // Multi-file responses are typically ZIP files that need extraction, but some may return single PDFs
-          if (config.responseHandler) {
-            // Use custom responseHandler for multi-file (handles ZIP extraction)
-            processedFiles = await config.responseHandler(response.data, filesForAPI);
-          } else if (response.data.type === 'application/pdf' ||
-                    (response.headers && response.headers['content-type'] === 'application/pdf')) {
-            // Single PDF response (e.g. split with merge option) - add prefix to first original filename
-            const filename = `${config.filePrefix}${filesForAPI[0]?.name || 'document.pdf'}`;
-            const singleFile = new File([response.data], filename, { type: 'application/pdf' });
-            processedFiles = [singleFile];
-          } else {
-            // Default: assume ZIP response for multi-file endpoints
-            // Note: extractZipFiles will check preferences.autoUnzip setting
-            processedFiles = await extractZipFiles(response.data);
-          }
-          // Assume all inputs succeeded together unless server provided an error earlier
-          successSourceIds = validFiles.map(f => f.fileId);
-          break;
-        }
-
-        case ToolType.custom: {
-          actions.setStatus('Processing files...');
-          const result = await config.customProcessor(params, filesForAPI);
-
-          processedFiles = result.files;
-          const consumedAllInputs = result.consumedAllInputs || false;
-
-          // If consumedAllInputs flag is set, mark all inputs as successful
-          // (used for operations that combine N inputs into fewer outputs)
-          if (consumedAllInputs) {
-            successSourceIds = validFiles.map(f => f.fileId);
-          } else {
-            // Try to map outputs back to inputs by filename (before extension)
-            const inputBaseNames = new Map<string, FileId>();
-            for (const f of validFiles) {
-              const base = getFilenameWithoutExtension(f.name || '');
-              inputBaseNames.set(base, f.fileId);
-            }
-            const mappedSuccess: FileId[] = [];
-            for (const out of processedFiles) {
-              const base = getFilenameWithoutExtension(out.name || '');
-              const id = inputBaseNames.get(base);
-              if (id) mappedSuccess.push(id);
-            }
-            // Fallback to naive alignment if names don't match
-            if (mappedSuccess.length === 0) {
-              successSourceIds = validFiles.slice(0, processedFiles.length).map(f => f.fileId);
-            } else {
-              successSourceIds = mappedSuccess;
-            }
-          }
-          break;
-        }
-      }
-
-      // Normalize error flags across tool types: mark failures, clear successes
-      try {
-        const allInputIds = validFiles.map(f => f.fileId);
-        const okSet = new Set(successSourceIds);
-        // Clear errors on successes
-        for (const okId of okSet) {
-          try { fileActions.clearFileError(okId); } catch (_e) { void _e; }
-        }
-        // Mark errors on inputs that didn't succeed
-        for (const id of allInputIds) {
-          if (!okSet.has(id)) {
-            try { fileActions.markFileError(id); } catch (_e) { void _e; }
-          }
-        }
-      } catch (_e) { void _e; }
-
-      if (externalErrorFileIds.length > 0) {
-        // If backend told us which sources failed, prefer that mapping
-        successSourceIds = validFiles
-          .map(f => f.fileId)
-          .filter(id => !externalErrorFileIds.includes(id));
-        // Also mark failed IDs immediately
-        try {
-          for (const badId of externalErrorFileIds) {
-            fileActions.markFileError(badId as FileId);
-          }
-        } catch (_e) { void _e; }
-      }
-
-      if (processedFiles.length > 0) {
-        actions.setFiles(processedFiles);
-
-        // Generate thumbnails and download URL concurrently
-        actions.setGeneratingThumbnails(true);
-        const [thumbnails, downloadInfo] = await Promise.all([
-          generateThumbnails(processedFiles),
-          createDownloadInfo(processedFiles, config.operationType)
-        ]);
-        actions.setGeneratingThumbnails(false);
-
-        actions.setThumbnails(thumbnails);
-
-        // Determine whether outputs are new versions of their inputs or independent artifacts.
-        // A version operation produces exactly one output per successful input, all in the same
-        // format (e.g. compress, rotate, redact: 1→1 or N→N same extension).
-        // Everything else — format conversions (ext change), merges (N→1), splits (1→N) —
-        // produces outputs that have no meaningful parent-child relationship with the inputs.
-        const isVersionOp = processedFiles.length > 0
-          && successSourceIds.length === processedFiles.length
-          && successSourceIds.every((id, i) => {
-            const inputFile = validFiles.find(f => f.fileId === id);
-            const inExt = inputFile?.name.split('.').pop()?.toLowerCase();
-            const outExt = processedFiles[i].name.split('.').pop()?.toLowerCase();
-            return inExt != null && inExt === outExt;
-          });
-
-        actions.setStatus('Generating metadata for processed files...');
-        const processedFileMetadataArray = await Promise.all(
-          processedFiles.map(file => generateProcessedFileMetadata(file))
-        );
-
-        const { inputFileIds, inputStirlingFileStubs } = buildInputTracking(validFiles, selectors);
-
-        if (isVersionOp) {
-          // Output is a modified version of the input — link it to the input's version chain.
-          // The input is removed from the workbench and replaced in-place by the output.
-          const downloadLocalPath =
-            selectors.getStirlingFileStub(validFiles[0].fileId)?.localFilePath ?? null;
-
-          const newToolOperation: ToolOperation = {
-            toolId: config.operationType,
-            timestamp: Date.now()
-          };
-
-          const successInputStubs = successSourceIds
-            .map((id) => selectors.getStirlingFileStub(id))
-            .filter(Boolean) as StirlingFileStub[];
-
-          if (successInputStubs.length !== processedFiles.length) {
-            console.warn('[useToolOperation] Mismatch successInputStubs vs outputs', {
-              successInputStubs: successInputStubs.length,
-              outputs: processedFiles.length,
+        switch (config.toolType) {
+          case ToolType.singleFile: {
+            // Individual file processing - separate API call per file
+            const apiCallsConfig: ApiCallsConfig<TParams> = {
+              endpoint: config.endpoint,
+              buildFormData: config.buildFormData,
+              filePrefix: config.filePrefix,
+              responseHandler: config.responseHandler,
+              preserveBackendFilename: config.preserveBackendFilename,
+            };
+            console.debug("[useToolOperation] Multi-file start", {
+              count: filesForAPI.length,
             });
+            const result = await processFiles(
+              params,
+              validFiles,
+              apiCallsConfig,
+              actions.setProgress,
+              actions.setStatus,
+              fileActions.markFileError,
+            );
+            processedFiles = result.outputFiles;
+            successSourceIds = result.successSourceIds;
+            console.debug("[useToolOperation] Multi-file results", {
+              outputFiles: processedFiles.length,
+              successSources: result.successSourceIds.length,
+            });
+            break;
+          }
+          case ToolType.multiFile: {
+            // Multi-file processing - single API call with all files
+            actions.setStatus("Processing files...");
+            const formData = config.buildFormData(params, filesForAPI);
+            const endpoint =
+              typeof config.endpoint === "function"
+                ? config.endpoint(params)
+                : config.endpoint;
+
+            const response = await apiClient.post(endpoint, formData, {
+              responseType: "blob",
+            });
+
+            // Multi-file responses are typically ZIP files that need extraction, but some may return single PDFs
+            if (config.responseHandler) {
+              // Use custom responseHandler for multi-file (handles ZIP extraction)
+              processedFiles = await config.responseHandler(
+                response.data,
+                filesForAPI,
+              );
+            } else if (
+              response.data.type === "application/pdf" ||
+              (response.headers &&
+                response.headers["content-type"] === "application/pdf")
+            ) {
+              // Single PDF response (e.g. split with merge option) - add prefix to first original filename
+              const filename = `${config.filePrefix}${filesForAPI[0]?.name || "document.pdf"}`;
+              const singleFile = new File([response.data], filename, {
+                type: "application/pdf",
+              });
+              processedFiles = [singleFile];
+            } else {
+              // Default: assume ZIP response for multi-file endpoints
+              // Note: extractZipFiles will check preferences.autoUnzip setting
+              processedFiles = await extractZipFiles(response.data);
+            }
+            // Assume all inputs succeeded together unless server provided an error earlier
+            successSourceIds = validFiles.map((f) => f.fileId);
+            break;
           }
 
-          const { outputStirlingFileStubs, outputStirlingFiles } = buildOutputPairs(
-            processedFiles, thumbnails, processedFileMetadataArray,
-            (file, thumbnail, metadata, index) => createChildStub(
-              successInputStubs[index] || inputStirlingFileStubs[index] || inputStirlingFileStubs[0],
-              newToolOperation, file, thumbnail, metadata
-            )
-          );
+          case ToolType.custom: {
+            actions.setStatus("Processing files...");
+            const result = await config.customProcessor(params, filesForAPI);
 
-          // Only consume inputs that successfully produced outputs
-          const toConsumeInputIds = successSourceIds.filter((id) => inputFileIds.includes(id));
-          console.debug('[useToolOperation] Consuming files (version)', { inputCount: inputFileIds.length, toConsume: toConsumeInputIds.length });
-          const outputFileIds = await consumeFiles(toConsumeInputIds, outputStirlingFiles, outputStirlingFileStubs);
+            processedFiles = result.files;
+            const consumedAllInputs = result.consumedAllInputs || false;
 
-          // Notify on desktop when processing completes
-          await notifyPdfProcessingComplete(outputFileIds.length);
+            // If consumedAllInputs flag is set, mark all inputs as successful
+            // (used for operations that combine N inputs into fewer outputs)
+            if (consumedAllInputs) {
+              successSourceIds = validFiles.map((f) => f.fileId);
+            } else {
+              // Try to map outputs back to inputs by filename (before extension)
+              const inputBaseNames = new Map<string, FileId>();
+              for (const f of validFiles) {
+                const base = getFilenameWithoutExtension(f.name || "");
+                inputBaseNames.set(base, f.fileId);
+              }
+              const mappedSuccess: FileId[] = [];
+              for (const out of processedFiles) {
+                const base = getFilenameWithoutExtension(out.name || "");
+                const id = inputBaseNames.get(base);
+                if (id) mappedSuccess.push(id);
+              }
+              // Fallback to naive alignment if names don't match
+              if (mappedSuccess.length === 0) {
+                successSourceIds = validFiles
+                  .slice(0, processedFiles.length)
+                  .map((f) => f.fileId);
+              } else {
+                successSourceIds = mappedSuccess;
+              }
+            }
+            break;
+          }
+        }
 
-          // Carry the desktop save path forward so the output can be saved back to the same file
-          if (toConsumeInputIds.length === 1 && outputFileIds.length === 1) {
-            const inputStub = selectors.getStirlingFileStub(toConsumeInputIds[0]);
-            if (inputStub?.localFilePath) {
-              fileActions.updateStirlingFileStub(outputFileIds[0], {
-                localFilePath: inputStub.localFilePath
-              });
+        // Normalize error flags across tool types: mark failures, clear successes
+        try {
+          const allInputIds = validFiles.map((f) => f.fileId);
+          const okSet = new Set(successSourceIds);
+          // Clear errors on successes
+          for (const okId of okSet) {
+            try {
+              fileActions.clearFileError(okId);
+            } catch (_e) {
+              void _e;
             }
           }
+          // Mark errors on inputs that didn't succeed
+          for (const id of allInputIds) {
+            if (!okSet.has(id)) {
+              try {
+                fileActions.markFileError(id);
+              } catch (_e) {
+                void _e;
+              }
+            }
+          }
+        } catch (_e) {
+          void _e;
+        }
 
-          actions.setDownloadInfo(downloadInfo.url, downloadInfo.filename, downloadLocalPath, outputFileIds);
+        if (externalErrorFileIds.length > 0) {
+          // If backend told us which sources failed, prefer that mapping
+          successSourceIds = validFiles
+            .map((f) => f.fileId)
+            .filter((id) => !externalErrorFileIds.includes(id));
+          // Also mark failed IDs immediately
+          try {
+            for (const badId of externalErrorFileIds) {
+              fileActions.markFileError(badId as FileId);
+            }
+          } catch (_e) {
+            void _e;
+          }
+        }
 
-          lastOperationRef.current = {
-            inputFiles: extractFiles(validFiles),
-            inputStirlingFileStubs: inputStirlingFileStubs.map(record => ({ ...record })),
-            outputFileIds
-          };
+        if (processedFiles.length > 0) {
+          actions.setFiles(processedFiles);
 
-        } else {
-          // Outputs are independent artifacts (format conversion, merge, split).
-          // Create fresh root stubs with no parent chain, then swap out only the inputs
-          // that successfully produced outputs — other workbench files are untouched.
-          const { outputStirlingFileStubs, outputStirlingFiles } = buildOutputPairs(
-            processedFiles, thumbnails, processedFileMetadataArray,
-            (file, thumbnail, metadata) => createNewStirlingFileStub(file, undefined, thumbnail, metadata)
+          // Generate thumbnails and download URL concurrently
+          actions.setGeneratingThumbnails(true);
+          const [thumbnails, downloadInfo] = await Promise.all([
+            generateThumbnails(processedFiles),
+            createDownloadInfo(processedFiles, config.operationType),
+          ]);
+          actions.setGeneratingThumbnails(false);
+
+          actions.setThumbnails(thumbnails);
+
+          // Determine whether outputs are new versions of their inputs or independent artifacts.
+          // A version operation produces exactly one output per successful input, all in the same
+          // format (e.g. compress, rotate, redact: 1→1 or N→N same extension).
+          // Everything else — format conversions (ext change), merges (N→1), splits (1→N) —
+          // produces outputs that have no meaningful parent-child relationship with the inputs.
+          const isVersionOp =
+            processedFiles.length > 0 &&
+            successSourceIds.length === processedFiles.length &&
+            successSourceIds.every((id, i) => {
+              const inputFile = validFiles.find((f) => f.fileId === id);
+              const inExt = inputFile?.name.split(".").pop()?.toLowerCase();
+              const outExt = processedFiles[i].name
+                .split(".")
+                .pop()
+                ?.toLowerCase();
+              return inExt != null && inExt === outExt;
+            });
+
+          actions.setStatus("Generating metadata for processed files...");
+          const processedFileMetadataArray = await Promise.all(
+            processedFiles.map((file) => generateProcessedFileMetadata(file)),
           );
 
-          const toConsumeInputIds = successSourceIds.filter((id) => inputFileIds.includes(id));
-          console.debug('[useToolOperation] Consuming files (independent)', { inputCount: inputFileIds.length, toConsume: toConsumeInputIds.length });
-          const outputFileIds = await consumeFiles(toConsumeInputIds, outputStirlingFiles, outputStirlingFileStubs);
+          const { inputFileIds, inputStirlingFileStubs } = buildInputTracking(
+            validFiles,
+            selectors,
+          );
 
-          // Notify on desktop when processing completes
-          await notifyPdfProcessingComplete(outputFileIds.length);
+          if (isVersionOp) {
+            // Output is a modified version of the input — link it to the input's version chain.
+            // The input is removed from the workbench and replaced in-place by the output.
+            const downloadLocalPath =
+              selectors.getStirlingFileStub(validFiles[0].fileId)
+                ?.localFilePath ?? null;
 
-          actions.setDownloadInfo(downloadInfo.url, downloadInfo.filename, null, outputFileIds);
+            const newToolOperation: ToolOperation = {
+              toolId: config.operationType,
+              timestamp: Date.now(),
+            };
 
-          // Send the user to the viewer for a single PDF output, otherwise the file editor
-          const isSinglePdf = processedFiles.length === 1
-            && processedFiles[0].type === 'application/pdf';
-          navActions.setWorkbench(isSinglePdf ? 'viewer' : 'fileEditor');
+            const successInputStubs = successSourceIds
+              .map((id) => selectors.getStirlingFileStub(id))
+              .filter(Boolean) as StirlingFileStub[];
 
-          lastOperationRef.current = {
-            inputFiles: extractFiles(validFiles),
-            inputStirlingFileStubs: inputStirlingFileStubs.map(record => ({ ...record })),
-            outputFileIds
-          };
+            if (successInputStubs.length !== processedFiles.length) {
+              console.warn(
+                "[useToolOperation] Mismatch successInputStubs vs outputs",
+                {
+                  successInputStubs: successInputStubs.length,
+                  outputs: processedFiles.length,
+                },
+              );
+            }
+
+            const { outputStirlingFileStubs, outputStirlingFiles } =
+              buildOutputPairs(
+                processedFiles,
+                thumbnails,
+                processedFileMetadataArray,
+                (file, thumbnail, metadata, index) =>
+                  createChildStub(
+                    successInputStubs[index] ||
+                      inputStirlingFileStubs[index] ||
+                      inputStirlingFileStubs[0],
+                    newToolOperation,
+                    file,
+                    thumbnail,
+                    metadata,
+                  ),
+              );
+
+            // Only consume inputs that successfully produced outputs
+            const toConsumeInputIds = successSourceIds.filter((id) =>
+              inputFileIds.includes(id),
+            );
+            console.debug("[useToolOperation] Consuming files (version)", {
+              inputCount: inputFileIds.length,
+              toConsume: toConsumeInputIds.length,
+            });
+            const outputFileIds = await consumeFiles(
+              toConsumeInputIds,
+              outputStirlingFiles,
+              outputStirlingFileStubs,
+            );
+            // Tell the viewer to follow the replacement file — consumeFiles prepends the new file
+            // to the list, so activeFileIndex would point to the wrong file without this.
+            if (outputFileIds.length === 1) setActiveFileId(outputFileIds[0]);
+
+            // Notify on desktop when processing completes
+            await notifyPdfProcessingComplete(outputFileIds.length);
+
+            // Carry the desktop save path forward so the output can be saved back to the same file
+            if (toConsumeInputIds.length === 1 && outputFileIds.length === 1) {
+              const inputStub = selectors.getStirlingFileStub(
+                toConsumeInputIds[0],
+              );
+              if (inputStub?.localFilePath) {
+                fileActions.updateStirlingFileStub(outputFileIds[0], {
+                  localFilePath: inputStub.localFilePath,
+                });
+              }
+            }
+
+            actions.setDownloadInfo(
+              downloadInfo.url,
+              downloadInfo.filename,
+              downloadLocalPath,
+              outputFileIds,
+            );
+
+            lastOperationRef.current = {
+              inputFiles: extractFiles(validFiles),
+              inputStirlingFileStubs: inputStirlingFileStubs.map((record) => ({
+                ...record,
+              })),
+              outputFileIds,
+            };
+          } else {
+            // Outputs are independent artifacts (format conversion, merge, split).
+            // Create fresh root stubs with no parent chain, then swap out only the inputs
+            // that successfully produced outputs — other workbench files are untouched.
+            const { outputStirlingFileStubs, outputStirlingFiles } =
+              buildOutputPairs(
+                processedFiles,
+                thumbnails,
+                processedFileMetadataArray,
+                (file, thumbnail, metadata) =>
+                  createNewStirlingFileStub(
+                    file,
+                    undefined,
+                    thumbnail,
+                    metadata,
+                  ),
+              );
+
+            const toConsumeInputIds = successSourceIds.filter((id) =>
+              inputFileIds.includes(id),
+            );
+            console.debug("[useToolOperation] Consuming files (independent)", {
+              inputCount: inputFileIds.length,
+              toConsume: toConsumeInputIds.length,
+            });
+            const outputFileIds = await consumeFiles(
+              toConsumeInputIds,
+              outputStirlingFiles,
+              outputStirlingFileStubs,
+            );
+
+            // Notify on desktop when processing completes
+            await notifyPdfProcessingComplete(outputFileIds.length);
+
+            actions.setDownloadInfo(
+              downloadInfo.url,
+              downloadInfo.filename,
+              null,
+              outputFileIds,
+            );
+
+            // Send the user to the viewer for a single PDF output, otherwise the file editor
+            const isSinglePdf =
+              processedFiles.length === 1 &&
+              processedFiles[0].type === "application/pdf";
+            navActions.setWorkbench(isSinglePdf ? "viewer" : "fileEditor");
+
+            lastOperationRef.current = {
+              inputFiles: extractFiles(validFiles),
+              inputStirlingFileStubs: inputStirlingFileStubs.map((record) => ({
+                ...record,
+              })),
+              outputFileIds,
+            };
+          }
+        }
+      } catch (error: any) {
+        try {
+          const handled = await handle422Error(error, (id) =>
+            fileActions.markFileError(id as FileId),
+          );
+          if (handled) {
+            actions.setStatus(
+              "Process failed due to invalid/corrupted file(s)",
+            );
+            return;
+          }
+        } catch (_e) {
+          void _e;
         }
 
+        const errorMessage =
+          config.getErrorMessage?.(error) || extractErrorMessage(error);
+        actions.setError(errorMessage);
+        actions.setStatus("");
+      } finally {
+        window.removeEventListener(
+          FILE_EVENTS.markError,
+          errorListener as EventListener,
+        );
+        actions.setLoading(false);
+        actions.setProgress(null);
       }
-
-    } catch (error: any) {
-      try {
-        const handled = await handle422Error(error, (id) => fileActions.markFileError(id as FileId));
-        if (handled) {
-          actions.setStatus('Process failed due to invalid/corrupted file(s)');
-          return;
-        }
-      } catch (_e) { void _e; }
-
-      const errorMessage = config.getErrorMessage?.(error) || extractErrorMessage(error);
-      actions.setError(errorMessage);
-      actions.setStatus('');
-    } finally {
-      window.removeEventListener(FILE_EVENTS.markError, errorListener as EventListener);
-      actions.setLoading(false);
-      actions.setProgress(null);
-    }
-  }, [t, config, actions, addFiles, consumeFiles, navActions, processFiles, generateThumbnails, createDownloadInfo, cleanupBlobUrls, extractZipFiles, willUseCloud, checkCredits]);
+    },
+    [
+      t,
+      config,
+      actions,
+      addFiles,
+      consumeFiles,
+      navActions,
+      processFiles,
+      generateThumbnails,
+      createDownloadInfo,
+      cleanupBlobUrls,
+      extractZipFiles,
+      willUseCloud,
+      checkCredits,
+    ],
+  );
 
   const cancelOperation = useCallback(() => {
     cancelApiCalls();
     actions.setLoading(false);
     actions.setProgress(null);
-    actions.setStatus('Operation cancelled');
+    actions.setStatus("Operation cancelled");
   }, [cancelApiCalls, actions]);
 
   const resetResults = useCallback(() => {
@@ -444,20 +634,28 @@ export const useToolOperation = <TParams>(
 
   const undoOperation = useCallback(async () => {
     if (!lastOperationRef.current) {
-      actions.setError(t('noOperationToUndo', 'No operation to undo'));
+      actions.setError(t("noOperationToUndo", "No operation to undo"));
       return;
     }
 
-    const { inputFiles, inputStirlingFileStubs, outputFileIds } = lastOperationRef.current;
+    const { inputFiles, inputStirlingFileStubs, outputFileIds } =
+      lastOperationRef.current;
 
     // Validate that we have data to undo
     if (inputFiles.length === 0 || inputStirlingFileStubs.length === 0) {
-      actions.setError(t('invalidUndoData', 'Cannot undo: invalid operation data'));
+      actions.setError(
+        t("invalidUndoData", "Cannot undo: invalid operation data"),
+      );
       return;
     }
 
     if (outputFileIds.length === 0) {
-      actions.setError(t('noFilesToUndo', 'Cannot undo: no files were processed in the last operation'));
+      actions.setError(
+        t(
+          "noFilesToUndo",
+          "Cannot undo: no files were processed in the last operation",
+        ),
+      );
       return;
     }
 
@@ -470,21 +668,31 @@ export const useToolOperation = <TParams>(
       lastOperationRef.current = null;
 
       // Show success message
-      actions.setStatus(t('undoSuccess', 'Operation undone successfully'));
-
+      actions.setStatus(t("undoSuccess", "Operation undone successfully"));
     } catch (error: any) {
       let errorMessage = extractErrorMessage(error);
 
       // Provide more specific error messages based on error type
-      if (error.message?.includes('Mismatch between input files')) {
-        errorMessage = t('undoDataMismatch', 'Cannot undo: operation data is corrupted');
-      } else if (error.message?.includes('IndexedDB')) {
-        errorMessage = t('undoStorageError', 'Undo completed but some files could not be saved to storage');
-      } else if (error.name === 'QuotaExceededError') {
-        errorMessage = t('undoQuotaError', 'Cannot undo: insufficient storage space');
+      if (error.message?.includes("Mismatch between input files")) {
+        errorMessage = t(
+          "undoDataMismatch",
+          "Cannot undo: operation data is corrupted",
+        );
+      } else if (error.message?.includes("IndexedDB")) {
+        errorMessage = t(
+          "undoStorageError",
+          "Undo completed but some files could not be saved to storage",
+        );
+      } else if (error.name === "QuotaExceededError") {
+        errorMessage = t(
+          "undoQuotaError",
+          "Cannot undo: insufficient storage space",
+        );
       }
 
-      actions.setError(`${t('undoFailed', 'Failed to undo operation')}: ${errorMessage}`);
+      actions.setError(
+        `${t("undoFailed", "Failed to undo operation")}: ${errorMessage}`,
+      );
 
       // Don't clear the operation data if undo failed - user might want to try again
     }
@@ -510,6 +718,6 @@ export const useToolOperation = <TParams>(
     resetResults,
     clearError: actions.clearError,
     cancelOperation,
-    undoOperation
+    undoOperation,
   };
 };
diff --git a/frontend/src/core/hooks/tools/shared/useToolResources.ts b/frontend/src/core/hooks/tools/shared/useToolResources.ts
index a80c2c298b..16cbe839f0 100644
--- a/frontend/src/core/hooks/tools/shared/useToolResources.ts
+++ b/frontend/src/core/hooks/tools/shared/useToolResources.ts
@@ -1,24 +1,27 @@
-import { useState, useCallback, useEffect, useRef } from 'react';
-import { generateThumbnailForFile, generateThumbnailWithMetadata, ThumbnailWithMetadata } from '@app/utils/thumbnailUtils';
-import { zipFileService } from '@app/services/zipFileService';
-import { usePreferences } from '@app/contexts/PreferencesContext';
-
+import { useState, useCallback, useEffect, useRef } from "react";
+import {
+  generateThumbnailForFile,
+  generateThumbnailWithMetadata,
+  ThumbnailWithMetadata,
+} from "@app/utils/thumbnailUtils";
+import { zipFileService } from "@app/services/zipFileService";
+import { usePreferences } from "@app/contexts/PreferencesContext";
 
 export const useToolResources = () => {
   const { preferences } = usePreferences();
   const [blobUrls, setBlobUrls] = useState<string[]>([]);
 
   const addBlobUrl = useCallback((url: string) => {
-    setBlobUrls(prev => [...prev, url]);
+    setBlobUrls((prev) => [...prev, url]);
   }, []);
 
   const cleanupBlobUrls = useCallback(() => {
-    setBlobUrls(prev => {
-      prev.forEach(url => {
+    setBlobUrls((prev) => {
+      prev.forEach((url) => {
         try {
           URL.revokeObjectURL(url);
         } catch (error) {
-          console.warn('Failed to revoke blob URL:', error);
+          console.warn("Failed to revoke blob URL:", error);
         }
       });
       return [];
@@ -34,90 +37,126 @@ export const useToolResources = () => {
 
   useEffect(() => {
     return () => {
-      blobUrlsRef.current.forEach(url => {
+      blobUrlsRef.current.forEach((url) => {
         try {
           URL.revokeObjectURL(url);
         } catch (error) {
-          console.warn('Failed to revoke blob URL during cleanup:', error);
+          console.warn("Failed to revoke blob URL during cleanup:", error);
         }
       });
     };
   }, []); // No dependencies - use ref to access current URLs
 
-  const generateThumbnails = useCallback(async (files: File[]): Promise<string[]> => {
-    console.log(`🖼� useToolResources.generateThumbnails: Starting for ${files.length} files`);
-    const thumbnails: string[] = [];
+  const generateThumbnails = useCallback(
+    async (files: File[]): Promise<string[]> => {
+      console.log(
+        `🖼� useToolResources.generateThumbnails: Starting for ${files.length} files`,
+      );
+      const thumbnails: string[] = [];
 
-    for (const file of files) {
-      try {
-        console.log(`🖼� Generating thumbnail for: ${file.name} (${file.type}, ${file.size} bytes)`);
-        const thumbnail = await generateThumbnailForFile(file);
-        console.log(`🖼� Generated thumbnail for ${file.name}: SUCCESS`);
-        thumbnails.push(thumbnail);
-      } catch (error) {
-        console.warn(`🖼� Failed to generate thumbnail for ${file.name}:`, error);
-        thumbnails.push('');
+      for (const file of files) {
+        try {
+          console.log(
+            `🖼� Generating thumbnail for: ${file.name} (${file.type}, ${file.size} bytes)`,
+          );
+          const thumbnail = await generateThumbnailForFile(file);
+          console.log(`🖼� Generated thumbnail for ${file.name}: SUCCESS`);
+          thumbnails.push(thumbnail);
+        } catch (error) {
+          console.warn(
+            `🖼� Failed to generate thumbnail for ${file.name}:`,
+            error,
+          );
+          thumbnails.push("");
+        }
       }
-    }
 
-    return thumbnails;
-  }, []);
+      return thumbnails;
+    },
+    [],
+  );
 
-  const generateThumbnailsWithMetadata = useCallback(async (files: File[]): Promise<ThumbnailWithMetadata[]> => {
-    console.log(`🖼� useToolResources.generateThumbnailsWithMetadata: Starting for ${files.length} files`);
-    const results: ThumbnailWithMetadata[] = [];
+  const generateThumbnailsWithMetadata = useCallback(
+    async (files: File[]): Promise<ThumbnailWithMetadata[]> => {
+      console.log(
+        `🖼� useToolResources.generateThumbnailsWithMetadata: Starting for ${files.length} files`,
+      );
+      const results: ThumbnailWithMetadata[] = [];
 
-    for (const file of files) {
-      try {
-        console.log(`🖼� Generating thumbnail with metadata for: ${file.name} (${file.type}, ${file.size} bytes)`);
-        const result = await generateThumbnailWithMetadata(file);
-        console.log(`🖼� Generated thumbnail with metadata for ${file.name}: SUCCESS, ${result.pageCount} pages`);
-        results.push(result);
-      } catch (error) {
-        console.warn(`🖼� Failed to generate thumbnail with metadata for ${file.name}:`, error);
-        results.push({ thumbnail: '', pageCount: 1 });
+      for (const file of files) {
+        try {
+          console.log(
+            `🖼� Generating thumbnail with metadata for: ${file.name} (${file.type}, ${file.size} bytes)`,
+          );
+          const result = await generateThumbnailWithMetadata(file);
+          console.log(
+            `🖼� Generated thumbnail with metadata for ${file.name}: SUCCESS, ${result.pageCount} pages`,
+          );
+          results.push(result);
+        } catch (error) {
+          console.warn(
+            `🖼� Failed to generate thumbnail with metadata for ${file.name}:`,
+            error,
+          );
+          results.push({ thumbnail: "", pageCount: 1 });
+        }
       }
-    }
 
-    console.log(`🖼� useToolResources.generateThumbnailsWithMetadata: Complete. Generated ${results.length}/${files.length} thumbnails with metadata`);
-    return results;
-  }, []);
+      console.log(
+        `🖼� useToolResources.generateThumbnailsWithMetadata: Complete. Generated ${results.length}/${files.length} thumbnails with metadata`,
+      );
+      return results;
+    },
+    [],
+  );
 
-  const extractZipFiles = useCallback(async (
-    zipBlob: Blob, 
-    skipAutoUnzip = false,
-    confirmLargeExtraction?: (fileCount: number, fileName: string) => Promise<boolean>
-  ): Promise<File[]> => {
-    try {
-      return await zipFileService.extractWithPreferences(zipBlob, {
-        autoUnzip: preferences.autoUnzip,
-        autoUnzipFileLimit: preferences.autoUnzipFileLimit,
-        skipAutoUnzip,
-        confirmLargeExtraction
-      });
-    } catch (error) {
-      console.error('useToolResources.extractZipFiles - Error:', error);
-      return [];
-    }
-  }, [preferences.autoUnzip, preferences.autoUnzipFileLimit]);
+  const extractZipFiles = useCallback(
+    async (
+      zipBlob: Blob,
+      skipAutoUnzip = false,
+      confirmLargeExtraction?: (
+        fileCount: number,
+        fileName: string,
+      ) => Promise<boolean>,
+    ): Promise<File[]> => {
+      try {
+        return await zipFileService.extractWithPreferences(zipBlob, {
+          autoUnzip: preferences.autoUnzip,
+          autoUnzipFileLimit: preferences.autoUnzipFileLimit,
+          skipAutoUnzip,
+          confirmLargeExtraction,
+        });
+      } catch (error) {
+        console.error("useToolResources.extractZipFiles - Error:", error);
+        return [];
+      }
+    },
+    [preferences.autoUnzip, preferences.autoUnzipFileLimit],
+  );
 
-  const createDownloadInfo = useCallback(async (
-    files: File[],
-    operationType: string
-  ): Promise<{ url: string; filename: string }> => {
-    if (files.length === 1) {
-      const url = URL.createObjectURL(files[0]);
+  const createDownloadInfo = useCallback(
+    async (
+      files: File[],
+      operationType: string,
+    ): Promise<{ url: string; filename: string }> => {
+      if (files.length === 1) {
+        const url = URL.createObjectURL(files[0]);
+        addBlobUrl(url);
+        return { url, filename: files[0].name };
+      }
+
+      // Multiple files - create zip using shared service
+      const { zipFile } = await zipFileService.createZipFromFiles(
+        files,
+        `${operationType}_results.zip`,
+      );
+      const url = URL.createObjectURL(zipFile);
       addBlobUrl(url);
-      return { url, filename: files[0].name };
-    }
 
-    // Multiple files - create zip using shared service
-    const { zipFile } = await zipFileService.createZipFromFiles(files, `${operationType}_results.zip`);
-    const url = URL.createObjectURL(zipFile);
-    addBlobUrl(url);
-
-    return { url, filename: zipFile.name };
-  }, [addBlobUrl]);
+      return { url, filename: zipFile.name };
+    },
+    [addBlobUrl],
+  );
 
   return {
     generateThumbnails,
diff --git a/frontend/src/core/hooks/tools/shared/useToolState.ts b/frontend/src/core/hooks/tools/shared/useToolState.ts
index 6c7e3b821f..8fc38cee24 100644
--- a/frontend/src/core/hooks/tools/shared/useToolState.ts
+++ b/frontend/src/core/hooks/tools/shared/useToolState.ts
@@ -1,4 +1,4 @@
-import { useReducer, useCallback } from 'react';
+import { useReducer, useCallback } from "react";
 
 export interface ProcessingProgress {
   current: number;
@@ -21,61 +21,72 @@ export interface OperationState {
 }
 
 type OperationAction =
-  | { type: 'SET_LOADING'; payload: boolean }
-  | { type: 'SET_FILES'; payload: File[] }
-  | { type: 'SET_THUMBNAILS'; payload: string[] }
-  | { type: 'SET_GENERATING_THUMBNAILS'; payload: boolean }
-  | { type: 'SET_DOWNLOAD_INFO'; payload: { url: string | null; filename: string; localPath?: string | null; outputFileIds?: string[] | null } }
-  | { type: 'SET_STATUS'; payload: string }
-  | { type: 'SET_ERROR'; payload: string | null }
-  | { type: 'SET_PROGRESS'; payload: ProcessingProgress | null }
-  | { type: 'RESET_RESULTS' }
-  | { type: 'CLEAR_ERROR' };
+  | { type: "SET_LOADING"; payload: boolean }
+  | { type: "SET_FILES"; payload: File[] }
+  | { type: "SET_THUMBNAILS"; payload: string[] }
+  | { type: "SET_GENERATING_THUMBNAILS"; payload: boolean }
+  | {
+      type: "SET_DOWNLOAD_INFO";
+      payload: {
+        url: string | null;
+        filename: string;
+        localPath?: string | null;
+        outputFileIds?: string[] | null;
+      };
+    }
+  | { type: "SET_STATUS"; payload: string }
+  | { type: "SET_ERROR"; payload: string | null }
+  | { type: "SET_PROGRESS"; payload: ProcessingProgress | null }
+  | { type: "RESET_RESULTS" }
+  | { type: "CLEAR_ERROR" };
 
 const initialState: OperationState = {
   files: [],
   thumbnails: [],
   isGeneratingThumbnails: false,
   downloadUrl: null,
-  downloadFilename: '',
+  downloadFilename: "",
   downloadLocalPath: null,
   outputFileIds: null,
   isLoading: false,
-  status: '',
+  status: "",
   errorMessage: null,
   progress: null,
 };
 
-const operationReducer = (state: OperationState, action: OperationAction): OperationState => {
+const operationReducer = (
+  state: OperationState,
+  action: OperationAction,
+): OperationState => {
   switch (action.type) {
-    case 'SET_LOADING':
+    case "SET_LOADING":
       return { ...state, isLoading: action.payload };
-    case 'SET_FILES':
+    case "SET_FILES":
       return { ...state, files: action.payload };
-    case 'SET_THUMBNAILS':
+    case "SET_THUMBNAILS":
       return { ...state, thumbnails: action.payload };
-    case 'SET_GENERATING_THUMBNAILS':
+    case "SET_GENERATING_THUMBNAILS":
       return { ...state, isGeneratingThumbnails: action.payload };
-    case 'SET_DOWNLOAD_INFO':
+    case "SET_DOWNLOAD_INFO":
       return {
         ...state,
         downloadUrl: action.payload.url,
         downloadFilename: action.payload.filename,
         downloadLocalPath: action.payload.localPath ?? null,
-        outputFileIds: action.payload.outputFileIds ?? null
+        outputFileIds: action.payload.outputFileIds ?? null,
       };
-    case 'SET_STATUS':
+    case "SET_STATUS":
       return { ...state, status: action.payload };
-    case 'SET_ERROR':
+    case "SET_ERROR":
       return { ...state, errorMessage: action.payload };
-    case 'SET_PROGRESS':
+    case "SET_PROGRESS":
       return { ...state, progress: action.payload };
-    case 'RESET_RESULTS':
+    case "RESET_RESULTS":
       return {
         ...initialState,
         isLoading: state.isLoading, // Preserve loading state during reset
       };
-    case 'CLEAR_ERROR':
+    case "CLEAR_ERROR":
       return { ...state, errorMessage: null };
     default:
       return state;
@@ -86,45 +97,58 @@ export const useToolState = () => {
   const [state, dispatch] = useReducer(operationReducer, initialState);
 
   const setLoading = useCallback((loading: boolean) => {
-    dispatch({ type: 'SET_LOADING', payload: loading });
+    dispatch({ type: "SET_LOADING", payload: loading });
   }, []);
 
   const setFiles = useCallback((files: File[]) => {
-    dispatch({ type: 'SET_FILES', payload: files });
+    dispatch({ type: "SET_FILES", payload: files });
   }, []);
 
   const setThumbnails = useCallback((thumbnails: string[]) => {
-    console.log(`🔧 useToolState.setThumbnails: Setting ${thumbnails.length} thumbnails:`, 
-      thumbnails.map((t, i) => `[${i}]: ${t ? 'PRESENT' : 'MISSING'}`));
-    dispatch({ type: 'SET_THUMBNAILS', payload: thumbnails });
+    console.log(
+      `🔧 useToolState.setThumbnails: Setting ${thumbnails.length} thumbnails:`,
+      thumbnails.map((t, i) => `[${i}]: ${t ? "PRESENT" : "MISSING"}`),
+    );
+    dispatch({ type: "SET_THUMBNAILS", payload: thumbnails });
   }, []);
 
   const setGeneratingThumbnails = useCallback((generating: boolean) => {
-    dispatch({ type: 'SET_GENERATING_THUMBNAILS', payload: generating });
+    dispatch({ type: "SET_GENERATING_THUMBNAILS", payload: generating });
   }, []);
 
-  const setDownloadInfo = useCallback((url: string | null, filename: string, localPath?: string | null, outputFileIds?: string[] | null) => {
-    dispatch({ type: 'SET_DOWNLOAD_INFO', payload: { url, filename, localPath, outputFileIds } });
-  }, []);
+  const setDownloadInfo = useCallback(
+    (
+      url: string | null,
+      filename: string,
+      localPath?: string | null,
+      outputFileIds?: string[] | null,
+    ) => {
+      dispatch({
+        type: "SET_DOWNLOAD_INFO",
+        payload: { url, filename, localPath, outputFileIds },
+      });
+    },
+    [],
+  );
 
   const setStatus = useCallback((status: string) => {
-    dispatch({ type: 'SET_STATUS', payload: status });
+    dispatch({ type: "SET_STATUS", payload: status });
   }, []);
 
   const setError = useCallback((error: string | null) => {
-    dispatch({ type: 'SET_ERROR', payload: error });
+    dispatch({ type: "SET_ERROR", payload: error });
   }, []);
 
   const setProgress = useCallback((progress: ProcessingProgress | null) => {
-    dispatch({ type: 'SET_PROGRESS', payload: progress });
+    dispatch({ type: "SET_PROGRESS", payload: progress });
   }, []);
 
   const resetResults = useCallback(() => {
-    dispatch({ type: 'RESET_RESULTS' });
+    dispatch({ type: "RESET_RESULTS" });
   }, []);
 
   const clearError = useCallback(() => {
-    dispatch({ type: 'CLEAR_ERROR' });
+    dispatch({ type: "CLEAR_ERROR" });
   }, []);
 
   return {
diff --git a/frontend/src/core/hooks/tools/shared/useViewScopedFiles.ts b/frontend/src/core/hooks/tools/shared/useViewScopedFiles.ts
new file mode 100644
index 0000000000..87f5fd93e6
--- /dev/null
+++ b/frontend/src/core/hooks/tools/shared/useViewScopedFiles.ts
@@ -0,0 +1,32 @@
+import { useMemo } from "react";
+import { useAllFiles, useSelectedFiles } from "@app/contexts/FileContext";
+import { useViewer } from "@app/contexts/ViewerContext";
+import { useNavigationState } from "@app/contexts/NavigationContext";
+import { StirlingFile } from "@app/types/fileContext";
+
+/**
+ * Returns the effective file set for tool operations.
+ *
+ * - Viewer: scopes to the single file currently shown, unless ignoreViewerScope is true.
+ * - FileEditor: scopes to the selected subset (empty selection → empty → button disabled).
+ * - PageEditor / custom workbenches: returns all loaded files (selection tracks pages, not files).
+ */
+export function useViewScopedFiles(ignoreViewerScope = false): StirlingFile[] {
+  const { activeFileIndex } = useViewer();
+  const { files: allFiles } = useAllFiles();
+  const { workbench } = useNavigationState();
+  const { selectedFiles } = useSelectedFiles();
+
+  return useMemo(() => {
+    if (workbench === "viewer" && !ignoreViewerScope) {
+      const viewerFile = allFiles[activeFileIndex];
+      return viewerFile ? [viewerFile] : allFiles;
+    }
+
+    if (workbench === "fileEditor") {
+      return selectedFiles;
+    }
+
+    return allFiles;
+  }, [workbench, allFiles, activeFileIndex, selectedFiles, ignoreViewerScope]);
+}
diff --git a/frontend/src/core/hooks/tools/showJS/useShowJSOperation.ts b/frontend/src/core/hooks/tools/showJS/useShowJSOperation.ts
index 834402d5f4..9319290107 100644
--- a/frontend/src/core/hooks/tools/showJS/useShowJSOperation.ts
+++ b/frontend/src/core/hooks/tools/showJS/useShowJSOperation.ts
@@ -1,135 +1,142 @@
-import { useCallback, useRef, useState } from 'react';
-import { useTranslation } from 'react-i18next';
-import apiClient from '@app/services/apiClient';
-import type { ToolOperationHook } from '@app/hooks/tools/shared/useToolOperation';
-import type { StirlingFile } from '@app/types/fileContext';
-import { extractErrorMessage } from '@app/utils/toolErrorHandler';
-import type { ShowJSParameters } from '@app/hooks/tools/showJS/useShowJSParameters';
+import { useCallback, useRef, useState } from "react";
+import { useTranslation } from "react-i18next";
+import apiClient from "@app/services/apiClient";
+import type { ToolOperationHook } from "@app/hooks/tools/shared/useToolOperation";
+import type { StirlingFile } from "@app/types/fileContext";
+import { extractErrorMessage } from "@app/utils/toolErrorHandler";
+import type { ShowJSParameters } from "@app/hooks/tools/showJS/useShowJSParameters";
 
 export interface ShowJSOperationHook extends ToolOperationHook<ShowJSParameters> {
-	scriptText: string | null;
+  scriptText: string | null;
 }
 
 export const useShowJSOperation = (): ShowJSOperationHook => {
-	const { t } = useTranslation();
+  const { t } = useTranslation();
 
-	const [isLoading, setIsLoading] = useState(false);
-	const [status, setStatus] = useState('');
-	const [errorMessage, setErrorMessage] = useState<string | null>(null);
-	const [files, setFiles] = useState<File[]>([]);
-	const [downloadUrl, setDownloadUrl] = useState<string | null>(null);
-	const [downloadFilename, setDownloadFilename] = useState('');
-	const [scriptText, setScriptText] = useState<string | null>(null);
+  const [isLoading, setIsLoading] = useState(false);
+  const [status, setStatus] = useState("");
+  const [errorMessage, setErrorMessage] = useState<string | null>(null);
+  const [files, setFiles] = useState<File[]>([]);
+  const [downloadUrl, setDownloadUrl] = useState<string | null>(null);
+  const [downloadFilename, setDownloadFilename] = useState("");
+  const [scriptText, setScriptText] = useState<string | null>(null);
 
-	const cancelRequested = useRef(false);
-	const previousUrl = useRef<string | null>(null);
+  const cancelRequested = useRef(false);
+  const previousUrl = useRef<string | null>(null);
 
-	const cleanupDownloadUrl = useCallback(() => {
-		if (previousUrl.current) {
-			URL.revokeObjectURL(previousUrl.current);
-			previousUrl.current = null;
-		}
-	}, []);
+  const cleanupDownloadUrl = useCallback(() => {
+    if (previousUrl.current) {
+      URL.revokeObjectURL(previousUrl.current);
+      previousUrl.current = null;
+    }
+  }, []);
 
-	const resetResults = useCallback(() => {
-		cancelRequested.current = false;
-		setScriptText(null);
-		setFiles([]);
-		cleanupDownloadUrl();
-		setDownloadUrl(null);
-		setDownloadFilename('');
-		setStatus('');
-		setErrorMessage(null);
-	}, [cleanupDownloadUrl]);
+  const resetResults = useCallback(() => {
+    cancelRequested.current = false;
+    setScriptText(null);
+    setFiles([]);
+    cleanupDownloadUrl();
+    setDownloadUrl(null);
+    setDownloadFilename("");
+    setStatus("");
+    setErrorMessage(null);
+  }, [cleanupDownloadUrl]);
 
-	const clearError = useCallback(() => {
-		setErrorMessage(null);
-	}, []);
+  const clearError = useCallback(() => {
+    setErrorMessage(null);
+  }, []);
 
-	const executeOperation = useCallback(
-		async (_params: ShowJSParameters, selectedFiles: StirlingFile[]) => {
-			if (selectedFiles.length === 0) {
-				setErrorMessage(t('noFileSelected', 'No files selected'));
-				return;
-			}
+  const executeOperation = useCallback(
+    async (_params: ShowJSParameters, selectedFiles: StirlingFile[]) => {
+      if (selectedFiles.length === 0) {
+        setErrorMessage(t("noFileSelected", "No files selected"));
+        return;
+      }
 
-			cancelRequested.current = false;
-			setIsLoading(true);
-			setStatus(t('showJS.processing', 'Extracting JavaScript...'));
-			setErrorMessage(null);
-			setScriptText(null);
-			setFiles([]);
-			cleanupDownloadUrl();
-			setDownloadUrl(null);
-			setDownloadFilename('');
+      cancelRequested.current = false;
+      setIsLoading(true);
+      setStatus(t("showJS.processing", "Extracting JavaScript..."));
+      setErrorMessage(null);
+      setScriptText(null);
+      setFiles([]);
+      cleanupDownloadUrl();
+      setDownloadUrl(null);
+      setDownloadFilename("");
 
-			try {
-				const file = selectedFiles[0];
-				const formData = new FormData();
-				formData.append('fileInput', file);
+      try {
+        const file = selectedFiles[0];
+        const formData = new FormData();
+        formData.append("fileInput", file);
 
-				const response = await apiClient.post('/api/v1/misc/show-javascript', formData, {
-					headers: { 'Content-Type': 'multipart/form-data' },
-					responseType: 'text',
-				});
+        const response = await apiClient.post(
+          "/api/v1/misc/show-javascript",
+          formData,
+          {
+            headers: { "Content-Type": "multipart/form-data" },
+            responseType: "text",
+          },
+        );
 
-				const text: string = typeof response.data === 'string' ? response.data : '';
-				setScriptText(text);
+        const text: string =
+          typeof response.data === "string" ? response.data : "";
+        setScriptText(text);
 
-				// Optional: prepare a downloadable file
-				const outFile = new File([text], (file.name?.replace(/\.[^.]+$/, '') || 'extracted') + '.js', {
-					type: 'application/javascript',
-				});
-				setFiles([outFile]);
-				const blobUrl = URL.createObjectURL(outFile);
-				previousUrl.current = blobUrl;
-				setDownloadUrl(blobUrl);
-				setDownloadFilename(outFile.name);
+        // Optional: prepare a downloadable file
+        const outFile = new File(
+          [text],
+          (file.name?.replace(/\.[^.]+$/, "") || "extracted") + ".js",
+          {
+            type: "application/javascript",
+          },
+        );
+        setFiles([outFile]);
+        const blobUrl = URL.createObjectURL(outFile);
+        previousUrl.current = blobUrl;
+        setDownloadUrl(blobUrl);
+        setDownloadFilename(outFile.name);
 
-				setStatus(t('showJS.done', 'JavaScript extracted'));
-			} catch (error: unknown) {
-				setErrorMessage(extractErrorMessage(error));
-				setStatus('');
-			} finally {
-				setIsLoading(false);
-			}
-		},
-		[t, cleanupDownloadUrl]
-	);
+        setStatus(t("showJS.done", "JavaScript extracted"));
+      } catch (error: unknown) {
+        setErrorMessage(extractErrorMessage(error));
+        setStatus("");
+      } finally {
+        setIsLoading(false);
+      }
+    },
+    [t, cleanupDownloadUrl],
+  );
 
-	const cancelOperation = useCallback(() => {
-		cancelRequested.current = true;
-		setIsLoading(false);
-		setStatus(t('operationCancelled', 'Operation cancelled'));
-	}, [t]);
+  const cancelOperation = useCallback(() => {
+    cancelRequested.current = true;
+    setIsLoading(false);
+    setStatus(t("operationCancelled", "Operation cancelled"));
+  }, [t]);
 
-	const undoOperation = useCallback(async () => {
-		// No-op for this tool
-		setStatus(t('nothingToUndo', 'Nothing to undo'));
-	}, [t]);
+  const undoOperation = useCallback(async () => {
+    // No-op for this tool
+    setStatus(t("nothingToUndo", "Nothing to undo"));
+  }, [t]);
 
-	return {
-		// State (align with ToolOperationHook)
-		files,
-		thumbnails: [],
-		isGeneratingThumbnails: false,
-		downloadUrl,
-		downloadFilename,
-		isLoading,
-		status,
-		errorMessage,
-		progress: null,
+  return {
+    // State (align with ToolOperationHook)
+    files,
+    thumbnails: [],
+    isGeneratingThumbnails: false,
+    downloadUrl,
+    downloadFilename,
+    isLoading,
+    status,
+    errorMessage,
+    progress: null,
 
-		// Custom state
-		scriptText,
+    // Custom state
+    scriptText,
 
-		// Actions
-		executeOperation,
-		resetResults,
-		clearError,
-		cancelOperation,
-		undoOperation,
-	};
+    // Actions
+    executeOperation,
+    resetResults,
+    clearError,
+    cancelOperation,
+    undoOperation,
+  };
 };
-
-
diff --git a/frontend/src/core/hooks/tools/showJS/useShowJSParameters.ts b/frontend/src/core/hooks/tools/showJS/useShowJSParameters.ts
index 67bcaca568..45e10e9ce2 100644
--- a/frontend/src/core/hooks/tools/showJS/useShowJSParameters.ts
+++ b/frontend/src/core/hooks/tools/showJS/useShowJSParameters.ts
@@ -1,5 +1,8 @@
-import { useBaseParameters, type BaseParametersHook } from '@app/hooks/tools/shared/useBaseParameters';
-import { BaseParameters } from '@app/types/parameters';
+import {
+  useBaseParameters,
+  type BaseParametersHook,
+} from "@app/hooks/tools/shared/useBaseParameters";
+import { BaseParameters } from "@app/types/parameters";
 
 export interface ShowJSParameters extends BaseParameters {
   // Extends BaseParameters - ready for future parameter additions if needed
@@ -9,13 +12,11 @@ export const defaultParameters: ShowJSParameters = {
   // No parameters needed
 };
 
-
 export type ShowJSParametersHook = BaseParametersHook<ShowJSParameters>;
 
 export const useShowJSParameters = (): ShowJSParametersHook => {
-	return useBaseParameters({
-		defaultParameters,
-		endpointName: 'show-javascript',
-	});
+  return useBaseParameters({
+    defaultParameters,
+    endpointName: "show-javascript",
+  });
 };
-
diff --git a/frontend/src/core/hooks/tools/sign/useSavedSignatures.ts b/frontend/src/core/hooks/tools/sign/useSavedSignatures.ts
index 98ce1f97c7..b14f8579fe 100644
--- a/frontend/src/core/hooks/tools/sign/useSavedSignatures.ts
+++ b/frontend/src/core/hooks/tools/sign/useSavedSignatures.ts
@@ -1,26 +1,38 @@
-import { useCallback, useEffect, useMemo, useState } from 'react';
-import { signatureStorageService, type StorageType } from '@app/services/signatureStorageService';
-import { useAppConfig } from '@app/contexts/AppConfigContext';
+import { useCallback, useEffect, useMemo, useState } from "react";
+import {
+  signatureStorageService,
+  type StorageType,
+} from "@app/services/signatureStorageService";
+import { useAppConfig } from "@app/contexts/AppConfigContext";
 import type {
   SavedSignature,
   SavedSignaturePayload,
   SavedSignatureType,
   SignatureScope,
-} from '@app/types/signature';
+} from "@app/types/signature";
 
 export const MAX_SAVED_SIGNATURES_BACKEND = 20; // Backend limit per user
 export const MAX_SAVED_SIGNATURES_LOCALSTORAGE = 10; // LocalStorage limit
 
-export type { SavedSignature, SavedSignaturePayload, SavedSignatureType, SignatureScope };
+export type {
+  SavedSignature,
+  SavedSignaturePayload,
+  SavedSignatureType,
+  SignatureScope,
+};
 
 export type AddSignatureResult =
   | { success: true; signature: SavedSignature }
-  | { success: false; reason: 'limit' | 'invalid' };
+  | { success: false; reason: "limit" | "invalid" };
 
-const isSupportedEnvironment = () => typeof window !== 'undefined' && typeof window.localStorage !== 'undefined';
+const isSupportedEnvironment = () =>
+  typeof window !== "undefined" && typeof window.localStorage !== "undefined";
 
 const generateId = () => {
-  if (typeof crypto !== 'undefined' && typeof crypto.randomUUID === 'function') {
+  if (
+    typeof crypto !== "undefined" &&
+    typeof crypto.randomUUID === "function"
+  ) {
     return crypto.randomUUID();
   }
   return `sig_${Date.now().toString(36)}_${Math.random().toString(36).slice(2, 8)}`;
@@ -44,7 +56,7 @@ export const useSavedSignatures = () => {
         setSavedSignatures(signatures);
         setStorageType(type);
       } catch (error) {
-        console.error('[useSavedSignatures] Failed to load signatures:', error);
+        console.error("[useSavedSignatures] Failed to load signatures:", error);
       } finally {
         setIsLoading(false);
       }
@@ -55,10 +67,12 @@ export const useSavedSignatures = () => {
 
   // Attempt migration from localStorage to backend when backend becomes available
   useEffect(() => {
-    if (storageType === 'backend' && !isLoading) {
-      signatureStorageService.migrateToBackend().then(result => {
+    if (storageType === "backend" && !isLoading) {
+      signatureStorageService.migrateToBackend().then((result) => {
         if (result.migrated > 0) {
-          console.log(`[useSavedSignatures] Migrated ${result.migrated} signatures to backend`);
+          console.log(
+            `[useSavedSignatures] Migrated ${result.migrated} signatures to backend`,
+          );
           // Reload after migration
           signatureStorageService.loadSignatures().then(setSavedSignatures);
         }
@@ -68,7 +82,7 @@ export const useSavedSignatures = () => {
 
   // Listen for storage events (for localStorage only)
   useEffect(() => {
-    if (!isSupportedEnvironment() || storageType !== 'localStorage') {
+    if (!isSupportedEnvironment() || storageType !== "localStorage") {
       return;
     }
 
@@ -76,83 +90,102 @@ export const useSavedSignatures = () => {
       signatureStorageService.loadSignatures().then(setSavedSignatures);
     };
 
-    window.addEventListener('storage', syncFromStorage);
-    return () => window.removeEventListener('storage', syncFromStorage);
+    window.addEventListener("storage", syncFromStorage);
+    return () => window.removeEventListener("storage", syncFromStorage);
   }, [storageType]);
 
   // Different limits for backend vs localStorage
-  const maxLimit = storageType === 'backend' ? MAX_SAVED_SIGNATURES_BACKEND : MAX_SAVED_SIGNATURES_LOCALSTORAGE;
+  const maxLimit =
+    storageType === "backend"
+      ? MAX_SAVED_SIGNATURES_BACKEND
+      : MAX_SAVED_SIGNATURES_LOCALSTORAGE;
   const isAtCapacity = savedSignatures.length >= maxLimit;
 
   const addSignature = useCallback(
-    async (payload: SavedSignaturePayload, label?: string, scope?: SignatureScope): Promise<AddSignatureResult> => {
+    async (
+      payload: SavedSignaturePayload,
+      label?: string,
+      scope?: SignatureScope,
+    ): Promise<AddSignatureResult> => {
       if (
-        (payload.type === 'text' && !payload.signerName.trim()) ||
-        ((payload.type === 'canvas' || payload.type === 'image') && !payload.dataUrl)
+        (payload.type === "text" && !payload.signerName.trim()) ||
+        ((payload.type === "canvas" || payload.type === "image") &&
+          !payload.dataUrl)
       ) {
-        return { success: false, reason: 'invalid' };
+        return { success: false, reason: "invalid" };
       }
 
       if (isAtCapacity) {
-        return { success: false, reason: 'limit' };
+        return { success: false, reason: "limit" };
       }
 
       const timestamp = Date.now();
       const newSignature: SavedSignature = {
         ...payload,
         id: generateId(),
-        label: (label || 'Signature').trim() || 'Signature',
-        scope: scope || (storageType === 'backend' ? 'personal' : 'localStorage'),
+        label: (label || "Signature").trim() || "Signature",
+        scope:
+          scope || (storageType === "backend" ? "personal" : "localStorage"),
         createdAt: timestamp,
         updatedAt: timestamp,
       };
 
       try {
         await signatureStorageService.saveSignature(newSignature);
-        setSavedSignatures(prev => [newSignature, ...prev]);
+        setSavedSignatures((prev) => [newSignature, ...prev]);
         return { success: true, signature: newSignature };
       } catch (error) {
-        console.error('[useSavedSignatures] Failed to save signature:', error);
-        return { success: false, reason: 'invalid' };
+        console.error("[useSavedSignatures] Failed to save signature:", error);
+        return { success: false, reason: "invalid" };
       }
     },
-    [savedSignatures.length, storageType]
+    [savedSignatures.length, storageType],
   );
 
   const removeSignature = useCallback(async (id: string) => {
     try {
       await signatureStorageService.deleteSignature(id);
-      setSavedSignatures(prev => prev.filter(entry => entry.id !== id));
+      setSavedSignatures((prev) => prev.filter((entry) => entry.id !== id));
     } catch (error) {
-      console.error('[useSavedSignatures] Failed to delete signature:', error);
+      console.error("[useSavedSignatures] Failed to delete signature:", error);
     }
   }, []);
 
-  const updateSignatureLabel = useCallback(async (id: string, nextLabel: string) => {
-    try {
-      await signatureStorageService.updateSignatureLabel(id, nextLabel);
-      // Reload signatures to get updated data from backend
-      if (storageType === 'backend') {
-        const signatures = await signatureStorageService.loadSignatures();
-        setSavedSignatures(signatures);
-      } else {
-        // For localStorage, update in place
-        setSavedSignatures(prev =>
-          prev.map(entry =>
-            entry.id === id
-              ? { ...entry, label: nextLabel.trim() || entry.label || 'Signature', updatedAt: Date.now() }
-              : entry
-          )
+  const updateSignatureLabel = useCallback(
+    async (id: string, nextLabel: string) => {
+      try {
+        await signatureStorageService.updateSignatureLabel(id, nextLabel);
+        // Reload signatures to get updated data from backend
+        if (storageType === "backend") {
+          const signatures = await signatureStorageService.loadSignatures();
+          setSavedSignatures(signatures);
+        } else {
+          // For localStorage, update in place
+          setSavedSignatures((prev) =>
+            prev.map((entry) =>
+              entry.id === id
+                ? {
+                    ...entry,
+                    label: nextLabel.trim() || entry.label || "Signature",
+                    updatedAt: Date.now(),
+                  }
+                : entry,
+            ),
+          );
+        }
+      } catch (error) {
+        console.error(
+          "[useSavedSignatures] Failed to update signature label:",
+          error,
         );
       }
-    } catch (error) {
-      console.error('[useSavedSignatures] Failed to update signature label:', error);
-    }
-  }, [storageType]);
+    },
+    [storageType],
+  );
 
   const replaceSignature = useCallback(
     async (id: string, payload: SavedSignaturePayload) => {
-      const existing = savedSignatures.find(s => s.id === id);
+      const existing = savedSignatures.find((s) => s.id === id);
       if (!existing) return;
 
       const updated: SavedSignature = {
@@ -163,20 +196,29 @@ export const useSavedSignatures = () => {
 
       try {
         await signatureStorageService.saveSignature(updated);
-        setSavedSignatures(prev => prev.map(entry => (entry.id === id ? updated : entry)));
+        setSavedSignatures((prev) =>
+          prev.map((entry) => (entry.id === id ? updated : entry)),
+        );
       } catch (error) {
-        console.error('[useSavedSignatures] Failed to replace signature:', error);
+        console.error(
+          "[useSavedSignatures] Failed to replace signature:",
+          error,
+        );
       }
     },
-    [savedSignatures]
+    [savedSignatures],
   );
 
   const clearSignatures = useCallback(async () => {
     try {
-      await Promise.all(savedSignatures.map(sig => signatureStorageService.deleteSignature(sig.id)));
+      await Promise.all(
+        savedSignatures.map((sig) =>
+          signatureStorageService.deleteSignature(sig.id),
+        ),
+      );
       setSavedSignatures([]);
     } catch (error) {
-      console.error('[useSavedSignatures] Failed to clear signatures:', error);
+      console.error("[useSavedSignatures] Failed to clear signatures:", error);
     }
   }, [savedSignatures]);
 
@@ -186,7 +228,7 @@ export const useSavedSignatures = () => {
         acc[entry.type] += 1;
         return acc;
       },
-      { canvas: 0, image: 0, text: 0 }
+      { canvas: 0, image: 0, text: 0 },
     );
   }, [savedSignatures]);
 
diff --git a/frontend/src/core/hooks/tools/sign/useSignOperation.ts b/frontend/src/core/hooks/tools/sign/useSignOperation.ts
index 9fc456fd48..bd92fdd758 100644
--- a/frontend/src/core/hooks/tools/sign/useSignOperation.ts
+++ b/frontend/src/core/hooks/tools/sign/useSignOperation.ts
@@ -1,39 +1,49 @@
-import { useTranslation } from 'react-i18next';
-import { useToolOperation, ToolOperationHook, ToolType } from '@app/hooks/tools/shared/useToolOperation';
-import { SignParameters, DEFAULT_PARAMETERS } from '@app/hooks/tools/sign/useSignParameters';
-import { createStandardErrorHandler } from '@app/utils/toolErrorHandler';
+import { useTranslation } from "react-i18next";
+import {
+  useToolOperation,
+  ToolOperationHook,
+  ToolType,
+} from "@app/hooks/tools/shared/useToolOperation";
+import {
+  SignParameters,
+  DEFAULT_PARAMETERS,
+} from "@app/hooks/tools/sign/useSignParameters";
+import { createStandardErrorHandler } from "@app/utils/toolErrorHandler";
 
 // Static configuration that can be used by both the hook and automation executor
-export const buildSignFormData = (params: SignParameters, file: File): FormData => {
+export const buildSignFormData = (
+  params: SignParameters,
+  file: File,
+): FormData => {
   const formData = new FormData();
-  formData.append('fileInput', file);
+  formData.append("fileInput", file);
 
   // Add signature data if available
   if (params.signatureData) {
-    formData.append('signatureData', params.signatureData);
+    formData.append("signatureData", params.signatureData);
   }
 
   // Add signature position and size
   if (params.signaturePosition) {
-    formData.append('x', params.signaturePosition.x.toString());
-    formData.append('y', params.signaturePosition.y.toString());
-    formData.append('width', params.signaturePosition.width.toString());
-    formData.append('height', params.signaturePosition.height.toString());
-    formData.append('page', params.signaturePosition.page.toString());
+    formData.append("x", params.signaturePosition.x.toString());
+    formData.append("y", params.signaturePosition.y.toString());
+    formData.append("width", params.signaturePosition.width.toString());
+    formData.append("height", params.signaturePosition.height.toString());
+    formData.append("page", params.signaturePosition.page.toString());
   }
 
   // Add signature type
-  formData.append('signatureType', params.signatureType || 'canvas');
+  formData.append("signatureType", params.signatureType || "canvas");
 
   // Add other parameters
   if (params.reason) {
-    formData.append('reason', params.reason);
+    formData.append("reason", params.reason);
   }
   if (params.location) {
-    formData.append('location', params.location);
+    formData.append("location", params.location);
   }
   if (params.signerName) {
-    formData.append('signerName', params.signerName);
+    formData.append("signerName", params.signerName);
   }
 
   return formData;
@@ -43,9 +53,9 @@ export const buildSignFormData = (params: SignParameters, file: File): FormData
 export const signOperationConfig = {
   toolType: ToolType.singleFile,
   buildFormData: buildSignFormData,
-  operationType: 'sign',
-  endpoint: '/api/v1/security/add-signature',
-  filePrefix: 'signed_',
+  operationType: "sign",
+  endpoint: "/api/v1/security/add-signature",
+  filePrefix: "signed_",
   defaultParameters: DEFAULT_PARAMETERS,
 } as const;
 
@@ -54,6 +64,8 @@ export const useSignOperation = (): ToolOperationHook<SignParameters> => {
 
   return useToolOperation<SignParameters>({
     ...signOperationConfig,
-    getErrorMessage: createStandardErrorHandler(t('sign.error.failed', 'An error occurred while signing the PDF.'))
+    getErrorMessage: createStandardErrorHandler(
+      t("sign.error.failed", "An error occurred while signing the PDF."),
+    ),
   });
 };
diff --git a/frontend/src/core/hooks/tools/sign/useSignParameters.ts b/frontend/src/core/hooks/tools/sign/useSignParameters.ts
index 126f5d5805..d06c18e1e3 100644
--- a/frontend/src/core/hooks/tools/sign/useSignParameters.ts
+++ b/frontend/src/core/hooks/tools/sign/useSignParameters.ts
@@ -1,4 +1,4 @@
-import { useBaseParameters } from '@app/hooks/tools/shared/useBaseParameters';
+import { useBaseParameters } from "@app/hooks/tools/shared/useBaseParameters";
 
 export interface SignaturePosition {
   x: number;
@@ -9,7 +9,7 @@ export interface SignaturePosition {
 }
 
 export interface SignParameters {
-  signatureType: 'image' | 'text' | 'canvas';
+  signatureType: "image" | "text" | "canvas";
   signatureData?: string; // Base64 encoded image or text content
   signaturePosition?: SignaturePosition;
   reason?: string;
@@ -18,18 +18,18 @@ export interface SignParameters {
   fontFamily?: string;
   fontSize?: number;
   textColor?: string;
-  textAlign?: 'left' | 'center' | 'right';
+  textAlign?: "left" | "center" | "right";
 }
 
 export const DEFAULT_PARAMETERS: SignParameters = {
-  signatureType: 'canvas',
-  reason: 'Document signing',
-  location: 'Digital',
-  signerName: '',
-  fontFamily: 'Helvetica',
+  signatureType: "canvas",
+  reason: "Document signing",
+  location: "Digital",
+  signerName: "",
+  fontFamily: "Helvetica",
   fontSize: 16,
-  textColor: '#000000',
-  textAlign: 'left',
+  textColor: "#000000",
+  textAlign: "left",
 };
 
 const validateSignParameters = (parameters: SignParameters): boolean => {
@@ -39,17 +39,27 @@ const validateSignParameters = (parameters: SignParameters): boolean => {
   // If signature position is set, validate it
   if (parameters.signaturePosition) {
     const pos = parameters.signaturePosition;
-    if (pos.x < 0 || pos.y < 0 || pos.width <= 0 || pos.height <= 0 || pos.page < 0) {
+    if (
+      pos.x < 0 ||
+      pos.y < 0 ||
+      pos.width <= 0 ||
+      pos.height <= 0 ||
+      pos.page < 0
+    ) {
       return false;
     }
   }
 
   // For image and canvas signatures, require signature data
-  if ((parameters.signatureType === 'image' || parameters.signatureType === 'canvas') && !parameters.signatureData) {
+  if (
+    (parameters.signatureType === "image" ||
+      parameters.signatureType === "canvas") &&
+    !parameters.signatureData
+  ) {
     return false;
   }
   // For text signatures, require signer name
-  if (parameters.signatureType === 'text' && !parameters.signerName) {
+  if (parameters.signatureType === "text" && !parameters.signerName) {
     return false;
   }
 
@@ -59,7 +69,7 @@ const validateSignParameters = (parameters: SignParameters): boolean => {
 export const useSignParameters = () => {
   return useBaseParameters<SignParameters>({
     defaultParameters: DEFAULT_PARAMETERS,
-    endpointName: 'add-signature',
+    endpointName: "add-signature",
     validateFn: validateSignParameters,
   });
 };
diff --git a/frontend/src/core/hooks/tools/singleLargePage/useSingleLargePageOperation.ts b/frontend/src/core/hooks/tools/singleLargePage/useSingleLargePageOperation.ts
index db34b93bdc..a57a26a7dc 100644
--- a/frontend/src/core/hooks/tools/singleLargePage/useSingleLargePageOperation.ts
+++ b/frontend/src/core/hooks/tools/singleLargePage/useSingleLargePageOperation.ts
@@ -1,10 +1,19 @@
-import { useTranslation } from 'react-i18next';
-import { ToolType, useToolOperation } from '@app/hooks/tools/shared/useToolOperation';
-import { createStandardErrorHandler } from '@app/utils/toolErrorHandler';
-import { SingleLargePageParameters, defaultParameters } from '@app/hooks/tools/singleLargePage/useSingleLargePageParameters';
+import { useTranslation } from "react-i18next";
+import {
+  ToolType,
+  useToolOperation,
+} from "@app/hooks/tools/shared/useToolOperation";
+import { createStandardErrorHandler } from "@app/utils/toolErrorHandler";
+import {
+  SingleLargePageParameters,
+  defaultParameters,
+} from "@app/hooks/tools/singleLargePage/useSingleLargePageParameters";
 
 // Static function that can be used by both the hook and automation executor
-export const buildSingleLargePageFormData = (_parameters: SingleLargePageParameters, file: File): FormData => {
+export const buildSingleLargePageFormData = (
+  _parameters: SingleLargePageParameters,
+  file: File,
+): FormData => {
   const formData = new FormData();
   formData.append("fileInput", file);
   return formData;
@@ -14,8 +23,8 @@ export const buildSingleLargePageFormData = (_parameters: SingleLargePageParamet
 export const singleLargePageOperationConfig = {
   toolType: ToolType.singleFile,
   buildFormData: buildSingleLargePageFormData,
-  operationType: 'pdfToSinglePage',
-  endpoint: '/api/v1/general/pdf-to-single-page',
+  operationType: "pdfToSinglePage",
+  endpoint: "/api/v1/general/pdf-to-single-page",
   defaultParameters,
 } as const;
 
@@ -24,6 +33,11 @@ export const useSingleLargePageOperation = () => {
 
   return useToolOperation<SingleLargePageParameters>({
     ...singleLargePageOperationConfig,
-    getErrorMessage: createStandardErrorHandler(t('pdfToSinglePage.error.failed', 'An error occurred while converting to single page.'))
+    getErrorMessage: createStandardErrorHandler(
+      t(
+        "pdfToSinglePage.error.failed",
+        "An error occurred while converting to single page.",
+      ),
+    ),
   });
 };
diff --git a/frontend/src/core/hooks/tools/singleLargePage/useSingleLargePageParameters.ts b/frontend/src/core/hooks/tools/singleLargePage/useSingleLargePageParameters.ts
index 7005ae062d..b5ea0cb005 100644
--- a/frontend/src/core/hooks/tools/singleLargePage/useSingleLargePageParameters.ts
+++ b/frontend/src/core/hooks/tools/singleLargePage/useSingleLargePageParameters.ts
@@ -1,5 +1,8 @@
-import { BaseParameters } from '@app/types/parameters';
-import { useBaseParameters, BaseParametersHook } from '@app/hooks/tools/shared/useBaseParameters';
+import { BaseParameters } from "@app/types/parameters";
+import {
+  useBaseParameters,
+  BaseParametersHook,
+} from "@app/hooks/tools/shared/useBaseParameters";
 
 export interface SingleLargePageParameters extends BaseParameters {
   // Extends BaseParameters - ready for future parameter additions if needed
@@ -9,11 +12,13 @@ export const defaultParameters: SingleLargePageParameters = {
   // No parameters needed
 };
 
-export type SingleLargePageParametersHook = BaseParametersHook<SingleLargePageParameters>;
+export type SingleLargePageParametersHook =
+  BaseParametersHook<SingleLargePageParameters>;
 
-export const useSingleLargePageParameters = (): SingleLargePageParametersHook => {
-  return useBaseParameters({
-    defaultParameters,
-    endpointName: 'pdf-to-single-page',
-  });
-};
\ No newline at end of file
+export const useSingleLargePageParameters =
+  (): SingleLargePageParametersHook => {
+    return useBaseParameters({
+      defaultParameters,
+      endpointName: "pdf-to-single-page",
+    });
+  };
diff --git a/frontend/src/core/hooks/tools/split/useSplitOperation.ts b/frontend/src/core/hooks/tools/split/useSplitOperation.ts
index ff7b85b422..bedf83d09e 100644
--- a/frontend/src/core/hooks/tools/split/useSplitOperation.ts
+++ b/frontend/src/core/hooks/tools/split/useSplitOperation.ts
@@ -1,13 +1,23 @@
-import { useCallback } from 'react';
-import { useTranslation } from 'react-i18next';
-import { ToolType, useToolOperation, ToolOperationConfig } from '@app/hooks/tools/shared/useToolOperation';
-import { createStandardErrorHandler } from '@app/utils/toolErrorHandler';
-import { SplitParameters, defaultParameters } from '@app/hooks/tools/split/useSplitParameters';
-import { SPLIT_METHODS } from '@app/constants/splitConstants';
-import { useToolResources } from '@app/hooks/tools/shared/useToolResources';
+import { useCallback } from "react";
+import { useTranslation } from "react-i18next";
+import {
+  ToolType,
+  useToolOperation,
+  ToolOperationConfig,
+} from "@app/hooks/tools/shared/useToolOperation";
+import { createStandardErrorHandler } from "@app/utils/toolErrorHandler";
+import {
+  SplitParameters,
+  defaultParameters,
+} from "@app/hooks/tools/split/useSplitParameters";
+import { SPLIT_METHODS } from "@app/constants/splitConstants";
+import { useToolResources } from "@app/hooks/tools/shared/useToolResources";
 
 // Static functions that can be used by both the hook and automation executor
-export const buildSplitFormData = (parameters: SplitParameters, file: File): FormData => {
+export const buildSplitFormData = (
+  parameters: SplitParameters,
+  file: File,
+): FormData => {
   const formData = new FormData();
 
   formData.append("fileInput", file);
@@ -23,8 +33,8 @@ export const buildSplitFormData = (parameters: SplitParameters, file: File): For
       formData.append("horizontalDivisions", parameters.hDiv);
       formData.append("verticalDivisions", parameters.vDiv);
       formData.append("merge", (parameters.merge ?? false).toString());
-      formData.append("splitMode", parameters.splitMode || 'SPLIT_ALL');
-      if (parameters.splitMode === 'CUSTOM' && parameters.customPages) {
+      formData.append("splitMode", parameters.splitMode || "SPLIT_ALL");
+      if (parameters.splitMode === "CUSTOM" && parameters.customPages) {
         formData.append("pageNumbers", parameters.customPages);
       }
       break;
@@ -42,17 +52,29 @@ export const buildSplitFormData = (parameters: SplitParameters, file: File): For
       break;
     case SPLIT_METHODS.BY_CHAPTERS:
       formData.append("bookmarkLevel", parameters.bookmarkLevel);
-      formData.append("includeMetadata", (parameters.includeMetadata ?? false).toString());
-      formData.append("allowDuplicates", (parameters.allowDuplicates ?? false).toString());
+      formData.append(
+        "includeMetadata",
+        (parameters.includeMetadata ?? false).toString(),
+      );
+      formData.append(
+        "allowDuplicates",
+        (parameters.allowDuplicates ?? false).toString(),
+      );
       break;
     case SPLIT_METHODS.BY_PAGE_DIVIDER:
-      formData.append("duplexMode", (parameters.duplexMode ?? false).toString());
+      formData.append(
+        "duplexMode",
+        (parameters.duplexMode ?? false).toString(),
+      );
       break;
     case SPLIT_METHODS.BY_POSTER:
-      formData.append("pageSize", parameters.pageSize || 'A4');
-      formData.append("xFactor", parameters.xFactor || '2');
-      formData.append("yFactor", parameters.yFactor || '2');
-      formData.append("rightToLeft", (parameters.rightToLeft ?? false).toString());
+      formData.append("pageSize", parameters.pageSize || "A4");
+      formData.append("xFactor", parameters.xFactor || "2");
+      formData.append("yFactor", parameters.yFactor || "2");
+      formData.append(
+        "rightToLeft",
+        (parameters.rightToLeft ?? false).toString(),
+      );
       break;
     default:
       throw new Error(`Unknown split method: ${method}`);
@@ -92,7 +114,7 @@ export const getSplitEndpoint = (parameters: SplitParameters): string => {
 export const splitOperationConfig = {
   toolType: ToolType.singleFile,
   buildFormData: buildSplitFormData,
-  operationType: 'split',
+  operationType: "split",
   endpoint: getSplitEndpoint,
   defaultParameters,
 } as const;
@@ -103,15 +125,20 @@ export const useSplitOperation = () => {
 
   // Custom response handler that extracts ZIP files
   // Can't add to exported config because it requires access to the zip code so must be part of the hook
-  const responseHandler = useCallback(async (blob: Blob, _originalFiles: File[]): Promise<File[]> => {
-    // Split operations return ZIP files with multiple PDF pages
-    return await extractZipFiles(blob);
-  }, [extractZipFiles]);
+  const responseHandler = useCallback(
+    async (blob: Blob, _originalFiles: File[]): Promise<File[]> => {
+      // Split operations return ZIP files with multiple PDF pages
+      return await extractZipFiles(blob);
+    },
+    [extractZipFiles],
+  );
 
   const splitConfig: ToolOperationConfig<SplitParameters> = {
     ...splitOperationConfig,
     responseHandler,
-    getErrorMessage: createStandardErrorHandler(t('split.error.failed', 'An error occurred while splitting the PDF.'))
+    getErrorMessage: createStandardErrorHandler(
+      t("split.error.failed", "An error occurred while splitting the PDF."),
+    ),
   };
 
   return useToolOperation(splitConfig);
diff --git a/frontend/src/core/hooks/tools/split/useSplitParameters.ts b/frontend/src/core/hooks/tools/split/useSplitParameters.ts
index d847ae45e7..b5e2dc3212 100644
--- a/frontend/src/core/hooks/tools/split/useSplitParameters.ts
+++ b/frontend/src/core/hooks/tools/split/useSplitParameters.ts
@@ -1,6 +1,13 @@
-import { SPLIT_METHODS, ENDPOINTS, type SplitMethod } from '@app/constants/splitConstants';
-import { BaseParameters } from '@app/types/parameters';
-import { useBaseParameters, BaseParametersHook } from '@app/hooks/tools/shared/useBaseParameters';
+import {
+  SPLIT_METHODS,
+  ENDPOINTS,
+  type SplitMethod,
+} from "@app/constants/splitConstants";
+import { BaseParameters } from "@app/types/parameters";
+import {
+  useBaseParameters,
+  BaseParametersHook,
+} from "@app/hooks/tools/shared/useBaseParameters";
 
 export interface SplitParameters extends BaseParameters {
   method: SplitMethod | null;
@@ -25,35 +32,38 @@ export type SplitParametersHook = BaseParametersHook<SplitParameters>;
 
 export const defaultParameters: SplitParameters = {
   method: null,
-  pages: '',
-  hDiv: '2',
-  vDiv: '2',
+  pages: "",
+  hDiv: "2",
+  vDiv: "2",
   merge: false,
-  splitValue: '',
-  bookmarkLevel: '1',
+  splitValue: "",
+  bookmarkLevel: "1",
   includeMetadata: false,
   allowDuplicates: false,
   duplexMode: false,
-  splitMode: 'SPLIT_ALL',
-  customPages: '',
-  pageSize: 'A4',
-  xFactor: '2',
-  yFactor: '2',
+  splitMode: "SPLIT_ALL",
+  customPages: "",
+  pageSize: "A4",
+  xFactor: "2",
+  yFactor: "2",
   rightToLeft: false,
 };
 
 export const useSplitParameters = (): SplitParametersHook => {
   return useBaseParameters({
     defaultParameters,
-    endpointName: (params) => params.method ? ENDPOINTS[params.method] : ENDPOINTS[SPLIT_METHODS.BY_PAGES],
+    endpointName: (params) =>
+      params.method
+        ? ENDPOINTS[params.method]
+        : ENDPOINTS[SPLIT_METHODS.BY_PAGES],
     validateFn: (params) => {
       switch (params.method) {
         case SPLIT_METHODS.BY_PAGES:
           return params.pages.trim() !== "";
         case SPLIT_METHODS.BY_SECTIONS:
           if (params.hDiv === "" || params.vDiv === "") return false;
-          if (params.splitMode === 'CUSTOM') {
-            return (params.customPages || '').trim() !== "";
+          if (params.splitMode === "CUSTOM") {
+            return (params.customPages || "").trim() !== "";
           }
           return true;
         case SPLIT_METHODS.BY_SIZE:
@@ -65,7 +75,11 @@ export const useSplitParameters = (): SplitParametersHook => {
         case SPLIT_METHODS.BY_PAGE_DIVIDER:
           return true; // No required parameters
         case SPLIT_METHODS.BY_POSTER:
-          return params.pageSize !== "" && params.xFactor !== "" && params.yFactor !== "";
+          return (
+            params.pageSize !== "" &&
+            params.xFactor !== "" &&
+            params.yFactor !== ""
+          );
         default:
           return false;
       }
diff --git a/frontend/src/core/hooks/tools/timestampPdf/useTimestampPdfOperation.ts b/frontend/src/core/hooks/tools/timestampPdf/useTimestampPdfOperation.ts
index 8f472faff3..b14f785574 100644
--- a/frontend/src/core/hooks/tools/timestampPdf/useTimestampPdfOperation.ts
+++ b/frontend/src/core/hooks/tools/timestampPdf/useTimestampPdfOperation.ts
@@ -1,13 +1,22 @@
-import { useTranslation } from 'react-i18next';
-import { ToolType, useToolOperation } from '@app/hooks/tools/shared/useToolOperation';
-import { createStandardErrorHandler } from '@app/utils/toolErrorHandler';
-import { TimestampPdfParameters, defaultParameters } from '@app/hooks/tools/timestampPdf/useTimestampPdfParameters';
+import { useTranslation } from "react-i18next";
+import {
+  ToolType,
+  useToolOperation,
+} from "@app/hooks/tools/shared/useToolOperation";
+import { createStandardErrorHandler } from "@app/utils/toolErrorHandler";
+import {
+  TimestampPdfParameters,
+  defaultParameters,
+} from "@app/hooks/tools/timestampPdf/useTimestampPdfParameters";
 
-export const buildTimestampPdfFormData = (parameters: TimestampPdfParameters, file: File): FormData => {
+export const buildTimestampPdfFormData = (
+  parameters: TimestampPdfParameters,
+  file: File,
+): FormData => {
   const formData = new FormData();
-  formData.append('fileInput', file);
+  formData.append("fileInput", file);
 
-  formData.append('tsaUrl', parameters.tsaUrl);
+  formData.append("tsaUrl", parameters.tsaUrl);
 
   return formData;
 };
@@ -15,8 +24,8 @@ export const buildTimestampPdfFormData = (parameters: TimestampPdfParameters, fi
 export const timestampPdfOperationConfig = {
   toolType: ToolType.singleFile,
   buildFormData: buildTimestampPdfFormData,
-  operationType: 'timestampPdf',
-  endpoint: '/api/v1/security/timestamp-pdf',
+  operationType: "timestampPdf",
+  endpoint: "/api/v1/security/timestamp-pdf",
   multiFileEndpoint: false,
   defaultParameters,
 } as const;
@@ -27,7 +36,10 @@ export const useTimestampPdfOperation = () => {
   return useToolOperation<TimestampPdfParameters>({
     ...timestampPdfOperationConfig,
     getErrorMessage: createStandardErrorHandler(
-      t('timestampPdf.error.failed', 'An error occurred while timestamping the PDF.')
+      t(
+        "timestampPdf.error.failed",
+        "An error occurred while timestamping the PDF.",
+      ),
     ),
   });
 };
diff --git a/frontend/src/core/hooks/tools/timestampPdf/useTimestampPdfParameters.ts b/frontend/src/core/hooks/tools/timestampPdf/useTimestampPdfParameters.ts
index dfc6c8803e..8eebe34e7d 100644
--- a/frontend/src/core/hooks/tools/timestampPdf/useTimestampPdfParameters.ts
+++ b/frontend/src/core/hooks/tools/timestampPdf/useTimestampPdfParameters.ts
@@ -1,15 +1,18 @@
-import { BaseParameters } from '@app/types/parameters';
-import { useBaseParameters, BaseParametersHook } from '@app/hooks/tools/shared/useBaseParameters';
+import { BaseParameters } from "@app/types/parameters";
+import {
+  useBaseParameters,
+  BaseParametersHook,
+} from "@app/hooks/tools/shared/useBaseParameters";
 
 // Fallback presets used only when AppConfig hasn't loaded yet.
 // The real presets are served by the backend via /api/v1/config/app-config
 // (field: timestampTsaPresets) — single source of truth.
 export const FALLBACK_TSA_PRESETS = [
-  { label: 'DigiCert', url: 'http://timestamp.digicert.com' },
-  { label: 'Sectigo', url: 'http://timestamp.sectigo.com' },
-  { label: 'SSL.com', url: 'http://ts.ssl.com' },
-  { label: 'FreeTSA', url: 'https://freetsa.org/tsr' },
-  { label: 'MeSign', url: 'http://tsa.mesign.com' },
+  { label: "DigiCert", url: "http://timestamp.digicert.com" },
+  { label: "Sectigo", url: "http://timestamp.sectigo.com" },
+  { label: "SSL.com", url: "http://ts.ssl.com" },
+  { label: "FreeTSA", url: "https://freetsa.org/tsr" },
+  { label: "MeSign", url: "http://tsa.mesign.com" },
 ] as const;
 
 export interface TimestampPdfParameters extends BaseParameters {
@@ -20,12 +23,13 @@ export const defaultParameters: TimestampPdfParameters = {
   tsaUrl: FALLBACK_TSA_PRESETS[0].url,
 };
 
-export type TimestampPdfParametersHook = BaseParametersHook<TimestampPdfParameters>;
+export type TimestampPdfParametersHook =
+  BaseParametersHook<TimestampPdfParameters>;
 
 export const useTimestampPdfParameters = (): TimestampPdfParametersHook => {
   return useBaseParameters({
     defaultParameters,
-    endpointName: 'timestamp-pdf',
+    endpointName: "timestamp-pdf",
     validateFn: (params) => {
       return params.tsaUrl.trim().length > 0;
     },
diff --git a/frontend/src/core/hooks/tools/unlockPdfForms/useUnlockPdfFormsOperation.ts b/frontend/src/core/hooks/tools/unlockPdfForms/useUnlockPdfFormsOperation.ts
index b2a45cd744..1e78d2d407 100644
--- a/frontend/src/core/hooks/tools/unlockPdfForms/useUnlockPdfFormsOperation.ts
+++ b/frontend/src/core/hooks/tools/unlockPdfForms/useUnlockPdfFormsOperation.ts
@@ -1,10 +1,19 @@
-import { useTranslation } from 'react-i18next';
-import { ToolType, useToolOperation } from '@app/hooks/tools/shared/useToolOperation';
-import { createStandardErrorHandler } from '@app/utils/toolErrorHandler';
-import { UnlockPdfFormsParameters, defaultParameters } from '@app/hooks/tools/unlockPdfForms/useUnlockPdfFormsParameters';
+import { useTranslation } from "react-i18next";
+import {
+  ToolType,
+  useToolOperation,
+} from "@app/hooks/tools/shared/useToolOperation";
+import { createStandardErrorHandler } from "@app/utils/toolErrorHandler";
+import {
+  UnlockPdfFormsParameters,
+  defaultParameters,
+} from "@app/hooks/tools/unlockPdfForms/useUnlockPdfFormsParameters";
 
 // Static function that can be used by both the hook and automation executor
-export const buildUnlockPdfFormsFormData = (_parameters: UnlockPdfFormsParameters, file: File): FormData => {
+export const buildUnlockPdfFormsFormData = (
+  _parameters: UnlockPdfFormsParameters,
+  file: File,
+): FormData => {
   const formData = new FormData();
   formData.append("fileInput", file);
   return formData;
@@ -14,8 +23,8 @@ export const buildUnlockPdfFormsFormData = (_parameters: UnlockPdfFormsParameter
 export const unlockPdfFormsOperationConfig = {
   toolType: ToolType.singleFile,
   buildFormData: buildUnlockPdfFormsFormData,
-  operationType: 'unlockPDFForms',
-  endpoint: '/api/v1/misc/unlock-pdf-forms',
+  operationType: "unlockPDFForms",
+  endpoint: "/api/v1/misc/unlock-pdf-forms",
   defaultParameters,
 } as const;
 
@@ -24,6 +33,11 @@ export const useUnlockPdfFormsOperation = () => {
 
   return useToolOperation<UnlockPdfFormsParameters>({
     ...unlockPdfFormsOperationConfig,
-    getErrorMessage: createStandardErrorHandler(t('unlockPDFForms.error.failed', 'An error occurred while unlocking PDF forms.'))
+    getErrorMessage: createStandardErrorHandler(
+      t(
+        "unlockPDFForms.error.failed",
+        "An error occurred while unlocking PDF forms.",
+      ),
+    ),
   });
 };
diff --git a/frontend/src/core/hooks/tools/unlockPdfForms/useUnlockPdfFormsParameters.ts b/frontend/src/core/hooks/tools/unlockPdfForms/useUnlockPdfFormsParameters.ts
index e4624bafd1..21f66cef6e 100644
--- a/frontend/src/core/hooks/tools/unlockPdfForms/useUnlockPdfFormsParameters.ts
+++ b/frontend/src/core/hooks/tools/unlockPdfForms/useUnlockPdfFormsParameters.ts
@@ -1,5 +1,8 @@
-import { BaseParameters } from '@app/types/parameters';
-import { useBaseParameters, BaseParametersHook } from '@app/hooks/tools/shared/useBaseParameters';
+import { BaseParameters } from "@app/types/parameters";
+import {
+  useBaseParameters,
+  BaseParametersHook,
+} from "@app/hooks/tools/shared/useBaseParameters";
 
 export interface UnlockPdfFormsParameters extends BaseParameters {
   // Extends BaseParameters - ready for future parameter additions if needed
@@ -9,11 +12,12 @@ export const defaultParameters: UnlockPdfFormsParameters = {
   // No parameters needed
 };
 
-export type UnlockPdfFormsParametersHook = BaseParametersHook<UnlockPdfFormsParameters>;
+export type UnlockPdfFormsParametersHook =
+  BaseParametersHook<UnlockPdfFormsParameters>;
 
 export const useUnlockPdfFormsParameters = (): UnlockPdfFormsParametersHook => {
   return useBaseParameters({
     defaultParameters,
-    endpointName: 'unlock-pdf-forms',
+    endpointName: "unlock-pdf-forms",
   });
-};
\ No newline at end of file
+};
diff --git a/frontend/src/core/hooks/tools/useFavoriteToolItems.ts b/frontend/src/core/hooks/tools/useFavoriteToolItems.ts
index 4678d44810..b1295110db 100644
--- a/frontend/src/core/hooks/tools/useFavoriteToolItems.ts
+++ b/frontend/src/core/hooks/tools/useFavoriteToolItems.ts
@@ -1,10 +1,10 @@
-import { useMemo } from 'react';
-import { ToolId } from '@app/types/toolId';
-import { ToolRegistryEntry } from '@app/data/toolsTaxonomy';
+import { useMemo } from "react";
+import { ToolId } from "@app/types/toolId";
+import { ToolRegistryEntry } from "@app/data/toolsTaxonomy";
 
 export function useFavoriteToolItems(
   favoriteTools: ToolId[],
-  toolRegistry: Partial<Record<ToolId, ToolRegistryEntry>>
+  toolRegistry: Partial<Record<ToolId, ToolRegistryEntry>>,
 ): Array<{ id: ToolId; tool: ToolRegistryEntry }> {
   return useMemo(() => {
     return favoriteTools
@@ -13,8 +13,12 @@ export function useFavoriteToolItems(
         return tool ? { id: toolId as ToolId, tool } : null;
       })
       .filter((x): x is { id: ToolId; tool: ToolRegistryEntry } => x !== null)
-      .filter(({ id, tool }) => Boolean(tool.component) || Boolean(tool.link) || id === 'read' || id === 'multiTool');
+      .filter(
+        ({ id, tool }) =>
+          Boolean(tool.component) ||
+          Boolean(tool.link) ||
+          id === "read" ||
+          id === "multiTool",
+      );
   }, [favoriteTools, toolRegistry]);
 }
-
-
diff --git a/frontend/src/core/hooks/tools/useToolPanelGeometry.ts b/frontend/src/core/hooks/tools/useToolPanelGeometry.ts
index 14e36ca431..aa7452a593 100644
--- a/frontend/src/core/hooks/tools/useToolPanelGeometry.ts
+++ b/frontend/src/core/hooks/tools/useToolPanelGeometry.ts
@@ -1,4 +1,4 @@
-import { useLayoutEffect, useState, RefObject, useRef } from 'react';
+import { useLayoutEffect, useState, RefObject, useRef } from "react";
 
 export interface ToolPanelGeometry {
   left: number;
@@ -35,17 +35,24 @@ export function useToolPanelGeometry({
       return;
     }
 
-    const rightRailEl = () => (rightRailRef?.current ?? null);
+    const rightRailEl = () => rightRailRef?.current ?? null;
 
     let rafId: number | null = null;
 
     const computeAndSetGeometry = () => {
       const rect = panelEl.getBoundingClientRect();
       const rail = rightRailEl();
-      const isRTL = typeof document !== 'undefined' && document.documentElement.dir === 'rtl';
+      const isRTL =
+        typeof document !== "undefined" &&
+        document.documentElement.dir === "rtl";
       const railRect = rail?.getBoundingClientRect();
-      const railIsOnRight = railRect ? railRect.right > window.innerWidth / 2 : false;
-      const rightOffset = railRect && railIsOnRight ? Math.max(0, window.innerWidth - railRect.right) : 0;
+      const railIsOnRight = railRect
+        ? railRect.right > window.innerWidth / 2
+        : false;
+      const rightOffset =
+        railRect && railIsOnRight
+          ? Math.max(0, window.innerWidth - railRect.right)
+          : 0;
       let width: number;
       let left: number;
 
@@ -53,7 +60,10 @@ export function useToolPanelGeometry({
         // In RTL, QuickAccessBar is on the right, so start after it (using rect.right as the right edge)
         const quickAccessRect = quickAccessRef.current?.getBoundingClientRect();
         const quickAccessWidth = quickAccessRect ? quickAccessRect.width : 0;
-        width = Math.max(360, window.innerWidth - quickAccessWidth - rightOffset);
+        width = Math.max(
+          360,
+          window.innerWidth - quickAccessWidth - rightOffset,
+        );
         left = quickAccessWidth;
       } else {
         width = Math.max(360, window.innerWidth - rect.left - rightOffset);
@@ -83,7 +93,7 @@ export function useToolPanelGeometry({
     computeAndSetGeometry();
 
     let resizeObserver: ResizeObserver | null = null;
-    if (typeof ResizeObserver !== 'undefined') {
+    if (typeof ResizeObserver !== "undefined") {
       resizeObserver = new ResizeObserver(() => scheduleUpdate());
       resizeObserver.observe(panelEl);
       if (quickAccessRef.current) {
@@ -100,10 +110,10 @@ export function useToolPanelGeometry({
     } else {
       // Fallback for environments without ResizeObserver
       const handleResize = () => scheduleUpdate();
-      window.addEventListener('resize', handleResize);
+      window.addEventListener("resize", handleResize);
       // Ensure cleanup of the fallback listener
       resizeObserver = {
-        disconnect: () => window.removeEventListener('resize', handleResize),
+        disconnect: () => window.removeEventListener("resize", handleResize),
       } as unknown as ResizeObserver;
     }
 
@@ -119,7 +129,7 @@ export function useToolPanelGeometry({
   // Secondary effect: (re)attach observers when refs' .current become available later
   useLayoutEffect(() => {
     if (!enabled) return;
-    if (typeof ResizeObserver === 'undefined') return;
+    if (typeof ResizeObserver === "undefined") return;
     const qa = quickAccessRef.current;
     const rail = rightRailRef?.current ?? null;
     if (!qa && !rail) return;
diff --git a/frontend/src/core/hooks/tools/useUserToolActivity.ts b/frontend/src/core/hooks/tools/useUserToolActivity.ts
index c3b7cbea95..f1dca4b657 100644
--- a/frontend/src/core/hooks/tools/useUserToolActivity.ts
+++ b/frontend/src/core/hooks/tools/useUserToolActivity.ts
@@ -1,8 +1,8 @@
-import { useState, useEffect, useCallback } from 'react';
-import { ToolId } from '@app/types/toolId';
+import { useState, useEffect, useCallback } from "react";
+import { ToolId } from "@app/types/toolId";
 
-const RECENT_TOOLS_KEY = 'stirlingpdf.recentTools';
-const FAVORITE_TOOLS_KEY = 'stirlingpdf.favoriteTools';
+const RECENT_TOOLS_KEY = "stirlingpdf.recentTools";
+const FAVORITE_TOOLS_KEY = "stirlingpdf.favoriteTools";
 
 export function useToolHistory() {
   const [recentTools, setRecentTools] = useState<ToolId[]>([]);
@@ -10,7 +10,7 @@ export function useToolHistory() {
 
   // Load from localStorage on mount
   useEffect(() => {
-    if (typeof window === 'undefined') {
+    if (typeof window === "undefined") {
       return;
     }
 
@@ -36,10 +36,9 @@ export function useToolHistory() {
     }
   }, []);
 
-
   // Toggle favorite status
   const toggleFavorite = useCallback((toolId: ToolId) => {
-    if (typeof window === 'undefined') {
+    if (typeof window === "undefined") {
       return;
     }
 
@@ -58,7 +57,7 @@ export function useToolHistory() {
     (toolId: ToolId): boolean => {
       return favoriteTools.includes(toolId);
     },
-    [favoriteTools]
+    [favoriteTools],
   );
 
   return {
diff --git a/frontend/src/core/hooks/tools/validateSignature/outputtedPDFSections/CenteredMessageSection.ts b/frontend/src/core/hooks/tools/validateSignature/outputtedPDFSections/CenteredMessageSection.ts
index 12abc2c62d..dfcb6b001b 100644
--- a/frontend/src/core/hooks/tools/validateSignature/outputtedPDFSections/CenteredMessageSection.ts
+++ b/frontend/src/core/hooks/tools/validateSignature/outputtedPDFSections/CenteredMessageSection.ts
@@ -1,6 +1,6 @@
-import { PdfiumFont, PdfiumPage, rgb } from '@app/services/pdfiumDocBuilder';
-import { wrapText } from '@app/hooks/tools/validateSignature/utils/pdfText';
-import { colorPalette } from '@app/hooks/tools/validateSignature/utils/pdfPalette';
+import { PdfiumFont, PdfiumPage, rgb } from "@app/services/pdfiumDocBuilder";
+import { wrapText } from "@app/hooks/tools/validateSignature/utils/pdfText";
+import { colorPalette } from "@app/hooks/tools/validateSignature/utils/pdfPalette";
 
 interface DrawCenteredMessageOptions {
   page: PdfiumPage;
@@ -28,7 +28,8 @@ export const drawCenteredMessage = ({
   const badgeFontSize = 10;
   const badgePaddingX = 14;
   const badgePaddingY = 6;
-  const badgeWidth = font.widthOfTextAtSize(text, badgeFontSize) + badgePaddingX * 2;
+  const badgeWidth =
+    font.widthOfTextAtSize(text, badgeFontSize) + badgePaddingX * 2;
   const badgeHeight = badgeFontSize + badgePaddingY * 2;
   const badgeX = marginX + (contentWidth - badgeWidth) / 2;
 
diff --git a/frontend/src/core/hooks/tools/validateSignature/outputtedPDFSections/FieldBoxSection.ts b/frontend/src/core/hooks/tools/validateSignature/outputtedPDFSections/FieldBoxSection.ts
index 7bcfd34041..6b8c12fcfe 100644
--- a/frontend/src/core/hooks/tools/validateSignature/outputtedPDFSections/FieldBoxSection.ts
+++ b/frontend/src/core/hooks/tools/validateSignature/outputtedPDFSections/FieldBoxSection.ts
@@ -1,6 +1,6 @@
-import { PdfiumFont, PdfiumPage } from '@app/services/pdfiumDocBuilder';
-import { wrapText } from '@app/hooks/tools/validateSignature/utils/pdfText';
-import { colorPalette } from '@app/hooks/tools/validateSignature/utils/pdfPalette';
+import { PdfiumFont, PdfiumPage } from "@app/services/pdfiumDocBuilder";
+import { wrapText } from "@app/hooks/tools/validateSignature/utils/pdfText";
+import { colorPalette } from "@app/hooks/tools/validateSignature/utils/pdfPalette";
 
 interface FieldBoxOptions {
   page: PdfiumPage;
@@ -37,9 +37,10 @@ export const drawFieldBox = ({
   });
 
   const boxTop = top - labelFontSize - 6;
-  const rawValue = value && value.trim().length > 0 ? value : '--';
+  const rawValue = value && value.trim().length > 0 ? value : "--";
   const lines = wrapText(rawValue, font, valueFontSize, width - boxPadding * 2);
-  const boxHeight = Math.max(valueLineHeight, lines.length * valueLineHeight) + boxPadding * 2;
+  const boxHeight =
+    Math.max(valueLineHeight, lines.length * valueLineHeight) + boxPadding * 2;
 
   page.drawRectangle({
     x,
diff --git a/frontend/src/core/hooks/tools/validateSignature/outputtedPDFSections/SignatureSection.ts b/frontend/src/core/hooks/tools/validateSignature/outputtedPDFSections/SignatureSection.ts
index cd926da8ba..285dc825a7 100644
--- a/frontend/src/core/hooks/tools/validateSignature/outputtedPDFSections/SignatureSection.ts
+++ b/frontend/src/core/hooks/tools/validateSignature/outputtedPDFSections/SignatureSection.ts
@@ -1,11 +1,14 @@
-import type { TFunction } from 'i18next';
-import { PdfiumFont, PdfiumPage } from '@app/services/pdfiumDocBuilder';
-import { SignatureValidationSignature } from '@app/types/validateSignature';
-import { drawFieldBox } from '@app/hooks/tools/validateSignature/outputtedPDFSections/FieldBoxSection';
-import { drawStatusBadge } from '@app/hooks/tools/validateSignature/outputtedPDFSections/StatusBadgeSection';
-import { computeSignatureStatus, statusKindToPdfColor } from '@app/hooks/tools/validateSignature/utils/signatureStatus';
-import { formatDate } from '@app/hooks/tools/validateSignature/utils/pdfText';
-import { colorPalette } from '@app/hooks/tools/validateSignature/utils/pdfPalette';
+import type { TFunction } from "i18next";
+import { PdfiumFont, PdfiumPage } from "@app/services/pdfiumDocBuilder";
+import { SignatureValidationSignature } from "@app/types/validateSignature";
+import { drawFieldBox } from "@app/hooks/tools/validateSignature/outputtedPDFSections/FieldBoxSection";
+import { drawStatusBadge } from "@app/hooks/tools/validateSignature/outputtedPDFSections/StatusBadgeSection";
+import {
+  computeSignatureStatus,
+  statusKindToPdfColor,
+} from "@app/hooks/tools/validateSignature/utils/signatureStatus";
+import { formatDate } from "@app/hooks/tools/validateSignature/utils/pdfText";
+import { colorPalette } from "@app/hooks/tools/validateSignature/utils/pdfPalette";
 
 interface DrawSignatureSectionOptions {
   page: PdfiumPage;
@@ -17,7 +20,7 @@ interface DrawSignatureSectionOptions {
   columnGap: number;
   font: PdfiumFont;
   fontBold: PdfiumFont;
-  t: TFunction<'translation'>;
+  t: TFunction<"translation">;
 }
 
 export const drawSignatureSection = ({
@@ -34,7 +37,7 @@ export const drawSignatureSection = ({
 }: DrawSignatureSectionOptions): number => {
   const columnWidth = (contentWidth - columnGap) / 2;
 
-  const heading = `${t('validateSignature.signature._value', 'Signature')} ${index + 1}`;
+  const heading = `${t("validateSignature.signature._value", "Signature")} ${index + 1}`;
   page.drawText(heading, {
     x: marginX,
     y: cursorY,
@@ -60,10 +63,22 @@ export const drawSignatureSection = ({
   let nextY = cursorY - 20;
 
   const signatureFields = [
-    { label: t('validateSignature.signer', 'Signer'), value: signature.signerName || '-' },
-    { label: t('validateSignature.date', 'Date'), value: formatDate(signature.signatureDate) },
-    { label: t('validateSignature.reason', 'Reason'), value: signature.reason || '-' },
-    { label: t('validateSignature.location', 'Location'), value: signature.location || '-' },
+    {
+      label: t("validateSignature.signer", "Signer"),
+      value: signature.signerName || "-",
+    },
+    {
+      label: t("validateSignature.date", "Date"),
+      value: formatDate(signature.signatureDate),
+    },
+    {
+      label: t("validateSignature.reason", "Reason"),
+      value: signature.reason || "-",
+    },
+    {
+      label: t("validateSignature.location", "Location"),
+      value: signature.location || "-",
+    },
   ];
 
   for (let i = 0; i < signatureFields.length; i += 2) {
@@ -109,30 +124,51 @@ export const drawSignatureSection = ({
   nextY -= 20;
 
   const certificateFields = [
-    { label: t('validateSignature.cert.issuer', 'Issuer'), value: signature.issuerDN || '-' },
-    { label: t('validateSignature.cert.subject', 'Subject'), value: signature.subjectDN || '-' },
-    { label: t('validateSignature.cert.serialNumber', 'Serial Number'), value: signature.serialNumber || '-' },
-    { label: t('validateSignature.cert.algorithm', 'Algorithm'), value: signature.signatureAlgorithm || '-' },
-    { label: t('validateSignature.cert.validFrom', 'Valid From'), value: formatDate(signature.validFrom) },
-    { label: t('validateSignature.cert.validUntil', 'Valid Until'), value: formatDate(signature.validUntil) },
     {
-      label: t('validateSignature.cert.keySize', 'Key Size'),
+      label: t("validateSignature.cert.issuer", "Issuer"),
+      value: signature.issuerDN || "-",
+    },
+    {
+      label: t("validateSignature.cert.subject", "Subject"),
+      value: signature.subjectDN || "-",
+    },
+    {
+      label: t("validateSignature.cert.serialNumber", "Serial Number"),
+      value: signature.serialNumber || "-",
+    },
+    {
+      label: t("validateSignature.cert.algorithm", "Algorithm"),
+      value: signature.signatureAlgorithm || "-",
+    },
+    {
+      label: t("validateSignature.cert.validFrom", "Valid From"),
+      value: formatDate(signature.validFrom),
+    },
+    {
+      label: t("validateSignature.cert.validUntil", "Valid Until"),
+      value: formatDate(signature.validUntil),
+    },
+    {
+      label: t("validateSignature.cert.keySize", "Key Size"),
       value:
         signature.keySize != null
-          ? `${signature.keySize} ${t('validateSignature.cert.bits', 'bits')}`
-          : '--',
+          ? `${signature.keySize} ${t("validateSignature.cert.bits", "bits")}`
+          : "--",
     },
-    { label: t('validateSignature.cert.version', 'Version'), value: signature.version || '-' },
     {
-      label: t('validateSignature.cert.keyUsage', 'Key Usage'),
+      label: t("validateSignature.cert.version", "Version"),
+      value: signature.version || "-",
+    },
+    {
+      label: t("validateSignature.cert.keyUsage", "Key Usage"),
       value:
         signature.keyUsages && signature.keyUsages.length > 0
-          ? signature.keyUsages.join(', ')
-          : '--',
+          ? signature.keyUsages.join(", ")
+          : "--",
     },
     {
-      label: t('validateSignature.cert.selfSigned', 'Self-Signed'),
-      value: signature.selfSigned ? t('yes', 'Yes') : t('no', 'No'),
+      label: t("validateSignature.cert.selfSigned", "Self-Signed"),
+      value: signature.selfSigned ? t("yes", "Yes") : t("no", "No"),
     },
   ];
 
diff --git a/frontend/src/core/hooks/tools/validateSignature/outputtedPDFSections/StatusBadgeSection.ts b/frontend/src/core/hooks/tools/validateSignature/outputtedPDFSections/StatusBadgeSection.ts
index ebb0dd29d8..abfc664d81 100644
--- a/frontend/src/core/hooks/tools/validateSignature/outputtedPDFSections/StatusBadgeSection.ts
+++ b/frontend/src/core/hooks/tools/validateSignature/outputtedPDFSections/StatusBadgeSection.ts
@@ -1,4 +1,4 @@
-import { PdfiumFont, PdfiumPage, rgb } from '@app/services/pdfiumDocBuilder';
+import { PdfiumFont, PdfiumPage, rgb } from "@app/services/pdfiumDocBuilder";
 
 interface StatusBadgeOptions {
   page: PdfiumPage;
@@ -10,7 +10,15 @@ interface StatusBadgeOptions {
   color: ReturnType<typeof rgb>;
 }
 
-export const drawStatusBadge = ({ page, font, fontBold, text, x, y, color }: StatusBadgeOptions): number => {
+export const drawStatusBadge = ({
+  page,
+  font,
+  fontBold,
+  text,
+  x,
+  y,
+  color,
+}: StatusBadgeOptions): number => {
   const paddingX = 14;
   const paddingY = 6;
   const fontSize = 10;
diff --git a/frontend/src/core/hooks/tools/validateSignature/outputtedPDFSections/SummarySection.ts b/frontend/src/core/hooks/tools/validateSignature/outputtedPDFSections/SummarySection.ts
index c9f013f57b..3e3170e751 100644
--- a/frontend/src/core/hooks/tools/validateSignature/outputtedPDFSections/SummarySection.ts
+++ b/frontend/src/core/hooks/tools/validateSignature/outputtedPDFSections/SummarySection.ts
@@ -1,10 +1,17 @@
-import type { TFunction } from 'i18next';
-import { PdfiumFont, PdfiumImage, PdfiumPage } from '@app/services/pdfiumDocBuilder';
-import { SignatureValidationReportEntry } from '@app/types/validateSignature';
-import { drawFieldBox } from '@app/hooks/tools/validateSignature/outputtedPDFSections/FieldBoxSection';
-import { drawThumbnailImage, drawThumbnailPlaceholder } from '@app/hooks/tools/validateSignature/outputtedPDFSections/ThumbnailSection';
-import { colorPalette } from '@app/hooks/tools/validateSignature/utils/pdfPalette';
-import { formatFileSize } from '@app/hooks/tools/validateSignature/utils/pdfText';
+import type { TFunction } from "i18next";
+import {
+  PdfiumFont,
+  PdfiumImage,
+  PdfiumPage,
+} from "@app/services/pdfiumDocBuilder";
+import { SignatureValidationReportEntry } from "@app/types/validateSignature";
+import { drawFieldBox } from "@app/hooks/tools/validateSignature/outputtedPDFSections/FieldBoxSection";
+import {
+  drawThumbnailImage,
+  drawThumbnailPlaceholder,
+} from "@app/hooks/tools/validateSignature/outputtedPDFSections/ThumbnailSection";
+import { colorPalette } from "@app/hooks/tools/validateSignature/utils/pdfPalette";
+import { formatFileSize } from "@app/hooks/tools/validateSignature/utils/pdfText";
 
 interface DrawSummarySectionOptions {
   page: PdfiumPage;
@@ -16,9 +23,9 @@ interface DrawSummarySectionOptions {
   contentWidth: number;
   columnGap: number;
   statusText: string;
-  statusColor: (typeof colorPalette)['success'];
+  statusColor: (typeof colorPalette)["success"];
   loadThumbnail: (url: string) => Promise<{ image: PdfiumImage } | null>;
-  t: TFunction<'translation'>;
+  t: TFunction<"translation">;
 }
 
 export const drawSummarySection = async ({
@@ -49,7 +56,7 @@ export const drawSummarySection = async ({
 
   const latestSignatureLabel = latestSignatureTimestamp.length
     ? new Date(Math.max(...latestSignatureTimestamp)).toLocaleString()
-    : '--';
+    : "--";
 
   const titleBaseline = summaryTop - 12 - titleFontSize;
   page.drawText(entry.fileName, {
@@ -60,7 +67,10 @@ export const drawSummarySection = async ({
     color: colorPalette.textPrimary,
   });
 
-  const subtitle = t('validateSignature.report.shortTitle', 'Signature Summary');
+  const subtitle = t(
+    "validateSignature.report.shortTitle",
+    "Signature Summary",
+  );
   const subtitleBaseline = titleBaseline - subtitleFontSize - 6;
   page.drawText(subtitle, {
     x: summaryX,
@@ -77,12 +87,30 @@ export const drawSummarySection = async ({
     }>
   > = [
     [
-      { label: t('validateSignature.report.fields.fileSize', 'File Size'), value: formatFileSize(entry.fileSize) },
-      { label: t('validateSignature.report.fields.created', 'Created'), value: entry.createdAtLabel ?? '--' },
+      {
+        label: t("validateSignature.report.fields.fileSize", "File Size"),
+        value: formatFileSize(entry.fileSize),
+      },
+      {
+        label: t("validateSignature.report.fields.created", "Created"),
+        value: entry.createdAtLabel ?? "--",
+      },
     ],
     [
-      { label: t('validateSignature.report.fields.signatureDate', 'Signature Date'), value: latestSignatureLabel },
-      { label: t('validateSignature.report.fields.signatureCount', 'Total Signatures'), value: entry.signatures.length.toString() },
+      {
+        label: t(
+          "validateSignature.report.fields.signatureDate",
+          "Signature Date",
+        ),
+        value: latestSignatureLabel,
+      },
+      {
+        label: t(
+          "validateSignature.report.fields.signatureCount",
+          "Total Signatures",
+        ),
+        value: entry.signatures.length.toString(),
+      },
     ],
   ];
 
@@ -94,7 +122,9 @@ export const drawSummarySection = async ({
     const singleColumn = fields.length === 1;
     fields.forEach((field, index) => {
       const fieldWidth = singleColumn ? summaryWidth : summaryColumnWidth;
-      const x = singleColumn ? summaryX : summaryX + index * (summaryColumnWidth + columnGap);
+      const x = singleColumn
+        ? summaryX
+        : summaryX + index * (summaryColumnWidth + columnGap);
       const fieldHeight = drawFieldBox({
         page,
         font,
@@ -131,12 +161,33 @@ export const drawSummarySection = async ({
         borderColor: colorPalette.boxBorder,
         borderWidth: 1,
       });
-      drawThumbnailImage(page, thumbnail.image, thumbX, thumbTop, thumbnailWidth, thumbnailHeight);
+      drawThumbnailImage(
+        page,
+        thumbnail.image,
+        thumbX,
+        thumbTop,
+        thumbnailWidth,
+        thumbnailHeight,
+      );
     } else {
-      drawThumbnailPlaceholder(page, fontBold, thumbX, thumbTop, thumbnailWidth, thumbnailHeight);
+      drawThumbnailPlaceholder(
+        page,
+        fontBold,
+        thumbX,
+        thumbTop,
+        thumbnailWidth,
+        thumbnailHeight,
+      );
     }
   } else {
-    drawThumbnailPlaceholder(page, fontBold, thumbX, thumbTop, thumbnailWidth, thumbnailHeight);
+    drawThumbnailPlaceholder(
+      page,
+      fontBold,
+      thumbX,
+      thumbTop,
+      thumbnailWidth,
+      thumbnailHeight,
+    );
   }
 
   const summarySectionHeight = Math.max(thumbnailHeight, rightContentHeight);
diff --git a/frontend/src/core/hooks/tools/validateSignature/outputtedPDFSections/ThumbnailSection.ts b/frontend/src/core/hooks/tools/validateSignature/outputtedPDFSections/ThumbnailSection.ts
index e10ada3f04..3be1a4b899 100644
--- a/frontend/src/core/hooks/tools/validateSignature/outputtedPDFSections/ThumbnailSection.ts
+++ b/frontend/src/core/hooks/tools/validateSignature/outputtedPDFSections/ThumbnailSection.ts
@@ -1,5 +1,9 @@
-import { PdfiumFont, PdfiumPage, PdfiumImage } from '@app/services/pdfiumDocBuilder';
-import { colorPalette } from '@app/hooks/tools/validateSignature/utils/pdfPalette';
+import {
+  PdfiumFont,
+  PdfiumPage,
+  PdfiumImage,
+} from "@app/services/pdfiumDocBuilder";
+import { colorPalette } from "@app/hooks/tools/validateSignature/utils/pdfPalette";
 
 export const drawThumbnailPlaceholder = (
   page: PdfiumPage,
@@ -7,7 +11,7 @@ export const drawThumbnailPlaceholder = (
   x: number,
   top: number,
   width: number,
-  height: number
+  height: number,
 ) => {
   page.drawRectangle({
     x,
@@ -19,7 +23,7 @@ export const drawThumbnailPlaceholder = (
     borderWidth: 1,
   });
 
-  const label = 'PDF';
+  const label = "PDF";
   const labelSize = 22;
   const labelWidth = fontBold.widthOfTextAtSize(label, labelSize);
   const labelX = x + (width - labelWidth) / 2;
@@ -40,7 +44,7 @@ export const drawThumbnailImage = (
   x: number,
   top: number,
   width: number,
-  height: number
+  height: number,
 ) => {
   const scaled = image.scaleToFit(width - 16, height - 16);
   const offsetX = x + (width - scaled.width) / 2;
diff --git a/frontend/src/core/hooks/tools/validateSignature/signatureReportPdf.ts b/frontend/src/core/hooks/tools/validateSignature/signatureReportPdf.ts
index 9d37fc194c..1dbd47fbde 100644
--- a/frontend/src/core/hooks/tools/validateSignature/signatureReportPdf.ts
+++ b/frontend/src/core/hooks/tools/validateSignature/signatureReportPdf.ts
@@ -1,13 +1,20 @@
-import { PdfiumDocument, PdfiumPage, StandardFonts } from '@app/services/pdfiumDocBuilder';
-import type { TFunction } from 'i18next';
-import { SignatureValidationReportEntry } from '@app/types/validateSignature';
-import { REPORT_PDF_FILENAME } from '@app/hooks/tools/validateSignature/utils/signatureUtils';
-import { colorPalette } from '@app/hooks/tools/validateSignature/utils/pdfPalette';
-import { startReportPage, createThumbnailLoader } from '@app/hooks/tools/validateSignature/utils/pdfPageHelpers';
-import { deriveEntryStatus } from '@app/hooks/tools/validateSignature/utils/reportStatus';
-import { drawCenteredMessage } from '@app/hooks/tools/validateSignature/outputtedPDFSections/CenteredMessageSection';
-import { drawSummarySection } from '@app/hooks/tools/validateSignature/outputtedPDFSections/SummarySection';
-import { drawSignatureSection } from '@app/hooks/tools/validateSignature/outputtedPDFSections/SignatureSection';
+import {
+  PdfiumDocument,
+  PdfiumPage,
+  StandardFonts,
+} from "@app/services/pdfiumDocBuilder";
+import type { TFunction } from "i18next";
+import { SignatureValidationReportEntry } from "@app/types/validateSignature";
+import { REPORT_PDF_FILENAME } from "@app/hooks/tools/validateSignature/utils/signatureUtils";
+import { colorPalette } from "@app/hooks/tools/validateSignature/utils/pdfPalette";
+import {
+  startReportPage,
+  createThumbnailLoader,
+} from "@app/hooks/tools/validateSignature/utils/pdfPageHelpers";
+import { deriveEntryStatus } from "@app/hooks/tools/validateSignature/utils/reportStatus";
+import { drawCenteredMessage } from "@app/hooks/tools/validateSignature/outputtedPDFSections/CenteredMessageSection";
+import { drawSummarySection } from "@app/hooks/tools/validateSignature/outputtedPDFSections/SummarySection";
+import { drawSignatureSection } from "@app/hooks/tools/validateSignature/outputtedPDFSections/SignatureSection";
 
 const PAGE_WIDTH = 612;
 const PAGE_HEIGHT = 792;
@@ -16,7 +23,12 @@ const MARGIN_Y = 22;
 const CONTENT_WIDTH = PAGE_WIDTH - MARGIN_X * 2;
 const COLUMN_GAP = 18;
 
-const drawDivider = (page: PdfiumPage, marginX: number, contentWidth: number, y: number) => {
+const drawDivider = (
+  page: PdfiumPage,
+  marginX: number,
+  contentWidth: number,
+  y: number,
+) => {
   page.drawLine({
     start: { x: marginX, y },
     end: { x: marginX + contentWidth, y },
@@ -27,7 +39,7 @@ const drawDivider = (page: PdfiumPage, marginX: number, contentWidth: number, y:
 
 export const createReportPdf = async (
   entries: SignatureValidationReportEntry[],
-  t: TFunction<'translation'>
+  t: TFunction<"translation">,
 ): Promise<File> => {
   const doc = await PdfiumDocument.create();
   const font = await doc.embedFont(StandardFonts.Helvetica);
@@ -35,7 +47,10 @@ export const createReportPdf = async (
   const loadThumbnail = createThumbnailLoader(doc);
 
   for (const entry of entries) {
-    const { text: statusText, color: statusColor } = deriveEntryStatus(entry, t);
+    const { text: statusText, color: statusColor } = deriveEntryStatus(
+      entry,
+      t,
+    );
 
     let { page, cursorY } = startReportPage({
       doc,
@@ -75,7 +90,7 @@ export const createReportPdf = async (
         page,
         font,
         fontBold,
-        text: t('validateSignature.status.invalid', 'Invalid'),
+        text: t("validateSignature.status.invalid", "Invalid"),
         description: entry.error,
         marginX: MARGIN_X,
         contentWidth: CONTENT_WIDTH,
@@ -90,8 +105,11 @@ export const createReportPdf = async (
         page,
         font,
         fontBold,
-        text: t('validateSignature.noSignaturesShort', 'No signatures'),
-        description: t('validateSignature.noSignatures', 'No digital signatures found in this document'),
+        text: t("validateSignature.noSignaturesShort", "No signatures"),
+        description: t(
+          "validateSignature.noSignatures",
+          "No digital signatures found in this document",
+        ),
         marginX: MARGIN_X,
         contentWidth: CONTENT_WIDTH,
         cursorY,
@@ -134,5 +152,7 @@ export const createReportPdf = async (
 
   const pdfBytes = await doc.save();
   const copy = pdfBytes.slice();
-  return new File([copy.buffer], REPORT_PDF_FILENAME, { type: 'application/pdf' });
+  return new File([copy.buffer], REPORT_PDF_FILENAME, {
+    type: "application/pdf",
+  });
 };
diff --git a/frontend/src/core/hooks/tools/validateSignature/useValidateSignatureOperation.ts b/frontend/src/core/hooks/tools/validateSignature/useValidateSignatureOperation.ts
index cac9b158ab..bc7272b222 100644
--- a/frontend/src/core/hooks/tools/validateSignature/useValidateSignatureOperation.ts
+++ b/frontend/src/core/hooks/tools/validateSignature/useValidateSignatureOperation.ts
@@ -1,231 +1,278 @@
-import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
-import { useTranslation } from 'react-i18next';
-import apiClient from '@app/services/apiClient';
-import { useFileContext } from '@app/contexts/file/fileHooks';
-import { ToolOperationHook } from '@app/hooks/tools/shared/useToolOperation';
-import type { StirlingFile } from '@app/types/fileContext';
-import { extractErrorMessage } from '@app/utils/toolErrorHandler';
+import { useCallback, useEffect, useMemo, useRef, useState } from "react";
+import { useTranslation } from "react-i18next";
+import apiClient from "@app/services/apiClient";
+import { useFileContext } from "@app/contexts/file/fileHooks";
+import { ToolOperationHook } from "@app/hooks/tools/shared/useToolOperation";
+import type { StirlingFile } from "@app/types/fileContext";
+import { extractErrorMessage } from "@app/utils/toolErrorHandler";
 import {
   SignatureValidationBackendResult,
   SignatureValidationFileResult,
   SignatureValidationReportEntry,
-} from '@app/types/validateSignature';
-import { ValidateSignatureParameters } from '@app/hooks/tools/validateSignature/useValidateSignatureParameters';
-import { buildReportEntries } from '@app/hooks/tools/validateSignature/utils/signatureReportBuilder';
-import { createReportPdf } from '@app/hooks/tools/validateSignature/signatureReportPdf';
-import { createCsvFile as buildCsvFile } from '@app/hooks/tools/validateSignature/utils/signatureCsv';
-import { normalizeBackendResult, RESULT_JSON_FILENAME } from '@app/hooks/tools/validateSignature/utils/signatureUtils';
+} from "@app/types/validateSignature";
+import { ValidateSignatureParameters } from "@app/hooks/tools/validateSignature/useValidateSignatureParameters";
+import { buildReportEntries } from "@app/hooks/tools/validateSignature/utils/signatureReportBuilder";
+import { createReportPdf } from "@app/hooks/tools/validateSignature/signatureReportPdf";
+import { createCsvFile as buildCsvFile } from "@app/hooks/tools/validateSignature/utils/signatureCsv";
+import {
+  normalizeBackendResult,
+  RESULT_JSON_FILENAME,
+} from "@app/hooks/tools/validateSignature/utils/signatureUtils";
 
 export interface ValidateSignatureOperationHook extends ToolOperationHook<ValidateSignatureParameters> {
   results: SignatureValidationReportEntry[];
 }
 
-export const useValidateSignatureOperation = (): ValidateSignatureOperationHook => {
-  const { t } = useTranslation();
-  const { selectors } = useFileContext();
-  const [isLoading, setIsLoading] = useState(false);
-  const [status, setStatus] = useState('');
-  const [errorMessage, setErrorMessage] = useState<string | null>(null);
-  const [files, setFiles] = useState<File[]>([]);
-  const [downloadUrl, setDownloadUrl] = useState<string | null>(null);
-  const [downloadFilename, setDownloadFilename] = useState('');
-  const [results, setResults] = useState<SignatureValidationReportEntry[]>([]);
+export const useValidateSignatureOperation =
+  (): ValidateSignatureOperationHook => {
+    const { t } = useTranslation();
+    const { selectors } = useFileContext();
+    const [isLoading, setIsLoading] = useState(false);
+    const [status, setStatus] = useState("");
+    const [errorMessage, setErrorMessage] = useState<string | null>(null);
+    const [files, setFiles] = useState<File[]>([]);
+    const [downloadUrl, setDownloadUrl] = useState<string | null>(null);
+    const [downloadFilename, setDownloadFilename] = useState("");
+    const [results, setResults] = useState<SignatureValidationReportEntry[]>(
+      [],
+    );
 
-  const cancelRequested = useRef(false);
-  const previousUrl = useRef<string | null>(null);
+    const cancelRequested = useRef(false);
+    const previousUrl = useRef<string | null>(null);
 
-  const cleanupDownloadUrl = useCallback(() => {
-    if (previousUrl.current) {
-      URL.revokeObjectURL(previousUrl.current);
-      previousUrl.current = null;
-    }
-  }, []);
-
-  const resetResults = useCallback(() => {
-    cancelRequested.current = false;
-    setResults([]);
-    setFiles([]);
-    cleanupDownloadUrl();
-    setDownloadUrl(null);
-    setDownloadFilename('');
-    setStatus('');
-    setErrorMessage(null);
-  }, [cleanupDownloadUrl]);
-
-  const clearError = useCallback(() => {
-    setErrorMessage(null);
-  }, []);
-
-  const executeOperation = useCallback(
-    async (params: ValidateSignatureParameters, selectedFiles: StirlingFile[]) => {
-      if (selectedFiles.length === 0) {
-        setErrorMessage(t('noFileSelected', 'No files selected'));
-        return;
+    const cleanupDownloadUrl = useCallback(() => {
+      if (previousUrl.current) {
+        URL.revokeObjectURL(previousUrl.current);
+        previousUrl.current = null;
       }
+    }, []);
 
+    const resetResults = useCallback(() => {
       cancelRequested.current = false;
-      setIsLoading(true);
-      setStatus(t('validateSignature.processing', 'Validating signatures...'));
-      setErrorMessage(null);
       setResults([]);
       setFiles([]);
       cleanupDownloadUrl();
       setDownloadUrl(null);
-      setDownloadFilename('');
+      setDownloadFilename("");
+      setStatus("");
+      setErrorMessage(null);
+    }, [cleanupDownloadUrl]);
 
-      try {
-        const aggregated: SignatureValidationFileResult[] = [];
+    const clearError = useCallback(() => {
+      setErrorMessage(null);
+    }, []);
 
-        for (const file of selectedFiles) {
-          if (cancelRequested.current) {
-            break;
-          }
-
-          const formData = new FormData();
-          formData.append('fileInput', file);
-          if (params.certFile) {
-            formData.append('certFile', params.certFile);
-          }
-
-          try {
-            const response = await apiClient.post('/api/v1/security/validate-signature', formData, {
-              headers: { 'Content-Type': 'multipart/form-data' },
-            });
-
-            const data = Array.isArray(response.data)
-              ? (response.data as SignatureValidationBackendResult[])
-              : [];
-            const signatures = data.map((item, index) => normalizeBackendResult(item, file, index));
-
-            aggregated.push({
-              fileId: file.fileId,
-              fileName: file.name,
-              signatures,
-              error: null,
-              fileSize: file.size ?? null,
-              lastModified: file.lastModified ?? null,
-            });
-          } catch (error) {
-            aggregated.push({
-              fileId: file.fileId,
-              fileName: file.name,
-              signatures: [],
-              error: extractErrorMessage(error),
-              fileSize: file.size ?? null,
-              lastModified: file.lastModified ?? null,
-            });
-          }
+    const executeOperation = useCallback(
+      async (
+        params: ValidateSignatureParameters,
+        selectedFiles: StirlingFile[],
+      ) => {
+        if (selectedFiles.length === 0) {
+          setErrorMessage(t("noFileSelected", "No files selected"));
+          return;
         }
 
-        if (!cancelRequested.current) {
-          const summaryTimestamp = Date.now();
-          const enrichedEntries = buildReportEntries({
-            results: aggregated,
-            selectors,
-            generatedAt: summaryTimestamp,
-            t,
-          });
+        cancelRequested.current = false;
+        setIsLoading(true);
+        setStatus(
+          t("validateSignature.processing", "Validating signatures..."),
+        );
+        setErrorMessage(null);
+        setResults([]);
+        setFiles([]);
+        cleanupDownloadUrl();
+        setDownloadUrl(null);
+        setDownloadFilename("");
 
-          setResults(enrichedEntries);
+        try {
+          const aggregated: SignatureValidationFileResult[] = [];
 
-          if (enrichedEntries.length > 0) {
-            const json = JSON.stringify(enrichedEntries, null, 2);
-            const resultFile = new File([json], RESULT_JSON_FILENAME, { type: 'application/json' });
-            const csvFile = buildCsvFile(enrichedEntries);
+          for (const file of selectedFiles) {
+            if (cancelRequested.current) {
+              break;
+            }
 
-            setFiles([resultFile, csvFile]);
+            const formData = new FormData();
+            formData.append("fileInput", file);
+            if (params.certFile) {
+              formData.append("certFile", params.certFile);
+            }
 
-            (async () => {
-              try {
-                const pdfFile = await createReportPdf(enrichedEntries, t);
-                setFiles((prev) => [pdfFile, ...prev.filter((f) => !f.name.toLowerCase().endsWith('.pdf'))]);
-                setDownloadFilename(pdfFile.name);
-                cleanupDownloadUrl();
-                const blobUrl = URL.createObjectURL(pdfFile);
-                previousUrl.current = blobUrl;
-                setDownloadUrl(blobUrl);
-              } catch (err) {
-                console.warn('[validateSignature] PDF report generation failed', err);
-                setErrorMessage((prev) =>
-                  prev ??
-                  t(
-                    'validateSignature.error.reportGeneration',
-                    'Could not generate the PDF report. JSON and CSV are available.'
-                  )
-                );
-              }
-            })();
+            try {
+              const response = await apiClient.post(
+                "/api/v1/security/validate-signature",
+                formData,
+                {
+                  headers: { "Content-Type": "multipart/form-data" },
+                },
+              );
+
+              const data = Array.isArray(response.data)
+                ? (response.data as SignatureValidationBackendResult[])
+                : [];
+              const signatures = data.map((item, index) =>
+                normalizeBackendResult(item, file, index),
+              );
+
+              aggregated.push({
+                fileId: file.fileId,
+                fileName: file.name,
+                signatures,
+                error: null,
+                fileSize: file.size ?? null,
+                lastModified: file.lastModified ?? null,
+              });
+            } catch (error) {
+              aggregated.push({
+                fileId: file.fileId,
+                fileName: file.name,
+                signatures: [],
+                error: extractErrorMessage(error),
+                fileSize: file.size ?? null,
+                lastModified: file.lastModified ?? null,
+              });
+            }
           }
 
-          const anyError = aggregated.some((item) => item.error);
-          const anySuccess = aggregated.some((item) => item.signatures.length > 0);
+          if (!cancelRequested.current) {
+            const summaryTimestamp = Date.now();
+            const enrichedEntries = buildReportEntries({
+              results: aggregated,
+              selectors,
+              generatedAt: summaryTimestamp,
+              t,
+            });
 
-          if (anyError && !anySuccess) {
-            setErrorMessage(t('validateSignature.error.allFailed', 'Unable to validate the selected files.'));
-          } else if (anyError) {
-            setErrorMessage(t('validateSignature.error.partial', 'Some files could not be validated.'));
+            setResults(enrichedEntries);
+
+            if (enrichedEntries.length > 0) {
+              const json = JSON.stringify(enrichedEntries, null, 2);
+              const resultFile = new File([json], RESULT_JSON_FILENAME, {
+                type: "application/json",
+              });
+              const csvFile = buildCsvFile(enrichedEntries);
+
+              setFiles([resultFile, csvFile]);
+
+              (async () => {
+                try {
+                  const pdfFile = await createReportPdf(enrichedEntries, t);
+                  setFiles((prev) => [
+                    pdfFile,
+                    ...prev.filter(
+                      (f) => !f.name.toLowerCase().endsWith(".pdf"),
+                    ),
+                  ]);
+                  setDownloadFilename(pdfFile.name);
+                  cleanupDownloadUrl();
+                  const blobUrl = URL.createObjectURL(pdfFile);
+                  previousUrl.current = blobUrl;
+                  setDownloadUrl(blobUrl);
+                } catch (err) {
+                  console.warn(
+                    "[validateSignature] PDF report generation failed",
+                    err,
+                  );
+                  setErrorMessage(
+                    (prev) =>
+                      prev ??
+                      t(
+                        "validateSignature.error.reportGeneration",
+                        "Could not generate the PDF report. JSON and CSV are available.",
+                      ),
+                  );
+                }
+              })();
+            }
+
+            const anyError = aggregated.some((item) => item.error);
+            const anySuccess = aggregated.some(
+              (item) => item.signatures.length > 0,
+            );
+
+            if (anyError && !anySuccess) {
+              setErrorMessage(
+                t(
+                  "validateSignature.error.allFailed",
+                  "Unable to validate the selected files.",
+                ),
+              );
+            } else if (anyError) {
+              setErrorMessage(
+                t(
+                  "validateSignature.error.partial",
+                  "Some files could not be validated.",
+                ),
+              );
+            }
+
+            setStatus(
+              t("validateSignature.status.complete", "Validation complete"),
+            );
           }
-
-          setStatus(t('validateSignature.status.complete', 'Validation complete'));
+        } catch (e) {
+          console.error("[validateSignature] unexpected failure", e);
+          setErrorMessage(
+            t(
+              "validateSignature.error.unexpected",
+              "Unexpected error during validation.",
+            ),
+          );
+        } finally {
+          setIsLoading(false);
         }
-      } catch (e) {
-        console.error('[validateSignature] unexpected failure', e);
-        setErrorMessage(t('validateSignature.error.unexpected', 'Unexpected error during validation.'));
-      } finally {
+      },
+      [cleanupDownloadUrl, selectors, t],
+    );
+
+    const cancelOperation = useCallback(() => {
+      if (isLoading) {
+        cancelRequested.current = true;
         setIsLoading(false);
+        setStatus(t("operationCancelled", "Operation cancelled"));
       }
-    },
-    [cleanupDownloadUrl, selectors, t]
-  );
+    }, [isLoading, t]);
 
-  const cancelOperation = useCallback(() => {
-    if (isLoading) {
-      cancelRequested.current = true;
-      setIsLoading(false);
-      setStatus(t('operationCancelled', 'Operation cancelled'));
-    }
-  }, [isLoading, t]);
+    const undoOperation = useCallback(async () => {
+      resetResults();
+    }, [resetResults]);
 
-  const undoOperation = useCallback(async () => {
-    resetResults();
-  }, [resetResults]);
+    useEffect(() => {
+      return () => {
+        cleanupDownloadUrl();
+      };
+    }, [cleanupDownloadUrl]);
 
-  useEffect(() => {
-    return () => {
-      cleanupDownloadUrl();
-    };
-  }, [cleanupDownloadUrl]);
-
-  return useMemo<ValidateSignatureOperationHook>(
-    () => ({
-      files,
-      thumbnails: [],
-      isGeneratingThumbnails: false,
-      downloadUrl,
-      downloadFilename,
-      isLoading,
-      status,
-      errorMessage,
-      progress: null,
-      executeOperation,
-      resetResults,
-      clearError,
-      cancelOperation,
-      undoOperation,
-      results,
-    }),
-    [
-      cancelOperation,
-      clearError,
-      downloadFilename,
-      downloadUrl,
-      errorMessage,
-      executeOperation,
-      files,
-      isLoading,
-      resetResults,
-      results,
-      status,
-    ]
-  );
-};
+    return useMemo<ValidateSignatureOperationHook>(
+      () => ({
+        files,
+        thumbnails: [],
+        isGeneratingThumbnails: false,
+        downloadUrl,
+        downloadFilename,
+        isLoading,
+        status,
+        errorMessage,
+        progress: null,
+        executeOperation,
+        resetResults,
+        clearError,
+        cancelOperation,
+        undoOperation,
+        results,
+      }),
+      [
+        cancelOperation,
+        clearError,
+        downloadFilename,
+        downloadUrl,
+        errorMessage,
+        executeOperation,
+        files,
+        isLoading,
+        resetResults,
+        results,
+        status,
+      ],
+    );
+  };
diff --git a/frontend/src/core/hooks/tools/validateSignature/useValidateSignatureParameters.ts b/frontend/src/core/hooks/tools/validateSignature/useValidateSignatureParameters.ts
index 864b08aea2..582bf09c55 100644
--- a/frontend/src/core/hooks/tools/validateSignature/useValidateSignatureParameters.ts
+++ b/frontend/src/core/hooks/tools/validateSignature/useValidateSignatureParameters.ts
@@ -1,4 +1,7 @@
-import { useBaseParameters, BaseParametersHook } from '@app/hooks/tools/shared/useBaseParameters';
+import {
+  useBaseParameters,
+  BaseParametersHook,
+} from "@app/hooks/tools/shared/useBaseParameters";
 
 export interface ValidateSignatureParameters {
   certFile: File | null;
@@ -8,11 +11,13 @@ export const defaultParameters: ValidateSignatureParameters = {
   certFile: null,
 };
 
-export type ValidateSignatureParametersHook = BaseParametersHook<ValidateSignatureParameters>;
+export type ValidateSignatureParametersHook =
+  BaseParametersHook<ValidateSignatureParameters>;
 
-export const useValidateSignatureParameters = (): ValidateSignatureParametersHook => {
-  return useBaseParameters({
-    defaultParameters,
-    endpointName: 'validate-signature',
-  });
-};
+export const useValidateSignatureParameters =
+  (): ValidateSignatureParametersHook => {
+    return useBaseParameters({
+      defaultParameters,
+      endpointName: "validate-signature",
+    });
+  };
diff --git a/frontend/src/core/hooks/tools/validateSignature/utils/pdfPageHelpers.ts b/frontend/src/core/hooks/tools/validateSignature/utils/pdfPageHelpers.ts
index a1c70b1261..cdcfc7896c 100644
--- a/frontend/src/core/hooks/tools/validateSignature/utils/pdfPageHelpers.ts
+++ b/frontend/src/core/hooks/tools/validateSignature/utils/pdfPageHelpers.ts
@@ -1,6 +1,10 @@
-import { PdfiumDocument, PdfiumFont, PdfiumImage } from '@app/services/pdfiumDocBuilder';
-import type { TFunction } from 'i18next';
-import { colorPalette } from '@app/hooks/tools/validateSignature/utils/pdfPalette';
+import {
+  PdfiumDocument,
+  PdfiumFont,
+  PdfiumImage,
+} from "@app/services/pdfiumDocBuilder";
+import type { TFunction } from "i18next";
+import { colorPalette } from "@app/hooks/tools/validateSignature/utils/pdfPalette";
 
 interface StartPageParams {
   doc: PdfiumDocument;
@@ -13,7 +17,7 @@ interface StartPageParams {
   pageHeight: number;
   title: string;
   isContinuation: boolean;
-  t: TFunction<'translation'>;
+  t: TFunction<"translation">;
 }
 
 export const startReportPage = ({
@@ -32,7 +36,7 @@ export const startReportPage = ({
   let cursorY = pageHeight - marginY;
 
   if (isContinuation) {
-    const heading = `${title} - ${t('validateSignature.report.continued', 'Continued')}`;
+    const heading = `${title} - ${t("validateSignature.report.continued", "Continued")}`;
     page.drawText(heading, {
       x: marginX,
       y: cursorY - 18,
@@ -44,7 +48,7 @@ export const startReportPage = ({
   }
 
   const pageNumber = doc.getPageCount();
-  page.drawText(`${t('validateSignature.report.page', 'Page')} ${pageNumber}`, {
+  page.drawText(`${t("validateSignature.report.page", "Page")} ${pageNumber}`, {
     x: pageWidth - marginX - 80,
     y: marginY / 2,
     size: 9,
@@ -52,13 +56,16 @@ export const startReportPage = ({
     color: colorPalette.textMuted,
   });
 
-  page.drawText(t('validateSignature.report.footer', 'Validated via Stirling PDF'), {
-    x: marginX,
-    y: marginY / 2,
-    size: 9,
-    font,
-    color: colorPalette.textMuted,
-  });
+  page.drawText(
+    t("validateSignature.report.footer", "Validated via Stirling PDF"),
+    {
+      x: marginX,
+      y: marginY / 2,
+      size: 9,
+      font,
+      color: colorPalette.textMuted,
+    },
+  );
 
   return { page, cursorY };
 };
@@ -74,12 +81,12 @@ export const createThumbnailLoader = (doc: PdfiumDocument) => {
     try {
       const response = await fetch(url);
       const bytes = new Uint8Array(await response.arrayBuffer());
-      const contentType = response.headers.get('content-type') || '';
+      const contentType = response.headers.get("content-type") || "";
       let image: PdfiumImage;
 
-      if (contentType.includes('png')) {
+      if (contentType.includes("png")) {
         image = await doc.embedPng(bytes);
-      } else if (contentType.includes('jpeg') || contentType.includes('jpg')) {
+      } else if (contentType.includes("jpeg") || contentType.includes("jpg")) {
         image = await doc.embedJpg(bytes);
       } else {
         try {
@@ -93,7 +100,7 @@ export const createThumbnailLoader = (doc: PdfiumDocument) => {
       cache.set(url, result);
       return result;
     } catch (error) {
-      console.warn('[validateSignature] Failed to load thumbnail', error);
+      console.warn("[validateSignature] Failed to load thumbnail", error);
       cache.set(url, null);
       return null;
     }
diff --git a/frontend/src/core/hooks/tools/validateSignature/utils/pdfPalette.ts b/frontend/src/core/hooks/tools/validateSignature/utils/pdfPalette.ts
index 59b4907036..1f321535d7 100644
--- a/frontend/src/core/hooks/tools/validateSignature/utils/pdfPalette.ts
+++ b/frontend/src/core/hooks/tools/validateSignature/utils/pdfPalette.ts
@@ -1,9 +1,18 @@
-import { rgb } from '@app/services/pdfiumDocBuilder';
+import { rgb } from "@app/services/pdfiumDocBuilder";
 
 type RgbTuple = [number, number, number];
 
 const defaultLightPalette: Record<
-  'headerBackground' | 'accent' | 'textPrimary' | 'textMuted' | 'boxBackground' | 'boxBorder' | 'warning' | 'danger' | 'success' | 'neutral',
+  | "headerBackground"
+  | "accent"
+  | "textPrimary"
+  | "textMuted"
+  | "boxBackground"
+  | "boxBorder"
+  | "warning"
+  | "danger"
+  | "success"
+  | "neutral",
   RgbTuple
 > = {
   headerBackground: [239, 246, 255],
@@ -25,18 +34,20 @@ const toRgb = ([r, g, b]: RgbTuple) => rgb(r / 255, g / 255, b / 255);
  * Falls back to sensible defaults when the CSS variable cannot be resolved.
  */
 function getCssVariableAsRgb(variableName: string, fallback: RgbTuple) {
-  if (typeof window === 'undefined') {
+  if (typeof window === "undefined") {
     return toRgb(fallback);
   }
 
-  const value = getComputedStyle(document.documentElement).getPropertyValue(variableName).trim();
+  const value = getComputedStyle(document.documentElement)
+    .getPropertyValue(variableName)
+    .trim();
 
   if (!value) {
     console.warn(`CSS variable ${variableName} not found, using fallback`);
     return toRgb(fallback);
   }
 
-  const [r, g, b] = value.split(' ').map(Number);
+  const [r, g, b] = value.split(" ").map(Number);
 
   if ([r, g, b].some((component) => Number.isNaN(component))) {
     console.warn(`Invalid CSS variable format for ${variableName}: ${value}`);
@@ -47,14 +58,38 @@ function getCssVariableAsRgb(variableName: string, fallback: RgbTuple) {
 }
 
 export const colorPalette = {
-  headerBackground: getCssVariableAsRgb('--pdf-light-header-bg', defaultLightPalette.headerBackground),
-  accent: getCssVariableAsRgb('--pdf-light-accent', defaultLightPalette.accent),
-  textPrimary: getCssVariableAsRgb('--pdf-light-text-primary', defaultLightPalette.textPrimary),
-  textMuted: getCssVariableAsRgb('--pdf-light-text-muted', defaultLightPalette.textMuted),
-  boxBackground: getCssVariableAsRgb('--pdf-light-box-bg', defaultLightPalette.boxBackground),
-  boxBorder: getCssVariableAsRgb('--pdf-light-box-border', defaultLightPalette.boxBorder),
-  warning: getCssVariableAsRgb('--pdf-light-warning', defaultLightPalette.warning),
-  danger: getCssVariableAsRgb('--pdf-light-danger', defaultLightPalette.danger),
-  success: getCssVariableAsRgb('--pdf-light-success', defaultLightPalette.success),
-  neutral: getCssVariableAsRgb('--pdf-light-neutral', defaultLightPalette.neutral),
+  headerBackground: getCssVariableAsRgb(
+    "--pdf-light-header-bg",
+    defaultLightPalette.headerBackground,
+  ),
+  accent: getCssVariableAsRgb("--pdf-light-accent", defaultLightPalette.accent),
+  textPrimary: getCssVariableAsRgb(
+    "--pdf-light-text-primary",
+    defaultLightPalette.textPrimary,
+  ),
+  textMuted: getCssVariableAsRgb(
+    "--pdf-light-text-muted",
+    defaultLightPalette.textMuted,
+  ),
+  boxBackground: getCssVariableAsRgb(
+    "--pdf-light-box-bg",
+    defaultLightPalette.boxBackground,
+  ),
+  boxBorder: getCssVariableAsRgb(
+    "--pdf-light-box-border",
+    defaultLightPalette.boxBorder,
+  ),
+  warning: getCssVariableAsRgb(
+    "--pdf-light-warning",
+    defaultLightPalette.warning,
+  ),
+  danger: getCssVariableAsRgb("--pdf-light-danger", defaultLightPalette.danger),
+  success: getCssVariableAsRgb(
+    "--pdf-light-success",
+    defaultLightPalette.success,
+  ),
+  neutral: getCssVariableAsRgb(
+    "--pdf-light-neutral",
+    defaultLightPalette.neutral,
+  ),
 };
diff --git a/frontend/src/core/hooks/tools/validateSignature/utils/pdfText.ts b/frontend/src/core/hooks/tools/validateSignature/utils/pdfText.ts
index 5be41918c1..fb4e2151b3 100644
--- a/frontend/src/core/hooks/tools/validateSignature/utils/pdfText.ts
+++ b/frontend/src/core/hooks/tools/validateSignature/utils/pdfText.ts
@@ -1,20 +1,26 @@
-import { PdfiumFont } from '@app/services/pdfiumDocBuilder';
+import { PdfiumFont } from "@app/services/pdfiumDocBuilder";
 
-export const wrapText = (text: string, font: PdfiumFont, fontSize: number, maxWidth: number): string[] => {
+export const wrapText = (
+  text: string,
+  font: PdfiumFont,
+  fontSize: number,
+  maxWidth: number,
+): string[] => {
   const lines: string[] = [];
   const paragraphs = text.split(/\r?\n/);
 
   paragraphs.forEach((paragraph) => {
     const trimmed = paragraph.trim();
     if (trimmed.length === 0) {
-      lines.push('');
+      lines.push("");
       return;
     }
 
     const words = trimmed.split(/\s+/);
-    let currentLine = '';
+    let currentLine = "";
     words.forEach((word) => {
-      const tentative = currentLine.length > 0 ? `${currentLine} ${word}` : word;
+      const tentative =
+        currentLine.length > 0 ? `${currentLine} ${word}` : word;
       const width = font.widthOfTextAtSize(tentative, fontSize);
       if (width <= maxWidth) {
         currentLine = tentative;
@@ -34,15 +40,18 @@ export const wrapText = (text: string, font: PdfiumFont, fontSize: number, maxWi
 };
 
 export const formatFileSize = (bytes?: number | null) => {
-  if (!bytes || bytes <= 0) return '--';
-  const units = ['B', 'KB', 'MB', 'GB'];
-  const exponent = Math.min(Math.floor(Math.log(bytes) / Math.log(1024)), units.length - 1);
+  if (!bytes || bytes <= 0) return "--";
+  const units = ["B", "KB", "MB", "GB"];
+  const exponent = Math.min(
+    Math.floor(Math.log(bytes) / Math.log(1024)),
+    units.length - 1,
+  );
   const size = bytes / Math.pow(1024, exponent);
   return `${size.toFixed(exponent === 0 ? 0 : 1)} ${units[exponent]}`;
 };
 
 export const formatDate = (value?: string | null) => {
-  if (!value) return '--';
+  if (!value) return "--";
   const parsed = Date.parse(value);
   if (!Number.isNaN(parsed)) {
     return new Date(parsed).toLocaleString();
diff --git a/frontend/src/core/hooks/tools/validateSignature/utils/reportStatus.ts b/frontend/src/core/hooks/tools/validateSignature/utils/reportStatus.ts
index 25c0687e1c..4b2a4323f4 100644
--- a/frontend/src/core/hooks/tools/validateSignature/utils/reportStatus.ts
+++ b/frontend/src/core/hooks/tools/validateSignature/utils/reportStatus.ts
@@ -1,21 +1,21 @@
-import type { TFunction } from 'i18next';
-import { SignatureValidationReportEntry } from '@app/types/validateSignature';
-import { colorPalette } from '@app/hooks/tools/validateSignature/utils/pdfPalette';
+import type { TFunction } from "i18next";
+import { SignatureValidationReportEntry } from "@app/types/validateSignature";
+import { colorPalette } from "@app/hooks/tools/validateSignature/utils/pdfPalette";
 
 export const deriveEntryStatus = (
-  entry: Pick<SignatureValidationReportEntry, 'error' | 'signatures'>,
-  t: TFunction<'translation'>
+  entry: Pick<SignatureValidationReportEntry, "error" | "signatures">,
+  t: TFunction<"translation">,
 ) => {
   if (entry.error) {
     return {
-      text: t('validateSignature.status.invalid', 'Invalid'),
+      text: t("validateSignature.status.invalid", "Invalid"),
       color: colorPalette.danger,
     };
   }
 
   if (entry.signatures.length === 0) {
     return {
-      text: t('validateSignature.noSignaturesShort', 'No signatures'),
+      text: t("validateSignature.noSignaturesShort", "No signatures"),
       color: colorPalette.neutral,
     };
   }
@@ -25,13 +25,13 @@ export const deriveEntryStatus = (
 
   if (allValid) {
     return {
-      text: t('validateSignature.status.valid', 'Valid'),
+      text: t("validateSignature.status.valid", "Valid"),
       color: colorPalette.success,
     };
   }
 
   return {
-    text: t('validateSignature.status.invalid', 'Invalid'),
+    text: t("validateSignature.status.invalid", "Invalid"),
     color: colorPalette.danger,
   };
 };
diff --git a/frontend/src/core/hooks/tools/validateSignature/utils/signatureCsv.ts b/frontend/src/core/hooks/tools/validateSignature/utils/signatureCsv.ts
index 1a485c37bb..8c02e0b68c 100644
--- a/frontend/src/core/hooks/tools/validateSignature/utils/signatureCsv.ts
+++ b/frontend/src/core/hooks/tools/validateSignature/utils/signatureCsv.ts
@@ -1,31 +1,38 @@
-import { SignatureValidationReportEntry } from '@app/types/validateSignature';
-import { CSV_FILENAME, booleanToString, escapeCsvValue, keyUsagesToString } from '@app/hooks/tools/validateSignature/utils/signatureUtils';
+import { SignatureValidationReportEntry } from "@app/types/validateSignature";
+import {
+  CSV_FILENAME,
+  booleanToString,
+  escapeCsvValue,
+  keyUsagesToString,
+} from "@app/hooks/tools/validateSignature/utils/signatureUtils";
 
-const buildCsvRows = (entries: SignatureValidationReportEntry[]): string[][] => {
+const buildCsvRows = (
+  entries: SignatureValidationReportEntry[],
+): string[][] => {
   const headers = [
-    'fileName',
-    'signatureIndex',
-    'valid',
-    'chainValid',
-    'trustValid',
-    'notExpired',
-    'revocationChecked',
-    'revocationStatus',
-    'signerName',
-    'signatureDate',
-    'reason',
-    'location',
-    'issuerDN',
-    'subjectDN',
-    'serialNumber',
-    'validFrom',
-    'validUntil',
-    'signatureAlgorithm',
-    'keySize',
-    'version',
-    'keyUsages',
-    'selfSigned',
-    'errorMessage'
+    "fileName",
+    "signatureIndex",
+    "valid",
+    "chainValid",
+    "trustValid",
+    "notExpired",
+    "revocationChecked",
+    "revocationStatus",
+    "signerName",
+    "signatureDate",
+    "reason",
+    "location",
+    "issuerDN",
+    "subjectDN",
+    "serialNumber",
+    "validFrom",
+    "validUntil",
+    "signatureAlgorithm",
+    "keySize",
+    "version",
+    "keyUsages",
+    "selfSigned",
+    "errorMessage",
   ];
 
   const rows: string[][] = [headers];
@@ -41,49 +48,51 @@ const buildCsvRows = (entries: SignatureValidationReportEntry[]): string[][] =>
           booleanToString(signature.trustValid),
           booleanToString(signature.notExpired),
           booleanToString(signature.revocationChecked),
-          signature.revocationStatus || '',
-          signature.signerName || '',
-          signature.signatureDate || '',
-          signature.reason || '',
-          signature.location || '',
-          signature.issuerDN || '',
-          signature.subjectDN || '',
-          signature.serialNumber || '',
-          signature.validFrom || '',
-          signature.validUntil || '',
-          signature.signatureAlgorithm || '',
-          signature.keySize !== null && signature.keySize !== undefined ? String(signature.keySize) : '',
-          signature.version || '',
+          signature.revocationStatus || "",
+          signature.signerName || "",
+          signature.signatureDate || "",
+          signature.reason || "",
+          signature.location || "",
+          signature.issuerDN || "",
+          signature.subjectDN || "",
+          signature.serialNumber || "",
+          signature.validFrom || "",
+          signature.validUntil || "",
+          signature.signatureAlgorithm || "",
+          signature.keySize !== null && signature.keySize !== undefined
+            ? String(signature.keySize)
+            : "",
+          signature.version || "",
           keyUsagesToString(signature.keyUsages),
           booleanToString(signature.selfSigned),
-          signature.errorMessage || fileResult.error || ''
+          signature.errorMessage || fileResult.error || "",
         ]);
       });
     } else {
       rows.push([
         fileResult.fileName,
-        '',
-        '',
-        '',
-        '',
-        '',
-        '',
-        '',
-        '',
-        '',
-        '',
-        '',
-        '',
-        '',
-        '',
-        '',
-        '',
-        '',
-        '',
-        '',
-        '',
-        '',
-        fileResult.error || ''
+        "",
+        "",
+        "",
+        "",
+        "",
+        "",
+        "",
+        "",
+        "",
+        "",
+        "",
+        "",
+        "",
+        "",
+        "",
+        "",
+        "",
+        "",
+        "",
+        "",
+        "",
+        fileResult.error || "",
       ]);
     }
   });
@@ -91,8 +100,10 @@ const buildCsvRows = (entries: SignatureValidationReportEntry[]): string[][] =>
   return rows;
 };
 
-export const createCsvFile = (entries: SignatureValidationReportEntry[]): File => {
+export const createCsvFile = (
+  entries: SignatureValidationReportEntry[],
+): File => {
   const rows = buildCsvRows(entries);
-  const csv = rows.map((row) => row.map(escapeCsvValue).join(',')).join('\r\n');
-  return new File([csv], CSV_FILENAME, { type: 'text/csv;charset=utf-8;' });
+  const csv = rows.map((row) => row.map(escapeCsvValue).join(",")).join("\r\n");
+  return new File([csv], CSV_FILENAME, { type: "text/csv;charset=utf-8;" });
 };
diff --git a/frontend/src/core/hooks/tools/validateSignature/utils/signatureReportBuilder.ts b/frontend/src/core/hooks/tools/validateSignature/utils/signatureReportBuilder.ts
index cdff64c43b..cfeb3f9f90 100644
--- a/frontend/src/core/hooks/tools/validateSignature/utils/signatureReportBuilder.ts
+++ b/frontend/src/core/hooks/tools/validateSignature/utils/signatureReportBuilder.ts
@@ -1,14 +1,17 @@
-import { SignatureValidationFileResult, SignatureValidationReportEntry } from '@app/types/validateSignature';
-import { FileContextSelectors } from '@app/types/fileContext';
-import type { FileId } from '@app/types/file';
-import type { TFunction } from 'i18next';
-import { deriveEntryStatus } from '@app/hooks/tools/validateSignature/utils/reportStatus';
+import {
+  SignatureValidationFileResult,
+  SignatureValidationReportEntry,
+} from "@app/types/validateSignature";
+import { FileContextSelectors } from "@app/types/fileContext";
+import type { FileId } from "@app/types/file";
+import type { TFunction } from "i18next";
+import { deriveEntryStatus } from "@app/hooks/tools/validateSignature/utils/reportStatus";
 
 interface BuildReportEntriesOptions {
   results: SignatureValidationFileResult[];
   selectors: FileContextSelectors;
   generatedAt: number;
-  t?: TFunction<'translation'>;
+  t?: TFunction<"translation">;
 }
 
 export const buildReportEntries = ({
@@ -29,7 +32,8 @@ export const buildReportEntries = ({
     }
 
     const fileSize = file?.size ?? stub?.size ?? entry.fileSize ?? null;
-    const lastModified = file?.lastModified ?? stub?.lastModified ?? entry.lastModified ?? null;
+    const lastModified =
+      file?.lastModified ?? stub?.lastModified ?? entry.lastModified ?? null;
 
     const statusMeta = t ? deriveEntryStatus(entry, t) : null;
 
diff --git a/frontend/src/core/hooks/tools/validateSignature/utils/signatureStatus.ts b/frontend/src/core/hooks/tools/validateSignature/utils/signatureStatus.ts
index 981fa02e37..ec7caff0dc 100644
--- a/frontend/src/core/hooks/tools/validateSignature/utils/signatureStatus.ts
+++ b/frontend/src/core/hooks/tools/validateSignature/utils/signatureStatus.ts
@@ -1,8 +1,8 @@
-import type { TFunction } from 'i18next';
-import type { SignatureValidationSignature } from '@app/types/validateSignature';
-import { colorPalette } from '@app/hooks/tools/validateSignature/utils/pdfPalette';
+import type { TFunction } from "i18next";
+import type { SignatureValidationSignature } from "@app/types/validateSignature";
+import { colorPalette } from "@app/hooks/tools/validateSignature/utils/pdfPalette";
 
-export type SignatureStatusKind = 'valid' | 'warning' | 'invalid' | 'neutral';
+export type SignatureStatusKind = "valid" | "warning" | "invalid" | "neutral";
 
 export interface SignatureStatus {
   kind: SignatureStatusKind;
@@ -12,13 +12,13 @@ export interface SignatureStatus {
 
 export const computeSignatureStatus = (
   signature: SignatureValidationSignature,
-  t: TFunction<'translation'>
+  t: TFunction<"translation">,
 ): SignatureStatus => {
   // Start with error
   if (signature.errorMessage) {
     return {
-      kind: 'invalid',
-      label: t('validateSignature.status.invalid', 'Invalid'),
+      kind: "invalid",
+      label: t("validateSignature.status.invalid", "Invalid"),
       details: [signature.errorMessage],
     };
   }
@@ -27,24 +27,42 @@ export const computeSignatureStatus = (
   const trustIssues: string[] = [];
 
   if (!signature.valid) {
-    issues.push(t('validateSignature.issue.signatureInvalid', 'Signature cryptographic check failed'));
+    issues.push(
+      t(
+        "validateSignature.issue.signatureInvalid",
+        "Signature cryptographic check failed",
+      ),
+    );
   }
   if (!signature.chainValid) {
-    trustIssues.push(t('validateSignature.issue.chainInvalid', 'Certificate chain invalid'));
+    trustIssues.push(
+      t("validateSignature.issue.chainInvalid", "Certificate chain invalid"),
+    );
   }
   if (!signature.trustValid) {
-    trustIssues.push(t('validateSignature.issue.trustInvalid', 'Certificate not trusted'));
+    trustIssues.push(
+      t("validateSignature.issue.trustInvalid", "Certificate not trusted"),
+    );
   }
   if (!signature.notExpired) {
-    trustIssues.push(t('validateSignature.issue.certExpired', 'Certificate expired'));
+    trustIssues.push(
+      t("validateSignature.issue.certExpired", "Certificate expired"),
+    );
   }
 
   // Use revocationStatus from backend; default to 'unknown' when absent
-  const revStatus = signature.revocationStatus ?? 'unknown';
-  if (revStatus === 'revoked') {
-    trustIssues.push(t('validateSignature.issue.certRevoked', 'Certificate revoked'));
-  } else if (revStatus === 'soft-fail') {
-    trustIssues.push(t('validateSignature.issue.certRevocationUnknown', 'Certificate revocation status unknown'));
+  const revStatus = signature.revocationStatus ?? "unknown";
+  if (revStatus === "revoked") {
+    trustIssues.push(
+      t("validateSignature.issue.certRevoked", "Certificate revoked"),
+    );
+  } else if (revStatus === "soft-fail") {
+    trustIssues.push(
+      t(
+        "validateSignature.issue.certRevocationUnknown",
+        "Certificate revocation status unknown",
+      ),
+    );
   }
 
   // Aggregate all issues for details UI (ignore missing metadata fields; they are optional)
@@ -53,31 +71,29 @@ export const computeSignatureStatus = (
   // If cryptographic validation failed, mark as Invalid
   if (!signature.valid) {
     return {
-      kind: 'invalid',
-      label: t('validateSignature.status.invalid', 'Invalid'),
+      kind: "invalid",
+      label: t("validateSignature.status.invalid", "Invalid"),
       details: issues,
     };
   }
 
   // Otherwise, mark as Valid regardless of optional field presence and trust warnings
   return {
-    kind: 'valid',
-    label: t('validateSignature.status.valid', 'Valid'),
+    kind: "valid",
+    label: t("validateSignature.status.valid", "Valid"),
     details: issues,
   };
 };
 
 export const statusKindToPdfColor = (kind: SignatureStatusKind) => {
   switch (kind) {
-    case 'valid':
+    case "valid":
       return colorPalette.success;
-    case 'warning':
+    case "warning":
       return colorPalette.warning;
-    case 'invalid':
+    case "invalid":
       return colorPalette.danger;
     default:
       return colorPalette.neutral;
   }
 };
-
-
diff --git a/frontend/src/core/hooks/tools/validateSignature/utils/signatureUtils.ts b/frontend/src/core/hooks/tools/validateSignature/utils/signatureUtils.ts
index bb98afc8cb..8c0dd952a4 100644
--- a/frontend/src/core/hooks/tools/validateSignature/utils/signatureUtils.ts
+++ b/frontend/src/core/hooks/tools/validateSignature/utils/signatureUtils.ts
@@ -1,22 +1,29 @@
-import { SignatureValidationBackendResult, SignatureValidationSignature } from '@app/types/validateSignature';
-import type { StirlingFile } from '@app/types/fileContext';
+import {
+  SignatureValidationBackendResult,
+  SignatureValidationSignature,
+} from "@app/types/validateSignature";
+import type { StirlingFile } from "@app/types/fileContext";
 
-export const RESULT_JSON_FILENAME = 'signature-validation.json';
-export const CSV_FILENAME = 'signature-validation.csv';
-export const REPORT_PDF_FILENAME = 'signature-validation-report.pdf';
+export const RESULT_JSON_FILENAME = "signature-validation.json";
+export const CSV_FILENAME = "signature-validation.csv";
+export const REPORT_PDF_FILENAME = "signature-validation-report.pdf";
 
-export const coerceString = (value: string | number | null | undefined): string => {
+export const coerceString = (
+  value: string | number | null | undefined,
+): string => {
   if (value === null || value === undefined) {
-    return '';
+    return "";
   }
   return String(value);
 };
 
-export const coerceNumber = (value: number | string | null | undefined): number | null => {
-  if (typeof value === 'number' && Number.isFinite(value)) {
+export const coerceNumber = (
+  value: number | string | null | undefined,
+): number | null => {
+  if (typeof value === "number" && Number.isFinite(value)) {
     return value;
   }
-  if (typeof value === 'string') {
+  if (typeof value === "string") {
     const parsed = parseInt(value, 10);
     return Number.isNaN(parsed) ? null : parsed;
   }
@@ -24,12 +31,12 @@ export const coerceNumber = (value: number | string | null | undefined): number
 };
 
 export const escapeCsvValue = (raw: string): string => {
-  let value = raw ?? '';
-  value = value.replace(/\r?\n|\r/g, ' ');
+  let value = raw ?? "";
+  value = value.replace(/\r?\n|\r/g, " ");
   if (value.includes('"')) {
     value = value.replace(/"/g, '""');
   }
-  if (value.includes(',') || value.includes('"') || value.includes(';')) {
+  if (value.includes(",") || value.includes('"') || value.includes(";")) {
     value = `"${value}"`;
   }
   return value;
@@ -37,22 +44,22 @@ export const escapeCsvValue = (raw: string): string => {
 
 export const booleanToString = (value: boolean | null | undefined): string => {
   if (value === null || value === undefined) {
-    return '';
+    return "";
   }
-  return value ? 'true' : 'false';
+  return value ? "true" : "false";
 };
 
 export const keyUsagesToString = (keyUsages: string[] | undefined): string => {
   if (!keyUsages || keyUsages.length === 0) {
-    return '';
+    return "";
   }
-  return keyUsages.join('; ');
+  return keyUsages.join("; ");
 };
 
 export const normalizeBackendResult = (
   item: SignatureValidationBackendResult,
   stirlingFile: StirlingFile,
-  index: number
+  index: number,
 ): SignatureValidationSignature => ({
   id: `${stirlingFile.fileId}-${index}`,
   valid: Boolean(item.valid),
@@ -63,8 +70,12 @@ export const normalizeBackendResult = (
     item.revocationChecked === null || item.revocationChecked === undefined
       ? null
       : Boolean(item.revocationChecked),
-  revocationStatus: item.revocationStatus ? coerceString(item.revocationStatus) : null,
-  validationTimeSource: item.validationTimeSource ? coerceString(item.validationTimeSource) : null,
+  revocationStatus: item.revocationStatus
+    ? coerceString(item.revocationStatus)
+    : null,
+  validationTimeSource: item.validationTimeSource
+    ? coerceString(item.validationTimeSource)
+    : null,
   signerName: coerceString(item.signerName),
   signatureDate: coerceString(item.signatureDate),
   reason: coerceString(item.reason),
@@ -77,7 +88,9 @@ export const normalizeBackendResult = (
   signatureAlgorithm: coerceString(item.signatureAlgorithm),
   keySize: coerceNumber(item.keySize),
   version: coerceString(item.version),
-  keyUsages: Array.isArray(item.keyUsages) ? item.keyUsages.filter(Boolean).map(coerceString) : [],
+  keyUsages: Array.isArray(item.keyUsages)
+    ? item.keyUsages.filter(Boolean).map(coerceString)
+    : [],
   selfSigned: Boolean(item.selfSigned),
   errorMessage: item.errorMessage ? coerceString(item.errorMessage) : null,
 });
diff --git a/frontend/src/core/hooks/useAdminSettings.ts b/frontend/src/core/hooks/useAdminSettings.ts
index e88e06400c..1cc495a5da 100644
--- a/frontend/src/core/hooks/useAdminSettings.ts
+++ b/frontend/src/core/hooks/useAdminSettings.ts
@@ -1,6 +1,10 @@
-import { useState, useCallback } from 'react';
-import apiClient from '@app/services/apiClient';
-import { mergePendingSettings, isFieldPending, hasPendingChanges } from '@app/utils/settingsPendingHelper';
+import { useState, useCallback } from "react";
+import apiClient from "@app/services/apiClient";
+import {
+  mergePendingSettings,
+  isFieldPending,
+  hasPendingChanges,
+} from "@app/utils/settingsPendingHelper";
 
 interface UseAdminSettingsOptions<T> {
   sectionName: string;
@@ -41,7 +45,7 @@ interface UseAdminSettingsReturn<T> {
  * });
  */
 export function useAdminSettings<T = any>(
-  options: UseAdminSettingsOptions<T>
+  options: UseAdminSettingsOptions<T>,
 ): UseAdminSettingsReturn<T> {
   const { sectionName, fetchTransformer, saveTransformer } = options;
 
@@ -62,27 +66,41 @@ export function useAdminSettings<T = any>(
         rawData = await fetchTransformer();
       } else {
         // Simple single-endpoint fetch
-        const response = await apiClient.get(`/api/v1/admin/settings/section/${sectionName}`);
+        const response = await apiClient.get(
+          `/api/v1/admin/settings/section/${sectionName}`,
+        );
         rawData = response.data || {};
       }
 
-      console.log(`[useAdminSettings:${sectionName}] Raw response:`, JSON.stringify(rawData, null, 2));
+      console.log(
+        `[useAdminSettings:${sectionName}] Raw response:`,
+        JSON.stringify(rawData, null, 2),
+      );
 
       // Store raw settings (includes _pending if present)
       setRawSettings(rawData);
 
       // Merge pending changes into settings for display
       const mergedSettings = mergePendingSettings(rawData);
-      console.log(`[useAdminSettings:${sectionName}] Merged settings:`, JSON.stringify(mergedSettings, null, 2));
+      console.log(
+        `[useAdminSettings:${sectionName}] Merged settings:`,
+        JSON.stringify(mergedSettings, null, 2),
+      );
 
       // Store merged settings as original for delta comparison
       // This ensures we compare against what the user SAW (with pending), not raw active values
       setOriginalSettings(mergedSettings as T);
-      console.log(`[useAdminSettings:${sectionName}] Original settings (for comparison):`, JSON.stringify(mergedSettings, null, 2));
+      console.log(
+        `[useAdminSettings:${sectionName}] Original settings (for comparison):`,
+        JSON.stringify(mergedSettings, null, 2),
+      );
 
       setSettings(mergedSettings as T);
     } catch (error) {
-      console.error(`[useAdminSettings:${sectionName}] Failed to fetch:`, error);
+      console.error(
+        `[useAdminSettings:${sectionName}] Failed to fetch:`,
+        error,
+      );
       throw error;
     } finally {
       setLoading(false);
@@ -95,10 +113,15 @@ export function useAdminSettings<T = any>(
 
       // Compute delta: only include fields that changed from original
       const delta = computeDelta(originalSettings, settings);
-      console.log(`[useAdminSettings:${sectionName}] Delta (changed fields):`, JSON.stringify(delta, null, 2));
+      console.log(
+        `[useAdminSettings:${sectionName}] Delta (changed fields):`,
+        JSON.stringify(delta, null, 2),
+      );
 
       if (Object.keys(delta).length === 0) {
-        console.log(`[useAdminSettings:${sectionName}] No changes detected, skipping save`);
+        console.log(
+          `[useAdminSettings:${sectionName}] No changes detected, skipping save`,
+        );
         return;
       }
 
@@ -107,23 +130,31 @@ export function useAdminSettings<T = any>(
         const { sectionData, deltaSettings } = saveTransformer(settings);
 
         // Get original sectionData using same transformer for fair comparison
-        const { sectionData: originalSectionData } = saveTransformer(originalSettings);
+        const { sectionData: originalSectionData } =
+          saveTransformer(originalSettings);
 
         // Save section data (with delta applied) - compare transformed vs transformed
         const sectionDelta = computeDelta(originalSectionData, sectionData);
         if (Object.keys(sectionDelta).length > 0) {
-          await apiClient.put(`/api/v1/admin/settings/section/${sectionName}`, sectionDelta);
+          await apiClient.put(
+            `/api/v1/admin/settings/section/${sectionName}`,
+            sectionDelta,
+          );
         }
 
         // Save delta settings if provided (filter to only changed values)
         if (deltaSettings && Object.keys(deltaSettings).length > 0) {
           // Build deltaSettings from original using same transformer to get correct structure
-          const { deltaSettings: originalDeltaSettings } = saveTransformer(originalSettings);
+          const { deltaSettings: originalDeltaSettings } =
+            saveTransformer(originalSettings);
 
-          console.log(`[useAdminSettings:${sectionName}] Comparing deltaSettings:`, {
-            original: originalDeltaSettings,
-            current: deltaSettings
-          });
+          console.log(
+            `[useAdminSettings:${sectionName}] Comparing deltaSettings:`,
+            {
+              original: originalDeltaSettings,
+              current: deltaSettings,
+            },
+          );
 
           // Compare current vs original deltaSettings (both have same backend paths)
           const changedDeltaSettings: Record<string, any> = {};
@@ -133,23 +164,36 @@ export function useAdminSettings<T = any>(
             // Only include if value actually changed
             if (JSON.stringify(value) !== JSON.stringify(originalValue)) {
               changedDeltaSettings[key] = value;
-              console.log(`[useAdminSettings:${sectionName}] Delta field changed: ${key}`, {
-                original: originalValue,
-                new: value
-              });
+              console.log(
+                `[useAdminSettings:${sectionName}] Delta field changed: ${key}`,
+                {
+                  original: originalValue,
+                  new: value,
+                },
+              );
             }
           }
 
           if (Object.keys(changedDeltaSettings).length > 0) {
-            console.log(`[useAdminSettings:${sectionName}] Sending delta settings:`, changedDeltaSettings);
-            await apiClient.put('/api/v1/admin/settings', { settings: changedDeltaSettings });
+            console.log(
+              `[useAdminSettings:${sectionName}] Sending delta settings:`,
+              changedDeltaSettings,
+            );
+            await apiClient.put("/api/v1/admin/settings", {
+              settings: changedDeltaSettings,
+            });
           } else {
-            console.log(`[useAdminSettings:${sectionName}] No delta settings changed, skipping`);
+            console.log(
+              `[useAdminSettings:${sectionName}] No delta settings changed, skipping`,
+            );
           }
         }
       } else {
         // Simple single-endpoint save with delta
-        await apiClient.put(`/api/v1/admin/settings/section/${sectionName}`, delta);
+        await apiClient.put(
+          `/api/v1/admin/settings/section/${sectionName}`,
+          delta,
+        );
       }
 
       // Refetch to get updated _pending block
@@ -170,7 +214,8 @@ export function useAdminSettings<T = any>(
     setSettings,
     fetchSettings,
     saveSettings,
-    isFieldPending: (fieldPath: string) => isFieldPending(rawSettings, fieldPath),
+    isFieldPending: (fieldPath: string) =>
+      isFieldPending(rawSettings, fieldPath),
     hasPendingChanges: () => hasPendingChanges(rawSettings),
   };
 }
@@ -215,8 +260,6 @@ function computeDelta(original: any, current: any): any {
  */
 function isPlainObject(value: any): boolean {
   return (
-    value !== null &&
-    typeof value === 'object' &&
-    value.constructor === Object
+    value !== null && typeof value === "object" && value.constructor === Object
   );
 }
diff --git a/frontend/src/core/hooks/useAuditFilters.ts b/frontend/src/core/hooks/useAuditFilters.ts
index b650c3491f..b67d1d7422 100644
--- a/frontend/src/core/hooks/useAuditFilters.ts
+++ b/frontend/src/core/hooks/useAuditFilters.ts
@@ -1,10 +1,13 @@
-import { useState, useEffect } from 'react';
-import auditService, { AuditFilters } from '@app/services/auditService';
+import { useState, useEffect } from "react";
+import auditService, { AuditFilters } from "@app/services/auditService";
 
 /**
  * Shared hook for managing audit filters across components
  */
-export function useAuditFilters(initialFilters: Partial<AuditFilters> = {}, loginEnabled: boolean = true) {
+export function useAuditFilters(
+  initialFilters: Partial<AuditFilters> = {},
+  loginEnabled: boolean = true,
+) {
   const [eventTypes, setEventTypes] = useState<string[]>([]);
   const [users, setUsers] = useState<string[]>([]);
   const [filters, setFilters] = useState<AuditFilters>({
@@ -26,7 +29,7 @@ export function useAuditFilters(initialFilters: Partial<AuditFilters> = {}, logi
         setEventTypes(types);
         setUsers(usersList);
       } catch (err) {
-        console.error('Failed to fetch audit metadata:', err);
+        console.error("Failed to fetch audit metadata:", err);
       }
     };
 
diff --git a/frontend/src/core/hooks/useBackendHealth.ts b/frontend/src/core/hooks/useBackendHealth.ts
index baeab6dbea..0e08e6da89 100644
--- a/frontend/src/core/hooks/useBackendHealth.ts
+++ b/frontend/src/core/hooks/useBackendHealth.ts
@@ -1,8 +1,8 @@
-import type { BackendHealthState } from '@app/types/backendHealth';
+import type { BackendHealthState } from "@app/types/backendHealth";
 
 export function useBackendHealth(): BackendHealthState {
   return {
-    status: 'healthy',
+    status: "healthy",
     message: null,
     error: null,
     isOnline: true,
diff --git a/frontend/src/core/hooks/useBackendProbe.ts b/frontend/src/core/hooks/useBackendProbe.ts
index 979bc8a07f..910e3199be 100644
--- a/frontend/src/core/hooks/useBackendProbe.ts
+++ b/frontend/src/core/hooks/useBackendProbe.ts
@@ -1,7 +1,7 @@
-import { useCallback, useEffect, useState } from 'react';
-import { BASE_PATH } from '@app/constants/app';
+import { useCallback, useEffect, useState } from "react";
+import { BASE_PATH } from "@app/constants/app";
 
-type BackendStatus = 'up' | 'starting' | 'down';
+type BackendStatus = "up" | "starting" | "down";
 
 interface BackendProbeState {
   status: BackendStatus;
@@ -15,57 +15,57 @@ interface BackendProbeState {
  */
 export function useBackendProbe() {
   const [state, setState] = useState<BackendProbeState>({
-    status: 'starting',
+    status: "starting",
     loginDisabled: false,
     loading: true,
   });
 
   const probe = useCallback(async () => {
-    const statusUrl = `${BASE_PATH || ''}/api/v1/info/status`;
-    const loginUrl = `${BASE_PATH || ''}/api/v1/proprietary/ui-data/login`;
+    const statusUrl = `${BASE_PATH || ""}/api/v1/info/status`;
+    const loginUrl = `${BASE_PATH || ""}/api/v1/proprietary/ui-data/login`;
 
     const next: BackendProbeState = {
-      status: 'starting',
+      status: "starting",
       loginDisabled: false,
       loading: false,
     };
 
     try {
-      const res = await fetch(statusUrl, { method: 'GET', cache: 'no-store' });
+      const res = await fetch(statusUrl, { method: "GET", cache: "no-store" });
       if (res.ok) {
         const data = await res.json().catch(() => null);
-        if (data && data.status === 'UP') {
-          next.status = 'up';
+        if (data && data.status === "UP") {
+          next.status = "up";
           setState(next);
           return next;
         }
-        next.status = 'starting';
+        next.status = "starting";
       } else if (res.status === 404 || res.status === 503) {
-        next.status = 'starting';
+        next.status = "starting";
       } else {
-        next.status = 'down';
+        next.status = "down";
       }
     } catch {
-      next.status = 'down';
+      next.status = "down";
     }
 
     // Fallback: proprietary login endpoint to detect disabled login and backend availability
     try {
-      const res = await fetch(loginUrl, { method: 'GET', cache: 'no-store' });
+      const res = await fetch(loginUrl, { method: "GET", cache: "no-store" });
       if (res.ok) {
-        next.status = 'up';
+        next.status = "up";
         const data = await res.json().catch(() => null);
         if (data && data.enableLogin === false) {
           next.loginDisabled = true;
         }
       } else if (res.status === 404) {
         // Endpoint missing usually means login disabled
-        next.status = 'up';
+        next.status = "up";
         next.loginDisabled = true;
       } else if (res.status === 503) {
-        next.status = 'starting';
+        next.status = "starting";
       } else {
-        next.status = 'down';
+        next.status = "down";
       }
     } catch {
       // keep previous inferred state (down/starting)
diff --git a/frontend/src/core/hooks/useBaseUrl.ts b/frontend/src/core/hooks/useBaseUrl.ts
index f8e237dc8b..0ef78b6010 100644
--- a/frontend/src/core/hooks/useBaseUrl.ts
+++ b/frontend/src/core/hooks/useBaseUrl.ts
@@ -1,6 +1,6 @@
-import { useAppConfig } from '@app/contexts/AppConfigContext';
+import { useAppConfig } from "@app/contexts/AppConfigContext";
 
 export const useBaseUrl = (): string => {
   const { config } = useAppConfig();
-  return config?.baseUrl || 'https://demo.stirlingpdf.com';
+  return config?.baseUrl || "https://demo.stirlingpdf.com";
 };
diff --git a/frontend/src/core/hooks/useConversionCloudStatus.ts b/frontend/src/core/hooks/useConversionCloudStatus.ts
index 1c337212bb..14d0e0abaf 100644
--- a/frontend/src/core/hooks/useConversionCloudStatus.ts
+++ b/frontend/src/core/hooks/useConversionCloudStatus.ts
@@ -2,9 +2,9 @@
  * Comprehensive conversion status data
  */
 export interface ConversionStatus {
-  availability: Record<string, boolean>;   // Available on local OR SaaS?
-  cloudStatus: Record<string, boolean>;    // Will use cloud?
-  localOnly: Record<string, boolean>;      // Available ONLY locally (not on SaaS)?
+  availability: Record<string, boolean>; // Available on local OR SaaS?
+  cloudStatus: Record<string, boolean>; // Will use cloud?
+  localOnly: Record<string, boolean>; // Available ONLY locally (not on SaaS)?
 }
 
 /**
diff --git a/frontend/src/core/hooks/useCookieConsent.ts b/frontend/src/core/hooks/useCookieConsent.ts
index d74a33dc05..b92b180b4e 100644
--- a/frontend/src/core/hooks/useCookieConsent.ts
+++ b/frontend/src/core/hooks/useCookieConsent.ts
@@ -1,9 +1,9 @@
-import { useEffect, useState, useCallback } from 'react';
-import { useTranslation } from 'react-i18next';
-import { BASE_PATH } from '@app/constants/app';
-import { useAppConfig } from '@app/contexts/AppConfigContext';
-import { TOUR_STATE_EVENT, type TourStatePayload } from '@app/constants/events';
-import { getCookieConsentOverrides } from '@app/extensions/cookieConsentConfig';
+import { useEffect, useState, useCallback } from "react";
+import { useTranslation } from "react-i18next";
+import { BASE_PATH } from "@app/constants/app";
+import { useAppConfig } from "@app/contexts/AppConfigContext";
+import { TOUR_STATE_EVENT, type TourStatePayload } from "@app/constants/events";
+import { getCookieConsentOverrides } from "@app/extensions/cookieConsentConfig";
 
 declare global {
   interface Window {
@@ -25,7 +25,7 @@ interface CookieConsentConfig {
 
 export const useCookieConsent = ({
   analyticsEnabled = false,
-  forceLightMode = false
+  forceLightMode = false,
 }: CookieConsentConfig = {}) => {
   const { t } = useTranslation();
   const { config } = useAppConfig();
@@ -34,15 +34,15 @@ export const useCookieConsent = ({
   useEffect(() => {
     if (!analyticsEnabled) return;
 
-    const mainCSS = document.createElement('link');
-    mainCSS.rel = 'stylesheet';
+    const mainCSS = document.createElement("link");
+    mainCSS.rel = "stylesheet";
     mainCSS.href = `${BASE_PATH}css/cookieconsent.css`;
     if (!document.querySelector(`link[href="${mainCSS.href}"]`)) {
       document.head.appendChild(mainCSS);
     }
 
-    const customCSS = document.createElement('link');
-    customCSS.rel = 'stylesheet';
+    const customCSS = document.createElement("link");
+    customCSS.rel = "stylesheet";
     customCSS.href = `${BASE_PATH}css/cookieconsentCustomisation.css`;
     if (!document.querySelector(`link[href="${customCSS.href}"]`)) {
       document.head.appendChild(customCSS);
@@ -50,30 +50,36 @@ export const useCookieConsent = ({
 
     if (window.CookieConsent) {
       if (forceLightMode) {
-        document.documentElement.classList.remove('cc--darkmode');
+        document.documentElement.classList.remove("cc--darkmode");
       }
       setIsInitialized(true);
       return;
     }
 
-    const script = document.createElement('script');
+    const script = document.createElement("script");
     script.src = `${BASE_PATH}js/thirdParty/cookieconsent.umd.js`;
     script.onload = () => {
       setTimeout(() => {
         const detectTheme = () => {
           if (forceLightMode) {
-            document.documentElement.classList.remove('cc--darkmode');
+            document.documentElement.classList.remove("cc--darkmode");
             return false;
           }
 
-          const mantineScheme = document.documentElement.getAttribute('data-mantine-color-scheme');
-          const hasLightClass = document.documentElement.classList.contains('light');
-          const hasDarkClass = document.documentElement.classList.contains('dark');
-          const systemPrefersDark = window.matchMedia('(prefers-color-scheme: dark)').matches;
+          const mantineScheme = document.documentElement.getAttribute(
+            "data-mantine-color-scheme",
+          );
+          const hasLightClass =
+            document.documentElement.classList.contains("light");
+          const hasDarkClass =
+            document.documentElement.classList.contains("dark");
+          const systemPrefersDark = window.matchMedia(
+            "(prefers-color-scheme: dark)",
+          ).matches;
 
           let isDarkMode: boolean;
           if (mantineScheme) {
-            isDarkMode = mantineScheme === 'dark';
+            isDarkMode = mantineScheme === "dark";
           } else if (hasLightClass) {
             isDarkMode = false;
           } else if (hasDarkClass) {
@@ -82,23 +88,25 @@ export const useCookieConsent = ({
             isDarkMode = systemPrefersDark;
           }
 
-          document.documentElement.classList.toggle('cc--darkmode', isDarkMode);
+          document.documentElement.classList.toggle("cc--darkmode", isDarkMode);
           return isDarkMode;
         };
 
         setTimeout(() => detectTheme(), 50);
 
         if (!window.CookieConsent) {
-          console.error('CookieConsent is not available on window object');
+          console.error("CookieConsent is not available on window object");
           return;
         }
 
         if (!forceLightMode) {
           const themeObserver = new MutationObserver((mutations) => {
             mutations.forEach((mutation) => {
-              if (mutation.type === 'attributes' &&
-                  (mutation.attributeName === 'data-mantine-color-scheme' ||
-                   mutation.attributeName === 'class')) {
+              if (
+                mutation.type === "attributes" &&
+                (mutation.attributeName === "data-mantine-color-scheme" ||
+                  mutation.attributeName === "class")
+              ) {
                 detectTheme();
               }
             });
@@ -106,7 +114,7 @@ export const useCookieConsent = ({
 
           themeObserver.observe(document.documentElement, {
             attributes: true,
-            attributeFilter: ['data-mantine-color-scheme', 'class']
+            attributeFilter: ["data-mantine-color-scheme", "class"],
           });
         }
 
@@ -121,93 +129,155 @@ export const useCookieConsent = ({
                 layout: "bar",
                 position: "bottom",
                 equalWeightButtons: true,
-                flipButtons: true
+                flipButtons: true,
               },
               preferencesModal: {
                 layout: "box",
                 position: "right",
                 equalWeightButtons: true,
-                flipButtons: true
-              }
+                flipButtons: true,
+              },
             },
             categories: {
               necessary: {
-                readOnly: true
+                readOnly: true,
               },
               analytics: {
                 services: {
                   ...(config?.enablePosthog !== false && {
                     posthog: {
-                      label: t('cookieBanner.services.posthog', 'PostHog Analytics'),
-                    }
+                      label: t(
+                        "cookieBanner.services.posthog",
+                        "PostHog Analytics",
+                      ),
+                    },
                   }),
                   ...(config?.enableScarf !== false && {
                     scarf: {
-                      label: t('cookieBanner.services.scarf', 'Scarf Pixel'),
-                    }
-                  })
-                }
-              }
+                      label: t("cookieBanner.services.scarf", "Scarf Pixel"),
+                    },
+                  }),
+                },
+              },
             },
             language: {
               default: "en",
               translations: {
                 en: {
                   consentModal: {
-                    title: t('cookieBanner.popUp.title', 'How we use Cookies'),
-                    description: t('cookieBanner.popUp.description.1', 'We use cookies and other technologies to make Stirling PDF work better for you—helping us improve our tools and keep building features you\'ll love.') +
-                               "<br>" +
-                               t('cookieBanner.popUp.description.2', 'If you\'d rather not, clicking \'No Thanks\' will only enable the essential cookies needed to keep things running smoothly.'),
-                    acceptAllBtn: t('cookieBanner.popUp.acceptAllBtn', 'Okay'),
-                    acceptNecessaryBtn: t('cookieBanner.popUp.acceptNecessaryBtn', 'No Thanks'),
-                    showPreferencesBtn: t('cookieBanner.popUp.showPreferencesBtn', 'Manage preferences'),
+                    title: t("cookieBanner.popUp.title", "How we use Cookies"),
+                    description:
+                      t(
+                        "cookieBanner.popUp.description.1",
+                        "We use cookies and other technologies to make Stirling PDF work better for you—helping us improve our tools and keep building features you'll love.",
+                      ) +
+                      "<br>" +
+                      t(
+                        "cookieBanner.popUp.description.2",
+                        "If you'd rather not, clicking 'No Thanks' will only enable the essential cookies needed to keep things running smoothly.",
+                      ),
+                    acceptAllBtn: t("cookieBanner.popUp.acceptAllBtn", "Okay"),
+                    acceptNecessaryBtn: t(
+                      "cookieBanner.popUp.acceptNecessaryBtn",
+                      "No Thanks",
+                    ),
+                    showPreferencesBtn: t(
+                      "cookieBanner.popUp.showPreferencesBtn",
+                      "Manage preferences",
+                    ),
                   },
                   preferencesModal: {
-                    title: t('cookieBanner.preferencesModal.title', 'Consent Preferences Center'),
-                    acceptAllBtn: t('cookieBanner.preferencesModal.acceptAllBtn', 'Accept all'),
-                    acceptNecessaryBtn: t('cookieBanner.preferencesModal.acceptNecessaryBtn', 'Reject all'),
-                    savePreferencesBtn: t('cookieBanner.preferencesModal.savePreferencesBtn', 'Save preferences'),
-                    closeIconLabel: t('cookieBanner.preferencesModal.closeIconLabel', 'Close modal'),
-                    serviceCounterLabel: t('cookieBanner.preferencesModal.serviceCounterLabel', 'Service|Services'),
+                    title: t(
+                      "cookieBanner.preferencesModal.title",
+                      "Consent Preferences Center",
+                    ),
+                    acceptAllBtn: t(
+                      "cookieBanner.preferencesModal.acceptAllBtn",
+                      "Accept all",
+                    ),
+                    acceptNecessaryBtn: t(
+                      "cookieBanner.preferencesModal.acceptNecessaryBtn",
+                      "Reject all",
+                    ),
+                    savePreferencesBtn: t(
+                      "cookieBanner.preferencesModal.savePreferencesBtn",
+                      "Save preferences",
+                    ),
+                    closeIconLabel: t(
+                      "cookieBanner.preferencesModal.closeIconLabel",
+                      "Close modal",
+                    ),
+                    serviceCounterLabel: t(
+                      "cookieBanner.preferencesModal.serviceCounterLabel",
+                      "Service|Services",
+                    ),
                     sections: [
                       {
-                        title: t('cookieBanner.preferencesModal.subtitle', 'Cookie Usage'),
-                        description: t('cookieBanner.preferencesModal.description.1', 'Stirling PDF uses cookies and similar technologies to enhance your experience and understand how our tools are used. This helps us improve performance, develop the features you care about, and provide ongoing support to our users.') +
-                                   "<br><br>" +
-                                   t('cookieBanner.preferencesModal.description.2', 'Stirling PDF cannot—and will never—track or access the content of the documents you use.') +
-                                   "<b> " +
-                                   t('cookieBanner.preferencesModal.description.3', 'Your privacy and trust are at the core of what we do.') +
-                                   "</b>"
+                        title: t(
+                          "cookieBanner.preferencesModal.subtitle",
+                          "Cookie Usage",
+                        ),
+                        description:
+                          t(
+                            "cookieBanner.preferencesModal.description.1",
+                            "Stirling PDF uses cookies and similar technologies to enhance your experience and understand how our tools are used. This helps us improve performance, develop the features you care about, and provide ongoing support to our users.",
+                          ) +
+                          "<br><br>" +
+                          t(
+                            "cookieBanner.preferencesModal.description.2",
+                            "Stirling PDF cannot—and will never—track or access the content of the documents you use.",
+                          ) +
+                          "<b> " +
+                          t(
+                            "cookieBanner.preferencesModal.description.3",
+                            "Your privacy and trust are at the core of what we do.",
+                          ) +
+                          "</b>",
                       },
                       {
-                        title: t('cookieBanner.preferencesModal.necessary.title.1', 'Strictly Necessary Cookies') +
-                               "<span class=\"pm__badge\">" +
-                               t('cookieBanner.preferencesModal.necessary.title.2', 'Always Enabled') +
-                               "</span>",
-                        description: t('cookieBanner.preferencesModal.necessary.description', 'These cookies are essential for the website to function properly. They enable core features like setting your privacy preferences, logging in, and filling out forms—which is why they can\'t be turned off.'),
-                        linkedCategory: "necessary"
+                        title:
+                          t(
+                            "cookieBanner.preferencesModal.necessary.title.1",
+                            "Strictly Necessary Cookies",
+                          ) +
+                          '<span class="pm__badge">' +
+                          t(
+                            "cookieBanner.preferencesModal.necessary.title.2",
+                            "Always Enabled",
+                          ) +
+                          "</span>",
+                        description: t(
+                          "cookieBanner.preferencesModal.necessary.description",
+                          "These cookies are essential for the website to function properly. They enable core features like setting your privacy preferences, logging in, and filling out forms—which is why they can't be turned off.",
+                        ),
+                        linkedCategory: "necessary",
                       },
                       {
-                        title: t('cookieBanner.preferencesModal.analytics.title', 'Analytics'),
-                        description: t('cookieBanner.preferencesModal.analytics.description', 'These cookies help us understand how our tools are being used, so we can focus on building the features our community values most. Rest assured—Stirling PDF cannot and will never track the content of the documents you work with.'),
-                        linkedCategory: "analytics"
-                      }
-                    ]
-                  }
-                }
-              }
-            }
+                        title: t(
+                          "cookieBanner.preferencesModal.analytics.title",
+                          "Analytics",
+                        ),
+                        description: t(
+                          "cookieBanner.preferencesModal.analytics.description",
+                          "These cookies help us understand how our tools are being used, so we can focus on building the features our community values most. Rest assured—Stirling PDF cannot and will never track the content of the documents you work with.",
+                        ),
+                        linkedCategory: "analytics",
+                      },
+                    ],
+                  },
+                },
+              },
+            },
           });
-
         } catch (error) {
-          console.error('Error initializing CookieConsent:', error);
+          console.error("Error initializing CookieConsent:", error);
         }
         setIsInitialized(true);
       }, 100);
     };
 
     script.onerror = () => {
-      console.error('Failed to load cookie consent library');
+      console.error("Failed to load cookie consent library");
     };
 
     document.head.appendChild(script);
@@ -223,25 +293,36 @@ export const useCookieConsent = ({
         document.head.removeChild(customCSS);
       }
     };
-  }, [analyticsEnabled, config?.enablePosthog, config?.enableScarf, t, forceLightMode]);
+  }, [
+    analyticsEnabled,
+    config?.enablePosthog,
+    config?.enableScarf,
+    t,
+    forceLightMode,
+  ]);
 
   useEffect(() => {
     if (!isInitialized) return;
 
     const detectTheme = () => {
       if (forceLightMode) {
-        document.documentElement.classList.remove('cc--darkmode');
+        document.documentElement.classList.remove("cc--darkmode");
         return false;
       }
 
-      const mantineScheme = document.documentElement.getAttribute('data-mantine-color-scheme');
-      const hasLightClass = document.documentElement.classList.contains('light');
-      const hasDarkClass = document.documentElement.classList.contains('dark');
-      const systemPrefersDark = window.matchMedia('(prefers-color-scheme: dark)').matches;
+      const mantineScheme = document.documentElement.getAttribute(
+        "data-mantine-color-scheme",
+      );
+      const hasLightClass =
+        document.documentElement.classList.contains("light");
+      const hasDarkClass = document.documentElement.classList.contains("dark");
+      const systemPrefersDark = window.matchMedia(
+        "(prefers-color-scheme: dark)",
+      ).matches;
 
       let isDarkMode: boolean;
       if (mantineScheme) {
-        isDarkMode = mantineScheme === 'dark';
+        isDarkMode = mantineScheme === "dark";
       } else if (hasLightClass) {
         isDarkMode = false;
       } else if (hasDarkClass) {
@@ -250,7 +331,7 @@ export const useCookieConsent = ({
         isDarkMode = systemPrefersDark;
       }
 
-      document.documentElement.classList.toggle('cc--darkmode', isDarkMode);
+      document.documentElement.classList.toggle("cc--darkmode", isDarkMode);
       return isDarkMode;
     };
 
@@ -260,9 +341,11 @@ export const useCookieConsent = ({
     if (!forceLightMode) {
       themeObserver = new MutationObserver((mutations) => {
         mutations.forEach((mutation) => {
-          if (mutation.type === 'attributes' &&
-              (mutation.attributeName === 'data-mantine-color-scheme' ||
-               mutation.attributeName === 'class')) {
+          if (
+            mutation.type === "attributes" &&
+            (mutation.attributeName === "data-mantine-color-scheme" ||
+              mutation.attributeName === "class")
+          ) {
             detectTheme();
           }
         });
@@ -270,7 +353,7 @@ export const useCookieConsent = ({
 
       themeObserver.observe(document.documentElement, {
         attributes: true,
-        attributeFilter: ['data-mantine-color-scheme', 'class']
+        attributeFilter: ["data-mantine-color-scheme", "class"],
       });
     }
 
@@ -290,7 +373,8 @@ export const useCookieConsent = ({
         window.CookieConsent?.hide();
       } else {
         const consentCookie = window.CookieConsent?.getCookie?.();
-        const hasConsented = consentCookie && Object.keys(consentCookie).length > 0;
+        const hasConsented =
+          consentCookie && Object.keys(consentCookie).length > 0;
         if (!hasConsented) window.CookieConsent?.show();
       }
     };
@@ -311,12 +395,15 @@ export const useCookieConsent = ({
     }
   }, [isInitialized]);
 
-  const isServiceAccepted = useCallback((service: string, category: string): boolean => {
-    if (typeof window === 'undefined' || !window.CookieConsent) {
-      return false;
-    }
-    return window.CookieConsent.acceptedService(service, category);
-  }, []);
+  const isServiceAccepted = useCallback(
+    (service: string, category: string): boolean => {
+      if (typeof window === "undefined" || !window.CookieConsent) {
+        return false;
+      }
+      return window.CookieConsent.acceptedService(service, category);
+    },
+    [],
+  );
 
   return {
     showCookieConsent,
diff --git a/frontend/src/core/hooks/useCreditCheck.ts b/frontend/src/core/hooks/useCreditCheck.ts
index e0d05c80cb..ba96fab475 100644
--- a/frontend/src/core/hooks/useCreditCheck.ts
+++ b/frontend/src/core/hooks/useCreditCheck.ts
@@ -5,6 +5,7 @@
  */
 export function useCreditCheck(_operationType?: string, _endpoint?: string) {
   return {
-    checkCredits: async (_runtimeEndpoint?: string): Promise<string | null> => null, // null = allowed
+    checkCredits: async (_runtimeEndpoint?: string): Promise<string | null> =>
+      null, // null = allowed
   };
 }
diff --git a/frontend/src/core/hooks/useDocumentMeta.ts b/frontend/src/core/hooks/useDocumentMeta.ts
index 39f87e854d..071d564768 100644
--- a/frontend/src/core/hooks/useDocumentMeta.ts
+++ b/frontend/src/core/hooks/useDocumentMeta.ts
@@ -1,5 +1,5 @@
-import { useEffect } from 'react';
-import { useTranslation } from 'react-i18next';
+import { useEffect } from "react";
+import { useTranslation } from "react-i18next";
 
 interface MetaOptions {
   title?: string;
@@ -12,30 +12,45 @@ interface MetaOptions {
 
 export const useDocumentMeta = (meta: MetaOptions) => {
   const { i18n } = useTranslation();
-  
+
   useEffect(() => {
     const originalTitle = document.title;
-    const originalDescription = document.querySelector('meta[name="description"]')?.getAttribute('content') || '';
-    
+    const originalDescription =
+      document
+        .querySelector('meta[name="description"]')
+        ?.getAttribute("content") || "";
+
     // Store original OpenGraph values for cleanup
-    const ogProperties = ['og:site_name', 'og:locale', 'og:title', 'og:description', 'og:image', 'og:image:width', 'og:image:height', 'og:url', 'og:type'];
+    const ogProperties = [
+      "og:site_name",
+      "og:locale",
+      "og:title",
+      "og:description",
+      "og:image",
+      "og:image:width",
+      "og:image:height",
+      "og:url",
+      "og:type",
+    ];
     const originalOgValues = new Map<string, string | null>();
-    
-    ogProperties.forEach(property => {
+
+    ogProperties.forEach((property) => {
       const element = document.querySelector(`meta[property="${property}"]`);
-      originalOgValues.set(property, element?.getAttribute('content') || null);
+      originalOgValues.set(property, element?.getAttribute("content") || null);
     });
-    
+
     // Update title
     if (meta.title) {
       document.title = meta.title;
     }
-    
+
     // Update or create meta tags
     const updateOrCreateMeta = (name: string, content: string) => {
-      let metaElement = document.querySelector(`meta[name="${name}"]`) as HTMLMetaElement;
+      let metaElement = document.querySelector(
+        `meta[name="${name}"]`,
+      ) as HTMLMetaElement;
       if (!metaElement) {
-        metaElement = document.createElement('meta');
+        metaElement = document.createElement("meta");
         metaElement.name = name;
         document.head.appendChild(metaElement);
       }
@@ -43,10 +58,12 @@ export const useDocumentMeta = (meta: MetaOptions) => {
     };
 
     const updateOrCreateProperty = (property: string, content: string) => {
-      let metaElement = document.querySelector(`meta[property="${property}"]`) as HTMLMetaElement;
+      let metaElement = document.querySelector(
+        `meta[property="${property}"]`,
+      ) as HTMLMetaElement;
       if (!metaElement) {
-        metaElement = document.createElement('meta');
-        metaElement.setAttribute('property', property);
+        metaElement = document.createElement("meta");
+        metaElement.setAttribute("property", property);
         document.head.appendChild(metaElement);
       }
       metaElement.content = content;
@@ -54,40 +71,42 @@ export const useDocumentMeta = (meta: MetaOptions) => {
 
     // Update meta tags
     if (meta.description) {
-      updateOrCreateMeta('description', meta.description);
+      updateOrCreateMeta("description", meta.description);
     }
 
     // Update OpenGraph tags
-    updateOrCreateProperty('og:site_name', 'Stirling PDF');
-    updateOrCreateProperty('og:locale', i18n.language.replace('-', '_'));
-    
+    updateOrCreateProperty("og:site_name", "Stirling PDF");
+    updateOrCreateProperty("og:locale", i18n.language.replace("-", "_"));
+
     if (meta.ogTitle) {
-      updateOrCreateProperty('og:title', meta.ogTitle);
+      updateOrCreateProperty("og:title", meta.ogTitle);
     }
     if (meta.ogDescription) {
-      updateOrCreateProperty('og:description', meta.ogDescription);
+      updateOrCreateProperty("og:description", meta.ogDescription);
     }
     if (meta.ogImage) {
-      updateOrCreateProperty('og:image', meta.ogImage);
-      updateOrCreateProperty('og:image:width', '1200');
-      updateOrCreateProperty('og:image:height', '630');
+      updateOrCreateProperty("og:image", meta.ogImage);
+      updateOrCreateProperty("og:image:width", "1200");
+      updateOrCreateProperty("og:image:height", "630");
     }
     if (meta.ogUrl) {
-      updateOrCreateProperty('og:url', meta.ogUrl);
+      updateOrCreateProperty("og:url", meta.ogUrl);
     }
     // Always set og:type to website
-    updateOrCreateProperty('og:type', 'website');
+    updateOrCreateProperty("og:type", "website");
 
     // Cleanup function to restore original values
     return () => {
       document.title = originalTitle;
       if (originalDescription) {
-        updateOrCreateMeta('description', originalDescription);
+        updateOrCreateMeta("description", originalDescription);
       }
-      
+
       // Restore or remove OpenGraph tags
       originalOgValues.forEach((originalValue, property) => {
-        const element = document.querySelector(`meta[property="${property}"]`) as HTMLMetaElement;
+        const element = document.querySelector(
+          `meta[property="${property}"]`,
+        ) as HTMLMetaElement;
         if (element) {
           if (originalValue !== null) {
             element.content = originalValue;
@@ -97,5 +116,13 @@ export const useDocumentMeta = (meta: MetaOptions) => {
         }
       });
     };
-  }, [meta.title, meta.description, meta.ogTitle, meta.ogDescription, meta.ogImage, meta.ogUrl, i18n.language]);
-};
\ No newline at end of file
+  }, [
+    meta.title,
+    meta.description,
+    meta.ogTitle,
+    meta.ogDescription,
+    meta.ogImage,
+    meta.ogUrl,
+    i18n.language,
+  ]);
+};
diff --git a/frontend/src/core/hooks/useEndpointConfig.ts b/frontend/src/core/hooks/useEndpointConfig.ts
index 96b3f2f12c..227a425242 100644
--- a/frontend/src/core/hooks/useEndpointConfig.ts
+++ b/frontend/src/core/hooks/useEndpointConfig.ts
@@ -1,6 +1,6 @@
-import { useState, useEffect } from 'react';
-import apiClient from '@app/services/apiClient';
-import type { EndpointAvailabilityDetails } from '@app/types/endpointAvailability';
+import { useState, useEffect } from "react";
+import apiClient from "@app/services/apiClient";
+import type { EndpointAvailabilityDetails } from "@app/types/endpointAvailability";
 
 // Track whether we've done the global fetch to prevent duplicate requests
 let globalFetchDone = false;
@@ -30,13 +30,16 @@ export function useEndpointEnabled(endpoint: string): {
     try {
       setLoading(true);
       setError(null);
-      console.debug('[useEndpointConfig] Fetch endpoint status', { endpoint });
+      console.debug("[useEndpointConfig] Fetch endpoint status", { endpoint });
 
-      const response = await apiClient.get<boolean>(`/api/v1/config/endpoint-enabled?endpoint=${encodeURIComponent(endpoint)}`);
+      const response = await apiClient.get<boolean>(
+        `/api/v1/config/endpoint-enabled?endpoint=${encodeURIComponent(endpoint)}`,
+      );
       const isEnabled = response.data;
       setEnabled(isEnabled);
     } catch (err) {
-      const errorMessage = err instanceof Error ? err.message : 'Unknown error occurred';
+      const errorMessage =
+        err instanceof Error ? err.message : "Unknown error occurred";
       setError(errorMessage);
     } finally {
       setLoading(false);
@@ -66,15 +69,19 @@ export function useMultipleEndpointsEnabled(endpoints: string[]): {
   error: string | null;
   refetch: () => Promise<void>;
 } {
-  const [endpointStatus, setEndpointStatus] = useState<Record<string, boolean>>({});
-  const [endpointDetails, setEndpointDetails] = useState<Record<string, EndpointAvailabilityDetails>>({});
+  const [endpointStatus, setEndpointStatus] = useState<Record<string, boolean>>(
+    {},
+  );
+  const [endpointDetails, setEndpointDetails] = useState<
+    Record<string, EndpointAvailabilityDetails>
+  >({});
   const [loading, setLoading] = useState(true);
   const [error, setError] = useState<string | null>(null);
 
   const fetchAllEndpointStatuses = async (force = false) => {
     // Skip if already fetched globally and not forced
     if (!force && globalFetchDone) {
-      console.debug('[useEndpointConfig] Using global cache');
+      console.debug("[useEndpointConfig] Using global cache");
       const cached = endpoints.reduce(
         (acc, endpoint) => {
           const cachedDetails = globalEndpointCache[endpoint];
@@ -86,10 +93,13 @@ export function useMultipleEndpointsEnabled(endpoints: string[]): {
           }
           return acc;
         },
-        { status: {} as Record<string, boolean>, details: {} as Record<string, EndpointAvailabilityDetails> }
+        {
+          status: {} as Record<string, boolean>,
+          details: {} as Record<string, EndpointAvailabilityDetails>,
+        },
       );
       setEndpointStatus(cached.status);
-      setEndpointDetails(prev => ({ ...prev, ...cached.details }));
+      setEndpointDetails((prev) => ({ ...prev, ...cached.details }));
       setLoading(false);
       return;
     }
@@ -104,10 +114,14 @@ export function useMultipleEndpointsEnabled(endpoints: string[]): {
     try {
       setLoading(true);
       setError(null);
-      console.debug('[useEndpointConfig] Fetching all endpoint statuses from server');
+      console.debug(
+        "[useEndpointConfig] Fetching all endpoint statuses from server",
+      );
 
       // Fetch all endpoints at once - no query params needed
-      const response = await apiClient.get<Record<string, EndpointAvailabilityDetails>>(`/api/v1/config/endpoints-availability`);
+      const response = await apiClient.get<
+        Record<string, EndpointAvailabilityDetails>
+      >(`/api/v1/config/endpoints-availability`);
 
       // Populate global cache with all results
       Object.entries(response.data).forEach(([endpoint, details]) => {
@@ -130,16 +144,21 @@ export function useMultipleEndpointsEnabled(endpoints: string[]): {
           }
           return acc;
         },
-        { status: {} as Record<string, boolean>, details: {} as Record<string, EndpointAvailabilityDetails> }
+        {
+          status: {} as Record<string, boolean>,
+          details: {} as Record<string, EndpointAvailabilityDetails>,
+        },
       );
 
       setEndpointStatus(fullStatus.status);
-      setEndpointDetails(prev => ({ ...prev, ...fullStatus.details }));
+      setEndpointDetails((prev) => ({ ...prev, ...fullStatus.details }));
     } catch (err: any) {
       // On 401 (auth error), use optimistic fallback instead of disabling
       if (err.response?.status === 401) {
-        console.warn('[useEndpointConfig] 401 error - using optimistic fallback');
-        endpoints.forEach(endpoint => {
+        console.warn(
+          "[useEndpointConfig] 401 error - using optimistic fallback",
+        );
+        endpoints.forEach((endpoint) => {
           globalEndpointCache[endpoint] = { enabled: true, reason: null };
         });
         const optimisticStatus = endpoints.reduce(
@@ -148,17 +167,24 @@ export function useMultipleEndpointsEnabled(endpoints: string[]): {
             acc.details[endpoint] = { enabled: true, reason: null };
             return acc;
           },
-          { status: {} as Record<string, boolean>, details: {} as Record<string, EndpointAvailabilityDetails> }
+          {
+            status: {} as Record<string, boolean>,
+            details: {} as Record<string, EndpointAvailabilityDetails>,
+          },
         );
         setEndpointStatus(optimisticStatus.status);
-        setEndpointDetails(prev => ({ ...prev, ...optimisticStatus.details }));
+        setEndpointDetails((prev) => ({
+          ...prev,
+          ...optimisticStatus.details,
+        }));
         setLoading(false);
         return;
       }
 
-      const errorMessage = err instanceof Error ? err.message : 'Unknown error occurred';
+      const errorMessage =
+        err instanceof Error ? err.message : "Unknown error occurred";
       setError(errorMessage);
-      console.error('[EndpointConfig] Failed to check endpoints:', err);
+      console.error("[EndpointConfig] Failed to check endpoints:", err);
 
       // Fallback: assume all endpoints are enabled on error (optimistic)
       const optimisticStatus = endpoints.reduce(
@@ -167,10 +193,13 @@ export function useMultipleEndpointsEnabled(endpoints: string[]): {
           acc.details[endpoint] = { enabled: true, reason: null };
           return acc;
         },
-        { status: {} as Record<string, boolean>, details: {} as Record<string, EndpointAvailabilityDetails> }
+        {
+          status: {} as Record<string, boolean>,
+          details: {} as Record<string, EndpointAvailabilityDetails>,
+        },
       );
       setEndpointStatus(optimisticStatus.status);
-      setEndpointDetails(prev => ({ ...prev, ...optimisticStatus.details }));
+      setEndpointDetails((prev) => ({ ...prev, ...optimisticStatus.details }));
     } finally {
       setLoading(false);
     }
@@ -178,20 +207,25 @@ export function useMultipleEndpointsEnabled(endpoints: string[]): {
 
   useEffect(() => {
     fetchAllEndpointStatuses();
-  }, [endpoints.join(',')]); // Re-run when endpoints array changes
+  }, [endpoints.join(",")]); // Re-run when endpoints array changes
 
   // Listen for JWT availability (triggered on login/signup)
   useEffect(() => {
     const handleJwtAvailable = () => {
-      console.debug('[useEndpointConfig] JWT available event - clearing cache for refetch with auth');
+      console.debug(
+        "[useEndpointConfig] JWT available event - clearing cache for refetch with auth",
+      );
       globalFetchDone = false;
-      Object.keys(globalEndpointCache).forEach(key => delete globalEndpointCache[key]);
+      Object.keys(globalEndpointCache).forEach(
+        (key) => delete globalEndpointCache[key],
+      );
       fetchAllEndpointStatuses(true);
     };
 
-    window.addEventListener('jwt-available', handleJwtAvailable);
-    return () => window.removeEventListener('jwt-available', handleJwtAvailable);
-  }, [endpoints.join(',')]);
+    window.addEventListener("jwt-available", handleJwtAvailable);
+    return () =>
+      window.removeEventListener("jwt-available", handleJwtAvailable);
+  }, [endpoints.join(",")]);
 
   return {
     endpointStatus,
diff --git a/frontend/src/core/hooks/useEnhancedProcessedFiles.ts b/frontend/src/core/hooks/useEnhancedProcessedFiles.ts
index 932428dd0d..262bda146e 100644
--- a/frontend/src/core/hooks/useEnhancedProcessedFiles.ts
+++ b/frontend/src/core/hooks/useEnhancedProcessedFiles.ts
@@ -1,7 +1,11 @@
-import { useState, useEffect, useRef } from 'react';
-import { ProcessedFile, ProcessingState, ProcessingConfig } from '@app/types/processing';
-import { enhancedPDFProcessingService } from '@app/services/enhancedPDFProcessingService';
-import { FileHasher } from '@app/utils/fileHash';
+import { useState, useEffect, useRef } from "react";
+import {
+  ProcessedFile,
+  ProcessingState,
+  ProcessingConfig,
+} from "@app/types/processing";
+import { enhancedPDFProcessingService } from "@app/services/enhancedPDFProcessingService";
+import { FileHasher } from "@app/utils/fileHash";
 
 interface UseEnhancedProcessedFilesResult {
   processedFiles: Map<File, ProcessedFile>;
@@ -34,24 +38,35 @@ interface UseEnhancedProcessedFilesResult {
 
 export function useEnhancedProcessedFiles(
   activeFiles: File[],
-  config?: Partial<ProcessingConfig>
+  config?: Partial<ProcessingConfig>,
 ): UseEnhancedProcessedFilesResult {
-  const [processedFiles, setProcessedFiles] = useState<Map<File, ProcessedFile>>(new Map());
+  const [processedFiles, setProcessedFiles] = useState<
+    Map<File, ProcessedFile>
+  >(new Map());
   const fileHashMapRef = useRef<Map<File, string>>(new Map()); // Use ref to avoid state update loops
-  const [processingStates, setProcessingStates] = useState<Map<string, ProcessingState>>(new Map());
+  const [processingStates, setProcessingStates] = useState<
+    Map<string, ProcessingState>
+  >(new Map());
 
   // Subscribe to processing state changes once
   useEffect(() => {
-    const unsubscribe = enhancedPDFProcessingService.onProcessingChange(setProcessingStates);
+    const unsubscribe =
+      enhancedPDFProcessingService.onProcessingChange(setProcessingStates);
     return unsubscribe;
   }, []);
 
   // Process files when activeFiles changes
   useEffect(() => {
-    console.log('useEnhancedProcessedFiles: activeFiles changed', activeFiles.length, 'files');
+    console.log(
+      "useEnhancedProcessedFiles: activeFiles changed",
+      activeFiles.length,
+      "files",
+    );
 
     if (activeFiles.length === 0) {
-      console.log('useEnhancedProcessedFiles: No active files, clearing processed cache');
+      console.log(
+        "useEnhancedProcessedFiles: No active files, clearing processed cache",
+      );
       setProcessedFiles(new Map());
       // Clear any ongoing processing when no files
       enhancedPDFProcessingService.clearAllProcessing();
@@ -86,7 +101,10 @@ export function useEnhancedProcessedFiles(
         }
 
         try {
-          const processed = await enhancedPDFProcessingService.processFile(file, config);
+          const processed = await enhancedPDFProcessingService.processFile(
+            file,
+            config,
+          );
           if (processed) {
             newProcessedFiles.set(file, processed);
           }
@@ -96,8 +114,11 @@ export function useEnhancedProcessedFiles(
       }
 
       // Only update if the content actually changed
-      const hasChanged = newProcessedFiles.size !== processedFiles.size ||
-        Array.from(newProcessedFiles.keys()).some(file => !processedFiles.has(file));
+      const hasChanged =
+        newProcessedFiles.size !== processedFiles.size ||
+        Array.from(newProcessedFiles.keys()).some(
+          (file) => !processedFiles.has(file),
+        );
 
       if (hasChanged) {
         setProcessedFiles(newProcessedFiles);
@@ -116,7 +137,7 @@ export function useEnhancedProcessedFiles(
       // Generate file keys for all files first
       const fileKeyPromises = activeFiles.map(async (file) => ({
         file,
-        key: await FileHasher.generateHybridHash(file)
+        key: await FileHasher.generateHybridHash(file),
       }));
 
       const fileKeyPairs = await Promise.all(fileKeyPromises);
@@ -128,9 +149,15 @@ export function useEnhancedProcessedFiles(
 
           // Check for both processing and recently completed files
           // This ensures we catch completed files before they're cleaned up
-          if (processingState?.status === 'processing' || processingState?.status === 'completed') {
+          if (
+            processingState?.status === "processing" ||
+            processingState?.status === "completed"
+          ) {
             try {
-              const processed = await enhancedPDFProcessingService.processFile(file, config);
+              const processed = await enhancedPDFProcessingService.processFile(
+                file,
+                config,
+              );
               if (processed) {
                 updatedFiles.set(file, processed);
                 hasNewFiles = true;
@@ -152,19 +179,20 @@ export function useEnhancedProcessedFiles(
     return () => clearInterval(interval);
   }, [activeFiles, processingStates]);
 
-
   // Cleanup when activeFiles changes
   useEffect(() => {
     const currentFiles = new Set(activeFiles);
     const previousFiles = Array.from(processedFiles.keys());
-    const removedFiles = previousFiles.filter(file => !currentFiles.has(file));
+    const removedFiles = previousFiles.filter(
+      (file) => !currentFiles.has(file),
+    );
 
     if (removedFiles.length > 0) {
       // Clean up processing service cache
       enhancedPDFProcessingService.cleanup(removedFiles);
 
       // Update local state
-      setProcessedFiles(prev => {
+      setProcessedFiles((prev) => {
         const updated = new Map();
         for (const [file, processed] of prev) {
           if (currentFiles.has(file)) {
@@ -178,7 +206,9 @@ export function useEnhancedProcessedFiles(
 
   // Calculate derived state
   const isProcessing = processingStates.size > 0;
-  const hasProcessingErrors = Array.from(processingStates.values()).some(state => state.status === 'error');
+  const hasProcessingErrors = Array.from(processingStates.values()).some(
+    (state) => state.status === "error",
+  );
 
   // Calculate overall progress
   const processingProgress = calculateProcessingProgress(processingStates);
@@ -203,7 +233,7 @@ export function useEnhancedProcessedFiles(
 
     clearCache: () => {
       enhancedPDFProcessingService.clearAll();
-    }
+    },
   };
 
   // Cleanup on unmount
@@ -221,7 +251,7 @@ export function useEnhancedProcessedFiles(
     processingProgress,
     cacheStats,
     metrics,
-    actions
+    actions,
   };
 }
 
@@ -237,7 +267,7 @@ function calculateProcessingProgress(states: Map<string, ProcessingState>): {
     return {
       overall: 100,
       fileProgress: new Map(),
-      estimatedTimeRemaining: 0
+      estimatedTimeRemaining: 0,
     };
   }
 
@@ -257,7 +287,7 @@ function calculateProcessingProgress(states: Map<string, ProcessingState>): {
   return {
     overall,
     fileProgress,
-    estimatedTimeRemaining
+    estimatedTimeRemaining,
   };
 }
 
@@ -266,7 +296,7 @@ function calculateProcessingProgress(states: Map<string, ProcessingState>): {
  */
 export function useEnhancedProcessedFile(
   file: File | null,
-  config?: Partial<ProcessingConfig>
+  config?: Partial<ProcessingConfig>,
 ): {
   processedFile: ProcessedFile | null;
   isProcessing: boolean;
@@ -282,8 +312,10 @@ export function useEnhancedProcessedFile(
 
   const processedFile = file ? result.processedFiles.get(file) || null : null;
   // Note: This is async but we can't await in hook return - consider refactoring if needed
-  const fileKey = file ? '' : '';
-  const processingState = fileKey ? result.processingStates.get(fileKey) || null : null;
+  const fileKey = file ? "" : "";
+  const processingState = fileKey
+    ? result.processingStates.get(fileKey) || null
+    : null;
   const isProcessing = !!processingState;
   const error = processingState?.error?.message || null;
   const canRetry = processingState?.error?.recoverable || false;
@@ -298,7 +330,7 @@ export function useEnhancedProcessedFile(
       if (file) {
         result.actions.retryProcessing(file);
       }
-    }
+    },
   };
 
   return {
@@ -307,6 +339,6 @@ export function useEnhancedProcessedFile(
     processingState,
     error,
     canRetry,
-    actions
+    actions,
   };
 }
diff --git a/frontend/src/core/hooks/useFileActionIcons.ts b/frontend/src/core/hooks/useFileActionIcons.ts
index ef58b68b7d..f48cb79b47 100644
--- a/frontend/src/core/hooks/useFileActionIcons.ts
+++ b/frontend/src/core/hooks/useFileActionIcons.ts
@@ -1,5 +1,5 @@
-import UploadIcon from '@mui/icons-material/Upload';
-import DownloadOutlinedIcon from '@mui/icons-material/DownloadOutlined';
+import UploadIcon from "@mui/icons-material/Upload";
+import DownloadOutlinedIcon from "@mui/icons-material/DownloadOutlined";
 
 /**
  * File action icons for web builds.
@@ -10,8 +10,8 @@ export function useFileActionIcons() {
   return {
     upload: UploadIcon,
     download: DownloadOutlinedIcon,
-    uploadIconName: 'upload' as const,
-    downloadIconName: 'download' as const,
+    uploadIconName: "upload" as const,
+    downloadIconName: "download" as const,
     // Web builds do not expose a Save As icon — the button is hidden when this is undefined.
     // Desktop builds override this file and return a real icon name.
     saveAsIconName: undefined as string | undefined,
diff --git a/frontend/src/core/hooks/useFileActionTerminology.ts b/frontend/src/core/hooks/useFileActionTerminology.ts
index 12d992bbe2..48616fd315 100644
--- a/frontend/src/core/hooks/useFileActionTerminology.ts
+++ b/frontend/src/core/hooks/useFileActionTerminology.ts
@@ -1,4 +1,4 @@
-import { useTranslation } from 'react-i18next';
+import { useTranslation } from "react-i18next";
 
 /**
  * File action terminology for web builds
@@ -8,15 +8,26 @@ export function useFileActionTerminology() {
   const { t } = useTranslation();
 
   return {
-    uploadFiles: t('fileUpload.uploadFiles', 'Upload Files'),
-    uploadFile: t('fileUpload.uploadFile', 'Upload File'),
-    upload: t('fileUpload.upload', 'Upload'),
-    dropFilesHere: t('fileUpload.dropFilesHere', 'Drop files here or click the upload button'),
-    uploadFromComputer: t('landing.uploadFromComputer', 'Upload from computer'),
-    download: t('download', 'Download'),
-    downloadAll: t('rightRail.downloadAll', 'Download All'),
-    downloadSelected: t('fileManager.downloadSelected', 'Download Selected'),
-    downloadUnavailable: t('downloadUnavailable', 'Download unavailable for this item'),
-    noFilesInStorage: t('fileUpload.noFilesInStorage', 'No files available in storage. Upload some files first.'),
+    uploadFiles: t("fileUpload.uploadFiles", "Upload Files"),
+    uploadFile: t("fileUpload.uploadFile", "Upload File"),
+    upload: t("fileUpload.upload", "Upload"),
+    dropFilesHere: t(
+      "fileUpload.dropFilesHere",
+      "Drop files here or click the upload button",
+    ),
+    addFiles: t("landing.addFiles", "Add Files"),
+    mobileUpload: t("landing.mobileUpload", "Upload from Mobile"),
+    uploadFromComputer: t("landing.uploadFromComputer", "Upload from computer"),
+    download: t("download", "Download"),
+    downloadAll: t("rightRail.downloadAll", "Download All"),
+    downloadSelected: t("fileManager.downloadSelected", "Download Selected"),
+    downloadUnavailable: t(
+      "downloadUnavailable",
+      "Download unavailable for this item",
+    ),
+    noFilesInStorage: t(
+      "fileUpload.noFilesInStorage",
+      "No files available in storage. Upload some files first.",
+    ),
   };
 }
diff --git a/frontend/src/core/hooks/useFileHandler.ts b/frontend/src/core/hooks/useFileHandler.ts
index fc935b0298..4bdc3ac123 100644
--- a/frontend/src/core/hooks/useFileHandler.ts
+++ b/frontend/src/core/hooks/useFileHandler.ts
@@ -1,17 +1,23 @@
-import { useCallback } from 'react';
-import { useFileActions } from '@app/contexts/FileContext';
-import type { StirlingFile } from '@app/types/fileContext';
+import { useCallback } from "react";
+import { useFileActions } from "@app/contexts/FileContext";
+import type { StirlingFile } from "@app/types/fileContext";
 
 export const useFileHandler = () => {
   const { actions } = useFileActions();
 
-  const addFiles = useCallback(async (files: File[], options: { insertAfterPageId?: string; selectFiles?: boolean } = {}): Promise<StirlingFile[]> => {
-    // Merge default options with passed options - passed options take precedence
-    const mergedOptions = { selectFiles: true, ...options };
-    // Let FileContext handle deduplication with quickKey logic
-    const result = await actions.addFiles(files, mergedOptions);
-    return result;
-  }, [actions.addFiles]);
+  const addFiles = useCallback(
+    async (
+      files: File[],
+      options: { insertAfterPageId?: string; selectFiles?: boolean } = {},
+    ): Promise<StirlingFile[]> => {
+      // Merge default options with passed options - passed options take precedence
+      const mergedOptions = { selectFiles: true, ...options };
+      // Let FileContext handle deduplication with quickKey logic
+      const result = await actions.addFiles(files, mergedOptions);
+      return result;
+    },
+    [actions.addFiles],
+  );
 
   return {
     addFiles,
diff --git a/frontend/src/core/hooks/useFileManager.ts b/frontend/src/core/hooks/useFileManager.ts
index 073451f74e..51f7c3c2ee 100644
--- a/frontend/src/core/hooks/useFileManager.ts
+++ b/frontend/src/core/hooks/useFileManager.ts
@@ -1,10 +1,10 @@
-import { useState, useCallback } from 'react';
-import { useIndexedDB } from '@app/contexts/IndexedDBContext';
-import { fileStorage } from '@app/services/fileStorage';
-import { StirlingFileStub, StirlingFile } from '@app/types/fileContext';
-import { FileId } from '@app/types/fileContext';
-import apiClient from '@app/services/apiClient';
-import { useAppConfig } from '@app/contexts/AppConfigContext';
+import { useState, useCallback } from "react";
+import { useIndexedDB } from "@app/contexts/IndexedDBContext";
+import { fileStorage } from "@app/services/fileStorage";
+import { StirlingFileStub, StirlingFile } from "@app/types/fileContext";
+import { FileId } from "@app/types/fileContext";
+import apiClient from "@app/services/apiClient";
+import { useAppConfig } from "@app/contexts/AppConfigContext";
 
 interface StoredFileResponse {
   id: number;
@@ -36,56 +36,66 @@ export const useFileManager = () => {
   const indexedDB = useIndexedDB();
   const { config } = useAppConfig();
 
-  const normalizeServerFileName = useCallback((fileName: string | undefined | null): string => {
-    const fallback = fileName?.trim() || 'server-file';
-    const lowerName = fallback.toLowerCase();
-    const historySuffix = '-history.zip';
-    if (lowerName.endsWith(historySuffix)) {
-      return fallback.slice(0, fallback.length - historySuffix.length) || fallback;
-    }
-    if (lowerName.endsWith('.zip')) {
-      const knownInnerExt = [
-        'pdf',
-        'doc',
-        'docx',
-        'ppt',
-        'pptx',
-        'xls',
-        'xlsx',
-        'png',
-        'jpg',
-        'jpeg',
-        'tif',
-        'tiff',
-        'txt',
-        'csv',
-        'rtf',
-        'html',
-        'epub',
-      ];
-      for (const ext of knownInnerExt) {
-        if (lowerName.endsWith(`.${ext}.zip`)) {
-          return fallback.slice(0, fallback.length - 4) || fallback;
+  const normalizeServerFileName = useCallback(
+    (fileName: string | undefined | null): string => {
+      const fallback = fileName?.trim() || "server-file";
+      const lowerName = fallback.toLowerCase();
+      const historySuffix = "-history.zip";
+      if (lowerName.endsWith(historySuffix)) {
+        return (
+          fallback.slice(0, fallback.length - historySuffix.length) || fallback
+        );
+      }
+      if (lowerName.endsWith(".zip")) {
+        const knownInnerExt = [
+          "pdf",
+          "doc",
+          "docx",
+          "ppt",
+          "pptx",
+          "xls",
+          "xlsx",
+          "png",
+          "jpg",
+          "jpeg",
+          "tif",
+          "tiff",
+          "txt",
+          "csv",
+          "rtf",
+          "html",
+          "epub",
+        ];
+        for (const ext of knownInnerExt) {
+          if (lowerName.endsWith(`.${ext}.zip`)) {
+            return fallback.slice(0, fallback.length - 4) || fallback;
+          }
         }
       }
-    }
-    return fallback;
-  }, []);
+      return fallback;
+    },
+    [],
+  );
 
-  const convertToFile = useCallback(async (fileStub: StirlingFileStub): Promise<File> => {
-    if (!indexedDB) {
-      throw new Error('IndexedDB context not available');
-    }
-
-    // Regular file loading
-    if (fileStub.id) {
-      const file = await indexedDB.loadFile(fileStub.id);
-      if (file) {
-        return file;
+  const convertToFile = useCallback(
+    async (fileStub: StirlingFileStub): Promise<File> => {
+      if (!indexedDB) {
+        throw new Error("IndexedDB context not available");
       }
-    }
-    throw new Error(`File not found in storage: ${fileStub.name} (ID: ${fileStub.id})`);
-  }, [indexedDB]);
+
+      // Regular file loading
+      if (fileStub.id) {
+        const file = await indexedDB.loadFile(fileStub.id);
+        if (file) {
+          return file;
+        }
+      }
+      throw new Error(
+        `File not found in storage: ${fileStub.name} (ID: ${fileStub.id})`,
+      );
+    },
+    [indexedDB],
+  );
 
   const loadRecentFiles = useCallback(async (): Promise<StirlingFileStub[]> => {
     setLoading(true);
@@ -99,7 +109,7 @@ export const useFileManager = () => {
       const remoteIdSet = new Set(
         stirlingFileStubs
           .map((stub) => stub.remoteStorageId)
-          .filter((id): id is number => typeof id === 'number')
+          .filter((id): id is number => typeof id === "number"),
       );
       let combinedStubs = stirlingFileStubs;
 
@@ -108,14 +118,17 @@ export const useFileManager = () => {
       if (shouldFetchServerFiles) {
         try {
           const response = await apiClient.get<StoredFileResponse[]>(
-            '/api/v1/storage/files',
-            { suppressErrorToast: true, skipAuthRedirect: true } as any
+            "/api/v1/storage/files",
+            {
+              suppressErrorToast: true,
+              skipAuthRedirect: true,
+            } as any,
           );
           const serverFiles = Array.isArray(response.data) ? response.data : [];
           const serverStubs: StirlingFileStub[] = [];
           const serverMap = new Map<number, StoredFileResponse>();
           serverFiles.forEach((file) => {
-            if (file && typeof file.id === 'number') {
+            if (file && typeof file.id === "number") {
               serverMap.set(file.id, file);
             }
           });
@@ -144,7 +157,10 @@ export const useFileManager = () => {
               };
             }
             // If this server file is a signing-workflow file, detach it from the file manager
-            if (serverFile.filePurpose && serverFile.filePurpose !== 'generic') {
+            if (
+              serverFile.filePurpose &&
+              serverFile.filePurpose !== "generic"
+            ) {
               return {
                 ...stub,
                 remoteStorageId: undefined,
@@ -159,48 +175,50 @@ export const useFileManager = () => {
             const updatedAtMs = serverFile.updatedAt
               ? new Date(serverFile.updatedAt).getTime()
               : serverFile.createdAt
-              ? new Date(serverFile.createdAt).getTime()
-              : undefined;
+                ? new Date(serverFile.createdAt).getTime()
+                : undefined;
             return {
               ...stub,
               remoteOwnerUsername: serverFile.owner ?? stub.remoteOwnerUsername,
               remoteOwnedByCurrentUser:
-                typeof serverFile.ownedByCurrentUser === 'boolean'
+                typeof serverFile.ownedByCurrentUser === "boolean"
                   ? serverFile.ownedByCurrentUser
                   : stub.remoteOwnedByCurrentUser,
               remoteAccessRole: serverFile.accessRole ?? stub.remoteAccessRole,
               remoteSharedViaLink: stub.remoteSharedViaLink,
               remoteHasShareLinks: Boolean(serverFile.shareLinks?.length),
               remoteStorageUpdatedAt:
-                typeof updatedAtMs === 'number' && Number.isFinite(updatedAtMs)
+                typeof updatedAtMs === "number" && Number.isFinite(updatedAtMs)
                   ? updatedAtMs
                   : stub.remoteStorageUpdatedAt,
             };
           });
 
           for (const file of serverFiles) {
-            if (!file || typeof file.id !== 'number') {
+            if (!file || typeof file.id !== "number") {
               continue;
             }
             if (remoteIdSet.has(file.id)) {
               continue;
             }
             // Skip signing-workflow files — only accessible via SignPopout
-            if (file.filePurpose && file.filePurpose !== 'generic') {
+            if (file.filePurpose && file.filePurpose !== "generic") {
               continue;
             }
             const updatedAtMs = file.updatedAt
               ? new Date(file.updatedAt).getTime()
               : file.createdAt
-              ? new Date(file.createdAt).getTime()
-              : Date.now();
+                ? new Date(file.createdAt).getTime()
+                : Date.now();
             const name = normalizeServerFileName(file.fileName);
-            const lastModified = Number.isFinite(updatedAtMs) ? updatedAtMs : Date.now();
+            const lastModified = Number.isFinite(updatedAtMs)
+              ? updatedAtMs
+              : Date.now();
             const id = `server-${file.id}` as FileId;
             serverStubs.push({
               id,
               name,
-              type: file.contentType || 'application/octet-stream',
+              type: file.contentType || "application/octet-stream",
               size: file.sizeBytes ?? 0,
               lastModified,
               createdAt: lastModified,
@@ -213,7 +231,7 @@ export const useFileManager = () => {
               remoteStorageUpdatedAt: lastModified,
               remoteOwnerUsername: file.owner ?? undefined,
               remoteOwnedByCurrentUser:
-                typeof file.ownedByCurrentUser === 'boolean'
+                typeof file.ownedByCurrentUser === "boolean"
                   ? file.ownedByCurrentUser
                   : undefined,
               remoteAccessRole: file.accessRole ?? undefined,
@@ -224,40 +242,34 @@ export const useFileManager = () => {
 
           combinedStubs = [...updatedLocalStubs, ...serverStubs];
         } catch (error) {
-          console.warn('Failed to load server files:', error);
+          console.warn("Failed to load server files:", error);
         }
 
         if (config?.storageShareLinksEnabled === true) {
           try {
-          const sharedResponse = await apiClient.get<AccessedShareLinkResponse[]>(
-            '/api/v1/storage/share-links/accessed',
-            { suppressErrorToast: true, skipAuthRedirect: true } as any
-          );
-          const sharedLinks = Array.isArray(sharedResponse.data) ? sharedResponse.data : [];
-          const allowedShareTokens = new Set(
-            sharedLinks
-              .map((link) => link.shareToken)
-              .filter((token): token is string => Boolean(token))
-          );
-          const shareClearUpdates: Array<Promise<boolean>> = [];
-          combinedStubs = combinedStubs.map((stub) => {
-            if (
-              stub.remoteSharedViaLink &&
-              stub.remoteShareToken &&
-              !allowedShareTokens.has(stub.remoteShareToken)
-            ) {
-              const cleared = {
-                ...stub,
-                remoteStorageId: undefined,
-                remoteStorageUpdatedAt: undefined,
-                remoteOwnerUsername: undefined,
-                remoteOwnedByCurrentUser: undefined,
-                remoteSharedViaLink: false,
-                remoteHasShareLinks: undefined,
-                remoteShareToken: undefined,
-              };
-              shareClearUpdates.push(
-                fileStorage.updateFileMetadata(stub.id, {
+            const sharedResponse = await apiClient.get<
+              AccessedShareLinkResponse[]
+            >("/api/v1/storage/share-links/accessed", {
+              suppressErrorToast: true,
+              skipAuthRedirect: true,
+            } as any);
+            const sharedLinks = Array.isArray(sharedResponse.data)
+              ? sharedResponse.data
+              : [];
+            const allowedShareTokens = new Set(
+              sharedLinks
+                .map((link) => link.shareToken)
+                .filter((token): token is string => Boolean(token)),
+            );
+            const shareClearUpdates: Array<Promise<boolean>> = [];
+            combinedStubs = combinedStubs.map((stub) => {
+              if (
+                stub.remoteSharedViaLink &&
+                stub.remoteShareToken &&
+                !allowedShareTokens.has(stub.remoteShareToken)
+              ) {
+                const cleared = {
+                  ...stub,
                   remoteStorageId: undefined,
                   remoteStorageUpdatedAt: undefined,
                   remoteOwnerUsername: undefined,
@@ -265,183 +277,223 @@ export const useFileManager = () => {
                   remoteSharedViaLink: false,
                   remoteHasShareLinks: undefined,
                   remoteShareToken: undefined,
-                })
-              );
-              return cleared;
-            }
-            return stub;
-          });
-          if (shareClearUpdates.length > 0) {
-            await Promise.all(shareClearUpdates);
-          }
-          const existingShareTokens = new Set(
-            combinedStubs
-              .map((stub) => stub.remoteShareToken)
-              .filter((token): token is string => Boolean(token))
-          );
-          const sharedStubs: StirlingFileStub[] = [];
-
-          for (const link of sharedLinks) {
-            if (!link || !link.shareToken) {
-              continue;
-            }
-            if (existingShareTokens.has(link.shareToken)) {
-              continue;
-            }
-            const createdAtMs = link.lastAccessedAt
-              ? new Date(link.lastAccessedAt).getTime()
-              : link.createdAt
-              ? new Date(link.createdAt).getTime()
-              : Date.now();
-            const lastModified = Number.isFinite(createdAtMs) ? createdAtMs : Date.now();
-            const name = normalizeServerFileName(link.fileName || 'shared-file');
-            const id = `shared-${link.shareToken}` as FileId;
-            sharedStubs.push({
-              id,
-              name,
-              type: 'application/octet-stream',
-              size: 0,
-              lastModified,
-              createdAt: lastModified,
-              isLeaf: true,
-              originalFileId: id,
-              versionNumber: 1,
-              toolHistory: [],
-              quickKey: `${name}|0|${lastModified}`,
-              remoteStorageId: link.fileId ?? undefined,
-              remoteStorageUpdatedAt: lastModified,
-              remoteOwnerUsername: link.owner ?? undefined,
-              remoteOwnedByCurrentUser: false,
-              remoteSharedViaLink: true,
-              remoteHasShareLinks: false,
-              remoteShareToken: link.shareToken,
+                };
+                shareClearUpdates.push(
+                  fileStorage.updateFileMetadata(stub.id, {
+                    remoteStorageId: undefined,
+                    remoteStorageUpdatedAt: undefined,
+                    remoteOwnerUsername: undefined,
+                    remoteOwnedByCurrentUser: undefined,
+                    remoteSharedViaLink: false,
+                    remoteHasShareLinks: undefined,
+                    remoteShareToken: undefined,
+                  }),
+                );
+                return cleared;
+              }
+              return stub;
             });
-          }
+            if (shareClearUpdates.length > 0) {
+              await Promise.all(shareClearUpdates);
+            }
+            const existingShareTokens = new Set(
+              combinedStubs
+                .map((stub) => stub.remoteShareToken)
+                .filter((token): token is string => Boolean(token)),
+            );
+            const sharedStubs: StirlingFileStub[] = [];
 
-          combinedStubs = [...combinedStubs, ...sharedStubs];
+            for (const link of sharedLinks) {
+              if (!link || !link.shareToken) {
+                continue;
+              }
+              if (existingShareTokens.has(link.shareToken)) {
+                continue;
+              }
+              const createdAtMs = link.lastAccessedAt
+                ? new Date(link.lastAccessedAt).getTime()
+                : link.createdAt
+                  ? new Date(link.createdAt).getTime()
+                  : Date.now();
+              const lastModified = Number.isFinite(createdAtMs)
+                ? createdAtMs
+                : Date.now();
+              const name = normalizeServerFileName(
+                link.fileName || "shared-file",
+              );
+              const id = `shared-${link.shareToken}` as FileId;
+              sharedStubs.push({
+                id,
+                name,
+                type: "application/octet-stream",
+                size: 0,
+                lastModified,
+                createdAt: lastModified,
+                isLeaf: true,
+                originalFileId: id,
+                versionNumber: 1,
+                toolHistory: [],
+                quickKey: `${name}|0|${lastModified}`,
+                remoteStorageId: link.fileId ?? undefined,
+                remoteStorageUpdatedAt: lastModified,
+                remoteOwnerUsername: link.owner ?? undefined,
+                remoteOwnedByCurrentUser: false,
+                remoteSharedViaLink: true,
+                remoteHasShareLinks: false,
+                remoteShareToken: link.shareToken,
+              });
+            }
+
+            combinedStubs = [...combinedStubs, ...sharedStubs];
           } catch (error) {
-            console.warn('Failed to load shared links:', error);
+            console.warn("Failed to load shared links:", error);
           }
         }
       }
 
       // For now, only regular files - drafts will be handled separately in the future
-      const sortedFiles = combinedStubs.sort((a, b) => (b.lastModified || 0) - (a.lastModified || 0));
+      const sortedFiles = combinedStubs.sort(
+        (a, b) => (b.lastModified || 0) - (a.lastModified || 0),
+      );
 
       return sortedFiles;
     } catch (error) {
-      console.error('Failed to load recent files:', error);
+      console.error("Failed to load recent files:", error);
       return [];
     } finally {
       setLoading(false);
     }
-  }, [indexedDB, config?.enableLogin, config?.storageEnabled, config?.storageShareLinksEnabled, normalizeServerFileName]);
-
-  const handleRemoveFile = useCallback(async (index: number, files: StirlingFileStub[], setFiles: (files: StirlingFileStub[]) => void) => {
-    const file = files[index];
-    if (!file.id) {
-      throw new Error('File ID is required for removal');
-    }
-    if (!indexedDB) {
-      throw new Error('IndexedDB context not available');
-    }
-    try {
-      await indexedDB.deleteFile(file.id);
-      setFiles(files.filter((_, i) => i !== index));
-    } catch (error) {
-      console.error('Failed to remove file:', error);
-      throw error;
-    }
-  }, [indexedDB]);
-
-  const storeFile = useCallback(async (file: File, fileId: FileId) => {
-    if (!indexedDB) {
-      throw new Error('IndexedDB context not available');
-    }
-    try {
-      // Store file with provided UUID from FileContext (thumbnail generated internally)
-      const metadata = await indexedDB.saveFile(file, fileId);
-
-      // Convert file to ArrayBuffer for storage compatibility
-      const arrayBuffer = await file.arrayBuffer();
-
-      // This method is deprecated - use FileStorage directly instead
-      return {
-        id: fileId,
-        name: file.name,
-        type: file.type,
-        size: file.size,
-        lastModified: file.lastModified,
-        data: arrayBuffer,
-        thumbnail: metadata.thumbnailUrl
-      };
-    } catch (error) {
-      console.error('Failed to store file:', error);
-      throw error;
-    }
-  }, [indexedDB]);
-
-  const createFileSelectionHandlers = useCallback((
-    selectedFiles: FileId[],
-    setSelectedFiles: (files: FileId[]) => void
-  ) => {
-    const toggleSelection = (fileId: FileId) => {
-      setSelectedFiles(
-        selectedFiles.includes(fileId)
-          ? selectedFiles.filter(id => id !== fileId)
-          : [...selectedFiles, fileId]
-      );
-    };
-
-    const clearSelection = () => {
-      setSelectedFiles([]);
-    };
-
-    const selectMultipleFiles = async (files: StirlingFileStub[], onStirlingFilesSelect: (stirlingFiles: StirlingFile[]) => void) => {
-      if (selectedFiles.length === 0) return;
+  }, [
+    indexedDB,
+    config?.enableLogin,
+    config?.storageEnabled,
+    config?.storageShareLinksEnabled,
+    normalizeServerFileName,
+  ]);
 
+  const handleRemoveFile = useCallback(
+    async (
+      index: number,
+      files: StirlingFileStub[],
+      setFiles: (files: StirlingFileStub[]) => void,
+    ) => {
+      const file = files[index];
+      if (!file.id) {
+        throw new Error("File ID is required for removal");
+      }
+      if (!indexedDB) {
+        throw new Error("IndexedDB context not available");
+      }
       try {
-        // Filter by UUID and load full StirlingFile objects directly
-        const selectedFileObjects = files.filter(f => selectedFiles.includes(f.id));
-
-        const stirlingFiles = await Promise.all(
-          selectedFileObjects.map(async (stub) => {
-            const stirlingFile = await fileStorage.getStirlingFile(stub.id);
-            if (!stirlingFile) {
-              throw new Error(`File not found in storage: ${stub.name}`);
-            }
-            return stirlingFile;
-          })
-        );
-
-        onStirlingFilesSelect(stirlingFiles);
-        clearSelection();
+        await indexedDB.deleteFile(file.id);
+        setFiles(files.filter((_, i) => i !== index));
       } catch (error) {
-        console.error('Failed to load selected files:', error);
+        console.error("Failed to remove file:", error);
         throw error;
       }
-    };
+    },
+    [indexedDB],
+  );
 
-    return {
-      toggleSelection,
-      clearSelection,
-      selectMultipleFiles
-    };
-  }, [convertToFile]);
+  const storeFile = useCallback(
+    async (file: File, fileId: FileId) => {
+      if (!indexedDB) {
+        throw new Error("IndexedDB context not available");
+      }
+      try {
+        // Store file with provided UUID from FileContext (thumbnail generated internally)
+        const metadata = await indexedDB.saveFile(file, fileId);
 
-  const touchFile = useCallback(async (id: FileId) => {
-    if (!indexedDB) {
-      console.warn('IndexedDB context not available for touch operation');
-      return;
-    }
-    try {
-      // Update access time - this will be handled by the cache in IndexedDBContext
-      // when the file is loaded, so we can just load it briefly to "touch" it
-      await indexedDB.loadFile(id);
-    } catch (error) {
-      console.error('Failed to touch file:', error);
-    }
-  }, [indexedDB]);
+        // Convert file to ArrayBuffer for storage compatibility
+        const arrayBuffer = await file.arrayBuffer();
+
+        // This method is deprecated - use FileStorage directly instead
+        return {
+          id: fileId,
+          name: file.name,
+          type: file.type,
+          size: file.size,
+          lastModified: file.lastModified,
+          data: arrayBuffer,
+          thumbnail: metadata.thumbnailUrl,
+        };
+      } catch (error) {
+        console.error("Failed to store file:", error);
+        throw error;
+      }
+    },
+    [indexedDB],
+  );
+
+  const createFileSelectionHandlers = useCallback(
+    (selectedFiles: FileId[], setSelectedFiles: (files: FileId[]) => void) => {
+      const toggleSelection = (fileId: FileId) => {
+        setSelectedFiles(
+          selectedFiles.includes(fileId)
+            ? selectedFiles.filter((id) => id !== fileId)
+            : [...selectedFiles, fileId],
+        );
+      };
+
+      const clearSelection = () => {
+        setSelectedFiles([]);
+      };
+
+      const selectMultipleFiles = async (
+        files: StirlingFileStub[],
+        onStirlingFilesSelect: (stirlingFiles: StirlingFile[]) => void,
+      ) => {
+        if (selectedFiles.length === 0) return;
+
+        try {
+          // Filter by UUID and load full StirlingFile objects directly
+          const selectedFileObjects = files.filter((f) =>
+            selectedFiles.includes(f.id),
+          );
+
+          const stirlingFiles = await Promise.all(
+            selectedFileObjects.map(async (stub) => {
+              const stirlingFile = await fileStorage.getStirlingFile(stub.id);
+              if (!stirlingFile) {
+                throw new Error(`File not found in storage: ${stub.name}`);
+              }
+              return stirlingFile;
+            }),
+          );
+
+          onStirlingFilesSelect(stirlingFiles);
+          clearSelection();
+        } catch (error) {
+          console.error("Failed to load selected files:", error);
+          throw error;
+        }
+      };
+
+      return {
+        toggleSelection,
+        clearSelection,
+        selectMultipleFiles,
+      };
+    },
+    [convertToFile],
+  );
+
+  const touchFile = useCallback(
+    async (id: FileId) => {
+      if (!indexedDB) {
+        console.warn("IndexedDB context not available for touch operation");
+        return;
+      }
+      try {
+        // Update access time - this will be handled by the cache in IndexedDBContext
+        // when the file is loaded, so we can just load it briefly to "touch" it
+        await indexedDB.loadFile(id);
+      } catch (error) {
+        console.error("Failed to touch file:", error);
+      }
+    },
+    [indexedDB],
+  );
 
   return {
     loading,
@@ -450,6 +502,6 @@ export const useFileManager = () => {
     handleRemoveFile,
     storeFile,
     touchFile,
-    createFileSelectionHandlers
+    createFileSelectionHandlers,
   };
 };
diff --git a/frontend/src/core/hooks/useFileWithUrl.ts b/frontend/src/core/hooks/useFileWithUrl.ts
index 6c331e6964..eb6f4a92f7 100644
--- a/frontend/src/core/hooks/useFileWithUrl.ts
+++ b/frontend/src/core/hooks/useFileWithUrl.ts
@@ -1,17 +1,19 @@
-import { useMemo, useEffect } from 'react';
-import { isFileObject } from '@app/types/fileContext';
+import { useMemo, useEffect } from "react";
+import { isFileObject } from "@app/types/fileContext";
 
 /**
  * Hook to convert a File object to { file: File; url: string } format
  * Creates blob URL on-demand and revokes it when file changes or component unmounts.
  */
-export function useFileWithUrl(file: File | Blob | null): { file: File | Blob; url: string } | null {
+export function useFileWithUrl(
+  file: File | Blob | null,
+): { file: File | Blob; url: string } | null {
   const result = useMemo(() => {
     if (!file) return null;
 
     // Validate that file is a proper File, StirlingFile, or Blob object
     if (!isFileObject(file) && !(file instanceof Blob)) {
-      console.warn('useFileWithUrl: Expected File or Blob, got:', file);
+      console.warn("useFileWithUrl: Expected File or Blob, got:", file);
       return null;
     }
 
@@ -19,7 +21,11 @@ export function useFileWithUrl(file: File | Blob | null): { file: File | Blob; u
       const url = URL.createObjectURL(file);
       return { file, url };
     } catch (error) {
-      console.error('useFileWithUrl: Failed to create object URL:', error, file);
+      console.error(
+        "useFileWithUrl: Failed to create object URL:",
+        error,
+        file,
+      );
       return null;
     }
   }, [file]);
diff --git a/frontend/src/core/hooks/useFocusTrap.ts b/frontend/src/core/hooks/useFocusTrap.ts
index 0fa783bdb4..b8484f4784 100644
--- a/frontend/src/core/hooks/useFocusTrap.ts
+++ b/frontend/src/core/hooks/useFocusTrap.ts
@@ -1,15 +1,18 @@
-import { useEffect, RefObject } from 'react';
+import { useEffect, RefObject } from "react";
 
 const FOCUSABLE_ELEMENTS = [
-  'a[href]',
-  'button:not([disabled])',
-  'input:not([disabled])',
-  'select:not([disabled])',
-  'textarea:not([disabled])',
+  "a[href]",
+  "button:not([disabled])",
+  "input:not([disabled])",
+  "select:not([disabled])",
+  "textarea:not([disabled])",
   '[tabindex]:not([tabindex="-1"])',
-].join(', ');
+].join(", ");
 
-export function useFocusTrap(containerRef: RefObject<HTMLElement | null>, enabled: boolean = true) {
+export function useFocusTrap(
+  containerRef: RefObject<HTMLElement | null>,
+  enabled: boolean = true,
+) {
   useEffect(() => {
     if (!enabled || !containerRef.current) {
       return;
@@ -20,7 +23,7 @@ export function useFocusTrap(containerRef: RefObject<HTMLElement | null>, enable
       Array.from(container.querySelectorAll<HTMLElement>(FOCUSABLE_ELEMENTS));
 
     const handleKeyDown = (event: KeyboardEvent) => {
-      if (event.key !== 'Tab') {
+      if (event.key !== "Tab") {
         return;
       }
 
@@ -65,12 +68,10 @@ export function useFocusTrap(containerRef: RefObject<HTMLElement | null>, enable
       }, 100);
     }
 
-    document.addEventListener('keydown', handleKeyDown);
+    document.addEventListener("keydown", handleKeyDown);
 
     return () => {
-      document.removeEventListener('keydown', handleKeyDown);
+      document.removeEventListener("keydown", handleKeyDown);
     };
   }, [containerRef, enabled]);
 }
-
-
diff --git a/frontend/src/core/hooks/useFooterInfo.ts b/frontend/src/core/hooks/useFooterInfo.ts
index 315c1bc043..4e0ddca2eb 100644
--- a/frontend/src/core/hooks/useFooterInfo.ts
+++ b/frontend/src/core/hooks/useFooterInfo.ts
@@ -1,5 +1,5 @@
-import { useState, useEffect } from 'react';
-import apiClient from '@app/services/apiClient';
+import { useState, useEffect } from "react";
+import apiClient from "@app/services/apiClient";
 
 export interface FooterInfo {
   analyticsEnabled?: boolean;
@@ -23,13 +23,16 @@ export function useFooterInfo() {
     const fetchFooterInfo = async () => {
       try {
         setLoading(true);
-        const response = await apiClient.get<FooterInfo>('/api/v1/ui-data/footer-info', {
-          suppressErrorToast: true,
-        } as any);
+        const response = await apiClient.get<FooterInfo>(
+          "/api/v1/ui-data/footer-info",
+          {
+            suppressErrorToast: true,
+          } as any,
+        );
         setFooterInfo(response.data);
         setError(null);
       } catch (err) {
-        console.error('[useFooterInfo] Failed to fetch footer info:', err);
+        console.error("[useFooterInfo] Failed to fetch footer info:", err);
         setError(err as Error);
         // Set defaults on error
         setFooterInfo({
diff --git a/frontend/src/core/hooks/useFrontendVersionInfo.ts b/frontend/src/core/hooks/useFrontendVersionInfo.ts
index 98dede73cc..94cadc4cb0 100644
--- a/frontend/src/core/hooks/useFrontendVersionInfo.ts
+++ b/frontend/src/core/hooks/useFrontendVersionInfo.ts
@@ -3,6 +3,8 @@ export interface FrontendVersionInfo {
   mismatchVersion: boolean;
 }
 
-export function useFrontendVersionInfo(_backendVersion: string | undefined): FrontendVersionInfo {
+export function useFrontendVersionInfo(
+  _backendVersion: string | undefined,
+): FrontendVersionInfo {
   return { appVersion: undefined, mismatchVersion: false };
 }
diff --git a/frontend/src/core/hooks/useGoogleDrivePicker.ts b/frontend/src/core/hooks/useGoogleDrivePicker.ts
index 1e9e0b4882..901270553d 100644
--- a/frontend/src/core/hooks/useGoogleDrivePicker.ts
+++ b/frontend/src/core/hooks/useGoogleDrivePicker.ts
@@ -2,14 +2,14 @@
  * React hook for Google Drive file picker
  */
 
-import { useState, useCallback, useEffect, useMemo } from 'react';
-import { useAppConfig } from '@app/contexts/AppConfigContext';
+import { useState, useCallback, useEffect, useMemo } from "react";
+import { useAppConfig } from "@app/contexts/AppConfigContext";
 import {
   getGoogleDrivePickerService,
   isGoogleDriveConfigured,
   getGoogleDriveConfig,
   extractGoogleDriveBackendConfig,
-} from '@app/services/googleDrivePickerService';
+} from "@app/services/googleDrivePickerService";
 
 interface UseGoogleDrivePickerOptions {
   multiple?: boolean;
@@ -36,7 +36,12 @@ export function useGoogleDrivePicker(): UseGoogleDrivePickerReturn {
   // Memoize backend config to only track Google Drive specific properties
   const googleDriveBackendConfig = useMemo(
     () => extractGoogleDriveBackendConfig(config),
-    [config?.googleDriveEnabled, config?.googleDriveClientId, config?.googleDriveApiKey, config?.googleDriveAppId]
+    [
+      config?.googleDriveEnabled,
+      config?.googleDriveClientId,
+      config?.googleDriveApiKey,
+      config?.googleDriveAppId,
+    ],
   );
 
   // Check if Google Drive is configured and reset initialization if disabled
@@ -57,7 +62,7 @@ export function useGoogleDrivePicker(): UseGoogleDrivePickerReturn {
 
     const googleDriveConfig = getGoogleDriveConfig(googleDriveBackendConfig);
     if (!googleDriveConfig) {
-      throw new Error('Google Drive is not configured');
+      throw new Error("Google Drive is not configured");
     }
 
     const service = getGoogleDrivePickerService();
@@ -71,7 +76,7 @@ export function useGoogleDrivePicker(): UseGoogleDrivePickerReturn {
   const openPicker = useCallback(
     async (options: UseGoogleDrivePickerOptions = {}): Promise<File[]> => {
       if (!isEnabled) {
-        setError('Google Drive is not configured');
+        setError("Google Drive is not configured");
         return [];
       }
 
@@ -91,15 +96,18 @@ export function useGoogleDrivePicker(): UseGoogleDrivePickerReturn {
 
         return files;
       } catch (err) {
-        const errorMessage = err instanceof Error ? err.message : 'Failed to open Google Drive picker';
+        const errorMessage =
+          err instanceof Error
+            ? err.message
+            : "Failed to open Google Drive picker";
         setError(errorMessage);
-        console.error('Google Drive picker error:', err);
+        console.error("Google Drive picker error:", err);
         return [];
       } finally {
         setIsLoading(false);
       }
     },
-    [isEnabled, initializeService]
+    [isEnabled, initializeService],
   );
 
   return {
diff --git a/frontend/src/core/hooks/useGroupEnabled.ts b/frontend/src/core/hooks/useGroupEnabled.ts
index 6c389f55f6..df35b551a8 100644
--- a/frontend/src/core/hooks/useGroupEnabled.ts
+++ b/frontend/src/core/hooks/useGroupEnabled.ts
@@ -1,6 +1,6 @@
-import { useState, useEffect, useRef } from 'react';
-import apiClient from '@app/services/apiClient';
-import type { GroupEnabledResult } from '@app/types/groupEnabled';
+import { useState, useEffect, useRef } from "react";
+import apiClient from "@app/services/apiClient";
+import type { GroupEnabledResult } from "@app/types/groupEnabled";
 
 export type { GroupEnabledResult };
 
@@ -9,19 +9,32 @@ export type { GroupEnabledResult };
  * Returns { enabled: null } while loading, then true/false with an optional reason.
  */
 export function useGroupEnabled(group: string): GroupEnabledResult {
-  const [result, setResult] = useState<GroupEnabledResult>({ enabled: null, unavailableReason: null });
+  const [result, setResult] = useState<GroupEnabledResult>({
+    enabled: null,
+    unavailableReason: null,
+  });
   const isMountedRef = useRef(true);
 
   useEffect(() => {
     isMountedRef.current = true;
-    return () => { isMountedRef.current = false; };
+    return () => {
+      isMountedRef.current = false;
+    };
   }, []);
 
   useEffect(() => {
     apiClient
-      .get<boolean>(`/api/v1/config/group-enabled?group=${encodeURIComponent(group)}`)
-      .then(res => { if (isMountedRef.current) setResult({ enabled: res.data, unavailableReason: null }); })
-      .catch(() => { if (isMountedRef.current) setResult({ enabled: false, unavailableReason: null }); });
+      .get<boolean>(
+        `/api/v1/config/group-enabled?group=${encodeURIComponent(group)}`,
+      )
+      .then((res) => {
+        if (isMountedRef.current)
+          setResult({ enabled: res.data, unavailableReason: null });
+      })
+      .catch(() => {
+        if (isMountedRef.current)
+          setResult({ enabled: false, unavailableReason: null });
+      });
   }, [group]);
 
   return result;
diff --git a/frontend/src/core/hooks/useGroupSigningEnabled.ts b/frontend/src/core/hooks/useGroupSigningEnabled.ts
index 42e5fdf5f8..88a69c5dd9 100644
--- a/frontend/src/core/hooks/useGroupSigningEnabled.ts
+++ b/frontend/src/core/hooks/useGroupSigningEnabled.ts
@@ -1,4 +1,4 @@
-import { useAppConfig } from '@app/contexts/AppConfigContext';
+import { useAppConfig } from "@app/contexts/AppConfigContext";
 
 /**
  * Returns whether the shared (group) signing feature is available.
diff --git a/frontend/src/core/hooks/useIndexedDBThumbnail.ts b/frontend/src/core/hooks/useIndexedDBThumbnail.ts
index 174946335f..5ee9e45e26 100644
--- a/frontend/src/core/hooks/useIndexedDBThumbnail.ts
+++ b/frontend/src/core/hooks/useIndexedDBThumbnail.ts
@@ -4,14 +4,15 @@ import { useIndexedDB } from "@app/contexts/IndexedDBContext";
 import { generateThumbnailForFile } from "@app/utils/thumbnailUtils";
 import { FileId } from "@app/types/fileContext";
 
-
 /**
  * Hook for IndexedDB-aware thumbnail loading
  * Handles thumbnail generation for files not in IndexedDB
  */
-export function useIndexedDBThumbnail(file: StirlingFileStub | undefined | null): {
+export function useIndexedDBThumbnail(
+  file: StirlingFileStub | undefined | null,
+): {
   thumbnail: string | null;
-  isGenerating: boolean
+  isGenerating: boolean;
 } {
   const [thumb, setThumb] = useState<string | null>(null);
   const [generating, setGenerating] = useState(false);
@@ -42,11 +43,13 @@ export function useIndexedDBThumbnail(file: StirlingFileStub | undefined | null)
           if (file.id && indexedDB) {
             const loadedFile = await indexedDB.loadFile(file.id as FileId);
             if (!loadedFile) {
-              throw new Error('File not found in IndexedDB');
+              throw new Error("File not found in IndexedDB");
             }
             fileObject = loadedFile;
           } else {
-            throw new Error('File ID not available or IndexedDB context not available');
+            throw new Error(
+              "File ID not available or IndexedDB context not available",
+            );
           }
 
           // Use the universal thumbnail generator
@@ -59,12 +62,16 @@ export function useIndexedDBThumbnail(file: StirlingFileStub | undefined | null)
               try {
                 await indexedDB.updateThumbnail(file.id as FileId, thumbnail);
               } catch (error) {
-                console.warn('Failed to save thumbnail to IndexedDB:', error);
+                console.warn("Failed to save thumbnail to IndexedDB:", error);
               }
             }
           }
         } catch (error) {
-          console.warn('Failed to generate thumbnail for file', file.name, error);
+          console.warn(
+            "Failed to generate thumbnail for file",
+            file.name,
+            error,
+          );
           if (!cancelled) setThumb(null);
         } finally {
           if (!cancelled) setGenerating(false);
@@ -76,7 +83,9 @@ export function useIndexedDBThumbnail(file: StirlingFileStub | undefined | null)
     }
 
     loadThumbnail();
-    return () => { cancelled = true; };
+    return () => {
+      cancelled = true;
+    };
   }, [file, file?.thumbnailUrl, file?.id, indexedDB, generating]);
 
   return { thumbnail: thumb, isGenerating: generating };
diff --git a/frontend/src/core/hooks/useIsMobile.ts b/frontend/src/core/hooks/useIsMobile.ts
index 9446fe577d..23d4610418 100644
--- a/frontend/src/core/hooks/useIsMobile.ts
+++ b/frontend/src/core/hooks/useIsMobile.ts
@@ -1,11 +1,11 @@
-import { useMediaQuery } from '@mantine/hooks';
+import { useMediaQuery } from "@mantine/hooks";
 
 /**
  * Custom hook to detect mobile viewport
  * Uses a consistent breakpoint across the application
  */
 export const useIsMobile = (): boolean => {
-  return useMediaQuery('(max-width: 1024px)') ?? false;
+  return useMediaQuery("(max-width: 1024px)") ?? false;
 };
 
 /**
@@ -13,5 +13,5 @@ export const useIsMobile = (): boolean => {
  * Use for layouts that need a more compact single-column arrangement
  */
 export const useIsPhone = (): boolean => {
-  return useMediaQuery('(max-width: 768px)') ?? false;
+  return useMediaQuery("(max-width: 768px)") ?? false;
 };
diff --git a/frontend/src/core/hooks/useIsOverflowing.ts b/frontend/src/core/hooks/useIsOverflowing.ts
index b5e6d3962f..323f080274 100644
--- a/frontend/src/core/hooks/useIsOverflowing.ts
+++ b/frontend/src/core/hooks/useIsOverflowing.ts
@@ -1,5 +1,4 @@
-import * as React from 'react';
-
+import * as React from "react";
 
 /**
  Hook to detect if an element's content overflows its container
@@ -31,10 +30,14 @@ import * as React from 'react';
         );
 */
 
-
-export const useIsOverflowing = (ref: React.RefObject<HTMLElement | null>, callback?: (isOverflow: boolean) => void) => {
+export const useIsOverflowing = (
+  ref: React.RefObject<HTMLElement | null>,
+  callback?: (isOverflow: boolean) => void,
+) => {
   // State to track overflow status
-  const [isOverflow, setIsOverflow] = React.useState<boolean | undefined>(undefined);
+  const [isOverflow, setIsOverflow] = React.useState<boolean | undefined>(
+    undefined,
+  );
 
   React.useLayoutEffect(() => {
     const { current } = ref;
@@ -42,27 +45,27 @@ export const useIsOverflowing = (ref: React.RefObject<HTMLElement | null>, callb
     // Function to check if element is overflowing
     const trigger = () => {
       if (!current) return;
-      
+
       // Compare scroll height (total content height) vs client height (visible height)
       const hasOverflow = current.scrollHeight > current.clientHeight;
       setIsOverflow(hasOverflow);
-      
+
       // Call optional callback with overflow state
       if (callback) callback(hasOverflow);
     };
 
     if (current) {
       // Use ResizeObserver for modern browsers (real-time detection)
-      if ('ResizeObserver' in window) {
+      if ("ResizeObserver" in window) {
         const resizeObserver = new ResizeObserver(trigger);
         resizeObserver.observe(current);
-        
+
         // Cleanup function to disconnect observer
         return () => {
           resizeObserver.disconnect();
         };
       }
-      
+
       // Fallback for browsers without ResizeObserver support
       // Add a small delay to ensure the element is fully rendered
       setTimeout(trigger, 0);
@@ -70,4 +73,4 @@ export const useIsOverflowing = (ref: React.RefObject<HTMLElement | null>, callb
   }, [callback, ref]);
 
   return isOverflow;
-}; 
\ No newline at end of file
+};
diff --git a/frontend/src/core/hooks/useJwtConfigSync.ts b/frontend/src/core/hooks/useJwtConfigSync.ts
index 723d02d03f..361bf0c47f 100644
--- a/frontend/src/core/hooks/useJwtConfigSync.ts
+++ b/frontend/src/core/hooks/useJwtConfigSync.ts
@@ -1,25 +1,28 @@
-import { useEffect } from 'react';
+import { useEffect } from "react";
 
 /**
  * Core implementation: sets up the jwt-available event listener for OSS JWT auth,
  * and detects auth pages where config fetch should be skipped.
  */
-export function useJwtConfigSync(fetchConfig: (force?: boolean) => void): { isAuthPage: boolean } {
+export function useJwtConfigSync(fetchConfig: (force?: boolean) => void): {
+  isAuthPage: boolean;
+} {
   const currentPath = window.location.pathname;
   const isAuthPage =
-    currentPath.includes('/login') ||
-    currentPath.includes('/signup') ||
-    currentPath.includes('/auth/callback') ||
-    currentPath.includes('/invite/');
+    currentPath.includes("/login") ||
+    currentPath.includes("/signup") ||
+    currentPath.includes("/auth/callback") ||
+    currentPath.includes("/invite/");
 
   useEffect(() => {
     const handleJwtAvailable = () => {
-      console.debug('[AppConfig] JWT available event - refetching config');
+      console.debug("[AppConfig] JWT available event - refetching config");
       fetchConfig(true);
     };
 
-    window.addEventListener('jwt-available', handleJwtAvailable);
-    return () => window.removeEventListener('jwt-available', handleJwtAvailable);
+    window.addEventListener("jwt-available", handleJwtAvailable);
+    return () =>
+      window.removeEventListener("jwt-available", handleJwtAvailable);
   }, [fetchConfig]);
 
   return { isAuthPage };
diff --git a/frontend/src/core/hooks/useLicenseAlert.ts b/frontend/src/core/hooks/useLicenseAlert.ts
index a9035ef5ef..4372b2d996 100644
--- a/frontend/src/core/hooks/useLicenseAlert.ts
+++ b/frontend/src/core/hooks/useLicenseAlert.ts
@@ -1,12 +1,12 @@
-import { useEffect, useState } from 'react';
+import { useEffect, useState } from "react";
 import {
   UPGRADE_BANNER_ALERT_EVENT,
   type UpgradeBannerAlertPayload,
-} from '@app/constants/events';
+} from "@app/constants/events";
 
 export interface LicenseAlertState {
   active: boolean;
-  audience: 'admin' | 'user' | null;
+  audience: "admin" | "user" | null;
   totalUsers: number | null;
   freeTierLimit: number;
 }
@@ -22,7 +22,7 @@ export function useLicenseAlert(): LicenseAlertState {
   const [state, setState] = useState<LicenseAlertState>(defaultState);
 
   useEffect(() => {
-    if (typeof window === 'undefined') {
+    if (typeof window === "undefined") {
       return;
     }
 
@@ -31,9 +31,9 @@ export function useLicenseAlert(): LicenseAlertState {
       if (detail?.active) {
         setState({
           active: true,
-          audience: detail.audience ?? 'user',
+          audience: detail.audience ?? "user",
           totalUsers:
-            typeof detail.totalUsers === 'number' ? detail.totalUsers : null,
+            typeof detail.totalUsers === "number" ? detail.totalUsers : null,
           freeTierLimit: detail.freeTierLimit ?? 5,
         });
       } else {
@@ -41,13 +41,18 @@ export function useLicenseAlert(): LicenseAlertState {
       }
     };
 
-    window.addEventListener(UPGRADE_BANNER_ALERT_EVENT, handleAlert as EventListener);
+    window.addEventListener(
+      UPGRADE_BANNER_ALERT_EVENT,
+      handleAlert as EventListener,
+    );
 
     return () => {
-      window.removeEventListener(UPGRADE_BANNER_ALERT_EVENT, handleAlert as EventListener);
+      window.removeEventListener(
+        UPGRADE_BANNER_ALERT_EVENT,
+        handleAlert as EventListener,
+      );
     };
   }, []);
 
   return state;
 }
-
diff --git a/frontend/src/core/hooks/useLoginRequired.ts b/frontend/src/core/hooks/useLoginRequired.ts
index 3ed98bb1fe..a775b9e8c5 100644
--- a/frontend/src/core/hooks/useLoginRequired.ts
+++ b/frontend/src/core/hooks/useLoginRequired.ts
@@ -1,7 +1,7 @@
-import { useCallback } from 'react';
-import { useAppConfig } from '@app/contexts/AppConfigContext';
-import { alert } from '@app/components/toast';
-import { useTranslation } from 'react-i18next';
+import { useCallback } from "react";
+import { useAppConfig } from "@app/contexts/AppConfigContext";
+import { alert } from "@app/components/toast";
+import { useTranslation } from "react-i18next";
 
 /**
  * Hook to manage login-required functionality in admin sections
@@ -17,9 +17,12 @@ export function useLoginRequired() {
    */
   const showLoginRequiredAlert = useCallback(() => {
     alert({
-      alertType: 'warning',
-      title: t('admin.error', 'Error'),
-      body: t('admin.settings.loginRequired', 'Login mode must be enabled to modify admin settings'),
+      alertType: "warning",
+      title: t("admin.error", "Error"),
+      body: t(
+        "admin.settings.loginRequired",
+        "Login mode must be enabled to modify admin settings",
+      ),
     });
   }, [t]);
 
@@ -38,16 +41,17 @@ export function useLoginRequired() {
   /**
    * Wrap an async handler to check login state before executing
    */
-  const withLoginCheck = useCallback(<T extends (...args: any[]) => Promise<any>>(
-    handler: T
-  ): T => {
-    return (async (...args: any[]) => {
-      if (!validateLoginEnabled()) {
-        return;
-      }
-      return handler(...args);
-    }) as T;
-  }, [validateLoginEnabled]);
+  const withLoginCheck = useCallback(
+    <T extends (...args: any[]) => Promise<any>>(handler: T): T => {
+      return (async (...args: any[]) => {
+        if (!validateLoginEnabled()) {
+          return;
+        }
+        return handler(...args);
+      }) as T;
+    },
+    [validateLoginEnabled],
+  );
 
   /**
    * Get styles for disabled inputs (cursor not-allowed)
@@ -55,9 +59,9 @@ export function useLoginRequired() {
   const getDisabledStyles = useCallback(() => {
     if (!loginEnabled) {
       return {
-        input: { cursor: 'not-allowed' },
-        track: { cursor: 'not-allowed' },
-        thumb: { cursor: 'not-allowed' }
+        input: { cursor: "not-allowed" },
+        track: { cursor: "not-allowed" },
+        thumb: { cursor: "not-allowed" },
       };
     }
     return undefined;
@@ -66,18 +70,21 @@ export function useLoginRequired() {
   /**
    * Wrap fetch function to skip API call when login disabled
    */
-  const withLoginCheckForFetch = useCallback(<T extends (...args: any[]) => Promise<any>>(
-    fetchHandler: T,
-    skipWhenDisabled: boolean = true
-  ): T => {
-    return (async (...args: any[]) => {
-      if (!loginEnabled && skipWhenDisabled) {
-        // Skip fetch when login disabled - component will use default/empty values
-        return;
-      }
-      return fetchHandler(...args);
-    }) as T;
-  }, [loginEnabled]);
+  const withLoginCheckForFetch = useCallback(
+    <T extends (...args: any[]) => Promise<any>>(
+      fetchHandler: T,
+      skipWhenDisabled: boolean = true,
+    ): T => {
+      return (async (...args: any[]) => {
+        if (!loginEnabled && skipWhenDisabled) {
+          // Skip fetch when login disabled - component will use default/empty values
+          return;
+        }
+        return fetchHandler(...args);
+      }) as T;
+    },
+    [loginEnabled],
+  );
 
   return {
     loginEnabled,
diff --git a/frontend/src/core/hooks/useLogoAssets.test.ts b/frontend/src/core/hooks/useLogoAssets.test.ts
index 3f36d262da..3d314ba60b 100644
--- a/frontend/src/core/hooks/useLogoAssets.test.ts
+++ b/frontend/src/core/hooks/useLogoAssets.test.ts
@@ -1,31 +1,31 @@
-import { describe, expect, test } from 'vitest';
-import * as fs from 'fs';
-import * as path from 'path';
-import { LOGO_FOLDER_BY_VARIANT } from '@app/constants/logo';
-import type { LogoVariant } from '@app/services/preferencesService';
+import { describe, expect, test } from "vitest";
+import * as fs from "fs";
+import * as path from "path";
+import { LOGO_FOLDER_BY_VARIANT } from "@app/constants/logo";
+import type { LogoVariant } from "@app/services/preferencesService";
 
 /**
  * Tests that all required logo assets exist for each logo variant.
  * This ensures that when useLogoAssets returns paths, those files actually exist.
  */
-describe('useLogoAssets - Logo Asset Files', () => {
-  const publicDir = path.resolve(__dirname, '../../../public');
+describe("useLogoAssets - Logo Asset Files", () => {
+  const publicDir = path.resolve(__dirname, "../../../public");
 
   // All asset files that useLogoAssets references
   const requiredAssets = [
-    'logo-tooltip.svg',
-    'Firstpage.png',
-    'favicon.ico',
-    'logo192.png',
-    'logo512.png',
-    'StirlingPDFLogoWhiteText.svg',
-    'StirlingPDFLogoBlackText.svg',
-    'StirlingPDFLogoGreyText.svg',
+    "logo-tooltip.svg",
+    "Firstpage.png",
+    "favicon.ico",
+    "logo192.png",
+    "logo512.png",
+    "StirlingPDFLogoWhiteText.svg",
+    "StirlingPDFLogoBlackText.svg",
+    "StirlingPDFLogoGreyText.svg",
   ];
 
-  const logoVariants: LogoVariant[] = ['modern', 'classic'];
+  const logoVariants: LogoVariant[] = ["modern", "classic"];
 
-  describe.each(logoVariants)('%s logo variant', (variant) => {
+  describe.each(logoVariants)("%s logo variant", (variant) => {
     const folder = LOGO_FOLDER_BY_VARIANT[variant];
     const folderPath = path.join(publicDir, folder);
 
@@ -33,25 +33,24 @@ describe('useLogoAssets - Logo Asset Files', () => {
       expect(fs.existsSync(folderPath)).toBe(true);
     });
 
-    test.each(requiredAssets)('should have %s', (assetName) => {
+    test.each(requiredAssets)("should have %s", (assetName) => {
       const assetPath = path.join(folderPath, assetName);
       expect(
         fs.existsSync(assetPath),
-        `Missing asset: ${folder}/${assetName}`
+        `Missing asset: ${folder}/${assetName}`,
       ).toBe(true);
     });
   });
 
-  describe('manifest files', () => {
-    test('manifest.json should exist for modern variant', () => {
-      const manifestPath = path.join(publicDir, 'manifest.json');
+  describe("manifest files", () => {
+    test("manifest.json should exist for modern variant", () => {
+      const manifestPath = path.join(publicDir, "manifest.json");
       expect(fs.existsSync(manifestPath)).toBe(true);
     });
 
-    test('manifest-classic.json should exist for classic variant', () => {
-      const manifestPath = path.join(publicDir, 'manifest-classic.json');
+    test("manifest-classic.json should exist for classic variant", () => {
+      const manifestPath = path.join(publicDir, "manifest-classic.json");
       expect(fs.existsSync(manifestPath)).toBe(true);
     });
   });
 });
-
diff --git a/frontend/src/core/hooks/useLogoAssets.ts b/frontend/src/core/hooks/useLogoAssets.ts
index 4d80b0809a..8fd0ad4ba5 100644
--- a/frontend/src/core/hooks/useLogoAssets.ts
+++ b/frontend/src/core/hooks/useLogoAssets.ts
@@ -1,7 +1,7 @@
-import { useMemo } from 'react';
-import { BASE_PATH } from '@app/constants/app';
-import { getLogoFolder } from '@app/constants/logo';
-import { useLogoVariant } from '@app/hooks/useLogoVariant';
+import { useMemo } from "react";
+import { BASE_PATH } from "@app/constants/app";
+import { getLogoFolder } from "@app/constants/logo";
+import { useLogoVariant } from "@app/hooks/useLogoVariant";
 
 export function useLogoAssets() {
   const logoVariant = useLogoVariant();
@@ -15,20 +15,20 @@ export function useLogoAssets() {
       folder,
       folderPath,
       getAssetPath: (name: string) => `${folderPath}/${name}`,
+      wordmark: {
+        black: `${folderPath}/StirlingPDFLogoBlackText.svg`,
+        grey: `${folderPath}/StirlingPDFLogoGreyText.svg`,
+        white: `${folderPath}/StirlingPDFLogoWhiteText.svg`,
+      },
       tooltipLogo: `${folderPath}/logo-tooltip.svg`,
       firstPage: `${folderPath}/Firstpage.png`,
       favicon: `${folderPath}/favicon.ico`,
       logo192: `${folderPath}/logo192.png`,
       logo512: `${folderPath}/logo512.png`,
-      wordmark: {
-        white: `${folderPath}/StirlingPDFLogoWhiteText.svg`,
-        black: `${folderPath}/StirlingPDFLogoBlackText.svg`,
-        grey: `${folderPath}/StirlingPDFLogoGreyText.svg`,
-      },
-      manifestHref: logoVariant === 'classic'
-        ? `${BASE_PATH}/manifest-classic.json`
-        : `${BASE_PATH}/manifest.json`,
+      manifestHref:
+        logoVariant === "classic"
+          ? `${BASE_PATH}/manifest-classic.json`
+          : `${BASE_PATH}/manifest.json`,
     };
   }, [logoVariant]);
 }
-
diff --git a/frontend/src/core/hooks/useLogoPath.ts b/frontend/src/core/hooks/useLogoPath.ts
index a4901334cc..d1ccd9beec 100644
--- a/frontend/src/core/hooks/useLogoPath.ts
+++ b/frontend/src/core/hooks/useLogoPath.ts
@@ -1,22 +1,15 @@
-import { useMemo } from 'react';
-import { useMantineColorScheme } from '@mantine/core';
-import { useLogoAssets } from '@app/hooks/useLogoAssets';
+import { useMemo } from "react";
+import { useLogoAssets } from "@app/hooks/useLogoAssets";
 
-/**
- * Hook to get the correct logo path based on app config (logo style) and theme (light/dark)
- *
- * Logo styles:
- * - classic: classic S logo stored in /classic-logo
- * - modern: minimalist logo stored in /modern-logo
- *
- * @returns The path to the appropriate logo SVG file
- */
-export function useLogoPath(): string {
-  const { colorScheme } = useMantineColorScheme();
+/** Theme-specific no-text logo SVG URLs under the active variant folder (`modern-logo` / `classic-logo`). */
+export function useLogoPath(): { dark: string; light: string } {
   const { folderPath } = useLogoAssets();
 
-  return useMemo(() => {
-    const themeSuffix = colorScheme === 'dark' ? 'Dark' : 'Light';
-    return `${folderPath}/StirlingPDFLogoNoText${themeSuffix}.svg`;
-  }, [colorScheme, folderPath]);
+  return useMemo(
+    () => ({
+      dark: `${folderPath}/StirlingPDFLogoNoTextDark.svg`,
+      light: `${folderPath}/StirlingPDFLogoNoTextLight.svg`,
+    }),
+    [folderPath],
+  );
 }
diff --git a/frontend/src/core/hooks/useLogoVariant.ts b/frontend/src/core/hooks/useLogoVariant.ts
index 3df447c09c..49c251a71f 100644
--- a/frontend/src/core/hooks/useLogoVariant.ts
+++ b/frontend/src/core/hooks/useLogoVariant.ts
@@ -1,8 +1,8 @@
-import { useMemo } from 'react';
-import { usePreferences } from '@app/contexts/PreferencesContext';
-import { useAppConfig } from '@app/contexts/AppConfigContext';
-import type { LogoVariant } from '@app/services/preferencesService';
-import { ensureLogoVariant } from '@app/constants/logo';
+import { useMemo } from "react";
+import { usePreferences } from "@app/contexts/PreferencesContext";
+import { useAppConfig } from "@app/contexts/AppConfigContext";
+import type { LogoVariant } from "@app/services/preferencesService";
+import { ensureLogoVariant } from "@app/constants/logo";
 
 export function useLogoVariant(): LogoVariant {
   const { preferences } = usePreferences();
@@ -15,4 +15,3 @@ export function useLogoVariant(): LogoVariant {
     return ensureLogoVariant(preferenceVariant ?? configVariant);
   }, [config?.logoStyle, preferences.logoVariant]);
 }
-
diff --git a/frontend/src/core/hooks/useOs.ts b/frontend/src/core/hooks/useOs.ts
index 03bdf68bf7..e4b37ad3fe 100644
--- a/frontend/src/core/hooks/useOs.ts
+++ b/frontend/src/core/hooks/useOs.ts
@@ -1,40 +1,44 @@
-import { useEffect, useState } from 'react';
+import { useEffect, useState } from "react";
 
 export type OS =
-  | 'windows'
-  | 'mac-intel'
-  | 'mac-apple'
-  | 'linux-x64'
-  | 'linux-arm64'
-  | 'ios'
-  | 'android'
-  | 'unknown';
+  | "windows"
+  | "mac-intel"
+  | "mac-apple"
+  | "linux-x64"
+  | "linux-arm64"
+  | "ios"
+  | "android"
+  | "unknown";
 
 function parseUA(ua: string): OS {
   const uaLower = ua.toLowerCase();
 
   // iOS (includes iPadOS masquerading as Mac in some cases)
-  const isIOS = /iphone|ipad|ipod/.test(uaLower) || (ua.includes('Macintosh') && typeof window !== 'undefined' && 'ontouchstart' in window);
-  if (isIOS) return 'ios';
+  const isIOS =
+    /iphone|ipad|ipod/.test(uaLower) ||
+    (ua.includes("Macintosh") &&
+      typeof window !== "undefined" &&
+      "ontouchstart" in window);
+  if (isIOS) return "ios";
 
-  if (/android/.test(uaLower)) return 'android';
-  if (/windows nt/.test(uaLower)) return 'windows';
+  if (/android/.test(uaLower)) return "android";
+  if (/windows nt/.test(uaLower)) return "windows";
   if (/mac os x/.test(uaLower)) {
     // Default to Intel; refine via hints below
-    let detected: OS = 'mac-intel';
+    let detected: OS = "mac-intel";
     // Safari on Apple Silicon sometimes exposes both tokens
-    if (ua.includes('Apple') && ua.includes('ARM')) {
-      detected = 'mac-apple';
+    if (ua.includes("Apple") && ua.includes("ARM")) {
+      detected = "mac-apple";
     }
     return detected; // will be further refined via Client Hints if available
   }
-  if (/linux|x11/.test(uaLower)) return 'linux-x64';
+  if (/linux|x11/.test(uaLower)) return "linux-x64";
 
-  return 'unknown';
+  return "unknown";
 }
 
 export function useOs(): OS {
-  const [os, setOs] = useState<OS>('unknown');
+  const [os, setOs] = useState<OS>("unknown");
 
   useEffect(() => {
     let cancelled = false;
@@ -47,24 +51,29 @@ export function useOs(): OS {
       const uaData = (navigator as any).userAgentData;
       if (uaData?.getHighEntropyValues) {
         try {
-          const { platform, architecture, bitness } = await uaData.getHighEntropyValues([
-            'platform',
-            'architecture',
-            'bitness',
-            'platformVersion',
-          ]);
+          const { platform, architecture, bitness } =
+            await uaData.getHighEntropyValues([
+              "platform",
+              "architecture",
+              "bitness",
+              "platformVersion",
+            ]);
 
-          const plat = (platform || '').toLowerCase();
-          if (plat.includes('windows')) detected = 'windows';
-          else if (plat.includes('ios')) detected = 'ios';
-          else if (plat.includes('android')) detected = 'android';
-          else if (plat.includes('mac')) {
+          const plat = (platform || "").toLowerCase();
+          if (plat.includes("windows")) detected = "windows";
+          else if (plat.includes("ios")) detected = "ios";
+          else if (plat.includes("android")) detected = "android";
+          else if (plat.includes("mac")) {
             // CH “architecture� is often "arm" on Apple Silicon
-            detected = architecture?.toLowerCase().includes('arm') ? 'mac-apple' : 'mac-intel';
-          } else if (plat.includes('linux') || plat.includes('chrome os')) {
-            const archLower = (architecture || '').toLowerCase();
-            const isArm = archLower.includes('arm') || (bitness === '32' && /aarch|arm/.test(architecture || ''));
-            detected = isArm ? 'linux-arm64' : 'linux-x64';
+            detected = architecture?.toLowerCase().includes("arm")
+              ? "mac-apple"
+              : "mac-intel";
+          } else if (plat.includes("linux") || plat.includes("chrome os")) {
+            const archLower = (architecture || "").toLowerCase();
+            const isArm =
+              archLower.includes("arm") ||
+              (bitness === "32" && /aarch|arm/.test(architecture || ""));
+            detected = isArm ? "linux-arm64" : "linux-x64";
           }
         } catch {
           // ignore
@@ -85,5 +94,3 @@ export function useOs(): OS {
 
   return os;
 }
-
-
diff --git a/frontend/src/core/hooks/usePDFProcessor.ts b/frontend/src/core/hooks/usePDFProcessor.ts
index b116545e21..57b5388df4 100644
--- a/frontend/src/core/hooks/usePDFProcessor.ts
+++ b/frontend/src/core/hooks/usePDFProcessor.ts
@@ -1,126 +1,136 @@
-import { useState, useCallback } from 'react';
-import { PDFDocument, PDFPage } from '@app/types/pageEditor';
-import { pdfWorkerManager } from '@app/services/pdfWorkerManager';
-import { createQuickKey } from '@app/types/fileContext';
+import { useState, useCallback } from "react";
+import { PDFDocument, PDFPage } from "@app/types/pageEditor";
+import { pdfWorkerManager } from "@app/services/pdfWorkerManager";
+import { createQuickKey } from "@app/types/fileContext";
 
 export function usePDFProcessor() {
   const [loading, setLoading] = useState(false);
   const [error, setError] = useState<string | null>(null);
 
-  const generatePageThumbnail = useCallback(async (
-    file: File,
-    pageNumber: number,
-    scale: number = 0.5
-  ): Promise<string> => {
-    try {
-      const arrayBuffer = await file.arrayBuffer();
-      const pdf = await pdfWorkerManager.createDocument(arrayBuffer);
+  const generatePageThumbnail = useCallback(
+    async (
+      file: File,
+      pageNumber: number,
+      scale: number = 0.5,
+    ): Promise<string> => {
+      try {
+        const arrayBuffer = await file.arrayBuffer();
+        const pdf = await pdfWorkerManager.createDocument(arrayBuffer);
+        const page = await pdf.getPage(pageNumber);
+
+        const viewport = page.getViewport({ scale });
+        const canvas = document.createElement("canvas");
+        canvas.width = viewport.width;
+        canvas.height = viewport.height;
+
+        const context = canvas.getContext("2d");
+        if (!context) {
+          throw new Error("Could not get canvas context");
+        }
+
+        await page.render({ canvasContext: context, viewport, canvas }).promise;
+        const thumbnail = canvas.toDataURL();
+
+        // Clean up using worker manager
+        pdfWorkerManager.destroyDocument(pdf);
+
+        return thumbnail;
+      } catch (error) {
+        console.error("Failed to generate thumbnail:", error);
+        throw error;
+      }
+    },
+    [],
+  );
+
+  // Internal function to generate thumbnail from already-opened PDF
+  const generateThumbnailFromPDF = useCallback(
+    async (
+      pdf: any,
+      pageNumber: number,
+      scale: number = 0.5,
+    ): Promise<string> => {
       const page = await pdf.getPage(pageNumber);
 
       const viewport = page.getViewport({ scale });
-      const canvas = document.createElement('canvas');
+      const canvas = document.createElement("canvas");
       canvas.width = viewport.width;
       canvas.height = viewport.height;
 
-      const context = canvas.getContext('2d');
+      const context = canvas.getContext("2d");
       if (!context) {
-        throw new Error('Could not get canvas context');
+        throw new Error("Could not get canvas context");
       }
 
-      await page.render({ canvasContext: context, viewport, canvas }).promise;
-      const thumbnail = canvas.toDataURL();
+      await page.render({ canvasContext: context, viewport }).promise;
+      return canvas.toDataURL();
+    },
+    [],
+  );
 
-      // Clean up using worker manager
-      pdfWorkerManager.destroyDocument(pdf);
+  const processPDFFile = useCallback(
+    async (file: File): Promise<PDFDocument> => {
+      setLoading(true);
+      setError(null);
 
-      return thumbnail;
-    } catch (error) {
-      console.error('Failed to generate thumbnail:', error);
-      throw error;
-    }
-  }, []);
+      try {
+        const arrayBuffer = await file.arrayBuffer();
+        const pdf = await pdfWorkerManager.createDocument(arrayBuffer);
+        const totalPages = pdf.numPages;
 
-  // Internal function to generate thumbnail from already-opened PDF
-  const generateThumbnailFromPDF = useCallback(async (
-    pdf: any,
-    pageNumber: number,
-    scale: number = 0.5
-  ): Promise<string> => {
-    const page = await pdf.getPage(pageNumber);
+        const pages: PDFPage[] = [];
 
-    const viewport = page.getViewport({ scale });
-    const canvas = document.createElement('canvas');
-    canvas.width = viewport.width;
-    canvas.height = viewport.height;
-
-    const context = canvas.getContext('2d');
-    if (!context) {
-      throw new Error('Could not get canvas context');
-    }
-
-    await page.render({ canvasContext: context, viewport }).promise;
-    return canvas.toDataURL();
-  }, []);
-
-  const processPDFFile = useCallback(async (file: File): Promise<PDFDocument> => {
-    setLoading(true);
-    setError(null);
-
-    try {
-      const arrayBuffer = await file.arrayBuffer();
-      const pdf = await pdfWorkerManager.createDocument(arrayBuffer);
-      const totalPages = pdf.numPages;
-
-      const pages: PDFPage[] = [];
-
-      // Create pages without thumbnails initially - load them lazily
-      for (let i = 1; i <= totalPages; i++) {
-        pages.push({
-          id: `${createQuickKey(file)}-page-${i}`,
-          pageNumber: i,
-          originalPageNumber: i,
-          thumbnail: null, // Will be loaded lazily
-          rotation: 0,
-          selected: false
-        });
-      }
-
-      // Generate thumbnails for first 10 pages immediately using the same PDF instance
-      const priorityPages = Math.min(10, totalPages);
-      for (let i = 1; i <= priorityPages; i++) {
-        try {
-          const thumbnail = await generateThumbnailFromPDF(pdf, i);
-          pages[i - 1].thumbnail = thumbnail;
-        } catch (error) {
-          console.warn(`Failed to generate thumbnail for page ${i}:`, error);
+        // Create pages without thumbnails initially - load them lazily
+        for (let i = 1; i <= totalPages; i++) {
+          pages.push({
+            id: `${createQuickKey(file)}-page-${i}`,
+            pageNumber: i,
+            originalPageNumber: i,
+            thumbnail: null, // Will be loaded lazily
+            rotation: 0,
+            selected: false,
+          });
         }
+
+        // Generate thumbnails for first 10 pages immediately using the same PDF instance
+        const priorityPages = Math.min(10, totalPages);
+        for (let i = 1; i <= priorityPages; i++) {
+          try {
+            const thumbnail = await generateThumbnailFromPDF(pdf, i);
+            pages[i - 1].thumbnail = thumbnail;
+          } catch (error) {
+            console.warn(`Failed to generate thumbnail for page ${i}:`, error);
+          }
+        }
+
+        // Clean up using worker manager
+        pdfWorkerManager.destroyDocument(pdf);
+
+        const document: PDFDocument = {
+          id: `${Date.now()}-${Math.random().toString(36).substr(2, 9)}`,
+          name: file.name,
+          file,
+          pages,
+          totalPages,
+        };
+
+        return document;
+      } catch (error) {
+        const errorMessage =
+          error instanceof Error ? error.message : "Failed to process PDF";
+        setError(errorMessage);
+        throw error;
+      } finally {
+        setLoading(false);
       }
-
-      // Clean up using worker manager
-      pdfWorkerManager.destroyDocument(pdf);
-
-      const document: PDFDocument = {
-        id: `${Date.now()}-${Math.random().toString(36).substr(2, 9)}`,
-        name: file.name,
-        file,
-        pages,
-        totalPages
-      };
-
-      return document;
-    } catch (error) {
-      const errorMessage = error instanceof Error ? error.message : 'Failed to process PDF';
-      setError(errorMessage);
-      throw error;
-    } finally {
-      setLoading(false);
-    }
-  }, [generateThumbnailFromPDF]);
+    },
+    [generateThumbnailFromPDF],
+  );
 
   return {
     processPDFFile,
     generatePageThumbnail,
     loading,
-    error
+    error,
   };
 }
diff --git a/frontend/src/core/hooks/usePdfLibLinks.ts b/frontend/src/core/hooks/usePdfLibLinks.ts
index fb5cef19e2..9859af4157 100644
--- a/frontend/src/core/hooks/usePdfLibLinks.ts
+++ b/frontend/src/core/hooks/usePdfLibLinks.ts
@@ -1,9 +1,5 @@
-import { useState, useEffect, useRef } from 'react';
-import {
-  PdfLibLink,
-  extractLinksFromPage,
-} from '@app/utils/pdfLinkUtils';
-
+import { useState, useEffect, useRef } from "react";
+import { PdfLibLink, extractLinksFromPage } from "@app/utils/pdfLinkUtils";
 
 export type { PdfLibLink };
 
@@ -21,7 +17,10 @@ interface CachedDoc {
   /** Number of active consumers (hook instances) holding this entry. */
   refCount: number;
   /** Per-page extracted links (lazy, filled on first request). */
-  pageLinks: Map<number, { links: PdfLibLink[]; width: number; height: number }>;
+  pageLinks: Map<
+    number,
+    { links: PdfLibLink[]; width: number; height: number }
+  >;
   /** Set to true when the PDF is invalid, so we
    *  skip link extraction on all subsequent calls without retrying. */
   invalidDocument?: boolean;
@@ -59,8 +58,6 @@ function releaseDocument(url: string): void {
   });
 }
 
-
-
 export function usePdfLibLinks(
   pdfUrl: string | null,
   pageIndex: number,
@@ -82,7 +79,12 @@ export function usePdfLibLinks(
 
   useEffect(() => {
     if (!pdfUrl) {
-      setResult({ links: [], pdfPageWidth: 0, pdfPageHeight: 0, loading: false });
+      setResult({
+        links: [],
+        pdfPageWidth: 0,
+        pdfPageHeight: 0,
+        loading: false,
+      });
       return;
     }
 
@@ -100,7 +102,12 @@ export function usePdfLibLinks(
         }
 
         if (cached.invalidDocument) {
-          setResult({ links: [], pdfPageWidth: 0, pdfPageHeight: 0, loading: false });
+          setResult({
+            links: [],
+            pdfPageWidth: 0,
+            pdfPageHeight: 0,
+            loading: false,
+          });
           releaseDocument(url);
           return;
         }
@@ -108,14 +115,15 @@ export function usePdfLibLinks(
         let pageData = cached.pageLinks.get(pageIndex);
         if (!pageData) {
           try {
-            const { links, pdfPageWidth, pdfPageHeight } = await extractLinksFromPage(
-              cached.data,
-              pageIndex,
-            );
+            const { links, pdfPageWidth, pdfPageHeight } =
+              await extractLinksFromPage(cached.data, pageIndex);
             pageData = { links, width: pdfPageWidth, height: pdfPageHeight };
             cached.pageLinks.set(pageIndex, pageData);
           } catch (pageError) {
-            console.warn(`[usePdfLibLinks] Failed to read page ${pageIndex}:`, pageError);
+            console.warn(
+              `[usePdfLibLinks] Failed to read page ${pageIndex}:`,
+              pageError,
+            );
             pageData = { links: [], width: 0, height: 0 };
             cached.pageLinks.set(pageIndex, pageData);
           }
@@ -132,9 +140,14 @@ export function usePdfLibLinks(
 
         releaseDocument(url);
       } catch (error) {
-        console.warn('[usePdfLibLinks] Failed to extract links:', error);
+        console.warn("[usePdfLibLinks] Failed to extract links:", error);
         if (!cancelled && mountedRef.current) {
-          setResult({ links: [], pdfPageWidth: 0, pdfPageHeight: 0, loading: false });
+          setResult({
+            links: [],
+            pdfPageWidth: 0,
+            pdfPageHeight: 0,
+            loading: false,
+          });
         }
       }
     })();
diff --git a/frontend/src/core/hooks/usePdfSignatureDetection.ts b/frontend/src/core/hooks/usePdfSignatureDetection.ts
index cabfbb83db..0cfe016192 100644
--- a/frontend/src/core/hooks/usePdfSignatureDetection.ts
+++ b/frontend/src/core/hooks/usePdfSignatureDetection.ts
@@ -1,13 +1,15 @@
-import { useState, useEffect } from 'react';
-import { pdfWorkerManager } from '@app/services/pdfWorkerManager';
-import { StirlingFile } from '@app/types/fileContext';
+import { useState, useEffect } from "react";
+import { pdfWorkerManager } from "@app/services/pdfWorkerManager";
+import { StirlingFile } from "@app/types/fileContext";
 
 export interface PdfSignatureDetectionResult {
   hasDigitalSignatures: boolean;
   isChecking: boolean;
 }
 
-export const usePdfSignatureDetection = (files: StirlingFile[]): PdfSignatureDetectionResult => {
+export const usePdfSignatureDetection = (
+  files: StirlingFile[],
+): PdfSignatureDetectionResult => {
   const [hasDigitalSignatures, setHasDigitalSignatures] = useState(false);
   const [isChecking, setIsChecking] = useState(false);
 
@@ -22,7 +24,6 @@ export const usePdfSignatureDetection = (files: StirlingFile[]): PdfSignatureDet
       let foundSignature = false;
 
       try {
-
         for (const file of files) {
           const arrayBuffer = await file.arrayBuffer();
 
@@ -31,10 +32,15 @@ export const usePdfSignatureDetection = (files: StirlingFile[]): PdfSignatureDet
 
             for (let i = 1; i <= pdf.numPages; i++) {
               const page = await pdf.getPage(i);
-              const annotations = await page.getAnnotations({ intent: 'display' });
+              const annotations = await page.getAnnotations({
+                intent: "display",
+              });
 
               annotations.forEach((annotation: any) => {
-                if (annotation.subtype === 'Widget' && annotation.fieldType === 'Sig') {
+                if (
+                  annotation.subtype === "Widget" &&
+                  annotation.fieldType === "Sig"
+                ) {
                   foundSignature = true;
                 }
               });
@@ -45,13 +51,13 @@ export const usePdfSignatureDetection = (files: StirlingFile[]): PdfSignatureDet
             // Clean up PDF document using worker manager
             pdfWorkerManager.destroyDocument(pdf);
           } catch (error) {
-            console.warn('Error analyzing PDF for signatures:', error);
+            console.warn("Error analyzing PDF for signatures:", error);
           }
 
           if (foundSignature) break;
         }
       } catch (error) {
-        console.warn('Error checking for digital signatures:', error);
+        console.warn("Error checking for digital signatures:", error);
       }
 
       setHasDigitalSignatures(foundSignature);
@@ -63,6 +69,6 @@ export const usePdfSignatureDetection = (files: StirlingFile[]): PdfSignatureDet
 
   return {
     hasDigitalSignatures,
-    isChecking
+    isChecking,
   };
 };
diff --git a/frontend/src/core/hooks/useProcessedFiles.ts b/frontend/src/core/hooks/useProcessedFiles.ts
index 9d01efc3e8..3bdd441bf4 100644
--- a/frontend/src/core/hooks/useProcessedFiles.ts
+++ b/frontend/src/core/hooks/useProcessedFiles.ts
@@ -1,6 +1,6 @@
-import { useState, useEffect } from 'react';
-import { ProcessedFile, ProcessingState } from '@app/types/processing';
-import { pdfProcessingService } from '@app/services/pdfProcessingService';
+import { useState, useEffect } from "react";
+import { ProcessedFile, ProcessingState } from "@app/types/processing";
+import { pdfProcessingService } from "@app/services/pdfProcessingService";
 
 interface UseProcessedFilesResult {
   processedFiles: Map<File, ProcessedFile>;
@@ -14,25 +14,32 @@ interface UseProcessedFilesResult {
   };
 }
 
-export function useProcessedFiles(activeFiles: File[]): UseProcessedFilesResult {
-  const [processedFiles, setProcessedFiles] = useState<Map<File, ProcessedFile>>(new Map());
-  const [processingStates, setProcessingStates] = useState<Map<string, ProcessingState>>(new Map());
+export function useProcessedFiles(
+  activeFiles: File[],
+): UseProcessedFilesResult {
+  const [processedFiles, setProcessedFiles] = useState<
+    Map<File, ProcessedFile>
+  >(new Map());
+  const [processingStates, setProcessingStates] = useState<
+    Map<string, ProcessingState>
+  >(new Map());
 
   useEffect(() => {
     // Subscribe to processing state changes
-    const unsubscribe = pdfProcessingService.onProcessingChange(setProcessingStates);
-    
+    const unsubscribe =
+      pdfProcessingService.onProcessingChange(setProcessingStates);
+
     // Check/start processing for each active file
     const checkProcessing = async () => {
       const newProcessedFiles = new Map<File, ProcessedFile>();
-      
+
       for (const file of activeFiles) {
         const processed = await pdfProcessingService.getProcessedFile(file);
         if (processed) {
           newProcessedFiles.set(file, processed);
         }
       }
-      
+
       setProcessedFiles(newProcessedFiles);
     };
 
@@ -45,7 +52,7 @@ export function useProcessedFiles(activeFiles: File[]): UseProcessedFilesResult
   useEffect(() => {
     const updateProcessedFiles = async () => {
       const updated = new Map<File, ProcessedFile>();
-      
+
       for (const file of activeFiles) {
         const existing = processedFiles.get(file);
         if (existing) {
@@ -58,7 +65,7 @@ export function useProcessedFiles(activeFiles: File[]): UseProcessedFilesResult
           }
         }
       }
-      
+
       setProcessedFiles(updated);
     };
 
@@ -71,14 +78,16 @@ export function useProcessedFiles(activeFiles: File[]): UseProcessedFilesResult
   useEffect(() => {
     const currentFiles = new Set(activeFiles);
     const previousFiles = Array.from(processedFiles.keys());
-    const removedFiles = previousFiles.filter(file => !currentFiles.has(file));
-    
+    const removedFiles = previousFiles.filter(
+      (file) => !currentFiles.has(file),
+    );
+
     if (removedFiles.length > 0) {
       // Clean up processing service cache
       pdfProcessingService.cleanup(removedFiles);
-      
+
       // Update local state
-      setProcessedFiles(prev => {
+      setProcessedFiles((prev) => {
         const updated = new Map();
         for (const [file, processed] of prev) {
           if (currentFiles.has(file)) {
@@ -92,7 +101,9 @@ export function useProcessedFiles(activeFiles: File[]): UseProcessedFilesResult
 
   // Derived state
   const isProcessing = processingStates.size > 0;
-  const hasProcessingErrors = Array.from(processingStates.values()).some(state => state.status === 'error');
+  const hasProcessingErrors = Array.from(processingStates.values()).some(
+    (state) => state.status === "error",
+  );
   const cacheStats = pdfProcessingService.getCacheStats();
 
   return {
@@ -100,7 +111,7 @@ export function useProcessedFiles(activeFiles: File[]): UseProcessedFilesResult
     processingStates,
     isProcessing,
     hasProcessingErrors,
-    cacheStats
+    cacheStats,
   };
 }
 
@@ -111,15 +122,17 @@ export function useProcessedFile(file: File | null): {
   processingState: ProcessingState | null;
 } {
   const result = useProcessedFiles(file ? [file] : []);
-  
+
   const processedFile = file ? result.processedFiles.get(file) || null : null;
-  const fileKey = file ? pdfProcessingService.generateFileKey(file) : '';
-  const processingState = fileKey ? result.processingStates.get(fileKey) || null : null;
+  const fileKey = file ? pdfProcessingService.generateFileKey(file) : "";
+  const processingState = fileKey
+    ? result.processingStates.get(fileKey) || null
+    : null;
   const isProcessing = !!processingState;
 
   return {
     processedFile,
     isProcessing,
-    processingState
+    processingState,
   };
-}
\ No newline at end of file
+}
diff --git a/frontend/src/core/hooks/useProgressivePagePreviews.ts b/frontend/src/core/hooks/useProgressivePagePreviews.ts
index ef62af4faa..be80190648 100644
--- a/frontend/src/core/hooks/useProgressivePagePreviews.ts
+++ b/frontend/src/core/hooks/useProgressivePagePreviews.ts
@@ -1,12 +1,13 @@
-import { useCallback, useEffect, useRef, useState } from 'react';
-import { pdfWorkerManager } from '@app/services/pdfWorkerManager';
-import type { PDFDocumentProxy } from 'pdfjs-dist/legacy/build/pdf.mjs';
-import { PagePreview } from '@app/types/compare';
+import { useCallback, useEffect, useRef, useState } from "react";
+import { pdfWorkerManager } from "@app/services/pdfWorkerManager";
+import type { PDFDocumentProxy } from "pdfjs-dist/legacy/build/pdf.mjs";
+import { PagePreview } from "@app/types/compare";
 
 const DISPLAY_SCALE = 1;
 const BATCH_SIZE = 10; // Render 10 pages at a time
 
-const getDevicePixelRatio = () => (typeof window !== 'undefined' ? window.devicePixelRatio : 1);
+const getDevicePixelRatio = () =>
+  typeof window !== "undefined" ? window.devicePixelRatio : 1;
 
 interface ProgressivePagePreviewsOptions {
   file: File | null;
@@ -40,128 +41,145 @@ export const useProgressivePagePreviews = ({
   const pdfRef = useRef<PDFDocumentProxy | null>(null);
   const abortControllerRef = useRef<AbortController | null>(null);
 
-  const renderPageBatch = useCallback(async (
-    pdf: PDFDocumentProxy,
-    pageNumbers: number[],
-    signal: AbortSignal
-  ): Promise<PagePreview[]> => {
-    const previews: PagePreview[] = [];
-    const dpr = getDevicePixelRatio();
-    const renderScale = Math.max(2, Math.min(3, dpr * 2));
+  const renderPageBatch = useCallback(
+    async (
+      pdf: PDFDocumentProxy,
+      pageNumbers: number[],
+      signal: AbortSignal,
+    ): Promise<PagePreview[]> => {
+      const previews: PagePreview[] = [];
+      const dpr = getDevicePixelRatio();
+      const renderScale = Math.max(2, Math.min(3, dpr * 2));
 
-    for (const pageNumber of pageNumbers) {
-      if (signal.aborted) break;
+      for (const pageNumber of pageNumbers) {
+        if (signal.aborted) break;
 
-      try {
-        const page = await pdf.getPage(pageNumber);
-        const displayViewport = page.getViewport({ scale: DISPLAY_SCALE });
-        const renderViewport = page.getViewport({ scale: renderScale });
-        const canvas = document.createElement('canvas');
-        const context = canvas.getContext('2d');
+        try {
+          const page = await pdf.getPage(pageNumber);
+          const displayViewport = page.getViewport({ scale: DISPLAY_SCALE });
+          const renderViewport = page.getViewport({ scale: renderScale });
+          const canvas = document.createElement("canvas");
+          const context = canvas.getContext("2d");
 
-        canvas.width = Math.round(renderViewport.width);
-        canvas.height = Math.round(renderViewport.height);
+          canvas.width = Math.round(renderViewport.width);
+          canvas.height = Math.round(renderViewport.height);
 
-        if (!context) {
-          page.cleanup();
-          continue;
-        }
-
-        await page.render({ canvasContext: context, viewport: renderViewport, canvas }).promise;
-        previews.push({
-          pageNumber,
-          width: Math.round(displayViewport.width),
-          height: Math.round(displayViewport.height),
-          rotation: (page.rotate || 0) % 360,
-          url: canvas.toDataURL(),
-        });
-
-        page.cleanup();
-        canvas.width = 0;
-        canvas.height = 0;
-      } catch (error) {
-        console.error(`[progressive-pages] failed to render page ${pageNumber}:`, error);
-      }
-    }
-
-    return previews;
-  }, []);
-
-  const loadPageRange = useCallback(async (
-    startPage: number,
-    endPage: number,
-    signal: AbortSignal
-  ) => {
-    // Use the live PDF ref for bounds instead of possibly stale state
-    const totalPages = pdfRef.current?.numPages ?? state.totalPages;
-    if (startPage < 0 || endPage >= totalPages || startPage > endPage) {
-      return;
-    }
-
-    // Check which pages need to be loaded
-    const pagesToLoad: number[] = [];
-    for (let i = startPage; i <= endPage; i++) {
-      if (!state.loadedPages.has(i) && !state.loadingPages.has(i)) {
-        pagesToLoad.push(i + 1); // Convert to 1-based page numbers
-      }
-    }
-
-    if (pagesToLoad.length === 0) return;
-
-    // Mark pages as loading
-    setState(prev => ({
-      ...prev,
-      loadingPages: new Set([...prev.loadingPages, ...pagesToLoad.map(p => p - 1)]),
-    }));
-
-    try {
-      const pdfDoc = pdfRef.current;
-      if (!pdfDoc) return;
-      const previews = await renderPageBatch(pdfDoc, pagesToLoad, signal);
-      
-      if (!signal.aborted) {
-        setState(prev => {
-          const newPages = [...prev.pages];
-          const newLoadedPages = new Set(prev.loadedPages);
-          const newLoadingPages = new Set(prev.loadingPages);
-
-          // Add new previews and mark as loaded
-          for (const preview of previews) {
-            const pageIndex = preview.pageNumber - 1; // Convert to 0-based
-            newLoadedPages.add(pageIndex);
-            newLoadingPages.delete(pageIndex);
-            
-            // Insert preview in correct position
-            const insertIndex = newPages.findIndex(p => p.pageNumber > preview.pageNumber);
-            if (insertIndex === -1) {
-              newPages.push(preview);
-            } else {
-              newPages.splice(insertIndex, 0, preview);
-            }
+          if (!context) {
+            page.cleanup();
+            continue;
           }
 
-          return {
-            ...prev,
-            pages: newPages,
-            loadedPages: newLoadedPages,
-            loadingPages: newLoadingPages,
-          };
-        });
+          await page.render({
+            canvasContext: context,
+            viewport: renderViewport,
+            canvas,
+          }).promise;
+          previews.push({
+            pageNumber,
+            width: Math.round(displayViewport.width),
+            height: Math.round(displayViewport.height),
+            rotation: (page.rotate || 0) % 360,
+            url: canvas.toDataURL(),
+          });
+
+          page.cleanup();
+          canvas.width = 0;
+          canvas.height = 0;
+        } catch (error) {
+          console.error(
+            `[progressive-pages] failed to render page ${pageNumber}:`,
+            error,
+          );
+        }
       }
-    } catch (error) {
-      if (!signal.aborted) {
-        console.error('[progressive-pages] failed to load page batch:', error);
+
+      return previews;
+    },
+    [],
+  );
+
+  const loadPageRange = useCallback(
+    async (startPage: number, endPage: number, signal: AbortSignal) => {
+      // Use the live PDF ref for bounds instead of possibly stale state
+      const totalPages = pdfRef.current?.numPages ?? state.totalPages;
+      if (startPage < 0 || endPage >= totalPages || startPage > endPage) {
+        return;
       }
-    } finally {
-      if (!signal.aborted) {
-        setState(prev => {
-          const newLoadingPages = new Set(prev.loadingPages);
-          pagesToLoad.forEach(p => newLoadingPages.delete(p - 1));
-          return { ...prev, loadingPages: newLoadingPages };
-        });
+
+      // Check which pages need to be loaded
+      const pagesToLoad: number[] = [];
+      for (let i = startPage; i <= endPage; i++) {
+        if (!state.loadedPages.has(i) && !state.loadingPages.has(i)) {
+          pagesToLoad.push(i + 1); // Convert to 1-based page numbers
+        }
       }
-    }
-  }, [state.loadedPages, state.loadingPages, state.totalPages, renderPageBatch]);
+
+      if (pagesToLoad.length === 0) return;
+
+      // Mark pages as loading
+      setState((prev) => ({
+        ...prev,
+        loadingPages: new Set([
+          ...prev.loadingPages,
+          ...pagesToLoad.map((p) => p - 1),
+        ]),
+      }));
+
+      try {
+        const pdfDoc = pdfRef.current;
+        if (!pdfDoc) return;
+        const previews = await renderPageBatch(pdfDoc, pagesToLoad, signal);
+
+        if (!signal.aborted) {
+          setState((prev) => {
+            const newPages = [...prev.pages];
+            const newLoadedPages = new Set(prev.loadedPages);
+            const newLoadingPages = new Set(prev.loadingPages);
+
+            // Add new previews and mark as loaded
+            for (const preview of previews) {
+              const pageIndex = preview.pageNumber - 1; // Convert to 0-based
+              newLoadedPages.add(pageIndex);
+              newLoadingPages.delete(pageIndex);
+
+              // Insert preview in correct position
+              const insertIndex = newPages.findIndex(
+                (p) => p.pageNumber > preview.pageNumber,
+              );
+              if (insertIndex === -1) {
+                newPages.push(preview);
+              } else {
+                newPages.splice(insertIndex, 0, preview);
+              }
+            }
+
+            return {
+              ...prev,
+              pages: newPages,
+              loadedPages: newLoadedPages,
+              loadingPages: newLoadingPages,
+            };
+          });
+        }
+      } catch (error) {
+        if (!signal.aborted) {
+          console.error(
+            "[progressive-pages] failed to load page batch:",
+            error,
+          );
+        }
+      } finally {
+        if (!signal.aborted) {
+          setState((prev) => {
+            const newLoadingPages = new Set(prev.loadingPages);
+            pagesToLoad.forEach((p) => newLoadingPages.delete(p - 1));
+            return { ...prev, loadingPages: newLoadingPages };
+          });
+        }
+      }
+    },
+    [state.loadedPages, state.loadingPages, state.totalPages, renderPageBatch],
+  );
 
   // Initialize PDF and load first batch
   useEffect(() => {
@@ -182,8 +200,8 @@ export const useProgressivePagePreviews = ({
 
     const initialize = async () => {
       try {
-        setState(prev => ({ ...prev, loading: true }));
-        
+        setState((prev) => ({ ...prev, loading: true }));
+
         const arrayBuffer = await file.arrayBuffer();
         const pdf = await pdfWorkerManager.createDocument(arrayBuffer, {
           disableAutoFetch: true,
@@ -198,7 +216,7 @@ export const useProgressivePagePreviews = ({
         pdfRef.current = pdf;
         const totalPages = pdf.numPages;
 
-        setState(prev => ({
+        setState((prev) => ({
           ...prev,
           totalPages,
           loading: false,
@@ -208,11 +226,10 @@ export const useProgressivePagePreviews = ({
         const initAbort = new AbortController();
         const firstBatchEnd = Math.min(BATCH_SIZE - 1, totalPages - 1);
         await loadPageRange(0, firstBatchEnd, initAbort.signal);
-
       } catch (error) {
-        console.error('[progressive-pages] failed to initialize PDF:', error);
+        console.error("[progressive-pages] failed to initialize PDF:", error);
         if (!cancelled) {
-          setState(prev => ({
+          setState((prev) => ({
             ...prev,
             loading: false,
             totalPages: 0,
@@ -276,4 +293,6 @@ export const useProgressivePagePreviews = ({
   };
 };
 
-export type UseProgressivePagePreviewsReturn = ReturnType<typeof useProgressivePagePreviews>;
+export type UseProgressivePagePreviewsReturn = ReturnType<
+  typeof useProgressivePagePreviews
+>;
diff --git a/frontend/src/core/hooks/useRainbowTheme.ts b/frontend/src/core/hooks/useRainbowTheme.ts
index 6e768c0b00..1241f234d1 100644
--- a/frontend/src/core/hooks/useRainbowTheme.ts
+++ b/frontend/src/core/hooks/useRainbowTheme.ts
@@ -1,6 +1,6 @@
-import { useCallback, useRef, useEffect } from 'react';
-import { usePreferences } from '@app/contexts/PreferencesContext';
-import type { ThemeMode } from '@app/constants/theme';
+import { useCallback, useRef, useEffect } from "react";
+import { usePreferences } from "@app/contexts/PreferencesContext";
+import type { ThemeMode } from "@app/constants/theme";
 
 interface RainbowThemeHook {
   themeMode: ThemeMode;
@@ -24,25 +24,28 @@ export function useRainbowTheme(): RainbowThemeHook {
 
   // Apply rainbow class to body whenever theme changes
   useEffect(() => {
-    if (themeMode === 'rainbow') {
-      document.body.classList.add('rainbow-mode-active');
+    if (themeMode === "rainbow") {
+      document.body.classList.add("rainbow-mode-active");
       showRainbowNotification();
     } else {
-      document.body.classList.remove('rainbow-mode-active');
+      document.body.classList.remove("rainbow-mode-active");
     }
   }, [themeMode]);
 
   const showRainbowNotification = () => {
     // Remove any existing notification
-    const existingNotification = document.getElementById('rainbow-notification');
+    const existingNotification = document.getElementById(
+      "rainbow-notification",
+    );
     if (existingNotification) {
       existingNotification.remove();
     }
 
     // Create and show rainbow notification
-    const notification = document.createElement('div');
-    notification.id = 'rainbow-notification';
-    notification.innerHTML = '🌈 RAINBOW MODE ACTIVATED! 🌈<br><small>Button disabled for 3 seconds, then click to exit</small>';
+    const notification = document.createElement("div");
+    notification.id = "rainbow-notification";
+    notification.innerHTML =
+      "🌈 RAINBOW MODE ACTIVATED! 🌈<br><small>Button disabled for 3 seconds, then click to exit</small>";
     notification.style.cssText = `
       position: fixed;
       top: 20px;
@@ -68,7 +71,7 @@ export function useRainbowTheme(): RainbowThemeHook {
     // Auto-remove notification after 3 seconds
     setTimeout(() => {
       if (notification) {
-        notification.style.opacity = '0';
+        notification.style.opacity = "0";
         setTimeout(() => {
           if (notification.parentNode) {
             notification.parentNode.removeChild(notification);
@@ -80,15 +83,17 @@ export function useRainbowTheme(): RainbowThemeHook {
 
   const showExitNotification = () => {
     // Remove any existing notification
-    const existingNotification = document.getElementById('rainbow-exit-notification');
+    const existingNotification = document.getElementById(
+      "rainbow-exit-notification",
+    );
     if (existingNotification) {
       existingNotification.remove();
     }
 
     // Create and show exit notification
-    const notification = document.createElement('div');
-    notification.id = 'rainbow-exit-notification';
-    notification.innerHTML = '🌙 Rainbow mode deactivated';
+    const notification = document.createElement("div");
+    notification.id = "rainbow-exit-notification";
+    notification.innerHTML = "🌙 Rainbow mode deactivated";
     notification.style.cssText = `
       position: fixed;
       top: 20px;
@@ -112,7 +117,7 @@ export function useRainbowTheme(): RainbowThemeHook {
     // Auto-remove notification after 2 seconds
     setTimeout(() => {
       if (notification) {
-        notification.style.opacity = '0';
+        notification.style.opacity = "0";
         setTimeout(() => {
           if (notification.parentNode) {
             notification.parentNode.removeChild(notification);
@@ -131,9 +136,9 @@ export function useRainbowTheme(): RainbowThemeHook {
     const currentTime = Date.now();
 
     // Simple exit from rainbow mode with single click (after cooldown period)
-    if (themeMode === 'rainbow') {
-      updatePreference('theme', 'light');
-      console.log('🌈 Rainbow mode deactivated. Thanks for trying it!');
+    if (themeMode === "rainbow") {
+      updatePreference("theme", "light");
+      console.log("🌈 Rainbow mode deactivated. Thanks for trying it!");
       showExitNotification();
       return;
     }
@@ -148,15 +153,21 @@ export function useRainbowTheme(): RainbowThemeHook {
 
     // Easter egg: Activate rainbow mode after 10 rapid toggles
     if (allowRainbowMode && toggleCount.current >= 10) {
-      updatePreference('theme', 'rainbow');
-      console.log('🌈 RAINBOW MODE ACTIVATED! 🌈 You found the secret easter egg!');
-      console.log('🌈 Button will be disabled for 3 seconds, then click once to exit!');
+      updatePreference("theme", "rainbow");
+      console.log(
+        "🌈 RAINBOW MODE ACTIVATED! 🌈 You found the secret easter egg!",
+      );
+      console.log(
+        "🌈 Button will be disabled for 3 seconds, then click once to exit!",
+      );
 
       // Disable toggle for 3 seconds
       isToggleDisabled.current = true;
       setTimeout(() => {
         isToggleDisabled.current = false;
-        console.log('🌈 Theme toggle re-enabled! Click once to exit rainbow mode.');
+        console.log(
+          "🌈 Theme toggle re-enabled! Click once to exit rainbow mode.",
+        );
       }, 3000);
 
       // Reset counter
@@ -165,25 +176,25 @@ export function useRainbowTheme(): RainbowThemeHook {
     }
 
     // Normal theme switching
-    const nextTheme = themeMode === 'light' ? 'dark' : 'light';
-    updatePreference('theme', nextTheme);
+    const nextTheme = themeMode === "light" ? "dark" : "light";
+    updatePreference("theme", nextTheme);
   }, [themeMode, updatePreference]);
 
   const activateRainbow = useCallback(() => {
-    updatePreference('theme', 'rainbow');
-    console.log('🌈 Rainbow mode manually activated!');
+    updatePreference("theme", "rainbow");
+    console.log("🌈 Rainbow mode manually activated!");
   }, [updatePreference]);
 
   const deactivateRainbow = useCallback(() => {
-    if (themeMode === 'rainbow') {
-      updatePreference('theme', 'light');
-      console.log('🌈 Rainbow mode manually deactivated.');
+    if (themeMode === "rainbow") {
+      updatePreference("theme", "light");
+      console.log("🌈 Rainbow mode manually deactivated.");
     }
   }, [themeMode, updatePreference]);
 
   return {
     themeMode,
-    isRainbowMode: themeMode === 'rainbow',
+    isRainbowMode: themeMode === "rainbow",
     isToggleDisabled: isToggleDisabled.current,
     toggleTheme,
     activateRainbow,
diff --git a/frontend/src/core/hooks/useRightRailButtons.ts b/frontend/src/core/hooks/useRightRailButtons.ts
index aa43b0189e..a4def11c61 100644
--- a/frontend/src/core/hooks/useRightRailButtons.ts
+++ b/frontend/src/core/hooks/useRightRailButtons.ts
@@ -1,6 +1,6 @@
-import { useEffect, useMemo } from 'react';
-import { useRightRail } from '@app/contexts/RightRailContext';
-import { RightRailAction, RightRailButtonConfig } from '@app/types/rightRail';
+import { useEffect, useMemo } from "react";
+import { useRightRail } from "@app/contexts/RightRailContext";
+import { RightRailAction, RightRailButtonConfig } from "@app/types/rightRail";
 
 export interface RightRailButtonWithAction extends RightRailButtonConfig {
   onClick?: RightRailAction;
@@ -11,25 +11,29 @@ export interface RightRailButtonWithAction extends RightRailButtonConfig {
  * - Automatically registers on mount and unregisters on unmount
  * - Updates registration when the input array reference changes
  */
-export function useRightRailButtons(buttons: readonly RightRailButtonWithAction[]) {
+export function useRightRailButtons(
+  buttons: readonly RightRailButtonWithAction[],
+) {
   const { registerButtons, unregisterButtons, setAction } = useRightRail();
 
   // Memoize configs and ids to reduce churn
   const configs: RightRailButtonConfig[] = useMemo(
     () => buttons.map(({ onClick, ...cfg }) => cfg),
-    [buttons]
+    [buttons],
   );
-  const ids: string[] = useMemo(() => buttons.map(b => b.id), [buttons]);
+  const ids: string[] = useMemo(() => buttons.map((b) => b.id), [buttons]);
 
   useEffect(() => {
     if (!buttons || buttons.length === 0) return;
 
     // DEV warnings for duplicate ids or missing handlers
-    if (process.env.NODE_ENV === 'development') {
+    if (process.env.NODE_ENV === "development") {
       const idSet = new Set<string>();
-      buttons.forEach(b => {
-        if (!b.onClick && !b.render) console.warn('[RightRail] Missing onClick/render for id:', b.id);
-        if (idSet.has(b.id)) console.warn('[RightRail] Duplicate id in buttons array:', b.id);
+      buttons.forEach((b) => {
+        if (!b.onClick && !b.render)
+          console.warn("[RightRail] Missing onClick/render for id:", b.id);
+        if (idSet.has(b.id))
+          console.warn("[RightRail] Duplicate id in buttons array:", b.id);
         idSet.add(b.id);
       });
     }
diff --git a/frontend/src/core/hooks/useRightRailTooltipSide.ts b/frontend/src/core/hooks/useRightRailTooltipSide.ts
index 634d041139..ddd7e0f7ac 100644
--- a/frontend/src/core/hooks/useRightRailTooltipSide.ts
+++ b/frontend/src/core/hooks/useRightRailTooltipSide.ts
@@ -1,32 +1,34 @@
-import { useEffect, useState } from 'react';
-import { SidebarRefs } from '@app/types/sidebar';
+import { useEffect, useState } from "react";
+import { SidebarRefs } from "@app/types/sidebar";
 
 export function useRightRailTooltipSide(
   sidebarRefs?: SidebarRefs,
-  defaultOffset: number = 16
-): { position: 'left' | 'right'; offset: number } {
-  const [position, setPosition] = useState<'left' | 'right'>('left');
+  defaultOffset: number = 16,
+): { position: "left" | "right"; offset: number } {
+  const [position, setPosition] = useState<"left" | "right">("left");
 
   useEffect(() => {
     const computePosition = () => {
       const rail = sidebarRefs?.rightRailRef?.current;
-      const isRTL = typeof document !== 'undefined' && document.documentElement.dir === 'rtl';
+      const isRTL =
+        typeof document !== "undefined" &&
+        document.documentElement.dir === "rtl";
 
       // Fallback to left if we can't measure
-      if (!rail || typeof window === 'undefined') {
-        setPosition(isRTL ? 'left' : 'left');
+      if (!rail || typeof window === "undefined") {
+        setPosition(isRTL ? "left" : "left");
         return;
       }
 
       const rect = rail.getBoundingClientRect();
       const center = rect.left + rect.width / 2;
-      const preferred = center > window.innerWidth / 2 ? 'left' : 'right';
-      setPosition(isRTL ? 'left' : preferred);
+      const preferred = center > window.innerWidth / 2 ? "left" : "right";
+      setPosition(isRTL ? "left" : preferred);
     };
 
     computePosition();
-    window.addEventListener('resize', computePosition);
-    return () => window.removeEventListener('resize', computePosition);
+    window.addEventListener("resize", computePosition);
+    return () => window.removeEventListener("resize", computePosition);
   }, [sidebarRefs]);
 
   return { position, offset: defaultOffset };
diff --git a/frontend/src/core/hooks/useScarfTracking.ts b/frontend/src/core/hooks/useScarfTracking.ts
index b0297d5102..27eed4b97a 100644
--- a/frontend/src/core/hooks/useScarfTracking.ts
+++ b/frontend/src/core/hooks/useScarfTracking.ts
@@ -1,7 +1,7 @@
-import { useEffect } from 'react';
-import { useAppConfig } from '@app/contexts/AppConfigContext';
-import { useCookieConsent } from '@app/hooks/useCookieConsent';
-import { setScarfConfig, firePixel } from '@app/utils/scarfTracking';
+import { useEffect } from "react";
+import { useAppConfig } from "@app/contexts/AppConfigContext";
+import { useCookieConsent } from "@app/hooks/useCookieConsent";
+import { setScarfConfig, firePixel } from "@app/utils/scarfTracking";
 
 /**
  * Hook for initializing Scarf tracking
@@ -15,7 +15,9 @@ import { setScarfConfig, firePixel } from '@app/utils/scarfTracking';
  */
 export function useScarfTracking() {
   const { config } = useAppConfig();
-  const { isServiceAccepted } = useCookieConsent({ analyticsEnabled: config?.enableAnalytics === true });
+  const { isServiceAccepted } = useCookieConsent({
+    analyticsEnabled: config?.enableAnalytics === true,
+  });
 
   // Update scarf config whenever config or consent changes
   useEffect(() => {
@@ -27,18 +29,20 @@ export function useScarfTracking() {
   // Listen to cookie consent changes and auto-fire pixel when consent is granted
   useEffect(() => {
     const handleConsentChange = () => {
-      console.warn('[useScarfTracking] Consent changed, checking scarf service acceptance');
-      if (isServiceAccepted('scarf', 'analytics')) {
+      console.warn(
+        "[useScarfTracking] Consent changed, checking scarf service acceptance",
+      );
+      if (isServiceAccepted("scarf", "analytics")) {
         firePixel(window.location.pathname);
       }
     };
 
-    window.addEventListener('cc:onConsent', handleConsentChange);
-    window.addEventListener('cc:onChange', handleConsentChange);
+    window.addEventListener("cc:onConsent", handleConsentChange);
+    window.addEventListener("cc:onChange", handleConsentChange);
 
     return () => {
-      window.removeEventListener('cc:onConsent', handleConsentChange);
-      window.removeEventListener('cc:onChange', handleConsentChange);
+      window.removeEventListener("cc:onConsent", handleConsentChange);
+      window.removeEventListener("cc:onChange", handleConsentChange);
     };
   }, [isServiceAccepted]);
 }
diff --git a/frontend/src/core/hooks/useSelfHostedToolAvailability.ts b/frontend/src/core/hooks/useSelfHostedToolAvailability.ts
index b232b3b7d9..049ba88bef 100644
--- a/frontend/src/core/hooks/useSelfHostedToolAvailability.ts
+++ b/frontend/src/core/hooks/useSelfHostedToolAvailability.ts
@@ -5,7 +5,7 @@
  * is offline (i.e. tools whose endpoints the local bundled backend does not support).
  */
 export function useSelfHostedToolAvailability(
-  _tools: Array<{ id: string; endpoints?: string[] }>
+  _tools: Array<{ id: string; endpoints?: string[] }>,
 ): Set<string> {
   return new Set<string>();
 }
diff --git a/frontend/src/core/hooks/useServerExperience.ts b/frontend/src/core/hooks/useServerExperience.ts
index 7b78a58d49..69d573f9b9 100644
--- a/frontend/src/core/hooks/useServerExperience.ts
+++ b/frontend/src/core/hooks/useServerExperience.ts
@@ -1,22 +1,22 @@
-import { useCallback, useEffect, useMemo, useState } from 'react';
-import { useAppConfig } from '@app/contexts/AppConfigContext';
+import { useCallback, useEffect, useMemo, useState } from "react";
+import { useAppConfig } from "@app/contexts/AppConfigContext";
 
-const SELF_REPORTED_ADMIN_KEY = 'stirling-self-reported-admin';
+const SELF_REPORTED_ADMIN_KEY = "stirling-self-reported-admin";
 const FREE_TIER_LIMIT = 5;
 
-type UserCountSource = 'admin' | 'estimate' | 'unknown';
+type UserCountSource = "admin" | "estimate" | "unknown";
 
 export type ServerScenarioKey =
-  | 'unknown'
-  | 'licensed'
-  | 'no-login-user-under-limit-no-license'
-  | 'no-login-admin-under-limit-no-license'
-  | 'no-login-user-over-limit-no-license'
-  | 'no-login-admin-over-limit-no-license'
-  | 'login-user-under-limit-no-license'
-  | 'login-admin-under-limit-no-license'
-  | 'login-user-over-limit-no-license'
-  | 'login-admin-over-limit-no-license';
+  | "unknown"
+  | "licensed"
+  | "no-login-user-under-limit-no-license"
+  | "no-login-admin-under-limit-no-license"
+  | "no-login-user-over-limit-no-license"
+  | "no-login-admin-over-limit-no-license"
+  | "login-user-under-limit-no-license"
+  | "login-admin-under-limit-no-license"
+  | "login-user-over-limit-no-license"
+  | "login-admin-over-limit-no-license";
 
 export interface ServerExperienceValue {
   loginEnabled: boolean;
@@ -48,11 +48,11 @@ export interface ServerExperienceValue {
 }
 
 function readSelfReportedAdmin(): boolean {
-  if (typeof window === 'undefined') {
+  if (typeof window === "undefined") {
     return false;
   }
   try {
-    return window.localStorage.getItem(SELF_REPORTED_ADMIN_KEY) === 'true';
+    return window.localStorage.getItem(SELF_REPORTED_ADMIN_KEY) === "true";
   } catch {
     return false;
   }
@@ -60,7 +60,9 @@ function readSelfReportedAdmin(): boolean {
 
 export function useServerExperience(): ServerExperienceValue {
   const { config } = useAppConfig();
-  const [selfReportedAdmin, setSelfReportedAdminState] = useState<boolean>(readSelfReportedAdmin);
+  const [selfReportedAdmin, setSelfReportedAdminState] = useState<boolean>(
+    readSelfReportedAdmin,
+  );
 
   const loginEnabled = config?.enableLogin !== false;
   const configIsAdmin = Boolean(config?.isAdmin);
@@ -68,16 +70,19 @@ export function useServerExperience(): ServerExperienceValue {
   // Commented out the previous self-reported admin path to avoid elevating users.
   // const effectiveIsAdmin = configIsAdmin || (!loginEnabled && selfReportedAdmin);
   const effectiveIsAdmin = loginEnabled ? configIsAdmin : false;
-  const hasPaidLicense = config?.license === 'SERVER' || config?.license === 'PRO' || config?.license === 'ENTERPRISE';
+  const hasPaidLicense =
+    config?.license === "SERVER" ||
+    config?.license === "PRO" ||
+    config?.license === "ENTERPRISE";
 
   const setSelfReportedAdmin = useCallback((value: boolean) => {
     setSelfReportedAdminState(value);
-    if (typeof window === 'undefined') {
+    if (typeof window === "undefined") {
       return;
     }
     try {
       if (value) {
-        window.localStorage.setItem(SELF_REPORTED_ADMIN_KEY, 'true');
+        window.localStorage.setItem(SELF_REPORTED_ADMIN_KEY, "true");
       } else {
         window.localStorage.removeItem(SELF_REPORTED_ADMIN_KEY);
       }
@@ -87,74 +92,81 @@ export function useServerExperience(): ServerExperienceValue {
   }, []);
 
   useEffect(() => {
-    if (typeof window === 'undefined') {
+    if (typeof window === "undefined") {
       return;
     }
     const handleStorage = (event: StorageEvent) => {
       if (event.key === SELF_REPORTED_ADMIN_KEY) {
-        setSelfReportedAdminState(event.newValue === 'true');
+        setSelfReportedAdminState(event.newValue === "true");
       }
     };
-    window.addEventListener('storage', handleStorage);
-    return () => window.removeEventListener('storage', handleStorage);
+    window.addEventListener("storage", handleStorage);
+    return () => window.removeEventListener("storage", handleStorage);
   }, []);
 
   useEffect(() => {
     if (config?.isNewServer && !loginEnabled && !selfReportedAdmin) {
       setSelfReportedAdmin(true);
     }
-  }, [config?.isNewServer, loginEnabled, selfReportedAdmin, setSelfReportedAdmin]);
-
-  const scenarioKey: ServerScenarioKey = useMemo(() => {
-    if (hasPaidLicense) {
-      return 'licensed';
-    }
-    return 'unknown';
-  }, [hasPaidLicense]);
-
-  const value = useMemo<ServerExperienceValue>(() => ({
-    loginEnabled,
-    configIsAdmin,
-    effectiveIsAdmin,
-    selfReportedAdmin,
-    isAuthenticated: false,
-    isNewServer: config?.isNewServer ?? null,
-    isNewUser: config?.isNewUser ?? null,
-    premiumEnabled: config?.premiumEnabled ?? null,
-    license: config?.license,
-    runningProOrHigher: config?.runningProOrHigher,
-    runningEE: config?.runningEE,
-    hasPaidLicense,
-    licenseKeyValid: config?.premiumEnabled ?? null,
-    licenseLoading: false,
-    licenseInfoAvailable: false,
-    totalUsers: null,
-    weeklyActiveUsers: null,
-    userCountLoading: false,
-    userCountError: null,
-    userCountSource: 'unknown',
-    userCountResolved: false,
-    overFreeTierLimit: null,
-    freeTierLimit: FREE_TIER_LIMIT,
-    refreshUserCounts: async () => {},
-    setSelfReportedAdmin,
-    scenarioKey,
-  }), [
+  }, [
     config?.isNewServer,
-    config?.isNewUser,
-    config?.license,
-    config?.premiumEnabled,
-    config?.runningEE,
-    config?.runningProOrHigher,
-    configIsAdmin,
-    effectiveIsAdmin,
-    hasPaidLicense,
     loginEnabled,
-    scenarioKey,
     selfReportedAdmin,
     setSelfReportedAdmin,
   ]);
 
+  const scenarioKey: ServerScenarioKey = useMemo(() => {
+    if (hasPaidLicense) {
+      return "licensed";
+    }
+    return "unknown";
+  }, [hasPaidLicense]);
+
+  const value = useMemo<ServerExperienceValue>(
+    () => ({
+      loginEnabled,
+      configIsAdmin,
+      effectiveIsAdmin,
+      selfReportedAdmin,
+      isAuthenticated: false,
+      isNewServer: config?.isNewServer ?? null,
+      isNewUser: config?.isNewUser ?? null,
+      premiumEnabled: config?.premiumEnabled ?? null,
+      license: config?.license,
+      runningProOrHigher: config?.runningProOrHigher,
+      runningEE: config?.runningEE,
+      hasPaidLicense,
+      licenseKeyValid: config?.premiumEnabled ?? null,
+      licenseLoading: false,
+      licenseInfoAvailable: false,
+      totalUsers: null,
+      weeklyActiveUsers: null,
+      userCountLoading: false,
+      userCountError: null,
+      userCountSource: "unknown",
+      userCountResolved: false,
+      overFreeTierLimit: null,
+      freeTierLimit: FREE_TIER_LIMIT,
+      refreshUserCounts: async () => {},
+      setSelfReportedAdmin,
+      scenarioKey,
+    }),
+    [
+      config?.isNewServer,
+      config?.isNewUser,
+      config?.license,
+      config?.premiumEnabled,
+      config?.runningEE,
+      config?.runningProOrHigher,
+      configIsAdmin,
+      effectiveIsAdmin,
+      hasPaidLicense,
+      loginEnabled,
+      scenarioKey,
+      selfReportedAdmin,
+      setSelfReportedAdmin,
+    ],
+  );
+
   return value;
 }
-
diff --git a/frontend/src/core/hooks/useSettingsDirty.ts b/frontend/src/core/hooks/useSettingsDirty.ts
index 20704677ef..6f8f6817c5 100644
--- a/frontend/src/core/hooks/useSettingsDirty.ts
+++ b/frontend/src/core/hooks/useSettingsDirty.ts
@@ -1,5 +1,5 @@
-import { useEffect, useState, useRef } from 'react';
-import { useUnsavedChanges } from '@app/contexts/UnsavedChangesContext';
+import { useEffect, useState, useRef } from "react";
+import { useUnsavedChanges } from "@app/contexts/UnsavedChangesContext";
 
 interface UseSettingsDirtyReturn<T> {
   isDirty: boolean;
@@ -11,16 +11,24 @@ interface UseSettingsDirtyReturn<T> {
  * Hook for managing dirty state in settings sections
  * Handles JSON snapshot comparison and UnsavedChangesContext integration
  */
-export function useSettingsDirty<T>(settings: T, loading: boolean): UseSettingsDirtyReturn<T> {
+export function useSettingsDirty<T>(
+  settings: T,
+  loading: boolean,
+): UseSettingsDirtyReturn<T> {
   const { setIsDirty } = useUnsavedChanges();
-  const [originalSettingsSnapshot, setOriginalSettingsSnapshot] = useState<string>('');
+  const [originalSettingsSnapshot, setOriginalSettingsSnapshot] =
+    useState<string>("");
   const [isDirty, setLocalIsDirty] = useState(false);
   const isInitialLoad = useRef(true);
   const justSavedRef = useRef(false);
 
   // Snapshot original settings after initial load OR after successful save (when refetch completes)
   useEffect(() => {
-    if (loading || Object.keys(settings as Record<string, unknown>).length === 0) return;
+    if (
+      loading ||
+      Object.keys(settings as Record<string, unknown>).length === 0
+    )
+      return;
 
     // After initial load: set snapshot
     if (isInitialLoad.current) {
@@ -60,7 +68,7 @@ export function useSettingsDirty<T>(settings: T, loading: boolean): UseSettingsD
       try {
         return JSON.parse(originalSettingsSnapshot) as T;
       } catch (e) {
-        console.error('Failed to parse original settings:', e);
+        console.error("Failed to parse original settings:", e);
         return settings;
       }
     }
diff --git a/frontend/src/core/hooks/useSharingEnabled.ts b/frontend/src/core/hooks/useSharingEnabled.ts
index 7a01b58ca6..d14537fbce 100644
--- a/frontend/src/core/hooks/useSharingEnabled.ts
+++ b/frontend/src/core/hooks/useSharingEnabled.ts
@@ -1,4 +1,4 @@
-import { useAppConfig } from '@app/contexts/AppConfigContext';
+import { useAppConfig } from "@app/contexts/AppConfigContext";
 
 export interface SharingEnabledResult {
   sharingEnabled: boolean;
diff --git a/frontend/src/core/hooks/useShouldShowWelcomeModal.ts b/frontend/src/core/hooks/useShouldShowWelcomeModal.ts
index 44685557f2..6a4e95e84d 100644
--- a/frontend/src/core/hooks/useShouldShowWelcomeModal.ts
+++ b/frontend/src/core/hooks/useShouldShowWelcomeModal.ts
@@ -1,12 +1,14 @@
-import { usePreferences } from '@app/contexts/PreferencesContext';
-import { useIsMobile } from '@app/hooks/useIsMobile';
+import { usePreferences } from "@app/contexts/PreferencesContext";
+import { useIsMobile } from "@app/hooks/useIsMobile";
 
 export function useShouldShowWelcomeModal(): boolean {
   const { preferences } = usePreferences();
   const isMobile = useIsMobile();
 
-  return preferences.hasSeenIntroOnboarding
-    && !preferences.hasCompletedOnboarding
-    && preferences.toolPanelModePromptSeen
-    && !isMobile;
+  return (
+    preferences.hasSeenIntroOnboarding &&
+    !preferences.hasCompletedOnboarding &&
+    preferences.toolPanelModePromptSeen &&
+    !isMobile
+  );
 }
diff --git a/frontend/src/core/hooks/useSidebarNavigation.ts b/frontend/src/core/hooks/useSidebarNavigation.ts
index 50065b6cf7..443a9252e7 100644
--- a/frontend/src/core/hooks/useSidebarNavigation.ts
+++ b/frontend/src/core/hooks/useSidebarNavigation.ts
@@ -1,7 +1,7 @@
-import { useCallback } from 'react';
-import { useToolNavigation } from '@app/hooks/useToolNavigation';
-import { useToolWorkflow } from '@app/contexts/ToolWorkflowContext';
-import { handleUnlessSpecialClick } from '@app/utils/clickHandlers';
+import { useCallback } from "react";
+import { useToolNavigation } from "@app/hooks/useToolNavigation";
+import { useToolWorkflow } from "@app/contexts/ToolWorkflowContext";
+import { handleUnlessSpecialClick } from "@app/utils/clickHandlers";
 import { ToolId } from "@app/types/toolId";
 
 export interface SidebarNavigationProps {
@@ -29,24 +29,28 @@ export function useSidebarNavigation(): {
   }, []);
 
   const getHomeNavigation = useCallback((): SidebarNavigationProps => {
-    const href = '/'; // SSR-safe relative path
+    const href = "/"; // SSR-safe relative path
     return { href, onClick: defaultNavClick };
   }, [defaultNavClick]);
 
-  const getToolNavigation = useCallback((toolId: ToolId): SidebarNavigationProps | null => {
-    // Handle special nav sections that aren't tools
-    if (toolId === 'read') return { href: '/read', onClick: defaultNavClick };
-    if (toolId === 'automate') return { href: '/automate', onClick: defaultNavClick };
+  const getToolNavigation = useCallback(
+    (toolId: ToolId): SidebarNavigationProps | null => {
+      // Handle special nav sections that aren't tools
+      if (toolId === "read") return { href: "/read", onClick: defaultNavClick };
+      if (toolId === "automate")
+        return { href: "/automate", onClick: defaultNavClick };
 
-    const tool = getSelectedTool(toolId);
-    if (!tool) return null;
+      const tool = getSelectedTool(toolId);
+      if (!tool) return null;
 
-    // Delegate to useToolNavigation for true tools
-    return getToolNavProps(toolId, tool);
-  }, [getToolNavProps, getSelectedTool, defaultNavClick]);
+      // Delegate to useToolNavigation for true tools
+      return getToolNavProps(toolId, tool);
+    },
+    [getToolNavProps, getSelectedTool, defaultNavClick],
+  );
 
   return {
     getHomeNavigation,
-    getToolNavigation
+    getToolNavigation,
   };
 }
diff --git a/frontend/src/core/hooks/useSuggestedTools.ts b/frontend/src/core/hooks/useSuggestedTools.ts
index 857108ed45..5deb5d3a0d 100644
--- a/frontend/src/core/hooks/useSuggestedTools.ts
+++ b/frontend/src/core/hooks/useSuggestedTools.ts
@@ -1,15 +1,15 @@
-import { useMemo } from 'react';
-import { useNavigationState } from '@app/contexts/NavigationContext';
-import { useToolNavigation } from '@app/hooks/useToolNavigation';
-import { useToolWorkflow } from '@app/contexts/ToolWorkflowContext';
-import { ToolId } from '@app/types/toolId';
+import { useMemo } from "react";
+import { useNavigationState } from "@app/contexts/NavigationContext";
+import { useToolNavigation } from "@app/hooks/useToolNavigation";
+import { useToolWorkflow } from "@app/contexts/ToolWorkflowContext";
+import { ToolId } from "@app/types/toolId";
 
 // Material UI Icons
-import CompressIcon from '@mui/icons-material/Compress';
-import SwapHorizIcon from '@mui/icons-material/SwapHoriz';
-import CleaningServicesIcon from '@mui/icons-material/CleaningServices';
-import CropIcon from '@mui/icons-material/Crop';
-import TextFieldsIcon from '@mui/icons-material/TextFields';
+import CompressIcon from "@mui/icons-material/Compress";
+import SwapHorizIcon from "@mui/icons-material/SwapHoriz";
+import CleaningServicesIcon from "@mui/icons-material/CleaningServices";
+import CropIcon from "@mui/icons-material/Crop";
+import TextFieldsIcon from "@mui/icons-material/TextFields";
 
 export interface SuggestedTool {
   id: ToolId;
@@ -19,32 +19,32 @@ export interface SuggestedTool {
   onClick: (e: React.MouseEvent) => void;
 }
 
-const ALL_SUGGESTED_TOOLS: Omit<SuggestedTool, 'href' | 'onClick'>[] = [
+const ALL_SUGGESTED_TOOLS: Omit<SuggestedTool, "href" | "onClick">[] = [
   {
-    id: 'compress',
-    title: 'Compress',
-    icon: CompressIcon
+    id: "compress",
+    title: "Compress",
+    icon: CompressIcon,
   },
   {
-    id: 'convert',
-    title: 'Convert',
-    icon: SwapHorizIcon
+    id: "convert",
+    title: "Convert",
+    icon: SwapHorizIcon,
   },
   {
-    id: 'sanitize',
-    title: 'Sanitize',
-    icon: CleaningServicesIcon
+    id: "sanitize",
+    title: "Sanitize",
+    icon: CleaningServicesIcon,
   },
   {
-    id: 'split',
-    title: 'Split',
-    icon: CropIcon
+    id: "split",
+    title: "Split",
+    icon: CropIcon,
   },
   {
-    id: 'ocr',
-    title: 'OCR',
-    icon: TextFieldsIcon
-  }
+    id: "ocr",
+    title: "OCR",
+    icon: TextFieldsIcon,
+  },
 ];
 
 export function useSuggestedTools(): SuggestedTool[] {
@@ -54,24 +54,28 @@ export function useSuggestedTools(): SuggestedTool[] {
 
   return useMemo(() => {
     // Filter out the current tool
-    const filteredTools = ALL_SUGGESTED_TOOLS.filter(tool => tool.id !== selectedTool);
+    const filteredTools = ALL_SUGGESTED_TOOLS.filter(
+      (tool) => tool.id !== selectedTool,
+    );
 
     // Add navigation props to each tool
-    return filteredTools.map(tool => {
+    return filteredTools.map((tool) => {
       const toolRegistryEntry = getSelectedTool(tool.id);
       if (!toolRegistryEntry) {
         // Fallback for tools not in registry
         return {
           ...tool,
           href: `/${tool.id}`,
-          onClick: (e: React.MouseEvent) => { e.preventDefault(); }
+          onClick: (e: React.MouseEvent) => {
+            e.preventDefault();
+          },
         };
       }
-      
+
       const navProps = getToolNavigation(tool.id, toolRegistryEntry);
       return {
         ...tool,
-        ...navProps
+        ...navProps,
       };
     });
   }, [selectedTool, getToolNavigation, getSelectedTool]);
diff --git a/frontend/src/core/hooks/useThumbnailGeneration.ts b/frontend/src/core/hooks/useThumbnailGeneration.ts
index a2b251786f..495faf3456 100644
--- a/frontend/src/core/hooks/useThumbnailGeneration.ts
+++ b/frontend/src/core/hooks/useThumbnailGeneration.ts
@@ -1,7 +1,7 @@
-import { useCallback } from 'react';
-import { thumbnailGenerationService } from '@app/services/thumbnailGenerationService';
-import { createQuickKey } from '@app/types/fileContext';
-import { FileId } from '@app/types/file';
+import { useCallback } from "react";
+import { thumbnailGenerationService } from "@app/services/thumbnailGenerationService";
+import { createQuickKey } from "@app/types/fileContext";
+import { FileId } from "@app/types/file";
 
 // Request queue to handle concurrent thumbnail requests
 interface ThumbnailRequest {
@@ -52,7 +52,9 @@ async function processRequestQueue() {
       const uncachedRequests: ThumbnailRequest[] = [];
 
       for (const request of batch) {
-        const cached = thumbnailGenerationService.getThumbnailFromCache(request.pageId);
+        const cached = thumbnailGenerationService.getThumbnailFromCache(
+          request.pageId,
+        );
         if (cached) {
           request.resolve(cached);
         } else {
@@ -70,7 +72,7 @@ async function processRequestQueue() {
         if (requests.length === 0) continue;
 
         try {
-          const pageNumbers = requests.map(req => req.pageNumber);
+          const pageNumbers = requests.map((req) => req.pageNumber);
 
           // Get or create cached ArrayBuffer to avoid reading file multiple times
           let arrayBuffer = fileArrayBufferCache.get(file);
@@ -89,26 +91,33 @@ async function processRequestQueue() {
             { scale: 1.0, quality: 0.8, batchSize: BATCH_SIZE },
             (_progress) => {
               // Optional: Could emit progress events here for UI feedback
-            }
+            },
           );
 
           // Match results back to requests and resolve
           for (const request of requests) {
-            const result = results.find(r => r.pageNumber === request.pageNumber);
+            const result = results.find(
+              (r) => r.pageNumber === request.pageNumber,
+            );
 
             if (result && result.success && result.thumbnail) {
-              thumbnailGenerationService.addThumbnailToCache(request.pageId, result.thumbnail);
+              thumbnailGenerationService.addThumbnailToCache(
+                request.pageId,
+                result.thumbnail,
+              );
               request.resolve(result.thumbnail);
             } else {
               console.warn(`No result for page ${request.pageNumber}`);
               request.resolve(null);
             }
           }
-
         } catch (error) {
-          console.warn(`Batch thumbnail generation failed for ${requests.length} pages:`, error);
+          console.warn(
+            `Batch thumbnail generation failed for ${requests.length} pages:`,
+            error,
+          );
           // Reject all requests in this batch
-          requests.forEach(request => request.reject(error as Error));
+          requests.forEach((request) => request.reject(error as Error));
         }
       }
     }
@@ -126,30 +135,40 @@ async function processRequestQueue() {
  * Tools can choose whether to include visual features
  */
 export function useThumbnailGeneration() {
-  const generateThumbnails = useCallback(async (
-    fileId: FileId,
-    pdfArrayBuffer: ArrayBuffer,
-    pageNumbers: number[],
-    options: {
-      scale?: number;
-      quality?: number;
-      batchSize?: number;
-      parallelBatches?: number;
-    } = {},
-    onProgress?: (progress: { completed: number; total: number; thumbnails: any[] }) => void
-  ) => {
-    return thumbnailGenerationService.generateThumbnails(
-      fileId,
-      pdfArrayBuffer,
-      pageNumbers,
-      options,
-      onProgress
-    );
-  }, []);
+  const generateThumbnails = useCallback(
+    async (
+      fileId: FileId,
+      pdfArrayBuffer: ArrayBuffer,
+      pageNumbers: number[],
+      options: {
+        scale?: number;
+        quality?: number;
+        batchSize?: number;
+        parallelBatches?: number;
+      } = {},
+      onProgress?: (progress: {
+        completed: number;
+        total: number;
+        thumbnails: any[];
+      }) => void,
+    ) => {
+      return thumbnailGenerationService.generateThumbnails(
+        fileId,
+        pdfArrayBuffer,
+        pageNumbers,
+        options,
+        onProgress,
+      );
+    },
+    [],
+  );
 
-  const addThumbnailToCache = useCallback((pageId: string, thumbnail: string) => {
-    thumbnailGenerationService.addThumbnailToCache(pageId, thumbnail);
-  }, []);
+  const addThumbnailToCache = useCallback(
+    (pageId: string, thumbnail: string) => {
+      thumbnailGenerationService.addThumbnailToCache(pageId, thumbnail);
+    },
+    [],
+  );
 
   const getThumbnailFromCache = useCallback((pageId: string): string | null => {
     return thumbnailGenerationService.getThumbnailFromCache(pageId);
@@ -185,61 +204,66 @@ export function useThumbnailGeneration() {
     thumbnailGenerationService.clearPDFCacheForFile(fileId);
   }, []);
 
-  const requestThumbnail = useCallback(async (
-    pageId: string,
-    file: File,
-    pageNumber: number
-  ): Promise<string | null> => {
-    // Check cache first for immediate return
-    const cached = thumbnailGenerationService.getThumbnailFromCache(pageId);
-    if (cached) {
-      return cached;
-    }
-
-    // Check if this request is already being processed globally
-    const activeRequest = activeRequests.get(pageId);
-    if (activeRequest) {
-      return activeRequest;
-    }
-
-    // Create new request promise and track it globally
-    const requestPromise = new Promise<string | null>((resolve, reject) => {
-      requestQueue.push({
-        pageId,
-        file,
-        pageNumber,
-        resolve: (result: string | null) => {
-          activeRequests.delete(pageId);
-          resolve(result);
-        },
-        reject: (error: Error) => {
-          activeRequests.delete(pageId);
-          reject(error);
-        }
-      });
-
-      // Schedule batch processing with a small delay to collect more requests
-      if (batchTimer) {
-        clearTimeout(batchTimer);
+  const requestThumbnail = useCallback(
+    async (
+      pageId: string,
+      file: File,
+      pageNumber: number,
+    ): Promise<string | null> => {
+      // Check cache first for immediate return
+      const cached = thumbnailGenerationService.getThumbnailFromCache(pageId);
+      if (cached) {
+        return cached;
       }
 
-      // Use shorter delay for the first batch (pages 1-50) to show visible content faster
-      const isFirstBatch = requestQueue.length <= BATCH_SIZE && requestQueue.every(req => req.pageNumber <= BATCH_SIZE);
-      const delay = isFirstBatch ? PRIORITY_BATCH_DELAY : BATCH_DELAY;
+      // Check if this request is already being processed globally
+      const activeRequest = activeRequests.get(pageId);
+      if (activeRequest) {
+        return activeRequest;
+      }
 
-      batchTimer = window.setTimeout(() => {
-        processRequestQueue().catch(error => {
-          console.error('Error processing thumbnail request queue:', error);
+      // Create new request promise and track it globally
+      const requestPromise = new Promise<string | null>((resolve, reject) => {
+        requestQueue.push({
+          pageId,
+          file,
+          pageNumber,
+          resolve: (result: string | null) => {
+            activeRequests.delete(pageId);
+            resolve(result);
+          },
+          reject: (error: Error) => {
+            activeRequests.delete(pageId);
+            reject(error);
+          },
         });
-        batchTimer = null;
-      }, delay);
-    });
 
-    // Track this request to prevent duplicates
-    activeRequests.set(pageId, requestPromise);
+        // Schedule batch processing with a small delay to collect more requests
+        if (batchTimer) {
+          clearTimeout(batchTimer);
+        }
 
-    return requestPromise;
-  }, []);
+        // Use shorter delay for the first batch (pages 1-50) to show visible content faster
+        const isFirstBatch =
+          requestQueue.length <= BATCH_SIZE &&
+          requestQueue.every((req) => req.pageNumber <= BATCH_SIZE);
+        const delay = isFirstBatch ? PRIORITY_BATCH_DELAY : BATCH_DELAY;
+
+        batchTimer = window.setTimeout(() => {
+          processRequestQueue().catch((error) => {
+            console.error("Error processing thumbnail request queue:", error);
+          });
+          batchTimer = null;
+        }, delay);
+      });
+
+      // Track this request to prevent duplicates
+      activeRequests.set(pageId, requestPromise);
+
+      return requestPromise;
+    },
+    [],
+  );
 
   return {
     generateThumbnails,
@@ -249,6 +273,6 @@ export function useThumbnailGeneration() {
     stopGeneration,
     destroyThumbnails,
     clearPDFCacheForFile,
-    requestThumbnail
+    requestThumbnail,
   };
 }
diff --git a/frontend/src/core/hooks/useToolManagement.tsx b/frontend/src/core/hooks/useToolManagement.tsx
index 8a05e1b454..da9377b8ae 100644
--- a/frontend/src/core/hooks/useToolManagement.tsx
+++ b/frontend/src/core/hooks/useToolManagement.tsx
@@ -1,15 +1,23 @@
-import { useState, useCallback, useMemo } from 'react';
+import { useState, useCallback, useMemo } from "react";
 import { useToolRegistry } from "@app/contexts/ToolRegistryContext";
-import { usePreferences } from '@app/contexts/PreferencesContext';
-import { getAllEndpoints, type ToolRegistryEntry, type ToolRegistry } from "@app/data/toolsTaxonomy";
+import { usePreferences } from "@app/contexts/PreferencesContext";
+import {
+  getAllEndpoints,
+  type ToolRegistryEntry,
+  type ToolRegistry,
+} from "@app/data/toolsTaxonomy";
 import { useMultipleEndpointsEnabled } from "@app/hooks/useEndpointConfig";
 import { useSelfHostedToolAvailability } from "@app/hooks/useSelfHostedToolAvailability";
 import { useSaaSMode } from "@app/hooks/useSaaSMode";
-import { FileId } from '@app/types/file';
+import { FileId } from "@app/types/file";
 import { ToolId } from "@app/types/toolId";
-import type { EndpointDisableReason } from '@app/types/endpointAvailability';
+import type { EndpointDisableReason } from "@app/types/endpointAvailability";
 
-export type ToolDisableCause = 'disabledByAdmin' | 'missingDependency' | 'unknown' | 'selfHostedOffline';
+export type ToolDisableCause =
+  | "disabledByAdmin"
+  | "missingDependency"
+  | "unknown"
+  | "selfHostedOffline";
 
 export interface ToolAvailabilityInfo {
   available: boolean;
@@ -35,74 +43,96 @@ export const useToolManagement = (): ToolManagementResult => {
   const { preferences } = usePreferences();
   const isSaaSMode = useSaaSMode();
 
-  const allEndpoints = useMemo(() => getAllEndpoints(baseRegistry), [baseRegistry]);
-  const { endpointStatus, endpointDetails, loading: endpointsLoading } = useMultipleEndpointsEnabled(allEndpoints);
+  const allEndpoints = useMemo(
+    () => getAllEndpoints(baseRegistry),
+    [baseRegistry],
+  );
+  const {
+    endpointStatus,
+    endpointDetails,
+    loading: endpointsLoading,
+  } = useMultipleEndpointsEnabled(allEndpoints);
 
   const toolEndpointList = useMemo(
-    () => (Object.keys(baseRegistry) as ToolId[])
-      // Exclude coming-soon tools (no component and no link) — they are already
-      // unavailable regardless of server state and should not appear in the
-      // self-hosted offline banner.
-      .filter(id => {
-        const tool = baseRegistry[id];
-        return !!(tool?.component ?? tool?.link);
-      })
-      .map(id => ({
-        id,
-        endpoints: baseRegistry[id]?.endpoints ?? [],
-      })),
-    [baseRegistry]
+    () =>
+      (Object.keys(baseRegistry) as ToolId[])
+        // Exclude coming-soon tools (no component and no link) — they are already
+        // unavailable regardless of server state and should not appear in the
+        // self-hosted offline banner.
+        .filter((id) => {
+          const tool = baseRegistry[id];
+          return !!(tool?.component ?? tool?.link);
+        })
+        .map((id) => ({
+          id,
+          endpoints: baseRegistry[id]?.endpoints ?? [],
+        })),
+    [baseRegistry],
   );
   const selfHostedOfflineIds = useSelfHostedToolAvailability(toolEndpointList);
 
-  const isToolAvailable = useCallback((toolKey: string): boolean => {
-    // Self-hosted offline check must come before the loading gate:
-    // in self-hosted offline mode endpointsLoading stays true indefinitely
-    // (health check never resolves), so checking it first would wrongly
-    // keep all tools enabled.
-    if (selfHostedOfflineIds.has(toolKey)) return false;
+  const isToolAvailable = useCallback(
+    (toolKey: string): boolean => {
+      // Self-hosted offline check must come before the loading gate:
+      // in self-hosted offline mode endpointsLoading stays true indefinitely
+      // (health check never resolves), so checking it first would wrongly
+      // keep all tools enabled.
+      if (selfHostedOfflineIds.has(toolKey)) return false;
 
-    // Keep tools enabled while endpoint status is loading (optimistic UX)
-    if (endpointsLoading) return true;
+      // Keep tools enabled while endpoint status is loading (optimistic UX)
+      if (endpointsLoading) return true;
 
-    const tool = baseRegistry[toolKey as ToolId];
-    const endpoints = tool?.endpoints || [];
+      const tool = baseRegistry[toolKey as ToolId];
+      const endpoints = tool?.endpoints || [];
 
-    if (endpoints.length === 0) return true;
+      if (endpoints.length === 0) return true;
 
-    const hasLocalSupport = endpoints.some((endpoint: string) => endpointStatus[endpoint] !== false);
+      const hasLocalSupport = endpoints.some(
+        (endpoint: string) => endpointStatus[endpoint] !== false,
+      );
 
-    // In SaaS mode tools without local support can route to the cloud backend
-    if (!hasLocalSupport && isSaaSMode) return true;
+      // In SaaS mode tools without local support can route to the cloud backend
+      if (!hasLocalSupport && isSaaSMode) return true;
 
-    return hasLocalSupport;
-  }, [endpointsLoading, endpointStatus, baseRegistry, isSaaSMode, selfHostedOfflineIds]);
+      return hasLocalSupport;
+    },
+    [
+      endpointsLoading,
+      endpointStatus,
+      baseRegistry,
+      isSaaSMode,
+      selfHostedOfflineIds,
+    ],
+  );
 
-  const deriveToolDisableReason = useCallback((toolKey: ToolId): ToolDisableCause => {
-    if (selfHostedOfflineIds.has(toolKey)) {
-      return 'selfHostedOffline';
-    }
+  const deriveToolDisableReason = useCallback(
+    (toolKey: ToolId): ToolDisableCause => {
+      if (selfHostedOfflineIds.has(toolKey)) {
+        return "selfHostedOffline";
+      }
 
-    const tool = baseRegistry[toolKey];
-    if (!tool) {
-      return 'unknown';
-    }
-    const endpoints = tool.endpoints || [];
-    const disabledReasons: EndpointDisableReason[] = endpoints
-      .filter(endpoint => endpointStatus[endpoint] === false)
-      .map(endpoint => endpointDetails[endpoint]?.reason ?? 'CONFIG');
+      const tool = baseRegistry[toolKey];
+      if (!tool) {
+        return "unknown";
+      }
+      const endpoints = tool.endpoints || [];
+      const disabledReasons: EndpointDisableReason[] = endpoints
+        .filter((endpoint) => endpointStatus[endpoint] === false)
+        .map((endpoint) => endpointDetails[endpoint]?.reason ?? "CONFIG");
 
-    if (disabledReasons.some(reason => reason === 'DEPENDENCY')) {
-      return 'missingDependency';
-    }
-    if (disabledReasons.some(reason => reason === 'CONFIG')) {
-      return 'disabledByAdmin';
-    }
-    if (disabledReasons.length > 0) {
-      return 'unknown';
-    }
-    return 'unknown';
-  }, [baseRegistry, endpointDetails, endpointStatus, selfHostedOfflineIds]);
+      if (disabledReasons.some((reason) => reason === "DEPENDENCY")) {
+        return "missingDependency";
+      }
+      if (disabledReasons.some((reason) => reason === "CONFIG")) {
+        return "disabledByAdmin";
+      }
+      if (disabledReasons.length > 0) {
+        return "unknown";
+      }
+      return "unknown";
+    },
+    [baseRegistry, endpointDetails, endpointStatus, selfHostedOfflineIds],
+  );
 
   const toolAvailability = useMemo(() => {
     // Skip computation during loading UNLESS some tools are already known offline.
@@ -112,25 +142,37 @@ export const useToolManagement = (): ToolManagementResult => {
       return {};
     }
     const availability: ToolAvailabilityMap = {};
-    (Object.keys(baseRegistry) as ToolId[]).forEach(toolKey => {
+    (Object.keys(baseRegistry) as ToolId[]).forEach((toolKey) => {
       const available = isToolAvailable(toolKey);
       availability[toolKey] = available
         ? { available: true }
         : { available: false, reason: deriveToolDisableReason(toolKey) };
     });
     return availability;
-  }, [baseRegistry, deriveToolDisableReason, endpointsLoading, isToolAvailable, selfHostedOfflineIds]);
+  }, [
+    baseRegistry,
+    deriveToolDisableReason,
+    endpointsLoading,
+    isToolAvailable,
+    selfHostedOfflineIds,
+  ]);
 
   const toolRegistry: Partial<ToolRegistry> = useMemo(() => {
     const availableToolRegistry: Partial<ToolRegistry> = {};
-    (Object.keys(baseRegistry) as ToolId[]).forEach(toolKey => {
+    (Object.keys(baseRegistry) as ToolId[]).forEach((toolKey) => {
       const baseTool = baseRegistry[toolKey];
       if (!baseTool) return;
       const availabilityInfo = toolAvailability[toolKey];
-      const isAvailable = availabilityInfo ? availabilityInfo.available !== false : true;
+      const isAvailable = availabilityInfo
+        ? availabilityInfo.available !== false
+        : true;
 
       // Check if tool is "coming soon" (has no component and no link)
-      const isComingSoon = !baseTool.component && !baseTool.link && toolKey !== 'read' && toolKey !== 'multiTool';
+      const isComingSoon =
+        !baseTool.component &&
+        !baseTool.link &&
+        toolKey !== "read" &&
+        toolKey !== "multiTool";
 
       if (preferences.hideUnavailableTools && (!isAvailable || isComingSoon)) {
         return;
@@ -144,9 +186,12 @@ export const useToolManagement = (): ToolManagementResult => {
     return availableToolRegistry;
   }, [baseRegistry, preferences.hideUnavailableTools, toolAvailability]);
 
-  const getSelectedTool = useCallback((toolKey: ToolId | null): ToolRegistryEntry | null => {
-    return toolKey ? toolRegistry[toolKey] || null : null;
-  }, [toolRegistry]);
+  const getSelectedTool = useCallback(
+    (toolKey: ToolId | null): ToolRegistryEntry | null => {
+      return toolKey ? toolRegistry[toolKey] || null : null;
+    },
+    [toolRegistry],
+  );
 
   return {
     selectedTool: getSelectedTool(null),
diff --git a/frontend/src/core/hooks/useToolNavigation.ts b/frontend/src/core/hooks/useToolNavigation.ts
index 7b0c055a28..e733850ac9 100644
--- a/frontend/src/core/hooks/useToolNavigation.ts
+++ b/frontend/src/core/hooks/useToolNavigation.ts
@@ -1,8 +1,8 @@
-import { useCallback } from 'react';
-import { ToolRegistryEntry, getToolUrlPath } from '@app/data/toolsTaxonomy';
-import { useToolWorkflow } from '@app/contexts/ToolWorkflowContext';
-import { handleUnlessSpecialClick } from '@app/utils/clickHandlers';
-import { ToolId } from '@app/types/toolId';
+import { useCallback } from "react";
+import { ToolRegistryEntry, getToolUrlPath } from "@app/data/toolsTaxonomy";
+import { useToolWorkflow } from "@app/contexts/ToolWorkflowContext";
+import { handleUnlessSpecialClick } from "@app/utils/clickHandlers";
+import { ToolId } from "@app/types/toolId";
 
 export interface ToolNavigationProps {
   /** Full URL for the tool (for href attribute) */
@@ -16,31 +16,37 @@ export interface ToolNavigationProps {
  * Enables right-click "Open in New Tab" while maintaining SPA behavior for regular clicks
  */
 export function useToolNavigation(): {
-  getToolNavigation: (toolId: string, tool: ToolRegistryEntry) => ToolNavigationProps;
+  getToolNavigation: (
+    toolId: string,
+    tool: ToolRegistryEntry,
+  ) => ToolNavigationProps;
 } {
   const { handleToolSelect } = useToolWorkflow();
 
-  const getToolNavigation = useCallback((toolId: string, tool: ToolRegistryEntry): ToolNavigationProps => {
-    // Generate SSR-safe relative path
-    const path = getToolUrlPath(toolId);
-    const href = path; // Relative path, no window.location needed
+  const getToolNavigation = useCallback(
+    (toolId: string, tool: ToolRegistryEntry): ToolNavigationProps => {
+      // Generate SSR-safe relative path
+      const path = getToolUrlPath(toolId);
+      const href = path; // Relative path, no window.location needed
 
-    // Click handler that maintains SPA behavior
-    const onClick = (e: React.MouseEvent) => {
-      handleUnlessSpecialClick(e, () => {
-        // Handle external links normally
-        if (tool.link) {
-          window.open(tool.link, '_blank', 'noopener,noreferrer');
-          return;
-        }
+      // Click handler that maintains SPA behavior
+      const onClick = (e: React.MouseEvent) => {
+        handleUnlessSpecialClick(e, () => {
+          // Handle external links normally
+          if (tool.link) {
+            window.open(tool.link, "_blank", "noopener,noreferrer");
+            return;
+          }
 
-        // Use SPA navigation for internal tools
-        handleToolSelect(toolId as ToolId);
-      });
-    };
+          // Use SPA navigation for internal tools
+          handleToolSelect(toolId as ToolId);
+        });
+      };
 
-    return { href, onClick };
-  }, [handleToolSelect]);
+      return { href, onClick };
+    },
+    [handleToolSelect],
+  );
 
   return { getToolNavigation };
 }
diff --git a/frontend/src/core/hooks/useToolParameters.ts b/frontend/src/core/hooks/useToolParameters.ts
index 1afd66835b..0692940ee5 100644
--- a/frontend/src/core/hooks/useToolParameters.ts
+++ b/frontend/src/core/hooks/useToolParameters.ts
@@ -2,7 +2,7 @@
  * React hooks for tool parameter management (URL logic removed)
  */
 
-import { useCallback, useMemo } from 'react';
+import { useCallback, useMemo } from "react";
 
 type ToolParameterValues = Record<string, any>;
 
@@ -11,9 +11,8 @@ type ToolParameterValues = Record<string, any>;
  */
 export function useToolParameters(
   _toolName: string,
-  _parameters: Record<string, any>
+  _parameters: Record<string, any>,
 ): [ToolParameterValues, (updates: Partial<ToolParameterValues>) => void] {
-
   // Return empty values and noop updater
   const currentValues = useMemo(() => ({}), []);
   const updateParameters = useCallback(() => {}, []);
@@ -27,15 +26,20 @@ export function useToolParameters(
 export function useToolParameter<T = any>(
   toolName: string,
   paramName: string,
-  definition: any
+  definition: any,
 ): [T, (value: T) => void] {
-  const [allParams, updateParams] = useToolParameters(toolName, { [paramName]: definition });
+  const [allParams, updateParams] = useToolParameters(toolName, {
+    [paramName]: definition,
+  });
 
   const value = allParams[paramName] as T;
 
-  const setValue = useCallback((newValue: T) => {
-    updateParams({ [paramName]: newValue });
-  }, [paramName, updateParams]);
+  const setValue = useCallback(
+    (newValue: T) => {
+      updateParams({ [paramName]: newValue });
+    },
+    [paramName, updateParams],
+  );
 
   return [value, setValue];
 }
diff --git a/frontend/src/core/hooks/useToolSections.ts b/frontend/src/core/hooks/useToolSections.ts
index a94e4c4748..84ccc22c83 100644
--- a/frontend/src/core/hooks/useToolSections.ts
+++ b/frontend/src/core/hooks/useToolSections.ts
@@ -1,12 +1,20 @@
-import { useMemo } from 'react';
+import { useMemo } from "react";
 
-import { SUBCATEGORY_ORDER, SubcategoryId, ToolCategoryId, ToolRegistryEntry } from '@app/data/toolsTaxonomy';
-import { useTranslation } from 'react-i18next';
+import {
+  SUBCATEGORY_ORDER,
+  SubcategoryId,
+  ToolCategoryId,
+  ToolRegistryEntry,
+} from "@app/data/toolsTaxonomy";
+import { useTranslation } from "react-i18next";
 import { ToolId } from "@app/types/toolId";
 
 type SubcategoryIdMap = {
-  [subcategoryId in SubcategoryId]: Array<{ id: ToolId; tool: ToolRegistryEntry }>;
-}
+  [subcategoryId in SubcategoryId]: Array<{
+    id: ToolId;
+    tool: ToolRegistryEntry;
+  }>;
+};
 
 type GroupedTools = {
   [categoryId in ToolCategoryId]: SubcategoryIdMap;
@@ -18,19 +26,22 @@ export interface SubcategoryGroup {
     id: ToolId;
     tool: ToolRegistryEntry;
   }[];
-};
+}
 
-export type ToolSectionKey = 'quick' | 'all';
+export type ToolSectionKey = "quick" | "all";
 
 export interface ToolSection {
   key: ToolSectionKey;
   title: string;
   subcategories: SubcategoryGroup[];
-};
+}
 
 export function useToolSections(
-  filteredTools: Array<{ item: [ToolId, ToolRegistryEntry]; matchedText?: string }>,
-  searchQuery?: string
+  filteredTools: Array<{
+    item: [ToolId, ToolRegistryEntry];
+    matchedText?: string;
+  }>,
+  searchQuery?: string,
 ) {
   const { t } = useTranslation();
 
@@ -44,7 +55,8 @@ export function useToolSections(
       const categoryId = tool.categoryId;
       const subcategoryId = tool.subcategoryId;
       if (!grouped[categoryId]) grouped[categoryId] = {} as SubcategoryIdMap;
-      if (!grouped[categoryId][subcategoryId]) grouped[categoryId][subcategoryId] = [];
+      if (!grouped[categoryId][subcategoryId])
+        grouped[categoryId][subcategoryId] = [];
       grouped[categoryId][subcategoryId].push({ id, tool });
     });
     return grouped;
@@ -78,8 +90,12 @@ export function useToolSections(
           if (!quick[subcategoryId]) quick[subcategoryId] = [];
           // Only include ready tools (have a component or external link) in Quick Access
           // Special case: read and multiTool are navigational tools that don't need components
-          const readyTools = tools.filter(({ tool, id }) =>
-            tool.component !== null || !!tool.link || id === 'read' || id === 'multiTool'
+          const readyTools = tools.filter(
+            ({ tool, id }) =>
+              tool.component !== null ||
+              !!tool.link ||
+              id === "read" ||
+              id === "multiTool",
           );
           quick[subcategoryId].push(...readyTools);
         });
@@ -96,14 +112,27 @@ export function useToolSections(
           if (ai !== bi) return ai - bi;
           return aId.localeCompare(bId);
         })
-        .map(([subcategoryId, tools]) => ({ subcategoryId, tools } as SubcategoryGroup));
+        .map(
+          ([subcategoryId, tools]) =>
+            ({ subcategoryId, tools }) as SubcategoryGroup,
+        );
 
     const built: ToolSection[] = [
-      { key: 'quick', title: t('toolPicker.quickAccess', 'QUICK ACCESS'), subcategories: sortSubs(quick) },
-      { key: 'all', title: t('toolPicker.allTools', 'ALL TOOLS'), subcategories: sortSubs(all) }
+      {
+        key: "quick",
+        title: t("toolPicker.quickAccess", "QUICK ACCESS"),
+        subcategories: sortSubs(quick),
+      },
+      {
+        key: "all",
+        title: t("toolPicker.allTools", "ALL TOOLS"),
+        subcategories: sortSubs(all),
+      },
     ];
 
-    return built.filter(section => section.subcategories.some(sc => sc.tools.length > 0));
+    return built.filter((section) =>
+      section.subcategories.some((sc) => sc.tools.length > 0),
+    );
   }, [groupedTools]);
 
   const searchGroups: SubcategoryGroup[] = useMemo(() => {
@@ -138,16 +167,20 @@ export function useToolSections(
           if (ai !== bi) return ai - bi;
           return (a as SubcategoryId).localeCompare(b as SubcategoryId);
         })
-        .map(([subcategoryId, tools]) => ({ subcategoryId, tools } as SubcategoryGroup));
+        .map(
+          ([subcategoryId, tools]) =>
+            ({ subcategoryId, tools }) as SubcategoryGroup,
+        );
     }
 
     // No search: alphabetical subcategory ordering
     return entries
       .sort(([a], [b]) => a.localeCompare(b))
-      .map(([subcategoryId, tools]) => ({ subcategoryId, tools } as SubcategoryGroup));
+      .map(
+        ([subcategoryId, tools]) =>
+          ({ subcategoryId, tools }) as SubcategoryGroup,
+      );
   }, [filteredTools, searchQuery]);
 
   return { sections, searchGroups };
 }
-
-
diff --git a/frontend/src/core/hooks/useTooltipPosition.ts b/frontend/src/core/hooks/useTooltipPosition.ts
index 506ce562b0..626f6a3bea 100644
--- a/frontend/src/core/hooks/useTooltipPosition.ts
+++ b/frontend/src/core/hooks/useTooltipPosition.ts
@@ -1,9 +1,9 @@
-import { useState, useEffect } from 'react';
-import { clamp } from '@app/utils/genericUtils';
-import { getSidebarInfo } from '@app/utils/sidebarUtils';
-import { SidebarRefs, SidebarState } from '@app/types/sidebar';
+import { useState, useEffect } from "react";
+import { clamp } from "@app/utils/genericUtils";
+import { getSidebarInfo } from "@app/utils/sidebarUtils";
+import { SidebarRefs, SidebarState } from "@app/types/sidebar";
 
-type Position = 'right' | 'left' | 'top' | 'bottom';
+type Position = "right" | "left" | "top" | "bottom";
 
 interface PlacementResult {
   top: number;
@@ -19,25 +19,25 @@ function place(
   triggerRect: DOMRect,
   tooltipRect: DOMRect,
   position: Position,
-  offset: number
+  offset: number,
 ): PlacementResult {
   let top = 0;
   let left = 0;
 
   switch (position) {
-    case 'right':
+    case "right":
       top = triggerRect.top + triggerRect.height / 2 - tooltipRect.height / 2;
       left = triggerRect.right + offset;
       break;
-    case 'left':
+    case "left":
       top = triggerRect.top + triggerRect.height / 2 - tooltipRect.height / 2;
       left = triggerRect.left - tooltipRect.width - offset;
       break;
-    case 'top':
+    case "top":
       top = triggerRect.top - tooltipRect.height - offset;
       left = triggerRect.left + triggerRect.width / 2 - tooltipRect.width / 2;
       break;
-    case 'bottom':
+    case "bottom":
       top = triggerRect.bottom + offset;
       left = triggerRect.left + triggerRect.width / 2 - tooltipRect.width / 2;
       break;
@@ -54,7 +54,7 @@ export function useTooltipPosition({
   triggerRef,
   tooltipRef,
   sidebarRefs,
-  sidebarState
+  sidebarState,
 }: {
   open: boolean;
   sidebarTooltip: boolean;
@@ -65,16 +65,21 @@ export function useTooltipPosition({
   sidebarRefs?: SidebarRefs;
   sidebarState?: SidebarState;
 }): PositionState {
-  const [coords, setCoords] = useState<{ top: number; left: number; arrowOffset: number | null }>({
+  const [coords, setCoords] = useState<{
+    top: number;
+    left: number;
+    arrowOffset: number | null;
+  }>({
     top: 0,
     left: 0,
-    arrowOffset: null
+    arrowOffset: null,
   });
   const [positionReady, setPositionReady] = useState(false);
 
   // Fallback sidebar position (only used as last resort)
   const sidebarLeft = 240;
-  const isRTL = typeof document !== 'undefined' && document.documentElement.dir === 'rtl';
+  const isRTL =
+    typeof document !== "undefined" && document.documentElement.dir === "rtl";
 
   const updatePosition = () => {
     if (!triggerRef.current || !open) return;
@@ -88,7 +93,9 @@ export function useTooltipPosition({
     if (sidebarTooltip) {
       // Require sidebar refs and state for proper positioning
       if (!sidebarRefs || !sidebarState) {
-        console.warn('Sidebar tooltip requires sidebarRefs and sidebarState props');
+        console.warn(
+          "Sidebar tooltip requires sidebarRefs and sidebarState props",
+        );
         setPositionReady(false);
         return;
       }
@@ -102,7 +109,7 @@ export function useTooltipPosition({
 
       // Only show tooltip if we have the tool panel active
       if (!sidebarInfo.isToolPanelActive) {
-        console.log('Not showing tooltip - tool panel not active');
+        console.log("Not showing tooltip - tool panel not active");
         setPositionReady(false);
         return;
       }
@@ -145,7 +152,7 @@ export function useTooltipPosition({
       left = clamp(left, 4, window.innerWidth - tooltipRect.width - 4);
 
       // Calculate arrow position to stay aligned with trigger
-      if (position === 'top' || position === 'bottom') {
+      if (position === "top" || position === "bottom") {
         // For top/bottom arrows, adjust horizontal position
         const triggerCenter = triggerRect.left + triggerRect.width / 2;
         const tooltipCenter = left + tooltipRect.width / 2;
@@ -174,12 +181,12 @@ export function useTooltipPosition({
     requestAnimationFrame(updatePosition);
 
     const handleUpdate = () => requestAnimationFrame(updatePosition);
-    window.addEventListener('scroll', handleUpdate, true);
-    window.addEventListener('resize', handleUpdate);
+    window.addEventListener("scroll", handleUpdate, true);
+    window.addEventListener("resize", handleUpdate);
 
     return () => {
-      window.removeEventListener('scroll', handleUpdate, true);
-      window.removeEventListener('resize', handleUpdate);
+      window.removeEventListener("scroll", handleUpdate, true);
+      window.removeEventListener("resize", handleUpdate);
     };
   }, [open, sidebarLeft, position, gap, sidebarTooltip]);
 
diff --git a/frontend/src/core/hooks/useTranslation.ts b/frontend/src/core/hooks/useTranslation.ts
index 97a7aa032d..6da312c3d6 100644
--- a/frontend/src/core/hooks/useTranslation.ts
+++ b/frontend/src/core/hooks/useTranslation.ts
@@ -1,20 +1,20 @@
 // Re-export react-i18next hook with our custom types
-export { useTranslation } from 'react-i18next';
+export { useTranslation } from "react-i18next";
 
 // You can add custom hooks here later if needed
 // For example, a hook that returns commonly used translations
-import { useTranslation as useI18nTranslation } from 'react-i18next';
+import { useTranslation as useI18nTranslation } from "react-i18next";
 
 export const useCommonTranslations = () => {
   const { t } = useI18nTranslation();
-  
+
   return {
-    submit: t('genericSubmit'),
-    selectPdf: t('pdfPrompt'),
-    selectPdfs: t('multiPdfPrompt'),
-    selectImages: t('imgPrompt'),
-    loading: t('loading', 'Loading...'), // fallback if not found
-    error: t('error._value', 'Error'), 
-    success: t('success', 'Success'),
+    submit: t("genericSubmit"),
+    selectPdf: t("pdfPrompt"),
+    selectPdfs: t("multiPdfPrompt"),
+    selectImages: t("imgPrompt"),
+    loading: t("loading", "Loading..."), // fallback if not found
+    error: t("error._value", "Error"),
+    success: t("success", "Success"),
   };
-};
\ No newline at end of file
+};
diff --git a/frontend/src/core/hooks/useUndoRedo.ts b/frontend/src/core/hooks/useUndoRedo.ts
index 6ce914a89f..5241f58891 100644
--- a/frontend/src/core/hooks/useUndoRedo.ts
+++ b/frontend/src/core/hooks/useUndoRedo.ts
@@ -1,4 +1,4 @@
-import { useState, useCallback } from 'react';
+import { useState, useCallback } from "react";
 
 export interface Command {
   execute(): void;
@@ -19,7 +19,7 @@ export function useUndoRedo() {
 
   const executeCommand = useCallback((command: Command | CommandSequence) => {
     command.execute();
-    setUndoStack(prev => [command, ...prev]);
+    setUndoStack((prev) => [command, ...prev]);
     setRedoStack([]); // Clear redo stack when new command is executed
   }, []);
 
@@ -28,10 +28,10 @@ export function useUndoRedo() {
 
     const command = undoStack[0];
     command.undo();
-    
-    setUndoStack(prev => prev.slice(1));
-    setRedoStack(prev => [command, ...prev]);
-    
+
+    setUndoStack((prev) => prev.slice(1));
+    setRedoStack((prev) => [command, ...prev]);
+
     return true;
   }, [undoStack]);
 
@@ -40,10 +40,10 @@ export function useUndoRedo() {
 
     const command = redoStack[0];
     command.execute();
-    
-    setRedoStack(prev => prev.slice(1));
-    setUndoStack(prev => [command, ...prev]);
-    
+
+    setRedoStack((prev) => prev.slice(1));
+    setUndoStack((prev) => [command, ...prev]);
+
     return true;
   }, [redoStack]);
 
@@ -63,6 +63,6 @@ export function useUndoRedo() {
     canUndo,
     canRedo,
     undoStack,
-    redoStack
+    redoStack,
   };
-}
\ No newline at end of file
+}
diff --git a/frontend/src/core/hooks/useUrlSync.ts b/frontend/src/core/hooks/useUrlSync.ts
index 6c9ff903de..27ae833a70 100644
--- a/frontend/src/core/hooks/useUrlSync.ts
+++ b/frontend/src/core/hooks/useUrlSync.ts
@@ -2,13 +2,17 @@
  * URL synchronization hooks for tool routing with registry support
  */
 
-import { useEffect, useCallback, useRef } from 'react';
-import { ToolId } from '@app/types/toolId';
-import { parseToolRoute, updateToolRoute, clearToolRoute } from '@app/utils/urlRouting';
-import { ToolRegistry } from '@app/data/toolsTaxonomy';
-import { firePixel } from '@app/utils/scarfTracking';
-import { withBasePath } from '@app/constants/app';
-import { useAppConfig } from '@app/contexts/AppConfigContext';
+import { useEffect, useCallback, useRef } from "react";
+import { ToolId } from "@app/types/toolId";
+import {
+  parseToolRoute,
+  updateToolRoute,
+  clearToolRoute,
+} from "@app/utils/urlRouting";
+import { ToolRegistry } from "@app/data/toolsTaxonomy";
+import { firePixel } from "@app/utils/scarfTracking";
+import { withBasePath } from "@app/constants/app";
+import { useAppConfig } from "@app/contexts/AppConfigContext";
 
 /**
  * Hook to sync workbench and tool with URL using registry
@@ -18,28 +22,31 @@ export function useNavigationUrlSync(
   handleToolSelect: (toolId: ToolId) => void,
   clearToolSelection: () => void,
   registry: ToolRegistry,
-  enableSync: boolean = true
+  enableSync: boolean = true,
 ) {
   const { config } = useAppConfig();
   const premiumEnabled = config?.premiumEnabled;
   const hasInitialized = useRef(false);
   const prevSelectedTool = useRef<ToolId | null>(null);
-  
+
   // Check if tool requires premium and redirect if needed
-  const checkPremiumAndSelect = useCallback((toolId: ToolId) => {
-    const tool = registry[toolId];
-    if (tool?.requiresPremium === true && premiumEnabled !== true) {
-      // Premium tool accessed without premium - redirect to home
-      const homePath = withBasePath('/');
-      if (window.location.pathname !== homePath) {
-        clearToolRoute(true); // Use replaceState to avoid adding to history
-        window.location.href = homePath;
+  const checkPremiumAndSelect = useCallback(
+    (toolId: ToolId) => {
+      const tool = registry[toolId];
+      if (tool?.requiresPremium === true && premiumEnabled !== true) {
+        // Premium tool accessed without premium - redirect to home
+        const homePath = withBasePath("/");
+        if (window.location.pathname !== homePath) {
+          clearToolRoute(true); // Use replaceState to avoid adding to history
+          window.location.href = homePath;
+        }
+        return;
       }
-      return;
-    }
-    handleToolSelect(toolId);
-  }, [registry, premiumEnabled, handleToolSelect]);
-  
+      handleToolSelect(toolId);
+    },
+    [registry, premiumEnabled, handleToolSelect],
+  );
+
   // Initialize workbench and tool from URL on mount
   useEffect(() => {
     if (!enableSync) return;
@@ -75,7 +82,7 @@ export function useNavigationUrlSync(
     } else if (prevSelectedTool.current !== null) {
       // Only clear URL if we had a tool before (user navigated away)
       // Don't clear on initial load when both current and previous are null
-      const homePath = withBasePath('/');
+      const homePath = withBasePath("/");
       if (window.location.pathname !== homePath) {
         clearToolRoute(false); // Use pushState for user navigation
       }
@@ -103,36 +110,50 @@ export function useNavigationUrlSync(
       }
     };
 
-    window.addEventListener('popstate', handlePopState);
-    return () => window.removeEventListener('popstate', handlePopState);
-  }, [selectedTool, handleToolSelect, clearToolSelection, registry, enableSync, checkPremiumAndSelect]);
+    window.addEventListener("popstate", handlePopState);
+    return () => window.removeEventListener("popstate", handlePopState);
+  }, [
+    selectedTool,
+    handleToolSelect,
+    clearToolSelection,
+    registry,
+    enableSync,
+    checkPremiumAndSelect,
+  ]);
 }
 
 /**
  * Hook to programmatically navigate to tools with registry support
  */
 export function useToolNavigation(registry: ToolRegistry) {
-  const navigateToTool = useCallback((toolId: ToolId) => {
-    updateToolRoute(toolId, registry);
+  const navigateToTool = useCallback(
+    (toolId: ToolId) => {
+      updateToolRoute(toolId, registry);
 
-    // Dispatch a custom event to notify other components
-    window.dispatchEvent(new CustomEvent('toolNavigation', {
-      detail: { toolId }
-    }));
-  }, [registry]);
+      // Dispatch a custom event to notify other components
+      window.dispatchEvent(
+        new CustomEvent("toolNavigation", {
+          detail: { toolId },
+        }),
+      );
+    },
+    [registry],
+  );
 
   const navigateToHome = useCallback(() => {
     clearToolRoute();
 
     // Dispatch a custom event to notify other components
-    window.dispatchEvent(new CustomEvent('toolNavigation', {
-      detail: { toolId: null }
-    }));
+    window.dispatchEvent(
+      new CustomEvent("toolNavigation", {
+        detail: { toolId: null },
+      }),
+    );
   }, []);
 
   return {
     navigateToTool,
-    navigateToHome
+    navigateToHome,
   };
 }
 
diff --git a/frontend/src/core/hooks/useViewerKeyCommand.ts b/frontend/src/core/hooks/useViewerKeyCommand.ts
new file mode 100644
index 0000000000..de1b8ab371
--- /dev/null
+++ b/frontend/src/core/hooks/useViewerKeyCommand.ts
@@ -0,0 +1,4 @@
+// Default implementation for non-desktop environments (overridden in desktop)
+export function useViewerKeyCommand(): (event: KeyboardEvent) => boolean {
+  return () => false;
+}
diff --git a/frontend/src/core/hooks/useWheelZoom.ts b/frontend/src/core/hooks/useWheelZoom.ts
index 66dd2e2941..f43a0419c2 100644
--- a/frontend/src/core/hooks/useWheelZoom.ts
+++ b/frontend/src/core/hooks/useWheelZoom.ts
@@ -1,4 +1,4 @@
-import { RefObject, useEffect } from 'react';
+import { RefObject, useEffect } from "react";
 
 interface UseWheelZoomOptions {
   /**
@@ -75,9 +75,9 @@ export function useWheelZoom({
       }
     };
 
-    element.addEventListener('wheel', handleWheel, { passive: false });
+    element.addEventListener("wheel", handleWheel, { passive: false });
     return () => {
-      element.removeEventListener('wheel', handleWheel);
+      element.removeEventListener("wheel", handleWheel);
     };
   }, [ref, onZoomIn, onZoomOut, enabled, threshold, requireModifierKey]);
 }
diff --git a/frontend/src/core/hooks/useZipConfirmation.ts b/frontend/src/core/hooks/useZipConfirmation.ts
index e23a2ce80d..5a6ee3bc2e 100644
--- a/frontend/src/core/hooks/useZipConfirmation.ts
+++ b/frontend/src/core/hooks/useZipConfirmation.ts
@@ -1,4 +1,4 @@
-import { useState, useCallback, useRef } from 'react';
+import { useState, useCallback, useRef } from "react";
 
 interface ZipConfirmationState {
   opened: boolean;
@@ -12,11 +12,12 @@ interface ZipConfirmationState {
  * Uses useRef to avoid recreating callbacks on every state change
  */
 export const useZipConfirmation = () => {
-  const [confirmationState, setConfirmationState] = useState<ZipConfirmationState>({
-    opened: false,
-    fileCount: 0,
-    fileName: '',
-  });
+  const [confirmationState, setConfirmationState] =
+    useState<ZipConfirmationState>({
+      opened: false,
+      fileCount: 0,
+      fileName: "",
+    });
 
   // Store resolve function in ref to avoid callback recreation
   const resolveRef = useRef<((value: boolean) => void) | null>(null);
@@ -25,16 +26,19 @@ export const useZipConfirmation = () => {
    * Request confirmation from user for extracting a large ZIP file
    * Returns a Promise that resolves to true if user confirms, false if cancelled
    */
-  const requestConfirmation = useCallback((fileCount: number, fileName: string): Promise<boolean> => {
-    return new Promise((resolve) => {
-      resolveRef.current = resolve;
-      setConfirmationState({
-        opened: true,
-        fileCount,
-        fileName,
+  const requestConfirmation = useCallback(
+    (fileCount: number, fileName: string): Promise<boolean> => {
+      return new Promise((resolve) => {
+        resolveRef.current = resolve;
+        setConfirmationState({
+          opened: true,
+          fileCount,
+          fileName,
+        });
       });
-    });
-  }, []);
+    },
+    [],
+  );
 
   /**
    * Handle user confirmation - extract the ZIP
@@ -47,7 +51,7 @@ export const useZipConfirmation = () => {
     setConfirmationState({
       opened: false,
       fileCount: 0,
-      fileName: '',
+      fileName: "",
     });
   }, []); // No dependencies - uses ref
 
@@ -62,7 +66,7 @@ export const useZipConfirmation = () => {
     setConfirmationState({
       opened: false,
       fileCount: 0,
-      fileName: '',
+      fileName: "",
     });
   }, []); // No dependencies - uses ref
 
diff --git a/frontend/src/core/i18n.ts b/frontend/src/core/i18n.ts
index 71239586ed..6d48752af9 100644
--- a/frontend/src/core/i18n.ts
+++ b/frontend/src/core/i18n.ts
@@ -1,59 +1,59 @@
-import i18n from 'i18next';
-import { initReactI18next } from 'react-i18next';
-import LanguageDetector from 'i18next-browser-languagedetector';
-import TomlBackend from '@app/i18n/tomlBackend';
+import i18n from "i18next";
+import { initReactI18next } from "react-i18next";
+import LanguageDetector from "i18next-browser-languagedetector";
+import TomlBackend from "@app/i18n/tomlBackend";
 
 // Define supported languages (based on your existing translations)
 export const supportedLanguages = {
-  'en-GB': 'English',
-  'ar-AR': 'العربية',
-  'az-AZ': 'Azərbaycan Dili',
-  'bg-BG': 'Българ�ки',
-  'ca-CA': 'Català',
-  'cs-CZ': 'ÄŒesky',
-  'da-DK': 'Dansk',
-  'de-DE': 'Deutsch',
-  'el-GR': 'Ελληνικά',
-  'es-ES': 'Español',
-  'eu-ES': 'Euskara',
-  'fa-IR': '�ارسی',
-  'fr-FR': 'Français',
-  'ga-IE': 'Gaeilge',
-  'hi-IN': 'हिंदी',
-  'hr-HR': 'Hrvatski',
-  'hu-HU': 'Magyar',
-  'id-ID': 'Bahasa Indonesia',
-  'it-IT': 'Italiano',
-  'ja-JP': '日本語',
-  'ko-KR': '한국어',
-  'ml-ML': 'മലയാളം',
-  'nl-NL': 'Nederlands',
-  'no-NB': 'Norsk',
-  'pl-PL': 'Polski',
-  'pt-BR': 'Português (Brasil)',
-  'pt-PT': 'Português',
-  'ro-RO': 'Română',
-  'ru-RU': 'Ру��кий',
-  'sk-SK': 'Slovensky',
-  'sl-SI': 'Slovenš�ina',
-  'sr-LATN-RS': 'Srpski',
-  'sv-SE': 'Svenska',
-  'th-TH': 'ไทย',
-  'tr-TR': 'Türkçe',
-  'uk-UA': 'Україн�ька',
-  'vi-VN': 'Tiếng Việt',
-  'zh-BO': 'བོད་ཡིག',
-  'zh-CN': '简体中文',
-  'zh-TW': '�體中文',
+  "en-GB": "English",
+  "ar-AR": "العربية",
+  "az-AZ": "Azərbaycan Dili",
+  "bg-BG": "Българ�ки",
+  "ca-CA": "Català",
+  "cs-CZ": "ÄŒesky",
+  "da-DK": "Dansk",
+  "de-DE": "Deutsch",
+  "el-GR": "Ελληνικά",
+  "es-ES": "Español",
+  "eu-ES": "Euskara",
+  "fa-IR": "�ارسی",
+  "fr-FR": "Français",
+  "ga-IE": "Gaeilge",
+  "hi-IN": "हिंदी",
+  "hr-HR": "Hrvatski",
+  "hu-HU": "Magyar",
+  "id-ID": "Bahasa Indonesia",
+  "it-IT": "Italiano",
+  "ja-JP": "日本語",
+  "ko-KR": "한국어",
+  "ml-ML": "മലയാളം",
+  "nl-NL": "Nederlands",
+  "no-NB": "Norsk",
+  "pl-PL": "Polski",
+  "pt-BR": "Português (Brasil)",
+  "pt-PT": "Português",
+  "ro-RO": "Română",
+  "ru-RU": "Ру��кий",
+  "sk-SK": "Slovensky",
+  "sl-SI": "Slovenš�ina",
+  "sr-LATN-RS": "Srpski",
+  "sv-SE": "Svenska",
+  "th-TH": "ไทย",
+  "tr-TR": "Türkçe",
+  "uk-UA": "Україн�ька",
+  "vi-VN": "Tiếng Việt",
+  "zh-BO": "བོད་ཡིག",
+  "zh-CN": "简体中文",
+  "zh-TW": "�體中文",
 };
 
 // RTL languages (based on your existing language.direction property)
-export const rtlLanguages = ['ar-AR', 'fa-IR'];
+export const rtlLanguages = ["ar-AR", "fa-IR"];
 
 // LocalStorage keys for i18next
 export const I18N_STORAGE_KEYS = {
-  LANGUAGE: 'i18nextLng',
-  LANGUAGE_SOURCE: 'i18nextLng-source',
+  LANGUAGE: "i18nextLng",
+  LANGUAGE_SOURCE: "i18nextLng-source",
 } as const;
 
 /**
@@ -72,11 +72,11 @@ i18n
   .use(LanguageDetector)
   .use(initReactI18next)
   .init({
-    fallbackLng: 'en-GB',
+    fallbackLng: "en-GB",
     supportedLngs: Object.keys(supportedLanguages),
-    load: 'currentOnly',
+    load: "currentOnly",
     nonExplicitSupportedLngs: false,
-    debug: process.env.NODE_ENV === 'development',
+    debug: process.env.NODE_ENV === "development",
 
     // Ensure synchronous loading to prevent timing issues
     initImmediate: false,
@@ -88,63 +88,69 @@ i18n
     backend: {
       loadPath: (lngs: string[], namespaces: string[]) => {
         const lng = lngs[0];
-        const basePath = import.meta.env.BASE_URL || '/';
-        const cleanBasePath = basePath.endsWith('/') ? basePath.slice(0, -1) : basePath;
+        const basePath = import.meta.env.BASE_URL || "/";
+        const cleanBasePath = basePath.endsWith("/")
+          ? basePath.slice(0, -1)
+          : basePath;
         return `${cleanBasePath}/locales/${lng}/${namespaces[0]}.toml`;
       },
     },
 
     detection: {
-      order: ['localStorage', 'navigator', 'htmlTag'],
+      order: ["localStorage", "navigator", "htmlTag"],
       caches: [], // Don't cache auto-detected language - only cache when user manually selects
       convertDetectedLanguage: (lng: string) => {
         // Map en and en-US to en-GB
-        if (lng === 'en' || lng === 'en-US') return 'en-GB';
+        if (lng === "en" || lng === "en-US") return "en-GB";
         return lng;
       },
     },
 
     react: {
       useSuspense: true, // Enable suspense to prevent premature rendering
-      bindI18n: 'languageChanged loaded',
-      bindI18nStore: 'added removed',
-      transEmptyNodeValue: '', // Return empty string for missing keys instead of key name
+      bindI18n: "languageChanged loaded",
+      bindI18nStore: "added removed",
+      transEmptyNodeValue: "", // Return empty string for missing keys instead of key name
       transSupportBasicHtmlNodes: true,
-      transKeepBasicHtmlNodesFor: ['br', 'strong', 'i', 'p'],
+      transKeepBasicHtmlNodesFor: ["br", "strong", "i", "p"],
     },
   });
 
-
 // Set document direction based on language
-i18n.on('languageChanged', (lng) => {
+i18n.on("languageChanged", (lng) => {
   const isRTL = rtlLanguages.includes(lng);
-  document.documentElement.dir = isRTL ? 'rtl' : 'ltr';
+  document.documentElement.dir = isRTL ? "rtl" : "ltr";
   document.documentElement.lang = lng;
 });
 
 // Track browser-detected language on first initialization
-i18n.on('initialized', () => {
+i18n.on("initialized", () => {
   // If no source is set yet, mark current language as browser-detected
   if (!localStorage.getItem(I18N_STORAGE_KEYS.LANGUAGE_SOURCE)) {
     const detectedLang = i18n.language;
     if (detectedLang) {
       localStorage.setItem(I18N_STORAGE_KEYS.LANGUAGE, detectedLang);
-      localStorage.setItem(I18N_STORAGE_KEYS.LANGUAGE_SOURCE, String(LanguageSource.Browser));
+      localStorage.setItem(
+        I18N_STORAGE_KEYS.LANGUAGE_SOURCE,
+        String(LanguageSource.Browser),
+      );
     }
   }
 });
 
 export function normalizeLanguageCode(languageCode: string): string {
   // Replace underscores with hyphens to align with i18next/translation file naming
-  const hyphenated = languageCode.replace(/_/g, '-');
-  const [base, ...rest] = hyphenated.split('-');
+  const hyphenated = languageCode.replace(/_/g, "-");
+  const [base, ...rest] = hyphenated.split("-");
 
   if (rest.length === 0) {
     return base.toLowerCase();
   }
 
-  const normalizedParts = rest.map(part => (part.length <= 3 ? part.toUpperCase() : part));
-  return [base.toLowerCase(), ...normalizedParts].join('-');
+  const normalizedParts = rest.map((part) =>
+    part.length <= 3 ? part.toUpperCase() : part,
+  );
+  return [base.toLowerCase(), ...normalizedParts].join("-");
 }
 
 /**
@@ -152,7 +158,7 @@ export function normalizeLanguageCode(languageCode: string): string {
  * Used for backend API communication which expects underscore format
  */
 export function toUnderscoreFormat(languageCode: string): string {
-  return languageCode.replace(/-/g, '_');
+  return languageCode.replace(/-/g, "_");
 }
 
 /**
@@ -162,21 +168,25 @@ export function toUnderscoreLanguages(languages: string[]): string[] {
   return languages.map(toUnderscoreFormat);
 }
 
-
 /**
  * Get the current language source priority
  */
 function getCurrentSourcePriority(): LanguageSource {
   const sourceStr = localStorage.getItem(I18N_STORAGE_KEYS.LANGUAGE_SOURCE);
   const sourceNum = sourceStr ? parseInt(sourceStr, 10) : null;
-  return (sourceNum !== null && !isNaN(sourceNum)) ? sourceNum as LanguageSource : LanguageSource.Fallback;
+  return sourceNum !== null && !isNaN(sourceNum)
+    ? (sourceNum as LanguageSource)
+    : LanguageSource.Fallback;
 }
 
 /**
  * Set language with priority tracking
  * Only updates if new source has equal or higher priority than current
  */
-function setLanguageWithPriority(language: string, source: LanguageSource): boolean {
+function setLanguageWithPriority(
+  language: string,
+  source: LanguageSource,
+): boolean {
   const currentPriority = getCurrentSourcePriority();
   const newPriority = source;
 
@@ -207,10 +217,18 @@ export function setUserLanguage(language: string): void {
  * @param configLanguages - Optional array of language codes from server config (ui.languages)
  * @param defaultLocale - Optional default language for new users (system.defaultLocale)
  */
-export function updateSupportedLanguages(configLanguages?: string[] | null, defaultLocale?: string | null) {
+export function updateSupportedLanguages(
+  configLanguages?: string[] | null,
+  defaultLocale?: string | null,
+) {
   // Normalize and validate default locale if provided
-  const normalizedDefault = defaultLocale ? normalizeLanguageCode(defaultLocale) : null;
-  const validDefault = normalizedDefault && normalizedDefault in supportedLanguages ? normalizedDefault : null;
+  const normalizedDefault = defaultLocale
+    ? normalizeLanguageCode(defaultLocale)
+    : null;
+  const validDefault =
+    normalizedDefault && normalizedDefault in supportedLanguages
+      ? normalizedDefault
+      : null;
 
   if (!configLanguages || configLanguages.length === 0) {
     // No filter specified - keep all languages
@@ -223,7 +241,7 @@ export function updateSupportedLanguages(configLanguages?: string[] | null, defa
 
   const validLanguages = configLanguages
     .map(normalizeLanguageCode)
-    .filter(lang => lang in supportedLanguages);
+    .filter((lang) => lang in supportedLanguages);
 
   // If no valid languages were provided, keep existing configuration
   if (validLanguages.length === 0) {
@@ -231,17 +249,18 @@ export function updateSupportedLanguages(configLanguages?: string[] | null, defa
   }
 
   // Determine fallback: prefer validDefault if in the list, then en-GB, then first valid language
-  const fallback = validDefault && validLanguages.includes(validDefault)
-    ? validDefault
-    : validLanguages.includes('en-GB')
-      ? 'en-GB'
-      : validLanguages[0];
+  const fallback =
+    validDefault && validLanguages.includes(validDefault)
+      ? validDefault
+      : validLanguages.includes("en-GB")
+        ? "en-GB"
+        : validLanguages[0];
 
   i18n.options.supportedLngs = validLanguages;
   i18n.options.fallbackLng = fallback;
 
   // If current language is not in the new supported list, switch to fallback with higher priority to override browser detection
-  const currentLang = normalizeLanguageCode(i18n.language || '');
+  const currentLang = normalizeLanguageCode(i18n.language || "");
   if (currentLang && !validLanguages.includes(currentLang)) {
     // Use ServerDefault priority to override browser detection when language not in whitelist
     setLanguageWithPriority(fallback, LanguageSource.ServerDefault);
diff --git a/frontend/src/core/i18n/config.ts b/frontend/src/core/i18n/config.ts
index fa7808e20f..02b79f06b1 100644
--- a/frontend/src/core/i18n/config.ts
+++ b/frontend/src/core/i18n/config.ts
@@ -1,16 +1,16 @@
-import i18n from 'i18next';
-import { initReactI18next } from 'react-i18next';
-import TomlBackend from '@app/i18n/tomlBackend';
+import i18n from "i18next";
+import { initReactI18next } from "react-i18next";
+import TomlBackend from "@app/i18n/tomlBackend";
 
 i18n
   .use(TomlBackend)
   .use(initReactI18next)
   .init({
-    lng: 'en',
-    fallbackLng: 'en',
+    lng: "en",
+    fallbackLng: "en",
     debug: false,
     backend: {
-      loadPath: '/locales/{{lng}}/{{ns}}.toml',
+      loadPath: "/locales/{{lng}}/{{ns}}.toml",
     },
     interpolation: {
       escapeValue: false,
@@ -19,34 +19,37 @@ i18n
     resources: {
       en: {
         translation: {
-          'convert.selectSourceFormat': 'Select source file format',
-          'convert.selectTargetFormat': 'Select target file format',
-          'convert.selectFirst': 'Select a source format first',
-          'convert.imageOptions': 'Image Options:',
-          'convert.emailOptions': 'Email Options:',
-          'convert.colorType': 'Color Type',
-          'convert.dpi': 'DPI',
-          'convert.singleOrMultiple': 'Output',
-          'convert.emailNote': 'Email attachments and embedded images will be included',
-           'convert.pdfaOptions': 'PDF/A Options',
-          'convert.outputFormat': 'Output Format',
-          'convert.pdfaNote': 'PDF/A-1b is more compatible, PDF/A-2b supports more features, PDF/A-3b supports embedded files.',
-          'convert.pdfaDigitalSignatureWarning': 'The PDF contains a digital signature. This will be removed in the next step.',
-          'common.color': 'Color',
-          'common.grayscale': 'Grayscale',
-          'common.blackWhite': 'Black & White',
-          'common.single': 'Single Image',
-          'common.multiple': 'Multiple Images',
-          'groups.document': 'Document',
-          'groups.spreadsheet': 'Spreadsheet',
-          'groups.presentation': 'Presentation',
-          'groups.image': 'Image',
-          'groups.web': 'Web',
-          'groups.text': 'Text',
-          'groups.email': 'Email'
-        }
-      }
-    }
+          "convert.selectSourceFormat": "Select source file format",
+          "convert.selectTargetFormat": "Select target file format",
+          "convert.selectFirst": "Select a source format first",
+          "convert.imageOptions": "Image Options:",
+          "convert.emailOptions": "Email Options:",
+          "convert.colorType": "Color Type",
+          "convert.dpi": "DPI",
+          "convert.singleOrMultiple": "Output",
+          "convert.emailNote":
+            "Email attachments and embedded images will be included",
+          "convert.pdfaOptions": "PDF/A Options",
+          "convert.outputFormat": "Output Format",
+          "convert.pdfaNote":
+            "PDF/A-1b is more compatible, PDF/A-2b supports more features, PDF/A-3b supports embedded files.",
+          "convert.pdfaDigitalSignatureWarning":
+            "The PDF contains a digital signature. This will be removed in the next step.",
+          "common.color": "Color",
+          "common.grayscale": "Grayscale",
+          "common.blackWhite": "Black & White",
+          "common.single": "Single Image",
+          "common.multiple": "Multiple Images",
+          "groups.document": "Document",
+          "groups.spreadsheet": "Spreadsheet",
+          "groups.presentation": "Presentation",
+          "groups.image": "Image",
+          "groups.web": "Web",
+          "groups.text": "Text",
+          "groups.email": "Email",
+        },
+      },
+    },
   });
 
 export default i18n;
diff --git a/frontend/src/core/i18n/tomlBackend.ts b/frontend/src/core/i18n/tomlBackend.ts
index c208661f0b..89c48137f2 100644
--- a/frontend/src/core/i18n/tomlBackend.ts
+++ b/frontend/src/core/i18n/tomlBackend.ts
@@ -1,13 +1,13 @@
-import { BackendModule, ReadCallback } from 'i18next';
-import { parse } from 'smol-toml';
+import { BackendModule, ReadCallback } from "i18next";
+import { parse } from "smol-toml";
 
 export interface TomlBackendOptions {
   loadPath: string | ((lngs: string[], namespaces: string[]) => string);
 }
 
 class TomlBackend implements BackendModule<TomlBackendOptions> {
-  static type = 'backend' as const;
-  type = 'backend' as const;
+  static type = "backend" as const;
+  type = "backend" as const;
 
   constructor(services?: unknown, options?: TomlBackendOptions) {
     this.init(services, options);
@@ -21,18 +21,21 @@ class TomlBackend implements BackendModule<TomlBackendOptions> {
     const loadPath = this.options?.loadPath;
 
     if (!loadPath) {
-      callback(new Error('loadPath is not configured'), null);
+      callback(new Error("loadPath is not configured"), null);
       return;
     }
 
-    const url = typeof loadPath === 'function'
-      ? loadPath([language], [namespace])
-      : loadPath.replace('{{lng}}', language).replace('{{ns}}', namespace);
+    const url =
+      typeof loadPath === "function"
+        ? loadPath([language], [namespace])
+        : loadPath.replace("{{lng}}", language).replace("{{ns}}", namespace);
 
     fetch(url)
       .then((response) => {
         if (!response.ok) {
-          throw new Error(`Failed to load translation file: ${url} (${response.status})`);
+          throw new Error(
+            `Failed to load translation file: ${url} (${response.status})`,
+          );
         }
         return response.text();
       })
diff --git a/frontend/src/core/pages/HomePage.css b/frontend/src/core/pages/HomePage.css
index 219bab0f1e..14c723c406 100644
--- a/frontend/src/core/pages/HomePage.css
+++ b/frontend/src/core/pages/HomePage.css
@@ -59,7 +59,9 @@
   font-weight: 600;
   color: var(--text-muted);
   background: transparent;
-  transition: background 0.2s ease, color 0.2s ease;
+  transition:
+    background 0.2s ease,
+    color 0.2s ease;
 }
 
 .mobile-toggle-button:focus-visible {
diff --git a/frontend/src/core/pages/HomePage.tsx b/frontend/src/core/pages/HomePage.tsx
index 7fb59f27c7..bba73d8243 100644
--- a/frontend/src/core/pages/HomePage.tsx
+++ b/frontend/src/core/pages/HomePage.tsx
@@ -1,18 +1,21 @@
 import { useCallback, useEffect, useRef, useState } from "react";
 import { useTranslation } from "react-i18next";
 import { useToolWorkflow } from "@app/contexts/ToolWorkflowContext";
-import { Group, useMantineColorScheme } from "@mantine/core";
+import { Group } from "@mantine/core";
 import { useSidebarContext } from "@app/contexts/SidebarContext";
 import { useDocumentMeta } from "@app/hooks/useDocumentMeta";
 import { useBaseUrl } from "@app/hooks/useBaseUrl";
 import { useIsMobile } from "@app/hooks/useIsMobile";
 import { useAppConfig } from "@app/contexts/AppConfigContext";
-import { useLogoPath } from "@app/hooks/useLogoPath";
-import { useLogoAssets } from '@app/hooks/useLogoAssets';
+import { LogoIcon } from "@app/components/shared/LogoIcon";
+import { Wordmark } from "@app/components/shared/Wordmark";
 import { useFileContext } from "@app/contexts/file/fileHooks";
-import { useNavigationState, useNavigationActions } from "@app/contexts/NavigationContext";
+import {
+  useNavigationState,
+  useNavigationActions,
+} from "@app/contexts/NavigationContext";
 import { useViewer } from "@app/contexts/ViewerContext";
-import AppsIcon from '@mui/icons-material/AppsRounded';
+import AppsIcon from "@mui/icons-material/AppsRounded";
 
 import ToolPanel from "@app/components/tools/ToolPanel";
 import Workbench from "@app/components/layout/Workbench";
@@ -31,9 +34,7 @@ type MobileView = "tools" | "workbench";
 
 export default function HomePage() {
   const { t } = useTranslation();
-  const {
-    sidebarRefs,
-  } = useSidebarContext();
+  const { sidebarRefs } = useSidebarContext();
 
   const { quickAccessRef } = sidebarRefs;
 
@@ -49,7 +50,6 @@ export default function HomePage() {
   } = useToolWorkflow();
 
   const { openFilesModal } = useFilesModalContext();
-  const { colorScheme } = useMantineColorScheme();
   const { config } = useAppConfig();
   const isMobile = useIsMobile();
   const sliderRef = useRef<HTMLDivElement | null>(null);
@@ -70,7 +70,7 @@ export default function HomePage() {
     const prevCount = prevFileCountRef.current;
     const currentCount = activeFiles.length;
 
-    console.log('[HomePage] Navigation effect triggered:', {
+    console.log("[HomePage] Navigation effect triggered:", {
       prevCount,
       currentCount,
       currentWorkbench: navigationState.workbench,
@@ -81,19 +81,19 @@ export default function HomePage() {
       prevCount,
       currentCount,
       selectedToolKey,
-      navigationState.workbench
+      navigationState.workbench,
     );
 
-    console.log('[HomePage] Navigation action returned:', action);
+    console.log("[HomePage] Navigation action returned:", action);
 
     if (action) {
-      console.log('[HomePage] Applying navigation:', action);
+      console.log("[HomePage] Applying navigation:", action);
       actions.setWorkbench(action.workbench);
-      if (typeof action.activeFileIndex === 'number') {
+      if (typeof action.activeFileIndex === "number") {
         setActiveFileIndex(action.activeFileIndex);
       }
     } else {
-      console.log('[HomePage] No navigation - staying in current workbench');
+      console.log("[HomePage] No navigation - staying in current workbench");
     }
 
     prevFileCountRef.current = currentCount;
@@ -105,14 +105,12 @@ export default function HomePage() {
     navigationState.workbench,
   ]);
 
-  const hideToolPanel = customWorkbenchViews.find(
-    (v) => v.workbenchId === navigationState.workbench
-  )?.hideToolPanel ?? false;
+  const hideToolPanel =
+    customWorkbenchViews.find(
+      (v) => v.workbenchId === navigationState.workbench,
+    )?.hideToolPanel ?? false;
 
   const brandAltText = t("home.mobile.brandAlt", "Stirling PDF logo");
-  const brandIconSrc = useLogoPath();
-  const { wordmark } = useLogoAssets();
-  const brandTextSrc = colorScheme === "dark" ? wordmark.white : wordmark.black;
 
   const handleSelectMobileView = useCallback((view: MobileView) => {
     setActiveMobileView(view);
@@ -161,8 +159,11 @@ export default function HomePage() {
       animationFrame = window.requestAnimationFrame(() => {
         const { scrollLeft, offsetWidth } = container;
         const threshold = offsetWidth / 2;
-        const nextView: MobileView = scrollLeft >= threshold ? "workbench" : "tools";
-        setActiveMobileView((current) => (current === nextView ? current : nextView));
+        const nextView: MobileView =
+          scrollLeft >= threshold ? "workbench" : "tools";
+        setActiveMobileView((current) =>
+          current === nextView ? current : nextView,
+        );
       });
     };
 
@@ -178,8 +179,8 @@ export default function HomePage() {
 
   // Automatically switch to workbench when read mode or multiTool is activated in mobile
   useEffect(() => {
-    if (isMobile && (readerMode || selectedToolKey === 'multiTool')) {
-      setActiveMobileView('workbench');
+    if (isMobile && (readerMode || selectedToolKey === "multiTool")) {
+      setActiveMobileView("workbench");
     }
   }, [isMobile, readerMode, selectedToolKey]);
 
@@ -187,16 +188,16 @@ export default function HomePage() {
   // hideToolPanel is true for all custom workbenches that take over the full screen.
   useEffect(() => {
     if (isMobile && hideToolPanel) {
-      setActiveMobileView('workbench');
+      setActiveMobileView("workbench");
     }
   }, [isMobile, hideToolPanel]);
 
   // When navigating back to tools view in mobile with a workbench-only tool, show tool picker
   useEffect(() => {
-    if (isMobile && activeMobileView === 'tools' && selectedTool) {
+    if (isMobile && activeMobileView === "tools" && selectedTool) {
       // Check if this is a workbench-only tool (has workbench but no component)
       if (selectedTool.workbench && !selectedTool.component) {
-        setLeftPanelView('toolPicker');
+        setLeftPanelView("toolPicker");
       }
     }
   }, [isMobile, activeMobileView, selectedTool, setLeftPanelView]);
@@ -204,14 +205,26 @@ export default function HomePage() {
   const baseUrl = useBaseUrl();
 
   // Update document meta when tool changes
-  const appName = config?.appNameNavbar || 'Stirling PDF';
+  const appName = config?.appNameNavbar || "Stirling PDF";
   useDocumentMeta({
     title: selectedTool ? `${selectedTool.name} - ${appName}` : appName,
-    description: selectedTool?.description || t('app.description', 'The Free Adobe Acrobat alternative (10M+ Downloads)'),
+    description:
+      selectedTool?.description ||
+      t(
+        "app.description",
+        "The Free Adobe Acrobat alternative (10M+ Downloads)",
+      ),
     ogTitle: selectedTool ? `${selectedTool.name} - ${appName}` : appName,
-    ogDescription: selectedTool?.description || t('app.description', 'The Free Adobe Acrobat alternative (10M+ Downloads)'),
-    ogImage: selectedToolKey ? `${baseUrl}/og_images/${selectedToolKey}.png` : `${baseUrl}/og_images/home.png`,
-    ogUrl: selectedTool ? `${baseUrl}${window.location.pathname}` : baseUrl
+    ogDescription:
+      selectedTool?.description ||
+      t(
+        "app.description",
+        "The Free Adobe Acrobat alternative (10M+ Downloads)",
+      ),
+    ogImage: selectedToolKey
+      ? `${baseUrl}/og_images/${selectedToolKey}.png`
+      : `${baseUrl}/og_images/home.png`,
+    ogUrl: selectedTool ? `${baseUrl}${window.location.pathname}` : baseUrl,
   });
 
   // Note: File selection limits are now handled directly by individual tools
@@ -224,11 +237,18 @@ export default function HomePage() {
           <div className="mobile-toggle">
             <div className="mobile-header">
               <div className="mobile-brand">
-                <img src={brandIconSrc} alt="" aria-hidden="true" className="mobile-brand-icon" />
-                <img src={brandTextSrc} alt={brandAltText} className="mobile-brand-text" />
+                <LogoIcon className="mobile-brand-icon" />
+                <Wordmark alt={brandAltText} className="mobile-brand-text" />
               </div>
             </div>
-            <div className="mobile-toggle-buttons" role="tablist" aria-label={t('home.mobile.viewSwitcher', 'Switch workspace view')}>
+            <div
+              className="mobile-toggle-buttons"
+              role="tablist"
+              aria-label={t(
+                "home.mobile.viewSwitcher",
+                "Switch workspace view",
+              )}
+            >
               <button
                 type="button"
                 role="tab"
@@ -236,7 +256,7 @@ export default function HomePage() {
                 className={`mobile-toggle-button ${activeMobileView === "tools" ? "active" : ""}`}
                 onClick={() => handleSelectMobileView("tools")}
               >
-                {t('home.mobile.tools', 'Tools')}
+                {t("home.mobile.tools", "Tools")}
               </button>
               <button
                 type="button"
@@ -245,20 +265,29 @@ export default function HomePage() {
                 className={`mobile-toggle-button ${activeMobileView === "workbench" ? "active" : ""}`}
                 onClick={() => handleSelectMobileView("workbench")}
               >
-                {t('home.mobile.workspace', 'Workspace')}
+                {t("home.mobile.workspace", "Workspace")}
               </button>
             </div>
             <span className="mobile-toggle-hint">
-              {t('home.mobile.swipeHint', 'Swipe left or right to switch views')}
+              {t(
+                "home.mobile.swipeHint",
+                "Swipe left or right to switch views",
+              )}
             </span>
           </div>
           <div ref={sliderRef} className="mobile-slider">
-            <div className="mobile-slide" aria-label={t('home.mobile.toolsSlide', 'Tool selection panel')}>
+            <div
+              className="mobile-slide"
+              aria-label={t("home.mobile.toolsSlide", "Tool selection panel")}
+            >
               <div className="mobile-slide-content">
                 <ToolPanel />
               </div>
             </div>
-            <div className="mobile-slide" aria-label={t('home.mobile.workbenchSlide', 'Workspace panel')}>
+            <div
+              className="mobile-slide"
+              aria-label={t("home.mobile.workbenchSlide", "Workspace panel")}
+            >
               <div className="mobile-slide-content">
                 <div className="flex-1 min-h-0 flex">
                   <Workbench />
@@ -270,47 +299,63 @@ export default function HomePage() {
           <div className="mobile-bottom-bar">
             <button
               className="mobile-bottom-button"
-              aria-label={t('quickAccess.allTools', 'Tools')}
+              aria-label={t("quickAccess.allTools", "Tools")}
               onClick={() => {
                 handleBackToTools();
                 if (isMobile) {
-                  setActiveMobileView('tools');
+                  setActiveMobileView("tools");
                 }
               }}
             >
-              <AppsIcon sx={{ fontSize: '1.5rem' }} />
-              <span className="mobile-bottom-button-label">{t('quickAccess.allTools', 'Tools')}</span>
+              <AppsIcon sx={{ fontSize: "1.5rem" }} />
+              <span className="mobile-bottom-button-label">
+                {t("quickAccess.allTools", "Tools")}
+              </span>
             </button>
-            {toolAvailability['automate']?.available !== false && (
+            {toolAvailability["automate"]?.available !== false && (
               <button
                 className="mobile-bottom-button"
-                aria-label={t('quickAccess.automate', 'Automate')}
+                aria-label={t("quickAccess.automate", "Automate")}
                 onClick={() => {
-                  handleToolSelect('automate');
+                  handleToolSelect("automate");
                   if (isMobile) {
-                    setActiveMobileView('tools');
+                    setActiveMobileView("tools");
                   }
                 }}
               >
-                <LocalIcon icon="automation-outline" width="1.5rem" height="1.5rem" />
-                <span className="mobile-bottom-button-label">{t('quickAccess.automate', 'Automate')}</span>
+                <LocalIcon
+                  icon="automation-outline"
+                  width="1.5rem"
+                  height="1.5rem"
+                />
+                <span className="mobile-bottom-button-label">
+                  {t("quickAccess.automate", "Automate")}
+                </span>
               </button>
             )}
             <button
               className="mobile-bottom-button"
-              aria-label={t('home.mobile.openFiles', 'Open files')}
+              aria-label={t("home.mobile.openFiles", "Open files")}
               onClick={() => openFilesModal()}
             >
               <LocalIcon icon="folder-rounded" width="1.5rem" height="1.5rem" />
-              <span className="mobile-bottom-button-label">{t('quickAccess.files', 'Files')}</span>
+              <span className="mobile-bottom-button-label">
+                {t("quickAccess.files", "Files")}
+              </span>
             </button>
             <button
               className="mobile-bottom-button"
-              aria-label={t('quickAccess.config', 'Config')}
+              aria-label={t("quickAccess.config", "Config")}
               onClick={() => setConfigModalOpen(true)}
             >
-              <LocalIcon icon="settings-rounded" width="1.5rem" height="1.5rem" />
-              <span className="mobile-bottom-button-label">{t('quickAccess.config', 'Config')}</span>
+              <LocalIcon
+                icon="settings-rounded"
+                width="1.5rem"
+                height="1.5rem"
+              />
+              <span className="mobile-bottom-button-label">
+                {t("quickAccess.config", "Config")}
+              </span>
             </button>
           </div>
           <FileManager selectedTool={selectedTool as any /* FIX ME */} />
@@ -320,12 +365,7 @@ export default function HomePage() {
           />
         </div>
       ) : (
-        <Group
-          align="flex-start"
-          gap={0}
-          h="100%"
-          className="flex-nowrap flex"
-        >
+        <Group align="flex-start" gap={0} h="100%" className="flex-nowrap flex">
           <QuickAccessBar ref={quickAccessRef} />
           {!hideToolPanel && <ToolPanel />}
           <Workbench />
diff --git a/frontend/src/core/pages/MobileScannerPage.tsx b/frontend/src/core/pages/MobileScannerPage.tsx
index db657a5d08..5f0124a271 100644
--- a/frontend/src/core/pages/MobileScannerPage.tsx
+++ b/frontend/src/core/pages/MobileScannerPage.tsx
@@ -1,15 +1,25 @@
-import { useState, useRef, useEffect, useCallback } from 'react';
-import { useSearchParams, useNavigate } from 'react-router-dom';
-import { Box, Button, Stack, Text, Group, Alert, Progress, Switch, Card, useMantineColorScheme } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { useLogoPath } from '@app/hooks/useLogoPath';
-import { useLogoAssets } from '@app/hooks/useLogoAssets';
-import ErrorRoundedIcon from '@mui/icons-material/ErrorRounded';
-import InfoRoundedIcon from '@mui/icons-material/InfoRounded';
-import PhotoCameraRoundedIcon from '@mui/icons-material/PhotoCameraRounded';
-import UploadRoundedIcon from '@mui/icons-material/UploadRounded';
-import AddPhotoAlternateRoundedIcon from '@mui/icons-material/AddPhotoAlternateRounded';
-import CheckCircleRoundedIcon from '@mui/icons-material/CheckCircleRounded';
+import { useState, useRef, useEffect, useCallback } from "react";
+import { useSearchParams, useNavigate } from "react-router-dom";
+import {
+  Box,
+  Button,
+  Stack,
+  Text,
+  Group,
+  Alert,
+  Progress,
+  Switch,
+  Card,
+} from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import { LogoIcon } from "@app/components/shared/LogoIcon";
+import { Wordmark } from "@app/components/shared/Wordmark";
+import ErrorRoundedIcon from "@mui/icons-material/ErrorRounded";
+import InfoRoundedIcon from "@mui/icons-material/InfoRounded";
+import PhotoCameraRoundedIcon from "@mui/icons-material/PhotoCameraRounded";
+import UploadRoundedIcon from "@mui/icons-material/UploadRounded";
+import AddPhotoAlternateRoundedIcon from "@mui/icons-material/AddPhotoAlternateRounded";
+import CheckCircleRoundedIcon from "@mui/icons-material/CheckCircleRounded";
 
 // jscanify is loaded via script tag in index.html as a global
 declare global {
@@ -29,13 +39,11 @@ export default function MobileScannerPage() {
   const { t } = useTranslation();
   const [searchParams] = useSearchParams();
   const navigate = useNavigate();
-  const sessionId = searchParams.get('session');
-  const { colorScheme } = useMantineColorScheme();
-  const brandIconSrc = useLogoPath();
-  const { wordmark } = useLogoAssets();
-  const brandTextSrc = colorScheme === 'dark' ? wordmark.white : wordmark.black;
+  const sessionId = searchParams.get("session");
 
-  const [mode, setMode] = useState<'choice' | 'camera' | 'file' | null>('choice');
+  const [mode, setMode] = useState<"choice" | "camera" | "file" | null>(
+    "choice",
+  );
   const [capturedImages, setCapturedImages] = useState<string[]>([]);
   const [currentPreview, setCurrentPreview] = useState<string | null>(null);
   const [isUploading, setIsUploading] = useState(false);
@@ -50,7 +58,7 @@ export default function MobileScannerPage() {
   const [torchSupported, setTorchSupported] = useState(false);
   const [sessionValid, setSessionValid] = useState<boolean | null>(null); // null = checking, true = valid, false = invalid
   const [sessionError, setSessionError] = useState<string | null>(null);
-  const [loadingStatus, setLoadingStatus] = useState<string>('Initializing...');
+  const [loadingStatus, setLoadingStatus] = useState<string>("Initializing...");
   const [cameraReady, setCameraReady] = useState(false);
 
   const videoRef = useRef<HTMLVideoElement>(null);
@@ -67,16 +75,23 @@ export default function MobileScannerPage() {
   // Validate session on page load
   useEffect(() => {
     const validateSession = async () => {
-      setLoadingStatus('Validating session...');
+      setLoadingStatus("Validating session...");
       if (!sessionId) {
         setSessionValid(false);
-        setSessionError(t('mobileScanner.noSessionMessage', 'Session not found. Please try again.'));
-        setLoadingStatus('Session validation failed');
+        setSessionError(
+          t(
+            "mobileScanner.noSessionMessage",
+            "Session not found. Please try again.",
+          ),
+        );
+        setLoadingStatus("Session validation failed");
         return;
       }
 
       try {
-        const response = await fetch(`/api/v1/mobile-scanner/validate-session/${sessionId}`);
+        const response = await fetch(
+          `/api/v1/mobile-scanner/validate-session/${sessionId}`,
+        );
 
         if (response.ok) {
           const data = await response.json();
@@ -84,22 +99,37 @@ export default function MobileScannerPage() {
             setSessionValid(true);
             setSessionError(null);
             // Don't set status here - let camera/detection effects control status from now on
-            console.log('Session validated successfully:', data);
+            console.log("Session validated successfully:", data);
           } else {
             setSessionValid(false);
-            setSessionError(t('mobileScanner.sessionExpired', 'This session has expired. Please refresh and try again.'));
-            setLoadingStatus('Session expired ✗');
+            setSessionError(
+              t(
+                "mobileScanner.sessionExpired",
+                "This session has expired. Please refresh and try again.",
+              ),
+            );
+            setLoadingStatus("Session expired ✗");
           }
         } else {
           setSessionValid(false);
-          setSessionError(t('mobileScanner.sessionNotFound', 'Session not found. Please refresh and try again.'));
-          setLoadingStatus('Session not found ✗');
+          setSessionError(
+            t(
+              "mobileScanner.sessionNotFound",
+              "Session not found. Please refresh and try again.",
+            ),
+          );
+          setLoadingStatus("Session not found ✗");
         }
       } catch (err) {
-        console.error('Failed to validate session:', err);
+        console.error("Failed to validate session:", err);
         setSessionValid(false);
-        setSessionError(t('mobileScanner.sessionValidationError', 'Unable to verify session. Please try again.'));
-        setLoadingStatus('Session validation error: ' + (err as Error).message);
+        setSessionError(
+          t(
+            "mobileScanner.sessionValidationError",
+            "Unable to verify session. Please try again.",
+          ),
+        );
+        setLoadingStatus("Session validation error: " + (err as Error).message);
       }
     };
 
@@ -117,13 +147,18 @@ export default function MobileScannerPage() {
         retryCount++;
         if (retryCount < MAX_RETRIES) {
           if (retryCount % 10 === 1) {
-            setLoadingStatus(`Loading OpenCV... (${retryCount}/${MAX_RETRIES})`);
-            console.log(`[${retryCount}/${MAX_RETRIES}] Waiting for OpenCV to load...`);
+            setLoadingStatus(
+              `Loading OpenCV... (${retryCount}/${MAX_RETRIES})`,
+            );
+            console.log(
+              `[${retryCount}/${MAX_RETRIES}] Waiting for OpenCV to load...`,
+            );
           }
           setTimeout(initScanner, 100);
         } else {
-          const error = 'OpenCV failed to load after 5 seconds. Check that /vendor/jscanify/opencv.js is accessible.';
-          setLoadingStatus('OpenCV load failed ✗');
+          const error =
+            "OpenCV failed to load after 5 seconds. Check that /vendor/jscanify/opencv.js is accessible.";
+          setLoadingStatus("OpenCV load failed ✗");
           console.error(error);
         }
         return;
@@ -133,13 +168,18 @@ export default function MobileScannerPage() {
         retryCount++;
         if (retryCount < MAX_RETRIES) {
           if (retryCount % 10 === 1) {
-            setLoadingStatus(`Loading jscanify... (${retryCount}/${MAX_RETRIES})`);
-            console.log(`[${retryCount}/${MAX_RETRIES}] Waiting for jscanify to load...`);
+            setLoadingStatus(
+              `Loading jscanify... (${retryCount}/${MAX_RETRIES})`,
+            );
+            console.log(
+              `[${retryCount}/${MAX_RETRIES}] Waiting for jscanify to load...`,
+            );
           }
           setTimeout(initScanner, 100);
         } else {
-          const error = 'jscanify failed to load after 5 seconds. Check that /vendor/jscanify/jscanify.js is accessible.';
-          setLoadingStatus('jscanify load failed ✗');
+          const error =
+            "jscanify failed to load after 5 seconds. Check that /vendor/jscanify/jscanify.js is accessible.";
+          setLoadingStatus("jscanify load failed ✗");
           console.error(error);
         }
         return;
@@ -149,47 +189,52 @@ export default function MobileScannerPage() {
         scannerRef.current = new window.jscanify();
         setOpenCvReady(true);
         // Don't set status here - let camera/detection effects control status from now on
-        console.log('✓ jscanify initialized with OpenCV');
+        console.log("✓ jscanify initialized with OpenCV");
       } catch (err) {
-        setLoadingStatus('jscanify init failed ✗');
-        console.error('Failed to initialize jscanify:', err);
+        setLoadingStatus("jscanify init failed ✗");
+        console.error("Failed to initialize jscanify:", err);
       }
     };
 
     // Start initialization
-    setLoadingStatus('Loading OpenCV...');
+    setLoadingStatus("Loading OpenCV...");
     initScanner();
   }, []);
 
   // Initialize camera
   useEffect(() => {
-    console.log(`[Mobile Scanner] Camera effect triggered: mode=${mode}, cameraError=${cameraError}, currentPreview=${currentPreview}`);
+    console.log(
+      `[Mobile Scanner] Camera effect triggered: mode=${mode}, cameraError=${cameraError}, currentPreview=${currentPreview}`,
+    );
 
-    if (mode === 'camera' && !cameraError && !currentPreview) {
-      console.log('[Mobile Scanner] Camera effect: Starting camera initialization');
+    if (mode === "camera" && !cameraError && !currentPreview) {
+      console.log(
+        "[Mobile Scanner] Camera effect: Starting camera initialization",
+      );
 
       // Check if mediaDevices API is available (requires HTTPS or localhost)
       if (!navigator.mediaDevices || !navigator.mediaDevices.getUserMedia) {
-        const error = 'MediaDevices API not available - requires HTTPS or localhost';
+        const error =
+          "MediaDevices API not available - requires HTTPS or localhost";
         console.error(error);
-        setLoadingStatus('Camera API not available ✗');
+        setLoadingStatus("Camera API not available ✗");
         setCameraError(
           t(
-            'mobileScanner.httpsRequired',
-            'Camera access requires HTTPS or localhost. Please use HTTPS or access via localhost.'
-          )
+            "mobileScanner.httpsRequired",
+            "Camera access requires HTTPS or localhost. Please use HTTPS or access via localhost.",
+          ),
         );
-        setMode('file');
+        setMode("file");
         return;
       }
 
-      setLoadingStatus('Initializing camera...');
+      setLoadingStatus("Initializing camera...");
 
-      console.log('[Mobile Scanner] Requesting camera permission...');
+      console.log("[Mobile Scanner] Requesting camera permission...");
       navigator.mediaDevices
         .getUserMedia({
           video: {
-            facingMode: 'environment',
+            facingMode: "environment",
             // Request 1080p - good quality without going overboard
             width: { ideal: 1920, max: 1920 },
             height: { ideal: 1080, max: 1080 },
@@ -197,7 +242,9 @@ export default function MobileScannerPage() {
           audio: false,
         })
         .then(async (stream) => {
-          console.log('[Mobile Scanner] Camera permission granted, stream received');
+          console.log(
+            "[Mobile Scanner] Camera permission granted, stream received",
+          );
           streamRef.current = stream;
           if (videoRef.current) {
             const video = videoRef.current;
@@ -205,26 +252,41 @@ export default function MobileScannerPage() {
 
             // Wait for video metadata to load before marking camera as ready
             const handleLoadedMetadata = () => {
-              console.log('[Mobile Scanner] Video metadata loaded, dimensions:', video.videoWidth, 'x', video.videoHeight);
-              setLoadingStatus(`Camera ready: ${video.videoWidth}x${video.videoHeight} ✓`);
+              console.log(
+                "[Mobile Scanner] Video metadata loaded, dimensions:",
+                video.videoWidth,
+                "x",
+                video.videoHeight,
+              );
+              setLoadingStatus(
+                `Camera ready: ${video.videoWidth}x${video.videoHeight} ✓`,
+              );
 
               // Signal that camera is ready - this will trigger detection effect
-              console.log('[Mobile Scanner] Setting cameraReady = true');
+              console.log("[Mobile Scanner] Setting cameraReady = true");
               setCameraReady(true);
             };
 
             // Check if metadata is already loaded
-            if (video.readyState >= 1) { // HAVE_METADATA or greater
+            if (video.readyState >= 1) {
+              // HAVE_METADATA or greater
               handleLoadedMetadata();
             } else {
               // Wait for loadedmetadata event
-              video.addEventListener('loadedmetadata', handleLoadedMetadata, { once: true });
+              video.addEventListener("loadedmetadata", handleLoadedMetadata, {
+                once: true,
+              });
             }
 
             // Log actual resolution we got from stream settings
             const videoTrack = stream.getVideoTracks()[0];
             const settings = videoTrack.getSettings();
-            console.log('[Mobile Scanner] Camera stream settings:', settings.width, 'x', settings.height);
+            console.log(
+              "[Mobile Scanner] Camera stream settings:",
+              settings.width,
+              "x",
+              settings.height,
+            );
 
             // Configure camera capabilities for document scanning
             try {
@@ -232,21 +294,27 @@ export default function MobileScannerPage() {
               const constraints: any = { advanced: [] };
 
               // 1. Enable continuous autofocus
-              if (capabilities.focusMode && capabilities.focusMode.includes('continuous')) {
-                constraints.advanced.push({ focusMode: 'continuous' });
-                console.log('✓ Continuous autofocus enabled');
+              if (
+                capabilities.focusMode &&
+                capabilities.focusMode.includes("continuous")
+              ) {
+                constraints.advanced.push({ focusMode: "continuous" });
+                console.log("✓ Continuous autofocus enabled");
               }
 
               // 2. Enable continuous auto-exposure for varying lighting
-              if (capabilities.exposureMode && capabilities.exposureMode.includes('continuous')) {
-                constraints.advanced.push({ exposureMode: 'continuous' });
-                console.log('✓ Auto-exposure enabled');
+              if (
+                capabilities.exposureMode &&
+                capabilities.exposureMode.includes("continuous")
+              ) {
+                constraints.advanced.push({ exposureMode: "continuous" });
+                console.log("✓ Auto-exposure enabled");
               }
 
               // 3. Check if torch/flashlight is supported
               if (capabilities.torch) {
                 setTorchSupported(true);
-                console.log('✓ Torch/flashlight available');
+                console.log("✓ Torch/flashlight available");
               }
 
               // Apply all constraints
@@ -254,16 +322,21 @@ export default function MobileScannerPage() {
                 await videoTrack.applyConstraints(constraints);
               }
             } catch (err) {
-              console.log('Could not configure camera features:', err);
+              console.log("Could not configure camera features:", err);
             }
           }
         })
         .catch((err) => {
-          console.error('Camera error:', err);
-          setLoadingStatus('Camera access denied ✗');
-          setCameraError(t('mobileScanner.cameraAccessDenied', 'Camera access denied. Please enable camera access.'));
+          console.error("Camera error:", err);
+          setLoadingStatus("Camera access denied ✗");
+          setCameraError(
+            t(
+              "mobileScanner.cameraAccessDenied",
+              "Camera access denied. Please enable camera access.",
+            ),
+          );
           // Auto-switch to file upload if camera fails
-          setMode('file');
+          setMode("file");
         });
     }
 
@@ -285,40 +358,67 @@ export default function MobileScannerPage() {
 
   // Real-time document highlighting on camera feed
   useEffect(() => {
-    console.log(`[Mobile Scanner] Effect triggered: mode=${mode}, autoEnhance=${autoEnhance}, openCvReady=${openCvReady}, cameraReady=${cameraReady}, currentPreview=${currentPreview}`);
+    console.log(
+      `[Mobile Scanner] Effect triggered: mode=${mode}, autoEnhance=${autoEnhance}, openCvReady=${openCvReady}, cameraReady=${cameraReady}, currentPreview=${currentPreview}`,
+    );
 
     // Show helpful status if detection is enabled but waiting for dependencies
-    if (mode === 'camera' && autoEnhance && !currentPreview) {
+    if (mode === "camera" && autoEnhance && !currentPreview) {
       if (!openCvReady) {
-        setLoadingStatus('Waiting for OpenCV...');
+        setLoadingStatus("Waiting for OpenCV...");
       } else if (!cameraReady) {
-        setLoadingStatus('Waiting for camera...');
+        setLoadingStatus("Waiting for camera...");
       }
     }
 
-    if (mode === 'camera' && autoEnhance && openCvReady && cameraReady && scannerRef.current && !currentPreview) {
+    if (
+      mode === "camera" &&
+      autoEnhance &&
+      openCvReady &&
+      cameraReady &&
+      scannerRef.current &&
+      !currentPreview
+    ) {
       const startHighlighting = () => {
-        console.log('[Mobile Scanner] startHighlighting() called');
+        console.log("[Mobile Scanner] startHighlighting() called");
 
         if (!videoRef.current || !highlightCanvasRef.current) {
-          setLoadingStatus('Missing video/canvas refs ✗');
-          console.error('[Mobile Scanner] Missing refs: video=' + !!videoRef.current + ', canvas=' + !!highlightCanvasRef.current);
+          setLoadingStatus("Missing video/canvas refs ✗");
+          console.error(
+            "[Mobile Scanner] Missing refs: video=" +
+              !!videoRef.current +
+              ", canvas=" +
+              !!highlightCanvasRef.current,
+          );
           return;
         }
         if (!videoRef.current.videoWidth || !videoRef.current.videoHeight) {
-          setLoadingStatus('Video has no dimensions ✗');
-          console.error('[Mobile Scanner] Missing video dimensions: ' + videoRef.current.videoWidth + 'x' + videoRef.current.videoHeight);
+          setLoadingStatus("Video has no dimensions ✗");
+          console.error(
+            "[Mobile Scanner] Missing video dimensions: " +
+              videoRef.current.videoWidth +
+              "x" +
+              videoRef.current.videoHeight,
+          );
           return;
         }
 
         const video = videoRef.current;
         const highlightCanvas = highlightCanvasRef.current;
-        setLoadingStatus('Detection active ✓');
-        console.log('[Mobile Scanner] Starting highlighting loop for ' + video.videoWidth + 'x' + video.videoHeight + ' video');
+        setLoadingStatus("Detection active ✓");
+        console.log(
+          "[Mobile Scanner] Starting highlighting loop for " +
+            video.videoWidth +
+            "x" +
+            video.videoHeight +
+            " video",
+        );
 
         // Create low-res detection canvas with optimized context for frequent pixel reading
-        const detectionCanvas = document.createElement('canvas');
-        const detectionCtx = detectionCanvas.getContext('2d', { willReadFrequently: true });
+        const detectionCanvas = document.createElement("canvas");
+        const detectionCtx = detectionCanvas.getContext("2d", {
+          willReadFrequently: true,
+        });
         if (!detectionCtx) return;
 
         // Calculate scaled dimensions for detection (160px wide max)
@@ -331,15 +431,23 @@ export default function MobileScannerPage() {
         highlightCanvas.width = DETECTION_WIDTH;
         highlightCanvas.height = Math.round(video.videoHeight * scale);
 
-        console.log(`[Mobile Scanner] Video: ${video.videoWidth}x${video.videoHeight}`);
-        console.log(`[Mobile Scanner] Detection: ${detectionCanvas.width}x${detectionCanvas.height} (${Math.round(scale * 100)}%)`);
-        console.log(`[Mobile Scanner] Highlight canvas: ${highlightCanvas.width}x${highlightCanvas.height}`);
+        console.log(
+          `[Mobile Scanner] Video: ${video.videoWidth}x${video.videoHeight}`,
+        );
+        console.log(
+          `[Mobile Scanner] Detection: ${detectionCanvas.width}x${detectionCanvas.height} (${Math.round(scale * 100)}%)`,
+        );
+        console.log(
+          `[Mobile Scanner] Highlight canvas: ${highlightCanvas.width}x${highlightCanvas.height}`,
+        );
         console.log(`[Mobile Scanner] Starting interval at 1 FPS`);
 
         // Set highlight canvas to match video for vector drawing
         highlightCanvas.width = video.videoWidth;
         highlightCanvas.height = video.videoHeight;
-        const highlightCtx = highlightCanvas.getContext('2d', { willReadFrequently: true });
+        const highlightCtx = highlightCanvas.getContext("2d", {
+          willReadFrequently: true,
+        });
         if (!highlightCtx) return;
 
         // Use requestAnimationFrame with adaptive throttle based on device performance
@@ -361,7 +469,13 @@ export default function MobileScannerPage() {
             try {
               // Step 1: Copy video to low-res detection canvas
               const copyStart = performance.now();
-              detectionCtx.drawImage(video, 0, 0, detectionCanvas.width, detectionCanvas.height);
+              detectionCtx.drawImage(
+                video,
+                0,
+                0,
+                detectionCanvas.width,
+                detectionCanvas.height,
+              );
               const copyTime = performance.now() - copyStart;
 
               // Step 2: Simple jscanify detection
@@ -381,7 +495,12 @@ export default function MobileScannerPage() {
 
               // Step 3: Draw corner lines on full-res canvas
               const drawStart = performance.now();
-              highlightCtx.clearRect(0, 0, highlightCanvas.width, highlightCanvas.height);
+              highlightCtx.clearRect(
+                0,
+                0,
+                highlightCanvas.width,
+                highlightCanvas.height,
+              );
 
               // Draw lines if corners detected
               if (
@@ -393,13 +512,25 @@ export default function MobileScannerPage() {
               ) {
                 // Scale corner points from low-res to full-res
                 const scaleFactor = video.videoWidth / detectionCanvas.width;
-                const tl = { x: corners.topLeftCorner.x * scaleFactor, y: corners.topLeftCorner.y * scaleFactor };
-                const tr = { x: corners.topRightCorner.x * scaleFactor, y: corners.topRightCorner.y * scaleFactor };
-                const br = { x: corners.bottomRightCorner.x * scaleFactor, y: corners.bottomRightCorner.y * scaleFactor };
-                const bl = { x: corners.bottomLeftCorner.x * scaleFactor, y: corners.bottomLeftCorner.y * scaleFactor };
+                const tl = {
+                  x: corners.topLeftCorner.x * scaleFactor,
+                  y: corners.topLeftCorner.y * scaleFactor,
+                };
+                const tr = {
+                  x: corners.topRightCorner.x * scaleFactor,
+                  y: corners.topRightCorner.y * scaleFactor,
+                };
+                const br = {
+                  x: corners.bottomRightCorner.x * scaleFactor,
+                  y: corners.bottomRightCorner.y * scaleFactor,
+                };
+                const bl = {
+                  x: corners.bottomLeftCorner.x * scaleFactor,
+                  y: corners.bottomLeftCorner.y * scaleFactor,
+                };
 
                 // Draw green lines connecting corners
-                highlightCtx.strokeStyle = '#00FF00';
+                highlightCtx.strokeStyle = "#00FF00";
                 highlightCtx.lineWidth = 4;
                 highlightCtx.beginPath();
                 highlightCtx.moveTo(tl.x, tl.y);
@@ -424,7 +555,9 @@ export default function MobileScannerPage() {
 
               // Adaptive performance adjustment (after warmup period)
               if (frameCount > 5 && detectionTimings.length >= 5) {
-                const avgTime = detectionTimings.reduce((a, b) => a + b, 0) / detectionTimings.length;
+                const avgTime =
+                  detectionTimings.reduce((a, b) => a + b, 0) /
+                  detectionTimings.length;
 
                 // Adjust detection interval based on average performance
                 if (avgTime < 20) {
@@ -443,15 +576,20 @@ export default function MobileScannerPage() {
               }
 
               if (frameCount <= 10) {
-                console.log(`[Mobile Scanner] Frame ${frameCount}: ${Math.round(totalTime)}ms total (copy: ${Math.round(copyTime)}ms, detect: ${Math.round(detectionTime)}ms, draw: ${Math.round(drawTime)}ms) - interval: ${detectionInterval}ms`);
+                console.log(
+                  `[Mobile Scanner] Frame ${frameCount}: ${Math.round(totalTime)}ms total (copy: ${Math.round(copyTime)}ms, detect: ${Math.round(detectionTime)}ms, draw: ${Math.round(drawTime)}ms) - interval: ${detectionInterval}ms`,
+                );
               }
 
               if (frameCount === 10) {
-                const avg = frameTimes.reduce((a, b) => a + b, 0) / frameTimes.length;
-                console.log(`[Mobile Scanner] Average of first 10 frames: ${Math.round(avg)}ms - Adaptive rate: ${Math.round(1000/detectionInterval)} FPS`);
+                const avg =
+                  frameTimes.reduce((a, b) => a + b, 0) / frameTimes.length;
+                console.log(
+                  `[Mobile Scanner] Average of first 10 frames: ${Math.round(avg)}ms - Adaptive rate: ${Math.round(1000 / detectionInterval)} FPS`,
+                );
               }
             } catch (err) {
-              console.error('[Mobile Scanner] Detection error:', err);
+              console.error("[Mobile Scanner] Detection error:", err);
             }
           }
 
@@ -471,42 +609,52 @@ export default function MobileScannerPage() {
         const video = videoRef.current;
 
         if (!video) {
-          setLoadingStatus('No video element ✗');
-          console.log('[Mobile Scanner] No video element');
+          setLoadingStatus("No video element ✗");
+          console.log("[Mobile Scanner] No video element");
           return;
         }
 
-        console.log(`[Mobile Scanner] Video check: readyState=${video.readyState}, width=${video.videoWidth}, height=${video.videoHeight}`);
+        console.log(
+          `[Mobile Scanner] Video check: readyState=${video.readyState}, width=${video.videoWidth}, height=${video.videoHeight}`,
+        );
 
-        if (video.readyState >= 2 && video.videoWidth > 0 && video.videoHeight > 0) {
-          setLoadingStatus('Detection starting... ✓');
-          console.log('[Mobile Scanner] ✓ Video ready, starting detection now');
+        if (
+          video.readyState >= 2 &&
+          video.videoWidth > 0 &&
+          video.videoHeight > 0
+        ) {
+          setLoadingStatus("Detection starting... ✓");
+          console.log("[Mobile Scanner] ✓ Video ready, starting detection now");
           startHighlighting();
         } else if (retryCount < 50) {
           // Retry up to 50 times (5 seconds)
           retryCount++;
           setLoadingStatus(`Waiting for video... (${retryCount}/50)`);
-          console.log(`[Mobile Scanner] Video not ready yet, retry ${retryCount}/50...`);
+          console.log(
+            `[Mobile Scanner] Video not ready yet, retry ${retryCount}/50...`,
+          );
           retryTimeout = window.setTimeout(startWhenReady, 100);
         } else {
-          setLoadingStatus('Video failed to load ✗');
-          console.error('[Mobile Scanner] ✗ Video failed to become ready after 5 seconds');
+          setLoadingStatus("Video failed to load ✗");
+          console.error(
+            "[Mobile Scanner] ✗ Video failed to become ready after 5 seconds",
+          );
         }
       };
 
       // Add event listener as fallback
       const videoElement = videoRef.current;
       if (videoElement) {
-        console.log('[Mobile Scanner] Adding loadedmetadata listener');
-        videoElement.addEventListener('loadedmetadata', startWhenReady);
+        console.log("[Mobile Scanner] Adding loadedmetadata listener");
+        videoElement.addEventListener("loadedmetadata", startWhenReady);
         // Also try immediately
         startWhenReady();
       } else {
-        console.error('[Mobile Scanner] No video element available');
+        console.error("[Mobile Scanner] No video element available");
       }
 
       return () => {
-        console.log('[Mobile Scanner] Cleanup: Stopping detection');
+        console.log("[Mobile Scanner] Cleanup: Stopping detection");
 
         // Clean up animation frame
         if (highlightIntervalRef.current) {
@@ -522,7 +670,7 @@ export default function MobileScannerPage() {
 
         // Clean up event listener
         if (videoElement) {
-          videoElement.removeEventListener('loadedmetadata', startWhenReady);
+          videoElement.removeEventListener("loadedmetadata", startWhenReady);
         }
       };
     }
@@ -536,7 +684,7 @@ export default function MobileScannerPage() {
     try {
       const video = videoRef.current;
       const canvas = canvasRef.current;
-      const context = canvas.getContext('2d');
+      const context = canvas.getContext("2d");
 
       if (!context) return;
 
@@ -551,16 +699,24 @@ export default function MobileScannerPage() {
       if (autoEnhance && scannerRef.current && openCvReady) {
         try {
           // Create low-res canvas for detection (faster processing)
-          const detectionCanvas = document.createElement('canvas');
-          const detectionCtx = detectionCanvas.getContext('2d', { willReadFrequently: true });
-          if (!detectionCtx) throw new Error('Cannot create detection context');
+          const detectionCanvas = document.createElement("canvas");
+          const detectionCtx = detectionCanvas.getContext("2d", {
+            willReadFrequently: true,
+          });
+          if (!detectionCtx) throw new Error("Cannot create detection context");
 
           const scale = DETECTION_WIDTH / video.videoWidth;
           detectionCanvas.width = DETECTION_WIDTH;
           detectionCanvas.height = Math.round(video.videoHeight * scale);
 
           // Draw downscaled image for detection
-          detectionCtx.drawImage(video, 0, 0, detectionCanvas.width, detectionCanvas.height);
+          detectionCtx.drawImage(
+            video,
+            0,
+            0,
+            detectionCanvas.width,
+            detectionCanvas.height,
+          );
 
           // Run detection on low-res image
           const mat = (window as any).cv.imread(detectionCanvas);
@@ -573,54 +729,91 @@ export default function MobileScannerPage() {
             if (cornerPoints) {
               const scaleFactor = 1 / scale;
               const scaledCorners = {
-                topLeftCorner: { x: cornerPoints.topLeftCorner.x * scaleFactor, y: cornerPoints.topLeftCorner.y * scaleFactor },
-                topRightCorner: { x: cornerPoints.topRightCorner.x * scaleFactor, y: cornerPoints.topRightCorner.y * scaleFactor },
-                bottomLeftCorner: { x: cornerPoints.bottomLeftCorner.x * scaleFactor, y: cornerPoints.bottomLeftCorner.y * scaleFactor },
-                bottomRightCorner: { x: cornerPoints.bottomRightCorner.x * scaleFactor, y: cornerPoints.bottomRightCorner.y * scaleFactor },
+                topLeftCorner: {
+                  x: cornerPoints.topLeftCorner.x * scaleFactor,
+                  y: cornerPoints.topLeftCorner.y * scaleFactor,
+                },
+                topRightCorner: {
+                  x: cornerPoints.topRightCorner.x * scaleFactor,
+                  y: cornerPoints.topRightCorner.y * scaleFactor,
+                },
+                bottomLeftCorner: {
+                  x: cornerPoints.bottomLeftCorner.x * scaleFactor,
+                  y: cornerPoints.bottomLeftCorner.y * scaleFactor,
+                },
+                bottomRightCorner: {
+                  x: cornerPoints.bottomRightCorner.x * scaleFactor,
+                  y: cornerPoints.bottomRightCorner.y * scaleFactor,
+                },
               };
 
               // Use scaled corners for extraction
-              const { topLeftCorner, topRightCorner, bottomLeftCorner, bottomRightCorner } = scaledCorners;
+              const {
+                topLeftCorner,
+                topRightCorner,
+                bottomLeftCorner,
+                bottomRightCorner,
+              } = scaledCorners;
 
-              console.log('Document detected at full resolution:', {
+              console.log("Document detected at full resolution:", {
                 corners: scaledCorners,
               });
 
               // Calculate width and height of the document
-              const topWidth = Math.hypot(topRightCorner.x - topLeftCorner.x, topRightCorner.y - topLeftCorner.y);
-              const bottomWidth = Math.hypot(bottomRightCorner.x - bottomLeftCorner.x, bottomRightCorner.y - bottomLeftCorner.y);
-              const leftHeight = Math.hypot(bottomLeftCorner.x - topLeftCorner.x, bottomLeftCorner.y - topLeftCorner.y);
-              const rightHeight = Math.hypot(bottomRightCorner.x - topRightCorner.x, bottomRightCorner.y - topRightCorner.y);
+              const topWidth = Math.hypot(
+                topRightCorner.x - topLeftCorner.x,
+                topRightCorner.y - topLeftCorner.y,
+              );
+              const bottomWidth = Math.hypot(
+                bottomRightCorner.x - bottomLeftCorner.x,
+                bottomRightCorner.y - bottomLeftCorner.y,
+              );
+              const leftHeight = Math.hypot(
+                bottomLeftCorner.x - topLeftCorner.x,
+                bottomLeftCorner.y - topLeftCorner.y,
+              );
+              const rightHeight = Math.hypot(
+                bottomRightCorner.x - topRightCorner.x,
+                bottomRightCorner.y - topRightCorner.y,
+              );
 
               // Use average dimensions to maintain proper aspect ratio
               const docWidth = Math.round((topWidth + bottomWidth) / 2);
               const docHeight = Math.round((leftHeight + rightHeight) / 2);
 
               // Extract paper from full-resolution canvas with scaled corner points
-              const resultCanvas = scannerRef.current.extractPaper(canvas, docWidth, docHeight, scaledCorners);
+              const resultCanvas = scannerRef.current.extractPaper(
+                canvas,
+                docWidth,
+                docHeight,
+                scaledCorners,
+              );
 
               // Clean up Mat
               mat.delete();
 
               // Use high quality JPEG compression to preserve image quality
-              finalDataUrl = resultCanvas.toDataURL('image/jpeg', 0.95);
+              finalDataUrl = resultCanvas.toDataURL("image/jpeg", 0.95);
             } else {
-              console.log('No corners detected, using original');
+              console.log("No corners detected, using original");
               mat.delete();
-              finalDataUrl = canvas.toDataURL('image/jpeg', 0.95);
+              finalDataUrl = canvas.toDataURL("image/jpeg", 0.95);
             }
           } else {
-            console.log('No contour detected, using original');
+            console.log("No contour detected, using original");
             mat.delete();
-            finalDataUrl = canvas.toDataURL('image/jpeg', 0.95);
+            finalDataUrl = canvas.toDataURL("image/jpeg", 0.95);
           }
         } catch (err) {
-          console.warn('jscanify processing failed, using original image:', err);
-          finalDataUrl = canvas.toDataURL('image/jpeg', 0.95);
+          console.warn(
+            "jscanify processing failed, using original image:",
+            err,
+          );
+          finalDataUrl = canvas.toDataURL("image/jpeg", 0.95);
         }
       } else {
         // Auto-enhance disabled or jscanify not available - use original at high quality
-        finalDataUrl = canvas.toDataURL('image/jpeg', 0.95);
+        finalDataUrl = canvas.toDataURL("image/jpeg", 0.95);
       }
 
       setCurrentPreview(finalDataUrl);
@@ -629,21 +822,24 @@ export default function MobileScannerPage() {
     }
   }, [autoEnhance, openCvReady]);
 
-  const handleFileSelect = useCallback((e: React.ChangeEvent<HTMLInputElement>) => {
-    const files = e.target.files;
-    if (!files || files.length === 0) return;
+  const handleFileSelect = useCallback(
+    (e: React.ChangeEvent<HTMLInputElement>) => {
+      const files = e.target.files;
+      if (!files || files.length === 0) return;
 
-    const file = files[0];
-    const reader = new FileReader();
+      const file = files[0];
+      const reader = new FileReader();
 
-    reader.onload = (event) => {
-      if (event.target?.result) {
-        setCurrentPreview(event.target.result as string);
-      }
-    };
+      reader.onload = (event) => {
+        if (event.target?.result) {
+          setCurrentPreview(event.target.result as string);
+        }
+      };
 
-    reader.readAsDataURL(file);
-  }, []);
+      reader.readAsDataURL(file);
+    },
+    [],
+  );
 
   const addToBatch = useCallback(() => {
     if (currentPreview) {
@@ -653,7 +849,9 @@ export default function MobileScannerPage() {
   }, [currentPreview]);
 
   const uploadImages = useCallback(async () => {
-    const imagesToUpload = currentPreview ? [currentPreview, ...capturedImages] : capturedImages;
+    const imagesToUpload = currentPreview
+      ? [currentPreview, ...capturedImages]
+      : capturedImages;
 
     if (imagesToUpload.length === 0) return;
     if (!sessionId) return;
@@ -669,7 +867,9 @@ export default function MobileScannerPage() {
         const dataUrl = imagesToUpload[i];
         const response = await fetch(dataUrl);
         const blob = await response.blob();
-        const file = new File([blob], `scan-${Date.now()}-${i}.jpg`, { type: 'image/jpeg' });
+        const file = new File([blob], `scan-${Date.now()}-${i}.jpg`, {
+          type: "image/jpeg",
+        });
         files.push(file);
         setUploadProgress(((i + 1) / (imagesToUpload.length + 1)) * 50); // 0-50% for conversion
       }
@@ -677,16 +877,19 @@ export default function MobileScannerPage() {
       // Upload to backend
       const formData = new FormData();
       files.forEach((file) => {
-        formData.append('files', file);
+        formData.append("files", file);
       });
 
-      const uploadResponse = await fetch(`/api/v1/mobile-scanner/upload/${sessionId}`, {
-        method: 'POST',
-        body: formData,
-      });
+      const uploadResponse = await fetch(
+        `/api/v1/mobile-scanner/upload/${sessionId}`,
+        {
+          method: "POST",
+          body: formData,
+        },
+      );
 
       if (!uploadResponse.ok) {
-        throw new Error('Upload failed');
+        throw new Error("Upload failed");
       }
 
       setUploadProgress(100);
@@ -697,12 +900,14 @@ export default function MobileScannerPage() {
         window.close();
         // Fallback if window.close() doesn't work (some browsers block it)
         if (!window.closed) {
-          navigate('/');
+          navigate("/");
         }
       }, 1500);
     } catch (err) {
-      console.error('Upload failed:', err);
-      setUploadError(t('mobileScanner.uploadFailed', 'Upload failed. Please try again.'));
+      console.error("Upload failed:", err);
+      setUploadError(
+        t("mobileScanner.uploadFailed", "Upload failed. Please try again."),
+      );
     } finally {
       setIsUploading(false);
     }
@@ -725,17 +930,27 @@ export default function MobileScannerPage() {
         advanced: [{ torch: !torchEnabled } as any], // Cast to any for experimental torch API
       } as any);
       setTorchEnabled(!torchEnabled);
-      console.log('Torch:', !torchEnabled ? 'ON' : 'OFF');
+      console.log("Torch:", !torchEnabled ? "ON" : "OFF");
     } catch (err) {
-      console.error('Failed to toggle torch:', err);
+      console.error("Failed to toggle torch:", err);
     }
   }, [torchEnabled]);
 
   // Show loading while validating
   if (sessionValid === null) {
     return (
-      <Box p="xl" style={{ display: 'flex', flexDirection: 'column', alignItems: 'center', gap: '1rem' }}>
-        <Text size="lg">{t('mobileScanner.validating', 'Validating session...')}</Text>
+      <Box
+        p="xl"
+        style={{
+          display: "flex",
+          flexDirection: "column",
+          alignItems: "center",
+          gap: "1rem",
+        }}
+      >
+        <Text size="lg">
+          {t("mobileScanner.validating", "Validating session...")}
+        </Text>
       </Box>
     );
   }
@@ -744,8 +959,15 @@ export default function MobileScannerPage() {
   if (!sessionValid || !sessionId) {
     return (
       <Box p="xl">
-        <Alert color="red" title={t('mobileScanner.sessionInvalid', 'Session Error')}>
-          {sessionError || t('mobileScanner.noSessionMessage', 'Session not found. Please try again.')}
+        <Alert
+          color="red"
+          title={t("mobileScanner.sessionInvalid", "Session Error")}
+        >
+          {sessionError ||
+            t(
+              "mobileScanner.noSessionMessage",
+              "Session not found. Please try again.",
+            )}
         </Alert>
       </Box>
     );
@@ -755,20 +977,25 @@ export default function MobileScannerPage() {
     return (
       <Box
         style={{
-          display: 'flex',
-          flexDirection: 'column',
-          alignItems: 'center',
-          justifyContent: 'center',
-          height: '100dvh',
-          padding: '2rem',
+          display: "flex",
+          flexDirection: "column",
+          alignItems: "center",
+          justifyContent: "center",
+          height: "100dvh",
+          padding: "2rem",
         }}
       >
-        <CheckCircleRoundedIcon style={{ fontSize: '4rem', color: 'var(--mantine-color-green-6)' }} />
+        <CheckCircleRoundedIcon
+          style={{ fontSize: "4rem", color: "var(--mantine-color-green-6)" }}
+        />
         <Text size="xl" fw="bold" mt="md">
-          {t('mobileScanner.uploadSuccess', 'Upload Successful!')}
+          {t("mobileScanner.uploadSuccess", "Upload Successful!")}
         </Text>
         <Text size="sm" c="dimmed">
-          {t('mobileScanner.uploadSuccessMessage', 'Your images have been transferred.')}
+          {t(
+            "mobileScanner.uploadSuccessMessage",
+            "Your images have been transferred.",
+          )}
         </Text>
       </Box>
     );
@@ -777,45 +1004,41 @@ export default function MobileScannerPage() {
   return (
     <Box
       style={{
-        minHeight: '100dvh',
-        background: 'var(--bg-background)',
-        display: 'flex',
-        flexDirection: 'column',
+        minHeight: "100dvh",
+        background: "var(--bg-background)",
+        display: "flex",
+        flexDirection: "column",
       }}
     >
       {/* Header */}
       <Box
         p="md"
         style={{
-          background: 'var(--bg-toolbar)',
-          borderBottom: '1px solid var(--border-subtle)',
+          background: "var(--bg-toolbar)",
+          borderBottom: "1px solid var(--border-subtle)",
         }}
       >
         <Group gap="sm" align="center">
-          <img
-            src={brandIconSrc}
-            alt={t('home.mobile.brandAlt', 'Stirling PDF logo')}
-            style={{ height: '32px', width: '32px' }}
-          />
-          <img
-            src={brandTextSrc}
-            alt="Stirling PDF"
-            style={{ height: '24px' }}
+          <LogoIcon
+            alt={t("home.mobile.brandAlt", "Stirling PDF logo")}
+            style={{ height: "32px", width: "32px" }}
           />
+          <Wordmark alt="Stirling PDF" style={{ height: "24px" }} />
         </Group>
       </Box>
 
       {/* Status Banner - only show during camera loading or errors */}
-      {loadingStatus && mode === 'camera' && !loadingStatus.includes('✓') && (
+      {loadingStatus && mode === "camera" && !loadingStatus.includes("✓") && (
         <Box
           p="xs"
           style={{
-            background: loadingStatus.includes('✗') ? 'var(--mantine-color-red-1)' :
-                       'var(--mantine-color-blue-1)',
-            borderBottom: '1px solid var(--border-subtle)',
-            fontSize: '0.85rem',
-            fontFamily: 'monospace',
-            textAlign: 'center',
+            background: loadingStatus.includes("✗")
+              ? "var(--mantine-color-red-1)"
+              : "var(--mantine-color-blue-1)",
+            borderBottom: "1px solid var(--border-subtle)",
+            fontSize: "0.85rem",
+            fontFamily: "monospace",
+            textAlign: "center",
           }}
         >
           {loadingStatus}
@@ -824,7 +1047,12 @@ export default function MobileScannerPage() {
 
       {uploadError && (
         <Box p="md">
-          <Alert color="red" icon={<ErrorRoundedIcon />} onClose={() => setUploadError(null)} withCloseButton>
+          <Alert
+            color="red"
+            icon={<ErrorRoundedIcon />}
+            onClose={() => setUploadError(null)}
+            withCloseButton
+          >
             {uploadError}
           </Alert>
         </Box>
@@ -833,7 +1061,7 @@ export default function MobileScannerPage() {
       {isUploading && (
         <Box p="sm">
           <Text size="sm" mb="xs">
-            {t('mobileScanner.uploading', 'Uploading...')}
+            {t("mobileScanner.uploading", "Uploading...")}
           </Text>
           <Progress value={uploadProgress} animated />
         </Box>
@@ -848,42 +1076,58 @@ export default function MobileScannerPage() {
       )}
 
       {/* Choice screen */}
-      {mode === 'choice' && !currentPreview && (
-        <Stack gap="lg" p="xl" align="center" style={{ maxWidth: '500px', margin: '0 auto' }}>
+      {mode === "choice" && !currentPreview && (
+        <Stack
+          gap="lg"
+          p="xl"
+          align="center"
+          style={{ maxWidth: "500px", margin: "0 auto" }}
+        >
           <Stack gap="xs" align="center">
             <Text size="xl" fw={700} ta="center">
-              {t('mobileScanner.chooseMethod', 'Choose Upload Method')}
+              {t("mobileScanner.chooseMethod", "Choose Upload Method")}
             </Text>
             <Text size="sm" c="dimmed" ta="center">
-              {t('mobileScanner.chooseMethodDescription', 'Select how you want to scan and upload documents')}
+              {t(
+                "mobileScanner.chooseMethodDescription",
+                "Select how you want to scan and upload documents",
+              )}
             </Text>
           </Stack>
 
-          <Stack gap="md" style={{ width: '100%' }}>
+          <Stack gap="md" style={{ width: "100%" }}>
             <Card
               shadow="sm"
               padding="xl"
               radius="md"
               withBorder
-              style={{ cursor: 'pointer' }}
-              onClick={() => setMode('camera')}
+              style={{ cursor: "pointer" }}
+              onClick={() => setMode("camera")}
               styles={{
                 root: {
-                  transition: 'transform 0.2s, box-shadow 0.2s',
-                  '&:hover': {
-                    transform: 'scale(1.02)',
-                    boxShadow: 'var(--mantine-shadow-md)',
+                  transition: "transform 0.2s, box-shadow 0.2s",
+                  "&:hover": {
+                    transform: "scale(1.02)",
+                    boxShadow: "var(--mantine-shadow-md)",
                   },
                 },
               }}
             >
               <Stack align="center" gap="md">
-                <PhotoCameraRoundedIcon style={{ fontSize: '3rem', color: 'var(--mantine-color-blue-6)' }} />
+                <PhotoCameraRoundedIcon
+                  style={{
+                    fontSize: "3rem",
+                    color: "var(--mantine-color-blue-6)",
+                  }}
+                />
                 <Text size="lg" fw={600}>
-                  {t('mobileScanner.camera', 'Camera')}
+                  {t("mobileScanner.camera", "Camera")}
                 </Text>
                 <Text size="sm" c="dimmed" ta="center">
-                  {t('mobileScanner.cameraDescription', 'Scan documents using your device camera with automatic edge detection')}
+                  {t(
+                    "mobileScanner.cameraDescription",
+                    "Scan documents using your device camera with automatic edge detection",
+                  )}
                 </Text>
               </Stack>
             </Card>
@@ -893,25 +1137,33 @@ export default function MobileScannerPage() {
               padding="xl"
               radius="md"
               withBorder
-              style={{ cursor: 'pointer' }}
-              onClick={() => setMode('file')}
+              style={{ cursor: "pointer" }}
+              onClick={() => setMode("file")}
               styles={{
                 root: {
-                  transition: 'transform 0.2s, box-shadow 0.2s',
-                  '&:hover': {
-                    transform: 'scale(1.02)',
-                    boxShadow: 'var(--mantine-shadow-md)',
+                  transition: "transform 0.2s, box-shadow 0.2s",
+                  "&:hover": {
+                    transform: "scale(1.02)",
+                    boxShadow: "var(--mantine-shadow-md)",
                   },
                 },
               }}
             >
               <Stack align="center" gap="md">
-                <UploadRoundedIcon style={{ fontSize: '3rem', color: 'var(--mantine-color-green-6)' }} />
+                <UploadRoundedIcon
+                  style={{
+                    fontSize: "3rem",
+                    color: "var(--mantine-color-green-6)",
+                  }}
+                />
                 <Text size="lg" fw={600}>
-                  {t('mobileScanner.fileUpload', 'File Upload')}
+                  {t("mobileScanner.fileUpload", "File Upload")}
                 </Text>
                 <Text size="sm" c="dimmed" ta="center">
-                  {t('mobileScanner.fileDescription', 'Upload existing photos or documents from your device')}
+                  {t(
+                    "mobileScanner.fileDescription",
+                    "Upload existing photos or documents from your device",
+                  )}
                 </Text>
               </Stack>
             </Card>
@@ -920,55 +1172,69 @@ export default function MobileScannerPage() {
       )}
 
       {/* Camera interface */}
-      {mode === 'camera' && !currentPreview && (
-        <Box style={{ position: 'relative', height: 'calc(100dvh - 60px)', display: 'flex', flexDirection: 'column' }}>
+      {mode === "camera" && !currentPreview && (
+        <Box
+          style={{
+            position: "relative",
+            height: "calc(100dvh - 60px)",
+            display: "flex",
+            flexDirection: "column",
+          }}
+        >
           {/* Back button - floating top left */}
           <Button
-            onClick={() => setMode('choice')}
+            onClick={() => setMode("choice")}
             variant="filled"
             size="sm"
             style={{
-              position: 'absolute',
-              top: '1rem',
-              left: '1rem',
+              position: "absolute",
+              top: "1rem",
+              left: "1rem",
               zIndex: 10,
-              backgroundColor: 'rgba(0, 0, 0, 0.6)',
-              backdropFilter: 'blur(8px)',
-              border: 'none',
+              backgroundColor: "rgba(0, 0, 0, 0.6)",
+              backdropFilter: "blur(8px)",
+              border: "none",
             }}
           >
-            � {t('mobileScanner.back', 'Back')}
+            � {t("mobileScanner.back", "Back")}
           </Button>
 
           {/* Video feed - fills available space */}
-          <Box style={{ position: 'relative', flex: 1, background: '#000', overflow: 'hidden' }}>
+          <Box
+            style={{
+              position: "relative",
+              flex: 1,
+              background: "#000",
+              overflow: "hidden",
+            }}
+          >
             <video
               ref={videoRef}
               autoPlay
               playsInline
               muted
               style={{
-                width: '100%',
-                height: '100%',
-                display: 'block',
-                objectFit: 'contain',
+                width: "100%",
+                height: "100%",
+                display: "block",
+                objectFit: "contain",
               }}
             />
-            <canvas ref={canvasRef} style={{ display: 'none' }} />
+            <canvas ref={canvasRef} style={{ display: "none" }} />
             {/* Highlight overlay canvas - shows real-time document edge detection */}
             <canvas
               ref={highlightCanvasRef}
               style={{
-                position: 'absolute',
+                position: "absolute",
                 top: 0,
                 left: 0,
-                width: '100%',
-                height: '100%',
-                pointerEvents: 'none',
+                width: "100%",
+                height: "100%",
+                pointerEvents: "none",
                 opacity: autoEnhance ? 1 : 0,
-                transition: 'opacity 0.2s',
-                objectFit: 'contain',
-                imageRendering: 'auto',
+                transition: "opacity 0.2s",
+                objectFit: "contain",
+                imageRendering: "auto",
               }}
             />
           </Box>
@@ -976,14 +1242,14 @@ export default function MobileScannerPage() {
           {/* Controls bar - fixed at bottom */}
           <Box
             style={{
-              backgroundColor: 'var(--bg-toolbar)',
-              borderTop: '1px solid var(--border-subtle)',
-              padding: '0.75rem 1rem',
+              backgroundColor: "var(--bg-toolbar)",
+              borderTop: "1px solid var(--border-subtle)",
+              padding: "0.75rem 1rem",
             }}
           >
             <Stack gap="sm">
               {/* Settings toggles */}
-              <Group justify="space-around" style={{ width: '100%' }}>
+              <Group justify="space-around" style={{ width: "100%" }}>
                 <Group gap="xs">
                   <Switch
                     size="sm"
@@ -991,12 +1257,20 @@ export default function MobileScannerPage() {
                     onChange={(e) => setAutoEnhance(e.currentTarget.checked)}
                     disabled={!openCvReady}
                   />
-                  <Text size="xs">{t('mobileScanner.edgeDetection', 'Edge Detection')}</Text>
+                  <Text size="xs">
+                    {t("mobileScanner.edgeDetection", "Edge Detection")}
+                  </Text>
                 </Group>
                 {torchSupported && (
                   <Group gap="xs">
-                    <Switch size="sm" checked={torchEnabled} onChange={toggleTorch} />
-                    <Text size="xs">{t('mobileScanner.flashlight', 'Flash')}</Text>
+                    <Switch
+                      size="sm"
+                      checked={torchEnabled}
+                      onChange={toggleTorch}
+                    />
+                    <Text size="xs">
+                      {t("mobileScanner.flashlight", "Flash")}
+                    </Text>
                   </Group>
                 )}
               </Group>
@@ -1011,8 +1285,8 @@ export default function MobileScannerPage() {
                 radius="xl"
               >
                 {isProcessing
-                  ? t('mobileScanner.processing', 'Processing...')
-                  : t('mobileScanner.capture', 'Capture')}
+                  ? t("mobileScanner.processing", "Processing...")
+                  : t("mobileScanner.capture", "Capture")}
               </Button>
             </Stack>
           </Box>
@@ -1020,29 +1294,45 @@ export default function MobileScannerPage() {
       )}
 
       {/* File upload interface */}
-      {mode === 'file' && !currentPreview && (
-        <Stack gap="lg" p="xl" align="center" style={{ maxWidth: '500px', margin: '0 auto' }}>
+      {mode === "file" && !currentPreview && (
+        <Stack
+          gap="lg"
+          p="xl"
+          align="center"
+          style={{ maxWidth: "500px", margin: "0 auto" }}
+        >
           <Button
-            onClick={() => setMode('choice')}
+            onClick={() => setMode("choice")}
             variant="subtle"
             size="sm"
-            style={{ alignSelf: 'flex-start' }}
+            style={{ alignSelf: "flex-start" }}
           >
-            � {t('mobileScanner.back', 'Back')}
+            � {t("mobileScanner.back", "Back")}
           </Button>
 
-          <Card shadow="sm" padding="xl" radius="md" withBorder style={{ width: '100%' }}>
+          <Card
+            shadow="sm"
+            padding="xl"
+            radius="md"
+            withBorder
+            style={{ width: "100%" }}
+          >
             <Stack align="center" gap="lg">
-              <UploadRoundedIcon style={{ fontSize: '4rem', color: 'var(--mantine-color-gray-5)' }} />
+              <UploadRoundedIcon
+                style={{
+                  fontSize: "4rem",
+                  color: "var(--mantine-color-gray-5)",
+                }}
+              />
               <Text size="lg" fw={600} ta="center">
-                {t('mobileScanner.selectFilesPrompt', 'Select files to upload')}
+                {t("mobileScanner.selectFilesPrompt", "Select files to upload")}
               </Text>
               <input
                 ref={fileInputRef}
                 type="file"
                 accept="image/*"
                 multiple
-                style={{ display: 'none' }}
+                style={{ display: "none" }}
                 onChange={handleFileSelect}
               />
               <Button
@@ -1052,7 +1342,7 @@ export default function MobileScannerPage() {
                 onClick={() => fileInputRef.current?.click()}
                 leftSection={<AddPhotoAlternateRoundedIcon />}
               >
-                {t('mobileScanner.selectImage', 'Select Image')}
+                {t("mobileScanner.selectImage", "Select Image")}
               </Button>
             </Stack>
           </Card>
@@ -1061,31 +1351,64 @@ export default function MobileScannerPage() {
 
       {/* Preview interface */}
       {currentPreview && (
-        <Box style={{ position: 'relative', height: 'calc(100dvh - 60px)', display: 'flex', flexDirection: 'column' }}>
+        <Box
+          style={{
+            position: "relative",
+            height: "calc(100dvh - 60px)",
+            display: "flex",
+            flexDirection: "column",
+          }}
+        >
           {/* Preview image - fills available space */}
-          <Box style={{ position: 'relative', flex: 1, background: '#000', overflow: 'hidden', display: 'flex', alignItems: 'center', justifyContent: 'center' }}>
-            <img src={currentPreview} alt="Preview" style={{ maxWidth: '100%', maxHeight: '100%', display: 'block', objectFit: 'contain' }} />
+          <Box
+            style={{
+              position: "relative",
+              flex: 1,
+              background: "#000",
+              overflow: "hidden",
+              display: "flex",
+              alignItems: "center",
+              justifyContent: "center",
+            }}
+          >
+            <img
+              src={currentPreview}
+              alt="Preview"
+              style={{
+                maxWidth: "100%",
+                maxHeight: "100%",
+                display: "block",
+                objectFit: "contain",
+              }}
+            />
           </Box>
 
           {/* Controls bar - fixed at bottom */}
           <Box
             style={{
-              backgroundColor: 'var(--bg-toolbar)',
-              borderTop: '1px solid var(--border-subtle)',
-              padding: '0.75rem 1rem',
+              backgroundColor: "var(--bg-toolbar)",
+              borderTop: "1px solid var(--border-subtle)",
+              padding: "0.75rem 1rem",
             }}
           >
             <Stack gap="sm">
               <Group grow>
                 <Button variant="default" onClick={retake} size="lg">
-                  {t('mobileScanner.retake', 'Retake')}
+                  {t("mobileScanner.retake", "Retake")}
                 </Button>
                 <Button variant="filled" onClick={addToBatch} size="lg">
-                  {t('mobileScanner.addToBatch', 'Add to Batch')}
+                  {t("mobileScanner.addToBatch", "Add to Batch")}
                 </Button>
               </Group>
-              <Button fullWidth variant="filled" size="lg" onClick={uploadImages} loading={isUploading} radius="xl">
-                {t('mobileScanner.upload', 'Upload')}
+              <Button
+                fullWidth
+                variant="filled"
+                size="lg"
+                onClick={uploadImages}
+                loading={isUploading}
+                radius="xl"
+              >
+                {t("mobileScanner.upload", "Upload")}
               </Button>
             </Stack>
           </Box>
@@ -1093,33 +1416,50 @@ export default function MobileScannerPage() {
       )}
 
       {capturedImages.length > 0 && (
-        <Box p="sm" style={{ borderTop: '1px solid var(--border-subtle)' }}>
+        <Box p="sm" style={{ borderTop: "1px solid var(--border-subtle)" }}>
           <Group justify="space-between" mb="sm">
             <Text size="sm" fw={600}>
-              {t('mobileScanner.batchImages', 'Batch')} ({capturedImages.length})
+              {t("mobileScanner.batchImages", "Batch")} ({capturedImages.length}
+              )
             </Text>
             <Group gap="xs">
-              <Button size="xs" variant="outline" onClick={clearBatch} color="red">
-                {t('mobileScanner.clearBatch', 'Clear')}
+              <Button
+                size="xs"
+                variant="outline"
+                onClick={clearBatch}
+                color="red"
+              >
+                {t("mobileScanner.clearBatch", "Clear")}
               </Button>
               <Button size="xs" onClick={uploadImages} loading={isUploading}>
-                {t('mobileScanner.uploadAll', 'Upload All')}
+                {t("mobileScanner.uploadAll", "Upload All")}
               </Button>
             </Group>
           </Group>
-          <Box style={{ display: 'flex', gap: 'var(--space-sm)', overflowX: 'auto', paddingBottom: 'var(--space-sm)' }}>
+          <Box
+            style={{
+              display: "flex",
+              gap: "var(--space-sm)",
+              overflowX: "auto",
+              paddingBottom: "var(--space-sm)",
+            }}
+          >
             {capturedImages.map((img, idx) => (
               <Box
                 key={idx}
                 style={{
-                  minWidth: '80px',
-                  height: '80px',
-                  borderRadius: 'var(--radius-sm)',
-                  overflow: 'hidden',
-                  border: '2px solid var(--border-subtle)',
+                  minWidth: "80px",
+                  height: "80px",
+                  borderRadius: "var(--radius-sm)",
+                  overflow: "hidden",
+                  border: "2px solid var(--border-subtle)",
                 }}
               >
-                <img src={img} alt={`Capture ${idx + 1}`} style={{ width: '100%', height: '100%', objectFit: 'cover' }} />
+                <img
+                  src={img}
+                  alt={`Capture ${idx + 1}`}
+                  style={{ width: "100%", height: "100%", objectFit: "cover" }}
+                />
               </Box>
             ))}
           </Box>
diff --git a/frontend/src/core/services/accountService.ts b/frontend/src/core/services/accountService.ts
index 814065c93e..378a084239 100644
--- a/frontend/src/core/services/accountService.ts
+++ b/frontend/src/core/services/accountService.ts
@@ -1,5 +1,5 @@
-import { MfaSetupResponse } from '@app/responses/Mfa/MfaResponse';
-import apiClient from '@app/services/apiClient';
+import { MfaSetupResponse } from "@app/responses/Mfa/MfaResponse";
+import apiClient from "@app/services/apiClient";
 
 export interface AccountData {
   username: string;
@@ -28,7 +28,9 @@ export const accountService = {
    * This is a public endpoint - doesn't require authentication
    */
   async getLoginPageData(): Promise<LoginPageData> {
-    const response = await apiClient.get<LoginPageData>('/api/v1/proprietary/ui-data/login');
+    const response = await apiClient.get<LoginPageData>(
+      "/api/v1/proprietary/ui-data/login",
+    );
     return response.data;
   },
 
@@ -36,55 +38,83 @@ export const accountService = {
    * Get current user account data
    */
   async getAccountData(): Promise<AccountData> {
-    const response = await apiClient.get<AccountData>('/api/v1/proprietary/ui-data/account', { suppressErrorToast: true });
+    const response = await apiClient.get<AccountData>(
+      "/api/v1/proprietary/ui-data/account",
+      { suppressErrorToast: true },
+    );
     return response.data;
   },
 
   /**
    * Change user password
    */
-  async changePassword(currentPassword: string, newPassword: string): Promise<void> {
+  async changePassword(
+    currentPassword: string,
+    newPassword: string,
+  ): Promise<void> {
     const formData = new FormData();
-    formData.append('currentPassword', currentPassword);
-    formData.append('newPassword', newPassword);
-    await apiClient.post('/api/v1/user/change-password', formData);
+    formData.append("currentPassword", currentPassword);
+    formData.append("newPassword", newPassword);
+    await apiClient.post("/api/v1/user/change-password", formData);
   },
 
   /**
    * Change user password on first login (resets firstLogin flag)
    */
-  async changePasswordOnLogin(currentPassword: string, newPassword: string, confirmPassword: string): Promise<void> {
+  async changePasswordOnLogin(
+    currentPassword: string,
+    newPassword: string,
+    confirmPassword: string,
+  ): Promise<void> {
     const formData = new FormData();
-    formData.append('currentPassword', currentPassword);
-    formData.append('newPassword', newPassword);
-    formData.append('confirmPassword', confirmPassword);
-    await apiClient.post('/api/v1/user/change-password-on-login', formData, { responseType: 'json'});
+    formData.append("currentPassword", currentPassword);
+    formData.append("newPassword", newPassword);
+    formData.append("confirmPassword", confirmPassword);
+    await apiClient.post("/api/v1/user/change-password-on-login", formData, {
+      responseType: "json",
+    });
   },
 
   /**
    * Change username
    */
-  async changeUsername(newUsername: string, currentPassword: string): Promise<void> {
+  async changeUsername(
+    newUsername: string,
+    currentPassword: string,
+  ): Promise<void> {
     const formData = new FormData();
-    formData.append('currentPasswordChangeUsername', currentPassword);
-    formData.append('newUsername', newUsername);
-    await apiClient.post('/api/v1/user/change-username', formData);
+    formData.append("currentPasswordChangeUsername", currentPassword);
+    formData.append("newUsername", newUsername);
+    await apiClient.post("/api/v1/user/change-username", formData);
   },
 
   async requestMfaSetup(): Promise<MfaSetupResponse> {
-    const response = await apiClient.get<MfaSetupResponse>('/api/v1/auth/mfa/setup', { suppressErrorToast: true });
+    const response = await apiClient.get<MfaSetupResponse>(
+      "/api/v1/auth/mfa/setup",
+      { suppressErrorToast: true },
+    );
     return response.data;
   },
 
   async enableMfa(code: string): Promise<void> {
-    await apiClient.post('/api/v1/auth/mfa/enable', { code }, { skipAuthRedirect: true });
+    await apiClient.post(
+      "/api/v1/auth/mfa/enable",
+      { code },
+      { skipAuthRedirect: true },
+    );
   },
 
   async disableMfa(code: string): Promise<void> {
-    await apiClient.post('/api/v1/auth/mfa/disable', { code }, { skipAuthRedirect: true });
+    await apiClient.post(
+      "/api/v1/auth/mfa/disable",
+      { code },
+      { skipAuthRedirect: true },
+    );
   },
 
   async cancelMfaSetup(): Promise<void> {
-    await apiClient.post('/api/v1/auth/mfa/setup/cancel', undefined, { suppressErrorToast: true });
+    await apiClient.post("/api/v1/auth/mfa/setup/cancel", undefined, {
+      suppressErrorToast: true,
+    });
   },
 };
diff --git a/frontend/src/core/services/apiClient.ts b/frontend/src/core/services/apiClient.ts
index 0a5e7be141..4e4b1475e2 100644
--- a/frontend/src/core/services/apiClient.ts
+++ b/frontend/src/core/services/apiClient.ts
@@ -1,12 +1,12 @@
-import axios from 'axios';
-import { handleHttpError } from '@app/services/httpErrorHandler';
-import { setupApiInterceptors } from '@app/services/apiClientSetup';
-import { getApiBaseUrl } from '@app/services/apiClientConfig';
+import axios from "axios";
+import { handleHttpError } from "@app/services/httpErrorHandler";
+import { setupApiInterceptors } from "@app/services/apiClientSetup";
+import { getApiBaseUrl } from "@app/services/apiClientConfig";
 
 // Create axios instance with default config
 const apiClient = axios.create({
   baseURL: getApiBaseUrl(),
-  responseType: 'json',
+  responseType: "json",
   withCredentials: true,
 });
 
@@ -19,9 +19,8 @@ apiClient.interceptors.response.use(
   async (error) => {
     await handleHttpError(error); // Handle error (shows toast unless suppressed)
     return Promise.reject(error);
-  }
+  },
 );
 
-
 // ---------- Exports ----------
 export default apiClient;
diff --git a/frontend/src/core/services/apiClientConfig.ts b/frontend/src/core/services/apiClientConfig.ts
index 716c73ace7..b476d1348a 100644
--- a/frontend/src/core/services/apiClientConfig.ts
+++ b/frontend/src/core/services/apiClientConfig.ts
@@ -11,7 +11,10 @@
  */
 export function getApiBaseUrl(): string {
   // Runtime override to fix hardcoded localhost in builds
-  if (typeof window !== 'undefined' && (window as any).STIRLING_PDF_API_BASE_URL) {
+  if (
+    typeof window !== "undefined" &&
+    (window as any).STIRLING_PDF_API_BASE_URL
+  ) {
     return (window as any).STIRLING_PDF_API_BASE_URL;
   }
 
diff --git a/frontend/src/core/services/apiClientSetup.ts b/frontend/src/core/services/apiClientSetup.ts
index 7bc356a7f0..326978717b 100644
--- a/frontend/src/core/services/apiClientSetup.ts
+++ b/frontend/src/core/services/apiClientSetup.ts
@@ -1,14 +1,19 @@
-import type { AxiosInstance } from 'axios';
-import { getBrowserId } from '@app/utils/browserIdentifier';
+import type { AxiosInstance } from "axios";
+import { getBrowserId } from "@app/utils/browserIdentifier";
 
 export function setupApiInterceptors(client: AxiosInstance): void {
   // Add browser ID header for WAU tracking
   client.interceptors.request.use(
     (config) => {
       const browserId = getBrowserId();
-      config.headers['X-Browser-Id'] = browserId;
+      config.headers["X-Browser-Id"] = browserId;
       return config;
     },
-    (error) => Promise.reject(error)
+    (error) => Promise.reject(error),
   );
 }
+
+/** Auth headers for raw fetch() calls (SSE streams, etc.). Proprietary overrides with JWT + XSRF. */
+export function getAuthHeaders(): Record<string, string> {
+  return {};
+}
diff --git a/frontend/src/core/services/auditService.ts b/frontend/src/core/services/auditService.ts
index 4b37f12bf9..c748504c54 100644
--- a/frontend/src/core/services/auditService.ts
+++ b/frontend/src/core/services/auditService.ts
@@ -1,4 +1,4 @@
-import apiClient from '@app/services/apiClient';
+import apiClient from "@app/services/apiClient";
 
 export interface AuditSystemStatus {
   enabled: boolean;
@@ -73,9 +73,12 @@ const auditService = {
    * Get audit system status
    */
   async getSystemStatus(): Promise<AuditSystemStatus> {
-    const response = await apiClient.get('/api/v1/proprietary/ui-data/audit-dashboard', {
-      suppressErrorToast: true,
-    });
+    const response = await apiClient.get(
+      "/api/v1/proprietary/ui-data/audit-dashboard",
+      {
+        suppressErrorToast: true,
+      },
+    );
     const data = response.data;
 
     // Map V1 response to expected format
@@ -94,10 +97,15 @@ const auditService = {
   /**
    * Get audit statistics and KPI data
    */
-  async getStats(timePeriod: 'day' | 'week' | 'month' = 'week'): Promise<AuditStats> {
-    const response = await apiClient.get<AuditStats>('/api/v1/proprietary/ui-data/audit-stats', {
-      params: { period: timePeriod },
-    });
+  async getStats(
+    timePeriod: "day" | "week" | "month" = "week",
+  ): Promise<AuditStats> {
+    const response = await apiClient.get<AuditStats>(
+      "/api/v1/proprietary/ui-data/audit-stats",
+      {
+        params: { period: timePeriod },
+      },
+    );
     return response.data;
   },
 
@@ -105,19 +113,27 @@ const auditService = {
    * Get audit events with pagination and filters
    */
   async getEvents(filters: AuditFilters = {}): Promise<AuditEventsResponse> {
-    const response = await apiClient.get<AuditEventsResponse>('/api/v1/proprietary/ui-data/audit-events', {
-      params: filters,
-    });
+    const response = await apiClient.get<AuditEventsResponse>(
+      "/api/v1/proprietary/ui-data/audit-events",
+      {
+        params: filters,
+      },
+    );
     return response.data;
   },
 
   /**
    * Get chart data for dashboard
    */
-  async getChartsData(timePeriod: 'day' | 'week' | 'month' = 'week'): Promise<AuditChartsData> {
-    const response = await apiClient.get<AuditChartsData>('/api/v1/proprietary/ui-data/audit-charts', {
-      params: { period: timePeriod },
-    });
+  async getChartsData(
+    timePeriod: "day" | "week" | "month" = "week",
+  ): Promise<AuditChartsData> {
+    const response = await apiClient.get<AuditChartsData>(
+      "/api/v1/proprietary/ui-data/audit-charts",
+      {
+        params: { period: timePeriod },
+      },
+    );
     return response.data;
   },
 
@@ -125,13 +141,16 @@ const auditService = {
    * Export audit data with custom field selection
    */
   async exportData(
-    format: 'csv' | 'json',
-    filters: AuditFilters = {}
+    format: "csv" | "json",
+    filters: AuditFilters = {},
   ): Promise<Blob> {
-    const response = await apiClient.get('/api/v1/proprietary/ui-data/audit-export', {
-      params: { format, ...filters },
-      responseType: 'blob',
-    });
+    const response = await apiClient.get(
+      "/api/v1/proprietary/ui-data/audit-export",
+      {
+        params: { format, ...filters },
+        responseType: "blob",
+      },
+    );
     return response.data;
   },
 
@@ -139,7 +158,9 @@ const auditService = {
    * Get available event types for filtering
    */
   async getEventTypes(): Promise<string[]> {
-    const response = await apiClient.get<string[]>('/api/v1/proprietary/ui-data/audit-event-types');
+    const response = await apiClient.get<string[]>(
+      "/api/v1/proprietary/ui-data/audit-event-types",
+    );
     return response.data;
   },
 
@@ -147,7 +168,9 @@ const auditService = {
    * Get list of users for filtering
    */
   async getUsers(): Promise<string[]> {
-    const response = await apiClient.get<string[]>('/api/v1/proprietary/ui-data/audit-users');
+    const response = await apiClient.get<string[]>(
+      "/api/v1/proprietary/ui-data/audit-users",
+    );
     return response.data;
   },
 
@@ -155,7 +178,7 @@ const auditService = {
    * Clear all audit data from the database (irreversible)
    */
   async clearAllAuditData(): Promise<void> {
-    await apiClient.post('/api/v1/proprietary/ui-data/audit-clear-all', {});
+    await apiClient.post("/api/v1/proprietary/ui-data/audit-clear-all", {});
   },
 };
 
diff --git a/frontend/src/core/services/automationStorage.ts b/frontend/src/core/services/automationStorage.ts
index 990e95a7f1..826bf3ce30 100644
--- a/frontend/src/core/services/automationStorage.ts
+++ b/frontend/src/core/services/automationStorage.ts
@@ -15,9 +15,9 @@ export interface AutomationConfig {
 }
 
 class AutomationStorage {
-  private dbName = 'StirlingPDF_Automations';
+  private dbName = "StirlingPDF_Automations";
   private dbVersion = 1;
-  private storeName = 'automations';
+  private storeName = "automations";
   private db: IDBDatabase | null = null;
 
   async init(): Promise<void> {
@@ -25,7 +25,7 @@ class AutomationStorage {
       const request = indexedDB.open(this.dbName, this.dbVersion);
 
       request.onerror = () => {
-        reject(new Error('Failed to open automation storage database'));
+        reject(new Error("Failed to open automation storage database"));
       };
 
       request.onsuccess = () => {
@@ -35,11 +35,11 @@ class AutomationStorage {
 
       request.onupgradeneeded = (event) => {
         const db = (event.target as IDBOpenDBRequest).result;
-        
+
         if (!db.objectStoreNames.contains(this.storeName)) {
-          const store = db.createObjectStore(this.storeName, { keyPath: 'id' });
-          store.createIndex('name', 'name', { unique: false });
-          store.createIndex('createdAt', 'createdAt', { unique: false });
+          const store = db.createObjectStore(this.storeName, { keyPath: "id" });
+          store.createIndex("name", "name", { unique: false });
+          store.createIndex("createdAt", "createdAt", { unique: false });
         }
       };
     });
@@ -49,27 +49,29 @@ class AutomationStorage {
     if (!this.db) {
       await this.init();
     }
-    
+
     if (!this.db) {
-      throw new Error('Database not initialized');
+      throw new Error("Database not initialized");
     }
-    
+
     return this.db;
   }
 
-  async saveAutomation(automation: Omit<AutomationConfig, 'id' | 'createdAt' | 'updatedAt'>): Promise<AutomationConfig> {
+  async saveAutomation(
+    automation: Omit<AutomationConfig, "id" | "createdAt" | "updatedAt">,
+  ): Promise<AutomationConfig> {
     const db = await this.ensureDB();
     const timestamp = new Date().toISOString();
-    
+
     const automationWithMeta: AutomationConfig = {
       id: `automation-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`,
       ...automation,
       createdAt: timestamp,
-      updatedAt: timestamp
+      updatedAt: timestamp,
     };
 
     return new Promise((resolve, reject) => {
-      const transaction = db.transaction([this.storeName], 'readwrite');
+      const transaction = db.transaction([this.storeName], "readwrite");
       const store = transaction.objectStore(this.storeName);
       const request = store.add(automationWithMeta);
 
@@ -78,21 +80,23 @@ class AutomationStorage {
       };
 
       request.onerror = () => {
-        reject(new Error('Failed to save automation'));
+        reject(new Error("Failed to save automation"));
       };
     });
   }
 
-  async updateAutomation(automation: AutomationConfig): Promise<AutomationConfig> {
+  async updateAutomation(
+    automation: AutomationConfig,
+  ): Promise<AutomationConfig> {
     const db = await this.ensureDB();
-    
+
     const updatedAutomation: AutomationConfig = {
       ...automation,
-      updatedAt: new Date().toISOString()
+      updatedAt: new Date().toISOString(),
     };
 
     return new Promise((resolve, reject) => {
-      const transaction = db.transaction([this.storeName], 'readwrite');
+      const transaction = db.transaction([this.storeName], "readwrite");
       const store = transaction.objectStore(this.storeName);
       const request = store.put(updatedAutomation);
 
@@ -101,7 +105,7 @@ class AutomationStorage {
       };
 
       request.onerror = () => {
-        reject(new Error('Failed to update automation'));
+        reject(new Error("Failed to update automation"));
       };
     });
   }
@@ -110,7 +114,7 @@ class AutomationStorage {
     const db = await this.ensureDB();
 
     return new Promise((resolve, reject) => {
-      const transaction = db.transaction([this.storeName], 'readonly');
+      const transaction = db.transaction([this.storeName], "readonly");
       const store = transaction.objectStore(this.storeName);
       const request = store.get(id);
 
@@ -119,7 +123,7 @@ class AutomationStorage {
       };
 
       request.onerror = () => {
-        reject(new Error('Failed to get automation'));
+        reject(new Error("Failed to get automation"));
       };
     });
   }
@@ -128,19 +132,22 @@ class AutomationStorage {
     const db = await this.ensureDB();
 
     return new Promise((resolve, reject) => {
-      const transaction = db.transaction([this.storeName], 'readonly');
+      const transaction = db.transaction([this.storeName], "readonly");
       const store = transaction.objectStore(this.storeName);
       const request = store.getAll();
 
       request.onsuccess = () => {
         const automations = request.result || [];
         // Sort by creation date, newest first
-        automations.sort((a, b) => new Date(b.createdAt).getTime() - new Date(a.createdAt).getTime());
+        automations.sort(
+          (a, b) =>
+            new Date(b.createdAt).getTime() - new Date(a.createdAt).getTime(),
+        );
         resolve(automations);
       };
 
       request.onerror = () => {
-        reject(new Error('Failed to get automations'));
+        reject(new Error("Failed to get automations"));
       };
     });
   }
@@ -149,7 +156,7 @@ class AutomationStorage {
     const db = await this.ensureDB();
 
     return new Promise((resolve, reject) => {
-      const transaction = db.transaction([this.storeName], 'readwrite');
+      const transaction = db.transaction([this.storeName], "readwrite");
       const store = transaction.objectStore(this.storeName);
       const request = store.delete(id);
 
@@ -158,26 +165,30 @@ class AutomationStorage {
       };
 
       request.onerror = () => {
-        reject(new Error('Failed to delete automation'));
+        reject(new Error("Failed to delete automation"));
       };
     });
   }
 
   async searchAutomations(query: string): Promise<AutomationConfig[]> {
     const automations = await this.getAllAutomations();
-    
+
     if (!query.trim()) {
       return automations;
     }
 
     const lowerQuery = query.toLowerCase();
-    return automations.filter(automation => 
-      automation.name.toLowerCase().includes(lowerQuery) ||
-      (automation.description && automation.description.toLowerCase().includes(lowerQuery)) ||
-      automation.operations.some(op => op.operation.toLowerCase().includes(lowerQuery))
+    return automations.filter(
+      (automation) =>
+        automation.name.toLowerCase().includes(lowerQuery) ||
+        (automation.description &&
+          automation.description.toLowerCase().includes(lowerQuery)) ||
+        automation.operations.some((op) =>
+          op.operation.toLowerCase().includes(lowerQuery),
+        ),
     );
   }
 }
 
 // Export singleton instance
-export const automationStorage = new AutomationStorage();
\ No newline at end of file
+export const automationStorage = new AutomationStorage();
diff --git a/frontend/src/core/services/desktopNotificationService.ts b/frontend/src/core/services/desktopNotificationService.ts
index fb3b47d0c7..c84a8918cd 100644
--- a/frontend/src/core/services/desktopNotificationService.ts
+++ b/frontend/src/core/services/desktopNotificationService.ts
@@ -1,4 +1,6 @@
 // Stub - overridden in desktop builds
-export async function notifyPdfProcessingComplete(_fileCount: number): Promise<void> {
+export async function notifyPdfProcessingComplete(
+  _fileCount: number,
+): Promise<void> {
   // Web builds: no-op
 }
diff --git a/frontend/src/core/services/documentManipulationService.ts b/frontend/src/core/services/documentManipulationService.ts
index 53758f35d6..137cf8af30 100644
--- a/frontend/src/core/services/documentManipulationService.ts
+++ b/frontend/src/core/services/documentManipulationService.ts
@@ -1,5 +1,5 @@
-import { PDFDocument, PDFPage } from '@app/types/pageEditor';
-import { convertSplitPageIdsToIndexes } from '@app/components/pageEditor/utils/splitPositions';
+import { PDFDocument, PDFPage } from "@app/types/pageEditor";
+import { convertSplitPageIdsToIndexes } from "@app/components/pageEditor/utils/splitPositions";
 
 /**
  * Service for applying DOM changes to PDF document state
@@ -10,36 +10,43 @@ export class DocumentManipulationService {
    * Apply all DOM changes (rotations, splits, reordering) to document state
    * Returns single document or multiple documents if splits are present
    */
-  applyDOMChangesToDocument(pdfDocument: PDFDocument, currentDisplayOrder?: PDFDocument, splitPositions?: Set<string>): PDFDocument | PDFDocument[] {
+  applyDOMChangesToDocument(
+    pdfDocument: PDFDocument,
+    currentDisplayOrder?: PDFDocument,
+    splitPositions?: Set<string>,
+  ): PDFDocument | PDFDocument[] {
     // Use current display order (from React state) if provided, otherwise use original order
     const baseDocument = currentDisplayOrder || pdfDocument;
-    
+
     // Apply DOM changes to each page (rotation only now, splits are position-based)
-    let updatedPages = baseDocument.pages.map(page => this.applyPageChanges(page));
-    
+    let updatedPages = baseDocument.pages.map((page) =>
+      this.applyPageChanges(page),
+    );
+
     // Convert position-based splits to page-based splits for export
-    const resolvedSplitIndexes = splitPositions && splitPositions.size > 0
-      ? convertSplitPageIdsToIndexes(baseDocument, splitPositions)
-      : new Set<number>();
+    const resolvedSplitIndexes =
+      splitPositions && splitPositions.size > 0
+        ? convertSplitPageIdsToIndexes(baseDocument, splitPositions)
+        : new Set<number>();
 
     if (resolvedSplitIndexes.size > 0) {
       updatedPages = updatedPages.map((page, index) => ({
         ...page,
-        splitAfter: resolvedSplitIndexes.has(index)
+        splitAfter: resolvedSplitIndexes.has(index),
       }));
     }
-    
+
     // Create final document with reordered pages and applied changes
     const finalDocument = {
       ...pdfDocument, // Use original document metadata but updated pages
-      pages: updatedPages // Use reordered pages with applied changes
+      pages: updatedPages, // Use reordered pages with applied changes
     };
 
     // Check for splits and return multiple documents if needed
     if (resolvedSplitIndexes.size > 0) {
       return this.createSplitDocuments(finalDocument);
     }
-    
+
     return finalDocument;
   }
 
@@ -47,7 +54,7 @@ export class DocumentManipulationService {
    * Check if document has split markers
    */
   private hasSplitMarkers(document: PDFDocument): boolean {
-    return document.pages.some(page => page.splitAfter);
+    return document.pages.some((page) => page.splitAfter);
   }
 
   /**
@@ -65,7 +72,10 @@ export class DocumentManipulationService {
     });
 
     // Add end point if not already there
-    if (splitPoints.length === 0 || splitPoints[splitPoints.length - 1] !== document.pages.length) {
+    if (
+      splitPoints.length === 0 ||
+      splitPoints[splitPoints.length - 1] !== document.pages.length
+    ) {
       splitPoints.push(document.pages.length);
     }
 
@@ -79,9 +89,9 @@ export class DocumentManipulationService {
         documents.push({
           ...document,
           id: `${document.id}_part_${partNumber}`,
-          name: `${document.name.replace(/\.pdf$/i, '')}_part_${partNumber}.pdf`,
+          name: `${document.name.replace(/\.pdf$/i, "")}_part_${partNumber}.pdf`,
           pages: segmentPages,
-          totalPages: segmentPages.length
+          totalPages: segmentPages.length,
         });
         partNumber++;
       }
@@ -113,16 +123,24 @@ export class DocumentManipulationService {
   /**
    * Read rotation from DOM element
    */
-  private getRotationFromDOM(pageElement: Element, originalPage: PDFPage): number {
-    const img = pageElement.querySelector('img');
+  private getRotationFromDOM(
+    pageElement: Element,
+    originalPage: PDFPage,
+  ): number {
+    const img = pageElement.querySelector("img");
     if (img) {
-      const originalRotation = parseInt(img.getAttribute('data-original-rotation') || '0');
+      const originalRotation = parseInt(
+        img.getAttribute("data-original-rotation") || "0",
+      );
 
-      const currentTransform = img.style.transform || '';
+      const currentTransform = img.style.transform || "";
       const rotationMatch = currentTransform.match(/rotate\((-?\d+)deg\)/);
-      const visualRotation = rotationMatch ? parseInt(rotationMatch[1]) : originalRotation;
+      const visualRotation = rotationMatch
+        ? parseInt(rotationMatch[1])
+        : originalRotation;
 
-      const userChange = ((visualRotation - originalRotation) % 360 + 360) % 360;
+      const userChange =
+        (((visualRotation - originalRotation) % 360) + 360) % 360;
 
       let finalRotation = (originalPage.rotation + userChange) % 360;
       if (finalRotation === 360) finalRotation = 0;
@@ -137,12 +155,14 @@ export class DocumentManipulationService {
    * Reset all DOM changes (useful for "discard changes" functionality)
    */
   resetDOMToDocumentState(pdfDocument: PDFDocument): void {
-    console.log('DocumentManipulationService: Resetting DOM to match document state');
-    
-    pdfDocument.pages.forEach(page => {
+    console.log(
+      "DocumentManipulationService: Resetting DOM to match document state",
+    );
+
+    pdfDocument.pages.forEach((page) => {
       const pageElement = document.querySelector(`[data-page-id="${page.id}"]`);
       if (pageElement) {
-        const img = pageElement.querySelector('img');
+        const img = pageElement.querySelector("img");
         if (img) {
           // Reset rotation to match document state
           img.style.transform = `rotate(${page.rotation}deg)`;
@@ -155,7 +175,7 @@ export class DocumentManipulationService {
    * Check if DOM state differs from document state
    */
   hasUnsavedChanges(pdfDocument: PDFDocument): boolean {
-    return pdfDocument.pages.some(page => {
+    return pdfDocument.pages.some((page) => {
       const pageElement = document.querySelector(`[data-page-id="${page.id}"]`);
       if (pageElement) {
         const domRotation = this.getRotationFromDOM(pageElement, page);
diff --git a/frontend/src/core/services/downloadService.ts b/frontend/src/core/services/downloadService.ts
index 0905402a9c..db728e66d0 100644
--- a/frontend/src/core/services/downloadService.ts
+++ b/frontend/src/core/services/downloadService.ts
@@ -9,7 +9,9 @@ export interface DownloadResult {
   cancelled?: boolean;
 }
 
-export async function downloadFile(request: DownloadRequest): Promise<DownloadResult> {
+export async function downloadFile(
+  request: DownloadRequest,
+): Promise<DownloadResult> {
   const url = URL.createObjectURL(request.data);
 
   const link = document.createElement("a");
@@ -27,7 +29,7 @@ export async function downloadFile(request: DownloadRequest): Promise<DownloadRe
 export async function downloadFromUrl(
   url: string,
   filename: string,
-  localPath?: string
+  localPath?: string,
 ): Promise<DownloadResult> {
   const link = document.createElement("a");
   link.href = url;
diff --git a/frontend/src/core/services/enhancedPDFProcessingService.ts b/frontend/src/core/services/enhancedPDFProcessingService.ts
index 17aeb015a3..e91c34cde2 100644
--- a/frontend/src/core/services/enhancedPDFProcessingService.ts
+++ b/frontend/src/core/services/enhancedPDFProcessingService.ts
@@ -1,39 +1,48 @@
-import { ProcessedFile, ProcessingState, PDFPage, ProcessingConfig, ProcessingMetrics } from '@app/types/processing';
-import { ProcessingCache } from '@app/services/processingCache';
-import { FileHasher } from '@app/utils/fileHash';
-import { FileAnalyzer } from '@app/services/fileAnalyzer';
-import { ProcessingErrorHandler } from '@app/services/processingErrorHandler';
-import { pdfWorkerManager } from '@app/services/pdfWorkerManager';
-import { createQuickKey } from '@app/types/fileContext';
+import {
+  ProcessedFile,
+  ProcessingState,
+  PDFPage,
+  ProcessingConfig,
+  ProcessingMetrics,
+} from "@app/types/processing";
+import { ProcessingCache } from "@app/services/processingCache";
+import { FileHasher } from "@app/utils/fileHash";
+import { FileAnalyzer } from "@app/services/fileAnalyzer";
+import { ProcessingErrorHandler } from "@app/services/processingErrorHandler";
+import { pdfWorkerManager } from "@app/services/pdfWorkerManager";
+import { createQuickKey } from "@app/types/fileContext";
 
 export class EnhancedPDFProcessingService {
   private static instance: EnhancedPDFProcessingService;
   private cache = new ProcessingCache();
   private processing = new Map<string, ProcessingState>();
-  private processingListeners = new Set<(states: Map<string, ProcessingState>) => void>();
+  private processingListeners = new Set<
+    (states: Map<string, ProcessingState>) => void
+  >();
   private metrics: ProcessingMetrics = {
     totalFiles: 0,
     completedFiles: 0,
     failedFiles: 0,
     averageProcessingTime: 0,
     cacheHitRate: 0,
-    memoryUsage: 0
+    memoryUsage: 0,
   };
 
   private defaultConfig: ProcessingConfig = {
-    strategy: 'immediate_full',
+    strategy: "immediate_full",
     chunkSize: 20,
-    thumbnailQuality: 'medium',
+    thumbnailQuality: "medium",
     priorityPageCount: 10,
     useWebWorker: false,
-    maxRetries: 3
+    maxRetries: 3,
   };
 
   private constructor() {}
 
   static getInstance(): EnhancedPDFProcessingService {
     if (!EnhancedPDFProcessingService.instance) {
-      EnhancedPDFProcessingService.instance = new EnhancedPDFProcessingService();
+      EnhancedPDFProcessingService.instance =
+        new EnhancedPDFProcessingService();
     }
     return EnhancedPDFProcessingService.instance;
   }
@@ -41,13 +50,16 @@ export class EnhancedPDFProcessingService {
   /**
    * Process a file with intelligent strategy selection
    */
-  async processFile(file: File, customConfig?: Partial<ProcessingConfig>): Promise<ProcessedFile | null> {
+  async processFile(
+    file: File,
+    customConfig?: Partial<ProcessingConfig>,
+  ): Promise<ProcessedFile | null> {
     const fileKey = await this.generateFileKey(file);
 
     // Check cache first
     const cached = this.cache.get(fileKey);
     if (cached) {
-      this.updateMetrics('cacheHit');
+      this.updateMetrics("cacheHit");
       return cached;
     }
 
@@ -66,11 +78,16 @@ export class EnhancedPDFProcessingService {
     const config: ProcessingConfig = {
       ...this.defaultConfig,
       strategy: analysis.recommendedStrategy,
-      ...customConfig
+      ...customConfig,
     };
 
     // Start processing
-    this.startProcessing(file, fileKey, config, analysis.estimatedProcessingTime);
+    this.startProcessing(
+      file,
+      fileKey,
+      config,
+      analysis.estimatedProcessingTime,
+    );
     return null;
   }
 
@@ -81,7 +98,7 @@ export class EnhancedPDFProcessingService {
     file: File,
     fileKey: string,
     config: ProcessingConfig,
-    estimatedTime: number
+    estimatedTime: number,
   ): Promise<void> {
     // Create cancellation token
     const cancellationToken = new AbortController();
@@ -90,17 +107,17 @@ export class EnhancedPDFProcessingService {
     const state: ProcessingState = {
       fileKey,
       fileName: file.name,
-      status: 'processing',
+      status: "processing",
       progress: 0,
       strategy: config.strategy,
       startedAt: Date.now(),
       estimatedTimeRemaining: estimatedTime,
-      cancellationToken
+      cancellationToken,
     };
 
     this.processing.set(fileKey, state);
     this.notifyListeners();
-    this.updateMetrics('started');
+    this.updateMetrics("started");
 
     try {
       // Execute processing with retry logic
@@ -110,33 +127,33 @@ export class EnhancedPDFProcessingService {
           state.error = error;
           this.notifyListeners();
         },
-        config.maxRetries
+        config.maxRetries,
       );
 
       // Cache the result
       this.cache.set(fileKey, processedFile);
 
       // Update state to completed
-      state.status = 'completed';
+      state.status = "completed";
       state.progress = 100;
       state.completedAt = Date.now();
       this.notifyListeners();
-      this.updateMetrics('completed', Date.now() - state.startedAt);
+      this.updateMetrics("completed", Date.now() - state.startedAt);
 
       // Remove from processing map after brief delay
       setTimeout(() => {
         this.processing.delete(fileKey);
         this.notifyListeners();
       }, 2000);
-
     } catch (error) {
-      console.error('Processing failed for', file.name, ':', error);
+      console.error("Processing failed for", file.name, ":", error);
 
-      const processingError = ProcessingErrorHandler.createProcessingError(error);
-      state.status = 'error';
+      const processingError =
+        ProcessingErrorHandler.createProcessingError(error);
+      state.status = "error";
       state.error = processingError;
       this.notifyListeners();
-      this.updateMetrics('failed');
+      this.updateMetrics("failed");
 
       // Remove failed processing after delay
       setTimeout(() => {
@@ -152,19 +169,19 @@ export class EnhancedPDFProcessingService {
   private async executeProcessingStrategy(
     file: File,
     config: ProcessingConfig,
-    state: ProcessingState
+    state: ProcessingState,
   ): Promise<ProcessedFile> {
     switch (config.strategy) {
-      case 'immediate_full':
+      case "immediate_full":
         return this.processImmediateFull(file, config, state);
 
-      case 'priority_pages':
+      case "priority_pages":
         return this.processPriorityPages(file, config, state);
 
-      case 'progressive_chunked':
+      case "progressive_chunked":
         return this.processProgressiveChunked(file, config, state);
 
-      case 'metadata_only':
+      case "metadata_only":
         return this.processMetadataOnly(file, config, state);
 
       default:
@@ -178,7 +195,7 @@ export class EnhancedPDFProcessingService {
   private async processImmediateFull(
     file: File,
     config: ProcessingConfig,
-    state: ProcessingState
+    state: ProcessingState,
   ): Promise<ProcessedFile> {
     const arrayBuffer = await file.arrayBuffer();
     const pdf = await pdfWorkerManager.createDocument(arrayBuffer);
@@ -194,11 +211,14 @@ export class EnhancedPDFProcessingService {
       for (let i = 1; i <= totalPages; i++) {
         // Check for cancellation
         if (state.cancellationToken?.signal.aborted) {
-          throw new Error('Processing cancelled');
+          throw new Error("Processing cancelled");
         }
 
         const page = await pdf.getPage(i);
-        const thumbnail = await this.renderPageThumbnail(page, config.thumbnailQuality);
+        const thumbnail = await this.renderPageThumbnail(
+          page,
+          config.thumbnailQuality,
+        );
 
         const rotation = page.rotate || 0;
 
@@ -207,7 +227,7 @@ export class EnhancedPDFProcessingService {
           pageNumber: i,
           thumbnail,
           rotation,
-          selected: false
+          selected: false,
         });
 
         // Update progress
@@ -230,7 +250,7 @@ export class EnhancedPDFProcessingService {
   private async processPriorityPages(
     file: File,
     config: ProcessingConfig,
-    state: ProcessingState
+    state: ProcessingState,
   ): Promise<ProcessedFile> {
     const arrayBuffer = await file.arrayBuffer();
     const pdf = await pdfWorkerManager.createDocument(arrayBuffer);
@@ -246,18 +266,21 @@ export class EnhancedPDFProcessingService {
     for (let i = 1; i <= priorityCount; i++) {
       if (state.cancellationToken?.signal.aborted) {
         pdfWorkerManager.destroyDocument(pdf);
-        throw new Error('Processing cancelled');
+        throw new Error("Processing cancelled");
       }
 
       const page = await pdf.getPage(i);
-      const thumbnail = await this.renderPageThumbnail(page, config.thumbnailQuality);
+      const thumbnail = await this.renderPageThumbnail(
+        page,
+        config.thumbnailQuality,
+      );
 
       pages.push({
         id: `${createQuickKey(file)}-page-${i}`,
         pageNumber: i,
         thumbnail,
         rotation: page.rotate || 0,
-        selected: false
+        selected: false,
       });
 
       state.progress = 10 + (i / priorityCount) * 60;
@@ -272,7 +295,7 @@ export class EnhancedPDFProcessingService {
         pageNumber: i,
         thumbnail: null, // Will be loaded lazily
         rotation: 0,
-        selected: false
+        selected: false,
       });
     }
 
@@ -289,7 +312,7 @@ export class EnhancedPDFProcessingService {
   private async processProgressiveChunked(
     file: File,
     config: ProcessingConfig,
-    state: ProcessingState
+    state: ProcessingState,
   ): Promise<ProcessedFile> {
     const arrayBuffer = await file.arrayBuffer();
     const pdf = await pdfWorkerManager.createDocument(arrayBuffer);
@@ -308,18 +331,21 @@ export class EnhancedPDFProcessingService {
     for (let i = 1; i <= firstChunkEnd; i++) {
       if (state.cancellationToken?.signal.aborted) {
         pdfWorkerManager.destroyDocument(pdf);
-        throw new Error('Processing cancelled');
+        throw new Error("Processing cancelled");
       }
 
       const page = await pdf.getPage(i);
-      const thumbnail = await this.renderPageThumbnail(page, config.thumbnailQuality);
+      const thumbnail = await this.renderPageThumbnail(
+        page,
+        config.thumbnailQuality,
+      );
 
       pages.push({
         id: `${createQuickKey(file)}-page-${i}`,
         pageNumber: i,
         thumbnail,
         rotation: page.rotate || 0,
-        selected: false
+        selected: false,
       });
 
       processedPages++;
@@ -329,7 +355,7 @@ export class EnhancedPDFProcessingService {
 
       // Small delay to prevent UI blocking
       if (i % 5 === 0) {
-        await new Promise(resolve => setTimeout(resolve, 10));
+        await new Promise((resolve) => setTimeout(resolve, 10));
       }
     }
 
@@ -340,7 +366,7 @@ export class EnhancedPDFProcessingService {
         pageNumber: i,
         thumbnail: null,
         rotation: 0,
-        selected: false
+        selected: false,
       });
     }
 
@@ -357,7 +383,7 @@ export class EnhancedPDFProcessingService {
   private async processMetadataOnly(
     file: File,
     _config: ProcessingConfig,
-    state: ProcessingState
+    state: ProcessingState,
   ): Promise<ProcessedFile> {
     const arrayBuffer = await file.arrayBuffer();
     const pdf = await pdfWorkerManager.createDocument(arrayBuffer);
@@ -374,7 +400,7 @@ export class EnhancedPDFProcessingService {
         pageNumber: i,
         thumbnail: null,
         rotation: 0,
-        selected: false
+        selected: false,
       });
     }
 
@@ -388,28 +414,35 @@ export class EnhancedPDFProcessingService {
   /**
    * Render a page thumbnail with specified quality
    */
-  private async renderPageThumbnail(page: any, quality: 'low' | 'medium' | 'high'): Promise<string> {
+  private async renderPageThumbnail(
+    page: any,
+    quality: "low" | "medium" | "high",
+  ): Promise<string> {
     const scales = { low: 0.2, medium: 0.5, high: 0.8 }; // Reduced low quality for page editor
     const scale = scales[quality];
 
     const viewport = page.getViewport({ scale, rotation: 0 });
-    const canvas = document.createElement('canvas');
+    const canvas = document.createElement("canvas");
     canvas.width = viewport.width;
     canvas.height = viewport.height;
 
-    const context = canvas.getContext('2d');
+    const context = canvas.getContext("2d");
     if (!context) {
-      throw new Error('Could not get canvas context');
+      throw new Error("Could not get canvas context");
     }
 
     await page.render({ canvasContext: context, viewport }).promise;
-    return canvas.toDataURL('image/jpeg', 0.8); // Use JPEG for better compression
+    return canvas.toDataURL("image/jpeg", 0.8); // Use JPEG for better compression
   }
 
   /**
    * Create a ProcessedFile object
    */
-  private createProcessedFile(file: File, pages: PDFPage[], totalPages: number): ProcessedFile {
+  private createProcessedFile(
+    file: File,
+    pages: PDFPage[],
+    totalPages: number,
+  ): ProcessedFile {
     return {
       id: `${Date.now()}-${Math.random().toString(36).substr(2, 9)}`,
       pages,
@@ -417,12 +450,11 @@ export class EnhancedPDFProcessingService {
       metadata: {
         title: file.name,
         createdAt: new Date().toISOString(),
-        modifiedAt: new Date().toISOString()
-      }
+        modifiedAt: new Date().toISOString(),
+      },
     };
   }
 
-
   /**
    * Generate a unique, collision-resistant cache key
    */
@@ -437,7 +469,7 @@ export class EnhancedPDFProcessingService {
     const state = this.processing.get(fileKey);
     if (state && state.cancellationToken) {
       state.cancellationToken.abort();
-      state.status = 'cancelled';
+      state.status = "cancelled";
       this.notifyListeners();
     }
   }
@@ -445,26 +477,35 @@ export class EnhancedPDFProcessingService {
   /**
    * Update processing metrics
    */
-  private updateMetrics(event: 'started' | 'completed' | 'failed' | 'cacheHit', processingTime?: number): void {
+  private updateMetrics(
+    event: "started" | "completed" | "failed" | "cacheHit",
+    processingTime?: number,
+  ): void {
     switch (event) {
-      case 'started':
+      case "started":
         this.metrics.totalFiles++;
         break;
-      case 'completed':
+      case "completed":
         this.metrics.completedFiles++;
         if (processingTime) {
           // Update rolling average
-          const totalProcessingTime = this.metrics.averageProcessingTime * (this.metrics.completedFiles - 1) + processingTime;
-          this.metrics.averageProcessingTime = totalProcessingTime / this.metrics.completedFiles;
+          const totalProcessingTime =
+            this.metrics.averageProcessingTime *
+              (this.metrics.completedFiles - 1) +
+            processingTime;
+          this.metrics.averageProcessingTime =
+            totalProcessingTime / this.metrics.completedFiles;
         }
         break;
-      case 'failed':
+      case "failed":
         this.metrics.failedFiles++;
         break;
-      case 'cacheHit': {
+      case "cacheHit": {
         // Update cache hit rate
         const totalAttempts = this.metrics.totalFiles + 1;
-        this.metrics.cacheHitRate = (this.metrics.cacheHitRate * this.metrics.totalFiles + 1) / totalAttempts;
+        this.metrics.cacheHitRate =
+          (this.metrics.cacheHitRate * this.metrics.totalFiles + 1) /
+          totalAttempts;
         break;
       }
     }
@@ -480,7 +521,9 @@ export class EnhancedPDFProcessingService {
   /**
    * State subscription for components
    */
-  onProcessingChange(callback: (states: Map<string, ProcessingState>) => void): () => void {
+  onProcessingChange(
+    callback: (states: Map<string, ProcessingState>) => void,
+  ): () => void {
     this.processingListeners.add(callback);
     return () => this.processingListeners.delete(callback);
   }
@@ -490,7 +533,7 @@ export class EnhancedPDFProcessingService {
   }
 
   private notifyListeners(): void {
-    this.processingListeners.forEach(callback => callback(this.processing));
+    this.processingListeners.forEach((callback) => callback(this.processing));
   }
 
   /**
@@ -552,4 +595,5 @@ export class EnhancedPDFProcessingService {
 }
 
 // Export singleton instance
-export const enhancedPDFProcessingService = EnhancedPDFProcessingService.getInstance();
+export const enhancedPDFProcessingService =
+  EnhancedPDFProcessingService.getInstance();
diff --git a/frontend/src/core/services/errorUtils.ts b/frontend/src/core/services/errorUtils.ts
index b95e3dfd56..cdfeb9f38f 100644
--- a/frontend/src/core/services/errorUtils.ts
+++ b/frontend/src/core/services/errorUtils.ts
@@ -1,17 +1,22 @@
 export const FILE_EVENTS = {
-  markError: 'files:markError',
+  markError: "files:markError",
 } as const;
 
-const UUID_REGEX = /[0-9a-fA-F]{8}-[0-9a-fA-F]{4}-[0-9a-fA-F]{4}-[0-9a-fA-F]{4}-[0-9a-fA-F]{12}/g;
+const UUID_REGEX =
+  /[0-9a-fA-F]{8}-[0-9a-fA-F]{4}-[0-9a-fA-F]{4}-[0-9a-fA-F]{4}-[0-9a-fA-F]{12}/g;
 
 export function tryParseJson<T = any>(input: unknown): T | undefined {
-  if (typeof input !== 'string') return input as T | undefined;
-  try { return JSON.parse(input) as T; } catch { return undefined; }
+  if (typeof input !== "string") return input as T | undefined;
+  try {
+    return JSON.parse(input) as T;
+  } catch {
+    return undefined;
+  }
 }
 
 export async function normalizeAxiosErrorData(data: any): Promise<any> {
   if (!data) return undefined;
-  if (typeof data?.text === 'function') {
+  if (typeof data?.text === "function") {
     const text = await data.text();
     return tryParseJson(text) ?? text;
   }
@@ -20,8 +25,9 @@ export async function normalizeAxiosErrorData(data: any): Promise<any> {
 
 export function extractErrorFileIds(payload: any): string[] | undefined {
   if (!payload) return undefined;
-  if (Array.isArray(payload?.errorFileIds)) return payload.errorFileIds as string[];
-  if (typeof payload === 'string') {
+  if (Array.isArray(payload?.errorFileIds))
+    return payload.errorFileIds as string[];
+  if (typeof payload === "string") {
     const matches = payload.match(UUID_REGEX);
     if (matches && matches.length > 0) return Array.from(new Set(matches));
   }
@@ -30,18 +36,20 @@ export function extractErrorFileIds(payload: any): string[] | undefined {
 
 export function broadcastErroredFiles(fileIds: string[]) {
   if (!fileIds || fileIds.length === 0) return;
-  window.dispatchEvent(new CustomEvent(FILE_EVENTS.markError, { detail: { fileIds } }));
+  window.dispatchEvent(
+    new CustomEvent(FILE_EVENTS.markError, { detail: { fileIds } }),
+  );
 }
 
-export function isZeroByte(file: File | { size?: number } | null | undefined): boolean {
+export function isZeroByte(
+  file: File | { size?: number } | null | undefined,
+): boolean {
   if (!file) return true;
   const size = (file as any).size;
-  return typeof size === 'number' ? size <= 0 : true;
+  return typeof size === "number" ? size <= 0 : true;
 }
 
 export function isEmptyOutput(files: File[] | null | undefined): boolean {
   if (!files || files.length === 0) return true;
-  return files.every(f => (f as any)?.size === 0);
+  return files.every((f) => (f as any)?.size === 0);
 }
-
-
diff --git a/frontend/src/core/services/fileAnalyzer.ts b/frontend/src/core/services/fileAnalyzer.ts
index 7181489d50..4b7af9aa67 100644
--- a/frontend/src/core/services/fileAnalyzer.ts
+++ b/frontend/src/core/services/fileAnalyzer.ts
@@ -1,16 +1,35 @@
-import { FileAnalysis, ProcessingStrategy } from '@app/types/processing';
-import { pdfWorkerManager } from '@app/services/pdfWorkerManager';
+import { FileAnalysis, ProcessingStrategy } from "@app/types/processing";
+import { pdfWorkerManager } from "@app/services/pdfWorkerManager";
+import type { PDFDocumentProxy } from "pdfjs-dist";
+
+// Scan the last ~8KB of the PDF for an /Encrypt entry. The trailer lives near
+// the tail of the file, so this is enough in practice while staying cheap.
+// For files smaller than the window, the whole file is scanned.
+function hasEncryptMarker(buffer: ArrayBuffer): boolean {
+  const TAIL_BYTES = 8 * 1024;
+  const offset = Math.max(0, buffer.byteLength - TAIL_BYTES);
+  const view = new Uint8Array(buffer, offset);
+  // "/Encrypt" as ASCII bytes
+  const needle = [0x2f, 0x45, 0x6e, 0x63, 0x72, 0x79, 0x70, 0x74];
+  outer: for (let i = 0; i <= view.length - needle.length; i++) {
+    for (let j = 0; j < needle.length; j++) {
+      if (view[i + j] !== needle[j]) continue outer;
+    }
+    return true;
+  }
+  return false;
+}
 
 export class FileAnalyzer {
   private static readonly SIZE_THRESHOLDS = {
-    SMALL: 10 * 1024 * 1024,  // 10MB
+    SMALL: 10 * 1024 * 1024, // 10MB
     MEDIUM: 50 * 1024 * 1024, // 50MB
     LARGE: 200 * 1024 * 1024, // 200MB
   };
 
   private static readonly PAGE_THRESHOLDS = {
-    FEW: 10,    // < 10 pages - immediate full processing
-    MANY: 50,   // < 50 pages - priority pages
+    FEW: 10, // < 10 pages - immediate full processing
+    MANY: 50, // < 50 pages - priority pages
     MASSIVE: 100, // < 100 pages - progressive chunked
     // >100 pages = metadata only
   };
@@ -23,7 +42,7 @@ export class FileAnalyzer {
       fileSize: file.size,
       isEncrypted: false,
       isCorrupted: false,
-      recommendedStrategy: 'metadata_only',
+      recommendedStrategy: "metadata_only",
       estimatedProcessingTime: 0,
     };
 
@@ -35,19 +54,21 @@ export class FileAnalyzer {
       analysis.isCorrupted = quickAnalysis.isCorrupted;
 
       // Determine strategy based on file characteristics
-      analysis.recommendedStrategy = this.determineStrategy(file.size, quickAnalysis.pageCount);
+      analysis.recommendedStrategy = this.determineStrategy(
+        file.size,
+        quickAnalysis.pageCount,
+      );
 
       // Estimate processing time
       analysis.estimatedProcessingTime = this.estimateProcessingTime(
         file.size,
         quickAnalysis.pageCount,
-        analysis.recommendedStrategy
+        analysis.recommendedStrategy,
       );
-
     } catch (error) {
-      console.error('File analysis failed:', error);
+      console.error("File analysis failed:", error);
       analysis.isCorrupted = true;
-      analysis.recommendedStrategy = 'metadata_only';
+      analysis.recommendedStrategy = "metadata_only";
     }
 
     return analysis;
@@ -56,72 +77,119 @@ export class FileAnalyzer {
   /**
    * Quick PDF analysis without full processing
    */
+  /**
+   * Cheap encryption-only probe for the upload-time detection path.
+   *
+   * Looks for a /Encrypt entry in the last 8KB of the file (where the PDF
+   * trailer lives). If absent, the file is definitely not encrypted and we
+   * can skip a full pdf.js parse. If present, falls back to pdf.js so we can
+   * distinguish user-password (blocks open) from owner-password-only (opens
+   * fine) — only the former should prompt.
+   */
+  static async isPDFUserPasswordProtected(file: File): Promise<boolean> {
+    const arrayBuffer = await file.arrayBuffer();
+    if (!hasEncryptMarker(arrayBuffer)) return false;
+
+    let pdf: PDFDocumentProxy | undefined;
+    try {
+      pdf = await pdfWorkerManager.createDocument(arrayBuffer, {
+        stopAtErrors: false,
+        verbosity: 0,
+      });
+      // pdf.js opened it — owner-password-only case, no prompt needed.
+      return false;
+    } catch (error) {
+      const errorMessage =
+        error instanceof Error ? error.message.toLowerCase() : "";
+      return (
+        errorMessage.includes("password") || errorMessage.includes("encrypted")
+      );
+    } finally {
+      if (pdf) pdfWorkerManager.destroyDocument(pdf);
+    }
+  }
+
   static async quickPDFAnalysis(file: File): Promise<{
     pageCount: number;
     isEncrypted: boolean;
     isCorrupted: boolean;
   }> {
+    let pdf: PDFDocumentProxy | undefined;
     try {
       // For small files, read the whole file
       // For large files, try the whole file first (PDF.js needs the complete structure)
       const arrayBuffer = await file.arrayBuffer();
 
-      const pdf = await pdfWorkerManager.createDocument(arrayBuffer, {
+      pdf = await pdfWorkerManager.createDocument(arrayBuffer, {
         stopAtErrors: false, // Don't stop at minor errors
-        verbosity: 0 // Suppress PDF.js warnings
+        verbosity: 0, // Suppress PDF.js warnings
       });
 
       const pageCount = pdf.numPages;
-      const isEncrypted = (pdf as any).isEncrypted;
-
-      // Clean up using worker manager
-      pdfWorkerManager.destroyDocument(pdf);
 
+      // If pdf.js opened the document successfully, the user can view it — even if
+      // the PDF carries encryption dictionaries (owner-password-only case).  We only
+      // flag isEncrypted when pdf.js *fails* to open the file (caught below).
       return {
         pageCount,
-        isEncrypted,
-        isCorrupted: false
+        isEncrypted: false,
+        isCorrupted: false,
       };
-
     } catch (error) {
       // Try to determine if it's corruption vs encryption
-      const errorMessage = error instanceof Error ? error.message.toLowerCase() : '';
-      const isEncrypted = errorMessage.includes('password') || errorMessage.includes('encrypted');
+      const errorMessage =
+        error instanceof Error ? error.message.toLowerCase() : "";
+      const isEncrypted =
+        errorMessage.includes("password") || errorMessage.includes("encrypted");
 
       return {
         pageCount: 0,
         isEncrypted,
-        isCorrupted: !isEncrypted // If not encrypted, probably corrupted
+        isCorrupted: !isEncrypted, // If not encrypted, probably corrupted
       };
+    } finally {
+      if (pdf) pdfWorkerManager.destroyDocument(pdf);
     }
   }
 
   /**
    * Determine the best processing strategy based on file characteristics
    */
-  private static determineStrategy(fileSize: number, pageCount?: number): ProcessingStrategy {
+  private static determineStrategy(
+    fileSize: number,
+    pageCount?: number,
+  ): ProcessingStrategy {
     // Handle corrupted or encrypted files
     if (!pageCount || pageCount === 0) {
-      return 'metadata_only';
+      return "metadata_only";
     }
 
     // Small files with few pages - process everything immediately
-    if (fileSize <= this.SIZE_THRESHOLDS.SMALL && pageCount <= this.PAGE_THRESHOLDS.FEW) {
-      return 'immediate_full';
+    if (
+      fileSize <= this.SIZE_THRESHOLDS.SMALL &&
+      pageCount <= this.PAGE_THRESHOLDS.FEW
+    ) {
+      return "immediate_full";
     }
 
     // Medium files or many pages - priority pages first, then progressive
-    if (fileSize <= this.SIZE_THRESHOLDS.MEDIUM && pageCount <= this.PAGE_THRESHOLDS.MANY) {
-      return 'priority_pages';
+    if (
+      fileSize <= this.SIZE_THRESHOLDS.MEDIUM &&
+      pageCount <= this.PAGE_THRESHOLDS.MANY
+    ) {
+      return "priority_pages";
     }
 
     // Large files or massive page counts - chunked processing
-    if (fileSize <= this.SIZE_THRESHOLDS.LARGE && pageCount <= this.PAGE_THRESHOLDS.MASSIVE) {
-      return 'progressive_chunked';
+    if (
+      fileSize <= this.SIZE_THRESHOLDS.LARGE &&
+      pageCount <= this.PAGE_THRESHOLDS.MASSIVE
+    ) {
+      return "progressive_chunked";
     }
 
     // Very large files - metadata only
-    return 'metadata_only';
+    return "metadata_only";
   }
 
   /**
@@ -130,31 +198,31 @@ export class FileAnalyzer {
   private static estimateProcessingTime(
     _fileSize: number,
     pageCount: number = 0,
-    strategy: ProcessingStrategy
+    strategy: ProcessingStrategy,
   ): number {
     const baseTimes = {
-      immediate_full: 200,      // 200ms per page
-      priority_pages: 150,     // 150ms per page (optimized)
+      immediate_full: 200, // 200ms per page
+      priority_pages: 150, // 150ms per page (optimized)
       progressive_chunked: 100, // 100ms per page (chunked)
-      metadata_only: 50        // 50ms total
+      metadata_only: 50, // 50ms total
     };
 
     const baseTime = baseTimes[strategy];
 
     switch (strategy) {
-      case 'metadata_only':
+      case "metadata_only":
         return baseTime;
 
-      case 'immediate_full':
+      case "immediate_full":
         return pageCount * baseTime;
 
-      case 'priority_pages': {
+      case "priority_pages": {
         // Estimate time for priority pages (first 10)
         const priorityPages = Math.min(pageCount, 10);
         return priorityPages * baseTime;
       }
 
-      case 'progressive_chunked': {
+      case "progressive_chunked": {
         // Estimate time for first chunk (20 pages)
         const firstChunk = Math.min(pageCount, 20);
         return firstChunk * baseTime;
@@ -195,8 +263,11 @@ export class FileAnalyzer {
     const recommendations = {
       totalEstimatedTime,
       suggestedBatchSize: this.calculateBatchSize(files.length, totalSize),
-      shouldUseWebWorker: totalPages > 100 || totalSize > this.SIZE_THRESHOLDS.MEDIUM,
-      memoryWarning: totalSize > this.SIZE_THRESHOLDS.LARGE || totalPages > this.PAGE_THRESHOLDS.MASSIVE
+      shouldUseWebWorker:
+        totalPages > 100 || totalSize > this.SIZE_THRESHOLDS.MEDIUM,
+      memoryWarning:
+        totalSize > this.SIZE_THRESHOLDS.LARGE ||
+        totalPages > this.PAGE_THRESHOLDS.MASSIVE,
     };
 
     return { analyses, recommendations };
@@ -205,7 +276,10 @@ export class FileAnalyzer {
   /**
    * Calculate optimal batch size for processing multiple files
    */
-  private static calculateBatchSize(fileCount: number, totalSize: number): number {
+  private static calculateBatchSize(
+    fileCount: number,
+    totalSize: number,
+  ): number {
     // Process small batches for large total sizes
     if (totalSize > this.SIZE_THRESHOLDS.LARGE) {
       return Math.max(1, Math.floor(fileCount / 4));
@@ -223,7 +297,10 @@ export class FileAnalyzer {
    * Check if a file appears to be a valid PDF
    */
   static async isValidPDF(file: File): Promise<boolean> {
-    if (file.type !== 'application/pdf' && !file.name.toLowerCase().endsWith('.pdf')) {
+    if (
+      file.type !== "application/pdf" &&
+      !file.name.toLowerCase().endsWith(".pdf")
+    ) {
       return false;
     }
 
@@ -233,7 +310,7 @@ export class FileAnalyzer {
       const headerBytes = new Uint8Array(await header.arrayBuffer());
       const headerString = String.fromCharCode(...headerBytes);
 
-      return headerString.startsWith('%PDF-');
+      return headerString.startsWith("%PDF-");
     } catch {
       return false;
     }
diff --git a/frontend/src/core/services/fileDialogService.ts b/frontend/src/core/services/fileDialogService.ts
index 96cf402c9c..9dbcc79a53 100644
--- a/frontend/src/core/services/fileDialogService.ts
+++ b/frontend/src/core/services/fileDialogService.ts
@@ -21,7 +21,7 @@ export interface FileDialogOptions {
  * Desktop builds override this with actual Tauri implementation
  */
 export async function openFileDialog(
-  _options?: FileDialogOptions
+  _options?: FileDialogOptions,
 ): Promise<FileWithPath[]> {
   // Web build: no native file dialog support
   return [];
diff --git a/frontend/src/core/services/fileProcessingService.ts b/frontend/src/core/services/fileProcessingService.ts
index 261adb6c0f..2c8aba2b15 100644
--- a/frontend/src/core/services/fileProcessingService.ts
+++ b/frontend/src/core/services/fileProcessingService.ts
@@ -4,9 +4,9 @@
  * Called when files are added to FileContext, before any view sees them
  */
 
-import { generateThumbnailForFile } from '@app/utils/thumbnailUtils';
-import { pdfWorkerManager } from '@app/services/pdfWorkerManager';
-import { FileId } from '@app/types/file';
+import { generateThumbnailForFile } from "@app/utils/thumbnailUtils";
+import { pdfWorkerManager } from "@app/services/pdfWorkerManager";
+import { FileId } from "@app/types/file";
 
 export interface ProcessedFileMetadata {
   totalPages: number;
@@ -42,7 +42,9 @@ class FileProcessingService {
     // Check if we're already processing this file
     const existingOperation = this.processingCache.get(fileId);
     if (existingOperation) {
-      console.log(`� FileProcessingService: Using cached processing for ${file.name}`);
+      console.log(
+        `� FileProcessingService: Using cached processing for ${file.name}`,
+      );
       return existingOperation.promise;
     }
 
@@ -50,12 +52,16 @@ class FileProcessingService {
     const abortController = new AbortController();
 
     // Create processing promise
-    const processingPromise = this.performProcessing(file, fileId, abortController);
+    const processingPromise = this.performProcessing(
+      file,
+      fileId,
+      abortController,
+    );
 
     // Store operation with abort controller
     const operation: ProcessingOperation = {
       promise: processingPromise,
-      abortController
+      abortController,
     };
     this.processingCache.set(fileId, operation);
 
@@ -67,47 +73,58 @@ class FileProcessingService {
     return processingPromise;
   }
 
-  private async performProcessing(file: File, fileId: FileId, abortController: AbortController): Promise<FileProcessingResult> {
-    console.log(`� FileProcessingService: Starting processing for ${file.name} (${fileId})`);
+  private async performProcessing(
+    file: File,
+    fileId: FileId,
+    abortController: AbortController,
+  ): Promise<FileProcessingResult> {
+    console.log(
+      `� FileProcessingService: Starting processing for ${file.name} (${fileId})`,
+    );
 
     try {
       // Check for cancellation at start
       if (abortController.signal.aborted) {
-        throw new Error('Processing cancelled');
+        throw new Error("Processing cancelled");
       }
 
       let totalPages = 1;
       let thumbnailUrl: string | undefined;
 
       // Handle PDF files
-      if (file.type === 'application/pdf') {
+      if (file.type === "application/pdf") {
         // Read arrayBuffer once and reuse for both PDF.js and fallback
         const arrayBuffer = await file.arrayBuffer();
 
         // Check for cancellation after async operation
         if (abortController.signal.aborted) {
-          throw new Error('Processing cancelled');
+          throw new Error("Processing cancelled");
         }
 
         // Discover page count using PDF.js (most accurate)
         try {
           const pdfDoc = await pdfWorkerManager.createDocument(arrayBuffer, {
             disableAutoFetch: true,
-            disableStream: true
+            disableStream: true,
           });
 
           totalPages = pdfDoc.numPages;
-          console.log(`� FileProcessingService: PDF.js discovered ${totalPages} pages for ${file.name}`);
+          console.log(
+            `� FileProcessingService: PDF.js discovered ${totalPages} pages for ${file.name}`,
+          );
 
           // Clean up immediately
           pdfWorkerManager.destroyDocument(pdfDoc);
 
           // Check for cancellation after PDF.js processing
           if (abortController.signal.aborted) {
-            throw new Error('Processing cancelled');
+            throw new Error("Processing cancelled");
           }
         } catch (pdfError) {
-          console.warn(`� FileProcessingService: PDF.js failed for ${file.name}, setting pages to 0:`, pdfError);
+          console.warn(
+            `� FileProcessingService: PDF.js failed for ${file.name}, setting pages to 0:`,
+            pdfError,
+          );
           totalPages = 0; // Unknown page count - UI will hide page count display
         }
       }
@@ -115,14 +132,19 @@ class FileProcessingService {
       // Generate page 1 thumbnail
       try {
         thumbnailUrl = await generateThumbnailForFile(file);
-        console.log(`� FileProcessingService: Generated thumbnail for ${file.name}`);
+        console.log(
+          `� FileProcessingService: Generated thumbnail for ${file.name}`,
+        );
 
         // Check for cancellation after thumbnail generation
         if (abortController.signal.aborted) {
-          throw new Error('Processing cancelled');
+          throw new Error("Processing cancelled");
         }
       } catch (thumbError) {
-        console.warn(`� FileProcessingService: Thumbnail generation failed for ${file.name}:`, thumbError);
+        console.warn(
+          `� FileProcessingService: Thumbnail generation failed for ${file.name}:`,
+          thumbError,
+        );
       }
 
       // Create page structure
@@ -130,29 +152,34 @@ class FileProcessingService {
         pageNumber: index + 1,
         thumbnail: index === 0 ? thumbnailUrl : undefined, // Only page 1 gets thumbnail initially
         rotation: 0,
-        splitBefore: false
+        splitBefore: false,
       }));
 
       const metadata: ProcessedFileMetadata = {
         totalPages,
         pages,
         thumbnailUrl, // For FileEditor display
-        lastProcessed: Date.now()
+        lastProcessed: Date.now(),
       };
 
-      console.log(`� FileProcessingService: Processing complete for ${file.name} - ${totalPages} pages`);
+      console.log(
+        `� FileProcessingService: Processing complete for ${file.name} - ${totalPages} pages`,
+      );
 
       return {
         success: true,
-        metadata
+        metadata,
       };
-
     } catch (error) {
-      console.error(`� FileProcessingService: Processing failed for ${file.name}:`, error);
+      console.error(
+        `� FileProcessingService: Processing failed for ${file.name}:`,
+        error,
+      );
 
       return {
         success: false,
-        error: error instanceof Error ? error.message : 'Unknown processing error'
+        error:
+          error instanceof Error ? error.message : "Unknown processing error",
       };
     }
   }
@@ -178,7 +205,9 @@ class FileProcessingService {
     const operation = this.processingCache.get(fileId);
     if (operation) {
       operation.abortController.abort();
-      console.log(`� FileProcessingService: Cancelled processing for ${fileId}`);
+      console.log(
+        `� FileProcessingService: Cancelled processing for ${fileId}`,
+      );
       return true;
     }
     return false;
@@ -190,9 +219,13 @@ class FileProcessingService {
   cancelAllProcessing(): void {
     this.processingCache.forEach((operation, fileId) => {
       operation.abortController.abort();
-      console.log(`� FileProcessingService: Cancelled processing for ${fileId}`);
+      console.log(
+        `� FileProcessingService: Cancelled processing for ${fileId}`,
+      );
     });
-    console.log(`� FileProcessingService: Cancelled ${this.processingCache.size} processing operations`);
+    console.log(
+      `� FileProcessingService: Cancelled ${this.processingCache.size} processing operations`,
+    );
   }
 
   /**
diff --git a/frontend/src/core/services/fileStorage.ts b/frontend/src/core/services/fileStorage.ts
index e481452a8d..e3f59f866f 100644
--- a/frontend/src/core/services/fileStorage.ts
+++ b/frontend/src/core/services/fileStorage.ts
@@ -4,9 +4,16 @@
  * Forces correct usage patterns through service API design
  */
 
-import { FileId, BaseFileMetadata } from '@app/types/file';
-import { StirlingFile, StirlingFileStub, createStirlingFile } from '@app/types/fileContext';
-import { indexedDBManager, DATABASE_CONFIGS } from '@app/services/indexedDBManager';
+import { FileId, BaseFileMetadata } from "@app/types/file";
+import {
+  StirlingFile,
+  StirlingFileStub,
+  createStirlingFile,
+} from "@app/types/fileContext";
+import {
+  indexedDBManager,
+  DATABASE_CONFIGS,
+} from "@app/services/indexedDBManager";
 
 /**
  * Storage record - single source of truth
@@ -29,7 +36,7 @@ export interface StorageStats {
 
 class FileStorageService {
   private readonly dbConfig = DATABASE_CONFIGS.FILES;
-  private readonly storeName = 'files';
+  private readonly storeName = "files";
 
   /**
    * Get database connection using centralized manager
@@ -41,7 +48,10 @@ class FileStorageService {
   /**
    * Store a StirlingFile with its metadata from StirlingFileStub
    */
-  async storeStirlingFile(stirlingFile: StirlingFile, stub: StirlingFileStub): Promise<void> {
+  async storeStirlingFile(
+    stirlingFile: StirlingFile,
+    stub: StirlingFileStub,
+  ): Promise<void> {
     const db = await this.getDatabase();
     const arrayBuffer = await stirlingFile.arrayBuffer();
 
@@ -70,30 +80,32 @@ class FileStorageService {
       versionNumber: stub.versionNumber ?? 1,
       originalFileId: stub.originalFileId ?? stirlingFile.fileId,
       parentFileId: stub.parentFileId ?? undefined,
-      toolHistory: stub.toolHistory ?? []
+      toolHistory: stub.toolHistory ?? [],
     };
 
     return new Promise((resolve, reject) => {
       try {
         // Verify store exists before creating transaction
         if (!db.objectStoreNames.contains(this.storeName)) {
-          throw new Error(`Object store '${this.storeName}' not found. Available stores: ${Array.from(db.objectStoreNames).join(', ')}`);
+          throw new Error(
+            `Object store '${this.storeName}' not found. Available stores: ${Array.from(db.objectStoreNames).join(", ")}`,
+          );
         }
 
-        const transaction = db.transaction([this.storeName], 'readwrite');
+        const transaction = db.transaction([this.storeName], "readwrite");
         const store = transaction.objectStore(this.storeName);
 
         const request = store.add(record);
 
         request.onerror = () => {
-          console.error('IndexedDB add error:', request.error);
+          console.error("IndexedDB add error:", request.error);
           reject(request.error);
         };
         request.onsuccess = () => {
           resolve();
         };
       } catch (error) {
-        console.error('Transaction error:', error);
+        console.error("Transaction error:", error);
         reject(error);
       }
     });
@@ -106,7 +118,7 @@ class FileStorageService {
     const db = await this.getDatabase();
 
     return new Promise((resolve, reject) => {
-      const transaction = db.transaction([this.storeName], 'readonly');
+      const transaction = db.transaction([this.storeName], "readonly");
       const store = transaction.objectStore(this.storeName);
       const request = store.get(id);
 
@@ -122,7 +134,7 @@ class FileStorageService {
         const blob = new Blob([record.data], { type: record.type });
         const file = new File([blob], record.name, {
           type: record.type,
-          lastModified: record.lastModified
+          lastModified: record.lastModified,
         });
 
         // Convert to StirlingFile with preserved IDs
@@ -136,7 +148,9 @@ class FileStorageService {
    * Get multiple StirlingFiles - for batch loading
    */
   async getStirlingFiles(ids: FileId[]): Promise<StirlingFile[]> {
-    const results = await Promise.all(ids.map(id => this.getStirlingFile(id)));
+    const results = await Promise.all(
+      ids.map((id) => this.getStirlingFile(id)),
+    );
     return results.filter((file): file is StirlingFile => file !== null);
   }
 
@@ -147,7 +161,7 @@ class FileStorageService {
     const db = await this.getDatabase();
 
     return new Promise((resolve, reject) => {
-      const transaction = db.transaction([this.storeName], 'readonly');
+      const transaction = db.transaction([this.storeName], "readonly");
       const store = transaction.objectStore(this.storeName);
       const request = store.get(id);
 
@@ -181,7 +195,7 @@ class FileStorageService {
           originalFileId: record.originalFileId,
           parentFileId: record.parentFileId,
           toolHistory: record.toolHistory,
-          createdAt: record.createdAt || Date.now()
+          createdAt: record.createdAt || Date.now(),
         };
 
         resolve(stub);
@@ -196,7 +210,7 @@ class FileStorageService {
     const db = await this.getDatabase();
 
     return new Promise((resolve, reject) => {
-      const transaction = db.transaction([this.storeName], 'readonly');
+      const transaction = db.transaction([this.storeName], "readonly");
       const store = transaction.objectStore(this.storeName);
       const request = store.openCursor();
       const stubs: StirlingFileStub[] = [];
@@ -206,7 +220,7 @@ class FileStorageService {
         const cursor = (event.target as IDBRequest).result;
         if (cursor) {
           const record = cursor.value as StoredStirlingFileRecord;
-          if (record && record.name && typeof record.size === 'number') {
+          if (record && record.name && typeof record.size === "number") {
             // Extract metadata only - no file data
             stubs.push({
               id: record.id,
@@ -229,7 +243,7 @@ class FileStorageService {
               originalFileId: record.originalFileId || record.id,
               parentFileId: record.parentFileId,
               toolHistory: record.toolHistory || [],
-              createdAt: record.createdAt || Date.now()
+              createdAt: record.createdAt || Date.now(),
             });
           }
           cursor.continue();
@@ -243,7 +257,9 @@ class FileStorageService {
   /**
    * Get all history stubs for a given original file ID.
    */
-  async getHistoryChainStubs(originalFileId: FileId): Promise<StirlingFileStub[]> {
+  async getHistoryChainStubs(
+    originalFileId: FileId,
+  ): Promise<StirlingFileStub[]> {
     const stubs = await this.getAllStirlingFileStubs();
     return stubs
       .filter((stub) => (stub.originalFileId || stub.id) === originalFileId)
@@ -257,7 +273,7 @@ class FileStorageService {
     const db = await this.getDatabase();
 
     return new Promise((resolve, reject) => {
-      const transaction = db.transaction([this.storeName], 'readonly');
+      const transaction = db.transaction([this.storeName], "readonly");
       const store = transaction.objectStore(this.storeName);
       const request = store.openCursor();
       const leafStubs: StirlingFileStub[] = [];
@@ -268,7 +284,12 @@ class FileStorageService {
         if (cursor) {
           const record = cursor.value as StoredStirlingFileRecord;
           // Only include leaf files (default to true if undefined)
-          if (record && record.name && typeof record.size === 'number' && record.isLeaf !== false) {
+          if (
+            record &&
+            record.name &&
+            typeof record.size === "number" &&
+            record.isLeaf !== false
+          ) {
             leafStubs.push({
               id: record.id,
               name: record.name,
@@ -290,7 +311,7 @@ class FileStorageService {
               originalFileId: record.originalFileId || record.id,
               parentFileId: record.parentFileId,
               toolHistory: record.toolHistory || [],
-              createdAt: record.createdAt || Date.now()
+              createdAt: record.createdAt || Date.now(),
             });
           }
           cursor.continue();
@@ -308,7 +329,7 @@ class FileStorageService {
     const db = await this.getDatabase();
 
     return new Promise((resolve, reject) => {
-      const transaction = db.transaction([this.storeName], 'readwrite');
+      const transaction = db.transaction([this.storeName], "readwrite");
       const store = transaction.objectStore(this.storeName);
       const request = store.delete(id);
 
@@ -325,7 +346,7 @@ class FileStorageService {
 
     return new Promise((resolve, _reject) => {
       try {
-        const transaction = db.transaction([this.storeName], 'readwrite');
+        const transaction = db.transaction([this.storeName], "readwrite");
         const store = transaction.objectStore(this.storeName);
         const getRequest = store.get(id);
 
@@ -339,7 +360,7 @@ class FileStorageService {
               resolve(true);
             };
             updateRequest.onerror = () => {
-              console.error('Failed to update thumbnail:', updateRequest.error);
+              console.error("Failed to update thumbnail:", updateRequest.error);
               resolve(false);
             };
           } else {
@@ -348,11 +369,14 @@ class FileStorageService {
         };
 
         getRequest.onerror = () => {
-          console.error('Failed to get file for thumbnail update:', getRequest.error);
+          console.error(
+            "Failed to get file for thumbnail update:",
+            getRequest.error,
+          );
           resolve(false);
         };
       } catch (error) {
-        console.error('Transaction error during thumbnail update:', error);
+        console.error("Transaction error during thumbnail update:", error);
         resolve(false);
       }
     });
@@ -365,7 +389,7 @@ class FileStorageService {
     const db = await this.getDatabase();
 
     return new Promise((resolve, reject) => {
-      const transaction = db.transaction([this.storeName], 'readwrite');
+      const transaction = db.transaction([this.storeName], "readwrite");
       const store = transaction.objectStore(this.storeName);
       const request = store.clear();
 
@@ -385,7 +409,7 @@ class FileStorageService {
 
     try {
       // Get browser quota for context
-      if ('storage' in navigator && 'estimate' in navigator.storage) {
+      if ("storage" in navigator && "estimate" in navigator.storage) {
         const estimate = await navigator.storage.estimate();
         quota = estimate.quota;
         available = estimate.quota || 0;
@@ -400,9 +424,8 @@ class FileStorageService {
       if (quota) {
         available = quota - used;
       }
-
     } catch (error) {
-      console.warn('Could not get storage stats:', error);
+      console.warn("Could not get storage stats:", error);
       used = 0;
       fileCount = 0;
     }
@@ -411,7 +434,7 @@ class FileStorageService {
       used,
       available,
       fileCount,
-      quota
+      quota,
     };
   }
 
@@ -423,7 +446,7 @@ class FileStorageService {
       const db = await this.getDatabase();
 
       return new Promise((resolve, reject) => {
-        const transaction = db.transaction([this.storeName], 'readonly');
+        const transaction = db.transaction([this.storeName], "readonly");
         const store = transaction.objectStore(this.storeName);
         const request = store.get(id);
 
@@ -452,14 +475,16 @@ class FileStorageService {
   async markFileAsProcessed(fileId: FileId): Promise<boolean> {
     try {
       const db = await this.getDatabase();
-      const transaction = db.transaction([this.storeName], 'readwrite');
+      const transaction = db.transaction([this.storeName], "readwrite");
       const store = transaction.objectStore(this.storeName);
 
-      const record = await new Promise<StoredStirlingFileRecord | undefined>((resolve, reject) => {
-        const request = store.get(fileId);
-        request.onsuccess = () => resolve(request.result);
-        request.onerror = () => reject(request.error);
-      });
+      const record = await new Promise<StoredStirlingFileRecord | undefined>(
+        (resolve, reject) => {
+          const request = store.get(fileId);
+          request.onsuccess = () => resolve(request.result);
+          request.onerror = () => reject(request.error);
+        },
+      );
 
       if (!record) {
         return false; // File not found
@@ -476,7 +501,7 @@ class FileStorageService {
 
       return true;
     } catch (error) {
-      console.error('Failed to mark file as processed:', error);
+      console.error("Failed to mark file as processed:", error);
       return false;
     }
   }
@@ -488,14 +513,16 @@ class FileStorageService {
   async markFileAsLeaf(fileId: FileId): Promise<boolean> {
     try {
       const db = await this.getDatabase();
-      const transaction = db.transaction([this.storeName], 'readwrite');
+      const transaction = db.transaction([this.storeName], "readwrite");
       const store = transaction.objectStore(this.storeName);
 
-      const record = await new Promise<StoredStirlingFileRecord | undefined>((resolve, reject) => {
-        const request = store.get(fileId);
-        request.onsuccess = () => resolve(request.result);
-        request.onerror = () => reject(request.error);
-      });
+      const record = await new Promise<StoredStirlingFileRecord | undefined>(
+        (resolve, reject) => {
+          const request = store.get(fileId);
+          request.onsuccess = () => resolve(request.result);
+          request.onerror = () => reject(request.error);
+        },
+      );
 
       if (!record) {
         return false; // File not found
@@ -512,7 +539,7 @@ class FileStorageService {
 
       return true;
     } catch (error) {
-      console.error('Failed to mark file as leaf:', error);
+      console.error("Failed to mark file as leaf:", error);
       return false;
     }
   }
@@ -520,16 +547,22 @@ class FileStorageService {
   /**
    * Update metadata fields for a stored file record.
    */
-  async updateFileMetadata(fileId: FileId, updates: Partial<StoredStirlingFileRecord>): Promise<boolean> {
+  async updateFileMetadata(
+    fileId: FileId,
+    updates: Partial<StoredStirlingFileRecord>,
+  ): Promise<boolean> {
     try {
       const db = await this.getDatabase();
-      const transaction = db.transaction([this.storeName], 'readwrite');
+      const transaction = db.transaction([this.storeName], "readwrite");
       const store = transaction.objectStore(this.storeName);
-      const record = await new Promise<StoredStirlingFileRecord | undefined>((resolve, reject) => {
-        const request = store.get(fileId);
-        request.onerror = () => reject(request.error);
-        request.onsuccess = () => resolve(request.result as StoredStirlingFileRecord | undefined);
-      });
+      const record = await new Promise<StoredStirlingFileRecord | undefined>(
+        (resolve, reject) => {
+          const request = store.get(fileId);
+          request.onerror = () => reject(request.error);
+          request.onsuccess = () =>
+            resolve(request.result as StoredStirlingFileRecord | undefined);
+        },
+      );
 
       if (!record) {
         return false;
@@ -544,7 +577,7 @@ class FileStorageService {
 
       return true;
     } catch (error) {
-      console.error('Failed to update file metadata:', error);
+      console.error("Failed to update file metadata:", error);
       return false;
     }
   }
diff --git a/frontend/src/core/services/fileStubHelpers.ts b/frontend/src/core/services/fileStubHelpers.ts
index b3304aba63..60489c8c94 100644
--- a/frontend/src/core/services/fileStubHelpers.ts
+++ b/frontend/src/core/services/fileStubHelpers.ts
@@ -1,7 +1,10 @@
-import { StirlingFile, StirlingFileStub } from '@app/types/fileContext';
-import { createChildStub, generateProcessedFileMetadata } from '@app/contexts/file/fileActions';
-import { createStirlingFile } from '@app/types/fileContext';
-import { ToolId } from '@app/types/toolId';
+import { StirlingFile, StirlingFileStub } from "@app/types/fileContext";
+import {
+  createChildStub,
+  generateProcessedFileMetadata,
+} from "@app/contexts/file/fileActions";
+import { createStirlingFile } from "@app/types/fileContext";
+import { ToolId } from "@app/types/toolId";
 
 /**
  * Create StirlingFiles and StirlingFileStubs from exported files
@@ -10,8 +13,8 @@ import { ToolId } from '@app/types/toolId';
 export async function createStirlingFilesAndStubs(
   files: File[],
   parentStub: StirlingFileStub,
-  toolId: ToolId
-): Promise<{ stirlingFiles: StirlingFile[], stubs: StirlingFileStub[] }> {
+  toolId: ToolId,
+): Promise<{ stirlingFiles: StirlingFile[]; stubs: StirlingFileStub[] }> {
   const stirlingFiles: StirlingFile[] = [];
   const stubs: StirlingFileStub[] = [];
 
@@ -22,7 +25,7 @@ export async function createStirlingFilesAndStubs(
       { toolId, timestamp: Date.now() },
       file,
       processedFileMetadata?.thumbnailUrl,
-      processedFileMetadata
+      processedFileMetadata,
     );
 
     const stirlingFile = createStirlingFile(file, childStub.id);
diff --git a/frontend/src/core/services/googleDrivePickerService.ts b/frontend/src/core/services/googleDrivePickerService.ts
index 1ef0bf8bba..c4545d5490 100644
--- a/frontend/src/core/services/googleDrivePickerService.ts
+++ b/frontend/src/core/services/googleDrivePickerService.ts
@@ -3,10 +3,10 @@
  * Handles Google Drive file picker integration
  */
 
-import { loadScript } from '@app/utils/scriptLoader';
+import { loadScript } from "@app/utils/scriptLoader";
 
-const SCOPES = 'https://www.googleapis.com/auth/drive.readonly';
-const SESSION_STORAGE_ID = 'googleDrivePickerAccessToken';
+const SCOPES = "https://www.googleapis.com/auth/drive.readonly";
+const SESSION_STORAGE_ID = "googleDrivePickerAccessToken";
 
 interface GoogleDriveConfig {
   clientId: string;
@@ -28,20 +28,20 @@ interface PickerOptions {
 
 // Expandable mime types for Google Picker
 const expandableMimeTypes: Record<string, string[]> = {
-  'image/*': ['image/jpeg', 'image/png', 'image/svg+xml'],
+  "image/*": ["image/jpeg", "image/png", "image/svg+xml"],
 };
 
 /**
  * Convert file input accept attribute to Google Picker mime types
  */
 function fileInputToGooglePickerMimeTypes(accept?: string): string | null {
-  if (!accept || accept === '' || accept.includes('*/*')) {
+  if (!accept || accept === "" || accept.includes("*/*")) {
     // Setting null will accept all supported mimetypes
     return null;
   }
 
   const mimeTypes: string[] = [];
-  accept.split(',').forEach((part) => {
+  accept.split(",").forEach((part) => {
     const trimmedPart = part.trim();
     if (!(trimmedPart in expandableMimeTypes)) {
       mimeTypes.push(trimmedPart);
@@ -53,7 +53,7 @@ function fileInputToGooglePickerMimeTypes(accept?: string): string | null {
     });
   });
 
-  return mimeTypes.join(',').replace(/\s+/g, '');
+  return mimeTypes.join(",").replace(/\s+/g, "");
 }
 
 class GoogleDrivePickerService {
@@ -74,10 +74,7 @@ class GoogleDrivePickerService {
     this.config = config;
 
     // Load Google APIs
-    await Promise.all([
-      this.loadGapi(),
-      this.loadGis(),
-    ]);
+    await Promise.all([this.loadGapi(), this.loadGis()]);
   }
 
   /**
@@ -87,13 +84,15 @@ class GoogleDrivePickerService {
     if (this.gapiLoaded) return;
 
     await loadScript({
-      src: 'https://apis.google.com/js/api.js',
-      id: 'gapi-script',
+      src: "https://apis.google.com/js/api.js",
+      id: "gapi-script",
     });
 
     return new Promise((resolve) => {
-      window.gapi.load('client:picker', async () => {
-        await window.gapi.client.load('https://www.googleapis.com/discovery/v1/apis/drive/v3/rest');
+      window.gapi.load("client:picker", async () => {
+        await window.gapi.client.load(
+          "https://www.googleapis.com/discovery/v1/apis/drive/v3/rest",
+        );
         this.gapiLoaded = true;
         resolve();
       });
@@ -107,12 +106,12 @@ class GoogleDrivePickerService {
     if (this.gisLoaded) return;
 
     await loadScript({
-      src: 'https://accounts.google.com/gsi/client',
-      id: 'gis-script',
+      src: "https://accounts.google.com/gsi/client",
+      id: "gis-script",
     });
 
     if (!this.config) {
-      throw new Error('Google Drive config not initialized');
+      throw new Error("Google Drive config not initialized");
     }
 
     this.tokenClient = window.google.accounts.oauth2.initTokenClient({
@@ -129,7 +128,7 @@ class GoogleDrivePickerService {
    */
   async openPicker(options: PickerOptions = {}): Promise<File[]> {
     if (!this.config) {
-      throw new Error('Google Drive service not initialized');
+      throw new Error("Google Drive service not initialized");
     }
 
     // Request access token
@@ -145,7 +144,7 @@ class GoogleDrivePickerService {
   private requestAccessToken(): Promise<void> {
     return new Promise((resolve, reject) => {
       if (!this.tokenClient) {
-        reject(new Error('Token client not initialized'));
+        reject(new Error("Token client not initialized"));
         return;
       }
 
@@ -154,7 +153,7 @@ class GoogleDrivePickerService {
           reject(new Error(response.error));
           return;
         }
-        if(response.access_token == null){
+        if (response.access_token == null) {
           reject(new Error("No acces token in response"));
         }
 
@@ -164,7 +163,7 @@ class GoogleDrivePickerService {
       };
 
       this.tokenClient.requestAccessToken({
-        prompt: this.accessToken === null ? 'consent' : '',
+        prompt: this.accessToken === null ? "consent" : "",
       });
     });
   }
@@ -175,11 +174,13 @@ class GoogleDrivePickerService {
   private createPicker(options: PickerOptions): Promise<File[]> {
     return new Promise((resolve, reject) => {
       if (!this.config || !this.accessToken) {
-        reject(new Error('Not initialized or no access token'));
+        reject(new Error("Not initialized or no access token"));
         return;
       }
 
-      const mimeTypes = fileInputToGooglePickerMimeTypes(options.mimeTypes || undefined);
+      const mimeTypes = fileInputToGooglePickerMimeTypes(
+        options.mimeTypes || undefined,
+      );
 
       const view1 = new window.google.picker.DocsView().setIncludeFolders(true);
       if (mimeTypes !== null) {
@@ -216,34 +217,44 @@ class GoogleDrivePickerService {
   private async pickerCallback(
     data: any,
     resolve: (files: File[]) => void,
-    reject: (error: Error) => void
+    reject: (error: Error) => void,
   ): Promise<void> {
     if (data.action === window.google.picker.Action.PICKED) {
       try {
         const files = await Promise.all(
-          data[window.google.picker.Response.DOCUMENTS].map(async (pickedFile: any) => {
-            const fileId = pickedFile[window.google.picker.Document.ID];
-            const res = await window.gapi.client.drive.files.get({
-              fileId: fileId,
-              alt: 'media',
-            });
+          data[window.google.picker.Response.DOCUMENTS].map(
+            async (pickedFile: any) => {
+              const fileId = pickedFile[window.google.picker.Document.ID];
+              const res = await window.gapi.client.drive.files.get({
+                fileId: fileId,
+                alt: "media",
+              });
 
-            // Convert response body to File object
-            const file = new File(
-              [new Uint8Array(res.body.length).map((_: any, i: number) => res.body.charCodeAt(i))],
-              pickedFile.name,
-              {
-                type: pickedFile.mimeType,
-                lastModified: pickedFile.lastModified,
-              }
-            );
-            return file;
-          })
+              // Convert response body to File object
+              const file = new File(
+                [
+                  new Uint8Array(res.body.length).map((_: any, i: number) =>
+                    res.body.charCodeAt(i),
+                  ),
+                ],
+                pickedFile.name,
+                {
+                  type: pickedFile.mimeType,
+                  lastModified: pickedFile.lastModified,
+                },
+              );
+              return file;
+            },
+          ),
         );
 
         resolve(files);
       } catch (error) {
-        reject(error instanceof Error ? error : new Error('Failed to download files'));
+        reject(
+          error instanceof Error
+            ? error
+            : new Error("Failed to download files"),
+        );
       }
     } else if (data.action === window.google.picker.Action.CANCEL) {
       resolve([]); // User cancelled, return empty array
@@ -279,14 +290,20 @@ export function getGoogleDrivePickerService(): GoogleDrivePickerService {
  * Check if Google Drive credentials are configured
  * Supports both backend settings and environment variables
  */
-export function isGoogleDriveConfigured(backendConfig?: BackendGoogleDriveConfig): boolean {
+export function isGoogleDriveConfigured(
+  backendConfig?: BackendGoogleDriveConfig,
+): boolean {
   // If backend config is provided, use it exclusively (don't fall back to env vars)
   if (backendConfig) {
     if (backendConfig.enabled === false) {
       return false; // Admin explicitly disabled it
     }
     if (backendConfig.enabled) {
-      return !!(backendConfig.clientId && backendConfig.apiKey && backendConfig.appId);
+      return !!(
+        backendConfig.clientId &&
+        backendConfig.apiKey &&
+        backendConfig.appId
+      );
     }
     return false; // No backend config provided
   }
@@ -303,13 +320,20 @@ export function isGoogleDriveConfigured(backendConfig?: BackendGoogleDriveConfig
  * Get Google Drive configuration from backend settings or environment variables
  * Backend settings take priority over environment variables
  */
-export function getGoogleDriveConfig(backendConfig?: BackendGoogleDriveConfig): GoogleDriveConfig | null {
+export function getGoogleDriveConfig(
+  backendConfig?: BackendGoogleDriveConfig,
+): GoogleDriveConfig | null {
   // If backend config is provided, use it exclusively (don't fall back to env vars)
   if (backendConfig) {
     if (backendConfig.enabled === false) {
       return null; // Admin explicitly disabled it
     }
-    if (backendConfig.enabled && backendConfig.clientId && backendConfig.apiKey && backendConfig.appId) {
+    if (
+      backendConfig.enabled &&
+      backendConfig.clientId &&
+      backendConfig.apiKey &&
+      backendConfig.appId
+    ) {
       return {
         clientId: backendConfig.clientId,
         apiKey: backendConfig.apiKey,
@@ -339,7 +363,9 @@ export function getGoogleDriveConfig(backendConfig?: BackendGoogleDriveConfig):
  * Extract Google Drive backend config from AppConfig object
  * Eliminates duplicated config construction pattern
  */
-export function extractGoogleDriveBackendConfig(appConfig: any): BackendGoogleDriveConfig {
+export function extractGoogleDriveBackendConfig(
+  appConfig: any,
+): BackendGoogleDriveConfig {
   return {
     enabled: appConfig?.googleDriveEnabled,
     clientId: appConfig?.googleDriveClientId,
diff --git a/frontend/src/core/services/httpErrorHandler.ts b/frontend/src/core/services/httpErrorHandler.ts
index 68ca06ae14..1bf2353dfb 100644
--- a/frontend/src/core/services/httpErrorHandler.ts
+++ b/frontend/src/core/services/httpErrorHandler.ts
@@ -1,9 +1,16 @@
 // frontend/src/services/httpErrorHandler.ts
-import { alert } from '@app/components/toast';
-import { broadcastErroredFiles, extractErrorFileIds, normalizeAxiosErrorData } from '@app/services/errorUtils';
-import { showSpecialErrorToast } from '@app/services/specialErrorToasts';
-import { handleSaaSError } from '@app/services/saasErrorInterceptor';
-import { clampText, extractAxiosErrorMessage } from '@app/services/httpErrorUtils';
+import { alert } from "@app/components/toast";
+import {
+  broadcastErroredFiles,
+  extractErrorFileIds,
+  normalizeAxiosErrorData,
+} from "@app/services/errorUtils";
+import { showSpecialErrorToast } from "@app/services/specialErrorToasts";
+import { handleSaaSError } from "@app/services/saasErrorInterceptor";
+import {
+  clampText,
+  extractAxiosErrorMessage,
+} from "@app/services/httpErrorUtils";
 
 // Module-scoped state to reduce global variable usage
 const recentSpecialByEndpoint: Record<string, number> = {};
@@ -26,30 +33,31 @@ export async function handleHttpError(error: any): Promise<boolean> {
     const pathname = window.location.pathname;
 
     // Check if we're already on an auth page
-    const isAuthPage = pathname.includes('/login') ||
-                      pathname.includes('/signup') ||
-                      pathname.includes('/auth/') ||
-                      pathname.includes('/invite/');
+    const isAuthPage =
+      pathname.includes("/login") ||
+      pathname.includes("/signup") ||
+      pathname.includes("/auth/") ||
+      pathname.includes("/invite/");
 
     // If not on auth page, redirect to login with expired session message
     if (!isAuthPage && !skipAuthRedirect) {
-      console.debug('[httpErrorHandler] 401 detected, redirecting to login');
+      console.debug("[httpErrorHandler] 401 detected, redirecting to login");
       // Store the current location so we can redirect back after login
       const currentLocation = window.location.pathname + window.location.search;
       // Redirect to login with state (only show expired when a JWT existed)
       let hadStoredJwt = false;
       try {
-        hadStoredJwt = Boolean(localStorage.getItem('stirling_jwt'));
+        hadStoredJwt = Boolean(localStorage.getItem("stirling_jwt"));
       } catch {
         // ignore storage access failures
       }
-      const expiredPrefix = hadStoredJwt ? 'expired=true&' : '';
+      const expiredPrefix = hadStoredJwt ? "expired=true&" : "";
       window.location.href = `/login?${expiredPrefix}from=${encodeURIComponent(currentLocation)}`;
       return true; // Suppress toast since we're redirecting
     }
 
     // On auth pages, suppress the toast (user is already trying to authenticate)
-    console.debug('[httpErrorHandler] Suppressing 401 on auth page:', pathname);
+    console.debug("[httpErrorHandler] Suppressing 401 on auth page:", pathname);
     return true;
   }
 
@@ -59,9 +67,13 @@ export async function handleHttpError(error: any): Promise<boolean> {
   const { title, body } = extractAxiosErrorMessage(error);
 
   // Normalize response data ONCE, reuse for both ID extraction and special-toast matching
-  const raw = (error?.response?.data) as any;
+  const raw = error?.response?.data as any;
   let normalized: unknown = raw;
-  try { normalized = await normalizeAxiosErrorData(raw); } catch (e) { console.debug('normalizeAxiosErrorData', e); }
+  try {
+    normalized = await normalizeAxiosErrorData(raw);
+  } catch (e) {
+    console.debug("normalizeAxiosErrorData", e);
+  }
 
   // 1) If server sends structured file IDs for failures, also mark them errored in UI
   try {
@@ -70,7 +82,7 @@ export async function handleHttpError(error: any): Promise<boolean> {
       broadcastErroredFiles(ids);
     }
   } catch (e) {
-    console.debug('extractErrorFileIds', e);
+    console.debug("extractErrorFileIds", e);
   }
 
   // 2) Generic-vs-special dedupe by endpoint
@@ -96,17 +108,21 @@ export async function handleHttpError(error: any): Promise<boolean> {
   let rawString: string | undefined;
   try {
     rawString =
-      typeof normalized === 'string'
-        ? normalized
-        : JSON.stringify(normalized);
+      typeof normalized === "string" ? normalized : JSON.stringify(normalized);
   } catch (e) {
-    console.debug('extractErrorFileIds', e);
+    console.debug("extractErrorFileIds", e);
   }
 
   const handled = showSpecialErrorToast(rawString, { status });
   if (!handled) {
     const displayBody = clampText(body);
-    alert({ alertType: 'error', title, body: displayBody, expandable: true, isPersistentPopup: false });
+    alert({
+      alertType: "error",
+      title,
+      body: displayBody,
+      expandable: true,
+      isPersistentPopup: false,
+    });
   }
 
   return false; // Error was handled with toast, continue normal rejection
diff --git a/frontend/src/core/services/httpErrorUtils.ts b/frontend/src/core/services/httpErrorUtils.ts
index 4f54aff70a..b3b54e2664 100644
--- a/frontend/src/core/services/httpErrorUtils.ts
+++ b/frontend/src/core/services/httpErrorUtils.ts
@@ -1,6 +1,6 @@
-import axios from 'axios';
+import axios from "axios";
 
-const FRIENDLY_FALLBACK = 'There was an error processing your request.';
+const FRIENDLY_FALLBACK = "There was an error processing your request.";
 const MAX_TOAST_BODY_CHARS = 400; // avoid massive, unreadable toasts
 
 export function clampText(s: string, max = MAX_TOAST_BODY_CHARS): string {
@@ -8,10 +8,10 @@ export function clampText(s: string, max = MAX_TOAST_BODY_CHARS): string {
 }
 
 function isUnhelpfulMessage(msg: string | null | undefined): boolean {
-  const s = (msg || '').trim();
+  const s = (msg || "").trim();
   if (!s) return true;
   // Common unhelpful payloads we see
-  if (s === '{}' || s === '[]') return true;
+  if (s === "{}" || s === "[]") return true;
   if (/^request failed/i.test(s)) return true;
   if (/^network error/i.test(s)) return true;
   if (/^[45]\d\d\b/.test(s)) return true; // "500 Server Error" etc.
@@ -19,46 +19,62 @@ function isUnhelpfulMessage(msg: string | null | undefined): boolean {
 }
 
 function titleForStatus(status?: number): string {
-  if (!status) return 'Network error';
-  if (status >= 500) return 'Server error';
-  if (status >= 400) return 'Request error';
-  return 'Request failed';
+  if (!status) return "Network error";
+  if (status >= 500) return "Server error";
+  if (status >= 400) return "Request error";
+  return "Request failed";
 }
 
-export function extractAxiosErrorMessage(error: any): { title: string; body: string } {
+export function extractAxiosErrorMessage(error: any): {
+  title: string;
+  body: string;
+} {
   if (axios.isAxiosError(error)) {
     const status = error.response?.status;
-    const _statusText = error.response?.statusText || '';
+    const _statusText = error.response?.statusText || "";
     let parsed: any = undefined;
     const raw = error.response?.data;
-    if (typeof raw === 'string') {
-      try { parsed = JSON.parse(raw); } catch { /* keep as string */ }
+    if (typeof raw === "string") {
+      try {
+        parsed = JSON.parse(raw);
+      } catch {
+        /* keep as string */
+      }
     } else {
       parsed = raw;
     }
     const extractIds = (): string[] | undefined => {
-      if (Array.isArray(parsed?.errorFileIds)) return parsed.errorFileIds as string[];
-      const rawText = typeof raw === 'string' ? raw : '';
-      const uuidMatches = rawText.match(/[0-9a-fA-F]{8}-[0-9a-fA-F]{4}-[0-9a-fA-F]{4}-[0-9a-fA-F]{4}-[0-9a-fA-F]{12}/g);
-      return uuidMatches && uuidMatches.length > 0 ? Array.from(new Set(uuidMatches)) : undefined;
+      if (Array.isArray(parsed?.errorFileIds))
+        return parsed.errorFileIds as string[];
+      const rawText = typeof raw === "string" ? raw : "";
+      const uuidMatches = rawText.match(
+        /[0-9a-fA-F]{8}-[0-9a-fA-F]{4}-[0-9a-fA-F]{4}-[0-9a-fA-F]{4}-[0-9a-fA-F]{12}/g,
+      );
+      return uuidMatches && uuidMatches.length > 0
+        ? Array.from(new Set(uuidMatches))
+        : undefined;
     };
 
     const body = ((): string => {
       const data = parsed;
-      if (!data) return typeof raw === 'string' ? raw : '';
+      if (!data) return typeof raw === "string" ? raw : "";
       const ids = extractIds();
-      if (ids && ids.length > 0) return `Failed files: ${ids.join(', ')}`;
+      if (ids && ids.length > 0) return `Failed files: ${ids.join(", ")}`;
       if (data?.message) return data.message as string;
-      if (typeof raw === 'string') return raw;
-      try { return JSON.stringify(data); } catch { return ''; }
+      if (typeof raw === "string") return raw;
+      try {
+        return JSON.stringify(data);
+      } catch {
+        return "";
+      }
     })();
     const ids = extractIds();
     const title = titleForStatus(status);
     if (ids && ids.length > 0) {
-      return { title, body: 'Process failed due to invalid/corrupted file(s)' };
+      return { title, body: "Process failed due to invalid/corrupted file(s)" };
     }
     if (status === 422) {
-      const fallbackMsg = 'Process failed due to invalid/corrupted file(s)';
+      const fallbackMsg = "Process failed due to invalid/corrupted file(s)";
       const bodyMsg = isUnhelpfulMessage(body) ? fallbackMsg : body;
       return { title, body: bodyMsg };
     }
@@ -67,10 +83,13 @@ export function extractAxiosErrorMessage(error: any): { title: string; body: str
   }
   try {
     const msg = (error?.message || String(error)) as string;
-    return { title: 'Network error', body: isUnhelpfulMessage(msg) ? FRIENDLY_FALLBACK : msg };
+    return {
+      title: "Network error",
+      body: isUnhelpfulMessage(msg) ? FRIENDLY_FALLBACK : msg,
+    };
   } catch (e) {
     // ignore extraction errors
-    console.debug('extractAxiosErrorMessage', e);
-    return { title: 'Network error', body: FRIENDLY_FALLBACK };
+    console.debug("extractAxiosErrorMessage", e);
+    return { title: "Network error", body: FRIENDLY_FALLBACK };
   }
 }
diff --git a/frontend/src/core/services/indexedDBManager.ts b/frontend/src/core/services/indexedDBManager.ts
index d889245182..6aaa257af1 100644
--- a/frontend/src/core/services/indexedDBManager.ts
+++ b/frontend/src/core/services/indexedDBManager.ts
@@ -89,10 +89,12 @@ class IndexedDBManager {
         const oldVersion = event.oldVersion;
         const transaction = request.transaction;
 
-        console.log(`Upgrading ${config.name} from v${oldVersion} to v${config.version}`);
+        console.log(
+          `Upgrading ${config.name} from v${oldVersion} to v${config.version}`,
+        );
 
         // Create or update object stores
-        config.stores.forEach(storeConfig => {
+        config.stores.forEach((storeConfig) => {
           let store: IDBObjectStore | undefined;
 
           if (db.objectStoreNames.contains(storeConfig.name)) {
@@ -102,14 +104,14 @@ class IndexedDBManager {
 
             // Add new indexes if they don't exist
             if (storeConfig.indexes && store) {
-              storeConfig.indexes.forEach(indexConfig => {
+              storeConfig.indexes.forEach((indexConfig) => {
                 if (!store?.indexNames.contains(indexConfig.name)) {
-                  store?.createIndex(
-                    indexConfig.name,
-                    indexConfig.keyPath,
-                    { unique: indexConfig.unique }
+                  store?.createIndex(indexConfig.name, indexConfig.keyPath, {
+                    unique: indexConfig.unique,
+                  });
+                  console.log(
+                    `Created index '${indexConfig.name}' on '${storeConfig.name}'`,
                   );
-                  console.log(`Created index '${indexConfig.name}' on '${storeConfig.name}'`);
                 }
               });
             }
@@ -128,19 +130,23 @@ class IndexedDBManager {
 
             // Create indexes
             if (storeConfig.indexes) {
-              storeConfig.indexes.forEach(indexConfig => {
-                store?.createIndex(
-                  indexConfig.name,
-                  indexConfig.keyPath,
-                  { unique: indexConfig.unique }
+              storeConfig.indexes.forEach((indexConfig) => {
+                store?.createIndex(indexConfig.name, indexConfig.keyPath, {
+                  unique: indexConfig.unique,
+                });
+                console.log(
+                  `Created index '${indexConfig.name}' on '${storeConfig.name}'`,
                 );
-                console.log(`Created index '${indexConfig.name}' on '${storeConfig.name}'`);
               });
             }
           }
 
           // Perform data migration for files database
-          if (config.name === 'stirling-pdf-files' && storeConfig.name === 'files' && store) {
+          if (
+            config.name === "stirling-pdf-files" &&
+            storeConfig.name === "files" &&
+            store
+          ) {
             this.migrateFileHistoryFields(store, oldVersion);
           }
         });
@@ -151,13 +157,16 @@ class IndexedDBManager {
   /**
    * Migrate existing file records to include new file history fields
    */
-  private migrateFileHistoryFields(store: IDBObjectStore, oldVersion: number): void {
+  private migrateFileHistoryFields(
+    store: IDBObjectStore,
+    oldVersion: number,
+  ): void {
     // Only migrate if upgrading from a version before file history was added (version < 3)
     if (oldVersion >= 3) {
       return;
     }
 
-    console.log('Starting file history migration for existing records...');
+    console.log("Starting file history migration for existing records...");
 
     const cursor = store.openCursor();
     let migratedCount = 0;
@@ -200,19 +209,24 @@ class IndexedDBManager {
             cursor.update(record);
             migratedCount++;
           } catch (error) {
-            console.error('Failed to migrate record:', record.id, error);
+            console.error("Failed to migrate record:", record.id, error);
           }
         }
 
         cursor.continue();
       } else {
         // Migration complete
-        console.log(`File history migration completed. Migrated ${migratedCount} records.`);
+        console.log(
+          `File history migration completed. Migrated ${migratedCount} records.`,
+        );
       }
     };
 
     cursor.onerror = (event) => {
-      console.error('File history migration failed:', (event.target as IDBRequest).error);
+      console.error(
+        "File history migration failed:",
+        (event.target as IDBRequest).error,
+      );
     };
   }
 
@@ -290,39 +304,44 @@ class IndexedDBManager {
 // Pre-defined database configurations
 export const DATABASE_CONFIGS = {
   FILES: {
-    name: 'stirling-pdf-files',
+    name: "stirling-pdf-files",
     version: 3,
-    stores: [{
-      name: 'files',
-      keyPath: 'id',
-      indexes: [
-        { name: 'name', keyPath: 'name', unique: false },
-        { name: 'lastModified', keyPath: 'lastModified', unique: false },
-        { name: 'originalFileId', keyPath: 'originalFileId', unique: false },
-        { name: 'parentFileId', keyPath: 'parentFileId', unique: false },
-        { name: 'versionNumber', keyPath: 'versionNumber', unique: false }
-      ]
-    }]
+    stores: [
+      {
+        name: "files",
+        keyPath: "id",
+        indexes: [
+          { name: "name", keyPath: "name", unique: false },
+          { name: "lastModified", keyPath: "lastModified", unique: false },
+          { name: "originalFileId", keyPath: "originalFileId", unique: false },
+          { name: "parentFileId", keyPath: "parentFileId", unique: false },
+          { name: "versionNumber", keyPath: "versionNumber", unique: false },
+        ],
+      },
+    ],
   } as DatabaseConfig,
 
   DRAFTS: {
-    name: 'stirling-pdf-drafts',
+    name: "stirling-pdf-drafts",
     version: 1,
-    stores: [{
-      name: 'drafts',
-      keyPath: 'id'
-    }]
+    stores: [
+      {
+        name: "drafts",
+        keyPath: "id",
+      },
+    ],
   } as DatabaseConfig,
 
   PREFERENCES: {
-    name: 'stirling-pdf-preferences',
+    name: "stirling-pdf-preferences",
     version: 1,
-    stores: [{
-      name: 'preferences',
-      keyPath: 'key'
-    }]
+    stores: [
+      {
+        name: "preferences",
+        keyPath: "key",
+      },
+    ],
   } as DatabaseConfig,
-
 } as const;
 
 export const indexedDBManager = IndexedDBManager.getInstance();
diff --git a/frontend/src/core/services/localFileSaveService.ts b/frontend/src/core/services/localFileSaveService.ts
index 8717c7bf64..1bc3cb9372 100644
--- a/frontend/src/core/services/localFileSaveService.ts
+++ b/frontend/src/core/services/localFileSaveService.ts
@@ -20,7 +20,7 @@ export interface MultiFileSaveResult {
  */
 export async function saveToLocalPath(
   _data: Blob | File,
-  _filePath: string
+  _filePath: string,
 ): Promise<SaveResult> {
   return { success: false, error: "Local file save not available in web mode" };
 }
@@ -31,7 +31,7 @@ export async function saveToLocalPath(
  */
 export async function showSaveDialog(
   _defaultFilename: string,
-  _defaultDirectory?: string
+  _defaultDirectory?: string,
 ): Promise<string | null> {
   return null;
 }
@@ -42,7 +42,11 @@ export async function showSaveDialog(
  */
 export async function saveMultipleFilesWithPrompt(
   _files: (Blob | File)[],
-  _defaultDirectory?: string
+  _defaultDirectory?: string,
 ): Promise<MultiFileSaveResult> {
-  return { success: false, savedCount: 0, error: "Multi-file save not available in web mode" };
+  return {
+    success: false,
+    savedCount: 0,
+    error: "Multi-file save not available in web mode",
+  };
 }
diff --git a/frontend/src/core/services/openFilesFromDisk.ts b/frontend/src/core/services/openFilesFromDisk.ts
index ad2c014a69..c1536da0de 100644
--- a/frontend/src/core/services/openFilesFromDisk.ts
+++ b/frontend/src/core/services/openFilesFromDisk.ts
@@ -1,6 +1,6 @@
-import { openFileDialog } from '@app/services/fileDialogService';
-import { pendingFilePathMappings } from '@app/services/pendingFilePathMappings';
-import { getDocumentFileDialogFilter } from '@app/utils/fileDialogUtils';
+import { openFileDialog } from "@app/services/fileDialogService";
+import { pendingFilePathMappings } from "@app/services/pendingFilePathMappings";
+import { getDocumentFileDialogFilter } from "@app/utils/fileDialogUtils";
 
 interface OpenFilesFromDiskOptions {
   multiple?: boolean;
@@ -11,10 +11,12 @@ interface OpenFilesFromDiskOptions {
   onFallbackOpen?: () => void;
 }
 
-export async function openFilesFromDisk(options: OpenFilesFromDiskOptions = {}): Promise<File[]> {
+export async function openFilesFromDisk(
+  options: OpenFilesFromDiskOptions = {},
+): Promise<File[]> {
   const filesWithPaths = await openFileDialog({
     multiple: options.multiple ?? true,
-    filters: options.filters ?? getDocumentFileDialogFilter()
+    filters: options.filters ?? getDocumentFileDialogFilter(),
   });
 
   if (filesWithPaths.length > 0) {
diff --git a/frontend/src/core/services/operationResultsSaveService.ts b/frontend/src/core/services/operationResultsSaveService.ts
index 8579da62e7..20c829da98 100644
--- a/frontend/src/core/services/operationResultsSaveService.ts
+++ b/frontend/src/core/services/operationResultsSaveService.ts
@@ -1,5 +1,5 @@
-import type { FileId, StirlingFileStub } from '@app/types/fileContext';
-import { downloadFromUrl, DownloadResult } from '@app/services/downloadService';
+import type { FileId, StirlingFileStub } from "@app/types/fileContext";
+import { downloadFromUrl, DownloadResult } from "@app/services/downloadService";
 
 export interface OperationSaveContext {
   downloadUrl: string | null;
@@ -11,13 +11,15 @@ export interface OperationSaveContext {
   markSaved: (fileId: FileId, savedPath?: string) => void;
 }
 
-export async function saveOperationResults(context: OperationSaveContext): Promise<DownloadResult | null> {
+export async function saveOperationResults(
+  context: OperationSaveContext,
+): Promise<DownloadResult | null> {
   if (!context.downloadUrl) return null;
 
   const result = await downloadFromUrl(
     context.downloadUrl,
-    context.downloadFilename || 'download',
-    context.downloadLocalPath || undefined
+    context.downloadFilename || "download",
+    context.downloadLocalPath || undefined,
   );
 
   if (context.outputFileIds && result.savedPath) {
diff --git a/frontend/src/core/services/pdfExportHelpers.ts b/frontend/src/core/services/pdfExportHelpers.ts
index 8c6fb90b10..5e4cd3172a 100644
--- a/frontend/src/core/services/pdfExportHelpers.ts
+++ b/frontend/src/core/services/pdfExportHelpers.ts
@@ -1,6 +1,6 @@
-import { PDFDocument } from '@app/types/pageEditor';
-import { pdfExportService } from '@app/services/pdfExportService';
-import { FileId } from '@app/types/file';
+import { PDFDocument } from "@app/types/pageEditor";
+import { pdfExportService } from "@app/services/pdfExportService";
+import { FileId } from "@app/types/file";
 
 /**
  * Export processed documents to File objects
@@ -9,38 +9,59 @@ import { FileId } from '@app/types/file';
 export async function exportProcessedDocumentsToFiles(
   processedDocuments: PDFDocument | PDFDocument[],
   sourceFiles: Map<FileId, File> | null,
-  exportFilename: string
+  exportFilename: string,
 ): Promise<File[]> {
-  console.log('exportProcessedDocumentsToFiles called with:', {
+  console.log("exportProcessedDocumentsToFiles called with:", {
     isArray: Array.isArray(processedDocuments),
     numDocs: Array.isArray(processedDocuments) ? processedDocuments.length : 1,
     hasSourceFiles: sourceFiles !== null,
-    sourceFilesSize: sourceFiles?.size
+    sourceFilesSize: sourceFiles?.size,
   });
 
   if (Array.isArray(processedDocuments)) {
     // Multiple documents (splits)
     const files: File[] = [];
-    const baseName = exportFilename.replace(/\.pdf$/i, '');
+    const baseName = exportFilename.replace(/\.pdf$/i, "");
 
     for (let i = 0; i < processedDocuments.length; i++) {
       const doc = processedDocuments[i];
       const partFilename = `${baseName}_part_${i + 1}.pdf`;
 
       const result = sourceFiles
-        ? await pdfExportService.exportPDFMultiFile(doc, sourceFiles, [], { selectedOnly: false, filename: partFilename })
-        : await pdfExportService.exportPDF(doc, [], { selectedOnly: false, filename: partFilename });
+        ? await pdfExportService.exportPDFMultiFile(doc, sourceFiles, [], {
+            selectedOnly: false,
+            filename: partFilename,
+          })
+        : await pdfExportService.exportPDF(doc, [], {
+            selectedOnly: false,
+            filename: partFilename,
+          });
 
-      files.push(new File([result.blob], result.filename, { type: 'application/pdf' }));
+      files.push(
+        new File([result.blob], result.filename, { type: "application/pdf" }),
+      );
     }
 
     return files;
   } else {
     // Single document
     const result = sourceFiles
-      ? await pdfExportService.exportPDFMultiFile(processedDocuments, sourceFiles, [], { selectedOnly: false, filename: exportFilename })
-      : await pdfExportService.exportPDF(processedDocuments, [], { selectedOnly: false, filename: exportFilename });
+      ? await pdfExportService.exportPDFMultiFile(
+          processedDocuments,
+          sourceFiles,
+          [],
+          {
+            selectedOnly: false,
+            filename: exportFilename,
+          },
+        )
+      : await pdfExportService.exportPDF(processedDocuments, [], {
+          selectedOnly: false,
+          filename: exportFilename,
+        });
 
-    return [new File([result.blob], result.filename, { type: 'application/pdf' })];
+    return [
+      new File([result.blob], result.filename, { type: "application/pdf" }),
+    ];
   }
 }
diff --git a/frontend/src/core/services/pdfExportService.ts b/frontend/src/core/services/pdfExportService.ts
index bc9ca4908b..dd605d4818 100644
--- a/frontend/src/core/services/pdfExportService.ts
+++ b/frontend/src/core/services/pdfExportService.ts
@@ -6,13 +6,13 @@ import {
   importPages,
   setPageRotation,
   addNewPage,
-} from '@app/services/pdfiumService';
-import { downloadFile } from '@app/services/downloadService';
-import { PDFDocument, PDFPage } from '@app/types/pageEditor';
+} from "@app/services/pdfiumService";
+import { downloadFile } from "@app/services/downloadService";
+import { PDFDocument, PDFPage } from "@app/types/pageEditor";
 
 // A4 dimensions in PDF points (72 dpi)
 const A4_WIDTH = 595.276;
-const A4_HEIGHT = 841.890;
+const A4_HEIGHT = 841.89;
 
 export interface ExportOptions {
   selectedOnly?: boolean;
@@ -26,29 +26,37 @@ export class PDFExportService {
   async exportPDF(
     pdfDocument: PDFDocument,
     selectedPageIds: string[] = [],
-    options: ExportOptions = {}
+    options: ExportOptions = {},
   ): Promise<{ blob: Blob; filename: string }> {
     const { selectedOnly = false, filename } = options;
 
     try {
-      const pagesToExport = selectedOnly && selectedPageIds.length > 0
-        ? pdfDocument.pages.filter(page => selectedPageIds.includes(page.id))
-        : pdfDocument.pages;
+      const pagesToExport =
+        selectedOnly && selectedPageIds.length > 0
+          ? pdfDocument.pages.filter((page) =>
+              selectedPageIds.includes(page.id),
+            )
+          : pdfDocument.pages;
 
       if (pagesToExport.length === 0) {
-        throw new Error('No pages to export');
+        throw new Error("No pages to export");
       }
 
       const originalPDFBytes = await pdfDocument.file.arrayBuffer();
-      const blob = await this.createSingleDocument(originalPDFBytes, pagesToExport);
-      const exportFilename = this.generateFilename(filename || pdfDocument.name);
+      const blob = await this.createSingleDocument(
+        originalPDFBytes,
+        pagesToExport,
+      );
+      const exportFilename = this.generateFilename(
+        filename || pdfDocument.name,
+      );
 
       return { blob, filename: exportFilename };
     } catch (error) {
-      console.error('PDF export error:', error);
+      console.error("PDF export error:", error);
       throw new Error(
-        `Failed to export PDF: ${error instanceof Error ? error.message : 'Unknown error'}`,
-        { cause: error }
+        `Failed to export PDF: ${error instanceof Error ? error.message : "Unknown error"}`,
+        { cause: error },
       );
     }
   }
@@ -60,28 +68,36 @@ export class PDFExportService {
     pdfDocument: PDFDocument,
     sourceFiles: Map<string, File>,
     selectedPageIds: string[] = [],
-    options: ExportOptions = {}
+    options: ExportOptions = {},
   ): Promise<{ blob: Blob; filename: string }> {
     const { selectedOnly = false, filename } = options;
 
     try {
-      const pagesToExport = selectedOnly && selectedPageIds.length > 0
-        ? pdfDocument.pages.filter(page => selectedPageIds.includes(page.id))
-        : pdfDocument.pages;
+      const pagesToExport =
+        selectedOnly && selectedPageIds.length > 0
+          ? pdfDocument.pages.filter((page) =>
+              selectedPageIds.includes(page.id),
+            )
+          : pdfDocument.pages;
 
       if (pagesToExport.length === 0) {
-        throw new Error('No pages to export');
+        throw new Error("No pages to export");
       }
 
-      const blob = await this.createMultiSourceDocument(sourceFiles, pagesToExport);
-      const exportFilename = this.generateFilename(filename || pdfDocument.name);
+      const blob = await this.createMultiSourceDocument(
+        sourceFiles,
+        pagesToExport,
+      );
+      const exportFilename = this.generateFilename(
+        filename || pdfDocument.name,
+      );
 
       return { blob, filename: exportFilename };
     } catch (error) {
-      console.error('Multi-file PDF export error:', error);
+      console.error("Multi-file PDF export error:", error);
       throw new Error(
-        `Failed to export PDF: ${error instanceof Error ? error.message : 'Unknown error'}`,
-        { cause: error }
+        `Failed to export PDF: ${error instanceof Error ? error.message : "Unknown error"}`,
+        { cause: error },
       );
     }
   }
@@ -91,13 +107,14 @@ export class PDFExportService {
    */
   private async createMultiSourceDocument(
     sourceFiles: Map<string, File>,
-    pages: PDFPage[]
+    pages: PDFPage[],
   ): Promise<Blob> {
     const m = await getPdfiumModule();
 
     // Create destination document
     const destDocPtr = m.FPDF_CreateNewDocument();
-    if (!destDocPtr) throw new Error('PDFium: failed to create destination document');
+    if (!destDocPtr)
+      throw new Error("PDFium: failed to create destination document");
 
     // Load all source documents once and cache them
     const loadedDocs = new Map<string, number>();
@@ -132,7 +149,12 @@ export class PDFExportService {
           if (sourcePageIndex >= 0 && sourcePageIndex < srcPageCount) {
             // Import the specific page (1-based page range for FPDF_ImportPages)
             const pageRange = String(sourcePageIndex + 1);
-            const imported = await importPages(destDocPtr, srcDocPtr, pageRange, insertIdx);
+            const imported = await importPages(
+              destDocPtr,
+              srcDocPtr,
+              pageRange,
+              insertIdx,
+            );
             if (!imported) {
               console.warn(
                 `[PDFExport] importPages failed for fileId=${page.originalFileId} pageRange=${pageRange} — page will be missing from output.`,
@@ -147,13 +169,15 @@ export class PDFExportService {
             insertIdx++;
           }
         } else {
-          console.warn(`Cannot find source document for page ${page.pageNumber} (fileId: ${page.originalFileId})`);
+          console.warn(
+            `Cannot find source document for page ${page.pageNumber} (fileId: ${page.originalFileId})`,
+          );
         }
       }
 
       // Save the assembled document
       const resultBuf = await saveRawDocument(destDocPtr);
-      return new Blob([resultBuf], { type: 'application/pdf' });
+      return new Blob([resultBuf], { type: "application/pdf" });
     } finally {
       // Cleanup all loaded source documents
       for (const docPtr of loadedDocs.values()) {
@@ -168,7 +192,7 @@ export class PDFExportService {
    */
   private async createSingleDocument(
     sourceData: ArrayBuffer,
-    pages: PDFPage[]
+    pages: PDFPage[],
   ): Promise<Blob> {
     const m = await getPdfiumModule();
 
@@ -177,7 +201,7 @@ export class PDFExportService {
     const destDocPtr = m.FPDF_CreateNewDocument();
     if (!destDocPtr) {
       await closeRawDocument(srcDocPtr);
-      throw new Error('PDFium: failed to create destination document');
+      throw new Error("PDFium: failed to create destination document");
     }
 
     try {
@@ -197,7 +221,12 @@ export class PDFExportService {
 
           if (sourcePageIndex >= 0 && sourcePageIndex < srcPageCount) {
             const pageRange = String(sourcePageIndex + 1);
-            const imported = await importPages(destDocPtr, srcDocPtr, pageRange, insertIdx);
+            const imported = await importPages(
+              destDocPtr,
+              srcDocPtr,
+              pageRange,
+              insertIdx,
+            );
             if (!imported) {
               console.warn(
                 `[PDFExport] importPages failed for page ${page.originalPageNumber} pageRange=${pageRange} — page will be missing from output.`,
@@ -214,7 +243,7 @@ export class PDFExportService {
       }
 
       const resultBuf = await saveRawDocument(destDocPtr);
-      return new Blob([resultBuf], { type: 'application/pdf' });
+      return new Blob([resultBuf], { type: "application/pdf" });
     } finally {
       await closeRawDocument(srcDocPtr);
       m.FPDF_CloseDocument(destDocPtr);
@@ -225,7 +254,7 @@ export class PDFExportService {
    * Generate appropriate filename for export
    */
   private generateFilename(originalName: string): string {
-    const baseName = originalName.replace(/\.pdf$/i, '');
+    const baseName = originalName.replace(/\.pdf$/i, "");
     return `${baseName}.pdf`;
   }
 
@@ -250,23 +279,27 @@ export class PDFExportService {
   /**
    * Validate PDF operations before export
    */
-  validateExport(pdfDocument: PDFDocument, selectedPageIds: string[], selectedOnly: boolean): string[] {
+  validateExport(
+    pdfDocument: PDFDocument,
+    selectedPageIds: string[],
+    selectedOnly: boolean,
+  ): string[] {
     const errors: string[] = [];
 
     if (selectedOnly && selectedPageIds.length === 0) {
-      errors.push('No pages selected for export');
+      errors.push("No pages selected for export");
     }
 
     if (pdfDocument.pages.length === 0) {
-      errors.push('No pages available to export');
+      errors.push("No pages available to export");
     }
 
     const pagesToExport = selectedOnly
-      ? pdfDocument.pages.filter(page => selectedPageIds.includes(page.id))
+      ? pdfDocument.pages.filter((page) => selectedPageIds.includes(page.id))
       : pdfDocument.pages;
 
     if (pagesToExport.length === 0) {
-      errors.push('No valid pages to export after applying filters');
+      errors.push("No valid pages to export after applying filters");
     }
 
     return errors;
@@ -275,13 +308,17 @@ export class PDFExportService {
   /**
    * Get export preview information
    */
-  getExportInfo(pdfDocument: PDFDocument, selectedPageIds: string[], selectedOnly: boolean): {
+  getExportInfo(
+    pdfDocument: PDFDocument,
+    selectedPageIds: string[],
+    selectedOnly: boolean,
+  ): {
     pageCount: number;
     splitCount: number;
     estimatedSize: string;
   } {
     const pagesToExport = selectedOnly
-      ? pdfDocument.pages.filter(page => selectedPageIds.includes(page.id))
+      ? pdfDocument.pages.filter((page) => selectedPageIds.includes(page.id))
       : pdfDocument.pages;
 
     const splitCount = pagesToExport.reduce((count, page) => {
@@ -295,7 +332,7 @@ export class PDFExportService {
     return {
       pageCount: pagesToExport.length,
       splitCount,
-      estimatedSize
+      estimatedSize,
     };
   }
 
@@ -303,11 +340,11 @@ export class PDFExportService {
    * Format file size for display
    */
   private formatFileSize(bytes: number): string {
-    if (bytes === 0) return '0 B';
+    if (bytes === 0) return "0 B";
     const k = 1024;
-    const sizes = ['B', 'KB', 'MB', 'GB'];
+    const sizes = ["B", "KB", "MB", "GB"];
     const i = Math.floor(Math.log(bytes) / Math.log(k));
-    return parseFloat((bytes / Math.pow(k, i)).toFixed(2)) + ' ' + sizes[i];
+    return parseFloat((bytes / Math.pow(k, i)).toFixed(2)) + " " + sizes[i];
   }
 }
 
@@ -317,10 +354,14 @@ export class PDFExportService {
 function degreesToPdfiumRotation(degrees: number): number {
   const normalized = ((degrees % 360) + 360) % 360;
   switch (normalized) {
-    case 90: return 1;
-    case 180: return 2;
-    case 270: return 3;
-    default: return 0;
+    case 90:
+      return 1;
+    case 180:
+      return 2;
+    case 270:
+      return 3;
+    default:
+      return 0;
   }
 }
 
diff --git a/frontend/src/core/services/pdfMetadataService.ts b/frontend/src/core/services/pdfMetadataService.ts
index 3c1dd2b380..ffaa691f59 100644
--- a/frontend/src/core/services/pdfMetadataService.ts
+++ b/frontend/src/core/services/pdfMetadataService.ts
@@ -1,7 +1,11 @@
-import { pdfWorkerManager } from '@app/services/pdfWorkerManager';
-import { FileAnalyzer } from '@app/services/fileAnalyzer';
-import { TrappedStatus, CustomMetadataEntry, ExtractedPDFMetadata } from '@app/types/metadata';
-import { PDFDocumentProxy } from 'pdfjs-dist/types/src/display/api';
+import { pdfWorkerManager } from "@app/services/pdfWorkerManager";
+import { FileAnalyzer } from "@app/services/fileAnalyzer";
+import {
+  TrappedStatus,
+  CustomMetadataEntry,
+  ExtractedPDFMetadata,
+} from "@app/types/metadata";
+import { PDFDocumentProxy } from "pdfjs-dist/types/src/display/api";
 
 export interface MetadataExtractionResult {
   success: true;
@@ -13,7 +17,9 @@ export interface MetadataExtractionError {
   error: string;
 }
 
-export type MetadataExtractionResponse = MetadataExtractionResult | MetadataExtractionError;
+export type MetadataExtractionResponse =
+  | MetadataExtractionResult
+  | MetadataExtractionError;
 
 /**
  * Utility to format PDF date strings to required format (yyyy/MM/dd HH:mm:ss)
@@ -21,13 +27,13 @@ export type MetadataExtractionResponse = MetadataExtractionResult | MetadataExtr
  */
 function formatPDFDate(dateString: string): string {
   if (!dateString) {
-    return '';
+    return "";
   }
 
   let date: Date;
 
   // Check if it's a PDF date format (starts with "D:")
-  if (dateString.startsWith('D:')) {
+  if (dateString.startsWith("D:")) {
     // Parse PDF date format: D:YYYYMMDDHHmmSSOHH'mm'
     const dateStr = dateString.substring(2); // Remove "D:"
 
@@ -47,15 +53,15 @@ function formatPDFDate(dateString: string): string {
   }
 
   if (isNaN(date.getTime())) {
-    return '';
+    return "";
   }
 
   const year = date.getFullYear();
-  const month = String(date.getMonth() + 1).padStart(2, '0');
-  const day = String(date.getDate()).padStart(2, '0');
-  const hours = String(date.getHours()).padStart(2, '0');
-  const minutes = String(date.getMinutes()).padStart(2, '0');
-  const seconds = String(date.getSeconds()).padStart(2, '0');
+  const month = String(date.getMonth() + 1).padStart(2, "0");
+  const day = String(date.getDate()).padStart(2, "0");
+  const hours = String(date.getHours()).padStart(2, "0");
+  const minutes = String(date.getMinutes()).padStart(2, "0");
+  const seconds = String(date.getSeconds()).padStart(2, "0");
 
   return `${year}/${month}/${day} ${hours}:${minutes}:${seconds}`;
 }
@@ -65,10 +71,10 @@ function formatPDFDate(dateString: string): string {
  * PDF.js returns trapped as { name: "True" | "False" } object
  */
 function convertTrappedStatus(trapped: unknown): TrappedStatus {
-  if (trapped && typeof trapped === 'object' && 'name' in trapped) {
+  if (trapped && typeof trapped === "object" && "name" in trapped) {
     const name = (trapped as Record<string, string>).name?.toLowerCase();
-    if (name === 'true') return TrappedStatus.TRUE;
-    if (name === 'false') return TrappedStatus.FALSE;
+    if (name === "true") return TrappedStatus.TRUE;
+    if (name === "false") return TrappedStatus.FALSE;
   }
   return TrappedStatus.UNKNOWN;
 }
@@ -81,17 +87,16 @@ function extractCustomMetadata(custom: unknown): CustomMetadataEntry[] {
   const customMetadata: CustomMetadataEntry[] = [];
   let customIdCounter = 1;
 
-
   // Check if there's a Custom object containing the custom metadata
-  if (typeof custom === 'object' && custom !== null) {
+  if (typeof custom === "object" && custom !== null) {
     const customObj = custom as Record<string, unknown>;
 
     Object.entries(customObj).forEach(([key, value]) => {
-      if (value != null && value !== '') {
+      if (value != null && value !== "") {
         const entry = {
           key,
           value: String(value),
-          id: `custom${customIdCounter++}`
+          id: `custom${customIdCounter++}`,
         };
         customMetadata.push(entry);
       }
@@ -109,16 +114,16 @@ function cleanupPdfDocument(pdfDoc: PDFDocumentProxy | null): void {
     try {
       pdfWorkerManager.destroyDocument(pdfDoc);
     } catch (cleanupError) {
-      console.warn('Failed to cleanup PDF document:', cleanupError);
+      console.warn("Failed to cleanup PDF document:", cleanupError);
     }
   }
 }
 
 function getStringMetadata(info: Record<string, unknown>, key: string): string {
-  if (typeof info[key] === 'string') {
+  if (typeof info[key] === "string") {
     return info[key];
   } else {
-    return '';
+    return "";
   }
 }
 
@@ -126,13 +131,15 @@ function getStringMetadata(info: Record<string, unknown>, key: string): string {
  * Extract all metadata from a PDF file
  * Returns a result object with success/error state
  */
-export async function extractPDFMetadata(file: File): Promise<MetadataExtractionResponse> {
+export async function extractPDFMetadata(
+  file: File,
+): Promise<MetadataExtractionResponse> {
   // Use existing PDF validation
   const isValidPDF = await FileAnalyzer.isValidPDF(file);
   if (!isValidPDF) {
     return {
       success: false,
-      error: 'File is not a valid PDF'
+      error: "File is not a valid PDF",
     };
   }
 
@@ -144,15 +151,16 @@ export async function extractPDFMetadata(file: File): Promise<MetadataExtraction
     arrayBuffer = await file.arrayBuffer();
     pdfDoc = await pdfWorkerManager.createDocument(arrayBuffer, {
       disableAutoFetch: true,
-      disableStream: true
+      disableStream: true,
     });
     metadata = await pdfDoc.getMetadata();
   } catch (error) {
-    const errorMessage = error instanceof Error ? error.message : 'Unknown error';
+    const errorMessage =
+      error instanceof Error ? error.message : "Unknown error";
     cleanupPdfDocument(pdfDoc);
     return {
       success: false,
-      error: `Failed to read PDF: ${errorMessage}`
+      error: `Failed to read PDF: ${errorMessage}`,
     };
   }
 
@@ -160,14 +168,14 @@ export async function extractPDFMetadata(file: File): Promise<MetadataExtraction
 
   // Safely extract metadata with proper type checking
   const extractedMetadata: ExtractedPDFMetadata = {
-    title: getStringMetadata(info, 'Title'),
-    author: getStringMetadata(info, 'Author'),
-    subject: getStringMetadata(info, 'Subject'),
-    keywords: getStringMetadata(info, 'Keywords'),
-    creator: getStringMetadata(info, 'Creator'),
-    producer: getStringMetadata(info, 'Producer'),
-    creationDate: formatPDFDate(getStringMetadata(info, 'CreationDate')),
-    modificationDate: formatPDFDate(getStringMetadata(info, 'ModDate')),
+    title: getStringMetadata(info, "Title"),
+    author: getStringMetadata(info, "Author"),
+    subject: getStringMetadata(info, "Subject"),
+    keywords: getStringMetadata(info, "Keywords"),
+    creator: getStringMetadata(info, "Creator"),
+    producer: getStringMetadata(info, "Producer"),
+    creationDate: formatPDFDate(getStringMetadata(info, "CreationDate")),
+    modificationDate: formatPDFDate(getStringMetadata(info, "ModDate")),
     trapped: convertTrappedStatus(info.Trapped),
     customMetadata: extractCustomMetadata(info.Custom),
   };
@@ -176,6 +184,6 @@ export async function extractPDFMetadata(file: File): Promise<MetadataExtraction
 
   return {
     success: true,
-    metadata: extractedMetadata
+    metadata: extractedMetadata,
   };
 }
diff --git a/frontend/src/core/services/pdfProcessingService.ts b/frontend/src/core/services/pdfProcessingService.ts
index 02d29898ca..9ccc748946 100644
--- a/frontend/src/core/services/pdfProcessingService.ts
+++ b/frontend/src/core/services/pdfProcessingService.ts
@@ -1,13 +1,15 @@
-import { ProcessedFile, ProcessingState, PDFPage } from '@app/types/processing';
-import { ProcessingCache } from '@app/services/processingCache';
-import { pdfWorkerManager } from '@app/services/pdfWorkerManager';
-import { createQuickKey } from '@app/types/fileContext';
+import { ProcessedFile, ProcessingState, PDFPage } from "@app/types/processing";
+import { ProcessingCache } from "@app/services/processingCache";
+import { pdfWorkerManager } from "@app/services/pdfWorkerManager";
+import { createQuickKey } from "@app/types/fileContext";
 
 export class PDFProcessingService {
   private static instance: PDFProcessingService;
   private cache = new ProcessingCache();
   private processing = new Map<string, ProcessingState>();
-  private processingListeners = new Set<(states: Map<string, ProcessingState>) => void>();
+  private processingListeners = new Set<
+    (states: Map<string, ProcessingState>) => void
+  >();
 
   private constructor() {}
 
@@ -24,13 +26,13 @@ export class PDFProcessingService {
     // Check cache first
     const cached = this.cache.get(fileKey);
     if (cached) {
-      console.log('Cache hit for:', file.name);
+      console.log("Cache hit for:", file.name);
       return cached;
     }
 
     // Check if already processing
     if (this.processing.has(fileKey)) {
-      console.log('Already processing:', file.name);
+      console.log("Already processing:", file.name);
       return null; // Will be available when processing completes
     }
 
@@ -44,10 +46,10 @@ export class PDFProcessingService {
     const state: ProcessingState = {
       fileKey,
       fileName: file.name,
-      status: 'processing',
+      status: "processing",
       progress: 0,
       startedAt: Date.now(),
-      strategy: 'immediate_full'
+      strategy: "immediate_full",
     };
 
     this.processing.set(fileKey, state);
@@ -55,16 +57,19 @@ export class PDFProcessingService {
 
     try {
       // Process the file with progress updates
-      const processedFile = await this.processFileWithProgress(file, (progress) => {
-        state.progress = progress;
-        this.notifyListeners();
-      });
+      const processedFile = await this.processFileWithProgress(
+        file,
+        (progress) => {
+          state.progress = progress;
+          this.notifyListeners();
+        },
+      );
 
       // Cache the result
       this.cache.set(fileKey, processedFile);
 
       // Update state to completed
-      state.status = 'completed';
+      state.status = "completed";
       state.progress = 100;
       state.completedAt = Date.now();
       this.notifyListeners();
@@ -74,11 +79,12 @@ export class PDFProcessingService {
         this.processing.delete(fileKey);
         this.notifyListeners();
       }, 2000);
-
     } catch (error) {
-      console.error('Processing failed for', file.name, ':', error);
-      state.status = 'error';
-      state.error = (error instanceof Error ? error.message : 'Unknown error') as any;
+      console.error("Processing failed for", file.name, ":", error);
+      state.status = "error";
+      state.error = (
+        error instanceof Error ? error.message : "Unknown error"
+      ) as any;
       this.notifyListeners();
 
       // Remove failed processing after delay
@@ -91,7 +97,7 @@ export class PDFProcessingService {
 
   private async processFileWithProgress(
     file: File,
-    onProgress: (progress: number) => void
+    onProgress: (progress: number) => void,
   ): Promise<ProcessedFile> {
     const arrayBuffer = await file.arrayBuffer();
     const pdf = await pdfWorkerManager.createDocument(arrayBuffer);
@@ -104,11 +110,11 @@ export class PDFProcessingService {
     for (let i = 1; i <= totalPages; i++) {
       const page = await pdf.getPage(i);
       const viewport = page.getViewport({ scale: 0.5 });
-      const canvas = document.createElement('canvas');
+      const canvas = document.createElement("canvas");
       canvas.width = viewport.width;
       canvas.height = viewport.height;
 
-      const context = canvas.getContext('2d');
+      const context = canvas.getContext("2d");
       if (context) {
         await page.render({ canvasContext: context, viewport, canvas }).promise;
         const thumbnail = canvas.toDataURL();
@@ -118,7 +124,7 @@ export class PDFProcessingService {
           pageNumber: i,
           thumbnail,
           rotation: 0,
-          selected: false
+          selected: false,
         });
       }
 
@@ -137,13 +143,15 @@ export class PDFProcessingService {
       metadata: {
         title: file.name,
         createdAt: new Date().toISOString(),
-        modifiedAt: new Date().toISOString()
-      }
+        modifiedAt: new Date().toISOString(),
+      },
     };
   }
 
   // State subscription for components
-  onProcessingChange(callback: (states: Map<string, ProcessingState>) => void): () => void {
+  onProcessingChange(
+    callback: (states: Map<string, ProcessingState>) => void,
+  ): () => void {
     this.processingListeners.add(callback);
     return () => this.processingListeners.delete(callback);
   }
@@ -153,7 +161,7 @@ export class PDFProcessingService {
   }
 
   private notifyListeners(): void {
-    this.processingListeners.forEach(callback => callback(this.processing));
+    this.processingListeners.forEach((callback) => callback(this.processing));
   }
 
   generateFileKey(file: File): string {
@@ -162,7 +170,7 @@ export class PDFProcessingService {
 
   // Cleanup method for activeFiles changes
   cleanup(removedFiles: File[]): void {
-    removedFiles.forEach(file => {
+    removedFiles.forEach((file) => {
       const key = this.generateFileKey(file);
       this.cache.delete(key);
       this.processing.delete(key);
diff --git a/frontend/src/core/services/pdfWorkerManager.ts b/frontend/src/core/services/pdfWorkerManager.ts
index 7e70901a88..534c6fc3f1 100644
--- a/frontend/src/core/services/pdfWorkerManager.ts
+++ b/frontend/src/core/services/pdfWorkerManager.ts
@@ -5,7 +5,11 @@
  * and ensuring proper cleanup when operations complete.
  */
 
-import { GlobalWorkerOptions, getDocument, PDFDocumentProxy } from 'pdfjs-dist/legacy/build/pdf.mjs';
+import {
+  GlobalWorkerOptions,
+  getDocument,
+  PDFDocumentProxy,
+} from "pdfjs-dist/legacy/build/pdf.mjs";
 
 class PDFWorkerManager {
   private static instance: PDFWorkerManager;
@@ -31,8 +35,8 @@ class PDFWorkerManager {
   private initializeWorker(): void {
     if (!this.isInitialized) {
       GlobalWorkerOptions.workerSrc = new URL(
-        'pdfjs-dist/legacy/build/pdf.worker.min.mjs',
-        import.meta.url
+        "pdfjs-dist/legacy/build/pdf.worker.min.mjs",
+        import.meta.url,
       ).toString();
       (GlobalWorkerOptions as any).docBaseUrl = undefined;
       this.isInitialized = true;
@@ -50,7 +54,7 @@ class PDFWorkerManager {
       disableStream?: boolean;
       stopAtErrors?: boolean;
       verbosity?: number;
-    } = {}
+    } = {},
   ): Promise<PDFDocumentProxy> {
     // Wait if we've hit the worker limit
     if (this.activeDocuments.size >= this.maxWorkers) {
@@ -61,32 +65,34 @@ class PDFWorkerManager {
     let pdfData: any;
     if (data instanceof ArrayBuffer || data instanceof Uint8Array) {
       pdfData = { data };
-    } else if (typeof data === 'string') {
+    } else if (typeof data === "string") {
       pdfData = data; // URL string
-    } else if (data && typeof data === 'object' && 'data' in data) {
+    } else if (data && typeof data === "object" && "data" in data) {
       pdfData = data; // Already in {data: ArrayBuffer} format
     } else {
       pdfData = data; // Pass through as-is
     }
 
     const loadingTask = getDocument(
-      typeof pdfData === 'string' ? {
-        url: pdfData,
-        disableAutoFetch: options.disableAutoFetch ?? true,
-        disableStream: options.disableStream ?? true,
-        stopAtErrors: options.stopAtErrors ?? false,
-        verbosity: options.verbosity ?? 0,
-        // Suppress warnings about unimplemented widget types and other non-critical issues
-        isEvalSupported: false,
-      } : {
-        ...pdfData,
-        disableAutoFetch: options.disableAutoFetch ?? true,
-        disableStream: options.disableStream ?? true,
-        stopAtErrors: options.stopAtErrors ?? false,
-        verbosity: options.verbosity ?? 0,
-        // Suppress warnings about unimplemented widget types and other non-critical issues
-        isEvalSupported: false,
-      }
+      typeof pdfData === "string"
+        ? {
+            url: pdfData,
+            disableAutoFetch: options.disableAutoFetch ?? true,
+            disableStream: options.disableStream ?? true,
+            stopAtErrors: options.stopAtErrors ?? false,
+            verbosity: options.verbosity ?? 0,
+            // Suppress warnings about unimplemented widget types and other non-critical issues
+            isEvalSupported: false,
+          }
+        : {
+            ...pdfData,
+            disableAutoFetch: options.disableAutoFetch ?? true,
+            disableStream: options.disableStream ?? true,
+            stopAtErrors: options.stopAtErrors ?? false,
+            verbosity: options.verbosity ?? 0,
+            // Suppress warnings about unimplemented widget types and other non-critical issues
+            isEvalSupported: false,
+          },
     );
 
     try {
@@ -130,7 +136,7 @@ class PDFWorkerManager {
    */
   destroyAllDocuments(): void {
     const documentsToDestroy = Array.from(this.activeDocuments);
-    documentsToDestroy.forEach(pdf => {
+    documentsToDestroy.forEach((pdf) => {
       this.destroyDocument(pdf);
     });
 
@@ -161,7 +167,7 @@ class PDFWorkerManager {
     return {
       active: this.activeDocuments.size,
       max: this.maxWorkers,
-      total: this.workerCount
+      total: this.workerCount,
     };
   }
 
@@ -170,7 +176,7 @@ class PDFWorkerManager {
    */
   emergencyCleanup(): void {
     // Force destroy all documents
-    this.activeDocuments.forEach(pdf => {
+    this.activeDocuments.forEach((pdf) => {
       try {
         pdf.destroy();
       } catch {
diff --git a/frontend/src/core/services/pdfiumDocBuilder.ts b/frontend/src/core/services/pdfiumDocBuilder.ts
index 5e7dffb71d..305bc9e226 100644
--- a/frontend/src/core/services/pdfiumDocBuilder.ts
+++ b/frontend/src/core/services/pdfiumDocBuilder.ts
@@ -8,9 +8,13 @@
  *
  * Used by the signature validation report system.
  */
-import { getPdfiumModule, writeUtf16, saveRawDocument } from '@app/services/pdfiumService';
-import { embedBitmapImageOnPage } from '@app/utils/pdfiumBitmapUtils';
-import type { WrappedPdfiumModule } from '@embedpdf/pdfium';
+import {
+  getPdfiumModule,
+  writeUtf16,
+  saveRawDocument,
+} from "@app/services/pdfiumService";
+import { embedBitmapImageOnPage } from "@app/utils/pdfiumBitmapUtils";
+import type { WrappedPdfiumModule } from "@embedpdf/pdfium";
 
 // ---------------------------------------------------------------------------
 // Color type (replaces pdf-lib's `rgb()`)
@@ -30,7 +34,12 @@ export function rgb(r: number, g: number, b: number): PdfiumColor {
 }
 
 function colorToRGBA(c: PdfiumColor): [number, number, number, number] {
-  return [Math.round(c._r * 255), Math.round(c._g * 255), Math.round(c._b * 255), 255];
+  return [
+    Math.round(c._r * 255),
+    Math.round(c._g * 255),
+    Math.round(c._b * 255),
+    255,
+  ];
 }
 
 // ---------------------------------------------------------------------------
@@ -39,20 +48,23 @@ function colorToRGBA(c: PdfiumColor): [number, number, number, number] {
 
 /** Standard PDF font names matching pdf-lib's StandardFonts enum. */
 export const StandardFonts = {
-  Helvetica: 'Helvetica',
-  HelveticaBold: 'Helvetica-Bold',
-  HelveticaOblique: 'Helvetica-Oblique',
-  HelveticaBoldOblique: 'Helvetica-BoldOblique',
-  Courier: 'Courier',
-  CourierBold: 'Courier-Bold',
-  TimesRoman: 'Times-Roman',
-  TimesBold: 'Times-Bold',
+  Helvetica: "Helvetica",
+  HelveticaBold: "Helvetica-Bold",
+  HelveticaOblique: "Helvetica-Oblique",
+  HelveticaBoldOblique: "Helvetica-BoldOblique",
+  Courier: "Courier",
+  CourierBold: "Courier-Bold",
+  TimesRoman: "Times-Roman",
+  TimesBold: "Times-Bold",
 } as const;
 
 export class PdfiumFont {
   readonly name: string;
   private _canvas: OffscreenCanvas | HTMLCanvasElement | null = null;
-  private _ctx: CanvasRenderingContext2D | OffscreenCanvasRenderingContext2D | null = null;
+  private _ctx:
+    | CanvasRenderingContext2D
+    | OffscreenCanvasRenderingContext2D
+    | null = null;
 
   constructor(name: string) {
     this.name = name;
@@ -77,20 +89,23 @@ export class PdfiumFont {
 
   /** Map PDF font name to a CSS font-family for canvas measurement. */
   private _cssFontFamily(): string {
-    if (this.name.startsWith('Helvetica')) return 'Helvetica, Arial, sans-serif';
-    if (this.name.startsWith('Courier')) return 'Courier, monospace';
-    if (this.name.startsWith('Times')) return 'Times New Roman, serif';
-    return 'sans-serif';
+    if (this.name.startsWith("Helvetica"))
+      return "Helvetica, Arial, sans-serif";
+    if (this.name.startsWith("Courier")) return "Courier, monospace";
+    if (this.name.startsWith("Times")) return "Times New Roman, serif";
+    return "sans-serif";
   }
 
-  private _getCtx(): CanvasRenderingContext2D | OffscreenCanvasRenderingContext2D {
+  private _getCtx():
+    | CanvasRenderingContext2D
+    | OffscreenCanvasRenderingContext2D {
     if (this._ctx) return this._ctx;
-    if (typeof OffscreenCanvas !== 'undefined') {
+    if (typeof OffscreenCanvas !== "undefined") {
       this._canvas = new OffscreenCanvas(1, 1);
-      this._ctx = this._canvas.getContext('2d')!;
+      this._ctx = this._canvas.getContext("2d")!;
     } else {
-      this._canvas = document.createElement('canvas');
-      this._ctx = this._canvas.getContext('2d')!;
+      this._canvas = document.createElement("canvas");
+      this._ctx = this._canvas.getContext("2d")!;
     }
     return this._ctx;
   }
@@ -118,7 +133,10 @@ export class PdfiumImage {
   }
 
   /** Scale to fit within maxWidth × maxHeight preserving aspect ratio (matches pdf-lib's `PDFImage.scaleToFit()`). */
-  scaleToFit(maxWidth: number, maxHeight: number): { width: number; height: number } {
+  scaleToFit(
+    maxWidth: number,
+    maxHeight: number,
+  ): { width: number; height: number } {
     const ratio = Math.min(maxWidth / this.width, maxHeight / this.height, 1);
     return { width: this.width * ratio, height: this.height * ratio };
   }
@@ -168,7 +186,13 @@ export class PdfiumPage {
   readonly width: number;
   readonly height: number;
 
-  constructor(m: WrappedPdfiumModule, docPtr: number, pagePtr: number, width: number, height: number) {
+  constructor(
+    m: WrappedPdfiumModule,
+    docPtr: number,
+    pagePtr: number,
+    width: number,
+    height: number,
+  ) {
     this._m = m;
     this._docPtr = docPtr;
     this._pagePtr = pagePtr;
@@ -182,7 +206,7 @@ export class PdfiumPage {
   drawText(text: string, options: DrawTextOptions): void {
     const { x, y, size, font, color } = options;
     const m = this._m;
-    const fontName = font?.name ?? 'Helvetica';
+    const fontName = font?.name ?? "Helvetica";
 
     const textObjPtr = m.FPDFPageObj_NewTextObj(this._docPtr, fontName, size);
     if (!textObjPtr) return;
@@ -210,7 +234,15 @@ export class PdfiumPage {
    * Draw a rectangle on the page. API compatible with pdf-lib's `PDFPage.drawRectangle()`.
    */
   drawRectangle(options: DrawRectangleOptions): void {
-    const { x, y, width, height, color, borderColor, borderWidth = 1 } = options;
+    const {
+      x,
+      y,
+      width,
+      height,
+      color,
+      borderColor,
+      borderWidth = 1,
+    } = options;
     const m = this._m;
 
     const pathPtr = m.FPDFPageObj_CreateNewPath(x, y);
@@ -274,9 +306,14 @@ export class PdfiumPage {
   drawImage(image: PdfiumImage, options: DrawImageOptions): void {
     const { x, y, width, height } = options;
     embedBitmapImageOnPage(
-      this._m, this._docPtr, this._pagePtr,
+      this._m,
+      this._docPtr,
+      this._pagePtr,
       { rgba: image._rgba, width: image.width, height: image.height },
-      x, y, width, height,
+      x,
+      y,
+      width,
+      height,
     );
   }
 
@@ -310,7 +347,7 @@ export class PdfiumDocument {
   static async create(): Promise<PdfiumDocument> {
     const m = await getPdfiumModule();
     const docPtr = m.FPDF_CreateNewDocument();
-    if (!docPtr) throw new Error('PDFium: failed to create document');
+    if (!docPtr) throw new Error("PDFium: failed to create document");
     return new PdfiumDocument(m, docPtr);
   }
 
@@ -318,8 +355,13 @@ export class PdfiumDocument {
   addPage(dimensions: [number, number]): PdfiumPage {
     const [width, height] = dimensions;
     const insertIdx = this._pages.length;
-    const pagePtr = this._m.FPDFPage_New(this._docPtr, insertIdx, width, height);
-    if (!pagePtr) throw new Error('PDFium: failed to create page');
+    const pagePtr = this._m.FPDFPage_New(
+      this._docPtr,
+      insertIdx,
+      width,
+      height,
+    );
+    if (!pagePtr) throw new Error("PDFium: failed to create page");
     const page = new PdfiumPage(this._m, this._docPtr, pagePtr, width, height);
     this._pages.push(page);
     return page;
@@ -335,12 +377,18 @@ export class PdfiumDocument {
 
   /** Embed a PNG image from raw bytes. */
   async embedPng(bytes: Uint8Array | ArrayBuffer): Promise<PdfiumImage> {
-    return this._decodeImage(bytes instanceof Uint8Array ? bytes : new Uint8Array(bytes), 'image/png');
+    return this._decodeImage(
+      bytes instanceof Uint8Array ? bytes : new Uint8Array(bytes),
+      "image/png",
+    );
   }
 
   /** Embed a JPEG image from raw bytes. */
   async embedJpg(bytes: Uint8Array | ArrayBuffer): Promise<PdfiumImage> {
-    return this._decodeImage(bytes instanceof Uint8Array ? bytes : new Uint8Array(bytes), 'image/jpeg');
+    return this._decodeImage(
+      bytes instanceof Uint8Array ? bytes : new Uint8Array(bytes),
+      "image/jpeg",
+    );
   }
 
   /** Get the number of pages. */
@@ -370,26 +418,35 @@ export class PdfiumDocument {
    * Decode image bytes to RGBA pixel data via canvas.
    * PDFium's image object APIs require bitmap data.
    */
-  private _decodeImage(bytes: Uint8Array, mimeType: string): Promise<PdfiumImage> {
+  private _decodeImage(
+    bytes: Uint8Array,
+    mimeType: string,
+  ): Promise<PdfiumImage> {
     return new Promise((resolve, reject) => {
       const blob = new Blob([bytes as BlobPart], { type: mimeType });
       const url = URL.createObjectURL(blob);
       const img = new Image();
       img.onload = () => {
         try {
-          const canvas = document.createElement('canvas');
+          const canvas = document.createElement("canvas");
           canvas.width = img.width;
           canvas.height = img.height;
-          const ctx = canvas.getContext('2d');
+          const ctx = canvas.getContext("2d");
           if (!ctx) {
             URL.revokeObjectURL(url);
-            reject(new Error('Canvas 2D context unavailable'));
+            reject(new Error("Canvas 2D context unavailable"));
             return;
           }
           ctx.drawImage(img, 0, 0);
           const imageData = ctx.getImageData(0, 0, canvas.width, canvas.height);
           URL.revokeObjectURL(url);
-          resolve(new PdfiumImage(new Uint8Array(imageData.data.buffer), canvas.width, canvas.height));
+          resolve(
+            new PdfiumImage(
+              new Uint8Array(imageData.data.buffer),
+              canvas.width,
+              canvas.height,
+            ),
+          );
         } catch (err) {
           URL.revokeObjectURL(url);
           reject(err);
@@ -397,7 +454,7 @@ export class PdfiumDocument {
       };
       img.onerror = () => {
         URL.revokeObjectURL(url);
-        reject(new Error('Failed to decode image'));
+        reject(new Error("Failed to decode image"));
       };
       img.src = url;
     });
diff --git a/frontend/src/core/services/pdfiumService.ts b/frontend/src/core/services/pdfiumService.ts
index 2ff996308d..b534140741 100644
--- a/frontend/src/core/services/pdfiumService.ts
+++ b/frontend/src/core/services/pdfiumService.ts
@@ -12,8 +12,8 @@
  * `getSignatures`, `saveAsCopy`, …) wrap the `PdfEngine` interface so callers
  * never have to deal with raw pointers or Tasks.
  */
-import { init, type WrappedPdfiumModule } from '@embedpdf/pdfium';
-import type { FormField, WidgetCoordinates } from '@app/tools/formFill/types';
+import { init, type WrappedPdfiumModule } from "@embedpdf/pdfium";
+import type { FormField, WidgetCoordinates } from "@app/tools/formFill/types";
 
 // PDF form field type constants (matching PDFium C API FPDF_FORMFIELD_* values)
 const FPDF_FORMFIELD_UNKNOWN = 0;
@@ -36,7 +36,8 @@ export const PDF_FORM_FIELD_TYPE = {
   TEXTFIELD: FPDF_FORMFIELD_TEXTFIELD,
   SIGNATURE: FPDF_FORMFIELD_SIGNATURE,
 } as const;
-export type PDF_FORM_FIELD_TYPE = (typeof PDF_FORM_FIELD_TYPE)[keyof typeof PDF_FORM_FIELD_TYPE];
+export type PDF_FORM_FIELD_TYPE =
+  (typeof PDF_FORM_FIELD_TYPE)[keyof typeof PDF_FORM_FIELD_TYPE];
 
 let _initPromise: Promise<WrappedPdfiumModule> | null = null;
 let _module: WrappedPdfiumModule | null = null;
@@ -45,8 +46,8 @@ let _module: WrappedPdfiumModule | null = null;
  * Resolve the absolute WASM URL using the same pattern as LocalEmbedPDF.
  */
 function wasmUrl(): string {
-  const base = (import.meta as any).env?.BASE_URL ?? '/';
-  return `${base}pdfium/pdfium.wasm`.replace(/\/\//g, '/');
+  const base = (import.meta as any).env?.BASE_URL ?? "/";
+  return `${base}pdfium/pdfium.wasm`.replace(/\/\//g, "/");
 }
 
 /**
@@ -62,7 +63,11 @@ export async function getPdfiumModule(): Promise<WrappedPdfiumModule> {
       locateFile: () => wasmUrl(),
     } as any).then((m) => {
       // Call PDFiumExt_Init to ensure extensions (form fill etc.) are set up
-      try { m.PDFiumExt_Init(); } catch { /* already initialized */ }
+      try {
+        m.PDFiumExt_Init();
+      } catch {
+        /* already initialized */
+      }
       _module = m;
       return m;
     });
@@ -80,7 +85,6 @@ export function resetPdfiumModule(): void {
   _docDataPtrs.clear();
 }
 
-
 /**
  * Map of document pointer → WASM data buffer pointer.
  * FPDF_LoadMemDocument does NOT copy the data — it keeps a reference, so the
@@ -107,7 +111,7 @@ export function readAnnotRectAdjusted(
   rectBuf: number,
 ): boolean {
   const ext = (m as any).EPDFAnnot_GetRect;
-  if (typeof ext === 'function') {
+  if (typeof ext === "function") {
     return ext.call(m, annotPtr, rectBuf);
   }
   return m.FPDFAnnot_GetRect(annotPtr, rectBuf);
@@ -124,10 +128,10 @@ export function parseRectToCss(
   rectBuf: number,
   pageHeight: number,
 ): { x: number; y: number; width: number; height: number } {
-  const left = m.pdfium.getValue(rectBuf, 'float');
-  const top = m.pdfium.getValue(rectBuf + 4, 'float'); // FS_RECTF.top  (larger y)
-  const right = m.pdfium.getValue(rectBuf + 8, 'float');
-  const bottom = m.pdfium.getValue(rectBuf + 12, 'float'); // FS_RECTF.bottom (smaller y)
+  const left = m.pdfium.getValue(rectBuf, "float");
+  const top = m.pdfium.getValue(rectBuf + 4, "float"); // FS_RECTF.top  (larger y)
+  const right = m.pdfium.getValue(rectBuf + 8, "float");
+  const bottom = m.pdfium.getValue(rectBuf + 12, "float"); // FS_RECTF.bottom (smaller y)
 
   const pdfLeft = Math.min(left, right);
   const pdfTop = Math.max(top, bottom);
@@ -136,7 +140,7 @@ export function parseRectToCss(
 
   return {
     x: pdfLeft,
-    y: pageHeight - pdfTop,       // flip: CSS y = pageHeight − PDF top
+    y: pageHeight - pdfTop, // flip: CSS y = pageHeight − PDF top
     width: pdfWidth,
     height: pdfHeight,
   };
@@ -164,24 +168,34 @@ export function readEffectivePageBox(
   const buf = m.pdfium.wasmExports.malloc(4 * 4); // 4 floats
 
   const read = (): PageBox | null => {
-    const l = m.pdfium.getValue(buf, 'float');
-    const b = m.pdfium.getValue(buf + 4, 'float');
-    const r = m.pdfium.getValue(buf + 8, 'float');
-    const t = m.pdfium.getValue(buf + 12, 'float');
+    const l = m.pdfium.getValue(buf, "float");
+    const b = m.pdfium.getValue(buf + 4, "float");
+    const r = m.pdfium.getValue(buf + 8, "float");
+    const t = m.pdfium.getValue(buf + 12, "float");
     const w = Math.abs(r - l);
     const h = Math.abs(t - b);
     if (w < 0.01 || h < 0.01) return null; // degenerate
-    return { left: Math.min(l, r), bottom: Math.min(b, t), right: Math.max(l, r), top: Math.max(b, t) };
+    return {
+      left: Math.min(l, r),
+      bottom: Math.min(b, t),
+      right: Math.max(l, r),
+      top: Math.max(b, t),
+    };
   };
 
   let result: PageBox | null = null;
   try {
     // CropBox is the effective visible area
-    if ((m as any).FPDFPage_GetCropBox(pagePtr, buf, buf + 4, buf + 8, buf + 12)) {
+    if (
+      (m as any).FPDFPage_GetCropBox(pagePtr, buf, buf + 4, buf + 8, buf + 12)
+    ) {
       result = read();
     }
     // Fall back to MediaBox
-    if (!result && (m as any).FPDFPage_GetMediaBox(pagePtr, buf, buf + 4, buf + 8, buf + 12)) {
+    if (
+      !result &&
+      (m as any).FPDFPage_GetMediaBox(pagePtr, buf, buf + 4, buf + 8, buf + 12)
+    ) {
       result = read();
     }
   } catch {
@@ -207,10 +221,12 @@ export function readEffectivePageBox(
  * Creates a fresh Uint8Array view of the WASM memory buffer AFTER malloc
  * so it is never stale even if malloc triggered a memory growth.
  */
-function copyToWasmHeap(m: WrappedPdfiumModule, bytes: Uint8Array, ptr: number): void {
-  new Uint8Array(
-    (m.pdfium.wasmExports as any).memory.buffer,
-  ).set(bytes, ptr);
+function copyToWasmHeap(
+  m: WrappedPdfiumModule,
+  bytes: Uint8Array,
+  ptr: number,
+): void {
+  new Uint8Array((m.pdfium.wasmExports as any).memory.buffer).set(bytes, ptr);
 }
 
 /**
@@ -227,7 +243,7 @@ export async function openRawDocument(
   const ptr = m.pdfium.wasmExports.malloc(len);
   copyToWasmHeap(m, bytes, ptr);
 
-  const docPtr = m.FPDF_LoadMemDocument(ptr, len, password ?? '');
+  const docPtr = m.FPDF_LoadMemDocument(ptr, len, password ?? "");
   if (!docPtr) {
     m.pdfium.wasmExports.free(ptr);
     const err = m.FPDF_GetLastError();
@@ -261,7 +277,10 @@ export async function closeRawDocument(docPtr: number): Promise<void> {
  * Synchronous close + buffer free — for use inside `finally` blocks that
  * already have the module reference.
  */
-export function closeDocAndFreeBuffer(m: WrappedPdfiumModule, docPtr: number): void {
+export function closeDocAndFreeBuffer(
+  m: WrappedPdfiumModule,
+  docPtr: number,
+): void {
   m.FPDF_CloseDocument(docPtr);
   const dataPtr = _docDataPtrs.get(docPtr);
   if (dataPtr) {
@@ -298,8 +317,12 @@ export async function getRawPageSize(
  * Read a UTF-16LE string from PDFium memory at the given pointer up to `len`
  * bytes (including the trailing NUL pair).
  */
-export function readUtf16(m: WrappedPdfiumModule, ptr: number, byteLen: number): string {
-  if (byteLen <= 2 || !ptr) return '';
+export function readUtf16(
+  m: WrappedPdfiumModule,
+  ptr: number,
+  byteLen: number,
+): string {
+  if (byteLen <= 2 || !ptr) return "";
   return m.pdfium.UTF16ToString(ptr);
 }
 
@@ -315,7 +338,6 @@ export function writeUtf16(m: WrappedPdfiumModule, str: string): number {
   return ptr;
 }
 
-
 export interface PdfiumFormField {
   name: string;
   type: PDF_FORM_FIELD_TYPE;
@@ -331,7 +353,7 @@ export interface PdfiumFormField {
 
 export interface PdfiumWidgetRect {
   pageIndex: number;
-  x: number;       // CSS upper-left origin (after y-flip)
+  x: number; // CSS upper-left origin (after y-flip)
   y: number;
   width: number;
   height: number;
@@ -356,7 +378,7 @@ export async function extractFormFields(
   try {
     docPtr = await openRawDocumentSafe(data, password);
   } catch (err) {
-    console.error('[extractFormFields] openRawDocumentSafe failed:', err);
+    console.error("[extractFormFields] openRawDocumentSafe failed:", err);
     if (err instanceof WebAssembly.RuntimeError) resetPdfiumModule();
     throw err;
   }
@@ -367,8 +389,13 @@ export async function extractFormFields(
     const formEnvPtr = m.PDFiumExt_InitFormFillEnvironment(docPtr, formInfoPtr);
 
     const pageCount = m.FPDF_GetPageCount(docPtr);
-    console.debug('[extractFormFields] docPtr=%d formEnvPtr=%d pageCount=%d dataSize=%d',
-      docPtr, formEnvPtr, pageCount, data instanceof Uint8Array ? data.length : data.byteLength);
+    console.debug(
+      "[extractFormFields] docPtr=%d formEnvPtr=%d pageCount=%d dataSize=%d",
+      docPtr,
+      formEnvPtr,
+      pageCount,
+      data instanceof Uint8Array ? data.length : data.byteLength,
+    );
     // Map: fieldName → PdfiumFormField (to merge widgets across pages)
     const fieldMap = new Map<string, PdfiumFormField>();
 
@@ -377,7 +404,11 @@ export async function extractFormFields(
       try {
         pagePtr = m.FPDF_LoadPage(docPtr, pageIdx);
       } catch (err) {
-        console.warn('[extractFormFields] FPDF_LoadPage crashed for page', pageIdx, err);
+        console.warn(
+          "[extractFormFields] FPDF_LoadPage crashed for page",
+          pageIdx,
+          err,
+        );
         if (err instanceof WebAssembly.RuntimeError) {
           resetPdfiumModule();
           throw err;
@@ -385,7 +416,10 @@ export async function extractFormFields(
         continue;
       }
       if (!pagePtr) {
-        console.warn('[extractFormFields] FPDF_LoadPage returned 0 for page', pageIdx);
+        console.warn(
+          "[extractFormFields] FPDF_LoadPage returned 0 for page",
+          pageIdx,
+        );
         continue;
       }
 
@@ -394,7 +428,11 @@ export async function extractFormFields(
         try {
           m.FORM_OnAfterLoadPage(pagePtr, formEnvPtr);
         } catch (err) {
-          console.warn('[extractFormFields] FORM_OnAfterLoadPage crashed for page', pageIdx, err);
+          console.warn(
+            "[extractFormFields] FORM_OnAfterLoadPage crashed for page",
+            pageIdx,
+            err,
+          );
         }
       }
 
@@ -407,44 +445,87 @@ export async function extractFormFields(
 
       if (pageIdx === 0) {
         console.debug(
-          '[extractFormFields] page 0 box: left=%.2f bottom=%.2f right=%.2f top=%.2f  cropW=%.2f cropH=%.2f  FPDF_H=%.2f',
-          pageBox.left, pageBox.bottom, pageBox.right, pageBox.top,
-          cropWidth, cropHeight, m.FPDF_GetPageHeightF(pagePtr),
+          "[extractFormFields] page 0 box: left=%.2f bottom=%.2f right=%.2f top=%.2f  cropW=%.2f cropH=%.2f  FPDF_H=%.2f",
+          pageBox.left,
+          pageBox.bottom,
+          pageBox.right,
+          pageBox.top,
+          cropWidth,
+          cropHeight,
+          m.FPDF_GetPageHeightF(pagePtr),
         );
       }
 
       for (let annotIdx = 0; annotIdx < annotCount; annotIdx++) {
         try {
-          this_extractAnnotation(m, formEnvPtr, pagePtr, pageIdx, pageBox, cropWidth, cropHeight, annotIdx, fieldMap);
+          this_extractAnnotation(
+            m,
+            formEnvPtr,
+            pagePtr,
+            pageIdx,
+            pageBox,
+            cropWidth,
+            cropHeight,
+            annotIdx,
+            fieldMap,
+          );
         } catch (annotErr) {
-          console.warn('[extractFormFields] Annotation %d on page %d crashed:', annotIdx, pageIdx, annotErr);
+          console.warn(
+            "[extractFormFields] Annotation %d on page %d crashed:",
+            annotIdx,
+            pageIdx,
+            annotErr,
+          );
         }
       }
 
       if (formEnvPtr) {
-        try { m.FORM_OnBeforeClosePage(pagePtr, formEnvPtr); } catch { /* best-effort */ }
+        try {
+          m.FORM_OnBeforeClosePage(pagePtr, formEnvPtr);
+        } catch {
+          /* best-effort */
+        }
+      }
+      try {
+        m.FPDF_ClosePage(pagePtr);
+      } catch {
+        /* best-effort */
       }
-      try { m.FPDF_ClosePage(pagePtr); } catch { /* best-effort */ }
     }
 
     // Cleanup form environment
     if (formEnvPtr) {
-      try { m.PDFiumExt_ExitFormFillEnvironment(formEnvPtr); } catch { /* */ }
+      try {
+        m.PDFiumExt_ExitFormFillEnvironment(formEnvPtr);
+      } catch {
+        /* */
+      }
     }
     if (formInfoPtr) {
-      try { m.PDFiumExt_CloseFormFillInfo(formInfoPtr); } catch { /* */ }
+      try {
+        m.PDFiumExt_CloseFormFillInfo(formInfoPtr);
+      } catch {
+        /* */
+      }
     }
 
-    console.debug('[extractFormFields] Extracted %d fields', fieldMap.size);
+    console.debug("[extractFormFields] Extracted %d fields", fieldMap.size);
     return Array.from(fieldMap.values());
   } catch (err) {
     if (err instanceof WebAssembly.RuntimeError) {
-      console.error('[extractFormFields] WASM RuntimeError — resetting module:', err);
+      console.error(
+        "[extractFormFields] WASM RuntimeError — resetting module:",
+        err,
+      );
       resetPdfiumModule();
     }
     throw err;
   } finally {
-    try { closeDocAndFreeBuffer(m, docPtr); } catch { /* best-effort */ }
+    try {
+      closeDocAndFreeBuffer(m, docPtr);
+    } catch {
+      /* best-effort */
+    }
   }
 }
 
@@ -483,8 +564,10 @@ function this_extractAnnotation(
       : 0;
 
     // Get field name (requires a valid form environment pointer)
-    const nameLen = formEnvPtr ? m.FPDFAnnot_GetFormFieldName(formEnvPtr, annotPtr, 0, 0) : 0;
-    let fieldName = '';
+    const nameLen = formEnvPtr
+      ? m.FPDFAnnot_GetFormFieldName(formEnvPtr, annotPtr, 0, 0)
+      : 0;
+    let fieldName = "";
     if (nameLen > 0) {
       const nameBuf = m.pdfium.wasmExports.malloc(nameLen);
       m.FPDFAnnot_GetFormFieldName(formEnvPtr, annotPtr, nameBuf, nameLen);
@@ -493,8 +576,10 @@ function this_extractAnnotation(
     }
 
     // Get field value (requires a valid form environment pointer)
-    const valLen = formEnvPtr ? m.FPDFAnnot_GetFormFieldValue(formEnvPtr, annotPtr, 0, 0) : 0;
-    let fieldValue = '';
+    const valLen = formEnvPtr
+      ? m.FPDFAnnot_GetFormFieldValue(formEnvPtr, annotPtr, 0, 0)
+      : 0;
+    let fieldValue = "";
     if (valLen > 0) {
       const valBuf = m.pdfium.wasmExports.malloc(valLen);
       m.FPDFAnnot_GetFormFieldValue(formEnvPtr, annotPtr, valBuf, valLen);
@@ -503,12 +588,16 @@ function this_extractAnnotation(
     }
 
     // Get field flags (requires a valid form environment pointer)
-    const fieldFlags = formEnvPtr ? m.FPDFAnnot_GetFormFieldFlags(formEnvPtr, annotPtr) : 0;
-    const isReadOnly = (fieldFlags & 1) !== 0;  // FORMFLAG_READONLY = 1
-    const isRequired = (fieldFlags & 2) !== 0;  // FORMFLAG_REQUIRED = 2
+    const fieldFlags = formEnvPtr
+      ? m.FPDFAnnot_GetFormFieldFlags(formEnvPtr, annotPtr)
+      : 0;
+    const isReadOnly = (fieldFlags & 1) !== 0; // FORMFLAG_READONLY = 1
+    const isRequired = (fieldFlags & 2) !== 0; // FORMFLAG_REQUIRED = 2
 
     // Is checked (for checkboxes/radios)
-    const isChecked = formEnvPtr ? m.FPDFAnnot_IsChecked(formEnvPtr, annotPtr) : false;
+    const isChecked = formEnvPtr
+      ? m.FPDFAnnot_IsChecked(formEnvPtr, annotPtr)
+      : false;
 
     // Get rect using standard FPDFAnnot_GetRect for known struct layout,
     // then apply explicit CropBox adjustment (mirrors the Java PDFBox backend).
@@ -519,16 +608,16 @@ function this_extractAnnotation(
       hasRect = m.FPDFAnnot_GetRect(annotPtr, rectBuf);
     } catch {
       m.pdfium.wasmExports.free(rectBuf);
-      throw new Error('FPDFAnnot_GetRect crashed');
+      throw new Error("FPDFAnnot_GetRect crashed");
     }
 
     let widgetRect: PdfiumWidgetRect | null = null;
     if (hasRect) {
       // Standard FS_RECTF: {left, bottom, right, top} — raw MediaBox coordinates
-      const rawLeft = m.pdfium.getValue(rectBuf, 'float');
-      const rawBottom = m.pdfium.getValue(rectBuf + 4, 'float');
-      const rawRight = m.pdfium.getValue(rectBuf + 8, 'float');
-      const rawTop = m.pdfium.getValue(rectBuf + 12, 'float');
+      const rawLeft = m.pdfium.getValue(rectBuf, "float");
+      const rawBottom = m.pdfium.getValue(rectBuf + 4, "float");
+      const rawRight = m.pdfium.getValue(rectBuf + 8, "float");
+      const rawTop = m.pdfium.getValue(rectBuf + 12, "float");
 
       const annotLeft = Math.min(rawLeft, rawRight);
       const annotBottom = Math.min(rawBottom, rawTop);
@@ -548,9 +637,18 @@ function this_extractAnnotation(
       // Diagnostic log for first annotation on first page
       if (pageIdx === 0 && annotIdx < 2) {
         console.debug(
-          '[extractFormFields] annot[%d] raw rect: L=%.2f B=%.2f R=%.2f T=%.2f → css: x=%.2f y=%.2f w=%.2f h=%.2f (cropAdj: relX=%.2f relY=%.2f)',
-          annotIdx, annotLeft, annotBottom, annotRight, annotTop,
-          cssX, cssY, pdfW, pdfH, relativeX, relativeY,
+          "[extractFormFields] annot[%d] raw rect: L=%.2f B=%.2f R=%.2f T=%.2f → css: x=%.2f y=%.2f w=%.2f h=%.2f (cropAdj: relX=%.2f relY=%.2f)",
+          annotIdx,
+          annotLeft,
+          annotBottom,
+          annotRight,
+          annotTop,
+          cssX,
+          cssY,
+          pdfW,
+          pdfH,
+          relativeX,
+          relativeY,
         );
       }
 
@@ -564,10 +662,10 @@ function this_extractAnnotation(
 
       // Get font size from default appearance
       try {
-        const daLen = m.FPDFAnnot_GetStringValue(annotPtr, 'DA', 0, 0);
+        const daLen = m.FPDFAnnot_GetStringValue(annotPtr, "DA", 0, 0);
         if (daLen > 0) {
           const daBuf = m.pdfium.wasmExports.malloc(daLen);
-          m.FPDFAnnot_GetStringValue(annotPtr, 'DA', daBuf, daLen);
+          m.FPDFAnnot_GetStringValue(annotPtr, "DA", daBuf, daLen);
           const daStr = readUtf16(m, daBuf, daLen);
           m.pdfium.wasmExports.free(daBuf);
           const tfMatch = daStr.match(/(\d+(?:\.\d+)?)\s+Tf/);
@@ -581,12 +679,25 @@ function this_extractAnnotation(
       }
 
       // Get export value and checked state for checkbox/radio
-      if (fieldType === PDF_FORM_FIELD_TYPE.CHECKBOX || fieldType === PDF_FORM_FIELD_TYPE.RADIOBUTTON) {
+      if (
+        fieldType === PDF_FORM_FIELD_TYPE.CHECKBOX ||
+        fieldType === PDF_FORM_FIELD_TYPE.RADIOBUTTON
+      ) {
         try {
-          const expLen = m.FPDFAnnot_GetFormFieldExportValue(formEnvPtr, annotPtr, 0, 0);
+          const expLen = m.FPDFAnnot_GetFormFieldExportValue(
+            formEnvPtr,
+            annotPtr,
+            0,
+            0,
+          );
           if (expLen > 0) {
             const expBuf = m.pdfium.wasmExports.malloc(expLen);
-            m.FPDFAnnot_GetFormFieldExportValue(formEnvPtr, annotPtr, expBuf, expLen);
+            m.FPDFAnnot_GetFormFieldExportValue(
+              formEnvPtr,
+              annotPtr,
+              expBuf,
+              expLen,
+            );
             widgetRect.exportValue = readUtf16(m, expBuf, expLen);
             m.pdfium.wasmExports.free(expBuf);
           }
@@ -608,11 +719,23 @@ function this_extractAnnotation(
       try {
         const optCount = m.FPDFAnnot_GetOptionCount(formEnvPtr, annotPtr);
         for (let oi = 0; oi < optCount; oi++) {
-          const optLabelLen = m.FPDFAnnot_GetOptionLabel(formEnvPtr, annotPtr, oi, 0, 0);
-          let optLabel = '';
+          const optLabelLen = m.FPDFAnnot_GetOptionLabel(
+            formEnvPtr,
+            annotPtr,
+            oi,
+            0,
+            0,
+          );
+          let optLabel = "";
           if (optLabelLen > 0) {
             const optBuf = m.pdfium.wasmExports.malloc(optLabelLen);
-            m.FPDFAnnot_GetOptionLabel(formEnvPtr, annotPtr, oi, optBuf, optLabelLen);
+            m.FPDFAnnot_GetOptionLabel(
+              formEnvPtr,
+              annotPtr,
+              oi,
+              optBuf,
+              optLabelLen,
+            );
             optLabel = readUtf16(m, optBuf, optLabelLen);
             m.pdfium.wasmExports.free(optBuf);
           }
@@ -689,7 +812,7 @@ export async function extractSignatures(
         m.FPDFSignatureObj_GetContents(sigPtr, buf, contentsLen);
         contents = new Uint8Array(contentsLen);
         for (let j = 0; j < contentsLen; j++) {
-          contents[j] = m.pdfium.getValue(buf + j, 'i8') & 0xff;
+          contents[j] = m.pdfium.getValue(buf + j, "i8") & 0xff;
         }
         m.pdfium.wasmExports.free(buf);
       }
@@ -701,14 +824,14 @@ export async function extractSignatures(
         const brBuf = m.pdfium.wasmExports.malloc(brLen * 4);
         m.FPDFSignatureObj_GetByteRange(sigPtr, brBuf, brLen);
         for (let j = 0; j < brLen; j++) {
-          byteRange.push(m.pdfium.getValue(brBuf + j * 4, 'i32'));
+          byteRange.push(m.pdfium.getValue(brBuf + j * 4, "i32"));
         }
         m.pdfium.wasmExports.free(brBuf);
       }
 
       // SubFilter
       const sfLen = m.FPDFSignatureObj_GetSubFilter(sigPtr, 0, 0);
-      let subFilter = '';
+      let subFilter = "";
       if (sfLen > 0) {
         const sfBuf = m.pdfium.wasmExports.malloc(sfLen);
         m.FPDFSignatureObj_GetSubFilter(sigPtr, sfBuf, sfLen);
@@ -718,7 +841,7 @@ export async function extractSignatures(
 
       // Reason
       const reasonLen = m.FPDFSignatureObj_GetReason(sigPtr, 0, 0);
-      let reason = '';
+      let reason = "";
       if (reasonLen > 0) {
         const reasonBuf = m.pdfium.wasmExports.malloc(reasonLen);
         m.FPDFSignatureObj_GetReason(sigPtr, reasonBuf, reasonLen);
@@ -728,7 +851,7 @@ export async function extractSignatures(
 
       // Time
       const timeLen = m.FPDFSignatureObj_GetTime(sigPtr, 0, 0);
-      let time = '';
+      let time = "";
       if (timeLen > 0) {
         const timeBuf = m.pdfium.wasmExports.malloc(timeLen);
         m.FPDFSignatureObj_GetTime(sigPtr, timeBuf, timeLen);
@@ -748,7 +871,6 @@ export async function extractSignatures(
   }
 }
 
-
 /**
  * Render a single page to an ImageData-like bitmap.
  */
@@ -788,10 +910,14 @@ export async function renderPageToBitmap(
         const srcOff = y * stride + x * 4;
         const dstOff = (y * w + x) * 4;
         // BGRA → RGBA
-        pixelData[dstOff] = m.pdfium.getValue(bufferPtr + srcOff + 2, 'i8') & 0xff;
-        pixelData[dstOff + 1] = m.pdfium.getValue(bufferPtr + srcOff + 1, 'i8') & 0xff;
-        pixelData[dstOff + 2] = m.pdfium.getValue(bufferPtr + srcOff, 'i8') & 0xff;
-        pixelData[dstOff + 3] = m.pdfium.getValue(bufferPtr + srcOff + 3, 'i8') & 0xff;
+        pixelData[dstOff] =
+          m.pdfium.getValue(bufferPtr + srcOff + 2, "i8") & 0xff;
+        pixelData[dstOff + 1] =
+          m.pdfium.getValue(bufferPtr + srcOff + 1, "i8") & 0xff;
+        pixelData[dstOff + 2] =
+          m.pdfium.getValue(bufferPtr + srcOff, "i8") & 0xff;
+        pixelData[dstOff + 3] =
+          m.pdfium.getValue(bufferPtr + srcOff + 3, "i8") & 0xff;
       }
     }
 
@@ -808,7 +934,7 @@ export interface PdfiumLink {
   id: string;
   annotIndex: number;
   rect: { x: number; y: number; width: number; height: number };
-  type: 'internal' | 'external' | 'unknown';
+  type: "internal" | "external" | "unknown";
   targetPage?: number;
   uri?: string;
 }
@@ -859,7 +985,7 @@ export async function extractLinksFromPage(
 
       // Try to get link object
       const linkPtr = m.FPDFAnnot_GetLink(annotPtr);
-      let linkType: 'internal' | 'external' | 'unknown' = 'unknown';
+      let linkType: "internal" | "external" | "unknown" = "unknown";
       let targetPage: number | undefined;
       let uri: string | undefined;
 
@@ -876,24 +1002,24 @@ export async function extractLinksFromPage(
               m.FPDFAction_GetURIPath(docPtr, actionPtr, uriBuf, uriLen);
               uri = m.pdfium.UTF8ToString(uriBuf);
               m.pdfium.wasmExports.free(uriBuf);
-              linkType = 'external';
+              linkType = "external";
             }
           } else if (actionType === 1) {
             // PDFACTION_GOTO = 1
             const destPtr = m.FPDFAction_GetDest(docPtr, actionPtr);
             if (destPtr) {
               targetPage = m.FPDFDest_GetDestPageIndex(docPtr, destPtr);
-              linkType = 'internal';
+              linkType = "internal";
             }
           }
         }
 
         // Check for direct destination (no action)
-        if (linkType === 'unknown') {
+        if (linkType === "unknown") {
           const destPtr = m.FPDFLink_GetDest(docPtr, linkPtr);
           if (destPtr) {
             targetPage = m.FPDFDest_GetDestPageIndex(docPtr, destPtr);
-            linkType = 'internal';
+            linkType = "internal";
           }
         }
       }
@@ -917,14 +1043,13 @@ export async function extractLinksFromPage(
   }
 }
 
-
 /**
  * Create a new empty PDF document, returning its raw data.
  */
 export async function createEmptyDocument(): Promise<ArrayBuffer> {
   const m = await getPdfiumModule();
   const docPtr = m.FPDF_CreateNewDocument();
-  if (!docPtr) throw new Error('PDFium: failed to create new document');
+  if (!docPtr) throw new Error("PDFium: failed to create new document");
   const writerPtr = m.PDFiumExt_OpenFileWriter();
   m.PDFiumExt_SaveAsCopy(docPtr, writerPtr);
   const size = m.PDFiumExt_GetFileWriterSize(writerPtr);
@@ -933,7 +1058,7 @@ export async function createEmptyDocument(): Promise<ArrayBuffer> {
   const result = new ArrayBuffer(size);
   const view = new Uint8Array(result);
   for (let i = 0; i < size; i++) {
-    view[i] = m.pdfium.getValue(outBuf + i, 'i8') & 0xff;
+    view[i] = m.pdfium.getValue(outBuf + i, "i8") & 0xff;
   }
   m.pdfium.wasmExports.free(outBuf);
   m.PDFiumExt_CloseFileWriter(writerPtr);
@@ -954,7 +1079,7 @@ export async function saveRawDocument(docPtr: number): Promise<ArrayBuffer> {
   const result = new ArrayBuffer(size);
   const view = new Uint8Array(result);
   for (let i = 0; i < size; i++) {
-    view[i] = m.pdfium.getValue(outBuf + i, 'i8') & 0xff;
+    view[i] = m.pdfium.getValue(outBuf + i, "i8") & 0xff;
   }
   m.pdfium.wasmExports.free(outBuf);
   m.PDFiumExt_CloseFileWriter(writerPtr);
@@ -972,7 +1097,12 @@ export async function importPages(
   insertIndex?: number,
 ): Promise<boolean> {
   const m = await getPdfiumModule();
-  return m.FPDF_ImportPages(destDocPtr, srcDocPtr, pageRange ?? '', insertIndex ?? 0);
+  return m.FPDF_ImportPages(
+    destDocPtr,
+    srcDocPtr,
+    pageRange ?? "",
+    insertIndex ?? 0,
+  );
 }
 
 /**
@@ -1015,7 +1145,14 @@ export async function getMetadata(
   const m = await getPdfiumModule();
   const docPtr = await openRawDocumentSafe(data, password);
   try {
-    const tags = ['Title', 'Author', 'Subject', 'Keywords', 'Creator', 'Producer'];
+    const tags = [
+      "Title",
+      "Author",
+      "Subject",
+      "Keywords",
+      "Creator",
+      "Producer",
+    ];
     const meta: Record<string, string> = {};
     for (const tag of tags) {
       const len = m.FPDF_GetMetaText(docPtr, tag, 0, 0);
@@ -1072,7 +1209,8 @@ export async function extractSignatureFieldRects(
         if (!annotPtr) continue;
 
         const subtype = m.FPDFAnnot_GetSubtype(annotPtr);
-        if (subtype !== 20) { // WIDGET
+        if (subtype !== 20) {
+          // WIDGET
           m.FPDFPage_CloseAnnot(annotPtr);
           continue;
         }
@@ -1087,8 +1225,13 @@ export async function extractSignatureFieldRects(
         }
 
         // Get field name
-        const nameLen = m.FPDFAnnot_GetFormFieldName(formEnvPtr, annotPtr, 0, 0);
-        let name = '';
+        const nameLen = m.FPDFAnnot_GetFormFieldName(
+          formEnvPtr,
+          annotPtr,
+          0,
+          0,
+        );
+        let name = "";
         if (nameLen > 0) {
           const nameBuf = m.pdfium.wasmExports.malloc(nameLen);
           m.FPDFAnnot_GetFormFieldName(formEnvPtr, annotPtr, nameBuf, nameLen);
@@ -1100,10 +1243,10 @@ export async function extractSignatureFieldRects(
         const rectBuf = m.pdfium.wasmExports.malloc(4 * 4);
         const hasRect = m.FPDFAnnot_GetRect(annotPtr, rectBuf);
         if (hasRect) {
-          const rawLeft = m.pdfium.getValue(rectBuf, 'float');
-          const rawBottom = m.pdfium.getValue(rectBuf + 4, 'float');
-          const rawRight = m.pdfium.getValue(rectBuf + 8, 'float');
-          const rawTop = m.pdfium.getValue(rectBuf + 12, 'float');
+          const rawLeft = m.pdfium.getValue(rectBuf, "float");
+          const rawBottom = m.pdfium.getValue(rectBuf + 4, "float");
+          const rawRight = m.pdfium.getValue(rectBuf + 8, "float");
+          const rawTop = m.pdfium.getValue(rectBuf + 12, "float");
 
           const aLeft = Math.min(rawLeft, rawRight);
           const aBottom = Math.min(rawBottom, rawTop);
@@ -1205,20 +1348,30 @@ async function renderWidgetAppearance(
   let ok = false;
   try {
     ok = !!m.EPDF_RenderAnnotBitmap(
-      bitmapPtr, pagePtr, annotPtr,
-      AP_MODE_NORMAL, matrixPtr,
+      bitmapPtr,
+      pagePtr,
+      annotPtr,
+      AP_MODE_NORMAL,
+      matrixPtr,
       RENDER_FLAG_REVERSE_BYTE_ORDER,
     );
-  } catch { /* Extension not available */ }
+  } catch {
+    /* Extension not available */
+  }
   m.pdfium.wasmExports.free(matrixPtr);
   m.FPDFBitmap_Destroy(bitmapPtr);
 
   let imageData: ImageData | null = null;
   if (ok) {
-    const rgba = new Uint8ClampedArray(pdfiumWasm.HEAPU8.buffer.slice(heapPtr, heapPtr + bytes));
+    const rgba = new Uint8ClampedArray(
+      pdfiumWasm.HEAPU8.buffer.slice(heapPtr, heapPtr + bytes),
+    );
     let hasVisible = false;
     for (let i = 3; i < rgba.length; i += 4) {
-      if (rgba[i] > 0) { hasVisible = true; break; }
+      if (rgba[i] > 0) {
+        hasVisible = true;
+        break;
+      }
     }
     if (hasVisible) imageData = new ImageData(rgba, wDev, hDev);
   }
@@ -1236,16 +1389,42 @@ async function renderWidgetAppearance(
     const startY = Math.round(-cssY * dpr);
 
     try {
-      m.FPDF_RenderPageBitmap(bmp2, pagePtr, startX, startY, fullW, fullH, 0, 0x01 | 0x10);
-      m.FPDF_FFLDraw(formEnvPtr, bmp2, pagePtr, startX, startY, fullW, fullH, 0, 0x01 | 0x10);
-    } catch { /* fallback not available */ }
+      m.FPDF_RenderPageBitmap(
+        bmp2,
+        pagePtr,
+        startX,
+        startY,
+        fullW,
+        fullH,
+        0,
+        0x01 | 0x10,
+      );
+      m.FPDF_FFLDraw(
+        formEnvPtr,
+        bmp2,
+        pagePtr,
+        startX,
+        startY,
+        fullW,
+        fullH,
+        0,
+        0x01 | 0x10,
+      );
+    } catch {
+      /* fallback not available */
+    }
 
     m.FPDFBitmap_Destroy(bmp2);
 
-    const rgba2 = new Uint8ClampedArray(pdfiumWasm.HEAPU8.buffer.slice(heap2, heap2 + bytes));
+    const rgba2 = new Uint8ClampedArray(
+      pdfiumWasm.HEAPU8.buffer.slice(heap2, heap2 + bytes),
+    );
     let hasVisible2 = false;
     for (let i = 3; i < rgba2.length; i += 4) {
-      if (rgba2[i] > 0) { hasVisible2 = true; break; }
+      if (rgba2[i] > 0) {
+        hasVisible2 = true;
+        break;
+      }
     }
     if (hasVisible2) imageData = new ImageData(rgba2, wDev, hDev);
     m.pdfium.wasmExports.free(heap2);
@@ -1302,7 +1481,8 @@ export async function renderSignatureFieldAppearances(
         if (!annotPtr) continue;
 
         const subtype = m.FPDFAnnot_GetSubtype(annotPtr);
-        if (subtype !== 20) { // FPDF_ANNOT_WIDGET
+        if (subtype !== 20) {
+          // FPDF_ANNOT_WIDGET
           m.FPDFPage_CloseAnnot(annotPtr);
           continue;
         }
@@ -1317,8 +1497,13 @@ export async function renderSignatureFieldAppearances(
         }
 
         // --- field name ---
-        const nameLen = m.FPDFAnnot_GetFormFieldName(formEnvPtr, annotPtr, 0, 0);
-        let name = '';
+        const nameLen = m.FPDFAnnot_GetFormFieldName(
+          formEnvPtr,
+          annotPtr,
+          0,
+          0,
+        );
+        let name = "";
         if (nameLen > 0) {
           const nameBuf = m.pdfium.wasmExports.malloc(nameLen);
           m.FPDFAnnot_GetFormFieldName(formEnvPtr, annotPtr, nameBuf, nameLen);
@@ -1344,10 +1529,10 @@ export async function renderSignatureFieldAppearances(
         }
 
         // Standard FS_RECTF layout: {left, bottom, right, top}
-        const rawLeft = m.pdfium.getValue(rectBuf, 'float');
-        const rawBottom = m.pdfium.getValue(rectBuf + 4, 'float');
-        const rawRight = m.pdfium.getValue(rectBuf + 8, 'float');
-        const rawTop = m.pdfium.getValue(rectBuf + 12, 'float');
+        const rawLeft = m.pdfium.getValue(rectBuf, "float");
+        const rawBottom = m.pdfium.getValue(rectBuf + 4, "float");
+        const rawRight = m.pdfium.getValue(rectBuf + 8, "float");
+        const rawTop = m.pdfium.getValue(rectBuf + 12, "float");
         m.pdfium.wasmExports.free(rectBuf);
 
         // Normalise
@@ -1367,9 +1552,10 @@ export async function renderSignatureFieldAppearances(
         let imageData: ImageData | null = null;
 
         if (pdfW > 0.5 && pdfH > 0.5) {
-          const dpr = typeof window !== 'undefined'
-            ? Math.min(window.devicePixelRatio || 1, 3)
-            : 1;
+          const dpr =
+            typeof window !== "undefined"
+              ? Math.min(window.devicePixelRatio || 1, 3)
+              : 1;
           const wDev = Math.max(1, Math.round(pdfW * dpr));
           const hDev = Math.max(1, Math.round(pdfH * dpr));
           const stride = wDev * 4;
@@ -1377,7 +1563,13 @@ export async function renderSignatureFieldAppearances(
           const pdfiumWasm = m.pdfium as any;
 
           const heapPtr = m.pdfium.wasmExports.malloc(bytes);
-          const bitmapPtr = m.FPDFBitmap_CreateEx(wDev, hDev, 4 /* BGRA */, heapPtr, stride);
+          const bitmapPtr = m.FPDFBitmap_CreateEx(
+            wDev,
+            hDev,
+            4 /* BGRA */,
+            heapPtr,
+            stride,
+          );
           m.FPDFBitmap_FillRect(bitmapPtr, 0, 0, wDev, hDev, 0x00000000);
 
           // Build user→device matrix: maps annotation rect to bitmap.
@@ -1386,15 +1578,20 @@ export async function renderSignatureFieldAppearances(
           const sy = hDev / pdfH;
           const matrixPtr = m.pdfium.wasmExports.malloc(6 * 4);
           const matrixView = new Float32Array(
-            pdfiumWasm.HEAPF32.buffer, matrixPtr, 6,
+            pdfiumWasm.HEAPF32.buffer,
+            matrixPtr,
+            6,
           );
           matrixView.set([sx, 0, 0, -sy, -sx * annotLeft, sy * annotTop]);
 
           let ok = false;
           try {
             ok = !!m.EPDF_RenderAnnotBitmap(
-              bitmapPtr, pagePtr, annotPtr,
-              AP_MODE_NORMAL, matrixPtr,
+              bitmapPtr,
+              pagePtr,
+              annotPtr,
+              AP_MODE_NORMAL,
+              matrixPtr,
               RENDER_FLAG_REVERSE_BYTE_ORDER,
             );
           } catch {
@@ -1410,7 +1607,10 @@ export async function renderSignatureFieldAppearances(
             );
             let hasVisible = false;
             for (let i = 3; i < rgba.length; i += 4) {
-              if (rgba[i] > 0) { hasVisible = true; break; }
+              if (rgba[i] > 0) {
+                hasVisible = true;
+                break;
+              }
             }
             if (hasVisible) {
               imageData = new ImageData(rgba, wDev, hDev);
@@ -1435,14 +1635,26 @@ export async function renderSignatureFieldAppearances(
             try {
               // Draw page content first (provides background under signature)
               m.FPDF_RenderPageBitmap(
-                bmp2, pagePtr, startX, startY, fullW, fullH, 0,
+                bmp2,
+                pagePtr,
+                startX,
+                startY,
+                fullW,
+                fullH,
+                0,
                 0x01 | 0x10, // FPDF_ANNOT | FPDF_REVERSE_BYTE_ORDER
               );
               // Draw form fill layer on top (includes signature appearances)
               m.FPDF_FFLDraw(
-                formEnvPtr, bmp2, pagePtr,
-                startX, startY, fullW, fullH,
-                0, 0x01 | 0x10,
+                formEnvPtr,
+                bmp2,
+                pagePtr,
+                startX,
+                startY,
+                fullW,
+                fullH,
+                0,
+                0x01 | 0x10,
               );
             } catch {
               // FPDF_FFLDraw not available or failed.
@@ -1455,7 +1667,10 @@ export async function renderSignatureFieldAppearances(
             );
             let hasVisible2 = false;
             for (let i = 3; i < rgba2.length; i += 4) {
-              if (rgba2[i] > 0) { hasVisible2 = true; break; }
+              if (rgba2[i] > 0) {
+                hasVisible2 = true;
+                break;
+              }
             }
             if (hasVisible2) {
               imageData = new ImageData(rgba2, wDev, hDev);
@@ -1527,16 +1742,26 @@ export async function renderButtonFieldAppearances(
         if (!annotPtr) continue;
 
         const subtype = m.FPDFAnnot_GetSubtype(annotPtr);
-        if (subtype !== 20) { m.FPDFPage_CloseAnnot(annotPtr); continue; }
+        if (subtype !== 20) {
+          m.FPDFPage_CloseAnnot(annotPtr);
+          continue;
+        }
 
-        const fieldType = formEnvPtr ? m.FPDFAnnot_GetFormFieldType(formEnvPtr, annotPtr) : 0;
+        const fieldType = formEnvPtr
+          ? m.FPDFAnnot_GetFormFieldType(formEnvPtr, annotPtr)
+          : 0;
         if (fieldType !== PDF_FORM_FIELD_TYPE.PUSHBUTTON) {
           m.FPDFPage_CloseAnnot(annotPtr);
           continue;
         }
 
-        const nameLen = m.FPDFAnnot_GetFormFieldName(formEnvPtr, annotPtr, 0, 0);
-        let btnName = '';
+        const nameLen = m.FPDFAnnot_GetFormFieldName(
+          formEnvPtr,
+          annotPtr,
+          0,
+          0,
+        );
+        let btnName = "";
         if (nameLen > 0) {
           const nameBuf = m.pdfium.wasmExports.malloc(nameLen);
           m.FPDFAnnot_GetFormFieldName(formEnvPtr, annotPtr, nameBuf, nameLen);
@@ -1546,16 +1771,23 @@ export async function renderButtonFieldAppearances(
 
         const rectBuf = m.pdfium.wasmExports.malloc(4 * 4);
         let hasRect = false;
-        try { hasRect = m.FPDFAnnot_GetRect(annotPtr, rectBuf); }
-        catch { m.pdfium.wasmExports.free(rectBuf); m.FPDFPage_CloseAnnot(annotPtr); continue; }
+        try {
+          hasRect = m.FPDFAnnot_GetRect(annotPtr, rectBuf);
+        } catch {
+          m.pdfium.wasmExports.free(rectBuf);
+          m.FPDFPage_CloseAnnot(annotPtr);
+          continue;
+        }
         if (!hasRect) {
-          m.pdfium.wasmExports.free(rectBuf); m.FPDFPage_CloseAnnot(annotPtr); continue;
+          m.pdfium.wasmExports.free(rectBuf);
+          m.FPDFPage_CloseAnnot(annotPtr);
+          continue;
         }
 
-        const rawLeft = m.pdfium.getValue(rectBuf, 'float');
-        const rawBottom = m.pdfium.getValue(rectBuf + 4, 'float');
-        const rawRight = m.pdfium.getValue(rectBuf + 8, 'float');
-        const rawTop = m.pdfium.getValue(rectBuf + 12, 'float');
+        const rawLeft = m.pdfium.getValue(rectBuf, "float");
+        const rawBottom = m.pdfium.getValue(rectBuf + 4, "float");
+        const rawRight = m.pdfium.getValue(rectBuf + 8, "float");
+        const rawTop = m.pdfium.getValue(rectBuf + 12, "float");
         m.pdfium.wasmExports.free(rectBuf);
 
         const annotLeft = Math.min(rawLeft, rawRight);
@@ -1573,28 +1805,58 @@ export async function renderButtonFieldAppearances(
         let imageData: ImageData | null = null;
 
         if (pdfW > 0.5 && pdfH > 0.5) {
-          const dpr = typeof window !== 'undefined' ? Math.min(window.devicePixelRatio || 1, 3) : 1;
+          const dpr =
+            typeof window !== "undefined"
+              ? Math.min(window.devicePixelRatio || 1, 3)
+              : 1;
           const wDev = Math.max(1, Math.round(pdfW * dpr));
           const hDev = Math.max(1, Math.round(pdfH * dpr));
           const stride = wDev * 4;
           const bytes = stride * hDev;
           const heapPtr = m.pdfium.wasmExports.malloc(bytes);
-          const bitmapPtr = m.FPDFBitmap_CreateEx(wDev, hDev, 4, heapPtr, stride);
+          const bitmapPtr = m.FPDFBitmap_CreateEx(
+            wDev,
+            hDev,
+            4,
+            heapPtr,
+            stride,
+          );
           m.FPDFBitmap_FillRect(bitmapPtr, 0, 0, wDev, hDev, 0x00000000);
 
           imageData = await renderWidgetAppearance(
-            m, bitmapPtr, heapPtr, wDev, hDev, stride, bytes,
-            pagePtr, annotPtr, annotLeft, annotTopVal, pdfW, pdfH,
-            cssX, cssY, cropWidth, cropHeight, formEnvPtr, dpr,
+            m,
+            bitmapPtr,
+            heapPtr,
+            wDev,
+            hDev,
+            stride,
+            bytes,
+            pagePtr,
+            annotPtr,
+            annotLeft,
+            annotTopVal,
+            pdfW,
+            pdfH,
+            cssX,
+            cssY,
+            cropWidth,
+            cropHeight,
+            formEnvPtr,
+            dpr,
           );
         }
 
         m.FPDFPage_CloseAnnot(annotPtr);
         buttonResults.push({
-          pageIndex: pageIdx, x: cssX, y: cssY,
-          width: pdfW, height: pdfH,
-          fieldName: btnName, imageData,
-          sourcePageWidth: cropWidth, sourcePageHeight: cropHeight,
+          pageIndex: pageIdx,
+          x: cssX,
+          y: cssY,
+          width: pdfW,
+          height: pdfH,
+          fieldName: btnName,
+          imageData,
+          sourcePageWidth: cropWidth,
+          sourcePageHeight: cropHeight,
         });
       }
 
@@ -1641,21 +1903,21 @@ export async function fetchSignatureFieldsWithAppearances(
     // Convert ImageData to data URL for the appearance
     let appearanceDataUrl: string | undefined;
     if (appearance.imageData) {
-      const canvas = document.createElement('canvas');
+      const canvas = document.createElement("canvas");
       canvas.width = appearance.imageData.width;
       canvas.height = appearance.imageData.height;
-      const ctx = canvas.getContext('2d');
+      const ctx = canvas.getContext("2d");
       if (ctx) {
         ctx.putImageData(appearance.imageData, 0, 0);
-        appearanceDataUrl = canvas.toDataURL('image/png');
+        appearanceDataUrl = canvas.toDataURL("image/png");
       }
     }
 
     formFields.push({
       name: appearance.fieldName,
       label: appearance.fieldName,
-      type: 'signature',
-      value: '',
+      type: "signature",
+      value: "",
       options: null,
       displayOptions: null,
       required: false,
diff --git a/frontend/src/core/services/pixelCompareService.ts b/frontend/src/core/services/pixelCompareService.ts
new file mode 100644
index 0000000000..0e61582923
--- /dev/null
+++ b/frontend/src/core/services/pixelCompareService.ts
@@ -0,0 +1,198 @@
+import PixelCompareWorkerCtor from "@app/workers/pixelCompareWorker?worker";
+import {
+  ADDITION_HIGHLIGHT,
+  REMOVAL_HIGHLIGHT,
+  type ComparePixelPageResult,
+  type CompareResultPixelData,
+  type PixelCompareWorkerErrors,
+  type PixelCompareWorkerRequest,
+  type PixelCompareWorkerResponse,
+  type PixelCompareWorkerWarnings,
+  type PixelRgb,
+} from "@app/types/compare";
+
+const hexToRgb = (hex: string): PixelRgb => {
+  const normalised = hex.replace("#", "");
+  const value = parseInt(
+    normalised.length === 3
+      ? normalised
+          .split("")
+          .map((c) => c + c)
+          .join("")
+      : normalised,
+    16,
+  );
+  return [(value >> 16) & 0xff, (value >> 8) & 0xff, value & 0xff];
+};
+
+// Keep pixel mode visually consistent with text mode:
+// - removed (content in base, not in comparison) → REMOVAL_HIGHLIGHT (red)
+// - added   (content in comparison, not in base) → ADDITION_HIGHLIGHT (green)
+const DEFAULT_DIFF_COLOR: PixelRgb = hexToRgb(REMOVAL_HIGHLIGHT);
+const DEFAULT_DIFF_COLOR_ALT: PixelRgb = hexToRgb(ADDITION_HIGHLIGHT);
+
+export const revokePixelResult = (
+  result: CompareResultPixelData | null | undefined,
+): void => {
+  if (!result) return;
+  for (const page of result.pages) {
+    URL.revokeObjectURL(page.baseImageUrl);
+    URL.revokeObjectURL(page.comparisonImageUrl);
+    URL.revokeObjectURL(page.diffImageUrl);
+  }
+};
+
+export interface RunPixelCompareArgs {
+  baseFile: File;
+  comparisonFile: File;
+  baseFileId: string;
+  comparisonFileId: string;
+  dpi: number;
+  threshold: number;
+  onProgress?: (pageNumber: number, totalPages: number) => void;
+  onPageReady?: (page: ComparePixelPageResult) => void;
+  signal?: { cancelled: boolean };
+  warnings: PixelCompareWorkerWarnings;
+  errors: PixelCompareWorkerErrors;
+  // Max in-flight pages processed in parallel inside the worker.
+  concurrency?: number;
+  // Override diff highlight colours. Defaults to REMOVAL_HIGHLIGHT / ADDITION_HIGHLIGHT
+  // so pixel mode matches text mode (removed = red, added = green).
+  diffColor?: PixelRgb;
+  diffColorAlt?: PixelRgb;
+}
+
+export const runPixelCompare = async ({
+  baseFile,
+  comparisonFile,
+  baseFileId,
+  comparisonFileId,
+  dpi,
+  threshold,
+  onProgress,
+  onPageReady,
+  signal,
+  warnings,
+  errors,
+  concurrency,
+  diffColor = DEFAULT_DIFF_COLOR,
+  diffColorAlt = DEFAULT_DIFF_COLOR_ALT,
+}: RunPixelCompareArgs): Promise<CompareResultPixelData> => {
+  if (signal?.cancelled) throw new Error("CANCELLED");
+
+  const worker = new PixelCompareWorkerCtor();
+  const emittedUrls: string[] = [];
+  const pages: ComparePixelPageResult[] = [];
+
+  const cleanupOnFailure = () => {
+    for (const url of emittedUrls) URL.revokeObjectURL(url);
+  };
+
+  return await new Promise<CompareResultPixelData>((resolve, reject) => {
+    const handleMessage = (event: MessageEvent<PixelCompareWorkerResponse>) => {
+      const message = event.data;
+      if (!message) return;
+      if (signal?.cancelled) {
+        terminateWorker();
+        cleanupOnFailure();
+        reject(new Error("CANCELLED"));
+        return;
+      }
+
+      switch (message.type) {
+        case "progress": {
+          onProgress?.(message.pageNumber, message.totalPages);
+          break;
+        }
+        case "page": {
+          const payload = message.page;
+          const baseUrl = URL.createObjectURL(payload.baseBlob);
+          const comparisonUrl = URL.createObjectURL(payload.comparisonBlob);
+          const diffUrl = URL.createObjectURL(payload.diffBlob);
+          emittedUrls.push(baseUrl, comparisonUrl, diffUrl);
+          const pageResult: ComparePixelPageResult = {
+            pageNumber: payload.pageNumber,
+            width: payload.width,
+            height: payload.height,
+            baseImageUrl: baseUrl,
+            comparisonImageUrl: comparisonUrl,
+            diffImageUrl: diffUrl,
+            diffPixels: payload.diffPixels,
+            totalPixels: payload.totalPixels,
+            diffRatio: payload.diffRatio,
+            sizeMismatch: payload.sizeMismatch,
+            ...(payload.missingBase ? { missingBase: true } : {}),
+            ...(payload.missingComparison ? { missingComparison: true } : {}),
+          };
+          pages.push(pageResult);
+          onPageReady?.(pageResult);
+          break;
+        }
+        case "success": {
+          pages.sort((a, b) => a.pageNumber - b.pageNumber);
+          terminateWorker();
+          resolve({
+            mode: "pixel",
+            base: { fileId: baseFileId, fileName: baseFile.name },
+            comparison: {
+              fileId: comparisonFileId,
+              fileName: comparisonFile.name,
+            },
+            pages,
+            totals: {
+              ...message.totals,
+              processedAt: Date.now(),
+            },
+            warnings: message.warnings,
+            settings: { dpi, threshold },
+          });
+          break;
+        }
+        case "error": {
+          terminateWorker();
+          cleanupOnFailure();
+          reject(new Error(message.message));
+          break;
+        }
+      }
+    };
+
+    const handleError = (event: ErrorEvent) => {
+      terminateWorker();
+      cleanupOnFailure();
+      reject(
+        event.error ?? new Error(event.message || "Pixel compare worker error"),
+      );
+    };
+
+    const terminateWorker = () => {
+      worker.removeEventListener("message", handleMessage as EventListener);
+      worker.removeEventListener("error", handleError as EventListener);
+      try {
+        worker.terminate();
+      } catch {
+        /* swallow */
+      }
+    };
+
+    worker.addEventListener("message", handleMessage as EventListener);
+    worker.addEventListener("error", handleError as EventListener);
+
+    const request: PixelCompareWorkerRequest = {
+      type: "pixel-compare",
+      payload: {
+        baseFile,
+        comparisonFile,
+        dpi,
+        threshold,
+        concurrency,
+        warnings,
+        errors,
+        diffColor,
+        diffColorAlt,
+      },
+    };
+
+    worker.postMessage(request);
+  });
+};
diff --git a/frontend/src/core/services/preferencesService.ts b/frontend/src/core/services/preferencesService.ts
index d951099a9e..94f7ea10e2 100644
--- a/frontend/src/core/services/preferencesService.ts
+++ b/frontend/src/core/services/preferencesService.ts
@@ -1,14 +1,32 @@
-import { type ToolPanelMode, DEFAULT_TOOL_PANEL_MODE } from '@app/constants/toolPanel';
-import { type ThemeMode, getSystemTheme } from '@app/constants/theme';
+import {
+  type ToolPanelMode,
+  DEFAULT_TOOL_PANEL_MODE,
+} from "@app/constants/toolPanel";
+import { type ThemeMode, getSystemTheme } from "@app/constants/theme";
 
-export type LogoVariant = 'modern' | 'classic';
+export type LogoVariant = "modern" | "classic";
 
-export type PdfRenderMode = 'normal' | 'dark' | 'sepia';
+export type PdfRenderMode = "normal" | "dark" | "sepia";
+
+export type StartupView = "tools" | "read" | "automate";
+
+export type ViewerZoomSetting =
+  | "auto"
+  | "fitWidth"
+  | "fitPage"
+  | "50"
+  | "75"
+  | "100"
+  | "125"
+  | "150"
+  | "200";
 
 export interface UserPreferences {
   autoUnzip: boolean;
   autoUnzipFileLimit: number;
   defaultToolPanelMode: ToolPanelMode;
+  defaultStartupView: StartupView;
+  defaultViewerZoom: ViewerZoomSetting;
   theme: ThemeMode;
   toolPanelModePromptSeen: boolean;
   hasSelectedToolPanelMode: boolean;
@@ -26,6 +44,8 @@ export const DEFAULT_PREFERENCES: UserPreferences = {
   autoUnzip: true,
   autoUnzipFileLimit: 4,
   defaultToolPanelMode: DEFAULT_TOOL_PANEL_MODE,
+  defaultStartupView: "tools",
+  defaultViewerZoom: "auto",
   theme: getSystemTheme(),
   toolPanelModePromptSeen: false,
   hasSelectedToolPanelMode: false,
@@ -36,10 +56,10 @@ export const DEFAULT_PREFERENCES: UserPreferences = {
   hideUnavailableTools: false,
   hideUnavailableConversions: false,
   logoVariant: null,
-  pdfRenderMode: 'normal',
+  pdfRenderMode: "normal",
 };
 
-const STORAGE_KEY = 'stirlingpdf_preferences';
+const STORAGE_KEY = "stirlingpdf_preferences";
 
 class PreferencesService {
   private serverDefaults: Partial<UserPreferences> = {};
@@ -48,9 +68,7 @@ class PreferencesService {
     this.serverDefaults = defaults;
   }
 
-  getPreference<K extends keyof UserPreferences>(
-    key: K
-  ): UserPreferences[K] {
+  getPreference<K extends keyof UserPreferences>(key: K): UserPreferences[K] {
     // Explicitly re-read every time in case preferences have changed in another tab etc.
     try {
       const stored = localStorage.getItem(STORAGE_KEY);
@@ -61,7 +79,7 @@ class PreferencesService {
         }
       }
     } catch (error) {
-      console.error('Error reading preference:', key, error);
+      console.error("Error reading preference:", key, error);
     }
     // Use server defaults if available, otherwise use hardcoded defaults
     if (key in this.serverDefaults && this.serverDefaults[key] !== undefined) {
@@ -72,7 +90,7 @@ class PreferencesService {
 
   setPreference<K extends keyof UserPreferences>(
     key: K,
-    value: UserPreferences[K]
+    value: UserPreferences[K],
   ): void {
     try {
       const stored = localStorage.getItem(STORAGE_KEY);
@@ -80,7 +98,7 @@ class PreferencesService {
       preferences[key] = value;
       localStorage.setItem(STORAGE_KEY, JSON.stringify(preferences));
     } catch (error) {
-      console.error('Error writing preference:', key, error);
+      console.error("Error writing preference:", key, error);
     }
   }
 
@@ -97,7 +115,7 @@ class PreferencesService {
         };
       }
     } catch (error) {
-      console.error('Error reading preferences', error);
+      console.error("Error reading preferences", error);
     }
     // Merge server defaults with hardcoded defaults
     return { ...DEFAULT_PREFERENCES, ...this.serverDefaults };
@@ -107,7 +125,7 @@ class PreferencesService {
     try {
       localStorage.removeItem(STORAGE_KEY);
     } catch (error) {
-      console.error('Error clearing preferences:', error);
+      console.error("Error clearing preferences:", error);
       throw error;
     }
   }
diff --git a/frontend/src/core/services/processingCache.ts b/frontend/src/core/services/processingCache.ts
index 53a4356be7..63bcc614a5 100644
--- a/frontend/src/core/services/processingCache.ts
+++ b/frontend/src/core/services/processingCache.ts
@@ -1,45 +1,52 @@
-import { ProcessedFile, CacheConfig, CacheEntry, CacheStats } from '@app/types/processing';
+import {
+  ProcessedFile,
+  CacheConfig,
+  CacheEntry,
+  CacheStats,
+} from "@app/types/processing";
 
 export class ProcessingCache {
   private cache = new Map<string, CacheEntry>();
   private totalSize = 0;
-  
-  constructor(private config: CacheConfig = {
-    maxFiles: 20,
-    maxSizeBytes: 2 * 1024 * 1024 * 1024, // 2GB
-    ttlMs: 30 * 60 * 1000 // 30 minutes
-  }) {}
+
+  constructor(
+    private config: CacheConfig = {
+      maxFiles: 20,
+      maxSizeBytes: 2 * 1024 * 1024 * 1024, // 2GB
+      ttlMs: 30 * 60 * 1000, // 30 minutes
+    },
+  ) {}
 
   set(key: string, data: ProcessedFile): void {
     // Remove expired entries first
     this.cleanup();
-    
+
     // Calculate entry size (rough estimate)
     const size = this.calculateSize(data);
-    
+
     // Make room if needed
     this.makeRoom(size);
-    
+
     this.cache.set(key, {
       data,
       size,
       lastAccessed: Date.now(),
-      createdAt: Date.now()
+      createdAt: Date.now(),
     });
-    
+
     this.totalSize += size;
   }
 
   get(key: string): ProcessedFile | null {
     const entry = this.cache.get(key);
     if (!entry) return null;
-    
+
     // Check TTL
     if (Date.now() - entry.createdAt > this.config.ttlMs) {
       this.delete(key);
       return null;
     }
-    
+
     // Update last accessed
     entry.lastAccessed = Date.now();
     return entry.data;
@@ -48,13 +55,13 @@ export class ProcessingCache {
   has(key: string): boolean {
     const entry = this.cache.get(key);
     if (!entry) return false;
-    
+
     // Check TTL
     if (Date.now() - entry.createdAt > this.config.ttlMs) {
       this.delete(key);
       return false;
     }
-    
+
     return true;
   }
 
@@ -73,13 +80,13 @@ export class ProcessingCache {
 
   private findOldestEntry(): string | null {
     let oldest: { key: string; lastAccessed: number } | null = null;
-    
+
     for (const [key, entry] of this.cache) {
       if (!oldest || entry.lastAccessed < oldest.lastAccessed) {
         oldest = { key, lastAccessed: entry.lastAccessed };
       }
     }
-    
+
     return oldest?.key || null;
   }
 
@@ -95,18 +102,18 @@ export class ProcessingCache {
   private calculateSize(data: ProcessedFile): number {
     // Rough size estimation
     let size = 0;
-    
+
     // Estimate size of thumbnails (main memory consumer)
-    data.pages.forEach(page => {
+    data.pages.forEach((page) => {
       if (page.thumbnail) {
         // Base64 thumbnail is roughly 50KB each
         size += 50 * 1024;
       }
     });
-    
+
     // Add some overhead for other data
     size += 10 * 1024; // 10KB overhead
-    
+
     return size;
   }
 
@@ -127,7 +134,7 @@ export class ProcessingCache {
     return {
       entries: this.cache.size,
       totalSizeBytes: this.totalSize,
-      maxSizeBytes: this.config.maxSizeBytes
+      maxSizeBytes: this.config.maxSizeBytes,
     };
   }
 
@@ -135,4 +142,4 @@ export class ProcessingCache {
   getKeys(): string[] {
     return Array.from(this.cache.keys());
   }
-}
\ No newline at end of file
+}
diff --git a/frontend/src/core/services/processingErrorHandler.ts b/frontend/src/core/services/processingErrorHandler.ts
index 2cc55cf395..a7b1275036 100644
--- a/frontend/src/core/services/processingErrorHandler.ts
+++ b/frontend/src/core/services/processingErrorHandler.ts
@@ -1,4 +1,4 @@
-import { ProcessingError } from '@app/types/processing';
+import { ProcessingError } from "@app/types/processing";
 
 export class ProcessingErrorHandler {
   private static readonly DEFAULT_MAX_RETRIES = 3;
@@ -8,16 +8,17 @@ export class ProcessingErrorHandler {
    * Create a ProcessingError from an unknown error
    */
   static createProcessingError(
-    error: unknown, 
-    retryCount: number = 0, 
-    maxRetries: number = this.DEFAULT_MAX_RETRIES
+    error: unknown,
+    retryCount: number = 0,
+    maxRetries: number = this.DEFAULT_MAX_RETRIES,
   ): ProcessingError {
-    const originalError = error instanceof Error ? error : new Error(String(error));
+    const originalError =
+      error instanceof Error ? error : new Error(String(error));
     const message = originalError.message;
 
     // Determine error type based on error message and properties
     const errorType = this.determineErrorType(originalError, message);
-    
+
     // Determine if error is recoverable
     const recoverable = this.isRecoverable(errorType, retryCount, maxRetries);
 
@@ -27,68 +28,81 @@ export class ProcessingErrorHandler {
       recoverable,
       retryCount,
       maxRetries,
-      originalError
+      originalError,
     };
   }
 
   /**
    * Determine the type of error based on error characteristics
    */
-  private static determineErrorType(error: Error, message: string): ProcessingError['type'] {
+  private static determineErrorType(
+    error: Error,
+    message: string,
+  ): ProcessingError["type"] {
     const lowerMessage = message.toLowerCase();
 
     // Network-related errors
-    if (lowerMessage.includes('network') || 
-        lowerMessage.includes('fetch') ||
-        lowerMessage.includes('connection')) {
-      return 'network';
+    if (
+      lowerMessage.includes("network") ||
+      lowerMessage.includes("fetch") ||
+      lowerMessage.includes("connection")
+    ) {
+      return "network";
     }
 
     // Memory-related errors
-    if (lowerMessage.includes('memory') ||
-        lowerMessage.includes('quota') ||
-        lowerMessage.includes('allocation') ||
-        error.name === 'QuotaExceededError') {
-      return 'memory';
+    if (
+      lowerMessage.includes("memory") ||
+      lowerMessage.includes("quota") ||
+      lowerMessage.includes("allocation") ||
+      error.name === "QuotaExceededError"
+    ) {
+      return "memory";
     }
 
     // Timeout errors
-    if (lowerMessage.includes('timeout') ||
-        lowerMessage.includes('aborted') ||
-        error.name === 'AbortError') {
-      return 'timeout';
+    if (
+      lowerMessage.includes("timeout") ||
+      lowerMessage.includes("aborted") ||
+      error.name === "AbortError"
+    ) {
+      return "timeout";
     }
 
     // Cancellation
-    if (lowerMessage.includes('cancel') ||
-        lowerMessage.includes('abort') ||
-        error.name === 'AbortError') {
-      return 'cancelled';
+    if (
+      lowerMessage.includes("cancel") ||
+      lowerMessage.includes("abort") ||
+      error.name === "AbortError"
+    ) {
+      return "cancelled";
     }
 
     // PDF corruption/parsing errors
-    if (lowerMessage.includes('pdf') ||
-        lowerMessage.includes('parse') ||
-        lowerMessage.includes('invalid') ||
-        lowerMessage.includes('corrupt') ||
-        lowerMessage.includes('malformed')) {
-      return 'corruption';
+    if (
+      lowerMessage.includes("pdf") ||
+      lowerMessage.includes("parse") ||
+      lowerMessage.includes("invalid") ||
+      lowerMessage.includes("corrupt") ||
+      lowerMessage.includes("malformed")
+    ) {
+      return "corruption";
     }
 
     // Default to parsing error
-    return 'parsing';
+    return "parsing";
   }
 
   /**
    * Determine if an error is recoverable based on type and retry count
    */
   private static isRecoverable(
-    errorType: ProcessingError['type'], 
-    retryCount: number, 
-    maxRetries: number
+    errorType: ProcessingError["type"],
+    retryCount: number,
+    maxRetries: number,
   ): boolean {
     // Never recoverable
-    if (errorType === 'cancelled' || errorType === 'corruption') {
+    if (errorType === "cancelled" || errorType === "corruption") {
       return false;
     }
 
@@ -98,37 +112,44 @@ export class ProcessingErrorHandler {
     }
 
     // Memory errors are usually not recoverable
-    if (errorType === 'memory') {
+    if (errorType === "memory") {
       return retryCount < 1; // Only one retry for memory errors
     }
 
     // Network and timeout errors are usually recoverable
-    return errorType === 'network' || errorType === 'timeout' || errorType === 'parsing';
+    return (
+      errorType === "network" ||
+      errorType === "timeout" ||
+      errorType === "parsing"
+    );
   }
 
   /**
    * Format error message for user display
    */
-  private static formatErrorMessage(errorType: ProcessingError['type'], originalMessage: string): string {
+  private static formatErrorMessage(
+    errorType: ProcessingError["type"],
+    originalMessage: string,
+  ): string {
     switch (errorType) {
-      case 'network':
-        return 'Network connection failed. Please check your internet connection and try again.';
-      
-      case 'memory':
-        return 'Insufficient memory to process this file. Try closing other applications or processing a smaller file.';
-      
-      case 'timeout':
-        return 'Processing timed out. This file may be too large or complex to process.';
-      
-      case 'cancelled':
-        return 'Processing was cancelled by user.';
-      
-      case 'corruption':
-        return 'This PDF file appears to be corrupted or encrypted. Please try a different file.';
-      
-      case 'parsing':
+      case "network":
+        return "Network connection failed. Please check your internet connection and try again.";
+
+      case "memory":
+        return "Insufficient memory to process this file. Try closing other applications or processing a smaller file.";
+
+      case "timeout":
+        return "Processing timed out. This file may be too large or complex to process.";
+
+      case "cancelled":
+        return "Processing was cancelled by user.";
+
+      case "corruption":
+        return "This PDF file appears to be corrupted or encrypted. Please try a different file.";
+
+      case "parsing":
         return `Failed to process PDF: ${originalMessage}`;
-      
+
       default:
         return `Processing failed: ${originalMessage}`;
     }
@@ -140,7 +161,7 @@ export class ProcessingErrorHandler {
   static async executeWithRetry<T>(
     operation: () => Promise<T>,
     onError?: (error: ProcessingError) => void,
-    maxRetries: number = this.DEFAULT_MAX_RETRIES
+    maxRetries: number = this.DEFAULT_MAX_RETRIES,
   ): Promise<T> {
     let lastError: ProcessingError | null = null;
 
@@ -149,7 +170,7 @@ export class ProcessingErrorHandler {
         return await operation();
       } catch (error) {
         lastError = this.createProcessingError(error, attempt, maxRetries);
-        
+
         // Notify error handler
         if (onError) {
           onError(lastError);
@@ -166,15 +187,18 @@ export class ProcessingErrorHandler {
         }
 
         // Wait before retry with progressive backoff
-        const delay = this.RETRY_DELAYS[Math.min(attempt, this.RETRY_DELAYS.length - 1)];
+        const delay =
+          this.RETRY_DELAYS[Math.min(attempt, this.RETRY_DELAYS.length - 1)];
         await this.delay(delay);
-        
-        console.log(`Retrying operation (attempt ${attempt + 2}/${maxRetries + 1}) after ${delay}ms delay`);
+
+        console.log(
+          `Retrying operation (attempt ${attempt + 2}/${maxRetries + 1}) after ${delay}ms delay`,
+        );
       }
     }
 
     // All retries exhausted
-    throw lastError || new Error('Operation failed after all retries');
+    throw lastError || new Error("Operation failed after all retries");
   }
 
   /**
@@ -183,7 +207,7 @@ export class ProcessingErrorHandler {
   static withTimeout<T>(
     operation: () => Promise<T>,
     timeoutMs: number,
-    timeoutMessage: string = 'Operation timed out'
+    timeoutMessage: string = "Operation timed out",
   ): Promise<T> {
     return new Promise<T>((resolve, reject) => {
       const timeoutId = setTimeout(() => {
@@ -191,11 +215,11 @@ export class ProcessingErrorHandler {
       }, timeoutMs);
 
       operation()
-        .then(result => {
+        .then((result) => {
           clearTimeout(timeoutId);
           resolve(result);
         })
-        .catch(error => {
+        .catch((error) => {
           clearTimeout(timeoutId);
           reject(error);
         });
@@ -207,7 +231,7 @@ export class ProcessingErrorHandler {
    */
   static createTimeoutController(timeoutMs: number): AbortController {
     const controller = new AbortController();
-    
+
     setTimeout(() => {
       controller.abort();
     }, timeoutMs);
@@ -227,48 +251,48 @@ export class ProcessingErrorHandler {
    */
   static getErrorSuggestions(error: ProcessingError): string[] {
     switch (error.type) {
-      case 'network':
+      case "network":
         return [
-          'Check your internet connection',
-          'Try refreshing the page',
-          'Try again in a few moments'
+          "Check your internet connection",
+          "Try refreshing the page",
+          "Try again in a few moments",
         ];
-      
-      case 'memory':
+
+      case "memory":
         return [
-          'Close other browser tabs or applications',
-          'Try processing a smaller file',
-          'Restart your browser',
-          'Use a device with more memory'
+          "Close other browser tabs or applications",
+          "Try processing a smaller file",
+          "Restart your browser",
+          "Use a device with more memory",
         ];
-      
-      case 'timeout':
+
+      case "timeout":
         return [
-          'Try processing a smaller file',
-          'Break large files into smaller sections',
-          'Check your internet connection speed'
+          "Try processing a smaller file",
+          "Break large files into smaller sections",
+          "Check your internet connection speed",
         ];
-      
-      case 'corruption':
+
+      case "corruption":
         return [
-          'Verify the PDF file opens in other applications',
-          'Try re-downloading the file',
-          'Try a different PDF file',
-          'Contact the file creator if it appears corrupted'
+          "Verify the PDF file opens in other applications",
+          "Try re-downloading the file",
+          "Try a different PDF file",
+          "Contact the file creator if it appears corrupted",
         ];
-      
-      case 'parsing':
+
+      case "parsing":
         return [
-          'Verify this is a valid PDF file',
-          'Try a different PDF file',
-          'Contact support if the problem persists'
+          "Verify this is a valid PDF file",
+          "Try a different PDF file",
+          "Contact support if the problem persists",
         ];
-      
+
       default:
         return [
-          'Try refreshing the page',
-          'Try again in a few moments',
-          'Contact support if the problem persists'
+          "Try refreshing the page",
+          "Try again in a few moments",
+          "Contact support if the problem persists",
         ];
     }
   }
@@ -277,6 +301,6 @@ export class ProcessingErrorHandler {
    * Utility function for delays
    */
   private static delay(ms: number): Promise<void> {
-    return new Promise(resolve => setTimeout(resolve, ms));
+    return new Promise((resolve) => setTimeout(resolve, ms));
   }
-}
\ No newline at end of file
+}
diff --git a/frontend/src/core/services/serverStorageBundle.ts b/frontend/src/core/services/serverStorageBundle.ts
index 36da384ef5..ce9862246c 100644
--- a/frontend/src/core/services/serverStorageBundle.ts
+++ b/frontend/src/core/services/serverStorageBundle.ts
@@ -1,8 +1,8 @@
-import JSZip from 'jszip';
+import JSZip from "jszip";
 
-import { fileStorage } from '@app/services/fileStorage';
-import type { FileId, ToolOperation } from '@app/types/file';
-import type { StirlingFileStub } from '@app/types/fileContext';
+import { fileStorage } from "@app/services/fileStorage";
+import type { FileId, ToolOperation } from "@app/types/file";
+import type { StirlingFileStub } from "@app/types/fileContext";
 
 interface ShareBundleEntry {
   logicalId: string;
@@ -28,22 +28,29 @@ export interface ShareBundleManifest {
 
 function sanitizeFilename(name: string): string {
   const trimmed = name?.trim();
-  if (!trimmed) return 'file';
-  return trimmed.replace(/[\\/:*?"<>|]/g, '_');
+  if (!trimmed) return "file";
+  return trimmed.replace(/[\\/:*?"<>|]/g, "_");
 }
 
-export async function buildHistoryBundle(originalFileIds: FileId[] | FileId): Promise<{
+export async function buildHistoryBundle(
+  originalFileIds: FileId[] | FileId,
+): Promise<{
   bundleFile: File;
   manifest: ShareBundleManifest;
 }> {
-  const roots = Array.isArray(originalFileIds) ? originalFileIds : [originalFileIds];
+  const roots = Array.isArray(originalFileIds)
+    ? originalFileIds
+    : [originalFileIds];
   const uniqueRoots = Array.from(new Set(roots));
-  const allStubs: Array<{ rootId: FileId; stubs: Awaited<ReturnType<typeof fileStorage.getHistoryChainStubs>> }> = [];
+  const allStubs: Array<{
+    rootId: FileId;
+    stubs: Awaited<ReturnType<typeof fileStorage.getHistoryChainStubs>>;
+  }> = [];
 
   for (const rootId of uniqueRoots) {
     const stubs = await fileStorage.getHistoryChainStubs(rootId);
     if (stubs.length === 0) {
-      throw new Error('No history chain found for file.');
+      throw new Error("No history chain found for file.");
     }
     allStubs.push({ rootId, stubs });
   }
@@ -59,7 +66,7 @@ export async function buildHistoryBundle(originalFileIds: FileId[] | FileId): Pr
       }
 
       const logicalId = stub.id;
-      const filePath = `files/${logicalId}/${sanitizeFilename(stub.name || 'file')}`;
+      const filePath = `files/${logicalId}/${sanitizeFilename(stub.name || "file")}`;
       const buffer = await file.arrayBuffer();
       zip.file(filePath, buffer);
 
@@ -87,32 +94,30 @@ export async function buildHistoryBundle(originalFileIds: FileId[] | FileId): Pr
     entries,
   };
 
-  zip.file('stirling-share.json', JSON.stringify(manifest, null, 2));
+  zip.file("stirling-share.json", JSON.stringify(manifest, null, 2));
 
   const zipBlob = await zip.generateAsync({
-    type: 'blob',
-    compression: 'DEFLATE',
+    type: "blob",
+    compression: "DEFLATE",
     compressionOptions: { level: 6 },
   });
 
-  const firstStubName = allStubs[0]?.stubs[0]?.name || 'shared';
+  const firstStubName = allStubs[0]?.stubs[0]?.name || "shared";
   const rootName = sanitizeFilename(firstStubName);
   const bundleFile = new File([zipBlob], `${rootName}-history.zip`, {
-    type: 'application/zip',
+    type: "application/zip",
     lastModified: Date.now(),
   });
 
   return { bundleFile, manifest };
 }
 
-export async function buildSharePackage(
-  stubs: StirlingFileStub[]
-): Promise<{
+export async function buildSharePackage(stubs: StirlingFileStub[]): Promise<{
   bundleFile: File;
   manifest: ShareBundleManifest;
 }> {
   if (stubs.length === 0) {
-    throw new Error('No files provided for sharing.');
+    throw new Error("No files provided for sharing.");
   }
 
   const zip = new JSZip();
@@ -125,7 +130,7 @@ export async function buildSharePackage(
     }
 
     const logicalId = stub.id as string;
-    const filePath = `files/${logicalId}/${sanitizeFilename(stub.name || 'file')}`;
+    const filePath = `files/${logicalId}/${sanitizeFilename(stub.name || "file")}`;
     const buffer = await file.arrayBuffer();
     zip.file(filePath, buffer);
 
@@ -152,16 +157,16 @@ export async function buildSharePackage(
     entries,
   };
 
-  zip.file('stirling-share.json', JSON.stringify(manifest, null, 2));
+  zip.file("stirling-share.json", JSON.stringify(manifest, null, 2));
 
   const zipBlob = await zip.generateAsync({
-    type: 'blob',
-    compression: 'DEFLATE',
+    type: "blob",
+    compression: "DEFLATE",
     compressionOptions: { level: 6 },
   });
 
   const bundleFile = new File([zipBlob], `shared-files.zip`, {
-    type: 'application/zip',
+    type: "application/zip",
     lastModified: Date.now(),
   });
 
diff --git a/frontend/src/core/services/serverStorageUpload.ts b/frontend/src/core/services/serverStorageUpload.ts
index 6a4569c82c..39780055f8 100644
--- a/frontend/src/core/services/serverStorageUpload.ts
+++ b/frontend/src/core/services/serverStorageUpload.ts
@@ -1,14 +1,17 @@
-import apiClient from '@app/services/apiClient';
-import { fileStorage } from '@app/services/fileStorage';
-import { buildHistoryBundle, buildSharePackage } from '@app/services/serverStorageBundle';
-import type { FileId } from '@app/types/file';
-import type { StirlingFileStub } from '@app/types/fileContext';
+import apiClient from "@app/services/apiClient";
+import { fileStorage } from "@app/services/fileStorage";
+import {
+  buildHistoryBundle,
+  buildSharePackage,
+} from "@app/services/serverStorageBundle";
+import type { FileId } from "@app/types/file";
+import type { StirlingFileStub } from "@app/types/fileContext";
 
 function resolveUpdatedAt(value: unknown): number {
   if (!value) {
     return Date.now();
   }
-  if (typeof value === 'number') {
+  if (typeof value === "number") {
     return Number.isFinite(value) ? value : Date.now();
   }
   const parsed = new Date(String(value)).getTime();
@@ -17,40 +20,50 @@ function resolveUpdatedAt(value: unknown): number {
 
 export async function uploadHistoryChain(
   originalFileId: FileId,
-  existingRemoteId?: number
+  existingRemoteId?: number,
 ): Promise<{ remoteId: number; updatedAt: number; chain: StirlingFileStub[] }> {
   const chain = await fileStorage.getHistoryChainStubs(originalFileId);
   if (chain.length === 0) {
-    throw new Error('No history chain found.');
+    throw new Error("No history chain found.");
   }
 
   const finalStub =
-    chain.slice().reverse().find((stub) => stub.isLeaf !== false) || chain[chain.length - 1];
+    chain
+      .slice()
+      .reverse()
+      .find((stub) => stub.isLeaf !== false) || chain[chain.length - 1];
   const finalFile = await fileStorage.getStirlingFile(finalStub.id);
   if (!finalFile) {
-    throw new Error('Missing final file data for sharing.');
+    throw new Error("Missing final file data for sharing.");
   }
 
   const { bundleFile, manifest } = await buildHistoryBundle(originalFileId);
-  const auditLog = new File([JSON.stringify(manifest, null, 2)], 'audit-log.json', {
-    type: 'application/json',
-    lastModified: Date.now(),
-  });
+  const auditLog = new File(
+    [JSON.stringify(manifest, null, 2)],
+    "audit-log.json",
+    {
+      type: "application/json",
+      lastModified: Date.now(),
+    },
+  );
   const formData = new FormData();
-  formData.append('file', finalFile, finalFile.name);
-  formData.append('historyBundle', bundleFile, bundleFile.name);
-  formData.append('auditLog', auditLog, auditLog.name);
+  formData.append("file", finalFile, finalFile.name);
+  formData.append("historyBundle", bundleFile, bundleFile.name);
+  formData.append("auditLog", auditLog, auditLog.name);
 
   if (existingRemoteId) {
-    const response = await apiClient.put(`/api/v1/storage/files/${existingRemoteId}`, formData);
+    const response = await apiClient.put(
+      `/api/v1/storage/files/${existingRemoteId}`,
+      formData,
+    );
     const updatedAt = resolveUpdatedAt(response.data?.updatedAt);
     return { remoteId: existingRemoteId, updatedAt, chain };
   }
 
-  const response = await apiClient.post('/api/v1/storage/files', formData);
+  const response = await apiClient.post("/api/v1/storage/files", formData);
   const remoteId = response.data?.id as number | undefined;
   if (!remoteId) {
-    throw new Error('Missing stored file ID in response.');
+    throw new Error("Missing stored file ID in response.");
   }
 
   const updatedAt = resolveUpdatedAt(response.data?.updatedAt);
@@ -59,7 +72,7 @@ export async function uploadHistoryChain(
 
 export async function uploadHistoryChains(
   originalFileIds: FileId[],
-  existingRemoteId?: number
+  existingRemoteId?: number,
 ): Promise<{ remoteId: number; updatedAt: number; chain: StirlingFileStub[] }> {
   const uniqueRoots = Array.from(new Set(originalFileIds));
   const chainMap = new Map<FileId, StirlingFileStub[]>();
@@ -70,11 +83,14 @@ export async function uploadHistoryChains(
   for (const rootId of uniqueRoots) {
     const chain = await fileStorage.getHistoryChainStubs(rootId);
     if (chain.length === 0) {
-      throw new Error('No history chain found.');
+      throw new Error("No history chain found.");
     }
     chainMap.set(rootId, chain);
     const finalStub =
-      chain.slice().reverse().find((stub) => stub.isLeaf !== false) || chain[chain.length - 1];
+      chain
+        .slice()
+        .reverse()
+        .find((stub) => stub.isLeaf !== false) || chain[chain.length - 1];
     if (finalStub) {
       leafStubs.push(finalStub);
     }
@@ -90,7 +106,7 @@ export async function uploadHistoryChains(
   if (leafStubs.length === 1) {
     const finalFile = await fileStorage.getStirlingFile(leafStubs[0].id);
     if (!finalFile) {
-      throw new Error('Missing final file data for sharing.');
+      throw new Error("Missing final file data for sharing.");
     }
     shareFile = finalFile;
   } else {
@@ -99,25 +115,32 @@ export async function uploadHistoryChains(
   }
 
   const { bundleFile, manifest } = await buildHistoryBundle(uniqueRoots);
-  const auditLog = new File([JSON.stringify(manifest, null, 2)], 'audit-log.json', {
-    type: 'application/json',
-    lastModified: Date.now(),
-  });
+  const auditLog = new File(
+    [JSON.stringify(manifest, null, 2)],
+    "audit-log.json",
+    {
+      type: "application/json",
+      lastModified: Date.now(),
+    },
+  );
   const formData = new FormData();
-  formData.append('file', shareFile, shareFile.name);
-  formData.append('historyBundle', bundleFile, bundleFile.name);
-  formData.append('auditLog', auditLog, auditLog.name);
+  formData.append("file", shareFile, shareFile.name);
+  formData.append("historyBundle", bundleFile, bundleFile.name);
+  formData.append("auditLog", auditLog, auditLog.name);
 
   if (existingRemoteId) {
-    const response = await apiClient.put(`/api/v1/storage/files/${existingRemoteId}`, formData);
+    const response = await apiClient.put(
+      `/api/v1/storage/files/${existingRemoteId}`,
+      formData,
+    );
     const updatedAt = resolveUpdatedAt(response.data?.updatedAt);
     return { remoteId: existingRemoteId, updatedAt, chain: combinedChain };
   }
 
-  const response = await apiClient.post('/api/v1/storage/files', formData);
+  const response = await apiClient.post("/api/v1/storage/files", formData);
   const remoteId = response.data?.id as number | undefined;
   if (!remoteId) {
-    throw new Error('Missing stored file ID in response.');
+    throw new Error("Missing stored file ID in response.");
   }
 
   const updatedAt = resolveUpdatedAt(response.data?.updatedAt);
diff --git a/frontend/src/core/services/shareBundleUtils.ts b/frontend/src/core/services/shareBundleUtils.ts
index 02cb6d6365..a5db773e50 100644
--- a/frontend/src/core/services/shareBundleUtils.ts
+++ b/frontend/src/core/services/shareBundleUtils.ts
@@ -1,10 +1,12 @@
-import JSZip from 'jszip';
+import JSZip from "jszip";
 
-import type { ShareBundleManifest } from '@app/services/serverStorageBundle';
+import type { ShareBundleManifest } from "@app/services/serverStorageBundle";
 
-const MANIFEST_FILENAME = 'stirling-share.json';
+const MANIFEST_FILENAME = "stirling-share.json";
 
-export function parseContentDispositionFilename(disposition?: string): string | null {
+export function parseContentDispositionFilename(
+  disposition?: string,
+): string | null {
   if (!disposition) return null;
   const filenameMatch = /filename="([^"]+)"/i.exec(disposition);
   if (filenameMatch?.[1]) return filenameMatch[1];
@@ -20,27 +22,27 @@ export function parseContentDispositionFilename(disposition?: string): string |
 }
 
 export function isZipBundle(contentType: string, filename: string): boolean {
-  return contentType.includes('zip') || filename.toLowerCase().endsWith('.zip');
+  return contentType.includes("zip") || filename.toLowerCase().endsWith(".zip");
 }
 
 export function getShareBundleEntryRootId(
   manifest: ShareBundleManifest,
-  entry: ShareBundleManifest['entries'][number]
+  entry: ShareBundleManifest["entries"][number],
 ): string {
   return entry.rootLogicalId || manifest.rootLogicalId;
 }
 
 export function resolveShareBundleOrder(manifest: ShareBundleManifest): {
   rootOrder: string[];
-  sortedEntries: ShareBundleManifest['entries'];
+  sortedEntries: ShareBundleManifest["entries"];
 } {
-  const entryRootId = (entry: ShareBundleManifest['entries'][number]) =>
+  const entryRootId = (entry: ShareBundleManifest["entries"][number]) =>
     getShareBundleEntryRootId(manifest, entry);
   const rootOrder =
     manifest.rootLogicalIds && manifest.rootLogicalIds.length > 0
       ? manifest.rootLogicalIds
       : Array.from(new Set(manifest.entries.map(entryRootId)));
-  const sortedEntries: ShareBundleManifest['entries'] = [];
+  const sortedEntries: ShareBundleManifest["entries"] = [];
   for (const rootId of rootOrder) {
     const rootEntries = manifest.entries
       .filter((entry) => entryRootId(entry) === rootId)
@@ -50,12 +52,10 @@ export function resolveShareBundleOrder(manifest: ShareBundleManifest): {
   return { rootOrder, sortedEntries };
 }
 
-export async function loadShareBundleEntries(
-  blob: Blob
-): Promise<{
+export async function loadShareBundleEntries(blob: Blob): Promise<{
   manifest: ShareBundleManifest;
   rootOrder: string[];
-  sortedEntries: ShareBundleManifest['entries'];
+  sortedEntries: ShareBundleManifest["entries"];
   files: File[];
 } | null> {
   const zip = await JSZip.loadAsync(blob);
@@ -64,7 +64,7 @@ export async function loadShareBundleEntries(
     return null;
   }
 
-  const manifestText = await manifestEntry.async('text');
+  const manifestText = await manifestEntry.async("text");
   const manifest = JSON.parse(manifestText) as ShareBundleManifest;
   const { rootOrder, sortedEntries } = resolveShareBundleOrder(manifest);
 
@@ -74,12 +74,12 @@ export async function loadShareBundleEntries(
     if (!zipEntry) {
       throw new Error(`Missing file entry ${entry.filePath}`);
     }
-    const fileBlob = await zipEntry.async('blob');
+    const fileBlob = await zipEntry.async("blob");
     files.push(
       new File([fileBlob], entry.name, {
         type: entry.type,
         lastModified: entry.lastModified,
-      })
+      }),
     );
   }
 
@@ -89,7 +89,7 @@ export async function loadShareBundleEntries(
 export async function extractLatestFilesFromBundle(
   blob: Blob,
   filename: string,
-  contentType: string
+  contentType: string,
 ): Promise<File[]> {
   if (!isZipBundle(contentType, filename)) {
     return [new File([blob], filename, { type: contentType || blob.type })];
diff --git a/frontend/src/core/services/signatureDetectionService.ts b/frontend/src/core/services/signatureDetectionService.ts
index 44a12be924..cae3fed8ed 100644
--- a/frontend/src/core/services/signatureDetectionService.ts
+++ b/frontend/src/core/services/signatureDetectionService.ts
@@ -25,58 +25,60 @@ export interface FileSignatureStatus {
 /**
  * Detect signatures in a single PDF file using PDF.js
  */
-const detectSignaturesInFile = async (file: File): Promise<SignatureDetectionResult> => {
+const detectSignaturesInFile = async (
+  file: File,
+): Promise<SignatureDetectionResult> => {
   try {
     // Ensure PDF.js is available
     if (!window.pdfjsLib) {
       return {
         hasSignatures: false,
-        error: 'PDF.js not available'
+        error: "PDF.js not available",
       };
     }
 
     // Convert file to ArrayBuffer
     const arrayBuffer = await file.arrayBuffer();
-    
+
     // Load the PDF document
-    const pdf = await window.pdfjsLib.getDocument({ data: arrayBuffer }).promise;
-    
+    const pdf = await window.pdfjsLib.getDocument({ data: arrayBuffer })
+      .promise;
+
     let totalSignatures = 0;
-    
+
     // Check each page for signature annotations
     for (let pageNum = 1; pageNum <= pdf.numPages; pageNum++) {
       const page = await pdf.getPage(pageNum);
       const annotations = await page.getAnnotations();
-      
+
       // Count signature annotations (Type: /Sig)
-      const signatureAnnotations = annotations.filter((annotation: any) => 
-        annotation.subtype === 'Widget' && 
-        annotation.fieldType === 'Sig'
+      const signatureAnnotations = annotations.filter(
+        (annotation: any) =>
+          annotation.subtype === "Widget" && annotation.fieldType === "Sig",
       );
-      
+
       totalSignatures += signatureAnnotations.length;
     }
-    
+
     // Also check for document-level signatures in AcroForm
     const metadata = await pdf.getMetadata();
-    if (metadata?.info?.Signature || metadata?.metadata?.has('dc:signature')) {
+    if (metadata?.info?.Signature || metadata?.metadata?.has("dc:signature")) {
       totalSignatures = Math.max(totalSignatures, 1);
     }
-    
+
     // Clean up PDF.js document
     pdf.destroy();
-    
+
     return {
       hasSignatures: totalSignatures > 0,
-      signatureCount: totalSignatures
+      signatureCount: totalSignatures,
     };
-    
   } catch (error) {
-    console.warn('PDF signature detection failed:', error);
+    console.warn("PDF signature detection failed:", error);
     return {
       hasSignatures: false,
       signatureCount: 0,
-      error: error instanceof Error ? error.message : 'Detection failed'
+      error: error instanceof Error ? error.message : "Detection failed",
     };
   }
 };
@@ -84,14 +86,16 @@ const detectSignaturesInFile = async (file: File): Promise<SignatureDetectionRes
 /**
  * Detect if PDF files contain signatures using PDF.js client-side processing
  */
-export const detectSignaturesInFiles = async (files: File[]): Promise<FileSignatureStatus[]> => {
+export const detectSignaturesInFiles = async (
+  files: File[],
+): Promise<FileSignatureStatus[]> => {
   const results: FileSignatureStatus[] = [];
-  
+
   for (const file of files) {
     const result = await detectSignaturesInFile(file);
     results.push({ file, result });
   }
-  
+
   return results;
 };
 
@@ -99,15 +103,17 @@ export const detectSignaturesInFiles = async (files: File[]): Promise<FileSignat
  * Hook for managing signature detection state
  */
 export const useSignatureDetection = () => {
-  const [detectionResults, setDetectionResults] = React.useState<FileSignatureStatus[]>([]);
+  const [detectionResults, setDetectionResults] = React.useState<
+    FileSignatureStatus[]
+  >([]);
   const [isDetecting, setIsDetecting] = React.useState(false);
-  
+
   const detectSignatures = async (files: File[]) => {
     if (files.length === 0) {
       setDetectionResults([]);
       return;
     }
-    
+
     setIsDetecting(true);
     try {
       const results = await detectSignaturesInFiles(files);
@@ -116,15 +122,20 @@ export const useSignatureDetection = () => {
       setIsDetecting(false);
     }
   };
-  
-  const getFileSignatureStatus = (file: File): SignatureDetectionResult | null => {
-    const result = detectionResults.find(r => r.file === file);
+
+  const getFileSignatureStatus = (
+    file: File,
+  ): SignatureDetectionResult | null => {
+    const result = detectionResults.find((r) => r.file === file);
     return result ? result.result : null;
   };
-  
-  const hasAnySignatures = detectionResults.some(r => r.result.hasSignatures);
-  const totalSignatures = detectionResults.reduce((sum, r) => sum + (r.result.signatureCount || 0), 0);
-  
+
+  const hasAnySignatures = detectionResults.some((r) => r.result.hasSignatures);
+  const totalSignatures = detectionResults.reduce(
+    (sum, r) => sum + (r.result.signatureCount || 0),
+    0,
+  );
+
   return {
     detectionResults,
     isDetecting,
@@ -132,9 +143,9 @@ export const useSignatureDetection = () => {
     getFileSignatureStatus,
     hasAnySignatures,
     totalSignatures,
-    reset: () => setDetectionResults([])
+    reset: () => setDetectionResults([]),
   };
 };
 
 // Import React for the hook
-import React from 'react';
\ No newline at end of file
+import React from "react";
diff --git a/frontend/src/core/services/signatureStorageService.ts b/frontend/src/core/services/signatureStorageService.ts
index 096c3af738..018d39cfa7 100644
--- a/frontend/src/core/services/signatureStorageService.ts
+++ b/frontend/src/core/services/signatureStorageService.ts
@@ -1,7 +1,7 @@
-import apiClient from '@app/services/apiClient';
-import type { SavedSignature } from '@app/types/signature';
+import apiClient from "@app/services/apiClient";
+import type { SavedSignature } from "@app/types/signature";
 
-export type StorageType = 'backend' | 'localStorage';
+export type StorageType = "backend" | "localStorage";
 
 interface SignatureStorageCapabilities {
   supportsBackend: boolean;
@@ -40,33 +40,41 @@ class SignatureStorageService {
   private async _performDetection(): Promise<SignatureStorageCapabilities> {
     try {
       // Probe the proprietary signatures endpoint (requires authentication)
-      await apiClient.get('/api/v1/proprietary/signatures', {
+      await apiClient.get("/api/v1/proprietary/signatures", {
         timeout: 3000,
         suppressErrorToast: true,
       });
 
       // 200 = Backend available and accessible (authenticated)
-      console.log('[SignatureStorage] Backend signature API detected and accessible (authenticated)');
+      console.log(
+        "[SignatureStorage] Backend signature API detected and accessible (authenticated)",
+      );
       return {
         supportsBackend: true,
-        storageType: 'backend',
+        storageType: "backend",
       };
     } catch (error: any) {
       // Check if it's an HTTP error with status code
       if (error?.response?.status === 401 || error?.response?.status === 403) {
         // Backend exists but needs auth - gracefully fall back to localStorage
-        console.log('[SignatureStorage] Backend signature API requires authentication, using localStorage');
+        console.log(
+          "[SignatureStorage] Backend signature API requires authentication, using localStorage",
+        );
       } else if (error?.response?.status === 404) {
         // Endpoint doesn't exist (not running proprietary mode)
-        console.log('[SignatureStorage] Backend signature API not available (not in proprietary mode), using localStorage');
+        console.log(
+          "[SignatureStorage] Backend signature API not available (not in proprietary mode), using localStorage",
+        );
       } else {
         // Network error, timeout, or other error
-        console.log('[SignatureStorage] Backend signature API not available, using localStorage');
+        console.log(
+          "[SignatureStorage] Backend signature API not available, using localStorage",
+        );
       }
 
       return {
         supportsBackend: false,
-        storageType: 'localStorage',
+        storageType: "localStorage",
       };
     }
   }
@@ -98,11 +106,11 @@ class SignatureStorageService {
   async saveSignature(signature: SavedSignature): Promise<void> {
     const capabilities = await this.detectCapabilities();
 
-    if (capabilities.supportsBackend && signature.scope !== 'localStorage') {
+    if (capabilities.supportsBackend && signature.scope !== "localStorage") {
       await this._saveToBackend(signature);
     } else {
       // Force scope to localStorage for browser storage
-      signature.scope = 'localStorage';
+      signature.scope = "localStorage";
       this._saveToLocalStorage(signature);
     }
   }
@@ -136,21 +144,29 @@ class SignatureStorageService {
   // Backend methods
   private async _loadFromBackend(): Promise<SavedSignature[]> {
     try {
-      const response = await apiClient.get<SavedSignature[]>('/api/v1/proprietary/signatures');
+      const response = await apiClient.get<SavedSignature[]>(
+        "/api/v1/proprietary/signatures",
+      );
       const signatures = response.data;
 
       // Fetch image data for each signature and convert to data URLs
       const signaturePromises = signatures.map(async (sig) => {
-        if (sig.dataUrl && sig.dataUrl.startsWith('/api/v1/general/signatures/')) {
+        if (
+          sig.dataUrl &&
+          sig.dataUrl.startsWith("/api/v1/general/signatures/")
+        ) {
           try {
             // Fetch image via apiClient (unified endpoint works for both authenticated and unauthenticated)
-            const imageResponse = await apiClient.get<ArrayBuffer>(sig.dataUrl, {
-              responseType: 'arraybuffer',
-            });
+            const imageResponse = await apiClient.get<ArrayBuffer>(
+              sig.dataUrl,
+              {
+                responseType: "arraybuffer",
+              },
+            );
 
             // Convert to data URL (base64) for both display and use
             const blob = new Blob([imageResponse.data], {
-              type: imageResponse.headers['content-type'] || 'image/png',
+              type: imageResponse.headers["content-type"] || "image/png",
             });
 
             const dataUrl = await new Promise<string>((resolve, reject) => {
@@ -163,7 +179,10 @@ class SignatureStorageService {
             // Use data URL for everything - more reliable than blob URLs
             return { ...sig, dataUrl };
           } catch (error) {
-            console.error(`[SignatureStorage] Failed to load image for ${sig.id}:`, error);
+            console.error(
+              `[SignatureStorage] Failed to load image for ${sig.id}:`,
+              error,
+            );
             return sig; // Return original if image fetch fails
           }
         }
@@ -172,25 +191,30 @@ class SignatureStorageService {
 
       return await Promise.all(signaturePromises);
     } catch (error) {
-      console.error('[SignatureStorage] Failed to load from backend:', error);
+      console.error("[SignatureStorage] Failed to load from backend:", error);
       return [];
     }
   }
 
   private async _saveToBackend(signature: SavedSignature): Promise<void> {
-    await apiClient.post('/api/v1/proprietary/signatures', signature);
+    await apiClient.post("/api/v1/proprietary/signatures", signature);
   }
 
   private async _deleteFromBackend(id: string): Promise<void> {
     await apiClient.delete(`/api/v1/proprietary/signatures/${id}`);
   }
 
-  private async _updateLabelInBackend(id: string, label: string): Promise<void> {
-    await apiClient.post(`/api/v1/proprietary/signatures/${id}/label`, { label });
+  private async _updateLabelInBackend(
+    id: string,
+    label: string,
+  ): Promise<void> {
+    await apiClient.post(`/api/v1/proprietary/signatures/${id}/label`, {
+      label,
+    });
   }
 
   // LocalStorage methods
-  private readonly STORAGE_KEY = 'stirling:saved-signatures:v1';
+  private readonly STORAGE_KEY = "stirling:saved-signatures:v1";
 
   private _loadFromLocalStorage(): SavedSignature[] {
     try {
@@ -200,7 +224,7 @@ class SignatureStorageService {
       // Ensure all localStorage signatures have the correct scope
       return signatures.map((sig: SavedSignature) => ({
         ...sig,
-        scope: 'localStorage' as const,
+        scope: "localStorage" as const,
       }));
     } catch {
       return [];
@@ -209,7 +233,7 @@ class SignatureStorageService {
 
   private _saveToLocalStorage(signature: SavedSignature): void {
     const signatures = this._loadFromLocalStorage();
-    const index = signatures.findIndex(s => s.id === signature.id);
+    const index = signatures.findIndex((s) => s.id === signature.id);
 
     if (index >= 0) {
       signatures[index] = signature;
@@ -222,13 +246,13 @@ class SignatureStorageService {
 
   private _deleteFromLocalStorage(id: string): void {
     const signatures = this._loadFromLocalStorage();
-    const filtered = signatures.filter(s => s.id !== id);
+    const filtered = signatures.filter((s) => s.id !== id);
     localStorage.setItem(this.STORAGE_KEY, JSON.stringify(filtered));
   }
 
   private _updateLabelInLocalStorage(id: string, label: string): void {
     const signatures = this._loadFromLocalStorage();
-    const signature = signatures.find(s => s.id === id);
+    const signature = signatures.find((s) => s.id === id);
     if (signature) {
       signature.label = label;
       signature.updatedAt = Date.now();
@@ -259,7 +283,10 @@ class SignatureStorageService {
         await this._saveToBackend(signature);
         migrated++;
       } catch (error) {
-        console.error(`[SignatureStorage] Failed to migrate signature ${signature.id}:`, error);
+        console.error(
+          `[SignatureStorage] Failed to migrate signature ${signature.id}:`,
+          error,
+        );
         failed++;
       }
     }
@@ -267,7 +294,9 @@ class SignatureStorageService {
     // Clear localStorage after successful migration
     if (migrated > 0 && failed === 0) {
       localStorage.removeItem(this.STORAGE_KEY);
-      console.log(`[SignatureStorage] Successfully migrated ${migrated} signatures to backend`);
+      console.log(
+        `[SignatureStorage] Successfully migrated ${migrated} signatures to backend`,
+      );
     }
 
     return { migrated, failed };
diff --git a/frontend/src/core/services/specialErrorToasts.ts b/frontend/src/core/services/specialErrorToasts.ts
index 1468b8dc47..6a38a54f53 100644
--- a/frontend/src/core/services/specialErrorToasts.ts
+++ b/frontend/src/core/services/specialErrorToasts.ts
@@ -1,4 +1,4 @@
-import { alert } from '@app/components/toast';
+import { alert } from "@app/components/toast";
 
 interface ErrorToastMapping {
   regex: RegExp;
@@ -10,29 +10,34 @@ interface ErrorToastMapping {
 const MAPPINGS: ErrorToastMapping[] = [
   {
     regex: /pdf contains an encryption dictionary/i,
-    i18nKey: 'errors.encryptedPdfMustRemovePassword',
-    defaultMessage: 'This PDF is encrypted. Please unlock it using the Unlock PDF Forms tool.'
+    i18nKey: "errors.encryptedPdfMustRemovePassword",
+    defaultMessage:
+      "This PDF is encrypted. Please unlock it using the Unlock PDF Forms tool.",
   },
   {
-    regex: /the pdf document is passworded and either the password was not provided or was incorrect/i,
-    i18nKey: 'errors.incorrectPasswordProvided',
-    defaultMessage: 'The PDF password is incorrect or not provided.'
+    regex:
+      /the pdf document is passworded and either the password was not provided or was incorrect/i,
+    i18nKey: "errors.incorrectPasswordProvided",
+    defaultMessage: "The PDF password is incorrect or not provided.",
   },
 ];
 
 function titleForStatus(status?: number): string {
-  if (!status) return 'Network error';
-  if (status >= 500) return 'Server error';
-  if (status >= 400) return 'Request error';
-  return 'Request failed';
+  if (!status) return "Network error";
+  if (status >= 500) return "Server error";
+  if (status >= 400) return "Request error";
+  return "Request failed";
 }
 
 /**
  * Match a raw backend error string against known patterns and show a friendly toast.
  * Returns true if a special toast was shown, false otherwise.
  */
-export function showSpecialErrorToast(rawError: string | undefined, options?: { status?: number }): boolean {
-  const message = (rawError || '').toString();
+export function showSpecialErrorToast(
+  rawError: string | undefined,
+  options?: { status?: number },
+): boolean {
+  const message = (rawError || "").toString();
   if (!message) return false;
 
   for (const mapping of MAPPINGS) {
@@ -40,18 +45,26 @@ export function showSpecialErrorToast(rawError: string | undefined, options?: {
       // Best-effort translation without hard dependency on i18n config
       let body = mapping.defaultMessage;
       try {
-        const anyGlobal: any = (globalThis as any);
+        const anyGlobal: any = globalThis as any;
         const i18next = anyGlobal?.i18next;
-        if (i18next && typeof i18next.t === 'function') {
-          body = i18next.t(mapping.i18nKey, { defaultValue: mapping.defaultMessage });
+        if (i18next && typeof i18next.t === "function") {
+          body = i18next.t(mapping.i18nKey, {
+            defaultValue: mapping.defaultMessage,
+          });
         }
-      } catch { /* ignore translation errors */ }
+      } catch {
+        /* ignore translation errors */
+      }
       const title = titleForStatus(options?.status);
-      alert({ alertType: 'error', title, body, expandable: true, isPersistentPopup: false });
+      alert({
+        alertType: "error",
+        title,
+        body,
+        expandable: true,
+        isPersistentPopup: false,
+      });
       return true;
     }
   }
   return false;
 }
-
-
diff --git a/frontend/src/core/services/supabaseClient.ts b/frontend/src/core/services/supabaseClient.ts
index c0ace3002e..76e440c9a6 100644
--- a/frontend/src/core/services/supabaseClient.ts
+++ b/frontend/src/core/services/supabaseClient.ts
@@ -1,4 +1,4 @@
-import { createClient, SupabaseClient } from '@supabase/supabase-js';
+import { createClient, SupabaseClient } from "@supabase/supabase-js";
 
 const supabaseUrl = import.meta.env.VITE_SUPABASE_URL;
 const supabaseAnonKey = import.meta.env.VITE_SUPABASE_PUBLISHABLE_DEFAULT_KEY;
@@ -14,7 +14,7 @@ export const supabase: SupabaseClient | null = isSupabaseConfigured
 // Log warning if not configured (for self-hosted installations)
 if (!isSupabaseConfigured) {
   console.warn(
-    'Supabase is not configured. Checkout and billing features will be disabled. ' +
-    'Static plan information will be displayed instead.'
+    "Supabase is not configured. Checkout and billing features will be disabled. " +
+      "Static plan information will be displayed instead.",
   );
 }
diff --git a/frontend/src/core/services/thumbnailGenerationService.ts b/frontend/src/core/services/thumbnailGenerationService.ts
index c20b7aa475..0112f507e4 100644
--- a/frontend/src/core/services/thumbnailGenerationService.ts
+++ b/frontend/src/core/services/thumbnailGenerationService.ts
@@ -2,9 +2,12 @@
  * High-performance thumbnail generation service using main thread processing
  */
 
-import { FileId } from '@app/types/file';
-import { pdfWorkerManager } from '@app/services/pdfWorkerManager';
-import { PDFDocumentProxy } from 'pdfjs-dist';
+import { FileId } from "@app/types/file";
+import {
+  openRawDocumentSafe,
+  closeRawDocument,
+} from "@app/services/pdfiumService";
+import { renderPdfiumPageDataUrl } from "@app/utils/pdfiumPageRender";
 
 interface ThumbnailResult {
   pageNumber: number;
@@ -27,14 +30,17 @@ interface CachedThumbnail {
 }
 
 interface CachedPDFDocument {
-  pdf: PDFDocumentProxy;
+  docPtr: number;
   lastUsed: number;
   refCount: number;
 }
 
 export class ThumbnailGenerationService {
   // Session-based thumbnail cache
-  private thumbnailCache = new Map<FileId | string /* FIX ME: Page ID */, CachedThumbnail>();
+  private thumbnailCache = new Map<
+    FileId | string /* FIX ME: Page ID */,
+    CachedThumbnail
+  >();
   private maxCacheSizeBytes = 1024 * 1024 * 1024; // 1GB cache limit
   private currentCacheSize = 0;
 
@@ -47,35 +53,32 @@ export class ThumbnailGenerationService {
   }
 
   /**
-   * Get or create a cached PDF document
+   * Get or create a cached PDFium document pointer.
    */
-  private async getCachedPDFDocument(fileId: FileId, pdfArrayBuffer: ArrayBuffer): Promise<any> {
+  private async getCachedPDFDocument(
+    fileId: FileId,
+    pdfArrayBuffer: ArrayBuffer,
+  ): Promise<number> {
     const cached = this.pdfDocumentCache.get(fileId);
     if (cached) {
       cached.lastUsed = Date.now();
       cached.refCount++;
-      return cached.pdf;
+      return cached.docPtr;
     }
 
-    // Evict old PDFs if cache is full
     while (this.pdfDocumentCache.size >= this.maxPdfCacheSize) {
       this.evictLeastRecentlyUsedPDF();
     }
 
-    // Use centralized worker manager instead of direct getDocument
-    const pdf = await pdfWorkerManager.createDocument(pdfArrayBuffer, {
-      disableAutoFetch: true,
-      disableStream: true,
-      stopAtErrors: false
-    });
+    const docPtr = await openRawDocumentSafe(pdfArrayBuffer);
 
     this.pdfDocumentCache.set(fileId, {
-      pdf,
+      docPtr,
       lastUsed: Date.now(),
-      refCount: 1
+      refCount: 1,
     });
 
-    return pdf;
+    return docPtr;
   }
 
   /**
@@ -104,7 +107,7 @@ export class ThumbnailGenerationService {
     }
 
     if (oldestEntry) {
-      pdfWorkerManager.destroyDocument(oldestEntry[1].pdf); // Use worker manager for cleanup
+      void closeRawDocument(oldestEntry[1].docPtr);
       this.pdfDocumentCache.delete(oldestEntry[0]);
     }
   }
@@ -117,27 +120,35 @@ export class ThumbnailGenerationService {
     pdfArrayBuffer: ArrayBuffer,
     pageNumbers: number[],
     options: ThumbnailGenerationOptions = {},
-    onProgress?: (progress: { completed: number; total: number; thumbnails: ThumbnailResult[] }) => void
+    onProgress?: (progress: {
+      completed: number;
+      total: number;
+      thumbnails: ThumbnailResult[];
+    }) => void,
   ): Promise<ThumbnailResult[]> {
     // Input validation
-    if (!fileId || typeof fileId !== 'string' || fileId.trim() === '') {
-      throw new Error('generateThumbnails: fileId must be a non-empty string');
+    if (!fileId || typeof fileId !== "string" || fileId.trim() === "") {
+      throw new Error("generateThumbnails: fileId must be a non-empty string");
     }
 
     if (!pdfArrayBuffer || pdfArrayBuffer.byteLength === 0) {
-      throw new Error('generateThumbnails: pdfArrayBuffer must not be empty');
+      throw new Error("generateThumbnails: pdfArrayBuffer must not be empty");
     }
 
     if (!pageNumbers || pageNumbers.length === 0) {
-      throw new Error('generateThumbnails: pageNumbers must not be empty');
+      throw new Error("generateThumbnails: pageNumbers must not be empty");
     }
 
-    const {
-      scale = 0.2,
-      quality = 0.8
-    } = options;
+    const { scale = 0.2, quality = 0.8 } = options;
 
-    return await this.generateThumbnailsMainThread(fileId, pdfArrayBuffer, pageNumbers, scale, quality, onProgress);
+    return await this.generateThumbnailsMainThread(
+      fileId,
+      pdfArrayBuffer,
+      pageNumbers,
+      scale,
+      quality,
+      onProgress,
+    );
   }
 
   /**
@@ -149,9 +160,13 @@ export class ThumbnailGenerationService {
     pageNumbers: number[],
     scale: number,
     quality: number,
-    onProgress?: (progress: { completed: number; total: number; thumbnails: ThumbnailResult[] }) => void
+    onProgress?: (progress: {
+      completed: number;
+      total: number;
+      thumbnails: ThumbnailResult[];
+    }) => void,
   ): Promise<ThumbnailResult[]> {
-    const pdf = await this.getCachedPDFDocument(fileId, pdfArrayBuffer);
+    const docPtr = await this.getCachedPDFDocument(fileId, pdfArrayBuffer);
 
     const allResults: ThumbnailResult[] = [];
     let completed = 0;
@@ -164,30 +179,26 @@ export class ThumbnailGenerationService {
       // Process batch sequentially (to avoid canvas conflicts)
       for (const pageNumber of batch) {
         try {
-          const page = await pdf.getPage(pageNumber);
-          const viewport = page.getViewport({ scale, rotation: 0 });
-
-          const canvas = document.createElement('canvas');
-          canvas.width = viewport.width;
-          canvas.height = viewport.height;
-
-          const context = canvas.getContext('2d');
-          if (!context) {
-            throw new Error('Could not get canvas context');
+          const thumbnail = await renderPdfiumPageDataUrl(
+            docPtr,
+            pageNumber - 1,
+            scale,
+            { applyRotation: false, format: "jpeg", quality },
+          );
+          if (!thumbnail) {
+            throw new Error(`Could not render page ${pageNumber}`);
           }
-
-          await page.render({ canvasContext: context, viewport }).promise;
-          const thumbnail = canvas.toDataURL('image/jpeg', quality);
-
           allResults.push({ pageNumber, thumbnail, success: true });
-
         } catch (error) {
-          console.error(`Failed to generate thumbnail for page ${pageNumber}:`, error);
+          console.error(
+            `Failed to generate thumbnail for page ${pageNumber}:`,
+            error,
+          );
           allResults.push({
             pageNumber,
-            thumbnail: '',
+            thumbnail: "",
             success: false,
-            error: error instanceof Error ? error.message : 'Unknown error'
+            error: error instanceof Error ? error.message : "Unknown error",
           });
         }
       }
@@ -199,12 +210,12 @@ export class ThumbnailGenerationService {
         onProgress({
           completed,
           total: pageNumbers.length,
-          thumbnails: allResults.slice(-batch.length).filter(r => r.success)
+          thumbnails: allResults.slice(-batch.length).filter((r) => r.success),
         });
       }
 
       // Yield control to prevent UI blocking
-      await new Promise(resolve => setTimeout(resolve, 1));
+      await new Promise((resolve) => setTimeout(resolve, 1));
     }
 
     // Release reference to PDF document (don't destroy - keep in cache)
@@ -231,14 +242,17 @@ export class ThumbnailGenerationService {
     const sizeBytes = thumbnail.length * 2; // Rough estimate for base64 string
 
     // Enforce cache size limits
-    while (this.currentCacheSize + sizeBytes > this.maxCacheSizeBytes && this.thumbnailCache.size > 0) {
+    while (
+      this.currentCacheSize + sizeBytes > this.maxCacheSizeBytes &&
+      this.thumbnailCache.size > 0
+    ) {
       this.evictLeastRecentlyUsed();
     }
 
     this.thumbnailCache.set(pageId, {
       thumbnail,
       lastUsed: Date.now(),
-      sizeBytes
+      sizeBytes,
     });
 
     this.currentCacheSize += sizeBytes;
@@ -265,7 +279,7 @@ export class ThumbnailGenerationService {
     return {
       size: this.thumbnailCache.size,
       sizeBytes: this.currentCacheSize,
-      maxSizeBytes: this.maxCacheSizeBytes
+      maxSizeBytes: this.maxCacheSizeBytes,
     };
   }
 
@@ -281,7 +295,7 @@ export class ThumbnailGenerationService {
   clearPDFCache(): void {
     // Destroy all cached PDF documents using worker manager
     for (const [, cached] of this.pdfDocumentCache) {
-      pdfWorkerManager.destroyDocument(cached.pdf);
+      void closeRawDocument(cached.docPtr);
     }
     this.pdfDocumentCache.clear();
   }
@@ -289,7 +303,7 @@ export class ThumbnailGenerationService {
   clearPDFCacheForFile(fileId: FileId): void {
     const cached = this.pdfDocumentCache.get(fileId);
     if (cached) {
-      pdfWorkerManager.destroyDocument(cached.pdf);
+      void closeRawDocument(cached.docPtr);
       this.pdfDocumentCache.delete(fileId);
     }
   }
@@ -301,7 +315,7 @@ export class ThumbnailGenerationService {
   cleanupCompletedDocument(fileId: FileId): void {
     const cached = this.pdfDocumentCache.get(fileId);
     if (cached && cached.refCount <= 0) {
-      pdfWorkerManager.destroyDocument(cached.pdf);
+      void closeRawDocument(cached.docPtr);
       this.pdfDocumentCache.delete(fileId);
     }
   }
diff --git a/frontend/src/core/services/updateService.ts b/frontend/src/core/services/updateService.ts
index e83b222e1a..86d3749f58 100644
--- a/frontend/src/core/services/updateService.ts
+++ b/frontend/src/core/services/updateService.ts
@@ -1,9 +1,9 @@
-import { DOWNLOAD_BASE_URL } from '@app/constants/downloads';
+import { DOWNLOAD_BASE_URL } from "@app/constants/downloads";
 
 export interface UpdateSummary {
   latest_version: string | null;
   latest_stable_version?: string | null;
-  max_priority: 'urgent' | 'normal' | 'minor' | 'low';
+  max_priority: "urgent" | "normal" | "minor" | "low";
   recommended_action?: string;
   any_breaking: boolean;
   migration_guides?: Array<{
@@ -15,7 +15,7 @@ export interface UpdateSummary {
 
 export interface VersionUpdate {
   version: string;
-  priority: 'urgent' | 'normal' | 'minor' | 'low';
+  priority: "urgent" | "normal" | "minor" | "low";
   announcement: {
     title: string;
     message: string;
@@ -40,15 +40,16 @@ export interface MachineInfo {
 }
 
 export class UpdateService {
-  private readonly baseUrl = 'https://supabase.stirling.com/functions/v1/updates';
+  private readonly baseUrl =
+    "https://supabase.stirling.com/functions/v1/updates";
 
   /**
    * Compare two version strings
    * @returns 1 if v1 > v2, -1 if v1 < v2, 0 if equal
    */
   compareVersions(version1: string, version2: string): number {
-    const v1 = version1.split('.');
-    const v2 = version2.split('.');
+    const v1 = version1.split(".");
+    const v2 = version2.split(".");
 
     for (let i = 0; i < v1.length || i < v2.length; i++) {
       const n1 = parseInt(v1[i]) || 0;
@@ -69,26 +70,34 @@ export class UpdateService {
    */
   getDownloadUrl(machineInfo: MachineInfo): string | null {
     // Only show download for non-Docker installations
-    if (machineInfo.machineType === 'Docker' || machineInfo.machineType === 'Kubernetes') {
+    if (
+      machineInfo.machineType === "Docker" ||
+      machineInfo.machineType === "Kubernetes"
+    ) {
       return null;
     }
 
     // Determine file based on machine type and security
-    if (machineInfo.machineType === 'Server-jar') {
-      return DOWNLOAD_BASE_URL + (machineInfo.activeSecurity ? 'Stirling-PDF-with-login.jar' : 'Stirling-PDF.jar');
+    if (machineInfo.machineType === "Server-jar") {
+      return (
+        DOWNLOAD_BASE_URL +
+        (machineInfo.activeSecurity
+          ? "Stirling-PDF-with-login.jar"
+          : "Stirling-PDF.jar")
+      );
     }
 
     // Client installations
-    if (machineInfo.machineType.startsWith('Client-')) {
-      const os = machineInfo.machineType.replace('Client-', ''); // win, mac, unix
-      const type = machineInfo.activeSecurity ? '-server-security' : '-server';
+    if (machineInfo.machineType.startsWith("Client-")) {
+      const os = machineInfo.machineType.replace("Client-", ""); // win, mac, unix
+      const type = machineInfo.activeSecurity ? "-server-security" : "-server";
 
-      if (os === 'unix') {
-        return DOWNLOAD_BASE_URL + os + type + '.jar';
-      } else if (os === 'win') {
-        return DOWNLOAD_BASE_URL + os + '-installer.exe';
-      } else if (os === 'mac') {
-        return DOWNLOAD_BASE_URL + os + '-installer.dmg';
+      if (os === "unix") {
+        return DOWNLOAD_BASE_URL + os + type + ".jar";
+      } else if (os === "win") {
+        return DOWNLOAD_BASE_URL + os + "-installer.exe";
+      } else if (os === "mac") {
+        return DOWNLOAD_BASE_URL + os + "-installer.dmg";
       }
     }
 
@@ -98,31 +107,37 @@ export class UpdateService {
   /**
    * Fetch update summary from API
    */
-  async getUpdateSummary(currentVersion: string, machineInfo: MachineInfo): Promise<UpdateSummary | null> {
+  async getUpdateSummary(
+    currentVersion: string,
+    machineInfo: MachineInfo,
+  ): Promise<UpdateSummary | null> {
     // Map Java License enum to API types
-    let type = 'normal';
-    if (machineInfo.licenseType === 'SERVER') {
-      type = 'server';
-    } else if (machineInfo.licenseType === 'ENTERPRISE') {
-      type = 'enterprise';
+    let type = "normal";
+    if (machineInfo.licenseType === "SERVER") {
+      type = "server";
+    } else if (machineInfo.licenseType === "ENTERPRISE") {
+      type = "enterprise";
     }
 
     const url = `${this.baseUrl}?from=${currentVersion}&type=${type}&login=${machineInfo.activeSecurity}&summary=true`;
-    console.log('Fetching update summary from:', url);
+    console.log("Fetching update summary from:", url);
 
     try {
       const response = await fetch(url);
-      console.log('Response status:', response.status);
+      console.log("Response status:", response.status);
 
       if (response.status === 200) {
         const data = await response.json();
         return data as UpdateSummary;
       } else {
-        console.error('Failed to fetch update summary from Supabase:', response.status);
+        console.error(
+          "Failed to fetch update summary from Supabase:",
+          response.status,
+        );
         return null;
       }
     } catch (error) {
-      console.error('Failed to fetch update summary from Supabase:', error);
+      console.error("Failed to fetch update summary from Supabase:", error);
       return null;
     }
   }
@@ -130,31 +145,37 @@ export class UpdateService {
   /**
    * Fetch full update information with detailed version info
    */
-  async getFullUpdateInfo(currentVersion: string, machineInfo: MachineInfo): Promise<FullUpdateInfo | null> {
+  async getFullUpdateInfo(
+    currentVersion: string,
+    machineInfo: MachineInfo,
+  ): Promise<FullUpdateInfo | null> {
     // Map Java License enum to API types
-    let type = 'normal';
-    if (machineInfo.licenseType === 'SERVER') {
-      type = 'server';
-    } else if (machineInfo.licenseType === 'ENTERPRISE') {
-      type = 'enterprise';
+    let type = "normal";
+    if (machineInfo.licenseType === "SERVER") {
+      type = "server";
+    } else if (machineInfo.licenseType === "ENTERPRISE") {
+      type = "enterprise";
     }
 
     const url = `${this.baseUrl}?from=${currentVersion}&type=${type}&login=${machineInfo.activeSecurity}&summary=false`;
-    console.log('Fetching full update info from:', url);
+    console.log("Fetching full update info from:", url);
 
     try {
       const response = await fetch(url);
-      console.log('Full update response status:', response.status);
+      console.log("Full update response status:", response.status);
 
       if (response.status === 200) {
         const data = await response.json();
         return data as FullUpdateInfo;
       } else {
-        console.error('Failed to fetch full update info from Supabase:', response.status);
+        console.error(
+          "Failed to fetch full update info from Supabase:",
+          response.status,
+        );
         return null;
       }
     } catch (error) {
-      console.error('Failed to fetch full update info from Supabase:', error);
+      console.error("Failed to fetch full update info from Supabase:", error);
       return null;
     }
   }
@@ -163,7 +184,8 @@ export class UpdateService {
    * Get current version from GitHub build.gradle as fallback
    */
   async getCurrentVersionFromGitHub(): Promise<string> {
-    const url = 'https://raw.githubusercontent.com/Stirling-Tools/Stirling-PDF/master/build.gradle';
+    const url =
+      "https://raw.githubusercontent.com/Stirling-Tools/Stirling-PDF/master/build.gradle";
 
     try {
       const response = await fetch(url);
@@ -175,10 +197,10 @@ export class UpdateService {
           return match[1];
         }
       }
-      throw new Error('Version number not found');
+      throw new Error("Version number not found");
     } catch (error) {
-      console.error('Failed to fetch latest version from build.gradle:', error);
-      return '';
+      console.error("Failed to fetch latest version from build.gradle:", error);
+      return "";
     }
   }
 }
diff --git a/frontend/src/core/services/usageAnalyticsService.ts b/frontend/src/core/services/usageAnalyticsService.ts
index 4268a91f5a..8f580c820b 100644
--- a/frontend/src/core/services/usageAnalyticsService.ts
+++ b/frontend/src/core/services/usageAnalyticsService.ts
@@ -1,4 +1,4 @@
-import apiClient from '@app/services/apiClient';
+import apiClient from "@app/services/apiClient";
 
 export interface EndpointStatistic {
   endpoint: string;
@@ -23,7 +23,7 @@ const usageAnalyticsService = {
    */
   async getEndpointStatistics(
     limit?: number,
-    dataType: 'all' | 'api' | 'ui' = 'all'
+    dataType: "all" | "api" | "ui" = "all",
   ): Promise<EndpointStatisticsResponse> {
     const params: Record<string, any> = {};
 
@@ -31,13 +31,15 @@ const usageAnalyticsService = {
       params.limit = limit;
     }
 
-    if (dataType !== 'all') {
+    if (dataType !== "all") {
       params.dataType = dataType;
     }
 
     const response = await apiClient.get<EndpointStatisticsResponse>(
-      '/api/v1/proprietary/ui-data/usage-endpoint-statistics',
-      { params }
+      "/api/v1/proprietary/ui-data/usage-endpoint-statistics",
+      {
+        params,
+      },
     );
     return response.data;
   },
@@ -47,7 +49,7 @@ const usageAnalyticsService = {
    */
   async getChartData(
     limit?: number,
-    dataType: 'all' | 'api' | 'ui' = 'all'
+    dataType: "all" | "api" | "ui" = "all",
   ): Promise<UsageChartData> {
     const stats = await this.getEndpointStatistics(limit, dataType);
 
diff --git a/frontend/src/core/services/zipFileService.ts b/frontend/src/core/services/zipFileService.ts
index 565e90e754..ffe5d97588 100644
--- a/frontend/src/core/services/zipFileService.ts
+++ b/frontend/src/core/services/zipFileService.ts
@@ -1,15 +1,15 @@
-import JSZip, { JSZipObject } from 'jszip';
-import { StirlingFileStub, createStirlingFile } from '@app/types/fileContext';
-import { generateThumbnailForFile } from '@app/utils/thumbnailUtils';
-import { fileStorage } from '@app/services/fileStorage';
+import JSZip, { JSZipObject } from "jszip";
+import { StirlingFileStub, createStirlingFile } from "@app/types/fileContext";
+import { generateThumbnailForFile } from "@app/utils/thumbnailUtils";
+import { fileStorage } from "@app/services/fileStorage";
 
 // Undocumented interface in JSZip for JSZipObject._data
 interface CompressedObject {
-    compressedSize: number;
-    uncompressedSize: number;
-    crc32: number;
-    compression: object;
-    compressedContent: string|ArrayBuffer|Uint8Array|Buffer;
+  compressedSize: number;
+  uncompressedSize: number;
+  crc32: number;
+  compression: object;
+  compressedContent: string | ArrayBuffer | Uint8Array | Buffer;
 }
 
 const getData = (zipEntry: JSZipObject): CompressedObject | undefined => {
@@ -49,12 +49,12 @@ export class ZipFileService {
 
   // ZIP file validation constants
   private static readonly VALID_ZIP_TYPES = [
-    'application/zip',
-    'application/x-zip-compressed',
-    'application/x-zip',
-    'application/octet-stream' // Some browsers use this for ZIP files
+    "application/zip",
+    "application/x-zip-compressed",
+    "application/x-zip",
+    "application/octet-stream", // Some browsers use this for ZIP files
   ];
-  private static readonly VALID_ZIP_EXTENSIONS = ['.zip'];
+  private static readonly VALID_ZIP_EXTENSIONS = [".zip"];
 
   /**
    * Validate a ZIP file without extracting it
@@ -66,19 +66,21 @@ export class ZipFileService {
       totalSizeBytes: 0,
       containsPDFs: false,
       containsFiles: false,
-      errors: []
+      errors: [],
     };
 
     try {
       // Check file size
       if (file.size > this.maxTotalSize) {
-        result.errors.push(`ZIP file too large: ${this.formatFileSize(file.size)} (max: ${this.formatFileSize(this.maxTotalSize)})`);
+        result.errors.push(
+          `ZIP file too large: ${this.formatFileSize(file.size)} (max: ${this.formatFileSize(this.maxTotalSize)})`,
+        );
         return result;
       }
 
       // Check file type
       if (!this.isZipFile(file)) {
-        result.errors.push('File is not a valid ZIP archive');
+        result.errors.push("File is not a valid ZIP archive");
         return result;
       }
 
@@ -107,13 +109,17 @@ export class ZipFileService {
 
         // Check individual file size
         if (uncompressedSize > this.maxFileSize) {
-          result.errors.push(`File "${filename}" too large: ${this.formatFileSize(uncompressedSize)} (max: ${this.formatFileSize(this.maxFileSize)})`);
+          result.errors.push(
+            `File "${filename}" too large: ${this.formatFileSize(uncompressedSize)} (max: ${this.formatFileSize(this.maxFileSize)})`,
+          );
         }
       }
 
       // Check total uncompressed size
       if (totalSize > this.maxTotalSize) {
-        result.errors.push(`Total uncompressed size too large: ${this.formatFileSize(totalSize)} (max: ${this.formatFileSize(this.maxTotalSize)})`);
+        result.errors.push(
+          `Total uncompressed size too large: ${this.formatFileSize(totalSize)} (max: ${this.formatFileSize(this.maxTotalSize)})`,
+        );
       }
 
       result.fileCount = fileCount;
@@ -125,12 +131,14 @@ export class ZipFileService {
       result.isValid = result.errors.length === 0 && result.containsFiles;
 
       if (!result.containsFiles) {
-        result.errors.push('ZIP file does not contain any files');
+        result.errors.push("ZIP file does not contain any files");
       }
 
       return result;
     } catch (error) {
-      result.errors.push(`Failed to validate ZIP file: ${error instanceof Error ? error.message : 'Unknown error'}`);
+      result.errors.push(
+        `Failed to validate ZIP file: ${error instanceof Error ? error.message : "Unknown error"}`,
+      );
       return result;
     }
   }
@@ -138,7 +146,10 @@ export class ZipFileService {
   /**
    * Create a ZIP file from an array of files
    */
-  async createZipFromFiles(files: File[], zipFilename: string): Promise<{ zipFile: File; size: number }> {
+  async createZipFromFiles(
+    files: File[],
+    zipFilename: string,
+  ): Promise<{ zipFile: File; size: number }> {
     try {
       const zip = new JSZip();
 
@@ -150,21 +161,23 @@ export class ZipFileService {
 
       // Generate ZIP blob
       const zipBlob = await zip.generateAsync({
-        type: 'blob',
-        compression: 'DEFLATE',
-        compressionOptions: { level: 6 }
+        type: "blob",
+        compression: "DEFLATE",
+        compressionOptions: { level: 6 },
       });
 
       const zipFile = new File([zipBlob], zipFilename, {
-        type: 'application/zip',
-        lastModified: Date.now()
+        type: "application/zip",
+        lastModified: Date.now(),
       });
 
       return { zipFile, size: zipFile.size };
     } catch (error) {
       throw new Error(
-        `Failed to create ZIP file: ${error instanceof Error ? error.message : 'Unknown error'}`,
-        { cause: error }
+        `Failed to create ZIP file: ${error instanceof Error ? error.message : "Unknown error"}`,
+        {
+          cause: error,
+        },
       );
     }
   }
@@ -174,14 +187,14 @@ export class ZipFileService {
    */
   async extractPdfFiles(
     file: File,
-    onProgress?: (progress: ZipExtractionProgress) => void
+    onProgress?: (progress: ZipExtractionProgress) => void,
   ): Promise<ZipExtractionResult> {
     const result: ZipExtractionResult = {
       success: false,
       extractedFiles: [],
       errors: [],
       totalFiles: 0,
-      extractedCount: 0
+      extractedCount: 0,
     };
 
     try {
@@ -197,8 +210,8 @@ export class ZipFileService {
       const zipContents = await zip.loadAsync(file);
 
       // Get all PDF files
-      const pdfFiles = Object.entries(zipContents.files).filter(([filename, zipEntry]) =>
-        !zipEntry.dir && this.isPdfFile(filename)
+      const pdfFiles = Object.entries(zipContents.files).filter(
+        ([filename, zipEntry]) => !zipEntry.dir && this.isPdfFile(filename),
       );
 
       result.totalFiles = pdfFiles.length;
@@ -214,18 +227,22 @@ export class ZipFileService {
               currentFile: filename,
               extractedCount: i,
               totalFiles: pdfFiles.length,
-              progress: (i / pdfFiles.length) * 100
+              progress: (i / pdfFiles.length) * 100,
             });
           }
 
           // Extract file content
-          const content = await zipEntry.async('uint8array');
+          const content = await zipEntry.async("uint8array");
 
           // Create File object
-          const extractedFile = new File([content as any], this.sanitizeFilename(filename), {
-            type: 'application/pdf',
-            lastModified: zipEntry.date?.getTime() || Date.now()
-          });
+          const extractedFile = new File(
+            [content as any],
+            this.sanitizeFilename(filename),
+            {
+              type: "application/pdf",
+              lastModified: zipEntry.date?.getTime() || Date.now(),
+            },
+          );
 
           // Validate extracted PDF
           if (await this.isValidPdfFile(extractedFile)) {
@@ -235,24 +252,28 @@ export class ZipFileService {
             result.errors.push(`File "${filename}" is not a valid PDF`);
           }
         } catch (error) {
-          result.errors.push(`Failed to extract "${filename}": ${error instanceof Error ? error.message : 'Unknown error'}`);
+          result.errors.push(
+            `Failed to extract "${filename}": ${error instanceof Error ? error.message : "Unknown error"}`,
+          );
         }
       }
 
       // Final progress report
       if (onProgress) {
         onProgress({
-          currentFile: '',
+          currentFile: "",
           extractedCount: result.extractedCount,
           totalFiles: result.totalFiles,
-          progress: 100
+          progress: 100,
         });
       }
 
       result.success = result.extractedCount > 0;
       return result;
     } catch (error) {
-      result.errors.push(`Failed to extract ZIP file: ${error instanceof Error ? error.message : 'Unknown error'}`);
+      result.errors.push(
+        `Failed to extract ZIP file: ${error instanceof Error ? error.message : "Unknown error"}`,
+      );
       return result;
     }
   }
@@ -262,8 +283,8 @@ export class ZipFileService {
    */
   public isZipFile(file: File): boolean {
     const hasValidType = ZipFileService.VALID_ZIP_TYPES.includes(file.type);
-    const hasValidExtension = ZipFileService.VALID_ZIP_EXTENSIONS.some(ext =>
-      file.name.toLowerCase().endsWith(ext)
+    const hasValidExtension = ZipFileService.VALID_ZIP_EXTENSIONS.some((ext) =>
+      file.name.toLowerCase().endsWith(ext),
     );
 
     return hasValidType || hasValidExtension;
@@ -273,9 +294,10 @@ export class ZipFileService {
    * Check if a StirlingFileStub represents a ZIP file (for UI checks without loading full file)
    */
   public isZipFileStub(stub: StirlingFileStub): boolean {
-    const hasValidType = stub.type && ZipFileService.VALID_ZIP_TYPES.includes(stub.type);
-    const hasValidExtension = ZipFileService.VALID_ZIP_EXTENSIONS.some(ext =>
-      stub.name.toLowerCase().endsWith(ext)
+    const hasValidType =
+      stub.type && ZipFileService.VALID_ZIP_TYPES.includes(stub.type);
+    const hasValidExtension = ZipFileService.VALID_ZIP_EXTENSIONS.some((ext) =>
+      stub.name.toLowerCase().endsWith(ext),
     );
 
     return hasValidType || hasValidExtension;
@@ -285,7 +307,7 @@ export class ZipFileService {
    * Check if a filename indicates a PDF file
    */
   private isPdfFile(filename: string): boolean {
-    return filename.toLowerCase().endsWith('.pdf');
+    return filename.toLowerCase().endsWith(".pdf");
   }
 
   /**
@@ -293,7 +315,11 @@ export class ZipFileService {
    */
   private isHtmlFile(filename: string): boolean {
     const lowerName = filename.toLowerCase();
-    return lowerName.endsWith('.html') || lowerName.endsWith('.htm') || lowerName.endsWith('.xhtml');
+    return (
+      lowerName.endsWith(".html") ||
+      lowerName.endsWith(".htm") ||
+      lowerName.endsWith(".xhtml")
+    );
   }
 
   /**
@@ -314,7 +340,7 @@ export class ZipFileService {
 
       return false;
     } catch (error) {
-      console.error('Error checking for HTML files:', error);
+      console.error("Error checking for HTML files:", error);
       return false;
     }
   }
@@ -329,11 +355,13 @@ export class ZipFileService {
       const bytes = new Uint8Array(buffer);
 
       // Check for PDF header: %PDF-
-      return bytes[0] === 0x25 && // %
-             bytes[1] === 0x50 && // P
-             bytes[2] === 0x44 && // D
-             bytes[3] === 0x46 && // F
-             bytes[4] === 0x2D;   // -
+      return (
+        bytes[0] === 0x25 && // %
+        bytes[1] === 0x50 && // P
+        bytes[2] === 0x44 && // D
+        bytes[3] === 0x46 && // F
+        bytes[4] === 0x2d
+      ); // -
     } catch {
       return false;
     }
@@ -344,25 +372,25 @@ export class ZipFileService {
    */
   private sanitizeFilename(filename: string): string {
     // Remove directory path and get just the filename
-    const basename = filename.split('/').pop() || filename;
+    const basename = filename.split("/").pop() || filename;
 
     // Remove or replace unsafe characters
     return basename
-      .replace(/[<>:"/\\|?*]/g, '_') // Replace unsafe chars with underscore
-      .replace(/\s+/g, '_') // Replace spaces with underscores
-      .replace(/_{2,}/g, '_') // Replace multiple underscores with single
-      .replace(/^_|_$/g, ''); // Remove leading/trailing underscores
+      .replace(/[<>:"/\\|?*]/g, "_") // Replace unsafe chars with underscore
+      .replace(/\s+/g, "_") // Replace spaces with underscores
+      .replace(/_{2,}/g, "_") // Replace multiple underscores with single
+      .replace(/^_|_$/g, ""); // Remove leading/trailing underscores
   }
 
   /**
    * Format file size for display
    */
   private formatFileSize(bytes: number): string {
-    if (bytes === 0) return '0 B';
+    if (bytes === 0) return "0 B";
     const k = 1024;
-    const sizes = ['B', 'KB', 'MB', 'GB'];
+    const sizes = ["B", "KB", "MB", "GB"];
     const i = Math.floor(Math.log(bytes) / Math.log(k));
-    return parseFloat((bytes / Math.pow(k, i)).toFixed(2)) + ' ' + sizes[i];
+    return parseFloat((bytes / Math.pow(k, i)).toFixed(2)) + " " + sizes[i];
   }
 
   /**
@@ -379,14 +407,16 @@ export class ZipFileService {
     zipBlob: Blob | File,
     autoUnzip: boolean,
     autoUnzipFileLimit: number,
-    skipAutoUnzip: boolean = false
+    skipAutoUnzip: boolean = false,
   ): Promise<{ shouldExtract: boolean; fileCount: number }> {
     try {
       // Automation always extracts - but still need to count files for warning
       if (skipAutoUnzip) {
         const zip = new JSZip();
         const zipContents = await zip.loadAsync(zipBlob);
-        const fileCount = Object.values(zipContents.files).filter(entry => !entry.dir).length;
+        const fileCount = Object.values(zipContents.files).filter(
+          (entry) => !entry.dir,
+        ).length;
         return { shouldExtract: true, fileCount };
       }
 
@@ -400,15 +430,17 @@ export class ZipFileService {
       const zipContents = await zip.loadAsync(zipBlob);
 
       // Count non-directory entries
-      const fileCount = Object.values(zipContents.files).filter(entry => !entry.dir).length;
+      const fileCount = Object.values(zipContents.files).filter(
+        (entry) => !entry.dir,
+      ).length;
 
       // Only extract if within limit
       return {
         shouldExtract: fileCount <= autoUnzipFileLimit,
-        fileCount
+        fileCount,
       };
     } catch (error) {
-      console.error('Error checking shouldUnzip:', error);
+      console.error("Error checking shouldUnzip:", error);
       // On error, default to not extracting (safer)
       return { shouldExtract: false, fileCount: 0 };
     }
@@ -430,14 +462,18 @@ export class ZipFileService {
       autoUnzip: boolean;
       autoUnzipFileLimit: number;
       skipAutoUnzip?: boolean;
-      confirmLargeExtraction?: (fileCount: number, fileName: string) => Promise<boolean>;
-    }
+      confirmLargeExtraction?: (
+        fileCount: number,
+        fileName: string,
+      ) => Promise<boolean>;
+    },
   ): Promise<File[]> {
     try {
       // Create File object if not already
-      const zipFile = zipBlob instanceof File
-        ? zipBlob
-        : new File([zipBlob], 'result.zip', { type: 'application/zip' });
+      const zipFile =
+        zipBlob instanceof File
+          ? zipBlob
+          : new File([zipBlob], "result.zip", { type: "application/zip" });
 
       // Check if ZIP contains HTML files - if so, keep as ZIP
       const containsHtml = await this.containsHtmlFiles(zipFile);
@@ -450,7 +486,7 @@ export class ZipFileService {
         zipBlob,
         options.autoUnzip,
         options.autoUnzipFileLimit,
-        options.skipAutoUnzip || false
+        options.skipAutoUnzip || false,
       );
 
       if (!shouldExtract) {
@@ -458,8 +494,14 @@ export class ZipFileService {
       }
 
       // Warn user if ZIP is large (fileCount already obtained from shouldUnzip)
-      if (fileCount > ZipFileService.ZIP_WARNING_THRESHOLD && options.confirmLargeExtraction) {
-        const userConfirmed = await options.confirmLargeExtraction(fileCount, zipFile.name);
+      if (
+        fileCount > ZipFileService.ZIP_WARNING_THRESHOLD &&
+        options.confirmLargeExtraction
+      ) {
+        const userConfirmed = await options.confirmLargeExtraction(
+          fileCount,
+          zipFile.name,
+        );
         if (!userConfirmed) {
           return [zipFile]; // User cancelled, keep ZIP as-is
         }
@@ -467,13 +509,16 @@ export class ZipFileService {
 
       // Extract all files
       const extractionResult = await this.extractAllFiles(zipFile);
-      return extractionResult.success ? extractionResult.extractedFiles : [zipFile];
+      return extractionResult.success
+        ? extractionResult.extractedFiles
+        : [zipFile];
     } catch (error) {
-      console.error('Error in extractWithPreferences:', error);
+      console.error("Error in extractWithPreferences:", error);
       // On error, return ZIP as-is
-      const zipFile = zipBlob instanceof File
-        ? zipBlob
-        : new File([zipBlob], 'result.zip', { type: 'application/zip' });
+      const zipFile =
+        zipBlob instanceof File
+          ? zipBlob
+          : new File([zipBlob], "result.zip", { type: "application/zip" });
       return [zipFile];
     }
   }
@@ -483,14 +528,14 @@ export class ZipFileService {
    */
   async extractAllFiles(
     file: File | Blob,
-    onProgress?: (progress: ZipExtractionProgress) => void
+    onProgress?: (progress: ZipExtractionProgress) => void,
   ): Promise<ZipExtractionResult> {
     const result: ZipExtractionResult = {
       success: false,
       extractedFiles: [],
       errors: [],
       totalFiles: 0,
-      extractedCount: 0
+      extractedCount: 0,
     };
 
     try {
@@ -499,8 +544,8 @@ export class ZipFileService {
       const zipContents = await zip.loadAsync(file);
 
       // Get all files (not directories)
-      const allFiles = Object.entries(zipContents.files).filter(([, zipEntry]) =>
-        !zipEntry.dir
+      const allFiles = Object.entries(zipContents.files).filter(
+        ([, zipEntry]) => !zipEntry.dir,
       );
 
       result.totalFiles = allFiles.length;
@@ -516,40 +561,44 @@ export class ZipFileService {
               currentFile: filename,
               extractedCount: i,
               totalFiles: allFiles.length,
-              progress: (i / allFiles.length) * 100
+              progress: (i / allFiles.length) * 100,
             });
           }
 
           // Extract file content
-          const content = await zipEntry.async('blob');
+          const content = await zipEntry.async("blob");
 
           // Create File object with appropriate MIME type
           const mimeType = this.getMimeTypeFromExtension(filename);
-          const extractedFile = new File([content], filename, { type: mimeType });
+          const extractedFile = new File([content], filename, {
+            type: mimeType,
+          });
 
           result.extractedFiles.push(extractedFile);
           result.extractedCount++;
-
         } catch (error) {
-          const errorMessage = error instanceof Error ? error.message : 'Unknown error';
-          result.errors.push(`Failed to extract "${filename}": ${errorMessage}`);
+          const errorMessage =
+            error instanceof Error ? error.message : "Unknown error";
+          result.errors.push(
+            `Failed to extract "${filename}": ${errorMessage}`,
+          );
         }
       }
 
       // Final progress report
       if (onProgress) {
         onProgress({
-          currentFile: '',
+          currentFile: "",
           extractedCount: result.extractedCount,
           totalFiles: result.totalFiles,
-          progress: 100
+          progress: 100,
         });
       }
 
       result.success = result.extractedFiles.length > 0;
-
     } catch (error) {
-      const errorMessage = error instanceof Error ? error.message : 'Unknown error';
+      const errorMessage =
+        error instanceof Error ? error.message : "Unknown error";
       result.errors.push(`Failed to process ZIP file: ${errorMessage}`);
     }
 
@@ -560,41 +609,41 @@ export class ZipFileService {
    * Get MIME type based on file extension
    */
   private getMimeTypeFromExtension(fileName: string): string {
-    const ext = fileName.toLowerCase().split('.').pop();
+    const ext = fileName.toLowerCase().split(".").pop();
 
     const mimeTypes: Record<string, string> = {
       // Images
-      'png': 'image/png',
-      'jpg': 'image/jpeg',
-      'jpeg': 'image/jpeg',
-      'gif': 'image/gif',
-      'webp': 'image/webp',
-      'bmp': 'image/bmp',
-      'svg': 'image/svg+xml',
-      'tiff': 'image/tiff',
-      'tif': 'image/tiff',
+      png: "image/png",
+      jpg: "image/jpeg",
+      jpeg: "image/jpeg",
+      gif: "image/gif",
+      webp: "image/webp",
+      bmp: "image/bmp",
+      svg: "image/svg+xml",
+      tiff: "image/tiff",
+      tif: "image/tiff",
 
       // Documents
-      'pdf': 'application/pdf',
-      'txt': 'text/plain',
-      'html': 'text/html',
-      'css': 'text/css',
-      'js': 'application/javascript',
-      'json': 'application/json',
-      'xml': 'application/xml',
+      pdf: "application/pdf",
+      txt: "text/plain",
+      html: "text/html",
+      css: "text/css",
+      js: "application/javascript",
+      json: "application/json",
+      xml: "application/xml",
 
       // Office documents
-      'doc': 'application/msword',
-      'docx': 'application/vnd.openxmlformats-officedocument.wordprocessingml.document',
-      'xls': 'application/vnd.ms-excel',
-      'xlsx': 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet',
+      doc: "application/msword",
+      docx: "application/vnd.openxmlformats-officedocument.wordprocessingml.document",
+      xls: "application/vnd.ms-excel",
+      xlsx: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet",
 
       // Archives
-      'zip': 'application/zip',
-      'rar': 'application/x-rar-compressed',
+      zip: "application/zip",
+      rar: "application/x-rar-compressed",
     };
 
-    return mimeTypes[ext || ''] || 'application/octet-stream';
+    return mimeTypes[ext || ""] || "application/octet-stream";
   }
 
   /**
@@ -609,26 +658,35 @@ export class ZipFileService {
    */
   async extractAndStoreFilesWithHistory(
     zipFile: File,
-    zipStub: StirlingFileStub
-  ): Promise<{ success: boolean; extractedStubs: StirlingFileStub[]; errors: string[] }> {
+    zipStub: StirlingFileStub,
+  ): Promise<{
+    success: boolean;
+    extractedStubs: StirlingFileStub[];
+    errors: string[];
+  }> {
     const result = {
       success: false,
       extractedStubs: [] as StirlingFileStub[],
-      errors: [] as string[]
+      errors: [] as string[],
     };
 
     try {
       // Check if ZIP contains HTML files - if so, don't extract
       const hasHtml = await this.containsHtmlFiles(zipFile);
       if (hasHtml) {
-        result.errors.push('ZIP contains HTML files and will not be auto-extracted. Download the ZIP to access the files.');
+        result.errors.push(
+          "ZIP contains HTML files and will not be auto-extracted. Download the ZIP to access the files.",
+        );
         return result;
       }
 
       // Extract all files from ZIP (not just PDFs)
       const extractionResult = await this.extractAllFiles(zipFile);
 
-      if (!extractionResult.success || extractionResult.extractedFiles.length === 0) {
+      if (
+        !extractionResult.success ||
+        extractionResult.extractedFiles.length === 0
+      ) {
         result.errors = extractionResult.errors;
         return result;
       }
@@ -657,7 +715,7 @@ export class ZipFileService {
             parentFileId: zipStub.parentFileId,
             versionNumber: zipStub.versionNumber,
             toolHistory: zipStub.toolHistory || [],
-            thumbnailUrl: thumbnail
+            thumbnailUrl: thumbnail,
           };
 
           // Store in IndexedDB
@@ -665,15 +723,19 @@ export class ZipFileService {
 
           result.extractedStubs.push(stub);
         } catch (error) {
-          const errorMessage = error instanceof Error ? error.message : 'Unknown error';
-          result.errors.push(`Failed to process "${extractedFile.name}": ${errorMessage}`);
+          const errorMessage =
+            error instanceof Error ? error.message : "Unknown error";
+          result.errors.push(
+            `Failed to process "${extractedFile.name}": ${errorMessage}`,
+          );
         }
       }
 
       result.success = result.extractedStubs.length > 0;
       return result;
     } catch (error) {
-      const errorMessage = error instanceof Error ? error.message : 'Unknown error';
+      const errorMessage =
+        error instanceof Error ? error.message : "Unknown error";
       result.errors.push(`Failed to extract ZIP file: ${errorMessage}`);
       return result;
     }
diff --git a/frontend/src/core/setupTests.js b/frontend/src/core/setupTests.js
index 8f2609b7b3..1dd407a63e 100644
--- a/frontend/src/core/setupTests.js
+++ b/frontend/src/core/setupTests.js
@@ -2,4 +2,4 @@
 // allows you to do things like:
 // expect(element).toHaveTextContent(/react/i)
 // learn more: https://github.com/testing-library/jest-dom
-import '@testing-library/jest-dom';
+import "@testing-library/jest-dom";
diff --git a/frontend/src/core/setupTests.ts b/frontend/src/core/setupTests.ts
index 0e5e9737a2..d49589a035 100644
--- a/frontend/src/core/setupTests.ts
+++ b/frontend/src/core/setupTests.ts
@@ -1,5 +1,5 @@
-import '@testing-library/jest-dom';
-import { vi } from 'vitest';
+import "@testing-library/jest-dom";
+import { vi } from "vitest";
 
 // Mock localStorage for tests
 class LocalStorageMock implements Storage {
@@ -30,13 +30,13 @@ class LocalStorageMock implements Storage {
   }
 }
 
-Object.defineProperty(window, 'localStorage', {
+Object.defineProperty(window, "localStorage", {
   value: new LocalStorageMock(),
   writable: true,
 });
 
 // Mock i18next for tests
-vi.mock('react-i18next', () => ({
+vi.mock("react-i18next", () => ({
   useTranslation: () => ({
     t: (key: string) => key,
     i18n: {
@@ -44,16 +44,16 @@ vi.mock('react-i18next', () => ({
     },
   }),
   initReactI18next: {
-    type: '3rdParty',
+    type: "3rdParty",
     init: vi.fn(),
   },
   I18nextProvider: ({ children }: { children: React.ReactNode }) => children,
 }));
 
 // Mock i18next-http-backend
-vi.mock('i18next-http-backend', () => ({
+vi.mock("i18next-http-backend", () => ({
   default: {
-    type: 'backend',
+    type: "backend",
     init: vi.fn(),
     read: vi.fn(),
     save: vi.fn(),
@@ -61,12 +61,12 @@ vi.mock('i18next-http-backend', () => ({
 }));
 
 // Mock window.URL.createObjectURL and revokeObjectURL for tests
-global.URL.createObjectURL = vi.fn(() => 'mocked-url');
+global.URL.createObjectURL = vi.fn(() => "mocked-url");
 global.URL.revokeObjectURL = vi.fn();
 
 // Mock File and Blob API methods that aren't available in jsdom
 if (!globalThis.File.prototype.arrayBuffer) {
-  globalThis.File.prototype.arrayBuffer = function() {
+  globalThis.File.prototype.arrayBuffer = function () {
     // Return a simple ArrayBuffer with some mock data
     const buffer = new ArrayBuffer(8);
     const view = new Uint8Array(buffer);
@@ -76,7 +76,7 @@ if (!globalThis.File.prototype.arrayBuffer) {
 }
 
 if (!globalThis.Blob.prototype.arrayBuffer) {
-  globalThis.Blob.prototype.arrayBuffer = function() {
+  globalThis.Blob.prototype.arrayBuffer = function () {
     // Return a simple ArrayBuffer with some mock data
     const buffer = new ArrayBuffer(8);
     const view = new Uint8Array(buffer);
@@ -94,13 +94,15 @@ for (let i = 0; i < 32; i++) {
 }
 
 // Force override crypto.subtle to avoid Node.js native implementation
-Object.defineProperty(globalThis, 'crypto', {
+Object.defineProperty(globalThis, "crypto", {
   value: {
     subtle: {
-      digest: vi.fn().mockImplementation(async (_algorithm: string, _data: any) => {
-        // Always return the mock hash buffer regardless of input
-        return mockHashBuffer.slice();
-      }),
+      digest: vi
+        .fn()
+        .mockImplementation(async (_algorithm: string, _data: any) => {
+          // Always return the mock hash buffer regardless of input
+          return mockHashBuffer.slice();
+        }),
     },
     getRandomValues: vi.fn().mockImplementation((array: any) => {
       // Mock getRandomValues if needed
@@ -139,9 +141,9 @@ global.IntersectionObserver = vi.fn().mockImplementation(() => ({
 }));
 
 // Mock matchMedia for responsive components
-Object.defineProperty(window, 'matchMedia', {
+Object.defineProperty(window, "matchMedia", {
   writable: true,
-  value: vi.fn().mockImplementation(query => ({
+  value: vi.fn().mockImplementation((query) => ({
     matches: false,
     media: query,
     onchange: null,
@@ -154,7 +156,7 @@ Object.defineProperty(window, 'matchMedia', {
 });
 
 // Provide a minimal DOMMatrix implementation for pdf.js in the test environment
-if (typeof globalThis.DOMMatrix === 'undefined') {
+if (typeof globalThis.DOMMatrix === "undefined") {
   class DOMMatrixStub {
     a = 1;
     b = 0;
@@ -165,7 +167,14 @@ if (typeof globalThis.DOMMatrix === 'undefined') {
 
     constructor(init?: string | number[]) {
       if (Array.isArray(init) && init.length === 6) {
-        [this.a, this.b, this.c, this.d, this.e, this.f] = init as [number, number, number, number, number, number];
+        [this.a, this.b, this.c, this.d, this.e, this.f] = init as [
+          number,
+          number,
+          number,
+          number,
+          number,
+          number,
+        ];
       }
     }
 
@@ -190,7 +199,7 @@ if (typeof globalThis.DOMMatrix === 'undefined') {
     }
   }
 
-  Object.defineProperty(globalThis, 'DOMMatrix', {
+  Object.defineProperty(globalThis, "DOMMatrix", {
     value: DOMMatrixStub,
     writable: false,
     configurable: true,
diff --git a/frontend/src/core/styles/cookieconsent.css b/frontend/src/core/styles/cookieconsent.css
index 331632b139..0f51c768cb 100644
--- a/frontend/src/core/styles/cookieconsent.css
+++ b/frontend/src/core/styles/cookieconsent.css
@@ -56,4 +56,4 @@
 /* Override any potential conflicts */
 [data-mantine-color-scheme="dark"] #cc-main {
   color: #ffffff !important;
-}
\ No newline at end of file
+}
diff --git a/frontend/src/core/styles/index.css b/frontend/src/core/styles/index.css
index 21298512e2..3f2c6edc10 100644
--- a/frontend/src/core/styles/index.css
+++ b/frontend/src/core/styles/index.css
@@ -1,4 +1,5 @@
-html, body {
+html,
+body {
   margin: 0;
   padding: 0;
   height: 100%;
@@ -6,28 +7,28 @@ html, body {
 }
 
 body {
-  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
-    'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
-    sans-serif;
+  font-family:
+    -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu",
+    "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
 }
 
 code {
-  font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
-    monospace;
+  font-family:
+    source-code-pro, Menlo, Monaco, Consolas, "Courier New", monospace;
 }
 
 /* Suppress font visibility warnings for PDF.js embedded fonts */
 @font-face {
-  font-family: 'Adwaita Mono';
-  src: local('Adwaita Mono');
+  font-family: "Adwaita Mono";
+  src: local("Adwaita Mono");
   font-display: optional;
 }
 
 @font-face {
-  font-family: 'Nimbus Mono PS';
-  src: local('Nimbus Mono PS');
+  font-family: "Nimbus Mono PS";
+  src: local("Nimbus Mono PS");
   font-display: optional;
 }
 
diff --git a/frontend/src/core/styles/rainbow.module.css b/frontend/src/core/styles/rainbow.module.css
index d56578a144..04ebde1990 100644
--- a/frontend/src/core/styles/rainbow.module.css
+++ b/frontend/src/core/styles/rainbow.module.css
@@ -1,42 +1,110 @@
 /* Rainbow Mode Styles - Easter Egg! */
 @keyframes rainbowBackground {
-  0% { background-position: 0% 50%; }
-  50% { background-position: 100% 50%; }
-  100% { background-position: 0% 50%; }
+  0% {
+    background-position: 0% 50%;
+  }
+  50% {
+    background-position: 100% 50%;
+  }
+  100% {
+    background-position: 0% 50%;
+  }
 }
 
 @keyframes rainbowBorder {
-  0% { border-color: #ff0000; box-shadow: 0 0 15px #ff0000; }
-  14% { border-color: #ff8800; box-shadow: 0 0 15px #ff8800; }
-  28% { border-color: #ffff00; box-shadow: 0 0 15px #ffff00; }
-  42% { border-color: #88ff00; box-shadow: 0 0 15px #88ff00; }
-  57% { border-color: #00ff88; box-shadow: 0 0 15px #00ff88; }
-  71% { border-color: #0088ff; box-shadow: 0 0 15px #0088ff; }
-  85% { border-color: #8800ff; box-shadow: 0 0 15px #8800ff; }
-  100% { border-color: #ff0000; box-shadow: 0 0 15px #ff0000; }
+  0% {
+    border-color: #ff0000;
+    box-shadow: 0 0 15px #ff0000;
+  }
+  14% {
+    border-color: #ff8800;
+    box-shadow: 0 0 15px #ff8800;
+  }
+  28% {
+    border-color: #ffff00;
+    box-shadow: 0 0 15px #ffff00;
+  }
+  42% {
+    border-color: #88ff00;
+    box-shadow: 0 0 15px #88ff00;
+  }
+  57% {
+    border-color: #00ff88;
+    box-shadow: 0 0 15px #00ff88;
+  }
+  71% {
+    border-color: #0088ff;
+    box-shadow: 0 0 15px #0088ff;
+  }
+  85% {
+    border-color: #8800ff;
+    box-shadow: 0 0 15px #8800ff;
+  }
+  100% {
+    border-color: #ff0000;
+    box-shadow: 0 0 15px #ff0000;
+  }
 }
 
 @keyframes rainbowText {
-  0% { color: #ff0000; text-shadow: 0 0 10px #ff0000; }
-  14% { color: #ff8800; text-shadow: 0 0 10px #ff8800; }
-  28% { color: #ffff00; text-shadow: 0 0 10px #ffff00; }
-  42% { color: #88ff00; text-shadow: 0 0 10px #88ff00; }
-  57% { color: #00ff88; text-shadow: 0 0 10px #00ff88; }
-  71% { color: #0088ff; text-shadow: 0 0 10px #0088ff; }
-  85% { color: #8800ff; text-shadow: 0 0 10px #8800ff; }
-  100% { color: #ff0000; text-shadow: 0 0 10px #ff0000; }
+  0% {
+    color: #ff0000;
+    text-shadow: 0 0 10px #ff0000;
+  }
+  14% {
+    color: #ff8800;
+    text-shadow: 0 0 10px #ff8800;
+  }
+  28% {
+    color: #ffff00;
+    text-shadow: 0 0 10px #ffff00;
+  }
+  42% {
+    color: #88ff00;
+    text-shadow: 0 0 10px #88ff00;
+  }
+  57% {
+    color: #00ff88;
+    text-shadow: 0 0 10px #00ff88;
+  }
+  71% {
+    color: #0088ff;
+    text-shadow: 0 0 10px #0088ff;
+  }
+  85% {
+    color: #8800ff;
+    text-shadow: 0 0 10px #8800ff;
+  }
+  100% {
+    color: #ff0000;
+    text-shadow: 0 0 10px #ff0000;
+  }
 }
 
 @keyframes rainbowPulse {
-  0%, 100% { transform: scale(1); }
-  50% { transform: scale(1.05); }
+  0%,
+  100% {
+    transform: scale(1);
+  }
+  50% {
+    transform: scale(1.05);
+  }
 }
 
 /* Main rainbow theme class */
 .rainbowMode {
   background: linear-gradient(
     -45deg,
-    #ff0000, #ff8800, #ffff00, #88ff00, #00ff88, #00ffff, #0088ff, #8800ff, #ff0088, #ff0000
+    #ff0000,
+    #ff8800,
+    #ffff00,
+    #88ff00,
+    #00ff88,
+    #00ffff,
+    #0088ff,
+    #8800ff,
+    #ff0088,
+    #ff0000
   ) !important;
   background-size: 400% 400% !important;
   animation: rainbowBackground 3s ease infinite !important;
@@ -48,10 +116,20 @@
 .rainbowCard {
   background: linear-gradient(
     45deg,
-    #ff0000, #ff8800, #ffff00, #88ff00, #00ff88, #00ffff, #0088ff, #8800ff, #ff0088
+    #ff0000,
+    #ff8800,
+    #ffff00,
+    #88ff00,
+    #00ff88,
+    #00ffff,
+    #0088ff,
+    #8800ff,
+    #ff0088
   ) !important;
   background-size: 400% 400% !important;
-  animation: rainbowBackground 4s ease infinite, rainbowBorder 2s linear infinite !important;
+  animation:
+    rainbowBackground 4s ease infinite,
+    rainbowBorder 2s linear infinite !important;
   color: white !important;
   border: 2px solid !important;
   border-radius: 15px !important;
@@ -61,10 +139,20 @@
 .rainbowButton {
   background: linear-gradient(
     45deg,
-    #ff0000, #ff8800, #ffff00, #88ff00, #00ff88, #00ffff, #0088ff, #8800ff, #ff0088
+    #ff0000,
+    #ff8800,
+    #ffff00,
+    #88ff00,
+    #00ff88,
+    #00ffff,
+    #0088ff,
+    #8800ff,
+    #ff0088
   ) !important;
   background-size: 300% 300% !important;
-  animation: rainbowBackground 2s ease infinite, rainbowBorder 1s linear infinite !important;
+  animation:
+    rainbowBackground 2s ease infinite,
+    rainbowBorder 1s linear infinite !important;
   border: 2px solid !important;
   color: white !important;
   border-radius: 8px !important;
@@ -74,17 +162,30 @@
 
 .rainbowButton:hover {
   transform: scale(1.05) !important;
-  animation: rainbowBackground 1s ease infinite, rainbowBorder 0.5s linear infinite, rainbowPulse 0.5s ease infinite !important;
+  animation:
+    rainbowBackground 1s ease infinite,
+    rainbowBorder 0.5s linear infinite,
+    rainbowPulse 0.5s ease infinite !important;
   box-shadow: 0 0 25px rgba(255, 255, 255, 0.6) !important;
 }
 
 .rainbowInput {
   background: linear-gradient(
     90deg,
-    #ff0000, #ff8800, #ffff00, #88ff00, #00ff88, #00ffff, #0088ff, #8800ff, #ff0088
+    #ff0000,
+    #ff8800,
+    #ffff00,
+    #88ff00,
+    #00ff88,
+    #00ffff,
+    #0088ff,
+    #8800ff,
+    #ff0088
   ) !important;
   background-size: 300% 300% !important;
-  animation: rainbowBackground 2.5s ease infinite, rainbowBorder 1.5s linear infinite !important;
+  animation:
+    rainbowBackground 2.5s ease infinite,
+    rainbowBorder 1.5s linear infinite !important;
   border: 2px solid !important;
   color: white !important;
   border-radius: 8px !important;
@@ -103,10 +204,20 @@
 .rainbowSegmentedControl {
   background: linear-gradient(
     45deg,
-    #ff0000, #ff8800, #ffff00, #88ff00, #00ff88, #00ffff, #0088ff, #8800ff, #ff0088
+    #ff0000,
+    #ff8800,
+    #ffff00,
+    #88ff00,
+    #00ff88,
+    #00ffff,
+    #0088ff,
+    #8800ff,
+    #ff0088
   ) !important;
   background-size: 400% 400% !important;
-  animation: rainbowBackground 3s ease infinite, rainbowBorder 2s linear infinite !important;
+  animation:
+    rainbowBackground 3s ease infinite,
+    rainbowBorder 2s linear infinite !important;
   border: 2px solid !important;
   border-radius: 12px !important;
   padding: 4px !important;
@@ -115,10 +226,15 @@
 .rainbowPaper {
   background: linear-gradient(
     90deg,
-  #00ffff, #0088ff, #8800ff, #ff0088
+    #00ffff,
+    #0088ff,
+    #8800ff,
+    #ff0088
   ) !important;
   background-size: 100% 100% !important;
-  animation: rainbowBackground 3.5s ease infinite, rainbowBorder 2s linear infinite !important;
+  animation:
+    rainbowBackground 3.5s ease infinite,
+    rainbowBorder 2s linear infinite !important;
   border: 2px solid !important;
   color: white !important;
   border-radius: 12px !important;
@@ -129,9 +245,17 @@
   position: fixed !important;
   top: 20px !important;
   right: 20px !important;
-  background: linear-gradient(45deg,#ffff00, #88ff00, #00ff88, #00ffff) !important;
+  background: linear-gradient(
+    45deg,
+    #ffff00,
+    #88ff00,
+    #00ff88,
+    #00ffff
+  ) !important;
   background-size: 300% 300% !important;
-  animation: rainbowBackground 1s ease infinite, rainbowBorder 0.5s linear infinite !important;
+  animation:
+    rainbowBackground 1s ease infinite,
+    rainbowBorder 0.5s linear infinite !important;
   color: white !important;
   padding: 15px 20px !important;
   border-radius: 25px !important;
@@ -148,7 +272,16 @@
 .rainbowMode [data-mantine-color-scheme] {
   background: linear-gradient(
     -45deg,
-    #ff0000, #ff8800, #ffff00, #88ff00, #00ff88, #00ffff, #0088ff, #8800ff, #ff0088, #ff0000
+    #ff0000,
+    #ff8800,
+    #ffff00,
+    #88ff00,
+    #00ff88,
+    #00ffff,
+    #0088ff,
+    #8800ff,
+    #ff0088,
+    #ff0000
   ) !important;
   background-size: 400% 400% !important;
   animation: rainbowBackground 3s ease infinite !important;
@@ -158,12 +291,17 @@
 .rainbowMode button {
   background: linear-gradient(
     45deg,
-     #ffff00, #88ff00, #00ff88, #00ffff
+    #ffff00,
+    #88ff00,
+    #00ff88,
+    #00ffff
   ) !important;
   background-size: 100% 100% !important;
   animation: rainbowBackground 2s ease infinite !important;
   border: 2px solid !important;
-  animation: rainbowBackground 2s ease infinite, rainbowBorder 1.5s linear infinite !important;
+  animation:
+    rainbowBackground 2s ease infinite,
+    rainbowBorder 1.5s linear infinite !important;
   color: white !important;
   font-weight: bold !important;
 }
@@ -174,12 +312,17 @@
 .rainbowMode textarea {
   background: linear-gradient(
     90deg,
-    #ffff00, #88ff00, #00ff88, #00ffff
+    #ffff00,
+    #88ff00,
+    #00ff88,
+    #00ffff
   ) !important;
   background-size: 100% 100% !important;
   animation: rainbowBackground 2.5s ease infinite !important;
   border: 2px solid !important;
-  animation: rainbowBackground 2.5s ease infinite, rainbowBorder 1.5s linear infinite !important;
+  animation:
+    rainbowBackground 2.5s ease infinite,
+    rainbowBorder 1.5s linear infinite !important;
   color: white !important;
 }
 
diff --git a/frontend/src/core/styles/tailwind.css b/frontend/src/core/styles/tailwind.css
index 1408a13968..cfcbf09070 100644
--- a/frontend/src/core/styles/tailwind.css
+++ b/frontend/src/core/styles/tailwind.css
@@ -1,6 +1,5 @@
-
 /* Import minimal theme variables */
-@import './theme.css';
+@import "./theme.css";
 
 @layer base {
   @tailwind base;
diff --git a/frontend/src/core/styles/theme.css b/frontend/src/core/styles/theme.css
index ec63c0a572..46809c07a3 100644
--- a/frontend/src/core/styles/theme.css
+++ b/frontend/src/core/styles/theme.css
@@ -1,7 +1,7 @@
 :root {
   /* Compare highlight colors (same in light/dark) */
   --spdf-compare-removed-bg: rgba(255, 107, 107, 0.45); /* #ff6b6b @ 0.45 */
-  --spdf-compare-added-bg: rgba(81, 207, 102, 0.35);  /* #51cf66 @ 0.35 */
+  --spdf-compare-added-bg: rgba(81, 207, 102, 0.35); /* #51cf66 @ 0.35 */
 
   /* Badge colors for dropdowns */
   --spdf-compare-removed-badge-bg: rgba(255, 59, 48, 0.15);
@@ -14,10 +14,25 @@
   --spdf-compare-inline-added-bg: rgba(52, 199, 89, 0.25);
 
   /* File Manager active file colors */
-  --file-active-bg: rgba(59, 130, 246, 0.1); /* Transparent blue for active file background */
-  --file-active-badge-bg: rgba(34, 197, 94, 0.15); /* Transparent green for active badge */
+  --file-active-bg: rgba(
+    59,
+    130,
+    246,
+    0.1
+  ); /* Transparent blue for active file background */
+  --file-active-badge-bg: rgba(
+    34,
+    197,
+    94,
+    0.15
+  ); /* Transparent green for active badge */
   --file-active-badge-fg: #15803d; /* Green text for active badge */
-  --file-active-badge-border: rgba(34, 197, 94, 0.3); /* Green border for active badge */
+  --file-active-badge-border: rgba(
+    34,
+    197,
+    94,
+    0.3
+  ); /* Green border for active badge */
 }
 
 /* CSS variables for Tailwind + Mantine integration */
@@ -83,20 +98,20 @@
   --color-yellow-400: #facc15;
 
   /* Category colors - consistent across light and dark modes */
-  --category-color-removal: #ef4444;        /* Red for removal tools */
-  --category-color-security: #f59e0b;       /* Orange for security tools */
-  --category-color-formatting: #8b5cf6;     /* Purple for formatting tools */
-  --category-color-extraction: #06b6d4;      /* Cyan for extraction tools */
-  --category-color-signing: #10b981;        /* Green for signing tools */
-  --category-color-general: #3b82f6;        /* Blue for general tools */
-  --category-color-verification: #f97316;    /* Orange for verification tools */
-  --category-color-automation: #ec4899;     /* Pink for automation tools */
-  --category-color-developer: #6b7280;      /* Gray for developer tools */
-  --category-color-default: #6b7280;        /* Default gray */
+  --category-color-removal: #ef4444; /* Red for removal tools */
+  --category-color-security: #f59e0b; /* Orange for security tools */
+  --category-color-formatting: #8b5cf6; /* Purple for formatting tools */
+  --category-color-extraction: #06b6d4; /* Cyan for extraction tools */
+  --category-color-signing: #10b981; /* Green for signing tools */
+  --category-color-general: #3b82f6; /* Blue for general tools */
+  --category-color-verification: #f97316; /* Orange for verification tools */
+  --category-color-automation: #ec4899; /* Pink for automation tools */
+  --category-color-developer: #6b7280; /* Gray for developer tools */
+  --category-color-default: #6b7280; /* Default gray */
 
   /* Special section colors - consistent across light and dark modes */
-  --special-color-favorites: #FFC107;      /* Yellow/gold for favorites */
-  --special-color-recommended: #1BB1D4;    /* Cyan for recommended */
+  --special-color-favorites: #ffc107; /* Yellow/gold for favorites */
+  --special-color-recommended: #1bb1d4; /* Cyan for recommended */
   --color-yellow-500: #eab308;
   --color-yellow-600: #ca8a04;
   --color-yellow-700: #a16207;
@@ -158,9 +173,9 @@
   --bg-muted: #f3f4f6;
   --bg-background: #f9fafb;
   --bg-toolbar: #ffffff;
-  --bg-file-manager: #F5F6F8;
+  --bg-file-manager: #f5f6f8;
   --bg-file-list: #ffffff;
-  --btn-open-file: #0A8BFF;
+  --btn-open-file: #0a8bff;
   --text-primary: #111827;
   --text-secondary: #4b5563;
   --text-muted: #6b7280;
@@ -168,111 +183,147 @@
   --text-always-dark: #1f2937;
   --text-always-dark-muted: #6b7280;
   --border-subtle: #e5e7eb;
-  --border-default: #E2E8F0;
+  --border-default: #e2e8f0;
   --border-strong: #9ca3af;
   --hover-bg: #f9fafb;
   --active-bg: #f3f4f6;
   --automation-entry-hover-bg: var(--color-gray-100);
 
   /* Icon colors for light mode */
-  --icon-user-bg: #9CA3AF;
-  --icon-user-color: #FFFFFF;
-  --icon-notifications-bg: #9CA3AF;
-  --icon-notifications-color: #FFFFFF;
-  --icon-tools-bg: #1E88E5;
-  --icon-tools-color: #FFFFFF;
-  --icon-read-bg: #4CAF50;
-  --icon-read-color: #FFFFFF;
-  --icon-sign-bg: #3BA99C;
-  --icon-sign-color: #FFFFFF;
-  --icon-automate-bg: #A576E3;
-  --icon-automate-color: #FFFFFF;
-  --icon-files-bg: #D3E7F7;
-  --icon-files-color: #0A8BFF;
-  --icon-activity-bg: #D3E7F7;
-  --icon-activity-color: #0A8BFF;
-  --icon-config-bg: #9CA3AF;
-  --icon-config-color: #FFFFFF;
+  --icon-user-bg: #9ca3af;
+  --icon-user-color: #ffffff;
+  --icon-notifications-bg: #9ca3af;
+  --icon-notifications-color: #ffffff;
+  --icon-tools-bg: #1e88e5;
+  --icon-tools-color: #ffffff;
+  --icon-read-bg: #4caf50;
+  --icon-read-color: #ffffff;
+  --icon-sign-bg: #3ba99c;
+  --icon-sign-color: #ffffff;
+  --icon-automate-bg: #a576e3;
+  --icon-automate-color: #ffffff;
+  --icon-files-bg: #d3e7f7;
+  --icon-files-color: #0a8bff;
+  --icon-activity-bg: #d3e7f7;
+  --icon-activity-color: #0a8bff;
+  --icon-config-bg: #9ca3af;
+  --icon-config-color: #ffffff;
 
   /* RightRail (light) */
-  --right-rail-bg: #F5F6F8;           /* light background */
-  --right-rail-foreground: #E3E4E5;   /* panel behind custom tool icons */
-  --right-rail-icon: #4B5563;         /* icon color */
-  --right-rail-icon-disabled: #CECECE;/* disabled icon */
-  --right-rail-pan-active-bg: #EAEAEA;
+  --right-rail-bg: #f5f6f8; /* light background */
+  --right-rail-foreground: #e3e4e5; /* panel behind custom tool icons */
+  --right-rail-icon: #4b5563; /* icon color */
+  --right-rail-icon-disabled: #cecece; /* disabled icon */
+  --right-rail-pan-active-bg: #eaeaea;
 
   /* Colors for tooltips */
-  --tooltip-title-bg: #DBEFFF;
-  --tooltip-title-color: #31528E;
-  --tooltip-header-bg: #31528E;
+  --tooltip-title-bg: #dbefff;
+  --tooltip-title-color: #31528e;
+  --tooltip-header-bg: #31528e;
   --tooltip-header-color: white;
   --tooltip-border: var(--border-default);
 
   /* Inactive icon colors for light mode */
-  --icon-inactive-bg: #9CA3AF;
-  --icon-inactive-color: #FFFFFF;
+  --icon-inactive-bg: #9ca3af;
+  --icon-inactive-color: #ffffff;
 
   /* New theme colors for text and icons */
   --tools-text-and-icon-color: #374151;
 
   /* Tool picker sticky header variables (light mode) */
-  --tool-header-bg: #DBEFFF;
-  --tool-header-border: #BEE2FF;
-  --tool-header-text: #1E88E5;
-  --tool-header-badge-bg: #C0DDFF;
-  --tool-header-badge-text: #004E99;
+  --tool-header-bg: #dbefff;
+  --tool-header-border: #bee2ff;
+  --tool-header-text: #1e88e5;
+  --tool-header-badge-bg: #c0ddff;
+  --tool-header-badge-text: #004e99;
 
   /* Subcategory title styling (light mode) */
-  --tool-subcategory-text-color: #9CA3AF; /* lighter text */
-  --tool-subcategory-rule-color: #E5E7EB; /* doubly lighter rule line */
-  --accent-interactive: #4A90E2;
-  --text-instruction: #4A90E2;
+  --tool-subcategory-text-color: #9ca3af; /* lighter text */
+  --tool-subcategory-rule-color: #e5e7eb; /* doubly lighter rule line */
+  --accent-interactive: #4a90e2;
+  --text-instruction: #4a90e2;
   --text-brand: var(--color-gray-700);
-  --text-brand-accent: #DC2626;
-
+  --text-brand-accent: #dc2626;
 
   /* PDF text selection colors */
   --pdf-selection-bg: rgba(59, 130, 246, 0.2);
   --pdf-selection-ring: rgba(59, 130, 246, 0.18);
 
   /* Placeholder text colors */
-  --search-text-and-icon-color: #6B7382;
+  --search-text-and-icon-color: #6b7382;
 
   /* Tool panel search bar background colors */
-  --tool-panel-search-bg: #EFF1F4;
-  --tool-panel-search-border-bottom: #EFF1F4;
+  --tool-panel-search-bg: #eff1f4;
+  --tool-panel-search-border-bottom: #eff1f4;
 
   /* container */
   --landing-paper-bg: var(--bg-surface);
-  --landing-inner-paper-bg: #EEF8FF;
-  --landing-inner-paper-border: #CDEAFF;
+  --landing-inner-paper-bg: #eef8ff;
+  --landing-inner-paper-border: #cdeaff;
   --landing-button-bg: var(--bg-surface);
   --landing-button-color: var(--icon-tools-bg);
-  --landing-button-border: #E0F2F7;
+  --landing-button-border: #e0f2f7;
   --landing-button-hover-bg: rgb(251, 251, 251);
 
   /* drop state */
-  --landing-drop-paper-bg: #E3F2FD;
-  --landing-drop-inner-paper-bg: #BBDEFB;
-  --landing-drop-inner-paper-border: #90CAF9;
+  --landing-drop-paper-bg: #e3f2fd;
+  --landing-drop-inner-paper-bg: #bbdefb;
+  --landing-drop-inner-paper-border: #90caf9;
+
+  /* landing hero & stack */
+  --landing-hero-gradient: linear-gradient(135deg, #4c8bf5 0%, #3a7be8 100%);
+  --landing-stack-w: 224px;
+  --landing-stack-h: 176px;
+  --landing-stack-glow-bg: radial-gradient(
+    circle,
+    rgba(74, 144, 226, 0.18) 0%,
+    transparent 70%
+  );
+
+  /* landing doc stack shadows */
+  --landing-doc-shadow-back-idle:
+    0 4px 20px rgba(0, 0, 0, 0.08), 0 1px 3px rgba(0, 0, 0, 0.04);
+  --landing-doc-shadow-back-hover:
+    0 12px 40px rgba(0, 0, 0, 0.15), 0 4px 12px rgba(0, 0, 0, 0.08);
+  --landing-doc-shadow-front-idle:
+    0 8px 30px rgba(0, 0, 0, 0.12), 0 4px 12px rgba(0, 0, 0, 0.06),
+    0 0 0 1px rgba(0, 0, 0, 0.02);
+  --landing-doc-shadow-front-hover:
+    0 18px 48px rgba(0, 0, 0, 0.18), 0 8px 20px rgba(0, 0, 0, 0.1),
+    0 0 0 1px rgba(0, 0, 0, 0.04);
+
+  /* landing action button shadows */
+  --landing-action-transition:
+    transform 0.28s cubic-bezier(0.4, 0, 0.2, 1),
+    box-shadow 0.32s cubic-bezier(0.4, 0, 0.2, 1);
+  --landing-action-shadow-idle:
+    0 6px 18px rgba(0, 0, 0, 0), 0 2px 6px rgba(0, 0, 0, 0);
+  --landing-action-shadow-hover:
+    0 6px 18px rgba(0, 0, 0, 0.14), 0 2px 6px rgba(0, 0, 0, 0.08);
+  --landing-action-primary-shadow-idle:
+    0 10px 26px rgba(58, 123, 232, 0), 0 4px 12px rgba(0, 0, 0, 0);
+  --landing-action-primary-shadow-hover:
+    0 10px 26px rgba(58, 123, 232, 0.42), 0 4px 12px rgba(0, 0, 0, 0.1);
 
   /* selected file header colors */
-  --header-selected-bg: #1E88E5; /* light mode selected header matches dark */
-  --header-selected-fg: #FFFFFF;
-  --file-card-bg: #FFFFFF;  /* file card background (light/dark paired) */
-  --accordion-item-bg: #E8EAED;  /* accordion item background - more distinguishable */
+  --header-selected-bg: #1e88e5; /* light mode selected header matches dark */
+  --header-selected-fg: #ffffff;
+  --file-card-bg: #ffffff; /* file card background (light/dark paired) */
+  --accordion-item-bg: #e8eaed; /* accordion item background - more distinguishable */
 
   /* shadows */
   --drop-shadow-color: rgba(0, 0, 0, 0.08);
   --drop-shadow-color-strong: rgba(0, 0, 0, 0.04);
-  --drop-shadow-filter: drop-shadow(0 0.2rem 0.4rem rgba(0, 0, 0, 0.08)) drop-shadow(0 0.6rem 0.6rem rgba(0, 0, 0, 0.06)) drop-shadow(0 1.2rem 1rem rgba(0, 0, 0, 0.04));
+  --drop-shadow-filter: drop-shadow(0 0.2rem 0.4rem rgba(0, 0, 0, 0.08))
+    drop-shadow(0 0.6rem 0.6rem rgba(0, 0, 0, 0.06))
+    drop-shadow(0 1.2rem 1rem rgba(0, 0, 0, 0.04));
 
   /* Light mode card hover and selection */
-  --header-hover-bg: #3B4B6E; /* same family as selected, a touch muted for hover */
-  --card-selected-border: #3FAFFF; /* slightly more blue than dark mode header */
-  --checkbox-border: #2F83BF;
-  --checkbox-checked-bg: #3FAFFF;
-  --checkbox-tick: #FFFFFF;
+  --header-hover-bg: #3b4b6e; /* same family as selected, a touch muted for hover */
+  --card-selected-border: #3fafff; /* slightly more blue than dark mode header */
+  --checkbox-border: #2f83bf;
+  --checkbox-checked-bg: #3fafff;
+  --checkbox-tick: #ffffff;
 
   --information-text-bg: #eaeaea;
   --information-text-color: #5e5e5e;
@@ -282,13 +333,13 @@
   --bulk-card-border: #e5e7eb; /* light gray border for cards and buttons */
   --bulk-card-hover-border: #d1d5db; /* slightly darker on hover */
   --unsupported-bar-bg: #5a616e;
-  --unsupported-bar-border: #6B7280;
+  --unsupported-bar-border: #6b7280;
 
   /* Config Modal colors (light mode) */
-  --modal-nav-bg: #F5F6F8;
-  --modal-nav-section-title: #6B7280;
+  --modal-nav-bg: #f5f6f8;
+  --modal-nav-section-title: #6b7280;
   --modal-nav-item: #374151;
-  --modal-nav-item-active: #0A8BFF;
+  --modal-nav-item-active: #0a8bff;
   --modal-nav-item-active-bg: rgba(10, 139, 255, 0.08);
   --modal-content-bg: #ffffff;
   --modal-header-border: rgba(0, 0, 0, 0.06);
@@ -326,10 +377,10 @@
   --pdf-light-simulated-page-text: 15 23 42;
 
   /* Code token colors (light mode) */
-  --code-kw-color: #1d4ed8;   /* blue-700 */
-  --code-str-color: #16a34a;  /* green-600 */
-  --code-num-color: #4338ca;  /* indigo-700 */
-  --code-com-color: #6b7280;  /* gray-500 */
+  --code-kw-color: #1d4ed8; /* blue-700 */
+  --code-str-color: #16a34a; /* green-600 */
+  --code-num-color: #4338ca; /* indigo-700 */
+  --code-com-color: #6b7280; /* gray-500 */
   /* Compare tool specific colors - only for colors that don't have existing theme pairs */
   --compare-upload-dropzone-bg: rgba(241, 245, 249, 0.45);
   --compare-upload-dropzone-border: rgba(148, 163, 184, 0.6);
@@ -340,19 +391,38 @@
   /* Compare page label chip (light mode): slightly lighter than surrounding rows */
   --compare-page-label-bg: var(--bg-muted);
   --compare-page-label-fg: var(--text-secondary);
+
+  /* Status indicator dot ring shadow */
+  --status-dot-ring: 0 0 0 2px rgba(0, 0, 0, 0.08);
+
+  /* Input element styling */
+  --input-bg: #ffffff;
+
+  /* Select/dropdown placeholder state */
+  --select-placeholder-bg: var(--mantine-color-gray-1);
+  --select-placeholder-text: var(--mantine-color-gray-6);
+
+  /* Grouped format dropdown */
+  --dropdown-trigger-bg: var(--mantine-color-white);
+  --dropdown-trigger-text: var(--mantine-color-dark-9);
+  --dropdown-trigger-text-disabled: var(--mantine-color-dark-7);
+  --dropdown-trigger-icon: var(--mantine-color-gray-6);
+  --dropdown-panel-bg: var(--mantine-color-white);
+  --dropdown-panel-border: var(--mantine-color-gray-4);
+  --dropdown-group-label: var(--mantine-color-gray-6);
 }
 
 /* Onboarding (light mode) */
 :root {
-  --onboarding-title: #0A0A0A;
-  --onboarding-body: #4A5565;
+  --onboarding-title: #0a0a0a;
+  --onboarding-body: #4a5565;
   --onboarding-primary-button-bg: #101828;
-  --onboarding-primary-button-text: #FFFFFF;
-  --onboarding-secondary-button-bg: #FFFFFF;
-  --onboarding-secondary-button-text: #6A7282;
-  --onboarding-secondary-button-border: #E5E5E5;
-  --onboarding-step-active: #1E2939;
-  --onboarding-step-inactive: #D1D5DC;
+  --onboarding-primary-button-text: #ffffff;
+  --onboarding-secondary-button-bg: #ffffff;
+  --onboarding-secondary-button-text: #6a7282;
+  --onboarding-secondary-button-border: #e5e5e5;
+  --onboarding-step-active: #1e2939;
+  --onboarding-step-inactive: #d1d5dc;
 }
 
 [data-mantine-color-scheme="dark"] {
@@ -386,8 +456,8 @@
   --color-red-900: #7f1d1d;
 
   --color-gray-50: #111827;
-  --color-gray-100: #1F2329;
-  --color-gray-200: #2A2F36;
+  --color-gray-100: #1f2329;
+  --color-gray-200: #2a2f36;
   --color-gray-300: #374151;
   --color-gray-400: #4b5563;
   --color-gray-500: #6b7280;
@@ -397,20 +467,20 @@
   --color-gray-900: #f3f4f6;
 
   /* Category colors - same as light mode for consistency */
-  --category-color-removal: #ef4444;        /* Red for removal tools */
-  --category-color-security: #f59e0b;       /* Orange for security tools */
-  --category-color-formatting: #8b5cf6;     /* Purple for formatting tools */
-  --category-color-extraction: #06b6d4;      /* Cyan for extraction tools */
-  --category-color-signing: #10b981;        /* Green for signing tools */
-  --category-color-general: #3b82f6;        /* Blue for general tools */
-  --category-color-verification: #f97316;    /* Orange for verification tools */
-  --category-color-automation: #ec4899;     /* Pink for automation tools */
-  --category-color-developer: #6b7280;      /* Gray for developer tools */
-  --category-color-default: #6b7280;        /* Default gray */
+  --category-color-removal: #ef4444; /* Red for removal tools */
+  --category-color-security: #f59e0b; /* Orange for security tools */
+  --category-color-formatting: #8b5cf6; /* Purple for formatting tools */
+  --category-color-extraction: #06b6d4; /* Cyan for extraction tools */
+  --category-color-signing: #10b981; /* Green for signing tools */
+  --category-color-general: #3b82f6; /* Blue for general tools */
+  --category-color-verification: #f97316; /* Orange for verification tools */
+  --category-color-automation: #ec4899; /* Pink for automation tools */
+  --category-color-developer: #6b7280; /* Gray for developer tools */
+  --category-color-default: #6b7280; /* Default gray */
 
   /* Special section colors - same as light mode for consistency */
-  --special-color-favorites: #FFC107;      /* Yellow/gold for favorites */
-  --special-color-recommended: #1BB1D4;    /* Cyan for recommended */
+  --special-color-favorites: #ffc107; /* Yellow/gold for favorites */
+  --special-color-recommended: #1bb1d4; /* Cyan for recommended */
 
   /* Success (green) - dark */
   --color-green-50: #052e16;
@@ -437,60 +507,60 @@
   --color-yellow-900: #fef9c3;
 
   /* Dark theme semantic colors */
-  --bg-surface: #2A2F36;
-  --bg-raised: #1F2329;
-  --bg-muted: #1F2329;
-  --bg-background: #2A2F36;
-  --bg-toolbar: #1F2329;
-  --bg-file-manager: #1F2329;
-  --bg-file-list: #2A2F36;
-  --btn-open-file: #0A8BFF;
+  --bg-surface: #2a2f36;
+  --bg-raised: #1f2329;
+  --bg-muted: #1f2329;
+  --bg-background: #2a2f36;
+  --bg-toolbar: #1f2329;
+  --bg-file-manager: #1f2329;
+  --bg-file-list: #2a2f36;
+  --btn-open-file: #0a8bff;
   --text-primary: #f9fafb;
   --text-secondary: #d1d5db;
   --text-muted: #9ca3af;
   /* Always-dark text (for use on light backgrounds like alerts) - does not change in dark mode */
   --text-always-dark: #1f2937;
   --text-always-dark-muted: #6b7280;
-  --border-subtle: #2A2F36;
-  --border-default: #3A4047;
+  --border-subtle: #2a2f36;
+  --border-default: #3a4047;
   --border-strong: #4b5563;
   --hover-bg: #374151;
   --active-bg: #4b5563;
   --automation-entry-hover-bg: var(--color-gray-200);
 
   /* Icon colors for dark mode */
-  --icon-user-bg: #2A2F36;
-  --icon-user-color: #6E7581;
-  --icon-notifications-bg: #2A2F36;
-  --icon-notifications-color: #6E7581;
-  --icon-tools-bg: #4B525A;
-  --icon-tools-color: #EAEAEA;
-  --icon-read-bg: #4B525A;
-  --icon-read-color: #EAEAEA;
-  --icon-sign-bg: #4B525A;
-  --icon-sign-color: #EAEAEA;
-  --icon-automate-bg: #4B525A;
-  --icon-automate-color: #EAEAEA;
-  --icon-files-bg: #4B525A;
-  --icon-files-color: #EAEAEA;
-  --icon-activity-bg: #4B525A;
-  --icon-activity-color: #EAEAEA;
-  --icon-config-bg: #4B525A;
-  --icon-config-color: #EAEAEA;
+  --icon-user-bg: #2a2f36;
+  --icon-user-color: #6e7581;
+  --icon-notifications-bg: #2a2f36;
+  --icon-notifications-color: #6e7581;
+  --icon-tools-bg: #4b525a;
+  --icon-tools-color: #eaeaea;
+  --icon-read-bg: #4b525a;
+  --icon-read-color: #eaeaea;
+  --icon-sign-bg: #4b525a;
+  --icon-sign-color: #eaeaea;
+  --icon-automate-bg: #4b525a;
+  --icon-automate-color: #eaeaea;
+  --icon-files-bg: #4b525a;
+  --icon-files-color: #eaeaea;
+  --icon-activity-bg: #4b525a;
+  --icon-activity-color: #eaeaea;
+  --icon-config-bg: #4b525a;
+  --icon-config-color: #eaeaea;
 
   /* Inactive icon colors for dark mode */
-  --icon-inactive-bg: #2A2F36;
-  --icon-inactive-color: #6E7581;
+  --icon-inactive-bg: #2a2f36;
+  --icon-inactive-color: #6e7581;
 
   /* RightRail (dark) */
-  --right-rail-bg: #1F2329;           /* dark background */
-  --right-rail-foreground: #2A2F36;   /* panel behind custom tool icons */
-  --right-rail-icon: #BCBEBF;         /* icon color */
-  --right-rail-icon-disabled: #43464B;/* disabled icon */
-  --right-rail-pan-active-bg: #EAEAEA;
+  --right-rail-bg: #1f2329; /* dark background */
+  --right-rail-foreground: #2a2f36; /* panel behind custom tool icons */
+  --right-rail-icon: #bcbebf; /* icon color */
+  --right-rail-icon-disabled: #43464b; /* disabled icon */
+  --right-rail-pan-active-bg: #eaeaea;
 
   /* Dark mode tooltip colors */
-  --tooltip-title-bg: #4B525A;
+  --tooltip-title-bg: #4b525a;
   --tooltip-title-color: #fff;
   --tooltip-header-bg: var(--bg-raised);
   --tooltip-header-color: var(--text-primary);
@@ -499,37 +569,49 @@
   --accent-interactive: #ffffff;
   --text-instruction: #ffffff;
   --text-brand: var(--color-gray-800);
-  --text-brand-accent: #EF4444;
+  --text-brand-accent: #ef4444;
 
   /* Compare badge text colors (dark mode): lighter for readability */
   --spdf-compare-removed-badge-fg: var(--color-red-500);
   --spdf-compare-added-badge-fg: var(--color-green-500);
 
   /* container */
-  --landing-paper-bg: #171A1F;
+  --landing-paper-bg: #171a1f;
   --landing-inner-paper-bg: var(--bg-raised);
-  --landing-inner-paper-border: #2D3237;
-  --landing-button-bg: #2B3037;
-  --landing-button-color: #ffffff;
-  --landing-button-border: #2D3237;
-  --landing-button-hover-bg: #4c525b;
+  --landing-inner-paper-border: #2d3237;
 
-  /* drop state */
-  --landing-drop-paper-bg: #1A2332;
-  --landing-drop-inner-paper-bg: #2A3441;
-  --landing-drop-inner-paper-border: #3A4451;
+  /* landing dark overrides */
+  --landing-stack-glow-bg: radial-gradient(
+    circle,
+    rgba(30, 136, 229, 0.22) 0%,
+    transparent 70%
+  );
+  --landing-doc-shadow-back-idle:
+    0 4px 20px rgba(0, 0, 0, 0.35), 0 1px 3px rgba(0, 0, 0, 0.25);
+  --landing-doc-shadow-back-hover:
+    0 14px 44px rgba(0, 0, 0, 0.55), 0 6px 16px rgba(0, 0, 0, 0.35);
+  --landing-doc-shadow-front-idle:
+    0 8px 30px rgba(0, 0, 0, 0.45), 0 4px 12px rgba(0, 0, 0, 0.3),
+    0 0 0 1px rgba(255, 255, 255, 0.04);
+  --landing-doc-shadow-front-hover:
+    0 20px 52px rgba(0, 0, 0, 0.6), 0 10px 24px rgba(0, 0, 0, 0.4),
+    0 0 0 1px rgba(255, 255, 255, 0.06);
+  --landing-button-color: #ffffff;
+  --landing-button-hover-bg: var(--bg-raised);
 
   /* selected file header colors for dark */
-  --header-selected-bg: #1E88E5;
-  --header-selected-fg: #FFFFFF;
+  --header-selected-bg: #1e88e5;
+  --header-selected-fg: #ffffff;
   /* file card background (dark) */
-  --file-card-bg: #1F2329;
-  --accordion-item-bg: #373D45;  /* accordion item background - more distinguishable */
+  --file-card-bg: #1f2329;
+  --accordion-item-bg: #373d45; /* accordion item background - more distinguishable */
 
   /* shadows */
   --drop-shadow-color: rgba(255, 255, 255, 0.08);
   --drop-shadow-color-strong: rgba(255, 255, 255, 0.04);
-  --drop-shadow-filter: drop-shadow(0 0.2rem 0.4rem rgba(200, 200, 200, 0.08)) drop-shadow(0 0.6rem 0.6rem rgba(200, 200, 200, 0.06)) drop-shadow(0 1.2rem 1rem rgba(200, 200, 200, 0.04));
+  --drop-shadow-filter: drop-shadow(0 0.2rem 0.4rem rgba(200, 200, 200, 0.08))
+    drop-shadow(0 0.6rem 0.6rem rgba(200, 200, 200, 0.06))
+    drop-shadow(0 1.2rem 1rem rgba(200, 200, 200, 0.04));
 
   /* Adjust shadows for dark mode */
   --shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.3);
@@ -538,30 +620,29 @@
   --shadow-lg: 0 10px 15px rgba(0, 0, 0, 0.4);
   --shadow-xl: 0 20px 25px rgba(0, 0, 0, 0.4);
 
-  --tools-text-and-icon-color: #D0D6DC;
+  --tools-text-and-icon-color: #d0d6dc;
 
   /* Tool picker sticky header variables (dark mode) */
-  --tool-header-bg: #2A2F36;
-  --tool-header-border: #3A4047;
-  --tool-header-text: #D0D6DC;
-  --tool-header-badge-bg: #4B525A;
-  --tool-header-badge-text: #FFFFFF;
+  --tool-header-bg: #2a2f36;
+  --tool-header-border: #3a4047;
+  --tool-header-text: #d0d6dc;
+  --tool-header-badge-bg: #4b525a;
+  --tool-header-badge-text: #ffffff;
 
   /* Subcategory title styling (dark mode) */
-  --tool-subcategory-text-color: #9CA3AF; /* lighter text in dark mode as well */
-  --tool-subcategory-rule-color: #3A4047; /* doubly lighter (relative) line in dark */
-
+  --tool-subcategory-text-color: #9ca3af; /* lighter text in dark mode as well */
+  --tool-subcategory-rule-color: #3a4047; /* doubly lighter (relative) line in dark */
 
   /* PDF text selection colors (dark mode) */
   --pdf-selection-bg: rgba(96, 165, 250, 0.25);
   --pdf-selection-ring: rgba(96, 165, 250, 0.28);
 
   /* Placeholder text colors (dark mode) */
-  --search-text-and-icon-color: #FFFFFF !important;
+  --search-text-and-icon-color: #ffffff !important;
 
   /* Tool panel search bar background colors (dark mode) */
-  --tool-panel-search-bg: #1F2329;
-  --tool-panel-search-border-bottom: #4B525A;
+  --tool-panel-search-bg: #1f2329;
+  --tool-panel-search-border-bottom: #4b525a;
 
   --information-text-bg: #292e34;
   --information-text-color: #ececec;
@@ -569,44 +650,46 @@
   /* Bulk selection panel specific colors (dark mode) */
   --bulk-panel-bg: var(--bg-raised); /* dark background for parent container */
   --bulk-card-bg: var(--bg-raised); /* dark background for cards */
-  --bulk-card-border: var(--border-default); /* default border for cards and buttons */
+  --bulk-card-border: var(
+    --border-default
+  ); /* default border for cards and buttons */
   --bulk-card-hover-border: var(--border-strong); /* stronger border on hover */
-  --unsupported-bar-bg: #1F2329;
-  --unsupported-bar-border: #4B525A;
+  --unsupported-bar-bg: #1f2329;
+  --unsupported-bar-border: #4b525a;
 
   /* Config Modal colors (dark mode) */
-  --modal-nav-bg: #1F2329;
-  --modal-nav-section-title: #9CA3AF;
-  --modal-nav-item: #D0D6DC;
-  --modal-nav-item-active: #0A8BFF;
+  --modal-nav-bg: #1f2329;
+  --modal-nav-section-title: #9ca3af;
+  --modal-nav-item: #d0d6dc;
+  --modal-nav-item-active: #0a8bff;
   --modal-nav-item-active-bg: rgba(10, 139, 255, 0.15);
-  --modal-content-bg: #2A2F36;
+  --modal-content-bg: #2a2f36;
   --modal-header-border: rgba(255, 255, 255, 0.08);
 
   /* Onboarding (dark mode) */
-  --onboarding-title: #F9FAFB;
-  --onboarding-body: #D1D5DB;
-  --onboarding-primary-button-bg: #FFFFFF;
-  --onboarding-primary-button-text: #0B1220;
+  --onboarding-title: #f9fafb;
+  --onboarding-body: #d1d5db;
+  --onboarding-primary-button-bg: #ffffff;
+  --onboarding-primary-button-text: #0b1220;
   --onboarding-secondary-button-bg: transparent;
-  --onboarding-secondary-button-text: #E5E7EB;
-  --onboarding-secondary-button-border: #3A4047;
-  --onboarding-step-active: #E5E7EB;
-  --onboarding-step-inactive: #4B5563;
+  --onboarding-secondary-button-text: #e5e7eb;
+  --onboarding-secondary-button-border: #3a4047;
+  --onboarding-step-active: #e5e7eb;
+  --onboarding-step-inactive: #4b5563;
   /* API Keys section colors (dark mode) */
-  --api-keys-card-bg: #2A2F36;
-  --api-keys-card-border: #3A4047;
+  --api-keys-card-bg: #2a2f36;
+  --api-keys-card-border: #3a4047;
   --api-keys-card-shadow: none;
-  --api-keys-input-bg: #1F2329;
-  --api-keys-input-border: #3A4047;
-  --api-keys-button-bg: #3A4047;
-  --api-keys-button-color: #D0D6DC;
+  --api-keys-input-bg: #1f2329;
+  --api-keys-input-border: #3a4047;
+  --api-keys-button-bg: #3a4047;
+  --api-keys-button-color: #d0d6dc;
 
   /* Code token colors (dark mode - Cursor-like) */
-  --code-kw-color: #C792EA;   /* purple */
-  --code-str-color: #C3E88D;  /* green */
-  --code-num-color: #F78C6C;  /* orange */
-  --code-com-color: #697098;  /* muted gray-blue */
+  --code-kw-color: #c792ea; /* purple */
+  --code-str-color: #c3e88d; /* green */
+  --code-num-color: #f78c6c; /* orange */
+  --code-com-color: #697098; /* muted gray-blue */
   /* Compare tool specific colors (dark mode) - only for colors that don't have existing theme pairs */
   --compare-upload-dropzone-bg: rgba(31, 35, 41, 0.45);
   --compare-upload-dropzone-border: rgba(75, 85, 99, 0.6);
@@ -615,8 +698,27 @@
   --compare-upload-divider: rgba(75, 85, 99, 0.5);
 
   /* Compare page label chip (dark mode): slightly darker than surrounding rows */
-  --compare-page-label-bg: #1F2329;
+  --compare-page-label-bg: #1f2329;
   --compare-page-label-fg: var(--text-secondary);
+
+  /* Status indicator dot ring shadow (dark) */
+  --status-dot-ring: 0 0 0 2px rgba(255, 255, 255, 0.18);
+
+  /* Input element styling (dark) */
+  --input-bg: #4b525a;
+
+  /* Select/dropdown placeholder state (dark) */
+  --select-placeholder-bg: var(--mantine-color-dark-5);
+  --select-placeholder-text: var(--mantine-color-dark-2);
+
+  /* Grouped format dropdown (dark) */
+  --dropdown-trigger-bg: var(--mantine-color-dark-6);
+  --dropdown-trigger-text: var(--mantine-color-dark-0);
+  --dropdown-trigger-text-disabled: var(--mantine-color-dark-1);
+  --dropdown-trigger-icon: var(--mantine-color-dark-2);
+  --dropdown-panel-bg: var(--mantine-color-dark-7);
+  --dropdown-panel-border: var(--mantine-color-dark-4);
+  --dropdown-group-label: var(--mantine-color-dark-2);
 }
 
 /* Dropzone drop state styling */
@@ -641,11 +743,12 @@
 
 /* Plan section button colors */
 .plan-button:not(:disabled):not([data-disabled]) {
-  background-color: #0A8BFF !important;
+  background-color: #0a8bff !important;
 }
 
-[data-mantine-color-scheme="dark"] .plan-button:not(:disabled):not([data-disabled]) {
-  background-color: #1C598E !important;
+[data-mantine-color-scheme="dark"]
+  .plan-button:not(:disabled):not([data-disabled]) {
+  background-color: #1c598e !important;
 }
 
 /* Lighter grey for disabled plan buttons */
@@ -698,21 +801,22 @@
 
 /* Smooth transitions for theme switching */
 * {
-  transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
+  transition:
+    background-color 0.2s ease,
+    border-color 0.2s ease,
+    color 0.2s ease;
 }
 /* ── PDF Link Overlay (viewer) ── */
 :root {
   --link-hover-bg: rgba(10, 139, 255, 0.04);
   --link-hover-border: rgba(10, 139, 255, 0.15);
   --link-hover-shadow:
-    0 0 0 0.5px rgba(10, 139, 255, 0.05),
-    0 1px 3px rgba(10, 139, 255, 0.04);
+    0 0 0 0.5px rgba(10, 139, 255, 0.05), 0 1px 3px rgba(10, 139, 255, 0.04);
   --link-focus-ring: rgba(10, 139, 255, 0.25);
   --link-toolbar-bg: rgba(15, 23, 42, 0.88);
   --link-toolbar-border: rgba(255, 255, 255, 0.1);
   --link-toolbar-shadow:
-    0 12px 40px rgba(0, 0, 0, 0.2),
-    0 4px 12px rgba(0, 0, 0, 0.16),
+    0 12px 40px rgba(0, 0, 0, 0.2), 0 4px 12px rgba(0, 0, 0, 0.16),
     0 0 0 0.5px rgba(255, 255, 255, 0.05);
 }
 
@@ -720,14 +824,12 @@
   --link-hover-bg: rgba(10, 139, 255, 0.06);
   --link-hover-border: rgba(59, 170, 255, 0.2);
   --link-hover-shadow:
-    0 0 0 0.5px rgba(59, 170, 255, 0.1),
-    0 1px 3px rgba(10, 139, 255, 0.08);
+    0 0 0 0.5px rgba(59, 170, 255, 0.1), 0 1px 3px rgba(10, 139, 255, 0.08);
   --link-focus-ring: rgba(59, 170, 255, 0.3);
   --link-toolbar-bg: rgba(15, 23, 42, 0.92);
   --link-toolbar-border: rgba(255, 255, 255, 0.08);
   --link-toolbar-shadow:
-    0 12px 40px rgba(0, 0, 0, 0.35),
-    0 4px 12px rgba(0, 0, 0, 0.25),
+    0 12px 40px rgba(0, 0, 0, 0.35), 0 4px 12px rgba(0, 0, 0, 0.25),
     0 0 0 0.5px rgba(255, 255, 255, 0.04);
 }
 
@@ -827,7 +929,13 @@
   border: none;
   background: transparent;
   color: rgba(255, 255, 255, 0.9);
-  font-family: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
+  font-family:
+    Inter,
+    -apple-system,
+    BlinkMacSystemFont,
+    "Segoe UI",
+    Roboto,
+    sans-serif;
   font-size: 11.5px;
   font-weight: 500;
   letter-spacing: 0.01em;
@@ -877,7 +985,7 @@
 }
 
 .pdf-link-toolbar-btn--delete:hover {
-  background: rgba(239, 68, 68, 0.20);
+  background: rgba(239, 68, 68, 0.2);
   color: #f87171;
 }
 
@@ -888,7 +996,7 @@
 .pdf-link-toolbar-sep {
   width: 1px;
   height: 16px;
-  background: rgba(255, 255, 255, 0.10);
+  background: rgba(255, 255, 255, 0.1);
   flex-shrink: 0;
 }
 
@@ -899,3 +1007,96 @@
 [data-theme="dark"] {
   --shadow-color: rgba(0, 0, 0, 0.75);
 }
+
+/* Theme-aware image display utilities */
+/* Use .theme-img-light-only for images to show in light mode only */
+/* Use .theme-img-dark-only for images to show in dark mode only */
+.theme-img-light-only {
+  display: inline;
+}
+.theme-img-dark-only {
+  display: none;
+}
+[data-mantine-color-scheme="dark"] .theme-img-light-only {
+  display: none;
+}
+[data-mantine-color-scheme="dark"] .theme-img-dark-only {
+  display: inline;
+}
+
+/* Modern logo icon */
+.logo-icon-modern__path1 {
+  fill: #acacac;
+  fill-opacity: 0.3;
+}
+.logo-icon-modern__path2 {
+  fill: #fc9999;
+  fill-opacity: 0.5;
+}
+[data-mantine-color-scheme="dark"] .logo-icon-modern__path1 {
+  fill: #e6e6e6;
+  fill-opacity: 0.4;
+}
+[data-mantine-color-scheme="dark"] .logo-icon-modern__path2 {
+  fill: #e6e6e6;
+  fill-opacity: 0.7;
+}
+
+/* Classic logo icon — single path structure, colors change per theme */
+.logo-icon-classic__group {
+  opacity: 0.2;
+}
+.logo-icon-classic__body {
+  fill: #ff4b4b;
+}
+.logo-icon-classic__flap {
+  fill: #545454;
+}
+.logo-icon-classic__triangle {
+  fill: #d0dbdc;
+}
+.logo-icon-classic__s {
+  fill: white;
+}
+[data-mantine-color-scheme="dark"] .logo-icon-classic__group {
+  opacity: 1;
+}
+[data-mantine-color-scheme="dark"] .logo-icon-classic__body {
+  fill: white;
+}
+[data-mantine-color-scheme="dark"] .logo-icon-classic__flap {
+  fill: #d3d3d3;
+}
+[data-mantine-color-scheme="dark"] .logo-icon-classic__triangle {
+  fill: #d0dbdc;
+}
+[data-mantine-color-scheme="dark"] .logo-icon-classic__s {
+  fill: var(--mantine-color-body);
+}
+
+/* Wordmark muted variant (used in empty/placeholder states) */
+/* Stirling text: 30% opacity in light mode, full opacity in dark */
+.wordmark__text--muted {
+  fill-opacity: 0.3;
+}
+[data-mantine-color-scheme="dark"] .wordmark__text--muted {
+  fill-opacity: 1;
+}
+/* PDF text: dimmed red in light mode, standard red in dark */
+.wordmark__pdf--muted {
+  fill: #d62626;
+  fill-opacity: 0.7;
+}
+[data-mantine-color-scheme="dark"] .wordmark__pdf--muted {
+  fill: #c56565;
+  fill-opacity: 1;
+}
+
+/* Snappier View-Transitions for FileEditor card reordering. Each thumbnail
+ * is tagged with `view-transition-name: file-card-<id>` (see
+ * FileEditorThumbnail.tsx); the browser FLIPs it between old and new
+ * positions on reorder. Override the sluggish 250ms default. */
+::view-transition-group(*) {
+  animation-duration: 160ms;
+  animation-timing-function: cubic-bezier(0.2, 0, 0.2, 1);
+}
diff --git a/frontend/src/core/styles/zIndex.ts b/frontend/src/core/styles/zIndex.ts
index 86f0df1fe6..d58b8503cf 100644
--- a/frontend/src/core/styles/zIndex.ts
+++ b/frontend/src/core/styles/zIndex.ts
@@ -33,5 +33,3 @@ export const Z_INDEX_SIGNATURE_DRAG_BLOCKER = 999;
 export const Z_INDEX_SIGNATURE_OVERLAY = 1000;
 export const Z_INDEX_SIGNATURE_OVERLAY_HANDLE = 1001;
 export const Z_INDEX_SIGNATURE_OVERLAY_DELETE = 1002;
-
-
diff --git a/frontend/src/core/testing/serverExperienceSimulations.ts b/frontend/src/core/testing/serverExperienceSimulations.ts
index bbd9b1702a..1ddb61ccae 100644
--- a/frontend/src/core/testing/serverExperienceSimulations.ts
+++ b/frontend/src/core/testing/serverExperienceSimulations.ts
@@ -1,4 +1,4 @@
-import type { AppConfig } from '@app/contexts/AppConfigContext';
+import type { AppConfig } from "@app/contexts/AppConfigContext";
 
 interface LicenseInfo {
   licenseType: string;
@@ -30,7 +30,7 @@ const DEV_TESTING_MODE = false;
 const SIMULATION_INDEX = 0;
 
 const FREE_LICENSE_INFO: LicenseInfo = {
-  licenseType: 'NORMAL',
+  licenseType: "NORMAL",
   enabled: false,
   maxUsers: 5,
   hasKey: false,
@@ -38,7 +38,7 @@ const FREE_LICENSE_INFO: LicenseInfo = {
 
 const BASE_NO_LOGIN_CONFIG: AppConfig = {
   enableAnalytics: true,
-  appVersion: '2.8.0',
+  appVersion: "2.9.2",
   serverCertificateEnabled: false,
   enableAlphaFunctionality: false,
   serverPort: 8080,
@@ -48,9 +48,9 @@ const BASE_NO_LOGIN_CONFIG: AppConfig = {
   enableLogin: false,
   activeSecurity: false,
   languages: [],
-  contextPath: '/',
-  license: 'NORMAL',
-  baseUrl: 'http://localhost',
+  contextPath: "/",
+  license: "NORMAL",
+  baseUrl: "http://localhost",
   enableEmailInvites: true,
 };
 
@@ -62,12 +62,12 @@ const BASE_LOGIN_CONFIG: AppConfig = {
 
 const SIMULATION_SCENARIOS: SimulationScenario[] = [
   {
-    label: 'no-login-user-under-limit (no-license)',
+    label: "no-login-user-under-limit (no-license)",
     appConfig: {
       ...BASE_NO_LOGIN_CONFIG,
     },
     wau: {
-      trackingSince: '2025-11-18T23:20:12.520884200Z',
+      trackingSince: "2025-11-18T23:20:12.520884200Z",
       daysOnline: 0,
       totalUniqueBrowsers: 3,
       weeklyActiveUsers: 3,
@@ -75,12 +75,12 @@ const SIMULATION_SCENARIOS: SimulationScenario[] = [
     licenseInfo: { ...FREE_LICENSE_INFO },
   },
   {
-    label: 'no-login-admin-under-limit (no-license)',
+    label: "no-login-admin-under-limit (no-license)",
     appConfig: {
       ...BASE_NO_LOGIN_CONFIG,
     },
     wau: {
-      trackingSince: '2025-10-01T00:00:00Z',
+      trackingSince: "2025-10-01T00:00:00Z",
       daysOnline: 14,
       totalUniqueBrowsers: 4,
       weeklyActiveUsers: 4,
@@ -88,12 +88,12 @@ const SIMULATION_SCENARIOS: SimulationScenario[] = [
     licenseInfo: { ...FREE_LICENSE_INFO },
   },
   {
-    label: 'no-login-user-over-limit (no-license)',
+    label: "no-login-user-over-limit (no-license)",
     appConfig: {
       ...BASE_NO_LOGIN_CONFIG,
     },
     wau: {
-      trackingSince: '2025-09-01T00:00:00Z',
+      trackingSince: "2025-09-01T00:00:00Z",
       daysOnline: 30,
       totalUniqueBrowsers: 12,
       weeklyActiveUsers: 9,
@@ -101,12 +101,12 @@ const SIMULATION_SCENARIOS: SimulationScenario[] = [
     licenseInfo: { ...FREE_LICENSE_INFO },
   },
   {
-    label: 'no-login-admin-over-limit (no-license)',
+    label: "no-login-admin-over-limit (no-license)",
     appConfig: {
       ...BASE_NO_LOGIN_CONFIG,
     },
     wau: {
-      trackingSince: '2025-08-15T00:00:00Z',
+      trackingSince: "2025-08-15T00:00:00Z",
       daysOnline: 45,
       totalUniqueBrowsers: 18,
       weeklyActiveUsers: 12,
@@ -114,7 +114,7 @@ const SIMULATION_SCENARIOS: SimulationScenario[] = [
     licenseInfo: { ...FREE_LICENSE_INFO },
   },
   {
-    label: 'login-user-under-limit (no-license)',
+    label: "login-user-under-limit (no-license)",
     appConfig: {
       ...BASE_LOGIN_CONFIG,
       isAdmin: false,
@@ -125,7 +125,7 @@ const SIMULATION_SCENARIOS: SimulationScenario[] = [
     licenseInfo: { ...FREE_LICENSE_INFO },
   },
   {
-    label: 'login-admin-under-limit (no-license)',
+    label: "login-admin-under-limit (no-license)",
     appConfig: {
       ...BASE_LOGIN_CONFIG,
       isAdmin: true,
@@ -136,7 +136,7 @@ const SIMULATION_SCENARIOS: SimulationScenario[] = [
     licenseInfo: { ...FREE_LICENSE_INFO },
   },
   {
-    label: 'login-user-over-limit (no-license)',
+    label: "login-user-over-limit (no-license)",
     appConfig: {
       ...BASE_LOGIN_CONFIG,
       isAdmin: false,
@@ -147,7 +147,7 @@ const SIMULATION_SCENARIOS: SimulationScenario[] = [
     licenseInfo: { ...FREE_LICENSE_INFO },
   },
   {
-    label: 'login-admin-over-limit (no-license)',
+    label: "login-admin-over-limit (no-license)",
     appConfig: {
       ...BASE_LOGIN_CONFIG,
       isAdmin: true,
@@ -165,10 +165,14 @@ function getActiveScenario(): SimulationScenario | null {
   }
   const scenario = SIMULATION_SCENARIOS[SIMULATION_INDEX];
   if (!scenario) {
-    console.warn('[Simulation] SIMULATION_INDEX out of range, using live backend.');
+    console.warn(
+      "[Simulation] SIMULATION_INDEX out of range, using live backend.",
+    );
     return null;
   }
-  console.warn(`[Simulation] Using scenario #${SIMULATION_INDEX} (${scenario.label}).`);
+  console.warn(
+    `[Simulation] Using scenario #${SIMULATION_INDEX} (${scenario.label}).`,
+  );
   return scenario;
 }
 
@@ -189,4 +193,3 @@ export function getSimulatedLicenseInfo(): LicenseInfo | null {
 }
 
 export const DEV_TESTING_ENABLED = DEV_TESTING_MODE;
-
diff --git a/frontend/src/core/tests/certValidation/CertificateValidationE2E.spec.ts b/frontend/src/core/tests/certValidation/CertificateValidationE2E.spec.ts
index cf15ec084f..1f8886bab4 100644
--- a/frontend/src/core/tests/certValidation/CertificateValidationE2E.spec.ts
+++ b/frontend/src/core/tests/certValidation/CertificateValidationE2E.spec.ts
@@ -1,23 +1,23 @@
-import { test, expect, type Page } from '@playwright/test';
-import path from 'path';
+import { test, expect, type Page } from "@playwright/test";
+import path from "path";
 
 // ---------------------------------------------------------------------------
 // Test fixtures — pre-generated keystores in test-fixtures/certs/
 // ---------------------------------------------------------------------------
-const CERTS_DIR = path.join(__dirname, '../test-fixtures/certs');
-const VALID_P12 = path.join(CERTS_DIR, 'valid-test.p12');
-const EXPIRED_P12 = path.join(CERTS_DIR, 'expired-test.p12');
-const NOT_YET_VALID_P12 = path.join(CERTS_DIR, 'not-yet-valid-test.p12');
-const VALID_JKS = path.join(CERTS_DIR, 'valid-test.jks');
+const CERTS_DIR = path.join(__dirname, "../test-fixtures/certs");
+const VALID_P12 = path.join(CERTS_DIR, "valid-test.p12");
+const EXPIRED_P12 = path.join(CERTS_DIR, "expired-test.p12");
+const NOT_YET_VALID_P12 = path.join(CERTS_DIR, "not-yet-valid-test.p12");
+const VALID_JKS = path.join(CERTS_DIR, "valid-test.jks");
 
 // ---------------------------------------------------------------------------
 // Stable mock data returned by the mocked backend
 // ---------------------------------------------------------------------------
 const MOCK_SESSION = {
-  sessionId: 'test-session-id',
-  documentName: 'test-document.pdf',
-  status: 'IN_PROGRESS',
-  ownerUsername: 'test-owner',
+  sessionId: "test-session-id",
+  documentName: "test-document.pdf",
+  status: "IN_PROGRESS",
+  ownerUsername: "test-owner",
   message: null,
   dueDate: null,
   participants: [],
@@ -25,10 +25,10 @@ const MOCK_SESSION = {
 
 const MOCK_PARTICIPANT = {
   id: 1,
-  email: 'test@example.com',
-  name: 'Test User',
-  status: 'PENDING',
-  shareToken: 'test-token',
+  email: "test@example.com",
+  name: "Test User",
+  status: "PENDING",
+  shareToken: "test-token",
   expiresAt: null,
   hasCompleted: false,
   isExpired: false,
@@ -40,30 +40,30 @@ const MOCK_PARTICIPANT = {
 // ---------------------------------------------------------------------------
 async function mockParticipantApis(page: Page) {
   // Mock auth so AppProviders/Landing don't redirect to /login
-  await page.route('**/api/v1/auth/me', (route) =>
+  await page.route("**/api/v1/auth/me", (route) =>
     route.fulfill({
       json: {
         id: 1,
-        username: 'testuser',
-        email: 'test@example.com',
-        roles: ['ROLE_USER'],
+        username: "testuser",
+        email: "test@example.com",
+        roles: ["ROLE_USER"],
       },
-    })
+    }),
   );
 
-  await page.route('**/api/v1/workflow/participant/session**', (route) =>
-    route.fulfill({ json: MOCK_SESSION })
+  await page.route("**/api/v1/workflow/participant/session**", (route) =>
+    route.fulfill({ json: MOCK_SESSION }),
   );
-  await page.route('**/api/v1/workflow/participant/details**', (route) =>
-    route.fulfill({ json: MOCK_PARTICIPANT })
+  await page.route("**/api/v1/workflow/participant/details**", (route) =>
+    route.fulfill({ json: MOCK_PARTICIPANT }),
   );
   // Minimal stub so the download-document call doesn't throw
-  await page.route('**/api/v1/workflow/participant/document**', (route) =>
+  await page.route("**/api/v1/workflow/participant/document**", (route) =>
     route.fulfill({
       status: 200,
-      contentType: 'application/pdf',
+      contentType: "application/pdf",
       body: Buffer.alloc(128),
-    })
+    }),
   );
 }
 
@@ -72,8 +72,8 @@ async function mockParticipantApis(page: Page) {
 // the matching option — Mantine renders a custom combobox, not a native select.
 // ---------------------------------------------------------------------------
 async function selectCertType(page: Page, label: string) {
-  await page.getByTestId('cert-type-select').click();
-  await page.getByRole('option', { name: label }).click();
+  await page.getByTestId("cert-type-select").click();
+  await page.getByRole("option", { name: label }).click();
 }
 
 // ---------------------------------------------------------------------------
@@ -82,7 +82,7 @@ async function selectCertType(page: Page, label: string) {
 async function uploadCertFile(page: Page, filePath: string) {
   // Mantine FileInput uses a visually hidden <input type="file">.
   // We click the visible button to expose it, then set files via the hidden input.
-  const certFileInput = page.getByTestId('cert-file-input');
+  const certFileInput = page.getByTestId("cert-file-input");
   await certFileInput.click();
   // After click, the file chooser or the hidden input becomes interactive.
   // Use the first file input on the page (Mantine places it near the button).
@@ -93,138 +93,162 @@ async function uploadCertFile(page: Page, filePath: string) {
 // ---------------------------------------------------------------------------
 // Tests
 // ---------------------------------------------------------------------------
-test.describe('Certificate Validation — ParticipantView', () => {
+test.describe("Certificate Validation — ParticipantView", () => {
   test.beforeEach(async ({ page }) => {
     await mockParticipantApis(page);
   });
 
   // 1. Happy path — valid P12
-  test('valid P12 cert shows green "Certificate valid until" feedback', async ({ page }) => {
-    await page.route('**/api/v1/workflow/participant/validate-certificate', (route) =>
-      route.fulfill({
-        json: {
-          valid: true,
-          subjectName: 'Test Signer',
-          notAfter: '2027-01-01T00:00:00Z',
-          notBefore: '2025-01-01T00:00:00Z',
-          selfSigned: true,
-          error: null,
-        },
-      })
+  test('valid P12 cert shows green "Certificate valid until" feedback', async ({
+    page,
+  }) => {
+    await page.route(
+      "**/api/v1/workflow/participant/validate-certificate",
+      (route) =>
+        route.fulfill({
+          json: {
+            valid: true,
+            subjectName: "Test Signer",
+            notAfter: "2027-01-01T00:00:00Z",
+            notBefore: "2025-01-01T00:00:00Z",
+            selfSigned: true,
+            error: null,
+          },
+        }),
     );
 
-    await page.goto('/workflow/sign/test-token');
+    await page.goto("/workflow/sign/test-token");
     await page.waitForSelector('[data-testid="submit-signature-button"]');
 
     await uploadCertFile(page, VALID_P12);
-    await page.getByTestId('cert-password-input').fill('testpass');
+    await page.getByTestId("cert-password-input").fill("testpass");
 
     // Wait for debounce (600 ms) + network round-trip
-    const feedback = page.getByTestId('cert-validation-feedback');
-    await expect(feedback).toContainText('Certificate valid until', { timeout: 5000 });
-    await expect(feedback).toContainText('Test Signer');
+    const feedback = page.getByTestId("cert-validation-feedback");
+    await expect(feedback).toContainText("Certificate valid until", {
+      timeout: 5000,
+    });
+    await expect(feedback).toContainText("Test Signer");
   });
 
   // 2. Wrong password — red error
-  test('wrong password shows red error message', async ({ page }) => {
-    await page.route('**/api/v1/workflow/participant/validate-certificate', (route) =>
-      route.fulfill({
-        json: {
-          valid: false,
-          subjectName: null,
-          notAfter: null,
-          notBefore: null,
-          selfSigned: false,
-          error: 'Invalid certificate password or corrupt keystore file',
-        },
-      })
+  test("wrong password shows red error message", async ({ page }) => {
+    await page.route(
+      "**/api/v1/workflow/participant/validate-certificate",
+      (route) =>
+        route.fulfill({
+          json: {
+            valid: false,
+            subjectName: null,
+            notAfter: null,
+            notBefore: null,
+            selfSigned: false,
+            error: "Invalid certificate password or corrupt keystore file",
+          },
+        }),
     );
 
-    await page.goto('/workflow/sign/test-token');
+    await page.goto("/workflow/sign/test-token");
     await page.waitForSelector('[data-testid="submit-signature-button"]');
 
     await uploadCertFile(page, VALID_P12);
-    await page.getByTestId('cert-password-input').fill('wrongpass');
+    await page.getByTestId("cert-password-input").fill("wrongpass");
 
-    const feedback = page.getByTestId('cert-validation-feedback');
-    await expect(feedback).toContainText('Invalid certificate password', { timeout: 5000 });
+    const feedback = page.getByTestId("cert-validation-feedback");
+    await expect(feedback).toContainText("Invalid certificate password", {
+      timeout: 5000,
+    });
   });
 
   // 3. Expired certificate
-  test('expired cert shows "Certificate has expired" error', async ({ page }) => {
-    await page.route('**/api/v1/workflow/participant/validate-certificate', (route) =>
-      route.fulfill({
-        json: {
-          valid: false,
-          subjectName: null,
-          notAfter: null,
-          notBefore: null,
-          selfSigned: false,
-          error: 'Certificate has expired (expired: 2023-01-02 00:00:00 UTC)',
-        },
-      })
+  test('expired cert shows "Certificate has expired" error', async ({
+    page,
+  }) => {
+    await page.route(
+      "**/api/v1/workflow/participant/validate-certificate",
+      (route) =>
+        route.fulfill({
+          json: {
+            valid: false,
+            subjectName: null,
+            notAfter: null,
+            notBefore: null,
+            selfSigned: false,
+            error: "Certificate has expired (expired: 2023-01-02 00:00:00 UTC)",
+          },
+        }),
     );
 
-    await page.goto('/workflow/sign/test-token');
+    await page.goto("/workflow/sign/test-token");
     await page.waitForSelector('[data-testid="submit-signature-button"]');
 
     await uploadCertFile(page, EXPIRED_P12);
-    await page.getByTestId('cert-password-input').fill('testpass');
+    await page.getByTestId("cert-password-input").fill("testpass");
 
-    const feedback = page.getByTestId('cert-validation-feedback');
-    await expect(feedback).toContainText('Certificate has expired', { timeout: 5000 });
+    const feedback = page.getByTestId("cert-validation-feedback");
+    await expect(feedback).toContainText("Certificate has expired", {
+      timeout: 5000,
+    });
   });
 
   // 4. Not-yet-valid certificate
   test('not-yet-valid cert shows "not yet valid" error', async ({ page }) => {
-    await page.route('**/api/v1/workflow/participant/validate-certificate', (route) =>
-      route.fulfill({
-        json: {
-          valid: false,
-          subjectName: null,
-          notAfter: null,
-          notBefore: null,
-          selfSigned: false,
-          error: 'Certificate is not yet valid (valid from: 2027-01-01 00:00:00 UTC)',
-        },
-      })
+    await page.route(
+      "**/api/v1/workflow/participant/validate-certificate",
+      (route) =>
+        route.fulfill({
+          json: {
+            valid: false,
+            subjectName: null,
+            notAfter: null,
+            notBefore: null,
+            selfSigned: false,
+            error:
+              "Certificate is not yet valid (valid from: 2027-01-01 00:00:00 UTC)",
+          },
+        }),
     );
 
-    await page.goto('/workflow/sign/test-token');
+    await page.goto("/workflow/sign/test-token");
     await page.waitForSelector('[data-testid="submit-signature-button"]');
 
     await uploadCertFile(page, NOT_YET_VALID_P12);
-    await page.getByTestId('cert-password-input').fill('testpass');
+    await page.getByTestId("cert-password-input").fill("testpass");
 
-    const feedback = page.getByTestId('cert-validation-feedback');
-    await expect(feedback).toContainText('not yet valid', { timeout: 5000 });
+    const feedback = page.getByTestId("cert-validation-feedback");
+    await expect(feedback).toContainText("not yet valid", { timeout: 5000 });
   });
 
   // 5. Submit button disabled while validating
-  test('submit button is disabled while validation is in flight', async ({ page }) => {
+  test("submit button is disabled while validation is in flight", async ({
+    page,
+  }) => {
     // Slow response so we can assert the disabled state mid-flight
-    await page.route('**/api/v1/workflow/participant/validate-certificate', async (route) => {
-      await new Promise((r) => setTimeout(r, 1500));
-      await route.fulfill({
-        json: {
-          valid: true,
-          subjectName: 'Test Signer',
-          notAfter: '2027-01-01T00:00:00Z',
-          notBefore: '2025-01-01T00:00:00Z',
-          selfSigned: true,
-          error: null,
-        },
-      });
-    });
+    await page.route(
+      "**/api/v1/workflow/participant/validate-certificate",
+      async (route) => {
+        await new Promise((r) => setTimeout(r, 1500));
+        await route.fulfill({
+          json: {
+            valid: true,
+            subjectName: "Test Signer",
+            notAfter: "2027-01-01T00:00:00Z",
+            notBefore: "2025-01-01T00:00:00Z",
+            selfSigned: true,
+            error: null,
+          },
+        });
+      },
+    );
 
-    await page.goto('/workflow/sign/test-token');
+    await page.goto("/workflow/sign/test-token");
     await page.waitForSelector('[data-testid="submit-signature-button"]');
 
     await uploadCertFile(page, VALID_P12);
-    await page.getByTestId('cert-password-input').fill('testpass');
+    await page.getByTestId("cert-password-input").fill("testpass");
 
     // Shortly after typing, validation is in flight — button must be disabled
-    const submitBtn = page.getByTestId('submit-signature-button');
+    const submitBtn = page.getByTestId("submit-signature-button");
     await expect(submitBtn).toBeDisabled({ timeout: 3000 });
 
     // After validation completes the button should be re-enabled
@@ -232,49 +256,58 @@ test.describe('Certificate Validation — ParticipantView', () => {
   });
 
   // 6. SERVER type — no validation call made, button stays enabled
-  test('SERVER cert type skips validation and keeps submit enabled', async ({ page }) => {
+  test("SERVER cert type skips validation and keeps submit enabled", async ({
+    page,
+  }) => {
     let validateCalled = false;
-    await page.route('**/api/v1/workflow/participant/validate-certificate', (route) => {
-      validateCalled = true;
-      return route.fulfill({ json: { valid: true } });
-    });
+    await page.route(
+      "**/api/v1/workflow/participant/validate-certificate",
+      (route) => {
+        validateCalled = true;
+        return route.fulfill({ json: { valid: true } });
+      },
+    );
 
-    await page.goto('/workflow/sign/test-token');
+    await page.goto("/workflow/sign/test-token");
     await page.waitForSelector('[data-testid="submit-signature-button"]');
 
-    await selectCertType(page, 'Server Certificate (if available)');
+    await selectCertType(page, "Server Certificate (if available)");
 
     // Wait longer than debounce to confirm no call is made
     await page.waitForTimeout(1000);
 
     expect(validateCalled).toBe(false);
-    await expect(page.getByTestId('submit-signature-button')).toBeEnabled();
+    await expect(page.getByTestId("submit-signature-button")).toBeEnabled();
   });
 
   // 7. Bonus — valid JKS keystore
-  test('valid JKS keystore shows green feedback', async ({ page }) => {
-    await page.route('**/api/v1/workflow/participant/validate-certificate', (route) =>
-      route.fulfill({
-        json: {
-          valid: true,
-          subjectName: 'JKS Signer',
-          notAfter: '2027-01-01T00:00:00Z',
-          notBefore: '2025-01-01T00:00:00Z',
-          selfSigned: true,
-          error: null,
-        },
-      })
+  test("valid JKS keystore shows green feedback", async ({ page }) => {
+    await page.route(
+      "**/api/v1/workflow/participant/validate-certificate",
+      (route) =>
+        route.fulfill({
+          json: {
+            valid: true,
+            subjectName: "JKS Signer",
+            notAfter: "2027-01-01T00:00:00Z",
+            notBefore: "2025-01-01T00:00:00Z",
+            selfSigned: true,
+            error: null,
+          },
+        }),
     );
 
-    await page.goto('/workflow/sign/test-token');
+    await page.goto("/workflow/sign/test-token");
     await page.waitForSelector('[data-testid="submit-signature-button"]');
 
-    await selectCertType(page, 'JKS Keystore');
+    await selectCertType(page, "JKS Keystore");
     await uploadCertFile(page, VALID_JKS);
-    await page.getByTestId('cert-password-input').fill('jkspass');
+    await page.getByTestId("cert-password-input").fill("jkspass");
 
-    const feedback = page.getByTestId('cert-validation-feedback');
-    await expect(feedback).toContainText('Certificate valid until', { timeout: 5000 });
-    await expect(feedback).toContainText('JKS Signer');
+    const feedback = page.getByTestId("cert-validation-feedback");
+    await expect(feedback).toContainText("Certificate valid until", {
+      timeout: 5000,
+    });
+    await expect(feedback).toContainText("JKS Signer");
   });
 });
diff --git a/frontend/src/core/tests/compare/CompareE2E.spec.ts b/frontend/src/core/tests/compare/CompareE2E.spec.ts
new file mode 100644
index 0000000000..5fc568bacd
--- /dev/null
+++ b/frontend/src/core/tests/compare/CompareE2E.spec.ts
@@ -0,0 +1,305 @@
+/**
+ * End-to-End Tests for Compare Tool
+ *
+ * Regression coverage for the Compare slot auto-fill flow.
+ *
+ * Background: when a user has one file in the workbench and picks a second
+ * file from the "My Files" picker (triggering handleRecentFileSelect), the
+ * existing selection used to be replaced rather than unioned, so the Original
+ * slot jumped to the new file and the Edited slot stayed empty. See fix in
+ * FilesModalContext.handleRecentFileSelect that unions the newly picked IDs
+ * with the current selection.
+ *
+ * The end-to-end invariant this test guards: after two distinct PDFs have been
+ * added to the workbench through the file modal's add buttons, both Compare
+ * slots are populated and the Compare action button is enabled.
+ *
+ * All backend API calls are mocked via page.route() — no real backend required.
+ * The Vite dev server must be running (handled by playwright.config.ts webServer).
+ */
+
+import { test, expect, type Page } from "@playwright/test";
+import path from "path";
+
+const FIXTURES_DIR = path.join(__dirname, "../test-fixtures");
+const PDF_A = path.join(FIXTURES_DIR, "compare_sample_a.pdf");
+const PDF_B = path.join(FIXTURES_DIR, "compare_sample_b.pdf");
+
+async function mockAppApis(page: Page) {
+  await page.route("**/api/v1/info/status", (route) =>
+    route.fulfill({ json: { status: "UP" } }),
+  );
+  await page.route("**/api/v1/config/app-config", (route) =>
+    route.fulfill({
+      json: {
+        enableLogin: false,
+        languages: ["en-GB"],
+        defaultLocale: "en-GB",
+      },
+    }),
+  );
+  await page.route("**/api/v1/auth/me", (route) =>
+    route.fulfill({
+      json: {
+        id: 1,
+        username: "testuser",
+        email: "test@example.com",
+        roles: ["ROLE_USER"],
+      },
+    }),
+  );
+  await page.route("**/api/v1/config/endpoints-availability", (route) =>
+    route.fulfill({ json: { compare: { enabled: true } } }),
+  );
+  await page.route("**/api/v1/config/endpoint-enabled*", (route) =>
+    route.fulfill({ json: true }),
+  );
+  await page.route("**/api/v1/config/group-enabled*", (route) =>
+    route.fulfill({ json: true }),
+  );
+  await page.route("**/api/v1/ui-data/footer-info", (route) =>
+    route.fulfill({ json: {} }),
+  );
+  await page.route("**/api/v1/proprietary/**", (route) =>
+    route.fulfill({ json: {} }),
+  );
+}
+
+async function navigateToCompare(page: Page) {
+  await page.locator('[data-tour="tool-button-compare"]').first().click();
+  await page.waitForSelector('[data-testid="compare-slot-base"]', {
+    timeout: 5000,
+  });
+}
+
+async function uploadIntoSlot(
+  page: Page,
+  role: "base" | "comparison",
+  filePath: string,
+  expectedFilename: string,
+) {
+  await page.locator(`[data-testid="compare-slot-${role}-add"]`).click();
+  await page.waitForSelector(".mantine-Modal-overlay", {
+    state: "visible",
+    timeout: 5000,
+  });
+  await page.locator('[data-testid="file-input"]').setInputFiles(filePath);
+  await page.waitForSelector(".mantine-Modal-overlay", {
+    state: "hidden",
+    timeout: 10000,
+  });
+
+  const slot = page.locator(`[data-testid="compare-slot-${role}"]`);
+  await expect(slot).toHaveAttribute("data-slot-state", "filled", {
+    timeout: 10000,
+  });
+  await expect(slot).toHaveAttribute("data-slot-filename", expectedFilename);
+}
+
+test.describe("Compare tool slot selection", () => {
+  test.beforeEach(async ({ page }) => {
+    await mockAppApis(page);
+    await page.goto("/?bypassOnboarding=true");
+    await page.waitForSelector('[data-tour="tool-button-compare"]', {
+      timeout: 10000,
+    });
+  });
+
+  test("Original slot fills when a PDF is dropped via the landing dropzone", async ({
+    page,
+  }) => {
+    // Regression guard for the "middle state" bug: the landing dropzone path
+    // (FileManager's hidden file-input used by the drop-prompt on the empty
+    // workbench) dispatches ADD_FILES and SET_SELECTED_FILES on a different
+    // cadence than the modal-based upload. During the window where files.ids
+    // has the new file but selectedFileIds is still empty, the slot would
+    // show the placeholder unless the auto-fill falls back to allIds.
+    await navigateToCompare(page);
+
+    const baseSlot = page.locator('[data-testid="compare-slot-base"]');
+    await expect(baseSlot).toHaveAttribute("data-slot-state", "empty");
+
+    // Target the visible landing-prompt file input on the empty Compare tool.
+    const visibleFileInput = page.locator(
+      'input[type="file"]:not([data-testid="file-input"])',
+    );
+    await visibleFileInput.first().setInputFiles(PDF_A);
+
+    // Assert the slot fills within a short window. Without the allIds
+    // fallback the slot stayed on the placeholder for 4+ seconds in manual
+    // testing because the SET_SELECTED_FILES dispatch lagged the ADD_FILES
+    // dispatch by many renders.
+    await expect(baseSlot).toHaveAttribute("data-slot-state", "filled", {
+      timeout: 2000,
+    });
+    await expect(baseSlot).toHaveAttribute(
+      "data-slot-filename",
+      "compare_sample_a.pdf",
+    );
+  });
+
+  test("uploading a PDF via the Original add button fills the Original slot", async ({
+    page,
+  }) => {
+    await navigateToCompare(page);
+
+    const baseSlot = page.locator('[data-testid="compare-slot-base"]');
+    const comparisonSlot = page.locator(
+      '[data-testid="compare-slot-comparison"]',
+    );
+
+    await expect(baseSlot).toHaveAttribute("data-slot-state", "empty");
+    await expect(comparisonSlot).toHaveAttribute("data-slot-state", "empty");
+
+    await uploadIntoSlot(page, "base", PDF_A, "compare_sample_a.pdf");
+
+    await expect(comparisonSlot).toHaveAttribute("data-slot-state", "empty");
+  });
+
+  test("uploading into both slots fills them and enables the Compare button", async ({
+    page,
+  }) => {
+    await navigateToCompare(page);
+
+    // Original slot first
+    await uploadIntoSlot(page, "base", PDF_A, "compare_sample_a.pdf");
+
+    // Edited slot second. This upload goes through handleFileUpload, which
+    // adds via the internal selectFiles: true path (union with existing
+    // selection). If the union breaks — as it did in FilesModalContext before
+    // the fix to handleRecentFileSelect — the Original slot would be clobbered
+    // and the Edited slot would remain empty.
+    await uploadIntoSlot(page, "comparison", PDF_B, "compare_sample_b.pdf");
+
+    // Both slots must remain populated with their respective files.
+    const baseSlot = page.locator('[data-testid="compare-slot-base"]');
+    const comparisonSlot = page.locator(
+      '[data-testid="compare-slot-comparison"]',
+    );
+    await expect(baseSlot).toHaveAttribute("data-slot-state", "filled");
+    await expect(baseSlot).toHaveAttribute(
+      "data-slot-filename",
+      "compare_sample_a.pdf",
+    );
+    await expect(comparisonSlot).toHaveAttribute("data-slot-state", "filled");
+    await expect(comparisonSlot).toHaveAttribute(
+      "data-slot-filename",
+      "compare_sample_b.pdf",
+    );
+
+    // Compare button should be enabled now that both slots are set.
+    const compareButton = page.getByRole("button", { name: "Compare" });
+    await expect(compareButton).toBeEnabled();
+  });
+
+  test("picking a stored file from the recent-files modal unions it with the current selection", async ({
+    page,
+  }) => {
+    // This test specifically guards the handleRecentFileSelect code path in
+    // FilesModalContext. Setup:
+    //   1. Upload PDF_A so it lands in IndexedDB storage.
+    //   2. Reload the page — workbench resets but IndexedDB persists.
+    //   3. Upload PDF_B fresh so only PDF_B is in the workbench and selected.
+    //   4. Open the Files modal and pick PDF_A from "Recent".
+    // Without the fix, step 4 REPLACES the selection with [PDF_A] and the
+    // Compare Original slot jumps to PDF_A while Edited stays empty. With the
+    // fix, the selection becomes [PDF_B, PDF_A] and both slots populate.
+
+    // Step 1 — upload PDF_A so it's persisted in IndexedDB.
+    await navigateToCompare(page);
+    await uploadIntoSlot(page, "base", PDF_A, "compare_sample_a.pdf");
+
+    // Step 2 — reload. Workbench clears but IndexedDB retains PDF_A.
+    // page.goto reuses the mocked routes and re-applies bypassOnboarding.
+    await page.goto("/?bypassOnboarding=true");
+    await page.waitForSelector('[data-tour="tool-button-compare"]', {
+      timeout: 10000,
+    });
+    await navigateToCompare(page);
+    await expect(
+      page.locator('[data-testid="compare-slot-base"]'),
+    ).toHaveAttribute("data-slot-state", "empty");
+
+    // Step 3 — upload PDF_B fresh. Now workbench = [PDF_B], IndexedDB = [A, B].
+    await uploadIntoSlot(page, "base", PDF_B, "compare_sample_b.pdf");
+    await expect(
+      page.locator('[data-testid="compare-slot-comparison"]'),
+    ).toHaveAttribute("data-slot-state", "empty");
+
+    // Step 4 — open the modal from the sidebar Files button and pick PDF_A
+    // from the recent list.
+    await page.getByTestId("files-button").click();
+    await page.waitForSelector(".mantine-Modal-overlay", {
+      state: "visible",
+      timeout: 5000,
+    });
+
+    // The recent-files list renders an entry per stored file. Click the
+    // checkbox for PDF_A (NOT the ACTIVE entry for PDF_B). We target the
+    // label text to disambiguate.
+    const pdfARow = page
+      .locator(".mantine-Modal-root")
+      .locator("text=compare_sample_a.pdf")
+      .first();
+    await pdfARow.click();
+
+    // Confirm selection via "Open File".
+    await page.getByRole("button", { name: "Open File" }).click();
+    await page.waitForSelector(".mantine-Modal-overlay", {
+      state: "hidden",
+      timeout: 10000,
+    });
+
+    // Both slots must be populated. Specifically, the Original slot must still
+    // be PDF_B (the pre-existing selection, not clobbered) and the Edited slot
+    // must be PDF_A (newly unioned in).
+    const baseSlot = page.locator('[data-testid="compare-slot-base"]');
+    const comparisonSlot = page.locator(
+      '[data-testid="compare-slot-comparison"]',
+    );
+    await expect(baseSlot).toHaveAttribute("data-slot-state", "filled", {
+      timeout: 10000,
+    });
+    await expect(comparisonSlot).toHaveAttribute("data-slot-state", "filled", {
+      timeout: 10000,
+    });
+
+    const compareButton = page.getByRole("button", { name: "Compare" });
+    await expect(compareButton).toBeEnabled();
+  });
+
+  test("Clear selected empties both slots, clears the selection banner, and removes files from the workbench", async ({
+    page,
+  }) => {
+    await navigateToCompare(page);
+    await uploadIntoSlot(page, "base", PDF_A, "compare_sample_a.pdf");
+    await uploadIntoSlot(page, "comparison", PDF_B, "compare_sample_b.pdf");
+
+    // Sanity: both slots filled before the clear.
+    await expect(
+      page.locator('[data-testid="compare-slot-base"]'),
+    ).toHaveAttribute("data-slot-state", "filled");
+    await expect(
+      page.locator('[data-testid="compare-slot-comparison"]'),
+    ).toHaveAttribute("data-slot-state", "filled");
+
+    // Open the Clear confirmation modal and confirm.
+    await page.getByRole("button", { name: "Clear selected" }).click();
+    await page.getByRole("button", { name: "Clear and return" }).click();
+
+    // The tool re-mounts on workbench switch; wait for the empty-state base slot.
+    await page.waitForSelector(
+      '[data-testid="compare-slot-base"][data-slot-state="empty"]',
+      { timeout: 10000 },
+    );
+    await expect(
+      page.locator('[data-testid="compare-slot-comparison"]'),
+    ).toHaveAttribute("data-slot-state", "empty");
+
+    // The "N files selected" / "Selected: X" banner must be gone because the
+    // files have been removed from the workbench.
+    await expect(
+      page.getByText(/\d+\s+files?\s+selected|Selected:\s+/i),
+    ).toHaveCount(0);
+  });
+});
diff --git a/frontend/src/core/tests/convert/ConvertE2E.spec.ts b/frontend/src/core/tests/convert/ConvertE2E.spec.ts
index 0fe33854db..c41bb9fb9d 100644
--- a/frontend/src/core/tests/convert/ConvertE2E.spec.ts
+++ b/frontend/src/core/tests/convert/ConvertE2E.spec.ts
@@ -5,23 +5,40 @@
  * The Vite dev server must be running (handled by playwright.config.ts webServer).
  */
 
-import { test, expect, type Page } from '@playwright/test';
-import path from 'path';
+import { test, expect, type Page } from "@playwright/test";
+import path from "path";
 
-const FIXTURES_DIR = path.join(__dirname, '../test-fixtures');
-const SAMPLE_PDF = path.join(FIXTURES_DIR, 'sample.pdf');
+const FIXTURES_DIR = path.join(__dirname, "../test-fixtures");
+const SAMPLE_PDF = path.join(FIXTURES_DIR, "sample.pdf");
 
 // ---------------------------------------------------------------------------
 // Endpoint availability map — all conversion endpoints enabled
 // ---------------------------------------------------------------------------
 const MOCK_ENDPOINTS_AVAILABILITY = Object.fromEntries(
   [
-    'pdf-to-img', 'img-to-pdf', 'pdf-to-word', 'file-to-pdf', 'pdf-to-text',
-    'pdf-to-html', 'pdf-to-xml', 'pdf-to-csv', 'pdf-to-xlsx', 'pdf-to-pdfa',
-    'pdf-to-pdfx', 'pdf-to-presentation', 'pdf-to-markdown', 'pdf-to-cbz',
-    'pdf-to-cbr', 'pdf-to-epub', 'html-to-pdf', 'svg-to-pdf', 'markdown-to-pdf',
-    'eml-to-pdf', 'cbz-to-pdf', 'cbr-to-pdf',
-  ].map((k) => [k, { enabled: true }])
+    "pdf-to-img",
+    "img-to-pdf",
+    "pdf-to-word",
+    "file-to-pdf",
+    "pdf-to-text",
+    "pdf-to-html",
+    "pdf-to-xml",
+    "pdf-to-csv",
+    "pdf-to-xlsx",
+    "pdf-to-pdfa",
+    "pdf-to-pdfx",
+    "pdf-to-presentation",
+    "pdf-to-markdown",
+    "pdf-to-cbz",
+    "pdf-to-cbr",
+    "pdf-to-epub",
+    "html-to-pdf",
+    "svg-to-pdf",
+    "markdown-to-pdf",
+    "eml-to-pdf",
+    "cbz-to-pdf",
+    "cbr-to-pdf",
+  ].map((k) => [k, { enabled: true }]),
 );
 
 // ---------------------------------------------------------------------------
@@ -29,47 +46,56 @@ const MOCK_ENDPOINTS_AVAILABILITY = Object.fromEntries(
 // ---------------------------------------------------------------------------
 async function mockAppApis(page: Page) {
   // Backend probe — must return UP so Landing shows app in anonymous mode
-  await page.route('**/api/v1/info/status', (route) =>
-    route.fulfill({ json: { status: 'UP' } })
+  await page.route("**/api/v1/info/status", (route) =>
+    route.fulfill({ json: { status: "UP" } }),
   );
 
   // App config — enableLogin:false puts the app in anonymous mode
-  await page.route('**/api/v1/config/app-config', (route) =>
+  await page.route("**/api/v1/config/app-config", (route) =>
     route.fulfill({
-      json: { enableLogin: false, languages: ['en-GB'], defaultLocale: 'en-GB' },
-    })
+      json: {
+        enableLogin: false,
+        languages: ["en-GB"],
+        defaultLocale: "en-GB",
+      },
+    }),
   );
 
   // Auth — fallback if anything calls auth/me
-  await page.route('**/api/v1/auth/me', (route) =>
+  await page.route("**/api/v1/auth/me", (route) =>
     route.fulfill({
-      json: { id: 1, username: 'testuser', email: 'test@example.com', roles: ['ROLE_USER'] },
-    })
+      json: {
+        id: 1,
+        username: "testuser",
+        email: "test@example.com",
+        roles: ["ROLE_USER"],
+      },
+    }),
   );
 
   // Endpoint availability — queried by ConvertSettings
-  await page.route('**/api/v1/config/endpoints-availability', (route) =>
-    route.fulfill({ json: MOCK_ENDPOINTS_AVAILABILITY })
+  await page.route("**/api/v1/config/endpoints-availability", (route) =>
+    route.fulfill({ json: MOCK_ENDPOINTS_AVAILABILITY }),
   );
 
   // Single-endpoint check — queried by Convert.tsx for the execute button
-  await page.route('**/api/v1/config/endpoint-enabled*', (route) =>
-    route.fulfill({ json: true })
+  await page.route("**/api/v1/config/endpoint-enabled*", (route) =>
+    route.fulfill({ json: true }),
   );
 
   // Group-enabled check
-  await page.route('**/api/v1/config/group-enabled*', (route) =>
-    route.fulfill({ json: true })
+  await page.route("**/api/v1/config/group-enabled*", (route) =>
+    route.fulfill({ json: true }),
   );
 
   // Footer info — non-critical
-  await page.route('**/api/v1/ui-data/footer-info', (route) =>
-    route.fulfill({ json: {} })
+  await page.route("**/api/v1/ui-data/footer-info", (route) =>
+    route.fulfill({ json: {} }),
   );
 
   // Proprietary endpoints — silence proxy errors in the Vite dev server
-  await page.route('**/api/v1/proprietary/**', (route) =>
-    route.fulfill({ json: {} })
+  await page.route("**/api/v1/proprietary/**", (route) =>
+    route.fulfill({ json: {} }),
   );
 }
 
@@ -79,11 +105,17 @@ async function mockAppApis(page: Page) {
 // onChange handler. Waits for the modal to auto-close after upload.
 // ---------------------------------------------------------------------------
 async function uploadFile(page: Page, filePath: string) {
-  await page.getByTestId('files-button').click();
-  await page.waitForSelector('.mantine-Modal-overlay', { state: 'visible', timeout: 5000 });
+  await page.getByTestId("files-button").click();
+  await page.waitForSelector(".mantine-Modal-overlay", {
+    state: "visible",
+    timeout: 5000,
+  });
   await page.locator('[data-testid="file-input"]').setInputFiles(filePath);
   // Modal auto-closes after file is selected
-  await page.waitForSelector('.mantine-Modal-overlay', { state: 'hidden', timeout: 10000 });
+  await page.waitForSelector(".mantine-Modal-overlay", {
+    state: "hidden",
+    timeout: 10000,
+  });
 }
 
 // ---------------------------------------------------------------------------
@@ -93,7 +125,9 @@ async function uploadFile(page: Page, filePath: string) {
 // ---------------------------------------------------------------------------
 async function navigateToConvert(page: Page) {
   await page.locator('[data-tour="tool-button-convert"]').click();
-  await page.waitForSelector('[data-testid="convert-from-dropdown"]', { timeout: 5000 });
+  await page.waitForSelector('[data-testid="convert-from-dropdown"]', {
+    timeout: 5000,
+  });
 }
 
 // ---------------------------------------------------------------------------
@@ -102,83 +136,102 @@ async function navigateToConvert(page: Page) {
 // Opening the TO dropdown renders format-option-{value} buttons in a portal.
 // ---------------------------------------------------------------------------
 async function selectToFormat(page: Page, toValue: string) {
-  await page.getByTestId('convert-to-dropdown').click();
+  await page.getByTestId("convert-to-dropdown").click();
   await page.getByTestId(`format-option-${toValue}`).click();
 }
 
 // ---------------------------------------------------------------------------
 // Tests
 // ---------------------------------------------------------------------------
-test.describe('Convert Tool', () => {
+test.describe("Convert Tool", () => {
   test.beforeEach(async ({ page }) => {
     await mockAppApis(page);
-    await page.goto('/?bypassOnboarding=true');
-    await page.waitForSelector('[data-testid="files-button"]', { timeout: 10000 });
+    await page.goto("/?bypassOnboarding=true");
+    await page.waitForSelector('[data-testid="files-button"]', {
+      timeout: 10000,
+    });
   });
 
-  test('convert button is disabled before a TO format is selected', async ({ page }) => {
+  test("convert button is disabled before a TO format is selected", async ({
+    page,
+  }) => {
     await uploadFile(page, SAMPLE_PDF);
     await navigateToConvert(page);
 
     // FROM is auto-detected as PDF; TO not selected → button visible but disabled
-    const convertBtn = page.getByTestId('convert-button');
+    const convertBtn = page.getByTestId("convert-button");
     await expect(convertBtn).toBeVisible({ timeout: 3000 });
     await expect(convertBtn).toBeDisabled();
   });
 
-  test('successful PDF to PNG conversion shows download option', async ({ page }) => {
+  test("successful PDF to PNG conversion shows download option", async ({
+    page,
+  }) => {
     // Minimal valid PNG header (8 bytes signature + padding)
     const fakePng = Buffer.from([
-      0x89, 0x50, 0x4e, 0x47, 0x0d, 0x0a, 0x1a, 0x0a,
+      0x89,
+      0x50,
+      0x4e,
+      0x47,
+      0x0d,
+      0x0a,
+      0x1a,
+      0x0a,
       ...Array(504).fill(0),
     ]);
 
-    await page.route('**/api/v1/convert/pdf/img', (route) =>
+    await page.route("**/api/v1/convert/pdf/img", (route) =>
       route.fulfill({
         status: 200,
-        contentType: 'image/png',
-        headers: { 'Content-Disposition': 'attachment; filename="sample.png"' },
+        contentType: "image/png",
+        headers: { "Content-Disposition": 'attachment; filename="sample.png"' },
         body: fakePng,
-      })
+      }),
     );
 
     await uploadFile(page, SAMPLE_PDF);
     await navigateToConvert(page);
-    await selectToFormat(page, 'png');
-    await page.getByTestId('convert-button').click();
+    await selectToFormat(page, "png");
+    await page.getByTestId("convert-button").click();
 
-    await expect(page.getByTestId('download-result-button')).toBeVisible({ timeout: 10000 });
+    await expect(page.getByTestId("download-result-button")).toBeVisible({
+      timeout: 10000,
+    });
   });
 
-  test('conversion API error shows error notification', async ({ page }) => {
-    await page.route('**/api/v1/convert/pdf/img', (route) =>
+  test("conversion API error shows error notification", async ({ page }) => {
+    await page.route("**/api/v1/convert/pdf/img", (route) =>
       route.fulfill({
         status: 500,
-        contentType: 'text/plain',
-        body: 'Internal server error: conversion failed',
-      })
+        contentType: "text/plain",
+        body: "Internal server error: conversion failed",
+      }),
     );
 
     await uploadFile(page, SAMPLE_PDF);
     await navigateToConvert(page);
-    await selectToFormat(page, 'png');
-    await page.getByTestId('convert-button').click();
+    await selectToFormat(page, "png");
+    await page.getByTestId("convert-button").click();
 
     // Mantine Notification renders as role="alert"
-    await expect(page.getByRole('alert').first()).toBeVisible({ timeout: 5000 });
+    await expect(page.getByRole("alert").first()).toBeVisible({
+      timeout: 5000,
+    });
   });
 
-  test('convert button becomes enabled after selecting a valid TO format', async ({ page }) => {
+  test("convert button becomes enabled after selecting a valid TO format", async ({
+    page,
+  }) => {
     await uploadFile(page, SAMPLE_PDF);
     await navigateToConvert(page);
 
     // Before selecting TO format — button visible but disabled
-    const convertBtn = page.getByTestId('convert-button');
+    const convertBtn = page.getByTestId("convert-button");
     await expect(convertBtn).toBeVisible({ timeout: 3000 });
     await expect(convertBtn).toBeDisabled();
 
     // After selecting PNG as TO format — button enabled
-    await selectToFormat(page, 'png');
+    await selectToFormat(page, "png");
     await expect(convertBtn).toBeEnabled({ timeout: 3000 });
   });
 });
diff --git a/frontend/src/core/tests/convert/ConvertIntegration.test.tsx b/frontend/src/core/tests/convert/ConvertIntegration.test.tsx
index 7b768ed87a..9ac5b7c282 100644
--- a/frontend/src/core/tests/convert/ConvertIntegration.test.tsx
+++ b/frontend/src/core/tests/convert/ConvertIntegration.test.tsx
@@ -9,36 +9,44 @@
  * 5. FileContext integration works correctly
  */
 
-import React from 'react';
-import { describe, test, expect, vi, beforeEach, afterEach, Mock } from 'vitest';
-import { renderHook, act } from '@testing-library/react';
-import { useConvertOperation } from '@app/hooks/tools/convert/useConvertOperation';
-import { ConvertParameters } from '@app/hooks/tools/convert/useConvertParameters';
-import { FileContextProvider } from '@app/contexts/FileContext';
-import { NavigationProvider } from '@app/contexts/NavigationContext';
-import { ToolRegistryProvider } from '@app/contexts/ToolRegistryProvider';
-import { PreferencesProvider } from '@app/contexts/PreferencesContext';
-import { I18nextProvider } from 'react-i18next';
-import i18n from '@app/i18n/config';
-import { createTestStirlingFile } from '@app/tests/utils/testFileHelpers';
-import { StirlingFile } from '@app/types/fileContext';
-import { MantineProvider } from '@mantine/core';
+import React from "react";
+import {
+  describe,
+  test,
+  expect,
+  vi,
+  beforeEach,
+  afterEach,
+  Mock,
+} from "vitest";
+import { renderHook, act } from "@testing-library/react";
+import { useConvertOperation } from "@app/hooks/tools/convert/useConvertOperation";
+import { ConvertParameters } from "@app/hooks/tools/convert/useConvertParameters";
+import { FileContextProvider } from "@app/contexts/FileContext";
+import { NavigationProvider } from "@app/contexts/NavigationContext";
+import { ToolRegistryProvider } from "@app/contexts/ToolRegistryProvider";
+import { PreferencesProvider } from "@app/contexts/PreferencesContext";
+import { I18nextProvider } from "react-i18next";
+import i18n from "@app/i18n/config";
+import { createTestStirlingFile } from "@app/tests/utils/testFileHelpers";
+import { StirlingFile } from "@app/types/fileContext";
+import { MantineProvider } from "@mantine/core";
 
 // Mock axios (for static methods like CancelToken, isCancel)
-vi.mock('axios', () => ({
+vi.mock("axios", () => ({
   default: {
     CancelToken: {
       source: vi.fn(() => ({
-        token: 'mock-cancel-token',
-        cancel: vi.fn()
-      }))
+        token: "mock-cancel-token",
+        cancel: vi.fn(),
+      })),
     },
     isCancel: vi.fn(() => false),
-  }
+  },
 }));
 
 // Mock our apiClient service
-vi.mock('../../services/apiClient', () => ({
+vi.mock("../../services/apiClient", () => ({
   default: {
     post: vi.fn(),
     get: vi.fn(),
@@ -46,18 +54,18 @@ vi.mock('../../services/apiClient', () => ({
     delete: vi.fn(),
     interceptors: {
       response: {
-        use: vi.fn()
-      }
-    }
-  }
+        use: vi.fn(),
+      },
+    },
+  },
 }));
 
 // Import the mocked apiClient
-import apiClient from '@app/services/apiClient';
+import apiClient from "@app/services/apiClient";
 const mockedApiClient = vi.mocked(apiClient);
 
 // Mock only essential services that are actually called by the tests
-vi.mock('../../services/fileStorage', () => ({
+vi.mock("../../services/fileStorage", () => ({
   fileStorage: {
     init: vi.fn().mockResolvedValue(undefined),
     storeFile: vi.fn().mockImplementation((file, thumbnail) => {
@@ -67,26 +75,29 @@ vi.mock('../../services/fileStorage', () => ({
         size: file.size,
         type: file.type,
         lastModified: file.lastModified,
-        thumbnail: thumbnail
+        thumbnail: thumbnail,
       });
     }),
     getAllFileMetadata: vi.fn().mockResolvedValue([]),
-    cleanup: vi.fn().mockResolvedValue(undefined)
-  }
+    cleanup: vi.fn().mockResolvedValue(undefined),
+  },
 }));
 
-vi.mock('../../services/thumbnailGenerationService', () => ({
+vi.mock("../../services/thumbnailGenerationService", () => ({
   thumbnailGenerationService: {
-    generateThumbnail: vi.fn().mockResolvedValue('data:image/png;base64,fake-thumbnail'),
+    generateThumbnail: vi
+      .fn()
+      .mockResolvedValue("data:image/png;base64,fake-thumbnail"),
     cleanup: vi.fn(),
-    destroy: vi.fn()
-  }
+    destroy: vi.fn(),
+  },
 }));
 
 // Create realistic test files
 const createPDFFile = (): StirlingFile => {
-  const pdfContent = '%PDF-1.4\n1 0 obj\n<<\n/Type /Catalog\n/Pages 2 0 R\n>>\nendobj\ntrailer\n<<\n/Size 2\n/Root 1 0 R\n>>\nstartxref\n0\n%%EOF';
-  return createTestStirlingFile('test.pdf', pdfContent, 'application/pdf');
+  const pdfContent =
+    "%PDF-1.4\n1 0 obj\n<<\n/Type /Catalog\n/Pages 2 0 R\n>>\nendobj\ntrailer\n<<\n/Size 2\n/Root 1 0 R\n>>\nstartxref\n0\n%%EOF";
+  return createTestStirlingFile("test.pdf", pdfContent, "application/pdf");
 };
 
 // Test wrapper component
@@ -96,9 +107,7 @@ const TestWrapper: React.FC<{ children: React.ReactNode }> = ({ children }) => (
       <PreferencesProvider>
         <ToolRegistryProvider>
           <NavigationProvider>
-            <FileContextProvider>
-              {children}
-            </FileContextProvider>
+            <FileContextProvider>{children}</FileContextProvider>
           </NavigationProvider>
         </ToolRegistryProvider>
       </PreferencesProvider>
@@ -106,8 +115,7 @@ const TestWrapper: React.FC<{ children: React.ReactNode }> = ({ children }) => (
   </MantineProvider>
 );
 
-describe('Convert Tool Integration Tests', () => {
-
+describe("Convert Tool Integration Tests", () => {
   beforeEach(() => {
     vi.clearAllMocks();
     // Setup default apiClient mock
@@ -118,62 +126,61 @@ describe('Convert Tool Integration Tests', () => {
     vi.restoreAllMocks();
   });
 
-  describe('useConvertOperation Integration', () => {
-
-    test('should make correct API call for PDF to PNG conversion', async () => {
-      const mockBlob = new Blob(['fake-image-data'], { type: 'image/png' });
+  describe("useConvertOperation Integration", () => {
+    test("should make correct API call for PDF to PNG conversion", async () => {
+      const mockBlob = new Blob(["fake-image-data"], { type: "image/png" });
       (mockedApiClient.post as Mock).mockResolvedValueOnce({
         data: mockBlob,
         status: 200,
-        statusText: 'OK'
+        statusText: "OK",
       });
 
       const { result } = renderHook(() => useConvertOperation(), {
-        wrapper: TestWrapper
+        wrapper: TestWrapper,
       });
 
       const testFile = createPDFFile();
       const parameters: ConvertParameters = {
-        fromExtension: 'pdf',
-        toExtension: 'png',
+        fromExtension: "pdf",
+        toExtension: "png",
         imageOptions: {
-          colorType: 'color',
+          colorType: "color",
           dpi: 300,
-          singleOrMultiple: 'multiple',
-          fitOption: 'maintainAspectRatio',
+          singleOrMultiple: "multiple",
+          fitOption: "maintainAspectRatio",
           autoRotate: true,
-          combineImages: true
+          combineImages: true,
         },
         isSmartDetection: false,
-        smartDetectionType: 'none',
+        smartDetectionType: "none",
         htmlOptions: {
-          zoomLevel: 0
+          zoomLevel: 0,
         },
         emailOptions: {
           includeAttachments: false,
           maxAttachmentSizeMB: 0,
           downloadHtml: false,
-          includeAllRecipients: false
+          includeAllRecipients: false,
         },
         pdfaOptions: {
-          outputFormat: '',
-          strict: false
+          outputFormat: "",
+          strict: false,
         },
         pdfxOptions: {
-          outputFormat: 'pdfx'
+          outputFormat: "pdfx",
         },
         cbrOptions: {
-          optimizeForEbook: false
+          optimizeForEbook: false,
         },
         pdfToCbrOptions: {
-          dpi: 150
+          dpi: 150,
         },
         cbzOptions: {
-          optimizeForEbook: false
+          optimizeForEbook: false,
         },
         cbzOutputOptions: {
-          dpi: 150
-        }
+          dpi: 150,
+        },
       };
 
       await act(async () => {
@@ -182,81 +189,88 @@ describe('Convert Tool Integration Tests', () => {
 
       // Verify axios was called with correct parameters
       expect(mockedApiClient.post).toHaveBeenCalledWith(
-        '/api/v1/convert/pdf/img',
+        "/api/v1/convert/pdf/img",
         expect.any(FormData),
-        { responseType: 'blob' }
+        {
+          responseType: "blob",
+        },
       );
 
       // Verify FormData contains correct parameters
-      const formDataCall = (mockedApiClient.post as Mock).mock.calls[0][1] as FormData;
-      expect(formDataCall.get('imageFormat')).toBe('png');
-      expect(formDataCall.get('colorType')).toBe('color');
-      expect(formDataCall.get('dpi')).toBe('300');
-      expect(formDataCall.get('singleOrMultiple')).toBe('multiple');
+      const formDataCall = (mockedApiClient.post as Mock).mock
+        .calls[0][1] as FormData;
+      expect(formDataCall.get("imageFormat")).toBe("png");
+      expect(formDataCall.get("colorType")).toBe("color");
+      expect(formDataCall.get("dpi")).toBe("300");
+      expect(formDataCall.get("singleOrMultiple")).toBe("multiple");
 
       // Verify hook state updates
       expect(result.current.downloadUrl).toBeTruthy();
-      expect(result.current.downloadFilename).toBe('test.png');
+      expect(result.current.downloadFilename).toBe("test.png");
       expect(result.current.isLoading).toBe(false);
       expect(result.current.errorMessage).toBe(null);
     });
 
-    test('should handle API error responses correctly', async () => {
-      const errorMessage = 'Invalid file format';
+    test("should handle API error responses correctly", async () => {
+      const errorMessage = "Invalid file format";
       (mockedApiClient.post as Mock).mockRejectedValueOnce({
         response: {
           status: 400,
-          data: errorMessage
+          data: errorMessage,
         },
-        message: errorMessage
+        message: errorMessage,
       });
 
       const { result } = renderHook(() => useConvertOperation(), {
-        wrapper: TestWrapper
+        wrapper: TestWrapper,
       });
 
-      const testFile = createTestStirlingFile('invalid.txt', 'not a pdf', 'text/plain');
+      const testFile = createTestStirlingFile(
+        "invalid.txt",
+        "not a pdf",
+        "text/plain",
+      );
       const parameters: ConvertParameters = {
-        fromExtension: 'pdf',
-        toExtension: 'png',
+        fromExtension: "pdf",
+        toExtension: "png",
         imageOptions: {
-          colorType: 'color',
+          colorType: "color",
           dpi: 300,
-          singleOrMultiple: 'multiple',
-          fitOption: 'maintainAspectRatio',
+          singleOrMultiple: "multiple",
+          fitOption: "maintainAspectRatio",
           autoRotate: true,
-          combineImages: true
+          combineImages: true,
         },
         isSmartDetection: false,
-        smartDetectionType: 'none',
+        smartDetectionType: "none",
         htmlOptions: {
-          zoomLevel: 0
+          zoomLevel: 0,
         },
         emailOptions: {
           includeAttachments: false,
           maxAttachmentSizeMB: 0,
           downloadHtml: false,
-          includeAllRecipients: false
+          includeAllRecipients: false,
         },
         pdfaOptions: {
-          outputFormat: '',
-          strict: false
+          outputFormat: "",
+          strict: false,
         },
         pdfxOptions: {
-          outputFormat: 'pdfx'
+          outputFormat: "pdfx",
         },
         cbrOptions: {
-          optimizeForEbook: false
+          optimizeForEbook: false,
         },
         pdfToCbrOptions: {
-          dpi: 150
+          dpi: 150,
         },
         cbzOptions: {
-          optimizeForEbook: false
+          optimizeForEbook: false,
         },
         cbzOutputOptions: {
-          dpi: 150
-        }
+          dpi: 150,
+        },
       };
 
       await act(async () => {
@@ -269,125 +283,126 @@ describe('Convert Tool Integration Tests', () => {
       expect(result.current.downloadUrl).toBe(null);
     });
 
-    test('should handle network errors gracefully', async () => {
-      (mockedApiClient.post as Mock).mockRejectedValueOnce(new Error('Network error'));
+    test("should handle network errors gracefully", async () => {
+      (mockedApiClient.post as Mock).mockRejectedValueOnce(
+        new Error("Network error"),
+      );
 
       const { result } = renderHook(() => useConvertOperation(), {
-        wrapper: TestWrapper
+        wrapper: TestWrapper,
       });
 
       const testFile = createPDFFile();
       const parameters: ConvertParameters = {
-        fromExtension: 'pdf',
-        toExtension: 'png',
+        fromExtension: "pdf",
+        toExtension: "png",
         imageOptions: {
-          colorType: 'color',
+          colorType: "color",
           dpi: 300,
-          singleOrMultiple: 'multiple',
-          fitOption: 'maintainAspectRatio',
+          singleOrMultiple: "multiple",
+          fitOption: "maintainAspectRatio",
           autoRotate: true,
-          combineImages: true
+          combineImages: true,
         },
         isSmartDetection: false,
-        smartDetectionType: 'none',
+        smartDetectionType: "none",
         htmlOptions: {
-          zoomLevel: 0
+          zoomLevel: 0,
         },
         emailOptions: {
           includeAttachments: false,
           maxAttachmentSizeMB: 0,
           downloadHtml: false,
-          includeAllRecipients: false
+          includeAllRecipients: false,
         },
         pdfaOptions: {
-          outputFormat: '',
-          strict: false
+          outputFormat: "",
+          strict: false,
         },
         pdfxOptions: {
-          outputFormat: 'pdfx'
+          outputFormat: "pdfx",
         },
         cbrOptions: {
-          optimizeForEbook: false
+          optimizeForEbook: false,
         },
         pdfToCbrOptions: {
-          dpi: 150
+          dpi: 150,
         },
         cbzOptions: {
-          optimizeForEbook: false
+          optimizeForEbook: false,
         },
         cbzOutputOptions: {
-          dpi: 150
-        }
+          dpi: 150,
+        },
       };
 
       await act(async () => {
         await result.current.executeOperation(parameters, [testFile]);
       });
 
-      expect(result.current.errorMessage).toBe('Network error');
+      expect(result.current.errorMessage).toBe("Network error");
       expect(result.current.isLoading).toBe(false);
     });
   });
 
-  describe('API and Hook Integration', () => {
-
-    test('should correctly map image conversion parameters to API call', async () => {
-      const mockBlob = new Blob(['fake-data'], { type: 'image/jpeg' });
+  describe("API and Hook Integration", () => {
+    test("should correctly map image conversion parameters to API call", async () => {
+      const mockBlob = new Blob(["fake-data"], { type: "image/jpeg" });
       (mockedApiClient.post as Mock).mockResolvedValueOnce({
         data: mockBlob,
         status: 200,
         headers: {
-          'content-type': 'image/jpeg',
-          'content-disposition': 'attachment; filename="test_converted.jpg"'
-        }
+          "content-type": "image/jpeg",
+          "content-disposition": 'attachment; filename="test_converted.jpg"',
+        },
       });
 
       const { result } = renderHook(() => useConvertOperation(), {
-        wrapper: TestWrapper
+        wrapper: TestWrapper,
       });
 
       const testFile = createPDFFile();
       const parameters: ConvertParameters = {
-        fromExtension: 'pdf',
-        toExtension: 'jpg',
+        fromExtension: "pdf",
+        toExtension: "jpg",
         imageOptions: {
-          colorType: 'grayscale',
+          colorType: "grayscale",
           dpi: 150,
-          singleOrMultiple: 'single',
-          fitOption: 'maintainAspectRatio',
+          singleOrMultiple: "single",
+          fitOption: "maintainAspectRatio",
           autoRotate: true,
-          combineImages: true
+          combineImages: true,
         },
         isSmartDetection: false,
-        smartDetectionType: 'none',
+        smartDetectionType: "none",
         htmlOptions: {
-          zoomLevel: 0
+          zoomLevel: 0,
         },
         emailOptions: {
           includeAttachments: false,
           maxAttachmentSizeMB: 0,
           downloadHtml: false,
-          includeAllRecipients: false
+          includeAllRecipients: false,
         },
         pdfaOptions: {
-          outputFormat: '',
-          strict: false
+          outputFormat: "",
+          strict: false,
         },
         pdfxOptions: {
-          outputFormat: 'pdfx'
+          outputFormat: "pdfx",
         },
         cbrOptions: {
-          optimizeForEbook: false
+          optimizeForEbook: false,
         },
         pdfToCbrOptions: {
-          dpi: 150
+          dpi: 150,
         },
         cbzOptions: {
-          optimizeForEbook: false
+          optimizeForEbook: false,
         },
         cbzOutputOptions: {
-          dpi: 150
-        }
+          dpi: 150,
+        },
       };
 
       await act(async () => {
@@ -395,73 +410,74 @@ describe('Convert Tool Integration Tests', () => {
       });
 
       // Verify integration: hook parameters → FormData → axios call → hook state
-      const formDataCall = (mockedApiClient.post as Mock).mock.calls[0][1] as FormData;
-      expect(formDataCall.get('imageFormat')).toBe('jpg');
-      expect(formDataCall.get('colorType')).toBe('grayscale');
-      expect(formDataCall.get('dpi')).toBe('150');
-      expect(formDataCall.get('singleOrMultiple')).toBe('single');
+      const formDataCall = (mockedApiClient.post as Mock).mock
+        .calls[0][1] as FormData;
+      expect(formDataCall.get("imageFormat")).toBe("jpg");
+      expect(formDataCall.get("colorType")).toBe("grayscale");
+      expect(formDataCall.get("dpi")).toBe("150");
+      expect(formDataCall.get("singleOrMultiple")).toBe("single");
 
       // Verify complete workflow: API response → hook state → FileContext integration
       expect(result.current.downloadUrl).toBeTruthy();
       expect(result.current.files).toHaveLength(1);
-      expect(result.current.files[0].name).toBe('test_converted.jpg');
+      expect(result.current.files[0].name).toBe("test_converted.jpg");
       expect(result.current.isLoading).toBe(false);
     });
 
-    test('should make correct API call for PDF to CSV conversion with simplified workflow', async () => {
-      const mockBlob = new Blob(['fake-csv-data'], { type: 'text/csv' });
+    test("should make correct API call for PDF to CSV conversion with simplified workflow", async () => {
+      const mockBlob = new Blob(["fake-csv-data"], { type: "text/csv" });
       (mockedApiClient.post as Mock).mockResolvedValueOnce({
         data: mockBlob,
         status: 200,
-        statusText: 'OK'
+        statusText: "OK",
       });
 
       const { result } = renderHook(() => useConvertOperation(), {
-        wrapper: TestWrapper
+        wrapper: TestWrapper,
       });
 
       const testFile = createPDFFile();
       const parameters: ConvertParameters = {
-        fromExtension: 'pdf',
-        toExtension: 'csv',
+        fromExtension: "pdf",
+        toExtension: "csv",
         imageOptions: {
-          colorType: 'color',
+          colorType: "color",
           dpi: 300,
-          singleOrMultiple: 'multiple',
-          fitOption: 'maintainAspectRatio',
+          singleOrMultiple: "multiple",
+          fitOption: "maintainAspectRatio",
           autoRotate: true,
-          combineImages: true
+          combineImages: true,
         },
         isSmartDetection: false,
-        smartDetectionType: 'none',
+        smartDetectionType: "none",
         htmlOptions: {
-          zoomLevel: 0
+          zoomLevel: 0,
         },
         emailOptions: {
           includeAttachments: false,
           maxAttachmentSizeMB: 0,
           downloadHtml: false,
-          includeAllRecipients: false
+          includeAllRecipients: false,
         },
         pdfaOptions: {
-          outputFormat: '',
-          strict: false
+          outputFormat: "",
+          strict: false,
         },
         pdfxOptions: {
-          outputFormat: 'pdfx'
+          outputFormat: "pdfx",
         },
         cbrOptions: {
-          optimizeForEbook: false
+          optimizeForEbook: false,
         },
         pdfToCbrOptions: {
-          dpi: 150
+          dpi: 150,
         },
         cbzOptions: {
-          optimizeForEbook: false
+          optimizeForEbook: false,
         },
         cbzOutputOptions: {
-          dpi: 150
-        }
+          dpi: 150,
+        },
       };
 
       await act(async () => {
@@ -470,70 +486,73 @@ describe('Convert Tool Integration Tests', () => {
 
       // Verify correct endpoint is called
       expect(mockedApiClient.post).toHaveBeenCalledWith(
-        '/api/v1/convert/pdf/csv',
+        "/api/v1/convert/pdf/csv",
         expect.any(FormData),
-        { responseType: 'blob' }
+        {
+          responseType: "blob",
+        },
       );
 
       // Verify FormData contains correct parameters for simplified CSV conversion
-      const formDataCall = (mockedApiClient.post as Mock).mock.calls[0][1] as FormData;
-      expect(formDataCall.get('pageNumbers')).toBe('all'); // Always "all" for simplified workflow
-      expect(formDataCall.get('fileInput')).toBe(testFile);
+      const formDataCall = (mockedApiClient.post as Mock).mock
+        .calls[0][1] as FormData;
+      expect(formDataCall.get("pageNumbers")).toBe("all"); // Always "all" for simplified workflow
+      expect(formDataCall.get("fileInput")).toBe(testFile);
 
       // Verify hook state updates correctly
       expect(result.current.downloadUrl).toBeTruthy();
-      expect(result.current.downloadFilename).toBe('test.csv');
+      expect(result.current.downloadFilename).toBe("test.csv");
       expect(result.current.isLoading).toBe(false);
       expect(result.current.errorMessage).toBe(null);
     });
 
-    test('should handle complete unsupported conversion workflow', async () => {
+    test("should handle complete unsupported conversion workflow", async () => {
       const { result } = renderHook(() => useConvertOperation(), {
-        wrapper: TestWrapper
+        wrapper: TestWrapper,
       });
 
       const testFile = createPDFFile();
       const parameters: ConvertParameters = {
-        fromExtension: 'pdf',
-        toExtension: 'unsupported',
+        fromExtension: "pdf",
+        toExtension: "unsupported",
         imageOptions: {
-          colorType: 'color',
+          colorType: "color",
           dpi: 300,
-          singleOrMultiple: 'multiple',
-          fitOption: 'maintainAspectRatio',
+          singleOrMultiple: "multiple",
+          fitOption: "maintainAspectRatio",
           autoRotate: true,
-          combineImages: true
+          combineImages: true,
         },
         isSmartDetection: false,
-        smartDetectionType: 'none',
+        smartDetectionType: "none",
         htmlOptions: {
-          zoomLevel: 0
+          zoomLevel: 0,
         },
         emailOptions: {
           includeAttachments: false,
           maxAttachmentSizeMB: 0,
           downloadHtml: false,
-          includeAllRecipients: false
+          includeAllRecipients: false,
         },
         pdfaOptions: {
-          outputFormat: '',
-          strict: false
+          outputFormat: "",
+          strict: false,
         },
         pdfxOptions: {
-          outputFormat: 'pdfx'
+          outputFormat: "pdfx",
         },
         cbrOptions: {
-          optimizeForEbook: false
+          optimizeForEbook: false,
         },
         pdfToCbrOptions: {
-          dpi: 150
+          dpi: 150,
         },
         cbzOptions: {
-          optimizeForEbook: false
+          optimizeForEbook: false,
         },
         cbzOutputOptions: {
-          dpi: 150
-        }
+          dpi: 150,
+        },
       };
 
       await act(async () => {
@@ -542,66 +561,67 @@ describe('Convert Tool Integration Tests', () => {
 
       // Verify integration: utils validation prevents API call, hook shows error
       expect(mockedApiClient.post).not.toHaveBeenCalled();
-      expect(result.current.errorMessage).toContain('Unsupported conversion format');
+      expect(result.current.errorMessage).toContain(
+        "Unsupported conversion format",
+      );
       expect(result.current.isLoading).toBe(false);
       expect(result.current.downloadUrl).toBe(null);
     });
   });
 
-  describe('File Upload Integration', () => {
-
-    test('should handle multiple file uploads correctly', async () => {
-      const mockBlob = new Blob(['zip-content'], { type: 'application/zip' });
+  describe("File Upload Integration", () => {
+    test("should handle multiple file uploads correctly", async () => {
+      const mockBlob = new Blob(["zip-content"], { type: "application/zip" });
       (mockedApiClient.post as Mock).mockResolvedValueOnce({ data: mockBlob });
 
       const { result } = renderHook(() => useConvertOperation(), {
-        wrapper: TestWrapper
+        wrapper: TestWrapper,
       });
       const files = [
         createPDFFile(),
-        createTestStirlingFile('test2.pdf', '%PDF-1.4...', 'application/pdf')
+        createTestStirlingFile("test2.pdf", "%PDF-1.4...", "application/pdf"),
       ];
       const parameters: ConvertParameters = {
-        fromExtension: 'pdf',
-        toExtension: 'png',
+        fromExtension: "pdf",
+        toExtension: "png",
         imageOptions: {
-          colorType: 'color',
+          colorType: "color",
           dpi: 300,
-          singleOrMultiple: 'multiple',
-          fitOption: 'maintainAspectRatio',
+          singleOrMultiple: "multiple",
+          fitOption: "maintainAspectRatio",
           autoRotate: true,
-          combineImages: true
+          combineImages: true,
         },
         isSmartDetection: false,
-        smartDetectionType: 'none',
+        smartDetectionType: "none",
         htmlOptions: {
-          zoomLevel: 0
+          zoomLevel: 0,
         },
         emailOptions: {
           includeAttachments: false,
           maxAttachmentSizeMB: 0,
           downloadHtml: false,
-          includeAllRecipients: false
+          includeAllRecipients: false,
         },
         pdfaOptions: {
-          outputFormat: '',
-          strict: false
+          outputFormat: "",
+          strict: false,
         },
         pdfxOptions: {
-          outputFormat: 'pdfx'
+          outputFormat: "pdfx",
         },
         cbrOptions: {
-          optimizeForEbook: false
+          optimizeForEbook: false,
         },
         pdfToCbrOptions: {
-          dpi: 150
+          dpi: 150,
         },
         cbzOptions: {
-          optimizeForEbook: false
+          optimizeForEbook: false,
         },
         cbzOutputOptions: {
-          dpi: 150
-        }
+          dpi: 150,
+        },
       };
 
       await act(async () => {
@@ -613,60 +633,59 @@ describe('Convert Tool Integration Tests', () => {
 
       for (let i = 0; i < calls.length; i++) {
         const formData = calls[i][1] as FormData;
-        const fileInputs = formData.getAll('fileInput');
+        const fileInputs = formData.getAll("fileInput");
         expect(fileInputs).toHaveLength(1);
         expect(fileInputs[0]).toBeInstanceOf(File);
         expect((fileInputs[0] as File).name).toBe(files[i].name);
       }
-
     });
 
-    test('should handle no files selected', async () => {
+    test("should handle no files selected", async () => {
       const { result } = renderHook(() => useConvertOperation(), {
-        wrapper: TestWrapper
+        wrapper: TestWrapper,
       });
 
       const parameters: ConvertParameters = {
-        fromExtension: 'pdf',
-        toExtension: 'png',
+        fromExtension: "pdf",
+        toExtension: "png",
         imageOptions: {
-          colorType: 'color',
+          colorType: "color",
           dpi: 300,
-          singleOrMultiple: 'multiple',
-          fitOption: 'maintainAspectRatio',
+          singleOrMultiple: "multiple",
+          fitOption: "maintainAspectRatio",
           autoRotate: true,
-          combineImages: true
+          combineImages: true,
         },
         isSmartDetection: false,
-        smartDetectionType: 'none',
+        smartDetectionType: "none",
         htmlOptions: {
-          zoomLevel: 0
+          zoomLevel: 0,
         },
         emailOptions: {
           includeAttachments: false,
           maxAttachmentSizeMB: 0,
           downloadHtml: false,
-          includeAllRecipients: false
+          includeAllRecipients: false,
         },
         pdfaOptions: {
-          outputFormat: '',
-          strict: false
+          outputFormat: "",
+          strict: false,
         },
         pdfxOptions: {
-          outputFormat: 'pdfx'
+          outputFormat: "pdfx",
         },
         cbrOptions: {
-          optimizeForEbook: false
+          optimizeForEbook: false,
         },
         pdfToCbrOptions: {
-          dpi: 150
+          dpi: 150,
         },
         cbzOptions: {
-          optimizeForEbook: false
+          optimizeForEbook: false,
         },
         cbzOutputOptions: {
-          dpi: 150
-        }
+          dpi: 150,
+        },
       };
 
       await act(async () => {
@@ -674,200 +693,202 @@ describe('Convert Tool Integration Tests', () => {
       });
 
       expect(mockedApiClient.post).not.toHaveBeenCalled();
-      expect(result.current.errorMessage).toContain('noFileSelected');
+      expect(result.current.errorMessage).toContain("noFileSelected");
     });
   });
 
-  describe('Error Boundary Integration', () => {
-
-    test('should handle corrupted file gracefully', async () => {
+  describe("Error Boundary Integration", () => {
+    test("should handle corrupted file gracefully", async () => {
       (mockedApiClient.post as Mock).mockRejectedValueOnce({
         response: {
           status: 422,
-          data: 'Processing failed'
-        }
+          data: "Processing failed",
+        },
       });
 
       const { result } = renderHook(() => useConvertOperation(), {
-        wrapper: TestWrapper
+        wrapper: TestWrapper,
       });
 
-      const corruptedFile = createTestStirlingFile('corrupted.pdf', 'not-a-pdf', 'application/pdf');
+      const corruptedFile = createTestStirlingFile(
+        "corrupted.pdf",
+        "not-a-pdf",
+        "application/pdf",
+      );
       const parameters: ConvertParameters = {
-        fromExtension: 'pdf',
-        toExtension: 'png',
+        fromExtension: "pdf",
+        toExtension: "png",
         imageOptions: {
-          colorType: 'color',
+          colorType: "color",
           dpi: 300,
-          singleOrMultiple: 'multiple',
-          fitOption: 'maintainAspectRatio',
+          singleOrMultiple: "multiple",
+          fitOption: "maintainAspectRatio",
           autoRotate: true,
-          combineImages: true
+          combineImages: true,
         },
         isSmartDetection: false,
-        smartDetectionType: 'none',
+        smartDetectionType: "none",
         htmlOptions: {
-          zoomLevel: 0
+          zoomLevel: 0,
         },
         emailOptions: {
           includeAttachments: false,
           maxAttachmentSizeMB: 0,
           downloadHtml: false,
-          includeAllRecipients: false
+          includeAllRecipients: false,
         },
         pdfaOptions: {
-          outputFormat: '',
-          strict: false
+          outputFormat: "",
+          strict: false,
         },
         pdfxOptions: {
-          outputFormat: 'pdfx'
+          outputFormat: "pdfx",
         },
         cbrOptions: {
-          optimizeForEbook: false
+          optimizeForEbook: false,
         },
         pdfToCbrOptions: {
-          dpi: 150
+          dpi: 150,
         },
         cbzOptions: {
-          optimizeForEbook: false
+          optimizeForEbook: false,
         },
         cbzOutputOptions: {
-          dpi: 150
-        }
+          dpi: 150,
+        },
       };
 
       await act(async () => {
         await result.current.executeOperation(parameters, [corruptedFile]);
       });
 
-      expect(result.current.errorMessage).toBe('Processing failed');
+      expect(result.current.errorMessage).toBe("Processing failed");
       expect(result.current.isLoading).toBe(false);
     });
 
-    test('should handle backend service unavailable', async () => {
+    test("should handle backend service unavailable", async () => {
       (mockedApiClient.post as Mock).mockRejectedValueOnce({
         response: {
           status: 503,
-          data: 'Service unavailable'
-        }
+          data: "Service unavailable",
+        },
       });
 
       const { result } = renderHook(() => useConvertOperation(), {
-        wrapper: TestWrapper
+        wrapper: TestWrapper,
       });
 
       const testFile = createPDFFile();
       const parameters: ConvertParameters = {
-        fromExtension: 'pdf',
-        toExtension: 'png',
+        fromExtension: "pdf",
+        toExtension: "png",
         imageOptions: {
-          colorType: 'color',
+          colorType: "color",
           dpi: 300,
-          singleOrMultiple: 'multiple',
-          fitOption: 'maintainAspectRatio',
+          singleOrMultiple: "multiple",
+          fitOption: "maintainAspectRatio",
           autoRotate: true,
-          combineImages: true
+          combineImages: true,
         },
         isSmartDetection: false,
-        smartDetectionType: 'none',
+        smartDetectionType: "none",
         htmlOptions: {
-          zoomLevel: 0
+          zoomLevel: 0,
         },
         emailOptions: {
           includeAttachments: false,
           maxAttachmentSizeMB: 0,
           downloadHtml: false,
-          includeAllRecipients: false
+          includeAllRecipients: false,
         },
         pdfaOptions: {
-          outputFormat: '',
-          strict: false
+          outputFormat: "",
+          strict: false,
         },
         pdfxOptions: {
-          outputFormat: 'pdfx'
+          outputFormat: "pdfx",
         },
         cbrOptions: {
-          optimizeForEbook: false
+          optimizeForEbook: false,
         },
         pdfToCbrOptions: {
-          dpi: 150
+          dpi: 150,
         },
         cbzOptions: {
-          optimizeForEbook: false
+          optimizeForEbook: false,
         },
         cbzOutputOptions: {
-          dpi: 150
-        }
+          dpi: 150,
+        },
       };
 
       await act(async () => {
         await result.current.executeOperation(parameters, [testFile]);
       });
 
-      expect(result.current.errorMessage).toBe('Service unavailable');
+      expect(result.current.errorMessage).toBe("Service unavailable");
       expect(result.current.isLoading).toBe(false);
     });
   });
 
-  describe('FileContext Integration', () => {
-
-    test('should record operation in FileContext', async () => {
-      const mockBlob = new Blob(['fake-data'], { type: 'image/png' });
+  describe("FileContext Integration", () => {
+    test("should record operation in FileContext", async () => {
+      const mockBlob = new Blob(["fake-data"], { type: "image/png" });
       (mockedApiClient.post as Mock).mockResolvedValueOnce({
         data: mockBlob,
         status: 200,
         headers: {
-          'content-type': 'image/png',
-          'content-disposition': 'attachment; filename="test_converted.png"'
-        }
+          "content-type": "image/png",
+          "content-disposition": 'attachment; filename="test_converted.png"',
+        },
       });
 
       const { result } = renderHook(() => useConvertOperation(), {
-        wrapper: TestWrapper
+        wrapper: TestWrapper,
       });
 
       const testFile = createPDFFile();
       const parameters: ConvertParameters = {
-        fromExtension: 'pdf',
-        toExtension: 'png',
+        fromExtension: "pdf",
+        toExtension: "png",
         imageOptions: {
-          colorType: 'color',
+          colorType: "color",
           dpi: 300,
-          singleOrMultiple: 'multiple',
-          fitOption: 'maintainAspectRatio',
+          singleOrMultiple: "multiple",
+          fitOption: "maintainAspectRatio",
           autoRotate: true,
-          combineImages: true
+          combineImages: true,
         },
         isSmartDetection: false,
-        smartDetectionType: 'none',
+        smartDetectionType: "none",
         htmlOptions: {
-          zoomLevel: 0
+          zoomLevel: 0,
         },
         emailOptions: {
           includeAttachments: false,
           maxAttachmentSizeMB: 0,
           downloadHtml: false,
-          includeAllRecipients: false
+          includeAllRecipients: false,
         },
         pdfaOptions: {
-          outputFormat: '',
-          strict: false
+          outputFormat: "",
+          strict: false,
         },
         pdfxOptions: {
-          outputFormat: 'pdfx'
+          outputFormat: "pdfx",
         },
         cbrOptions: {
-          optimizeForEbook: false
+          optimizeForEbook: false,
         },
         pdfToCbrOptions: {
-          dpi: 150
+          dpi: 150,
         },
         cbzOptions: {
-          optimizeForEbook: false
+          optimizeForEbook: false,
         },
         cbzOutputOptions: {
-          dpi: 150
-        }
+          dpi: 150,
+        },
       };
 
       await act(async () => {
@@ -876,67 +897,67 @@ describe('Convert Tool Integration Tests', () => {
 
       // Verify operation was successful and files were processed
       expect(result.current.files).toHaveLength(1);
-      expect(result.current.files[0].name).toBe('test_converted.png');
+      expect(result.current.files[0].name).toBe("test_converted.png");
       expect(result.current.downloadUrl).toBeTruthy();
     });
 
-    test('should clean up blob URLs on reset', async () => {
-      const mockBlob = new Blob(['fake-data'], { type: 'image/png' });
+    test("should clean up blob URLs on reset", async () => {
+      const mockBlob = new Blob(["fake-data"], { type: "image/png" });
       (mockedApiClient.post as Mock).mockResolvedValueOnce({
         data: mockBlob,
         status: 200,
         headers: {
-          'content-type': 'image/png',
-          'content-disposition': 'attachment; filename="test_converted.png"'
-        }
+          "content-type": "image/png",
+          "content-disposition": 'attachment; filename="test_converted.png"',
+        },
       });
 
       const { result } = renderHook(() => useConvertOperation(), {
-        wrapper: TestWrapper
+        wrapper: TestWrapper,
       });
 
       const testFile = createPDFFile();
       const parameters: ConvertParameters = {
-        fromExtension: 'pdf',
-        toExtension: 'png',
+        fromExtension: "pdf",
+        toExtension: "png",
         imageOptions: {
-          colorType: 'color',
+          colorType: "color",
           dpi: 300,
-          singleOrMultiple: 'multiple',
-          fitOption: 'maintainAspectRatio',
+          singleOrMultiple: "multiple",
+          fitOption: "maintainAspectRatio",
           autoRotate: true,
-          combineImages: true
+          combineImages: true,
         },
         isSmartDetection: false,
-        smartDetectionType: 'none',
+        smartDetectionType: "none",
         htmlOptions: {
-          zoomLevel: 0
+          zoomLevel: 0,
         },
         emailOptions: {
           includeAttachments: false,
           maxAttachmentSizeMB: 0,
           downloadHtml: false,
-          includeAllRecipients: false
+          includeAllRecipients: false,
         },
         pdfaOptions: {
-          outputFormat: '',
-          strict: false
+          outputFormat: "",
+          strict: false,
         },
         pdfxOptions: {
-          outputFormat: 'pdfx'
+          outputFormat: "pdfx",
         },
         cbrOptions: {
-          optimizeForEbook: false
+          optimizeForEbook: false,
         },
         pdfToCbrOptions: {
-          dpi: 150
+          dpi: 150,
         },
         cbzOptions: {
-          optimizeForEbook: false
+          optimizeForEbook: false,
         },
         cbzOutputOptions: {
-          dpi: 150
-        }
+          dpi: 150,
+        },
       };
 
       await act(async () => {
diff --git a/frontend/src/core/tests/convert/ConvertSmartDetectionIntegration.test.tsx b/frontend/src/core/tests/convert/ConvertSmartDetectionIntegration.test.tsx
index cbf4fb2e60..af5b991727 100644
--- a/frontend/src/core/tests/convert/ConvertSmartDetectionIntegration.test.tsx
+++ b/frontend/src/core/tests/convert/ConvertSmartDetectionIntegration.test.tsx
@@ -3,37 +3,48 @@
  * Tests the complete flow from file upload through auto-detection to API calls
  */
 
-import React from 'react';
-import { describe, test, expect, vi, beforeEach, afterEach, Mock } from 'vitest';
-import { renderHook, act, waitFor } from '@testing-library/react';
-import { useConvertOperation } from '@app/hooks/tools/convert/useConvertOperation';
-import { useConvertParameters } from '@app/hooks/tools/convert/useConvertParameters';
-import { FileContextProvider } from '@app/contexts/FileContext';
-import { NavigationProvider } from '@app/contexts/NavigationContext';
-import { ToolRegistryProvider } from '@app/contexts/ToolRegistryProvider';
-import { PreferencesProvider } from '@app/contexts/PreferencesContext';
-import { I18nextProvider } from 'react-i18next';
-import i18n from '@app/i18n/config';
-import { detectFileExtension } from '@app/utils/fileUtils';
-import { FIT_OPTIONS } from '@app/constants/convertConstants';
-import { createTestStirlingFile, createTestFilesWithId } from '@app/tests/utils/testFileHelpers';
-import { MantineProvider } from '@mantine/core';
+import React from "react";
+import {
+  describe,
+  test,
+  expect,
+  vi,
+  beforeEach,
+  afterEach,
+  Mock,
+} from "vitest";
+import { renderHook, act, waitFor } from "@testing-library/react";
+import { useConvertOperation } from "@app/hooks/tools/convert/useConvertOperation";
+import { useConvertParameters } from "@app/hooks/tools/convert/useConvertParameters";
+import { FileContextProvider } from "@app/contexts/FileContext";
+import { NavigationProvider } from "@app/contexts/NavigationContext";
+import { ToolRegistryProvider } from "@app/contexts/ToolRegistryProvider";
+import { PreferencesProvider } from "@app/contexts/PreferencesContext";
+import { I18nextProvider } from "react-i18next";
+import i18n from "@app/i18n/config";
+import { detectFileExtension } from "@app/utils/fileUtils";
+import { FIT_OPTIONS } from "@app/constants/convertConstants";
+import {
+  createTestStirlingFile,
+  createTestFilesWithId,
+} from "@app/tests/utils/testFileHelpers";
+import { MantineProvider } from "@mantine/core";
 
 // Mock axios (for static methods like CancelToken, isCancel)
-vi.mock('axios', () => ({
+vi.mock("axios", () => ({
   default: {
     CancelToken: {
       source: vi.fn(() => ({
-        token: 'mock-cancel-token',
-        cancel: vi.fn()
-      }))
+        token: "mock-cancel-token",
+        cancel: vi.fn(),
+      })),
     },
     isCancel: vi.fn(() => false),
-  }
+  },
 }));
 
 // Mock our apiClient service
-vi.mock('../../services/apiClient', () => ({
+vi.mock("../../services/apiClient", () => ({
   default: {
     post: vi.fn(),
     get: vi.fn(),
@@ -41,18 +52,18 @@ vi.mock('../../services/apiClient', () => ({
     delete: vi.fn(),
     interceptors: {
       response: {
-        use: vi.fn()
-      }
-    }
-  }
+        use: vi.fn(),
+      },
+    },
+  },
 }));
 
 // Import the mocked apiClient
-import apiClient from '@app/services/apiClient';
+import apiClient from "@app/services/apiClient";
 const mockedApiClient = vi.mocked(apiClient);
 
 // Mock only essential services that are actually called by the tests
-vi.mock('../../services/fileStorage', () => ({
+vi.mock("../../services/fileStorage", () => ({
   fileStorage: {
     init: vi.fn().mockResolvedValue(undefined),
     storeFile: vi.fn().mockImplementation((file, thumbnail) => {
@@ -62,20 +73,22 @@ vi.mock('../../services/fileStorage', () => ({
         size: file.size,
         type: file.type,
         lastModified: file.lastModified,
-        thumbnail: thumbnail
+        thumbnail: thumbnail,
       });
     }),
     getAllFileMetadata: vi.fn().mockResolvedValue([]),
-    cleanup: vi.fn().mockResolvedValue(undefined)
-  }
+    cleanup: vi.fn().mockResolvedValue(undefined),
+  },
 }));
 
-vi.mock('../../services/thumbnailGenerationService', () => ({
+vi.mock("../../services/thumbnailGenerationService", () => ({
   thumbnailGenerationService: {
-    generateThumbnail: vi.fn().mockResolvedValue('data:image/png;base64,fake-thumbnail'),
+    generateThumbnail: vi
+      .fn()
+      .mockResolvedValue("data:image/png;base64,fake-thumbnail"),
     cleanup: vi.fn(),
-    destroy: vi.fn()
-  }
+    destroy: vi.fn(),
+  },
 }));
 
 const TestWrapper: React.FC<{ children: React.ReactNode }> = ({ children }) => (
@@ -84,9 +97,7 @@ const TestWrapper: React.FC<{ children: React.ReactNode }> = ({ children }) => (
       <PreferencesProvider>
         <ToolRegistryProvider>
           <NavigationProvider>
-            <FileContextProvider>
-              {children}
-            </FileContextProvider>
+            <FileContextProvider>{children}</FileContextProvider>
           </NavigationProvider>
         </ToolRegistryProvider>
       </PreferencesProvider>
@@ -94,14 +105,13 @@ const TestWrapper: React.FC<{ children: React.ReactNode }> = ({ children }) => (
   </MantineProvider>
 );
 
-describe('Convert Tool - Smart Detection Integration Tests', () => {
-
+describe("Convert Tool - Smart Detection Integration Tests", () => {
   beforeEach(() => {
     vi.clearAllMocks();
 
     // Mock successful API response
     (mockedApiClient.post as Mock).mockResolvedValue({
-      data: new Blob(['fake converted content'], { type: 'application/pdf' })
+      data: new Blob(["fake converted content"], { type: "application/pdf" }),
     });
   });
 
@@ -110,18 +120,28 @@ describe('Convert Tool - Smart Detection Integration Tests', () => {
     vi.restoreAllMocks();
   });
 
-  describe('Single File Auto-Detection Flow', () => {
-    test('should auto-detect PDF from DOCX and convert to PDF', async () => {
-      const { result: paramsResult } = renderHook(() => useConvertParameters(), {
-        wrapper: TestWrapper
-      });
+  describe("Single File Auto-Detection Flow", () => {
+    test("should auto-detect PDF from DOCX and convert to PDF", async () => {
+      const { result: paramsResult } = renderHook(
+        () => useConvertParameters(),
+        {
+          wrapper: TestWrapper,
+        },
+      );
 
-      const { result: operationResult } = renderHook(() => useConvertOperation(), {
-        wrapper: TestWrapper
-      });
+      const { result: operationResult } = renderHook(
+        () => useConvertOperation(),
+        {
+          wrapper: TestWrapper,
+        },
+      );
 
       // Create mock DOCX file
-      const docxFile = createTestStirlingFile('document.docx', 'docx content', 'application/vnd.openxmlformats-officedocument.wordprocessingml.document');
+      const docxFile = createTestStirlingFile(
+        "document.docx",
+        "docx content",
+        "application/vnd.openxmlformats-officedocument.wordprocessingml.document",
+      );
 
       // Test auto-detection
       act(() => {
@@ -129,8 +149,8 @@ describe('Convert Tool - Smart Detection Integration Tests', () => {
       });
 
       await waitFor(() => {
-        expect(paramsResult.current.parameters.fromExtension).toBe('docx');
-        expect(paramsResult.current.parameters.toExtension).toBe('pdf');
+        expect(paramsResult.current.parameters.fromExtension).toBe("docx");
+        expect(paramsResult.current.parameters.toExtension).toBe("pdf");
         expect(paramsResult.current.parameters.isSmartDetection).toBe(false);
       });
 
@@ -138,26 +158,40 @@ describe('Convert Tool - Smart Detection Integration Tests', () => {
       await act(async () => {
         await operationResult.current.executeOperation(
           paramsResult.current.parameters,
-          [docxFile]
+          [docxFile],
         );
       });
 
-      expect(mockedApiClient.post).toHaveBeenCalledWith('/api/v1/convert/file/pdf', expect.any(FormData), {
-        responseType: 'blob'
-      });
+      expect(mockedApiClient.post).toHaveBeenCalledWith(
+        "/api/v1/convert/file/pdf",
+        expect.any(FormData),
+        {
+          responseType: "blob",
+        },
+      );
     });
 
-    test('should handle unknown file type with file-to-pdf fallback', async () => {
-      const { result: paramsResult } = renderHook(() => useConvertParameters(), {
-        wrapper: TestWrapper
-      });
+    test("should handle unknown file type with file-to-pdf fallback", async () => {
+      const { result: paramsResult } = renderHook(
+        () => useConvertParameters(),
+        {
+          wrapper: TestWrapper,
+        },
+      );
 
-      const { result: operationResult } = renderHook(() => useConvertOperation(), {
-        wrapper: TestWrapper
-      });
+      const { result: operationResult } = renderHook(
+        () => useConvertOperation(),
+        {
+          wrapper: TestWrapper,
+        },
+      );
 
       // Create mock unknown file
-      const unknownFile = createTestStirlingFile('document.xyz', 'unknown content', 'application/octet-stream');
+      const unknownFile = createTestStirlingFile(
+        "document.xyz",
+        "unknown content",
+        "application/octet-stream",
+      );
 
       // Test auto-detection
       act(() => {
@@ -165,8 +199,8 @@ describe('Convert Tool - Smart Detection Integration Tests', () => {
       });
 
       await waitFor(() => {
-        expect(paramsResult.current.parameters.fromExtension).toBe('file-xyz');
-        expect(paramsResult.current.parameters.toExtension).toBe('pdf'); // Fallback
+        expect(paramsResult.current.parameters.fromExtension).toBe("file-xyz");
+        expect(paramsResult.current.parameters.toExtension).toBe("pdf"); // Fallback
         expect(paramsResult.current.parameters.isSmartDetection).toBe(false);
       });
 
@@ -174,32 +208,41 @@ describe('Convert Tool - Smart Detection Integration Tests', () => {
       await act(async () => {
         await operationResult.current.executeOperation(
           paramsResult.current.parameters,
-          [unknownFile]
+          [unknownFile],
         );
       });
 
-      expect(mockedApiClient.post).toHaveBeenCalledWith('/api/v1/convert/file/pdf', expect.any(FormData), {
-        responseType: 'blob'
-      });
+      expect(mockedApiClient.post).toHaveBeenCalledWith(
+        "/api/v1/convert/file/pdf",
+        expect.any(FormData),
+        {
+          responseType: "blob",
+        },
+      );
     });
   });
 
-  describe('Multi-File Smart Detection Flow', () => {
+  describe("Multi-File Smart Detection Flow", () => {
+    test("should detect all images and use img-to-pdf endpoint", async () => {
+      const { result: paramsResult } = renderHook(
+        () => useConvertParameters(),
+        {
+          wrapper: TestWrapper,
+        },
+      );
 
-    test('should detect all images and use img-to-pdf endpoint', async () => {
-      const { result: paramsResult } = renderHook(() => useConvertParameters(), {
-        wrapper: TestWrapper
-      });
-
-      const { result: operationResult } = renderHook(() => useConvertOperation(), {
-        wrapper: TestWrapper
-      });
+      const { result: operationResult } = renderHook(
+        () => useConvertOperation(),
+        {
+          wrapper: TestWrapper,
+        },
+      );
 
       // Create mock image files
       const imageFiles = createTestFilesWithId([
-        { name: 'photo1.jpg', content: 'jpg content', type: 'image/jpeg' },
-        { name: 'photo2.png', content: 'png content', type: 'image/png' },
-        { name: 'photo3.gif', content: 'gif content', type: 'image/gif' }
+        { name: "photo1.jpg", content: "jpg content", type: "image/jpeg" },
+        { name: "photo2.png", content: "png content", type: "image/png" },
+        { name: "photo3.gif", content: "gif content", type: "image/gif" },
       ]);
 
       // Test smart detection for all images
@@ -208,44 +251,69 @@ describe('Convert Tool - Smart Detection Integration Tests', () => {
       });
 
       await waitFor(() => {
-        expect(paramsResult.current.parameters.fromExtension).toBe('image');
-        expect(paramsResult.current.parameters.toExtension).toBe('pdf');
+        expect(paramsResult.current.parameters.fromExtension).toBe("image");
+        expect(paramsResult.current.parameters.toExtension).toBe("pdf");
         expect(paramsResult.current.parameters.isSmartDetection).toBe(true);
-        expect(paramsResult.current.parameters.smartDetectionType).toBe('images');
+        expect(paramsResult.current.parameters.smartDetectionType).toBe(
+          "images",
+        );
       });
 
       // Test conversion operation
       await act(async () => {
         await operationResult.current.executeOperation(
           paramsResult.current.parameters,
-          imageFiles
+          imageFiles,
         );
       });
 
-      expect(mockedApiClient.post).toHaveBeenCalledWith('/api/v1/convert/img/pdf', expect.any(FormData), {
-        responseType: 'blob'
-      });
+      expect(mockedApiClient.post).toHaveBeenCalledWith(
+        "/api/v1/convert/img/pdf",
+        expect.any(FormData),
+        {
+          responseType: "blob",
+        },
+      );
 
       // Should send all files in single request
-      const formData = (mockedApiClient.post as Mock).mock.calls[0][1] as FormData;
-      const files = formData.getAll('fileInput');
+      const formData = (mockedApiClient.post as Mock).mock
+        .calls[0][1] as FormData;
+      const files = formData.getAll("fileInput");
       expect(files).toHaveLength(3);
     });
 
-    test('should detect mixed file types and use file-to-pdf endpoint', async () => {
-      const { result: paramsResult } = renderHook(() => useConvertParameters(), {
-        wrapper: TestWrapper
-      });
+    test("should detect mixed file types and use file-to-pdf endpoint", async () => {
+      const { result: paramsResult } = renderHook(
+        () => useConvertParameters(),
+        {
+          wrapper: TestWrapper,
+        },
+      );
 
-      const { result: operationResult } = renderHook(() => useConvertOperation(), {
-        wrapper: TestWrapper
-      });
+      const { result: operationResult } = renderHook(
+        () => useConvertOperation(),
+        {
+          wrapper: TestWrapper,
+        },
+      );
 
       // Create mixed file types
       const mixedFiles = createTestFilesWithId([
-        { name: 'document.pdf', content: 'pdf content', type: 'application/pdf' },
-        { name: 'spreadsheet.xlsx', content: 'docx content', type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' },
-        { name: 'presentation.pptx', content: 'pptx content', type: 'application/vnd.openxmlformats-officedocument.presentationml.presentation' }
+        {
+          name: "document.pdf",
+          content: "pdf content",
+          type: "application/pdf",
+        },
+        {
+          name: "spreadsheet.xlsx",
+          content: "docx content",
+          type: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet",
+        },
+        {
+          name: "presentation.pptx",
+          content: "pptx content",
+          type: "application/vnd.openxmlformats-officedocument.presentationml.presentation",
+        },
       ]);
 
       // Test smart detection for mixed types
@@ -254,38 +322,54 @@ describe('Convert Tool - Smart Detection Integration Tests', () => {
       });
 
       await waitFor(() => {
-        expect(paramsResult.current.parameters.fromExtension).toBe('any');
-        expect(paramsResult.current.parameters.toExtension).toBe('pdf');
+        expect(paramsResult.current.parameters.fromExtension).toBe("any");
+        expect(paramsResult.current.parameters.toExtension).toBe("pdf");
         expect(paramsResult.current.parameters.isSmartDetection).toBe(true);
-        expect(paramsResult.current.parameters.smartDetectionType).toBe('mixed');
+        expect(paramsResult.current.parameters.smartDetectionType).toBe(
+          "mixed",
+        );
       });
 
       // Test conversion operation
       await act(async () => {
         await operationResult.current.executeOperation(
           paramsResult.current.parameters,
-          mixedFiles
+          mixedFiles,
         );
       });
 
-      expect(mockedApiClient.post).toHaveBeenCalledWith('/api/v1/convert/file/pdf', expect.any(FormData), {
-        responseType: 'blob'
-      });
+      expect(mockedApiClient.post).toHaveBeenCalledWith(
+        "/api/v1/convert/file/pdf",
+        expect.any(FormData),
+        {
+          responseType: "blob",
+        },
+      );
     });
 
-    test('should detect all web files and use html-to-pdf endpoint', async () => {
-      const { result: paramsResult } = renderHook(() => useConvertParameters(), {
-        wrapper: TestWrapper
-      });
+    test("should detect all web files and use html-to-pdf endpoint", async () => {
+      const { result: paramsResult } = renderHook(
+        () => useConvertParameters(),
+        {
+          wrapper: TestWrapper,
+        },
+      );
 
-      const { result: operationResult } = renderHook(() => useConvertOperation(), {
-        wrapper: TestWrapper
-      });
+      const { result: operationResult } = renderHook(
+        () => useConvertOperation(),
+        {
+          wrapper: TestWrapper,
+        },
+      );
 
       // Create mock web files
       const webFiles = createTestFilesWithId([
-        { name: 'page1.html', content: '<html>content</html>', type: 'text/html' },
-        { name: 'site.zip', content: 'zip content', type: 'application/zip' }
+        {
+          name: "page1.html",
+          content: "<html>content</html>",
+          type: "text/html",
+        },
+        { name: "site.zip", content: "zip content", type: "application/zip" },
       ]);
 
       // Test smart detection for web files
@@ -294,204 +378,256 @@ describe('Convert Tool - Smart Detection Integration Tests', () => {
       });
 
       await waitFor(() => {
-        expect(paramsResult.current.parameters.fromExtension).toBe('html');
-        expect(paramsResult.current.parameters.toExtension).toBe('pdf');
+        expect(paramsResult.current.parameters.fromExtension).toBe("html");
+        expect(paramsResult.current.parameters.toExtension).toBe("pdf");
         expect(paramsResult.current.parameters.isSmartDetection).toBe(true);
-        expect(paramsResult.current.parameters.smartDetectionType).toBe('web');
+        expect(paramsResult.current.parameters.smartDetectionType).toBe("web");
       });
 
       // Test conversion operation
       await act(async () => {
         await operationResult.current.executeOperation(
           paramsResult.current.parameters,
-          webFiles
+          webFiles,
         );
       });
 
-      expect(mockedApiClient.post).toHaveBeenCalledWith('/api/v1/convert/html/pdf', expect.any(FormData), {
-        responseType: 'blob'
-      });
+      expect(mockedApiClient.post).toHaveBeenCalledWith(
+        "/api/v1/convert/html/pdf",
+        expect.any(FormData),
+        {
+          responseType: "blob",
+        },
+      );
 
       // Should process files separately for web files
       expect(mockedApiClient.post).toHaveBeenCalledTimes(2);
     });
   });
 
-  describe('Web and Email Conversion Options Integration', () => {
+  describe("Web and Email Conversion Options Integration", () => {
+    test("should send correct HTML parameters for web-to-pdf conversion", async () => {
+      const { result: paramsResult } = renderHook(
+        () => useConvertParameters(),
+        {
+          wrapper: TestWrapper,
+        },
+      );
 
-    test('should send correct HTML parameters for web-to-pdf conversion', async () => {
-      const { result: paramsResult } = renderHook(() => useConvertParameters(), {
-        wrapper: TestWrapper
-      });
+      const { result: operationResult } = renderHook(
+        () => useConvertOperation(),
+        {
+          wrapper: TestWrapper,
+        },
+      );
 
-      const { result: operationResult } = renderHook(() => useConvertOperation(), {
-        wrapper: TestWrapper
-      });
-
-      const htmlFile = createTestStirlingFile('page.html', '<html>content</html>', 'text/html');
+      const htmlFile = createTestStirlingFile(
+        "page.html",
+        "<html>content</html>",
+        "text/html",
+      );
 
       // Set up HTML conversion parameters
       act(() => {
         paramsResult.current.analyzeFileTypes([htmlFile]);
-        paramsResult.current.updateParameter('htmlOptions', {
-          zoomLevel: 1.5
+        paramsResult.current.updateParameter("htmlOptions", {
+          zoomLevel: 1.5,
         });
       });
 
       await act(async () => {
         await operationResult.current.executeOperation(
           paramsResult.current.parameters,
-          [htmlFile]
+          [htmlFile],
         );
       });
 
-      const formData = (mockedApiClient.post as Mock).mock.calls[0][1] as FormData;
-      expect(formData.get('zoom')).toBe('1.5');
+      const formData = (mockedApiClient.post as Mock).mock
+        .calls[0][1] as FormData;
+      expect(formData.get("zoom")).toBe("1.5");
     });
 
-    test('should send correct email parameters for eml-to-pdf conversion', async () => {
-      const { result: paramsResult } = renderHook(() => useConvertParameters(), {
-        wrapper: TestWrapper
-      });
+    test("should send correct email parameters for eml-to-pdf conversion", async () => {
+      const { result: paramsResult } = renderHook(
+        () => useConvertParameters(),
+        {
+          wrapper: TestWrapper,
+        },
+      );
 
-      const { result: operationResult } = renderHook(() => useConvertOperation(), {
-        wrapper: TestWrapper
-      });
+      const { result: operationResult } = renderHook(
+        () => useConvertOperation(),
+        {
+          wrapper: TestWrapper,
+        },
+      );
 
-      const emlFile = createTestStirlingFile('email.eml', 'email content', 'message/rfc822');
+      const emlFile = createTestStirlingFile(
+        "email.eml",
+        "email content",
+        "message/rfc822",
+      );
 
       // Set up email conversion parameters
       act(() => {
-        paramsResult.current.updateParameter('fromExtension', 'eml');
-        paramsResult.current.updateParameter('toExtension', 'pdf');
-        paramsResult.current.updateParameter('emailOptions', {
+        paramsResult.current.updateParameter("fromExtension", "eml");
+        paramsResult.current.updateParameter("toExtension", "pdf");
+        paramsResult.current.updateParameter("emailOptions", {
           includeAttachments: false,
           maxAttachmentSizeMB: 20,
           downloadHtml: true,
-          includeAllRecipients: true
+          includeAllRecipients: true,
         });
       });
 
       await act(async () => {
         await operationResult.current.executeOperation(
           paramsResult.current.parameters,
-          [emlFile]
+          [emlFile],
         );
       });
 
-      const formData = (mockedApiClient.post as Mock).mock.calls[0][1] as FormData;
-      expect(formData.get('includeAttachments')).toBe('false');
-      expect(formData.get('maxAttachmentSizeMB')).toBe('20');
-      expect(formData.get('downloadHtml')).toBe('true');
-      expect(formData.get('includeAllRecipients')).toBe('true');
+      const formData = (mockedApiClient.post as Mock).mock
+        .calls[0][1] as FormData;
+      expect(formData.get("includeAttachments")).toBe("false");
+      expect(formData.get("maxAttachmentSizeMB")).toBe("20");
+      expect(formData.get("downloadHtml")).toBe("true");
+      expect(formData.get("includeAllRecipients")).toBe("true");
     });
 
-    test('should send correct PDF/A parameters for pdf-to-pdfa conversion', async () => {
-      const { result: paramsResult } = renderHook(() => useConvertParameters(), {
-        wrapper: TestWrapper
-      });
+    test("should send correct PDF/A parameters for pdf-to-pdfa conversion", async () => {
+      const { result: paramsResult } = renderHook(
+        () => useConvertParameters(),
+        {
+          wrapper: TestWrapper,
+        },
+      );
 
-      const { result: operationResult } = renderHook(() => useConvertOperation(), {
-        wrapper: TestWrapper
-      });
+      const { result: operationResult } = renderHook(
+        () => useConvertOperation(),
+        {
+          wrapper: TestWrapper,
+        },
+      );
 
-      const pdfFile = createTestStirlingFile('document.pdf', 'pdf content', 'application/pdf');
+      const pdfFile = createTestStirlingFile(
+        "document.pdf",
+        "pdf content",
+        "application/pdf",
+      );
 
       // Set up PDF/A conversion parameters
       act(() => {
-        paramsResult.current.updateParameter('fromExtension', 'pdf');
-        paramsResult.current.updateParameter('toExtension', 'pdfa');
-        paramsResult.current.updateParameter('pdfaOptions', {
-          outputFormat: 'pdfa',
-          strict: false
+        paramsResult.current.updateParameter("fromExtension", "pdf");
+        paramsResult.current.updateParameter("toExtension", "pdfa");
+        paramsResult.current.updateParameter("pdfaOptions", {
+          outputFormat: "pdfa",
+          strict: false,
         });
       });
 
       await act(async () => {
         await operationResult.current.executeOperation(
           paramsResult.current.parameters,
-          [pdfFile]
+          [pdfFile],
         );
       });
 
-      const formData = (mockedApiClient.post as Mock).mock.calls[0][1] as FormData;
-      expect(formData.get('outputFormat')).toBe('pdfa');
-      expect(formData.get('strict')).toBe('false');
-      expect(mockedApiClient.post).toHaveBeenCalledWith('/api/v1/convert/pdf/pdfa', expect.any(FormData), {
-        responseType: 'blob'
-      });
+      const formData = (mockedApiClient.post as Mock).mock
+        .calls[0][1] as FormData;
+      expect(formData.get("outputFormat")).toBe("pdfa");
+      expect(formData.get("strict")).toBe("false");
+      expect(mockedApiClient.post).toHaveBeenCalledWith(
+        "/api/v1/convert/pdf/pdfa",
+        expect.any(FormData),
+        {
+          responseType: "blob",
+        },
+      );
     });
   });
 
-  describe('Image Conversion Options Integration', () => {
+  describe("Image Conversion Options Integration", () => {
+    test("should send correct parameters for image-to-pdf conversion", async () => {
+      const { result: paramsResult } = renderHook(
+        () => useConvertParameters(),
+        {
+          wrapper: TestWrapper,
+        },
+      );
 
-    test('should send correct parameters for image-to-pdf conversion', async () => {
-      const { result: paramsResult } = renderHook(() => useConvertParameters(), {
-        wrapper: TestWrapper
-      });
-
-      const { result: operationResult } = renderHook(() => useConvertOperation(), {
-        wrapper: TestWrapper
-      });
+      const { result: operationResult } = renderHook(
+        () => useConvertOperation(),
+        {
+          wrapper: TestWrapper,
+        },
+      );
 
       const imageFiles = createTestFilesWithId([
-        { name: 'photo1.jpg', content: 'jpg1', type: 'image/jpeg' },
-        { name: 'photo2.jpg', content: 'jpg2', type: 'image/jpeg' }
+        { name: "photo1.jpg", content: "jpg1", type: "image/jpeg" },
+        { name: "photo2.jpg", content: "jpg2", type: "image/jpeg" },
       ]);
 
       // Set up image conversion parameters
       act(() => {
         paramsResult.current.analyzeFileTypes(imageFiles);
-        paramsResult.current.updateParameter('imageOptions', {
-          colorType: 'grayscale',
+        paramsResult.current.updateParameter("imageOptions", {
+          colorType: "grayscale",
           dpi: 150,
-          singleOrMultiple: 'single',
+          singleOrMultiple: "single",
           fitOption: FIT_OPTIONS.FIT_PAGE,
           autoRotate: false,
-          combineImages: true
+          combineImages: true,
         });
       });
 
       await act(async () => {
         await operationResult.current.executeOperation(
           paramsResult.current.parameters,
-          imageFiles
+          imageFiles,
         );
       });
 
-      const formData = (mockedApiClient.post as Mock).mock.calls[0][1] as FormData;
-      expect(formData.get('fitOption')).toBe(FIT_OPTIONS.FIT_PAGE);
-      expect(formData.get('colorType')).toBe('grayscale');
-      expect(formData.get('autoRotate')).toBe('false');
+      const formData = (mockedApiClient.post as Mock).mock
+        .calls[0][1] as FormData;
+      expect(formData.get("fitOption")).toBe(FIT_OPTIONS.FIT_PAGE);
+      expect(formData.get("colorType")).toBe("grayscale");
+      expect(formData.get("autoRotate")).toBe("false");
     });
 
-    test('should process images separately when combineImages is false', async () => {
-      const { result: paramsResult } = renderHook(() => useConvertParameters(), {
-        wrapper: TestWrapper
-      });
+    test("should process images separately when combineImages is false", async () => {
+      const { result: paramsResult } = renderHook(
+        () => useConvertParameters(),
+        {
+          wrapper: TestWrapper,
+        },
+      );
 
-      const { result: operationResult } = renderHook(() => useConvertOperation(), {
-        wrapper: TestWrapper
-      });
+      const { result: operationResult } = renderHook(
+        () => useConvertOperation(),
+        {
+          wrapper: TestWrapper,
+        },
+      );
 
       const imageFiles = createTestFilesWithId([
-        { name: 'photo1.jpg', content: 'jpg1', type: 'image/jpeg' },
-        { name: 'photo2.jpg', content: 'jpg2', type: 'image/jpeg' }
+        { name: "photo1.jpg", content: "jpg1", type: "image/jpeg" },
+        { name: "photo2.jpg", content: "jpg2", type: "image/jpeg" },
       ]);
 
       // Set up for separate processing
       act(() => {
         paramsResult.current.analyzeFileTypes(imageFiles);
-        paramsResult.current.updateParameter('imageOptions', {
+        paramsResult.current.updateParameter("imageOptions", {
           ...paramsResult.current.parameters.imageOptions,
-          combineImages: false
+          combineImages: false,
         });
       });
 
       await act(async () => {
         await operationResult.current.executeOperation(
           paramsResult.current.parameters,
-          imageFiles
+          imageFiles,
         );
       });
 
@@ -500,28 +636,36 @@ describe('Convert Tool - Smart Detection Integration Tests', () => {
     });
   });
 
-  describe('Error Scenarios in Smart Detection', () => {
+  describe("Error Scenarios in Smart Detection", () => {
+    test("should handle partial failures in multi-file processing", async () => {
+      const { result: paramsResult } = renderHook(
+        () => useConvertParameters(),
+        {
+          wrapper: TestWrapper,
+        },
+      );
 
-
-    test('should handle partial failures in multi-file processing', async () => {
-      const { result: paramsResult } = renderHook(() => useConvertParameters(), {
-        wrapper: TestWrapper
-      });
-
-      const { result: operationResult } = renderHook(() => useConvertOperation(), {
-        wrapper: TestWrapper
-      });
+      const { result: operationResult } = renderHook(
+        () => useConvertOperation(),
+        {
+          wrapper: TestWrapper,
+        },
+      );
 
       // Mock one success, one failure
       (mockedApiClient.post as Mock)
         .mockResolvedValueOnce({
-          data: new Blob(['converted1'], { type: 'application/pdf' })
+          data: new Blob(["converted1"], { type: "application/pdf" }),
         })
-        .mockRejectedValueOnce(new Error('File 2 failed'));
+        .mockRejectedValueOnce(new Error("File 2 failed"));
 
       const mixedFiles = createTestFilesWithId([
-        { name: 'doc1.txt', content: 'file1', type: 'text/plain' },
-        { name: 'doc2.xyz', content: 'file2', type: 'application/octet-stream' }
+        { name: "doc1.txt", content: "file1", type: "text/plain" },
+        {
+          name: "doc2.xyz",
+          content: "file2",
+          type: "application/octet-stream",
+        },
       ]);
 
       // Set up for separate processing (mixed smart detection)
@@ -532,7 +676,7 @@ describe('Convert Tool - Smart Detection Integration Tests', () => {
       await act(async () => {
         await operationResult.current.executeOperation(
           paramsResult.current.parameters,
-          mixedFiles
+          mixedFiles,
         );
       });
 
@@ -544,21 +688,20 @@ describe('Convert Tool - Smart Detection Integration Tests', () => {
     });
   });
 
-  describe('Real File Extension Detection', () => {
-
-    test('should correctly detect various file extensions', async () => {
+  describe("Real File Extension Detection", () => {
+    test("should correctly detect various file extensions", async () => {
       renderHook(() => useConvertParameters(), {
-        wrapper: TestWrapper
+        wrapper: TestWrapper,
       });
 
       const testCases = [
-        { filename: 'document.PDF', expected: 'pdf' },
-        { filename: 'image.JPEG', expected: 'jpg' }, // JPEG should normalize to jpg
-        { filename: 'photo.jpeg', expected: 'jpg' }, // jpeg should normalize to jpg
-        { filename: 'archive.tar.gz', expected: 'gz' },
-        { filename: 'file.', expected: '' },
-        { filename: '.hidden', expected: 'hidden' },
-        { filename: 'noextension', expected: '' }
+        { filename: "document.PDF", expected: "pdf" },
+        { filename: "image.JPEG", expected: "jpg" }, // JPEG should normalize to jpg
+        { filename: "photo.jpeg", expected: "jpg" }, // jpeg should normalize to jpg
+        { filename: "archive.tar.gz", expected: "gz" },
+        { filename: "file.", expected: "" },
+        { filename: ".hidden", expected: "hidden" },
+        { filename: "noextension", expected: "" },
       ];
 
       testCases.forEach(({ filename, expected }) => {
diff --git a/frontend/src/core/tests/encryptedPdf/EncryptedPdfUnlockE2E.spec.ts b/frontend/src/core/tests/encryptedPdf/EncryptedPdfUnlockE2E.spec.ts
new file mode 100644
index 0000000000..60b84a3f9c
--- /dev/null
+++ b/frontend/src/core/tests/encryptedPdf/EncryptedPdfUnlockE2E.spec.ts
@@ -0,0 +1,370 @@
+/**
+ * End-to-End Tests for Encrypted PDF Password Prompting
+ *
+ * Tests the EncryptedPdfUnlockModal flow when uploading password-protected PDFs.
+ * All backend API calls are mocked via page.route() — no real backend required.
+ * The Vite dev server must be running (handled by playwright.config.ts webServer).
+ */
+
+import { test, expect, type Page } from "@playwright/test";
+import path from "path";
+import fs from "fs";
+
+const FIXTURES_DIR = path.join(__dirname, "../test-fixtures");
+const ENCRYPTED_PDF = path.join(FIXTURES_DIR, "encrypted.pdf");
+const SAMPLE_PDF = path.join(FIXTURES_DIR, "sample.pdf");
+
+// Minimal valid PDF returned by the mocked remove-password endpoint
+const FAKE_UNLOCKED_PDF = Buffer.from(
+  "%PDF-1.4\n1 0 obj\n<< /Type /Catalog /Pages 2 0 R >>\nendobj\n" +
+    "2 0 obj\n<< /Type /Pages /Kids [3 0 R] /Count 1 >>\nendobj\n" +
+    "3 0 obj\n<< /Type /Page /Parent 2 0 R /MediaBox [0 0 612 792] >>\nendobj\n" +
+    "xref\n0 4\n0000000000 65535 f \n0000000009 00000 n \n0000000058 00000 n \n" +
+    "0000000115 00000 n \ntrailer\n<< /Size 4 /Root 1 0 R >>\nstartxref\n190\n%%EOF",
+);
+
+// ---------------------------------------------------------------------------
+// Helper: mock all standard app APIs needed to load the main UI
+// ---------------------------------------------------------------------------
+async function mockAppApis(page: Page) {
+  await page.route("**/api/v1/info/status", (route) =>
+    route.fulfill({ json: { status: "UP" } }),
+  );
+
+  await page.route("**/api/v1/config/app-config", (route) =>
+    route.fulfill({
+      json: {
+        enableLogin: false,
+        languages: ["en-GB"],
+        defaultLocale: "en-GB",
+      },
+    }),
+  );
+
+  await page.route("**/api/v1/auth/me", (route) =>
+    route.fulfill({
+      json: {
+        id: 1,
+        username: "testuser",
+        email: "test@example.com",
+        roles: ["ROLE_USER"],
+      },
+    }),
+  );
+
+  await page.route("**/api/v1/config/endpoints-availability", (route) =>
+    route.fulfill({ json: {} }),
+  );
+
+  await page.route("**/api/v1/config/endpoint-enabled*", (route) =>
+    route.fulfill({ json: true }),
+  );
+
+  await page.route("**/api/v1/config/group-enabled*", (route) =>
+    route.fulfill({ json: true }),
+  );
+
+  await page.route("**/api/v1/ui-data/footer-info", (route) =>
+    route.fulfill({ json: {} }),
+  );
+
+  await page.route("**/api/v1/proprietary/**", (route) =>
+    route.fulfill({ json: {} }),
+  );
+}
+
+// ---------------------------------------------------------------------------
+// Helper: mock the remove-password endpoint to succeed
+// ---------------------------------------------------------------------------
+function mockRemovePasswordSuccess(page: Page) {
+  return page.route("**/api/v1/security/remove-password", (route) =>
+    route.fulfill({
+      status: 200,
+      contentType: "application/pdf",
+      headers: {
+        "Content-Disposition": 'attachment; filename="encrypted.pdf"',
+      },
+      body: FAKE_UNLOCKED_PDF,
+    }),
+  );
+}
+
+// ---------------------------------------------------------------------------
+// Helper: mock the remove-password endpoint to fail with wrong password
+// ---------------------------------------------------------------------------
+function mockRemovePasswordWrongPassword(page: Page) {
+  return page.route("**/api/v1/security/remove-password", (route) =>
+    route.fulfill({
+      status: 400,
+      contentType: "application/problem+json",
+      body: JSON.stringify({
+        type: "/errors/pdf-password",
+        title: "PDF password incorrect",
+        status: 400,
+        detail:
+          "The PDF is passworded and requires the correct password to open.",
+      }),
+    }),
+  );
+}
+
+// ---------------------------------------------------------------------------
+// Helper: upload a file through the Files modal and wait for it to close
+// ---------------------------------------------------------------------------
+async function uploadFile(page: Page, filePath: string) {
+  await page.getByTestId("files-button").click();
+  await page.waitForSelector(".mantine-Modal-overlay", {
+    state: "visible",
+    timeout: 5000,
+  });
+  await page.locator('[data-testid="file-input"]').setInputFiles(filePath);
+  // Modal auto-closes after file is selected
+  await page.waitForSelector(".mantine-Modal-overlay", {
+    state: "hidden",
+    timeout: 10000,
+  });
+}
+
+// ---------------------------------------------------------------------------
+// Helper: upload encrypted file — the Files modal closes, then the unlock
+// modal should appear on top. We don't wait for the Files modal to vanish
+// since the unlock modal may appear while it is still closing.
+// ---------------------------------------------------------------------------
+async function uploadEncryptedFile(page: Page, filePath: string) {
+  await page.getByTestId("files-button").click();
+  await page.waitForSelector(".mantine-Modal-overlay", {
+    state: "visible",
+    timeout: 5000,
+  });
+  await page.locator('[data-testid="file-input"]').setInputFiles(filePath);
+}
+
+// ---------------------------------------------------------------------------
+// Selectors for the unlock modal (Mantine Modal with known text content)
+// ---------------------------------------------------------------------------
+const MODAL_TITLE = "Remove password to continue";
+const PASSWORD_PLACEHOLDER = "Enter the PDF password";
+const UNLOCK_BUTTON_TEXT = "Unlock & Continue";
+const SKIP_BUTTON_TEXT = "Skip for now";
+
+// ---------------------------------------------------------------------------
+// Tests
+// ---------------------------------------------------------------------------
+test.describe.configure({ mode: "serial" });
+
+test.describe("Encrypted PDF Unlock Modal", () => {
+  test.beforeEach(async ({ page }) => {
+    await mockAppApis(page);
+    await page.goto("/?bypassOnboarding=true");
+    await page.waitForSelector('[data-testid="files-button"]', {
+      timeout: 10000,
+    });
+
+    // Dismiss onboarding tooltip if it appears (can block clicks in Firefox/WebKit)
+    const tooltip = page.locator('button:has-text("Close tooltip")');
+    if (await tooltip.isVisible({ timeout: 1000 }).catch(() => false)) {
+      await tooltip.click();
+    }
+  });
+
+  test("uploading an encrypted PDF shows the unlock modal", async ({
+    page,
+  }) => {
+    await uploadEncryptedFile(page, ENCRYPTED_PDF);
+
+    // The unlock modal should appear with the expected title
+    await expect(page.getByText(MODAL_TITLE)).toBeVisible({ timeout: 10000 });
+    await expect(page.getByPlaceholder(PASSWORD_PLACEHOLDER)).toBeVisible();
+    await expect(
+      page.getByRole("button", { name: UNLOCK_BUTTON_TEXT }),
+    ).toBeVisible();
+    await expect(
+      page.getByRole("button", { name: SKIP_BUTTON_TEXT }),
+    ).toBeVisible();
+  });
+
+  test("unlock button is disabled when password field is empty", async ({
+    page,
+  }) => {
+    await uploadEncryptedFile(page, ENCRYPTED_PDF);
+
+    await expect(page.getByText(MODAL_TITLE)).toBeVisible({ timeout: 10000 });
+
+    const unlockBtn = page.getByRole("button", { name: UNLOCK_BUTTON_TEXT });
+    await expect(unlockBtn).toBeDisabled();
+  });
+
+  test("unlock button becomes enabled after entering a password", async ({
+    page,
+  }) => {
+    await uploadEncryptedFile(page, ENCRYPTED_PDF);
+
+    await expect(page.getByText(MODAL_TITLE)).toBeVisible({ timeout: 10000 });
+
+    const passwordInput = page.getByPlaceholder(PASSWORD_PLACEHOLDER);
+    await passwordInput.fill("somepassword");
+
+    const unlockBtn = page.getByRole("button", { name: UNLOCK_BUTTON_TEXT });
+    await expect(unlockBtn).toBeEnabled();
+  });
+
+  test("successful unlock removes the modal and shows success alert", async ({
+    page,
+  }) => {
+    await mockRemovePasswordSuccess(page);
+
+    await uploadEncryptedFile(page, ENCRYPTED_PDF);
+    await expect(page.getByText(MODAL_TITLE)).toBeVisible({ timeout: 10000 });
+
+    await page.getByPlaceholder(PASSWORD_PLACEHOLDER).fill("testpass123");
+    await page.getByRole("button", { name: UNLOCK_BUTTON_TEXT }).click();
+
+    // Modal should close after successful unlock
+    await expect(page.getByText(MODAL_TITLE)).toBeHidden({ timeout: 10000 });
+
+    // Success alert should appear
+    await expect(
+      page.getByText("Password removed", { exact: true }),
+    ).toBeVisible({ timeout: 5000 });
+  });
+
+  test("incorrect password shows error message in modal", async ({ page }) => {
+    await mockRemovePasswordWrongPassword(page);
+
+    await uploadEncryptedFile(page, ENCRYPTED_PDF);
+    await expect(page.getByText(MODAL_TITLE)).toBeVisible({ timeout: 10000 });
+
+    await page.getByPlaceholder(PASSWORD_PLACEHOLDER).fill("wrongpassword");
+    await page.getByRole("button", { name: UNLOCK_BUTTON_TEXT }).click();
+
+    // Error message should appear within the modal
+    await expect(page.getByText("Incorrect password")).toBeVisible({
+      timeout: 5000,
+    });
+
+    // Modal should remain open
+    await expect(page.getByText(MODAL_TITLE)).toBeVisible();
+  });
+
+  test("skip button closes the modal without unlocking", async ({ page }) => {
+    await uploadEncryptedFile(page, ENCRYPTED_PDF);
+    await expect(page.getByText(MODAL_TITLE)).toBeVisible({ timeout: 10000 });
+
+    await page.getByRole("button", { name: SKIP_BUTTON_TEXT }).click();
+
+    // Modal should close
+    await expect(page.getByText(MODAL_TITLE)).toBeHidden({ timeout: 5000 });
+  });
+
+  test("pressing Enter in password field triggers unlock", async ({ page }) => {
+    await mockRemovePasswordSuccess(page);
+
+    await uploadEncryptedFile(page, ENCRYPTED_PDF);
+    await expect(page.getByText(MODAL_TITLE)).toBeVisible({ timeout: 10000 });
+
+    const passwordInput = page.getByPlaceholder(PASSWORD_PLACEHOLDER);
+    await passwordInput.fill("testpass123");
+    await passwordInput.press("Enter");
+
+    // Modal should close after successful unlock via Enter key
+    await expect(page.getByText(MODAL_TITLE)).toBeHidden({ timeout: 10000 });
+  });
+
+  test("uploading a normal PDF does not show the unlock modal", async ({
+    page,
+  }) => {
+    await uploadFile(page, SAMPLE_PDF);
+
+    // Wait for the file to finish processing, then verify no unlock modal appeared
+    await page.waitForTimeout(3000);
+    await expect(page.getByText(MODAL_TITLE)).toBeHidden();
+  });
+
+  test("unlock all button is hidden with only one encrypted file", async ({
+    page,
+  }) => {
+    await uploadEncryptedFile(page, ENCRYPTED_PDF);
+    await expect(page.getByText(MODAL_TITLE)).toBeVisible({ timeout: 10000 });
+
+    // The "Use for all" button should NOT appear with only one file
+    await expect(
+      page.getByRole("button", { name: /Use for all/ }),
+    ).toBeHidden();
+  });
+
+  test("unlock all button appears with multiple encrypted files and unlocks all", async ({
+    page,
+  }) => {
+    await mockRemovePasswordSuccess(page);
+
+    // Upload two encrypted files at once (different names to avoid deduplication)
+    await page.getByTestId("files-button").click();
+    await page.waitForSelector(".mantine-Modal-overlay", {
+      state: "visible",
+      timeout: 5000,
+    });
+    await page.locator('[data-testid="file-input"]').setInputFiles([
+      {
+        name: "encrypted-a.pdf",
+        mimeType: "application/pdf",
+        buffer: fs.readFileSync(ENCRYPTED_PDF),
+      },
+      {
+        name: "encrypted-b.pdf",
+        mimeType: "application/pdf",
+        buffer: fs.readFileSync(ENCRYPTED_PDF),
+      },
+    ]);
+
+    // The unlock modal should appear for the first file with "Use for all" visible
+    await expect(page.getByText(MODAL_TITLE)).toBeVisible({ timeout: 10000 });
+    const unlockAllBtn = page.getByRole("button", { name: /Use for all/ });
+    await expect(unlockAllBtn).toBeVisible({ timeout: 10000 });
+
+    // Enter password and click unlock all
+    await page.getByPlaceholder(PASSWORD_PLACEHOLDER).fill("testpass123");
+    await unlockAllBtn.click();
+
+    // Modal should close — all files unlocked
+    await expect(page.getByText(MODAL_TITLE)).toBeHidden({ timeout: 10000 });
+  });
+
+  test("unlock all with wrong password shows which files failed", async ({
+    page,
+  }) => {
+    await mockRemovePasswordWrongPassword(page);
+
+    // Upload two encrypted files at once (different names to avoid deduplication)
+    await page.getByTestId("files-button").click();
+    await page.waitForSelector(".mantine-Modal-overlay", {
+      state: "visible",
+      timeout: 5000,
+    });
+    await page.locator('[data-testid="file-input"]').setInputFiles([
+      {
+        name: "encrypted-a.pdf",
+        mimeType: "application/pdf",
+        buffer: fs.readFileSync(ENCRYPTED_PDF),
+      },
+      {
+        name: "encrypted-b.pdf",
+        mimeType: "application/pdf",
+        buffer: fs.readFileSync(ENCRYPTED_PDF),
+      },
+    ]);
+
+    // The unlock modal should appear with "Use for all"
+    await expect(page.getByText(MODAL_TITLE)).toBeVisible({ timeout: 10000 });
+    const unlockAllBtn = page.getByRole("button", { name: /Use for all/ });
+    await expect(unlockAllBtn).toBeVisible({ timeout: 10000 });
+
+    await page.getByPlaceholder(PASSWORD_PLACEHOLDER).fill("wrongpassword");
+    await unlockAllBtn.click();
+
+    // Modal should remain open with error about failed files
+    await expect(page.getByText(MODAL_TITLE)).toBeVisible({ timeout: 5000 });
+    await expect(page.getByText(/Wrong password for/)).toBeVisible({
+      timeout: 5000,
+    });
+  });
+});
diff --git a/frontend/src/core/tests/missingTranslations.test.ts b/frontend/src/core/tests/missingTranslations.test.ts
index 0e9e8037ba..5806f9e271 100644
--- a/frontend/src/core/tests/missingTranslations.test.ts
+++ b/frontend/src/core/tests/missingTranslations.test.ts
@@ -1,17 +1,17 @@
-import fs from 'fs';
-import path from 'path';
-import ts from 'typescript';
-import { describe, expect, test } from 'vitest';
-import { parse } from 'smol-toml';
+import fs from "fs";
+import path from "path";
+import ts from "typescript";
+import { describe, expect, test } from "vitest";
+import { parse } from "smol-toml";
 
-const REPO_ROOT = path.join(__dirname, '../../../..');
-const SRC_ROOT = path.join(__dirname, '../..');
-const EN_GB_FILE = path.join(__dirname, '../../../public/locales/en-GB/translation.toml');
+const REPO_ROOT = path.join(__dirname, "../../../..");
+const SRC_ROOT = path.join(__dirname, "../..");
+const EN_GB_FILE = path.join(
+  __dirname,
+  "../../../public/locales/en-GB/translation.toml",
+);
 
-const IGNORED_DIRS = new Set([
-  'tests',
-  '__mocks__',
-]);
+const IGNORED_DIRS = new Set(["tests", "__mocks__"]);
 const IGNORED_FILE_PATTERNS = [
   /\.d\.ts$/,
   /\.test\./,
@@ -30,15 +30,21 @@ type FoundKey = {
   column: number;
 };
 
-const flattenKeys = (node: unknown, prefix = '', acc = new Set<string>()): Set<string> => {
-  if (!node || typeof node !== 'object' || Array.isArray(node)) {
+const flattenKeys = (
+  node: unknown,
+  prefix = "",
+  acc = new Set<string>(),
+): Set<string> => {
+  if (!node || typeof node !== "object" || Array.isArray(node)) {
     if (prefix) {
       acc.add(prefix);
     }
     return acc;
   }
 
-  for (const [childKey, value] of Object.entries(node as Record<string, unknown>)) {
+  for (const [childKey, value] of Object.entries(
+    node as Record<string, unknown>,
+  )) {
     const next = prefix ? `${prefix}.${childKey}` : childKey;
     flattenKeys(value, next, acc);
   }
@@ -47,25 +53,31 @@ const flattenKeys = (node: unknown, prefix = '', acc = new Set<string>()): Set<s
 };
 
 const listSourceFiles = (): string[] => {
-  const files = ts.sys.readDirectory(SRC_ROOT, ['.ts', '.tsx', '.js', '.jsx'], undefined, [
-    '**/*',
-  ]);
+  const files = ts.sys.readDirectory(
+    SRC_ROOT,
+    [".ts", ".tsx", ".js", ".jsx"],
+    undefined,
+    ["**/*"],
+  );
 
   return files
-    .filter((file) => !file.split(path.sep).some((segment) => IGNORED_DIRS.has(segment)))
+    .filter(
+      (file) =>
+        !file.split(path.sep).some((segment) => IGNORED_DIRS.has(segment)),
+    )
     .filter((file) => !IGNORED_FILE_PATTERNS.some((re) => re.test(file)));
 };
 
 const getScriptKind = (file: string): ts.ScriptKind => {
-  if (file.endsWith('.tsx')) {
+  if (file.endsWith(".tsx")) {
     return ts.ScriptKind.TSX;
   }
 
-  if (file.endsWith('.ts')) {
+  if (file.endsWith(".ts")) {
     return ts.ScriptKind.TS;
   }
 
-  if (file.endsWith('.jsx')) {
+  if (file.endsWith(".jsx")) {
     return ts.ScriptKind.JSX;
   }
 
@@ -77,7 +89,7 @@ const getScriptKind = (file: string): ts.ScriptKind => {
  * Ignores dynamic strings because we can't know what the actual translation key will be.
  */
 const extractKeys = (file: string): FoundKey[] => {
-  const code = fs.readFileSync(file, 'utf8');
+  const code = fs.readFileSync(file, "utf8");
   const sourceFile = ts.createSourceFile(
     file,
     code,
@@ -89,7 +101,9 @@ const extractKeys = (file: string): FoundKey[] => {
   const found: FoundKey[] = [];
 
   const record = (node: ts.Node, key: string, fallback: string = "") => {
-    const { line, character } = sourceFile.getLineAndCharacterOfPosition(node.getStart());
+    const { line, character } = sourceFile.getLineAndCharacterOfPosition(
+      node.getStart(),
+    );
     found.push({ key, fallback, file, line: line + 1, column: character + 1 });
   };
 
@@ -100,12 +114,19 @@ const extractKeys = (file: string): FoundKey[] => {
       const arg1 = node.arguments.at(1);
 
       const isT =
-        (ts.isIdentifier(callee) && callee.text === 't') ||
-        (ts.isPropertyAccessExpression(callee) && callee.name.text === 't');
+        (ts.isIdentifier(callee) && callee.text === "t") ||
+        (ts.isPropertyAccessExpression(callee) && callee.name.text === "t");
 
-      if (isT && arg0 && (ts.isStringLiteral(arg0) || ts.isNoSubstitutionTemplateLiteral(arg0))) {
+      if (
+        isT &&
+        arg0 &&
+        (ts.isStringLiteral(arg0) || ts.isNoSubstitutionTemplateLiteral(arg0))
+      ) {
         let arg1Text: string = "";
-        if (arg1 && (ts.isStringLiteral(arg1) || ts.isNoSubstitutionTemplateLiteral(arg1))) {
+        if (
+          arg1 &&
+          (ts.isStringLiteral(arg1) || ts.isNoSubstitutionTemplateLiteral(arg1))
+        ) {
           arg1Text = arg1.text;
         }
         record(arg0, arg0.text, arg1Text);
@@ -116,7 +137,7 @@ const extractKeys = (file: string): FoundKey[] => {
       for (const attr of node.attributes.properties) {
         if (
           !ts.isJsxAttribute(attr) ||
-          attr.name.getText(sourceFile) !== 'i18nKey' ||
+          attr.name.getText(sourceFile) !== "i18nKey" ||
           !attr.initializer
         ) {
           continue;
@@ -146,49 +167,60 @@ const extractKeys = (file: string): FoundKey[] => {
   return found;
 };
 
-describe('Missing translation coverage', () => {
-  test('fails if any en-GB translation key used in source is missing', { timeout: 10000 }, () => {
-    expect(fs.existsSync(EN_GB_FILE)).toBe(true);
+describe("Missing translation coverage", () => {
+  test(
+    "fails if any en-GB translation key used in source is missing",
+    { timeout: 10000 },
+    () => {
+      expect(fs.existsSync(EN_GB_FILE)).toBe(true);
 
-    const localeContent = fs.readFileSync(EN_GB_FILE, 'utf8');
-    const enGb = parse(localeContent);
-    const availableKeys = flattenKeys(enGb);
+      const localeContent = fs.readFileSync(EN_GB_FILE, "utf8");
+      const enGb = parse(localeContent);
+      const availableKeys = flattenKeys(enGb);
 
-    const usedKeys = listSourceFiles()
-      .flatMap(extractKeys)
-      .filter(({ key }) => !IGNORED_KEYS.has(key));
-    expect(usedKeys.length).toBeGreaterThan(100); // Sanity check
+      const usedKeys = listSourceFiles()
+        .flatMap(extractKeys)
+        .filter(({ key }) => !IGNORED_KEYS.has(key));
+      expect(usedKeys.length).toBeGreaterThan(100); // Sanity check
 
-    const missingKeys = usedKeys.filter(({ key }) => !availableKeys.has(key));
+      const missingKeys = usedKeys.filter(({ key }) => !availableKeys.has(key));
 
-    const annotations = missingKeys.map(({ key, fallback, file, line, column }) => {
-      const workspaceRelativeRaw = path.relative(REPO_ROOT, file);
-      const workspaceRelativeFile = workspaceRelativeRaw.replace(/\\/g, '/');
+      const annotations = missingKeys.map(
+        ({ key, fallback, file, line, column }) => {
+          const workspaceRelativeRaw = path.relative(REPO_ROOT, file);
+          const workspaceRelativeFile = workspaceRelativeRaw.replace(
+            /\\/g,
+            "/",
+          );
 
-      return {
-        key,
-        fallback,
-        file: workspaceRelativeFile,
-        line,
-        column,
-      };
-    });
-
-    // Output errors in GitHub Annotations format so they appear tagged in the code in CI
-    for (const { key, fallback, file, line, column } of annotations) {
-      process.stderr.write(
-        `::error file=${file},line=${line},col=${column}::Missing en-GB translation for ${key} (${fallback})\n`,
+          return {
+            key,
+            fallback,
+            file: workspaceRelativeFile,
+            line,
+            column,
+          };
+        },
       );
-    }
 
-    const neatened = annotations.map(({ key, fallback, file, line, column }) => {
-      return {
-        key,
-        fallback,
-        location: `${file}:${line}:${column}`,
+      // Output errors in GitHub Annotations format so they appear tagged in the code in CI
+      for (const { key, fallback, file, line, column } of annotations) {
+        process.stderr.write(
+          `::error file=${file},line=${line},col=${column}::Missing en-GB translation for ${key} (${fallback})\n`,
+        );
       }
-    });
 
-    expect(neatened).toEqual([]);
-  });
+      const neatened = annotations.map(
+        ({ key, fallback, file, line, column }) => {
+          return {
+            key,
+            fallback,
+            location: `${file}:${line}:${column}`,
+          };
+        },
+      );
+
+      expect(neatened).toEqual([]);
+    },
+  );
 });
diff --git a/frontend/src/core/tests/test-fixtures/compare_sample_a.pdf b/frontend/src/core/tests/test-fixtures/compare_sample_a.pdf
new file mode 100644
index 0000000000..f625c11469
Binary files /dev/null and b/frontend/src/core/tests/test-fixtures/compare_sample_a.pdf differ
diff --git a/frontend/src/core/tests/test-fixtures/compare_sample_b.pdf b/frontend/src/core/tests/test-fixtures/compare_sample_b.pdf
new file mode 100644
index 0000000000..67f895ebf1
--- /dev/null
+++ b/frontend/src/core/tests/test-fixtures/compare_sample_b.pdf
@@ -0,0 +1,74 @@
+%PDF-1.3
+%“Œ‹ž ReportLab Generated PDF document http://www.reportlab.com
+1 0 obj
+<<
+/F1 2 0 R /F2 3 0 R
+>>
+endobj
+2 0 obj
+<<
+/BaseFont /Helvetica /Encoding /WinAnsiEncoding /Name /F1 /Subtype /Type1 /Type /Font
+>>
+endobj
+3 0 obj
+<<
+/BaseFont /Helvetica-Bold /Encoding /WinAnsiEncoding /Name /F2 /Subtype /Type1 /Type /Font
+>>
+endobj
+4 0 obj
+<<
+/Contents 8 0 R /MediaBox [ 0 0 612 792 ] /Parent 7 0 R /Resources <<
+/Font 1 0 R /ProcSet [ /PDF /Text /ImageB /ImageC /ImageI ]
+>> /Rotate 0 /Trans <<
+
+>> 
+  /Type /Page
+>>
+endobj
+5 0 obj
+<<
+/PageMode /UseNone /Pages 7 0 R /Type /Catalog
+>>
+endobj
+6 0 obj
+<<
+/Author (anonymous) /CreationDate (D:20250819094504+01'00') /Creator (ReportLab PDF Library - www.reportlab.com) /Keywords () /ModDate (D:20250819094504+01'00') /Producer (ReportLab PDF Library - www.reportlab.com) 
+  /Subject (unspecified) /Title (untitled) /Trapped /False
+>>
+endobj
+7 0 obj
+<<
+/Count 1 /Kids [ 4 0 R ] /Type /Pages
+>>
+endobj
+8 0 obj
+<<
+/Filter [ /ASCII85Decode /FlateDecode ] /Length 147
+>>
+stream
+GarW00abco&4HDcidm(mI,3'DZY:^WQ,7!K+Bf&Mo_p+bJu"KZ.3A(M3%pEBpBe"=Bb3[h-Xt2ROZoe^Q)8NH>;#5qqB`Oee86NZp3Iif`:9`Y'Dq([aoCS4Veh*jH9C%+DV`*GHUK^ngmo`i~>endstream
+endobj
+xref
+0 9
+0000000000 65535 f 
+0000000073 00000 n 
+0000000114 00000 n 
+0000000221 00000 n 
+0000000333 00000 n 
+0000000526 00000 n 
+0000000594 00000 n 
+0000000890 00000 n 
+0000000949 00000 n 
+trailer
+<<
+/ID 
+[<46f6a3460762da2956d1d3fc19ab996f><46f6a3460762da2956d1d3fc19ab996f>]
+% ReportLab generated PDF document -- digest (http://www.reportlab.com)
+
+/Info 6 0 R
+/Root 5 0 R
+/Size 9
+>>
+startxref
+1186
+%%EOF
diff --git a/frontend/src/core/tests/test-fixtures/encrypted.pdf b/frontend/src/core/tests/test-fixtures/encrypted.pdf
new file mode 100644
index 0000000000..28fb757bd2
Binary files /dev/null and b/frontend/src/core/tests/test-fixtures/encrypted.pdf differ
diff --git a/frontend/src/core/tests/test-fixtures/sample.htm b/frontend/src/core/tests/test-fixtures/sample.htm
index 83a5260a7d..a756451d6e 100644
--- a/frontend/src/core/tests/test-fixtures/sample.htm
+++ b/frontend/src/core/tests/test-fixtures/sample.htm
@@ -1,106 +1,117 @@
-<!DOCTYPE html>
+<!doctype html>
 <html lang="en">
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>Test HTML Document</title>
     <style>
-        body {
-            font-family: Arial, sans-serif;
-            line-height: 1.6;
-            margin: 40px;
-            color: #333;
-        }
-        h1 {
-            color: #2c3e50;
-            border-bottom: 2px solid #3498db;
-            padding-bottom: 10px;
-        }
-        h2 {
-            color: #34495e;
-            margin-top: 30px;
-        }
-        table {
-            border-collapse: collapse;
-            width: 100%;
-            margin: 20px 0;
-        }
-        th, td {
-            border: 1px solid #ddd;
-            padding: 12px;
-            text-align: left;
-        }
-        th {
-            background-color: #f2f2f2;
-            font-weight: bold;
-        }
-        .highlight {
-            background-color: #fff3cd;
-            padding: 10px;
-            border-left: 4px solid #ffc107;
-            margin: 20px 0;
-        }
-        code {
-            background-color: #f8f9fa;
-            padding: 2px 4px;
-            border-radius: 4px;
-            font-family: 'Courier New', monospace;
-        }
+      body {
+        font-family: Arial, sans-serif;
+        line-height: 1.6;
+        margin: 40px;
+        color: #333;
+      }
+      h1 {
+        color: #2c3e50;
+        border-bottom: 2px solid #3498db;
+        padding-bottom: 10px;
+      }
+      h2 {
+        color: #34495e;
+        margin-top: 30px;
+      }
+      table {
+        border-collapse: collapse;
+        width: 100%;
+        margin: 20px 0;
+      }
+      th,
+      td {
+        border: 1px solid #ddd;
+        padding: 12px;
+        text-align: left;
+      }
+      th {
+        background-color: #f2f2f2;
+        font-weight: bold;
+      }
+      .highlight {
+        background-color: #fff3cd;
+        padding: 10px;
+        border-left: 4px solid #ffc107;
+        margin: 20px 0;
+      }
+      code {
+        background-color: #f8f9fa;
+        padding: 2px 4px;
+        border-radius: 4px;
+        font-family: "Courier New", monospace;
+      }
     </style>
-</head>
-<body>
+  </head>
+  <body>
     <h1>Test HTML Document for Convert Tool</h1>
-    
-    <p>This is a <strong>test HTML file</strong> for testing the HTML to PDF conversion functionality. It contains various HTML elements to ensure proper conversion.</p>
+
+    <p>
+      This is a <strong>test HTML file</strong> for testing the HTML to PDF
+      conversion functionality. It contains various HTML elements to ensure
+      proper conversion.
+    </p>
 
     <h2>Text Formatting</h2>
-    <p>This paragraph contains <strong>bold text</strong>, <em>italic text</em>, and <code>inline code</code>.</p>
-    
+    <p>
+      This paragraph contains <strong>bold text</strong>, <em>italic text</em>,
+      and <code>inline code</code>.
+    </p>
+
     <div class="highlight">
-        <p><strong>Important:</strong> This is a highlighted section that should be preserved in the PDF output.</p>
+      <p>
+        <strong>Important:</strong> This is a highlighted section that should be
+        preserved in the PDF output.
+      </p>
     </div>
 
     <h2>Lists</h2>
     <h3>Unordered List</h3>
     <ul>
-        <li>First item</li>
-        <li>Second item with <a href="https://example.com">a link</a></li>
-        <li>Third item</li>
+      <li>First item</li>
+      <li>Second item with <a href="https://example.com">a link</a></li>
+      <li>Third item</li>
     </ul>
 
     <h3>Ordered List</h3>
     <ol>
-        <li>Primary point</li>
-        <li>Secondary point</li>
-        <li>Tertiary point</li>
+      <li>Primary point</li>
+      <li>Secondary point</li>
+      <li>Tertiary point</li>
     </ol>
 
     <h2>Table</h2>
     <table>
-        <thead>
-            <tr>
-                <th>Column 1</th>
-                <th>Column 2</th>
-                <th>Column 3</th>
-            </tr>
-        </thead>
-        <tbody>
-            <tr>
-                <td>Data A</td>
-                <td>Data B</td>
-                <td>Data C</td>
-            </tr>
-            <tr>
-                <td>Test 1</td>
-                <td>Test 2</td>
-                <td>Test 3</td>
-            </tr>
-            <tr>
-                <td>Sample X</td>
-                <td>Sample Y</td>
-                <td>Sample Z</td>
-            </tr>
-        </tbody>
+      <thead>
+        <tr>
+          <th>Column 1</th>
+          <th>Column 2</th>
+          <th>Column 3</th>
+        </tr>
+      </thead>
+      <tbody>
+        <tr>
+          <td>Data A</td>
+          <td>Data B</td>
+          <td>Data C</td>
+        </tr>
+        <tr>
+          <td>Test 1</td>
+          <td>Test 2</td>
+          <td>Test 3</td>
+        </tr>
+        <tr>
+          <td>Sample X</td>
+          <td>Sample Y</td>
+          <td>Sample Z</td>
+        </tr>
+      </tbody>
     </table>
 
     <h2>Code Block</h2>
@@ -110,16 +121,20 @@
 }</code></pre>
 
     <h2>Final Notes</h2>
-    <p>This HTML document should convert to a well-formatted PDF that preserves:</p>
+    <p>
+      This HTML document should convert to a well-formatted PDF that preserves:
+    </p>
     <ul>
-        <li>Text formatting (bold, italic)</li>
-        <li>Headings and hierarchy</li>
-        <li>Tables with proper borders</li>
-        <li>Lists (ordered and unordered)</li>
-        <li>Code formatting</li>
-        <li>Basic CSS styling</li>
+      <li>Text formatting (bold, italic)</li>
+      <li>Headings and hierarchy</li>
+      <li>Tables with proper borders</li>
+      <li>Lists (ordered and unordered)</li>
+      <li>Code formatting</li>
+      <li>Basic CSS styling</li>
     </ul>
 
-    <p><small>Generated for Stirling PDF Convert Tool testing purposes.</small></p>
-</body>
-</html>
\ No newline at end of file
+    <p>
+      <small>Generated for Stirling PDF Convert Tool testing purposes.</small>
+    </p>
+  </body>
+</html>
diff --git a/frontend/src/core/tests/test-fixtures/sample.html b/frontend/src/core/tests/test-fixtures/sample.html
index 83a5260a7d..a756451d6e 100644
--- a/frontend/src/core/tests/test-fixtures/sample.html
+++ b/frontend/src/core/tests/test-fixtures/sample.html
@@ -1,106 +1,117 @@
-<!DOCTYPE html>
+<!doctype html>
 <html lang="en">
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>Test HTML Document</title>
     <style>
-        body {
-            font-family: Arial, sans-serif;
-            line-height: 1.6;
-            margin: 40px;
-            color: #333;
-        }
-        h1 {
-            color: #2c3e50;
-            border-bottom: 2px solid #3498db;
-            padding-bottom: 10px;
-        }
-        h2 {
-            color: #34495e;
-            margin-top: 30px;
-        }
-        table {
-            border-collapse: collapse;
-            width: 100%;
-            margin: 20px 0;
-        }
-        th, td {
-            border: 1px solid #ddd;
-            padding: 12px;
-            text-align: left;
-        }
-        th {
-            background-color: #f2f2f2;
-            font-weight: bold;
-        }
-        .highlight {
-            background-color: #fff3cd;
-            padding: 10px;
-            border-left: 4px solid #ffc107;
-            margin: 20px 0;
-        }
-        code {
-            background-color: #f8f9fa;
-            padding: 2px 4px;
-            border-radius: 4px;
-            font-family: 'Courier New', monospace;
-        }
+      body {
+        font-family: Arial, sans-serif;
+        line-height: 1.6;
+        margin: 40px;
+        color: #333;
+      }
+      h1 {
+        color: #2c3e50;
+        border-bottom: 2px solid #3498db;
+        padding-bottom: 10px;
+      }
+      h2 {
+        color: #34495e;
+        margin-top: 30px;
+      }
+      table {
+        border-collapse: collapse;
+        width: 100%;
+        margin: 20px 0;
+      }
+      th,
+      td {
+        border: 1px solid #ddd;
+        padding: 12px;
+        text-align: left;
+      }
+      th {
+        background-color: #f2f2f2;
+        font-weight: bold;
+      }
+      .highlight {
+        background-color: #fff3cd;
+        padding: 10px;
+        border-left: 4px solid #ffc107;
+        margin: 20px 0;
+      }
+      code {
+        background-color: #f8f9fa;
+        padding: 2px 4px;
+        border-radius: 4px;
+        font-family: "Courier New", monospace;
+      }
     </style>
-</head>
-<body>
+  </head>
+  <body>
     <h1>Test HTML Document for Convert Tool</h1>
-    
-    <p>This is a <strong>test HTML file</strong> for testing the HTML to PDF conversion functionality. It contains various HTML elements to ensure proper conversion.</p>
+
+    <p>
+      This is a <strong>test HTML file</strong> for testing the HTML to PDF
+      conversion functionality. It contains various HTML elements to ensure
+      proper conversion.
+    </p>
 
     <h2>Text Formatting</h2>
-    <p>This paragraph contains <strong>bold text</strong>, <em>italic text</em>, and <code>inline code</code>.</p>
-    
+    <p>
+      This paragraph contains <strong>bold text</strong>, <em>italic text</em>,
+      and <code>inline code</code>.
+    </p>
+
     <div class="highlight">
-        <p><strong>Important:</strong> This is a highlighted section that should be preserved in the PDF output.</p>
+      <p>
+        <strong>Important:</strong> This is a highlighted section that should be
+        preserved in the PDF output.
+      </p>
     </div>
 
     <h2>Lists</h2>
     <h3>Unordered List</h3>
     <ul>
-        <li>First item</li>
-        <li>Second item with <a href="https://example.com">a link</a></li>
-        <li>Third item</li>
+      <li>First item</li>
+      <li>Second item with <a href="https://example.com">a link</a></li>
+      <li>Third item</li>
     </ul>
 
     <h3>Ordered List</h3>
     <ol>
-        <li>Primary point</li>
-        <li>Secondary point</li>
-        <li>Tertiary point</li>
+      <li>Primary point</li>
+      <li>Secondary point</li>
+      <li>Tertiary point</li>
     </ol>
 
     <h2>Table</h2>
     <table>
-        <thead>
-            <tr>
-                <th>Column 1</th>
-                <th>Column 2</th>
-                <th>Column 3</th>
-            </tr>
-        </thead>
-        <tbody>
-            <tr>
-                <td>Data A</td>
-                <td>Data B</td>
-                <td>Data C</td>
-            </tr>
-            <tr>
-                <td>Test 1</td>
-                <td>Test 2</td>
-                <td>Test 3</td>
-            </tr>
-            <tr>
-                <td>Sample X</td>
-                <td>Sample Y</td>
-                <td>Sample Z</td>
-            </tr>
-        </tbody>
+      <thead>
+        <tr>
+          <th>Column 1</th>
+          <th>Column 2</th>
+          <th>Column 3</th>
+        </tr>
+      </thead>
+      <tbody>
+        <tr>
+          <td>Data A</td>
+          <td>Data B</td>
+          <td>Data C</td>
+        </tr>
+        <tr>
+          <td>Test 1</td>
+          <td>Test 2</td>
+          <td>Test 3</td>
+        </tr>
+        <tr>
+          <td>Sample X</td>
+          <td>Sample Y</td>
+          <td>Sample Z</td>
+        </tr>
+      </tbody>
     </table>
 
     <h2>Code Block</h2>
@@ -110,16 +121,20 @@
 }</code></pre>
 
     <h2>Final Notes</h2>
-    <p>This HTML document should convert to a well-formatted PDF that preserves:</p>
+    <p>
+      This HTML document should convert to a well-formatted PDF that preserves:
+    </p>
     <ul>
-        <li>Text formatting (bold, italic)</li>
-        <li>Headings and hierarchy</li>
-        <li>Tables with proper borders</li>
-        <li>Lists (ordered and unordered)</li>
-        <li>Code formatting</li>
-        <li>Basic CSS styling</li>
+      <li>Text formatting (bold, italic)</li>
+      <li>Headings and hierarchy</li>
+      <li>Tables with proper borders</li>
+      <li>Lists (ordered and unordered)</li>
+      <li>Code formatting</li>
+      <li>Basic CSS styling</li>
     </ul>
 
-    <p><small>Generated for Stirling PDF Convert Tool testing purposes.</small></p>
-</body>
-</html>
\ No newline at end of file
+    <p>
+      <small>Generated for Stirling PDF Convert Tool testing purposes.</small>
+    </p>
+  </body>
+</html>
diff --git a/frontend/src/core/tests/translation.test.ts b/frontend/src/core/tests/translation.test.ts
index e9e9e5f2fe..83f6935796 100644
--- a/frontend/src/core/tests/translation.test.ts
+++ b/frontend/src/core/tests/translation.test.ts
@@ -1,9 +1,9 @@
-import { describe, test, expect } from 'vitest';
-import fs from 'fs';
-import path from 'path';
-import { parse } from 'smol-toml';
+import { describe, test, expect } from "vitest";
+import fs from "fs";
+import path from "path";
+import { parse } from "smol-toml";
 
-const LOCALES_DIR = path.join(__dirname, '../../../public/locales');
+const LOCALES_DIR = path.join(__dirname, "../../../public/locales");
 
 // Get all locale directories for parameterized tests
 const getLocaleDirectories = () => {
@@ -11,41 +11,49 @@ const getLocaleDirectories = () => {
     return [];
   }
 
-  return fs.readdirSync(LOCALES_DIR, { withFileTypes: true })
-    .filter(dirent => dirent.isDirectory())
-    .map(dirent => dirent.name);
+  return fs
+    .readdirSync(LOCALES_DIR, { withFileTypes: true })
+    .filter((dirent) => dirent.isDirectory())
+    .map((dirent) => dirent.name);
 };
 
 const localeDirectories = getLocaleDirectories();
 
-describe('Translation TOML Validation', () => {
-  test('should find the locales directory', () => {
+describe("Translation TOML Validation", () => {
+  test("should find the locales directory", () => {
     expect(fs.existsSync(LOCALES_DIR)).toBe(true);
   });
 
-  test('should have at least one locale directory', () => {
+  test("should have at least one locale directory", () => {
     expect(localeDirectories.length).toBeGreaterThan(0);
   });
 
-  test.each(localeDirectories)('should have valid TOML in %s/translation.toml', (localeDir) => {
-    const translationFile = path.join(LOCALES_DIR, localeDir, 'translation.toml');
+  test.each(localeDirectories)(
+    "should have valid TOML in %s/translation.toml",
+    (localeDir) => {
+      const translationFile = path.join(
+        LOCALES_DIR,
+        localeDir,
+        "translation.toml",
+      );
 
-    // Check if file exists
-    expect(fs.existsSync(translationFile)).toBe(true);
+      // Check if file exists
+      expect(fs.existsSync(translationFile)).toBe(true);
 
-    // Read file content
-    const content = fs.readFileSync(translationFile, 'utf8');
-    expect(content.trim()).not.toBe('');
+      // Read file content
+      const content = fs.readFileSync(translationFile, "utf8");
+      expect(content.trim()).not.toBe("");
 
-    // Parse TOML - this will throw if invalid TOML
-    let tomlData;
-    expect(() => {
-      tomlData = parse(content);
-    }).not.toThrow();
+      // Parse TOML - this will throw if invalid TOML
+      let tomlData;
+      expect(() => {
+        tomlData = parse(content);
+      }).not.toThrow();
 
-    // Ensure it's an object at root level
-    expect(typeof tomlData).toBe('object');
-    expect(tomlData).not.toBeNull();
-    expect(Array.isArray(tomlData)).toBe(false);
-  });
+      // Ensure it's an object at root level
+      expect(typeof tomlData).toBe("object");
+      expect(tomlData).not.toBeNull();
+      expect(Array.isArray(tomlData)).toBe(false);
+    },
+  );
 });
diff --git a/frontend/src/core/tests/translationStructure.test.ts b/frontend/src/core/tests/translationStructure.test.ts
index a36b8e6fb7..1f61960358 100644
--- a/frontend/src/core/tests/translationStructure.test.ts
+++ b/frontend/src/core/tests/translationStructure.test.ts
@@ -1,29 +1,30 @@
-import { describe, test, expect } from 'vitest';
-import fs from 'fs';
-import path from 'path';
-import { parse } from 'smol-toml';
+import { describe, test, expect } from "vitest";
+import fs from "fs";
+import path from "path";
+import { parse } from "smol-toml";
 
-const LOCALES_DIR = path.join(__dirname, '../../../public/locales');
+const LOCALES_DIR = path.join(__dirname, "../../../public/locales");
 
 const getLocaleDirectories = () => {
   if (!fs.existsSync(LOCALES_DIR)) {
     return [];
   }
 
-  return fs.readdirSync(LOCALES_DIR, { withFileTypes: true })
-    .filter(dirent => dirent.isDirectory())
-    .map(dirent => dirent.name);
+  return fs
+    .readdirSync(LOCALES_DIR, { withFileTypes: true })
+    .filter((dirent) => dirent.isDirectory())
+    .map((dirent) => dirent.name);
 };
 
 const findDottedKeys = (node: unknown, segments: string[] = []): string[] => {
-  if (!node || typeof node !== 'object') {
+  if (!node || typeof node !== "object") {
     return [];
   }
 
   const issues: string[] = [];
   for (const [key, value] of Object.entries(node as Record<string, unknown>)) {
-    if (key.includes('.')) {
-      issues.push([...segments, key].join('.'));
+    if (key.includes(".")) {
+      issues.push([...segments, key].join("."));
     }
     issues.push(...findDottedKeys(value, [...segments, key]));
   }
@@ -32,21 +33,31 @@ const findDottedKeys = (node: unknown, segments: string[] = []): string[] => {
 
 const localeDirectories = getLocaleDirectories();
 
-describe('Translation key structure', () => {
-  test('should locate locales directory', () => {
+describe("Translation key structure", () => {
+  test("should locate locales directory", () => {
     expect(fs.existsSync(LOCALES_DIR)).toBe(true);
   });
 
-  test('should have at least one locale directory', () => {
+  test("should have at least one locale directory", () => {
     expect(localeDirectories.length).toBeGreaterThan(0);
   });
 
-  test.each(localeDirectories)('should not contain dotted keys in %s/translation.toml', (localeDir) => {
-    const translationFile = path.join(LOCALES_DIR, localeDir, 'translation.toml');
-    expect(fs.existsSync(translationFile)).toBe(true);
+  test.each(localeDirectories)(
+    "should not contain dotted keys in %s/translation.toml",
+    (localeDir) => {
+      const translationFile = path.join(
+        LOCALES_DIR,
+        localeDir,
+        "translation.toml",
+      );
+      expect(fs.existsSync(translationFile)).toBe(true);
 
-    const data = parse(fs.readFileSync(translationFile, 'utf8'));
-    const dottedKeys = findDottedKeys(data);
-    expect(dottedKeys, `Dotted keys found in ${localeDir}: ${dottedKeys.join(', ')}`).toHaveLength(0);
-  });
+      const data = parse(fs.readFileSync(translationFile, "utf8"));
+      const dottedKeys = findDottedKeys(data);
+      expect(
+        dottedKeys,
+        `Dotted keys found in ${localeDir}: ${dottedKeys.join(", ")}`,
+      ).toHaveLength(0);
+    },
+  );
 });
diff --git a/frontend/src/core/tests/utils/testFileHelpers.ts b/frontend/src/core/tests/utils/testFileHelpers.ts
index 72f435e871..b726b70395 100644
--- a/frontend/src/core/tests/utils/testFileHelpers.ts
+++ b/frontend/src/core/tests/utils/testFileHelpers.ts
@@ -2,15 +2,15 @@
  * Test utilities for creating StirlingFile objects in tests
  */
 
-import { StirlingFile, createStirlingFile } from '@app/types/fileContext';
+import { StirlingFile, createStirlingFile } from "@app/types/fileContext";
 
 /**
  * Create a StirlingFile object for testing purposes
  */
 export function createTestStirlingFile(
   name: string,
-  content: string = 'test content',
-  type: string = 'application/pdf'
+  content: string = "test content",
+  type: string = "application/pdf",
 ): StirlingFile {
   const file = new File([content], name, { type });
   return createStirlingFile(file);
@@ -20,9 +20,10 @@ export function createTestStirlingFile(
  * Create multiple StirlingFile objects for testing
  */
 export function createTestFilesWithId(
-  files: Array<{ name: string; content?: string; type?: string }>
+  files: Array<{ name: string; content?: string; type?: string }>,
 ): StirlingFile[] {
-  return files.map(({ name, content = 'test content', type = 'application/pdf' }) =>
-    createTestStirlingFile(name, content, type)
+  return files.map(
+    ({ name, content = "test content", type = "application/pdf" }) =>
+      createTestStirlingFile(name, content, type),
   );
-}
\ No newline at end of file
+}
diff --git a/frontend/src/core/theme/mantineTheme.ts b/frontend/src/core/theme/mantineTheme.ts
index 2254566a6d..ac36eb515f 100644
--- a/frontend/src/core/theme/mantineTheme.ts
+++ b/frontend/src/core/theme/mantineTheme.ts
@@ -1,61 +1,61 @@
-import { createTheme, MantineColorsTuple } from '@mantine/core';
+import { createTheme, MantineColorsTuple } from "@mantine/core";
 
 // Define color tuples using CSS variables
 const primary: MantineColorsTuple = [
-  'var(--color-primary-50)',
-  'var(--color-primary-100)',
-  'var(--color-primary-200)',
-  'var(--color-primary-300)',
-  'var(--color-primary-400)',
-  'var(--color-primary-500)',
-  'var(--color-primary-600)',
-  'var(--color-primary-700)',
-  'var(--color-primary-800)',
-  'var(--color-primary-900)',
+  "var(--color-primary-50)",
+  "var(--color-primary-100)",
+  "var(--color-primary-200)",
+  "var(--color-primary-300)",
+  "var(--color-primary-400)",
+  "var(--color-primary-500)",
+  "var(--color-primary-600)",
+  "var(--color-primary-700)",
+  "var(--color-primary-800)",
+  "var(--color-primary-900)",
 ];
 
 const green: MantineColorsTuple = [
-  'var(--color-green-50)',
-  'var(--color-green-100)',
-  'var(--color-green-200)',
-  'var(--color-green-300)',
-  'var(--color-green-400)',
-  'var(--color-green-500)',
-  'var(--color-green-600)',
-  'var(--color-green-700)',
-  'var(--color-green-800)',
-  'var(--color-green-900)',
+  "var(--color-green-50)",
+  "var(--color-green-100)",
+  "var(--color-green-200)",
+  "var(--color-green-300)",
+  "var(--color-green-400)",
+  "var(--color-green-500)",
+  "var(--color-green-600)",
+  "var(--color-green-700)",
+  "var(--color-green-800)",
+  "var(--color-green-900)",
 ];
 
 const yellow: MantineColorsTuple = [
-  'var(--color-yellow-50)',
-  'var(--color-yellow-100)',
-  'var(--color-yellow-200)',
-  'var(--color-yellow-300)',
-  'var(--color-yellow-400)',
-  'var(--color-yellow-500)',
-  'var(--color-yellow-600)',
-  'var(--color-yellow-700)',
-  'var(--color-yellow-800)',
-  'var(--color-yellow-900)',
+  "var(--color-yellow-50)",
+  "var(--color-yellow-100)",
+  "var(--color-yellow-200)",
+  "var(--color-yellow-300)",
+  "var(--color-yellow-400)",
+  "var(--color-yellow-500)",
+  "var(--color-yellow-600)",
+  "var(--color-yellow-700)",
+  "var(--color-yellow-800)",
+  "var(--color-yellow-900)",
 ];
 
 const gray: MantineColorsTuple = [
-  'var(--color-gray-50)',
-  'var(--color-gray-100)',
-  'var(--color-gray-200)',
-  'var(--color-gray-300)',
-  'var(--color-gray-400)',
-  'var(--color-gray-500)',
-  'var(--color-gray-600)',
-  'var(--color-gray-700)',
-  'var(--color-gray-800)',
-  'var(--color-gray-900)',
+  "var(--color-gray-50)",
+  "var(--color-gray-100)",
+  "var(--color-gray-200)",
+  "var(--color-gray-300)",
+  "var(--color-gray-400)",
+  "var(--color-gray-500)",
+  "var(--color-gray-600)",
+  "var(--color-gray-700)",
+  "var(--color-gray-800)",
+  "var(--color-gray-900)",
 ];
 
 export const mantineTheme = createTheme({
   // Primary color
-  primaryColor: 'primary',
+  primaryColor: "primary",
 
   // Color palette
   colors: {
@@ -67,38 +67,38 @@ export const mantineTheme = createTheme({
 
   // Spacing system - uses CSS variables
   spacing: {
-    xs: 'var(--space-xs)',
-    sm: 'var(--space-sm)',
-    md: 'var(--space-md)',
-    lg: 'var(--space-lg)',
-    xl: 'var(--space-xl)',
+    xs: "var(--space-xs)",
+    sm: "var(--space-sm)",
+    md: "var(--space-md)",
+    lg: "var(--space-lg)",
+    xl: "var(--space-xl)",
   },
 
   // Border radius system
   radius: {
-    xs: 'var(--radius-xs)',
-    sm: 'var(--radius-sm)',
-    md: 'var(--radius-md)',
-    lg: 'var(--radius-lg)',
-    xl: 'var(--radius-xl)',
+    xs: "var(--radius-xs)",
+    sm: "var(--radius-sm)",
+    md: "var(--radius-md)",
+    lg: "var(--radius-lg)",
+    xl: "var(--radius-xl)",
   },
 
   // Shadow system
   shadows: {
-    xs: 'var(--shadow-xs)',
-    sm: 'var(--shadow-sm)',
-    md: 'var(--shadow-md)',
-    lg: 'var(--shadow-lg)',
-    xl: 'var(--shadow-xl)',
+    xs: "var(--shadow-xs)",
+    sm: "var(--shadow-sm)",
+    md: "var(--shadow-md)",
+    lg: "var(--shadow-lg)",
+    xl: "var(--shadow-xl)",
   },
 
   // Custom variables for specific components
   other: {
     crop: {
-      overlayBorder: 'var(--color-primary-500)',
-      overlayBackground: 'rgba(59, 130, 246, 0.1)', // Blue with 10% opacity
-      handleColor: 'var(--color-primary-500)',
-      handleBorder: 'var(--bg-surface)',
+      overlayBorder: "var(--color-primary-500)",
+      overlayBackground: "rgba(59, 130, 246, 0.1)", // Blue with 10% opacity
+      handleColor: "var(--color-primary-500)",
+      handleBorder: "var(--bg-surface)",
     },
   },
 
@@ -107,20 +107,20 @@ export const mantineTheme = createTheme({
     Button: {
       styles: {
         root: {
-          fontWeight: 'var(--font-weight-medium)',
-          transition: 'all 0.2s ease',
+          fontWeight: "var(--font-weight-medium)",
+          transition: "all 0.2s ease",
         },
       },
       variants: {
         // Custom button variant for PDF tools
         pdfTool: (_theme: any) => ({
           root: {
-            backgroundColor: 'var(--bg-surface)',
-            border: '1px solid var(--border-default)',
-            color: 'var(--text-primary)',
-            '&:hover': {
-              backgroundColor: 'var(--hover-bg)',
-              borderColor: 'var(--color-primary-500)',
+            backgroundColor: "var(--bg-surface)",
+            border: "1px solid var(--border-default)",
+            color: "var(--text-primary)",
+            "&:hover": {
+              backgroundColor: "var(--hover-bg)",
+              borderColor: "var(--color-primary-500)",
             },
           },
         }),
@@ -130,8 +130,8 @@ export const mantineTheme = createTheme({
     Paper: {
       styles: {
         root: {
-          backgroundColor: 'var(--bg-surface)',
-          border: '1px solid var(--border-subtle)',
+          backgroundColor: "var(--bg-surface)",
+          border: "1px solid var(--border-subtle)",
         },
       },
     },
@@ -139,26 +139,26 @@ export const mantineTheme = createTheme({
     Card: {
       styles: {
         root: {
-          backgroundColor: 'var(--bg-surface)',
-          border: '1px solid var(--border-subtle)',
-          boxShadow: 'var(--shadow-sm)',
+          backgroundColor: "var(--bg-surface)",
+          border: "1px solid var(--border-subtle)",
+          boxShadow: "var(--shadow-sm)",
         },
       },
     },
     Textarea: {
       styles: (_theme: any) => ({
         input: {
-          backgroundColor: 'var(--bg-surface)',
-          borderColor: 'var(--border-default)',
-          color: 'var(--text-primary)',
-          '&:focus': {
-            borderColor: 'var(--color-primary-500)',
-            boxShadow: '0 0 0 1px var(--color-primary-500)',
+          backgroundColor: "var(--bg-surface)",
+          borderColor: "var(--border-default)",
+          color: "var(--text-primary)",
+          "&:focus": {
+            borderColor: "var(--color-primary-500)",
+            boxShadow: "0 0 0 1px var(--color-primary-500)",
           },
         },
         label: {
-          color: 'var(--text-secondary)',
-          fontWeight: 'var(--font-weight-medium)',
+          color: "var(--text-secondary)",
+          fontWeight: "var(--font-weight-medium)",
         },
       }),
     },
@@ -166,35 +166,35 @@ export const mantineTheme = createTheme({
     TextInput: {
       styles: (_theme: any) => ({
         input: {
-          backgroundColor: 'var(--bg-surface)',
-          borderColor: 'var(--border-default)',
-          color: 'var(--text-primary)',
-          '&:focus': {
-            borderColor: 'var(--color-primary-500)',
-            boxShadow: '0 0 0 1px var(--color-primary-500)',
+          backgroundColor: "var(--bg-surface)",
+          borderColor: "var(--border-default)",
+          color: "var(--text-primary)",
+          "&:focus": {
+            borderColor: "var(--color-primary-500)",
+            boxShadow: "0 0 0 1px var(--color-primary-500)",
           },
         },
         label: {
-          color: 'var(--text-secondary)',
-          fontWeight: 'var(--font-weight-medium)',
+          color: "var(--text-secondary)",
+          fontWeight: "var(--font-weight-medium)",
         },
       }),
     },
 
-     PasswordInput: {
+    PasswordInput: {
       styles: (_theme: any) => ({
         input: {
-          backgroundColor: 'var(--bg-surface)',
-          borderColor: 'var(--border-default)',
-          color: 'var(--text-primary)',
-          '&:focus': {
-            borderColor: 'var(--color-primary-500)',
-            boxShadow: '0 0 0 1px var(--color-primary-500)',
+          backgroundColor: "var(--bg-surface)",
+          borderColor: "var(--border-default)",
+          color: "var(--text-primary)",
+          "&:focus": {
+            borderColor: "var(--color-primary-500)",
+            boxShadow: "0 0 0 1px var(--color-primary-500)",
           },
         },
         label: {
-          color: 'var(--text-secondary)',
-          fontWeight: 'var(--font-weight-medium)',
+          color: "var(--text-secondary)",
+          fontWeight: "var(--font-weight-medium)",
         },
       }),
     },
@@ -202,27 +202,27 @@ export const mantineTheme = createTheme({
     Select: {
       styles: {
         input: {
-          backgroundColor: 'var(--bg-surface)',
-          borderColor: 'var(--border-default)',
-          color: 'var(--text-primary)',
-          '&:focus': {
-            borderColor: 'var(--color-primary-500)',
-            boxShadow: '0 0 0 1px var(--color-primary-500)',
+          backgroundColor: "var(--bg-surface)",
+          borderColor: "var(--border-default)",
+          color: "var(--text-primary)",
+          "&:focus": {
+            borderColor: "var(--color-primary-500)",
+            boxShadow: "0 0 0 1px var(--color-primary-500)",
           },
         },
         label: {
-          color: 'var(--text-secondary)',
-          fontWeight: 'var(--font-weight-medium)',
+          color: "var(--text-secondary)",
+          fontWeight: "var(--font-weight-medium)",
         },
         dropdown: {
-          backgroundColor: 'var(--bg-surface)',
-          borderColor: 'var(--border-subtle)',
-          boxShadow: 'var(--shadow-lg)',
+          backgroundColor: "var(--bg-surface)",
+          borderColor: "var(--border-subtle)",
+          boxShadow: "var(--shadow-lg)",
         },
         option: {
-          color: 'var(--text-primary)',
-          '--combobox-option-hover': 'var(--hover-bg)',
-          '--combobox-option-selected': 'var(--color-primary-100)',
+          color: "var(--text-primary)",
+          "--combobox-option-hover": "var(--hover-bg)",
+          "--combobox-option-selected": "var(--color-primary-100)",
         } as any,
       },
     },
@@ -230,40 +230,40 @@ export const mantineTheme = createTheme({
     MultiSelect: {
       styles: {
         input: {
-          backgroundColor: 'var(--bg-surface)',
-          borderColor: 'var(--border-default)',
-          color: 'var(--text-primary)',
-          '&:focus': {
-            borderColor: 'var(--color-primary-500)',
-            boxShadow: '0 0 0 1px var(--color-primary-500)',
+          backgroundColor: "var(--bg-surface)",
+          borderColor: "var(--border-default)",
+          color: "var(--text-primary)",
+          "&:focus": {
+            borderColor: "var(--color-primary-500)",
+            boxShadow: "0 0 0 1px var(--color-primary-500)",
           },
         },
         label: {
-          color: 'var(--text-secondary)',
-          fontWeight: 'var(--font-weight-medium)',
+          color: "var(--text-secondary)",
+          fontWeight: "var(--font-weight-medium)",
         },
         dropdown: {
-          backgroundColor: 'var(--bg-surface)',
-          borderColor: 'var(--border-subtle)',
-          boxShadow: 'var(--shadow-lg)',
+          backgroundColor: "var(--bg-surface)",
+          borderColor: "var(--border-subtle)",
+          boxShadow: "var(--shadow-lg)",
         },
         option: {
-          color: 'var(--text-primary)',
-          '--combobox-option-hover': 'var(--hover-bg)',
-          '--combobox-option-selected': 'var(--color-primary-100)',
+          color: "var(--text-primary)",
+          "--combobox-option-hover": "var(--hover-bg)",
+          "--combobox-option-selected": "var(--color-primary-100)",
         } as any,
       },
     },
     Tooltip: {
       styles: {
         tooltip: {
-          backgroundColor: 'var( --tooltip-title-bg)',
-          color: 'var( --tooltip-title-color)',
-          border: '1px solid var(--tooltip-borderp)',
-          fontSize: '0.75rem',
-          fontWeight: '500',
-          boxShadow: 'var(--shadow-md)',
-          borderRadius: 'var(--radius-sm)',
+          backgroundColor: "var( --tooltip-title-bg)",
+          color: "var( --tooltip-title-color)",
+          border: "1px solid var(--tooltip-borderp)",
+          fontSize: "0.75rem",
+          fontWeight: "500",
+          boxShadow: "var(--shadow-md)",
+          borderRadius: "var(--radius-sm)",
         },
       },
     },
@@ -271,14 +271,14 @@ export const mantineTheme = createTheme({
     Checkbox: {
       styles: {
         input: {
-          borderColor: 'var(--border-default)',
-          '&:checked': {
-            backgroundColor: 'var(--color-primary-500)',
-            borderColor: 'var(--color-primary-500)',
+          borderColor: "var(--border-default)",
+          "&:checked": {
+            backgroundColor: "var(--color-primary-500)",
+            borderColor: "var(--color-primary-500)",
           },
         },
         label: {
-          color: 'var(--text-primary)',
+          color: "var(--text-primary)",
         },
       },
     },
@@ -286,20 +286,20 @@ export const mantineTheme = createTheme({
     Slider: {
       styles: {
         track: {
-          backgroundColor: 'var(--bg-muted)',
+          backgroundColor: "var(--bg-muted)",
         },
         bar: {
-          backgroundColor: 'var(--color-primary-500)',
+          backgroundColor: "var(--color-primary-500)",
         },
         thumb: {
-          backgroundColor: 'var(--color-primary-500)',
-          borderColor: 'var(--color-primary-500)',
+          backgroundColor: "var(--color-primary-500)",
+          borderColor: "var(--color-primary-500)",
         },
         mark: {
-          borderColor: 'var(--border-default)',
+          borderColor: "var(--border-default)",
         },
         markLabel: {
-          color: 'var(--text-muted)',
+          color: "var(--text-muted)",
         },
       },
     },
@@ -307,17 +307,17 @@ export const mantineTheme = createTheme({
     Modal: {
       styles: {
         content: {
-          backgroundColor: 'var(--bg-surface)',
-          border: '1px solid var(--border-subtle)',
-          boxShadow: 'var(--shadow-xl)',
+          backgroundColor: "var(--bg-surface)",
+          border: "1px solid var(--border-subtle)",
+          boxShadow: "var(--shadow-xl)",
         },
         header: {
-          backgroundColor: 'var(--bg-surface)',
-          borderBottom: '1px solid var(--border-subtle)',
+          backgroundColor: "var(--bg-surface)",
+          borderBottom: "1px solid var(--border-subtle)",
         },
         title: {
-          color: 'var(--text-primary)',
-          fontWeight: 'var(--font-weight-semibold)',
+          color: "var(--text-primary)",
+          fontWeight: "var(--font-weight-semibold)",
         },
       },
     },
@@ -325,15 +325,15 @@ export const mantineTheme = createTheme({
     Notification: {
       styles: {
         root: {
-          backgroundColor: 'var(--bg-surface)',
-          border: '1px solid var(--border-subtle)',
-          boxShadow: 'var(--shadow-lg)',
+          backgroundColor: "var(--bg-surface)",
+          border: "1px solid var(--border-subtle)",
+          boxShadow: "var(--shadow-lg)",
         },
         title: {
-          color: 'var(--text-primary)',
+          color: "var(--text-primary)",
         },
         description: {
-          color: 'var(--text-secondary)',
+          color: "var(--text-secondary)",
         },
       },
     },
@@ -341,15 +341,15 @@ export const mantineTheme = createTheme({
     SegmentedControl: {
       styles: {
         root: {
-          backgroundColor: 'var(--bg-muted)',
-          border: '1px solid var(--border-subtle)',
+          backgroundColor: "var(--bg-muted)",
+          border: "1px solid var(--border-subtle)",
         },
         control: {
-          color: 'var(--text-secondary)',
-          '&[dataActive]': {
-            backgroundColor: 'var(--bg-surface)',
-            color: 'var(--text-primary)',
-            boxShadow: 'var(--shadow-sm)',
+          color: "var(--text-secondary)",
+          "&[dataActive]": {
+            backgroundColor: "var(--bg-surface)",
+            color: "var(--text-primary)",
+            boxShadow: "var(--shadow-sm)",
           },
         },
       },
diff --git a/frontend/src/core/tools/AddAttachments.tsx b/frontend/src/core/tools/AddAttachments.tsx
index 036f0e7e36..22c9713b68 100644
--- a/frontend/src/core/tools/AddAttachments.tsx
+++ b/frontend/src/core/tools/AddAttachments.tsx
@@ -1,6 +1,6 @@
 import { useEffect } from "react";
 import { useTranslation } from "react-i18next";
-import { useFileSelection } from "@app/contexts/FileContext";
+import { useViewScopedFiles } from "@app/hooks/tools/shared/useViewScopedFiles";
 import { createToolFlow } from "@app/components/tools/shared/createToolFlow";
 import { BaseToolProps, ToolComponent } from "@app/types/tool";
 import { useEndpointEnabled } from "@app/hooks/useEndpointConfig";
@@ -10,15 +10,20 @@ import { useAccordionSteps } from "@app/hooks/tools/shared/useAccordionSteps";
 import AddAttachmentsSettings from "@app/components/tools/addAttachments/AddAttachmentsSettings";
 import { useAddAttachmentsTips } from "@app/components/tooltips/useAddAttachmentsTips";
 
-const AddAttachments = ({ onPreviewFile, onComplete, onError }: BaseToolProps) => {
+const AddAttachments = ({
+  onPreviewFile,
+  onComplete,
+  onError,
+}: BaseToolProps) => {
   const { t } = useTranslation();
-  const { selectedFiles } = useFileSelection();
+  const selectedFiles = useViewScopedFiles();
   const addAttachmentsTips = useAddAttachmentsTips();
 
   const params = useAddAttachmentsParameters();
   const operation = useAddAttachmentsOperation();
 
-  const { enabled: endpointEnabled, loading: endpointLoading } = useEndpointEnabled("add-attachments");
+  const { enabled: endpointEnabled, loading: endpointLoading } =
+    useEndpointEnabled("add-attachments");
 
   useEffect(() => {
     operation.resetResults();
@@ -32,16 +37,23 @@ const AddAttachments = ({ onPreviewFile, onComplete, onError }: BaseToolProps) =
         onComplete(operation.files);
       }
     } catch (error: any) {
-      onError?.(error?.message || t("AddAttachmentsRequest.error.failed", "Add attachments operation failed"));
+      onError?.(
+        error?.message ||
+          t(
+            "AddAttachmentsRequest.error.failed",
+            "Add attachments operation failed",
+          ),
+      );
     }
   };
 
   const hasFiles = selectedFiles.length > 0;
-  const hasResults = operation.files.length > 0 || operation.downloadUrl !== null;
+  const hasResults =
+    operation.files.length > 0 || operation.downloadUrl !== null;
 
   enum AddAttachmentsStep {
-    NONE = 'none',
-    ATTACHMENTS = 'attachments'
+    NONE = "none",
+    ATTACHMENTS = "attachments",
   }
 
   const accordion = useAccordionSteps<AddAttachmentsStep>({
@@ -49,12 +61,12 @@ const AddAttachments = ({ onPreviewFile, onComplete, onError }: BaseToolProps) =
     initialStep: AddAttachmentsStep.ATTACHMENTS,
     stateConditions: {
       hasFiles,
-      hasResults: false // Don't collapse when there are results for add attachments
+      hasResults: false, // Don't collapse when there are results for add attachments
     },
     afterResults: () => {
       operation.resetResults();
       onPreviewFile?.(null);
-    }
+    },
   });
 
   const getSteps = () => {
@@ -64,7 +76,8 @@ const AddAttachments = ({ onPreviewFile, onComplete, onError }: BaseToolProps) =
     steps.push({
       title: t("AddAttachmentsRequest.attachments", "Select Attachments"),
       isCollapsed: accordion.getCollapsedState(AddAttachmentsStep.ATTACHMENTS),
-      onCollapsedClick: () => accordion.handleStepToggle(AddAttachmentsStep.ATTACHMENTS),
+      onCollapsedClick: () =>
+        accordion.handleStepToggle(AddAttachmentsStep.ATTACHMENTS),
       isVisible: true,
       tooltip: addAttachmentsTips,
       content: (
@@ -86,9 +99,9 @@ const AddAttachments = ({ onPreviewFile, onComplete, onError }: BaseToolProps) =
     },
     steps: getSteps(),
     executeButton: {
-      text: t('AddAttachmentsRequest.submit', 'Add Attachments'),
+      text: t("AddAttachmentsRequest.submit", "Add Attachments"),
       isVisible: !hasResults,
-      loadingText: t('loading'),
+      loadingText: t("loading"),
       onClick: handleExecute,
       endpointEnabled: endpointEnabled,
       paramsValid: params.validateParameters(),
@@ -96,7 +109,7 @@ const AddAttachments = ({ onPreviewFile, onComplete, onError }: BaseToolProps) =
     review: {
       isVisible: hasResults,
       operation: operation,
-      title: t('AddAttachmentsRequest.results.title', 'Attachment Results'),
+      title: t("AddAttachmentsRequest.results.title", "Attachment Results"),
       onFileClick: (file) => onPreviewFile?.(file),
       onUndo: async () => {
         await operation.undoOperation();
diff --git a/frontend/src/core/tools/AddImage.tsx b/frontend/src/core/tools/AddImage.tsx
index 474e14a6e8..f833ef12ac 100644
--- a/frontend/src/core/tools/AddImage.tsx
+++ b/frontend/src/core/tools/AddImage.tsx
@@ -1,12 +1,12 @@
-import { createStampTool } from '@app/tools/stamp/createStampTool';
+import { createStampTool } from "@app/tools/stamp/createStampTool";
 
 // AddImage allows users to place image-only stamps
 const AddImage = createStampTool({
-  toolId: 'addImage',
-  translationScope: 'addImage',
-  allowedSignatureSources: ['image'],
-  defaultSignatureSource: 'image',
-  defaultSignatureType: 'image',
+  toolId: "addImage",
+  translationScope: "addImage",
+  allowedSignatureSources: ["image"],
+  defaultSignatureSource: "image",
+  defaultSignatureType: "image",
   enableApplyAction: true,
 });
 
diff --git a/frontend/src/core/tools/AddPageNumbers.tsx b/frontend/src/core/tools/AddPageNumbers.tsx
index 1f7f09c78c..db6e5404e5 100644
--- a/frontend/src/core/tools/AddPageNumbers.tsx
+++ b/frontend/src/core/tools/AddPageNumbers.tsx
@@ -1,6 +1,6 @@
 import { useEffect } from "react";
 import { useTranslation } from "react-i18next";
-import { useFileSelection } from "@app/contexts/FileContext";
+import { useViewScopedFiles } from "@app/hooks/tools/shared/useViewScopedFiles";
 import { createToolFlow } from "@app/components/tools/shared/createToolFlow";
 import { BaseToolProps, ToolComponent } from "@app/types/tool";
 import { useEndpointEnabled } from "@app/hooks/useEndpointConfig";
@@ -10,14 +10,19 @@ import { useAccordionSteps } from "@app/hooks/tools/shared/useAccordionSteps";
 import AddPageNumbersPositionSettings from "@app/components/tools/addPageNumbers/AddPageNumbersPositionSettings";
 import AddPageNumbersAppearanceSettings from "@app/components/tools/addPageNumbers/AddPageNumbersAppearanceSettings";
 
-const AddPageNumbers = ({ onPreviewFile, onComplete, onError }: BaseToolProps) => {
+const AddPageNumbers = ({
+  onPreviewFile,
+  onComplete,
+  onError,
+}: BaseToolProps) => {
   const { t } = useTranslation();
-  const { selectedFiles } = useFileSelection();
+  const selectedFiles = useViewScopedFiles();
 
   const params = useAddPageNumbersParameters();
   const operation = useAddPageNumbersOperation();
 
-  const { enabled: endpointEnabled, loading: endpointLoading } = useEndpointEnabled("add-page-numbers");
+  const { enabled: endpointEnabled, loading: endpointLoading } =
+    useEndpointEnabled("add-page-numbers");
 
   useEffect(() => {
     operation.resetResults();
@@ -31,17 +36,21 @@ const AddPageNumbers = ({ onPreviewFile, onComplete, onError }: BaseToolProps) =
         onComplete(operation.files);
       }
     } catch (error: any) {
-      onError?.(error?.message || t("addPageNumbers.error.failed", "Add page numbers operation failed"));
+      onError?.(
+        error?.message ||
+          t("addPageNumbers.error.failed", "Add page numbers operation failed"),
+      );
     }
   };
 
   const hasFiles = selectedFiles.length > 0;
-  const hasResults = operation.files.length > 0 || operation.downloadUrl !== null;
+  const hasResults =
+    operation.files.length > 0 || operation.downloadUrl !== null;
 
   enum AddPageNumbersStep {
-    NONE = 'none',
-    POSITION_AND_PAGES = 'position_and_pages',
-    CUSTOMIZE = 'customize'
+    NONE = "none",
+    POSITION_AND_PAGES = "position_and_pages",
+    CUSTOMIZE = "customize",
   }
 
   const accordion = useAccordionSteps<AddPageNumbersStep>({
@@ -49,12 +58,12 @@ const AddPageNumbers = ({ onPreviewFile, onComplete, onError }: BaseToolProps) =
     initialStep: AddPageNumbersStep.POSITION_AND_PAGES,
     stateConditions: {
       hasFiles,
-      hasResults
+      hasResults,
     },
     afterResults: () => {
       operation.resetResults();
       onPreviewFile?.(null);
-    }
+    },
   });
 
   const getSteps = () => {
@@ -63,8 +72,11 @@ const AddPageNumbers = ({ onPreviewFile, onComplete, onError }: BaseToolProps) =
     // Step 1: Position Selection & Pages/Starting Number
     steps.push({
       title: t("addPageNumbers.positionAndPages", "Position & Pages"),
-      isCollapsed: accordion.getCollapsedState(AddPageNumbersStep.POSITION_AND_PAGES),
-      onCollapsedClick: () => accordion.handleStepToggle(AddPageNumbersStep.POSITION_AND_PAGES),
+      isCollapsed: accordion.getCollapsedState(
+        AddPageNumbersStep.POSITION_AND_PAGES,
+      ),
+      onCollapsedClick: () =>
+        accordion.handleStepToggle(AddPageNumbersStep.POSITION_AND_PAGES),
       isVisible: hasFiles || hasResults,
       content: (
         <AddPageNumbersPositionSettings
@@ -81,7 +93,8 @@ const AddPageNumbers = ({ onPreviewFile, onComplete, onError }: BaseToolProps) =
     steps.push({
       title: t("addPageNumbers.customize", "Customize Appearance"),
       isCollapsed: accordion.getCollapsedState(AddPageNumbersStep.CUSTOMIZE),
-      onCollapsedClick: () => accordion.handleStepToggle(AddPageNumbersStep.CUSTOMIZE),
+      onCollapsedClick: () =>
+        accordion.handleStepToggle(AddPageNumbersStep.CUSTOMIZE),
       isVisible: hasFiles || hasResults,
       content: (
         <AddPageNumbersAppearanceSettings
@@ -102,9 +115,9 @@ const AddPageNumbers = ({ onPreviewFile, onComplete, onError }: BaseToolProps) =
     },
     steps: getSteps(),
     executeButton: {
-      text: t('addPageNumbers.submit', 'Add Page Numbers'),
+      text: t("addPageNumbers.submit", "Add Page Numbers"),
       isVisible: !hasResults,
-      loadingText: t('loading'),
+      loadingText: t("loading"),
       onClick: handleExecute,
       endpointEnabled: endpointEnabled,
       paramsValid: params.validateParameters(),
@@ -112,7 +125,7 @@ const AddPageNumbers = ({ onPreviewFile, onComplete, onError }: BaseToolProps) =
     review: {
       isVisible: hasResults,
       operation: operation,
-      title: t('addPageNumbers.results.title', 'Page Number Results'),
+      title: t("addPageNumbers.results.title", "Page Number Results"),
       onFileClick: (file) => onPreviewFile?.(file),
       onUndo: async () => {
         await operation.undoOperation();
@@ -124,4 +137,4 @@ const AddPageNumbers = ({ onPreviewFile, onComplete, onError }: BaseToolProps) =
 
 AddPageNumbers.tool = () => useAddPageNumbersOperation;
 
-export default AddPageNumbers as ToolComponent;
\ No newline at end of file
+export default AddPageNumbers as ToolComponent;
diff --git a/frontend/src/core/tools/AddPassword.tsx b/frontend/src/core/tools/AddPassword.tsx
index 72657ae80a..615ab52b9a 100644
--- a/frontend/src/core/tools/AddPassword.tsx
+++ b/frontend/src/core/tools/AddPassword.tsx
@@ -1,7 +1,7 @@
 import { useEffect, useState } from "react";
 import { useTranslation } from "react-i18next";
 import { useEndpointEnabled } from "@app/hooks/useEndpointConfig";
-import { useFileSelection } from "@app/contexts/FileContext";
+import { useViewScopedFiles } from "@app/hooks/tools/shared/useViewScopedFiles";
 
 import { createToolFlow } from "@app/components/tools/shared/createToolFlow";
 
@@ -16,7 +16,7 @@ import { BaseToolProps, ToolComponent } from "@app/types/tool";
 
 const AddPassword = ({ onPreviewFile, onComplete, onError }: BaseToolProps) => {
   const { t } = useTranslation();
-  const { selectedFiles } = useFileSelection();
+  const selectedFiles = useViewScopedFiles();
 
   const [collapsedPermissions, setCollapsedPermissions] = useState(true);
 
@@ -26,9 +26,8 @@ const AddPassword = ({ onPreviewFile, onComplete, onError }: BaseToolProps) => {
   const addPasswordPermissionsTips = useAddPasswordPermissionsTips();
 
   // Endpoint validation
-  const { enabled: endpointEnabled, loading: endpointLoading } = useEndpointEnabled(addPasswordParams.getEndpointName());
-
-
+  const { enabled: endpointEnabled, loading: endpointLoading } =
+    useEndpointEnabled(addPasswordParams.getEndpointName());
 
   useEffect(() => {
     addPasswordOperation.resetResults();
@@ -37,13 +36,20 @@ const AddPassword = ({ onPreviewFile, onComplete, onError }: BaseToolProps) => {
 
   const handleAddPassword = async () => {
     try {
-      await addPasswordOperation.executeOperation(addPasswordParams.fullParameters, selectedFiles);
+      await addPasswordOperation.executeOperation(
+        addPasswordParams.fullParameters,
+        selectedFiles,
+      );
       if (addPasswordOperation.files && onComplete) {
         onComplete(addPasswordOperation.files);
       }
     } catch (error) {
       if (onError) {
-        onError(error instanceof Error ? error.message : t("addPassword.error.failed", "Add password operation failed"));
+        onError(
+          error instanceof Error
+            ? error.message
+            : t("addPassword.error.failed", "Add password operation failed"),
+        );
       }
     }
   };
@@ -64,7 +70,9 @@ const AddPassword = ({ onPreviewFile, onComplete, onError }: BaseToolProps) => {
   };
 
   const hasFiles = selectedFiles.length > 0;
-  const hasResults = addPasswordOperation.files.length > 0 || addPasswordOperation.downloadUrl !== null;
+  const hasResults =
+    addPasswordOperation.files.length > 0 ||
+    addPasswordOperation.downloadUrl !== null;
   const passwordsCollapsed = !hasFiles || hasResults;
   const permissionsCollapsed = collapsedPermissions || hasResults;
 
@@ -90,7 +98,9 @@ const AddPassword = ({ onPreviewFile, onComplete, onError }: BaseToolProps) => {
       {
         title: t("changePermissions.title", "Document Permissions"),
         isCollapsed: permissionsCollapsed,
-        onCollapsedClick: hasResults ? handleSettingsReset : () => setCollapsedPermissions(!collapsedPermissions),
+        onCollapsedClick: hasResults
+          ? handleSettingsReset
+          : () => setCollapsedPermissions(!collapsedPermissions),
         content: (
           <ChangePermissionsSettings
             parameters={addPasswordParams.permissions.parameters}
diff --git a/frontend/src/core/tools/AddStamp.tsx b/frontend/src/core/tools/AddStamp.tsx
index b55a9be677..b5c5d913fc 100644
--- a/frontend/src/core/tools/AddStamp.tsx
+++ b/frontend/src/core/tools/AddStamp.tsx
@@ -1,9 +1,9 @@
 import { useEffect, useState } from "react";
 import { useTranslation } from "react-i18next";
-import { useFileSelection } from "@app/contexts/FileContext";
 import { createToolFlow } from "@app/components/tools/shared/createToolFlow";
 import { BaseToolProps, ToolComponent } from "@app/types/tool";
 import { useEndpointEnabled } from "@app/hooks/useEndpointConfig";
+import { useViewScopedFiles } from "@app/hooks/tools/shared/useViewScopedFiles";
 import { useAddStampParameters } from "@app/components/tools/addStamp/useAddStampParameters";
 import { useAddStampOperation } from "@app/components/tools/addStamp/useAddStampOperation";
 import { Stack, Text } from "@mantine/core";
@@ -17,22 +17,24 @@ import StampPositionFormattingSettings from "@app/components/tools/addStamp/Stam
 
 const AddStamp = ({ onPreviewFile, onComplete, onError }: BaseToolProps) => {
   const { t } = useTranslation();
-  const { selectedFiles } = useFileSelection();
+  const selectedFiles = useViewScopedFiles();
 
-  const [quickPositionModeSelected, setQuickPositionModeSelected] = useState(false);
-  const [customPositionModeSelected, setCustomPositionModeSelected] = useState(true);
+  const [quickPositionModeSelected, setQuickPositionModeSelected] =
+    useState(false);
+  const [customPositionModeSelected, setCustomPositionModeSelected] =
+    useState(true);
 
   const params = useAddStampParameters();
   const operation = useAddStampOperation();
 
-  const { enabled: endpointEnabled, loading: endpointLoading } = useEndpointEnabled("add-stamp");
+  const { enabled: endpointEnabled, loading: endpointLoading } =
+    useEndpointEnabled("add-stamp");
 
   useEffect(() => {
     operation.resetResults();
     onPreviewFile?.(null);
   }, [params.parameters]);
 
-
   const handleExecute = async () => {
     try {
       await operation.executeOperation(params.parameters, selectedFiles);
@@ -40,17 +42,21 @@ const AddStamp = ({ onPreviewFile, onComplete, onError }: BaseToolProps) => {
         onComplete(operation.files);
       }
     } catch (error: any) {
-      onError?.(error?.message || t("AddStampRequest.error.failed", "Add stamp operation failed"));
+      onError?.(
+        error?.message ||
+          t("AddStampRequest.error.failed", "Add stamp operation failed"),
+      );
     }
   };
 
   const hasFiles = selectedFiles.length > 0;
-  const hasResults = operation.files.length > 0 || operation.downloadUrl !== null;
+  const hasResults =
+    operation.files.length > 0 || operation.downloadUrl !== null;
 
   enum AddStampStep {
-    NONE = 'none',
-    STAMP_SETUP = 'stampSetup',
-    POSITION_FORMATTING = 'positionFormatting'
+    NONE = "none",
+    STAMP_SETUP = "stampSetup",
+    POSITION_FORMATTING = "positionFormatting",
   }
 
   const accordion = useAccordionSteps<AddStampStep>({
@@ -58,12 +64,12 @@ const AddStamp = ({ onPreviewFile, onComplete, onError }: BaseToolProps) => {
     initialStep: AddStampStep.STAMP_SETUP,
     stateConditions: {
       hasFiles,
-      hasResults
+      hasResults,
     },
     afterResults: () => {
       operation.resetResults();
       onPreviewFile?.(null);
-    }
+    },
   });
 
   const getSteps = () => {
@@ -73,7 +79,8 @@ const AddStamp = ({ onPreviewFile, onComplete, onError }: BaseToolProps) => {
     steps.push({
       title: t("AddStampRequest.stampSetup", "Stamp Setup"),
       isCollapsed: accordion.getCollapsedState(AddStampStep.STAMP_SETUP),
-      onCollapsedClick: () => accordion.handleStepToggle(AddStampStep.STAMP_SETUP),
+      onCollapsedClick: () =>
+        accordion.handleStepToggle(AddStampStep.STAMP_SETUP),
       isVisible: hasFiles || hasResults,
       content: (
         <StampSetupSettings
@@ -87,24 +94,33 @@ const AddStamp = ({ onPreviewFile, onComplete, onError }: BaseToolProps) => {
 
     // Step 2: Formatting & Position
     steps.push({
-      title: t("AddStampRequest.positionAndFormatting", "Position & Formatting"),
-      isCollapsed: accordion.getCollapsedState(AddStampStep.POSITION_FORMATTING),
-      onCollapsedClick: () => accordion.handleStepToggle(AddStampStep.POSITION_FORMATTING),
+      title: t(
+        "AddStampRequest.positionAndFormatting",
+        "Position & Formatting",
+      ),
+      isCollapsed: accordion.getCollapsedState(
+        AddStampStep.POSITION_FORMATTING,
+      ),
+      onCollapsedClick: () =>
+        accordion.handleStepToggle(AddStampStep.POSITION_FORMATTING),
       isVisible: hasFiles || hasResults,
       content: (
         <Stack gap="md" justify="space-between">
           {/* Mode toggle: Quick grid vs Custom drag - only show for image stamps */}
-          {params.parameters.stampType === 'image' && (
+          {params.parameters.stampType === "image" && (
             <ButtonSelector
-              value={quickPositionModeSelected ? 'quick' : 'custom'}
-              onChange={(v: 'quick' | 'custom') => {
-                const isQuick = v === 'quick';
+              value={quickPositionModeSelected ? "quick" : "custom"}
+              onChange={(v: "quick" | "custom") => {
+                const isQuick = v === "quick";
                 setQuickPositionModeSelected(isQuick);
                 setCustomPositionModeSelected(!isQuick);
               }}
               options={[
-                { value: 'quick', label: t('quickPosition', 'Quick Position') },
-                { value: 'custom', label: t('customPosition', 'Custom Position') },
+                { value: "quick", label: t("quickPosition", "Quick Position") },
+                {
+                  value: "custom",
+                  label: t("customPosition", "Custom Position"),
+                },
               ]}
               disabled={endpointLoading}
               buttonClassName={styles.modeToggleButton}
@@ -112,16 +128,28 @@ const AddStamp = ({ onPreviewFile, onComplete, onError }: BaseToolProps) => {
             />
           )}
 
-          {params.parameters.stampType === 'image' && customPositionModeSelected && (
-            <div className={styles.informationContainer}>
-              <Text className={styles.informationText}>{t('AddStampRequest.customPosition', 'Drag the stamp to the desired location in the preview window.')}</Text>
-            </div>
-          )}
-          {params.parameters.stampType === 'image' && !customPositionModeSelected && (
-            <div className={styles.informationContainer}>
-              <Text className={styles.informationText}>{t('AddStampRequest.quickPosition', 'Select a position on the page to place the stamp.')}</Text>
-            </div>
-          )}
+          {params.parameters.stampType === "image" &&
+            customPositionModeSelected && (
+              <div className={styles.informationContainer}>
+                <Text className={styles.informationText}>
+                  {t(
+                    "AddStampRequest.customPosition",
+                    "Drag the stamp to the desired location in the preview window.",
+                  )}
+                </Text>
+              </div>
+            )}
+          {params.parameters.stampType === "image" &&
+            !customPositionModeSelected && (
+              <div className={styles.informationContainer}>
+                <Text className={styles.informationText}>
+                  {t(
+                    "AddStampRequest.quickPosition",
+                    "Select a position on the page to place the stamp.",
+                  )}
+                </Text>
+              </div>
+            )}
 
           <StampPositionFormattingSettings
             parameters={params.parameters}
@@ -133,12 +161,17 @@ const AddStamp = ({ onPreviewFile, onComplete, onError }: BaseToolProps) => {
           <ObscuredOverlay
             obscured={
               accordion.currentStep === AddStampStep.POSITION_FORMATTING &&
-              ((params.parameters.stampType === 'text' && params.parameters.stampText.trim().length === 0) ||
-               (params.parameters.stampType === 'image' && !params.parameters.stampImage))
+              ((params.parameters.stampType === "text" &&
+                params.parameters.stampText.trim().length === 0) ||
+                (params.parameters.stampType === "image" &&
+                  !params.parameters.stampImage))
             }
             overlayMessage={
               <Text size="sm" c="white" fw={600}>
-                {t('AddStampRequest.noStampSelected', 'No stamp selected. Return to Step 1.')}
+                {t(
+                  "AddStampRequest.noStampSelected",
+                  "No stamp selected. Return to Step 1.",
+                )}
               </Text>
             }
           >
@@ -146,7 +179,11 @@ const AddStamp = ({ onPreviewFile, onComplete, onError }: BaseToolProps) => {
               parameters={params.parameters}
               onParameterChange={params.updateParameter}
               file={selectedFiles[0] || null}
-              showQuickGrid={params.parameters.stampType === 'text' ? true : quickPositionModeSelected}
+              showQuickGrid={
+                params.parameters.stampType === "text"
+                  ? true
+                  : quickPositionModeSelected
+              }
             />
           </ObscuredOverlay>
         </Stack>
@@ -163,9 +200,9 @@ const AddStamp = ({ onPreviewFile, onComplete, onError }: BaseToolProps) => {
     },
     steps: getSteps(),
     executeButton: {
-      text: t('AddStampRequest.submit', 'Add Stamp'),
+      text: t("AddStampRequest.submit", "Add Stamp"),
       isVisible: !hasResults,
-      loadingText: t('loading'),
+      loadingText: t("loading"),
       onClick: handleExecute,
       endpointEnabled: endpointEnabled,
       paramsValid: params.validateParameters(),
@@ -173,7 +210,7 @@ const AddStamp = ({ onPreviewFile, onComplete, onError }: BaseToolProps) => {
     review: {
       isVisible: hasResults,
       operation: operation,
-      title: t('AddStampRequest.results.title', 'Stamp Results'),
+      title: t("AddStampRequest.results.title", "Stamp Results"),
       onFileClick: (file) => onPreviewFile?.(file),
       onUndo: async () => {
         await operation.undoOperation();
@@ -186,5 +223,3 @@ const AddStamp = ({ onPreviewFile, onComplete, onError }: BaseToolProps) => {
 AddStamp.tool = () => useAddStampOperation;
 
 export default AddStamp as ToolComponent;
-
-
diff --git a/frontend/src/core/tools/AddText.tsx b/frontend/src/core/tools/AddText.tsx
index c2e1af00ad..638de2bd78 100644
--- a/frontend/src/core/tools/AddText.tsx
+++ b/frontend/src/core/tools/AddText.tsx
@@ -1,12 +1,12 @@
-import { createStampTool } from '@app/tools/stamp/createStampTool';
+import { createStampTool } from "@app/tools/stamp/createStampTool";
 
 // AddText is text-only annotation (no drawing, no images, no save-to-library)
 const AddText = createStampTool({
-  toolId: 'addText',
-  translationScope: 'addText',
-  allowedSignatureSources: ['text'],
-  defaultSignatureSource: 'text',
-  defaultSignatureType: 'text',
+  toolId: "addText",
+  translationScope: "addText",
+  allowedSignatureSources: ["text"],
+  defaultSignatureSource: "text",
+  defaultSignatureType: "text",
   enableApplyAction: true,
 });
 
diff --git a/frontend/src/core/tools/AddWatermark.tsx b/frontend/src/core/tools/AddWatermark.tsx
index c0447e12d0..75652e9d82 100644
--- a/frontend/src/core/tools/AddWatermark.tsx
+++ b/frontend/src/core/tools/AddWatermark.tsx
@@ -1,7 +1,7 @@
 import { useEffect, useState } from "react";
 import { useTranslation } from "react-i18next";
 import { useEndpointEnabled } from "@app/hooks/useEndpointConfig";
-import { useFileSelection } from "@app/contexts/FileContext";
+import { useViewScopedFiles } from "@app/hooks/tools/shared/useViewScopedFiles";
 
 import { createToolFlow } from "@app/components/tools/shared/createToolFlow";
 
@@ -22,9 +22,13 @@ import {
 } from "@app/components/tooltips/useWatermarkTips";
 import { BaseToolProps, ToolComponent } from "@app/types/tool";
 
-const AddWatermark = ({ onPreviewFile, onComplete, onError }: BaseToolProps) => {
+const AddWatermark = ({
+  onPreviewFile,
+  onComplete,
+  onError,
+}: BaseToolProps) => {
   const { t } = useTranslation();
-  const { selectedFiles } = useFileSelection();
+  const selectedFiles = useViewScopedFiles();
 
   const [collapsedType, setCollapsedType] = useState(false);
   const [collapsedStyle, setCollapsedStyle] = useState(true);
@@ -39,8 +43,8 @@ const AddWatermark = ({ onPreviewFile, onComplete, onError }: BaseToolProps) =>
   const watermarkFormattingTips = useWatermarkFormattingTips();
 
   // Endpoint validation
-  const { enabled: endpointEnabled, loading: endpointLoading } = useEndpointEnabled("add-watermark");
-
+  const { enabled: endpointEnabled, loading: endpointLoading } =
+    useEndpointEnabled("add-watermark");
 
   useEffect(() => {
     watermarkOperation.resetResults();
@@ -56,13 +60,20 @@ const AddWatermark = ({ onPreviewFile, onComplete, onError }: BaseToolProps) =>
 
   const handleAddWatermark = async () => {
     try {
-      await watermarkOperation.executeOperation(watermarkParams.parameters, selectedFiles);
+      await watermarkOperation.executeOperation(
+        watermarkParams.parameters,
+        selectedFiles,
+      );
       if (watermarkOperation.files && onComplete) {
         onComplete(watermarkOperation.files);
       }
     } catch (error) {
       if (onError) {
-        onError(error instanceof Error ? error.message : t("watermark.error.failed", "Add watermark operation failed"));
+        onError(
+          error instanceof Error
+            ? error.message
+            : t("watermark.error.failed", "Add watermark operation failed"),
+        );
       }
     }
   };
@@ -83,7 +94,9 @@ const AddWatermark = ({ onPreviewFile, onComplete, onError }: BaseToolProps) =>
   };
 
   const hasFiles = selectedFiles.length > 0;
-  const hasResults = watermarkOperation.files.length > 0 || watermarkOperation.downloadUrl !== null;
+  const hasResults =
+    watermarkOperation.files.length > 0 ||
+    watermarkOperation.downloadUrl !== null;
 
   // Dynamic step structure based on watermark type
   const getSteps = () => {
@@ -93,12 +106,16 @@ const AddWatermark = ({ onPreviewFile, onComplete, onError }: BaseToolProps) =>
       title: t("watermark.steps.type", "Watermark Type"),
       isCollapsed: hasResults ? true : collapsedType,
       isVisible: hasFiles || hasResults,
-      onCollapsedClick: hasResults ? handleSettingsReset : () => setCollapsedType(!collapsedType),
+      onCollapsedClick: hasResults
+        ? handleSettingsReset
+        : () => setCollapsedType(!collapsedType),
       tooltip: watermarkTypeTips,
       content: (
         <WatermarkTypeSettings
           watermarkType={watermarkParams.parameters.watermarkType}
-          onWatermarkTypeChange={(type) => watermarkParams.updateParameter("watermarkType", type)}
+          onWatermarkTypeChange={(type) =>
+            watermarkParams.updateParameter("watermarkType", type)
+          }
           disabled={endpointLoading}
         />
       ),
@@ -125,7 +142,9 @@ const AddWatermark = ({ onPreviewFile, onComplete, onError }: BaseToolProps) =>
         steps.push({
           title: t("watermark.steps.textStyle", "Style"),
           isCollapsed: hasResults ? true : collapsedStyle,
-          onCollapsedClick: hasResults ? handleSettingsReset : () => setCollapsedStyle(!collapsedStyle),
+          onCollapsedClick: hasResults
+            ? handleSettingsReset
+            : () => setCollapsedStyle(!collapsedStyle),
           tooltip: watermarkTextStyleTips,
           content: (
             <WatermarkTextStyle
@@ -140,7 +159,9 @@ const AddWatermark = ({ onPreviewFile, onComplete, onError }: BaseToolProps) =>
         steps.push({
           title: t("watermark.steps.formatting", "Formatting"),
           isCollapsed: hasResults ? true : collapsedFormatting,
-          onCollapsedClick: hasResults ? handleSettingsReset : () => setCollapsedFormatting(!collapsedFormatting),
+          onCollapsedClick: hasResults
+            ? handleSettingsReset
+            : () => setCollapsedFormatting(!collapsedFormatting),
           tooltip: watermarkFormattingTips,
           content: (
             <WatermarkFormatting
@@ -172,7 +193,9 @@ const AddWatermark = ({ onPreviewFile, onComplete, onError }: BaseToolProps) =>
         steps.push({
           title: t("watermark.steps.formatting", "Formatting"),
           isCollapsed: hasResults ? true : collapsedFormatting,
-          onCollapsedClick: hasResults ? handleSettingsReset : () => setCollapsedFormatting(!collapsedFormatting),
+          onCollapsedClick: hasResults
+            ? handleSettingsReset
+            : () => setCollapsedFormatting(!collapsedFormatting),
           tooltip: watermarkFormattingTips,
           content: (
             <WatermarkFormatting
diff --git a/frontend/src/core/tools/AdjustContrast.tsx b/frontend/src/core/tools/AdjustContrast.tsx
index 2ec772d6ca..ba94258e26 100644
--- a/frontend/src/core/tools/AdjustContrast.tsx
+++ b/frontend/src/core/tools/AdjustContrast.tsx
@@ -1,32 +1,36 @@
-import { useTranslation } from 'react-i18next';
-import { useEffect, useMemo, useState } from 'react';
-import { createToolFlow } from '@app/components/tools/shared/createToolFlow';
-import { BaseToolProps, ToolComponent } from '@app/types/tool';
-import { useBaseTool } from '@app/hooks/tools/shared/useBaseTool';
-import { useAdjustContrastParameters } from '@app/hooks/tools/adjustContrast/useAdjustContrastParameters';
-import { useAdjustContrastOperation } from '@app/hooks/tools/adjustContrast/useAdjustContrastOperation';
-import AdjustContrastBasicSettings from '@app/components/tools/adjustContrast/AdjustContrastBasicSettings';
-import AdjustContrastColorSettings from '@app/components/tools/adjustContrast/AdjustContrastColorSettings';
-import AdjustContrastPreview from '@app/components/tools/adjustContrast/AdjustContrastPreview';
-import { useAccordionSteps } from '@app/hooks/tools/shared/useAccordionSteps';
-import NavigationArrows from '@app/components/shared/filePreview/NavigationArrows';
+import { useTranslation } from "react-i18next";
+import { useEffect, useMemo, useState } from "react";
+import { createToolFlow } from "@app/components/tools/shared/createToolFlow";
+import { BaseToolProps, ToolComponent } from "@app/types/tool";
+import { useBaseTool } from "@app/hooks/tools/shared/useBaseTool";
+import { useAdjustContrastParameters } from "@app/hooks/tools/adjustContrast/useAdjustContrastParameters";
+import { useAdjustContrastOperation } from "@app/hooks/tools/adjustContrast/useAdjustContrastOperation";
+import AdjustContrastBasicSettings from "@app/components/tools/adjustContrast/AdjustContrastBasicSettings";
+import AdjustContrastColorSettings from "@app/components/tools/adjustContrast/AdjustContrastColorSettings";
+import AdjustContrastPreview from "@app/components/tools/adjustContrast/AdjustContrastPreview";
+import { useAccordionSteps } from "@app/hooks/tools/shared/useAccordionSteps";
+import NavigationArrows from "@app/components/shared/filePreview/NavigationArrows";
 
 const AdjustContrast = (props: BaseToolProps) => {
   const { t } = useTranslation();
 
   const base = useBaseTool(
-    'adjustContrast',
+    "adjustContrast",
     useAdjustContrastParameters,
     useAdjustContrastOperation,
-    props
+    props,
   );
 
-  enum Step { NONE='none', BASIC='basic', COLORS='colors' }
+  enum Step {
+    NONE = "none",
+    BASIC = "basic",
+    COLORS = "colors",
+  }
   const accordion = useAccordionSteps<Step>({
     noneValue: Step.NONE,
     initialStep: Step.BASIC,
     stateConditions: { hasFiles: base.hasFiles, hasResults: base.hasResults },
-    afterResults: base.handleSettingsReset
+    afterResults: base.handleSettingsReset,
   });
 
   // Track which selected file is being previewed. Clamp when selection changes.
@@ -44,7 +48,8 @@ const AdjustContrast = (props: BaseToolProps) => {
   }, [base.selectedFiles, previewIndex, totalSelected]);
 
   const handlePrev = () => setPreviewIndex((i) => Math.max(0, i - 1));
-  const handleNext = () => setPreviewIndex((i) => Math.min(totalSelected - 1, i + 1));
+  const handleNext = () =>
+    setPreviewIndex((i) => Math.min(totalSelected - 1, i + 1));
 
   return createToolFlow({
     files: {
@@ -53,7 +58,7 @@ const AdjustContrast = (props: BaseToolProps) => {
     },
     steps: [
       {
-        title: t('adjustContrast.basic', 'Basic Adjustments'),
+        title: t("adjustContrast.basic", "Basic Adjustments"),
         isCollapsed: accordion.getCollapsedState(Step.BASIC),
         onCollapsedClick: () => accordion.handleStepToggle(Step.BASIC),
         content: (
@@ -65,7 +70,7 @@ const AdjustContrast = (props: BaseToolProps) => {
         ),
       },
       {
-        title: t('adjustContrast.adjustColors', 'Adjust Colors'),
+        title: t("adjustContrast.adjustColors", "Adjust Colors"),
         isCollapsed: accordion.getCollapsedState(Step.COLORS),
         onCollapsedClick: () => accordion.handleStepToggle(Step.COLORS),
         content: (
@@ -84,7 +89,7 @@ const AdjustContrast = (props: BaseToolProps) => {
           onNext={handleNext}
           disabled={totalSelected <= 1}
         >
-          <div style={{ width: '100%' }}>
+          <div style={{ width: "100%" }}>
             <AdjustContrastPreview
               file={currentFile || null}
               parameters={base.params.parameters}
@@ -92,23 +97,30 @@ const AdjustContrast = (props: BaseToolProps) => {
           </div>
         </NavigationArrows>
         {totalSelected > 1 && (
-          <div style={{ textAlign: 'center', marginTop: 8, fontSize: 12, color: 'var(--text-color-muted)' }}>
+          <div
+            style={{
+              textAlign: "center",
+              marginTop: 8,
+              fontSize: 12,
+              color: "var(--text-color-muted)",
+            }}
+          >
             {`${previewIndex + 1} of ${totalSelected}`}
           </div>
         )}
       </div>
     ),
     executeButton: {
-      text: t('adjustContrast.confirm', 'Confirm'),
+      text: t("adjustContrast.confirm", "Confirm"),
       isVisible: !base.hasResults,
-      loadingText: t('loading'),
+      loadingText: t("loading"),
       onClick: base.handleExecute,
       paramsValid: true,
     },
     review: {
       isVisible: base.hasResults,
       operation: base.operation,
-      title: t('adjustContrast.results.title', 'Adjusted PDF'),
+      title: t("adjustContrast.results.title", "Adjusted PDF"),
       onFileClick: base.handleThumbnailClick,
       onUndo: base.handleUndo,
     },
@@ -117,5 +129,3 @@ const AdjustContrast = (props: BaseToolProps) => {
 };
 
 export default AdjustContrast as ToolComponent;
-
-
diff --git a/frontend/src/core/tools/AdjustPageScale.tsx b/frontend/src/core/tools/AdjustPageScale.tsx
index 52fadd8260..fd2806e2e1 100644
--- a/frontend/src/core/tools/AdjustPageScale.tsx
+++ b/frontend/src/core/tools/AdjustPageScale.tsx
@@ -12,10 +12,10 @@ const AdjustPageScale = (props: BaseToolProps) => {
   const adjustPageScaleTips = useAdjustPageScaleTips();
 
   const base = useBaseTool(
-    'adjustPageScale',
+    "adjustPageScale",
     useAdjustPageScaleParameters,
     useAdjustPageScaleOperation,
-    props
+    props,
   );
 
   return createToolFlow({
@@ -27,7 +27,9 @@ const AdjustPageScale = (props: BaseToolProps) => {
       {
         title: "Settings",
         isCollapsed: base.settingsCollapsed,
-        onCollapsedClick: base.settingsCollapsed ? base.handleSettingsReset : undefined,
+        onCollapsedClick: base.settingsCollapsed
+          ? base.handleSettingsReset
+          : undefined,
         tooltip: adjustPageScaleTips,
         content: (
           <AdjustPageScaleSettings
diff --git a/frontend/src/core/tools/Annotate.tsx b/frontend/src/core/tools/Annotate.tsx
index cb06f65d61..d44a202072 100644
--- a/frontend/src/core/tools/Annotate.tsx
+++ b/frontend/src/core/tools/Annotate.tsx
@@ -1,66 +1,73 @@
-import { useEffect, useState, useContext, useCallback, useRef } from 'react';
-import { useTranslation } from 'react-i18next';
+import { useEffect, useState, useContext, useCallback, useRef } from "react";
+import { useTranslation } from "react-i18next";
 
-import { createToolFlow } from '@app/components/tools/shared/createToolFlow';
-import { useNavigation } from '@app/contexts/NavigationContext';
-import { useFileSelection } from '@app/contexts/FileContext';
-import { BaseToolProps } from '@app/types/tool';
-import { useSignature } from '@app/contexts/SignatureContext';
-import { ViewerContext, useViewer } from '@app/contexts/ViewerContext';
-import type { AnnotationToolId, AnnotationEvent, AnnotationSelection, AnnotationRect } from '@app/components/viewer/viewerTypes';
-import { useAnnotationStyleState } from '@app/tools/annotate/useAnnotationStyleState';
-import { useAnnotationSelection } from '@app/tools/annotate/useAnnotationSelection';
-import { AnnotationPanel } from '@app/tools/annotate/AnnotationPanel';
+import { createToolFlow } from "@app/components/tools/shared/createToolFlow";
+import { useNavigation } from "@app/contexts/NavigationContext";
+import { useFileSelection } from "@app/contexts/FileContext";
+import { BaseToolProps } from "@app/types/tool";
+import { useSignature } from "@app/contexts/SignatureContext";
+import { ViewerContext, useViewer } from "@app/contexts/ViewerContext";
+import type {
+  AnnotationToolId,
+  AnnotationEvent,
+  AnnotationSelection,
+  AnnotationRect,
+} from "@app/components/viewer/viewerTypes";
+import { useAnnotationStyleState } from "@app/tools/annotate/useAnnotationStyleState";
+import { useAnnotationSelection } from "@app/tools/annotate/useAnnotationSelection";
+import { AnnotationPanel } from "@app/tools/annotate/AnnotationPanel";
 
 // Tools that require drawing/interacting with the PDF and should disable pan mode
 const DRAWING_TOOLS: AnnotationToolId[] = [
-  'highlight',
-  'underline',
-  'strikeout',
-  'squiggly',
-  'ink',
-  'inkHighlighter',
-  'text',
-  'note',
-  'textComment',
-  'insertText',
-  'replaceText',
-  'square',
-  'circle',
-  'line',
-  'lineArrow',
-  'polyline',
-  'polygon',
-  'stamp',
-  'signatureStamp',
-  'signatureInk',
+  "highlight",
+  "underline",
+  "strikeout",
+  "squiggly",
+  "ink",
+  "inkHighlighter",
+  "text",
+  "note",
+  "textComment",
+  "insertText",
+  "replaceText",
+  "square",
+  "circle",
+  "line",
+  "lineArrow",
+  "polyline",
+  "polygon",
+  "stamp",
+  "signatureStamp",
+  "signatureInk",
 ];
 
 const KNOWN_ANNOTATION_TOOLS: AnnotationToolId[] = [
-  'select',
-  'highlight',
-  'underline',
-  'strikeout',
-  'squiggly',
-  'ink',
-  'inkHighlighter',
-  'text',
-  'note',
-  'textComment',
-  'insertText',
-  'replaceText',
-  'square',
-  'circle',
-  'line',
-  'lineArrow',
-  'polyline',
-  'polygon',
-  'stamp',
-  'signatureStamp',
-  'signatureInk',
+  "select",
+  "highlight",
+  "underline",
+  "strikeout",
+  "squiggly",
+  "ink",
+  "inkHighlighter",
+  "text",
+  "note",
+  "textComment",
+  "insertText",
+  "replaceText",
+  "square",
+  "circle",
+  "line",
+  "lineArrow",
+  "polyline",
+  "polygon",
+  "stamp",
+  "signatureStamp",
+  "signatureInk",
 ];
 
-const isKnownAnnotationTool = (toolId: string | undefined | null): toolId is AnnotationToolId =>
+const isKnownAnnotationTool = (
+  toolId: string | undefined | null,
+): toolId is AnnotationToolId =>
   !!toolId && (KNOWN_ANNOTATION_TOOLS as string[]).includes(toolId);
 
 const Annotate = (_props: BaseToolProps) => {
@@ -80,27 +87,42 @@ const Annotate = (_props: BaseToolProps) => {
   } = useSignature();
   const viewerContext = useContext(ViewerContext);
   const viewerContextRef = useRef(viewerContext);
-  useEffect(() => { viewerContextRef.current = viewerContext; }, [viewerContext]);
-  const { getZoomState, registerImmediateZoomUpdate, applyChanges, activeFileIndex, panActions, setCommentsSidebarVisible } = useViewer();
+  useEffect(() => {
+    viewerContextRef.current = viewerContext;
+  }, [viewerContext]);
+  const {
+    getZoomState,
+    registerImmediateZoomUpdate,
+    applyChanges,
+    activeFileIndex,
+    panActions,
+    setCommentsSidebarVisible,
+  } = useViewer();
+
+  const [activeTool, setActiveTool] = useState<AnnotationToolId>("select");
 
-  const [activeTool, setActiveTool] = useState<AnnotationToolId>('select');
-  
   // Track the previous file index to detect file switches
   const prevFileIndexRef = useRef<number>(activeFileIndex);
-  const activeToolRef = useRef<AnnotationToolId>('select');
+  const activeToolRef = useRef<AnnotationToolId>("select");
   const wasAnnotateActiveRef = useRef<boolean>(false);
-  const [selectedTextDraft, setSelectedTextDraft] = useState<string>('');
+  const [selectedTextDraft, setSelectedTextDraft] = useState<string>("");
   const [selectedFontSize, setSelectedFontSize] = useState<number>(14);
   const [stampImageData, setStampImageData] = useState<string | undefined>();
-  const [stampImageSize, setStampImageSize] = useState<{ width: number; height: number } | null>(null);
-  const [historyAvailability, setHistoryAvailability] = useState({ canUndo: false, canRedo: false });
+  const [stampImageSize, setStampImageSize] = useState<{
+    width: number;
+    height: number;
+  } | null>(null);
+  const [historyAvailability, setHistoryAvailability] = useState({
+    canUndo: false,
+    canRedo: false,
+  });
   const manualToolSwitch = useRef<boolean>(false);
 
   // Zoom tracking for stamp size conversion
   const [currentZoom, setCurrentZoom] = useState(() => {
     const zoomState = getZoomState();
     if (!zoomState) return 1;
-    if (typeof zoomState.zoomPercent === 'number') {
+    if (typeof zoomState.zoomPercent === "number") {
       return Math.max(zoomState.zoomPercent / 100, 0.01);
     }
     return Math.max(zoomState.currentZoom ?? 1, 0.01);
@@ -126,30 +148,29 @@ const Annotate = (_props: BaseToolProps) => {
         height: size.height * factor,
       };
     },
-    [currentZoom]
+    [currentZoom],
   );
 
-  const computeStampDisplaySize = useCallback((natural: { width: number; height: number } | null) => {
-    if (!natural) {
-      return { width: 180, height: 120 };
-    }
-    const maxSide = 260;
-    const minSide = 24;
-    const { width, height } = natural;
-    const largest = Math.max(width || maxSide, height || maxSide, 1);
-    const scale = Math.min(1, maxSide / largest);
-    return {
-      width: Math.max(minSide, Math.round(width * scale)),
-      height: Math.max(minSide, Math.round(height * scale)),
-    };
-  }, []);
+  const computeStampDisplaySize = useCallback(
+    (natural: { width: number; height: number } | null) => {
+      if (!natural) {
+        return { width: 180, height: 120 };
+      }
+      const maxSide = 260;
+      const minSide = 24;
+      const { width, height } = natural;
+      const largest = Math.max(width || maxSide, height || maxSide, 1);
+      const scale = Math.min(1, maxSide / largest);
+      return {
+        width: Math.max(minSide, Math.round(width * scale)),
+        height: Math.max(minSide, Math.round(height * scale)),
+      };
+    },
+    [],
+  );
 
-  const {
-    styleState,
-    styleActions,
-    buildToolOptions,
-    getActiveColor,
-  } = useAnnotationStyleState(cssToPdfSize);
+  const { styleState, styleActions, buildToolOptions, getActiveColor } =
+    useAnnotationStyleState(cssToPdfSize);
 
   const {
     setInkWidth,
@@ -193,7 +214,8 @@ const Annotate = (_props: BaseToolProps) => {
   }, []);
 
   useEffect(() => {
-    const isAnnotateActive = workbench === 'viewer' && selectedTool === 'annotate';
+    const isAnnotateActive =
+      workbench === "viewer" && selectedTool === "annotate";
     if (wasAnnotateActiveRef.current && !isAnnotateActive) {
       annotationApiRef?.current?.deactivateTools?.();
       signatureApiRef?.current?.deactivateTools?.();
@@ -202,13 +224,24 @@ const Annotate = (_props: BaseToolProps) => {
     } else if (!wasAnnotateActiveRef.current && isAnnotateActive) {
       // When entering annotate mode, activate the select tool by default
       // Also reset React state to match — EmbedPDF always starts at 'select' here
-      setActiveTool('select');
-      activeToolRef.current = 'select';
-      const toolOptions = buildToolOptions('select');
-      annotationApiRef?.current?.activateAnnotationTool?.('select', toolOptions);
+      setActiveTool("select");
+      activeToolRef.current = "select";
+      const toolOptions = buildToolOptions("select");
+      annotationApiRef?.current?.activateAnnotationTool?.(
+        "select",
+        toolOptions,
+      );
     }
     wasAnnotateActiveRef.current = isAnnotateActive;
-  }, [workbench, selectedTool, annotationApiRef, signatureApiRef, setPlacementMode, buildToolOptions, viewerContext]);
+  }, [
+    workbench,
+    selectedTool,
+    annotationApiRef,
+    signatureApiRef,
+    setPlacementMode,
+    buildToolOptions,
+    viewerContext,
+  ]);
 
   // Monitor history state for undo/redo availability
   useEffect(() => {
@@ -230,7 +263,7 @@ const Annotate = (_props: BaseToolProps) => {
     } else {
       const unsubscribe = historyApi.subscribe(updateAvailability);
       return () => {
-        if (typeof unsubscribe === 'function') {
+        if (typeof unsubscribe === "function") {
           unsubscribe();
         }
         if (interval) clearInterval(interval);
@@ -248,36 +281,46 @@ const Annotate = (_props: BaseToolProps) => {
 
     viewerContext.setAnnotationMode(true);
     const toolOptions =
-      activeTool === 'stamp'
-        ? buildToolOptions('stamp', { stampImageData, stampImageSize })
+      activeTool === "stamp"
+        ? buildToolOptions("stamp", { stampImageData, stampImageSize })
         : buildToolOptions(activeTool);
-    annotationApiRef?.current?.activateAnnotationTool?.(activeTool, toolOptions);
-  }, [viewerContext?.isAnnotationMode, signatureApiRef, activeTool, buildToolOptions, stampImageData, stampImageSize]);
+    annotationApiRef?.current?.activateAnnotationTool?.(
+      activeTool,
+      toolOptions,
+    );
+  }, [
+    viewerContext?.isAnnotationMode,
+    signatureApiRef,
+    activeTool,
+    buildToolOptions,
+    stampImageData,
+    stampImageSize,
+  ]);
 
   // Reset to 'select' mode when switching between files
   // The new PDF gets a fresh EmbedPDF instance - forcing user to re-select tool ensures it works properly
   useEffect(() => {
     if (prevFileIndexRef.current !== activeFileIndex) {
       prevFileIndexRef.current = activeFileIndex;
-      
+
       // Reset to select mode when switching files
       // This forces the user to re-select their tool, which ensures proper activation on the new PDF
-      if (activeTool !== 'select') {
-        setActiveTool('select');
-        activeToolRef.current = 'select';
-        
+      if (activeTool !== "select") {
+        setActiveTool("select");
+        activeToolRef.current = "select";
+
         // Clean up placement mode if we were in stamp tool
         setPlacementMode(false);
         setSignatureConfig(null);
-        
+
         // Small delay to ensure the new EmbedPDF instance is ready, then activate select mode
         const timer = setTimeout(() => {
           if (annotationApiRef?.current) {
             annotationApiRef.current.deselectAnnotation?.();
-            annotationApiRef.current.activateAnnotationTool?.('select');
+            annotationApiRef.current.activateAnnotationTool?.("select");
           }
         }, 100);
-        
+
         return () => clearTimeout(timer);
       }
     }
@@ -285,7 +328,7 @@ const Annotate = (_props: BaseToolProps) => {
 
   const activateAnnotationTool = (toolId: AnnotationToolId) => {
     // If leaving stamp tool, clean up placement mode
-    if (activeTool === 'stamp' && toolId !== 'stamp') {
+    if (activeTool === "stamp" && toolId !== "stamp") {
       setPlacementMode(false);
       setSignatureConfig(null);
     }
@@ -310,16 +353,19 @@ const Annotate = (_props: BaseToolProps) => {
     // Change the tool
     setActiveTool(toolId);
     const options =
-      toolId === 'stamp'
-        ? buildToolOptions('stamp', { stampImageData, stampImageSize })
+      toolId === "stamp"
+        ? buildToolOptions("stamp", { stampImageData, stampImageSize })
         : buildToolOptions(toolId);
 
     // For stamp, apply the image if we have one
     annotationApiRef?.current?.setAnnotationStyle?.(toolId, options);
-    annotationApiRef?.current?.activateAnnotationTool?.(toolId === 'stamp' ? 'stamp' : toolId, options);
+    annotationApiRef?.current?.activateAnnotationTool?.(
+      toolId === "stamp" ? "stamp" : toolId,
+      options,
+    );
 
     // Auto-open comments sidebar when a comment tool is selected
-    if (['textComment', 'insertText', 'replaceText'].includes(toolId)) {
+    if (["textComment", "insertText", "replaceText"].includes(toolId)) {
       setCommentsSidebarVisible(true);
     }
 
@@ -331,46 +377,82 @@ const Annotate = (_props: BaseToolProps) => {
 
   useEffect(() => {
     // push style updates to EmbedPDF when sliders/colors change
-    if (activeTool === 'stamp') {
-      const options = buildToolOptions('stamp', { stampImageData, stampImageSize });
-      annotationApiRef?.current?.setAnnotationStyle?.('stamp', options);
+    if (activeTool === "stamp") {
+      const options = buildToolOptions("stamp", {
+        stampImageData,
+        stampImageSize,
+      });
+      annotationApiRef?.current?.setAnnotationStyle?.("stamp", options);
     } else {
-      annotationApiRef?.current?.setAnnotationStyle?.(activeTool, buildToolOptions(activeTool));
+      annotationApiRef?.current?.setAnnotationStyle?.(
+        activeTool,
+        buildToolOptions(activeTool),
+      );
     }
-  }, [activeTool, buildToolOptions, signatureApiRef, stampImageData, stampImageSize]);
+  }, [
+    activeTool,
+    buildToolOptions,
+    signatureApiRef,
+    stampImageData,
+    stampImageSize,
+  ]);
 
   // Sync preview size from overlay to annotation engine
   useEffect(() => {
     // When preview size changes, update stamp annotation sizing
     // The SignatureAPIBridge will use placementPreviewSize from SignatureContext
     // and apply the converted size to the stamp tool automatically
-    if (activeTool === 'stamp' && stampImageData) {
+    if (activeTool === "stamp" && stampImageData) {
       const size = placementPreviewSize ?? stampImageSize;
-      const stampOptions = buildToolOptions('stamp', { stampImageData, stampImageSize: size ?? null });
-      annotationApiRef?.current?.setAnnotationStyle?.('stamp', stampOptions);
+      const stampOptions = buildToolOptions("stamp", {
+        stampImageData,
+        stampImageSize: size ?? null,
+      });
+      annotationApiRef?.current?.setAnnotationStyle?.("stamp", stampOptions);
     }
-  }, [placementPreviewSize, activeTool, stampImageData, signatureApiRef, stampImageSize, cssToPdfSize, buildToolOptions]);
+  }, [
+    placementPreviewSize,
+    activeTool,
+    stampImageData,
+    signatureApiRef,
+    stampImageSize,
+    cssToPdfSize,
+    buildToolOptions,
+  ]);
 
   // Auto-switch to 'select' after placing a note or text annotation
   // EmbedPDF fires 'create' + committed:true when placement is finalised
   useEffect(() => {
-    const unsubscribe = annotationApiRef?.current?.onAnnotationEvent?.((event: AnnotationEvent) => {
-      if (event.type === 'create' && event.committed) {
-        const toolId = activeToolRef.current;
-        if (['text', 'note', 'textComment', 'insertText', 'replaceText'].includes(toolId)) {
-          setActiveTool('select');
-          activeToolRef.current = 'select';
-          annotationApiRef?.current?.activateAnnotationTool?.('select');
+    const unsubscribe = annotationApiRef?.current?.onAnnotationEvent?.(
+      (event: AnnotationEvent) => {
+        if (event.type === "create" && event.committed) {
+          const toolId = activeToolRef.current;
+          if (
+            [
+              "text",
+              "note",
+              "textComment",
+              "insertText",
+              "replaceText",
+            ].includes(toolId)
+          ) {
+            setActiveTool("select");
+            activeToolRef.current = "select";
+            annotationApiRef?.current?.activateAnnotationTool?.("select");
+          }
         }
-      }
-    });
+      },
+    );
     return () => {
-      if (typeof unsubscribe === 'function') unsubscribe();
+      if (typeof unsubscribe === "function") unsubscribe();
     };
   }, [annotationApiRef?.current]);
 
   // Clipboard ref for copy/paste — no re-render needed
-  const clipboardRef = useRef<{ pageIndex: number; annotation: Record<string, unknown> } | null>(null);
+  const clipboardRef = useRef<{
+    pageIndex: number;
+    annotation: Record<string, unknown>;
+  } | null>(null);
 
   // Click-outside to blur FreeText/note inline editing so user can then drag the annotation.
   // When clicking the selection menu (e.g. Properties), only blur — do not deselect so the menu/popover can respond.
@@ -379,7 +461,7 @@ const Annotate = (_props: BaseToolProps) => {
       const active = document.activeElement as HTMLElement | null;
       if (!active?.isContentEditable) return;
 
-      const pageEl = active.closest('[data-page-index]') as HTMLElement | null;
+      const pageEl = active.closest("[data-page-index]") as HTMLElement | null;
       if (!pageEl) return;
 
       const editingWrapper = active.parentElement;
@@ -388,24 +470,26 @@ const Annotate = (_props: BaseToolProps) => {
 
       active.blur();
 
-      const onSelectionMenu = (target as HTMLElement).closest?.('[data-annotation-selection-menu]');
+      const onSelectionMenu = (target as HTMLElement).closest?.(
+        "[data-annotation-selection-menu]",
+      );
       if (onSelectionMenu) return;
 
       const pageParent = pageEl.parentElement;
       if (!pageParent) return;
-      const synthetic = new PointerEvent('pointerdown', {
+      const synthetic = new PointerEvent("pointerdown", {
         bubbles: true,
         cancelable: true,
         clientX: e.clientX,
         clientY: e.clientY,
         pointerId: 1,
-        pointerType: 'mouse',
+        pointerType: "mouse",
       });
       pageParent.dispatchEvent(synthetic);
     };
 
-    document.addEventListener('mousedown', handleCapture, true);
-    return () => document.removeEventListener('mousedown', handleCapture, true);
+    document.addEventListener("mousedown", handleCapture, true);
+    return () => document.removeEventListener("mousedown", handleCapture, true);
   }, []);
 
   // Keyboard shortcuts: Escape (cancel drawing), Backspace/Delete (delete selected), Ctrl+C/V (copy/paste)
@@ -414,53 +498,74 @@ const Annotate = (_props: BaseToolProps) => {
       const el = document.activeElement;
       if (!el) return false;
       const tag = (el as HTMLElement).tagName;
-      return tag === 'INPUT' || tag === 'TEXTAREA' || (el as HTMLElement).isContentEditable;
+      return (
+        tag === "INPUT" ||
+        tag === "TEXTAREA" ||
+        (el as HTMLElement).isContentEditable
+      );
     };
 
     const handler = (e: KeyboardEvent) => {
       if (isInputFocused()) return;
 
       // Backspace / Delete: delete selected annotation(s)
-      if (e.key === 'Backspace' || e.key === 'Delete') {
-        const multiSelected = annotationApiRef?.current?.getSelectedAnnotations?.();
+      if (e.key === "Backspace" || e.key === "Delete") {
+        const multiSelected =
+          annotationApiRef?.current?.getSelectedAnnotations?.();
         if (multiSelected && multiSelected.length > 0) {
           e.preventDefault();
-          const toDelete = multiSelected.map((s: AnnotationSelection) => {
-            const ann = s.object ?? s;
-            return {
-              pageIndex: ann.pageIndex ?? 0,
-              id: ann.id ?? ann.uid ?? '',
-            };
-          }).filter((a: { id: string }) => a.id);
+          const toDelete = multiSelected
+            .map((s: AnnotationSelection) => {
+              const ann = s.object ?? s;
+              return {
+                pageIndex: ann.pageIndex ?? 0,
+                id: ann.id ?? ann.uid ?? "",
+              };
+            })
+            .filter((a: { id: string }) => a.id);
           if (toDelete.length > 0) {
             annotationApiRef?.current?.deleteAnnotations?.(toDelete);
           }
           return;
         }
-        const selected: AnnotationSelection | null = annotationApiRef?.current?.getSelectedAnnotation?.() ?? null;
+        const selected: AnnotationSelection | null =
+          annotationApiRef?.current?.getSelectedAnnotation?.() ?? null;
         if (!selected) return;
         e.preventDefault();
-        const pageIndex: number = selected.pageIndex ?? selected.object?.pageIndex ?? 0;
-        const annotationId: string = selected.id ?? selected.object?.id ?? selected.uid ?? selected.object?.uid ?? '';
+        const pageIndex: number =
+          selected.pageIndex ?? selected.object?.pageIndex ?? 0;
+        const annotationId: string =
+          selected.id ??
+          selected.object?.id ??
+          selected.uid ??
+          selected.object?.uid ??
+          "";
         if (annotationId != null) {
-          annotationApiRef?.current?.deleteAnnotation?.(pageIndex, annotationId);
+          annotationApiRef?.current?.deleteAnnotation?.(
+            pageIndex,
+            annotationId,
+          );
         }
         return;
       }
 
       // Ctrl+C: copy selected annotation
-      if ((e.ctrlKey || e.metaKey) && e.key === 'c') {
-        const selected: AnnotationSelection | null = annotationApiRef?.current?.getSelectedAnnotation?.() ?? null;
+      if ((e.ctrlKey || e.metaKey) && e.key === "c") {
+        const selected: AnnotationSelection | null =
+          annotationApiRef?.current?.getSelectedAnnotation?.() ?? null;
         if (!selected) return;
         e.preventDefault();
         const ann = selected.object ?? selected;
         const pageIndex: number = ann.pageIndex ?? 0;
-        clipboardRef.current = { pageIndex, annotation: { ...(ann as Record<string, unknown>) } };
+        clipboardRef.current = {
+          pageIndex,
+          annotation: { ...(ann as Record<string, unknown>) },
+        };
         return;
       }
 
       // Ctrl+V: paste copied annotation (offset by ~20 PDF pts)
-      if ((e.ctrlKey || e.metaKey) && e.key === 'v') {
+      if ((e.ctrlKey || e.metaKey) && e.key === "v") {
         const clip = clipboardRef.current;
         if (!clip) return;
         e.preventDefault();
@@ -468,17 +573,18 @@ const Annotate = (_props: BaseToolProps) => {
         const OFFSET = 20;
         const pasted: Record<string, unknown> = { ...annotation };
         // Assign a new id so EmbedPDF tracks the copy and delete works on it
-        pasted.id = typeof crypto !== 'undefined' && crypto.randomUUID
-          ? crypto.randomUUID()
-          : `paste-${Date.now()}-${Math.random().toString(36).slice(2)}`;
+        pasted.id =
+          typeof crypto !== "undefined" && crypto.randomUUID
+            ? crypto.randomUUID()
+            : `paste-${Date.now()}-${Math.random().toString(36).slice(2)}`;
         delete pasted.uid;
         // Remove appearance stream reference — the copy needs its own rendering
         delete pasted.appearanceModes;
         // Shift the EmbedPDF Rect: { origin: { x, y }, size: { width, height } }
         // PDF coords have y=0 at bottom, so down = smaller y; right = larger x
-        if (pasted.rect && typeof pasted.rect === 'object') {
+        if (pasted.rect && typeof pasted.rect === "object") {
           const r = pasted.rect as AnnotationRect;
-          if (r.origin && typeof r.origin === 'object') {
+          if (r.origin && typeof r.origin === "object") {
             pasted.rect = {
               ...r,
               origin: { x: r.origin.x + OFFSET, y: r.origin.y - OFFSET },
@@ -490,75 +596,92 @@ const Annotate = (_props: BaseToolProps) => {
       }
     };
 
-    window.addEventListener('keydown', handler);
-    return () => window.removeEventListener('keydown', handler);
+    window.addEventListener("keydown", handler);
+    return () => window.removeEventListener("keydown", handler);
   }, [buildToolOptions, annotationApiRef]);
 
-  const deriveToolFromAnnotation = useCallback((annotation: AnnotationSelection | null | undefined): AnnotationToolId | undefined => {
-    if (!annotation) return undefined;
-    const customToolId = annotation.customData?.toolId || annotation.customData?.annotationToolId;
-    if (isKnownAnnotationTool(customToolId)) {
-      return customToolId;
-    }
+  const deriveToolFromAnnotation = useCallback(
+    (
+      annotation: AnnotationSelection | null | undefined,
+    ): AnnotationToolId | undefined => {
+      if (!annotation) return undefined;
+      const customToolId =
+        annotation.customData?.toolId ||
+        annotation.customData?.annotationToolId;
+      if (isKnownAnnotationTool(customToolId)) {
+        return customToolId;
+      }
 
-    const type = annotation.type ?? annotation.object?.type;
-    switch (type) {
-      case 3: return 'text';        // FREETEXT
-      case 4: return 'line';        // LINE
-      case 5: return 'square';      // SQUARE
-      case 6: return 'circle';      // CIRCLE
-      case 7: return 'polygon';     // POLYGON
-      case 8: return 'polyline';    // POLYLINE
-      case 9: return 'highlight';   // HIGHLIGHT
-      case 10: return 'underline';  // UNDERLINE
-      case 11: return 'squiggly';   // SQUIGGLY
-      case 12: return 'strikeout';  // STRIKEOUT
-      case 13: return 'stamp';      // STAMP
-      case 15: return 'ink';        // INK
-      default: return undefined;
-    }
-  }, []);
+      const type = annotation.type ?? annotation.object?.type;
+      switch (type) {
+        case 3:
+          return "text"; // FREETEXT
+        case 4:
+          return "line"; // LINE
+        case 5:
+          return "square"; // SQUARE
+        case 6:
+          return "circle"; // CIRCLE
+        case 7:
+          return "polygon"; // POLYGON
+        case 8:
+          return "polyline"; // POLYLINE
+        case 9:
+          return "highlight"; // HIGHLIGHT
+        case 10:
+          return "underline"; // UNDERLINE
+        case 11:
+          return "squiggly"; // SQUIGGLY
+        case 12:
+          return "strikeout"; // STRIKEOUT
+        case 13:
+          return "stamp"; // STAMP
+        case 15:
+          return "ink"; // INK
+        default:
+          return undefined;
+      }
+    },
+    [],
+  );
 
-  const {
-    selectedAnn,
-    setSelectedAnn,
-    setSelectedAnnId,
-  } = useAnnotationSelection({
-    annotationApiRef,
-    deriveToolFromAnnotation,
-    activeToolRef,
-    setActiveTool,
-    setSelectedTextDraft,
-    setSelectedFontSize,
-    setInkWidth,
-    setShapeThickness,
-    setTextColor,
-    setTextBackgroundColor,
-    setNoteBackgroundColor,
-    setInkColor,
-    setHighlightColor,
-    setHighlightOpacity,
-    setFreehandHighlighterWidth,
-    setUnderlineColor,
-    setUnderlineOpacity,
-    setStrikeoutColor,
-    setStrikeoutOpacity,
-    setSquigglyColor,
-    setSquigglyOpacity,
-    setShapeStrokeColor,
-    setShapeFillColor,
-    setShapeOpacity,
-    setShapeStrokeOpacity,
-    setShapeFillOpacity,
-    setTextAlignment,
-  });
+  const { selectedAnn, setSelectedAnn, setSelectedAnnId } =
+    useAnnotationSelection({
+      annotationApiRef,
+      deriveToolFromAnnotation,
+      activeToolRef,
+      setActiveTool,
+      setSelectedTextDraft,
+      setSelectedFontSize,
+      setInkWidth,
+      setShapeThickness,
+      setTextColor,
+      setTextBackgroundColor,
+      setNoteBackgroundColor,
+      setInkColor,
+      setHighlightColor,
+      setHighlightOpacity,
+      setFreehandHighlighterWidth,
+      setUnderlineColor,
+      setUnderlineOpacity,
+      setStrikeoutColor,
+      setStrikeoutOpacity,
+      setSquigglyColor,
+      setSquigglyOpacity,
+      setShapeStrokeColor,
+      setShapeFillColor,
+      setShapeOpacity,
+      setShapeStrokeOpacity,
+      setShapeFillOpacity,
+      setTextAlignment,
+    });
 
   const steps =
     selectedFiles.length === 0
       ? []
       : [
           {
-            title: t('annotation.title', 'Annotate'),
+            title: t("annotation.title", "Annotate"),
             isCollapsed: false,
             onCollapsedClick: undefined,
             content: (
@@ -608,9 +731,9 @@ const Annotate = (_props: BaseToolProps) => {
         thumbnails: [],
         isGeneratingThumbnails: false,
         downloadUrl: null,
-        downloadFilename: '',
+        downloadFilename: "",
         isLoading: false,
-        status: '',
+        status: "",
         errorMessage: null,
         progress: null,
         executeOperation: async () => {},
@@ -619,7 +742,7 @@ const Annotate = (_props: BaseToolProps) => {
         cancelOperation: () => {},
         undoOperation: async () => {},
       },
-      title: '',
+      title: "",
       onFileClick: () => {},
       onUndo: () => {},
     },
diff --git a/frontend/src/core/tools/AutoRename.tsx b/frontend/src/core/tools/AutoRename.tsx
index fba80fba30..282fa8ce32 100644
--- a/frontend/src/core/tools/AutoRename.tsx
+++ b/frontend/src/core/tools/AutoRename.tsx
@@ -7,18 +7,18 @@ import { useAutoRenameParameters } from "@app/hooks/tools/autoRename/useAutoRena
 import { useAutoRenameOperation } from "@app/hooks/tools/autoRename/useAutoRenameOperation";
 import { useAutoRenameTips } from "@app/components/tooltips/useAutoRenameTips";
 
-const AutoRename =(props: BaseToolProps) => {
+const AutoRename = (props: BaseToolProps) => {
   const { t } = useTranslation();
   const autoRenameTips = useAutoRenameTips();
 
   const base = useBaseTool(
-    'auto-rename-pdf-file',
+    "auto-rename-pdf-file",
     useAutoRenameParameters,
     useAutoRenameOperation,
-    props
+    props,
   );
 
-return createToolFlow({
+  return createToolFlow({
     files: {
       selectedFiles: base.selectedFiles,
       isCollapsed: base.hasResults,
diff --git a/frontend/src/core/tools/Automate.tsx b/frontend/src/core/tools/Automate.tsx
index 11e7166569..4140f3c7ce 100644
--- a/frontend/src/core/tools/Automate.tsx
+++ b/frontend/src/core/tools/Automate.tsx
@@ -14,7 +14,12 @@ import { useAutomateOperation } from "@app/hooks/tools/automate/useAutomateOpera
 import { BaseToolProps } from "@app/types/tool";
 import { useToolRegistry } from "@app/contexts/ToolRegistryContext";
 import { useSavedAutomations } from "@app/hooks/tools/automate/useSavedAutomations";
-import { AutomationConfig, AutomationStepData, AutomationMode, AutomationStep } from "@app/types/automation";
+import {
+  AutomationConfig,
+  AutomationStepData,
+  AutomationMode,
+  AutomationStep,
+} from "@app/types/automation";
 import { AUTOMATION_STEPS } from "@app/constants/automation";
 
 const Automate = ({ onPreviewFile, onComplete, onError }: BaseToolProps) => {
@@ -23,13 +28,24 @@ const Automate = ({ onPreviewFile, onComplete, onError }: BaseToolProps) => {
   const { actions } = useNavigationActions();
   const { registerToolReset } = useToolWorkflow();
 
-  const [currentStep, setCurrentStep] = useState<AutomationStep>(AUTOMATION_STEPS.SELECTION);
-  const [stepData, setStepData] = useState<AutomationStepData>({ step: AUTOMATION_STEPS.SELECTION });
+  const [currentStep, setCurrentStep] = useState<AutomationStep>(
+    AUTOMATION_STEPS.SELECTION,
+  );
+  const [stepData, setStepData] = useState<AutomationStepData>({
+    step: AUTOMATION_STEPS.SELECTION,
+  });
 
   const automateOperation = useAutomateOperation();
   const { regularTools: toolRegistry } = useToolRegistry();
-  const hasResults = automateOperation.files.length > 0 || automateOperation.downloadUrl !== null;
-  const { savedAutomations, deleteAutomation, refreshAutomations, copyFromSuggested } = useSavedAutomations();
+  const hasResults =
+    automateOperation.files.length > 0 ||
+    automateOperation.downloadUrl !== null;
+  const {
+    savedAutomations,
+    deleteAutomation,
+    refreshAutomations,
+    copyFromSuggested,
+  } = useSavedAutomations();
 
   // Use ref to store the latest reset function to avoid closure issues
   const resetFunctionRef = React.useRef<() => void>(null);
@@ -55,12 +71,15 @@ const Automate = ({ onPreviewFile, onComplete, onError }: BaseToolProps) => {
       }
     };
 
-    registerToolReset('automate', stableResetFunction);
+    registerToolReset("automate", stableResetFunction);
   }, [registerToolReset]); // Only depend on registerToolReset which should be stable
 
   const handleStepChange = (data: AutomationStepData) => {
     // If navigating away from run step, reset automation results
-    if (currentStep === AUTOMATION_STEPS.RUN && data.step !== AUTOMATION_STEPS.RUN) {
+    if (
+      currentStep === AUTOMATION_STEPS.RUN &&
+      data.step !== AUTOMATION_STEPS.RUN
+    ) {
       automateOperation.resetResults();
     }
 
@@ -71,8 +90,12 @@ const Automate = ({ onPreviewFile, onComplete, onError }: BaseToolProps) => {
     }
 
     // If navigating to run step with a different automation, reset results
-    if (data.step === AUTOMATION_STEPS.RUN && data.automation &&
-        stepData.automation && data.automation.id !== stepData.automation.id) {
+    if (
+      data.step === AUTOMATION_STEPS.RUN &&
+      data.automation &&
+      stepData.automation &&
+      data.automation.id !== stepData.automation.id
+    ) {
       automateOperation.resetResults();
     }
 
@@ -96,14 +119,27 @@ const Automate = ({ onPreviewFile, onComplete, onError }: BaseToolProps) => {
         return (
           <AutomationSelection
             savedAutomations={savedAutomations}
-            onCreateNew={() => handleStepChange({ step: AUTOMATION_STEPS.CREATION, mode: AutomationMode.CREATE })}
-            onRun={(automation: AutomationConfig) => handleStepChange({ step: AUTOMATION_STEPS.RUN, automation })}
-            onEdit={(automation: AutomationConfig) => handleStepChange({ step: AUTOMATION_STEPS.CREATION, mode: AutomationMode.EDIT, automation })}
+            onCreateNew={() =>
+              handleStepChange({
+                step: AUTOMATION_STEPS.CREATION,
+                mode: AutomationMode.CREATE,
+              })
+            }
+            onRun={(automation: AutomationConfig) =>
+              handleStepChange({ step: AUTOMATION_STEPS.RUN, automation })
+            }
+            onEdit={(automation: AutomationConfig) =>
+              handleStepChange({
+                step: AUTOMATION_STEPS.CREATION,
+                mode: AutomationMode.EDIT,
+                automation,
+              })
+            }
             onDelete={async (automation: AutomationConfig) => {
               try {
                 await deleteAutomation(automation.id);
               } catch (error) {
-                console.error('Failed to delete automation:', error);
+                console.error("Failed to delete automation:", error);
                 onError?.(`Failed to delete automation: ${automation.name}`);
               }
             }}
@@ -111,8 +147,10 @@ const Automate = ({ onPreviewFile, onComplete, onError }: BaseToolProps) => {
               try {
                 await copyFromSuggested(suggestedAutomation);
               } catch (error) {
-                console.error('Failed to copy suggested automation:', error);
-                onError?.(`Failed to copy automation: ${suggestedAutomation.name}`);
+                console.error("Failed to copy suggested automation:", error);
+                onError?.(
+                  `Failed to copy automation: ${suggestedAutomation.name}`,
+                );
               }
             }}
             toolRegistry={toolRegistry}
@@ -121,14 +159,16 @@ const Automate = ({ onPreviewFile, onComplete, onError }: BaseToolProps) => {
 
       case AUTOMATION_STEPS.CREATION:
         if (!stepData.mode) {
-          console.error('Creation mode is undefined');
+          console.error("Creation mode is undefined");
           return null;
         }
         return (
           <AutomationCreation
             mode={stepData.mode}
             existingAutomation={stepData.automation}
-            onBack={() => handleStepChange({ step: AUTOMATION_STEPS.SELECTION })}
+            onBack={() =>
+              handleStepChange({ step: AUTOMATION_STEPS.SELECTION })
+            }
             onComplete={() => {
               refreshAutomations();
               handleStepChange({ step: AUTOMATION_STEPS.SELECTION });
@@ -139,7 +179,7 @@ const Automate = ({ onPreviewFile, onComplete, onError }: BaseToolProps) => {
 
       case AUTOMATION_STEPS.RUN:
         if (!stepData.automation) {
-          console.error('Automation config is undefined');
+          console.error("Automation config is undefined");
           return null;
         }
         return (
@@ -151,14 +191,18 @@ const Automate = ({ onPreviewFile, onComplete, onError }: BaseToolProps) => {
         );
 
       default:
-        return <div>{t('automate.invalidStep', 'Invalid step')}</div>;
+        return <div>{t("automate.invalidStep", "Invalid step")}</div>;
     }
   };
 
-  const createStep = (title: string, props: any, content?: React.ReactNode) => ({
+  const createStep = (
+    title: string,
+    props: any,
+    content?: React.ReactNode,
+  ) => ({
     title,
     ...props,
-    content
+    content,
   });
 
   // Always create files step to avoid conditional hook calls
@@ -168,35 +212,47 @@ const Automate = ({ onPreviewFile, onComplete, onError }: BaseToolProps) => {
   });
 
   const automationSteps = [
-    createStep(t('automate.selection.title', 'Automation Selection'), {
-      isVisible: true,
-      isCollapsed: currentStep !== AUTOMATION_STEPS.SELECTION,
-      onCollapsedClick: () => {
-        // Clear results when clicking back to selection
-        automateOperation.resetResults();
-        setCurrentStep(AUTOMATION_STEPS.SELECTION);
-        setStepData({ step: AUTOMATION_STEPS.SELECTION });
-      }
-    }, currentStep === AUTOMATION_STEPS.SELECTION ? renderCurrentStep() : null),
+    createStep(
+      t("automate.selection.title", "Automation Selection"),
+      {
+        isVisible: true,
+        isCollapsed: currentStep !== AUTOMATION_STEPS.SELECTION,
+        onCollapsedClick: () => {
+          // Clear results when clicking back to selection
+          automateOperation.resetResults();
+          setCurrentStep(AUTOMATION_STEPS.SELECTION);
+          setStepData({ step: AUTOMATION_STEPS.SELECTION });
+        },
+      },
+      currentStep === AUTOMATION_STEPS.SELECTION ? renderCurrentStep() : null,
+    ),
 
-    createStep(stepData.mode === AutomationMode.EDIT
-      ? t('automate.creation.editTitle', 'Edit Automation')
-      : t('automate.creation.createTitle', 'Create Automation'), {
-      isVisible: currentStep === AUTOMATION_STEPS.CREATION,
-      isCollapsed: false
-    }, currentStep === AUTOMATION_STEPS.CREATION ? renderCurrentStep() : null),
+    createStep(
+      stepData.mode === AutomationMode.EDIT
+        ? t("automate.creation.editTitle", "Edit Automation")
+        : t("automate.creation.createTitle", "Create Automation"),
+      {
+        isVisible: currentStep === AUTOMATION_STEPS.CREATION,
+        isCollapsed: false,
+      },
+      currentStep === AUTOMATION_STEPS.CREATION ? renderCurrentStep() : null,
+    ),
 
     // Files step - only visible during run mode
     {
       ...filesStep,
-      isVisible: currentStep === AUTOMATION_STEPS.RUN
+      isVisible: currentStep === AUTOMATION_STEPS.RUN,
     },
 
     // Run step
-    createStep(t('automate.run.title', 'Run Automation'), {
-      isVisible: currentStep === AUTOMATION_STEPS.RUN,
-      isCollapsed: hasResults,
-    }, currentStep === AUTOMATION_STEPS.RUN ? renderCurrentStep() : null)
+    createStep(
+      t("automate.run.title", "Run Automation"),
+      {
+        isVisible: currentStep === AUTOMATION_STEPS.RUN,
+        isCollapsed: hasResults,
+      },
+      currentStep === AUTOMATION_STEPS.RUN ? renderCurrentStep() : null,
+    ),
   ];
 
   return createToolFlow({
@@ -209,13 +265,13 @@ const Automate = ({ onPreviewFile, onComplete, onError }: BaseToolProps) => {
     review: {
       isVisible: hasResults && currentStep === AUTOMATION_STEPS.RUN,
       operation: automateOperation,
-      title: t('automate.reviewTitle', 'Automation Results'),
+      title: t("automate.reviewTitle", "Automation Results"),
       onFileClick: (file: File) => {
         onPreviewFile?.(file);
-        actions.setWorkbench('viewer');
+        actions.setWorkbench("viewer");
       },
-      onUndo: handleUndo
-    }
+      onUndo: handleUndo,
+    },
   });
 };
 
diff --git a/frontend/src/core/tools/BookletImposition.tsx b/frontend/src/core/tools/BookletImposition.tsx
index 86a4ee344c..834758c95c 100644
--- a/frontend/src/core/tools/BookletImposition.tsx
+++ b/frontend/src/core/tools/BookletImposition.tsx
@@ -11,10 +11,10 @@ const BookletImposition = (props: BaseToolProps) => {
   const { t } = useTranslation();
 
   const base = useBaseTool(
-    'bookletImposition',
+    "bookletImposition",
     useBookletImpositionParameters,
     useBookletImpositionOperation,
-    props
+    props,
   );
 
   const bookletTips = useBookletImpositionTips();
@@ -28,7 +28,9 @@ const BookletImposition = (props: BaseToolProps) => {
       {
         title: "Settings",
         isCollapsed: base.settingsCollapsed,
-        onCollapsedClick: base.settingsCollapsed ? base.handleSettingsReset : undefined,
+        onCollapsedClick: base.settingsCollapsed
+          ? base.handleSettingsReset
+          : undefined,
         tooltip: bookletTips,
         content: (
           <BookletImpositionSettings
@@ -57,4 +59,4 @@ const BookletImposition = (props: BaseToolProps) => {
   });
 };
 
-export default BookletImposition as ToolComponent;
\ No newline at end of file
+export default BookletImposition as ToolComponent;
diff --git a/frontend/src/core/tools/CertSign.tsx b/frontend/src/core/tools/CertSign.tsx
index a272d7c63c..1367953100 100644
--- a/frontend/src/core/tools/CertSign.tsx
+++ b/frontend/src/core/tools/CertSign.tsx
@@ -14,14 +14,14 @@ import { BaseToolProps, ToolComponent } from "@app/types/tool";
 
 const CertSign = (props: BaseToolProps) => {
   const { t } = useTranslation();
-  
+
   const base = useBaseTool(
-    'certSign',
+    "certSign",
     useCertSignParameters,
     useCertSignOperation,
-    props
+    props,
   );
-  
+
   const certTypeTips = useCertificateTypeTips();
   const appearanceTips = useSignatureAppearanceTips();
   const signModeTips = useSignModeTips();
@@ -29,20 +29,20 @@ const CertSign = (props: BaseToolProps) => {
   // Check if certificate files are configured for appearance step
   const areCertFilesConfigured = () => {
     const params = base.params.parameters;
-    
+
     // Auto mode (server certificate) - always configured
-    if (params.signMode === 'AUTO') {
+    if (params.signMode === "AUTO") {
       return true;
     }
-    
+
     // Manual mode - check for required files based on cert type
     switch (params.certType) {
-      case 'PEM':
+      case "PEM":
         return !!(params.privateKeyFile && params.certFile);
-      case 'PKCS12':
-      case 'PFX':
+      case "PKCS12":
+      case "PFX":
         return !!params.p12File;
-      case 'JKS':
+      case "JKS":
         return !!params.jksFile;
       default:
         return false;
@@ -59,7 +59,9 @@ const CertSign = (props: BaseToolProps) => {
       {
         title: t("certSign.signMode.stepTitle", "Sign Mode"),
         isCollapsed: base.settingsCollapsed,
-        onCollapsedClick: base.settingsCollapsed ? base.handleSettingsReset : undefined,
+        onCollapsedClick: base.settingsCollapsed
+          ? base.handleSettingsReset
+          : undefined,
         tooltip: signModeTips,
         content: (
           <CertificateTypeSettings
@@ -69,35 +71,50 @@ const CertSign = (props: BaseToolProps) => {
           />
         ),
       },
-      ...(base.params.parameters.signMode === 'MANUAL' ? [{
-        title: t("certSign.certTypeStep.stepTitle", "Certificate Format"),
-        isCollapsed: base.settingsCollapsed,
-        onCollapsedClick: base.settingsCollapsed ? base.handleSettingsReset : undefined,
-        tooltip: certTypeTips,
-        content: (
-          <CertificateFormatSettings
-            parameters={base.params.parameters}
-            onParameterChange={base.params.updateParameter}
-            disabled={base.endpointLoading}
-          />
-        ),
-      }] : []),
-      ...(base.params.parameters.signMode === 'MANUAL' ? [{
-        title: t("certSign.certFiles.stepTitle", "Certificate Files"),
-        isCollapsed: base.settingsCollapsed,
-        onCollapsedClick: base.settingsCollapsed ? base.handleSettingsReset : undefined,
-        content: (
-          <CertificateFilesSettings
-            parameters={base.params.parameters}
-            onParameterChange={base.params.updateParameter}
-            disabled={base.endpointLoading}
-          />
-        ),
-      }] : []),
+      ...(base.params.parameters.signMode === "MANUAL"
+        ? [
+            {
+              title: t("certSign.certTypeStep.stepTitle", "Certificate Format"),
+              isCollapsed: base.settingsCollapsed,
+              onCollapsedClick: base.settingsCollapsed
+                ? base.handleSettingsReset
+                : undefined,
+              tooltip: certTypeTips,
+              content: (
+                <CertificateFormatSettings
+                  parameters={base.params.parameters}
+                  onParameterChange={base.params.updateParameter}
+                  disabled={base.endpointLoading}
+                />
+              ),
+            },
+          ]
+        : []),
+      ...(base.params.parameters.signMode === "MANUAL"
+        ? [
+            {
+              title: t("certSign.certFiles.stepTitle", "Certificate Files"),
+              isCollapsed: base.settingsCollapsed,
+              onCollapsedClick: base.settingsCollapsed
+                ? base.handleSettingsReset
+                : undefined,
+              content: (
+                <CertificateFilesSettings
+                  parameters={base.params.parameters}
+                  onParameterChange={base.params.updateParameter}
+                  disabled={base.endpointLoading}
+                />
+              ),
+            },
+          ]
+        : []),
       {
         title: t("certSign.appearance.stepTitle", "Signature Appearance"),
         isCollapsed: base.settingsCollapsed || !areCertFilesConfigured(),
-        onCollapsedClick: (base.settingsCollapsed || !areCertFilesConfigured()) ? base.handleSettingsReset : undefined,
+        onCollapsedClick:
+          base.settingsCollapsed || !areCertFilesConfigured()
+            ? base.handleSettingsReset
+            : undefined,
         tooltip: appearanceTips,
         content: (
           <SignatureAppearanceSettings
@@ -129,4 +146,4 @@ const CertSign = (props: BaseToolProps) => {
 // Static method to get the operation hook for automation
 CertSign.tool = () => useCertSignOperation;
 
-export default CertSign as ToolComponent;
\ No newline at end of file
+export default CertSign as ToolComponent;
diff --git a/frontend/src/core/tools/ChangeMetadata.tsx b/frontend/src/core/tools/ChangeMetadata.tsx
index e44a298526..c4255fa357 100644
--- a/frontend/src/core/tools/ChangeMetadata.tsx
+++ b/frontend/src/core/tools/ChangeMetadata.tsx
@@ -14,15 +14,15 @@ import {
   useDeleteAllTips,
   useStandardMetadataTips,
   useDocumentDatesTips,
-  useAdvancedOptionsTips
+  useAdvancedOptionsTips,
 } from "@app/components/tooltips/useChangeMetadataTips";
 
 enum MetadataStep {
-  NONE = 'none',
-  DELETE_ALL = 'deleteAll',
-  STANDARD_METADATA = 'standardMetadata',
-  DOCUMENT_DATES = 'documentDates',
-  ADVANCED_OPTIONS = 'advancedOptions'
+  NONE = "none",
+  DELETE_ALL = "deleteAll",
+  STANDARD_METADATA = "standardMetadata",
+  DOCUMENT_DATES = "documentDates",
+  ADVANCED_OPTIONS = "advancedOptions",
 }
 
 const ChangeMetadata = (props: BaseToolProps) => {
@@ -35,7 +35,7 @@ const ChangeMetadata = (props: BaseToolProps) => {
   const advancedOptionsTips = useAdvancedOptionsTips();
 
   const base = useBaseTool(
-    'changeMetadata',
+    "changeMetadata",
     useChangeMetadataParameters,
     useChangeMetadataOperation,
     props,
@@ -50,7 +50,7 @@ const ChangeMetadata = (props: BaseToolProps) => {
     initialStep: MetadataStep.DELETE_ALL,
     stateConditions: {
       hasFiles: base.hasFiles,
-      hasResults: base.hasResults
+      hasResults: base.hasResults,
     },
     afterResults: base.handleSettingsReset,
   });
@@ -59,7 +59,8 @@ const ChangeMetadata = (props: BaseToolProps) => {
   const createStandardMetadataStep = () => ({
     title: t("changeMetadata.standardFields.title", "Standard Fields"),
     isCollapsed: accordion.getCollapsedState(MetadataStep.STANDARD_METADATA),
-    onCollapsedClick: () => accordion.handleStepToggle(MetadataStep.STANDARD_METADATA),
+    onCollapsedClick: () =>
+      accordion.handleStepToggle(MetadataStep.STANDARD_METADATA),
     tooltip: standardMetadataTips,
     content: (
       <StandardMetadataStep
@@ -73,7 +74,8 @@ const ChangeMetadata = (props: BaseToolProps) => {
   const createDocumentDatesStep = () => ({
     title: t("changeMetadata.dates.title", "Date Fields"),
     isCollapsed: accordion.getCollapsedState(MetadataStep.DOCUMENT_DATES),
-    onCollapsedClick: () => accordion.handleStepToggle(MetadataStep.DOCUMENT_DATES),
+    onCollapsedClick: () =>
+      accordion.handleStepToggle(MetadataStep.DOCUMENT_DATES),
     tooltip: documentDatesTips,
     content: (
       <DocumentDatesStep
@@ -87,7 +89,8 @@ const ChangeMetadata = (props: BaseToolProps) => {
   const createAdvancedOptionsStep = () => ({
     title: t("changeMetadata.advanced.title", "Advanced Options"),
     isCollapsed: accordion.getCollapsedState(MetadataStep.ADVANCED_OPTIONS),
-    onCollapsedClick: () => accordion.handleStepToggle(MetadataStep.ADVANCED_OPTIONS),
+    onCollapsedClick: () =>
+      accordion.handleStepToggle(MetadataStep.ADVANCED_OPTIONS),
     tooltip: advancedOptionsTips,
     content: (
       <AdvancedOptionsStep
@@ -107,7 +110,8 @@ const ChangeMetadata = (props: BaseToolProps) => {
       {
         title: t("changeMetadata.deleteAll.label", "Remove Existing Metadata"),
         isCollapsed: accordion.getCollapsedState(MetadataStep.DELETE_ALL),
-        onCollapsedClick: () => accordion.handleStepToggle(MetadataStep.DELETE_ALL),
+        onCollapsedClick: () =>
+          accordion.handleStepToggle(MetadataStep.DELETE_ALL),
         tooltip: deleteAllTips,
         content: (
           <DeleteAllStep
@@ -123,7 +127,7 @@ const ChangeMetadata = (props: BaseToolProps) => {
       steps.push(
         createStandardMetadataStep(),
         createDocumentDatesStep(),
-        createAdvancedOptionsStep()
+        createAdvancedOptionsStep(),
       );
     }
 
diff --git a/frontend/src/core/tools/ChangePermissions.tsx b/frontend/src/core/tools/ChangePermissions.tsx
index baa38cce75..067bd44dbb 100644
--- a/frontend/src/core/tools/ChangePermissions.tsx
+++ b/frontend/src/core/tools/ChangePermissions.tsx
@@ -12,10 +12,10 @@ const ChangePermissions = (props: BaseToolProps) => {
   const changePermissionsTips = useChangePermissionsTips();
 
   const base = useBaseTool(
-    'changePermissions',
+    "changePermissions",
     useChangePermissionsParameters,
     useChangePermissionsOperation,
-    props
+    props,
   );
 
   return createToolFlow({
@@ -27,7 +27,9 @@ const ChangePermissions = (props: BaseToolProps) => {
       {
         title: t("changePermissions.title", "Document Permissions"),
         isCollapsed: base.settingsCollapsed,
-        onCollapsedClick: base.settingsCollapsed ? base.handleSettingsReset : undefined,
+        onCollapsedClick: base.settingsCollapsed
+          ? base.handleSettingsReset
+          : undefined,
         tooltip: changePermissionsTips,
         content: (
           <ChangePermissionsSettings
diff --git a/frontend/src/core/tools/Compare.tsx b/frontend/src/core/tools/Compare.tsx
index a2a78a0368..7cc36b86be 100644
--- a/frontend/src/core/tools/Compare.tsx
+++ b/frontend/src/core/tools/Compare.tsx
@@ -1,34 +1,43 @@
-import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
-import { useTranslation } from 'react-i18next';
-import CompareRoundedIcon from '@mui/icons-material/CompareRounded';
-import { Box, Group, Stack, Text, Button, Modal, ActionIcon } from '@mantine/core';
-import SwapVertRoundedIcon from '@mui/icons-material/SwapVertRounded';
-import AddIcon from '@mui/icons-material/Add';
-import { createToolFlow } from '@app/components/tools/shared/createToolFlow';
-import { useBaseTool } from '@app/hooks/tools/shared/useBaseTool';
-import { BaseToolProps, ToolComponent } from '@app/types/tool';
+import { useCallback, useEffect, useMemo, useRef, useState } from "react";
+import { useTranslation } from "react-i18next";
+import CompareRoundedIcon from "@mui/icons-material/CompareRounded";
+import {
+  Box,
+  Group,
+  Stack,
+  Text,
+  Button,
+  Modal,
+  ActionIcon,
+  SegmentedControl,
+} from "@mantine/core";
+import SwapVertRoundedIcon from "@mui/icons-material/SwapVertRounded";
+import AddIcon from "@mui/icons-material/Add";
+import { createToolFlow } from "@app/components/tools/shared/createToolFlow";
+import { useBaseTool } from "@app/hooks/tools/shared/useBaseTool";
+import { BaseToolProps, ToolComponent } from "@app/types/tool";
 import {
   useCompareParameters,
   defaultParameters as compareDefaultParameters,
-} from '@app/hooks/tools/compare/useCompareParameters';
+} from "@app/hooks/tools/compare/useCompareParameters";
 import {
   useCompareOperation,
   CompareOperationHook,
-} from '@app/hooks/tools/compare/useCompareOperation';
-import CompareWorkbenchView from '@app/components/tools/compare/CompareWorkbenchView';
-import { useToolWorkflow } from '@app/contexts/ToolWorkflowContext';
-import { useNavigationActions } from '@app/contexts/NavigationContext';
-import { useFileContext, useFileState } from '@app/contexts/file/fileHooks';
-import type { FileId } from '@app/types/file';
-import type { StirlingFile } from '@app/types/fileContext';
-import DocumentThumbnail from '@app/components/shared/filePreview/DocumentThumbnail';
-import type { CompareWorkbenchData } from '@app/types/compare';
-import FitText from '@app/components/shared/FitText';
-import { getDefaultWorkbench } from '@app/types/workbench';
-import { useFilesModalContext } from '@app/contexts/FilesModalContext';
+} from "@app/hooks/tools/compare/useCompareOperation";
+import CompareWorkbenchView from "@app/components/tools/compare/CompareWorkbenchView";
+import { useToolWorkflow } from "@app/contexts/ToolWorkflowContext";
+import { useNavigationActions } from "@app/contexts/NavigationContext";
+import { useFileContext, useFileState } from "@app/contexts/file/fileHooks";
+import type { FileId } from "@app/types/file";
+import type { StirlingFile } from "@app/types/fileContext";
+import DocumentThumbnail from "@app/components/shared/filePreview/DocumentThumbnail";
+import type { CompareWorkbenchData } from "@app/types/compare";
+import { getDefaultWorkbench } from "@app/types/workbench";
+import { useFilesModalContext } from "@app/contexts/FilesModalContext";
+import { truncateCenter } from "@app/utils/textUtils";
 
-const CUSTOM_VIEW_ID = 'compareWorkbenchView';
-const CUSTOM_WORKBENCH_ID = 'custom:compareWorkbenchView' as const;
+const CUSTOM_VIEW_ID = "compareWorkbenchView";
+const CUSTOM_WORKBENCH_ID = "custom:compareWorkbenchView" as const;
 
 const Compare = (props: BaseToolProps) => {
   const { t } = useTranslation();
@@ -44,45 +53,93 @@ const Compare = (props: BaseToolProps) => {
   const { openFilesModal } = useFilesModalContext();
 
   const base = useBaseTool(
-    'compare',
+    "compare",
     useCompareParameters,
     useCompareOperation,
     props,
-    { minFiles: 2 }
+    {
+      minFiles: 2,
+      ignoreViewerScope: true,
+      // Compare auto-fills slots from loaded files via its own effect; the
+      // shared reset races and clobbers those writes.
+      skipResetParamsOnFirstFiles: true,
+    },
   );
 
   const operation = base.operation as CompareOperationHook;
   const params = base.params.parameters;
 
-  const compareIcon = useMemo(() => <CompareRoundedIcon fontSize="small" />, []);
+  const compareIcon = useMemo(
+    () => <CompareRoundedIcon fontSize="small" />,
+    [],
+  );
   const [swapConfirmOpen, setSwapConfirmOpen] = useState(false);
   const [clearConfirmOpen, setClearConfirmOpen] = useState(false);
   const performClearSelected = useCallback(() => {
-    try { base.operation.cancelOperation(); } catch { console.error('Failed to cancel operation'); }
-    try { base.operation.resetResults(); } catch { console.error('Failed to reset results'); }
-    base.params.setParameters(prev => ({ ...prev, baseFileId: null, comparisonFileId: null }));
-    try { fileActions.clearSelections(); } catch { console.error('Failed to clear selections'); }
+    try {
+      base.operation.cancelOperation();
+    } catch {
+      console.error("Failed to cancel operation");
+    }
+    try {
+      base.operation.resetResults();
+    } catch {
+      console.error("Failed to reset results");
+    }
+    base.params.setParameters((prev) => ({
+      ...prev,
+      baseFileId: null,
+      comparisonFileId: null,
+    }));
+    try {
+      fileActions.clearSelections();
+    } catch {
+      console.error("Failed to clear selections");
+    }
+    // Also remove the loaded files from the workbench so the selection
+    // indicator resets to zero. Files stay in IndexedDB so users can re-pick
+    // them from "Recent" later.
+    try {
+      const loadedIds = fileState.files.ids as FileId[];
+      if (loadedIds.length > 0) {
+        void fileActions.removeFiles(loadedIds, false);
+      }
+    } catch {
+      console.error("Failed to remove workbench files");
+    }
     clearCustomWorkbenchViewData(CUSTOM_VIEW_ID);
     navigationActions.setWorkbench(getDefaultWorkbench());
-  }, [base.operation, base.params, clearCustomWorkbenchViewData, fileActions, navigationActions]);
+  }, [
+    base.operation,
+    base.params,
+    clearCustomWorkbenchViewData,
+    fileActions,
+    fileState.files.ids,
+    navigationActions,
+  ]);
 
   useEffect(() => {
     const handler = () => {
       performClearSelected();
     };
-    window.addEventListener('compare:clear-selected', handler as unknown as EventListener);
+    window.addEventListener(
+      "compare:clear-selected",
+      handler as unknown as EventListener,
+    );
     return () => {
-      window.removeEventListener('compare:clear-selected', handler as unknown as EventListener);
+      window.removeEventListener(
+        "compare:clear-selected",
+        handler as unknown as EventListener,
+      );
     };
   }, [performClearSelected]);
 
-
   useEffect(() => {
     registerCustomWorkbenchView({
       id: CUSTOM_VIEW_ID,
       workbenchId: CUSTOM_WORKBENCH_ID,
       // Use a static label at registration time to avoid re-registering on i18n changes
-      label: 'Compare view',
+      label: "Compare view",
       icon: compareIcon,
       component: CompareWorkbenchView,
     });
@@ -90,36 +147,92 @@ const Compare = (props: BaseToolProps) => {
     return () => {
       unregisterCustomWorkbenchView(CUSTOM_VIEW_ID);
     };
-  // Register once; avoid re-registering on translation/prop changes which clears data mid-flight
+    // Register once; avoid re-registering on translation/prop changes which clears data mid-flight
   }, []);
 
-  // Auto-map from workbench selection: always reflect the first two selected files in order.
-  // This also handles deselection by promoting the remaining selection to base and clearing comparison.
+  // On mount: clear selections unless exactly 2 files are loaded.
   useEffect(() => {
-    // Use selected IDs directly from state so it works even if File objects aren't loaded yet
-    const selectedIds = (fileState.ui.selectedFileIds as FileId[]) ?? [];
+    if ((fileState.files.ids as FileId[]).length !== 2) {
+      fileActions.clearSelections();
+    }
+  }, []);
 
-    // Determine next base: keep current if still selected; otherwise use the first selected id
-    const nextBase: FileId | null = params.baseFileId && selectedIds.includes(params.baseFileId)
-      ? (params.baseFileId as FileId)
-      : (selectedIds[0] ?? null);
+  // Track previous file count to detect the transition to exactly 2 files.
+  const prevAllIdsLengthRef = useRef<number | null>(null);
 
-    // Determine next comparison: keep current if still selected and distinct; otherwise use the first other selected id
-    let nextComp: FileId | null = null;
-    if (params.comparisonFileId && selectedIds.includes(params.comparisonFileId) && params.comparisonFileId !== nextBase) {
-      nextComp = params.comparisonFileId as FileId;
-    } else {
-      nextComp = (selectedIds.find(id => id !== nextBase) ?? null) as FileId | null;
+  // Auto-fill slots when the file count first reaches 2; respect manual picker changes after that.
+  useEffect(() => {
+    const selectedIds = fileState.ui.selectedFileIds as FileId[];
+    const allIds = fileState.files.ids as FileId[];
+    const prevLength = prevAllIdsLengthRef.current;
+    prevAllIdsLengthRef.current = allIds.length;
+
+    if (allIds.length === 2 && prevLength !== 2) {
+      // Transitioned to exactly 2 files — auto-fill both slots.
+      const [firstId, secondId] = allIds as [FileId, FileId];
+      fileActions.setSelectedFiles([firstId, secondId]);
+      base.params.setParameters((prev) => {
+        if (prev.baseFileId === firstId && prev.comparisonFileId === secondId)
+          return prev;
+        return { ...prev, baseFileId: firstId, comparisonFileId: secondId };
+      });
+      return;
     }
 
-    if (nextBase !== params.baseFileId || nextComp !== params.comparisonFileId) {
-      base.params.setParameters(prev => ({
+    if (selectedIds.length > 2) {
+      fileActions.setSelectedFiles(selectedIds.slice(0, 2) as FileId[]);
+      return;
+    }
+
+    // Sticky slot mapping: preserve the current slot if its file is still selected,
+    // otherwise fill empty slots from the selection in order. This lets users add/remove
+    // files from the selection without the other slot being clobbered.
+    //
+    // Fallback: when there's no selection yet but files are loaded in the workbench,
+    // draw from `allIds`. This covers the brief window between ADD_FILES and
+    // SET_SELECTED_FILES during an upload (the selection dispatch can lag the file
+    // dispatch by several renders), which would otherwise leave the slot showing
+    // the "Select the original PDF" placeholder until the selection catches up.
+    const sourceIds = selectedIds.length > 0 ? selectedIds : allIds;
+    base.params.setParameters((prev) => {
+      const prevBase = prev.baseFileId as FileId | null;
+      const prevComp = prev.comparisonFileId as FileId | null;
+
+      const keepBase =
+        prevBase && sourceIds.includes(prevBase) ? prevBase : null;
+      const nextBase: FileId | null =
+        keepBase ?? ((sourceIds[0] ?? null) as FileId | null);
+
+      const keepComp =
+        prevComp && sourceIds.includes(prevComp) && prevComp !== nextBase
+          ? prevComp
+          : null;
+      const nextComp: FileId | null =
+        keepComp ??
+        ((sourceIds.find((id) => id !== nextBase) ?? null) as FileId | null);
+
+      if (prev.baseFileId === nextBase && prev.comparisonFileId === nextComp)
+        return prev;
+      return { ...prev, baseFileId: nextBase, comparisonFileId: nextComp };
+    });
+  }, [fileState.ui.selectedFileIds, fileState.files.ids]);
+
+  // Clear a slot if its file is removed from the workbench.
+  useEffect(() => {
+    const allIds = fileState.files.ids as FileId[];
+    if (params.baseFileId && !allIds.includes(params.baseFileId as FileId)) {
+      base.params.setParameters((prev) => ({ ...prev, baseFileId: null }));
+    }
+    if (
+      params.comparisonFileId &&
+      !allIds.includes(params.comparisonFileId as FileId)
+    ) {
+      base.params.setParameters((prev) => ({
         ...prev,
-        baseFileId: nextBase,
-        comparisonFileId: nextComp,
+        comparisonFileId: null,
       }));
     }
-  }, [fileState.ui.selectedFileIds, base.params, params.baseFileId, params.comparisonFileId]);
+  }, [fileState.files.ids]);
 
   // Track workbench data and drive loading/result state transitions
   const lastProcessedAtRef = useRef<number | null>(null);
@@ -142,14 +255,17 @@ const Compare = (props: BaseToolProps) => {
       lastWorkbenchDataRef.current = data;
       setCustomWorkbenchViewData(CUSTOM_VIEW_ID, data);
     },
-    [setCustomWorkbenchViewData]
+    [setCustomWorkbenchViewData],
   );
 
   const prepareWorkbenchForRun = useCallback(
     (
       baseId: FileId | null,
       compId: FileId | null,
-      options?: { baseFile?: StirlingFile | null; comparisonFile?: StirlingFile | null }
+      options?: {
+        baseFile?: StirlingFile | null;
+        comparisonFile?: StirlingFile | null;
+      },
     ) => {
       if (!baseId || !compId) {
         return;
@@ -178,7 +294,7 @@ const Compare = (props: BaseToolProps) => {
 
       lastProcessedAtRef.current = null;
     },
-    [selectors, updateWorkbenchData]
+    [selectors, updateWorkbenchData],
   );
 
   useEffect(() => {
@@ -266,34 +382,51 @@ const Compare = (props: BaseToolProps) => {
     if (baseSel) selected.push(baseSel);
     if (compSel) selected.push(compSel);
 
-    prepareWorkbenchForRun(baseId, compId, { baseFile: baseSel ?? null, comparisonFile: compSel ?? null });
+    prepareWorkbenchForRun(baseId, compId, {
+      baseFile: baseSel ?? null,
+      comparisonFile: compSel ?? null,
+    });
     if (baseId && compId) {
       requestAnimationFrame(() => {
         navigationActions.setWorkbench(CUSTOM_WORKBENCH_ID);
       });
     }
 
-    await operation.executeOperation(
-      { ...params },
-      selected
-    );
-  }, [base.selectedFiles, navigationActions, operation, params, prepareWorkbenchForRun, selectors]);
+    await operation.executeOperation({ ...params }, selected);
+  }, [
+    base.selectedFiles,
+    navigationActions,
+    operation,
+    params,
+    prepareWorkbenchForRun,
+    selectors,
+  ]);
 
   // Run compare with explicit ids (used after swap so we don't depend on async state propagation)
-  const runCompareWithIds = useCallback(async (baseId: FileId | null, compId: FileId | null) => {
-    const nextParams = { ...params, baseFileId: baseId, comparisonFileId: compId };
-    const selected: StirlingFile[] = [];
-    const baseSel =
-      base.selectedFiles.find((file) => file.fileId === baseId) ??
-      (baseId ? selectors.getFile(baseId) : null);
-    const compSel =
-      base.selectedFiles.find((file) => file.fileId === compId) ??
-      (compId ? selectors.getFile(compId) : null);
-    if (baseSel) selected.push(baseSel);
-    if (compSel) selected.push(compSel);
-    prepareWorkbenchForRun(baseId, compId, { baseFile: baseSel ?? null, comparisonFile: compSel ?? null });
-    await operation.executeOperation(nextParams, selected);
-  }, [base.selectedFiles, operation, params, prepareWorkbenchForRun, selectors]);
+  const runCompareWithIds = useCallback(
+    async (baseId: FileId | null, compId: FileId | null) => {
+      const nextParams = {
+        ...params,
+        baseFileId: baseId,
+        comparisonFileId: compId,
+      };
+      const selected: StirlingFile[] = [];
+      const baseSel =
+        base.selectedFiles.find((file) => file.fileId === baseId) ??
+        (baseId ? selectors.getFile(baseId) : null);
+      const compSel =
+        base.selectedFiles.find((file) => file.fileId === compId) ??
+        (compId ? selectors.getFile(compId) : null);
+      if (baseSel) selected.push(baseSel);
+      if (compSel) selected.push(compSel);
+      prepareWorkbenchForRun(baseId, compId, {
+        baseFile: baseSel ?? null,
+        comparisonFile: compSel ?? null,
+      });
+      await operation.executeOperation(nextParams, selected);
+    },
+    [base.selectedFiles, operation, params, prepareWorkbenchForRun, selectors],
+  );
 
   const performSwap = useCallback(() => {
     const baseId = params.baseFileId as FileId | null;
@@ -307,7 +440,13 @@ const Compare = (props: BaseToolProps) => {
     if (operation.result) {
       runCompareWithIds(compId, baseId);
     }
-  }, [base.params, operation.result, params.baseFileId, params.comparisonFileId, runCompareWithIds]);
+  }, [
+    base.params,
+    operation.result,
+    params.baseFileId,
+    params.comparisonFileId,
+    runCompareWithIds,
+  ]);
 
   // No custom handler; rely on global add flow which auto-selects added files
 
@@ -320,43 +459,60 @@ const Compare = (props: BaseToolProps) => {
       return;
     }
     performSwap();
-  }, [operation.result, params.baseFileId, params.comparisonFileId, performSwap]);
+  }, [
+    operation.result,
+    params.baseFileId,
+    params.comparisonFileId,
+    performSwap,
+  ]);
 
   const renderSelectedFile = useCallback(
-    (role: 'base' | 'comparison') => {
-      const fileId = role === 'base' ? params.baseFileId : params.comparisonFileId;
+    (role: "base" | "comparison") => {
+      const fileId =
+        role === "base" ? params.baseFileId : params.comparisonFileId;
       const stub = fileId ? selectors.getStirlingFileStub(fileId) : undefined;
-      
+
       // Show add button in base if no base file, or in comparison if base exists but no comparison
-      const shouldShowAddButton = 
-        (role === 'base' && !params.baseFileId) || 
-        (role === 'comparison' && params.baseFileId && !params.comparisonFileId);
+      const shouldShowAddButton =
+        (role === "base" && !params.baseFileId) ||
+        (role === "comparison" &&
+          params.baseFileId &&
+          !params.comparisonFileId);
 
       if (!stub) {
         return (
-        <Stack gap={6}>
+          <Stack gap={6}>
             <Box
+              data-testid={`compare-slot-${role}`}
+              data-slot-state="empty"
               style={{
-                border: '1px solid var(--border-default)',
-                borderRadius: 'var(--radius-md)',
-                padding: '0.75rem 1rem',
-                background: 'var(--bg-surface)',
-                width: '100%',
-                display: 'flex',
-                alignItems: 'center',
-                justifyContent: 'space-between',
-                cursor: shouldShowAddButton ? 'pointer' : 'default',
+                border: "1px solid var(--border-default)",
+                borderRadius: "var(--radius-md)",
+                padding: "0.75rem 1rem",
+                background: "var(--bg-surface)",
+                width: "100%",
+                display: "flex",
+                alignItems: "center",
+                justifyContent: "space-between",
+                cursor: shouldShowAddButton ? "pointer" : "default",
               }}
-              onClick={shouldShowAddButton ? () => openFilesModal({}) : undefined}
+              onClick={
+                shouldShowAddButton ? () => openFilesModal({}) : undefined
+              }
             >
               <Text size="sm" c="dimmed">
                 {t(
-                  role === 'base' ? 'compare.original.placeholder' : 'compare.edited.placeholder',
-                  role === 'base' ? 'Select the original PDF' : 'Select the edited PDF'
+                  role === "base"
+                    ? "compare.original.placeholder"
+                    : "compare.edited.placeholder",
+                  role === "base"
+                    ? "Select the original PDF"
+                    : "Select the edited PDF",
                 )}
               </Text>
               {shouldShowAddButton && (
                 <ActionIcon
+                  data-testid={`compare-slot-${role}-add`}
                   variant="filled"
                   color="blue"
                   size="sm"
@@ -376,42 +532,61 @@ const Compare = (props: BaseToolProps) => {
       // Build compact meta line for pages and date
       const dateMs = (stub?.lastModified || stub?.createdAt) ?? null;
       const dateText = dateMs
-        ? new Date(dateMs).toLocaleDateString(undefined, { month: 'short', day: '2-digit', year: 'numeric' })
-        : '';
+        ? new Date(dateMs).toLocaleDateString(undefined, {
+            month: "short",
+            day: "2-digit",
+            year: "numeric",
+          })
+        : "";
       const pageCount = stub?.processedFile?.totalPages || null;
 
       return (
         <Stack gap={6}>
           <Box
+            data-testid={`compare-slot-${role}`}
+            data-slot-state="filled"
+            data-slot-filename={stub?.name}
             style={{
-              border: '1px solid var(--border-default)',
-              borderRadius: 'var(--radius-md)',
-              padding: '0.75rem 1rem',
-              background: 'var(--bg-surface)',
-              width: '100%',
-              minHeight: "9rem"
-
+              border: "1px solid var(--border-default)",
+              borderRadius: "var(--radius-md)",
+              padding: "0.75rem 1rem",
+              background: "var(--bg-surface)",
+              width: "100%",
+              minHeight: "9rem",
             }}
           >
             <Group align="flex-start" wrap="nowrap" gap="md">
-              <Box className="compare-tool__thumbnail" style={{ alignSelf: 'center' }}>
-                <DocumentThumbnail file={stub ?? null} thumbnail={stub?.thumbnailUrl || null} />
-              </Box>
-              <Stack className="compare-tool__details">
-                <FitText 
-                  text={stub?.name || ''} 
-                  minimumFontScale={0.8} 
-                  lines={3}
-                  style={{ fontWeight: 600
-                  }}
+              <Box
+                className="compare-tool__thumbnail"
+                style={{ alignSelf: "center" }}
+              >
+                <DocumentThumbnail
+                  file={stub ?? null}
+                  thumbnail={stub?.thumbnailUrl || null}
                 />
+              </Box>
+              <Stack
+                className="compare-tool__details"
+                style={{ minWidth: 0, overflow: "hidden", flex: 1 }}
+              >
+                <Text fw={600} title={stub?.name}>
+                  {truncateCenter(stub?.name || "", 50)}
+                </Text>
                 {pageCount && dateText && (
                   <>
-                  <Text size="xs" c="dimmed" style={{ whiteSpace: 'nowrap', overflow: 'hidden', textOverflow: 'ellipsis' }}>
-                    {pageCount} {t('compare.pages', 'pages')}
-                    <br />
-                    {dateText}
-                </Text>
+                    <Text
+                      size="xs"
+                      c="dimmed"
+                      style={{
+                        whiteSpace: "nowrap",
+                        overflow: "hidden",
+                        textOverflow: "ellipsis",
+                      }}
+                    >
+                      {pageCount} {t("compare.pages", "pages")}
+                      <br />
+                      {dateText}
+                    </Text>
                   </>
                 )}
               </Stack>
@@ -420,11 +595,15 @@ const Compare = (props: BaseToolProps) => {
         </Stack>
       );
     },
-    [params.baseFileId, params.comparisonFileId, selectors, t, openFilesModal]
+    [params.baseFileId, params.comparisonFileId, selectors, t, openFilesModal],
   );
 
-  const baseStub = params.baseFileId ? selectors.getStirlingFileStub(params.baseFileId) : undefined;
-  const compStub = params.comparisonFileId ? selectors.getStirlingFileStub(params.comparisonFileId) : undefined;
+  const baseStub = params.baseFileId
+    ? selectors.getStirlingFileStub(params.baseFileId)
+    : undefined;
+  const compStub = params.comparisonFileId
+    ? selectors.getStirlingFileStub(params.comparisonFileId)
+    : undefined;
   const canExecute = Boolean(
     params.baseFileId &&
     params.comparisonFileId &&
@@ -432,7 +611,7 @@ const Compare = (props: BaseToolProps) => {
     baseStub &&
     compStub &&
     !base.operation.isLoading &&
-    base.endpointEnabled !== false
+    base.endpointEnabled !== false,
   );
 
   const hasBothSelected = Boolean(params.baseFileId && params.comparisonFileId);
@@ -445,92 +624,149 @@ const Compare = (props: BaseToolProps) => {
     },
     steps: [
       {
-        title: t('compare.selection.originalEditedTitle', 'Select Original and Edited PDFs'),
+        title: t(
+          "compare.selection.originalEditedTitle",
+          "Select Original and Edited PDFs",
+        ),
         isVisible: true,
         content: (
           <Box
             style={{
-              display: 'grid',
-              gridTemplateColumns: hasBothSelected ? '1fr 2.25rem' : '1fr',
-              gap: '1rem',
-              alignItems: 'stretch',
-              width: '100%', 
+              display: "grid",
+              gridTemplateColumns: hasBothSelected ? "1fr 2.25rem" : "1fr",
+              gap: "1rem",
+              alignItems: "stretch",
+              width: "100%",
             }}
           >
+            {/* Mode toggle */}
+            <Box
+              style={{
+                gridColumn: hasBothSelected ? "1 / span 2" : "1",
+                marginTop: "0.25rem",
+              }}
+            >
+              <SegmentedControl
+                fullWidth
+                size="xs"
+                value={params.mode}
+                onChange={(value) =>
+                  base.params.setParameters((prev) => ({
+                    ...prev,
+                    mode: value as "text" | "pixel",
+                  }))
+                }
+                data={[
+                  {
+                    value: "text",
+                    label: t("compare.mode.text", "Text Comparison"),
+                  },
+                  {
+                    value: "pixel",
+                    label: t("compare.mode.pixel", "Pixel Comparison"),
+                  },
+                ]}
+              />
+            </Box>
             {/* Header row: Original PDF + Clear selected aligned to swap column */}
             <Box
-              style={{ gridColumn: hasBothSelected ? '1 / span 2' : '1', display: 'flex', alignItems: 'center', justifyContent: 'space-between', marginTop: '0.5rem' }}
+              style={{
+                gridColumn: hasBothSelected ? "1 / span 2" : "1",
+                display: "flex",
+                alignItems: "center",
+                justifyContent: "space-between",
+                marginTop: "0.5rem",
+              }}
             >
-              <Text fw={700} size="sm">{t('compare.original.label', 'Original PDF')}</Text>
+              <Text fw={700} size="sm">
+                {t("compare.original.label", "Original PDF")}
+              </Text>
               <Button
                 variant="subtle"
                 size="compact-xs"
                 onClick={() => setClearConfirmOpen(true)}
                 disabled={!hasAnyFiles}
-                styles={{ root: { textDecoration: 'underline' } }}
+                styles={{ root: { textDecoration: "underline" } }}
                 style={{
-                  background: !hasAnyFiles ? 'transparent' : undefined,
-                  color: !hasAnyFiles ? 'var(--spdf-clear-disabled-text)' : undefined
+                  background: !hasAnyFiles ? "transparent" : undefined,
+                  color: !hasAnyFiles
+                    ? "var(--spdf-clear-disabled-text)"
+                    : undefined,
                 }}
               >
-                {t('compare.clearSelected', 'Clear selected')}
+                {t("compare.clearSelected", "Clear selected")}
               </Button>
             </Box>
             <Box
               style={{
-                gridColumn: '1',
+                gridColumn: "1",
                 minWidth: 0,
-                
               }}
             >
-              {renderSelectedFile('base')}
-              <div style={{ height: '0.75rem' }} />
+              {renderSelectedFile("base")}
+              <div style={{ height: "0.75rem" }} />
               {/* Edited PDF section header */}
-              <Text fw={700} size="sm" style={{ marginBottom: '1rem', marginTop: '0.5rem'}}>{t('compare.edited.label', 'Edited PDF')}</Text>
-              {renderSelectedFile('comparison')}
+              <Text
+                fw={700}
+                size="sm"
+                style={{ marginBottom: "1rem", marginTop: "0.5rem" }}
+              >
+                {t("compare.edited.label", "Edited PDF")}
+              </Text>
+              {renderSelectedFile("comparison")}
             </Box>
             {hasBothSelected && (
-            <Box
-              style={{
-                gridColumn: '2',
-                gridRow: '2',
-                display: 'flex',
-                alignItems: 'center',
-                justifyContent: 'center',
-                alignSelf: 'stretch',
-              }}
-            >
-              <Button
-                variant="subtle"
-                onClick={handleSwap}
-                disabled={!hasBothSelected || base.operation.isLoading}
+              <Box
                 style={{
-                  width: '2.25rem',
-                  height: '100%',
-                  padding: 0,
-                  borderRadius: '0.5rem',
-                  background: 'var(--bg-surface)',
-                  border: '1px solid var(--border-default)',
-                  display: 'flex',
-                  alignItems: 'center',
-                  justifyContent: 'center',
+                  gridColumn: "2",
+                  gridRow: "2",
+                  display: "flex",
+                  alignItems: "center",
+                  justifyContent: "center",
+                  alignSelf: "stretch",
                 }}
               >
-                <SwapVertRoundedIcon fontSize="medium" />
-              </Button>
-            </Box>
+                <Button
+                  variant="subtle"
+                  onClick={handleSwap}
+                  disabled={!hasBothSelected || base.operation.isLoading}
+                  style={{
+                    width: "2.25rem",
+                    height: "100%",
+                    padding: 0,
+                    borderRadius: "0.5rem",
+                    background: "var(--bg-surface)",
+                    border: "1px solid var(--border-default)",
+                    display: "flex",
+                    alignItems: "center",
+                    justifyContent: "center",
+                  }}
+                >
+                  <SwapVertRoundedIcon fontSize="medium" />
+                </Button>
+              </Box>
             )}
             <Modal
               opened={swapConfirmOpen}
               onClose={() => setSwapConfirmOpen(false)}
-              title={t('compare.swap.confirmTitle', 'Re-run comparison?')}
+              title={t("compare.swap.confirmTitle", "Re-run comparison?")}
               centered
               size="sm"
             >
               <Stack gap="md">
-                <Text>{t('compare.swap.confirmBody', 'This will rerun the tool. Are you sure you want to swap the order of Original and Edited?')}</Text>
+                <Text>
+                  {t(
+                    "compare.swap.confirmBody",
+                    "This will rerun the tool. Are you sure you want to swap the order of Original and Edited?",
+                  )}
+                </Text>
                 <Group justify="flex-end" gap="sm">
-                  <Button variant="light" onClick={() => setSwapConfirmOpen(false)}>{t('cancel', 'Cancel')}</Button>
+                  <Button
+                    variant="light"
+                    onClick={() => setSwapConfirmOpen(false)}
+                  >
+                    {t("cancel", "Cancel")}
+                  </Button>
                   <Button
                     variant="filled"
                     onClick={() => {
@@ -538,7 +774,7 @@ const Compare = (props: BaseToolProps) => {
                       performSwap();
                     }}
                   >
-                    {t('compare.swap.confirm', 'Swap and Re-run')}
+                    {t("compare.swap.confirm", "Swap and Re-run")}
                   </Button>
                 </Group>
               </Stack>
@@ -546,14 +782,24 @@ const Compare = (props: BaseToolProps) => {
             <Modal
               opened={clearConfirmOpen}
               onClose={() => setClearConfirmOpen(false)}
-              title={t('compare.clear.confirmTitle', 'Clear selected PDFs?')}
+              title={t("compare.clear.confirmTitle", "Clear selected PDFs?")}
               centered
               size="sm"
             >
               <Stack gap="md">
-                <Text>{t('compare.clear.confirmBody', 'This will close the current comparison and take you back to Active Files.')}</Text>
+                <Text>
+                  {t(
+                    "compare.clear.confirmBody",
+                    "This will close the current comparison and take you back to Active Files.",
+                  )}
+                </Text>
                 <Group justify="flex-end" gap="sm">
-                  <Button variant="light" onClick={() => setClearConfirmOpen(false)}>{t('cancel', 'Cancel')}</Button>
+                  <Button
+                    variant="light"
+                    onClick={() => setClearConfirmOpen(false)}
+                  >
+                    {t("cancel", "Cancel")}
+                  </Button>
                   <Button
                     variant="filled"
                     onClick={() => {
@@ -561,7 +807,7 @@ const Compare = (props: BaseToolProps) => {
                       performClearSelected();
                     }}
                   >
-                    {t('compare.clear.confirm', 'Clear and return')}
+                    {t("compare.clear.confirm", "Clear and return")}
                   </Button>
                 </Group>
               </Stack>
@@ -571,16 +817,17 @@ const Compare = (props: BaseToolProps) => {
       },
     ],
     executeButton: {
-      text: t('compare.cta', 'Compare'),
-      loadingText: t('compare.loading', 'Comparing...'),
+      text: t("compare.cta", "Compare"),
+      loadingText: t("compare.loading", "Comparing..."),
       onClick: handleExecuteCompare,
       disabled: !canExecute,
-      testId: 'compare-execute',
+      testId: "compare-execute",
+      disableScopeHints: true,
     },
     review: {
       isVisible: false,
       operation: base.operation,
-      title: t('compare.review.title', 'Comparison Result'),
+      title: t("compare.review.title", "Comparison Result"),
       onUndo: base.operation.undoOperation,
     },
   });
@@ -591,6 +838,3 @@ CompareTool.tool = () => useCompareOperation;
 CompareTool.getDefaultParameters = () => ({ ...compareDefaultParameters });
 
 export default CompareTool;
-
-
-
diff --git a/frontend/src/core/tools/Compress.tsx b/frontend/src/core/tools/Compress.tsx
index ae5dd691fb..8525b73c2a 100644
--- a/frontend/src/core/tools/Compress.tsx
+++ b/frontend/src/core/tools/Compress.tsx
@@ -12,10 +12,10 @@ const Compress = (props: BaseToolProps) => {
   const compressTips = useCompressTips();
 
   const base = useBaseTool(
-    'compress',
+    "compress",
     useCompressParameters,
     useCompressOperation,
-    props
+    props,
   );
 
   return createToolFlow({
@@ -27,7 +27,9 @@ const Compress = (props: BaseToolProps) => {
       {
         title: "Settings",
         isCollapsed: base.settingsCollapsed,
-        onCollapsedClick: base.settingsCollapsed ? base.handleSettingsReset : undefined,
+        onCollapsedClick: base.settingsCollapsed
+          ? base.handleSettingsReset
+          : undefined,
         tooltip: compressTips,
         content: (
           <CompressSettings
@@ -56,5 +58,4 @@ const Compress = (props: BaseToolProps) => {
   });
 };
 
-
 export default Compress as ToolComponent;
diff --git a/frontend/src/core/tools/Convert.tsx b/frontend/src/core/tools/Convert.tsx
index 53dd1be196..de29e4ae94 100644
--- a/frontend/src/core/tools/Convert.tsx
+++ b/frontend/src/core/tools/Convert.tsx
@@ -1,7 +1,8 @@
 import { useEffect, useRef } from "react";
 import { useTranslation } from "react-i18next";
 import { useEndpointEnabled } from "@app/hooks/useEndpointConfig";
-import { useFileState, useFileSelection } from "@app/contexts/FileContext";
+import { useFileState } from "@app/contexts/FileContext";
+import { useViewScopedFiles } from "@app/hooks/tools/shared/useViewScopedFiles";
 
 import { createToolFlow } from "@app/components/tools/shared/createToolFlow";
 
@@ -15,17 +16,18 @@ const Convert = ({ onPreviewFile, onComplete, onError }: BaseToolProps) => {
   const { t } = useTranslation();
   const { selectors } = useFileState();
   const activeFiles = selectors.getFiles();
-  const { selectedFiles } = useFileSelection();
+  const selectedFiles = useViewScopedFiles();
   const scrollContainerRef = useRef<HTMLDivElement>(null);
 
   const convertParams = useConvertParameters();
   const convertOperation = useConvertOperation(convertParams.parameters);
 
-  const { enabled: endpointEnabled, loading: endpointLoading } = useEndpointEnabled(convertParams.getEndpointName());
+  const { enabled: endpointEnabled, loading: endpointLoading } =
+    useEndpointEnabled(convertParams.getEndpointName());
 
   // Prevent reset immediately after operation completes (when consumeFiles auto-selects outputs)
   const skipNextSelectionResetRef = useRef(false);
-  const previousSelectionRef = useRef<string>('');
+  const previousSelectionRef = useRef<string>("");
 
   const scrollToBottom = () => {
     if (scrollContainerRef.current) {
@@ -37,7 +39,10 @@ const Convert = ({ onPreviewFile, onComplete, onError }: BaseToolProps) => {
   };
 
   const hasFiles = selectedFiles.length > 0;
-  const hasResults = convertOperation.files.length > 0 || convertOperation.downloadUrl !== null || !!convertOperation.errorMessage;
+  const hasResults =
+    convertOperation.files.length > 0 ||
+    convertOperation.downloadUrl !== null ||
+    !!convertOperation.errorMessage;
   const settingsCollapsed = hasResults;
 
   // When operation completes, flag the next selection change to skip reset
@@ -49,7 +54,10 @@ const Convert = ({ onPreviewFile, onComplete, onError }: BaseToolProps) => {
 
   // Reset results when user manually changes file selection
   useEffect(() => {
-    const currentSelection = selectedFiles.map(f => f.fileId).sort().join(',');
+    const currentSelection = selectedFiles
+      .map((f) => f.fileId)
+      .sort()
+      .join(",");
 
     if (currentSelection === previousSelectionRef.current) return; // No change
 
@@ -70,7 +78,7 @@ const Convert = ({ onPreviewFile, onComplete, onError }: BaseToolProps) => {
         onPreviewFile?.(null);
       }
     } else {
-      previousSelectionRef.current = '';
+      previousSelectionRef.current = "";
       if (activeFiles.length === 0) {
         convertParams.resetParameters();
       }
@@ -83,7 +91,10 @@ const Convert = ({ onPreviewFile, onComplete, onError }: BaseToolProps) => {
       convertOperation.resetResults();
       onPreviewFile?.(null);
     }
-  }, [convertParams.parameters.fromExtension, convertParams.parameters.toExtension]);
+  }, [
+    convertParams.parameters.fromExtension,
+    convertParams.parameters.toExtension,
+  ]);
 
   useEffect(() => {
     if (hasFiles) {
@@ -99,13 +110,18 @@ const Convert = ({ onPreviewFile, onComplete, onError }: BaseToolProps) => {
 
   const handleConvert = async () => {
     try {
-      await convertOperation.executeOperation(convertParams.parameters, selectedFiles);
+      await convertOperation.executeOperation(
+        convertParams.parameters,
+        selectedFiles,
+      );
       if (convertOperation.files && onComplete) {
         onComplete(convertOperation.files);
       }
     } catch (error) {
       if (onError) {
-        onError(error instanceof Error ? error.message : "Convert operation failed");
+        onError(
+          error instanceof Error ? error.message : "Convert operation failed",
+        );
       }
     }
   };
diff --git a/frontend/src/core/tools/Crop.tsx b/frontend/src/core/tools/Crop.tsx
index 93ebb1c5c1..7d3d78f364 100644
--- a/frontend/src/core/tools/Crop.tsx
+++ b/frontend/src/core/tools/Crop.tsx
@@ -10,12 +10,7 @@ import { BaseToolProps, ToolComponent } from "@app/types/tool";
 const Crop = (props: BaseToolProps) => {
   const { t } = useTranslation();
 
-  const base = useBaseTool(
-    'crop',
-    useCropParameters,
-    useCropOperation,
-    props
-  );
+  const base = useBaseTool("crop", useCropParameters, useCropOperation, props);
 
   const tooltips = useCropTooltips();
 
@@ -29,7 +24,9 @@ const Crop = (props: BaseToolProps) => {
       {
         title: t("crop.steps.selectArea", "Select Crop Area"),
         isCollapsed: base.settingsCollapsed,
-        onCollapsedClick: base.hasResults ? base.handleSettingsReset : undefined,
+        onCollapsedClick: base.hasResults
+          ? base.handleSettingsReset
+          : undefined,
         tooltip: tooltips,
         content: (
           <CropSettings
diff --git a/frontend/src/core/tools/EditTableOfContents.tsx b/frontend/src/core/tools/EditTableOfContents.tsx
index 57334c8915..5980c391da 100644
--- a/frontend/src/core/tools/EditTableOfContents.tsx
+++ b/frontend/src/core/tools/EditTableOfContents.tsx
@@ -1,51 +1,70 @@
-import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
-import { useTranslation } from 'react-i18next';
-import { downloadFile } from '@app/services/downloadService';
-import MenuBookRoundedIcon from '@mui/icons-material/MenuBookRounded';
-import { alert } from '@app/components/toast';
-import { createToolFlow } from '@app/components/tools/shared/createToolFlow';
-import EditTableOfContentsWorkbenchView, { EditTableOfContentsWorkbenchViewData } from '@app/components/tools/editTableOfContents/EditTableOfContentsWorkbenchView';
-import EditTableOfContentsSettings from '@app/components/tools/editTableOfContents/EditTableOfContentsSettings';
-import { useEditTableOfContentsParameters } from '@app/hooks/tools/editTableOfContents/useEditTableOfContentsParameters';
-import { useEditTableOfContentsOperation } from '@app/hooks/tools/editTableOfContents/useEditTableOfContentsOperation';
-import { BaseToolProps, ToolComponent } from '@app/types/tool';
-import { useBaseTool } from '@app/hooks/tools/shared/useBaseTool';
-import apiClient from '@app/services/apiClient';
-import { BookmarkPayload, BookmarkNode, hydrateBookmarkPayload, serializeBookmarkNodes } from '@app/utils/editTableOfContents';
-import { useToolWorkflow } from '@app/contexts/ToolWorkflowContext';
-import { useFilesModalContext } from '@app/contexts/FilesModalContext';
-import { useNavigationActions, useNavigationState } from '@app/contexts/NavigationContext';
-import { useFileSelection } from '@app/contexts/FileContext';
+import { useCallback, useEffect, useMemo, useRef, useState } from "react";
+import { useTranslation } from "react-i18next";
+import { downloadFile } from "@app/services/downloadService";
+import MenuBookRoundedIcon from "@mui/icons-material/MenuBookRounded";
+import { alert } from "@app/components/toast";
+import { createToolFlow } from "@app/components/tools/shared/createToolFlow";
+import EditTableOfContentsWorkbenchView, {
+  EditTableOfContentsWorkbenchViewData,
+} from "@app/components/tools/editTableOfContents/EditTableOfContentsWorkbenchView";
+import EditTableOfContentsSettings from "@app/components/tools/editTableOfContents/EditTableOfContentsSettings";
+import { useEditTableOfContentsParameters } from "@app/hooks/tools/editTableOfContents/useEditTableOfContentsParameters";
+import { useEditTableOfContentsOperation } from "@app/hooks/tools/editTableOfContents/useEditTableOfContentsOperation";
+import { BaseToolProps, ToolComponent } from "@app/types/tool";
+import { useBaseTool } from "@app/hooks/tools/shared/useBaseTool";
+import apiClient from "@app/services/apiClient";
+import {
+  BookmarkPayload,
+  BookmarkNode,
+  hydrateBookmarkPayload,
+  serializeBookmarkNodes,
+} from "@app/utils/editTableOfContents";
+import { useToolWorkflow } from "@app/contexts/ToolWorkflowContext";
+import { useFilesModalContext } from "@app/contexts/FilesModalContext";
+import {
+  useNavigationActions,
+  useNavigationState,
+} from "@app/contexts/NavigationContext";
+import { useFileSelection } from "@app/contexts/FileContext";
 
 const extractBookmarks = async (file: File): Promise<BookmarkPayload[]> => {
   const formData = new FormData();
-  formData.append('file', file);
+  formData.append("file", file);
 
-  const response = await apiClient.post('/api/v1/general/extract-bookmarks', formData, {
-    headers: { 'Content-Type': 'multipart/form-data' },
-  });
+  const response = await apiClient.post(
+    "/api/v1/general/extract-bookmarks",
+    formData,
+    {
+      headers: { "Content-Type": "multipart/form-data" },
+    },
+  );
 
   return response.data as BookmarkPayload[];
 };
 
-const useStableCallback = <T extends (...args: any[]) => any>(callback: T): T => {
+const useStableCallback = <T extends (...args: any[]) => any>(
+  callback: T,
+): T => {
   const callbackRef = useRef(callback);
 
   useEffect(() => {
     callbackRef.current = callback;
   }, [callback]);
 
-  return useMemo(() => ((...args: Parameters<T>) => callbackRef.current(...args)) as T, []);
+  return useMemo(
+    () => ((...args: Parameters<T>) => callbackRef.current(...args)) as T,
+    [],
+  );
 };
 
 const EditTableOfContents = (props: BaseToolProps) => {
   const { t } = useTranslation();
   const base = useBaseTool(
-    'edit-table-of-contents',
+    "edit-table-of-contents",
     useEditTableOfContentsParameters,
     useEditTableOfContentsOperation,
     props,
-    { minFiles: 1 }
+    { minFiles: 1 },
   );
   const {
     registerCustomWorkbenchView,
@@ -58,8 +77,8 @@ const EditTableOfContents = (props: BaseToolProps) => {
   const navigationState = useNavigationState();
   const { actions: navigationActions } = useNavigationActions();
 
-  const WORKBENCH_VIEW_ID = 'editTableOfContentsWorkbench';
-  const WORKBENCH_ID = 'custom:editTableOfContents' as const;
+  const WORKBENCH_VIEW_ID = "editTableOfContentsWorkbench";
+  const WORKBENCH_ID = "custom:editTableOfContents" as const;
   const viewIcon = useMemo(() => <MenuBookRoundedIcon fontSize="small" />, []);
 
   const [loadError, setLoadError] = useState<string | null>(null);
@@ -75,7 +94,7 @@ const EditTableOfContents = (props: BaseToolProps) => {
     registerCustomWorkbenchView({
       id: WORKBENCH_VIEW_ID,
       workbenchId: WORKBENCH_ID,
-      label: 'Outline workspace',
+      label: "Outline workspace",
       icon: viewIcon,
       component: EditTableOfContentsWorkbenchView,
     });
@@ -84,37 +103,56 @@ const EditTableOfContents = (props: BaseToolProps) => {
       clearCustomWorkbenchViewData(WORKBENCH_VIEW_ID);
       unregisterCustomWorkbenchView(WORKBENCH_VIEW_ID);
     };
-  // Register once; avoid re-registering which clears data mid-flight
+    // Register once; avoid re-registering which clears data mid-flight
   }, []);
 
-  const loadBookmarksForFile = useCallback(async (file: File, { showToast }: { showToast?: boolean } = {}) => {
-    setIsLoadingBookmarks(true);
-    setLoadError(null);
+  const loadBookmarksForFile = useCallback(
+    async (file: File, { showToast }: { showToast?: boolean } = {}) => {
+      setIsLoadingBookmarks(true);
+      setLoadError(null);
 
-    try {
-      const payload = await extractBookmarks(file);
-      const bookmarks = hydrateBookmarkPayload(payload);
-      setBookmarks(bookmarks);
-      setLastLoadedFileId((file as any)?.fileId ?? file.name);
+      try {
+        const payload = await extractBookmarks(file);
+        const bookmarks = hydrateBookmarkPayload(payload);
+        setBookmarks(bookmarks);
+        setLastLoadedFileId((file as any)?.fileId ?? file.name);
 
-      if (showToast) {
-        alert({
-          title: t('editTableOfContents.messages.loadedTitle', 'Bookmarks extracted'),
-          body: t('editTableOfContents.messages.loadedBody', 'Existing bookmarks from the PDF were loaded into the editor.'),
-          alertType: 'success',
-        });
+        if (showToast) {
+          alert({
+            title: t(
+              "editTableOfContents.messages.loadedTitle",
+              "Bookmarks extracted",
+            ),
+            body: t(
+              "editTableOfContents.messages.loadedBody",
+              "Existing bookmarks from the PDF were loaded into the editor.",
+            ),
+            alertType: "success",
+          });
+        }
+
+        if (bookmarks.length === 0) {
+          setLoadError(
+            t(
+              "editTableOfContents.messages.noBookmarks",
+              "No bookmarks were found in the selected PDF.",
+            ),
+          );
+        }
+      } catch (error) {
+        console.error("Failed to load bookmarks", error);
+        setLoadError(
+          t(
+            "editTableOfContents.messages.loadFailed",
+            "Unable to extract bookmarks from the selected PDF.",
+          ),
+        );
+      } finally {
+        setIsLoadingBookmarks(false);
       }
-
-      if (bookmarks.length === 0) {
-        setLoadError(t('editTableOfContents.messages.noBookmarks', 'No bookmarks were found in the selected PDF.'));
-      }
-    } catch (error) {
-      console.error('Failed to load bookmarks', error);
-      setLoadError(t('editTableOfContents.messages.loadFailed', 'Unable to extract bookmarks from the selected PDF.'));
-    } finally {
-      setIsLoadingBookmarks(false);
-    }
-  }, [setBookmarks, t]);
+    },
+    [setBookmarks, t],
+  );
 
   useEffect(() => {
     // Don't auto-load bookmarks if we have results - user is viewing the output
@@ -137,7 +175,13 @@ const EditTableOfContents = (props: BaseToolProps) => {
     loadBookmarksForFile(selectedFile).catch(() => {
       // errors handled in hook
     });
-  }, [selectedFile, lastLoadedFileId, loadBookmarksForFile, setBookmarks, base.hasResults]);
+  }, [
+    selectedFile,
+    lastLoadedFileId,
+    loadBookmarksForFile,
+    setBookmarks,
+    base.hasResults,
+  ]);
 
   const importJsonCallback = async (file: File) => {
     try {
@@ -145,16 +189,25 @@ const EditTableOfContents = (props: BaseToolProps) => {
       const json = JSON.parse(text) as BookmarkPayload[];
       setBookmarks(hydrateBookmarkPayload(json));
       alert({
-        title: t('editTableOfContents.messages.imported', 'Bookmarks imported'),
-        body: t('editTableOfContents.messages.importedBody', 'Your JSON outline replaced the current editor contents.'),
-        alertType: 'success',
+        title: t("editTableOfContents.messages.imported", "Bookmarks imported"),
+        body: t(
+          "editTableOfContents.messages.importedBody",
+          "Your JSON outline replaced the current editor contents.",
+        ),
+        alertType: "success",
       });
     } catch (error) {
-      console.error('Failed to import JSON bookmarks', error);
+      console.error("Failed to import JSON bookmarks", error);
       alert({
-        title: t('editTableOfContents.messages.invalidJson', 'Invalid JSON structure'),
-        body: t('editTableOfContents.messages.invalidJsonBody', 'Please provide a valid bookmark JSON file and try again.'),
-        alertType: 'error',
+        title: t(
+          "editTableOfContents.messages.invalidJson",
+          "Invalid JSON structure",
+        ),
+        body: t(
+          "editTableOfContents.messages.invalidJsonBody",
+          "Please provide a valid bookmark JSON file and try again.",
+        ),
+        alertType: "error",
       });
     }
   };
@@ -163,8 +216,11 @@ const EditTableOfContents = (props: BaseToolProps) => {
   const importClipboardCallback = async () => {
     if (!navigator.clipboard?.readText) {
       alert({
-        title: t('editTableOfContents.actions.clipboardUnavailable', 'Clipboard access unavailable'),
-        alertType: 'warning',
+        title: t(
+          "editTableOfContents.actions.clipboardUnavailable",
+          "Clipboard access unavailable",
+        ),
+        alertType: "warning",
       });
       return;
     }
@@ -174,28 +230,41 @@ const EditTableOfContents = (props: BaseToolProps) => {
       const json = JSON.parse(clipboard) as BookmarkPayload[];
       setBookmarks(hydrateBookmarkPayload(json));
       alert({
-        title: t('editTableOfContents.messages.imported', 'Bookmarks imported'),
-        body: t('editTableOfContents.messages.importedClipboard', 'Clipboard data replaced the current bookmark list.'),
-        alertType: 'success',
+        title: t("editTableOfContents.messages.imported", "Bookmarks imported"),
+        body: t(
+          "editTableOfContents.messages.importedClipboard",
+          "Clipboard data replaced the current bookmark list.",
+        ),
+        alertType: "success",
       });
     } catch (error) {
-      console.error('Failed to import bookmarks from clipboard', error);
+      console.error("Failed to import bookmarks from clipboard", error);
       alert({
-        title: t('editTableOfContents.messages.invalidJson', 'Invalid JSON structure'),
-        body: t('editTableOfContents.messages.invalidJsonBody', 'Please provide a valid bookmark JSON file and try again.'),
-        alertType: 'error',
+        title: t(
+          "editTableOfContents.messages.invalidJson",
+          "Invalid JSON structure",
+        ),
+        body: t(
+          "editTableOfContents.messages.invalidJsonBody",
+          "Please provide a valid bookmark JSON file and try again.",
+        ),
+        alertType: "error",
       });
     }
   };
   const handleImportClipboard = useStableCallback(importClipboardCallback);
 
   const exportJsonCallback = () => {
-    const data = JSON.stringify(serializeBookmarkNodes(base.params.parameters.bookmarks), null, 2);
-    const blob = new Blob([data], { type: 'application/json' });
-    void downloadFile({ data: blob, filename: 'bookmarks.json' });
+    const data = JSON.stringify(
+      serializeBookmarkNodes(base.params.parameters.bookmarks),
+      null,
+      2,
+    );
+    const blob = new Blob([data], { type: "application/json" });
+    void downloadFile({ data: blob, filename: "bookmarks.json" });
     alert({
-      title: t('editTableOfContents.messages.exported', 'JSON download ready'),
-      alertType: 'success',
+      title: t("editTableOfContents.messages.exported", "JSON download ready"),
+      alertType: "success",
     });
   };
   const handleExportJson = useStableCallback(exportJsonCallback);
@@ -203,32 +272,44 @@ const EditTableOfContents = (props: BaseToolProps) => {
   const exportClipboardCallback = async () => {
     if (!navigator.clipboard?.writeText) {
       alert({
-        title: t('editTableOfContents.actions.clipboardUnavailable', 'Clipboard access unavailable'),
-        alertType: 'warning',
+        title: t(
+          "editTableOfContents.actions.clipboardUnavailable",
+          "Clipboard access unavailable",
+        ),
+        alertType: "warning",
       });
       return;
     }
 
-    const data = JSON.stringify(serializeBookmarkNodes(base.params.parameters.bookmarks), null, 2);
+    const data = JSON.stringify(
+      serializeBookmarkNodes(base.params.parameters.bookmarks),
+      null,
+      2,
+    );
     try {
       await navigator.clipboard.writeText(data);
       alert({
-        title: t('editTableOfContents.messages.copied', 'Copied to clipboard'),
-        body: t('editTableOfContents.messages.copiedBody', 'Bookmark JSON copied successfully.'),
-        alertType: 'success',
+        title: t("editTableOfContents.messages.copied", "Copied to clipboard"),
+        body: t(
+          "editTableOfContents.messages.copiedBody",
+          "Bookmark JSON copied successfully.",
+        ),
+        alertType: "success",
       });
     } catch (error) {
-      console.error('Failed to copy bookmarks', error);
+      console.error("Failed to copy bookmarks", error);
       alert({
-        title: t('editTableOfContents.messages.copyFailed', 'Copy failed'),
-        alertType: 'error',
+        title: t("editTableOfContents.messages.copyFailed", "Copy failed"),
+        alertType: "error",
       });
     }
   };
   const handleExportClipboard = useStableCallback(exportClipboardCallback);
 
-  const clipboardReadAvailable = typeof navigator !== 'undefined' && Boolean(navigator.clipboard?.readText);
-  const clipboardWriteAvailable = typeof navigator !== 'undefined' && Boolean(navigator.clipboard?.writeText);
+  const clipboardReadAvailable =
+    typeof navigator !== "undefined" && Boolean(navigator.clipboard?.readText);
+  const clipboardWriteAvailable =
+    typeof navigator !== "undefined" && Boolean(navigator.clipboard?.writeText);
 
   const loadFromSelectedCallback = () => {
     if (selectedFile) {
@@ -238,9 +319,11 @@ const EditTableOfContents = (props: BaseToolProps) => {
   const handleLoadFromSelected = useStableCallback(loadFromSelectedCallback);
 
   const replaceExistingCallback = (value: boolean) => {
-    base.params.updateParameter('replaceExisting', value);
+    base.params.updateParameter("replaceExisting", value);
   };
-  const handleReplaceExistingChange = useStableCallback(replaceExistingCallback);
+  const handleReplaceExistingChange = useStableCallback(
+    replaceExistingCallback,
+  );
 
   const bookmarksChangeCallback = (bookmarks: BookmarkNode[]) => {
     setBookmarks(bookmarks);
@@ -325,7 +408,7 @@ const EditTableOfContents = (props: BaseToolProps) => {
 
   // Auto-navigate to workbench when tool is selected
   useEffect(() => {
-    if (navigationState.selectedTool !== 'editTableOfContents') {
+    if (navigationState.selectedTool !== "editTableOfContents") {
       hasAutoOpenedWorkbenchRef.current = false;
       return;
     }
@@ -350,7 +433,7 @@ const EditTableOfContents = (props: BaseToolProps) => {
     },
     steps: [
       {
-        title: t('editTableOfContents.settings.title', 'Bookmarks & outline'),
+        title: t("editTableOfContents.settings.title", "Bookmarks & outline"),
         isCollapsed: false,
         content: (
           <EditTableOfContentsSettings
@@ -376,7 +459,10 @@ const EditTableOfContents = (props: BaseToolProps) => {
     review: {
       isVisible: base.hasResults,
       operation: base.operation,
-      title: t('editTableOfContents.results.title', 'Updated PDF with bookmarks'),
+      title: t(
+        "editTableOfContents.results.title",
+        "Updated PDF with bookmarks",
+      ),
       onFileClick: base.handleThumbnailClick,
       onUndo: handleUndo,
     },
diff --git a/frontend/src/core/tools/ExtractImages.tsx b/frontend/src/core/tools/ExtractImages.tsx
index 5b6818db0a..77fb38645e 100644
--- a/frontend/src/core/tools/ExtractImages.tsx
+++ b/frontend/src/core/tools/ExtractImages.tsx
@@ -10,10 +10,10 @@ const ExtractImages = (props: BaseToolProps) => {
   const { t } = useTranslation();
 
   const base = useBaseTool(
-    'extractImages',
+    "extractImages",
     useExtractImagesParameters,
     useExtractImagesOperation,
-    props
+    props,
   );
 
   return createToolFlow({
@@ -25,7 +25,9 @@ const ExtractImages = (props: BaseToolProps) => {
       {
         title: t("extractImages.settings.title", "Settings"),
         isCollapsed: base.settingsCollapsed,
-        onCollapsedClick: base.settingsCollapsed ? base.handleSettingsReset : undefined,
+        onCollapsedClick: base.settingsCollapsed
+          ? base.handleSettingsReset
+          : undefined,
         content: (
           <ExtractImagesSettings
             parameters={base.params.parameters}
@@ -53,4 +55,4 @@ const ExtractImages = (props: BaseToolProps) => {
   });
 };
 
-export default ExtractImages as ToolComponent;
\ No newline at end of file
+export default ExtractImages as ToolComponent;
diff --git a/frontend/src/core/tools/ExtractPages.tsx b/frontend/src/core/tools/ExtractPages.tsx
index ef0604bc4b..cbc35918eb 100644
--- a/frontend/src/core/tools/ExtractPages.tsx
+++ b/frontend/src/core/tools/ExtractPages.tsx
@@ -12,10 +12,10 @@ const ExtractPages = (props: BaseToolProps) => {
   const tooltipContent = useExtractPagesTips();
 
   const base = useBaseTool(
-    'extract-pages',
+    "extract-pages",
     useExtractPagesParameters,
     useExtractPagesOperation,
-    props
+    props,
   );
 
   const settingsContent = (
@@ -35,7 +35,9 @@ const ExtractPages = (props: BaseToolProps) => {
       {
         title: t("extractPages.settings.title", "Settings"),
         isCollapsed: base.settingsCollapsed,
-        onCollapsedClick: base.settingsCollapsed ? base.handleSettingsReset : undefined,
+        onCollapsedClick: base.settingsCollapsed
+          ? base.handleSettingsReset
+          : undefined,
         content: settingsContent,
         tooltip: tooltipContent,
       },
@@ -59,5 +61,3 @@ const ExtractPages = (props: BaseToolProps) => {
 };
 
 export default ExtractPages as ToolComponent;
-
-
diff --git a/frontend/src/core/tools/Flatten.tsx b/frontend/src/core/tools/Flatten.tsx
index c6bfa35acc..b831504e74 100644
--- a/frontend/src/core/tools/Flatten.tsx
+++ b/frontend/src/core/tools/Flatten.tsx
@@ -12,10 +12,10 @@ const Flatten = (props: BaseToolProps) => {
   const flattenTips = useFlattenTips();
 
   const base = useBaseTool(
-    'flatten',
+    "flatten",
     useFlattenParameters,
     useFlattenOperation,
-    props
+    props,
   );
 
   return createToolFlow({
@@ -27,7 +27,9 @@ const Flatten = (props: BaseToolProps) => {
       {
         title: t("flatten.options.stepTitle", "Flatten Options"),
         isCollapsed: base.settingsCollapsed,
-        onCollapsedClick: base.settingsCollapsed ? base.handleSettingsReset : undefined,
+        onCollapsedClick: base.settingsCollapsed
+          ? base.handleSettingsReset
+          : undefined,
         tooltip: flattenTips,
         content: (
           <FlattenSettings
diff --git a/frontend/src/core/tools/GetPdfInfo.tsx b/frontend/src/core/tools/GetPdfInfo.tsx
index c34da7c23d..9a9d4b4b63 100644
--- a/frontend/src/core/tools/GetPdfInfo.tsx
+++ b/frontend/src/core/tools/GetPdfInfo.tsx
@@ -1,31 +1,80 @@
-import { useEffect, useMemo, useRef } from 'react';
-import { useTranslation } from 'react-i18next';
-import PictureAsPdfIcon from '@mui/icons-material/PictureAsPdf';
-import LinkIcon from '@mui/icons-material/Link';
-import { Stack, Group, Divider, Text, UnstyledButton } from '@mantine/core';
-import { createToolFlow } from '@app/components/tools/shared/createToolFlow';
-import { useBaseTool } from '@app/hooks/tools/shared/useBaseTool';
-import { BaseToolProps, ToolComponent } from '@app/types/tool';
-import { useGetPdfInfoParameters, defaultParameters } from '@app/hooks/tools/getPdfInfo/useGetPdfInfoParameters';
-import GetPdfInfoResults from '@app/components/tools/getPdfInfo/GetPdfInfoResults';
-import { useGetPdfInfoOperation, GetPdfInfoOperationHook } from '@app/hooks/tools/getPdfInfo/useGetPdfInfoOperation';
-import GetPdfInfoReportView from '@app/components/tools/getPdfInfo/GetPdfInfoReportView';
-import { useToolWorkflow } from '@app/contexts/ToolWorkflowContext';
-import { useNavigationActions, useNavigationState } from '@app/contexts/NavigationContext';
-import type { PdfInfoReportData } from '@app/types/getPdfInfo';
+import { useEffect, useMemo, useRef } from "react";
+import { useTranslation } from "react-i18next";
+import PictureAsPdfIcon from "@mui/icons-material/PictureAsPdf";
+import LinkIcon from "@mui/icons-material/Link";
+import { Stack, Group, Divider, Text, UnstyledButton } from "@mantine/core";
+import { createToolFlow } from "@app/components/tools/shared/createToolFlow";
+import { useBaseTool } from "@app/hooks/tools/shared/useBaseTool";
+import { BaseToolProps, ToolComponent } from "@app/types/tool";
+import {
+  useGetPdfInfoParameters,
+  defaultParameters,
+} from "@app/hooks/tools/getPdfInfo/useGetPdfInfoParameters";
+import GetPdfInfoResults from "@app/components/tools/getPdfInfo/GetPdfInfoResults";
+import {
+  useGetPdfInfoOperation,
+  GetPdfInfoOperationHook,
+} from "@app/hooks/tools/getPdfInfo/useGetPdfInfoOperation";
+import GetPdfInfoReportView from "@app/components/tools/getPdfInfo/GetPdfInfoReportView";
+import { useToolWorkflow } from "@app/contexts/ToolWorkflowContext";
+import {
+  useNavigationActions,
+  useNavigationState,
+} from "@app/contexts/NavigationContext";
+import type { PdfInfoReportData } from "@app/types/getPdfInfo";
 
 const CHAPTERS = [
-  { id: 'summary', labelKey: 'getPdfInfo.summary.title', fallback: 'PDF Summary' },
-  { id: 'metadata', labelKey: 'getPdfInfo.sections.metadata', fallback: 'Metadata' },
-  { id: 'formFields', labelKey: 'getPdfInfo.sections.formFields', fallback: 'Form Fields' },
-  { id: 'basicInfo', labelKey: 'getPdfInfo.sections.basicInfo', fallback: 'Basic Info' },
-  { id: 'documentInfo', labelKey: 'getPdfInfo.sections.documentInfo', fallback: 'Document Info' },
-  { id: 'compliance', labelKey: 'getPdfInfo.sections.compliance', fallback: 'Compliance' },
-  { id: 'encryption', labelKey: 'getPdfInfo.sections.encryption', fallback: 'Encryption' },
-  { id: 'permissions', labelKey: 'getPdfInfo.sections.permissions', fallback: 'Permissions' },
-  { id: 'toc', labelKey: 'getPdfInfo.sections.tableOfContents', fallback: 'Table of Contents' },
-  { id: 'other', labelKey: 'getPdfInfo.sections.other', fallback: 'Other' },
-  { id: 'perPage', labelKey: 'getPdfInfo.sections.perPageInfo', fallback: 'Per Page Info' },
+  {
+    id: "summary",
+    labelKey: "getPdfInfo.summary.title",
+    fallback: "PDF Summary",
+  },
+  {
+    id: "metadata",
+    labelKey: "getPdfInfo.sections.metadata",
+    fallback: "Metadata",
+  },
+  {
+    id: "formFields",
+    labelKey: "getPdfInfo.sections.formFields",
+    fallback: "Form Fields",
+  },
+  {
+    id: "basicInfo",
+    labelKey: "getPdfInfo.sections.basicInfo",
+    fallback: "Basic Info",
+  },
+  {
+    id: "documentInfo",
+    labelKey: "getPdfInfo.sections.documentInfo",
+    fallback: "Document Info",
+  },
+  {
+    id: "compliance",
+    labelKey: "getPdfInfo.sections.compliance",
+    fallback: "Compliance",
+  },
+  {
+    id: "encryption",
+    labelKey: "getPdfInfo.sections.encryption",
+    fallback: "Encryption",
+  },
+  {
+    id: "permissions",
+    labelKey: "getPdfInfo.sections.permissions",
+    fallback: "Permissions",
+  },
+  {
+    id: "toc",
+    labelKey: "getPdfInfo.sections.tableOfContents",
+    fallback: "Table of Contents",
+  },
+  { id: "other", labelKey: "getPdfInfo.sections.other", fallback: "Other" },
+  {
+    id: "perPage",
+    labelKey: "getPdfInfo.sections.perPageInfo",
+    fallback: "Per Page Info",
+  },
 ];
 
 const GetPdfInfo = (props: BaseToolProps) => {
@@ -39,26 +88,27 @@ const GetPdfInfo = (props: BaseToolProps) => {
     clearCustomWorkbenchViewData,
   } = useToolWorkflow();
 
-  const REPORT_VIEW_ID = 'getPdfInfoReport';
-  const REPORT_WORKBENCH_ID = 'custom:getPdfInfoReport' as const;
+  const REPORT_VIEW_ID = "getPdfInfoReport";
+  const REPORT_WORKBENCH_ID = "custom:getPdfInfoReport" as const;
   const reportIcon = useMemo(() => <PictureAsPdfIcon fontSize="small" />, []);
 
   const base = useBaseTool(
-    'getPdfInfo',
+    "getPdfInfo",
     useGetPdfInfoParameters,
     useGetPdfInfoOperation,
-    props
+    props,
   );
 
   const operation = base.operation as GetPdfInfoOperationHook;
   const hasResults = operation.results.length > 0;
-  const showResultsStep = hasResults || base.operation.isLoading || !!base.operation.errorMessage;
+  const showResultsStep =
+    hasResults || base.operation.isLoading || !!base.operation.errorMessage;
 
   useEffect(() => {
     registerCustomWorkbenchView({
       id: REPORT_VIEW_ID,
       workbenchId: REPORT_WORKBENCH_ID,
-      label: t('getPdfInfo.report.shortTitle', 'PDF Information'),
+      label: t("getPdfInfo.report.shortTitle", "PDF Information"),
       icon: reportIcon,
       component: GetPdfInfoReportView,
     });
@@ -89,10 +139,14 @@ const GetPdfInfo = (props: BaseToolProps) => {
     if (reportData) {
       setCustomWorkbenchViewData(REPORT_VIEW_ID, reportData);
       const generatedAt = reportData.generatedAt ?? null;
-      const isNewReport = generatedAt && generatedAt !== lastReportGeneratedAtRef.current;
+      const isNewReport =
+        generatedAt && generatedAt !== lastReportGeneratedAtRef.current;
       if (isNewReport) {
         lastReportGeneratedAtRef.current = generatedAt;
-        if (navigationState.selectedTool === 'getPdfInfo' && navigationState.workbench !== REPORT_WORKBENCH_ID) {
+        if (
+          navigationState.selectedTool === "getPdfInfo" &&
+          navigationState.workbench !== REPORT_WORKBENCH_ID
+        ) {
           navigationActions.setWorkbench(REPORT_WORKBENCH_ID);
         }
       }
@@ -116,7 +170,7 @@ const GetPdfInfo = (props: BaseToolProps) => {
     },
     steps: [
       {
-        title: t('getPdfInfo.indexTitle', 'Index'),
+        title: t("getPdfInfo.indexTitle", "Index"),
         isVisible: Boolean(reportData),
         isCollapsed: false,
         content: (
@@ -126,12 +180,19 @@ const GetPdfInfo = (props: BaseToolProps) => {
                 <UnstyledButton
                   onClick={() => {
                     if (!reportData) return;
-                    setCustomWorkbenchViewData(REPORT_VIEW_ID, { ...reportData, scrollTo: c.id });
+                    setCustomWorkbenchViewData(REPORT_VIEW_ID, {
+                      ...reportData,
+                      scrollTo: c.id,
+                    });
                     if (navigationState.workbench !== REPORT_WORKBENCH_ID) {
                       navigationActions.setWorkbench(REPORT_WORKBENCH_ID);
                     }
                   }}
-                  style={{ width: '100%', textAlign: 'left', padding: '8px 4px' }}
+                  style={{
+                    width: "100%",
+                    textAlign: "left",
+                    padding: "8px 4px",
+                  }}
                 >
                   <Group justify="flex-start" gap="sm">
                     <LinkIcon fontSize="small" style={{ opacity: 0.7 }} />
@@ -147,7 +208,7 @@ const GetPdfInfo = (props: BaseToolProps) => {
         ),
       },
       {
-        title: t('getPdfInfo.results', 'Results'),
+        title: t("getPdfInfo.results", "Results"),
         isVisible: showResultsStep,
         isCollapsed: false,
         content: (
@@ -160,8 +221,8 @@ const GetPdfInfo = (props: BaseToolProps) => {
       },
     ],
     executeButton: {
-      text: t('getPdfInfo.submit', 'Generate'),
-      loadingText: t('loading', 'Loading...'),
+      text: t("getPdfInfo.submit", "Generate"),
+      loadingText: t("loading", "Loading..."),
       onClick: base.handleExecute,
       endpointEnabled: base.endpointEnabled,
       paramsValid: base.params.validateParameters(),
@@ -170,7 +231,7 @@ const GetPdfInfo = (props: BaseToolProps) => {
     review: {
       isVisible: false,
       operation: base.operation,
-      title: t('getPdfInfo.results', 'Results'),
+      title: t("getPdfInfo.results", "Results"),
       onUndo: base.handleUndo,
     },
   });
@@ -181,5 +242,3 @@ GetPdfInfoTool.tool = () => useGetPdfInfoOperation;
 GetPdfInfoTool.getDefaultParameters = () => ({ ...defaultParameters });
 
 export default GetPdfInfoTool;
-
-
diff --git a/frontend/src/core/tools/Merge.tsx b/frontend/src/core/tools/Merge.tsx
index 44dd5c89c1..de1c423a04 100644
--- a/frontend/src/core/tools/Merge.tsx
+++ b/frontend/src/core/tools/Merge.tsx
@@ -1,5 +1,6 @@
-import { useCallback } from "react";
+import { useCallback, useEffect, useRef } from "react";
 import { useTranslation } from "react-i18next";
+import { Button, Stack, Text } from "@mantine/core";
 import { createToolFlow } from "@app/components/tools/shared/createToolFlow";
 import MergeSettings from "@app/components/tools/merge/MergeSettings";
 import MergeFileSorter from "@app/components/tools/merge/MergeFileSorter";
@@ -8,7 +9,15 @@ import { useMergeOperation } from "@app/hooks/tools/merge/useMergeOperation";
 import { useBaseTool } from "@app/hooks/tools/shared/useBaseTool";
 import { BaseToolProps, ToolComponent } from "@app/types/tool";
 import { useMergeTips } from "@app/components/tooltips/useMergeTips";
-import { useFileManagement, useSelectedFiles, useAllFiles } from "@app/contexts/FileContext";
+import {
+  useFileManagement,
+  useSelectedFiles,
+  useAllFiles,
+} from "@app/contexts/FileContext";
+import {
+  useNavigationState,
+  useNavigationActions,
+} from "@app/contexts/NavigationContext";
 
 const Merge = (props: BaseToolProps) => {
   const { t } = useTranslation();
@@ -20,17 +29,33 @@ const Merge = (props: BaseToolProps) => {
   const { reorderFiles } = useFileManagement();
 
   const base = useBaseTool(
-    'merge',
+    "merge",
     useMergeParameters,
     useMergeOperation,
     props,
-    { minFiles: 2 }
+    { minFiles: 2, ignoreViewerScope: true },
   );
-  const naturalCompare = useCallback((a: string, b: string): number => {
-    const isDigit = (char: string) => char >= '0' && char <= '9';
 
-    const getChunk = (s: string, length: number, marker: number): { chunk: string; newMarker: number } => {
-      let chunk = '';
+  const { workbench } = useNavigationState();
+  const { actions: navActions } = useNavigationActions();
+  const isViewerMode = workbench === "viewer";
+
+  const hasAutoSwitchedRef = useRef(false);
+  useEffect(() => {
+    if (isViewerMode && !hasAutoSwitchedRef.current) {
+      hasAutoSwitchedRef.current = true;
+      navActions.setWorkbench("fileEditor");
+    }
+  }, []);
+  const naturalCompare = useCallback((a: string, b: string): number => {
+    const isDigit = (char: string) => char >= "0" && char <= "9";
+
+    const getChunk = (
+      s: string,
+      length: number,
+      marker: number,
+    ): { chunk: string; newMarker: number } => {
+      let chunk = "";
       const c = s.charAt(marker);
       chunk += c;
       marker++;
@@ -55,10 +80,18 @@ const Merge = (props: BaseToolProps) => {
     let marker2 = 0;
 
     while (marker1 < len1 && marker2 < len2) {
-      const { chunk: chunk1, newMarker: newMarker1 } = getChunk(a, len1, marker1);
+      const { chunk: chunk1, newMarker: newMarker1 } = getChunk(
+        a,
+        len1,
+        marker1,
+      );
       marker1 = newMarker1;
 
-      const { chunk: chunk2, newMarker: newMarker2 } = getChunk(b, len2, marker2);
+      const { chunk: chunk2, newMarker: newMarker2 } = getChunk(
+        b,
+        len2,
+        marker2,
+      );
       marker2 = newMarker2;
 
       let result: number;
@@ -79,24 +112,27 @@ const Merge = (props: BaseToolProps) => {
   }, []);
 
   // Custom file sorting logic for merge tool
-  const sortFiles = useCallback((sortType: 'filename' | 'dateModified', ascending: boolean = true) => {
-    const sortedStubs = [...selectedFileStubs].sort((stubA, stubB) => {
-      let comparison = 0;
-      switch (sortType) {
-        case 'filename':
-          comparison = naturalCompare(stubA.name, stubB.name);
-          break;
-        case 'dateModified':
-          comparison = stubA.lastModified - stubB.lastModified;
-          break;
-      }
-      return ascending ? comparison : -comparison;
-    });
+  const sortFiles = useCallback(
+    (sortType: "filename" | "dateModified", ascending: boolean = true) => {
+      const sortedStubs = [...selectedFileStubs].sort((stubA, stubB) => {
+        let comparison = 0;
+        switch (sortType) {
+          case "filename":
+            comparison = naturalCompare(stubA.name, stubB.name);
+            break;
+          case "dateModified":
+            comparison = stubA.lastModified - stubB.lastModified;
+            break;
+        }
+        return ascending ? comparison : -comparison;
+      });
 
-    const selectedIds = sortedStubs.map(record => record.id);
-    const deselectedIds = fileIds.filter(id => !selectedIds.includes(id));
-    reorderFiles([...selectedIds, ...deselectedIds]);
-  }, [selectedFileStubs, fileIds, reorderFiles, naturalCompare]);
+      const selectedIds = sortedStubs.map((record) => record.id);
+      const deselectedIds = fileIds.filter((id) => !selectedIds.includes(id));
+      reorderFiles([...selectedIds, ...deselectedIds]);
+    },
+    [selectedFileStubs, fileIds, reorderFiles, naturalCompare],
+  );
 
   return createToolFlow({
     files: {
@@ -118,7 +154,9 @@ const Merge = (props: BaseToolProps) => {
       {
         title: "Settings",
         isCollapsed: base.settingsCollapsed,
-        onCollapsedClick: base.settingsCollapsed ? base.handleSettingsReset : undefined,
+        onCollapsedClick: base.settingsCollapsed
+          ? base.handleSettingsReset
+          : undefined,
         tooltip: mergeTips,
         content: (
           <MergeSettings
@@ -136,7 +174,26 @@ const Merge = (props: BaseToolProps) => {
       onClick: base.handleExecute,
       endpointEnabled: base.endpointEnabled,
       paramsValid: base.params.validateParameters(),
+      disabledReason: isViewerMode ? "viewerMode" : undefined,
     },
+    belowExecuteButton:
+      isViewerMode && !base.hasResults ? (
+        <Stack align="center" gap={6} mx="md" mt={4}>
+          <Text size="xs" c="dimmed" ta="center">
+            {t(
+              "merge.viewerModeHint",
+              "Merge needs 2 or more files. Head to the file editor to select them.",
+            )}
+          </Text>
+          <Button
+            variant="light"
+            size="xs"
+            onClick={() => navActions.setWorkbench("fileEditor")}
+          >
+            {t("merge.goToFileEditor", "Go to file editor")}
+          </Button>
+        </Stack>
+      ) : undefined,
     review: {
       isVisible: base.hasResults,
       operation: base.operation,
diff --git a/frontend/src/core/tools/OCR.tsx b/frontend/src/core/tools/OCR.tsx
index 07f05c812b..94477c053d 100644
--- a/frontend/src/core/tools/OCR.tsx
+++ b/frontend/src/core/tools/OCR.tsx
@@ -1,7 +1,7 @@
 import { useEffect, useState } from "react";
 import { useTranslation } from "react-i18next";
 import { useEndpointEnabled } from "@app/hooks/useEndpointConfig";
-import { useFileSelection } from "@app/contexts/FileContext";
+import { useViewScopedFiles } from "@app/hooks/tools/shared/useViewScopedFiles";
 
 import { createToolFlow } from "@app/components/tools/shared/createToolFlow";
 
@@ -16,7 +16,7 @@ import { useAdvancedOCRTips } from "@app/components/tooltips/useAdvancedOCRTips"
 
 const OCR = ({ onPreviewFile, onComplete, onError }: BaseToolProps) => {
   const { t } = useTranslation();
-  const { selectedFiles } = useFileSelection();
+  const selectedFiles = useViewScopedFiles();
 
   const ocrParams = useOCRParameters();
   const ocrOperation = useOCROperation();
@@ -24,12 +24,16 @@ const OCR = ({ onPreviewFile, onComplete, onError }: BaseToolProps) => {
   const advancedOCRTips = useAdvancedOCRTips();
 
   // Step expansion state management
-  const [expandedStep, setExpandedStep] = useState<"files" | "settings" | "advanced" | null>("files");
+  const [expandedStep, setExpandedStep] = useState<
+    "files" | "settings" | "advanced" | null
+  >("files");
 
-  const { enabled: endpointEnabled, loading: endpointLoading } = useEndpointEnabled("ocr-pdf");
+  const { enabled: endpointEnabled, loading: endpointLoading } =
+    useEndpointEnabled("ocr-pdf");
 
   const hasFiles = selectedFiles.length > 0;
-  const hasResults = ocrOperation.files.length > 0 || ocrOperation.downloadUrl !== null;
+  const hasResults =
+    ocrOperation.files.length > 0 || ocrOperation.downloadUrl !== null;
   const hasValidSettings = ocrParams.validateParameters();
 
   useEffect(() => {
@@ -58,7 +62,9 @@ const OCR = ({ onPreviewFile, onComplete, onError }: BaseToolProps) => {
       }
     } catch (error) {
       if (onError) {
-        onError(error instanceof Error ? error.message : "OCR operation failed");
+        onError(
+          error instanceof Error ? error.message : "OCR operation failed",
+        );
       }
     }
   };
diff --git a/frontend/src/core/tools/OverlayPdfs.tsx b/frontend/src/core/tools/OverlayPdfs.tsx
index cacf53ba3d..da3db79bd6 100644
--- a/frontend/src/core/tools/OverlayPdfs.tsx
+++ b/frontend/src/core/tools/OverlayPdfs.tsx
@@ -1,20 +1,20 @@
-import { useTranslation } from 'react-i18next';
-import { createToolFlow } from '@app/components/tools/shared/createToolFlow';
-import { useBaseTool } from '@app/hooks/tools/shared/useBaseTool';
-import { BaseToolProps, ToolComponent } from '@app/types/tool';
-import OverlayPdfsSettings from '@app/components/tools/overlayPdfs/OverlayPdfsSettings';
-import { useOverlayPdfsParameters } from '@app/hooks/tools/overlayPdfs/useOverlayPdfsParameters';
-import { useOverlayPdfsOperation } from '@app/hooks/tools/overlayPdfs/useOverlayPdfsOperation';
-import { useOverlayPdfsTips } from '@app/components/tooltips/useOverlayPdfsTips';
+import { useTranslation } from "react-i18next";
+import { createToolFlow } from "@app/components/tools/shared/createToolFlow";
+import { useBaseTool } from "@app/hooks/tools/shared/useBaseTool";
+import { BaseToolProps, ToolComponent } from "@app/types/tool";
+import OverlayPdfsSettings from "@app/components/tools/overlayPdfs/OverlayPdfsSettings";
+import { useOverlayPdfsParameters } from "@app/hooks/tools/overlayPdfs/useOverlayPdfsParameters";
+import { useOverlayPdfsOperation } from "@app/hooks/tools/overlayPdfs/useOverlayPdfsOperation";
+import { useOverlayPdfsTips } from "@app/components/tooltips/useOverlayPdfsTips";
 
 const OverlayPdfs = (props: BaseToolProps) => {
   const { t } = useTranslation();
 
   const base = useBaseTool(
-    'overlay-pdfs',
+    "overlay-pdfs",
     useOverlayPdfsParameters,
     useOverlayPdfsOperation,
-    props
+    props,
   );
   const overlayTips = useOverlayPdfsTips();
 
@@ -25,9 +25,11 @@ const OverlayPdfs = (props: BaseToolProps) => {
     },
     steps: [
       {
-        title: t('overlay-pdfs.settings.title', 'Settings'),
+        title: t("overlay-pdfs.settings.title", "Settings"),
         isCollapsed: base.settingsCollapsed,
-        onCollapsedClick: base.settingsCollapsed ? base.handleSettingsReset : undefined,
+        onCollapsedClick: base.settingsCollapsed
+          ? base.handleSettingsReset
+          : undefined,
         tooltip: overlayTips,
         content: (
           <OverlayPdfsSettings
@@ -39,9 +41,9 @@ const OverlayPdfs = (props: BaseToolProps) => {
       },
     ],
     executeButton: {
-      text: t('overlay-pdfs.submit', 'Overlay and Review'),
+      text: t("overlay-pdfs.submit", "Overlay and Review"),
       isVisible: !base.hasResults,
-      loadingText: t('loading'),
+      loadingText: t("loading"),
       onClick: base.handleExecute,
       endpointEnabled: base.endpointEnabled,
       paramsValid: base.params.validateParameters(),
@@ -49,7 +51,7 @@ const OverlayPdfs = (props: BaseToolProps) => {
     review: {
       isVisible: base.hasResults,
       operation: base.operation,
-      title: t('overlay-pdfs.results.title', 'Overlay Results'),
+      title: t("overlay-pdfs.results.title", "Overlay Results"),
       onFileClick: base.handleThumbnailClick,
       onUndo: base.handleUndo,
     },
@@ -57,5 +59,3 @@ const OverlayPdfs = (props: BaseToolProps) => {
 };
 
 export default OverlayPdfs as ToolComponent;
-
-
diff --git a/frontend/src/core/tools/PageLayout.tsx b/frontend/src/core/tools/PageLayout.tsx
index ce1d7e40de..f4779ae312 100644
--- a/frontend/src/core/tools/PageLayout.tsx
+++ b/frontend/src/core/tools/PageLayout.tsx
@@ -1,33 +1,33 @@
-import { useTranslation } from 'react-i18next';
-import { createToolFlow } from '@app/components/tools/shared/createToolFlow';
-import { useBaseTool } from '@app/hooks/tools/shared/useBaseTool';
-import { useAccordionSteps } from '@app/hooks/tools/shared/useAccordionSteps';
-import { BaseToolProps, ToolComponent } from '@app/types/tool';
-import { usePageLayoutParameters } from '@app/hooks/tools/pageLayout/usePageLayoutParameters';
-import { usePageLayoutOperation } from '@app/hooks/tools/pageLayout/usePageLayoutOperation';
-import PageLayoutSettings from '@app/components/tools/pageLayout/PageLayoutSettings';
-import PageLayoutAdvancedSettings from '@app/components/tools/pageLayout/PageLayoutAdvancedSettings';
-import PageLayoutMarginsBordersSettings from '@app/components/tools/pageLayout/PageLayoutMarginsBordersSettings';
-import { usePageLayoutTips } from '@app/components/tooltips/PageLayout/usePageLayoutTips';
-import { usePageLayoutAdvancedTips } from '@app/components/tooltips/PageLayout/usePageLayoutAdvancedTips';
-import { usePageLayoutMarginsBordersTips } from '@app/components/tooltips/PageLayout/usePageLayoutMarginsBordersTips';
-import PageLayoutPreview from '@app/components/tools/pageLayout/PageLayoutPreview';
+import { useTranslation } from "react-i18next";
+import { createToolFlow } from "@app/components/tools/shared/createToolFlow";
+import { useBaseTool } from "@app/hooks/tools/shared/useBaseTool";
+import { useAccordionSteps } from "@app/hooks/tools/shared/useAccordionSteps";
+import { BaseToolProps, ToolComponent } from "@app/types/tool";
+import { usePageLayoutParameters } from "@app/hooks/tools/pageLayout/usePageLayoutParameters";
+import { usePageLayoutOperation } from "@app/hooks/tools/pageLayout/usePageLayoutOperation";
+import PageLayoutSettings from "@app/components/tools/pageLayout/PageLayoutSettings";
+import PageLayoutAdvancedSettings from "@app/components/tools/pageLayout/PageLayoutAdvancedSettings";
+import PageLayoutMarginsBordersSettings from "@app/components/tools/pageLayout/PageLayoutMarginsBordersSettings";
+import { usePageLayoutTips } from "@app/components/tooltips/PageLayout/usePageLayoutTips";
+import { usePageLayoutAdvancedTips } from "@app/components/tooltips/PageLayout/usePageLayoutAdvancedTips";
+import { usePageLayoutMarginsBordersTips } from "@app/components/tooltips/PageLayout/usePageLayoutMarginsBordersTips";
+import PageLayoutPreview from "@app/components/tools/pageLayout/PageLayoutPreview";
 
 enum PageLayoutStep {
-  NONE = 'none',
-  LAYOUT = 'layout',
-  ADVANCED = 'advanced',
-  MARGINS_BORDERS = 'marginsBorders',
+  NONE = "none",
+  LAYOUT = "layout",
+  ADVANCED = "advanced",
+  MARGINS_BORDERS = "marginsBorders",
 }
 
 const PageLayout = (props: BaseToolProps) => {
   const { t } = useTranslation();
 
   const base = useBaseTool(
-    'pageLayout',
+    "pageLayout",
     usePageLayoutParameters,
     usePageLayoutOperation,
-    props
+    props,
   );
 
   const pageLayoutTips = usePageLayoutTips();
@@ -49,14 +49,13 @@ const PageLayout = (props: BaseToolProps) => {
       selectedFiles: base.selectedFiles,
       isCollapsed: base.hasResults,
     },
-    preview: (
-      <PageLayoutPreview parameters={base.params.parameters} />
-    ),
+    preview: <PageLayoutPreview parameters={base.params.parameters} />,
     steps: [
       {
-        title: 'Layout settings',
+        title: "Layout settings",
         isCollapsed: accordion.getCollapsedState(PageLayoutStep.LAYOUT),
-        onCollapsedClick: () => accordion.handleStepToggle(PageLayoutStep.LAYOUT),
+        onCollapsedClick: () =>
+          accordion.handleStepToggle(PageLayoutStep.LAYOUT),
         tooltip: pageLayoutTips,
         content: (
           <PageLayoutSettings
@@ -67,9 +66,10 @@ const PageLayout = (props: BaseToolProps) => {
         ),
       },
       {
-        title: 'Advanced settings',
+        title: "Advanced settings",
         isCollapsed: accordion.getCollapsedState(PageLayoutStep.ADVANCED),
-        onCollapsedClick: () => accordion.handleStepToggle(PageLayoutStep.ADVANCED),
+        onCollapsedClick: () =>
+          accordion.handleStepToggle(PageLayoutStep.ADVANCED),
         tooltip: pageLayoutAdvancedTips,
         content: (
           <PageLayoutAdvancedSettings
@@ -80,9 +80,12 @@ const PageLayout = (props: BaseToolProps) => {
         ),
       },
       {
-        title: 'Margins and borders',
-        isCollapsed: accordion.getCollapsedState(PageLayoutStep.MARGINS_BORDERS),
-        onCollapsedClick: () => accordion.handleStepToggle(PageLayoutStep.MARGINS_BORDERS),
+        title: "Margins and borders",
+        isCollapsed: accordion.getCollapsedState(
+          PageLayoutStep.MARGINS_BORDERS,
+        ),
+        onCollapsedClick: () =>
+          accordion.handleStepToggle(PageLayoutStep.MARGINS_BORDERS),
         tooltip: pageLayoutMarginsBordersTips,
         content: (
           <PageLayoutMarginsBordersSettings
@@ -94,9 +97,9 @@ const PageLayout = (props: BaseToolProps) => {
       },
     ],
     executeButton: {
-      text: t('pageLayout.submit', 'Create Layout'),
+      text: t("pageLayout.submit", "Create Layout"),
       isVisible: !base.hasResults,
-      loadingText: t('loading'),
+      loadingText: t("loading"),
       onClick: base.handleExecute,
       endpointEnabled: base.endpointEnabled,
       paramsValid: base.params.validateParameters(),
@@ -104,7 +107,7 @@ const PageLayout = (props: BaseToolProps) => {
     review: {
       isVisible: base.hasResults,
       operation: base.operation,
-      title: t('pageLayout.title', 'Multi Page Layout Results'),
+      title: t("pageLayout.title", "Multi Page Layout Results"),
       onFileClick: base.handleThumbnailClick,
       onUndo: base.handleUndo,
     },
@@ -112,5 +115,3 @@ const PageLayout = (props: BaseToolProps) => {
 };
 
 export default PageLayout as ToolComponent;
-
-
diff --git a/frontend/src/core/tools/Redact.tsx b/frontend/src/core/tools/Redact.tsx
index 86bf3f9ba3..f172a2bc23 100644
--- a/frontend/src/core/tools/Redact.tsx
+++ b/frontend/src/core/tools/Redact.tsx
@@ -2,15 +2,26 @@ import { useTranslation } from "react-i18next";
 import { useState, useEffect, useRef } from "react";
 import { createToolFlow } from "@app/components/tools/shared/createToolFlow";
 import RedactModeSelector from "@app/components/tools/redact/RedactModeSelector";
-import { useRedactParameters, RedactMode } from "@app/hooks/tools/redact/useRedactParameters";
+import {
+  useRedactParameters,
+  RedactMode,
+} from "@app/hooks/tools/redact/useRedactParameters";
 import { useRedactOperation } from "@app/hooks/tools/redact/useRedactOperation";
 import { useBaseTool } from "@app/hooks/tools/shared/useBaseTool";
 import { BaseToolProps, ToolComponent } from "@app/types/tool";
-import { useRedactModeTips, useRedactWordsTips, useRedactAdvancedTips, useRedactManualTips } from "@app/components/tooltips/useRedactTips";
+import {
+  useRedactModeTips,
+  useRedactWordsTips,
+  useRedactAdvancedTips,
+  useRedactManualTips,
+} from "@app/components/tooltips/useRedactTips";
 import RedactAdvancedSettings from "@app/components/tools/redact/RedactAdvancedSettings";
 import WordsToRedactInput from "@app/components/tools/redact/WordsToRedactInput";
 import ManualRedactionControls from "@app/components/tools/redact/ManualRedactionControls";
-import { useNavigationActions, useNavigationState } from "@app/contexts/NavigationContext";
+import {
+  useNavigationActions,
+  useNavigationState,
+} from "@app/contexts/NavigationContext";
 import { useRedaction } from "@app/contexts/RedactionContext";
 import { useFileState } from "@app/contexts/file/fileHooks";
 
@@ -24,15 +35,16 @@ const Redact = (props: BaseToolProps) => {
 
   // Navigation and redaction context
   const { actions: navActions } = useNavigationActions();
-  const { setRedactionConfig, setRedactionMode, redactionConfig } = useRedaction();
+  const { setRedactionConfig, setRedactionMode, redactionConfig } =
+    useRedaction();
   const { workbench } = useNavigationState();
   const hasOpenedViewer = useRef(false);
 
   const base = useBaseTool(
-    'redact',
+    "redact",
     useRedactParameters,
     useRedactOperation,
-    props
+    props,
   );
 
   // Get total file count from context (any files in workbench, not just selected)
@@ -48,22 +60,31 @@ const Redact = (props: BaseToolProps) => {
   // Auto-set manual mode if we're in the viewer and redaction config is set to manual
   // This ensures when opening redact from viewer, it automatically selects manual mode
   useEffect(() => {
-    if (workbench === 'viewer' && redactionConfig?.mode === 'manual' && base.params.parameters.mode !== 'manual') {
+    if (
+      workbench === "viewer" &&
+      redactionConfig?.mode === "manual" &&
+      base.params.parameters.mode !== "manual"
+    ) {
       // Set immediately when conditions are met
-      base.params.updateParameter('mode', 'manual');
+      base.params.updateParameter("mode", "manual");
     }
-  }, [workbench, redactionConfig, base.params.parameters.mode, base.params.updateParameter]);
+  }, [
+    workbench,
+    redactionConfig,
+    base.params.parameters.mode,
+    base.params.updateParameter,
+  ]);
 
   // Handle mode change - navigate to viewer when manual mode is selected
   // Manual mode works with any files in workbench (not just selected files)
   const handleModeChange = (mode: RedactMode) => {
-    base.params.updateParameter('mode', mode);
-    
-    if (mode === 'manual' && hasAnyFiles) {
+    base.params.updateParameter("mode", mode);
+
+    if (mode === "manual" && hasAnyFiles) {
       // Set redaction config and navigate to viewer
       setRedactionConfig(base.params.parameters);
       setRedactionMode(true);
-      navActions.setWorkbench('viewer');
+      navActions.setWorkbench("viewer");
       hasOpenedViewer.current = true;
     }
   };
@@ -71,32 +92,46 @@ const Redact = (props: BaseToolProps) => {
   // When files are added and in manual mode, navigate to viewer
   // Uses hasAnyFiles since manual mode works with any files in workbench
   useEffect(() => {
-    if (base.params.parameters.mode === 'manual' && hasAnyFiles && !hasOpenedViewer.current) {
+    if (
+      base.params.parameters.mode === "manual" &&
+      hasAnyFiles &&
+      !hasOpenedViewer.current
+    ) {
       setRedactionConfig(base.params.parameters);
       setRedactionMode(true);
-      navActions.setWorkbench('viewer');
+      navActions.setWorkbench("viewer");
       hasOpenedViewer.current = true;
     }
-  }, [hasAnyFiles, base.params.parameters, navActions, setRedactionConfig, setRedactionMode]);
+  }, [
+    hasAnyFiles,
+    base.params.parameters,
+    navActions,
+    setRedactionConfig,
+    setRedactionMode,
+  ]);
 
   // Reset viewer flag when mode changes back to automatic
   useEffect(() => {
-    if (base.params.parameters.mode === 'automatic') {
+    if (base.params.parameters.mode === "automatic") {
       hasOpenedViewer.current = false;
       setRedactionMode(false);
     }
   }, [base.params.parameters.mode, setRedactionMode]);
 
   const isExecuteDisabled = () => {
-    if (base.params.parameters.mode === 'manual') {
+    if (base.params.parameters.mode === "manual") {
       return true; // Manual mode uses viewer, not execute button
     }
-    return !base.params.validateParameters() || !base.hasFiles || !base.endpointEnabled;
+    return (
+      !base.params.validateParameters() ||
+      !base.hasFiles ||
+      !base.endpointEnabled
+    );
   };
 
   // Compute actual collapsed state based on results and user state
   const getActualCollapsedState = (userCollapsed: boolean) => {
-    return (!base.hasFiles || base.hasResults) ? true : userCollapsed; // Force collapse when results are shown
+    return base.hasResults ? true : userCollapsed; // Force collapse when results are shown
   };
 
   // Build conditional steps based on redaction mode
@@ -104,53 +139,67 @@ const Redact = (props: BaseToolProps) => {
     // Method step is always expandable (even without files selected)
     // Only collapse on results or user preference
     const methodStepCollapsed = base.hasResults ? true : methodCollapsed;
-    
+
     const steps = [
       // Method selection step (always present and always expandable)
       {
         title: t("redact.modeSelector.title", "Redaction Method"),
         isCollapsed: methodStepCollapsed,
-        onCollapsedClick: () => base.settingsCollapsed ? base.handleSettingsReset() : setMethodCollapsed(!methodCollapsed),
+        onCollapsedClick: () =>
+          base.settingsCollapsed
+            ? base.handleSettingsReset()
+            : setMethodCollapsed(!methodCollapsed),
         tooltip: modeTips,
         content: (
           <RedactModeSelector
             mode={base.params.parameters.mode}
             onModeChange={handleModeChange}
             disabled={base.endpointLoading}
-            hasFilesSelected={base.hasFiles}
             hasAnyFiles={hasAnyFiles}
           />
         ),
-      }
+      },
     ];
 
     // Add mode-specific steps
-    if (base.params.parameters.mode === 'automatic') {
+    if (base.params.parameters.mode === "automatic") {
       steps.push(
         {
           title: t("redact.auto.settings.title", "Redaction Settings"),
           isCollapsed: getActualCollapsedState(wordsCollapsed),
-          onCollapsedClick: () => base.settingsCollapsed ? base.handleSettingsReset() : setWordsCollapsed(!wordsCollapsed),
+          onCollapsedClick: () =>
+            base.settingsCollapsed
+              ? base.handleSettingsReset()
+              : setWordsCollapsed(!wordsCollapsed),
           tooltip: wordsTips,
-          content: <WordsToRedactInput
-            wordsToRedact={base.params.parameters.wordsToRedact}
-            onWordsChange={(words) => base.params.updateParameter('wordsToRedact', words)}
-            disabled={base.endpointLoading}
-          />,
+          content: (
+            <WordsToRedactInput
+              wordsToRedact={base.params.parameters.wordsToRedact}
+              onWordsChange={(words) =>
+                base.params.updateParameter("wordsToRedact", words)
+              }
+              disabled={base.endpointLoading}
+            />
+          ),
         },
         {
           title: t("redact.auto.settings.advancedTitle", "Advanced Settings"),
           isCollapsed: getActualCollapsedState(advancedCollapsed),
-          onCollapsedClick: () => base.settingsCollapsed ? base.handleSettingsReset() : setAdvancedCollapsed(!advancedCollapsed),
+          onCollapsedClick: () =>
+            base.settingsCollapsed
+              ? base.handleSettingsReset()
+              : setAdvancedCollapsed(!advancedCollapsed),
           tooltip: advancedTips,
-          content: <RedactAdvancedSettings
-            parameters={base.params.parameters}
-            onParameterChange={base.params.updateParameter}
-            disabled={base.endpointLoading}
-          />,
+          content: (
+            <RedactAdvancedSettings
+              parameters={base.params.parameters}
+              onParameterChange={base.params.updateParameter}
+              disabled={base.endpointLoading}
+            />
+          ),
         },
       );
-    } else if (base.params.parameters.mode === 'manual') {
+    } else if (base.params.parameters.mode === "manual") {
       // Manual mode - show redaction controls
       // Uses hasAnyFiles since manual mode works with any files in workbench (viewer-powered)
       steps.push({
@@ -166,7 +215,7 @@ const Redact = (props: BaseToolProps) => {
   };
 
   // Hide execute button in manual mode (redactions applied via controls)
-  const isManualMode = base.params.parameters.mode === 'manual';
+  const isManualMode = base.params.parameters.mode === "manual";
 
   return createToolFlow({
     files: {
diff --git a/frontend/src/core/tools/RemoveAnnotations.tsx b/frontend/src/core/tools/RemoveAnnotations.tsx
index 2a84fcbbf3..c76a549056 100644
--- a/frontend/src/core/tools/RemoveAnnotations.tsx
+++ b/frontend/src/core/tools/RemoveAnnotations.tsx
@@ -12,10 +12,10 @@ const RemoveAnnotations = (props: BaseToolProps) => {
   const removeAnnotationsTips = useRemoveAnnotationsTips();
 
   const base = useBaseTool(
-    'removeAnnotations',
+    "removeAnnotations",
     useRemoveAnnotationsParameters,
     useRemoveAnnotationsOperation,
-    props
+    props,
   );
 
   return createToolFlow({
@@ -27,7 +27,9 @@ const RemoveAnnotations = (props: BaseToolProps) => {
       {
         title: t("removeAnnotations.settings.title", "Settings"),
         isCollapsed: base.settingsCollapsed,
-        onCollapsedClick: base.settingsCollapsed ? base.handleSettingsReset : undefined,
+        onCollapsedClick: base.settingsCollapsed
+          ? base.handleSettingsReset
+          : undefined,
         tooltip: removeAnnotationsTips,
         content: <RemoveAnnotationsSettings />,
       },
@@ -49,4 +51,4 @@ const RemoveAnnotations = (props: BaseToolProps) => {
   });
 };
 
-export default RemoveAnnotations as ToolComponent;
\ No newline at end of file
+export default RemoveAnnotations as ToolComponent;
diff --git a/frontend/src/core/tools/RemoveBlanks.tsx b/frontend/src/core/tools/RemoveBlanks.tsx
index bc2511b37b..babc2328b1 100644
--- a/frontend/src/core/tools/RemoveBlanks.tsx
+++ b/frontend/src/core/tools/RemoveBlanks.tsx
@@ -12,10 +12,10 @@ const RemoveBlanks = (props: BaseToolProps) => {
   const tooltipContent = useRemoveBlanksTips();
 
   const base = useBaseTool(
-    'remove-blanks',
+    "remove-blanks",
     useRemoveBlanksParameters,
     useRemoveBlanksOperation,
-    props
+    props,
   );
 
   const settingsContent = (
@@ -67,5 +67,3 @@ const RemoveBlanks = (props: BaseToolProps) => {
 RemoveBlanks.tool = () => useRemoveBlanksOperation;
 
 export default RemoveBlanks as ToolComponent;
-
-
diff --git a/frontend/src/core/tools/RemoveCertificateSign.tsx b/frontend/src/core/tools/RemoveCertificateSign.tsx
index 946aa76923..dd43967acb 100644
--- a/frontend/src/core/tools/RemoveCertificateSign.tsx
+++ b/frontend/src/core/tools/RemoveCertificateSign.tsx
@@ -9,10 +9,10 @@ const RemoveCertificateSign = (props: BaseToolProps) => {
   const { t } = useTranslation();
 
   const base = useBaseTool(
-    'removeCertificateSign',
+    "removeCertificateSign",
     useRemoveCertificateSignParameters,
     useRemoveCertificateSignOperation,
-    props
+    props,
   );
 
   return createToolFlow({
diff --git a/frontend/src/core/tools/RemoveImage.tsx b/frontend/src/core/tools/RemoveImage.tsx
index 57f88b4605..11d187ae8f 100644
--- a/frontend/src/core/tools/RemoveImage.tsx
+++ b/frontend/src/core/tools/RemoveImage.tsx
@@ -9,10 +9,10 @@ const RemoveImage = (props: BaseToolProps) => {
   const { t } = useTranslation();
 
   const base = useBaseTool(
-    'removeImage',
+    "removeImage",
     useRemoveImageParameters,
     useRemoveImageOperation,
-    props
+    props,
   );
 
   return createToolFlow({
@@ -42,5 +42,3 @@ const RemoveImage = (props: BaseToolProps) => {
 RemoveImage.tool = () => useRemoveImageOperation;
 
 export default RemoveImage as ToolComponent;
-
-
diff --git a/frontend/src/core/tools/RemovePages.tsx b/frontend/src/core/tools/RemovePages.tsx
index 5e3d20822c..77a27d93e7 100644
--- a/frontend/src/core/tools/RemovePages.tsx
+++ b/frontend/src/core/tools/RemovePages.tsx
@@ -12,13 +12,12 @@ const RemovePages = (props: BaseToolProps) => {
   const tooltipContent = useRemovePagesTips();
 
   const base = useBaseTool(
-    'remove-pages',
+    "remove-pages",
     useRemovePagesParameters,
     useRemovePagesOperation,
-    props
+    props,
   );
 
-
   const settingsContent = (
     <RemovePagesSettings
       parameters={base.params.parameters}
@@ -36,7 +35,9 @@ const RemovePages = (props: BaseToolProps) => {
       {
         title: t("removePages.settings.title", "Settings"),
         isCollapsed: base.settingsCollapsed,
-        onCollapsedClick: base.settingsCollapsed ? base.handleSettingsReset : undefined,
+        onCollapsedClick: base.settingsCollapsed
+          ? base.handleSettingsReset
+          : undefined,
         content: settingsContent,
         tooltip: tooltipContent,
       },
diff --git a/frontend/src/core/tools/RemovePassword.tsx b/frontend/src/core/tools/RemovePassword.tsx
index af72201e3d..effe5e8557 100644
--- a/frontend/src/core/tools/RemovePassword.tsx
+++ b/frontend/src/core/tools/RemovePassword.tsx
@@ -12,10 +12,10 @@ const RemovePassword = (props: BaseToolProps) => {
   const removePasswordTips = useRemovePasswordTips();
 
   const base = useBaseTool(
-    'removePassword',
+    "removePassword",
     useRemovePasswordParameters,
     useRemovePasswordOperation,
-    props
+    props,
   );
 
   return createToolFlow({
@@ -27,7 +27,9 @@ const RemovePassword = (props: BaseToolProps) => {
       {
         title: t("removePassword.password.stepTitle", "Remove Password"),
         isCollapsed: base.settingsCollapsed,
-        onCollapsedClick: base.hasResults ? base.handleSettingsReset : undefined,
+        onCollapsedClick: base.hasResults
+          ? base.handleSettingsReset
+          : undefined,
         tooltip: removePasswordTips,
         content: (
           <RemovePasswordSettings
diff --git a/frontend/src/core/tools/ReorganizePages.tsx b/frontend/src/core/tools/ReorganizePages.tsx
index d70f7a2667..dcf5c1ae9c 100644
--- a/frontend/src/core/tools/ReorganizePages.tsx
+++ b/frontend/src/core/tools/ReorganizePages.tsx
@@ -3,20 +3,25 @@ import { useTranslation } from "react-i18next";
 import { createToolFlow } from "@app/components/tools/shared/createToolFlow";
 import { BaseToolProps, ToolComponent } from "@app/types/tool";
 import { useEndpointEnabled } from "@app/hooks/useEndpointConfig";
-import { useFileSelection } from "@app/contexts/FileContext";
+import { useViewScopedFiles } from "@app/hooks/tools/shared/useViewScopedFiles";
 import { useAccordionSteps } from "@app/hooks/tools/shared/useAccordionSteps";
 import ReorganizePagesSettings from "@app/components/tools/reorganizePages/ReorganizePagesSettings";
 import { useReorganizePagesParameters } from "@app/hooks/tools/reorganizePages/useReorganizePagesParameters";
 import { useReorganizePagesOperation } from "@app/hooks/tools/reorganizePages/useReorganizePagesOperation";
 
-const ReorganizePages = ({ onPreviewFile, onComplete, onError }: BaseToolProps) => {
+const ReorganizePages = ({
+  onPreviewFile,
+  onComplete,
+  onError,
+}: BaseToolProps) => {
   const { t } = useTranslation();
-  const { selectedFiles } = useFileSelection();
+  const selectedFiles = useViewScopedFiles();
 
   const params = useReorganizePagesParameters();
   const operation = useReorganizePagesOperation();
 
-  const { enabled: endpointEnabled, loading: endpointLoading } = useEndpointEnabled("rearrange-pages");
+  const { enabled: endpointEnabled, loading: endpointLoading } =
+    useEndpointEnabled("rearrange-pages");
 
   useEffect(() => {
     operation.resetResults();
@@ -30,16 +35,20 @@ const ReorganizePages = ({ onPreviewFile, onComplete, onError }: BaseToolProps)
         onComplete(operation.files);
       }
     } catch (error: any) {
-      onError?.(error?.message || t("reorganizePages.error.failed", "Failed to reorganize pages"));
+      onError?.(
+        error?.message ||
+          t("reorganizePages.error.failed", "Failed to reorganize pages"),
+      );
     }
   };
 
   const hasFiles = selectedFiles.length > 0;
-  const hasResults = operation.files.length > 0 || operation.downloadUrl !== null;
+  const hasResults =
+    operation.files.length > 0 || operation.downloadUrl !== null;
 
   enum Step {
-    NONE = 'none',
-    SETTINGS = 'settings'
+    NONE = "none",
+    SETTINGS = "settings",
   }
 
   const accordion = useAccordionSteps<Step>({
@@ -47,12 +56,12 @@ const ReorganizePages = ({ onPreviewFile, onComplete, onError }: BaseToolProps)
     initialStep: Step.SETTINGS,
     stateConditions: {
       hasFiles,
-      hasResults
+      hasResults,
     },
     afterResults: () => {
       operation.resetResults();
       onPreviewFile?.(null);
-    }
+    },
   });
 
   const steps = [
@@ -68,7 +77,7 @@ const ReorganizePages = ({ onPreviewFile, onComplete, onError }: BaseToolProps)
           disabled={endpointLoading}
         />
       ),
-    }
+    },
   ];
 
   return createToolFlow({
@@ -78,9 +87,9 @@ const ReorganizePages = ({ onPreviewFile, onComplete, onError }: BaseToolProps)
     },
     steps,
     executeButton: {
-      text: t('reorganizePages.submit', 'Reorganize Pages'),
+      text: t("reorganizePages.submit", "Reorganize Pages"),
       isVisible: !hasResults,
-      loadingText: t('loading'),
+      loadingText: t("loading"),
       onClick: handleExecute,
       endpointEnabled: endpointEnabled,
       paramsValid: params.validateParameters(),
@@ -88,7 +97,7 @@ const ReorganizePages = ({ onPreviewFile, onComplete, onError }: BaseToolProps)
     review: {
       isVisible: hasResults,
       operation: operation,
-      title: t('reorganizePages.results.title', 'Pages Reorganized'),
+      title: t("reorganizePages.results.title", "Pages Reorganized"),
       onFileClick: (file) => onPreviewFile?.(file),
       onUndo: async () => {
         await operation.undoOperation();
@@ -101,5 +110,3 @@ const ReorganizePages = ({ onPreviewFile, onComplete, onError }: BaseToolProps)
 (ReorganizePages as any).tool = () => useReorganizePagesOperation;
 
 export default ReorganizePages as ToolComponent;
-
-
diff --git a/frontend/src/core/tools/Repair.tsx b/frontend/src/core/tools/Repair.tsx
index f391e23810..bd057fd794 100644
--- a/frontend/src/core/tools/Repair.tsx
+++ b/frontend/src/core/tools/Repair.tsx
@@ -9,10 +9,10 @@ const Repair = (props: BaseToolProps) => {
   const { t } = useTranslation();
 
   const base = useBaseTool(
-    'repair',
+    "repair",
     useRepairParameters,
     useRepairOperation,
-    props
+    props,
   );
 
   return createToolFlow({
diff --git a/frontend/src/core/tools/ReplaceColor.tsx b/frontend/src/core/tools/ReplaceColor.tsx
index 5fd1968ea1..5064f49bd3 100644
--- a/frontend/src/core/tools/ReplaceColor.tsx
+++ b/frontend/src/core/tools/ReplaceColor.tsx
@@ -12,10 +12,10 @@ const ReplaceColor = (props: BaseToolProps) => {
   const replaceColorTips = useReplaceColorTips();
 
   const base = useBaseTool(
-    'replaceColor',
+    "replaceColor",
     useReplaceColorParameters,
     useReplaceColorOperation,
-    props
+    props,
   );
 
   return createToolFlow({
@@ -27,7 +27,9 @@ const ReplaceColor = (props: BaseToolProps) => {
       {
         title: t("replaceColor.labels.settings", "Settings"),
         isCollapsed: base.settingsCollapsed,
-        onCollapsedClick: base.settingsCollapsed ? base.handleSettingsReset : undefined,
+        onCollapsedClick: base.settingsCollapsed
+          ? base.handleSettingsReset
+          : undefined,
         tooltip: replaceColorTips,
         content: (
           <ReplaceColorSettings
@@ -56,4 +58,4 @@ const ReplaceColor = (props: BaseToolProps) => {
   });
 };
 
-export default ReplaceColor as ToolComponent;
\ No newline at end of file
+export default ReplaceColor as ToolComponent;
diff --git a/frontend/src/core/tools/Rotate.tsx b/frontend/src/core/tools/Rotate.tsx
index ec45a00648..565953d1fd 100644
--- a/frontend/src/core/tools/Rotate.tsx
+++ b/frontend/src/core/tools/Rotate.tsx
@@ -12,10 +12,10 @@ const Rotate = (props: BaseToolProps) => {
   const rotateTips = useRotateTips();
 
   const base = useBaseTool(
-    'rotate',
+    "rotate",
     useRotateParameters,
     useRotateOperation,
-    props
+    props,
   );
 
   return createToolFlow({
@@ -27,7 +27,9 @@ const Rotate = (props: BaseToolProps) => {
       {
         title: "Settings",
         isCollapsed: base.settingsCollapsed,
-        onCollapsedClick: base.settingsCollapsed ? base.handleSettingsReset : undefined,
+        onCollapsedClick: base.settingsCollapsed
+          ? base.handleSettingsReset
+          : undefined,
         tooltip: rotateTips,
         content: (
           <RotateSettings
diff --git a/frontend/src/core/tools/Sanitize.tsx b/frontend/src/core/tools/Sanitize.tsx
index 09c89e2c37..63a87a2ccf 100644
--- a/frontend/src/core/tools/Sanitize.tsx
+++ b/frontend/src/core/tools/Sanitize.tsx
@@ -10,10 +10,10 @@ const Sanitize = (props: BaseToolProps) => {
   const { t } = useTranslation();
 
   const base = useBaseTool(
-    'sanitize',
+    "sanitize",
     useSanitizeParameters,
     useSanitizeOperation,
-    props
+    props,
   );
 
   return createToolFlow({
@@ -25,7 +25,9 @@ const Sanitize = (props: BaseToolProps) => {
       {
         title: t("sanitize.steps.settings", "Settings"),
         isCollapsed: base.settingsCollapsed,
-        onCollapsedClick: base.settingsCollapsed ? base.handleSettingsReset : undefined,
+        onCollapsedClick: base.settingsCollapsed
+          ? base.handleSettingsReset
+          : undefined,
         content: (
           <SanitizeSettings
             parameters={base.params.parameters}
diff --git a/frontend/src/core/tools/ScannerImageSplit.tsx b/frontend/src/core/tools/ScannerImageSplit.tsx
index 74f2edbb43..95093be9c4 100644
--- a/frontend/src/core/tools/ScannerImageSplit.tsx
+++ b/frontend/src/core/tools/ScannerImageSplit.tsx
@@ -12,10 +12,10 @@ const ScannerImageSplit = (props: BaseToolProps) => {
   const scannerImageSplitTips = useScannerImageSplitTips();
 
   const base = useBaseTool(
-    'scannerImageSplit',
+    "scannerImageSplit",
     useScannerImageSplitParameters,
     useScannerImageSplitOperation,
-    props
+    props,
   );
 
   return createToolFlow({
@@ -27,7 +27,9 @@ const ScannerImageSplit = (props: BaseToolProps) => {
       {
         title: "Settings",
         isCollapsed: base.settingsCollapsed,
-        onCollapsedClick: base.settingsCollapsed ? base.handleSettingsReset : undefined,
+        onCollapsedClick: base.settingsCollapsed
+          ? base.handleSettingsReset
+          : undefined,
         tooltip: scannerImageSplitTips,
         content: (
           <ScannerImageSplitSettings
@@ -56,4 +58,4 @@ const ScannerImageSplit = (props: BaseToolProps) => {
   });
 };
 
-export default ScannerImageSplit as ToolComponent;
\ No newline at end of file
+export default ScannerImageSplit as ToolComponent;
diff --git a/frontend/src/core/tools/ShowJS.tsx b/frontend/src/core/tools/ShowJS.tsx
index 234298d9b6..f41b31f43b 100644
--- a/frontend/src/core/tools/ShowJS.tsx
+++ b/frontend/src/core/tools/ShowJS.tsx
@@ -1,144 +1,189 @@
-import React, { useEffect, useMemo, useRef } from 'react';
-import { useTranslation } from 'react-i18next';
-import CodeRoundedIcon from '@mui/icons-material/CodeRounded';
-import { createToolFlow } from '@app/components/tools/shared/createToolFlow';
-import { useBaseTool } from '@app/hooks/tools/shared/useBaseTool';
-import type { BaseToolProps, ToolComponent } from '@app/types/tool';
-import { useShowJSParameters, defaultParameters } from '@app/hooks/tools/showJS/useShowJSParameters';
-import { useShowJSOperation, type ShowJSOperationHook } from '@app/hooks/tools/showJS/useShowJSOperation';
-import { useToolWorkflow } from '@app/contexts/ToolWorkflowContext';
-import { useNavigationActions, useNavigationState } from '@app/contexts/NavigationContext';
-import ShowJSView from '@app/components/tools/showJS/ShowJSView';
-import { useFileSelection } from '@app/contexts/file/fileHooks';
+import React, { useEffect, useMemo, useRef } from "react";
+import { useTranslation } from "react-i18next";
+import CodeRoundedIcon from "@mui/icons-material/CodeRounded";
+import { createToolFlow } from "@app/components/tools/shared/createToolFlow";
+import { useBaseTool } from "@app/hooks/tools/shared/useBaseTool";
+import type { BaseToolProps, ToolComponent } from "@app/types/tool";
+import {
+  useShowJSParameters,
+  defaultParameters,
+} from "@app/hooks/tools/showJS/useShowJSParameters";
+import {
+  useShowJSOperation,
+  type ShowJSOperationHook,
+} from "@app/hooks/tools/showJS/useShowJSOperation";
+import { useToolWorkflow } from "@app/contexts/ToolWorkflowContext";
+import {
+  useNavigationActions,
+  useNavigationState,
+} from "@app/contexts/NavigationContext";
+import ShowJSView from "@app/components/tools/showJS/ShowJSView";
+import { useFileSelection } from "@app/contexts/file/fileHooks";
 
 const ShowJS = (props: BaseToolProps) => {
-	const { t } = useTranslation();
-	const { actions: navigationActions } = useNavigationActions();
-	const navigationState = useNavigationState();
+  const { t } = useTranslation();
+  const { actions: navigationActions } = useNavigationActions();
+  const navigationState = useNavigationState();
 
-	const {
-		registerCustomWorkbenchView,
-		unregisterCustomWorkbenchView,
-		setCustomWorkbenchViewData,
-		clearCustomWorkbenchViewData,
-	} = useToolWorkflow();
+  const {
+    registerCustomWorkbenchView,
+    unregisterCustomWorkbenchView,
+    setCustomWorkbenchViewData,
+    clearCustomWorkbenchViewData,
+  } = useToolWorkflow();
 
-	const VIEW_ID = 'showJSView';
-	const WORKBENCH_ID = 'custom:showJS' as const;
-	const viewIcon = useMemo(() => <CodeRoundedIcon fontSize="small" />, []);
+  const VIEW_ID = "showJSView";
+  const WORKBENCH_ID = "custom:showJS" as const;
+  const viewIcon = useMemo(() => <CodeRoundedIcon fontSize="small" />, []);
 
-	const base = useBaseTool('showJS', useShowJSParameters, useShowJSOperation, props, { minFiles: 1 });
-	const operation = base.operation as ShowJSOperationHook;
-	const hasResults = Boolean(operation.scriptText);
-	const { clearSelections } = useFileSelection();
+  const base = useBaseTool(
+    "showJS",
+    useShowJSParameters,
+    useShowJSOperation,
+    props,
+    { minFiles: 1 },
+  );
+  const operation = base.operation as ShowJSOperationHook;
+  const hasResults = Boolean(operation.scriptText);
+  const { clearSelections } = useFileSelection();
 
-	useEffect(() => {
-		registerCustomWorkbenchView({
-			id: VIEW_ID,
-			workbenchId: WORKBENCH_ID,
-			label: t('showJS.view.title', 'JavaScript'),
-			icon: viewIcon,
-			component: ({ data }) => <ShowJSView data={data} />,
-		});
+  useEffect(() => {
+    registerCustomWorkbenchView({
+      id: VIEW_ID,
+      workbenchId: WORKBENCH_ID,
+      label: t("showJS.view.title", "JavaScript"),
+      icon: viewIcon,
+      component: ({ data }) => <ShowJSView data={data} />,
+    });
 
-		return () => {
-			clearCustomWorkbenchViewData(VIEW_ID);
-			unregisterCustomWorkbenchView(VIEW_ID);
-		};
-	}, [clearCustomWorkbenchViewData, registerCustomWorkbenchView, t, unregisterCustomWorkbenchView, viewIcon]);
+    return () => {
+      clearCustomWorkbenchViewData(VIEW_ID);
+      unregisterCustomWorkbenchView(VIEW_ID);
+    };
+  }, [
+    clearCustomWorkbenchViewData,
+    registerCustomWorkbenchView,
+    t,
+    unregisterCustomWorkbenchView,
+    viewIcon,
+  ]);
 
-	const lastShownRef = useRef<number | null>(null);
+  const lastShownRef = useRef<number | null>(null);
 
-	useEffect(() => {
-		if (operation.scriptText) {
-			setCustomWorkbenchViewData(VIEW_ID, {
-				scriptText: operation.scriptText,
-				downloadUrl: operation.downloadUrl,
-				downloadFilename: operation.downloadFilename,
-			});
-			const marker = operation.scriptText.length;
-			const isNew = lastShownRef.current == null || marker !== lastShownRef.current;
-			if (isNew) {
-				lastShownRef.current = marker;
-				if (navigationState.selectedTool === 'showJS' && navigationState.workbench !== WORKBENCH_ID) {
-					navigationActions.setWorkbench(WORKBENCH_ID);
-				}
-			}
-		} else {
-			clearCustomWorkbenchViewData(VIEW_ID);
-			lastShownRef.current = null;
-		}
-	}, [
-		clearCustomWorkbenchViewData,
-		navigationActions,
-		navigationState.selectedTool,
-		navigationState.workbench,
-		operation.scriptText,
-		setCustomWorkbenchViewData,
-	]);
-	
-	useEffect(() => {
-		if ((base.selectedFiles?.length ?? 0) === 0) {
-			try { base.operation.resetResults(); } catch { /* noop */ }
-			try { clearCustomWorkbenchViewData(VIEW_ID); } catch { /* noop */ }
-			if (navigationState.workbench === WORKBENCH_ID) {
-				try { navigationActions.setWorkbench('fileEditor'); } catch { /* noop */ }
-			}
-			lastShownRef.current = null;
-		}
-	}, [
-		base.selectedFiles?.length,
-		base.operation,
-		clearCustomWorkbenchViewData,
-		navigationActions,
-		navigationState.workbench,
-	]);
+  useEffect(() => {
+    if (operation.scriptText) {
+      setCustomWorkbenchViewData(VIEW_ID, {
+        scriptText: operation.scriptText,
+        downloadUrl: operation.downloadUrl,
+        downloadFilename: operation.downloadFilename,
+      });
+      const marker = operation.scriptText.length;
+      const isNew =
+        lastShownRef.current == null || marker !== lastShownRef.current;
+      if (isNew) {
+        lastShownRef.current = marker;
+        if (
+          navigationState.selectedTool === "showJS" &&
+          navigationState.workbench !== WORKBENCH_ID
+        ) {
+          navigationActions.setWorkbench(WORKBENCH_ID);
+        }
+      }
+    } else {
+      clearCustomWorkbenchViewData(VIEW_ID);
+      lastShownRef.current = null;
+    }
+  }, [
+    clearCustomWorkbenchViewData,
+    navigationActions,
+    navigationState.selectedTool,
+    navigationState.workbench,
+    operation.scriptText,
+    setCustomWorkbenchViewData,
+  ]);
 
-	return createToolFlow({
-		files: {
-			selectedFiles: base.selectedFiles,
-			isCollapsed: false,
-		},
-		steps: [],
-		executeButton: {
-			text: hasResults ? t('back', 'Back') : t('showJS.submit', 'Extract JavaScript'),
-			loadingText: t('loading', 'Loading...'),
-			onClick: hasResults
-				? async () => {
-						// Clear results and deselect files so user can pick another file
-						try {
-							await base.operation.resetResults();
-						} catch { /* noop */ }
-						try {
-							clearSelections();
-						} catch { /* noop */ }
-						// Close the custom JS view and send user back to file manager to pick another file
-						try {
-							clearCustomWorkbenchViewData(VIEW_ID);
-						} catch { /* noop */ }
-						try {
-							navigationActions.setWorkbench('fileEditor');
-						} catch { /* noop */ }
-				  }
-				: base.handleExecute,
-			disabled: hasResults
-				? false
-				: (
-					!base.hasFiles ||
-					(base.selectedFiles?.length ?? 0) !== 1 ||
-					base.operation.isLoading ||
-					base.endpointLoading ||
-					base.endpointEnabled === false
-				),
-			isVisible: true,
-		},
-		review: {
-			isVisible: hasResults,
-			operation: base.operation,
-			title: t('showJS.results', 'Result'),
-			onUndo: undefined,
-		},
-	});
+  useEffect(() => {
+    if ((base.selectedFiles?.length ?? 0) === 0) {
+      try {
+        base.operation.resetResults();
+      } catch {
+        /* noop */
+      }
+      try {
+        clearCustomWorkbenchViewData(VIEW_ID);
+      } catch {
+        /* noop */
+      }
+      if (navigationState.workbench === WORKBENCH_ID) {
+        try {
+          navigationActions.setWorkbench("fileEditor");
+        } catch {
+          /* noop */
+        }
+      }
+      lastShownRef.current = null;
+    }
+  }, [
+    base.selectedFiles?.length,
+    base.operation,
+    clearCustomWorkbenchViewData,
+    navigationActions,
+    navigationState.workbench,
+  ]);
+
+  return createToolFlow({
+    files: {
+      selectedFiles: base.selectedFiles,
+      isCollapsed: false,
+    },
+    steps: [],
+    executeButton: {
+      text: hasResults
+        ? t("back", "Back")
+        : t("showJS.submit", "Extract JavaScript"),
+      loadingText: t("loading", "Loading..."),
+      onClick: hasResults
+        ? async () => {
+            // Clear results and deselect files so user can pick another file
+            try {
+              await base.operation.resetResults();
+            } catch {
+              /* noop */
+            }
+            try {
+              clearSelections();
+            } catch {
+              /* noop */
+            }
+            // Close the custom JS view and send user back to file manager to pick another file
+            try {
+              clearCustomWorkbenchViewData(VIEW_ID);
+            } catch {
+              /* noop */
+            }
+            try {
+              navigationActions.setWorkbench("fileEditor");
+            } catch {
+              /* noop */
+            }
+          }
+        : base.handleExecute,
+      disabled: hasResults
+        ? false
+        : !base.hasFiles ||
+          (base.selectedFiles?.length ?? 0) !== 1 ||
+          base.operation.isLoading ||
+          base.endpointLoading ||
+          base.endpointEnabled === false,
+      isVisible: true,
+    },
+    review: {
+      isVisible: hasResults,
+      operation: base.operation,
+      title: t("showJS.results", "Result"),
+      onUndo: undefined,
+    },
+  });
 };
 
 const ShowJSTool = ShowJS as ToolComponent;
@@ -146,5 +191,3 @@ ShowJSTool.tool = () => useShowJSOperation;
 ShowJSTool.getDefaultParameters = () => ({ ...defaultParameters });
 
 export default ShowJSTool;
-
-
diff --git a/frontend/src/core/tools/Sign.tsx b/frontend/src/core/tools/Sign.tsx
index 0af1f6855c..0e64342506 100644
--- a/frontend/src/core/tools/Sign.tsx
+++ b/frontend/src/core/tools/Sign.tsx
@@ -1,11 +1,11 @@
-import { createStampTool } from '@app/tools/stamp/createStampTool';
+import { createStampTool } from "@app/tools/stamp/createStampTool";
 
 const Sign = createStampTool({
-  toolId: 'sign',
-  translationScope: 'sign',
-  allowedSignatureSources: ['canvas', 'image', 'text', 'saved'],
-  defaultSignatureSource: 'canvas',
-  defaultSignatureType: 'canvas',
+  toolId: "sign",
+  translationScope: "sign",
+  allowedSignatureSources: ["canvas", "image", "text", "saved"],
+  defaultSignatureSource: "canvas",
+  defaultSignatureType: "canvas",
   enableApplyAction: true,
 });
 
diff --git a/frontend/src/core/tools/SingleLargePage.tsx b/frontend/src/core/tools/SingleLargePage.tsx
index 76da9afdde..7f6bfb3ede 100644
--- a/frontend/src/core/tools/SingleLargePage.tsx
+++ b/frontend/src/core/tools/SingleLargePage.tsx
@@ -9,10 +9,10 @@ const SingleLargePage = (props: BaseToolProps) => {
   const { t } = useTranslation();
 
   const base = useBaseTool(
-    'singleLargePage',
+    "singleLargePage",
     useSingleLargePageParameters,
     useSingleLargePageOperation,
-    props
+    props,
   );
 
   return createToolFlow({
diff --git a/frontend/src/core/tools/Split.tsx b/frontend/src/core/tools/Split.tsx
index 6d6313dfd5..3e62028b22 100644
--- a/frontend/src/core/tools/Split.tsx
+++ b/frontend/src/core/tools/Split.tsx
@@ -9,17 +9,22 @@ import { useBaseTool } from "@app/hooks/tools/shared/useBaseTool";
 import { useSplitMethodTips } from "@app/components/tooltips/useSplitMethodTips";
 import { useSplitSettingsTips } from "@app/components/tooltips/useSplitSettingsTips";
 import { BaseToolProps, ToolComponent } from "@app/types/tool";
-import { type SplitMethod, METHOD_OPTIONS, type MethodOption, ENDPOINTS } from "@app/constants/splitConstants";
+import {
+  type SplitMethod,
+  METHOD_OPTIONS,
+  type MethodOption,
+  ENDPOINTS,
+} from "@app/constants/splitConstants";
 import { useMultipleEndpointsEnabled } from "@app/hooks/useEndpointConfig";
 
 const Split = (props: BaseToolProps) => {
   const { t } = useTranslation();
 
   const base = useBaseTool(
-    'split',
+    "split",
     useSplitParameters,
     useSplitOperation,
-    props
+    props,
   );
 
   // Check which split endpoints are available
@@ -28,7 +33,7 @@ const Split = (props: BaseToolProps) => {
 
   // Filter METHOD_OPTIONS to only show methods with enabled endpoints
   const availableMethodOptions = useMemo(() => {
-    return METHOD_OPTIONS.filter(option => {
+    return METHOD_OPTIONS.filter((option) => {
       const endpoint = ENDPOINTS[option.value];
       // If endpoint status is not loaded yet, show all options (optimistic)
       // If endpoint is explicitly disabled (false), hide the option
@@ -41,9 +46,12 @@ const Split = (props: BaseToolProps) => {
 
   // Get the method name for the settings step title
   const getSettingsTitle = () => {
-    if (!base.params.parameters.method) return t("split.steps.settings", "Settings");
+    if (!base.params.parameters.method)
+      return t("split.steps.settings", "Settings");
 
-    const methodOption = METHOD_OPTIONS.find(option => option.value === base.params.parameters.method);
+    const methodOption = METHOD_OPTIONS.find(
+      (option) => option.value === base.params.parameters.method,
+    );
     if (!methodOption) return t("split.steps.settings", "Settings");
 
     const prefix = t(methodOption.prefixKey, "Split by");
@@ -60,12 +68,12 @@ const Split = (props: BaseToolProps) => {
       {
         title: t("split.steps.chooseMethod", "Choose Method"),
         isCollapsed: !!base.params.parameters.method, // Collapse when method is selected
-        onCollapsedClick: () => base.params.updateParameter('method', null),
+        onCollapsedClick: () => base.params.updateParameter("method", null),
         tooltip: methodTips,
         content: (
           <CardSelector<SplitMethod, MethodOption>
             options={availableMethodOptions}
-            onSelect={(method) => base.params.updateParameter('method', method)}
+            onSelect={(method) => base.params.updateParameter("method", method)}
             disabled={base.endpointLoading}
           />
         ),
@@ -73,7 +81,9 @@ const Split = (props: BaseToolProps) => {
       {
         title: getSettingsTitle(),
         isCollapsed: !base.params.parameters.method, // Collapsed until method selected
-        onCollapsedClick: base.hasResults ? base.handleSettingsReset : undefined,
+        onCollapsedClick: base.hasResults
+          ? base.handleSettingsReset
+          : undefined,
         tooltip: settingsTips || undefined,
         content: (
           <SplitSettings
diff --git a/frontend/src/core/tools/SwaggerUI.tsx b/frontend/src/core/tools/SwaggerUI.tsx
index c860ed93fb..08a878b4c5 100644
--- a/frontend/src/core/tools/SwaggerUI.tsx
+++ b/frontend/src/core/tools/SwaggerUI.tsx
@@ -13,7 +13,11 @@ const SwaggerUI: React.FC<BaseToolProps> = () => {
       <p>Opening Swagger UI in a new tab...</p>
       <p>
         If it didn't open automatically,{" "}
-        <a href={withBasePath("/swagger-ui/5.21.0/index.html")} target="_blank" rel="noopener noreferrer">
+        <a
+          href={withBasePath("/swagger-ui/5.21.0/index.html")}
+          target="_blank"
+          rel="noopener noreferrer"
+        >
           click here
         </a>
       </p>
diff --git a/frontend/src/core/tools/TimestampPdf.tsx b/frontend/src/core/tools/TimestampPdf.tsx
index 0544529880..2ef61ad092 100644
--- a/frontend/src/core/tools/TimestampPdf.tsx
+++ b/frontend/src/core/tools/TimestampPdf.tsx
@@ -13,7 +13,7 @@ const TimestampPdf = (props: BaseToolProps) => {
     "timestampPdf",
     useTimestampPdfParameters,
     useTimestampPdfOperation,
-    props
+    props,
   );
 
   return createToolFlow({
@@ -25,7 +25,9 @@ const TimestampPdf = (props: BaseToolProps) => {
       {
         title: t("timestampPdf.steps.settings", "Settings"),
         isCollapsed: base.settingsCollapsed,
-        onCollapsedClick: base.settingsCollapsed ? base.handleSettingsReset : undefined,
+        onCollapsedClick: base.settingsCollapsed
+          ? base.handleSettingsReset
+          : undefined,
         content: (
           <TimestampPdfSettings
             parameters={base.params.parameters}
diff --git a/frontend/src/core/tools/UnlockPdfForms.tsx b/frontend/src/core/tools/UnlockPdfForms.tsx
index b1b562c72f..1cb901a356 100644
--- a/frontend/src/core/tools/UnlockPdfForms.tsx
+++ b/frontend/src/core/tools/UnlockPdfForms.tsx
@@ -9,10 +9,10 @@ const UnlockPdfForms = (props: BaseToolProps) => {
   const { t } = useTranslation();
 
   const base = useBaseTool(
-    'unlockPdfForms',
+    "unlockPdfForms",
     useUnlockPdfFormsParameters,
     useUnlockPdfFormsOperation,
-    props
+    props,
   );
 
   return createToolFlow({
diff --git a/frontend/src/core/tools/ValidateSignature.tsx b/frontend/src/core/tools/ValidateSignature.tsx
index 52cd5592e0..5b62d8bd7a 100644
--- a/frontend/src/core/tools/ValidateSignature.tsx
+++ b/frontend/src/core/tools/ValidateSignature.tsx
@@ -1,17 +1,26 @@
-import { useEffect, useMemo, useRef } from 'react';
-import { useTranslation } from 'react-i18next';
-import PictureAsPdfIcon from '@mui/icons-material/PictureAsPdf';
-import { createToolFlow } from '@app/components/tools/shared/createToolFlow';
-import { useBaseTool } from '@app/hooks/tools/shared/useBaseTool';
-import { BaseToolProps, ToolComponent } from '@app/types/tool';
-import { useValidateSignatureParameters, defaultParameters } from '@app/hooks/tools/validateSignature/useValidateSignatureParameters';
-import ValidateSignatureSettings from '@app/components/tools/validateSignature/ValidateSignatureSettings';
-import ValidateSignatureResults from '@app/components/tools/validateSignature/ValidateSignatureResults';
-import { useValidateSignatureOperation, ValidateSignatureOperationHook } from '@app/hooks/tools/validateSignature/useValidateSignatureOperation';
-import ValidateSignatureReportView from '@app/components/tools/validateSignature/ValidateSignatureReportView';
-import { useToolWorkflow } from '@app/contexts/ToolWorkflowContext';
-import { useNavigationActions, useNavigationState } from '@app/contexts/NavigationContext';
-import type { SignatureValidationReportData } from '@app/types/validateSignature';
+import { useEffect, useMemo, useRef } from "react";
+import { useTranslation } from "react-i18next";
+import PictureAsPdfIcon from "@mui/icons-material/PictureAsPdf";
+import { createToolFlow } from "@app/components/tools/shared/createToolFlow";
+import { useBaseTool } from "@app/hooks/tools/shared/useBaseTool";
+import { BaseToolProps, ToolComponent } from "@app/types/tool";
+import {
+  useValidateSignatureParameters,
+  defaultParameters,
+} from "@app/hooks/tools/validateSignature/useValidateSignatureParameters";
+import ValidateSignatureSettings from "@app/components/tools/validateSignature/ValidateSignatureSettings";
+import ValidateSignatureResults from "@app/components/tools/validateSignature/ValidateSignatureResults";
+import {
+  useValidateSignatureOperation,
+  ValidateSignatureOperationHook,
+} from "@app/hooks/tools/validateSignature/useValidateSignatureOperation";
+import ValidateSignatureReportView from "@app/components/tools/validateSignature/ValidateSignatureReportView";
+import { useToolWorkflow } from "@app/contexts/ToolWorkflowContext";
+import {
+  useNavigationActions,
+  useNavigationState,
+} from "@app/contexts/NavigationContext";
+import type { SignatureValidationReportData } from "@app/types/validateSignature";
 
 const ValidateSignature = (props: BaseToolProps) => {
   const { t } = useTranslation();
@@ -24,28 +33,27 @@ const ValidateSignature = (props: BaseToolProps) => {
     clearCustomWorkbenchViewData,
   } = useToolWorkflow();
 
-  const REPORT_VIEW_ID = 'validateSignatureReport';
-  const REPORT_WORKBENCH_ID = 'custom:validateSignatureReport' as const;
+  const REPORT_VIEW_ID = "validateSignatureReport";
+  const REPORT_WORKBENCH_ID = "custom:validateSignatureReport" as const;
   const reportIcon = useMemo(() => <PictureAsPdfIcon fontSize="small" />, []);
 
   const base = useBaseTool(
-    'validateSignature',
+    "validateSignature",
     useValidateSignatureParameters,
     useValidateSignatureOperation,
-    props
+    props,
   );
 
   const operation = base.operation as ValidateSignatureOperationHook;
   const hasResults = operation.results.length > 0;
-  const showResultsStep = hasResults || base.operation.isLoading || !!base.operation.errorMessage;
-
-
+  const showResultsStep =
+    hasResults || base.operation.isLoading || !!base.operation.errorMessage;
 
   useEffect(() => {
     registerCustomWorkbenchView({
       id: REPORT_VIEW_ID,
       workbenchId: REPORT_WORKBENCH_ID,
-      label: t('validateSignature.report.shortTitle', 'Signature Report'),
+      label: t("validateSignature.report.shortTitle", "Signature Report"),
       icon: reportIcon,
       component: ValidateSignatureReportView,
     });
@@ -84,11 +92,15 @@ const ValidateSignature = (props: BaseToolProps) => {
       setCustomWorkbenchViewData(REPORT_VIEW_ID, reportData);
 
       const generatedAt = reportData.generatedAt ?? null;
-      const isNewReport = generatedAt && generatedAt !== lastReportGeneratedAtRef.current;
+      const isNewReport =
+        generatedAt && generatedAt !== lastReportGeneratedAtRef.current;
 
       if (isNewReport) {
         lastReportGeneratedAtRef.current = generatedAt;
-        if (navigationState.selectedTool === 'validateSignature' && navigationState.workbench !== REPORT_WORKBENCH_ID) {
+        if (
+          navigationState.selectedTool === "validateSignature" &&
+          navigationState.workbench !== REPORT_WORKBENCH_ID
+        ) {
           navigationActions.setWorkbench(REPORT_WORKBENCH_ID);
         }
       }
@@ -112,9 +124,11 @@ const ValidateSignature = (props: BaseToolProps) => {
     },
     steps: [
       {
-        title: t('validateSignature.settings.title', 'Validation Settings'),
+        title: t("validateSignature.settings.title", "Validation Settings"),
         isCollapsed: base.settingsCollapsed,
-        onCollapsedClick: base.settingsCollapsed ? base.handleSettingsReset : undefined,
+        onCollapsedClick: base.settingsCollapsed
+          ? base.handleSettingsReset
+          : undefined,
         content: (
           <ValidateSignatureSettings
             parameters={base.params.parameters}
@@ -124,7 +138,7 @@ const ValidateSignature = (props: BaseToolProps) => {
         ),
       },
       {
-        title: t('validateSignature.results', 'Validation Results'),
+        title: t("validateSignature.results", "Validation Results"),
         isVisible: showResultsStep,
         isCollapsed: false,
         content: (
@@ -139,8 +153,8 @@ const ValidateSignature = (props: BaseToolProps) => {
       },
     ],
     executeButton: {
-      text: t('validateSignature.submit', 'Validate Signatures'),
-      loadingText: t('loading', 'Loading...'),
+      text: t("validateSignature.submit", "Validate Signatures"),
+      loadingText: t("loading", "Loading..."),
       onClick: base.handleExecute,
       endpointEnabled: base.endpointEnabled,
       paramsValid: base.params.validateParameters(),
@@ -149,7 +163,7 @@ const ValidateSignature = (props: BaseToolProps) => {
     review: {
       isVisible: false,
       operation: base.operation,
-      title: t('validateSignature.results', 'Validation Results'),
+      title: t("validateSignature.results", "Validation Results"),
       onUndo: base.handleUndo,
     },
   });
diff --git a/frontend/src/core/tools/annotate/AnnotationPanel.tsx b/frontend/src/core/tools/annotate/AnnotationPanel.tsx
index 1c71973a23..eead603035 100644
--- a/frontend/src/core/tools/annotate/AnnotationPanel.tsx
+++ b/frontend/src/core/tools/annotate/AnnotationPanel.tsx
@@ -1,16 +1,35 @@
-import { useMemo, useState } from 'react';
-import type React from 'react';
-import { useTranslation } from 'react-i18next';
-import { Text, Group, ActionIcon, Stack, Slider, Box, Tooltip as MantineTooltip, Button, Tooltip, Paper } from '@mantine/core';
-import LocalIcon from '@app/components/shared/LocalIcon';
-import { ColorPicker, ColorSwatchButton } from '@app/components/annotation/shared/ColorPicker';
-import { ImageUploader } from '@app/components/annotation/shared/ImageUploader';
-import { SuggestedToolsSection } from '@app/components/tools/shared/SuggestedToolsSection';
-import { DrawingControls } from '@app/components/annotation/shared/DrawingControls';
-import type { AnnotationToolId, AnnotationAPI, SignatureAPI, AnnotationObject } from '@app/components/viewer/viewerTypes';
-import type { ViewerContextType } from '@app/contexts/ViewerContext';
-import type { SignParameters } from '@app/hooks/tools/sign/useSignParameters';
-import type { BuildToolOptionsExtras } from '@app/tools/annotate/useAnnotationStyleState';
+import { useMemo, useState } from "react";
+import type React from "react";
+import { useTranslation } from "react-i18next";
+import {
+  Text,
+  Group,
+  ActionIcon,
+  Stack,
+  Slider,
+  Box,
+  Tooltip as MantineTooltip,
+  Button,
+  Tooltip,
+  Paper,
+} from "@mantine/core";
+import LocalIcon from "@app/components/shared/LocalIcon";
+import {
+  ColorPicker,
+  ColorSwatchButton,
+} from "@app/components/annotation/shared/ColorPicker";
+import { ImageUploader } from "@app/components/annotation/shared/ImageUploader";
+import { SuggestedToolsSection } from "@app/components/tools/shared/SuggestedToolsSection";
+import { DrawingControls } from "@app/components/annotation/shared/DrawingControls";
+import type {
+  AnnotationToolId,
+  AnnotationAPI,
+  SignatureAPI,
+  AnnotationObject,
+} from "@app/components/viewer/viewerTypes";
+import type { ViewerContextType } from "@app/contexts/ViewerContext";
+import type { SignParameters } from "@app/hooks/tools/sign/useSignParameters";
+import type { BuildToolOptionsExtras } from "@app/tools/annotate/useAnnotationStyleState";
 
 interface StyleState {
   inkColor: string;
@@ -26,7 +45,7 @@ interface StyleState {
   squigglyOpacity: number;
   textColor: string;
   textSize: number;
-  textAlignment: 'left' | 'center' | 'right';
+  textAlignment: "left" | "center" | "right";
   textBackgroundColor: string;
   noteBackgroundColor: string;
   shapeStrokeColor: string;
@@ -51,7 +70,7 @@ interface StyleActions {
   setSquigglyOpacity: (value: number) => void;
   setTextColor: (value: string) => void;
   setTextSize: (value: number) => void;
-  setTextAlignment: (value: 'left' | 'center' | 'right') => void;
+  setTextAlignment: (value: "left" | "center" | "right") => void;
   setTextBackgroundColor: (value: string) => void;
   setNoteBackgroundColor: (value: string) => void;
   setShapeStrokeColor: (value: string) => void;
@@ -62,20 +81,23 @@ interface StyleActions {
   setShapeThickness: (value: number) => void;
 }
 
-type BuildToolOptionsFn = (toolId: AnnotationToolId, extras?: BuildToolOptionsExtras) => Record<string, unknown>;
+type BuildToolOptionsFn = (
+  toolId: AnnotationToolId,
+  extras?: BuildToolOptionsExtras,
+) => Record<string, unknown>;
 
 type ColorTarget =
-  | 'ink'
-  | 'highlight'
-  | 'inkHighlighter'
-  | 'underline'
-  | 'strikeout'
-  | 'squiggly'
-  | 'text'
-  | 'textBackground'
-  | 'noteBackground'
-  | 'shapeStroke'
-  | 'shapeFill'
+  | "ink"
+  | "highlight"
+  | "inkHighlighter"
+  | "underline"
+  | "strikeout"
+  | "squiggly"
+  | "text"
+  | "textBackground"
+  | "noteBackground"
+  | "shapeStroke"
+  | "shapeFill"
   | null;
 
 interface AnnotationPanelProps {
@@ -85,7 +107,9 @@ interface AnnotationPanelProps {
   styleActions: StyleActions;
   getActiveColor: (tool: AnnotationToolId) => string;
   buildToolOptions: BuildToolOptionsFn;
-  deriveToolFromAnnotation: (annotation: AnnotationObject | null | undefined) => AnnotationToolId | undefined;
+  deriveToolFromAnnotation: (
+    annotation: AnnotationObject | null | undefined,
+  ) => AnnotationToolId | undefined;
   selectedAnn: { object: AnnotationObject } | null;
   selectedTextDraft: string;
   setSelectedTextDraft: (text: string) => void;
@@ -96,12 +120,16 @@ interface AnnotationPanelProps {
   viewerContext: ViewerContextType | null;
   setPlacementMode: (value: boolean) => void;
   setSignatureConfig: (config: SignParameters | null) => void;
-  computeStampDisplaySize: (natural: { width: number; height: number } | null) => { width: number; height: number };
+  computeStampDisplaySize: (
+    natural: { width: number; height: number } | null,
+  ) => { width: number; height: number };
   stampImageData?: string;
   setStampImageData: (value: string | undefined) => void;
   stampImageSize: { width: number; height: number } | null;
   setStampImageSize: (value: { width: number; height: number } | null) => void;
-  setPlacementPreviewSize: (value: { width: number; height: number } | null) => void;
+  setPlacementPreviewSize: (
+    value: { width: number; height: number } | null,
+  ) => void;
   undo: () => void;
   redo: () => void;
   historyAvailability: { canUndo: boolean; canRedo: boolean };
@@ -190,48 +218,118 @@ export function AnnotationPanel(props: AnnotationPanelProps) {
     setShapeThickness,
   } = styleActions;
 
-  const textMarkupTools: { id: AnnotationToolId; label: string; icon: string }[] = [
-    { id: 'highlight', label: t('annotation.highlight', 'Highlight'), icon: 'highlight' },
-    { id: 'underline', label: t('annotation.underline', 'Underline'), icon: 'format-underlined' },
-    { id: 'strikeout', label: t('annotation.strikeout', 'Strikeout'), icon: 'strikethrough-s' },
-    { id: 'squiggly', label: t('annotation.squiggly', 'Squiggly'), icon: 'show-chart' },
+  const textMarkupTools: {
+    id: AnnotationToolId;
+    label: string;
+    icon: string;
+  }[] = [
+    {
+      id: "highlight",
+      label: t("annotation.highlight", "Highlight"),
+      icon: "highlight",
+    },
+    {
+      id: "underline",
+      label: t("annotation.underline", "Underline"),
+      icon: "format-underlined",
+    },
+    {
+      id: "strikeout",
+      label: t("annotation.strikeout", "Strikeout"),
+      icon: "strikethrough-s",
+    },
+    {
+      id: "squiggly",
+      label: t("annotation.squiggly", "Squiggly"),
+      icon: "show-chart",
+    },
   ];
 
-  const drawingTools: { id: AnnotationToolId; label: string; icon: string }[] = [
-    { id: 'ink', label: t('annotation.pen', 'Pen'), icon: 'edit' },
-    { id: 'inkHighlighter', label: t('annotation.freehandHighlighter', 'Freehand Highlighter'), icon: 'brush' },
-  ];
+  const drawingTools: { id: AnnotationToolId; label: string; icon: string }[] =
+    [
+      { id: "ink", label: t("annotation.pen", "Pen"), icon: "edit" },
+      {
+        id: "inkHighlighter",
+        label: t("annotation.freehandHighlighter", "Freehand Highlighter"),
+        icon: "brush",
+      },
+    ];
 
   const shapeTools: { id: AnnotationToolId; label: string; icon: string }[] = [
-    { id: 'square', label: t('annotation.square', 'Square'), icon: 'crop-square' },
-    { id: 'circle', label: t('annotation.circle', 'Circle'), icon: 'radio-button-unchecked' },
-    { id: 'line', label: t('annotation.line', 'Line'), icon: 'show-chart' },
-    { id: 'polygon', label: t('annotation.polygon', 'Polygon'), icon: 'change-history' },
+    {
+      id: "square",
+      label: t("annotation.square", "Square"),
+      icon: "crop-square",
+    },
+    {
+      id: "circle",
+      label: t("annotation.circle", "Circle"),
+      icon: "radio-button-unchecked",
+    },
+    { id: "line", label: t("annotation.line", "Line"), icon: "show-chart" },
+    {
+      id: "polygon",
+      label: t("annotation.polygon", "Polygon"),
+      icon: "change-history",
+    },
   ];
 
-  const commentTools: { id: AnnotationToolId; label: string; icon: string }[] = [
-    { id: 'textComment', label: t('annotation.comment', 'Comment'), icon: 'comment' },
-    { id: 'insertText', label: t('annotation.insertText', 'Insert Text'), icon: 'add-comment' },
-    { id: 'replaceText', label: t('annotation.replaceText', 'Replace Text'), icon: 'find-replace' },
-  ];
+  const commentTools: { id: AnnotationToolId; label: string; icon: string }[] =
+    [
+      {
+        id: "textComment",
+        label: t("annotation.comment", "Comment"),
+        icon: "comment",
+      },
+      {
+        id: "insertText",
+        label: t("annotation.insertText", "Insert Text"),
+        icon: "add-comment",
+      },
+      {
+        id: "replaceText",
+        label: t("annotation.replaceText", "Replace Text"),
+        icon: "find-replace",
+      },
+    ];
 
   const otherTools: { id: AnnotationToolId; label: string; icon: string }[] = [
-    { id: 'text', label: t('annotation.text', 'Text box'), icon: 'text-fields' },
-    { id: 'note', label: t('annotation.note', 'Note'), icon: 'sticky-note-2' },
-    { id: 'stamp', label: t('annotation.stamp', 'Add Image'), icon: 'add-photo-alternate' },
+    {
+      id: "text",
+      label: t("annotation.text", "Text box"),
+      icon: "text-fields",
+    },
+    { id: "note", label: t("annotation.note", "Note"), icon: "sticky-note-2" },
+    {
+      id: "stamp",
+      label: t("annotation.stamp", "Add Image"),
+      icon: "add-photo-alternate",
+    },
   ];
 
-  const activeColor = useMemo(() => colorPickerTarget ? getActiveColor(colorPickerTarget as AnnotationToolId) : '#000000', [colorPickerTarget, getActiveColor]);
+  const activeColor = useMemo(
+    () =>
+      colorPickerTarget
+        ? getActiveColor(colorPickerTarget as AnnotationToolId)
+        : "#000000",
+    [colorPickerTarget, getActiveColor],
+  );
 
   const annotationsVisible = viewerContext?.isAnnotationsVisible ?? true;
 
-  const renderToolButtons = (tools: { id: AnnotationToolId; label: string; icon: string }[]) => (
+  const renderToolButtons = (
+    tools: { id: AnnotationToolId; label: string; icon: string }[],
+  ) => (
     <Group gap="xs">
       {tools.map((tool) => (
         <MantineTooltip key={tool.id} label={tool.label} withArrow>
           <ActionIcon
-            variant={activeTool === tool.id && annotationsVisible ? 'filled' : 'subtle'}
-            color={activeTool === tool.id && annotationsVisible ? 'blue' : undefined}
+            variant={
+              activeTool === tool.id && annotationsVisible ? "filled" : "subtle"
+            }
+            color={
+              activeTool === tool.id && annotationsVisible ? "blue" : undefined
+            }
             radius="md"
             onClick={() => activateAnnotationTool(tool.id)}
             disabled={!annotationsVisible}
@@ -247,30 +345,46 @@ export function AnnotationPanel(props: AnnotationPanelProps) {
   const defaultStyleControls = (
     <Paper withBorder p="sm" radius="md">
       <Stack gap="sm">
-        {activeTool === 'select' ? (
+        {activeTool === "select" ? (
           <>
-            <Text size="sm" fw={600}>{t('annotation.selectAndMove', 'Select and Edit')}</Text>
+            <Text size="sm" fw={600}>
+              {t("annotation.selectAndMove", "Select and Edit")}
+            </Text>
             <Text size="xs" c="dimmed">
-              {t('annotation.editSelectDescription', 'Click an existing annotation to edit its color, opacity, text, or size.')}
+              {t(
+                "annotation.editSelectDescription",
+                "Click an existing annotation to edit its color, opacity, text, or size.",
+              )}
             </Text>
           </>
-        ) : activeTool === 'stamp' ? (
+        ) : activeTool === "stamp" ? (
           <>
-            <Text size="sm" fw={600}>{t('annotation.stampSettings', 'Stamp Settings')}</Text>
+            <Text size="sm" fw={600}>
+              {t("annotation.stampSettings", "Stamp Settings")}
+            </Text>
             <ImageUploader
               onImageChange={async (file) => {
                 if (file) {
                   try {
-                    const dataUrl: string = await new Promise((resolve, reject) => {
-                      const reader = new FileReader();
-                      reader.onload = () => resolve(reader.result as string);
-                      reader.onerror = reject;
-                      reader.readAsDataURL(file);
-                    });
+                    const dataUrl: string = await new Promise(
+                      (resolve, reject) => {
+                        const reader = new FileReader();
+                        reader.onload = () => resolve(reader.result as string);
+                        reader.onerror = reject;
+                        reader.readAsDataURL(file);
+                      },
+                    );
 
-                    const naturalSize = await new Promise<{ width: number; height: number } | null>((resolve) => {
+                    const naturalSize = await new Promise<{
+                      width: number;
+                      height: number;
+                    } | null>((resolve) => {
                       const img = new Image();
-                      img.onload = () => resolve({ width: img.naturalWidth || img.width, height: img.naturalHeight || img.height });
+                      img.onload = () =>
+                        resolve({
+                          width: img.naturalWidth || img.width,
+                          height: img.naturalHeight || img.height,
+                        });
                       img.onerror = () => resolve(null);
                       img.src = dataUrl;
                     });
@@ -281,22 +395,28 @@ export function AnnotationPanel(props: AnnotationPanelProps) {
                     setPlacementPreviewSize(displaySize);
 
                     setSignatureConfig({
-                      signatureType: 'image',
+                      signatureType: "image",
                       signatureData: dataUrl,
                     });
 
                     setTimeout(() => {
                       viewerContext?.setAnnotationMode(true);
                       setPlacementMode(true);
-                      const stampOptions = buildToolOptions('stamp', {
+                      const stampOptions = buildToolOptions("stamp", {
                         stampImageData: dataUrl,
                         stampImageSize: displaySize,
                       });
-                        annotationApiRef?.current?.setAnnotationStyle?.('stamp', stampOptions);
-                        annotationApiRef?.current?.activateAnnotationTool?.('stamp', stampOptions);
+                      annotationApiRef?.current?.setAnnotationStyle?.(
+                        "stamp",
+                        stampOptions,
+                      );
+                      annotationApiRef?.current?.activateAnnotationTool?.(
+                        "stamp",
+                        stampOptions,
+                      );
                     }, 150);
                   } catch (err) {
-                    console.error('Failed to load stamp image', err);
+                    console.error("Failed to load stamp image", err);
                   }
                 } else {
                   setStampImageData(undefined);
@@ -310,71 +430,94 @@ export function AnnotationPanel(props: AnnotationPanelProps) {
             />
             {stampImageData && (
               <Stack gap="xs">
-                <Text size="xs" c="dimmed">{t('annotation.imagePreview', 'Preview')}</Text>
+                <Text size="xs" c="dimmed">
+                  {t("annotation.imagePreview", "Preview")}
+                </Text>
                 <img
                   src={stampImageData}
                   alt="Stamp preview"
-                  style={{ maxWidth: '100%', maxHeight: '150px', objectFit: 'contain', border: '1px solid #ccc', borderRadius: '4px' }}
+                  style={{
+                    maxWidth: "100%",
+                    maxHeight: "150px",
+                    objectFit: "contain",
+                    border: "1px solid #ccc",
+                    borderRadius: "4px",
+                  }}
                 />
               </Stack>
             )}
           </>
         ) : (
           <>
-            <Text size="sm" fw={600}>{t('annotation.settings', 'Settings')}</Text>
+            <Text size="sm" fw={600}>
+              {t("annotation.settings", "Settings")}
+            </Text>
             <Group gap="md">
               <Stack gap={4} align="center">
                 <Text size="xs" c="dimmed">
-                  {['square', 'circle', 'polygon'].includes(activeTool)
-                    ? t('annotation.strokeColor', 'Stroke Color')
-                    : t('annotation.color', 'Color')
-                  }
+                  {["square", "circle", "polygon"].includes(activeTool)
+                    ? t("annotation.strokeColor", "Stroke Color")
+                    : t("annotation.color", "Color")}
                 </Text>
                 <ColorSwatchButton
                   color={
-                    activeTool === 'ink'
+                    activeTool === "ink"
                       ? inkColor
-                      : activeTool === 'highlight' || activeTool === 'inkHighlighter'
+                      : activeTool === "highlight" ||
+                          activeTool === "inkHighlighter"
                         ? highlightColor
-                        : activeTool === 'underline'
+                        : activeTool === "underline"
                           ? underlineColor
-                          : activeTool === 'strikeout'
+                          : activeTool === "strikeout"
                             ? strikeoutColor
-                            : activeTool === 'squiggly'
+                            : activeTool === "squiggly"
                               ? squigglyColor
-                              : ['square', 'circle', 'line', 'polygon'].includes(activeTool)
+                              : [
+                                    "square",
+                                    "circle",
+                                    "line",
+                                    "polygon",
+                                  ].includes(activeTool)
                                 ? shapeStrokeColor
                                 : textColor
                   }
                   size={30}
                   onClick={() => {
                     const target: ColorTarget =
-                      activeTool === 'ink'
-                        ? 'ink'
-                        : activeTool === 'highlight' || activeTool === 'inkHighlighter'
-                          ? 'highlight'
-                          : activeTool === 'underline'
-                            ? 'underline'
-                            : activeTool === 'strikeout'
-                              ? 'strikeout'
-                              : activeTool === 'squiggly'
-                                ? 'squiggly'
-                                : ['square', 'circle', 'line', 'polygon'].includes(activeTool)
-                                  ? 'shapeStroke'
-                                  : 'text';
+                      activeTool === "ink"
+                        ? "ink"
+                        : activeTool === "highlight" ||
+                            activeTool === "inkHighlighter"
+                          ? "highlight"
+                          : activeTool === "underline"
+                            ? "underline"
+                            : activeTool === "strikeout"
+                              ? "strikeout"
+                              : activeTool === "squiggly"
+                                ? "squiggly"
+                                : [
+                                      "square",
+                                      "circle",
+                                      "line",
+                                      "polygon",
+                                    ].includes(activeTool)
+                                  ? "shapeStroke"
+                                  : "text";
                     setColorPickerTarget(target);
                     setIsColorPickerOpen(true);
                   }}
                 />
               </Stack>
-              {['square', 'circle', 'polygon'].includes(activeTool) && (
+              {["square", "circle", "polygon"].includes(activeTool) && (
                 <Stack gap={4} align="center">
-                  <Text size="xs" c="dimmed">{t('annotation.fillColor', 'Fill Color')}</Text>
+                  <Text size="xs" c="dimmed">
+                    {t("annotation.fillColor", "Fill Color")}
+                  </Text>
                   <ColorSwatchButton
                     color={shapeFillColor}
                     size={30}
                     onClick={() => {
-                      setColorPickerTarget('shapeFill');
+                      setColorPickerTarget("shapeFill");
                       setIsColorPickerOpen(true);
                     }}
                   />
@@ -382,136 +525,217 @@ export function AnnotationPanel(props: AnnotationPanelProps) {
               )}
             </Group>
 
-            {activeTool === 'ink' && (
+            {activeTool === "ink" && (
               <Box>
-                <Text size="xs" c="dimmed" mb={4}>{t('annotation.strokeWidth', 'Width')}</Text>
-                <Slider min={1} max={12} value={inkWidth} onChange={setInkWidth} />
+                <Text size="xs" c="dimmed" mb={4}>
+                  {t("annotation.strokeWidth", "Width")}
+                </Text>
+                <Slider
+                  min={1}
+                  max={12}
+                  value={inkWidth}
+                  onChange={setInkWidth}
+                />
               </Box>
             )}
 
-            {(activeTool === 'highlight' || activeTool === 'inkHighlighter') && (
+            {(activeTool === "highlight" ||
+              activeTool === "inkHighlighter") && (
               <Box>
-                <Text size="xs" c="dimmed" mb={4}>{t('annotation.opacity', 'Opacity')}</Text>
-                <Slider min={10} max={100} value={highlightOpacity} onChange={setHighlightOpacity} />
+                <Text size="xs" c="dimmed" mb={4}>
+                  {t("annotation.opacity", "Opacity")}
+                </Text>
+                <Slider
+                  min={10}
+                  max={100}
+                  value={highlightOpacity}
+                  onChange={setHighlightOpacity}
+                />
               </Box>
             )}
 
-            {activeTool === 'underline' && (
+            {activeTool === "underline" && (
               <Box>
-                <Text size="xs" c="dimmed" mb={4}>{t('annotation.opacity', 'Opacity')}</Text>
-                <Slider min={10} max={100} value={underlineOpacity} onChange={setUnderlineOpacity} />
+                <Text size="xs" c="dimmed" mb={4}>
+                  {t("annotation.opacity", "Opacity")}
+                </Text>
+                <Slider
+                  min={10}
+                  max={100}
+                  value={underlineOpacity}
+                  onChange={setUnderlineOpacity}
+                />
               </Box>
             )}
 
-            {activeTool === 'inkHighlighter' && (
+            {activeTool === "inkHighlighter" && (
               <Box>
-                <Text size="xs" c="dimmed" mb={4}>{t('annotation.strokeWidth', 'Width')}</Text>
-                <Slider min={1} max={20} value={freehandHighlighterWidth} onChange={setFreehandHighlighterWidth} />
+                <Text size="xs" c="dimmed" mb={4}>
+                  {t("annotation.strokeWidth", "Width")}
+                </Text>
+                <Slider
+                  min={1}
+                  max={20}
+                  value={freehandHighlighterWidth}
+                  onChange={setFreehandHighlighterWidth}
+                />
               </Box>
             )}
 
-            {activeTool === 'text' && (
+            {activeTool === "text" && (
               <>
                 <Box>
-                  <Text size="xs" c="dimmed" mb={4}>{t('annotation.fontSize', 'Font size')}</Text>
-                  <Slider min={8} max={32} value={textSize} onChange={setTextSize} />
+                  <Text size="xs" c="dimmed" mb={4}>
+                    {t("annotation.fontSize", "Font size")}
+                  </Text>
+                  <Slider
+                    min={8}
+                    max={32}
+                    value={textSize}
+                    onChange={setTextSize}
+                  />
                 </Box>
                 <Box>
-                  <Text size="xs" c="dimmed" mb={4}>{t('annotation.textAlignment', 'Text Alignment')}</Text>
+                  <Text size="xs" c="dimmed" mb={4}>
+                    {t("annotation.textAlignment", "Text Alignment")}
+                  </Text>
                   <Group gap="xs">
                     <ActionIcon
-                      variant={textAlignment === 'left' ? 'filled' : 'default'}
-                      onClick={() => setTextAlignment('left')}
+                      variant={textAlignment === "left" ? "filled" : "default"}
+                      onClick={() => setTextAlignment("left")}
                       size="md"
                     >
-                      <LocalIcon icon="format-align-left" width={18} height={18} />
+                      <LocalIcon
+                        icon="format-align-left"
+                        width={18}
+                        height={18}
+                      />
                     </ActionIcon>
                     <ActionIcon
-                      variant={textAlignment === 'center' ? 'filled' : 'default'}
-                      onClick={() => setTextAlignment('center')}
+                      variant={
+                        textAlignment === "center" ? "filled" : "default"
+                      }
+                      onClick={() => setTextAlignment("center")}
                       size="md"
                     >
-                      <LocalIcon icon="format-align-center" width={18} height={18} />
+                      <LocalIcon
+                        icon="format-align-center"
+                        width={18}
+                        height={18}
+                      />
                     </ActionIcon>
                     <ActionIcon
-                      variant={textAlignment === 'right' ? 'filled' : 'default'}
-                      onClick={() => setTextAlignment('right')}
+                      variant={textAlignment === "right" ? "filled" : "default"}
+                      onClick={() => setTextAlignment("right")}
                       size="md"
                     >
-                      <LocalIcon icon="format-align-right" width={18} height={18} />
+                      <LocalIcon
+                        icon="format-align-right"
+                        width={18}
+                        height={18}
+                      />
                     </ActionIcon>
                   </Group>
                 </Box>
                 <Box>
-                  <Text size="xs" c="dimmed" mb={4}>{t('annotation.backgroundColor', 'Background color')}</Text>
+                  <Text size="xs" c="dimmed" mb={4}>
+                    {t("annotation.backgroundColor", "Background color")}
+                  </Text>
                   <Group gap="xs" align="center">
                     <ColorSwatchButton
-                      color={textBackgroundColor || '#ffffff'}
+                      color={textBackgroundColor || "#ffffff"}
                       size={30}
                       onClick={() => {
-                        setColorPickerTarget('textBackground');
+                        setColorPickerTarget("textBackground");
                         setIsColorPickerOpen(true);
                       }}
                     />
                     <Button
                       size="xs"
-                      variant={textBackgroundColor ? 'light' : 'default'}
+                      variant={textBackgroundColor ? "light" : "default"}
                       onClick={() => {
-                        setTextBackgroundColor('');
-                        annotationApiRef?.current?.setAnnotationStyle?.('text', buildToolOptions('text'));
-                        if (selectedAnn?.object?.type === 3 && deriveToolFromAnnotation(selectedAnn.object) !== 'note') {
+                        setTextBackgroundColor("");
+                        annotationApiRef?.current?.setAnnotationStyle?.(
+                          "text",
+                          buildToolOptions("text"),
+                        );
+                        if (
+                          selectedAnn?.object?.type === 3 &&
+                          deriveToolFromAnnotation(selectedAnn.object) !==
+                            "note"
+                        ) {
                           annotationApiRef?.current?.updateAnnotation?.(
                             selectedAnn.object?.pageIndex ?? 0,
                             selectedAnn.object.id as string,
-                            { backgroundColor: 'transparent', fillColor: 'transparent' }
+                            {
+                              backgroundColor: "transparent",
+                              fillColor: "transparent",
+                            },
                           );
                         }
                       }}
                     >
-                      {textBackgroundColor ? t('annotation.clearBackground', 'Remove background') : t('annotation.noBackground', 'No background')}
+                      {textBackgroundColor
+                        ? t("annotation.clearBackground", "Remove background")
+                        : t("annotation.noBackground", "No background")}
                     </Button>
                   </Group>
                 </Box>
               </>
             )}
 
-            {activeTool === 'note' && (
+            {activeTool === "note" && (
               <Box>
-                <Text size="xs" c="dimmed" mb={4}>{t('annotation.backgroundColor', 'Background color')}</Text>
+                <Text size="xs" c="dimmed" mb={4}>
+                  {t("annotation.backgroundColor", "Background color")}
+                </Text>
                 <Group gap="xs" align="center">
                   <ColorSwatchButton
-                    color={noteBackgroundColor || '#ffffff'}
+                    color={noteBackgroundColor || "#ffffff"}
                     size={30}
                     onClick={() => {
-                      setColorPickerTarget('noteBackground');
+                      setColorPickerTarget("noteBackground");
                       setIsColorPickerOpen(true);
                     }}
                   />
                   <Button
                     size="xs"
-                    variant={noteBackgroundColor ? 'light' : 'default'}
+                    variant={noteBackgroundColor ? "light" : "default"}
                     onClick={() => {
-                      setNoteBackgroundColor('');
-                      annotationApiRef?.current?.setAnnotationStyle?.('note', buildToolOptions('note'));
-                      if (selectedAnn?.object?.type === 3 && deriveToolFromAnnotation(selectedAnn.object) === 'note') {
+                      setNoteBackgroundColor("");
+                      annotationApiRef?.current?.setAnnotationStyle?.(
+                        "note",
+                        buildToolOptions("note"),
+                      );
+                      if (
+                        selectedAnn?.object?.type === 3 &&
+                        deriveToolFromAnnotation(selectedAnn.object) === "note"
+                      ) {
                         annotationApiRef?.current?.updateAnnotation?.(
                           selectedAnn.object?.pageIndex ?? 0,
                           selectedAnn.object.id as string,
-                          { backgroundColor: 'transparent', fillColor: 'transparent' }
+                          {
+                            backgroundColor: "transparent",
+                            fillColor: "transparent",
+                          },
                         );
                       }
                     }}
                   >
-                    {noteBackgroundColor ? t('annotation.clearBackground', 'Remove background') : t('annotation.noBackground', 'No background')}
+                    {noteBackgroundColor
+                      ? t("annotation.clearBackground", "Remove background")
+                      : t("annotation.noBackground", "No background")}
                   </Button>
                 </Group>
               </Box>
             )}
 
-            {['square', 'circle', 'line', 'polygon'].includes(activeTool) && (
+            {["square", "circle", "line", "polygon"].includes(activeTool) && (
               <>
                 <Box>
-                  <Text size="xs" c="dimmed" mb={4}>{t('annotation.opacity', 'Opacity')}</Text>
+                  <Text size="xs" c="dimmed" mb={4}>
+                    {t("annotation.opacity", "Opacity")}
+                  </Text>
                   <Slider
                     min={10}
                     max={100}
@@ -524,26 +748,41 @@ export function AnnotationPanel(props: AnnotationPanelProps) {
                   />
                 </Box>
                 <Box>
-                  {activeTool === 'line' ? (
+                  {activeTool === "line" ? (
                     <>
-                      <Text size="xs" c="dimmed" mb={4}>{t('annotation.strokeWidth', 'Width')}</Text>
-                      <Slider min={1} max={12} value={shapeThickness} onChange={setShapeThickness} />
+                      <Text size="xs" c="dimmed" mb={4}>
+                        {t("annotation.strokeWidth", "Width")}
+                      </Text>
+                      <Slider
+                        min={1}
+                        max={12}
+                        value={shapeThickness}
+                        onChange={setShapeThickness}
+                      />
                     </>
                   ) : (
                     <Group gap="xs" align="flex-end">
                       <Box style={{ flex: 1 }}>
-                        <Text size="xs" c="dimmed" mb={4}>{t('annotation.strokeWidth', 'Stroke')}</Text>
-                        <Slider min={0} max={12} value={shapeThickness} onChange={setShapeThickness} />
+                        <Text size="xs" c="dimmed" mb={4}>
+                          {t("annotation.strokeWidth", "Stroke")}
+                        </Text>
+                        <Slider
+                          min={0}
+                          max={12}
+                          value={shapeThickness}
+                          onChange={setShapeThickness}
+                        />
                       </Box>
                       <Button
                         size="xs"
-                        variant={shapeThickness === 0 ? 'filled' : 'light'}
-                        onClick={() => setShapeThickness(shapeThickness === 0 ? 1 : 0)}
+                        variant={shapeThickness === 0 ? "filled" : "light"}
+                        onClick={() =>
+                          setShapeThickness(shapeThickness === 0 ? 1 : 0)
+                        }
                       >
                         {shapeThickness === 0
-                          ? t('annotation.borderOff', 'Border: Off')
-                          : t('annotation.borderOn', 'Border: On')
-                        }
+                          ? t("annotation.borderOff", "Border: Off")
+                          : t("annotation.borderOn", "Border: On")}
                       </Button>
                     </Group>
                   )}
@@ -562,199 +801,366 @@ export function AnnotationPanel(props: AnnotationPanelProps) {
       onClose={() => setIsColorPickerOpen(false)}
       selectedColor={activeColor}
       showOpacity={
-        colorPickerTarget !== 'text' &&
-        colorPickerTarget !== 'textBackground' &&
-        colorPickerTarget !== 'noteBackground' &&
-        colorPickerTarget !== 'shapeStroke' &&
-        colorPickerTarget !== 'shapeFill' &&
-        colorPickerTarget !== 'underline' &&
+        colorPickerTarget !== "text" &&
+        colorPickerTarget !== "textBackground" &&
+        colorPickerTarget !== "noteBackground" &&
+        colorPickerTarget !== "shapeStroke" &&
+        colorPickerTarget !== "shapeFill" &&
+        colorPickerTarget !== "underline" &&
         colorPickerTarget !== null
       }
       opacity={
-        colorPickerTarget === 'highlight' ? highlightOpacity :
-        colorPickerTarget === 'underline' ? underlineOpacity :
-        colorPickerTarget === 'strikeout' ? strikeoutOpacity :
-        colorPickerTarget === 'squiggly' ? squigglyOpacity :
-        colorPickerTarget === 'shapeStroke' ? shapeStrokeOpacity :
-        colorPickerTarget === 'shapeFill' ? shapeFillOpacity :
-        100
+        colorPickerTarget === "highlight"
+          ? highlightOpacity
+          : colorPickerTarget === "underline"
+            ? underlineOpacity
+            : colorPickerTarget === "strikeout"
+              ? strikeoutOpacity
+              : colorPickerTarget === "squiggly"
+                ? squigglyOpacity
+                : colorPickerTarget === "shapeStroke"
+                  ? shapeStrokeOpacity
+                  : colorPickerTarget === "shapeFill"
+                    ? shapeFillOpacity
+                    : 100
       }
       opacityLabel={
-        colorPickerTarget === 'shapeStroke' ? t('annotation.strokeOpacity', 'Stroke Opacity') :
-        colorPickerTarget === 'shapeFill' ? t('annotation.fillOpacity', 'Fill Opacity') :
-        undefined
+        colorPickerTarget === "shapeStroke"
+          ? t("annotation.strokeOpacity", "Stroke Opacity")
+          : colorPickerTarget === "shapeFill"
+            ? t("annotation.fillOpacity", "Fill Opacity")
+            : undefined
       }
       onOpacityChange={(opacity) => {
-        if (colorPickerTarget === 'highlight') {
+        if (colorPickerTarget === "highlight") {
           setHighlightOpacity(opacity);
-          if (activeTool === 'highlight' || activeTool === 'inkHighlighter') {
-            annotationApiRef?.current?.setAnnotationStyle?.(activeTool, buildToolOptions(activeTool));
+          if (activeTool === "highlight" || activeTool === "inkHighlighter") {
+            annotationApiRef?.current?.setAnnotationStyle?.(
+              activeTool,
+              buildToolOptions(activeTool),
+            );
           }
-          if (selectedAnn?.object?.id && (selectedAnn.object?.type === 9 || selectedAnn.object?.type === 15)) {
-            annotationApiRef?.current?.updateAnnotation?.(selectedAnn.object.pageIndex ?? 0, selectedAnn.object.id as string, { opacity: opacity / 100 });
+          if (
+            selectedAnn?.object?.id &&
+            (selectedAnn.object?.type === 9 || selectedAnn.object?.type === 15)
+          ) {
+            annotationApiRef?.current?.updateAnnotation?.(
+              selectedAnn.object.pageIndex ?? 0,
+              selectedAnn.object.id as string,
+              {
+                opacity: opacity / 100,
+              },
+            );
           }
-        } else if (colorPickerTarget === 'underline') {
+        } else if (colorPickerTarget === "underline") {
           setUnderlineOpacity(opacity);
-          annotationApiRef?.current?.setAnnotationStyle?.('underline', buildToolOptions('underline'));
+          annotationApiRef?.current?.setAnnotationStyle?.(
+            "underline",
+            buildToolOptions("underline"),
+          );
           if (selectedAnn?.object?.id && selectedAnn.object?.type === 10) {
-            annotationApiRef?.current?.updateAnnotation?.(selectedAnn.object.pageIndex ?? 0, selectedAnn.object.id as string, { opacity: opacity / 100 });
+            annotationApiRef?.current?.updateAnnotation?.(
+              selectedAnn.object.pageIndex ?? 0,
+              selectedAnn.object.id as string,
+              {
+                opacity: opacity / 100,
+              },
+            );
           }
-        } else if (colorPickerTarget === 'strikeout') {
+        } else if (colorPickerTarget === "strikeout") {
           setStrikeoutOpacity(opacity);
-          annotationApiRef?.current?.setAnnotationStyle?.('strikeout', buildToolOptions('strikeout'));
+          annotationApiRef?.current?.setAnnotationStyle?.(
+            "strikeout",
+            buildToolOptions("strikeout"),
+          );
           if (selectedAnn?.object?.id && selectedAnn.object?.type === 12) {
-            annotationApiRef?.current?.updateAnnotation?.(selectedAnn.object.pageIndex ?? 0, selectedAnn.object.id as string, { opacity: opacity / 100 });
+            annotationApiRef?.current?.updateAnnotation?.(
+              selectedAnn.object.pageIndex ?? 0,
+              selectedAnn.object.id as string,
+              {
+                opacity: opacity / 100,
+              },
+            );
           }
-        } else if (colorPickerTarget === 'squiggly') {
+        } else if (colorPickerTarget === "squiggly") {
           setSquigglyOpacity(opacity);
-          annotationApiRef?.current?.setAnnotationStyle?.('squiggly', buildToolOptions('squiggly'));
+          annotationApiRef?.current?.setAnnotationStyle?.(
+            "squiggly",
+            buildToolOptions("squiggly"),
+          );
           if (selectedAnn?.object?.id && selectedAnn.object?.type === 11) {
-            annotationApiRef?.current?.updateAnnotation?.(selectedAnn.object.pageIndex ?? 0, selectedAnn.object.id as string, { opacity: opacity / 100 });
+            annotationApiRef?.current?.updateAnnotation?.(
+              selectedAnn.object.pageIndex ?? 0,
+              selectedAnn.object.id as string,
+              {
+                opacity: opacity / 100,
+              },
+            );
           }
-        } else if (colorPickerTarget === 'shapeStroke') {
+        } else if (colorPickerTarget === "shapeStroke") {
           setShapeStrokeOpacity(opacity);
-          const shapeToolsList = ['square', 'circle', 'polygon'] as AnnotationToolId[];
+          const shapeToolsList = [
+            "square",
+            "circle",
+            "polygon",
+          ] as AnnotationToolId[];
           if (shapeToolsList.includes(activeTool)) {
-            annotationApiRef?.current?.setAnnotationStyle?.(activeTool, buildToolOptions(activeTool));
+            annotationApiRef?.current?.setAnnotationStyle?.(
+              activeTool,
+              buildToolOptions(activeTool),
+            );
           }
-        } else if (colorPickerTarget === 'shapeFill') {
+        } else if (colorPickerTarget === "shapeFill") {
           setShapeFillOpacity(opacity);
-          const fillShapeTools = ['square', 'circle', 'polygon'] as AnnotationToolId[];
+          const fillShapeTools = [
+            "square",
+            "circle",
+            "polygon",
+          ] as AnnotationToolId[];
           if (fillShapeTools.includes(activeTool)) {
-            annotationApiRef?.current?.setAnnotationStyle?.(activeTool, buildToolOptions(activeTool));
+            annotationApiRef?.current?.setAnnotationStyle?.(
+              activeTool,
+              buildToolOptions(activeTool),
+            );
           }
         }
       }}
       onColorChange={(color) => {
-        if (colorPickerTarget === 'ink') {
+        if (colorPickerTarget === "ink") {
           setInkColor(color);
-          if (activeTool === 'ink') {
-            annotationApiRef?.current?.setAnnotationStyle?.('ink', buildToolOptions('ink'));
-          }
-          if (selectedAnn?.object?.type === 15) {
-            annotationApiRef?.current?.updateAnnotation?.(selectedAnn.object.pageIndex ?? 0, selectedAnn.object.id as string, { color });
-          }
-        } else if (colorPickerTarget === 'highlight') {
-          setHighlightColor(color);
-          if (activeTool === 'highlight' || activeTool === 'inkHighlighter') {
-            annotationApiRef?.current?.setAnnotationStyle?.(activeTool, buildToolOptions(activeTool));
-          }
-          if (selectedAnn?.object?.type === 9 || selectedAnn?.object?.type === 15) {
-            annotationApiRef?.current?.updateAnnotation?.(selectedAnn.object.pageIndex ?? 0, selectedAnn.object.id as string, { color });
-          }
-        } else if (colorPickerTarget === 'underline') {
-          setUnderlineColor(color);
-          annotationApiRef?.current?.setAnnotationStyle?.('underline', buildToolOptions('underline'));
-          if (selectedAnn?.object?.id) {
-            annotationApiRef?.current?.updateAnnotation?.(selectedAnn.object.pageIndex ?? 0, selectedAnn.object.id as string, { color });
-          }
-        } else if (colorPickerTarget === 'strikeout') {
-          setStrikeoutColor(color);
-          annotationApiRef?.current?.setAnnotationStyle?.('strikeout', buildToolOptions('strikeout'));
-          if (selectedAnn?.object?.id) {
-            annotationApiRef?.current?.updateAnnotation?.(selectedAnn.object.pageIndex ?? 0, selectedAnn.object.id as string, { color });
-          }
-        } else if (colorPickerTarget === 'squiggly') {
-          setSquigglyColor(color);
-          annotationApiRef?.current?.setAnnotationStyle?.('squiggly', buildToolOptions('squiggly'));
-          if (selectedAnn?.object?.id) {
-            annotationApiRef?.current?.updateAnnotation?.(selectedAnn.object.pageIndex ?? 0, selectedAnn.object.id as string, { color });
-          }
-        } else if (colorPickerTarget === 'textBackground') {
-          setTextBackgroundColor(color);
-          if (activeTool === 'text') {
-            annotationApiRef?.current?.setAnnotationStyle?.('text', buildToolOptions('text'));
-          }
-          if (selectedAnn?.object?.type === 3 && deriveToolFromAnnotation(selectedAnn.object) !== 'note') {
-            annotationApiRef?.current?.updateAnnotation?.(
-              selectedAnn.object?.pageIndex ?? 0,
-              selectedAnn.object.id as string,
-              { backgroundColor: color, fillColor: color }
+          if (activeTool === "ink") {
+            annotationApiRef?.current?.setAnnotationStyle?.(
+              "ink",
+              buildToolOptions("ink"),
             );
           }
-        } else if (colorPickerTarget === 'noteBackground') {
-          setNoteBackgroundColor(color);
-          if (activeTool === 'note') {
-            annotationApiRef?.current?.setAnnotationStyle?.('note', buildToolOptions('note'));
+          if (selectedAnn?.object?.type === 15) {
+            annotationApiRef?.current?.updateAnnotation?.(
+              selectedAnn.object.pageIndex ?? 0,
+              selectedAnn.object.id as string,
+              {
+                color,
+              },
+            );
           }
-          if (selectedAnn?.object?.type === 3 && deriveToolFromAnnotation(selectedAnn.object) === 'note') {
+        } else if (colorPickerTarget === "highlight") {
+          setHighlightColor(color);
+          if (activeTool === "highlight" || activeTool === "inkHighlighter") {
+            annotationApiRef?.current?.setAnnotationStyle?.(
+              activeTool,
+              buildToolOptions(activeTool),
+            );
+          }
+          if (
+            selectedAnn?.object?.type === 9 ||
+            selectedAnn?.object?.type === 15
+          ) {
+            annotationApiRef?.current?.updateAnnotation?.(
+              selectedAnn.object.pageIndex ?? 0,
+              selectedAnn.object.id as string,
+              {
+                color,
+              },
+            );
+          }
+        } else if (colorPickerTarget === "underline") {
+          setUnderlineColor(color);
+          annotationApiRef?.current?.setAnnotationStyle?.(
+            "underline",
+            buildToolOptions("underline"),
+          );
+          if (selectedAnn?.object?.id) {
+            annotationApiRef?.current?.updateAnnotation?.(
+              selectedAnn.object.pageIndex ?? 0,
+              selectedAnn.object.id as string,
+              {
+                color,
+              },
+            );
+          }
+        } else if (colorPickerTarget === "strikeout") {
+          setStrikeoutColor(color);
+          annotationApiRef?.current?.setAnnotationStyle?.(
+            "strikeout",
+            buildToolOptions("strikeout"),
+          );
+          if (selectedAnn?.object?.id) {
+            annotationApiRef?.current?.updateAnnotation?.(
+              selectedAnn.object.pageIndex ?? 0,
+              selectedAnn.object.id as string,
+              {
+                color,
+              },
+            );
+          }
+        } else if (colorPickerTarget === "squiggly") {
+          setSquigglyColor(color);
+          annotationApiRef?.current?.setAnnotationStyle?.(
+            "squiggly",
+            buildToolOptions("squiggly"),
+          );
+          if (selectedAnn?.object?.id) {
+            annotationApiRef?.current?.updateAnnotation?.(
+              selectedAnn.object.pageIndex ?? 0,
+              selectedAnn.object.id as string,
+              {
+                color,
+              },
+            );
+          }
+        } else if (colorPickerTarget === "textBackground") {
+          setTextBackgroundColor(color);
+          if (activeTool === "text") {
+            annotationApiRef?.current?.setAnnotationStyle?.(
+              "text",
+              buildToolOptions("text"),
+            );
+          }
+          if (
+            selectedAnn?.object?.type === 3 &&
+            deriveToolFromAnnotation(selectedAnn.object) !== "note"
+          ) {
             annotationApiRef?.current?.updateAnnotation?.(
               selectedAnn.object?.pageIndex ?? 0,
               selectedAnn.object.id as string,
-              { backgroundColor: color, fillColor: color }
+              { backgroundColor: color, fillColor: color },
+            );
+          }
+        } else if (colorPickerTarget === "noteBackground") {
+          setNoteBackgroundColor(color);
+          if (activeTool === "note") {
+            annotationApiRef?.current?.setAnnotationStyle?.(
+              "note",
+              buildToolOptions("note"),
+            );
+          }
+          if (
+            selectedAnn?.object?.type === 3 &&
+            deriveToolFromAnnotation(selectedAnn.object) === "note"
+          ) {
+            annotationApiRef?.current?.updateAnnotation?.(
+              selectedAnn.object?.pageIndex ?? 0,
+              selectedAnn.object.id as string,
+              { backgroundColor: color, fillColor: color },
             );
           }
         } else {
           setTextColor(color);
-          if (activeTool === 'text') {
-            annotationApiRef?.current?.setAnnotationStyle?.('text', buildToolOptions('text'));
+          if (activeTool === "text") {
+            annotationApiRef?.current?.setAnnotationStyle?.(
+              "text",
+              buildToolOptions("text"),
+            );
           }
-          if (selectedAnn?.object?.type === 3 || selectedAnn?.object?.type === 1) {
-            annotationApiRef?.current?.updateAnnotation?.(selectedAnn.object.pageIndex ?? 0, selectedAnn.object.id as string, {
-              textColor: color,
-              color,
-            });
+          if (
+            selectedAnn?.object?.type === 3 ||
+            selectedAnn?.object?.type === 1
+          ) {
+            annotationApiRef?.current?.updateAnnotation?.(
+              selectedAnn.object.pageIndex ?? 0,
+              selectedAnn.object.id as string,
+              {
+                textColor: color,
+                color,
+              },
+            );
           }
         }
 
-        const shapeToolsList = ['square', 'circle', 'line', 'lineArrow', 'polyline', 'polygon'] as AnnotationToolId[];
-        const fillShapeTools = ['square', 'circle', 'polygon'] as AnnotationToolId[];
+        const shapeToolsList = [
+          "square",
+          "circle",
+          "line",
+          "lineArrow",
+          "polyline",
+          "polygon",
+        ] as AnnotationToolId[];
+        const fillShapeTools = [
+          "square",
+          "circle",
+          "polygon",
+        ] as AnnotationToolId[];
 
-        if (colorPickerTarget === 'shapeStroke') {
+        if (colorPickerTarget === "shapeStroke") {
           setShapeStrokeColor(color);
-          const styleTool = shapeToolsList.includes(activeTool) ? activeTool : null;
+          const styleTool = shapeToolsList.includes(activeTool)
+            ? activeTool
+            : null;
           if (styleTool) {
-            annotationApiRef?.current?.setAnnotationStyle?.(styleTool, buildToolOptions(styleTool));
+            annotationApiRef?.current?.setAnnotationStyle?.(
+              styleTool,
+              buildToolOptions(styleTool),
+            );
           }
           if (selectedAnn?.object?.id) {
-            annotationApiRef?.current?.updateAnnotation?.(selectedAnn.object.pageIndex ?? 0, selectedAnn.object.id as string, {
-              strokeColor: color,
-              color: selectedAnn.object?.color ?? shapeFillColor,
-              borderWidth: shapeThickness,
-            });
+            annotationApiRef?.current?.updateAnnotation?.(
+              selectedAnn.object.pageIndex ?? 0,
+              selectedAnn.object.id as string,
+              {
+                strokeColor: color,
+                color: selectedAnn.object?.color ?? shapeFillColor,
+                borderWidth: shapeThickness,
+              },
+            );
           }
         }
-        if (colorPickerTarget === 'shapeFill') {
+        if (colorPickerTarget === "shapeFill") {
           setShapeFillColor(color);
-          const styleTool = fillShapeTools.includes(activeTool) ? activeTool : null;
+          const styleTool = fillShapeTools.includes(activeTool)
+            ? activeTool
+            : null;
           if (styleTool) {
-            annotationApiRef?.current?.setAnnotationStyle?.(styleTool, buildToolOptions(styleTool));
+            annotationApiRef?.current?.setAnnotationStyle?.(
+              styleTool,
+              buildToolOptions(styleTool),
+            );
           }
           if (selectedAnn?.object?.id) {
-            annotationApiRef?.current?.updateAnnotation?.(selectedAnn.object.pageIndex ?? 0, selectedAnn.object.id as string, {
-              color,
-              strokeColor: selectedAnn.object?.strokeColor ?? shapeStrokeColor,
-              borderWidth: shapeThickness,
-            });
+            annotationApiRef?.current?.updateAnnotation?.(
+              selectedAnn.object.pageIndex ?? 0,
+              selectedAnn.object.id as string,
+              {
+                color,
+                strokeColor:
+                  selectedAnn.object?.strokeColor ?? shapeStrokeColor,
+                borderWidth: shapeThickness,
+              },
+            );
           }
         }
       }}
-      title={t('annotation.chooseColor', 'Choose color')}
+      title={t("annotation.chooseColor", "Choose color")}
     />
   );
 
   return (
     <Stack gap="md">
       <Group gap="xs" wrap="nowrap" align="center">
-        <Tooltip label={t('annotation.selectAndMove', 'Select and edit annotations')}>
+        <Tooltip
+          label={t("annotation.selectAndMove", "Select and edit annotations")}
+        >
           <ActionIcon
-            variant={activeTool === 'select' && annotationsVisible ? 'filled' : 'default'}
+            variant={
+              activeTool === "select" && annotationsVisible
+                ? "filled"
+                : "default"
+            }
             size="lg"
             disabled={!annotationsVisible}
             onClick={() => {
-              activateAnnotationTool('select');
+              activateAnnotationTool("select");
             }}
             style={{
-              width: 'auto',
-              paddingInline: '0.75rem',
-              display: 'inline-flex',
-              alignItems: 'center',
-              gap: '0.4rem',
+              width: "auto",
+              paddingInline: "0.75rem",
+              display: "inline-flex",
+              alignItems: "center",
+              gap: "0.4rem",
             }}
           >
             <LocalIcon icon="touch-app-rounded" width={20} height={20} />
             <Text component="span" size="sm" fw={500}>
-              {t('annotation.selectAndMove', 'Select and Edit')}
+              {t("annotation.selectAndMove", "Select and Edit")}
             </Text>
           </ActionIcon>
         </Tooltip>
@@ -770,31 +1176,41 @@ export function AnnotationPanel(props: AnnotationPanelProps) {
       </Group>
 
       <Box>
-        <Text size="sm" fw={600} mb="xs">{t('annotation.textMarkup', 'Text Markup')}</Text>
+        <Text size="sm" fw={600} mb="xs">
+          {t("annotation.textMarkup", "Text Markup")}
+        </Text>
         {renderToolButtons(textMarkupTools)}
       </Box>
 
       <Box>
-        <Text size="sm" fw={600} mb="xs">{t('annotation.drawing', 'Drawing')}</Text>
+        <Text size="sm" fw={600} mb="xs">
+          {t("annotation.drawing", "Drawing")}
+        </Text>
         {renderToolButtons(drawingTools)}
       </Box>
 
       <Box>
-        <Text size="sm" fw={600} mb="xs">{t('annotation.shapes', 'Shapes')}</Text>
+        <Text size="sm" fw={600} mb="xs">
+          {t("annotation.shapes", "Shapes")}
+        </Text>
         {renderToolButtons(shapeTools)}
       </Box>
 
       <Box>
-        <Text size="sm" fw={600} mb="xs">{t('annotation.comments', 'Comments')}</Text>
+        <Text size="sm" fw={600} mb="xs">
+          {t("annotation.comments", "Comments")}
+        </Text>
         {renderToolButtons(commentTools)}
       </Box>
 
       <Box>
-        <Text size="sm" fw={600} mb="xs">{t('annotation.notesStamps', 'Notes & Stamps')}</Text>
+        <Text size="sm" fw={600} mb="xs">
+          {t("annotation.notesStamps", "Notes & Stamps")}
+        </Text>
         {renderToolButtons(otherTools)}
       </Box>
 
-      {activeTool === 'stamp' && defaultStyleControls}
+      {activeTool === "stamp" && defaultStyleControls}
 
       {colorPickerComponent}
 
@@ -808,7 +1224,7 @@ export function AnnotationPanel(props: AnnotationPanelProps) {
         disabled={applyDisabled}
         onClick={onApplyChanges}
       >
-        {t('annotation.saveChanges', 'Save Changes')}
+        {t("annotation.saveChanges", "Save Changes")}
       </Button>
 
       <SuggestedToolsSection />
diff --git a/frontend/src/core/tools/annotate/useAnnotationSelection.ts b/frontend/src/core/tools/annotate/useAnnotationSelection.ts
index 382ae2f805..97131d4a6f 100644
--- a/frontend/src/core/tools/annotate/useAnnotationSelection.ts
+++ b/frontend/src/core/tools/annotate/useAnnotationSelection.ts
@@ -1,5 +1,8 @@
-import { useCallback, useEffect, useRef, useState } from 'react';
-import type { AnnotationAPI, AnnotationToolId } from '@app/components/viewer/viewerTypes';
+import { useCallback, useEffect, useRef, useState } from "react";
+import type {
+  AnnotationAPI,
+  AnnotationToolId,
+} from "@app/components/viewer/viewerTypes";
 
 interface UseAnnotationSelectionParams {
   annotationApiRef: React.RefObject<AnnotationAPI | null>;
@@ -28,11 +31,16 @@ interface UseAnnotationSelectionParams {
   setShapeOpacity: (value: number) => void;
   setShapeStrokeOpacity: (value: number) => void;
   setShapeFillOpacity: (value: number) => void;
-  setTextAlignment: (value: 'left' | 'center' | 'right') => void;
+  setTextAlignment: (value: "left" | "center" | "right") => void;
 }
 
-const MARKUP_TOOL_IDS = ['highlight', 'underline', 'strikeout', 'squiggly'] as const;
-const DRAWING_TOOL_IDS = ['ink', 'inkHighlighter'] as const;
+const MARKUP_TOOL_IDS = [
+  "highlight",
+  "underline",
+  "strikeout",
+  "squiggly",
+] as const;
+const DRAWING_TOOL_IDS = ["ink", "inkHighlighter"] as const;
 const STAY_ACTIVE_TOOL_IDS = [...MARKUP_TOOL_IDS, ...DRAWING_TOOL_IDS] as const;
 
 const isTextMarkupAnnotation = (annotation: any): boolean => {
@@ -44,17 +52,20 @@ const isTextMarkupAnnotation = (annotation: any): boolean => {
   if (toolId && MARKUP_TOOL_IDS.includes(toolId)) return true;
 
   const type = annotation?.type ?? annotation?.object?.type;
-  if (typeof type === 'number' && [9, 10, 11, 12].includes(type)) return true;
+  if (typeof type === "number" && [9, 10, 11, 12].includes(type)) return true;
 
   const subtype = annotation?.subtype ?? annotation?.object?.subtype;
-  if (typeof subtype === 'string') {
+  if (typeof subtype === "string") {
     const lower = subtype.toLowerCase();
     if (MARKUP_TOOL_IDS.some((t) => lower.includes(t))) return true;
   }
   return false;
 };
 
-const shouldStayOnPlacementTool = (annotation: any, derivedTool?: string | null | undefined): boolean => {
+const shouldStayOnPlacementTool = (
+  annotation: any,
+  derivedTool?: string | null | undefined,
+): boolean => {
   // Text markup tools (highlight, underline, strikeout, squiggly) and drawing tools (ink, inkHighlighter) stay active
   // All other tools switch to select mode after placement
 
@@ -117,26 +128,38 @@ export function useAnnotationSelection({
       const annObject = ann?.object ?? ann ?? null;
       const annId = annObject?.id ?? null;
       const type = annObject?.type;
-      const derivedTool = annObject ? deriveToolFromAnnotation(annObject) : undefined;
+      const derivedTool = annObject
+        ? deriveToolFromAnnotation(annObject)
+        : undefined;
       selectedAnnIdRef.current = annId;
       setSelectedAnnId(annId);
       // Normalize selected annotation to always expose .object for edit panels
-      const normalizedSelection = ann?.object ? ann : annObject ? { object: annObject } : null;
+      const normalizedSelection = ann?.object
+        ? ann
+        : annObject
+          ? { object: annObject }
+          : null;
       setSelectedAnn(normalizedSelection);
 
       if (annObject?.contents !== undefined) {
-        setSelectedTextDraft(annObject.contents ?? '');
+        setSelectedTextDraft(annObject.contents ?? "");
       }
       if (annObject?.fontSize !== undefined) {
         setSelectedFontSize(annObject.fontSize ?? 14);
       }
       if (annObject?.textAlign !== undefined) {
         const align = annObject.textAlign;
-        if (typeof align === 'string') {
-          const normalized = align === 'center' ? 'center' : align === 'right' ? 'right' : 'left';
+        if (typeof align === "string") {
+          const normalized =
+            align === "center"
+              ? "center"
+              : align === "right"
+                ? "right"
+                : "left";
           setTextAlignment(normalized);
-        } else if (typeof align === 'number') {
-          const normalized = align === 1 ? 'center' : align === 2 ? 'right' : 'left';
+        } else if (typeof align === "number") {
+          const normalized =
+            align === 1 ? "center" : align === 2 ? "right" : "left";
           setTextAlignment(normalized);
         }
       }
@@ -145,21 +168,26 @@ export function useAnnotationSelection({
           (annObject?.backgroundColor as string | undefined) ||
           (annObject?.fillColor as string | undefined) ||
           undefined;
-        const textColor = (annObject?.textColor as string | undefined) || (annObject?.color as string | undefined);
+        const textColor =
+          (annObject?.textColor as string | undefined) ||
+          (annObject?.color as string | undefined);
         if (textColor) {
           setTextColor(textColor);
         }
-        if (derivedTool === 'note') {
-          setNoteBackgroundColor(background || '');
+        if (derivedTool === "note") {
+          setNoteBackgroundColor(background || "");
         } else {
-          setTextBackgroundColor(background || '');
+          setTextBackgroundColor(background || "");
         }
       }
 
       if (type === 15) {
         const width =
-          annObject?.strokeWidth ?? annObject?.borderWidth ?? annObject?.lineWidth ?? annObject?.thickness;
-        if (derivedTool === 'inkHighlighter') {
+          annObject?.strokeWidth ??
+          annObject?.borderWidth ??
+          annObject?.lineWidth ??
+          annObject?.thickness;
+        if (derivedTool === "inkHighlighter") {
           if (annObject?.color) setHighlightColor(annObject.color);
           if (annObject?.opacity !== undefined) {
             setHighlightOpacity(Math.round((annObject.opacity ?? 1) * 100));
@@ -174,7 +202,10 @@ export function useAnnotationSelection({
           }
         }
       } else if (type >= 4 && type <= 8) {
-        const width = annObject?.strokeWidth ?? annObject?.borderWidth ?? annObject?.lineWidth;
+        const width =
+          annObject?.strokeWidth ??
+          annObject?.borderWidth ??
+          annObject?.lineWidth;
         if (width !== undefined) {
           setShapeThickness(width ?? 1);
         }
@@ -182,53 +213,74 @@ export function useAnnotationSelection({
 
       if (type === 9) {
         if (annObject?.color) setHighlightColor(annObject.color);
-        if (annObject?.opacity !== undefined) setHighlightOpacity(Math.round((annObject.opacity ?? 1) * 100));
+        if (annObject?.opacity !== undefined)
+          setHighlightOpacity(Math.round((annObject.opacity ?? 1) * 100));
       } else if (type === 10) {
         if (annObject?.color) setUnderlineColor(annObject.color);
-        if (annObject?.opacity !== undefined) setUnderlineOpacity(Math.round((annObject.opacity ?? 1) * 100));
+        if (annObject?.opacity !== undefined)
+          setUnderlineOpacity(Math.round((annObject.opacity ?? 1) * 100));
       } else if (type === 12) {
         if (annObject?.color) setStrikeoutColor(annObject.color);
-        if (annObject?.opacity !== undefined) setStrikeoutOpacity(Math.round((annObject.opacity ?? 1) * 100));
+        if (annObject?.opacity !== undefined)
+          setStrikeoutOpacity(Math.round((annObject.opacity ?? 1) * 100));
       } else if (type === 11) {
         if (annObject?.color) setSquigglyColor(annObject.color);
-        if (annObject?.opacity !== undefined) setSquigglyOpacity(Math.round((annObject.opacity ?? 1) * 100));
+        if (annObject?.opacity !== undefined)
+          setSquigglyOpacity(Math.round((annObject.opacity ?? 1) * 100));
       }
 
       if ([4, 5, 6, 7, 8].includes(type)) {
-        const stroke = (annObject?.strokeColor as string | undefined) ?? (annObject?.color as string | undefined);
+        const stroke =
+          (annObject?.strokeColor as string | undefined) ??
+          (annObject?.color as string | undefined);
         if (stroke) setShapeStrokeColor(stroke);
         if ([5, 6, 7].includes(type)) {
-          const fill = (annObject?.color as string | undefined) ?? (annObject?.fillColor as string | undefined);
+          const fill =
+            (annObject?.color as string | undefined) ??
+            (annObject?.fillColor as string | undefined);
           if (fill) setShapeFillColor(fill);
         }
         const opacity =
-          annObject?.opacity !== undefined ? Math.round((annObject.opacity ?? 1) * 100) : undefined;
+          annObject?.opacity !== undefined
+            ? Math.round((annObject.opacity ?? 1) * 100)
+            : undefined;
         const strokeOpacityValue =
           annObject?.strokeOpacity !== undefined
             ? Math.round((annObject.strokeOpacity ?? 1) * 100)
             : undefined;
         const fillOpacityValue =
-          annObject?.fillOpacity !== undefined ? Math.round((annObject.fillOpacity ?? 1) * 100) : undefined;
+          annObject?.fillOpacity !== undefined
+            ? Math.round((annObject.fillOpacity ?? 1) * 100)
+            : undefined;
         if (opacity !== undefined) {
           setShapeOpacity(opacity);
           setShapeStrokeOpacity(strokeOpacityValue ?? opacity);
           setShapeFillOpacity(fillOpacityValue ?? opacity);
         } else {
-          if (strokeOpacityValue !== undefined) setShapeStrokeOpacity(strokeOpacityValue);
-          if (fillOpacityValue !== undefined) setShapeFillOpacity(fillOpacityValue);
+          if (strokeOpacityValue !== undefined)
+            setShapeStrokeOpacity(strokeOpacityValue);
+          if (fillOpacityValue !== undefined)
+            setShapeFillOpacity(fillOpacityValue);
         }
       }
 
       const matchingTool = derivedTool;
-      const stayOnPlacement = shouldStayOnPlacementTool(annObject, matchingTool);
-      if (matchingTool && activeToolRef.current !== 'select' && !stayOnPlacement) {
-        activeToolRef.current = 'select';
-        setActiveTool('select');
+      const stayOnPlacement = shouldStayOnPlacementTool(
+        annObject,
+        matchingTool,
+      );
+      if (
+        matchingTool &&
+        activeToolRef.current !== "select" &&
+        !stayOnPlacement
+      ) {
+        activeToolRef.current = "select";
+        setActiveTool("select");
         // Immediately enable select tool to avoid re-entering placement after creation.
-        annotationApiRef.current?.activateAnnotationTool?.('select');
-      } else if (activeToolRef.current === 'select') {
+        annotationApiRef.current?.activateAnnotationTool?.("select");
+      } else if (activeToolRef.current === "select") {
         // Keep the viewer in Select mode so clicking existing annotations does not re-enable placement.
-        annotationApiRef.current?.activateAnnotationTool?.('select');
+        annotationApiRef.current?.activateAnnotationTool?.("select");
       }
     },
     [
@@ -259,7 +311,7 @@ export function useAnnotationSelection({
       setShapeFillOpacity,
       setTextAlignment,
       setFreehandHighlighterWidth,
-    ]
+    ],
   );
 
   useEffect(() => {
@@ -268,7 +320,7 @@ export function useAnnotationSelection({
 
     const checkSelection = () => {
       let ann: any = null;
-      if (typeof api.getSelectedAnnotation === 'function') {
+      if (typeof api.getSelectedAnnotation === "function") {
         try {
           ann = api.getSelectedAnnotation();
         } catch (error) {
@@ -277,9 +329,13 @@ export function useAnnotationSelection({
           // an undefined object). Treat this as "no current selection"
           // instead of crashing the annotations tool.
           // Only log unexpected errors - "No active document" is a common expected state during init
-          const errorMessage = error instanceof Error ? error.message : String(error);
-          if (!errorMessage.includes('No active document')) {
-            console.error('[useAnnotationSelection] getSelectedAnnotation failed:', error);
+          const errorMessage =
+            error instanceof Error ? error.message : String(error);
+          if (!errorMessage.includes("No active document")) {
+            console.error(
+              "[useAnnotationSelection] getSelectedAnnotation failed:",
+              error,
+            );
           }
           ann = null;
         }
@@ -292,64 +348,72 @@ export function useAnnotationSelection({
 
     let interval: ReturnType<typeof setInterval> | null = null;
 
-    if (typeof api.onAnnotationEvent === 'function') {
+    if (typeof api.onAnnotationEvent === "function") {
       const handler = (event: any) => {
         const ann = event?.annotation ?? event?.selectedAnnotation ?? null;
         const eventType = event?.type;
         switch (eventType) {
-          case 'create':
-          case 'add':
-          case 'added':
-          case 'created':
-          case 'annotationCreated':
-          case 'annotationAdded':
-          case 'complete': {
+          case "create":
+          case "add":
+          case "added":
+          case "created":
+          case "annotationCreated":
+          case "annotationAdded":
+          case "complete": {
             const eventAnn = ann ?? api.getSelectedAnnotation?.();
             applySelectionFromAnnotation(eventAnn);
             const currentTool = activeToolRef.current;
             const tool =
-              deriveToolFromAnnotation((eventAnn as any)?.object ?? eventAnn ?? api.getSelectedAnnotation?.()) ||
-              currentTool;
+              deriveToolFromAnnotation(
+                (eventAnn as any)?.object ??
+                  eventAnn ??
+                  api.getSelectedAnnotation?.(),
+              ) || currentTool;
             const stayOnPlacement = shouldStayOnPlacementTool(eventAnn, tool);
-            if (activeToolRef.current !== 'select' && !stayOnPlacement) {
-              activeToolRef.current = 'select';
-              setActiveTool('select');
-              annotationApiRef.current?.activateAnnotationTool?.('select');
+            if (activeToolRef.current !== "select" && !stayOnPlacement) {
+              activeToolRef.current = "select";
+              setActiveTool("select");
+              annotationApiRef.current?.activateAnnotationTool?.("select");
             }
             // Re-read selection after the viewer updates to ensure we have the full annotation object for the edit panel.
             setTimeout(() => {
               const selected = api.getSelectedAnnotation?.();
               applySelectionFromAnnotation(selected ?? eventAnn ?? null);
               const derivedAfter =
-                deriveToolFromAnnotation((selected as any)?.object ?? selected ?? eventAnn ?? null) || activeToolRef.current;
-              const stayOnPlacementAfter = shouldStayOnPlacementTool(selected ?? eventAnn ?? null, derivedAfter);
-              if (activeToolRef.current !== 'select' && !stayOnPlacementAfter) {
-                activeToolRef.current = 'select';
-                setActiveTool('select');
-                annotationApiRef.current?.activateAnnotationTool?.('select');
+                deriveToolFromAnnotation(
+                  (selected as any)?.object ?? selected ?? eventAnn ?? null,
+                ) || activeToolRef.current;
+              const stayOnPlacementAfter = shouldStayOnPlacementTool(
+                selected ?? eventAnn ?? null,
+                derivedAfter,
+              );
+              if (activeToolRef.current !== "select" && !stayOnPlacementAfter) {
+                activeToolRef.current = "select";
+                setActiveTool("select");
+                annotationApiRef.current?.activateAnnotationTool?.("select");
               }
             }, 50);
             break;
           }
-          case 'select':
-          case 'selected':
-          case 'annotationSelected':
-          case 'annotationClicked':
-          case 'annotationTapped':
+          case "select":
+          case "selected":
+          case "annotationSelected":
+          case "annotationClicked":
+          case "annotationTapped":
             applySelectionFromAnnotation(ann ?? api.getSelectedAnnotation?.());
             break;
-          case 'deselect':
-          case 'clearSelection':
+          case "deselect":
+          case "clearSelection":
             applySelectionFromAnnotation(null);
             break;
-          case 'delete':
-          case 'remove':
+          case "delete":
+          case "remove":
             if (ann?.id && ann.id === selectedAnnIdRef.current) {
               applySelectionFromAnnotation(null);
             }
             break;
-          case 'update':
-          case 'change':
+          case "update":
+          case "change":
             if (selectedAnnIdRef.current) {
               const current = api.getSelectedAnnotation?.();
               if (current) {
@@ -365,7 +429,7 @@ export function useAnnotationSelection({
       const unsubscribe = api.onAnnotationEvent(handler);
       interval = setInterval(checkSelection, 450);
       return () => {
-        if (typeof unsubscribe === 'function') {
+        if (typeof unsubscribe === "function") {
           unsubscribe();
         }
         if (interval) clearInterval(interval);
diff --git a/frontend/src/core/tools/annotate/useAnnotationStyleState.ts b/frontend/src/core/tools/annotate/useAnnotationStyleState.ts
index 3abd69d748..a0e1b1b469 100644
--- a/frontend/src/core/tools/annotate/useAnnotationStyleState.ts
+++ b/frontend/src/core/tools/annotate/useAnnotationStyleState.ts
@@ -1,5 +1,5 @@
-import { useCallback, useMemo, useState } from 'react';
-import type { AnnotationToolId } from '@app/components/viewer/viewerTypes';
+import { useCallback, useMemo, useState } from "react";
+import type { AnnotationToolId } from "@app/components/viewer/viewerTypes";
 
 type Size = { width: number; height: number };
 
@@ -23,7 +23,7 @@ interface StyleState {
   squigglyOpacity: number;
   textColor: string;
   textSize: number;
-  textAlignment: 'left' | 'center' | 'right';
+  textAlignment: "left" | "center" | "right";
   textBackgroundColor: string;
   noteBackgroundColor: string;
   shapeStrokeColor: string;
@@ -48,7 +48,7 @@ interface StyleActions {
   setSquigglyOpacity: (value: number) => void;
   setTextColor: (value: string) => void;
   setTextSize: (value: number) => void;
-  setTextAlignment: (value: 'left' | 'center' | 'right') => void;
+  setTextAlignment: (value: "left" | "center" | "right") => void;
   setTextBackgroundColor: (value: string) => void;
   setNoteBackgroundColor: (value: string) => void;
   setShapeStrokeColor: (value: string) => void;
@@ -61,7 +61,7 @@ interface StyleActions {
 
 export type BuildToolOptionsFn = (
   toolId: AnnotationToolId,
-  extras?: BuildToolOptionsExtras
+  extras?: BuildToolOptionsExtras,
 ) => Record<string, unknown>;
 
 export interface AnnotationStyleStateReturn {
@@ -72,26 +72,28 @@ export interface AnnotationStyleStateReturn {
 }
 
 export const useAnnotationStyleState = (
-  cssToPdfSize?: (size: Size) => Size
+  cssToPdfSize?: (size: Size) => Size,
 ): AnnotationStyleStateReturn => {
-  const [inkColor, setInkColor] = useState('#1f2933');
+  const [inkColor, setInkColor] = useState("#1f2933");
   const [inkWidth, setInkWidth] = useState(2);
-  const [highlightColor, setHighlightColor] = useState('#ffd54f');
+  const [highlightColor, setHighlightColor] = useState("#ffd54f");
   const [highlightOpacity, setHighlightOpacity] = useState(60);
   const [freehandHighlighterWidth, setFreehandHighlighterWidth] = useState(6);
-  const [underlineColor, setUnderlineColor] = useState('#ffb300');
+  const [underlineColor, setUnderlineColor] = useState("#ffb300");
   const [underlineOpacity, setUnderlineOpacity] = useState(100);
-  const [strikeoutColor, setStrikeoutColor] = useState('#e53935');
+  const [strikeoutColor, setStrikeoutColor] = useState("#e53935");
   const [strikeoutOpacity, setStrikeoutOpacity] = useState(100);
-  const [squigglyColor, setSquigglyColor] = useState('#00acc1');
+  const [squigglyColor, setSquigglyColor] = useState("#00acc1");
   const [squigglyOpacity, setSquigglyOpacity] = useState(100);
-  const [textColor, setTextColor] = useState('#111111');
+  const [textColor, setTextColor] = useState("#111111");
   const [textSize, setTextSize] = useState(14);
-  const [textAlignment, setTextAlignment] = useState<'left' | 'center' | 'right'>('left');
-  const [textBackgroundColor, setTextBackgroundColor] = useState<string>('');
-  const [noteBackgroundColor, setNoteBackgroundColor] = useState('#ffd54f');
-  const [shapeStrokeColor, setShapeStrokeColor] = useState('#cf5b5b');
-  const [shapeFillColor, setShapeFillColor] = useState('#0000ff');
+  const [textAlignment, setTextAlignment] = useState<
+    "left" | "center" | "right"
+  >("left");
+  const [textBackgroundColor, setTextBackgroundColor] = useState<string>("");
+  const [noteBackgroundColor, setNoteBackgroundColor] = useState("#ffd54f");
+  const [shapeStrokeColor, setShapeStrokeColor] = useState("#cf5b5b");
+  const [shapeFillColor, setShapeFillColor] = useState("#0000ff");
   const [shapeOpacity, setShapeOpacity] = useState(50);
   const [shapeStrokeOpacity, setShapeStrokeOpacity] = useState(50);
   const [shapeFillOpacity, setShapeFillOpacity] = useState(50);
@@ -105,8 +107,8 @@ export const useAnnotationStyleState = (
             customData: {
               toolId,
               annotationToolId: toolId,
-              source: 'annotate',
-              author: 'User',
+              source: "annotate",
+              author: "User",
               createdAt: new Date().toISOString(),
               modifiedAt: new Date().toISOString(),
             },
@@ -114,25 +116,42 @@ export const useAnnotationStyleState = (
         : {};
 
       switch (toolId) {
-        case 'ink':
+        case "ink":
           return { color: inkColor, thickness: inkWidth, ...metadata };
-        case 'inkHighlighter':
+        case "inkHighlighter":
           return {
             color: highlightColor,
             opacity: highlightOpacity / 100,
             thickness: freehandHighlighterWidth,
             ...metadata,
           };
-        case 'highlight':
-          return { color: highlightColor, opacity: highlightOpacity / 100, ...metadata };
-        case 'underline':
-          return { color: underlineColor, opacity: underlineOpacity / 100, ...metadata };
-        case 'strikeout':
-          return { color: strikeoutColor, opacity: strikeoutOpacity / 100, ...metadata };
-        case 'squiggly':
-          return { color: squigglyColor, opacity: squigglyOpacity / 100, ...metadata };
-        case 'text': {
-          const textAlignNumber = textAlignment === 'left' ? 0 : textAlignment === 'center' ? 1 : 2;
+        case "highlight":
+          return {
+            color: highlightColor,
+            opacity: highlightOpacity / 100,
+            ...metadata,
+          };
+        case "underline":
+          return {
+            color: underlineColor,
+            opacity: underlineOpacity / 100,
+            ...metadata,
+          };
+        case "strikeout":
+          return {
+            color: strikeoutColor,
+            opacity: strikeoutOpacity / 100,
+            ...metadata,
+          };
+        case "squiggly":
+          return {
+            color: squigglyColor,
+            opacity: squigglyOpacity / 100,
+            ...metadata,
+          };
+        case "text": {
+          const textAlignNumber =
+            textAlignment === "left" ? 0 : textAlignment === "center" ? 1 : 2;
           return {
             color: textColor,
             textColor: textColor,
@@ -142,8 +161,8 @@ export const useAnnotationStyleState = (
             ...metadata,
           };
         }
-        case 'note': {
-          const noteFillColor = noteBackgroundColor || 'transparent';
+        case "note": {
+          const noteFillColor = noteBackgroundColor || "transparent";
           return {
             color: textColor,
             fillColor: noteFillColor,
@@ -151,9 +170,9 @@ export const useAnnotationStyleState = (
             ...metadata,
           };
         }
-        case 'square':
-        case 'circle':
-        case 'polygon':
+        case "square":
+        case "circle":
+        case "polygon":
           return {
             color: shapeFillColor,
             strokeColor: shapeStrokeColor,
@@ -163,9 +182,9 @@ export const useAnnotationStyleState = (
             borderWidth: shapeThickness,
             ...metadata,
           };
-        case 'line':
-        case 'polyline':
-        case 'lineArrow':
+        case "line":
+        case "polyline":
+        case "lineArrow":
           return {
             color: shapeStrokeColor,
             strokeColor: shapeStrokeColor,
@@ -173,9 +192,11 @@ export const useAnnotationStyleState = (
             borderWidth: shapeThickness,
             ...metadata,
           };
-        case 'stamp': {
+        case "stamp": {
           const pdfSize =
-            extras?.stampImageSize && cssToPdfSize ? cssToPdfSize(extras.stampImageSize) : undefined;
+            extras?.stampImageSize && cssToPdfSize
+              ? cssToPdfSize(extras.stampImageSize)
+              : undefined;
           return {
             imageSrc: extras?.stampImageData,
             ...(pdfSize ? { imageSize: pdfSize } : {}),
@@ -210,20 +231,21 @@ export const useAnnotationStyleState = (
       textSize,
       underlineColor,
       underlineOpacity,
-    ]
+    ],
   );
 
   const getActiveColor = useCallback(
     (target: string | null) => {
-      if (target === 'ink') return inkColor;
-      if (target === 'highlight' || target === 'inkHighlighter') return highlightColor;
-      if (target === 'underline') return underlineColor;
-      if (target === 'strikeout') return strikeoutColor;
-      if (target === 'squiggly') return squigglyColor;
-      if (target === 'shapeStroke') return shapeStrokeColor;
-      if (target === 'shapeFill') return shapeFillColor;
-      if (target === 'textBackground') return textBackgroundColor || '#ffffff';
-      if (target === 'noteBackground') return noteBackgroundColor || '#ffffff';
+      if (target === "ink") return inkColor;
+      if (target === "highlight" || target === "inkHighlighter")
+        return highlightColor;
+      if (target === "underline") return underlineColor;
+      if (target === "strikeout") return strikeoutColor;
+      if (target === "squiggly") return squigglyColor;
+      if (target === "shapeStroke") return shapeStrokeColor;
+      if (target === "shapeFill") return shapeFillColor;
+      if (target === "textBackground") return textBackgroundColor || "#ffffff";
+      if (target === "noteBackground") return noteBackgroundColor || "#ffffff";
       return textColor;
     },
     [
@@ -237,7 +259,7 @@ export const useAnnotationStyleState = (
       textBackgroundColor,
       textColor,
       underlineColor,
-    ]
+    ],
   );
 
   const styleState: StyleState = useMemo(
@@ -288,7 +310,7 @@ export const useAnnotationStyleState = (
       textSize,
       underlineColor,
       underlineOpacity,
-    ]
+    ],
   );
 
   const styleActions: StyleActions = {
diff --git a/frontend/src/core/tools/formFill/ButtonAppearanceOverlay.tsx b/frontend/src/core/tools/formFill/ButtonAppearanceOverlay.tsx
index 5d6c00e455..27e1b18d7c 100644
--- a/frontend/src/core/tools/formFill/ButtonAppearanceOverlay.tsx
+++ b/frontend/src/core/tools/formFill/ButtonAppearanceOverlay.tsx
@@ -8,8 +8,11 @@
  * Uses the same EPDF_RenderAnnotBitmap / FPDF_FFLDraw pipeline as
  * SignatureFieldOverlay to produce the button's native PDF appearance.
  */
-import React, { useEffect, useMemo, useRef, useState, memo } from 'react';
-import { renderButtonFieldAppearances, type SignatureFieldAppearance } from '@app/services/pdfiumService';
+import React, { useEffect, useMemo, useRef, useState, memo } from "react";
+import {
+  renderButtonFieldAppearances,
+  type SignatureFieldAppearance,
+} from "@app/services/pdfiumService";
 
 interface ButtonAppearanceOverlayProps {
   pageIndex: number;
@@ -20,13 +23,21 @@ interface ButtonAppearanceOverlayProps {
 let _cachedSource: File | Blob | null = null;
 let _cachePromise: Promise<SignatureFieldAppearance[]> | null = null;
 
-async function resolveButtonAppearances(source: File | Blob): Promise<SignatureFieldAppearance[]> {
+async function resolveButtonAppearances(
+  source: File | Blob,
+): Promise<SignatureFieldAppearance[]> {
   if (source === _cachedSource && _cachePromise) return _cachePromise;
   _cachedSource = source;
-  _cachePromise = source.arrayBuffer().then((buf) => renderButtonFieldAppearances(buf));
+  _cachePromise = source
+    .arrayBuffer()
+    .then((buf) => renderButtonFieldAppearances(buf));
   return _cachePromise;
 }
-function ButtonBitmapCanvas({ imageData, cssWidth, cssHeight }: {
+function ButtonBitmapCanvas({
+  imageData,
+  cssWidth,
+  cssHeight,
+}: {
   imageData: ImageData;
   cssWidth: number;
   cssHeight: number;
@@ -38,14 +49,14 @@ function ButtonBitmapCanvas({ imageData, cssWidth, cssHeight }: {
     if (!canvas) return;
     canvas.width = imageData.width;
     canvas.height = imageData.height;
-    const ctx = canvas.getContext('2d');
+    const ctx = canvas.getContext("2d");
     if (ctx) ctx.putImageData(imageData, 0, 0);
   }, [imageData]);
 
   return (
     <canvas
       ref={canvasRef}
-      style={{ width: cssWidth, height: cssHeight, display: 'block' }}
+      style={{ width: cssWidth, height: cssHeight, display: "block" }}
     />
   );
 }
@@ -55,19 +66,33 @@ function ButtonAppearanceOverlayInner({
   pageWidth,
   pageHeight,
 }: ButtonAppearanceOverlayProps) {
-  const [appearances, setAppearances] = useState<SignatureFieldAppearance[]>([]);
+  const [appearances, setAppearances] = useState<SignatureFieldAppearance[]>(
+    [],
+  );
 
   useEffect(() => {
-    if (!pdfSource) { setAppearances([]); return; }
+    if (!pdfSource) {
+      setAppearances([]);
+      return;
+    }
     let cancelled = false;
     resolveButtonAppearances(pdfSource)
-      .then((res) => { if (!cancelled) setAppearances(res); })
-      .catch(() => { if (!cancelled) setAppearances([]); });
-    return () => { cancelled = true; };
+      .then((res) => {
+        if (!cancelled) setAppearances(res);
+      })
+      .catch(() => {
+        if (!cancelled) setAppearances([]);
+      });
+    return () => {
+      cancelled = true;
+    };
   }, [pdfSource]);
 
   const pageAppearances = useMemo(
-    () => appearances.filter((a) => a.pageIndex === pageIndex && a.imageData !== null),
+    () =>
+      appearances.filter(
+        (a) => a.pageIndex === pageIndex && a.imageData !== null,
+      ),
     [appearances, pageIndex],
   );
 
@@ -76,34 +101,36 @@ function ButtonAppearanceOverlayInner({
   return (
     <div
       style={{
-        position: 'absolute',
+        position: "absolute",
         top: 0,
         left: 0,
-        width: '100%',
-        height: '100%',
-        pointerEvents: 'none',
+        width: "100%",
+        height: "100%",
+        pointerEvents: "none",
         zIndex: 4,
       }}
       data-button-appearance-page={pageIndex}
     >
       {pageAppearances.map((btn, idx) => {
-        const sx = btn.sourcePageWidth  > 0 ? pageWidth  / btn.sourcePageWidth  : 1;
-        const sy = btn.sourcePageHeight > 0 ? pageHeight / btn.sourcePageHeight : 1;
-        const left   = btn.x * sx;
-        const top    = btn.y * sy;
-        const width  = btn.width  * sx;
+        const sx =
+          btn.sourcePageWidth > 0 ? pageWidth / btn.sourcePageWidth : 1;
+        const sy =
+          btn.sourcePageHeight > 0 ? pageHeight / btn.sourcePageHeight : 1;
+        const left = btn.x * sx;
+        const top = btn.y * sy;
+        const width = btn.width * sx;
         const height = btn.height * sy;
 
         return (
           <div
             key={`btn-appearance-${btn.fieldName}-${idx}`}
             style={{
-              position: 'absolute',
+              position: "absolute",
               left,
               top,
               width,
               height,
-              overflow: 'hidden',
+              overflow: "hidden",
             }}
           >
             <ButtonBitmapCanvas
diff --git a/frontend/src/core/tools/formFill/FieldInput.tsx b/frontend/src/core/tools/formFill/FieldInput.tsx
index 979822468d..dfe6b7b23c 100644
--- a/frontend/src/core/tools/formFill/FieldInput.tsx
+++ b/frontend/src/core/tools/formFill/FieldInput.tsx
@@ -5,7 +5,7 @@
  * Each instance subscribes to its own field value via useFieldValue(),
  * so only the active widget re-renders when its value changes.
  */
-import React, { useCallback, memo } from 'react';
+import React, { useCallback, memo } from "react";
 import {
   TextInput,
   Textarea,
@@ -14,9 +14,9 @@ import {
   Select,
   MultiSelect,
   Stack,
-} from '@mantine/core';
-import { useFieldValue } from '@app/tools/formFill/FormFillContext';
-import type { FormField } from '@app/tools/formFill/types';
+} from "@mantine/core";
+import { useFieldValue } from "@app/tools/formFill/FormFillContext";
+import type { FormField } from "@app/tools/formFill/types";
 
 function FieldInputInner({
   field,
@@ -29,11 +29,11 @@ function FieldInputInner({
 }) {
   const onChange = useCallback(
     (v: string) => onValueChange(field.name, v),
-    [onValueChange, field.name]
+    [onValueChange, field.name],
   );
 
   switch (field.type) {
-    case 'text':
+    case "text":
       if (field.multiline) {
         return (
           <Textarea
@@ -45,7 +45,7 @@ function FieldInputInner({
             autosize
             minRows={2}
             maxRows={5}
-            styles={{ input: { fontSize: '0.8125rem' } }}
+            styles={{ input: { fontSize: "0.8125rem" } }}
           />
         );
       }
@@ -56,25 +56,25 @@ function FieldInputInner({
           onChange={(e) => onChange(e.currentTarget.value)}
           placeholder={field.tooltip || `Enter ${field.label}`}
           disabled={field.readOnly}
-          styles={{ input: { fontSize: '0.8125rem' } }}
+          styles={{ input: { fontSize: "0.8125rem" } }}
         />
       );
 
-    case 'checkbox': {
-      const isChecked = !!value && value !== 'Off';
-      const onValue = (field.widgets && field.widgets[0]?.exportValue) || 'Yes';
+    case "checkbox": {
+      const isChecked = !!value && value !== "Off";
+      const onValue = (field.widgets && field.widgets[0]?.exportValue) || "Yes";
       return (
         <Checkbox
           size="xs"
           checked={isChecked}
-          onChange={(e) => onChange(e.currentTarget.checked ? onValue : 'Off')}
+          onChange={(e) => onChange(e.currentTarget.checked ? onValue : "Off")}
           label={field.label}
           disabled={field.readOnly}
         />
       );
     }
 
-    case 'combobox': {
+    case "combobox": {
       const comboData = (field.options || []).map((opt, idx) => ({
         value: opt,
         label: (field.displayOptions && field.displayOptions[idx]) || opt,
@@ -84,37 +84,37 @@ function FieldInputInner({
           size="xs"
           data={comboData}
           value={value || null}
-          onChange={(v) => onChange(v || '')}
+          onChange={(v) => onChange(v || "")}
           placeholder={`Select ${field.label}`}
           clearable
           searchable
           disabled={field.readOnly}
           aria-label={field.label || field.name}
           aria-required={field.required}
-          styles={{ input: { fontSize: '0.8125rem' } }}
+          styles={{ input: { fontSize: "0.8125rem" } }}
         />
       );
     }
 
-    case 'listbox': {
+    case "listbox": {
       const listData = (field.options || []).map((opt, idx) => ({
         value: opt,
         label: (field.displayOptions && field.displayOptions[idx]) || opt,
       }));
       if (field.multiSelect) {
-        const selectedValues = value ? value.split(',').filter(Boolean) : [];
+        const selectedValues = value ? value.split(",").filter(Boolean) : [];
         return (
           <MultiSelect
             size="xs"
             data={listData}
             value={selectedValues}
-            onChange={(vals) => onChange(vals.join(','))}
+            onChange={(vals) => onChange(vals.join(","))}
             placeholder={`Select ${field.label}`}
             searchable
             disabled={field.readOnly}
             aria-label={field.label || field.name}
             aria-required={field.required}
-            styles={{ input: { fontSize: '0.8125rem' } }}
+            styles={{ input: { fontSize: "0.8125rem" } }}
           />
         );
       }
@@ -123,25 +123,26 @@ function FieldInputInner({
           size="xs"
           data={listData}
           value={value || null}
-          onChange={(v) => onChange(v || '')}
+          onChange={(v) => onChange(v || "")}
           placeholder={`Select ${field.label}`}
           clearable
           searchable
           disabled={field.readOnly}
           aria-label={field.label || field.name}
           aria-required={field.required}
-          styles={{ input: { fontSize: '0.8125rem' } }}
+          styles={{ input: { fontSize: "0.8125rem" } }}
         />
       );
     }
 
-    case 'radio': {
+    case "radio": {
       const radioOptions: { value: string; label: string }[] = [];
       if (field.widgets && field.widgets.length > 0) {
         for (let i = 0; i < field.widgets.length; i++) {
           const w = field.widgets[i];
           // Use widget index as value; display option label, export value, or index
-          const label = (field.options && field.options[i]) || w.exportValue || String(i);
+          const label =
+            (field.options && field.options[i]) || w.exportValue || String(i);
           radioOptions.push({ value: String(i), label });
         }
       }
@@ -176,7 +177,7 @@ function FieldInputInner({
           disabled={field.readOnly}
           aria-label={field.label || field.name}
           aria-required={field.required}
-          styles={{ input: { fontSize: '0.8125rem' } }}
+          styles={{ input: { fontSize: "0.8125rem" } }}
         />
       );
   }
@@ -196,7 +197,9 @@ export function FieldInput({
   onValueChange: (fieldName: string, value: string) => void;
 }) {
   const value = useFieldValue(field.name);
-  return <FieldInputBase field={field} value={value} onValueChange={onValueChange} />;
+  return (
+    <FieldInputBase field={field} value={value} onValueChange={onValueChange} />
+  );
 }
 
 export default FieldInput;
diff --git a/frontend/src/core/tools/formFill/FormFieldOverlay.tsx b/frontend/src/core/tools/formFill/FormFieldOverlay.tsx
index 14a0918a2a..db53794216 100644
--- a/frontend/src/core/tools/formFill/FormFieldOverlay.tsx
+++ b/frontend/src/core/tools/formFill/FormFieldOverlay.tsx
@@ -17,11 +17,18 @@
  * handles visual rotation via CSS transforms — same as TilingLayer,
  * AnnotationLayer, and LinkLayer.
  */
-import React, { useCallback, useMemo, memo } from 'react';
-import { useDocumentState } from '@embedpdf/core/react';
-import { useFormFill, useFieldValue } from '@app/tools/formFill/FormFillContext';
-import { useViewer } from '@app/contexts/ViewerContext';
-import type { FormField, WidgetCoordinates, ButtonAction } from '@app/tools/formFill/types';
+import React, { useCallback, useMemo, memo } from "react";
+import { useDocumentState } from "@embedpdf/core/react";
+import {
+  useFormFill,
+  useFieldValue,
+} from "@app/tools/formFill/FormFillContext";
+import { useViewer } from "@app/contexts/ViewerContext";
+import type {
+  FormField,
+  WidgetCoordinates,
+  ButtonAction,
+} from "@app/tools/formFill/types";
 
 /**
  * Execute PDF JavaScript in a minimally sandboxed context.
@@ -45,15 +52,32 @@ function executePdfJs(
   // 1. Static sanitization: Reject scripts with potentially harmful or unneeded keywords.
   // This blocks most elementary exploits and prevents prototype tampering.
   const forbidden = [
-    'window', 'document', 'fetch', 'xmlhttprequest', 'websocket', 'worker',
-    'eval', 'settimeout', 'setinterval', 'function', 'constructor',
-    '__proto__', 'prototype', 'globalthis', 'import', 'require'
+    "window",
+    "document",
+    "fetch",
+    "xmlhttprequest",
+    "websocket",
+    "worker",
+    "eval",
+    "settimeout",
+    "setinterval",
+    "function",
+    "constructor",
+    "__proto__",
+    "prototype",
+    "globalthis",
+    "import",
+    "require",
   ];
 
   const lowerJs = js.toLowerCase();
   for (const word of forbidden) {
     if (lowerJs.includes(word)) {
-      console.warn(`[PDF JS] Execution blocked: Script contains suspicious keyword "${word}".`, 'Script:', js);
+      console.warn(
+        `[PDF JS] Execution blocked: Script contains suspicious keyword "${word}".`,
+        "Script:",
+        js,
+      );
       return;
     }
   }
@@ -62,27 +86,37 @@ function executePdfJs(
   const doOpenUrl = (url: string) => {
     try {
       const u = new URL(url);
-      if (['http:', 'https:', 'mailto:'].includes(u.protocol)) {
-        window.open(url, '_blank', 'noopener,noreferrer');
+      if (["http:", "https:", "mailto:"].includes(u.protocol)) {
+        window.open(url, "_blank", "noopener,noreferrer");
       }
-    } catch { /* invalid URL — ignore */ }
+    } catch {
+      /* invalid URL — ignore */
+    }
   };
 
   const app = {
     print: (_params?: unknown) => handlers.print(),
-    alert: (msg: unknown) => { console.debug('[PDF JS] alert:', msg); },
+    alert: (msg: unknown) => {
+      console.debug("[PDF JS] alert:", msg);
+    },
     beep: () => {},
     response: () => null,
     execMenuItem: (item: string) => {
       switch (item) {
-        case 'Print': handlers.print(); break;
-        case 'Save':  handlers.save();  break;
-        case 'Close': break; // no-op in browser context
-        default: console.debug('[PDF JS] execMenuItem: unhandled item:', item);
+        case "Print":
+          handlers.print();
+          break;
+        case "Save":
+          handlers.save();
+          break;
+        case "Close":
+          break; // no-op in browser context
+        default:
+          console.debug("[PDF JS] execMenuItem: unhandled item:", item);
       }
     },
     // Prevent prototype walking
-    __proto__: null
+    __proto__: null,
   };
 
   const doc = {
@@ -91,10 +125,11 @@ function executePdfJs(
     saveAs: (_params?: unknown) => handlers.save(),
     submitForm: (urlOrParams: unknown) => {
       const url =
-        typeof urlOrParams === 'string'
+        typeof urlOrParams === "string"
           ? urlOrParams
-          : (urlOrParams as Record<string, unknown>)?.cURL as string ?? '';
-      if (url) doOpenUrl(url); else handlers.submitForm(url);
+          : (((urlOrParams as Record<string, unknown>)?.cURL as string) ?? "");
+      if (url) doOpenUrl(url);
+      else handlers.submitForm(url);
     },
     resetForm: (_fields?: unknown) => handlers.resetForm(),
     getField: (_name: string) => null,
@@ -106,9 +141,9 @@ function executePdfJs(
 
   // Stub event object — used by field calculation/validation scripts
   const event = {
-    value: '',
-    changeEx: '',
-    change: '',
+    value: "",
+    changeEx: "",
+    change: "",
     rc: true,
     willCommit: false,
     target: null as null,
@@ -117,11 +152,16 @@ function executePdfJs(
   try {
     // Pass doc, app, event as both `this` AND named parameters so scripts that
     // reference them as free variables (not just via `this`) work correctly.
-    const fn = new Function('app', 'doc', 'event', js);
+    const fn = new Function("app", "doc", "event", js);
     fn.call(doc, app, doc, event);
   } catch (err) {
     // Swallow errors from missing PDF APIs; log in debug mode for tracing
-    console.debug('[PDF JS] Script execution error (expected for unsupported APIs):', err, '\nScript:', js.slice(0, 200));
+    console.debug(
+      "[PDF JS] Script execution error (expected for unsupported APIs):",
+      err,
+      "\nScript:",
+      js.slice(0, 200),
+    );
   }
 }
 
@@ -163,31 +203,37 @@ function WidgetInputInner({
   const width = widget.width * scaleX;
   const height = widget.height * scaleY;
 
-  const borderColor = error ? '#f44336' : (isActive ? '#2196F3' : 'rgba(33, 150, 243, 0.4)');
+  const borderColor = error
+    ? "#f44336"
+    : isActive
+      ? "#2196F3"
+      : "rgba(33, 150, 243, 0.4)";
   const bgColor = error
-    ? '#FFEBEE' // Red 50 (Opaque)
-    : (isActive ? '#E3F2FD' : '#FFFFFF'); // Blue 50 (Opaque) : White (Opaque)
+    ? "#FFEBEE" // Red 50 (Opaque)
+    : isActive
+      ? "#E3F2FD"
+      : "#FFFFFF"; // Blue 50 (Opaque) : White (Opaque)
 
   const commonStyle: React.CSSProperties = {
-    position: 'absolute',
+    position: "absolute",
     left,
     top,
     width,
     height,
     zIndex: 10,
-    boxSizing: 'border-box',
+    boxSizing: "border-box",
     border: `1px solid ${borderColor}`,
     borderRadius: 1,
-    background: isActive ? bgColor : 'transparent',
-    transition: 'border-color 0.15s, background 0.15s, box-shadow 0.15s',
+    background: isActive ? bgColor : "transparent",
+    transition: "border-color 0.15s, background 0.15s, box-shadow 0.15s",
     boxShadow:
-      isActive && field.type !== 'radio' && field.type !== 'checkbox'
-        ? `0 0 0 2px ${error ? 'rgba(244, 67, 54, 0.25)' : 'rgba(33, 150, 243, 0.25)'}`
-        : 'none',
-    cursor: field.readOnly ? 'default' : 'text',
-    pointerEvents: 'auto',
-    display: 'flex',
-    alignItems: field.multiline ? 'stretch' : 'center',
+      isActive && field.type !== "radio" && field.type !== "checkbox"
+        ? `0 0 0 2px ${error ? "rgba(244, 67, 54, 0.25)" : "rgba(33, 150, 243, 0.25)"}`
+        : "none",
+    cursor: field.readOnly ? "default" : "text",
+    pointerEvents: "auto",
+    display: "flex",
+    alignItems: field.multiline ? "stretch" : "center",
   };
 
   const stopPropagation = (e: React.SyntheticEvent) => {
@@ -228,29 +274,29 @@ function WidgetInputInner({
   const fontSize = widget.fontSize
     ? widget.fontSize * scaleY
     : field.multiline
-      ? Math.max(6, Math.min(height * 0.60, 14))
+      ? Math.max(6, Math.min(height * 0.6, 14))
       : Math.max(6, height * 0.65);
 
   const inputBaseStyle: React.CSSProperties = {
-    width: '100%',
-    height: '100%',
-    border: 'none',
-    outline: 'none',
-    background: 'transparent',
+    width: "100%",
+    height: "100%",
+    border: "none",
+    outline: "none",
+    background: "transparent",
     padding: 0,
     paddingLeft: `${Math.max(2, 4 * scaleX)}px`,
     paddingRight: `${Math.max(2, 4 * scaleX)}px`,
     fontSize: `${fontSize}px`,
-    fontFamily: 'Helvetica, Arial, sans-serif',
-    color: '#000',
-    boxSizing: 'border-box',
-    lineHeight: 'normal',
+    fontFamily: "Helvetica, Arial, sans-serif",
+    color: "#000",
+    boxSizing: "border-box",
+    lineHeight: "normal",
   };
 
   const handleFocus = () => onFocus(field.name);
 
   switch (field.type) {
-    case 'text':
+    case "text":
       return (
         <div {...commonProps} title={error || field.tooltip || field.label}>
           {field.multiline ? (
@@ -262,8 +308,8 @@ function WidgetInputInner({
               placeholder={field.label}
               style={{
                 ...inputBaseStyle,
-                resize: 'none',
-                overflow: 'auto',
+                resize: "none",
+                overflow: "auto",
                 paddingTop: `${Math.max(1, 2 * scaleY)}px`,
               }}
               {...captureStopProps}
@@ -288,49 +334,56 @@ function WidgetInputInner({
         </div>
       );
 
-    case 'checkbox': {
+    case "checkbox": {
       // Checkbox is checked when value is anything other than 'Off' or empty
-      const isChecked = !!value && value !== 'Off';
+      const isChecked = !!value && value !== "Off";
       // When toggling on, use the widget's exportValue (e.g. 'Red', 'Blue') or fall back to 'Yes'
-      const onValue = widget.exportValue || 'Yes';
+      const onValue = widget.exportValue || "Yes";
       return (
         <div
           {...commonProps}
           style={{
             ...commonStyle,
-            border: isActive ? commonStyle.border : '1px solid rgba(0,0,0,0.15)',
-            background: isActive ? bgColor : 'transparent',
-            display: 'flex',
-            alignItems: 'center',
-            justifyContent: 'center', // Keep center for checkboxes as they are usually square hitboxes
-            cursor: field.readOnly ? 'default' : 'pointer',
+            border: isActive
+              ? commonStyle.border
+              : "1px solid rgba(0,0,0,0.15)",
+            background: isActive ? bgColor : "transparent",
+            display: "flex",
+            alignItems: "center",
+            justifyContent: "center", // Keep center for checkboxes as they are usually square hitboxes
+            cursor: field.readOnly ? "default" : "pointer",
           }}
           title={error || field.tooltip || field.label}
           onClick={(e) => {
             if (field.readOnly) return;
             handleFocus();
-            onChange(field.name, isChecked ? 'Off' : onValue);
+            onChange(field.name, isChecked ? "Off" : onValue);
             stopPropagation(e);
           }}
         >
           <span
             style={{
-              width: '85%',
-              height: '85%',
+              width: "85%",
+              height: "85%",
               maxWidth: height * 0.9, // Prevent it from getting too wide in rectangular boxes
               maxHeight: width * 0.9,
               fontSize: `${Math.max(10, height * 0.75)}px`,
               lineHeight: 1,
-              color: isChecked ? '#2196F3' : 'transparent',
-              background: '#FFF',
-              border: isChecked || isActive ? '1px solid #2196F3' : '1.5px solid #666',
+              color: isChecked ? "#2196F3" : "transparent",
+              background: "#FFF",
+              border:
+                isChecked || isActive
+                  ? "1px solid #2196F3"
+                  : "1.5px solid #666",
               borderRadius: 2,
-              display: 'flex',
-              alignItems: 'center',
-              justifyContent: 'center',
+              display: "flex",
+              alignItems: "center",
+              justifyContent: "center",
               fontWeight: 700,
-              userSelect: 'none',
-              boxShadow: isActive ? '0 0 0 2px rgba(33, 150, 243, 0.2)' : 'none',
+              userSelect: "none",
+              boxShadow: isActive
+                ? "0 0 0 2px rgba(33, 150, 243, 0.2)"
+                : "none",
             }}
           >
             ✓
@@ -339,21 +392,26 @@ function WidgetInputInner({
       );
     }
 
-    case 'combobox':
-    case 'listbox': {
+    case "combobox":
+    case "listbox": {
       const inputId = `${field.name}_${widget.pageIndex}_${widget.x}_${widget.y}`;
 
       // For multi-select, value should be an array
       // We store as comma-separated string, so parse it
       const selectValue = field.multiSelect
-        ? (value ? value.split(',').map(v => v.trim()) : [])
+        ? value
+          ? value.split(",").map((v) => v.trim())
+          : []
         : value;
 
       const handleSelectChange = (e: React.ChangeEvent<HTMLSelectElement>) => {
         if (field.multiSelect) {
           // For multi-select, join selected options with comma
-          const selected = Array.from(e.target.selectedOptions, opt => opt.value);
-          onChange(field.name, selected.join(','));
+          const selected = Array.from(
+            e.target.selectedOptions,
+            (opt) => opt.value,
+          );
+          onChange(field.name, selected.join(","));
         } else {
           onChange(field.name, e.target.value);
         }
@@ -372,8 +430,9 @@ function WidgetInputInner({
               ...inputBaseStyle,
               padding: 0,
               paddingLeft: 2,
-              appearance: 'auto',
-              WebkitAppearance: 'auto' as React.CSSProperties['WebkitAppearance'],
+              appearance: "auto",
+              WebkitAppearance:
+                "auto" as React.CSSProperties["WebkitAppearance"],
             }}
             aria-label={field.label || field.name}
             aria-required={field.required}
@@ -391,7 +450,7 @@ function WidgetInputInner({
       );
     }
 
-    case 'radio': {
+    case "radio": {
       // Identify this widget by its index within the field's widgets array.
       // This avoids issues with duplicate exportValues (e.g., all "Yes").
       const widgetIndex = field.widgets?.indexOf(widget) ?? -1;
@@ -403,15 +462,22 @@ function WidgetInputInner({
           {...commonProps}
           style={{
             ...commonStyle,
-            border: isActive ? commonStyle.border : 'none',
-            background: 'transparent',
-            display: 'flex',
-            alignItems: 'center',
-            justifyContent: 'flex-start', // Align to start (left) instead of center for radio buttons
-            paddingLeft: Math.max(1, (height - Math.min(width, height) * 0.8) / 2), // Slight offset
-            cursor: field.readOnly ? 'default' : 'pointer',
+            border: isActive ? commonStyle.border : "none",
+            background: "transparent",
+            display: "flex",
+            alignItems: "center",
+            justifyContent: "flex-start", // Align to start (left) instead of center for radio buttons
+            paddingLeft: Math.max(
+              1,
+              (height - Math.min(width, height) * 0.8) / 2,
+            ), // Slight offset
+            cursor: field.readOnly ? "default" : "pointer",
           }}
-          title={error || field.tooltip || `${field.label}: ${widget.exportValue || widgetIndexStr}`}
+          title={
+            error ||
+            field.tooltip ||
+            `${field.label}: ${widget.exportValue || widgetIndexStr}`
+          }
           onClick={(e) => {
             if (field.readOnly || value === widgetIndexStr) return; // Don't deselect radio buttons
             handleFocus();
@@ -423,53 +489,66 @@ function WidgetInputInner({
             style={{
               width: Math.min(width, height) * 0.8,
               height: Math.min(width, height) * 0.8,
-              borderRadius: '50%',
-              border: `1.5px solid ${isSelected ? '#2196F3' : isActive ? '#2196F3' : '#999'}`,
-              background: isSelected ? '#2196F3' : 'transparent',
-              display: 'flex',
-              alignItems: 'center',
-              justifyContent: 'center',
-              boxShadow: isSelected ? 'inset 0 0 0 2px white' : 'none',
-              transition: 'background 0.15s, border-color 0.15s',
+              borderRadius: "50%",
+              border: `1.5px solid ${isSelected ? "#2196F3" : isActive ? "#2196F3" : "#999"}`,
+              background: isSelected ? "#2196F3" : "transparent",
+              display: "flex",
+              alignItems: "center",
+              justifyContent: "center",
+              boxShadow: isSelected ? "inset 0 0 0 2px white" : "none",
+              transition: "background 0.15s, border-color 0.15s",
             }}
           />
         </div>
       );
     }
 
-    case 'signature':
+    case "signature":
       // Signature fields are handled entirely by SignatureFieldOverlay (bitmap canvas).
       // Rendering a placeholder here creates a visible grey overlay on top of the
       // signature appearance, so we skip it entirely.
       return null;
 
-    case 'button': {
+    case "button": {
       // Transparent hit-target only — visual appearance is rendered by ButtonAppearanceOverlay
       // (which paints the PDF's native /AP bitmap onto a canvas behind this div).
-      const buttonLabel = field.buttonLabel || field.value || field.label || 'Button';
+      const buttonLabel =
+        field.buttonLabel || field.value || field.label || "Button";
       const isClickable = !field.readOnly;
 
-      let actionHint = '';
+      let actionHint = "";
       if (field.buttonAction) {
         switch (field.buttonAction.type) {
-          case 'named': actionHint = field.buttonAction.namedAction ?? ''; break;
-          case 'resetForm': actionHint = 'Reset Form'; break;
-          case 'submitForm': actionHint = `Submit to: ${field.buttonAction.url ?? ''}`.trim(); break;
-          case 'uri': actionHint = field.buttonAction.url ?? ''; break;
-          case 'javascript': actionHint = 'Script'; break;
+          case "named":
+            actionHint = field.buttonAction.namedAction ?? "";
+            break;
+          case "resetForm":
+            actionHint = "Reset Form";
+            break;
+          case "submitForm":
+            actionHint = `Submit to: ${field.buttonAction.url ?? ""}`.trim();
+            break;
+          case "uri":
+            actionHint = field.buttonAction.url ?? "";
+            break;
+          case "javascript":
+            actionHint = "Script";
+            break;
         }
       }
-      const titleText = field.tooltip || (actionHint ? `${buttonLabel} (${actionHint})` : buttonLabel);
+      const titleText =
+        field.tooltip ||
+        (actionHint ? `${buttonLabel} (${actionHint})` : buttonLabel);
 
       return (
         <div
           {...commonProps}
           style={{
             ...commonStyle,
-            background: 'transparent',
-            border: 'none',
-            boxShadow: 'none',
-            cursor: isClickable ? 'pointer' : 'default',
+            background: "transparent",
+            border: "none",
+            boxShadow: "none",
+            cursor: isClickable ? "pointer" : "default",
           }}
           title={titleText}
           role="button"
@@ -481,7 +560,7 @@ function WidgetInputInner({
             stopPropagation(e);
           }}
           onKeyDown={(e) => {
-            if (isClickable && (e.key === 'Enter' || e.key === ' ')) {
+            if (isClickable && (e.key === "Enter" || e.key === " ")) {
               e.preventDefault();
               onButtonClick(field, field.buttonAction);
             }
@@ -513,7 +592,7 @@ const WidgetInput = memo(WidgetInputInner);
 interface FormFieldOverlayProps {
   documentId: string;
   pageIndex: number;
-  pageWidth: number;  // rendered CSS pixel width (from renderPage callback)
+  pageWidth: number; // rendered CSS pixel width (from renderPage callback)
   pageHeight: number; // rendered CSS pixel height
   /** File identity — if provided, overlay only renders when context fields match this file */
   fileId?: string | null;
@@ -526,7 +605,8 @@ export function FormFieldOverlay({
   pageHeight,
   fileId,
 }: FormFieldOverlayProps) {
-  const { setValue, setActiveField, fieldsByPage, state, forFileId } = useFormFill();
+  const { setValue, setActiveField, fieldsByPage, state, forFileId } =
+    useFormFill();
   const { activeFieldName, validationErrors } = state;
   const { printActions, scrollActions, exportActions } = useViewer();
 
@@ -539,7 +619,10 @@ export function FormFieldOverlay({
     if (!pdfPage || !pdfPage.size || !pageWidth || !pageHeight) {
       const s = documentState?.scale ?? 1;
       if (pageIndex === 0) {
-        console.debug('[FormFieldOverlay] page 0 using fallback scale=%f (missing pdfPage.size)', s);
+        console.debug(
+          "[FormFieldOverlay] page 0 using fallback scale=%f (missing pdfPage.size)",
+          s,
+        );
       }
       return { scaleX: s, scaleY: s };
     }
@@ -548,8 +631,14 @@ export function FormFieldOverlay({
     const sy = pageHeight / pdfPage.size.height;
     if (pageIndex === 0) {
       console.debug(
-        '[FormFieldOverlay] page 0 scale: pageW=%f pageH=%f pdfW=%f pdfH=%f → scaleX=%f scaleY=%f docScale=%f',
-        pageWidth, pageHeight, pdfPage.size.width, pdfPage.size.height, sx, sy, documentState?.scale,
+        "[FormFieldOverlay] page 0 scale: pageW=%f pageH=%f pdfW=%f pdfH=%f → scaleX=%f scaleY=%f docScale=%f",
+        pageWidth,
+        pageHeight,
+        pdfPage.size.width,
+        pdfPage.size.height,
+        sx,
+        sy,
+        documentState?.scale,
       );
     }
     // pdfPage.size contains un-rotated dimensions from the engine;
@@ -559,17 +648,17 @@ export function FormFieldOverlay({
 
   const pageFields = useMemo(
     () => fieldsByPage.get(pageIndex) || [],
-    [fieldsByPage, pageIndex]
+    [fieldsByPage, pageIndex],
   );
 
   const handleFocus = useCallback(
     (fieldName: string) => setActiveField(fieldName),
-    [setActiveField]
+    [setActiveField],
   );
 
   const handleChange = useCallback(
     (fieldName: string, value: string) => setValue(fieldName, value),
-    [setValue]
+    [setValue],
   );
 
   const handleButtonClick = useCallback(
@@ -577,19 +666,23 @@ export function FormFieldOverlay({
       const doOpenUrl = (url: string) => {
         try {
           const u = new URL(url);
-          if (['http:', 'https:', 'mailto:'].includes(u.protocol)) {
-            window.open(url, '_blank', 'noopener,noreferrer');
+          if (["http:", "https:", "mailto:"].includes(u.protocol)) {
+            window.open(url, "_blank", "noopener,noreferrer");
           }
-        } catch { /* invalid URL */ }
+        } catch {
+          /* invalid URL */
+        }
       };
       const doResetForm = () => {
-        for (const f of state.fields) setValue(f.name, f.value ?? '');
+        for (const f of state.fields) setValue(f.name, f.value ?? "");
+      };
+      const doSave = () => {
+        exportActions.saveAsCopy();
       };
-      const doSave = () => { exportActions.saveAsCopy(); };
 
       if (!action) {
         // Action extraction failed — fall back to label matching as a last resort
-        const label = (field.buttonLabel || field.label || '').toLowerCase();
+        const label = (field.buttonLabel || field.label || "").toLowerCase();
         if (/print/.test(label)) printActions.print();
         else if (/save|download/.test(label)) doSave();
         else if (/reset|clear/.test(label)) doResetForm();
@@ -597,24 +690,36 @@ export function FormFieldOverlay({
       }
 
       switch (action.type) {
-        case 'named':
+        case "named":
           switch (action.namedAction) {
-            case 'Print': printActions.print(); break;
-            case 'Save': doSave(); break;
-            case 'NextPage': scrollActions.scrollToNextPage(); break;
-            case 'PrevPage': scrollActions.scrollToPreviousPage(); break;
-            case 'FirstPage': scrollActions.scrollToFirstPage(); break;
-            case 'LastPage': scrollActions.scrollToLastPage(); break;
+            case "Print":
+              printActions.print();
+              break;
+            case "Save":
+              doSave();
+              break;
+            case "NextPage":
+              scrollActions.scrollToNextPage();
+              break;
+            case "PrevPage":
+              scrollActions.scrollToPreviousPage();
+              break;
+            case "FirstPage":
+              scrollActions.scrollToFirstPage();
+              break;
+            case "LastPage":
+              scrollActions.scrollToLastPage();
+              break;
           }
           break;
-        case 'resetForm':
+        case "resetForm":
           doResetForm();
           break;
-        case 'submitForm':
-        case 'uri':
+        case "submitForm":
+        case "uri":
           if (action.url) doOpenUrl(action.url);
           break;
-        case 'javascript':
+        case "javascript":
           // Execute in a sandboxed PDF JS environment instead of just logging
           if (action.javascript) {
             executePdfJs(action.javascript, {
@@ -645,12 +750,12 @@ export function FormFieldOverlay({
   return (
     <div
       style={{
-        position: 'absolute',
+        position: "absolute",
         top: 0,
         left: 0,
-        width: '100%',
-        height: '100%',
-        pointerEvents: 'none', // allow click-through except on widgets
+        width: "100%",
+        height: "100%",
+        pointerEvents: "none", // allow click-through except on widgets
         zIndex: 5, // above TilingLayer, below LinkLayer
       }}
       data-form-overlay-page={pageIndex}
@@ -676,7 +781,7 @@ export function FormFieldOverlay({
                 onButtonClick={handleButtonClick}
               />
             );
-          })
+          }),
       )}
     </div>
   );
diff --git a/frontend/src/core/tools/formFill/FormFieldSidebar.tsx b/frontend/src/core/tools/formFill/FormFieldSidebar.tsx
index 949b530ffd..946afc360b 100644
--- a/frontend/src/core/tools/formFill/FormFieldSidebar.tsx
+++ b/frontend/src/core/tools/formFill/FormFieldSidebar.tsx
@@ -7,7 +7,7 @@
  * - Shared FieldInput component (no duplication)
  * - Better visual hierarchy and spacing
  */
-import React, { useCallback, useEffect, useRef } from 'react';
+import React, { useCallback, useEffect, useRef } from "react";
 import {
   Box,
   Text,
@@ -15,25 +15,25 @@ import {
   Badge,
   Tooltip,
   ActionIcon,
-} from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { useFormFill } from '@app/tools/formFill/FormFillContext';
-import { FieldInput } from '@app/tools/formFill/FieldInput';
-import { FIELD_TYPE_ICON, FIELD_TYPE_COLOR } from '@app/tools/formFill/fieldMeta';
-import type { FormField } from '@app/tools/formFill/types';
-import CloseIcon from '@mui/icons-material/Close';
-import TextFieldsIcon from '@mui/icons-material/TextFields';
-import styles from '@app/tools/formFill/FormFill.module.css';
+} from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import { useFormFill } from "@app/tools/formFill/FormFillContext";
+import { FieldInput } from "@app/tools/formFill/FieldInput";
+import {
+  FIELD_TYPE_ICON,
+  FIELD_TYPE_COLOR,
+} from "@app/tools/formFill/fieldMeta";
+import type { FormField } from "@app/tools/formFill/types";
+import CloseIcon from "@mui/icons-material/Close";
+import TextFieldsIcon from "@mui/icons-material/TextFields";
+import styles from "@app/tools/formFill/FormFill.module.css";
 
 interface FormFieldSidebarProps {
   visible: boolean;
   onToggle: () => void;
 }
 
-export function FormFieldSidebar({
-  visible,
-  onToggle,
-}: FormFieldSidebarProps) {
+export function FormFieldSidebar({ visible, onToggle }: FormFieldSidebarProps) {
   useTranslation();
   const { state, setValue, setActiveField } = useFormFill();
   const { fields, activeFieldName, loading } = state;
@@ -42,8 +42,8 @@ export function FormFieldSidebar({
   useEffect(() => {
     if (activeFieldName && activeFieldRef.current) {
       activeFieldRef.current.scrollIntoView({
-        behavior: 'smooth',
-        block: 'center',
+        behavior: "smooth",
+        block: "center",
       });
     }
   }, [activeFieldName]);
@@ -52,14 +52,14 @@ export function FormFieldSidebar({
     (fieldName: string) => {
       setActiveField(fieldName);
     },
-    [setActiveField]
+    [setActiveField],
   );
 
   const handleValueChange = useCallback(
     (fieldName: string, value: string) => {
       setValue(fieldName, value);
     },
-    [setValue]
+    [setValue],
   );
 
   if (!visible) return null;
@@ -67,7 +67,9 @@ export function FormFieldSidebar({
   const fieldsByPage = new Map<number, FormField[]>();
   for (const field of fields) {
     const pageIndex =
-      field.widgets && field.widgets.length > 0 ? field.widgets[0].pageIndex : 0;
+      field.widgets && field.widgets.length > 0
+        ? field.widgets[0].pageIndex
+        : 0;
     if (!fieldsByPage.has(pageIndex)) {
       fieldsByPage.set(pageIndex, []);
     }
@@ -78,31 +80,33 @@ export function FormFieldSidebar({
   return (
     <Box
       style={{
-        position: 'fixed',
+        position: "fixed",
         top: 0,
         right: 0,
-        width: '18.5rem',
-        height: '100%',
+        width: "18.5rem",
+        height: "100%",
         zIndex: 999,
-        display: 'flex',
-        flexDirection: 'column',
-        background: 'var(--bg-toolbar, var(--mantine-color-body))',
-        borderLeft: '1px solid var(--border-subtle, var(--mantine-color-default-border))',
-        boxShadow: '-4px 0 16px rgba(0,0,0,0.08)',
+        display: "flex",
+        flexDirection: "column",
+        background: "var(--bg-toolbar, var(--mantine-color-body))",
+        borderLeft:
+          "1px solid var(--border-subtle, var(--mantine-color-default-border))",
+        boxShadow: "-4px 0 16px rgba(0,0,0,0.08)",
       }}
     >
       {/* Header */}
       <div
         style={{
-          display: 'flex',
-          alignItems: 'center',
-          justifyContent: 'space-between',
-          padding: '0.625rem 0.75rem',
-          borderBottom: '1px solid var(--border-subtle, var(--mantine-color-default-border))',
+          display: "flex",
+          alignItems: "center",
+          justifyContent: "space-between",
+          padding: "0.625rem 0.75rem",
+          borderBottom:
+            "1px solid var(--border-subtle, var(--mantine-color-default-border))",
           flexShrink: 0,
         }}
       >
-        <div style={{ display: 'flex', alignItems: 'center', gap: '0.5rem' }}>
+        <div style={{ display: "flex", alignItems: "center", gap: "0.5rem" }}>
           <TextFieldsIcon sx={{ fontSize: 18, opacity: 0.7 }} />
           <Text fw={600} size="sm">
             Form Fields
@@ -111,7 +115,12 @@ export function FormFieldSidebar({
             {fields.length}
           </Badge>
         </div>
-        <ActionIcon variant="subtle" size="sm" onClick={onToggle} aria-label="Close sidebar">
+        <ActionIcon
+          variant="subtle"
+          size="sm"
+          onClick={onToggle}
+          aria-label="Close sidebar"
+        >
           <CloseIcon sx={{ fontSize: 16 }} />
         </ActionIcon>
       </div>
@@ -154,9 +163,7 @@ export function FormFieldSidebar({
                     <div
                       key={field.name}
                       ref={isActive ? activeFieldRef : undefined}
-                      className={`${styles.fieldCard} ${
-                        isActive ? styles.fieldCardActive : ''
-                      }`}
+                      className={`${styles.fieldCard} ${isActive ? styles.fieldCardActive : ""}`}
                       onClick={() => handleFieldClick(field.name)}
                     >
                       <div className={styles.fieldHeader}>
@@ -165,7 +172,7 @@ export function FormFieldSidebar({
                             className={styles.fieldTypeIcon}
                             style={{
                               color: `var(--mantine-color-${FIELD_TYPE_COLOR[field.type]}-6)`,
-                              fontSize: '0.875rem',
+                              fontSize: "0.875rem",
                             }}
                           >
                             {FIELD_TYPE_ICON[field.type]}
@@ -179,21 +186,18 @@ export function FormFieldSidebar({
                         )}
                       </div>
 
-                      {field.type !== 'button' && field.type !== 'signature' && (
-                        <div
-                          className={styles.fieldInputWrap}
-                        >
-                          <FieldInput
-                            field={field}
-                            onValueChange={handleValueChange}
-                          />
-                        </div>
-                      )}
+                      {field.type !== "button" &&
+                        field.type !== "signature" && (
+                          <div className={styles.fieldInputWrap}>
+                            <FieldInput
+                              field={field}
+                              onValueChange={handleValueChange}
+                            />
+                          </div>
+                        )}
 
                       {field.tooltip && (
-                        <div className={styles.fieldHint}>
-                          {field.tooltip}
-                        </div>
+                        <div className={styles.fieldHint}>{field.tooltip}</div>
                       )}
                     </div>
                   );
diff --git a/frontend/src/core/tools/formFill/FormFill.module.css b/frontend/src/core/tools/formFill/FormFill.module.css
index 844e9c1f93..4cffc284f5 100644
--- a/frontend/src/core/tools/formFill/FormFill.module.css
+++ b/frontend/src/core/tools/formFill/FormFill.module.css
@@ -8,7 +8,8 @@
 
 .modeTabs {
   flex-shrink: 0;
-  border-bottom: 1px solid var(--border-default, var(--mantine-color-default-border));
+  border-bottom: 1px solid
+    var(--border-default, var(--mantine-color-default-border));
   background: transparent;
   padding: 0.25rem;
 }
@@ -58,7 +59,8 @@
   flex-shrink: 0;
   padding: 0.75rem 1rem;
   background: transparent;
-  border-bottom: 1px solid var(--border-default, var(--mantine-color-default-border));
+  border-bottom: 1px solid
+    var(--border-default, var(--mantine-color-default-border));
   display: flex;
   flex-direction: column;
   gap: 0.625rem;
@@ -128,7 +130,7 @@
 }
 
 .pageDivider::after {
-  content: '';
+  content: "";
   flex: 1;
   height: 1px;
   background: var(--border-default, var(--mantine-color-default-border));
@@ -261,7 +263,8 @@
 .statusBar {
   flex-shrink: 0;
   padding: 0.5rem 1rem;
-  border-top: 1px solid var(--border-default, var(--mantine-color-default-border));
+  border-top: 1px solid
+    var(--border-default, var(--mantine-color-default-border));
   display: flex;
   align-items: center;
   justify-content: space-between;
diff --git a/frontend/src/core/tools/formFill/FormFill.tsx b/frontend/src/core/tools/formFill/FormFill.tsx
index 0a809a4b0d..7542a3ac75 100644
--- a/frontend/src/core/tools/formFill/FormFill.tsx
+++ b/frontend/src/core/tools/formFill/FormFill.tsx
@@ -9,7 +9,13 @@
  * - CSS module for theme-consistent styling
  * - Status bar at bottom for contextual info
  */
-import React, { useEffect, useCallback, useState, useRef, useMemo } from 'react';
+import React, {
+  useEffect,
+  useCallback,
+  useState,
+  useRef,
+  useMemo,
+} from "react";
 import {
   Button,
   Text,
@@ -20,34 +26,43 @@ import {
   Progress,
   Tooltip,
   ActionIcon,
-} from '@mantine/core';
-import { useFormFill, useAllFormValues } from '@app/tools/formFill/FormFillContext';
-import { useNavigation } from '@app/contexts/NavigationContext';
-import { useViewer } from '@app/contexts/ViewerContext';
-import { useFileState } from '@app/contexts/FileContext';
-import { Skeleton } from '@mantine/core';
-import { isStirlingFile, getFormFillFileId } from '@app/types/fileContext';
-import type { BaseToolProps } from '@app/types/tool';
-import type { FormField } from '@app/tools/formFill/types';
-import { FieldInput } from '@app/tools/formFill/FieldInput';
-import { FIELD_TYPE_ICON, FIELD_TYPE_COLOR } from '@app/tools/formFill/fieldMeta';
-import SaveIcon from '@mui/icons-material/Save';
-import RefreshIcon from '@mui/icons-material/Refresh';
-import WarningAmberIcon from '@mui/icons-material/WarningAmber';
-import EditNoteIcon from '@mui/icons-material/EditNote';
-import PostAddIcon from '@mui/icons-material/PostAdd';
-import FileCopyIcon from '@mui/icons-material/FileCopy';
-import BuildCircleIcon from '@mui/icons-material/BuildCircle';
-import DescriptionIcon from '@mui/icons-material/Description';
-import FileDownloadIcon from '@mui/icons-material/FileDownload';
-import { extractFormFieldsCsv, extractFormFieldsXlsx } from '@app/tools/formFill/formApi';
-import styles from '@app/tools/formFill/FormFill.module.css';
+} from "@mantine/core";
+import {
+  useFormFill,
+  useAllFormValues,
+} from "@app/tools/formFill/FormFillContext";
+import { useNavigation } from "@app/contexts/NavigationContext";
+import { useViewer } from "@app/contexts/ViewerContext";
+import { useFileState } from "@app/contexts/FileContext";
+import { Skeleton } from "@mantine/core";
+import { isStirlingFile, getFormFillFileId } from "@app/types/fileContext";
+import type { BaseToolProps } from "@app/types/tool";
+import type { FormField } from "@app/tools/formFill/types";
+import { FieldInput } from "@app/tools/formFill/FieldInput";
+import {
+  FIELD_TYPE_ICON,
+  FIELD_TYPE_COLOR,
+} from "@app/tools/formFill/fieldMeta";
+import SaveIcon from "@mui/icons-material/Save";
+import RefreshIcon from "@mui/icons-material/Refresh";
+import WarningAmberIcon from "@mui/icons-material/WarningAmber";
+import EditNoteIcon from "@mui/icons-material/EditNote";
+import PostAddIcon from "@mui/icons-material/PostAdd";
+import FileCopyIcon from "@mui/icons-material/FileCopy";
+import BuildCircleIcon from "@mui/icons-material/BuildCircle";
+import DescriptionIcon from "@mui/icons-material/Description";
+import FileDownloadIcon from "@mui/icons-material/FileDownload";
+import {
+  extractFormFieldsCsv,
+  extractFormFieldsXlsx,
+} from "@app/tools/formFill/formApi";
+import styles from "@app/tools/formFill/FormFill.module.css";
 
 // ---------------------------------------------------------------------------
 // Mode tabs — extensible for future form tools
 // ---------------------------------------------------------------------------
 
-type FormMode = 'fill' | 'make' | 'batch' | 'modify';
+type FormMode = "fill" | "make" | "batch" | "modify";
 
 interface ModeTabDef {
   id: FormMode;
@@ -57,10 +72,30 @@ interface ModeTabDef {
 }
 
 const _MODE_TABS: ModeTabDef[] = [
-  { id: 'fill', label: 'Fill', icon: <EditNoteIcon className={styles.modeTabIcon} />, ready: true },
-  { id: 'make', label: 'Create', icon: <PostAddIcon className={styles.modeTabIcon} />, ready: false },
-  { id: 'batch', label: 'Batch', icon: <FileCopyIcon className={styles.modeTabIcon} />, ready: false },
-  { id: 'modify', label: 'Modify', icon: <BuildCircleIcon className={styles.modeTabIcon} />, ready: false },
+  {
+    id: "fill",
+    label: "Fill",
+    icon: <EditNoteIcon className={styles.modeTabIcon} />,
+    ready: true,
+  },
+  {
+    id: "make",
+    label: "Create",
+    icon: <PostAddIcon className={styles.modeTabIcon} />,
+    ready: false,
+  },
+  {
+    id: "batch",
+    label: "Batch",
+    icon: <FileCopyIcon className={styles.modeTabIcon} />,
+    ready: false,
+  },
+  {
+    id: "modify",
+    label: "Modify",
+    icon: <BuildCircleIcon className={styles.modeTabIcon} />,
+    ready: false,
+  },
 ];
 
 // ---------------------------------------------------------------------------
@@ -106,14 +141,17 @@ const FormFill = (_props: BaseToolProps) => {
   // Other modes (make, batch, modify) are defined above but not yet exposed in the UI.
   // When ready, uncomment the SegmentedControl and mode state below.
   // const [mode, setMode] = useState<FormMode>('fill');
-  const mode: FormMode = 'fill';
+  const mode: FormMode = "fill";
   const [flatten, setFlatten] = useState(false);
   const [saving, setSaving] = useState(false);
   const [extracting, setExtracting] = useState(false);
   const [saveError, setSaveError] = useState<string | null>(null);
 
-  const [lastSavedFlatten, setLastSavedFlatten] = useState<boolean | null>(null);
-  const flattenChanged = lastSavedFlatten !== null && flatten !== lastSavedFlatten;
+  const [lastSavedFlatten, setLastSavedFlatten] = useState<boolean | null>(
+    null,
+  );
+  const flattenChanged =
+    lastSavedFlatten !== null && flatten !== lastSavedFlatten;
 
   const savingRef = useRef(false);
 
@@ -121,9 +159,9 @@ const FormFill = (_props: BaseToolProps) => {
     setExtracting(true);
     try {
       const data = JSON.stringify(allValues, null, 2);
-      const blob = new Blob([data], { type: 'application/json' });
+      const blob = new Blob([data], { type: "application/json" });
       const url = URL.createObjectURL(blob);
-      const a = document.createElement('a');
+      const a = document.createElement("a");
       a.href = url;
       a.download = `form-data-${new Date().getTime()}.json`;
       a.click();
@@ -143,7 +181,7 @@ const FormFill = (_props: BaseToolProps) => {
     if (activeFiles.length === 0) return null;
     if (selectedFileIds.length > 0) {
       const sel = activeFiles.find(
-        (f) => isStirlingFile(f) && selectedFileIds.includes(f.fileId)
+        (f) => isStirlingFile(f) && selectedFileIds.includes(f.fileId),
       );
       if (sel) return sel;
     }
@@ -156,14 +194,14 @@ const FormFill = (_props: BaseToolProps) => {
     try {
       const blob = await extractFormFieldsCsv(currentFile, allValues);
       const url = URL.createObjectURL(blob);
-      const a = document.createElement('a');
+      const a = document.createElement("a");
       a.href = url;
       a.download = `form-data-${new Date().getTime()}.csv`;
       a.click();
       setTimeout(() => URL.revokeObjectURL(url), 250);
     } catch (err) {
-      console.error('[FormFill] CSV extraction failed:', err);
-      setSaveError('Failed to extract CSV');
+      console.error("[FormFill] CSV extraction failed:", err);
+      setSaveError("Failed to extract CSV");
     } finally {
       setExtracting(false);
     }
@@ -175,26 +213,26 @@ const FormFill = (_props: BaseToolProps) => {
     try {
       const blob = await extractFormFieldsXlsx(currentFile, allValues);
       const url = URL.createObjectURL(blob);
-      const a = document.createElement('a');
+      const a = document.createElement("a");
       a.href = url;
       a.download = `form-data-${new Date().getTime()}.xlsx`;
       a.click();
       setTimeout(() => URL.revokeObjectURL(url), 250);
     } catch (err) {
-      console.error('[FormFill] XLSX extraction failed:', err);
-      setSaveError('Failed to extract XLSX');
+      console.error("[FormFill] XLSX extraction failed:", err);
+      setSaveError("Failed to extract XLSX");
     } finally {
       setExtracting(false);
     }
   }, [currentFile, allValues]);
 
-  const isActive = selectedTool === 'formFill';
+  const isActive = selectedTool === "formFill";
 
   useEffect(() => {
     if (formState.activeFieldName && activeFieldRef.current) {
       activeFieldRef.current.scrollIntoView({
-        behavior: 'smooth',
-        block: 'center',
+        behavior: "smooth",
+        block: "center",
       });
     }
   }, [formState.activeFieldName]);
@@ -205,7 +243,7 @@ const FormFill = (_props: BaseToolProps) => {
     if (!currentFile || !isStirlingFile(currentFile)) return;
 
     if (!validateForm()) {
-      setSaveError('Please fill in all required fields');
+      setSaveError("Please fill in all required fields");
       return;
     }
 
@@ -223,16 +261,19 @@ const FormFill = (_props: BaseToolProps) => {
       // This ensures the viewer tracks the new file ID, preserves
       // scroll position and rotation — instead of our own consumeFiles
       // call which would lose the viewer's file tracking context.
-      const event = new CustomEvent('formfill:apply', { detail: { blob: filledBlob } });
+      const event = new CustomEvent("formfill:apply", {
+        detail: { blob: filledBlob },
+      });
       window.dispatchEvent(event);
     } catch (err: any) {
-      const message = err?.response?.status === 413
-        ? 'File too large. Try reducing the PDF size first.'
-        : err?.response?.status === 400
-        ? 'Invalid form data. Please check all fields.'
-        : err?.message || 'Failed to save filled form';
+      const message =
+        err?.response?.status === 413
+          ? "File too large. Try reducing the PDF size first."
+          : err?.response?.status === 400
+            ? "Invalid form data. Please check all fields."
+            : err?.message || "Failed to save filled form";
       setSaveError(message);
-      console.error('[FormFill] Save failed:', err);
+      console.error("[FormFill] Save failed:", err);
     } finally {
       savingRef.current = false;
       setSaving(false);
@@ -245,13 +286,13 @@ const FormFill = (_props: BaseToolProps) => {
   useEffect(() => {
     if (!isActive) return;
     const handleKeyDown = (e: KeyboardEvent) => {
-      if ((e.ctrlKey || e.metaKey) && e.key === 's') {
+      if ((e.ctrlKey || e.metaKey) && e.key === "s") {
         e.preventDefault();
         if (isDirtyRef.current || flattenChangedRef.current) handleSave();
       }
     };
-    window.addEventListener('keydown', handleKeyDown);
-    return () => window.removeEventListener('keydown', handleKeyDown);
+    window.addEventListener("keydown", handleKeyDown);
+    return () => window.removeEventListener("keydown", handleKeyDown);
   }, [isActive, handleSave]);
 
   // Data loss prevention: warn on beforeunload if dirty
@@ -259,11 +300,11 @@ const FormFill = (_props: BaseToolProps) => {
     const handleBeforeUnload = (e: BeforeUnloadEvent) => {
       if (formState.isDirty) {
         e.preventDefault();
-        e.returnValue = '';
+        e.returnValue = "";
       }
     };
-    window.addEventListener('beforeunload', handleBeforeUnload);
-    return () => window.removeEventListener('beforeunload', handleBeforeUnload);
+    window.addEventListener("beforeunload", handleBeforeUnload);
+    return () => window.removeEventListener("beforeunload", handleBeforeUnload);
   }, [formState.isDirty]);
 
   const handleRefresh = useCallback(() => {
@@ -276,7 +317,7 @@ const FormFill = (_props: BaseToolProps) => {
     (fieldName: string, value: string) => {
       setValue(fieldName, value);
     },
-    [setValue]
+    [setValue],
   );
 
   const handleFieldClick = useCallback(
@@ -286,12 +327,14 @@ const FormFill = (_props: BaseToolProps) => {
         scrollActions.scrollToPage(pageIndex + 1);
       }
     },
-    [setActiveField, scrollActions]
+    [setActiveField, scrollActions],
   );
 
   // Progress tracking
   const fillableFields = useMemo(() => {
-    return formState.fields.filter((f) => f.type !== 'button' && f.type !== 'signature');
+    return formState.fields.filter(
+      (f) => f.type !== "button" && f.type !== "signature",
+    );
   }, [formState.fields]);
 
   // Memoize fillable fields grouped by page (signatures/buttons excluded)
@@ -299,7 +342,9 @@ const FormFill = (_props: BaseToolProps) => {
     const byPage = new Map<number, FormField[]>();
     for (const field of fillableFields) {
       const pageIndex =
-        field.widgets && field.widgets.length > 0 ? field.widgets[0].pageIndex : 0;
+        field.widgets && field.widgets.length > 0
+          ? field.widgets[0].pageIndex
+          : 0;
       if (!byPage.has(pageIndex)) {
         byPage.set(pageIndex, []);
       }
@@ -314,7 +359,7 @@ const FormFill = (_props: BaseToolProps) => {
   const filledCount = useMemo(() => {
     return fillableFields.filter((f) => {
       const v = allValues[f.name];
-      return v && v !== 'Off' && v.trim() !== '';
+      return v && v !== "Off" && v.trim() !== "";
     }).length;
   }, [fillableFields, allValues]);
 
@@ -327,7 +372,7 @@ const FormFill = (_props: BaseToolProps) => {
   const filledRequiredCount = useMemo(() => {
     return requiredFields.filter((f) => {
       const v = allValues[f.name];
-      return v && v !== 'Off' && v.trim() !== '';
+      return v && v !== "Off" && v.trim() !== "";
     }).length;
   }, [requiredFields, allValues]);
 
@@ -368,14 +413,20 @@ const FormFill = (_props: BaseToolProps) => {
       {/* !currentModeDef.ready && <ComingSoonPlaceholder mode={currentModeDef} /> */}
 
       {/* ---- Fill Form content ---- */}
-      {mode === 'fill' && (
+      {mode === "fill" && (
         <>
           {/* Header / controls */}
           <div className={styles.header}>
             {/* Loading state */}
             {formState.loading && (
               <>
-                <div style={{ display: 'flex', alignItems: 'center', gap: '0.5rem' }}>
+                <div
+                  style={{
+                    display: "flex",
+                    alignItems: "center",
+                    gap: "0.5rem",
+                  }}
+                >
                   <Loader size={14} />
                   <Text size="xs" c="dimmed">
                     Analysing form fields...
@@ -408,7 +459,7 @@ const FormFill = (_props: BaseToolProps) => {
                     <span className={styles.progressLabel}>
                       {filledCount} / {fillableCount} filled
                       {requiredCount > 0 && (
-                        <span style={{ marginLeft: '0.5rem', opacity: 0.7 }}>
+                        <span style={{ marginLeft: "0.5rem", opacity: 0.7 }}>
                           ({filledRequiredCount}/{requiredCount} req.)
                         </span>
                       )}
@@ -421,10 +472,16 @@ const FormFill = (_props: BaseToolProps) => {
                     </span>
                   </div>
                   <Progress
-                    value={fillableCount > 0 ? (filledCount / fillableCount) * 100 : 0}
+                    value={
+                      fillableCount > 0
+                        ? (filledCount / fillableCount) * 100
+                        : 0
+                    }
                     size={6}
                     radius="xl"
-                    color={filledRequiredCount === requiredCount ? 'teal' : 'blue'}
+                    color={
+                      filledRequiredCount === requiredCount ? "teal" : "blue"
+                    }
                     mt={4}
                   />
                 </div>
@@ -436,7 +493,7 @@ const FormFill = (_props: BaseToolProps) => {
                   onChange={(e) => setFlatten(e.currentTarget.checked)}
                   size="xs"
                   styles={{
-                    label: { fontSize: '0.75rem', cursor: 'pointer' },
+                    label: { fontSize: "0.75rem", cursor: "pointer" },
                   }}
                 />
 
@@ -511,14 +568,16 @@ const FormFill = (_props: BaseToolProps) => {
             )}
 
             {/* Empty state */}
-            {!formState.loading && formState.fields.length === 0 && !formState.error && (
-              <div className={styles.emptyState}>
-                <DescriptionIcon className={styles.emptyStateIcon} />
-                <span className={styles.emptyStateText}>
-                  No fillable form fields found in this PDF.
-                </span>
-              </div>
-            )}
+            {!formState.loading &&
+              formState.fields.length === 0 &&
+              !formState.error && (
+                <div className={styles.emptyState}>
+                  <DescriptionIcon className={styles.emptyStateIcon} />
+                  <span className={styles.emptyStateText}>
+                    No fillable form fields found in this PDF.
+                  </span>
+                </div>
+              )}
           </div>
 
           {/* ---- Scrollable field list ---- */}
@@ -537,7 +596,8 @@ const FormFill = (_props: BaseToolProps) => {
                     </div>
 
                     {fieldsByPage.get(pageIdx)!.map((field) => {
-                      const isFieldActive = formState.activeFieldName === field.name;
+                      const isFieldActive =
+                        formState.activeFieldName === field.name;
                       const hasError = !!validationErrors[field.name];
                       const pageIndex =
                         field.widgets && field.widgets.length > 0
@@ -549,16 +609,18 @@ const FormFill = (_props: BaseToolProps) => {
                           key={field.name}
                           ref={isFieldActive ? activeFieldRef : undefined}
                           className={`${styles.fieldCard} ${
-                            isFieldActive ? styles.fieldCardActive : ''
-                          } ${hasError ? styles.fieldCardError : ''}`}
-                          onClick={() => handleFieldClick(field.name, pageIndex)}
+                            isFieldActive ? styles.fieldCardActive : ""
+                          } ${hasError ? styles.fieldCardError : ""}`}
+                          onClick={() =>
+                            handleFieldClick(field.name, pageIndex)
+                          }
                         >
                           <div className={styles.fieldHeader}>
                             <span
                               className={styles.fieldTypeIcon}
                               style={{
                                 color: `var(--mantine-color-${FIELD_TYPE_COLOR[field.type]}-6)`,
-                                fontSize: '0.875rem',
+                                fontSize: "0.875rem",
                               }}
                             >
                               {FIELD_TYPE_ICON[field.type]}
@@ -571,16 +633,15 @@ const FormFill = (_props: BaseToolProps) => {
                             )}
                           </div>
 
-                          {field.type !== 'button' && field.type !== 'signature' && (
-                            <div
-                              className={styles.fieldInputWrap}
-                            >
-                              <FieldInput
-                                field={field}
-                                onValueChange={handleValueChange}
-                              />
-                            </div>
-                          )}
+                          {field.type !== "button" &&
+                            field.type !== "signature" && (
+                              <div className={styles.fieldInputWrap}>
+                                <FieldInput
+                                  field={field}
+                                  onValueChange={handleValueChange}
+                                />
+                              </div>
+                            )}
 
                           {hasError && (
                             <div className={styles.fieldError}>
@@ -606,8 +667,12 @@ const FormFill = (_props: BaseToolProps) => {
           {!formState.loading && formState.fields.length > 0 && (
             <div className={styles.statusBar}>
               <span>
-                {(formState.isDirty || flattenChanged) && <span className={styles.unsavedDot} />}
-                {formState.isDirty || flattenChanged ? 'Unsaved changes' : 'All saved'}
+                {(formState.isDirty || flattenChanged) && (
+                  <span className={styles.unsavedDot} />
+                )}
+                {formState.isDirty || flattenChanged
+                  ? "Unsaved changes"
+                  : "All saved"}
               </span>
               <span>Ctrl+S to save</span>
             </div>
diff --git a/frontend/src/core/tools/formFill/FormFillContext.tsx b/frontend/src/core/tools/formFill/FormFillContext.tsx
index 6b03529274..217b568bbc 100644
--- a/frontend/src/core/tools/formFill/FormFillContext.tsx
+++ b/frontend/src/core/tools/formFill/FormFillContext.tsx
@@ -28,13 +28,17 @@ import React, {
   useRef,
   useState,
   useSyncExternalStore,
-} from 'react';
-import { useDebouncedCallback } from '@mantine/hooks';
-import type { FormField, FormFillState, WidgetCoordinates } from '@app/tools/formFill/types';
-import type { IFormDataProvider } from '@app/tools/formFill/providers/types';
-import { PdfBoxFormProvider } from '@app/tools/formFill/providers/PdfBoxFormProvider';
-import { PdfiumFormProvider } from '@app/tools/formFill/providers/PdfiumFormProvider';
-import { fetchSignatureFieldsWithAppearances } from '@app/services/pdfiumService';
+} from "react";
+import { useDebouncedCallback } from "@mantine/hooks";
+import type {
+  FormField,
+  FormFillState,
+  WidgetCoordinates,
+} from "@app/tools/formFill/types";
+import type { IFormDataProvider } from "@app/tools/formFill/providers/types";
+import { PdfBoxFormProvider } from "@app/tools/formFill/providers/PdfBoxFormProvider";
+import { PdfiumFormProvider } from "@app/tools/formFill/providers/PdfiumFormProvider";
+import { fetchSignatureFieldsWithAppearances } from "@app/services/pdfiumService";
 
 // ---------------------------------------------------------------------------
 // FormValuesStore — external store for field values (outside React state)
@@ -66,7 +70,7 @@ class FormValuesStore {
   }
 
   getValue(fieldName: string): string {
-    return this._values[fieldName] ?? '';
+    return this._values[fieldName] ?? "";
   }
 
   setValue(fieldName: string, value: string): void {
@@ -112,15 +116,15 @@ class FormValuesStore {
 // ---------------------------------------------------------------------------
 
 type Action =
-  | { type: 'FETCH_START' }
-  | { type: 'FETCH_SUCCESS'; fields: FormField[] }
-  | { type: 'FETCH_ERROR'; error: string }
-  | { type: 'MARK_DIRTY' }
-  | { type: 'SET_ACTIVE_FIELD'; fieldName: string | null }
-  | { type: 'SET_VALIDATION_ERRORS'; errors: Record<string, string> }
-  | { type: 'CLEAR_VALIDATION_ERROR'; fieldName: string }
-  | { type: 'MARK_CLEAN' }
-  | { type: 'RESET' };
+  | { type: "FETCH_START" }
+  | { type: "FETCH_SUCCESS"; fields: FormField[] }
+  | { type: "FETCH_ERROR"; error: string }
+  | { type: "MARK_DIRTY" }
+  | { type: "SET_ACTIVE_FIELD"; fieldName: string | null }
+  | { type: "SET_VALIDATION_ERRORS"; errors: Record<string, string> }
+  | { type: "CLEAR_VALIDATION_ERROR"; fieldName: string }
+  | { type: "MARK_CLEAN" }
+  | { type: "RESET" };
 
 const initialState: FormFillState = {
   fields: [],
@@ -134,9 +138,9 @@ const initialState: FormFillState = {
 
 function reducer(state: FormFillState, action: Action): FormFillState {
   switch (action.type) {
-    case 'FETCH_START':
+    case "FETCH_START":
       return { ...state, loading: true, error: null };
-    case 'FETCH_SUCCESS': {
+    case "FETCH_SUCCESS": {
       return {
         ...state,
         fields: action.fields,
@@ -146,23 +150,23 @@ function reducer(state: FormFillState, action: Action): FormFillState {
         isDirty: false,
       };
     }
-    case 'FETCH_ERROR':
+    case "FETCH_ERROR":
       return { ...state, loading: false, error: action.error };
-    case 'MARK_DIRTY':
+    case "MARK_DIRTY":
       if (state.isDirty) return state; // avoid unnecessary re-render
       return { ...state, isDirty: true };
-    case 'SET_ACTIVE_FIELD':
+    case "SET_ACTIVE_FIELD":
       return { ...state, activeFieldName: action.fieldName };
-    case 'SET_VALIDATION_ERRORS':
+    case "SET_VALIDATION_ERRORS":
       return { ...state, validationErrors: action.errors };
-    case 'CLEAR_VALIDATION_ERROR': {
+    case "CLEAR_VALIDATION_ERROR": {
       if (!state.validationErrors[action.fieldName]) return state;
       const { [action.fieldName]: _, ...rest } = state.validationErrors;
       return { ...state, validationErrors: rest };
     }
-    case 'MARK_CLEAN':
+    case "MARK_CLEAN":
       return { ...state, isDirty: false };
-    case 'RESET':
+    case "RESET":
       return initialState;
     default:
       return state;
@@ -178,10 +182,7 @@ export interface FormFillContextValue {
   /** Set the currently focused field */
   setActiveField: (fieldName: string | null) => void;
   /** Submit filled form and return the filled PDF blob */
-  submitForm: (
-    file: File | Blob,
-    flatten?: boolean
-  ) => Promise<Blob>;
+  submitForm: (file: File | Blob, flatten?: boolean) => Promise<Blob>;
   /** Get field by name */
   getField: (fieldName: string) => FormField | undefined;
   /** Get fields for a specific page index */
@@ -201,7 +202,7 @@ export interface FormFillContextValue {
    * Use 'pdflib' for frontend-only pdf-lib, 'pdfbox' for backend PDFBox.
    * Resets form state when switching providers.
    */
-  setProviderMode: (mode: 'pdflib' | 'pdfbox') => void;
+  setProviderMode: (mode: "pdflib" | "pdfbox") => void;
   /** The file ID that the current form fields belong to (null if no fields loaded) */
   forFileId: string | null;
 }
@@ -217,7 +218,7 @@ const FormValuesStoreContext = createContext<FormValuesStore | null>(null);
 export const useFormFill = (): FormFillContextValue => {
   const ctx = useContext(FormFillContext);
   if (!ctx) {
-    throw new Error('useFormFill must be used within a FormFillProvider');
+    throw new Error("useFormFill must be used within a FormFillProvider");
   }
   return ctx;
 };
@@ -231,16 +232,16 @@ export const useFormFill = (): FormFillContextValue => {
 export function useFieldValue(fieldName: string): string {
   const store = useContext(FormValuesStoreContext);
   if (!store) {
-    throw new Error('useFieldValue must be used within a FormFillProvider');
+    throw new Error("useFieldValue must be used within a FormFillProvider");
   }
 
   const subscribe = useCallback(
     (cb: () => void) => store.subscribeField(fieldName, cb),
-    [store, fieldName]
+    [store, fieldName],
   );
   const getSnapshot = useCallback(
     () => store.getValue(fieldName),
-    [store, fieldName]
+    [store, fieldName],
   );
 
   return useSyncExternalStore(subscribe, getSnapshot);
@@ -253,17 +254,14 @@ export function useFieldValue(fieldName: string): string {
 export function useAllFormValues(): Record<string, string> {
   const store = useContext(FormValuesStoreContext);
   if (!store) {
-    throw new Error('useAllFormValues must be used within a FormFillProvider');
+    throw new Error("useAllFormValues must be used within a FormFillProvider");
   }
 
   const subscribe = useCallback(
     (cb: () => void) => store.subscribeGlobal(cb),
-    [store]
-  );
-  const getSnapshot = useCallback(
-    () => store.values,
-    [store]
+    [store],
   );
+  const getSnapshot = useCallback(() => store.values, [store]);
 
   return useSyncExternalStore(subscribe, getSnapshot);
 }
@@ -280,11 +278,15 @@ export function FormFillProvider({
   /** Override the initial provider. If not given, defaults to pdf-lib. */
   provider?: IFormDataProvider;
 }) {
-  const initialMode = providerProp?.name === 'pdfbox' ? 'pdfbox' : 'pdflib';
-  const [providerMode, setProviderModeState] = useState<'pdflib' | 'pdfbox'>(initialMode);
-  const providerModeRef = useRef(initialMode as 'pdflib' | 'pdfbox');
+  const initialMode = providerProp?.name === "pdfbox" ? "pdfbox" : "pdflib";
+  const [providerMode, setProviderModeState] = useState<"pdflib" | "pdfbox">(
+    initialMode,
+  );
+  const providerModeRef = useRef(initialMode as "pdflib" | "pdfbox");
   providerModeRef.current = providerMode;
-  const provider = providerProp ?? (providerMode === 'pdfbox' ? pdfBoxProvider : pdfiumProvider);
+  const provider =
+    providerProp ??
+    (providerMode === "pdfbox" ? pdfBoxProvider : pdfiumProvider);
   const providerRef = useRef(provider);
   providerRef.current = provider;
 
@@ -304,76 +306,88 @@ export function FormFillProvider({
   // This prevents full context re-renders on every keystroke.
   const [valuesStore] = useState(() => new FormValuesStore());
 
-  const fetchFields = useCallback(async (file: File | Blob, fileId?: string) => {
-    // Increment version so any in-flight fetch for a previous file is discarded.
-    // NOTE: setProviderMode() also increments fetchVersionRef to invalidate
-    // in-flight fetches when switching providers. This is intentional — the
-    // fetch started here captures the NEW version, so stale results are
-    // correctly discarded.
-    const version = ++fetchVersionRef.current;
+  const fetchFields = useCallback(
+    async (file: File | Blob, fileId?: string) => {
+      // Increment version so any in-flight fetch for a previous file is discarded.
+      // NOTE: setProviderMode() also increments fetchVersionRef to invalidate
+      // in-flight fetches when switching providers. This is intentional — the
+      // fetch started here captures the NEW version, so stale results are
+      // correctly discarded.
+      const version = ++fetchVersionRef.current;
 
-    // Immediately clear previous state so FormFieldOverlay's stale-file guards
-    // prevent rendering fields from a previous document during the fetch.
-    forFileIdRef.current = null;
-    setForFileId(null);
-    valuesStore.reset({});
-    dispatch({ type: 'RESET' });
-    dispatch({ type: 'FETCH_START' });
-    try {
-      let fields = await providerRef.current.fetchFields(file);
-      // If another fetch or reset happened while we were waiting, discard this result
-      if (fetchVersionRef.current !== version) {
-        console.debug('[FormFill] Discarding stale fetch result (version mismatch)');
-        return;
-      }
-
-      // When the pdfbox provider is active the backend doesn't return signature fields
-      // (they're not fillable). Fetch them via pdflib so their appearances still render.
-      if (providerModeRef.current === 'pdfbox') {
-        try {
-          // Convert File/Blob to ArrayBuffer for pdfiumService
-          const arrayBuffer = await file.arrayBuffer();
-          const sigFields = await fetchSignatureFieldsWithAppearances(arrayBuffer);
-          if (fetchVersionRef.current !== version) return; // stale check after async
-          if (sigFields.length > 0) {
-            fields = [...fields, ...sigFields];
-          }
-        } catch (e) {
-          console.warn('[FormFill] Failed to extract signature appearances for pdfbox mode:', e);
+      // Immediately clear previous state so FormFieldOverlay's stale-file guards
+      // prevent rendering fields from a previous document during the fetch.
+      forFileIdRef.current = null;
+      setForFileId(null);
+      valuesStore.reset({});
+      dispatch({ type: "RESET" });
+      dispatch({ type: "FETCH_START" });
+      try {
+        let fields = await providerRef.current.fetchFields(file);
+        // If another fetch or reset happened while we were waiting, discard this result
+        if (fetchVersionRef.current !== version) {
+          console.debug(
+            "[FormFill] Discarding stale fetch result (version mismatch)",
+          );
+          return;
         }
-      }
 
-      // Initialise values in the external store
-      const values: Record<string, string> = {};
-      for (const field of fields) {
-        values[field.name] = field.value ?? '';
+        // When the pdfbox provider is active the backend doesn't return signature fields
+        // (they're not fillable). Fetch them via pdflib so their appearances still render.
+        if (providerModeRef.current === "pdfbox") {
+          try {
+            // Convert File/Blob to ArrayBuffer for pdfiumService
+            const arrayBuffer = await file.arrayBuffer();
+            const sigFields =
+              await fetchSignatureFieldsWithAppearances(arrayBuffer);
+            if (fetchVersionRef.current !== version) return; // stale check after async
+            if (sigFields.length > 0) {
+              fields = [...fields, ...sigFields];
+            }
+          } catch (e) {
+            console.warn(
+              "[FormFill] Failed to extract signature appearances for pdfbox mode:",
+              e,
+            );
+          }
+        }
+
+        // Initialise values in the external store
+        const values: Record<string, string> = {};
+        for (const field of fields) {
+          values[field.name] = field.value ?? "";
+        }
+        valuesStore.reset(values);
+        forFileIdRef.current = fileId ?? null;
+        setForFileId(fileId ?? null);
+        dispatch({ type: "FETCH_SUCCESS", fields });
+      } catch (err: any) {
+        if (fetchVersionRef.current !== version) return; // stale
+        const msg =
+          err?.response?.data?.message ||
+          err?.message ||
+          "Failed to fetch form fields";
+        dispatch({ type: "FETCH_ERROR", error: msg });
       }
-      valuesStore.reset(values);
-      forFileIdRef.current = fileId ?? null;
-      setForFileId(fileId ?? null);
-      dispatch({ type: 'FETCH_SUCCESS', fields });
-    } catch (err: any) {
-      if (fetchVersionRef.current !== version) return; // stale
-      const msg =
-        err?.response?.data?.message ||
-        err?.message ||
-        'Failed to fetch form fields';
-      dispatch({ type: 'FETCH_ERROR', error: msg });
-    }
-  }, [valuesStore]);
+    },
+    [valuesStore],
+  );
 
   const validateFieldDebounced = useDebouncedCallback((fieldName: string) => {
     const field = fieldsRef.current.find((f) => f.name === fieldName);
     if (!field || !field.required) return;
 
     const val = valuesStore.getValue(fieldName);
-    if (!val || val.trim() === '' || val === 'Off') {
+    if (!val || val.trim() === "" || val === "Off") {
       dispatch({
-        type: 'SET_VALIDATION_ERRORS',
-        errors: { ...state.validationErrors, [fieldName]: `${field.label} is required` },
+        type: "SET_VALIDATION_ERRORS",
+        errors: {
+          ...state.validationErrors,
+          [fieldName]: `${field.label} is required`,
+        },
       });
     } else {
-      dispatch({ type: 'CLEAR_VALIDATION_ERROR', fieldName });
+      dispatch({ type: "CLEAR_VALIDATION_ERROR", fieldName });
     }
   }, 300);
 
@@ -381,11 +395,11 @@ export function FormFillProvider({
     const errors: Record<string, string> = {};
     for (const field of fieldsRef.current) {
       const val = valuesStore.getValue(field.name);
-      if (field.required && (!val || val.trim() === '' || val === 'Off')) {
+      if (field.required && (!val || val.trim() === "" || val === "Off")) {
         errors[field.name] = `${field.label} is required`;
       }
     }
-    dispatch({ type: 'SET_VALIDATION_ERRORS', errors });
+    dispatch({ type: "SET_VALIDATION_ERRORS", errors });
     return Object.keys(errors).length === 0;
   }, [valuesStore]);
 
@@ -394,36 +408,37 @@ export function FormFillProvider({
       // Update external store (triggers per-field subscribers only)
       valuesStore.setValue(fieldName, value);
       // Mark form as dirty in React state (only triggers re-render once)
-      dispatch({ type: 'MARK_DIRTY' });
+      dispatch({ type: "MARK_DIRTY" });
       validateFieldDebounced(fieldName);
     },
-    [valuesStore, validateFieldDebounced]
+    [valuesStore, validateFieldDebounced],
   );
 
-  const setActiveField = useCallback(
-    (fieldName: string | null) => {
-      dispatch({ type: 'SET_ACTIVE_FIELD', fieldName });
-    },
-    []
-  );
+  const setActiveField = useCallback((fieldName: string | null) => {
+    dispatch({ type: "SET_ACTIVE_FIELD", fieldName });
+  }, []);
 
   const submitForm = useCallback(
     async (file: File | Blob, flatten = false) => {
-      const blob = await providerRef.current.fillForm(file, valuesStore.values, flatten);
-      dispatch({ type: 'MARK_CLEAN' });
+      const blob = await providerRef.current.fillForm(
+        file,
+        valuesStore.values,
+        flatten,
+      );
+      dispatch({ type: "MARK_CLEAN" });
       return blob;
     },
-    [valuesStore]
+    [valuesStore],
   );
 
   const setProviderMode = useCallback(
-    (mode: 'pdflib' | 'pdfbox') => {
+    (mode: "pdflib" | "pdfbox") => {
       // Use the ref to check the current mode synchronously — avoids
       // relying on stale closure state and allows the early return.
       if (providerModeRef.current === mode) return;
 
       // provider (pdfbox vs pdflib).
-      const newProvider = mode === 'pdfbox' ? pdfBoxProvider : pdfiumProvider;
+      const newProvider = mode === "pdfbox" ? pdfBoxProvider : pdfiumProvider;
       providerRef.current = newProvider;
       providerModeRef.current = mode;
 
@@ -431,30 +446,29 @@ export function FormFillProvider({
       forFileIdRef.current = null;
       setForFileId(null);
       valuesStore.reset({});
-      dispatch({ type: 'RESET' });
+      dispatch({ type: "RESET" });
 
       setProviderModeState(mode);
     },
-    [valuesStore]
+    [valuesStore],
   );
 
   const getField = useCallback(
-    (fieldName: string) =>
-      fieldsRef.current.find((f) => f.name === fieldName),
-    []
+    (fieldName: string) => fieldsRef.current.find((f) => f.name === fieldName),
+    [],
   );
 
   const getFieldsForPage = useCallback(
     (pageIndex: number) =>
       fieldsRef.current.filter((f) =>
-        f.widgets?.some((w: WidgetCoordinates) => w.pageIndex === pageIndex)
+        f.widgets?.some((w: WidgetCoordinates) => w.pageIndex === pageIndex),
       ),
-    []
+    [],
   );
 
   const getValue = useCallback(
     (fieldName: string) => valuesStore.getValue(fieldName),
-    [valuesStore]
+    [valuesStore],
   );
 
   const reset = useCallback(() => {
@@ -463,7 +477,7 @@ export function FormFillProvider({
     forFileIdRef.current = null;
     setForFileId(null);
     valuesStore.reset({});
-    dispatch({ type: 'RESET' });
+    dispatch({ type: "RESET" });
   }, [valuesStore]);
 
   const fieldsByPage = useMemo(() => {
@@ -510,7 +524,7 @@ export function FormFillProvider({
       providerMode,
       setProviderMode,
       forFileId,
-    ]
+    ],
   );
 
   return (
diff --git a/frontend/src/core/tools/formFill/FormSaveBar.tsx b/frontend/src/core/tools/formFill/FormSaveBar.tsx
index 676b1b009f..8ecf01d5e6 100644
--- a/frontend/src/core/tools/formFill/FormSaveBar.tsx
+++ b/frontend/src/core/tools/formFill/FormSaveBar.tsx
@@ -9,13 +9,22 @@
  * the dedicated FormFill tool panel is NOT active. It provides a clean
  * save UX that users expect from browser PDF viewers.
  */
-import React, { useCallback, useState } from 'react';
-import { Stack, Group, Text, Button, Transition, CloseButton, Paper, Badge } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import DownloadIcon from '@mui/icons-material/Download';
-import SaveIcon from '@mui/icons-material/Save';
-import EditNoteIcon from '@mui/icons-material/EditNote';
-import { useFormFill } from '@app/tools/formFill/FormFillContext';
+import React, { useCallback, useState } from "react";
+import {
+  Stack,
+  Group,
+  Text,
+  Button,
+  Transition,
+  CloseButton,
+  Paper,
+  Badge,
+} from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import DownloadIcon from "@mui/icons-material/Download";
+import SaveIcon from "@mui/icons-material/Save";
+import EditNoteIcon from "@mui/icons-material/EditNote";
+import { useFormFill } from "@app/tools/formFill/FormFillContext";
 
 interface FormSaveBarProps {
   /** The current file being viewed */
@@ -26,7 +35,11 @@ interface FormSaveBarProps {
   onApply?: (filledBlob: Blob) => Promise<void>;
 }
 
-export function FormSaveBar({ file, isFormFillToolActive, onApply }: FormSaveBarProps) {
+export function FormSaveBar({
+  file,
+  isFormFillToolActive,
+  onApply,
+}: FormSaveBarProps) {
   const { t } = useTranslation();
   const { state, submitForm } = useFormFill();
   const { fields, isDirty, loading } = state;
@@ -53,7 +66,7 @@ export function FormSaveBar({ file, isFormFillToolActive, onApply }: FormSaveBar
         await onApply(filledBlob);
       }
     } catch (err) {
-      console.error('[FormSaveBar] Apply failed:', err);
+      console.error("[FormSaveBar] Apply failed:", err);
     } finally {
       setApplying(false);
     }
@@ -66,15 +79,15 @@ export function FormSaveBar({ file, isFormFillToolActive, onApply }: FormSaveBar
       const blob = await submitForm(file, false);
       // Trigger browser download
       const url = URL.createObjectURL(blob);
-      const a = document.createElement('a');
+      const a = document.createElement("a");
       a.href = url;
-      a.download = file instanceof File ? file.name : 'filled-form.pdf';
+      a.download = file instanceof File ? file.name : "filled-form.pdf";
       document.body.appendChild(a);
       a.click();
       document.body.removeChild(a);
       URL.revokeObjectURL(url);
     } catch (err) {
-      console.error('[FormSaveBar] Download failed:', err);
+      console.error("[FormSaveBar] Download failed:", err);
     } finally {
       setSaving(false);
     }
@@ -85,7 +98,9 @@ export function FormSaveBar({ file, isFormFillToolActive, onApply }: FormSaveBar
   // - no form fields found
   // - still loading
   // - user dismissed the bar
-  const hasFields = fields.some(f => f.type !== 'signature' && f.type !== 'button');
+  const hasFields = fields.some(
+    (f) => f.type !== "signature" && f.type !== "button",
+  );
   const visible = !isFormFillToolActive && hasFields && !loading && !dismissed;
 
   return (
@@ -94,11 +109,11 @@ export function FormSaveBar({ file, isFormFillToolActive, onApply }: FormSaveBar
         <div
           style={{
             ...styles,
-            position: 'absolute',
-            top: '1rem',
-            right: '1rem',
+            position: "absolute",
+            top: "1rem",
+            right: "1rem",
             zIndex: 100,
-            pointerEvents: 'none',
+            pointerEvents: "none",
           }}
         >
           <Paper
@@ -106,10 +121,10 @@ export function FormSaveBar({ file, isFormFillToolActive, onApply }: FormSaveBar
             radius="md"
             withBorder
             style={{
-              pointerEvents: 'auto',
-              minWidth: '320px',
-              maxWidth: '420px',
-              overflow: 'hidden',
+              pointerEvents: "auto",
+              minWidth: "320px",
+              maxWidth: "420px",
+              overflow: "hidden",
             }}
           >
             <Stack gap="xs" p="md">
@@ -118,24 +133,32 @@ export function FormSaveBar({ file, isFormFillToolActive, onApply }: FormSaveBar
                   <EditNoteIcon
                     sx={{
                       fontSize: 24,
-                      color: isDirty ? 'var(--mantine-color-blue-6)' : 'var(--mantine-color-gray-6)'
+                      color: isDirty
+                        ? "var(--mantine-color-blue-6)"
+                        : "var(--mantine-color-gray-6)",
                     }}
                   />
                   <div>
                     <Group gap="xs">
                       <Text size="sm" fw={600}>
-                        {t('viewer.formBar.title', 'Form Fields')}
+                        {t("viewer.formBar.title", "Form Fields")}
                       </Text>
                       {isDirty && (
                         <Badge size="xs" color="blue" variant="light">
-                          {t('viewer.formBar.unsavedBadge', 'Unsaved')}
+                          {t("viewer.formBar.unsavedBadge", "Unsaved")}
                         </Badge>
                       )}
                     </Group>
                     <Text size="xs" c="dimmed" mt={2}>
                       {isDirty
-                        ? t('viewer.formBar.unsavedDesc', 'You have unsaved changes')
-                        : t('viewer.formBar.hasFieldsDesc', 'This PDF contains fillable fields')}
+                        ? t(
+                            "viewer.formBar.unsavedDesc",
+                            "You have unsaved changes",
+                          )
+                        : t(
+                            "viewer.formBar.hasFieldsDesc",
+                            "This PDF contains fillable fields",
+                          )}
                     </Text>
                   </div>
                 </Group>
@@ -143,7 +166,7 @@ export function FormSaveBar({ file, isFormFillToolActive, onApply }: FormSaveBar
                   size="sm"
                   variant="subtle"
                   onClick={() => setDismissed(true)}
-                  aria-label={t('viewer.formBar.dismiss', 'Dismiss')}
+                  aria-label={t("viewer.formBar.dismiss", "Dismiss")}
                 />
               </Group>
 
@@ -159,7 +182,7 @@ export function FormSaveBar({ file, isFormFillToolActive, onApply }: FormSaveBar
                     onClick={handleApply}
                     flex={1}
                   >
-                    {t('viewer.formBar.apply', 'Apply Changes')}
+                    {t("viewer.formBar.apply", "Apply Changes")}
                   </Button>
                   <Button
                     size="sm"
@@ -171,7 +194,7 @@ export function FormSaveBar({ file, isFormFillToolActive, onApply }: FormSaveBar
                     onClick={handleDownload}
                     flex={1}
                   >
-                    {t('viewer.formBar.download', 'Download PDF')}
+                    {t("viewer.formBar.download", "Download PDF")}
                   </Button>
                 </Group>
               )}
diff --git a/frontend/src/core/tools/formFill/fieldMeta.tsx b/frontend/src/core/tools/formFill/fieldMeta.tsx
index e205b76e93..65daef37fa 100644
--- a/frontend/src/core/tools/formFill/fieldMeta.tsx
+++ b/frontend/src/core/tools/formFill/fieldMeta.tsx
@@ -2,31 +2,31 @@
  * Shared field type metadata: icons and color mappings.
  * Used by FormFill, FormFieldSidebar, and any future form tools.
  */
-import React from 'react';
-import type { FormFieldType } from '@app/tools/formFill/types';
-import TextFieldsIcon from '@mui/icons-material/TextFields';
-import CheckBoxIcon from '@mui/icons-material/CheckBox';
-import ArrowDropDownCircleIcon from '@mui/icons-material/ArrowDropDownCircle';
-import RadioButtonCheckedIcon from '@mui/icons-material/RadioButtonChecked';
-import ListIcon from '@mui/icons-material/List';
-import DrawIcon from '@mui/icons-material/Draw';
+import React from "react";
+import type { FormFieldType } from "@app/tools/formFill/types";
+import TextFieldsIcon from "@mui/icons-material/TextFields";
+import CheckBoxIcon from "@mui/icons-material/CheckBox";
+import ArrowDropDownCircleIcon from "@mui/icons-material/ArrowDropDownCircle";
+import RadioButtonCheckedIcon from "@mui/icons-material/RadioButtonChecked";
+import ListIcon from "@mui/icons-material/List";
+import DrawIcon from "@mui/icons-material/Draw";
 
 export const FIELD_TYPE_ICON: Record<FormFieldType, React.ReactNode> = {
-  text: <TextFieldsIcon sx={{ fontSize: 'inherit' }} />,
-  checkbox: <CheckBoxIcon sx={{ fontSize: 'inherit' }} />,
-  combobox: <ArrowDropDownCircleIcon sx={{ fontSize: 'inherit' }} />,
-  listbox: <ListIcon sx={{ fontSize: 'inherit' }} />,
-  radio: <RadioButtonCheckedIcon sx={{ fontSize: 'inherit' }} />,
-  button: <DrawIcon sx={{ fontSize: 'inherit' }} />,
-  signature: <DrawIcon sx={{ fontSize: 'inherit' }} />,
+  text: <TextFieldsIcon sx={{ fontSize: "inherit" }} />,
+  checkbox: <CheckBoxIcon sx={{ fontSize: "inherit" }} />,
+  combobox: <ArrowDropDownCircleIcon sx={{ fontSize: "inherit" }} />,
+  listbox: <ListIcon sx={{ fontSize: "inherit" }} />,
+  radio: <RadioButtonCheckedIcon sx={{ fontSize: "inherit" }} />,
+  button: <DrawIcon sx={{ fontSize: "inherit" }} />,
+  signature: <DrawIcon sx={{ fontSize: "inherit" }} />,
 };
 
 export const FIELD_TYPE_COLOR: Record<FormFieldType, string> = {
-  text: 'blue',
-  checkbox: 'green',
-  combobox: 'violet',
-  listbox: 'cyan',
-  radio: 'orange',
-  button: 'gray',
-  signature: 'pink',
+  text: "blue",
+  checkbox: "green",
+  combobox: "violet",
+  listbox: "cyan",
+  radio: "orange",
+  button: "gray",
+  signature: "pink",
 };
diff --git a/frontend/src/core/tools/formFill/formApi.ts b/frontend/src/core/tools/formFill/formApi.ts
index 8c40e682d0..c678435035 100644
--- a/frontend/src/core/tools/formFill/formApi.ts
+++ b/frontend/src/core/tools/formFill/formApi.ts
@@ -1,22 +1,22 @@
 /**
  * API service for form-related backend calls.
  */
-import apiClient from '@app/services/apiClient';
-import type { FormField } from '@app/tools/formFill/types';
+import apiClient from "@app/services/apiClient";
+import type { FormField } from "@app/tools/formFill/types";
 
 /**
  * Fetch form fields with coordinates from the backend.
  * Calls POST /api/v1/form/fields-with-coordinates
  */
 export async function fetchFormFieldsWithCoordinates(
-  file: File | Blob
+  file: File | Blob,
 ): Promise<FormField[]> {
   const formData = new FormData();
-  formData.append('file', file);
+  formData.append("file", file);
 
   const response = await apiClient.post<FormField[]>(
-    '/api/v1/form/fields-with-coordinates',
-    formData
+    "/api/v1/form/fields-with-coordinates",
+    formData,
   );
   return response.data;
 }
@@ -28,18 +28,18 @@ export async function fetchFormFieldsWithCoordinates(
 export async function fillFormFields(
   file: File | Blob,
   values: Record<string, string>,
-  flatten: boolean = false
+  flatten: boolean = false,
 ): Promise<Blob> {
   const formData = new FormData();
-  formData.append('file', file);
+  formData.append("file", file);
   formData.append(
-    'data',
-    new Blob([JSON.stringify(values)], { type: 'application/json' })
+    "data",
+    new Blob([JSON.stringify(values)], { type: "application/json" }),
   );
-  formData.append('flatten', String(flatten));
+  formData.append("flatten", String(flatten));
 
-  const response = await apiClient.post('/api/v1/form/fill', formData, {
-    responseType: 'blob',
+  const response = await apiClient.post("/api/v1/form/fill", formData, {
+    responseType: "blob",
   });
   return response.data;
 }
@@ -50,19 +50,19 @@ export async function fillFormFields(
  */
 export async function extractFormFieldsCsv(
   file: File | Blob,
-  values?: Record<string, string>
+  values?: Record<string, string>,
 ): Promise<Blob> {
   const formData = new FormData();
-  formData.append('file', file);
+  formData.append("file", file);
   if (values) {
     formData.append(
-      'data',
-      new Blob([JSON.stringify(values)], { type: 'application/json' })
+      "data",
+      new Blob([JSON.stringify(values)], { type: "application/json" }),
     );
   }
 
-  const response = await apiClient.post('/api/v1/form/extract-csv', formData, {
-    responseType: 'blob',
+  const response = await apiClient.post("/api/v1/form/extract-csv", formData, {
+    responseType: "blob",
   });
   return response.data;
 }
@@ -73,20 +73,19 @@ export async function extractFormFieldsCsv(
  */
 export async function extractFormFieldsXlsx(
   file: File | Blob,
-  values?: Record<string, string>
+  values?: Record<string, string>,
 ): Promise<Blob> {
   const formData = new FormData();
-  formData.append('file', file);
+  formData.append("file", file);
   if (values) {
     formData.append(
-      'data',
-      new Blob([JSON.stringify(values)], { type: 'application/json' })
+      "data",
+      new Blob([JSON.stringify(values)], { type: "application/json" }),
     );
   }
 
-  const response = await apiClient.post('/api/v1/form/extract-xlsx', formData, {
-    responseType: 'blob',
+  const response = await apiClient.post("/api/v1/form/extract-xlsx", formData, {
+    responseType: "blob",
   });
   return response.data;
 }
-
diff --git a/frontend/src/core/tools/formFill/index.ts b/frontend/src/core/tools/formFill/index.ts
index 1b71f393c0..5427702c15 100644
--- a/frontend/src/core/tools/formFill/index.ts
+++ b/frontend/src/core/tools/formFill/index.ts
@@ -1,11 +1,24 @@
-export { FormFillProvider, useFormFill, useFieldValue, useAllFormValues } from '@app/tools/formFill/FormFillContext';
-export { FormFieldSidebar } from '@app/tools/formFill/FormFieldSidebar';
-export { FormFieldOverlay } from '@app/tools/formFill/FormFieldOverlay';
-export { FormSaveBar } from '@app/tools/formFill/FormSaveBar';
-export { default as FormFill } from '@app/tools/formFill/FormFill';
-export { FieldInput } from '@app/tools/formFill/FieldInput';
-export { FIELD_TYPE_ICON, FIELD_TYPE_COLOR } from '@app/tools/formFill/fieldMeta';
-export type { FormField, FormFieldType, FormFillState, WidgetCoordinates } from '@app/tools/formFill/types';
-export type { IFormDataProvider } from '@app/tools/formFill/providers/types';
-export { PdfiumFormProvider } from '@app/tools/formFill/providers/PdfiumFormProvider';
-export { PdfBoxFormProvider } from '@app/tools/formFill/providers/PdfBoxFormProvider';
+export {
+  FormFillProvider,
+  useFormFill,
+  useFieldValue,
+  useAllFormValues,
+} from "@app/tools/formFill/FormFillContext";
+export { FormFieldSidebar } from "@app/tools/formFill/FormFieldSidebar";
+export { FormFieldOverlay } from "@app/tools/formFill/FormFieldOverlay";
+export { FormSaveBar } from "@app/tools/formFill/FormSaveBar";
+export { default as FormFill } from "@app/tools/formFill/FormFill";
+export { FieldInput } from "@app/tools/formFill/FieldInput";
+export {
+  FIELD_TYPE_ICON,
+  FIELD_TYPE_COLOR,
+} from "@app/tools/formFill/fieldMeta";
+export type {
+  FormField,
+  FormFieldType,
+  FormFillState,
+  WidgetCoordinates,
+} from "@app/tools/formFill/types";
+export type { IFormDataProvider } from "@app/tools/formFill/providers/types";
+export { PdfiumFormProvider } from "@app/tools/formFill/providers/PdfiumFormProvider";
+export { PdfBoxFormProvider } from "@app/tools/formFill/providers/PdfBoxFormProvider";
diff --git a/frontend/src/core/tools/formFill/providers/PdfBoxFormProvider.ts b/frontend/src/core/tools/formFill/providers/PdfBoxFormProvider.ts
index a2329a48bf..d9ec22d9eb 100644
--- a/frontend/src/core/tools/formFill/providers/PdfBoxFormProvider.ts
+++ b/frontend/src/core/tools/formFill/providers/PdfBoxFormProvider.ts
@@ -8,15 +8,15 @@
  *
  * Used in the dedicated formFill tool mode.
  */
-import type { FormField } from '@app/tools/formFill/types';
-import type { IFormDataProvider } from '@app/tools/formFill/providers/types';
+import type { FormField } from "@app/tools/formFill/types";
+import type { IFormDataProvider } from "@app/tools/formFill/providers/types";
 import {
   fetchFormFieldsWithCoordinates,
   fillFormFields,
-} from '@app/tools/formFill/formApi';
+} from "@app/tools/formFill/formApi";
 
 export class PdfBoxFormProvider implements IFormDataProvider {
-  readonly name = 'pdfbox';
+  readonly name = "pdfbox";
 
   async fetchFields(file: File | Blob): Promise<FormField[]> {
     return fetchFormFieldsWithCoordinates(file);
diff --git a/frontend/src/core/tools/formFill/providers/PdfiumFormProvider.ts b/frontend/src/core/tools/formFill/providers/PdfiumFormProvider.ts
index a951d25347..b560c28670 100644
--- a/frontend/src/core/tools/formFill/providers/PdfiumFormProvider.ts
+++ b/frontend/src/core/tools/formFill/providers/PdfiumFormProvider.ts
@@ -13,10 +13,15 @@
  * FormUtils.createWidgetCoordinates() does, so the same overlay code works
  * for both providers.
  */
-import { PDF_FORM_FIELD_TYPE } from '@app/services/pdfiumService';
-import { FPDF_ANNOT_WIDGET, FLAT_PRINT } from '@app/utils/pdfiumBitmapUtils';
-import type { FormField, FormFieldType, WidgetCoordinates, ButtonAction } from '@app/tools/formFill/types';
-import type { IFormDataProvider } from '@app/tools/formFill/providers/types';
+import { PDF_FORM_FIELD_TYPE } from "@app/services/pdfiumService";
+import { FPDF_ANNOT_WIDGET, FLAT_PRINT } from "@app/utils/pdfiumBitmapUtils";
+import type {
+  FormField,
+  FormFieldType,
+  WidgetCoordinates,
+  ButtonAction,
+} from "@app/tools/formFill/types";
+import type { IFormDataProvider } from "@app/tools/formFill/providers/types";
 import {
   closeDocAndFreeBuffer,
   extractFormFields,
@@ -25,7 +30,7 @@ import {
   readUtf16,
   saveRawDocument,
   type PdfiumFormField,
-} from '@app/services/pdfiumService';
+} from "@app/services/pdfiumService";
 
 /**
  * Map PDFium form field type enum to our FormFieldType string.
@@ -33,21 +38,21 @@ import {
 function mapFieldType(t: PDF_FORM_FIELD_TYPE): FormFieldType {
   switch (t) {
     case PDF_FORM_FIELD_TYPE.TEXTFIELD:
-      return 'text';
+      return "text";
     case PDF_FORM_FIELD_TYPE.CHECKBOX:
-      return 'checkbox';
+      return "checkbox";
     case PDF_FORM_FIELD_TYPE.COMBOBOX:
-      return 'combobox';
+      return "combobox";
     case PDF_FORM_FIELD_TYPE.RADIOBUTTON:
-      return 'radio';
+      return "radio";
     case PDF_FORM_FIELD_TYPE.LISTBOX:
-      return 'listbox';
+      return "listbox";
     case PDF_FORM_FIELD_TYPE.PUSHBUTTON:
-      return 'button';
+      return "button";
     case PDF_FORM_FIELD_TYPE.SIGNATURE:
-      return 'signature';
+      return "signature";
     default:
-      return 'text';
+      return "text";
   }
 }
 
@@ -77,13 +82,13 @@ function toFormField(
 
   // Derive value string
   let value = f.value;
-  if (type === 'checkbox') {
-    value = f.isChecked ? 'Yes' : 'Off';
-  } else if (type === 'radio') {
+  if (type === "checkbox") {
+    value = f.isChecked ? "Yes" : "Off";
+  } else if (type === "radio") {
     // Use widget index as the canonical radio value.
     // This avoids issues with duplicate exportValues across widgets
     // (e.g., all widgets having exportValue "Yes").
-    value = '';
+    value = "";
     for (let i = 0; i < f.widgets.length; i++) {
       if (f.widgets[i].isChecked) {
         value = String(i);
@@ -102,7 +107,7 @@ function toFormField(
 
   return {
     name: f.name,
-    label: f.name.split('.').pop() || f.name,
+    label: f.name.split(".").pop() || f.name,
     type,
     value,
     options,
@@ -110,7 +115,7 @@ function toFormField(
     required: f.isRequired,
     readOnly: f.isReadOnly,
     multiSelect: f.type === PDF_FORM_FIELD_TYPE.LISTBOX,
-    multiline: type === 'text' && (f.flags & 0x1000) !== 0,   // bit 13 = Multiline
+    multiline: type === "text" && (f.flags & 0x1000) !== 0, // bit 13 = Multiline
     tooltip: f._tooltip ?? null,
     widgets,
     buttonLabel: buttonInfo?.label ?? null,
@@ -126,7 +131,7 @@ function toFormField(
  */
 export class PdfiumFormProvider implements IFormDataProvider {
   /** Provider identifier — kept as 'pdf-lib' for backwards-compatibility. */
-  readonly name = 'pdf-lib';
+  readonly name = "pdf-lib";
 
   async fetchFields(file: File | Blob): Promise<FormField[]> {
     try {
@@ -137,16 +142,28 @@ export class PdfiumFormProvider implements IFormDataProvider {
       await this.enrichWithAlternateNames(arrayBuffer, pdfiumFields);
 
       // Enrich combo/listbox fields with export/display values from pdf-lib
-      const optMap = await this.extractDisplayOptions(arrayBuffer, pdfiumFields);
+      const optMap = await this.extractDisplayOptions(
+        arrayBuffer,
+        pdfiumFields,
+      );
 
       // Enrich push buttons with label (/MK/CA) and action (/A) from pdf-lib
-      const buttonInfoMap = await this.extractButtonInfo(arrayBuffer, pdfiumFields);
+      const buttonInfoMap = await this.extractButtonInfo(
+        arrayBuffer,
+        pdfiumFields,
+      );
 
       return pdfiumFields
         .filter((f) => f.widgets.length > 0)
-        .map((f) => toFormField(f, optMap.get(f.name) ?? null, buttonInfoMap.get(f.name) ?? null));
+        .map((f) =>
+          toFormField(
+            f,
+            optMap.get(f.name) ?? null,
+            buttonInfoMap.get(f.name) ?? null,
+          ),
+        );
     } catch (err) {
-      console.warn('[PdfiumFormProvider] Failed to extract form fields:', err);
+      console.warn("[PdfiumFormProvider] Failed to extract form fields:", err);
       return [];
     }
   }
@@ -163,20 +180,31 @@ export class PdfiumFormProvider implements IFormDataProvider {
       const docPtr = await openRawDocumentSafe(data);
       try {
         const formInfoPtr = m.PDFiumExt_OpenFormFillInfo();
-        const formEnvPtr = m.PDFiumExt_InitFormFillEnvironment(docPtr, formInfoPtr);
+        const formEnvPtr = m.PDFiumExt_InitFormFillEnvironment(
+          docPtr,
+          formInfoPtr,
+        );
         if (!formEnvPtr) return;
 
         const pageCount = m.FPDF_GetPageCount(docPtr);
         const nameToField = new Map(fields.map((f) => [f.name, f]));
         const enriched = new Set<string>();
 
-        for (let pageIdx = 0; pageIdx < pageCount && enriched.size < nameToField.size; pageIdx++) {
+        for (
+          let pageIdx = 0;
+          pageIdx < pageCount && enriched.size < nameToField.size;
+          pageIdx++
+        ) {
           const pagePtr = m.FPDF_LoadPage(docPtr, pageIdx);
           if (!pagePtr) continue;
           m.FORM_OnAfterLoadPage(pagePtr, formEnvPtr);
 
           const annotCount = m.FPDFPage_GetAnnotCount(pagePtr);
-          for (let ai = 0; ai < annotCount && enriched.size < nameToField.size; ai++) {
+          for (
+            let ai = 0;
+            ai < annotCount && enriched.size < nameToField.size;
+            ai++
+          ) {
             const annotPtr = m.FPDFPage_GetAnnot(pagePtr, ai);
             if (!annotPtr) continue;
             if (m.FPDFAnnot_GetSubtype(annotPtr) !== FPDF_ANNOT_WIDGET) {
@@ -185,7 +213,7 @@ export class PdfiumFormProvider implements IFormDataProvider {
             }
 
             const nl = m.FPDFAnnot_GetFormFieldName(formEnvPtr, annotPtr, 0, 0);
-            let name = '';
+            let name = "";
             if (nl > 0) {
               const nb = m.pdfium.wasmExports.malloc(nl);
               m.FPDFAnnot_GetFormFieldName(formEnvPtr, annotPtr, nb, nl);
@@ -194,10 +222,20 @@ export class PdfiumFormProvider implements IFormDataProvider {
             }
 
             if (name && nameToField.has(name) && !enriched.has(name)) {
-              const altLen = m.FPDFAnnot_GetFormFieldAlternateName(formEnvPtr, annotPtr, 0, 0);
+              const altLen = m.FPDFAnnot_GetFormFieldAlternateName(
+                formEnvPtr,
+                annotPtr,
+                0,
+                0,
+              );
               if (altLen > 0) {
                 const altBuf = m.pdfium.wasmExports.malloc(altLen);
-                m.FPDFAnnot_GetFormFieldAlternateName(formEnvPtr, annotPtr, altBuf, altLen);
+                m.FPDFAnnot_GetFormFieldAlternateName(
+                  formEnvPtr,
+                  annotPtr,
+                  altBuf,
+                  altLen,
+                );
                 const altName = readUtf16(m, altBuf, altLen);
                 m.pdfium.wasmExports.free(altBuf);
                 (nameToField.get(name) as any)._tooltip = altName || null;
@@ -218,7 +256,7 @@ export class PdfiumFormProvider implements IFormDataProvider {
         closeDocAndFreeBuffer(m, docPtr);
       }
     } catch (e) {
-      console.warn('[PdfiumFormProvider] Failed to enrich alternate names:', e);
+      console.warn("[PdfiumFormProvider] Failed to enrich alternate names:", e);
     }
   }
 
@@ -232,30 +270,50 @@ export class PdfiumFormProvider implements IFormDataProvider {
     data: ArrayBuffer,
     fields: PdfiumFormField[],
   ): Promise<Map<string, { exportValues: string[]; displayValues: string[] }>> {
-    const result = new Map<string, { exportValues: string[]; displayValues: string[] }>();
+    const result = new Map<
+      string,
+      { exportValues: string[]; displayValues: string[] }
+    >();
     const comboOrList = fields.filter(
-      (f) => f.type === PDF_FORM_FIELD_TYPE.COMBOBOX || f.type === PDF_FORM_FIELD_TYPE.LISTBOX,
+      (f) =>
+        f.type === PDF_FORM_FIELD_TYPE.COMBOBOX ||
+        f.type === PDF_FORM_FIELD_TYPE.LISTBOX,
     );
     if (comboOrList.length === 0) return result;
 
     try {
-      const { PDFDocument, PDFName, PDFArray, PDFString, PDFHexString, PDFDropdown, PDFOptionList } =
-        await import('@cantoo/pdf-lib');
-      const doc = await PDFDocument.load(data, { ignoreEncryption: true, throwOnInvalidObject: false });
+      const {
+        PDFDocument,
+        PDFName,
+        PDFArray,
+        PDFString,
+        PDFHexString,
+        PDFDropdown,
+        PDFOptionList,
+      } = await import("@cantoo/pdf-lib");
+      const doc = await PDFDocument.load(data, {
+        ignoreEncryption: true,
+        throwOnInvalidObject: false,
+      });
       const form = doc.getForm();
 
       const decodeText = (obj: unknown): string => {
-        if (obj instanceof PDFString || obj instanceof PDFHexString) return obj.decodeText();
-        return String(obj ?? '');
+        if (obj instanceof PDFString || obj instanceof PDFHexString)
+          return obj.decodeText();
+        return String(obj ?? "");
       };
 
       for (const pf of comboOrList) {
         try {
           const field = form.getField(pf.name);
-          if (!(field instanceof PDFDropdown) && !(field instanceof PDFOptionList)) continue;
+          if (
+            !(field instanceof PDFDropdown) &&
+            !(field instanceof PDFOptionList)
+          )
+            continue;
 
           const acroDict = (field.acroField as any).dict;
-          const optRaw = acroDict.lookup(PDFName.of('Opt'));
+          const optRaw = acroDict.lookup(PDFName.of("Opt"));
           if (!(optRaw instanceof PDFArray)) continue;
 
           const exportValues: string[] = [];
@@ -292,7 +350,10 @@ export class PdfiumFormProvider implements IFormDataProvider {
         }
       }
     } catch (e) {
-      console.warn('[PdfiumFormProvider] Failed to extract display options:', e);
+      console.warn(
+        "[PdfiumFormProvider] Failed to extract display options:",
+        e,
+      );
     }
 
     return result;
@@ -307,58 +368,71 @@ export class PdfiumFormProvider implements IFormDataProvider {
     fields: PdfiumFormField[],
   ): Promise<Map<string, { label?: string; action?: ButtonAction }>> {
     const result = new Map<string, { label?: string; action?: ButtonAction }>();
-    const buttons = fields.filter((f) => f.type === PDF_FORM_FIELD_TYPE.PUSHBUTTON);
+    const buttons = fields.filter(
+      (f) => f.type === PDF_FORM_FIELD_TYPE.PUSHBUTTON,
+    );
     if (buttons.length === 0) return result;
 
     try {
       const { PDFDocument, PDFName, PDFString, PDFHexString, PDFDict } =
-        await import('@cantoo/pdf-lib');
+        await import("@cantoo/pdf-lib");
 
-      const doc = await PDFDocument.load(data, { ignoreEncryption: true, throwOnInvalidObject: false });
+      const doc = await PDFDocument.load(data, {
+        ignoreEncryption: true,
+        throwOnInvalidObject: false,
+      });
       const form = doc.getForm();
 
       const decodeText = (obj: unknown): string | null => {
-        if (obj instanceof PDFString || obj instanceof PDFHexString) return obj.decodeText();
-        if (obj instanceof PDFName) return (obj as any).asString?.() ?? obj.toString().replace(/^\//, '');
+        if (obj instanceof PDFString || obj instanceof PDFHexString)
+          return obj.decodeText();
+        if (obj instanceof PDFName)
+          return (obj as any).asString?.() ?? obj.toString().replace(/^\//, "");
         return null;
       };
 
       const parseActionDict = (aObj: unknown): ButtonAction | null => {
         if (!(aObj instanceof PDFDict)) return null;
-        const sObj = aObj.lookup(PDFName.of('S'));
+        const sObj = aObj.lookup(PDFName.of("S"));
         if (!(sObj instanceof PDFName)) return null;
-        const actionType: string = (sObj as any).asString?.() ?? sObj.toString().replace(/^\//, '');
+        const actionType: string =
+          (sObj as any).asString?.() ?? sObj.toString().replace(/^\//, "");
 
         switch (actionType) {
-          case 'Named': {
-            const nObj = aObj.lookup(PDFName.of('N'));
-            const name = nObj instanceof PDFName
-              ? ((nObj as any).asString?.() ?? nObj.toString().replace(/^\//, ''))
-              : '';
-            return { type: 'named', namedAction: name };
+          case "Named": {
+            const nObj = aObj.lookup(PDFName.of("N"));
+            const name =
+              nObj instanceof PDFName
+                ? ((nObj as any).asString?.() ??
+                  nObj.toString().replace(/^\//, ""))
+                : "";
+            return { type: "named", namedAction: name };
           }
-          case 'JavaScript': {
-            const jsObj = aObj.lookup(PDFName.of('JS'));
-            const js = decodeText(jsObj) ?? jsObj?.toString() ?? '';
-            return { type: 'javascript', javascript: js };
+          case "JavaScript": {
+            const jsObj = aObj.lookup(PDFName.of("JS"));
+            const js = decodeText(jsObj) ?? jsObj?.toString() ?? "";
+            return { type: "javascript", javascript: js };
           }
-          case 'SubmitForm': {
-            const fObj = aObj.lookup(PDFName.of('F'));
-            let url = '';
+          case "SubmitForm": {
+            const fObj = aObj.lookup(PDFName.of("F"));
+            let url = "";
             if (fObj instanceof PDFDict) {
-              url = decodeText(fObj.lookup(PDFName.of('F'))) ?? '';
+              url = decodeText(fObj.lookup(PDFName.of("F"))) ?? "";
             } else if (fObj) {
               url = decodeText(fObj) ?? fObj.toString();
             }
-            const flagsObj = aObj.lookup(PDFName.of('Flags'));
-            const flags = typeof (flagsObj as any)?.asNumber === 'function' ? (flagsObj as any).asNumber() : 0;
-            return { type: 'submitForm', url, submitFlags: flags };
+            const flagsObj = aObj.lookup(PDFName.of("Flags"));
+            const flags =
+              typeof (flagsObj as any)?.asNumber === "function"
+                ? (flagsObj as any).asNumber()
+                : 0;
+            return { type: "submitForm", url, submitFlags: flags };
           }
-          case 'ResetForm':
-            return { type: 'resetForm' };
-          case 'URI': {
-            const uriObj = aObj.lookup(PDFName.of('URI'));
-            return { type: 'uri', url: decodeText(uriObj) ?? '' };
+          case "ResetForm":
+            return { type: "resetForm" };
+          case "URI": {
+            const uriObj = aObj.lookup(PDFName.of("URI"));
+            return { type: "uri", url: decodeText(uriObj) ?? "" };
           }
           default:
             return null;
@@ -367,9 +441,9 @@ export class PdfiumFormProvider implements IFormDataProvider {
 
       const getMkCaption = (dict: any): string | null => {
         try {
-          const mkObj = dict.lookup(PDFName.of('MK'));
+          const mkObj = dict.lookup(PDFName.of("MK"));
           if (!(mkObj instanceof PDFDict)) return null;
-          const caObj = mkObj.lookup(PDFName.of('CA'));
+          const caObj = mkObj.lookup(PDFName.of("CA"));
           return decodeText(caObj);
         } catch {
           return null;
@@ -378,7 +452,7 @@ export class PdfiumFormProvider implements IFormDataProvider {
 
       const getActionFromDict = (dict: any): ButtonAction | null => {
         try {
-          return parseActionDict(dict.lookup(PDFName.of('A')));
+          return parseActionDict(dict.lookup(PDFName.of("A")));
         } catch {
           return null;
         }
@@ -423,22 +497,26 @@ export class PdfiumFormProvider implements IFormDataProvider {
           // Also check /AA (Additional Actions) → /U (Mouse Up) if no /A found
           if (!info.action) {
             try {
-              const aaObj = acroField.dict.lookup(PDFName.of('AA'));
+              const aaObj = acroField.dict.lookup(PDFName.of("AA"));
               if (aaObj instanceof PDFDict) {
-                const uObj = aaObj.lookup(PDFName.of('U'));
+                const uObj = aaObj.lookup(PDFName.of("U"));
                 const action = parseActionDict(uObj);
                 if (action) info.action = action;
               }
-            } catch { /* non-critical */ }
+            } catch {
+              /* non-critical */
+            }
           }
 
           if (info.label || info.action) {
             result.set(name, info);
           }
-        } catch { /* skip individual field errors */ }
+        } catch {
+          /* skip individual field errors */
+        }
       }
     } catch (e) {
-      console.warn('[PdfiumFormProvider] Failed to extract button info:', e);
+      console.warn("[PdfiumFormProvider] Failed to extract button info:", e);
     }
 
     return result;
@@ -455,9 +533,12 @@ export class PdfiumFormProvider implements IFormDataProvider {
 
     try {
       const formInfoPtr = m.PDFiumExt_OpenFormFillInfo();
-      const formEnvPtr = m.PDFiumExt_InitFormFillEnvironment(docPtr, formInfoPtr);
+      const formEnvPtr = m.PDFiumExt_InitFormFillEnvironment(
+        docPtr,
+        formInfoPtr,
+      );
       if (!formEnvPtr) {
-        throw new Error('PDFium: failed to initialise form environment');
+        throw new Error("PDFium: failed to initialise form environment");
       }
 
       const pageCount = m.FPDF_GetPageCount(docPtr);
@@ -481,7 +562,7 @@ export class PdfiumFormProvider implements IFormDataProvider {
           }
 
           const nl = m.FPDFAnnot_GetFormFieldName(formEnvPtr, annotPtr, 0, 0);
-          let fieldName = '';
+          let fieldName = "";
           if (nl > 0) {
             const nb = m.pdfium.wasmExports.malloc(nl);
             m.FPDFAnnot_GetFormFieldName(formEnvPtr, annotPtr, nb, nl);
@@ -511,8 +592,11 @@ export class PdfiumFormProvider implements IFormDataProvider {
               // Focus → Enter key (FORM_OnChar with keycode 13) → Kill focus.
               // Click simulation (FORM_OnLButtonDown/Up) does NOT reliably
               // persist checkbox state changes in headless/offscreen mode.
-              const isCurrentlyChecked = m.FPDFAnnot_IsChecked(formEnvPtr, annotPtr);
-              const shouldBeChecked = value !== '' && value !== 'Off';
+              const isCurrentlyChecked = m.FPDFAnnot_IsChecked(
+                formEnvPtr,
+                annotPtr,
+              );
+              const shouldBeChecked = value !== "" && value !== "Off";
               if (isCurrentlyChecked !== shouldBeChecked) {
                 const ENTER_KEY = 13;
                 m.FORM_SetFocusedAnnot(formEnvPtr, annotPtr);
@@ -528,7 +612,10 @@ export class PdfiumFormProvider implements IFormDataProvider {
 
               const targetIdx = parseInt(value, 10);
               if (!isNaN(targetIdx) && currentIdx === targetIdx) {
-                const isAlreadyChecked = m.FPDFAnnot_IsChecked(formEnvPtr, annotPtr);
+                const isAlreadyChecked = m.FPDFAnnot_IsChecked(
+                  formEnvPtr,
+                  annotPtr,
+                );
                 if (!isAlreadyChecked) {
                   const ENTER_KEY = 13;
                   m.FORM_SetFocusedAnnot(formEnvPtr, annotPtr);
@@ -546,10 +633,22 @@ export class PdfiumFormProvider implements IFormDataProvider {
               let matched = false;
               const optCount = m.FPDFAnnot_GetOptionCount(formEnvPtr, annotPtr);
               for (let oi = 0; oi < optCount; oi++) {
-                const optLen = m.FPDFAnnot_GetOptionLabel(formEnvPtr, annotPtr, oi, 0, 0);
+                const optLen = m.FPDFAnnot_GetOptionLabel(
+                  formEnvPtr,
+                  annotPtr,
+                  oi,
+                  0,
+                  0,
+                );
                 if (optLen > 0) {
                   const ob = m.pdfium.wasmExports.malloc(optLen);
-                  m.FPDFAnnot_GetOptionLabel(formEnvPtr, annotPtr, oi, ob, optLen);
+                  m.FPDFAnnot_GetOptionLabel(
+                    formEnvPtr,
+                    annotPtr,
+                    oi,
+                    ob,
+                    optLen,
+                  );
                   const optLabel = readUtf16(m, ob, optLen);
                   m.pdfium.wasmExports.free(ob);
                   if (optLabel === value) {
@@ -564,7 +663,9 @@ export class PdfiumFormProvider implements IFormDataProvider {
               // cases where export values differ from display labels).
               if (!matched && value) {
                 m.FORM_SelectAllText(formEnvPtr, pagePtr);
-                const wPtr = m.pdfium.wasmExports.malloc((value.length + 1) * 2);
+                const wPtr = m.pdfium.wasmExports.malloc(
+                  (value.length + 1) * 2,
+                );
                 m.pdfium.stringToUTF16(value, wPtr, (value.length + 1) * 2);
                 m.FORM_ReplaceSelection(formEnvPtr, pagePtr, wPtr);
                 m.pdfium.wasmExports.free(wPtr);
@@ -573,7 +674,10 @@ export class PdfiumFormProvider implements IFormDataProvider {
               m.FORM_ForceToKillFocus(formEnvPtr);
             }
           } catch (err) {
-            console.warn(`[PdfiumFormProvider] Failed to set "${fieldName}":`, err);
+            console.warn(
+              `[PdfiumFormProvider] Failed to set "${fieldName}":`,
+              err,
+            );
           }
 
           m.FPDFPage_CloseAnnot(annotPtr);
@@ -591,7 +695,7 @@ export class PdfiumFormProvider implements IFormDataProvider {
       m.PDFiumExt_CloseFormFillInfo(formInfoPtr);
 
       const savedBytes = await saveRawDocument(docPtr);
-      return new Blob([savedBytes], { type: 'application/pdf' });
+      return new Blob([savedBytes], { type: "application/pdf" });
     } finally {
       closeDocAndFreeBuffer(m, docPtr);
     }
diff --git a/frontend/src/core/tools/formFill/providers/index.ts b/frontend/src/core/tools/formFill/providers/index.ts
index b71780b106..59d72f00f1 100644
--- a/frontend/src/core/tools/formFill/providers/index.ts
+++ b/frontend/src/core/tools/formFill/providers/index.ts
@@ -1,3 +1,3 @@
-export type { IFormDataProvider } from '@app/tools/formFill/providers/types';
-export { PdfiumFormProvider } from '@app/tools/formFill/providers/PdfiumFormProvider';
-export { PdfBoxFormProvider } from '@app/tools/formFill/providers/PdfBoxFormProvider';
+export type { IFormDataProvider } from "@app/tools/formFill/providers/types";
+export { PdfiumFormProvider } from "@app/tools/formFill/providers/PdfiumFormProvider";
+export { PdfBoxFormProvider } from "@app/tools/formFill/providers/PdfBoxFormProvider";
diff --git a/frontend/src/core/tools/formFill/providers/types.ts b/frontend/src/core/tools/formFill/providers/types.ts
index 605111fece..60418d07db 100644
--- a/frontend/src/core/tools/formFill/providers/types.ts
+++ b/frontend/src/core/tools/formFill/providers/types.ts
@@ -10,7 +10,7 @@
  * The UI components (FormFieldOverlay, FormFill, FormFieldSidebar) consume
  * data through FormFillContext, which delegates to whichever provider is active.
  */
-import type { FormField } from '@app/tools/formFill/types';
+import type { FormField } from "@app/tools/formFill/types";
 
 export interface IFormDataProvider {
   /** Unique identifier for the provider (for debugging/logging) */
diff --git a/frontend/src/core/tools/formFill/types.ts b/frontend/src/core/tools/formFill/types.ts
index 693c7ec2e4..3f263ff817 100644
--- a/frontend/src/core/tools/formFill/types.ts
+++ b/frontend/src/core/tools/formFill/types.ts
@@ -5,9 +5,9 @@
 
 export interface WidgetCoordinates {
   pageIndex: number;
-  x: number;      // PDF points, un-rotated, CSS upper-left origin
-  y: number;      // PDF points, un-rotated, CSS upper-left origin
-  width: number;  // PDF points
+  x: number; // PDF points, un-rotated, CSS upper-left origin
+  y: number; // PDF points, un-rotated, CSS upper-left origin
+  width: number; // PDF points
   height: number; // PDF points
   /** Export value for this specific widget (radio/checkbox only) */
   exportValue?: string;
@@ -39,21 +39,21 @@ export interface FormField {
 }
 
 export type FormFieldType =
-  | 'text'
-  | 'checkbox'
-  | 'combobox'
-  | 'listbox'
-  | 'radio'
-  | 'button'
-  | 'signature';
+  | "text"
+  | "checkbox"
+  | "combobox"
+  | "listbox"
+  | "radio"
+  | "button"
+  | "signature";
 
 export type ButtonActionType =
-  | 'named'
-  | 'javascript'
-  | 'submitForm'
-  | 'resetForm'
-  | 'uri'
-  | 'none';
+  | "named"
+  | "javascript"
+  | "submitForm"
+  | "resetForm"
+  | "uri"
+  | "none";
 
 export interface ButtonAction {
   type: ButtonActionType;
diff --git a/frontend/src/core/tools/pdfTextEditor/PdfTextEditor.tsx b/frontend/src/core/tools/pdfTextEditor/PdfTextEditor.tsx
index 9b09f27d00..3c74799a67 100644
--- a/frontend/src/core/tools/pdfTextEditor/PdfTextEditor.tsx
+++ b/frontend/src/core/tools/pdfTextEditor/PdfTextEditor.tsx
@@ -1,19 +1,26 @@
-import { useCallback, useEffect, useMemo, useState, useRef } from 'react';
-import { useTranslation } from 'react-i18next';
-import DescriptionIcon from '@mui/icons-material/DescriptionOutlined';
+import { useCallback, useEffect, useMemo, useState, useRef } from "react";
+import { useTranslation } from "react-i18next";
+import DescriptionIcon from "@mui/icons-material/DescriptionOutlined";
 
-import { useToolWorkflow } from '@app/contexts/ToolWorkflowContext';
-import { useFileSelection, useFileManagement, useFileContext } from '@app/contexts/FileContext';
-import { useNavigationActions, useNavigationState } from '@app/contexts/NavigationContext';
-import { createStirlingFilesAndStubs } from '@app/services/fileStubHelpers';
-import { BaseToolProps, ToolComponent } from '@app/types/tool';
-import { getDefaultWorkbench } from '@app/types/workbench';
-import { CONVERSION_ENDPOINTS } from '@app/constants/convertConstants';
-import apiClient from '@app/services/apiClient';
-import { downloadBlob, downloadTextAsFile } from '@app/utils/downloadUtils';
-import { getFilenameFromHeaders } from '@app/utils/fileResponseUtils';
-import { pdfWorkerManager } from '@app/services/pdfWorkerManager';
-import { Util } from 'pdfjs-dist/legacy/build/pdf.mjs';
+import { useToolWorkflow } from "@app/contexts/ToolWorkflowContext";
+import {
+  useFileSelection,
+  useFileManagement,
+  useFileContext,
+} from "@app/contexts/FileContext";
+import {
+  useNavigationActions,
+  useNavigationState,
+} from "@app/contexts/NavigationContext";
+import { createStirlingFilesAndStubs } from "@app/services/fileStubHelpers";
+import { BaseToolProps, ToolComponent } from "@app/types/tool";
+import { getDefaultWorkbench } from "@app/types/workbench";
+import { CONVERSION_ENDPOINTS } from "@app/constants/convertConstants";
+import apiClient from "@app/services/apiClient";
+import { downloadBlob, downloadTextAsFile } from "@app/utils/downloadUtils";
+import { getFilenameFromHeaders } from "@app/utils/fileResponseUtils";
+import { pdfWorkerManager } from "@app/services/pdfWorkerManager";
+import { Util } from "pdfjs-dist/legacy/build/pdf.mjs";
 import {
   PdfJsonDocument,
   PdfJsonFont,
@@ -23,7 +30,7 @@ import {
   PdfTextEditorViewData,
   BoundingBox,
   ConversionProgress,
-} from '@app/tools/pdfTextEditor/pdfTextEditorTypes';
+} from "@app/tools/pdfTextEditor/pdfTextEditorTypes";
 import {
   deepCloneDocument,
   getDirtyPages,
@@ -33,50 +40,57 @@ import {
   cloneImageElement,
   cloneTextElement,
   valueOr,
-} from '@app/tools/pdfTextEditor/pdfTextEditorUtils';
-import PdfTextEditorView from '@app/components/tools/pdfTextEditor/PdfTextEditorView';
-import PdfTextEditorSidebar from '@app/components/tools/pdfTextEditor/PdfTextEditorSidebar';
-import type { PDFDocumentProxy } from 'pdfjs-dist';
+} from "@app/tools/pdfTextEditor/pdfTextEditorUtils";
+import PdfTextEditorView from "@app/components/tools/pdfTextEditor/PdfTextEditorView";
+import PdfTextEditorSidebar from "@app/components/tools/pdfTextEditor/PdfTextEditorSidebar";
+import type { PDFDocumentProxy } from "pdfjs-dist";
 
-const WORKBENCH_VIEW_ID = 'pdfTextEditorWorkbench';
-const WORKBENCH_ID = 'custom:pdfTextEditor' as const;
+const WORKBENCH_VIEW_ID = "pdfTextEditorWorkbench";
+const WORKBENCH_ID = "custom:pdfTextEditor" as const;
 
 const sanitizeBaseName = (name?: string | null): string => {
   if (!name || name.trim().length === 0) {
-    return 'document';
+    return "document";
   }
-  return name.replace(/\.[^.]+$/u, '');
+  return name.replace(/\.[^.]+$/u, "");
 };
 
 const getAutoLoadKey = (file: File): string => {
   const withId = file as File & { fileId?: string; quickKey?: string };
-  if (withId.fileId && typeof withId.fileId === 'string') {
+  if (withId.fileId && typeof withId.fileId === "string") {
     return withId.fileId;
   }
-  if (withId.quickKey && typeof withId.quickKey === 'string') {
+  if (withId.quickKey && typeof withId.quickKey === "string") {
     return withId.quickKey;
   }
   return `${file.name}|${file.size}|${file.lastModified}`;
 };
 
-const normalizeLineArray = (value: string | undefined | null, expected: number): string[] => {
-  const normalized = (value ?? '').replace(/\r/g, '');
+const normalizeLineArray = (
+  value: string | undefined | null,
+  expected: number,
+): string[] => {
+  const normalized = (value ?? "").replace(/\r/g, "");
   if (expected <= 0) {
     return [normalized];
   }
-  const parts = normalized.split('\n');
+  const parts = normalized.split("\n");
   if (parts.length === expected) {
     return parts;
   }
   if (parts.length < expected) {
-    return parts.concat(Array(expected - parts.length).fill(''));
+    return parts.concat(Array(expected - parts.length).fill(""));
   }
   const head = parts.slice(0, Math.max(expected - 1, 0));
-  const tail = parts.slice(Math.max(expected - 1, 0)).join('\n');
+  const tail = parts.slice(Math.max(expected - 1, 0)).join("\n");
   return [...head, tail];
 };
 
-const cloneLineTemplate = (line: TextGroup, text?: string, originalText?: string): TextGroup => ({
+const cloneLineTemplate = (
+  line: TextGroup,
+  text?: string,
+  originalText?: string,
+): TextGroup => ({
   ...line,
   text: text ?? line.text,
   originalText: originalText ?? line.originalText,
@@ -89,8 +103,14 @@ const cloneLineTemplate = (line: TextGroup, text?: string, originalText?: string
 
 const expandGroupToLines = (group: TextGroup): TextGroup[] => {
   if (group.childLineGroups && group.childLineGroups.length > 0) {
-    const textLines = normalizeLineArray(group.text, group.childLineGroups.length);
-    const originalLines = normalizeLineArray(group.originalText, group.childLineGroups.length);
+    const textLines = normalizeLineArray(
+      group.text,
+      group.childLineGroups.length,
+    );
+    const originalLines = normalizeLineArray(
+      group.originalText,
+      group.childLineGroups.length,
+    );
     return group.childLineGroups.map((child, index) =>
       cloneLineTemplate(child, textLines[index], originalLines[index]),
     );
@@ -113,7 +133,9 @@ const mergeBoundingBoxes = (boxes: BoundingBox[]): BoundingBox => {
   );
 };
 
-const buildMergedGroupFromSelection = (groups: TextGroup[]): TextGroup | null => {
+const buildMergedGroupFromSelection = (
+  groups: TextGroup[],
+): TextGroup | null => {
   if (groups.length === 0) {
     return null;
   }
@@ -123,16 +145,25 @@ const buildMergedGroupFromSelection = (groups: TextGroup[]): TextGroup | null =>
     return null;
   }
 
-  const lineTexts = lineTemplates.map((line) => line.text ?? '');
-  const lineOriginalTexts = lineTemplates.map((line) => line.originalText ?? '');
-  const combinedOriginals = lineTemplates.flatMap((line) => line.originalElements.map(cloneTextElement));
+  const lineTexts = lineTemplates.map((line) => line.text ?? "");
+  const lineOriginalTexts = lineTemplates.map(
+    (line) => line.originalText ?? "",
+  );
+  const combinedOriginals = lineTemplates.flatMap((line) =>
+    line.originalElements.map(cloneTextElement),
+  );
   const combinedElements = combinedOriginals.map(cloneTextElement);
-  const mergedBounds = mergeBoundingBoxes(lineTemplates.map((line) => line.bounds));
+  const mergedBounds = mergeBoundingBoxes(
+    lineTemplates.map((line) => line.bounds),
+  );
 
   const spacingValues: number[] = [];
   for (let index = 1; index < lineTemplates.length; index += 1) {
-    const prevBaseline = lineTemplates[index - 1].baseline ?? lineTemplates[index - 1].bounds.bottom;
-    const currentBaseline = lineTemplates[index].baseline ?? lineTemplates[index].bounds.bottom;
+    const prevBaseline =
+      lineTemplates[index - 1].baseline ??
+      lineTemplates[index - 1].bounds.bottom;
+    const currentBaseline =
+      lineTemplates[index].baseline ?? lineTemplates[index].bounds.bottom;
     const spacing = Math.abs(prevBaseline - currentBaseline);
     if (spacing > 0) {
       spacingValues.push(spacing);
@@ -140,15 +171,18 @@ const buildMergedGroupFromSelection = (groups: TextGroup[]): TextGroup | null =>
   }
   const averageSpacing =
     spacingValues.length > 0
-      ? spacingValues.reduce((sum, value) => sum + value, 0) / spacingValues.length
+      ? spacingValues.reduce((sum, value) => sum + value, 0) /
+        spacingValues.length
       : null;
 
   const first = groups[0];
-  const lineElementCounts = lineTemplates.map((line) => Math.max(line.originalElements.length, 1));
+  const lineElementCounts = lineTemplates.map((line) =>
+    Math.max(line.originalElements.length, 1),
+  );
   const paragraph: TextGroup = {
     ...first,
-    text: lineTexts.join('\n'),
-    originalText: lineOriginalTexts.join('\n'),
+    text: lineTexts.join("\n"),
+    originalText: lineOriginalTexts.join("\n"),
     elements: combinedElements,
     originalElements: combinedOriginals,
     bounds: mergedBounds,
@@ -167,7 +201,9 @@ const splitParagraphGroup = (group: TextGroup): TextGroup[] => {
     return [];
   }
 
-  const templateLines = group.childLineGroups.map((child) => cloneLineTemplate(child));
+  const templateLines = group.childLineGroups.map((child) =>
+    cloneLineTemplate(child),
+  );
   const lineCount = templateLines.length;
   const textLines = normalizeLineArray(group.text, lineCount);
   const originalLines = normalizeLineArray(group.originalText, lineCount);
@@ -185,13 +221,15 @@ const splitParagraphGroup = (group: TextGroup): TextGroup[] => {
   let offset = 0;
   return templateLines.map((template, index) => {
     const take = Math.max(1, baseCounts[index] ?? 1);
-    const slice = group.originalElements.slice(offset, offset + take).map(cloneTextElement);
+    const slice = group.originalElements
+      .slice(offset, offset + take)
+      .map(cloneTextElement);
     offset += take;
     return {
       ...template,
       id: `${group.id}-line-${index + 1}-${Date.now()}-${index}`,
-      text: textLines[index] ?? '',
-      originalText: originalLines[index] ?? '',
+      text: textLines[index] ?? "",
+      originalText: originalLines[index] ?? "",
       elements: slice.map(cloneTextElement),
       originalElements: slice,
       lineElementCounts: null,
@@ -215,28 +253,39 @@ const PdfTextEditor = ({ onComplete, onError }: BaseToolProps) => {
   const { addFiles } = useFileManagement();
   const { consumeFiles, selectors } = useFileContext();
 
-  const [loadedDocument, setLoadedDocument] = useState<PdfJsonDocument | null>(null);
+  const [loadedDocument, setLoadedDocument] = useState<PdfJsonDocument | null>(
+    null,
+  );
   const [groupsByPage, setGroupsByPage] = useState<TextGroup[][]>([]);
   const [imagesByPage, setImagesByPage] = useState<PdfJsonImageElement[][]>([]);
   const [selectedPage, setSelectedPage] = useState(0);
-  const [fileName, setFileName] = useState('');
+  const [fileName, setFileName] = useState("");
   const [errorMessage, setErrorMessage] = useState<string | null>(null);
   const [isGeneratingPdf, setIsGeneratingPdf] = useState(false);
   const [isSavingToWorkbench, setIsSavingToWorkbench] = useState(false);
   const [shouldNavigateAfterSave, setShouldNavigateAfterSave] = useState(false);
   const [isConverting, setIsConverting] = useState(false);
-  const [conversionProgress, setConversionProgress] = useState<ConversionProgress | null>(null);
+  const [conversionProgress, setConversionProgress] =
+    useState<ConversionProgress | null>(null);
   const [forceSingleTextElement, setForceSingleTextElement] = useState(true);
-  const [groupingMode, setGroupingMode] = useState<'auto' | 'paragraph' | 'singleLine'>('auto');
+  const [groupingMode, setGroupingMode] = useState<
+    "auto" | "paragraph" | "singleLine"
+  >("auto");
   const [hasVectorPreview, setHasVectorPreview] = useState(false);
-  const [pagePreviews, setPagePreviews] = useState<Map<number, string>>(new Map());
+  const [pagePreviews, setPagePreviews] = useState<Map<number, string>>(
+    new Map(),
+  );
   const [autoScaleText, setAutoScaleText] = useState(true);
 
   // Lazy loading state
   const [isLazyMode, setIsLazyMode] = useState(false);
   const [cachedJobId, setCachedJobId] = useState<string | null>(null);
-  const [loadedImagePages, setLoadedImagePages] = useState<Set<number>>(new Set());
-  const [loadingImagePages, setLoadingImagePages] = useState<Set<number>>(new Set());
+  const [loadedImagePages, setLoadedImagePages] = useState<Set<number>>(
+    new Set(),
+  );
+  const [loadingImagePages, setLoadingImagePages] = useState<Set<number>>(
+    new Set(),
+  );
 
   const originalImagesRef = useRef<PdfJsonImageElement[][]>([]);
   const originalGroupsRef = useRef<TextGroup[][]>([]);
@@ -258,7 +307,9 @@ const PdfTextEditor = ({ onComplete, onError }: BaseToolProps) => {
   const previousCachedJobIdRef = useRef<string | null>(null);
   const cacheRecoveryInProgressRef = useRef(false);
   const cacheRecoveryAttemptsRef = useRef(0);
-  const recoverCacheAndReloadRef = useRef<() => Promise<boolean>>(async () => false);
+  const recoverCacheAndReloadRef = useRef<() => Promise<boolean>>(
+    async () => false,
+  );
 
   // Keep ref in sync with state for access in async callbacks
   useEffect(() => {
@@ -277,7 +328,6 @@ const PdfTextEditor = ({ onComplete, onError }: BaseToolProps) => {
     pagePreviewsRef.current = pagePreviews;
   }, [pagePreviews]);
 
-
   useEffect(() => {
     return () => {
       if (pdfDocumentRef.current) {
@@ -295,7 +345,13 @@ const PdfTextEditor = ({ onComplete, onError }: BaseToolProps) => {
   }, []);
 
   const dirtyPages = useMemo(
-    () => getDirtyPages(groupsByPage, imagesByPage, originalGroupsRef.current, originalImagesRef.current),
+    () =>
+      getDirtyPages(
+        groupsByPage,
+        imagesByPage,
+        originalGroupsRef.current,
+        originalImagesRef.current,
+      ),
     [groupsByPage, imagesByPage],
   );
   const hasChanges = useMemo(() => dirtyPages.some(Boolean), [dirtyPages]);
@@ -315,48 +371,65 @@ const PdfTextEditor = ({ onComplete, onError }: BaseToolProps) => {
       setShouldNavigateAfterSave(false);
       navigationActions.setToolAndWorkbench(null, getDefaultWorkbench());
     }
-  }, [shouldNavigateAfterSave, navigationState.hasUnsavedChanges, navigationActions]);
+  }, [
+    shouldNavigateAfterSave,
+    navigationState.hasUnsavedChanges,
+    navigationActions,
+  ]);
 
-  const viewLabel = useMemo(() => t('pdfTextEditor.viewLabel', 'PDF Editor'), [t]);
+  const viewLabel = useMemo(
+    () => t("pdfTextEditor.viewLabel", "PDF Editor"),
+    [t],
+  );
   const { selectedFiles } = useFileSelection();
 
-  const resetToDocument = useCallback((document: PdfJsonDocument | null, mode: 'auto' | 'paragraph' | 'singleLine') => {
-    if (!document) {
-      setGroupsByPage([]);
-      setImagesByPage([]);
-      originalImagesRef.current = [];
-      imagesByPageRef.current = [];
-      setLoadedImagePages(new Set());
+  const resetToDocument = useCallback(
+    (
+      document: PdfJsonDocument | null,
+      mode: "auto" | "paragraph" | "singleLine",
+    ) => {
+      if (!document) {
+        setGroupsByPage([]);
+        setImagesByPage([]);
+        originalImagesRef.current = [];
+        imagesByPageRef.current = [];
+        setLoadedImagePages(new Set());
+        setLoadingImagePages(new Set());
+        loadedImagePagesRef.current = new Set();
+        loadingImagePagesRef.current = new Set();
+        setSelectedPage(0);
+        setIsLazyMode(false);
+        setCachedJobId(null);
+        cachedJobIdRef.current = null;
+        return;
+      }
+      const cloned = deepCloneDocument(document);
+      const groups = groupDocumentText(cloned, mode);
+      const images = extractDocumentImages(cloned);
+      const originalImages = images.map((page) => page.map(cloneImageElement));
+      originalImagesRef.current = originalImages;
+      originalGroupsRef.current = groups.map((page) =>
+        page.map((group) => ({ ...group })),
+      );
+      imagesByPageRef.current = images.map((page) =>
+        page.map(cloneImageElement),
+      );
+      const initialLoaded = new Set<number>();
+      originalImages.forEach((pageImages, index) => {
+        if (pageImages.length > 0) {
+          initialLoaded.add(index);
+        }
+      });
+      setGroupsByPage(groups);
+      setImagesByPage(images);
+      setLoadedImagePages(initialLoaded);
       setLoadingImagePages(new Set());
-      loadedImagePagesRef.current = new Set();
+      loadedImagePagesRef.current = new Set(initialLoaded);
       loadingImagePagesRef.current = new Set();
       setSelectedPage(0);
-      setIsLazyMode(false);
-      setCachedJobId(null);
-      cachedJobIdRef.current = null;
-      return;
-    }
-    const cloned = deepCloneDocument(document);
-    const groups = groupDocumentText(cloned, mode);
-    const images = extractDocumentImages(cloned);
-    const originalImages = images.map((page) => page.map(cloneImageElement));
-    originalImagesRef.current = originalImages;
-    originalGroupsRef.current = groups.map((page) => page.map((group) => ({ ...group })));
-    imagesByPageRef.current = images.map((page) => page.map(cloneImageElement));
-    const initialLoaded = new Set<number>();
-    originalImages.forEach((pageImages, index) => {
-      if (pageImages.length > 0) {
-        initialLoaded.add(index);
-      }
-    });
-    setGroupsByPage(groups);
-    setImagesByPage(images);
-    setLoadedImagePages(initialLoaded);
-    setLoadingImagePages(new Set());
-    loadedImagePagesRef.current = new Set(initialLoaded);
-    loadingImagePagesRef.current = new Set();
-    setSelectedPage(0);
-  }, []);
+    },
+    [],
+  );
 
   const clearPdfPreview = useCallback(() => {
     previewRequestIdRef.current += 1;
@@ -376,17 +449,23 @@ const PdfTextEditor = ({ onComplete, onError }: BaseToolProps) => {
     if (!jobId) {
       return;
     }
-    console.log(`[PdfTextEditor] Cleaning up cached document for jobId: ${jobId}`);
-    apiClient.post(`/api/v1/convert/pdf/text-editor/clear-cache/${jobId}`).catch((error) => {
-      console.warn('[PdfTextEditor] Failed to clear cache:', error);
-    });
+    console.log(
+      `[PdfTextEditor] Cleaning up cached document for jobId: ${jobId}`,
+    );
+    apiClient
+      .post(`/api/v1/convert/pdf/text-editor/clear-cache/${jobId}`)
+      .catch((error) => {
+        console.warn("[PdfTextEditor] Failed to clear cache:", error);
+      });
   }, []);
 
   useEffect(() => {
     // Clear old cached job when job ID changes
     const previousJobId = previousCachedJobIdRef.current;
     if (previousJobId && previousJobId !== cachedJobId) {
-      console.log(`[PdfTextEditor] Clearing old cache for jobId: ${previousJobId}, new jobId: ${cachedJobId}`);
+      console.log(
+        `[PdfTextEditor] Clearing old cache for jobId: ${previousJobId}, new jobId: ${cachedJobId}`,
+      );
       clearCachedJob(previousJobId);
     }
     // Update the previous jobId ref for next time
@@ -415,7 +494,10 @@ const PdfTextEditor = ({ onComplete, onError }: BaseToolProps) => {
         setHasVectorPreview(true);
       } catch (error) {
         if (previewRequestIdRef.current === requestId) {
-          console.warn('[PdfTextEditor] Failed to initialise PDF preview:', error);
+          console.warn(
+            "[PdfTextEditor] Failed to initialise PDF preview:",
+            error,
+          );
           clearPdfPreview();
         }
       }
@@ -430,7 +512,7 @@ const PdfTextEditor = ({ onComplete, onError }: BaseToolProps) => {
         return;
       }
       if (!cachedJobId) {
-        console.log('[loadImagesForPage] No cached jobId, skipping');
+        console.log("[loadImagesForPage] No cached jobId, skipping");
         return;
       }
       if (
@@ -455,13 +537,13 @@ const PdfTextEditor = ({ onComplete, onError }: BaseToolProps) => {
           apiClient.get(
             `/api/v1/convert/pdf/text-editor/page/${cachedJobId}/${pageNumber}`,
             {
-              responseType: 'json',
+              responseType: "json",
             },
           ),
           apiClient.get(
             `/api/v1/convert/pdf/text-editor/fonts/${cachedJobId}/${pageNumber}`,
             {
-              responseType: 'json',
+              responseType: "json",
             },
           ),
         ]);
@@ -470,12 +552,15 @@ const PdfTextEditor = ({ onComplete, onError }: BaseToolProps) => {
         const pageFonts = Array.isArray(pageFontsResponse.data)
           ? (pageFontsResponse.data as PdfJsonFont[])
           : [];
-        const normalizedImages = (pageData.imageElements ?? []).map(cloneImageElement);
+        const normalizedImages = (pageData.imageElements ?? []).map(
+          cloneImageElement,
+        );
 
         if (imagesByPageRef.current.length <= pageIndex) {
           imagesByPageRef.current.length = pageIndex + 1;
         }
-        imagesByPageRef.current[pageIndex] = normalizedImages.map(cloneImageElement);
+        imagesByPageRef.current[pageIndex] =
+          normalizedImages.map(cloneImageElement);
 
         setLoadedDocument((prevDoc) => {
           if (!prevDoc || !prevDoc.pages) {
@@ -488,7 +573,9 @@ const PdfTextEditor = ({ onComplete, onError }: BaseToolProps) => {
             if (!existingFont) {
               continue;
             }
-            const existingKey = existingFont.uid || `${existingFont.pageNumber ?? -1}:${existingFont.id ?? ''}`;
+            const existingKey =
+              existingFont.uid ||
+              `${existingFont.pageNumber ?? -1}:${existingFont.id ?? ""}`;
             fontMap.set(existingKey, existingFont);
           }
           if (pageFonts.length > 0) {
@@ -496,7 +583,8 @@ const PdfTextEditor = ({ onComplete, onError }: BaseToolProps) => {
               if (!font) {
                 continue;
               }
-              const key = font.uid || `${font.pageNumber ?? -1}:${font.id ?? ''}`;
+              const key =
+                font.uid || `${font.pageNumber ?? -1}:${font.id ?? ""}`;
               fontMap.set(key, font);
             }
           }
@@ -524,7 +612,8 @@ const PdfTextEditor = ({ onComplete, onError }: BaseToolProps) => {
         if (originalImagesRef.current.length <= pageIndex) {
           originalImagesRef.current.length = pageIndex + 1;
         }
-        originalImagesRef.current[pageIndex] = normalizedImages.map(cloneImageElement);
+        originalImagesRef.current[pageIndex] =
+          normalizedImages.map(cloneImageElement);
 
         setLoadedImagePages((prev) => {
           const next = new Set(prev);
@@ -539,9 +628,14 @@ const PdfTextEditor = ({ onComplete, onError }: BaseToolProps) => {
           ).toFixed(2)}ms`,
         );
       } catch (error) {
-        console.error(`[loadImagesForPage] Failed to load images for page ${pageNumber}:`, error);
+        console.error(
+          `[loadImagesForPage] Failed to load images for page ${pageNumber}:`,
+          error,
+        );
         if (isCacheUnavailableError(error)) {
-          console.log('[loadImagesForPage] Cache expired, triggering automatic recovery...');
+          console.log(
+            "[loadImagesForPage] Cache expired, triggering automatic recovery...",
+          );
           // Automatically recover by reloading the file
           void recoverCacheAndReloadRef.current();
         }
@@ -568,7 +662,9 @@ const PdfTextEditor = ({ onComplete, onError }: BaseToolProps) => {
       loadRequestIdRef.current = requestId;
 
       const _fileKey = getAutoLoadKey(file);
-      const isPdf = file.type === 'application/pdf' || file.name.toLowerCase().endsWith('.pdf');
+      const isPdf =
+        file.type === "application/pdf" ||
+        file.name.toLowerCase().endsWith(".pdf");
 
       try {
         let parsed: PdfJsonDocument | null = null;
@@ -580,58 +676,63 @@ const PdfTextEditor = ({ onComplete, onError }: BaseToolProps) => {
           setIsConverting(true);
           setConversionProgress({
             percent: 0,
-            stage: 'uploading',
-            message: 'Uploading PDF file to server...',
+            stage: "uploading",
+            message: "Uploading PDF file to server...",
           });
 
           const formData = new FormData();
-          formData.append('fileInput', file);
+          formData.append("fileInput", file);
 
-          console.log('Sending conversion request with async=true');
+          console.log("Sending conversion request with async=true");
           const response = await apiClient.post(
-            `${CONVERSION_ENDPOINTS['pdf-text-editor']}?async=true&lightweight=true`,
+            `${CONVERSION_ENDPOINTS["pdf-text-editor"]}?async=true&lightweight=true`,
             formData,
             {
-              responseType: 'json',
+              responseType: "json",
             },
           );
 
-          console.log('Conversion response:', response.data);
+          console.log("Conversion response:", response.data);
           const jobId = response.data.jobId;
 
           if (!jobId) {
-            console.error('No job ID in response:', response.data);
-            throw new Error('No job ID received from server');
+            console.error("No job ID in response:", response.data);
+            throw new Error("No job ID received from server");
           }
 
           pendingJobId = jobId;
-          console.log('Got job ID:', jobId);
+          console.log("Got job ID:", jobId);
           setConversionProgress({
             percent: 3,
-            stage: 'processing',
-            message: 'Starting conversion...',
+            stage: "processing",
+            message: "Starting conversion...",
           });
 
-        let jobComplete = false;
-        let attempts = 0;
-        const maxAttempts = 600;
-        let pollDelay = 500;
+          let jobComplete = false;
+          let attempts = 0;
+          const maxAttempts = 600;
+          let pollDelay = 500;
 
-        while (!jobComplete && attempts < maxAttempts) {
-          await new Promise((resolve) => setTimeout(resolve, pollDelay));
-          attempts += 1;
-          if (pollDelay < 10000) {
-            pollDelay = Math.min(10000, Math.floor(pollDelay * 1.5));
-          }
+          while (!jobComplete && attempts < maxAttempts) {
+            await new Promise((resolve) => setTimeout(resolve, pollDelay));
+            attempts += 1;
+            if (pollDelay < 10000) {
+              pollDelay = Math.min(10000, Math.floor(pollDelay * 1.5));
+            }
 
             try {
-              const statusResponse = await apiClient.get(`/api/v1/general/job/${jobId}`);
+              const statusResponse = await apiClient.get(
+                `/api/v1/general/job/${jobId}`,
+              );
               const jobStatus = statusResponse.data;
               console.log(`Job status (attempt ${attempts}):`, jobStatus);
 
-              const percent = Math.min(Math.max(jobStatus.progress ?? 0, 0), 100);
-              const stage = jobStatus.stage || 'processing';
-              const message = jobStatus.note || 'Converting PDF to JSON...';
+              const percent = Math.min(
+                Math.max(jobStatus.progress ?? 0, 0),
+                100,
+              );
+              const stage = jobStatus.stage || "processing";
+              const message = jobStatus.note || "Converting PDF to JSON...";
               const current = jobStatus.current ?? undefined;
               const total = jobStatus.total ?? undefined;
               setConversionProgress({
@@ -644,17 +745,17 @@ const PdfTextEditor = ({ onComplete, onError }: BaseToolProps) => {
 
               if (jobStatus.complete) {
                 if (jobStatus.error) {
-                  console.error('Job failed:', jobStatus.error);
+                  console.error("Job failed:", jobStatus.error);
                   throw new Error(jobStatus.error);
                 }
 
-                console.log('Job completed, retrieving JSON result...');
+                console.log("Job completed, retrieving JSON result...");
                 jobComplete = true;
 
                 const resultResponse = await apiClient.get(
                   `/api/v1/general/job/${jobId}/result`,
                   {
-                    responseType: 'blob',
+                    responseType: "blob",
                   },
                 );
 
@@ -662,9 +763,12 @@ const PdfTextEditor = ({ onComplete, onError }: BaseToolProps) => {
                 const result = JSON.parse(jsonText);
 
                 if (!Array.isArray(result.pages)) {
-                  console.error('Conversion result missing page array:', result);
+                  console.error(
+                    "Conversion result missing page array:",
+                    result,
+                  );
                   throw new Error(
-                    'PDF conversion result did not include page data. Please update the server.',
+                    "PDF conversion result did not include page data. Please update the server.",
                   );
                 }
 
@@ -677,26 +781,28 @@ const PdfTextEditor = ({ onComplete, onError }: BaseToolProps) => {
                 pendingJobId = shouldUseLazyMode ? jobId : null;
                 setConversionProgress(null);
               } else {
-                console.log('Job not complete yet, continuing to poll...');
+                console.log("Job not complete yet, continuing to poll...");
               }
             } catch (pollError: any) {
-              console.error('Error polling job status:', pollError);
-              console.error('Poll error details:', {
+              console.error("Error polling job status:", pollError);
+              console.error("Poll error details:", {
                 status: pollError?.response?.status,
                 data: pollError?.response?.data,
                 message: pollError?.message,
               });
               if (pollError?.response?.status === 404) {
-                throw new Error('Job not found on server', { cause: pollError });
+                throw new Error("Job not found on server", {
+                  cause: pollError,
+                });
               }
             }
           }
 
           if (!jobComplete) {
-            throw new Error('Conversion timed out');
+            throw new Error("Conversion timed out");
           }
           if (!parsed) {
-            throw new Error('Conversion did not return JSON content');
+            throw new Error("Conversion did not return JSON content");
           }
         } else {
           const content = await file.text();
@@ -716,13 +822,11 @@ const PdfTextEditor = ({ onComplete, onError }: BaseToolProps) => {
         }
 
         if (!parsed) {
-          throw new Error('Failed to parse PDF JSON document');
+          throw new Error("Failed to parse PDF JSON document");
         }
 
         console.log(
-          `[PdfTextEditor] Document loaded. Lazy image mode: ${shouldUseLazyMode}, Pages: ${
-            parsed.pages?.length || 0
-          }`,
+          `[PdfTextEditor] Document loaded. Lazy image mode: ${shouldUseLazyMode}, Pages: ${parsed.pages?.length || 0}`,
         );
 
         if (isPdf) {
@@ -740,8 +844,8 @@ const PdfTextEditor = ({ onComplete, onError }: BaseToolProps) => {
         setFileName(file.name);
         setErrorMessage(null);
       } catch (error: any) {
-        console.error('Failed to load file', error);
-        console.error('Error details:', {
+        console.error("Failed to load file", error);
+        console.error("Error details:", {
           message: error?.message,
           response: error?.response?.data,
           stack: error?.stack,
@@ -761,14 +865,17 @@ const PdfTextEditor = ({ onComplete, onError }: BaseToolProps) => {
         if (isPdf) {
           const errorMsg =
             error?.message ||
-            t('pdfTextEditor.conversionFailed', 'Failed to convert PDF. Please try again.');
+            t(
+              "pdfTextEditor.conversionFailed",
+              "Failed to convert PDF. Please try again.",
+            );
           setErrorMessage(errorMsg);
-          console.error('Setting error message:', errorMsg);
+          console.error("Setting error message:", errorMsg);
         } else {
           setErrorMessage(
             t(
-              'pdfTextEditor.errors.invalidJson',
-              'Unable to read the JSON file. Ensure it was generated by the PDF to JSON tool.',
+              "pdfTextEditor.errors.invalidJson",
+              "Unable to read the JSON file. Ensure it was generated by the PDF to JSON tool.",
             ),
           );
         }
@@ -786,23 +893,25 @@ const PdfTextEditor = ({ onComplete, onError }: BaseToolProps) => {
       return false;
     }
     if (cacheRecoveryAttemptsRef.current >= 2) {
-      console.warn('[PdfTextEditor] Cache recovery limit reached');
+      console.warn("[PdfTextEditor] Cache recovery limit reached");
       return false;
     }
     cacheRecoveryAttemptsRef.current += 1;
     const file = lastLoadedFileRef.current;
     if (!file) {
-      console.warn('[PdfTextEditor] No file available for cache recovery');
+      console.warn("[PdfTextEditor] No file available for cache recovery");
       return false;
     }
     cacheRecoveryInProgressRef.current = true;
     try {
-      console.log('[PdfTextEditor] Automatically reloading file due to cache expiration...');
+      console.log(
+        "[PdfTextEditor] Automatically reloading file due to cache expiration...",
+      );
       await handleLoadFile(file);
-      console.log('[PdfTextEditor] Cache recovery successful');
+      console.log("[PdfTextEditor] Cache recovery successful");
       return true;
     } catch (error) {
-      console.error('[PdfTextEditor] Cache recovery failed', error);
+      console.error("[PdfTextEditor] Cache recovery failed", error);
       return false;
     } finally {
       cacheRecoveryInProgressRef.current = false;
@@ -828,120 +937,155 @@ const PdfTextEditor = ({ onComplete, onError }: BaseToolProps) => {
     [addFiles, handleLoadFile],
   );
 
-  const handleSelectPage = useCallback((pageIndex: number) => {
-    setSelectedPage(pageIndex);
-    // Trigger lazy loading for images on the selected page
-    if (isLazyMode) {
-      void loadImagesForPage(pageIndex);
-    }
-  }, [isLazyMode, loadImagesForPage]);
+  const handleSelectPage = useCallback(
+    (pageIndex: number) => {
+      setSelectedPage(pageIndex);
+      // Trigger lazy loading for images on the selected page
+      if (isLazyMode) {
+        void loadImagesForPage(pageIndex);
+      }
+    },
+    [isLazyMode, loadImagesForPage],
+  );
 
-  const handleGroupTextChange = useCallback((pageIndex: number, groupId: string, value: string) => {
-    setGroupsByPage((previous) =>
-      previous.map((groups, idx) =>
-        idx !== pageIndex
-          ? groups
-          : groups.map((group) => (group.id === groupId ? { ...group, text: value } : group))
-      )
-    );
-  }, []);
+  const handleGroupTextChange = useCallback(
+    (pageIndex: number, groupId: string, value: string) => {
+      setGroupsByPage((previous) =>
+        previous.map((groups, idx) =>
+          idx !== pageIndex
+            ? groups
+            : groups.map((group) =>
+                group.id === groupId ? { ...group, text: value } : group,
+              ),
+        ),
+      );
+    },
+    [],
+  );
 
-  const handleGroupDelete = useCallback((pageIndex: number, groupId: string) => {
-    console.log(`🗑� Deleting group ${groupId} from page ${pageIndex}`);
-    setGroupsByPage((previous) => {
-      const updated = previous.map((groups, idx) => {
-        if (idx !== pageIndex) return groups;
-        const filtered = groups.filter((group) => group.id !== groupId);
-        console.log(`   Before: ${groups.length} groups, After: ${filtered.length} groups`);
-        return filtered;
+  const handleGroupDelete = useCallback(
+    (pageIndex: number, groupId: string) => {
+      console.log(`🗑� Deleting group ${groupId} from page ${pageIndex}`);
+      setGroupsByPage((previous) => {
+        const updated = previous.map((groups, idx) => {
+          if (idx !== pageIndex) return groups;
+          const filtered = groups.filter((group) => group.id !== groupId);
+          console.log(
+            `   Before: ${groups.length} groups, After: ${filtered.length} groups`,
+          );
+          return filtered;
+        });
+        return updated;
       });
-      return updated;
-    });
-  }, []);
+    },
+    [],
+  );
 
-  const handleMergeGroups = useCallback((pageIndex: number, groupIds: string[]): boolean => {
-    if (groupIds.length < 2) {
-      return false;
-    }
-    let updated = false;
-    setGroupsByPage((previous) =>
-      previous.map((groups, idx) => {
-        if (idx !== pageIndex) {
-          return groups;
-        }
-        const indices = groupIds
-          .map((id) => groups.findIndex((group) => group.id === id))
-          .filter((index) => index >= 0);
-        if (indices.length !== groupIds.length) {
-          return groups;
-        }
-        const sorted = [...indices].sort((a, b) => a - b);
-        for (let i = 1; i < sorted.length; i += 1) {
-          if (sorted[i] !== sorted[i - 1] + 1) {
+  const handleMergeGroups = useCallback(
+    (pageIndex: number, groupIds: string[]): boolean => {
+      if (groupIds.length < 2) {
+        return false;
+      }
+      let updated = false;
+      setGroupsByPage((previous) =>
+        previous.map((groups, idx) => {
+          if (idx !== pageIndex) {
             return groups;
           }
-        }
-        const selection = sorted.map((position) => groups[position]);
-        const merged = buildMergedGroupFromSelection(selection);
-        if (!merged) {
-          return groups;
-        }
-        const next = [
-          ...groups.slice(0, sorted[0]),
-          merged,
-          ...groups.slice(sorted[sorted.length - 1] + 1),
-        ];
-        updated = true;
-        return next;
-      }),
-    );
-    return updated;
-  }, []);
+          const indices = groupIds
+            .map((id) => groups.findIndex((group) => group.id === id))
+            .filter((index) => index >= 0);
+          if (indices.length !== groupIds.length) {
+            return groups;
+          }
+          const sorted = [...indices].sort((a, b) => a - b);
+          for (let i = 1; i < sorted.length; i += 1) {
+            if (sorted[i] !== sorted[i - 1] + 1) {
+              return groups;
+            }
+          }
+          const selection = sorted.map((position) => groups[position]);
+          const merged = buildMergedGroupFromSelection(selection);
+          if (!merged) {
+            return groups;
+          }
+          const next = [
+            ...groups.slice(0, sorted[0]),
+            merged,
+            ...groups.slice(sorted[sorted.length - 1] + 1),
+          ];
+          updated = true;
+          return next;
+        }),
+      );
+      return updated;
+    },
+    [],
+  );
 
-  const handleUngroupGroup = useCallback((pageIndex: number, groupId: string): boolean => {
-    let updated = false;
-    setGroupsByPage((previous) =>
-      previous.map((groups, idx) => {
-        if (idx !== pageIndex) {
-          return groups;
-        }
-        const targetIndex = groups.findIndex((group) => group.id === groupId);
-        if (targetIndex < 0) {
-          return groups;
-        }
-        const targetGroup = groups[targetIndex];
-        const splits = splitParagraphGroup(targetGroup);
-        if (splits.length <= 1) {
-          return groups;
-        }
-        const next = [
-          ...groups.slice(0, targetIndex),
-          ...splits,
-          ...groups.slice(targetIndex + 1),
-        ];
-        updated = true;
-        return next;
-      }),
-    );
-    return updated;
-  }, []);
+  const handleUngroupGroup = useCallback(
+    (pageIndex: number, groupId: string): boolean => {
+      let updated = false;
+      setGroupsByPage((previous) =>
+        previous.map((groups, idx) => {
+          if (idx !== pageIndex) {
+            return groups;
+          }
+          const targetIndex = groups.findIndex((group) => group.id === groupId);
+          if (targetIndex < 0) {
+            return groups;
+          }
+          const targetGroup = groups[targetIndex];
+          const splits = splitParagraphGroup(targetGroup);
+          if (splits.length <= 1) {
+            return groups;
+          }
+          const next = [
+            ...groups.slice(0, targetIndex),
+            ...splits,
+            ...groups.slice(targetIndex + 1),
+          ];
+          updated = true;
+          return next;
+        }),
+      );
+      return updated;
+    },
+    [],
+  );
 
   const handleImageTransform = useCallback(
     (
       pageIndex: number,
       imageId: string,
-      next: { left: number; bottom: number; width: number; height: number; transform: number[] },
+      next: {
+        left: number;
+        bottom: number;
+        width: number;
+        height: number;
+        transform: number[];
+      },
     ) => {
       setImagesByPage((previous) => {
         const current = previous[pageIndex] ?? [];
         let changed = false;
         const updatedPage = current.map((image) => {
-          if ((image.id ?? '') !== imageId) {
+          if ((image.id ?? "") !== imageId) {
             return image;
           }
-          const originalTransform = image.transform ?? originalImagesRef.current[pageIndex]?.find((base) => (base.id ?? '') === imageId)?.transform;
-          const scaleXSign = originalTransform && originalTransform.length >= 6 ? Math.sign(originalTransform[0]) || 1 : 1;
-          const scaleYSign = originalTransform && originalTransform.length >= 6 ? Math.sign(originalTransform[3]) || 1 : 1;
+          const originalTransform =
+            image.transform ??
+            originalImagesRef.current[pageIndex]?.find(
+              (base) => (base.id ?? "") === imageId,
+            )?.transform;
+          const scaleXSign =
+            originalTransform && originalTransform.length >= 6
+              ? Math.sign(originalTransform[0]) || 1
+              : 1;
+          const scaleYSign =
+            originalTransform && originalTransform.length >= 6
+              ? Math.sign(originalTransform[3]) || 1
+              : 1;
           const right = next.left + next.width;
           const top = next.bottom + next.height;
           const updatedImage: PdfJsonImageElement = {
@@ -954,16 +1098,17 @@ const PdfTextEditor = ({ onComplete, onError }: BaseToolProps) => {
             top,
             width: next.width,
             height: next.height,
-            transform: scaleXSign < 0 || scaleYSign < 0
-              ? [
-                  next.width * scaleXSign,
-                  0,
-                  0,
-                  next.height * scaleYSign,
-                  next.left,
-                  scaleYSign >= 0 ? next.bottom : next.bottom + next.height,
-                ]
-              : null,
+            transform:
+              scaleXSign < 0 || scaleYSign < 0
+                ? [
+                    next.width * scaleXSign,
+                    0,
+                    0,
+                    next.height * scaleYSign,
+                    next.left,
+                    scaleYSign >= 0 ? next.bottom : next.bottom + next.height,
+                  ]
+                : null,
           };
 
           const isSame =
@@ -982,7 +1127,9 @@ const PdfTextEditor = ({ onComplete, onError }: BaseToolProps) => {
           return previous;
         }
 
-        const nextImages = previous.map((images, idx) => (idx === pageIndex ? updatedPage : images));
+        const nextImages = previous.map((images, idx) =>
+          idx === pageIndex ? updatedPage : images,
+        );
         if (imagesByPageRef.current.length <= pageIndex) {
           imagesByPageRef.current.length = pageIndex + 1;
         }
@@ -994,7 +1141,9 @@ const PdfTextEditor = ({ onComplete, onError }: BaseToolProps) => {
   );
 
   const handleImageReset = useCallback((pageIndex: number, imageId: string) => {
-    const baseline = originalImagesRef.current[pageIndex]?.find((image) => (image.id ?? '') === imageId);
+    const baseline = originalImagesRef.current[pageIndex]?.find(
+      (image) => (image.id ?? "") === imageId,
+    );
     if (!baseline) {
       return;
     }
@@ -1002,7 +1151,7 @@ const PdfTextEditor = ({ onComplete, onError }: BaseToolProps) => {
       const current = previous[pageIndex] ?? [];
       let changed = false;
       const updatedPage = current.map((image) => {
-        if ((image.id ?? '') !== imageId) {
+        if ((image.id ?? "") !== imageId) {
           return image;
         }
         changed = true;
@@ -1013,7 +1162,9 @@ const PdfTextEditor = ({ onComplete, onError }: BaseToolProps) => {
         return previous;
       }
 
-      const nextImages = previous.map((images, idx) => (idx === pageIndex ? updatedPage : images));
+      const nextImages = previous.map((images, idx) =>
+        idx === pageIndex ? updatedPage : images,
+      );
       if (imagesByPageRef.current.length <= pageIndex) {
         imagesByPageRef.current.length = pageIndex + 1;
       }
@@ -1042,7 +1193,9 @@ const PdfTextEditor = ({ onComplete, onError }: BaseToolProps) => {
       originalImagesRef.current,
       forceSingleTextElement,
     );
-    const baseName = sanitizeBaseName(fileName || loadedDocument.metadata?.title || undefined);
+    const baseName = sanitizeBaseName(
+      fileName || loadedDocument.metadata?.title || undefined,
+    );
     return {
       document: updatedDocument,
       filename: `${baseName}.json`,
@@ -1057,202 +1210,241 @@ const PdfTextEditor = ({ onComplete, onError }: BaseToolProps) => {
 
     const { document, filename } = payload;
     const serialized = JSON.stringify(document);
-    downloadTextAsFile(serialized, filename, 'application/json');
+    downloadTextAsFile(serialized, filename, "application/json");
 
     if (onComplete) {
-      const exportedFile = new File([serialized], filename, { type: 'application/json' });
+      const exportedFile = new File([serialized], filename, {
+        type: "application/json",
+      });
       onComplete([exportedFile]);
     }
   }, [buildPayload, onComplete]);
 
-  const handleGeneratePdf = useCallback(async (skipComplete = false) => {
-    try {
-      setIsGeneratingPdf(true);
+  const handleGeneratePdf = useCallback(
+    async (skipComplete = false) => {
+      try {
+        setIsGeneratingPdf(true);
 
-      const ensureImagesForPages = async (pageIndices: number[]) => {
-        const uniqueIndices = Array.from(new Set(pageIndices)).filter((index) => index >= 0);
-        if (uniqueIndices.length === 0) {
-          return;
-        }
-
-        for (const index of uniqueIndices) {
-          if (!loadedImagePagesRef.current.has(index)) {
-            await loadImagesForPage(index);
-          }
-        }
-
-        const maxWaitTime = 15000;
-        const pollInterval = 150;
-        const startWait = Date.now();
-        while (Date.now() - startWait < maxWaitTime) {
-          const allLoaded = uniqueIndices.every(
-            (index) =>
-              loadedImagePagesRef.current.has(index) &&
-              imagesByPageRef.current[index] !== undefined,
+        const ensureImagesForPages = async (pageIndices: number[]) => {
+          const uniqueIndices = Array.from(new Set(pageIndices)).filter(
+            (index) => index >= 0,
           );
-          const anyLoading = uniqueIndices.some((index) =>
-            loadingImagePagesRef.current.has(index),
-          );
-          if (allLoaded && !anyLoading) {
+          if (uniqueIndices.length === 0) {
             return;
           }
-          await new Promise((resolve) => setTimeout(resolve, pollInterval));
-        }
 
-        const missing = uniqueIndices.filter(
-          (index) => !loadedImagePagesRef.current.has(index),
-        );
-        if (missing.length > 0) {
-          throw new Error(
-            `Failed to load images for pages ${missing.map((i) => i + 1).join(', ')}`,
-          );
-        }
-      };
-
-      const currentDoc = loadedDocumentRef.current;
-      const totalPages = currentDoc?.pages?.length ?? 0;
-      const dirtyPageIndices = dirtyPages
-        .map((isDirty, index) => (isDirty ? index : -1))
-        .filter((index) => index >= 0);
-
-      const canUseIncremental =
-        isLazyMode &&
-        cachedJobId &&
-        dirtyPageIndices.length > 0;
-
-      if (canUseIncremental) {
-        await ensureImagesForPages(dirtyPageIndices);
-
-        try {
-          const payload = buildPayload();
-          if (!payload) {
-            throw new Error('Failed to build payload');
+          for (const index of uniqueIndices) {
+            if (!loadedImagePagesRef.current.has(index)) {
+              await loadImagesForPage(index);
+            }
           }
 
-          const { document, filename } = payload;
-          const dirtyPageSet = new Set(dirtyPageIndices);
-          const partialPages =
-            document.pages?.filter((_, index) => dirtyPageSet.has(index)) ?? [];
-
-          const partialDocument: PdfJsonDocument = {
-            // Incremental export only needs changed pages.
-            // Fonts/resources/content streams are resolved from server-side cache.
-            pages: partialPages,
-          };
-
-          const baseName = sanitizeBaseName(filename).replace(/-edited$/u, '');
-          const expectedName = `${baseName || 'document'}.pdf`;
-          const response = await apiClient.post(
-            `/api/v1/convert/pdf/text-editor/partial/${cachedJobIdRef.current}?filename=${encodeURIComponent(expectedName)}`,
-            partialDocument,
-            {
-              responseType: 'blob',
-            },
-          );
-
-          const contentDisposition = response.headers?.['content-disposition'] ?? '';
-          const detectedName = getFilenameFromHeaders(contentDisposition);
-          const downloadName = detectedName || expectedName;
-
-          downloadBlob(response.data, downloadName);
-
-          if (onComplete && !skipComplete) {
-            const pdfFile = new File([response.data], downloadName, { type: 'application/pdf' });
-            onComplete([pdfFile]);
+          const maxWaitTime = 15000;
+          const pollInterval = 150;
+          const startWait = Date.now();
+          while (Date.now() - startWait < maxWaitTime) {
+            const allLoaded = uniqueIndices.every(
+              (index) =>
+                loadedImagePagesRef.current.has(index) &&
+                imagesByPageRef.current[index] !== undefined,
+            );
+            const anyLoading = uniqueIndices.some((index) =>
+              loadingImagePagesRef.current.has(index),
+            );
+            if (allLoaded && !anyLoading) {
+              return;
+            }
+            await new Promise((resolve) => setTimeout(resolve, pollInterval));
           }
-          setErrorMessage(null);
+
+          const missing = uniqueIndices.filter(
+            (index) => !loadedImagePagesRef.current.has(index),
+          );
+          if (missing.length > 0) {
+            throw new Error(
+              `Failed to load images for pages ${missing.map((i) => i + 1).join(", ")}`,
+            );
+          }
+        };
+
+        const currentDoc = loadedDocumentRef.current;
+        const totalPages = currentDoc?.pages?.length ?? 0;
+        const dirtyPageIndices = dirtyPages
+          .map((isDirty, index) => (isDirty ? index : -1))
+          .filter((index) => index >= 0);
+
+        const canUseIncremental =
+          isLazyMode && cachedJobId && dirtyPageIndices.length > 0;
+
+        if (canUseIncremental) {
+          await ensureImagesForPages(dirtyPageIndices);
+
+          try {
+            const payload = buildPayload();
+            if (!payload) {
+              throw new Error("Failed to build payload");
+            }
+
+            const { document, filename } = payload;
+            const dirtyPageSet = new Set(dirtyPageIndices);
+            const partialPages =
+              document.pages?.filter((_, index) => dirtyPageSet.has(index)) ??
+              [];
+
+            const partialDocument: PdfJsonDocument = {
+              // Incremental export only needs changed pages.
+              // Fonts/resources/content streams are resolved from server-side cache.
+              pages: partialPages,
+            };
+
+            const baseName = sanitizeBaseName(filename).replace(
+              /-edited$/u,
+              "",
+            );
+            const expectedName = `${baseName || "document"}.pdf`;
+            const response = await apiClient.post(
+              `/api/v1/convert/pdf/text-editor/partial/${cachedJobIdRef.current}?filename=${encodeURIComponent(expectedName)}`,
+              partialDocument,
+              {
+                responseType: "blob",
+              },
+            );
+
+            const contentDisposition =
+              response.headers?.["content-disposition"] ?? "";
+            const detectedName = getFilenameFromHeaders(contentDisposition);
+            const downloadName = detectedName || expectedName;
+
+            downloadBlob(response.data, downloadName);
+
+            if (onComplete && !skipComplete) {
+              const pdfFile = new File([response.data], downloadName, {
+                type: "application/pdf",
+              });
+              onComplete([pdfFile]);
+            }
+            setErrorMessage(null);
+            return;
+          } catch (incrementalError) {
+            if (isLazyMode && cachedJobIdRef.current) {
+              throw new Error(
+                "Incremental export failed for cached document. Please reload and retry.",
+                {
+                  cause: incrementalError,
+                },
+              );
+            }
+            console.warn(
+              "[handleGeneratePdf] Incremental export failed, falling back to full export",
+              incrementalError,
+            );
+          }
+        }
+
+        if (isLazyMode && totalPages > 0) {
+          const allPageIndices = Array.from(
+            { length: totalPages },
+            (_, index) => index,
+          );
+          await ensureImagesForPages(allPageIndices);
+        }
+
+        const payload = buildPayload();
+        if (!payload) {
           return;
-        } catch (incrementalError) {
-          if (isLazyMode && cachedJobIdRef.current) {
-            throw new Error('Incremental export failed for cached document. Please reload and retry.', {
-              cause: incrementalError,
-            });
-          }
-          console.warn(
-            '[handleGeneratePdf] Incremental export failed, falling back to full export',
-            incrementalError,
-          );
         }
+
+        const { document, filename } = payload;
+        const serialized = JSON.stringify(document);
+        const jsonFile = new File([serialized], filename, {
+          type: "application/json",
+        });
+
+        const formData = new FormData();
+        formData.append("fileInput", jsonFile);
+        const response = await apiClient.post(
+          CONVERSION_ENDPOINTS["text-editor-pdf"],
+          formData,
+          {
+            responseType: "blob",
+          },
+        );
+
+        const contentDisposition =
+          response.headers?.["content-disposition"] ?? "";
+        const detectedName = getFilenameFromHeaders(contentDisposition);
+        const baseName = sanitizeBaseName(filename).replace(/-edited$/u, "");
+        const downloadName = detectedName || `${baseName || "document"}.pdf`;
+
+        downloadBlob(response.data, downloadName);
+
+        if (onComplete && !skipComplete) {
+          const pdfFile = new File([response.data], downloadName, {
+            type: "application/pdf",
+          });
+          onComplete([pdfFile]);
+        }
+        setErrorMessage(null);
+      } catch (error: any) {
+        console.error("Failed to convert JSON back to PDF", error);
+        const message =
+          error?.response?.data ||
+          error?.message ||
+          t(
+            "pdfTextEditor.errors.pdfConversion",
+            "Unable to convert the edited JSON back into a PDF.",
+          );
+        const msgString =
+          typeof message === "string" ? message : String(message);
+        setErrorMessage(msgString);
+        if (onError) {
+          onError(msgString);
+        }
+      } finally {
+        setIsGeneratingPdf(false);
       }
-
-      if (isLazyMode && totalPages > 0) {
-        const allPageIndices = Array.from({ length: totalPages }, (_, index) => index);
-        await ensureImagesForPages(allPageIndices);
-      }
-
-      const payload = buildPayload();
-      if (!payload) {
-        return;
-      }
-
-      const { document, filename } = payload;
-      const serialized = JSON.stringify(document);
-      const jsonFile = new File([serialized], filename, { type: 'application/json' });
-
-      const formData = new FormData();
-      formData.append('fileInput', jsonFile);
-      const response = await apiClient.post(CONVERSION_ENDPOINTS['text-editor-pdf'], formData, {
-        responseType: 'blob',
-      });
-
-      const contentDisposition = response.headers?.['content-disposition'] ?? '';
-      const detectedName = getFilenameFromHeaders(contentDisposition);
-      const baseName = sanitizeBaseName(filename).replace(/-edited$/u, '');
-      const downloadName = detectedName || `${baseName || 'document'}.pdf`;
-
-      downloadBlob(response.data, downloadName);
-
-      if (onComplete && !skipComplete) {
-        const pdfFile = new File([response.data], downloadName, { type: 'application/pdf' });
-        onComplete([pdfFile]);
-      }
-      setErrorMessage(null);
-    } catch (error: any) {
-      console.error('Failed to convert JSON back to PDF', error);
-      const message =
-        error?.response?.data ||
-        error?.message ||
-        t('pdfTextEditor.errors.pdfConversion', 'Unable to convert the edited JSON back into a PDF.');
-      const msgString = typeof message === 'string' ? message : String(message);
-      setErrorMessage(msgString);
-      if (onError) {
-        onError(msgString);
-      }
-    } finally {
-      setIsGeneratingPdf(false);
-    }
-  }, [
-    buildPayload,
-    cachedJobId,
-    dirtyPages,
-    isLazyMode,
-    loadImagesForPage,
-    onComplete,
-    onError,
-    t,
-  ]);
+    },
+    [
+      buildPayload,
+      cachedJobId,
+      dirtyPages,
+      isLazyMode,
+      loadImagesForPage,
+      onComplete,
+      onError,
+      t,
+    ],
+  );
 
   // Save changes to workbench (replaces the original file with edited version)
   const handleSaveToWorkbench = useCallback(async () => {
     setIsSavingToWorkbench(true);
-    
+
     try {
       if (!sourceFileIdRef.current) {
-        console.warn('[PdfTextEditor] No source file ID available for save to workbench');
+        console.warn(
+          "[PdfTextEditor] No source file ID available for save to workbench",
+        );
         // Fall back to generating PDF download if no source file
         await handleGeneratePdf(true);
         return;
       }
 
-      const parentStub = selectors.getStirlingFileStub(sourceFileIdRef.current as any);
+      const parentStub = selectors.getStirlingFileStub(
+        sourceFileIdRef.current as any,
+      );
       if (!parentStub) {
-        console.warn('[PdfTextEditor] Could not find parent stub for save to workbench');
+        console.warn(
+          "[PdfTextEditor] Could not find parent stub for save to workbench",
+        );
         await handleGeneratePdf(true);
         return;
       }
 
       const ensureImagesForPages = async (pageIndices: number[]) => {
-        const uniqueIndices = Array.from(new Set(pageIndices)).filter((index) => index >= 0);
+        const uniqueIndices = Array.from(new Set(pageIndices)).filter(
+          (index) => index >= 0,
+        );
         if (uniqueIndices.length === 0) {
           return;
         }
@@ -1286,14 +1478,19 @@ const PdfTextEditor = ({ onComplete, onError }: BaseToolProps) => {
         );
         if (missing.length > 0) {
           throw new Error(
-            `Failed to load images for pages ${missing.map((i) => i + 1).join(', ')}`,
+            `Failed to load images for pages ${missing.map((i) => i + 1).join(", ")}`,
           );
         }
       };
 
       const currentDoc = loadedDocumentRef.current;
       const totalPages = currentDoc?.pages?.length ?? 0;
-      const currentDirtyPages = getDirtyPages(groupsByPage, imagesByPage, originalGroupsRef.current, originalImagesRef.current);
+      const currentDirtyPages = getDirtyPages(
+        groupsByPage,
+        imagesByPage,
+        originalGroupsRef.current,
+        originalImagesRef.current,
+      );
       const dirtyPageIndices = currentDirtyPages
         .map((isDirty, index) => (isDirty ? index : -1))
         .filter((index) => index >= 0);
@@ -1302,9 +1499,7 @@ const PdfTextEditor = ({ onComplete, onError }: BaseToolProps) => {
       let downloadName: string;
 
       const canUseIncremental =
-        isLazyMode &&
-        cachedJobId &&
-        dirtyPageIndices.length > 0;
+        isLazyMode && cachedJobId && dirtyPageIndices.length > 0;
 
       if (canUseIncremental) {
         await ensureImagesForPages(dirtyPageIndices);
@@ -1312,7 +1507,7 @@ const PdfTextEditor = ({ onComplete, onError }: BaseToolProps) => {
         try {
           const payload = buildPayload();
           if (!payload) {
-            throw new Error('Failed to build payload');
+            throw new Error("Failed to build payload");
           }
 
           const { document, filename } = payload;
@@ -1326,97 +1521,129 @@ const PdfTextEditor = ({ onComplete, onError }: BaseToolProps) => {
             pages: partialPages,
           };
 
-          const baseName = sanitizeBaseName(filename).replace(/-edited$/u, '');
-          const expectedName = `${baseName || 'document'}.pdf`;
+          const baseName = sanitizeBaseName(filename).replace(/-edited$/u, "");
+          const expectedName = `${baseName || "document"}.pdf`;
           const response = await apiClient.post(
             `/api/v1/convert/pdf/text-editor/partial/${cachedJobId}?filename=${encodeURIComponent(expectedName)}`,
             partialDocument,
             {
-              responseType: 'blob',
+              responseType: "blob",
             },
           );
 
-          const contentDisposition = response.headers?.['content-disposition'] ?? '';
+          const contentDisposition =
+            response.headers?.["content-disposition"] ?? "";
           const detectedName = getFilenameFromHeaders(contentDisposition);
           downloadName = detectedName || expectedName;
           pdfBlob = response.data;
         } catch (incrementalError) {
           if (isLazyMode && cachedJobId) {
-            throw new Error('Incremental export failed for cached document. Please reload and retry.', {
-              cause: incrementalError,
-            });
+            throw new Error(
+              "Incremental export failed for cached document. Please reload and retry.",
+              {
+                cause: incrementalError,
+              },
+            );
           }
           console.warn(
-            '[handleSaveToWorkbench] Incremental export failed, falling back to full export',
+            "[handleSaveToWorkbench] Incremental export failed, falling back to full export",
             incrementalError,
           );
           // Fall through to full export
           if (isLazyMode && totalPages > 0) {
-            const allPageIndices = Array.from({ length: totalPages }, (_, index) => index);
+            const allPageIndices = Array.from(
+              { length: totalPages },
+              (_, index) => index,
+            );
             await ensureImagesForPages(allPageIndices);
           }
 
           const payload = buildPayload();
           if (!payload) {
-            throw new Error('Failed to build payload', { cause: incrementalError });
+            throw new Error("Failed to build payload", {
+              cause: incrementalError,
+            });
           }
 
           const { document, filename } = payload;
           const serialized = JSON.stringify(document);
-          const jsonFile = new File([serialized], filename, { type: 'application/json' });
-
-          const formData = new FormData();
-          formData.append('fileInput', jsonFile);
-          const response = await apiClient.post(CONVERSION_ENDPOINTS['text-editor-pdf'], formData, {
-            responseType: 'blob',
+          const jsonFile = new File([serialized], filename, {
+            type: "application/json",
           });
 
-          const contentDisposition = response.headers?.['content-disposition'] ?? '';
+          const formData = new FormData();
+          formData.append("fileInput", jsonFile);
+          const response = await apiClient.post(
+            CONVERSION_ENDPOINTS["text-editor-pdf"],
+            formData,
+            {
+              responseType: "blob",
+            },
+          );
+
+          const contentDisposition =
+            response.headers?.["content-disposition"] ?? "";
           const detectedName = getFilenameFromHeaders(contentDisposition);
-          const baseName = sanitizeBaseName(filename).replace(/-edited$/u, '');
-          downloadName = detectedName || `${baseName || 'document'}.pdf`;
+          const baseName = sanitizeBaseName(filename).replace(/-edited$/u, "");
+          downloadName = detectedName || `${baseName || "document"}.pdf`;
           pdfBlob = response.data;
         }
       } else {
         if (isLazyMode && totalPages > 0) {
-          const allPageIndices = Array.from({ length: totalPages }, (_, index) => index);
+          const allPageIndices = Array.from(
+            { length: totalPages },
+            (_, index) => index,
+          );
           await ensureImagesForPages(allPageIndices);
         }
 
         const payload = buildPayload();
         if (!payload) {
-          throw new Error('Failed to build payload');
+          throw new Error("Failed to build payload");
         }
 
         const { document, filename } = payload;
         const serialized = JSON.stringify(document);
-        const jsonFile = new File([serialized], filename, { type: 'application/json' });
-
-        const formData = new FormData();
-        formData.append('fileInput', jsonFile);
-        const response = await apiClient.post(CONVERSION_ENDPOINTS['text-editor-pdf'], formData, {
-          responseType: 'blob',
+        const jsonFile = new File([serialized], filename, {
+          type: "application/json",
         });
 
-        const contentDisposition = response.headers?.['content-disposition'] ?? '';
+        const formData = new FormData();
+        formData.append("fileInput", jsonFile);
+        const response = await apiClient.post(
+          CONVERSION_ENDPOINTS["text-editor-pdf"],
+          formData,
+          {
+            responseType: "blob",
+          },
+        );
+
+        const contentDisposition =
+          response.headers?.["content-disposition"] ?? "";
         const detectedName = getFilenameFromHeaders(contentDisposition);
-        const baseName = sanitizeBaseName(filename).replace(/-edited$/u, '');
-        downloadName = detectedName || `${baseName || 'document'}.pdf`;
+        const baseName = sanitizeBaseName(filename).replace(/-edited$/u, "");
+        downloadName = detectedName || `${baseName || "document"}.pdf`;
         pdfBlob = response.data;
       }
 
       // Create the new PDF file
-      const pdfFile = new File([pdfBlob], downloadName, { type: 'application/pdf' });
+      const pdfFile = new File([pdfBlob], downloadName, {
+        type: "application/pdf",
+      });
 
       // Create StirlingFile and stub for the output
       const { stirlingFiles, stubs } = await createStirlingFilesAndStubs(
         [pdfFile],
         parentStub,
-        'pdfTextEditor',
+        "pdfTextEditor",
       );
 
       // Replace the original file with the edited version
-      await consumeFiles([sourceFileIdRef.current as any], stirlingFiles, stubs);
+      await consumeFiles(
+        [sourceFileIdRef.current as any],
+        stirlingFiles,
+        stubs,
+      );
 
       // Update the source file ID to point to the new file
       sourceFileIdRef.current = stubs[0].id;
@@ -1425,16 +1652,19 @@ const PdfTextEditor = ({ onComplete, onError }: BaseToolProps) => {
       // once React has processed the state update
       navigationActions.setHasUnsavedChanges(false);
       setErrorMessage(null);
-      
+
       // Set flag to trigger navigation after state update is processed
       setShouldNavigateAfterSave(true);
     } catch (error: any) {
-      console.error('Failed to save to workbench', error);
+      console.error("Failed to save to workbench", error);
       const message =
         error?.response?.data ||
         error?.message ||
-        t('pdfTextEditor.errors.pdfConversion', 'Unable to save changes to workbench.');
-      const msgString = typeof message === 'string' ? message : String(message);
+        t(
+          "pdfTextEditor.errors.pdfConversion",
+          "Unable to save changes to workbench.",
+        );
+      const msgString = typeof message === "string" ? message : String(message);
       setErrorMessage(msgString);
       if (onError) {
         onError(msgString);
@@ -1478,10 +1708,10 @@ const PdfTextEditor = ({ onComplete, onError }: BaseToolProps) => {
       try {
         const page = await pdfDocumentRef.current.getPage(pageIndex + 1);
         const viewport = page.getViewport({ scale: Math.max(scale, 0.5) });
-        const canvas = document.createElement('canvas');
+        const canvas = document.createElement("canvas");
         canvas.width = viewport.width;
         canvas.height = viewport.height;
-        const context = canvas.getContext('2d');
+        const context = canvas.getContext("2d");
         if (!context) {
           page.cleanup();
           return;
@@ -1494,13 +1724,16 @@ const PdfTextEditor = ({ onComplete, onError }: BaseToolProps) => {
           const maskMarginTop = 0;
           const maskMarginBottom = Math.max(3 * scale, 3);
           context.save();
-          context.globalCompositeOperation = 'destination-out';
-          context.fillStyle = '#000000';
+          context.globalCompositeOperation = "destination-out";
+          context.fillStyle = "#000000";
           for (const item of textContent.items) {
             // Skip TextMarkedContent items, only process TextItem
-            if (!('transform' in item)) continue;
+            if (!("transform" in item)) continue;
 
-            const transform = Util.transform(viewport.transform, item.transform);
+            const transform = Util.transform(
+              viewport.transform,
+              item.transform,
+            );
             const a = transform[0];
             const b = transform[1];
             const c = transform[2];
@@ -1511,8 +1744,13 @@ const PdfTextEditor = ({ onComplete, onError }: BaseToolProps) => {
 
             const width = (item.width || 0) * viewport.scale + maskMarginX * 2;
             const fontHeight = Math.hypot(c, d);
-            const rawHeight = item.height ? item.height * viewport.scale : fontHeight;
-            const height = Math.max(rawHeight + maskMarginTop + maskMarginBottom, fontHeight + maskMarginTop + maskMarginBottom);
+            const rawHeight = item.height
+              ? item.height * viewport.scale
+              : fontHeight;
+            const height = Math.max(
+              rawHeight + maskMarginTop + maskMarginBottom,
+              fontHeight + maskMarginTop + maskMarginBottom,
+            );
             const baselineOffset = height - maskMarginBottom;
 
             context.save();
@@ -1523,7 +1761,10 @@ const PdfTextEditor = ({ onComplete, onError }: BaseToolProps) => {
           }
           context.restore();
         } catch (textError) {
-          console.warn('[PdfTextEditor] Failed to strip text from preview', textError);
+          console.warn(
+            "[PdfTextEditor] Failed to strip text from preview",
+            textError,
+          );
         }
 
         // Also mask out images to prevent ghost/shadow images when they're moved
@@ -1531,15 +1772,17 @@ const PdfTextEditor = ({ onComplete, onError }: BaseToolProps) => {
           const pageImages = imagesByPage[pageIndex] ?? [];
           if (pageImages.length > 0) {
             context.save();
-            context.globalCompositeOperation = 'destination-out';
-            context.fillStyle = '#000000';
+            context.globalCompositeOperation = "destination-out";
+            context.fillStyle = "#000000";
             for (const image of pageImages) {
               if (!image) continue;
               // Get image bounds in PDF coordinates
               const left = image.left ?? image.x ?? 0;
               const bottom = image.bottom ?? image.y ?? 0;
-              const width = image.width ?? Math.max((image.right ?? left) - left, 0);
-              const height = image.height ?? Math.max((image.top ?? bottom) - bottom, 0);
+              const width =
+                image.width ?? Math.max((image.right ?? left) - left, 0);
+              const height =
+                image.height ?? Math.max((image.top ?? bottom) - bottom, 0);
               const _right = left + width;
               const top = bottom + height;
 
@@ -1553,9 +1796,12 @@ const PdfTextEditor = ({ onComplete, onError }: BaseToolProps) => {
             context.restore();
           }
         } catch (imageError) {
-          console.warn('[PdfTextEditor] Failed to strip images from preview', imageError);
+          console.warn(
+            "[PdfTextEditor] Failed to strip images from preview",
+            imageError,
+          );
         }
-        const dataUrl = canvas.toDataURL('image/png');
+        const dataUrl = canvas.toDataURL("image/png");
         page.cleanup();
         if (previewRequestIdRef.current !== currentToken) {
           return;
@@ -1567,7 +1813,7 @@ const PdfTextEditor = ({ onComplete, onError }: BaseToolProps) => {
           return next;
         });
       } catch (error) {
-        console.warn('[PdfTextEditor] Failed to render page preview', error);
+        console.warn("[PdfTextEditor] Failed to render page preview", error);
       } finally {
         previewRenderingRef.current.delete(pageIndex);
       }
@@ -1583,79 +1829,82 @@ const PdfTextEditor = ({ onComplete, onError }: BaseToolProps) => {
     }
   }, [groupingMode, resetToDocument]);
 
-  const viewData = useMemo<PdfTextEditorViewData>(() => ({
-    document: loadedDocument,
-    groupsByPage,
-    imagesByPage,
-    pagePreviews,
-    selectedPage,
-    dirtyPages,
-    hasDocument,
-    hasVectorPreview,
-    fileName,
-    errorMessage,
-    isGeneratingPdf,
-    isSavingToWorkbench,
-    isConverting,
-    conversionProgress,
-    hasChanges,
-    forceSingleTextElement,
-    groupingMode,
-    autoScaleText,
-    onAutoScaleTextChange: setAutoScaleText,
-    requestPagePreview,
-    onSelectPage: handleSelectPage,
-    onGroupEdit: handleGroupTextChange,
-    onGroupDelete: handleGroupDelete,
-    onImageTransform: handleImageTransform,
-    onImageReset: handleImageReset,
-    onReset: handleResetEdits,
-    onDownloadJson: handleDownloadJson,
-    onGeneratePdf: handleGeneratePdf,
-    onGeneratePdfForNavigation: async () => {
-      // Generate PDF without triggering tool completion
-      await handleGeneratePdf(true);
-    },
-    onSaveToWorkbench: handleSaveToWorkbench,
-    onForceSingleTextElementChange: setForceSingleTextElement,
-    onGroupingModeChange: setGroupingMode,
-    onMergeGroups: handleMergeGroups,
-    onUngroupGroup: handleUngroupGroup,
-    onLoadFile: handleLoadFileFromDropzone,
-  }), [
-    handleMergeGroups,
-    handleUngroupGroup,
-    handleImageTransform,
-    handleSaveToWorkbench,
-    imagesByPage,
-    isSavingToWorkbench,
-    pagePreviews,
-    dirtyPages,
-    errorMessage,
-    fileName,
-    groupsByPage,
-    handleDownloadJson,
-    handleGeneratePdf,
-    handleGroupTextChange,
-    handleGroupDelete,
-    handleImageReset,
-    handleResetEdits,
-    handleSelectPage,
-    hasChanges,
-    hasDocument,
-    hasVectorPreview,
-    isGeneratingPdf,
-    isConverting,
-    conversionProgress,
-    loadedDocument,
-    selectedPage,
-    forceSingleTextElement,
-    groupingMode,
-    autoScaleText,
-    requestPagePreview,
-    setForceSingleTextElement,
-    handleLoadFileFromDropzone,
-  ]);
+  const viewData = useMemo<PdfTextEditorViewData>(
+    () => ({
+      document: loadedDocument,
+      groupsByPage,
+      imagesByPage,
+      pagePreviews,
+      selectedPage,
+      dirtyPages,
+      hasDocument,
+      hasVectorPreview,
+      fileName,
+      errorMessage,
+      isGeneratingPdf,
+      isSavingToWorkbench,
+      isConverting,
+      conversionProgress,
+      hasChanges,
+      forceSingleTextElement,
+      groupingMode,
+      autoScaleText,
+      onAutoScaleTextChange: setAutoScaleText,
+      requestPagePreview,
+      onSelectPage: handleSelectPage,
+      onGroupEdit: handleGroupTextChange,
+      onGroupDelete: handleGroupDelete,
+      onImageTransform: handleImageTransform,
+      onImageReset: handleImageReset,
+      onReset: handleResetEdits,
+      onDownloadJson: handleDownloadJson,
+      onGeneratePdf: handleGeneratePdf,
+      onGeneratePdfForNavigation: async () => {
+        // Generate PDF without triggering tool completion
+        await handleGeneratePdf(true);
+      },
+      onSaveToWorkbench: handleSaveToWorkbench,
+      onForceSingleTextElementChange: setForceSingleTextElement,
+      onGroupingModeChange: setGroupingMode,
+      onMergeGroups: handleMergeGroups,
+      onUngroupGroup: handleUngroupGroup,
+      onLoadFile: handleLoadFileFromDropzone,
+    }),
+    [
+      handleMergeGroups,
+      handleUngroupGroup,
+      handleImageTransform,
+      handleSaveToWorkbench,
+      imagesByPage,
+      isSavingToWorkbench,
+      pagePreviews,
+      dirtyPages,
+      errorMessage,
+      fileName,
+      groupsByPage,
+      handleDownloadJson,
+      handleGeneratePdf,
+      handleGroupTextChange,
+      handleGroupDelete,
+      handleImageReset,
+      handleResetEdits,
+      handleSelectPage,
+      hasChanges,
+      hasDocument,
+      hasVectorPreview,
+      isGeneratingPdf,
+      isConverting,
+      conversionProgress,
+      loadedDocument,
+      selectedPage,
+      forceSingleTextElement,
+      groupingMode,
+      autoScaleText,
+      requestPagePreview,
+      setForceSingleTextElement,
+      handleLoadFileFromDropzone,
+    ],
+  );
 
   const latestViewDataRef = useRef<PdfTextEditorViewData>(viewData);
   latestViewDataRef.current = viewData;
@@ -1674,7 +1923,7 @@ const PdfTextEditor = ({ onComplete, onError }: BaseToolProps) => {
       return;
     }
 
-    if (navigationState.selectedTool !== 'pdfTextEditor') {
+    if (navigationState.selectedTool !== "pdfTextEditor") {
       return;
     }
 
@@ -1697,7 +1946,7 @@ const PdfTextEditor = ({ onComplete, onError }: BaseToolProps) => {
   // Auto-navigate to workbench when tool is selected
   const hasAutoOpenedWorkbenchRef = useRef(false);
   useEffect(() => {
-    if (navigationState.selectedTool !== 'pdfTextEditor') {
+    if (navigationState.selectedTool !== "pdfTextEditor") {
       hasAutoOpenedWorkbenchRef.current = false;
       return;
     }
@@ -1722,7 +1971,7 @@ const PdfTextEditor = ({ onComplete, onError }: BaseToolProps) => {
       icon: <DescriptionIcon fontSize="small" />,
       component: PdfTextEditorView,
     });
-    setLeftPanelView('toolContent');
+    setLeftPanelView("toolContent");
     setCustomWorkbenchViewData(WORKBENCH_VIEW_ID, latestViewDataRef.current);
   }, [
     registerCustomWorkbenchView,
@@ -1737,14 +1986,21 @@ const PdfTextEditor = ({ onComplete, onError }: BaseToolProps) => {
       // Clear backend cache when leaving the tool
       const jobId = cachedJobIdRef.current;
       if (jobId) {
-        console.log(`[PdfTextEditor] Cleaning up cached document on unmount: ${jobId}`);
-        apiClient.post(`/api/v1/convert/pdf/text-editor/clear-cache/${jobId}`).catch((error) => {
-          console.warn('[PdfTextEditor] Failed to clear cache on unmount:', error);
-        });
+        console.log(
+          `[PdfTextEditor] Cleaning up cached document on unmount: ${jobId}`,
+        );
+        apiClient
+          .post(`/api/v1/convert/pdf/text-editor/clear-cache/${jobId}`)
+          .catch((error) => {
+            console.warn(
+              "[PdfTextEditor] Failed to clear cache on unmount:",
+              error,
+            );
+          });
       }
       clearCustomWorkbenchViewData(WORKBENCH_VIEW_ID);
       unregisterCustomWorkbenchView(WORKBENCH_VIEW_ID);
-      setLeftPanelView('toolPicker');
+      setLeftPanelView("toolPicker");
     };
   }, []); // Empty deps = cleanup only on unmount
 
@@ -1767,7 +2023,7 @@ const PdfTextEditor = ({ onComplete, onError }: BaseToolProps) => {
 };
 
 (PdfTextEditor as ToolComponent).tool = () => {
-  throw new Error('PDF Text Editor does not support automation operations.');
+  throw new Error("PDF Text Editor does not support automation operations.");
 };
 
 (PdfTextEditor as ToolComponent).getDefaultParameters = () => ({
diff --git a/frontend/src/core/tools/pdfTextEditor/fontAnalysis.ts b/frontend/src/core/tools/pdfTextEditor/fontAnalysis.ts
index 3582b9b787..197a350ebd 100644
--- a/frontend/src/core/tools/pdfTextEditor/fontAnalysis.ts
+++ b/frontend/src/core/tools/pdfTextEditor/fontAnalysis.ts
@@ -1,6 +1,14 @@
-import { PdfJsonDocument, PdfJsonFont } from '@app/tools/pdfTextEditor/pdfTextEditorTypes';
+import {
+  PdfJsonDocument,
+  PdfJsonFont,
+} from "@app/tools/pdfTextEditor/pdfTextEditorTypes";
 
-export type FontStatus = 'perfect' | 'embedded-subset' | 'system-fallback' | 'missing' | 'unknown';
+export type FontStatus =
+  | "perfect"
+  | "embedded-subset"
+  | "system-fallback"
+  | "missing"
+  | "unknown";
 
 export interface FontAnalysis {
   fontId: string;
@@ -47,17 +55,27 @@ const isSubsetFont = (baseName: string | null | undefined): boolean => {
 const isStandard14Font = (font: PdfJsonFont): boolean => {
   if (font.standard14Name) return true;
 
-  const baseName = (font.baseName || '').toLowerCase().replace(/[-_\s]/g, '');
+  const baseName = (font.baseName || "").toLowerCase().replace(/[-_\s]/g, "");
 
   const standard14Patterns = [
-    'timesroman', 'timesbold', 'timesitalic', 'timesbolditalic',
-    'helvetica', 'helveticabold', 'helveticaoblique', 'helveticaboldoblique',
-    'courier', 'courierbold', 'courieroblique', 'courierboldoblique',
-    'symbol', 'zapfdingbats'
+    "timesroman",
+    "timesbold",
+    "timesitalic",
+    "timesbolditalic",
+    "helvetica",
+    "helveticabold",
+    "helveticaoblique",
+    "helveticaboldoblique",
+    "courier",
+    "courierbold",
+    "courieroblique",
+    "courierboldoblique",
+    "symbol",
+    "zapfdingbats",
   ];
 
   // Check exact matches or if the base name contains the pattern
-  return standard14Patterns.some(pattern => {
+  return standard14Patterns.some((pattern) => {
     // Exact match
     if (baseName === pattern) return true;
     // Contains pattern (e.g., "ABCDEF+Helvetica" matches "helvetica")
@@ -74,22 +92,36 @@ const isStandard14Font = (font: PdfJsonFont): boolean => {
  * Based on PdfJsonFallbackFontService.java
  */
 const hasBackendFallbackFont = (font: PdfJsonFont): boolean => {
-  const baseName = (font.baseName || '').toLowerCase().replace(/[-_\s]/g, '');
+  const baseName = (font.baseName || "").toLowerCase().replace(/[-_\s]/g, "");
 
   // Backend has these font families available (from PdfJsonFallbackFontService)
   const backendFonts = [
     // Liberation fonts (metric-compatible with MS core fonts)
-    'arial', 'helvetica', 'arimo',
-    'times', 'timesnewroman', 'tinos',
-    'courier', 'couriernew', 'cousine',
-    'liberation', 'liberationsans', 'liberationserif', 'liberationmono',
+    "arial",
+    "helvetica",
+    "arimo",
+    "times",
+    "timesnewroman",
+    "tinos",
+    "courier",
+    "couriernew",
+    "cousine",
+    "liberation",
+    "liberationsans",
+    "liberationserif",
+    "liberationmono",
     // DejaVu fonts
-    'dejavu', 'dejavusans', 'dejavuserif', 'dejavumono', 'dejavusansmono',
+    "dejavu",
+    "dejavusans",
+    "dejavuserif",
+    "dejavumono",
+    "dejavusansmono",
     // Noto fonts
-    'noto', 'notosans'
+    "noto",
+    "notosans",
   ];
 
-  return backendFonts.some(pattern => {
+  return backendFonts.some((pattern) => {
     if (baseName === pattern) return true;
     if (baseName.includes(pattern)) return true;
     return false;
@@ -100,7 +132,9 @@ const hasBackendFallbackFont = (font: PdfJsonFont): boolean => {
  * Extracts the base font name from a subset font name
  * e.g., "ABCDEF+Arial" -> "Arial"
  */
-const extractBaseFontName = (baseName: string | null | undefined): string | null => {
+const extractBaseFontName = (
+  baseName: string | null | undefined,
+): string | null => {
   if (!baseName) return null;
   const match = baseName.match(/^[A-Z]{6}\+(.+)$/);
   return match ? match[1] : baseName;
@@ -110,9 +144,12 @@ const extractBaseFontName = (baseName: string | null | undefined): string | null
  * Analyzes a single font to determine if it can be reproduced perfectly
  * Takes allFonts to check if full versions of subset fonts are available
  */
-export const analyzeFontReproduction = (font: PdfJsonFont, allFonts?: PdfJsonFont[]): FontAnalysis => {
-  const fontId = font.id || font.uid || 'unknown';
-  const baseName = font.baseName || 'Unknown Font';
+export const analyzeFontReproduction = (
+  font: PdfJsonFont,
+  allFonts?: PdfJsonFont[],
+): FontAnalysis => {
+  const fontId = font.id || font.uid || "unknown";
+  const baseName = font.baseName || "Unknown Font";
   const isSubset = isSubsetFont(font.baseName);
   const isStandard14 = isStandard14Font(font);
   const hasBackendFallback = hasBackendFallbackFont(font);
@@ -120,18 +157,18 @@ export const analyzeFontReproduction = (font: PdfJsonFont, allFonts?: PdfJsonFon
 
   // Check available web formats (ordered by preference)
   const webFormats = [
-    { key: 'webProgram', format: font.webProgramFormat },
-    { key: 'pdfProgram', format: font.pdfProgramFormat },
-    { key: 'program', format: font.programFormat },
+    { key: "webProgram", format: font.webProgramFormat },
+    { key: "pdfProgram", format: font.pdfProgramFormat },
+    { key: "program", format: font.programFormat },
   ];
 
-  const availableWebFormat = webFormats.find(f => f.format);
+  const availableWebFormat = webFormats.find((f) => f.format);
   const hasWebFormat = !!availableWebFormat;
   const webFormat = availableWebFormat?.format || undefined;
 
   const warnings: string[] = [];
   const suggestions: string[] = [];
-  let status: FontStatus = 'unknown';
+  let status: FontStatus = "unknown";
 
   // Check if we have the full font when this is a subset
   let hasFullFontVersion = false;
@@ -139,11 +176,16 @@ export const analyzeFontReproduction = (font: PdfJsonFont, allFonts?: PdfJsonFon
     const baseFont = extractBaseFontName(font.baseName);
     if (baseFont) {
       // Look for a non-subset version of this font with a web format
-      hasFullFontVersion = allFonts.some(f => {
+      hasFullFontVersion = allFonts.some((f) => {
         const otherBaseName = extractBaseFontName(f.baseName);
         const isNotSubset = !isSubsetFont(f.baseName);
-        const hasFormat = !!(f.webProgramFormat || f.pdfProgramFormat || f.programFormat);
-        const sameBase = otherBaseName?.toLowerCase() === baseFont.toLowerCase();
+        const hasFormat = !!(
+          f.webProgramFormat ||
+          f.pdfProgramFormat ||
+          f.programFormat
+        );
+        const sameBase =
+          otherBaseName?.toLowerCase() === baseFont.toLowerCase();
         return sameBase && isNotSubset && hasFormat && (f.embedded ?? false);
       });
     }
@@ -152,60 +194,97 @@ export const analyzeFontReproduction = (font: PdfJsonFont, allFonts?: PdfJsonFon
   // Analyze font status - focusing on PDF export quality
   if (isStandard14) {
     // Standard 14 fonts are always available in PDF readers - perfect for export!
-    status = 'perfect';
-    suggestions.push('Standard PDF font (Times, Helvetica, or Courier). Always available in PDF readers.');
-    suggestions.push('Exported PDFs will render consistently across all PDF readers.');
+    status = "perfect";
+    suggestions.push(
+      "Standard PDF font (Times, Helvetica, or Courier). Always available in PDF readers.",
+    );
+    suggestions.push(
+      "Exported PDFs will render consistently across all PDF readers.",
+    );
   } else if (embedded && !isSubset) {
     // Perfect: Fully embedded with complete character set
-    status = 'perfect';
-    suggestions.push('Font is fully embedded. Exported PDFs will reproduce text perfectly, even with edits.');
-  } else if (embedded && isSubset && (hasFullFontVersion || hasBackendFallback)) {
+    status = "perfect";
+    suggestions.push(
+      "Font is fully embedded. Exported PDFs will reproduce text perfectly, even with edits.",
+    );
+  } else if (
+    embedded &&
+    isSubset &&
+    (hasFullFontVersion || hasBackendFallback)
+  ) {
     // Subset but we have the full font or backend fallback - perfect!
-    status = 'perfect';
+    status = "perfect";
     if (hasFullFontVersion) {
-      suggestions.push('Full font version is also available in the document. Exported PDFs can reproduce all characters.');
+      suggestions.push(
+        "Full font version is also available in the document. Exported PDFs can reproduce all characters.",
+      );
     } else if (hasBackendFallback) {
-      suggestions.push('Backend has the full font available. Exported PDFs can reproduce all characters, including new text.');
+      suggestions.push(
+        "Backend has the full font available. Exported PDFs can reproduce all characters, including new text.",
+      );
     }
   } else if (embedded && isSubset) {
     // Good, but subset: May have missing characters if user adds new text
-    status = 'embedded-subset';
-    warnings.push('This is a subset font - only specific characters are embedded in the PDF.');
-    warnings.push('Exported PDFs may have missing characters if you add new text with this font.');
-    suggestions.push('Existing text will export correctly. New characters may render as boxes (�) or fallback glyphs.');
+    status = "embedded-subset";
+    warnings.push(
+      "This is a subset font - only specific characters are embedded in the PDF.",
+    );
+    warnings.push(
+      "Exported PDFs may have missing characters if you add new text with this font.",
+    );
+    suggestions.push(
+      "Existing text will export correctly. New characters may render as boxes (�) or fallback glyphs.",
+    );
   } else if (!embedded && hasBackendFallback) {
     // Not embedded, but backend has it - perfect for export!
-    status = 'perfect';
-    suggestions.push('Backend has this font available. Exported PDFs will use the backend fallback font.');
-    suggestions.push('Text will export correctly with consistent appearance.');
+    status = "perfect";
+    suggestions.push(
+      "Backend has this font available. Exported PDFs will use the backend fallback font.",
+    );
+    suggestions.push("Text will export correctly with consistent appearance.");
   } else if (!embedded) {
     // Not embedded - must rely on system fonts (risky for export)
-    status = 'missing';
-    warnings.push('Font is not embedded in the PDF.');
-    warnings.push('Exported PDFs will substitute with a fallback font, which may look very different.');
-    suggestions.push('Consider re-embedding fonts or accepting that the exported PDF will use fallback fonts.');
+    status = "missing";
+    warnings.push("Font is not embedded in the PDF.");
+    warnings.push(
+      "Exported PDFs will substitute with a fallback font, which may look very different.",
+    );
+    suggestions.push(
+      "Consider re-embedding fonts or accepting that the exported PDF will use fallback fonts.",
+    );
   } else if (embedded && !hasWebFormat) {
     // Embedded but no web format available (still okay for export)
-    status = 'perfect';
-    suggestions.push('Font is embedded in the PDF. Exported PDFs will reproduce correctly.');
-    suggestions.push('Web preview may use a fallback font, but the final PDF export will be accurate.');
+    status = "perfect";
+    suggestions.push(
+      "Font is embedded in the PDF. Exported PDFs will reproduce correctly.",
+    );
+    suggestions.push(
+      "Web preview may use a fallback font, but the final PDF export will be accurate.",
+    );
   }
 
   // Additional warnings based on font properties
-  if (font.subtype === 'Type0' && font.cidSystemInfo) {
-    const registry = font.cidSystemInfo.registry || '';
-    const ordering = font.cidSystemInfo.ordering || '';
-    if (registry.includes('Adobe') && (ordering.includes('Identity') || ordering.includes('UCS'))) {
+  if (font.subtype === "Type0" && font.cidSystemInfo) {
+    const registry = font.cidSystemInfo.registry || "";
+    const ordering = font.cidSystemInfo.ordering || "";
+    if (
+      registry.includes("Adobe") &&
+      (ordering.includes("Identity") || ordering.includes("UCS"))
+    ) {
       // CID fonts with Identity encoding are common for Asian languages
       if (!embedded || !hasWebFormat) {
-        warnings.push('This CID font may contain Asian or Unicode characters.');
+        warnings.push("This CID font may contain Asian or Unicode characters.");
       }
     }
   }
 
-  if (font.encoding && !font.encoding.includes('WinAnsiEncoding') && !font.encoding.includes('MacRomanEncoding')) {
+  if (
+    font.encoding &&
+    !font.encoding.includes("WinAnsiEncoding") &&
+    !font.encoding.includes("MacRomanEncoding")
+  ) {
     // Custom encodings may cause issues
-    if (font.encoding !== 'Identity-H' && font.encoding !== 'Identity-V') {
+    if (font.encoding !== "Identity-H" && font.encoding !== "Identity-V") {
       warnings.push(`Custom encoding detected: ${font.encoding}`);
     }
   }
@@ -231,9 +310,14 @@ export const analyzeFontReproduction = (font: PdfJsonFont, allFonts?: PdfJsonFon
  */
 export const getFontsForPage = (
   document: PdfJsonDocument | null,
-  pageIndex: number
+  pageIndex: number,
 ): PdfJsonFont[] => {
-  if (!document?.fonts || !document?.pages || pageIndex < 0 || pageIndex >= document.pages.length) {
+  if (
+    !document?.fonts ||
+    !document?.pages ||
+    pageIndex < 0 ||
+    pageIndex >= document.pages.length
+  ) {
     return [];
   }
 
@@ -244,16 +328,18 @@ export const getFontsForPage = (
 
   // Get unique font IDs used on this page
   const fontIdsOnPage = new Set<string>();
-  page.textElements.forEach(element => {
+  page.textElements.forEach((element) => {
     if (element?.fontId) {
       fontIdsOnPage.add(element.fontId);
     }
   });
 
   // Filter fonts to only those used on this page
-  const allFonts = document.fonts.filter((font): font is PdfJsonFont => font !== null && font !== undefined);
+  const allFonts = document.fonts.filter(
+    (font): font is PdfJsonFont => font !== null && font !== undefined,
+  );
 
-  const fontsOnPage = allFonts.filter(font => {
+  const fontsOnPage = allFonts.filter((font) => {
     // Match by ID
     if (font.id && fontIdsOnPage.has(font.id)) {
       return true;
@@ -274,8 +360,12 @@ export const getFontsForPage = (
 
   // Deduplicate by base font name to avoid showing the same font multiple times
   const uniqueFonts = new Map<string, PdfJsonFont>();
-  fontsOnPage.forEach(font => {
-    const baseName = extractBaseFontName(font.baseName) || font.baseName || font.id || 'unknown';
+  fontsOnPage.forEach((font) => {
+    const baseName =
+      extractBaseFontName(font.baseName) ||
+      font.baseName ||
+      font.id ||
+      "unknown";
     const key = baseName.toLowerCase();
 
     // Keep the first occurrence, or prefer non-subset over subset
@@ -300,7 +390,7 @@ export const getFontsForPage = (
  */
 export const analyzeDocumentFonts = (
   document: PdfJsonDocument | null,
-  pageIndex?: number
+  pageIndex?: number,
 ): DocumentFontAnalysis => {
   if (!document?.fonts || document.fonts.length === 0) {
     return {
@@ -317,12 +407,13 @@ export const analyzeDocumentFonts = (
     };
   }
 
-  const allFonts = document.fonts.filter((font): font is PdfJsonFont => font !== null && font !== undefined);
+  const allFonts = document.fonts.filter(
+    (font): font is PdfJsonFont => font !== null && font !== undefined,
+  );
 
   // Filter to page-specific fonts if pageIndex is provided
-  const fontsToAnalyze = pageIndex !== undefined
-    ? getFontsForPage(document, pageIndex)
-    : allFonts;
+  const fontsToAnalyze =
+    pageIndex !== undefined ? getFontsForPage(document, pageIndex) : allFonts;
 
   if (fontsToAnalyze.length === 0) {
     return {
@@ -339,23 +430,33 @@ export const analyzeDocumentFonts = (
     };
   }
 
-  const fontAnalyses = fontsToAnalyze.map(font => analyzeFontReproduction(font, allFonts));
+  const fontAnalyses = fontsToAnalyze.map((font) =>
+    analyzeFontReproduction(font, allFonts),
+  );
 
   // Calculate summary
   const summary = {
-    perfect: fontAnalyses.filter(f => f.status === 'perfect').length,
-    embeddedSubset: fontAnalyses.filter(f => f.status === 'embedded-subset').length,
-    systemFallback: fontAnalyses.filter(f => f.status === 'system-fallback').length,
-    missing: fontAnalyses.filter(f => f.status === 'missing').length,
-    unknown: fontAnalyses.filter(f => f.status === 'unknown').length,
+    perfect: fontAnalyses.filter((f) => f.status === "perfect").length,
+    embeddedSubset: fontAnalyses.filter((f) => f.status === "embedded-subset")
+      .length,
+    systemFallback: fontAnalyses.filter((f) => f.status === "system-fallback")
+      .length,
+    missing: fontAnalyses.filter((f) => f.status === "missing").length,
+    unknown: fontAnalyses.filter((f) => f.status === "unknown").length,
   };
 
   // Can reproduce perfectly ONLY if all fonts are truly perfect (not subsets)
-  const canReproducePerfectly = fontAnalyses.every(f => f.status === 'perfect');
+  const canReproducePerfectly = fontAnalyses.every(
+    (f) => f.status === "perfect",
+  );
 
   // Has warnings if any font has issues (including subsets)
   const hasWarnings = fontAnalyses.some(
-    f => f.warnings.length > 0 || f.status === 'missing' || f.status === 'system-fallback' || f.status === 'embedded-subset'
+    (f) =>
+      f.warnings.length > 0 ||
+      f.status === "missing" ||
+      f.status === "system-fallback" ||
+      f.status === "embedded-subset",
   );
 
   return {
@@ -371,16 +472,16 @@ export const analyzeDocumentFonts = (
  */
 export const getFontStatusDescription = (status: FontStatus): string => {
   switch (status) {
-    case 'perfect':
-      return 'Fully embedded - perfect reproduction';
-    case 'embedded-subset':
-      return 'Embedded (subset) - existing text will render correctly';
-    case 'system-fallback':
-      return 'Using system font - appearance may differ';
-    case 'missing':
-      return 'Not embedded - will use fallback font';
-    case 'unknown':
-      return 'Unknown status';
+    case "perfect":
+      return "Fully embedded - perfect reproduction";
+    case "embedded-subset":
+      return "Embedded (subset) - existing text will render correctly";
+    case "system-fallback":
+      return "Using system font - appearance may differ";
+    case "missing":
+      return "Not embedded - will use fallback font";
+    case "unknown":
+      return "Unknown status";
   }
 };
 
@@ -389,16 +490,16 @@ export const getFontStatusDescription = (status: FontStatus): string => {
  */
 export const getFontStatusColor = (status: FontStatus): string => {
   switch (status) {
-    case 'perfect':
-      return 'green';
-    case 'embedded-subset':
-      return 'blue';
-    case 'system-fallback':
-      return 'yellow';
-    case 'missing':
-      return 'red';
-    case 'unknown':
-      return 'gray';
+    case "perfect":
+      return "green";
+    case "embedded-subset":
+      return "blue";
+    case "system-fallback":
+      return "yellow";
+    case "missing":
+      return "red";
+    case "unknown":
+      return "gray";
   }
 };
 
@@ -407,15 +508,15 @@ export const getFontStatusColor = (status: FontStatus): string => {
  */
 export const getFontStatusIcon = (status: FontStatus): string => {
   switch (status) {
-    case 'perfect':
-      return '✓';
-    case 'embedded-subset':
-      return 'âš ';
-    case 'system-fallback':
-      return 'âš ';
-    case 'missing':
-      return '✗';
-    case 'unknown':
-      return '?';
+    case "perfect":
+      return "✓";
+    case "embedded-subset":
+      return "âš ";
+    case "system-fallback":
+      return "âš ";
+    case "missing":
+      return "✗";
+    case "unknown":
+      return "?";
   }
 };
diff --git a/frontend/src/core/tools/pdfTextEditor/pdfTextEditorTypes.ts b/frontend/src/core/tools/pdfTextEditor/pdfTextEditorTypes.ts
index aab065a113..3bb5087a8a 100644
--- a/frontend/src/core/tools/pdfTextEditor/pdfTextEditorTypes.ts
+++ b/frontend/src/core/tools/pdfTextEditor/pdfTextEditorTypes.ts
@@ -160,7 +160,7 @@ export interface TextGroup {
   lineSpacing?: number | null;
   lineElementCounts?: number[] | null;
   color?: string | null;
-  fontWeight?: number | 'normal' | 'bold' | null;
+  fontWeight?: number | "normal" | "bold" | null;
   rotation?: number | null;
   anchor?: { x: number; y: number } | null;
   baselineLength?: number | null;
@@ -200,7 +200,7 @@ export interface PdfTextEditorViewData {
   conversionProgress: ConversionProgress | null;
   hasChanges: boolean;
   forceSingleTextElement: boolean;
-  groupingMode: 'auto' | 'paragraph' | 'singleLine';
+  groupingMode: "auto" | "paragraph" | "singleLine";
   autoScaleText: boolean;
   onAutoScaleTextChange: (value: boolean) => void;
   requestPagePreview: (pageIndex: number, scale: number) => void;
@@ -226,7 +226,7 @@ export interface PdfTextEditorViewData {
   onSaveToWorkbench: () => Promise<void>;
   isSavingToWorkbench: boolean;
   onForceSingleTextElementChange: (value: boolean) => void;
-  onGroupingModeChange: (value: 'auto' | 'paragraph' | 'singleLine') => void;
+  onGroupingModeChange: (value: "auto" | "paragraph" | "singleLine") => void;
   onMergeGroups: (pageIndex: number, groupIds: string[]) => boolean;
   onUngroupGroup: (pageIndex: number, groupId: string) => boolean;
   onLoadFile: (file: File) => void;
diff --git a/frontend/src/core/tools/pdfTextEditor/pdfTextEditorUtils.ts b/frontend/src/core/tools/pdfTextEditor/pdfTextEditorUtils.ts
index 07fde0beff..f2a5777b8e 100644
--- a/frontend/src/core/tools/pdfTextEditor/pdfTextEditorUtils.ts
+++ b/frontend/src/core/tools/pdfTextEditor/pdfTextEditorUtils.ts
@@ -7,7 +7,7 @@ import {
   TextGroup,
   DEFAULT_PAGE_HEIGHT,
   DEFAULT_PAGE_WIDTH,
-} from '@app/tools/pdfTextEditor/pdfTextEditorTypes';
+} from "@app/tools/pdfTextEditor/pdfTextEditorTypes";
 
 const LINE_TOLERANCE = 2;
 const GAP_FACTOR = 0.6;
@@ -26,16 +26,16 @@ type FontMetricsMap = Map<string, FontMetrics>;
 
 const sanitizeParagraphText = (text: string | undefined | null): string => {
   if (!text) {
-    return '';
+    return "";
   }
-  return text.replace(/\r?\n/g, '');
+  return text.replace(/\r?\n/g, "");
 };
 
 const splitParagraphIntoLines = (text: string | undefined | null): string[] => {
   if (text === null || text === undefined) {
-    return [''];
+    return [""];
   }
-  return text.replace(/\r/g, '').split('\n');
+  return text.replace(/\r/g, "").split("\n");
 };
 
 const extractElementBaseline = (element: PdfJsonTextElement): number | null => {
@@ -44,15 +44,18 @@ const extractElementBaseline = (element: PdfJsonTextElement): number | null => {
   }
   if (element.textMatrix && element.textMatrix.length >= 6) {
     const baseline = element.textMatrix[5];
-    return typeof baseline === 'number' ? baseline : null;
+    return typeof baseline === "number" ? baseline : null;
   }
-  if (typeof element.y === 'number') {
+  if (typeof element.y === "number") {
     return element.y;
   }
   return null;
 };
 
-const shiftElementsBy = (elements: PdfJsonTextElement[], delta: number): PdfJsonTextElement[] => {
+const shiftElementsBy = (
+  elements: PdfJsonTextElement[],
+  delta: number,
+): PdfJsonTextElement[] => {
   if (delta === 0) {
     return elements.map(cloneTextElement);
   }
@@ -63,7 +66,7 @@ const shiftElementsBy = (elements: PdfJsonTextElement[], delta: number): PdfJson
       matrix[5] = (matrix[5] ?? 0) + delta;
       clone.textMatrix = matrix;
     }
-    if (typeof clone.y === 'number') {
+    if (typeof clone.y === "number") {
       clone.y += delta;
     } else if (clone.y === null || clone.y === undefined) {
       clone.y = delta;
@@ -79,20 +82,26 @@ const countGraphemes = (text: string): number => {
   return Array.from(text).length;
 };
 
-const metricsFor = (metrics: FontMetricsMap | undefined, fontId?: string | null): FontMetrics | undefined => {
+const metricsFor = (
+  metrics: FontMetricsMap | undefined,
+  fontId?: string | null,
+): FontMetrics | undefined => {
   if (!metrics || !fontId) {
     return undefined;
   }
   return metrics.get(fontId) ?? undefined;
 };
 
-const buildFontMetrics = (document: PdfJsonDocument | null | undefined): FontMetricsMap => {
+const buildFontMetrics = (
+  document: PdfJsonDocument | null | undefined,
+): FontMetricsMap => {
   const metrics: FontMetricsMap = new Map();
   document?.fonts?.forEach((font) => {
     if (!font) {
       return;
     }
-    const unitsPerEm = font.unitsPerEm && font.unitsPerEm > 0 ? font.unitsPerEm : 1000;
+    const unitsPerEm =
+      font.unitsPerEm && font.unitsPerEm > 0 ? font.unitsPerEm : 1000;
     const ascent = font.ascent ?? unitsPerEm * 0.8;
     const descent = font.descent ?? -(unitsPerEm * 0.2);
     const metric: FontMetrics = { unitsPerEm, ascent, descent };
@@ -106,16 +115,23 @@ const buildFontMetrics = (document: PdfJsonDocument | null | undefined): FontMet
   return metrics;
 };
 
-export const valueOr = (value: number | null | undefined, fallback = 0): number => {
+export const valueOr = (
+  value: number | null | undefined,
+  fallback = 0,
+): number => {
   if (value === null || value === undefined || Number.isNaN(value)) {
     return fallback;
   }
   return value;
 };
 
-export const cloneTextElement = (element: PdfJsonTextElement): PdfJsonTextElement => ({
+export const cloneTextElement = (
+  element: PdfJsonTextElement,
+): PdfJsonTextElement => ({
   ...element,
-  textMatrix: element.textMatrix ? [...element.textMatrix] : element.textMatrix ?? undefined,
+  textMatrix: element.textMatrix
+    ? [...element.textMatrix]
+    : (element.textMatrix ?? undefined),
 });
 
 const clearGlyphHints = (element: PdfJsonTextElement): void => {
@@ -125,9 +141,13 @@ const clearGlyphHints = (element: PdfJsonTextElement): void => {
   element.charCodes = undefined;
 };
 
-export const cloneImageElement = (element: PdfJsonImageElement): PdfJsonImageElement => ({
+export const cloneImageElement = (
+  element: PdfJsonImageElement,
+): PdfJsonImageElement => ({
   ...element,
-  transform: element.transform ? [...element.transform] : element.transform ?? undefined,
+  transform: element.transform
+    ? [...element.transform]
+    : (element.transform ?? undefined),
 });
 
 const getBaseline = (element: PdfJsonTextElement): number => {
@@ -144,13 +164,16 @@ const getX = (element: PdfJsonTextElement): number => {
   return valueOr(element.x);
 };
 
-const getWidth = (element: PdfJsonTextElement, metrics?: FontMetricsMap): number => {
+const getWidth = (
+  element: PdfJsonTextElement,
+  metrics?: FontMetricsMap,
+): number => {
   const width = valueOr(element.width, 0);
   if (width > 0) {
     return width;
   }
 
-  const text = element.text ?? '';
+  const text = element.text ?? "";
   const glyphCount = Math.max(1, countGraphemes(text));
   const spacingFallback = Math.max(
     valueOr(element.spaceWidth, 0),
@@ -165,12 +188,20 @@ const getWidth = (element: PdfJsonTextElement, metrics?: FontMetricsMap): number
   const fontSize = getFontSize(element);
   const fontMetrics = metricsFor(metrics, element.fontId);
   if (fontMetrics) {
-    const unitsPerEm = fontMetrics.unitsPerEm > 0 ? fontMetrics.unitsPerEm : 1000;
+    const unitsPerEm =
+      fontMetrics.unitsPerEm > 0 ? fontMetrics.unitsPerEm : 1000;
     const ascentUnits = fontMetrics.ascent ?? unitsPerEm * 0.8;
     const descentUnits = Math.abs(fontMetrics.descent ?? -(unitsPerEm * 0.2));
-    const combinedUnits = Math.max(unitsPerEm * 0.8, ascentUnits + descentUnits);
-    const averageAdvanceUnits = Math.max(unitsPerEm * 0.5, combinedUnits / Math.max(1, glyphCount));
-    const fallbackWidth = (averageAdvanceUnits / unitsPerEm) * glyphCount * fontSize;
+    const combinedUnits = Math.max(
+      unitsPerEm * 0.8,
+      ascentUnits + descentUnits,
+    );
+    const averageAdvanceUnits = Math.max(
+      unitsPerEm * 0.5,
+      combinedUnits / Math.max(1, glyphCount),
+    );
+    const fallbackWidth =
+      (averageAdvanceUnits / unitsPerEm) * glyphCount * fontSize;
     if (fallbackWidth > 0) {
       return fallbackWidth;
     }
@@ -179,9 +210,13 @@ const getWidth = (element: PdfJsonTextElement, metrics?: FontMetricsMap): number
   return fontSize * glyphCount * 0.5;
 };
 
-const getFontSize = (element: PdfJsonTextElement): number => valueOr(element.fontMatrixSize ?? element.fontSize, 12);
+const getFontSize = (element: PdfJsonTextElement): number =>
+  valueOr(element.fontMatrixSize ?? element.fontSize, 12);
 
-const getHeight = (element: PdfJsonTextElement, metrics?: FontMetricsMap): number => {
+const getHeight = (
+  element: PdfJsonTextElement,
+  metrics?: FontMetricsMap,
+): number => {
   const height = valueOr(element.height, 0);
   if (height > 0) {
     return height;
@@ -189,7 +224,8 @@ const getHeight = (element: PdfJsonTextElement, metrics?: FontMetricsMap): numbe
   const fontSize = getFontSize(element);
   const fontMetrics = metricsFor(metrics, element.fontId);
   if (fontMetrics) {
-    const unitsPerEm = fontMetrics.unitsPerEm > 0 ? fontMetrics.unitsPerEm : 1000;
+    const unitsPerEm =
+      fontMetrics.unitsPerEm > 0 ? fontMetrics.unitsPerEm : 1000;
     const ascentUnits = fontMetrics.ascent ?? unitsPerEm * 0.8;
     const descentUnits = Math.abs(fontMetrics.descent ?? -(unitsPerEm * 0.2));
     const totalUnits = Math.max(unitsPerEm, ascentUnits + descentUnits);
@@ -213,7 +249,8 @@ const getElementBounds = (
   let descentRatio = 0.2;
   const fontMetrics = metricsFor(metrics, element.fontId);
   if (fontMetrics) {
-    const unitsPerEm = fontMetrics.unitsPerEm > 0 ? fontMetrics.unitsPerEm : 1000;
+    const unitsPerEm =
+      fontMetrics.unitsPerEm > 0 ? fontMetrics.unitsPerEm : 1000;
     const ascentUnits = fontMetrics.ascent ?? unitsPerEm * 0.8;
     const descentUnits = Math.abs(fontMetrics.descent ?? -(unitsPerEm * 0.2));
     const totalUnits = Math.max(unitsPerEm, ascentUnits + descentUnits);
@@ -235,11 +272,23 @@ const getElementBounds = (
 
 export const getImageBounds = (element: PdfJsonImageElement): BoundingBox => {
   const left = valueOr(element.left ?? element.x, 0);
-  const computedWidth = valueOr(element.width, Math.max(valueOr(element.right, left) - left, 0));
-  const right = valueOr(element.right ?? left + computedWidth, left + computedWidth);
+  const computedWidth = valueOr(
+    element.width,
+    Math.max(valueOr(element.right, left) - left, 0),
+  );
+  const right = valueOr(
+    element.right ?? left + computedWidth,
+    left + computedWidth,
+  );
   const bottom = valueOr(element.bottom ?? element.y, 0);
-  const computedHeight = valueOr(element.height, Math.max(valueOr(element.top, bottom) - bottom, 0));
-  const top = valueOr(element.top ?? bottom + computedHeight, bottom + computedHeight);
+  const computedHeight = valueOr(
+    element.height,
+    Math.max(valueOr(element.top, bottom) - bottom, 0),
+  );
+  const top = valueOr(
+    element.top ?? bottom + computedHeight,
+    bottom + computedHeight,
+  );
   return {
     left,
     right,
@@ -283,7 +332,7 @@ const mergeBounds = (bounds: BoundingBox[]): BoundingBox => {
       top: Math.min(acc.top, current.top),
       bottom: Math.max(acc.bottom, current.bottom),
     }),
-    { ...bounds[0] }
+    { ...bounds[0] },
   );
 };
 
@@ -313,18 +362,21 @@ const shouldInsertSpace = (
     return true;
   }
 
-  const prevText = (prev.text ?? '').trimEnd();
-  if (prevText.endsWith('-')) {
+  const prevText = (prev.text ?? "").trimEnd();
+  if (prevText.endsWith("-")) {
     return false;
   }
 
   return false;
 };
 
-const buildGroupText = (elements: PdfJsonTextElement[], metrics?: FontMetricsMap): string => {
-  let result = '';
+const buildGroupText = (
+  elements: PdfJsonTextElement[],
+  metrics?: FontMetricsMap,
+): string => {
+  let result = "";
   elements.forEach((element, index) => {
-    const value = element.text ?? '';
+    const value = element.text ?? "";
     if (index === 0) {
       result += value;
       return;
@@ -335,7 +387,7 @@ const buildGroupText = (elements: PdfJsonTextElement[], metrics?: FontMetricsMap
     const startsWithWhitespace = /^\s/u.test(value);
 
     if (needsSpace && !startsWithWhitespace) {
-      result += ' ';
+      result += " ";
     }
     result += value;
   });
@@ -349,7 +401,7 @@ const rgbToCss = (components: number[]): string => {
     const b = Math.round(Math.max(0, Math.min(1, components[2])) * 255);
     return `rgb(${r}, ${g}, ${b})`;
   }
-  return 'rgb(0, 0, 0)';
+  return "rgb(0, 0, 0)";
 };
 
 const cmykToCss = (components: number[]): string => {
@@ -363,7 +415,7 @@ const cmykToCss = (components: number[]): string => {
     const b = Math.round(255 * (1 - y) * (1 - k));
     return `rgb(${r}, ${g}, ${b})`;
   }
-  return 'rgb(0, 0, 0)';
+  return "rgb(0, 0, 0)";
 };
 
 const grayToCss = (components: number[]): string => {
@@ -371,24 +423,28 @@ const grayToCss = (components: number[]): string => {
     const gray = Math.round(Math.max(0, Math.min(1, components[0])) * 255);
     return `rgb(${gray}, ${gray}, ${gray})`;
   }
-  return 'rgb(0, 0, 0)';
+  return "rgb(0, 0, 0)";
 };
 
 const extractColor = (element: PdfJsonTextElement): string | null => {
   const fillColor = element.fillColor;
-  if (!fillColor || !fillColor.components || fillColor.components.length === 0) {
+  if (
+    !fillColor ||
+    !fillColor.components ||
+    fillColor.components.length === 0
+  ) {
     return null;
   }
 
-  const colorSpace = (fillColor.colorSpace ?? '').toLowerCase();
+  const colorSpace = (fillColor.colorSpace ?? "").toLowerCase();
 
-  if (colorSpace.includes('rgb') || colorSpace.includes('srgb')) {
+  if (colorSpace.includes("rgb") || colorSpace.includes("srgb")) {
     return rgbToCss(fillColor.components);
   }
-  if (colorSpace.includes('cmyk')) {
+  if (colorSpace.includes("cmyk")) {
     return cmykToCss(fillColor.components);
   }
-  if (colorSpace.includes('gray') || colorSpace.includes('grey')) {
+  if (colorSpace.includes("gray") || colorSpace.includes("grey")) {
     return grayToCss(fillColor.components);
   }
 
@@ -432,7 +488,9 @@ const extractElementRotation = (element: PdfJsonTextElement): number | null => {
   return normalizeAngle(angle);
 };
 
-const computeGroupRotation = (elements: PdfJsonTextElement[]): number | null => {
+const computeGroupRotation = (
+  elements: PdfJsonTextElement[],
+): number | null => {
   const angles = elements
     .map(extractElementRotation)
     .filter((angle): angle is number => angle !== null);
@@ -456,7 +514,9 @@ const computeGroupRotation = (elements: PdfJsonTextElement[]): number | null =>
   return Math.abs(normalized) < 0.5 ? null : normalized;
 };
 
-const getAnchorPoint = (element: PdfJsonTextElement): { x: number; y: number } => {
+const getAnchorPoint = (
+  element: PdfJsonTextElement,
+): { x: number; y: number } => {
   if (element.textMatrix && element.textMatrix.length === 6) {
     return {
       x: valueOr(element.textMatrix[4]),
@@ -472,9 +532,12 @@ const getAnchorPoint = (element: PdfJsonTextElement): { x: number; y: number } =
 const computeBaselineLength = (
   elements: PdfJsonTextElement[],
   metrics?: FontMetricsMap,
-): number => elements.reduce((acc, current) => acc + getWidth(current, metrics), 0);
+): number =>
+  elements.reduce((acc, current) => acc + getWidth(current, metrics), 0);
 
-const computeAverageBaseline = (elements: PdfJsonTextElement[]): number | null => {
+const computeAverageBaseline = (
+  elements: PdfJsonTextElement[],
+): number | null => {
   if (elements.length === 0) {
     return null;
   }
@@ -493,7 +556,9 @@ const createGroup = (
 ): TextGroup => {
   const clones = elements.map(cloneTextElement);
   const originalClones = clones.map(cloneTextElement);
-  const bounds = mergeBounds(elements.map((element) => getElementBounds(element, metrics)));
+  const bounds = mergeBounds(
+    elements.map((element) => getElementBounds(element, metrics)),
+  );
   const firstElement = elements[0];
   const rotation = computeGroupRotation(elements);
   const anchor = rotation !== null ? getAnchorPoint(firstElement) : null;
@@ -561,7 +626,8 @@ const groupLinesIntoParagraphs = (
     const prevLeft = prevLine.bounds.left;
     const currentLeft = currentLine.bounds.left;
     const leftAlignmentTolerance = avgFontSize * 0.3;
-    const isLeftAligned = Math.abs(prevLeft - currentLeft) <= leftAlignmentTolerance;
+    const isLeftAligned =
+      Math.abs(prevLeft - currentLeft) <= leftAlignmentTolerance;
 
     // Check if fonts match
     const sameFont = prevLine.fontId === currentLine.fontId;
@@ -580,31 +646,47 @@ const groupLinesIntoParagraphs = (
     const currentWidth = currentRight - currentLeft;
 
     // Count word count to help identify bullets (typically short)
-    const prevWords = (prevLine.text ?? '').split(/\s+/).filter(w => w.length > 0).length;
-    const currentWords = (currentLine.text ?? '').split(/\s+/).filter(w => w.length > 0).length;
-    const prevText = (prevLine.text ?? '').trim();
-    const currentText = (currentLine.text ?? '').trim();
+    const prevWords = (prevLine.text ?? "")
+      .split(/\s+/)
+      .filter((w) => w.length > 0).length;
+    const currentWords = (currentLine.text ?? "")
+      .split(/\s+/)
+      .filter((w) => w.length > 0).length;
+    const prevText = (prevLine.text ?? "").trim();
+    const currentText = (currentLine.text ?? "").trim();
 
     // Bullet detection - look for bullet markers or very short lines
-    const bulletMarkerRegex = /^[\u2022\u2023\u25E6\u2043\u2219•·◦‣�\-*]\s|^\d+[.)]\s|^[a-z][.)]\s/i;
+    const bulletMarkerRegex =
+      /^[\u2022\u2023\u25E6\u2043\u2219•·◦‣�\-*]\s|^\d+[.)]\s|^[a-z][.)]\s/i;
     const prevHasBulletMarker = bulletMarkerRegex.test(prevText);
     const currentHasBulletMarker = bulletMarkerRegex.test(currentText);
 
     // True bullets are:
     // 1. Have bullet markers/numbers OR
     // 2. Very short (< 10 words) AND much narrower than average (< 60% of page width)
-    const headingKeywords = ['action items', 'next steps', 'notes', 'logistics', 'tasks'];
+    const headingKeywords = [
+      "action items",
+      "next steps",
+      "notes",
+      "logistics",
+      "tasks",
+    ];
     const normalizedPageWidth = pageWidth > 0 ? pageWidth : avgFontSize * 70;
-    const maxReferenceWidth = normalizedPageWidth > 0 ? normalizedPageWidth : avgFontSize * 70;
+    const maxReferenceWidth =
+      normalizedPageWidth > 0 ? normalizedPageWidth : avgFontSize * 70;
     const indentDelta = currentLeft - prevLeft;
     const indentThreshold = Math.max(avgFontSize * 0.6, 8);
     const hasIndent = indentDelta > indentThreshold;
-    const currentWidthRatio = maxReferenceWidth > 0 ? currentWidth / maxReferenceWidth : 0;
-    const prevWidthRatio = maxReferenceWidth > 0 ? prevWidth / maxReferenceWidth : 0;
+    const currentWidthRatio =
+      maxReferenceWidth > 0 ? currentWidth / maxReferenceWidth : 0;
+    const prevWidthRatio =
+      maxReferenceWidth > 0 ? prevWidth / maxReferenceWidth : 0;
     const prevLooksLikeHeading =
-      prevText.endsWith(':') ||
+      prevText.endsWith(":") ||
       (prevWords <= 4 && prevWidthRatio < 0.4) ||
-      headingKeywords.some((keyword) => prevText.toLowerCase().includes(keyword));
+      headingKeywords.some((keyword) =>
+        prevText.toLowerCase().includes(keyword),
+      );
 
     const wrapCandidate =
       !currentHasBulletMarker &&
@@ -619,8 +701,13 @@ const groupLinesIntoParagraphs = (
       ? false
       : currentHasBulletMarker ||
         (hasIndent && (currentWords <= 14 || currentWidthRatio <= 0.65)) ||
-        (prevLooksLikeHeading && (currentWords <= 16 || currentWidthRatio <= 0.8 || prevWidthRatio < 0.35)) ||
-        (currentWords <= 8 && currentWidthRatio <= 0.45 && prevWidth - currentWidth > avgFontSize * 4);
+        (prevLooksLikeHeading &&
+          (currentWords <= 16 ||
+            currentWidthRatio <= 0.8 ||
+            prevWidthRatio < 0.35)) ||
+        (currentWords <= 8 &&
+          currentWidthRatio <= 0.45 &&
+          prevWidth - currentWidth > avgFontSize * 4);
 
     const prevIsBullet = bulletFlags.get(prevLine.id) ?? prevHasBulletMarker;
     bulletFlags.set(currentLine.id, currentIsBullet);
@@ -647,10 +734,18 @@ const groupLinesIntoParagraphs = (
 
     if (i < 10 || likelyBulletStart || bothAreBullets || !shouldMerge) {
       console.log(`  Line ${i}:`);
-      console.log(`    prev: "${prevText.substring(0, 40)}" (${prevWords}w, ${prevWidth.toFixed(0)}pt, marker:${prevHasBulletMarker}, bullet:${prevIsBullet})`);
-      console.log(`    curr: "${currentText.substring(0, 40)}" (${currentWords}w, ${currentWidth.toFixed(0)}pt, marker:${currentHasBulletMarker}, bullet:${currentIsBullet})`);
-      console.log(`    checks: leftAlign:${isLeftAligned} (${Math.abs(prevLeft - currentLeft).toFixed(1)}pt), sameFont:${sameFont}, spacing:${hasReasonableSpacing} (${lineSpacing.toFixed(1)}pt/${maxReasonableSpacing.toFixed(1)}pt)`);
-      console.log(`    decision: merge=${shouldMerge} (bulletStart:${likelyBulletStart}, bothBullets:${bothAreBullets})`);
+      console.log(
+        `    prev: "${prevText.substring(0, 40)}" (${prevWords}w, ${prevWidth.toFixed(0)}pt, marker:${prevHasBulletMarker}, bullet:${prevIsBullet})`,
+      );
+      console.log(
+        `    curr: "${currentText.substring(0, 40)}" (${currentWords}w, ${currentWidth.toFixed(0)}pt, marker:${currentHasBulletMarker}, bullet:${currentIsBullet})`,
+      );
+      console.log(
+        `    checks: leftAlign:${isLeftAligned} (${Math.abs(prevLeft - currentLeft).toFixed(1)}pt), sameFont:${sameFont}, spacing:${hasReasonableSpacing} (${lineSpacing.toFixed(1)}pt/${maxReasonableSpacing.toFixed(1)}pt)`,
+      );
+      console.log(
+        `    decision: merge=${shouldMerge} (bulletStart:${likelyBulletStart}, bothBullets:${bothAreBullets})`,
+      );
     }
 
     if (shouldMerge) {
@@ -673,23 +768,29 @@ const groupLinesIntoParagraphs = (
     }
 
     // Combine all elements from all lines
-    const lineTemplates = lines.map(line => cloneLineTemplate(line));
+    const lineTemplates = lines.map((line) => cloneLineTemplate(line));
     const flattenedLineTemplates = lineTemplates.flatMap((line) =>
       line.childLineGroups && line.childLineGroups.length > 0
         ? line.childLineGroups
         : [line],
     );
-    const allLines = flattenedLineTemplates.length > 0 ? flattenedLineTemplates : lineTemplates;
-    const allElements = allLines.flatMap(line => line.originalElements);
+    const allLines =
+      flattenedLineTemplates.length > 0
+        ? flattenedLineTemplates
+        : lineTemplates;
+    const allElements = allLines.flatMap((line) => line.originalElements);
     const pageIndex = lines[0].pageIndex;
-    const lineElementCounts = allLines.map((line) => line.originalElements.length);
+    const lineElementCounts = allLines.map(
+      (line) => line.originalElements.length,
+    );
 
     // Create merged group with newlines between lines
-    const paragraphText = allLines.map(line => line.text).join('\n');
-    const mergedBounds = mergeBounds(allLines.map(line => line.bounds));
+    const paragraphText = allLines.map((line) => line.text).join("\n");
+    const mergedBounds = mergeBounds(allLines.map((line) => line.bounds));
     const spacingValues: number[] = [];
     for (let i = 1; i < allLines.length; i++) {
-      const prevBaseline = allLines[i - 1].baseline ?? allLines[i - 1].bounds.bottom;
+      const prevBaseline =
+        allLines[i - 1].baseline ?? allLines[i - 1].bounds.bottom;
       const currentBaseline = allLines[i].baseline ?? allLines[i].bounds.bottom;
       const spacing = Math.abs(prevBaseline - currentBaseline);
       if (spacing > 0) {
@@ -698,7 +799,8 @@ const groupLinesIntoParagraphs = (
     }
     const averageSpacing =
       spacingValues.length > 0
-        ? spacingValues.reduce((sum, value) => sum + value, 0) / spacingValues.length
+        ? spacingValues.reduce((sum, value) => sum + value, 0) /
+          spacingValues.length
         : null;
 
     const firstElement = allElements[0];
@@ -735,7 +837,7 @@ export const groupPageTextElements = (
   page: PdfJsonPage | null | undefined,
   pageIndex: number,
   metrics?: FontMetricsMap,
-  groupingMode: 'auto' | 'paragraph' | 'singleLine' = 'auto',
+  groupingMode: "auto" | "paragraph" | "singleLine" = "auto",
 ): TextGroup[] => {
   if (!page?.textElements || page.textElements.length === 0) {
     return [];
@@ -756,7 +858,9 @@ export const groupPageTextElements = (
     const fontSize = getFontSize(element);
     const tolerance = Math.max(LINE_TOLERANCE, fontSize * 0.12);
 
-    const existingLine = lines.find((line) => Math.abs(line.baseline - baseline) <= tolerance);
+    const existingLine = lines.find(
+      (line) => Math.abs(line.baseline - baseline) <= tolerance,
+    );
 
     if (existingLine) {
       existingLine.elements.push(element);
@@ -782,7 +886,8 @@ export const groupPageTextElements = (
       }
 
       const previous = currentBucket[currentBucket.length - 1];
-      const gap = getX(element) - (getX(previous) + getWidth(previous, metrics));
+      const gap =
+        getX(element) - (getX(previous) + getWidth(previous, metrics));
       const avgFontSize = (getFontSize(previous) + getFontSize(element)) / 2;
       const splitThreshold = Math.max(SPACE_MIN_GAP, avgFontSize * GAP_FACTOR);
 
@@ -795,7 +900,10 @@ export const groupPageTextElements = (
         const baselineDelta = Math.abs(prevBaseline - currentBaseline);
         const prevEndX = getX(previous) + getWidth(previous, metrics);
         const _prevEndY = prevBaseline;
-        const diagonalGap = Math.hypot(Math.max(0, getX(element) - prevEndX), baselineDelta);
+        const diagonalGap = Math.hypot(
+          Math.max(0, getX(element) - prevEndX),
+          baselineDelta,
+        );
         const diagonalThreshold = Math.max(avgFontSize * 0.8, splitThreshold);
         if (diagonalGap <= diagonalThreshold) {
           shouldSplit = false;
@@ -814,7 +922,9 @@ export const groupPageTextElements = (
       }
 
       if (shouldSplit) {
-        lineGroups.push(createGroup(pageIndex, groupCounter, currentBucket, metrics));
+        lineGroups.push(
+          createGroup(pageIndex, groupCounter, currentBucket, metrics),
+        );
         groupCounter += 1;
         currentBucket = [element];
       } else {
@@ -823,18 +933,20 @@ export const groupPageTextElements = (
     });
 
     if (currentBucket.length > 0) {
-      lineGroups.push(createGroup(pageIndex, groupCounter, currentBucket, metrics));
+      lineGroups.push(
+        createGroup(pageIndex, groupCounter, currentBucket, metrics),
+      );
       groupCounter += 1;
     }
   });
 
   // Apply paragraph grouping based on mode
-  if (groupingMode === 'singleLine') {
+  if (groupingMode === "singleLine") {
     // Single line mode: skip paragraph grouping
     return lineGroups;
   }
 
-  if (groupingMode === 'paragraph') {
+  if (groupingMode === "paragraph") {
     // Paragraph mode: always apply grouping
     return groupLinesIntoParagraphs(lineGroups, pageWidth, metrics);
   }
@@ -852,11 +964,11 @@ export const groupPageTextElements = (
   const fullWidthThreshold = pageWidth * 0.7;
 
   lineGroups.forEach((group) => {
-    const text = (group.text || '').trim();
+    const text = (group.text || "").trim();
     if (text.length === 0) return;
 
     totalGroups++;
-    const lines = text.split('\n');
+    const lines = text.split("\n");
     const lineCount = lines.length;
     const wordCount = text.split(/\s+/).filter((w) => w.length > 0).length;
 
@@ -887,12 +999,14 @@ export const groupPageTextElements = (
   const fullWidthRatio = fullWidthLines / totalGroups;
 
   // Calculate variance in line lengths (paragraphs have varying lengths, lists are uniform)
-  const variance = wordCounts.reduce((sum, count) => {
-    const diff = count - avgWordsPerGroup;
-    return sum + diff * diff;
-  }, 0) / totalGroups;
+  const variance =
+    wordCounts.reduce((sum, count) => {
+      const diff = count - avgWordsPerGroup;
+      return sum + diff * diff;
+    }, 0) / totalGroups;
   const stdDev = Math.sqrt(variance);
-  const coefficientOfVariation = avgWordsPerGroup > 0 ? stdDev / avgWordsPerGroup : 0;
+  const coefficientOfVariation =
+    avgWordsPerGroup > 0 ? stdDev / avgWordsPerGroup : 0;
 
   // Check each criterion
   const criterion1 = avgWordsPerGroup > 5;
@@ -902,38 +1016,59 @@ export const groupPageTextElements = (
   const isParagraphPage = criterion1 && criterion2 && criterion3;
 
   // Log detection stats
-  console.log(`📄 Page ${pageIndex} Grouping Analysis (mode: ${groupingMode}):`);
+  console.log(
+    `📄 Page ${pageIndex} Grouping Analysis (mode: ${groupingMode}):`,
+  );
   console.log(`   Stats:`);
-  console.log(`     • Page width: ${pageWidth.toFixed(1)}pt (full-width threshold: ${fullWidthThreshold.toFixed(1)}pt)`);
+  console.log(
+    `     • Page width: ${pageWidth.toFixed(1)}pt (full-width threshold: ${fullWidthThreshold.toFixed(1)}pt)`,
+  );
   console.log(`     • Multi-line groups: ${multiLineGroups}`);
   console.log(`     • Total groups: ${totalGroups}`);
   console.log(`     • Total words: ${totalWords}`);
-  console.log(`     • Long text groups (≥10 words or ≥50 chars): ${longTextGroups}`);
+  console.log(
+    `     • Long text groups (≥10 words or ≥50 chars): ${longTextGroups}`,
+  );
   console.log(`     • Full-width lines (≥70% page width): ${fullWidthLines}`);
   console.log(`     • Avg words per group: ${avgWordsPerGroup.toFixed(2)}`);
   console.log(`     • Long text ratio: ${(longTextRatio * 100).toFixed(1)}%`);
   console.log(`     • Full-width ratio: ${(fullWidthRatio * 100).toFixed(1)}%`);
   console.log(`     • Std deviation: ${stdDev.toFixed(2)}`);
-  console.log(`     • Coefficient of variation: ${coefficientOfVariation.toFixed(2)}`);
+  console.log(
+    `     • Coefficient of variation: ${coefficientOfVariation.toFixed(2)}`,
+  );
   console.log(`   Criteria:`);
-  console.log(`     1. Avg Words Per Group: ${criterion1 ? '✅ PASS' : '� FAIL'}`);
+  console.log(
+    `     1. Avg Words Per Group: ${criterion1 ? "✅ PASS" : "� FAIL"}`,
+  );
   console.log(`        (${avgWordsPerGroup.toFixed(2)} > 5)`);
-  console.log(`     2. Long Text Ratio: ${criterion2 ? '✅ PASS' : '� FAIL'}`);
+  console.log(`     2. Long Text Ratio: ${criterion2 ? "✅ PASS" : "� FAIL"}`);
   console.log(`        (${(longTextRatio * 100).toFixed(1)}% > 40%)`);
-  console.log(`     3. Line Width Pattern: ${criterion3 ? '✅ PASS' : '� FAIL'}`);
-  console.log(`        (CV ${coefficientOfVariation.toFixed(2)} > 0.5 OR ${(fullWidthRatio * 100).toFixed(1)}% > 60%)`);
-  console.log(`        ${coefficientOfVariation > 0.5 ? '✓ High variance (varying line lengths)' : '✗ Low variance'} ${fullWidthRatio > 0.6 ? '✓ Many full-width lines (paragraph-like)' : '✗ Few full-width lines (list-like)'}`);
-  console.log(`   Decision: ${isParagraphPage ? '� PARAGRAPH MODE' : '📋 LINE MODE'}`);
+  console.log(
+    `     3. Line Width Pattern: ${criterion3 ? "✅ PASS" : "� FAIL"}`,
+  );
+  console.log(
+    `        (CV ${coefficientOfVariation.toFixed(2)} > 0.5 OR ${(fullWidthRatio * 100).toFixed(1)}% > 60%)`,
+  );
+  console.log(
+    `        ${coefficientOfVariation > 0.5 ? "✓ High variance (varying line lengths)" : "✗ Low variance"} ${fullWidthRatio > 0.6 ? "✓ Many full-width lines (paragraph-like)" : "✗ Few full-width lines (list-like)"}`,
+  );
+  console.log(
+    `   Decision: ${isParagraphPage ? "� PARAGRAPH MODE" : "📋 LINE MODE"}`,
+  );
   if (isParagraphPage) {
     console.log(`   Reason: All three criteria passed (AND logic)`);
   } else {
     const failedReasons = [];
-    if (!criterion1) failedReasons.push('low average words per group');
-    if (!criterion2) failedReasons.push('low ratio of long text groups');
-    if (!criterion3) failedReasons.push('low variance and few full-width lines (list-like structure)');
-    console.log(`   Reason: ${failedReasons.join(', ')}`);
+    if (!criterion1) failedReasons.push("low average words per group");
+    if (!criterion2) failedReasons.push("low ratio of long text groups");
+    if (!criterion3)
+      failedReasons.push(
+        "low variance and few full-width lines (list-like structure)",
+      );
+    console.log(`   Reason: ${failedReasons.join(", ")}`);
   }
-  console.log('');
+  console.log("");
 
   // Only apply paragraph grouping if it looks like a paragraph-heavy page
   if (isParagraphPage) {
@@ -948,11 +1083,13 @@ export const groupPageTextElements = (
 
 export const groupDocumentText = (
   document: PdfJsonDocument | null | undefined,
-  groupingMode: 'auto' | 'paragraph' | 'singleLine' = 'auto',
+  groupingMode: "auto" | "paragraph" | "singleLine" = "auto",
 ): TextGroup[][] => {
   const pages = document?.pages ?? [];
   const metrics = buildFontMetrics(document);
-  return pages.map((page, index) => groupPageTextElements(page, index, metrics, groupingMode));
+  return pages.map((page, index) =>
+    groupPageTextElements(page, index, metrics, groupingMode),
+  );
 };
 
 export const extractPageImages = (
@@ -976,14 +1113,18 @@ export const extractDocumentImages = (
   return pages.map((page, index) => extractPageImages(page, index));
 };
 
-export const deepCloneDocument = (document: PdfJsonDocument): PdfJsonDocument => {
-  if (typeof structuredClone === 'function') {
+export const deepCloneDocument = (
+  document: PdfJsonDocument,
+): PdfJsonDocument => {
+  if (typeof structuredClone === "function") {
     return structuredClone(document);
   }
   return JSON.parse(JSON.stringify(document));
 };
 
-export const pageDimensions = (page: PdfJsonPage | null | undefined): { width: number; height: number } => {
+export const pageDimensions = (
+  page: PdfJsonPage | null | undefined,
+): { width: number; height: number } => {
   const width = valueOr(page?.width, DEFAULT_PAGE_WIDTH);
   const height = valueOr(page?.height, DEFAULT_PAGE_HEIGHT);
 
@@ -999,9 +1140,9 @@ export const pageDimensions = (page: PdfJsonPage | null | undefined): { width: n
     DEFAULT_PAGE_WIDTH,
     DEFAULT_PAGE_HEIGHT,
     commonFormats: {
-      'US Letter': '612 × 792 pt',
-      'A4': '595 × 842 pt',
-      'Legal': '612 × 1008 pt',
+      "US Letter": "612 × 792 pt",
+      A4: "595 × 842 pt",
+      Legal: "612 × 1008 pt",
     },
   });
 
@@ -1019,7 +1160,10 @@ export const createMergedElement = (group: TextGroup): PdfJsonTextElement => {
   return merged;
 };
 
-const distributeTextAcrossElements = (text: string | undefined, elements: PdfJsonTextElement[]): boolean => {
+const distributeTextAcrossElements = (
+  text: string | undefined,
+  elements: PdfJsonTextElement[],
+): boolean => {
   if (elements.length === 0) {
     return true;
   }
@@ -1028,14 +1172,14 @@ const distributeTextAcrossElements = (text: string | undefined, elements: PdfJso
   const targetChars = Array.from(normalizedText);
   if (targetChars.length === 0) {
     elements.forEach((element) => {
-      element.text = '';
+      element.text = "";
       clearGlyphHints(element);
     });
     return true;
   }
 
   const capacities = elements.map((element) => {
-    const originalText = element.text ?? '';
+    const originalText = element.text ?? "";
     const graphemeCount = Array.from(originalText).length;
     return graphemeCount > 0 ? graphemeCount : 1;
   });
@@ -1050,25 +1194,33 @@ const distributeTextAcrossElements = (text: string | undefined, elements: PdfJso
       } else {
         const capacity = Math.max(capacities[index], 1);
         const minRemainingForRest = Math.max(elements.length - index - 1, 0);
-        sliceLength = Math.min(capacity, Math.max(remaining - minRemainingForRest, 1));
+        sliceLength = Math.min(
+          capacity,
+          Math.max(remaining - minRemainingForRest, 1),
+        );
       }
     }
 
-    element.text = sliceLength > 0 ? targetChars.slice(cursor, cursor + sliceLength).join('') : '';
+    element.text =
+      sliceLength > 0
+        ? targetChars.slice(cursor, cursor + sliceLength).join("")
+        : "";
     clearGlyphHints(element);
     cursor += sliceLength;
   });
 
   elements.forEach((element) => {
     if (element.text == null) {
-      element.text = '';
+      element.text = "";
     }
   });
 
   return true;
 };
 
-const sliceElementsByLineCounts = (group: TextGroup): PdfJsonTextElement[][] => {
+const sliceElementsByLineCounts = (
+  group: TextGroup,
+): PdfJsonTextElement[][] => {
   const counts = group.lineElementCounts;
   if (!counts || counts.length === 0) {
     if (!group.originalElements.length) {
@@ -1092,8 +1244,10 @@ const sliceElementsByLineCounts = (group: TextGroup): PdfJsonTextElement[][] =>
   return result;
 };
 
-const rebuildParagraphLineElements = (group: TextGroup): PdfJsonTextElement[] | null => {
-  if (!group.text || !group.text.includes('\n')) {
+const rebuildParagraphLineElements = (
+  group: TextGroup,
+): PdfJsonTextElement[] | null => {
+  if (!group.text || !group.text.includes("\n")) {
     return null;
   }
 
@@ -1169,7 +1323,7 @@ const rebuildParagraphLineElements = (group: TextGroup): PdfJsonTextElement[] |
       primary.text = normalizedLine;
       clearGlyphHints(primary);
       for (let i = 1; i < clones.length; i += 1) {
-        clones[i].text = '';
+        clones[i].text = "";
         clearGlyphHints(clones[i]);
       }
     }
@@ -1254,7 +1408,7 @@ export const restoreGlyphElements = (
           return;
         }
         const originalGlyphCount = group.originalElements.reduce(
-          (sum, element) => sum + countGraphemes(element.text ?? ''),
+          (sum, element) => sum + countGraphemes(element.text ?? ""),
           0,
         );
         const normalizedText = sanitizeParagraphText(group.text);
@@ -1266,7 +1420,10 @@ export const restoreGlyphElements = (
         }
 
         const originals = group.originalElements.map(cloneTextElement);
-        const distributed = distributeTextAcrossElements(normalizedText, originals);
+        const distributed = distributeTextAcrossElements(
+          normalizedText,
+          originals,
+        );
         if (distributed) {
           rebuiltElements.push(...originals);
         } else {
@@ -1289,9 +1446,13 @@ export const restoreGlyphElements = (
   return updated;
 };
 
-const approxEqual = (a: number | null | undefined, b: number | null | undefined, tolerance = 0.25): boolean => {
-  const first = typeof a === 'number' && Number.isFinite(a) ? a : 0;
-  const second = typeof b === 'number' && Number.isFinite(b) ? b : 0;
+const approxEqual = (
+  a: number | null | undefined,
+  b: number | null | undefined,
+  tolerance = 0.25,
+): boolean => {
+  const first = typeof a === "number" && Number.isFinite(a) ? a : 0;
+  const second = typeof b === "number" && Number.isFinite(b) ? b : 0;
   return Math.abs(first - second) <= tolerance;
 };
 
@@ -1329,7 +1490,8 @@ const areImageElementsEqual = (
   }
 
   const sameData = (current.imageData ?? null) === (original.imageData ?? null);
-  const sameFormat = (current.imageFormat ?? null) === (original.imageFormat ?? null);
+  const sameFormat =
+    (current.imageFormat ?? null) === (original.imageFormat ?? null);
 
   return (
     sameData &&
diff --git a/frontend/src/core/tools/stamp/createStampTool.tsx b/frontend/src/core/tools/stamp/createStampTool.tsx
index 907bd01597..9e30a87520 100644
--- a/frontend/src/core/tools/stamp/createStampTool.tsx
+++ b/frontend/src/core/tools/stamp/createStampTool.tsx
@@ -1,28 +1,39 @@
-import { useEffect, useCallback, useRef } from 'react';
-import { useTranslation } from 'react-i18next';
-import { createToolFlow } from '@app/components/tools/shared/createToolFlow';
-import SignSettings, { SignatureSource } from '@app/components/tools/sign/SignSettings';
-import { DEFAULT_PARAMETERS, useSignParameters, SignParameters } from '@app/hooks/tools/sign/useSignParameters';
-import { useSignOperation } from '@app/hooks/tools/sign/useSignOperation';
-import { useBaseTool } from '@app/hooks/tools/shared/useBaseTool';
-import { BaseToolProps, ToolComponent } from '@app/types/tool';
-import { ToolId } from '@app/types/toolId';
-import { useNavigation } from '@app/contexts/NavigationContext';
-import { useSignature } from '@app/contexts/SignatureContext';
-import { useFileContext } from '@app/contexts/FileContext';
-import { useViewer } from '@app/contexts/ViewerContext';
-import { flattenSignatures } from '@app/utils/signatureFlattening';
+import { useEffect, useCallback, useRef } from "react";
+import { useTranslation } from "react-i18next";
+import { createToolFlow } from "@app/components/tools/shared/createToolFlow";
+import SignSettings, {
+  SignatureSource,
+} from "@app/components/tools/sign/SignSettings";
+import {
+  DEFAULT_PARAMETERS,
+  useSignParameters,
+  SignParameters,
+} from "@app/hooks/tools/sign/useSignParameters";
+import { useSignOperation } from "@app/hooks/tools/sign/useSignOperation";
+import { useBaseTool } from "@app/hooks/tools/shared/useBaseTool";
+import { BaseToolProps, ToolComponent } from "@app/types/tool";
+import { ToolId } from "@app/types/toolId";
+import { useNavigation } from "@app/contexts/NavigationContext";
+import { useSignature } from "@app/contexts/SignatureContext";
+import { useFileContext } from "@app/contexts/FileContext";
+import { useViewer } from "@app/contexts/ViewerContext";
+import { flattenSignatures } from "@app/utils/signatureFlattening";
 
 export type StampToolConfig = {
   toolId: ToolId;
   translationScope?: string;
   allowedSignatureSources?: SignatureSource[];
   defaultSignatureSource?: SignatureSource;
-  defaultSignatureType?: SignParameters['signatureType'];
+  defaultSignatureType?: SignParameters["signatureType"];
   enableApplyAction?: boolean;
 };
 
-const STAMP_TOOL_DEFAULT_SOURCES: SignatureSource[] = ['canvas', 'image', 'text', 'saved'];
+const STAMP_TOOL_DEFAULT_SOURCES: SignatureSource[] = [
+  "canvas",
+  "image",
+  "text",
+  "saved",
+];
 
 export const createStampTool = (config: StampToolConfig) => {
   const {
@@ -37,10 +48,15 @@ export const createStampTool = (config: StampToolConfig) => {
   const StampTool = (props: BaseToolProps) => {
     const { t } = useTranslation();
     const translateTool = useCallback(
-      (key: string, defaultValue: string) => t(`${translationScope}.${key}`, defaultValue),
-      [t, translationScope]
+      (key: string, defaultValue: string) =>
+        t(`${translationScope}.${key}`, defaultValue),
+      [t, translationScope],
     );
-    const { setWorkbench, setHasUnsavedChanges, unregisterUnsavedChangesChecker } = useNavigation();
+    const {
+      setWorkbench,
+      setHasUnsavedChanges,
+      unregisterUnsavedChangesChecker,
+    } = useNavigation();
     const {
       setSignatureConfig,
       activateDrawMode,
@@ -54,40 +70,54 @@ export const createStampTool = (config: StampToolConfig) => {
       setSignaturesApplied,
     } = useSignature();
     const { consumeFiles, selectors } = useFileContext();
-    const { exportActions, getScrollState, activeFileIndex, setActiveFileIndex } = useViewer();
+    const {
+      exportActions,
+      getScrollState,
+      activeFileIndex,
+      setActiveFileIndex,
+    } = useViewer();
     const base = useBaseTool(
       toolId,
       useSignParameters,
       useSignOperation,
-      props
+      props,
     );
 
     const allowedSignatureTypes = allowedSignatureSources.filter(
-      (source): source is SignParameters['signatureType'] => source !== 'saved'
+      (source): source is SignParameters["signatureType"] => source !== "saved",
     );
     const enforcedSignatureType =
-      defaultSignatureType ?? allowedSignatureTypes[0] ?? DEFAULT_PARAMETERS.signatureType;
+      defaultSignatureType ??
+      allowedSignatureTypes[0] ??
+      DEFAULT_PARAMETERS.signatureType;
 
     useEffect(() => {
-      if (!allowedSignatureTypes.includes(base.params.parameters.signatureType)) {
-        base.params.updateParameter('signatureType', enforcedSignatureType);
+      if (
+        !allowedSignatureTypes.includes(base.params.parameters.signatureType)
+      ) {
+        base.params.updateParameter("signatureType", enforcedSignatureType);
       }
-    }, [allowedSignatureTypes, base.params.parameters.signatureType, base.params.updateParameter, enforcedSignatureType]);
+    }, [
+      allowedSignatureTypes,
+      base.params.parameters.signatureType,
+      base.params.updateParameter,
+      enforcedSignatureType,
+    ]);
 
     const hasOpenedViewer = useRef(false);
-    const activeModeRef = useRef<'draw' | 'placement' | null>(null);
+    const activeModeRef = useRef<"draw" | "placement" | null>(null);
 
     const handleSignaturePlacement = useCallback(() => {
       activateSignaturePlacementMode();
     }, [activateSignaturePlacementMode]);
 
     const handleActivateDrawMode = useCallback(() => {
-      activeModeRef.current = 'draw';
+      activeModeRef.current = "draw";
       activateDrawMode();
     }, [activateDrawMode]);
 
     const handleActivateSignaturePlacement = useCallback(() => {
-      activeModeRef.current = 'placement';
+      activeModeRef.current = "placement";
       handleSignaturePlacement();
     }, [handleSignaturePlacement]);
 
@@ -98,7 +128,7 @@ export const createStampTool = (config: StampToolConfig) => {
 
     useEffect(() => {
       if (base.selectedFiles.length > 0 && !hasOpenedViewer.current) {
-        setWorkbench('viewer');
+        setWorkbench("viewer");
         hasOpenedViewer.current = true;
       }
     }, [base.selectedFiles.length, setWorkbench]);
@@ -113,11 +143,12 @@ export const createStampTool = (config: StampToolConfig) => {
         setHasUnsavedChanges(false);
 
         const allFiles = selectors.getFiles();
-        const fileIndex = activeFileIndex < allFiles.length ? activeFileIndex : 0;
+        const fileIndex =
+          activeFileIndex < allFiles.length ? activeFileIndex : 0;
         const originalFile = allFiles[fileIndex];
 
         if (!originalFile) {
-          console.error('No file available to replace');
+          console.error("No file available to replace");
           return;
         }
 
@@ -135,7 +166,7 @@ export const createStampTool = (config: StampToolConfig) => {
           await consumeFiles(
             flattenResult.inputFileIds,
             [flattenResult.outputStirlingFile],
-            [flattenResult.outputStub]
+            [flattenResult.outputStub],
           );
 
           setActiveFileIndex(0);
@@ -145,18 +176,20 @@ export const createStampTool = (config: StampToolConfig) => {
           const hasSignatureReady = (() => {
             const params = base.params.parameters;
             switch (params.signatureType) {
-              case 'canvas':
-              case 'image':
+              case "canvas":
+              case "image":
                 return Boolean(params.signatureData);
-              case 'text':
-                return Boolean(params.signerName && params.signerName.trim() !== '');
+              case "text":
+                return Boolean(
+                  params.signerName && params.signerName.trim() !== "",
+                );
               default:
                 return false;
             }
           })();
 
           if (hasSignatureReady) {
-            if (typeof window !== 'undefined') {
+            if (typeof window !== "undefined") {
               window.setTimeout(() => {
                 handleActivateSignaturePlacement();
               }, 150);
@@ -165,10 +198,10 @@ export const createStampTool = (config: StampToolConfig) => {
             }
           }
         } else {
-          console.error('Signature flattening failed');
+          console.error("Signature flattening failed");
         }
       } catch (error) {
-        console.error('Error saving signed document:', error);
+        console.error("Error saving signed document:", error);
       }
     }, [
       exportActions,
@@ -195,7 +228,7 @@ export const createStampTool = (config: StampToolConfig) => {
 
       if (base.selectedFiles.length > 0) {
         steps.push({
-          title: translateTool('steps.configure', 'Configure Stamp'),
+          title: translateTool("steps.configure", "Configure Stamp"),
           isCollapsed: false,
           onCollapsedClick: undefined,
           content: (
@@ -230,7 +263,7 @@ export const createStampTool = (config: StampToolConfig) => {
       review: {
         isVisible: false,
         operation: base.operation,
-        title: translateTool('results.title', 'Stamp Results'),
+        title: translateTool("results.title", "Stamp Results"),
         onFileClick: base.handleThumbnailClick,
         onUndo: () => {},
       },
@@ -242,7 +275,8 @@ export const createStampTool = (config: StampToolConfig) => {
   StampToolComponent.tool = () => useSignOperation;
   StampToolComponent.getDefaultParameters = () => ({
     ...DEFAULT_PARAMETERS,
-    signatureType: config.defaultSignatureType ?? DEFAULT_PARAMETERS.signatureType,
+    signatureType:
+      config.defaultSignatureType ?? DEFAULT_PARAMETERS.signatureType,
   });
 
   return StampToolComponent;
diff --git a/frontend/src/core/tsconfig.json b/frontend/src/core/tsconfig.json
index c32398094b..51c970d002 100644
--- a/frontend/src/core/tsconfig.json
+++ b/frontend/src/core/tsconfig.json
@@ -3,16 +3,8 @@
   "compilerOptions": {
     "baseUrl": "../../",
     "paths": {
-      "@app/*": [
-        "src/core/*"
-      ]
+      "@app/*": ["src/core/*"]
     }
   },
-  "include": [
-    "../global.d.ts",
-    "../*.js",
-    "../*.ts",
-    "../*.tsx",
-    "."
-  ]
+  "include": ["../global.d.ts", "../*.js", "../*.ts", "../*.tsx", "."]
 }
diff --git a/frontend/src/core/types/appConfig.ts b/frontend/src/core/types/appConfig.ts
index 536ca0cb7b..e72dc8e448 100644
--- a/frontend/src/core/types/appConfig.ts
+++ b/frontend/src/core/types/appConfig.ts
@@ -6,7 +6,7 @@ export interface AppConfig {
   appNameNavbar?: string;
   languages?: string[];
   defaultLocale?: string;
-  logoStyle?: 'modern' | 'classic';
+  logoStyle?: "modern" | "classic";
   enableLogin?: boolean;
   showSettingsWhenNoLogin?: boolean;
   enableEmailInvites?: boolean;
@@ -60,4 +60,4 @@ export interface AppConfig {
   timestampTsaPresets?: { label: string; url: string }[];
 }
 
-export type AppConfigBootstrapMode = 'blocking' | 'non-blocking';
+export type AppConfigBootstrapMode = "blocking" | "non-blocking";
diff --git a/frontend/src/core/types/automation.ts b/frontend/src/core/types/automation.ts
index 3dc2c41f54..bcb7fe8d2a 100644
--- a/frontend/src/core/types/automation.ts
+++ b/frontend/src/core/types/automation.ts
@@ -25,7 +25,8 @@ export interface AutomationTool {
   parameters?: Record<string, any>;
 }
 
-export type AutomationStep = typeof import('@app/constants/automation').AUTOMATION_STEPS[keyof typeof import('@app/constants/automation').AUTOMATION_STEPS];
+export type AutomationStep =
+  (typeof import("@app/constants/automation").AUTOMATION_STEPS)[keyof typeof import("@app/constants/automation").AUTOMATION_STEPS];
 
 export interface AutomationStepData {
   step: AutomationStep;
@@ -37,7 +38,7 @@ export interface ExecutionStep {
   id: string;
   operation: string;
   name: string;
-  status: 'pending' | 'running' | 'completed' | 'error';
+  status: "pending" | "running" | "completed" | "error";
   error?: string;
 }
 
@@ -52,9 +53,9 @@ export interface AutomateParameters extends AutomationExecutionCallbacks {
 }
 
 export enum AutomationMode {
-  CREATE = 'create',
-  EDIT = 'edit',
-  SUGGESTED = 'suggested'
+  CREATE = "create",
+  EDIT = "edit",
+  SUGGESTED = "suggested",
 }
 
 export interface SuggestedAutomation {
diff --git a/frontend/src/core/types/backendHealth.ts b/frontend/src/core/types/backendHealth.ts
index 18fbad4dbe..ae48efffe3 100644
--- a/frontend/src/core/types/backendHealth.ts
+++ b/frontend/src/core/types/backendHealth.ts
@@ -1,4 +1,4 @@
-export type BackendStatus = 'stopped' | 'starting' | 'healthy' | 'unhealthy';
+export type BackendStatus = "stopped" | "starting" | "healthy" | "unhealthy";
 
 export interface BackendHealthState {
   status: BackendStatus;
diff --git a/frontend/src/core/types/compare.ts b/frontend/src/core/types/compare.ts
index 65b6ea12c9..6746002f6c 100644
--- a/frontend/src/core/types/compare.ts
+++ b/frontend/src/core/types/compare.ts
@@ -1,16 +1,16 @@
-import type { FileId } from '@app/types/file';
-import type { StirlingFile } from '@app/types/fileContext';
+import type { FileId } from "@app/types/file";
+import type { StirlingFile } from "@app/types/fileContext";
 
-export type CompareDiffTokenType = 'unchanged' | 'removed' | 'added';
+export type CompareDiffTokenType = "unchanged" | "removed" | "added";
 
 export interface CompareDiffToken {
   type: CompareDiffTokenType;
   text: string;
 }
 
-export const REMOVAL_HIGHLIGHT = '#FF3B30';
-export const ADDITION_HIGHLIGHT = '#34C759';
-export const PARAGRAPH_SENTINEL = '\uE000¶';
+export const REMOVAL_HIGHLIGHT = "#FF3B30";
+export const ADDITION_HIGHLIGHT = "#34C759";
+export const PARAGRAPH_SENTINEL = "\uE000¶";
 
 export interface TokenBoundingBox {
   left: number;
@@ -65,7 +65,48 @@ export interface CompareChange {
   comparison: CompareChangeSide | null;
 }
 
+export type CompareMode = "text" | "pixel";
+
+export interface ComparePixelPageResult {
+  pageNumber: number;
+  width: number;
+  height: number;
+  baseImageUrl: string;
+  comparisonImageUrl: string;
+  diffImageUrl: string;
+  diffPixels: number;
+  totalPixels: number;
+  diffRatio: number;
+  sizeMismatch: boolean;
+  // One side of the comparison had no corresponding page (the other PDF was shorter).
+  // The missing side is rendered as a blank white canvas and the entire opposite page
+  // is marked as diff.
+  missingBase?: boolean;
+  missingComparison?: boolean;
+}
+
+export interface CompareResultPixelData {
+  mode: "pixel";
+  base: { fileId: string; fileName: string };
+  comparison: { fileId: string; fileName: string };
+  pages: ComparePixelPageResult[];
+  totals: {
+    diffPixels: number;
+    totalPixels: number;
+    diffRatio: number;
+    pagesWithChanges: number;
+    durationMs: number;
+    processedAt: number;
+  };
+  warnings: string[];
+  settings: {
+    dpi: number;
+    threshold: number;
+  };
+}
+
 export interface CompareResultData {
+  mode: "text";
   base: CompareDocumentInfo;
   comparison: CompareDocumentInfo;
   totals: {
@@ -102,7 +143,7 @@ export interface CompareWorkerWarnings {
 }
 
 export interface CompareWorkerRequest {
-  type: 'compare';
+  type: "compare";
   payload: {
     baseTokens: string[];
     comparisonTokens: string[];
@@ -125,11 +166,11 @@ export interface CompareWorkerRequest {
 
 export type CompareWorkerResponse =
   | {
-      type: 'chunk';
+      type: "chunk";
       tokens: CompareDiffToken[];
     }
   | {
-      type: 'success';
+      type: "success";
       stats: {
         baseWordCount: number;
         comparisonWordCount: number;
@@ -137,24 +178,93 @@ export type CompareWorkerResponse =
       };
     }
   | {
-      type: 'warning';
+      type: "warning";
       message: string;
     }
   | {
-      type: 'error';
+      type: "error";
       message: string;
-      code?: 'EMPTY_TEXT' | 'TOO_LARGE' | 'TOO_DISSIMILAR';
+      code?: "EMPTY_TEXT" | "TOO_LARGE" | "TOO_DISSIMILAR";
     };
 
+export interface PixelCompareWorkerWarnings {
+  pageCountMismatch: string; // supports {{base}}, {{comparison}}, {{shared}}
+  noPages: string;
+}
+
+export interface PixelCompareWorkerErrors {
+  canvasContextUnavailable: string;
+}
+
+export type PixelRgb = [number, number, number];
+
+export interface PixelCompareWorkerRequest {
+  type: "pixel-compare";
+  payload: {
+    // File objects (not ArrayBuffers): structured-cloning a File is O(1) since
+    // the underlying blob storage is reference-counted, so we avoid reading
+    // the whole PDF into memory on the main thread before posting.
+    baseFile: File;
+    comparisonFile: File;
+    dpi: number;
+    threshold: number;
+    concurrency?: number;
+    warnings: PixelCompareWorkerWarnings;
+    errors: PixelCompareWorkerErrors;
+    // Colour for pixels removed from the base (content in base, missing in comparison).
+    diffColor: PixelRgb;
+    // Colour for pixels added in the comparison (content in comparison, missing in base).
+    // When null/undefined, pixelmatch falls back to diffColor for all diffs.
+    diffColorAlt?: PixelRgb;
+  };
+}
+
+export interface PixelCompareWorkerPagePayload {
+  pageNumber: number;
+  width: number;
+  height: number;
+  baseBlob: Blob;
+  comparisonBlob: Blob;
+  diffBlob: Blob;
+  diffPixels: number;
+  totalPixels: number;
+  diffRatio: number;
+  sizeMismatch: boolean;
+  missingBase?: boolean;
+  missingComparison?: boolean;
+}
+
+export type PixelCompareWorkerResponse =
+  | { type: "progress"; pageNumber: number; totalPages: number }
+  | { type: "page"; page: PixelCompareWorkerPagePayload }
+  | {
+      type: "success";
+      totals: Omit<CompareResultPixelData["totals"], "processedAt">;
+      warnings: string[];
+    }
+  | { type: "error"; message: string };
+
 export interface CompareDocumentPaneProps {
-  pane: 'base' | 'comparison';
-  layout: 'side-by-side' | 'stacked';
+  pane: "base" | "comparison";
+  layout: "side-by-side" | "stacked";
   scrollRef: React.RefObject<HTMLDivElement | null>;
   peerScrollRef: React.RefObject<HTMLDivElement | null>;
-  handleScrollSync: (source: HTMLDivElement | null, target: HTMLDivElement | null) => void;
-  handleWheelZoom: (pane: 'base' | 'comparison', event: React.WheelEvent<HTMLDivElement>) => void;
-  handleWheelOverscroll: (pane: 'base' | 'comparison', event: React.WheelEvent<HTMLDivElement>) => void;
-  onTouchStart: (pane: 'base' | 'comparison', event: React.TouchEvent<HTMLDivElement>) => void;
+  handleScrollSync: (
+    source: HTMLDivElement | null,
+    target: HTMLDivElement | null,
+  ) => void;
+  handleWheelZoom: (
+    pane: "base" | "comparison",
+    event: React.WheelEvent<HTMLDivElement>,
+  ) => void;
+  handleWheelOverscroll: (
+    pane: "base" | "comparison",
+    event: React.WheelEvent<HTMLDivElement>,
+  ) => void;
+  onTouchStart: (
+    pane: "base" | "comparison",
+    event: React.TouchEvent<HTMLDivElement>,
+  ) => void;
   onTouchMove: (event: React.TouchEvent<HTMLDivElement>) => void;
   onTouchEnd: (event: React.TouchEvent<HTMLDivElement>) => void;
   isPanMode: boolean;
@@ -178,7 +288,10 @@ export interface CompareDocumentPaneProps {
   onPageInputChange?: (next: string) => void;
   maxSharedPages?: number; // min(baseTotal, compTotal)
   renderedPageNumbers?: Set<number>;
-  onVisiblePageChange?: (pane: 'base' | 'comparison', pageNumber: number) => void;
+  onVisiblePageChange?: (
+    pane: "base" | "comparison",
+    pageNumber: number,
+  ) => void;
 }
 
 // Import types that are referenced in CompareDocumentPaneProps
@@ -205,9 +318,9 @@ export interface NavigationDropdownProps {
 }
 
 // Pan/Zoom and Compare Workbench shared types (moved out of hooks for reuse)
-import type React from 'react';
+import type React from "react";
 
-export type ComparePane = 'base' | 'comparison';
+export type ComparePane = "base" | "comparison";
 
 export interface PanState {
   x: number;
@@ -249,8 +362,8 @@ export interface UseComparePanZoomOptions {
 }
 
 export interface UseComparePanZoomReturn {
-  layout: 'side-by-side' | 'stacked';
-  setLayout: (layout: 'side-by-side' | 'stacked') => void;
+  layout: "side-by-side" | "stacked";
+  setLayout: (layout: "side-by-side" | "stacked") => void;
   toggleLayout: () => void;
   baseScrollRef: React.RefObject<HTMLDivElement | null>;
   comparisonScrollRef: React.RefObject<HTMLDivElement | null>;
@@ -269,13 +382,28 @@ export interface UseComparePanZoomReturn {
   setPanToTopLeft: (pane: ComparePane) => void;
   centerPanForZoom: (pane: ComparePane, zoom: number) => void;
   clampPanForZoom: (pane: ComparePane, zoom: number) => void;
-  handleScrollSync: (source: HTMLDivElement | null, target: HTMLDivElement | null) => void;
-  beginPan: (pane: ComparePane, event: React.MouseEvent<HTMLDivElement>) => void;
+  handleScrollSync: (
+    source: HTMLDivElement | null,
+    target: HTMLDivElement | null,
+  ) => void;
+  beginPan: (
+    pane: ComparePane,
+    event: React.MouseEvent<HTMLDivElement>,
+  ) => void;
   continuePan: (event: React.MouseEvent<HTMLDivElement>) => void;
   endPan: () => void;
-  handleWheelZoom: (pane: ComparePane, event: React.WheelEvent<HTMLDivElement>) => void;
-  handleWheelOverscroll: (pane: ComparePane, event: React.WheelEvent<HTMLDivElement>) => void;
-  onTouchStart: (pane: ComparePane, event: React.TouchEvent<HTMLDivElement>) => void;
+  handleWheelZoom: (
+    pane: ComparePane,
+    event: React.WheelEvent<HTMLDivElement>,
+  ) => void;
+  handleWheelOverscroll: (
+    pane: ComparePane,
+    event: React.WheelEvent<HTMLDivElement>,
+  ) => void;
+  onTouchStart: (
+    pane: ComparePane,
+    event: React.TouchEvent<HTMLDivElement>,
+  ) => void;
   onTouchMove: (event: React.TouchEvent<HTMLDivElement>) => void;
   onTouchEnd: () => void;
   zoomLimits: { min: number; max: number; step: number };
@@ -283,7 +411,7 @@ export interface UseComparePanZoomReturn {
 
 export interface PagePreview {
   pageNumber: number;
-  width: number;  
+  width: number;
   height: number;
   rotation: number;
   url: string | null;
@@ -296,8 +424,10 @@ export interface WordHighlightEntry {
 
 // Removed legacy upload section types; upload flow now uses the standard active files workbench
 
+export type CompareAnyResult = CompareResultData | CompareResultPixelData;
+
 export interface CompareWorkbenchData {
-  result: CompareResultData | null;
+  result: CompareAnyResult | null;
   baseFileId: FileId | null;
   comparisonFileId: FileId | null;
   onSelectBase?: (fileId: FileId | null) => void;
@@ -311,4 +441,4 @@ export interface CompareChangeOption {
   value: string;
   label: string;
   pageNumber: number;
-}
\ No newline at end of file
+}
diff --git a/frontend/src/core/types/endpointAvailability.ts b/frontend/src/core/types/endpointAvailability.ts
index aae1a05ec4..de17df6144 100644
--- a/frontend/src/core/types/endpointAvailability.ts
+++ b/frontend/src/core/types/endpointAvailability.ts
@@ -1,4 +1,9 @@
-export type EndpointDisableReason = 'CONFIG' | 'DEPENDENCY' | 'UNKNOWN' | 'NOT_SUPPORTED_LOCALLY' | null;
+export type EndpointDisableReason =
+  | "CONFIG"
+  | "DEPENDENCY"
+  | "UNKNOWN"
+  | "NOT_SUPPORTED_LOCALLY"
+  | null;
 
 export interface EndpointAvailabilityDetails {
   enabled: boolean;
diff --git a/frontend/src/core/types/file.ts b/frontend/src/core/types/file.ts
index 3d6db056f2..8f6178c0b3 100644
--- a/frontend/src/core/types/file.ts
+++ b/frontend/src/core/types/file.ts
@@ -6,7 +6,7 @@
 import { ToolId } from "@app/types/toolId";
 
 declare const tag: unique symbol;
-export type FileId = string & { readonly [tag]: 'FileId' };
+export type FileId = string & { readonly [tag]: "FileId" };
 
 /**
  * Tool operation metadata for history tracking
diff --git a/frontend/src/core/types/fileContext.ts b/frontend/src/core/types/fileContext.ts
index 3f7f824cf6..c65b0485a1 100644
--- a/frontend/src/core/types/fileContext.ts
+++ b/frontend/src/core/types/fileContext.ts
@@ -2,8 +2,8 @@
  * Types for global file context management across views and tools
  */
 
-import { PageOperation } from '@app/types/pageEditor';
-import { FileId, BaseFileMetadata } from '@app/types/file';
+import { PageOperation } from "@app/types/pageEditor";
+import { FileId, BaseFileMetadata } from "@app/types/file";
 
 // Re-export FileId for convenience
 export type { FileId };
@@ -42,14 +42,14 @@ export interface ProcessedFileMetadata {
  * where files persist across tool operations.
  */
 export interface StirlingFileStub extends BaseFileMetadata {
-  quickKey?: string;             // Fast deduplication key: name|size|lastModified
-  thumbnailUrl?: string;         // Generated thumbnail blob URL for visual display
-  blobUrl?: string;             // File access blob URL for downloads/processing
-  localFilePath?: string;        // Original local filesystem path (desktop app only)
+  quickKey?: string; // Fast deduplication key: name|size|lastModified
+  thumbnailUrl?: string; // Generated thumbnail blob URL for visual display
+  blobUrl?: string; // File access blob URL for downloads/processing
+  localFilePath?: string; // Original local filesystem path (desktop app only)
   processedFile?: ProcessedFileMetadata; // PDF page data and processing results
-  insertAfterPageId?: string;   // Page ID after which this file should be inserted
-  isPinned?: boolean;           // Protected from tool consumption (replace/remove)
-  isDirty?: boolean;            // Has unsaved changes (only for files with localFilePath)
+  insertAfterPageId?: string; // Page ID after which this file should be inserted
+  isPinned?: boolean; // Protected from tool consumption (replace/remove)
+  isDirty?: boolean; // Has unsaved changes (only for files with localFilePath)
   // Note: File object stored in provider ref, not in state
 }
 
@@ -61,13 +61,13 @@ export interface FileContextNormalizedFiles {
 // Helper functions - UUID-based primary keys (zero collisions, synchronous)
 export function createFileId(): FileId {
   // Use crypto.randomUUID for authoritative primary key
-  if (typeof window !== 'undefined' && window.crypto?.randomUUID) {
+  if (typeof window !== "undefined" && window.crypto?.randomUUID) {
     return window.crypto.randomUUID() as FileId;
   }
   // Fallback for environments without randomUUID
-  return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function (c) {
-    const r = Math.random() * 16 | 0;
-    const v = c == 'x' ? r : (r & 0x3 | 0x8);
+  return "xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g, function (c) {
+    const r = (Math.random() * 16) | 0;
+    const v = c == "x" ? r : (r & 0x3) | 0x8;
     return v.toString(16);
   }) as FileId;
 }
@@ -86,8 +86,13 @@ export interface StirlingFile extends File {
 
 // Type guard to check if a File object has an embedded fileId
 export function isStirlingFile(file: File | Blob): file is StirlingFile {
-  return file instanceof File && 'fileId' in file && typeof (file as any).fileId === 'string' &&
-    'quickKey' in file && typeof (file as any).quickKey === 'string';
+  return (
+    file instanceof File &&
+    "fileId" in file &&
+    typeof (file as any).fileId === "string" &&
+    "quickKey" in file &&
+    typeof (file as any).quickKey === "string"
+  );
 }
 
 /**
@@ -95,7 +100,9 @@ export function isStirlingFile(file: File | Blob): file is StirlingFile {
  * This ensures that form widgets/values are correctly isolated between files
  * even if they have the same name or are re-scanned.
  */
-export function getFormFillFileId(file: File | Blob | null | undefined): string | null {
+export function getFormFillFileId(
+  file: File | Blob | null | undefined,
+): string | null {
   if (!file) return null;
 
   if (isStirlingFile(file)) {
@@ -131,18 +138,18 @@ export function createStirlingFile(file: File, id?: FileId): StirlingFile {
 
   // Use Object.defineProperty to add properties while preserving the original File object
   // This maintains proper method binding and avoids "Illegal invocation" errors
-  Object.defineProperty(file, 'fileId', {
+  Object.defineProperty(file, "fileId", {
     value: fileId,
     writable: false,
     enumerable: true,
-    configurable: false
+    configurable: false,
   });
 
-  Object.defineProperty(file, 'quickKey', {
+  Object.defineProperty(file, "quickKey", {
     value: quickKey,
     writable: false,
     enumerable: true,
-    configurable: false
+    configurable: false,
   });
 
   return file as StirlingFile;
@@ -150,7 +157,7 @@ export function createStirlingFile(file: File, id?: FileId): StirlingFile {
 
 // Extract FileIds from StirlingFile array
 export function extractFileIds(files: StirlingFile[]): FileId[] {
-  return files.map(file => file.fileId);
+  return files.map((file) => file.fileId);
 }
 
 // Extract regular File objects from StirlingFile array
@@ -160,21 +167,21 @@ export function extractFiles(files: StirlingFile[]): File[] {
 
 // Check if an object is a File or StirlingFile (replaces instanceof File checks)
 export function isFileObject(obj: any): obj is File | StirlingFile {
-  return obj &&
-    typeof obj.name === 'string' &&
-    typeof obj.size === 'number' &&
-    typeof obj.type === 'string' &&
-    typeof obj.lastModified === 'number' &&
-    typeof obj.arrayBuffer === 'function';
+  return (
+    obj &&
+    typeof obj.name === "string" &&
+    typeof obj.size === "number" &&
+    typeof obj.type === "string" &&
+    typeof obj.lastModified === "number" &&
+    typeof obj.arrayBuffer === "function"
+  );
 }
 
-
-
 export function createNewStirlingFileStub(
   file: File,
   id?: FileId,
   thumbnail?: string,
-  processedFileMetadata?: ProcessedFileMetadata
+  processedFileMetadata?: ProcessedFileMetadata,
 ): StirlingFileStub {
   const fileId = id || createFileId();
   return {
@@ -189,34 +196,34 @@ export function createNewStirlingFileStub(
     isLeaf: true, // New files are leaf nodes by default
     versionNumber: 1, // New files start at version 1
     thumbnailUrl: thumbnail,
-    processedFile: processedFileMetadata
+    processedFile: processedFileMetadata,
   };
 }
 
 export function revokeFileResources(record: StirlingFileStub): void {
   // Only revoke blob: URLs to prevent errors on other schemes
-  if (record.thumbnailUrl && record.thumbnailUrl.startsWith('blob:')) {
+  if (record.thumbnailUrl && record.thumbnailUrl.startsWith("blob:")) {
     try {
       URL.revokeObjectURL(record.thumbnailUrl);
     } catch (error) {
-      console.warn('Failed to revoke thumbnail URL:', error);
+      console.warn("Failed to revoke thumbnail URL:", error);
     }
   }
-  if (record.blobUrl && record.blobUrl.startsWith('blob:')) {
+  if (record.blobUrl && record.blobUrl.startsWith("blob:")) {
     try {
       URL.revokeObjectURL(record.blobUrl);
     } catch (error) {
-      console.warn('Failed to revoke blob URL:', error);
+      console.warn("Failed to revoke blob URL:", error);
     }
   }
   // Clean up processed file thumbnails
   if (record.processedFile?.pages) {
-    record.processedFile.pages.forEach(page => {
-      if (page.thumbnail && page.thumbnail.startsWith('blob:')) {
+    record.processedFile.pages.forEach((page) => {
+      if (page.thumbnail && page.thumbnail.startsWith("blob:")) {
         try {
           URL.revokeObjectURL(page.thumbnail);
         } catch (error) {
-          console.warn('Failed to revoke page thumbnail URL:', error);
+          console.warn("Failed to revoke page thumbnail URL:", error);
         }
       }
     });
@@ -226,7 +233,7 @@ export function revokeFileResources(record: StirlingFileStub): void {
 export interface ViewerConfig {
   zoom: number;
   currentPage: number;
-  viewMode: 'single' | 'continuous' | 'facing';
+  viewMode: "single" | "continuous" | "facing";
   sidebarOpen: boolean;
 }
 
@@ -260,35 +267,56 @@ export interface FileContextState {
 // Action types for reducer pattern
 export type FileContextAction =
   // File management actions
-  | { type: 'ADD_FILES'; payload: { stirlingFileStubs: StirlingFileStub[] } }
-  | { type: 'REMOVE_FILES'; payload: { fileIds: FileId[] } }
-  | { type: 'UPDATE_FILE_RECORD'; payload: { id: FileId; updates: Partial<StirlingFileStub> } }
-  | { type: 'REORDER_FILES'; payload: { orderedFileIds: FileId[] } }
+  | { type: "ADD_FILES"; payload: { stirlingFileStubs: StirlingFileStub[] } }
+  | { type: "REMOVE_FILES"; payload: { fileIds: FileId[] } }
+  | {
+      type: "UPDATE_FILE_RECORD";
+      payload: { id: FileId; updates: Partial<StirlingFileStub> };
+    }
+  | { type: "REORDER_FILES"; payload: { orderedFileIds: FileId[] } }
 
   // Pinned files actions
-  | { type: 'PIN_FILE'; payload: { fileId: FileId } }
-  | { type: 'UNPIN_FILE'; payload: { fileId: FileId } }
-  | { type: 'CONSUME_FILES'; payload: { inputFileIds: FileId[]; outputStirlingFileStubs: StirlingFileStub[] } }
-  | { type: 'UNDO_CONSUME_FILES'; payload: { inputStirlingFileStubs: StirlingFileStub[]; outputFileIds: FileId[] } }
+  | { type: "PIN_FILE"; payload: { fileId: FileId } }
+  | { type: "UNPIN_FILE"; payload: { fileId: FileId } }
+  | {
+      type: "CONSUME_FILES";
+      payload: {
+        inputFileIds: FileId[];
+        outputStirlingFileStubs: StirlingFileStub[];
+      };
+    }
+  | {
+      type: "UNDO_CONSUME_FILES";
+      payload: {
+        inputStirlingFileStubs: StirlingFileStub[];
+        outputFileIds: FileId[];
+      };
+    }
 
   // UI actions
-  | { type: 'SET_SELECTED_FILES'; payload: { fileIds: FileId[] } }
-  | { type: 'SET_SELECTED_PAGES'; payload: { pageNumbers: number[] } }
-  | { type: 'CLEAR_SELECTIONS' }
-  | { type: 'SET_PROCESSING'; payload: { isProcessing: boolean; progress: number } }
-  | { type: 'MARK_FILE_ERROR'; payload: { fileId: FileId } }
-  | { type: 'CLEAR_FILE_ERROR'; payload: { fileId: FileId } }
-  | { type: 'CLEAR_ALL_FILE_ERRORS' }
+  | { type: "SET_SELECTED_FILES"; payload: { fileIds: FileId[] } }
+  | { type: "SET_SELECTED_PAGES"; payload: { pageNumbers: number[] } }
+  | { type: "CLEAR_SELECTIONS" }
+  | {
+      type: "SET_PROCESSING";
+      payload: { isProcessing: boolean; progress: number };
+    }
+  | { type: "MARK_FILE_ERROR"; payload: { fileId: FileId } }
+  | { type: "CLEAR_FILE_ERROR"; payload: { fileId: FileId } }
+  | { type: "CLEAR_ALL_FILE_ERRORS" }
 
   // Navigation guard actions (minimal for file-related unsaved changes only)
-  | { type: 'SET_UNSAVED_CHANGES'; payload: { hasChanges: boolean } }
+  | { type: "SET_UNSAVED_CHANGES"; payload: { hasChanges: boolean } }
 
   // Context management
-  | { type: 'RESET_CONTEXT' };
+  | { type: "RESET_CONTEXT" };
 
 export interface FileContextActions {
   // File management - lightweight actions only
-  addFiles: (files: File[], options?: { insertAfterPageId?: string; selectFiles?: boolean }) => Promise<StirlingFile[]>;
+  addFiles: (
+    files: File[],
+    options?: { insertAfterPageId?: string; selectFiles?: boolean },
+  ) => Promise<StirlingFile[]>;
   addFilesWithOptions: (
     files: File[],
     options?: {
@@ -297,13 +325,25 @@ export interface FileContextActions {
       autoUnzip?: boolean;
       autoUnzipFileLimit?: number;
       skipAutoUnzip?: boolean;
-      confirmLargeExtraction?: (fileCount: number, fileName: string) => Promise<boolean>;
+      confirmLargeExtraction?: (
+        fileCount: number,
+        fileName: string,
+      ) => Promise<boolean>;
       allowDuplicates?: boolean;
-    }
+    },
   ) => Promise<StirlingFile[]>;
-  addStirlingFileStubs: (stirlingFileStubs: StirlingFileStub[], options?: { insertAfterPageId?: string; selectFiles?: boolean }) => Promise<StirlingFile[]>;
-  removeFiles: (fileIds: FileId[], deleteFromStorage?: boolean) => Promise<void>;
-  updateStirlingFileStub: (id: FileId, updates: Partial<StirlingFileStub>) => void;
+  addStirlingFileStubs: (
+    stirlingFileStubs: StirlingFileStub[],
+    options?: { insertAfterPageId?: string; selectFiles?: boolean },
+  ) => Promise<StirlingFile[]>;
+  removeFiles: (
+    fileIds: FileId[],
+    deleteFromStorage?: boolean,
+  ) => Promise<void>;
+  updateStirlingFileStub: (
+    id: FileId,
+    updates: Partial<StirlingFileStub>,
+  ) => void;
   reorderFiles: (orderedFileIds: FileId[]) => void;
   clearAllFiles: () => Promise<void>;
   clearAllData: () => Promise<void>;
@@ -313,8 +353,16 @@ export interface FileContextActions {
   unpinFile: (file: StirlingFile) => void;
 
   // File consumption (replace unpinned files with outputs)
-  consumeFiles: (inputFileIds: FileId[], outputStirlingFiles: StirlingFile[], outputStirlingFileStubs: StirlingFileStub[]) => Promise<FileId[]>;
-  undoConsumeFiles: (inputFiles: File[], inputStirlingFileStubs: StirlingFileStub[], outputFileIds: FileId[]) => Promise<void>;
+  consumeFiles: (
+    inputFileIds: FileId[],
+    outputStirlingFiles: StirlingFile[],
+    outputStirlingFileStubs: StirlingFileStub[],
+  ) => Promise<FileId[]>;
+  undoConsumeFiles: (
+    inputFiles: File[],
+    inputStirlingFileStubs: StirlingFileStub[],
+    outputFileIds: FileId[],
+  ) => Promise<void>;
   // Selection management
   setSelectedFiles: (fileIds: FileId[]) => void;
   setSelectedPages: (pageNumbers: number[]) => void;
diff --git a/frontend/src/core/types/fileIdSafety.d.ts b/frontend/src/core/types/fileIdSafety.d.ts
index 0afbc7f931..dc4c77896a 100644
--- a/frontend/src/core/types/fileIdSafety.d.ts
+++ b/frontend/src/core/types/fileIdSafety.d.ts
@@ -2,23 +2,26 @@
  * Type safety declarations to prevent file.name/UUID confusion
  */
 
-import { FileId, StirlingFile } from '@app/types/fileContext';
+import { FileId, StirlingFile } from "@app/types/fileContext";
 
 declare global {
   namespace FileIdSafety {
     // Mark functions that should never accept file.name as parameters
-    type SafeFileIdFunction<T extends (...args: any[]) => any> = T extends (...args: infer P) => infer _R
+    type SafeFileIdFunction<T extends (...args: any[]) => any> = T extends (
+      ...args: infer P
+    ) => infer _R
       ? P extends readonly [string, ...any[]]
         ? never // Reject string parameters in first position for FileId functions
         : T
       : T;
 
     // Mark functions that should only accept StirlingFile, not regular File
-    type StirlingFileOnlyFunction<T extends (...args: any[]) => any> = T extends (...args: infer P) => infer _R
-      ? P extends readonly [File, ...any[]]
-        ? never // Reject File parameters in first position for StirlingFile functions
-        : T
-      : T;
+    type StirlingFileOnlyFunction<T extends (...args: any[]) => any> =
+      T extends (...args: infer P) => infer _R
+        ? P extends readonly [File, ...any[]]
+          ? never // Reject File parameters in first position for StirlingFile functions
+          : T
+        : T;
 
     // Utility type to enforce StirlingFile usage
     type RequireStirlingFile<T> = T extends File ? StirlingFile : T;
@@ -31,12 +34,18 @@ declare global {
 }
 
 // Augment FileContext types to prevent bypassing StirlingFile
-declare module '../contexts/FileContext' {
+declare module "../contexts/FileContext" {
   export interface StrictFileContextActions {
     pinFile: (file: StirlingFile) => void; // Must be StirlingFile
     unpinFile: (file: StirlingFile) => void; // Must be StirlingFile
-    addFiles: (files: File[], options?: { insertAfterPageId?: string }) => Promise<StirlingFile[]>; // Returns StirlingFile
-    consumeFiles: (inputFileIds: FileId[], outputFiles: File[]) => Promise<StirlingFile[]>; // Returns StirlingFile
+    addFiles: (
+      files: File[],
+      options?: { insertAfterPageId?: string },
+    ) => Promise<StirlingFile[]>; // Returns StirlingFile
+    consumeFiles: (
+      inputFileIds: FileId[],
+      outputFiles: File[],
+    ) => Promise<StirlingFile[]>; // Returns StirlingFile
   }
 
   export interface StrictFileContextSelectors {
diff --git a/frontend/src/core/types/getPdfInfo.ts b/frontend/src/core/types/getPdfInfo.ts
index 794d15dca9..46b73c2371 100644
--- a/frontend/src/core/types/getPdfInfo.ts
+++ b/frontend/src/core/types/getPdfInfo.ts
@@ -20,16 +20,16 @@ export interface PdfBasicInfo {
   Compression?: boolean;
   CompressionType?: string;
   Language?: string | null;
-  'Number of pages'?: number;
+  "Number of pages"?: number;
   TotalImages?: number;
   [key: string]: unknown;
 }
 
 /** Document info section */
 export interface PdfDocumentInfo {
-  'PDF version'?: string;
+  "PDF version"?: string;
   Trapped?: string | null;
-  'Page Mode'?: string;
+  "Page Mode"?: string;
   [key: string]: unknown;
 }
 
@@ -43,14 +43,14 @@ export interface PdfEncryption {
 
 /** Permissions section - values are "Allowed" or "Not Allowed" */
 export interface PdfPermissions {
-  'Document Assembly'?: 'Allowed' | 'Not Allowed';
-  'Extracting Content'?: 'Allowed' | 'Not Allowed';
-  'Extracting for accessibility'?: 'Allowed' | 'Not Allowed';
-  'Form Filling'?: 'Allowed' | 'Not Allowed';
-  'Modifying'?: 'Allowed' | 'Not Allowed';
-  'Modifying annotations'?: 'Allowed' | 'Not Allowed';
-  'Printing'?: 'Allowed' | 'Not Allowed';
-  [key: string]: 'Allowed' | 'Not Allowed' | undefined;
+  "Document Assembly"?: "Allowed" | "Not Allowed";
+  "Extracting Content"?: "Allowed" | "Not Allowed";
+  "Extracting for accessibility"?: "Allowed" | "Not Allowed";
+  "Form Filling"?: "Allowed" | "Not Allowed";
+  Modifying?: "Allowed" | "Not Allowed";
+  "Modifying annotations"?: "Allowed" | "Not Allowed";
+  Printing?: "Allowed" | "Not Allowed";
+  [key: string]: "Allowed" | "Not Allowed" | undefined;
 }
 
 /** Compliance section */
@@ -108,13 +108,13 @@ export interface PdfAnnotationsInfo {
 
 /** Size/dimensions info within a page */
 export interface PdfSizeInfo {
-  'Width (px)'?: string;
-  'Height (px)'?: string;
-  'Width (in)'?: string;
-  'Height (in)'?: string;
-  'Width (cm)'?: string;
-  'Height (cm)'?: string;
-  'Standard Page'?: string;
+  "Width (px)"?: string;
+  "Height (px)"?: string;
+  "Width (in)"?: string;
+  "Height (in)"?: string;
+  "Width (cm)"?: string;
+  "Height (cm)"?: string;
+  "Standard Page"?: string;
   [key: string]: unknown;
 }
 
@@ -128,25 +128,25 @@ export interface PdfXObjectCounts {
 
 /** ICC Profile info */
 export interface PdfICCProfile {
-  'ICC Profile Length'?: number;
+  "ICC Profile Length"?: number;
 }
 
 /** Page-level information */
 export interface PdfPageInfo {
   Size?: PdfSizeInfo;
   Rotation?: number;
-  'Page Orientation'?: string;
+  "Page Orientation"?: string;
   MediaBox?: string;
   CropBox?: string;
   BleedBox?: string;
   TrimBox?: string;
   ArtBox?: string;
-  'Text Characters Count'?: number;
+  "Text Characters Count"?: number;
   Annotations?: PdfAnnotationsInfo;
   Images?: PdfImageInfo[];
   Links?: PdfLinkInfo[];
   Fonts?: PdfFontInfo[];
-  'Color Spaces & ICC Profiles'?: PdfICCProfile[];
+  "Color Spaces & ICC Profiles"?: PdfICCProfile[];
   XObjectCounts?: PdfXObjectCounts;
   Multimedia?: Record<string, unknown>[];
 }
@@ -174,8 +174,8 @@ export interface PdfAttachmentInfo {
 
 /** JavaScript info */
 export interface PdfJavaScriptInfo {
-  'JS Name'?: string;
-  'JS Script Length'?: number;
+  "JS Name"?: string;
+  "JS Script Length"?: number;
 }
 
 /** Layer info */
@@ -197,7 +197,7 @@ export interface PdfOtherInfo {
   JavaScript?: PdfJavaScriptInfo[];
   Layers?: PdfLayerInfo[];
   StructureTree?: PdfStructureTreeElement[];
-  'Bookmarks/Outline/TOC'?: PdfTocEntry[];
+  "Bookmarks/Outline/TOC"?: PdfTocEntry[];
   XMPMetadata?: string | null;
 }
 
@@ -253,13 +253,13 @@ export interface PdfInfoBackendData {
   PerPageInfo?: PdfPerPageInfo;
   SummaryData?: PdfSummaryData;
   // Legacy/alternative keys for backwards compatibility
-  'Form Fields'?: PdfFormFields;
-  'Basic Info'?: PdfBasicInfo;
-  'Document Info'?: PdfDocumentInfo;
+  "Form Fields"?: PdfFormFields;
+  "Basic Info"?: PdfBasicInfo;
+  "Document Info"?: PdfDocumentInfo;
   Compliance?: PdfCompliance;
-  'Bookmarks/Outline/TOC'?: PdfTocEntry[];
-  'Table of Contents'?: PdfTocEntry[];
-  'Per Page Info'?: PdfPerPageInfo;
+  "Bookmarks/Outline/TOC"?: PdfTocEntry[];
+  "Table of Contents"?: PdfTocEntry[];
+  "Per Page Info"?: PdfPerPageInfo;
 }
 
 export interface PdfInfoReportEntry {
@@ -278,5 +278,5 @@ export interface PdfInfoReportData {
   entries: PdfInfoReportEntry[];
 }
 
-export const INFO_JSON_FILENAME = 'response.json';
-export const INFO_PDF_FILENAME = 'pdf-information-report.pdf';
+export const INFO_JSON_FILENAME = "response.json";
+export const INFO_PDF_FILENAME = "pdf-information-report.pdf";
diff --git a/frontend/src/core/types/metadata.ts b/frontend/src/core/types/metadata.ts
index 0a8c0a6ddc..1d0b959097 100644
--- a/frontend/src/core/types/metadata.ts
+++ b/frontend/src/core/types/metadata.ts
@@ -1,7 +1,7 @@
 export enum TrappedStatus {
-  TRUE = 'True',
-  FALSE = 'False',
-  UNKNOWN = 'Unknown'
+  TRUE = "True",
+  FALSE = "False",
+  UNKNOWN = "Unknown",
 }
 
 export interface CustomMetadataEntry {
diff --git a/frontend/src/core/types/navigation.ts b/frontend/src/core/types/navigation.ts
index 996cd57920..6b71616beb 100644
--- a/frontend/src/core/types/navigation.ts
+++ b/frontend/src/core/types/navigation.ts
@@ -2,8 +2,8 @@
  * Navigation types for workbench and tool separation
  */
 
-import { WorkbenchType } from '@app/types/workbench';
-import { ToolId } from '@app/types/toolId';
+import { WorkbenchType } from "@app/types/workbench";
+import { ToolId } from "@app/types/toolId";
 
 // Navigation state
 export interface NavigationState {
@@ -11,7 +11,6 @@ export interface NavigationState {
   selectedTool: ToolId | null;
 }
 
-
 // Route parsing result
 export interface ToolRoute {
   workbench: WorkbenchType;
diff --git a/frontend/src/core/types/navigationActions.ts b/frontend/src/core/types/navigationActions.ts
index b2d7a5e896..9025f745ce 100644
--- a/frontend/src/core/types/navigationActions.ts
+++ b/frontend/src/core/types/navigationActions.ts
@@ -2,8 +2,8 @@
  * Navigation action interfaces to break circular dependencies
  */
 
-import { WorkbenchType } from '@app/types/workbench';
-import { ToolId } from '@app/types/toolId';
+import { WorkbenchType } from "@app/types/workbench";
+import { ToolId } from "@app/types/toolId";
 
 export interface NavigationActions {
   setWorkbench: (workbench: WorkbenchType) => void;
@@ -21,4 +21,4 @@ export interface NavigationState {
   hasUnsavedChanges: boolean;
   pendingNavigation: (() => void) | null;
   showNavigationWarning: boolean;
-}
\ No newline at end of file
+}
diff --git a/frontend/src/core/types/pageEditor.ts b/frontend/src/core/types/pageEditor.ts
index 46fcd06e4f..bb87a5eb74 100644
--- a/frontend/src/core/types/pageEditor.ts
+++ b/frontend/src/core/types/pageEditor.ts
@@ -1,7 +1,7 @@
-import { FileId } from '@app/types/file';
+import { FileId } from "@app/types/file";
 
-export type PageSize = 'A4' | 'Letter' | 'Legal' | 'A3' | 'A5';
-export type PageOrientation = 'portrait' | 'landscape';
+export type PageSize = "A4" | "Letter" | "Legal" | "A3" | "A5";
+export type PageOrientation = "portrait" | "landscape";
 
 export interface PageBreakSettings {
   size: PageSize;
@@ -33,10 +33,10 @@ export interface PDFDocument {
 
 export interface PageOperation {
   id: string;
-  type: 'rotate' | 'delete' | 'move' | 'split' | 'insert' | 'reorder';
+  type: "rotate" | "delete" | "move" | "split" | "insert" | "reorder";
   pageIds: string[];
   timestamp: number;
-  status: 'pending' | 'applied' | 'failed';
+  status: "pending" | "applied" | "failed";
   data?: any;
   metadata?: {
     rotation?: number;
@@ -59,7 +59,7 @@ export interface PageEditorFunctions {
   handleRedo: () => void;
   canUndo: boolean;
   canRedo: boolean;
-  handleRotate: (direction: 'left' | 'right') => void;
+  handleRotate: (direction: "left" | "right") => void;
   handleDelete: () => void;
   handleSplit: () => void;
   handleSplitAll: () => void;
diff --git a/frontend/src/core/types/parameters.ts b/frontend/src/core/types/parameters.ts
index 91355cb817..4fbc860bc5 100644
--- a/frontend/src/core/types/parameters.ts
+++ b/frontend/src/core/types/parameters.ts
@@ -3,4 +3,4 @@
 // Base interface that all tool parameters should extend
 // Provides a foundation for adding common properties across all tools
 // Examples of future additions: userId, sessionId, commonFlags, etc.
-export type BaseParameters = object
+export type BaseParameters = object;
diff --git a/frontend/src/core/types/processing.ts b/frontend/src/core/types/processing.ts
index ee2f5be178..a96b9f419e 100644
--- a/frontend/src/core/types/processing.ts
+++ b/frontend/src/core/types/processing.ts
@@ -1,5 +1,11 @@
 export interface ProcessingError {
-  type: 'network' | 'parsing' | 'memory' | 'corruption' | 'timeout' | 'cancelled';
+  type:
+    | "network"
+    | "parsing"
+    | "memory"
+    | "corruption"
+    | "timeout"
+    | "cancelled";
   message: string;
   recoverable: boolean;
   retryCount: number;
@@ -10,7 +16,7 @@ export interface ProcessingError {
 export interface ProcessingState {
   fileKey: string;
   fileName: string;
-  status: 'pending' | 'processing' | 'completed' | 'error' | 'cancelled';
+  status: "pending" | "processing" | "completed" | "error" | "cancelled";
   progress: number; // 0-100
   strategy: ProcessingStrategy;
   error?: ProcessingError;
@@ -60,12 +66,16 @@ export interface CacheStats {
   maxSizeBytes: number;
 }
 
-export type ProcessingStrategy = 'immediate_full' | 'progressive_chunked' | 'metadata_only' | 'priority_pages';
+export type ProcessingStrategy =
+  | "immediate_full"
+  | "progressive_chunked"
+  | "metadata_only"
+  | "priority_pages";
 
 export interface ProcessingConfig {
   strategy: ProcessingStrategy;
   chunkSize: number; // Pages per chunk
-  thumbnailQuality: 'low' | 'medium' | 'high';
+  thumbnailQuality: "low" | "medium" | "high";
   priorityPageCount: number; // Number of priority pages to process first
   useWebWorker: boolean;
   maxRetries: number;
@@ -87,4 +97,4 @@ export interface ProcessingMetrics {
   averageProcessingTime: number;
   cacheHitRate: number;
   memoryUsage: number;
-}
\ No newline at end of file
+}
diff --git a/frontend/src/core/types/proprietaryToolId.ts b/frontend/src/core/types/proprietaryToolId.ts
index 295cd30624..a7335537d5 100644
--- a/frontend/src/core/types/proprietaryToolId.ts
+++ b/frontend/src/core/types/proprietaryToolId.ts
@@ -10,7 +10,12 @@ export const PROPRIETARY_REGULAR_TOOL_IDS = [] as const;
 export const PROPRIETARY_SUPER_TOOL_IDS = [] as const;
 export const PROPRIETARY_LINK_TOOL_IDS = [] as const;
 
-export type ProprietaryRegularToolId = typeof PROPRIETARY_REGULAR_TOOL_IDS[number];
-export type ProprietarySuperToolId = typeof PROPRIETARY_SUPER_TOOL_IDS[number];
-export type ProprietaryLinkToolId = typeof PROPRIETARY_LINK_TOOL_IDS[number];
-export type ProprietaryToolId = ProprietaryRegularToolId | ProprietarySuperToolId | ProprietaryLinkToolId;
+export type ProprietaryRegularToolId =
+  (typeof PROPRIETARY_REGULAR_TOOL_IDS)[number];
+export type ProprietarySuperToolId =
+  (typeof PROPRIETARY_SUPER_TOOL_IDS)[number];
+export type ProprietaryLinkToolId = (typeof PROPRIETARY_LINK_TOOL_IDS)[number];
+export type ProprietaryToolId =
+  | ProprietaryRegularToolId
+  | ProprietarySuperToolId
+  | ProprietaryLinkToolId;
diff --git a/frontend/src/core/types/rightRail.ts b/frontend/src/core/types/rightRail.ts
index 2a14e3bc64..8d36a7a8b5 100644
--- a/frontend/src/core/types/rightRail.ts
+++ b/frontend/src/core/types/rightRail.ts
@@ -1,41 +1,41 @@
-import React from 'react';
+import React from "react";
 
-export type RightRailSection = 'top' | 'middle' | 'bottom';
+export type RightRailSection = "top" | "middle" | "bottom";
 
 export type RightRailAction = () => void;
 
 export interface RightRailRenderContext {
-	id: string;
-	disabled: boolean;
-	allButtonsDisabled: boolean;
-	action?: RightRailAction;
-	triggerAction: () => void;
-	active: boolean;
+  id: string;
+  disabled: boolean;
+  allButtonsDisabled: boolean;
+  action?: RightRailAction;
+  triggerAction: () => void;
+  active: boolean;
 }
 
 export interface RightRailButtonConfig {
-	/** Unique id for the button, also used to bind action callbacks */
-	id: string;
-	/** Icon element to render when using default renderer */
-	icon?: React.ReactNode;
-	/** Tooltip content (can be localized node) */
-	tooltip?: React.ReactNode;
-	/** Optional ARIA label for a11y (separate from visual tooltip) */
-	ariaLabel?: string;
-	/** Optional i18n key carried by config */
-	templateKey?: string;
-	/** Visual grouping lane */
-	section?: RightRailSection;
-	/** Sorting within a section (lower first); ties broken by id */
-	order?: number;
-	/** Initial disabled state */
-	disabled?: boolean;
-	/** Initial visibility */
-	visible?: boolean;
-	/** Optional custom renderer for advanced layouts */
-	render?: (ctx: RightRailRenderContext) => React.ReactNode;
-	/** Optional className applied to wrapper when using default renderer */
-	className?: string;
-	/** Optional active state to highlight the control */
-	active?: boolean;
+  /** Unique id for the button, also used to bind action callbacks */
+  id: string;
+  /** Icon element to render when using default renderer */
+  icon?: React.ReactNode;
+  /** Tooltip content (can be localized node) */
+  tooltip?: React.ReactNode;
+  /** Optional ARIA label for a11y (separate from visual tooltip) */
+  ariaLabel?: string;
+  /** Optional i18n key carried by config */
+  templateKey?: string;
+  /** Visual grouping lane */
+  section?: RightRailSection;
+  /** Sorting within a section (lower first); ties broken by id */
+  order?: number;
+  /** Initial disabled state */
+  disabled?: boolean;
+  /** Initial visibility */
+  visible?: boolean;
+  /** Optional custom renderer for advanced layouts */
+  render?: (ctx: RightRailRenderContext) => React.ReactNode;
+  /** Optional className applied to wrapper when using default renderer */
+  className?: string;
+  /** Optional active state to highlight the control */
+  active?: boolean;
 }
diff --git a/frontend/src/core/types/sidebar.ts b/frontend/src/core/types/sidebar.ts
index ba6a8683eb..98a7fae9a3 100644
--- a/frontend/src/core/types/sidebar.ts
+++ b/frontend/src/core/types/sidebar.ts
@@ -1,6 +1,6 @@
 export interface SidebarState {
   sidebarsVisible: boolean;
-  leftPanelView: 'toolPicker' | 'toolContent';
+  leftPanelView: "toolPicker" | "toolContent";
   readerMode: boolean;
 }
 
@@ -21,7 +21,9 @@ export interface SidebarContextValue {
   sidebarState: SidebarState;
   sidebarRefs: SidebarRefs;
   setSidebarsVisible: React.Dispatch<React.SetStateAction<boolean>>;
-  setLeftPanelView: React.Dispatch<React.SetStateAction<'toolPicker' | 'toolContent'>>;
+  setLeftPanelView: React.Dispatch<
+    React.SetStateAction<"toolPicker" | "toolContent">
+  >;
   setReaderMode: React.Dispatch<React.SetStateAction<boolean>>;
 }
 
@@ -34,7 +36,7 @@ export interface ButtonConfig {
   name: string;
   icon: React.ReactNode;
   isRound?: boolean;
-  size?: 'sm' | 'md' | 'lg' | 'xl';
+  size?: "sm" | "md" | "lg" | "xl";
   onClick: () => void;
-  type?: 'navigation' | 'modal' | 'action';
+  type?: "navigation" | "modal" | "action";
 }
diff --git a/frontend/src/core/types/signature.ts b/frontend/src/core/types/signature.ts
index 31f19510ba..089c5d66a1 100644
--- a/frontend/src/core/types/signature.ts
+++ b/frontend/src/core/types/signature.ts
@@ -1,17 +1,17 @@
-export type SavedSignatureType = 'canvas' | 'image' | 'text';
-export type SignatureScope = 'personal' | 'shared' | 'localStorage';
+export type SavedSignatureType = "canvas" | "image" | "text";
+export type SignatureScope = "personal" | "shared" | "localStorage";
 
 export type SavedSignaturePayload =
   | {
-      type: 'canvas';
+      type: "canvas";
       dataUrl: string;
     }
   | {
-      type: 'image';
+      type: "image";
       dataUrl: string;
     }
   | {
-      type: 'text';
+      type: "text";
       dataUrl: string;
       signerName: string;
       fontFamily: string;
diff --git a/frontend/src/core/types/signingSession.ts b/frontend/src/core/types/signingSession.ts
index 5ff527cc54..f2e4e83d1e 100644
--- a/frontend/src/core/types/signingSession.ts
+++ b/frontend/src/core/types/signingSession.ts
@@ -1,5 +1,5 @@
 export interface WetSignatureMetadata {
-  type: 'canvas' | 'image' | 'text';
+  type: "canvas" | "image" | "text";
   data: string; // Base64-encoded image data or text content
   page: number; // Zero-indexed page number
   x: number; // X coordinate in PDF points
@@ -34,7 +34,7 @@ export interface ParticipantInfo {
   userId: number;
   email: string;
   name: string;
-  status: 'PENDING' | 'NOTIFIED' | 'VIEWED' | 'SIGNED' | 'DECLINED';
+  status: "PENDING" | "NOTIFIED" | "VIEWED" | "SIGNED" | "DECLINED";
   lastUpdated: string;
   // Signature appearance settings (owner-controlled)
   showSignature?: boolean;
@@ -60,7 +60,7 @@ export interface SignRequestSummary {
   ownerUsername: string;
   createdAt: string;
   dueDate: string;
-  myStatus: 'PENDING' | 'NOTIFIED' | 'VIEWED' | 'SIGNED' | 'DECLINED';
+  myStatus: "PENDING" | "NOTIFIED" | "VIEWED" | "SIGNED" | "DECLINED";
 }
 
 export interface SignRequestDetail {
@@ -70,7 +70,7 @@ export interface SignRequestDetail {
   message: string;
   dueDate: string;
   createdAt: string;
-  myStatus: 'PENDING' | 'NOTIFIED' | 'VIEWED' | 'SIGNED' | 'DECLINED';
+  myStatus: "PENDING" | "NOTIFIED" | "VIEWED" | "SIGNED" | "DECLINED";
   // Signature appearance settings (read-only, configured by owner)
   showSignature?: boolean;
   pageNumber?: number;
diff --git a/frontend/src/core/types/tips.ts b/frontend/src/core/types/tips.ts
index 5bcd767d7a..396cbda21b 100644
--- a/frontend/src/core/types/tips.ts
+++ b/frontend/src/core/types/tips.ts
@@ -12,4 +12,4 @@ export interface TooltipContent {
   };
   tips?: TooltipTip[];
   content?: React.ReactNode;
-} 
\ No newline at end of file
+}
diff --git a/frontend/src/core/types/tool.ts b/frontend/src/core/types/tool.ts
index ff14056d3e..7a51d2c46a 100644
--- a/frontend/src/core/types/tool.ts
+++ b/frontend/src/core/types/tool.ts
@@ -1,10 +1,16 @@
-import React from 'react';
-import { ToolOperationHook } from '@app/hooks/tools/shared/toolOperationTypes';
+import React from "react";
+import { ToolOperationHook } from "@app/hooks/tools/shared/toolOperationTypes";
 
 export type MaxFiles = number; // 1=single, >1=limited, -1=unlimited
-export type ToolCategory = 'manipulation' | 'conversion' | 'analysis' | 'utility' | 'optimization' | 'security';
-export type ToolDefinition = Omit<Tool, 'name'>;
-export type ToolStepType = 'files' | 'settings' | 'results';
+export type ToolCategory =
+  | "manipulation"
+  | "conversion"
+  | "analysis"
+  | "utility"
+  | "optimization"
+  | "security";
+export type ToolDefinition = Omit<Tool, "name">;
+export type ToolStepType = "files" | "settings" | "results";
 
 export interface BaseToolProps {
   onComplete?: (results: File[]) => void;
@@ -33,7 +39,8 @@ export interface AutomationCapableTool {
 /**
  * Type for tool components that can be used in automation
  */
-export type ToolComponent = React.ComponentType<BaseToolProps> & AutomationCapableTool;
+export type ToolComponent = React.ComponentType<BaseToolProps> &
+  AutomationCapableTool;
 
 export interface ToolStepConfig {
   type: ToolStepType;
@@ -77,4 +84,3 @@ export interface Tool {
 }
 
 export type ToolRegistry = Record<string, Tool>;
-
diff --git a/frontend/src/core/types/toolId.ts b/frontend/src/core/types/toolId.ts
index bf94e962aa..34e542cfd6 100644
--- a/frontend/src/core/types/toolId.ts
+++ b/frontend/src/core/types/toolId.ts
@@ -2,76 +2,71 @@ import {
   PROPRIETARY_REGULAR_TOOL_IDS,
   PROPRIETARY_SUPER_TOOL_IDS,
   PROPRIETARY_LINK_TOOL_IDS,
-} from '@app/types/proprietaryToolId';
+} from "@app/types/proprietaryToolId";
 
-export type ToolKind = 'regular' | 'super' | 'link';
+export type ToolKind = "regular" | "super" | "link";
 
 export const CORE_REGULAR_TOOL_IDS = [
-  'certSign',
-  'sign',
-  'addText',
-  'addPassword',
-  'removePassword',
-  'removePages',
-  'removeBlanks',
-  'removeAnnotations',
-  'removeImage',
-  'changePermissions',
-  'watermark',
-  'sanitize',
-  'split',
-  'merge',
-  'convert',
-  'ocr',
-  'addImage',
-  'rotate',
-  'annotate',
-  'scannerImageSplit',
-  'editTableOfContents',
-  'scannerEffect',
-  'autoRename',
-  'pageLayout',
-  'scalePages',
-  'adjustContrast',
-  'crop',
-  'pdfToSinglePage',
-  'repair',
-  'compare',
-  'addPageNumbers',
-  'redact',
-  'flatten',
-  'removeCertSign',
-  'unlockPDFForms',
-  'compress',
-  'extractPages',
-  'reorganizePages',
-  'extractImages',
-  'addStamp',
-  'addAttachments',
-  'changeMetadata',
-  'overlayPdfs',
-  'getPdfInfo',
-  'validateSignature',
-  'timestampPdf',
-  'replaceColor',
-  'showJS',
-  'bookletImposition',
-  'pdfTextEditor',
-  'formFill',
-  'aiFormFill',
+  "certSign",
+  "sign",
+  "addText",
+  "addPassword",
+  "removePassword",
+  "removePages",
+  "removeBlanks",
+  "removeAnnotations",
+  "removeImage",
+  "changePermissions",
+  "watermark",
+  "sanitize",
+  "split",
+  "merge",
+  "convert",
+  "ocr",
+  "addImage",
+  "rotate",
+  "annotate",
+  "scannerImageSplit",
+  "editTableOfContents",
+  "scannerEffect",
+  "autoRename",
+  "pageLayout",
+  "scalePages",
+  "adjustContrast",
+  "crop",
+  "pdfToSinglePage",
+  "repair",
+  "compare",
+  "addPageNumbers",
+  "redact",
+  "flatten",
+  "removeCertSign",
+  "unlockPDFForms",
+  "compress",
+  "extractPages",
+  "reorganizePages",
+  "extractImages",
+  "addStamp",
+  "addAttachments",
+  "changeMetadata",
+  "overlayPdfs",
+  "getPdfInfo",
+  "validateSignature",
+  "timestampPdf",
+  "replaceColor",
+  "showJS",
+  "bookletImposition",
+  "pdfTextEditor",
+  "formFill",
 ] as const;
 
-export const CORE_SUPER_TOOL_IDS = [
-  'multiTool',
-  'read',
-  'automate',
-] as const;
+export const CORE_SUPER_TOOL_IDS = ["multiTool", "read", "automate"] as const;
 
 export const CORE_LINK_TOOL_IDS = [
-  'devApi',
-  'devFolderScanning',
-  'devSsoGuide',
-  'devAirgapped',
+  "devApi",
+  "devFolderScanning",
+  "devSsoGuide",
+  "devAirgapped",
 ] as const;
 
 export const REGULAR_TOOL_IDS = [
@@ -96,23 +91,22 @@ export const TOOL_IDS = [
 ];
 
 // Tool identity - what PDF operation we're performing (type-safe)
-export type ToolId = typeof TOOL_IDS[number];
+export type ToolId = (typeof TOOL_IDS)[number];
 export const isValidToolId = (value: string): value is ToolId =>
   TOOL_IDS.includes(value as ToolId);
 
-export type RegularToolId = typeof REGULAR_TOOL_IDS[number];
+export type RegularToolId = (typeof REGULAR_TOOL_IDS)[number];
 export const isRegularToolId = (toolId: ToolId): toolId is RegularToolId =>
   REGULAR_TOOL_IDS.includes(toolId as RegularToolId);
 
-export type SuperToolId = typeof SUPER_TOOL_IDS[number];
+export type SuperToolId = (typeof SUPER_TOOL_IDS)[number];
 export const isSuperToolId = (toolId: ToolId): toolId is SuperToolId =>
   SUPER_TOOL_IDS.includes(toolId as SuperToolId);
 
-export type LinkToolId = typeof LINK_TOOL_IDS[number];
+export type LinkToolId = (typeof LINK_TOOL_IDS)[number];
 export const isLinkToolId = (toolId: ToolId): toolId is LinkToolId =>
   LINK_TOOL_IDS.includes(toolId as LinkToolId);
 
-
 type Assert<A extends true> = A;
 type Disjoint<A, B> = [A & B] extends [never] ? true : false;
 
diff --git a/frontend/src/core/types/types.ts b/frontend/src/core/types/types.ts
index 2ddd9479aa..fd37a20d60 100644
--- a/frontend/src/core/types/types.ts
+++ b/frontend/src/core/types/types.ts
@@ -1,11 +1,11 @@
-import { ReactNode } from 'react';
+import { ReactNode } from "react";
 
 export interface AnimatedCircleConfig {
   size: number;
   color: string;
   opacity?: number;
   blur?: number;
-  position: 'bottom-left' | 'top-right';
+  position: "bottom-left" | "top-right";
   amplitude?: number;
   duration?: number;
   delay?: number;
diff --git a/frontend/src/core/types/workbench.ts b/frontend/src/core/types/workbench.ts
index d34f942eac..adbc56d7ed 100644
--- a/frontend/src/core/types/workbench.ts
+++ b/frontend/src/core/types/workbench.ts
@@ -1,21 +1,27 @@
 // Define workbench values once as source of truth
-export const BASE_WORKBENCH_TYPES = ['viewer', 'pageEditor', 'fileEditor'] as const;
+export const BASE_WORKBENCH_TYPES = [
+  "viewer",
+  "pageEditor",
+  "fileEditor",
+] as const;
 
-export type BaseWorkbenchType = typeof BASE_WORKBENCH_TYPES[number];
+export type BaseWorkbenchType = (typeof BASE_WORKBENCH_TYPES)[number];
 
 // Workbench types including custom views
 export type WorkbenchType = BaseWorkbenchType | `custom:${string}`;
 
-export const getDefaultWorkbench = (): WorkbenchType => 'viewer';
+export const getDefaultWorkbench = (): WorkbenchType => "viewer";
 
 // Type guard using the same source of truth
 export const isValidWorkbench = (value: string): value is WorkbenchType => {
   if (BASE_WORKBENCH_TYPES.includes(value as BaseWorkbenchType)) {
     return true;
   }
-  return value.startsWith('custom:');
+  return value.startsWith("custom:");
 };
 
-export const isBaseWorkbench = (value: WorkbenchType): value is BaseWorkbenchType => {
+export const isBaseWorkbench = (
+  value: WorkbenchType,
+): value is BaseWorkbenchType => {
   return BASE_WORKBENCH_TYPES.includes(value as BaseWorkbenchType);
 };
diff --git a/frontend/src/core/utils/automationConverter.ts b/frontend/src/core/utils/automationConverter.ts
index b35546f333..346759ae17 100644
--- a/frontend/src/core/utils/automationConverter.ts
+++ b/frontend/src/core/utils/automationConverter.ts
@@ -2,10 +2,10 @@
  * Utility functions for converting between automation formats
  */
 
-import { AutomationConfig } from '@app/types/automation';
-import { ToolRegistry } from '@app/data/toolsTaxonomy';
-import { downloadFile } from '@app/services/downloadService';
-import { ToolId } from '@app/types/toolId';
+import { AutomationConfig } from "@app/types/automation";
+import { ToolRegistry } from "@app/data/toolsTaxonomy";
+import { downloadFile } from "@app/services/downloadService";
+import { ToolId } from "@app/types/toolId";
 
 /**
  * Pipeline configuration format used by folder scanning
@@ -32,11 +32,11 @@ interface FolderScanningPipeline {
  */
 export function convertToFolderScanningConfig(
   automation: AutomationConfig,
-  toolRegistry: Partial<ToolRegistry>
+  toolRegistry: Partial<ToolRegistry>,
 ): FolderScanningPipeline {
   return {
     name: automation.name,
-    pipeline: automation.operations.map(op => {
+    pipeline: automation.operations.map((op) => {
       // Map operationType to full API endpoint path
       const toolId = op.operation as ToolId;
       const toolEntry = toolRegistry[toolId];
@@ -44,17 +44,17 @@ export function convertToFolderScanningConfig(
 
       let endpoint: string | undefined;
 
-      if (typeof endpointConfig === 'string') {
+      if (typeof endpointConfig === "string") {
         endpoint = endpointConfig;
-      } else if (typeof endpointConfig === 'function') {
+      } else if (typeof endpointConfig === "function") {
         // For dynamic endpoints, call with the saved parameters
         try {
           endpoint = endpointConfig(op.parameters);
         } catch (error) {
           console.warn(
             `Failed to resolve dynamic endpoint for operation "${op.operation}". ` +
-            `This may happen if the tool requires specific parameters. ` +
-            `Error: ${error}`
+              `This may happen if the tool requires specific parameters. ` +
+              `Error: ${error}`,
           );
         }
       }
@@ -62,8 +62,8 @@ export function convertToFolderScanningConfig(
       if (!endpoint) {
         console.warn(
           `No endpoint found for operation "${op.operation}". ` +
-          `This operation may fail in folder scanning. ` +
-          `Using operation type as fallback.`
+            `This operation may fail in folder scanning. ` +
+            `Using operation type as fallback.`,
         );
       }
 
@@ -71,16 +71,16 @@ export function convertToFolderScanningConfig(
         operation: endpoint || op.operation,
         parameters: {
           ...op.parameters,
-          fileInput: "automated"
-        }
+          fileInput: "automated",
+        },
       };
     }),
     _examples: {
       outputDir: "{outputFolder}/{folderName}",
-      outputFileName: "{filename}-{pipelineName}-{date}-{time}"
+      outputFileName: "{filename}-{pipelineName}-{date}-{time}",
     },
     outputDir: "{outputFolder}",
-    outputFileName: "{filename}"
+    outputFileName: "{filename}",
   };
 }
 
@@ -91,10 +91,10 @@ export function convertToFolderScanningConfig(
  */
 export function downloadFolderScanningConfig(
   automation: AutomationConfig,
-  toolRegistry: Partial<ToolRegistry>
+  toolRegistry: Partial<ToolRegistry>,
 ): void {
   const config = convertToFolderScanningConfig(automation, toolRegistry);
   const json = JSON.stringify(config, null, 2);
-  const blob = new Blob([json], { type: 'application/json' });
+  const blob = new Blob([json], { type: "application/json" });
   void downloadFile({ data: blob, filename: `${automation.name}.json` });
 }
diff --git a/frontend/src/core/utils/automationExecutor.ts b/frontend/src/core/utils/automationExecutor.ts
index 24679bdb71..806674568d 100644
--- a/frontend/src/core/utils/automationExecutor.ts
+++ b/frontend/src/core/utils/automationExecutor.ts
@@ -1,10 +1,10 @@
-import apiClient from '@app/services/apiClient';
-import { ToolRegistry } from '@app/data/toolsTaxonomy';
-import { ToolId } from '@app/types/toolId';
-import { AUTOMATION_CONSTANTS } from '@app/constants/automation';
-import { AutomationFileProcessor } from '@app/utils/automationFileProcessor';
-import { ToolType } from '@app/hooks/tools/shared/useToolOperation';
-import { processResponse } from '@app/utils/toolResponseProcessor';
+import apiClient from "@app/services/apiClient";
+import { ToolRegistry } from "@app/data/toolsTaxonomy";
+import { ToolId } from "@app/types/toolId";
+import { AUTOMATION_CONSTANTS } from "@app/constants/automation";
+import { AutomationFileProcessor } from "@app/utils/automationFileProcessor";
+import { ToolType } from "@app/hooks/tools/shared/useToolOperation";
+import { processResponse } from "@app/utils/toolResponseProcessor";
 
 /**
  * Process multi-file tool response (handles ZIP or single PDF responses)
@@ -14,35 +14,41 @@ const processMultiFileResponse = async (
   responseHeaders: any,
   files: File[],
   filePrefix: string,
-  preserveBackendFilename?: boolean
+  preserveBackendFilename?: boolean,
 ): Promise<File[]> => {
   // Multi-file responses are typically ZIP files, but may be single files (e.g. split with merge=true)
-  if (responseData.type === 'application/pdf' ||
-      (responseHeaders && responseHeaders['content-type'] === 'application/pdf')) {
+  if (
+    responseData.type === "application/pdf" ||
+    (responseHeaders && responseHeaders["content-type"] === "application/pdf")
+  ) {
     // Single PDF response - use processResponse to respect preserveBackendFilename
     const processedFiles = await processResponse(
       responseData,
       files,
       filePrefix,
       undefined,
-      preserveBackendFilename ? responseHeaders : undefined
+      preserveBackendFilename ? responseHeaders : undefined,
     );
     return processedFiles;
   } else {
     // ZIP response
-    const result = await AutomationFileProcessor.extractAutomationZipFiles(responseData);
+    const result =
+      await AutomationFileProcessor.extractAutomationZipFiles(responseData);
 
     if (result.errors.length > 0) {
       console.warn(`⚠� File processing warnings:`, result.errors);
     }
 
     // Apply prefix to files, replacing any existing prefix
-    const processedFiles = filePrefix && !preserveBackendFilename
-      ? result.files.map(file => {
-          const nameWithoutPrefix = file.name.replace(/^[^_]*_/, '');
-          return new File([file], `${filePrefix}${nameWithoutPrefix}`, { type: file.type });
-        })
-      : result.files;
+    const processedFiles =
+      filePrefix && !preserveBackendFilename
+        ? result.files.map((file) => {
+            const nameWithoutPrefix = file.name.replace(/^[^_]*_/, "");
+            return new File([file], `${filePrefix}${nameWithoutPrefix}`, {
+              type: file.type,
+            });
+          })
+        : result.files;
 
     return processedFiles;
   }
@@ -56,11 +62,11 @@ const executeApiRequest = async (
   formData: FormData,
   files: File[],
   filePrefix: string,
-  preserveBackendFilename?: boolean
+  preserveBackendFilename?: boolean,
 ): Promise<File[]> => {
   const response = await apiClient.post(endpoint, formData, {
-    responseType: 'blob',
-    timeout: AUTOMATION_CONSTANTS.OPERATION_TIMEOUT
+    responseType: "blob",
+    timeout: AUTOMATION_CONSTANTS.OPERATION_TIMEOUT,
   });
 
   return await processMultiFileResponse(
@@ -68,7 +74,7 @@ const executeApiRequest = async (
     response.headers,
     files,
     filePrefix,
-    preserveBackendFilename
+    preserveBackendFilename,
   );
 };
 
@@ -79,23 +85,26 @@ const executeSingleFileOperation = async (
   config: any,
   parameters: any,
   files: File[],
-  filePrefix: string
+  filePrefix: string,
 ): Promise<File[]> => {
   const resultFiles: File[] = [];
 
   for (const file of files) {
-    const endpoint = typeof config.endpoint === 'function'
-      ? config.endpoint(parameters)
-      : config.endpoint;
+    const endpoint =
+      typeof config.endpoint === "function"
+        ? config.endpoint(parameters)
+        : config.endpoint;
 
-    const formData = (config.buildFormData as (params: any, file: File) => FormData)(parameters, file);
+    const formData = (
+      config.buildFormData as (params: any, file: File) => FormData
+    )(parameters, file);
 
     const processedFiles = await executeApiRequest(
       endpoint,
       formData,
       [file],
       filePrefix,
-      config.preserveBackendFilename
+      config.preserveBackendFilename,
     );
     resultFiles.push(...processedFiles);
   }
@@ -110,24 +119,26 @@ const executeMultiFileOperation = async (
   config: any,
   parameters: any,
   files: File[],
-  filePrefix: string
+  filePrefix: string,
 ): Promise<File[]> => {
-  const endpoint = typeof config.endpoint === 'function'
-    ? config.endpoint(parameters)
-    : config.endpoint;
+  const endpoint =
+    typeof config.endpoint === "function"
+      ? config.endpoint(parameters)
+      : config.endpoint;
 
-  const formData = (config.buildFormData as (params: any, files: File[]) => FormData)(parameters, files);
+  const formData = (
+    config.buildFormData as (params: any, files: File[]) => FormData
+  )(parameters, files);
 
   return await executeApiRequest(
     endpoint,
     formData,
     files,
     filePrefix,
-    config.preserveBackendFilename
+    config.preserveBackendFilename,
   );
 };
 
-
 /**
  * Execute a tool operation directly without using React hooks
  */
@@ -135,9 +146,15 @@ export const executeToolOperation = async (
   operationName: string,
   parameters: any,
   files: File[],
-  toolRegistry: ToolRegistry
+  toolRegistry: ToolRegistry,
 ): Promise<File[]> => {
-  return executeToolOperationWithPrefix(operationName, parameters, files, toolRegistry, AUTOMATION_CONSTANTS.FILE_PREFIX);
+  return executeToolOperationWithPrefix(
+    operationName,
+    parameters,
+    files,
+    toolRegistry,
+    AUTOMATION_CONSTANTS.FILE_PREFIX,
+  );
 };
 
 /**
@@ -148,7 +165,7 @@ export const executeToolOperationWithPrefix = async (
   parameters: any,
   files: File[],
   toolRegistry: ToolRegistry,
-  filePrefix: string = AUTOMATION_CONSTANTS.FILE_PREFIX
+  filePrefix: string = AUTOMATION_CONSTANTS.FILE_PREFIX,
 ): Promise<File[]> => {
   const config = toolRegistry[operationName as ToolId]?.operationConfig;
   if (!config) {
@@ -167,16 +184,28 @@ export const executeToolOperationWithPrefix = async (
 
     // Execute based on tool type
     if (config.toolType === ToolType.multiFile) {
-      return await executeMultiFileOperation(config, mergedParameters, files, filePrefix);
+      return await executeMultiFileOperation(
+        config,
+        mergedParameters,
+        files,
+        filePrefix,
+      );
     } else {
-      return await executeSingleFileOperation(config, mergedParameters, files, filePrefix);
+      return await executeSingleFileOperation(
+        config,
+        mergedParameters,
+        files,
+        filePrefix,
+      );
     }
-
   } catch (error: any) {
     console.error(`� ${operationName} failed:`, error);
-    throw new Error(`${operationName} operation failed: ${error.response?.data || error.message}`, {
-      cause: error,
-    });
+    throw new Error(
+      `${operationName} operation failed: ${error.response?.data || error.message}`,
+      {
+        cause: error,
+      },
+    );
   }
 };
 
@@ -189,22 +218,26 @@ export const executeAutomationSequence = async (
   toolRegistry: ToolRegistry,
   onStepStart?: (stepIndex: number, operationName: string) => void,
   onStepComplete?: (stepIndex: number, resultFiles: File[]) => void,
-  onStepError?: (stepIndex: number, error: string) => void
+  onStepError?: (stepIndex: number, error: string) => void,
 ): Promise<File[]> => {
-  console.log(`🚀 Starting automation: ${automation.name || 'Unnamed'}`);
+  console.log(`🚀 Starting automation: ${automation.name || "Unnamed"}`);
   console.log(`� Input: ${initialFiles.length} file(s)`);
 
   if (!automation?.operations || automation.operations.length === 0) {
-    throw new Error('No operations in automation');
+    throw new Error("No operations in automation");
   }
 
   let currentFiles = [...initialFiles];
-  const automationPrefix = automation.name ? `${automation.name}_` : 'automated_';
+  const automationPrefix = automation.name
+    ? `${automation.name}_`
+    : "automated_";
 
   for (let i = 0; i < automation.operations.length; i++) {
     const operation = automation.operations[i];
 
-    console.log(`\n📋 Step ${i + 1}/${automation.operations.length}: ${operation.operation}`);
+    console.log(
+      `\n📋 Step ${i + 1}/${automation.operations.length}: ${operation.operation}`,
+    );
     console.log(`   Input: ${currentFiles.length} file(s)`);
 
     try {
@@ -215,13 +248,14 @@ export const executeAutomationSequence = async (
         operation.parameters || {},
         currentFiles,
         toolRegistry,
-        i === automation.operations.length - 1 ? automationPrefix : '' // Only add prefix to final step
+        i === automation.operations.length - 1 ? automationPrefix : "", // Only add prefix to final step
       );
 
-      console.log(`✅ Step ${i + 1} completed: ${resultFiles.length} result files`);
+      console.log(
+        `✅ Step ${i + 1} completed: ${resultFiles.length} result files`,
+      );
       currentFiles = resultFiles;
       onStepComplete?.(i, resultFiles);
-
     } catch (error: any) {
       console.error(`� Step ${i + 1} failed:`, error);
       onStepError?.(i, error.message);
diff --git a/frontend/src/core/utils/automationFileProcessor.ts b/frontend/src/core/utils/automationFileProcessor.ts
index 311848bfd6..cf3ff77157 100644
--- a/frontend/src/core/utils/automationFileProcessor.ts
+++ b/frontend/src/core/utils/automationFileProcessor.ts
@@ -2,14 +2,14 @@
  * File processing utilities specifically for automation workflows
  */
 
-import apiClient from '@app/services/apiClient';
-import { zipFileService } from '@app/services/zipFileService';
-import { ResourceManager } from '@app/utils/resourceManager';
-import { AUTOMATION_CONSTANTS } from '@app/constants/automation';
+import apiClient from "@app/services/apiClient";
+import { zipFileService } from "@app/services/zipFileService";
+import { ResourceManager } from "@app/utils/resourceManager";
+import { AUTOMATION_CONSTANTS } from "@app/constants/automation";
 
 export interface AutomationProcessingOptions {
   timeout?: number;
-  responseType?: 'blob' | 'json';
+  responseType?: "blob" | "json";
 }
 
 export interface AutomationProcessingResult {
@@ -25,20 +25,25 @@ export class AutomationFileProcessor {
   static isZipFile(blob: Blob): boolean {
     // This is a simple check - in a real implementation you might want to read the first few bytes
     // For now, we'll rely on the extraction attempt and fallback
-    return blob.type === 'application/zip' || blob.type === 'application/x-zip-compressed';
+    return (
+      blob.type === "application/zip" ||
+      blob.type === "application/x-zip-compressed"
+    );
   }
 
   /**
    * Extract files from a ZIP blob during automation execution, with fallback for non-ZIP files
    * Extracts all file types (PDFs, images, etc.) except HTML files which stay zipped
    */
-  static async extractAutomationZipFiles(blob: Blob): Promise<AutomationProcessingResult> {
+  static async extractAutomationZipFiles(
+    blob: Blob,
+  ): Promise<AutomationProcessingResult> {
     try {
       const zipFile = ResourceManager.createTimestampedFile(
         blob,
         AUTOMATION_CONSTANTS.RESPONSE_ZIP_PREFIX,
-        '.zip',
-        'application/zip'
+        ".zip",
+        "application/zip",
       );
 
       // Check if ZIP contains HTML files - if so, keep as ZIP
@@ -48,7 +53,7 @@ export class AutomationFileProcessor {
         return {
           success: true,
           files: [zipFile],
-          errors: []
+          errors: [],
         };
       }
 
@@ -60,29 +65,34 @@ export class AutomationFileProcessor {
         return {
           success: true,
           files: [zipFile],
-          errors: [`ZIP extraction failed, kept as ZIP: ${result.errors?.join(', ') || 'Unknown error'}`]
+          errors: [
+            `ZIP extraction failed, kept as ZIP: ${result.errors?.join(", ") || "Unknown error"}`,
+          ],
         };
       }
 
       return {
         success: true,
         files: result.extractedFiles,
-        errors: []
+        errors: [],
       };
     } catch (error) {
-      console.warn('Failed to extract automation ZIP files, keeping as ZIP:', error);
+      console.warn(
+        "Failed to extract automation ZIP files, keeping as ZIP:",
+        error,
+      );
       // Fallback: keep as ZIP file for next automation step to handle
       const fallbackFile = ResourceManager.createTimestampedFile(
         blob,
         AUTOMATION_CONSTANTS.RESPONSE_ZIP_PREFIX,
-        '.zip',
-        'application/zip'
+        ".zip",
+        "application/zip",
       );
 
       return {
         success: true,
         files: [fallbackFile],
-        errors: [`ZIP extraction failed, kept as ZIP: ${error}`]
+        errors: [`ZIP extraction failed, kept as ZIP: ${error}`],
       };
     }
   }
@@ -94,38 +104,42 @@ export class AutomationFileProcessor {
     endpoint: string,
     formData: FormData,
     originalFileName: string,
-    options: AutomationProcessingOptions = {}
+    options: AutomationProcessingOptions = {},
   ): Promise<AutomationProcessingResult> {
     try {
       const response = await apiClient.post(endpoint, formData, {
-        responseType: options.responseType || 'blob',
-        timeout: options.timeout || AUTOMATION_CONSTANTS.OPERATION_TIMEOUT
+        responseType: options.responseType || "blob",
+        timeout: options.timeout || AUTOMATION_CONSTANTS.OPERATION_TIMEOUT,
       });
 
       if (response.status !== 200) {
         return {
           success: false,
           files: [],
-          errors: [`Automation step failed - HTTP ${response.status}: ${response.statusText}`]
+          errors: [
+            `Automation step failed - HTTP ${response.status}: ${response.statusText}`,
+          ],
         };
       }
 
       const resultFile = ResourceManager.createResultFile(
         response.data,
         originalFileName,
-        AUTOMATION_CONSTANTS.FILE_PREFIX
+        AUTOMATION_CONSTANTS.FILE_PREFIX,
       );
 
       return {
         success: true,
         files: [resultFile],
-        errors: []
+        errors: [],
       };
     } catch (error: any) {
       return {
         success: false,
         files: [],
-        errors: [`Automation step failed: ${error.response?.data || error.message}`]
+        errors: [
+          `Automation step failed: ${error.response?.data || error.message}`,
+        ],
       };
     }
   }
@@ -136,19 +150,21 @@ export class AutomationFileProcessor {
   static async processAutomationMultipleFiles(
     endpoint: string,
     formData: FormData,
-    options: AutomationProcessingOptions = {}
+    options: AutomationProcessingOptions = {},
   ): Promise<AutomationProcessingResult> {
     try {
       const response = await apiClient.post(endpoint, formData, {
-        responseType: options.responseType || 'blob',
-        timeout: options.timeout || AUTOMATION_CONSTANTS.OPERATION_TIMEOUT
+        responseType: options.responseType || "blob",
+        timeout: options.timeout || AUTOMATION_CONSTANTS.OPERATION_TIMEOUT,
       });
 
       if (response.status !== 200) {
         return {
           success: false,
           files: [],
-          errors: [`Automation step failed - HTTP ${response.status}: ${response.statusText}`]
+          errors: [
+            `Automation step failed - HTTP ${response.status}: ${response.statusText}`,
+          ],
         };
       }
 
@@ -158,7 +174,9 @@ export class AutomationFileProcessor {
       return {
         success: false,
         files: [],
-        errors: [`Automation step failed: ${error.response?.data || error.message}`]
+        errors: [
+          `Automation step failed: ${error.response?.data || error.message}`,
+        ],
       };
     }
   }
@@ -169,13 +187,13 @@ export class AutomationFileProcessor {
   static buildAutomationFormData(
     parameters: Record<string, any>,
     files: File | File[],
-    fileFieldName: string = 'fileInput'
+    fileFieldName: string = "fileInput",
   ): FormData {
     const formData = new FormData();
 
     // Add files
     if (Array.isArray(files)) {
-      files.forEach(file => formData.append(fileFieldName, file));
+      files.forEach((file) => formData.append(fileFieldName, file));
     } else {
       formData.append(fileFieldName, files);
     }
@@ -183,7 +201,7 @@ export class AutomationFileProcessor {
     // Add parameters
     Object.entries(parameters).forEach(([key, value]) => {
       if (Array.isArray(value)) {
-        value.forEach(item => formData.append(key, item));
+        value.forEach((item) => formData.append(key, item));
       } else if (value !== undefined && value !== null) {
         formData.append(key, value);
       }
diff --git a/frontend/src/core/utils/browserIdentifier.ts b/frontend/src/core/utils/browserIdentifier.ts
index b41914a5ed..703766a10b 100644
--- a/frontend/src/core/utils/browserIdentifier.ts
+++ b/frontend/src/core/utils/browserIdentifier.ts
@@ -3,7 +3,7 @@
  * Generates and persists a unique UUID in localStorage for WAU tracking
  */
 
-const BROWSER_ID_KEY = 'stirling_browser_id';
+const BROWSER_ID_KEY = "stirling_browser_id";
 
 /**
  * Gets or creates a unique browser identifier
@@ -23,7 +23,7 @@ export function getBrowserId(): string {
     return browserId;
   } catch (error) {
     // Fallback to session-based ID if localStorage is unavailable
-    console.warn('localStorage unavailable, using session-based ID', error);
+    console.warn("localStorage unavailable, using session-based ID", error);
     return `session_${generateUUID()}`;
   }
 }
@@ -33,14 +33,14 @@ export function getBrowserId(): string {
  */
 function generateUUID(): string {
   // Use crypto.randomUUID if available (modern browsers)
-  if (typeof crypto !== 'undefined' && crypto.randomUUID) {
+  if (typeof crypto !== "undefined" && crypto.randomUUID) {
     return crypto.randomUUID();
   }
 
   // Fallback to manual UUID generation
-  return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, (c) => {
+  return "xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g, (c) => {
     const r = (Math.random() * 16) | 0;
-    const v = c === 'x' ? r : (r & 0x3) | 0x8;
+    const v = c === "x" ? r : (r & 0x3) | 0x8;
     return v.toString(16);
   });
 }
diff --git a/frontend/src/core/utils/bulkselection/parseSelection.test.ts b/frontend/src/core/utils/bulkselection/parseSelection.test.ts
index bc1319a7d4..29c7dfb014 100644
--- a/frontend/src/core/utils/bulkselection/parseSelection.test.ts
+++ b/frontend/src/core/utils/bulkselection/parseSelection.test.ts
@@ -1,242 +1,260 @@
-import { describe, it, expect } from 'vitest';
-import { parseSelection } from '@app/utils/bulkselection/parseSelection';
+import { describe, it, expect } from "vitest";
+import { parseSelection } from "@app/utils/bulkselection/parseSelection";
 
-describe('parseSelection', () => {
+describe("parseSelection", () => {
   const max = 120;
 
-  it('1) parses single numbers', () => {
-    expect(parseSelection('5', max)).toEqual([5]);
+  it("1) parses single numbers", () => {
+    expect(parseSelection("5", max)).toEqual([5]);
   });
 
-  it('2) parses simple range', () => {
-    expect(parseSelection('3-7', max)).toEqual([3,4,5,6,7]);
+  it("2) parses simple range", () => {
+    expect(parseSelection("3-7", max)).toEqual([3, 4, 5, 6, 7]);
   });
 
-  it('3) parses multiple numbers and ranges via comma OR', () => {
-    expect(parseSelection('1,3-5,10', max)).toEqual([1,3,4,5,10]);
+  it("3) parses multiple numbers and ranges via comma OR", () => {
+    expect(parseSelection("1,3-5,10", max)).toEqual([1, 3, 4, 5, 10]);
   });
 
-  it('4) respects bounds (clamps to 1..max and filters invalid)', () => {
-    expect(parseSelection('0, -2, 1-2, 9999', max)).toEqual([1,2]);
+  it("4) respects bounds (clamps to 1..max and filters invalid)", () => {
+    expect(parseSelection("0, -2, 1-2, 9999", max)).toEqual([1, 2]);
   });
 
-  it('5) supports even keyword', () => {
-    expect(parseSelection('even', 10)).toEqual([2,4,6,8,10]);
+  it("5) supports even keyword", () => {
+    expect(parseSelection("even", 10)).toEqual([2, 4, 6, 8, 10]);
   });
 
-  it('6) supports odd keyword', () => {
-    expect(parseSelection('odd', 10)).toEqual([1,3,5,7,9]);
+  it("6) supports odd keyword", () => {
+    expect(parseSelection("odd", 10)).toEqual([1, 3, 5, 7, 9]);
   });
 
-  it('7) supports 2n progression', () => {
-    expect(parseSelection('2n', 12)).toEqual([2,4,6,8,10,12]);
+  it("7) supports 2n progression", () => {
+    expect(parseSelection("2n", 12)).toEqual([2, 4, 6, 8, 10, 12]);
   });
 
-  it('8) supports kn±c progression (3n+1)', () => {
-    expect(parseSelection('3n+1', 10)).toEqual([1,4,7,10]);
+  it("8) supports kn±c progression (3n+1)", () => {
+    expect(parseSelection("3n+1", 10)).toEqual([1, 4, 7, 10]);
   });
 
-  it('9) supports kn±c progression (4n-1)', () => {
-    expect(parseSelection('4n-1', 15)).toEqual([3,7,11,15]);
+  it("9) supports kn±c progression (4n-1)", () => {
+    expect(parseSelection("4n-1", 15)).toEqual([3, 7, 11, 15]);
   });
 
-  it('10) supports logical AND (&) intersection', () => {
+  it("10) supports logical AND (&) intersection", () => {
     // even AND 1-10 => even numbers within 1..10
-    expect(parseSelection('even & 1-10', 20)).toEqual([2,4,6,8,10]);
+    expect(parseSelection("even & 1-10", 20)).toEqual([2, 4, 6, 8, 10]);
   });
 
-  it('11) supports logical OR with comma', () => {
-    expect(parseSelection('1-3, 8-9', 20)).toEqual([1,2,3,8,9]);
+  it("11) supports logical OR with comma", () => {
+    expect(parseSelection("1-3, 8-9", 20)).toEqual([1, 2, 3, 8, 9]);
   });
 
-  it('12) supports logical OR with | and word or', () => {
-    expect(parseSelection('1-2 | 9-10 or 5', 20)).toEqual([1,2,5,9,10]);
+  it("12) supports logical OR with | and word or", () => {
+    expect(parseSelection("1-2 | 9-10 or 5", 20)).toEqual([1, 2, 5, 9, 10]);
   });
 
-  it('13) supports NOT operator !', () => {
+  it("13) supports NOT operator !", () => {
     // !1-5 within max=10 -> 6..10
-    expect(parseSelection('!1-5', 10)).toEqual([6,7,8,9,10]);
+    expect(parseSelection("!1-5", 10)).toEqual([6, 7, 8, 9, 10]);
   });
 
-  it('14) supports combination: 1-10 & 2n & !5-7', () => {
-    expect(parseSelection('1-10 & 2n & !5-7', 20)).toEqual([2,4,8,10]);
+  it("14) supports combination: 1-10 & 2n & !5-7", () => {
+    expect(parseSelection("1-10 & 2n & !5-7", 20)).toEqual([2, 4, 8, 10]);
   });
 
-  it('15) preserves precedence: AND over OR', () => {
+  it("15) preserves precedence: AND over OR", () => {
     // 1-10 & even, 15 OR => ( (1-10 & even) , 15 )
-    expect(parseSelection('1-10 & even, 15', 20)).toEqual([2,4,6,8,10,15]);
+    expect(parseSelection("1-10 & even, 15", 20)).toEqual([2, 4, 6, 8, 10, 15]);
   });
 
-  it('16) handles whitespace and case-insensitive keywords', () => {
-    expect(parseSelection('  OdD  & 1-7  ', 10)).toEqual([1,3,5,7]);
+  it("16) handles whitespace and case-insensitive keywords", () => {
+    expect(parseSelection("  OdD  & 1-7  ", 10)).toEqual([1, 3, 5, 7]);
   });
 
-  it('17) progression plus range: 2n | 9-11 within 12', () => {
-    expect(parseSelection('2n | 9-11', 12)).toEqual([2,4,6,8,9,10,11,12]);
-  });
-
-  it('18) complex: (2n-1 & 1-20) & ! (5-7)', () => {
-    expect(parseSelection('2n-1 & 1-20 & !5-7', 20)).toEqual([1,3,9,11,13,15,17,19]);
-  });
-
-  it('19) falls back to CSV when expression malformed', () => {
-    // malformed: "2x" -> fallback should treat as CSV tokens -> only 2 ignored -> result empty
-    expect(parseSelection('2x', 10)).toEqual([]);
-    // malformed middle; still fallback handles CSV bits
-    expect(parseSelection('1, 3-5, foo, 9', 10)).toEqual([1,3,4,5,9]);
-  });
-
-  it('20) clamps ranges that exceed bounds', () => {
-    expect(parseSelection('0-5, 9-10', 10)).toEqual([1,2,3,4,5,9,10]);
-  });
-
-  it('21) supports parentheses to override precedence', () => {
-    // Without parentheses: 1-10 & even, 15 => [2,4,6,8,10,15]
-    // With parentheses around OR: 1-10 & (even, 15) => [2,4,6,8,10]
-    expect(parseSelection('1-10 & (even, 15)', 20)).toEqual([2,4,6,8,10]);
-  });
-
-  it('22) NOT over a grouped intersection', () => {
-    // !(10-20 & !2n) within 1..25
-    // Inner: 10-20 & !2n => odd numbers from 11..19 plus 10,12,14,16,18,20 excluded
-    // Complement in 1..25 removes those, keeping others
-    const result = parseSelection('!(10-20 & !2n)', 25);
-    expect(result).toEqual([1,2,3,4,5,6,7,8,9,10,12,14,16,18,20,21,22,23,24,25]);
-  });
-
-  it('23) nested parentheses with progressions', () => {
-    expect(parseSelection('(2n | 3n+1) & 1-20', 50)).toEqual([
-      1,2,4,6,7,8,10,12,13,14,16,18,19,20
+  it("17) progression plus range: 2n | 9-11 within 12", () => {
+    expect(parseSelection("2n | 9-11", 12)).toEqual([
+      2, 4, 6, 8, 9, 10, 11, 12,
     ]);
   });
 
-  it('24) parentheses with NOT directly on group', () => {
-    expect(parseSelection('!(1-5, odd)', 10)).toEqual([6,8,10]);
+  it("18) complex: (2n-1 & 1-20) & ! (5-7)", () => {
+    expect(parseSelection("2n-1 & 1-20 & !5-7", 20)).toEqual([
+      1, 3, 9, 11, 13, 15, 17, 19,
+    ]);
   });
 
-  it('25) whitespace within parentheses is ignored', () => {
-    expect(parseSelection('(  1 - 3  ,  6  )', 10)).toEqual([1,2,3,6]);
+  it("19) falls back to CSV when expression malformed", () => {
+    // malformed: "2x" -> fallback should treat as CSV tokens -> only 2 ignored -> result empty
+    expect(parseSelection("2x", 10)).toEqual([]);
+    // malformed middle; still fallback handles CSV bits
+    expect(parseSelection("1, 3-5, foo, 9", 10)).toEqual([1, 3, 4, 5, 9]);
   });
 
-  it('26) malformed missing closing parenthesis falls back to CSV', () => {
+  it("20) clamps ranges that exceed bounds", () => {
+    expect(parseSelection("0-5, 9-10", 10)).toEqual([1, 2, 3, 4, 5, 9, 10]);
+  });
+
+  it("21) supports parentheses to override precedence", () => {
+    // Without parentheses: 1-10 & even, 15 => [2,4,6,8,10,15]
+    // With parentheses around OR: 1-10 & (even, 15) => [2,4,6,8,10]
+    expect(parseSelection("1-10 & (even, 15)", 20)).toEqual([2, 4, 6, 8, 10]);
+  });
+
+  it("22) NOT over a grouped intersection", () => {
+    // !(10-20 & !2n) within 1..25
+    // Inner: 10-20 & !2n => odd numbers from 11..19 plus 10,12,14,16,18,20 excluded
+    // Complement in 1..25 removes those, keeping others
+    const result = parseSelection("!(10-20 & !2n)", 25);
+    expect(result).toEqual([
+      1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 12, 14, 16, 18, 20, 21, 22, 23, 24, 25,
+    ]);
+  });
+
+  it("23) nested parentheses with progressions", () => {
+    expect(parseSelection("(2n | 3n+1) & 1-20", 50)).toEqual([
+      1, 2, 4, 6, 7, 8, 10, 12, 13, 14, 16, 18, 19, 20,
+    ]);
+  });
+
+  it("24) parentheses with NOT directly on group", () => {
+    expect(parseSelection("!(1-5, odd)", 10)).toEqual([6, 8, 10]);
+  });
+
+  it("25) whitespace within parentheses is ignored", () => {
+    expect(parseSelection("(  1 - 3  ,  6  )", 10)).toEqual([1, 2, 3, 6]);
+  });
+
+  it("26) malformed missing closing parenthesis falls back to CSV", () => {
     // Expression parse should fail; fallback CSV should pick numbers only
-    expect(parseSelection('(1-3, 6', 10)).toEqual([6]);
+    expect(parseSelection("(1-3, 6", 10)).toEqual([6]);
   });
 
-  it('27) nested NOT and AND with parentheses', () => {
+  it("27) nested NOT and AND with parentheses", () => {
     // !(odd & 5-9) within 1..12 => remove odd numbers 5,7,9
-    expect(parseSelection('!(odd & 5-9)', 12)).toEqual([1,2,3,4,6,8,10,11,12]);
+    expect(parseSelection("!(odd & 5-9)", 12)).toEqual([
+      1, 2, 3, 4, 6, 8, 10, 11, 12,
+    ]);
   });
 
-  it('28) deep nesting and mixing operators', () => {
-    const expr = '(1-4 & 2n) , ( (5-10 & odd) & !(7) ), (3n+1 & 1-20)';
-    expect(parseSelection(expr, 20)).toEqual([1,2,4,5,7,9,10,13,16,19]);
+  it("28) deep nesting and mixing operators", () => {
+    const expr = "(1-4 & 2n) , ( (5-10 & odd) & !(7) ), (3n+1 & 1-20)";
+    expect(parseSelection(expr, 20)).toEqual([
+      1, 2, 4, 5, 7, 9, 10, 13, 16, 19,
+    ]);
   });
 
-  it('31) word NOT works like ! for terms', () => {
-    expect(parseSelection('not 1-3', 6)).toEqual([4,5,6]);
+  it("31) word NOT works like ! for terms", () => {
+    expect(parseSelection("not 1-3", 6)).toEqual([4, 5, 6]);
   });
 
-  it('32) word NOT works like ! for groups', () => {
-    expect(parseSelection('not (odd & 1-6)', 8)).toEqual([2,4,6,7,8]);
+  it("32) word NOT works like ! for groups", () => {
+    expect(parseSelection("not (odd & 1-6)", 8)).toEqual([2, 4, 6, 7, 8]);
   });
 
-  it('29) parentheses around a single term has no effect', () => {
-    expect(parseSelection('(even)', 8)).toEqual([2,4,6,8]);
+  it("29) parentheses around a single term has no effect", () => {
+    expect(parseSelection("(even)", 8)).toEqual([2, 4, 6, 8]);
   });
 
-  it('30) redundant nested parentheses', () => {
-    expect(parseSelection('(((1-3))), ((2n))', 6)).toEqual([1,2,3,4,6]);
+  it("30) redundant nested parentheses", () => {
+    expect(parseSelection("(((1-3))), ((2n))", 6)).toEqual([1, 2, 3, 4, 6]);
   });
 
   // Additional edge cases and comprehensive coverage
-  it('33) handles empty input gracefully', () => {
-    expect(parseSelection('', 10)).toEqual([]);
-    expect(parseSelection('   ', 10)).toEqual([]);
+  it("33) handles empty input gracefully", () => {
+    expect(parseSelection("", 10)).toEqual([]);
+    expect(parseSelection("   ", 10)).toEqual([]);
   });
 
-  it('34) handles zero or negative maxPages', () => {
-    expect(parseSelection('1-10', 0)).toEqual([]);
-    expect(parseSelection('1-10', -5)).toEqual([]);
+  it("34) handles zero or negative maxPages", () => {
+    expect(parseSelection("1-10", 0)).toEqual([]);
+    expect(parseSelection("1-10", -5)).toEqual([]);
   });
 
-  it('35) handles large progressions efficiently', () => {
-    expect(parseSelection('100n', 1000)).toEqual([100, 200, 300, 400, 500, 600, 700, 800, 900, 1000]);
+  it("35) handles large progressions efficiently", () => {
+    expect(parseSelection("100n", 1000)).toEqual([
+      100, 200, 300, 400, 500, 600, 700, 800, 900, 1000,
+    ]);
   });
 
-  it('36) handles progressions with large offsets', () => {
-    expect(parseSelection('5n+97', 100)).toEqual([97]);
-    expect(parseSelection('3n-2', 10)).toEqual([1, 4, 7, 10]);
+  it("36) handles progressions with large offsets", () => {
+    expect(parseSelection("5n+97", 100)).toEqual([97]);
+    expect(parseSelection("3n-2", 10)).toEqual([1, 4, 7, 10]);
   });
 
-  it('37) mixed case keywords work correctly', () => {
-    expect(parseSelection('EVEN & Odd', 6)).toEqual([]);
-    expect(parseSelection('Even OR odd', 6)).toEqual([1, 2, 3, 4, 5, 6]);
+  it("37) mixed case keywords work correctly", () => {
+    expect(parseSelection("EVEN & Odd", 6)).toEqual([]);
+    expect(parseSelection("Even OR odd", 6)).toEqual([1, 2, 3, 4, 5, 6]);
   });
 
-  it('38) complex nested expressions with all operators', () => {
-    const expr = '(1-20 & even) | (odd & !5-15) | (3n+1 & 1-10)';
+  it("38) complex nested expressions with all operators", () => {
+    const expr = "(1-20 & even) | (odd & !5-15) | (3n+1 & 1-10)";
     // (1-20 & even) = [2,4,6,8,10,12,14,16,18,20]
-    // (odd & !5-15) = odd numbers not in 5-15 = [1,3,17,19] 
+    // (odd & !5-15) = odd numbers not in 5-15 = [1,3,17,19]
     // (3n+1 & 1-10) = [1,4,7,10]
     // Union of all = [1,2,3,4,6,7,8,10,12,14,16,17,18,19,20]
-    expect(parseSelection(expr, 20)).toEqual([1, 2, 3, 4, 6, 7, 8, 10, 12, 14, 16, 17, 18, 19, 20]);
+    expect(parseSelection(expr, 20)).toEqual([
+      1, 2, 3, 4, 6, 7, 8, 10, 12, 14, 16, 17, 18, 19, 20,
+    ]);
   });
 
-  it('39) multiple NOT operators in sequence', () => {
-    expect(parseSelection('not not 1-5', 10)).toEqual([1, 2, 3, 4, 5]);
-    expect(parseSelection('!!!1-3', 10)).toEqual([4, 5, 6, 7, 8, 9, 10]);
+  it("39) multiple NOT operators in sequence", () => {
+    expect(parseSelection("not not 1-5", 10)).toEqual([1, 2, 3, 4, 5]);
+    expect(parseSelection("!!!1-3", 10)).toEqual([4, 5, 6, 7, 8, 9, 10]);
   });
 
-  it('40) edge case: single page selection', () => {
-    expect(parseSelection('1', 1)).toEqual([1]);
-    expect(parseSelection('5', 3)).toEqual([]);
+  it("40) edge case: single page selection", () => {
+    expect(parseSelection("1", 1)).toEqual([1]);
+    expect(parseSelection("5", 3)).toEqual([]);
   });
 
-  it('41) backwards ranges are handled correctly', () => {
-    expect(parseSelection('10-5', 15)).toEqual([5, 6, 7, 8, 9, 10]);
+  it("41) backwards ranges are handled correctly", () => {
+    expect(parseSelection("10-5", 15)).toEqual([5, 6, 7, 8, 9, 10]);
   });
 
-  it('42) progressions that start beyond maxPages', () => {
-    expect(parseSelection('10n+50', 40)).toEqual([]);
-    expect(parseSelection('5n+35', 40)).toEqual([35, 40]);
+  it("42) progressions that start beyond maxPages", () => {
+    expect(parseSelection("10n+50", 40)).toEqual([]);
+    expect(parseSelection("5n+35", 40)).toEqual([35, 40]);
   });
 
-  it('43) complex operator precedence with mixed syntax', () => {
+  it("43) complex operator precedence with mixed syntax", () => {
     // AND has higher precedence than OR
-    expect(parseSelection('1-3, 5-7 & even', 10)).toEqual([1, 2, 3, 6]);
-    expect(parseSelection('1-3 | 5-7 and even', 10)).toEqual([1, 2, 3, 6]);
+    expect(parseSelection("1-3, 5-7 & even", 10)).toEqual([1, 2, 3, 6]);
+    expect(parseSelection("1-3 | 5-7 and even", 10)).toEqual([1, 2, 3, 6]);
   });
 
-  it('44) whitespace tolerance in complex expressions', () => {
-    const expr1 = '1-5&even|odd&!3';
-    const expr2 = '  1 - 5  &  even  |  odd  &  ! 3  ';
+  it("44) whitespace tolerance in complex expressions", () => {
+    const expr1 = "1-5&even|odd&!3";
+    const expr2 = "  1 - 5  &  even  |  odd  &  ! 3  ";
     expect(parseSelection(expr1, 10)).toEqual(parseSelection(expr2, 10));
   });
 
-  it('45) fallback behavior with partial valid expressions', () => {
+  it("45) fallback behavior with partial valid expressions", () => {
     // Should fallback and extract valid CSV parts
-    expect(parseSelection('1, 2-4, invalid, 7', 10)).toEqual([1, 2, 3, 4, 7]);
-    expect(parseSelection('1-3, @#$, 8-9', 10)).toEqual([1, 2, 3, 8, 9]);
+    expect(parseSelection("1, 2-4, invalid, 7", 10)).toEqual([1, 2, 3, 4, 7]);
+    expect(parseSelection("1-3, @#$, 8-9", 10)).toEqual([1, 2, 3, 8, 9]);
   });
 
-  it('46) progressions with k=1 (equivalent to n)', () => {
-    expect(parseSelection('1n', 5)).toEqual([1, 2, 3, 4, 5]);
-    expect(parseSelection('1n+2', 5)).toEqual([2, 3, 4, 5]);
+  it("46) progressions with k=1 (equivalent to n)", () => {
+    expect(parseSelection("1n", 5)).toEqual([1, 2, 3, 4, 5]);
+    expect(parseSelection("1n+2", 5)).toEqual([2, 3, 4, 5]);
   });
 
-  it('47) very large ranges are clamped correctly', () => {
-    expect(parseSelection('1-999999', 10)).toEqual([1, 2, 3, 4, 5, 6, 7, 8, 9, 10]);
+  it("47) very large ranges are clamped correctly", () => {
+    expect(parseSelection("1-999999", 10)).toEqual([
+      1, 2, 3, 4, 5, 6, 7, 8, 9, 10,
+    ]);
     // Note: -100-5 would fallback to CSV and reject -100, but 0-5 should work
-    expect(parseSelection('0-5', 10)).toEqual([1, 2, 3, 4, 5]);
+    expect(parseSelection("0-5", 10)).toEqual([1, 2, 3, 4, 5]);
   });
 
-  it('48) multiple comma-separated ranges', () => {
-    expect(parseSelection('1-2, 4-5, 7-8, 10', 10)).toEqual([1, 2, 4, 5, 7, 8, 10]);
+  it("48) multiple comma-separated ranges", () => {
+    expect(parseSelection("1-2, 4-5, 7-8, 10", 10)).toEqual([
+      1, 2, 4, 5, 7, 8, 10,
+    ]);
   });
 
-  it('49) combination of all features in one expression', () => {
-    const expr = '(1-10 & even) | (odd & 15-25) & !(3n+1 & 1-30) | 50n';
+  it("49) combination of all features in one expression", () => {
+    const expr = "(1-10 & even) | (odd & 15-25) & !(3n+1 & 1-30) | 50n";
     const result = parseSelection(expr, 100);
     // This should combine: even numbers 2,4,6,8,10 with odd 15-25 excluding 3n+1 matches, plus 50n
     expect(result.length).toBeGreaterThan(0);
@@ -244,10 +262,8 @@ describe('parseSelection', () => {
     expect(result).toContain(100);
   });
 
-  it('50) stress test with deeply nested parentheses', () => {
-    const expr = '((((1-5)))) & ((((even)))) | ((((odd & 7-9))))';
+  it("50) stress test with deeply nested parentheses", () => {
+    const expr = "((((1-5)))) & ((((even)))) | ((((odd & 7-9))))";
     expect(parseSelection(expr, 10)).toEqual([2, 4, 7, 9]);
   });
 });
-
-
diff --git a/frontend/src/core/utils/bulkselection/parseSelection.ts b/frontend/src/core/utils/bulkselection/parseSelection.ts
index c833274830..1705056055 100644
--- a/frontend/src/core/utils/bulkselection/parseSelection.ts
+++ b/frontend/src/core/utils/bulkselection/parseSelection.ts
@@ -33,7 +33,7 @@ export function parseSelection(input: string, maxPages: number): number[] {
   const clampedMax = Math.max(0, Math.floor(maxPages || 0));
   if (clampedMax === 0) return [];
 
-  const trimmed = (input || '').trim();
+  const trimmed = (input || "").trim();
   if (trimmed.length === 0) return [];
 
   try {
@@ -49,12 +49,12 @@ export function parseSelection(input: string, maxPages: number): number[] {
 export function parseSelectionWithDiagnostics(
   input: string,
   maxPages: number,
-  options?: { strict?: boolean }
+  options?: { strict?: boolean },
 ): { pages: number[]; warning?: string } {
   const clampedMax = Math.max(0, Math.floor(maxPages || 0));
   if (clampedMax === 0) return { pages: [] };
 
-  const trimmed = (input || '').trim();
+  const trimmed = (input || "").trim();
   if (trimmed.length === 0) return { pages: [] };
 
   try {
@@ -66,9 +66,12 @@ export function parseSelectionWithDiagnostics(
       throw err;
     }
     const pages = toSortedArray(parseCsvFallback(trimmed, clampedMax));
-    const tokens = trimmed.split(',').map(t => t.trim()).filter(Boolean);
-    const bad = tokens.find(tok => !/^(\d+\s*-\s*\d+|\d+)$/.test(tok));
-    const warning = `Malformed expression${bad ? ` at: '${bad}'` : ''}. Falling back to CSV interpretation.`;
+    const tokens = trimmed
+      .split(",")
+      .map((t) => t.trim())
+      .filter(Boolean);
+    const bad = tokens.find((tok) => !/^(\d+\s*-\s*\d+|\d+)$/.test(tok));
+    const warning = `Malformed expression${bad ? ` at: '${bad}'` : ""}. Falling back to CSV interpretation.`;
     return { pages, warning };
   }
 }
@@ -79,7 +82,10 @@ function toSortedArray(set: Set<number>): number[] {
 
 function parseCsvFallback(input: string, max: number): Set<number> {
   const result = new Set<number>();
-  const parts = input.split(',').map(p => p.trim()).filter(Boolean);
+  const parts = input
+    .split(",")
+    .map((p) => p.trim())
+    .filter(Boolean);
   for (const part of parts) {
     const rangeMatch = part.match(/^(\d+)\s*-\s*(\d+)$/);
     if (rangeMatch) {
@@ -121,7 +127,7 @@ class ExpressionParser {
     this.skipWs();
     // If there are leftover non-space characters, treat as error
     if (this.idx < this.src.length) {
-      throw new Error('Unexpected trailing input');
+      throw new Error("Unexpected trailing input");
     }
     return set;
   }
@@ -132,13 +138,13 @@ class ExpressionParser {
       this.skipWs();
       const op = this.peekWordOrSymbol();
       if (!op) break;
-      if (op.type === 'symbol' && (op.value === ',' || op.value === '|')) {
+      if (op.type === "symbol" && (op.value === "," || op.value === "|")) {
         this.consume(op.length);
         const right = this.parseConjunction();
         left = union(left, right);
         continue;
       }
-      if (op.type === 'word' && op.value === 'or') {
+      if (op.type === "word" && op.value === "or") {
         this.consume(op.length);
         const right = this.parseConjunction();
         left = union(left, right);
@@ -155,13 +161,13 @@ class ExpressionParser {
       this.skipWs();
       const op = this.peekWordOrSymbol();
       if (!op) break;
-      if (op.type === 'symbol' && op.value === '&') {
+      if (op.type === "symbol" && op.value === "&") {
         this.consume(op.length);
         const right = this.parseUnary();
         left = intersect(left, right);
         continue;
       }
-      if (op.type === 'word' && op.value === 'and') {
+      if (op.type === "word" && op.value === "and") {
         this.consume(op.length);
         const right = this.parseUnary();
         left = intersect(left, right);
@@ -174,7 +180,7 @@ class ExpressionParser {
 
   private parseUnary(): Set<number> {
     this.skipWs();
-    if (this.peek('!')) {
+    if (this.peek("!")) {
       this.consume(1);
       const inner = this.parseUnary();
       return complement(inner, this.max);
@@ -191,11 +197,11 @@ class ExpressionParser {
     this.skipWs();
 
     // Parenthesized expression: '(' expression ')'
-    if (this.peek('(')) {
+    if (this.peek("(")) {
       this.consume(1);
       const inner = this.parseDisjunction();
       this.skipWs();
-      if (!this.peek(')')) throw new Error('Expected )');
+      if (!this.peek(")")) throw new Error("Expected )");
       this.consume(1);
       return inner;
     }
@@ -203,8 +209,8 @@ class ExpressionParser {
     // Keywords: even / odd
     const keyword = this.tryReadKeyword();
     if (keyword) {
-      if (keyword === 'even') return this.buildEven();
-      if (keyword === 'odd') return this.buildOdd();
+      if (keyword === "even") return this.buildEven();
+      if (keyword === "odd") return this.buildOdd();
     }
 
     // Progression: k n ( +/- c )?
@@ -217,7 +223,7 @@ class ExpressionParser {
     const num = this.tryReadNumber();
     if (num !== null) {
       this.skipWs();
-      if (this.peek('-')) {
+      if (this.peek("-")) {
         // Range
         this.consume(1);
         this.skipWs();
@@ -228,7 +234,7 @@ class ExpressionParser {
     }
 
     // If nothing matched, error
-    throw new Error('Expected primary');
+    throw new Error("Expected primary");
   }
 
   private buildSingleton(n: number): Set<number> {
@@ -239,7 +245,8 @@ class ExpressionParser {
 
   private buildRange(a: number, b: number): Set<number> {
     const set = new Set<number>();
-    let start = a, end = b;
+    let start = a,
+      end = b;
     if (!Number.isFinite(start) || !Number.isFinite(end)) return set;
     if (start > end) [start, end] = [end, start];
     start = Math.max(1, start);
@@ -268,13 +275,13 @@ class ExpressionParser {
     return this.buildProgression(2, -1);
   }
 
-  private tryReadKeyword(): 'even' | 'odd' | null {
+  private tryReadKeyword(): "even" | "odd" | null {
     const start = this.idx;
     const word = this.readWord();
     if (!word) return null;
     const lower = word.toLowerCase();
-    if (lower === 'even' || lower === 'odd') {
-      return lower as 'even' | 'odd';
+    if (lower === "even" || lower === "odd") {
+      return lower as "even" | "odd";
     }
     // Not a keyword; rewind
     this.idx = start;
@@ -291,9 +298,9 @@ class ExpressionParser {
     }
     this.skipWs();
     // Optional '*'
-    if (this.peek('*')) this.consume(1);
+    if (this.peek("*")) this.consume(1);
     this.skipWs();
-    if (!this.peek('n') && !this.peek('N')) {
+    if (!this.peek("n") && !this.peek("N")) {
       this.idx = start;
       return null;
     }
@@ -301,7 +308,7 @@ class ExpressionParser {
     this.skipWs();
     // Optional (+|-) c
     let c = 0;
-    if (this.peek('+') || this.peek('-')) {
+    if (this.peek("+") || this.peek("-")) {
       const sign = this.src[this.idx];
       this.consume(1);
       this.skipWs();
@@ -310,7 +317,7 @@ class ExpressionParser {
         this.idx = start;
         return null;
       }
-      c = sign === '-' ? -cVal : cVal;
+      c = sign === "-" ? -cVal : cVal;
     }
     return { k, c };
   }
@@ -326,7 +333,7 @@ class ExpressionParser {
 
   private readRequiredNumber(): number {
     const n = this.tryReadNumber();
-    if (n === null) throw new Error('Expected number');
+    if (n === null) throw new Error("Expected number");
     return n;
   }
 
@@ -345,14 +352,19 @@ class ExpressionParser {
       this.idx = start;
       return false;
     }
-    if (word.toLowerCase() === 'not') {
+    if (word.toLowerCase() === "not") {
       return true;
     }
     this.idx = start;
     return false;
   }
 
-  private peekWordOrSymbol(): { type: 'word' | 'symbol'; value: string; raw: string; length: number } | null {
+  private peekWordOrSymbol(): {
+    type: "word" | "symbol";
+    value: string;
+    raw: string;
+    length: number;
+  } | null {
     this.skipWs();
     if (this.idx >= this.src.length) return null;
     const ch = this.src[this.idx];
@@ -364,19 +376,20 @@ class ExpressionParser {
       // Always rewind; the caller will consume if it uses this token
       const len = word.length;
       this.idx = start;
-      if (lower === 'and' || lower === 'or') {
-        return { type: 'word', value: lower, raw: word, length: len };
+      if (lower === "and" || lower === "or") {
+        return { type: "word", value: lower, raw: word, length: len };
       }
       return null;
     }
-    if (ch === '&' || ch === '|' || ch === ',') {
-      return { type: 'symbol', value: ch, raw: ch, length: 1 };
+    if (ch === "&" || ch === "|" || ch === ",") {
+      return { type: "symbol", value: ch, raw: ch, length: 1 };
     }
     return null;
   }
 
   private skipWs() {
-    while (this.idx < this.src.length && /\s/.test(this.src[this.idx])) this.idx++;
+    while (this.idx < this.src.length && /\s/.test(this.src[this.idx]))
+      this.idx++;
   }
 
   private peek(s: string): boolean {
@@ -409,5 +422,3 @@ function complement(a: Set<number>, max: number): Set<number> {
   for (let i = 1; i <= max; i++) if (!a.has(i)) out.add(i);
   return out;
 }
-
-
diff --git a/frontend/src/core/utils/bulkselection/selectionBuilders.ts b/frontend/src/core/utils/bulkselection/selectionBuilders.ts
index 7d8146089d..e2c83e8baf 100644
--- a/frontend/src/core/utils/bulkselection/selectionBuilders.ts
+++ b/frontend/src/core/utils/bulkselection/selectionBuilders.ts
@@ -1,35 +1,38 @@
 // Pure helper utilities for building and manipulating bulk page selection expressions
 
-export type LogicalOperator = 'and' | 'or' | 'not' | 'even' | 'odd';
+export type LogicalOperator = "and" | "or" | "not" | "even" | "odd";
 
 // Returns a new CSV expression with expr appended.
 // If current ends with an operator token, expr is appended directly.
 // Otherwise, it is joined with " or ".
 export function appendExpression(currentInput: string, expr: string): string {
-  const current = (currentInput || '').trim();
+  const current = (currentInput || "").trim();
   if (!current) return expr;
   const endsWithOperator = /(\b(and|not|or)\s*|[&|,!]\s*)$/i.test(current);
   // Add space if operator doesn't already have one
   if (endsWithOperator) {
-    const needsSpace = !current.endsWith(' ');
-    return `${current}${needsSpace ? ' ' : ''}${expr}`;
+    const needsSpace = !current.endsWith(" ");
+    return `${current}${needsSpace ? " " : ""}${expr}`;
   }
   return `${current} or ${expr}`;
 }
 
 // Smartly inserts/normalizes a logical operator at the end of the current input.
 // Produces a trailing space to allow the next token to be typed naturally.
-export function insertOperatorSmart(currentInput: string, op: LogicalOperator): string {
-  const text = (currentInput || '').trim();
+export function insertOperatorSmart(
+  currentInput: string,
+  op: LogicalOperator,
+): string {
+  const text = (currentInput || "").trim();
   // Handle 'even' and 'odd' as page selection expressions, not logical operators
-  if (op === 'even' || op === 'odd') {
+  if (op === "even" || op === "odd") {
     if (text.length === 0) return `${op} `;
     // If current input ends with a logical operator, append the page selection with proper spacing
     const endsWithOperator = /(\b(and|not|or)\s*|[&|,!]\s*)$/i.test(text);
     if (endsWithOperator) {
       // Add space if the operator doesn't already have one
-      const needsSpace = !text.endsWith(' ');
-      return `${text}${needsSpace ? ' ' : ''}${op} `;
+      const needsSpace = !text.endsWith(" ");
+      return `${text}${needsSpace ? " " : ""}${op} `;
     }
     return `${text} or ${op} `;
   }
@@ -43,7 +46,14 @@ export function insertOperatorSmart(currentInput: string, op: LogicalOperator):
     const m = rest.match(/(?:\s*)(?:(&|\||,|!|\band\b|\bor\b|\bnot\b))\s*$/i);
     if (!m || m.index === undefined) break;
     const raw = m[1].toLowerCase();
-    const word = raw === '&' ? 'and' : raw === '|' || raw === ',' ? 'or' : raw === '!' ? 'not' : raw;
+    const word =
+      raw === "&"
+        ? "and"
+        : raw === "|" || raw === ","
+          ? "or"
+          : raw === "!"
+            ? "not"
+            : raw;
     tokens.unshift(word);
     rest = rest.slice(0, m.index).trimEnd();
   }
@@ -56,47 +66,48 @@ export function insertOperatorSmart(currentInput: string, op: LogicalOperator):
   }
 
   // Normalize to allowed set
-  const phrase = tokens.join(' ');
-  const allowed = new Set(['and', 'or', 'not', 'and not', 'or not']);
+  const phrase = tokens.join(" ");
+  const allowed = new Set(["and", "or", "not", "and not", "or not"]);
 
   // Helpers for transitions from a single trailing token
   const fromSingle = (t: string): string => {
-    if (t === 'and') {
-      if (click === 'and') return 'and';
-      if (click === 'or') return 'or'; // 'and or' is invalid, so just use 'or'
-      return 'and not';
+    if (t === "and") {
+      if (click === "and") return "and";
+      if (click === "or") return "or"; // 'and or' is invalid, so just use 'or'
+      return "and not";
     }
-    if (t === 'or') {
-      if (click === 'and') return 'and';
-      if (click === 'or') return 'or';
-      return 'or not';
+    if (t === "or") {
+      if (click === "and") return "and";
+      if (click === "or") return "or";
+      return "or not";
     }
     // t === 'not'
-    if (click === 'and') return 'and';
-    if (click === 'or') return 'or';
-    return 'not';
+    if (click === "and") return "and";
+    if (click === "or") return "or";
+    return "not";
   };
 
   // From combined phrase
   const fromCombo = (p: string): string => {
-    if (p === 'and not') {
-      if (click === 'not') return 'and not';
-      if (click === 'and') return 'and';
-      if (click === 'or') return 'or'; // 'and not or' is invalid, so just use 'or'
-      return 'and not';
+    if (p === "and not") {
+      if (click === "not") return "and not";
+      if (click === "and") return "and";
+      if (click === "or") return "or"; // 'and not or' is invalid, so just use 'or'
+      return "and not";
     }
-    if (p === 'or not') {
-      if (click === 'not') return 'or not';
-      if (click === 'or') return 'or';
-      if (click === 'and') return 'and'; // 'or not and' is invalid, so just use 'and'
-      return 'or not';
+    if (p === "or not") {
+      if (click === "not") return "or not";
+      if (click === "or") return "or";
+      if (click === "and") return "and"; // 'or not and' is invalid, so just use 'and'
+      return "or not";
     }
     // Invalid combos (e.g., 'not and', 'not or', 'or and', 'and or') → collapse to clicked op
     return click;
   };
 
   const base = rest.trim();
-  const nextPhrase = tokens.length === 1 ? fromSingle(tokens[0]) : fromCombo(phrase);
+  const nextPhrase =
+    tokens.length === 1 ? fromSingle(tokens[0]) : fromCombo(phrase);
   if (!allowed.has(nextPhrase)) {
     return emit(base, click);
   }
@@ -123,7 +134,11 @@ export function everyNthExpression(n: number): string | null {
   return `${Math.max(1, Math.floor(n))}n`;
 }
 
-export function rangeExpression(start: number, end: number, maxPages: number): string | null {
+export function rangeExpression(
+  start: number,
+  end: number,
+  maxPages: number,
+): string | null {
   if (!Number.isFinite(start) || !Number.isFinite(end)) return null;
   let s = Math.floor(start);
   let e = Math.floor(end);
@@ -132,5 +147,3 @@ export function rangeExpression(start: number, end: number, maxPages: number): s
   e = maxPages > 0 ? Math.min(maxPages, e) : e;
   return `${s}-${e}`;
 }
-
-
diff --git a/frontend/src/core/utils/clickHandlers.ts b/frontend/src/core/utils/clickHandlers.ts
index 0c70cfca82..8691989943 100644
--- a/frontend/src/core/utils/clickHandlers.ts
+++ b/frontend/src/core/utils/clickHandlers.ts
@@ -6,7 +6,7 @@
  * Determines if a click event is a "special" click that should use browser's default navigation
  * instead of SPA navigation. Special clicks include:
  * - Ctrl+click (or Cmd+click on Mac)
- * - Shift+click 
+ * - Shift+click
  * - Middle mouse button click
  */
 export function isSpecialClick(e: React.MouseEvent): boolean {
@@ -15,17 +15,20 @@ export function isSpecialClick(e: React.MouseEvent): boolean {
 
 /**
  * Handles a click event for SPA navigation, but allows special clicks to use browser defaults
- * 
+ *
  * @param e - The click event
  * @param handleClick - Function to execute for regular clicks (SPA navigation)
  * @returns true if the event was handled as a special click, false if it was handled as regular click
  */
-export function handleUnlessSpecialClick(e: React.MouseEvent, handleClick: () => void): boolean {
+export function handleUnlessSpecialClick(
+  e: React.MouseEvent,
+  handleClick: () => void,
+): boolean {
   if (isSpecialClick(e)) {
     return true; // Let browser handle via href
   }
-  
+
   e.preventDefault();
   handleClick();
   return false;
-}
\ No newline at end of file
+}
diff --git a/frontend/src/core/utils/convertUtils.test.ts b/frontend/src/core/utils/convertUtils.test.ts
index 13ee2a9f9c..a596e72258 100644
--- a/frontend/src/core/utils/convertUtils.test.ts
+++ b/frontend/src/core/utils/convertUtils.test.ts
@@ -2,336 +2,336 @@
  * Unit tests for convertUtils
  */
 
-import { describe, test, expect } from 'vitest';
-import { 
-  getEndpointName, 
-  getEndpointUrl, 
-  isConversionSupported, 
-  isImageFormat 
-} from '@app/utils/convertUtils';
+import { describe, test, expect } from "vitest";
+import {
+  getEndpointName,
+  getEndpointUrl,
+  isConversionSupported,
+  isImageFormat,
+} from "@app/utils/convertUtils";
 
-describe('convertUtils', () => {
-  
-  describe('getEndpointName', () => {
-    
-    test('should return correct endpoint names for all supported conversions', () => {
+describe("convertUtils", () => {
+  describe("getEndpointName", () => {
+    test("should return correct endpoint names for all supported conversions", () => {
       // PDF to Image formats
-      expect(getEndpointName('pdf', 'png')).toBe('pdf-to-img');
-      expect(getEndpointName('pdf', 'jpg')).toBe('pdf-to-img');
-      expect(getEndpointName('pdf', 'gif')).toBe('pdf-to-img');
-      expect(getEndpointName('pdf', 'tiff')).toBe('pdf-to-img');
-      expect(getEndpointName('pdf', 'bmp')).toBe('pdf-to-img');
-      expect(getEndpointName('pdf', 'webp')).toBe('pdf-to-img');
-      
+      expect(getEndpointName("pdf", "png")).toBe("pdf-to-img");
+      expect(getEndpointName("pdf", "jpg")).toBe("pdf-to-img");
+      expect(getEndpointName("pdf", "gif")).toBe("pdf-to-img");
+      expect(getEndpointName("pdf", "tiff")).toBe("pdf-to-img");
+      expect(getEndpointName("pdf", "bmp")).toBe("pdf-to-img");
+      expect(getEndpointName("pdf", "webp")).toBe("pdf-to-img");
+
       // PDF to Office formats
-      expect(getEndpointName('pdf', 'docx')).toBe('pdf-to-word');
-      expect(getEndpointName('pdf', 'odt')).toBe('pdf-to-word');
-      expect(getEndpointName('pdf', 'pptx')).toBe('pdf-to-presentation');
-      expect(getEndpointName('pdf', 'odp')).toBe('pdf-to-presentation');
-      
+      expect(getEndpointName("pdf", "docx")).toBe("pdf-to-word");
+      expect(getEndpointName("pdf", "odt")).toBe("pdf-to-word");
+      expect(getEndpointName("pdf", "pptx")).toBe("pdf-to-presentation");
+      expect(getEndpointName("pdf", "odp")).toBe("pdf-to-presentation");
+
       // PDF to Data formats
-      expect(getEndpointName('pdf', 'csv')).toBe('pdf-to-csv');
-      expect(getEndpointName('pdf', 'txt')).toBe('pdf-to-text');
-      expect(getEndpointName('pdf', 'rtf')).toBe('pdf-to-text');
-      expect(getEndpointName('pdf', 'md')).toBe('pdf-to-markdown');
-      
+      expect(getEndpointName("pdf", "csv")).toBe("pdf-to-csv");
+      expect(getEndpointName("pdf", "txt")).toBe("pdf-to-text");
+      expect(getEndpointName("pdf", "rtf")).toBe("pdf-to-text");
+      expect(getEndpointName("pdf", "md")).toBe("pdf-to-markdown");
+
       // PDF to Web formats
-      expect(getEndpointName('pdf', 'html')).toBe('pdf-to-html');
-      expect(getEndpointName('pdf', 'xml')).toBe('pdf-to-xml');
-      
+      expect(getEndpointName("pdf", "html")).toBe("pdf-to-html");
+      expect(getEndpointName("pdf", "xml")).toBe("pdf-to-xml");
+
       // PDF to PDF/A
-      expect(getEndpointName('pdf', 'pdfa')).toBe('pdf-to-pdfa');
-      
+      expect(getEndpointName("pdf", "pdfa")).toBe("pdf-to-pdfa");
+
       // Office Documents to PDF
-      expect(getEndpointName('docx', 'pdf')).toBe('file-to-pdf');
-      expect(getEndpointName('doc', 'pdf')).toBe('file-to-pdf');
-      expect(getEndpointName('odt', 'pdf')).toBe('file-to-pdf');
-      
+      expect(getEndpointName("docx", "pdf")).toBe("file-to-pdf");
+      expect(getEndpointName("doc", "pdf")).toBe("file-to-pdf");
+      expect(getEndpointName("odt", "pdf")).toBe("file-to-pdf");
+
       // Spreadsheets to PDF
-      expect(getEndpointName('xlsx', 'pdf')).toBe('file-to-pdf');
-      expect(getEndpointName('xls', 'pdf')).toBe('file-to-pdf');
-      expect(getEndpointName('ods', 'pdf')).toBe('file-to-pdf');
-      
+      expect(getEndpointName("xlsx", "pdf")).toBe("file-to-pdf");
+      expect(getEndpointName("xls", "pdf")).toBe("file-to-pdf");
+      expect(getEndpointName("ods", "pdf")).toBe("file-to-pdf");
+
       // Presentations to PDF
-      expect(getEndpointName('pptx', 'pdf')).toBe('file-to-pdf');
-      expect(getEndpointName('ppt', 'pdf')).toBe('file-to-pdf');
-      expect(getEndpointName('odp', 'pdf')).toBe('file-to-pdf');
-      
+      expect(getEndpointName("pptx", "pdf")).toBe("file-to-pdf");
+      expect(getEndpointName("ppt", "pdf")).toBe("file-to-pdf");
+      expect(getEndpointName("odp", "pdf")).toBe("file-to-pdf");
+
       // Images to PDF
-      expect(getEndpointName('jpg', 'pdf')).toBe('img-to-pdf');
-      expect(getEndpointName('jpeg', 'pdf')).toBe('img-to-pdf');
-      expect(getEndpointName('png', 'pdf')).toBe('img-to-pdf');
-      expect(getEndpointName('gif', 'pdf')).toBe('img-to-pdf');
-      expect(getEndpointName('bmp', 'pdf')).toBe('img-to-pdf');
-      expect(getEndpointName('tiff', 'pdf')).toBe('img-to-pdf');
-      expect(getEndpointName('webp', 'pdf')).toBe('img-to-pdf');
-      
+      expect(getEndpointName("jpg", "pdf")).toBe("img-to-pdf");
+      expect(getEndpointName("jpeg", "pdf")).toBe("img-to-pdf");
+      expect(getEndpointName("png", "pdf")).toBe("img-to-pdf");
+      expect(getEndpointName("gif", "pdf")).toBe("img-to-pdf");
+      expect(getEndpointName("bmp", "pdf")).toBe("img-to-pdf");
+      expect(getEndpointName("tiff", "pdf")).toBe("img-to-pdf");
+      expect(getEndpointName("webp", "pdf")).toBe("img-to-pdf");
+
       // Web formats to PDF
-      expect(getEndpointName('html', 'pdf')).toBe('html-to-pdf');
-      
+      expect(getEndpointName("html", "pdf")).toBe("html-to-pdf");
+
       // Markdown to PDF
-      expect(getEndpointName('md', 'pdf')).toBe('markdown-to-pdf');
-      
+      expect(getEndpointName("md", "pdf")).toBe("markdown-to-pdf");
+
       // Text formats to PDF
-      expect(getEndpointName('txt', 'pdf')).toBe('file-to-pdf');
-      expect(getEndpointName('rtf', 'pdf')).toBe('file-to-pdf');
-      
+      expect(getEndpointName("txt", "pdf")).toBe("file-to-pdf");
+      expect(getEndpointName("rtf", "pdf")).toBe("file-to-pdf");
+
       // Email to PDF (EML and MSG)
-      expect(getEndpointName('eml', 'pdf')).toBe('eml-to-pdf');
-      expect(getEndpointName('msg', 'pdf')).toBe('eml-to-pdf');
+      expect(getEndpointName("eml", "pdf")).toBe("eml-to-pdf");
+      expect(getEndpointName("msg", "pdf")).toBe("eml-to-pdf");
     });
 
-    test('should return empty string for unsupported conversions', () => {
-      expect(getEndpointName('pdf', 'exe')).toBe('');
-      expect(getEndpointName('wav', 'pdf')).toBe('file-to-pdf'); // Try using file to pdf as fallback
-      expect(getEndpointName('png', 'docx')).toBe(''); // Images can't convert to Word docs
+    test("should return empty string for unsupported conversions", () => {
+      expect(getEndpointName("pdf", "exe")).toBe("");
+      expect(getEndpointName("wav", "pdf")).toBe("file-to-pdf"); // Try using file to pdf as fallback
+      expect(getEndpointName("png", "docx")).toBe(""); // Images can't convert to Word docs
     });
 
-    test('should handle empty or invalid inputs', () => {
-      expect(getEndpointName('', '')).toBe('');
-      expect(getEndpointName('pdf', '')).toBe('');
-      expect(getEndpointName('', 'pdf')).toBe('');
-      expect(getEndpointName('nonexistent', 'alsononexistent')).toBe('');
+    test("should handle empty or invalid inputs", () => {
+      expect(getEndpointName("", "")).toBe("");
+      expect(getEndpointName("pdf", "")).toBe("");
+      expect(getEndpointName("", "pdf")).toBe("");
+      expect(getEndpointName("nonexistent", "alsononexistent")).toBe("");
     });
   });
 
-  describe('getEndpointUrl', () => {
-    
-    test('should return correct endpoint URLs for all supported conversions', () => {
+  describe("getEndpointUrl", () => {
+    test("should return correct endpoint URLs for all supported conversions", () => {
       // PDF to Image formats
-      expect(getEndpointUrl('pdf', 'png')).toBe('/api/v1/convert/pdf/img');
-      expect(getEndpointUrl('pdf', 'jpg')).toBe('/api/v1/convert/pdf/img');
-      expect(getEndpointUrl('pdf', 'gif')).toBe('/api/v1/convert/pdf/img');
-      expect(getEndpointUrl('pdf', 'tiff')).toBe('/api/v1/convert/pdf/img');
-      expect(getEndpointUrl('pdf', 'bmp')).toBe('/api/v1/convert/pdf/img');
-      expect(getEndpointUrl('pdf', 'webp')).toBe('/api/v1/convert/pdf/img');
-      
+      expect(getEndpointUrl("pdf", "png")).toBe("/api/v1/convert/pdf/img");
+      expect(getEndpointUrl("pdf", "jpg")).toBe("/api/v1/convert/pdf/img");
+      expect(getEndpointUrl("pdf", "gif")).toBe("/api/v1/convert/pdf/img");
+      expect(getEndpointUrl("pdf", "tiff")).toBe("/api/v1/convert/pdf/img");
+      expect(getEndpointUrl("pdf", "bmp")).toBe("/api/v1/convert/pdf/img");
+      expect(getEndpointUrl("pdf", "webp")).toBe("/api/v1/convert/pdf/img");
+
       // PDF to Office formats
-      expect(getEndpointUrl('pdf', 'docx')).toBe('/api/v1/convert/pdf/word');
-      expect(getEndpointUrl('pdf', 'odt')).toBe('/api/v1/convert/pdf/word');
-      expect(getEndpointUrl('pdf', 'pptx')).toBe('/api/v1/convert/pdf/presentation');
-      expect(getEndpointUrl('pdf', 'odp')).toBe('/api/v1/convert/pdf/presentation');
-      
+      expect(getEndpointUrl("pdf", "docx")).toBe("/api/v1/convert/pdf/word");
+      expect(getEndpointUrl("pdf", "odt")).toBe("/api/v1/convert/pdf/word");
+      expect(getEndpointUrl("pdf", "pptx")).toBe(
+        "/api/v1/convert/pdf/presentation",
+      );
+      expect(getEndpointUrl("pdf", "odp")).toBe(
+        "/api/v1/convert/pdf/presentation",
+      );
+
       // PDF to Data formats
-      expect(getEndpointUrl('pdf', 'csv')).toBe('/api/v1/convert/pdf/csv');
-      expect(getEndpointUrl('pdf', 'txt')).toBe('/api/v1/convert/pdf/text');
-      expect(getEndpointUrl('pdf', 'rtf')).toBe('/api/v1/convert/pdf/text');
-      expect(getEndpointUrl('pdf', 'md')).toBe('/api/v1/convert/pdf/markdown');
-      
+      expect(getEndpointUrl("pdf", "csv")).toBe("/api/v1/convert/pdf/csv");
+      expect(getEndpointUrl("pdf", "txt")).toBe("/api/v1/convert/pdf/text");
+      expect(getEndpointUrl("pdf", "rtf")).toBe("/api/v1/convert/pdf/text");
+      expect(getEndpointUrl("pdf", "md")).toBe("/api/v1/convert/pdf/markdown");
+
       // PDF to Web formats
-      expect(getEndpointUrl('pdf', 'html')).toBe('/api/v1/convert/pdf/html');
-      expect(getEndpointUrl('pdf', 'xml')).toBe('/api/v1/convert/pdf/xml');
-      
+      expect(getEndpointUrl("pdf", "html")).toBe("/api/v1/convert/pdf/html");
+      expect(getEndpointUrl("pdf", "xml")).toBe("/api/v1/convert/pdf/xml");
+
       // PDF to PDF/A
-      expect(getEndpointUrl('pdf', 'pdfa')).toBe('/api/v1/convert/pdf/pdfa');
-      
+      expect(getEndpointUrl("pdf", "pdfa")).toBe("/api/v1/convert/pdf/pdfa");
+
       // Office Documents to PDF
-      expect(getEndpointUrl('docx', 'pdf')).toBe('/api/v1/convert/file/pdf');
-      expect(getEndpointUrl('doc', 'pdf')).toBe('/api/v1/convert/file/pdf');
-      expect(getEndpointUrl('odt', 'pdf')).toBe('/api/v1/convert/file/pdf');
-      
+      expect(getEndpointUrl("docx", "pdf")).toBe("/api/v1/convert/file/pdf");
+      expect(getEndpointUrl("doc", "pdf")).toBe("/api/v1/convert/file/pdf");
+      expect(getEndpointUrl("odt", "pdf")).toBe("/api/v1/convert/file/pdf");
+
       // Spreadsheets to PDF
-      expect(getEndpointUrl('xlsx', 'pdf')).toBe('/api/v1/convert/file/pdf');
-      expect(getEndpointUrl('xls', 'pdf')).toBe('/api/v1/convert/file/pdf');
-      expect(getEndpointUrl('ods', 'pdf')).toBe('/api/v1/convert/file/pdf');
-      
+      expect(getEndpointUrl("xlsx", "pdf")).toBe("/api/v1/convert/file/pdf");
+      expect(getEndpointUrl("xls", "pdf")).toBe("/api/v1/convert/file/pdf");
+      expect(getEndpointUrl("ods", "pdf")).toBe("/api/v1/convert/file/pdf");
+
       // Presentations to PDF
-      expect(getEndpointUrl('pptx', 'pdf')).toBe('/api/v1/convert/file/pdf');
-      expect(getEndpointUrl('ppt', 'pdf')).toBe('/api/v1/convert/file/pdf');
-      expect(getEndpointUrl('odp', 'pdf')).toBe('/api/v1/convert/file/pdf');
-      
+      expect(getEndpointUrl("pptx", "pdf")).toBe("/api/v1/convert/file/pdf");
+      expect(getEndpointUrl("ppt", "pdf")).toBe("/api/v1/convert/file/pdf");
+      expect(getEndpointUrl("odp", "pdf")).toBe("/api/v1/convert/file/pdf");
+
       // Images to PDF
-      expect(getEndpointUrl('jpg', 'pdf')).toBe('/api/v1/convert/img/pdf');
-      expect(getEndpointUrl('jpeg', 'pdf')).toBe('/api/v1/convert/img/pdf');
-      expect(getEndpointUrl('png', 'pdf')).toBe('/api/v1/convert/img/pdf');
-      expect(getEndpointUrl('gif', 'pdf')).toBe('/api/v1/convert/img/pdf');
-      expect(getEndpointUrl('bmp', 'pdf')).toBe('/api/v1/convert/img/pdf');
-      expect(getEndpointUrl('tiff', 'pdf')).toBe('/api/v1/convert/img/pdf');
-      expect(getEndpointUrl('webp', 'pdf')).toBe('/api/v1/convert/img/pdf');
-      
+      expect(getEndpointUrl("jpg", "pdf")).toBe("/api/v1/convert/img/pdf");
+      expect(getEndpointUrl("jpeg", "pdf")).toBe("/api/v1/convert/img/pdf");
+      expect(getEndpointUrl("png", "pdf")).toBe("/api/v1/convert/img/pdf");
+      expect(getEndpointUrl("gif", "pdf")).toBe("/api/v1/convert/img/pdf");
+      expect(getEndpointUrl("bmp", "pdf")).toBe("/api/v1/convert/img/pdf");
+      expect(getEndpointUrl("tiff", "pdf")).toBe("/api/v1/convert/img/pdf");
+      expect(getEndpointUrl("webp", "pdf")).toBe("/api/v1/convert/img/pdf");
+
       // Web formats to PDF
-      expect(getEndpointUrl('html', 'pdf')).toBe('/api/v1/convert/html/pdf');
-      
+      expect(getEndpointUrl("html", "pdf")).toBe("/api/v1/convert/html/pdf");
+
       // Markdown to PDF
-      expect(getEndpointUrl('md', 'pdf')).toBe('/api/v1/convert/markdown/pdf');
-      
+      expect(getEndpointUrl("md", "pdf")).toBe("/api/v1/convert/markdown/pdf");
+
       // Text formats to PDF
-      expect(getEndpointUrl('txt', 'pdf')).toBe('/api/v1/convert/file/pdf');
-      expect(getEndpointUrl('rtf', 'pdf')).toBe('/api/v1/convert/file/pdf');
-      
+      expect(getEndpointUrl("txt", "pdf")).toBe("/api/v1/convert/file/pdf");
+      expect(getEndpointUrl("rtf", "pdf")).toBe("/api/v1/convert/file/pdf");
+
       // Email to PDF (EML and MSG)
-      expect(getEndpointUrl('eml', 'pdf')).toBe('/api/v1/convert/eml/pdf');
-      expect(getEndpointUrl('msg', 'pdf')).toBe('/api/v1/convert/eml/pdf');
+      expect(getEndpointUrl("eml", "pdf")).toBe("/api/v1/convert/eml/pdf");
+      expect(getEndpointUrl("msg", "pdf")).toBe("/api/v1/convert/eml/pdf");
     });
 
-    test('should return empty string for unsupported conversions', () => {
-      expect(getEndpointUrl('pdf', 'exe')).toBe('');
-      expect(getEndpointUrl('wav', 'pdf')).toBe('/api/v1/convert/file/pdf'); // Try using file to pdf as fallback
-      expect(getEndpointUrl('invalid', 'invalid')).toBe('');
+    test("should return empty string for unsupported conversions", () => {
+      expect(getEndpointUrl("pdf", "exe")).toBe("");
+      expect(getEndpointUrl("wav", "pdf")).toBe("/api/v1/convert/file/pdf"); // Try using file to pdf as fallback
+      expect(getEndpointUrl("invalid", "invalid")).toBe("");
     });
 
-    test('should handle empty inputs', () => {
-      expect(getEndpointUrl('', '')).toBe('');
-      expect(getEndpointUrl('pdf', '')).toBe('');
-      expect(getEndpointUrl('', 'pdf')).toBe('');
+    test("should handle empty inputs", () => {
+      expect(getEndpointUrl("", "")).toBe("");
+      expect(getEndpointUrl("pdf", "")).toBe("");
+      expect(getEndpointUrl("", "pdf")).toBe("");
     });
   });
 
-  describe('isConversionSupported', () => {
-    
-    test('should return true for all supported conversions', () => {
+  describe("isConversionSupported", () => {
+    test("should return true for all supported conversions", () => {
       // PDF to Image formats
-      expect(isConversionSupported('pdf', 'png')).toBe(true);
-      expect(isConversionSupported('pdf', 'jpg')).toBe(true);
-      expect(isConversionSupported('pdf', 'gif')).toBe(true);
-      expect(isConversionSupported('pdf', 'tiff')).toBe(true);
-      expect(isConversionSupported('pdf', 'bmp')).toBe(true);
-      expect(isConversionSupported('pdf', 'webp')).toBe(true);
-      
+      expect(isConversionSupported("pdf", "png")).toBe(true);
+      expect(isConversionSupported("pdf", "jpg")).toBe(true);
+      expect(isConversionSupported("pdf", "gif")).toBe(true);
+      expect(isConversionSupported("pdf", "tiff")).toBe(true);
+      expect(isConversionSupported("pdf", "bmp")).toBe(true);
+      expect(isConversionSupported("pdf", "webp")).toBe(true);
+
       // PDF to Office formats
-      expect(isConversionSupported('pdf', 'docx')).toBe(true);
-      expect(isConversionSupported('pdf', 'odt')).toBe(true);
-      expect(isConversionSupported('pdf', 'pptx')).toBe(true);
-      expect(isConversionSupported('pdf', 'odp')).toBe(true);
-      
+      expect(isConversionSupported("pdf", "docx")).toBe(true);
+      expect(isConversionSupported("pdf", "odt")).toBe(true);
+      expect(isConversionSupported("pdf", "pptx")).toBe(true);
+      expect(isConversionSupported("pdf", "odp")).toBe(true);
+
       // PDF to Data formats
-      expect(isConversionSupported('pdf', 'csv')).toBe(true);
-      expect(isConversionSupported('pdf', 'txt')).toBe(true);
-      expect(isConversionSupported('pdf', 'rtf')).toBe(true);
-      expect(isConversionSupported('pdf', 'md')).toBe(true);
-      
+      expect(isConversionSupported("pdf", "csv")).toBe(true);
+      expect(isConversionSupported("pdf", "txt")).toBe(true);
+      expect(isConversionSupported("pdf", "rtf")).toBe(true);
+      expect(isConversionSupported("pdf", "md")).toBe(true);
+
       // PDF to Web formats
-      expect(isConversionSupported('pdf', 'html')).toBe(true);
-      expect(isConversionSupported('pdf', 'xml')).toBe(true);
-      
+      expect(isConversionSupported("pdf", "html")).toBe(true);
+      expect(isConversionSupported("pdf", "xml")).toBe(true);
+
       // PDF to PDF/A
-      expect(isConversionSupported('pdf', 'pdfa')).toBe(true);
-      
+      expect(isConversionSupported("pdf", "pdfa")).toBe(true);
+
       // Office Documents to PDF
-      expect(isConversionSupported('docx', 'pdf')).toBe(true);
-      expect(isConversionSupported('doc', 'pdf')).toBe(true);
-      expect(isConversionSupported('odt', 'pdf')).toBe(true);
-      
+      expect(isConversionSupported("docx", "pdf")).toBe(true);
+      expect(isConversionSupported("doc", "pdf")).toBe(true);
+      expect(isConversionSupported("odt", "pdf")).toBe(true);
+
       // Spreadsheets to PDF
-      expect(isConversionSupported('xlsx', 'pdf')).toBe(true);
-      expect(isConversionSupported('xls', 'pdf')).toBe(true);
-      expect(isConversionSupported('ods', 'pdf')).toBe(true);
-      
+      expect(isConversionSupported("xlsx", "pdf")).toBe(true);
+      expect(isConversionSupported("xls", "pdf")).toBe(true);
+      expect(isConversionSupported("ods", "pdf")).toBe(true);
+
       // Presentations to PDF
-      expect(isConversionSupported('pptx', 'pdf')).toBe(true);
-      expect(isConversionSupported('ppt', 'pdf')).toBe(true);
-      expect(isConversionSupported('odp', 'pdf')).toBe(true);
-      
+      expect(isConversionSupported("pptx", "pdf")).toBe(true);
+      expect(isConversionSupported("ppt", "pdf")).toBe(true);
+      expect(isConversionSupported("odp", "pdf")).toBe(true);
+
       // Images to PDF
-      expect(isConversionSupported('jpg', 'pdf')).toBe(true);
-      expect(isConversionSupported('jpeg', 'pdf')).toBe(true);
-      expect(isConversionSupported('png', 'pdf')).toBe(true);
-      expect(isConversionSupported('gif', 'pdf')).toBe(true);
-      expect(isConversionSupported('bmp', 'pdf')).toBe(true);
-      expect(isConversionSupported('tiff', 'pdf')).toBe(true);
-      expect(isConversionSupported('webp', 'pdf')).toBe(true);
-      
+      expect(isConversionSupported("jpg", "pdf")).toBe(true);
+      expect(isConversionSupported("jpeg", "pdf")).toBe(true);
+      expect(isConversionSupported("png", "pdf")).toBe(true);
+      expect(isConversionSupported("gif", "pdf")).toBe(true);
+      expect(isConversionSupported("bmp", "pdf")).toBe(true);
+      expect(isConversionSupported("tiff", "pdf")).toBe(true);
+      expect(isConversionSupported("webp", "pdf")).toBe(true);
+
       // Web formats to PDF
-      expect(isConversionSupported('html', 'pdf')).toBe(true);
-      expect(isConversionSupported('htm', 'pdf')).toBe(true);
-      
+      expect(isConversionSupported("html", "pdf")).toBe(true);
+      expect(isConversionSupported("htm", "pdf")).toBe(true);
+
       // Markdown to PDF
-      expect(isConversionSupported('md', 'pdf')).toBe(true);
-      
+      expect(isConversionSupported("md", "pdf")).toBe(true);
+
       // Text formats to PDF
-      expect(isConversionSupported('txt', 'pdf')).toBe(true);
-      expect(isConversionSupported('rtf', 'pdf')).toBe(true);
-      
+      expect(isConversionSupported("txt", "pdf")).toBe(true);
+      expect(isConversionSupported("rtf", "pdf")).toBe(true);
+
       // Email to PDF (EML and MSG)
-      expect(isConversionSupported('eml', 'pdf')).toBe(true);
-      expect(isConversionSupported('msg', 'pdf')).toBe(true);
+      expect(isConversionSupported("eml", "pdf")).toBe(true);
+      expect(isConversionSupported("msg", "pdf")).toBe(true);
     });
 
-    test('should return false for unsupported conversions', () => {
-      expect(isConversionSupported('pdf', 'exe')).toBe(false);
-      expect(isConversionSupported('wav', 'pdf')).toBe(true); // Fallback to file to pdf
-      expect(isConversionSupported('png', 'docx')).toBe(false);
-      expect(isConversionSupported('nonexistent', 'alsononexistent')).toBe(false);
+    test("should return false for unsupported conversions", () => {
+      expect(isConversionSupported("pdf", "exe")).toBe(false);
+      expect(isConversionSupported("wav", "pdf")).toBe(true); // Fallback to file to pdf
+      expect(isConversionSupported("png", "docx")).toBe(false);
+      expect(isConversionSupported("nonexistent", "alsononexistent")).toBe(
+        false,
+      );
     });
 
-    test('should handle empty inputs', () => {
-      expect(isConversionSupported('', '')).toBe(false);
-      expect(isConversionSupported('pdf', '')).toBe(false);
-      expect(isConversionSupported('', 'pdf')).toBe(false);
+    test("should handle empty inputs", () => {
+      expect(isConversionSupported("", "")).toBe(false);
+      expect(isConversionSupported("pdf", "")).toBe(false);
+      expect(isConversionSupported("", "pdf")).toBe(false);
     });
   });
 
-  describe('isImageFormat', () => {
-    
-    test('should return true for image formats', () => {
-      expect(isImageFormat('png')).toBe(true);
-      expect(isImageFormat('jpg')).toBe(true);
-      expect(isImageFormat('jpeg')).toBe(true);
-      expect(isImageFormat('gif')).toBe(true);
-      expect(isImageFormat('tiff')).toBe(true);
-      expect(isImageFormat('bmp')).toBe(true);
-      expect(isImageFormat('webp')).toBe(true);
+  describe("isImageFormat", () => {
+    test("should return true for image formats", () => {
+      expect(isImageFormat("png")).toBe(true);
+      expect(isImageFormat("jpg")).toBe(true);
+      expect(isImageFormat("jpeg")).toBe(true);
+      expect(isImageFormat("gif")).toBe(true);
+      expect(isImageFormat("tiff")).toBe(true);
+      expect(isImageFormat("bmp")).toBe(true);
+      expect(isImageFormat("webp")).toBe(true);
     });
 
-    test('should return false for non-image formats', () => {
-      expect(isImageFormat('pdf')).toBe(false);
-      expect(isImageFormat('docx')).toBe(false);
-      expect(isImageFormat('txt')).toBe(false);
-      expect(isImageFormat('csv')).toBe(false);
-      expect(isImageFormat('html')).toBe(false);
-      expect(isImageFormat('xml')).toBe(false);
+    test("should return false for non-image formats", () => {
+      expect(isImageFormat("pdf")).toBe(false);
+      expect(isImageFormat("docx")).toBe(false);
+      expect(isImageFormat("txt")).toBe(false);
+      expect(isImageFormat("csv")).toBe(false);
+      expect(isImageFormat("html")).toBe(false);
+      expect(isImageFormat("xml")).toBe(false);
     });
 
-    test('should handle case insensitivity', () => {
-      expect(isImageFormat('PNG')).toBe(true);
-      expect(isImageFormat('JPG')).toBe(true);
-      expect(isImageFormat('JPEG')).toBe(true);
-      expect(isImageFormat('Png')).toBe(true);
-      expect(isImageFormat('JpG')).toBe(true);
+    test("should handle case insensitivity", () => {
+      expect(isImageFormat("PNG")).toBe(true);
+      expect(isImageFormat("JPG")).toBe(true);
+      expect(isImageFormat("JPEG")).toBe(true);
+      expect(isImageFormat("Png")).toBe(true);
+      expect(isImageFormat("JpG")).toBe(true);
     });
 
-    test('should handle empty and invalid inputs', () => {
-      expect(isImageFormat('')).toBe(false);
-      expect(isImageFormat('invalid')).toBe(false);
-      expect(isImageFormat('123')).toBe(false);
-      expect(isImageFormat('.')).toBe(false);
+    test("should handle empty and invalid inputs", () => {
+      expect(isImageFormat("")).toBe(false);
+      expect(isImageFormat("invalid")).toBe(false);
+      expect(isImageFormat("123")).toBe(false);
+      expect(isImageFormat(".")).toBe(false);
     });
 
-    test('should handle mixed case and edge cases', () => {
-      expect(isImageFormat('webP')).toBe(true);
-      expect(isImageFormat('WEBP')).toBe(true);
-      expect(isImageFormat('tIFf')).toBe(true);
-      expect(isImageFormat('bMp')).toBe(true);
+    test("should handle mixed case and edge cases", () => {
+      expect(isImageFormat("webP")).toBe(true);
+      expect(isImageFormat("WEBP")).toBe(true);
+      expect(isImageFormat("tIFf")).toBe(true);
+      expect(isImageFormat("bMp")).toBe(true);
     });
   });
 
-  describe('Edge Cases and Error Handling', () => {
-    
-    test('should handle null and undefined inputs gracefully', () => {
+  describe("Edge Cases and Error Handling", () => {
+    test("should handle null and undefined inputs gracefully", () => {
       // Note: TypeScript prevents these, but test runtime behavior for robustness
       // The current implementation handles these gracefully by returning falsy values
-      expect(getEndpointName(null as any, null as any)).toBe('');
-      expect(getEndpointUrl(undefined as any, undefined as any)).toBe('');
+      expect(getEndpointName(null as any, null as any)).toBe("");
+      expect(getEndpointUrl(undefined as any, undefined as any)).toBe("");
       expect(isConversionSupported(null as any, null as any)).toBe(false);
-      
+
       // isImageFormat will throw because it calls toLowerCase() on null/undefined
       expect(() => isImageFormat(null as any)).toThrow();
       expect(() => isImageFormat(undefined as any)).toThrow();
     });
 
-    test('should handle special characters in file extensions', () => {
-      expect(isImageFormat('png@')).toBe(false);
-      expect(isImageFormat('jpg#')).toBe(false);
-      expect(isImageFormat('png.')).toBe(false);
-      expect(getEndpointName('pdf@', 'png')).toBe('');
-      expect(getEndpointName('pdf', 'png#')).toBe('');
+    test("should handle special characters in file extensions", () => {
+      expect(isImageFormat("png@")).toBe(false);
+      expect(isImageFormat("jpg#")).toBe(false);
+      expect(isImageFormat("png.")).toBe(false);
+      expect(getEndpointName("pdf@", "png")).toBe("");
+      expect(getEndpointName("pdf", "png#")).toBe("");
     });
 
-    test('should handle very long extension names', () => {
-      const longExtension = 'a'.repeat(100);
+    test("should handle very long extension names", () => {
+      const longExtension = "a".repeat(100);
       expect(isImageFormat(longExtension)).toBe(false);
-      expect(getEndpointName('pdf', longExtension)).toBe('');
-      expect(getEndpointName(longExtension, 'pdf')).toBe('file-to-pdf'); // Fallback to file to pdf
+      expect(getEndpointName("pdf", longExtension)).toBe("");
+      expect(getEndpointName(longExtension, "pdf")).toBe("file-to-pdf"); // Fallback to file to pdf
     });
   });
-});
\ No newline at end of file
+});
diff --git a/frontend/src/core/utils/convertUtils.ts b/frontend/src/core/utils/convertUtils.ts
index eee179d82b..8086986621 100644
--- a/frontend/src/core/utils/convertUtils.ts
+++ b/frontend/src/core/utils/convertUtils.ts
@@ -3,32 +3,38 @@ import {
   ENDPOINT_NAMES,
   EXTENSION_TO_ENDPOINT,
   CONVERSION_MATRIX,
-  TO_FORMAT_OPTIONS
-} from '@app/constants/convertConstants';
+  TO_FORMAT_OPTIONS,
+} from "@app/constants/convertConstants";
 
 /**
  * Resolves the endpoint name for a given conversion
  */
-export const getEndpointName = (fromExtension: string, toExtension: string): string => {
-  if (!fromExtension || !toExtension) return '';
+export const getEndpointName = (
+  fromExtension: string,
+  toExtension: string,
+): string => {
+  if (!fromExtension || !toExtension) return "";
 
   let endpointKey = EXTENSION_TO_ENDPOINT[fromExtension]?.[toExtension];
 
   // If no explicit mapping exists and we're converting to PDF,
   // fall back to 'any' which uses file-to-pdf endpoint
-  if (!endpointKey && toExtension === 'pdf' && fromExtension !== 'any') {
-    endpointKey = EXTENSION_TO_ENDPOINT['any']?.[toExtension];
+  if (!endpointKey && toExtension === "pdf" && fromExtension !== "any") {
+    endpointKey = EXTENSION_TO_ENDPOINT["any"]?.[toExtension];
   }
 
-  return endpointKey || '';
+  return endpointKey || "";
 };
 
 /**
  * Resolves the full endpoint URL for a given conversion
  */
-export const getEndpointUrl = (fromExtension: string, toExtension: string): string => {
+export const getEndpointUrl = (
+  fromExtension: string,
+  toExtension: string,
+): string => {
   const endpointName = getEndpointName(fromExtension, toExtension);
-  if (!endpointName) return '';
+  if (!endpointName) return "";
 
   // Find the endpoint URL from CONVERSION_ENDPOINTS using the endpoint name
   for (const [key, endpoint] of Object.entries(CONVERSION_ENDPOINTS)) {
@@ -36,32 +42,37 @@ export const getEndpointUrl = (fromExtension: string, toExtension: string): stri
       return endpoint;
     }
   }
-  return '';
+  return "";
 };
 
 /**
  * Checks if a conversion is supported
  */
-export const isConversionSupported = (fromExtension: string, toExtension: string): boolean => {
-  return getEndpointName(fromExtension, toExtension) !== '';
+export const isConversionSupported = (
+  fromExtension: string,
+  toExtension: string,
+): boolean => {
+  return getEndpointName(fromExtension, toExtension) !== "";
 };
 
 /**
  * Checks if the given extension is an image format
  */
 export const isImageFormat = (extension: string): boolean => {
-  return ['png', 'jpg', 'jpeg', 'gif', 'tiff', 'bmp', 'webp'].includes(extension.toLowerCase());
+  return ["png", "jpg", "jpeg", "gif", "tiff", "bmp", "webp"].includes(
+    extension.toLowerCase(),
+  );
 };
 
 export const isSvgFormat = (extension: string): boolean => {
-  return extension.toLowerCase() === 'svg';
+  return extension.toLowerCase() === "svg";
 };
 
 /**
  * Checks if the given extension is a web format
  */
 export const isWebFormat = (extension: string): boolean => {
-  return ['html', 'zip'].includes(extension.toLowerCase());
+  return ["html", "zip"].includes(extension.toLowerCase());
 };
 
 /**
@@ -70,9 +81,15 @@ export const isWebFormat = (extension: string): boolean => {
  */
 export const isOfficeFormat = (extension: string): boolean => {
   return [
-    'docx', 'doc', 'odt',  // Word processors
-    'xlsx', 'xls', 'ods',  // Spreadsheets
-    'pptx', 'ppt', 'odp'   // Presentations
+    "docx",
+    "doc",
+    "odt", // Word processors
+    "xlsx",
+    "xls",
+    "ods", // Spreadsheets
+    "pptx",
+    "ppt",
+    "odp", // Presentations
   ].includes(extension.toLowerCase());
 };
 
@@ -80,15 +97,17 @@ export const isOfficeFormat = (extension: string): boolean => {
  * Gets available target extensions for a given source extension
  * Extracted from useConvertParameters to be reusable in automation settings
  */
-export const getAvailableToExtensions = (fromExtension: string): Array<{value: string, label: string, group: string}> => {
+export const getAvailableToExtensions = (
+  fromExtension: string,
+): Array<{ value: string; label: string; group: string }> => {
   if (!fromExtension) return [];
 
   // Handle dynamic format identifiers (file-<extension>)
-  if (fromExtension.startsWith('file-')) {
+  if (fromExtension.startsWith("file-")) {
     // Dynamic format - use 'any' conversion options (file-to-pdf)
-    const supportedExtensions = CONVERSION_MATRIX['any'] || [];
-    return TO_FORMAT_OPTIONS.filter(option =>
-      supportedExtensions.includes(option.value)
+    const supportedExtensions = CONVERSION_MATRIX["any"] || [];
+    return TO_FORMAT_OPTIONS.filter((option) =>
+      supportedExtensions.includes(option.value),
     );
   }
 
@@ -96,11 +115,11 @@ export const getAvailableToExtensions = (fromExtension: string): Array<{value: s
 
   // If no explicit conversion exists, but file-to-pdf might be available,
   // fall back to 'any' conversion (which converts unknown files to PDF via file-to-pdf)
-  if (supportedExtensions.length === 0 && fromExtension !== 'any') {
-    supportedExtensions = CONVERSION_MATRIX['any'] || [];
+  if (supportedExtensions.length === 0 && fromExtension !== "any") {
+    supportedExtensions = CONVERSION_MATRIX["any"] || [];
   }
 
-  return TO_FORMAT_OPTIONS.filter(option =>
-    supportedExtensions.includes(option.value)
+  return TO_FORMAT_OPTIONS.filter((option) =>
+    supportedExtensions.includes(option.value),
   );
 };
diff --git a/frontend/src/core/utils/cropCoordinates.ts b/frontend/src/core/utils/cropCoordinates.ts
index a8c7192f4e..5a275c85ea 100644
--- a/frontend/src/core/utils/cropCoordinates.ts
+++ b/frontend/src/core/utils/cropCoordinates.ts
@@ -55,7 +55,7 @@ export const calculatePDFBounds = (
   actualPDFWidth: number,
   actualPDFHeight: number,
   containerWidth: number,
-  containerHeight: number
+  containerHeight: number,
 ): PDFBounds => {
   // Calculate scale to fit PDF within container while maintaining aspect ratio
   const scaleX = containerWidth / actualPDFWidth;
@@ -77,7 +77,7 @@ export const calculatePDFBounds = (
     thumbnailHeight,
     offsetX,
     offsetY,
-    scale
+    scale,
   };
 };
 
@@ -87,7 +87,7 @@ export const calculatePDFBounds = (
  */
 export const domToPDFCoordinates = (
   domRect: Rectangle,
-  pdfBounds: PDFBounds
+  pdfBounds: PDFBounds,
 ): Rectangle => {
   // Convert DOM coordinates to thumbnail-relative coordinates
   const thumbX = domRect.x - pdfBounds.offsetX;
@@ -95,7 +95,8 @@ export const domToPDFCoordinates = (
 
   // Convert to PDF coordinates (scale and flip Y-axis)
   const pdfX = thumbX / pdfBounds.scale;
-  const pdfY = pdfBounds.actualHeight - ((thumbY + domRect.height) / pdfBounds.scale);
+  const pdfY =
+    pdfBounds.actualHeight - (thumbY + domRect.height) / pdfBounds.scale;
   const pdfWidth = domRect.width / pdfBounds.scale;
   const pdfHeight = domRect.height / pdfBounds.scale;
 
@@ -103,7 +104,7 @@ export const domToPDFCoordinates = (
     x: pdfX,
     y: pdfY,
     width: pdfWidth,
-    height: pdfHeight
+    height: pdfHeight,
   };
 };
 
@@ -112,11 +113,12 @@ export const domToPDFCoordinates = (
  */
 export const pdfToDOMCoordinates = (
   cropArea: Rectangle,
-  pdfBounds: PDFBounds
+  pdfBounds: PDFBounds,
 ): Rectangle => {
   // Convert PDF coordinates to thumbnail coordinates (scale and flip Y-axis)
   const thumbX = cropArea.x * pdfBounds.scale;
-  const thumbY = (pdfBounds.actualHeight - cropArea.y - cropArea.height) * pdfBounds.scale;
+  const thumbY =
+    (pdfBounds.actualHeight - cropArea.y - cropArea.height) * pdfBounds.scale;
   const thumbWidth = cropArea.width * pdfBounds.scale;
   const thumbHeight = cropArea.height * pdfBounds.scale;
 
@@ -125,7 +127,7 @@ export const pdfToDOMCoordinates = (
     x: thumbX + pdfBounds.offsetX,
     y: thumbY + pdfBounds.offsetY,
     width: thumbWidth,
-    height: thumbHeight
+    height: thumbHeight,
   };
 };
 
@@ -134,7 +136,7 @@ export const pdfToDOMCoordinates = (
  */
 export const constrainCropAreaToPDF = (
   cropArea: Rectangle,
-  pdfBounds: PDFBounds
+  pdfBounds: PDFBounds,
 ): Rectangle => {
   // Ensure crop area doesn't extend beyond PDF boundaries
   const maxX = Math.max(0, pdfBounds.actualWidth - cropArea.width);
@@ -143,8 +145,14 @@ export const constrainCropAreaToPDF = (
   return {
     x: Math.max(0, Math.min(cropArea.x, maxX)),
     y: Math.max(0, Math.min(cropArea.y, maxY)),
-    width: Math.min(cropArea.width, pdfBounds.actualWidth - Math.max(0, cropArea.x)),
-    height: Math.min(cropArea.height, pdfBounds.actualHeight - Math.max(0, cropArea.y))
+    width: Math.min(
+      cropArea.width,
+      pdfBounds.actualWidth - Math.max(0, cropArea.x),
+    ),
+    height: Math.min(
+      cropArea.height,
+      pdfBounds.actualHeight - Math.max(0, cropArea.y),
+    ),
   };
 };
 
@@ -153,7 +161,7 @@ export const constrainCropAreaToPDF = (
  */
 export const constrainDOMRectToThumbnail = (
   domRect: Rectangle,
-  pdfBounds: PDFBounds
+  pdfBounds: PDFBounds,
 ): Rectangle => {
   const thumbnailLeft = pdfBounds.offsetX;
   const thumbnailTop = pdfBounds.offsetY;
@@ -175,7 +183,7 @@ export const constrainDOMRectToThumbnail = (
     x: constrainedX,
     y: constrainedY,
     width: Math.min(domRect.width, maxWidth),
-    height: Math.min(domRect.height, maxHeight)
+    height: Math.min(domRect.height, maxHeight),
   };
 };
 
@@ -185,12 +193,14 @@ export const constrainDOMRectToThumbnail = (
 export const isPointInThumbnail = (
   x: number,
   y: number,
-  pdfBounds: PDFBounds
+  pdfBounds: PDFBounds,
 ): boolean => {
-  return x >= pdfBounds.offsetX &&
-         x <= pdfBounds.offsetX + pdfBounds.thumbnailWidth &&
-         y >= pdfBounds.offsetY &&
-         y <= pdfBounds.offsetY + pdfBounds.thumbnailHeight;
+  return (
+    x >= pdfBounds.offsetX &&
+    x <= pdfBounds.offsetX + pdfBounds.thumbnailWidth &&
+    y >= pdfBounds.offsetY &&
+    y <= pdfBounds.offsetY + pdfBounds.thumbnailHeight
+  );
 };
 
 /**
@@ -201,7 +211,7 @@ export const createFullPDFCropArea = (pdfBounds: PDFBounds): Rectangle => {
     x: 0,
     y: 0,
     width: pdfBounds.actualWidth,
-    height: pdfBounds.actualHeight
+    height: pdfBounds.actualHeight,
   };
 };
 
@@ -213,6 +223,6 @@ export const roundCropArea = (cropArea: Rectangle): Rectangle => {
     x: Math.round(cropArea.x * 10) / 10,
     y: Math.round(cropArea.y * 10) / 10,
     width: Math.round(cropArea.width * 10) / 10,
-    height: Math.round(cropArea.height * 10) / 10
+    height: Math.round(cropArea.height * 10) / 10,
   };
 };
diff --git a/frontend/src/core/utils/downloadUtils.ts b/frontend/src/core/utils/downloadUtils.ts
index f6c1ff347d..b4af832a29 100644
--- a/frontend/src/core/utils/downloadUtils.ts
+++ b/frontend/src/core/utils/downloadUtils.ts
@@ -1,7 +1,7 @@
-import { StirlingFileStub } from '@app/types/fileContext';
-import { fileStorage } from '@app/services/fileStorage';
-import { zipFileService } from '@app/services/zipFileService';
-import { downloadFile } from '@app/services/downloadService';
+import { StirlingFileStub } from "@app/types/fileContext";
+import { fileStorage } from "@app/services/fileStorage";
+import { zipFileService } from "@app/services/zipFileService";
+import { downloadFile } from "@app/services/downloadService";
 
 /**
  * Downloads a blob as a file using browser download API
@@ -17,7 +17,9 @@ export function downloadBlob(blob: Blob, filename: string): void {
  * @param file - The file object with storage information
  * @throws Error if file cannot be retrieved from storage
  */
-export async function downloadFileFromStorage(file: StirlingFileStub): Promise<void> {
+export async function downloadFileFromStorage(
+  file: StirlingFileStub,
+): Promise<void> {
   const lookupKey = file.id;
   const stirlingFile = await fileStorage.getStirlingFile(lookupKey);
 
@@ -28,7 +30,7 @@ export async function downloadFileFromStorage(file: StirlingFileStub): Promise<v
   await downloadFile({
     data: stirlingFile,
     filename: stirlingFile.name,
-    localPath: file.localFilePath
+    localPath: file.localFilePath,
   });
 }
 
@@ -36,7 +38,9 @@ export async function downloadFileFromStorage(file: StirlingFileStub): Promise<v
  * Downloads multiple files as individual downloads
  * @param files - Array of files to download
  */
-export async function downloadMultipleFiles(files: StirlingFileStub[]): Promise<void> {
+export async function downloadMultipleFiles(
+  files: StirlingFileStub[],
+): Promise<void> {
   for (const file of files) {
     await downloadFileFromStorage(file);
   }
@@ -47,9 +51,12 @@ export async function downloadMultipleFiles(files: StirlingFileStub[]): Promise<
  * @param files - Array of files to include in ZIP
  * @param zipFilename - Optional custom ZIP filename (defaults to timestamped name)
  */
-export async function downloadFilesAsZip(files: StirlingFileStub[], zipFilename?: string): Promise<void> {
+export async function downloadFilesAsZip(
+  files: StirlingFileStub[],
+  zipFilename?: string,
+): Promise<void> {
   if (files.length === 0) {
-    throw new Error('No files provided for ZIP download');
+    throw new Error("No files provided for ZIP download");
   }
 
   // Convert stored files to File objects
@@ -65,15 +72,19 @@ export async function downloadFilesAsZip(files: StirlingFileStub[], zipFilename?
   }
 
   if (filesToZip.length === 0) {
-    throw new Error('No valid files found in storage for ZIP download');
+    throw new Error("No valid files found in storage for ZIP download");
   }
 
   // Generate default filename if not provided
-  const finalZipFilename = zipFilename ||
-    `files-${new Date().toISOString().slice(0, 19).replace(/[:-]/g, '')}.zip`;
+  const finalZipFilename =
+    zipFilename ||
+    `files-${new Date().toISOString().slice(0, 19).replace(/[:-]/g, "")}.zip`;
 
   // Create and download ZIP
-  const { zipFile } = await zipFileService.createZipFromFiles(filesToZip, finalZipFilename);
+  const { zipFile } = await zipFileService.createZipFromFiles(
+    filesToZip,
+    finalZipFilename,
+  );
   await downloadFile({ data: zipFile, filename: finalZipFilename });
 }
 
@@ -90,10 +101,10 @@ export async function downloadFiles(
     forceZip?: boolean;
     zipFilename?: string;
     multipleAsIndividual?: boolean;
-  } = {}
+  } = {},
 ): Promise<void> {
   if (files.length === 0) {
-    throw new Error('No files provided for download');
+    throw new Error("No files provided for download");
   }
 
   if (files.length === 1 && !options.forceZip) {
@@ -126,7 +137,7 @@ export function downloadFileObject(file: File, filename?: string): void {
 export function downloadTextAsFile(
   content: string,
   filename: string,
-  mimeType: string = 'text/plain'
+  mimeType: string = "text/plain",
 ): void {
   const blob = new Blob([content], { type: mimeType });
   void downloadFile({ data: blob, filename });
@@ -139,5 +150,5 @@ export function downloadTextAsFile(
  */
 export function downloadJsonAsFile(data: any, filename: string): void {
   const content = JSON.stringify(data, null, 2);
-  downloadTextAsFile(content, filename, 'application/json');
+  downloadTextAsFile(content, filename, "application/json");
 }
diff --git a/frontend/src/core/utils/editTableOfContents.ts b/frontend/src/core/utils/editTableOfContents.ts
index 2c7762a453..bb6119ae31 100644
--- a/frontend/src/core/utils/editTableOfContents.ts
+++ b/frontend/src/core/utils/editTableOfContents.ts
@@ -13,33 +13,44 @@ export interface BookmarkNode {
 }
 
 const createBookmarkId = () => {
-  if (typeof crypto !== 'undefined' && 'randomUUID' in crypto) {
+  if (typeof crypto !== "undefined" && "randomUUID" in crypto) {
     return crypto.randomUUID();
   }
 
   return `bookmark-${Date.now()}-${Math.random().toString(36).slice(2, 8)}`;
 };
 
-export const createBookmarkNode = (bookmark?: Partial<BookmarkNode>): BookmarkNode => ({
+export const createBookmarkNode = (
+  bookmark?: Partial<BookmarkNode>,
+): BookmarkNode => ({
   id: bookmark?.id ?? createBookmarkId(),
-  title: bookmark?.title ?? '',
+  title: bookmark?.title ?? "",
   pageNumber: bookmark?.pageNumber ?? 1,
-  children: bookmark?.children ? bookmark.children.map(child => createBookmarkNode(child)) : [],
+  children: bookmark?.children
+    ? bookmark.children.map((child) => createBookmarkNode(child))
+    : [],
   expanded: bookmark?.expanded ?? true,
 });
 
-export const hydrateBookmarkPayload = (payload: BookmarkPayload[] = []): BookmarkNode[] => {
-  return payload.map(item => ({
+export const hydrateBookmarkPayload = (
+  payload: BookmarkPayload[] = [],
+): BookmarkNode[] => {
+  return payload.map((item) => ({
     id: createBookmarkId(),
-    title: item.title ?? '',
-    pageNumber: typeof item.pageNumber === 'number' && item.pageNumber > 0 ? item.pageNumber : 1,
+    title: item.title ?? "",
+    pageNumber:
+      typeof item.pageNumber === "number" && item.pageNumber > 0
+        ? item.pageNumber
+        : 1,
     expanded: true,
     children: item.children ? hydrateBookmarkPayload(item.children) : [],
   }));
 };
 
-export const serializeBookmarkNodes = (bookmarks: BookmarkNode[]): BookmarkPayload[] => {
-  return bookmarks.map(bookmark => ({
+export const serializeBookmarkNodes = (
+  bookmarks: BookmarkNode[],
+): BookmarkPayload[] => {
+  return bookmarks.map((bookmark) => ({
     title: bookmark.title,
     pageNumber: bookmark.pageNumber,
     children: serializeBookmarkNodes(bookmark.children),
diff --git a/frontend/src/core/utils/fileDialogUtils.ts b/frontend/src/core/utils/fileDialogUtils.ts
index afd76b5664..4f39944f86 100644
--- a/frontend/src/core/utils/fileDialogUtils.ts
+++ b/frontend/src/core/utils/fileDialogUtils.ts
@@ -1,6 +1,18 @@
 export function getDocumentFileDialogFilter() {
-  return [{
-    name: 'Documents',
-    extensions: ['pdf', 'jpg', 'jpeg', 'png', 'gif', 'tiff', 'bmp', 'html', 'zip']
-  }];
+  return [
+    {
+      name: "Documents",
+      extensions: [
+        "pdf",
+        "jpg",
+        "jpeg",
+        "png",
+        "gif",
+        "tiff",
+        "bmp",
+        "html",
+        "zip",
+      ],
+    },
+  ];
 }
diff --git a/frontend/src/core/utils/fileHash.ts b/frontend/src/core/utils/fileHash.ts
index 3ff911a562..9010a02844 100644
--- a/frontend/src/core/utils/fileHash.ts
+++ b/frontend/src/core/utils/fileHash.ts
@@ -31,83 +31,90 @@ export class FileHasher {
    */
   static async generateHybridHash(file: File): Promise<string> {
     const metadataHash = this.generateMetadataHash(file);
-    
+
     // For small files, use full content hash
-    if (file.size <= 1024 * 1024) { // 1MB
+    if (file.size <= 1024 * 1024) {
+      // 1MB
       const contentHash = await this.generateContentHash(file);
       return `${metadataHash}-${contentHash}`;
     }
-    
+
     // For large files, use first chunk only
     const firstChunk = file.slice(0, this.CHUNK_SIZE);
     const firstChunkBuffer = await firstChunk.arrayBuffer();
     const firstChunkHash = await this.hashArrayBuffer(firstChunkBuffer);
-    
+
     return `${metadataHash}-${firstChunkHash}`;
   }
 
   private static async getFileChunks(file: File): Promise<ArrayBuffer[]> {
     const chunks: ArrayBuffer[] = [];
-    
+
     // First chunk
     if (file.size > 0) {
       const firstChunk = file.slice(0, Math.min(this.CHUNK_SIZE, file.size));
       chunks.push(await firstChunk.arrayBuffer());
     }
-    
+
     // Middle chunk (if file is large enough)
     if (file.size > this.CHUNK_SIZE * 2) {
-      const middleStart = Math.floor(file.size / 2) - Math.floor(this.CHUNK_SIZE / 2);
+      const middleStart =
+        Math.floor(file.size / 2) - Math.floor(this.CHUNK_SIZE / 2);
       const middleEnd = middleStart + this.CHUNK_SIZE;
       const middleChunk = file.slice(middleStart, middleEnd);
       chunks.push(await middleChunk.arrayBuffer());
     }
-    
+
     // Last chunk (if file is large enough and different from first)
     if (file.size > this.CHUNK_SIZE) {
       const lastStart = Math.max(file.size - this.CHUNK_SIZE, this.CHUNK_SIZE);
       const lastChunk = file.slice(lastStart);
       chunks.push(await lastChunk.arrayBuffer());
     }
-    
+
     return chunks;
   }
 
-  private static async combineChunks(chunks: ArrayBuffer[]): Promise<ArrayBuffer> {
-    const totalLength = chunks.reduce((sum, chunk) => sum + chunk.byteLength, 0);
+  private static async combineChunks(
+    chunks: ArrayBuffer[],
+  ): Promise<ArrayBuffer> {
+    const totalLength = chunks.reduce(
+      (sum, chunk) => sum + chunk.byteLength,
+      0,
+    );
     const combined = new Uint8Array(totalLength);
-    
+
     let offset = 0;
     for (const chunk of chunks) {
       combined.set(new Uint8Array(chunk), offset);
       offset += chunk.byteLength;
     }
-    
+
     return combined.buffer;
   }
 
   private static async hashArrayBuffer(buffer: ArrayBuffer): Promise<string> {
     // Use Web Crypto API for proper hashing
     if (crypto.subtle) {
-      const hashBuffer = await crypto.subtle.digest('SHA-256', buffer);
+      const hashBuffer = await crypto.subtle.digest("SHA-256", buffer);
       const hashArray = Array.from(new Uint8Array(hashBuffer));
-      return hashArray.map(b => b.toString(16).padStart(2, '0')).join('');
+      return hashArray.map((b) => b.toString(16).padStart(2, "0")).join("");
     }
-    
+
     // Fallback for environments without crypto.subtle
-    return this.simpleHash(Array.from(new Uint8Array(buffer)).join(''));
+    return this.simpleHash(Array.from(new Uint8Array(buffer)).join(""));
   }
 
   private static simpleHash(str: string): string {
     let hash = 0;
     if (str.length === 0) return hash.toString();
-    
+
     for (let i = 0; i < str.length; i++) {
       const char = str.charCodeAt(i);
-      hash = ((hash << 5) - hash) + char;
+      hash = (hash << 5) - hash + char;
       hash = hash & hash; // Convert to 32-bit integer
     }
-    
+
     return Math.abs(hash).toString(16);
   }
 
@@ -115,13 +122,16 @@ export class FileHasher {
    * Validate that a file matches its expected hash
    * Useful for detecting file corruption or changes
    */
-  static async validateFileHash(file: File, expectedHash: string): Promise<boolean> {
+  static async validateFileHash(
+    file: File,
+    expectedHash: string,
+  ): Promise<boolean> {
     try {
       const actualHash = await this.generateHybridHash(file);
       return actualHash === expectedHash;
     } catch (error) {
-      console.error('Hash validation failed:', error);
+      console.error("Hash validation failed:", error);
       return false;
     }
   }
-}
\ No newline at end of file
+}
diff --git a/frontend/src/core/utils/fileHistoryUtils.ts b/frontend/src/core/utils/fileHistoryUtils.ts
index a67d0f4f89..9bf9215de8 100644
--- a/frontend/src/core/utils/fileHistoryUtils.ts
+++ b/frontend/src/core/utils/fileHistoryUtils.ts
@@ -4,13 +4,15 @@
  * Helper functions for IndexedDB-based file history management.
  * Handles file history operations and lineage tracking.
  */
-import { StirlingFileStub } from '@app/types/fileContext';
+import { StirlingFileStub } from "@app/types/fileContext";
 
 /**
  * Group files by processing branches - each branch ends in a leaf file
  * Returns Map<fileId, lineagePath[]> where fileId is the leaf and lineagePath is the path back to original
  */
-export function groupFilesByOriginal(StirlingFileStubs: StirlingFileStub[]): Map<string, StirlingFileStub[]> {
+export function groupFilesByOriginal(
+  StirlingFileStubs: StirlingFileStub[],
+): Map<string, StirlingFileStub[]> {
   const groups = new Map<string, StirlingFileStub[]>();
 
   // Create a map for quick lookups
@@ -21,14 +23,21 @@ export function groupFilesByOriginal(StirlingFileStubs: StirlingFileStub[]): Map
 
   // Find leaf files (files that are not parents of any other files AND have version history)
   // Original files (v0) should only be leaves if they have no processed versions at all
-  const leafFiles = StirlingFileStubs.filter(stub => {
-    const isParentOfOthers = StirlingFileStubs.some(otherStub => otherStub.parentFileId === stub.id);
-    const isOriginalOfOthers = StirlingFileStubs.some(otherStub => otherStub.originalFileId === stub.id);
+  const leafFiles = StirlingFileStubs.filter((stub) => {
+    const isParentOfOthers = StirlingFileStubs.some(
+      (otherStub) => otherStub.parentFileId === stub.id,
+    );
+    const isOriginalOfOthers = StirlingFileStubs.some(
+      (otherStub) => otherStub.originalFileId === stub.id,
+    );
 
     // A file is a leaf if:
     // 1. It's not a parent of any other files, AND
     // 2. It has processing history (versionNumber > 0) OR it's not referenced as original by others
-    return !isParentOfOthers && (stub.versionNumber && stub.versionNumber > 0 || !isOriginalOfOthers);
+    return (
+      !isParentOfOthers &&
+      ((stub.versionNumber && stub.versionNumber > 0) || !isOriginalOfOthers)
+    );
   });
 
   // For each leaf file, build its complete lineage path back to original
@@ -45,13 +54,16 @@ export function groupFilesByOriginal(StirlingFileStubs: StirlingFileStub[]): Map
 
       if (currentFile.parentFileId) {
         nextFile = fileMap.get(currentFile.parentFileId);
-      } else if (currentFile.originalFileId && currentFile.originalFileId !== currentFile.id) {
+      } else if (
+        currentFile.originalFileId &&
+        currentFile.originalFileId !== currentFile.id
+      ) {
         // For v1 files, the original file might be referenced by originalFileId
         nextFile = fileMap.get(currentFile.originalFileId);
       }
 
       // Check for infinite loops before moving to next
-      if (nextFile && lineagePath.some(file => file.id === nextFile!.id)) {
+      if (nextFile && lineagePath.some((file) => file.id === nextFile!.id)) {
         break;
       }
 
@@ -72,7 +84,9 @@ export function groupFilesByOriginal(StirlingFileStubs: StirlingFileStub[]): Map
  * Check if a file has version history
  */
 export function hasVersionHistory(fileStub: StirlingFileStub): boolean {
-  return !!(fileStub.originalFileId && fileStub.versionNumber && fileStub.versionNumber > 0);
+  return !!(
+    fileStub.originalFileId &&
+    fileStub.versionNumber &&
+    fileStub.versionNumber > 0
+  );
 }
-
-
diff --git a/frontend/src/core/utils/fileIdSafety.ts b/frontend/src/core/utils/fileIdSafety.ts
index fac7b14cc8..35a8f13222 100644
--- a/frontend/src/core/utils/fileIdSafety.ts
+++ b/frontend/src/core/utils/fileIdSafety.ts
@@ -2,13 +2,12 @@
  * Runtime validation utilities for FileId safety
  */
 
-import { FileId } from '@app/types/fileContext';
+import { FileId } from "@app/types/fileContext";
 
 // Validate that a string is a proper FileId (has UUID format)
 export function isValidFileId(id: string): id is FileId {
   // Check UUID v4 format: 8-4-4-4-12 hex digits
-  const uuidRegex = /^[0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}$/i;
+  const uuidRegex =
+    /^[0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}$/i;
   return uuidRegex.test(id);
 }
-
-
diff --git a/frontend/src/core/utils/fileResponseUtils.test.ts b/frontend/src/core/utils/fileResponseUtils.test.ts
index 6aee7e707e..ce2b6cd6d5 100644
--- a/frontend/src/core/utils/fileResponseUtils.test.ts
+++ b/frontend/src/core/utils/fileResponseUtils.test.ts
@@ -2,146 +2,170 @@
  * Unit tests for file response utility functions
  */
 
-import { describe, test, expect } from 'vitest';
-import { getFilenameFromHeaders, createFileFromApiResponse } from '@app/utils/fileResponseUtils';
+import { describe, test, expect } from "vitest";
+import {
+  getFilenameFromHeaders,
+  createFileFromApiResponse,
+} from "@app/utils/fileResponseUtils";
 
-describe('fileResponseUtils', () => {
-  
-  describe('getFilenameFromHeaders', () => {
-    
-    test('should extract filename from content-disposition header', () => {
+describe("fileResponseUtils", () => {
+  describe("getFilenameFromHeaders", () => {
+    test("should extract filename from content-disposition header", () => {
       const contentDisposition = 'attachment; filename="document.pdf"';
       const filename = getFilenameFromHeaders(contentDisposition);
-      
-      expect(filename).toBe('document.pdf');
+
+      expect(filename).toBe("document.pdf");
     });
 
-    test('should extract filename without quotes', () => {
-      const contentDisposition = 'attachment; filename=document.pdf';
+    test("should extract filename without quotes", () => {
+      const contentDisposition = "attachment; filename=document.pdf";
       const filename = getFilenameFromHeaders(contentDisposition);
-      
-      expect(filename).toBe('document.pdf');
+
+      expect(filename).toBe("document.pdf");
     });
 
-    test('should handle single quotes', () => {
+    test("should handle single quotes", () => {
       const contentDisposition = "attachment; filename='document.pdf'";
       const filename = getFilenameFromHeaders(contentDisposition);
-      
-      expect(filename).toBe('document.pdf');
+
+      expect(filename).toBe("document.pdf");
     });
 
-    test('should return null for malformed header', () => {
-      const contentDisposition = 'attachment; invalid=format';
+    test("should return null for malformed header", () => {
+      const contentDisposition = "attachment; invalid=format";
       const filename = getFilenameFromHeaders(contentDisposition);
-      
+
       expect(filename).toBe(null);
     });
 
-    test('should return null for empty header', () => {
-      const filename = getFilenameFromHeaders('');
-      
+    test("should return null for empty header", () => {
+      const filename = getFilenameFromHeaders("");
+
       expect(filename).toBe(null);
     });
 
-    test('should return null for undefined header', () => {
+    test("should return null for undefined header", () => {
       const filename = getFilenameFromHeaders();
-      
+
       expect(filename).toBe(null);
     });
 
-    test('should handle complex filenames with spaces and special chars', () => {
+    test("should handle complex filenames with spaces and special chars", () => {
       const contentDisposition = 'attachment; filename="My Document (1).pdf"';
       const filename = getFilenameFromHeaders(contentDisposition);
-      
-      expect(filename).toBe('My Document (1).pdf');
+
+      expect(filename).toBe("My Document (1).pdf");
     });
 
-    test('should handle filename with extension when downloadHtml is enabled', () => {
+    test("should handle filename with extension when downloadHtml is enabled", () => {
       const contentDisposition = 'attachment; filename="email_content.html"';
       const filename = getFilenameFromHeaders(contentDisposition);
-      
-      expect(filename).toBe('email_content.html');
+
+      expect(filename).toBe("email_content.html");
     });
   });
 
-  describe('createFileFromApiResponse', () => {
-    
-    test('should create file using header filename when available', () => {
+  describe("createFileFromApiResponse", () => {
+    test("should create file using header filename when available", () => {
       const responseData = new Uint8Array([1, 2, 3, 4]);
       const headers = {
-        'content-type': 'application/pdf',
-        'content-disposition': 'attachment; filename="server_filename.pdf"'
+        "content-type": "application/pdf",
+        "content-disposition": 'attachment; filename="server_filename.pdf"',
       };
-      const fallbackFilename = 'fallback.pdf';
-      
-      const file = createFileFromApiResponse(responseData, headers, fallbackFilename);
-      
-      expect(file.name).toBe('server_filename.pdf');
-      expect(file.type).toBe('application/pdf');
+      const fallbackFilename = "fallback.pdf";
+
+      const file = createFileFromApiResponse(
+        responseData,
+        headers,
+        fallbackFilename,
+      );
+
+      expect(file.name).toBe("server_filename.pdf");
+      expect(file.type).toBe("application/pdf");
       expect(file.size).toBe(4);
     });
 
-    test('should use fallback filename when no header filename', () => {
+    test("should use fallback filename when no header filename", () => {
       const responseData = new Uint8Array([1, 2, 3, 4]);
       const headers = {
-        'content-type': 'application/pdf'
+        "content-type": "application/pdf",
       };
-      const fallbackFilename = 'converted_file.pdf';
-      
-      const file = createFileFromApiResponse(responseData, headers, fallbackFilename);
-      
-      expect(file.name).toBe('converted_file.pdf');
-      expect(file.type).toBe('application/pdf');
+      const fallbackFilename = "converted_file.pdf";
+
+      const file = createFileFromApiResponse(
+        responseData,
+        headers,
+        fallbackFilename,
+      );
+
+      expect(file.name).toBe("converted_file.pdf");
+      expect(file.type).toBe("application/pdf");
     });
 
-    test('should handle HTML response when downloadHtml is enabled', () => {
-      const responseData = '<html><body>Test</body></html>';
+    test("should handle HTML response when downloadHtml is enabled", () => {
+      const responseData = "<html><body>Test</body></html>";
       const headers = {
-        'content-type': 'text/html',
-        'content-disposition': 'attachment; filename="email_content.html"'
+        "content-type": "text/html",
+        "content-disposition": 'attachment; filename="email_content.html"',
       };
-      const fallbackFilename = 'fallback.pdf';
-      
-      const file = createFileFromApiResponse(responseData, headers, fallbackFilename);
-      
-      expect(file.name).toBe('email_content.html');
-      expect(file.type).toBe('text/html');
+      const fallbackFilename = "fallback.pdf";
+
+      const file = createFileFromApiResponse(
+        responseData,
+        headers,
+        fallbackFilename,
+      );
+
+      expect(file.name).toBe("email_content.html");
+      expect(file.type).toBe("text/html");
     });
 
-    test('should handle ZIP response', () => {
+    test("should handle ZIP response", () => {
       const responseData = new Uint8Array([80, 75, 3, 4]); // ZIP file signature
       const headers = {
-        'content-type': 'application/zip',
-        'content-disposition': 'attachment; filename="converted_files.zip"'
+        "content-type": "application/zip",
+        "content-disposition": 'attachment; filename="converted_files.zip"',
       };
-      const fallbackFilename = 'fallback.pdf';
-      
-      const file = createFileFromApiResponse(responseData, headers, fallbackFilename);
-      
-      expect(file.name).toBe('converted_files.zip');
-      expect(file.type).toBe('application/zip');
+      const fallbackFilename = "fallback.pdf";
+
+      const file = createFileFromApiResponse(
+        responseData,
+        headers,
+        fallbackFilename,
+      );
+
+      expect(file.name).toBe("converted_files.zip");
+      expect(file.type).toBe("application/zip");
     });
 
-    test('should use default content-type when none provided', () => {
+    test("should use default content-type when none provided", () => {
       const responseData = new Uint8Array([1, 2, 3, 4]);
       const headers = {};
-      const fallbackFilename = 'test.bin';
-      
-      const file = createFileFromApiResponse(responseData, headers, fallbackFilename);
-      
-      expect(file.name).toBe('test.bin');
-      expect(file.type).toBe('application/octet-stream');
+      const fallbackFilename = "test.bin";
+
+      const file = createFileFromApiResponse(
+        responseData,
+        headers,
+        fallbackFilename,
+      );
+
+      expect(file.name).toBe("test.bin");
+      expect(file.type).toBe("application/octet-stream");
     });
 
-    test('should handle null/undefined headers gracefully', () => {
+    test("should handle null/undefined headers gracefully", () => {
       const responseData = new Uint8Array([1, 2, 3, 4]);
       const headers = null;
-      const fallbackFilename = 'test.bin';
-      
-      const file = createFileFromApiResponse(responseData, headers, fallbackFilename);
-      
-      expect(file.name).toBe('test.bin');
-      expect(file.type).toBe('application/octet-stream');
+      const fallbackFilename = "test.bin";
+
+      const file = createFileFromApiResponse(
+        responseData,
+        headers,
+        fallbackFilename,
+      );
+
+      expect(file.name).toBe("test.bin");
+      expect(file.type).toBe("application/octet-stream");
     });
   });
-});
\ No newline at end of file
+});
diff --git a/frontend/src/core/utils/fileResponseUtils.ts b/frontend/src/core/utils/fileResponseUtils.ts
index 659c2948dd..35b640e86b 100644
--- a/frontend/src/core/utils/fileResponseUtils.ts
+++ b/frontend/src/core/utils/fileResponseUtils.ts
@@ -7,10 +7,14 @@
  * @param contentDisposition - Content-Disposition header value
  * @returns Filename if found, null otherwise
  */
-export const getFilenameFromHeaders = (contentDisposition: string = ''): string | null => {
-  const match = contentDisposition.match(/filename[^;=\n]*=((['"]).*?\2|[^;\n]*)/);
+export const getFilenameFromHeaders = (
+  contentDisposition: string = "",
+): string | null => {
+  const match = contentDisposition.match(
+    /filename[^;=\n]*=((['"]).*?\2|[^;\n]*)/,
+  );
   if (match && match[1]) {
-    const filename = match[1].replace(/['"]/g, '');
+    const filename = match[1].replace(/['"]/g, "");
 
     // Decode URL-encoded characters (e.g., %20 -> space)
     try {
@@ -33,12 +37,13 @@ export const getFilenameFromHeaders = (contentDisposition: string = ''): string
 export const createFileFromApiResponse = (
   responseData: any,
   headers: any,
-  fallbackFilename: string
+  fallbackFilename: string,
 ): File => {
-  const contentType = headers?.['content-type'] || 'application/octet-stream';
-  const contentDisposition = headers?.['content-disposition'] || '';
+  const contentType = headers?.["content-type"] || "application/octet-stream";
+  const contentDisposition = headers?.["content-disposition"] || "";
 
-  const filename = getFilenameFromHeaders(contentDisposition) || fallbackFilename;
+  const filename =
+    getFilenameFromHeaders(contentDisposition) || fallbackFilename;
   const blob = new Blob([responseData], { type: contentType });
 
   return new File([blob], filename, { type: contentType });
diff --git a/frontend/src/core/utils/fileUtils.test.ts b/frontend/src/core/utils/fileUtils.test.ts
index 499a49babc..8b1a1afd95 100644
--- a/frontend/src/core/utils/fileUtils.test.ts
+++ b/frontend/src/core/utils/fileUtils.test.ts
@@ -1,87 +1,97 @@
-import { describe, it, expect } from 'vitest';
-import { isPdfFile, detectFileExtension, formatFileSize } from '@app/utils/fileUtils';
+import { describe, it, expect } from "vitest";
+import {
+  isPdfFile,
+  detectFileExtension,
+  formatFileSize,
+} from "@app/utils/fileUtils";
 
-describe('fileUtils', () => {
-  describe('isPdfFile', () => {
-    it('should return true for PDF files with correct MIME type', () => {
-      const pdfFile = new File(['content'], 'document.pdf', { type: 'application/pdf' });
+describe("fileUtils", () => {
+  describe("isPdfFile", () => {
+    it("should return true for PDF files with correct MIME type", () => {
+      const pdfFile = new File(["content"], "document.pdf", {
+        type: "application/pdf",
+      });
       expect(isPdfFile(pdfFile)).toBe(true);
     });
 
-    it('should return true for PDF files with .pdf extension even without MIME type', () => {
-      const pdfFile = new File(['content'], 'document.pdf', { type: '' });
+    it("should return true for PDF files with .pdf extension even without MIME type", () => {
+      const pdfFile = new File(["content"], "document.pdf", { type: "" });
       expect(isPdfFile(pdfFile)).toBe(true);
     });
 
-    it('should return false for non-PDF files', () => {
-      const txtFile = new File(['content'], 'document.txt', { type: 'text/plain' });
+    it("should return false for non-PDF files", () => {
+      const txtFile = new File(["content"], "document.txt", {
+        type: "text/plain",
+      });
       expect(isPdfFile(txtFile)).toBe(false);
     });
 
-    it('should return false for image files', () => {
-      const imageFile = new File(['content'], 'image.png', { type: 'image/png' });
+    it("should return false for image files", () => {
+      const imageFile = new File(["content"], "image.png", {
+        type: "image/png",
+      });
       expect(isPdfFile(imageFile)).toBe(false);
     });
 
-    it('should return false for null', () => {
+    it("should return false for null", () => {
       expect(isPdfFile(null)).toBe(false);
     });
 
-    it('should return false for undefined', () => {
+    it("should return false for undefined", () => {
       expect(isPdfFile(undefined)).toBe(false);
     });
 
-    it('should handle file-like objects with name and type', () => {
-      const fileLike = { name: 'test.pdf', type: 'application/pdf' };
+    it("should handle file-like objects with name and type", () => {
+      const fileLike = { name: "test.pdf", type: "application/pdf" };
       expect(isPdfFile(fileLike)).toBe(true);
     });
 
-    it('should handle file-like objects with PDF extension but no type', () => {
-      const fileLike = { name: 'test.pdf', type: '' };
+    it("should handle file-like objects with PDF extension but no type", () => {
+      const fileLike = { name: "test.pdf", type: "" };
       expect(isPdfFile(fileLike)).toBe(true);
     });
   });
 
-  describe('detectFileExtension', () => {
-    it('should detect PDF extension', () => {
-      expect(detectFileExtension('document.pdf')).toBe('pdf');
+  describe("detectFileExtension", () => {
+    it("should detect PDF extension", () => {
+      expect(detectFileExtension("document.pdf")).toBe("pdf");
     });
 
-    it('should detect extension in uppercase', () => {
-      expect(detectFileExtension('document.PDF')).toBe('pdf');
+    it("should detect extension in uppercase", () => {
+      expect(detectFileExtension("document.PDF")).toBe("pdf");
     });
 
-    it('should return empty string for files without extension', () => {
-      expect(detectFileExtension('document')).toBe('');
+    it("should return empty string for files without extension", () => {
+      expect(detectFileExtension("document")).toBe("");
     });
 
-    it('should handle multiple dots in filename', () => {
-      expect(detectFileExtension('my.document.pdf')).toBe('pdf');
+    it("should handle multiple dots in filename", () => {
+      expect(detectFileExtension("my.document.pdf")).toBe("pdf");
     });
 
-    it('should normalize jpeg to jpg', () => {
-      expect(detectFileExtension('image.jpeg')).toBe('jpg');
+    it("should normalize jpeg to jpg", () => {
+      expect(detectFileExtension("image.jpeg")).toBe("jpg");
     });
   });
 
-  describe('formatFileSize', () => {
-    it('should format bytes', () => {
-      expect(formatFileSize(0)).toBe('0 B');
-      expect(formatFileSize(500)).toBe('500 B');
+  describe("formatFileSize", () => {
+    it("should format bytes", () => {
+      expect(formatFileSize(0)).toBe("0 B");
+      expect(formatFileSize(500)).toBe("500 B");
     });
 
-    it('should format kilobytes', () => {
-      expect(formatFileSize(1024)).toBe('1 KB');
-      expect(formatFileSize(2048)).toBe('2 KB');
+    it("should format kilobytes", () => {
+      expect(formatFileSize(1024)).toBe("1 KB");
+      expect(formatFileSize(2048)).toBe("2 KB");
     });
 
-    it('should format megabytes', () => {
-      expect(formatFileSize(1024 * 1024)).toBe('1 MB');
-      expect(formatFileSize(5 * 1024 * 1024)).toBe('5 MB');
+    it("should format megabytes", () => {
+      expect(formatFileSize(1024 * 1024)).toBe("1 MB");
+      expect(formatFileSize(5 * 1024 * 1024)).toBe("5 MB");
     });
 
-    it('should format gigabytes', () => {
-      expect(formatFileSize(1024 * 1024 * 1024)).toBe('1 GB');
+    it("should format gigabytes", () => {
+      expect(formatFileSize(1024 * 1024 * 1024)).toBe("1 GB");
     });
   });
 });
diff --git a/frontend/src/core/utils/fileUtils.ts b/frontend/src/core/utils/fileUtils.ts
index ed76f6060c..57a09d7bb8 100644
--- a/frontend/src/core/utils/fileUtils.ts
+++ b/frontend/src/core/utils/fileUtils.ts
@@ -4,11 +4,11 @@
  * Consolidated file size formatting utility
  */
 export function formatFileSize(bytes: number): string {
-  if (bytes === 0) return '0 B';
+  if (bytes === 0) return "0 B";
   const k = 1024;
-  const sizes = ['B', 'KB', 'MB', 'GB'];
+  const sizes = ["B", "KB", "MB", "GB"];
   const i = Math.floor(Math.log(bytes) / Math.log(k));
-  return parseFloat((bytes / Math.pow(k, i)).toFixed(2)) + ' ' + sizes[i];
+  return parseFloat((bytes / Math.pow(k, i)).toFixed(2)) + " " + sizes[i];
 }
 
 /**
@@ -29,25 +29,23 @@ export function getFileSize(file: File | { size: number }): string {
   return formatFileSize(file.size);
 }
 
-
-
 /**
  * Detects and normalizes file extension from filename
  * @param filename - The filename to extract extension from
  * @returns Normalized file extension in lowercase, empty string if no extension
  */
 export function detectFileExtension(filename: string): string {
-  if (!filename || typeof filename !== 'string') return '';
+  if (!filename || typeof filename !== "string") return "";
 
-  const parts = filename.split('.');
+  const parts = filename.split(".");
   // If there's no extension (no dots or only one part), return empty string
-  if (parts.length <= 1) return '';
+  if (parts.length <= 1) return "";
 
   // Get the last part (extension) in lowercase
   let extension = parts[parts.length - 1].toLowerCase();
 
   // Normalize common extension variants
-  if (extension === 'jpeg') extension = 'jpg';
+  if (extension === "jpeg") extension = "jpg";
 
   return extension;
 }
@@ -65,12 +63,12 @@ export function detectFileExtension(filename: string): string {
  */
 export function getFilenameWithoutExtension(
   filename: string,
-  options: { preserveCase?: boolean } = {}
+  options: { preserveCase?: boolean } = {},
 ): string {
-  if (!filename || typeof filename !== 'string') return '';
+  if (!filename || typeof filename !== "string") return "";
 
   const { preserveCase = false } = options;
-  const withoutExtension = filename.replace(/\.[^.]+$/, '');
+  const withoutExtension = filename.replace(/\.[^.]+$/, "");
 
   return preserveCase ? withoutExtension : withoutExtension.toLowerCase();
 }
@@ -80,62 +78,82 @@ export function getFilenameWithoutExtension(
  * @param file - File or file-like object with name and type properties
  * @returns true if the file appears to be a PDF
  */
-export function isPdfFile(file: { name?: string; type?: string } | File | Blob | null | undefined): boolean {
+export function isPdfFile(
+  file: { name?: string; type?: string } | File | Blob | null | undefined,
+): boolean {
   if (!file) return false;
 
-  const name = 'name' in file ? file.name : undefined;
+  const name = "name" in file ? file.name : undefined;
   const type = file.type;
 
   // Check MIME type first (most reliable)
-  if (type === 'application/pdf') return true;
+  if (type === "application/pdf") return true;
 
   // Check file extension as fallback
   if (name) {
     const ext = detectFileExtension(name);
-    if (ext === 'pdf') return true;
+    if (ext === "pdf") return true;
   }
 
   return false;
 }
 
-export type NonPdfFileType = 'image' | 'csv' | 'json' | 'text' | 'markdown' | 'html' | 'unknown';
+export type NonPdfFileType =
+  | "image"
+  | "csv"
+  | "json"
+  | "text"
+  | "markdown"
+  | "html"
+  | "unknown";
 
-const IMAGE_EXTENSIONS = new Set(['png', 'jpg', 'jpeg', 'gif', 'bmp', 'svg', 'tiff', 'tif', 'webp']);
-const CSV_EXTENSIONS = new Set(['csv', 'tsv']);
-const JSON_EXTENSIONS = new Set(['json']);
-const TEXT_EXTENSIONS = new Set(['txt']);
-const MARKDOWN_EXTENSIONS = new Set(['md', 'markdown']);
-const HTML_EXTENSIONS = new Set(['html', 'htm']);
+const IMAGE_EXTENSIONS = new Set([
+  "png",
+  "jpg",
+  "jpeg",
+  "gif",
+  "bmp",
+  "svg",
+  "tiff",
+  "tif",
+  "webp",
+]);
+const CSV_EXTENSIONS = new Set(["csv", "tsv"]);
+const JSON_EXTENSIONS = new Set(["json"]);
+const TEXT_EXTENSIONS = new Set(["txt"]);
+const MARKDOWN_EXTENSIONS = new Set(["md", "markdown"]);
+const HTML_EXTENSIONS = new Set(["html", "htm"]);
 
 /**
  * Detects the non-PDF file type category for viewer routing.
  * Returns 'unknown' for PDFs or unrecognized formats.
  */
-export function detectNonPdfFileType(file: { name?: string; type?: string } | File | null | undefined): NonPdfFileType {
-  if (!file) return 'unknown';
+export function detectNonPdfFileType(
+  file: { name?: string; type?: string } | File | null | undefined,
+): NonPdfFileType {
+  if (!file) return "unknown";
 
-  const name = 'name' in file ? file.name : undefined;
-  const mimeType = file.type ?? '';
+  const name = "name" in file ? file.name : undefined;
+  const mimeType = file.type ?? "";
 
   // Check MIME type first
-  if (mimeType.startsWith('image/')) return 'image';
-  if (mimeType === 'text/csv') return 'csv';
-  if (mimeType === 'text/tab-separated-values') return 'csv';
-  if (mimeType === 'application/json') return 'json';
-  if (mimeType === 'text/html') return 'html';
-  if (mimeType === 'text/markdown') return 'markdown';
+  if (mimeType.startsWith("image/")) return "image";
+  if (mimeType === "text/csv") return "csv";
+  if (mimeType === "text/tab-separated-values") return "csv";
+  if (mimeType === "application/json") return "json";
+  if (mimeType === "text/html") return "html";
+  if (mimeType === "text/markdown") return "markdown";
 
   // Fall back to extension
   if (name) {
     const ext = detectFileExtension(name);
-    if (IMAGE_EXTENSIONS.has(ext)) return 'image';
-    if (CSV_EXTENSIONS.has(ext)) return 'csv';
-    if (JSON_EXTENSIONS.has(ext)) return 'json';
-    if (MARKDOWN_EXTENSIONS.has(ext)) return 'markdown';
-    if (TEXT_EXTENSIONS.has(ext)) return 'text';
-    if (HTML_EXTENSIONS.has(ext)) return 'html';
+    if (IMAGE_EXTENSIONS.has(ext)) return "image";
+    if (CSV_EXTENSIONS.has(ext)) return "csv";
+    if (JSON_EXTENSIONS.has(ext)) return "json";
+    if (MARKDOWN_EXTENSIONS.has(ext)) return "markdown";
+    if (TEXT_EXTENSIONS.has(ext)) return "text";
+    if (HTML_EXTENSIONS.has(ext)) return "html";
   }
 
-  return 'unknown';
+  return "unknown";
 }
-
diff --git a/frontend/src/core/utils/fuzzySearch.ts b/frontend/src/core/utils/fuzzySearch.ts
index e8e8bdf01b..9ed2a8cbe7 100644
--- a/frontend/src/core/utils/fuzzySearch.ts
+++ b/frontend/src/core/utils/fuzzySearch.ts
@@ -4,8 +4,8 @@
 function normalizeText(text: string): string {
   return text
     .toLowerCase()
-    .normalize('NFD')
-    .replace(/\p{Diacritic}+/gu, '')
+    .normalize("NFD")
+    .replace(/\p{Diacritic}+/gu, "")
     .trim();
 }
 
@@ -30,7 +30,7 @@ function levenshtein(a: string, b: string): number {
       curr[j] = Math.min(
         prev[j] + 1, // deletion
         curr[j - 1] + 1, // insertion
-        prev[j - 1] + cost // substitution
+        prev[j - 1] + cost, // substitution
       );
     }
     for (let j = 0; j <= bLen; j++) prev[j] = curr[j];
@@ -56,13 +56,17 @@ export function scoreMatch(queryRaw: string, targetRaw: string): number {
     if (token.includes(query)) {
       // Only give high score if the match is substantial (not just "and" matching)
       const similarity = query.length / Math.max(query.length, token.length);
-      if (similarity >= 0.6) { // Require at least 60% similarity
+      if (similarity >= 0.6) {
+        // Require at least 60% similarity
         return 80 - Math.abs(token.length - query.length);
       }
     }
   }
 
-  const distance = levenshtein(query, target.length > 64 ? target.slice(0, 64) : target);
+  const distance = levenshtein(
+    query,
+    target.length > 64 ? target.slice(0, 64) : target,
+  );
   const maxLen = Math.max(query.length, target.length, 1);
   const similarity = 1 - distance / maxLen; // 0..1
   return Math.floor(similarity * 60); // scale below substring scores
@@ -70,24 +74,35 @@ export function scoreMatch(queryRaw: string, targetRaw: string): number {
 
 export function minScoreForQuery(query: string): number {
   const len = normalizeText(query).length;
-  if (len <= 3) return 40; 
-  if (len <= 6) return 30; 
-  return 25; 
+  if (len <= 3) return 40;
+  if (len <= 6) return 30;
+  return 25;
 }
 
 // Decide if a target matches a query based on a threshold
-export function isFuzzyMatch(query: string, target: string, minScore?: number): boolean {
-  const threshold = typeof minScore === 'number' ? minScore : minScoreForQuery(query);
+export function isFuzzyMatch(
+  query: string,
+  target: string,
+  minScore?: number,
+): boolean {
+  const threshold =
+    typeof minScore === "number" ? minScore : minScoreForQuery(query);
   return scoreMatch(query, target) >= threshold;
 }
 
 // Convenience: rank a list of items by best score across provided getters
-export function rankByFuzzy<T>(items: T[], query: string, getters: Array<(item: T) => string>, minScore?: number): Array<{ item: T; score: number; matchedText?: string }>{
+export function rankByFuzzy<T>(
+  items: T[],
+  query: string,
+  getters: Array<(item: T) => string>,
+  minScore?: number,
+): Array<{ item: T; score: number; matchedText?: string }> {
   const results: Array<{ item: T; score: number; matchedText?: string }> = [];
-  const threshold = typeof minScore === 'number' ? minScore : minScoreForQuery(query);
+  const threshold =
+    typeof minScore === "number" ? minScore : minScoreForQuery(query);
   for (const item of items) {
     let best = 0;
-    let matchedText = '';
+    let matchedText = "";
     for (const get of getters) {
       const value = get(item);
       if (!value) continue;
@@ -113,9 +128,7 @@ export function normalizeForSearch(text: string): string {
 // Convert ids like "addPassword", "add-password", "add_password" to words for matching
 export function idToWords(id: string): string {
   const spaced = id
-    .replace(/([a-z0-9])([A-Z])/g, '$1 $2')
-    .replace(/[._-]+/g, ' ');
+    .replace(/([a-z0-9])([A-Z])/g, "$1 $2")
+    .replace(/[._-]+/g, " ");
   return normalizeText(spaced);
 }
-
-
diff --git a/frontend/src/core/utils/genericUtils.ts b/frontend/src/core/utils/genericUtils.ts
index 2533462922..3e1ce86e84 100644
--- a/frontend/src/core/utils/genericUtils.ts
+++ b/frontend/src/core/utils/genericUtils.ts
@@ -25,7 +25,7 @@ export function addEventListenerWithCleanup(
   target: EventTarget,
   event: string,
   handler: EventListener,
-  options?: boolean | AddEventListenerOptions
+  options?: boolean | AddEventListenerOptions,
 ): () => void {
   target.addEventListener(event, handler, options);
   return () => target.removeEventListener(event, handler, options);
@@ -37,6 +37,9 @@ export function addEventListenerWithCleanup(
  * @param element - The element to check against
  * @returns True if the click was outside the element
  */
-export function isClickOutside(event: MouseEvent, element: HTMLElement | null): boolean {
+export function isClickOutside(
+  event: MouseEvent,
+  element: HTMLElement | null,
+): boolean {
   return element ? !element.contains(event.target as Node) : true;
 }
diff --git a/frontend/src/core/utils/homePageNavigation.test.ts b/frontend/src/core/utils/homePageNavigation.test.ts
index 14b107aa3a..96ec01d6a7 100644
--- a/frontend/src/core/utils/homePageNavigation.test.ts
+++ b/frontend/src/core/utils/homePageNavigation.test.ts
@@ -1,77 +1,128 @@
-import { describe, expect, it } from 'vitest';
-import { getStartupNavigationAction } from '@app/utils/homePageNavigation';
-import type { WorkbenchType } from '@app/types/workbench';
+import { describe, expect, it } from "vitest";
+import { getStartupNavigationAction } from "@app/utils/homePageNavigation";
+import type { WorkbenchType } from "@app/types/workbench";
 
-describe('getStartupNavigationAction', () => {
-  it('returns viewer + active index for 0->1 transition when not in fileEditor', () => {
-    expect(getStartupNavigationAction(0, 1, null, 'viewer' as WorkbenchType)).toEqual({
-      workbench: 'viewer',
+describe("getStartupNavigationAction", () => {
+  it("returns viewer + active index for 0->1 transition when not in fileEditor", () => {
+    expect(
+      getStartupNavigationAction(0, 1, null, "viewer" as WorkbenchType),
+    ).toEqual({
+      workbench: "viewer",
       activeFileIndex: 0,
     });
-    expect(getStartupNavigationAction(0, 1, null, 'pageEditor' as WorkbenchType)).toEqual({
-      workbench: 'viewer',
+    expect(
+      getStartupNavigationAction(0, 1, null, "pageEditor" as WorkbenchType),
+    ).toEqual({
+      workbench: "viewer",
       activeFileIndex: 0,
     });
   });
 
-  it('returns fileEditor for 0->2+ transition when not in fileEditor', () => {
-    expect(getStartupNavigationAction(0, 2, null, 'viewer' as WorkbenchType)).toEqual({
-      workbench: 'fileEditor',
+  it("returns fileEditor for 0->2+ transition when not in fileEditor", () => {
+    expect(
+      getStartupNavigationAction(0, 2, null, "viewer" as WorkbenchType),
+    ).toEqual({
+      workbench: "fileEditor",
     });
   });
 
-  it('does not force navigation for pdfTextEditor', () => {
-    expect(getStartupNavigationAction(0, 1, 'pdfTextEditor', 'viewer' as WorkbenchType)).toBeNull();
-    expect(getStartupNavigationAction(0, 3, 'pdfTextEditor', 'viewer' as WorkbenchType)).toBeNull();
+  it("does not force navigation for pdfTextEditor", () => {
+    expect(
+      getStartupNavigationAction(
+        0,
+        1,
+        "pdfTextEditor",
+        "viewer" as WorkbenchType,
+      ),
+    ).toBeNull();
+    expect(
+      getStartupNavigationAction(
+        0,
+        3,
+        "pdfTextEditor",
+        "viewer" as WorkbenchType,
+      ),
+    ).toBeNull();
   });
 
-  it('does not navigate when file count decreases', () => {
-    expect(getStartupNavigationAction(2, 1, null, 'viewer' as WorkbenchType)).toBeNull();
-    expect(getStartupNavigationAction(3, 1, null, 'fileEditor' as WorkbenchType)).toBeNull();
+  it("does not navigate when file count decreases", () => {
+    expect(
+      getStartupNavigationAction(2, 1, null, "viewer" as WorkbenchType),
+    ).toBeNull();
+    expect(
+      getStartupNavigationAction(3, 1, null, "fileEditor" as WorkbenchType),
+    ).toBeNull();
   });
 
-  it('navigates to last file when already in viewer and files are added', () => {
-    expect(getStartupNavigationAction(1, 2, null, 'viewer' as WorkbenchType)).toEqual({
-      workbench: 'viewer',
+  it("navigates to last file when already in viewer and files are added", () => {
+    expect(
+      getStartupNavigationAction(1, 2, null, "viewer" as WorkbenchType),
+    ).toEqual({
+      workbench: "viewer",
       activeFileIndex: 1,
     });
-    expect(getStartupNavigationAction(3, 5, null, 'viewer' as WorkbenchType)).toEqual({
-      workbench: 'viewer',
+    expect(
+      getStartupNavigationAction(3, 5, null, "viewer" as WorkbenchType),
+    ).toEqual({
+      workbench: "viewer",
       activeFileIndex: 4,
     });
   });
 
-  it('does not navigate when adding files in non-viewer workbenches', () => {
-    expect(getStartupNavigationAction(1, 2, null, 'fileEditor' as WorkbenchType)).toBeNull();
-    expect(getStartupNavigationAction(3, 4, null, 'fileEditor' as WorkbenchType)).toBeNull();
-    expect(getStartupNavigationAction(1, 3, null, 'pageEditor' as WorkbenchType)).toBeNull();
+  it("does not navigate when adding files in non-viewer workbenches", () => {
+    expect(
+      getStartupNavigationAction(1, 2, null, "fileEditor" as WorkbenchType),
+    ).toBeNull();
+    expect(
+      getStartupNavigationAction(3, 4, null, "fileEditor" as WorkbenchType),
+    ).toBeNull();
+    expect(
+      getStartupNavigationAction(1, 3, null, "pageEditor" as WorkbenchType),
+    ).toBeNull();
   });
 
-  it('handles all workbench types consistently for 0→N transitions', () => {
+  it("handles all workbench types consistently for 0→N transitions", () => {
     // 0→1 always goes to viewer regardless of current workbench (since default is viewer)
-    expect(getStartupNavigationAction(0, 1, null, 'viewer' as WorkbenchType)).toEqual({
-      workbench: 'viewer',
+    expect(
+      getStartupNavigationAction(0, 1, null, "viewer" as WorkbenchType),
+    ).toEqual({
+      workbench: "viewer",
       activeFileIndex: 0,
     });
-    expect(getStartupNavigationAction(0, 1, null, 'fileEditor' as WorkbenchType)).toEqual({
-      workbench: 'viewer',
+    expect(
+      getStartupNavigationAction(0, 1, null, "fileEditor" as WorkbenchType),
+    ).toEqual({
+      workbench: "viewer",
       activeFileIndex: 0,
     });
-    expect(getStartupNavigationAction(0, 1, null, 'pageEditor' as WorkbenchType)).toEqual({
-      workbench: 'viewer',
+    expect(
+      getStartupNavigationAction(0, 1, null, "pageEditor" as WorkbenchType),
+    ).toEqual({
+      workbench: "viewer",
       activeFileIndex: 0,
     });
-    expect(getStartupNavigationAction(0, 1, null, 'custom:formFill' as WorkbenchType)).toEqual({
-      workbench: 'viewer',
+    expect(
+      getStartupNavigationAction(
+        0,
+        1,
+        null,
+        "custom:formFill" as WorkbenchType,
+      ),
+    ).toEqual({
+      workbench: "viewer",
       activeFileIndex: 0,
     });
 
     // 0→N (N>1) always goes to fileEditor
-    expect(getStartupNavigationAction(0, 3, null, 'viewer' as WorkbenchType)).toEqual({
-      workbench: 'fileEditor',
+    expect(
+      getStartupNavigationAction(0, 3, null, "viewer" as WorkbenchType),
+    ).toEqual({
+      workbench: "fileEditor",
     });
-    expect(getStartupNavigationAction(0, 3, null, 'custom:myTool' as WorkbenchType)).toEqual({
-      workbench: 'fileEditor',
+    expect(
+      getStartupNavigationAction(0, 3, null, "custom:myTool" as WorkbenchType),
+    ).toEqual({
+      workbench: "fileEditor",
     });
   });
 });
diff --git a/frontend/src/core/utils/homePageNavigation.ts b/frontend/src/core/utils/homePageNavigation.ts
index cb3461e076..9986e3609f 100644
--- a/frontend/src/core/utils/homePageNavigation.ts
+++ b/frontend/src/core/utils/homePageNavigation.ts
@@ -1,6 +1,6 @@
-import type { WorkbenchType } from '@app/types/workbench';
+import type { WorkbenchType } from "@app/types/workbench";
 
-export type StartupWorkbench = 'viewer' | 'fileEditor';
+export type StartupWorkbench = "viewer" | "fileEditor";
 
 export interface StartupNavigationAction {
   workbench: StartupWorkbench;
@@ -11,25 +11,29 @@ export function getStartupNavigationAction(
   previousFileCount: number,
   currentFileCount: number,
   selectedToolKey: string | null,
-  currentWorkbench: WorkbenchType
+  currentWorkbench: WorkbenchType,
 ): StartupNavigationAction | null {
   // pdfTextEditor handles its own empty state
-  if (selectedToolKey === 'pdfTextEditor') {
+  if (selectedToolKey === "pdfTextEditor") {
     return null;
   }
 
   // Already actively viewing in the viewer → update to the latest file
-  if (previousFileCount > 0 && currentWorkbench === 'viewer' && currentFileCount > previousFileCount) {
-    return { workbench: 'viewer', activeFileIndex: currentFileCount - 1 };
+  if (
+    previousFileCount > 0 &&
+    currentWorkbench === "viewer" &&
+    currentFileCount > previousFileCount
+  ) {
+    return { workbench: "viewer", activeFileIndex: currentFileCount - 1 };
   }
 
   // From landing page (no prior files)
   if (previousFileCount === 0) {
     if (currentFileCount === 1) {
-      return { workbench: 'viewer', activeFileIndex: 0 };
+      return { workbench: "viewer", activeFileIndex: 0 };
     }
     if (currentFileCount > 1) {
-      return { workbench: 'fileEditor' };
+      return { workbench: "fileEditor" };
     }
   }
 
diff --git a/frontend/src/core/utils/hotkeys.ts b/frontend/src/core/utils/hotkeys.ts
index aa3f98879c..174c49c4db 100644
--- a/frontend/src/core/utils/hotkeys.ts
+++ b/frontend/src/core/utils/hotkeys.ts
@@ -1,4 +1,4 @@
-import { KeyboardEvent as ReactKeyboardEvent } from 'react';
+import { KeyboardEvent as ReactKeyboardEvent } from "react";
 
 export interface HotkeyBinding {
   code: string;
@@ -9,57 +9,64 @@ export interface HotkeyBinding {
 }
 
 const MODIFIER_CODES = new Set([
-  'ShiftLeft',
-  'ShiftRight',
-  'ControlLeft',
-  'ControlRight',
-  'AltLeft',
-  'AltRight',
-  'MetaLeft',
-  'MetaRight',
+  "ShiftLeft",
+  "ShiftRight",
+  "ControlLeft",
+  "ControlRight",
+  "AltLeft",
+  "AltRight",
+  "MetaLeft",
+  "MetaRight",
 ]);
 
 const CODE_LABEL_MAP: Record<string, string> = {
-  Minus: '-',
-  Equal: '=',
-  Backquote: '`',
-  BracketLeft: '[',
-  BracketRight: ']',
-  Backslash: '\\',
-  IntlBackslash: '\\',
-  Semicolon: ';',
-  Quote: '\'',
-  Comma: ',',
-  Period: '.',
-  Slash: '/',
-  Space: 'Space',
-  Tab: 'Tab',
-  Escape: 'Esc',
-  Enter: 'Enter',
-  NumpadEnter: 'Num Enter',
-  NumpadAdd: 'Num +',
-  NumpadSubtract: 'Num -',
-  NumpadMultiply: 'Num *',
-  NumpadDivide: 'Num /',
-  NumpadDecimal: 'Num .',
-  NumpadComma: 'Num ,',
-  NumpadEqual: 'Num =',
+  Minus: "-",
+  Equal: "=",
+  Backquote: "`",
+  BracketLeft: "[",
+  BracketRight: "]",
+  Backslash: "\\",
+  IntlBackslash: "\\",
+  Semicolon: ";",
+  Quote: "'",
+  Comma: ",",
+  Period: ".",
+  Slash: "/",
+  Space: "Space",
+  Tab: "Tab",
+  Escape: "Esc",
+  Enter: "Enter",
+  NumpadEnter: "Num Enter",
+  NumpadAdd: "Num +",
+  NumpadSubtract: "Num -",
+  NumpadMultiply: "Num *",
+  NumpadDivide: "Num /",
+  NumpadDecimal: "Num .",
+  NumpadComma: "Num ,",
+  NumpadEqual: "Num =",
 };
 
 export const isMacLike = (): boolean => {
-  if (typeof navigator === 'undefined') {
+  if (typeof navigator === "undefined") {
     return false;
   }
-  const platform = navigator.platform?.toLowerCase() ?? '';
-  const userAgent = navigator.userAgent?.toLowerCase() ?? '';
-  return /mac|iphone|ipad|ipod/.test(platform) || /mac|iphone|ipad|ipod/.test(userAgent);
+  const platform = navigator.platform?.toLowerCase() ?? "";
+  const userAgent = navigator.userAgent?.toLowerCase() ?? "";
+  return (
+    /mac|iphone|ipad|ipod/.test(platform) ||
+    /mac|iphone|ipad|ipod/.test(userAgent)
+  );
 };
 
-export const isModifierCode = (code: string): boolean => MODIFIER_CODES.has(code);
+export const isModifierCode = (code: string): boolean =>
+  MODIFIER_CODES.has(code);
 
 const isFunctionKey = (code: string): boolean => /^F\d{1,2}$/.test(code);
 
-export const bindingEquals = (a?: HotkeyBinding | null, b?: HotkeyBinding | null): boolean => {
+export const bindingEquals = (
+  a?: HotkeyBinding | null,
+  b?: HotkeyBinding | null,
+): boolean => {
   if (!a && !b) return true;
   if (!a || !b) return false;
   return (
@@ -71,7 +78,10 @@ export const bindingEquals = (a?: HotkeyBinding | null, b?: HotkeyBinding | null
   );
 };
 
-export const bindingMatchesEvent = (binding: HotkeyBinding, event: KeyboardEvent): boolean => {
+export const bindingMatchesEvent = (
+  binding: HotkeyBinding,
+  event: KeyboardEvent,
+): boolean => {
   return (
     event.code === binding.code &&
     event.altKey === Boolean(binding.alt) &&
@@ -81,7 +91,9 @@ export const bindingMatchesEvent = (binding: HotkeyBinding, event: KeyboardEvent
   );
 };
 
-export const eventToBinding = (event: KeyboardEvent | ReactKeyboardEvent): HotkeyBinding | null => {
+export const eventToBinding = (
+  event: KeyboardEvent | ReactKeyboardEvent,
+): HotkeyBinding | null => {
   const code = event.code;
   if (!code || isModifierCode(code)) {
     return null;
@@ -108,15 +120,15 @@ const getKeyLabel = (code: string): string => {
     return CODE_LABEL_MAP[code];
   }
 
-  if (code.startsWith('Key')) {
+  if (code.startsWith("Key")) {
     return code.slice(3);
   }
 
-  if (code.startsWith('Digit')) {
+  if (code.startsWith("Digit")) {
     return code.slice(5);
   }
 
-  if (code.startsWith('Numpad')) {
+  if (code.startsWith("Numpad")) {
     const remainder = code.slice(6);
     if (/^[0-9]$/.test(remainder)) {
       return `Num ${remainder}`;
@@ -130,54 +142,61 @@ const getKeyLabel = (code: string): string => {
   }
 
   switch (code) {
-    case 'ArrowUp':
-      return '↑';
-    case 'ArrowDown':
-      return '↓';
-    case 'ArrowLeft':
-      return '�';
-    case 'ArrowRight':
-      return '→';
+    case "ArrowUp":
+      return "↑";
+    case "ArrowDown":
+      return "↓";
+    case "ArrowLeft":
+      return "�";
+    case "ArrowRight":
+      return "→";
     default:
       return code;
   }
 };
 
-export const getDisplayParts = (binding: HotkeyBinding | null | undefined, macLike: boolean): string[] => {
+export const getDisplayParts = (
+  binding: HotkeyBinding | null | undefined,
+  macLike: boolean,
+): string[] => {
   if (!binding) return [];
   const parts: string[] = [];
   if (binding.meta) {
-    parts.push(macLike ? '⌘' : 'Win');
+    parts.push(macLike ? "⌘" : "Win");
   }
   if (binding.ctrl) {
-    parts.push(macLike ? '⌃' : 'Ctrl');
+    parts.push(macLike ? "⌃" : "Ctrl");
   }
   if (binding.alt) {
-    parts.push(macLike ? '⌥' : 'Alt');
+    parts.push(macLike ? "⌥" : "Alt");
   }
   if (binding.shift) {
-    parts.push(macLike ? '⇧' : 'Shift');
+    parts.push(macLike ? "⇧" : "Shift");
   }
   parts.push(getKeyLabel(binding.code));
   return parts;
 };
 
-export const serializeBindings = (bindings: Record<string, HotkeyBinding>): string => {
+export const serializeBindings = (
+  bindings: Record<string, HotkeyBinding>,
+): string => {
   return JSON.stringify(bindings);
 };
 
-export const deserializeBindings = (value: string | null | undefined): Record<string, HotkeyBinding> => {
+export const deserializeBindings = (
+  value: string | null | undefined,
+): Record<string, HotkeyBinding> => {
   if (!value) {
     return {};
   }
   try {
     const parsed = JSON.parse(value) as Record<string, HotkeyBinding>;
-    if (typeof parsed !== 'object' || parsed === null) {
+    if (typeof parsed !== "object" || parsed === null) {
       return {};
     }
     return parsed;
   } catch (error) {
-    console.warn('Failed to parse stored hotkey bindings', error);
+    console.warn("Failed to parse stored hotkey bindings", error);
     return {};
   }
 };
@@ -188,4 +207,4 @@ export const normalizeBinding = (binding: HotkeyBinding): HotkeyBinding => ({
   ctrl: Boolean(binding.ctrl),
   meta: Boolean(binding.meta),
   shift: Boolean(binding.shift),
-});
\ No newline at end of file
+});
diff --git a/frontend/src/core/utils/imageToPdfUtils.ts b/frontend/src/core/utils/imageToPdfUtils.ts
index b52106e2b6..aa4990f738 100644
--- a/frontend/src/core/utils/imageToPdfUtils.ts
+++ b/frontend/src/core/utils/imageToPdfUtils.ts
@@ -1,18 +1,15 @@
-import {
-  getPdfiumModule,
-  saveRawDocument,
-} from '@app/services/pdfiumService';
-import { copyRgbaToBgraHeap } from '@app/utils/pdfiumBitmapUtils';
+import { getPdfiumModule, saveRawDocument } from "@app/services/pdfiumService";
+import { copyRgbaToBgraHeap } from "@app/utils/pdfiumBitmapUtils";
 
 export interface ImageToPdfOptions {
-  imageResolution?: 'full' | 'reduced';
-  pageFormat?: 'keep' | 'A4' | 'letter';
+  imageResolution?: "full" | "reduced";
+  pageFormat?: "keep" | "A4" | "letter";
   stretchToFit?: boolean;
 }
 
 // Standard page sizes in PDF points (72 dpi)
 const PAGE_SIZES = {
-  A4: [595.276, 841.890] as [number, number],
+  A4: [595.276, 841.89] as [number, number],
   Letter: [612, 792] as [number, number],
 };
 
@@ -21,11 +18,11 @@ const PAGE_SIZES = {
  */
 export async function convertImageToPdf(
   imageFile: File,
-  options: ImageToPdfOptions = {}
+  options: ImageToPdfOptions = {},
 ): Promise<File> {
   const {
-    imageResolution = 'full',
-    pageFormat = 'A4',
+    imageResolution = "full",
+    pageFormat = "A4",
     stretchToFit = false,
   } = options;
 
@@ -36,14 +33,14 @@ export async function convertImageToPdf(
     let imageBlob: Blob = imageFile;
 
     // Apply image resolution reduction if requested
-    if (imageResolution === 'reduced') {
+    if (imageResolution === "reduced") {
       imageBlob = await reduceImageResolution(imageFile, 1200);
     }
 
     // Decode image to RGBA pixels via canvas
     const decoded = await decodeImageToRgba(imageBlob);
     if (!decoded) {
-      throw new Error('Failed to decode image');
+      throw new Error("Failed to decode image");
     }
 
     const { rgba, width: imageWidth, height: imageHeight } = decoded;
@@ -52,17 +49,17 @@ export async function convertImageToPdf(
     let pageWidth: number;
     let pageHeight: number;
 
-    if (pageFormat === 'keep') {
+    if (pageFormat === "keep") {
       pageWidth = imageWidth;
       pageHeight = imageHeight;
-    } else if (pageFormat === 'letter') {
+    } else if (pageFormat === "letter") {
       [pageWidth, pageHeight] = PAGE_SIZES.Letter;
     } else {
       [pageWidth, pageHeight] = PAGE_SIZES.A4;
     }
 
     // Adjust orientation to match image
-    if (pageFormat !== 'keep') {
+    if (pageFormat !== "keep") {
       const imageIsLandscape = imageWidth > imageHeight;
       const pageIsLandscape = pageWidth > pageHeight;
       if (imageIsLandscape !== pageIsLandscape) {
@@ -76,7 +73,7 @@ export async function convertImageToPdf(
     let drawWidth: number;
     let drawHeight: number;
 
-    if (stretchToFit || pageFormat === 'keep') {
+    if (stretchToFit || pageFormat === "keep") {
       drawX = 0;
       drawY = 0;
       drawWidth = pageWidth;
@@ -100,16 +97,16 @@ export async function convertImageToPdf(
 
     // Create new PDF document
     const docPtr = m.FPDF_CreateNewDocument();
-    if (!docPtr) throw new Error('PDFium: failed to create document');
+    if (!docPtr) throw new Error("PDFium: failed to create document");
 
     try {
       // Create a page
       const pagePtr = m.FPDFPage_New(docPtr, 0, pageWidth, pageHeight);
-      if (!pagePtr) throw new Error('PDFium: failed to create page');
+      if (!pagePtr) throw new Error("PDFium: failed to create page");
 
       // Create bitmap from RGBA data (PDFium uses BGRA)
       const bitmapPtr = m.FPDFBitmap_Create(imageWidth, imageHeight, 1);
-      if (!bitmapPtr) throw new Error('PDFium: failed to create bitmap');
+      if (!bitmapPtr) throw new Error("PDFium: failed to create bitmap");
 
       const bufferPtr = m.FPDFBitmap_GetBuffer(bitmapPtr);
       const stride = m.FPDFBitmap_GetStride(bitmapPtr);
@@ -121,33 +118,38 @@ export async function convertImageToPdf(
       const imageObjPtr = m.FPDFPageObj_NewImageObj(docPtr);
       if (!imageObjPtr) {
         m.FPDFBitmap_Destroy(bitmapPtr);
-        throw new Error('PDFium: failed to create image object');
+        throw new Error("PDFium: failed to create image object");
       }
 
-      const setBitmapOk = m.FPDFImageObj_SetBitmap(pagePtr, 0, imageObjPtr, bitmapPtr);
+      const setBitmapOk = m.FPDFImageObj_SetBitmap(
+        pagePtr,
+        0,
+        imageObjPtr,
+        bitmapPtr,
+      );
       m.FPDFBitmap_Destroy(bitmapPtr);
 
       if (!setBitmapOk) {
         m.FPDFPageObj_Destroy(imageObjPtr);
-        throw new Error('PDFium: failed to set bitmap on image object');
+        throw new Error("PDFium: failed to set bitmap on image object");
       }
 
       // Set transformation matrix: scale + translate
       // FS_MATRIX: {a, b, c, d, e, f} — 6 floats
       const matrixPtr = m.pdfium.wasmExports.malloc(6 * 4);
-      m.pdfium.setValue(matrixPtr, drawWidth, 'float');       // a = scaleX
-      m.pdfium.setValue(matrixPtr + 4, 0, 'float');           // b
-      m.pdfium.setValue(matrixPtr + 8, 0, 'float');           // c
-      m.pdfium.setValue(matrixPtr + 12, drawHeight, 'float'); // d = scaleY
-      m.pdfium.setValue(matrixPtr + 16, drawX, 'float');      // e = translateX
-      m.pdfium.setValue(matrixPtr + 20, drawY, 'float');      // f = translateY
+      m.pdfium.setValue(matrixPtr, drawWidth, "float"); // a = scaleX
+      m.pdfium.setValue(matrixPtr + 4, 0, "float"); // b
+      m.pdfium.setValue(matrixPtr + 8, 0, "float"); // c
+      m.pdfium.setValue(matrixPtr + 12, drawHeight, "float"); // d = scaleY
+      m.pdfium.setValue(matrixPtr + 16, drawX, "float"); // e = translateX
+      m.pdfium.setValue(matrixPtr + 20, drawY, "float"); // f = translateY
 
       const setMatrixOk = m.FPDFPageObj_SetMatrix(imageObjPtr, matrixPtr);
       m.pdfium.wasmExports.free(matrixPtr);
 
       if (!setMatrixOk) {
         m.FPDFPageObj_Destroy(imageObjPtr);
-        throw new Error('PDFium: failed to set image matrix');
+        throw new Error("PDFium: failed to set image matrix");
       }
 
       // Insert image into page
@@ -159,17 +161,19 @@ export async function convertImageToPdf(
 
       // Save document
       const pdfBytes = await saveRawDocument(docPtr);
-      const pdfFilename = imageFile.name.replace(/\.[^.]+$/, '.pdf');
+      const pdfFilename = imageFile.name.replace(/\.[^.]+$/, ".pdf");
 
-      return new File([pdfBytes], pdfFilename, { type: 'application/pdf' });
+      return new File([pdfBytes], pdfFilename, { type: "application/pdf" });
     } finally {
       m.FPDF_CloseDocument(docPtr);
     }
   } catch (error) {
-    console.error('Error converting image to PDF:', error);
+    console.error("Error converting image to PDF:", error);
     throw new Error(
-      `Failed to convert image to PDF: ${error instanceof Error ? error.message : 'Unknown error'}`,
-      { cause: error }
+      `Failed to convert image to PDF: ${error instanceof Error ? error.message : "Unknown error"}`,
+      {
+        cause: error,
+      },
     );
   }
 }
@@ -177,17 +181,19 @@ export async function convertImageToPdf(
 /**
  * Decode an image Blob to RGBA pixel data via canvas.
  */
-function decodeImageToRgba(imageBlob: Blob): Promise<{ rgba: Uint8Array; width: number; height: number } | null> {
+function decodeImageToRgba(
+  imageBlob: Blob,
+): Promise<{ rgba: Uint8Array; width: number; height: number } | null> {
   return new Promise((resolve) => {
     const img = new Image();
     const url = URL.createObjectURL(imageBlob);
 
     img.onload = () => {
       try {
-        const canvas = document.createElement('canvas');
+        const canvas = document.createElement("canvas");
         canvas.width = img.width;
         canvas.height = img.height;
-        const ctx = canvas.getContext('2d');
+        const ctx = canvas.getContext("2d");
         if (!ctx) {
           URL.revokeObjectURL(url);
           resolve(null);
@@ -221,7 +227,7 @@ function decodeImageToRgba(imageBlob: Blob): Promise<{ rgba: Uint8Array; width:
  */
 async function reduceImageResolution(
   imageFile: File,
-  maxDimension: number
+  maxDimension: number,
 ): Promise<File> {
   return new Promise((resolve, reject) => {
     const img = new Image();
@@ -248,25 +254,27 @@ async function reduceImageResolution(
           newWidth = (width / height) * maxDimension;
         }
 
-        const canvas = document.createElement('canvas');
+        const canvas = document.createElement("canvas");
         canvas.width = newWidth;
         canvas.height = newHeight;
 
-        const ctx = canvas.getContext('2d');
-        if (!ctx) throw new Error('Failed to get canvas context');
+        const ctx = canvas.getContext("2d");
+        if (!ctx) throw new Error("Failed to get canvas context");
         ctx.drawImage(img, 0, 0, newWidth, newHeight);
 
-        const outputType = imageFile.type.startsWith('image/')
+        const outputType = imageFile.type.startsWith("image/")
           ? imageFile.type
-          : 'image/jpeg';
+          : "image/jpeg";
 
         canvas.toBlob(
           (blob) => {
             if (!blob) {
-              reject(new Error('Failed to convert canvas to blob'));
+              reject(new Error("Failed to convert canvas to blob"));
               return;
             }
-            const reducedFile = new File([blob], imageFile.name, { type: outputType });
+            const reducedFile = new File([blob], imageFile.name, {
+              type: outputType,
+            });
             URL.revokeObjectURL(url);
             resolve(reducedFile);
           },
@@ -281,7 +289,7 @@ async function reduceImageResolution(
 
     img.onerror = () => {
       URL.revokeObjectURL(url);
-      reject(new Error('Failed to load image'));
+      reject(new Error("Failed to load image"));
     };
 
     img.src = url;
@@ -292,5 +300,5 @@ async function reduceImageResolution(
  * Check if a file is an image
  */
 export function isImageFile(file: File): boolean {
-  return file.type.startsWith('image/');
+  return file.type.startsWith("image/");
 }
diff --git a/frontend/src/core/utils/imageTransparency.ts b/frontend/src/core/utils/imageTransparency.ts
index aa62849e7f..a6a53e9f14 100644
--- a/frontend/src/core/utils/imageTransparency.ts
+++ b/frontend/src/core/utils/imageTransparency.ts
@@ -10,7 +10,7 @@ const DEFAULT_UPPER_BOUND = { r: 255, g: 255, b: 255 }; // #FFFFFF
 
 export async function removeWhiteBackground(
   imageFile: File | string,
-  options: TransparencyOptions = {}
+  options: TransparencyOptions = {},
 ): Promise<string> {
   return new Promise((resolve, reject) => {
     const img = new Image();
@@ -25,10 +25,10 @@ export async function removeWhiteBackground(
     };
 
     img.onerror = () => {
-      reject(new Error('Failed to load image'));
+      reject(new Error("Failed to load image"));
     };
 
-    if (typeof imageFile === 'string') {
+    if (typeof imageFile === "string") {
       img.src = imageFile;
     } else {
       const reader = new FileReader();
@@ -36,7 +36,7 @@ export async function removeWhiteBackground(
         img.src = e.target?.result as string;
       };
       reader.onerror = () => {
-        reject(new Error('Failed to read image file'));
+        reject(new Error("Failed to read image file"));
       };
       reader.readAsDataURL(imageFile);
     }
@@ -45,13 +45,13 @@ export async function removeWhiteBackground(
 
 function processImageTransparency(
   img: HTMLImageElement,
-  options: TransparencyOptions
+  options: TransparencyOptions,
 ): string {
-  const canvas = document.createElement('canvas');
-  const ctx = canvas.getContext('2d');
+  const canvas = document.createElement("canvas");
+  const ctx = canvas.getContext("2d");
 
   if (!ctx) {
-    throw new Error('Failed to get canvas context');
+    throw new Error("Failed to get canvas context");
   }
 
   canvas.width = img.width;
@@ -71,12 +71,12 @@ function processImageTransparency(
     lowerBound = {
       r: Math.max(0, cornerColor.r - tolerance),
       g: Math.max(0, cornerColor.g - tolerance),
-      b: Math.max(0, cornerColor.b - tolerance)
+      b: Math.max(0, cornerColor.b - tolerance),
     };
     upperBound = {
       r: Math.min(255, cornerColor.r + tolerance),
       g: Math.min(255, cornerColor.g + tolerance),
-      b: Math.min(255, cornerColor.b + tolerance)
+      b: Math.min(255, cornerColor.b + tolerance),
     };
   }
 
@@ -86,9 +86,12 @@ function processImageTransparency(
     const b = data[i + 2];
 
     if (
-      r >= lowerBound.r && r <= upperBound.r &&
-      g >= lowerBound.g && g <= upperBound.g &&
-      b >= lowerBound.b && b <= upperBound.b
+      r >= lowerBound.r &&
+      r <= upperBound.r &&
+      g >= lowerBound.g &&
+      g <= upperBound.g &&
+      b >= lowerBound.b &&
+      b <= upperBound.b
     ) {
       data[i + 3] = 0;
     }
@@ -96,11 +99,14 @@ function processImageTransparency(
 
   ctx.putImageData(imageData, 0, 0);
 
-  return canvas.toDataURL('image/png');
+  return canvas.toDataURL("image/png");
 }
 
-
-function detectCornerColor(imageData: ImageData): { r: number; g: number; b: number } {
+function detectCornerColor(imageData: ImageData): {
+  r: number;
+  g: number;
+  b: number;
+} {
   const { width, height, data } = imageData;
 
   const sampleSize = 5;
@@ -108,13 +114,15 @@ function detectCornerColor(imageData: ImageData): { r: number; g: number; b: num
     { x: 0, y: 0 }, // top-left
     { x: width - sampleSize, y: 0 }, // top-right
     { x: 0, y: height - sampleSize }, // bottom-left
-    { x: width - sampleSize, y: height - sampleSize } // bottom-right
+    { x: width - sampleSize, y: height - sampleSize }, // bottom-right
   ];
 
-  let totalR = 0, totalG = 0, totalB = 0;
+  let totalR = 0,
+    totalG = 0,
+    totalB = 0;
   let samples = 0;
 
-  corners.forEach(corner => {
+  corners.forEach((corner) => {
     for (let dy = 0; dy < sampleSize; dy++) {
       for (let dx = 0; dx < sampleSize; dx++) {
         const x = Math.min(width - 1, Math.max(0, corner.x + dx));
@@ -132,6 +140,6 @@ function detectCornerColor(imageData: ImageData): { r: number; g: number; b: num
   return {
     r: Math.round(totalR / samples),
     g: Math.round(totalG / samples),
-    b: Math.round(totalB / samples)
+    b: Math.round(totalB / samples),
   };
 }
diff --git a/frontend/src/core/utils/languageMapping.ts b/frontend/src/core/utils/languageMapping.ts
index 8113202758..83a589d6cf 100644
--- a/frontend/src/core/utils/languageMapping.ts
+++ b/frontend/src/core/utils/languageMapping.ts
@@ -11,865 +11,874 @@ interface LanguageDefinition {
 const languageDefinitions: LanguageDefinition[] = [
   // English
   {
-    ocrCode: 'eng',
-    displayName: 'English',
-    browserCodes: ['en', 'en-GB', 'en-AU', 'en-CA', 'en-IE', 'en-NZ', 'en-ZA']
+    ocrCode: "eng",
+    displayName: "English",
+    browserCodes: ["en", "en-GB", "en-AU", "en-CA", "en-IE", "en-NZ", "en-ZA"],
   },
-  
+
   // Spanish
   {
-    ocrCode: 'spa',
-    displayName: 'Spanish',
-    browserCodes: ['es', 'es-ES', 'es-MX', 'es-AR', 'es-CO', 'es-CL', 'es-PE', 'es-VE']
+    ocrCode: "spa",
+    displayName: "Spanish",
+    browserCodes: [
+      "es",
+      "es-ES",
+      "es-MX",
+      "es-AR",
+      "es-CO",
+      "es-CL",
+      "es-PE",
+      "es-VE",
+    ],
   },
-  
+
   // French
   {
-    ocrCode: 'fra',
-    displayName: 'French',
-    browserCodes: ['fr', 'fr-FR', 'fr-CA', 'fr-BE', 'fr-CH']
+    ocrCode: "fra",
+    displayName: "French",
+    browserCodes: ["fr", "fr-FR", "fr-CA", "fr-BE", "fr-CH"],
   },
-  
+
   // German
   {
-    ocrCode: 'deu',
-    displayName: 'German',
-    browserCodes: ['de', 'de-DE', 'de-AT', 'de-CH']
+    ocrCode: "deu",
+    displayName: "German",
+    browserCodes: ["de", "de-DE", "de-AT", "de-CH"],
   },
-  
+
   // Portuguese
   {
-    ocrCode: 'por',
-    displayName: 'Portuguese',
-    browserCodes: ['pt', 'pt-PT', 'pt-BR']
+    ocrCode: "por",
+    displayName: "Portuguese",
+    browserCodes: ["pt", "pt-PT", "pt-BR"],
   },
-  
+
   // Italian
   {
-    ocrCode: 'ita',
-    displayName: 'Italian',
-    browserCodes: ['it', 'it-IT', 'it-CH']
+    ocrCode: "ita",
+    displayName: "Italian",
+    browserCodes: ["it", "it-IT", "it-CH"],
   },
-  
+
   // Chinese Simplified
   {
-    ocrCode: 'chi_sim',
-    displayName: 'Chinese (Simplified)',
-    browserCodes: ['zh', 'zh-CN', 'zh-Hans']
+    ocrCode: "chi_sim",
+    displayName: "Chinese (Simplified)",
+    browserCodes: ["zh", "zh-CN", "zh-Hans"],
   },
-  
+
   // Chinese Traditional
   {
-    ocrCode: 'chi_tra',
-    displayName: 'Chinese (Traditional)',
-    browserCodes: ['zh-TW', 'zh-HK', 'zh-Hant']
+    ocrCode: "chi_tra",
+    displayName: "Chinese (Traditional)",
+    browserCodes: ["zh-TW", "zh-HK", "zh-Hant"],
   },
-  
+
   // Tibetan
   {
-    ocrCode: 'bod',
-    displayName: 'Tibetan',
-    browserCodes: ['bo', 'zh-BO']
+    ocrCode: "bod",
+    displayName: "Tibetan",
+    browserCodes: ["bo", "zh-BO"],
   },
-  
+
   // Japanese
   {
-    ocrCode: 'jpn',
-    displayName: 'Japanese',
-    browserCodes: ['ja', 'ja-JP']
+    ocrCode: "jpn",
+    displayName: "Japanese",
+    browserCodes: ["ja", "ja-JP"],
   },
-  
+
   // Korean
   {
-    ocrCode: 'kor',
-    displayName: 'Korean',
-    browserCodes: ['ko', 'ko-KR']
+    ocrCode: "kor",
+    displayName: "Korean",
+    browserCodes: ["ko", "ko-KR"],
   },
-  
+
   // Russian
   {
-    ocrCode: 'rus',
-    displayName: 'Russian',
-    browserCodes: ['ru', 'ru-RU']
+    ocrCode: "rus",
+    displayName: "Russian",
+    browserCodes: ["ru", "ru-RU"],
   },
-  
+
   // Arabic
   {
-    ocrCode: 'ara',
-    displayName: 'Arabic',
-    browserCodes: ['ar', 'ar-SA', 'ar-EG', 'ar-AE', 'ar-MA']
+    ocrCode: "ara",
+    displayName: "Arabic",
+    browserCodes: ["ar", "ar-SA", "ar-EG", "ar-AE", "ar-MA"],
   },
-  
+
   // Dutch
   {
-    ocrCode: 'nld',
-    displayName: 'Dutch; Flemish',
-    browserCodes: ['nl', 'nl-NL', 'nl-BE']
+    ocrCode: "nld",
+    displayName: "Dutch; Flemish",
+    browserCodes: ["nl", "nl-NL", "nl-BE"],
   },
-  
+
   // Polish
   {
-    ocrCode: 'pol',
-    displayName: 'Polish',
-    browserCodes: ['pl', 'pl-PL']
+    ocrCode: "pol",
+    displayName: "Polish",
+    browserCodes: ["pl", "pl-PL"],
   },
-  
+
   // Czech
   {
-    ocrCode: 'ces',
-    displayName: 'Czech',
-    browserCodes: ['cs', 'cs-CZ']
+    ocrCode: "ces",
+    displayName: "Czech",
+    browserCodes: ["cs", "cs-CZ"],
   },
-  
+
   // Slovak
   {
-    ocrCode: 'slk',
-    displayName: 'Slovak',
-    browserCodes: ['sk', 'sk-SK']
+    ocrCode: "slk",
+    displayName: "Slovak",
+    browserCodes: ["sk", "sk-SK"],
   },
-  
+
   // Hungarian
   {
-    ocrCode: 'hun',
-    displayName: 'Hungarian',
-    browserCodes: ['hu', 'hu-HU']
+    ocrCode: "hun",
+    displayName: "Hungarian",
+    browserCodes: ["hu", "hu-HU"],
   },
-  
+
   // Romanian
   {
-    ocrCode: 'ron',
-    displayName: 'Romanian, Moldavian, Moldovan',
-    browserCodes: ['ro', 'ro-RO']
+    ocrCode: "ron",
+    displayName: "Romanian, Moldavian, Moldovan",
+    browserCodes: ["ro", "ro-RO"],
   },
-  
+
   // Bulgarian
   {
-    ocrCode: 'bul',
-    displayName: 'Bulgarian',
-    browserCodes: ['bg', 'bg-BG']
+    ocrCode: "bul",
+    displayName: "Bulgarian",
+    browserCodes: ["bg", "bg-BG"],
   },
-  
+
   // Croatian
   {
-    ocrCode: 'hrv',
-    displayName: 'Croatian',
-    browserCodes: ['hr', 'hr-HR']
+    ocrCode: "hrv",
+    displayName: "Croatian",
+    browserCodes: ["hr", "hr-HR"],
   },
-  
+
   // Serbian
   {
-    ocrCode: 'srp',
-    displayName: 'Serbian',
-    browserCodes: ['sr', 'sr-RS']
+    ocrCode: "srp",
+    displayName: "Serbian",
+    browserCodes: ["sr", "sr-RS"],
   },
-  
+
   // Serbian Latin
   {
-    ocrCode: 'srp_latn',
-    displayName: 'Serbian (Latin)',
-    browserCodes: ['sr-Latn']
+    ocrCode: "srp_latn",
+    displayName: "Serbian (Latin)",
+    browserCodes: ["sr-Latn"],
   },
-  
+
   // Slovenian
   {
-    ocrCode: 'slv',
-    displayName: 'Slovenian',
-    browserCodes: ['sl', 'sl-SI']
+    ocrCode: "slv",
+    displayName: "Slovenian",
+    browserCodes: ["sl", "sl-SI"],
   },
-  
+
   // Estonian
   {
-    ocrCode: 'est',
-    displayName: 'Estonian',
-    browserCodes: ['et', 'et-EE']
+    ocrCode: "est",
+    displayName: "Estonian",
+    browserCodes: ["et", "et-EE"],
   },
-  
+
   // Latvian
   {
-    ocrCode: 'lav',
-    displayName: 'Latvian',
-    browserCodes: ['lv', 'lv-LV']
+    ocrCode: "lav",
+    displayName: "Latvian",
+    browserCodes: ["lv", "lv-LV"],
   },
-  
+
   // Lithuanian
   {
-    ocrCode: 'lit',
-    displayName: 'Lithuanian',
-    browserCodes: ['lt', 'lt-LT']
+    ocrCode: "lit",
+    displayName: "Lithuanian",
+    browserCodes: ["lt", "lt-LT"],
   },
-  
+
   // Finnish
   {
-    ocrCode: 'fin',
-    displayName: 'Finnish',
-    browserCodes: ['fi', 'fi-FI']
+    ocrCode: "fin",
+    displayName: "Finnish",
+    browserCodes: ["fi", "fi-FI"],
   },
-  
+
   // Swedish
   {
-    ocrCode: 'swe',
-    displayName: 'Swedish',
-    browserCodes: ['sv', 'sv-SE']
+    ocrCode: "swe",
+    displayName: "Swedish",
+    browserCodes: ["sv", "sv-SE"],
   },
-  
+
   // Norwegian
   {
-    ocrCode: 'nor',
-    displayName: 'Norwegian',
-    browserCodes: ['no', 'nb', 'nn', 'no-NO', 'nb-NO', 'nn-NO']
+    ocrCode: "nor",
+    displayName: "Norwegian",
+    browserCodes: ["no", "nb", "nn", "no-NO", "nb-NO", "nn-NO"],
   },
-  
+
   // Danish
   {
-    ocrCode: 'dan',
-    displayName: 'Danish',
-    browserCodes: ['da', 'da-DK']
+    ocrCode: "dan",
+    displayName: "Danish",
+    browserCodes: ["da", "da-DK"],
   },
-  
+
   // Icelandic
   {
-    ocrCode: 'isl',
-    displayName: 'Icelandic',
-    browserCodes: ['is', 'is-IS']
+    ocrCode: "isl",
+    displayName: "Icelandic",
+    browserCodes: ["is", "is-IS"],
   },
-  
+
   // Greek
   {
-    ocrCode: 'ell',
-    displayName: 'Greek',
-    browserCodes: ['el', 'el-GR']
+    ocrCode: "ell",
+    displayName: "Greek",
+    browserCodes: ["el", "el-GR"],
   },
-  
+
   // Turkish
   {
-    ocrCode: 'tur',
-    displayName: 'Turkish',
-    browserCodes: ['tr', 'tr-TR']
+    ocrCode: "tur",
+    displayName: "Turkish",
+    browserCodes: ["tr", "tr-TR"],
   },
-  
+
   // Hebrew
   {
-    ocrCode: 'heb',
-    displayName: 'Hebrew',
-    browserCodes: ['he', 'he-IL']
+    ocrCode: "heb",
+    displayName: "Hebrew",
+    browserCodes: ["he", "he-IL"],
   },
-  
+
   // Hindi
   {
-    ocrCode: 'hin',
-    displayName: 'Hindi',
-    browserCodes: ['hi', 'hi-IN']
+    ocrCode: "hin",
+    displayName: "Hindi",
+    browserCodes: ["hi", "hi-IN"],
   },
-  
+
   // Thai
   {
-    ocrCode: 'tha',
-    displayName: 'Thai',
-    browserCodes: ['th', 'th-TH']
+    ocrCode: "tha",
+    displayName: "Thai",
+    browserCodes: ["th", "th-TH"],
   },
-  
+
   // Vietnamese
   {
-    ocrCode: 'vie',
-    displayName: 'Vietnamese',
-    browserCodes: ['vi', 'vi-VN']
+    ocrCode: "vie",
+    displayName: "Vietnamese",
+    browserCodes: ["vi", "vi-VN"],
   },
-  
+
   // Indonesian
   {
-    ocrCode: 'ind',
-    displayName: 'Indonesian',
-    browserCodes: ['id', 'id-ID']
+    ocrCode: "ind",
+    displayName: "Indonesian",
+    browserCodes: ["id", "id-ID"],
   },
-  
+
   // Malay
   {
-    ocrCode: 'msa',
-    displayName: 'Malay',
-    browserCodes: ['ms', 'ms-MY']
+    ocrCode: "msa",
+    displayName: "Malay",
+    browserCodes: ["ms", "ms-MY"],
   },
-  
+
   // Filipino
   {
-    ocrCode: 'fil',
-    displayName: 'Filipino',
-    browserCodes: ['fil']
+    ocrCode: "fil",
+    displayName: "Filipino",
+    browserCodes: ["fil"],
   },
-  
+
   // Tagalog
   {
-    ocrCode: 'tgl',
-    displayName: 'Tagalog',
-    browserCodes: ['tl']
+    ocrCode: "tgl",
+    displayName: "Tagalog",
+    browserCodes: ["tl"],
   },
-  
+
   // Ukrainian
   {
-    ocrCode: 'ukr',
-    displayName: 'Ukrainian',
-    browserCodes: ['uk', 'uk-UA']
+    ocrCode: "ukr",
+    displayName: "Ukrainian",
+    browserCodes: ["uk", "uk-UA"],
   },
-  
+
   // Belarusian
   {
-    ocrCode: 'bel',
-    displayName: 'Belarusian',
-    browserCodes: ['be', 'be-BY']
+    ocrCode: "bel",
+    displayName: "Belarusian",
+    browserCodes: ["be", "be-BY"],
   },
-  
+
   // Kazakh
   {
-    ocrCode: 'kaz',
-    displayName: 'Kazakh',
-    browserCodes: ['kk', 'kk-KZ']
+    ocrCode: "kaz",
+    displayName: "Kazakh",
+    browserCodes: ["kk", "kk-KZ"],
   },
-  
+
   // Uzbek
   {
-    ocrCode: 'uzb',
-    displayName: 'Uzbek',
-    browserCodes: ['uz', 'uz-UZ']
+    ocrCode: "uzb",
+    displayName: "Uzbek",
+    browserCodes: ["uz", "uz-UZ"],
   },
-  
+
   // Georgian
   {
-    ocrCode: 'kat',
-    displayName: 'Georgian',
-    browserCodes: ['ka', 'ka-GE']
+    ocrCode: "kat",
+    displayName: "Georgian",
+    browserCodes: ["ka", "ka-GE"],
   },
-  
+
   // Armenian
   {
-    ocrCode: 'hye',
-    displayName: 'Armenian',
-    browserCodes: ['hy', 'hy-AM']
+    ocrCode: "hye",
+    displayName: "Armenian",
+    browserCodes: ["hy", "hy-AM"],
   },
-  
+
   // Azerbaijani
   {
-    ocrCode: 'aze',
-    displayName: 'Azerbaijani',
-    browserCodes: ['az', 'az-AZ']
+    ocrCode: "aze",
+    displayName: "Azerbaijani",
+    browserCodes: ["az", "az-AZ"],
   },
-  
+
   // Persian/Farsi
   {
-    ocrCode: 'fas',
-    displayName: 'Persian',
-    browserCodes: ['fa', 'fa-IR']
+    ocrCode: "fas",
+    displayName: "Persian",
+    browserCodes: ["fa", "fa-IR"],
   },
-  
+
   // Urdu
   {
-    ocrCode: 'urd',
-    displayName: 'Urdu',
-    browserCodes: ['ur', 'ur-PK']
+    ocrCode: "urd",
+    displayName: "Urdu",
+    browserCodes: ["ur", "ur-PK"],
   },
-  
+
   // Bengali
   {
-    ocrCode: 'ben',
-    displayName: 'Bengali',
-    browserCodes: ['bn', 'bn-BD', 'bn-IN']
+    ocrCode: "ben",
+    displayName: "Bengali",
+    browserCodes: ["bn", "bn-BD", "bn-IN"],
   },
-  
+
   // Tamil
   {
-    ocrCode: 'tam',
-    displayName: 'Tamil',
-    browserCodes: ['ta', 'ta-IN', 'ta-LK']
+    ocrCode: "tam",
+    displayName: "Tamil",
+    browserCodes: ["ta", "ta-IN", "ta-LK"],
   },
-  
+
   // Telugu
   {
-    ocrCode: 'tel',
-    displayName: 'Telugu',
-    browserCodes: ['te', 'te-IN']
+    ocrCode: "tel",
+    displayName: "Telugu",
+    browserCodes: ["te", "te-IN"],
   },
-  
+
   // Kannada
   {
-    ocrCode: 'kan',
-    displayName: 'Kannada',
-    browserCodes: ['kn', 'kn-IN']
+    ocrCode: "kan",
+    displayName: "Kannada",
+    browserCodes: ["kn", "kn-IN"],
   },
-  
+
   // Malayalam
   {
-    ocrCode: 'mal',
-    displayName: 'Malayalam',
-    browserCodes: ['ml', 'ml-IN']
+    ocrCode: "mal",
+    displayName: "Malayalam",
+    browserCodes: ["ml", "ml-IN"],
   },
-  
+
   // Gujarati
   {
-    ocrCode: 'guj',
-    displayName: 'Gujarati',
-    browserCodes: ['gu', 'gu-IN']
+    ocrCode: "guj",
+    displayName: "Gujarati",
+    browserCodes: ["gu", "gu-IN"],
   },
-  
+
   // Marathi
   {
-    ocrCode: 'mar',
-    displayName: 'Marathi',
-    browserCodes: ['mr', 'mr-IN']
+    ocrCode: "mar",
+    displayName: "Marathi",
+    browserCodes: ["mr", "mr-IN"],
   },
-  
+
   // Punjabi
   {
-    ocrCode: 'pan',
-    displayName: 'Panjabi, Punjabi',
-    browserCodes: ['pa', 'pa-IN']
+    ocrCode: "pan",
+    displayName: "Panjabi, Punjabi",
+    browserCodes: ["pa", "pa-IN"],
   },
-  
+
   // Nepali
   {
-    ocrCode: 'nep',
-    displayName: 'Nepali',
-    browserCodes: ['ne', 'ne-NP']
+    ocrCode: "nep",
+    displayName: "Nepali",
+    browserCodes: ["ne", "ne-NP"],
   },
-  
+
   // Sinhala
   {
-    ocrCode: 'sin',
-    displayName: 'Sinhala, Sinhalese',
-    browserCodes: ['si', 'si-LK']
+    ocrCode: "sin",
+    displayName: "Sinhala, Sinhalese",
+    browserCodes: ["si", "si-LK"],
   },
-  
+
   // Burmese
   {
-    ocrCode: 'mya',
-    displayName: 'Burmese',
-    browserCodes: ['my', 'my-MM']
+    ocrCode: "mya",
+    displayName: "Burmese",
+    browserCodes: ["my", "my-MM"],
   },
-  
+
   // Khmer
   {
-    ocrCode: 'khm',
-    displayName: 'Central Khmer',
-    browserCodes: ['km', 'km-KH']
+    ocrCode: "khm",
+    displayName: "Central Khmer",
+    browserCodes: ["km", "km-KH"],
   },
-  
+
   // Lao
   {
-    ocrCode: 'lao',
-    displayName: 'Lao',
-    browserCodes: ['lo', 'lo-LA']
+    ocrCode: "lao",
+    displayName: "Lao",
+    browserCodes: ["lo", "lo-LA"],
   },
-  
+
   // Mongolian
   {
-    ocrCode: 'mon',
-    displayName: 'Mongolian',
-    browserCodes: ['mn', 'mn-MN']
+    ocrCode: "mon",
+    displayName: "Mongolian",
+    browserCodes: ["mn", "mn-MN"],
   },
-  
+
   // Welsh
   {
-    ocrCode: 'cym',
-    displayName: 'Welsh',
-    browserCodes: ['cy', 'cy-GB']
+    ocrCode: "cym",
+    displayName: "Welsh",
+    browserCodes: ["cy", "cy-GB"],
   },
-  
+
   // Irish
   {
-    ocrCode: 'gle',
-    displayName: 'Irish',
-    browserCodes: ['ga', 'ga-IE']
+    ocrCode: "gle",
+    displayName: "Irish",
+    browserCodes: ["ga", "ga-IE"],
   },
-  
+
   // Scottish Gaelic
   {
-    ocrCode: 'gla',
-    displayName: 'Scottish Gaelic',
-    browserCodes: ['gd', 'gd-GB']
+    ocrCode: "gla",
+    displayName: "Scottish Gaelic",
+    browserCodes: ["gd", "gd-GB"],
   },
-  
+
   // Basque
   {
-    ocrCode: 'eus',
-    displayName: 'Basque',
-    browserCodes: ['eu', 'eu-ES']
+    ocrCode: "eus",
+    displayName: "Basque",
+    browserCodes: ["eu", "eu-ES"],
   },
-  
+
   // Catalan
   {
-    ocrCode: 'cat',
-    displayName: 'Catalan',
-    browserCodes: ['ca', 'ca-ES']
+    ocrCode: "cat",
+    displayName: "Catalan",
+    browserCodes: ["ca", "ca-ES"],
   },
-  
+
   // Galician
   {
-    ocrCode: 'glg',
-    displayName: 'Galician',
-    browserCodes: ['gl', 'gl-ES']
+    ocrCode: "glg",
+    displayName: "Galician",
+    browserCodes: ["gl", "gl-ES"],
   },
-  
+
   // Macedonian
   {
-    ocrCode: 'mkd',
-    displayName: 'Macedonian',
-    browserCodes: ['mk', 'mk-MK']
+    ocrCode: "mkd",
+    displayName: "Macedonian",
+    browserCodes: ["mk", "mk-MK"],
   },
-  
+
   // Albanian
   {
-    ocrCode: 'sqi',
-    displayName: 'Albanian',
-    browserCodes: ['sq', 'sq-AL']
+    ocrCode: "sqi",
+    displayName: "Albanian",
+    browserCodes: ["sq", "sq-AL"],
   },
-  
+
   // Maltese
   {
-    ocrCode: 'mlt',
-    displayName: 'Maltese',
-    browserCodes: ['mt', 'mt-MT']
+    ocrCode: "mlt",
+    displayName: "Maltese",
+    browserCodes: ["mt", "mt-MT"],
   },
-  
+
   // Afrikaans
   {
-    ocrCode: 'afr',
-    displayName: 'Afrikaans',
-    browserCodes: ['af', 'af-ZA']
+    ocrCode: "afr",
+    displayName: "Afrikaans",
+    browserCodes: ["af", "af-ZA"],
   },
-  
+
   // Swahili
   {
-    ocrCode: 'swa',
-    displayName: 'Swahili',
-    browserCodes: ['sw', 'sw-KE', 'sw-TZ']
+    ocrCode: "swa",
+    displayName: "Swahili",
+    browserCodes: ["sw", "sw-KE", "sw-TZ"],
   },
 
   // Amharic
   {
-    ocrCode: 'amh',
-    displayName: 'Amharic',
-    browserCodes: ['am']
+    ocrCode: "amh",
+    displayName: "Amharic",
+    browserCodes: ["am"],
   },
-  
+
   // Assamese
   {
-    ocrCode: 'asm',
-    displayName: 'Assamese',
-    browserCodes: ['as']
+    ocrCode: "asm",
+    displayName: "Assamese",
+    browserCodes: ["as"],
   },
-  
+
   // Azerbaijani (Cyrillic)
   {
-    ocrCode: 'aze_cyrl',
-    displayName: 'Azerbaijani (Cyrillic)',
-    browserCodes: []
+    ocrCode: "aze_cyrl",
+    displayName: "Azerbaijani (Cyrillic)",
+    browserCodes: [],
   },
-  
+
   // Bosnian
   {
-    ocrCode: 'bos',
-    displayName: 'Bosnian',
-    browserCodes: ['bs']
+    ocrCode: "bos",
+    displayName: "Bosnian",
+    browserCodes: ["bs"],
   },
-  
+
   // Breton
   {
-    ocrCode: 'bre',
-    displayName: 'Breton',
-    browserCodes: ['br']
+    ocrCode: "bre",
+    displayName: "Breton",
+    browserCodes: ["br"],
   },
-  
+
   // Bambara
   {
-    ocrCode: 'bam',
-    displayName: 'Bambara',
-    browserCodes: ['bm']
+    ocrCode: "bam",
+    displayName: "Bambara",
+    browserCodes: ["bm"],
   },
-  
+
   // Bashkir
   {
-    ocrCode: 'bak',
-    displayName: 'Bashkir',
-    browserCodes: ['ba']
+    ocrCode: "bak",
+    displayName: "Bashkir",
+    browserCodes: ["ba"],
   },
-  
+
   // Cornish
   {
-    ocrCode: 'cor',
-    displayName: 'Cornish',
-    browserCodes: ['kw']
+    ocrCode: "cor",
+    displayName: "Cornish",
+    browserCodes: ["kw"],
   },
-  
+
   // Corsican
   {
-    ocrCode: 'cos',
-    displayName: 'Corsican',
-    browserCodes: ['co']
+    ocrCode: "cos",
+    displayName: "Corsican",
+    browserCodes: ["co"],
   },
-  
+
   // Ewe
   {
-    ocrCode: 'ewe',
-    displayName: 'Ewe',
-    browserCodes: ['ee']
+    ocrCode: "ewe",
+    displayName: "Ewe",
+    browserCodes: ["ee"],
   },
-  
+
   // Faroese
   {
-    ocrCode: 'fao',
-    displayName: 'Faroese',
-    browserCodes: ['fo']
+    ocrCode: "fao",
+    displayName: "Faroese",
+    browserCodes: ["fo"],
   },
-  
+
   // Fijian
   {
-    ocrCode: 'fij',
-    displayName: 'Fijian',
-    browserCodes: ['fj']
+    ocrCode: "fij",
+    displayName: "Fijian",
+    browserCodes: ["fj"],
   },
-  
+
   // Haitian Creole
   {
-    ocrCode: 'hat',
-    displayName: 'Haitian, Haitian Creole',
-    browserCodes: ['ht']
+    ocrCode: "hat",
+    displayName: "Haitian, Haitian Creole",
+    browserCodes: ["ht"],
   },
-  
+
   // Javanese
   {
-    ocrCode: 'jav',
-    displayName: 'Javanese',
-    browserCodes: ['jv']
+    ocrCode: "jav",
+    displayName: "Javanese",
+    browserCodes: ["jv"],
   },
-  
+
   // Kirghiz
   {
-    ocrCode: 'kir',
-    displayName: 'Kirghiz, Kyrgyz',
-    browserCodes: ['ky']
+    ocrCode: "kir",
+    displayName: "Kirghiz, Kyrgyz",
+    browserCodes: ["ky"],
   },
-  
+
   // Quechua
   {
-    ocrCode: 'que',
-    displayName: 'Quechua',
-    browserCodes: ['qu']
+    ocrCode: "que",
+    displayName: "Quechua",
+    browserCodes: ["qu"],
   },
-  
+
   // Sindhi
   {
-    ocrCode: 'snd',
-    displayName: 'Sindhi',
-    browserCodes: ['sd']
+    ocrCode: "snd",
+    displayName: "Sindhi",
+    browserCodes: ["sd"],
   },
-  
+
   // Yiddish
   {
-    ocrCode: 'yid',
-    displayName: 'Yiddish',
-    browserCodes: ['yi']
+    ocrCode: "yid",
+    displayName: "Yiddish",
+    browserCodes: ["yi"],
   },
-  
+
   // Yoruba
   {
-    ocrCode: 'yor',
-    displayName: 'Yoruba',
-    browserCodes: ['yo']
+    ocrCode: "yor",
+    displayName: "Yoruba",
+    browserCodes: ["yo"],
   },
 
   // Additional OCR languages without browser mappings or with very specific/rare codes
   {
-    ocrCode: 'ceb',
-    displayName: 'Cebuano',
-    browserCodes: []
+    ocrCode: "ceb",
+    displayName: "Cebuano",
+    browserCodes: [],
   },
   {
-    ocrCode: 'chi_sim_vert',
-    displayName: 'Chinese (Simplified, Vertical)',
-    browserCodes: []
+    ocrCode: "chi_sim_vert",
+    displayName: "Chinese (Simplified, Vertical)",
+    browserCodes: [],
   },
   {
-    ocrCode: 'chi_tra_vert',
-    displayName: 'Chinese (Traditional, Vertical)',
-    browserCodes: []
+    ocrCode: "chi_tra_vert",
+    displayName: "Chinese (Traditional, Vertical)",
+    browserCodes: [],
   },
   {
-    ocrCode: 'chr',
-    displayName: 'Cherokee',
-    browserCodes: []
+    ocrCode: "chr",
+    displayName: "Cherokee",
+    browserCodes: [],
   },
   {
-    ocrCode: 'dan_frak',
-    displayName: 'Danish (Fraktur)',
-    browserCodes: []
+    ocrCode: "dan_frak",
+    displayName: "Danish (Fraktur)",
+    browserCodes: [],
   },
   {
-    ocrCode: 'deu_frak',
-    displayName: 'German (Fraktur)',
-    browserCodes: []
+    ocrCode: "deu_frak",
+    displayName: "German (Fraktur)",
+    browserCodes: [],
   },
   {
-    ocrCode: 'div',
-    displayName: 'Divehi',
-    browserCodes: ['dv']
+    ocrCode: "div",
+    displayName: "Divehi",
+    browserCodes: ["dv"],
   },
   {
-    ocrCode: 'dzo',
-    displayName: 'Dzongkha',
-    browserCodes: ['dz']
+    ocrCode: "dzo",
+    displayName: "Dzongkha",
+    browserCodes: ["dz"],
   },
   {
-    ocrCode: 'enm',
-    displayName: 'English, Middle (1100-1500)',
-    browserCodes: []
+    ocrCode: "enm",
+    displayName: "English, Middle (1100-1500)",
+    browserCodes: [],
   },
   {
-    ocrCode: 'epo',
-    displayName: 'Esperanto',
-    browserCodes: ['eo']
+    ocrCode: "epo",
+    displayName: "Esperanto",
+    browserCodes: ["eo"],
   },
   {
-    ocrCode: 'equ',
-    displayName: 'Math / equation detection module',
-    browserCodes: []
+    ocrCode: "equ",
+    displayName: "Math / equation detection module",
+    browserCodes: [],
   },
   {
-    ocrCode: 'frk',
-    displayName: 'Frankish',
-    browserCodes: []
+    ocrCode: "frk",
+    displayName: "Frankish",
+    browserCodes: [],
   },
   {
-    ocrCode: 'frm',
-    displayName: 'French, Middle (ca.1400-1600)',
-    browserCodes: []
+    ocrCode: "frm",
+    displayName: "French, Middle (ca.1400-1600)",
+    browserCodes: [],
   },
   {
-    ocrCode: 'fry',
-    displayName: 'Western Frisian',
-    browserCodes: ['fy']
+    ocrCode: "fry",
+    displayName: "Western Frisian",
+    browserCodes: ["fy"],
   },
   {
-    ocrCode: 'grc',
-    displayName: 'Ancient Greek',
-    browserCodes: []
+    ocrCode: "grc",
+    displayName: "Ancient Greek",
+    browserCodes: [],
   },
   {
-    ocrCode: 'iku',
-    displayName: 'Inuktitut',
-    browserCodes: ['iu']
+    ocrCode: "iku",
+    displayName: "Inuktitut",
+    browserCodes: ["iu"],
   },
   {
-    ocrCode: 'ita_old',
-    displayName: 'Italian (Old)',
-    browserCodes: []
+    ocrCode: "ita_old",
+    displayName: "Italian (Old)",
+    browserCodes: [],
   },
   {
-    ocrCode: 'jpn_vert',
-    displayName: 'Japanese (Vertical)',
-    browserCodes: []
+    ocrCode: "jpn_vert",
+    displayName: "Japanese (Vertical)",
+    browserCodes: [],
   },
   {
-    ocrCode: 'kat_old',
-    displayName: 'Georgian (Old)',
-    browserCodes: []
+    ocrCode: "kat_old",
+    displayName: "Georgian (Old)",
+    browserCodes: [],
   },
   {
-    ocrCode: 'kmr',
-    displayName: 'Northern Kurdish',
-    browserCodes: ['ku']
+    ocrCode: "kmr",
+    displayName: "Northern Kurdish",
+    browserCodes: ["ku"],
   },
   {
-    ocrCode: 'kor_vert',
-    displayName: 'Korean (Vertical)',
-    browserCodes: []
+    ocrCode: "kor_vert",
+    displayName: "Korean (Vertical)",
+    browserCodes: [],
   },
   {
-    ocrCode: 'lat',
-    displayName: 'Latin',
-    browserCodes: ['la']
+    ocrCode: "lat",
+    displayName: "Latin",
+    browserCodes: ["la"],
   },
   {
-    ocrCode: 'ltz',
-    displayName: 'Luxembourgish',
-    browserCodes: ['lb']
+    ocrCode: "ltz",
+    displayName: "Luxembourgish",
+    browserCodes: ["lb"],
   },
   {
-    ocrCode: 'mri',
-    displayName: 'Maori',
-    browserCodes: ['mi']
+    ocrCode: "mri",
+    displayName: "Maori",
+    browserCodes: ["mi"],
   },
   {
-    ocrCode: 'oci',
-    displayName: 'Occitan (post 1500)',
-    browserCodes: ['oc']
+    ocrCode: "oci",
+    displayName: "Occitan (post 1500)",
+    browserCodes: ["oc"],
   },
   {
-    ocrCode: 'ori',
-    displayName: 'Oriya',
-    browserCodes: ['or']
+    ocrCode: "ori",
+    displayName: "Oriya",
+    browserCodes: ["or"],
   },
   {
-    ocrCode: 'osd',
-    displayName: 'Orientation and script detection module',
-    browserCodes: []
+    ocrCode: "osd",
+    displayName: "Orientation and script detection module",
+    browserCodes: [],
   },
   {
-    ocrCode: 'pus',
-    displayName: 'Pushto, Pashto',
-    browserCodes: ['ps']
+    ocrCode: "pus",
+    displayName: "Pushto, Pashto",
+    browserCodes: ["ps"],
   },
   {
-    ocrCode: 'san',
-    displayName: 'Sanskrit',
-    browserCodes: ['sa']
+    ocrCode: "san",
+    displayName: "Sanskrit",
+    browserCodes: ["sa"],
   },
   {
-    ocrCode: 'slk_frak',
-    displayName: 'Slovak (Fraktur)',
-    browserCodes: []
+    ocrCode: "slk_frak",
+    displayName: "Slovak (Fraktur)",
+    browserCodes: [],
   },
   {
-    ocrCode: 'spa_old',
-    displayName: 'Spanish (Old)',
-    browserCodes: []
+    ocrCode: "spa_old",
+    displayName: "Spanish (Old)",
+    browserCodes: [],
   },
   {
-    ocrCode: 'sun',
-    displayName: 'Sundanese',
-    browserCodes: ['su']
+    ocrCode: "sun",
+    displayName: "Sundanese",
+    browserCodes: ["su"],
   },
   {
-    ocrCode: 'syr',
-    displayName: 'Syriac',
-    browserCodes: []
+    ocrCode: "syr",
+    displayName: "Syriac",
+    browserCodes: [],
   },
   {
-    ocrCode: 'tat',
-    displayName: 'Tatar',
-    browserCodes: ['tt']
+    ocrCode: "tat",
+    displayName: "Tatar",
+    browserCodes: ["tt"],
   },
   {
-    ocrCode: 'tgk',
-    displayName: 'Tajik',
-    browserCodes: ['tg']
+    ocrCode: "tgk",
+    displayName: "Tajik",
+    browserCodes: ["tg"],
   },
   {
-    ocrCode: 'tir',
-    displayName: 'Tigrinya',
-    browserCodes: ['ti']
+    ocrCode: "tir",
+    displayName: "Tigrinya",
+    browserCodes: ["ti"],
   },
   {
-    ocrCode: 'ton',
-    displayName: 'Tonga (Tonga Islands)',
-    browserCodes: ['to']
+    ocrCode: "ton",
+    displayName: "Tonga (Tonga Islands)",
+    browserCodes: ["to"],
   },
   {
-    ocrCode: 'uig',
-    displayName: 'Uighur, Uyghur',
-    browserCodes: ['ug']
+    ocrCode: "uig",
+    displayName: "Uighur, Uyghur",
+    browserCodes: ["ug"],
   },
   {
-    ocrCode: 'uzb_cyrl',
-    displayName: 'Uzbek (Cyrillic)',
-    browserCodes: []
-  }
+    ocrCode: "uzb_cyrl",
+    displayName: "Uzbek (Cyrillic)",
+    browserCodes: [],
+  },
 ];
 
 // Build lookup maps for efficient access
@@ -879,18 +888,18 @@ const displayToOcrMap = new Map<string, string>();
 const ocrToBrowserMap = new Map<string, string[]>();
 
 // Populate lookup maps
-languageDefinitions.forEach(lang => {
+languageDefinitions.forEach((lang) => {
   // OCR code to display name
   ocrToDisplayMap.set(lang.ocrCode, lang.displayName);
-  
+
   // Display name to OCR code
   displayToOcrMap.set(lang.displayName.toLowerCase(), lang.ocrCode);
-  
+
   // OCR code to browser codes
   ocrToBrowserMap.set(lang.ocrCode, lang.browserCodes);
-  
+
   // Browser codes to OCR code
-  lang.browserCodes.forEach(browserCode => {
+  lang.browserCodes.forEach((browserCode) => {
     browserToOcrMap.set(browserCode.toLowerCase(), lang.ocrCode);
   });
 });
@@ -898,52 +907,54 @@ languageDefinitions.forEach(lang => {
 /**
  * Maps a browser language code to an OCR language code
  * Handles exact matches and similar language fallbacks
- * 
+ *
  * @param browserLanguage - The browser language code (e.g., 'en-GB', 'fr-FR')
  * @returns OCR language code if found, null if no match
- * 
+ *
  * @example
  * mapBrowserLanguageToOcr('de-DE') // Returns 'deu'
  * mapBrowserLanguageToOcr('en-GB') // Returns 'eng'
  * mapBrowserLanguageToOcr('zh-CN') // Returns 'chi_sim'
  */
-export function mapBrowserLanguageToOcr(browserLanguage: string): string | null {
+export function mapBrowserLanguageToOcr(
+  browserLanguage: string,
+): string | null {
   if (!browserLanguage) return null;
-  
+
   // Normalize the input
-  const normalizedInput = browserLanguage.toLowerCase().replace('_', '-');
-  
+  const normalizedInput = browserLanguage.toLowerCase().replace("_", "-");
+
   // Try exact match first
   const exactMatch = browserToOcrMap.get(normalizedInput);
   if (exactMatch) return exactMatch;
-  
+
   // Try with different casing variations
   const variations = [
     browserLanguage.toLowerCase(),
     browserLanguage.toUpperCase().toLowerCase(),
     normalizedInput,
   ];
-  
+
   for (const variant of variations) {
     const match = browserToOcrMap.get(variant);
     if (match) return match;
   }
-  
+
   // Try base language code (e.g., 'en' from 'en-GB')
-  const baseLanguage = normalizedInput.split('-')[0];
+  const baseLanguage = normalizedInput.split("-")[0];
   const baseMatch = browserToOcrMap.get(baseLanguage);
   if (baseMatch) return baseMatch;
-  
+
   // No match found
   return null;
 }
 
 /**
  * Gets the display name for an OCR language code
- * 
+ *
  * @param ocrCode - The OCR language code (e.g., 'eng', 'deu')
  * @returns Display name if found, the original code if not found
- * 
+ *
  * @example
  * getOcrDisplayName('deu') // Returns 'German'
  * getOcrDisplayName('eng') // Returns 'English'
@@ -955,10 +966,10 @@ export function getOcrDisplayName(ocrCode: string): string {
 
 /**
  * Gets the OCR code from a display name
- * 
+ *
  * @param displayName - The display name (e.g., 'English', 'German')
  * @returns OCR code if found, null if no match
- * 
+ *
  * @example
  * getOcrCodeFromDisplayName('German') // Returns 'deu'
  * getOcrCodeFromDisplayName('English') // Returns 'eng'
@@ -970,10 +981,10 @@ export function getOcrCodeFromDisplayName(displayName: string): string | null {
 
 /**
  * Gets the browser language codes for an OCR language code
- * 
+ *
  * @param ocrCode - The OCR language code (e.g., 'eng', 'deu')
  * @returns Array of browser language codes
- * 
+ *
  * @example
  * getBrowserLanguagesForOcr('deu') // Returns ['de', 'de-DE', 'de-AT', 'de-CH']
  * getBrowserLanguagesForOcr('eng') // Returns ['en', 'en-US', 'en-GB', 'en-AU', ...]
@@ -985,13 +996,13 @@ export function getBrowserLanguagesForOcr(ocrCode: string): string[] {
 
 /**
  * Gets the OCR language code for the current browser language
- * 
+ *
  * @param currentLanguage - Current i18n language
  * @returns OCR language code array (empty if no match)
- * 
+ *
  * @example
  * getAutoOcrLanguage('de-DE') // Returns ['deu']
- * getAutoOcrLanguage('en-GB') // Returns ['eng'] 
+ * getAutoOcrLanguage('en-GB') // Returns ['eng']
  * getAutoOcrLanguage('unknown') // Returns []
  */
 export function getAutoOcrLanguage(currentLanguage: string): string[] {
@@ -1001,9 +1012,9 @@ export function getAutoOcrLanguage(currentLanguage: string): string[] {
 
 /**
  * Gets all available language definitions
- * 
+ *
  * @returns Array of all language definitions
- * 
+ *
  * @example
  * const allLanguages = getAllLanguageDefinitions();
  * // Returns: [{ ocrCode: 'eng', displayName: 'English', browserCodes: ['en', 'en-US', ...] }, ...]
@@ -1016,5 +1027,5 @@ export function getAllLanguageDefinitions(): LanguageDefinition[] {
  * Legacy compatibility - provides the same interface as tempOcrLanguages.ts
  */
 export const tempOcrLanguages = {
-  lang: Object.fromEntries(ocrToDisplayMap)
-} as const; 
\ No newline at end of file
+  lang: Object.fromEntries(ocrToDisplayMap),
+} as const;
diff --git a/frontend/src/core/utils/pageMetadata.ts b/frontend/src/core/utils/pageMetadata.ts
index fa9b4d7cc4..523f262e4a 100644
--- a/frontend/src/core/utils/pageMetadata.ts
+++ b/frontend/src/core/utils/pageMetadata.ts
@@ -2,7 +2,7 @@ import {
   ProcessedFileMetadata,
   ProcessedFilePage,
   StirlingFileStub,
-} from '@app/types/fileContext';
+} from "@app/types/fileContext";
 
 export interface PageDimensions {
   width: number | null;
@@ -10,18 +10,18 @@ export interface PageDimensions {
 }
 
 export function getPageDimensions(
-  page?: ProcessedFilePage | null
+  page?: ProcessedFilePage | null,
 ): PageDimensions {
   const width =
-    typeof page?.width === 'number' && page.width > 0 ? page.width : null;
+    typeof page?.width === "number" && page.width > 0 ? page.width : null;
   const height =
-    typeof page?.height === 'number' && page.height > 0 ? page.height : null;
+    typeof page?.height === "number" && page.height > 0 ? page.height : null;
 
   return { width, height };
 }
 
 export function getFirstPageDimensionsFromMetadata(
-  metadata?: ProcessedFileMetadata | null
+  metadata?: ProcessedFileMetadata | null,
 ): PageDimensions {
   if (!metadata?.pages?.length) {
     return { width: null, height: null };
@@ -31,13 +31,13 @@ export function getFirstPageDimensionsFromMetadata(
 }
 
 export function getFirstPageDimensionsFromStub(
-  file?: StirlingFileStub
+  file?: StirlingFileStub,
 ): PageDimensions {
   return getFirstPageDimensionsFromMetadata(file?.processedFile);
 }
 
 export function getFirstPageAspectRatioFromMetadata(
-  metadata?: ProcessedFileMetadata | null
+  metadata?: ProcessedFileMetadata | null,
 ): number | null {
   const { width, height } = getFirstPageDimensionsFromMetadata(metadata);
   if (width && height) {
@@ -47,7 +47,7 @@ export function getFirstPageAspectRatioFromMetadata(
 }
 
 export function getFirstPageAspectRatioFromStub(
-  file?: StirlingFileStub
+  file?: StirlingFileStub,
 ): number | null {
   return getFirstPageAspectRatioFromMetadata(file?.processedFile);
 }
diff --git a/frontend/src/core/utils/pageSelection.ts b/frontend/src/core/utils/pageSelection.ts
index 4909581bb9..528376b9d7 100644
--- a/frontend/src/core/utils/pageSelection.ts
+++ b/frontend/src/core/utils/pageSelection.ts
@@ -2,8 +2,8 @@ export const validatePageNumbers = (pageNumbers: string): boolean => {
   if (!pageNumbers.trim()) return false;
 
   // Normalize input for validation: remove spaces around commas and other spaces
-  const normalized = pageNumbers.replace(/\s*,\s*/g, ',').replace(/\s+/g, '');
-  const parts = normalized.split(',');
+  const normalized = pageNumbers.replace(/\s*,\s*/g, ",").replace(/\s+/g, "");
+  const parts = normalized.split(",");
 
   // Regular expressions for different page number formats
   const allToken = /^all$/i; // Select all pages
@@ -11,7 +11,7 @@ export const validatePageNumbers = (pageNumbers: string): boolean => {
   const rangeRegex = /^[1-9]\d*-(?:[1-9]\d*)?$/; // Range: 1-5 or open range 10-
   const mathRegex = /^(?=.*n)[0-9n+\-*/() ]+$/; // Mathematical expressions with n and allowed chars
 
-  return parts.every(part => {
+  return parts.every((part) => {
     if (!part) return false;
     return (
       allToken.test(part) ||
diff --git a/frontend/src/core/utils/pdfLinkUtils.ts b/frontend/src/core/utils/pdfLinkUtils.ts
index e53070e72b..f202d7d2a6 100644
--- a/frontend/src/core/utils/pdfLinkUtils.ts
+++ b/frontend/src/core/utils/pdfLinkUtils.ts
@@ -13,16 +13,21 @@ import {
   writeUtf16,
   readAnnotRectAdjusted,
   parseRectToCss,
-} from '@app/services/pdfiumService';
+} from "@app/services/pdfiumService";
 import {
   FPDF_ANNOT_LINK,
   PDFACTION_GOTO,
   PDFACTION_URI,
-} from '@app/utils/pdfiumBitmapUtils';
+} from "@app/utils/pdfiumBitmapUtils";
 
-export type LinkType = 'internal' | 'external' | 'unknown';
-export type LinkBorderStyle = 'solid' | 'dashed' | 'beveled' | 'inset' | 'underline';
-export type LinkHighlightMode = 'none' | 'invert' | 'outline' | 'push';
+export type LinkType = "internal" | "external" | "unknown";
+export type LinkBorderStyle =
+  | "solid"
+  | "dashed"
+  | "beveled"
+  | "inset"
+  | "underline";
+export type LinkHighlightMode = "none" | "invert" | "outline" | "push";
 
 export interface PdfLibLink {
   id: string;
@@ -86,13 +91,17 @@ export async function createLinkAnnotation(
   } = options;
 
   if (!url && destinationPage === undefined) {
-    throw new Error('createLinkAnnotation: must provide either url or destinationPage');
+    throw new Error(
+      "createLinkAnnotation: must provide either url or destinationPage",
+    );
   }
   if (url && destinationPage !== undefined) {
-    throw new Error('createLinkAnnotation: url and destinationPage are mutually exclusive');
+    throw new Error(
+      "createLinkAnnotation: url and destinationPage are mutually exclusive",
+    );
   }
   if (rect.width <= 0 || rect.height <= 0) {
-    throw new Error('createLinkAnnotation: rect dimensions must be positive');
+    throw new Error("createLinkAnnotation: rect dimensions must be positive");
   }
 
   const m = await getPdfiumModule();
@@ -100,7 +109,10 @@ export async function createLinkAnnotation(
 
   try {
     const pageCount = m.FPDF_GetPageCount(docPtr);
-    if (destinationPage !== undefined && (destinationPage < 0 || destinationPage >= pageCount)) {
+    if (
+      destinationPage !== undefined &&
+      (destinationPage < 0 || destinationPage >= pageCount)
+    ) {
       throw new RangeError(
         `createLinkAnnotation: destinationPage ${destinationPage} out of range [0, ${pageCount})`,
       );
@@ -114,22 +126,22 @@ export async function createLinkAnnotation(
 
       const annotPtr = m.FPDFPage_CreateAnnot(pagePtr, FPDF_ANNOT_LINK);
       if (!annotPtr) {
-        throw new Error('Failed to create link annotation');
+        throw new Error("Failed to create link annotation");
       }
 
       try {
         // Set rect (convert from CSS top-left to PDF bottom-left origin)
         // FS_RECTF layout: { left, top, right, bottom } where top > bottom in PDF coords
         const pdfLeft = rect.x;
-        const pdfTop = pageHeight - rect.y;                 // CSS y=0 → PDF top
+        const pdfTop = pageHeight - rect.y; // CSS y=0 → PDF top
         const pdfRight = rect.x + rect.width;
-        const pdfBottom = pageHeight - rect.y - rect.height;   // CSS bottom → PDF bottom
+        const pdfBottom = pageHeight - rect.y - rect.height; // CSS bottom → PDF bottom
 
         const rectBuf = m.pdfium.wasmExports.malloc(4 * 4);
-        m.pdfium.setValue(rectBuf, pdfLeft, 'float');   // offset 0: left
-        m.pdfium.setValue(rectBuf + 4, pdfTop, 'float');   // offset 4: top  (larger y)
-        m.pdfium.setValue(rectBuf + 8, pdfRight, 'float');   // offset 8: right
-        m.pdfium.setValue(rectBuf + 12, pdfBottom, 'float');   // offset 12: bottom (smaller y)
+        m.pdfium.setValue(rectBuf, pdfLeft, "float"); // offset 0: left
+        m.pdfium.setValue(rectBuf + 4, pdfTop, "float"); // offset 4: top  (larger y)
+        m.pdfium.setValue(rectBuf + 8, pdfRight, "float"); // offset 8: right
+        m.pdfium.setValue(rectBuf + 12, pdfBottom, "float"); // offset 12: bottom (smaller y)
         m.FPDFAnnot_SetRect(annotPtr, rectBuf);
         m.pdfium.wasmExports.free(rectBuf);
 
@@ -157,7 +169,7 @@ export async function createLinkAnnotation(
         // Set title / contents
         if (title) {
           const titlePtr = writeUtf16(m, title);
-          m.FPDFAnnot_SetStringValue(annotPtr, 'Contents', titlePtr);
+          m.FPDFAnnot_SetStringValue(annotPtr, "Contents", titlePtr);
           m.pdfium.wasmExports.free(titlePtr);
         }
       } finally {
@@ -168,7 +180,6 @@ export async function createLinkAnnotation(
     }
 
     return await saveRawDocument(docPtr);
-
   } finally {
     closeDocAndFreeBuffer(m, docPtr);
   }
@@ -207,7 +218,11 @@ export async function extractLinksFromPage(
   data: ArrayBuffer | Uint8Array,
   pageIndex: number,
   password?: string,
-): Promise<{ links: PdfLibLink[]; pdfPageWidth: number; pdfPageHeight: number }> {
+): Promise<{
+  links: PdfLibLink[];
+  pdfPageWidth: number;
+  pdfPageHeight: number;
+}> {
   const m = await getPdfiumModule();
   const docPtr = await openRawDocumentSafe(data, password);
 
@@ -245,7 +260,7 @@ export async function extractLinksFromPage(
 
         // Try to get link object
         const linkPtr = m.FPDFAnnot_GetLink(annotPtr);
-        let linkType: LinkType = 'unknown';
+        let linkType: LinkType = "unknown";
         let targetPage: number | undefined;
         let uri: string | undefined;
 
@@ -261,33 +276,43 @@ export async function extractLinksFromPage(
                 m.FPDFAction_GetURIPath(docPtr, actionPtr, uriBuf, uriLen);
                 uri = m.pdfium.UTF8ToString(uriBuf);
                 m.pdfium.wasmExports.free(uriBuf);
-                linkType = 'external';
+                linkType = "external";
               }
             } else if (actionType === PDFACTION_GOTO) {
               const destPtr = m.FPDFAction_GetDest(docPtr, actionPtr);
               if (destPtr) {
                 targetPage = m.FPDFDest_GetDestPageIndex(docPtr, destPtr);
-                linkType = 'internal';
+                linkType = "internal";
               }
             }
           }
 
           // Check for direct destination
-          if (linkType === 'unknown') {
+          if (linkType === "unknown") {
             const destPtr = m.FPDFLink_GetDest(docPtr, linkPtr);
             if (destPtr) {
               targetPage = m.FPDFDest_GetDestPageIndex(docPtr, destPtr);
-              linkType = 'internal';
+              linkType = "internal";
             }
           }
         }
 
         // Get title from /Contents
         let title: string | undefined;
-        const contentsLen = m.FPDFAnnot_GetStringValue(annotPtr, 'Contents', 0, 0);
+        const contentsLen = m.FPDFAnnot_GetStringValue(
+          annotPtr,
+          "Contents",
+          0,
+          0,
+        );
         if (contentsLen > 2) {
           const contentsBuf = m.pdfium.wasmExports.malloc(contentsLen);
-          m.FPDFAnnot_GetStringValue(annotPtr, 'Contents', contentsBuf, contentsLen);
+          m.FPDFAnnot_GetStringValue(
+            annotPtr,
+            "Contents",
+            contentsBuf,
+            contentsLen,
+          );
           title = readUtf16(m, contentsBuf, contentsLen) || undefined;
           m.pdfium.wasmExports.free(contentsBuf);
         }
@@ -299,12 +324,19 @@ export async function extractLinksFromPage(
         const gPtr = rPtr + 4;
         const bPtr = rPtr + 8;
         const aPtr = rPtr + 12;
-        const hasColor = m.FPDFAnnot_GetColor(annotPtr, 0, rPtr, gPtr, bPtr, aPtr);
+        const hasColor = m.FPDFAnnot_GetColor(
+          annotPtr,
+          0,
+          rPtr,
+          gPtr,
+          bPtr,
+          aPtr,
+        );
         if (hasColor) {
           color = [
-            m.pdfium.getValue(rPtr, 'i32') / 255,
-            m.pdfium.getValue(gPtr, 'i32') / 255,
-            m.pdfium.getValue(bPtr, 'i32') / 255,
+            m.pdfium.getValue(rPtr, "i32") / 255,
+            m.pdfium.getValue(gPtr, "i32") / 255,
+            m.pdfium.getValue(bPtr, "i32") / 255,
           ];
         }
         m.pdfium.wasmExports.free(rPtr);
@@ -322,7 +354,7 @@ export async function extractLinksFromPage(
 
         m.FPDFPage_CloseAnnot(annotPtr);
       } catch (e) {
-        console.warn('[pdfLinkUtils] Failed to parse annotation:', e);
+        console.warn("[pdfLinkUtils] Failed to parse annotation:", e);
       }
     }
 
diff --git a/frontend/src/core/utils/pdfiumBitmapUtils.ts b/frontend/src/core/utils/pdfiumBitmapUtils.ts
index 6501cb6efd..95022d80d1 100644
--- a/frontend/src/core/utils/pdfiumBitmapUtils.ts
+++ b/frontend/src/core/utils/pdfiumBitmapUtils.ts
@@ -9,7 +9,7 @@
  * the colour-channel swizzle in a plain JS TypedArray and then bulk-
  * copy the result into the WASM heap with a single `HEAPU8.set()`.
  */
-import type { WrappedPdfiumModule } from '@embedpdf/pdfium';
+import type { WrappedPdfiumModule } from "@embedpdf/pdfium";
 
 /** FPDF_ANNOT_LINK */
 export const FPDF_ANNOT_LINK = 4;
@@ -51,26 +51,25 @@ export function copyRgbaToBgraHeap(
     // Fast path: no padding — single bulk copy after swizzle
     const bgra = new Uint8Array(rgba.length);
     for (let i = 0; i < rgba.length; i += 4) {
-      bgra[i]     = rgba[i + 2]; // B
+      bgra[i] = rgba[i + 2]; // B
       bgra[i + 1] = rgba[i + 1]; // G
-      bgra[i + 2] = rgba[i];     // R
+      bgra[i + 2] = rgba[i]; // R
       bgra[i + 3] = rgba[i + 3]; // A
     }
-    new Uint8Array(
-      (m.pdfium.wasmExports as any).memory.buffer,
-    ).set(bgra, bufferPtr);
+    new Uint8Array((m.pdfium.wasmExports as any).memory.buffer).set(
+      bgra,
+      bufferPtr,
+    );
   } else {
     // Stride has padding — swizzle + copy row by row
     const rowBuf = new Uint8Array(rowBytes);
-    const heap = new Uint8Array(
-      (m.pdfium.wasmExports as any).memory.buffer,
-    );
+    const heap = new Uint8Array((m.pdfium.wasmExports as any).memory.buffer);
     for (let y = 0; y < height; y++) {
       const srcRowStart = y * rowBytes;
       for (let x = 0; x < rowBytes; x += 4) {
-        rowBuf[x]     = rgba[srcRowStart + x + 2]; // B
+        rowBuf[x] = rgba[srcRowStart + x + 2]; // B
         rowBuf[x + 1] = rgba[srcRowStart + x + 1]; // G
-        rowBuf[x + 2] = rgba[srcRowStart + x];     // R
+        rowBuf[x + 2] = rgba[srcRowStart + x]; // R
         rowBuf[x + 3] = rgba[srcRowStart + x + 3]; // A
       }
       heap.set(rowBuf, bufferPtr + y * stride);
@@ -107,12 +106,24 @@ export function embedBitmapImageOnPage(
     const bufferPtr = m.FPDFBitmap_GetBuffer(bitmapPtr);
     const stride = m.FPDFBitmap_GetStride(bitmapPtr);
 
-    copyRgbaToBgraHeap(m, image.rgba, bufferPtr, image.width, image.height, stride);
+    copyRgbaToBgraHeap(
+      m,
+      image.rgba,
+      bufferPtr,
+      image.width,
+      image.height,
+      stride,
+    );
 
     const imageObjPtr = m.FPDFPageObj_NewImageObj(docPtr);
     if (!imageObjPtr) return false;
 
-    const setBitmapOk = m.FPDFImageObj_SetBitmap(pagePtr, 0, imageObjPtr, bitmapPtr);
+    const setBitmapOk = m.FPDFImageObj_SetBitmap(
+      pagePtr,
+      0,
+      imageObjPtr,
+      bitmapPtr,
+    );
     if (!setBitmapOk) {
       m.FPDFPageObj_Destroy(imageObjPtr);
       return false;
@@ -124,12 +135,12 @@ export function embedBitmapImageOnPage(
     // Set affine transform: [a b c d e f]
     const matrixPtr = m.pdfium.wasmExports.malloc(6 * 4);
     try {
-      m.pdfium.setValue(matrixPtr,      drawWidth,  'float'); // a — scaleX
-      m.pdfium.setValue(matrixPtr + 4,  0,          'float'); // b
-      m.pdfium.setValue(matrixPtr + 8,  0,          'float'); // c
-      m.pdfium.setValue(matrixPtr + 12, drawHeight, 'float'); // d — scaleY
-      m.pdfium.setValue(matrixPtr + 16, pdfX,       'float'); // e — translateX
-      m.pdfium.setValue(matrixPtr + 20, pdfY,       'float'); // f — translateY
+      m.pdfium.setValue(matrixPtr, drawWidth, "float"); // a — scaleX
+      m.pdfium.setValue(matrixPtr + 4, 0, "float"); // b
+      m.pdfium.setValue(matrixPtr + 8, 0, "float"); // c
+      m.pdfium.setValue(matrixPtr + 12, drawHeight, "float"); // d — scaleY
+      m.pdfium.setValue(matrixPtr + 16, pdfX, "float"); // e — translateX
+      m.pdfium.setValue(matrixPtr + 20, pdfY, "float"); // f — translateY
 
       if (!m.FPDFPageObj_SetMatrix(imageObjPtr, matrixPtr)) {
         m.FPDFPageObj_Destroy(imageObjPtr);
@@ -146,7 +157,11 @@ export function embedBitmapImageOnPage(
     // builds but guard anyway.  If already destroyed above, the second call
     // is harmless because we allow it to be idempotent.
     // We use a try-catch to be safe across PDFium WASM builds.
-    try { m.FPDFBitmap_Destroy(bitmapPtr); } catch { /* already freed */ }
+    try {
+      m.FPDFBitmap_Destroy(bitmapPtr);
+    } catch {
+      /* already freed */
+    }
   }
 }
 /**
@@ -183,16 +198,21 @@ export function drawPlaceholderRect(
  * Decode an image data URL (e.g. `data:image/png;base64,...`) to raw RGBA
  * pixel data via an offscreen canvas.
  */
-export function decodeImageDataUrl(dataUrl: string): Promise<DecodedImage | null> {
+export function decodeImageDataUrl(
+  dataUrl: string,
+): Promise<DecodedImage | null> {
   return new Promise((resolve) => {
     const img = new Image();
     img.onload = () => {
       try {
-        const canvas = document.createElement('canvas');
+        const canvas = document.createElement("canvas");
         canvas.width = img.width;
         canvas.height = img.height;
-        const ctx = canvas.getContext('2d');
-        if (!ctx) { resolve(null); return; }
+        const ctx = canvas.getContext("2d");
+        if (!ctx) {
+          resolve(null);
+          return;
+        }
         ctx.drawImage(img, 0, 0);
         const imageData = ctx.getImageData(0, 0, canvas.width, canvas.height);
         resolve({
@@ -200,7 +220,9 @@ export function decodeImageDataUrl(dataUrl: string): Promise<DecodedImage | null
           width: canvas.width,
           height: canvas.height,
         });
-      } catch { resolve(null); }
+      } catch {
+        resolve(null);
+      }
     };
     img.onerror = () => resolve(null);
     img.src = dataUrl;
diff --git a/frontend/src/core/utils/pdfiumPageRender.ts b/frontend/src/core/utils/pdfiumPageRender.ts
new file mode 100644
index 0000000000..0577245c98
--- /dev/null
+++ b/frontend/src/core/utils/pdfiumPageRender.ts
@@ -0,0 +1,124 @@
+/**
+ * pdfiumPageRender — render a single PDF page from an already-opened PDFium
+ * document pointer to a canvas data URL.
+ *
+ * Shared by the first-page thumbnail path (thumbnailUtils.ts) and the
+ * per-page thumbnail service (thumbnailGenerationService.ts) so the pixel-
+ * copy + white-background logic lives in one place.
+ */
+import { getPdfiumModule } from "@app/services/pdfiumService";
+
+/** FPDF_ANNOT (0x01) | FPDF_LCD_TEXT (0x10). */
+const PDFIUM_RENDER_FLAGS = 0x01 | 0x10;
+
+export interface RenderPdfiumPageOptions {
+  /** When true (default), bake the page's own rotation into the bitmap.
+   *  When false, render upright so callers can apply CSS rotation. */
+  applyRotation?: boolean;
+  /** Output format; defaults to PNG. */
+  format?: "png" | "jpeg";
+  /** JPEG quality [0,1]; ignored for PNG. */
+  quality?: number;
+}
+
+/**
+ * Render a single page (0-indexed) of an open PDFium document into a data URL.
+ *
+ * The caller is responsible for opening and closing the document pointer.
+ */
+export async function renderPdfiumPageDataUrl(
+  docPtr: number,
+  pageIndex: number,
+  scale: number,
+  options: RenderPdfiumPageOptions = {},
+): Promise<string | null> {
+  const { applyRotation = true, format = "png", quality } = options;
+  const m = await getPdfiumModule();
+
+  const pagePtr = m.FPDF_LoadPage(docPtr, pageIndex);
+  if (!pagePtr) return null;
+
+  try {
+    const rawW = m.FPDF_GetPageWidthF(pagePtr);
+    const rawH = m.FPDF_GetPageHeightF(pagePtr);
+    // FPDFPage_GetRotation returns 0..3 for 0°/90°/180°/270° CW.
+    const pageRotQuarters = (m as any).FPDFPage_GetRotation(pagePtr) | 0;
+
+    const isQuarterTurn = pageRotQuarters === 1 || pageRotQuarters === 3;
+    const outW = applyRotation && isQuarterTurn ? rawH : rawW;
+    const outH = applyRotation && isQuarterTurn ? rawW : rawH;
+    const w = Math.max(1, Math.round(outW * scale));
+    const h = Math.max(1, Math.round(outH * scale));
+
+    const bitmapPtr = m.FPDFBitmap_Create(w, h, 1);
+    try {
+      // White background — PDF content doesn't encode paper colour, so
+      // unpainted regions would otherwise be transparent.
+      m.FPDFBitmap_FillRect(bitmapPtr, 0, 0, w, h, 0xffffffff);
+      m.FPDF_RenderPageBitmap(
+        bitmapPtr,
+        pagePtr,
+        0,
+        0,
+        w,
+        h,
+        applyRotation ? pageRotQuarters : 0,
+        PDFIUM_RENDER_FLAGS,
+      );
+
+      const bufferPtr = m.FPDFBitmap_GetBuffer(bitmapPtr);
+      const stride = m.FPDFBitmap_GetStride(bitmapPtr);
+      const heap = new Uint8Array((m.pdfium.wasmExports as any).memory.buffer);
+      const pixels = new Uint8ClampedArray(w * h * 4);
+
+      // BGRA → RGBA. Direct HEAPU8 indexing is ~100× faster than
+      // per-pixel m.pdfium.getValue() calls for large bitmaps.
+      for (let y = 0; y < h; y++) {
+        const srcRow = bufferPtr + y * stride;
+        const dstRow = y * w * 4;
+        for (let x = 0; x < w; x++) {
+          const so = srcRow + x * 4;
+          const dst = dstRow + x * 4;
+          pixels[dst] = heap[so + 2];
+          pixels[dst + 1] = heap[so + 1];
+          pixels[dst + 2] = heap[so];
+          pixels[dst + 3] = heap[so + 3];
+        }
+      }
+
+      const canvas = document.createElement("canvas");
+      canvas.width = w;
+      canvas.height = h;
+      const ctx = canvas.getContext("2d");
+      if (!ctx) return null;
+      ctx.putImageData(new ImageData(pixels, w, h), 0, 0);
+      return format === "jpeg"
+        ? canvas.toDataURL("image/jpeg", quality ?? 0.8)
+        : canvas.toDataURL();
+    } finally {
+      m.FPDFBitmap_Destroy(bitmapPtr);
+    }
+  } finally {
+    m.FPDF_ClosePage(pagePtr);
+  }
+}
+
+/**
+ * Read raw width/height/rotation for a page without rendering.
+ */
+export async function readPdfiumPageMetadata(
+  docPtr: number,
+  pageIndex: number,
+): Promise<{ width: number; height: number; rotation: number } | null> {
+  const m = await getPdfiumModule();
+  const pagePtr = m.FPDF_LoadPage(docPtr, pageIndex);
+  if (!pagePtr) return null;
+  try {
+    const width = m.FPDF_GetPageWidthF(pagePtr);
+    const height = m.FPDF_GetPageHeightF(pagePtr);
+    const rotation = (((m as any).FPDFPage_GetRotation(pagePtr) | 0) & 3) * 90;
+    return { width, height, rotation };
+  } finally {
+    m.FPDF_ClosePage(pagePtr);
+  }
+}
diff --git a/frontend/src/core/utils/resourceManager.ts b/frontend/src/core/utils/resourceManager.ts
index 06ba74dfe2..67f3ab71b8 100644
--- a/frontend/src/core/utils/resourceManager.ts
+++ b/frontend/src/core/utils/resourceManager.ts
@@ -2,8 +2,8 @@
  * Utilities for managing file resources and blob URLs
  */
 
-import { useCallback } from 'react';
-import { AUTOMATION_CONSTANTS } from '@app/constants/automation';
+import { useCallback } from "react";
+import { AUTOMATION_CONSTANTS } from "@app/constants/automation";
 
 export class ResourceManager {
   private static blobUrls = new Set<string>();
@@ -31,7 +31,7 @@ export class ResourceManager {
    * Revoke all tracked blob URLs
    */
   static revokeAllBlobUrls(): void {
-    this.blobUrls.forEach(url => URL.revokeObjectURL(url));
+    this.blobUrls.forEach((url) => URL.revokeObjectURL(url));
     this.blobUrls.clear();
   }
 
@@ -39,10 +39,10 @@ export class ResourceManager {
    * Create a File with proper naming convention
    */
   static createResultFile(
-    data: BlobPart, 
-    originalName: string, 
+    data: BlobPart,
+    originalName: string,
     prefix: string = AUTOMATION_CONSTANTS.PROCESSED_FILE_PREFIX,
-    type: string = 'application/pdf'
+    type: string = "application/pdf",
   ): File {
     return new File([data], `${prefix}${originalName}`, { type });
   }
@@ -53,8 +53,8 @@ export class ResourceManager {
   static createTimestampedFile(
     data: BlobPart,
     prefix: string,
-    extension: string = '.pdf',
-    type: string = 'application/pdf'
+    extension: string = ".pdf",
+    type: string = "application/pdf",
   ): File {
     const timestamp = Date.now();
     return new File([data], `${prefix}${timestamp}${extension}`, { type });
@@ -68,4 +68,4 @@ export function useResourceCleanup(): () => void {
   return useCallback(() => {
     ResourceManager.revokeAllBlobUrls();
   }, []);
-}
\ No newline at end of file
+}
diff --git a/frontend/src/core/utils/scarfTracking.ts b/frontend/src/core/utils/scarfTracking.ts
index 9824d9b3be..4c8d8b6c38 100644
--- a/frontend/src/core/utils/scarfTracking.ts
+++ b/frontend/src/core/utils/scarfTracking.ts
@@ -15,7 +15,8 @@
 // Module-level state
 let configured: boolean = false;
 let enableScarf: boolean | null = null;
-let isServiceAccepted: ((service: string, category: string) => boolean) | null = null;
+let isServiceAccepted: ((service: string, category: string) => boolean) | null =
+  null;
 let lastFiredPathname: string | null = null;
 let lastFiredTime = 0;
 
@@ -28,7 +29,7 @@ let lastFiredTime = 0;
  */
 export function setScarfConfig(
   scarfEnabled: boolean | null,
-  consentChecker: (service: string, category: string) => boolean
+  consentChecker: (service: string, category: string) => boolean,
 ): void {
   configured = true;
   enableScarf = scarfEnabled;
@@ -49,8 +50,8 @@ export function firePixel(pathname: string): void {
   // Dev-mode warning if called before initialization
   if (!configured) {
     console.warn(
-      '[scarfTracking] firePixel() called before setScarfConfig(). ' +
-      'Ensure useScarfTracking() hook is mounted in App.tsx.'
+      "[scarfTracking] firePixel() called before setScarfConfig(). " +
+        "Ensure useScarfTracking() hook is mounted in App.tsx.",
     );
     return;
   }
@@ -61,7 +62,7 @@ export function firePixel(pathname: string): void {
   }
 
   // Check if consent checker is available and scarf service is accepted
-  if (!isServiceAccepted || !isServiceAccepted('scarf', 'analytics')) {
+  if (!isServiceAccepted || !isServiceAccepted("scarf", "analytics")) {
     return;
   }
 
@@ -75,8 +76,10 @@ export function firePixel(pathname: string): void {
   lastFiredPathname = pathname;
   lastFiredTime = now;
 
-  const url = 'https://static.scarf.sh/a.png?x-pxid=3c1d68de-8945-4e9f-873f-65320b6fabf7'
-             + '&path=' + encodeURIComponent(pathname);
+  const url =
+    "https://static.scarf.sh/a.png?x-pxid=3c1d68de-8945-4e9f-873f-65320b6fabf7" +
+    "&path=" +
+    encodeURIComponent(pathname);
 
   const img = new Image();
   img.referrerPolicy = "no-referrer-when-downgrade";
diff --git a/frontend/src/core/utils/scriptLoader.ts b/frontend/src/core/utils/scriptLoader.ts
index bf0b64dedb..60c9c02ec8 100644
--- a/frontend/src/core/utils/scriptLoader.ts
+++ b/frontend/src/core/utils/scriptLoader.ts
@@ -12,7 +12,13 @@ interface ScriptLoadOptions {
 
 const loadedScripts = new Set<string>();
 
-export function loadScript({ src, id, async = true, defer = false, onLoad }: ScriptLoadOptions): Promise<void> {
+export function loadScript({
+  src,
+  id,
+  async = true,
+  defer = false,
+  onLoad,
+}: ScriptLoadOptions): Promise<void> {
   return new Promise((resolve, reject) => {
     // Check if already loaded
     const scriptId = id || src;
@@ -22,7 +28,9 @@ export function loadScript({ src, id, async = true, defer = false, onLoad }: Scr
     }
 
     // Check if script already exists in DOM
-    const existingScript = id ? document.getElementById(id) : document.querySelector(`script[src="${src}"]`);
+    const existingScript = id
+      ? document.getElementById(id)
+      : document.querySelector(`script[src="${src}"]`);
     if (existingScript) {
       loadedScripts.add(scriptId);
       resolve();
@@ -30,7 +38,7 @@ export function loadScript({ src, id, async = true, defer = false, onLoad }: Scr
     }
 
     // Create and append script
-    const script = document.createElement('script');
+    const script = document.createElement("script");
     script.src = src;
     if (id) script.id = id;
     script.async = async;
diff --git a/frontend/src/core/utils/settingsNavigation.ts b/frontend/src/core/utils/settingsNavigation.ts
index f910002fc0..b5b433d4d9 100644
--- a/frontend/src/core/utils/settingsNavigation.ts
+++ b/frontend/src/core/utils/settingsNavigation.ts
@@ -1,4 +1,4 @@
-import { NavKey } from '@app/components/shared/config/types';
+import { NavKey } from "@app/components/shared/config/types";
 
 /**
  * Navigate to a specific settings section
@@ -13,12 +13,12 @@ import { NavKey } from '@app/components/shared/config/types';
  * navigateToSettings('adminPremium');
  */
 export function navigateToSettings(section: NavKey) {
-  const basePath = window.location.pathname.split('/settings')[0] || '';
+  const basePath = window.location.pathname.split("/settings")[0] || "";
   const newPath = `${basePath}/settings/${section}`;
-  window.history.pushState({}, '', newPath);
+  window.history.pushState({}, "", newPath);
 
   // Trigger a popstate event to notify components
-  window.dispatchEvent(new PopStateEvent('popstate'));
+  window.dispatchEvent(new PopStateEvent("popstate"));
 }
 
 /**
@@ -46,7 +46,7 @@ export function isInSettings(section?: NavKey): boolean {
   const pathname = window.location.pathname;
 
   if (!section) {
-    return pathname.startsWith('/settings');
+    return pathname.startsWith("/settings");
   }
 
   return pathname === `/settings/${section}`;
diff --git a/frontend/src/core/utils/settingsPendingHelper.ts b/frontend/src/core/utils/settingsPendingHelper.ts
index 63ea354ef5..f15e3e1309 100644
--- a/frontend/src/core/utils/settingsPendingHelper.ts
+++ b/frontend/src/core/utils/settingsPendingHelper.ts
@@ -23,11 +23,13 @@ export interface SettingsWithPending<T = any> {
  * @param settings Settings object from backend (may contain _pending block)
  * @returns Merged settings with pending values applied
  */
-export function mergePendingSettings<T extends SettingsWithPending>(settings: T): Omit<T, '_pending'> {
+export function mergePendingSettings<T extends SettingsWithPending>(
+  settings: T,
+): Omit<T, "_pending"> {
   if (!settings || !settings._pending) {
     // No pending changes, return as-is (without _pending property)
     const { _pending, ...rest } = settings || {};
-    return rest as Omit<T, '_pending'>;
+    return rest as Omit<T, "_pending">;
   }
 
   // Deep merge pending changes
@@ -35,7 +37,7 @@ export function mergePendingSettings<T extends SettingsWithPending>(settings: T)
 
   // Remove _pending from result
   const { _pending, ...result } = merged;
-  return result as Omit<T, '_pending'>;
+  return result as Omit<T, "_pending">;
 }
 
 /**
@@ -47,10 +49,12 @@ export function mergePendingSettings<T extends SettingsWithPending>(settings: T)
  */
 export function isFieldPending<T extends SettingsWithPending>(
   settings: T | null | undefined,
-  fieldPath: string
+  fieldPath: string,
 ): boolean {
   if (!settings?._pending) {
-    console.log(`[isFieldPending] No _pending block found for field: ${fieldPath}`);
+    console.log(
+      `[isFieldPending] No _pending block found for field: ${fieldPath}`,
+    );
     return false;
   }
 
@@ -59,7 +63,10 @@ export function isFieldPending<T extends SettingsWithPending>(
   const isPending = value !== undefined;
 
   if (isPending) {
-    console.log(`[isFieldPending] Field ${fieldPath} IS pending with value:`, value);
+    console.log(
+      `[isFieldPending] Field ${fieldPath} IS pending with value:`,
+      value,
+    );
   }
 
   return isPending;
@@ -72,9 +79,12 @@ export function isFieldPending<T extends SettingsWithPending>(
  * @returns True if there are any pending changes
  */
 export function hasPendingChanges<T extends SettingsWithPending>(
-  settings: T | null | undefined
+  settings: T | null | undefined,
 ): boolean {
-  return settings?._pending !== undefined && Object.keys(settings._pending).length > 0;
+  return (
+    settings?._pending !== undefined &&
+    Object.keys(settings._pending).length > 0
+  );
 }
 
 /**
@@ -86,7 +96,7 @@ export function hasPendingChanges<T extends SettingsWithPending>(
  */
 export function getPendingValue<T extends SettingsWithPending>(
   settings: T | null | undefined,
-  fieldPath: string
+  fieldPath: string,
 ): any {
   if (!settings?._pending) {
     return undefined;
@@ -104,7 +114,7 @@ export function getPendingValue<T extends SettingsWithPending>(
  */
 export function getCurrentValue<T extends SettingsWithPending>(
   settings: T | null | undefined,
-  fieldPath: string
+  fieldPath: string,
 ): any {
   if (!settings) {
     return undefined;
@@ -148,7 +158,7 @@ function deepMerge(target: any, source: any): any {
 function getNestedValue(obj: any, path: string): any {
   if (!obj || !path) return undefined;
 
-  const parts = path.split('.');
+  const parts = path.split(".");
   let current = obj;
 
   for (const part of parts) {
@@ -166,8 +176,6 @@ function getNestedValue(obj: any, path: string): any {
  */
 function isPlainObject(value: any): boolean {
   return (
-    value !== null &&
-    typeof value === 'object' &&
-    value.constructor === Object
+    value !== null && typeof value === "object" && value.constructor === Object
   );
 }
diff --git a/frontend/src/core/utils/sidebarUtils.ts b/frontend/src/core/utils/sidebarUtils.ts
index 67b0a4123c..d111592d43 100644
--- a/frontend/src/core/utils/sidebarUtils.ts
+++ b/frontend/src/core/utils/sidebarUtils.ts
@@ -1,4 +1,4 @@
-import { SidebarRefs, SidebarState, SidebarInfo } from '@app/types/sidebar';
+import { SidebarRefs, SidebarState, SidebarInfo } from "@app/types/sidebar";
 
 /**
  * Gets the All tools sidebar information using React refs and state
@@ -6,15 +6,18 @@ import { SidebarRefs, SidebarState, SidebarInfo } from '@app/types/sidebar';
  * @param state - Current sidebar state
  * @returns Object containing the sidebar rect and whether the tool panel is active
  */
-export function getSidebarInfo(refs: SidebarRefs, state: SidebarState): SidebarInfo {
+export function getSidebarInfo(
+  refs: SidebarRefs,
+  state: SidebarState,
+): SidebarInfo {
   const { quickAccessRef, toolPanelRef } = refs;
   const { sidebarsVisible, readerMode } = state;
-  
+
   // Determine if tool panel should be active based on state
   const isToolPanelActive = sidebarsVisible && !readerMode;
-  
+
   let rect: DOMRect | null = null;
-  
+
   if (isToolPanelActive && toolPanelRef.current) {
     // Tool panel is expanded: use its rect
     rect = toolPanelRef.current.getBoundingClientRect();
@@ -23,12 +26,10 @@ export function getSidebarInfo(refs: SidebarRefs, state: SidebarState): SidebarI
     // This probably isn't needed but if we ever have tooltips or modals that need to be positioned relative to the quick access bar, we can use this
     rect = quickAccessRef.current.getBoundingClientRect();
   }
-  
+
   return {
     rect,
     isToolPanelActive,
-    sidebarState: state
+    sidebarState: state,
   };
 }
-
- 
\ No newline at end of file
diff --git a/frontend/src/core/utils/signatureFlattening.ts b/frontend/src/core/utils/signatureFlattening.ts
index fdfa1a628a..56d9d63fef 100644
--- a/frontend/src/core/utils/signatureFlattening.ts
+++ b/frontend/src/core/utils/signatureFlattening.ts
@@ -5,17 +5,25 @@ import {
   embedBitmapImageOnPage,
   drawPlaceholderRect,
   decodeImageDataUrl,
-} from '@app/utils/pdfiumBitmapUtils';
-import { generateThumbnailWithMetadata } from '@app/utils/thumbnailUtils';
-import { createChildStub, createProcessedFile } from '@app/contexts/file/fileActions';
-import { createStirlingFile, FileId, StirlingFile, StirlingFileStub } from '@app/types/fileContext';
-import type { SignatureAPI } from '@app/components/viewer/viewerTypes';
+} from "@app/utils/pdfiumBitmapUtils";
+import { generateThumbnailWithMetadata } from "@app/utils/thumbnailUtils";
+import {
+  createChildStub,
+  createProcessedFile,
+} from "@app/contexts/file/fileActions";
+import {
+  createStirlingFile,
+  FileId,
+  StirlingFile,
+  StirlingFileStub,
+} from "@app/types/fileContext";
+import type { SignatureAPI } from "@app/components/viewer/viewerTypes";
 import {
   getPdfiumModule,
   openRawDocumentSafe,
   closeDocAndFreeBuffer,
   saveRawDocument,
-} from '@app/services/pdfiumService';
+} from "@app/services/pdfiumService";
 
 interface MinimalFileContextSelectors {
   getAllFileIds: () => FileId[];
@@ -41,12 +49,22 @@ export interface SignatureFlatteningResult {
   outputStub: StirlingFileStub;
 }
 
-export async function flattenSignatures(options: SignatureFlatteningOptions): Promise<SignatureFlatteningResult | null> {
-  const { signatureApiRef, getImageData, exportActions, selectors, originalFile, getScrollState, activeFileIndex } = options;
+export async function flattenSignatures(
+  options: SignatureFlatteningOptions,
+): Promise<SignatureFlatteningResult | null> {
+  const {
+    signatureApiRef,
+    getImageData,
+    exportActions,
+    selectors,
+    originalFile,
+    getScrollState,
+    activeFileIndex,
+  } = options;
 
   try {
     // Step 1: Extract all annotations from EmbedPDF before export
-    const allAnnotations: Array<{pageIndex: number, annotations: any[]}> = [];
+    const allAnnotations: Array<{ pageIndex: number; annotations: any[] }> = [];
 
     if (signatureApiRef?.current) {
       const scrollState = getScrollState();
@@ -54,22 +72,39 @@ export async function flattenSignatures(options: SignatureFlatteningOptions): Pr
 
       for (let pageIndex = 0; pageIndex < totalPages; pageIndex++) {
         try {
-          const pageAnnotations = await signatureApiRef.current.getPageAnnotations(pageIndex);
+          const pageAnnotations =
+            await signatureApiRef.current.getPageAnnotations(pageIndex);
           if (pageAnnotations && pageAnnotations.length > 0) {
-            const sessionAnnotations = pageAnnotations.filter(annotation => {
-              const hasStoredImageData = annotation.id && getImageData(annotation.id);
-              const hasDirectImageData = annotation.imageData || annotation.appearance ||
-                                       annotation.stampData || annotation.imageSrc ||
-                                       annotation.contents || annotation.data;
-              return hasStoredImageData || (hasDirectImageData && typeof hasDirectImageData === 'string' && hasDirectImageData.startsWith('data:image'));
+            const sessionAnnotations = pageAnnotations.filter((annotation) => {
+              const hasStoredImageData =
+                annotation.id && getImageData(annotation.id);
+              const hasDirectImageData =
+                annotation.imageData ||
+                annotation.appearance ||
+                annotation.stampData ||
+                annotation.imageSrc ||
+                annotation.contents ||
+                annotation.data;
+              return (
+                hasStoredImageData ||
+                (hasDirectImageData &&
+                  typeof hasDirectImageData === "string" &&
+                  hasDirectImageData.startsWith("data:image"))
+              );
             });
 
             if (sessionAnnotations.length > 0) {
-              allAnnotations.push({pageIndex, annotations: sessionAnnotations});
+              allAnnotations.push({
+                pageIndex,
+                annotations: sessionAnnotations,
+              });
             }
           }
         } catch (pageError) {
-          console.warn(`Error extracting annotations from page ${pageIndex + 1}:`, pageError);
+          console.warn(
+            `Error extracting annotations from page ${pageIndex + 1}:`,
+            pageError,
+          );
         }
       }
     }
@@ -79,9 +114,15 @@ export async function flattenSignatures(options: SignatureFlatteningOptions): Pr
       for (const pageData of allAnnotations) {
         for (const annotation of pageData.annotations) {
           try {
-            signatureApiRef.current.deleteAnnotation(annotation.id, pageData.pageIndex);
+            signatureApiRef.current.deleteAnnotation(
+              annotation.id,
+              pageData.pageIndex,
+            );
           } catch (deleteError) {
-            console.warn(`Failed to delete annotation ${annotation.id}:`, deleteError);
+            console.warn(
+              `Failed to delete annotation ${annotation.id}:`,
+              deleteError,
+            );
           }
         }
       }
@@ -89,33 +130,41 @@ export async function flattenSignatures(options: SignatureFlatteningOptions): Pr
 
     // Step 3: Use EmbedPDF's saveAsCopy to get the original PDF
     if (!exportActions) {
-      console.error('No export actions available');
+      console.error("No export actions available");
       return null;
     }
     const pdfArrayBuffer = await exportActions.saveAsCopy();
 
     if (pdfArrayBuffer) {
-      const blob = new Blob([pdfArrayBuffer], { type: 'application/pdf' });
+      const blob = new Blob([pdfArrayBuffer], { type: "application/pdf" });
 
       let currentFile = originalFile;
       if (!currentFile) {
         const allFileIds = selectors.getAllFileIds();
         if (allFileIds.length > 0) {
-          const fileIndex = activeFileIndex !== undefined && activeFileIndex < allFileIds.length ? activeFileIndex : 0;
+          const fileIndex =
+            activeFileIndex !== undefined && activeFileIndex < allFileIds.length
+              ? activeFileIndex
+              : 0;
           const fileStub = selectors.getStirlingFileStub(allFileIds[fileIndex]);
           const fileObject = selectors.getFile(allFileIds[fileIndex]);
           if (fileStub && fileObject) {
-            currentFile = createStirlingFile(fileObject, allFileIds[fileIndex] as FileId);
+            currentFile = createStirlingFile(
+              fileObject,
+              allFileIds[fileIndex] as FileId,
+            );
           }
         }
       }
 
       if (!currentFile) {
-        console.error('No file available to replace');
+        console.error("No file available to replace");
         return null;
       }
 
-      let signedFile = new File([blob], currentFile.name, { type: 'application/pdf' });
+      let signedFile = new File([blob], currentFile.name, {
+        type: "application/pdf",
+      });
 
       // Step 4: Manually render extracted annotations onto the PDF using PDFium WASM
       if (allAnnotations.length > 0) {
@@ -138,11 +187,17 @@ export async function flattenSignatures(options: SignatureFlatteningOptions): Pr
 
                 for (const annotation of annotations) {
                   try {
-                    const rect = annotation.rect || annotation.bounds || annotation.rectangle || annotation.position;
+                    const rect =
+                      annotation.rect ||
+                      annotation.bounds ||
+                      annotation.rectangle ||
+                      annotation.position;
 
                     if (rect) {
-                      const originalX = rect.origin?.x || rect.x || rect.left || 0;
-                      const originalY = rect.origin?.y || rect.y || rect.top || 0;
+                      const originalX =
+                        rect.origin?.x || rect.x || rect.left || 0;
+                      const originalY =
+                        rect.origin?.y || rect.y || rect.top || 0;
                       const width = rect.size?.width || rect.width || 100;
                       const height = rect.size?.height || rect.height || 50;
 
@@ -150,8 +205,13 @@ export async function flattenSignatures(options: SignatureFlatteningOptions): Pr
                       const pdfX = originalX;
                       const pdfY = pageHeight - originalY - height;
 
-                      let imageDataUrl = annotation.imageData || annotation.appearance || annotation.stampData ||
-                                       annotation.imageSrc || annotation.contents || annotation.data;
+                      let imageDataUrl =
+                        annotation.imageData ||
+                        annotation.appearance ||
+                        annotation.stampData ||
+                        annotation.imageSrc ||
+                        annotation.contents ||
+                        annotation.data;
 
                       if (!imageDataUrl && annotation.id) {
                         const storedImageData = getImageData(annotation.id);
@@ -161,28 +221,70 @@ export async function flattenSignatures(options: SignatureFlatteningOptions): Pr
                       }
 
                       // Convert SVG to PNG first if needed
-                      if (imageDataUrl && typeof imageDataUrl === 'string' && imageDataUrl.startsWith('data:image/svg+xml')) {
-                        const pngBytes = await rasteriseSvgToPng(imageDataUrl, width * 2, height * 2);
+                      if (
+                        imageDataUrl &&
+                        typeof imageDataUrl === "string" &&
+                        imageDataUrl.startsWith("data:image/svg+xml")
+                      ) {
+                        const pngBytes = await rasteriseSvgToPng(
+                          imageDataUrl,
+                          width * 2,
+                          height * 2,
+                        );
                         if (pngBytes) {
                           imageDataUrl = await uint8ArrayToPngDataUrl(pngBytes);
                         } else {
-                          drawPlaceholderRect(m, pagePtr, pdfX, pdfY, width, height);
+                          drawPlaceholderRect(
+                            m,
+                            pagePtr,
+                            pdfX,
+                            pdfY,
+                            width,
+                            height,
+                          );
                           continue;
                         }
                       }
 
-                      if (imageDataUrl && typeof imageDataUrl === 'string' && imageDataUrl.startsWith('data:image')) {
+                      if (
+                        imageDataUrl &&
+                        typeof imageDataUrl === "string" &&
+                        imageDataUrl.startsWith("data:image")
+                      ) {
                         // Decode the image data URL to raw pixels via canvas
-                        const imageResult = await decodeImageDataUrl(imageDataUrl);
+                        const imageResult =
+                          await decodeImageDataUrl(imageDataUrl);
                         if (imageResult) {
-                          embedBitmapImageOnPage(m, docPtr, pagePtr, imageResult, pdfX, pdfY, width, height);
+                          embedBitmapImageOnPage(
+                            m,
+                            docPtr,
+                            pagePtr,
+                            imageResult,
+                            pdfX,
+                            pdfY,
+                            width,
+                            height,
+                          );
                         }
-                      } else if (annotation.type === FPDF_ANNOT_INK || annotation.type === FPDF_ANNOT_LINE) {
-                        drawPlaceholderRect(m, pagePtr, pdfX, pdfY, width, height);
+                      } else if (
+                        annotation.type === FPDF_ANNOT_INK ||
+                        annotation.type === FPDF_ANNOT_LINE
+                      ) {
+                        drawPlaceholderRect(
+                          m,
+                          pagePtr,
+                          pdfX,
+                          pdfY,
+                          width,
+                          height,
+                        );
                       }
                     }
                   } catch (annotationError) {
-                    console.warn('Failed to render annotation:', annotationError);
+                    console.warn(
+                      "Failed to render annotation:",
+                      annotationError,
+                    );
                   }
                 }
 
@@ -192,46 +294,51 @@ export async function flattenSignatures(options: SignatureFlatteningOptions): Pr
             }
 
             const resultBuf = await saveRawDocument(docPtr);
-            signedFile = new File([resultBuf], currentFile.name, { type: 'application/pdf' });
+            signedFile = new File([resultBuf], currentFile.name, {
+              type: "application/pdf",
+            });
           } finally {
             closeDocAndFreeBuffer(m, docPtr);
           }
         } catch (renderError) {
-          console.error('Failed to manually render annotations:', renderError);
-          console.warn('Signatures may only show as annotations');
+          console.error("Failed to manually render annotations:", renderError);
+          console.warn("Signatures may only show as annotations");
         }
       }
 
       const thumbnailResult = await generateThumbnailWithMetadata(signedFile);
-      const processedFileMetadata = createProcessedFile(thumbnailResult.pageCount, thumbnailResult.thumbnail);
+      const processedFileMetadata = createProcessedFile(
+        thumbnailResult.pageCount,
+        thumbnailResult.thumbnail,
+      );
 
       const inputFileIds: FileId[] = [currentFile.fileId];
 
       const record = selectors.getStirlingFileStub(currentFile.fileId);
       if (!record) {
-        console.error('No file record found for:', currentFile.fileId);
+        console.error("No file record found for:", currentFile.fileId);
         return null;
       }
 
       const outputStub = createChildStub(
         record,
-        { toolId: 'sign', timestamp: Date.now() },
+        { toolId: "sign", timestamp: Date.now() },
         signedFile,
         thumbnailResult.thumbnail,
-        processedFileMetadata
+        processedFileMetadata,
       );
       const outputStirlingFile = createStirlingFile(signedFile, outputStub.id);
 
       return {
         inputFileIds,
         outputStirlingFile,
-        outputStub
+        outputStub,
       };
     }
 
     return null;
   } catch (error) {
-    console.error('Error flattening signatures:', error);
+    console.error("Error flattening signatures:", error);
     return null;
   }
 }
@@ -241,7 +348,7 @@ export async function flattenSignatures(options: SignatureFlatteningOptions): Pr
  */
 function uint8ArrayToPngDataUrl(pngBytes: Uint8Array): Promise<string> {
   return new Promise((resolve) => {
-    const blob = new Blob([pngBytes as BlobPart], { type: 'image/png' });
+    const blob = new Blob([pngBytes as BlobPart], { type: "image/png" });
     const reader = new FileReader();
     reader.onloadend = () => resolve(reader.result as string);
     reader.readAsDataURL(blob);
@@ -251,28 +358,37 @@ function uint8ArrayToPngDataUrl(pngBytes: Uint8Array): Promise<string> {
 /**
  * Rasterise an SVG data URL to PNG bytes via an offscreen canvas.
  */
-function rasteriseSvgToPng(svgDataUrl: string, width: number, height: number): Promise<Uint8Array | null> {
+function rasteriseSvgToPng(
+  svgDataUrl: string,
+  width: number,
+  height: number,
+): Promise<Uint8Array | null> {
   return new Promise((resolve) => {
     const img = new Image();
     img.onload = () => {
       try {
-        const canvas = document.createElement('canvas');
+        const canvas = document.createElement("canvas");
         canvas.width = Math.max(1, Math.round(width));
         canvas.height = Math.max(1, Math.round(height));
-        const ctx = canvas.getContext('2d');
-        if (!ctx) { resolve(null); return; }
+        const ctx = canvas.getContext("2d");
+        if (!ctx) {
+          resolve(null);
+          return;
+        }
         ctx.drawImage(img, 0, 0, canvas.width, canvas.height);
-        canvas.toBlob(
-          (blob) => {
-            if (!blob) { resolve(null); return; }
-            blob.arrayBuffer().then(
-              (buf) => resolve(new Uint8Array(buf)),
-              () => resolve(null),
-            );
-          },
-          'image/png',
-        );
-      } catch { resolve(null); }
+        canvas.toBlob((blob) => {
+          if (!blob) {
+            resolve(null);
+            return;
+          }
+          blob.arrayBuffer().then(
+            (buf) => resolve(new Uint8Array(buf)),
+            () => resolve(null),
+          );
+        }, "image/png");
+      } catch {
+        resolve(null);
+      }
     };
     img.onerror = () => resolve(null);
     img.src = svgDataUrl;
diff --git a/frontend/src/core/utils/signaturePreview.ts b/frontend/src/core/utils/signaturePreview.ts
index 739edfb432..84e2d9635c 100644
--- a/frontend/src/core/utils/signaturePreview.ts
+++ b/frontend/src/core/utils/signaturePreview.ts
@@ -1,5 +1,8 @@
-import { SignParameters } from '@app/hooks/tools/sign/useSignParameters';
-import { HORIZONTAL_PADDING_RATIO, VERTICAL_PADDING_RATIO } from '@app/constants/signConstants';
+import { SignParameters } from "@app/hooks/tools/sign/useSignParameters";
+import {
+  HORIZONTAL_PADDING_RATIO,
+  VERTICAL_PADDING_RATIO,
+} from "@app/constants/signConstants";
 
 export interface SignaturePreview {
   dataUrl: string;
@@ -15,8 +18,10 @@ const loadImage = (src: string): Promise<HTMLImageElement> =>
     img.src = src;
   });
 
-export const buildSignaturePreview = async (config: SignParameters | null): Promise<SignaturePreview | null> => {
-  if (typeof window === 'undefined' || typeof document === 'undefined') {
+export const buildSignaturePreview = async (
+  config: SignParameters | null,
+): Promise<SignaturePreview | null> => {
+  if (typeof window === "undefined" || typeof document === "undefined") {
     return null;
   }
 
@@ -24,21 +29,21 @@ export const buildSignaturePreview = async (config: SignParameters | null): Prom
     return null;
   }
 
-  if (config.signatureType === 'text') {
+  if (config.signatureType === "text") {
     const text = config.signerName?.trim();
     if (!text) {
       return null;
     }
 
     const fontSize = config.fontSize ?? 16;
-    const fontFamily = config.fontFamily ?? 'Helvetica';
-    const textColor = config.textColor ?? '#000000';
+    const fontFamily = config.fontFamily ?? "Helvetica";
+    const textColor = config.textColor ?? "#000000";
 
     const paddingX = Math.round(fontSize * HORIZONTAL_PADDING_RATIO);
     const paddingY = Math.round(fontSize * VERTICAL_PADDING_RATIO);
 
-    const measureCanvas = document.createElement('canvas');
-    const measureCtx = measureCanvas.getContext('2d');
+    const measureCanvas = document.createElement("canvas");
+    const measureCtx = measureCanvas.getContext("2d");
 
     if (!measureCtx) {
       return null;
@@ -51,22 +56,22 @@ export const buildSignaturePreview = async (config: SignParameters | null): Prom
     const width = Math.max(1, textWidth + paddingX * 2);
     const height = Math.max(1, Math.ceil(fontSize + paddingY * 2));
 
-    const canvas = document.createElement('canvas');
+    const canvas = document.createElement("canvas");
     canvas.width = width;
     canvas.height = height;
 
-    const ctx = canvas.getContext('2d');
+    const ctx = canvas.getContext("2d");
     if (!ctx) {
       return null;
     }
 
     ctx.fillStyle = textColor;
     ctx.font = `${fontSize}px ${fontFamily}`;
-    ctx.textBaseline = 'middle';
-    ctx.textAlign = 'left';
+    ctx.textBaseline = "middle";
+    ctx.textAlign = "left";
     ctx.fillText(text, paddingX, height / 2);
 
-    const dataUrl = canvas.toDataURL('image/png');
+    const dataUrl = canvas.toDataURL("image/png");
     return { dataUrl, width, height };
   }
 
diff --git a/frontend/src/core/utils/storageUtils.ts b/frontend/src/core/utils/storageUtils.ts
index 956e9843dc..f7c668c8e7 100644
--- a/frontend/src/core/utils/storageUtils.ts
+++ b/frontend/src/core/utils/storageUtils.ts
@@ -3,7 +3,7 @@ import { StorageStats } from "@app/services/fileStorage";
 /**
  * Storage operation types for incremental updates
  */
-export type StorageOperation = 'add' | 'remove' | 'clear';
+export type StorageOperation = "add" | "remove" | "clear";
 
 /**
  * Update storage stats incrementally based on operation
@@ -11,35 +11,35 @@ export type StorageOperation = 'add' | 'remove' | 'clear';
 export function updateStorageStatsIncremental(
   currentStats: StorageStats,
   operation: StorageOperation,
-  files: File[] = []
+  files: File[] = [],
 ): StorageStats {
   const filesSizeTotal = files.reduce((total, file) => total + file.size, 0);
-  
+
   switch (operation) {
-    case 'add':
+    case "add":
       return {
         ...currentStats,
         used: currentStats.used + filesSizeTotal,
         available: currentStats.available - filesSizeTotal,
-        fileCount: currentStats.fileCount + files.length
+        fileCount: currentStats.fileCount + files.length,
       };
-      
-    case 'remove':
+
+    case "remove":
       return {
         ...currentStats,
         used: Math.max(0, currentStats.used - filesSizeTotal),
         available: currentStats.available + filesSizeTotal,
-        fileCount: Math.max(0, currentStats.fileCount - files.length)
+        fileCount: Math.max(0, currentStats.fileCount - files.length),
       };
-      
-    case 'clear':
+
+    case "clear":
       return {
         ...currentStats,
         used: 0,
         available: currentStats.quota || currentStats.available,
-        fileCount: 0
+        fileCount: 0,
       };
-      
+
     default:
       return currentStats;
   }
@@ -50,15 +50,15 @@ export function updateStorageStatsIncremental(
  */
 export function checkStorageWarnings(stats: StorageStats): string | null {
   if (!stats.quota || stats.used === 0) return null;
-  
+
   const usagePercent = (stats.used / stats.quota) * 100;
-  
+
   if (usagePercent > 90) {
-    return 'Warning: Storage is nearly full (>90%). Browser may start clearing data.';
+    return "Warning: Storage is nearly full (>90%). Browser may start clearing data.";
   } else if (usagePercent > 80) {
-    return 'Storage is getting full (>80%). Consider removing old files.';
+    return "Storage is getting full (>80%). Consider removing old files.";
   }
-  
+
   return null;
 }
 
@@ -67,4 +67,4 @@ export function checkStorageWarnings(stats: StorageStats): string | null {
  */
 export function getStorageUsagePercent(stats: StorageStats): number {
   return stats.quota ? (stats.used / stats.quota) * 100 : 0;
-}
\ No newline at end of file
+}
diff --git a/frontend/src/core/utils/textDiff.ts b/frontend/src/core/utils/textDiff.ts
index fcf36a7d01..ecbb65e1cb 100644
--- a/frontend/src/core/utils/textDiff.ts
+++ b/frontend/src/core/utils/textDiff.ts
@@ -1,4 +1,4 @@
-// Shared text diff and normalization utilities for compare tool
+// Shared text Comparison and normalization utilities for compare tool
 
 export const shouldConcatWithoutSpace = (word: string) => {
   return /^[.,!?;:)\]}]/.test(word) || word.startsWith("'") || word === "'s";
@@ -9,10 +9,14 @@ export const appendWord = (existing: string, word: string) => {
   if (shouldConcatWithoutSpace(word)) return `${existing}${word}`;
   return `${existing} ${word}`;
 };
-export const tokenize = (text: string): string[] => text.split(/\s+/).filter(Boolean);
+export const tokenize = (text: string): string[] =>
+  text.split(/\s+/).filter(Boolean);
 
-type TokenType = 'unchanged' | 'removed' | 'added';
-export interface LocalToken { type: TokenType; text: string }
+type TokenType = "unchanged" | "removed" | "added";
+export interface LocalToken {
+  type: TokenType;
+  text: string;
+}
 
 const buildLcsMatrix = (a: string[], b: string[]) => {
   const rows = a.length + 1;
@@ -21,7 +25,10 @@ const buildLcsMatrix = (a: string[], b: string[]) => {
   for (let i = 0; i < rows; i += 1) m[i] = new Array(cols).fill(0);
   for (let i = 1; i < rows; i += 1) {
     for (let j = 1; j < cols; j += 1) {
-      m[i][j] = a[i - 1] === b[j - 1] ? m[i - 1][j - 1] + 1 : Math.max(m[i][j - 1], m[i - 1][j]);
+      m[i][j] =
+        a[i - 1] === b[j - 1]
+          ? m[i - 1][j - 1] + 1
+          : Math.max(m[i][j - 1], m[i - 1][j]);
     }
   }
   return m;
@@ -34,17 +41,16 @@ export const diffWords = (a: string[], b: string[]): LocalToken[] => {
   let j = b.length;
   while (i > 0 || j > 0) {
     if (i > 0 && j > 0 && a[i - 1] === b[j - 1]) {
-      tokens.unshift({ type: 'unchanged', text: a[i - 1] });
-      i -= 1; j -= 1;
+      tokens.unshift({ type: "unchanged", text: a[i - 1] });
+      i -= 1;
+      j -= 1;
     } else if (j > 0 && (i === 0 || matrix[i][j] === matrix[i][j - 1])) {
-      tokens.unshift({ type: 'added', text: b[j - 1] });
+      tokens.unshift({ type: "added", text: b[j - 1] });
       j -= 1;
     } else if (i > 0) {
-      tokens.unshift({ type: 'removed', text: a[i - 1] });
+      tokens.unshift({ type: "removed", text: a[i - 1] });
       i -= 1;
     }
   }
   return tokens;
 };
-
-
diff --git a/frontend/src/core/utils/textUtils.ts b/frontend/src/core/utils/textUtils.ts
index e033d505a6..f97d68215b 100644
--- a/frontend/src/core/utils/textUtils.ts
+++ b/frontend/src/core/utils/textUtils.ts
@@ -1,3 +1,20 @@
+/**
+ * Truncates text from the centre, preserving the start and end.
+ * e.g. "very-long-filename.pdf" -> "very-lo...ame.pdf"
+ */
+export function truncateCenter(text: string, maxLength: number = 25): string {
+  if (text.length <= maxLength) return text;
+  const ellipsis = "...";
+  const charsToShow = maxLength - ellipsis.length;
+  const frontChars = Math.ceil(charsToShow / 2);
+  const backChars = Math.floor(charsToShow / 2);
+  return (
+    text.substring(0, frontChars) +
+    ellipsis +
+    text.substring(text.length - backChars)
+  );
+}
+
 /**
  * Filters out emoji characters from a text string
  * @param text - The input text string
@@ -5,5 +22,8 @@
  */
 export const removeEmojis = (text: string): string => {
   // Filter out emoji characters (Unicode ranges for emojis)
-  return text.replace(/[\u{1F600}-\u{1F64F}]|[\u{1F300}-\u{1F5FF}]|[\u{1F680}-\u{1F6FF}]|[\u{1F1E0}-\u{1F1FF}]|[\u{2600}-\u{26FF}]|[\u{2700}-\u{27BF}]/gu, '');
-};
\ No newline at end of file
+  return text.replace(
+    /[\u{1F600}-\u{1F64F}]|[\u{1F300}-\u{1F5FF}]|[\u{1F680}-\u{1F6FF}]|[\u{1F1E0}-\u{1F1FF}]|[\u{2600}-\u{26FF}]|[\u{2700}-\u{27BF}]/gu,
+    "",
+  );
+};
diff --git a/frontend/src/core/utils/thumbnailUtils.ts b/frontend/src/core/utils/thumbnailUtils.ts
index 89d793d632..36ec904521 100644
--- a/frontend/src/core/utils/thumbnailUtils.ts
+++ b/frontend/src/core/utils/thumbnailUtils.ts
@@ -1,4 +1,12 @@
-import { pdfWorkerManager } from '@app/services/pdfWorkerManager';
+import {
+  openRawDocumentSafe,
+  closeRawDocument,
+  getPdfiumModule,
+} from "@app/services/pdfiumService";
+import {
+  renderPdfiumPageDataUrl,
+  readPdfiumPageMetadata,
+} from "@app/utils/pdfiumPageRender";
 
 export interface ThumbnailWithMetadata {
   thumbnail: string; // Always returns a thumbnail (placeholder if needed)
@@ -23,25 +31,24 @@ interface ColorScheme {
  */
 export function calculateScaleFromFileSize(fileSize: number): number {
   const MB = 1024 * 1024;
-  if (fileSize < 10 * MB) return 1.0;   // Full quality for small files
-  if (fileSize < 50 * MB) return 0.8;   // High quality for common file sizes
-  if (fileSize < 200 * MB) return 0.6;  // Good quality for typical large files
-  if (fileSize < 500 * MB) return 0.4;  // Readable quality for large but manageable files
-  return 0.3;  // Still usable quality, not tiny
+  if (fileSize < 10 * MB) return 1.0; // Full quality for small files
+  if (fileSize < 50 * MB) return 0.8; // High quality for common file sizes
+  if (fileSize < 200 * MB) return 0.6; // Good quality for typical large files
+  if (fileSize < 500 * MB) return 0.4; // Readable quality for large but manageable files
+  return 0.3; // Still usable quality, not tiny
 }
 
-
 /**
  * Generate encrypted PDF thumbnail with lock icon
  */
 function generateEncryptedPDFThumbnail(file: File): string {
-  const canvas = document.createElement('canvas');
+  const canvas = document.createElement("canvas");
   canvas.width = 120;
   canvas.height = 150;
-  const ctx = canvas.getContext('2d')!;
+  const ctx = canvas.getContext("2d")!;
 
   // Use PDF color scheme but with encrypted styling
-  const colorScheme = getFileTypeColorScheme('PDF');
+  const colorScheme = getFileTypeColorScheme("PDF");
 
   // Create gradient background
   const gradient = ctx.createLinearGradient(0, 0, 0, canvas.height);
@@ -64,16 +71,18 @@ function generateEncryptedPDFThumbnail(file: File): string {
   drawLargeLockIcon(ctx, canvas.width / 2, canvas.height / 2 - 10, colorScheme);
 
   // "PDF" text under the lock
-  ctx.font = 'bold 14px -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif';
+  ctx.font =
+    'bold 14px -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif';
   ctx.fillStyle = colorScheme.icon;
-  ctx.textAlign = 'center';
-  ctx.fillText('PDF', canvas.width / 2, canvas.height / 2 + 35);
+  ctx.textAlign = "center";
+  ctx.fillText("PDF", canvas.width / 2, canvas.height / 2 + 35);
 
   // File size with subtle styling
   const sizeText = formatFileSize(file.size);
-  ctx.font = '11px -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif';
+  ctx.font =
+    '11px -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif';
   ctx.fillStyle = colorScheme.textSecondary;
-  ctx.textAlign = 'center';
+  ctx.textAlign = "center";
   ctx.fillText(sizeText, canvas.width / 2, canvas.height - 15);
 
   return canvas.toDataURL();
@@ -83,13 +92,13 @@ function generateEncryptedPDFThumbnail(file: File): string {
  * Generate modern placeholder thumbnail with file extension
  */
 function generatePlaceholderThumbnail(file: File): string {
-  const canvas = document.createElement('canvas');
+  const canvas = document.createElement("canvas");
   canvas.width = 120;
   canvas.height = 150;
-  const ctx = canvas.getContext('2d')!;
+  const ctx = canvas.getContext("2d")!;
 
   // Get file extension for color theming
-  const extension = file.name.split('.').pop()?.toUpperCase() || 'FILE';
+  const extension = file.name.split(".").pop()?.toUpperCase() || "FILE";
   const colorScheme = getFileTypeColorScheme(extension);
 
   // Create gradient background
@@ -111,13 +120,20 @@ function generatePlaceholderThumbnail(file: File): string {
   drawModernDocumentIcon(ctx, canvas.width / 2, 45, colorScheme.icon);
 
   // Extension badge
-  drawExtensionBadge(ctx, canvas.width / 2, canvas.height / 2 + 15, extension, colorScheme);
+  drawExtensionBadge(
+    ctx,
+    canvas.width / 2,
+    canvas.height / 2 + 15,
+    extension,
+    colorScheme,
+  );
 
   // File size with subtle styling
   const sizeText = formatFileSize(file.size);
-  ctx.font = '11px -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif';
+  ctx.font =
+    '11px -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif';
   ctx.fillStyle = colorScheme.textSecondary;
-  ctx.textAlign = 'center';
+  ctx.textAlign = "center";
   ctx.fillText(sizeText, canvas.width / 2, canvas.height - 15);
 
   return canvas.toDataURL();
@@ -129,60 +145,299 @@ function generatePlaceholderThumbnail(file: File): string {
 function getFileTypeColorScheme(extension: string): ColorScheme {
   const schemes: Record<string, ColorScheme> = {
     // Documents
-    'PDF': { bgTop: '#FF6B6B20', bgBottom: '#FF6B6B10', border: '#FF6B6B40', icon: '#FF6B6B', badge: '#FF6B6B', textPrimary: '#FFFFFF', textSecondary: '#666666' },
-    'DOC': { bgTop: '#4ECDC420', bgBottom: '#4ECDC410', border: '#4ECDC440', icon: '#4ECDC4', badge: '#4ECDC4', textPrimary: '#FFFFFF', textSecondary: '#666666' },
-    'DOCX': { bgTop: '#4ECDC420', bgBottom: '#4ECDC410', border: '#4ECDC440', icon: '#4ECDC4', badge: '#4ECDC4', textPrimary: '#FFFFFF', textSecondary: '#666666' },
-    'ODT': { bgTop: '#4ECDC420', bgBottom: '#4ECDC410', border: '#4ECDC440', icon: '#4ECDC4', badge: '#4ECDC4', textPrimary: '#FFFFFF', textSecondary: '#666666' },
-    'TXT': { bgTop: '#95A5A620', bgBottom: '#95A5A610', border: '#95A5A640', icon: '#95A5A6', badge: '#95A5A6', textPrimary: '#FFFFFF', textSecondary: '#666666' },
-    'RTF': { bgTop: '#95A5A620', bgBottom: '#95A5A610', border: '#95A5A640', icon: '#95A5A6', badge: '#95A5A6', textPrimary: '#FFFFFF', textSecondary: '#666666' },
+    PDF: {
+      bgTop: "#FF6B6B20",
+      bgBottom: "#FF6B6B10",
+      border: "#FF6B6B40",
+      icon: "#FF6B6B",
+      badge: "#FF6B6B",
+      textPrimary: "#FFFFFF",
+      textSecondary: "#666666",
+    },
+    DOC: {
+      bgTop: "#4ECDC420",
+      bgBottom: "#4ECDC410",
+      border: "#4ECDC440",
+      icon: "#4ECDC4",
+      badge: "#4ECDC4",
+      textPrimary: "#FFFFFF",
+      textSecondary: "#666666",
+    },
+    DOCX: {
+      bgTop: "#4ECDC420",
+      bgBottom: "#4ECDC410",
+      border: "#4ECDC440",
+      icon: "#4ECDC4",
+      badge: "#4ECDC4",
+      textPrimary: "#FFFFFF",
+      textSecondary: "#666666",
+    },
+    ODT: {
+      bgTop: "#4ECDC420",
+      bgBottom: "#4ECDC410",
+      border: "#4ECDC440",
+      icon: "#4ECDC4",
+      badge: "#4ECDC4",
+      textPrimary: "#FFFFFF",
+      textSecondary: "#666666",
+    },
+    TXT: {
+      bgTop: "#95A5A620",
+      bgBottom: "#95A5A610",
+      border: "#95A5A640",
+      icon: "#95A5A6",
+      badge: "#95A5A6",
+      textPrimary: "#FFFFFF",
+      textSecondary: "#666666",
+    },
+    RTF: {
+      bgTop: "#95A5A620",
+      bgBottom: "#95A5A610",
+      border: "#95A5A640",
+      icon: "#95A5A6",
+      badge: "#95A5A6",
+      textPrimary: "#FFFFFF",
+      textSecondary: "#666666",
+    },
 
     // Spreadsheets
-    'XLS': { bgTop: '#2ECC7120', bgBottom: '#2ECC7110', border: '#2ECC7140', icon: '#2ECC71', badge: '#2ECC71', textPrimary: '#FFFFFF', textSecondary: '#666666' },
-    'XLSX': { bgTop: '#2ECC7120', bgBottom: '#2ECC7110', border: '#2ECC7140', icon: '#2ECC71', badge: '#2ECC71', textPrimary: '#FFFFFF', textSecondary: '#666666' },
-    'ODS': { bgTop: '#2ECC7120', bgBottom: '#2ECC7110', border: '#2ECC7140', icon: '#2ECC71', badge: '#2ECC71', textPrimary: '#FFFFFF', textSecondary: '#666666' },
-    'CSV': { bgTop: '#2ECC7120', bgBottom: '#2ECC7110', border: '#2ECC7140', icon: '#2ECC71', badge: '#2ECC71', textPrimary: '#FFFFFF', textSecondary: '#666666' },
+    XLS: {
+      bgTop: "#2ECC7120",
+      bgBottom: "#2ECC7110",
+      border: "#2ECC7140",
+      icon: "#2ECC71",
+      badge: "#2ECC71",
+      textPrimary: "#FFFFFF",
+      textSecondary: "#666666",
+    },
+    XLSX: {
+      bgTop: "#2ECC7120",
+      bgBottom: "#2ECC7110",
+      border: "#2ECC7140",
+      icon: "#2ECC71",
+      badge: "#2ECC71",
+      textPrimary: "#FFFFFF",
+      textSecondary: "#666666",
+    },
+    ODS: {
+      bgTop: "#2ECC7120",
+      bgBottom: "#2ECC7110",
+      border: "#2ECC7140",
+      icon: "#2ECC71",
+      badge: "#2ECC71",
+      textPrimary: "#FFFFFF",
+      textSecondary: "#666666",
+    },
+    CSV: {
+      bgTop: "#2ECC7120",
+      bgBottom: "#2ECC7110",
+      border: "#2ECC7140",
+      icon: "#2ECC71",
+      badge: "#2ECC71",
+      textPrimary: "#FFFFFF",
+      textSecondary: "#666666",
+    },
 
     // Presentations
-    'PPT': { bgTop: '#E67E2220', bgBottom: '#E67E2210', border: '#E67E2240', icon: '#E67E22', badge: '#E67E22', textPrimary: '#FFFFFF', textSecondary: '#666666' },
-    'PPTX': { bgTop: '#E67E2220', bgBottom: '#E67E2210', border: '#E67E2240', icon: '#E67E22', badge: '#E67E22', textPrimary: '#FFFFFF', textSecondary: '#666666' },
-    'ODP': { bgTop: '#E67E2220', bgBottom: '#E67E2210', border: '#E67E2240', icon: '#E67E22', badge: '#E67E22', textPrimary: '#FFFFFF', textSecondary: '#666666' },
+    PPT: {
+      bgTop: "#E67E2220",
+      bgBottom: "#E67E2210",
+      border: "#E67E2240",
+      icon: "#E67E22",
+      badge: "#E67E22",
+      textPrimary: "#FFFFFF",
+      textSecondary: "#666666",
+    },
+    PPTX: {
+      bgTop: "#E67E2220",
+      bgBottom: "#E67E2210",
+      border: "#E67E2240",
+      icon: "#E67E22",
+      badge: "#E67E22",
+      textPrimary: "#FFFFFF",
+      textSecondary: "#666666",
+    },
+    ODP: {
+      bgTop: "#E67E2220",
+      bgBottom: "#E67E2210",
+      border: "#E67E2240",
+      icon: "#E67E22",
+      badge: "#E67E22",
+      textPrimary: "#FFFFFF",
+      textSecondary: "#666666",
+    },
 
     // Images
-    'JPG': { bgTop: '#FF9F4320', bgBottom: '#FF9F4310', border: '#FF9F4340', icon: '#FF9F43', badge: '#FF9F43', textPrimary: '#FFFFFF', textSecondary: '#666666' },
-    'JPEG': { bgTop: '#FF9F4320', bgBottom: '#FF9F4310', border: '#FF9F4340', icon: '#FF9F43', badge: '#FF9F43', textPrimary: '#FFFFFF', textSecondary: '#666666' },
-    'PNG': { bgTop: '#FF9F4320', bgBottom: '#FF9F4310', border: '#FF9F4340', icon: '#FF9F43', badge: '#FF9F43', textPrimary: '#FFFFFF', textSecondary: '#666666' },
-    'GIF': { bgTop: '#FF9F4320', bgBottom: '#FF9F4310', border: '#FF9F4340', icon: '#FF9F43', badge: '#FF9F43', textPrimary: '#FFFFFF', textSecondary: '#666666' },
-    'BMP': { bgTop: '#FF9F4320', bgBottom: '#FF9F4310', border: '#FF9F4340', icon: '#FF9F43', badge: '#FF9F43', textPrimary: '#FFFFFF', textSecondary: '#666666' },
-    'TIFF': { bgTop: '#FF9F4320', bgBottom: '#FF9F4310', border: '#FF9F4340', icon: '#FF9F43', badge: '#FF9F43', textPrimary: '#FFFFFF', textSecondary: '#666666' },
-    'WEBP': { bgTop: '#FF9F4320', bgBottom: '#FF9F4310', border: '#FF9F4340', icon: '#FF9F43', badge: '#FF9F43', textPrimary: '#FFFFFF', textSecondary: '#666666' },
-    'SVG': { bgTop: '#FF9F4320', bgBottom: '#FF9F4310', border: '#FF9F4340', icon: '#FF9F43', badge: '#FF9F43', textPrimary: '#FFFFFF', textSecondary: '#666666' },
+    JPG: {
+      bgTop: "#FF9F4320",
+      bgBottom: "#FF9F4310",
+      border: "#FF9F4340",
+      icon: "#FF9F43",
+      badge: "#FF9F43",
+      textPrimary: "#FFFFFF",
+      textSecondary: "#666666",
+    },
+    JPEG: {
+      bgTop: "#FF9F4320",
+      bgBottom: "#FF9F4310",
+      border: "#FF9F4340",
+      icon: "#FF9F43",
+      badge: "#FF9F43",
+      textPrimary: "#FFFFFF",
+      textSecondary: "#666666",
+    },
+    PNG: {
+      bgTop: "#FF9F4320",
+      bgBottom: "#FF9F4310",
+      border: "#FF9F4340",
+      icon: "#FF9F43",
+      badge: "#FF9F43",
+      textPrimary: "#FFFFFF",
+      textSecondary: "#666666",
+    },
+    GIF: {
+      bgTop: "#FF9F4320",
+      bgBottom: "#FF9F4310",
+      border: "#FF9F4340",
+      icon: "#FF9F43",
+      badge: "#FF9F43",
+      textPrimary: "#FFFFFF",
+      textSecondary: "#666666",
+    },
+    BMP: {
+      bgTop: "#FF9F4320",
+      bgBottom: "#FF9F4310",
+      border: "#FF9F4340",
+      icon: "#FF9F43",
+      badge: "#FF9F43",
+      textPrimary: "#FFFFFF",
+      textSecondary: "#666666",
+    },
+    TIFF: {
+      bgTop: "#FF9F4320",
+      bgBottom: "#FF9F4310",
+      border: "#FF9F4340",
+      icon: "#FF9F43",
+      badge: "#FF9F43",
+      textPrimary: "#FFFFFF",
+      textSecondary: "#666666",
+    },
+    WEBP: {
+      bgTop: "#FF9F4320",
+      bgBottom: "#FF9F4310",
+      border: "#FF9F4340",
+      icon: "#FF9F43",
+      badge: "#FF9F43",
+      textPrimary: "#FFFFFF",
+      textSecondary: "#666666",
+    },
+    SVG: {
+      bgTop: "#FF9F4320",
+      bgBottom: "#FF9F4310",
+      border: "#FF9F4340",
+      icon: "#FF9F43",
+      badge: "#FF9F43",
+      textPrimary: "#FFFFFF",
+      textSecondary: "#666666",
+    },
 
     // Web
-    'HTML': { bgTop: '#FD79A820', bgBottom: '#FD79A810', border: '#FD79A840', icon: '#FD79A8', badge: '#FD79A8', textPrimary: '#FFFFFF', textSecondary: '#666666' },
-    'XML': { bgTop: '#FD79A820', bgBottom: '#FD79A810', border: '#FD79A840', icon: '#FD79A8', badge: '#FD79A8', textPrimary: '#FFFFFF', textSecondary: '#666666' },
+    HTML: {
+      bgTop: "#FD79A820",
+      bgBottom: "#FD79A810",
+      border: "#FD79A840",
+      icon: "#FD79A8",
+      badge: "#FD79A8",
+      textPrimary: "#FFFFFF",
+      textSecondary: "#666666",
+    },
+    XML: {
+      bgTop: "#FD79A820",
+      bgBottom: "#FD79A810",
+      border: "#FD79A840",
+      icon: "#FD79A8",
+      badge: "#FD79A8",
+      textPrimary: "#FFFFFF",
+      textSecondary: "#666666",
+    },
 
     // Text/Markup
-    'MD': { bgTop: '#6C5CE720', bgBottom: '#6C5CE710', border: '#6C5CE740', icon: '#6C5CE7', badge: '#6C5CE7', textPrimary: '#FFFFFF', textSecondary: '#666666' },
+    MD: {
+      bgTop: "#6C5CE720",
+      bgBottom: "#6C5CE710",
+      border: "#6C5CE740",
+      icon: "#6C5CE7",
+      badge: "#6C5CE7",
+      textPrimary: "#FFFFFF",
+      textSecondary: "#666666",
+    },
 
     // Email
-    'EML': { bgTop: '#A29BFE20', bgBottom: '#A29BFE10', border: '#A29BFE40', icon: '#A29BFE', badge: '#A29BFE', textPrimary: '#FFFFFF', textSecondary: '#666666' },
+    EML: {
+      bgTop: "#A29BFE20",
+      bgBottom: "#A29BFE10",
+      border: "#A29BFE40",
+      icon: "#A29BFE",
+      badge: "#A29BFE",
+      textPrimary: "#FFFFFF",
+      textSecondary: "#666666",
+    },
 
     // Archives
-    'ZIP': { bgTop: '#9B59B620', bgBottom: '#9B59B610', border: '#9B59B640', icon: '#9B59B6', badge: '#9B59B6', textPrimary: '#FFFFFF', textSecondary: '#666666' },
-    'RAR': { bgTop: '#9B59B620', bgBottom: '#9B59B610', border: '#9B59B640', icon: '#9B59B6', badge: '#9B59B6', textPrimary: '#FFFFFF', textSecondary: '#666666' },
-    '7Z': { bgTop: '#9B59B620', bgBottom: '#9B59B610', border: '#9B59B640', icon: '#9B59B6', badge: '#9B59B6', textPrimary: '#FFFFFF', textSecondary: '#666666' },
+    ZIP: {
+      bgTop: "#9B59B620",
+      bgBottom: "#9B59B610",
+      border: "#9B59B640",
+      icon: "#9B59B6",
+      badge: "#9B59B6",
+      textPrimary: "#FFFFFF",
+      textSecondary: "#666666",
+    },
+    RAR: {
+      bgTop: "#9B59B620",
+      bgBottom: "#9B59B610",
+      border: "#9B59B640",
+      icon: "#9B59B6",
+      badge: "#9B59B6",
+      textPrimary: "#FFFFFF",
+      textSecondary: "#666666",
+    },
+    "7Z": {
+      bgTop: "#9B59B620",
+      bgBottom: "#9B59B610",
+      border: "#9B59B640",
+      icon: "#9B59B6",
+      badge: "#9B59B6",
+      textPrimary: "#FFFFFF",
+      textSecondary: "#666666",
+    },
 
     // Default
-    'DEFAULT': { bgTop: '#74B9FF20', bgBottom: '#74B9FF10', border: '#74B9FF40', icon: '#74B9FF', badge: '#74B9FF', textPrimary: '#FFFFFF', textSecondary: '#666666' }
+    DEFAULT: {
+      bgTop: "#74B9FF20",
+      bgBottom: "#74B9FF10",
+      border: "#74B9FF40",
+      icon: "#74B9FF",
+      badge: "#74B9FF",
+      textPrimary: "#FFFFFF",
+      textSecondary: "#666666",
+    },
   };
 
-  return schemes[extension] || schemes['DEFAULT'];
+  return schemes[extension] || schemes["DEFAULT"];
 }
 
 /**
  * Draw rounded rectangle
  */
-function drawRoundedRect(ctx: CanvasRenderingContext2D, x: number, y: number, width: number, height: number, radius: number) {
+function drawRoundedRect(
+  ctx: CanvasRenderingContext2D,
+  x: number,
+  y: number,
+  width: number,
+  height: number,
+  radius: number,
+) {
   ctx.beginPath();
   ctx.moveTo(x + radius, y);
   ctx.lineTo(x + width - radius, y);
@@ -199,30 +454,47 @@ function drawRoundedRect(ctx: CanvasRenderingContext2D, x: number, y: number, wi
 /**
  * Draw modern document icon
  */
-function drawModernDocumentIcon(ctx: CanvasRenderingContext2D, centerX: number, centerY: number, color: string) {
+function drawModernDocumentIcon(
+  ctx: CanvasRenderingContext2D,
+  centerX: number,
+  centerY: number,
+  color: string,
+) {
   const size = 24;
   ctx.fillStyle = color;
   ctx.strokeStyle = color;
   ctx.lineWidth = 2;
 
   // Document body
-  drawRoundedRect(ctx, centerX - size/2, centerY - size/2, size, size * 1.2, 3);
+  drawRoundedRect(
+    ctx,
+    centerX - size / 2,
+    centerY - size / 2,
+    size,
+    size * 1.2,
+    3,
+  );
   ctx.fill();
 
   // Folded corner
   ctx.beginPath();
-  ctx.moveTo(centerX + size/2 - 6, centerY - size/2);
-  ctx.lineTo(centerX + size/2, centerY - size/2 + 6);
-  ctx.lineTo(centerX + size/2 - 6, centerY - size/2 + 6);
+  ctx.moveTo(centerX + size / 2 - 6, centerY - size / 2);
+  ctx.lineTo(centerX + size / 2, centerY - size / 2 + 6);
+  ctx.lineTo(centerX + size / 2 - 6, centerY - size / 2 + 6);
   ctx.closePath();
-  ctx.fillStyle = '#FFFFFF40';
+  ctx.fillStyle = "#FFFFFF40";
   ctx.fill();
 }
 
 /**
  * Draw large lock icon for encrypted PDFs
  */
-function drawLargeLockIcon(ctx: CanvasRenderingContext2D, centerX: number, centerY: number, colorScheme: ColorScheme) {
+function drawLargeLockIcon(
+  ctx: CanvasRenderingContext2D,
+  centerX: number,
+  centerY: number,
+  colorScheme: ColorScheme,
+) {
   const size = 48;
   ctx.fillStyle = colorScheme.icon;
   ctx.strokeStyle = colorScheme.icon;
@@ -255,41 +527,120 @@ function drawLargeLockIcon(ctx: CanvasRenderingContext2D, centerX: number, cente
   ctx.fillRect(keyholeX - 2, keyholeY, 4, 8);
 }
 
-/**
- * Generate standard PDF thumbnail by rendering first page
- */
-async function generateStandardPDFThumbnail(pdf: any, scale: number): Promise<string> {
-  const page = await pdf.getPage(1);
-  const viewport = page.getViewport({ scale });
-  const canvas = document.createElement("canvas");
-  canvas.width = viewport.width;
-  canvas.height = viewport.height;
-  const context = canvas.getContext("2d");
+/** PDFium error code 4 = password required (encrypted PDF). */
+const PDFIUM_ERR_PASSWORD = 4;
 
-  if (!context) {
-    throw new Error('Could not get canvas context');
+interface PdfiumRenderResult {
+  thumbnail: string;
+  pageCount: number;
+  pageRotations: number[];
+  pageDimensions: Array<{ width: number; height: number }>;
+  /** Set when the document is password-protected — caller substitutes the
+   * encrypted placeholder. Thumbnail/metadata fields are empty in that case. */
+  isEncrypted?: boolean;
+}
+
+/**
+ * Open a PDF with PDFium, render page 1 to a data URL, and optionally
+ * collect rotation + dimensions for every page. Returns `isEncrypted: true`
+ * (without rendering) when the document is password-protected.
+ *
+ * @param applyRotation When true, bakes the page's own rotation into the
+ *   bitmap (static display). When false, renders upright so callers can
+ *   apply rotation via CSS (PageEditor).
+ * @param collectAllPagesMetadata When true, reads per-page rotation and
+ *   dimensions for all pages. When false (very large files), only the
+ *   first page's metadata is populated.
+ */
+async function renderPdfThumbnailPdfium(
+  data: ArrayBuffer,
+  scale: number,
+  applyRotation: boolean,
+  collectAllPagesMetadata: boolean,
+): Promise<PdfiumRenderResult> {
+  const m = await getPdfiumModule();
+  let docPtr: number;
+  try {
+    docPtr = await openRawDocumentSafe(data);
+  } catch (error) {
+    if (
+      error instanceof Error &&
+      new RegExp(`error ${PDFIUM_ERR_PASSWORD}`).test(error.message)
+    ) {
+      return {
+        thumbnail: "",
+        pageCount: 1,
+        pageRotations: [],
+        pageDimensions: [],
+        isEncrypted: true,
+      };
+    }
+    throw error;
   }
 
-  await page.render({ canvasContext: context, viewport }).promise;
-  return canvas.toDataURL();
+  try {
+    const pageCount = m.FPDF_GetPageCount(docPtr);
+    const thumbnail = await renderPdfiumPageDataUrl(docPtr, 0, scale, {
+      applyRotation,
+    });
+    if (!thumbnail) throw new Error("PDFium: failed to render page 0");
+
+    // Page 0 metadata is already available via the render, but read it
+    // directly for consistency with the later per-page loop.
+    const firstMeta = await readPdfiumPageMetadata(docPtr, 0);
+    const pageRotations: number[] = [firstMeta?.rotation ?? 0];
+    const pageDimensions: Array<{ width: number; height: number }> = [
+      {
+        width: firstMeta?.width ?? 0,
+        height: firstMeta?.height ?? 0,
+      },
+    ];
+
+    if (collectAllPagesMetadata) {
+      for (let i = 1; i < pageCount; i++) {
+        const meta = await readPdfiumPageMetadata(docPtr, i);
+        if (!meta) continue;
+        pageRotations[i] = meta.rotation;
+        pageDimensions[i] = { width: meta.width, height: meta.height };
+      }
+    }
+
+    return { thumbnail, pageCount, pageRotations, pageDimensions };
+  } finally {
+    await closeRawDocument(docPtr);
+  }
 }
 
 /**
  * Draw extension badge
  */
-function drawExtensionBadge(ctx: CanvasRenderingContext2D, centerX: number, centerY: number, extension: string, colorScheme: ColorScheme) {
+function drawExtensionBadge(
+  ctx: CanvasRenderingContext2D,
+  centerX: number,
+  centerY: number,
+  extension: string,
+  colorScheme: ColorScheme,
+) {
   const badgeWidth = Math.max(extension.length * 8 + 16, 40);
   const badgeHeight = 22;
 
   // Badge background
-  drawRoundedRect(ctx, centerX - badgeWidth/2, centerY - badgeHeight/2, badgeWidth, badgeHeight, 11);
+  drawRoundedRect(
+    ctx,
+    centerX - badgeWidth / 2,
+    centerY - badgeHeight / 2,
+    badgeWidth,
+    badgeHeight,
+    11,
+  );
   ctx.fillStyle = colorScheme.badge;
   ctx.fill();
 
   // Badge text
-  ctx.font = 'bold 11px -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif';
+  ctx.font =
+    'bold 11px -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif';
   ctx.fillStyle = colorScheme.textPrimary;
-  ctx.textAlign = 'center';
+  ctx.textAlign = "center";
   ctx.fillText(extension, centerX, centerY + 4);
 }
 
@@ -297,34 +648,28 @@ function drawExtensionBadge(ctx: CanvasRenderingContext2D, centerX: number, cent
  * Format file size for display
  */
 function formatFileSize(bytes: number): string {
-  if (bytes === 0) return '0 B';
+  if (bytes === 0) return "0 B";
   const k = 1024;
-  const sizes = ['B', 'KB', 'MB', 'GB'];
+  const sizes = ["B", "KB", "MB", "GB"];
   const i = Math.floor(Math.log(bytes) / Math.log(k));
-  return parseFloat((bytes / Math.pow(k, i)).toFixed(1)) + ' ' + sizes[i];
+  return parseFloat((bytes / Math.pow(k, i)).toFixed(1)) + " " + sizes[i];
 }
 
-async function generatePDFThumbnail(arrayBuffer: ArrayBuffer, file: File, scale: number): Promise<string> {
-  try {
-    const pdf = await pdfWorkerManager.createDocument(arrayBuffer, {
-      disableAutoFetch: true,
-      disableStream: true
-    });
-
-    const thumbnail = await generateStandardPDFThumbnail(pdf, scale);
-
-    // Immediately clean up memory after thumbnail generation using worker manager
-    pdfWorkerManager.destroyDocument(pdf);
-    return thumbnail;
-  } catch (error) {
-    if (error instanceof Error) {
-      // Check if PDF is encrypted
-      if (error.name === "PasswordException") {
-        return generateEncryptedPDFThumbnail(file);
-      }
-    }
-    throw error; // Not an encryption issue, re-throw
+async function generatePDFThumbnail(
+  arrayBuffer: ArrayBuffer,
+  file: File,
+  scale: number,
+): Promise<string> {
+  const result = await renderPdfThumbnailPdfium(
+    arrayBuffer,
+    scale,
+    true,
+    false,
+  );
+  if (result.isEncrypted) {
+    return generateEncryptedPDFThumbnail(file);
   }
+  return result.thumbnail;
 }
 
 /**
@@ -337,7 +682,7 @@ export async function generateThumbnailForFile(file: File): Promise<string> {
   }
 
   // Handle image files - convert to data URL for persistence
-  if (file.type.startsWith('image/')) {
+  if (file.type.startsWith("image/")) {
     return new Promise((resolve, reject) => {
       const reader = new FileReader();
       reader.onload = () => resolve(reader.result as string);
@@ -347,7 +692,7 @@ export async function generateThumbnailForFile(file: File): Promise<string> {
   }
 
   // Handle PDF files
-  if (file.type.startsWith('application/pdf')) {
+  if (file.type.startsWith("application/pdf")) {
     const scale = calculateScaleFromFileSize(file.size);
 
     // Only read first 2MB for thumbnail generation to save memory
@@ -357,20 +702,20 @@ export async function generateThumbnailForFile(file: File): Promise<string> {
 
     try {
       return await generatePDFThumbnail(arrayBuffer, file, scale);
-    } catch (error) {
-      if (error instanceof Error && error.name === 'InvalidPDFException') {
-        console.warn(`PDF structure issue for ${file.name} - trying with full file`);
-        try {
-          // Try with full file instead of chunk
-          const fullArrayBuffer = await file.arrayBuffer();
-          return await generatePDFThumbnail(fullArrayBuffer, file, scale);
-        } catch {
-          console.warn(`Full file PDF processing also failed for ${file.name} - using placeholder`);
-          return generatePlaceholderThumbnail(file);
-        }
+    } catch {
+      // PDFium needs the xref table at the end of the file, so the 2MB
+      // chunk can fail to open for PDFs larger than that. Retry with the
+      // full buffer before falling back to a placeholder.
+      try {
+        const fullArrayBuffer = await file.arrayBuffer();
+        return await generatePDFThumbnail(fullArrayBuffer, file, scale);
+      } catch (error) {
+        console.warn(
+          `PDF processing failed for ${file.name} - using placeholder:`,
+          error,
+        );
+        return generatePlaceholderThumbnail(file);
       }
-      console.warn(`PDF processing failed for ${file.name} - using placeholder:`, error);
-      return generatePlaceholderThumbnail(file);
     }
   }
 
@@ -383,9 +728,12 @@ export async function generateThumbnailForFile(file: File): Promise<string> {
  * @param applyRotation - If true, render thumbnail with PDF rotation applied (for static display).
  *                        If false, render without rotation (for CSS-based rotation in PageEditor)
  */
-export async function generateThumbnailWithMetadata(file: File, applyRotation: boolean = true): Promise<ThumbnailWithMetadata> {
+export async function generateThumbnailWithMetadata(
+  file: File,
+  applyRotation: boolean = true,
+): Promise<ThumbnailWithMetadata> {
   // Non-PDF files have no page count
-  if (!file.type.startsWith('application/pdf')) {
+  if (!file.type.startsWith("application/pdf")) {
     const thumbnail = await generateThumbnailForFile(file);
     return { thumbnail, pageCount: 0 };
   }
@@ -395,73 +743,28 @@ export async function generateThumbnailWithMetadata(file: File, applyRotation: b
 
   try {
     const arrayBuffer = await file.arrayBuffer();
-    const pdf = await pdfWorkerManager.createDocument(arrayBuffer);
+    const result = await renderPdfThumbnailPdfium(
+      arrayBuffer,
+      scale,
+      applyRotation,
+      !isVeryLarge,
+    );
 
-    const pageCount = pdf.numPages;
-    const page = await pdf.getPage(1);
-    const pageDimensions: Array<{ width: number; height: number }> = [];
-
-    // If applyRotation is false, render without rotation (for CSS-based rotation)
-    // If applyRotation is true, let PDF.js apply rotation (for static display)
-    const viewport = applyRotation
-      ? page.getViewport({ scale })
-      : page.getViewport({ scale, rotation: 0 });
-    const baseViewport = page.getViewport({ scale: 1, rotation: 0 });
-    pageDimensions[0] = {
-      width: baseViewport.width,
-      height: baseViewport.height
-    };
-
-    const canvas = document.createElement("canvas");
-    canvas.width = viewport.width;
-    canvas.height = viewport.height;
-    const context = canvas.getContext("2d");
-
-    if (!context) {
-      pdfWorkerManager.destroyDocument(pdf);
-      throw new Error('Could not get canvas context');
-    }
-
-    await page.render({ canvasContext: context, viewport, canvas }).promise;
-    const thumbnail = canvas.toDataURL();
-
-    // For very large files, skip reading rotation/dimensions for all pages (just use first page data)
-    if (isVeryLarge) {
-      const rotation = page.rotate || 0;
-      pdfWorkerManager.destroyDocument(pdf);
+    if (result.isEncrypted) {
       return {
-        thumbnail,
-        pageCount,
-        pageRotations: [rotation],
-        pageDimensions: [pageDimensions[0]]
+        thumbnail: generateEncryptedPDFThumbnail(file),
+        pageCount: 1,
+        isEncrypted: true,
       };
     }
 
-    // Read rotation for all pages
-    const pageRotations: number[] = [];
-    for (let i = 1; i <= pageCount; i++) {
-      const p = await pdf.getPage(i);
-      const rotation = p.rotate || 0;
-      pageRotations.push(rotation);
-      if (!pageDimensions[i - 1]) {
-        const pageViewport = p.getViewport({ scale: 1, rotation: 0 });
-        pageDimensions[i - 1] = {
-          width: pageViewport.width,
-          height: pageViewport.height
-        };
-      }
-    }
-
-    pdfWorkerManager.destroyDocument(pdf);
-    return { thumbnail, pageCount, pageRotations, pageDimensions };
-
-  } catch (error) {
-    if (error instanceof Error && error.name === "PasswordException") {
-      // Handle encrypted PDFs
-      const thumbnail = generateEncryptedPDFThumbnail(file);
-      return { thumbnail, pageCount: 1, isEncrypted: true };
-    }
-
+    return {
+      thumbnail: result.thumbnail,
+      pageCount: result.pageCount,
+      pageRotations: result.pageRotations,
+      pageDimensions: result.pageDimensions,
+    };
+  } catch {
     const thumbnail = generatePlaceholderThumbnail(file);
     return { thumbnail, pageCount: 1 };
   }
diff --git a/frontend/src/core/utils/toolErrorHandler.ts b/frontend/src/core/utils/toolErrorHandler.ts
index 270b92017d..d023fdc788 100644
--- a/frontend/src/core/utils/toolErrorHandler.ts
+++ b/frontend/src/core/utils/toolErrorHandler.ts
@@ -2,19 +2,19 @@
  * Standardized error handling utilities for tool operations
  */
 
-import { normalizeAxiosErrorData } from '@app/services/errorUtils';
+import { normalizeAxiosErrorData } from "@app/services/errorUtils";
 
 /**
  * Default error extractor that follows the standard pattern
  */
 export const extractErrorMessage = (error: any): string => {
-  if (error.response?.data && typeof error.response.data === 'string') {
+  if (error.response?.data && typeof error.response.data === "string") {
     return error.response.data;
   }
   if (error.message) {
     return error.message;
   }
-  return 'There was an error processing your request.';
+  return "There was an error processing your request.";
 };
 
 /**
@@ -24,7 +24,7 @@ export const extractErrorMessage = (error: any): string => {
  */
 export const createStandardErrorHandler = (fallbackMessage: string) => {
   return (error: any): string => {
-    if (error.response?.data && typeof error.response.data === 'string') {
+    if (error.response?.data && typeof error.response.data === "string") {
       return error.response.data;
     }
     if (error.message) {
@@ -40,33 +40,49 @@ export const createStandardErrorHandler = (fallbackMessage: string) => {
  */
 export const handle422Error = async (
   error: any,
-  markFileError: (fileId: string) => void
+  markFileError: (fileId: string) => void,
 ): Promise<boolean> => {
   const status = error?.response?.status;
-  if (typeof status !== 'number' || status !== 422) return false;
+  if (typeof status !== "number" || status !== 422) return false;
 
   const payload = error?.response?.data;
   let parsed: unknown = payload;
 
-  if (typeof payload === 'string') {
-    try { parsed = JSON.parse(payload); } catch { parsed = payload; }
-  } else if (payload && typeof (payload as Blob).text === 'function') {
+  if (typeof payload === "string") {
+    try {
+      parsed = JSON.parse(payload);
+    } catch {
+      parsed = payload;
+    }
+  } else if (payload && typeof (payload as Blob).text === "function") {
     const text = await (payload as Blob).text();
-    try { parsed = JSON.parse(text); } catch { parsed = text; }
+    try {
+      parsed = JSON.parse(text);
+    } catch {
+      parsed = text;
+    }
   }
 
-  let ids: string[] | undefined = Array.isArray((parsed as { errorFileIds?: unknown })?.errorFileIds)
+  let ids: string[] | undefined = Array.isArray(
+    (parsed as { errorFileIds?: unknown })?.errorFileIds,
+  )
     ? (parsed as { errorFileIds: string[] }).errorFileIds
     : undefined;
 
-  if (!ids && typeof parsed === 'string') {
-    const match = parsed.match(/[0-9a-fA-F]{8}-[0-9a-fA-F]{4}-[0-9a-fA-F]{4}-[0-9a-fA-F]{4}-[0-9a-fA-F]{12}/g);
+  if (!ids && typeof parsed === "string") {
+    const match = parsed.match(
+      /[0-9a-fA-F]{8}-[0-9a-fA-F]{4}-[0-9a-fA-F]{4}-[0-9a-fA-F]{4}-[0-9a-fA-F]{12}/g,
+    );
     if (match && match.length > 0) ids = Array.from(new Set(match));
   }
 
   if (ids && ids.length > 0) {
     for (const id of ids) {
-      try { markFileError(id); } catch (_e) { void _e; }
+      try {
+        markFileError(id);
+      } catch (_e) {
+        void _e;
+      }
     }
     return true;
   }
@@ -84,15 +100,34 @@ export const handle422Error = async (
 export const handlePasswordError = async (
   error: any,
   incorrectPasswordMessage: string,
-  fallbackMessage: string
+  fallbackMessage: string,
 ): Promise<string> => {
   const status = error?.response?.status;
 
   // Handle specific error cases with user-friendly messages
+  // Backend returns 400 with PdfPasswordException for incorrect/missing PDF passwords
   if (status === 500) {
-    // 500 typically means incorrect password for encrypted PDFs
     return incorrectPasswordMessage;
   }
+  if (status === 400) {
+    const data = error?.response?.data;
+    // ProblemDetail JSON has type "/errors/pdf-password", blob needs parsing
+    const isPasswordError = await (async () => {
+      if (data instanceof Blob) {
+        try {
+          const text = await data.text();
+          return text.includes("pdf-password") || text.includes("passworded");
+        } catch {
+          return false;
+        }
+      }
+      const type = data?.type ?? "";
+      return type.includes("pdf-password");
+    })();
+    if (isPasswordError) {
+      return incorrectPasswordMessage;
+    }
+  }
 
   // For other errors, try to extract the message
   const normalizedData = await normalizeAxiosErrorData(error?.response?.data);
@@ -100,8 +135,8 @@ export const handlePasswordError = async (
     ...error,
     response: {
       ...error?.response,
-      data: normalizedData
-    }
+      data: normalizedData,
+    },
   };
   return extractErrorMessage(errorWithNormalizedData) || fallbackMessage;
-};
\ No newline at end of file
+};
diff --git a/frontend/src/core/utils/toolResponseProcessor.ts b/frontend/src/core/utils/toolResponseProcessor.ts
index 1bff28b815..e36a93ecb5 100644
--- a/frontend/src/core/utils/toolResponseProcessor.ts
+++ b/frontend/src/core/utils/toolResponseProcessor.ts
@@ -1,7 +1,10 @@
 // Note: This utility should be used with useToolResources for ZIP operations
-import { getFilenameFromHeaders } from '@app/utils/fileResponseUtils';
+import { getFilenameFromHeaders } from "@app/utils/fileResponseUtils";
 
-export type ResponseHandler = (blob: Blob, originalFiles: File[]) => Promise<File[]> | File[];
+export type ResponseHandler = (
+  blob: Blob,
+  originalFiles: File[],
+) => Promise<File[]> | File[];
 
 /**
  * Processes a blob response into File(s).
@@ -15,7 +18,7 @@ export async function processResponse(
   originalFiles: File[],
   filePrefix?: string,
   responseHandler?: ResponseHandler,
-  responseHeaders?: Record<string, any>
+  responseHeaders?: Record<string, any>,
 ): Promise<File[]> {
   if (responseHandler) {
     const out = await responseHandler(blob, originalFiles);
@@ -25,10 +28,13 @@ export async function processResponse(
   // Check if we should use the backend-provided filename from headers
   // Only when responseHeaders are explicitly provided (indicating the operation requested this)
   if (responseHeaders) {
-    const contentDisposition = responseHeaders['content-disposition'];
+    const contentDisposition = responseHeaders["content-disposition"];
     const backendFilename = getFilenameFromHeaders(contentDisposition);
     if (backendFilename) {
-      const type = blob.type || responseHeaders['content-type'] || 'application/octet-stream';
+      const type =
+        blob.type ||
+        responseHeaders["content-type"] ||
+        "application/octet-stream";
       return [new File([blob], backendFilename, { type })];
     }
     // If preserveBackendFilename was requested but no Content-Disposition header found,
@@ -36,14 +42,16 @@ export async function processResponse(
   }
 
   // Default behavior: use filePrefix + original name
-  const original = originalFiles[0]?.name ?? 'result.pdf';
+  const original = originalFiles[0]?.name ?? "result.pdf";
   // Only add prefix if it's not empty - this preserves original filenames for file history
   const name = filePrefix ? `${filePrefix}${original}` : original;
-  const type = blob.type || 'application/octet-stream';
+  const type = blob.type || "application/octet-stream";
 
   // File was modified by tool processing - set lastModified to current time
-  return [new File([blob], name, {
-    type,
-    lastModified: Date.now()
-  })];
+  return [
+    new File([blob], name, {
+      type,
+      lastModified: Date.now(),
+    }),
+  ];
 }
diff --git a/frontend/src/core/utils/toolSearch.ts b/frontend/src/core/utils/toolSearch.ts
index b915cdf4dd..41b40135a5 100644
--- a/frontend/src/core/utils/toolSearch.ts
+++ b/frontend/src/core/utils/toolSearch.ts
@@ -1,6 +1,10 @@
 import { ToolId } from "@app/types/toolId";
 import { ToolRegistryEntry, ToolRegistry } from "@app/data/toolsTaxonomy";
-import { scoreMatch, minScoreForQuery, normalizeForSearch } from "@app/utils/fuzzySearch";
+import {
+  scoreMatch,
+  minScoreForQuery,
+  normalizeForSearch,
+} from "@app/utils/fuzzySearch";
 
 export interface RankedToolItem {
   item: [ToolId, ToolRegistryEntry];
@@ -9,23 +13,41 @@ export interface RankedToolItem {
 
 export function filterToolRegistryByQuery(
   toolRegistry: Partial<ToolRegistry>,
-  query: string
+  query: string,
 ): RankedToolItem[] {
   const entries = Object.entries(toolRegistry) as [ToolId, ToolRegistryEntry][];
   if (!query.trim()) {
-    return entries.map(([id, tool]) => ({ item: [id, tool] as [ToolId, ToolRegistryEntry] }));
+    return entries.map(([id, tool]) => ({
+      item: [id, tool] as [ToolId, ToolRegistryEntry],
+    }));
   }
 
   const nq = normalizeForSearch(query);
   const threshold = minScoreForQuery(query);
 
-  const exactName: Array<{ id: ToolId; tool: ToolRegistryEntry; pos: number }> = [];
-  const exactSyn: Array<{ id: ToolId; tool: ToolRegistryEntry; text: string; pos: number }> = [];
-  const fuzzyName: Array<{ id: ToolId; tool: ToolRegistryEntry; score: number; text: string }> = [];
-  const fuzzySyn: Array<{ id: ToolId; tool: ToolRegistryEntry; score: number; text: string }> = [];
+  const exactName: Array<{ id: ToolId; tool: ToolRegistryEntry; pos: number }> =
+    [];
+  const exactSyn: Array<{
+    id: ToolId;
+    tool: ToolRegistryEntry;
+    text: string;
+    pos: number;
+  }> = [];
+  const fuzzyName: Array<{
+    id: ToolId;
+    tool: ToolRegistryEntry;
+    score: number;
+    text: string;
+  }> = [];
+  const fuzzySyn: Array<{
+    id: ToolId;
+    tool: ToolRegistryEntry;
+    score: number;
+    text: string;
+  }> = [];
 
   for (const [id, tool] of entries) {
-    const nameNorm = normalizeForSearch(tool.name || '');
+    const nameNorm = normalizeForSearch(tool.name || "");
     const pos = nameNorm.indexOf(nq);
     if (pos !== -1) {
       exactName.push({ id, tool, pos });
@@ -43,19 +65,24 @@ export function filterToolRegistryByQuery(
       }
     }
     if (matchedExactSyn) {
-      exactSyn.push({ id, tool, text: matchedExactSyn.text, pos: matchedExactSyn.pos });
+      exactSyn.push({
+        id,
+        tool,
+        text: matchedExactSyn.text,
+        pos: matchedExactSyn.pos,
+      });
       continue;
     }
 
     // Fuzzy name
-    const nameScore = scoreMatch(query, tool.name || '');
+    const nameScore = scoreMatch(query, tool.name || "");
     if (nameScore >= threshold) {
-      fuzzyName.push({ id, tool, score: nameScore, text: tool.name || '' });
+      fuzzyName.push({ id, tool, score: nameScore, text: tool.name || "" });
     }
 
     // Fuzzy synonyms (we'll consider these only if fuzzy name results are weak)
     let bestSynScore = 0;
-    let bestSynText = '';
+    let bestSynText = "";
     for (const s of syns) {
       const synScore = scoreMatch(query, s);
       if (synScore > bestSynScore) {
@@ -70,7 +97,10 @@ export function filterToolRegistryByQuery(
   }
 
   // Sort within buckets
-  exactName.sort((a, b) => a.pos - b.pos || (a.tool.name || '').length - (b.tool.name || '').length);
+  exactName.sort(
+    (a, b) =>
+      a.pos - b.pos || (a.tool.name || "").length - (b.tool.name || "").length,
+  );
   exactSyn.sort((a, b) => a.pos - b.pos || a.text.length - b.text.length);
   fuzzyName.sort((a, b) => b.score - a.score);
   fuzzySyn.sort((a, b) => b.score - a.score);
@@ -93,6 +123,7 @@ export function filterToolRegistryByQuery(
   if (ordered.length > 0) return ordered;
 
   // Fallback: return everything unchanged
-  return entries.map(([id, tool]) => ({ item: [id, tool] as [ToolId, ToolRegistryEntry] }));
+  return entries.map(([id, tool]) => ({
+    item: [id, tool] as [ToolId, ToolRegistryEntry],
+  }));
 }
-
diff --git a/frontend/src/core/utils/toolSynonyms.ts b/frontend/src/core/utils/toolSynonyms.ts
index 31b80fa2c0..fe5cdfb00d 100644
--- a/frontend/src/core/utils/toolSynonyms.ts
+++ b/frontend/src/core/utils/toolSynonyms.ts
@@ -23,14 +23,20 @@ export const getSynonyms = (t: TFunction, toolId: string): string[] => {
 
     // Log the tags found for this tool
     if (cleanedTags.length > 0) {
-      console.info(`[Tags] Tool "${toolId}" (${usedKey}) has ${cleanedTags.length} tags:`, cleanedTags);
+      console.info(
+        `[Tags] Tool "${toolId}" (${usedKey}) has ${cleanedTags.length} tags:`,
+        cleanedTags,
+      );
     } else {
       console.warn(`[Tags] Tool "${toolId}" has empty tags value`);
     }
 
     return cleanedTags;
   } catch (error) {
-    console.error(`[Tags] Failed to get translated synonyms for tool ${toolId}:`, error);
+    console.error(
+      `[Tags] Failed to get translated synonyms for tool ${toolId}:`,
+      error,
+    );
     return [];
   }
 };
diff --git a/frontend/src/core/utils/urlMapping.ts b/frontend/src/core/utils/urlMapping.ts
index 118426ddfe..08c0893102 100644
--- a/frontend/src/core/utils/urlMapping.ts
+++ b/frontend/src/core/utils/urlMapping.ts
@@ -1,136 +1,136 @@
-import { ToolId } from '@app/types/toolId';
+import { ToolId } from "@app/types/toolId";
 
 // Map URL paths to tool keys (multiple URLs can map to same tool)
 export const URL_TO_TOOL_MAP: Record<string, ToolId> = {
   // Basic tools - standard patterns
-  '/split': 'split',
-  '/split-pdfs': 'split',
-  '/merge': 'merge',
-  '/merge-pdfs': 'merge',
-  '/compress': 'compress',
-  '/compress-pdf': 'compress',
-  '/rotate': 'rotate',
-  '/rotate-pdf': 'rotate',
-  '/repair': 'repair',
-  '/flatten': 'flatten',
-  '/crop': 'crop',
+  "/split": "split",
+  "/split-pdfs": "split",
+  "/merge": "merge",
+  "/merge-pdfs": "merge",
+  "/compress": "compress",
+  "/compress-pdf": "compress",
+  "/rotate": "rotate",
+  "/rotate-pdf": "rotate",
+  "/repair": "repair",
+  "/flatten": "flatten",
+  "/crop": "crop",
 
   // Convert tool and all its variants
-  '/convert': 'convert',
-  '/convert-pdf': 'convert',
-  '/file-to-pdf': 'convert',
-  '/eml-to-pdf': 'convert',
-  '/html-to-pdf': 'convert',
-  '/markdown-to-pdf': 'convert',
-  '/pdf-to-csv': 'convert',
-  '/pdf-to-xlsx': 'convert',
-  '/pdf-to-img': 'convert',
-  '/pdf-to-markdown': 'convert',
-  '/pdf-to-pdfa': 'convert',
-  '/pdf-to-word': 'convert',
-  '/pdf-to-xml': 'convert',
-  '/cbr-to-pdf': 'convert',
-  '/pdf-to-cbr': 'convert',
-  '/cbz-to-pdf': 'convert',
-  '/pdf-to-cbz': 'convert',
+  "/convert": "convert",
+  "/convert-pdf": "convert",
+  "/file-to-pdf": "convert",
+  "/eml-to-pdf": "convert",
+  "/html-to-pdf": "convert",
+  "/markdown-to-pdf": "convert",
+  "/pdf-to-csv": "convert",
+  "/pdf-to-xlsx": "convert",
+  "/pdf-to-img": "convert",
+  "/pdf-to-markdown": "convert",
+  "/pdf-to-pdfa": "convert",
+  "/pdf-to-word": "convert",
+  "/pdf-to-xml": "convert",
+  "/cbr-to-pdf": "convert",
+  "/pdf-to-cbr": "convert",
+  "/cbz-to-pdf": "convert",
+  "/pdf-to-cbz": "convert",
 
   // Security tools
-  '/add-password': 'addPassword',
-  '/remove-password': 'removePassword',
-  '/change-permissions': 'changePermissions',
-  '/cert-sign': 'certSign',
-  '/manage-signatures': 'certSign',
-  '/remove-certificate-sign': 'removeCertSign',
-  '/remove-cert-sign': 'removeCertSign',
-  '/unlock-pdf-forms': 'unlockPDFForms',
-  '/validate-signature': 'validateSignature',
+  "/add-password": "addPassword",
+  "/remove-password": "removePassword",
+  "/change-permissions": "changePermissions",
+  "/cert-sign": "certSign",
+  "/manage-signatures": "certSign",
+  "/remove-certificate-sign": "removeCertSign",
+  "/remove-cert-sign": "removeCertSign",
+  "/unlock-pdf-forms": "unlockPDFForms",
+  "/validate-signature": "validateSignature",
 
   // Content manipulation
-  '/sanitize': 'sanitize',
-  '/sanitize-pdf': 'sanitize',
-  '/ocr': 'ocr',
-  '/ocr-pdf': 'ocr',
-  '/watermark': 'watermark',
-  '/add-watermark': 'watermark',
-  '/add-image': 'addImage',
-  '/add-stamp': 'addStamp',
-  '/add-page-numbers': 'addPageNumbers',
-  '/redact': 'redact',
+  "/sanitize": "sanitize",
+  "/sanitize-pdf": "sanitize",
+  "/ocr": "ocr",
+  "/ocr-pdf": "ocr",
+  "/watermark": "watermark",
+  "/add-watermark": "watermark",
+  "/add-image": "addImage",
+  "/add-stamp": "addStamp",
+  "/add-page-numbers": "addPageNumbers",
+  "/redact": "redact",
 
   // Page manipulation
-  '/remove-pages': 'removePages',
-  '/remove-blanks': 'removeBlanks',
-  '/extract-pages': 'extractPages',
-  '/reorganize-pages': 'reorganizePages',
-  '/single-large-page': 'pdfToSinglePage',
-  '/page-layout': 'pageLayout',
-  '/scale-pages': 'scalePages',
-  '/booklet-imposition': 'bookletImposition',
+  "/remove-pages": "removePages",
+  "/remove-blanks": "removeBlanks",
+  "/extract-pages": "extractPages",
+  "/reorganize-pages": "reorganizePages",
+  "/single-large-page": "pdfToSinglePage",
+  "/page-layout": "pageLayout",
+  "/scale-pages": "scalePages",
+  "/booklet-imposition": "bookletImposition",
 
   // Splitting tools
-  '/auto-split-pdf': 'split',
-  '/auto-size-split-pdf': 'split',
-  '/scanner-image-split': 'scannerImageSplit',
+  "/auto-split-pdf": "split",
+  "/auto-size-split-pdf": "split",
+  "/scanner-image-split": "scannerImageSplit",
 
   // Annotation and content removal
-  '/annotations': 'annotate',
-  '/annotate': 'annotate',
-  '/remove-annotations': 'removeAnnotations',
-  '/remove-image': 'removeImage',
+  "/annotations": "annotate",
+  "/annotate": "annotate",
+  "/remove-annotations": "removeAnnotations",
+  "/remove-image": "removeImage",
 
   // Image and visual tools
-  '/extract-images': 'extractImages',
-  '/adjust-contrast': 'adjustContrast',
-  '/fake-scan': 'scannerEffect',
-  '/replace-color-pdf': 'replaceColor',
+  "/extract-images": "extractImages",
+  "/adjust-contrast": "adjustContrast",
+  "/fake-scan": "scannerEffect",
+  "/replace-color-pdf": "replaceColor",
 
   // Metadata and info
-  '/change-metadata': 'changeMetadata',
-  '/get-pdf-info': 'getPdfInfo',
-  '/add-attachments': 'addAttachments',
+  "/change-metadata": "changeMetadata",
+  "/get-pdf-info": "getPdfInfo",
+  "/add-attachments": "addAttachments",
 
   // Advanced tools
-  '/overlay-pdfs': 'overlayPdfs',
-  '/edit-table-of-contents': 'editTableOfContents',
-  '/auto-rename': 'autoRename',
-  '/compare': 'compare',
-  '/multi-tool': 'multiTool',
-  '/show-js': 'showJS',
+  "/overlay-pdfs": "overlayPdfs",
+  "/edit-table-of-contents": "editTableOfContents",
+  "/auto-rename": "autoRename",
+  "/compare": "compare",
+  "/multi-tool": "multiTool",
+  "/show-js": "showJS",
 
   // Special/utility tools
-  '/read': 'read',
-  '/automate': 'automate',
-  '/sign': 'sign',
-  '/add-text': 'addText',
-  '/pdf-text-editor': 'pdfTextEditor',
+  "/read": "read",
+  "/automate": "automate",
+  "/sign": "sign",
+  "/add-text": "addText",
+  "/pdf-text-editor": "pdfTextEditor",
 
   // Developer tools
-  '/dev-api': 'devApi',
-  '/dev-folder-scanning': 'devFolderScanning',
-  '/dev-sso-guide': 'devSsoGuide',
-  '/dev-airgapped': 'devAirgapped',
+  "/dev-api": "devApi",
+  "/dev-folder-scanning": "devFolderScanning",
+  "/dev-sso-guide": "devSsoGuide",
+  "/dev-airgapped": "devAirgapped",
 
   // Legacy URL mappings from sitemap
-  '/pdf-organizer': 'reorganizePages',
-  '/multi-page-layout': 'pageLayout',
-  '/extract-page': 'extractPages',
-  '/pdf-to-single-page': 'pdfToSinglePage',
-  '/img-to-pdf': 'convert',
-  '/pdf-to-presentation': 'convert',
-  '/pdf-to-text': 'convert',
-  '/pdf-to-html': 'convert',
-  '/auto-redact': 'redact',
-  '/stamp': 'addStamp',
-  '/view-pdf': 'read',
-  '/get-info-on-pdf': 'getPdfInfo',
-  '/remove-image-pdf': 'removeImage',
-  '/replace-and-invert-color-pdf': 'replaceColor',
-  '/pipeline': 'automate',
-  '/extract-image-scans': 'scannerImageSplit',
-  '/show-javascript': 'showJS',
-  '/scanner-effect': 'scannerEffect',
-  '/split-by-size-or-count': 'split',
-  '/overlay-pdf': 'overlayPdfs',
-  '/split-pdf-by-sections': 'split',
-  '/split-pdf-by-chapters': 'split',
+  "/pdf-organizer": "reorganizePages",
+  "/multi-page-layout": "pageLayout",
+  "/extract-page": "extractPages",
+  "/pdf-to-single-page": "pdfToSinglePage",
+  "/img-to-pdf": "convert",
+  "/pdf-to-presentation": "convert",
+  "/pdf-to-text": "convert",
+  "/pdf-to-html": "convert",
+  "/auto-redact": "redact",
+  "/stamp": "addStamp",
+  "/view-pdf": "read",
+  "/get-info-on-pdf": "getPdfInfo",
+  "/remove-image-pdf": "removeImage",
+  "/replace-and-invert-color-pdf": "replaceColor",
+  "/pipeline": "automate",
+  "/extract-image-scans": "scannerImageSplit",
+  "/show-javascript": "showJS",
+  "/scanner-effect": "scannerEffect",
+  "/split-by-size-or-count": "split",
+  "/overlay-pdf": "overlayPdfs",
+  "/split-pdf-by-sections": "split",
+  "/split-pdf-by-chapters": "split",
 };
diff --git a/frontend/src/core/utils/urlRouting.ts b/frontend/src/core/utils/urlRouting.ts
index 6d04817be3..3623dfceec 100644
--- a/frontend/src/core/utils/urlRouting.ts
+++ b/frontend/src/core/utils/urlRouting.ts
@@ -2,13 +2,17 @@
  * URL routing utilities for tool navigation with registry support
  */
 
-import { ToolRoute } from '@app/types/navigation';
-import { ToolId, isValidToolId } from '@app/types/toolId';
-import { getDefaultWorkbench } from '@app/types/workbench';
-import { ToolRegistry, getToolWorkbench, getToolUrlPath } from '@app/data/toolsTaxonomy';
-import { firePixel } from '@app/utils/scarfTracking';
-import { URL_TO_TOOL_MAP } from '@app/utils/urlMapping';
-import { BASE_PATH, withBasePath } from '@app/constants/app';
+import { ToolRoute } from "@app/types/navigation";
+import { ToolId, isValidToolId } from "@app/types/toolId";
+import { getDefaultWorkbench } from "@app/types/workbench";
+import {
+  ToolRegistry,
+  getToolWorkbench,
+  getToolUrlPath,
+} from "@app/data/toolsTaxonomy";
+import { firePixel } from "@app/utils/scarfTracking";
+import { URL_TO_TOOL_MAP } from "@app/utils/urlMapping";
+import { BASE_PATH, withBasePath } from "@app/constants/app";
 
 /**
  * Parse the current URL to extract tool routing information
@@ -16,9 +20,10 @@ import { BASE_PATH, withBasePath } from '@app/constants/app';
 export function parseToolRoute(registry: ToolRegistry): ToolRoute {
   const fullPath = window.location.pathname;
   // Remove base path to get app-relative path
-  const path = BASE_PATH && fullPath.startsWith(BASE_PATH)
-    ? fullPath.slice(BASE_PATH.length) || '/'
-    : fullPath;
+  const path =
+    BASE_PATH && fullPath.startsWith(BASE_PATH)
+      ? fullPath.slice(BASE_PATH.length) || "/"
+      : fullPath;
   const searchParams = new URLSearchParams(window.location.search);
 
   // First, check URL mapping for multiple URL aliases
@@ -27,7 +32,7 @@ export function parseToolRoute(registry: ToolRegistry): ToolRoute {
     const tool = registry[mappedToolId];
     return {
       workbench: getToolWorkbench(tool),
-      toolId: mappedToolId
+      toolId: mappedToolId,
     };
   }
 
@@ -37,42 +42,49 @@ export function parseToolRoute(registry: ToolRegistry): ToolRoute {
     if (path === toolUrlPath && isValidToolId(toolId)) {
       return {
         workbench: getToolWorkbench(tool),
-        toolId
+        toolId,
       };
     }
   }
 
   // Check for query parameter fallback (e.g., ?tool=split)
-  const toolParam = searchParams.get('tool');
+  const toolParam = searchParams.get("tool");
   if (toolParam && isValidToolId(toolParam) && registry[toolParam]) {
     const tool = registry[toolParam];
     return {
       workbench: getToolWorkbench(tool),
-      toolId: toolParam
+      toolId: toolParam,
     };
   }
 
   // Default to fileEditor workbench for home page
   return {
     workbench: getDefaultWorkbench(),
-    toolId: null
+    toolId: null,
   };
 }
 
 /**
  * Update URL and fire analytics pixel
  */
-function updateUrl(newPath: string, searchParams: URLSearchParams, replace: boolean = false): void {
+function updateUrl(
+  newPath: string,
+  searchParams: URLSearchParams,
+  replace: boolean = false,
+): void {
   const currentPath = window.location.pathname;
   const queryString = searchParams.toString();
-  const fullUrl = newPath + (queryString ? `?${queryString}` : '');
+  const fullUrl = newPath + (queryString ? `?${queryString}` : "");
 
   // Only update URL and fire pixel if something actually changed
-  if (currentPath !== newPath || window.location.search !== (queryString ? `?${queryString}` : '')) {
+  if (
+    currentPath !== newPath ||
+    window.location.search !== (queryString ? `?${queryString}` : "")
+  ) {
     if (replace) {
-      window.history.replaceState(null, '', fullUrl);
+      window.history.replaceState(null, "", fullUrl);
     } else {
-      window.history.pushState(null, '', fullUrl);
+      window.history.pushState(null, "", fullUrl);
     }
     firePixel(newPath);
   }
@@ -81,7 +93,11 @@ function updateUrl(newPath: string, searchParams: URLSearchParams, replace: bool
 /**
  * Update the URL to reflect the current tool selection
  */
-export function updateToolRoute(toolId: ToolId, registry: ToolRegistry, replace: boolean = false): void {
+export function updateToolRoute(
+  toolId: ToolId,
+  registry: ToolRegistry,
+  replace: boolean = false,
+): void {
   const tool = registry[toolId];
   if (!tool) {
     console.warn(`Tool ${toolId} not found in registry`);
@@ -93,7 +109,7 @@ export function updateToolRoute(toolId: ToolId, registry: ToolRegistry, replace:
   const searchParams = new URLSearchParams(window.location.search);
 
   // Remove tool query parameter since we're using path-based routing
-  searchParams.delete('tool');
+  searchParams.delete("tool");
 
   updateUrl(newPath, searchParams, replace);
 }
@@ -103,15 +119,18 @@ export function updateToolRoute(toolId: ToolId, registry: ToolRegistry, replace:
  */
 export function clearToolRoute(replace: boolean = false): void {
   const searchParams = new URLSearchParams(window.location.search);
-  searchParams.delete('tool');
+  searchParams.delete("tool");
 
-  updateUrl(withBasePath('/'), searchParams, replace);
+  updateUrl(withBasePath("/"), searchParams, replace);
 }
 
 /**
  * Get clean tool name for display purposes using registry
  */
-export function getToolDisplayName(toolId: ToolId, registry: ToolRegistry): string {
+export function getToolDisplayName(
+  toolId: ToolId,
+  registry: ToolRegistry,
+): string {
   const tool = registry[toolId];
   return tool ? tool.name : toolId;
 }
diff --git a/frontend/src/core/utils/viewerZoom.ts b/frontend/src/core/utils/viewerZoom.ts
index 78799e8b24..6e9f8f3e0c 100644
--- a/frontend/src/core/utils/viewerZoom.ts
+++ b/frontend/src/core/utils/viewerZoom.ts
@@ -1,4 +1,4 @@
-import { useEffect, useRef } from 'react';
+import { useEffect, useRef } from "react";
 
 export const DEFAULT_VISIBILITY_THRESHOLD = 70; // Require at least 70% of the page height to be visible
 export const DEFAULT_FALLBACK_ZOOM = 1.44; // 144% fallback when no reliable metadata is present
@@ -11,9 +11,9 @@ export interface ZoomViewport {
 }
 
 export type AutoZoomDecision =
-  | { type: 'fallback'; zoom: number }
-  | { type: 'fitWidth' }
-  | { type: 'adjust'; zoom: number };
+  | { type: "fallback"; zoom: number }
+  | { type: "fitWidth" }
+  | { type: "adjust"; zoom: number };
 
 export interface AutoZoomParams {
   viewportWidth: number;
@@ -40,11 +40,11 @@ export function determineAutoZoom({
   const rectWidth = pageRect?.width ?? 0;
   const rectHeight = pageRect?.height ?? 0;
   const aspectRatio: number | null =
-    rectWidth > 0 ? rectHeight / rectWidth : metadataAspectRatio ?? null;
+    rectWidth > 0 ? rectHeight / rectWidth : (metadataAspectRatio ?? null);
 
   // Need aspect ratio to proceed
   if (!aspectRatio || aspectRatio <= 0) {
-    return { type: 'fallback', zoom: Math.min(fitWidthZoom, fallbackZoom) };
+    return { type: "fallback", zoom: Math.min(fitWidthZoom, fallbackZoom) };
   }
 
   // Landscape pages need 100% visibility, portrait need the specified threshold
@@ -53,15 +53,17 @@ export function determineAutoZoom({
 
   // Calculate zoom level that shows targetVisibility% of page height
   const pageHeightAtFitWidth = (viewportWidth / pagesPerSpread) * aspectRatio;
-  const heightBasedZoom = fitWidthZoom * (viewportHeight / pageHeightAtFitWidth) / (targetVisibility / 100);
+  const heightBasedZoom =
+    (fitWidthZoom * (viewportHeight / pageHeightAtFitWidth)) /
+    (targetVisibility / 100);
 
   // Use whichever zoom is smaller (more zoomed out) to satisfy both width and height constraints
   if (heightBasedZoom < fitWidthZoom) {
     // Need to zoom out from fitWidth to show enough height
-    return { type: 'adjust', zoom: heightBasedZoom };
+    return { type: "adjust", zoom: heightBasedZoom };
   } else {
     // fitWidth already shows enough
-    return { type: 'fitWidth' };
+    return { type: "fitWidth" };
   }
 }
 
@@ -76,7 +78,7 @@ export async function measureRenderedPageRect({
   maxAttempts = 12,
   shouldCancel,
 }: MeasurePageRectOptions = {}): Promise<DOMRect | null> {
-  if (typeof window === 'undefined' || typeof document === 'undefined') {
+  if (typeof window === "undefined" || typeof document === "undefined") {
     return null;
   }
 
@@ -163,12 +165,12 @@ export function useFitWidthResize({
       }, debounceMs);
     };
 
-    window.addEventListener('resize', handleResize);
+    window.addEventListener("resize", handleResize);
     return () => {
       if (timeoutId !== undefined) {
         window.clearTimeout(timeoutId);
       }
-      window.removeEventListener('resize', handleResize);
+      window.removeEventListener("resize", handleResize);
     };
   }, [debounceMs]);
 }
diff --git a/frontend/src/core/workers/compareWorker.ts b/frontend/src/core/workers/compareWorker.ts
index edf378180e..b8cdb832b9 100644
--- a/frontend/src/core/workers/compareWorker.ts
+++ b/frontend/src/core/workers/compareWorker.ts
@@ -4,7 +4,7 @@ import type {
   CompareDiffToken,
   CompareWorkerRequest,
   CompareWorkerResponse,
-} from '@app/types/compare';
+} from "@app/types/compare";
 
 declare const self: DedicatedWorkerGlobalScope;
 
@@ -47,21 +47,25 @@ const buildMatrix = (words1: string[], words2: string[]) => {
   return matrix;
 };
 
-const backtrack = (matrix: number[][], words1: string[], words2: string[]): CompareDiffToken[] => {
+const backtrack = (
+  matrix: number[][],
+  words1: string[],
+  words2: string[],
+): CompareDiffToken[] => {
   const tokens: CompareDiffToken[] = [];
   let i = words1.length;
   let j = words2.length;
 
   while (i > 0 || j > 0) {
     if (i > 0 && j > 0 && words1[i - 1] === words2[j - 1]) {
-      tokens.unshift({ type: 'unchanged', text: words1[i - 1] });
+      tokens.unshift({ type: "unchanged", text: words1[i - 1] });
       i -= 1;
       j -= 1;
     } else if (j > 0 && (i === 0 || matrix[i][j] === matrix[i][j - 1])) {
-      tokens.unshift({ type: 'added', text: words2[j - 1] });
+      tokens.unshift({ type: "added", text: words2[j - 1] });
       j -= 1;
     } else if (i > 0) {
-      tokens.unshift({ type: 'removed', text: words1[i - 1] });
+      tokens.unshift({ type: "removed", text: words1[i - 1] });
       i -= 1;
     } else {
       j -= 1;
@@ -81,14 +85,14 @@ const diff = (words1: string[], words2: string[]): CompareDiffToken[] => {
 };
 
 const countBaseTokens = (segment: CompareDiffToken[]) =>
-  segment.reduce((acc, token) => acc + (token.type !== 'added' ? 1 : 0), 0);
+  segment.reduce((acc, token) => acc + (token.type !== "added" ? 1 : 0), 0);
 
 const countComparisonTokens = (segment: CompareDiffToken[]) =>
-  segment.reduce((acc, token) => acc + (token.type !== 'removed' ? 1 : 0), 0);
+  segment.reduce((acc, token) => acc + (token.type !== "removed" ? 1 : 0), 0);
 
 const findLastUnchangedIndex = (segment: CompareDiffToken[]) => {
   for (let i = segment.length - 1; i >= 0; i -= 1) {
-    if (segment[i].type === 'unchanged') {
+    if (segment[i].type === "unchanged") {
       return i;
     }
   }
@@ -100,7 +104,7 @@ const chunkedDiff = (
   words2: string[],
   chunkSize: number,
   emit: (tokens: CompareDiffToken[]) => void,
-  runtimeStop?: { maxProcessedTokens: number; minUnchangedRatio: number }
+  runtimeStop?: { maxProcessedTokens: number; minUnchangedRatio: number },
 ) => {
   if (words1.length === 0 && words2.length === 0) {
     return;
@@ -121,13 +125,19 @@ const chunkedDiff = (
     }
     const nextChunk = Math.min(
       maxChunkSize,
-      Math.max(dynamicChunkSize + dynamicStep, Math.floor(dynamicChunkSize * 1.5))
+      Math.max(
+        dynamicChunkSize + dynamicStep,
+        Math.floor(dynamicChunkSize * 1.5),
+      ),
     );
     if (nextChunk === dynamicChunkSize) {
       return;
     }
     dynamicChunkSize = nextChunk;
-    dynamicMaxWindow = Math.max(dynamicMaxWindow, Math.max(dynamicChunkSize * 6, dynamicChunkSize + 512));
+    dynamicMaxWindow = Math.max(
+      dynamicMaxWindow,
+      Math.max(dynamicChunkSize * 6, dynamicChunkSize + 512),
+    );
     dynamicMinCommit = Math.max(1, Math.floor(dynamicChunkSize * 0.1));
     dynamicStep = Math.max(64, Math.floor(dynamicChunkSize * 0.5));
   };
@@ -141,7 +151,10 @@ const chunkedDiff = (
   let totalUnchanged = 0;
 
   const countUnchanged = (segment: CompareDiffToken[]) =>
-    segment.reduce((acc, token) => acc + (token.type === 'unchanged' ? 1 : 0), 0);
+    segment.reduce(
+      (acc, token) => acc + (token.type === "unchanged" ? 1 : 0),
+      0,
+    );
 
   const flushRemainder = () => {
     if (buffer1.length === 0 && buffer2.length === 0) {
@@ -173,8 +186,14 @@ const chunkedDiff = (
     let reachedEnd: boolean;
 
     while (true) {
-      const take1 = Math.min(Math.max(0, windowSize - buffer1.length), remaining1);
-      const take2 = Math.min(Math.max(0, windowSize - buffer2.length), remaining2);
+      const take1 = Math.min(
+        Math.max(0, windowSize - buffer1.length),
+        remaining1,
+      );
+      const take2 = Math.min(
+        Math.max(0, windowSize - buffer2.length),
+        remaining2,
+      );
 
       const slice1 = take1 > 0 ? words1.slice(index1, index1 + take1) : [];
       const slice2 = take2 > 0 ? words2.slice(index2, index2 + take2) : [];
@@ -191,8 +210,7 @@ const chunkedDiff = (
       const lastStableIndex = findLastUnchangedIndex(chunkTokens);
 
       reachedEnd =
-        index1 + take1 >= words1.length &&
-        index2 + take2 >= words2.length;
+        index1 + take1 >= words1.length && index2 + take2 >= words2.length;
 
       const windowTooLarge =
         window1.length >= dynamicMaxWindow ||
@@ -209,10 +227,7 @@ const chunkedDiff = (
         break;
       }
 
-      windowSize = Math.min(
-        dynamicMaxWindow,
-        windowSize + dynamicStep
-      );
+      windowSize = Math.min(dynamicMaxWindow, windowSize + dynamicStep);
     }
 
     if (chunkTokens.length === 0) {
@@ -228,14 +243,17 @@ const chunkedDiff = (
       continue;
     }
 
-    let commitIndex = reachedEnd ? chunkTokens.length - 1 : findLastUnchangedIndex(chunkTokens);
+    let commitIndex = reachedEnd
+      ? chunkTokens.length - 1
+      : findLastUnchangedIndex(chunkTokens);
     if (commitIndex < 0) {
       commitIndex = reachedEnd
         ? chunkTokens.length - 1
         : Math.min(chunkTokens.length - 1, dynamicMinCommit - 1);
     }
 
-    const commitTokens = commitIndex >= 0 ? chunkTokens.slice(0, commitIndex + 1) : [];
+    const commitTokens =
+      commitIndex >= 0 ? chunkTokens.slice(0, commitIndex + 1) : [];
     const baseConsumed = countBaseTokens(commitTokens);
     const comparisonConsumed = countComparisonTokens(commitTokens);
 
@@ -262,7 +280,7 @@ const chunkedDiff = (
         const unchangedRatio = totalUnchanged / Math.max(1, processedTotal);
         if (unchangedRatio < runtimeStop.minUnchangedRatio) {
           // Signal early termination for extreme dissimilarity
-          const err = new Error('EARLY_STOP_TOO_DISSIMILAR');
+          const err = new Error("EARLY_STOP_TOO_DISSIMILAR");
           (err as Error & { __earlyStop?: boolean }).__earlyStop = true;
           throw err;
         }
@@ -300,7 +318,11 @@ const chunkedDiff = (
 };
 
 // Fast similarity estimation using sampled unigrams and bigrams with Jaccard
-const buildSampledSet = (tokens: string[], sampleLimit: number, ngram: 1 | 2): Set<string> => {
+const buildSampledSet = (
+  tokens: string[],
+  sampleLimit: number,
+  ngram: 1 | 2,
+): Set<string> => {
   const result = new Set<string>();
   if (tokens.length === 0) return result;
   const stride = Math.max(1, Math.ceil(tokens.length / sampleLimit));
@@ -335,7 +357,7 @@ const jaccard = (a: Set<string>, b: Set<string>): number => {
 
 self.onmessage = (event: MessageEvent<CompareWorkerRequest>) => {
   const { data } = event;
-  if (!data || data.type !== 'compare') {
+  if (!data || data.type !== "compare") {
     return;
   }
 
@@ -353,37 +375,52 @@ self.onmessage = (event: MessageEvent<CompareWorkerRequest>) => {
     runtimeMinUnchangedRatio = DEFAULT_SETTINGS.runtimeMinUnchangedRatio,
   } = settings ?? {};
 
-  if (!baseTokens || !comparisonTokens || baseTokens.length === 0 || comparisonTokens.length === 0) {
+  if (
+    !baseTokens ||
+    !comparisonTokens ||
+    baseTokens.length === 0 ||
+    comparisonTokens.length === 0
+  ) {
     const response: CompareWorkerResponse = {
-      type: 'error',
-      message: warnings.emptyTextMessage ?? 'One or both texts are empty.',
-      code: 'EMPTY_TEXT',
+      type: "error",
+      message: warnings.emptyTextMessage ?? "One or both texts are empty.",
+      code: "EMPTY_TEXT",
     };
     self.postMessage(response);
     return;
   }
 
-  if (baseTokens.length > maxWordThreshold || comparisonTokens.length > maxWordThreshold) {
+  if (
+    baseTokens.length > maxWordThreshold ||
+    comparisonTokens.length > maxWordThreshold
+  ) {
     // For compare tool, do not fail hard; warn and continue with chunked diff
     const response: CompareWorkerResponse = {
-      type: 'warning',
-      message: warnings.tooLargeMessage ?? 'Documents are too large to compare.',
+      type: "warning",
+      message:
+        warnings.tooLargeMessage ?? "Documents are too large to compare.",
     };
     self.postMessage(response);
   }
 
-  const isComplex = baseTokens.length > complexThreshold || comparisonTokens.length > complexThreshold;
+  const isComplex =
+    baseTokens.length > complexThreshold ||
+    comparisonTokens.length > complexThreshold;
 
   if (isComplex && warnings.complexMessage) {
     const warningResponse: CompareWorkerResponse = {
-      type: 'warning',
+      type: "warning",
       message: warnings.complexMessage,
     };
     self.postMessage(warningResponse);
   }
 
   // Quick prefilter to avoid heavy diff on extremely dissimilar large docs
-  if (earlyStopEnabled && Math.min(baseTokens.length, comparisonTokens.length) >= minTokensForEarlyStop) {
+  if (
+    earlyStopEnabled &&
+    Math.min(baseTokens.length, comparisonTokens.length) >=
+      minTokensForEarlyStop
+  ) {
     const set1u = buildSampledSet(baseTokens, sampleLimit, 1);
     const set2u = buildSampledSet(comparisonTokens, sampleLimit, 1);
     const jUni = jaccard(set1u, set2u);
@@ -392,11 +429,11 @@ self.onmessage = (event: MessageEvent<CompareWorkerRequest>) => {
     const jBi = jaccard(set1b, set2b);
     if (jUni < minJaccardUnigram && jBi < minJaccardBigram) {
       const response: CompareWorkerResponse = {
-        type: 'error',
+        type: "error",
         message:
           warnings.tooDissimilarMessage ??
-          'These documents appear highly dissimilar. Comparison was stopped to save time.',
-        code: 'TOO_DISSIMILAR',
+          "These documents appear highly dissimilar. Comparison was stopped to save time.",
+        code: "TOO_DISSIMILAR",
       };
       self.postMessage(response);
       return;
@@ -414,22 +451,28 @@ self.onmessage = (event: MessageEvent<CompareWorkerRequest>) => {
           return;
         }
         const response: CompareWorkerResponse = {
-          type: 'chunk',
+          type: "chunk",
           tokens,
         };
         self.postMessage(response);
       },
-      { maxProcessedTokens: runtimeMaxProcessedTokens, minUnchangedRatio: runtimeMinUnchangedRatio }
+      {
+        maxProcessedTokens: runtimeMaxProcessedTokens,
+        minUnchangedRatio: runtimeMinUnchangedRatio,
+      },
     );
   } catch (err) {
     const error = err as Error & { __earlyStop?: boolean };
-    if (error && (error.__earlyStop || error.message === 'EARLY_STOP_TOO_DISSIMILAR')) {
+    if (
+      error &&
+      (error.__earlyStop || error.message === "EARLY_STOP_TOO_DISSIMILAR")
+    ) {
       const response: CompareWorkerResponse = {
-        type: 'error',
+        type: "error",
         message:
           warnings.tooDissimilarMessage ??
-          'These documents appear highly dissimilar. Comparison was stopped to save time.',
-        code: 'TOO_DISSIMILAR',
+          "These documents appear highly dissimilar. Comparison was stopped to save time.",
+        code: "TOO_DISSIMILAR",
       };
       self.postMessage(response);
       return;
@@ -439,7 +482,7 @@ self.onmessage = (event: MessageEvent<CompareWorkerRequest>) => {
   const durationMs = performance.now() - start;
 
   const response: CompareWorkerResponse = {
-    type: 'success',
+    type: "success",
     stats: {
       baseWordCount: baseTokens.length,
       comparisonWordCount: comparisonTokens.length,
diff --git a/frontend/src/core/workers/pixelCompareWorker.ts b/frontend/src/core/workers/pixelCompareWorker.ts
new file mode 100644
index 0000000000..bb57bb75f4
--- /dev/null
+++ b/frontend/src/core/workers/pixelCompareWorker.ts
@@ -0,0 +1,517 @@
+/// <reference lib="webworker" />
+
+import {
+  GlobalWorkerOptions,
+  getDocument,
+  type PDFDocumentProxy,
+  type PDFPageProxy,
+} from "pdfjs-dist/legacy/build/pdf.mjs";
+import pixelmatch from "pixelmatch";
+
+import type {
+  PixelCompareWorkerPagePayload,
+  PixelCompareWorkerRequest,
+  PixelCompareWorkerResponse,
+  PixelCompareWorkerWarnings,
+} from "@app/types/compare";
+
+declare const self: DedicatedWorkerGlobalScope;
+
+GlobalWorkerOptions.workerSrc = new URL(
+  "pdfjs-dist/legacy/build/pdf.worker.min.mjs",
+  import.meta.url,
+).toString();
+
+// PDF.js' default canvas factory assumes a DOM (`document.createElement('canvas')`).
+// Inside a Web Worker there's no DOM, so we provide an OffscreenCanvas-based factory.
+interface CanvasAndContext {
+  canvas: OffscreenCanvas;
+  context: OffscreenCanvasRenderingContext2D;
+}
+
+interface ErrorStrings {
+  canvasContextUnavailable: string;
+}
+
+const DEFAULT_ERRORS: ErrorStrings = {
+  canvasContextUnavailable: "Unable to acquire 2D canvas context.",
+};
+
+// pdfjs-dist 5.x expects CanvasFactory and FilterFactory to be **class constructors**
+// (it does `new CanvasFactory({ ownerDocument, enableHWA })` internally), so we build
+// the class on demand with request-scoped error strings captured in its closure.
+const createOffscreenCanvasFactory = (errorStrings: ErrorStrings) =>
+  class OffscreenCanvasFactory {
+    constructor(_opts?: { ownerDocument?: unknown; enableHWA?: boolean }) {
+      /* ownerDocument/enableHWA ignored — we always use OffscreenCanvas */
+    }
+
+    create(width: number, height: number): CanvasAndContext {
+      const canvas = new OffscreenCanvas(
+        Math.max(1, width),
+        Math.max(1, height),
+      );
+      const context = canvas.getContext("2d", { willReadFrequently: true });
+      if (!context) throw new Error(errorStrings.canvasContextUnavailable);
+      return { canvas, context };
+    }
+
+    reset(
+      canvasAndContext: CanvasAndContext,
+      width: number,
+      height: number,
+    ): void {
+      canvasAndContext.canvas.width = Math.max(1, width);
+      canvasAndContext.canvas.height = Math.max(1, height);
+    }
+
+    destroy(canvasAndContext: CanvasAndContext): void {
+      canvasAndContext.canvas.width = 0;
+      canvasAndContext.canvas.height = 0;
+      (canvasAndContext as { canvas: OffscreenCanvas | null }).canvas = null;
+      (
+        canvasAndContext as {
+          context: OffscreenCanvasRenderingContext2D | null;
+        }
+      ).context = null;
+    }
+  };
+
+// BaseFilterFactory's defaults already return "none" for every filter, which is what
+// we want in a worker (no DOM, no SVG). Re-declare the same no-op class so pdfjs can
+// instantiate it without hitting DOMFilterFactory's document.createElementNS calls.
+class NoopFilterFactory {
+  constructor(_opts?: { docId?: string; ownerDocument?: unknown }) {
+    /* noop */
+  }
+  addFilter() {
+    return "none";
+  }
+  addHCMFilter() {
+    return "none";
+  }
+  addAlphaFilter() {
+    return "none";
+  }
+  addLuminosityFilter() {
+    return "none";
+  }
+  addHighlightHCMFilter() {
+    return "none";
+  }
+  destroy(_keepHCM?: boolean) {
+    /* noop */
+  }
+}
+
+const CSS_DPI = 72;
+
+const post = (
+  message: PixelCompareWorkerResponse,
+  transfer: Transferable[] = [],
+) => {
+  self.postMessage(message, transfer);
+};
+
+const formatWarning = (
+  template: string,
+  values: Record<string, string | number>,
+): string =>
+  template.replace(/\{\{\s*(\w+)\s*\}\}/g, (_, key) =>
+    String(values[key] ?? ""),
+  );
+
+const renderPageToBitmap = async (
+  page: PDFPageProxy,
+  scale: number,
+  targetWidth: number,
+  targetHeight: number,
+  errorStrings: ErrorStrings,
+): Promise<{ imageData: ImageData; bitmap: ImageBitmap }> => {
+  const viewport = page.getViewport({ scale });
+  const renderedW = Math.max(1, Math.round(viewport.width));
+  const renderedH = Math.max(1, Math.round(viewport.height));
+
+  const canvas = new OffscreenCanvas(targetWidth, targetHeight);
+  const ctx = canvas.getContext("2d", { willReadFrequently: true });
+  if (!ctx) throw new Error(errorStrings.canvasContextUnavailable);
+  ctx.fillStyle = "#ffffff";
+  ctx.fillRect(0, 0, targetWidth, targetHeight);
+
+  const offsetX = Math.round((targetWidth - renderedW) / 2);
+  const offsetY = Math.round((targetHeight - renderedH) / 2);
+  ctx.save();
+  ctx.translate(offsetX, offsetY);
+  // pdfjs accepts OffscreenCanvas via canvas option
+  await page.render({
+    canvas: canvas as unknown as HTMLCanvasElement,
+    canvasContext: ctx as unknown as CanvasRenderingContext2D,
+    viewport,
+  }).promise;
+  ctx.restore();
+
+  const imageData = ctx.getImageData(0, 0, targetWidth, targetHeight);
+  const bitmap = canvas.transferToImageBitmap();
+  return { imageData, bitmap };
+};
+
+const ENCODE_OPTS: ImageEncodeOptions = { type: "image/webp", quality: 0.85 };
+
+const bitmapToBlob = async (
+  bitmap: ImageBitmap,
+  width: number,
+  height: number,
+  errorStrings: ErrorStrings,
+): Promise<Blob> => {
+  const canvas = new OffscreenCanvas(width, height);
+  const ctx = canvas.getContext("2d");
+  if (!ctx) throw new Error(errorStrings.canvasContextUnavailable);
+  ctx.drawImage(bitmap, 0, 0);
+  bitmap.close();
+  return await canvas.convertToBlob(ENCODE_OPTS);
+};
+
+const diffDataToBlob = async (
+  diff: ImageData,
+  width: number,
+  height: number,
+  errorStrings: ErrorStrings,
+): Promise<Blob> => {
+  const canvas = new OffscreenCanvas(width, height);
+  const ctx = canvas.getContext("2d");
+  if (!ctx) throw new Error(errorStrings.canvasContextUnavailable);
+  ctx.fillStyle = "#ffffff";
+  ctx.fillRect(0, 0, width, height);
+  ctx.putImageData(diff, 0, 0);
+  return await canvas.convertToBlob(ENCODE_OPTS);
+};
+
+interface PageTotals {
+  diffPixels: number;
+  totalPixels: number;
+  hasChanges: boolean;
+}
+
+interface PixelMatchColours {
+  diffColor: [number, number, number];
+  diffColorAlt?: [number, number, number];
+}
+
+// Produce a fully-white ImageData + matching ImageBitmap for use when one side of the
+// comparison has no corresponding page (the other PDF was shorter).
+const createBlankRender = async (
+  width: number,
+  height: number,
+  errorStrings: ErrorStrings,
+): Promise<{ imageData: ImageData; bitmap: ImageBitmap }> => {
+  const canvas = new OffscreenCanvas(width, height);
+  const ctx = canvas.getContext("2d", { willReadFrequently: true });
+  if (!ctx) throw new Error(errorStrings.canvasContextUnavailable);
+  ctx.fillStyle = "#ffffff";
+  ctx.fillRect(0, 0, width, height);
+  const imageData = ctx.getImageData(0, 0, width, height);
+  const bitmap = canvas.transferToImageBitmap();
+  return { imageData, bitmap };
+};
+
+const processPage = async (
+  baseDoc: PDFDocumentProxy,
+  compDoc: PDFDocumentProxy,
+  pageNumber: number,
+  basePages: number,
+  compPages: number,
+  scale: number,
+  threshold: number,
+  colours: PixelMatchColours,
+  errorStrings: ErrorStrings,
+): Promise<{ payload: PixelCompareWorkerPagePayload; totals: PageTotals }> => {
+  const missingBase = pageNumber > basePages;
+  const missingComparison = pageNumber > compPages;
+
+  const basePage = missingBase ? null : await baseDoc.getPage(pageNumber);
+  const compPage = missingComparison ? null : await compDoc.getPage(pageNumber);
+  try {
+    // Determine target dimensions from whichever side(s) exist. When only one side has
+    // this page, the blank side is rendered at the same canvas size so pixelmatch can
+    // flag every non-white pixel as a diff.
+    const baseViewport = basePage ? basePage.getViewport({ scale }) : null;
+    const compViewport = compPage ? compPage.getViewport({ scale }) : null;
+
+    const refWidth = baseViewport?.width ?? compViewport?.width ?? 1;
+    const refHeight = baseViewport?.height ?? compViewport?.height ?? 1;
+    const targetWidth = Math.max(
+      1,
+      Math.round(
+        Math.max(
+          baseViewport?.width ?? refWidth,
+          compViewport?.width ?? refWidth,
+        ),
+      ),
+    );
+    const targetHeight = Math.max(
+      1,
+      Math.round(
+        Math.max(
+          baseViewport?.height ?? refHeight,
+          compViewport?.height ?? refHeight,
+        ),
+      ),
+    );
+    const sizeMismatch =
+      baseViewport && compViewport
+        ? Math.round(baseViewport.width) !== Math.round(compViewport.width) ||
+          Math.round(baseViewport.height) !== Math.round(compViewport.height)
+        : false;
+
+    const [base, comp] = await Promise.all([
+      basePage && baseViewport
+        ? renderPageToBitmap(
+            basePage,
+            scale,
+            targetWidth,
+            targetHeight,
+            errorStrings,
+          )
+        : createBlankRender(targetWidth, targetHeight, errorStrings),
+      compPage && compViewport
+        ? renderPageToBitmap(
+            compPage,
+            scale,
+            targetWidth,
+            targetHeight,
+            errorStrings,
+          )
+        : createBlankRender(targetWidth, targetHeight, errorStrings),
+    ]);
+
+    const diffImage = new ImageData(targetWidth, targetHeight);
+    const diffCount = pixelmatch(
+      base.imageData.data,
+      comp.imageData.data,
+      diffImage.data,
+      targetWidth,
+      targetHeight,
+      {
+        threshold,
+        includeAA: true,
+        alpha: 0.3,
+        diffColor: colours.diffColor,
+        ...(colours.diffColorAlt ? { diffColorAlt: colours.diffColorAlt } : {}),
+      },
+    );
+
+    const [baseBlob, comparisonBlob, diffBlob] = await Promise.all([
+      bitmapToBlob(base.bitmap, targetWidth, targetHeight, errorStrings),
+      bitmapToBlob(comp.bitmap, targetWidth, targetHeight, errorStrings),
+      diffDataToBlob(diffImage, targetWidth, targetHeight, errorStrings),
+    ]);
+
+    const totalPixels = targetWidth * targetHeight;
+
+    const payload: PixelCompareWorkerPagePayload = {
+      pageNumber,
+      width: targetWidth,
+      height: targetHeight,
+      baseBlob,
+      comparisonBlob,
+      diffBlob,
+      diffPixels: diffCount,
+      totalPixels,
+      diffRatio: totalPixels > 0 ? diffCount / totalPixels : 0,
+      sizeMismatch,
+      ...(missingBase ? { missingBase: true } : {}),
+      ...(missingComparison ? { missingComparison: true } : {}),
+    };
+
+    return {
+      payload,
+      totals: {
+        diffPixels: diffCount,
+        totalPixels,
+        hasChanges: diffCount > 0,
+      },
+    };
+  } finally {
+    basePage?.cleanup();
+    compPage?.cleanup();
+  }
+};
+
+const runPool = async <T>(
+  items: number[],
+  concurrency: number,
+  worker: (pageNumber: number) => Promise<T>,
+  onResult: (pageNumber: number, value: T) => void,
+): Promise<void> => {
+  let cursor = 0;
+  const runners: Promise<void>[] = [];
+  const limit = Math.max(1, Math.min(concurrency, items.length));
+  for (let i = 0; i < limit; i += 1) {
+    runners.push(
+      (async () => {
+        while (cursor < items.length) {
+          const idx = cursor;
+          cursor += 1;
+          const pageNumber = items[idx];
+          const value = await worker(pageNumber);
+          onResult(pageNumber, value);
+        }
+      })(),
+    );
+  }
+  await Promise.all(runners);
+};
+
+self.addEventListener(
+  "message",
+  async (event: MessageEvent<PixelCompareWorkerRequest>) => {
+    const message = event.data;
+    if (!message || message.type !== "pixel-compare") return;
+
+    const {
+      baseFile,
+      comparisonFile,
+      dpi,
+      threshold,
+      concurrency,
+      warnings: warningTemplates,
+      errors: errorTemplates,
+      diffColor,
+      diffColorAlt,
+    } = message.payload;
+    const errorStrings: ErrorStrings = { ...DEFAULT_ERRORS, ...errorTemplates };
+    const OffscreenCanvasFactory = createOffscreenCanvasFactory(errorStrings);
+    const colours: PixelMatchColours = { diffColor, diffColorAlt };
+    const warnings: string[] = [];
+    const scale = Math.max(0.5, dpi / CSS_DPI);
+    const startedAt = performance.now();
+
+    let baseDoc: PDFDocumentProxy | null = null;
+    let compDoc: PDFDocumentProxy | null = null;
+
+    try {
+      // `CanvasFactory`/`FilterFactory` are supported at runtime but not declared on legacy types.
+      // pdfjs-dist 5.x renamed the option to `CanvasFactory` (capital C); without a FilterFactory
+      // the default DOMFilterFactory crashes in a worker calling document.createElementNS.
+      // Resolve CMap/standard-font URLs against the worker's own origin. Vite copies these
+      // directories from pdfjs-dist at build time via viteStaticCopy (see vite.config.ts).
+      const assetsBase = new URL("/pdfjs/", self.location.origin).toString();
+      const loaderOpts = (data: ArrayBuffer) =>
+        ({
+          data,
+          CanvasFactory: OffscreenCanvasFactory,
+          FilterFactory: NoopFilterFactory,
+          cMapUrl: `${assetsBase}cmaps/`,
+          cMapPacked: true,
+          standardFontDataUrl: `${assetsBase}standard_fonts/`,
+          // Force glyph-path rendering. The default path uses the FontFace / document.fonts
+          // APIs which reference `globalThis.document` — undefined in a DedicatedWorker, so
+          // text either silently fails to install or renders as placeholder glyphs.
+          disableFontFace: true,
+          useSystemFonts: false,
+          isEvalSupported: false,
+        }) as unknown as Parameters<typeof getDocument>[0];
+
+      const [baseBuffer, comparisonBuffer] = await Promise.all([
+        baseFile.arrayBuffer(),
+        comparisonFile.arrayBuffer(),
+      ]);
+
+      [baseDoc, compDoc] = await Promise.all([
+        getDocument(loaderOpts(baseBuffer)).promise,
+        getDocument(loaderOpts(comparisonBuffer)).promise,
+      ]);
+
+      const basePages = baseDoc.numPages;
+      const compPages = compDoc.numPages;
+      const sharedPages = Math.min(basePages, compPages);
+
+      if (basePages !== compPages) {
+        warnings.push(
+          formatWarning(warningTemplates.pageCountMismatch, {
+            base: basePages,
+            comparison: compPages,
+            shared: sharedPages,
+          }),
+        );
+      }
+      if (Math.max(basePages, compPages) === 0) {
+        throw new Error(warningTemplates.noPages);
+      }
+
+      // Walk every page in the longer document. Pages past the shorter document's length
+      // are processed one-sided: the missing side is rendered blank and the whole present
+      // side is treated as a diff.
+      const totalPages = Math.max(basePages, compPages);
+      const pageNumbers = Array.from({ length: totalPages }, (_, i) => i + 1);
+      const hwThreads = self.navigator?.hardwareConcurrency ?? 4;
+      const defaultConcurrency = Math.max(2, Math.min(8, hwThreads - 1));
+      const poolSize = Math.max(
+        1,
+        Math.min(concurrency ?? defaultConcurrency, totalPages),
+      );
+
+      let totalDiffPixels = 0;
+      let totalPixelsCount = 0;
+      let pagesWithChanges = 0;
+
+      await runPool(
+        pageNumbers,
+        poolSize,
+        async (pageNumber) => {
+          post({ type: "progress", pageNumber, totalPages });
+          return await processPage(
+            baseDoc as PDFDocumentProxy,
+            compDoc as PDFDocumentProxy,
+            pageNumber,
+            basePages,
+            compPages,
+            scale,
+            threshold,
+            colours,
+            errorStrings,
+          );
+        },
+        (_pageNumber, value) => {
+          totalDiffPixels += value.totals.diffPixels;
+          totalPixelsCount += value.totals.totalPixels;
+          if (value.totals.hasChanges) pagesWithChanges += 1;
+          post({ type: "page", page: value.payload });
+        },
+      );
+
+      post({
+        type: "success",
+        totals: {
+          diffPixels: totalDiffPixels,
+          totalPixels: totalPixelsCount,
+          diffRatio:
+            totalPixelsCount > 0 ? totalDiffPixels / totalPixelsCount : 0,
+          pagesWithChanges,
+          durationMs: performance.now() - startedAt,
+        },
+        warnings,
+      });
+    } catch (error: unknown) {
+      const message =
+        error instanceof Error
+          ? error.message
+          : String(error ?? "Unknown error");
+      post({ type: "error", message });
+    } finally {
+      try {
+        if (baseDoc) await baseDoc.destroy();
+      } catch {
+        /* swallow */
+      }
+      try {
+        if (compDoc) await compDoc.destroy();
+      } catch {
+        /* swallow */
+      }
+    }
+  },
+);
+
+// Re-export for type consumers so the import is not dropped.
+export type { PixelCompareWorkerWarnings };
diff --git a/frontend/src/desktop/auth/supabase.ts b/frontend/src/desktop/auth/supabase.ts
index 2935211826..96e1757a2c 100644
--- a/frontend/src/desktop/auth/supabase.ts
+++ b/frontend/src/desktop/auth/supabase.ts
@@ -1,5 +1,5 @@
-import { createClient } from '@supabase/supabase-js';
-import { STIRLING_SAAS_URL, SUPABASE_KEY } from '@app/constants/connection';
+import { createClient } from "@supabase/supabase-js";
+import { STIRLING_SAAS_URL, SUPABASE_KEY } from "@app/constants/connection";
 
 /**
  * Supabase client for desktop application
@@ -10,21 +10,25 @@ import { STIRLING_SAAS_URL, SUPABASE_KEY } from '@app/constants/connection';
  */
 
 if (!STIRLING_SAAS_URL) {
-  console.warn('[Desktop Supabase] VITE_SAAS_SERVER_URL not configured - SaaS features will not work');
+  console.warn(
+    "[Desktop Supabase] VITE_SAAS_SERVER_URL not configured - SaaS features will not work",
+  );
 }
 
 if (!SUPABASE_KEY) {
-  console.warn('[Desktop Supabase] VITE_SUPABASE_PUBLISHABLE_DEFAULT_KEY not configured - SaaS features will not work');
+  console.warn(
+    "[Desktop Supabase] VITE_SUPABASE_PUBLISHABLE_DEFAULT_KEY not configured - SaaS features will not work",
+  );
 }
 
 export const supabase = createClient(
-  STIRLING_SAAS_URL || '',
-  SUPABASE_KEY || '',
+  STIRLING_SAAS_URL || "",
+  SUPABASE_KEY || "",
   {
     auth: {
       persistSession: false, // Desktop manages auth via authService + Tauri secure store
       autoRefreshToken: false, // Desktop manually refreshes tokens via authService
       detectSessionInUrl: false, // Desktop uses deep links, not URL hash fragments
     },
-  }
+  },
 );
diff --git a/frontend/src/desktop/components/AppProviders.tsx b/frontend/src/desktop/components/AppProviders.tsx
index 974d25a5f9..e2bd4a407c 100644
--- a/frontend/src/desktop/components/AppProviders.tsx
+++ b/frontend/src/desktop/components/AppProviders.tsx
@@ -1,40 +1,43 @@
 import { ReactNode, useEffect, useRef, useState } from "react";
 import { AppProviders as ProprietaryAppProviders } from "@proprietary/components/AppProviders";
-import { DesktopConfigSync } from '@app/components/DesktopConfigSync';
-import { DesktopBannerInitializer } from '@app/components/DesktopBannerInitializer';
-import { SaveShortcutListener } from '@app/components/SaveShortcutListener';
-import { DesktopOnboardingModal } from '@app/components/DesktopOnboardingModal';
-import { SignInModal } from '@app/components/SignInModal';
-import { OPEN_SIGN_IN_EVENT } from '@app/constants/signInEvents';
-import { ToolActionsContext } from '@app/contexts/ToolActionsContext';
-import { useFirstLaunchCheck } from '@app/hooks/useFirstLaunchCheck';
-import { useBackendInitializer } from '@app/hooks/useBackendInitializer';
-import { DESKTOP_DEFAULT_APP_CONFIG } from '@app/config/defaultAppConfig';
-import { connectionModeService } from '@app/services/connectionModeService';
-import { STIRLING_SAAS_URL } from '@app/constants/connection';
-import { tauriBackendService } from '@app/services/tauriBackendService';
-import { selfHostedServerMonitor } from '@app/services/selfHostedServerMonitor';
-import { authService } from '@app/services/authService';
-import { endpointAvailabilityService } from '@app/services/endpointAvailabilityService';
-import { getCurrentWindow } from '@tauri-apps/api/window';
-import { isTauri } from '@tauri-apps/api/core';
-import { SaaSTeamProvider } from '@app/contexts/SaaSTeamContext';
-import { SaasBillingProvider } from '@app/contexts/SaasBillingContext';
-import { SaaSCheckoutProvider } from '@app/contexts/SaaSCheckoutContext';
-import { CreditModalBootstrap } from '@app/components/shared/modals/CreditModalBootstrap';
+import { DesktopConfigSync } from "@app/components/DesktopConfigSync";
+import { DesktopBannerInitializer } from "@app/components/DesktopBannerInitializer";
+import { SaveShortcutListener } from "@app/components/SaveShortcutListener";
+import { DesktopOnboardingModal } from "@app/components/DesktopOnboardingModal";
+import { SignInModal } from "@app/components/SignInModal";
+import { OPEN_SIGN_IN_EVENT } from "@app/constants/signInEvents";
+import { ToolActionsContext } from "@app/contexts/ToolActionsContext";
+import { useFirstLaunchCheck } from "@app/hooks/useFirstLaunchCheck";
+import { useBackendInitializer } from "@app/hooks/useBackendInitializer";
+import { DESKTOP_DEFAULT_APP_CONFIG } from "@app/config/defaultAppConfig";
+import {
+  connectionModeService,
+  JWT_EXPIRED_PROMPTED_KEY,
+} from "@app/services/connectionModeService";
+import { STIRLING_SAAS_URL } from "@app/constants/connection";
+import { tauriBackendService } from "@app/services/tauriBackendService";
+import { selfHostedServerMonitor } from "@app/services/selfHostedServerMonitor";
+import { authService } from "@app/services/authService";
+import { endpointAvailabilityService } from "@app/services/endpointAvailabilityService";
+import { getCurrentWindow } from "@tauri-apps/api/window";
+import { isTauri } from "@tauri-apps/api/core";
+import { SaaSTeamProvider } from "@app/contexts/SaaSTeamContext";
+import { SaasBillingProvider } from "@app/contexts/SaasBillingContext";
+import { SaaSCheckoutProvider } from "@app/contexts/SaaSCheckoutContext";
+import { CreditModalBootstrap } from "@app/components/shared/modals/CreditModalBootstrap";
 
 // Common tool endpoints to preload for faster first-use
 const COMMON_TOOL_ENDPOINTS = [
-  '/api/v1/misc/compress-pdf',
-  '/api/v1/general/merge-pdfs',
-  '/api/v1/general/split-pages',
-  '/api/v1/convert/pdf/img',
-  '/api/v1/convert/img/pdf',
-  '/api/v1/general/rotate-pdf',
-  '/api/v1/misc/add-watermark',
-  '/api/v1/security/add-password',
-  '/api/v1/security/remove-password',
-  '/api/v1/general/extract-pages',
+  "/api/v1/misc/compress-pdf",
+  "/api/v1/general/merge-pdfs",
+  "/api/v1/general/split-pages",
+  "/api/v1/convert/pdf/img",
+  "/api/v1/convert/img/pdf",
+  "/api/v1/general/rotate-pdf",
+  "/api/v1/misc/add-watermark",
+  "/api/v1/security/add-password",
+  "/api/v1/security/remove-password",
+  "/api/v1/general/extract-pages",
 ];
 
 /**
@@ -45,11 +48,11 @@ const COMMON_TOOL_ENDPOINTS = [
  */
 export function AppProviders({ children }: { children: ReactNode }) {
   const { isFirstLaunch, setupComplete } = useFirstLaunchCheck();
-  const [connectionMode, setConnectionMode] = useState<'saas' | 'selfhosted' | 'local' | null>(null);
+  const [connectionMode, setConnectionMode] = useState<
+    "saas" | "selfhosted" | "local" | null
+  >(null);
   const [authChecked, setAuthChecked] = useState(false);
-  // When auth check finds no valid session, record the sign-in detail here so the
-  // dispatch useEffect below can fire it only after SignInModal has mounted.
-  const [pendingSignIn, setPendingSignIn] = useState<{ locked: boolean } | null>(null);
+  const [pendingSignIn, setPendingSignIn] = useState(false);
   // Prevent first-launch setup from running twice when connectionMode state update re-triggers the effect
   const firstLaunchInitiated = useRef(false);
   // Key incremented on every connection mode change after initial load — forces SaaS provider
@@ -73,8 +76,8 @@ export function AppProviders({ children }: { children: ReactNode }) {
       // SaaS providers and remounting mid-wizard resets authChecked, navigating away.
       // Switching FROM selfhosted TO saas DOES trigger a remount (mode !== 'selfhosted')
       // which is intentional — the SaaS provider tree needs fresh state after login.
-      if (hasLoadedInitialMode.current && config.mode !== 'selfhosted') {
-        setAppKey(k => k + 1);
+      if (hasLoadedInitialMode.current && config.mode !== "selfhosted") {
+        setAppKey((k) => k + 1);
       }
     });
     return unsub;
@@ -85,84 +88,99 @@ export function AppProviders({ children }: { children: ReactNode }) {
     if (connectionMode === null) return;
 
     if (!isFirstLaunch && setupComplete) {
-      if (connectionMode === 'local') {
+      if (connectionMode === "local") {
         // Even in local mode, check for a valid JWT — on Windows, the OAuth callback
         // can complete without switchToSaaS() being called (race condition), leaving
         // LOCAL_MODE_STORAGE_KEY set while the user has a valid session. Upgrade to
         // SaaS mode automatically so credits/billing/team features work correctly.
-        authService.isAuthenticated()
+        authService
+          .isAuthenticated()
           .then(async (isAuth) => {
             if (isAuth) {
-              await connectionModeService.switchToSaaS(STIRLING_SAAS_URL).catch(console.error);
-              setConnectionMode('saas');
+              await connectionModeService
+                .switchToSaaS(STIRLING_SAAS_URL)
+                .catch(console.error);
+              setConnectionMode("saas");
             }
           })
           .finally(() => setAuthChecked(true));
       } else {
-        let pendingDetail: { locked: boolean } | null = null;
-        authService.isAuthenticated()
+        authService
+          .isAuthenticated()
           .then(async (isAuth) => {
             if (!isAuth) {
-              const cfg = await connectionModeService.getCurrentConfig().catch(() => null);
-              if (cfg?.lock_connection_mode) {
-                // Provisioned deployment — stay in the configured mode and prompt for credentials.
-                // Don't fall back to local; the admin has locked the connection mode.
-                pendingDetail = { locked: true };
-              } else {
-                // JWT expired — fall back to local so local tools still work, then prompt
-                // for re-authentication via the sign-in modal.
-                await connectionModeService.switchToLocal().catch(console.error);
-                setConnectionMode('local');
-                pendingDetail = { locked: false };
+              const cfg = await connectionModeService
+                .getCurrentConfig()
+                .catch(() => null);
+              if (!cfg?.lock_connection_mode) {
+                // JWT expired — fall back to local so local tools still work.
+                await connectionModeService
+                  .switchToLocal()
+                  .catch(console.error);
+                setConnectionMode("local");
+                // Show sign-in modal once per expiry cycle. If the user dismisses
+                // without signing in the flag stays set and we won't prompt again
+                // until they successfully sign in (which clears the flag).
+                if (!localStorage.getItem(JWT_EXPIRED_PROMPTED_KEY)) {
+                  localStorage.setItem(JWT_EXPIRED_PROMPTED_KEY, "true");
+                  setPendingSignIn(true);
+                }
               }
+              // Locked deployments stay in their configured mode — user can sign in
+              // via Settings when they're ready.
             }
           })
           .catch(async () => {
-            const cfg = await connectionModeService.getCurrentConfig().catch(() => null);
-            if (cfg?.lock_connection_mode) {
-              // Auth check threw (e.g. network error) but mode is locked — still prompt for
-              // credentials so the user can sign in when connectivity is restored.
-              pendingDetail = { locked: true };
-            } else {
+            const cfg = await connectionModeService
+              .getCurrentConfig()
+              .catch(() => null);
+            if (!cfg?.lock_connection_mode) {
               await connectionModeService.switchToLocal().catch(console.error);
-              setConnectionMode('local');
-              pendingDetail = { locked: false };
+              setConnectionMode("local");
+              if (!localStorage.getItem(JWT_EXPIRED_PROMPTED_KEY)) {
+                localStorage.setItem(JWT_EXPIRED_PROMPTED_KEY, "true");
+                setPendingSignIn(true);
+              }
             }
           })
-          .finally(() => {
-            setAuthChecked(true);
-            // Schedule sign-in via state so the dispatch useEffect fires AFTER
-            // SignInModal mounts (children effects run before parent effects).
-            if (pendingDetail) {
-              setPendingSignIn(pendingDetail);
-            }
-          });
+          .finally(() => setAuthChecked(true));
       }
     } else if (isFirstLaunch && !setupComplete) {
-      // Auto-enter local mode on first launch — skip the setup wizard entirely.
-      // The onboarding carousel + sign-in toast will be shown inside the main app.
-      // Start the backend explicitly here because shouldMonitorBackend relies on
-      // setupComplete (still false from the hook), so useBackendInitializer won't fire.
-      // Guard against re-running when setConnectionMode('local') below triggers this effect.
+      // Guard against re-running when setConnectionMode triggers this effect.
       if (firstLaunchInitiated.current) return;
       firstLaunchInitiated.current = true;
-      connectionModeService.switchToLocal()
-        .then(() => tauriBackendService.startBackend())
+      connectionModeService
+        .getCurrentConfig()
+        .then(async (cfg) => {
+          if (cfg.lock_connection_mode && cfg.server_config?.url) {
+            // Locked provisioned deployment — do NOT switch to local (would clear server_config
+            // from the store). Show onboarding normally; the sign-in slide handles locked auth.
+            // Still start the local backend so local tools work while the user signs in.
+            await tauriBackendService.startBackend().catch(console.error);
+            setConnectionMode("selfhosted");
+          } else {
+            // Normal first launch — auto-enter local mode.
+            // The onboarding carousel + sign-in slide will be shown inside the main app.
+            await connectionModeService.switchToLocal();
+            await tauriBackendService.startBackend();
+            setConnectionMode("local");
+          }
+        })
         .catch(console.error)
-        .finally(() => {
-          setConnectionMode('local');
-          setAuthChecked(true);
-        });
+        .finally(() => setAuthChecked(true));
     }
   }, [isFirstLaunch, setupComplete, connectionMode]);
 
   // Initialize backend health monitoring for self-hosted mode
   useEffect(() => {
-    if (setupComplete && !isFirstLaunch && connectionMode === 'selfhosted') {
+    if (connectionMode !== "selfhosted") {
+      // Stop the monitor whenever we leave selfhosted mode so the dot resets.
+      selfHostedServerMonitor.stop();
+      return;
+    }
+    if (setupComplete && !isFirstLaunch) {
       void tauriBackendService.initializeExternalBackend();
-      // Also start the self-hosted server monitor so the operation router and UI
-      // can detect when the remote server goes offline and fall back to local backend.
-      connectionModeService.getServerConfig().then(cfg => {
+      connectionModeService.getServerConfig().then((cfg) => {
         if (cfg?.url) {
           selfHostedServerMonitor.start(cfg.url);
         }
@@ -175,7 +193,10 @@ export function AppProviders({ children }: { children: ReactNode }) {
 
   // Initialize monitoring for bundled backend (already started in Rust)
   // This sets up port detection and health checks
-  const shouldMonitorBackend = setupComplete && !isFirstLaunch && (connectionMode === 'saas' || connectionMode === 'local');
+  const shouldMonitorBackend =
+    setupComplete &&
+    !isFirstLaunch &&
+    (connectionMode === "saas" || connectionMode === "local");
   useBackendInitializer(shouldMonitorBackend);
 
   // Preload endpoint availability for the local bundled backend.
@@ -184,9 +205,9 @@ export function AppProviders({ children }: { children: ReactNode }) {
   //   (so useSelfHostedToolAvailability can use the cache instead of making
   //   individual requests per-tool when the remote server goes offline).
   const shouldPreloadLocalEndpoints =
-    (setupComplete && !isFirstLaunch && connectionMode === 'saas') ||
-    (setupComplete && !isFirstLaunch && connectionMode === 'local') ||
-    (setupComplete && !isFirstLaunch && connectionMode === 'selfhosted');
+    (setupComplete && !isFirstLaunch && connectionMode === "saas") ||
+    (setupComplete && !isFirstLaunch && connectionMode === "local") ||
+    (setupComplete && !isFirstLaunch && connectionMode === "selfhosted");
   useEffect(() => {
     if (!shouldPreloadLocalEndpoints) return;
 
@@ -196,22 +217,33 @@ export function AppProviders({ children }: { children: ReactNode }) {
       // tauriBackendService.isOnline now always reflects the local backend.
       // Wait for it to be healthy before preloading in both modes.
       if (!tauriBackendService.isOnline) return;
-      console.debug('[AppProviders] Preloading common tool endpoints for local backend');
-      void endpointAvailabilityService.preloadEndpoints(COMMON_TOOL_ENDPOINTS, backendUrl);
+      console.debug(
+        "[AppProviders] Preloading common tool endpoints for local backend",
+      );
+      void endpointAvailabilityService.preloadEndpoints(
+        COMMON_TOOL_ENDPOINTS,
+        backendUrl,
+      );
     };
 
-    const unsubscribe = tauriBackendService.subscribeToStatus(() => tryPreload());
+    const unsubscribe = tauriBackendService.subscribeToStatus(() =>
+      tryPreload(),
+    );
     tryPreload();
     return unsubscribe;
   }, [shouldPreloadLocalEndpoints, connectionMode]);
 
-  // Dispatch sign-in event only after authChecked=true so SignInModal is mounted.
-  // Using useEffect (not setTimeout) guarantees child effects (SignInModal's listener
-  // registration) run before this parent effect fires the event.
+  // Dispatch sign-in modal after authChecked so SignInModal's listener is registered.
+  // (Child effects run before parent effects, so this fires after SignInModal mounts.)
+  // detail.locked is always false here: setPendingSignIn(true) is only called inside
+  // `if (!cfg?.lock_connection_mode)` branches above, so locked deployments never set
+  // pendingSignIn and therefore never reach this dispatch.
   useEffect(() => {
     if (!authChecked || !pendingSignIn) return;
-    window.dispatchEvent(new CustomEvent(OPEN_SIGN_IN_EVENT, { detail: pendingSignIn }));
-    setPendingSignIn(null);
+    window.dispatchEvent(
+      new CustomEvent(OPEN_SIGN_IN_EVENT, { detail: { locked: false } }),
+    );
+    setPendingSignIn(false);
   }, [authChecked, pendingSignIn]);
 
   useEffect(() => {
@@ -241,11 +273,11 @@ export function AppProviders({ children }: { children: ReactNode }) {
         }}
         appConfigProviderProps={{
           initialConfig: DESKTOP_DEFAULT_APP_CONFIG,
-          bootstrapMode: 'non-blocking',
+          bootstrapMode: "non-blocking",
           autoFetch: false,
         }}
       >
-        <div style={{ minHeight: '100vh' }} />
+        <div style={{ minHeight: "100vh" }} />
       </ProprietaryAppProviders>
     );
   }
@@ -259,13 +291,16 @@ export function AppProviders({ children }: { children: ReactNode }) {
       }}
       appConfigProviderProps={{
         initialConfig: DESKTOP_DEFAULT_APP_CONFIG,
-        bootstrapMode: 'non-blocking',
+        bootstrapMode: "non-blocking",
         autoFetch: false,
       }}
     >
-      <ToolActionsContext.Provider value={{
-        onEndpointUnavailableClick: () => window.dispatchEvent(new CustomEvent(OPEN_SIGN_IN_EVENT)),
-      }}>
+      <ToolActionsContext.Provider
+        value={{
+          onEndpointUnavailableClick: () =>
+            window.dispatchEvent(new CustomEvent(OPEN_SIGN_IN_EVENT)),
+        }}
+      >
         <SaaSTeamProvider key={appKey}>
           <SaasBillingProvider>
             <SaaSCheckoutProvider>
diff --git a/frontend/src/desktop/components/BackendHealthIndicator.tsx b/frontend/src/desktop/components/BackendHealthIndicator.tsx
index 5bc12f405b..a61a1e8726 100644
--- a/frontend/src/desktop/components/BackendHealthIndicator.tsx
+++ b/frontend/src/desktop/components/BackendHealthIndicator.tsx
@@ -1,58 +1,59 @@
-import React, { useMemo, useCallback } from 'react';
-import { useTranslation } from 'react-i18next';
-import { Box, Tooltip, useMantineTheme, useComputedColorScheme, rem } from '@mantine/core';
-import { useBackendHealth } from '@app/hooks/useBackendHealth';
+import React, { useMemo, useCallback } from "react";
+import { useTranslation } from "react-i18next";
+import { Box, Tooltip, useMantineTheme, rem } from "@mantine/core";
+import { useBackendHealth } from "@app/hooks/useBackendHealth";
 
 interface BackendHealthIndicatorProps {
   className?: string;
 }
 
 export const BackendHealthIndicator: React.FC<BackendHealthIndicatorProps> = ({
-  className = ''
+  className = "",
 }) => {
   const { t } = useTranslation();
   const theme = useMantineTheme();
-  const colorScheme = useComputedColorScheme('light');
   const { status, isOnline, checkHealth } = useBackendHealth();
 
   const label = useMemo(() => {
-    if (status === 'starting') {
-      return t('backendHealth.checking', 'Checking backend status...');
+    if (status === "starting") {
+      return t("backendHealth.checking", "Checking backend status...");
     }
 
     if (isOnline) {
-      return t('backendHealth.online', 'Backend Online');
+      return t("backendHealth.online", "Backend Online");
     }
 
-    return t('backendHealth.offline', 'Backend Offline');
+    return t("backendHealth.offline", "Backend Offline");
   }, [status, isOnline, t]);
 
   const dotColor = useMemo(() => {
-    if (status === 'starting') {
-      return theme.colors.yellow?.[5] ?? '#fcc419';
+    if (status === "starting") {
+      return theme.colors.yellow?.[5] ?? "#fcc419";
     }
     if (isOnline) {
-      return theme.colors.green?.[5] ?? '#37b24d';
+      return theme.colors.green?.[5] ?? "#37b24d";
     }
-    return theme.colors.red?.[6] ?? '#e03131';
-  }, [status, isOnline, theme.colors.green, theme.colors.red, theme.colors.yellow]);
+    return theme.colors.red?.[6] ?? "#e03131";
+  }, [
+    status,
+    isOnline,
+    theme.colors.green,
+    theme.colors.red,
+    theme.colors.yellow,
+  ]);
 
-  const handleKeyDown = useCallback((event: React.KeyboardEvent<HTMLSpanElement>) => {
-    if (event.key === 'Enter' || event.key === ' ') {
-      event.preventDefault();
-      checkHealth();
-    }
-  }, [checkHealth]);
+  const handleKeyDown = useCallback(
+    (event: React.KeyboardEvent<HTMLSpanElement>) => {
+      if (event.key === "Enter" || event.key === " ") {
+        event.preventDefault();
+        checkHealth();
+      }
+    },
+    [checkHealth],
+  );
 
   return (
-    <Tooltip
-      label={label}
-      position="left"
-      offset={12}
-      withArrow
-      withinPortal
-      color={colorScheme === 'dark' ? undefined : 'dark'}
-    >
+    <Tooltip label={label} position="left" offset={12} withArrow withinPortal>
       <Box
         component="span"
         className={className ? `${className}` : undefined}
@@ -65,14 +66,12 @@ export const BackendHealthIndicator: React.FC<BackendHealthIndicatorProps> = ({
         style={{
           width: rem(12),
           height: rem(12),
-          borderRadius: '50%',
+          borderRadius: "50%",
           backgroundColor: dotColor,
-          boxShadow: colorScheme === 'dark'
-            ? '0 0 0 2px rgba(255, 255, 255, 0.18)'
-            : '0 0 0 2px rgba(0, 0, 0, 0.08)',
-          cursor: 'pointer',
-          display: 'inline-block',
-          outline: 'none',
+          boxShadow: "var(--status-dot-ring)",
+          cursor: "pointer",
+          display: "inline-block",
+          outline: "none",
         }}
       />
     </Tooltip>
diff --git a/frontend/src/desktop/components/ConnectionSettings.tsx b/frontend/src/desktop/components/ConnectionSettings.tsx
index fa75cddcef..7260044774 100644
--- a/frontend/src/desktop/components/ConnectionSettings.tsx
+++ b/frontend/src/desktop/components/ConnectionSettings.tsx
@@ -1,9 +1,12 @@
-import React, { useState, useEffect } from 'react';
-import { Stack, Card, Badge, Button, Text, Group } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { connectionModeService, ConnectionConfig } from '@app/services/connectionModeService';
-import { authService, UserInfo } from '@app/services/authService';
-import { OPEN_SIGN_IN_EVENT } from '@app/constants/signInEvents';
+import React, { useState, useEffect } from "react";
+import { Stack, Card, Badge, Button, Text, Group } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import {
+  connectionModeService,
+  ConnectionConfig,
+} from "@app/services/connectionModeService";
+import { authService, UserInfo } from "@app/services/authService";
+import { OPEN_SIGN_IN_EVENT } from "@app/constants/signInEvents";
 
 export const ConnectionSettings: React.FC = () => {
   const { t } = useTranslation();
@@ -17,7 +20,10 @@ export const ConnectionSettings: React.FC = () => {
       const currentConfig = await connectionModeService.getCurrentConfig();
       setConfig(currentConfig);
 
-      if (currentConfig.mode === 'saas' || currentConfig.mode === 'selfhosted') {
+      if (
+        currentConfig.mode === "saas" ||
+        currentConfig.mode === "selfhosted"
+      ) {
         const user = await authService.getUserInfo();
         setUserInfo(user);
       }
@@ -25,7 +31,8 @@ export const ConnectionSettings: React.FC = () => {
 
     loadConfig();
 
-    const unsubscribe = connectionModeService.subscribeToModeChanges(loadConfig);
+    const unsubscribe =
+      connectionModeService.subscribeToModeChanges(loadConfig);
     return unsubscribe;
   }, []);
 
@@ -33,8 +40,8 @@ export const ConnectionSettings: React.FC = () => {
     try {
       setLoading(true);
       // Save server URL before clearing so user can easily reconnect (self-hosted only)
-      if (config?.mode === 'selfhosted' && config?.server_config?.url) {
-        localStorage.setItem('server_url', config.server_config.url);
+      if (config?.mode === "selfhosted" && config?.server_config?.url) {
+        localStorage.setItem("server_url", config.server_config.url);
       }
       await authService.logout();
       // Always switch to local after logout so the app remains usable
@@ -46,11 +53,11 @@ export const ConnectionSettings: React.FC = () => {
       setUserInfo(null);
 
       // Clear URL to home page so we don't return to settings after re-login
-      window.history.replaceState({}, '', '/');
+      window.history.replaceState({}, "", "/");
       // No reload needed — AppProviders remounts the SaaS provider tree via
       // connectionModeService subscription when mode changes to local.
     } catch (error) {
-      console.error('Logout failed:', error);
+      console.error("Logout failed:", error);
     } finally {
       setLoading(false);
     }
@@ -61,7 +68,7 @@ export const ConnectionSettings: React.FC = () => {
   };
 
   if (!config) {
-    return <Text>{t('common.loading', 'Loading...')}</Text>;
+    return <Text>{t("common.loading", "Loading...")}</Text>;
   }
 
   return (
@@ -69,61 +76,77 @@ export const ConnectionSettings: React.FC = () => {
       <Card shadow="sm" padding="lg" radius="md" withBorder>
         <Stack gap="md">
           <Group justify="space-between">
-            <Text fw={600}>{t('settings.connection.title', 'Connection Mode')}</Text>
+            <Text fw={600}>
+              {t("settings.connection.title", "Connection Mode")}
+            </Text>
             <Badge
-              color={config.mode === 'saas' ? 'blue' : config.mode === 'local' ? 'white' : 'green'}
+              color={
+                config.mode === "saas"
+                  ? "blue"
+                  : config.mode === "local"
+                    ? "white"
+                    : "green"
+              }
               variant="light"
             >
-              {config.mode === 'saas'
-                ? t('settings.connection.mode.saas', 'Stirling Cloud')
-                : config.mode === 'local'
-                  ? t('settings.connection.mode.local', 'Local Only')
-                  : t('settings.connection.mode.selfhosted', 'Self-Hosted')}
+              {config.mode === "saas"
+                ? t("settings.connection.mode.saas", "Stirling Cloud")
+                : config.mode === "local"
+                  ? t("settings.connection.mode.local", "Local Only")
+                  : t("settings.connection.mode.selfhosted", "Self-Hosted")}
             </Badge>
           </Group>
 
-          {config.mode === 'local' && (
+          {config.mode === "local" && (
             <Text size="sm" c="dimmed">
               {t(
-                'settings.connection.localDescription',
-                'You are using the local backend without an account. Some tools requiring cloud processing or a self-hosted server are unavailable.'
+                "settings.connection.localDescription",
+                "You are using the local backend without an account. Some tools requiring cloud processing or a self-hosted server are unavailable.",
               )}
             </Text>
           )}
 
-          {(config.mode === 'saas' || config.mode === 'selfhosted') && config.server_config && (
-            <>
-              <div>
-                <Text size="sm" fw={500}>
-                  {t('settings.connection.server', 'Server')}
-                </Text>
-                <Text size="sm" c="dimmed">
-                  {config.mode === 'saas' ? 'stirling.com' : config.server_config.url}
-                </Text>
-              </div>
-
-              {userInfo && (
+          {(config.mode === "saas" || config.mode === "selfhosted") &&
+            config.server_config && (
+              <>
                 <div>
                   <Text size="sm" fw={500}>
-                    {t('settings.connection.user', 'Logged in as')}
+                    {t("settings.connection.server", "Server")}
                   </Text>
                   <Text size="sm" c="dimmed">
-                    {userInfo.username}
-                    {userInfo.email && ` (${userInfo.email})`}
+                    {config.mode === "saas"
+                      ? "stirling.com"
+                      : config.server_config.url}
                   </Text>
                 </div>
-              )}
-            </>
-          )}
+
+                {userInfo && (
+                  <div>
+                    <Text size="sm" fw={500}>
+                      {t("settings.connection.user", "Logged in as")}
+                    </Text>
+                    <Text size="sm" c="dimmed">
+                      {userInfo.username}
+                      {userInfo.email && ` (${userInfo.email})`}
+                    </Text>
+                  </div>
+                )}
+              </>
+            )}
 
           <Group mt="md">
-            {config.mode === 'local' ? (
+            {config.mode === "local" ? (
               <Button onClick={handleSignIn} color="blue" variant="light">
-                {t('settings.connection.signIn', 'Sign In')}
+                {t("settings.connection.signIn", "Sign In")}
               </Button>
             ) : (
-              <Button onClick={handleLogout} color="red" variant="light" disabled={loading}>
-                {t('settings.connection.logout', 'Log Out')}
+              <Button
+                onClick={handleLogout}
+                color="red"
+                variant="light"
+                disabled={loading}
+              >
+                {t("settings.connection.logout", "Log Out")}
               </Button>
             )}
           </Group>
diff --git a/frontend/src/desktop/components/DesktopBannerInitializer.tsx b/frontend/src/desktop/components/DesktopBannerInitializer.tsx
index c649576f8b..ec4290590c 100644
--- a/frontend/src/desktop/components/DesktopBannerInitializer.tsx
+++ b/frontend/src/desktop/components/DesktopBannerInitializer.tsx
@@ -1,9 +1,9 @@
-import { useEffect } from 'react';
-import { useBanner } from '@app/contexts/BannerContext';
-import { DefaultAppBanner } from '@app/components/shared/DefaultAppBanner';
-import UpgradeBanner from '@app/components/shared/UpgradeBanner';
-import { TeamInvitationBanner } from '@app/components/shared/TeamInvitationBanner';
-import { SelfHostedOfflineBanner } from '@app/components/shared/SelfHostedOfflineBanner';
+import { useEffect } from "react";
+import { useBanner } from "@app/contexts/BannerContext";
+import { DefaultAppBanner } from "@app/components/shared/DefaultAppBanner";
+import UpgradeBanner from "@app/components/shared/UpgradeBanner";
+import { TeamInvitationBanner } from "@app/components/shared/TeamInvitationBanner";
+import { SelfHostedOfflineBanner } from "@app/components/shared/SelfHostedOfflineBanner";
 
 export function DesktopBannerInitializer() {
   const { setBanner } = useBanner();
diff --git a/frontend/src/desktop/components/DesktopConfigSync.tsx b/frontend/src/desktop/components/DesktopConfigSync.tsx
index 25c3ffb67d..e56074ab77 100644
--- a/frontend/src/desktop/components/DesktopConfigSync.tsx
+++ b/frontend/src/desktop/components/DesktopConfigSync.tsx
@@ -1,6 +1,6 @@
-import { useEffect, useRef } from 'react';
-import { useBackendHealth } from '@app/hooks/useBackendHealth';
-import { useAppConfig } from '@app/contexts/AppConfigContext';
+import { useEffect, useRef } from "react";
+import { useBackendHealth } from "@app/hooks/useBackendHealth";
+import { useAppConfig } from "@app/contexts/AppConfigContext";
 
 /**
  * Desktop-only bridge that refetches the app config once the bundled backend
@@ -13,7 +13,7 @@ export function DesktopConfigSync() {
   const previousStatus = useRef(status);
 
   useEffect(() => {
-    if (status === 'healthy' && previousStatus.current !== 'healthy') {
+    if (status === "healthy" && previousStatus.current !== "healthy") {
       refetch();
     }
     previousStatus.current = status;
diff --git a/frontend/src/desktop/components/DesktopOnboardingModal.tsx b/frontend/src/desktop/components/DesktopOnboardingModal.tsx
index 6fa13017d2..0a07c8127c 100644
--- a/frontend/src/desktop/components/DesktopOnboardingModal.tsx
+++ b/frontend/src/desktop/components/DesktopOnboardingModal.tsx
@@ -1,19 +1,19 @@
-import { useState, useEffect, useMemo } from 'react';
-import { Modal, Stack, Group, Button, ActionIcon } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import CloseIcon from '@mui/icons-material/Close';
-import LocalIcon from '@app/components/shared/LocalIcon';
-import AnimatedSlideBackground from '@app/components/onboarding/slides/AnimatedSlideBackground';
-import OnboardingStepper from '@app/components/onboarding/OnboardingStepper';
-import { SetupWizard } from '@app/components/SetupWizard';
-import WelcomeSlide from '@app/components/onboarding/slides/WelcomeSlide';
-import { Z_INDEX_OVER_FULLSCREEN_SURFACE } from '@app/styles/zIndex';
-import styles from '@app/components/onboarding/InitialOnboardingModal/InitialOnboardingModal.module.css';
-import { connectionModeService } from '@app/services/connectionModeService';
+import { useState, useMemo } from "react";
+import { Modal, Stack, Group, Button, ActionIcon } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import CloseIcon from "@mui/icons-material/Close";
+import LocalIcon from "@app/components/shared/LocalIcon";
+import AnimatedSlideBackground from "@app/components/onboarding/slides/AnimatedSlideBackground";
+import OnboardingStepper from "@app/components/onboarding/OnboardingStepper";
+import { SetupWizard } from "@app/components/SetupWizard";
+import WelcomeSlide from "@app/components/onboarding/slides/WelcomeSlide";
+import { Z_INDEX_OVER_FULLSCREEN_SURFACE } from "@app/styles/zIndex";
+import styles from "@app/components/onboarding/InitialOnboardingModal/InitialOnboardingModal.module.css";
+import { connectionModeService } from "@app/services/connectionModeService";
 
-const ONBOARDING_KEY = 'stirling-desktop-onboarding-seen';
+const ONBOARDING_KEY = "stirling-desktop-onboarding-seen";
 
-const SIGN_IN_GRADIENT: [string, string] = ['#3B82F6', '#7C3AED'];
+const SIGN_IN_GRADIENT: [string, string] = ["#3B82F6", "#7C3AED"];
 
 /**
  * Desktop-specific onboarding modal.
@@ -22,22 +22,17 @@ const SIGN_IN_GRADIENT: [string, string] = ['#3B82F6', '#7C3AED'];
  */
 export function DesktopOnboardingModal() {
   const { t } = useTranslation();
-  const [visible, setVisible] = useState(() => !localStorage.getItem(ONBOARDING_KEY));
+  const [visible, setVisible] = useState(
+    () => !localStorage.getItem(ONBOARDING_KEY),
+  );
   const [step, setStep] = useState(0);
-  // null = still checking, true = locked (suppress modal), false = not locked (show modal)
-  const [isLocked, setIsLocked] = useState<boolean | null>(null);
-
-  // Provisioned (locked) deployments skip the onboarding entirely — the non-dismissible
-  // SignInModal handles authentication and shows the correct self-hosted login flow.
-  useEffect(() => {
-    connectionModeService.getCurrentConfig().then((cfg) => {
-      setIsLocked(cfg.lock_connection_mode && !!cfg.server_config?.url);
-    });
-  }, []);
 
   const dismissFinal = () => {
-    localStorage.setItem(ONBOARDING_KEY, 'true');
+    localStorage.setItem(ONBOARDING_KEY, "true");
     setVisible(false);
+    // If the user dismissed the sign-in slide without authenticating, fall back to local mode
+    // so the app is usable without a server connection.
+    connectionModeService.switchToLocal().catch(console.error);
   };
 
   // X on slide 0 advances to sign-in slide rather than dismissing entirely
@@ -50,20 +45,19 @@ export function DesktopOnboardingModal() {
   };
 
   const handleComplete = () => {
-    localStorage.setItem(ONBOARDING_KEY, 'true');
+    localStorage.setItem(ONBOARDING_KEY, "true");
     setVisible(false);
     // No reload needed — AppProviders subscribes to connectionModeService and remounts
     // the SaaS provider tree when mode changes, avoiding the Windows WebView2 freeze
     // that window.location.reload() causes during a backgrounded OAuth flow.
   };
 
-
   // Call WelcomeSlide as a data factory (not a component render) — memoised so it
   // isn't reconstructed on every render while the modal is open.
   const welcomeSlide = useMemo(() => WelcomeSlide(), []);
   const totalSteps = 2;
 
-  if (!visible || isLocked === null || isLocked) return null;
+  if (!visible) return null;
 
   return (
     <Modal
@@ -78,47 +72,74 @@ export function DesktopOnboardingModal() {
       styles={{
         body: { padding: 0 },
         content: {
-          overflow: 'hidden',
-          border: 'none',
-          background: 'var(--bg-surface)',
-          maxHeight: '90vh',
-          display: 'flex',
-          flexDirection: 'column',
+          overflow: "hidden",
+          border: "none",
+          background: "var(--bg-surface)",
+          maxHeight: "90vh",
+          display: "flex",
+          flexDirection: "column",
         },
       }}
     >
-      <Stack gap={0} className={styles.modalContent} style={{ height: '100%', maxHeight: '90vh', display: 'flex', flexDirection: 'column' }}>
+      <Stack
+        gap={0}
+        className={styles.modalContent}
+        style={{
+          height: "100%",
+          maxHeight: "90vh",
+          display: "flex",
+          flexDirection: "column",
+        }}
+      >
         {/* Hero section — gradient changes per slide */}
         <div className={styles.heroWrapper} style={{ flexShrink: 0 }}>
           <AnimatedSlideBackground
-            gradientStops={(step === 0 ? welcomeSlide.background.gradientStops : SIGN_IN_GRADIENT) as [string, string]}
+            gradientStops={
+              step === 0
+                ? welcomeSlide.background.gradientStops
+                : SIGN_IN_GRADIENT
+            }
             circles={welcomeSlide.background.circles}
             isActive
-            slideKey={step === 0 ? 'desktop-welcome' : 'desktop-sign-in'}
+            slideKey={step === 0 ? "desktop-welcome" : "desktop-sign-in"}
           />
           <ActionIcon
             onClick={handleClose}
             radius="md"
             size={36}
             style={{
-              position: 'absolute',
+              position: "absolute",
               top: 16,
               right: 16,
-              backgroundColor: 'rgba(255, 255, 255, 0.2)',
-              color: 'white',
-              backdropFilter: 'blur(4px)',
+              backgroundColor: "rgba(255, 255, 255, 0.2)",
+              color: "white",
+              backdropFilter: "blur(4px)",
               zIndex: 10,
             }}
-            styles={{ root: { '&:hover': { backgroundColor: 'rgba(255, 255, 255, 0.3)' } } }}
+            styles={{
+              root: {
+                "&:hover": { backgroundColor: "rgba(255, 255, 255, 0.3)" },
+              },
+            }}
           >
             <CloseIcon fontSize="small" />
           </ActionIcon>
           <div className={styles.heroLogo} key={`logo-${step}`}>
             <div className={styles.heroLogoCircle}>
               {step === 0 ? (
-                <LocalIcon icon="rocket-launch" width={64} height={64} className={styles.heroIcon} />
+                <LocalIcon
+                  icon="rocket-launch"
+                  width={64}
+                  height={64}
+                  className={styles.heroIcon}
+                />
               ) : (
-                <LocalIcon icon="login" width={64} height={64} className={styles.heroIcon} />
+                <LocalIcon
+                  icon="login"
+                  width={64}
+                  height={64}
+                  className={styles.heroIcon}
+                />
               )}
             </div>
           </div>
@@ -127,7 +148,7 @@ export function DesktopOnboardingModal() {
         {/* Body section */}
         <div
           className={styles.modalBody}
-          style={{ flex: 1, overflowY: 'auto', overflowX: 'hidden' }}
+          style={{ flex: 1, overflowY: "auto", overflowX: "hidden" }}
         >
           {step === 0 ? (
             // Welcome slide
@@ -148,12 +169,12 @@ export function DesktopOnboardingModal() {
                     onClick={() => setStep(1)}
                     styles={{
                       root: {
-                        background: 'var(--onboarding-primary-button-bg)',
-                        color: 'var(--onboarding-primary-button-text)',
+                        background: "var(--onboarding-primary-button-bg)",
+                        color: "var(--onboarding-primary-button-text)",
                       },
                     }}
                   >
-                    {t('onboarding.buttons.next', 'Next →')}
+                    {t("onboarding.buttons.next", "Next →")}
                   </Button>
                 </Group>
               </div>
diff --git a/frontend/src/desktop/components/SaveShortcutListener.tsx b/frontend/src/desktop/components/SaveShortcutListener.tsx
index 64b5d681a4..19540857c7 100644
--- a/frontend/src/desktop/components/SaveShortcutListener.tsx
+++ b/frontend/src/desktop/components/SaveShortcutListener.tsx
@@ -1,5 +1,5 @@
-import { useSaveShortcut } from '@app/hooks/useSaveShortcut';
-import { useExitWarning } from '@app/hooks/useExitWarning';
+import { useSaveShortcut } from "@app/hooks/useSaveShortcut";
+import { useExitWarning } from "@app/hooks/useExitWarning";
 
 /**
  * Desktop-only component that sets up keyboard shortcuts and exit warnings
diff --git a/frontend/src/desktop/components/SetupWizard/DesktopAuthLayout.tsx b/frontend/src/desktop/components/SetupWizard/DesktopAuthLayout.tsx
index 92558857b4..44d145ed0d 100644
--- a/frontend/src/desktop/components/SetupWizard/DesktopAuthLayout.tsx
+++ b/frontend/src/desktop/components/SetupWizard/DesktopAuthLayout.tsx
@@ -1,33 +1,43 @@
-import React, { useEffect, useMemo, useRef, useState } from 'react';
-import { useTranslation } from 'react-i18next';
-import LoginRightCarousel from '@app/components/shared/LoginRightCarousel';
-import buildLoginSlides from '@app/components/shared/loginSlides';
-import styles from '@app/routes/authShared/AuthLayout.module.css';
-import { useLogoVariant } from '@app/hooks/useLogoVariant';
+import React, { useEffect, useMemo, useRef, useState } from "react";
+import { useTranslation } from "react-i18next";
+import LoginRightCarousel from "@app/components/shared/LoginRightCarousel";
+import buildLoginSlides from "@app/components/shared/loginSlides";
+import styles from "@app/routes/authShared/AuthLayout.module.css";
+import { useLogoVariant } from "@app/hooks/useLogoVariant";
 
 interface DesktopAuthLayoutProps {
   children: React.ReactNode;
 }
 
-export const DesktopAuthLayout: React.FC<DesktopAuthLayoutProps> = ({ children }) => {
+export const DesktopAuthLayout: React.FC<DesktopAuthLayoutProps> = ({
+  children,
+}) => {
   const { t } = useTranslation();
   const cardRef = useRef<HTMLDivElement | null>(null);
   const [hideRightPanel, setHideRightPanel] = useState(false);
   const logoVariant = useLogoVariant();
-  const imageSlides = useMemo(() => buildLoginSlides(logoVariant, t), [logoVariant, t]);
+  const imageSlides = useMemo(
+    () => buildLoginSlides(logoVariant, t),
+    [logoVariant, t],
+  );
 
   // Force light mode on auth pages
   useEffect(() => {
     const htmlElement = document.documentElement;
-    const previousColorScheme = htmlElement.getAttribute('data-mantine-color-scheme');
+    const previousColorScheme = htmlElement.getAttribute(
+      "data-mantine-color-scheme",
+    );
 
     // Set light mode
-    htmlElement.setAttribute('data-mantine-color-scheme', 'light');
+    htmlElement.setAttribute("data-mantine-color-scheme", "light");
 
     // Cleanup: restore previous theme when leaving auth pages
     return () => {
       if (previousColorScheme) {
-        htmlElement.setAttribute('data-mantine-color-scheme', previousColorScheme);
+        htmlElement.setAttribute(
+          "data-mantine-color-scheme",
+          previousColorScheme,
+        );
       }
     };
   }, []);
@@ -44,11 +54,11 @@ export const DesktopAuthLayout: React.FC<DesktopAuthLayoutProps> = ({ children }
       setHideRightPanel(tooNarrow || tooShort);
     };
     update();
-    window.addEventListener('resize', update);
-    window.addEventListener('orientationchange', update);
+    window.addEventListener("resize", update);
+    window.addEventListener("orientationchange", update);
     return () => {
-      window.removeEventListener('resize', update);
-      window.removeEventListener('orientationchange', update);
+      window.removeEventListener("resize", update);
+      window.removeEventListener("orientationchange", update);
     };
   }, []);
 
@@ -56,15 +66,17 @@ export const DesktopAuthLayout: React.FC<DesktopAuthLayoutProps> = ({ children }
     <div className={styles.authContainer}>
       <div
         ref={cardRef}
-        className={`${styles.authCard} ${!hideRightPanel ? styles.authCardTwoColumns : ''}`}
+        className={`${styles.authCard} ${!hideRightPanel ? styles.authCardTwoColumns : ""}`}
       >
         <div className={styles.authLeftPanel}>
-          <div className={styles.authContent}>
-            {children}
-          </div>
+          <div className={styles.authContent}>{children}</div>
         </div>
         {!hideRightPanel && (
-          <LoginRightCarousel imageSlides={imageSlides} initialSeconds={5} slideSeconds={8} />
+          <LoginRightCarousel
+            imageSlides={imageSlides}
+            initialSeconds={5}
+            slideSeconds={8}
+          />
         )}
       </div>
     </div>
diff --git a/frontend/src/desktop/components/SetupWizard/DesktopOAuthButtons.tsx b/frontend/src/desktop/components/SetupWizard/DesktopOAuthButtons.tsx
index 72b78be835..02d4d2008d 100644
--- a/frontend/src/desktop/components/SetupWizard/DesktopOAuthButtons.tsx
+++ b/frontend/src/desktop/components/SetupWizard/DesktopOAuthButtons.tsx
@@ -1,12 +1,18 @@
-import React, { useState } from 'react';
-import { useTranslation } from 'react-i18next';
-import { authService, UserInfo } from '@app/services/authService';
-import { buildOAuthCallbackHtml } from '@app/utils/oauthCallbackHtml';
-import { BASE_PATH } from '@app/constants/app';
-import { STIRLING_SAAS_URL } from '@app/constants/connection';
-import '@app/components/SetupWizard/desktopOAuth.css';
+import React, { useState } from "react";
+import { useTranslation } from "react-i18next";
+import { authService, UserInfo } from "@app/services/authService";
+import { buildOAuthCallbackHtml } from "@app/utils/oauthCallbackHtml";
+import { BASE_PATH } from "@app/constants/app";
+import { STIRLING_SAAS_URL } from "@app/constants/connection";
+import "@app/components/SetupWizard/desktopOAuth.css";
 
-type KnownProviderId = 'google' | 'github' | 'keycloak' | 'azure' | 'apple' | 'oidc';
+type KnownProviderId =
+  | "google"
+  | "github"
+  | "keycloak"
+  | "azure"
+  | "apple"
+  | "oidc";
 export type OAuthProviderId = KnownProviderId | string;
 
 export interface DesktopSSOProvider {
@@ -21,7 +27,7 @@ interface DesktopOAuthButtonsProps {
   isDisabled: boolean;
   serverUrl: string;
   providers: DesktopSSOProvider[];
-  mode?: 'saas' | 'selfHosted';
+  mode?: "saas" | "selfHosted";
 }
 
 export const DesktopOAuthButtons: React.FC<DesktopOAuthButtonsProps> = ({
@@ -30,7 +36,7 @@ export const DesktopOAuthButtons: React.FC<DesktopOAuthButtonsProps> = ({
   isDisabled,
   serverUrl,
   providers,
-  mode = 'saas',
+  mode = "saas",
 }) => {
   const { t } = useTranslation();
   const [oauthLoading, setOauthLoading] = useState(false);
@@ -46,56 +52,80 @@ export const DesktopOAuthButtons: React.FC<DesktopOAuthButtonsProps> = ({
 
       // Build callback page HTML with translations and dark mode support
       const successHtml = buildOAuthCallbackHtml({
-        title: t('oauth.success.title', 'Authentication Successful'),
-        message: t('oauth.success.message', 'You can close this window and return to Stirling PDF.'),
+        title: t("oauth.success.title", "Authentication Successful"),
+        message: t(
+          "oauth.success.message",
+          "You can close this window and return to Stirling PDF.",
+        ),
         isError: false,
       });
 
       const errorHtml = buildOAuthCallbackHtml({
-        title: t('oauth.error.title', 'Authentication Failed'),
-        message: t('oauth.error.message', 'Authentication was not successful. You can close this window and try again.'),
+        title: t("oauth.error.title", "Authentication Failed"),
+        message: t(
+          "oauth.error.message",
+          "Authentication was not successful. You can close this window and try again.",
+        ),
         isError: true,
         errorPlaceholder: true, // {error} will be replaced by Rust
       });
 
-      const normalizedServer = serverUrl.replace(/\/+$/, '');
+      const normalizedServer = serverUrl.replace(/\/+$/, "");
       const usingSupabaseFlow =
-        mode === 'saas' || normalizedServer === STIRLING_SAAS_URL.replace(/\/+$/, '');
+        mode === "saas" ||
+        normalizedServer === STIRLING_SAAS_URL.replace(/\/+$/, "");
       const userInfo = usingSupabaseFlow
-        ? await authService.loginWithOAuth(provider.id, serverUrl, successHtml, errorHtml)
-        : await authService.loginWithSelfHostedOAuth(provider.path || provider.id, serverUrl);
+        ? await authService.loginWithOAuth(
+            provider.id,
+            serverUrl,
+            successHtml,
+            errorHtml,
+          )
+        : await authService.loginWithSelfHostedOAuth(
+            provider.path || provider.id,
+            serverUrl,
+          );
 
       // Call the onOAuthSuccess callback to complete setup
       await onOAuthSuccess(userInfo);
     } catch (error) {
-      console.error('OAuth login failed:', error);
+      console.error("OAuth login failed:", error);
 
-      const errorMessage = error instanceof Error
-        ? error.message
-        : t('setup.login.error.oauthFailed', 'OAuth login failed. Please try again.');
+      const errorMessage =
+        error instanceof Error
+          ? error.message
+          : t(
+              "setup.login.error.oauthFailed",
+              "OAuth login failed. Please try again.",
+            );
 
       onError(errorMessage);
       setOauthLoading(false);
     }
   };
 
-  const providerConfig: Record<KnownProviderId, { label: string; file: string }> = {
-    google: { label: 'Google', file: 'google.svg' },
-    github: { label: 'GitHub', file: 'github.svg' },
-    keycloak: { label: 'Keycloak', file: 'keycloak.svg' },
-    azure: { label: 'Microsoft', file: 'microsoft.svg' },
-    apple: { label: 'Apple', file: 'apple.svg' },
-    oidc: { label: 'OpenID', file: 'oidc.svg' },
+  const providerConfig: Record<
+    KnownProviderId,
+    { label: string; file: string }
+  > = {
+    google: { label: "Google", file: "google.svg" },
+    github: { label: "GitHub", file: "github.svg" },
+    keycloak: { label: "Keycloak", file: "keycloak.svg" },
+    azure: { label: "Microsoft", file: "microsoft.svg" },
+    apple: { label: "Apple", file: "apple.svg" },
+    oidc: { label: "OpenID", file: "oidc.svg" },
   };
   const isKnownProvider = (id: OAuthProviderId): id is KnownProviderId =>
     (id as KnownProviderId) in providerConfig;
-  const GENERIC_PROVIDER_ICON = 'oidc.svg';
+  const GENERIC_PROVIDER_ICON = "oidc.svg";
 
-  console.log('[DesktopOAuthButtons] Received providers:', providers);
-  console.log('[DesktopOAuthButtons] Mode:', mode, 'Server URL:', serverUrl);
+  console.log("[DesktopOAuthButtons] Received providers:", providers);
+  console.log("[DesktopOAuthButtons] Mode:", mode, "Server URL:", serverUrl);
 
   if (providers.length === 0) {
-    console.warn('[DesktopOAuthButtons] No providers to display, returning null');
+    console.warn(
+      "[DesktopOAuthButtons] No providers to display, returning null",
+    );
     return null;
   }
 
@@ -103,7 +133,10 @@ export const DesktopOAuthButtons: React.FC<DesktopOAuthButtonsProps> = ({
   return (
     <div className="oauth-container-vertical-desktop">
       {providers
-        .filter((providerConfigEntry) => providerConfigEntry && providerConfigEntry.id)
+        .filter(
+          (providerConfigEntry) =>
+            providerConfigEntry && providerConfigEntry.id,
+        )
         .map((providerEntry) => {
           const iconConfig = isKnownProvider(providerEntry.id)
             ? providerConfig[providerEntry.id]
@@ -112,8 +145,9 @@ export const DesktopOAuthButtons: React.FC<DesktopOAuthButtonsProps> = ({
             providerEntry.label ||
             iconConfig?.label ||
             (providerEntry.id
-              ? providerEntry.id.charAt(0).toUpperCase() + providerEntry.id.slice(1)
-              : t('setup.login.sso', 'Single Sign-On'));
+              ? providerEntry.id.charAt(0).toUpperCase() +
+                providerEntry.id.slice(1)
+              : t("setup.login.sso", "Single Sign-On"));
           return (
             <button
               key={providerEntry.id}
@@ -136,8 +170,18 @@ export const DesktopOAuthButtons: React.FC<DesktopOAuthButtonsProps> = ({
           );
         })}
       {oauthLoading && (
-        <p style={{ margin: '0.5rem 0', fontSize: '0.875rem', color: '#6b7280', textAlign: 'center' }}>
-          {t('setup.login.oauthPending', 'Opening browser for authentication...')}
+        <p
+          style={{
+            margin: "0.5rem 0",
+            fontSize: "0.875rem",
+            color: "#6b7280",
+            textAlign: "center",
+          }}
+        >
+          {t(
+            "setup.login.oauthPending",
+            "Opening browser for authentication...",
+          )}
         </p>
       )}
     </div>
diff --git a/frontend/src/desktop/components/SetupWizard/SaaSLoginScreen.tsx b/frontend/src/desktop/components/SetupWizard/SaaSLoginScreen.tsx
index 2dc749548c..3c02362b76 100644
--- a/frontend/src/desktop/components/SetupWizard/SaaSLoginScreen.tsx
+++ b/frontend/src/desktop/components/SetupWizard/SaaSLoginScreen.tsx
@@ -1,13 +1,13 @@
-import React, { useState } from 'react';
-import { useTranslation } from 'react-i18next';
-import LoginHeader from '@app/routes/login/LoginHeader';
-import ErrorMessage from '@app/routes/login/ErrorMessage';
-import EmailPasswordForm from '@app/routes/login/EmailPasswordForm';
-import DividerWithText from '@app/components/shared/DividerWithText';
-import { DesktopOAuthButtons } from '@app/components/SetupWizard/DesktopOAuthButtons';
-import { SelfHostedLink } from '@app/components/SetupWizard/SelfHostedLink';
-import { UserInfo } from '@app/services/authService';
-import '@app/routes/authShared/auth.css';
+import React, { useState } from "react";
+import { useTranslation } from "react-i18next";
+import LoginHeader from "@app/routes/login/LoginHeader";
+import ErrorMessage from "@app/routes/login/ErrorMessage";
+import EmailPasswordForm from "@app/routes/login/EmailPasswordForm";
+import DividerWithText from "@app/components/shared/DividerWithText";
+import { DesktopOAuthButtons } from "@app/components/SetupWizard/DesktopOAuthButtons";
+import { SelfHostedLink } from "@app/components/SetupWizard/SelfHostedLink";
+import { UserInfo } from "@app/services/authService";
+import "@app/routes/authShared/auth.css";
 
 interface SaaSLoginScreenProps {
   serverUrl: string;
@@ -33,19 +33,23 @@ export const SaaSLoginScreen: React.FC<SaaSLoginScreenProps> = ({
   error,
 }) => {
   const { t } = useTranslation();
-  const [email, setEmail] = useState('');
-  const [password, setPassword] = useState('');
+  const [email, setEmail] = useState("");
+  const [password, setPassword] = useState("");
   const [validationError, setValidationError] = useState<string | null>(null);
 
   const handleEmailPasswordSubmit = async () => {
     // Validation
     if (!email.trim()) {
-      setValidationError(t('setup.login.error.emptyEmail', 'Please enter your email'));
+      setValidationError(
+        t("setup.login.error.emptyEmail", "Please enter your email"),
+      );
       return;
     }
 
     if (!password) {
-      setValidationError(t('setup.login.error.emptyPassword', 'Please enter your password'));
+      setValidationError(
+        t("setup.login.error.emptyPassword", "Please enter your password"),
+      );
       return;
     }
 
@@ -61,7 +65,10 @@ export const SaaSLoginScreen: React.FC<SaaSLoginScreenProps> = ({
 
   return (
     <>
-      <LoginHeader title={t('setup.saas.title', 'Sign in to Stirling Cloud')} onClose={onClose} />
+      <LoginHeader
+        title={t("setup.saas.title", "Sign in to Stirling Cloud")}
+        onClose={onClose}
+      />
 
       <ErrorMessage error={displayError} />
 
@@ -71,14 +78,11 @@ export const SaaSLoginScreen: React.FC<SaaSLoginScreenProps> = ({
         isDisabled={loading}
         serverUrl={serverUrl}
         mode="saas"
-        providers={[
-          { id: 'google' },
-          { id: 'github' },
-        ]}
+        providers={[{ id: "google" }, { id: "github" }]}
       />
 
       <DividerWithText
-        text={t('setup.login.orContinueWith', 'Or continue with email')}
+        text={t("setup.login.orContinueWith", "Or continue with email")}
         respondsToDarkMode={false}
         opacity={0.4}
       />
@@ -96,10 +100,13 @@ export const SaaSLoginScreen: React.FC<SaaSLoginScreenProps> = ({
         }}
         onSubmit={handleEmailPasswordSubmit}
         isSubmitting={loading}
-        submitButtonText={t('setup.login.submit', 'Login')}
+        submitButtonText={t("setup.login.submit", "Login")}
       />
 
-      <div className="navigation-link-container" style={{ marginTop: '0.5rem', textAlign: 'right' }}>
+      <div
+        className="navigation-link-container"
+        style={{ marginTop: "0.5rem", textAlign: "right" }}
+      >
         <button
           type="button"
           onClick={() => {
@@ -109,21 +116,24 @@ export const SaaSLoginScreen: React.FC<SaaSLoginScreenProps> = ({
           className="navigation-link-button"
           disabled={loading}
         >
-          {t('signup.signUp', 'Sign Up')}
+          {t("signup.signUp", "Sign Up")}
         </button>
       </div>
 
       <SelfHostedLink onClick={onSelfHostedClick} disabled={loading} />
 
       {onSkipSignIn && (
-        <div className="navigation-link-container" style={{ marginTop: '0.5rem', textAlign: 'center' }}>
+        <div
+          className="navigation-link-container"
+          style={{ marginTop: "0.5rem", textAlign: "center" }}
+        >
           <button
             type="button"
             onClick={onSkipSignIn}
             className="navigation-link-button"
             disabled={loading}
           >
-            {t('setup.login.skipSignIn', 'Continue without signing in')}
+            {t("setup.login.skipSignIn", "Continue without signing in")}
           </button>
         </div>
       )}
diff --git a/frontend/src/desktop/components/SetupWizard/SaaSSignupScreen.tsx b/frontend/src/desktop/components/SetupWizard/SaaSSignupScreen.tsx
index 6ad3309261..e13406f40c 100644
--- a/frontend/src/desktop/components/SetupWizard/SaaSSignupScreen.tsx
+++ b/frontend/src/desktop/components/SetupWizard/SaaSSignupScreen.tsx
@@ -1,11 +1,14 @@
-import React, { useState } from 'react';
-import { useTranslation } from 'react-i18next';
-import LoginHeader from '@app/routes/login/LoginHeader';
-import ErrorMessage from '@app/routes/login/ErrorMessage';
-import SignupForm from '@app/routes/signup/SignupForm';
-import { useSignupFormValidation, SignupFieldErrors } from '@app/routes/signup/SignupFormValidation';
-import { authService } from '@app/services/authService';
-import '@app/routes/authShared/auth.css';
+import React, { useState } from "react";
+import { useTranslation } from "react-i18next";
+import LoginHeader from "@app/routes/login/LoginHeader";
+import ErrorMessage from "@app/routes/login/ErrorMessage";
+import SignupForm from "@app/routes/signup/SignupForm";
+import {
+  useSignupFormValidation,
+  SignupFieldErrors,
+} from "@app/routes/signup/SignupFormValidation";
+import { authService } from "@app/services/authService";
+import "@app/routes/authShared/auth.css";
 
 interface SaaSSignupScreenProps {
   loading: boolean;
@@ -21,12 +24,16 @@ export const SaaSSignupScreen: React.FC<SaaSSignupScreenProps> = ({
   onSwitchToLogin: _onSwitchToLogin,
 }) => {
   const { t } = useTranslation();
-  const [email, setEmail] = useState('');
-  const [password, setPassword] = useState('');
-  const [confirmPassword, setConfirmPassword] = useState('');
+  const [email, setEmail] = useState("");
+  const [password, setPassword] = useState("");
+  const [confirmPassword, setConfirmPassword] = useState("");
   const [validationError, setValidationError] = useState<string | null>(null);
-  const [signupFieldErrors, setSignupFieldErrors] = useState<SignupFieldErrors>({});
-  const [signupSuccessMessage, setSignupSuccessMessage] = useState<string | null>(null);
+  const [signupFieldErrors, setSignupFieldErrors] = useState<SignupFieldErrors>(
+    {},
+  );
+  const [signupSuccessMessage, setSignupSuccessMessage] = useState<
+    string | null
+  >(null);
   const [isSignupSubmitting, setIsSignupSubmitting] = useState(false);
   const { validateSignupForm } = useSignupFormValidation();
 
@@ -47,12 +54,20 @@ export const SaaSSignupScreen: React.FC<SaaSSignupScreenProps> = ({
     try {
       setIsSignupSubmitting(true);
       await authService.signUpSaas(email.trim(), password);
-      setSignupSuccessMessage(t('signup.checkEmailConfirmation', 'Check your email for a confirmation link to complete your registration.'));
+      setSignupSuccessMessage(
+        t(
+          "signup.checkEmailConfirmation",
+          "Check your email for a confirmation link to complete your registration.",
+        ),
+      );
       setSignupFieldErrors({});
       setValidationError(null);
     } catch (err) {
       setSignupSuccessMessage(null);
-      const message = err instanceof Error ? err.message : t('signup.unexpectedError', { message: 'Unknown error' });
+      const message =
+        err instanceof Error
+          ? err.message
+          : t("signup.unexpectedError", { message: "Unknown error" });
       setValidationError(message);
     } finally {
       setIsSignupSubmitting(false);
@@ -62,8 +77,8 @@ export const SaaSSignupScreen: React.FC<SaaSSignupScreenProps> = ({
   return (
     <>
       <LoginHeader
-        title={t('signup.title', 'Create an account')}
-        subtitle={t('signup.subtitle', 'Join Stirling PDF')}
+        title={t("signup.title", "Create an account")}
+        subtitle={t("signup.subtitle", "Join Stirling PDF")}
       />
 
       <ErrorMessage error={displayError} />
@@ -98,7 +113,6 @@ export const SaaSSignupScreen: React.FC<SaaSSignupScreenProps> = ({
         showName={false}
         showTerms={false}
       />
-
     </>
   );
 };
diff --git a/frontend/src/desktop/components/SetupWizard/SelfHostedLink.tsx b/frontend/src/desktop/components/SetupWizard/SelfHostedLink.tsx
index 6a184cc584..1ef652a310 100644
--- a/frontend/src/desktop/components/SetupWizard/SelfHostedLink.tsx
+++ b/frontend/src/desktop/components/SetupWizard/SelfHostedLink.tsx
@@ -1,24 +1,27 @@
-import React from 'react';
-import { useTranslation } from 'react-i18next';
-import '@app/routes/authShared/auth.css';
+import React from "react";
+import { useTranslation } from "react-i18next";
+import "@app/routes/authShared/auth.css";
 
 interface SelfHostedLinkProps {
   onClick: () => void;
   disabled?: boolean;
 }
 
-export const SelfHostedLink: React.FC<SelfHostedLinkProps> = ({ onClick, disabled = false }) => {
+export const SelfHostedLink: React.FC<SelfHostedLinkProps> = ({
+  onClick,
+  disabled = false,
+}) => {
   const { t } = useTranslation();
 
   return (
-    <div className="navigation-link-container" style={{ marginTop: '1.5rem' }}>
+    <div className="navigation-link-container" style={{ marginTop: "1.5rem" }}>
       <button
         type="button"
         onClick={onClick}
         disabled={disabled}
         className="navigation-link-button"
       >
-        {t('setup.selfhosted.link', 'or connect to a self hosted account')}
+        {t("setup.selfhosted.link", "or connect to a self hosted account")}
       </button>
     </div>
   );
diff --git a/frontend/src/desktop/components/SetupWizard/SelfHostedLoginScreen.tsx b/frontend/src/desktop/components/SetupWizard/SelfHostedLoginScreen.tsx
index 03e653a773..db4ca7cc51 100644
--- a/frontend/src/desktop/components/SetupWizard/SelfHostedLoginScreen.tsx
+++ b/frontend/src/desktop/components/SetupWizard/SelfHostedLoginScreen.tsx
@@ -1,14 +1,14 @@
-import React, { useState } from 'react';
-import { useTranslation } from 'react-i18next';
-import { Text } from '@mantine/core';
-import LoginHeader from '@app/routes/login/LoginHeader';
-import ErrorMessage from '@app/routes/login/ErrorMessage';
-import EmailPasswordForm from '@app/routes/login/EmailPasswordForm';
-import DividerWithText from '@app/components/shared/DividerWithText';
-import { DesktopOAuthButtons } from '@app/components/SetupWizard/DesktopOAuthButtons';
-import { UserInfo } from '@app/services/authService';
-import { SSOProviderConfig } from '@app/services/connectionModeService';
-import '@app/routes/authShared/auth.css';
+import React, { useState } from "react";
+import { useTranslation } from "react-i18next";
+import { Text } from "@mantine/core";
+import LoginHeader from "@app/routes/login/LoginHeader";
+import ErrorMessage from "@app/routes/login/ErrorMessage";
+import EmailPasswordForm from "@app/routes/login/EmailPasswordForm";
+import DividerWithText from "@app/components/shared/DividerWithText";
+import { DesktopOAuthButtons } from "@app/components/SetupWizard/DesktopOAuthButtons";
+import { UserInfo } from "@app/services/authService";
+import { SSOProviderConfig } from "@app/services/connectionModeService";
+import "@app/routes/authShared/auth.css";
 
 interface SelfHostedLoginScreenProps {
   serverUrl: string;
@@ -26,7 +26,7 @@ interface SelfHostedLoginScreenProps {
 export const SelfHostedLoginScreen: React.FC<SelfHostedLoginScreenProps> = ({
   serverUrl,
   enabledOAuthProviders,
-  loginMethod = 'all',
+  loginMethod = "all",
   onLogin,
   onOAuthSuccess,
   mfaCode,
@@ -36,35 +36,41 @@ export const SelfHostedLoginScreen: React.FC<SelfHostedLoginScreenProps> = ({
   error,
 }) => {
   const { t } = useTranslation();
-  const [username, setUsername] = useState('');
-  const [password, setPassword] = useState('');
+  const [username, setUsername] = useState("");
+  const [password, setPassword] = useState("");
   const [validationError, setValidationError] = useState<string | null>(null);
 
   // Check if username/password authentication is allowed
-  const isUserPassAllowed = loginMethod === 'all' || loginMethod === 'normal';
+  const isUserPassAllowed = loginMethod === "all" || loginMethod === "normal";
 
-  console.log('[SelfHostedLoginScreen] Props:', {
+  console.log("[SelfHostedLoginScreen] Props:", {
     serverUrl,
     enabledOAuthProviders,
     loginMethod,
     isUserPassAllowed,
-    shouldShowOAuth: !!(enabledOAuthProviders && enabledOAuthProviders.length > 0)
+    shouldShowOAuth: !!(
+      enabledOAuthProviders && enabledOAuthProviders.length > 0
+    ),
   });
 
   const handleSubmit = async () => {
     // Validation
     if (!username.trim()) {
-      setValidationError(t('setup.login.error.emptyUsername', 'Please enter your username'));
+      setValidationError(
+        t("setup.login.error.emptyUsername", "Please enter your username"),
+      );
       return;
     }
 
     if (!password) {
-      setValidationError(t('setup.login.error.emptyPassword', 'Please enter your password'));
+      setValidationError(
+        t("setup.login.error.emptyPassword", "Please enter your password"),
+      );
       return;
     }
 
     if (requiresMfa && !mfaCode.trim()) {
-      setValidationError(t('login.mfaRequired', 'Two-factor code required'));
+      setValidationError(t("login.mfaRequired", "Two-factor code required"));
       return;
     }
 
@@ -81,14 +87,21 @@ export const SelfHostedLoginScreen: React.FC<SelfHostedLoginScreenProps> = ({
   return (
     <>
       <LoginHeader
-        title={t('setup.selfhosted.title', 'Sign in to Server')}
-        subtitle={isUserPassAllowed ? t('setup.selfhosted.subtitle', 'Enter your server credentials') : undefined}
+        title={t("setup.selfhosted.title", "Sign in to Server")}
+        subtitle={
+          isUserPassAllowed
+            ? t("setup.selfhosted.subtitle", "Enter your server credentials")
+            : undefined
+        }
       />
 
       <ErrorMessage error={displayError} />
 
       <Text size="sm" mb="md">
-        {t('setup.login.connectingTo', 'Connecting to:')} <Text span fw="500">{serverUrl}</Text>
+        {t("setup.login.connectingTo", "Connecting to:")}{" "}
+        <Text span fw="500">
+          {serverUrl}
+        </Text>
       </Text>
 
       {/* Show OAuth buttons if providers are available */}
@@ -106,7 +119,7 @@ export const SelfHostedLoginScreen: React.FC<SelfHostedLoginScreenProps> = ({
           {/* Only show divider if username/password auth is also allowed */}
           {isUserPassAllowed && (
             <DividerWithText
-              text={t('setup.login.orContinueWith', 'Or continue with email')}
+              text={t("setup.login.orContinueWith", "Or continue with email")}
               respondsToDarkMode={false}
               opacity={0.4}
             />
@@ -136,7 +149,7 @@ export const SelfHostedLoginScreen: React.FC<SelfHostedLoginScreenProps> = ({
           requiresMfa={requiresMfa}
           onSubmit={handleSubmit}
           isSubmitting={loading}
-          submitButtonText={t('setup.login.submit', 'Login')}
+          submitButtonText={t("setup.login.submit", "Login")}
         />
       )}
     </>
diff --git a/frontend/src/desktop/components/SetupWizard/ServerSelection.tsx b/frontend/src/desktop/components/SetupWizard/ServerSelection.tsx
index aa065a1284..10746a66ea 100644
--- a/frontend/src/desktop/components/SetupWizard/ServerSelection.tsx
+++ b/frontend/src/desktop/components/SetupWizard/ServerSelection.tsx
@@ -1,52 +1,63 @@
-import React, { useState } from 'react';
-import { Stack, Button, TextInput, Alert, Text } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { ServerConfig, SSOProviderConfig } from '@app/services/connectionModeService';
-import { connectionModeService } from '@app/services/connectionModeService';
-import LocalIcon from '@app/components/shared/LocalIcon';
+import React, { useState } from "react";
+import { Stack, Button, TextInput, Alert, Text } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import {
+  ServerConfig,
+  SSOProviderConfig,
+} from "@app/services/connectionModeService";
+import { connectionModeService } from "@app/services/connectionModeService";
+import LocalIcon from "@app/components/shared/LocalIcon";
 
 interface ServerSelectionProps {
   onSelect: (config: ServerConfig) => void;
   loading: boolean;
 }
 
-export const ServerSelection: React.FC<ServerSelectionProps> = ({ onSelect, loading }) => {
+export const ServerSelection: React.FC<ServerSelectionProps> = ({
+  onSelect,
+  loading,
+}) => {
   const { t } = useTranslation();
-  const [customUrl, setCustomUrl] = useState('');
+  const [customUrl, setCustomUrl] = useState("");
   const [testing, setTesting] = useState(false);
   const [testError, setTestError] = useState<string | null>(null);
   const [securityDisabled, setSecurityDisabled] = useState(false);
-  const serverUrl = localStorage.getItem('server_url') || '';
-
-  const handleSubmit = async (e: React.FormEvent) => {
-    e.preventDefault();
+  const serverUrl = localStorage.getItem("server_url") || "";
 
+  const submitServerUrl = async () => {
     // Normalize and validate URL
-    let url = customUrl.trim().replace(/\/+$/, '') || serverUrl;
+    let url = customUrl.trim().replace(/\/+$/, "") || serverUrl;
 
     if (!url) {
-      setTestError(t('setup.server.error.emptyUrl', 'Please enter a server URL'));
+      setTestError(
+        t("setup.server.error.emptyUrl", "Please enter a server URL"),
+      );
       return;
     }
 
     // Auto-add https:// if no protocol specified
-    if (!url.startsWith('http://') && !url.startsWith('https://')) {
-      console.log('[ServerSelection] No protocol specified, adding https://');
+    if (!url.startsWith("http://") && !url.startsWith("https://")) {
+      console.log("[ServerSelection] No protocol specified, adding https://");
       url = `https://${url}`;
       setCustomUrl(url); // Update the input field
     }
     // Validate URL format
     try {
       const urlObj = new URL(url);
-      console.log('[ServerSelection] Valid URL:', {
+      console.log("[ServerSelection] Valid URL:", {
         protocol: urlObj.protocol,
         hostname: urlObj.hostname,
         port: urlObj.port,
         pathname: urlObj.pathname,
       });
     } catch (err) {
-      console.error('[ServerSelection] Invalid URL format:', err);
-      setTestError(t('setup.server.error.invalidUrl', 'Invalid URL format. Please enter a valid URL like https://your-server.com'));
+      console.error("[ServerSelection] Invalid URL format:", err);
+      setTestError(
+        t(
+          "setup.server.error.invalidUrl",
+          "Invalid URL format. Please enter a valid URL like https://your-server.com",
+        ),
+      );
       return;
     }
 
@@ -61,115 +72,168 @@ export const ServerSelection: React.FC<ServerSelectionProps> = ({ onSelect, load
       const testResult = await connectionModeService.testConnection(url);
 
       if (!testResult.success) {
-        console.error('[ServerSelection] Connection test failed:', testResult);
-        setTestError(testResult.error || t('setup.server.error.unreachable', 'Could not connect to server'));
+        console.error("[ServerSelection] Connection test failed:", testResult);
+        setTestError(
+          testResult.error ||
+            t("setup.server.error.unreachable", "Could not connect to server"),
+        );
         setTesting(false);
         return;
       }
 
-      console.log('[ServerSelection] ✅ Connection test successful');
+      console.log("[ServerSelection] ✅ Connection test successful");
 
       // Fetch OAuth providers and check if login is enabled
       const enabledProviders: SSOProviderConfig[] = [];
-      let loginMethod = 'all'; // Default to 'all' (allows both SSO and username/password)
+      let loginMethod = "all"; // Default to 'all' (allows both SSO and username/password)
       try {
-        console.log('[ServerSelection] Fetching login configuration...');
+        console.log("[ServerSelection] Fetching login configuration...");
         const response = await fetch(`${url}/api/v1/proprietary/ui-data/login`);
 
         // Check if security is disabled (status 403, 401, or 404 - endpoint doesn't exist)
         if (!response.ok) {
-          console.warn(`[ServerSelection] Login config request failed with status ${response.status}`);
+          console.warn(
+            `[ServerSelection] Login config request failed with status ${response.status}`,
+          );
 
-          if (response.status === 403 || response.status === 401 || response.status === 404) {
-            console.log('[ServerSelection] Security/SSO not configured on this server (or endpoint does not exist)');
+          if (
+            response.status === 403 ||
+            response.status === 401 ||
+            response.status === 404
+          ) {
+            console.log(
+              "[ServerSelection] Security/SSO not configured on this server (or endpoint does not exist)",
+            );
             setSecurityDisabled(true);
             setTesting(false);
             return;
           }
           // Other error statuses - show generic error
           setTestError(
-            t('setup.server.error.configFetch', 'Failed to fetch server configuration (status {{status}})', {
-              status: response.status
-            })
+            t(
+              "setup.server.error.configFetch",
+              "Failed to fetch server configuration (status {{status}})",
+              {
+                status: response.status,
+              },
+            ),
           );
           setTesting(false);
           return;
         }
 
         const data = await response.json();
-        console.log('[ServerSelection] Login UI data:', data);
+        console.log("[ServerSelection] Login UI data:", data);
 
         // Check if the response indicates security is disabled
         if (data.enableLogin === false || data.securityEnabled === false) {
-          console.log('[ServerSelection] Security is explicitly disabled in config');
+          console.log(
+            "[ServerSelection] Security is explicitly disabled in config",
+          );
           setSecurityDisabled(true);
           setTesting(false);
           return;
         }
 
         // Extract loginMethod from response
-        loginMethod = data.loginMethod || 'all';
-        console.log('[ServerSelection] Login method:', loginMethod);
+        loginMethod = data.loginMethod || "all";
+        console.log("[ServerSelection] Login method:", loginMethod);
 
         // Extract provider IDs from authorization URLs
         // Example: "/oauth2/authorization/google" → "google"
         const providerEntries = Object.entries(data.providerList || {});
-        console.log('[ServerSelection] providerList from API:', data.providerList);
+        console.log(
+          "[ServerSelection] providerList from API:",
+          data.providerList,
+        );
         providerEntries.forEach(([path, label]) => {
-          const id = path.split('/').pop();
-          console.log('[ServerSelection] Processing provider path:', path, '→ id:', id);
+          const id = path.split("/").pop();
+          console.log(
+            "[ServerSelection] Processing provider path:",
+            path,
+            "→ id:",
+            id,
+          );
           if (!id) {
-            console.warn('[ServerSelection] Skipping provider with empty id:', path);
+            console.warn(
+              "[ServerSelection] Skipping provider with empty id:",
+              path,
+            );
             return;
           }
 
           enabledProviders.push({
             id,
             path,
-            label: typeof label === 'string' ? label : undefined,
+            label: typeof label === "string" ? label : undefined,
           });
         });
 
-        console.log('[ServerSelection] ✅ Detected OAuth providers:', enabledProviders);
-        console.log('[ServerSelection] Login method:', loginMethod);
+        console.log(
+          "[ServerSelection] ✅ Detected OAuth providers:",
+          enabledProviders,
+        );
+        console.log("[ServerSelection] Login method:", loginMethod);
       } catch (err) {
-        console.error('[ServerSelection] � Failed to fetch login configuration:', err);
+        console.error(
+          "[ServerSelection] � Failed to fetch login configuration:",
+          err,
+        );
 
         // Check if it's a security disabled error
-        if (err instanceof Error && (err.message.includes('403') || err.message.includes('401'))) {
-          console.log('[ServerSelection] Security is disabled (error-based detection)');
+        if (
+          err instanceof Error &&
+          (err.message.includes("403") || err.message.includes("401"))
+        ) {
+          console.log(
+            "[ServerSelection] Security is disabled (error-based detection)",
+          );
           setSecurityDisabled(true);
           setTesting(false);
           return;
         }
 
         // For any other error (network, CORS, invalid JSON, etc.), show error and don't proceed
-        const errorMessage = err instanceof Error ? err.message : 'Unknown error';
-        console.error('[ServerSelection] Configuration fetch error details:', errorMessage);
+        const errorMessage =
+          err instanceof Error ? err.message : "Unknown error";
+        console.error(
+          "[ServerSelection] Configuration fetch error details:",
+          errorMessage,
+        );
 
         setTestError(
-          t('setup.server.error.configFetchError', 'Failed to fetch server configuration: {{error}}', {
-            error: errorMessage
-          })
+          t(
+            "setup.server.error.configFetchError",
+            "Failed to fetch server configuration: {{error}}",
+            {
+              error: errorMessage,
+            },
+          ),
         );
         setTesting(false);
         return;
       }
 
       // Connection successful — persist URL so it pre-fills on next sign-in
-      localStorage.setItem('server_url', url);
-      console.log('[ServerSelection] ✅ Server selection complete, proceeding to login');
+      localStorage.setItem("server_url", url);
+      console.log(
+        "[ServerSelection] ✅ Server selection complete, proceeding to login",
+      );
       onSelect({
         url,
-        enabledOAuthProviders: enabledProviders.length > 0 ? enabledProviders : undefined,
+        enabledOAuthProviders:
+          enabledProviders.length > 0 ? enabledProviders : undefined,
         loginMethod,
       });
     } catch (error) {
-      console.error('[ServerSelection] � Unexpected error during connection test:', error);
+      console.error(
+        "[ServerSelection] � Unexpected error during connection test:",
+        error,
+      );
       setTestError(
         error instanceof Error
           ? error.message
-          : t('setup.server.error.testFailed', 'Connection test failed')
+          : t("setup.server.error.testFailed", "Connection test failed"),
       );
     } finally {
       setTesting(false);
@@ -177,10 +241,15 @@ export const ServerSelection: React.FC<ServerSelectionProps> = ({ onSelect, load
   };
 
   return (
-    <form onSubmit={handleSubmit}>
+    <form
+      onSubmit={(e) => {
+        e.preventDefault();
+        void submitServerUrl();
+      }}
+    >
       <Stack gap="md">
         <TextInput
-          label={t('setup.server.url.label', 'Server URL')}
+          label={t("setup.server.url.label", "Server URL")}
           placeholder="https://your-server.com"
           value={customUrl}
           onChange={(e) => {
@@ -191,8 +260,8 @@ export const ServerSelection: React.FC<ServerSelectionProps> = ({ onSelect, load
           disabled={loading || testing}
           error={testError}
           description={t(
-            'setup.server.url.description',
-            'Enter the full URL of your self-hosted Stirling PDF server'
+            "setup.server.url.description",
+            "Enter the full URL of your self-hosted Stirling PDF server",
           )}
         />
 
@@ -200,18 +269,45 @@ export const ServerSelection: React.FC<ServerSelectionProps> = ({ onSelect, load
           <Alert
             variant="light"
             color="orange"
-            icon={<LocalIcon icon="warning-rounded" width="1.25rem" height="1.25rem" />}
-            title={t('setup.server.error.securityDisabled.title', 'Login Not Enabled')}
+            icon={
+              <LocalIcon
+                icon="warning-rounded"
+                width="1.25rem"
+                height="1.25rem"
+              />
+            }
+            title={t(
+              "setup.server.error.securityDisabled.title",
+              "Login Not Enabled",
+            )}
           >
             <Stack gap="sm">
               <Text size="sm">
-                {t('setup.server.error.securityDisabled.body', 'This server does not have login enabled. To connect to this server, you must enable authentication:')}
+                {t(
+                  "setup.server.error.securityDisabled.body",
+                  "This server does not have login enabled. To connect to this server, you must enable authentication:",
+                )}
               </Text>
               <Text size="sm" component="div">
-                <ol style={{ margin: 0, paddingLeft: '1.5rem' }}>
-                  <li>{t('setup.server.error.securityDisabled.step1', 'Set DOCKER_ENABLE_SECURITY=true in your environment')}</li>
-                  <li>{t('setup.server.error.securityDisabled.step2', 'Or set security.enableLogin=true in settings.yml')}</li>
-                  <li>{t('setup.server.error.securityDisabled.step3', 'Restart the server')}</li>
+                <ol style={{ margin: 0, paddingLeft: "1.5rem" }}>
+                  <li>
+                    {t(
+                      "setup.server.error.securityDisabled.step1",
+                      "Set DOCKER_ENABLE_SECURITY=true in your environment",
+                    )}
+                  </li>
+                  <li>
+                    {t(
+                      "setup.server.error.securityDisabled.step2",
+                      "Or set security.enableLogin=true in settings.yml",
+                    )}
+                  </li>
+                  <li>
+                    {t(
+                      "setup.server.error.securityDisabled.step3",
+                      "Restart the server",
+                    )}
+                  </li>
                 </ol>
               </Text>
             </Stack>
@@ -228,11 +324,13 @@ export const ServerSelection: React.FC<ServerSelectionProps> = ({ onSelect, load
                 setCustomUrl(serverUrl);
                 // Auto-submit the form after setting the URL
                 setTimeout(() => {
-                  handleSubmit(new Event('submit') as any);
+                  void submitServerUrl();
                 }, 0);
               }}
             >
-              {t('setup.server.useLast', 'Last used server: {{serverUrl}}', { serverUrl: serverUrl })}
+              {t("setup.server.useLast", "Last used server: {{serverUrl}}", {
+                serverUrl: serverUrl,
+              })}
             </button>
           </div>
         )}
@@ -246,8 +344,8 @@ export const ServerSelection: React.FC<ServerSelectionProps> = ({ onSelect, load
           color="#AF3434"
         >
           {testing
-            ? t('setup.server.testing', 'Testing connection...')
-            : t('common.continue', 'Continue')}
+            ? t("setup.server.testing", "Testing connection...")
+            : t("common.continue", "Continue")}
         </Button>
       </Stack>
     </form>
diff --git a/frontend/src/desktop/components/SetupWizard/ServerSelectionScreen.tsx b/frontend/src/desktop/components/SetupWizard/ServerSelectionScreen.tsx
index 48ad5b810f..289fbf5c32 100644
--- a/frontend/src/desktop/components/SetupWizard/ServerSelectionScreen.tsx
+++ b/frontend/src/desktop/components/SetupWizard/ServerSelectionScreen.tsx
@@ -1,10 +1,10 @@
-import React from 'react';
-import { useTranslation } from 'react-i18next';
-import LoginHeader from '@app/routes/login/LoginHeader';
-import ErrorMessage from '@app/routes/login/ErrorMessage';
-import { ServerSelection } from '@app/components/SetupWizard/ServerSelection';
-import { ServerConfig } from '@app/services/connectionModeService';
-import '@app/routes/authShared/auth.css';
+import React from "react";
+import { useTranslation } from "react-i18next";
+import LoginHeader from "@app/routes/login/LoginHeader";
+import ErrorMessage from "@app/routes/login/ErrorMessage";
+import { ServerSelection } from "@app/components/SetupWizard/ServerSelection";
+import { ServerConfig } from "@app/services/connectionModeService";
+import "@app/routes/authShared/auth.css";
 
 interface ServerSelectionScreenProps {
   onSelect: (config: ServerConfig) => void;
@@ -22,8 +22,11 @@ export const ServerSelectionScreen: React.FC<ServerSelectionScreenProps> = ({
   return (
     <>
       <LoginHeader
-        title={t('setup.server.title', 'Connect to Server')}
-        subtitle={t('setup.server.subtitle', 'Enter your self-hosted server URL')}
+        title={t("setup.server.title", "Connect to Server")}
+        subtitle={t(
+          "setup.server.subtitle",
+          "Enter your self-hosted server URL",
+        )}
       />
 
       <ErrorMessage error={error} />
diff --git a/frontend/src/desktop/components/SetupWizard/index.tsx b/frontend/src/desktop/components/SetupWizard/index.tsx
index 392caad915..a3a2595131 100644
--- a/frontend/src/desktop/components/SetupWizard/index.tsx
+++ b/frontend/src/desktop/components/SetupWizard/index.tsx
@@ -1,17 +1,26 @@
-import React, { useCallback, useEffect, useState } from 'react';
-import { useTranslation } from 'react-i18next';
-import { Stack, Text, Button, Alert, Loader, Center } from '@mantine/core';
-import { DesktopAuthLayout } from '@app/components/SetupWizard/DesktopAuthLayout';
-import { SaaSLoginScreen } from '@app/components/SetupWizard/SaaSLoginScreen';
-import { SaaSSignupScreen } from '@app/components/SetupWizard/SaaSSignupScreen';
-import { ServerSelectionScreen } from '@app/components/SetupWizard/ServerSelectionScreen';
-import { SelfHostedLoginScreen } from '@app/components/SetupWizard/SelfHostedLoginScreen';
-import { ServerConfig, SSOProviderConfig, connectionModeService } from '@app/services/connectionModeService';
-import { AuthServiceError, authService, UserInfo } from '@app/services/authService';
-import { tauriBackendService } from '@app/services/tauriBackendService';
-import { STIRLING_SAAS_URL } from '@app/constants/connection';
-import { listen } from '@tauri-apps/api/event';
-import '@app/routes/authShared/auth.css';
+import React, { useCallback, useEffect, useState } from "react";
+import { useTranslation } from "react-i18next";
+import { Stack, Text, Button, Alert, Loader, Center } from "@mantine/core";
+import { DesktopAuthLayout } from "@app/components/SetupWizard/DesktopAuthLayout";
+import { SaaSLoginScreen } from "@app/components/SetupWizard/SaaSLoginScreen";
+import { SaaSSignupScreen } from "@app/components/SetupWizard/SaaSSignupScreen";
+import { ServerSelectionScreen } from "@app/components/SetupWizard/ServerSelectionScreen";
+import { SelfHostedLoginScreen } from "@app/components/SetupWizard/SelfHostedLoginScreen";
+import {
+  ServerConfig,
+  SSOProviderConfig,
+  connectionModeService,
+} from "@app/services/connectionModeService";
+import {
+  AuthServiceError,
+  authService,
+  UserInfo,
+} from "@app/services/authService";
+import { tauriBackendService } from "@app/services/tauriBackendService";
+import { STIRLING_SAAS_URL } from "@app/constants/connection";
+import { listen } from "@tauri-apps/api/event";
+import "@app/routes/authShared/auth.css";
+import { DisabledButtonWithTooltip } from "@app/components/shared/DisabledButtonWithTooltip";
 
 enum SetupStep {
   SaaSLogin,
@@ -28,13 +37,19 @@ interface SetupWizardProps {
   onClose?: () => void;
 }
 
-export const SetupWizard: React.FC<SetupWizardProps> = ({ onComplete, noLayout = false, onClose }) => {
+export const SetupWizard: React.FC<SetupWizardProps> = ({
+  onComplete,
+  noLayout = false,
+  onClose,
+}) => {
   const { t } = useTranslation();
   const [activeStep, setActiveStep] = useState<SetupStep>(SetupStep.SaaSLogin);
-  const [serverConfig, setServerConfig] = useState<ServerConfig | null>({ url: STIRLING_SAAS_URL });
+  const [serverConfig, setServerConfig] = useState<ServerConfig | null>({
+    url: STIRLING_SAAS_URL,
+  });
   const [loading, setLoading] = useState(false);
   const [error, setError] = useState<string | null>(null);
-  const [selfHostedMfaCode, setSelfHostedMfaCode] = useState('');
+  const [selfHostedMfaCode, setSelfHostedMfaCode] = useState("");
   const [selfHostedMfaRequired, setSelfHostedMfaRequired] = useState(false);
   const [lockConnectionMode, setLockConnectionMode] = useState(false);
   const [lockedServerUnreachable, setLockedServerUnreachable] = useState(false);
@@ -42,7 +57,7 @@ export const SetupWizard: React.FC<SetupWizardProps> = ({ onComplete, noLayout =
 
   const handleSaaSLogin = async (username: string, password: string) => {
     if (!serverConfig) {
-      setError('No SaaS server configured');
+      setError("No SaaS server configured");
       return;
     }
 
@@ -61,15 +76,15 @@ export const SetupWizard: React.FC<SetupWizardProps> = ({ onComplete, noLayout =
       tauriBackendService.startBackend().catch(console.error);
       onComplete();
     } catch (err) {
-      console.error('SaaS login failed:', err);
-      setError(err instanceof Error ? err.message : 'SaaS login failed');
+      console.error("SaaS login failed:", err);
+      setError(err instanceof Error ? err.message : "SaaS login failed");
       setLoading(false);
     }
   };
 
   const handleSaaSLoginOAuth = async (_userInfo: UserInfo) => {
     if (!serverConfig) {
-      setError('No SaaS server configured');
+      setError("No SaaS server configured");
       return;
     }
 
@@ -82,8 +97,10 @@ export const SetupWizard: React.FC<SetupWizardProps> = ({ onComplete, noLayout =
       tauriBackendService.startBackend().catch(console.error);
       onComplete();
     } catch (err) {
-      console.error('SaaS OAuth login completion failed:', err);
-      setError(err instanceof Error ? err.message : 'Failed to complete SaaS login');
+      console.error("SaaS OAuth login completion failed:", err);
+      setError(
+        err instanceof Error ? err.message : "Failed to complete SaaS login",
+      );
       setLoading(false);
     }
   };
@@ -94,13 +111,13 @@ export const SetupWizard: React.FC<SetupWizardProps> = ({ onComplete, noLayout =
       setError(null);
       // Save the server URL so it pre-fills on reconnect
       if (serverConfig?.url) {
-        localStorage.setItem('server_url', serverConfig.url);
+        localStorage.setItem("server_url", serverConfig.url);
       }
       await connectionModeService.switchToLocal();
       tauriBackendService.startBackend().catch(console.error);
       onComplete();
     } catch (err) {
-      console.error('Failed to continue in local mode:', err);
+      console.error("Failed to continue in local mode:", err);
       setError(err instanceof Error ? err.message : String(err));
       setLoading(false);
     }
@@ -125,24 +142,24 @@ export const SetupWizard: React.FC<SetupWizardProps> = ({ onComplete, noLayout =
   };
 
   const handleServerSelection = (config: ServerConfig) => {
-    console.log('[SetupWizard] Server selected:', config);
-    console.log('[SetupWizard] OAuth providers:', config.enabledOAuthProviders);
-    console.log('[SetupWizard] Login method:', config.loginMethod);
+    console.log("[SetupWizard] Server selected:", config);
+    console.log("[SetupWizard] OAuth providers:", config.enabledOAuthProviders);
+    console.log("[SetupWizard] Login method:", config.loginMethod);
     setServerConfig(config);
     setError(null);
-    setSelfHostedMfaCode('');
+    setSelfHostedMfaCode("");
     setSelfHostedMfaRequired(false);
     setActiveStep(SetupStep.SelfHostedLogin);
   };
 
   const handleSelfHostedLogin = async (username: string, password: string) => {
-    console.log('[SetupWizard] � Starting self-hosted login');
+    console.log("[SetupWizard] � Starting self-hosted login");
     console.log(`[SetupWizard] Server: ${serverConfig?.url}`);
     console.log(`[SetupWizard] Username: ${username}`);
 
     if (!serverConfig) {
-      console.error('[SetupWizard] � No server configured');
-      setError('No server configured');
+      console.error("[SetupWizard] � No server configured");
+      setError("No server configured");
       return;
     }
 
@@ -150,54 +167,57 @@ export const SetupWizard: React.FC<SetupWizardProps> = ({ onComplete, noLayout =
       setLoading(true);
       setError(null);
 
-      console.log('[SetupWizard] Step 1: Authenticating with server...');
+      console.log("[SetupWizard] Step 1: Authenticating with server...");
       const trimmedMfa = selfHostedMfaCode.trim();
       const mfaCode = trimmedMfa ? trimmedMfa : undefined;
       await authService.login(serverConfig.url, username, password, mfaCode);
-      console.log('[SetupWizard] ✅ Authentication successful');
+      console.log("[SetupWizard] ✅ Authentication successful");
 
       setSelfHostedMfaRequired(false);
-      setSelfHostedMfaCode('');
+      setSelfHostedMfaCode("");
 
-      console.log('[SetupWizard] Step 2: Switching to self-hosted mode...');
+      console.log("[SetupWizard] Step 2: Switching to self-hosted mode...");
       await connectionModeService.switchToSelfHosted(serverConfig);
-      console.log('[SetupWizard] ✅ Switched to self-hosted mode');
+      console.log("[SetupWizard] ✅ Switched to self-hosted mode");
 
-      console.log('[SetupWizard] Step 3: Initializing external backend...');
+      console.log("[SetupWizard] Step 3: Initializing external backend...");
       await tauriBackendService.initializeExternalBackend();
-      console.log('[SetupWizard] ✅ External backend initialized');
+      console.log("[SetupWizard] ✅ External backend initialized");
 
-      console.log('[SetupWizard] ✅ Setup complete, calling onComplete()');
+      console.log("[SetupWizard] ✅ Setup complete, calling onComplete()");
       onComplete();
     } catch (err) {
-      console.error('[SetupWizard] � Self-hosted login failed:', err);
-      let errorMessage = 'Self-hosted login failed';
+      console.error("[SetupWizard] � Self-hosted login failed:", err);
+      let errorMessage = "Self-hosted login failed";
       if (err instanceof AuthServiceError) {
-        if (err.code === 'mfa_required' || err.code === 'invalid_mfa_code') {
+        if (err.code === "mfa_required" || err.code === "invalid_mfa_code") {
           setSelfHostedMfaRequired(true);
         }
         errorMessage = err.message;
       } else if (err instanceof Error) {
         errorMessage = err.message;
-      } else if (typeof err === 'string') {
+      } else if (typeof err === "string") {
         errorMessage = err;
       }
-      if (errorMessage.toLowerCase().includes('mfa_required') || errorMessage.toLowerCase().includes('invalid_mfa_code')) {
+      if (
+        errorMessage.toLowerCase().includes("mfa_required") ||
+        errorMessage.toLowerCase().includes("invalid_mfa_code")
+      ) {
         setSelfHostedMfaRequired(true);
       }
-      console.error('[SetupWizard] Error message:', errorMessage);
+      console.error("[SetupWizard] Error message:", errorMessage);
       setError(errorMessage);
       setLoading(false);
     }
   };
 
   const handleSelfHostedOAuthSuccess = async (_userInfo: UserInfo) => {
-    console.log('[SetupWizard] � OAuth login successful, completing setup');
+    console.log("[SetupWizard] � OAuth login successful, completing setup");
     console.log(`[SetupWizard] Server: ${serverConfig?.url}`);
 
     if (!serverConfig) {
-      console.error('[SetupWizard] � No server configured');
-      setError('No server configured');
+      console.error("[SetupWizard] � No server configured");
+      setError("No server configured");
       return;
     }
 
@@ -205,28 +225,32 @@ export const SetupWizard: React.FC<SetupWizardProps> = ({ onComplete, noLayout =
       setLoading(true);
       setError(null);
 
-      console.log('[SetupWizard] Step 1: OAuth already completed');
-      console.log('[SetupWizard] Step 2: Switching to self-hosted mode...');
+      console.log("[SetupWizard] Step 1: OAuth already completed");
+      console.log("[SetupWizard] Step 2: Switching to self-hosted mode...");
       await connectionModeService.switchToSelfHosted(serverConfig);
-      console.log('[SetupWizard] ✅ Switched to self-hosted mode');
+      console.log("[SetupWizard] ✅ Switched to self-hosted mode");
 
-      console.log('[SetupWizard] Step 3: Initializing external backend...');
+      console.log("[SetupWizard] Step 3: Initializing external backend...");
       await tauriBackendService.initializeExternalBackend();
-      console.log('[SetupWizard] ✅ External backend initialized');
+      console.log("[SetupWizard] ✅ External backend initialized");
 
-      console.log('[SetupWizard] ✅ Setup complete, calling onComplete()');
+      console.log("[SetupWizard] ✅ Setup complete, calling onComplete()");
       onComplete();
     } catch (err) {
-      console.error('[SetupWizard] � Self-hosted OAuth login completion failed:', err);
-      const errorMessage = err instanceof Error ? err.message : 'Failed to complete login';
-      console.error('[SetupWizard] Error message:', errorMessage);
+      console.error(
+        "[SetupWizard] � Self-hosted OAuth login completion failed:",
+        err,
+      );
+      const errorMessage =
+        err instanceof Error ? err.message : "Failed to complete login";
+      console.error("[SetupWizard] Error message:", errorMessage);
       setError(errorMessage);
       setLoading(false);
     }
   };
 
   useEffect(() => {
-    const unsubscribePromise = listen<string>('deep-link', async (event) => {
+    const unsubscribePromise = listen<string>("deep-link", async (event) => {
       const url = event.payload;
       if (!url) return;
 
@@ -234,24 +258,27 @@ export const SetupWizard: React.FC<SetupWizardProps> = ({ onComplete, noLayout =
         const parsed = new URL(url);
 
         // Supabase sends tokens in the URL hash
-        const hash = parsed.hash.replace(/^#/, '');
+        const hash = parsed.hash.replace(/^#/, "");
         const params = new URLSearchParams(hash);
-        const accessToken = params.get('access_token');
-        const type = params.get('type') || parsed.searchParams.get('type');
+        const accessToken = params.get("access_token");
+        const type = params.get("type") || parsed.searchParams.get("type");
         // Self-hosted SSO deep links are normally handled by authService.loginWithSelfHostedOAuth.
         // Fallback here only if no in-flight auth listener exists (e.g. renderer reload mid-flow).
-        if (type === 'sso' || type === 'sso-selfhosted') {
+        if (type === "sso" || type === "sso-selfhosted") {
           if (authService.isSelfHostedDeepLinkFlowActive()) {
             return;
           }
 
-          const accessTokenFromHash = params.get('access_token');
-          const accessTokenFromQuery = parsed.searchParams.get('access_token');
-          const serverFromQuery = parsed.searchParams.get('server');
+          const accessTokenFromHash = params.get("access_token");
+          const accessTokenFromQuery = parsed.searchParams.get("access_token");
+          const serverFromQuery = parsed.searchParams.get("server");
           const token = accessTokenFromHash || accessTokenFromQuery;
-          const serverUrl = serverFromQuery || serverConfig?.url || STIRLING_SAAS_URL;
+          const serverUrl =
+            serverFromQuery || serverConfig?.url || STIRLING_SAAS_URL;
           if (!token || !serverUrl) {
-            console.error('[SetupWizard] Deep link missing token or server for SSO completion');
+            console.error(
+              "[SetupWizard] Deep link missing token or server for SSO completion",
+            );
             return;
           }
 
@@ -265,25 +292,35 @@ export const SetupWizard: React.FC<SetupWizardProps> = ({ onComplete, noLayout =
           return;
         }
 
-        if (!type || (type !== 'signup' && type !== 'recovery' && type !== 'magiclink')) {
+        if (
+          !type ||
+          (type !== "signup" && type !== "recovery" && type !== "magiclink")
+        ) {
           return;
         }
 
         if (!accessToken) {
-          console.error('[SetupWizard] Deep link missing access_token');
+          console.error("[SetupWizard] Deep link missing access_token");
           return;
         }
 
         setLoading(true);
         setError(null);
 
-        await authService.completeSupabaseSession(accessToken, serverConfig?.url || STIRLING_SAAS_URL);
-        await connectionModeService.switchToSaaS(serverConfig?.url || STIRLING_SAAS_URL);
+        await authService.completeSupabaseSession(
+          accessToken,
+          serverConfig?.url || STIRLING_SAAS_URL,
+        );
+        await connectionModeService.switchToSaaS(
+          serverConfig?.url || STIRLING_SAAS_URL,
+        );
         tauriBackendService.startBackend().catch(console.error);
         onComplete();
       } catch (err) {
-        console.error('[SetupWizard] Failed to handle deep link', err);
-        setError(err instanceof Error ? err.message : 'Failed to complete signup');
+        console.error("[SetupWizard] Failed to handle deep link", err);
+        setError(
+          err instanceof Error ? err.message : "Failed to complete signup",
+        );
         setLoading(false);
       }
     });
@@ -299,7 +336,7 @@ export const SetupWizard: React.FC<SetupWizardProps> = ({ onComplete, noLayout =
     }
     setError(null);
     if (activeStep === SetupStep.SelfHostedLogin) {
-      setSelfHostedMfaCode('');
+      setSelfHostedMfaCode("");
       setSelfHostedMfaRequired(false);
       setActiveStep(SetupStep.ServerSelection);
     } else if (activeStep === SetupStep.ServerSelection) {
@@ -313,21 +350,22 @@ export const SetupWizard: React.FC<SetupWizardProps> = ({ onComplete, noLayout =
   const loadLockedConfig = useCallback(async () => {
     const currentConfig = await connectionModeService.getCurrentConfig();
     if (!currentConfig.lock_connection_mode) return;
-    // server_config may be null when the user switched to local mode from a locked deployment.
-    // Fall back to the URL saved by switchToLocal() so the wizard still shows locked login.
-    const serverUrl = currentConfig.server_config?.url
-      || localStorage.getItem('stirling-provisioned-server-url');
+    const serverUrl = currentConfig.server_config?.url;
     if (!serverUrl) return;
 
     setLockConnectionMode(true);
     setLockedServerUnreachable(false);
     setLockedServerChecking(true);
 
-    const savedUrl = serverUrl.replace(/\/+$/, '');
-    let updatedConfig: ServerConfig = { ...(currentConfig.server_config ?? { url: savedUrl }) };
+    const savedUrl = serverUrl.replace(/\/+$/, "");
+    let updatedConfig: ServerConfig = {
+      ...(currentConfig.server_config ?? { url: savedUrl }),
+    };
 
     try {
-      const response = await fetch(`${savedUrl}/api/v1/proprietary/ui-data/login`);
+      const response = await fetch(
+        `${savedUrl}/api/v1/proprietary/ui-data/login`,
+      );
 
       if (response.ok) {
         const data = await response.json();
@@ -335,20 +373,21 @@ export const SetupWizard: React.FC<SetupWizardProps> = ({ onComplete, noLayout =
         const providerEntries = Object.entries(data.providerList || {});
 
         providerEntries.forEach(([path, label]) => {
-          const id = path.split('/').pop();
+          const id = path.split("/").pop();
           if (id) {
             enabledProviders.push({
               id,
               path,
-              label: typeof label === 'string' ? label : undefined,
+              label: typeof label === "string" ? label : undefined,
             });
           }
         });
 
         updatedConfig = {
           ...updatedConfig,
-          enabledOAuthProviders: enabledProviders.length > 0 ? enabledProviders : undefined,
-          loginMethod: data.loginMethod || 'all',
+          enabledOAuthProviders:
+            enabledProviders.length > 0 ? enabledProviders : undefined,
+          loginMethod: data.loginMethod || "all",
         };
 
         setServerConfig(updatedConfig);
@@ -356,14 +395,14 @@ export const SetupWizard: React.FC<SetupWizardProps> = ({ onComplete, noLayout =
         setActiveStep(SetupStep.SelfHostedLogin);
       } else {
         // Server responded but with an error — still show login form
-        updatedConfig = { ...updatedConfig, loginMethod: 'all' };
+        updatedConfig = { ...updatedConfig, loginMethod: "all" };
         setServerConfig(updatedConfig);
         setLockedServerChecking(false);
         setActiveStep(SetupStep.SelfHostedLogin);
       }
     } catch (err) {
       // Network error — server is unreachable
-      console.error('[SetupWizard] Server unreachable:', err);
+      console.error("[SetupWizard] Server unreachable:", err);
       setServerConfig(updatedConfig);
       setLockedServerChecking(false);
       setLockedServerUnreachable(true);
@@ -415,73 +454,123 @@ export const SetupWizard: React.FC<SetupWizardProps> = ({ onComplete, noLayout =
         </Center>
       )}
 
-      {activeStep === SetupStep.SelfHostedLogin && lockedServerUnreachable && !lockedServerChecking && (
-        <Stack gap="md" style={{ padding: '0.5rem 0' }}>
-          <Alert color="orange" title={t('setup.selfhosted.unreachable.title', 'Cannot connect to server')}>
-            <Text size="sm">
-              {t('setup.selfhosted.unreachable.message', 'Could not reach {{url}}. Check that the server is running and accessible.', {
-                url: serverConfig?.url,
-              })}
-            </Text>
-          </Alert>
-          <Button
-            variant="filled"
-            color="blue"
-            fullWidth
-            loading={loading}
-            onClick={() => void loadLockedConfig()}
-          >
-            {t('setup.selfhosted.unreachable.retry', 'Retry')}
-          </Button>
-          <Button
-            variant="subtle"
-            color="white"
-            fullWidth
-            onClick={handleLocalMode}
-          >
-            {t('setup.selfhosted.unreachable.continueOffline', 'Use local tools instead')}
-          </Button>
-        </Stack>
-      )}
+      {activeStep === SetupStep.SelfHostedLogin &&
+        lockedServerUnreachable &&
+        !lockedServerChecking && (
+          <Stack gap="md" style={{ padding: "0.5rem 0" }}>
+            <Alert
+              color="orange"
+              title={t(
+                "setup.selfhosted.unreachable.title",
+                "Cannot connect to server",
+              )}
+            >
+              <Text size="sm">
+                {t(
+                  "setup.selfhosted.unreachable.message",
+                  "Could not reach {{url}}. Check that the server is running and accessible.",
+                  {
+                    url: serverConfig?.url,
+                  },
+                )}
+              </Text>
+            </Alert>
+            <Button
+              variant="filled"
+              color="blue"
+              fullWidth
+              loading={loading}
+              onClick={() => void loadLockedConfig()}
+            >
+              {t("setup.selfhosted.unreachable.retry", "Retry")}
+            </Button>
+            {lockConnectionMode ? (
+              <DisabledButtonWithTooltip
+                tooltip={t(
+                  "setup.selfhosted.changeServerLocked",
+                  "Your organisation has restricted this app to a specific server",
+                )}
+              >
+                {t(
+                  "setup.selfhosted.unreachable.changeServer",
+                  "Connect to a different server",
+                )}
+              </DisabledButtonWithTooltip>
+            ) : (
+              <Button
+                variant="light"
+                color="blue"
+                fullWidth
+                loading={loading}
+                onClick={() => {
+                  setLockedServerUnreachable(false);
+                  setActiveStep(SetupStep.ServerSelection);
+                }}
+              >
+                {t(
+                  "setup.selfhosted.unreachable.changeServer",
+                  "Connect to a different server",
+                )}
+              </Button>
+            )}
+            <Button
+              variant="subtle"
+              color="white"
+              fullWidth
+              onClick={handleLocalMode}
+            >
+              {t(
+                "setup.selfhosted.unreachable.continueOffline",
+                "Use local tools instead",
+              )}
+            </Button>
+          </Stack>
+        )}
 
-      {activeStep === SetupStep.SelfHostedLogin && !lockedServerUnreachable && !lockedServerChecking && (
-        <>
-          <SelfHostedLoginScreen
-            serverUrl={serverConfig?.url || ''}
-            enabledOAuthProviders={serverConfig?.enabledOAuthProviders}
-            loginMethod={serverConfig?.loginMethod}
-            onLogin={handleSelfHostedLogin}
-            onOAuthSuccess={handleSelfHostedOAuthSuccess}
-            mfaCode={selfHostedMfaCode}
-            setMfaCode={setSelfHostedMfaCode}
-            requiresMfa={selfHostedMfaRequired}
-            loading={loading}
-            error={error}
-          />
-          {lockConnectionMode && (
-            <div className="navigation-link-container" style={{ marginTop: '1.5rem' }}>
+      {activeStep === SetupStep.SelfHostedLogin &&
+        !lockedServerUnreachable &&
+        !lockedServerChecking && (
+          <>
+            <SelfHostedLoginScreen
+              serverUrl={serverConfig?.url || ""}
+              enabledOAuthProviders={serverConfig?.enabledOAuthProviders}
+              loginMethod={serverConfig?.loginMethod}
+              onLogin={handleSelfHostedLogin}
+              onOAuthSuccess={handleSelfHostedOAuthSuccess}
+              mfaCode={selfHostedMfaCode}
+              setMfaCode={setSelfHostedMfaCode}
+              requiresMfa={selfHostedMfaRequired}
+              loading={loading}
+              error={error}
+            />
+            <div
+              className="navigation-link-container"
+              style={{ marginTop: "1.5rem" }}
+            >
               <button
                 type="button"
                 onClick={handleLocalMode}
                 className="navigation-link-button"
                 disabled={loading}
               >
-                {t('setup.selfhosted.switchToLocal', 'Use local tools instead')}
+                {t("setup.selfhosted.switchToLocal", "Use local tools instead")}
               </button>
             </div>
-          )}
-        </>
-      )}
+          </>
+        )}
 
       {/* Back Button */}
       {!lockConnectionMode && activeStep > SetupStep.SaaSLogin && !loading && (
-        <div className="navigation-link-container" style={{ marginTop: '1.5rem' }}>
+        <div
+          className="navigation-link-container"
+          style={{ marginTop: "1.5rem" }}
+        >
           <button
             type="button"
             onClick={handleBack}
             className="navigation-link-button"
           >
-            {t('common.back', 'Back')}
+            {t("common.back", "Back")}
           </button>
         </div>
       )}
@@ -489,12 +578,8 @@ export const SetupWizard: React.FC<SetupWizardProps> = ({ onComplete, noLayout =
   );
 
   if (noLayout) {
-    return <div style={{ padding: '2rem' }}>{wizardContent}</div>;
+    return <div style={{ padding: "2rem" }}>{wizardContent}</div>;
   }
 
-  return (
-    <DesktopAuthLayout>
-      {wizardContent}
-    </DesktopAuthLayout>
-  );
+  return <DesktopAuthLayout>{wizardContent}</DesktopAuthLayout>;
 };
diff --git a/frontend/src/desktop/components/SignInModal.tsx b/frontend/src/desktop/components/SignInModal.tsx
index 1ab44b7ec0..fec53c213c 100644
--- a/frontend/src/desktop/components/SignInModal.tsx
+++ b/frontend/src/desktop/components/SignInModal.tsx
@@ -1,8 +1,8 @@
-import { useEffect, useState } from 'react';
-import { Modal } from '@mantine/core';
-import { SetupWizard } from '@app/components/SetupWizard';
-import { OPEN_SIGN_IN_EVENT } from '@app/constants/signInEvents';
-import { Z_INDEX_SIGN_IN_MODAL } from '@app/styles/zIndex';
+import { useEffect, useState } from "react";
+import { Modal } from "@mantine/core";
+import { SetupWizard } from "@app/components/SetupWizard";
+import { OPEN_SIGN_IN_EVENT } from "@app/constants/signInEvents";
+import { Z_INDEX_SIGN_IN_MODAL } from "@app/styles/zIndex";
 
 export function SignInModal() {
   const [opened, setOpened] = useState(false);
@@ -23,7 +23,9 @@ export function SignInModal() {
   return (
     <Modal
       opened={opened}
-      onClose={() => { if (!locked) setOpened(false); }}
+      onClose={() => {
+        if (!locked) setOpened(false);
+      }}
       size={520}
       centered
       withCloseButton={false}
diff --git a/frontend/src/desktop/components/fileEditor/FileEditorFileName.tsx b/frontend/src/desktop/components/fileEditor/FileEditorFileName.tsx
index 1fe75e085f..c173a4dc2f 100644
--- a/frontend/src/desktop/components/fileEditor/FileEditorFileName.tsx
+++ b/frontend/src/desktop/components/fileEditor/FileEditorFileName.tsx
@@ -1,8 +1,8 @@
-import React from 'react';
-import { Tooltip } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { StirlingFileStub } from '@app/types/fileContext';
-import { PrivateContent } from '@app/components/shared/PrivateContent';
+import React from "react";
+import { Tooltip } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import { StirlingFileStub } from "@app/types/fileContext";
+import { PrivateContent } from "@app/components/shared/PrivateContent";
 
 interface FileEditorFileNameProps {
   file: StirlingFileStub;
@@ -15,47 +15,47 @@ const FileEditorFileName = ({ file }: FileEditorFileNameProps) => {
     <>
       <PrivateContent>{file.name}</PrivateContent>
       {!file.localFilePath && (
-        <Tooltip label={t('fileNotSavedToDisk', 'Not saved to disk')}>
+        <Tooltip label={t("fileNotSavedToDisk", "Not saved to disk")}>
           <span
             style={{
-              display: 'inline-block',
-              width: '6px',
-              height: '6px',
-              borderRadius: '50%',
-              backgroundColor: 'var(--mantine-color-red-6)',
-              flexShrink: 0
+              display: "inline-block",
+              width: "6px",
+              height: "6px",
+              borderRadius: "50%",
+              backgroundColor: "var(--mantine-color-red-6)",
+              flexShrink: 0,
             }}
-            aria-label={t('fileNotSavedToDisk', 'Not saved to disk')}
+            aria-label={t("fileNotSavedToDisk", "Not saved to disk")}
           />
         </Tooltip>
       )}
       {file.localFilePath && file.isDirty && (
-        <Tooltip label={t('unsavedChanges', 'Unsaved changes')}>
+        <Tooltip label={t("unsavedChanges", "Unsaved changes")}>
           <span
             style={{
-              display: 'inline-block',
-              width: '6px',
-              height: '6px',
-              borderRadius: '50%',
-              backgroundColor: 'var(--mantine-color-yellow-6)',
-              flexShrink: 0
+              display: "inline-block",
+              width: "6px",
+              height: "6px",
+              borderRadius: "50%",
+              backgroundColor: "var(--mantine-color-yellow-6)",
+              flexShrink: 0,
             }}
-            aria-label={t('unsavedChanges', 'Unsaved changes')}
+            aria-label={t("unsavedChanges", "Unsaved changes")}
           />
         </Tooltip>
       )}
       {file.localFilePath && !file.isDirty && (
-        <Tooltip label={t('fileSavedToDisk', 'File saved to disk')}>
+        <Tooltip label={t("fileSavedToDisk", "File saved to disk")}>
           <span
             style={{
-              display: 'inline-block',
-              width: '6px',
-              height: '6px',
-              borderRadius: '50%',
-              backgroundColor: 'var(--mantine-color-green-6)',
-              flexShrink: 0
+              display: "inline-block",
+              width: "6px",
+              height: "6px",
+              borderRadius: "50%",
+              backgroundColor: "var(--mantine-color-green-6)",
+              flexShrink: 0,
             }}
-            aria-label={t('fileSavedToDisk', 'File saved to disk')}
+            aria-label={t("fileSavedToDisk", "File saved to disk")}
           />
         </Tooltip>
       )}
diff --git a/frontend/src/desktop/components/onboarding/orchestrator/onboardingConfig.ts b/frontend/src/desktop/components/onboarding/orchestrator/onboardingConfig.ts
index 87451ca5e7..0ed81db9b5 100644
--- a/frontend/src/desktop/components/onboarding/orchestrator/onboardingConfig.ts
+++ b/frontend/src/desktop/components/onboarding/orchestrator/onboardingConfig.ts
@@ -1,10 +1,10 @@
 /**
  * Desktop Override: Onboarding Configuration
- * 
+ *
  * This version modifies the onboarding config for the desktop app:
  * - Sets isDesktopApp to true in the default runtime state
  * - This causes desktop-install step to be skipped
- * 
+ *
  * All other step definitions and logic remain the same.
  */
 
@@ -13,7 +13,7 @@ export {
   ONBOARDING_STEPS,
   getStepById,
   getStepIndex,
-} from '@core/components/onboarding/orchestrator/onboardingConfig';
+} from "@core/components/onboarding/orchestrator/onboardingConfig";
 
 export type {
   OnboardingStepId,
@@ -21,11 +21,11 @@ export type {
   OnboardingStep,
   OnboardingRuntimeState,
   OnboardingConditionContext,
-} from '@core/components/onboarding/orchestrator/onboardingConfig';
+} from "@core/components/onboarding/orchestrator/onboardingConfig";
 
 // Import and override the default runtime state
-import { DEFAULT_RUNTIME_STATE as CORE_DEFAULT_RUNTIME_STATE } from '@core/components/onboarding/orchestrator/onboardingConfig';
-import type { OnboardingRuntimeState } from '@core/components/onboarding/orchestrator/onboardingConfig';
+import { DEFAULT_RUNTIME_STATE as CORE_DEFAULT_RUNTIME_STATE } from "@core/components/onboarding/orchestrator/onboardingConfig";
+import type { OnboardingRuntimeState } from "@core/components/onboarding/orchestrator/onboardingConfig";
 
 /**
  * Desktop default runtime state
@@ -35,4 +35,3 @@ export const DEFAULT_RUNTIME_STATE: OnboardingRuntimeState = {
   ...CORE_DEFAULT_RUNTIME_STATE,
   isDesktopApp: true,
 };
-
diff --git a/frontend/src/desktop/components/onboarding/orchestrator/useOnboardingOrchestrator.ts b/frontend/src/desktop/components/onboarding/orchestrator/useOnboardingOrchestrator.ts
index fed28ed9df..f30c3d8f6d 100644
--- a/frontend/src/desktop/components/onboarding/orchestrator/useOnboardingOrchestrator.ts
+++ b/frontend/src/desktop/components/onboarding/orchestrator/useOnboardingOrchestrator.ts
@@ -8,15 +8,17 @@
 import {
   useOnboardingOrchestrator as useCoreOnboardingOrchestrator,
   type UseOnboardingOrchestratorResult,
-} from '@core/components/onboarding/orchestrator/useOnboardingOrchestrator';
-import { DEFAULT_RUNTIME_STATE } from '@app/components/onboarding/orchestrator/onboardingConfig';
+} from "@core/components/onboarding/orchestrator/useOnboardingOrchestrator";
+import { DEFAULT_RUNTIME_STATE } from "@app/components/onboarding/orchestrator/onboardingConfig";
 
 export type {
   OnboardingOrchestratorState,
   OnboardingOrchestratorActions,
   UseOnboardingOrchestratorResult,
-} from '@core/components/onboarding/orchestrator/useOnboardingOrchestrator';
+} from "@core/components/onboarding/orchestrator/useOnboardingOrchestrator";
 
 export function useOnboardingOrchestrator(): UseOnboardingOrchestratorResult {
-  return useCoreOnboardingOrchestrator({ defaultRuntimeState: DEFAULT_RUNTIME_STATE });
+  return useCoreOnboardingOrchestrator({
+    defaultRuntimeState: DEFAULT_RUNTIME_STATE,
+  });
 }
diff --git a/frontend/src/desktop/components/quickAccessBar/QuickAccessBarFooterExtensions.tsx b/frontend/src/desktop/components/quickAccessBar/QuickAccessBarFooterExtensions.tsx
index f0f776751b..ab597f0388 100644
--- a/frontend/src/desktop/components/quickAccessBar/QuickAccessBarFooterExtensions.tsx
+++ b/frontend/src/desktop/components/quickAccessBar/QuickAccessBarFooterExtensions.tsx
@@ -1,10 +1,10 @@
-import { useEffect, useState } from 'react';
-import { Box, Text, Stack } from '@mantine/core';
-import { useSaaSBilling } from '@app/contexts/SaasBillingContext';
-import { BILLING_CONFIG } from '@app/config/billing';
-import { connectionModeService } from '@app/services/connectionModeService';
-import { authService } from '@app/services/authService';
-import { CREDIT_EVENTS } from '@app/constants/creditEvents';
+import { useEffect, useState } from "react";
+import { Box, Text, Stack } from "@mantine/core";
+import { useSaaSBilling } from "@app/contexts/SaasBillingContext";
+import { BILLING_CONFIG } from "@app/config/billing";
+import { connectionModeService } from "@app/services/connectionModeService";
+import { authService } from "@app/services/authService";
+import { CREDIT_EVENTS } from "@app/constants/creditEvents";
 
 /**
  * Desktop credit counter displayed in QuickAccessBar footer
@@ -15,7 +15,9 @@ interface QuickAccessBarFooterExtensionsProps {
   className?: string;
 }
 
-export function QuickAccessBarFooterExtensions({ className }: QuickAccessBarFooterExtensionsProps) {
+export function QuickAccessBarFooterExtensions({
+  className,
+}: QuickAccessBarFooterExtensionsProps) {
   const { creditBalance, loading, isManagedTeamMember } = useSaaSBilling();
   const [isSaasMode, setIsSaasMode] = useState(false);
   const [isAuthenticated, setIsAuthenticated] = useState(false);
@@ -25,7 +27,7 @@ export function QuickAccessBarFooterExtensions({ className }: QuickAccessBarFoot
     const checkMode = async () => {
       const mode = await connectionModeService.getCurrentMode();
       const auth = await authService.isAuthenticated();
-      setIsSaasMode(mode === 'saas');
+      setIsSaasMode(mode === "saas");
       setIsAuthenticated(auth);
     };
 
@@ -39,7 +41,7 @@ export function QuickAccessBarFooterExtensions({ className }: QuickAccessBarFoot
   // Subscribe to auth changes
   useEffect(() => {
     const unsubscribe = authService.subscribeToAuth((status) => {
-      setIsAuthenticated(status === 'authenticated');
+      setIsAuthenticated(status === "authenticated");
     });
     return unsubscribe;
   }, []);
@@ -50,24 +52,36 @@ export function QuickAccessBarFooterExtensions({ className }: QuickAccessBarFoot
   // - Still loading billing data
   // - User is a managed team member (unlimited credits)
   // - Credits >= 20 (only show when low)
-  if (!isSaasMode || !isAuthenticated || loading || isManagedTeamMember || creditBalance >= BILLING_CONFIG.PLAN_PRICING_PRELOAD_THRESHOLD) {
+  if (
+    !isSaasMode ||
+    !isAuthenticated ||
+    loading ||
+    isManagedTeamMember ||
+    creditBalance >= BILLING_CONFIG.PLAN_PRICING_PRELOAD_THRESHOLD
+  ) {
     return null;
   }
 
   const handleClick = () => {
     // Dispatch low credits event to open upgrade modal
-    window.dispatchEvent(new CustomEvent(CREDIT_EVENTS.EXHAUSTED, {
-      detail: { source: 'quickAccessBar' }
-    }));
+    window.dispatchEvent(
+      new CustomEvent(CREDIT_EVENTS.EXHAUSTED, {
+        detail: { source: "quickAccessBar" },
+      }),
+    );
   };
 
   return (
-    <Box className={className} style={{ padding: '0.5rem', cursor: 'pointer' }} onClick={handleClick}>
+    <Box
+      className={className}
+      style={{ padding: "0.5rem", cursor: "pointer" }}
+      onClick={handleClick}
+    >
       <Stack gap={2} align="center">
         <Text size="xs" c="dimmed" fw={500}>
-          {creditBalance} {creditBalance === 1 ? 'credit' : 'credits'}
+          {creditBalance} {creditBalance === 1 ? "credit" : "credits"}
         </Text>
-        <Text size="xs" c="dimmed" style={{ textDecoration: 'underline' }}>
+        <Text size="xs" c="dimmed" style={{ textDecoration: "underline" }}>
           Upgrade
         </Text>
       </Stack>
diff --git a/frontend/src/desktop/components/rightRail/RightRailFooterExtensions.tsx b/frontend/src/desktop/components/rightRail/RightRailFooterExtensions.tsx
index 070debc0ee..96c4e106db 100644
--- a/frontend/src/desktop/components/rightRail/RightRailFooterExtensions.tsx
+++ b/frontend/src/desktop/components/rightRail/RightRailFooterExtensions.tsx
@@ -1,10 +1,16 @@
-import { useState, useEffect, useMemo } from 'react';
-import { Box, Tooltip, rem, useComputedColorScheme } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { connectionModeService, type ConnectionMode } from '@app/services/connectionModeService';
-import { selfHostedServerMonitor, type SelfHostedServerState } from '@app/services/selfHostedServerMonitor';
-import { useBackendHealth } from '@app/hooks/useBackendHealth';
-import { OPEN_SIGN_IN_EVENT } from '@app/constants/signInEvents';
+import { useState, useEffect, useMemo } from "react";
+import { Box, Tooltip, rem } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import {
+  connectionModeService,
+  type ConnectionMode,
+} from "@app/services/connectionModeService";
+import {
+  selfHostedServerMonitor,
+  type SelfHostedServerState,
+} from "@app/services/selfHostedServerMonitor";
+import { useBackendHealth } from "@app/hooks/useBackendHealth";
+import { OPEN_SIGN_IN_EVENT } from "@app/constants/signInEvents";
 
 interface RightRailFooterExtensionsProps {
   className?: string;
@@ -12,18 +18,21 @@ interface RightRailFooterExtensionsProps {
 
 function ConnectionStatusDot() {
   const { t } = useTranslation();
-  const colorScheme = useComputedColorScheme('light');
-  const [connectionMode, setConnectionMode] = useState<ConnectionMode | null>(null);
+  const [connectionMode, setConnectionMode] = useState<ConnectionMode | null>(
+    null,
+  );
   const [selfHostedState, setSelfHostedState] = useState<SelfHostedServerState>(
-    () => selfHostedServerMonitor.getSnapshot()
+    () => selfHostedServerMonitor.getSnapshot(),
   );
   const { isOnline, checkHealth } = useBackendHealth();
 
   useEffect(() => {
     void connectionModeService.getCurrentMode().then(setConnectionMode);
-    const unsubscribe = connectionModeService.subscribeToModeChanges((config) => {
-      setConnectionMode(config.mode);
-    });
+    const unsubscribe = connectionModeService.subscribeToModeChanges(
+      (config) => {
+        setConnectionMode(config.mode);
+      },
+    );
     return unsubscribe;
   }, []);
 
@@ -32,50 +41,56 @@ function ConnectionStatusDot() {
   }, []);
 
   const { label, color } = useMemo(() => {
-    if (connectionMode === 'saas') {
+    if (connectionMode === "saas") {
       return {
-        label: t('connectionMode.status.saas', 'Connected to Stirling Cloud'),
-        color: '#3b82f6',
+        label: t("connectionMode.status.saas", "Connected to Stirling Cloud"),
+        color: "#3b82f6",
       };
     }
-    if (connectionMode === 'selfhosted') {
+    if (connectionMode === "selfhosted") {
       const serverOnline = selfHostedState.isOnline;
-      const serverChecking = selfHostedState.status === 'checking';
+      const serverChecking = selfHostedState.status === "checking";
       const backendLabel = serverChecking
-        ? t('connectionMode.status.selfhostedChecking', 'Connected to self-hosted server (checking...)')
+        ? t(
+            "connectionMode.status.selfhostedChecking",
+            "Connected to self-hosted server (checking...)",
+          )
         : serverOnline
-          ? t('connectionMode.status.selfhostedOnline', 'Connected to self-hosted server')
-          : t('connectionMode.status.selfhostedOffline', 'Self-hosted server unreachable');
+          ? t(
+              "connectionMode.status.selfhostedOnline",
+              "Connected to self-hosted server",
+            )
+          : t(
+              "connectionMode.status.selfhostedOffline",
+              "Self-hosted server unreachable",
+            );
       return {
         label: backendLabel,
-        color: serverChecking ? '#fcc419' : serverOnline ? '#37b24d' : '#e03131',
+        color: serverChecking
+          ? "#fcc419"
+          : serverOnline
+            ? "#37b24d"
+            : "#e03131",
       };
     }
     // local
     return {
       label: isOnline
-        ? t('connectionMode.status.localOnline', 'Offline mode running')
-        : t('connectionMode.status.localOffline', 'Offline mode running'),
-      color: '#868e96',
+        ? t("connectionMode.status.localOnline", "Offline mode running")
+        : t("connectionMode.status.localOffline", "Offline mode running"),
+      color: "#868e96",
     };
   }, [connectionMode, selfHostedState, isOnline, t]);
 
   return (
-    <Tooltip
-      label={label}
-      position="left"
-      offset={12}
-      withArrow
-      withinPortal
-      color={colorScheme === 'dark' ? undefined : 'dark'}
-    >
+    <Tooltip label={label} position="left" offset={12} withArrow withinPortal>
       <Box
         component="span"
         role="status"
         aria-label={label}
         tabIndex={0}
         onClick={() => {
-          if (connectionMode === 'local') {
+          if (connectionMode === "local") {
             window.dispatchEvent(new CustomEvent(OPEN_SIGN_IN_EVENT));
           } else {
             void checkHealth();
@@ -84,29 +99,29 @@ function ConnectionStatusDot() {
         style={{
           width: rem(10),
           height: rem(10),
-          borderRadius: '50%',
+          borderRadius: "50%",
           backgroundColor: color,
-          boxShadow: colorScheme === 'dark'
-            ? '0 0 0 2px rgba(255, 255, 255, 0.15)'
-            : '0 0 0 2px rgba(0, 0, 0, 0.07)',
-          display: 'inline-block',
-          cursor: 'pointer',
-          outline: 'none',
+          boxShadow: "var(--status-dot-ring)",
+          display: "inline-block",
+          cursor: "pointer",
+          outline: "none",
         }}
       />
     </Tooltip>
   );
 }
 
-export function RightRailFooterExtensions({ className }: RightRailFooterExtensionsProps) {
+export function RightRailFooterExtensions({
+  className,
+}: RightRailFooterExtensionsProps) {
   return (
     <Box
       className={className}
       style={{
-        width: '100%',
-        display: 'flex',
-        justifyContent: 'center',
-        alignItems: 'center',
+        width: "100%",
+        display: "flex",
+        justifyContent: "center",
+        alignItems: "center",
         paddingBottom: rem(12),
       }}
     >
diff --git a/frontend/src/desktop/components/shared/CloudBadge.tsx b/frontend/src/desktop/components/shared/CloudBadge.tsx
index ebd7e06bf5..1f5717eb12 100644
--- a/frontend/src/desktop/components/shared/CloudBadge.tsx
+++ b/frontend/src/desktop/components/shared/CloudBadge.tsx
@@ -1,6 +1,6 @@
-import { Badge, Tooltip } from '@mantine/core';
-import CloudOutlinedIcon from '@mui/icons-material/CloudOutlined';
-import { useTranslation } from 'react-i18next';
+import { Badge, Tooltip } from "@mantine/core";
+import CloudOutlinedIcon from "@mui/icons-material/CloudOutlined";
+import { useTranslation } from "react-i18next";
 
 interface CloudBadgeProps {
   className?: string;
@@ -16,7 +16,10 @@ export function CloudBadge({ className }: CloudBadgeProps) {
 
   return (
     <Tooltip
-      label={t('cloudBadge.tooltip', 'This operation will use your cloud credits')}
+      label={t(
+        "cloudBadge.tooltip",
+        "This operation will use your cloud credits",
+      )}
       position="top"
       withArrow
     >
@@ -26,8 +29,7 @@ export function CloudBadge({ className }: CloudBadgeProps) {
         variant="light"
         color="blue"
         size="xs"
-      >
-      </Badge>
+      ></Badge>
     </Tooltip>
   );
 }
diff --git a/frontend/src/desktop/components/shared/DefaultAppBanner.tsx b/frontend/src/desktop/components/shared/DefaultAppBanner.tsx
index 2ea007a4e8..cf843de9db 100644
--- a/frontend/src/desktop/components/shared/DefaultAppBanner.tsx
+++ b/frontend/src/desktop/components/shared/DefaultAppBanner.tsx
@@ -1,7 +1,7 @@
-import React, { useState } from 'react';
-import { useTranslation } from 'react-i18next';
-import { InfoBanner } from '@app/components/shared/InfoBanner';
-import { useDefaultApp } from '@app/hooks/useDefaultApp';
+import React, { useState } from "react";
+import { useTranslation } from "react-i18next";
+import { InfoBanner } from "@app/components/shared/InfoBanner";
+import { useDefaultApp } from "@app/hooks/useDefaultApp";
 
 export const DefaultAppBanner: React.FC = () => {
   const { t } = useTranslation();
@@ -15,8 +15,11 @@ export const DefaultAppBanner: React.FC = () => {
   return (
     <InfoBanner
       icon="picture-as-pdf-rounded"
-      message={t('defaultApp.prompt.message', 'Make Stirling PDF your default application for opening PDF files.')}
-      buttonText={t('defaultApp.setDefault', 'Set Default')}
+      message={t(
+        "defaultApp.prompt.message",
+        "Make Stirling PDF your default application for opening PDF files.",
+      )}
+      buttonText={t("defaultApp.setDefault", "Set Default")}
       buttonIcon="check-circle-rounded"
       onButtonClick={handleSetDefault}
       onDismiss={handleDismissPrompt}
diff --git a/frontend/src/desktop/components/shared/DisabledButtonWithTooltip.css b/frontend/src/desktop/components/shared/DisabledButtonWithTooltip.css
new file mode 100644
index 0000000000..4bea117789
--- /dev/null
+++ b/frontend/src/desktop/components/shared/DisabledButtonWithTooltip.css
@@ -0,0 +1,38 @@
+.locked-button {
+  width: 100%;
+  text-align: center;
+  cursor: not-allowed;
+  user-select: none;
+  border-radius: var(--mantine-radius-sm);
+  color: var(--mantine-color-dimmed);
+  font-size: var(--mantine-font-size-md);
+  background-color: var(--mantine-color-blue-light);
+  padding: var(--mantine-spacing-xs) var(--mantine-spacing-md);
+}
+
+.locked-button-tooltip {
+  position: absolute;
+  left: 50%;
+  transform: translateX(-50%);
+  bottom: calc(100% + 8px);
+  color: white;
+  white-space: nowrap;
+  pointer-events: none;
+  z-index: var(--mantine-z-index-popover);
+  box-shadow: var(--mantine-shadow-lg);
+  border-radius: var(--mantine-radius-sm);
+  font-size: var(--mantine-font-size-xs);
+  background-color: var(--mantine-color-dark-7);
+  padding: 6px var(--mantine-spacing-xs);
+}
+
+.locked-button-tooltip-arrow {
+  position: absolute;
+  top: 100%;
+  left: 50%;
+  transform: translateX(-50%);
+  border: 5px solid var(--mantine-color-dark-7);
+  border-left-color: transparent;
+  border-right-color: transparent;
+  border-bottom-color: transparent;
+}
diff --git a/frontend/src/desktop/components/shared/DisabledButtonWithTooltip.tsx b/frontend/src/desktop/components/shared/DisabledButtonWithTooltip.tsx
new file mode 100644
index 0000000000..49b458fc43
--- /dev/null
+++ b/frontend/src/desktop/components/shared/DisabledButtonWithTooltip.tsx
@@ -0,0 +1,44 @@
+import React from "react";
+import "@app/components/shared/DisabledButtonWithTooltip.css";
+
+interface DisabledButtonWithTooltipProps {
+  /** Tooltip text shown on hover */
+  tooltip: string;
+  children: React.ReactNode;
+  className?: string;
+  style?: React.CSSProperties;
+}
+
+/**
+ * A visually disabled button that still responds to hover (showing a tooltip).
+ * Mantine's disabled prop prevents pointer events entirely, so this is a plain
+ * div styled to match a disabled button with a custom hover tooltip.
+ */
+export function DisabledButtonWithTooltip({
+  tooltip,
+  children,
+  className,
+  style,
+}: DisabledButtonWithTooltipProps) {
+  const [hovered, setHovered] = React.useState(false);
+  return (
+    <div
+      className="relative w-full"
+      onMouseEnter={() => setHovered(true)}
+      onMouseLeave={() => setHovered(false)}
+    >
+      <div
+        className={`locked-button${className ? ` ${className}` : ""}`}
+        style={style}
+      >
+        {children}
+      </div>
+      {hovered && (
+        <div className="locked-button-tooltip">
+          {tooltip}
+          <div className="locked-button-tooltip-arrow" />
+        </div>
+      )}
+    </div>
+  );
+}
diff --git a/frontend/src/desktop/components/shared/SelfHostedOfflineBanner.tsx b/frontend/src/desktop/components/shared/SelfHostedOfflineBanner.tsx
index a622c7feda..ca75b03ec9 100644
--- a/frontend/src/desktop/components/shared/SelfHostedOfflineBanner.tsx
+++ b/frontend/src/desktop/components/shared/SelfHostedOfflineBanner.tsx
@@ -1,35 +1,51 @@
-import { useState, useEffect, useMemo } from 'react';
-import { Paper, Group, Text, ActionIcon, UnstyledButton, Popover, List, ScrollArea } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import LocalIcon from '@app/components/shared/LocalIcon';
-import { useToolWorkflow } from '@app/contexts/ToolWorkflowContext';
-import { useConversionCloudStatus } from '@app/hooks/useConversionCloudStatus';
-import { selfHostedServerMonitor, type SelfHostedServerState } from '@app/services/selfHostedServerMonitor';
-import { connectionModeService, type ConnectionMode } from '@app/services/connectionModeService';
-import { tauriBackendService } from '@app/services/tauriBackendService';
-import { endpointAvailabilityService } from '@app/services/endpointAvailabilityService';
-import { EXTENSION_TO_ENDPOINT, ENDPOINT_I18N } from '@app/constants/convertConstants';
-import { ENDPOINTS as SPLIT_ENDPOINTS } from '@app/constants/splitConstants';
-import type { ToolId } from '@app/types/toolId';
+import { useState, useEffect, useMemo } from "react";
+import {
+  Paper,
+  Group,
+  Text,
+  ActionIcon,
+  UnstyledButton,
+  Popover,
+  List,
+  ScrollArea,
+} from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import LocalIcon from "@app/components/shared/LocalIcon";
+import { useToolWorkflow } from "@app/contexts/ToolWorkflowContext";
+import { useConversionCloudStatus } from "@app/hooks/useConversionCloudStatus";
+import {
+  selfHostedServerMonitor,
+  type SelfHostedServerState,
+} from "@app/services/selfHostedServerMonitor";
+import {
+  connectionModeService,
+  type ConnectionMode,
+} from "@app/services/connectionModeService";
+import { tauriBackendService } from "@app/services/tauriBackendService";
+import { endpointAvailabilityService } from "@app/services/endpointAvailabilityService";
+import {
+  EXTENSION_TO_ENDPOINT,
+  ENDPOINT_I18N,
+} from "@app/constants/convertConstants";
+import { ENDPOINTS as SPLIT_ENDPOINTS } from "@app/constants/splitConstants";
+import type { ToolId } from "@app/types/toolId";
 
-const BANNER_BG = 'var(--mantine-color-gray-1)';
-const BANNER_BORDER = 'var(--mantine-color-gray-3)';
-const BANNER_TEXT = 'var(--mantine-color-gray-7)';
-const BANNER_ICON = 'var(--mantine-color-gray-5)';
-const BANNER_LINK = 'var(--mantine-color-gray-6)';
+const BANNER_BG = "var(--mantine-color-gray-1)";
+const BANNER_BORDER = "var(--mantine-color-gray-3)";
+const BANNER_TEXT = "var(--mantine-color-gray-7)";
+const BANNER_ICON = "var(--mantine-color-gray-5)";
+const BANNER_LINK = "var(--mantine-color-gray-6)";
 
 /** Maps split endpoint → [i18n key, English fallback] for the method name */
 const SPLIT_ENDPOINT_I18N: Record<string, [string, string]> = {
-  'split-pages':              ['split.methods.byPages.name',       'Pages'],
-  'split-pdf-by-sections':    ['split.methods.bySections.name',    'Sections'],
-  'split-by-size-or-count':   ['split.methods.bySize.name',        'File Size'],
-  'split-pdf-by-chapters':    ['split.methods.byChapters.name',    'Chapters'],
-  'auto-split-pdf':           ['split.methods.byPageDivider.name', 'Page Divider'],
-  'split-for-poster-print':   ['split.methods.byPoster.name',      'Printable Chunks'],
+  "split-pages": ["split.methods.byPages.name", "Pages"],
+  "split-pdf-by-sections": ["split.methods.bySections.name", "Sections"],
+  "split-by-size-or-count": ["split.methods.bySize.name", "File Size"],
+  "split-pdf-by-chapters": ["split.methods.byChapters.name", "Chapters"],
+  "auto-split-pdf": ["split.methods.byPageDivider.name", "Page Divider"],
+  "split-for-poster-print": ["split.methods.byPoster.name", "Printable Chunks"],
 };
 
-
-
 /**
  * Desktop-only banner shown when the user is in self-hosted mode and the
  * configured Stirling-PDF server is unreachable.
@@ -41,25 +57,29 @@ const SPLIT_ENDPOINT_I18N: Record<string, [string, string]> = {
  */
 export function SelfHostedOfflineBanner() {
   const { t } = useTranslation();
-  const [connectionMode, setConnectionMode] = useState<ConnectionMode | null>(null);
-  const [serverState, setServerState] = useState<SelfHostedServerState>(
-    () => selfHostedServerMonitor.getSnapshot()
+  const [connectionMode, setConnectionMode] = useState<ConnectionMode | null>(
+    null,
+  );
+  const [serverState, setServerState] = useState<SelfHostedServerState>(() =>
+    selfHostedServerMonitor.getSnapshot(),
   );
   const [dismissed, setDismissed] = useState(false);
   const [expanded, setExpanded] = useState(false);
   const [localBackendReady, setLocalBackendReady] = useState(
-    () => !!tauriBackendService.getBackendUrl()
+    () => !!tauriBackendService.getBackendUrl(),
   );
 
   // Load connection mode and keep it live via subscription
   useEffect(() => {
     void connectionModeService.getCurrentMode().then(setConnectionMode);
-    return connectionModeService.subscribeToModeChanges(config => setConnectionMode(config.mode));
+    return connectionModeService.subscribeToModeChanges((config) =>
+      setConnectionMode(config.mode),
+    );
   }, []);
 
   // Subscribe to self-hosted server status changes
   useEffect(() => {
-    const unsub = selfHostedServerMonitor.subscribe(state => {
+    const unsub = selfHostedServerMonitor.subscribe((state) => {
       setServerState(state);
       // Auto-collapse tool list when server comes back online
       if (state.isOnline) setExpanded(false);
@@ -81,9 +101,11 @@ export function SelfHostedOfflineBanner() {
   // Re-use conversion availability already computed by useConversionCloudStatus.
   const { availability: conversionAvailability } = useConversionCloudStatus();
 
-  const [splitAvailability, setSplitAvailability] = useState<Record<string, boolean>>({});
+  const [splitAvailability, setSplitAvailability] = useState<
+    Record<string, boolean>
+  >({});
   useEffect(() => {
-    if (serverState.status !== 'offline') {
+    if (serverState.status !== "offline") {
       setSplitAvailability({});
       return;
     }
@@ -92,13 +114,17 @@ export function SelfHostedOfflineBanner() {
       setSplitAvailability({});
       return;
     }
-    const uniqueEndpoints = [...new Set(Object.values(SPLIT_ENDPOINTS))] as string[];
+    const uniqueEndpoints = [
+      ...new Set(Object.values(SPLIT_ENDPOINTS)),
+    ] as string[];
     void Promise.all(
-      uniqueEndpoints.map(async ep => ({
+      uniqueEndpoints.map(async (ep) => ({
         ep,
-        supported: await endpointAvailabilityService.isEndpointSupportedLocally(ep, localUrl).catch(() => false),
-      }))
-    ).then(results => {
+        supported: await endpointAvailabilityService
+          .isEndpointSupportedLocally(ep, localUrl)
+          .catch(() => false),
+      })),
+    ).then((results) => {
       const map: Record<string, boolean> = {};
       for (const { ep, supported } of results) map[ep] = supported;
       setSplitAvailability(map);
@@ -108,19 +134,23 @@ export function SelfHostedOfflineBanner() {
   const allUnavailableNames = useMemo(() => {
     // Top-level tools unavailable in self-hosted offline mode
     const toolNames = (Object.keys(toolAvailability) as ToolId[])
-      .filter(id => toolAvailability[id]?.available === false && toolAvailability[id]?.reason === 'selfHostedOffline')
-      .map(id => toolRegistry[id]?.name ?? id)
-      .filter(Boolean) as string[];
+      .filter(
+        (id) =>
+          toolAvailability[id]?.available === false &&
+          toolAvailability[id]?.reason === "selfHostedOffline",
+      )
+      .map((id) => toolRegistry[id]?.name ?? id)
+      .filter(Boolean);
 
     // Use translated tool names from the registry as prefixes
-    const convertPrefix = toolRegistry['convert' as ToolId]?.name ?? 'Convert';
-    const splitPrefix = toolRegistry['split' as ToolId]?.name ?? 'Split';
+    const convertPrefix = toolRegistry["convert" as ToolId]?.name ?? "Convert";
+    const splitPrefix = toolRegistry["split" as ToolId]?.name ?? "Split";
 
     // Conversion types unavailable locally — deduplicated by endpoint
     const unavailableEndpoints = new Set<string>();
     for (const [key, available] of Object.entries(conversionAvailability)) {
       if (!available) {
-        const dashIdx = key.indexOf('-');
+        const dashIdx = key.indexOf("-");
         const fromExt = key.slice(0, dashIdx);
         const toExt = key.slice(dashIdx + 1);
         const endpoint = EXTENSION_TO_ENDPOINT[fromExt]?.[toExt];
@@ -128,11 +158,9 @@ export function SelfHostedOfflineBanner() {
       }
     }
     const conversionNames = [...unavailableEndpoints]
-      .map(ep => {
+      .map((ep) => {
         const i18n = ENDPOINT_I18N[ep];
-        const suffix = i18n
-          ? (i18n[0] ? t(i18n[0], i18n[1]) : i18n[1])
-          : ep;
+        const suffix = i18n ? (i18n[0] ? t(i18n[0], i18n[1]) : i18n[1]) : ep;
         return `${convertPrefix}: ${suffix}`;
       })
       .filter(Boolean);
@@ -148,19 +176,31 @@ export function SelfHostedOfflineBanner() {
       .filter(Boolean);
 
     return [...toolNames, ...conversionNames, ...unavailableSplitNames].sort();
-  }, [toolAvailability, toolRegistry, conversionAvailability, splitAvailability, t]);
+  }, [
+    toolAvailability,
+    toolRegistry,
+    conversionAvailability,
+    splitAvailability,
+    t,
+  ]);
 
   // Only show when in self-hosted mode, server confirmed offline, and not dismissed
   const show =
     !dismissed &&
-    connectionMode === 'selfhosted' &&
-    serverState.status === 'offline';
+    connectionMode === "selfhosted" &&
+    serverState.status === "offline";
 
   if (!show) return null;
 
   const messageText = localBackendReady
-    ? t('selfHosted.offline.messageWithFallback', 'Some tools require a server connection.')
-    : t('selfHosted.offline.messageNoFallback', 'Tools are unavailable until your server comes back online.');
+    ? t(
+        "selfHosted.offline.messageWithFallback",
+        "Some tools require a server connection.",
+      )
+    : t(
+        "selfHosted.offline.messageNoFallback",
+        "Tools are unavailable until your server comes back online.",
+      );
 
   return (
     <Paper
@@ -170,18 +210,43 @@ export function SelfHostedOfflineBanner() {
         borderBottom: `1px solid ${BANNER_BORDER}`,
       }}
     >
-      <Group gap="xs" align="center" wrap="nowrap" justify="space-between" px="sm" py={6}>
-        <Group gap="xs" align="center" wrap="nowrap" style={{ minWidth: 0, flex: 1 }}>
+      <Group
+        gap="xs"
+        align="center"
+        wrap="nowrap"
+        justify="space-between"
+        px="sm"
+        py={6}
+      >
+        <Group
+          gap="xs"
+          align="center"
+          wrap="nowrap"
+          style={{ minWidth: 0, flex: 1 }}
+        >
           <LocalIcon
             icon="warning-rounded"
             width="1rem"
             height="1rem"
             style={{ color: BANNER_ICON, flexShrink: 0 }}
           />
-          <Text size="xs" fw={600} style={{ color: BANNER_TEXT, flexShrink: 0 }}>
-            {t('selfHosted.offline.title', 'Server unreachable')}
+          <Text
+            size="xs"
+            fw={600}
+            style={{ color: BANNER_TEXT, flexShrink: 0 }}
+          >
+            {t("selfHosted.offline.title", "Server unreachable")}
           </Text>
-          <Text size="xs" style={{ color: BANNER_TEXT, opacity: 0.8, overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap' }}>
+          <Text
+            size="xs"
+            style={{
+              color: BANNER_TEXT,
+              opacity: 0.8,
+              overflow: "hidden",
+              textOverflow: "ellipsis",
+              whiteSpace: "nowrap",
+            }}
+          >
             {messageText}
           </Text>
         </Group>
@@ -196,18 +261,30 @@ export function SelfHostedOfflineBanner() {
           >
             <Popover.Target>
               <UnstyledButton
-                onClick={() => setExpanded(e => !e)}
-                style={{ color: BANNER_LINK, fontSize: 'var(--mantine-font-size-xs)', fontWeight: 500, flexShrink: 0, whiteSpace: 'nowrap' }}
+                onClick={() => setExpanded((e) => !e)}
+                style={{
+                  color: BANNER_LINK,
+                  fontSize: "var(--mantine-font-size-xs)",
+                  fontWeight: 500,
+                  flexShrink: 0,
+                  whiteSpace: "nowrap",
+                }}
               >
                 {expanded
-                  ? t('selfHosted.offline.hideTools', 'Hide unavailable tools â–´')
-                  : t('selfHosted.offline.showTools', 'View unavailable tools â–¾')}
+                  ? t(
+                      "selfHosted.offline.hideTools",
+                      "Hide unavailable tools â–´",
+                    )
+                  : t(
+                      "selfHosted.offline.showTools",
+                      "View unavailable tools â–¾",
+                    )}
               </UnstyledButton>
             </Popover.Target>
             <Popover.Dropdown p="xs">
               <ScrollArea.Autosize mah={300}>
                 <List size="xs" spacing={2}>
-                  {allUnavailableNames.map(name => (
+                  {allUnavailableNames.map((name) => (
                     <List.Item key={name}>{name}</List.Item>
                   ))}
                 </List>
@@ -219,7 +296,7 @@ export function SelfHostedOfflineBanner() {
           variant="subtle"
           size="xs"
           onClick={() => setDismissed(true)}
-          aria-label={t('close', 'Close')}
+          aria-label={t("close", "Close")}
           style={{ color: BANNER_TEXT }}
         >
           <LocalIcon icon="close-rounded" width="0.8rem" height="0.8rem" />
diff --git a/frontend/src/desktop/components/shared/TeamInvitationBanner.tsx b/frontend/src/desktop/components/shared/TeamInvitationBanner.tsx
index 24bc0cb1e9..5389274986 100644
--- a/frontend/src/desktop/components/shared/TeamInvitationBanner.tsx
+++ b/frontend/src/desktop/components/shared/TeamInvitationBanner.tsx
@@ -1,15 +1,16 @@
-import { useState, useEffect } from 'react';
-import { Button, Group, Text } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import LocalIcon from '@app/components/shared/LocalIcon';
-import { InfoBanner } from '@app/components/shared/InfoBanner';
-import { useSaaSTeam } from '@app/contexts/SaaSTeamContext';
-import { useSaaSBilling } from '@app/contexts/SaasBillingContext';
-import { connectionModeService } from '@app/services/connectionModeService';
+import { useState, useEffect } from "react";
+import { Button, Group, Text } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import LocalIcon from "@app/components/shared/LocalIcon";
+import { InfoBanner } from "@app/components/shared/InfoBanner";
+import { useSaaSTeam } from "@app/contexts/SaaSTeamContext";
+import { useSaaSBilling } from "@app/contexts/SaasBillingContext";
+import { connectionModeService } from "@app/services/connectionModeService";
 
 export function TeamInvitationBanner() {
   const { t } = useTranslation();
-  const { receivedInvitations, acceptInvitation, rejectInvitation } = useSaaSTeam();
+  const { receivedInvitations, acceptInvitation, rejectInvitation } =
+    useSaaSTeam();
   const { refreshBilling } = useSaaSBilling();
 
   const [processing, setProcessing] = useState(false);
@@ -18,7 +19,9 @@ export function TeamInvitationBanner() {
 
   // Load connection mode on mount
   useEffect(() => {
-    connectionModeService.getCurrentMode().then(mode => setConnectionMode(mode));
+    connectionModeService
+      .getCurrentMode()
+      .then((mode) => setConnectionMode(mode));
   }, []);
 
   // Accept invitation handler
@@ -30,18 +33,26 @@ export function TeamInvitationBanner() {
 
     try {
       await acceptInvitation(invitation.invitationToken);
-      console.log('[TeamInvitationBanner] Invitation accepted successfully:', invitation.teamName);
+      console.log(
+        "[TeamInvitationBanner] Invitation accepted successfully:",
+        invitation.teamName,
+      );
 
       // Wait briefly for backend to process team membership update
-      await new Promise(resolve => setTimeout(resolve, 1000));
+      await new Promise((resolve) => setTimeout(resolve, 1000));
 
       // Refresh billing after joining team (tier may have changed)
-      console.log('[TeamInvitationBanner] Refreshing billing after team join...');
+      console.log(
+        "[TeamInvitationBanner] Refreshing billing after team join...",
+      );
       await refreshBilling();
 
       setDismissed(true);
     } catch (error) {
-      console.error('[TeamInvitationBanner] Failed to accept invitation:', error);
+      console.error(
+        "[TeamInvitationBanner] Failed to accept invitation:",
+        error,
+      );
     } finally {
       setProcessing(false);
     }
@@ -56,10 +67,13 @@ export function TeamInvitationBanner() {
 
     try {
       await rejectInvitation(invitation.invitationToken);
-      console.log('[TeamInvitationBanner] Invitation rejected');
+      console.log("[TeamInvitationBanner] Invitation rejected");
       setDismissed(true);
     } catch (error) {
-      console.error('[TeamInvitationBanner] Failed to reject invitation:', error);
+      console.error(
+        "[TeamInvitationBanner] Failed to reject invitation:",
+        error,
+      );
     } finally {
       setProcessing(false);
     }
@@ -67,17 +81,21 @@ export function TeamInvitationBanner() {
 
   // Visibility logic
   const shouldShow =
-    connectionMode === 'saas' &&
-    !dismissed &&
-    receivedInvitations.length > 0;
+    connectionMode === "saas" && !dismissed && receivedInvitations.length > 0;
 
   if (!shouldShow) return null;
 
   const invitation = receivedInvitations[0]; // Show first invitation
 
   const message = (
-    <Text component="span" size="sm" fw={500} style={{ color: 'rgba(255, 255, 255, 0.95)' }}>
-      <strong>{invitation.inviterEmail}</strong> {t('team.invitationBanner.message', 'has invited you to join')}{' '}
+    <Text
+      component="span"
+      size="sm"
+      fw={500}
+      style={{ color: "rgba(255, 255, 255, 0.95)" }}
+    >
+      <strong>{invitation.inviterEmail}</strong>{" "}
+      {t("team.invitationBanner.message", "has invited you to join")}{" "}
       <strong>{invitation.teamName}</strong>
     </Text>
   );
@@ -90,23 +108,30 @@ export function TeamInvitationBanner() {
         size="xs"
         onClick={handleAccept}
         loading={processing}
-        leftSection={<LocalIcon icon="check" width="0.9rem" height="0.9rem" style={{ color: 'var(--mantine-color-dark-9)' }} />}
+        leftSection={
+          <LocalIcon
+            icon="check"
+            width="0.9rem"
+            height="0.9rem"
+            style={{ color: "var(--mantine-color-dark-9)" }}
+          />
+        }
         styles={{
           label: {
-            color: 'var(--mantine-color-dark-9)',
+            color: "var(--mantine-color-dark-9)",
           },
         }}
       >
-        {t('team.invitationBanner.acceptButton', 'Accept')}
+        {t("team.invitationBanner.acceptButton", "Accept")}
       </Button>
       <Button
         variant="subtle"
         size="xs"
         onClick={handleReject}
         loading={processing}
-        style={{ color: 'rgba(255, 255, 255, 0.7)' }}
+        style={{ color: "rgba(255, 255, 255, 0.7)" }}
       >
-        {t('team.invitationBanner.rejectButton', 'Decline')}
+        {t("team.invitationBanner.rejectButton", "Decline")}
       </Button>
     </Group>
   );
@@ -115,7 +140,12 @@ export function TeamInvitationBanner() {
     <InfoBanner
       icon="mail"
       message={
-        <Group justify="space-between" align="center" wrap="nowrap" style={{ width: '100%' }}>
+        <Group
+          justify="space-between"
+          align="center"
+          wrap="nowrap"
+          style={{ width: "100%" }}
+        >
           {message}
           {actionButtons}
         </Group>
diff --git a/frontend/src/desktop/components/shared/billing/SaaSStripeCheckout.tsx b/frontend/src/desktop/components/shared/billing/SaaSStripeCheckout.tsx
index e8d9fb86ff..cf5918564e 100644
--- a/frontend/src/desktop/components/shared/billing/SaaSStripeCheckout.tsx
+++ b/frontend/src/desktop/components/shared/billing/SaaSStripeCheckout.tsx
@@ -1,12 +1,12 @@
-import React, { useState, useEffect } from 'react';
-import { Modal, Button, Text, Alert, Loader, Stack } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { saasBillingService } from '@app/services/saasBillingService';
-import { Z_INDEX_OVER_CONFIG_MODAL } from '@app/styles/zIndex';
-import OpenInBrowserIcon from '@mui/icons-material/OpenInBrowser';
+import React, { useState, useEffect } from "react";
+import { Modal, Button, Text, Alert, Loader, Stack } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import { saasBillingService } from "@app/services/saasBillingService";
+import { Z_INDEX_OVER_CONFIG_MODAL } from "@app/styles/zIndex";
+import OpenInBrowserIcon from "@mui/icons-material/OpenInBrowser";
 
 type CheckoutState = {
-  status: 'idle' | 'loading' | 'opened' | 'refreshing' | 'error';
+  status: "idle" | "loading" | "opened" | "refreshing" | "error";
   error?: string;
   sessionPlanId?: string;
 };
@@ -22,49 +22,52 @@ export const SaaSStripeCheckout: React.FC<SaaSStripeCheckoutProps> = ({
   opened,
   onClose,
   planId,
-  onSuccess
+  onSuccess,
 }) => {
   const { t } = useTranslation();
-  const [state, setState] = useState<CheckoutState>({ status: 'idle' });
+  const [state, setState] = useState<CheckoutState>({ status: "idle" });
 
   const createCheckoutSession = async () => {
     if (!planId) {
-      setState({ status: 'error', error: 'No plan selected' });
+      setState({ status: "error", error: "No plan selected" });
       return;
     }
 
     try {
-      setState({ status: 'loading' });
+      setState({ status: "loading" });
 
       // Map UI plan IDs to Stripe plan IDs
-      const stripePlanId = planId === 'team' ? 'pro' : planId;
+      const stripePlanId = planId === "team" ? "pro" : planId;
 
       // Open checkout in browser (returns void, opens browser window)
       await saasBillingService.openCheckout(
-        stripePlanId as 'pro',
-        window.location.origin
+        stripePlanId as "pro",
+        window.location.origin,
       );
 
       setState({
-        status: 'opened',
-        sessionPlanId: planId
+        status: "opened",
+        sessionPlanId: planId,
       });
     } catch (err) {
-      const errorMessage = err instanceof Error ? err.message : 'Failed to create checkout session';
-      console.error('[SaaSStripeCheckout] Error creating checkout:', err);
+      const errorMessage =
+        err instanceof Error
+          ? err.message
+          : "Failed to create checkout session";
+      console.error("[SaaSStripeCheckout] Error creating checkout:", err);
       setState({
-        status: 'error',
-        error: errorMessage
+        status: "error",
+        error: errorMessage,
       });
     }
   };
 
   const handleRefreshClick = async () => {
-    console.log('[SaaSStripeCheckout] User requested refresh after checkout');
-    setState({ ...state, status: 'refreshing' });
+    console.log("[SaaSStripeCheckout] User requested refresh after checkout");
+    setState({ ...state, status: "refreshing" });
 
     // Give Stripe webhooks a moment to process (2-3 seconds)
-    await new Promise(resolve => setTimeout(resolve, 2000));
+    await new Promise((resolve) => setTimeout(resolve, 2000));
 
     // Trigger the refresh
     if (onSuccess) {
@@ -77,7 +80,7 @@ export const SaaSStripeCheckout: React.FC<SaaSStripeCheckoutProps> = ({
 
   const handleClose = () => {
     // Reset state to idle to clean up the session
-    setState({ status: 'idle', error: undefined, sessionPlanId: undefined });
+    setState({ status: "idle", error: undefined, sessionPlanId: undefined });
     onClose();
   };
 
@@ -86,38 +89,48 @@ export const SaaSStripeCheckout: React.FC<SaaSStripeCheckoutProps> = ({
     if (opened) {
       // Check if we need a new session (first time or plan changed)
       const needsNewSession =
-        state.status === 'idle' ||
+        state.status === "idle" ||
         !state.sessionPlanId ||
         state.sessionPlanId !== planId;
 
       if (needsNewSession) {
-        console.log('[SaaSStripeCheckout] Opening checkout in browser for plan:', planId);
+        console.log(
+          "[SaaSStripeCheckout] Opening checkout in browser for plan:",
+          planId,
+        );
         createCheckoutSession();
       }
     } else if (!opened) {
       // Clean up state when modal closes
-      setState({ status: 'idle', error: undefined, sessionPlanId: undefined });
+      setState({ status: "idle", error: undefined, sessionPlanId: undefined });
     }
   }, [opened, planId]);
 
   const renderContent = () => {
     switch (state.status) {
-      case 'loading':
+      case "loading":
         return (
           <div className="flex flex-col items-center justify-center py-8">
             <Loader size="lg" />
             <Text size="sm" c="dimmed" mt="md">
-              {t('payment.preparing', 'Preparing your checkout...')}
+              {t("payment.preparing", "Preparing your checkout...")}
             </Text>
           </div>
         );
 
-      case 'opened':
+      case "opened":
         return (
-          <Alert color="blue" title={t('payment.checkoutOpened', 'Checkout Opened in Browser')} icon={<OpenInBrowserIcon />}>
+          <Alert
+            color="blue"
+            title={t("payment.checkoutOpened", "Checkout Opened in Browser")}
+            icon={<OpenInBrowserIcon />}
+          >
             <Stack gap="md">
               <Text size="sm">
-                {t('payment.checkoutInstructions', 'Complete your purchase in the browser window that just opened. After payment is complete, return here and click the button below to refresh your billing information.')}
+                {t(
+                  "payment.checkoutInstructions",
+                  "Complete your purchase in the browser window that just opened. After payment is complete, return here and click the button below to refresh your billing information.",
+                )}
               </Text>
               <Button
                 variant="filled"
@@ -125,26 +138,25 @@ export const SaaSStripeCheckout: React.FC<SaaSStripeCheckoutProps> = ({
                 onClick={handleRefreshClick}
                 fullWidth
               >
-                {t('payment.refreshBilling', 'I\'ve Completed Payment - Refresh Billing')}
+                {t(
+                  "payment.refreshBilling",
+                  "I've Completed Payment - Refresh Billing",
+                )}
               </Button>
-              <Button
-                variant="subtle"
-                onClick={handleClose}
-                fullWidth
-              >
-                {t('payment.closeLater', 'I\'ll Do This Later')}
+              <Button variant="subtle" onClick={handleClose} fullWidth>
+                {t("payment.closeLater", "I'll Do This Later")}
               </Button>
             </Stack>
           </Alert>
         );
 
-      case 'error':
+      case "error":
         return (
-          <Alert color="red" title={t('payment.error', 'Payment Error')}>
+          <Alert color="red" title={t("payment.error", "Payment Error")}>
             <Stack gap="md">
               <Text size="sm">{state.error}</Text>
               <Button variant="outline" onClick={handleClose}>
-                {t('common.close', 'Close')}
+                {t("common.close", "Close")}
               </Button>
             </Stack>
           </Alert>
@@ -156,9 +168,9 @@ export const SaaSStripeCheckout: React.FC<SaaSStripeCheckoutProps> = ({
   };
 
   const getPlanName = () => {
-    if (planId === 'team') return t('plan.team.name', 'Team');
-    if (planId === 'enterprise') return t('plan.enterprise.name', 'Enterprise');
-    return t('plan.free.name', 'Free');
+    if (planId === "team") return t("plan.team.name", "Team");
+    if (planId === "enterprise") return t("plan.enterprise.name", "Enterprise");
+    return t("plan.free.name", "Free");
   };
 
   return (
@@ -168,7 +180,9 @@ export const SaaSStripeCheckout: React.FC<SaaSStripeCheckoutProps> = ({
       title={
         <div>
           <Text fw={600} size="lg">
-            {t('payment.upgradeTitle', 'Upgrade to {{planName}}', { planName: getPlanName() })}
+            {t("payment.upgradeTitle", "Upgrade to {{planName}}", {
+              planName: getPlanName(),
+            })}
           </Text>
         </div>
       }
diff --git a/frontend/src/desktop/components/shared/config/configNavSections.tsx b/frontend/src/desktop/components/shared/config/configNavSections.tsx
index 5933744f19..d95a356099 100644
--- a/frontend/src/desktop/components/shared/config/configNavSections.tsx
+++ b/frontend/src/desktop/components/shared/config/configNavSections.tsx
@@ -1,14 +1,20 @@
-import { useTranslation } from 'react-i18next';
-import { useState, useEffect } from 'react';
-import { useConfigNavSections as useProprietaryConfigNavSections, createConfigNavSections as createProprietaryConfigNavSections } from '@proprietary/components/shared/config/configNavSections';
-import { ConfigNavSection } from '@core/components/shared/config/configNavSections';
-import { ConnectionSettings } from '@app/components/ConnectionSettings';
-import { SaasPlanSection } from '@app/components/shared/config/configSections/SaasPlanSection';
-import { SaaSTeamsSection } from '@app/components/shared/config/configSections/SaaSTeamsSection';
-import { connectionModeService } from '@app/services/connectionModeService';
-import { authService } from '@app/services/authService';
+import { useTranslation } from "react-i18next";
+import { useState, useEffect } from "react";
+import {
+  useConfigNavSections as useProprietaryConfigNavSections,
+  createConfigNavSections as createProprietaryConfigNavSections,
+} from "@proprietary/components/shared/config/configNavSections";
+import { ConfigNavSection } from "@core/components/shared/config/configNavSections";
+import { ConnectionSettings } from "@app/components/ConnectionSettings";
+import { SaasPlanSection } from "@app/components/shared/config/configSections/SaasPlanSection";
+import { SaaSTeamsSection } from "@app/components/shared/config/configSections/SaaSTeamsSection";
+import { connectionModeService } from "@app/services/connectionModeService";
+import { authService } from "@app/services/authService";
 
-export type { ConfigNavSection, ConfigNavItem } from '@core/components/shared/config/configNavSections';
+export type {
+  ConfigNavSection,
+  ConfigNavItem,
+} from "@core/components/shared/config/configNavSections";
 
 /**
  * Hook version of desktop config nav sections with proper i18n support
@@ -16,7 +22,7 @@ export type { ConfigNavSection, ConfigNavItem } from '@core/components/shared/co
 export const useConfigNavSections = (
   isAdmin: boolean = false,
   runningEE: boolean = false,
-  loginEnabled: boolean = false
+  loginEnabled: boolean = false,
 ): ConfigNavSection[] => {
   const { t } = useTranslation();
 
@@ -25,30 +31,36 @@ export const useConfigNavSections = (
 
   useEffect(() => {
     void connectionModeService.getCurrentMode().then(setConnectionMode);
-    return connectionModeService.subscribeToModeChanges(config => setConnectionMode(config.mode));
+    return connectionModeService.subscribeToModeChanges((config) =>
+      setConnectionMode(config.mode),
+    );
   }, []);
 
   // Subscribe to auth changes
   useEffect(() => {
     const unsubscribe = authService.subscribeToAuth((status) => {
-      setIsAuthenticated(status === 'authenticated');
+      setIsAuthenticated(status === "authenticated");
     });
     return unsubscribe;
   }, []);
 
-  const isSaasMode = connectionMode === 'saas';
-  const isLocalMode = connectionMode === 'local';
+  const isSaasMode = connectionMode === "saas";
+  const isLocalMode = connectionMode === "local";
 
   // Get the proprietary sections (includes core Preferences + admin sections)
-  const sections = useProprietaryConfigNavSections(isAdmin, runningEE, loginEnabled);
+  const sections = useProprietaryConfigNavSections(
+    isAdmin,
+    runningEE,
+    loginEnabled,
+  );
 
   const connectionModeSection: ConfigNavSection = {
-    title: t('settings.connection.title', 'Connection Mode'),
+    title: t("settings.connection.title", "Connection Mode"),
     items: [
       {
-        key: 'connectionMode',
-        label: t('settings.connection.title', 'Connection Mode'),
-        icon: 'desktop-cloud-rounded',
+        key: "connectionMode",
+        label: t("settings.connection.title", "Connection Mode"),
+        icon: "desktop-cloud-rounded",
         component: <ConnectionSettings />,
       },
     ],
@@ -66,11 +78,11 @@ export const useConfigNavSections = (
   // Identifies self-hosted admin sections by their first item's stable key.
   // Using item keys avoids dependency on translated section titles (#17).
   const SELF_HOSTED_SECTION_FIRST_KEYS = new Set([
-    'people',        // Workspace section
-    'adminGeneral',  // Configuration section
-    'adminSecurity', // Security & Authentication section
-    'adminPlan',     // Licensing & Analytics section
-    'adminLegal',    // Policies & Privacy section
+    "people", // Workspace section
+    "adminGeneral", // Configuration section
+    "adminSecurity", // Security & Authentication section
+    "adminPlan", // Licensing & Analytics section
+    "adminLegal", // Policies & Privacy section
   ]);
 
   // Build the result array explicitly instead of splice with hardcoded indices (#18).
@@ -85,23 +97,23 @@ export const useConfigNavSections = (
   // Plan & Billing and Team sections only when authenticated in SaaS mode
   if (isSaasMode && isAuthenticated) {
     result.push({
-      title: t('settings.planBilling.title', 'Plan & Billing'),
+      title: t("settings.planBilling.title", "Plan & Billing"),
       items: [
         {
-          key: 'planBilling',
-          label: t('settings.planBilling.title', 'Plan & Billing'),
-          icon: 'credit-card',
+          key: "planBilling",
+          label: t("settings.planBilling.title", "Plan & Billing"),
+          icon: "credit-card",
           component: <SaasPlanSection />,
         },
       ],
     });
     result.push({
-      title: t('settings.team.title', 'Team'),
+      title: t("settings.team.title", "Team"),
       items: [
         {
-          key: 'teams',
-          label: t('settings.team.title', 'Team'),
-          icon: 'groups-rounded',
+          key: "teams",
+          label: t("settings.team.title", "Team"),
+          icon: "groups-rounded",
           component: <SaaSTeamsSection />,
         },
       ],
@@ -112,12 +124,16 @@ export const useConfigNavSections = (
   // and hiding the Account section when not authenticated.
   for (const section of sections.slice(1)) {
     const firstItemKey = section.items[0]?.key;
-    if (isSaasMode && firstItemKey && SELF_HOSTED_SECTION_FIRST_KEYS.has(firstItemKey)) {
+    if (
+      isSaasMode &&
+      firstItemKey &&
+      SELF_HOSTED_SECTION_FIRST_KEYS.has(firstItemKey)
+    ) {
       continue;
     }
     const filteredItems = isAuthenticated
       ? section.items
-      : section.items.filter(item => item.key !== 'account');
+      : section.items.filter((item) => item.key !== "account");
     if (filteredItems.length === 0) continue;
     result.push({ ...section, items: filteredItems });
   }
@@ -132,21 +148,27 @@ export const useConfigNavSections = (
 export const createConfigNavSections = (
   isAdmin: boolean = false,
   runningEE: boolean = false,
-  loginEnabled: boolean = false
+  loginEnabled: boolean = false,
 ): ConfigNavSection[] => {
-  console.warn('createConfigNavSections is deprecated. Use useConfigNavSections hook instead for proper i18n support.');
+  console.warn(
+    "createConfigNavSections is deprecated. Use useConfigNavSections hook instead for proper i18n support.",
+  );
 
   // Get the proprietary sections (includes core Preferences + admin sections)
-  const sections = createProprietaryConfigNavSections(isAdmin, runningEE, loginEnabled);
+  const sections = createProprietaryConfigNavSections(
+    isAdmin,
+    runningEE,
+    loginEnabled,
+  );
 
   // Add Connection section at the beginning (after Preferences)
   sections.splice(1, 0, {
-    title: 'Connection',
+    title: "Connection",
     items: [
       {
-        key: 'connectionMode',
-        label: 'Connection Mode',
-        icon: 'desktop-cloud-rounded',
+        key: "connectionMode",
+        label: "Connection Mode",
+        icon: "desktop-cloud-rounded",
         component: <ConnectionSettings />,
       },
     ],
@@ -154,12 +176,12 @@ export const createConfigNavSections = (
 
   // Add Plan & Billing section (after Connection Mode)
   sections.splice(2, 0, {
-    title: 'Plan & Billing',
+    title: "Plan & Billing",
     items: [
       {
-        key: 'planBilling',
-        label: 'Plan & Billing',
-        icon: 'credit-card',
+        key: "planBilling",
+        label: "Plan & Billing",
+        icon: "credit-card",
         component: <SaasPlanSection />,
       },
     ],
diff --git a/frontend/src/desktop/components/shared/config/configSections/DefaultAppSettings.tsx b/frontend/src/desktop/components/shared/config/configSections/DefaultAppSettings.tsx
index 5a316a203d..f4ca397032 100644
--- a/frontend/src/desktop/components/shared/config/configSections/DefaultAppSettings.tsx
+++ b/frontend/src/desktop/components/shared/config/configSections/DefaultAppSettings.tsx
@@ -1,7 +1,7 @@
-import React from 'react';
-import { Paper, Text, Button, Group } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { useDefaultApp } from '@app/hooks/useDefaultApp';
+import React from "react";
+import { Paper, Text, Button, Group } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import { useDefaultApp } from "@app/hooks/useDefaultApp";
 
 export const DefaultAppSettings: React.FC = () => {
   const { t } = useTranslation();
@@ -12,18 +12,24 @@ export const DefaultAppSettings: React.FC = () => {
       <Group justify="space-between" align="center">
         <div>
           <Text fw={500} size="sm">
-            {t('settings.general.defaultPdfEditor', 'Default PDF editor')}
+            {t("settings.general.defaultPdfEditor", "Default PDF editor")}
           </Text>
           <Text size="xs" c="dimmed" mt={4}>
             {isDefault === true
-              ? t('settings.general.defaultPdfEditorActive', 'Stirling PDF is your default PDF editor')
+              ? t(
+                  "settings.general.defaultPdfEditorActive",
+                  "Stirling PDF is your default PDF editor",
+                )
               : isDefault === false
-              ? t('settings.general.defaultPdfEditorInactive', 'Another application is set as default')
-              : t('settings.general.defaultPdfEditorChecking', 'Checking...')}
+                ? t(
+                    "settings.general.defaultPdfEditorInactive",
+                    "Another application is set as default",
+                  )
+                : t("settings.general.defaultPdfEditorChecking", "Checking...")}
           </Text>
         </div>
         <Button
-          variant={isDefault ? 'light' : 'filled'}
+          variant={isDefault ? "light" : "filled"}
           color="blue"
           size="sm"
           onClick={handleSetDefault}
@@ -31,8 +37,8 @@ export const DefaultAppSettings: React.FC = () => {
           disabled={isDefault === true}
         >
           {isDefault
-            ? t('settings.general.defaultPdfEditorSet', 'Already Default')
-            : t('settings.general.setAsDefault', 'Set as Default')}
+            ? t("settings.general.defaultPdfEditorSet", "Already Default")
+            : t("settings.general.setAsDefault", "Set as Default")}
         </Button>
       </Group>
     </Paper>
diff --git a/frontend/src/desktop/components/shared/config/configSections/GeneralSection.tsx b/frontend/src/desktop/components/shared/config/configSections/GeneralSection.tsx
index dbe9a00383..ab20c9d3e5 100644
--- a/frontend/src/desktop/components/shared/config/configSections/GeneralSection.tsx
+++ b/frontend/src/desktop/components/shared/config/configSections/GeneralSection.tsx
@@ -1,7 +1,7 @@
-import React from 'react';
-import { Stack } from '@mantine/core';
-import CoreGeneralSection from '@core/components/shared/config/configSections/GeneralSection';
-import { DefaultAppSettings } from '@app/components/shared/config/configSections/DefaultAppSettings';
+import React from "react";
+import { Stack } from "@mantine/core";
+import CoreGeneralSection from "@core/components/shared/config/configSections/GeneralSection";
+import { DefaultAppSettings } from "@app/components/shared/config/configSections/DefaultAppSettings";
 
 /**
  * Desktop extension of GeneralSection that adds default PDF editor settings
diff --git a/frontend/src/desktop/components/shared/config/configSections/SaaSTeamsSection.tsx b/frontend/src/desktop/components/shared/config/configSections/SaaSTeamsSection.tsx
index 35a0b74fb8..b172f71284 100644
--- a/frontend/src/desktop/components/shared/config/configSections/SaaSTeamsSection.tsx
+++ b/frontend/src/desktop/components/shared/config/configSections/SaaSTeamsSection.tsx
@@ -1,11 +1,27 @@
-import React, { useState, useEffect } from 'react';
-import { Button, TextInput, Group, Text, Stack, Alert, Table, Badge, ActionIcon, Menu, List, ThemeIcon, Modal, CloseButton, Anchor } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { useSaaSTeam } from '@app/contexts/SaaSTeamContext';
-import { useSaaSBilling } from '@app/contexts/SaasBillingContext';
-import LocalIcon from '@app/components/shared/LocalIcon';
-import { Z_INDEX_OVER_CONFIG_MODAL } from '@app/styles/zIndex';
-import apiClient from '@app/services/apiClient';
+import React, { useState, useEffect } from "react";
+import {
+  Button,
+  TextInput,
+  Group,
+  Text,
+  Stack,
+  Alert,
+  Table,
+  Badge,
+  ActionIcon,
+  Menu,
+  List,
+  ThemeIcon,
+  Modal,
+  CloseButton,
+  Anchor,
+} from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import { useSaaSTeam } from "@app/contexts/SaaSTeamContext";
+import { useSaaSBilling } from "@app/contexts/SaasBillingContext";
+import LocalIcon from "@app/components/shared/LocalIcon";
+import { Z_INDEX_OVER_CONFIG_MODAL } from "@app/styles/zIndex";
+import apiClient from "@app/services/apiClient";
 
 /**
  * Desktop SaaS Teams Section
@@ -29,9 +45,9 @@ export function SaaSTeamsSection() {
 
   // Check Pro status via billing context
   const { tier } = useSaaSBilling();
-  const isPro = tier !== 'free';
+  const isPro = tier !== "free";
 
-  const [inviteEmail, setInviteEmail] = useState('');
+  const [inviteEmail, setInviteEmail] = useState("");
   const [inviting, setInviting] = useState(false);
   const [error, setError] = useState<string | null>(null);
   const [success, setSuccess] = useState<string | null>(null);
@@ -39,7 +55,7 @@ export function SaaSTeamsSection() {
 
   // Team rename state
   const [isEditingName, setIsEditingName] = useState(false);
-  const [newTeamName, setNewTeamName] = useState('');
+  const [newTeamName, setNewTeamName] = useState("");
   const [renamingTeam, setRenamingTeam] = useState(false);
 
   // Refresh team data on mount and every 10 seconds
@@ -56,7 +72,9 @@ export function SaaSTeamsSection() {
   }, []); // Only run on mount/unmount
 
   const navigateToPlan = () => {
-    window.dispatchEvent(new CustomEvent('appConfig:navigate', { detail: { key: 'planBilling' } }));
+    window.dispatchEvent(
+      new CustomEvent("appConfig:navigate", { detail: { key: "planBilling" } }),
+    );
   };
 
   const handleInvite = async (e: React.FormEvent) => {
@@ -69,37 +87,71 @@ export function SaaSTeamsSection() {
 
     try {
       await inviteUser(inviteEmail);
-      setSuccess(t('team.inviteSent', 'Invitation sent to {{email}}', { email: inviteEmail }));
-      setInviteEmail('');
+      setSuccess(
+        t("team.inviteSent", "Invitation sent to {{email}}", {
+          email: inviteEmail,
+        }),
+      );
+      setInviteEmail("");
     } catch (err) {
       const error = err as { response?: { data?: { error?: string } } };
-      setError(error.response?.data?.error || t('team.inviteError', 'Failed to send invitation'));
+      setError(
+        error.response?.data?.error ||
+          t("team.inviteError", "Failed to send invitation"),
+      );
     } finally {
       setInviting(false);
     }
   };
 
   const handleRemove = async (memberId: number, memberEmail: string) => {
-    if (!window.confirm(t('team.confirmRemove', 'Remove {{email}} from the team?', { email: memberEmail }))) return;
+    if (
+      !window.confirm(
+        t("team.confirmRemove", "Remove {{email}} from the team?", {
+          email: memberEmail,
+        }),
+      )
+    )
+      return;
 
     try {
       await removeMember(memberId);
-      setSuccess(t('team.memberRemoved', 'Member removed successfully'));
+      setSuccess(t("team.memberRemoved", "Member removed successfully"));
     } catch (err) {
       const error = err as { response?: { data?: { error?: string } } };
-      setError(error.response?.data?.error || t('team.removeError', 'Failed to remove member'));
+      setError(
+        error.response?.data?.error ||
+          t("team.removeError", "Failed to remove member"),
+      );
     }
   };
 
-  const handleCancelInvitation = async (invitationId: number, email: string) => {
-    if (!window.confirm(t('team.confirmCancelInvite', 'Cancel invitation for {{email}}?', { email }))) return;
+  const handleCancelInvitation = async (
+    invitationId: number,
+    email: string,
+  ) => {
+    if (
+      !window.confirm(
+        t("team.confirmCancelInvite", "Cancel invitation for {{email}}?", {
+          email,
+        }),
+      )
+    )
+      return;
 
     try {
       await cancelInvitation(invitationId);
-      setSuccess(t('team.inviteCancelled', 'Invitation for {{email}} cancelled', { email }));
+      setSuccess(
+        t("team.inviteCancelled", "Invitation for {{email}} cancelled", {
+          email,
+        }),
+      );
     } catch (err) {
       const error = err as { response?: { data?: { error?: string } } };
-      setError(error.response?.data?.error || t('team.cancelInviteError', 'Failed to cancel invitation'));
+      setError(
+        error.response?.data?.error ||
+          t("team.cancelInviteError", "Failed to cancel invitation"),
+      );
     }
   };
 
@@ -112,7 +164,7 @@ export function SaaSTeamsSection() {
 
   const handleCancelRename = () => {
     setIsEditingName(false);
-    setNewTeamName('');
+    setNewTeamName("");
   };
 
   const handleRenameSubmit = async () => {
@@ -126,12 +178,19 @@ export function SaaSTeamsSection() {
         newName: newTeamName.trim(),
       });
 
-      setSuccess(t('team.renameSuccess', 'Team renamed successfully'));
+      setSuccess(t("team.renameSuccess", "Team renamed successfully"));
       setIsEditingName(false);
       await refreshTeams();
     } catch (err) {
-      const error = err as { response?: { data?: { error?: string } }; message?: string };
-      setError(error.response?.data?.error || error.message || t('team.renameError', 'Failed to rename team'));
+      const error = err as {
+        response?: { data?: { error?: string } };
+        message?: string;
+      };
+      setError(
+        error.response?.data?.error ||
+          error.message ||
+          t("team.renameError", "Failed to rename team"),
+      );
     } finally {
       setRenamingTeam(false);
     }
@@ -141,24 +200,37 @@ export function SaaSTeamsSection() {
     if (!currentTeam || isPersonalTeam) return;
 
     const confirmMessage = isTeamLeader
-      ? t('team.confirmLeaveLeader', 'Are you sure you want to leave "{{name}}"? You are a team leader. Make sure there are other leaders before leaving.', { name: currentTeam.name })
-      : t('team.confirmLeave', 'Are you sure you want to leave "{{name}}"?', { name: currentTeam.name });
+      ? t(
+          "team.confirmLeaveLeader",
+          'Are you sure you want to leave "{{name}}"? You are a team leader. Make sure there are other leaders before leaving.',
+          { name: currentTeam.name },
+        )
+      : t("team.confirmLeave", 'Are you sure you want to leave "{{name}}"?', {
+          name: currentTeam.name,
+        });
 
     if (!window.confirm(confirmMessage)) return;
 
     try {
       await leaveTeam();
-      setSuccess(t('team.leaveSuccess', 'Successfully left team'));
+      setSuccess(t("team.leaveSuccess", "Successfully left team"));
     } catch (err) {
-      const error = err as { response?: { data?: { error?: string } }; message?: string };
-      setError(error.response?.data?.error || error.message || t('team.leaveError', 'Failed to leave team'));
+      const error = err as {
+        response?: { data?: { error?: string } };
+        message?: string;
+      };
+      setError(
+        error.response?.data?.error ||
+          error.message ||
+          t("team.leaveError", "Failed to leave team"),
+      );
     }
   };
 
   if (!currentTeam) {
     return (
       <Alert color="gray">
-        <Text>{t('team.loading', 'Loading team information...')}</Text>
+        <Text>{t("team.loading", "Loading team information...")}</Text>
       </Alert>
     );
   }
@@ -174,12 +246,12 @@ export function SaaSTeamsSection() {
                 <TextInput
                   value={newTeamName}
                   onChange={(e) => setNewTeamName(e.target.value)}
-                  placeholder={t('team.namePlaceholder', 'Team name')}
+                  placeholder={t("team.namePlaceholder", "Team name")}
                   style={{ flex: 1, maxWidth: 300 }}
                   autoFocus
                   onKeyDown={(e) => {
-                    if (e.key === 'Enter') handleRenameSubmit();
-                    if (e.key === 'Escape') handleCancelRename();
+                    if (e.key === "Enter") handleRenameSubmit();
+                    if (e.key === "Escape") handleCancelRename();
                   }}
                 />
                 <ActionIcon
@@ -202,26 +274,34 @@ export function SaaSTeamsSection() {
               </Group>
             ) : (
               <Group gap="xs" align="center">
-                <Text fw={600} size="lg">{currentTeam.name}</Text>
+                <Text fw={600} size="lg">
+                  {currentTeam.name}
+                </Text>
                 {isTeamLeader && !isPersonalTeam && (
                   <ActionIcon
                     variant="subtle"
                     size="sm"
                     onClick={handleStartRename}
-                    aria-label={t('team.editName', 'Edit team name')}
+                    aria-label={t("team.editName", "Edit team name")}
                   >
                     <LocalIcon icon="edit" width="1rem" height="1rem" />
                   </ActionIcon>
                 )}
-                {isTeamLeader && <Badge color='blue'>{t('team.leader', 'LEADER')}</Badge>}
+                {isTeamLeader && (
+                  <Badge color="blue">{t("team.leader", "LEADER")}</Badge>
+                )}
                 {isPersonalTeam && (
-                  <Badge color="gray" variant="light" size="xs">{t('team.personal', 'Personal')}</Badge>
+                  <Badge color="gray" variant="light" size="xs">
+                    {t("team.personal", "Personal")}
+                  </Badge>
                 )}
               </Group>
             )}
             {!isEditingName && !isPersonalTeam && (
               <Text size="sm" c="dimmed" mt={4}>
-                {t('team.memberCount', '{{count}} team members', { count: currentTeam.seatsUsed })}
+                {t("team.memberCount", "{{count}} team members", {
+                  count: currentTeam.seatsUsed,
+                })}
               </Text>
             )}
           </div>
@@ -231,9 +311,11 @@ export function SaaSTeamsSection() {
               variant="outline"
               size="xs"
               onClick={handleLeaveTeam}
-              leftSection={<LocalIcon icon="logout" width="1rem" height="1rem" />}
+              leftSection={
+                <LocalIcon icon="logout" width="1rem" height="1rem" />
+              }
             >
-              {t('team.leaveButton', 'Leave Team')}
+              {t("team.leaveButton", "Leave Team")}
             </Button>
           )}
         </Group>
@@ -241,23 +323,34 @@ export function SaaSTeamsSection() {
 
       {/* Upgrade Banner for Free Users */}
       {isPersonalTeam && !isPro && (
-        <Alert color="blue" icon={<LocalIcon icon="info" width={16} height={16} />}>
+        <Alert
+          color="blue"
+          icon={<LocalIcon icon="info" width={16} height={16} />}
+        >
           <Group justify="space-between" align="center">
             <div>
-              <Text fw={500} size="sm">{t('team.upgrade.title', 'Upgrade to Pro to unlock team features')}</Text>
+              <Text fw={500} size="sm">
+                {t(
+                  "team.upgrade.title",
+                  "Upgrade to Pro to unlock team features",
+                )}
+              </Text>
               <Text size="xs" c="dimmed" mt={2}>
-                {t('team.upgrade.description', 'Invite members, share credits, and more.')}{' '}
-                <Anchor size="xs" onClick={() => setFeaturesModalOpened(true)} style={{ cursor: 'pointer' }}>
-                  {t('common.learnMore', 'Learn more')}
+                {t(
+                  "team.upgrade.description",
+                  "Invite members, share credits, and more.",
+                )}{" "}
+                <Anchor
+                  size="xs"
+                  onClick={() => setFeaturesModalOpened(true)}
+                  style={{ cursor: "pointer" }}
+                >
+                  {t("common.learnMore", "Learn more")}
                 </Anchor>
               </Text>
             </div>
-            <Button
-              size="sm"
-              variant="light"
-              onClick={navigateToPlan}
-            >
-              {t('team.upgrade.button', 'Upgrade to Pro')}
+            <Button size="sm" variant="light" onClick={navigateToPlan}>
+              {t("team.upgrade.button", "Upgrade to Pro")}
             </Button>
           </Group>
         </Alert>
@@ -273,26 +366,31 @@ export function SaaSTeamsSection() {
         withCloseButton={false}
         zIndex={Z_INDEX_OVER_CONFIG_MODAL}
       >
-        <div style={{ position: 'relative' }}>
+        <div style={{ position: "relative" }}>
           <CloseButton
             onClick={() => setFeaturesModalOpened(false)}
             size="lg"
             style={{
-              position: 'absolute',
+              position: "absolute",
               top: -8,
               right: -8,
-              zIndex: 1
+              zIndex: 1,
             }}
           />
           <Stack gap="lg" pt="md">
             {/* Header */}
             <Stack gap="md" align="center">
-              <Badge size="lg" color="violet" variant="filled">{t('team.features.badge', 'PRO FEATURE')}</Badge>
+              <Badge size="lg" color="violet" variant="filled">
+                {t("team.features.badge", "PRO FEATURE")}
+              </Badge>
               <Text size="xl" fw={700} ta="center">
-                {t('team.features.title', 'Team Collaboration')}
+                {t("team.features.title", "Team Collaboration")}
               </Text>
               <Text size="sm" c="dimmed" ta="center">
-                {t('team.features.subtitle', 'Upgrade to Pro and unlock powerful team features')}
+                {t(
+                  "team.features.subtitle",
+                  "Upgrade to Pro and unlock powerful team features",
+                )}
               </Text>
             </Stack>
 
@@ -307,20 +405,54 @@ export function SaaSTeamsSection() {
               }
             >
               <List.Item>
-                <Text fw={500}>{t('team.features.invite.title', 'Invite team members')}</Text>
-                <Text size="xs" c="dimmed">{t('team.features.invite.description', 'Add unlimited users with additional seat purchases')}</Text>
+                <Text fw={500}>
+                  {t("team.features.invite.title", "Invite team members")}
+                </Text>
+                <Text size="xs" c="dimmed">
+                  {t(
+                    "team.features.invite.description",
+                    "Add unlimited users with additional seat purchases",
+                  )}
+                </Text>
               </List.Item>
               <List.Item>
-                <Text fw={500}>{t('team.features.credits.title', 'Share credits across your team')}</Text>
-                <Text size="xs" c="dimmed">{t('team.features.credits.description', 'Pool resources for collaborative work')}</Text>
+                <Text fw={500}>
+                  {t(
+                    "team.features.credits.title",
+                    "Share credits across your team",
+                  )}
+                </Text>
+                <Text size="xs" c="dimmed">
+                  {t(
+                    "team.features.credits.description",
+                    "Pool resources for collaborative work",
+                  )}
+                </Text>
               </List.Item>
               <List.Item>
-                <Text fw={500}>{t('team.features.dashboard.title', 'Team management dashboard')}</Text>
-                <Text size="xs" c="dimmed">{t('team.features.dashboard.description', 'Control permissions, monitor usage, and manage members')}</Text>
+                <Text fw={500}>
+                  {t(
+                    "team.features.dashboard.title",
+                    "Team management dashboard",
+                  )}
+                </Text>
+                <Text size="xs" c="dimmed">
+                  {t(
+                    "team.features.dashboard.description",
+                    "Control permissions, monitor usage, and manage members",
+                  )}
+                </Text>
               </List.Item>
               <List.Item>
-                <Text fw={500}>{t('team.features.billing.title', 'Centralized billing')}</Text>
-                <Text size="xs" c="dimmed">{t('team.features.billing.description', 'One invoice for all team seats and usage')}</Text>
+                <Text fw={500}>
+                  {t("team.features.billing.title", "Centralized billing")}
+                </Text>
+                <Text size="xs" c="dimmed">
+                  {t(
+                    "team.features.billing.description",
+                    "One invoice for all team seats and usage",
+                  )}
+                </Text>
               </List.Item>
             </List>
 
@@ -333,7 +465,7 @@ export function SaaSTeamsSection() {
                 navigateToPlan();
               }}
             >
-              {t('team.features.viewPlans', 'View Pro Plans')}
+              {t("team.features.viewPlans", "View Pro Plans")}
             </Button>
           </Stack>
         </div>
@@ -355,24 +487,33 @@ export function SaaSTeamsSection() {
       {/* Invite Members (Pro Users) */}
       {isTeamLeader && isPro && (
         <div>
-          <Text fw={600} size="md" mb="sm">{t('team.invite.title', 'Invite Team Member')}</Text>
+          <Text fw={600} size="md" mb="sm">
+            {t("team.invite.title", "Invite Team Member")}
+          </Text>
           <form onSubmit={handleInvite}>
             <Group>
               <TextInput
                 type="email"
-                placeholder={t('team.invite.placeholder', 'email@example.com')}
+                placeholder={t("team.invite.placeholder", "email@example.com")}
                 value={inviteEmail}
                 onChange={(e) => setInviteEmail(e.target.value)}
                 style={{ flex: 1 }}
                 required
-                error={inviteEmail && !/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(inviteEmail) ? t('team.invite.invalidEmail', 'Invalid email format') : undefined}
+                error={
+                  inviteEmail && !/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(inviteEmail)
+                    ? t("team.invite.invalidEmail", "Invalid email format")
+                    : undefined
+                }
               />
               <Button
                 type="submit"
                 loading={inviting}
-                disabled={!inviteEmail.trim() || !/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(inviteEmail)}
+                disabled={
+                  !inviteEmail.trim() ||
+                  !/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(inviteEmail)
+                }
               >
-                {t('team.invite.sendButton', 'Send Invite')}
+                {t("team.invite.sendButton", "Send Invite")}
               </Button>
             </Group>
           </form>
@@ -381,26 +522,50 @@ export function SaaSTeamsSection() {
 
       {/* Team Members Table */}
       <div>
-        <Text fw={600} size="md" mb="sm">{t('team.members.title', 'Team Members')}</Text>
+        <Text fw={600} size="md" mb="sm">
+          {t("team.members.title", "Team Members")}
+        </Text>
         <Table
           horizontalSpacing="md"
           verticalSpacing="sm"
           withRowBorders
           highlightOnHover
-          style={{
-            '--table-border-color': 'var(--mantine-color-gray-3)',
-          } as React.CSSProperties}
+          style={
+            {
+              "--table-border-color": "var(--mantine-color-gray-3)",
+            } as React.CSSProperties
+          }
         >
           <Table.Thead>
-            <Table.Tr style={{ backgroundColor: 'var(--mantine-color-gray-0)' }}>
-              <Table.Th style={{ fontWeight: 600, fontSize: '0.875rem', color: 'var(--mantine-color-gray-7)' }}>
-                {t('team.members.nameColumn', 'Name')}
+            <Table.Tr
+              style={{ backgroundColor: "var(--mantine-color-gray-0)" }}
+            >
+              <Table.Th
+                style={{
+                  fontWeight: 600,
+                  fontSize: "0.875rem",
+                  color: "var(--mantine-color-gray-7)",
+                }}
+              >
+                {t("team.members.nameColumn", "Name")}
               </Table.Th>
-              <Table.Th style={{ fontWeight: 600, fontSize: '0.875rem', color: 'var(--mantine-color-gray-7)' }}>
-                {t('team.members.emailColumn', 'Email')}
+              <Table.Th
+                style={{
+                  fontWeight: 600,
+                  fontSize: "0.875rem",
+                  color: "var(--mantine-color-gray-7)",
+                }}
+              >
+                {t("team.members.emailColumn", "Email")}
               </Table.Th>
-              <Table.Th style={{ fontWeight: 600, fontSize: '0.875rem', color: 'var(--mantine-color-gray-7)' }}>
-                {t('team.members.roleColumn', 'Role')}
+              <Table.Th
+                style={{
+                  fontWeight: 600,
+                  fontSize: "0.875rem",
+                  color: "var(--mantine-color-gray-7)",
+                }}
+              >
+                {t("team.members.roleColumn", "Role")}
               </Table.Th>
               {isTeamLeader && !isPersonalTeam && (
                 <Table.Th style={{ width: 50 }}></Table.Th>
@@ -412,7 +577,7 @@ export function SaaSTeamsSection() {
               <Table.Tr>
                 <Table.Td colSpan={isTeamLeader && !isPersonalTeam ? 4 : 3}>
                   <Text ta="center" c="dimmed" py="xl">
-                    {t('team.members.empty', 'No team members yet.')}
+                    {t("team.members.empty", "No team members yet.")}
                   </Text>
                 </Table.Td>
               </Table.Tr>
@@ -434,31 +599,51 @@ export function SaaSTeamsSection() {
                     <Table.Td>
                       <Badge
                         size="sm"
-                        color={member.role === 'LEADER' ? 'blue' : undefined}
-                        style={member.role !== 'LEADER' ? {
-                          backgroundColor: 'var(--tool-header-badge-bg)',
-                          color: 'var(--tool-header-badge-text)',
-                        } : undefined}
+                        color={member.role === "LEADER" ? "blue" : undefined}
+                        style={
+                          member.role !== "LEADER"
+                            ? {
+                                backgroundColor: "var(--tool-header-badge-bg)",
+                                color: "var(--tool-header-badge-text)",
+                              }
+                            : undefined
+                        }
                       >
                         {member.role}
                       </Badge>
                     </Table.Td>
                     {isTeamLeader && !isPersonalTeam && (
                       <Table.Td>
-                        {member.role !== 'LEADER' && (
-                          <Menu position="bottom-end" withinPortal zIndex={Z_INDEX_OVER_CONFIG_MODAL}>
+                        {member.role !== "LEADER" && (
+                          <Menu
+                            position="bottom-end"
+                            withinPortal
+                            zIndex={Z_INDEX_OVER_CONFIG_MODAL}
+                          >
                             <Menu.Target>
                               <ActionIcon variant="subtle">
-                                <LocalIcon icon="more-vert" width="1rem" height="1rem" />
+                                <LocalIcon
+                                  icon="more-vert"
+                                  width="1rem"
+                                  height="1rem"
+                                />
                               </ActionIcon>
                             </Menu.Target>
                             <Menu.Dropdown>
                               <Menu.Item
                                 color="red"
-                                leftSection={<LocalIcon icon="person-remove" width="1rem" height="1rem" />}
-                                onClick={() => handleRemove(member.id, member.email)}
+                                leftSection={
+                                  <LocalIcon
+                                    icon="person-remove"
+                                    width="1rem"
+                                    height="1rem"
+                                  />
+                                }
+                                onClick={() =>
+                                  handleRemove(member.id, member.email)
+                                }
                               >
-                                {t('team.members.remove', 'Remove from Team')}
+                                {t("team.members.remove", "Remove from Team")}
                               </Menu.Item>
                             </Menu.Dropdown>
                           </Menu>
@@ -470,12 +655,12 @@ export function SaaSTeamsSection() {
 
                 {/* Pending Invitations */}
                 {teamInvitations
-                  .filter(inv => inv.status === 'PENDING')
+                  .filter((inv) => inv.status === "PENDING")
                   .map((invitation) => (
                     <Table.Tr key={`invitation-${invitation.invitationId}`}>
                       <Table.Td>
                         <Text size="sm" fw={500} c="dimmed" fs="italic">
-                          {invitation.inviteeEmail.split('@')[0]}
+                          {invitation.inviteeEmail.split("@")[0]}
                         </Text>
                       </Table.Td>
                       <Table.Td>
@@ -485,7 +670,7 @@ export function SaaSTeamsSection() {
                       </Table.Td>
                       <Table.Td>
                         <Badge size="sm" color="yellow" variant="light">
-                          {t('team.members.pending', 'PENDING')}
+                          {t("team.members.pending", "PENDING")}
                         </Badge>
                       </Table.Td>
                       {isTeamLeader && !isPersonalTeam && (
@@ -493,10 +678,22 @@ export function SaaSTeamsSection() {
                           <ActionIcon
                             variant="subtle"
                             color="red"
-                            onClick={() => handleCancelInvitation(invitation.invitationId, invitation.inviteeEmail)}
-                            aria-label={t('team.invite.cancelLabel', 'Cancel invitation')}
+                            onClick={() =>
+                              handleCancelInvitation(
+                                invitation.invitationId,
+                                invitation.inviteeEmail,
+                              )
+                            }
+                            aria-label={t(
+                              "team.invite.cancelLabel",
+                              "Cancel invitation",
+                            )}
                           >
-                            <LocalIcon icon="close" width="1rem" height="1rem" />
+                            <LocalIcon
+                              icon="close"
+                              width="1rem"
+                              height="1rem"
+                            />
                           </ActionIcon>
                         </Table.Td>
                       )}
@@ -507,7 +704,6 @@ export function SaaSTeamsSection() {
           </Table.Tbody>
         </Table>
       </div>
-
     </Stack>
   );
 }
diff --git a/frontend/src/desktop/components/shared/config/configSections/SaasPlanSection.tsx b/frontend/src/desktop/components/shared/config/configSections/SaasPlanSection.tsx
index 9a0ae33351..fc91e84aaa 100644
--- a/frontend/src/desktop/components/shared/config/configSections/SaasPlanSection.tsx
+++ b/frontend/src/desktop/components/shared/config/configSections/SaasPlanSection.tsx
@@ -1,16 +1,24 @@
-import { useEffect, useState } from 'react';
-import { Stack, Loader, Alert, Button, Center, Text, Flex } from '@mantine/core';
-import RefreshIcon from '@mui/icons-material/Refresh';
-import ErrorOutlineIcon from '@mui/icons-material/ErrorOutline';
-import AccessTimeIcon from '@mui/icons-material/AccessTime';
-import { useTranslation } from 'react-i18next';
-import { useSaaSBilling } from '@app/contexts/SaasBillingContext';
-import { useSaaSTeam } from '@app/contexts/SaaSTeamContext';
-import { useSaaSPlans } from '@app/hooks/useSaaSPlans';
-import { connectionModeService } from '@app/services/connectionModeService';
-import { SaaSCheckoutProvider } from '@app/contexts/SaaSCheckoutContext';
-import { ActiveSubscriptionCard } from '@app/components/shared/config/configSections/plan/ActiveSubscriptionCard';
-import { SaaSAvailablePlansSection } from '@app/components/shared/config/configSections/plan/SaaSAvailablePlansSection';
+import { useEffect, useState } from "react";
+import {
+  Stack,
+  Loader,
+  Alert,
+  Button,
+  Center,
+  Text,
+  Flex,
+} from "@mantine/core";
+import RefreshIcon from "@mui/icons-material/Refresh";
+import ErrorOutlineIcon from "@mui/icons-material/ErrorOutline";
+import AccessTimeIcon from "@mui/icons-material/AccessTime";
+import { useTranslation } from "react-i18next";
+import { useSaaSBilling } from "@app/contexts/SaasBillingContext";
+import { useSaaSTeam } from "@app/contexts/SaaSTeamContext";
+import { useSaaSPlans } from "@app/hooks/useSaaSPlans";
+import { connectionModeService } from "@app/services/connectionModeService";
+import { SaaSCheckoutProvider } from "@app/contexts/SaaSCheckoutContext";
+import { ActiveSubscriptionCard } from "@app/components/shared/config/configSections/plan/ActiveSubscriptionCard";
+import { SaaSAvailablePlansSection } from "@app/components/shared/config/configSections/plan/SaaSAvailablePlansSection";
 
 /**
  * SaaS Plan & Billing section
@@ -48,15 +56,17 @@ export function SaasPlanSection() {
   useEffect(() => {
     const checkMode = async () => {
       const mode = await connectionModeService.getCurrentMode();
-      setIsSaasMode(mode === 'saas');
+      setIsSaasMode(mode === "saas");
     };
 
     checkMode();
 
     // Subscribe to mode changes
-    const unsubscribe = connectionModeService.subscribeToModeChanges(async (config) => {
-      setIsSaasMode(config.mode === 'saas');
-    });
+    const unsubscribe = connectionModeService.subscribeToModeChanges(
+      async (config) => {
+        setIsSaasMode(config.mode === "saas");
+      },
+    );
 
     return unsubscribe;
   }, []);
@@ -69,7 +79,7 @@ export function SaasPlanSection() {
       // Context handles opening portal and auto-refresh
       await openBillingPortal();
     } catch (error) {
-      console.error('[SaasPlanSection] Failed to open billing portal:', error);
+      console.error("[SaasPlanSection] Failed to open billing portal:", error);
     } finally {
       setIsOpeningPortal(false);
     }
@@ -78,9 +88,9 @@ export function SaasPlanSection() {
   // Format date for trial end
   const formatDate = (timestamp: number): string => {
     return new Date(timestamp * 1000).toLocaleDateString(undefined, {
-      year: 'numeric',
-      month: 'long',
-      day: 'numeric',
+      year: "numeric",
+      month: "long",
+      day: "numeric",
     });
   };
 
@@ -88,11 +98,15 @@ export function SaasPlanSection() {
   if (isSaasMode === false) {
     return (
       <Center p="xl">
-        <Alert color="blue" variant="light" icon={<ErrorOutlineIcon sx={{ fontSize: 16 }} />}>
+        <Alert
+          color="blue"
+          variant="light"
+          icon={<ErrorOutlineIcon sx={{ fontSize: 16 }} />}
+        >
           <Text size="sm">
             {t(
-              'settings.planBilling.notAvailable',
-              'Plan & Billing is only available when connected to Stirling Cloud (SaaS mode).'
+              "settings.planBilling.notAvailable",
+              "Plan & Billing is only available when connected to Stirling Cloud (SaaS mode).",
             )}
           </Text>
         </Alert>
@@ -117,7 +131,10 @@ export function SaasPlanSection() {
         <Stack align="center" gap="md">
           <Loader size="md" />
           <Text size="sm" c="dimmed">
-            {t('settings.planBilling.loading', 'Loading billing information...')}
+            {t(
+              "settings.planBilling.loading",
+              "Loading billing information...",
+            )}
           </Text>
         </Stack>
       </Center>
@@ -132,7 +149,10 @@ export function SaasPlanSection() {
           color="red"
           variant="light"
           icon={<ErrorOutlineIcon sx={{ fontSize: 16 }} />}
-          title={t('settings.planBilling.errors.fetchFailed', 'Unable to fetch billing data')}
+          title={t(
+            "settings.planBilling.errors.fetchFailed",
+            "Unable to fetch billing data",
+          )}
         >
           <Stack gap="sm">
             <Text size="sm">{error}</Text>
@@ -142,7 +162,7 @@ export function SaasPlanSection() {
               onClick={refreshBilling}
               size="xs"
             >
-              {t('settings.planBilling.errors.retry', 'Retry')}
+              {t("settings.planBilling.errors.retry", "Retry")}
             </Button>
           </Stack>
         </Alert>
@@ -156,10 +176,16 @@ export function SaasPlanSection() {
       <div>
         {/* Header with title and Manage Billing button */}
         <Flex justify="space-between" align="center" mb="md">
-          <h3 style={{ margin: 0, color: 'var(--mantine-color-text)', fontSize: '1rem' }}>
-            {t('settings.planBilling.currentPlan', 'Active Plan')}
+          <h3
+            style={{
+              margin: 0,
+              color: "var(--mantine-color-text)",
+              fontSize: "1rem",
+            }}
+          >
+            {t("settings.planBilling.currentPlan", "Active Plan")}
           </h3>
-          {tier !== 'free' && !isManagedTeamMember && (
+          {tier !== "free" && !isManagedTeamMember && (
             <Button
               variant="light"
               size="sm"
@@ -167,34 +193,43 @@ export function SaasPlanSection() {
               loading={isOpeningPortal}
               disabled={isOpeningPortal}
             >
-              {t('settings.planBilling.billing.manageBilling', 'Manage Billing')}
+              {t(
+                "settings.planBilling.billing.manageBilling",
+                "Manage Billing",
+              )}
             </Button>
           )}
         </Flex>
 
         {/* Trial Status Alert */}
-        {isTrialing && trialDaysRemaining !== undefined && subscription?.currentPeriodEnd && (
-          <Alert
-            color="blue"
-            icon={<AccessTimeIcon sx={{ fontSize: 16 }} />}
-            mt="md"
-            mb="md"
-            title={t('settings.planBilling.trial.title', 'Free Trial Active')}
-          >
-            <Text size="sm">
-              {t('settings.planBilling.trial.daysRemainingFull', 'Your trial ends in {{days}} days', {
-                days: trialDaysRemaining,
-                defaultValue: `Your trial ends in ${trialDaysRemaining} days`,
-              })}
-            </Text>
-            <Text size="xs" c="dimmed">
-              {t('settings.planBilling.trial.endDate', 'Expires: {{date}}', {
-                date: formatDate(subscription.currentPeriodEnd),
-                defaultValue: `Expires: ${formatDate(subscription.currentPeriodEnd)}`,
-              })}
-            </Text>
-          </Alert>
-        )}
+        {isTrialing &&
+          trialDaysRemaining !== undefined &&
+          subscription?.currentPeriodEnd && (
+            <Alert
+              color="blue"
+              icon={<AccessTimeIcon sx={{ fontSize: 16 }} />}
+              mt="md"
+              mb="md"
+              title={t("settings.planBilling.trial.title", "Free Trial Active")}
+            >
+              <Text size="sm">
+                {t(
+                  "settings.planBilling.trial.daysRemainingFull",
+                  "Your trial ends in {{days}} days",
+                  {
+                    days: trialDaysRemaining,
+                    defaultValue: `Your trial ends in ${trialDaysRemaining} days`,
+                  },
+                )}
+              </Text>
+              <Text size="xs" c="dimmed">
+                {t("settings.planBilling.trial.endDate", "Expires: {{date}}", {
+                  date: formatDate(subscription.currentPeriodEnd),
+                  defaultValue: `Expires: ${formatDate(subscription.currentPeriodEnd)}`,
+                })}
+              </Text>
+            </Alert>
+          )}
 
         {/* Plan cards */}
         <Stack gap="lg">
diff --git a/frontend/src/desktop/components/shared/config/configSections/plan/ActiveSubscriptionCard.tsx b/frontend/src/desktop/components/shared/config/configSections/plan/ActiveSubscriptionCard.tsx
index 32c573f7cd..454858d47e 100644
--- a/frontend/src/desktop/components/shared/config/configSections/plan/ActiveSubscriptionCard.tsx
+++ b/frontend/src/desktop/components/shared/config/configSections/plan/ActiveSubscriptionCard.tsx
@@ -1,10 +1,18 @@
-import { Card, Text, Group, Badge, Stack, Tooltip, ActionIcon } from '@mantine/core';
-import GroupIcon from '@mui/icons-material/Group';
-import InfoOutlinedIcon from '@mui/icons-material/InfoOutlined';
-import { useTranslation } from 'react-i18next';
-import type { BillingStatus } from '@app/services/saasBillingService';
-import { BILLING_CONFIG, getFormattedOveragePrice } from '@app/config/billing';
-import { Z_INDEX_OVER_CONFIG_MODAL } from '@app/styles/zIndex';
+import {
+  Card,
+  Text,
+  Group,
+  Badge,
+  Stack,
+  Tooltip,
+  ActionIcon,
+} from "@mantine/core";
+import GroupIcon from "@mui/icons-material/Group";
+import InfoOutlinedIcon from "@mui/icons-material/InfoOutlined";
+import { useTranslation } from "react-i18next";
+import type { BillingStatus } from "@app/services/saasBillingService";
+import { BILLING_CONFIG, getFormattedOveragePrice } from "@app/config/billing";
+import { Z_INDEX_OVER_CONFIG_MODAL } from "@app/styles/zIndex";
 
 interface TeamData {
   teamId: number;
@@ -15,9 +23,9 @@ interface TeamData {
 }
 
 interface ActiveSubscriptionCardProps {
-  tier: BillingStatus['tier'];
-  subscription: BillingStatus['subscription'];
-  usage: BillingStatus['meterUsage'];
+  tier: BillingStatus["tier"];
+  subscription: BillingStatus["subscription"];
+  usage: BillingStatus["meterUsage"];
   isTrialing: boolean;
   price?: number;
   currency?: string;
@@ -42,21 +50,21 @@ export function ActiveSubscriptionCard({
   // Format timestamp to readable date
   const formatDate = (timestamp: number): string => {
     return new Date(timestamp * 1000).toLocaleDateString(undefined, {
-      year: 'numeric',
-      month: 'long',
-      day: 'numeric',
+      year: "numeric",
+      month: "long",
+      day: "numeric",
     });
   };
 
   // Get tier display name
   const getTierName = (): string => {
     switch (tier) {
-      case 'free':
-        return t('settings.planBilling.tier.free', 'Free Plan');
-      case 'team':
-        return t('settings.planBilling.tier.team', 'Team Plan');
-      case 'enterprise':
-        return t('settings.planBilling.tier.enterprise', 'Enterprise Plan');
+      case "free":
+        return t("settings.planBilling.tier.free", "Free Plan");
+      case "team":
+        return t("settings.planBilling.tier.team", "Team Plan");
+      case "enterprise":
+        return t("settings.planBilling.tier.enterprise", "Enterprise Plan");
       default:
         return tier;
     }
@@ -64,31 +72,34 @@ export function ActiveSubscriptionCard({
 
   // Get price display
   const getPriceDisplay = (): string => {
-    if (tier === 'free') {
-      return '$0/month';
+    if (tier === "free") {
+      return "$0/month";
     }
     // Use actual price from Stripe if available
     if (price !== undefined && currency) {
       return `${currency}${price}/month`;
     }
     // Fallback to default pricing
-    return '$10/month';
+    return "$10/month";
   };
 
   // Get description
   const getDescription = (): string => {
-    if (tier === 'free') {
-      return t('settings.planBilling.tier.freeDescription', '50 credits per month');
+    if (tier === "free") {
+      return t(
+        "settings.planBilling.tier.freeDescription",
+        "50 credits per month",
+      );
     }
     return t(
-      'settings.planBilling.tier.teamDescription',
-      '500 credits/month included, automatic overage billing for uninterrupted service'
+      "settings.planBilling.tier.teamDescription",
+      "500 credits/month included, automatic overage billing for uninterrupted service",
     );
   };
 
   // Format overage cost
   const formatOverageCost = (cents: number, credits: number): string => {
-    return t('settings.planBilling.billing.overageCost', {
+    return t("settings.planBilling.billing.overageCost", {
       amount: `$${(cents / 100).toFixed(2)}`,
       credits,
       defaultValue: `Current overage cost: $${(cents / 100).toFixed(2)} (${credits} credits)`,
@@ -96,7 +107,7 @@ export function ActiveSubscriptionCard({
   };
 
   // Pro/Team card
-  if (tier === 'team' || tier === 'enterprise') {
+  if (tier === "team" || tier === "enterprise") {
     return (
       <Card padding="lg" radius="md" withBorder>
         <Stack gap="sm">
@@ -105,30 +116,39 @@ export function ActiveSubscriptionCard({
             <div style={{ flex: 1 }}>
               <Group gap="xs" mb="xs">
                 <Text size="lg" fw={600}>
-                  {!isPersonalTeam && isTeamLeader ? t('settings.planBilling.tier.team', 'Team Plan') : getTierName()}
+                  {!isPersonalTeam && isTeamLeader
+                    ? t("settings.planBilling.tier.team", "Team Plan")
+                    : getTierName()}
                 </Text>
                 {!isPersonalTeam && (
-                  <Badge color="violet" variant="light" leftSection={<GroupIcon sx={{ fontSize: 12 }} />}>
-                    {t('settings.planBilling.tier.teamBadge', 'Team')}
+                  <Badge
+                    color="violet"
+                    variant="light"
+                    leftSection={<GroupIcon sx={{ fontSize: 12 }} />}
+                  >
+                    {t("settings.planBilling.tier.teamBadge", "Team")}
                   </Badge>
                 )}
                 <Tooltip
                   label={
                     <div style={{ maxWidth: 300 }}>
                       <Text size="sm" mb="xs">
-                        {t('settings.planBilling.tier.teamTooltipCredits', {
+                        {t("settings.planBilling.tier.teamTooltipCredits", {
                           credits: BILLING_CONFIG.INCLUDED_CREDITS_PER_MONTH,
                           defaultValue: `Team plan includes ${BILLING_CONFIG.INCLUDED_CREDITS_PER_MONTH} credits/month.`,
                         })}
                       </Text>
                       <Text size="sm" mb="xs">
-                        {t('settings.planBilling.tier.teamTooltipOverage', {
+                        {t("settings.planBilling.tier.teamTooltipOverage", {
                           price: getFormattedOveragePrice(),
                           defaultValue: `Automatic overage billing at ${getFormattedOveragePrice()}/credit ensures uninterrupted service.`,
                         })}
                       </Text>
                       <Text size="sm">
-                        {t('settings.planBilling.tier.teamTooltipFineprint', 'Only pay for what you use beyond included credits.')}
+                        {t(
+                          "settings.planBilling.tier.teamTooltipFineprint",
+                          "Only pay for what you use beyond included credits.",
+                        )}
                       </Text>
                     </div>
                   }
@@ -143,18 +163,25 @@ export function ActiveSubscriptionCard({
                 </Tooltip>
                 {isTrialing && (
                   <Badge color="blue" variant="light">
-                    {t('settings.planBilling.status.trial', 'Trial')}
+                    {t("settings.planBilling.status.trial", "Trial")}
                   </Badge>
                 )}
               </Group>
               {!isPersonalTeam && !isTeamLeader && (
                 <Text size="sm" c="dimmed" mb="xs">
-                  {t('settings.planBilling.team.managedByTeam', 'Managed by team')}
+                  {t(
+                    "settings.planBilling.team.managedByTeam",
+                    "Managed by team",
+                  )}
                 </Text>
               )}
               {!isPersonalTeam && isTeamLeader && currentTeam && (
                 <Text size="sm" c="dimmed" mb="xs">
-                  {t('settings.planBilling.team.memberCount', '{{count}} team members', { count: currentTeam.seatsUsed })}
+                  {t(
+                    "settings.planBilling.team.memberCount",
+                    "{{count}} team members",
+                    { count: currentTeam.seatsUsed },
+                  )}
                 </Text>
               )}
               <Text size="sm" c="dimmed" mb="xs">
@@ -163,16 +190,22 @@ export function ActiveSubscriptionCard({
               {/* Show overage cost if applicable */}
               {usage && usage.currentPeriodCredits > 0 && (
                 <Text size="sm" c="orange" fw={500}>
-                  {formatOverageCost(usage.estimatedCost, usage.currentPeriodCredits)}
+                  {formatOverageCost(
+                    usage.estimatedCost,
+                    usage.currentPeriodCredits,
+                  )}
                 </Text>
               )}
             </div>
 
             {/* Right side: Price */}
-            <div style={{ textAlign: 'right' }}>
+            <div style={{ textAlign: "right" }}>
               {!isPersonalTeam && !isTeamLeader ? (
                 <Text size="lg" c="dimmed">
-                  {t('settings.planBilling.team.managedByTeam', 'Managed by team')}
+                  {t(
+                    "settings.planBilling.team.managedByTeam",
+                    "Managed by team",
+                  )}
                 </Text>
               ) : (
                 <Text size="xl" fw={700}>
@@ -186,7 +219,11 @@ export function ActiveSubscriptionCard({
           {subscription?.currentPeriodEnd && (
             <Group gap="xs" mt="xs">
               <Text size="sm" c="dimmed">
-                {t('settings.planBilling.billing.nextBillingDate', 'Next billing date:')} {formatDate(subscription.currentPeriodEnd)}
+                {t(
+                  "settings.planBilling.billing.nextBillingDate",
+                  "Next billing date:",
+                )}{" "}
+                {formatDate(subscription.currentPeriodEnd)}
               </Text>
             </Group>
           )}
@@ -209,7 +246,7 @@ export function ActiveSubscriptionCard({
             {getDescription()}
           </Text>
         </div>
-        <div style={{ textAlign: 'right' }}>
+        <div style={{ textAlign: "right" }}>
           <Text size="xl" fw={700}>
             {getPriceDisplay()}
           </Text>
diff --git a/frontend/src/desktop/components/shared/config/configSections/plan/PlanUpgradeCard.tsx b/frontend/src/desktop/components/shared/config/configSections/plan/PlanUpgradeCard.tsx
index 88bdad8902..323b7fa9f7 100644
--- a/frontend/src/desktop/components/shared/config/configSections/plan/PlanUpgradeCard.tsx
+++ b/frontend/src/desktop/components/shared/config/configSections/plan/PlanUpgradeCard.tsx
@@ -1,11 +1,11 @@
-import React from 'react';
-import { Card, Text, Button, Stack, List, ThemeIcon } from '@mantine/core';
-import CheckCircleIcon from '@mui/icons-material/CheckCircle';
-import { useTranslation } from 'react-i18next';
-import { open as shellOpen } from '@tauri-apps/plugin-shell';
-import { STIRLING_SAAS_URL } from '@app/constants/connection';
-import { BILLING_CONFIG } from '@app/config/billing';
-import type { TierLevel } from '@app/types/billing';
+import React from "react";
+import { Card, Text, Button, Stack, List, ThemeIcon } from "@mantine/core";
+import CheckCircleIcon from "@mui/icons-material/CheckCircle";
+import { useTranslation } from "react-i18next";
+import { open as shellOpen } from "@tauri-apps/plugin-shell";
+import { STIRLING_SAAS_URL } from "@app/constants/connection";
+import { BILLING_CONFIG } from "@app/config/billing";
+import type { TierLevel } from "@app/types/billing";
 
 interface PlanUpgradeCardProps {
   currentTier: TierLevel;
@@ -15,7 +15,7 @@ export function PlanUpgradeCard({ currentTier }: PlanUpgradeCardProps) {
   const { t } = useTranslation();
 
   // Don't show upgrade card if already on Team or Enterprise
-  if (currentTier !== 'free') {
+  if (currentTier !== "free") {
     return null;
   }
 
@@ -26,7 +26,7 @@ export function PlanUpgradeCard({ currentTier }: PlanUpgradeCardProps) {
     try {
       await shellOpen(upgradeUrl);
     } catch (error) {
-      console.error('[PlanUpgradeCard] Failed to open upgrade URL:', error);
+      console.error("[PlanUpgradeCard] Failed to open upgrade URL:", error);
     }
   };
 
@@ -35,12 +35,12 @@ export function PlanUpgradeCard({ currentTier }: PlanUpgradeCardProps) {
       <Stack gap="md">
         {/* Header */}
         <Text size="lg" fw={600}>
-          {t('settings.planBilling.upgrade.title', 'Upgrade Your Plan')}
+          {t("settings.planBilling.upgrade.title", "Upgrade Your Plan")}
         </Text>
 
         {/* Team plan benefits */}
         <Text size="sm" c="dimmed">
-          {t('settings.planBilling.upgrade.subtitle', 'Upgrade to Team for:')}
+          {t("settings.planBilling.upgrade.subtitle", "Upgrade to Team for:")}
         </Text>
 
         <List
@@ -53,25 +53,48 @@ export function PlanUpgradeCard({ currentTier }: PlanUpgradeCardProps) {
           }
         >
           <List.Item>
-            {t('settings.planBilling.upgrade.featureCredits', {
+            {t("settings.planBilling.upgrade.featureCredits", {
               teamCredits: BILLING_CONFIG.INCLUDED_CREDITS_PER_MONTH,
               freeCredits: BILLING_CONFIG.FREE_CREDITS_PER_MONTH,
               defaultValue: `${BILLING_CONFIG.INCLUDED_CREDITS_PER_MONTH} credits per month (vs ${BILLING_CONFIG.FREE_CREDITS_PER_MONTH} on Free)`,
             })}
           </List.Item>
-          <List.Item>{t('settings.planBilling.upgrade.featureMembers', 'Unlimited team members')}</List.Item>
-          <List.Item>{t('settings.planBilling.upgrade.featureThroughput', 'Faster processing throughput')}</List.Item>
-          <List.Item>{t('settings.planBilling.upgrade.featureApi', 'API access for automation')}</List.Item>
-          <List.Item>{t('settings.planBilling.upgrade.featureSupport', 'Priority support')}</List.Item>
+          <List.Item>
+            {t(
+              "settings.planBilling.upgrade.featureMembers",
+              "Unlimited team members",
+            )}
+          </List.Item>
+          <List.Item>
+            {t(
+              "settings.planBilling.upgrade.featureThroughput",
+              "Faster processing throughput",
+            )}
+          </List.Item>
+          <List.Item>
+            {t(
+              "settings.planBilling.upgrade.featureApi",
+              "API access for automation",
+            )}
+          </List.Item>
+          <List.Item>
+            {t(
+              "settings.planBilling.upgrade.featureSupport",
+              "Priority support",
+            )}
+          </List.Item>
         </List>
 
         {/* Upgrade button */}
         <Button variant="filled" fullWidth onClick={handleUpgrade}>
-          {t('settings.planBilling.upgrade.cta', 'Upgrade to Team')}
+          {t("settings.planBilling.upgrade.cta", "Upgrade to Team")}
         </Button>
 
         <Text size="xs" c="dimmed" ta="center">
-          {t('settings.planBilling.upgrade.opensInBrowser', 'Opens in browser to complete upgrade')}
+          {t(
+            "settings.planBilling.upgrade.opensInBrowser",
+            "Opens in browser to complete upgrade",
+          )}
         </Text>
       </Stack>
     </Card>
diff --git a/frontend/src/desktop/components/shared/config/configSections/plan/SaaSAvailablePlansSection.tsx b/frontend/src/desktop/components/shared/config/configSections/plan/SaaSAvailablePlansSection.tsx
index e3d72c449d..28e8de48c4 100644
--- a/frontend/src/desktop/components/shared/config/configSections/plan/SaaSAvailablePlansSection.tsx
+++ b/frontend/src/desktop/components/shared/config/configSections/plan/SaaSAvailablePlansSection.tsx
@@ -1,10 +1,10 @@
-import React from 'react';
-import { Text, SimpleGrid, Loader, Alert, Center } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { PlanTier } from '@app/hooks/useSaaSPlans';
-import { SaasPlanCard } from '@app/components/shared/config/configSections/plan/SaasPlanCard';
-import { useSaaSCheckout } from '@app/contexts/SaaSCheckoutContext';
-import type { TierLevel } from '@app/types/billing';
+import React from "react";
+import { Text, SimpleGrid, Loader, Alert, Center } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import { PlanTier } from "@app/hooks/useSaaSPlans";
+import { SaasPlanCard } from "@app/components/shared/config/configSections/plan/SaasPlanCard";
+import { useSaaSCheckout } from "@app/contexts/SaaSCheckoutContext";
+import type { TierLevel } from "@app/types/billing";
 
 interface SaaSAvailablePlansSectionProps {
   plans: PlanTier[];
@@ -13,12 +13,9 @@ interface SaaSAvailablePlansSectionProps {
   error?: string | null;
 }
 
-export const SaaSAvailablePlansSection: React.FC<SaaSAvailablePlansSectionProps> = ({
-  plans,
-  currentTier,
-  loading,
-  error
-}) => {
+export const SaaSAvailablePlansSection: React.FC<
+  SaaSAvailablePlansSectionProps
+> = ({ plans, currentTier, loading, error }) => {
   const { t } = useTranslation();
   const { openCheckout } = useSaaSCheckout();
 
@@ -33,7 +30,10 @@ export const SaaSAvailablePlansSection: React.FC<SaaSAvailablePlansSectionProps>
       return;
     }
 
-    console.log('[SaaSAvailablePlansSection] Upgrade clicked for plan:', plan.id);
+    console.log(
+      "[SaaSAvailablePlansSection] Upgrade clicked for plan:",
+      plan.id,
+    );
     openCheckout(plan.id);
   };
 
@@ -49,7 +49,10 @@ export const SaaSAvailablePlansSection: React.FC<SaaSAvailablePlansSectionProps>
     return (
       <Alert color="orange" variant="light" mt="md">
         <Text size="sm">
-          {t('plan.availablePlans.loadError', 'Unable to load plan pricing. Using default values.')}
+          {t(
+            "plan.availablePlans.loadError",
+            "Unable to load plan pricing. Using default values.",
+          )}
         </Text>
       </Alert>
     );
@@ -58,10 +61,10 @@ export const SaaSAvailablePlansSection: React.FC<SaaSAvailablePlansSectionProps>
   return (
     <div>
       <Text size="lg" fw={600} mb="md">
-        {t('plan.availablePlans.title', 'Available Plans')}
+        {t("plan.availablePlans.title", "Available Plans")}
       </Text>
       <SimpleGrid cols={{ base: 1, sm: 2, md: 3 }} spacing="lg">
-        {plans.map(plan => (
+        {plans.map((plan) => (
           <SaasPlanCard
             key={plan.id}
             plan={plan}
diff --git a/frontend/src/desktop/components/shared/config/configSections/plan/SaasPlanCard.tsx b/frontend/src/desktop/components/shared/config/configSections/plan/SaasPlanCard.tsx
index 207e4a6f20..1c93300865 100644
--- a/frontend/src/desktop/components/shared/config/configSections/plan/SaasPlanCard.tsx
+++ b/frontend/src/desktop/components/shared/config/configSections/plan/SaasPlanCard.tsx
@@ -1,9 +1,9 @@
-import React from 'react';
-import { Button, Card, Badge, Text, Group, Stack } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { PlanTier } from '@app/hooks/useSaaSPlans';
-import { FeatureListItem } from '@app/components/shared/modals/FeatureListItem';
-import type { TierLevel } from '@app/types/billing';
+import React from "react";
+import { Button, Card, Badge, Text, Group, Stack } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import { PlanTier } from "@app/hooks/useSaaSPlans";
+import { FeatureListItem } from "@app/components/shared/modals/FeatureListItem";
+import type { TierLevel } from "@app/types/billing";
 
 interface SaasPlanCardProps {
   plan: PlanTier;
@@ -16,26 +16,28 @@ export const SaasPlanCard: React.FC<SaasPlanCardProps> = ({
   plan,
   isCurrentPlan,
   currentTier,
-  onUpgradeClick
+  onUpgradeClick,
 }) => {
   const { t } = useTranslation();
 
   // Free plan is included if user has Team or Enterprise tier
-  const isIncluded = plan.id === 'free' && (currentTier === 'team' || currentTier === 'enterprise');
+  const isIncluded =
+    plan.id === "free" &&
+    (currentTier === "team" || currentTier === "enterprise");
 
   // Determine card styling based on plan type
   const getCardStyle = () => {
     const baseStyle: React.CSSProperties = {
-      backgroundColor: 'light-dark(#FFFFFF, #1A1A1E)',
+      backgroundColor: "light-dark(#FFFFFF, #1A1A1E)",
       borderWidth: 1,
-      position: 'relative',
-      overflow: 'visible',
+      position: "relative",
+      overflow: "visible",
     };
 
-    if (plan.id === 'free' && isCurrentPlan) {
+    if (plan.id === "free" && isCurrentPlan) {
       return {
         ...baseStyle,
-        borderColor: 'var(--border-default)',
+        borderColor: "var(--border-default)",
         opacity: 0.85,
       };
     }
@@ -43,11 +45,11 @@ export const SaasPlanCard: React.FC<SaasPlanCardProps> = ({
     if (plan.popular) {
       return {
         ...baseStyle,
-        borderColor: 'rgb(59, 130, 246)',
+        borderColor: "rgb(59, 130, 246)",
         borderWidth: 2,
-        cursor: 'pointer',
-        transition: 'all 0.2s ease',
-        boxShadow: '0 2px 8px rgba(59, 130, 246, 0.1)',
+        cursor: "pointer",
+        transition: "all 0.2s ease",
+        boxShadow: "0 2px 8px rgba(59, 130, 246, 0.1)",
       };
     }
 
@@ -56,15 +58,15 @@ export const SaasPlanCard: React.FC<SaasPlanCardProps> = ({
 
   const handleMouseEnter = (e: React.MouseEvent<HTMLDivElement>) => {
     if (plan.popular && !isCurrentPlan) {
-      e.currentTarget.style.transform = 'translateY(-4px)';
-      e.currentTarget.style.boxShadow = '0 12px 48px rgba(59, 130, 246, 0.3)';
+      e.currentTarget.style.transform = "translateY(-4px)";
+      e.currentTarget.style.boxShadow = "0 12px 48px rgba(59, 130, 246, 0.3)";
     }
   };
 
   const handleMouseLeave = (e: React.MouseEvent<HTMLDivElement>) => {
     if (plan.popular && !isCurrentPlan) {
-      e.currentTarget.style.transform = 'translateY(0)';
-      e.currentTarget.style.boxShadow = '0 2px 8px rgba(59, 130, 246, 0.1)';
+      e.currentTarget.style.transform = "translateY(0)";
+      e.currentTarget.style.boxShadow = "0 2px 8px rgba(59, 130, 246, 0.1)";
     }
   };
 
@@ -89,29 +91,33 @@ export const SaasPlanCard: React.FC<SaasPlanCardProps> = ({
         <Badge
           size="sm"
           style={{
-            position: 'absolute',
+            position: "absolute",
             top: -10,
-            left: '50%',
-            transform: 'translateX(-50%)',
-            background: 'rgb(59, 130, 246)',
-            color: 'white',
+            left: "50%",
+            transform: "translateX(-50%)",
+            background: "rgb(59, 130, 246)",
+            color: "white",
             fontWeight: 600,
-            textTransform: 'uppercase',
-            letterSpacing: '0.5px',
-            paddingLeft: '12px',
-            paddingRight: '12px',
+            textTransform: "uppercase",
+            letterSpacing: "0.5px",
+            paddingLeft: "12px",
+            paddingRight: "12px",
           }}
         >
-          {t('plan.popular', 'Popular')}
+          {t("plan.popular", "Popular")}
         </Badge>
       )}
 
       <Stack gap="sm" className="h-full">
         <div>
-          <Text size="md" fw={600} mb="xs">{plan.name}</Text>
+          <Text size="md" fw={600} mb="xs">
+            {plan.name}
+          </Text>
           <Group gap="xs" align="baseline">
             <Text size="xl" fw={700}>
-              {plan.isContactOnly ? t('plan.customPricing', 'Custom') : `${plan.currency}${plan.price}`}
+              {plan.isContactOnly
+                ? t("plan.customPricing", "Custom")
+                : `${plan.currency}${plan.price}`}
             </Text>
             {!plan.isContactOnly && (
               <Text size="sm" c="dimmed">
@@ -121,30 +127,38 @@ export const SaasPlanCard: React.FC<SaasPlanCardProps> = ({
           </Group>
           <Text size="xs" fw={400} c="dimmed">
             {plan.isContactOnly
-              ? t('plan.enterprise.siteLicense', 'Site License')
-              : plan.id === 'free'
-                ? `50 ${t('credits.modal.monthlyCredits', 'monthly credits')}`
+              ? t("plan.enterprise.siteLicense", "Site License")
+              : plan.id === "free"
+                ? `50 ${t("credits.modal.monthlyCredits", "monthly credits")}`
                 : plan.overagePrice
-                  ? `500 ${t('credits.modal.monthlyCredits', 'monthly credits')} + ${plan.currency}${plan.overagePrice.toFixed(2)}/${t('credits.modal.overage', 'overage')}`
-                  : `500 ${t('credits.modal.monthlyCredits', 'monthly credits')}`
-            }
+                  ? `500 ${t("credits.modal.monthlyCredits", "monthly credits")} + ${plan.currency}${plan.overagePrice.toFixed(2)}/${t("credits.modal.overage", "overage")}`
+                  : `500 ${t("credits.modal.monthlyCredits", "monthly credits")}`}
           </Text>
         </div>
 
         <Stack gap="xs">
           <Text size="xs" fw={500} mb="xs">
-            {plan.id === 'free'
-              ? t('credits.modal.forRegularWork', 'For regular PDF work:')
-              : plan.id === 'enterprise'
-                ? t('credits.modal.everythingInCredits', 'Everything in Credits, plus:')
-                : t('credits.modal.everythingInFree', 'Everything in Free, plus:')
-            }
+            {plan.id === "free"
+              ? t("credits.modal.forRegularWork", "For regular PDF work:")
+              : plan.id === "enterprise"
+                ? t(
+                    "credits.modal.everythingInCredits",
+                    "Everything in Credits, plus:",
+                  )
+                : t(
+                    "credits.modal.everythingInFree",
+                    "Everything in Free, plus:",
+                  )}
           </Text>
           {plan.highlights.map((highlight: string, index: number) => (
             <FeatureListItem
               key={index}
               included
-              color={plan.id === 'free' ? 'var(--mantine-color-gray-6)' : 'var(--color-primary-600)'}
+              color={
+                plan.id === "free"
+                  ? "var(--mantine-color-gray-6)"
+                  : "var(--color-primary-600)"
+              }
               size="xs"
             >
               {highlight}
@@ -155,7 +169,13 @@ export const SaasPlanCard: React.FC<SaasPlanCardProps> = ({
         <div className="flex-grow" />
 
         <Button
-          variant={isCurrentPlan || isIncluded ? "subtle" : plan.isContactOnly ? "outline" : "filled"}
+          variant={
+            isCurrentPlan || isIncluded
+              ? "subtle"
+              : plan.isContactOnly
+                ? "outline"
+                : "filled"
+          }
           color={plan.isContactOnly ? undefined : "blue"}
           disabled={isCurrentPlan || isIncluded}
           fullWidth
@@ -168,26 +188,29 @@ export const SaasPlanCard: React.FC<SaasPlanCardProps> = ({
           style={{
             fontWeight: 600,
             ...((isCurrentPlan || isIncluded) && {
-              background: 'transparent',
-              border: 'none',
-              cursor: 'default',
+              background: "transparent",
+              border: "none",
+              cursor: "default",
             }),
             ...(plan.isContactOnly && {
-              borderColor: 'var(--text-primary)',
-              color: 'var(--text-primary)',
+              borderColor: "var(--text-primary)",
+              color: "var(--text-primary)",
             }),
           }}
-          component={plan.isContactOnly ? 'a' : undefined}
-          href={plan.isContactOnly ? `mailto:contact@stirlingpdf.com?subject=${plan.name} Plan Inquiry` : undefined}
+          component={plan.isContactOnly ? "a" : undefined}
+          href={
+            plan.isContactOnly
+              ? `mailto:contact@stirlingpdf.com?subject=${plan.name} Plan Inquiry`
+              : undefined
+          }
         >
           {isCurrentPlan
-            ? t('plan.current', 'Current Plan')
+            ? t("plan.current", "Current Plan")
             : isIncluded
-            ? t('plan.included', 'Included')
-            : plan.isContactOnly
-            ? t('plan.contact', 'Contact Sales')
-            : t('plan.upgrade', 'Upgrade')
-          }
+              ? t("plan.included", "Included")
+              : plan.isContactOnly
+                ? t("plan.contact", "Contact Sales")
+                : t("plan.upgrade", "Upgrade")}
         </Button>
       </Stack>
     </Card>
diff --git a/frontend/src/desktop/components/shared/config/configSections/plan/UsageDisplay.tsx b/frontend/src/desktop/components/shared/config/configSections/plan/UsageDisplay.tsx
index 4cf1c28bd5..8088c18cfb 100644
--- a/frontend/src/desktop/components/shared/config/configSections/plan/UsageDisplay.tsx
+++ b/frontend/src/desktop/components/shared/config/configSections/plan/UsageDisplay.tsx
@@ -1,13 +1,13 @@
-import React from 'react';
-import { Card, Text, Stack, Group, Progress, Alert } from '@mantine/core';
-import InfoOutlinedIcon from '@mui/icons-material/InfoOutlined';
-import { useTranslation } from 'react-i18next';
-import type { BillingStatus } from '@app/services/saasBillingService';
-import { BILLING_CONFIG, getFormattedOveragePrice } from '@app/config/billing';
+import React from "react";
+import { Card, Text, Stack, Group, Progress, Alert } from "@mantine/core";
+import InfoOutlinedIcon from "@mui/icons-material/InfoOutlined";
+import { useTranslation } from "react-i18next";
+import type { BillingStatus } from "@app/services/saasBillingService";
+import { BILLING_CONFIG, getFormattedOveragePrice } from "@app/config/billing";
 
 interface UsageDisplayProps {
-  tier: BillingStatus['tier'];
-  usage: BillingStatus['meterUsage'];
+  tier: BillingStatus["tier"];
+  usage: BillingStatus["meterUsage"];
 }
 
 export function UsageDisplay({ tier, usage }: UsageDisplayProps) {
@@ -16,11 +16,11 @@ export function UsageDisplay({ tier, usage }: UsageDisplayProps) {
   // Credits per month based on tier
   const getMonthlyCredits = (): number => {
     switch (tier) {
-      case 'free':
+      case "free":
         return BILLING_CONFIG.FREE_CREDITS_PER_MONTH;
-      case 'team':
+      case "team":
         return BILLING_CONFIG.INCLUDED_CREDITS_PER_MONTH;
-      case 'enterprise':
+      case "enterprise":
         return 1000; // Placeholder — enterprise credits are custom
       default:
         return BILLING_CONFIG.FREE_CREDITS_PER_MONTH;
@@ -39,13 +39,13 @@ export function UsageDisplay({ tier, usage }: UsageDisplayProps) {
       <Stack gap="md">
         {/* Header */}
         <Text size="lg" fw={600}>
-          {t('settings.planBilling.credits.title', 'Credit Usage')}
+          {t("settings.planBilling.credits.title", "Credit Usage")}
         </Text>
 
         {/* Monthly credits info */}
         <Group justify="space-between">
           <Text size="sm" c="dimmed">
-            {t('settings.planBilling.credits.included', {
+            {t("settings.planBilling.credits.included", {
               count: monthlyCredits,
               defaultValue: `${monthlyCredits} credits/month (included)`,
             })}
@@ -58,13 +58,13 @@ export function UsageDisplay({ tier, usage }: UsageDisplayProps) {
             <Stack gap="xs">
               <Group justify="space-between">
                 <Text size="sm" c="dimmed">
-                  {t('settings.planBilling.credits.overage', {
+                  {t("settings.planBilling.credits.overage", {
                     count: usage.currentPeriodCredits,
                     defaultValue: `+ ${usage.currentPeriodCredits} overage`,
                   })}
                 </Text>
                 <Text size="sm" fw={500} c="orange">
-                  {t('settings.planBilling.credits.estimatedCost', {
+                  {t("settings.planBilling.credits.estimatedCost", {
                     amount: formatCurrency(usage.estimatedCost),
                     defaultValue: `Estimated cost: ${formatCurrency(usage.estimatedCost)}`,
                   })}
@@ -82,9 +82,13 @@ export function UsageDisplay({ tier, usage }: UsageDisplayProps) {
               />
             </Stack>
 
-            <Alert color="blue" variant="light" icon={<InfoOutlinedIcon sx={{ fontSize: 16 }} />}>
+            <Alert
+              color="blue"
+              variant="light"
+              icon={<InfoOutlinedIcon sx={{ fontSize: 16 }} />}
+            >
               <Text size="xs">
-                {t('settings.planBilling.credits.overageInfo', {
+                {t("settings.planBilling.credits.overageInfo", {
                   price: getFormattedOveragePrice(),
                   defaultValue: `Overage credits are billed at ${getFormattedOveragePrice()} per credit. You'll only pay for what you use beyond your monthly allowance.`,
                 })}
@@ -94,10 +98,10 @@ export function UsageDisplay({ tier, usage }: UsageDisplayProps) {
         )}
 
         {/* No overage message */}
-        {(!usage || usage.currentPeriodCredits === 0) && tier !== 'free' && (
+        {(!usage || usage.currentPeriodCredits === 0) && tier !== "free" && (
           <Alert color="green" variant="light">
             <Text size="sm">
-              {t('settings.planBilling.credits.noOverage', {
+              {t("settings.planBilling.credits.noOverage", {
                 count: monthlyCredits,
                 defaultValue: `No overage charges this month. You're using your included ${monthlyCredits} credits.`,
               })}
@@ -106,10 +110,10 @@ export function UsageDisplay({ tier, usage }: UsageDisplayProps) {
         )}
 
         {/* Free tier message */}
-        {tier === 'free' && (
+        {tier === "free" && (
           <Alert color="blue" variant="light">
             <Text size="sm">
-              {t('settings.planBilling.credits.freeTierInfo', {
+              {t("settings.planBilling.credits.freeTierInfo", {
                 freeCredits: BILLING_CONFIG.FREE_CREDITS_PER_MONTH,
                 teamCredits: BILLING_CONFIG.INCLUDED_CREDITS_PER_MONTH,
                 defaultValue: `Free plan includes ${BILLING_CONFIG.FREE_CREDITS_PER_MONTH} credits per month. Upgrade to Team for ${BILLING_CONFIG.INCLUDED_CREDITS_PER_MONTH} credits/month and pay-as-you-go overage billing.`,
diff --git a/frontend/src/desktop/components/shared/config/types.ts b/frontend/src/desktop/components/shared/config/types.ts
index 4f52474ae1..a1ab108a1f 100644
--- a/frontend/src/desktop/components/shared/config/types.ts
+++ b/frontend/src/desktop/components/shared/config/types.ts
@@ -1,9 +1,9 @@
-import { VALID_NAV_KEYS as CORE_NAV_KEYS } from '@core/components/shared/config/types';
+import { VALID_NAV_KEYS as CORE_NAV_KEYS } from "@core/components/shared/config/types";
 
 export const VALID_NAV_KEYS = [
   ...CORE_NAV_KEYS,
-  'connectionMode',
-  'planBilling',
+  "connectionMode",
+  "planBilling",
 ] as const;
 
-export type NavKey = typeof VALID_NAV_KEYS[number];
+export type NavKey = (typeof VALID_NAV_KEYS)[number];
diff --git a/frontend/src/desktop/components/shared/modals/CreditExhaustedModal.tsx b/frontend/src/desktop/components/shared/modals/CreditExhaustedModal.tsx
index 9f4cd08d4d..51597e2bfb 100644
--- a/frontend/src/desktop/components/shared/modals/CreditExhaustedModal.tsx
+++ b/frontend/src/desktop/components/shared/modals/CreditExhaustedModal.tsx
@@ -1,15 +1,32 @@
-import { Modal, Stack, Card, Text, Group, Badge, Button, Alert } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import TrendingUpIcon from '@mui/icons-material/TrendingUp';
-import { useSaaSBilling } from '@app/contexts/SaasBillingContext';
-import { useSaaSTeam } from '@app/contexts/SaaSTeamContext';
-import { BILLING_CONFIG, getCurrencySymbol, getFormattedOveragePrice } from '@app/config/billing';
-import { Z_INDEX_OVER_CONFIG_MODAL } from '@app/styles/zIndex';
-import { CreditUsageBanner } from '@app/components/shared/modals/CreditUsageBanner';
-import { FeatureListItem } from '@app/components/shared/modals/FeatureListItem';
-import { FREE_PLAN_FEATURES, TEAM_PLAN_FEATURES, ENTERPRISE_PLAN_FEATURES } from '@app/config/planFeatures';
-import { useSaaSCheckout } from '@app/contexts/SaaSCheckoutContext';
-import { useEnableMeteredBilling } from '@app/hooks/useEnableMeteredBilling';
+import {
+  Modal,
+  Stack,
+  Card,
+  Text,
+  Group,
+  Badge,
+  Button,
+  Alert,
+} from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import TrendingUpIcon from "@mui/icons-material/TrendingUp";
+import { useSaaSBilling } from "@app/contexts/SaasBillingContext";
+import { useSaaSTeam } from "@app/contexts/SaaSTeamContext";
+import {
+  BILLING_CONFIG,
+  getCurrencySymbol,
+  getFormattedOveragePrice,
+} from "@app/config/billing";
+import { Z_INDEX_OVER_CONFIG_MODAL } from "@app/styles/zIndex";
+import { CreditUsageBanner } from "@app/components/shared/modals/CreditUsageBanner";
+import { FeatureListItem } from "@app/components/shared/modals/FeatureListItem";
+import {
+  FREE_PLAN_FEATURES,
+  TEAM_PLAN_FEATURES,
+  ENTERPRISE_PLAN_FEATURES,
+} from "@app/config/planFeatures";
+import { useSaaSCheckout } from "@app/contexts/SaaSCheckoutContext";
+import { useEnableMeteredBilling } from "@app/hooks/useEnableMeteredBilling";
 
 interface CreditExhaustedModalProps {
   opened: boolean;
@@ -21,17 +38,18 @@ interface CreditExhaustedModalProps {
  * Shows upgrade options when user runs out of credits
  * Routes to different UI based on user status (free/team/managed member)
  */
-export function CreditExhaustedModal({ opened, onClose }: CreditExhaustedModalProps) {
+export function CreditExhaustedModal({
+  opened,
+  onClose,
+}: CreditExhaustedModalProps) {
   const { t } = useTranslation();
-  const { creditBalance, tier, plans, refreshBilling, isManagedTeamMember } = useSaaSBilling();
+  const { creditBalance, tier, plans, refreshBilling, isManagedTeamMember } =
+    useSaaSBilling();
   const { isTeamLeader } = useSaaSTeam();
   const { openCheckout } = useSaaSCheckout();
 
-  const { enablingMetering, meteringError, handleEnableMetering } = useEnableMeteredBilling(
-    refreshBilling,
-    onClose,
-    'CreditExhaustedModal'
-  );
+  const { enablingMetering, meteringError, handleEnableMetering } =
+    useEnableMeteredBilling(refreshBilling, onClose, "CreditExhaustedModal");
 
   // Managed team members have unlimited credits via team
   if (isManagedTeamMember) {
@@ -43,14 +61,17 @@ export function CreditExhaustedModal({ opened, onClose }: CreditExhaustedModalPr
         centered
         size="md"
         zIndex={Z_INDEX_OVER_CONFIG_MODAL}
-        title={t('credits.modal.managedMemberTitle', 'Unlimited Credits')}
+        title={t("credits.modal.managedMemberTitle", "Unlimited Credits")}
       >
         <Stack gap="md">
           <Text size="sm">
-            {t('credits.modal.managedMemberMessage', 'You have unlimited access to credits through your team. If you need assistance, please contact your team leader.')}
+            {t(
+              "credits.modal.managedMemberMessage",
+              "You have unlimited access to credits through your team. If you need assistance, please contact your team leader.",
+            )}
           </Text>
           <Button onClick={onClose} fullWidth>
-            {t('common.close', 'Close')}
+            {t("common.close", "Close")}
           </Button>
         </Stack>
       </Modal>
@@ -59,12 +80,15 @@ export function CreditExhaustedModal({ opened, onClose }: CreditExhaustedModalPr
 
   // Team users should enable overage billing
   // Only team leaders can enable metered billing, members see different UI
-  if (tier === 'team') {
-
-    const teamPlan = plans.get('team');
-    const teamCurrency = teamPlan?.currency ?? '$';
-    const overagePrice = teamPlan?.overagePrice ?? BILLING_CONFIG.OVERAGE_PRICE_PER_CREDIT;
-    const formattedOveragePrice = getFormattedOveragePrice(teamCurrency, overagePrice);
+  if (tier === "team") {
+    const teamPlan = plans.get("team");
+    const teamCurrency = teamPlan?.currency ?? "$";
+    const overagePrice =
+      teamPlan?.overagePrice ?? BILLING_CONFIG.OVERAGE_PRICE_PER_CREDIT;
+    const formattedOveragePrice = getFormattedOveragePrice(
+      teamCurrency,
+      overagePrice,
+    );
 
     return (
       <Modal
@@ -80,23 +104,29 @@ export function CreditExhaustedModal({ opened, onClose }: CreditExhaustedModalPr
         title={
           <Stack gap="sm">
             <Text size="lg" fw={450}>
-              {t('credits.modal.titleExhaustedPro', 'You have run out of credits')}
+              {t(
+                "credits.modal.titleExhaustedPro",
+                "You have run out of credits",
+              )}
             </Text>
             <Text size="sm" c="dimmed">
-              {t('credits.modal.subtitlePro', 'Enable automatic overage billing to never run out of credits.')}
+              {t(
+                "credits.modal.subtitlePro",
+                "Enable automatic overage billing to never run out of credits.",
+              )}
             </Text>
           </Stack>
         }
         styles={{
-          body: { padding: '0rem 0rem 0.5rem 0rem' },
+          body: { padding: "0rem 0rem 0.5rem 0rem" },
           content: {
-            backgroundColor: 'light-dark(#FFFFFF, #1A1A1E)',
+            backgroundColor: "light-dark(#FFFFFF, #1A1A1E)",
           },
           header: {
-            backgroundColor: 'light-dark(#FFFFFF, #1A1A1E)',
+            backgroundColor: "light-dark(#FFFFFF, #1A1A1E)",
           },
           overlay: {
-            backgroundColor: 'light-dark(rgba(0,0,0,0.5), rgba(0,0,0,0.7))',
+            backgroundColor: "light-dark(rgba(0,0,0,0.5), rgba(0,0,0,0.7))",
           },
         }}
       >
@@ -120,21 +150,26 @@ export function CreditExhaustedModal({ opened, onClose }: CreditExhaustedModalPr
             ml="lg"
             mr="lg"
             style={{
-              borderColor: 'var(--color-primary-600)',
+              borderColor: "var(--color-primary-600)",
               borderWidth: 2,
-              backgroundColor: 'light-dark(#FFFFFF, #1A1A1E)',
+              backgroundColor: "light-dark(#FFFFFF, #1A1A1E)",
             }}
           >
             <Stack gap="md">
               <Group gap="xs" align="center">
-                <TrendingUpIcon sx={{ fontSize: 24, color: 'var(--color-primary-600)' }} />
+                <TrendingUpIcon
+                  sx={{ fontSize: 24, color: "var(--color-primary-600)" }}
+                />
                 <Text size="lg" fw={600}>
-                  {t('credits.modal.meteringTitle', 'Pay-What-You-Use Overage Billing')}
+                  {t(
+                    "credits.modal.meteringTitle",
+                    "Pay-What-You-Use Overage Billing",
+                  )}
                 </Text>
               </Group>
 
               <Text size="sm" c="dimmed">
-                {t('credits.modal.meteringExplanation', {
+                {t("credits.modal.meteringExplanation", {
                   credits: BILLING_CONFIG.INCLUDED_CREDITS_PER_MONTH,
                   defaultValue: `Your Team plan includes ${BILLING_CONFIG.INCLUDED_CREDITS_PER_MONTH} credits per month. When you run out, overage billing automatically provides additional credits so you never have to stop working.`,
                 })}
@@ -142,24 +177,37 @@ export function CreditExhaustedModal({ opened, onClose }: CreditExhaustedModalPr
 
               <Stack gap="xs">
                 <FeatureListItem included>
-                  {t('credits.modal.meteringIncluded', {
+                  {t("credits.modal.meteringIncluded", {
                     credits: BILLING_CONFIG.INCLUDED_CREDITS_PER_MONTH,
                     defaultValue: `${BILLING_CONFIG.INCLUDED_CREDITS_PER_MONTH} credits/month included with Team`,
                   })}
                 </FeatureListItem>
                 <FeatureListItem included>
-                  {t('credits.modal.meteringPrice', 'Additional credits at {{price}}/credit', {
-                    price: formattedOveragePrice,
-                  })}
+                  {t(
+                    "credits.modal.meteringPrice",
+                    "Additional credits at {{price}}/credit",
+                    {
+                      price: formattedOveragePrice,
+                    },
+                  )}
                 </FeatureListItem>
                 <FeatureListItem included>
-                  {t('credits.modal.meteringPayAsYouGo', 'Only pay for what you use')}
+                  {t(
+                    "credits.modal.meteringPayAsYouGo",
+                    "Only pay for what you use",
+                  )}
                 </FeatureListItem>
                 <FeatureListItem included>
-                  {t('credits.modal.meteringNoCommitment', 'No commitment, cancel anytime')}
+                  {t(
+                    "credits.modal.meteringNoCommitment",
+                    "No commitment, cancel anytime",
+                  )}
                 </FeatureListItem>
                 <FeatureListItem included>
-                  {t('credits.modal.meteringNeverRunOut', 'Never run out of credits')}
+                  {t(
+                    "credits.modal.meteringNeverRunOut",
+                    "Never run out of credits",
+                  )}
                 </FeatureListItem>
               </Stack>
 
@@ -167,12 +215,15 @@ export function CreditExhaustedModal({ opened, onClose }: CreditExhaustedModalPr
                 padding="md"
                 radius="md"
                 style={{
-                  backgroundColor: 'light-dark(#F8F9FA, #1A1A1E)',
-                  border: '1px solid var(--border-subtle)',
+                  backgroundColor: "light-dark(#F8F9FA, #1A1A1E)",
+                  border: "1px solid var(--border-subtle)",
                 }}
               >
                 <Text size="xs" c="dimmed">
-                  {t('credits.modal.meteringBillingNote', 'Overage credits are billed monthly alongside your Team subscription. Track your usage anytime in your account settings.')}
+                  {t(
+                    "credits.modal.meteringBillingNote",
+                    "Overage credits are billed monthly alongside your Team subscription. Track your usage anytime in your account settings.",
+                  )}
                 </Text>
               </Card>
             </Stack>
@@ -193,15 +244,25 @@ export function CreditExhaustedModal({ opened, onClose }: CreditExhaustedModalPr
                 fontWeight: 600,
               }}
             >
-              {t('credits.enableOverageBilling', 'Enable Overage Billing')}
+              {t("credits.enableOverageBilling", "Enable Overage Billing")}
             </Button>
             {!isTeamLeader && (
               <Text size="xs" c="dimmed" ta="center">
-                {t('credits.modal.teamLeaderOnly', 'Only team leaders can enable overage billing')}
+                {t(
+                  "credits.modal.teamLeaderOnly",
+                  "Only team leaders can enable overage billing",
+                )}
               </Text>
             )}
-            <Button onClick={onClose} variant="subtle" fullWidth size="md" c="dimmed" disabled={enablingMetering}>
-              {t('credits.maybeLater', 'Maybe later')}
+            <Button
+              onClick={onClose}
+              variant="subtle"
+              fullWidth
+              size="md"
+              c="dimmed"
+              disabled={enablingMetering}
+            >
+              {t("credits.maybeLater", "Maybe later")}
             </Button>
           </Stack>
         </Stack>
@@ -210,10 +271,11 @@ export function CreditExhaustedModal({ opened, onClose }: CreditExhaustedModalPr
   }
 
   // Free tier users - show upgrade modal
-  const teamPlan = plans.get('team');
+  const teamPlan = plans.get("team");
   const teamPrice = teamPlan?.price ?? 20;
-  const teamCurrency = teamPlan?.currency ?? '$';
-  const overagePrice = teamPlan?.overagePrice ?? BILLING_CONFIG.OVERAGE_PRICE_PER_CREDIT;
+  const teamCurrency = teamPlan?.currency ?? "$";
+  const overagePrice =
+    teamPlan?.overagePrice ?? BILLING_CONFIG.OVERAGE_PRICE_PER_CREDIT;
 
   const currencySymbol = getCurrencySymbol(teamCurrency);
   const formattedOveragePrice = `${currencySymbol}${overagePrice.toFixed(2)}`;
@@ -232,23 +294,26 @@ export function CreditExhaustedModal({ opened, onClose }: CreditExhaustedModalPr
       title={
         <Stack gap="sm">
           <Text size="lg" fw={450}>
-            {t('credits.modal.titleExhausted', "You've used your free credits")}
+            {t("credits.modal.titleExhausted", "You've used your free credits")}
           </Text>
           <Text size="sm" c="dimmed">
-            {t('credits.modal.subtitle', 'Upgrade to Team for 10x the credits and faster processing.')}
+            {t(
+              "credits.modal.subtitle",
+              "Upgrade to Team for 10x the credits and faster processing.",
+            )}
           </Text>
         </Stack>
       }
       styles={{
-        body: { padding: '0rem 0rem 0.5rem 0rem' },
+        body: { padding: "0rem 0rem 0.5rem 0rem" },
         content: {
-          backgroundColor: 'light-dark(#FFFFFF, #1A1A1E)',
+          backgroundColor: "light-dark(#FFFFFF, #1A1A1E)",
         },
         header: {
-          backgroundColor: 'light-dark(#FFFFFF, #1A1A1E)',
+          backgroundColor: "light-dark(#FFFFFF, #1A1A1E)",
         },
         overlay: {
-          backgroundColor: 'light-dark(rgba(0,0,0,0.5), rgba(0,0,0,0.7))',
+          backgroundColor: "light-dark(rgba(0,0,0,0.5), rgba(0,0,0,0.7))",
         },
       }}
     >
@@ -265,36 +330,41 @@ export function CreditExhaustedModal({ opened, onClose }: CreditExhaustedModalPr
             radius="md"
             withBorder
             style={{
-              borderColor: 'var(--border-default)',
+              borderColor: "var(--border-default)",
               borderWidth: 1,
               opacity: 0.85,
-              backgroundColor: 'light-dark(#FFFFFF, #1A1A1E)',
+              backgroundColor: "light-dark(#FFFFFF, #1A1A1E)",
             }}
           >
-            <Stack gap="md" style={{ height: '100%' }}>
+            <Stack gap="md" style={{ height: "100%" }}>
               <div>
                 <Text size="lg" fw={600} mb="xs">
-                  {t('credits.modal.freeTier', 'Free Tier')}
+                  {t("credits.modal.freeTier", "Free Tier")}
                 </Text>
                 <Group gap="xs" align="baseline">
                   <Text size="1.75rem" fw={700}>
                     {currencySymbol}0
                   </Text>
                   <Text size="sm" c="dimmed">
-                    {t('credits.modal.perMonth', '/month')}
+                    {t("credits.modal.perMonth", "/month")}
                   </Text>
                 </Group>
                 <Text size="sm" c="dimmed" mt="xs">
-                  {BILLING_CONFIG.FREE_CREDITS_PER_MONTH} {t('credits.modal.monthlyCredits', 'monthly credits')}
+                  {BILLING_CONFIG.FREE_CREDITS_PER_MONTH}{" "}
+                  {t("credits.modal.monthlyCredits", "monthly credits")}
                 </Text>
               </div>
 
               <Stack gap="xs" style={{ flex: 1 }}>
                 <Text size="sm" fw={500} mb="xs">
-                  {t('credits.modal.forRegularWork', 'For regular PDF work:')}
+                  {t("credits.modal.forRegularWork", "For regular PDF work:")}
                 </Text>
                 {FREE_PLAN_FEATURES.map((feature, index) => (
-                  <FeatureListItem key={index} included color="var(--mantine-color-gray-6)">
+                  <FeatureListItem
+                    key={index}
+                    included
+                    color="var(--mantine-color-gray-6)"
+                  >
                     {t(feature.translationKey, feature.defaultText)}
                   </FeatureListItem>
                 ))}
@@ -308,12 +378,12 @@ export function CreditExhaustedModal({ opened, onClose }: CreditExhaustedModalPr
                 radius="lg"
                 style={{
                   fontWeight: 600,
-                  background: 'transparent',
-                  border: 'none',
-                  cursor: 'default',
+                  background: "transparent",
+                  border: "none",
+                  cursor: "default",
                 }}
               >
-                {t('credits.modal.current', 'Current Plan')}
+                {t("credits.modal.current", "Current Plan")}
               </Button>
             </Stack>
           </Card>
@@ -324,65 +394,77 @@ export function CreditExhaustedModal({ opened, onClose }: CreditExhaustedModalPr
             radius="md"
             withBorder
             style={{
-              borderColor: 'var(--card-selected-border)',
+              borderColor: "var(--card-selected-border)",
               borderWidth: 2,
-              cursor: 'pointer',
-              transition: 'all 0.2s ease',
-              position: 'relative',
-              boxShadow: '0 2px 8px rgba(59, 130, 246, 0.1)',
-              overflow: 'visible',
-              backgroundColor: 'light-dark(#FFFFFF, #1A1A1E)',
+              cursor: "pointer",
+              transition: "all 0.2s ease",
+              position: "relative",
+              boxShadow: "0 2px 8px rgba(59, 130, 246, 0.1)",
+              overflow: "visible",
+              backgroundColor: "light-dark(#FFFFFF, #1A1A1E)",
             }}
-            onClick={() => openCheckout('pro')}
+            onClick={() => openCheckout("pro")}
             onMouseEnter={(e) => {
-              e.currentTarget.style.transform = 'translateY(-4px)';
-              e.currentTarget.style.boxShadow = '0 12px 48px rgba(59, 130, 246, 0.3)';
+              e.currentTarget.style.transform = "translateY(-4px)";
+              e.currentTarget.style.boxShadow =
+                "0 12px 48px rgba(59, 130, 246, 0.3)";
             }}
             onMouseLeave={(e) => {
-              e.currentTarget.style.transform = 'translateY(0)';
-              e.currentTarget.style.boxShadow = '0 2px 8px rgba(59, 130, 246, 0.1)';
+              e.currentTarget.style.transform = "translateY(0)";
+              e.currentTarget.style.boxShadow =
+                "0 2px 8px rgba(59, 130, 246, 0.1)";
             }}
           >
             <Badge
               size="sm"
               style={{
-                position: 'absolute',
+                position: "absolute",
                 top: -10,
-                left: '50%',
-                transform: 'translateX(-50%)',
-                background: 'rgb(59, 130, 246)',
-                color: 'white',
+                left: "50%",
+                transform: "translateX(-50%)",
+                background: "rgb(59, 130, 246)",
+                color: "white",
                 fontWeight: 600,
-                textTransform: 'uppercase',
-                letterSpacing: '0.5px',
-                paddingLeft: '12px',
-                paddingRight: '12px',
+                textTransform: "uppercase",
+                letterSpacing: "0.5px",
+                paddingLeft: "12px",
+                paddingRight: "12px",
               }}
             >
-              {t('credits.modal.popular', 'Popular')}
+              {t("credits.modal.popular", "Popular")}
             </Badge>
-            <Stack gap="md" style={{ height: '100%' }}>
+            <Stack gap="md" style={{ height: "100%" }}>
               <div>
                 <Text size="lg" fw={600} mb="xs">
-                  {t('credits.modal.teamSubscription', 'Team')}
+                  {t("credits.modal.teamSubscription", "Team")}
                 </Text>
                 <Group gap="xs" align="baseline" mt="xs">
-                  <Text size="1.75rem" fw={700} style={{ color: 'var(--text-primary)' }}>
+                  <Text
+                    size="1.75rem"
+                    fw={700}
+                    style={{ color: "var(--text-primary)" }}
+                  >
                     {currencySymbol}
                     {teamPrice}
                   </Text>
                   <Text size="sm" c="dimmed">
-                    {t('credits.modal.perMonth', '/month')}
+                    {t("credits.modal.perMonth", "/month")}
                   </Text>
                 </Group>
                 <Text size="sm" c="dimmed" mt="xs">
-                  {BILLING_CONFIG.INCLUDED_CREDITS_PER_MONTH} {t('credits.modal.monthlyCredits', 'monthly credits')} + {formattedOveragePrice}/{t('credits.modal.overage', 'overage')}
+                  {BILLING_CONFIG.INCLUDED_CREDITS_PER_MONTH}{" "}
+                  {t("credits.modal.monthlyCredits", "monthly credits")} +{" "}
+                  {formattedOveragePrice}/
+                  {t("credits.modal.overage", "overage")}
                 </Text>
               </div>
 
               <Stack gap="xs" style={{ flex: 1 }}>
                 <Text size="sm" fw={500} mb="xs">
-                  {t('credits.modal.everythingInFree', 'Everything in Free, plus:')}
+                  {t(
+                    "credits.modal.everythingInFree",
+                    "Everything in Free, plus:",
+                  )}
                 </Text>
                 {TEAM_PLAN_FEATURES.map((feature, index) => (
                   <FeatureListItem key={index} included>
@@ -392,7 +474,7 @@ export function CreditExhaustedModal({ opened, onClose }: CreditExhaustedModalPr
               </Stack>
 
               <Button
-                onClick={() => openCheckout('pro')}
+                onClick={() => openCheckout("pro")}
                 variant="filled"
                 color="blue"
                 fullWidth
@@ -402,7 +484,7 @@ export function CreditExhaustedModal({ opened, onClose }: CreditExhaustedModalPr
                   fontWeight: 600,
                 }}
               >
-                {t('credits.upgrade', 'Upgrade')}
+                {t("credits.upgrade", "Upgrade")}
               </Button>
             </Stack>
           </Card>
@@ -414,25 +496,28 @@ export function CreditExhaustedModal({ opened, onClose }: CreditExhaustedModalPr
             withBorder
             style={{
               borderWidth: 1,
-              backgroundColor: 'light-dark(#FFFFFF, #1A1A1E)',
+              backgroundColor: "light-dark(#FFFFFF, #1A1A1E)",
             }}
           >
-            <Stack gap="md" style={{ height: '100%' }}>
+            <Stack gap="md" style={{ height: "100%" }}>
               <div>
                 <Text size="md" fw={600} mb="xs">
-                  {t('credits.modal.enterpriseSubscription', 'Enterprise')}
+                  {t("credits.modal.enterpriseSubscription", "Enterprise")}
                 </Text>
                 <Text size="1.75rem" fw={600}>
-                  {t('credits.modal.customPricing', 'Custom')}
+                  {t("credits.modal.customPricing", "Custom")}
                 </Text>
                 <Text size="sm" c="dimmed" mt="xs">
-                  {t('credits.modal.unlimitedMonthlyCredits', 'Site License')}
+                  {t("credits.modal.unlimitedMonthlyCredits", "Site License")}
                 </Text>
               </div>
 
               <Stack gap="xs" style={{ flex: 1 }}>
                 <Text size="sm" fw={500} mb="xs">
-                  {t('credits.modal.everythingInCredits', 'Everything in Credits, plus:')}
+                  {t(
+                    "credits.modal.everythingInCredits",
+                    "Everything in Credits, plus:",
+                  )}
                 </Text>
                 {ENTERPRISE_PLAN_FEATURES.map((feature, index) => (
                   <FeatureListItem key={index} included>
@@ -449,34 +534,37 @@ export function CreditExhaustedModal({ opened, onClose }: CreditExhaustedModalPr
                 size="md"
                 radius="lg"
                 style={{
-                  borderColor: 'var(--text-primary)',
-                  color: 'var(--text-primary)',
+                  borderColor: "var(--text-primary)",
+                  color: "var(--text-primary)",
                   fontWeight: 600,
                 }}
               >
-                {t('credits.modal.contactSales', 'Contact Sales')}
+                {t("credits.modal.contactSales", "Contact Sales")}
               </Button>
             </Stack>
           </Card>
         </Group>
 
         <Text size="sm" ta="center" c="dimmed" mt="md">
-          {t('credits.modal.selfHostPrompt', 'Want to self host?')}{' '}
+          {t("credits.modal.selfHostPrompt", "Want to self host?")}{" "}
           <Text
             component="a"
             href="https://www.stirling.com/pricing"
             target="_blank"
             rel="noopener noreferrer"
             size="sm"
-            style={{ color: 'var(--mantine-color-blue-6)', textDecoration: 'none' }}
+            style={{
+              color: "var(--mantine-color-blue-6)",
+              textDecoration: "none",
+            }}
             onMouseEnter={(e) => {
-              e.currentTarget.style.textDecoration = 'underline';
+              e.currentTarget.style.textDecoration = "underline";
             }}
             onMouseLeave={(e) => {
-              e.currentTarget.style.textDecoration = 'none';
+              e.currentTarget.style.textDecoration = "none";
             }}
           >
-            {t('credits.modal.selfHostLink', 'Review the docs and plans')}
+            {t("credits.modal.selfHostLink", "Review the docs and plans")}
           </Text>
         </Text>
       </Stack>
diff --git a/frontend/src/desktop/components/shared/modals/CreditModalBootstrap.tsx b/frontend/src/desktop/components/shared/modals/CreditModalBootstrap.tsx
index e83e1714a9..2b7fce2282 100644
--- a/frontend/src/desktop/components/shared/modals/CreditModalBootstrap.tsx
+++ b/frontend/src/desktop/components/shared/modals/CreditModalBootstrap.tsx
@@ -1,11 +1,11 @@
-import { useEffect, useState } from 'react';
-import { useSaaSBilling } from '@app/contexts/SaasBillingContext';
-import { useSaaSMode } from '@app/hooks/useSaaSMode';
-import { BILLING_CONFIG } from '@app/config/billing';
-import { CreditExhaustedModal } from '@app/components/shared/modals/CreditExhaustedModal';
-import { InsufficientCreditsModal } from '@app/components/shared/modals/InsufficientCreditsModal';
-import { useCreditEvents } from '@app/hooks/useCreditEvents';
-import { CREDIT_EVENTS } from '@app/constants/creditEvents';
+import { useEffect, useState } from "react";
+import { useSaaSBilling } from "@app/contexts/SaasBillingContext";
+import { useSaaSMode } from "@app/hooks/useSaaSMode";
+import { BILLING_CONFIG } from "@app/config/billing";
+import { CreditExhaustedModal } from "@app/components/shared/modals/CreditExhaustedModal";
+import { InsufficientCreditsModal } from "@app/components/shared/modals/InsufficientCreditsModal";
+import { useCreditEvents } from "@app/hooks/useCreditEvents";
+import { CREDIT_EVENTS } from "@app/constants/creditEvents";
 
 /**
  * Desktop Credit Modal Bootstrap
@@ -21,16 +21,35 @@ export function CreditModalBootstrap() {
   }>({});
 
   const isSaaSMode = useSaaSMode();
-  const { creditBalance, isManagedTeamMember, lastFetchTime, plansLastFetchTime, refreshPlans } = useSaaSBilling();
+  const {
+    creditBalance,
+    isManagedTeamMember,
+    lastFetchTime,
+    plansLastFetchTime,
+    refreshPlans,
+  } = useSaaSBilling();
 
   // Preload plan pricing when billing confirms credits are low.
   // Fires once: only when in SaaS mode, billing has loaded (lastFetchTime set) and plans haven't been
   // fetched yet (plansLastFetchTime null). This way the modal shows real prices instantly.
   useEffect(() => {
-    if (isSaaSMode && lastFetchTime !== null && plansLastFetchTime === null && creditBalance < BILLING_CONFIG.PLAN_PRICING_PRELOAD_THRESHOLD && !isManagedTeamMember) {
+    if (
+      isSaaSMode &&
+      lastFetchTime !== null &&
+      plansLastFetchTime === null &&
+      creditBalance < BILLING_CONFIG.PLAN_PRICING_PRELOAD_THRESHOLD &&
+      !isManagedTeamMember
+    ) {
       refreshPlans();
     }
-  }, [isSaaSMode, lastFetchTime, plansLastFetchTime, creditBalance, isManagedTeamMember, refreshPlans]);
+  }, [
+    isSaaSMode,
+    lastFetchTime,
+    plansLastFetchTime,
+    creditBalance,
+    isManagedTeamMember,
+    refreshPlans,
+  ]);
 
   // Monitor credit balance and dispatch events
   useCreditEvents();
@@ -64,7 +83,10 @@ export function CreditModalBootstrap() {
 
     return () => {
       window.removeEventListener(CREDIT_EVENTS.EXHAUSTED, handleExhausted);
-      window.removeEventListener(CREDIT_EVENTS.INSUFFICIENT, handleInsufficient);
+      window.removeEventListener(
+        CREDIT_EVENTS.INSUFFICIENT,
+        handleInsufficient,
+      );
     };
   }, [isManagedTeamMember, creditBalance]);
 
diff --git a/frontend/src/desktop/components/shared/modals/CreditUsageBanner.tsx b/frontend/src/desktop/components/shared/modals/CreditUsageBanner.tsx
index 04e27a8790..deaea0a9e6 100644
--- a/frontend/src/desktop/components/shared/modals/CreditUsageBanner.tsx
+++ b/frontend/src/desktop/components/shared/modals/CreditUsageBanner.tsx
@@ -1,5 +1,5 @@
-import { Divider, Group, Text, Progress, Stack } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
+import { Divider, Group, Text, Progress, Stack } from "@mantine/core";
+import { useTranslation } from "react-i18next";
 
 interface CreditUsageBannerProps {
   currentCredits: number;
@@ -10,9 +10,13 @@ interface CreditUsageBannerProps {
  * Credit usage banner showing remaining credits with progress bar
  * Used in credit exhausted and upgrade modals
  */
-export function CreditUsageBanner({ currentCredits, totalCredits }: CreditUsageBannerProps) {
+export function CreditUsageBanner({
+  currentCredits,
+  totalCredits,
+}: CreditUsageBannerProps) {
   const { t } = useTranslation();
-  const percentageRemaining = totalCredits > 0 ? (currentCredits / totalCredits) * 100 : 0;
+  const percentageRemaining =
+    totalCredits > 0 ? (currentCredits / totalCredits) * 100 : 0;
 
   return (
     <Stack gap="md">
@@ -20,13 +24,17 @@ export function CreditUsageBanner({ currentCredits, totalCredits }: CreditUsageB
       <Stack gap="xs" pr="md" pl="md">
         <Group gap="xs" justify="space-between" align="center">
           <Text size="md" fw={400} c="dimmed">
-            {t('credits.modal.creditsThisMonth', 'Monthly credits')}
+            {t("credits.modal.creditsThisMonth", "Monthly credits")}
           </Text>
-          <Text size="md" fw={600} style={{ color: 'var(--text-primary)' }}>
-            {t('credits.modal.creditsRemaining', '{{current}} of {{total}} remaining', {
-              current: currentCredits,
-              total: totalCredits,
-            })}
+          <Text size="md" fw={600} style={{ color: "var(--text-primary)" }}>
+            {t(
+              "credits.modal.creditsRemaining",
+              "{{current}} of {{total}} remaining",
+              {
+                current: currentCredits,
+                total: totalCredits,
+              },
+            )}
           </Text>
         </Group>
         <Progress
@@ -35,7 +43,7 @@ export function CreditUsageBanner({ currentCredits, totalCredits }: CreditUsageB
           radius="xl"
           color="blue"
           styles={{
-            root: { backgroundColor: 'var(--bg-raised)' },
+            root: { backgroundColor: "var(--bg-raised)" },
           }}
         />
       </Stack>
diff --git a/frontend/src/desktop/components/shared/modals/FeatureListItem.tsx b/frontend/src/desktop/components/shared/modals/FeatureListItem.tsx
index fc3f2e474f..8b3a5a0778 100644
--- a/frontend/src/desktop/components/shared/modals/FeatureListItem.tsx
+++ b/frontend/src/desktop/components/shared/modals/FeatureListItem.tsx
@@ -1,6 +1,6 @@
-import { Group, Text } from '@mantine/core';
-import CheckCircleIcon from '@mui/icons-material/Check';
-import CloseIcon from '@mui/icons-material/Close';
+import { Group, Text } from "@mantine/core";
+import CheckCircleIcon from "@mui/icons-material/Check";
+import CloseIcon from "@mui/icons-material/Close";
 
 interface FeatureListItemProps {
   children: React.ReactNode;
@@ -8,26 +8,26 @@ interface FeatureListItemProps {
   color?: string;
   dimmed?: boolean;
   fw?: number;
-  size?: 'xs' | 'sm' | 'md' | 'lg' | string;
+  size?: "xs" | "sm" | "md" | "lg" | string;
 }
 
 export function FeatureListItem({
   children,
   included,
-  color = 'var(--color-primary-600)',
+  color = "var(--color-primary-600)",
   dimmed = false,
   fw = 400,
-  size = 'sm'
+  size = "sm",
 }: FeatureListItemProps) {
   const Icon = included ? CheckCircleIcon : CloseIcon;
-  const iconColor = included ? color : 'var(--color-red-600)';
+  const iconColor = included ? color : "var(--color-red-600)";
 
   // Map Mantine sizes to icon font sizes
   const iconSizeMap: Record<string, number> = {
     xs: 14,
     sm: 16,
     md: 18,
-    lg: 20
+    lg: 20,
   };
 
   // Determine icon size - use mapped value if it exists, otherwise use the string directly
@@ -39,9 +39,19 @@ export function FeatureListItem({
   return (
     <Group gap="xs" wrap="nowrap" align="flex-start">
       <Icon
-        sx={{ fontSize: iconSize, color: iconColor, flexShrink: 0, marginTop: '2px' }}
+        sx={{
+          fontSize: iconSize,
+          color: iconColor,
+          flexShrink: 0,
+          marginTop: "2px",
+        }}
       />
-      <Text size={textSize} c={dimmed ? 'dimmed' : undefined} fw={fw} style={textSize ? undefined : { fontSize: size }}>
+      <Text
+        size={textSize}
+        c={dimmed ? "dimmed" : undefined}
+        fw={fw}
+        style={textSize ? undefined : { fontSize: size }}
+      >
         {children}
       </Text>
     </Group>
diff --git a/frontend/src/desktop/components/shared/modals/InsufficientCreditsModal.tsx b/frontend/src/desktop/components/shared/modals/InsufficientCreditsModal.tsx
index 1a07b05475..51b6aba300 100644
--- a/frontend/src/desktop/components/shared/modals/InsufficientCreditsModal.tsx
+++ b/frontend/src/desktop/components/shared/modals/InsufficientCreditsModal.tsx
@@ -1,11 +1,11 @@
-import { Modal, Stack, Text, Button, Alert, Group } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { useSaaSBilling } from '@app/contexts/SaasBillingContext';
-import { useSaaSTeam } from '@app/contexts/SaaSTeamContext';
-import { Z_INDEX_OVER_CONFIG_MODAL } from '@app/styles/zIndex';
-import { useSaaSCheckout } from '@app/contexts/SaaSCheckoutContext';
-import WarningIcon from '@mui/icons-material/Warning';
-import { useEnableMeteredBilling } from '@app/hooks/useEnableMeteredBilling';
+import { Modal, Stack, Text, Button, Alert, Group } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import { useSaaSBilling } from "@app/contexts/SaasBillingContext";
+import { useSaaSTeam } from "@app/contexts/SaaSTeamContext";
+import { Z_INDEX_OVER_CONFIG_MODAL } from "@app/styles/zIndex";
+import { useSaaSCheckout } from "@app/contexts/SaaSCheckoutContext";
+import WarningIcon from "@mui/icons-material/Warning";
+import { useEnableMeteredBilling } from "@app/hooks/useEnableMeteredBilling";
 
 interface InsufficientCreditsModalProps {
   opened: boolean;
@@ -25,17 +25,21 @@ export function InsufficientCreditsModal({
   requiredCredits,
 }: InsufficientCreditsModalProps) {
   const { t } = useTranslation();
-  const { creditBalance, tier, refreshBilling, isManagedTeamMember } = useSaaSBilling();
+  const { creditBalance, tier, refreshBilling, isManagedTeamMember } =
+    useSaaSBilling();
   const { isTeamLeader } = useSaaSTeam();
   const { openCheckout } = useSaaSCheckout();
 
-  const { enablingMetering, meteringError, handleEnableMetering } = useEnableMeteredBilling(
-    refreshBilling,
-    onClose,
-    'InsufficientCreditsModal'
-  );
+  const { enablingMetering, meteringError, handleEnableMetering } =
+    useEnableMeteredBilling(
+      refreshBilling,
+      onClose,
+      "InsufficientCreditsModal",
+    );
 
-  const toolName = toolId ? t(`tool.${toolId}.name`, toolId) : t('common.operation', 'this operation');
+  const toolName = toolId
+    ? t(`tool.${toolId}.name`, toolId)
+    : t("common.operation", "this operation");
 
   return (
     <Modal
@@ -47,9 +51,11 @@ export function InsufficientCreditsModal({
       zIndex={Z_INDEX_OVER_CONFIG_MODAL}
       title={
         <Group gap="xs">
-          <WarningIcon sx={{ fontSize: 24, color: 'var(--mantine-color-orange-6)' }} />
+          <WarningIcon
+            sx={{ fontSize: 24, color: "var(--mantine-color-orange-6)" }}
+          />
           <Text size="lg" fw={500}>
-            {t('credits.insufficient.title', 'Insufficient Credits')}
+            {t("credits.insufficient.title", "Insufficient Credits")}
           </Text>
         </Group>
       }
@@ -59,21 +65,21 @@ export function InsufficientCreditsModal({
           <Text size="sm">
             {requiredCredits
               ? t(
-                  'credits.insufficient.messageWithAmount',
-                  'You need {{required}} credits to run {{tool}}, but you only have {{current}}.',
+                  "credits.insufficient.messageWithAmount",
+                  "You need {{required}} credits to run {{tool}}, but you only have {{current}}.",
                   {
                     required: requiredCredits,
                     tool: toolName,
                     current: creditBalance,
-                  }
+                  },
                 )
               : t(
-                  'credits.insufficient.message',
-                  'You do not have enough credits to run {{tool}}. You currently have {{current}} credits.',
+                  "credits.insufficient.message",
+                  "You do not have enough credits to run {{tool}}. You currently have {{current}} credits.",
                   {
                     tool: toolName,
                     current: creditBalance,
-                  }
+                  },
                 )}
           </Text>
         </Alert>
@@ -82,27 +88,23 @@ export function InsufficientCreditsModal({
           <>
             <Text size="sm" c="dimmed">
               {t(
-                'credits.insufficient.managedMember',
-                'Please contact your team leader for assistance.'
+                "credits.insufficient.managedMember",
+                "Please contact your team leader for assistance.",
               )}
             </Text>
             <Button onClick={onClose} fullWidth>
-              {t('common.close', 'Close')}
+              {t("common.close", "Close")}
             </Button>
           </>
-        ) : tier === 'team' ? (
+        ) : tier === "team" ? (
           <>
             <Text size="sm" c="dimmed">
               {t(
-                'credits.insufficient.teamMember',
-                'Enable overage billing to never run out of credits.'
+                "credits.insufficient.teamMember",
+                "Enable overage billing to never run out of credits.",
               )}
             </Text>
-            {meteringError && (
-              <Alert color="red">
-                {meteringError}
-              </Alert>
-            )}
+            {meteringError && <Alert color="red">{meteringError}</Alert>}
             <Button
               variant="filled"
               color="blue"
@@ -111,23 +113,31 @@ export function InsufficientCreditsModal({
               loading={enablingMetering}
               disabled={!isTeamLeader}
             >
-              {t('credits.enableOverageBilling', 'Enable Overage Billing')}
+              {t("credits.enableOverageBilling", "Enable Overage Billing")}
             </Button>
             {!isTeamLeader && (
               <Text size="xs" c="dimmed" ta="center">
-                {t('credits.modal.teamLeaderOnly', 'Only team leaders can enable overage billing')}
+                {t(
+                  "credits.modal.teamLeaderOnly",
+                  "Only team leaders can enable overage billing",
+                )}
               </Text>
             )}
-            <Button onClick={onClose} variant="subtle" fullWidth disabled={enablingMetering}>
-              {t('common.cancel', 'Cancel')}
+            <Button
+              onClick={onClose}
+              variant="subtle"
+              fullWidth
+              disabled={enablingMetering}
+            >
+              {t("common.cancel", "Cancel")}
             </Button>
           </>
         ) : (
           <>
             <Text size="sm" c="dimmed">
               {t(
-                'credits.insufficient.freeTier',
-                'Upgrade to Team for 10x more credits and unlimited overage billing.'
+                "credits.insufficient.freeTier",
+                "Upgrade to Team for 10x more credits and unlimited overage billing.",
               )}
             </Text>
             <Button
@@ -135,14 +145,14 @@ export function InsufficientCreditsModal({
               color="blue"
               fullWidth
               onClick={() => {
-                openCheckout('pro');
+                openCheckout("pro");
                 onClose();
               }}
             >
-              {t('credits.upgrade', 'Upgrade to Team')}
+              {t("credits.upgrade", "Upgrade to Team")}
             </Button>
             <Button onClick={onClose} variant="subtle" fullWidth>
-              {t('common.cancel', 'Cancel')}
+              {t("common.cancel", "Cancel")}
             </Button>
           </>
         )}
diff --git a/frontend/src/desktop/components/tools/toolPicker/ToolButton.tsx b/frontend/src/desktop/components/tools/toolPicker/ToolButton.tsx
index b59df1edbb..ba1ecf8e0e 100644
--- a/frontend/src/desktop/components/tools/toolPicker/ToolButton.tsx
+++ b/frontend/src/desktop/components/tools/toolPicker/ToolButton.tsx
@@ -1,11 +1,12 @@
-import { useState, useEffect } from 'react';
-import CoreToolButton from '@core/components/tools/toolPicker/ToolButton';
-import { getToolDisabledReason } from '@app/components/tools/fullscreen/shared';
-import { useToolWorkflow } from '@app/contexts/ToolWorkflowContext';
-import { useAppConfig } from '@app/contexts/AppConfigContext';
-import { ToolRegistryEntry } from '@app/data/toolsTaxonomy';
-import { connectionModeService, type ConnectionMode } from '@app/services/connectionModeService';
-import type { ToolId } from '@app/types/toolId';
+import { useState, useEffect } from "react";
+import CoreToolButton from "@core/components/tools/toolPicker/ToolButton";
+import { getToolDisabledReason } from "@app/components/tools/fullscreen/shared";
+import { useToolWorkflow } from "@app/contexts/ToolWorkflowContext";
+import { useAppConfig } from "@app/contexts/AppConfigContext";
+import {
+  connectionModeService,
+  type ConnectionMode,
+} from "@app/services/connectionModeService";
 
 type CoreToolButtonProps = React.ComponentProps<typeof CoreToolButton>;
 
@@ -20,18 +21,22 @@ const ToolButton: React.FC<CoreToolButtonProps> = (props) => {
   const { toolAvailability, handleToolSelectForced } = useToolWorkflow();
   const { config } = useAppConfig();
   const premiumEnabled = config?.premiumEnabled;
-  const [connectionMode, setConnectionMode] = useState<ConnectionMode | null>(null);
+  const [connectionMode, setConnectionMode] = useState<ConnectionMode | null>(
+    null,
+  );
 
   useEffect(() => {
     void connectionModeService.getCurrentMode().then(setConnectionMode);
-    return connectionModeService.subscribeToModeChanges((cfg) => setConnectionMode(cfg.mode));
+    return connectionModeService.subscribeToModeChanges((cfg) =>
+      setConnectionMode(cfg.mode),
+    );
   }, []);
 
   const disabledReason = getToolDisabledReason(
-    props.id as string,
-    props.tool as ToolRegistryEntry,
+    props.id,
+    props.tool,
     toolAvailability,
-    premiumEnabled
+    premiumEnabled,
   );
 
   // In local mode, pass a handler so CoreToolButton renders the tool as "cloud-available"
@@ -39,13 +44,15 @@ const ToolButton: React.FC<CoreToolButtonProps> = (props) => {
   // user can see the settings; the disabled execute button handles the sign-in prompt.
   // comingSoon and selfHostedOffline tools remain dimmed — they have no usable UI to show.
   const handleUnavailableClick =
-    connectionMode === 'local' &&
-    disabledReason !== 'comingSoon' &&
-    disabledReason !== 'selfHostedOffline'
-      ? () => handleToolSelectForced(props.id as ToolId)
+    connectionMode === "local" &&
+    disabledReason !== "comingSoon" &&
+    disabledReason !== "selfHostedOffline"
+      ? () => handleToolSelectForced(props.id)
       : undefined;
 
-  return <CoreToolButton {...props} onUnavailableClick={handleUnavailableClick} />;
+  return (
+    <CoreToolButton {...props} onUnavailableClick={handleUnavailableClick} />
+  );
 };
 
 export default ToolButton;
diff --git a/frontend/src/desktop/components/tools/toolPicker/ToolPickerFooterExtensions.tsx b/frontend/src/desktop/components/tools/toolPicker/ToolPickerFooterExtensions.tsx
index fa1418e90f..259b74e523 100644
--- a/frontend/src/desktop/components/tools/toolPicker/ToolPickerFooterExtensions.tsx
+++ b/frontend/src/desktop/components/tools/toolPicker/ToolPickerFooterExtensions.tsx
@@ -1,8 +1,11 @@
-import { useState, useEffect } from 'react';
-import { Group, Text, Button } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { connectionModeService, type ConnectionMode } from '@app/services/connectionModeService';
-import { OPEN_SIGN_IN_EVENT } from '@app/constants/signInEvents';
+import { useState, useEffect } from "react";
+import { Group, Text, Button } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import {
+  connectionModeService,
+  type ConnectionMode,
+} from "@app/services/connectionModeService";
+import { OPEN_SIGN_IN_EVENT } from "@app/constants/signInEvents";
 
 /**
  * Desktop-only footer shown at the bottom of the tool list.
@@ -11,17 +14,21 @@ import { OPEN_SIGN_IN_EVENT } from '@app/constants/signInEvents';
  */
 export function ToolPickerFooterExtensions() {
   const { t } = useTranslation();
-  const [connectionMode, setConnectionMode] = useState<ConnectionMode | null>(null);
+  const [connectionMode, setConnectionMode] = useState<ConnectionMode | null>(
+    null,
+  );
 
   useEffect(() => {
     void connectionModeService.getCurrentMode().then(setConnectionMode);
-    const unsubscribe = connectionModeService.subscribeToModeChanges((config) => {
-      setConnectionMode(config.mode);
-    });
+    const unsubscribe = connectionModeService.subscribeToModeChanges(
+      (config) => {
+        setConnectionMode(config.mode);
+      },
+    );
     return unsubscribe;
   }, []);
 
-  if (connectionMode !== 'local') return null;
+  if (connectionMode !== "local") return null;
 
   return (
     <Group
@@ -32,22 +39,24 @@ export function ToolPickerFooterExtensions() {
       px="sm"
       py={10}
       style={{
-        borderTop: '1px solid var(--border-default)',
-        background: 'var(--bg-toolbar)',
+        borderTop: "1px solid var(--border-default)",
+        background: "var(--bg-toolbar)",
         flexShrink: 0,
       }}
     >
       <Text size="xs" c="dimmed" style={{ flex: 1, minWidth: 0 }}>
-        {t('localMode.toolPicker.message', 'Sign in to unlock all tools.')}
+        {t("localMode.toolPicker.message", "Sign in to unlock all tools.")}
       </Text>
       <Button
         size="compact-xs"
         variant="light"
         color="blue"
         style={{ flexShrink: 0 }}
-        onClick={() => window.dispatchEvent(new CustomEvent(OPEN_SIGN_IN_EVENT))}
+        onClick={() =>
+          window.dispatchEvent(new CustomEvent(OPEN_SIGN_IN_EVENT))
+        }
       >
-        {t('localMode.toolPicker.signIn', 'Sign In')}
+        {t("localMode.toolPicker.signIn", "Sign In")}
       </Button>
     </Group>
   );
diff --git a/frontend/src/desktop/components/viewer/PrintAPIBridge.tsx b/frontend/src/desktop/components/viewer/PrintAPIBridge.tsx
index ec6ca75d70..bdb845e7fe 100644
--- a/frontend/src/desktop/components/viewer/PrintAPIBridge.tsx
+++ b/frontend/src/desktop/components/viewer/PrintAPIBridge.tsx
@@ -1,9 +1,9 @@
-import { useEffect } from 'react';
-import { usePrintCapability } from '@embedpdf/plugin-print/react';
-import { useViewer } from '@app/contexts/ViewerContext';
-import { useDocumentReady } from '@app/components/viewer/hooks/useDocumentReady';
-import { printPdfNatively } from '@app/services/nativePrintService';
-import { DesktopOs, getDesktopOs } from '@app/services/platformService';
+import { useEffect } from "react";
+import { usePrintCapability } from "@embedpdf/plugin-print/react";
+import { useViewer } from "@app/contexts/ViewerContext";
+import { useDocumentReady } from "@app/components/viewer/hooks/useDocumentReady";
+import { printPdfNatively } from "@app/services/nativePrintService";
+import { DesktopOs, getDesktopOs } from "@app/services/platformService";
 import { PrintAPIBridgeProps } from "@core/components/viewer/PrintAPIBridge";
 
 export function PrintAPIBridge({ file, url, fileName }: PrintAPIBridgeProps) {
@@ -13,7 +13,7 @@ export function PrintAPIBridge({ file, url, fileName }: PrintAPIBridgeProps) {
 
   useEffect(() => {
     if (documentReady) {
-      registerBridge('print', {
+      registerBridge("print", {
         state: {},
         api: {
           print: () => {
@@ -28,15 +28,15 @@ export function PrintAPIBridge({ file, url, fileName }: PrintAPIBridgeProps) {
 
               print?.print?.();
             })().catch((error) => {
-              console.error('[Desktop Print] Print failed', error);
+              console.error("[Desktop Print] Print failed", error);
             });
           },
-        }
+        },
       });
     }
 
     return () => {
-      registerBridge('print', null);
+      registerBridge("print", null);
     };
   }, [documentReady, file, fileName, print, registerBridge, url]);
 
diff --git a/frontend/src/desktop/config/billing.ts b/frontend/src/desktop/config/billing.ts
index 050db913ff..d7d3d2c219 100644
--- a/frontend/src/desktop/config/billing.ts
+++ b/frontend/src/desktop/config/billing.ts
@@ -21,20 +21,20 @@ export const BILLING_CONFIG = {
   PLAN_PRICING_PRELOAD_THRESHOLD: 20,
 
   // Stripe lookup keys
-  PRO_PLAN_LOOKUP_KEY: 'plan:pro',
-  METER_LOOKUP_KEY: 'meter:overage',
+  PRO_PLAN_LOOKUP_KEY: "plan:pro",
+  METER_LOOKUP_KEY: "meter:overage",
 
   // Display formats
   CURRENCY_SYMBOLS: {
-    gbp: '£',
-    usd: '$',
-    eur: '€',
-    cny: 'Â¥',
-    inr: '₹',
-    brl: 'R$',
-    idr: 'Rp',
-    jpy: 'Â¥'
-  } as const
+    gbp: "£",
+    usd: "$",
+    eur: "€",
+    cny: "Â¥",
+    inr: "₹",
+    brl: "R$",
+    idr: "Rp",
+    jpy: "Â¥",
+  } as const,
 } as const;
 
 /**
@@ -49,8 +49,14 @@ export function getBillingConfig() {
  * @param currency Currency code (e.g., 'usd', 'gbp')
  * @param price Optional price override (defaults to BILLING_CONFIG.OVERAGE_PRICE_PER_CREDIT)
  */
-export function getFormattedOveragePrice(currency: string = 'usd', price?: number): string {
-  const symbol = BILLING_CONFIG.CURRENCY_SYMBOLS[currency.toLowerCase() as keyof typeof BILLING_CONFIG.CURRENCY_SYMBOLS] || '$';
+export function getFormattedOveragePrice(
+  currency: string = "usd",
+  price?: number,
+): string {
+  const symbol =
+    BILLING_CONFIG.CURRENCY_SYMBOLS[
+      currency.toLowerCase() as keyof typeof BILLING_CONFIG.CURRENCY_SYMBOLS
+    ] || "$";
   const amount = price ?? BILLING_CONFIG.OVERAGE_PRICE_PER_CREDIT;
   return `${symbol}${amount.toFixed(2)}`;
 }
@@ -59,5 +65,9 @@ export function getFormattedOveragePrice(currency: string = 'usd', price?: numbe
  * Get currency symbol from currency code
  */
 export function getCurrencySymbol(currency: string): string {
-  return BILLING_CONFIG.CURRENCY_SYMBOLS[currency.toLowerCase() as keyof typeof BILLING_CONFIG.CURRENCY_SYMBOLS] || currency.toUpperCase();
+  return (
+    BILLING_CONFIG.CURRENCY_SYMBOLS[
+      currency.toLowerCase() as keyof typeof BILLING_CONFIG.CURRENCY_SYMBOLS
+    ] || currency.toUpperCase()
+  );
 }
diff --git a/frontend/src/desktop/config/defaultAppConfig.ts b/frontend/src/desktop/config/defaultAppConfig.ts
index a215f1c6d1..58290870ae 100644
--- a/frontend/src/desktop/config/defaultAppConfig.ts
+++ b/frontend/src/desktop/config/defaultAppConfig.ts
@@ -1,4 +1,4 @@
-import { AppConfig } from '@app/contexts/AppConfigContext';
+import { AppConfig } from "@app/contexts/AppConfigContext";
 
 /**
  * Default configuration used while the bundled backend starts up.
diff --git a/frontend/src/desktop/config/planFeatures.ts b/frontend/src/desktop/config/planFeatures.ts
index bc747225c8..d0d7896c1e 100644
--- a/frontend/src/desktop/config/planFeatures.ts
+++ b/frontend/src/desktop/config/planFeatures.ts
@@ -10,77 +10,77 @@ export interface PlanFeatureConfig {
 
 export const FREE_PLAN_FEATURES: PlanFeatureConfig[] = [
   {
-    translationKey: 'credits.modal.allInOneWorkspace',
-    defaultText: 'All-in-one PDF workspace (viewer, tools & agent)'
+    translationKey: "credits.modal.allInOneWorkspace",
+    defaultText: "All-in-one PDF workspace (viewer, tools & agent)",
   },
   {
-    translationKey: 'credits.modal.fullyPrivateFiles',
-    defaultText: 'Fully private files'
+    translationKey: "credits.modal.fullyPrivateFiles",
+    defaultText: "Fully private files",
   },
   {
-    translationKey: 'credits.modal.standardThroughput',
-    defaultText: 'Standard throughput'
+    translationKey: "credits.modal.standardThroughput",
+    defaultText: "Standard throughput",
   },
   {
-    translationKey: 'credits.modal.customSmartFolders',
-    defaultText: 'Custom Smart Folders'
+    translationKey: "credits.modal.customSmartFolders",
+    defaultText: "Custom Smart Folders",
   },
   {
-    translationKey: 'credits.modal.apiSandbox',
-    defaultText: 'API sandbox'
-  }
+    translationKey: "credits.modal.apiSandbox",
+    defaultText: "API sandbox",
+  },
 ];
 
 export const TEAM_PLAN_FEATURES: PlanFeatureConfig[] = [
   {
-    translationKey: 'credits.modal.unlimitedSeats',
-    defaultText: 'Unlimited seats'
+    translationKey: "credits.modal.unlimitedSeats",
+    defaultText: "Unlimited seats",
   },
   {
-    translationKey: 'credits.modal.fasterThroughput',
-    defaultText: '10x faster throughput'
+    translationKey: "credits.modal.fasterThroughput",
+    defaultText: "10x faster throughput",
   },
   {
-    translationKey: 'credits.modal.largeFileProcessing',
-    defaultText: 'Large file processing'
+    translationKey: "credits.modal.largeFileProcessing",
+    defaultText: "Large file processing",
   },
   {
-    translationKey: 'credits.modal.premiumAiModels',
-    defaultText: 'Premium AI models'
+    translationKey: "credits.modal.premiumAiModels",
+    defaultText: "Premium AI models",
   },
   {
-    translationKey: 'credits.modal.secureApiAccess',
-    defaultText: 'Secure API access'
+    translationKey: "credits.modal.secureApiAccess",
+    defaultText: "Secure API access",
   },
   {
-    translationKey: 'credits.modal.prioritySupport',
-    defaultText: 'Priority support'
-  }
+    translationKey: "credits.modal.prioritySupport",
+    defaultText: "Priority support",
+  },
 ];
 
 export const ENTERPRISE_PLAN_FEATURES: PlanFeatureConfig[] = [
   {
-    translationKey: 'credits.modal.orgWideAccess',
-    defaultText: 'Org-wide access controls'
+    translationKey: "credits.modal.orgWideAccess",
+    defaultText: "Org-wide access controls",
   },
   {
-    translationKey: 'credits.modal.privateDocCloud',
-    defaultText: 'Private Document Cloud'
+    translationKey: "credits.modal.privateDocCloud",
+    defaultText: "Private Document Cloud",
   },
   {
-    translationKey: 'credits.modal.ragFineTuning',
-    defaultText: 'RAG + fine-tuning'
+    translationKey: "credits.modal.ragFineTuning",
+    defaultText: "RAG + fine-tuning",
   },
   {
-    translationKey: 'credits.modal.unlimitedApiAccess',
-    defaultText: 'Unlimited API access'
+    translationKey: "credits.modal.unlimitedApiAccess",
+    defaultText: "Unlimited API access",
   },
   {
-    translationKey: 'credits.modal.advancedMonitoring',
-    defaultText: 'Advanced monitoring'
+    translationKey: "credits.modal.advancedMonitoring",
+    defaultText: "Advanced monitoring",
   },
   {
-    translationKey: 'credits.modal.dedicatedSupportSlas',
-    defaultText: 'Dedicated support & SLAs'
-  }
+    translationKey: "credits.modal.dedicatedSupportSlas",
+    defaultText: "Dedicated support & SLAs",
+  },
 ];
diff --git a/frontend/src/desktop/constants/backendErrors.ts b/frontend/src/desktop/constants/backendErrors.ts
index 2b33c0e028..ebaa88f89c 100644
--- a/frontend/src/desktop/constants/backendErrors.ts
+++ b/frontend/src/desktop/constants/backendErrors.ts
@@ -1,20 +1,27 @@
-import i18n from '@app/i18n';
+import i18n from "@app/i18n";
 
-export const BACKEND_NOT_READY_CODE = 'BACKEND_NOT_READY' as const;
+export const BACKEND_NOT_READY_CODE = "BACKEND_NOT_READY" as const;
 
 export interface BackendNotReadyError extends Error {
   code: typeof BACKEND_NOT_READY_CODE;
 }
 
 export function createBackendNotReadyError(): BackendNotReadyError {
-  return Object.assign(new Error(i18n.t('backendHealth.starting', 'Backend starting up...')), {
-    code: BACKEND_NOT_READY_CODE,
-  });
+  return Object.assign(
+    new Error(i18n.t("backendHealth.starting", "Backend starting up...")),
+    {
+      code: BACKEND_NOT_READY_CODE,
+    },
+  );
 }
 
-export function isBackendNotReadyError(error: unknown): error is BackendNotReadyError {
-  return typeof error === 'object'
-    && error !== null
-    && 'code' in error
-    && (error as { code?: unknown }).code === BACKEND_NOT_READY_CODE;
+export function isBackendNotReadyError(
+  error: unknown,
+): error is BackendNotReadyError {
+  return (
+    typeof error === "object" &&
+    error !== null &&
+    "code" in error &&
+    (error as { code?: unknown }).code === BACKEND_NOT_READY_CODE
+  );
 }
diff --git a/frontend/src/desktop/constants/connection.ts b/frontend/src/desktop/constants/connection.ts
index 9467fcb1c8..33e4aecac2 100644
--- a/frontend/src/desktop/constants/connection.ts
+++ b/frontend/src/desktop/constants/connection.ts
@@ -6,10 +6,12 @@
 export const STIRLING_SAAS_URL: string = import.meta.env.VITE_SAAS_SERVER_URL;
 
 // Stirling SaaS backend API server (for team endpoints, etc.)
-export const STIRLING_SAAS_BACKEND_API_URL: string = import.meta.env.VITE_SAAS_BACKEND_API_URL;
+export const STIRLING_SAAS_BACKEND_API_URL: string = import.meta.env
+  .VITE_SAAS_BACKEND_API_URL;
 
 // Supabase publishable key — used for SaaS authentication
-export const SUPABASE_KEY: string = import.meta.env.VITE_SUPABASE_PUBLISHABLE_DEFAULT_KEY;
+export const SUPABASE_KEY: string = import.meta.env
+  .VITE_SUPABASE_PUBLISHABLE_DEFAULT_KEY;
 
 // Desktop deep link callback for Supabase email confirmations
-export const DESKTOP_DEEP_LINK_CALLBACK = 'stirlingpdf://auth/callback';
+export const DESKTOP_DEEP_LINK_CALLBACK = "stirlingpdf://auth/callback";
diff --git a/frontend/src/desktop/constants/creditEvents.ts b/frontend/src/desktop/constants/creditEvents.ts
index e66896d301..d500debd21 100644
--- a/frontend/src/desktop/constants/creditEvents.ts
+++ b/frontend/src/desktop/constants/creditEvents.ts
@@ -4,9 +4,10 @@
  */
 
 export const CREDIT_EVENTS = {
-  EXHAUSTED: 'credits:exhausted',
-  INSUFFICIENT: 'credits:insufficient',
-  REFRESH_NEEDED: 'credits:refresh-needed',
+  EXHAUSTED: "credits:exhausted",
+  INSUFFICIENT: "credits:insufficient",
+  REFRESH_NEEDED: "credits:refresh-needed",
 } as const;
 
-export type CreditEventType = typeof CREDIT_EVENTS[keyof typeof CREDIT_EVENTS];
+export type CreditEventType =
+  (typeof CREDIT_EVENTS)[keyof typeof CREDIT_EVENTS];
diff --git a/frontend/src/desktop/constants/signInEvents.ts b/frontend/src/desktop/constants/signInEvents.ts
index f377dda3f4..be44f29022 100644
--- a/frontend/src/desktop/constants/signInEvents.ts
+++ b/frontend/src/desktop/constants/signInEvents.ts
@@ -2,4 +2,4 @@
  * CustomEvent name for opening the desktop sign-in modal (SetupWizard).
  * Kept in a leaf module so apiClientSetup and others avoid importing SignInModal (heavy graph).
  */
-export const OPEN_SIGN_IN_EVENT = 'stirling:open-sign-in';
+export const OPEN_SIGN_IN_EVENT = "stirling:open-sign-in";
diff --git a/frontend/src/desktop/contexts/SaaSCheckoutContext.tsx b/frontend/src/desktop/contexts/SaaSCheckoutContext.tsx
index 0b0e992d48..936de0f470 100644
--- a/frontend/src/desktop/contexts/SaaSCheckoutContext.tsx
+++ b/frontend/src/desktop/contexts/SaaSCheckoutContext.tsx
@@ -1,6 +1,12 @@
-import React, { createContext, useContext, useState, ReactNode, useCallback } from 'react';
-import { SaaSStripeCheckout } from '@app/components/shared/billing/SaaSStripeCheckout';
-import { useSaaSBilling } from '@app/contexts/SaasBillingContext';
+import React, {
+  createContext,
+  useContext,
+  useState,
+  ReactNode,
+  useCallback,
+} from "react";
+import { SaaSStripeCheckout } from "@app/components/shared/billing/SaaSStripeCheckout";
+import { useSaaSBilling } from "@app/contexts/SaasBillingContext";
 
 interface SaaSCheckoutContextType {
   opened: boolean;
@@ -9,12 +15,14 @@ interface SaaSCheckoutContextType {
   closeCheckout: () => void;
 }
 
-const SaaSCheckoutContext = createContext<SaaSCheckoutContextType | undefined>(undefined);
+const SaaSCheckoutContext = createContext<SaaSCheckoutContextType | undefined>(
+  undefined,
+);
 
 export const useSaaSCheckout = () => {
   const context = useContext(SaaSCheckoutContext);
   if (!context) {
-    throw new Error('useSaaSCheckout must be used within SaaSCheckoutProvider');
+    throw new Error("useSaaSCheckout must be used within SaaSCheckoutProvider");
   }
   return context;
 };
@@ -24,7 +32,7 @@ interface SaaSCheckoutProviderProps {
 }
 
 export const SaaSCheckoutProvider: React.FC<SaaSCheckoutProviderProps> = ({
-  children
+  children,
 }) => {
   const [opened, setOpened] = useState(false);
   const [selectedPlan, setSelectedPlan] = useState<string | null>(null);
@@ -46,11 +54,14 @@ export const SaaSCheckoutProvider: React.FC<SaaSCheckoutProviderProps> = ({
   // Internal success handler - automatically refreshes billing context
   const handleCheckoutSuccess = useCallback(async () => {
     // Wait for webhooks to process (2 seconds)
-    await new Promise(resolve => setTimeout(resolve, 2000));
+    await new Promise((resolve) => setTimeout(resolve, 2000));
     try {
       await refreshBilling();
     } catch (error) {
-      console.error('[SaaSCheckoutContext] Failed to refresh billing after checkout:', error);
+      console.error(
+        "[SaaSCheckoutContext] Failed to refresh billing after checkout:",
+        error,
+      );
     }
   }, [refreshBilling]);
 
diff --git a/frontend/src/desktop/contexts/SaaSTeamContext.tsx b/frontend/src/desktop/contexts/SaaSTeamContext.tsx
index 893854e2fc..70f1bc9db8 100644
--- a/frontend/src/desktop/contexts/SaaSTeamContext.tsx
+++ b/frontend/src/desktop/contexts/SaaSTeamContext.tsx
@@ -1,7 +1,14 @@
-import { createContext, useContext, useEffect, useState, ReactNode, useCallback } from 'react';
-import apiClient from '@app/services/apiClient';
-import { authService } from '@app/services/authService';
-import { connectionModeService } from '@app/services/connectionModeService';
+import {
+  createContext,
+  useContext,
+  useEffect,
+  useState,
+  ReactNode,
+  useCallback,
+} from "react";
+import apiClient from "@app/services/apiClient";
+import { authService } from "@app/services/authService";
+import { connectionModeService } from "@app/services/connectionModeService";
 
 /**
  * Desktop implementation of SaaS Team Context
@@ -81,7 +88,9 @@ export function SaaSTeamProvider({ children }: { children: ReactNode }) {
   const [teams, setTeams] = useState<Team[]>([]);
   const [teamMembers, setTeamMembers] = useState<TeamMember[]>([]);
   const [teamInvitations, setTeamInvitations] = useState<TeamInvitation[]>([]);
-  const [receivedInvitations, setReceivedInvitations] = useState<TeamInvitation[]>([]);
+  const [receivedInvitations, setReceivedInvitations] = useState<
+    TeamInvitation[]
+  >([]);
   const [loading, setLoading] = useState(true);
   const [isSaasMode, setIsSaasMode] = useState(false);
   const [isAuthenticated, setIsAuthenticated] = useState(false);
@@ -91,21 +100,22 @@ export function SaaSTeamProvider({ children }: { children: ReactNode }) {
     const checkAccess = async () => {
       const mode = await connectionModeService.getCurrentMode();
       const auth = await authService.isAuthenticated();
-      setIsSaasMode(mode === 'saas');
+      setIsSaasMode(mode === "saas");
       setIsAuthenticated(auth);
     };
 
     checkAccess();
 
     // Subscribe to connection mode changes
-    const unsubscribe = connectionModeService.subscribeToModeChanges(checkAccess);
+    const unsubscribe =
+      connectionModeService.subscribeToModeChanges(checkAccess);
     return unsubscribe;
   }, []);
 
   // Subscribe to auth changes
   useEffect(() => {
     const unsubscribe = authService.subscribeToAuth((status) => {
-      setIsAuthenticated(status === 'authenticated');
+      setIsAuthenticated(status === "authenticated");
     });
     return unsubscribe;
   }, []);
@@ -113,16 +123,20 @@ export function SaaSTeamProvider({ children }: { children: ReactNode }) {
   const fetchMyTeams = useCallback(async () => {
     // CRITICAL: Only fetch if in SaaS mode and authenticated
     if (!isSaasMode || !isAuthenticated) {
-      console.log('[SaaSTeamContext] Skipping team fetch - not in SaaS mode or not authenticated');
+      console.log(
+        "[SaaSTeamContext] Skipping team fetch - not in SaaS mode or not authenticated",
+      );
       return null;
     }
 
     try {
-      const response = await apiClient.get<Team[]>('/api/v1/team/my', { suppressErrorToast: true });
+      const response = await apiClient.get<Team[]>("/api/v1/team/my", {
+        suppressErrorToast: true,
+      });
       setTeams(response.data);
 
       const activeTeam = response.data[0];
-      console.log('[SaaSTeamContext] Current team set:', {
+      console.log("[SaaSTeamContext] Current team set:", {
         teamId: activeTeam?.teamId,
         name: activeTeam?.name,
         isPersonal: activeTeam?.isPersonal,
@@ -131,39 +145,58 @@ export function SaaSTeamProvider({ children }: { children: ReactNode }) {
       setCurrentTeam(activeTeam || null);
       return activeTeam || null;
     } catch (error) {
-      console.error('[SaaSTeamContext] Failed to fetch teams:', error);
+      console.error("[SaaSTeamContext] Failed to fetch teams:", error);
       return null;
     }
   }, [isSaasMode, isAuthenticated]);
 
-  const fetchTeamMembers = useCallback(async (teamId: number) => {
-    // CRITICAL: Only fetch if in SaaS mode and authenticated
-    if (!isSaasMode || !isAuthenticated) {
-      console.log('[SaaSTeamContext] Skipping members fetch - not in SaaS mode or not authenticated');
-      return;
-    }
+  const fetchTeamMembers = useCallback(
+    async (teamId: number) => {
+      // CRITICAL: Only fetch if in SaaS mode and authenticated
+      if (!isSaasMode || !isAuthenticated) {
+        console.log(
+          "[SaaSTeamContext] Skipping members fetch - not in SaaS mode or not authenticated",
+        );
+        return;
+      }
 
-    try {
-      const response = await apiClient.get<TeamMember[]>(`/api/v1/team/${teamId}/members`, { suppressErrorToast: true });
-      setTeamMembers(response.data);
-    } catch (error) {
-      console.error('[SaaSTeamContext] Failed to fetch team members:', error);
-    }
-  }, [isSaasMode, isAuthenticated]);
+      try {
+        const response = await apiClient.get<TeamMember[]>(
+          `/api/v1/team/${teamId}/members`,
+          { suppressErrorToast: true },
+        );
+        setTeamMembers(response.data);
+      } catch (error) {
+        console.error("[SaaSTeamContext] Failed to fetch team members:", error);
+      }
+    },
+    [isSaasMode, isAuthenticated],
+  );
 
-  const fetchTeamInvitations = useCallback(async (teamId?: number) => {
-    // CRITICAL: Only fetch if in SaaS mode and authenticated
-    if (!isSaasMode || !isAuthenticated || !teamId) {
-      return;
-    }
+  const fetchTeamInvitations = useCallback(
+    async (teamId?: number) => {
+      // CRITICAL: Only fetch if in SaaS mode and authenticated
+      if (!isSaasMode || !isAuthenticated || !teamId) {
+        return;
+      }
 
-    try {
-      const response = await apiClient.get<TeamInvitation[]>(`/api/v1/team/${teamId}/invitations`, { suppressErrorToast: true });
-      setTeamInvitations(response.data);
-    } catch (error) {
-      console.error('[SaaSTeamContext] Failed to fetch team invitations:', error);
-    }
-  }, [isSaasMode, isAuthenticated]);
+      try {
+        const response = await apiClient.get<TeamInvitation[]>(
+          `/api/v1/team/${teamId}/invitations`,
+          {
+            suppressErrorToast: true,
+          },
+        );
+        setTeamInvitations(response.data);
+      } catch (error) {
+        console.error(
+          "[SaaSTeamContext] Failed to fetch team invitations:",
+          error,
+        );
+      }
+    },
+    [isSaasMode, isAuthenticated],
+  );
 
   const fetchReceivedInvitations = useCallback(async () => {
     // CRITICAL: Only fetch if in SaaS mode and authenticated
@@ -171,14 +204,23 @@ export function SaaSTeamProvider({ children }: { children: ReactNode }) {
       return;
     }
 
-    console.log('[SaaSTeamContext] Fetching received team invitations');
+    console.log("[SaaSTeamContext] Fetching received team invitations");
 
     try {
-      const response = await apiClient.get<TeamInvitation[]>('/api/v1/team/invitations/pending', { suppressErrorToast: true });
-      console.log('[SaaSTeamContext] Received invitations response:', response.data);
+      const response = await apiClient.get<TeamInvitation[]>(
+        "/api/v1/team/invitations/pending",
+        { suppressErrorToast: true },
+      );
+      console.log(
+        "[SaaSTeamContext] Received invitations response:",
+        response.data,
+      );
       setReceivedInvitations(response.data);
     } catch (error) {
-      console.error('[SaaSTeamContext] Failed to fetch received invitations:', error);
+      console.error(
+        "[SaaSTeamContext] Failed to fetch received invitations:",
+        error,
+      );
     }
   }, [isSaasMode, isAuthenticated]);
 
@@ -198,7 +240,12 @@ export function SaaSTeamProvider({ children }: { children: ReactNode }) {
   }, [isSaasMode, isAuthenticated, fetchMyTeams, fetchReceivedInvitations]);
 
   useEffect(() => {
-    if (currentTeam && !currentTeam.isPersonal && isSaasMode && isAuthenticated) {
+    if (
+      currentTeam &&
+      !currentTeam.isPersonal &&
+      isSaasMode &&
+      isAuthenticated
+    ) {
       fetchTeamMembers(currentTeam.teamId);
       // Only fetch invitations if user is team leader
       if (currentTeam.isLeader) {
@@ -211,21 +258,27 @@ export function SaaSTeamProvider({ children }: { children: ReactNode }) {
       setTeamInvitations([]);
     }
     setLoading(false);
-  }, [currentTeam, isSaasMode, isAuthenticated, fetchTeamMembers, fetchTeamInvitations]);
+  }, [
+    currentTeam,
+    isSaasMode,
+    isAuthenticated,
+    fetchTeamMembers,
+    fetchTeamInvitations,
+  ]);
 
   const inviteUser = async (email: string) => {
-    if (!currentTeam) throw new Error('No current team');
-    if (!isSaasMode) throw new Error('Not in SaaS mode');
+    if (!currentTeam) throw new Error("No current team");
+    if (!isSaasMode) throw new Error("Not in SaaS mode");
 
-    await apiClient.post('/api/v1/team/invite', {
+    await apiClient.post("/api/v1/team/invite", {
       teamId: currentTeam.teamId,
-      email
+      email,
     });
     await fetchTeamInvitations(currentTeam.teamId);
   };
 
   const acceptInvitation = async (token: string) => {
-    if (!isSaasMode) throw new Error('Not in SaaS mode');
+    if (!isSaasMode) throw new Error("Not in SaaS mode");
 
     await apiClient.post(`/api/v1/team/invitations/${token}/accept`);
     await fetchReceivedInvitations();
@@ -234,14 +287,14 @@ export function SaaSTeamProvider({ children }: { children: ReactNode }) {
   };
 
   const rejectInvitation = async (token: string) => {
-    if (!isSaasMode) throw new Error('Not in SaaS mode');
+    if (!isSaasMode) throw new Error("Not in SaaS mode");
 
     await apiClient.post(`/api/v1/team/invitations/${token}/reject`);
     await fetchReceivedInvitations();
   };
 
   const cancelInvitation = async (invitationId: number) => {
-    if (!isSaasMode) throw new Error('Not in SaaS mode');
+    if (!isSaasMode) throw new Error("Not in SaaS mode");
 
     await apiClient.delete(`/api/v1/team/invitations/${invitationId}`);
     if (currentTeam) {
@@ -250,17 +303,19 @@ export function SaaSTeamProvider({ children }: { children: ReactNode }) {
   };
 
   const removeMember = async (memberId: number) => {
-    if (!currentTeam) throw new Error('No current team');
-    if (!isSaasMode) throw new Error('Not in SaaS mode');
+    if (!currentTeam) throw new Error("No current team");
+    if (!isSaasMode) throw new Error("Not in SaaS mode");
 
-    await apiClient.delete(`/api/v1/team/${currentTeam.teamId}/members/${memberId}`);
+    await apiClient.delete(
+      `/api/v1/team/${currentTeam.teamId}/members/${memberId}`,
+    );
     await refreshTeams();
     await fetchTeamMembers(currentTeam.teamId);
   };
 
   const leaveTeam = async () => {
-    if (!currentTeam) throw new Error('No current team');
-    if (!isSaasMode) throw new Error('Not in SaaS mode');
+    if (!currentTeam) throw new Error("No current team");
+    if (!isSaasMode) throw new Error("Not in SaaS mode");
 
     await apiClient.post(`/api/v1/team/${currentTeam.teamId}/leave`);
     await refreshTeams();
@@ -269,7 +324,9 @@ export function SaaSTeamProvider({ children }: { children: ReactNode }) {
 
   const refreshTeams = useCallback(async () => {
     if (!isSaasMode || !isAuthenticated) {
-      console.log('[SaaSTeamContext] Skipping refresh - not in SaaS mode or not authenticated');
+      console.log(
+        "[SaaSTeamContext] Skipping refresh - not in SaaS mode or not authenticated",
+      );
       return;
     }
 
@@ -282,29 +339,38 @@ export function SaaSTeamProvider({ children }: { children: ReactNode }) {
         await fetchTeamInvitations(newCurrentTeam.teamId);
       }
     }
-  }, [isSaasMode, isAuthenticated, fetchMyTeams, fetchReceivedInvitations, fetchTeamMembers, fetchTeamInvitations]);
+  }, [
+    isSaasMode,
+    isAuthenticated,
+    fetchMyTeams,
+    fetchReceivedInvitations,
+    fetchTeamMembers,
+    fetchTeamInvitations,
+  ]);
 
   const isTeamLeader = currentTeam?.isLeader ?? false;
   const isPersonalTeam = currentTeam?.isPersonal ?? true;
 
   return (
-    <SaaSTeamContext.Provider value={{
-      currentTeam,
-      teams,
-      teamMembers,
-      teamInvitations,
-      receivedInvitations,
-      isTeamLeader,
-      isPersonalTeam,
-      loading,
-      inviteUser,
-      acceptInvitation,
-      rejectInvitation,
-      cancelInvitation,
-      removeMember,
-      leaveTeam,
-      refreshTeams
-    }}>
+    <SaaSTeamContext.Provider
+      value={{
+        currentTeam,
+        teams,
+        teamMembers,
+        teamInvitations,
+        receivedInvitations,
+        isTeamLeader,
+        isPersonalTeam,
+        loading,
+        inviteUser,
+        acceptInvitation,
+        rejectInvitation,
+        cancelInvitation,
+        removeMember,
+        leaveTeam,
+        refreshTeams,
+      }}
+    >
       {children}
     </SaaSTeamContext.Provider>
   );
@@ -313,7 +379,7 @@ export function SaaSTeamProvider({ children }: { children: ReactNode }) {
 export function useSaaSTeam() {
   const context = useContext(SaaSTeamContext);
   if (context === undefined) {
-    throw new Error('useSaaSTeam must be used within a SaaSTeamProvider');
+    throw new Error("useSaaSTeam must be used within a SaaSTeamProvider");
   }
   return context;
 }
diff --git a/frontend/src/desktop/contexts/SaasBillingContext.tsx b/frontend/src/desktop/contexts/SaasBillingContext.tsx
index 50a15e2721..d6a5f6b4e5 100644
--- a/frontend/src/desktop/contexts/SaasBillingContext.tsx
+++ b/frontend/src/desktop/contexts/SaasBillingContext.tsx
@@ -1,9 +1,22 @@
-import { createContext, useContext, useEffect, useState, ReactNode, useCallback, useRef, useMemo } from 'react';
-import { saasBillingService, BillingStatus, PlanPrice } from '@app/services/saasBillingService';
-import { authService } from '@app/services/authService';
-import { connectionModeService } from '@app/services/connectionModeService';
-import { useSaaSTeam } from '@app/contexts/SaaSTeamContext';
-import type { TierLevel } from '@app/types/billing';
+import {
+  createContext,
+  useContext,
+  useEffect,
+  useState,
+  ReactNode,
+  useCallback,
+  useRef,
+  useMemo,
+} from "react";
+import {
+  saasBillingService,
+  BillingStatus,
+  PlanPrice,
+} from "@app/services/saasBillingService";
+import { authService } from "@app/services/authService";
+import { connectionModeService } from "@app/services/connectionModeService";
+import { useSaaSTeam } from "@app/contexts/SaaSTeamContext";
+import type { TierLevel } from "@app/types/billing";
 
 // How long plan pricing is considered fresh. Lives at module level so both the
 // provider and usePlanPricing (the consumer hook) can reference it.
@@ -26,8 +39,8 @@ interface SaasBillingContextType {
   // Billing Status
   billingStatus: BillingStatus | null;
   tier: TierLevel;
-  subscription: BillingStatus['subscription'];
-  usage: BillingStatus['meterUsage'];
+  subscription: BillingStatus["subscription"];
+  usage: BillingStatus["meterUsage"];
   isTrialing: boolean;
   trialDaysRemaining?: number;
   price?: number;
@@ -57,7 +70,7 @@ interface SaasBillingContextType {
 
 const SaasBillingContext = createContext<SaasBillingContextType>({
   billingStatus: null,
-  tier: 'free',
+  tier: "free",
   subscription: null,
   usage: null,
   isTrialing: false,
@@ -80,54 +93,68 @@ const SaasBillingContext = createContext<SaasBillingContextType>({
 });
 
 export function SaasBillingProvider({ children }: { children: ReactNode }) {
-  const [billingStatus, setBillingStatus] = useState<BillingStatus | null>(null);
+  const [billingStatus, setBillingStatus] = useState<BillingStatus | null>(
+    null,
+  );
   const [plans, setPlans] = useState<Map<string, PlanPrice>>(new Map());
   const [plansLoading, setPlansLoading] = useState(false);
   const [plansError, setPlansError] = useState<string | null>(null);
-  const [loading, setLoading] = useState(false);  // Start false (lazy load)
+  const [loading, setLoading] = useState(false); // Start false (lazy load)
   const [error, setError] = useState<string | null>(null);
   // lastFetchTimeRef is the source of truth for cache logic (always current, no stale closure).
   // lastFetchTimeValue mirrors it as state purely to drive re-renders and expose through context.
   const lastFetchTimeRef = useRef<number | null>(null);
-  const [lastFetchTimeValue, setLastFetchTimeValue] = useState<number | null>(null);
+  const [lastFetchTimeValue, setLastFetchTimeValue] = useState<number | null>(
+    null,
+  );
   // billingStatusRef mirrors billingStatus so fetchBillingData can read the current value
   // without needing billingStatus in its useCallback dep array.
   const billingStatusRef = useRef<BillingStatus | null>(null);
   // plansLastFetchTimeRef is the source of truth for timing; plansLastFetchTimeValue
   // is the state mirror exposed via context so consumers can react to it.
   const plansLastFetchTimeRef = useRef<number | null>(null);
-  const [plansLastFetchTimeValue, setPlansLastFetchTimeValue] = useState<number | null>(null);
+  const [plansLastFetchTimeValue, setPlansLastFetchTimeValue] = useState<
+    number | null
+  >(null);
   // In-flight deduplication — prevents concurrent duplicate network requests.
   const plansFetchInProgressRef = useRef(false);
   const [isSaasMode, setIsSaasMode] = useState(false);
   const [isAuthenticated, setIsAuthenticated] = useState(false);
 
   // Access team context for derived state
-  const { currentTeam, isPersonalTeam, isTeamLeader, loading: teamLoading } = useSaaSTeam();
+  const {
+    currentTeam,
+    isPersonalTeam,
+    isTeamLeader,
+    loading: teamLoading,
+  } = useSaaSTeam();
 
   // Compute derived state: user is managed member if in non-personal team but not leader
-  const isManagedTeamMember = currentTeam ? !isPersonalTeam && !isTeamLeader : false;
+  const isManagedTeamMember = currentTeam
+    ? !isPersonalTeam && !isTeamLeader
+    : false;
 
   // Check if in SaaS mode and authenticated (same pattern as SaaSTeamContext)
   useEffect(() => {
     const checkAccess = async () => {
       const mode = await connectionModeService.getCurrentMode();
       const auth = await authService.isAuthenticated();
-      setIsSaasMode(mode === 'saas');
+      setIsSaasMode(mode === "saas");
       setIsAuthenticated(auth);
     };
 
     checkAccess();
 
     // Subscribe to connection mode changes
-    const unsubscribe = connectionModeService.subscribeToModeChanges(checkAccess);
+    const unsubscribe =
+      connectionModeService.subscribeToModeChanges(checkAccess);
     return unsubscribe;
   }, []);
 
   // Subscribe to auth changes
   useEffect(() => {
     const unsubscribe = authService.subscribeToAuth((status) => {
-      setIsAuthenticated(status === 'authenticated');
+      setIsAuthenticated(status === "authenticated");
     });
     return unsubscribe;
   }, []);
@@ -151,7 +178,11 @@ export function SaasBillingProvider({ children }: { children: ReactNode }) {
 
     // Cache check: Skip if fresh data exists (<5 min old)
     const now = Date.now();
-    if (billingStatusRef.current && lastFetchTimeRef.current && (now - lastFetchTimeRef.current) < 300000) {
+    if (
+      billingStatusRef.current &&
+      lastFetchTimeRef.current &&
+      now - lastFetchTimeRef.current < 300000
+    ) {
       return;
     }
 
@@ -168,8 +199,8 @@ export function SaasBillingProvider({ children }: { children: ReactNode }) {
       setLastFetchTimeValue(now);
       setError(null);
     } catch (err) {
-      console.error('[SaasBillingContext] Failed to fetch billing:', err);
-      setError(err instanceof Error ? err.message : 'Failed to fetch billing');
+      console.error("[SaasBillingContext] Failed to fetch billing:", err);
+      setError(err instanceof Error ? err.message : "Failed to fetch billing");
       // Don't clear billing status on error (preserve existing data)
     } finally {
       setLoading(false);
@@ -192,14 +223,16 @@ export function SaasBillingProvider({ children }: { children: ReactNode }) {
     setPlansError(null);
 
     try {
-      const priceMap = await saasBillingService.getAvailablePlans('usd');
+      const priceMap = await saasBillingService.getAvailablePlans("usd");
       setPlans(priceMap);
       const now = Date.now();
       plansLastFetchTimeRef.current = now;
       setPlansLastFetchTimeValue(now);
     } catch (err) {
-      console.error('[SaasBillingContext] Failed to fetch plans:', err);
-      setPlansError(err instanceof Error ? err.message : 'Failed to fetch plans');
+      console.error("[SaasBillingContext] Failed to fetch plans:", err);
+      setPlansError(
+        err instanceof Error ? err.message : "Failed to fetch plans",
+      );
     } finally {
       plansFetchInProgressRef.current = false;
       setPlansLoading(false);
@@ -237,7 +270,13 @@ export function SaasBillingProvider({ children }: { children: ReactNode }) {
     ) {
       fetchBillingData();
     }
-  }, [isSaasMode, isAuthenticated, teamLoading, isManagedTeamMember, fetchBillingData]);
+  }, [
+    isSaasMode,
+    isAuthenticated,
+    teamLoading,
+    isManagedTeamMember,
+    fetchBillingData,
+  ]);
 
   // Public refresh methods
   const refreshBilling = useCallback(async () => {
@@ -272,7 +311,7 @@ export function SaasBillingProvider({ children }: { children: ReactNode }) {
       const customEvent = e as CustomEvent<{ creditsRemaining: number }>;
       const newBalance = customEvent.detail?.creditsRemaining;
 
-      if (typeof newBalance === 'number' && billingStatus) {
+      if (typeof newBalance === "number" && billingStatus) {
         // Update credit balance in billing status without full refresh
         const updated = { ...billingStatus, creditBalance: newBalance };
         billingStatusRef.current = updated;
@@ -280,46 +319,64 @@ export function SaasBillingProvider({ children }: { children: ReactNode }) {
 
         // Dispatch exhausted event if credits hit 0
         if (newBalance <= 0 && (billingStatus.creditBalance ?? 0) > 0) {
-          window.dispatchEvent(new CustomEvent('credits:exhausted', {
-            detail: { previousBalance: billingStatus.creditBalance ?? 0, currentBalance: newBalance }
-          }));
+          window.dispatchEvent(
+            new CustomEvent("credits:exhausted", {
+              detail: {
+                previousBalance: billingStatus.creditBalance ?? 0,
+                currentBalance: newBalance,
+              },
+            }),
+          );
         }
       }
     };
 
-    window.addEventListener('credits:updated', handleCreditsUpdated);
+    window.addEventListener("credits:updated", handleCreditsUpdated);
     return () => {
-      window.removeEventListener('credits:updated', handleCreditsUpdated);
+      window.removeEventListener("credits:updated", handleCreditsUpdated);
     };
   }, [billingStatus]);
 
-  const contextValue = useMemo(() => ({
-    billingStatus,
-    tier: isManagedTeamMember ? 'team' : (billingStatus?.tier ?? 'free'),
-    subscription: billingStatus?.subscription ?? null,
-    usage: billingStatus?.meterUsage ?? null,
-    isTrialing: billingStatus?.isTrialing ?? false,
-    trialDaysRemaining: billingStatus?.trialDaysRemaining,
-    price: plans.get('team')?.price,
-    currency: plans.get('team')?.currency,
-    creditBalance: billingStatus?.creditBalance ?? 0,
-    plans,
-    plansLoading,
-    plansError,
-    plansLastFetchTime: plansLastFetchTimeValue,
-    isManagedTeamMember,
-    loading: loading || teamLoading,
-    error,
-    lastFetchTime: lastFetchTimeValue,
-    refreshBilling,
-    refreshCredits: refreshBilling,
-    refreshPlans,
-    openBillingPortal,
-  }), [
-    billingStatus, isManagedTeamMember, plans, plansLoading, plansError,
-    plansLastFetchTimeValue, loading, teamLoading, error, lastFetchTimeValue,
-    refreshBilling, refreshPlans, openBillingPortal,
-  ]);
+  const contextValue = useMemo(
+    () => ({
+      billingStatus,
+      tier: isManagedTeamMember ? "team" : (billingStatus?.tier ?? "free"),
+      subscription: billingStatus?.subscription ?? null,
+      usage: billingStatus?.meterUsage ?? null,
+      isTrialing: billingStatus?.isTrialing ?? false,
+      trialDaysRemaining: billingStatus?.trialDaysRemaining,
+      price: plans.get("team")?.price,
+      currency: plans.get("team")?.currency,
+      creditBalance: billingStatus?.creditBalance ?? 0,
+      plans,
+      plansLoading,
+      plansError,
+      plansLastFetchTime: plansLastFetchTimeValue,
+      isManagedTeamMember,
+      loading: loading || teamLoading,
+      error,
+      lastFetchTime: lastFetchTimeValue,
+      refreshBilling,
+      refreshCredits: refreshBilling,
+      refreshPlans,
+      openBillingPortal,
+    }),
+    [
+      billingStatus,
+      isManagedTeamMember,
+      plans,
+      plansLoading,
+      plansError,
+      plansLastFetchTimeValue,
+      loading,
+      teamLoading,
+      error,
+      lastFetchTimeValue,
+      refreshBilling,
+      refreshPlans,
+      openBillingPortal,
+    ],
+  );
 
   return (
     <SaasBillingContext.Provider value={contextValue}>
@@ -331,7 +388,7 @@ export function SaasBillingProvider({ children }: { children: ReactNode }) {
 export function useSaaSBilling() {
   const context = useContext(SaasBillingContext);
   if (context === undefined) {
-    throw new Error('useSaaSBilling must be used within SaasBillingProvider');
+    throw new Error("useSaaSBilling must be used within SaasBillingProvider");
   }
 
   // Lazy fetch: Trigger fetch on first access (after team context loads)
@@ -346,7 +403,13 @@ export function useSaaSBilling() {
     if (needsFetch) {
       context.refreshBilling();
     }
-  }, [context.billingStatus, context.lastFetchTime, context.loading, context.isManagedTeamMember, context.refreshBilling]);
+  }, [
+    context.billingStatus,
+    context.lastFetchTime,
+    context.loading,
+    context.isManagedTeamMember,
+    context.refreshBilling,
+  ]);
 
   return context;
 }
@@ -357,7 +420,8 @@ export function useSaaSBilling() {
  * Safe to call from multiple components — in-flight deduplication is handled by fetchPlansData.
  */
 export function usePlanPricing() {
-  const { plans, plansLoading, plansError, plansLastFetchTime, refreshPlans } = useContext(SaasBillingContext);
+  const { plans, plansLoading, plansError, plansLastFetchTime, refreshPlans } =
+    useContext(SaasBillingContext);
 
   useEffect(() => {
     const isFresh =
diff --git a/frontend/src/desktop/extensions/accountLogout.ts b/frontend/src/desktop/extensions/accountLogout.ts
index c45fcc8898..b97b06ec6e 100644
--- a/frontend/src/desktop/extensions/accountLogout.ts
+++ b/frontend/src/desktop/extensions/accountLogout.ts
@@ -1,4 +1,4 @@
-import { connectionModeService } from '@app/services/connectionModeService';
+import { connectionModeService } from "@app/services/connectionModeService";
 
 type SignOutFn = () => Promise<void>;
 
@@ -11,24 +11,33 @@ interface AccountLogoutDeps {
  * Desktop-specific logout: mirrors Connection Settings flow to avoid stale state.
  */
 export function useAccountLogout() {
-  return async ({ signOut, redirectToLogin }: AccountLogoutDeps): Promise<void> => {
+  return async ({
+    signOut,
+    redirectToLogin,
+  }: AccountLogoutDeps): Promise<void> => {
     try {
       await signOut();
 
       const currentConfig = await connectionModeService.getCurrentConfig();
       // Save server URL before clearing so user can easily reconnect (self-hosted only)
-      if (currentConfig.mode === 'selfhosted' && currentConfig.server_config?.url) {
-        localStorage.setItem('server_url', currentConfig.server_config.url);
+      if (
+        currentConfig.mode === "selfhosted" &&
+        currentConfig.server_config?.url
+      ) {
+        localStorage.setItem("server_url", currentConfig.server_config.url);
       }
       // Always switch to local after logout so the app remains usable
       await connectionModeService.switchToLocal();
 
-      window.history.replaceState({}, '', '/');
+      window.history.replaceState({}, "", "/");
       // No reload needed — AppProviders remounts the SaaS provider tree via
       // connectionModeService subscription when mode changes to local.
       return;
     } catch (err) {
-      console.warn('[Desktop AccountLogout] Desktop-specific logout failed, falling back to redirect', err);
+      console.warn(
+        "[Desktop AccountLogout] Desktop-specific logout failed, falling back to redirect",
+        err,
+      );
     }
 
     redirectToLogin();
diff --git a/frontend/src/desktop/extensions/authCallback.ts b/frontend/src/desktop/extensions/authCallback.ts
index 6ffcb0e276..90e88c53a1 100644
--- a/frontend/src/desktop/extensions/authCallback.ts
+++ b/frontend/src/desktop/extensions/authCallback.ts
@@ -3,12 +3,18 @@
  */
 export async function handleAuthCallbackSuccess(token: string): Promise<void> {
   // Notify desktop popup listeners (self-hosted SSO flow)
-  const isDesktopPopup = typeof window !== 'undefined' && window.opener && window.name === 'stirling-desktop-sso';
+  const isDesktopPopup =
+    typeof window !== "undefined" &&
+    window.opener &&
+    window.name === "stirling-desktop-sso";
   if (isDesktopPopup) {
     try {
-      window.opener.postMessage({ type: 'stirling-desktop-sso', token }, '*');
+      window.opener.postMessage({ type: "stirling-desktop-sso", token }, "*");
     } catch (postError) {
-      console.error('[AuthCallback] Failed to notify desktop window:', postError);
+      console.error(
+        "[AuthCallback] Failed to notify desktop window:",
+        postError,
+      );
     }
 
     // Give the message a moment to flush before attempting to close
diff --git a/frontend/src/desktop/extensions/authSessionCleanup.ts b/frontend/src/desktop/extensions/authSessionCleanup.ts
index 916fceec01..2856fdd1b2 100644
--- a/frontend/src/desktop/extensions/authSessionCleanup.ts
+++ b/frontend/src/desktop/extensions/authSessionCleanup.ts
@@ -1,4 +1,4 @@
-import { authService } from '@app/services/authService';
+import { authService } from "@app/services/authService";
 
 /**
  * Desktop-specific auth cleanup hooks.
@@ -7,7 +7,10 @@ export async function clearPlatformAuthAfterSignOut(): Promise<void> {
   try {
     await authService.localClearAuth();
   } catch (err) {
-    console.warn('[AuthCleanup] Failed to clear desktop auth data after sign out', err);
+    console.warn(
+      "[AuthCleanup] Failed to clear desktop auth data after sign out",
+      err,
+    );
   }
 }
 
@@ -15,16 +18,33 @@ export async function clearPlatformAuthOnLoginInit(): Promise<void> {
   try {
     // Only clear if there's NO token in storage
     // If token exists, user just logged in and we should keep it
-    const token = typeof window !== 'undefined' ? localStorage.getItem('stirling_jwt') : null;
-    console.log('[AuthCleanup] Login init check - token exists:', !!token, 'length:', token?.length || 0);
+    const token =
+      typeof window !== "undefined"
+        ? localStorage.getItem("stirling_jwt")
+        : null;
+    console.log(
+      "[AuthCleanup] Login init check - token exists:",
+      !!token,
+      "length:",
+      token?.length || 0,
+    );
 
     if (!token) {
-      console.log('[AuthCleanup] No token found on login init, clearing stale auth data');
+      console.log(
+        "[AuthCleanup] No token found on login init, clearing stale auth data",
+      );
       await authService.localClearAuth();
     } else {
-      console.log('[AuthCleanup] Token present on login init (length:', token.length, '), skipping cleanup (fresh login)');
+      console.log(
+        "[AuthCleanup] Token present on login init (length:",
+        token.length,
+        "), skipping cleanup (fresh login)",
+      );
     }
   } catch (err) {
-    console.warn('[AuthCleanup] Failed to clear desktop auth data on login init', err);
+    console.warn(
+      "[AuthCleanup] Failed to clear desktop auth data on login init",
+      err,
+    );
   }
 }
diff --git a/frontend/src/desktop/extensions/cookieConsentConfig.ts b/frontend/src/desktop/extensions/cookieConsentConfig.ts
index 8a40d7f66f..68d92a4e81 100644
--- a/frontend/src/desktop/extensions/cookieConsentConfig.ts
+++ b/frontend/src/desktop/extensions/cookieConsentConfig.ts
@@ -2,6 +2,6 @@ export function getCookieConsentOverrides(): Record<string, unknown> {
   return {
     cookie: {
       useLocalStorage: true, // Cookies don't reliably persist on desktop, but localStorage does
-    }
+    },
   };
 }
diff --git a/frontend/src/desktop/extensions/oauthNavigation.ts b/frontend/src/desktop/extensions/oauthNavigation.ts
index d6444ba034..18fd1a3e15 100644
--- a/frontend/src/desktop/extensions/oauthNavigation.ts
+++ b/frontend/src/desktop/extensions/oauthNavigation.ts
@@ -1,12 +1,16 @@
-import { authService } from '@app/services/authService';
-import { connectionModeService } from '@app/services/connectionModeService';
+import { authService } from "@app/services/authService";
+import { connectionModeService } from "@app/services/connectionModeService";
 
 /**
  * Desktop-specific OAuth navigation: prefer popup/system browser, avoid hijacking main webview.
  */
-export async function startOAuthNavigation(redirectUrl: string): Promise<boolean> {
+export async function startOAuthNavigation(
+  redirectUrl: string,
+): Promise<boolean> {
   try {
-    const currentConfig = await connectionModeService.getCurrentConfig().catch(() => null);
+    const currentConfig = await connectionModeService
+      .getCurrentConfig()
+      .catch(() => null);
     const serverUrl = currentConfig?.server_config?.url;
     if (!serverUrl) {
       return false;
@@ -17,7 +21,7 @@ export async function startOAuthNavigation(redirectUrl: string): Promise<boolean
     await authService.loginWithSelfHostedOAuth(providerPath, serverUrl);
     return true;
   } catch (error) {
-    console.warn('[Desktop OAuthNavigation] Failed to start OAuth flow', error);
+    console.warn("[Desktop OAuthNavigation] Failed to start OAuth flow", error);
     return false;
   }
 }
diff --git a/frontend/src/desktop/extensions/platformSessionBridge.ts b/frontend/src/desktop/extensions/platformSessionBridge.ts
index 2b9a5f1f76..8d89d5829f 100644
--- a/frontend/src/desktop/extensions/platformSessionBridge.ts
+++ b/frontend/src/desktop/extensions/platformSessionBridge.ts
@@ -1,7 +1,7 @@
-import { STIRLING_SAAS_URL } from '@app/constants/connection';
-import { connectionModeService } from '@app/services/connectionModeService';
-import { authService } from '@app/services/authService';
-import type { PlatformSessionUser } from '@proprietary/extensions/platformSessionBridge';
+import { STIRLING_SAAS_URL } from "@app/constants/connection";
+import { connectionModeService } from "@app/services/connectionModeService";
+import { authService } from "@app/services/authService";
+import type { PlatformSessionUser } from "@proprietary/extensions/platformSessionBridge";
 
 export async function isDesktopSaaSAuthMode(): Promise<boolean> {
   try {
@@ -9,7 +9,7 @@ export async function isDesktopSaaSAuthMode(): Promise<boolean> {
     // Return true for ANY desktop auth mode (SaaS or self-hosted with desktop authService)
     // This skips redundant backend validation in springAuthClient since desktop authService
     // already manages the token lifecycle
-    return mode === 'saas' || mode === 'selfhosted';
+    return mode === "saas" || mode === "selfhosted";
   } catch {
     return false;
   }
@@ -33,9 +33,9 @@ export async function getPlatformSessionUser(): Promise<PlatformSessionUser | nu
 export async function refreshPlatformSession(): Promise<boolean> {
   try {
     const mode = await connectionModeService.getCurrentMode();
-    if (mode === 'saas') {
+    if (mode === "saas") {
       return await authService.refreshSupabaseToken(STIRLING_SAAS_URL);
-    } else if (mode === 'selfhosted') {
+    } else if (mode === "selfhosted") {
       const serverConfig = await connectionModeService.getServerConfig();
       if (!serverConfig) {
         return false;
@@ -56,7 +56,7 @@ export async function savePlatformToken(token: string): Promise<void> {
   try {
     await authService.saveToken(token);
   } catch (error) {
-    console.error('[PlatformBridge] Failed to save token:', error);
+    console.error("[PlatformBridge] Failed to save token:", error);
     throw error;
   }
 }
diff --git a/frontend/src/desktop/hooks/useAppInitialization.ts b/frontend/src/desktop/hooks/useAppInitialization.ts
index 7796842ca1..176442cb06 100644
--- a/frontend/src/desktop/hooks/useAppInitialization.ts
+++ b/frontend/src/desktop/hooks/useAppInitialization.ts
@@ -1,8 +1,8 @@
-import { useEffect, useState } from 'react';
-import { useOpenedFile } from '@app/hooks/useOpenedFile';
-import { fileOpenService } from '@app/services/fileOpenService';
-import { useFileManagement } from '@app/contexts/file/fileHooks';
-import { createQuickKey } from '@app/types/fileContext';
+import { useEffect, useState } from "react";
+import { useOpenedFile } from "@app/hooks/useOpenedFile";
+import { fileOpenService } from "@app/services/fileOpenService";
+import { useFileManagement } from "@app/contexts/file/fileHooks";
+import { createQuickKey } from "@app/types/fileContext";
 
 /**
  * App initialization hook
@@ -15,7 +15,11 @@ export function useAppInitialization(): void {
   const { addFiles, updateStirlingFileStub } = useFileManagement();
 
   // Handle files opened with app (Tauri mode)
-  const { openedFilePaths, loading: openedFileLoading, consumeOpenedFilePaths } = useOpenedFile();
+  const {
+    openedFilePaths,
+    loading: openedFileLoading,
+    consumeOpenedFilePaths,
+  } = useOpenedFile();
 
   // Load opened files and add directly to FileContext
   useEffect(() => {
@@ -33,14 +37,19 @@ export function useAppInitialization(): void {
           await Promise.all(
             filePaths.map(async (filePath) => {
               try {
-                const fileData = await fileOpenService.readFileAsArrayBuffer(filePath);
+                const fileData =
+                  await fileOpenService.readFileAsArrayBuffer(filePath);
                 if (!fileData) return null;
 
-                const file = new File([fileData.arrayBuffer], fileData.fileName, {
-                  type: 'application/pdf'
-                });
+                const file = new File(
+                  [fileData.arrayBuffer],
+                  fileData.fileName,
+                  {
+                    type: "application/pdf",
+                  },
+                );
 
-                console.log('[Desktop] Loaded file:', fileData.fileName);
+                console.log("[Desktop] Loaded file:", fileData.fileName);
 
                 return {
                   file,
@@ -48,34 +57,53 @@ export function useAppInitialization(): void {
                   quickKey: createQuickKey(file),
                 };
               } catch (error) {
-                console.error('[Desktop] Failed to load file:', filePath, error);
+                console.error(
+                  "[Desktop] Failed to load file:",
+                  filePath,
+                  error,
+                );
                 return null;
               }
-            })
+            }),
           )
-        ).filter((entry): entry is { file: File; filePath: string; quickKey: string } => Boolean(entry));
+        ).filter(
+          (
+            entry,
+          ): entry is { file: File; filePath: string; quickKey: string } =>
+            Boolean(entry),
+        );
 
         if (loadedFiles.length > 0) {
-          const filesArray = loadedFiles.map(entry => entry.file);
-          const quickKeyToPath = new Map(loadedFiles.map(entry => [entry.quickKey, entry.filePath]));
+          const filesArray = loadedFiles.map((entry) => entry.file);
+          const quickKeyToPath = new Map(
+            loadedFiles.map((entry) => [entry.quickKey, entry.filePath]),
+          );
 
-          const addedFiles = await addFiles(filesArray);
-          addedFiles.forEach(file => {
+          const addedFiles = await addFiles(filesArray, { selectFiles: true });
+          addedFiles.forEach((file) => {
             const localFilePath = quickKeyToPath.get(file.quickKey);
             if (localFilePath) {
               updateStirlingFileStub(file.fileId, { localFilePath });
             }
           });
 
-          console.log(`[Desktop] ${loadedFiles.length} opened file(s) added to FileContext`);
+          console.log(
+            `[Desktop] ${loadedFiles.length} opened file(s) added to FileContext`,
+          );
         }
       } catch (error) {
-        console.error('[Desktop] Failed to load opened files:', error);
+        console.error("[Desktop] Failed to load opened files:", error);
       }
     };
 
     loadOpenedFiles();
-  }, [openedFilePaths, openedFileLoading, addFiles, updateStirlingFileStub, consumeOpenedFilePaths]);
+  }, [
+    openedFilePaths,
+    openedFileLoading,
+    addFiles,
+    updateStirlingFileStub,
+    consumeOpenedFilePaths,
+  ]);
 }
 
 export function useSetupCompletion(): (completed: boolean) => void {
diff --git a/frontend/src/desktop/hooks/useBackendHealth.ts b/frontend/src/desktop/hooks/useBackendHealth.ts
index f8269be355..ae77eca3d0 100644
--- a/frontend/src/desktop/hooks/useBackendHealth.ts
+++ b/frontend/src/desktop/hooks/useBackendHealth.ts
@@ -1,9 +1,9 @@
-import { useEffect, useState, useCallback } from 'react';
-import { backendHealthMonitor } from '@app/services/backendHealthMonitor';
-import { selfHostedServerMonitor } from '@app/services/selfHostedServerMonitor';
-import { tauriBackendService } from '@app/services/tauriBackendService';
-import { connectionModeService } from '@app/services/connectionModeService';
-import type { BackendHealthState } from '@app/types/backendHealth';
+import { useEffect, useState, useCallback } from "react";
+import { backendHealthMonitor } from "@app/services/backendHealthMonitor";
+import { selfHostedServerMonitor } from "@app/services/selfHostedServerMonitor";
+import { tauriBackendService } from "@app/services/tauriBackendService";
+import { connectionModeService } from "@app/services/connectionModeService";
+import type { BackendHealthState } from "@app/types/backendHealth";
 
 /**
  * Hook to read backend health state for UI (Run button, BackendHealthIndicator).
@@ -19,18 +19,22 @@ import type { BackendHealthState } from '@app/types/backendHealth';
  * - Self-hosted mode (server offline, local port unknown): false
  */
 export function useBackendHealth() {
-  const [health, setHealth] = useState<BackendHealthState>(() => backendHealthMonitor.getSnapshot());
-  const [serverStatus, setServerStatus] = useState(
-    () => selfHostedServerMonitor.getSnapshot().status
+  const [health, setHealth] = useState<BackendHealthState>(() =>
+    backendHealthMonitor.getSnapshot(),
   );
-  const [localUrl, setLocalUrl] = useState<string | null>(
-    () => tauriBackendService.getBackendUrl()
+  const [serverStatus, setServerStatus] = useState(
+    () => selfHostedServerMonitor.getSnapshot().status,
+  );
+  const [localUrl, setLocalUrl] = useState<string | null>(() =>
+    tauriBackendService.getBackendUrl(),
   );
   const [connectionMode, setConnectionMode] = useState<string | null>(null);
 
   useEffect(() => {
     void connectionModeService.getCurrentMode().then(setConnectionMode);
-    return connectionModeService.subscribeToModeChanges(config => setConnectionMode(config.mode));
+    return connectionModeService.subscribeToModeChanges((config) =>
+      setConnectionMode(config.mode),
+    );
   }, []);
 
   useEffect(() => {
@@ -38,7 +42,9 @@ export function useBackendHealth() {
   }, []);
 
   useEffect(() => {
-    return selfHostedServerMonitor.subscribe(state => setServerStatus(state.status));
+    return selfHostedServerMonitor.subscribe((state) =>
+      setServerStatus(state.status),
+    );
   }, []);
 
   useEffect(() => {
@@ -52,8 +58,8 @@ export function useBackendHealth() {
   }, []);
 
   const isOnline =
-    connectionMode === 'selfhosted'
-      ? serverStatus !== 'offline' || !!localUrl
+    connectionMode === "selfhosted"
+      ? serverStatus !== "offline" || !!localUrl
       : health.isOnline;
 
   return {
diff --git a/frontend/src/desktop/hooks/useBackendInitializer.ts b/frontend/src/desktop/hooks/useBackendInitializer.ts
index 8be4e3c89d..8296dfff57 100644
--- a/frontend/src/desktop/hooks/useBackendInitializer.ts
+++ b/frontend/src/desktop/hooks/useBackendInitializer.ts
@@ -1,7 +1,7 @@
-import { useEffect } from 'react';
-import { useBackendHealth } from '@app/hooks/useBackendHealth';
-import { useEndpointConfig } from '@app/hooks/useEndpointConfig';
-import { tauriBackendService } from '@app/services/tauriBackendService';
+import { useEffect } from "react";
+import { useBackendHealth } from "@app/hooks/useBackendHealth";
+import { useEndpointConfig } from "@app/hooks/useEndpointConfig";
+import { tauriBackendService } from "@app/services/tauriBackendService";
 
 /**
  * Hook to initialize backend and monitor health
@@ -32,12 +32,12 @@ export function useBackendInitializer(enabled = true) {
           void checkHealth();
         }, 500);
       } catch (error) {
-        console.error('[BackendInitializer] Failed to start backend:', error);
+        console.error("[BackendInitializer] Failed to start backend:", error);
       }
     };
 
     // Only start backend if it's not already starting/healthy
-    if (status !== 'healthy' && status !== 'starting') {
+    if (status !== "healthy" && status !== "starting") {
       void initializeBackend();
     }
   }, [enabled, status, backendUrl, checkHealth]);
diff --git a/frontend/src/desktop/hooks/useConversionCloudStatus.ts b/frontend/src/desktop/hooks/useConversionCloudStatus.ts
index 182afa4a14..3a83a61f4d 100644
--- a/frontend/src/desktop/hooks/useConversionCloudStatus.ts
+++ b/frontend/src/desktop/hooks/useConversionCloudStatus.ts
@@ -1,18 +1,18 @@
-import { useState, useEffect } from 'react';
-import { connectionModeService } from '@app/services/connectionModeService';
-import { endpointAvailabilityService } from '@app/services/endpointAvailabilityService';
-import { tauriBackendService } from '@app/services/tauriBackendService';
-import { selfHostedServerMonitor } from '@app/services/selfHostedServerMonitor';
-import { EXTENSION_TO_ENDPOINT } from '@app/constants/convertConstants';
-import { getEndpointName } from '@app/utils/convertUtils';
+import { useState, useEffect } from "react";
+import { connectionModeService } from "@app/services/connectionModeService";
+import { endpointAvailabilityService } from "@app/services/endpointAvailabilityService";
+import { tauriBackendService } from "@app/services/tauriBackendService";
+import { selfHostedServerMonitor } from "@app/services/selfHostedServerMonitor";
+import { EXTENSION_TO_ENDPOINT } from "@app/constants/convertConstants";
+import { getEndpointName } from "@app/utils/convertUtils";
 
 /**
  * Comprehensive conversion status data
  */
 export interface ConversionStatus {
-  availability: Record<string, boolean>;   // Available on local OR SaaS?
-  cloudStatus: Record<string, boolean>;    // Will use cloud?
-  localOnly: Record<string, boolean>;      // Available ONLY locally (not on SaaS)?
+  availability: Record<string, boolean>; // Available on local OR SaaS?
+  cloudStatus: Record<string, boolean>; // Will use cloud?
+  localOnly: Record<string, boolean>; // Available ONLY locally (not on SaaS)?
 }
 
 /**
@@ -33,13 +33,15 @@ export function useConversionCloudStatus(): ConversionStatus {
 
       // Self-hosted offline path: server is down but local backend is available.
       // Check each conversion against the local backend only (no cloud routing).
-      if (mode === 'selfhosted') {
+      if (mode === "selfhosted") {
         const { status } = selfHostedServerMonitor.getSnapshot();
         const localUrl = tauriBackendService.getBackendUrl();
-        if (status === 'offline' && localUrl) {
+        if (status === "offline" && localUrl) {
           const pairs: [string, string, string][] = [];
           for (const fromExt of Object.keys(EXTENSION_TO_ENDPOINT)) {
-            for (const toExt of Object.keys(EXTENSION_TO_ENDPOINT[fromExt] || {})) {
+            for (const toExt of Object.keys(
+              EXTENSION_TO_ENDPOINT[fromExt] || {},
+            )) {
               const endpointName = getEndpointName(fromExt, toExt);
               if (endpointName) pairs.push([fromExt, toExt, endpointName]);
             }
@@ -51,12 +53,16 @@ export function useConversionCloudStatus(): ConversionStatus {
             pairs.map(async ([fromExt, toExt, endpointName]) => {
               const key = `${fromExt}-${toExt}`;
               try {
-                const supported = await endpointAvailabilityService.isEndpointSupportedLocally(endpointName, localUrl);
+                const supported =
+                  await endpointAvailabilityService.isEndpointSupportedLocally(
+                    endpointName,
+                    localUrl,
+                  );
                 return { key, supported };
               } catch {
                 return { key, supported: false };
               }
-            })
+            }),
           );
           for (const { key, supported } of results) {
             availability[key] = supported;
@@ -77,7 +83,7 @@ export function useConversionCloudStatus(): ConversionStatus {
         return;
       }
 
-      if (mode !== 'saas') {
+      if (mode !== "saas") {
         // Non-SaaS, non-self-hosted: local endpoint checking handles everything
         setStatus({ availability: {}, cloudStatus: {}, localOnly: {} });
         return;
@@ -103,20 +109,39 @@ export function useConversionCloudStatus(): ConversionStatus {
             // In SaaS mode, everything is available (locally or via cloud routing).
             // Only check local support to determine willUseCloud — the same approach
             // used by useMultipleEndpointsEnabled's SaaS enhancement.
-            const availableLocally = await endpointAvailabilityService.isEndpointSupportedLocally(
-              endpointName,
-              tauriBackendService.getBackendUrl()
-            );
-            return { key, isAvailable: true, willUseCloud: !availableLocally, localOnly: false };
+            const availableLocally =
+              await endpointAvailabilityService.isEndpointSupportedLocally(
+                endpointName,
+                tauriBackendService.getBackendUrl(),
+              );
+            return {
+              key,
+              isAvailable: true,
+              willUseCloud: !availableLocally,
+              localOnly: false,
+            };
           } catch (error) {
-            console.error(`[useConversionCloudStatus] Endpoint check failed for ${key}:`, error);
+            console.error(
+              `[useConversionCloudStatus] Endpoint check failed for ${key}:`,
+              error,
+            );
             // On error, assume available via cloud (safe default in SaaS mode)
-            return { key, isAvailable: true, willUseCloud: true, localOnly: false };
+            return {
+              key,
+              isAvailable: true,
+              willUseCloud: true,
+              localOnly: false,
+            };
           }
-        })
+        }),
       );
 
-      for (const { key, isAvailable, willUseCloud: wuc, localOnly: lo } of results) {
+      for (const {
+        key,
+        isAvailable,
+        willUseCloud: wuc,
+        localOnly: lo,
+      } of results) {
         availability[key] = isAvailable;
         cloudStatus[key] = wuc;
         localOnly[key] = lo;
@@ -130,7 +155,7 @@ export function useConversionCloudStatus(): ConversionStatus {
 
     // Re-check when SaaS local backend becomes healthy
     const unsubLocal = tauriBackendService.subscribeToStatus((status) => {
-      if (status === 'healthy') {
+      if (status === "healthy") {
         checkConversions();
       }
     });
@@ -143,7 +168,10 @@ export function useConversionCloudStatus(): ConversionStatus {
     // Skip the first invocation since checkConversions() was already called above.
     let skipFirst = true;
     const unsubServer = selfHostedServerMonitor.subscribe(() => {
-      if (skipFirst) { skipFirst = false; return; }
+      if (skipFirst) {
+        skipFirst = false;
+        return;
+      }
       void checkConversions();
     });
 
diff --git a/frontend/src/desktop/hooks/useCreditCheck.ts b/frontend/src/desktop/hooks/useCreditCheck.ts
index 56691c8182..656b1e947c 100644
--- a/frontend/src/desktop/hooks/useCreditCheck.ts
+++ b/frontend/src/desktop/hooks/useCreditCheck.ts
@@ -1,11 +1,11 @@
-import { useCallback } from 'react';
-import { useTranslation } from 'react-i18next';
-import { useSaaSBilling } from '@app/contexts/SaasBillingContext';
-import { useSaaSMode } from '@app/hooks/useSaaSMode';
-import { getToolCreditCost } from '@app/utils/creditCosts';
-import { CREDIT_EVENTS } from '@app/constants/creditEvents';
-import { operationRouter } from '@app/services/operationRouter';
-import type { ToolId } from '@app/types/toolId';
+import { useCallback } from "react";
+import { useTranslation } from "react-i18next";
+import { useSaaSBilling } from "@app/contexts/SaasBillingContext";
+import { useSaaSMode } from "@app/hooks/useSaaSMode";
+import { getToolCreditCost } from "@app/utils/creditCosts";
+import { CREDIT_EVENTS } from "@app/constants/creditEvents";
+import { operationRouter } from "@app/services/operationRouter";
+import type { ToolId } from "@app/types/toolId";
 
 /**
  * Desktop implementation of credit checking for cloud operations.
@@ -21,43 +21,51 @@ export function useCreditCheck(operationType?: string, endpoint?: string) {
   const isSaaSMode = useSaaSMode();
   const { t } = useTranslation();
 
-  const checkCredits = useCallback(async (runtimeEndpoint?: string): Promise<string | null> => {
-    if (!isSaaSMode) return null; // Credits only apply in SaaS mode, not self-hosted
-    if (!billing) return null;
+  const checkCredits = useCallback(
+    async (runtimeEndpoint?: string): Promise<string | null> => {
+      if (!isSaaSMode) return null; // Credits only apply in SaaS mode, not self-hosted
+      if (!billing) return null;
 
-    // If the operation routes to the local backend, no credits are consumed — skip check.
-    // runtimeEndpoint (from params at execution time) takes priority over hook-level endpoint.
-    const ep = runtimeEndpoint ?? endpoint;
-    if (ep) {
-      try {
-        const willUseSaaS = await operationRouter.willRouteToSaaS(ep);
-        if (!willUseSaaS) return null;
-      } catch {
-        // If routing check fails, fall through to credit check as a safe default.
+      // If the operation routes to the local backend, no credits are consumed — skip check.
+      // runtimeEndpoint (from params at execution time) takes priority over hook-level endpoint.
+      const ep = runtimeEndpoint ?? endpoint;
+      if (ep) {
+        try {
+          const willUseSaaS = await operationRouter.willRouteToSaaS(ep);
+          if (!willUseSaaS) return null;
+        } catch {
+          // If routing check fails, fall through to credit check as a safe default.
+        }
       }
-    }
 
-    const { creditBalance, loading } = billing;
-    const requiredCredits = getToolCreditCost(operationType as ToolId);
+      const { creditBalance, loading } = billing;
+      const requiredCredits = getToolCreditCost(operationType as ToolId);
 
-    if (!loading && creditBalance < requiredCredits) {
-      window.dispatchEvent(new CustomEvent(CREDIT_EVENTS.INSUFFICIENT, {
-        detail: {
-          operationType,
-          requiredCredits,
-          currentBalance: creditBalance,
-        },
-      }));
+      if (!loading && creditBalance < requiredCredits) {
+        window.dispatchEvent(
+          new CustomEvent(CREDIT_EVENTS.INSUFFICIENT, {
+            detail: {
+              operationType,
+              requiredCredits,
+              currentBalance: creditBalance,
+            },
+          }),
+        );
 
-      return t(
-        'credits.insufficient.brief',
-        'Insufficient credits. You need {{required}} credits but have {{current}}.',
-        { required: requiredCredits, current: creditBalance },
-      );
-    }
+        return t(
+          "credits.insufficient.brief",
+          "Insufficient credits. You need {{required}} credits but have {{current}}.",
+          {
+            required: requiredCredits,
+            current: creditBalance,
+          },
+        );
+      }
 
-    return null;
-  }, [billing, isSaaSMode, operationType, endpoint, t]);
+      return null;
+    },
+    [billing, isSaaSMode, operationType, endpoint, t],
+  );
 
   return { checkCredits };
 }
diff --git a/frontend/src/desktop/hooks/useCreditEvents.ts b/frontend/src/desktop/hooks/useCreditEvents.ts
index 1e05cb61a4..626a7161ea 100644
--- a/frontend/src/desktop/hooks/useCreditEvents.ts
+++ b/frontend/src/desktop/hooks/useCreditEvents.ts
@@ -1,7 +1,7 @@
-import { useEffect, useRef } from 'react';
-import { useSaaSBilling } from '@app/contexts/SaasBillingContext';
-import { useSaaSMode } from '@app/hooks/useSaaSMode';
-import { CREDIT_EVENTS } from '@app/constants/creditEvents';
+import { useEffect, useRef } from "react";
+import { useSaaSBilling } from "@app/contexts/SaasBillingContext";
+import { useSaaSMode } from "@app/hooks/useSaaSMode";
+import { CREDIT_EVENTS } from "@app/constants/creditEvents";
 
 /**
  * Desktop hook that monitors credit balance and dispatches events
@@ -21,8 +21,11 @@ export function useCreditEvents() {
     if (isSaaSMode && creditBalance <= 0 && prevBalance > 0) {
       window.dispatchEvent(
         new CustomEvent(CREDIT_EVENTS.EXHAUSTED, {
-          detail: { previousBalance: prevBalance, currentBalance: creditBalance },
-        })
+          detail: {
+            previousBalance: prevBalance,
+            currentBalance: creditBalance,
+          },
+        }),
       );
     }
 
diff --git a/frontend/src/desktop/hooks/useDefaultApp.ts b/frontend/src/desktop/hooks/useDefaultApp.ts
index 5816e2cfdc..9f647ca888 100644
--- a/frontend/src/desktop/hooks/useDefaultApp.ts
+++ b/frontend/src/desktop/hooks/useDefaultApp.ts
@@ -1,7 +1,7 @@
-import { useState, useEffect } from 'react';
-import { useTranslation } from 'react-i18next';
-import { defaultAppService } from '@app/services/defaultAppService';
-import { alert } from '@app/components/toast';
+import { useState, useEffect } from "react";
+import { useTranslation } from "react-i18next";
+import { defaultAppService } from "@app/services/defaultAppService";
+import { alert } from "@app/components/toast";
 
 export const useDefaultApp = () => {
   const { t } = useTranslation();
@@ -17,7 +17,7 @@ export const useDefaultApp = () => {
       const status = await defaultAppService.isDefaultPdfHandler();
       setIsDefault(status);
     } catch (error) {
-      console.error('Failed to check default status:', error);
+      console.error("Failed to check default status:", error);
     }
   };
 
@@ -26,26 +26,35 @@ export const useDefaultApp = () => {
     try {
       const result = await defaultAppService.setAsDefaultPdfHandler();
 
-      if (result === 'set_successfully') {
+      if (result === "set_successfully") {
         alert({
-          alertType: 'success',
-          title: t('defaultApp.success.title', 'Default App Set'),
-          body: t('defaultApp.success.message', 'Stirling PDF is now your default PDF editor'),
+          alertType: "success",
+          title: t("defaultApp.success.title", "Default App Set"),
+          body: t(
+            "defaultApp.success.message",
+            "Stirling PDF is now your default PDF editor",
+          ),
         });
         setIsDefault(true);
-      } else if (result === 'opened_dialog') {
+      } else if (result === "opened_dialog") {
         alert({
-          alertType: 'neutral',
-          title: t('defaultApp.settingsOpened.title', 'Settings Opened'),
-          body: t('defaultApp.settingsOpened.message', 'Please select Stirling PDF in the file association dialogue'),
+          alertType: "neutral",
+          title: t("defaultApp.settingsOpened.title", "Settings Opened"),
+          body: t(
+            "defaultApp.settingsOpened.message",
+            "Please select Stirling PDF in the file association dialogue",
+          ),
         });
       }
     } catch (error) {
-      console.error('Failed to set default:', error);
+      console.error("Failed to set default:", error);
       alert({
-        alertType: 'error',
-        title: t('defaultApp.error.title', 'Error'),
-        body: t('defaultApp.error.message', 'Failed to set default PDF handler'),
+        alertType: "error",
+        title: t("defaultApp.error.title", "Error"),
+        body: t(
+          "defaultApp.error.message",
+          "Failed to set default PDF handler",
+        ),
       });
     } finally {
       setIsLoading(false);
diff --git a/frontend/src/desktop/hooks/useEnableMeteredBilling.ts b/frontend/src/desktop/hooks/useEnableMeteredBilling.ts
index 97467fca45..7df3aa48b2 100644
--- a/frontend/src/desktop/hooks/useEnableMeteredBilling.ts
+++ b/frontend/src/desktop/hooks/useEnableMeteredBilling.ts
@@ -1,6 +1,6 @@
-import { useState } from 'react';
-import { supabase } from '@app/auth/supabase';
-import { authService } from '@app/services/authService';
+import { useState } from "react";
+import { supabase } from "@app/auth/supabase";
+import { authService } from "@app/services/authService";
 
 /**
  * Shared hook for enabling metered (overage) billing via Supabase edge function.
@@ -13,7 +13,7 @@ import { authService } from '@app/services/authService';
 export function useEnableMeteredBilling(
   refreshBilling: () => Promise<void>,
   onSuccess: () => void,
-  logPrefix: string
+  logPrefix: string,
 ): {
   enablingMetering: boolean;
   meteringError: string | null;
@@ -30,20 +30,25 @@ export function useEnableMeteredBilling(
     try {
       const token = await authService.getAuthToken();
       if (!token) {
-        throw new Error('Not authenticated');
+        throw new Error("Not authenticated");
       }
 
-      const { data, error } = await supabase.functions.invoke('create-meter-subscription', {
-        method: 'POST',
-        headers: { Authorization: `Bearer ${token}` },
-      });
+      const { data, error } = await supabase.functions.invoke(
+        "create-meter-subscription",
+        {
+          method: "POST",
+          headers: { Authorization: `Bearer ${token}` },
+        },
+      );
 
       if (error) {
-        throw new Error(error.message || 'Failed to enable metered billing');
+        throw new Error(error.message || "Failed to enable metered billing");
       }
 
       if (!data?.success) {
-        throw new Error(data?.error || data?.message || 'Failed to enable metered billing');
+        throw new Error(
+          data?.error || data?.message || "Failed to enable metered billing",
+        );
       }
 
       console.debug(`[${logPrefix}] Metered billing enabled successfully`);
@@ -51,7 +56,8 @@ export function useEnableMeteredBilling(
       await refreshBilling();
       onSuccess();
     } catch (err: unknown) {
-      const message = err instanceof Error ? err.message : 'Failed to enable metered billing';
+      const message =
+        err instanceof Error ? err.message : "Failed to enable metered billing";
       console.error(`[${logPrefix}] Failed to enable metered billing:`, err);
       setMeteringError(message);
     } finally {
diff --git a/frontend/src/desktop/hooks/useEndpointConfig.ts b/frontend/src/desktop/hooks/useEndpointConfig.ts
index 1b5a49fcaa..9a80435095 100644
--- a/frontend/src/desktop/hooks/useEndpointConfig.ts
+++ b/frontend/src/desktop/hooks/useEndpointConfig.ts
@@ -1,15 +1,14 @@
-import { useState, useEffect, useCallback, useRef } from 'react';
-import { isAxiosError } from 'axios';
-import { useTranslation } from 'react-i18next';
-import apiClient from '@app/services/apiClient';
-import { tauriBackendService } from '@app/services/tauriBackendService';
-import { selfHostedServerMonitor } from '@app/services/selfHostedServerMonitor';
-import { endpointAvailabilityService } from '@app/services/endpointAvailabilityService';
-import { isBackendNotReadyError } from '@app/constants/backendErrors';
-import type { EndpointAvailabilityDetails } from '@app/types/endpointAvailability';
-import { connectionModeService } from '@app/services/connectionModeService';
-import type { AppConfig } from '@app/contexts/AppConfigContext';
-
+import { useState, useEffect, useCallback, useRef } from "react";
+import { isAxiosError } from "axios";
+import { useTranslation } from "react-i18next";
+import apiClient from "@app/services/apiClient";
+import { tauriBackendService } from "@app/services/tauriBackendService";
+import { selfHostedServerMonitor } from "@app/services/selfHostedServerMonitor";
+import { endpointAvailabilityService } from "@app/services/endpointAvailabilityService";
+import { isBackendNotReadyError } from "@app/constants/backendErrors";
+import type { EndpointAvailabilityDetails } from "@app/types/endpointAvailability";
+import { connectionModeService } from "@app/services/connectionModeService";
+import type { AppConfig } from "@app/contexts/AppConfigContext";
 
 interface EndpointConfig {
   backendUrl: string;
@@ -19,7 +18,7 @@ const RETRY_DELAY_MS = 2500;
 
 function isSelfHostedOffline(): boolean {
   return (
-    selfHostedServerMonitor.getSnapshot().status === 'offline' &&
+    selfHostedServerMonitor.getSnapshot().status === "offline" &&
     !!tauriBackendService.getBackendUrl()
   );
 }
@@ -27,25 +26,28 @@ function isSelfHostedOffline(): boolean {
 function getErrorMessage(err: unknown): string {
   if (isAxiosError(err)) {
     const data = err.response?.data as { message?: string } | undefined;
-    if (typeof data?.message === 'string') {
+    if (typeof data?.message === "string") {
       return data.message;
     }
-    return err.message || 'Unknown error occurred';
+    return err.message || "Unknown error occurred";
   }
   if (err instanceof Error) {
     return err.message;
   }
-  return 'Unknown error occurred';
+  return "Unknown error occurred";
 }
 
 async function checkDependenciesReady(): Promise<boolean> {
   try {
-    const response = await apiClient.get<AppConfig>('/api/v1/config/app-config', {
-      suppressErrorToast: true,
-    });
+    const response = await apiClient.get<AppConfig>(
+      "/api/v1/config/app-config",
+      {
+        suppressErrorToast: true,
+      },
+    );
     return response.data?.dependenciesReady ?? false;
   } catch (error) {
-    console.debug('[useEndpointConfig] Dependencies not ready yet:', error);
+    console.debug("[useEndpointConfig] Dependencies not ready yet:", error);
     return false;
   }
 }
@@ -100,9 +102,12 @@ export function useEndpointEnabled(endpoint: string): {
     try {
       setError(null);
 
-      const response = await apiClient.get<boolean>(`/api/v1/config/endpoint-enabled?endpoint=${encodeURIComponent(endpoint)}`, {
-        suppressErrorToast: true,
-      });
+      const response = await apiClient.get<boolean>(
+        `/api/v1/config/endpoint-enabled?endpoint=${encodeURIComponent(endpoint)}`,
+        {
+          suppressErrorToast: true,
+        },
+      );
 
       const locallyEnabled = response.data;
 
@@ -110,8 +115,10 @@ export function useEndpointEnabled(endpoint: string): {
         const mode = await connectionModeService.getCurrentMode();
         // DESKTOP ENHANCEMENT: In SaaS mode, assume all endpoints are available
         // Even if not supported locally, they will route to SaaS backend
-        if (mode === 'saas') {
-          console.debug(`[useEndpointEnabled] Endpoint ${endpoint} not supported locally but available via SaaS routing`);
+        if (mode === "saas") {
+          console.debug(
+            `[useEndpointEnabled] Endpoint ${endpoint} not supported locally but available via SaaS routing`,
+          );
           setEnabled(true);
           return;
         }
@@ -123,7 +130,7 @@ export function useEndpointEnabled(endpoint: string): {
       const message = getErrorMessage(err);
 
       if (isBackendStarting) {
-        setError(t('backendHealth.starting', 'Backend starting up...'));
+        setError(t("backendHealth.starting", "Backend starting up..."));
         if (!retryTimeoutRef.current) {
           retryTimeoutRef.current = setTimeout(() => {
             retryTimeoutRef.current = null;
@@ -133,8 +140,10 @@ export function useEndpointEnabled(endpoint: string): {
       } else {
         // DESKTOP ENHANCEMENT: In SaaS mode, assume available even on check failure
         const mode = await connectionModeService.getCurrentMode();
-        if (mode === 'saas') {
-          console.debug(`[useEndpointEnabled] Endpoint ${endpoint} check failed but available via SaaS routing`);
+        if (mode === "saas") {
+          console.debug(
+            `[useEndpointEnabled] Endpoint ${endpoint} check failed but available via SaaS routing`,
+          );
           setEnabled(true); // Available via SaaS
           setError(null);
           return;
@@ -174,7 +183,7 @@ export function useEndpointEnabled(endpoint: string): {
     }
 
     const unsubscribe = tauriBackendService.subscribeToStatus((status) => {
-      if (status === 'healthy') {
+      if (status === "healthy") {
         fetchEndpointStatus();
       }
     });
@@ -200,8 +209,12 @@ export function useMultipleEndpointsEnabled(endpoints: string[]): {
   refetch: () => Promise<void>;
 } {
   const { t } = useTranslation();
-  const [endpointStatus, setEndpointStatus] = useState<Record<string, boolean>>({});
-  const [endpointDetails, setEndpointDetails] = useState<Record<string, EndpointAvailabilityDetails>>({});
+  const [endpointStatus, setEndpointStatus] = useState<Record<string, boolean>>(
+    {},
+  );
+  const [endpointDetails, setEndpointDetails] = useState<
+    Record<string, EndpointAvailabilityDetails>
+  >({});
   const [loading, setLoading] = useState(true);
   const [error, setError] = useState<string | null>(null);
   const isMountedRef = useRef(true);
@@ -234,26 +247,33 @@ export function useMultipleEndpointsEnabled(endpoints: string[]): {
     // checkDependenciesReady() would fail here since it hits the offline remote server.
     const { status: serverStatus } = selfHostedServerMonitor.getSnapshot();
     const localUrl = tauriBackendService.getBackendUrl();
-    if (serverStatus === 'offline' && localUrl) {
+    if (serverStatus === "offline" && localUrl) {
       const results = await Promise.all(
         [...new Set(endpoints)].map(async (ep) => {
           try {
-            const supported = await endpointAvailabilityService.isEndpointSupportedLocally(ep, localUrl);
+            const supported =
+              await endpointAvailabilityService.isEndpointSupportedLocally(
+                ep,
+                localUrl,
+              );
             return { ep, supported };
           } catch {
             return { ep, supported: false };
           }
-        })
+        }),
       );
       if (!isMountedRef.current) return;
       const statusMap: Record<string, boolean> = {};
       const details: Record<string, EndpointAvailabilityDetails> = {};
       for (const { ep, supported } of results) {
         statusMap[ep] = supported;
-        details[ep] = { enabled: supported, reason: supported ? null : 'NOT_SUPPORTED_LOCALLY' };
+        details[ep] = {
+          enabled: supported,
+          reason: supported ? null : "NOT_SUPPORTED_LOCALLY",
+        };
       }
-      setEndpointDetails(prev => ({ ...prev, ...details }));
-      setEndpointStatus(prev => ({ ...prev, ...statusMap }));
+      setEndpointDetails((prev) => ({ ...prev, ...details }));
+      setEndpointStatus((prev) => ({ ...prev, ...statusMap }));
       setLoading(false);
       return;
     }
@@ -269,62 +289,80 @@ export function useMultipleEndpointsEnabled(endpoints: string[]): {
       // Try new API first (no params — new servers return all endpoints).
       // Fall back to the old ?endpoints= form for servers that predate the
       // "large query reduction" change and still require the parameter.
-      let response: Awaited<ReturnType<typeof apiClient.get<Record<string, EndpointAvailabilityDetails>>>>;
+      let response: Awaited<
+        ReturnType<
+          typeof apiClient.get<Record<string, EndpointAvailabilityDetails>>
+        >
+      >;
       try {
-        response = await apiClient.get<Record<string, EndpointAvailabilityDetails>>(
-          `/api/v1/config/endpoints-availability`,
-          { suppressErrorToast: true }
-        );
+        response = await apiClient.get<
+          Record<string, EndpointAvailabilityDetails>
+        >(`/api/v1/config/endpoints-availability`, {
+          suppressErrorToast: true,
+        });
       } catch (innerErr) {
         if (isAxiosError(innerErr) && innerErr.response?.status === 400) {
           // Old server — requires explicit endpoints query param
-          console.debug('[useMultipleEndpointsEnabled] Server requires endpoints param, retrying with legacy format');
-          const endpointsParam = endpoints.join(',');
-          response = await apiClient.get<Record<string, EndpointAvailabilityDetails>>(
+          console.debug(
+            "[useMultipleEndpointsEnabled] Server requires endpoints param, retrying with legacy format",
+          );
+          const endpointsParam = endpoints.join(",");
+          response = await apiClient.get<
+            Record<string, EndpointAvailabilityDetails>
+          >(
             `/api/v1/config/endpoints-availability?endpoints=${encodeURIComponent(endpointsParam)}`,
-            { suppressErrorToast: true }
+            { suppressErrorToast: true },
           );
         } else {
           throw innerErr;
         }
       }
 
-      const details = Object.entries(response.data).reduce((acc, [endpointName, detail]) => {
-        acc[endpointName] = {
-          enabled: detail?.enabled ?? false,
-          reason: detail?.reason ?? null,
-        };
-        return acc;
-      }, {} as Record<string, EndpointAvailabilityDetails>);
+      const details = Object.entries(response.data).reduce(
+        (acc, [endpointName, detail]) => {
+          acc[endpointName] = {
+            enabled: detail?.enabled ?? false,
+            reason: detail?.reason ?? null,
+          };
+          return acc;
+        },
+        {} as Record<string, EndpointAvailabilityDetails>,
+      );
 
-      const statusMap = Object.keys(details).reduce((acc, key) => {
-        acc[key] = details[key].enabled;
-        return acc;
-      }, {} as Record<string, boolean>);
+      const statusMap = Object.keys(details).reduce(
+        (acc, key) => {
+          acc[key] = details[key].enabled;
+          return acc;
+        },
+        {} as Record<string, boolean>,
+      );
 
       const mode = await connectionModeService.getCurrentMode();
 
       // DESKTOP ENHANCEMENT: In SaaS mode, mark all disabled endpoints as available
       // They will route to SaaS backend
-      if (mode === 'saas') {
-        const disabledEndpoints = Object.keys(details).filter(key => !details[key].enabled);
+      if (mode === "saas") {
+        const disabledEndpoints = Object.keys(details).filter(
+          (key) => !details[key].enabled,
+        );
 
         for (const endpoint of disabledEndpoints) {
-          console.debug(`[useMultipleEndpointsEnabled] Endpoint ${endpoint} not supported locally but available via SaaS routing`);
+          console.debug(
+            `[useMultipleEndpointsEnabled] Endpoint ${endpoint} not supported locally but available via SaaS routing`,
+          );
           statusMap[endpoint] = true; // Mark as enabled via SaaS
           details[endpoint] = { enabled: true, reason: null };
         }
       }
 
-
-      setEndpointDetails(prev => ({ ...prev, ...details }));
-      setEndpointStatus(prev => ({ ...prev, ...statusMap }));
+      setEndpointDetails((prev) => ({ ...prev, ...details }));
+      setEndpointStatus((prev) => ({ ...prev, ...statusMap }));
     } catch (err: unknown) {
       const isBackendStarting = isBackendNotReadyError(err);
       const message = getErrorMessage(err);
 
       if (isBackendStarting) {
-        setError(t('backendHealth.starting', 'Backend starting up...'));
+        setError(t("backendHealth.starting", "Backend starting up..."));
         if (!retryTimeoutRef.current) {
           retryTimeoutRef.current = setTimeout(() => {
             retryTimeoutRef.current = null;
@@ -333,25 +371,36 @@ export function useMultipleEndpointsEnabled(endpoints: string[]): {
         }
       } else {
         setError(message);
-        const fallbackStatus = endpoints.reduce((acc, endpointName) => {
-          const fallbackDetail: EndpointAvailabilityDetails = { enabled: false, reason: 'UNKNOWN' };
-          acc.status[endpointName] = false;
-          acc.details[endpointName] = fallbackDetail;
-          return acc;
-        }, { status: {} as Record<string, boolean>, details: {} as Record<string, EndpointAvailabilityDetails> });
+        const fallbackStatus = endpoints.reduce(
+          (acc, endpointName) => {
+            const fallbackDetail: EndpointAvailabilityDetails = {
+              enabled: false,
+              reason: "UNKNOWN",
+            };
+            acc.status[endpointName] = false;
+            acc.details[endpointName] = fallbackDetail;
+            return acc;
+          },
+          {
+            status: {} as Record<string, boolean>,
+            details: {} as Record<string, EndpointAvailabilityDetails>,
+          },
+        );
 
         // DESKTOP ENHANCEMENT: In SaaS mode, mark all endpoints as available
         const mode = await connectionModeService.getCurrentMode();
-        if (mode === 'saas') {
+        if (mode === "saas") {
           for (const endpoint of endpoints) {
-            console.debug(`[useMultipleEndpointsEnabled] Endpoint ${endpoint} check failed but available via SaaS routing`);
+            console.debug(
+              `[useMultipleEndpointsEnabled] Endpoint ${endpoint} check failed but available via SaaS routing`,
+            );
             fallbackStatus.status[endpoint] = true;
             fallbackStatus.details[endpoint] = { enabled: true, reason: null };
           }
         }
 
         setEndpointStatus(fallbackStatus.status);
-        setEndpointDetails(prev => ({ ...prev, ...fallbackStatus.details }));
+        setEndpointDetails((prev) => ({ ...prev, ...fallbackStatus.details }));
       }
     } finally {
       setLoading(false);
@@ -381,7 +430,7 @@ export function useMultipleEndpointsEnabled(endpoints: string[]): {
     }
 
     const unsubscribe = tauriBackendService.subscribeToStatus((status) => {
-      if (status === 'healthy') {
+      if (status === "healthy") {
         fetchAllEndpointStatuses();
       }
     });
@@ -402,8 +451,7 @@ export function useMultipleEndpointsEnabled(endpoints: string[]): {
 
 // Default backend URL from environment variables
 const DEFAULT_BACKEND_URL =
-  import.meta.env.VITE_DESKTOP_BACKEND_URL
-  || import.meta.env.VITE_API_BASE_URL;
+  import.meta.env.VITE_DESKTOP_BACKEND_URL || import.meta.env.VITE_API_BASE_URL;
 
 /**
  * Desktop override exposing the backend URL based on connection mode.
@@ -414,9 +462,10 @@ export function useEndpointConfig(): EndpointConfig {
   const [backendUrl, setBackendUrl] = useState<string>(DEFAULT_BACKEND_URL);
 
   useEffect(() => {
-    connectionModeService.getCurrentConfig()
+    connectionModeService
+      .getCurrentConfig()
       .then((config) => {
-        if (config.mode === 'selfhosted' && config.server_config?.url) {
+        if (config.mode === "selfhosted" && config.server_config?.url) {
           setBackendUrl(config.server_config.url);
         } else {
           // SaaS mode - use default from env vars (local backend)
@@ -424,7 +473,7 @@ export function useEndpointConfig(): EndpointConfig {
         }
       })
       .catch((err) => {
-        console.error('Failed to get connection config:', err);
+        console.error("Failed to get connection config:", err);
         // Keep current URL on error
       });
   }, []);
diff --git a/frontend/src/desktop/hooks/useExitWarning.ts b/frontend/src/desktop/hooks/useExitWarning.ts
index 4e45a91cc2..454c3b3032 100644
--- a/frontend/src/desktop/hooks/useExitWarning.ts
+++ b/frontend/src/desktop/hooks/useExitWarning.ts
@@ -1,10 +1,10 @@
-import { useEffect, useRef } from 'react';
-import { getCurrentWindow } from '@tauri-apps/api/window';
-import { message } from '@tauri-apps/plugin-dialog';
-import { useFileState, useFileActions } from '@app/contexts/FileContext';
-import { downloadFile } from '@app/services/downloadService';
-import type { StirlingFileStub } from '@app/types/fileContext';
-import { useTranslation } from 'react-i18next';
+import { useEffect, useRef } from "react";
+import { getCurrentWindow } from "@tauri-apps/api/window";
+import { message } from "@tauri-apps/plugin-dialog";
+import { useFileState, useFileActions } from "@app/contexts/FileContext";
+import { downloadFile } from "@app/services/downloadService";
+import type { StirlingFileStub } from "@app/types/fileContext";
+import { useTranslation } from "react-i18next";
 
 export function useExitWarning() {
   const { t } = useTranslation();
@@ -18,7 +18,9 @@ export function useExitWarning() {
   useEffect(() => {
     const appWindow = getCurrentWindow();
 
-    const handleCloseRequested = async (event: { preventDefault: () => void }) => {
+    const handleCloseRequested = async (event: {
+      preventDefault: () => void;
+    }) => {
       event.preventDefault();
 
       if (isClosingRef.current) {
@@ -26,29 +28,36 @@ export function useExitWarning() {
       }
 
       const allStubs = selectorsRef.current.getStirlingFileStubs();
-      const dirtyStubs = allStubs.filter(stub => stub.isDirty);
+      const dirtyStubs = allStubs.filter((stub) => stub.isDirty);
 
       if (dirtyStubs.length > 0) {
-        const fileList = dirtyStubs.map(f => `• ${f.name}`).join('\n');
-        const saveLabel = t('confirmCloseSave', 'Save and close');
-        const discardLabel = t('confirmCloseDiscard', 'Discard changes and close');
-        const cancelLabel = t('confirmCloseCancel', 'Cancel');
+        const fileList = dirtyStubs.map((f) => `• ${f.name}`).join("\n");
+        const saveLabel = t("confirmCloseSave", "Save and close");
+        const discardLabel = t(
+          "confirmCloseDiscard",
+          "Discard changes and close",
+        );
+        const cancelLabel = t("confirmCloseCancel", "Cancel");
 
         const choice = await message(
           t(
-            'confirmCloseUnsavedList',
-            'You have {{count}} file{{plural}} with unsaved changes.\n\n{{fileList}}',
-            { count: dirtyStubs.length, plural: dirtyStubs.length > 1 ? 's' : '', fileList }
+            "confirmCloseUnsavedList",
+            "You have {{count}} file{{plural}} with unsaved changes.\n\n{{fileList}}",
+            {
+              count: dirtyStubs.length,
+              plural: dirtyStubs.length > 1 ? "s" : "",
+              fileList,
+            },
           ),
           {
-            title: t('confirmCloseUnsaved', 'This file has unsaved changes.'),
-            kind: 'warning',
+            title: t("confirmCloseUnsaved", "This file has unsaved changes."),
+            kind: "warning",
             buttons: {
               yes: saveLabel,
               no: discardLabel,
               cancel: cancelLabel,
             },
-          }
+          },
         );
 
         if (choice === cancelLabel) {
@@ -63,11 +72,17 @@ export function useExitWarning() {
           if (failedCount > 0) {
             await message(
               t(
-                'confirmCloseSaveFailed',
-                'Saved with errors. {{count}} file{{plural}} could not be saved.',
-                { count: failedCount, plural: failedCount > 1 ? 's' : '' }
+                "confirmCloseSaveFailed",
+                "Saved with errors. {{count}} file{{plural}} could not be saved.",
+                {
+                  count: failedCount,
+                  plural: failedCount > 1 ? "s" : "",
+                },
               ),
-              { title: t('confirmCloseSaveFailedTitle', 'Save Failed'), kind: 'error' }
+              {
+                title: t("confirmCloseSaveFailedTitle", "Save Failed"),
+                kind: "error",
+              },
             );
             return;
           }
@@ -80,21 +95,23 @@ export function useExitWarning() {
       try {
         await appWindow.destroy();
       } catch (error) {
-        console.error('[exit-warning] destroy failed', error);
+        console.error("[exit-warning] destroy failed", error);
         isClosingRef.current = false;
       }
     };
 
     const unlisten = appWindow.onCloseRequested(handleCloseRequested);
     return () => {
-      unlisten.then(fn => {
+      unlisten.then((fn) => {
         fn();
       });
     };
   }, [fileActions, t]);
 
   const saveDirtyFiles = async (dirtyStubs: StirlingFileStub[]) => {
-    const filesById = new Map(selectorsRef.current.getFiles().map(file => [file.fileId, file]));
+    const filesById = new Map(
+      selectorsRef.current.getFiles().map((file) => [file.fileId, file]),
+    );
     let failedCount = 0;
     let cancelled = false;
 
@@ -122,7 +139,7 @@ export function useExitWarning() {
         if (result.savedPath) {
           fileActions.updateStirlingFileStub(stub.id, {
             localFilePath: stub.localFilePath ?? result.savedPath,
-            isDirty: false
+            isDirty: false,
           });
         }
       } catch {
diff --git a/frontend/src/desktop/hooks/useFileActionIcons.ts b/frontend/src/desktop/hooks/useFileActionIcons.ts
index 5d2cb9951b..35bd74cb71 100644
--- a/frontend/src/desktop/hooks/useFileActionIcons.ts
+++ b/frontend/src/desktop/hooks/useFileActionIcons.ts
@@ -1,5 +1,5 @@
-import FolderOpenOutlinedIcon from '@mui/icons-material/FolderOpenOutlined';
-import SaveOutlinedIcon from '@mui/icons-material/SaveOutlined';
+import FolderOpenOutlinedIcon from "@mui/icons-material/FolderOpenOutlined";
+import SaveOutlinedIcon from "@mui/icons-material/SaveOutlined";
 
 /**
  * File action icons for desktop builds.
@@ -10,10 +10,10 @@ export function useFileActionIcons() {
   return {
     upload: FolderOpenOutlinedIcon,
     download: SaveOutlinedIcon,
-    uploadIconName: 'folder-rounded' as const,
-    downloadIconName: 'save-rounded' as const,
+    uploadIconName: "folder-rounded" as const,
+    downloadIconName: "save-rounded" as const,
     // Returning this icon name causes RightRail to render the Save As button.
     // On desktop, downloadFile() without a localPath shows a native save dialog.
-    saveAsIconName: 'save-as-rounded' as string | undefined,
+    saveAsIconName: "save-as-rounded" as string | undefined,
   };
 }
diff --git a/frontend/src/desktop/hooks/useFileActionTerminology.ts b/frontend/src/desktop/hooks/useFileActionTerminology.ts
index 2176cedae9..05439c8c2d 100644
--- a/frontend/src/desktop/hooks/useFileActionTerminology.ts
+++ b/frontend/src/desktop/hooks/useFileActionTerminology.ts
@@ -1,4 +1,4 @@
-import { useTranslation } from 'react-i18next';
+import { useTranslation } from "react-i18next";
 
 /**
  * File action terminology for desktop builds
@@ -8,15 +8,23 @@ export function useFileActionTerminology() {
   const { t } = useTranslation();
 
   return {
-    uploadFiles: t('fileUpload.openFiles', 'Open Files'),
-    uploadFile: t('fileUpload.openFile', 'Open File'),
-    upload: t('fileUpload.open', 'Open'),
-    dropFilesHere: t('fileUpload.dropFilesHereOpen', 'Drop files here or click the open button'),
-    uploadFromComputer: t('landing.openFromComputer', 'Open from computer'),
-    download: t('save', 'Save'),
-    downloadAll: t('rightRail.saveAll', 'Save All'),
-    downloadSelected: t('fileManager.saveSelected', 'Save Selected'),
-    downloadUnavailable: t('saveUnavailable', 'Save unavailable for this item'),
-    noFilesInStorage: t('fileUpload.noFilesInStorageOpen', 'No files available in storage. Open some files first.'),
+    uploadFiles: t("fileUpload.openFiles", "Open Files"),
+    uploadFile: t("fileUpload.openFile", "Open File"),
+    upload: t("fileUpload.open", "Open"),
+    dropFilesHere: t(
+      "fileUpload.dropFilesHereOpen",
+      "Drop files here or click the open button",
+    ),
+    addFiles: t("fileUpload.openFiles", "Open Files"),
+    mobileUpload: t("landing.mobileUpload", "Upload from Mobile"),
+    uploadFromComputer: t("landing.openFromComputer", "Open from computer"),
+    download: t("save", "Save"),
+    downloadAll: t("rightRail.saveAll", "Save All"),
+    downloadSelected: t("fileManager.saveSelected", "Save Selected"),
+    downloadUnavailable: t("saveUnavailable", "Save unavailable for this item"),
+    noFilesInStorage: t(
+      "fileUpload.noFilesInStorageOpen",
+      "No files available in storage. Open some files first.",
+    ),
   };
 }
diff --git a/frontend/src/desktop/hooks/useFirstLaunchCheck.ts b/frontend/src/desktop/hooks/useFirstLaunchCheck.ts
index 641fe5bfc6..d70376b764 100644
--- a/frontend/src/desktop/hooks/useFirstLaunchCheck.ts
+++ b/frontend/src/desktop/hooks/useFirstLaunchCheck.ts
@@ -1,13 +1,16 @@
-import { useEffect, useRef, useState } from 'react';
-import { connectionModeService } from '@app/services/connectionModeService';
-import { authService } from '@app/services/authService';
+import { useEffect, useRef, useState } from "react";
+import { connectionModeService } from "@app/services/connectionModeService";
+import { authService } from "@app/services/authService";
 
 /**
  * First launch check hook
  * Checks if this is the first time the app is being launched
  * Does not require FileContext - can be used early in the provider hierarchy
  */
-export function useFirstLaunchCheck(): { isFirstLaunch: boolean; setupComplete: boolean } {
+export function useFirstLaunchCheck(): {
+  isFirstLaunch: boolean;
+  setupComplete: boolean;
+} {
   const [isFirstLaunch, setIsFirstLaunch] = useState(false);
   const [setupComplete, setSetupComplete] = useState(false);
   const setupCheckCompleteRef = useRef(false);
@@ -27,7 +30,7 @@ export function useFirstLaunchCheck(): { isFirstLaunch: boolean; setupComplete:
 
         setupCheckCompleteRef.current = true;
       } catch (error) {
-        console.error('Failed to check first launch:', error);
+        console.error("Failed to check first launch:", error);
         // On error, assume not first launch and proceed
         setIsFirstLaunch(false);
         setSetupComplete(true);
diff --git a/frontend/src/desktop/hooks/useFrontendVersionInfo.ts b/frontend/src/desktop/hooks/useFrontendVersionInfo.ts
index 1bc0b60440..d8bd40bbc2 100644
--- a/frontend/src/desktop/hooks/useFrontendVersionInfo.ts
+++ b/frontend/src/desktop/hooks/useFrontendVersionInfo.ts
@@ -2,7 +2,9 @@ import { useState, useEffect } from "react";
 import { getVersion } from "@tauri-apps/api/app";
 import type { FrontendVersionInfo } from "@core/hooks/useFrontendVersionInfo";
 
-export function useFrontendVersionInfo(backendVersion: string | undefined): FrontendVersionInfo {
+export function useFrontendVersionInfo(
+  backendVersion: string | undefined,
+): FrontendVersionInfo {
   const [appVersion, setAppVersion] = useState<string | null>(null);
   const [mismatchVersion, setMismatchVersion] = useState(false);
 
@@ -15,7 +17,10 @@ export function useFrontendVersionInfo(backendVersion: string | undefined): Fron
           setAppVersion(version);
         }
       } catch (error) {
-        console.error("[useFrontendVersionInfo] Failed to fetch frontend version:", error);
+        console.error(
+          "[useFrontendVersionInfo] Failed to fetch frontend version:",
+          error,
+        );
       }
     };
     fetchVersion();
@@ -30,10 +35,13 @@ export function useFrontendVersionInfo(backendVersion: string | undefined): Fron
       return;
     }
     if (appVersion !== backendVersion) {
-      console.warn("[useFrontendVersionInfo] Mismatch between frontend version and AppConfig version:", {
-        backendVersion,
-        frontendVersion: appVersion,
-      });
+      console.warn(
+        "[useFrontendVersionInfo] Mismatch between frontend version and AppConfig version:",
+        {
+          backendVersion,
+          frontendVersion: appVersion,
+        },
+      );
       setMismatchVersion(true);
     } else {
       setMismatchVersion(false);
diff --git a/frontend/src/desktop/hooks/useGroupEnabled.ts b/frontend/src/desktop/hooks/useGroupEnabled.ts
index 91f9ccc951..ec6b2523ae 100644
--- a/frontend/src/desktop/hooks/useGroupEnabled.ts
+++ b/frontend/src/desktop/hooks/useGroupEnabled.ts
@@ -1,10 +1,11 @@
-import { useState, useEffect } from 'react';
-import { useTranslation } from 'react-i18next';
-import apiClient from '@app/services/apiClient';
-import { selfHostedServerMonitor } from '@app/services/selfHostedServerMonitor';
-import type { GroupEnabledResult } from '@app/types/groupEnabled';
+import { useState, useEffect } from "react";
+import { useTranslation } from "react-i18next";
+import apiClient from "@app/services/apiClient";
+import { selfHostedServerMonitor } from "@app/services/selfHostedServerMonitor";
+import type { GroupEnabledResult } from "@app/types/groupEnabled";
 
-const OFFLINE_REASON_FALLBACK = 'Requires your Stirling-PDF server (currently offline)';
+const OFFLINE_REASON_FALLBACK =
+  "Requires your Stirling-PDF server (currently offline)";
 
 /**
  * Desktop override: skips the network request entirely when the self-hosted
@@ -18,7 +19,7 @@ export function useGroupEnabled(group: string): GroupEnabledResult {
   // the very first render when offline (t() is not available in useState initialiser).
   const [result, setResult] = useState<GroupEnabledResult>(() => {
     const { status } = selfHostedServerMonitor.getSnapshot();
-    if (status === 'offline') {
+    if (status === "offline") {
       return { enabled: false, unavailableReason: OFFLINE_REASON_FALLBACK };
     }
     return { enabled: null, unavailableReason: null };
@@ -26,17 +27,22 @@ export function useGroupEnabled(group: string): GroupEnabledResult {
 
   useEffect(() => {
     const { status } = selfHostedServerMonitor.getSnapshot();
-    if (status === 'offline') {
+    if (status === "offline") {
       setResult({
         enabled: false,
-        unavailableReason: t('toolPanel.fullscreen.selfHostedOffline', OFFLINE_REASON_FALLBACK),
+        unavailableReason: t(
+          "toolPanel.fullscreen.selfHostedOffline",
+          OFFLINE_REASON_FALLBACK,
+        ),
       });
       return;
     }
 
     apiClient
-      .get<boolean>(`/api/v1/config/group-enabled?group=${encodeURIComponent(group)}`)
-      .then(res => setResult({ enabled: res.data, unavailableReason: null }))
+      .get<boolean>(
+        `/api/v1/config/group-enabled?group=${encodeURIComponent(group)}`,
+      )
+      .then((res) => setResult({ enabled: res.data, unavailableReason: null }))
       .catch(() => setResult({ enabled: false, unavailableReason: null }));
   }, [group, t]);
 
diff --git a/frontend/src/desktop/hooks/useGroupSigningEnabled.ts b/frontend/src/desktop/hooks/useGroupSigningEnabled.ts
index 6a6da3ac05..1f1a78244b 100644
--- a/frontend/src/desktop/hooks/useGroupSigningEnabled.ts
+++ b/frontend/src/desktop/hooks/useGroupSigningEnabled.ts
@@ -1,5 +1,5 @@
-import { useAppConfig } from '@app/contexts/AppConfigContext';
-import { useSelfHostedAuth } from '@app/hooks/useSelfHostedAuth';
+import { useAppConfig } from "@app/contexts/AppConfigContext";
+import { useSelfHostedAuth } from "@app/hooks/useSelfHostedAuth";
 
 /**
  * Desktop override: shared (group) signing requires self-hosted mode AND
@@ -8,5 +8,9 @@ import { useSelfHostedAuth } from '@app/hooks/useSelfHostedAuth';
 export function useGroupSigningEnabled(): boolean {
   const { config } = useAppConfig();
   const { isSelfHosted, isAuthenticated } = useSelfHostedAuth();
-  return isSelfHosted && isAuthenticated && config?.storageGroupSigningEnabled === true;
+  return (
+    isSelfHosted &&
+    isAuthenticated &&
+    config?.storageGroupSigningEnabled === true
+  );
 }
diff --git a/frontend/src/desktop/hooks/useOpenedFile.ts b/frontend/src/desktop/hooks/useOpenedFile.ts
index 38ae77cdb8..0ce1153847 100644
--- a/frontend/src/desktop/hooks/useOpenedFile.ts
+++ b/frontend/src/desktop/hooks/useOpenedFile.ts
@@ -1,6 +1,6 @@
-import { useState, useEffect, useRef, useCallback } from 'react';
-import { fileOpenService } from '@app/services/fileOpenService';
-import { listen } from '@tauri-apps/api/event';
+import { useState, useEffect, useRef, useCallback } from "react";
+import { fileOpenService } from "@app/services/fileOpenService";
+import { listen } from "@tauri-apps/api/event";
 
 export function useOpenedFile() {
   const [openedFilePaths, setOpenedFilePaths] = useState<string[]>([]);
@@ -22,18 +22,21 @@ export function useOpenedFile() {
   useEffect(() => {
     // Function to read and process files from storage
     const readFilesFromStorage = async () => {
-      console.log('� Reading files from storage...');
+      console.log("� Reading files from storage...");
       try {
         const filePaths = await fileOpenService.getOpenedFiles();
-        console.log('� fileOpenService.getOpenedFiles() returned:', filePaths);
+        console.log("� fileOpenService.getOpenedFiles() returned:", filePaths);
 
         if (filePaths.length > 0) {
-          console.log(`✅ Found ${filePaths.length} file(s) in storage:`, filePaths);
+          console.log(
+            `✅ Found ${filePaths.length} file(s) in storage:`,
+            filePaths,
+          );
           openedFilePathsRef.current = filePaths;
           setOpenedFilePaths(filePaths);
         }
       } catch (error) {
-        console.error('� Failed to read files from storage:', error);
+        console.error("� Failed to read files from storage:", error);
       } finally {
         setLoading(false);
       }
@@ -44,10 +47,10 @@ export function useOpenedFile() {
 
     // Listen for files-changed events (when new files are added to storage)
     let unlisten: (() => void) | undefined;
-    listen('files-changed', async () => {
-      console.log('📂 files-changed event received, re-reading storage...');
+    listen("files-changed", async () => {
+      console.log("📂 files-changed event received, re-reading storage...");
       await readFilesFromStorage();
-    }).then(unlistenFn => {
+    }).then((unlistenFn) => {
       unlisten = unlistenFn;
     });
 
@@ -57,5 +60,10 @@ export function useOpenedFile() {
     };
   }, []);
 
-  return { openedFilePaths, loading, clearOpenedFilePaths, consumeOpenedFilePaths };
+  return {
+    openedFilePaths,
+    loading,
+    clearOpenedFilePaths,
+    consumeOpenedFilePaths,
+  };
 }
diff --git a/frontend/src/desktop/hooks/useSaaSMode.ts b/frontend/src/desktop/hooks/useSaaSMode.ts
index 9b7833fdd4..4b945b11f9 100644
--- a/frontend/src/desktop/hooks/useSaaSMode.ts
+++ b/frontend/src/desktop/hooks/useSaaSMode.ts
@@ -1,5 +1,5 @@
-import { useState, useEffect } from 'react';
-import { connectionModeService } from '@app/services/connectionModeService';
+import { useState, useEffect } from "react";
+import { connectionModeService } from "@app/services/connectionModeService";
 
 /**
  * Returns whether the app is currently in SaaS connection mode.
@@ -10,8 +10,12 @@ export function useSaaSMode(): boolean {
   const [isSaaSMode, setIsSaaSMode] = useState(true);
 
   useEffect(() => {
-    void connectionModeService.getCurrentMode().then(mode => setIsSaaSMode(mode === 'saas'));
-    return connectionModeService.subscribeToModeChanges(cfg => setIsSaaSMode(cfg.mode === 'saas'));
+    void connectionModeService
+      .getCurrentMode()
+      .then((mode) => setIsSaaSMode(mode === "saas"));
+    return connectionModeService.subscribeToModeChanges((cfg) =>
+      setIsSaaSMode(cfg.mode === "saas"),
+    );
   }, []);
 
   return isSaaSMode;
diff --git a/frontend/src/desktop/hooks/useSaaSPlans.ts b/frontend/src/desktop/hooks/useSaaSPlans.ts
index 718b7d072d..e3ea8163fb 100644
--- a/frontend/src/desktop/hooks/useSaaSPlans.ts
+++ b/frontend/src/desktop/hooks/useSaaSPlans.ts
@@ -1,8 +1,15 @@
-import { useMemo } from 'react';
-import { useTranslation } from 'react-i18next';
-import { useSaaSBilling, usePlanPricing } from '@app/contexts/SaasBillingContext';
-import { FREE_PLAN_FEATURES, TEAM_PLAN_FEATURES, ENTERPRISE_PLAN_FEATURES } from '@app/config/planFeatures';
-import type { TierLevel } from '@app/types/billing';
+import { useMemo } from "react";
+import { useTranslation } from "react-i18next";
+import {
+  useSaaSBilling,
+  usePlanPricing,
+} from "@app/contexts/SaasBillingContext";
+import {
+  FREE_PLAN_FEATURES,
+  TEAM_PLAN_FEATURES,
+  ENTERPRISE_PLAN_FEATURES,
+} from "@app/config/planFeatures";
+import type { TierLevel } from "@app/types/billing";
 
 export interface PlanFeature {
   name: string;
@@ -28,60 +35,117 @@ export const useSaaSPlans = () => {
   const { plans, plansLoading, plansError } = usePlanPricing();
 
   const computedPlans = useMemo<PlanTier[]>(() => {
-    const teamPlan = plans.get('team');
+    const teamPlan = plans.get("team");
 
     return [
       {
-        id: 'free',
-        name: t('plan.free.name', 'Free'),
+        id: "free",
+        name: t("plan.free.name", "Free"),
         price: 0,
-        currency: '$',
-        period: t('plan.period.month', '/month'),
-        highlights: FREE_PLAN_FEATURES.map(f => t(f.translationKey, f.defaultText)),
+        currency: "$",
+        period: t("plan.period.month", "/month"),
+        highlights: FREE_PLAN_FEATURES.map((f) =>
+          t(f.translationKey, f.defaultText),
+        ),
         features: [
-          { name: t('plan.feature.pdfTools', 'Basic PDF Tools'), included: true },
-          { name: t('plan.feature.fileSize', 'File Size Limit'), included: false },
-          { name: t('plan.feature.automation', 'Automate tool workflows'), included: false },
-          { name: t('plan.feature.api', 'API Access'), included: false },
-          { name: t('plan.feature.priority', 'Priority Support'), included: false },
-          { name: t('plan.feature.customPricing', 'Custom Pricing'), included: false },
-        ]
+          {
+            name: t("plan.feature.pdfTools", "Basic PDF Tools"),
+            included: true,
+          },
+          {
+            name: t("plan.feature.fileSize", "File Size Limit"),
+            included: false,
+          },
+          {
+            name: t("plan.feature.automation", "Automate tool workflows"),
+            included: false,
+          },
+          { name: t("plan.feature.api", "API Access"), included: false },
+          {
+            name: t("plan.feature.priority", "Priority Support"),
+            included: false,
+          },
+          {
+            name: t("plan.feature.customPricing", "Custom Pricing"),
+            included: false,
+          },
+        ],
       },
       {
-        id: 'team',
-        name: t('plan.team.name', 'Team'),
+        id: "team",
+        name: t("plan.team.name", "Team"),
         price: teamPlan?.price || 10,
-        currency: teamPlan?.currency || '$',
-        period: t('plan.period.month', '/month'),
+        currency: teamPlan?.currency || "$",
+        period: t("plan.period.month", "/month"),
         popular: true,
         overagePrice: teamPlan?.overagePrice || 0.05,
-        highlights: TEAM_PLAN_FEATURES.map(f => t(f.translationKey, f.defaultText)),
+        highlights: TEAM_PLAN_FEATURES.map((f) =>
+          t(f.translationKey, f.defaultText),
+        ),
         features: [
-          { name: t('plan.feature.pdfTools', 'Basic PDF Tools'), included: true },
-          { name: t('plan.feature.fileSize', 'File Size Limit'), included: true },
-          { name: t('plan.feature.automation', 'Automate tool workflows'), included: true },
-          { name: t('plan.feature.api', 'Monthly API Credits'), included: true },
-          { name: t('plan.feature.priority', 'Priority Support'), included: false },
-          { name: t('plan.feature.customPricing', 'Custom Pricing'), included: false },
-        ]
+          {
+            name: t("plan.feature.pdfTools", "Basic PDF Tools"),
+            included: true,
+          },
+          {
+            name: t("plan.feature.fileSize", "File Size Limit"),
+            included: true,
+          },
+          {
+            name: t("plan.feature.automation", "Automate tool workflows"),
+            included: true,
+          },
+          {
+            name: t("plan.feature.api", "Monthly API Credits"),
+            included: true,
+          },
+          {
+            name: t("plan.feature.priority", "Priority Support"),
+            included: false,
+          },
+          {
+            name: t("plan.feature.customPricing", "Custom Pricing"),
+            included: false,
+          },
+        ],
       },
       {
-        id: 'enterprise',
-        name: t('plan.enterprise.name', 'Enterprise'),
+        id: "enterprise",
+        name: t("plan.enterprise.name", "Enterprise"),
         price: 0,
-        currency: '$',
-        period: '',
+        currency: "$",
+        period: "",
         isContactOnly: true,
-        highlights: ENTERPRISE_PLAN_FEATURES.map(f => t(f.translationKey, f.defaultText)),
+        highlights: ENTERPRISE_PLAN_FEATURES.map((f) =>
+          t(f.translationKey, f.defaultText),
+        ),
         features: [
-          { name: t('plan.feature.pdfTools', 'Basic PDF Tools'), included: true },
-          { name: t('plan.feature.fileSize', 'File Size Limit'), included: true },
-          { name: t('plan.feature.automation', 'Automate tool workflows'), included: true },
-          { name: t('plan.feature.api', 'Monthly API Credits'), included: true },
-          { name: t('plan.feature.priority', 'Priority Support'), included: true },
-          { name: t('plan.feature.customPricing', 'Custom Pricing'), included: true },
-        ]
-      }
+          {
+            name: t("plan.feature.pdfTools", "Basic PDF Tools"),
+            included: true,
+          },
+          {
+            name: t("plan.feature.fileSize", "File Size Limit"),
+            included: true,
+          },
+          {
+            name: t("plan.feature.automation", "Automate tool workflows"),
+            included: true,
+          },
+          {
+            name: t("plan.feature.api", "Monthly API Credits"),
+            included: true,
+          },
+          {
+            name: t("plan.feature.priority", "Priority Support"),
+            included: true,
+          },
+          {
+            name: t("plan.feature.customPricing", "Custom Pricing"),
+            included: true,
+          },
+        ],
+      },
     ];
   }, [t, plans]);
 
diff --git a/frontend/src/desktop/hooks/useSaveShortcut.ts b/frontend/src/desktop/hooks/useSaveShortcut.ts
index 82961138ae..4902549f0d 100644
--- a/frontend/src/desktop/hooks/useSaveShortcut.ts
+++ b/frontend/src/desktop/hooks/useSaveShortcut.ts
@@ -1,6 +1,6 @@
-import { useEffect } from 'react';
-import { useFileState, useFileActions } from '@app/contexts/FileContext';
-import { downloadFile } from '@app/services/downloadService';
+import { useEffect } from "react";
+import { useFileState, useFileActions } from "@app/contexts/FileContext";
+import { downloadFile } from "@app/services/downloadService";
 
 /**
  * Desktop-only keyboard shortcut: Ctrl/Cmd+S to save selected files
@@ -14,17 +14,19 @@ export function useSaveShortcut() {
   useEffect(() => {
     const handleKeyDown = async (event: KeyboardEvent) => {
       // Check for Ctrl+S (Windows/Linux) or Cmd+S (Mac)
-      if ((event.ctrlKey || event.metaKey) && event.key === 's') {
+      if ((event.ctrlKey || event.metaKey) && event.key === "s") {
         event.preventDefault();
 
         // Get selected files or all files if nothing selected
         const selectedFileIds = state.ui.selectedFileIds;
-        const filesToSave = selectedFileIds.length > 0
-          ? selectors.getFiles(selectedFileIds)
-          : selectors.getFiles();
-        const stubsToSave = selectedFileIds.length > 0
-          ? selectors.getStirlingFileStubs(selectedFileIds)
-          : selectors.getStirlingFileStubs();
+        const filesToSave =
+          selectedFileIds.length > 0
+            ? selectors.getFiles(selectedFileIds)
+            : selectors.getFiles();
+        const stubsToSave =
+          selectedFileIds.length > 0
+            ? selectors.getStirlingFileStubs(selectedFileIds)
+            : selectors.getStirlingFileStubs();
 
         if (filesToSave.length === 0) {
           return;
@@ -40,14 +42,14 @@ export function useSaveShortcut() {
             const result = await downloadFile({
               data: file,
               filename: file.name,
-              localPath: stub.localFilePath
+              localPath: stub.localFilePath,
             });
 
             // Mark file as clean after successful save
             if (result.savedPath) {
               fileActions.updateStirlingFileStub(stub.id, {
                 localFilePath: stub.localFilePath ?? result.savedPath,
-                isDirty: false
+                isDirty: false,
               });
             }
           } catch (error) {
@@ -57,7 +59,7 @@ export function useSaveShortcut() {
       }
     };
 
-    document.addEventListener('keydown', handleKeyDown);
-    return () => document.removeEventListener('keydown', handleKeyDown);
+    document.addEventListener("keydown", handleKeyDown);
+    return () => document.removeEventListener("keydown", handleKeyDown);
   }, [selectors, state.ui.selectedFileIds, fileActions]);
 }
diff --git a/frontend/src/desktop/hooks/useSelfHostedAuth.ts b/frontend/src/desktop/hooks/useSelfHostedAuth.ts
index 30b716dedb..a02418f8d0 100644
--- a/frontend/src/desktop/hooks/useSelfHostedAuth.ts
+++ b/frontend/src/desktop/hooks/useSelfHostedAuth.ts
@@ -1,7 +1,7 @@
-import { useState, useEffect, useRef } from 'react';
-import { useAppConfig } from '@app/contexts/AppConfigContext';
-import { authService } from '@app/services/authService';
-import { connectionModeService } from '@app/services/connectionModeService';
+import { useState, useEffect, useRef } from "react";
+import { useAppConfig } from "@app/contexts/AppConfigContext";
+import { authService } from "@app/services/authService";
+import { connectionModeService } from "@app/services/connectionModeService";
 
 export interface SelfHostedAuthState {
   isSelfHosted: boolean;
@@ -21,13 +21,19 @@ export function useSelfHostedAuth(): SelfHostedAuthState {
   const wasSelfHosted = useRef(false);
 
   useEffect(() => {
-    void connectionModeService.getCurrentMode().then(mode => setIsSelfHosted(mode === 'selfhosted'));
-    return connectionModeService.subscribeToModeChanges(cfg => setIsSelfHosted(cfg.mode === 'selfhosted'));
+    void connectionModeService
+      .getCurrentMode()
+      .then((mode) => setIsSelfHosted(mode === "selfhosted"));
+    return connectionModeService.subscribeToModeChanges((cfg) =>
+      setIsSelfHosted(cfg.mode === "selfhosted"),
+    );
   }, []);
 
   useEffect(() => {
     void authService.isAuthenticated().then(setIsAuthenticated);
-    return authService.subscribeToAuth(status => setIsAuthenticated(status === 'authenticated'));
+    return authService.subscribeToAuth((status) =>
+      setIsAuthenticated(status === "authenticated"),
+    );
   }, []);
 
   useEffect(() => {
diff --git a/frontend/src/desktop/hooks/useSelfHostedToolAvailability.ts b/frontend/src/desktop/hooks/useSelfHostedToolAvailability.ts
index 43fceb7088..8d0be53ffa 100644
--- a/frontend/src/desktop/hooks/useSelfHostedToolAvailability.ts
+++ b/frontend/src/desktop/hooks/useSelfHostedToolAvailability.ts
@@ -1,8 +1,8 @@
-import { useState, useEffect, useRef } from 'react';
-import { connectionModeService } from '@app/services/connectionModeService';
-import { tauriBackendService } from '@app/services/tauriBackendService';
-import { selfHostedServerMonitor } from '@app/services/selfHostedServerMonitor';
-import { endpointAvailabilityService } from '@app/services/endpointAvailabilityService';
+import { useState, useEffect, useRef } from "react";
+import { connectionModeService } from "@app/services/connectionModeService";
+import { tauriBackendService } from "@app/services/tauriBackendService";
+import { selfHostedServerMonitor } from "@app/services/selfHostedServerMonitor";
+import { endpointAvailabilityService } from "@app/services/endpointAvailabilityService";
 
 /**
  * Desktop implementation of useSelfHostedToolAvailability.
@@ -15,7 +15,7 @@ import { endpointAvailabilityService } from '@app/services/endpointAvailabilityS
  *  - Local backend port is not yet known
  */
 export function useSelfHostedToolAvailability(
-  tools: Array<{ id: string; endpoints?: string[] }>
+  tools: Array<{ id: string; endpoints?: string[] }>,
 ): Set<string> {
   const [unavailableIds, setUnavailableIds] = useState<Set<string>>(new Set());
   // Keep a stable ref to the latest tools list to avoid unnecessary re-subscriptions
@@ -27,13 +27,13 @@ export function useSelfHostedToolAvailability(
 
     const computeUnavailableTools = async () => {
       const mode = await connectionModeService.getCurrentMode();
-      if (mode !== 'selfhosted') {
+      if (mode !== "selfhosted") {
         setUnavailableIds(new Set());
         return;
       }
 
       const { status } = selfHostedServerMonitor.getSnapshot();
-      if (status !== 'offline') {
+      if (status !== "offline") {
         // Idle or checking — not yet confirmed offline; don't mark anything unavailable
         if (!cancelled) setUnavailableIds(new Set());
         return;
@@ -49,20 +49,23 @@ export function useSelfHostedToolAvailability(
       // For each tool, check whether at least one of its endpoints is supported locally
       const unavailable = new Set<string>();
       await Promise.all(
-        toolsRef.current.map(async tool => {
+        toolsRef.current.map(async (tool) => {
           const endpoints = tool.endpoints ?? [];
           if (endpoints.length === 0) return; // No endpoints → always available
 
           const locallySupported = await Promise.all(
-            endpoints.map(ep =>
-              endpointAvailabilityService.isEndpointSupportedLocally(ep, localUrl)
-            )
+            endpoints.map((ep) =>
+              endpointAvailabilityService.isEndpointSupportedLocally(
+                ep,
+                localUrl,
+              ),
+            ),
           );
 
           if (!locallySupported.some(Boolean)) {
             unavailable.add(tool.id);
           }
-        })
+        }),
       );
 
       if (!cancelled) setUnavailableIds(unavailable);
diff --git a/frontend/src/desktop/hooks/useSharingEnabled.ts b/frontend/src/desktop/hooks/useSharingEnabled.ts
index bab59a771f..8c013a38f8 100644
--- a/frontend/src/desktop/hooks/useSharingEnabled.ts
+++ b/frontend/src/desktop/hooks/useSharingEnabled.ts
@@ -1,6 +1,6 @@
-import { useAppConfig } from '@app/contexts/AppConfigContext';
-import { useSelfHostedAuth } from '@app/hooks/useSelfHostedAuth';
-import type { SharingEnabledResult } from '@core/hooks/useSharingEnabled';
+import { useAppConfig } from "@app/contexts/AppConfigContext";
+import { useSelfHostedAuth } from "@app/hooks/useSelfHostedAuth";
+import type { SharingEnabledResult } from "@core/hooks/useSharingEnabled";
 
 /**
  * Desktop override: file-sharing features require self-hosted mode AND an
diff --git a/frontend/src/desktop/hooks/useToolCloudStatus.ts b/frontend/src/desktop/hooks/useToolCloudStatus.ts
index 18636a8b7c..29ec4f3ee3 100644
--- a/frontend/src/desktop/hooks/useToolCloudStatus.ts
+++ b/frontend/src/desktop/hooks/useToolCloudStatus.ts
@@ -1,7 +1,7 @@
-import { useState, useEffect } from 'react';
-import { connectionModeService } from '@app/services/connectionModeService';
-import { endpointAvailabilityService } from '@app/services/endpointAvailabilityService';
-import { tauriBackendService } from '@app/services/tauriBackendService';
+import { useState, useEffect } from "react";
+import { connectionModeService } from "@app/services/connectionModeService";
+import { endpointAvailabilityService } from "@app/services/endpointAvailabilityService";
+import { tauriBackendService } from "@app/services/tauriBackendService";
 
 /**
  * Desktop hook to check if a tool endpoint will use cloud backend
@@ -28,13 +28,16 @@ export function useToolCloudStatus(endpointName?: string): boolean {
 
         // Check if in SaaS mode
         const mode = await connectionModeService.getCurrentMode();
-        if (mode !== 'saas') {
+        if (mode !== "saas") {
           setUsesCloud(false);
           return;
         }
 
         // Check if supported on SaaS first (if not, no point showing cloud badge)
-        const supportedOnSaaS = await endpointAvailabilityService.isEndpointSupportedOnSaaS(endpointName);
+        const supportedOnSaaS =
+          await endpointAvailabilityService.isEndpointSupportedOnSaaS(
+            endpointName,
+          );
 
         if (!supportedOnSaaS) {
           // Not available on SaaS, don't show cloud badge
@@ -43,10 +46,11 @@ export function useToolCloudStatus(endpointName?: string): boolean {
         }
 
         // Available on SaaS, check if also available locally
-        const supportedLocally = await endpointAvailabilityService.isEndpointSupportedLocally(
-          endpointName,
-          tauriBackendService.getBackendUrl()
-        );
+        const supportedLocally =
+          await endpointAvailabilityService.isEndpointSupportedLocally(
+            endpointName,
+            tauriBackendService.getBackendUrl(),
+          );
         // Show cloud badge only if SaaS supports it but local doesn't
         setUsesCloud(!supportedLocally);
       } catch {
@@ -59,7 +63,7 @@ export function useToolCloudStatus(endpointName?: string): boolean {
 
     // Subscribe to backend status changes to re-check when backend becomes healthy
     const unsubscribe = tauriBackendService.subscribeToStatus((status) => {
-      if (status === 'healthy') {
+      if (status === "healthy") {
         checkCloudRouting();
       }
     });
diff --git a/frontend/src/desktop/hooks/useViewerKeyCommand.ts b/frontend/src/desktop/hooks/useViewerKeyCommand.ts
new file mode 100644
index 0000000000..54f324196e
--- /dev/null
+++ b/frontend/src/desktop/hooks/useViewerKeyCommand.ts
@@ -0,0 +1,23 @@
+import { useViewer } from "@app/contexts/ViewerContext";
+import { useCallback } from "react";
+
+export function useViewerKeyCommand(): (event: KeyboardEvent) => boolean {
+  const { rotationActions } = useViewer();
+  return useCallback(
+    (event: KeyboardEvent): boolean => {
+      switch (event.key) {
+        case "r":
+        case "R":
+          event.preventDefault();
+          if (event.shiftKey) {
+            rotationActions.rotateBackward();
+          } else {
+            rotationActions.rotateForward();
+          }
+          return true;
+      }
+      return false;
+    },
+    [rotationActions],
+  );
+}
diff --git a/frontend/src/desktop/hooks/useWillUseCloud.ts b/frontend/src/desktop/hooks/useWillUseCloud.ts
index 754c2a9e49..b6b2c7e1a7 100644
--- a/frontend/src/desktop/hooks/useWillUseCloud.ts
+++ b/frontend/src/desktop/hooks/useWillUseCloud.ts
@@ -1,6 +1,6 @@
-import { useState, useEffect } from 'react';
-import { operationRouter } from '@app/services/operationRouter';
-import { tauriBackendService } from '@app/services/tauriBackendService';
+import { useState, useEffect } from "react";
+import { operationRouter } from "@app/services/operationRouter";
+import { tauriBackendService } from "@app/services/tauriBackendService";
 
 /**
  * Desktop hook to detect if an operation will use cloud/SaaS backend
@@ -29,7 +29,11 @@ export function useWillUseCloud(endpoint?: string): boolean {
         const willRoute = await operationRouter.willRouteToSaaS(endpoint);
         setWillUseCloud(willRoute);
       } catch (error) {
-        console.error('[useWillUseCloud] Failed to check cloud routing for endpoint:', endpoint, error);
+        console.error(
+          "[useWillUseCloud] Failed to check cloud routing for endpoint:",
+          endpoint,
+          error,
+        );
         setWillUseCloud(false);
       }
     };
@@ -39,7 +43,7 @@ export function useWillUseCloud(endpoint?: string): boolean {
 
     // Subscribe to backend status changes to re-check when backend becomes healthy
     const unsubscribe = tauriBackendService.subscribeToStatus((status) => {
-      if (status === 'healthy') {
+      if (status === "healthy") {
         checkCloudRouting();
       }
     });
diff --git a/frontend/src/desktop/routes/Landing.tsx b/frontend/src/desktop/routes/Landing.tsx
index 0fe981c485..ce48048951 100644
--- a/frontend/src/desktop/routes/Landing.tsx
+++ b/frontend/src/desktop/routes/Landing.tsx
@@ -1,4 +1,4 @@
-import HomePage from '@app/pages/HomePage';
+import HomePage from "@app/pages/HomePage";
 
 /**
  * Desktop override of Landing.
diff --git a/frontend/src/desktop/routes/Login.tsx b/frontend/src/desktop/routes/Login.tsx
index 6a2e4dcf8f..a895a4a035 100644
--- a/frontend/src/desktop/routes/Login.tsx
+++ b/frontend/src/desktop/routes/Login.tsx
@@ -1,4 +1,4 @@
-import { Navigate } from 'react-router-dom';
+import { Navigate } from "react-router-dom";
 
 /**
  * Desktop override of the /login route.
diff --git a/frontend/src/desktop/routes/login/LoginHeader.tsx b/frontend/src/desktop/routes/login/LoginHeader.tsx
index 354b36a8b6..d842ff6e86 100644
--- a/frontend/src/desktop/routes/login/LoginHeader.tsx
+++ b/frontend/src/desktop/routes/login/LoginHeader.tsx
@@ -1,6 +1,6 @@
-import { ActionIcon } from '@mantine/core';
-import CloseIcon from '@mui/icons-material/Close';
-import { useLogoAssets } from '@app/hooks/useLogoAssets';
+import { ActionIcon } from "@mantine/core";
+import CloseIcon from "@mui/icons-material/Close";
+import { useLogoAssets } from "@app/hooks/useLogoAssets";
 
 interface LoginHeaderProps {
   title: string;
@@ -13,15 +13,46 @@ interface LoginHeaderProps {
  * Desktop override of LoginHeader.
  * Renders icon + title + optional close button all in one row.
  */
-export default function LoginHeader({ title, subtitle, centerOnly = false, onClose }: LoginHeaderProps) {
+export default function LoginHeader({
+  title,
+  subtitle,
+  centerOnly = false,
+  onClose,
+}: LoginHeaderProps) {
   const { tooltipLogo } = useLogoAssets();
 
   return (
-    <div className={`login-header${centerOnly ? ' login-header-centered' : ''}`} style={{ marginBottom: '2rem' }}>
-      <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between', gap: '0.75rem' }}>
-        <div style={{ display: 'flex', alignItems: 'center', gap: '0.6rem', flex: 1, minWidth: 0 }}>
-          <img src={tooltipLogo} alt="Stirling PDF" style={{ width: 36, height: 36, flexShrink: 0 }} />
-          {title && <h1 className="login-title" style={{ margin: 0 }}>{title}</h1>}
+    <div
+      className={`login-header${centerOnly ? " login-header-centered" : ""}`}
+      style={{ marginBottom: "2rem" }}
+    >
+      <div
+        style={{
+          display: "flex",
+          alignItems: "center",
+          justifyContent: "space-between",
+          gap: "0.75rem",
+        }}
+      >
+        <div
+          style={{
+            display: "flex",
+            alignItems: "center",
+            gap: "0.6rem",
+            flex: 1,
+            minWidth: 0,
+          }}
+        >
+          <img
+            src={tooltipLogo}
+            alt="Stirling PDF"
+            style={{ width: 36, height: 36, flexShrink: 0 }}
+          />
+          {title && (
+            <h1 className="login-title" style={{ margin: 0 }}>
+              {title}
+            </h1>
+          )}
         </div>
         {onClose && (
           <ActionIcon
@@ -29,7 +60,11 @@ export default function LoginHeader({ title, subtitle, centerOnly = false, onClo
             radius="md"
             size={32}
             variant="subtle"
-            style={{ flexShrink: 0, color: 'var(--text-secondary)', outline: 'none' }}
+            style={{
+              flexShrink: 0,
+              color: "var(--text-secondary)",
+              outline: "none",
+            }}
           >
             <CloseIcon fontSize="small" />
           </ActionIcon>
diff --git a/frontend/src/desktop/services/apiClient.ts b/frontend/src/desktop/services/apiClient.ts
index 257099c801..e646d95290 100644
--- a/frontend/src/desktop/services/apiClient.ts
+++ b/frontend/src/desktop/services/apiClient.ts
@@ -4,16 +4,16 @@
  * Bypasses CORS restrictions by using native HTTP instead of browser fetch
  */
 
-import type { AxiosInstance } from 'axios';
-import { create } from '@app/services/tauriHttpClient';
-import { handleHttpError } from '@app/services/httpErrorHandler';
-import { setupApiInterceptors } from '@app/services/apiClientSetup';
-import { getApiBaseUrl } from '@app/services/apiClientConfig';
+import type { AxiosInstance } from "axios";
+import { create } from "@app/services/tauriHttpClient";
+import { handleHttpError } from "@app/services/httpErrorHandler";
+import { setupApiInterceptors } from "@app/services/apiClientSetup";
+import { getApiBaseUrl } from "@app/services/apiClientConfig";
 
 // Create Tauri HTTP client with default config
 const apiClient = create({
   baseURL: getApiBaseUrl(),
-  responseType: 'json',
+  responseType: "json",
   withCredentials: false, // Desktop doesn't need credentials
 });
 
@@ -27,7 +27,7 @@ apiClient.interceptors.response.use(
   async (error) => {
     await handleHttpError(error); // Handle error (shows toast unless suppressed)
     return Promise.reject(error);
-  }
+  },
 );
 
 // ---------- Exports ----------
diff --git a/frontend/src/desktop/services/apiClientConfig.ts b/frontend/src/desktop/services/apiClientConfig.ts
index a936392c81..4989ed4277 100644
--- a/frontend/src/desktop/services/apiClientConfig.ts
+++ b/frontend/src/desktop/services/apiClientConfig.ts
@@ -1,4 +1,4 @@
-import { isTauri } from '@tauri-apps/api/core';
+import { isTauri } from "@tauri-apps/api/core";
 
 /**
  * Desktop override: Determine base URL depending on Tauri environment
@@ -15,8 +15,8 @@ import { isTauri } from '@tauri-apps/api/core';
 export function getApiBaseUrl(): string {
   if (!isTauri()) {
     // Runtime override to fix hardcoded localhost in builds
-    if (typeof window !== 'undefined' && (window as any).STIRLING_PDF_API_BASE_URL) {
-      return (window as any).STIRLING_PDF_API_BASE_URL;
+    if (typeof window !== "undefined" && window.STIRLING_PDF_API_BASE_URL) {
+      return window.STIRLING_PDF_API_BASE_URL;
     }
 
     return import.meta.env.VITE_API_BASE_URL;
@@ -26,5 +26,5 @@ export function getApiBaseUrl(): string {
   // The actual URL will be set dynamically by operationRouter based on:
   // - Offline mode: dynamic port from tauriBackendService
   // - Server mode: configured server URL from connectionModeService
-  return '';
+  return "";
 }
diff --git a/frontend/src/desktop/services/apiClientSetup.ts b/frontend/src/desktop/services/apiClientSetup.ts
index 13a5324851..3b97154fe2 100644
--- a/frontend/src/desktop/services/apiClientSetup.ts
+++ b/frontend/src/desktop/services/apiClientSetup.ts
@@ -1,14 +1,17 @@
-import type { AxiosInstance, InternalAxiosRequestConfig } from 'axios';
-import { alert } from '@app/components/toast';
-import { setupApiInterceptors as coreSetup } from '@core/services/apiClientSetup';
-import { tauriBackendService } from '@app/services/tauriBackendService';
-import { createBackendNotReadyError } from '@app/constants/backendErrors';
-import { operationRouter } from '@app/services/operationRouter';
-import { authService } from '@app/services/authService';
-import { connectionModeService } from '@app/services/connectionModeService';
-import { STIRLING_SAAS_URL, STIRLING_SAAS_BACKEND_API_URL } from '@app/constants/connection';
-import { OPEN_SIGN_IN_EVENT } from '@app/constants/signInEvents';
-import i18n from '@app/i18n';
+import type { AxiosInstance, InternalAxiosRequestConfig } from "axios";
+import { alert } from "@app/components/toast";
+import { setupApiInterceptors as coreSetup } from "@core/services/apiClientSetup";
+import { tauriBackendService } from "@app/services/tauriBackendService";
+import { createBackendNotReadyError } from "@app/constants/backendErrors";
+import { operationRouter } from "@app/services/operationRouter";
+import { authService } from "@app/services/authService";
+import { connectionModeService } from "@app/services/connectionModeService";
+import {
+  STIRLING_SAAS_URL,
+  STIRLING_SAAS_BACKEND_API_URL,
+} from "@app/constants/connection";
+import { OPEN_SIGN_IN_EVENT } from "@app/constants/signInEvents";
+import i18n from "@app/i18n";
 
 const BACKEND_TOAST_COOLDOWN_MS = 4000;
 let lastBackendToast = 0;
@@ -42,14 +45,15 @@ export function setupApiInterceptors(client: AxiosInstance): void {
       // Pattern matching in shouldSkipBackendReadyCheck() needs original relative URL
       const originalUrl = extendedConfig.url;
       const skipCheck = extendedConfig.skipBackendReadyCheck === true;
-      const skipForSaaSBackend = await operationRouter.shouldSkipBackendReadyCheck(originalUrl);
+      const skipForSaaSBackend =
+        await operationRouter.shouldSkipBackendReadyCheck(originalUrl);
 
       try {
         // Get the appropriate base URL for this request
         const baseUrl = await operationRouter.getBaseUrl(originalUrl);
 
         // Build the full URL
-        if (extendedConfig.url && !extendedConfig.url.startsWith('http')) {
+        if (extendedConfig.url && !extendedConfig.url.startsWith("http")) {
           extendedConfig.url = `${baseUrl}${extendedConfig.url}`;
         }
 
@@ -67,7 +71,9 @@ export function setupApiInterceptors(client: AxiosInstance): void {
         // Tag request so error handler can identify SaaS backend errors without URL matching
         extendedConfig._isSaaSRequest = isSaaSBackendRequest;
 
-        console.debug(`[apiClientSetup] Auth check: isRemote=${isRemote}, isSaaSBackendRequest=${isSaaSBackendRequest}, needsAuth=${needsAuth}, baseUrl=${baseUrl}`);
+        console.debug(
+          `[apiClientSetup] Auth check: isRemote=${isRemote}, isSaaSBackendRequest=${isSaaSBackendRequest}, needsAuth=${needsAuth}, baseUrl=${baseUrl}`,
+        );
 
         if (needsAuth) {
           // Enable credentials for session management
@@ -79,16 +85,20 @@ export function setupApiInterceptors(client: AxiosInstance): void {
 
           if (token) {
             extendedConfig.headers.Authorization = `Bearer ${token}`;
-            console.debug(`[apiClientSetup] Added auth token for request to: ${extendedConfig.url}`);
+            console.debug(
+              `[apiClientSetup] Added auth token for request to: ${extendedConfig.url}`,
+            );
           } else {
-            console.warn(`[apiClientSetup] No auth token available for: ${extendedConfig.url}`);
+            console.warn(
+              `[apiClientSetup] No auth token available for: ${extendedConfig.url}`,
+            );
           }
         } else {
           // Local bundled backend: disable credentials (security disabled)
           extendedConfig.withCredentials = false;
         }
       } catch (error) {
-        console.error('[apiClientSetup] Error in request interceptor:', error);
+        console.error("[apiClientSetup] Error in request interceptor:", error);
         // Continue with request even if routing/auth logic fails
         // This ensures requests aren't blocked by interceptor errors
       }
@@ -99,18 +109,23 @@ export function setupApiInterceptors(client: AxiosInstance): void {
       const backendStatus = tauriBackendService.getBackendStatus();
       const backendPort = tauriBackendService.getBackendPort();
 
-      console.debug(`[apiClientSetup] Backend readiness check for ${extendedConfig.url}: isSaaS=${isSaaS}, skipCheck=${skipCheck}, skipForSaaSBackend=${skipForSaaSBackend}, backendHealthy=${backendHealthy}, backendStatus=${backendStatus}, backendPort=${backendPort}`);
+      console.debug(
+        `[apiClientSetup] Backend readiness check for ${extendedConfig.url}: isSaaS=${isSaaS}, skipCheck=${skipCheck}, skipForSaaSBackend=${skipForSaaSBackend}, backendHealthy=${backendHealthy}, backendStatus=${backendStatus}, backendPort=${backendPort}`,
+      );
 
       if (isSaaS && !skipCheck && !skipForSaaSBackend && !backendHealthy) {
-        const method = (extendedConfig.method || 'get').toLowerCase();
-        if (method !== 'get') {
+        const method = (extendedConfig.method || "get").toLowerCase();
+        if (method !== "get") {
           const now = Date.now();
           if (now - lastBackendToast > BACKEND_TOAST_COOLDOWN_MS) {
             lastBackendToast = now;
             alert({
-              alertType: 'error',
-              title: i18n.t('backendHealth.offline', 'Backend Offline'),
-              body: i18n.t('backendHealth.wait', 'Please wait for the backend to finish launching and try again.'),
+              alertType: "error",
+              title: i18n.t("backendHealth.offline", "Backend Offline"),
+              body: i18n.t(
+                "backendHealth.wait",
+                "Please wait for the backend to finish launching and try again.",
+              ),
               isPersistentPopup: false,
             });
           }
@@ -120,7 +135,7 @@ export function setupApiInterceptors(client: AxiosInstance): void {
 
       return extendedConfig;
     },
-    (error) => Promise.reject(error)
+    (error) => Promise.reject(error),
   );
 
   // Response interceptor: Handle auth errors and update credits from headers
@@ -128,16 +143,18 @@ export function setupApiInterceptors(client: AxiosInstance): void {
     async (response) => {
       // Check for credit balance update in response headers
       // Backend includes X-Credits-Remaining header after operations that consume credits
-      const creditsHeader = response.headers['x-credits-remaining'];
+      const creditsHeader = response.headers["x-credits-remaining"];
 
       if (creditsHeader !== undefined && creditsHeader !== null) {
         const creditsRemaining = parseInt(creditsHeader, 10);
 
         if (!isNaN(creditsRemaining)) {
           // Dispatch event with new balance for immediate update
-          window.dispatchEvent(new CustomEvent('credits:updated', {
-            detail: { creditsRemaining }
-          }));
+          window.dispatchEvent(
+            new CustomEvent("credits:updated", {
+              detail: { creditsRemaining },
+            }),
+          );
         }
       }
 
@@ -145,8 +162,8 @@ export function setupApiInterceptors(client: AxiosInstance): void {
     },
     async (error) => {
       const originalRequest = error.config as ExtendedRequestConfig;
-      const requestUrl = String(originalRequest?.url || '');
-      const isAuthProbeRequest = requestUrl.includes('/api/v1/auth/me');
+      const requestUrl = String(originalRequest?.url || "");
+      const isAuthProbeRequest = requestUrl.includes("/api/v1/auth/me");
 
       // Handle 401 Unauthorized - try to refresh token
       if (error.response?.status === 401 && !originalRequest._retry) {
@@ -155,8 +172,13 @@ export function setupApiInterceptors(client: AxiosInstance): void {
         if (isAuthProbeRequest) {
           return Promise.reject(error);
         }
-        if (typeof window !== 'undefined') {
-          console.warn('[apiClientSetup] 401 on path:', window.location.pathname, 'url:', originalRequest.url);
+        if (typeof window !== "undefined") {
+          console.warn(
+            "[apiClientSetup] 401 on path:",
+            window.location.pathname,
+            "url:",
+            originalRequest.url,
+          );
         }
         if (originalRequest.skipAuthRedirect) {
           return Promise.reject(error);
@@ -169,7 +191,9 @@ export function setupApiInterceptors(client: AxiosInstance): void {
         }
         originalRequest._retry = true;
 
-        console.debug(`[apiClientSetup] 401 error, attempting token refresh for: ${originalRequest.url}`);
+        console.debug(
+          `[apiClientSetup] 401 error, attempting token refresh for: ${originalRequest.url}`,
+        );
 
         const isRemote = await operationRouter.isSelfHostedMode();
         let refreshed = false;
@@ -188,32 +212,41 @@ export function setupApiInterceptors(client: AxiosInstance): void {
         if (refreshed) {
           // Retry the original request with new token
           const token = await authService.getAuthToken();
-          console.debug(`[apiClientSetup] Token refreshed, retrying request to: ${originalRequest.url}`);
+          console.debug(
+            `[apiClientSetup] Token refreshed, retrying request to: ${originalRequest.url}`,
+          );
 
           if (token) {
             originalRequest.headers.Authorization = `Bearer ${token}`;
           } else {
-            console.error(`[apiClientSetup] No token available after successful refresh!`);
+            console.error(
+              `[apiClientSetup] No token available after successful refresh!`,
+            );
           }
 
           return client.request(originalRequest);
         }
 
         // Refresh failed - prompt for re-authentication via the sign-in modal.
-        window.dispatchEvent(new CustomEvent(OPEN_SIGN_IN_EVENT, { detail: { locked: false } }));
+        window.dispatchEvent(
+          new CustomEvent(OPEN_SIGN_IN_EVENT, { detail: { locked: false } }),
+        );
       }
 
       // Handle 403 Forbidden - unauthorized access
       if (error.response?.status === 403) {
         alert({
-          alertType: 'error',
-          title: i18n.t('auth.accessDenied', 'Access Denied'),
-          body: i18n.t('auth.insufficientPermissions', 'You do not have permission to perform this action.'),
+          alertType: "error",
+          title: i18n.t("auth.accessDenied", "Access Denied"),
+          body: i18n.t(
+            "auth.insufficientPermissions",
+            "You do not have permission to perform this action.",
+          ),
           isPersistentPopup: false,
         });
       }
 
       return Promise.reject(error);
-    }
+    },
   );
 }
diff --git a/frontend/src/desktop/services/authService.ts b/frontend/src/desktop/services/authService.ts
index b7751ce53a..9073c9d150 100644
--- a/frontend/src/desktop/services/authService.ts
+++ b/frontend/src/desktop/services/authService.ts
@@ -1,11 +1,15 @@
-import { invoke, isTauri } from '@tauri-apps/api/core';
-import { listen } from '@tauri-apps/api/event';
-import { open as shellOpen } from '@tauri-apps/plugin-shell';
-import { connectionModeService } from '@app/services/connectionModeService';
-import { tauriBackendService } from '@app/services/tauriBackendService';
-import axios from 'axios';
-import tauriHttpClient from '@app/services/tauriHttpClient';
-import { DESKTOP_DEEP_LINK_CALLBACK, STIRLING_SAAS_URL, SUPABASE_KEY } from '@app/constants/connection';
+import { invoke, isTauri } from "@tauri-apps/api/core";
+import { listen } from "@tauri-apps/api/event";
+import { open as shellOpen } from "@tauri-apps/plugin-shell";
+import { connectionModeService } from "@app/services/connectionModeService";
+import { tauriBackendService } from "@app/services/tauriBackendService";
+import axios from "axios";
+import tauriHttpClient from "@app/services/tauriHttpClient";
+import {
+  DESKTOP_DEEP_LINK_CALLBACK,
+  STIRLING_SAAS_URL,
+  SUPABASE_KEY,
+} from "@app/constants/connection";
 
 export interface UserInfo {
   username: string;
@@ -33,15 +37,21 @@ interface OAuthCallbackResult {
   expires_in: number | null;
 }
 
-export type AuthStatus = 'authenticated' | 'unauthenticated' | 'refreshing' | 'oauth_pending';
+export type AuthStatus =
+  | "authenticated"
+  | "unauthenticated"
+  | "refreshing"
+  | "oauth_pending";
 
 export class AuthService {
   private static instance: AuthService;
-  private authStatus: AuthStatus = 'unauthenticated';
+  private authStatus: AuthStatus = "unauthenticated";
   private userInfo: UserInfo | null = null;
   private cachedToken: string | null = null;
   private lastTokenSaveTime: number = 0;
-  private authListeners = new Set<(status: AuthStatus, userInfo: UserInfo | null) => void>();
+  private authListeners = new Set<
+    (status: AuthStatus, userInfo: UserInfo | null) => void
+  >();
   private refreshPromise: Promise<boolean> | null = null;
   private selfHostedDeepLinkFlowActive = false;
 
@@ -58,27 +68,35 @@ export class AuthService {
   private async saveTokenEverywhere(
     token: string,
     refreshToken?: string | null,
-    emitJwtAvailable = true
+    emitJwtAvailable = true,
   ): Promise<void> {
     // Validate token before caching
     if (!token || token.trim().length === 0) {
-      console.warn('[Desktop AuthService] Attempted to save invalid/empty token');
-      throw new Error('Invalid token');
+      console.warn(
+        "[Desktop AuthService] Attempted to save invalid/empty token",
+      );
+      throw new Error("Invalid token");
     }
 
     // Save access token to Tauri secure store (primary)
     try {
-      await invoke('save_auth_token', { token });
+      await invoke("save_auth_token", { token });
     } catch (error) {
-      console.error('[Desktop AuthService] Failed to save token to Tauri store:', error);
+      console.error(
+        "[Desktop AuthService] Failed to save token to Tauri store:",
+        error,
+      );
       // Don't throw - we can still use localStorage
     }
 
     // Sync to localStorage for web layer (fallback)
     try {
-      localStorage.setItem('stirling_jwt', token);
+      localStorage.setItem("stirling_jwt", token);
     } catch (error) {
-      console.error('[Desktop AuthService] Failed to save token to localStorage:', error);
+      console.error(
+        "[Desktop AuthService] Failed to save token to localStorage:",
+        error,
+      );
     }
 
     // Cache the valid token in memory
@@ -88,17 +106,20 @@ export class AuthService {
     // Save refresh token if provided (keyring with Tauri Store fallback)
     if (refreshToken) {
       try {
-        await invoke('save_refresh_token', { token: refreshToken });
+        await invoke("save_refresh_token", { token: refreshToken });
         // Only remove from localStorage after successful save
-        localStorage.removeItem('stirling_refresh_token');
+        localStorage.removeItem("stirling_refresh_token");
       } catch (error) {
-        console.error('[Desktop AuthService] Failed to save refresh token:', error);
+        console.error(
+          "[Desktop AuthService] Failed to save refresh token:",
+          error,
+        );
       }
     }
 
     if (emitJwtAvailable) {
       // Notify other parts of the system when a brand-new auth session is established.
-      window.dispatchEvent(new CustomEvent('jwt-available'));
+      window.dispatchEvent(new CustomEvent("jwt-available"));
     }
   }
 
@@ -108,23 +129,26 @@ export class AuthService {
   private async getTokenFromAnySource(): Promise<string | null> {
     // Try Tauri store first
     try {
-      const token = await invoke<string | null>('get_auth_token');
+      const token = await invoke<string | null>("get_auth_token");
       if (token) {
         return token;
       }
     } catch (error) {
-      console.error('[Desktop AuthService] Failed to read from Tauri store:', error);
+      console.error(
+        "[Desktop AuthService] Failed to read from Tauri store:",
+        error,
+      );
     }
 
     // Fallback to localStorage
-    return localStorage.getItem('stirling_jwt');
+    return localStorage.getItem("stirling_jwt");
   }
 
   /**
    * Get refresh token from secure storage (keyring or Tauri Store fallback)
    */
   private async getRefreshToken(): Promise<string | null> {
-    return await invoke<string | null>('get_refresh_token');
+    return await invoke<string | null>("get_refresh_token");
   }
 
   /**
@@ -136,23 +160,32 @@ export class AuthService {
 
     // Best effort: clear Tauri keyring (both access and refresh tokens)
     try {
-      await invoke('clear_auth_token');
+      await invoke("clear_auth_token");
     } catch (error) {
-      console.warn('[Desktop AuthService] Failed to clear Tauri keyring access token', error);
+      console.warn(
+        "[Desktop AuthService] Failed to clear Tauri keyring access token",
+        error,
+      );
     }
 
     try {
-      await invoke('clear_refresh_token');
+      await invoke("clear_refresh_token");
     } catch (error) {
-      console.warn('[Desktop AuthService] Failed to clear Tauri keyring refresh token', error);
+      console.warn(
+        "[Desktop AuthService] Failed to clear Tauri keyring refresh token",
+        error,
+      );
     }
 
     // Best effort: clear web storage
     try {
-      localStorage.removeItem('stirling_jwt');
-      localStorage.removeItem('stirling_refresh_token');
+      localStorage.removeItem("stirling_jwt");
+      localStorage.removeItem("stirling_refresh_token");
     } catch (error) {
-      console.warn('[Desktop AuthService] Failed to clear localStorage tokens', error);
+      console.warn(
+        "[Desktop AuthService] Failed to clear localStorage tokens",
+        error,
+      );
     }
   }
 
@@ -162,14 +195,16 @@ export class AuthService {
   async localClearAuth(): Promise<void> {
     await this.clearTokenEverywhere().catch(() => {});
     try {
-      await invoke('clear_user_info');
+      await invoke("clear_user_info");
     } catch (err) {
-      console.warn('[Desktop AuthService] Failed to clear user info', err);
+      console.warn("[Desktop AuthService] Failed to clear user info", err);
     }
-    this.setAuthStatus('unauthenticated', null);
+    this.setAuthStatus("unauthenticated", null);
   }
 
-  subscribeToAuth(listener: (status: AuthStatus, userInfo: UserInfo | null) => void): () => void {
+  subscribeToAuth(
+    listener: (status: AuthStatus, userInfo: UserInfo | null) => void,
+  ): () => void {
     this.authListeners.add(listener);
     // Immediately notify new listener of current state
     listener(this.authStatus, this.userInfo);
@@ -183,7 +218,9 @@ export class AuthService {
   }
 
   private notifyListeners() {
-    this.authListeners.forEach(listener => listener(this.authStatus, this.userInfo));
+    this.authListeners.forEach((listener) =>
+      listener(this.authStatus, this.userInfo),
+    );
   }
 
   private setAuthStatus(status: AuthStatus, userInfo: UserInfo | null = null) {
@@ -201,44 +238,53 @@ export class AuthService {
     // Stop simulating once the user has freshly authenticated in this session
     // (e.g. after completing re-auth via the sign-in modal). This prevents the
     // simulation from looping: expired → modal → re-auth → expired → modal…
-    if (this.authStatus === 'authenticated') return false;
+    if (this.authStatus === "authenticated") return false;
     return (
       import.meta.env.DEV &&
-      String(import.meta.env.VITE_DEV_SIMULATE_EXPIRED_JWT ?? '').toLowerCase() === 'true'
+      String(
+        import.meta.env.VITE_DEV_SIMULATE_EXPIRED_JWT ?? "",
+      ).toLowerCase() === "true"
     );
   }
 
-  async completeSupabaseSession(accessToken: string, serverUrl: string): Promise<UserInfo> {
+  async completeSupabaseSession(
+    accessToken: string,
+    serverUrl: string,
+  ): Promise<UserInfo> {
     if (!accessToken || !accessToken.trim()) {
-      throw new Error('Invalid access token');
+      throw new Error("Invalid access token");
     }
     if (!SUPABASE_KEY) {
-      throw new Error('VITE_SUPABASE_PUBLISHABLE_DEFAULT_KEY is not configured');
+      throw new Error(
+        "VITE_SUPABASE_PUBLISHABLE_DEFAULT_KEY is not configured",
+      );
     }
 
     await this.saveTokenEverywhere(accessToken);
 
     const userInfo = await this.fetchSupabaseUserInfo(serverUrl, accessToken);
 
-    await invoke('save_user_info', {
+    await invoke("save_user_info", {
       username: userInfo.username,
       email: userInfo.email || null,
     });
 
-    this.setAuthStatus('authenticated', userInfo);
+    this.setAuthStatus("authenticated", userInfo);
     return userInfo;
   }
 
   async signUpSaas(email: string, password: string): Promise<void> {
     if (!STIRLING_SAAS_URL) {
-      throw new Error('VITE_SAAS_SERVER_URL is not configured');
+      throw new Error("VITE_SAAS_SERVER_URL is not configured");
     }
     if (!SUPABASE_KEY) {
-      throw new Error('VITE_SUPABASE_PUBLISHABLE_DEFAULT_KEY is not configured');
+      throw new Error(
+        "VITE_SUPABASE_PUBLISHABLE_DEFAULT_KEY is not configured",
+      );
     }
 
     const redirectParam = encodeURIComponent(DESKTOP_DEEP_LINK_CALLBACK);
-    const signupUrl = `${STIRLING_SAAS_URL.replace(/\/$/, '')}/auth/v1/signup?redirect_to=${redirectParam}`;
+    const signupUrl = `${STIRLING_SAAS_URL.replace(/\/$/, "")}/auth/v1/signup?redirect_to=${redirectParam}`;
 
     try {
       const response = await axios.post(
@@ -246,15 +292,15 @@ export class AuthService {
         { email, password, email_redirect_to: DESKTOP_DEEP_LINK_CALLBACK },
         {
           headers: {
-            'Content-Type': 'application/json;charset=UTF-8',
+            "Content-Type": "application/json;charset=UTF-8",
             apikey: SUPABASE_KEY,
             Authorization: `Bearer ${SUPABASE_KEY}`,
           },
-        }
+        },
       );
 
       if (response.status >= 400) {
-        throw new Error('Sign up failed');
+        throw new Error("Sign up failed");
       }
     } catch (error) {
       if (axios.isAxiosError(error)) {
@@ -263,26 +309,35 @@ export class AuthService {
           error.response?.data?.msg ||
           error.response?.data?.message ||
           error.message;
-        throw new Error(message || 'Sign up failed', { cause: error });
+        throw new Error(message || "Sign up failed", { cause: error });
       }
-      throw error instanceof Error ? error : new Error('Sign up failed', { cause: error });
+      throw error instanceof Error
+        ? error
+        : new Error("Sign up failed", { cause: error });
     }
   }
 
-  async login(serverUrl: string, username: string, password: string, mfaCode?: string): Promise<UserInfo> {
+  async login(
+    serverUrl: string,
+    username: string,
+    password: string,
+    mfaCode?: string,
+  ): Promise<UserInfo> {
     try {
       // Validate SaaS configuration if connecting to SaaS
       if (serverUrl === STIRLING_SAAS_URL) {
         if (!STIRLING_SAAS_URL) {
-          throw new Error('VITE_SAAS_SERVER_URL is not configured');
+          throw new Error("VITE_SAAS_SERVER_URL is not configured");
         }
         if (!SUPABASE_KEY) {
-          throw new Error('VITE_SUPABASE_PUBLISHABLE_DEFAULT_KEY is not configured');
+          throw new Error(
+            "VITE_SUPABASE_PUBLISHABLE_DEFAULT_KEY is not configured",
+          );
         }
       }
 
       // Call Rust login command (bypasses CORS)
-      const response = await invoke<LoginResponse>('login', {
+      const response = await invoke<LoginResponse>("login", {
         serverUrl,
         username,
         password,
@@ -297,12 +352,14 @@ export class AuthService {
       try {
         await this.saveTokenEverywhere(token);
       } catch (error) {
-        console.error('[Desktop AuthService] Failed to save token:', error);
-        throw new Error('Failed to save authentication token', { cause: error });
+        console.error("[Desktop AuthService] Failed to save token:", error);
+        throw new Error("Failed to save authentication token", {
+          cause: error,
+        });
       }
 
       // Save user info to store
-      await invoke('save_user_info', {
+      await invoke("save_user_info", {
         username: returnedUsername || username,
         email,
       });
@@ -312,78 +369,122 @@ export class AuthService {
         email: email || undefined,
       };
 
-      this.setAuthStatus('authenticated', userInfo);
+      this.setAuthStatus("authenticated", userInfo);
 
       return userInfo;
     } catch (error) {
-      console.error('[Desktop AuthService] Login failed:', error);
+      console.error("[Desktop AuthService] Login failed:", error);
 
       // Provide more detailed error messages based on the error type
-      if (error instanceof Error || typeof error === 'string') {
-        const rawMessage = typeof error === 'string' ? error : error.message;
+      if (error instanceof Error || typeof error === "string") {
+        const rawMessage = typeof error === "string" ? error : error.message;
         const errMsg = rawMessage.toLowerCase();
 
-        if (errMsg.includes('mfa_required')) {
-          this.setAuthStatus('unauthenticated', null);
-          throw new AuthServiceError('Two-factor code required.', 'mfa_required');
+        if (errMsg.includes("mfa_required")) {
+          this.setAuthStatus("unauthenticated", null);
+          throw new AuthServiceError(
+            "Two-factor code required.",
+            "mfa_required",
+          );
         }
 
-        if (errMsg.includes('invalid_mfa_code')) {
-          this.setAuthStatus('unauthenticated', null);
-          throw new AuthServiceError('Invalid two-factor code.', 'invalid_mfa_code');
+        if (errMsg.includes("invalid_mfa_code")) {
+          this.setAuthStatus("unauthenticated", null);
+          throw new AuthServiceError(
+            "Invalid two-factor code.",
+            "invalid_mfa_code",
+          );
         }
 
         // Authentication errors
-        if (errMsg.includes('401') || errMsg.includes('unauthorized') || errMsg.includes('invalid credentials')) {
-          this.setAuthStatus('unauthenticated', null);
-          throw new Error('Invalid username or password. Please check your credentials and try again.', {
-            cause: error,
-          });
+        if (
+          errMsg.includes("401") ||
+          errMsg.includes("unauthorized") ||
+          errMsg.includes("invalid credentials")
+        ) {
+          this.setAuthStatus("unauthenticated", null);
+          throw new Error(
+            "Invalid username or password. Please check your credentials and try again.",
+            {
+              cause: error,
+            },
+          );
         }
         // Server not found or unreachable
-        else if (errMsg.includes('connection refused') || errMsg.includes('econnrefused')) {
-          this.setAuthStatus('unauthenticated', null);
-          throw new Error('Cannot connect to server. Please check the server URL and ensure the server is running.', {
-            cause: error,
-          });
+        else if (
+          errMsg.includes("connection refused") ||
+          errMsg.includes("econnrefused")
+        ) {
+          this.setAuthStatus("unauthenticated", null);
+          throw new Error(
+            "Cannot connect to server. Please check the server URL and ensure the server is running.",
+            {
+              cause: error,
+            },
+          );
         }
         // Timeout
-        else if (errMsg.includes('timeout') || errMsg.includes('timed out')) {
-          this.setAuthStatus('unauthenticated', null);
-          throw new Error('Login request timed out. Please check your network connection and try again.', {
-            cause: error,
-          });
+        else if (errMsg.includes("timeout") || errMsg.includes("timed out")) {
+          this.setAuthStatus("unauthenticated", null);
+          throw new Error(
+            "Login request timed out. Please check your network connection and try again.",
+            {
+              cause: error,
+            },
+          );
         }
         // DNS failure
-        else if (errMsg.includes('getaddrinfo') || errMsg.includes('dns') || errMsg.includes('not found') || errMsg.includes('enotfound')) {
-          this.setAuthStatus('unauthenticated', null);
-          throw new Error('Cannot resolve server address. Please check the server URL is correct.', { cause: error });
+        else if (
+          errMsg.includes("getaddrinfo") ||
+          errMsg.includes("dns") ||
+          errMsg.includes("not found") ||
+          errMsg.includes("enotfound")
+        ) {
+          this.setAuthStatus("unauthenticated", null);
+          throw new Error(
+            "Cannot resolve server address. Please check the server URL is correct.",
+            { cause: error },
+          );
         }
         // SSL/TLS errors
-        else if (errMsg.includes('ssl') || errMsg.includes('tls') || errMsg.includes('certificate') || errMsg.includes('cert')) {
-          this.setAuthStatus('unauthenticated', null);
-          throw new Error('SSL/TLS certificate error. Server may have an invalid or self-signed certificate.', {
-            cause: error,
-          });
+        else if (
+          errMsg.includes("ssl") ||
+          errMsg.includes("tls") ||
+          errMsg.includes("certificate") ||
+          errMsg.includes("cert")
+        ) {
+          this.setAuthStatus("unauthenticated", null);
+          throw new Error(
+            "SSL/TLS certificate error. Server may have an invalid or self-signed certificate.",
+            {
+              cause: error,
+            },
+          );
         }
         // 404 - endpoint not found
-        else if (errMsg.includes('404') || errMsg.includes('not found')) {
-          this.setAuthStatus('unauthenticated', null);
-          throw new Error('Login endpoint not found. Please ensure you are connecting to a valid Stirling PDF server.', {
-            cause: error,
-          });
+        else if (errMsg.includes("404") || errMsg.includes("not found")) {
+          this.setAuthStatus("unauthenticated", null);
+          throw new Error(
+            "Login endpoint not found. Please ensure you are connecting to a valid Stirling PDF server.",
+            {
+              cause: error,
+            },
+          );
         }
         // 403 - security disabled
-        else if (errMsg.includes('403') || errMsg.includes('forbidden')) {
-          this.setAuthStatus('unauthenticated', null);
-          throw new Error('Login is not enabled on this server. Please enable security mode (DOCKER_ENABLE_SECURITY=true).', {
-            cause: error,
-          });
+        else if (errMsg.includes("403") || errMsg.includes("forbidden")) {
+          this.setAuthStatus("unauthenticated", null);
+          throw new Error(
+            "Login is not enabled on this server. Please enable security mode (DOCKER_ENABLE_SECURITY=true).",
+            {
+              cause: error,
+            },
+          );
         }
       }
 
       // Generic error fallback
-      this.setAuthStatus('unauthenticated', null);
+      this.setAuthStatus("unauthenticated", null);
       throw error;
     }
   }
@@ -400,13 +501,17 @@ export class AuthService {
     try {
       // Best-effort backend logout so any server-side session/cookies are cleared
       try {
-        const currentConfig = await connectionModeService.getCurrentConfig().catch(() => null);
+        const currentConfig = await connectionModeService
+          .getCurrentConfig()
+          .catch(() => null);
         const serverUrl = currentConfig?.server_config?.url;
         const token = await this.getAuthToken();
 
         if (serverUrl && token) {
-          const base = serverUrl.replace(/\/+$/, '');
-          const headers: Record<string, string> = { Authorization: `Bearer ${token}` };
+          const base = serverUrl.replace(/\/+$/, "");
+          const headers: Record<string, string> = {
+            Authorization: `Bearer ${token}`,
+          };
 
           // Treat 401/403 as benign (session already expired)
           const safePost = async (url: string) => {
@@ -417,10 +522,15 @@ export class AuthService {
                 validateStatus: () => true, // handle status manually
               });
               if (resp.status >= 400 && ![401, 403].includes(resp.status)) {
-                console.warn(`[Desktop AuthService] Logout call to ${url} failed: ${resp.status}`);
+                console.warn(
+                  `[Desktop AuthService] Logout call to ${url} failed: ${resp.status}`,
+                );
               }
             } catch (err) {
-              console.warn(`[Desktop AuthService] Backend logout failed via ${url}`, err);
+              console.warn(
+                `[Desktop AuthService] Backend logout failed via ${url}`,
+                err,
+              );
             }
           };
 
@@ -430,20 +540,23 @@ export class AuthService {
           await safePost(`${base}/logout`);
         }
       } catch (err) {
-        console.warn('[Desktop AuthService] Failed to call backend logout endpoint', err);
+        console.warn(
+          "[Desktop AuthService] Failed to call backend logout endpoint",
+          err,
+        );
       }
 
       // Clear token from all storage locations
       await this.clearTokenEverywhere();
 
       // Clear user info from Tauri store
-      await invoke('clear_user_info');
+      await invoke("clear_user_info");
 
-      this.setAuthStatus('unauthenticated', null);
+      this.setAuthStatus("unauthenticated", null);
     } catch (error) {
-      console.error('Error during logout:', error);
+      console.error("Error during logout:", error);
       // Still set status to unauthenticated even if clear fails
-      this.setAuthStatus('unauthenticated', null);
+      this.setAuthStatus("unauthenticated", null);
       // Still try to clear token
       await this.clearTokenEverywhere().catch(() => {});
     }
@@ -457,33 +570,39 @@ export class AuthService {
         // Health checks run every 5s, so 30s leeway would cause 5-6 unnecessary cache clears
         // The 30s leeway is used elsewhere for proactive refresh before user operations
         if (this.isTokenExpiringSoon(this.cachedToken, 5)) {
-          console.warn('[Desktop AuthService] ⚠� Cached token is expired or expiring soon, invalidating cache');
+          console.warn(
+            "[Desktop AuthService] ⚠� Cached token is expired or expiring soon, invalidating cache",
+          );
           this.cachedToken = null;
           // Fall through to fetch from storage
         } else {
-          console.debug('[Desktop AuthService] ✅ Returning cached token');
+          console.debug("[Desktop AuthService] ✅ Returning cached token");
           return this.cachedToken;
         }
       }
 
-      console.debug('[Desktop AuthService] Cache miss, fetching from storage...');
+      console.debug(
+        "[Desktop AuthService] Cache miss, fetching from storage...",
+      );
       const token = await this.getTokenFromAnySource();
 
       // Cache token if found (backend will validate expiry)
       if (token && token.trim().length > 0) {
         if (this.shouldSimulateExpiredJwt()) {
           console.warn(
-            '[Desktop AuthService] DEV: VITE_DEV_SIMULATE_EXPIRED_JWT — ignoring stored access token (simulates expiry)'
+            "[Desktop AuthService] DEV: VITE_DEV_SIMULATE_EXPIRED_JWT — ignoring stored access token (simulates expiry)",
           );
           return null;
         }
         this.cachedToken = token;
-        console.log('[Desktop AuthService] ✅ Token cached in memory after retrieval');
+        console.log(
+          "[Desktop AuthService] ✅ Token cached in memory after retrieval",
+        );
         return token;
       }
       return null;
     } catch (error) {
-      console.error('[Desktop AuthService] Failed to get auth token:', error);
+      console.error("[Desktop AuthService] Failed to get auth token:", error);
       return null;
     }
   }
@@ -495,22 +614,31 @@ export class AuthService {
 
   async getUserInfo(): Promise<UserInfo | null> {
     if (this.userInfo) {
-      console.log('[Desktop AuthService] Using cached user info:', this.userInfo.username);
+      console.log(
+        "[Desktop AuthService] Using cached user info:",
+        this.userInfo.username,
+      );
       return this.userInfo;
     }
 
     try {
-      console.log('[Desktop AuthService] Retrieving user info from store...');
-      const userInfo = await invoke<UserInfo | null>('get_user_info');
+      console.log("[Desktop AuthService] Retrieving user info from store...");
+      const userInfo = await invoke<UserInfo | null>("get_user_info");
       if (userInfo) {
-        console.log('[Desktop AuthService] User info found:', userInfo.username);
+        console.log(
+          "[Desktop AuthService] User info found:",
+          userInfo.username,
+        );
         this.userInfo = userInfo;
       } else {
-        console.log('[Desktop AuthService] No user info in store');
+        console.log("[Desktop AuthService] No user info in store");
       }
       return userInfo;
     } catch (error) {
-      console.error('[Desktop AuthService] Failed to get user info from store:', error);
+      console.error(
+        "[Desktop AuthService] Failed to get user info from store:",
+        error,
+      );
       return null;
     }
   }
@@ -520,10 +648,15 @@ export class AuthService {
       return false;
     }
     try {
-      console.debug('[Desktop AuthService] Waiting for in-flight refresh to complete');
+      console.debug(
+        "[Desktop AuthService] Waiting for in-flight refresh to complete",
+      );
       return await this.refreshPromise;
     } catch (error) {
-      console.warn('[Desktop AuthService] In-flight refresh failed while waiting', error);
+      console.warn(
+        "[Desktop AuthService] In-flight refresh failed while waiting",
+        error,
+      );
       return false;
     }
   }
@@ -531,27 +664,29 @@ export class AuthService {
   isTokenExpiringSoon(token: string, leewaySeconds = 30): boolean {
     if (this.shouldSimulateExpiredJwt()) {
       console.warn(
-        '[Desktop AuthService] DEV: VITE_DEV_SIMULATE_EXPIRED_JWT — treating token as expired (isTokenExpiringSoon)'
+        "[Desktop AuthService] DEV: VITE_DEV_SIMULATE_EXPIRED_JWT — treating token as expired (isTokenExpiringSoon)",
       );
       return true;
     }
     try {
-      const parts = token.split('.');
+      const parts = token.split(".");
       if (parts.length < 2) {
-        console.warn('[Desktop AuthService] Token malformed - less than 2 parts');
+        console.warn(
+          "[Desktop AuthService] Token malformed - less than 2 parts",
+        );
         return true;
       }
 
       const base64Url = parts[1];
       const base64 = base64Url
-        .replace(/-/g, '+')
-        .replace(/_/g, '/')
-        .padEnd(Math.ceil(base64Url.length / 4) * 4, '=');
+        .replace(/-/g, "+")
+        .replace(/_/g, "/")
+        .padEnd(Math.ceil(base64Url.length / 4) * 4, "=");
       const payload = JSON.parse(atob(base64));
-      const expSeconds = typeof payload?.exp === 'number' ? payload.exp : 0;
+      const expSeconds = typeof payload?.exp === "number" ? payload.exp : 0;
 
       if (!expSeconds) {
-        console.warn('[Desktop AuthService] Token has no exp claim');
+        console.warn("[Desktop AuthService] Token has no exp claim");
         return true;
       }
 
@@ -560,16 +695,16 @@ export class AuthService {
       const timeUntilExpiry = expSeconds - nowSeconds;
       const isExpiring = expSeconds <= nowWithLeeway;
 
-      console.debug('[Desktop AuthService] Token expiry check:', {
-        expiresIn: timeUntilExpiry + 's',
-        leeway: leewaySeconds + 's',
-        isExpiring
+      console.debug("[Desktop AuthService] Token expiry check:", {
+        expiresIn: timeUntilExpiry + "s",
+        leeway: leewaySeconds + "s",
+        isExpiring,
       });
 
       return isExpiring;
     } catch (err) {
       // If parsing fails, treat token as unsafe/stale and force refresh path.
-      console.warn('[Desktop AuthService] Token parsing failed:', err);
+      console.warn("[Desktop AuthService] Token parsing failed:", err);
       return true;
     }
   }
@@ -577,7 +712,9 @@ export class AuthService {
   async refreshToken(serverUrl: string): Promise<boolean> {
     // Prevent concurrent refresh attempts - reuse in-flight refresh
     if (this.refreshPromise) {
-      console.log('[Desktop AuthService] Refresh already in progress, awaiting existing refresh');
+      console.log(
+        "[Desktop AuthService] Refresh already in progress, awaiting existing refresh",
+      );
       return this.refreshPromise;
     }
 
@@ -591,12 +728,12 @@ export class AuthService {
 
   private async _doRefreshToken(serverUrl: string): Promise<boolean> {
     try {
-      console.log('[Desktop AuthService] Refreshing auth token');
-      this.setAuthStatus('refreshing', this.userInfo);
+      console.log("[Desktop AuthService] Refreshing auth token");
+      this.setAuthStatus("refreshing", this.userInfo);
 
       const currentToken = await this.getAuthToken();
       if (!currentToken) {
-        this.setAuthStatus('unauthenticated', null);
+        this.setAuthStatus("unauthenticated", null);
         return false;
       }
 
@@ -609,7 +746,7 @@ export class AuthService {
           headers: {
             Authorization: `Bearer ${currentToken}`,
           },
-        }
+        },
       );
 
       const token =
@@ -618,8 +755,10 @@ export class AuthService {
         response.data?.token;
 
       if (!token) {
-        console.error('[Desktop AuthService] Refresh response missing token payload');
-        this.setAuthStatus('unauthenticated', null);
+        console.error(
+          "[Desktop AuthService] Refresh response missing token payload",
+        );
+        this.setAuthStatus("unauthenticated", null);
         await this.logout();
         return false;
       }
@@ -628,13 +767,13 @@ export class AuthService {
       await this.saveTokenEverywhere(token, undefined, false);
 
       const userInfo = await this.getUserInfo();
-      this.setAuthStatus('authenticated', userInfo);
+      this.setAuthStatus("authenticated", userInfo);
 
-      console.log('[Desktop AuthService] Token refreshed successfully');
+      console.log("[Desktop AuthService] Token refreshed successfully");
       return true;
     } catch (error) {
-      console.error('[Desktop AuthService] Token refresh failed:', error);
-      this.setAuthStatus('unauthenticated', null);
+      console.error("[Desktop AuthService] Token refresh failed:", error);
+      this.setAuthStatus("unauthenticated", null);
 
       // Clear stored credentials on refresh failure
       await this.logout();
@@ -646,7 +785,9 @@ export class AuthService {
   async refreshSupabaseToken(authServerUrl: string): Promise<boolean> {
     // Prevent concurrent refresh attempts - reuse in-flight refresh
     if (this.refreshPromise) {
-      console.log('[Desktop AuthService] Refresh already in progress, awaiting existing refresh');
+      console.log(
+        "[Desktop AuthService] Refresh already in progress, awaiting existing refresh",
+      );
       return this.refreshPromise;
     }
 
@@ -658,15 +799,17 @@ export class AuthService {
     }
   }
 
-  private async _doRefreshSupabaseToken(authServerUrl: string): Promise<boolean> {
+  private async _doRefreshSupabaseToken(
+    authServerUrl: string,
+  ): Promise<boolean> {
     try {
-      console.log('[Desktop AuthService] Refreshing Supabase token');
-      this.setAuthStatus('refreshing', this.userInfo);
+      console.log("[Desktop AuthService] Refreshing Supabase token");
+      this.setAuthStatus("refreshing", this.userInfo);
 
       const refreshToken = await this.getRefreshToken();
       if (!refreshToken) {
-        console.error('[Desktop AuthService] No refresh token available');
-        this.setAuthStatus('unauthenticated', null);
+        console.error("[Desktop AuthService] No refresh token available");
+        this.setAuthStatus("unauthenticated", null);
         return false;
       }
 
@@ -678,10 +821,10 @@ export class AuthService {
         },
         {
           headers: {
-            'apikey': SUPABASE_KEY,
-            'Content-Type': 'application/json',
+            apikey: SUPABASE_KEY,
+            "Content-Type": "application/json",
           },
-        }
+        },
       );
 
       const { access_token, refresh_token: newRefreshToken } = response.data;
@@ -690,13 +833,18 @@ export class AuthService {
       await this.saveTokenEverywhere(access_token, newRefreshToken, false);
 
       const userInfo = await this.getUserInfo();
-      this.setAuthStatus('authenticated', userInfo);
+      this.setAuthStatus("authenticated", userInfo);
 
-      console.log('[Desktop AuthService] Supabase token refreshed successfully');
+      console.log(
+        "[Desktop AuthService] Supabase token refreshed successfully",
+      );
       return true;
     } catch (error) {
-      console.error('[Desktop AuthService] Supabase token refresh failed:', error);
-      this.setAuthStatus('unauthenticated', null);
+      console.error(
+        "[Desktop AuthService] Supabase token refresh failed:",
+        error,
+      );
+      this.setAuthStatus("unauthenticated", null);
 
       // Clear stored credentials on refresh failure
       await this.logout();
@@ -706,30 +854,42 @@ export class AuthService {
   }
 
   async initializeAuthState(): Promise<void> {
-    console.log('[Desktop AuthService] Initializing auth state...');
+    console.log("[Desktop AuthService] Initializing auth state...");
     // If we are on the login/setup screen, don't auto-restore a previous session; clear instead
-    const path = typeof window !== 'undefined' ? window.location.pathname : '';
-    if (path.startsWith('/login') || path.startsWith('/setup')) {
+    const path = typeof window !== "undefined" ? window.location.pathname : "";
+    if (path.startsWith("/login") || path.startsWith("/setup")) {
       // Check if token exists in storage (user just logged in via web flow)
-      const tokenInStorage = typeof window !== 'undefined' ? localStorage.getItem('stirling_jwt') : null;
+      const tokenInStorage =
+        typeof window !== "undefined"
+          ? localStorage.getItem("stirling_jwt")
+          : null;
       if (tokenInStorage) {
-        console.log('[Desktop AuthService] On login/setup path with token present - skipping validation');
-        console.log('[Desktop AuthService] Login flow will handle authentication state');
+        console.log(
+          "[Desktop AuthService] On login/setup path with token present - skipping validation",
+        );
+        console.log(
+          "[Desktop AuthService] Login flow will handle authentication state",
+        );
         // Return early to avoid clearing partial state during login completion
         // The login completion handler (completeSelfHostedSession) will:
         // 1. Fetch and save user info
         // 2. Set auth status to authenticated
         return;
       } else {
-        console.log('[Desktop AuthService] On login/setup path, clearing any cached auth');
+        console.log(
+          "[Desktop AuthService] On login/setup path, clearing any cached auth",
+        );
         // Local clear only; avoid backend logout to prevent noisy errors when already unauthenticated
         await this.clearTokenEverywhere().catch(() => {});
         try {
-          await invoke('clear_user_info');
+          await invoke("clear_user_info");
         } catch (err) {
-          console.warn('[Desktop AuthService] Failed to clear user info on login/setup init', err);
+          console.warn(
+            "[Desktop AuthService] Failed to clear user info on login/setup init",
+            err,
+          );
         }
-        this.setAuthStatus('unauthenticated', null);
+        this.setAuthStatus("unauthenticated", null);
         return;
       }
     }
@@ -738,13 +898,17 @@ export class AuthService {
     const userInfo = await this.getUserInfo();
 
     if (token && userInfo) {
-      console.log('[Desktop AuthService] Found existing token and user info');
-      this.setAuthStatus('authenticated', userInfo);
-      console.log('[Desktop AuthService] Auth state initialized as authenticated');
+      console.log("[Desktop AuthService] Found existing token and user info");
+      this.setAuthStatus("authenticated", userInfo);
+      console.log(
+        "[Desktop AuthService] Auth state initialized as authenticated",
+      );
     } else {
-      console.log('[Desktop AuthService] No token or user info found');
-      this.setAuthStatus('unauthenticated', null);
-      console.log('[Desktop AuthService] Auth state initialized as unauthenticated');
+      console.log("[Desktop AuthService] No token or user info found");
+      this.setAuthStatus("unauthenticated", null);
+      console.log(
+        "[Desktop AuthService] Auth state initialized as unauthenticated",
+      );
 
       // Defensive: ensure any partial tokens are purged to prevent auto-login loops.
       // Skip when simulating expiry — the token is real and must not be destroyed.
@@ -757,14 +921,24 @@ export class AuthService {
   /**
    * Start OAuth login flow by opening system browser with localhost callback
    */
-  async loginWithOAuth(provider: string, authServerUrl: string, successHtml: string, errorHtml: string): Promise<UserInfo> {
+  async loginWithOAuth(
+    provider: string,
+    authServerUrl: string,
+    successHtml: string,
+    errorHtml: string,
+  ): Promise<UserInfo> {
     try {
-      console.log('[Desktop AuthService] Starting OAuth login with provider:', provider);
-      this.setAuthStatus('oauth_pending', null);
+      console.log(
+        "[Desktop AuthService] Starting OAuth login with provider:",
+        provider,
+      );
+      this.setAuthStatus("oauth_pending", null);
 
       // Validate Supabase key is configured for OAuth
       if (!SUPABASE_KEY) {
-        throw new Error('VITE_SUPABASE_PUBLISHABLE_DEFAULT_KEY is not configured');
+        throw new Error(
+          "VITE_SUPABASE_PUBLISHABLE_DEFAULT_KEY is not configured",
+        );
       }
 
       // Call Rust command which:
@@ -772,7 +946,7 @@ export class AuthService {
       // 2. Opens browser to OAuth provider
       // 3. Waits for callback
       // 4. Returns tokens
-      const result = await invoke<OAuthCallbackResult>('start_oauth_login', {
+      const result = await invoke<OAuthCallbackResult>("start_oauth_login", {
         provider,
         authServerUrl,
         supabaseKey: SUPABASE_KEY,
@@ -780,30 +954,47 @@ export class AuthService {
         errorHtml,
       });
 
-      console.log('[Desktop AuthService] OAuth authentication successful, storing tokens');
-      console.log('[Desktop AuthService] OAuth result - has access_token:', !!result.access_token);
-      console.log('[Desktop AuthService] OAuth result - has refresh_token:', !!result.refresh_token);
-      console.log('[Desktop AuthService] OAuth result - expires_in:', result.expires_in);
+      console.log(
+        "[Desktop AuthService] OAuth authentication successful, storing tokens",
+      );
+      console.log(
+        "[Desktop AuthService] OAuth result - has access_token:",
+        !!result.access_token,
+      );
+      console.log(
+        "[Desktop AuthService] OAuth result - has refresh_token:",
+        !!result.refresh_token,
+      );
+      console.log(
+        "[Desktop AuthService] OAuth result - expires_in:",
+        result.expires_in,
+      );
 
       // Save token and refresh token to all storage locations
       await this.saveTokenEverywhere(result.access_token, result.refresh_token);
 
       // Fetch user info from Supabase using the access token
-      const userInfo = await this.fetchSupabaseUserInfo(authServerUrl, result.access_token);
+      const userInfo = await this.fetchSupabaseUserInfo(
+        authServerUrl,
+        result.access_token,
+      );
 
       // Save user info to store
-      await invoke('save_user_info', {
+      await invoke("save_user_info", {
         username: userInfo.username,
         email: userInfo.email || null,
       });
 
-      this.setAuthStatus('authenticated', userInfo);
-      console.log('[Desktop AuthService] OAuth login successful');
+      this.setAuthStatus("authenticated", userInfo);
+      console.log("[Desktop AuthService] OAuth login successful");
 
       return userInfo;
     } catch (error) {
-      console.error('[Desktop AuthService] Failed to complete OAuth login:', error);
-      this.setAuthStatus('unauthenticated', null);
+      console.error(
+        "[Desktop AuthService] Failed to complete OAuth login:",
+        error,
+      );
+      this.setAuthStatus("unauthenticated", null);
       throw error;
     }
   }
@@ -812,21 +1003,26 @@ export class AuthService {
    * Self-hosted SSO/OAuth2 flow for the desktop app.
 1   * Opens the system browser and waits for a deep link callback with the JWT.
    */
-  async loginWithSelfHostedOAuth(providerPath: string, serverUrl: string): Promise<UserInfo> {
+  async loginWithSelfHostedOAuth(
+    providerPath: string,
+    serverUrl: string,
+  ): Promise<UserInfo> {
     // Generate and store nonce for CSRF protection
     const nonce = crypto.randomUUID();
-    sessionStorage.setItem('oauth_nonce', nonce);
-    console.log('[Desktop AuthService] Generated OAuth nonce for CSRF protection');
+    sessionStorage.setItem("oauth_nonce", nonce);
+    console.log(
+      "[Desktop AuthService] Generated OAuth nonce for CSRF protection",
+    );
 
-    const trimmedServer = serverUrl.replace(/\/+$/, '');
-    const fullUrl = providerPath.startsWith('http')
+    const trimmedServer = serverUrl.replace(/\/+$/, "");
+    const fullUrl = providerPath.startsWith("http")
       ? providerPath
-      : `${trimmedServer}${providerPath.startsWith('/') ? providerPath : `/${providerPath}`}`;
+      : `${trimmedServer}${providerPath.startsWith("/") ? providerPath : `/${providerPath}`}`;
     let authUrl = fullUrl;
     try {
       const parsed = new URL(fullUrl);
-      parsed.searchParams.set('tauri', '1');
-      parsed.searchParams.set('nonce', nonce);
+      parsed.searchParams.set("tauri", "1");
+      parsed.searchParams.set("nonce", nonce);
       authUrl = parsed.toString();
     } catch {
       // ignore URL parsing failures
@@ -835,7 +1031,9 @@ export class AuthService {
     // Register deep-link listener before opening browser to avoid callback races on first launch.
     return this.waitForDeepLinkCompletion(trimmedServer, async () => {
       if (!(await this.openInSystemBrowser(authUrl))) {
-        throw new Error('Unable to open system browser for SSO. Please check your system settings.');
+        throw new Error(
+          "Unable to open system browser for SSO. Please check your system settings.",
+        );
       }
     });
   }
@@ -845,10 +1043,12 @@ export class AuthService {
    */
   private async waitForDeepLinkCompletion(
     serverUrl: string,
-    startFlow?: () => Promise<void>
+    startFlow?: () => Promise<void>,
   ): Promise<UserInfo> {
     if (!isTauri()) {
-      throw new Error('Deep link authentication is only supported in Tauri desktop app.');
+      throw new Error(
+        "Deep link authentication is only supported in Tauri desktop app.",
+      );
     }
 
     this.selfHostedDeepLinkFlowActive = true;
@@ -861,108 +1061,135 @@ export class AuthService {
         if (!completed) {
           completed = true;
           if (unlisten) unlisten();
-          sessionStorage.removeItem('oauth_nonce');
+          sessionStorage.removeItem("oauth_nonce");
           this.selfHostedDeepLinkFlowActive = false;
-          reject(new Error('SSO login timed out. Please try again.'));
+          reject(new Error("SSO login timed out. Please try again."));
         }
       }, 120_000);
 
-      listen<string>('deep-link', async (event) => {
+      listen<string>("deep-link", async (event) => {
         const url = event.payload;
         if (!url || completed) return;
         try {
           const parsed = new URL(url);
-          const hash = parsed.hash.replace(/^#/, '');
+          const hash = parsed.hash.replace(/^#/, "");
           const params = new URLSearchParams(hash);
-          const type = params.get('type') || parsed.searchParams.get('type');
-          const error = params.get('error') || parsed.searchParams.get('error');
-          if (type === 'sso-error' || error) {
+          const type = params.get("type") || parsed.searchParams.get("type");
+          const error = params.get("error") || parsed.searchParams.get("error");
+          if (type === "sso-error" || error) {
             completed = true;
             if (unlisten) unlisten();
             clearTimeout(timeoutId);
-            sessionStorage.removeItem('oauth_nonce');
+            sessionStorage.removeItem("oauth_nonce");
             this.selfHostedDeepLinkFlowActive = false;
-            reject(new Error(error || 'Authentication was not successful.'));
+            reject(new Error(error || "Authentication was not successful."));
             return;
           }
-          if (type !== 'sso' && type !== 'sso-selfhosted') {
+          if (type !== "sso" && type !== "sso-selfhosted") {
             return;
           }
-          const token = params.get('access_token') || parsed.searchParams.get('access_token');
+          const token =
+            params.get("access_token") ||
+            parsed.searchParams.get("access_token");
           if (!token) {
             return;
           }
 
           // CSRF Protection: Validate nonce before accepting token
-          const nonceFromUrl = params.get('nonce') || parsed.searchParams.get('nonce');
-          const storedNonce = sessionStorage.getItem('oauth_nonce');
+          const nonceFromUrl =
+            params.get("nonce") || parsed.searchParams.get("nonce");
+          const storedNonce = sessionStorage.getItem("oauth_nonce");
 
           if (!nonceFromUrl || !storedNonce || nonceFromUrl !== storedNonce) {
             completed = true;
             if (unlisten) unlisten();
             clearTimeout(timeoutId);
-            sessionStorage.removeItem('oauth_nonce');
+            sessionStorage.removeItem("oauth_nonce");
             this.selfHostedDeepLinkFlowActive = false;
-            console.error('[Desktop AuthService] Nonce validation failed - potential CSRF attack');
-            reject(new Error('Invalid authentication state. Nonce validation failed.'));
+            console.error(
+              "[Desktop AuthService] Nonce validation failed - potential CSRF attack",
+            );
+            reject(
+              new Error(
+                "Invalid authentication state. Nonce validation failed.",
+              ),
+            );
             return;
           }
 
           completed = true;
           if (unlisten) unlisten();
           clearTimeout(timeoutId);
-          sessionStorage.removeItem('oauth_nonce');
+          sessionStorage.removeItem("oauth_nonce");
           this.selfHostedDeepLinkFlowActive = false;
-          console.log('[Desktop AuthService] Nonce validated successfully');
+          console.log("[Desktop AuthService] Nonce validated successfully");
 
-          const userInfo = await this.completeSelfHostedSession(serverUrl, token);
+          const userInfo = await this.completeSelfHostedSession(
+            serverUrl,
+            token,
+          );
           // Ensure connection mode is set and backend is ready (in case caller doesn't)
           try {
             await connectionModeService.switchToSelfHosted({ url: serverUrl });
             await tauriBackendService.initializeExternalBackend();
           } catch (e) {
-            console.warn('[Desktop AuthService] Failed to initialize backend after deep link:', e);
+            console.warn(
+              "[Desktop AuthService] Failed to initialize backend after deep link:",
+              e,
+            );
           }
           resolve(userInfo);
         } catch (err) {
           completed = true;
           if (unlisten) unlisten();
           clearTimeout(timeoutId);
-          sessionStorage.removeItem('oauth_nonce');
+          sessionStorage.removeItem("oauth_nonce");
           this.selfHostedDeepLinkFlowActive = false;
-          reject(err instanceof Error ? err : new Error('Failed to complete SSO'));
+          reject(
+            err instanceof Error ? err : new Error("Failed to complete SSO"),
+          );
         }
-      }).then(async (fn) => {
-        unlisten = fn;
+      })
+        .then(async (fn) => {
+          unlisten = fn;
 
-        if (!startFlow || completed) {
-          return;
-        }
+          if (!startFlow || completed) {
+            return;
+          }
 
-        try {
-          await startFlow();
-        } catch (err) {
+          try {
+            await startFlow();
+          } catch (err) {
+            if (completed) {
+              return;
+            }
+            completed = true;
+            if (unlisten) unlisten();
+            clearTimeout(timeoutId);
+            sessionStorage.removeItem("oauth_nonce");
+            this.selfHostedDeepLinkFlowActive = false;
+            reject(
+              err instanceof Error
+                ? err
+                : new Error("Failed to start SSO login"),
+            );
+          }
+        })
+        .catch((err) => {
           if (completed) {
             return;
           }
           completed = true;
           if (unlisten) unlisten();
           clearTimeout(timeoutId);
-          sessionStorage.removeItem('oauth_nonce');
+          sessionStorage.removeItem("oauth_nonce");
           this.selfHostedDeepLinkFlowActive = false;
-          reject(err instanceof Error ? err : new Error('Failed to start SSO login'));
-        }
-      }).catch((err) => {
-        if (completed) {
-          return;
-        }
-        completed = true;
-        if (unlisten) unlisten();
-        clearTimeout(timeoutId);
-        sessionStorage.removeItem('oauth_nonce');
-        this.selfHostedDeepLinkFlowActive = false;
-        reject(err instanceof Error ? err : new Error('Failed to listen for deep link events'));
-      });
+          reject(
+            err instanceof Error
+              ? err
+              : new Error("Failed to listen for deep link events"),
+          );
+        });
     });
   }
 
@@ -975,7 +1202,7 @@ export class AuthService {
       await shellOpen(url);
       return true;
     } catch (err) {
-      console.error('Failed to open system browser for SSO:', err);
+      console.error("Failed to open system browser for SSO:", err);
       return false;
     }
   }
@@ -983,39 +1210,48 @@ export class AuthService {
   /**
    * Save JWT + user info for self-hosted SSO logins
    */
-  async completeSelfHostedSession(serverUrl: string, token: string): Promise<UserInfo> {
+  async completeSelfHostedSession(
+    serverUrl: string,
+    token: string,
+  ): Promise<UserInfo> {
     const userInfo = await this.fetchSelfHostedUserInfo(serverUrl, token);
 
     await this.saveTokenEverywhere(token);
-    await invoke('save_user_info', {
+    await invoke("save_user_info", {
       username: userInfo.username,
       email: userInfo.email || null,
     });
 
-    this.setAuthStatus('authenticated', userInfo);
+    this.setAuthStatus("authenticated", userInfo);
     return userInfo;
   }
 
-  private async fetchSelfHostedUserInfo(serverUrl: string, token: string): Promise<UserInfo> {
+  private async fetchSelfHostedUserInfo(
+    serverUrl: string,
+    token: string,
+  ): Promise<UserInfo> {
     try {
       const response = await axios.get(
-        `${serverUrl.replace(/\/+$/, '')}/api/v1/auth/me`,
+        `${serverUrl.replace(/\/+$/, "")}/api/v1/auth/me`,
         {
           headers: {
             Authorization: `Bearer ${token}`,
           },
-        }
+        },
       );
 
       const data = response.data;
       const user = data.user || data;
 
       return {
-        username: user.username || user.email || 'User',
+        username: user.username || user.email || "User",
         email: user.email || undefined,
       };
     } catch (error) {
-      console.error('[Desktop AuthService] Failed to fetch user info after SSO:', error);
+      console.error(
+        "[Desktop AuthService] Failed to fetch user info after SSO:",
+        error,
+      );
       throw error;
     }
   }
@@ -1023,34 +1259,36 @@ export class AuthService {
   /**
    * Fetch user info from Supabase using access token
    */
-  private async fetchSupabaseUserInfo(authServerUrl: string, accessToken: string): Promise<UserInfo> {
+  private async fetchSupabaseUserInfo(
+    authServerUrl: string,
+    accessToken: string,
+  ): Promise<UserInfo> {
     try {
       const userEndpoint = `${authServerUrl}/auth/v1/user`;
 
       const response = await axios.get(userEndpoint, {
         headers: {
           Authorization: `Bearer ${accessToken}`,
-          'apikey': SUPABASE_KEY,
+          apikey: SUPABASE_KEY,
         },
       });
 
       const data = response.data;
-      console.log('User info fetched:', data.email);
+      console.log("User info fetched:", data.email);
 
       return {
-        username: data.user_metadata?.full_name || data.email || 'Unknown',
+        username: data.user_metadata?.full_name || data.email || "Unknown",
         email: data.email,
       };
     } catch (error) {
-      console.error('Failed to fetch user info from Supabase:', error);
+      console.error("Failed to fetch user info from Supabase:", error);
       // Fallback to basic info
       return {
-        username: 'User',
+        username: "User",
         email: undefined,
       };
     }
   }
-
 }
 
 export const authService = AuthService.getInstance();
diff --git a/frontend/src/desktop/services/authTokenStore.ts b/frontend/src/desktop/services/authTokenStore.ts
index 648a1adfe6..c0839fd4d1 100644
--- a/frontend/src/desktop/services/authTokenStore.ts
+++ b/frontend/src/desktop/services/authTokenStore.ts
@@ -1,6 +1,6 @@
-import { invoke } from '@tauri-apps/api/core';
+import { invoke } from "@tauri-apps/api/core";
 
-const TOKEN_KEY = 'stirling_jwt';
+const TOKEN_KEY = "stirling_jwt";
 
 /**
  * Read auth token from any available source (Tauri store or localStorage).
@@ -9,19 +9,25 @@ const TOKEN_KEY = 'stirling_jwt';
 export async function getAuthTokenFromAnySource(): Promise<string | null> {
   // Try Tauri store first
   try {
-    const token = await invoke<string | null>('get_auth_token');
+    const token = await invoke<string | null>("get_auth_token");
     if (token) {
       return token;
     }
   } catch (error) {
-    console.error('[Desktop AuthTokenStore] Failed to read from Tauri store:', error);
+    console.error(
+      "[Desktop AuthTokenStore] Failed to read from Tauri store:",
+      error,
+    );
   }
 
   // Fallback to localStorage
   try {
     return localStorage.getItem(TOKEN_KEY);
   } catch (error) {
-    console.error('[Desktop AuthTokenStore] Failed to read from localStorage:', error);
+    console.error(
+      "[Desktop AuthTokenStore] Failed to read from localStorage:",
+      error,
+    );
     return null;
   }
 }
diff --git a/frontend/src/desktop/services/backendHealthMonitor.ts b/frontend/src/desktop/services/backendHealthMonitor.ts
index f53cecd90b..aeff42f47a 100644
--- a/frontend/src/desktop/services/backendHealthMonitor.ts
+++ b/frontend/src/desktop/services/backendHealthMonitor.ts
@@ -1,6 +1,6 @@
-import i18n from '@app/i18n';
-import { tauriBackendService } from '@app/services/tauriBackendService';
-import type { BackendHealthState } from '@app/types/backendHealth';
+import i18n from "@app/i18n";
+import { tauriBackendService } from "@app/services/tauriBackendService";
+import type { BackendHealthState } from "@app/types/backendHealth";
 
 type Listener = (state: BackendHealthState) => void;
 
@@ -11,7 +11,7 @@ class BackendHealthMonitor {
   private state: BackendHealthState = {
     status: tauriBackendService.getBackendStatus(),
     error: null,
-    isOnline: tauriBackendService.getBackendStatus() === 'healthy',
+    isOnline: tauriBackendService.getBackendStatus() === "healthy",
   };
 
   constructor(pollingInterval = 5000) {
@@ -21,10 +21,12 @@ class BackendHealthMonitor {
     tauriBackendService.subscribeToStatus((status) => {
       this.updateState({
         status,
-        error: status === 'healthy' ? null : this.state.error,
-        message: status === 'healthy'
-          ? i18n.t('backendHealth.online', 'Backend Online')
-          : this.state.message ?? i18n.t('backendHealth.offline', 'Backend Offline'),
+        error: status === "healthy" ? null : this.state.error,
+        message:
+          status === "healthy"
+            ? i18n.t("backendHealth.online", "Backend Online")
+            : (this.state.message ??
+              i18n.t("backendHealth.offline", "Backend Offline")),
       });
     });
   }
@@ -35,7 +37,7 @@ class BackendHealthMonitor {
       ...this.state,
       ...partial,
       status: nextStatus,
-      isOnline: nextStatus === 'healthy',
+      isOnline: nextStatus === "healthy",
     };
 
     // Only notify listeners if meaningful state changed
@@ -73,24 +75,24 @@ class BackendHealthMonitor {
       const healthy = await tauriBackendService.checkBackendHealth();
       if (healthy) {
         this.updateState({
-          status: 'healthy',
-          message: i18n.t('backendHealth.online', 'Backend Online'),
+          status: "healthy",
+          message: i18n.t("backendHealth.online", "Backend Online"),
           error: null,
         });
       } else {
         this.updateState({
-          status: 'unhealthy',
-          message: i18n.t('backendHealth.offline', 'Backend Offline'),
-          error: i18n.t('backendHealth.offline', 'Backend Offline'),
+          status: "unhealthy",
+          message: i18n.t("backendHealth.offline", "Backend Offline"),
+          error: i18n.t("backendHealth.offline", "Backend Offline"),
         });
       }
       return healthy;
     } catch (error) {
-      console.error('[BackendHealthMonitor] Health check failed:', error);
+      console.error("[BackendHealthMonitor] Health check failed:", error);
       this.updateState({
-        status: 'unhealthy',
-        message: 'Backend is unavailable',
-        error: 'Backend offline',
+        status: "unhealthy",
+        message: "Backend is unavailable",
+        error: "Backend offline",
       });
       return false;
     }
diff --git a/frontend/src/desktop/services/backendReadinessGuard.ts b/frontend/src/desktop/services/backendReadinessGuard.ts
index c69590ef06..3ce61b56f3 100644
--- a/frontend/src/desktop/services/backendReadinessGuard.ts
+++ b/frontend/src/desktop/services/backendReadinessGuard.ts
@@ -1,9 +1,9 @@
-import i18n from '@app/i18n';
-import { alert } from '@app/components/toast';
-import { tauriBackendService } from '@app/services/tauriBackendService';
-import { operationRouter } from '@app/services/operationRouter';
-import { connectionModeService } from '@app/services/connectionModeService';
-import { selfHostedServerMonitor } from '@app/services/selfHostedServerMonitor';
+import i18n from "@app/i18n";
+import { alert } from "@app/components/toast";
+import { tauriBackendService } from "@app/services/tauriBackendService";
+import { operationRouter } from "@app/services/operationRouter";
+import { connectionModeService } from "@app/services/connectionModeService";
+import { selfHostedServerMonitor } from "@app/services/selfHostedServerMonitor";
 
 const BACKEND_TOAST_COOLDOWN_MS = 4000;
 let lastBackendToast = 0;
@@ -25,30 +25,33 @@ let lastBackendToast = 0;
 export async function ensureBackendReady(endpoint?: string): Promise<boolean> {
   // Skip waiting if endpoint will be routed to SaaS backend
   if (endpoint) {
-    const skipCheck = await operationRouter.shouldSkipBackendReadyCheck(endpoint);
+    const skipCheck =
+      await operationRouter.shouldSkipBackendReadyCheck(endpoint);
     if (skipCheck) {
-      console.debug('[backendReadinessGuard] Skipping backend ready check (SaaS routing)');
+      console.debug(
+        "[backendReadinessGuard] Skipping backend ready check (SaaS routing)",
+      );
       return true;
     }
   }
 
   const mode = await connectionModeService.getCurrentMode();
-  if (mode === 'selfhosted') {
+  if (mode === "selfhosted") {
     let { status } = selfHostedServerMonitor.getSnapshot();
 
     // 'checking' means the first poll hasn't returned yet. Wait briefly (up to
     // 1.5 s) for it to resolve so we don't surface raw network errors during the
     // first few seconds after launch. If it doesn't resolve in time we fall
     // through and allow the operation — the HTTP layer will handle any error.
-    if (status === 'checking') {
+    if (status === "checking") {
       await Promise.race([
         selfHostedServerMonitor.checkNow(),
-        new Promise<void>(resolve => setTimeout(resolve, 1500)),
+        new Promise<void>((resolve) => setTimeout(resolve, 1500)),
       ]);
       status = selfHostedServerMonitor.getSnapshot().status;
     }
 
-    if (status === 'offline') {
+    if (status === "offline") {
       // Server offline: allow through if local backend port is known.
       // operationRouter will route to local for supported endpoints.
       // Suppress the toast — SelfHostedOfflineBanner communicates the outage.
@@ -73,9 +76,9 @@ export async function ensureBackendReady(endpoint?: string): Promise<boolean> {
   if (now - lastBackendToast > BACKEND_TOAST_COOLDOWN_MS) {
     lastBackendToast = now;
     alert({
-      alertType: 'error',
-      title: i18n.t('backendHealth.offline', 'Backend Offline'),
-      body: i18n.t('backendHealth.checking', 'Checking backend status...'),
+      alertType: "error",
+      title: i18n.t("backendHealth.offline", "Backend Offline"),
+      body: i18n.t("backendHealth.checking", "Checking backend status..."),
       isPersistentPopup: false,
     });
   }
diff --git a/frontend/src/desktop/services/connectionModeService.ts b/frontend/src/desktop/services/connectionModeService.ts
index 09fd093957..67c14f9242 100644
--- a/frontend/src/desktop/services/connectionModeService.ts
+++ b/frontend/src/desktop/services/connectionModeService.ts
@@ -1,8 +1,9 @@
-import { invoke } from '@tauri-apps/api/core';
-import { fetch } from '@tauri-apps/plugin-http';
-import { endpointAvailabilityService } from '@app/services/endpointAvailabilityService';
+import { invoke, isTauri } from "@tauri-apps/api/core";
+import { fetch } from "@tauri-apps/plugin-http";
+import { endpointAvailabilityService } from "@app/services/endpointAvailabilityService";
+import { selfHostedServerMonitor } from "@app/services/selfHostedServerMonitor";
 
-export type ConnectionMode = 'saas' | 'selfhosted' | 'local';
+export type ConnectionMode = "saas" | "selfhosted" | "local";
 
 export interface SSOProviderConfig {
   id: string;
@@ -36,7 +37,8 @@ export interface ConnectionTestResult {
   diagnostics?: DiagnosticResult[];
 }
 
-export const LOCAL_MODE_STORAGE_KEY = 'stirling-local-mode';
+export const LOCAL_MODE_STORAGE_KEY = "stirling-local-mode";
+export const JWT_EXPIRED_PROMPTED_KEY = "stirling-jwt-expired-prompted";
 
 export class ConnectionModeService {
   private static instance: ConnectionModeService;
@@ -55,7 +57,13 @@ export class ConnectionModeService {
     if (!this.configLoadedOnce) {
       await this.loadConfig();
     }
-    return this.currentConfig || { mode: 'saas', server_config: null, lock_connection_mode: false };
+    return (
+      this.currentConfig || {
+        mode: "saas",
+        server_config: null,
+        lock_connection_mode: false,
+      }
+    );
   }
 
   async getCurrentMode(): Promise<ConnectionMode> {
@@ -68,7 +76,9 @@ export class ConnectionModeService {
     return config.server_config;
   }
 
-  subscribeToModeChanges(listener: (config: ConnectionConfig) => void): () => void {
+  subscribeToModeChanges(
+    listener: (config: ConnectionConfig) => void,
+  ): () => void {
     this.modeListeners.add(listener);
     return () => {
       this.modeListeners.delete(listener);
@@ -77,21 +87,24 @@ export class ConnectionModeService {
 
   private notifyListeners() {
     if (this.currentConfig) {
-      this.modeListeners.forEach(listener => listener(this.currentConfig!));
+      this.modeListeners.forEach((listener) => listener(this.currentConfig!));
     }
   }
 
   private async loadConfig(): Promise<void> {
     try {
-      const config = await invoke<ConnectionConfig>('get_connection_config');
+      const config = await invoke<ConnectionConfig>("get_connection_config");
 
       const localFlag = localStorage.getItem(LOCAL_MODE_STORAGE_KEY);
 
-      if (config.mode === 'saas' && localFlag === 'true') {
-        // User previously chose local-only mode.
-        config.mode = 'local';
+      if (localFlag === "true") {
+        // User previously chose local-only mode (signed out or explicitly went offline).
+        // Applies to both 'saas' and 'selfhosted' store modes — the Rust guard on locked
+        // deployments can't change 'selfhosted' to 'saas' in the store, so we check the
+        // flag regardless of what the store says.
+        config.mode = "local";
       } else if (
-        config.mode === 'saas' &&
+        config.mode === "saas" &&
         config.server_config === null &&
         !config.lock_connection_mode &&
         localFlag === null
@@ -103,68 +116,84 @@ export class ConnectionModeService {
         // MSI installs with STIRLING_SERVER_URL are excluded because they have a
         // non-null server_config; locked provisioned installs are excluded by the
         // lock_connection_mode guard.
-        config.mode = 'local';
+        config.mode = "local";
       }
 
       this.currentConfig = config;
       this.configLoadedOnce = true;
     } catch (error) {
-      console.error('Failed to load connection config:', error);
+      console.error("Failed to load connection config:", error);
       // Default to local mode on error — safer than showing SaaS UI for a
       // desktop app whose bundled backend is always available.
-      this.currentConfig = { mode: 'local', server_config: null, lock_connection_mode: false };
+      this.currentConfig = {
+        mode: "local",
+        server_config: null,
+        lock_connection_mode: false,
+      };
       this.configLoadedOnce = true;
     }
   }
 
   async switchToSaaS(saasServerUrl: string): Promise<void> {
     if (this.currentConfig?.lock_connection_mode) {
-      throw new Error('Connection mode is locked by provisioning');
+      throw new Error("Connection mode is locked by provisioning");
     }
 
-    // Clear local-only flag if switching to a real account
+    // Clear local-only flag and expiry-prompted flag when signing in
     localStorage.removeItem(LOCAL_MODE_STORAGE_KEY);
+    localStorage.removeItem(JWT_EXPIRED_PROMPTED_KEY);
 
-    console.log('Switching to SaaS mode');
+    console.log("Switching to SaaS mode");
 
     const serverConfig: ServerConfig = { url: saasServerUrl };
 
-    await invoke('set_connection_mode', {
-      mode: 'saas',
+    await invoke("set_connection_mode", {
+      mode: "saas",
       serverConfig,
     });
 
-    this.currentConfig = { mode: 'saas', server_config: serverConfig, lock_connection_mode: this.currentConfig?.lock_connection_mode ?? false };
+    this.currentConfig = {
+      mode: "saas",
+      server_config: serverConfig,
+      lock_connection_mode: this.currentConfig?.lock_connection_mode ?? false,
+    };
 
     // Clear endpoint availability cache when mode changes
     endpointAvailabilityService.clearCache();
-    console.log('Cleared endpoint availability cache due to connection mode change');
+    console.log(
+      "Cleared endpoint availability cache due to connection mode change",
+    );
 
     this.notifyListeners();
 
-    console.log('Switched to SaaS mode successfully');
+    console.log("Switched to SaaS mode successfully");
   }
 
   async switchToLocal(): Promise<void> {
-    console.log('Switching to local-only mode');
+    console.log("Switching to local-only mode");
 
     // Persist local mode preference via localStorage so no Rust enum change is needed.
     // The Rust store records this as 'saas' (same bundled-backend behaviour); we overlay
     // the 'local' distinction purely on the TypeScript side.
-    localStorage.setItem(LOCAL_MODE_STORAGE_KEY, 'true');
+    localStorage.setItem(LOCAL_MODE_STORAGE_KEY, "true");
 
-    // When a locked provisioned deployment falls back to local, preserve the server URL
-    // so the SetupWizard can pre-fill it if the user tries to sign in again.
-    if (this.currentConfig?.lock_connection_mode && this.currentConfig.server_config?.url) {
-      localStorage.setItem('stirling-provisioned-server-url', this.currentConfig.server_config.url);
-    }
-
-    await invoke('set_connection_mode', {
-      mode: 'saas',
+    await invoke("set_connection_mode", {
+      mode: "saas",
       serverConfig: null,
     });
 
-    this.currentConfig = { mode: 'local', server_config: null, lock_connection_mode: this.currentConfig?.lock_connection_mode ?? false };
+    // For locked deployments, preserve server_config so the sign-in form can still
+    // show the correct server URL if the user wants to sign in later.
+    const isLocked = this.currentConfig?.lock_connection_mode ?? false;
+    const preservedServerConfig = isLocked
+      ? (this.currentConfig?.server_config ?? null)
+      : null;
+
+    this.currentConfig = {
+      mode: "local",
+      server_config: preservedServerConfig,
+      lock_connection_mode: isLocked,
+    };
 
     // Clear endpoint availability cache when mode changes
     endpointAvailabilityService.clearCache();
@@ -173,25 +202,36 @@ export class ConnectionModeService {
   }
 
   async switchToSelfHosted(serverConfig: ServerConfig): Promise<void> {
-    // Clear local-only flag if switching to a real account
+    // Clear local-only flag and expiry-prompted flag when signing in
     localStorage.removeItem(LOCAL_MODE_STORAGE_KEY);
+    localStorage.removeItem(JWT_EXPIRED_PROMPTED_KEY);
 
-    console.log('Switching to self-hosted mode:', serverConfig);
+    console.log("Switching to self-hosted mode:", serverConfig);
 
-    await invoke('set_connection_mode', {
-      mode: 'selfhosted',
+    await invoke("set_connection_mode", {
+      mode: "selfhosted",
       serverConfig,
     });
 
-    this.currentConfig = { mode: 'selfhosted', server_config: serverConfig, lock_connection_mode: this.currentConfig?.lock_connection_mode ?? false };
+    this.currentConfig = {
+      mode: "selfhosted",
+      server_config: serverConfig,
+      lock_connection_mode: this.currentConfig?.lock_connection_mode ?? false,
+    };
 
     // Clear endpoint availability cache when mode changes
     endpointAvailabilityService.clearCache();
-    console.log('Cleared endpoint availability cache due to connection mode change');
+    console.log(
+      "Cleared endpoint availability cache due to connection mode change",
+    );
+
+    // Single authoritative calling point for health monitoring — every path that
+    // switches to self-hosted mode funnels through here.
+    selfHostedServerMonitor.start(serverConfig.url);
 
     this.notifyListeners();
 
-    console.log('Switched to self-hosted mode successfully');
+    console.log("Switched to self-hosted mode successfully");
   }
 
   /**
@@ -199,85 +239,60 @@ export class ConnectionModeService {
    * @returns Detailed test results with diagnostics and recommendations
    */
   async testConnection(url: string): Promise<ConnectionTestResult> {
-    console.log(`[ConnectionModeService] � Starting comprehensive connection diagnostics for: ${url}`);
-    console.log(`[ConnectionModeService] ==================== DIAGNOSTIC SESSION START ====================`);
-    console.log(`[ConnectionModeService] System Information:`);
-    console.log(`[ConnectionModeService]    - User Agent: ${navigator.userAgent}`);
-    console.log(`[ConnectionModeService]    - Platform: ${navigator.platform}`);
-    console.log(`[ConnectionModeService]    - Online: ${navigator.onLine}`);
-    console.log(`[ConnectionModeService]    - Connection Type: ${(navigator as any).connection?.effectiveType || 'unknown'}`);
-    console.log(`[ConnectionModeService]    - Language: ${navigator.language}`);
-    console.log(`[ConnectionModeService]    - Cookies Enabled: ${navigator.cookieEnabled}`);
-    console.log(`[ConnectionModeService]    - Hardware Concurrency: ${navigator.hardwareConcurrency || 'unknown'} cores`);
-    console.log(`[ConnectionModeService]    - Max Touch Points: ${navigator.maxTouchPoints}`);
-
-    // Check for proxy environment variables
-    console.log(`[ConnectionModeService] Environment Check:`);
-    const envProxy = (window as any).process?.env?.HTTP_PROXY || (window as any).process?.env?.HTTPS_PROXY;
-    if (envProxy) {
-      console.log(`[ConnectionModeService]    - Proxy detected: ${envProxy}`);
-    } else {
-      console.log(`[ConnectionModeService]    - No proxy environment variables detected`);
-    }
-
-    // Check if running in Tauri (v2 uses different detection)
-    console.log(`[ConnectionModeService]    - Checking Tauri context...`);
-    console.log(`[ConnectionModeService]    - window.__TAURI__ type: ${typeof (window as any).__TAURI__}`);
-    console.log(`[ConnectionModeService]    - window.__TAURI_INTERNALS__ type: ${typeof (window as any).__TAURI_INTERNALS__}`);
-    console.log(`[ConnectionModeService]    - window.location.href:`, window.location.href);
-    console.log(`[ConnectionModeService]    - window.location.protocol:`, window.location.protocol);
-
-    // Tauri v2 detection: check for __TAURI_INTERNALS__ or tauri:// protocol
-    const isTauriV2 = typeof (window as any).__TAURI_INTERNALS__ !== 'undefined' ||
-                      window.location.protocol === 'tauri:' ||
-                      window.location.hostname === 'tauri.localhost';
-    const isTauriV1 = typeof (window as any).__TAURI__ !== 'undefined';
-    const isTauri = isTauriV1 || isTauriV2;
-
-    console.log(`[ConnectionModeService]    - Running in Tauri v1: ${isTauriV1}`);
-    console.log(`[ConnectionModeService]    - Running in Tauri v2: ${isTauriV2}`);
-    console.log(`[ConnectionModeService]    - Running in Tauri: ${isTauri}`);
-
-    if (isTauri) {
-      if (isTauriV1) {
-        const tauriApi = (window as any).__TAURI__;
-        console.log(`[ConnectionModeService]    - Tauri v1 API:`, tauriApi);
-      }
-      if (isTauriV2) {
-        console.log(`[ConnectionModeService]    - Tauri v2 detected via internals/protocol`);
-        const internals = (window as any).__TAURI_INTERNALS__;
-        console.log(`[ConnectionModeService]    - Tauri internals:`, internals);
-      }
-    }
+    console.log(
+      `[ConnectionModeService] � Starting connection diagnostics for: ${url}`,
+    );
+    console.log(
+      `[ConnectionModeService] System: online=${navigator.onLine}, tauri=${isTauri()}, concurrency=${navigator.hardwareConcurrency || "unknown"}`,
+    );
 
     const diagnostics: DiagnosticResult[] = [];
-    const healthUrl = `${url.replace(/\/$/, '')}/api/v1/info/status`;
+    const healthUrl = `${url.replace(/\/$/, "")}/api/v1/info/status`;
     const isLocal = this.isLocalAddress(url);
-    const isHttpUrl = url.startsWith('http://');
-    const isHttpsUrl = url.startsWith('https://');
+    const isHttpUrl = url.startsWith("http://");
+    const isHttpsUrl = url.startsWith("https://");
 
     console.log(`[ConnectionModeService] Connection Parameters:`);
     console.log(`[ConnectionModeService]    - Target URL: ${url}`);
     console.log(`[ConnectionModeService]    - Health endpoint: ${healthUrl}`);
     console.log(`[ConnectionModeService]    - Is local address: ${isLocal}`);
-    console.log(`[ConnectionModeService]    - Protocol: ${isHttpUrl ? 'HTTP' : isHttpsUrl ? 'HTTPS' : 'Unknown'}`);
-    console.log(`[ConnectionModeService] ================================================================`);
+    console.log(
+      `[ConnectionModeService]    - Protocol: ${isHttpUrl ? "HTTP" : isHttpsUrl ? "HTTPS" : "Unknown"}`,
+    );
+    console.log(
+      `[ConnectionModeService] ================================================================`,
+    );
 
     // STAGE 1: Test the protocol they specified
     if (isHttpUrl) {
-      console.log(`[ConnectionModeService] Stage 1: Testing HTTP (as specified in URL)`);
-      const stage1Result = await this.testHTTP(healthUrl, 'Stage 1: HTTP (as specified)');
+      console.log(
+        `[ConnectionModeService] Stage 1: Testing HTTP (as specified in URL)`,
+      );
+      const stage1Result = await this.testHTTP(
+        healthUrl,
+        "Stage 1: HTTP (as specified)",
+      );
       diagnostics.push(stage1Result);
 
       if (stage1Result.success) {
-        console.log(`[ConnectionModeService] ✅ Connection successful with HTTP`);
+        console.log(
+          `[ConnectionModeService] ✅ Connection successful with HTTP`,
+        );
 
         // Log success summary
-        console.log(`[ConnectionModeService] ==================== DIAGNOSTIC SUMMARY ====================`);
+        console.log(
+          `[ConnectionModeService] ==================== DIAGNOSTIC SUMMARY ====================`,
+        );
         console.log(`[ConnectionModeService] ✅ CONNECTION SUCCESSFUL`);
-        console.log(`[ConnectionModeService] Protocol: HTTP (as requested by user)`);
-        console.log(`[ConnectionModeService] Duration: ${stage1Result.duration}ms`);
-        console.log(`[ConnectionModeService] ==================== DIAGNOSTIC SESSION END ====================`);
+        console.log(
+          `[ConnectionModeService] Protocol: HTTP (as requested by user)`,
+        );
+        console.log(
+          `[ConnectionModeService] Duration: ${stage1Result.duration}ms`,
+        );
+        console.log(
+          `[ConnectionModeService] ==================== DIAGNOSTIC SESSION END ====================`,
+        );
 
         return {
           success: true,
@@ -287,15 +302,19 @@ export class ConnectionModeService {
 
       // HTTP failed, try HTTPS as fallback
       console.log(`[ConnectionModeService] Stage 2: HTTP failed, trying HTTPS`);
-      const httpsUrl = healthUrl.replace('http://', 'https://');
-      const stage2Result = await this.testHTTPS(httpsUrl, 'Stage 2: Trying HTTPS', false);
+      const httpsUrl = healthUrl.replace("http://", "https://");
+      const stage2Result = await this.testHTTPS(
+        httpsUrl,
+        "Stage 2: Trying HTTPS",
+        false,
+      );
       diagnostics.push(stage2Result);
 
       if (stage2Result.success) {
         return {
           success: false,
-          error: 'Server is only accessible via HTTPS, not HTTP.',
-          errorCode: 'HTTP_NOT_AVAILABLE',
+          error: "Server is only accessible via HTTPS, not HTTP.",
+          errorCode: "HTTP_NOT_AVAILABLE",
           diagnostics,
         };
       }
@@ -303,36 +322,72 @@ export class ConnectionModeService {
       // Both failed, continue with more diagnostics below
     } else {
       // HTTPS URL or no protocol - test HTTPS
-      console.log(`[ConnectionModeService] Stage 1: Testing HTTPS with full certificate validation`);
-      const stage1Result = await this.testHTTPS(healthUrl, 'Stage 1: Standard HTTPS', false);
+      console.log(
+        `[ConnectionModeService] Stage 1: Testing HTTPS with full certificate validation`,
+      );
+      const stage1Result = await this.testHTTPS(
+        healthUrl,
+        "Stage 1: Standard HTTPS",
+        false,
+      );
       diagnostics.push(stage1Result);
 
       if (stage1Result.success) {
-        console.log(`[ConnectionModeService] ✅ Connection successful with standard HTTPS`);
+        console.log(
+          `[ConnectionModeService] ✅ Connection successful with standard HTTPS`,
+        );
 
         // Log success summary
-        console.log(`[ConnectionModeService] ==================== DIAGNOSTIC SUMMARY ====================`);
+        console.log(
+          `[ConnectionModeService] ==================== DIAGNOSTIC SUMMARY ====================`,
+        );
         console.log(`[ConnectionModeService] ✅ CONNECTION SUCCESSFUL`);
-        console.log(`[ConnectionModeService] Protocol: HTTPS with valid certificate`);
-        console.log(`[ConnectionModeService] Duration: ${stage1Result.duration}ms`);
-        console.log(`[ConnectionModeService] ==================== DIAGNOSTIC SESSION END ====================`);
+        console.log(
+          `[ConnectionModeService] Protocol: HTTPS with valid certificate`,
+        );
+        console.log(
+          `[ConnectionModeService] Duration: ${stage1Result.duration}ms`,
+        );
+        console.log(
+          `[ConnectionModeService] ==================== DIAGNOSTIC SESSION END ====================`,
+        );
 
         return { success: true, diagnostics };
       }
 
       // STAGE 2: Test with certificate validation disabled (diagnose cert issues)
-      console.log(`[ConnectionModeService] Stage 2: Testing HTTPS with certificate validation disabled`);
-      const stage2Result = await this.testHTTPS(healthUrl, 'Stage 2: HTTPS (no cert validation)', true);
+      console.log(
+        `[ConnectionModeService] Stage 2: Testing HTTPS with certificate validation disabled`,
+      );
+      const stage2Result = await this.testHTTPS(
+        healthUrl,
+        "Stage 2: HTTPS (no cert validation)",
+        true,
+      );
       diagnostics.push(stage2Result);
 
       if (stage2Result.success) {
-        console.log(`[ConnectionModeService] ⚠� Certificate issue detected - but connection works with bypass enabled`);
-        console.log(`[ConnectionModeService] ==================== DIAGNOSTIC SUMMARY ====================`);
-        console.log(`[ConnectionModeService] ✅ CONNECTION SUCCESSFUL (with certificate bypass)`);
-        console.log(`[ConnectionModeService] Protocol: HTTPS with certificate validation disabled`);
-        console.log(`[ConnectionModeService] Duration: ${stage2Result.duration}ms`);
-        console.log(`[ConnectionModeService] Note: Server has missing intermediate certificate or invalid cert`);
-        console.log(`[ConnectionModeService] ==================== DIAGNOSTIC SESSION END ====================`);
+        console.log(
+          `[ConnectionModeService] ⚠� Certificate issue detected - but connection works with bypass enabled`,
+        );
+        console.log(
+          `[ConnectionModeService] ==================== DIAGNOSTIC SUMMARY ====================`,
+        );
+        console.log(
+          `[ConnectionModeService] ✅ CONNECTION SUCCESSFUL (with certificate bypass)`,
+        );
+        console.log(
+          `[ConnectionModeService] Protocol: HTTPS with certificate validation disabled`,
+        );
+        console.log(
+          `[ConnectionModeService] Duration: ${stage2Result.duration}ms`,
+        );
+        console.log(
+          `[ConnectionModeService] Note: Server has missing intermediate certificate or invalid cert`,
+        );
+        console.log(
+          `[ConnectionModeService] ==================== DIAGNOSTIC SESSION END ====================`,
+        );
         return {
           success: true,
           diagnostics,
@@ -340,29 +395,38 @@ export class ConnectionModeService {
       }
 
       // STAGE 3: Try HTTP instead (for local/internal servers)
-      console.log(`[ConnectionModeService] Stage 3: Testing HTTP instead of HTTPS`);
-      const httpUrl = healthUrl.replace('https://', 'http://');
-      const stage3Result = await this.testHTTP(httpUrl, 'Stage 3: HTTP (unencrypted)');
+      console.log(
+        `[ConnectionModeService] Stage 3: Testing HTTP instead of HTTPS`,
+      );
+      const httpUrl = healthUrl.replace("https://", "http://");
+      const stage3Result = await this.testHTTP(
+        httpUrl,
+        "Stage 3: HTTP (unencrypted)",
+      );
       diagnostics.push(stage3Result);
 
       if (stage3Result.success) {
         console.log(`[ConnectionModeService] ⚠� HTTP works but HTTPS doesn't`);
         return {
           success: false,
-          error: 'Server is only accessible via HTTP (not HTTPS).',
-          errorCode: 'HTTPS_NOT_AVAILABLE',
+          error: "Server is only accessible via HTTP (not HTTPS).",
+          errorCode: "HTTPS_NOT_AVAILABLE",
           diagnostics,
         };
       }
     }
 
     // STAGE 4: Test with longer timeout (diagnose slow connections)
-    console.log(`[ConnectionModeService] Stage 4: Testing with extended timeout (30s)`);
+    console.log(
+      `[ConnectionModeService] Stage 4: Testing with extended timeout (30s)`,
+    );
     const stage4Result = await this.testWithLongTimeout(healthUrl);
     diagnostics.push(stage4Result);
 
     if (stage4Result.success) {
-      console.log(`[ConnectionModeService] ⚠� Connection slow but eventually successful`);
+      console.log(
+        `[ConnectionModeService] ⚠� Connection slow but eventually successful`,
+      );
       return {
         success: true,
         diagnostics,
@@ -370,47 +434,73 @@ export class ConnectionModeService {
     }
 
     // STAGE 5A: Test external connectivity with standard endpoint
-    console.log(`[ConnectionModeService] Stage 5A: Testing external connectivity (google.com)`);
+    console.log(
+      `[ConnectionModeService] Stage 5A: Testing external connectivity (google.com)`,
+    );
     const stage5aResult = await this.testStage5_ExternalConnectivity();
     diagnostics.push(stage5aResult);
 
     // STAGE 5B: Test with alternative endpoint (in case google is blocked)
-    console.log(`[ConnectionModeService] Stage 5B: Testing alternative endpoint (cloudflare.com)`);
+    console.log(
+      `[ConnectionModeService] Stage 5B: Testing alternative endpoint (cloudflare.com)`,
+    );
     const stage5bResult = await this.testAlternativeEndpoint();
     diagnostics.push(stage5bResult);
 
     // STAGE 5C: Test with HTTP vs HTTPS for external endpoint
-    console.log(`[ConnectionModeService] Stage 5C: Testing HTTP external endpoint`);
+    console.log(
+      `[ConnectionModeService] Stage 5C: Testing HTTP external endpoint`,
+    );
     const stage5cResult = await this.testHTTPExternal();
     diagnostics.push(stage5cResult);
 
-    if (!stage5aResult.success && !stage5bResult.success && !stage5cResult.success) {
-      console.log(`[ConnectionModeService] � No external connectivity - network/firewall issue`);
+    if (
+      !stage5aResult.success &&
+      !stage5bResult.success &&
+      !stage5cResult.success
+    ) {
+      console.log(
+        `[ConnectionModeService] � No external connectivity - network/firewall issue`,
+      );
       return {
         success: false,
-        error: 'No internet connectivity detected. All network requests are failing.',
-        errorCode: 'NETWORK_BLOCKED',
+        error:
+          "No internet connectivity detected. All network requests are failing.",
+        errorCode: "NETWORK_BLOCKED",
         diagnostics,
       };
     }
 
     // If some external endpoints work but not the target, it's more specific
-    if (stage5aResult.success || stage5bResult.success || stage5cResult.success) {
-      console.log(`[ConnectionModeService] ✅ External connectivity confirmed - issue is specific to target server`);
+    if (
+      stage5aResult.success ||
+      stage5bResult.success ||
+      stage5cResult.success
+    ) {
+      console.log(
+        `[ConnectionModeService] ✅ External connectivity confirmed - issue is specific to target server`,
+      );
     }
 
     // STAGE 6: Test DNS resolution for the target server
-    console.log(`[ConnectionModeService] Stage 6: Testing DNS resolution for target server`);
+    console.log(
+      `[ConnectionModeService] Stage 6: Testing DNS resolution for target server`,
+    );
     const urlObj = new URL(url);
     const stage6Result = await this.testStage6_DNSResolution(urlObj.hostname);
     diagnostics.push(stage6Result);
 
-    if (!stage6Result.success && stage6Result.message.includes('DNS lookup failed')) {
-      console.log(`[ConnectionModeService] � DNS resolution failed for target server`);
+    if (
+      !stage6Result.success &&
+      stage6Result.message.includes("DNS lookup failed")
+    ) {
+      console.log(
+        `[ConnectionModeService] � DNS resolution failed for target server`,
+      );
       return {
         success: false,
         error: `Cannot resolve hostname: ${urlObj.hostname}`,
-        errorCode: 'DNS_RESOLUTION_FAILED',
+        errorCode: "DNS_RESOLUTION_FAILED",
         diagnostics,
       };
     }
@@ -421,68 +511,103 @@ export class ConnectionModeService {
     diagnostics.push(stage7Result);
 
     if (stage7Result.success) {
-      console.log(`[ConnectionModeService] ⚠� HEAD method works but GET doesn't - unusual server behavior`);
+      console.log(
+        `[ConnectionModeService] ⚠� HEAD method works but GET doesn't - unusual server behavior`,
+      );
       return {
         success: false,
-        error: 'Server responds to HEAD requests but not GET requests.',
-        errorCode: 'METHOD_MISMATCH',
+        error: "Server responds to HEAD requests but not GET requests.",
+        errorCode: "METHOD_MISMATCH",
         diagnostics,
       };
     }
 
     // STAGE 8: Try with modified User-Agent
-    console.log(`[ConnectionModeService] Stage 8: Testing with browser User-Agent`);
+    console.log(
+      `[ConnectionModeService] Stage 8: Testing with browser User-Agent`,
+    );
     const stage8Result = await this.testWithBrowserUserAgent(healthUrl);
     diagnostics.push(stage8Result);
 
     if (stage8Result.success) {
-      console.log(`[ConnectionModeService] ⚠� Works with browser User-Agent - server may be blocking desktop apps`);
+      console.log(
+        `[ConnectionModeService] ⚠� Works with browser User-Agent - server may be blocking desktop apps`,
+      );
       return {
         success: false,
-        error: 'Server blocks Tauri/desktop app User-Agent but allows browser User-Agent.',
-        errorCode: 'USER_AGENT_BLOCKED',
+        error:
+          "Server blocks Tauri/desktop app User-Agent but allows browser User-Agent.",
+        errorCode: "USER_AGENT_BLOCKED",
         diagnostics,
       };
     }
 
     // STAGE 9: Final analysis - server-specific issue
-    console.log(`[ConnectionModeService] � Server unreachable - all diagnostic tests failed`);
+    console.log(
+      `[ConnectionModeService] � Server unreachable - all diagnostic tests failed`,
+    );
 
     // Analyze timing patterns
-    const avgDuration = diagnostics
-      .filter(d => !d.success && d.duration)
-      .reduce((sum, d) => sum + (d.duration || 0), 0) /
-      diagnostics.filter(d => !d.success && d.duration).length;
+    const avgDuration =
+      diagnostics
+        .filter((d) => !d.success && d.duration)
+        .reduce((sum, d) => sum + (d.duration || 0), 0) /
+      diagnostics.filter((d) => !d.success && d.duration).length;
 
     // Log comprehensive diagnostic summary
-    console.log(`[ConnectionModeService] ==================== DIAGNOSTIC SUMMARY ====================`);
-    console.log(`[ConnectionModeService] Total tests run: ${diagnostics.length}`);
-    console.log(`[ConnectionModeService] Passed: ${diagnostics.filter(d => d.success).length}`);
-    console.log(`[ConnectionModeService] Failed: ${diagnostics.filter(d => !d.success).length}`);
-    console.log(`[ConnectionModeService] Average failure time: ${avgDuration.toFixed(0)}ms`);
-    console.log(`[ConnectionModeService] ---------------------------------------------------------------`);
+    console.log(
+      `[ConnectionModeService] ==================== DIAGNOSTIC SUMMARY ====================`,
+    );
+    console.log(
+      `[ConnectionModeService] Total tests run: ${diagnostics.length}`,
+    );
+    console.log(
+      `[ConnectionModeService] Passed: ${diagnostics.filter((d) => d.success).length}`,
+    );
+    console.log(
+      `[ConnectionModeService] Failed: ${diagnostics.filter((d) => !d.success).length}`,
+    );
+    console.log(
+      `[ConnectionModeService] Average failure time: ${avgDuration.toFixed(0)}ms`,
+    );
+    console.log(
+      `[ConnectionModeService] ---------------------------------------------------------------`,
+    );
     diagnostics.forEach((diag) => {
-      const icon = diag.success ? '✅' : '�';
-      console.log(`[ConnectionModeService] ${icon} ${diag.stage}: ${diag.message} (${diag.duration}ms)`);
+      const icon = diag.success ? "✅" : "�";
+      console.log(
+        `[ConnectionModeService] ${icon} ${diag.stage}: ${diag.message} (${diag.duration}ms)`,
+      );
     });
-    console.log(`[ConnectionModeService] ================================================================`);
+    console.log(
+      `[ConnectionModeService] ================================================================`,
+    );
     console.log(`[ConnectionModeService] Error Code: SERVER_UNREACHABLE`);
 
     // Log timing-based analysis
     if (avgDuration < 100) {
-      console.log(`[ConnectionModeService] Analysis: Immediate rejections (<${avgDuration.toFixed(0)}ms) suggest firewall/antivirus blocking`);
+      console.log(
+        `[ConnectionModeService] Analysis: Immediate rejections (<${avgDuration.toFixed(0)}ms) suggest firewall/antivirus blocking`,
+      );
     } else if (avgDuration > 5000) {
-      console.log(`[ConnectionModeService] Analysis: Timeouts (avg ${(avgDuration/1000).toFixed(1)}s) suggest server not responding or network route blocked`);
+      console.log(
+        `[ConnectionModeService] Analysis: Timeouts (avg ${(avgDuration / 1000).toFixed(1)}s) suggest server not responding or network route blocked`,
+      );
     } else {
-      console.log(`[ConnectionModeService] Analysis: Server may be down, blocking connections, or behind a firewall`);
+      console.log(
+        `[ConnectionModeService] Analysis: Server may be down, blocking connections, or behind a firewall`,
+      );
     }
 
-    console.log(`[ConnectionModeService] ==================== DIAGNOSTIC SESSION END ====================`);
+    console.log(
+      `[ConnectionModeService] ==================== DIAGNOSTIC SESSION END ====================`,
+    );
 
     return {
       success: false,
-      error: 'Cannot connect to server. Internet works but this specific server is unreachable.',
-      errorCode: 'SERVER_UNREACHABLE',
+      error:
+        "Cannot connect to server. Internet works but this specific server is unreachable.",
+      errorCode: "SERVER_UNREACHABLE",
       diagnostics,
     };
   }
@@ -492,27 +617,41 @@ export class ConnectionModeService {
       const urlObj = new URL(url);
       const hostname = urlObj.hostname.toLowerCase();
       return (
-        hostname === 'localhost' ||
-        hostname === '127.0.0.1' ||
-        hostname === '::1' ||
-        hostname.startsWith('192.168.') ||
-        hostname.startsWith('10.') ||
-        hostname.startsWith('172.16.') ||
-        hostname.endsWith('.local')
+        hostname === "localhost" ||
+        hostname === "127.0.0.1" ||
+        hostname === "::1" ||
+        hostname.startsWith("192.168.") ||
+        hostname.startsWith("10.") ||
+        hostname.startsWith("172.16.") ||
+        hostname.endsWith(".local")
       );
     } catch {
       return false;
     }
   }
 
-  private async testHTTPS(url: string, stageName: string, disableCertValidation: boolean): Promise<DiagnosticResult> {
+  private async testHTTPS(
+    url: string,
+    stageName: string,
+    disableCertValidation: boolean,
+  ): Promise<DiagnosticResult> {
     const startTime = Date.now();
     try {
-      console.log(`[ConnectionModeService] 🔗 ${stageName}: Attempting fetch to ${url}`);
-      console.log(`[ConnectionModeService]    - Certificate validation: ${disableCertValidation ? 'DISABLED' : 'ENABLED'}`);
+      console.log(
+        `[ConnectionModeService] 🔗 ${stageName}: Attempting fetch to ${url}`,
+      );
+      console.log(
+        `[ConnectionModeService]    - Certificate validation: ${disableCertValidation ? "DISABLED" : "ENABLED"}`,
+      );
 
-      const fetchOptions: any = {
-        method: 'GET',
+      const fetchOptions: RequestInit & {
+        connectTimeout?: number;
+        danger?: {
+          acceptInvalidCerts: boolean;
+          acceptInvalidHostnames: boolean;
+        };
+      } = {
+        method: "GET",
         connectTimeout: 10000,
       };
 
@@ -523,19 +662,24 @@ export class ConnectionModeService {
         };
       }
 
-      console.log(`[ConnectionModeService]    - Fetch options:`, JSON.stringify(fetchOptions));
+      console.log(
+        `[ConnectionModeService]    - Fetch options:`,
+        JSON.stringify(fetchOptions),
+      );
       const response = await fetch(url, fetchOptions);
       const duration = Date.now() - startTime;
 
-      console.log(`[ConnectionModeService] ✅ ${stageName}: Response received - HTTP ${response.status} (${duration}ms)`);
+      console.log(
+        `[ConnectionModeService] ✅ ${stageName}: Response received - HTTP ${response.status} (${duration}ms)`,
+      );
 
       if (response.ok) {
         return {
           stage: stageName,
           success: true,
           message: disableCertValidation
-            ? 'Connected successfully when certificate validation disabled'
-            : 'Successfully connected with full certificate validation',
+            ? "Connected successfully when certificate validation disabled"
+            : "Successfully connected with full certificate validation",
           duration,
         };
       }
@@ -550,14 +694,26 @@ export class ConnectionModeService {
       const duration = Date.now() - startTime;
 
       // Enhanced error logging
-      console.error(`[ConnectionModeService] � ${stageName}: Request failed (${duration}ms)`);
-      console.error(`[ConnectionModeService]    - Error type: ${error?.constructor?.name || typeof error}`);
-      console.error(`[ConnectionModeService]    - Error message: ${error instanceof Error ? error.message : String(error)}`);
+      console.error(
+        `[ConnectionModeService] � ${stageName}: Request failed (${duration}ms)`,
+      );
+      console.error(
+        `[ConnectionModeService]    - Error type: ${error?.constructor?.name || typeof error}`,
+      );
+      console.error(
+        `[ConnectionModeService]    - Error message: ${error instanceof Error ? error.message : String(error)}`,
+      );
 
       // Log full error object structure for debugging
-      if (error && typeof error === 'object') {
-        console.error(`[ConnectionModeService]    - Error keys:`, Object.keys(error));
-        console.error(`[ConnectionModeService]    - Error object:`, JSON.stringify(error, Object.getOwnPropertyNames(error), 2));
+      if (error && typeof error === "object") {
+        console.error(
+          `[ConnectionModeService]    - Error keys:`,
+          Object.keys(error),
+        );
+        console.error(
+          `[ConnectionModeService]    - Error object:`,
+          JSON.stringify(error, Object.getOwnPropertyNames(error), 2),
+        );
       }
 
       // Categorize error type
@@ -567,26 +723,49 @@ export class ConnectionModeService {
       let detailedMessage = `Failed: ${errorMsg}`;
 
       // Check for TLS version mismatch (TLS 1.0/1.1 not supported)
-      if (errorLower.includes('peer is incompatible') ||
-          errorLower.includes('protocol version') ||
-          errorLower.includes('peerincompatible') ||
-          (errorLower.includes('handshake') && (errorLower.includes('tls') || errorLower.includes('ssl')))) {
+      if (
+        errorLower.includes("peer is incompatible") ||
+        errorLower.includes("protocol version") ||
+        errorLower.includes("peerincompatible") ||
+        (errorLower.includes("handshake") &&
+          (errorLower.includes("tls") || errorLower.includes("ssl")))
+      ) {
         detailedMessage = `TLS version not supported - Server appears to use TLS 1.0 or 1.1 (desktop app requires TLS 1.2+). Please upgrade your server's TLS configuration or use the web version.`;
-      } else if (errorLower.includes('timeout') || errorLower.includes('timed out')) {
+      } else if (
+        errorLower.includes("timeout") ||
+        errorLower.includes("timed out")
+      ) {
         detailedMessage = `Timeout after ${duration}ms - server not responding`;
-      } else if (errorLower.includes('certificate') || errorLower.includes('cert') || errorLower.includes('ssl') || errorLower.includes('tls')) {
+      } else if (
+        errorLower.includes("certificate") ||
+        errorLower.includes("cert") ||
+        errorLower.includes("ssl") ||
+        errorLower.includes("tls")
+      ) {
         detailedMessage = `SSL/TLS error - ${errorMsg}`;
-      } else if (errorLower.includes('connection refused') || errorLower.includes('econnrefused')) {
+      } else if (
+        errorLower.includes("connection refused") ||
+        errorLower.includes("econnrefused")
+      ) {
         detailedMessage = `Connection refused - server may not be running`;
-      } else if (errorLower.includes('network') || errorLower.includes('dns') || errorLower.includes('enotfound')) {
+      } else if (
+        errorLower.includes("network") ||
+        errorLower.includes("dns") ||
+        errorLower.includes("enotfound")
+      ) {
         detailedMessage = `Network error - ${errorMsg}`;
-      } else if (errorLower.includes('blocked') || errorLower.includes('filtered')) {
+      } else if (
+        errorLower.includes("blocked") ||
+        errorLower.includes("filtered")
+      ) {
         detailedMessage = `Request blocked - possible firewall/antivirus`;
       } else if (duration < 100) {
         detailedMessage = `Immediate rejection (<${duration}ms) - likely blocked by firewall/antivirus`;
       }
 
-      console.error(`[ConnectionModeService]    - Categorized as: ${detailedMessage}`);
+      console.error(
+        `[ConnectionModeService]    - Categorized as: ${detailedMessage}`,
+      );
 
       return {
         stage: stageName,
@@ -597,24 +776,31 @@ export class ConnectionModeService {
     }
   }
 
-  private async testHTTP(url: string, stageName: string): Promise<DiagnosticResult> {
+  private async testHTTP(
+    url: string,
+    stageName: string,
+  ): Promise<DiagnosticResult> {
     const startTime = Date.now();
     try {
-      console.log(`[ConnectionModeService] 🔗 ${stageName}: Attempting fetch to ${url}`);
+      console.log(
+        `[ConnectionModeService] 🔗 ${stageName}: Attempting fetch to ${url}`,
+      );
 
       const response = await fetch(url, {
-        method: 'GET',
+        method: "GET",
         connectTimeout: 10000,
       });
       const duration = Date.now() - startTime;
 
-      console.log(`[ConnectionModeService] ✅ ${stageName}: Response received - HTTP ${response.status} (${duration}ms)`);
+      console.log(
+        `[ConnectionModeService] ✅ ${stageName}: Response received - HTTP ${response.status} (${duration}ms)`,
+      );
 
       if (response.ok) {
         return {
           stage: stageName,
           success: true,
-          message: 'Successfully connected using HTTP',
+          message: "Successfully connected using HTTP",
           duration,
         };
       }
@@ -629,12 +815,21 @@ export class ConnectionModeService {
       const duration = Date.now() - startTime;
 
       // Enhanced error logging
-      console.error(`[ConnectionModeService] � ${stageName}: Request failed (${duration}ms)`);
-      console.error(`[ConnectionModeService]    - Error type: ${error?.constructor?.name || typeof error}`);
-      console.error(`[ConnectionModeService]    - Error message: ${error instanceof Error ? error.message : String(error)}`);
+      console.error(
+        `[ConnectionModeService] � ${stageName}: Request failed (${duration}ms)`,
+      );
+      console.error(
+        `[ConnectionModeService]    - Error type: ${error?.constructor?.name || typeof error}`,
+      );
+      console.error(
+        `[ConnectionModeService]    - Error message: ${error instanceof Error ? error.message : String(error)}`,
+      );
 
-      if (error && typeof error === 'object') {
-        console.error(`[ConnectionModeService]    - Error object:`, JSON.stringify(error, Object.getOwnPropertyNames(error), 2));
+      if (error && typeof error === "object") {
+        console.error(
+          `[ConnectionModeService]    - Error object:`,
+          JSON.stringify(error, Object.getOwnPropertyNames(error), 2),
+        );
       }
 
       const errorMsg = error instanceof Error ? error.message : String(error);
@@ -642,13 +837,15 @@ export class ConnectionModeService {
 
       let detailedMessage = `Failed: ${errorMsg}`;
 
-      if (errorLower.includes('timeout') || errorLower.includes('timed out')) {
+      if (errorLower.includes("timeout") || errorLower.includes("timed out")) {
         detailedMessage = `Timeout after ${duration}ms - server not responding`;
       } else if (duration < 100) {
         detailedMessage = `Immediate rejection (<${duration}ms) - likely blocked by firewall/antivirus`;
       }
 
-      console.error(`[ConnectionModeService]    - Categorized as: ${detailedMessage}`);
+      console.error(
+        `[ConnectionModeService]    - Categorized as: ${detailedMessage}`,
+      );
 
       return {
         stage: stageName,
@@ -663,14 +860,14 @@ export class ConnectionModeService {
     const startTime = Date.now();
     try {
       const response = await fetch(url, {
-        method: 'GET',
+        method: "GET",
         connectTimeout: 30000, // 30 seconds
       });
       const duration = Date.now() - startTime;
 
       if (response.ok) {
         return {
-          stage: 'Stage 4: Extended timeout (30s)',
+          stage: "Stage 4: Extended timeout (30s)",
           success: true,
           message: `Connected after ${duration}ms (slow connection)`,
           duration,
@@ -678,16 +875,16 @@ export class ConnectionModeService {
       }
 
       return {
-        stage: 'Stage 4: Extended timeout (30s)',
+        stage: "Stage 4: Extended timeout (30s)",
         success: false,
         message: `Server returned HTTP ${response.status}`,
         duration,
       };
     } catch (error) {
       const duration = Date.now() - startTime;
-      const errorMsg = error instanceof Error ? error.message : 'Unknown error';
+      const errorMsg = error instanceof Error ? error.message : "Unknown error";
       return {
-        stage: 'Stage 4: Extended timeout (30s)',
+        stage: "Stage 4: Extended timeout (30s)",
         success: false,
         message: `Failed: ${errorMsg}`,
         duration,
@@ -698,40 +895,46 @@ export class ConnectionModeService {
   private async testStage5_ExternalConnectivity(): Promise<DiagnosticResult> {
     const startTime = Date.now();
     try {
-      console.log(`[ConnectionModeService] � Stage 5A: Testing external connectivity (google.com)`);
+      console.log(
+        `[ConnectionModeService] � Stage 5A: Testing external connectivity (google.com)`,
+      );
 
       // Test connectivity to a reliable external service
-      const response = await fetch('https://www.google.com', {
-        method: 'HEAD',
+      const response = await fetch("https://www.google.com", {
+        method: "HEAD",
         connectTimeout: 5000,
       });
       const duration = Date.now() - startTime;
 
-      console.log(`[ConnectionModeService] ✅ Stage 5A: External connectivity confirmed - HTTP ${response.status} (${duration}ms)`);
+      console.log(
+        `[ConnectionModeService] ✅ Stage 5A: External connectivity confirmed - HTTP ${response.status} (${duration}ms)`,
+      );
 
       if (response.ok || response.status === 301 || response.status === 302) {
         return {
-          stage: 'Stage 5A: External (google.com)',
+          stage: "Stage 5A: External (google.com)",
           success: true,
-          message: 'Internet connectivity confirmed via google.com',
+          message: "Internet connectivity confirmed via google.com",
           duration,
         };
       }
 
       return {
-        stage: 'Stage 5A: External (google.com)',
+        stage: "Stage 5A: External (google.com)",
         success: false,
         message: `Unexpected response from google.com: ${response.status}`,
         duration,
       };
     } catch (error) {
       const duration = Date.now() - startTime;
-      console.error(`[ConnectionModeService] � Stage 5A: External connectivity test failed (${duration}ms)`);
+      console.error(
+        `[ConnectionModeService] � Stage 5A: External connectivity test failed (${duration}ms)`,
+      );
       console.error(`[ConnectionModeService]    - Error:`, error);
 
       const errorMsg = error instanceof Error ? error.message : String(error);
       return {
-        stage: 'Stage 5A: External (google.com)',
+        stage: "Stage 5A: External (google.com)",
         success: false,
         message: `Failed: ${errorMsg}`,
         duration,
@@ -742,39 +945,50 @@ export class ConnectionModeService {
   private async testAlternativeEndpoint(): Promise<DiagnosticResult> {
     const startTime = Date.now();
     try {
-      console.log(`[ConnectionModeService] � Stage 5B: Testing alternative endpoint (cloudflare.com)`);
+      console.log(
+        `[ConnectionModeService] � Stage 5B: Testing alternative endpoint (cloudflare.com)`,
+      );
 
-      const response = await fetch('https://1.1.1.1', {
-        method: 'HEAD',
+      const response = await fetch("https://1.1.1.1", {
+        method: "HEAD",
         connectTimeout: 5000,
       });
       const duration = Date.now() - startTime;
 
-      console.log(`[ConnectionModeService] ✅ Stage 5B: Alternative endpoint success - HTTP ${response.status} (${duration}ms)`);
+      console.log(
+        `[ConnectionModeService] ✅ Stage 5B: Alternative endpoint success - HTTP ${response.status} (${duration}ms)`,
+      );
 
-      if (response.ok || response.status === 301 || response.status === 302 || response.status === 403) {
+      if (
+        response.ok ||
+        response.status === 301 ||
+        response.status === 302 ||
+        response.status === 403
+      ) {
         return {
-          stage: 'Stage 5B: External (cloudflare)',
+          stage: "Stage 5B: External (cloudflare)",
           success: true,
-          message: 'Alternative endpoint (1.1.1.1) reachable',
+          message: "Alternative endpoint (1.1.1.1) reachable",
           duration,
         };
       }
 
       return {
-        stage: 'Stage 5B: External (cloudflare)',
+        stage: "Stage 5B: External (cloudflare)",
         success: false,
         message: `Unexpected response: ${response.status}`,
         duration,
       };
     } catch (error) {
       const duration = Date.now() - startTime;
-      console.error(`[ConnectionModeService] � Stage 5B: Alternative endpoint failed (${duration}ms)`);
+      console.error(
+        `[ConnectionModeService] � Stage 5B: Alternative endpoint failed (${duration}ms)`,
+      );
       console.error(`[ConnectionModeService]    - Error:`, error);
 
       const errorMsg = error instanceof Error ? error.message : String(error);
       return {
-        stage: 'Stage 5B: External (cloudflare)',
+        stage: "Stage 5B: External (cloudflare)",
         success: false,
         message: `Failed: ${errorMsg}`,
         duration,
@@ -785,40 +999,46 @@ export class ConnectionModeService {
   private async testHTTPExternal(): Promise<DiagnosticResult> {
     const startTime = Date.now();
     try {
-      console.log(`[ConnectionModeService] � Stage 5C: Testing HTTP external endpoint (httpbin.org)`);
+      console.log(
+        `[ConnectionModeService] � Stage 5C: Testing HTTP external endpoint (httpbin.org)`,
+      );
 
       // Try HTTP (not HTTPS) to see if TLS/SSL is the issue
-      const response = await fetch('http://httpbin.org/status/200', {
-        method: 'GET',
+      const response = await fetch("http://httpbin.org/status/200", {
+        method: "GET",
         connectTimeout: 5000,
       });
       const duration = Date.now() - startTime;
 
-      console.log(`[ConnectionModeService] ✅ Stage 5C: HTTP endpoint success - HTTP ${response.status} (${duration}ms)`);
+      console.log(
+        `[ConnectionModeService] ✅ Stage 5C: HTTP endpoint success - HTTP ${response.status} (${duration}ms)`,
+      );
 
       if (response.ok) {
         return {
-          stage: 'Stage 5C: External HTTP (no TLS)',
+          stage: "Stage 5C: External HTTP (no TLS)",
           success: true,
-          message: 'HTTP (unencrypted) connectivity works',
+          message: "HTTP (unencrypted) connectivity works",
           duration,
         };
       }
 
       return {
-        stage: 'Stage 5C: External HTTP (no TLS)',
+        stage: "Stage 5C: External HTTP (no TLS)",
         success: false,
         message: `Unexpected response: ${response.status}`,
         duration,
       };
     } catch (error) {
       const duration = Date.now() - startTime;
-      console.error(`[ConnectionModeService] � Stage 5C: HTTP external failed (${duration}ms)`);
+      console.error(
+        `[ConnectionModeService] � Stage 5C: HTTP external failed (${duration}ms)`,
+      );
       console.error(`[ConnectionModeService]    - Error:`, error);
 
       const errorMsg = error instanceof Error ? error.message : String(error);
       return {
-        stage: 'Stage 5C: External HTTP (no TLS)',
+        stage: "Stage 5C: External HTTP (no TLS)",
         success: false,
         message: `Failed: ${errorMsg}`,
         duration,
@@ -826,24 +1046,30 @@ export class ConnectionModeService {
     }
   }
 
-  private async testStage6_DNSResolution(hostname: string): Promise<DiagnosticResult> {
+  private async testStage6_DNSResolution(
+    hostname: string,
+  ): Promise<DiagnosticResult> {
     const startTime = Date.now();
     try {
-      console.log(`[ConnectionModeService] � Stage 6: Testing DNS resolution for ${hostname}`);
+      console.log(
+        `[ConnectionModeService] � Stage 6: Testing DNS resolution for ${hostname}`,
+      );
 
       // Try to resolve DNS by making a HEAD request to the base domain
       // If DNS fails, we'll get an immediate error
       const testUrl = `https://${hostname}`;
       await fetch(testUrl, {
-        method: 'HEAD',
+        method: "HEAD",
         connectTimeout: 3000,
       });
       const duration = Date.now() - startTime;
 
-      console.log(`[ConnectionModeService] ✅ Stage 6: DNS resolved successfully (${duration}ms)`);
+      console.log(
+        `[ConnectionModeService] ✅ Stage 6: DNS resolved successfully (${duration}ms)`,
+      );
 
       return {
-        stage: 'Stage 6: DNS resolution',
+        stage: "Stage 6: DNS resolution",
         success: true,
         message: `DNS resolution successful for ${hostname}`,
         duration,
@@ -853,13 +1079,19 @@ export class ConnectionModeService {
       const errorMsg = error instanceof Error ? error.message : String(error);
       const errorLower = errorMsg.toLowerCase();
 
-      console.error(`[ConnectionModeService] � Stage 6: DNS test failed (${duration}ms)`);
+      console.error(
+        `[ConnectionModeService] � Stage 6: DNS test failed (${duration}ms)`,
+      );
       console.error(`[ConnectionModeService]    - Error:`, errorMsg);
 
       // Check if it's a DNS-specific error
-      if (errorLower.includes('dns') || errorLower.includes('enotfound') || errorLower.includes('getaddrinfo')) {
+      if (
+        errorLower.includes("dns") ||
+        errorLower.includes("enotfound") ||
+        errorLower.includes("getaddrinfo")
+      ) {
         return {
-          stage: 'Stage 6: DNS resolution',
+          stage: "Stage 6: DNS resolution",
           success: false,
           message: `DNS lookup failed - cannot resolve ${hostname}`,
           duration,
@@ -868,7 +1100,7 @@ export class ConnectionModeService {
 
       // If we got here, DNS might be working but connection failed for other reasons
       return {
-        stage: 'Stage 6: DNS resolution',
+        stage: "Stage 6: DNS resolution",
         success: false,
         message: `DNS test inconclusive: ${errorMsg}`,
         duration,
@@ -879,38 +1111,44 @@ export class ConnectionModeService {
   private async testWithHEADMethod(url: string): Promise<DiagnosticResult> {
     const startTime = Date.now();
     try {
-      console.log(`[ConnectionModeService] 🔗 Stage 7: Testing with HEAD method`);
+      console.log(
+        `[ConnectionModeService] 🔗 Stage 7: Testing with HEAD method`,
+      );
 
       const response = await fetch(url, {
-        method: 'HEAD',
+        method: "HEAD",
         connectTimeout: 10000,
       });
       const duration = Date.now() - startTime;
 
-      console.log(`[ConnectionModeService] ✅ Stage 7: HEAD method success - HTTP ${response.status} (${duration}ms)`);
+      console.log(
+        `[ConnectionModeService] ✅ Stage 7: HEAD method success - HTTP ${response.status} (${duration}ms)`,
+      );
 
       if (response.ok) {
         return {
-          stage: 'Stage 7: HEAD method',
+          stage: "Stage 7: HEAD method",
           success: true,
-          message: 'HEAD method works (GET does not)',
+          message: "HEAD method works (GET does not)",
           duration,
         };
       }
 
       return {
-        stage: 'Stage 7: HEAD method',
+        stage: "Stage 7: HEAD method",
         success: false,
         message: `HEAD method returned ${response.status}`,
         duration,
       };
     } catch (error) {
       const duration = Date.now() - startTime;
-      console.error(`[ConnectionModeService] � Stage 7: HEAD method failed (${duration}ms)`);
+      console.error(
+        `[ConnectionModeService] � Stage 7: HEAD method failed (${duration}ms)`,
+      );
 
       const errorMsg = error instanceof Error ? error.message : String(error);
       return {
-        stage: 'Stage 7: HEAD method',
+        stage: "Stage 7: HEAD method",
         success: false,
         message: `Failed: ${errorMsg}`,
         duration,
@@ -918,45 +1156,54 @@ export class ConnectionModeService {
     }
   }
 
-  private async testWithBrowserUserAgent(url: string): Promise<DiagnosticResult> {
+  private async testWithBrowserUserAgent(
+    url: string,
+  ): Promise<DiagnosticResult> {
     const startTime = Date.now();
     try {
-      console.log(`[ConnectionModeService] 🔗 Stage 8: Testing with browser User-Agent`);
+      console.log(
+        `[ConnectionModeService] 🔗 Stage 8: Testing with browser User-Agent`,
+      );
 
       // Try with a standard browser User-Agent instead of Tauri's default
       const response = await fetch(url, {
-        method: 'GET',
+        method: "GET",
         connectTimeout: 10000,
         headers: {
-          'User-Agent': 'Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/121.0.0.0 Safari/537.36',
+          "User-Agent":
+            "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/121.0.0.0 Safari/537.36",
         },
       });
       const duration = Date.now() - startTime;
 
-      console.log(`[ConnectionModeService] ✅ Stage 8: Browser User-Agent success - HTTP ${response.status} (${duration}ms)`);
+      console.log(
+        `[ConnectionModeService] ✅ Stage 8: Browser User-Agent success - HTTP ${response.status} (${duration}ms)`,
+      );
 
       if (response.ok) {
         return {
-          stage: 'Stage 8: Browser User-Agent',
+          stage: "Stage 8: Browser User-Agent",
           success: true,
-          message: 'Works with browser User-Agent (blocked with desktop UA)',
+          message: "Works with browser User-Agent (blocked with desktop UA)",
           duration,
         };
       }
 
       return {
-        stage: 'Stage 8: Browser User-Agent',
+        stage: "Stage 8: Browser User-Agent",
         success: false,
         message: `Browser UA returned ${response.status}`,
         duration,
       };
     } catch (error) {
       const duration = Date.now() - startTime;
-      console.error(`[ConnectionModeService] � Stage 8: Browser User-Agent failed (${duration}ms)`);
+      console.error(
+        `[ConnectionModeService] � Stage 8: Browser User-Agent failed (${duration}ms)`,
+      );
 
       const errorMsg = error instanceof Error ? error.message : String(error);
       return {
-        stage: 'Stage 8: Browser User-Agent',
+        stage: "Stage 8: Browser User-Agent",
         success: false,
         message: `Failed: ${errorMsg}`,
         duration,
@@ -964,13 +1211,12 @@ export class ConnectionModeService {
     }
   }
 
-
   async isFirstLaunch(): Promise<boolean> {
     try {
-      const result = await invoke<boolean>('is_first_launch');
+      const result = await invoke<boolean>("is_first_launch");
       return result;
     } catch (error) {
-      console.error('Failed to check first launch:', error);
+      console.error("Failed to check first launch:", error);
       return false;
     }
   }
@@ -980,10 +1226,10 @@ export class ConnectionModeService {
       return;
     }
     try {
-      await invoke('reset_setup_completion');
-      console.log('Setup completion flag reset successfully');
+      await invoke("reset_setup_completion");
+      console.log("Setup completion flag reset successfully");
     } catch (error) {
-      console.error('Failed to reset setup completion:', error);
+      console.error("Failed to reset setup completion:", error);
       throw error;
     }
   }
diff --git a/frontend/src/desktop/services/defaultAppService.ts b/frontend/src/desktop/services/defaultAppService.ts
index b4d9d35f97..c7f554a960 100644
--- a/frontend/src/desktop/services/defaultAppService.ts
+++ b/frontend/src/desktop/services/defaultAppService.ts
@@ -1,4 +1,4 @@
-import { invoke } from '@tauri-apps/api/core';
+import { invoke } from "@tauri-apps/api/core";
 
 /**
  * Service for managing default PDF handler settings
@@ -10,10 +10,10 @@ export const defaultAppService = {
    */
   async isDefaultPdfHandler(): Promise<boolean> {
     try {
-      const result = await invoke<boolean>('is_default_pdf_handler');
+      const result = await invoke<boolean>("is_default_pdf_handler");
       return result;
     } catch (error) {
-      console.error('[DefaultApp] Failed to check default handler:', error);
+      console.error("[DefaultApp] Failed to check default handler:", error);
       return false;
     }
   },
@@ -22,13 +22,15 @@ export const defaultAppService = {
    * Set or prompt to set Stirling PDF as default PDF handler
    * Returns a status string indicating what happened
    */
-  async setAsDefaultPdfHandler(): Promise<'set_successfully' | 'opened_dialog' | 'error'> {
+  async setAsDefaultPdfHandler(): Promise<
+    "set_successfully" | "opened_dialog" | "error"
+  > {
     try {
-      const result = await invoke<string>('set_as_default_pdf_handler');
-      return result as 'set_successfully' | 'opened_dialog';
+      const result = await invoke<string>("set_as_default_pdf_handler");
+      return result as "set_successfully" | "opened_dialog";
     } catch (error) {
-      console.error('[DefaultApp] Failed to set default handler:', error);
-      return 'error';
+      console.error("[DefaultApp] Failed to set default handler:", error);
+      return "error";
     }
   },
 
@@ -37,8 +39,10 @@ export const defaultAppService = {
    */
   hasUserDismissedPrompt(): boolean {
     try {
-      const dismissed = localStorage.getItem('stirlingpdf_default_app_prompt_dismissed');
-      return dismissed === 'true';
+      const dismissed = localStorage.getItem(
+        "stirlingpdf_default_app_prompt_dismissed",
+      );
+      return dismissed === "true";
     } catch {
       return false;
     }
@@ -49,9 +53,12 @@ export const defaultAppService = {
    */
   setPromptDismissed(dismissed: boolean): void {
     try {
-      localStorage.setItem('stirlingpdf_default_app_prompt_dismissed', dismissed ? 'true' : 'false');
+      localStorage.setItem(
+        "stirlingpdf_default_app_prompt_dismissed",
+        dismissed ? "true" : "false",
+      );
     } catch (error) {
-      console.error('[DefaultApp] Failed to save prompt preference:', error);
+      console.error("[DefaultApp] Failed to save prompt preference:", error);
     }
   },
 
diff --git a/frontend/src/desktop/services/desktopNotificationService.ts b/frontend/src/desktop/services/desktopNotificationService.ts
index 5c9a14414c..54e948ba43 100644
--- a/frontend/src/desktop/services/desktopNotificationService.ts
+++ b/frontend/src/desktop/services/desktopNotificationService.ts
@@ -1,13 +1,13 @@
-import { isTauri } from '@tauri-apps/api/core';
-import { getCurrentWindow } from '@tauri-apps/api/window';
+import { isTauri } from "@tauri-apps/api/core";
+import { getCurrentWindow } from "@tauri-apps/api/window";
 import {
   isPermissionGranted,
   requestPermission,
   sendNotification,
-} from '@tauri-apps/plugin-notification';
-import i18n from '@app/i18n';
+} from "@tauri-apps/plugin-notification";
+import i18n from "@app/i18n";
 
-const APP_TITLE = 'Stirling-PDF';
+const APP_TITLE = "Stirling-PDF";
 
 async function shouldShowBackgroundNotification(): Promise<boolean> {
   if (!isTauri()) {
@@ -21,54 +21,64 @@ async function shouldShowBackgroundNotification(): Promise<boolean> {
       window.isFocused().catch(() => true),
     ]);
 
-    return isMinimized || !isFocused || document.visibilityState !== 'visible';
+    return isMinimized || !isFocused || document.visibilityState !== "visible";
   } catch {
     return false;
   }
 }
 
-export async function notifyPdfProcessingComplete(fileCount: number): Promise<void> {
-  console.log('[DesktopNotification] notifyPdfProcessingComplete called with fileCount:', fileCount);
+export async function notifyPdfProcessingComplete(
+  fileCount: number,
+): Promise<void> {
+  console.log(
+    "[DesktopNotification] notifyPdfProcessingComplete called with fileCount:",
+    fileCount,
+  );
 
   if (!isTauri() || fileCount <= 0) {
-    console.log('[DesktopNotification] Skipped: !isTauri() or fileCount <= 0');
+    console.log("[DesktopNotification] Skipped: !isTauri() or fileCount <= 0");
     return;
   }
 
   const canNotify = await shouldShowBackgroundNotification();
-  console.log('[DesktopNotification] canNotify (background):', canNotify);
+  console.log("[DesktopNotification] canNotify (background):", canNotify);
   if (!canNotify) {
-    console.log('[DesktopNotification] App is in focus, skipping notification');
+    console.log("[DesktopNotification] App is in focus, skipping notification");
     return;
   }
 
   try {
     // Check and request permission if needed
     let permissionGranted = await isPermissionGranted();
-    console.log('[DesktopNotification] Permission check:', permissionGranted);
+    console.log("[DesktopNotification] Permission check:", permissionGranted);
 
     if (!permissionGranted) {
-      console.log('[DesktopNotification] Requesting permission...');
+      console.log("[DesktopNotification] Requesting permission...");
       const permission = await requestPermission();
-      permissionGranted = permission === 'granted';
-      console.log('[DesktopNotification] Permission result:', permission);
+      permissionGranted = permission === "granted";
+      console.log("[DesktopNotification] Permission result:", permission);
     }
 
     if (!permissionGranted) {
-      console.log('[DesktopNotification] Permission not granted, skipping notification');
+      console.log(
+        "[DesktopNotification] Permission not granted, skipping notification",
+      );
       return;
     }
 
-    const body = fileCount === 1
-      ? i18n.t('processingComplete', 'Your file is ready.')
-      : i18n.t('processingCompleteMultiple', '{{count}} files are ready.', { count: fileCount });
-    console.log('[DesktopNotification] Sending notification:', body);
+    const body =
+      fileCount === 1
+        ? i18n.t("processingComplete", "Your file is ready.")
+        : i18n.t("processingCompleteMultiple", "{{count}} files are ready.", {
+            count: fileCount,
+          });
+    console.log("[DesktopNotification] Sending notification:", body);
     await sendNotification({
       title: APP_TITLE,
       body,
     });
-    console.log('[DesktopNotification] Notification sent successfully');
+    console.log("[DesktopNotification] Notification sent successfully");
   } catch (error) {
-    console.warn('[DesktopNotification] Unable to send notification', error);
+    console.warn("[DesktopNotification] Unable to send notification", error);
   }
 }
diff --git a/frontend/src/desktop/services/downloadService.ts b/frontend/src/desktop/services/downloadService.ts
index 3981ec0cc8..b2642370bc 100644
--- a/frontend/src/desktop/services/downloadService.ts
+++ b/frontend/src/desktop/services/downloadService.ts
@@ -1,9 +1,17 @@
-import type { DownloadRequest, DownloadResult } from "@core/services/downloadService";
-import { saveToLocalPath, showSaveDialog } from "@app/services/localFileSaveService";
+import type {
+  DownloadRequest,
+  DownloadResult,
+} from "@core/services/downloadService";
+import {
+  saveToLocalPath,
+  showSaveDialog,
+} from "@app/services/localFileSaveService";
 
 export type { DownloadRequest, DownloadResult };
 
-export async function downloadFile(request: DownloadRequest): Promise<DownloadResult> {
+export async function downloadFile(
+  request: DownloadRequest,
+): Promise<DownloadResult> {
   if (request.localPath) {
     const result = await saveToLocalPath(request.data, request.localPath);
     if (!result.success) {
@@ -28,7 +36,7 @@ export async function downloadFile(request: DownloadRequest): Promise<DownloadRe
 export async function downloadFromUrl(
   url: string,
   filename: string,
-  localPath?: string
+  localPath?: string,
 ): Promise<DownloadResult> {
   const response = await fetch(url);
   if (!response.ok) {
diff --git a/frontend/src/desktop/services/endpointAvailabilityService.ts b/frontend/src/desktop/services/endpointAvailabilityService.ts
index 20bad9a756..c10a56064e 100644
--- a/frontend/src/desktop/services/endpointAvailabilityService.ts
+++ b/frontend/src/desktop/services/endpointAvailabilityService.ts
@@ -1,5 +1,5 @@
-import { fetch } from '@tauri-apps/plugin-http';
-import { STIRLING_SAAS_BACKEND_API_URL } from '@app/constants/connection';
+import { fetch } from "@tauri-apps/plugin-http";
+import { STIRLING_SAAS_BACKEND_API_URL } from "@app/constants/connection";
 
 /**
  * Service for checking endpoint availability on the local bundled backend.
@@ -22,7 +22,10 @@ export class EndpointAvailabilityService {
    * @param backendUrl - The URL for the backend
    * @returns Promise<boolean> - true if supported locally, false otherwise
    */
-  async isEndpointSupportedLocally(endpoint: string, backendUrl: string | null): Promise<boolean> {
+  async isEndpointSupportedLocally(
+    endpoint: string,
+    backendUrl: string | null,
+  ): Promise<boolean> {
     // Check cache first
     const cached = this.localCache.get(endpoint);
     const expiry = this.localCacheExpiry.get(endpoint);
@@ -41,15 +44,15 @@ export class EndpointAvailabilityService {
       const url = `${backendUrl}/api/v1/config/endpoints-availability?endpoints=${encodeURIComponent(endpoint)}`;
 
       const response = await fetch(url, {
-        method: 'GET',
+        method: "GET",
         headers: {
-          'Cache-Control': 'no-store',
+          "Cache-Control": "no-store",
         },
       });
 
       if (!response.ok) {
         console.warn(
-          `[endpointAvailabilityService] Failed to check local endpoint availability: ${response.status}`
+          `[endpointAvailabilityService] Failed to check local endpoint availability: ${response.status}`,
         );
         return false;
       }
@@ -65,7 +68,7 @@ export class EndpointAvailabilityService {
     } catch (error) {
       console.error(
         `[endpointAvailabilityService] Error checking local endpoint availability:`,
-        error
+        error,
       );
       return false; // Assume not supported on error
     }
@@ -93,19 +96,19 @@ export class EndpointAvailabilityService {
         return false;
       }
 
-      const saasUrl = STIRLING_SAAS_BACKEND_API_URL.replace(/\/$/, '');
+      const saasUrl = STIRLING_SAAS_BACKEND_API_URL.replace(/\/$/, "");
       const url = `${saasUrl}/api/v1/config/endpoints-availability?endpoints=${encodeURIComponent(endpoint)}`;
 
       const response = await fetch(url, {
-        method: 'GET',
+        method: "GET",
         headers: {
-          'Cache-Control': 'no-store',
+          "Cache-Control": "no-store",
         },
       });
 
       if (!response.ok) {
         console.warn(
-          `[endpointAvailabilityService] Failed to check SaaS endpoint availability: ${response.status}`
+          `[endpointAvailabilityService] Failed to check SaaS endpoint availability: ${response.status}`,
         );
         return false;
       }
@@ -121,7 +124,7 @@ export class EndpointAvailabilityService {
     } catch (error) {
       console.error(
         `[endpointAvailabilityService] Error checking SaaS endpoint availability:`,
-        error
+        error,
       );
       return false; // Assume not supported on error
     }
@@ -142,21 +145,25 @@ export class EndpointAvailabilityService {
    * Call from console: window.endpointAvailabilityService.debugCache()
    */
   debugCache() {
-    console.group('[endpointAvailabilityService] Cache Debug');
+    console.group("[endpointAvailabilityService] Cache Debug");
 
-    console.group('Local Cache');
+    console.group("Local Cache");
     this.localCache.forEach((available, endpoint) => {
       const expiry = this.localCacheExpiry.get(endpoint);
       const expiresIn = expiry ? Math.max(0, expiry - Date.now()) : 0;
-      console.log(`${endpoint}: ${available} (expires in ${Math.round(expiresIn / 1000)}s)`);
+      console.log(
+        `${endpoint}: ${available} (expires in ${Math.round(expiresIn / 1000)}s)`,
+      );
     });
     console.groupEnd();
 
-    console.group('SaaS Cache');
+    console.group("SaaS Cache");
     this.saasCache.forEach((available, endpoint) => {
       const expiry = this.saasCacheExpiry.get(endpoint);
       const expiresIn = expiry ? Math.max(0, expiry - Date.now()) : 0;
-      console.log(`${endpoint}: ${available} (expires in ${Math.round(expiresIn / 1000)}s)`);
+      console.log(
+        `${endpoint}: ${available} (expires in ${Math.round(expiresIn / 1000)}s)`,
+      );
     });
     console.groupEnd();
 
@@ -170,19 +177,22 @@ export class EndpointAvailabilityService {
    * @param endpoints - Array of endpoint paths to check
    * @param backendUrl - The URL of the backend
    */
-  async preloadEndpoints(endpoints: string[], backendUrl: string | null): Promise<void> {
+  async preloadEndpoints(
+    endpoints: string[],
+    backendUrl: string | null,
+  ): Promise<void> {
     if (!backendUrl || endpoints.length === 0) {
       return;
     }
 
     try {
-      const endpointsParam = endpoints.join(',');
+      const endpointsParam = endpoints.join(",");
       const url = `${backendUrl}/api/v1/config/endpoints-availability?endpoints=${encodeURIComponent(endpointsParam)}`;
 
       const response = await fetch(url, {
-        method: 'GET',
+        method: "GET",
         headers: {
-          'Cache-Control': 'no-store',
+          "Cache-Control": "no-store",
         },
       });
 
@@ -190,18 +200,24 @@ export class EndpointAvailabilityService {
         const data = await response.json();
         const now = Date.now();
 
-        Object.entries(data).forEach(([endpoint, details]: [string, any]) => {
-          const available = details?.enabled ?? false;
-          this.localCache.set(endpoint, available);
-          this.localCacheExpiry.set(endpoint, now + this.CACHE_DURATION);
-        });
+        Object.entries(data).forEach(
+          ([endpoint, details]: [string, unknown]) => {
+            const available =
+              (details as { enabled?: boolean })?.enabled ?? false;
+            this.localCache.set(endpoint, available);
+            this.localCacheExpiry.set(endpoint, now + this.CACHE_DURATION);
+          },
+        );
       } else {
         console.warn(
-          `[endpointAvailabilityService] Failed to preload endpoints: ${response.status}`
+          `[endpointAvailabilityService] Failed to preload endpoints: ${response.status}`,
         );
       }
     } catch (error) {
-      console.error('[endpointAvailabilityService] Error preloading endpoints:', error);
+      console.error(
+        "[endpointAvailabilityService] Error preloading endpoints:",
+        error,
+      );
     }
   }
 
@@ -212,12 +228,15 @@ export class EndpointAvailabilityService {
    * @param endpoint - The endpoint path to check
    * @returns Promise with availability details
    */
-  async checkEndpointCombined(endpoint: string, backendUrl: string | null): Promise<{
+  async checkEndpointCombined(
+    endpoint: string,
+    backendUrl: string | null,
+  ): Promise<{
     availableLocally: boolean;
     availableOnSaaS: boolean;
-    isAvailable: boolean;      // local || saas
-    willUseCloud: boolean;      // saas && !local
-    localOnly: boolean;         // local && !saas
+    isAvailable: boolean; // local || saas
+    willUseCloud: boolean; // saas && !local
+    localOnly: boolean; // local && !saas
   }> {
     // Check both backends in parallel for efficiency
     const [availableLocally, availableOnSaaS] = await Promise.all([
@@ -238,28 +257,46 @@ export class EndpointAvailabilityService {
    * Get cache statistics (useful for debugging)
    */
   getCacheStats(): {
-    local: { size: number; entries: Array<{ endpoint: string; available: boolean; expiresIn: number }> };
-    saas: { size: number; entries: Array<{ endpoint: string; available: boolean; expiresIn: number }> };
+    local: {
+      size: number;
+      entries: Array<{
+        endpoint: string;
+        available: boolean;
+        expiresIn: number;
+      }>;
+    };
+    saas: {
+      size: number;
+      entries: Array<{
+        endpoint: string;
+        available: boolean;
+        expiresIn: number;
+      }>;
+    };
   } {
     const now = Date.now();
 
-    const localEntries = Array.from(this.localCache.entries()).map(([endpoint, available]) => {
-      const expiry = this.localCacheExpiry.get(endpoint) ?? 0;
-      return {
-        endpoint,
-        available,
-        expiresIn: Math.max(0, expiry - now),
-      };
-    });
+    const localEntries = Array.from(this.localCache.entries()).map(
+      ([endpoint, available]) => {
+        const expiry = this.localCacheExpiry.get(endpoint) ?? 0;
+        return {
+          endpoint,
+          available,
+          expiresIn: Math.max(0, expiry - now),
+        };
+      },
+    );
 
-    const saasEntries = Array.from(this.saasCache.entries()).map(([endpoint, available]) => {
-      const expiry = this.saasCacheExpiry.get(endpoint) ?? 0;
-      return {
-        endpoint,
-        available,
-        expiresIn: Math.max(0, expiry - now),
-      };
-    });
+    const saasEntries = Array.from(this.saasCache.entries()).map(
+      ([endpoint, available]) => {
+        const expiry = this.saasCacheExpiry.get(endpoint) ?? 0;
+        return {
+          endpoint,
+          available,
+          expiresIn: Math.max(0, expiry - now),
+        };
+      },
+    );
 
     return {
       local: {
@@ -278,6 +315,6 @@ export class EndpointAvailabilityService {
 export const endpointAvailabilityService = new EndpointAvailabilityService();
 
 // Expose to window for debugging
-if (typeof window !== 'undefined') {
-  (window as any).endpointAvailabilityService = endpointAvailabilityService;
+if (typeof window !== "undefined") {
+  window.endpointAvailabilityService = endpointAvailabilityService;
 }
diff --git a/frontend/src/desktop/services/fileDialogService.ts b/frontend/src/desktop/services/fileDialogService.ts
index d7da45b14f..67a4fb13c3 100644
--- a/frontend/src/desktop/services/fileDialogService.ts
+++ b/frontend/src/desktop/services/fileDialogService.ts
@@ -1,7 +1,10 @@
 // Desktop implementation - Tauri native file dialogs
-import type { FileWithPath, FileDialogOptions } from '@core/services/fileDialogService';
-import { createQuickKey } from '@app/types/fileContext';
-import { getDocumentFileDialogFilter } from '@app/utils/fileDialogUtils';
+import type {
+  FileWithPath,
+  FileDialogOptions,
+} from "@core/services/fileDialogService";
+import { createQuickKey } from "@app/types/fileContext";
+import { getDocumentFileDialogFilter } from "@app/utils/fileDialogUtils";
 
 export type { FileWithPath, FileDialogOptions };
 
@@ -9,24 +12,26 @@ export type { FileWithPath, FileDialogOptions };
  * Open native file dialog and read selected files (Desktop/Tauri only)
  */
 export async function openFileDialog(
-  options?: FileDialogOptions
+  options?: FileDialogOptions,
 ): Promise<FileWithPath[]> {
   try {
-    const { open } = await import('@tauri-apps/plugin-dialog');
-    const { readFile } = await import('@tauri-apps/plugin-fs');
+    const { open } = await import("@tauri-apps/plugin-dialog");
+    const { readFile } = await import("@tauri-apps/plugin-fs");
 
-    console.log('[FileDialog] Opening file dialog...');
+    console.log("[FileDialog] Opening file dialog...");
     const selectedPaths = await open({
       multiple: options?.multiple ?? true,
-      filters: options?.filters ?? getDocumentFileDialogFilter()
+      filters: options?.filters ?? getDocumentFileDialogFilter(),
     });
 
     if (!selectedPaths) {
-      console.log('[FileDialog] User cancelled');
+      console.log("[FileDialog] User cancelled");
       return [];
     }
 
-    const paths = Array.isArray(selectedPaths) ? selectedPaths : [selectedPaths];
+    const paths = Array.isArray(selectedPaths)
+      ? selectedPaths
+      : [selectedPaths];
     console.log(`[FileDialog] Selected ${paths.length} file(s):`, paths);
 
     const filesWithPaths: FileWithPath[] = [];
@@ -35,17 +40,19 @@ export async function openFileDialog(
       try {
         console.log(`[FileDialog] Reading file: ${filePath}`);
         const fileData = await readFile(filePath);
-        const fileName = filePath.split(/[/\\]/).pop() || 'document';
+        const fileName = filePath.split(/[/\\]/).pop() || "document";
         const file = new File([fileData], fileName, {
-          type: fileName.endsWith('.pdf') ? 'application/pdf' : undefined
+          type: fileName.endsWith(".pdf") ? "application/pdf" : undefined,
         });
         const quickKey = createQuickKey(file);
-        console.log(`[FileDialog] Created File: ${fileName}, quickKey: ${quickKey}`);
+        console.log(
+          `[FileDialog] Created File: ${fileName}, quickKey: ${quickKey}`,
+        );
 
         filesWithPaths.push({
           file,
           path: filePath,
-          quickKey
+          quickKey,
         });
       } catch (error) {
         console.error(`[FileDialog] Failed to read ${filePath}:`, error);
@@ -54,7 +61,7 @@ export async function openFileDialog(
 
     return filesWithPaths;
   } catch (error) {
-    console.error('[FileDialog] Error:', error);
+    console.error("[FileDialog] Error:", error);
     return [];
   }
 }
diff --git a/frontend/src/desktop/services/fileOpenService.ts b/frontend/src/desktop/services/fileOpenService.ts
index 059191c808..f3c7c70667 100644
--- a/frontend/src/desktop/services/fileOpenService.ts
+++ b/frontend/src/desktop/services/fileOpenService.ts
@@ -1,8 +1,10 @@
-import { invoke, isTauri } from '@tauri-apps/api/core';
+import { invoke, isTauri } from "@tauri-apps/api/core";
 
 export interface FileOpenService {
   getOpenedFiles(): Promise<string[]>;
-  readFileAsArrayBuffer(filePath: string): Promise<{ fileName: string; arrayBuffer: ArrayBuffer } | null>;
+  readFileAsArrayBuffer(
+    filePath: string,
+  ): Promise<{ fileName: string; arrayBuffer: ArrayBuffer } | null>;
   clearOpenedFiles(): Promise<void>;
   onFileOpened(callback: (filePath: string) => void): () => void; // Returns unlisten function
 }
@@ -10,40 +12,45 @@ export interface FileOpenService {
 class TauriFileOpenService implements FileOpenService {
   async getOpenedFiles(): Promise<string[]> {
     try {
-      console.log('� Calling invoke(pop_opened_files)...');
-      const result = await invoke<string[]>('pop_opened_files');
-      console.log('� invoke(pop_opened_files) returned:', result);
+      console.log("� Calling invoke(pop_opened_files)...");
+      const result = await invoke<string[]>("pop_opened_files");
+      console.log("� invoke(pop_opened_files) returned:", result);
       return result;
     } catch (error) {
-      console.error('� Failed to get opened files:', error);
+      console.error("� Failed to get opened files:", error);
       return [];
     }
   }
 
-  async readFileAsArrayBuffer(filePath: string): Promise<{ fileName: string; arrayBuffer: ArrayBuffer } | null> {
+  async readFileAsArrayBuffer(
+    filePath: string,
+  ): Promise<{ fileName: string; arrayBuffer: ArrayBuffer } | null> {
     try {
-      const { readFile } = await import('@tauri-apps/plugin-fs');
+      const { readFile } = await import("@tauri-apps/plugin-fs");
 
       const fileData = await readFile(filePath);
-      const fileName = filePath.split(/[\\/]/).pop() || 'opened-file.pdf';
+      const fileName = filePath.split(/[\\/]/).pop() || "opened-file.pdf";
 
       return {
         fileName,
-        arrayBuffer: fileData.buffer.slice(fileData.byteOffset, fileData.byteOffset + fileData.byteLength)
+        arrayBuffer: fileData.buffer.slice(
+          fileData.byteOffset,
+          fileData.byteOffset + fileData.byteLength,
+        ),
       };
     } catch (error) {
-      console.error('Failed to read file:', error);
+      console.error("Failed to read file:", error);
       return null;
     }
   }
 
   async clearOpenedFiles(): Promise<void> {
     try {
-      console.log('� Calling invoke(clear_opened_files)...');
-      await invoke('clear_opened_files');
-      console.log('✅ Successfully cleared opened files');
+      console.log("� Calling invoke(clear_opened_files)...");
+      await invoke("clear_opened_files");
+      console.log("✅ Successfully cleared opened files");
     } catch (error) {
-      console.error('� Failed to clear opened files:', error);
+      console.error("� Failed to clear opened files:", error);
     }
   }
 
@@ -60,7 +67,7 @@ class TauriFileOpenService implements FileOpenService {
 
         // Only import if in Tauri environment
         if (isTauri()) {
-          const { listen } = await import('@tauri-apps/api/event');
+          const { listen } = await import("@tauri-apps/api/event");
 
           // Check again after async import
           if (isCleanedUp) {
@@ -68,8 +75,8 @@ class TauriFileOpenService implements FileOpenService {
           }
 
           // Listen for unified file open events (all platforms)
-          const unlisten = await listen('file-opened', (event) => {
-            console.log('📂 File open event received:', event.payload);
+          const unlisten = await listen("file-opened", (event) => {
+            console.log("📂 File open event received:", event.payload);
             callback(event.payload as string);
           });
 
@@ -78,9 +85,9 @@ class TauriFileOpenService implements FileOpenService {
             cleanup = () => {
               try {
                 unlisten();
-                console.log('✅ File event listeners cleaned up');
+                console.log("✅ File event listeners cleaned up");
               } catch (error) {
-                console.error('� Error during file event cleanup:', error);
+                console.error("� Error during file event cleanup:", error);
               }
             };
           } else {
@@ -88,12 +95,12 @@ class TauriFileOpenService implements FileOpenService {
             try {
               unlisten();
             } catch (error) {
-              console.error('� Error during immediate cleanup:', error);
+              console.error("� Error during immediate cleanup:", error);
             }
           }
         }
       } catch (error) {
-        console.error('� Failed to setup file event listeners:', error);
+        console.error("� Failed to setup file event listeners:", error);
       }
     };
 
@@ -115,7 +122,9 @@ class WebFileOpenService implements FileOpenService {
     return [];
   }
 
-  async readFileAsArrayBuffer(_filePath: string): Promise<{ fileName: string; arrayBuffer: ArrayBuffer } | null> {
+  async readFileAsArrayBuffer(
+    _filePath: string,
+  ): Promise<{ fileName: string; arrayBuffer: ArrayBuffer } | null> {
     // In web mode, cannot read arbitrary file paths
     return null;
   }
@@ -126,7 +135,7 @@ class WebFileOpenService implements FileOpenService {
 
   onFileOpened(_callback: (filePath: string) => void): () => void {
     // In web mode, no file events - return no-op cleanup function
-    console.log('ℹ� Web mode: File event listeners not supported');
+    console.log("ℹ� Web mode: File event listeners not supported");
     return () => {
       // No-op cleanup for web mode
     };
diff --git a/frontend/src/desktop/services/httpErrorHandler.ts b/frontend/src/desktop/services/httpErrorHandler.ts
index 12bde3dacf..e2deed091c 100644
--- a/frontend/src/desktop/services/httpErrorHandler.ts
+++ b/frontend/src/desktop/services/httpErrorHandler.ts
@@ -1,4 +1,5 @@
-import { handleHttpError as coreHandleHttpError } from '@core/services/httpErrorHandler';
+import { isAxiosError } from "axios";
+import { handleHttpError as coreHandleHttpError } from "@core/services/httpErrorHandler";
 
 /**
  * Desktop override of handleHttpError.
@@ -6,8 +7,8 @@ import { handleHttpError as coreHandleHttpError } from '@core/services/httpError
  * login page must not appear. Instead, open the SignInModal for re-authentication.
  * All other error handling delegates to the core implementation.
  */
-export async function handleHttpError(error: any): Promise<boolean> {
-  const status: number | undefined = error?.response?.status;
+export async function handleHttpError(error: unknown): Promise<boolean> {
+  const status = isAxiosError(error) ? error.response?.status : undefined;
 
   if (status === 401) {
     // In desktop builds, 401s are handled by the auth service (token refresh + toast
diff --git a/frontend/src/desktop/services/localFileSaveService.ts b/frontend/src/desktop/services/localFileSaveService.ts
index 31794ebbad..6232c8a7c2 100644
--- a/frontend/src/desktop/services/localFileSaveService.ts
+++ b/frontend/src/desktop/services/localFileSaveService.ts
@@ -1,4 +1,7 @@
-import type { SaveResult, MultiFileSaveResult } from "@core/services/localFileSaveService";
+import type {
+  SaveResult,
+  MultiFileSaveResult,
+} from "@core/services/localFileSaveService";
 export type { SaveResult, MultiFileSaveResult };
 
 /**
@@ -10,7 +13,7 @@ export type { SaveResult, MultiFileSaveResult };
  */
 export async function saveToLocalPath(
   data: Blob | File,
-  filePath: string
+  filePath: string,
 ): Promise<SaveResult> {
   try {
     const { writeFile } = await import("@tauri-apps/plugin-fs");
@@ -19,7 +22,7 @@ export async function saveToLocalPath(
     return { success: true };
   } catch (error) {
     const message = error instanceof Error ? error.message : String(error);
-    console.error('[LocalFileSave] Failed to save:', message);
+    console.error("[LocalFileSave] Failed to save:", message);
     return { success: false, error: message };
   }
 }
@@ -33,25 +36,27 @@ export async function saveToLocalPath(
  */
 export async function showSaveDialog(
   defaultFilename: string,
-  defaultDirectory?: string
+  defaultDirectory?: string,
 ): Promise<string | null> {
   try {
     const { save } = await import("@tauri-apps/plugin-dialog");
 
     // Derive the file type filter from the filename extension so the dialog
     // doesn't force a .pdf extension when saving non-PDF outputs (e.g. .docx).
-    const ext = defaultFilename.split('.').pop()?.toLowerCase() ?? '';
+    const ext = defaultFilename.split(".").pop()?.toLowerCase() ?? "";
     const filters = ext ? [{ name: ext.toUpperCase(), extensions: [ext] }] : [];
 
     const selectedPath = await save({
-      defaultPath: defaultDirectory ? `${defaultDirectory}/${defaultFilename}` : defaultFilename,
+      defaultPath: defaultDirectory
+        ? `${defaultDirectory}/${defaultFilename}`
+        : defaultFilename,
       filters,
-      title: 'Save As'
+      title: "Save As",
     });
 
     return selectedPath;
   } catch (error) {
-    console.error('[SaveDialog] Failed to show dialog:', error);
+    console.error("[SaveDialog] Failed to show dialog:", error);
     return null;
   }
 }
@@ -65,7 +70,7 @@ export async function showSaveDialog(
  */
 export async function saveMultipleFilesWithPrompt(
   files: (Blob | File)[],
-  defaultDirectory?: string
+  defaultDirectory?: string,
 ): Promise<MultiFileSaveResult> {
   try {
     const { open } = await import("@tauri-apps/plugin-dialog");
@@ -77,7 +82,7 @@ export async function saveMultipleFilesWithPrompt(
       directory: true,
       multiple: false,
       defaultPath: defaultDirectory,
-      title: `Save ${files.length} file${files.length > 1 ? 's' : ''}`
+      title: `Save ${files.length} file${files.length > 1 ? "s" : ""}`,
     });
 
     // User cancelled
@@ -91,14 +96,15 @@ export async function saveMultipleFilesWithPrompt(
 
     for (const file of files) {
       try {
-        const fileName = file instanceof File ? file.name : `output_${savedCount + 1}.pdf`;
-        const filePath = await join(selectedFolder as string, fileName);
+        const fileName =
+          file instanceof File ? file.name : `output_${savedCount + 1}.pdf`;
+        const filePath = await join(selectedFolder, fileName);
         const arrayBuffer = await file.arrayBuffer();
         await writeFile(filePath, new Uint8Array(arrayBuffer));
         savedCount++;
       } catch (error) {
         const message = error instanceof Error ? error.message : String(error);
-        errors.push(`${file instanceof File ? file.name : 'file'}: ${message}`);
+        errors.push(`${file instanceof File ? file.name : "file"}: ${message}`);
       }
     }
 
@@ -108,18 +114,18 @@ export async function saveMultipleFilesWithPrompt(
       return {
         success: false,
         savedCount,
-        error: `Saved ${savedCount}/${files.length} files. Errors: ${errors.join(', ')}`
+        error: `Saved ${savedCount}/${files.length} files. Errors: ${errors.join(", ")}`,
       };
     } else {
       return {
         success: false,
         savedCount: 0,
-        error: `Failed to save files: ${errors.join(', ')}`
+        error: `Failed to save files: ${errors.join(", ")}`,
       };
     }
   } catch (error) {
     const message = error instanceof Error ? error.message : String(error);
-    console.error('[LocalFileSave] Failed to save multiple files:', message);
+    console.error("[LocalFileSave] Failed to save multiple files:", message);
     return { success: false, savedCount: 0, error: message };
   }
 }
diff --git a/frontend/src/desktop/services/nativePrintService.ts b/frontend/src/desktop/services/nativePrintService.ts
index 1256dba242..f941353348 100644
--- a/frontend/src/desktop/services/nativePrintService.ts
+++ b/frontend/src/desktop/services/nativePrintService.ts
@@ -25,7 +25,11 @@ async function resolvePdfSource(file?: File | Blob, url?: string | null) {
   return response.blob();
 }
 
-export async function printPdfNatively(file?: File | Blob, url?: string | null, fileName = "document.pdf") {
+export async function printPdfNatively(
+  file?: File | Blob,
+  url?: string | null,
+  fileName = "document.pdf",
+) {
   const source = await resolvePdfSource(file, url);
   if (!source) {
     throw new Error("No PDF source available for native print");
diff --git a/frontend/src/desktop/services/operationResultsSaveService.ts b/frontend/src/desktop/services/operationResultsSaveService.ts
index b3e10c3b87..89e9c9490a 100644
--- a/frontend/src/desktop/services/operationResultsSaveService.ts
+++ b/frontend/src/desktop/services/operationResultsSaveService.ts
@@ -1,10 +1,16 @@
-import type { FileId } from '@app/types/fileContext';
-import type { OperationSaveContext } from '@core/services/operationResultsSaveService';
-import { downloadFile, downloadFromUrl, DownloadResult } from '@app/services/downloadService';
+import type { FileId } from "@app/types/fileContext";
+import type { OperationSaveContext } from "@core/services/operationResultsSaveService";
+import {
+  downloadFile,
+  downloadFromUrl,
+  DownloadResult,
+} from "@app/services/downloadService";
 
 export type { OperationSaveContext };
 
-export async function saveOperationResults(context: OperationSaveContext): Promise<DownloadResult | null> {
+export async function saveOperationResults(
+  context: OperationSaveContext,
+): Promise<DownloadResult | null> {
   if (!context.downloadUrl) return null;
 
   if (context.outputFileIds && context.outputFileIds.length > 0) {
@@ -16,7 +22,7 @@ export async function saveOperationResults(context: OperationSaveContext): Promi
       const result = await downloadFile({
         data: file,
         filename: file.name,
-        localPath: stub?.localFilePath
+        localPath: stub?.localFilePath,
       });
 
       if (result.savedPath) {
@@ -28,8 +34,8 @@ export async function saveOperationResults(context: OperationSaveContext): Promi
 
   const result = await downloadFromUrl(
     context.downloadUrl,
-    context.downloadFilename || 'download',
-    context.downloadLocalPath || undefined
+    context.downloadFilename || "download",
+    context.downloadLocalPath || undefined,
   );
 
   if (context.outputFileIds && result.savedPath) {
diff --git a/frontend/src/desktop/services/operationRouter.ts b/frontend/src/desktop/services/operationRouter.ts
index b233f01181..268e3b9e7e 100644
--- a/frontend/src/desktop/services/operationRouter.ts
+++ b/frontend/src/desktop/services/operationRouter.ts
@@ -1,12 +1,15 @@
-import i18n from '@app/i18n';
-import { connectionModeService } from '@app/services/connectionModeService';
-import { tauriBackendService } from '@app/services/tauriBackendService';
-import { endpointAvailabilityService } from '@app/services/endpointAvailabilityService';
-import { selfHostedServerMonitor } from '@app/services/selfHostedServerMonitor';
-import { STIRLING_SAAS_BACKEND_API_URL } from '@app/constants/connection';
-import { CONVERSION_ENDPOINTS, ENDPOINT_NAMES } from '@app/constants/convertConstants';
+import i18n from "@app/i18n";
+import { connectionModeService } from "@app/services/connectionModeService";
+import { tauriBackendService } from "@app/services/tauriBackendService";
+import { endpointAvailabilityService } from "@app/services/endpointAvailabilityService";
+import { selfHostedServerMonitor } from "@app/services/selfHostedServerMonitor";
+import { STIRLING_SAAS_BACKEND_API_URL } from "@app/constants/connection";
+import {
+  CONVERSION_ENDPOINTS,
+  ENDPOINT_NAMES,
+} from "@app/constants/convertConstants";
 
-export type ExecutionTarget = 'local' | 'remote';
+export type ExecutionTarget = "local" | "remote";
 
 export class OperationRouter {
   private static instance: OperationRouter;
@@ -27,8 +30,8 @@ export class OperationRouter {
     const mode = await connectionModeService.getCurrentMode();
 
     // Current implementation: simple mode-based routing
-    if (mode === 'saas' || mode === 'local') {
-      return 'local';
+    if (mode === "saas" || mode === "local") {
+      return "local";
     }
 
     // In self-hosted mode, currently all operations go to remote
@@ -38,7 +41,7 @@ export class OperationRouter {
     //   return 'local';
     // }
 
-    return 'remote';
+    return "remote";
   }
 
   /**
@@ -50,12 +53,12 @@ export class OperationRouter {
     if (!endpoint) return false;
 
     const saasBackendPatterns = [
-      /^\/api\/v1\/team\//,  // Team endpoints
-      /^\/api\/v1\/auth\//,  // Auth endpoints (Supabase auth in SaaS mode)
+      /^\/api\/v1\/team\//, // Team endpoints
+      /^\/api\/v1\/auth\//, // Auth endpoints (Supabase auth in SaaS mode)
       // Add more SaaS-specific patterns here as needed
     ];
 
-    return saasBackendPatterns.some(pattern => pattern.test(endpoint));
+    return saasBackendPatterns.some((pattern) => pattern.test(endpoint));
   }
 
   /**
@@ -71,10 +74,10 @@ export class OperationRouter {
       /^\/api\/v1\/security\//,
       /^\/api\/v1\/filter\//,
       /^\/api\/v1\/multi-tool\//,
-      /^\/api\/v1\/ui-data\//,  // UI data endpoints for tools (e.g., OCR languages)
+      /^\/api\/v1\/ui-data\//, // UI data endpoints for tools (e.g., OCR languages)
     ];
 
-    return toolPatterns.some(pattern => pattern.test(endpoint));
+    return toolPatterns.some((pattern) => pattern.test(endpoint));
   }
 
   /**
@@ -96,7 +99,7 @@ export class OperationRouter {
     }
 
     // Convert endpoints: Use reverse lookup from actual constants
-    if (endpoint.startsWith('/api/v1/convert/')) {
+    if (endpoint.startsWith("/api/v1/convert/")) {
       // Find the key in CONVERSION_ENDPOINTS that matches this path
       for (const [key, path] of Object.entries(CONVERSION_ENDPOINTS)) {
         if (path === endpoint) {
@@ -105,7 +108,9 @@ export class OperationRouter {
         }
       }
       // Fallback to pattern-based extraction if not found in constants
-      const convertMatch = endpoint.match(/^\/api\/v1\/convert\/([^/]+)\/([^/]+)$/);
+      const convertMatch = endpoint.match(
+        /^\/api\/v1\/convert\/([^/]+)\/([^/]+)$/,
+      );
       if (convertMatch) {
         const [, from, to] = convertMatch;
         return `${from}-to-${to}`;
@@ -113,7 +118,9 @@ export class OperationRouter {
     }
 
     // Tool operation endpoints: /api/v1/{category}/{endpoint-name}
-    const toolMatch = endpoint.match(/^\/api\/v1\/(?:general|misc|security|filter|multi-tool)\/(.+)$/);
+    const toolMatch = endpoint.match(
+      /^\/api\/v1\/(?:general|misc|security|filter|multi-tool)\/(.+)$/,
+    );
     if (toolMatch) {
       return toolMatch[1];
     }
@@ -132,48 +139,59 @@ export class OperationRouter {
     const mode = await connectionModeService.getCurrentMode();
 
     // Local-only mode: route everything to local backend; open settings if tool unavailable
-    if (mode === 'local') {
+    if (mode === "local") {
       if (operation && this.isToolEndpoint(operation)) {
         const endpointName = this.extractEndpointName(operation);
         const backendUrl = tauriBackendService.getBackendUrl();
         if (backendUrl) {
-          const supportedLocally = await endpointAvailabilityService.isEndpointSupportedLocally(
-            endpointName,
-            backendUrl
-          );
+          const supportedLocally =
+            await endpointAvailabilityService.isEndpointSupportedLocally(
+              endpointName,
+              backendUrl,
+            );
           if (!supportedLocally) {
             // Open the connection settings so the user can sign in
-            window.dispatchEvent(new CustomEvent('appConfig:navigate', { detail: { key: 'connectionMode' } }));
+            window.dispatchEvent(
+              new CustomEvent("appConfig:navigate", {
+                detail: { key: "connectionMode" },
+              }),
+            );
             throw new Error(
               i18n.t(
-                'localMode.toolUnavailable',
-                'This tool requires an account. Sign in to Stirling Cloud or connect to a self-hosted server to use it.'
-              )
+                "localMode.toolUnavailable",
+                "This tool requires an account. Sign in to Stirling Cloud or connect to a self-hosted server to use it.",
+              ),
             );
           }
         }
       }
       const backendUrl = tauriBackendService.getBackendUrl();
       if (!backendUrl) {
-        throw new Error('Backend URL not available - backend may still be starting');
+        throw new Error(
+          "Backend URL not available - backend may still be starting",
+        );
       }
-      return backendUrl.replace(/\/$/, '');
+      return backendUrl.replace(/\/$/, "");
     }
 
     // Always route team endpoints to SaaS backend (existing logic)
-    if (mode === 'saas' && this.isSaaSBackendEndpoint(operation)) {
+    if (mode === "saas" && this.isSaaSBackendEndpoint(operation)) {
       if (!STIRLING_SAAS_BACKEND_API_URL) {
-        throw new Error('VITE_SAAS_BACKEND_API_URL not configured');
+        throw new Error("VITE_SAAS_BACKEND_API_URL not configured");
       }
-      console.debug(`[operationRouter] Routing ${operation} to SaaS backend (team endpoint)`);
-      return STIRLING_SAAS_BACKEND_API_URL.replace(/\/$/, '');
+      console.debug(
+        `[operationRouter] Routing ${operation} to SaaS backend (team endpoint)`,
+      );
+      return STIRLING_SAAS_BACKEND_API_URL.replace(/\/$/, "");
     }
 
     // NEW: Check if local backend supports this tool endpoint
-    if (mode === 'saas' && operation && this.isToolEndpoint(operation)) {
+    if (mode === "saas" && operation && this.isToolEndpoint(operation)) {
       // Extract endpoint name for capability check (e.g., "/api/v1/misc/repair" -> "repair")
       const endpointToCheck = this.extractEndpointName(operation);
-      console.debug(`[operationRouter] Checking capability for ${operation} -> endpoint name: ${endpointToCheck}`);
+      console.debug(
+        `[operationRouter] Checking capability for ${operation} -> endpoint name: ${endpointToCheck}`,
+      );
 
       const backendUrl = tauriBackendService.getBackendUrl();
       const backendHealthy = tauriBackendService.isOnline;
@@ -182,67 +200,84 @@ export class OperationRouter {
       // capability check and fall through to local routing — the backend-readiness check
       // in the Axios interceptor will block non-GET requests until the backend is healthy.
       if (backendUrl && backendHealthy) {
-        const supportedLocally = await endpointAvailabilityService.isEndpointSupportedLocally(
-          endpointToCheck,
-          backendUrl
+        const supportedLocally =
+          await endpointAvailabilityService.isEndpointSupportedLocally(
+            endpointToCheck,
+            backendUrl,
+          );
+        console.debug(
+          `[operationRouter] Endpoint ${endpointToCheck} supported locally: ${supportedLocally}`,
         );
-        console.debug(`[operationRouter] Endpoint ${endpointToCheck} supported locally: ${supportedLocally}`);
 
         if (!supportedLocally) {
           // Local backend doesn't support this - check if SaaS supports it
-          const supportedOnSaaS = await endpointAvailabilityService.isEndpointSupportedOnSaaS(endpointToCheck);
-          console.debug(`[operationRouter] Endpoint ${endpointToCheck} supported on SaaS: ${supportedOnSaaS}`);
+          const supportedOnSaaS =
+            await endpointAvailabilityService.isEndpointSupportedOnSaaS(
+              endpointToCheck,
+            );
+          console.debug(
+            `[operationRouter] Endpoint ${endpointToCheck} supported on SaaS: ${supportedOnSaaS}`,
+          );
 
           if (!supportedOnSaaS) {
             // Neither local nor SaaS support this - throw error
-            console.error(`[operationRouter] Endpoint ${endpointToCheck} not supported on local or SaaS backend`);
+            console.error(
+              `[operationRouter] Endpoint ${endpointToCheck} not supported on local or SaaS backend`,
+            );
             throw new Error(
-              `This operation (${endpointToCheck}) is not available. It may require a self-hosted instance with additional features enabled.`
+              `This operation (${endpointToCheck}) is not available. It may require a self-hosted instance with additional features enabled.`,
             );
           }
 
           // SaaS supports it - route to SaaS backend
           if (!STIRLING_SAAS_BACKEND_API_URL) {
-            console.error('[operationRouter] VITE_SAAS_BACKEND_API_URL not configured');
+            console.error(
+              "[operationRouter] VITE_SAAS_BACKEND_API_URL not configured",
+            );
             throw new Error(
-              'Cloud processing is required for this tool but VITE_SAAS_BACKEND_API_URL is not configured. ' +
-              'Please check your environment configuration.'
+              "Cloud processing is required for this tool but VITE_SAAS_BACKEND_API_URL is not configured. " +
+                "Please check your environment configuration.",
             );
           }
-          console.debug(`[operationRouter] Routing ${operation} to SaaS backend (not supported locally, but supported on SaaS)`);
-          return STIRLING_SAAS_BACKEND_API_URL.replace(/\/$/, '');
+          console.debug(
+            `[operationRouter] Routing ${operation} to SaaS backend (not supported locally, but supported on SaaS)`,
+          );
+          return STIRLING_SAAS_BACKEND_API_URL.replace(/\/$/, "");
         }
 
         // Supported locally - continue with local backend
-        console.debug(`[operationRouter] Routing ${operation} to local backend (supported locally)`);
+        console.debug(
+          `[operationRouter] Routing ${operation} to local backend (supported locally)`,
+        );
       }
     }
 
     // Self-hosted fallback: when the remote server is offline, route tool endpoints
     // to the local bundled backend if it supports them.
-    if (mode === 'selfhosted' && operation && this.isToolEndpoint(operation)) {
+    if (mode === "selfhosted" && operation && this.isToolEndpoint(operation)) {
       const { status } = selfHostedServerMonitor.getSnapshot();
-      if (status === 'offline') {
+      if (status === "offline") {
         const endpointName = this.extractEndpointName(operation);
         const localUrl = tauriBackendService.getBackendUrl();
         if (localUrl) {
-          const supportedLocally = await endpointAvailabilityService.isEndpointSupportedLocally(
-            endpointName,
-            localUrl
-          );
+          const supportedLocally =
+            await endpointAvailabilityService.isEndpointSupportedLocally(
+              endpointName,
+              localUrl,
+            );
           if (supportedLocally) {
             console.debug(
-              `[operationRouter] Self-hosted server offline, routing ${operation} to local backend`
+              `[operationRouter] Self-hosted server offline, routing ${operation} to local backend`,
             );
-            return localUrl.replace(/\/$/, '');
+            return localUrl.replace(/\/$/, "");
           }
         }
         throw new Error(
           i18n.t(
-            'selfHosted.offline.toolNotAvailableLocally',
+            "selfHosted.offline.toolNotAvailableLocally",
             'Your Stirling-PDF server is offline and "{{endpoint}}" is not available on the local backend.',
-            { endpoint: endpointName }
-          )
+            { endpoint: endpointName },
+          ),
         );
       }
     }
@@ -250,25 +285,27 @@ export class OperationRouter {
     // Existing logic for local/remote routing
     const target = await this.getExecutionTarget(operation);
 
-    if (target === 'local') {
+    if (target === "local") {
       // Use dynamically assigned port from backend service
       const backendUrl = tauriBackendService.getBackendUrl();
       if (!backendUrl) {
-        throw new Error('Backend URL not available - backend may still be starting');
+        throw new Error(
+          "Backend URL not available - backend may still be starting",
+        );
       }
       // Strip trailing slash to avoid double slashes in URLs
-      return backendUrl.replace(/\/$/, '');
+      return backendUrl.replace(/\/$/, "");
     }
 
     // Remote: get from server config
     const serverConfig = await connectionModeService.getServerConfig();
     if (!serverConfig) {
-      console.warn('No server config found');
-      throw new Error('Server configuration not found');
+      console.warn("No server config found");
+      throw new Error("Server configuration not found");
     }
 
     // Strip trailing slash to avoid double slashes in URLs
-    return serverConfig.url.replace(/\/$/, '');
+    return serverConfig.url.replace(/\/$/, "");
   }
 
   /**
@@ -276,7 +313,7 @@ export class OperationRouter {
    */
   async isSelfHostedMode(): Promise<boolean> {
     const mode = await connectionModeService.getCurrentMode();
-    return mode === 'selfhosted';
+    return mode === "selfhosted";
   }
 
   /**
@@ -284,7 +321,7 @@ export class OperationRouter {
    */
   async isSaaSMode(): Promise<boolean> {
     const mode = await connectionModeService.getCurrentMode();
-    return mode === 'saas';
+    return mode === "saas";
   }
 
   /**
@@ -302,15 +339,16 @@ export class OperationRouter {
 
     // NEW: Skip if endpoint will be routed to SaaS due to local unavailability
     const mode = await connectionModeService.getCurrentMode();
-    if (mode === 'saas' && endpoint && this.isToolEndpoint(endpoint)) {
+    if (mode === "saas" && endpoint && this.isToolEndpoint(endpoint)) {
       const backendUrl = tauriBackendService.getBackendUrl();
       // Backend not ready — don't skip the readiness check; let it gate the request.
       if (!backendUrl || !tauriBackendService.isOnline) return false;
       const endpointToCheck = this.extractEndpointName(endpoint);
-      const supportedLocally = await endpointAvailabilityService.isEndpointSupportedLocally(
-        endpointToCheck,
-        backendUrl
-      );
+      const supportedLocally =
+        await endpointAvailabilityService.isEndpointSupportedLocally(
+          endpointToCheck,
+          backendUrl,
+        );
       return !supportedLocally; // Skip check if not supported locally
     }
 
@@ -327,7 +365,7 @@ export class OperationRouter {
     const mode = await connectionModeService.getCurrentMode();
     // In local mode, show cloud badge for tools not supported locally
     // (clicking them will prompt sign-in via onUnavailableClick)
-    if (mode !== 'saas' && mode !== 'local') return false;
+    if (mode !== "saas" && mode !== "local") return false;
 
     // Team endpoints always go to SaaS
     if (this.isSaaSBackendEndpoint(endpoint)) return true;
@@ -336,10 +374,11 @@ export class OperationRouter {
     if (this.isToolEndpoint(endpoint)) {
       // For UI data endpoints, extract the endpoint name
       const endpointToCheck = this.extractEndpointName(endpoint);
-      const supportedLocally = await endpointAvailabilityService.isEndpointSupportedLocally(
-        endpointToCheck,
-        tauriBackendService.getBackendUrl()
-      );
+      const supportedLocally =
+        await endpointAvailabilityService.isEndpointSupportedLocally(
+          endpointToCheck,
+          tauriBackendService.getBackendUrl(),
+        );
       return !supportedLocally;
     }
 
diff --git a/frontend/src/desktop/services/saasBillingService.ts b/frontend/src/desktop/services/saasBillingService.ts
index a607a620f7..61c0ee99ec 100644
--- a/frontend/src/desktop/services/saasBillingService.ts
+++ b/frontend/src/desktop/services/saasBillingService.ts
@@ -1,11 +1,19 @@
-import { open as shellOpen } from '@tauri-apps/plugin-shell';
-import { fetch as tauriFetch } from '@tauri-apps/plugin-http';
-import { supabase } from '@app/auth/supabase';
-import { authService } from '@app/services/authService';
-import { connectionModeService } from '@app/services/connectionModeService';
-import { STIRLING_SAAS_URL, STIRLING_SAAS_BACKEND_API_URL, SUPABASE_KEY } from '@app/constants/connection';
-import type { TierLevel, SubscriptionStatus, StripePlanId } from '@app/types/billing';
-import { getCurrencySymbol } from '@app/config/billing';
+import { open as shellOpen } from "@tauri-apps/plugin-shell";
+import { fetch as tauriFetch } from "@tauri-apps/plugin-http";
+import { supabase } from "@app/auth/supabase";
+import { authService } from "@app/services/authService";
+import { connectionModeService } from "@app/services/connectionModeService";
+import {
+  STIRLING_SAAS_URL,
+  STIRLING_SAAS_BACKEND_API_URL,
+  SUPABASE_KEY,
+} from "@app/constants/connection";
+import type {
+  TierLevel,
+  SubscriptionStatus,
+  StripePlanId,
+} from "@app/types/billing";
+import { getCurrencySymbol } from "@app/config/billing";
 
 /**
  * Billing status returned from Supabase edge function
@@ -64,9 +72,12 @@ export class SaasBillingService {
     try {
       const mode = await connectionModeService.getCurrentMode();
       const isAuthenticated = await authService.isAuthenticated();
-      return mode === 'saas' && isAuthenticated;
+      return mode === "saas" && isAuthenticated;
     } catch (error) {
-      console.error('[Desktop Billing] Failed to check billing availability:', error);
+      console.error(
+        "[Desktop Billing] Failed to check billing availability:",
+        error,
+      );
       return false;
     }
   }
@@ -79,13 +90,13 @@ export class SaasBillingService {
     // Check if in SaaS mode
     const isAvailable = await this.isBillingAvailable();
     if (!isAvailable) {
-      throw new Error('Billing is only available in SaaS mode');
+      throw new Error("Billing is only available in SaaS mode");
     }
 
     // Get JWT token for authentication
     const token = await authService.getAuthToken();
     if (!token) {
-      throw new Error('No authentication token available');
+      throw new Error("No authentication token available");
     }
 
     try {
@@ -93,58 +104,63 @@ export class SaasBillingService {
       const rpcUrl = `${STIRLING_SAAS_URL}/rest/v1/rpc/get_user_billing_status`;
 
       const response = await tauriFetch(rpcUrl, {
-        method: 'POST',
+        method: "POST",
         headers: {
-          'Content-Type': 'application/json',
-          'apikey': SUPABASE_KEY || '',
-          'Authorization': `Bearer ${token}`,
+          "Content-Type": "application/json",
+          apikey: SUPABASE_KEY || "",
+          Authorization: `Bearer ${token}`,
         },
         body: JSON.stringify({}),
       });
 
       if (!response.ok) {
         const errorText = await response.text();
-        console.error('[Desktop Billing] RPC error response:', errorText);
-        throw new Error(`RPC call failed: ${response.status} ${response.statusText}`);
+        console.error("[Desktop Billing] RPC error response:", errorText);
+        throw new Error(
+          `RPC call failed: ${response.status} ${response.statusText}`,
+        );
       }
 
       // RPC may return an array or a single object — normalise to array then take first element
-      const raw = await response.json() as unknown;
-      const billingDataArray = Array.isArray(raw) ? raw : (raw ? [raw] : []);
-      const billingData = billingDataArray[0] as {
-        user_id: string;
-        has_metered_billing_enabled: boolean;
-        is_pro: boolean;
-      } | undefined;
+      const raw = (await response.json()) as unknown;
+      const billingDataArray = Array.isArray(raw) ? raw : raw ? [raw] : [];
+      const billingData = billingDataArray[0] as
+        | {
+            user_id: string;
+            has_metered_billing_enabled: boolean;
+            is_pro: boolean;
+          }
+        | undefined;
 
       // Determine tier based on pro status
       const isPro = billingData?.is_pro || false;
-      const tier: BillingStatus['tier'] = isPro ? 'team' : 'free';
+      const tier: BillingStatus["tier"] = isPro ? "team" : "free";
 
       // Fetch additional subscription details if pro
-      let subscription: BillingStatus['subscription'] = null;
-      let meterUsage: BillingStatus['meterUsage'] = null;
+      let subscription: BillingStatus["subscription"] = null;
+      let meterUsage: BillingStatus["meterUsage"] = null;
       let isTrialing = false;
       let trialDaysRemaining: number | undefined;
 
       if (isPro) {
         // Fetch usage details
         try {
-          const { data: usageData, error: usageError } = await supabase.functions.invoke<{
-            subscription: BillingStatus['subscription'];
-            meterUsage: BillingStatus['meterUsage'];
-          }>('get-usage-billing', {
-            headers: {
-              Authorization: `Bearer ${token}`,
-            },
-            body: {},
-          });
+          const { data: usageData, error: usageError } =
+            await supabase.functions.invoke<{
+              subscription: BillingStatus["subscription"];
+              meterUsage: BillingStatus["meterUsage"];
+            }>("get-usage-billing", {
+              headers: {
+                Authorization: `Bearer ${token}`,
+              },
+              body: {},
+            });
 
           if (!usageError && usageData) {
             subscription = usageData.subscription;
             meterUsage = usageData.meterUsage;
 
-            if (subscription?.status === 'trialing') {
+            if (subscription?.status === "trialing") {
               isTrialing = true;
               const trialEnd = subscription.currentPeriodEnd;
               const now = Math.floor(Date.now() / 1000);
@@ -152,9 +168,11 @@ export class SaasBillingService {
             }
           }
         } catch (usageError) {
-          console.warn('[Desktop Billing] Failed to fetch usage data:', usageError);
+          console.warn(
+            "[Desktop Billing] Failed to fetch usage data:",
+            usageError,
+          );
         }
-
       }
 
       // Fetch credit balance for all authenticated users (both Pro and Free)
@@ -163,9 +181,9 @@ export class SaasBillingService {
       try {
         const creditsEndpoint = `${STIRLING_SAAS_BACKEND_API_URL}/api/v1/credits`;
         const creditResponse = await tauriFetch(creditsEndpoint, {
-          method: 'GET',
+          method: "GET",
           headers: {
-            'Authorization': `Bearer ${token}`,
+            Authorization: `Bearer ${token}`,
           },
         });
 
@@ -173,14 +191,21 @@ export class SaasBillingService {
           const creditData = await creditResponse.json();
           // Backend returns { totalAvailableCredits: number, ... }
           const credits = creditData?.totalAvailableCredits;
-          creditBalance = typeof credits === 'number' ? credits : 0;
+          creditBalance = typeof credits === "number" ? credits : 0;
         } else {
           const errorText = await creditResponse.text();
-          console.warn('[Desktop Billing] Failed to fetch credit balance:', creditResponse.status, errorText);
+          console.warn(
+            "[Desktop Billing] Failed to fetch credit balance:",
+            creditResponse.status,
+            errorText,
+          );
           creditBalance = 0;
         }
       } catch (error) {
-        console.error('[Desktop Billing] Error fetching credit balance:', error);
+        console.error(
+          "[Desktop Billing] Error fetching credit balance:",
+          error,
+        );
         creditBalance = 0;
       }
 
@@ -195,13 +220,13 @@ export class SaasBillingService {
 
       return billingStatus;
     } catch (error) {
-      console.error('[Desktop Billing] Failed to fetch billing status:', error);
+      console.error("[Desktop Billing] Failed to fetch billing status:", error);
 
       if (error instanceof Error) {
         throw error;
       }
 
-      throw new Error('Failed to fetch billing status', { cause: error });
+      throw new Error("Failed to fetch billing status", { cause: error });
     }
   }
 
@@ -213,45 +238,54 @@ export class SaasBillingService {
     // Check if in SaaS mode
     const isAvailable = await this.isBillingAvailable();
     if (!isAvailable) {
-      throw new Error('Billing portal is only available in SaaS mode');
+      throw new Error("Billing portal is only available in SaaS mode");
     }
 
     // Get JWT token for authentication
     const token = await authService.getAuthToken();
     if (!token) {
-      throw new Error('No authentication token available');
+      throw new Error("No authentication token available");
     }
 
     try {
       // Call Supabase edge function to get Stripe portal URL
-      const { data, error } = await supabase.functions.invoke<ManageBillingResponse>('manage-billing', {
-        headers: {
-          Authorization: `Bearer ${token}`,
-        },
-        body: {
-          return_url: returnUrl,
-        },
-      });
+      const { data, error } =
+        await supabase.functions.invoke<ManageBillingResponse>(
+          "manage-billing",
+          {
+            headers: {
+              Authorization: `Bearer ${token}`,
+            },
+            body: {
+              return_url: returnUrl,
+            },
+          },
+        );
 
       if (error) {
-        console.error('[Desktop Billing] Error creating billing portal session:', error);
-        throw new Error(error.message || 'Failed to create billing portal session');
+        console.error(
+          "[Desktop Billing] Error creating billing portal session:",
+          error,
+        );
+        throw new Error(
+          error.message || "Failed to create billing portal session",
+        );
       }
 
       if (!data || !data.url) {
-        throw new Error('No portal URL returned from manage-billing');
+        throw new Error("No portal URL returned from manage-billing");
       }
 
       // Open in system browser (same pattern as OAuth)
       await shellOpen(data.url);
     } catch (error) {
-      console.error('[Desktop Billing] Failed to open billing portal:', error);
+      console.error("[Desktop Billing] Failed to open billing portal:", error);
 
       if (error instanceof Error) {
         throw error;
       }
 
-      throw new Error('Failed to open billing portal', { cause: error });
+      throw new Error("Failed to open billing portal", { cause: error });
     }
   }
 
@@ -259,48 +293,50 @@ export class SaasBillingService {
    * Fetch available plan pricing from Stripe
    * Calls stripe-price-lookup edge function to get current pricing for all plans
    */
-  async getAvailablePlans(currencyCode: string = 'usd'): Promise<Map<string, PlanPrice>> {
+  async getAvailablePlans(
+    currencyCode: string = "usd",
+  ): Promise<Map<string, PlanPrice>> {
     // Check if in SaaS mode
     const isAvailable = await this.isBillingAvailable();
     if (!isAvailable) {
-      throw new Error('Billing is only available in SaaS mode');
+      throw new Error("Billing is only available in SaaS mode");
     }
 
     // Get JWT token for authentication
     const token = await authService.getAuthToken();
     if (!token) {
-      throw new Error('No authentication token available');
+      throw new Error("No authentication token available");
     }
 
     try {
       const { data, error } = await supabase.functions.invoke<{
         prices: Record<string, { unit_amount: number; currency: string }>;
         missing: string[];
-      }>('stripe-price-lookup', {
+      }>("stripe-price-lookup", {
         headers: {
           Authorization: `Bearer ${token}`,
         },
         body: {
-          lookup_keys: ['plan:pro', 'meter:overage'],
+          lookup_keys: ["plan:pro", "meter:overage"],
           currency: currencyCode,
         },
       });
 
       if (error) {
-        throw new Error(error.message || 'Failed to fetch plan pricing');
+        throw new Error(error.message || "Failed to fetch plan pricing");
       }
 
       if (!data || !data.prices) {
-        throw new Error('No pricing data returned');
+        throw new Error("No pricing data returned");
       }
 
       // Map prices with currency symbols
       const plans = new Map<string, PlanPrice>();
-      const proPrice = data.prices['plan:pro'];
-      const overagePrice = data.prices['meter:overage'];
+      const proPrice = data.prices["plan:pro"];
+      const overagePrice = data.prices["meter:overage"];
 
       if (proPrice) {
-        plans.set('team', {
+        plans.set("team", {
           price: proPrice.unit_amount / 100,
           currency: getCurrencySymbol(proPrice.currency),
           overagePrice: overagePrice ? overagePrice.unit_amount / 100 : 0.05,
@@ -309,7 +345,7 @@ export class SaasBillingService {
 
       return plans;
     } catch (error) {
-      console.error('[Desktop Billing] Error fetching available plans:', error);
+      console.error("[Desktop Billing] Error fetching available plans:", error);
       throw error;
     }
   }
@@ -322,51 +358,60 @@ export class SaasBillingService {
     // Check if in SaaS mode
     const isAvailable = await this.isBillingAvailable();
     if (!isAvailable) {
-      throw new Error('Checkout is only available in SaaS mode');
+      throw new Error("Checkout is only available in SaaS mode");
     }
 
     // Get JWT token for authentication
     const token = await authService.getAuthToken();
     if (!token) {
-      throw new Error('No authentication token available');
+      throw new Error("No authentication token available");
     }
 
     try {
       // Call Supabase edge function to create checkout session
       // Use 'hosted' mode for browser redirect instead of 'embedded'
-      const { data, error } = await supabase.functions.invoke<{ url: string }>('create-checkout', {
-        headers: {
-          Authorization: `Bearer ${token}`,
+      const { data, error } = await supabase.functions.invoke<{ url: string }>(
+        "create-checkout",
+        {
+          headers: {
+            Authorization: `Bearer ${token}`,
+          },
+          body: {
+            ui_mode: "hosted",
+            success_url: `${returnUrl}/checkout/success`,
+            cancel_url: `${returnUrl}/checkout/cancel`,
+            purchase_type: "subscription",
+            plan: planId,
+          },
         },
-        body: {
-          ui_mode: 'hosted',
-          success_url: `${returnUrl}/checkout/success`,
-          cancel_url: `${returnUrl}/checkout/cancel`,
-          purchase_type: 'subscription',
-          plan: planId,
-        },
-      });
+      );
 
       if (error) {
-        console.error('[Desktop Billing] Error creating checkout session:', error);
-        throw new Error(error.message || 'Failed to create checkout session');
+        console.error(
+          "[Desktop Billing] Error creating checkout session:",
+          error,
+        );
+        throw new Error(error.message || "Failed to create checkout session");
       }
 
       if (!data || !data.url) {
-        console.error('[Desktop Billing] Invalid response data:', data);
-        throw new Error('No checkout URL returned from create-checkout');
+        console.error("[Desktop Billing] Invalid response data:", data);
+        throw new Error("No checkout URL returned from create-checkout");
       }
 
       // Open in system browser (same pattern as billing portal)
       await shellOpen(data.url);
     } catch (error) {
-      console.error('[Desktop Billing] Failed to create checkout session:', error);
+      console.error(
+        "[Desktop Billing] Failed to create checkout session:",
+        error,
+      );
 
       if (error instanceof Error) {
         throw error;
       }
 
-      throw new Error('Failed to create checkout session', { cause: error });
+      throw new Error("Failed to create checkout session", { cause: error });
     }
   }
 }
diff --git a/frontend/src/desktop/services/saasErrorInterceptor.ts b/frontend/src/desktop/services/saasErrorInterceptor.ts
index 06e5dc963c..0b4a100095 100644
--- a/frontend/src/desktop/services/saasErrorInterceptor.ts
+++ b/frontend/src/desktop/services/saasErrorInterceptor.ts
@@ -1,5 +1,6 @@
-import { extractAxiosErrorMessage } from '@app/services/httpErrorUtils';
-import { alert } from '@app/components/toast';
+import { isAxiosError } from "axios";
+import { extractAxiosErrorMessage } from "@app/services/httpErrorUtils";
+import { alert } from "@app/components/toast";
 
 /**
  * Desktop implementation: intercepts errors from SaaS backend requests
@@ -12,18 +13,26 @@ import { alert } from '@app/components/toast';
  * false if this is not a SaaS error.
  */
 export function handleSaaSError(error: unknown): boolean {
-  if ((error as any)?.config?._isSaaSRequest !== true) return false;
+  if (
+    !isAxiosError(error) ||
+    (error.config as { _isSaaSRequest?: boolean })?._isSaaSRequest !== true
+  )
+    return false;
 
-  const { title: originalTitle, body: originalBody } = extractAxiosErrorMessage(error);
+  const { title: originalTitle, body: originalBody } =
+    extractAxiosErrorMessage(error);
 
   alert({
-    alertType: 'error',
-    title: 'Cloud Processing Failed',
+    alertType: "error",
+    title: "Cloud Processing Failed",
     body: `This tool requires cloud processing but encountered an error: ${originalBody}. Please check your connection and try again.`,
     expandable: true,
     isPersistentPopup: false,
   });
 
-  console.error('[saasErrorInterceptor] SaaS backend error:', { originalTitle, originalBody });
+  console.error("[saasErrorInterceptor] SaaS backend error:", {
+    originalTitle,
+    originalBody,
+  });
   return true;
 }
diff --git a/frontend/src/desktop/services/selfHostedServerMonitor.ts b/frontend/src/desktop/services/selfHostedServerMonitor.ts
index dfb4085a97..68b8618bce 100644
--- a/frontend/src/desktop/services/selfHostedServerMonitor.ts
+++ b/frontend/src/desktop/services/selfHostedServerMonitor.ts
@@ -1,7 +1,7 @@
-import { fetch } from '@tauri-apps/plugin-http';
+import { fetch } from "@tauri-apps/plugin-http";
 
 export interface SelfHostedServerState {
-  status: 'idle' | 'checking' | 'online' | 'offline';
+  status: "idle" | "checking" | "online" | "offline";
   isOnline: boolean;
   serverUrl: string | null;
 }
@@ -25,7 +25,7 @@ class SelfHostedServerMonitor {
   private static instance: SelfHostedServerMonitor;
 
   private state: SelfHostedServerState = {
-    status: 'idle',
+    status: "idle",
     isOnline: false,
     serverUrl: null,
   };
@@ -53,7 +53,7 @@ class SelfHostedServerMonitor {
 
     this.stop();
 
-    this.updateState({ serverUrl, status: 'checking', isOnline: false });
+    this.updateState({ serverUrl, status: "checking", isOnline: false });
 
     void this.pollOnce(serverUrl);
     this.intervalId = setInterval(() => {
@@ -67,7 +67,7 @@ class SelfHostedServerMonitor {
       clearInterval(this.intervalId);
       this.intervalId = null;
     }
-    this.updateState({ status: 'idle', isOnline: false, serverUrl: null });
+    this.updateState({ status: "idle", isOnline: false, serverUrl: null });
   }
 
   get isOnline(): boolean {
@@ -96,22 +96,22 @@ class SelfHostedServerMonitor {
   }
 
   private async pollOnce(serverUrl: string): Promise<void> {
-    const healthUrl = `${serverUrl.replace(/\/$/, '')}/api/v1/info/status`;
+    const healthUrl = `${serverUrl.replace(/\/$/, "")}/api/v1/info/status`;
 
     try {
       const response = await fetch(healthUrl, {
-        method: 'GET',
+        method: "GET",
         connectTimeout: REQUEST_TIMEOUT_MS,
       });
 
       // 401/403 means the server is running but requires authentication — treat as online
       if (response.ok || response.status === 401 || response.status === 403) {
-        this.updateState({ status: 'online', isOnline: true });
+        this.updateState({ status: "online", isOnline: true });
       } else {
-        this.updateState({ status: 'offline', isOnline: false });
+        this.updateState({ status: "offline", isOnline: false });
       }
     } catch {
-      this.updateState({ status: 'offline', isOnline: false });
+      this.updateState({ status: "offline", isOnline: false });
     }
   }
 
@@ -126,7 +126,7 @@ class SelfHostedServerMonitor {
     this.state = next;
 
     if (changed) {
-      this.listeners.forEach(listener => listener(this.state));
+      this.listeners.forEach((listener) => listener(this.state));
     }
   }
 }
diff --git a/frontend/src/desktop/services/tauriBackendService.ts b/frontend/src/desktop/services/tauriBackendService.ts
index 703fa9d388..6a3df0ccbf 100644
--- a/frontend/src/desktop/services/tauriBackendService.ts
+++ b/frontend/src/desktop/services/tauriBackendService.ts
@@ -1,13 +1,13 @@
-import { invoke } from '@tauri-apps/api/core';
-import { fetch } from '@tauri-apps/plugin-http';
-import { alert } from '@app/components/toast';
+import { invoke } from "@tauri-apps/api/core";
+import { fetch } from "@tauri-apps/plugin-http";
+import { alert } from "@app/components/toast";
 
-export type BackendStatus = 'stopped' | 'starting' | 'healthy' | 'unhealthy';
+export type BackendStatus = "stopped" | "starting" | "healthy" | "unhealthy";
 
 export class TauriBackendService {
   private static instance: TauriBackendService;
   private backendStarted = false;
-  private backendStatus: BackendStatus = 'stopped';
+  private backendStatus: BackendStatus = "stopped";
   private backendPort: number | null = null;
   private healthMonitor: Promise<void> | null = null;
   private startPromise: Promise<void> | null = null;
@@ -35,7 +35,7 @@ export class TauriBackendService {
   }
 
   get isOnline(): boolean {
-    return this.backendStatus === 'healthy';
+    return this.backendStatus === "healthy";
   }
 
   getBackendPort(): number | null {
@@ -58,16 +58,16 @@ export class TauriBackendService {
       return;
     }
     this.backendStatus = status;
-    this.statusListeners.forEach(listener => listener(status));
+    this.statusListeners.forEach((listener) => listener(status));
 
-    if (status === 'healthy') {
+    if (status === "healthy") {
       // Reset restart counter on successful recovery so future failures get a full retry budget.
       this.restartAttempts = 0;
     }
 
     // Auto-recovery: when our own backend goes unhealthy, try restarting it
     // before reporting as permanently offline.
-    if (status === 'unhealthy' && this.isLocalBackend && !this.isRecovering) {
+    if (status === "unhealthy" && this.isLocalBackend && !this.isRecovering) {
       this.scheduleRecovery();
     }
   }
@@ -78,7 +78,7 @@ export class TauriBackendService {
     // should resolve on their own before we attempt a full restart.
     this.recoveryTimer = setTimeout(() => {
       this.recoveryTimer = null;
-      if (this.backendStatus !== 'unhealthy') return; // Recovered on its own
+      if (this.backendStatus !== "unhealthy") return; // Recovered on its own
       void this.attemptRestart();
     }, 2000);
   }
@@ -86,20 +86,24 @@ export class TauriBackendService {
   async attemptRestart(): Promise<void> {
     if (this.isRecovering) return;
     if (this.restartAttempts >= TauriBackendService.MAX_RESTART_ATTEMPTS) {
-      console.error(`[TauriBackendService] Backend failed after ${TauriBackendService.MAX_RESTART_ATTEMPTS} restart attempts, giving up.`);
+      console.error(
+        `[TauriBackendService] Backend failed after ${TauriBackendService.MAX_RESTART_ATTEMPTS} restart attempts, giving up.`,
+      );
       alert({
-        alertType: 'error',
-        title: 'Backend failed to restart',
-        body: 'The local backend could not be recovered. Please restart the app.',
+        alertType: "error",
+        title: "Backend failed to restart",
+        body: "The local backend could not be recovered. Please restart the app.",
         isPersistentPopup: true,
       });
       return;
     }
     this.restartAttempts++;
-    console.log(`[TauriBackendService] Backend unhealthy, attempting restart (${this.restartAttempts}/${TauriBackendService.MAX_RESTART_ATTEMPTS})...`);
+    console.log(
+      `[TauriBackendService] Backend unhealthy, attempting restart (${this.restartAttempts}/${TauriBackendService.MAX_RESTART_ATTEMPTS})...`,
+    );
     alert({
-      alertType: 'warning',
-      title: 'Backend stopped unexpectedly',
+      alertType: "warning",
+      title: "Backend stopped unexpectedly",
       body: `Attempting to restart... (${this.restartAttempts}/${TauriBackendService.MAX_RESTART_ATTEMPTS})`,
       durationMs: 5000,
     });
@@ -107,29 +111,31 @@ export class TauriBackendService {
     // Reset started flag so startBackend() will run again
     this.backendStarted = false;
     this.startPromise = null;
-    this.setStatus('starting');
+    this.setStatus("starting");
     try {
       await this.startBackend();
       this.restartAttempts = 0; // Reset on successful restart
       this.isRecovering = false;
-      console.log('[TauriBackendService] Backend restarted successfully.');
+      console.log("[TauriBackendService] Backend restarted successfully.");
       alert({
-        alertType: 'success',
-        title: 'Backend restarted',
-        body: 'The local backend is back online.',
+        alertType: "success",
+        title: "Backend restarted",
+        body: "The local backend is back online.",
         durationMs: 4000,
       });
     } catch (err) {
-      console.error('[TauriBackendService] Restart failed:', err);
+      console.error("[TauriBackendService] Restart failed:", err);
       // Set isRecovering = false BEFORE setStatus to prevent re-triggering scheduleRecovery
       // if the max attempts check above doesn't catch it next time.
       this.isRecovering = false;
       if (this.restartAttempts < TauriBackendService.MAX_RESTART_ATTEMPTS) {
-        this.setStatus('unhealthy'); // Will trigger another scheduleRecovery
+        this.setStatus("unhealthy"); // Will trigger another scheduleRecovery
       } else {
         // Don't call setStatus('unhealthy') — the status is already unhealthy and calling it
         // again would bypass the dedup check and re-trigger scheduleRecovery.
-        console.error('[TauriBackendService] Max restart attempts reached, backend is permanently unhealthy.');
+        console.error(
+          "[TauriBackendService] Max restart attempts reached, backend is permanently unhealthy.",
+        );
       }
     }
   }
@@ -146,7 +152,7 @@ export class TauriBackendService {
     }
 
     this.backendStarted = true; // Mark as active for health checks
-    this.setStatus('starting');
+    this.setStatus("starting");
     this.beginHealthMonitoring();
 
     // Discover the local bundled backend port in the background.
@@ -166,20 +172,20 @@ export class TauriBackendService {
       return this.startPromise;
     }
 
-    this.setStatus('starting');
+    this.setStatus("starting");
 
-    this.startPromise = invoke('start_backend', { backendUrl })
+    this.startPromise = invoke("start_backend", { backendUrl })
       .then(async () => {
         this.backendStarted = true;
-        this.setStatus('starting');
+        this.setStatus("starting");
 
         // Poll for the dynamically assigned port
         await this.waitForPort();
         this.beginHealthMonitoring();
       })
       .catch((error) => {
-        this.setStatus('unhealthy');
-        console.error('[TauriBackendService] Failed to start backend:', error);
+        this.setStatus("unhealthy");
+        console.error("[TauriBackendService] Failed to start backend:", error);
         throw error;
       })
       .finally(() => {
@@ -192,17 +198,19 @@ export class TauriBackendService {
   private async waitForPort(): Promise<void> {
     while (true) {
       try {
-        const port = await invoke<number | null>('get_backend_port');
+        const port = await invoke<number | null>("get_backend_port");
         if (port) {
           this.backendPort = port;
           // Notify status listeners so hooks reading getBackendUrl() re-evaluate
-          this.statusListeners.forEach(listener => listener(this.backendStatus));
+          this.statusListeners.forEach((listener) =>
+            listener(this.backendStatus),
+          );
           return;
         }
       } catch (error) {
-        console.error('Failed to get backend port:', error);
+        console.error("Failed to get backend port:", error);
       }
-      await new Promise(resolve => setTimeout(resolve, 500));
+      await new Promise((resolve) => setTimeout(resolve, 500));
     }
   }
 
@@ -212,7 +220,7 @@ export class TauriBackendService {
     }
     this.healthMonitor = this.waitForHealthy()
       .catch((error) => {
-        console.error('Backend failed to become healthy:', error);
+        console.error("Backend failed to become healthy:", error);
       })
       .finally(() => {
         this.healthMonitor = null;
@@ -222,36 +230,47 @@ export class TauriBackendService {
   /** Always checks the local bundled backend at localhost:{port}. */
   async checkBackendHealth(): Promise<boolean> {
     if (!this.backendStarted) {
-      console.debug('[TauriBackendService] Health check: backend not started');
-      this.setStatus('stopped');
+      console.debug("[TauriBackendService] Health check: backend not started");
+      this.setStatus("stopped");
       return false;
     }
     if (!this.backendPort) {
-      console.debug('[TauriBackendService] Health check: backend port not available');
+      console.debug(
+        "[TauriBackendService] Health check: backend port not available",
+      );
       return false;
     }
 
     const configUrl = `http://localhost:${this.backendPort}/api/v1/config/app-config`;
-    console.debug(`[TauriBackendService] Checking local backend health at: ${configUrl}`);
+    console.debug(
+      `[TauriBackendService] Checking local backend health at: ${configUrl}`,
+    );
 
     try {
-      const response = await fetch(configUrl, { method: 'GET', connectTimeout: 5000 });
+      const response = await fetch(configUrl, {
+        method: "GET",
+        connectTimeout: 5000,
+      });
 
       if (!response.ok) {
-        console.warn(`[TauriBackendService] Health check failed: ${response.status}`);
-        this.setStatus('unhealthy');
+        console.warn(
+          `[TauriBackendService] Health check failed: ${response.status}`,
+        );
+        this.setStatus("unhealthy");
         return false;
       }
 
       const data = await response.json();
       const dependenciesReady = data.dependenciesReady === true;
-      console.debug(`[TauriBackendService] dependenciesReady=${dependenciesReady}`);
+      console.debug(
+        `[TauriBackendService] dependenciesReady=${dependenciesReady}`,
+      );
 
-      this.setStatus(dependenciesReady ? 'healthy' : 'starting');
+      this.setStatus(dependenciesReady ? "healthy" : "starting");
       return dependenciesReady;
     } catch (error) {
-      console.error('[TauriBackendService] Health check error:', error);
-      this.setStatus('unhealthy');
+      console.error("[TauriBackendService] Health check error:", error);
+      this.setStatus("unhealthy");
       return false;
     }
   }
@@ -262,7 +281,7 @@ export class TauriBackendService {
       if (isHealthy) {
         return;
       }
-      await new Promise(resolve => setTimeout(resolve, 1000));
+      await new Promise((resolve) => setTimeout(resolve, 1000));
     }
   }
 
@@ -279,7 +298,7 @@ export class TauriBackendService {
       clearTimeout(this.recoveryTimer);
       this.recoveryTimer = null;
     }
-    this.setStatus('stopped');
+    this.setStatus("stopped");
     this.healthMonitor = null;
     this.startPromise = null;
   }
diff --git a/frontend/src/desktop/services/tauriHttpClient.ts b/frontend/src/desktop/services/tauriHttpClient.ts
index 43b2cd45bc..c214f1330e 100644
--- a/frontend/src/desktop/services/tauriHttpClient.ts
+++ b/frontend/src/desktop/services/tauriHttpClient.ts
@@ -1,4 +1,5 @@
-import { fetch } from '@tauri-apps/plugin-http';
+/* eslint-disable @typescript-eslint/no-explicit-any -- Axios-compatible API requires matching axios's `any` signatures */
+import { fetch } from "@tauri-apps/plugin-http";
 
 /**
  * Tauri HTTP Client - wrapper around Tauri's native HTTP client
@@ -21,7 +22,7 @@ export interface TauriHttpRequestConfig {
   params?: Record<string, string | number | boolean> | any;
   data?: any;
   timeout?: number;
-  responseType?: 'json' | 'text' | 'blob' | 'arraybuffer';
+  responseType?: "json" | "text" | "blob" | "arraybuffer";
   withCredentials?: boolean;
   // Custom properties for desktop
   operationName?: string;
@@ -42,44 +43,63 @@ export interface TauriHttpError extends Error {
   toJSON: () => object;
 }
 
-type RequestInterceptor = (config: TauriHttpRequestConfig) => Promise<TauriHttpRequestConfig> | TauriHttpRequestConfig;
-type ResponseInterceptor<T = any> = (response: TauriHttpResponse<T>) => Promise<TauriHttpResponse<T>> | TauriHttpResponse<T>;
+type RequestInterceptor = (
+  config: TauriHttpRequestConfig,
+) => Promise<TauriHttpRequestConfig> | TauriHttpRequestConfig;
+type ResponseInterceptor<T = any> = (
+  response: TauriHttpResponse<T>,
+) => Promise<TauriHttpResponse<T>> | TauriHttpResponse<T>;
 type ErrorInterceptor = (error: any) => Promise<any>;
 
 interface Interceptors {
   request: {
     handlers: RequestInterceptor[];
-    use: (onFulfilled: RequestInterceptor, onRejected?: ErrorInterceptor) => number;
+    use: (
+      onFulfilled: RequestInterceptor,
+      onRejected?: ErrorInterceptor,
+    ) => number;
   };
   response: {
     handlers: { fulfilled: ResponseInterceptor; rejected?: ErrorInterceptor }[];
-    use: (onFulfilled: ResponseInterceptor, onRejected?: ErrorInterceptor) => number;
+    use: (
+      onFulfilled: ResponseInterceptor,
+      onRejected?: ErrorInterceptor,
+    ) => number;
   };
 }
 
 class TauriHttpClient {
   public defaults: TauriHttpRequestConfig = {
-    baseURL: '',
+    baseURL: "",
     headers: {
-      'User-Agent': 'StirlingPDF-Desktop/1.0 Tauri',
+      "User-Agent": "StirlingPDF-Desktop/1.0 Tauri",
     },
     timeout: 120000,
-    responseType: 'json',
+    responseType: "json",
     withCredentials: false, // Desktop doesn't need credentials (backend has allowCredentials=false)
   };
 
   public interceptors: Interceptors = {
     request: {
       handlers: [],
-      use: (onFulfilled: RequestInterceptor, _onRejected?: ErrorInterceptor) => {
+      use: (
+        onFulfilled: RequestInterceptor,
+        _onRejected?: ErrorInterceptor,
+      ) => {
         this.interceptors.request.handlers.push(onFulfilled);
         return this.interceptors.request.handlers.length - 1;
       },
     },
     response: {
       handlers: [],
-      use: (onFulfilled: ResponseInterceptor, onRejected?: ErrorInterceptor) => {
-        this.interceptors.response.handlers.push({ fulfilled: onFulfilled, rejected: onRejected });
+      use: (
+        onFulfilled: ResponseInterceptor,
+        onRejected?: ErrorInterceptor,
+      ) => {
+        this.interceptors.response.handlers.push({
+          fulfilled: onFulfilled,
+          rejected: onRejected,
+        });
         return this.interceptors.response.handlers.length - 1;
       },
     },
@@ -91,7 +111,13 @@ class TauriHttpClient {
     }
   }
 
-  private createError(message: string, config?: TauriHttpRequestConfig, code?: string, response?: TauriHttpResponse, originalError?: unknown): TauriHttpError {
+  private createError(
+    message: string,
+    config?: TauriHttpRequestConfig,
+    code?: string,
+    response?: TauriHttpResponse,
+    originalError?: unknown,
+  ): TauriHttpError {
     const error = new Error(message) as TauriHttpError;
     error.config = config;
     error.code = code;
@@ -105,54 +131,61 @@ class TauriHttpClient {
     });
 
     // Log detailed error information for debugging
-    console.error('[TauriHttpClient] Error details:', {
+    console.error("[TauriHttpClient] Error details:", {
       message,
       code,
       url: config?.url,
       method: config?.method,
       status: response?.status,
-      originalError: originalError instanceof Error ? {
-        name: originalError.name,
-        message: originalError.message,
-        stack: originalError.stack,
-      } : originalError,
+      originalError:
+        originalError instanceof Error
+          ? {
+              name: originalError.name,
+              message: originalError.message,
+              stack: originalError.stack,
+            }
+          : originalError,
     });
 
     return error;
   }
 
   private buildUrl(config: TauriHttpRequestConfig): string {
-    let url = config.url || '';
+    let url = config.url || "";
 
     // If URL is already absolute, use it as-is
-    if (url.startsWith('http://') || url.startsWith('https://')) {
+    if (url.startsWith("http://") || url.startsWith("https://")) {
       return url;
     }
 
     // Prepend baseURL if present
-    const baseURL = config.baseURL || this.defaults.baseURL || '';
+    const baseURL = config.baseURL || this.defaults.baseURL || "";
     if (baseURL) {
       url = baseURL + url;
     }
 
     // Add query parameters
-    if (config.params && typeof config.params === 'object') {
+    if (config.params && typeof config.params === "object") {
       const searchParams = new URLSearchParams();
-      Object.entries(config.params as Record<string, unknown>).forEach(([key, value]) => {
-        if (value !== null && value !== undefined) {
-          searchParams.append(key, String(value));
-        }
-      });
+      Object.entries(config.params as Record<string, unknown>).forEach(
+        ([key, value]) => {
+          if (value !== null && value !== undefined) {
+            searchParams.append(key, String(value));
+          }
+        },
+      );
       const queryString = searchParams.toString();
       if (queryString) {
-        url += (url.includes('?') ? '&' : '?') + queryString;
+        url += (url.includes("?") ? "&" : "?") + queryString;
       }
     }
 
     return url;
   }
 
-  private async executeRequest<T = any>(config: TauriHttpRequestConfig): Promise<TauriHttpResponse<T>> {
+  private async executeRequest<T = any>(
+    config: TauriHttpRequestConfig,
+  ): Promise<TauriHttpResponse<T>> {
     // Merge with defaults
     const mergedConfig: TauriHttpRequestConfig = {
       ...this.defaults,
@@ -170,7 +203,7 @@ class TauriHttpClient {
     }
 
     const url = this.buildUrl(finalConfig);
-    const method = (finalConfig.method || 'GET').toUpperCase();
+    const method = (finalConfig.method || "GET").toUpperCase();
 
     // Prepare request body and headers
     let body: BodyInit | undefined;
@@ -180,11 +213,11 @@ class TauriHttpClient {
       if (finalConfig.data instanceof FormData) {
         // FormData can be passed directly
         body = finalConfig.data;
-      } else if (typeof finalConfig.data === 'object') {
+      } else if (typeof finalConfig.data === "object") {
         // Serialize as JSON
         body = JSON.stringify(finalConfig.data);
-        if (!headers['Content-Type']) {
-          headers['Content-Type'] = 'application/json';
+        if (!headers["Content-Type"]) {
+          headers["Content-Type"] = "application/json";
         }
       } else {
         body = String(finalConfig.data);
@@ -193,11 +226,18 @@ class TauriHttpClient {
 
     try {
       // Convert withCredentials to fetch API's credentials option
-      const credentials: RequestCredentials = finalConfig.withCredentials ? 'include' : 'omit';
+      const credentials: RequestCredentials = finalConfig.withCredentials
+        ? "include"
+        : "omit";
 
       // Make the request using Tauri's native HTTP client (standard Fetch API)
       // Enable certificate bypass for HTTPS to handle missing intermediate certs and self-signed certs
-      const fetchOptions: any = {
+      const fetchOptions: RequestInit & {
+        danger?: {
+          acceptInvalidCerts: boolean;
+          acceptInvalidHostnames: boolean;
+        };
+      } = {
         method,
         headers,
         body,
@@ -209,7 +249,7 @@ class TauriHttpClient {
       // - Missing intermediate certificates
       // - Self-signed certificates
       // - Certificate hostname mismatches
-      if (url.startsWith('https://')) {
+      if (url.startsWith("https://")) {
         fetchOptions.danger = {
           acceptInvalidCerts: true,
           acceptInvalidHostnames: true,
@@ -233,28 +273,34 @@ class TauriHttpClient {
         try {
           errorBody = await response.text();
         } catch {
-          errorBody = '';
+          errorBody = "";
         }
 
         // Create more descriptive error messages based on status code
-        let errorMessage = errorBody || `Request failed with status code ${response.status}`;
-        let errorCode = 'ERR_BAD_REQUEST';
+        let errorMessage =
+          errorBody || `Request failed with status code ${response.status}`;
+        let errorCode = "ERR_BAD_REQUEST";
 
         if (response.status === 401) {
-          errorMessage = 'Authentication failed - Invalid credentials';
-          errorCode = 'ERR_UNAUTHORIZED';
+          errorMessage = "Authentication failed - Invalid credentials";
+          errorCode = "ERR_UNAUTHORIZED";
         } else if (response.status === 403) {
-          errorMessage = 'Access denied - Insufficient permissions';
-          errorCode = 'ERR_FORBIDDEN';
+          errorMessage = "Access denied - Insufficient permissions";
+          errorCode = "ERR_FORBIDDEN";
         } else if (response.status === 404) {
-          errorMessage = 'Endpoint not found - Server may not support this operation';
-          errorCode = 'ERR_NOT_FOUND';
+          errorMessage =
+            "Endpoint not found - Server may not support this operation";
+          errorCode = "ERR_NOT_FOUND";
         } else if (response.status === 500) {
-          errorMessage = 'Internal server error - Please check server logs';
-          errorCode = 'ERR_SERVER_ERROR';
-        } else if (response.status === 502 || response.status === 503 || response.status === 504) {
-          errorMessage = 'Server unavailable or timeout - Please try again';
-          errorCode = 'ERR_SERVICE_UNAVAILABLE';
+          errorMessage = "Internal server error - Please check server logs";
+          errorCode = "ERR_SERVER_ERROR";
+        } else if (
+          response.status === 502 ||
+          response.status === 503 ||
+          response.status === 504
+        ) {
+          errorMessage = "Server unavailable or timeout - Please try again";
+          errorCode = "ERR_SERVICE_UNAVAILABLE";
         }
 
         console.error(`[TauriHttpClient] HTTP Error ${response.status}:`, {
@@ -268,7 +314,7 @@ class TauriHttpClient {
         const errorResponse: TauriHttpResponse<T> = {
           data: errorBody as T,
           status: response.status,
-          statusText: response.statusText || '',
+          statusText: response.statusText || "",
           headers: responseHeaders,
           config: finalConfig,
         };
@@ -277,7 +323,7 @@ class TauriHttpClient {
           errorMessage,
           finalConfig,
           errorCode,
-          errorResponse
+          errorResponse,
         );
 
         // Run error interceptors
@@ -296,33 +342,34 @@ class TauriHttpClient {
 
       // Parse response body for successful responses
       let data: T;
-      const responseType = finalConfig.responseType || 'json';
+      const responseType = finalConfig.responseType || "json";
 
-      if (responseType === 'json') {
+      if (responseType === "json") {
         const text = await response.text();
         data = (text ? JSON.parse(text) : null) as T;
-      } else if (responseType === 'text') {
+      } else if (responseType === "text") {
         data = (await response.text()) as T;
-      } else if (responseType === 'blob') {
+      } else if (responseType === "blob") {
         // Standard fetch doesn't set blob.type from Content-Type header (unlike axios)
         // Set it manually to match axios behavior
         const blob = await response.blob();
         if (!blob.type) {
-          const contentType = response.headers.get('content-type') || 'application/octet-stream';
+          const contentType =
+            response.headers.get("content-type") || "application/octet-stream";
           data = new Blob([blob], { type: contentType }) as T;
         } else {
           data = blob as T;
         }
-      } else if (responseType === 'arraybuffer') {
+      } else if (responseType === "arraybuffer") {
         data = (await response.arrayBuffer()) as T;
       } else {
-        data = await response.json() as T;
+        data = (await response.json()) as T;
       }
 
       const httpResponse: TauriHttpResponse<T> = {
         data,
         status: response.status,
-        statusText: response.statusText || '',
+        statusText: response.statusText || "",
         headers: responseHeaders,
         config: finalConfig,
       };
@@ -330,60 +377,79 @@ class TauriHttpClient {
       // Run response interceptors
       let finalResponse = httpResponse;
       for (const handler of this.interceptors.response.handlers) {
-        finalResponse = await Promise.resolve(handler.fulfilled(finalResponse)) as TauriHttpResponse<T>;
+        finalResponse = (await Promise.resolve(
+          handler.fulfilled(finalResponse),
+        )) as TauriHttpResponse<T>;
       }
 
       return finalResponse;
     } catch (error: unknown) {
       // If it's already a TauriHttpError with interceptors run, re-throw
-      if (error && typeof error === 'object' && 'isAxiosError' in error) {
+      if (error && typeof error === "object" && "isAxiosError" in error) {
         throw error;
       }
 
       // Create detailed error messages for network/other failures
-      let errorMessage = 'Network Error';
-      let errorCode = 'ERR_NETWORK';
+      let errorMessage = "Network Error";
+      let errorCode = "ERR_NETWORK";
 
       if (error instanceof Error) {
         const errMsg = error.message.toLowerCase();
 
         // Connection refused - server not running or wrong port
-        if (errMsg.includes('connection refused') || errMsg.includes('econnrefused')) {
+        if (
+          errMsg.includes("connection refused") ||
+          errMsg.includes("econnrefused")
+        ) {
           errorMessage = `Unable to connect to server at ${url}. Server may not be running or port is incorrect.`;
-          errorCode = 'ERR_CONNECTION_REFUSED';
+          errorCode = "ERR_CONNECTION_REFUSED";
         }
         // Timeout - server too slow or unreachable
-        else if (errMsg.includes('timeout') || errMsg.includes('timed out')) {
+        else if (errMsg.includes("timeout") || errMsg.includes("timed out")) {
           errorMessage = `Connection timed out to ${url}. Server is not responding or is too slow.`;
-          errorCode = 'ERR_TIMEOUT';
+          errorCode = "ERR_TIMEOUT";
         }
         // DNS failure - invalid domain or network issue
-        else if (errMsg.includes('getaddrinfo') || errMsg.includes('dns') || errMsg.includes('not found') || errMsg.includes('enotfound')) {
+        else if (
+          errMsg.includes("getaddrinfo") ||
+          errMsg.includes("dns") ||
+          errMsg.includes("not found") ||
+          errMsg.includes("enotfound")
+        ) {
           errorMessage = `Cannot resolve server address: ${url}. Please check the URL is correct.`;
-          errorCode = 'ERR_DNS_FAILURE';
+          errorCode = "ERR_DNS_FAILURE";
         }
         // SSL/TLS errors - certificate issues
-        else if (errMsg.includes('ssl') || errMsg.includes('tls') || errMsg.includes('certificate') || errMsg.includes('cert')) {
+        else if (
+          errMsg.includes("ssl") ||
+          errMsg.includes("tls") ||
+          errMsg.includes("certificate") ||
+          errMsg.includes("cert")
+        ) {
           errorMessage = `SSL/TLS certificate error for ${url}. Server may have invalid or self-signed certificate.`;
-          errorCode = 'ERR_SSL_ERROR';
+          errorCode = "ERR_SSL_ERROR";
         }
         // Protocol errors - wrong protocol (http vs https)
-        else if (errMsg.includes('protocol') || errMsg.includes('https') || errMsg.includes('http')) {
+        else if (
+          errMsg.includes("protocol") ||
+          errMsg.includes("https") ||
+          errMsg.includes("http")
+        ) {
           errorMessage = `Protocol error connecting to ${url}. Try using https:// instead of http:// or vice versa.`;
-          errorCode = 'ERR_PROTOCOL';
+          errorCode = "ERR_PROTOCOL";
         }
         // CORS errors
-        else if (errMsg.includes('cors')) {
+        else if (errMsg.includes("cors")) {
           errorMessage = `CORS error connecting to ${url}. Server may not allow requests from this application.`;
-          errorCode = 'ERR_CORS';
+          errorCode = "ERR_CORS";
         }
         // Generic error with original message
         else {
           errorMessage = `Network error: ${error.message}`;
-          errorCode = 'ERR_NETWORK';
+          errorCode = "ERR_NETWORK";
         }
 
-        console.error('[TauriHttpClient] Network error:', {
+        console.error("[TauriHttpClient] Network error:", {
           url,
           method,
           errorType: errorCode,
@@ -391,7 +457,7 @@ class TauriHttpClient {
           stack: error.stack,
         });
       } else {
-        console.error('[TauriHttpClient] Unknown error type:', error);
+        console.error("[TauriHttpClient] Unknown error type:", error);
       }
 
       const httpError = this.createError(
@@ -399,7 +465,7 @@ class TauriHttpClient {
         finalConfig,
         errorCode,
         undefined,
-        error
+        error,
       );
 
       // Run error interceptors
@@ -417,36 +483,62 @@ class TauriHttpClient {
     }
   }
 
-  async request<T = any>(config: TauriHttpRequestConfig): Promise<TauriHttpResponse<T>> {
+  async request<T = any>(
+    config: TauriHttpRequestConfig,
+  ): Promise<TauriHttpResponse<T>> {
     return this.executeRequest<T>(config);
   }
 
-  async get<T = any>(url: string, config?: TauriHttpRequestConfig): Promise<TauriHttpResponse<T>> {
-    return this.executeRequest<T>({ ...config, method: 'GET', url });
+  async get<T = any>(
+    url: string,
+    config?: TauriHttpRequestConfig,
+  ): Promise<TauriHttpResponse<T>> {
+    return this.executeRequest<T>({ ...config, method: "GET", url });
   }
 
-  async delete<T = any>(url: string, config?: TauriHttpRequestConfig): Promise<TauriHttpResponse<T>> {
-    return this.executeRequest<T>({ ...config, method: 'DELETE', url });
+  async delete<T = any>(
+    url: string,
+    config?: TauriHttpRequestConfig,
+  ): Promise<TauriHttpResponse<T>> {
+    return this.executeRequest<T>({ ...config, method: "DELETE", url });
   }
 
-  async head<T = any>(url: string, config?: TauriHttpRequestConfig): Promise<TauriHttpResponse<T>> {
-    return this.executeRequest<T>({ ...config, method: 'HEAD', url });
+  async head<T = any>(
+    url: string,
+    config?: TauriHttpRequestConfig,
+  ): Promise<TauriHttpResponse<T>> {
+    return this.executeRequest<T>({ ...config, method: "HEAD", url });
   }
 
-  async options<T = any>(url: string, config?: TauriHttpRequestConfig): Promise<TauriHttpResponse<T>> {
-    return this.executeRequest<T>({ ...config, method: 'OPTIONS', url });
+  async options<T = any>(
+    url: string,
+    config?: TauriHttpRequestConfig,
+  ): Promise<TauriHttpResponse<T>> {
+    return this.executeRequest<T>({ ...config, method: "OPTIONS", url });
   }
 
-  async post<T = any>(url: string, data?: any, config?: TauriHttpRequestConfig): Promise<TauriHttpResponse<T>> {
-    return this.executeRequest<T>({ ...config, method: 'POST', url, data });
+  async post<T = any>(
+    url: string,
+    data?: any,
+    config?: TauriHttpRequestConfig,
+  ): Promise<TauriHttpResponse<T>> {
+    return this.executeRequest<T>({ ...config, method: "POST", url, data });
   }
 
-  async put<T = any>(url: string, data?: any, config?: TauriHttpRequestConfig): Promise<TauriHttpResponse<T>> {
-    return this.executeRequest<T>({ ...config, method: 'PUT', url, data });
+  async put<T = any>(
+    url: string,
+    data?: any,
+    config?: TauriHttpRequestConfig,
+  ): Promise<TauriHttpResponse<T>> {
+    return this.executeRequest<T>({ ...config, method: "PUT", url, data });
   }
 
-  async patch<T = any>(url: string, data?: any, config?: TauriHttpRequestConfig): Promise<TauriHttpResponse<T>> {
-    return this.executeRequest<T>({ ...config, method: 'PATCH', url, data });
+  async patch<T = any>(
+    url: string,
+    data?: any,
+    config?: TauriHttpRequestConfig,
+  ): Promise<TauriHttpResponse<T>> {
+    return this.executeRequest<T>({ ...config, method: "PATCH", url, data });
   }
 
   // Axios compatibility methods
@@ -458,9 +550,13 @@ class TauriHttpClient {
     return this.buildUrl({ ...this.defaults, ...config });
   }
 
-  async postForm<T = any>(url: string, data?: any, config?: TauriHttpRequestConfig): Promise<TauriHttpResponse<T>> {
+  async postForm<T = any>(
+    url: string,
+    data?: any,
+    config?: TauriHttpRequestConfig,
+  ): Promise<TauriHttpResponse<T>> {
     const formData = data instanceof FormData ? data : new FormData();
-    if (!(data instanceof FormData) && data && typeof data === 'object') {
+    if (!(data instanceof FormData) && data && typeof data === "object") {
       Object.entries(data).forEach(([key, value]) => {
         formData.append(key, String(value));
       });
@@ -468,9 +564,13 @@ class TauriHttpClient {
     return this.post<T>(url, formData, config);
   }
 
-  async putForm<T = any>(url: string, data?: any, config?: TauriHttpRequestConfig): Promise<TauriHttpResponse<T>> {
+  async putForm<T = any>(
+    url: string,
+    data?: any,
+    config?: TauriHttpRequestConfig,
+  ): Promise<TauriHttpResponse<T>> {
     const formData = data instanceof FormData ? data : new FormData();
-    if (!(data instanceof FormData) && data && typeof data === 'object') {
+    if (!(data instanceof FormData) && data && typeof data === "object") {
       Object.entries(data).forEach(([key, value]) => {
         formData.append(key, String(value));
       });
@@ -478,9 +578,13 @@ class TauriHttpClient {
     return this.put<T>(url, formData, config);
   }
 
-  async patchForm<T = any>(url: string, data?: any, config?: TauriHttpRequestConfig): Promise<TauriHttpResponse<T>> {
+  async patchForm<T = any>(
+    url: string,
+    data?: any,
+    config?: TauriHttpRequestConfig,
+  ): Promise<TauriHttpResponse<T>> {
     const formData = data instanceof FormData ? data : new FormData();
-    if (!(data instanceof FormData) && data && typeof data === 'object') {
+    if (!(data instanceof FormData) && data && typeof data === "object") {
       Object.entries(data).forEach(([key, value]) => {
         formData.append(key, String(value));
       });
diff --git a/frontend/src/desktop/tsconfig.json b/frontend/src/desktop/tsconfig.json
index 6c6989ebc3..7fa180a623 100644
--- a/frontend/src/desktop/tsconfig.json
+++ b/frontend/src/desktop/tsconfig.json
@@ -3,17 +3,9 @@
   "compilerOptions": {
     "baseUrl": "../../",
     "paths": {
-      "@app/*": [
-        "src/desktop/*",
-        "src/proprietary/*",
-        "src/core/*"
-      ],
-      "@proprietary/*": [
-        "src/proprietary/*"
-      ],
-      "@core/*": [
-        "src/core/*"
-      ]
+      "@app/*": ["src/desktop/*", "src/proprietary/*", "src/core/*"],
+      "@proprietary/*": ["src/proprietary/*"],
+      "@core/*": ["src/core/*"]
     }
   },
   "include": [
diff --git a/frontend/src/desktop/types/billing.ts b/frontend/src/desktop/types/billing.ts
index 3e67a9b77d..f5ef6c024b 100644
--- a/frontend/src/desktop/types/billing.ts
+++ b/frontend/src/desktop/types/billing.ts
@@ -6,28 +6,28 @@
 /**
  * Plan tier levels (string union for tier identification)
  */
-export type TierLevel = 'free' | 'team' | 'enterprise';
+export type TierLevel = "free" | "team" | "enterprise";
 
 /**
  * Stripe subscription status values
  * @see https://stripe.com/docs/api/subscriptions/object#subscription_object-status
  */
 export type SubscriptionStatus =
-  | 'active'
-  | 'trialing'
-  | 'past_due'
-  | 'canceled'
-  | 'incomplete'
-  | 'incomplete_expired'
-  | 'unpaid';
+  | "active"
+  | "trialing"
+  | "past_due"
+  | "canceled"
+  | "incomplete"
+  | "incomplete_expired"
+  | "unpaid";
 
 /**
  * Stripe plan IDs (Stripe API naming)
  * Note: UI uses 'team' but Stripe uses 'pro'
  */
-export type StripePlanId = 'pro' | 'enterprise';
+export type StripePlanId = "pro" | "enterprise";
 
 /**
  * Plan IDs used in the application (UI naming)
  */
-export type PlanId = 'team' | 'enterprise';
+export type PlanId = "team" | "enterprise";
diff --git a/frontend/src/desktop/utils/oauthCallbackHtml.ts b/frontend/src/desktop/utils/oauthCallbackHtml.ts
index a2119d9981..ddc4b89f40 100644
--- a/frontend/src/desktop/utils/oauthCallbackHtml.ts
+++ b/frontend/src/desktop/utils/oauthCallbackHtml.ts
@@ -18,9 +18,9 @@ export function buildOAuthCallbackHtml({
   isError = false,
   errorPlaceholder = false,
 }: OAuthCallbackHtmlOptions): string {
-  const iconColor = isError ? '#d32f2f' : '#2e7d32';
-  const iconColorDark = isError ? '#ef5350' : '#66bb6a';
-  const icon = isError ? '✗' : '✓';
+  const iconColor = isError ? "#d32f2f" : "#2e7d32";
+  const iconColorDark = isError ? "#ef5350" : "#66bb6a";
+  const icon = isError ? "✗" : "✓";
 
   return `<!DOCTYPE html>
 <html>
@@ -74,7 +74,9 @@ export function buildOAuthCallbackHtml({
       font-size: 15px;
     }
 
-    ${errorPlaceholder ? `
+    ${
+      errorPlaceholder
+        ? `
     .error-details {
       background: #ffebee;
       border: 1px solid #ffcdd2;
@@ -87,7 +89,9 @@ export function buildOAuthCallbackHtml({
       text-align: left;
       line-height: 1.5;
     }
-    ` : ''}
+    `
+        : ""
+    }
 
     /* Dark mode support */
     @media (prefers-color-scheme: dark) {
@@ -113,13 +117,17 @@ export function buildOAuthCallbackHtml({
         color: #b0b0b0;
       }
 
-      ${errorPlaceholder ? `
+      ${
+        errorPlaceholder
+          ? `
       .error-details {
         background: #3d2020;
         border: 1px solid #5d3030;
         color: #ef9a9a;
       }
-      ` : ''}
+      `
+          : ""
+      }
     }
 
     /* Mobile responsive */
@@ -147,7 +155,7 @@ export function buildOAuthCallbackHtml({
     <div class="icon">${icon}</div>
     <h1>${title}</h1>
     <p>${message}</p>
-    ${errorPlaceholder ? '<div class="error-details">{error}</div>' : ''}
+    ${errorPlaceholder ? '<div class="error-details">{error}</div>' : ""}
   </div>
 </body>
 </html>`;
diff --git a/frontend/src/global.d.ts b/frontend/src/global.d.ts
index 09487d4a06..979a857355 100644
--- a/frontend/src/global.d.ts
+++ b/frontend/src/global.d.ts
@@ -1,8 +1,8 @@
 declare module "*.js";
-declare module '*.module.css';
+declare module "*.module.css";
 
 // Auto-generated icon set JSON import
-declare module 'assets/material-symbols-icons.json' {
+declare module "assets/material-symbols-icons.json" {
   const value: {
     prefix: string;
     icons: Record<string, any>;
@@ -15,10 +15,12 @@ declare module 'assets/material-symbols-icons.json' {
 declare global {
   interface Window {
     __STIRLING_PDF_BASE_URL__?: string;
+    STIRLING_PDF_API_BASE_URL?: string;
+    endpointAvailabilityService?: unknown;
   }
 }
 
-declare module 'axios' {
+declare module "axios" {
   export interface AxiosRequestConfig<_D = unknown> {
     suppressErrorToast?: boolean;
     skipAuthRedirect?: boolean;
@@ -32,4 +34,4 @@ declare module 'axios' {
   }
 }
 
-export { };
+export {};
diff --git a/frontend/src/index.tsx b/frontend/src/index.tsx
index 96383ab779..a5c4783488 100644
--- a/frontend/src/index.tsx
+++ b/frontend/src/index.tsx
@@ -1,36 +1,38 @@
-import '@mantine/core/styles.css';
-import '@mantine/dates/styles.css';
-import '../vite-env.d.ts'; // eslint-disable-line no-restricted-imports -- Outside app paths
-import '@app/styles/index.css'; // Import global styles
-import React from 'react';
-import ReactDOM from 'react-dom/client';
-import { ColorSchemeScript } from '@mantine/core';
-import { BrowserRouter } from 'react-router-dom';
-import App from '@app/App';
-import '@app/i18n'; // Initialize i18next
-import posthog from 'posthog-js';
-import { PostHogProvider } from '@posthog/react';
-import { BASE_PATH } from '@app/constants/app';
+import "@mantine/core/styles.css";
+import "@mantine/dates/styles.css";
+import "../vite-env.d.ts"; // eslint-disable-line no-restricted-imports -- Outside app paths
+import "@app/styles/index.css"; // Import global styles
+import React from "react";
+import ReactDOM from "react-dom/client";
+import { ColorSchemeScript } from "@mantine/core";
+import { BrowserRouter } from "react-router-dom";
+import App from "@app/App";
+import "@app/i18n"; // Initialize i18next
+import posthog from "posthog-js";
+import { PostHogProvider } from "@posthog/react";
+import { BASE_PATH } from "@app/constants/app";
 
 posthog.init(import.meta.env.VITE_PUBLIC_POSTHOG_KEY, {
   api_host: import.meta.env.VITE_PUBLIC_POSTHOG_HOST,
-  defaults: '2025-05-24',
+  defaults: "2025-05-24",
   capture_exceptions: true, // This enables capturing exceptions using Error Tracking, set to false if you don't want this
   debug: false,
   opt_out_capturing_by_default: true, // Opt-out by default, controlled by cookie consent
-  persistence: 'memory', // No cookies/localStorage written until user opts in
+  persistence: "memory", // No cookies/localStorage written until user opts in
   cross_subdomain_cookie: false,
 });
 
 function updatePosthogConsent() {
   if (!posthog.__loaded) return;
-  const optIn = (window.CookieConsent as any)?.acceptedService?.('posthog', 'analytics') || false;
+  const optIn =
+    (window.CookieConsent as any)?.acceptedService?.("posthog", "analytics") ||
+    false;
   if (optIn) {
-    posthog.set_config({ persistence: 'localStorage+cookie' });
+    posthog.set_config({ persistence: "localStorage+cookie" });
     posthog.opt_in_capturing();
   } else {
     posthog.opt_out_capturing();
-    posthog.set_config({ persistence: 'memory' });
+    posthog.set_config({ persistence: "memory" });
   }
   console.log("Updated PostHog consent: ", optIn ? "opted in" : "opted out");
 }
@@ -38,7 +40,7 @@ function updatePosthogConsent() {
 window.addEventListener("cc:onConsent", updatePosthogConsent);
 window.addEventListener("cc:onChange", updatePosthogConsent);
 
-const container = document.getElementById('root');
+const container = document.getElementById("root");
 if (!container) {
   throw new Error("Root container missing in index.html");
 }
@@ -47,12 +49,10 @@ const root = ReactDOM.createRoot(container); // Finds the root DOM element
 root.render(
   <React.StrictMode>
     <ColorSchemeScript />
-    <PostHogProvider
-      client={posthog}
-    >
+    <PostHogProvider client={posthog}>
       <BrowserRouter basename={BASE_PATH}>
         <App />
       </BrowserRouter>
     </PostHogProvider>
-  </React.StrictMode>
+  </React.StrictMode>,
 );
diff --git a/frontend/src/proprietary/App.tsx b/frontend/src/proprietary/App.tsx
index 81a1c53a18..9d1864b6ab 100644
--- a/frontend/src/proprietary/App.tsx
+++ b/frontend/src/proprietary/App.tsx
@@ -28,9 +28,7 @@ import "@app/utils/fileIdSafety";
 function MobileScannerProviders({ children }: { children: React.ReactNode }) {
   return (
     <PreferencesProvider>
-      <RainbowThemeProvider>
-        {children}
-      </RainbowThemeProvider>
+      <RainbowThemeProvider>{children}</RainbowThemeProvider>
     </PreferencesProvider>
   );
 }
diff --git a/frontend/src/proprietary/auth/UseSession.tsx b/frontend/src/proprietary/auth/UseSession.tsx
index a210ce6fb8..0162be3ff2 100644
--- a/frontend/src/proprietary/auth/UseSession.tsx
+++ b/frontend/src/proprietary/auth/UseSession.tsx
@@ -1,7 +1,19 @@
-import { createContext, useContext, useEffect, useState, ReactNode, useCallback } from 'react';
-import { springAuth } from '@app/auth/springAuthClient';
-import { clearPlatformAuthOnLoginInit } from '@app/extensions/authSessionCleanup';
-import type { Session, User, AuthError, AuthChangeEvent } from '@app/auth/springAuthClient';
+import {
+  createContext,
+  useContext,
+  useEffect,
+  useState,
+  ReactNode,
+  useCallback,
+} from "react";
+import { springAuth } from "@app/auth/springAuthClient";
+import { clearPlatformAuthOnLoginInit } from "@app/extensions/authSessionCleanup";
+import type {
+  Session,
+  User,
+  AuthError,
+  AuthChangeEvent,
+} from "@app/auth/springAuthClient";
 
 /**
  * Auth Context Type
@@ -38,12 +50,12 @@ export function AuthProvider({ children }: { children: ReactNode }) {
 
   // Debug: Track state transitions
   useEffect(() => {
-    console.log('[Auth] State changed:', {
+    console.log("[Auth] State changed:", {
       loading,
       hasSession: !!session,
       hasError: !!error,
       userId: session?.user?.id,
-      timestamp: new Date().toISOString()
+      timestamp: new Date().toISOString(),
     });
   }, [loading, session, error]);
 
@@ -54,24 +66,26 @@ export function AuthProvider({ children }: { children: ReactNode }) {
     try {
       setLoading(true);
       setError(null);
-      console.debug('[Auth] refreshSession: start', { path: window.location.pathname });
-      console.debug('[Auth] Refreshing session...');
+      console.debug("[Auth] refreshSession: start", {
+        path: window.location.pathname,
+      });
+      console.debug("[Auth] Refreshing session...");
 
       const { data, error } = await springAuth.refreshSession();
 
       if (error) {
-        console.error('[Auth] Session refresh error:', error);
+        console.error("[Auth] Session refresh error:", error);
         setError(error);
         setSession(null);
       } else {
-        console.debug('[Auth] Session refreshed successfully');
+        console.debug("[Auth] Session refreshed successfully");
         setSession(data.session);
       }
     } catch (err) {
-      console.error('[Auth] Unexpected error during session refresh:', err);
+      console.error("[Auth] Unexpected error during session refresh:", err);
       setError(err as AuthError);
     } finally {
-      console.debug('[Auth] refreshSession: done', { hasSession: !!session });
+      console.debug("[Auth] refreshSession: done", { hasSession: !!session });
       setLoading(false);
     }
   }, []);
@@ -82,20 +96,19 @@ export function AuthProvider({ children }: { children: ReactNode }) {
   const signOut = useCallback(async () => {
     try {
       setError(null);
-      console.debug('[Auth] Signing out...');
+      console.debug("[Auth] Signing out...");
 
       const { error } = await springAuth.signOut();
 
       if (error) {
-        console.error('[Auth] Sign out error:', error);
+        console.error("[Auth] Sign out error:", error);
         setError(error);
       } else {
-        console.debug('[Auth] Signed out successfully');
+        console.debug("[Auth] Signed out successfully");
         setSession(null);
       }
-
     } catch (err) {
-      console.error('[Auth] Unexpected error during sign out:', err);
+      console.error("[Auth] Unexpected error during sign out:", err);
       setError(err as AuthError);
     }
   }, []);
@@ -111,9 +124,14 @@ export function AuthProvider({ children }: { children: ReactNode }) {
     const initializeAuth = async () => {
       try {
         console.debug(`[Auth:${mountId}] Initializing auth...`);
-        console.debug(`[Auth:${mountId}] Path: ${window.location.pathname} Search: ${window.location.search}`);
+        console.debug(
+          `[Auth:${mountId}] Path: ${window.location.pathname} Search: ${window.location.search}`,
+        );
         // Clear any platform-specific cached auth on login page init.
-        if (typeof window !== 'undefined' && window.location.pathname.startsWith('/login')) {
+        if (
+          typeof window !== "undefined" &&
+          window.location.pathname.startsWith("/login")
+        ) {
           await clearPlatformAuthOnLoginInit();
         }
 
@@ -124,10 +142,10 @@ export function AuthProvider({ children }: { children: ReactNode }) {
         if (!mounted) return;
 
         if (error) {
-          console.error('[Auth] Initial session error:', error);
+          console.error("[Auth] Initial session error:", error);
           setError(error);
         } else {
-          console.debug('[Auth] Initial session loaded:', {
+          console.debug("[Auth] Initial session loaded:", {
             hasSession: !!data.session,
             userId: data.session?.user?.id,
             email: data.session?.user?.email,
@@ -135,12 +153,17 @@ export function AuthProvider({ children }: { children: ReactNode }) {
           setSession(data.session);
         }
       } catch (err) {
-        console.error('[Auth] Unexpected error during auth initialization:', err);
+        console.error(
+          "[Auth] Unexpected error during auth initialization:",
+          err,
+        );
         if (mounted) {
           setError(err as AuthError);
         }
       } finally {
-        console.debug(`[Auth:${mountId}] Initialize auth complete. mounted=${mounted}`);
+        console.debug(
+          `[Auth:${mountId}] Initialize auth complete. mounted=${mounted}`,
+        );
         if (mounted) {
           setLoading(false);
         }
@@ -153,58 +176,74 @@ export function AuthProvider({ children }: { children: ReactNode }) {
     const handleJwtAvailable = () => {
       console.log(`[Auth:${mountId}] ������������������������������������`);
       console.log(`[Auth:${mountId}] 🔄 JWT available event received`);
-      console.log(`[Auth:${mountId}] Current state: loading=${loading}, hasSession=${!!session}`);
-      console.log(`[Auth:${mountId}] Setting loading=true to stabilize auth state`);
+      console.log(
+        `[Auth:${mountId}] Current state: loading=${loading}, hasSession=${!!session}`,
+      );
+      console.log(
+        `[Auth:${mountId}] Setting loading=true to stabilize auth state`,
+      );
       setLoading(true); // Prevent unstable renders during auth state transition
       setError(null);
       console.log(`[Auth:${mountId}] Refreshing session...`);
       void initializeAuth();
     };
 
-    window.addEventListener('jwt-available', handleJwtAvailable);
+    window.addEventListener("jwt-available", handleJwtAvailable);
 
     // Subscribe to auth state changes
-    const { data: { subscription } } = springAuth.onAuthStateChange(
+    const {
+      data: { subscription },
+    } = springAuth.onAuthStateChange(
       async (event: AuthChangeEvent, newSession: Session | null) => {
         if (!mounted) {
-          console.log(`[Auth:${mountId}] ⚠�  Auth state change ignored (unmounted): ${event}`);
+          console.log(
+            `[Auth:${mountId}] ⚠�  Auth state change ignored (unmounted): ${event}`,
+          );
           return;
         }
 
         console.log(`[Auth:${mountId}] ������������������������������������`);
         console.log(`[Auth:${mountId}] 📢 Auth state change event: ${event}`);
         console.log(`[Auth:${mountId}] Has session: ${!!newSession}`);
-        console.log(`[Auth:${mountId}] User: ${newSession?.user?.email || 'none'}`);
+        console.log(
+          `[Auth:${mountId}] User: ${newSession?.user?.email || "none"}`,
+        );
         console.log(`[Auth:${mountId}] Timestamp: ${new Date().toISOString()}`);
 
         // Schedule state update
         setTimeout(() => {
           if (mounted) {
-            console.log(`[Auth:${mountId}] Applying session update (event: ${event})`);
+            console.log(
+              `[Auth:${mountId}] Applying session update (event: ${event})`,
+            );
             setSession(newSession);
             setError(null);
 
             // Handle specific events
-            if (event === 'SIGNED_OUT') {
-              console.log(`[Auth:${mountId}] ✓ User signed out, session cleared`);
-            } else if (event === 'SIGNED_IN') {
+            if (event === "SIGNED_OUT") {
+              console.log(
+                `[Auth:${mountId}] ✓ User signed out, session cleared`,
+              );
+            } else if (event === "SIGNED_IN") {
               console.log(`[Auth:${mountId}] ✓ User signed in successfully`);
-            } else if (event === 'TOKEN_REFRESHED') {
+            } else if (event === "TOKEN_REFRESHED") {
               console.log(`[Auth:${mountId}] ✓ Token refreshed`);
-            } else if (event === 'USER_UPDATED') {
+            } else if (event === "USER_UPDATED") {
               console.log(`[Auth:${mountId}] ✓ User updated`);
             }
           } else {
-            console.log(`[Auth:${mountId}] ⚠�  Session update skipped (unmounted during timeout)`);
+            console.log(
+              `[Auth:${mountId}] ⚠�  Session update skipped (unmounted during timeout)`,
+            );
           }
         }, 0);
-      }
+      },
     );
 
     return () => {
       console.log(`[Auth:${mountId}] 🔴 AuthProvider unmounting`);
       mounted = false;
-      window.removeEventListener('jwt-available', handleJwtAvailable);
+      window.removeEventListener("jwt-available", handleJwtAvailable);
       subscription.unsubscribe();
     };
   }, []);
@@ -218,11 +257,7 @@ export function AuthProvider({ children }: { children: ReactNode }) {
     refreshSession,
   };
 
-  return (
-    <AuthContext.Provider value={value}>
-      {children}
-    </AuthContext.Provider>
-  );
+  return <AuthContext.Provider value={value}>{children}</AuthContext.Provider>;
 }
 
 /**
@@ -233,7 +268,7 @@ export function useAuth() {
   const context = useContext(AuthContext);
 
   if (context === undefined) {
-    throw new Error('useAuth must be used within an AuthProvider');
+    throw new Error("useAuth must be used within an AuthProvider");
   }
 
   return context;
@@ -247,7 +282,7 @@ export function useAuthDebug() {
   const auth = useAuth();
 
   useEffect(() => {
-    console.debug('[Auth Debug] Current auth state:', {
+    console.debug("[Auth Debug] Current auth state:", {
       hasSession: !!auth.session,
       hasUser: !!auth.user,
       loading: auth.loading,
diff --git a/frontend/src/proprietary/auth/oauthStorage.ts b/frontend/src/proprietary/auth/oauthStorage.ts
index 17597d5e1a..48e12c34ed 100644
--- a/frontend/src/proprietary/auth/oauthStorage.ts
+++ b/frontend/src/proprietary/auth/oauthStorage.ts
@@ -2,7 +2,7 @@
  * Helper utilities for clearing cached OAuth redirect/session state
  */
 
-const OAUTH_REDIRECT_COOKIE = 'stirling_redirect_path';
+const OAUTH_REDIRECT_COOKIE = "stirling_redirect_path";
 
 /**
  * Clear any persisted OAuth redirect path/cached state so the app
@@ -11,21 +11,21 @@ const OAUTH_REDIRECT_COOKIE = 'stirling_redirect_path';
 export function resetOAuthState(): void {
   try {
     // Remove redirect cookie
-    if (typeof document !== 'undefined') {
+    if (typeof document !== "undefined") {
       document.cookie = `${OAUTH_REDIRECT_COOKIE}=;expires=Thu, 01 Jan 1970 00:00:00 GMT;path=/;SameSite=Lax`;
     }
   } catch (err) {
-    console.warn('[OAuthStorage] Failed to clear redirect cookie', err);
+    console.warn("[OAuthStorage] Failed to clear redirect cookie", err);
   }
 
   // Remove any related localStorage entries we might have used
   try {
-    if (typeof window !== 'undefined' && window.localStorage) {
+    if (typeof window !== "undefined" && window.localStorage) {
       window.localStorage.removeItem(OAUTH_REDIRECT_COOKIE);
-      window.localStorage.removeItem('oauth_redirect_path');
+      window.localStorage.removeItem("oauth_redirect_path");
     }
   } catch (err) {
-    console.warn('[OAuthStorage] Failed to clear OAuth localStorage', err);
+    console.warn("[OAuthStorage] Failed to clear OAuth localStorage", err);
   }
 }
 
diff --git a/frontend/src/proprietary/auth/oauthTypes.ts b/frontend/src/proprietary/auth/oauthTypes.ts
index 2d38f1b3e5..22f5c6a23b 100644
--- a/frontend/src/proprietary/auth/oauthTypes.ts
+++ b/frontend/src/proprietary/auth/oauthTypes.ts
@@ -3,17 +3,17 @@
  * Custom providers are also supported - the backend determines availability.
  */
 export const KNOWN_OAUTH_PROVIDERS = [
-  'github',
-  'google',
-  'apple',
-  'azure',
-  'keycloak',
-  'cloudron',
-  'authentik',
-  'oidc',
+  "github",
+  "google",
+  "apple",
+  "azure",
+  "keycloak",
+  "cloudron",
+  "authentik",
+  "oidc",
 ] as const;
 
-export type KnownOAuthProvider = typeof KNOWN_OAUTH_PROVIDERS[number];
+export type KnownOAuthProvider = (typeof KNOWN_OAUTH_PROVIDERS)[number];
 
 /**
  * OAuth provider ID - can be any known provider or custom string.
diff --git a/frontend/src/proprietary/auth/springAuthClient.test.ts b/frontend/src/proprietary/auth/springAuthClient.test.ts
index cae070373a..1d7224b047 100644
--- a/frontend/src/proprietary/auth/springAuthClient.test.ts
+++ b/frontend/src/proprietary/auth/springAuthClient.test.ts
@@ -1,16 +1,20 @@
-import { describe, it, expect, beforeEach, vi, afterEach } from 'vitest';
-import { springAuth } from '@app/auth/springAuthClient';
-import { startOAuthNavigation } from '@app/extensions/oauthNavigation';
-import apiClient from '@app/services/apiClient';
-import { AxiosError } from 'axios';
+import { describe, it, expect, beforeEach, vi, afterEach } from "vitest";
+import { springAuth } from "@app/auth/springAuthClient";
+import { startOAuthNavigation } from "@app/extensions/oauthNavigation";
+import apiClient from "@app/services/apiClient";
+import {
+  AxiosError,
+  type AxiosResponse,
+  type InternalAxiosRequestConfig,
+} from "axios";
 
 // Mock apiClient
-vi.mock('@app/services/apiClient');
-vi.mock('@app/extensions/oauthNavigation', () => ({
+vi.mock("@app/services/apiClient");
+vi.mock("@app/extensions/oauthNavigation", () => ({
   startOAuthNavigation: vi.fn().mockResolvedValue(false),
 }));
 
-describe('SpringAuthClient', () => {
+describe("SpringAuthClient", () => {
   beforeEach(() => {
     // Clear localStorage before each test
     localStorage.clear();
@@ -22,8 +26,8 @@ describe('SpringAuthClient', () => {
     vi.restoreAllMocks();
   });
 
-  describe('getSession', () => {
-    it('should return null session when no JWT in localStorage', async () => {
+  describe("getSession", () => {
+    it("should return null session when no JWT in localStorage", async () => {
       const result = await springAuth.getSession();
 
       expect(result.data.session).toBeNull();
@@ -31,25 +35,25 @@ describe('SpringAuthClient', () => {
       expect(apiClient.get).not.toHaveBeenCalled();
     });
 
-    it('should validate JWT and return session when JWT exists', async () => {
-      const mockToken = 'mock-jwt-token';
+    it("should validate JWT and return session when JWT exists", async () => {
+      const mockToken = "mock-jwt-token";
       const mockUser = {
-        id: '123',
-        email: 'test@example.com',
-        username: 'testuser',
-        role: 'USER',
+        id: "123",
+        email: "test@example.com",
+        username: "testuser",
+        role: "USER",
       };
 
-      localStorage.setItem('stirling_jwt', mockToken);
+      localStorage.setItem("stirling_jwt", mockToken);
 
       vi.mocked(apiClient.get).mockResolvedValueOnce({
         status: 200,
         data: { user: mockUser },
-      } as any);
+      } as unknown as AxiosResponse);
 
       const result = await springAuth.getSession();
 
-      expect(apiClient.get).toHaveBeenCalledWith('/api/v1/auth/me', {
+      expect(apiClient.get).toHaveBeenCalledWith("/api/v1/auth/me", {
         headers: { Authorization: `Bearer ${mockToken}` },
         suppressErrorToast: true,
         skipAuthRedirect: true,
@@ -60,76 +64,76 @@ describe('SpringAuthClient', () => {
       expect(result.error).toBeNull();
     });
 
-    it('should clear invalid JWT on 401 error', async () => {
-      const mockToken = 'invalid-jwt-token';
-      localStorage.setItem('stirling_jwt', mockToken);
+    it("should clear invalid JWT on 401 error", async () => {
+      const mockToken = "invalid-jwt-token";
+      localStorage.setItem("stirling_jwt", mockToken);
 
       const mockError = new AxiosError(
-        'Unauthorized',
-        'ERR_BAD_REQUEST',
+        "Unauthorized",
+        "ERR_BAD_REQUEST",
         undefined,
         undefined,
         {
           status: 401,
-          statusText: 'Unauthorized',
+          statusText: "Unauthorized",
           data: {},
           headers: {},
-          config: {} as any,
-        }
+          config: {} as InternalAxiosRequestConfig,
+        },
       );
 
       vi.mocked(apiClient.get).mockRejectedValueOnce(mockError);
 
       const result = await springAuth.getSession();
 
-      expect(localStorage.getItem('stirling_jwt')).toBeNull();
+      expect(localStorage.getItem("stirling_jwt")).toBeNull();
       expect(result.data.session).toBeNull();
       // 401 is handled gracefully, so error should be null
       expect(result.error).toBeNull();
     });
 
-    it('should clear invalid JWT on 403 error', async () => {
-      const mockToken = 'forbidden-jwt-token';
-      localStorage.setItem('stirling_jwt', mockToken);
+    it("should clear invalid JWT on 403 error", async () => {
+      const mockToken = "forbidden-jwt-token";
+      localStorage.setItem("stirling_jwt", mockToken);
 
       const mockError = new AxiosError(
-        'Forbidden',
-        'ERR_BAD_REQUEST',
+        "Forbidden",
+        "ERR_BAD_REQUEST",
         undefined,
         undefined,
         {
           status: 403,
-          statusText: 'Forbidden',
+          statusText: "Forbidden",
           data: {},
           headers: {},
-          config: {} as any,
-        }
+          config: {} as InternalAxiosRequestConfig,
+        },
       );
 
       vi.mocked(apiClient.get).mockRejectedValueOnce(mockError);
 
       const result = await springAuth.getSession();
 
-      expect(localStorage.getItem('stirling_jwt')).toBeNull();
+      expect(localStorage.getItem("stirling_jwt")).toBeNull();
       expect(result.data.session).toBeNull();
       // 403 is handled gracefully, so error should be null
       expect(result.error).toBeNull();
     });
   });
 
-  describe('signInWithPassword', () => {
-    it('should successfully sign in with email and password', async () => {
+  describe("signInWithPassword", () => {
+    it("should successfully sign in with email and password", async () => {
       const credentials = {
-        email: 'test@example.com',
-        password: 'password123',
+        email: "test@example.com",
+        password: "password123",
       };
 
-      const mockToken = 'new-jwt-token';
+      const mockToken = "new-jwt-token";
       const mockUser = {
-        id: '123',
+        id: "123",
         email: credentials.email,
         username: credentials.email,
-        role: 'USER',
+        role: "USER",
       };
 
       vi.mocked(apiClient.post).mockResolvedValueOnce({
@@ -141,37 +145,37 @@ describe('SpringAuthClient', () => {
             expires_in: 3600,
           },
         },
-      } as any);
+      } as unknown as AxiosResponse);
 
       // Spy on window.dispatchEvent
-      const dispatchEventSpy = vi.spyOn(window, 'dispatchEvent');
+      const dispatchEventSpy = vi.spyOn(window, "dispatchEvent");
 
       const result = await springAuth.signInWithPassword(credentials);
 
       expect(apiClient.post).toHaveBeenCalledWith(
-        '/api/v1/auth/login',
+        "/api/v1/auth/login",
         {
           username: credentials.email,
           password: credentials.password,
         },
-        { withCredentials: true }
+        { withCredentials: true },
       );
-      expect(localStorage.getItem('stirling_jwt')).toBe(mockToken);
+      expect(localStorage.getItem("stirling_jwt")).toBe(mockToken);
       expect(dispatchEventSpy).toHaveBeenCalledWith(
-        expect.objectContaining({ type: 'jwt-available' })
+        expect.objectContaining({ type: "jwt-available" }),
       );
       expect(result.user).toEqual(mockUser);
       expect(result.session?.access_token).toBe(mockToken);
       expect(result.error).toBeNull();
     });
 
-    it('should return error on failed login', async () => {
+    it("should return error on failed login", async () => {
       const credentials = {
-        email: 'wrong@example.com',
-        password: 'wrongpassword',
+        email: "wrong@example.com",
+        password: "wrongpassword",
       };
 
-      const errorMessage = 'Invalid credentials';
+      const errorMessage = "Invalid credentials";
       const mockError = Object.assign(new Error(errorMessage), {
         isAxiosError: true,
         response: {
@@ -191,47 +195,47 @@ describe('SpringAuthClient', () => {
     });
   });
 
-  describe('signUp', () => {
-    it('should successfully register new user', async () => {
+  describe("signUp", () => {
+    it("should successfully register new user", async () => {
       const credentials = {
-        email: 'newuser@example.com',
-        password: 'newpassword123',
+        email: "newuser@example.com",
+        password: "newpassword123",
       };
 
       const mockUser = {
-        id: '456',
+        id: "456",
         email: credentials.email,
         username: credentials.email,
-        role: 'USER',
+        role: "USER",
       };
 
       vi.mocked(apiClient.post).mockResolvedValueOnce({
         status: 200,
         data: { user: mockUser },
-      } as any);
+      } as unknown as AxiosResponse);
 
       const result = await springAuth.signUp(credentials);
 
       expect(apiClient.post).toHaveBeenCalledWith(
-        '/api/v1/user/register',
+        "/api/v1/user/register",
         {
           username: credentials.email,
           password: credentials.password,
         },
-        { withCredentials: true }
+        { withCredentials: true },
       );
       expect(result.user).toEqual(mockUser);
       expect(result.session).toBeNull(); // No auto-login on signup
       expect(result.error).toBeNull();
     });
 
-    it('should return error on failed registration', async () => {
+    it("should return error on failed registration", async () => {
       const credentials = {
-        email: 'existing@example.com',
-        password: 'password123',
+        email: "existing@example.com",
+        password: "password123",
       };
 
-      const errorMessage = 'User already exists';
+      const errorMessage = "User already exists";
       const mockError = Object.assign(new Error(errorMessage), {
         isAxiosError: true,
         response: {
@@ -251,52 +255,52 @@ describe('SpringAuthClient', () => {
     });
   });
 
-  describe('signOut', () => {
-    it('should successfully sign out and clear JWT', async () => {
-      const mockToken = 'jwt-to-clear';
-      localStorage.setItem('stirling_jwt', mockToken);
+  describe("signOut", () => {
+    it("should successfully sign out and clear JWT", async () => {
+      const mockToken = "jwt-to-clear";
+      localStorage.setItem("stirling_jwt", mockToken);
 
       vi.mocked(apiClient.post).mockResolvedValueOnce({
         status: 200,
         data: {},
-      } as any);
+      } as unknown as AxiosResponse);
 
       const result = await springAuth.signOut();
 
       expect(apiClient.post).toHaveBeenCalledWith(
-        '/api/v1/auth/logout',
+        "/api/v1/auth/logout",
         null,
-        expect.objectContaining({ withCredentials: true })
+        expect.objectContaining({ withCredentials: true }),
       );
-      expect(localStorage.getItem('stirling_jwt')).toBeNull();
+      expect(localStorage.getItem("stirling_jwt")).toBeNull();
       expect(result.error).toBeNull();
     });
 
-    it('should clear JWT even if logout request fails', async () => {
-      const mockToken = 'jwt-to-clear';
-      localStorage.setItem('stirling_jwt', mockToken);
+    it("should clear JWT even if logout request fails", async () => {
+      const mockToken = "jwt-to-clear";
+      localStorage.setItem("stirling_jwt", mockToken);
 
       vi.mocked(apiClient.post).mockRejectedValueOnce({
         isAxiosError: true,
         response: { status: 500 },
-        message: 'Server error',
+        message: "Server error",
       });
 
       const result = await springAuth.signOut();
 
-      expect(localStorage.getItem('stirling_jwt')).toBeNull();
+      expect(localStorage.getItem("stirling_jwt")).toBeNull();
       expect(result.error).toBeTruthy();
     });
   });
 
-  describe('refreshSession', () => {
-    it('should refresh JWT token successfully', async () => {
-      const newToken = 'refreshed-jwt-token';
+  describe("refreshSession", () => {
+    it("should refresh JWT token successfully", async () => {
+      const newToken = "refreshed-jwt-token";
       const mockUser = {
-        id: '123',
-        email: 'test@example.com',
-        username: 'testuser',
-        role: 'USER',
+        id: "123",
+        email: "test@example.com",
+        username: "testuser",
+        role: "USER",
       };
 
       vi.mocked(apiClient.post).mockResolvedValueOnce({
@@ -308,37 +312,37 @@ describe('SpringAuthClient', () => {
             expires_in: 3600,
           },
         },
-      } as any);
+      } as unknown as AxiosResponse);
 
       const result = await springAuth.refreshSession();
 
-      expect(localStorage.getItem('stirling_jwt')).toBe(newToken);
+      expect(localStorage.getItem("stirling_jwt")).toBe(newToken);
       // Note: refreshSession does not dispatch jwt-available event, only notifies listeners
       expect(result.data.session?.access_token).toBe(newToken);
       expect(result.error).toBeNull();
     });
 
-    it('should clear JWT and return error on 401', async () => {
-      localStorage.setItem('stirling_jwt', 'expired-token');
+    it("should clear JWT and return error on 401", async () => {
+      localStorage.setItem("stirling_jwt", "expired-token");
 
       vi.mocked(apiClient.post).mockRejectedValueOnce({
         isAxiosError: true,
         response: { status: 401 },
-        message: 'Token expired',
+        message: "Token expired",
       });
 
       const result = await springAuth.refreshSession();
 
-      expect(localStorage.getItem('stirling_jwt')).toBeNull();
+      expect(localStorage.getItem("stirling_jwt")).toBeNull();
       expect(result.data.session).toBeNull();
       expect(result.error).toBeTruthy();
     });
   });
 
-  describe('signInWithOAuth', () => {
-    it('should redirect to OAuth provider', async () => {
+  describe("signInWithOAuth", () => {
+    it("should redirect to OAuth provider", async () => {
       const mockAssign = vi.fn();
-      Object.defineProperty(window, 'location', {
+      Object.defineProperty(window, "location", {
         value: { assign: mockAssign },
         writable: true,
       });
@@ -346,18 +350,20 @@ describe('SpringAuthClient', () => {
       vi.mocked(startOAuthNavigation).mockResolvedValueOnce(false);
 
       const result = await springAuth.signInWithOAuth({
-        provider: '/oauth2/authorization/github',
-        options: { redirectTo: '/auth/callback' },
+        provider: "/oauth2/authorization/github",
+        options: { redirectTo: "/auth/callback" },
       });
 
-      expect(startOAuthNavigation).toHaveBeenCalledWith('/oauth2/authorization/github');
-      expect(mockAssign).toHaveBeenCalledWith('/oauth2/authorization/github');
+      expect(startOAuthNavigation).toHaveBeenCalledWith(
+        "/oauth2/authorization/github",
+      );
+      expect(mockAssign).toHaveBeenCalledWith("/oauth2/authorization/github");
       expect(result.error).toBeNull();
     });
 
-    it('should skip redirect when handled by extension', async () => {
+    it("should skip redirect when handled by extension", async () => {
       const mockAssign = vi.fn();
-      Object.defineProperty(window, 'location', {
+      Object.defineProperty(window, "location", {
         value: { assign: mockAssign },
         writable: true,
       });
@@ -365,11 +371,13 @@ describe('SpringAuthClient', () => {
       vi.mocked(startOAuthNavigation).mockResolvedValueOnce(true);
 
       const result = await springAuth.signInWithOAuth({
-        provider: '/oauth2/authorization/github',
-        options: { redirectTo: '/auth/callback' },
+        provider: "/oauth2/authorization/github",
+        options: { redirectTo: "/auth/callback" },
       });
 
-      expect(startOAuthNavigation).toHaveBeenCalledWith('/oauth2/authorization/github');
+      expect(startOAuthNavigation).toHaveBeenCalledWith(
+        "/oauth2/authorization/github",
+      );
       expect(mockAssign).not.toHaveBeenCalled();
       expect(result.error).toBeNull();
     });
diff --git a/frontend/src/proprietary/auth/springAuthClient.ts b/frontend/src/proprietary/auth/springAuthClient.ts
index 373df79c76..2ee713dd8b 100644
--- a/frontend/src/proprietary/auth/springAuthClient.ts
+++ b/frontend/src/proprietary/auth/springAuthClient.ts
@@ -7,28 +7,28 @@
  * - No email confirmation flow (auto-confirmed on registration)
  */
 
-import apiClient from '@app/services/apiClient';
-import { AxiosError } from 'axios';
-import { BASE_PATH } from '@app/constants/app';
-import { type OAuthProvider } from '@app/auth/oauthTypes';
-import { resetOAuthState } from '@app/auth/oauthStorage';
-import { clearPlatformAuthAfterSignOut } from '@app/extensions/authSessionCleanup';
+import apiClient from "@app/services/apiClient";
+import { AxiosError } from "axios";
+import { BASE_PATH } from "@app/constants/app";
+import { type OAuthProvider } from "@app/auth/oauthTypes";
+import { resetOAuthState } from "@app/auth/oauthStorage";
+import { clearPlatformAuthAfterSignOut } from "@app/extensions/authSessionCleanup";
 import {
   getPlatformSessionUser,
   isDesktopSaaSAuthMode,
   refreshPlatformSession,
   savePlatformToken,
-} from '@app/extensions/platformSessionBridge';
-import { startOAuthNavigation } from '@app/extensions/oauthNavigation';
+} from "@app/extensions/platformSessionBridge";
+import { startOAuthNavigation } from "@app/extensions/oauthNavigation";
 
 function getHttpStatus(error: unknown): number | undefined {
   if (error instanceof AxiosError) {
     return error.response?.status;
   }
 
-  if (error && typeof error === 'object' && 'response' in error) {
+  if (error && typeof error === "object" && "response" in error) {
     const response = (error as { response?: { status?: unknown } }).response;
-    if (response && typeof response.status === 'number') {
+    if (response && typeof response.status === "number") {
       return response.status;
     }
   }
@@ -39,31 +39,36 @@ function getHttpStatus(error: unknown): number | undefined {
 // Helper to extract error message from axios error
 function getErrorMessage(error: unknown, fallback: string): string {
   if (error instanceof AxiosError) {
-    return error.response?.data?.error || error.response?.data?.message || error.message || fallback;
+    return (
+      error.response?.data?.error ||
+      error.response?.data?.message ||
+      error.message ||
+      fallback
+    );
   }
   return error instanceof Error ? error.message : fallback;
 }
 
-const OAUTH_REDIRECT_COOKIE = 'stirling_redirect_path';
+const OAUTH_REDIRECT_COOKIE = "stirling_redirect_path";
 const OAUTH_REDIRECT_COOKIE_MAX_AGE = 60 * 5; // 5 minutes
-const DEFAULT_REDIRECT_PATH = `${BASE_PATH || ''}/auth/callback`;
+const DEFAULT_REDIRECT_PATH = `${BASE_PATH || ""}/auth/callback`;
 
 function normalizeRedirectPath(target?: string): string {
-  if (!target || typeof target !== 'string') {
+  if (!target || typeof target !== "string") {
     return DEFAULT_REDIRECT_PATH;
   }
 
   try {
     const parsed = new URL(target, window.location.origin);
-    const path = parsed.pathname || '/';
-    const query = parsed.search || '';
+    const path = parsed.pathname || "/";
+    const query = parsed.search || "";
     return `${path}${query}`;
   } catch {
     const trimmed = target.trim();
     if (!trimmed) {
       return DEFAULT_REDIRECT_PATH;
     }
-    return trimmed.startsWith('/') ? trimmed : `/${trimmed}`;
+    return trimmed.startsWith("/") ? trimmed : `/${trimmed}`;
   }
 }
 
@@ -85,7 +90,7 @@ export interface User {
   is_anonymous?: boolean;
   isFirstLogin?: boolean;
   authenticationType?: string;
-  app_metadata?: Record<string, any>;
+  app_metadata?: Record<string, unknown>;
 }
 
 export interface Session {
@@ -109,12 +114,15 @@ export interface AuthResponse {
 }
 
 export type AuthChangeEvent =
-  | 'SIGNED_IN'
-  | 'SIGNED_OUT'
-  | 'TOKEN_REFRESHED'
-  | 'USER_UPDATED';
+  | "SIGNED_IN"
+  | "SIGNED_OUT"
+  | "TOKEN_REFRESHED"
+  | "USER_UPDATED";
 
-type AuthChangeCallback = (event: AuthChangeEvent, session: Session | null) => void;
+type AuthChangeCallback = (
+  event: AuthChangeEvent,
+  session: Session | null,
+) => void;
 
 class SpringAuthClient {
   private listeners: AuthChangeCallback[] = [];
@@ -142,15 +150,19 @@ class SpringAuthClient {
     try {
       const payload = this.decodeJwtPayload(token);
       if (!payload) {
-        console.warn('[SpringAuth] Cannot decode token for adaptive intervals, using defaults');
+        console.warn(
+          "[SpringAuth] Cannot decode token for adaptive intervals, using defaults",
+        );
         return;
       }
 
-      const expSeconds = typeof payload?.exp === 'number' ? payload.exp : 0;
-      const iatSeconds = typeof payload?.iat === 'number' ? payload.iat : 0;
+      const expSeconds = typeof payload?.exp === "number" ? payload.exp : 0;
+      const iatSeconds = typeof payload?.iat === "number" ? payload.iat : 0;
 
       if (expSeconds <= 0 || iatSeconds <= 0) {
-        console.warn('[SpringAuth] Token missing exp/iat claims, using default intervals');
+        console.warn(
+          "[SpringAuth] Token missing exp/iat claims, using default intervals",
+        );
         return;
       }
 
@@ -159,51 +171,67 @@ class SpringAuthClient {
       // Check interval: check 6 times during token lifetime
       // Min: 5 seconds (for very short tokens)
       // Max: 60 seconds (don't check too infrequently)
-      this.sessionCheckIntervalMs = Math.max(5000, Math.min(60000, tokenLifetimeMs / 6));
+      this.sessionCheckIntervalMs = Math.max(
+        5000,
+        Math.min(60000, tokenLifetimeMs / 6),
+      );
 
       // Refresh threshold: refresh when 25% of lifetime remaining
       // Min: 30 seconds (give buffer for refresh to complete)
       // Max: 5 minutes (don't wait too long for long-lived tokens)
-      this.tokenRefreshThresholdMs = Math.max(30000, Math.min(300000, tokenLifetimeMs / 4));
+      this.tokenRefreshThresholdMs = Math.max(
+        30000,
+        Math.min(300000, tokenLifetimeMs / 4),
+      );
 
-      console.log('[SpringAuth] 📊 Adaptive intervals calculated:', {
-        tokenLifetime: Math.floor(tokenLifetimeMs / 1000) + 's',
-        checkInterval: Math.floor(this.sessionCheckIntervalMs / 1000) + 's',
-        refreshThreshold: Math.floor(this.tokenRefreshThresholdMs / 1000) + 's',
+      console.log("[SpringAuth] 📊 Adaptive intervals calculated:", {
+        tokenLifetime: Math.floor(tokenLifetimeMs / 1000) + "s",
+        checkInterval: Math.floor(this.sessionCheckIntervalMs / 1000) + "s",
+        refreshThreshold: Math.floor(this.tokenRefreshThresholdMs / 1000) + "s",
       });
 
       // Restart monitoring with new interval
       this.restartSessionMonitoring();
     } catch (error) {
-      console.warn('[SpringAuth] Failed to calculate adaptive intervals:', error);
+      console.warn(
+        "[SpringAuth] Failed to calculate adaptive intervals:",
+        error,
+      );
     }
   }
 
   private decodeJwtPayload(token: string): Record<string, unknown> | null {
-    const parts = token.split('.');
+    const parts = token.split(".");
     if (parts.length < 2) {
       return null;
     }
 
     const base64Url = parts[1];
     const base64 = base64Url
-      .replace(/-/g, '+')
-      .replace(/_/g, '/')
-      .padEnd(Math.ceil(base64Url.length / 4) * 4, '=');
+      .replace(/-/g, "+")
+      .replace(/_/g, "/")
+      .padEnd(Math.ceil(base64Url.length / 4) * 4, "=");
 
     return JSON.parse(atob(base64));
   }
 
-  private getTokenExpiry(token: string): { expiresIn: number; expiresAt: number } {
+  private getTokenExpiry(token: string): {
+    expiresIn: number;
+    expiresAt: number;
+  } {
     try {
       const payload = this.decodeJwtPayload(token);
       if (!payload) {
-        throw new Error('Token payload missing');
+        throw new Error("Token payload missing");
       }
 
-      const expSeconds = typeof payload?.exp === 'number' ? payload.exp : 0;
-      const expiresAt = expSeconds > 0 ? expSeconds * 1000 : Date.now() + 3600 * 1000;
-      const expiresIn = Math.max(0, Math.floor((expiresAt - Date.now()) / 1000));
+      const expSeconds = typeof payload?.exp === "number" ? payload.exp : 0;
+      const expiresAt =
+        expSeconds > 0 ? expSeconds * 1000 : Date.now() + 3600 * 1000;
+      const expiresIn = Math.max(
+        0,
+        Math.floor((expiresAt - Date.now()) / 1000),
+      );
 
       return { expiresIn, expiresAt };
     } catch {
@@ -217,10 +245,10 @@ class SpringAuthClient {
    * Helper to get CSRF token from cookie
    */
   private getCsrfToken(): string | null {
-    const cookies = document.cookie.split(';');
+    const cookies = document.cookie.split(";");
     for (const cookie of cookies) {
-      const [name, value] = cookie.trim().split('=');
-      if (name === 'XSRF-TOKEN') {
+      const [name, value] = cookie.trim().split("=");
+      if (name === "XSRF-TOKEN") {
         return decodeURIComponent(value);
       }
     }
@@ -231,10 +259,13 @@ class SpringAuthClient {
    * Get current session
    * JWT is stored in localStorage and sent via Authorization header
    */
-  async getSession(): Promise<{ data: { session: Session | null }; error: AuthError | null }> {
+  async getSession(): Promise<{
+    data: { session: Session | null };
+    error: AuthError | null;
+  }> {
     try {
       // Get JWT from localStorage
-      let token = localStorage.getItem('stirling_jwt');
+      let token = localStorage.getItem("stirling_jwt");
 
       if (!token) {
         // console.debug('[SpringAuth] getSession: No JWT in localStorage');
@@ -246,13 +277,13 @@ class SpringAuthClient {
         if (tokenExpiry.expiresIn <= this.DESKTOP_SAAS_REFRESH_EARLY_SECONDS) {
           const refreshed = await refreshPlatformSession();
           if (!refreshed) {
-            localStorage.removeItem('stirling_jwt');
+            localStorage.removeItem("stirling_jwt");
             return { data: { session: null }, error: null };
           }
 
-          const refreshedToken = localStorage.getItem('stirling_jwt');
+          const refreshedToken = localStorage.getItem("stirling_jwt");
           if (!refreshedToken) {
-            localStorage.removeItem('stirling_jwt');
+            localStorage.removeItem("stirling_jwt");
             return { data: { session: null }, error: null };
           }
 
@@ -261,7 +292,7 @@ class SpringAuthClient {
         }
 
         if (tokenExpiry.expiresIn <= 0) {
-          localStorage.removeItem('stirling_jwt');
+          localStorage.removeItem("stirling_jwt");
           return { data: { session: null }, error: null };
         }
 
@@ -269,10 +300,13 @@ class SpringAuthClient {
 
         const session: Session = {
           user: {
-            id: platformUser?.email || platformUser?.username || 'desktop-saas-user',
-            email: platformUser?.email || '',
-            username: platformUser?.username || platformUser?.email || 'User',
-            role: 'USER',
+            id:
+              platformUser?.email ||
+              platformUser?.username ||
+              "desktop-saas-user",
+            email: platformUser?.email || "",
+            username: platformUser?.username || platformUser?.email || "User",
+            role: "USER",
           },
           access_token: token,
           expires_in: tokenExpiry.expiresIn,
@@ -285,9 +319,9 @@ class SpringAuthClient {
       // Verify with backend
       // Note: We pass the token explicitly here, overriding the interceptor's default
       // console.debug('[SpringAuth] getSession: Verifying JWT with /api/v1/auth/me');
-      const response = await apiClient.get('/api/v1/auth/me', {
+      const response = await apiClient.get("/api/v1/auth/me", {
         headers: {
-          'Authorization': `Bearer ${token}`,
+          Authorization: `Bearer ${token}`,
         },
         suppressErrorToast: true, // Suppress global error handler (we handle errors locally)
         // Session bootstrap should not trigger global 401 refresh/redirect loops.
@@ -310,7 +344,7 @@ class SpringAuthClient {
       // console.debug('[SpringAuth] getSession: Session retrieved successfully');
       return { data: { session }, error: null };
     } catch (error: unknown) {
-      console.error('[SpringAuth] getSession error:', error);
+      console.error("[SpringAuth] getSession error:", error);
 
       // If 401/403, token is invalid - try explicit refresh
       const status = getHttpStatus(error);
@@ -321,8 +355,8 @@ class SpringAuthClient {
         if (!refreshResult.error && refreshResult.data.session) {
           return refreshResult;
         }
-        localStorage.removeItem('stirling_jwt');
-        console.debug('[SpringAuth] getSession: Not authenticated');
+        localStorage.removeItem("stirling_jwt");
+        console.debug("[SpringAuth] getSession: Not authenticated");
         return { data: { session: null }, error: null };
       }
 
@@ -330,7 +364,7 @@ class SpringAuthClient {
       // The token is still valid, just can't verify it right now
       return {
         data: { session: null },
-        error: { message: getErrorMessage(error, 'Unknown error') },
+        error: { message: getErrorMessage(error, "Unknown error") },
       };
     }
   }
@@ -344,19 +378,23 @@ class SpringAuthClient {
     mfaCode?: string;
   }): Promise<AuthResponse> {
     try {
-      const response = await apiClient.post('/api/v1/auth/login', {
-        username: credentials.email,
-        password: credentials.password,
-        mfaCode: credentials.mfaCode,
-      }, {
-        withCredentials: true, // Include cookies for CSRF
-      });
+      const response = await apiClient.post(
+        "/api/v1/auth/login",
+        {
+          username: credentials.email,
+          password: credentials.password,
+          mfaCode: credentials.mfaCode,
+        },
+        {
+          withCredentials: true, // Include cookies for CSRF
+        },
+      );
 
       const data = response.data;
       const token = data.session.access_token;
 
       // Store JWT in localStorage
-      localStorage.setItem('stirling_jwt', token);
+      localStorage.setItem("stirling_jwt", token);
       // console.log('[SpringAuth] JWT stored in localStorage');
 
       // Sync token to platform-specific storage (Tauri store for desktop)
@@ -366,7 +404,7 @@ class SpringAuthClient {
       this.calculateAdaptiveIntervals(token);
 
       // Dispatch custom event for other components to react to JWT availability
-      window.dispatchEvent(new CustomEvent('jwt-available'));
+      window.dispatchEvent(new CustomEvent("jwt-available"));
 
       const session: Session = {
         user: data.user,
@@ -376,18 +414,18 @@ class SpringAuthClient {
       };
 
       // Notify listeners
-      this.notifyListeners('SIGNED_IN', session);
+      this.notifyListeners("SIGNED_IN", session);
 
       return { user: data.user, session, error: null };
     } catch (error: unknown) {
-      console.error('[SpringAuth] signInWithPassword error:', error);
+      console.error("[SpringAuth] signInWithPassword error:", error);
       if (error instanceof AxiosError) {
         const errorCode = error.response?.data?.error as string | undefined;
         const errorMessage =
           error.response?.data?.message ||
           error.response?.data?.error ||
           error.message ||
-          'Login failed';
+          "Login failed";
         return {
           user: null,
           session: null,
@@ -395,14 +433,14 @@ class SpringAuthClient {
             message: errorMessage,
             status: error.response?.status,
             code: errorCode,
-            mfaRequired: errorCode === 'mfa_required',
+            mfaRequired: errorCode === "mfa_required",
           },
         };
       }
       return {
         user: null,
         session: null,
-        error: { message: getErrorMessage(error, 'Login failed') },
+        error: { message: getErrorMessage(error, "Login failed") },
       };
     }
   }
@@ -416,12 +454,16 @@ class SpringAuthClient {
     options?: { data?: { full_name?: string }; emailRedirectTo?: string };
   }): Promise<AuthResponse> {
     try {
-      const response = await apiClient.post('/api/v1/user/register', {
-        username: credentials.email,
-        password: credentials.password,
-      }, {
-        withCredentials: true,
-      });
+      const response = await apiClient.post(
+        "/api/v1/user/register",
+        {
+          username: credentials.email,
+          password: credentials.password,
+        },
+        {
+          withCredentials: true,
+        },
+      );
 
       const data = response.data;
 
@@ -429,11 +471,11 @@ class SpringAuthClient {
       // Return user but no session (user needs to login)
       return { user: data.user, session: null, error: null };
     } catch (error: unknown) {
-      console.error('[SpringAuth] signUp error:', error);
+      console.error("[SpringAuth] signUp error:", error);
       return {
         user: null,
         session: null,
-        error: { message: getErrorMessage(error, 'Registration failed') },
+        error: { message: getErrorMessage(error, "Registration failed") },
       };
     }
   }
@@ -447,7 +489,7 @@ class SpringAuthClient {
    */
   async signInWithOAuth(params: {
     provider: OAuthProvider;
-    options?: { redirectTo?: string; queryParams?: Record<string, any> };
+    options?: { redirectTo?: string; queryParams?: Record<string, string> };
   }): Promise<{ error: AuthError | null }> {
     try {
       const redirectPath = normalizeRedirectPath(params.options?.redirectTo);
@@ -466,7 +508,10 @@ class SpringAuthClient {
       return { error: null };
     } catch (error) {
       return {
-        error: { message: error instanceof Error ? error.message : 'SSO redirect failed' },
+        error: {
+          message:
+            error instanceof Error ? error.message : "SSO redirect failed",
+        },
       };
     }
   }
@@ -476,12 +521,15 @@ class SpringAuthClient {
    */
   async signOut(): Promise<{ error: AuthError | null }> {
     try {
-      if (typeof window !== 'undefined') {
-        window.sessionStorage.setItem('stirling_sso_auto_login_logged_out', '1');
+      if (typeof window !== "undefined") {
+        window.sessionStorage.setItem(
+          "stirling_sso_auto_login_logged_out",
+          "1",
+        );
       }
-      const response = await apiClient.post('/api/v1/auth/logout', null, {
+      const response = await apiClient.post("/api/v1/auth/logout", null, {
         headers: {
-          'X-XSRF-TOKEN': this.getCsrfToken() || '',
+          "X-XSRF-TOKEN": this.getCsrfToken() || "",
         },
         withCredentials: true,
       });
@@ -491,52 +539,62 @@ class SpringAuthClient {
       }
 
       // Clean up local storage
-      localStorage.removeItem('stirling_jwt');
+      localStorage.removeItem("stirling_jwt");
       try {
         Object.keys(localStorage)
-          .filter((key) => key.startsWith('sb-') || key.includes('supabase'))
+          .filter((key) => key.startsWith("sb-") || key.includes("supabase"))
           .forEach((key) => localStorage.removeItem(key));
 
         // Clear any cached OAuth redirect/session state
         resetOAuthState();
       } catch (err) {
-        console.warn('[SpringAuth] Failed to clear Supabase/local auth tokens', err);
+        console.warn(
+          "[SpringAuth] Failed to clear Supabase/local auth tokens",
+          err,
+        );
       }
 
       // Clear cookies that might hold refresh/session tokens
       try {
-        document.cookie.split(';').forEach(cookie => {
-          const eqPos = cookie.indexOf('=');
-          const name = eqPos > -1 ? cookie.substr(0, eqPos).trim() : cookie.trim();
+        document.cookie.split(";").forEach((cookie) => {
+          const eqPos = cookie.indexOf("=");
+          const name =
+            eqPos > -1 ? cookie.substr(0, eqPos).trim() : cookie.trim();
           if (name) {
             document.cookie = `${name}=;expires=Thu, 01 Jan 1970 00:00:00 GMT;path=/;`;
           }
         });
       } catch (err) {
-        console.warn('[SpringAuth] Failed to clear cookies on sign out', err);
+        console.warn("[SpringAuth] Failed to clear cookies on sign out", err);
       }
 
       try {
         await clearPlatformAuthAfterSignOut();
       } catch (cleanupError) {
-        console.warn('[SpringAuth] Failed to run platform auth cleanup', cleanupError);
+        console.warn(
+          "[SpringAuth] Failed to run platform auth cleanup",
+          cleanupError,
+        );
       }
 
       // Notify listeners
-      this.notifyListeners('SIGNED_OUT', null);
+      this.notifyListeners("SIGNED_OUT", null);
 
       return { error: null };
     } catch (error: unknown) {
-      console.error('[SpringAuth] signOut error:', error);
+      console.error("[SpringAuth] signOut error:", error);
       // Still remove token even if backend call fails
-      localStorage.removeItem('stirling_jwt');
+      localStorage.removeItem("stirling_jwt");
       try {
         await clearPlatformAuthAfterSignOut();
       } catch (cleanupError) {
-        console.warn('[SpringAuth] Failed to run platform auth cleanup after error', cleanupError);
+        console.warn(
+          "[SpringAuth] Failed to run platform auth cleanup after error",
+          cleanupError,
+        );
       }
       return {
-        error: { message: getErrorMessage(error, 'Logout failed') },
+        error: { message: getErrorMessage(error, "Logout failed") },
       };
     }
   }
@@ -544,15 +602,18 @@ class SpringAuthClient {
   /**
    * Refresh JWT token
    */
-  async refreshSession(): Promise<{ data: { session: Session | null }; error: AuthError | null }> {
+  async refreshSession(): Promise<{
+    data: { session: Session | null };
+    error: AuthError | null;
+  }> {
     try {
       if (await isDesktopSaaSAuthMode()) {
         const refreshed = await refreshPlatformSession();
         if (!refreshed) {
-          localStorage.removeItem('stirling_jwt');
+          localStorage.removeItem("stirling_jwt");
           return {
             data: { session: null },
-            error: { message: 'Token refresh failed - please log in again' },
+            error: { message: "Token refresh failed - please log in again" },
           };
         }
 
@@ -560,23 +621,25 @@ class SpringAuthClient {
         if (error || !data.session) {
           return {
             data: { session: null },
-            error: error || { message: 'Token refresh failed - please log in again' },
+            error: error || {
+              message: "Token refresh failed - please log in again",
+            },
           };
         }
 
         // Calculate adaptive intervals for desktop SaaS mode
-        const token = localStorage.getItem('stirling_jwt');
+        const token = localStorage.getItem("stirling_jwt");
         if (token) {
           this.calculateAdaptiveIntervals(token);
         }
 
-        this.notifyListeners('TOKEN_REFRESHED', data.session);
+        this.notifyListeners("TOKEN_REFRESHED", data.session);
         return { data, error: null };
       }
 
-      const response = await apiClient.post('/api/v1/auth/refresh', null, {
+      const response = await apiClient.post("/api/v1/auth/refresh", null, {
         headers: {
-          'X-XSRF-TOKEN': this.getCsrfToken() || '',
+          "X-XSRF-TOKEN": this.getCsrfToken() || "",
         },
         withCredentials: true,
         suppressErrorToast: true, // Suppress global error handler (we handle errors locally)
@@ -586,7 +649,7 @@ class SpringAuthClient {
       const token = data.session.access_token;
 
       // Update local storage with new token
-      localStorage.setItem('stirling_jwt', token);
+      localStorage.setItem("stirling_jwt", token);
 
       // Sync token to platform-specific storage (Tauri store for desktop)
       await savePlatformToken(token);
@@ -602,24 +665,27 @@ class SpringAuthClient {
       };
 
       // Notify listeners
-      this.notifyListeners('TOKEN_REFRESHED', session);
+      this.notifyListeners("TOKEN_REFRESHED", session);
 
-      console.debug('[SpringAuth] Token refreshed successfully');
+      console.debug("[SpringAuth] Token refreshed successfully");
 
       return { data: { session }, error: null };
     } catch (error: unknown) {
-      console.error('[SpringAuth] refreshSession error:', error);
-      localStorage.removeItem('stirling_jwt');
+      console.error("[SpringAuth] refreshSession error:", error);
+      localStorage.removeItem("stirling_jwt");
 
       // Handle different error statuses
       const status = getHttpStatus(error);
       if (status === 401 || status === 403) {
-        return { data: { session: null }, error: { message: 'Token refresh failed - please log in again' } };
+        return {
+          data: { session: null },
+          error: { message: "Token refresh failed - please log in again" },
+        };
       }
 
       return {
         data: { session: null },
-        error: { message: getErrorMessage(error, 'Token refresh failed') },
+        error: { message: getErrorMessage(error, "Token refresh failed") },
       };
     }
   }
@@ -627,7 +693,9 @@ class SpringAuthClient {
   /**
    * Listen to auth state changes
    */
-  onAuthStateChange(callback: AuthChangeCallback): { data: { subscription: { unsubscribe: () => void } } } {
+  onAuthStateChange(callback: AuthChangeCallback): {
+    data: { subscription: { unsubscribe: () => void } };
+  } {
     this.listeners.push(callback);
 
     return {
@@ -650,7 +718,10 @@ class SpringAuthClient {
         try {
           callback(event, session);
         } catch (error) {
-          console.error('[SpringAuth] Error in auth state change listener:', error);
+          console.error(
+            "[SpringAuth] Error in auth state change listener:",
+            error,
+          );
         }
       });
     }, 0);
@@ -669,13 +740,20 @@ class SpringAuthClient {
           const timeUntilExpiry = (data.session.expires_at || 0) - Date.now();
 
           // Refresh if token expires soon (threshold is adaptive)
-          if (timeUntilExpiry > 0 && timeUntilExpiry < this.tokenRefreshThresholdMs) {
-            console.log('[SpringAuth] 🔄 Proactively refreshing token (expires in ' + Math.floor(timeUntilExpiry / 1000) + 's)');
+          if (
+            timeUntilExpiry > 0 &&
+            timeUntilExpiry < this.tokenRefreshThresholdMs
+          ) {
+            console.log(
+              "[SpringAuth] 🔄 Proactively refreshing token (expires in " +
+                Math.floor(timeUntilExpiry / 1000) +
+                "s)",
+            );
             await this.refreshSession();
           }
         }
       } catch (error) {
-        console.error('[SpringAuth] Session monitoring error:', error);
+        console.error("[SpringAuth] Session monitoring error:", error);
       }
     }, this.sessionCheckIntervalMs);
   }
@@ -720,14 +798,14 @@ export const isUserAnonymous = (user: User | null) => {
  */
 export const createAnonymousUser = (): User => {
   return {
-    id: 'anonymous',
-    email: 'anonymous@local',
-    username: 'Anonymous User',
-    role: 'USER',
+    id: "anonymous",
+    email: "anonymous@local",
+    username: "Anonymous User",
+    role: "USER",
     enabled: true,
     is_anonymous: true,
     app_metadata: {
-      provider: 'anonymous',
+      provider: "anonymous",
     },
   };
 };
@@ -738,7 +816,7 @@ export const createAnonymousUser = (): User => {
 export const createAnonymousSession = (): Session => {
   return {
     user: createAnonymousUser(),
-    access_token: '',
+    access_token: "",
     expires_in: Number.MAX_SAFE_INTEGER,
     expires_at: Number.MAX_SAFE_INTEGER,
   };
diff --git a/frontend/src/proprietary/components/AppProviders.tsx b/frontend/src/proprietary/components/AppProviders.tsx
index a0e9a63dc7..db10725f2a 100644
--- a/frontend/src/proprietary/components/AppProviders.tsx
+++ b/frontend/src/proprietary/components/AppProviders.tsx
@@ -1,4 +1,7 @@
-import { AppProviders as CoreAppProviders, AppProvidersProps } from "@core/components/AppProviders";
+import {
+  AppProviders as CoreAppProviders,
+  AppProvidersProps,
+} from "@core/components/AppProviders";
 import { AuthProvider } from "@app/auth/UseSession";
 import { LicenseProvider } from "@app/contexts/LicenseContext";
 import { CheckoutProvider } from "@app/contexts/CheckoutContext";
@@ -6,7 +9,11 @@ import { UpgradeBannerInitializer } from "@app/components/shared/UpgradeBannerIn
 import { ServerExperienceProvider } from "@app/contexts/ServerExperienceContext";
 import { UpdateSeatsProvider } from "@app/contexts/UpdateSeatsContext";
 
-export function AppProviders({ children, appConfigRetryOptions, appConfigProviderProps }: AppProvidersProps) {
+export function AppProviders({
+  children,
+  appConfigRetryOptions,
+  appConfigProviderProps,
+}: AppProvidersProps) {
   return (
     <CoreAppProviders
       appConfigRetryOptions={appConfigRetryOptions}
diff --git a/frontend/src/proprietary/components/shared/ChangeUserPasswordModal.tsx b/frontend/src/proprietary/components/shared/ChangeUserPasswordModal.tsx
index 9e0cd222c4..aa116fff63 100644
--- a/frontend/src/proprietary/components/shared/ChangeUserPasswordModal.tsx
+++ b/frontend/src/proprietary/components/shared/ChangeUserPasswordModal.tsx
@@ -1,5 +1,6 @@
-import { useEffect, useMemo, useState } from 'react';
-import { useTranslation } from 'react-i18next';
+import { useEffect, useMemo, useState } from "react";
+import { isAxiosError } from "axios";
+import { useTranslation } from "react-i18next";
 import {
   ActionIcon,
   Button,
@@ -11,11 +12,15 @@ import {
   Stack,
   Text,
   Tooltip,
-} from '@mantine/core';
-import LocalIcon from '@app/components/shared/LocalIcon';
-import { alert } from '@app/components/toast';
-import { ChangeUserPasswordRequest, User, userManagementService } from '@app/services/userManagementService';
-import { Z_INDEX_OVER_CONFIG_MODAL } from '@app/styles/zIndex';
+} from "@mantine/core";
+import LocalIcon from "@app/components/shared/LocalIcon";
+import { alert } from "@app/components/toast";
+import {
+  ChangeUserPasswordRequest,
+  User,
+  userManagementService,
+} from "@app/services/userManagementService";
+import { Z_INDEX_OVER_CONFIG_MODAL } from "@app/styles/zIndex";
 
 interface ChangeUserPasswordModalProps {
   opened: boolean;
@@ -26,9 +31,10 @@ interface ChangeUserPasswordModalProps {
 }
 
 function generateSecurePassword() {
-  const charset = 'ABCDEFGHJKLMNPQRSTUVWXYZabcdefghijkmnopqrstuvwxyz0123456789@$!%*?&';
+  const charset =
+    "ABCDEFGHJKLMNPQRSTUVWXYZabcdefghijkmnopqrstuvwxyz0123456789@$!%*?&";
   const length = 14;
-  let password = '';
+  let password = "";
   const charsetLength = charset.length;
   const uint8Array = new Uint8Array(length);
   window.crypto.getRandomValues(uint8Array);
@@ -51,11 +57,17 @@ function generateSecurePassword() {
   return password;
 }
 
-export default function ChangeUserPasswordModal({ opened, onClose, user, onSuccess, mailEnabled }: ChangeUserPasswordModalProps) {
+export default function ChangeUserPasswordModal({
+  opened,
+  onClose,
+  user,
+  onSuccess,
+  mailEnabled,
+}: ChangeUserPasswordModalProps) {
   const { t } = useTranslation();
   const [form, setForm] = useState({
-    newPassword: '',
-    confirmPassword: '',
+    newPassword: "",
+    confirmPassword: "",
     generateRandom: false,
     sendEmail: false,
     includePassword: false,
@@ -67,23 +79,40 @@ export default function ChangeUserPasswordModal({ opened, onClose, user, onSucce
 
   const handleGeneratePassword = () => {
     const generated = generateSecurePassword();
-    setForm((prev) => ({ ...prev, newPassword: generated, confirmPassword: generated, generateRandom: true }));
+    setForm((prev) => ({
+      ...prev,
+      newPassword: generated,
+      confirmPassword: generated,
+      generateRandom: true,
+    }));
   };
 
   const handleCopyPassword = async () => {
     if (!form.newPassword) return;
     try {
       await navigator.clipboard.writeText(form.newPassword);
-      alert({ alertType: 'success', title: t('workspace.people.changePassword.copiedToClipboard', 'Password copied to clipboard') });
+      alert({
+        alertType: "success",
+        title: t(
+          "workspace.people.changePassword.copiedToClipboard",
+          "Password copied to clipboard",
+        ),
+      });
     } catch (_error) {
-      alert({ alertType: 'error', title: t('workspace.people.changePassword.copyFailed', 'Failed to copy password') });
+      alert({
+        alertType: "error",
+        title: t(
+          "workspace.people.changePassword.copyFailed",
+          "Failed to copy password",
+        ),
+      });
     }
   };
 
   const resetState = () => {
     setForm({
-      newPassword: '',
-      confirmPassword: '',
+      newPassword: "",
+      confirmPassword: "",
       generateRandom: false,
       sendEmail: false,
       includePassword: false,
@@ -101,12 +130,24 @@ export default function ChangeUserPasswordModal({ opened, onClose, user, onSucce
     if (!user) return;
 
     if (!form.generateRandom && !form.newPassword.trim()) {
-      alert({ alertType: 'error', title: t('workspace.people.changePassword.passwordRequired', 'Please enter a new password') });
+      alert({
+        alertType: "error",
+        title: t(
+          "workspace.people.changePassword.passwordRequired",
+          "Please enter a new password",
+        ),
+      });
       return;
     }
 
     if (!form.generateRandom && form.newPassword !== form.confirmPassword) {
-      alert({ alertType: 'error', title: t('workspace.people.changePassword.passwordMismatch', 'Passwords do not match') });
+      alert({
+        alertType: "error",
+        title: t(
+          "workspace.people.changePassword.passwordMismatch",
+          "Passwords do not match",
+        ),
+      });
       return;
     }
 
@@ -122,12 +163,26 @@ export default function ChangeUserPasswordModal({ opened, onClose, user, onSucce
     try {
       setProcessing(true);
       await userManagementService.changeUserPassword(payload);
-      alert({ alertType: 'success', title: t('workspace.people.changePassword.success', 'Password updated successfully') });
+      alert({
+        alertType: "success",
+        title: t(
+          "workspace.people.changePassword.success",
+          "Password updated successfully",
+        ),
+      });
       onSuccess();
       handleClose();
-    } catch (error: any) {
-      const errorMessage = error.response?.data?.message || error.response?.data?.error || error.message || t('workspace.people.changePassword.error', 'Failed to update password');
-      alert({ alertType: 'error', title: errorMessage });
+    } catch (error: unknown) {
+      const errorMessage = isAxiosError(error)
+        ? error.response?.data?.message ||
+          error.response?.data?.error ||
+          error.message
+        : (error instanceof Error ? error.message : undefined) ||
+          t(
+            "workspace.people.changePassword.error",
+            "Failed to update password",
+          );
+      alert({ alertType: "error", title: errorMessage });
     } finally {
       setProcessing(false);
     }
@@ -136,8 +191,8 @@ export default function ChangeUserPasswordModal({ opened, onClose, user, onSucce
   useEffect(() => {
     if (opened) {
       setForm({
-        newPassword: '',
-        confirmPassword: '',
+        newPassword: "",
+        confirmPassword: "",
         generateRandom: false,
         sendEmail: false,
         includePassword: false,
@@ -154,7 +209,10 @@ export default function ChangeUserPasswordModal({ opened, onClose, user, onSucce
   };
 
   const canEmail = mailEnabled && isValidEmail(user?.username);
-  const passwordPreview = useMemo(() => form.newPassword && form.generateRandom ? form.newPassword : '', [form.generateRandom, form.newPassword]);
+  const passwordPreview = useMemo(
+    () => (form.newPassword && form.generateRandom ? form.newPassword : ""),
+    [form.generateRandom, form.newPassword],
+  );
 
   return (
     <Modal
@@ -166,13 +224,13 @@ export default function ChangeUserPasswordModal({ opened, onClose, user, onSucce
       padding="xl"
       withCloseButton={false}
     >
-      <div style={{ position: 'relative' }}>
+      <div style={{ position: "relative" }}>
         <CloseButton
           onClick={handleClose}
           size="lg"
           disabled={processing}
           style={{
-            position: 'absolute',
+            position: "absolute",
             top: -8,
             right: -8,
             zIndex: 1,
@@ -180,35 +238,80 @@ export default function ChangeUserPasswordModal({ opened, onClose, user, onSucce
         />
         <Stack gap="lg" pt="md">
           <Stack gap="md" align="center">
-            <LocalIcon icon="lock" width="3rem" height="3rem" style={{ color: 'var(--mantine-color-gray-6)' }} />
+            <LocalIcon
+              icon="lock"
+              width="3rem"
+              height="3rem"
+              style={{ color: "var(--mantine-color-gray-6)" }}
+            />
             <Text size="xl" fw={600} ta="center">
-              {t('workspace.people.changePassword.title', 'Change password')}
+              {t("workspace.people.changePassword.title", "Change password")}
             </Text>
             <Text size="sm" c="dimmed" ta="center">
-              {t('workspace.people.changePassword.subtitle', 'Update the password for')} <strong>{user?.username}</strong>
+              {t(
+                "workspace.people.changePassword.subtitle",
+                "Update the password for",
+              )}{" "}
+              <strong>{user?.username}</strong>
             </Text>
           </Stack>
 
           <Stack gap="sm">
             <PasswordInput
-              label={t('workspace.people.changePassword.newPassword', 'New password')}
-              placeholder={t('workspace.people.changePassword.placeholder', 'Enter a new password')}
+              label={t(
+                "workspace.people.changePassword.newPassword",
+                "New password",
+              )}
+              placeholder={t(
+                "workspace.people.changePassword.placeholder",
+                "Enter a new password",
+              )}
               value={form.newPassword}
-              onChange={(event) => setForm({ ...form, newPassword: event.currentTarget.value, generateRandom: false })}
+              onChange={(event) =>
+                setForm({
+                  ...form,
+                  newPassword: event.currentTarget.value,
+                  generateRandom: false,
+                })
+              }
               disabled={processing || disabled || form.generateRandom}
               data-autofocus
             />
             <PasswordInput
-              label={t('workspace.people.changePassword.confirmPassword', 'Confirm password')}
-              placeholder={t('workspace.people.changePassword.confirmPlaceholder', 'Re-enter the new password')}
+              label={t(
+                "workspace.people.changePassword.confirmPassword",
+                "Confirm password",
+              )}
+              placeholder={t(
+                "workspace.people.changePassword.confirmPlaceholder",
+                "Re-enter the new password",
+              )}
               value={form.confirmPassword}
-              onChange={(event) => setForm({ ...form, confirmPassword: event.currentTarget.value, generateRandom: false })}
+              onChange={(event) =>
+                setForm({
+                  ...form,
+                  confirmPassword: event.currentTarget.value,
+                  generateRandom: false,
+                })
+              }
               disabled={processing || disabled || form.generateRandom}
-              error={!form.generateRandom && form.confirmPassword && form.newPassword !== form.confirmPassword ? t('workspace.people.changePassword.passwordMismatch', 'Passwords do not match') : undefined}
+              error={
+                !form.generateRandom &&
+                form.confirmPassword &&
+                form.newPassword !== form.confirmPassword
+                  ? t(
+                      "workspace.people.changePassword.passwordMismatch",
+                      "Passwords do not match",
+                    )
+                  : undefined
+              }
             />
             <Group justify="space-between">
               <Checkbox
-                label={t('workspace.people.changePassword.generateRandom', 'Generate secure password')}
+                label={t(
+                  "workspace.people.changePassword.generateRandom",
+                  "Generate secure password",
+                )}
                 checked={form.generateRandom}
                 disabled={processing || disabled}
                 onChange={(event) => {
@@ -222,9 +325,18 @@ export default function ChangeUserPasswordModal({ opened, onClose, user, onSucce
               {passwordPreview && (
                 <Group gap="xs" align="center">
                   <Text size="xs" c="dimmed">
-                    {t('workspace.people.changePassword.generatedPreview', 'Generated password:')} <strong>{passwordPreview}</strong>
+                    {t(
+                      "workspace.people.changePassword.generatedPreview",
+                      "Generated password:",
+                    )}{" "}
+                    <strong>{passwordPreview}</strong>
                   </Text>
-                  <Tooltip label={t('workspace.people.changePassword.copyTooltip', 'Copy to clipboard')}>
+                  <Tooltip
+                    label={t(
+                      "workspace.people.changePassword.copyTooltip",
+                      "Copy to clipboard",
+                    )}
+                  >
                     <ActionIcon
                       size="sm"
                       variant="subtle"
@@ -232,7 +344,11 @@ export default function ChangeUserPasswordModal({ opened, onClose, user, onSucce
                       onClick={handleCopyPassword}
                       disabled={processing}
                     >
-                      <LocalIcon icon="content-copy" width="0.9rem" height="0.9rem" />
+                      <LocalIcon
+                        icon="content-copy"
+                        width="0.9rem"
+                        height="0.9rem"
+                      />
                     </ActionIcon>
                   </Tooltip>
                 </Group>
@@ -242,39 +358,76 @@ export default function ChangeUserPasswordModal({ opened, onClose, user, onSucce
 
           <Stack gap="xs">
             <Checkbox
-              label={t('workspace.people.changePassword.sendEmail', 'Email the user about this change')}
+              label={t(
+                "workspace.people.changePassword.sendEmail",
+                "Email the user about this change",
+              )}
               checked={canEmail && form.sendEmail}
-              onChange={(event) => setForm({ ...form, sendEmail: event.currentTarget.checked })}
+              onChange={(event) =>
+                setForm({ ...form, sendEmail: event.currentTarget.checked })
+              }
               disabled={!canEmail || processing}
             />
             <Checkbox
-              label={t('workspace.people.changePassword.includePassword', 'Include the new password in the email')}
+              label={t(
+                "workspace.people.changePassword.includePassword",
+                "Include the new password in the email",
+              )}
               checked={canEmail && form.sendEmail && form.includePassword}
-              onChange={(event) => setForm({ ...form, includePassword: event.currentTarget.checked })}
+              onChange={(event) =>
+                setForm({
+                  ...form,
+                  includePassword: event.currentTarget.checked,
+                })
+              }
               disabled={!canEmail || !form.sendEmail || processing}
             />
             <Checkbox
-              label={t('workspace.people.changePassword.forcePasswordChange', 'Force user to change password on next login')}
+              label={t(
+                "workspace.people.changePassword.forcePasswordChange",
+                "Force user to change password on next login",
+              )}
               checked={form.forcePasswordChange}
-              onChange={(event) => setForm({ ...form, forcePasswordChange: event.currentTarget.checked })}
+              onChange={(event) =>
+                setForm({
+                  ...form,
+                  forcePasswordChange: event.currentTarget.checked,
+                })
+              }
               disabled={processing || disabled}
             />
             {!canEmail && (
               <Text size="xs" c="dimmed">
                 {mailEnabled
-                  ? t('workspace.people.changePassword.emailUnavailable', "This user's email is not a valid email address. Notifications are disabled.")
-                  : t('workspace.people.changePassword.smtpDisabled', 'Email notifications require SMTP to be enabled in settings.')}
+                  ? t(
+                      "workspace.people.changePassword.emailUnavailable",
+                      "This user's email is not a valid email address. Notifications are disabled.",
+                    )
+                  : t(
+                      "workspace.people.changePassword.smtpDisabled",
+                      "Email notifications require SMTP to be enabled in settings.",
+                    )}
               </Text>
             )}
             {canEmail && !form.includePassword && form.sendEmail && (
               <Text size="xs" c="dimmed">
-                {t('workspace.people.changePassword.notifyOnly', 'An email will be sent without the password, letting the user know an admin changed it.')}
+                {t(
+                  "workspace.people.changePassword.notifyOnly",
+                  "An email will be sent without the password, letting the user know an admin changed it.",
+                )}
               </Text>
             )}
           </Stack>
 
-          <Button onClick={handleSubmit} loading={processing} fullWidth size="md" disabled={disabled} mt="md">
-            {t('workspace.people.changePassword.submit', 'Update password')}
+          <Button
+            onClick={handleSubmit}
+            loading={processing}
+            fullWidth
+            size="md"
+            disabled={disabled}
+            mt="md"
+          >
+            {t("workspace.people.changePassword.submit", "Update password")}
           </Button>
         </Stack>
       </div>
diff --git a/frontend/src/proprietary/components/shared/DividerWithText.tsx b/frontend/src/proprietary/components/shared/DividerWithText.tsx
index 888f4acfb7..ec8bd3523c 100644
--- a/frontend/src/proprietary/components/shared/DividerWithText.tsx
+++ b/frontend/src/proprietary/components/shared/DividerWithText.tsx
@@ -1,18 +1,28 @@
-import '@app/components/shared/dividerWithText/DividerWithText.css';
+import "@app/components/shared/dividerWithText/DividerWithText.css";
 
 interface TextDividerProps {
-  text?: string
-  className?: string
-  style?: React.CSSProperties
-  variant?: 'default' | 'subcategory'
-  respondsToDarkMode?: boolean
-  opacity?: number
+  text?: string;
+  className?: string;
+  style?: React.CSSProperties;
+  variant?: "default" | "subcategory";
+  respondsToDarkMode?: boolean;
+  opacity?: number;
 }
 
-export default function DividerWithText({ text, className = '', style, variant = 'default', respondsToDarkMode = true, opacity }: TextDividerProps) {
-  const variantClass = variant === 'subcategory' ? 'subcategory' : '';
-  const themeClass = respondsToDarkMode ? '' : 'force-light';
-  const styleWithOpacity = opacity !== undefined ? { ...(style || {}), ['--text-divider-opacity' as any]: opacity } : style;
+export default function DividerWithText({
+  text,
+  className = "",
+  style,
+  variant = "default",
+  respondsToDarkMode = true,
+  opacity,
+}: TextDividerProps) {
+  const variantClass = variant === "subcategory" ? "subcategory" : "";
+  const themeClass = respondsToDarkMode ? "" : "force-light";
+  const styleWithOpacity =
+    opacity !== undefined
+      ? { ...(style || {}), ["--text-divider-opacity" as string]: opacity }
+      : style;
 
   if (text) {
     return (
diff --git a/frontend/src/proprietary/components/shared/InviteMembersModal.tsx b/frontend/src/proprietary/components/shared/InviteMembersModal.tsx
index 3298ca8e94..9b3377f33b 100644
--- a/frontend/src/proprietary/components/shared/InviteMembersModal.tsx
+++ b/frontend/src/proprietary/components/shared/InviteMembersModal.tsx
@@ -1,5 +1,6 @@
-import { useState, useEffect, useRef } from 'react';
-import { useTranslation } from 'react-i18next';
+import { useState, useEffect, useRef } from "react";
+import { isAxiosError } from "axios";
+import { useTranslation } from "react-i18next";
 import {
   Modal,
   Stack,
@@ -15,14 +16,14 @@ import {
   CloseButton,
   Box,
   Group,
-} from '@mantine/core';
-import LocalIcon from '@app/components/shared/LocalIcon';
-import { alert } from '@app/components/toast';
-import { userManagementService } from '@app/services/userManagementService';
-import { teamService, Team } from '@app/services/teamService';
-import { Z_INDEX_OVER_CONFIG_MODAL } from '@app/styles/zIndex';
-import { useAppConfig } from '@app/contexts/AppConfigContext';
-import { useNavigate } from 'react-router-dom';
+} from "@mantine/core";
+import LocalIcon from "@app/components/shared/LocalIcon";
+import { alert } from "@app/components/toast";
+import { userManagementService } from "@app/services/userManagementService";
+import { teamService, Team } from "@app/services/teamService";
+import { Z_INDEX_OVER_CONFIG_MODAL } from "@app/styles/zIndex";
+import { useAppConfig } from "@app/contexts/AppConfigContext";
+import { useNavigate } from "react-router-dom";
 
 interface InviteMembersModalProps {
   opened: boolean;
@@ -30,14 +31,22 @@ interface InviteMembersModalProps {
   onSuccess?: () => void;
 }
 
-export default function InviteMembersModal({ opened, onClose, onSuccess }: InviteMembersModalProps) {
+export default function InviteMembersModal({
+  opened,
+  onClose,
+  onSuccess,
+}: InviteMembersModalProps) {
   const { t } = useTranslation();
   const { config } = useAppConfig();
   const navigate = useNavigate();
   const [teams, setTeams] = useState<Team[]>([]);
   const [processing, setProcessing] = useState(false);
-  const [inviteMode, setInviteMode] = useState<'email' | 'direct' | 'link'>('direct');
-  const [generatedInviteLink, setGeneratedInviteLink] = useState<string | null>(null);
+  const [inviteMode, setInviteMode] = useState<"email" | "direct" | "link">(
+    "direct",
+  );
+  const [generatedInviteLink, setGeneratedInviteLink] = useState<string | null>(
+    null,
+  );
   const actionTakenRef = useRef(false);
 
   // License information
@@ -53,26 +62,26 @@ export default function InviteMembersModal({ opened, onClose, onSuccess }: Invit
 
   // Form state for direct invite
   const [inviteForm, setInviteForm] = useState({
-    username: '',
-    password: '',
-    role: 'ROLE_USER',
+    username: "",
+    password: "",
+    role: "ROLE_USER",
     teamId: undefined as number | undefined,
-    authType: 'WEB' as 'WEB' | 'OAUTH2' | 'SAML2',
+    authType: "WEB" as "WEB" | "OAUTH2" | "SAML2",
     forceChange: false,
     forceMFA: false,
   });
 
   // Form state for email invite
   const [emailInviteForm, setEmailInviteForm] = useState({
-    emails: '',
-    role: 'ROLE_USER',
+    emails: "",
+    role: "ROLE_USER",
     teamId: undefined as number | undefined,
   });
 
   // Form state for invite link
   const [inviteLinkForm, setInviteLinkForm] = useState({
-    email: '',
-    role: 'ROLE_USER',
+    email: "",
+    role: "ROLE_USER",
     teamId: undefined as number | undefined,
     expiryHours: 72,
     sendEmail: false,
@@ -99,7 +108,7 @@ export default function InviteMembersModal({ opened, onClose, onSuccess }: Invit
             totalUsers: adminData.totalUsers,
           });
         } catch (error) {
-          console.error('Failed to fetch data:', error);
+          console.error("Failed to fetch data:", error);
         }
       };
       fetchData();
@@ -108,12 +117,12 @@ export default function InviteMembersModal({ opened, onClose, onSuccess }: Invit
 
   const roleOptions = [
     {
-      value: 'ROLE_USER',
-      label: t('workspace.people.roleDescriptions.user', 'User'),
+      value: "ROLE_USER",
+      label: t("workspace.people.roleDescriptions.user", "User"),
     },
     {
-      value: 'ROLE_ADMIN',
-      label: t('workspace.people.roleDescriptions.admin', 'Admin'),
+      value: "ROLE_ADMIN",
+      label: t("workspace.people.roleDescriptions.admin", "Admin"),
     },
   ];
 
@@ -124,13 +133,22 @@ export default function InviteMembersModal({ opened, onClose, onSuccess }: Invit
 
   const handleInviteUser = async () => {
     if (!inviteForm.username) {
-      alert({ alertType: 'error', title: t('workspace.people.addMember.usernameRequired') });
+      alert({
+        alertType: "error",
+        title: t("workspace.people.addMember.usernameRequired"),
+      });
       return;
     }
 
     // Password is only required for WEB auth type
-    if (inviteForm.authType === 'WEB' && !inviteForm.password) {
-      alert({ alertType: 'error', title: t('workspace.people.addMember.passwordRequired', 'Password is required') });
+    if (inviteForm.authType === "WEB" && !inviteForm.password) {
+      alert({
+        alertType: "error",
+        title: t(
+          "workspace.people.addMember.passwordRequired",
+          "Password is required",
+        ),
+      });
       return;
     }
 
@@ -145,23 +163,31 @@ export default function InviteMembersModal({ opened, onClose, onSuccess }: Invit
         forceChange: inviteForm.forceChange,
         forceMFA: inviteForm.forceMFA,
       });
-      alert({ alertType: 'success', title: t('workspace.people.addMember.success') });
+      alert({
+        alertType: "success",
+        title: t("workspace.people.addMember.success"),
+      });
       onClose();
       onSuccess?.();
       // Reset form
       setInviteForm({
-        username: '',
-        password: '',
-        role: 'ROLE_USER',
+        username: "",
+        password: "",
+        role: "ROLE_USER",
         teamId: undefined,
-        authType: 'WEB',
+        authType: "WEB",
         forceChange: false,
         forceMFA: false,
       });
-    } catch (error: any) {
-      console.error('Failed to invite user:', error);
-      const errorMessage = error.response?.data?.message || error.response?.data?.error || error.message || t('workspace.people.addMember.error');
-      alert({ alertType: 'error', title: errorMessage });
+    } catch (error: unknown) {
+      console.error("Failed to invite user:", error);
+      const errorMessage = isAxiosError(error)
+        ? error.response?.data?.message ||
+          error.response?.data?.error ||
+          error.message
+        : (error instanceof Error ? error.message : undefined) ||
+          t("workspace.people.addMember.error");
+      alert({ alertType: "error", title: errorMessage });
     } finally {
       setProcessing(false);
     }
@@ -169,7 +195,13 @@ export default function InviteMembersModal({ opened, onClose, onSuccess }: Invit
 
   const handleEmailInvite = async () => {
     if (!emailInviteForm.emails.trim()) {
-      alert({ alertType: 'error', title: t('workspace.people.emailInvite.emailsRequired', 'Email addresses are required') });
+      alert({
+        alertType: "error",
+        title: t(
+          "workspace.people.emailInvite.emailsRequired",
+          "Email addresses are required",
+        ),
+      });
       return;
     }
 
@@ -184,40 +216,51 @@ export default function InviteMembersModal({ opened, onClose, onSuccess }: Invit
       if (response.successCount > 0) {
         // Show success message
         alert({
-          alertType: 'success',
-          title: t('workspace.people.emailInvite.success', { count: response.successCount, defaultValue: `Successfully invited ${response.successCount} user(s)` })
+          alertType: "success",
+          title: t("workspace.people.emailInvite.success", {
+            count: response.successCount,
+            defaultValue: `Successfully invited ${response.successCount} user(s)`,
+          }),
         });
 
         // Show warning if there were partial failures
         if (response.failureCount > 0 && response.errors) {
           alert({
-            alertType: 'warning',
-            title: t('workspace.people.emailInvite.partialFailure', 'Some invites failed'),
-            body: response.errors
+            alertType: "warning",
+            title: t(
+              "workspace.people.emailInvite.partialFailure",
+              "Some invites failed",
+            ),
+            body: response.errors,
           });
         }
 
         onClose();
         onSuccess?.();
         setEmailInviteForm({
-          emails: '',
-          role: 'ROLE_USER',
+          emails: "",
+          role: "ROLE_USER",
           teamId: undefined,
         });
       } else {
         alert({
-          alertType: 'error',
-          title: t('workspace.people.emailInvite.allFailed', 'Failed to invite users'),
-          body: response.errors || response.error
+          alertType: "error",
+          title: t(
+            "workspace.people.emailInvite.allFailed",
+            "Failed to invite users",
+          ),
+          body: response.errors || response.error,
         });
       }
-    } catch (error: any) {
-      console.error('Failed to invite users:', error);
-      const errorMessage = error.response?.data?.message ||
-                          error.response?.data?.error ||
-                          error.message ||
-                          t('workspace.people.emailInvite.error', 'Failed to send invites');
-      alert({ alertType: 'error', title: errorMessage });
+    } catch (error: unknown) {
+      console.error("Failed to invite users:", error);
+      const errorMessage = isAxiosError(error)
+        ? error.response?.data?.message ||
+          error.response?.data?.error ||
+          error.message
+        : (error instanceof Error ? error.message : undefined) ||
+          t("workspace.people.emailInvite.error", "Failed to send invites");
+      alert({ alertType: "error", title: errorMessage });
     } finally {
       setProcessing(false);
     }
@@ -237,12 +280,26 @@ export default function InviteMembersModal({ opened, onClose, onSuccess }: Invit
       actionTakenRef.current = true;
       setGeneratedInviteLink(response.inviteUrl);
       if (inviteLinkForm.sendEmail && inviteLinkForm.email) {
-        alert({ alertType: 'success', title: t('workspace.people.inviteLink.emailSent', 'Invite link generated and sent via email') });
+        alert({
+          alertType: "success",
+          title: t(
+            "workspace.people.inviteLink.emailSent",
+            "Invite link generated and sent via email",
+          ),
+        });
       }
-    } catch (error: any) {
-      console.error('Failed to generate invite link:', error);
-      const errorMessage = error.response?.data?.message || error.response?.data?.error || error.message || t('workspace.people.inviteLink.error', 'Failed to generate invite link');
-      alert({ alertType: 'error', title: errorMessage });
+    } catch (error: unknown) {
+      console.error("Failed to generate invite link:", error);
+      const errorMessage = isAxiosError(error)
+        ? error.response?.data?.message ||
+          error.response?.data?.error ||
+          error.message
+        : (error instanceof Error ? error.message : undefined) ||
+          t(
+            "workspace.people.inviteLink.error",
+            "Failed to generate invite link",
+          );
+      alert({ alertType: "error", title: errorMessage });
     } finally {
       setProcessing(false);
     }
@@ -254,24 +311,24 @@ export default function InviteMembersModal({ opened, onClose, onSuccess }: Invit
       actionTakenRef.current = false;
     }
     setGeneratedInviteLink(null);
-    setInviteMode('direct');
+    setInviteMode("direct");
     setInviteForm({
-      username: '',
-      password: '',
-      role: 'ROLE_USER',
+      username: "",
+      password: "",
+      role: "ROLE_USER",
       teamId: undefined,
-      authType: 'WEB',
+      authType: "WEB",
       forceChange: false,
       forceMFA: false,
     });
     setEmailInviteForm({
-      emails: '',
-      role: 'ROLE_USER',
+      emails: "",
+      role: "ROLE_USER",
       teamId: undefined,
     });
     setInviteLinkForm({
-      email: '',
-      role: 'ROLE_USER',
+      email: "",
+      role: "ROLE_USER",
       teamId: undefined,
       expiryHours: 72,
       sendEmail: false,
@@ -281,13 +338,13 @@ export default function InviteMembersModal({ opened, onClose, onSuccess }: Invit
 
   const handleGoToPlan = () => {
     handleClose();
-    navigate('/settings/adminPlan');
+    navigate("/settings/adminPlan");
   };
 
   const handlePrimaryAction = () => {
-    if (inviteMode === 'email') {
+    if (inviteMode === "email") {
       handleEmailInvite();
-    } else if (inviteMode === 'link') {
+    } else if (inviteMode === "link") {
       handleGenerateInviteLink();
     } else {
       handleInviteUser();
@@ -309,53 +366,76 @@ export default function InviteMembersModal({ opened, onClose, onSuccess }: Invit
           onClick={handleClose}
           size="lg"
           style={{
-            position: 'absolute',
+            position: "absolute",
             top: -8,
             right: -8,
-            zIndex: 1
+            zIndex: 1,
           }}
         />
         <Stack gap="lg" pt="md">
           {/* Header with Icon */}
           <Stack gap="md" align="center">
-            <LocalIcon icon="person-add" width="3rem" height="3rem" style={{ color: 'var(--mantine-color-gray-6)' }} />
+            <LocalIcon
+              icon="person-add"
+              width="3rem"
+              height="3rem"
+              style={{ color: "var(--mantine-color-gray-6)" }}
+            />
             <Text size="xl" fw={600} ta="center">
-              {t('workspace.people.inviteMembers.label', 'Invite Members')}
+              {t("workspace.people.inviteMembers.label", "Invite Members")}
             </Text>
-            {inviteMode === 'email' && (
+            {inviteMode === "email" && (
               <Text size="sm" c="dimmed" ta="center" px="md">
-                {t('workspace.people.inviteMembers.subtitle', 'Type or paste in emails below, separated by commas. Your workspace will be billed by members.')}
+                {t(
+                  "workspace.people.inviteMembers.subtitle",
+                  "Type or paste in emails below, separated by commas. Your workspace will be billed by members.",
+                )}
               </Text>
             )}
           </Stack>
 
           {/* License Warning/Info */}
           {licenseInfo && (
-            <Paper withBorder p="sm" bg={licenseInfo.availableSlots === 0 ? 'var(--mantine-color-red-light)' : 'var(--mantine-color-blue-light)'}>
+            <Paper
+              withBorder
+              p="sm"
+              bg={
+                licenseInfo.availableSlots === 0
+                  ? "var(--mantine-color-red-light)"
+                  : "var(--mantine-color-blue-light)"
+              }
+            >
               <Stack gap="xs">
                 <Group justify="space-between" align="center" wrap="nowrap">
                   <Group gap="xs" wrap="nowrap">
-                    <LocalIcon icon={licenseInfo.availableSlots > 0 ? 'info' : 'warning'} width="1rem" height="1rem" />
+                    <LocalIcon
+                      icon={licenseInfo.availableSlots > 0 ? "info" : "warning"}
+                      width="1rem"
+                      height="1rem"
+                    />
                     <Text size="sm" fw={500}>
                       {licenseInfo.availableSlots > 0
-                        ? t('workspace.people.license.slotsAvailable', {
+                        ? t("workspace.people.license.slotsAvailable", {
                             count: licenseInfo.availableSlots,
-                            defaultValue: `${licenseInfo.availableSlots} user slot(s) available`
+                            defaultValue: `${licenseInfo.availableSlots} user slot(s) available`,
                           })
-                        : t('workspace.people.license.noSlotsAvailable', 'No user slots available')}
+                        : t(
+                            "workspace.people.license.noSlotsAvailable",
+                            "No user slots available",
+                          )}
                     </Text>
                   </Group>
                   {licenseInfo.availableSlots === 0 && (
                     <Button size="xs" variant="light" onClick={handleGoToPlan}>
-                      {t('workspace.people.actions.upgrade', 'Upgrade')}
+                      {t("workspace.people.actions.upgrade", "Upgrade")}
                     </Button>
                   )}
                 </Group>
                 <Text size="xs" c="dimmed">
-                  {t('workspace.people.license.currentUsage', {
+                  {t("workspace.people.license.currentUsage", {
                     current: licenseInfo.totalUsers,
                     max: licenseInfo.maxAllowedUsers,
-                    defaultValue: `Currently using ${licenseInfo.totalUsers} of ${licenseInfo.maxAllowedUsers} user licenses`
+                    defaultValue: `Currently using ${licenseInfo.totalUsers} of ${licenseInfo.maxAllowedUsers} user licenses`,
                   })}
                 </Text>
               </Stack>
@@ -364,7 +444,10 @@ export default function InviteMembersModal({ opened, onClose, onSuccess }: Invit
 
           {/* Mode Toggle */}
           <Tooltip
-            label={t('workspace.people.inviteMode.emailDisabled', 'Email invites require SMTP configuration and mail.enableInvites=true in settings')}
+            label={t(
+              "workspace.people.inviteMode.emailDisabled",
+              "Email invites require SMTP configuration and mail.enableInvites=true in settings",
+            )}
             disabled={!!config?.enableEmailInvites}
             position="bottom"
             withArrow
@@ -374,21 +457,24 @@ export default function InviteMembersModal({ opened, onClose, onSuccess }: Invit
               <SegmentedControl
                 value={inviteMode}
                 onChange={(value) => {
-                  setInviteMode(value as 'email' | 'direct' | 'link');
+                  setInviteMode(value as "email" | "direct" | "link");
                   setGeneratedInviteLink(null);
                 }}
                 data={[
                   {
-                    label: t('workspace.people.inviteMode.username', 'Username'),
-                    value: 'direct',
+                    label: t(
+                      "workspace.people.inviteMode.username",
+                      "Username",
+                    ),
+                    value: "direct",
                   },
                   {
-                    label: t('workspace.people.inviteMode.link', 'Link'),
-                    value: 'link',
+                    label: t("workspace.people.inviteMode.link", "Link"),
+                    value: "link",
                   },
                   {
-                    label: t('workspace.people.inviteMode.email', 'Email'),
-                    value: 'email',
+                    label: t("workspace.people.inviteMode.email", "Email"),
+                    value: "email",
                     disabled: !config?.enableEmailInvites,
                   },
                 ]}
@@ -398,45 +484,94 @@ export default function InviteMembersModal({ opened, onClose, onSuccess }: Invit
           </Tooltip>
 
           {/* Link Mode */}
-          {inviteMode === 'link' && (
+          {inviteMode === "link" && (
             <>
               <TextInput
-                label={t('workspace.people.inviteLink.email', 'Email (optional)')}
-                placeholder={t('workspace.people.inviteLink.emailPlaceholder', 'user@example.com')}
+                label={t(
+                  "workspace.people.inviteLink.email",
+                  "Email (optional)",
+                )}
+                placeholder={t(
+                  "workspace.people.inviteLink.emailPlaceholder",
+                  "user@example.com",
+                )}
                 value={inviteLinkForm.email}
-                onChange={(e) => setInviteLinkForm({ ...inviteLinkForm, email: e.currentTarget.value })}
-                description={t('workspace.people.inviteLink.emailDescription', 'If provided, the link will be tied to this email address')}
+                onChange={(e) =>
+                  setInviteLinkForm({
+                    ...inviteLinkForm,
+                    email: e.currentTarget.value,
+                  })
+                }
+                description={t(
+                  "workspace.people.inviteLink.emailDescription",
+                  "If provided, the link will be tied to this email address",
+                )}
               />
               <Select
-                label={t('workspace.people.addMember.role')}
+                label={t("workspace.people.addMember.role")}
                 data={roleOptions}
                 value={inviteLinkForm.role}
-                onChange={(value) => setInviteLinkForm({ ...inviteLinkForm, role: value || 'ROLE_USER' })}
-                comboboxProps={{ withinPortal: true, zIndex: Z_INDEX_OVER_CONFIG_MODAL }}
+                onChange={(value) =>
+                  setInviteLinkForm({
+                    ...inviteLinkForm,
+                    role: value || "ROLE_USER",
+                  })
+                }
+                comboboxProps={{
+                  withinPortal: true,
+                  zIndex: Z_INDEX_OVER_CONFIG_MODAL,
+                }}
               />
               <Select
-                label={t('workspace.people.addMember.team')}
-                placeholder={t('workspace.people.addMember.teamPlaceholder')}
+                label={t("workspace.people.addMember.team")}
+                placeholder={t("workspace.people.addMember.teamPlaceholder")}
                 data={teamOptions}
                 value={inviteLinkForm.teamId?.toString()}
-                onChange={(value) => setInviteLinkForm({ ...inviteLinkForm, teamId: value ? parseInt(value) : undefined })}
+                onChange={(value) =>
+                  setInviteLinkForm({
+                    ...inviteLinkForm,
+                    teamId: value ? parseInt(value) : undefined,
+                  })
+                }
                 clearable
-                comboboxProps={{ withinPortal: true, zIndex: Z_INDEX_OVER_CONFIG_MODAL }}
+                comboboxProps={{
+                  withinPortal: true,
+                  zIndex: Z_INDEX_OVER_CONFIG_MODAL,
+                }}
               />
               <TextInput
-                label={t('workspace.people.inviteLink.expiryHours', 'Link expires in (hours)')}
+                label={t(
+                  "workspace.people.inviteLink.expiryHours",
+                  "Link expires in (hours)",
+                )}
                 type="number"
                 value={inviteLinkForm.expiryHours}
-                onChange={(e) => setInviteLinkForm({ ...inviteLinkForm, expiryHours: parseInt(e.currentTarget.value) || 72 })}
+                onChange={(e) =>
+                  setInviteLinkForm({
+                    ...inviteLinkForm,
+                    expiryHours: parseInt(e.currentTarget.value) || 72,
+                  })
+                }
                 min={1}
                 max={720}
               />
               {inviteLinkForm.email && (
                 <Checkbox
-                  label={t('workspace.people.inviteLink.sendEmail', 'Send invite link via email')}
-                  description={t('workspace.people.inviteLink.sendEmailDescription', 'Also send the link to the provided email address')}
+                  label={t(
+                    "workspace.people.inviteLink.sendEmail",
+                    "Send invite link via email",
+                  )}
+                  description={t(
+                    "workspace.people.inviteLink.sendEmailDescription",
+                    "Also send the link to the provided email address",
+                  )}
                   checked={inviteLinkForm.sendEmail}
-                  onChange={(e) => setInviteLinkForm({ ...inviteLinkForm, sendEmail: e.currentTarget.checked })}
+                  onChange={(e) =>
+                    setInviteLinkForm({
+                      ...inviteLinkForm,
+                      sendEmail: e.currentTarget.checked,
+                    })
+                  }
                 />
               )}
 
@@ -444,7 +579,12 @@ export default function InviteMembersModal({ opened, onClose, onSuccess }: Invit
               {generatedInviteLink && (
                 <Paper withBorder p="md" bg="var(--mantine-color-green-light)">
                   <Stack gap="sm">
-                    <Text size="sm" fw={500}>{t('workspace.people.inviteLink.generated', 'Invite Link Generated')}</Text>
+                    <Text size="sm" fw={500}>
+                      {t(
+                        "workspace.people.inviteLink.generated",
+                        "Invite Link Generated",
+                      )}
+                    </Text>
                     <Group gap="xs">
                       <TextInput
                         value={generatedInviteLink}
@@ -455,23 +595,41 @@ export default function InviteMembersModal({ opened, onClose, onSuccess }: Invit
                         variant="light"
                         onClick={async () => {
                           try {
-                            await navigator.clipboard.writeText(generatedInviteLink);
-                            alert({ alertType: 'success', title: t('workspace.people.inviteLink.copied', 'Link copied to clipboard!') });
+                            await navigator.clipboard.writeText(
+                              generatedInviteLink,
+                            );
+                            alert({
+                              alertType: "success",
+                              title: t(
+                                "workspace.people.inviteLink.copied",
+                                "Link copied to clipboard!",
+                              ),
+                            });
                           } catch {
                             // Fallback for browsers without clipboard API
-                            const textArea = document.createElement('textarea');
+                            const textArea = document.createElement("textarea");
                             textArea.value = generatedInviteLink;
-                            textArea.style.position = 'fixed';
-                            textArea.style.opacity = '0';
+                            textArea.style.position = "fixed";
+                            textArea.style.opacity = "0";
                             document.body.appendChild(textArea);
                             textArea.select();
-                            document.execCommand('copy');
+                            document.execCommand("copy");
                             document.body.removeChild(textArea);
-                            alert({ alertType: 'success', title: t('workspace.people.inviteLink.copied', 'Link copied to clipboard!') });
+                            alert({
+                              alertType: "success",
+                              title: t(
+                                "workspace.people.inviteLink.copied",
+                                "Link copied to clipboard!",
+                              ),
+                            });
                           }
                         }}
                       >
-                        <LocalIcon icon="content-copy" width="1rem" height="1rem" />
+                        <LocalIcon
+                          icon="content-copy"
+                          width="1rem"
+                          height="1rem"
+                        />
                       </Button>
                     </Group>
                   </Stack>
@@ -481,101 +639,212 @@ export default function InviteMembersModal({ opened, onClose, onSuccess }: Invit
           )}
 
           {/* Email Mode */}
-          {inviteMode === 'email' && config?.enableEmailInvites && (
+          {inviteMode === "email" && config?.enableEmailInvites && (
             <>
               <Textarea
-                label={t('workspace.people.emailInvite.emails', 'Email Addresses')}
-                placeholder={t('workspace.people.emailInvite.emailsPlaceholder', 'user1@example.com, user2@example.com')}
+                label={t(
+                  "workspace.people.emailInvite.emails",
+                  "Email Addresses",
+                )}
+                placeholder={t(
+                  "workspace.people.emailInvite.emailsPlaceholder",
+                  "user1@example.com, user2@example.com",
+                )}
                 value={emailInviteForm.emails}
-                onChange={(e) => setEmailInviteForm({ ...emailInviteForm, emails: e.currentTarget.value })}
+                onChange={(e) =>
+                  setEmailInviteForm({
+                    ...emailInviteForm,
+                    emails: e.currentTarget.value,
+                  })
+                }
                 minRows={3}
                 required
               />
               <Select
-                label={t('workspace.people.addMember.role')}
+                label={t("workspace.people.addMember.role")}
                 data={roleOptions}
                 value={emailInviteForm.role}
-                onChange={(value) => setEmailInviteForm({ ...emailInviteForm, role: value || 'ROLE_USER' })}
-                comboboxProps={{ withinPortal: true, zIndex: Z_INDEX_OVER_CONFIG_MODAL }}
+                onChange={(value) =>
+                  setEmailInviteForm({
+                    ...emailInviteForm,
+                    role: value || "ROLE_USER",
+                  })
+                }
+                comboboxProps={{
+                  withinPortal: true,
+                  zIndex: Z_INDEX_OVER_CONFIG_MODAL,
+                }}
               />
               <Select
-                label={t('workspace.people.addMember.team')}
-                placeholder={t('workspace.people.addMember.teamPlaceholder')}
+                label={t("workspace.people.addMember.team")}
+                placeholder={t("workspace.people.addMember.teamPlaceholder")}
                 data={teamOptions}
                 value={emailInviteForm.teamId?.toString()}
-                onChange={(value) => setEmailInviteForm({ ...emailInviteForm, teamId: value ? parseInt(value) : undefined })}
+                onChange={(value) =>
+                  setEmailInviteForm({
+                    ...emailInviteForm,
+                    teamId: value ? parseInt(value) : undefined,
+                  })
+                }
                 clearable
-                comboboxProps={{ withinPortal: true, zIndex: Z_INDEX_OVER_CONFIG_MODAL }}
+                comboboxProps={{
+                  withinPortal: true,
+                  zIndex: Z_INDEX_OVER_CONFIG_MODAL,
+                }}
               />
             </>
           )}
 
           {/* Direct/Username Mode */}
-          {inviteMode === 'direct' && (
+          {inviteMode === "direct" && (
             <>
               <TextInput
-                label={t('workspace.people.addMember.username')}
-                placeholder={t('workspace.people.addMember.usernamePlaceholder')}
+                label={t("workspace.people.addMember.username")}
+                placeholder={t(
+                  "workspace.people.addMember.usernamePlaceholder",
+                )}
                 value={inviteForm.username}
-                onChange={(e) => setInviteForm({ ...inviteForm, username: e.currentTarget.value })}
+                onChange={(e) =>
+                  setInviteForm({
+                    ...inviteForm,
+                    username: e.currentTarget.value,
+                  })
+                }
                 required
               />
 
               {/* Auth Type Selector - only show if SSO is enabled */}
               {(config?.enableOAuth || config?.enableSaml) && (
                 <Select
-                  label={t('workspace.people.addMember.authType', 'Authentication Type')}
+                  label={t(
+                    "workspace.people.addMember.authType",
+                    "Authentication Type",
+                  )}
                   data={[
-                    { value: 'WEB', label: t('workspace.people.authType.password', 'Password') },
-                    ...(config?.enableOAuth ? [{ value: 'OAUTH2', label: t('workspace.people.authType.oauth', 'OAuth2') }] : []),
-                    ...(config?.enableSaml ? [{ value: 'SAML2', label: t('workspace.people.authType.saml', 'SAML2') }] : []),
+                    {
+                      value: "WEB",
+                      label: t(
+                        "workspace.people.authType.password",
+                        "Password",
+                      ),
+                    },
+                    ...(config?.enableOAuth
+                      ? [
+                          {
+                            value: "OAUTH2",
+                            label: t(
+                              "workspace.people.authType.oauth",
+                              "OAuth2",
+                            ),
+                          },
+                        ]
+                      : []),
+                    ...(config?.enableSaml
+                      ? [
+                          {
+                            value: "SAML2",
+                            label: t("workspace.people.authType.saml", "SAML2"),
+                          },
+                        ]
+                      : []),
                   ]}
                   value={inviteForm.authType}
-                  onChange={(value) => setInviteForm({ ...inviteForm, authType: (value as 'WEB' | 'OAUTH2' | 'SAML2') || 'WEB' })}
-                  comboboxProps={{ withinPortal: true, zIndex: Z_INDEX_OVER_CONFIG_MODAL }}
-                  description={inviteForm.authType !== 'WEB' ? t('workspace.people.authType.ssoDescription', 'User will authenticate via SSO provider') : undefined}
+                  onChange={(value) =>
+                    setInviteForm({
+                      ...inviteForm,
+                      authType: (value as "WEB" | "OAUTH2" | "SAML2") || "WEB",
+                    })
+                  }
+                  comboboxProps={{
+                    withinPortal: true,
+                    zIndex: Z_INDEX_OVER_CONFIG_MODAL,
+                  }}
+                  description={
+                    inviteForm.authType !== "WEB"
+                      ? t(
+                          "workspace.people.authType.ssoDescription",
+                          "User will authenticate via SSO provider",
+                        )
+                      : undefined
+                  }
                 />
               )}
 
               {/* Password field - only required for WEB auth type */}
-              {inviteForm.authType === 'WEB' && (
+              {inviteForm.authType === "WEB" && (
                 <>
                   <TextInput
-                    label={t('workspace.people.addMember.password')}
+                    label={t("workspace.people.addMember.password")}
                     type="password"
-                    placeholder={t('workspace.people.addMember.passwordPlaceholder')}
+                    placeholder={t(
+                      "workspace.people.addMember.passwordPlaceholder",
+                    )}
                     value={inviteForm.password}
-                    onChange={(e) => setInviteForm({ ...inviteForm, password: e.currentTarget.value })}
+                    onChange={(e) =>
+                      setInviteForm({
+                        ...inviteForm,
+                        password: e.currentTarget.value,
+                      })
+                    }
                     required
                   />
                   <Checkbox
-                    label={t('workspace.people.addMember.forcePasswordChange', 'Force password change on first login')}
+                    label={t(
+                      "workspace.people.addMember.forcePasswordChange",
+                      "Force password change on first login",
+                    )}
                     checked={inviteForm.forceChange}
-                    onChange={(e) => setInviteForm({ ...inviteForm, forceChange: e.currentTarget.checked })}
+                    onChange={(e) =>
+                      setInviteForm({
+                        ...inviteForm,
+                        forceChange: e.currentTarget.checked,
+                      })
+                    }
                   />
                   <Checkbox
-                    label={t('workspace.people.addMember.forceMFA', 'Force MFA setup on next login')}
+                    label={t(
+                      "workspace.people.addMember.forceMFA",
+                      "Force MFA setup on next login",
+                    )}
                     checked={inviteForm.forceMFA}
-                    onChange={(e) => setInviteForm({ ...inviteForm, forceMFA: e.currentTarget.checked })}
+                    onChange={(e) =>
+                      setInviteForm({
+                        ...inviteForm,
+                        forceMFA: e.currentTarget.checked,
+                      })
+                    }
                   />
                 </>
               )}
 
               <Select
-                label={t('workspace.people.addMember.role')}
+                label={t("workspace.people.addMember.role")}
                 data={roleOptions}
                 value={inviteForm.role}
-                onChange={(value) => setInviteForm({ ...inviteForm, role: value || 'ROLE_USER' })}
-                comboboxProps={{ withinPortal: true, zIndex: Z_INDEX_OVER_CONFIG_MODAL }}
+                onChange={(value) =>
+                  setInviteForm({ ...inviteForm, role: value || "ROLE_USER" })
+                }
+                comboboxProps={{
+                  withinPortal: true,
+                  zIndex: Z_INDEX_OVER_CONFIG_MODAL,
+                }}
               />
               <Select
-                label={t('workspace.people.addMember.team')}
-                placeholder={t('workspace.people.addMember.teamPlaceholder')}
+                label={t("workspace.people.addMember.team")}
+                placeholder={t("workspace.people.addMember.teamPlaceholder")}
                 data={teamOptions}
                 value={inviteForm.teamId?.toString()}
-                onChange={(value) => setInviteForm({ ...inviteForm, teamId: value ? parseInt(value) : undefined })}
+                onChange={(value) =>
+                  setInviteForm({
+                    ...inviteForm,
+                    teamId: value ? parseInt(value) : undefined,
+                  })
+                }
                 clearable
-                comboboxProps={{ withinPortal: true, zIndex: Z_INDEX_OVER_CONFIG_MODAL }}
+                comboboxProps={{
+                  withinPortal: true,
+                  zIndex: Z_INDEX_OVER_CONFIG_MODAL,
+                }}
               />
             </>
           )}
@@ -588,15 +857,14 @@ export default function InviteMembersModal({ opened, onClose, onSuccess }: Invit
             size="md"
             mt="md"
           >
-            {inviteMode === 'email'
-              ? t('workspace.people.emailInvite.submit', 'Send Invites')
-              : inviteMode === 'link'
-                ? t('workspace.people.inviteLink.submit', 'Generate Link')
-                : t('workspace.people.addMember.submit')}
+            {inviteMode === "email"
+              ? t("workspace.people.emailInvite.submit", "Send Invites")
+              : inviteMode === "link"
+                ? t("workspace.people.inviteLink.submit", "Generate Link")
+                : t("workspace.people.addMember.submit")}
           </Button>
         </Stack>
       </Box>
     </Modal>
   );
 }
-
diff --git a/frontend/src/proprietary/components/shared/LoginRightCarousel.tsx b/frontend/src/proprietary/components/shared/LoginRightCarousel.tsx
index f7157a43e5..1759e09af1 100644
--- a/frontend/src/proprietary/components/shared/LoginRightCarousel.tsx
+++ b/frontend/src/proprietary/components/shared/LoginRightCarousel.tsx
@@ -1,7 +1,15 @@
-import { memo, useEffect, useMemo, useRef, useState } from 'react';
-import { BASE_PATH } from '@app/constants/app';
+import { memo, useEffect, useMemo, useRef, useState } from "react";
+import { BASE_PATH } from "@app/constants/app";
 
-type ImageSlide = { src: string; alt?: string; cornerModelUrl?: string; title?: string; subtitle?: string; followMouseTilt?: boolean; tiltMaxDeg?: number }
+type ImageSlide = {
+  src: string;
+  alt?: string;
+  cornerModelUrl?: string;
+  title?: string;
+  subtitle?: string;
+  followMouseTilt?: boolean;
+  tiltMaxDeg?: number;
+};
 
 function LoginRightCarousel({
   imageSlides = [],
@@ -9,10 +17,10 @@ function LoginRightCarousel({
   initialSeconds = 5,
   slideSeconds = 8,
 }: {
-  imageSlides?: ImageSlide[]
-  showBackground?: boolean
-  initialSeconds?: number
-  slideSeconds?: number
+  imageSlides?: ImageSlide[];
+  showBackground?: boolean;
+  initialSeconds?: number;
+  slideSeconds?: number;
 }) {
   const totalSlides = imageSlides.length;
   const [index, setIndex] = useState(0);
@@ -20,14 +28,20 @@ function LoginRightCarousel({
 
   const durationsMs = useMemo(() => {
     if (imageSlides.length === 0) return [];
-    return imageSlides.map((_, i) => (i === 0 ? (initialSeconds ?? slideSeconds) : slideSeconds) * 1000);
+    return imageSlides.map(
+      (_, i) =>
+        (i === 0 ? (initialSeconds ?? slideSeconds) : slideSeconds) * 1000,
+    );
   }, [imageSlides, initialSeconds, slideSeconds]);
 
   useEffect(() => {
     if (totalSlides <= 1) return;
-    const timeout = setTimeout(() => {
-      setIndex((i) => (i + 1) % totalSlides);
-    }, durationsMs[index] ?? slideSeconds * 1000);
+    const timeout = setTimeout(
+      () => {
+        setIndex((i) => (i + 1) % totalSlides);
+      },
+      durationsMs[index] ?? slideSeconds * 1000,
+    );
     return () => clearTimeout(timeout);
   }, [index, totalSlides, durationsMs, slideSeconds]);
 
@@ -36,11 +50,21 @@ function LoginRightCarousel({
       mouse.current.x = (e.clientX / window.innerWidth) * 2 - 1;
       mouse.current.y = (e.clientY / window.innerHeight) * 2 - 1;
     };
-    window.addEventListener('mousemove', onMove);
-    return () => window.removeEventListener('mousemove', onMove);
+    window.addEventListener("mousemove", onMove);
+    return () => window.removeEventListener("mousemove", onMove);
   }, []);
 
-  function TiltImage({ src, alt, enabled, maxDeg = 6 }: { src: string; alt?: string; enabled: boolean; maxDeg?: number }) {
+  function TiltImage({
+    src,
+    alt,
+    enabled,
+    maxDeg = 6,
+  }: {
+    src: string;
+    alt?: string;
+    enabled: boolean;
+    maxDeg?: number;
+  }) {
     const imgRef = useRef<HTMLImageElement | null>(null);
 
     useEffect(() => {
@@ -54,7 +78,7 @@ function LoginRightCarousel({
           const rotX = -(mouse.current.y || 0) * maxDeg;
           el.style.transform = `translateY(-2rem) rotateX(${rotX.toFixed(2)}deg) rotateY(${rotY.toFixed(2)}deg)`;
         } else {
-          el.style.transform = 'translateY(-2rem)';
+          el.style.transform = "translateY(-2rem)";
         }
         raf = requestAnimationFrame(tick);
       };
@@ -66,29 +90,42 @@ function LoginRightCarousel({
       <img
         ref={imgRef}
         src={src}
-        alt={alt ?? 'Carousel slide'}
+        alt={alt ?? "Carousel slide"}
         style={{
-          maxWidth: '86%',
-          maxHeight: '78%',
-          objectFit: 'contain',
-          borderRadius: '18px',
-          background: 'transparent',
-          transform: 'translateY(-2rem)',
-          transition: 'transform 80ms ease-out',
-          willChange: 'transform',
-          transformOrigin: '50% 50%',
+          maxWidth: "86%",
+          maxHeight: "78%",
+          objectFit: "contain",
+          borderRadius: "18px",
+          background: "transparent",
+          transform: "translateY(-2rem)",
+          transition: "transform 80ms ease-out",
+          willChange: "transform",
+          transformOrigin: "50% 50%",
         }}
       />
     );
   }
 
   return (
-    <div style={{ position: 'relative', overflow: 'hidden', width: '100%', height: '100%' }}>
+    <div
+      style={{
+        position: "relative",
+        overflow: "hidden",
+        width: "100%",
+        height: "100%",
+      }}
+    >
       {showBackground && (
         <img
           src={`${BASE_PATH}/Login/LoginBackgroundPanel.png`}
           alt="Background panel"
-          style={{ position: 'absolute', inset: 0, width: '100%', height: '100%', objectFit: 'cover' }}
+          style={{
+            position: "absolute",
+            inset: 0,
+            width: "100%",
+            height: "100%",
+            objectFit: "cover",
+          }}
         />
       )}
 
@@ -97,40 +134,72 @@ function LoginRightCarousel({
         <div
           key={s.src}
           style={{
-            position: 'absolute',
+            position: "absolute",
             inset: 0,
-            display: 'flex',
-            alignItems: 'center',
-            justifyContent: 'center',
-            transition: 'opacity 600ms ease',
+            display: "flex",
+            alignItems: "center",
+            justifyContent: "center",
+            transition: "opacity 600ms ease",
             opacity: index === idx ? 1 : 0,
-            perspective: '900px',
+            perspective: "900px",
           }}
         >
           {(s.title || s.subtitle) && (
-            <div style={{ position: 'absolute', bottom: 24 + 32, left: 0, right: 0, textAlign: 'center', padding: '0 2rem', width: '100%' }}>
+            <div
+              style={{
+                position: "absolute",
+                bottom: 24 + 32,
+                left: 0,
+                right: 0,
+                textAlign: "center",
+                padding: "0 2rem",
+                width: "100%",
+              }}
+            >
               {s.title && (
-                <div style={{ fontSize: 20, fontWeight: 800, color: '#ffffff', textShadow: '0 2px 6px rgba(0,0,0,0.25)', marginBottom: 6 }}>{s.title}</div>
+                <div
+                  style={{
+                    fontSize: 20,
+                    fontWeight: 800,
+                    color: "#ffffff",
+                    textShadow: "0 2px 6px rgba(0,0,0,0.25)",
+                    marginBottom: 6,
+                  }}
+                >
+                  {s.title}
+                </div>
               )}
               {s.subtitle && (
-                <div style={{ fontSize: 13, color: 'rgba(255,255,255,0.92)', textShadow: '0 1px 4px rgba(0,0,0,0.25)' }}>{s.subtitle}</div>
+                <div
+                  style={{
+                    fontSize: 13,
+                    color: "rgba(255,255,255,0.92)",
+                    textShadow: "0 1px 4px rgba(0,0,0,0.25)",
+                  }}
+                >
+                  {s.subtitle}
+                </div>
               )}
             </div>
           )}
-          <TiltImage src={s.src} alt={s.alt} enabled={index === idx && !!s.followMouseTilt} maxDeg={s.tiltMaxDeg ?? 6} />
-
+          <TiltImage
+            src={s.src}
+            alt={s.alt}
+            enabled={index === idx && !!s.followMouseTilt}
+            maxDeg={s.tiltMaxDeg ?? 6}
+          />
         </div>
       ))}
 
       {/* Dot navigation */}
       <div
         style={{
-          position: 'absolute',
+          position: "absolute",
           bottom: 16,
           left: 0,
           right: 0,
-          display: 'flex',
-          justifyContent: 'center',
+          display: "flex",
+          justifyContent: "center",
           gap: 10,
           zIndex: 2,
         }}
@@ -141,14 +210,15 @@ function LoginRightCarousel({
             aria-label={`Go to slide ${i + 1}`}
             onClick={() => setIndex(i)}
             style={{
-              width: '10px',
-              height: '12px',
-              borderRadius: '50%',
-              border: 'none',
-              cursor: 'pointer',
-              backgroundColor: i === index ? '#ffffff' : 'rgba(255,255,255,0.5)',
-              boxShadow: '0 2px 6px rgba(0,0,0,0.25)',
-              display: 'block',
+              width: "10px",
+              height: "12px",
+              borderRadius: "50%",
+              border: "none",
+              cursor: "pointer",
+              backgroundColor:
+                i === index ? "#ffffff" : "rgba(255,255,255,0.5)",
+              boxShadow: "0 2px 6px rgba(0,0,0,0.25)",
+              display: "block",
               flexShrink: 0,
             }}
           />
diff --git a/frontend/src/proprietary/components/shared/ManageBillingButton.tsx b/frontend/src/proprietary/components/shared/ManageBillingButton.tsx
index fc523f62f2..179479bcd3 100644
--- a/frontend/src/proprietary/components/shared/ManageBillingButton.tsx
+++ b/frontend/src/proprietary/components/shared/ManageBillingButton.tsx
@@ -1,8 +1,8 @@
-import React, { useState } from 'react';
-import { Button } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import licenseService from '@app/services/licenseService';
-import { alert } from '@app/components/toast';
+import React, { useState } from "react";
+import { Button } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import licenseService from "@app/services/licenseService";
+import { alert } from "@app/components/toast";
 
 interface ManageBillingButtonProps {
   returnUrl?: string;
@@ -22,24 +22,28 @@ export const ManageBillingButton: React.FC<ManageBillingButtonProps> = ({
       const licenseInfo = await licenseService.getLicenseInfo();
 
       if (!licenseInfo.licenseKey) {
-        throw new Error('No license key found. Please activate a license first.');
+        throw new Error(
+          "No license key found. Please activate a license first.",
+        );
       }
 
       // Create billing portal session with license key
       const response = await licenseService.createBillingPortalSession(
         returnUrl,
-        licenseInfo.licenseKey
+        licenseInfo.licenseKey,
       );
 
       // Open billing portal in new tab
-      window.open(response.url, '_blank');
+      window.open(response.url, "_blank");
       setLoading(false);
-    } catch (error: any) {
-      console.error('Failed to open billing portal:', error);
+    } catch (error: unknown) {
+      console.error("Failed to open billing portal:", error);
       alert({
-        alertType: 'error',
-        title: t('billing.portal.error', 'Failed to open billing portal'),
-        body: error.message || 'Please try again or contact support.',
+        alertType: "error",
+        title: t("billing.portal.error", "Failed to open billing portal"),
+        body:
+          (error instanceof Error ? error.message : undefined) ||
+          "Please try again or contact support.",
       });
       setLoading(false);
     }
@@ -47,7 +51,7 @@ export const ManageBillingButton: React.FC<ManageBillingButtonProps> = ({
 
   return (
     <Button variant="outline" onClick={handleClick} loading={loading}>
-      {t('billing.manageBilling', 'Manage Billing')}
+      {t("billing.manageBilling", "Manage Billing")}
     </Button>
   );
 };
diff --git a/frontend/src/proprietary/components/shared/UpdateSeatsButton.tsx b/frontend/src/proprietary/components/shared/UpdateSeatsButton.tsx
index ddc43350b7..f950495a5d 100644
--- a/frontend/src/proprietary/components/shared/UpdateSeatsButton.tsx
+++ b/frontend/src/proprietary/components/shared/UpdateSeatsButton.tsx
@@ -1,9 +1,12 @@
-import React from 'react';
-import { Button, ButtonProps } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { useUpdateSeats } from '@app/contexts/UpdateSeatsContext';
+import React from "react";
+import { Button, ButtonProps } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import { useUpdateSeats } from "@app/contexts/UpdateSeatsContext";
 
-interface UpdateSeatsButtonProps extends Omit<ButtonProps, 'onClick' | 'loading'> {
+interface UpdateSeatsButtonProps extends Omit<
+  ButtonProps,
+  "onClick" | "loading"
+> {
   onSuccess?: () => void;
   onError?: (error: string) => void;
 }
@@ -30,7 +33,7 @@ export const UpdateSeatsButton: React.FC<UpdateSeatsButtonProps> = ({
       loading={isLoading}
       {...buttonProps}
     >
-      {t('billing.updateSeats', 'Update Seats')}
+      {t("billing.updateSeats", "Update Seats")}
     </Button>
   );
 };
diff --git a/frontend/src/proprietary/components/shared/UpdateSeatsModal.tsx b/frontend/src/proprietary/components/shared/UpdateSeatsModal.tsx
index 87827725fe..a375fa42cc 100644
--- a/frontend/src/proprietary/components/shared/UpdateSeatsModal.tsx
+++ b/frontend/src/proprietary/components/shared/UpdateSeatsModal.tsx
@@ -1,7 +1,16 @@
-import React, { useState, useEffect } from 'react';
-import { Modal, Button, Text, Alert, Loader, Stack, Group, NumberInput } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { Z_INDEX_OVER_CONFIG_MODAL } from '@app/styles/zIndex';
+import React, { useState, useEffect } from "react";
+import {
+  Modal,
+  Button,
+  Text,
+  Alert,
+  Loader,
+  Stack,
+  Group,
+  NumberInput,
+} from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import { Z_INDEX_OVER_CONFIG_MODAL } from "@app/styles/zIndex";
 
 interface UpdateSeatsModalProps {
   opened: boolean;
@@ -14,7 +23,7 @@ interface UpdateSeatsModalProps {
 }
 
 type UpdateState = {
-  status: 'idle' | 'loading' | 'error';
+  status: "idle" | "loading" | "error";
   error?: string;
 };
 
@@ -28,33 +37,35 @@ const UpdateSeatsModal: React.FC<UpdateSeatsModalProps> = ({
   onUpdateSeats,
 }) => {
   const { t } = useTranslation();
-  const [state, setState] = useState<UpdateState>({ status: 'idle' });
+  const [state, setState] = useState<UpdateState>({ status: "idle" });
   const [newSeatCount, setNewSeatCount] = useState<number>(minimumSeats);
 
   // Reset seat count when modal opens
   useEffect(() => {
     if (opened) {
       setNewSeatCount(minimumSeats);
-      setState({ status: 'idle' });
+      setState({ status: "idle" });
     }
   }, [opened, minimumSeats]);
 
   const handleUpdateSeats = async () => {
     if (!onUpdateSeats) {
       setState({
-        status: 'error',
-        error: 'Update function not provided',
+        status: "error",
+        error: "Update function not provided",
       });
       return;
     }
 
     if (newSeatCount < minimumSeats) {
       setState({
-        status: 'error',
+        status: "error",
         error: t(
-          'billing.seatCountTooLow',
-          'Seat count must be at least {{minimum}} (current number of users)',
-          { minimum: minimumSeats }
+          "billing.seatCountTooLow",
+          "Seat count must be at least {{minimum}} (current number of users)",
+          {
+            minimum: minimumSeats,
+          },
         ),
       });
       return;
@@ -62,29 +73,32 @@ const UpdateSeatsModal: React.FC<UpdateSeatsModalProps> = ({
 
     if (newSeatCount === currentSeats) {
       setState({
-        status: 'error',
-        error: t('billing.seatCountUnchanged', 'Please select a different seat count'),
+        status: "error",
+        error: t(
+          "billing.seatCountUnchanged",
+          "Please select a different seat count",
+        ),
       });
       return;
     }
 
     try {
-      setState({ status: 'loading' });
+      setState({ status: "loading" });
 
       // Call the update function (will call manage-billing)
       const portalUrl = await onUpdateSeats(newSeatCount);
 
       // Redirect to Stripe billing portal
-      console.log('Redirecting to Stripe billing portal:', portalUrl);
+      console.log("Redirecting to Stripe billing portal:", portalUrl);
       window.location.href = portalUrl;
 
       // Note: No need to call onSuccess here since we're redirecting
       // The return flow will handle success notification
     } catch (err) {
       const errorMessage =
-        err instanceof Error ? err.message : 'Failed to update seat count';
+        err instanceof Error ? err.message : "Failed to update seat count";
       setState({
-        status: 'error',
+        status: "error",
         error: errorMessage,
       });
       onError?.(errorMessage);
@@ -92,18 +106,18 @@ const UpdateSeatsModal: React.FC<UpdateSeatsModalProps> = ({
   };
 
   const handleClose = () => {
-    setState({ status: 'idle' });
+    setState({ status: "idle" });
     setNewSeatCount(currentSeats);
     onClose();
   };
 
   const renderContent = () => {
-    if (state.status === 'loading') {
+    if (state.status === "loading") {
       return (
-        <Stack align="center" justify="center" style={{ padding: '2rem 0' }}>
+        <Stack align="center" justify="center" style={{ padding: "2rem 0" }}>
           <Loader size="lg" />
           <Text size="sm" c="dimmed" mt="md">
-            {t('billing.preparingUpdate', 'Preparing seat update...')}
+            {t("billing.preparingUpdate", "Preparing seat update...")}
           </Text>
         </Stack>
       );
@@ -111,8 +125,8 @@ const UpdateSeatsModal: React.FC<UpdateSeatsModalProps> = ({
 
     return (
       <Stack gap="lg">
-        {state.status === 'error' && (
-          <Alert color="red" title={t('common.error', 'Error')}>
+        {state.status === "error" && (
+          <Alert color="red" title={t("common.error", "Error")}>
             {state.error}
           </Alert>
         )}
@@ -120,7 +134,7 @@ const UpdateSeatsModal: React.FC<UpdateSeatsModalProps> = ({
         <Stack gap="md" mt="md">
           <Group justify="space-between">
             <Text size="sm" fw={500}>
-              {t('billing.currentSeats', 'Current Seats')}:
+              {t("billing.currentSeats", "Current Seats")}:
             </Text>
             <Text size="sm" fw={600}>
               {currentSeats}
@@ -128,53 +142,60 @@ const UpdateSeatsModal: React.FC<UpdateSeatsModalProps> = ({
           </Group>
           <Group justify="space-between">
             <Text size="sm" fw={500}>
-              {t('billing.minimumSeats', 'Minimum Seats')}:
+              {t("billing.minimumSeats", "Minimum Seats")}:
             </Text>
             <Text size="sm" c="dimmed">
-              {minimumSeats} {t('billing.basedOnUsers', '(current users)')}
+              {minimumSeats} {t("billing.basedOnUsers", "(current users)")}
             </Text>
           </Group>
         </Stack>
 
         <NumberInput
-          label={t('billing.newSeatCount', 'New Seat Count')}
+          label={t("billing.newSeatCount", "New Seat Count")}
           description={t(
-            'billing.newSeatCountDescription',
-            'Select the number of seats for your enterprise license'
+            "billing.newSeatCountDescription",
+            "Select the number of seats for your enterprise license",
           )}
           value={newSeatCount}
-          onChange={(value) => setNewSeatCount(typeof value === 'number' ? value : minimumSeats)}
+          onChange={(value) =>
+            setNewSeatCount(typeof value === "number" ? value : minimumSeats)
+          }
           min={minimumSeats}
           max={10000}
           step={1}
           size="md"
           styles={{
             input: {
-              fontSize: '1.5rem',
+              fontSize: "1.5rem",
               fontWeight: 500,
-              textAlign: 'center',
+              textAlign: "center",
             },
           }}
         />
 
-        <Alert color="blue" title={t('billing.whatHappensNext', 'What happens next?')}>
+        <Alert
+          color="blue"
+          title={t("billing.whatHappensNext", "What happens next?")}
+        >
           <Text size="sm">
             {t(
-              'billing.stripePortalRedirect',
-              'You will be redirected to Stripe\'s billing portal to review and confirm the seat change. The prorated amount will be calculated automatically.'
+              "billing.stripePortalRedirect",
+              "You will be redirected to Stripe's billing portal to review and confirm the seat change. The prorated amount will be calculated automatically.",
             )}
           </Text>
         </Alert>
 
         <Group justify="flex-end" gap="sm">
           <Button variant="outline" onClick={handleClose}>
-            {t('common.cancel', 'Cancel')}
+            {t("common.cancel", "Cancel")}
           </Button>
           <Button
             onClick={handleUpdateSeats}
-            disabled={newSeatCount === currentSeats || newSeatCount < minimumSeats}
+            disabled={
+              newSeatCount === currentSeats || newSeatCount < minimumSeats
+            }
           >
-            {t('billing.updateSeats', 'Update Seats')}
+            {t("billing.updateSeats", "Update Seats")}
           </Button>
         </Group>
       </Stack>
@@ -187,7 +208,7 @@ const UpdateSeatsModal: React.FC<UpdateSeatsModalProps> = ({
       onClose={handleClose}
       title={
         <Text fw={600} size="lg">
-          {t('billing.updateEnterpriseSeats', 'Update Enterprise Seats')}
+          {t("billing.updateEnterpriseSeats", "Update Enterprise Seats")}
         </Text>
       }
       size="md"
diff --git a/frontend/src/proprietary/components/shared/UpgradeBanner.tsx b/frontend/src/proprietary/components/shared/UpgradeBanner.tsx
index 5b31eedcaa..d0ee1612e2 100644
--- a/frontend/src/proprietary/components/shared/UpgradeBanner.tsx
+++ b/frontend/src/proprietary/components/shared/UpgradeBanner.tsx
@@ -1,9 +1,9 @@
-import React, { useState, useEffect, useCallback } from 'react';
-import { useTranslation } from 'react-i18next';
-import { useNavigate, useLocation } from 'react-router-dom';
-import { isAuthRoute } from '@core/constants/routes';
-import { useCheckout } from '@app/contexts/CheckoutContext';
-import { InfoBanner } from '@app/components/shared/InfoBanner';
+import React, { useState, useEffect, useCallback } from "react";
+import { useTranslation } from "react-i18next";
+import { useNavigate, useLocation } from "react-router-dom";
+import { isAuthRoute } from "@core/constants/routes";
+import { useCheckout } from "@app/contexts/CheckoutContext";
+import { InfoBanner } from "@app/components/shared/InfoBanner";
 import {
   SERVER_LICENSE_REQUEST_EVENT,
   type ServerLicenseRequestPayload,
@@ -11,11 +11,11 @@ import {
   type UpgradeBannerTestPayload,
   type UpgradeBannerTestScenario,
   UPGRADE_BANNER_ALERT_EVENT,
-} from '@core/constants/events';
-import { useServerExperience } from '@app/hooks/useServerExperience';
-import { isOnboardingCompleted } from '@core/components/onboarding/orchestrator/onboardingStorage';
+} from "@core/constants/events";
+import { useServerExperience } from "@app/hooks/useServerExperience";
+import { isOnboardingCompleted } from "@core/components/onboarding/orchestrator/onboardingStorage";
 
-const FRIENDLY_LAST_SEEN_KEY = 'upgradeBannerFriendlyLastShownAt';
+const FRIENDLY_LAST_SEEN_KEY = "upgradeBannerFriendlyLastShownAt";
 const WEEK_IN_MS = 7 * 24 * 60 * 60 * 1000;
 const UpgradeBanner: React.FC = () => {
   const { t } = useTranslation();
@@ -40,7 +40,7 @@ const UpgradeBanner: React.FC = () => {
   } = useServerExperience();
   const onboardingComplete = isOnboardingCompleted();
   const [friendlyVisible, setFriendlyVisible] = useState(() => {
-    if (typeof window === 'undefined') return false;
+    if (typeof window === "undefined") return false;
     const lastShownRaw = window.localStorage.getItem(FRIENDLY_LAST_SEEN_KEY);
     if (!lastShownRaw) return false;
     const lastShown = parseInt(lastShownRaw, 10);
@@ -48,10 +48,11 @@ const UpgradeBanner: React.FC = () => {
     return Date.now() - lastShown >= WEEK_IN_MS;
   });
   const isDev = import.meta.env.DEV;
-  const [testScenario, setTestScenario] = useState<UpgradeBannerTestScenario>(null);
+  const [testScenario, setTestScenario] =
+    useState<UpgradeBannerTestScenario>(null);
 
   useEffect(() => {
-    if (!isDev || typeof window === 'undefined') {
+    if (!isDev || typeof window === "undefined") {
       return;
     }
 
@@ -59,46 +60,54 @@ const UpgradeBanner: React.FC = () => {
       const { detail } = event as CustomEvent<UpgradeBannerTestPayload>;
       setTestScenario(detail?.scenario ?? null);
 
-      if (detail?.scenario === 'friendly') {
+      if (detail?.scenario === "friendly") {
         setFriendlyVisible(true);
       } else if (!detail?.scenario) {
         setFriendlyVisible(false);
       }
     };
 
-    window.addEventListener(UPGRADE_BANNER_TEST_EVENT, handleTestEvent as EventListener);
+    window.addEventListener(
+      UPGRADE_BANNER_TEST_EVENT,
+      handleTestEvent as EventListener,
+    );
     return () => {
-      window.removeEventListener(UPGRADE_BANNER_TEST_EVENT, handleTestEvent as EventListener);
+      window.removeEventListener(
+        UPGRADE_BANNER_TEST_EVENT,
+        handleTestEvent as EventListener,
+      );
     };
   }, [isDev]);
 
   const isAdmin = configIsAdmin;
 
   const scenario = isDev ? testScenario : null;
-  const scenarioIsFriendly = scenario === 'friendly';
-  const scenarioIsUrgentUser = scenario === 'urgent-user';
+  const scenarioIsFriendly = scenario === "friendly";
+  const scenarioIsUrgentUser = scenario === "urgent-user";
 
-  const userCountKnown = typeof totalUsers === 'number';
+  const userCountKnown = typeof totalUsers === "number";
   const isUnderLimit = userCountKnown ? totalUsers < freeTierLimit : null;
-  const isOverLimit = userCountKnown ? totalUsers > freeTierLimit : overFreeTierLimit;
+  const isOverLimit = userCountKnown
+    ? totalUsers > freeTierLimit
+    : overFreeTierLimit;
   const baseTotalUsersLoaded = userCountResolved && !userCountLoading;
 
   const scenarioProvidesInfo =
-    scenarioKey && scenarioKey !== 'unknown' && scenarioKey !== 'licensed';
+    scenarioKey && scenarioKey !== "unknown" && scenarioKey !== "licensed";
   const derivedIsAdmin = scenarioProvidesInfo
-    ? scenarioKey!.includes('admin')
+    ? scenarioKey.includes("admin")
     : isAdmin;
   const derivedHasPaidLicense =
-    scenarioKey === 'licensed'
+    scenarioKey === "licensed"
       ? true
-      : scenarioKey === 'unknown'
+      : scenarioKey === "unknown"
         ? hasPaidLicense
         : false;
   const derivedIsUnderLimit = scenarioProvidesInfo
-    ? scenarioKey!.includes('under-limit')
+    ? scenarioKey.includes("under-limit")
     : isUnderLimit === true;
   const derivedIsOverLimit = scenarioProvidesInfo
-    ? scenarioKey!.includes('over-limit')
+    ? scenarioKey.includes("over-limit")
     : isOverLimit === true;
 
   const effectiveIsAdmin = scenario
@@ -108,8 +117,10 @@ const UpgradeBanner: React.FC = () => {
     : derivedIsAdmin;
   const effectiveTotalUsers =
     scenario != null ? (scenarioIsFriendly ? 3 : 8) : totalUsers;
-  const effectiveTotalUsersLoaded = scenario != null ? true : baseTotalUsersLoaded;
-  const effectiveHasPaidLicense = scenario != null ? false : derivedHasPaidLicense;
+  const effectiveTotalUsersLoaded =
+    scenario != null ? true : baseTotalUsersLoaded;
+  const effectiveHasPaidLicense =
+    scenario != null ? false : derivedHasPaidLicense;
   const effectiveIsUnderLimit =
     scenario != null ? scenarioIsFriendly : derivedIsUnderLimit;
   const effectiveIsOverLimit =
@@ -117,40 +128,38 @@ const UpgradeBanner: React.FC = () => {
 
   const isDerivedAdmin = scenario
     ? !scenarioIsUrgentUser
-    : scenarioKey === 'login-user-over-limit-no-license'
+    : scenarioKey === "login-user-over-limit-no-license"
       ? false
       : effectiveIsAdmin;
 
   const shouldShowFriendlyBase = Boolean(
     isDerivedAdmin &&
-      !effectiveHasPaidLicense &&
-      effectiveIsUnderLimit &&
-      effectiveTotalUsersLoaded,
+    !effectiveHasPaidLicense &&
+    effectiveIsUnderLimit &&
+    effectiveTotalUsersLoaded,
   );
   const shouldShowUrgentBase = Boolean(
     !effectiveHasPaidLicense &&
-      effectiveTotalUsersLoaded &&
-      (effectiveIsOverLimit || scenarioKey === 'login-user-over-limit-no-license'),
+    effectiveTotalUsersLoaded &&
+    (effectiveIsOverLimit ||
+      scenarioKey === "login-user-over-limit-no-license"),
   );
 
   const shouldEvaluateFriendly = scenario
     ? scenarioIsFriendly
     : Boolean(
         shouldShowFriendlyBase &&
-          !licenseLoading &&
-          effectiveTotalUsersLoaded &&
-          onboardingComplete,
+        !licenseLoading &&
+        effectiveTotalUsersLoaded &&
+        onboardingComplete,
       );
   // Urgent banner should always show when over-limit
   const shouldEvaluateUrgent = scenario
     ? Boolean(scenario && !scenarioIsFriendly)
-    : Boolean(
-        shouldShowUrgentBase &&
-          !licenseLoading,
-      );
+    : Boolean(shouldShowUrgentBase && !licenseLoading);
 
   useEffect(() => {
-    if (scenario === 'friendly') {
+    if (scenario === "friendly") {
       return;
     }
 
@@ -159,7 +168,7 @@ const UpgradeBanner: React.FC = () => {
       return;
     }
 
-    if (friendlyVisible || typeof window === 'undefined' || userCountLoading) {
+    if (friendlyVisible || typeof window === "undefined" || userCountLoading) {
       return;
     }
 
@@ -171,14 +180,14 @@ const UpgradeBanner: React.FC = () => {
   }, [scenario, shouldEvaluateFriendly, friendlyVisible, userCountLoading]);
 
   useEffect(() => {
-    if (typeof window === 'undefined') {
+    if (typeof window === "undefined") {
       return;
     }
 
     const detail = shouldEvaluateUrgent
       ? {
           active: true,
-          audience: effectiveIsAdmin ? 'admin' : 'user',
+          audience: effectiveIsAdmin ? "admin" : "user",
           totalUsers: effectiveTotalUsers ?? null,
           freeTierLimit,
         }
@@ -187,20 +196,28 @@ const UpgradeBanner: React.FC = () => {
     window.dispatchEvent(
       new CustomEvent(UPGRADE_BANNER_ALERT_EVENT, { detail }),
     );
-  }, [shouldEvaluateUrgent, effectiveIsAdmin, effectiveTotalUsers, scenario, freeTierLimit]);
+  }, [
+    shouldEvaluateUrgent,
+    effectiveIsAdmin,
+    effectiveTotalUsers,
+    scenario,
+    freeTierLimit,
+  ]);
 
   useEffect(() => {
     return () => {
-      if (typeof window !== 'undefined') {
+      if (typeof window !== "undefined") {
         window.dispatchEvent(
-          new CustomEvent(UPGRADE_BANNER_ALERT_EVENT, { detail: { active: false } }),
+          new CustomEvent(UPGRADE_BANNER_ALERT_EVENT, {
+            detail: { active: false },
+          }),
         );
       }
     };
   }, []);
 
   const recordFriendlyLastShown = useCallback(() => {
-    if (typeof window === 'undefined') {
+    if (typeof window === "undefined") {
       return;
     }
     window.localStorage.setItem(FRIENDLY_LAST_SEEN_KEY, Date.now().toString());
@@ -211,12 +228,12 @@ const UpgradeBanner: React.FC = () => {
 
     const hideBanner = () => setFriendlyVisible(false);
     const navigateFallback = () => {
-      navigate('/settings/adminPlan');
+      navigate("/settings/adminPlan");
       hideBanner();
     };
 
     try {
-      openCheckout('server', {
+      openCheckout("server", {
         minimumSeats: 1,
         onSuccess: () => {
           hideBanner();
@@ -226,7 +243,10 @@ const UpgradeBanner: React.FC = () => {
         },
       });
     } catch (error) {
-      console.error('[UpgradeBanner] Failed to open checkout, redirecting instead', error);
+      console.error(
+        "[UpgradeBanner] Failed to open checkout, redirecting instead",
+        error,
+      );
       navigateFallback();
       return;
     }
@@ -241,7 +261,7 @@ const UpgradeBanner: React.FC = () => {
   };
 
   const handleSeeInfo = () => {
-    if (typeof window === 'undefined' || !effectiveIsAdmin) {
+    if (typeof window === "undefined" || !effectiveIsAdmin) {
       return;
     }
 
@@ -265,23 +285,28 @@ const UpgradeBanner: React.FC = () => {
       return null;
     }
 
-    const buttonText = effectiveIsAdmin ? t('upgradeBanner.seeInfo', 'See info') : undefined;
+    const buttonText = effectiveIsAdmin
+      ? t("upgradeBanner.seeInfo", "See info")
+      : undefined;
 
     const attentionMessage = effectiveIsAdmin
       ? t(
-          'upgradeBanner.attentionBodyAdmin',
-          'Review the license requirements to keep this server compliant.',
+          "upgradeBanner.attentionBodyAdmin",
+          "Review the license requirements to keep this server compliant.",
         )
       : t(
-          'upgradeBanner.attentionBody',
-          'Your admin needs to sign in to see more info. Please contact them immediately.',
+          "upgradeBanner.attentionBody",
+          "Your admin needs to sign in to see more info. Please contact them immediately.",
         );
 
     return (
       <InfoBanner
         icon="warning-rounded"
         tone="warning"
-        title={t('upgradeBanner.attentionTitle', 'This server needs admin attention')}
+        title={t(
+          "upgradeBanner.attentionTitle",
+          "This server needs admin attention",
+        )}
         message={attentionMessage}
         buttonText={buttonText}
         buttonIcon="info-rounded"
@@ -318,12 +343,12 @@ const UpgradeBanner: React.FC = () => {
       {friendlyVisible && (
         <InfoBanner
           icon="stars-rounded"
-          title={t('upgradeBanner.title', 'Upgrade to Server Plan')}
+          title={t("upgradeBanner.title", "Upgrade to Server Plan")}
           message={t(
-            'upgradeBanner.message',
-            'Get the most out of Stirling PDF with unlimited users and advanced features.',
+            "upgradeBanner.message",
+            "Get the most out of Stirling PDF with unlimited users and advanced features.",
           )}
-          buttonText={t('upgradeBanner.upgradeButton', 'Upgrade Now')}
+          buttonText={t("upgradeBanner.upgradeButton", "Upgrade Now")}
           buttonIcon="upgrade-rounded"
           onButtonClick={handleUpgrade}
           onDismiss={handleFriendlyDismiss}
diff --git a/frontend/src/proprietary/components/shared/UpgradeBannerInitializer.tsx b/frontend/src/proprietary/components/shared/UpgradeBannerInitializer.tsx
index 72e57060bb..84b6ef1958 100644
--- a/frontend/src/proprietary/components/shared/UpgradeBannerInitializer.tsx
+++ b/frontend/src/proprietary/components/shared/UpgradeBannerInitializer.tsx
@@ -1,6 +1,6 @@
-import { useEffect } from 'react';
-import { useBanner } from '@app/contexts/BannerContext';
-import UpgradeBanner from '@app/components/shared/UpgradeBanner';
+import { useEffect } from "react";
+import { useBanner } from "@app/contexts/BannerContext";
+import UpgradeBanner from "@app/components/shared/UpgradeBanner";
 
 export function UpgradeBannerInitializer() {
   const { setBanner } = useBanner();
@@ -14,4 +14,3 @@ export function UpgradeBannerInitializer() {
 
   return null;
 }
-
diff --git a/frontend/src/proprietary/components/shared/config/EnterpriseRequiredBanner.tsx b/frontend/src/proprietary/components/shared/config/EnterpriseRequiredBanner.tsx
index 50623871f8..a3012c3f38 100644
--- a/frontend/src/proprietary/components/shared/config/EnterpriseRequiredBanner.tsx
+++ b/frontend/src/proprietary/components/shared/config/EnterpriseRequiredBanner.tsx
@@ -1,6 +1,6 @@
-import { Alert, Text } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import LocalIcon from '@app/components/shared/LocalIcon';
+import { Alert, Text } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import LocalIcon from "@app/components/shared/LocalIcon";
 
 interface EnterpriseRequiredBannerProps {
   show: boolean;
@@ -10,28 +10,36 @@ interface EnterpriseRequiredBannerProps {
 /**
  * Banner that explains enterprise-only features are in demo mode
  */
-export default function EnterpriseRequiredBanner({ show, featureName }: EnterpriseRequiredBannerProps) {
+export default function EnterpriseRequiredBanner({
+  show,
+  featureName,
+}: EnterpriseRequiredBannerProps) {
   const { t } = useTranslation();
 
   if (!show) return null;
 
   return (
     <Alert
-      icon={<LocalIcon icon="workspace-premium-rounded" width={20} height={20} />}
-      title={t('admin.settings.enterpriseRequired.title', 'Enterprise License Required')}
+      icon={
+        <LocalIcon icon="workspace-premium-rounded" width={20} height={20} />
+      }
+      title={t(
+        "admin.settings.enterpriseRequired.title",
+        "Enterprise License Required",
+      )}
       color="yellow"
       variant="light"
       styles={{
         root: {
-          borderLeft: '4px solid var(--mantine-color-yellow-6)'
-        }
+          borderLeft: "4px solid var(--mantine-color-yellow-6)",
+        },
       }}
     >
       <Text size="sm">
         {t(
-          'admin.settings.enterpriseRequired.message',
-          'An Enterprise license is required to access {{featureName}}. You are viewing demo data for reference.',
-          { featureName }
+          "admin.settings.enterpriseRequired.message",
+          "An Enterprise license is required to access {{featureName}}. You are viewing demo data for reference.",
+          { featureName },
         )}
       </Text>
     </Alert>
diff --git a/frontend/src/proprietary/components/shared/config/OverviewHeader.tsx b/frontend/src/proprietary/components/shared/config/OverviewHeader.tsx
index 2361fce970..7e61628cde 100644
--- a/frontend/src/proprietary/components/shared/config/OverviewHeader.tsx
+++ b/frontend/src/proprietary/components/shared/config/OverviewHeader.tsx
@@ -1,7 +1,7 @@
-import { Text, Button } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { useAuth } from '@app/auth/UseSession';
-import { useNavigate } from 'react-router-dom';
+import { Text, Button } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import { useAuth } from "@app/auth/UseSession";
+import { useNavigate } from "react-router-dom";
 
 export function OverviewHeader() {
   const { t } = useTranslation();
@@ -11,19 +11,31 @@ export function OverviewHeader() {
   const handleLogout = async () => {
     try {
       await signOut();
-      navigate('/login');
+      navigate("/login");
     } catch (error) {
-      console.error('Logout error:', error);
+      console.error("Logout error:", error);
     }
   };
 
   return (
     <div>
-      <div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', marginBottom: '0.5rem' }}>
+      <div
+        style={{
+          display: "flex",
+          justifyContent: "space-between",
+          alignItems: "center",
+          marginBottom: "0.5rem",
+        }}
+      >
         <div>
-          <Text fw={600} size="lg">{t('config.overview.title', 'Application Configuration')}</Text>
+          <Text fw={600} size="lg">
+            {t("config.overview.title", "Application Configuration")}
+          </Text>
           <Text size="sm" c="dimmed">
-            {t('config.overview.description', 'Current application settings and configuration details.')}
+            {t(
+              "config.overview.description",
+              "Current application settings and configuration details.",
+            )}
           </Text>
           {user?.email && (
             <Text size="xs" c="dimmed" mt="0.25rem">
diff --git a/frontend/src/proprietary/components/shared/config/configNavSections.tsx b/frontend/src/proprietary/components/shared/config/configNavSections.tsx
index 142cb46e80..b21ac08c81 100644
--- a/frontend/src/proprietary/components/shared/config/configNavSections.tsx
+++ b/frontend/src/proprietary/components/shared/config/configNavSections.tsx
@@ -1,24 +1,28 @@
-import React from 'react';
-import { useTranslation } from 'react-i18next';
-import { useConfigNavSections as useCoreConfigNavSections, createConfigNavSections as createCoreConfigNavSections, ConfigNavSection } from '@core/components/shared/config/configNavSections';
-import PeopleSection from '@app/components/shared/config/configSections/PeopleSection';
-import TeamsSection from '@app/components/shared/config/configSections/TeamsSection';
-import AdminGeneralSection from '@app/components/shared/config/configSections/AdminGeneralSection';
-import AdminSecuritySection from '@app/components/shared/config/configSections/AdminSecuritySection';
-import AdminConnectionsSection from '@app/components/shared/config/configSections/AdminConnectionsSection';
-import AdminPrivacySection from '@app/components/shared/config/configSections/AdminPrivacySection';
-import AdminDatabaseSection from '@app/components/shared/config/configSections/AdminDatabaseSection';
-import AdminAdvancedSection from '@app/components/shared/config/configSections/AdminAdvancedSection';
-import AdminLegalSection from '@app/components/shared/config/configSections/AdminLegalSection';
-import AdminPlanSection from '@app/components/shared/config/configSections/AdminPlanSection';
-import AdminFeaturesSection from '@app/components/shared/config/configSections/AdminFeaturesSection';
-import AdminEndpointsSection from '@app/components/shared/config/configSections/AdminEndpointsSection';
-import AdminAuditSection from '@app/components/shared/config/configSections/AdminAuditSection';
-import AdminUsageSection from '@app/components/shared/config/configSections/AdminUsageSection';
-import AdminStorageSharingSection from '@app/components/shared/config/configSections/AdminStorageSharingSection';
-import ApiKeys from '@app/components/shared/config/configSections/ApiKeys';
-import AccountSection from '@app/components/shared/config/configSections/AccountSection';
-import GeneralSection from '@app/components/shared/config/configSections/GeneralSection';
+import React from "react";
+import { useTranslation } from "react-i18next";
+import {
+  useConfigNavSections as useCoreConfigNavSections,
+  createConfigNavSections as createCoreConfigNavSections,
+  ConfigNavSection,
+} from "@core/components/shared/config/configNavSections";
+import PeopleSection from "@app/components/shared/config/configSections/PeopleSection";
+import TeamsSection from "@app/components/shared/config/configSections/TeamsSection";
+import AdminGeneralSection from "@app/components/shared/config/configSections/AdminGeneralSection";
+import AdminSecuritySection from "@app/components/shared/config/configSections/AdminSecuritySection";
+import AdminConnectionsSection from "@app/components/shared/config/configSections/AdminConnectionsSection";
+import AdminPrivacySection from "@app/components/shared/config/configSections/AdminPrivacySection";
+import AdminDatabaseSection from "@app/components/shared/config/configSections/AdminDatabaseSection";
+import AdminAdvancedSection from "@app/components/shared/config/configSections/AdminAdvancedSection";
+import AdminLegalSection from "@app/components/shared/config/configSections/AdminLegalSection";
+import AdminPlanSection from "@app/components/shared/config/configSections/AdminPlanSection";
+import AdminFeaturesSection from "@app/components/shared/config/configSections/AdminFeaturesSection";
+import AdminEndpointsSection from "@app/components/shared/config/configSections/AdminEndpointsSection";
+import AdminAuditSection from "@app/components/shared/config/configSections/AdminAuditSection";
+import AdminUsageSection from "@app/components/shared/config/configSections/AdminUsageSection";
+import AdminStorageSharingSection from "@app/components/shared/config/configSections/AdminStorageSharingSection";
+import ApiKeys from "@app/components/shared/config/configSections/ApiKeys";
+import AccountSection from "@app/components/shared/config/configSections/AccountSection";
+import GeneralSection from "@app/components/shared/config/configSections/GeneralSection";
 
 /**
  * Hook version of proprietary config nav sections with proper i18n support
@@ -26,7 +30,7 @@ import GeneralSection from '@app/components/shared/config/configSections/General
 export const useConfigNavSections = (
   isAdmin: boolean = false,
   runningEE: boolean = false,
-  loginEnabled: boolean = false
+  loginEnabled: boolean = false,
 ): ConfigNavSection[] => {
   const { t } = useTranslation();
 
@@ -34,18 +38,22 @@ export const useConfigNavSections = (
   const sections = useCoreConfigNavSections(isAdmin, runningEE, loginEnabled);
 
   // Add account management under Preferences
-  const preferencesSection = sections.find((section) => section.items.some((item) => item.key === 'general'));
+  const preferencesSection = sections.find((section) =>
+    section.items.some((item) => item.key === "general"),
+  );
   if (preferencesSection) {
     preferencesSection.items = preferencesSection.items.map((item) =>
-      item.key === 'general' ? { ...item, component: <GeneralSection /> } : item
+      item.key === "general"
+        ? { ...item, component: <GeneralSection /> }
+        : item,
     );
 
     if (loginEnabled) {
       preferencesSection.items.push({
-        key: 'account',
-        label: t('account.accountSettings', 'Account'),
-        icon: 'person-rounded',
-        component: <AccountSection />
+        key: "account",
+        label: t("account.accountSettings", "Account"),
+        icon: "person-rounded",
+        component: <AccountSection />,
       });
     }
   }
@@ -53,160 +61,178 @@ export const useConfigNavSections = (
   // Add Admin sections if user is admin OR if login is disabled (but mark as disabled)
   if (isAdmin || !loginEnabled) {
     const requiresLogin = !loginEnabled;
-    const enableLoginTooltip = t('settings.tooltips.enableLoginFirst', 'Enable login mode first');
-    const requiresEnterpriseTooltip = t('settings.tooltips.requiresEnterprise', 'Requires Enterprise license');
+    const enableLoginTooltip = t(
+      "settings.tooltips.enableLoginFirst",
+      "Enable login mode first",
+    );
+    const requiresEnterpriseTooltip = t(
+      "settings.tooltips.requiresEnterprise",
+      "Requires Enterprise license",
+    );
 
     // Workspace
     sections.push({
-      title: t('settings.workspace.title', 'Workspace'),
+      title: t("settings.workspace.title", "Workspace"),
       items: [
         {
-          key: 'people',
-          label: t('settings.workspace.people', 'People'),
-          icon: 'group-rounded',
+          key: "people",
+          label: t("settings.workspace.people", "People"),
+          icon: "group-rounded",
           component: <PeopleSection />,
           disabled: requiresLogin,
-          disabledTooltip: requiresLogin ? enableLoginTooltip : undefined
+          disabledTooltip: requiresLogin ? enableLoginTooltip : undefined,
         },
         {
-          key: 'teams',
-          label: t('settings.workspace.teams', 'Teams'),
-          icon: 'groups-rounded',
+          key: "teams",
+          label: t("settings.workspace.teams", "Teams"),
+          icon: "groups-rounded",
           component: <TeamsSection />,
           disabled: requiresLogin,
-          disabledTooltip: requiresLogin ? enableLoginTooltip : undefined
+          disabledTooltip: requiresLogin ? enableLoginTooltip : undefined,
         },
       ],
     });
 
     // Configuration
     sections.push({
-      title: t('settings.configuration.title', 'Configuration'),
+      title: t("settings.configuration.title", "Configuration"),
       items: [
         {
-          key: 'adminGeneral',
-          label: t('settings.configuration.systemSettings', 'System Settings'),
-          icon: 'settings-rounded',
+          key: "adminGeneral",
+          label: t("settings.configuration.systemSettings", "System Settings"),
+          icon: "settings-rounded",
           component: <AdminGeneralSection />,
           disabled: requiresLogin,
-          disabledTooltip: requiresLogin ? enableLoginTooltip : undefined
+          disabledTooltip: requiresLogin ? enableLoginTooltip : undefined,
         },
         {
-          key: 'adminFeatures',
-          label: t('settings.configuration.features', 'Features'),
-          icon: 'extension-rounded',
+          key: "adminFeatures",
+          label: t("settings.configuration.features", "Features"),
+          icon: "extension-rounded",
           component: <AdminFeaturesSection />,
           disabled: requiresLogin,
-          disabledTooltip: requiresLogin ? enableLoginTooltip : undefined
+          disabledTooltip: requiresLogin ? enableLoginTooltip : undefined,
         },
         {
-          key: 'adminStorageSharing',
-          label: t('settings.configuration.storageSharing', 'File Storage & Sharing'),
-          icon: 'storage-rounded',
+          key: "adminStorageSharing",
+          label: t(
+            "settings.configuration.storageSharing",
+            "File Storage & Sharing",
+          ),
+          icon: "storage-rounded",
           component: <AdminStorageSharingSection />,
           disabled: requiresLogin,
-          disabledTooltip: requiresLogin ? enableLoginTooltip : undefined
+          disabledTooltip: requiresLogin ? enableLoginTooltip : undefined,
+          badge: t("toolPanel.alpha", "Alpha"),
+          badgeColor: "orange",
         },
         {
-          key: 'adminEndpoints',
-          label: t('settings.configuration.endpoints', 'Endpoints'),
-          icon: 'api-rounded',
+          key: "adminEndpoints",
+          label: t("settings.configuration.endpoints", "Endpoints"),
+          icon: "api-rounded",
           component: <AdminEndpointsSection />,
           disabled: requiresLogin,
-          disabledTooltip: requiresLogin ? enableLoginTooltip : undefined
+          disabledTooltip: requiresLogin ? enableLoginTooltip : undefined,
         },
         {
-          key: 'adminDatabase',
-          label: t('settings.configuration.database', 'Database'),
-          icon: 'storage-rounded',
+          key: "adminDatabase",
+          label: t("settings.configuration.database", "Database"),
+          icon: "storage-rounded",
           component: <AdminDatabaseSection />,
           disabled: requiresLogin,
-          disabledTooltip: requiresLogin ? enableLoginTooltip : undefined
+          disabledTooltip: requiresLogin ? enableLoginTooltip : undefined,
         },
         {
-          key: 'adminAdvanced',
-          label: t('settings.configuration.advanced', 'Advanced'),
-          icon: 'tune-rounded',
+          key: "adminAdvanced",
+          label: t("settings.configuration.advanced", "Advanced"),
+          icon: "tune-rounded",
           component: <AdminAdvancedSection />,
           disabled: requiresLogin,
-          disabledTooltip: requiresLogin ? enableLoginTooltip : undefined
+          disabledTooltip: requiresLogin ? enableLoginTooltip : undefined,
         },
       ],
     });
 
     // Security & Authentication
     sections.push({
-      title: t('settings.securityAuth.title', 'Security & Authentication'),
+      title: t("settings.securityAuth.title", "Security & Authentication"),
       items: [
         {
-          key: 'adminSecurity',
-          label: t('settings.securityAuth.security', 'Security'),
-          icon: 'shield-rounded',
+          key: "adminSecurity",
+          label: t("settings.securityAuth.security", "Security"),
+          icon: "shield-rounded",
           component: <AdminSecuritySection />,
           disabled: requiresLogin,
-          disabledTooltip: requiresLogin ? enableLoginTooltip : undefined
+          disabledTooltip: requiresLogin ? enableLoginTooltip : undefined,
         },
         {
-          key: 'adminConnections',
-          label: t('settings.securityAuth.connections', 'Connections'),
-          icon: 'link-rounded',
+          key: "adminConnections",
+          label: t("settings.securityAuth.connections", "Connections"),
+          icon: "link-rounded",
           component: <AdminConnectionsSection />,
           disabled: requiresLogin,
-          disabledTooltip: requiresLogin ? enableLoginTooltip : undefined
+          disabledTooltip: requiresLogin ? enableLoginTooltip : undefined,
         },
       ],
     });
 
     // Licensing & Analytics
     sections.push({
-      title: t('settings.licensingAnalytics.title', 'Licensing & Analytics'),
+      title: t("settings.licensingAnalytics.title", "Licensing & Analytics"),
       items: [
         {
-          key: 'adminPlan',
-          label: t('settings.licensingAnalytics.plan', 'Plan'),
-          icon: 'star-rounded',
+          key: "adminPlan",
+          label: t("settings.licensingAnalytics.plan", "Plan"),
+          icon: "star-rounded",
           component: <AdminPlanSection />,
           disabled: requiresLogin,
-          disabledTooltip: requiresLogin ? enableLoginTooltip : undefined
+          disabledTooltip: requiresLogin ? enableLoginTooltip : undefined,
         },
         {
-          key: 'adminAudit',
-          label: t('settings.licensingAnalytics.audit', 'Audit'),
-          icon: 'fact-check-rounded',
+          key: "adminAudit",
+          label: t("settings.licensingAnalytics.audit", "Audit"),
+          icon: "fact-check-rounded",
           component: <AdminAuditSection />,
           disabled: !runningEE || requiresLogin,
-          disabledTooltip: requiresLogin ? enableLoginTooltip : requiresEnterpriseTooltip
+          disabledTooltip: requiresLogin
+            ? enableLoginTooltip
+            : requiresEnterpriseTooltip,
         },
         {
-          key: 'adminUsage',
-          label: t('settings.licensingAnalytics.usageAnalytics', 'Usage Analytics'),
-          icon: 'analytics-rounded',
+          key: "adminUsage",
+          label: t(
+            "settings.licensingAnalytics.usageAnalytics",
+            "Usage Analytics",
+          ),
+          icon: "analytics-rounded",
           component: <AdminUsageSection />,
           disabled: !runningEE || requiresLogin,
-          disabledTooltip: requiresLogin ? enableLoginTooltip : requiresEnterpriseTooltip
+          disabledTooltip: requiresLogin
+            ? enableLoginTooltip
+            : requiresEnterpriseTooltip,
         },
       ],
     });
 
     // Policies & Privacy
     sections.push({
-      title: t('settings.policiesPrivacy.title', 'Policies & Privacy'),
+      title: t("settings.policiesPrivacy.title", "Policies & Privacy"),
       items: [
         {
-          key: 'adminLegal',
-          label: t('settings.policiesPrivacy.legal', 'Legal'),
-          icon: 'gavel-rounded',
+          key: "adminLegal",
+          label: t("settings.policiesPrivacy.legal", "Legal"),
+          icon: "gavel-rounded",
           component: <AdminLegalSection />,
           disabled: requiresLogin,
-          disabledTooltip: requiresLogin ? enableLoginTooltip : undefined
+          disabledTooltip: requiresLogin ? enableLoginTooltip : undefined,
         },
         {
-          key: 'adminPrivacy',
-          label: t('settings.policiesPrivacy.privacy', 'Privacy'),
-          icon: 'visibility-rounded',
+          key: "adminPrivacy",
+          label: t("settings.policiesPrivacy.privacy", "Privacy"),
+          icon: "visibility-rounded",
           component: <AdminPrivacySection />,
           disabled: requiresLogin,
-          disabledTooltip: requiresLogin ? enableLoginTooltip : undefined
+          disabledTooltip: requiresLogin ? enableLoginTooltip : undefined,
         },
       ],
     });
@@ -215,13 +241,13 @@ export const useConfigNavSections = (
   // Add Developer section if login is enabled
   if (loginEnabled) {
     const developerSection: ConfigNavSection = {
-      title: t('settings.developer.title', 'Developer'),
+      title: t("settings.developer.title", "Developer"),
       items: [
         {
-          key: 'api-keys',
-          label: t('settings.developer.apiKeys', 'API Keys'),
-          icon: 'key-rounded',
-          component: <ApiKeys />
+          key: "api-keys",
+          label: t("settings.developer.apiKeys", "API Keys"),
+          icon: "key-rounded",
+          component: <ApiKeys />,
         },
       ],
     };
@@ -241,26 +267,36 @@ export const useConfigNavSections = (
 export const createConfigNavSections = (
   isAdmin: boolean = false,
   runningEE: boolean = false,
-  loginEnabled: boolean = false
+  loginEnabled: boolean = false,
 ): ConfigNavSection[] => {
-  console.warn('createConfigNavSections is deprecated. Use useConfigNavSections hook instead for proper i18n support.');
+  console.warn(
+    "createConfigNavSections is deprecated. Use useConfigNavSections hook instead for proper i18n support.",
+  );
 
   // Get the core sections (just Preferences)
-  const sections = createCoreConfigNavSections(isAdmin, runningEE, loginEnabled);
+  const sections = createCoreConfigNavSections(
+    isAdmin,
+    runningEE,
+    loginEnabled,
+  );
 
   // Add account management under Preferences
-  const preferencesSection = sections.find((section) => section.items.some((item) => item.key === 'general'));
+  const preferencesSection = sections.find((section) =>
+    section.items.some((item) => item.key === "general"),
+  );
   if (preferencesSection) {
     preferencesSection.items = preferencesSection.items.map((item) =>
-      item.key === 'general' ? { ...item, component: <GeneralSection /> } : item
+      item.key === "general"
+        ? { ...item, component: <GeneralSection /> }
+        : item,
     );
 
     if (loginEnabled) {
       preferencesSection.items.push({
-        key: 'account',
-        label: 'Account',
-        icon: 'person-rounded',
-        component: <AccountSection />
+        key: "account",
+        label: "Account",
+        icon: "person-rounded",
+        component: <AccountSection />,
       });
     }
   }
@@ -271,147 +307,175 @@ export const createConfigNavSections = (
 
     // Workspace
     sections.push({
-      title: 'Workspace',
+      title: "Workspace",
       items: [
         {
-          key: 'people',
-          label: 'People',
-          icon: 'group-rounded',
+          key: "people",
+          label: "People",
+          icon: "group-rounded",
           component: <PeopleSection />,
           disabled: requiresLogin,
-          disabledTooltip: requiresLogin ? 'Enable login mode first' : undefined
+          disabledTooltip: requiresLogin
+            ? "Enable login mode first"
+            : undefined,
         },
         {
-          key: 'teams',
-          label: 'Teams',
-          icon: 'groups-rounded',
+          key: "teams",
+          label: "Teams",
+          icon: "groups-rounded",
           component: <TeamsSection />,
           disabled: requiresLogin,
-          disabledTooltip: requiresLogin ? 'Enable login mode first' : undefined
+          disabledTooltip: requiresLogin
+            ? "Enable login mode first"
+            : undefined,
         },
       ],
     });
 
     // Configuration
     sections.push({
-      title: 'Configuration',
+      title: "Configuration",
       items: [
         {
-          key: 'adminGeneral',
-          label: 'System Settings',
-          icon: 'settings-rounded',
+          key: "adminGeneral",
+          label: "System Settings",
+          icon: "settings-rounded",
           component: <AdminGeneralSection />,
           disabled: requiresLogin,
-          disabledTooltip: requiresLogin ? 'Enable login mode first' : undefined
+          disabledTooltip: requiresLogin
+            ? "Enable login mode first"
+            : undefined,
         },
         {
-          key: 'adminFeatures',
-          label: 'Features',
-          icon: 'extension-rounded',
+          key: "adminFeatures",
+          label: "Features",
+          icon: "extension-rounded",
           component: <AdminFeaturesSection />,
           disabled: requiresLogin,
-          disabledTooltip: requiresLogin ? 'Enable login mode first' : undefined
+          disabledTooltip: requiresLogin
+            ? "Enable login mode first"
+            : undefined,
         },
         {
-          key: 'adminEndpoints',
-          label: 'Endpoints',
-          icon: 'api-rounded',
+          key: "adminEndpoints",
+          label: "Endpoints",
+          icon: "api-rounded",
           component: <AdminEndpointsSection />,
           disabled: requiresLogin,
-          disabledTooltip: requiresLogin ? 'Enable login mode first' : undefined
+          disabledTooltip: requiresLogin
+            ? "Enable login mode first"
+            : undefined,
         },
         {
-          key: 'adminDatabase',
-          label: 'Database',
-          icon: 'storage-rounded',
+          key: "adminDatabase",
+          label: "Database",
+          icon: "storage-rounded",
           component: <AdminDatabaseSection />,
           disabled: requiresLogin,
-          disabledTooltip: requiresLogin ? 'Enable login mode first' : undefined
+          disabledTooltip: requiresLogin
+            ? "Enable login mode first"
+            : undefined,
         },
         {
-          key: 'adminAdvanced',
-          label: 'Advanced',
-          icon: 'tune-rounded',
+          key: "adminAdvanced",
+          label: "Advanced",
+          icon: "tune-rounded",
           component: <AdminAdvancedSection />,
           disabled: requiresLogin,
-          disabledTooltip: requiresLogin ? 'Enable login mode first' : undefined
+          disabledTooltip: requiresLogin
+            ? "Enable login mode first"
+            : undefined,
         },
       ],
     });
 
     // Security & Authentication
     sections.push({
-      title: 'Security & Authentication',
+      title: "Security & Authentication",
       items: [
         {
-          key: 'adminSecurity',
-          label: 'Security',
-          icon: 'shield-rounded',
+          key: "adminSecurity",
+          label: "Security",
+          icon: "shield-rounded",
           component: <AdminSecuritySection />,
           disabled: requiresLogin,
-          disabledTooltip: requiresLogin ? 'Enable login mode first' : undefined
+          disabledTooltip: requiresLogin
+            ? "Enable login mode first"
+            : undefined,
         },
         {
-          key: 'adminConnections',
-          label: 'Connections',
-          icon: 'link-rounded',
+          key: "adminConnections",
+          label: "Connections",
+          icon: "link-rounded",
           component: <AdminConnectionsSection />,
           disabled: requiresLogin,
-          disabledTooltip: requiresLogin ? 'Enable login mode first' : undefined
+          disabledTooltip: requiresLogin
+            ? "Enable login mode first"
+            : undefined,
         },
       ],
     });
 
     // Licensing & Analytics
     sections.push({
-      title: 'Licensing & Analytics',
+      title: "Licensing & Analytics",
       items: [
         {
-          key: 'adminPlan',
-          label: 'Plan',
-          icon: 'star-rounded',
+          key: "adminPlan",
+          label: "Plan",
+          icon: "star-rounded",
           component: <AdminPlanSection />,
           disabled: requiresLogin,
-          disabledTooltip: requiresLogin ? 'Enable login mode first' : undefined
+          disabledTooltip: requiresLogin
+            ? "Enable login mode first"
+            : undefined,
         },
         {
-          key: 'adminAudit',
-          label: 'Audit',
-          icon: 'fact-check-rounded',
+          key: "adminAudit",
+          label: "Audit",
+          icon: "fact-check-rounded",
           component: <AdminAuditSection />,
           disabled: !runningEE || requiresLogin,
-          disabledTooltip: requiresLogin ? 'Enable login mode first' : 'Requires Enterprise license'
+          disabledTooltip: requiresLogin
+            ? "Enable login mode first"
+            : "Requires Enterprise license",
         },
         {
-          key: 'adminUsage',
-          label: 'Usage Analytics',
-          icon: 'analytics-rounded',
+          key: "adminUsage",
+          label: "Usage Analytics",
+          icon: "analytics-rounded",
           component: <AdminUsageSection />,
           disabled: !runningEE || requiresLogin,
-          disabledTooltip: requiresLogin ? 'Enable login mode first' : 'Requires Enterprise license'
+          disabledTooltip: requiresLogin
+            ? "Enable login mode first"
+            : "Requires Enterprise license",
         },
       ],
     });
 
     // Policies & Privacy
     sections.push({
-      title: 'Policies & Privacy',
+      title: "Policies & Privacy",
       items: [
         {
-          key: 'adminLegal',
-          label: 'Legal',
-          icon: 'gavel-rounded',
+          key: "adminLegal",
+          label: "Legal",
+          icon: "gavel-rounded",
           component: <AdminLegalSection />,
           disabled: requiresLogin,
-          disabledTooltip: requiresLogin ? 'Enable login mode first' : undefined
+          disabledTooltip: requiresLogin
+            ? "Enable login mode first"
+            : undefined,
         },
         {
-          key: 'adminPrivacy',
-          label: 'Privacy',
-          icon: 'visibility-rounded',
+          key: "adminPrivacy",
+          label: "Privacy",
+          icon: "visibility-rounded",
           component: <AdminPrivacySection />,
           disabled: requiresLogin,
-          disabledTooltip: requiresLogin ? 'Enable login mode first' : undefined
+          disabledTooltip: requiresLogin
+            ? "Enable login mode first"
+            : undefined,
         },
       ],
     });
@@ -420,13 +484,13 @@ export const createConfigNavSections = (
   // Add Developer section if login is enabled
   if (loginEnabled) {
     const developerSection: ConfigNavSection = {
-      title: 'Developer',
+      title: "Developer",
       items: [
         {
-          key: 'api-keys',
-          label: 'API Keys',
-          icon: 'key-rounded',
-          component: <ApiKeys />
+          key: "api-keys",
+          label: "API Keys",
+          icon: "key-rounded",
+          component: <ApiKeys />,
         },
       ],
     };
@@ -440,4 +504,8 @@ export const createConfigNavSections = (
 };
 
 // Re-export types for convenience
-export type { ConfigNavSection, ConfigNavItem, ConfigColors } from '@core/components/shared/config/configNavSections';
+export type {
+  ConfigNavSection,
+  ConfigNavItem,
+  ConfigColors,
+} from "@core/components/shared/config/configNavSections";
diff --git a/frontend/src/proprietary/components/shared/config/configSections/AccountSection.tsx b/frontend/src/proprietary/components/shared/config/configSections/AccountSection.tsx
index a5fc29e1ac..40d16cfc56 100644
--- a/frontend/src/proprietary/components/shared/config/configSections/AccountSection.tsx
+++ b/frontend/src/proprietary/components/shared/config/configSections/AccountSection.tsx
@@ -1,15 +1,26 @@
-import React, { useCallback, useEffect, useMemo, useState } from 'react';
-import { Alert, Button, Box, Group, Modal, Paper, PasswordInput, Stack, Text, TextInput } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import LocalIcon from '@app/components/shared/LocalIcon';
-import { alert as showToast } from '@app/components/toast';
-import { useAuth } from '@app/auth/UseSession';
-import { accountService } from '@app/services/accountService';
-import { Z_INDEX_OVER_CONFIG_MODAL } from '@app/styles/zIndex';
-import { QRCodeSVG } from 'qrcode.react';
-import { useAccountLogout } from '@app/extensions/accountLogout';
-import { BASE_PATH } from '@app/constants/app';
-import { MfaSetupResponse } from '@app/responses/Mfa/MfaResponse';
+import React, { useCallback, useEffect, useMemo, useState } from "react";
+import {
+  Alert,
+  Button,
+  Box,
+  Group,
+  Modal,
+  Paper,
+  PasswordInput,
+  Stack,
+  Text,
+  TextInput,
+} from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import LocalIcon from "@app/components/shared/LocalIcon";
+import { alert as showToast } from "@app/components/toast";
+import { useAuth } from "@app/auth/UseSession";
+import { accountService } from "@app/services/accountService";
+import { Z_INDEX_OVER_CONFIG_MODAL } from "@app/styles/zIndex";
+import { QRCodeSVG } from "qrcode.react";
+import { useAccountLogout } from "@app/extensions/accountLogout";
+import { BASE_PATH } from "@app/constants/app";
+import { MfaSetupResponse } from "@app/responses/Mfa/MfaResponse";
 
 const AccountSection: React.FC = () => {
   const { t } = useTranslation();
@@ -18,43 +29,58 @@ const AccountSection: React.FC = () => {
   const [passwordModalOpen, setPasswordModalOpen] = useState(false);
   const [usernameModalOpen, setUsernameModalOpen] = useState(false);
 
-  const [currentPassword, setCurrentPassword] = useState('');
-  const [newPassword, setNewPassword] = useState('');
-  const [confirmPassword, setConfirmPassword] = useState('');
-  const [passwordError, setPasswordError] = useState('');
+  const [currentPassword, setCurrentPassword] = useState("");
+  const [newPassword, setNewPassword] = useState("");
+  const [confirmPassword, setConfirmPassword] = useState("");
+  const [passwordError, setPasswordError] = useState("");
   const [passwordSubmitting, setPasswordSubmitting] = useState(false);
 
-  const [currentPasswordForUsername, setCurrentPasswordForUsername] = useState('');
-  const [newUsername, setNewUsername] = useState('');
-  const [usernameError, setUsernameError] = useState('');
+  const [currentPasswordForUsername, setCurrentPasswordForUsername] =
+    useState("");
+  const [newUsername, setNewUsername] = useState("");
+  const [usernameError, setUsernameError] = useState("");
   const [usernameSubmitting, setUsernameSubmitting] = useState(false);
   const [mfaEnabled, setMfaEnabled] = useState(false);
   const [mfaSetupModalOpen, setMfaSetupModalOpen] = useState(false);
   const [mfaDisableModalOpen, setMfaDisableModalOpen] = useState(false);
-  const [mfaSetupData, setMfaSetupData] = useState<MfaSetupResponse | null>(null);
-  const [mfaSetupCode, setMfaSetupCode] = useState('');
-  const [mfaDisableCode, setMfaDisableCode] = useState('');
-  const [mfaError, setMfaError] = useState('');
+  const [mfaSetupData, setMfaSetupData] = useState<MfaSetupResponse | null>(
+    null,
+  );
+  const [mfaSetupCode, setMfaSetupCode] = useState("");
+  const [mfaDisableCode, setMfaDisableCode] = useState("");
+  const [mfaError, setMfaError] = useState("");
   const [mfaLoading, setMfaLoading] = useState(false);
   const [changeButtonDisabled, setChangeButtonDisabled] = useState(false);
-  const normalizeMfaCode = useCallback((value: string) => value.replace(/\D/g, '').slice(0, 6), []);
+  const normalizeMfaCode = useCallback(
+    (value: string) => value.replace(/\D/g, "").slice(0, 6),
+    [],
+  );
   const qrLogoSrc = `${BASE_PATH}/modern-logo/StirlingPDFLogoNoTextDark.svg`;
 
   const authTypeFromMetadata = useMemo(() => {
-    const metadata = user?.app_metadata as { authType?: string; authenticationType?: string } | undefined;
+    const metadata = user?.app_metadata as
+      | { authType?: string; authenticationType?: string }
+      | undefined;
     return metadata?.authenticationType ?? metadata?.authType;
   }, [user?.app_metadata]);
 
   const normalizedAuthType = useMemo(
-    () => (user?.authenticationType ?? authTypeFromMetadata ?? '').toLowerCase(),
-    [authTypeFromMetadata, user?.authenticationType]
+    () =>
+      (user?.authenticationType ?? authTypeFromMetadata ?? "").toLowerCase(),
+    [authTypeFromMetadata, user?.authenticationType],
+  );
+  const isSsoUser = useMemo(
+    () => ["sso", "oauth2", "saml2"].includes(normalizedAuthType),
+    [normalizedAuthType],
   );
-  const isSsoUser = useMemo(() => ['sso', 'oauth2', 'saml2'].includes(normalizedAuthType), [normalizedAuthType]);
 
-  const userIdentifier = useMemo(() => user?.email || user?.username || '', [user?.email, user?.username]);
+  const userIdentifier = useMemo(
+    () => user?.email || user?.username || "",
+    [user?.email, user?.username],
+  );
 
   const redirectToLogin = useCallback(() => {
-    window.location.assign('/login');
+    window.location.assign("/login");
   }, []);
 
   const handleLogout = useCallback(async () => {
@@ -65,41 +91,56 @@ const AccountSection: React.FC = () => {
     event.preventDefault();
 
     if (isSsoUser) {
-      setPasswordError(t('settings.security.password.ssoDisabled', 'Password changes are managed by your identity provider.'));
+      setPasswordError(
+        t(
+          "settings.security.password.ssoDisabled",
+          "Password changes are managed by your identity provider.",
+        ),
+      );
       return;
     }
 
     if (!currentPassword || !newPassword || !confirmPassword) {
-      setPasswordError(t('settings.security.password.required', 'All fields are required.'));
+      setPasswordError(
+        t("settings.security.password.required", "All fields are required."),
+      );
       return;
     }
 
     if (newPassword !== confirmPassword) {
-      setPasswordError(t('settings.security.password.mismatch', 'New passwords do not match.'));
+      setPasswordError(
+        t("settings.security.password.mismatch", "New passwords do not match."),
+      );
       return;
     }
 
     try {
       setPasswordSubmitting(true);
-      setPasswordError('');
+      setPasswordError("");
 
       await accountService.changePassword(currentPassword, newPassword);
 
       showToast({
-        alertType: 'success',
-        title: t('settings.security.password.success', 'Password updated successfully. Please sign in again.'),
+        alertType: "success",
+        title: t(
+          "settings.security.password.success",
+          "Password updated successfully. Please sign in again.",
+        ),
       });
 
-      setCurrentPassword('');
-      setNewPassword('');
-      setConfirmPassword('');
+      setCurrentPassword("");
+      setNewPassword("");
+      setConfirmPassword("");
       setPasswordModalOpen(false);
       await handleLogout();
     } catch (err) {
       const axiosError = err as { response?: { data?: { message?: string } } };
       setPasswordError(
         axiosError.response?.data?.message ||
-          t('settings.security.password.error', 'Unable to update password. Please verify your current password and try again.')
+          t(
+            "settings.security.password.error",
+            "Unable to update password. Please verify your current password and try again.",
+          ),
       );
     } finally {
       setPasswordSubmitting(false);
@@ -110,13 +151,16 @@ const AccountSection: React.FC = () => {
     const fetchAccountData = async () => {
       setChangeButtonDisabled(true);
       try {
-        const data = await accountService.getAccountData().then((data) => data).finally(() => {
-          setChangeButtonDisabled(false);
-        });
+        const data = await accountService
+          .getAccountData()
+          .then((data) => data)
+          .finally(() => {
+            setChangeButtonDisabled(false);
+          });
         setMfaEnabled(data.mfaEnabled ?? false);
       } catch {
         // ignore fetch errors for account data
-        console.warn('Failed to fetch account data');
+        console.warn("Failed to fetch account data");
       } finally {
         setChangeButtonDisabled(false);
       }
@@ -127,8 +171,8 @@ const AccountSection: React.FC = () => {
   const handleStartMfaSetup = useCallback(async () => {
     try {
       setMfaLoading(true);
-      setMfaError('');
-      setMfaSetupCode('');
+      setMfaError("");
+      setMfaSetupCode("");
       const data = await accountService.requestMfaSetup();
       setMfaSetupData(data);
       setMfaSetupModalOpen(true);
@@ -136,7 +180,10 @@ const AccountSection: React.FC = () => {
       const axiosError = err as { response?: { data?: { error?: string } } };
       setMfaError(
         axiosError.response?.data?.error ||
-          t('account.mfa.setupFailed', 'Unable to start two-factor setup. Please try again.')
+          t(
+            "account.mfa.setupFailed",
+            "Unable to start two-factor setup. Please try again.",
+          ),
       );
     } finally {
       setMfaLoading(false);
@@ -147,117 +194,152 @@ const AccountSection: React.FC = () => {
     async (event: React.FormEvent) => {
       event.preventDefault();
       if (!mfaSetupCode.trim()) {
-        setMfaError(t('account.mfa.codeRequired', 'Enter the authentication code to continue.'));
+        setMfaError(
+          t(
+            "account.mfa.codeRequired",
+            "Enter the authentication code to continue.",
+          ),
+        );
         return;
       }
       try {
         setMfaLoading(true);
-        setMfaError('');
+        setMfaError("");
         await accountService.enableMfa(mfaSetupCode.trim());
         setMfaEnabled(true);
         setMfaSetupModalOpen(false);
         setMfaSetupData(null);
-        setMfaSetupCode('');
+        setMfaSetupCode("");
         showToast({
-          alertType: 'success',
-          title: t('account.mfa.enabled', 'Two-factor authentication enabled.'),
+          alertType: "success",
+          title: t("account.mfa.enabled", "Two-factor authentication enabled."),
         });
       } catch (err) {
         const axiosError = err as { response?: { data?: { error?: string } } };
         setMfaError(
           axiosError.response?.data?.error ||
-            t('account.mfa.enableFailed', 'Unable to enable two-factor authentication. Check the code and try again.')
+            t(
+              "account.mfa.enableFailed",
+              "Unable to enable two-factor authentication. Check the code and try again.",
+            ),
         );
       } finally {
         setMfaLoading(false);
       }
     },
-    [mfaSetupCode, t]
+    [mfaSetupCode, t],
   );
 
   const handleDisableMfa = useCallback(
     async (event: React.FormEvent) => {
       event.preventDefault();
       if (!mfaDisableCode.trim()) {
-        setMfaError(t('account.mfa.codeRequired', 'Enter the authentication code to continue.'));
+        setMfaError(
+          t(
+            "account.mfa.codeRequired",
+            "Enter the authentication code to continue.",
+          ),
+        );
         return;
       }
       try {
         setMfaLoading(true);
-        setMfaError('');
+        setMfaError("");
         await accountService.disableMfa(mfaDisableCode.trim());
         setMfaEnabled(false);
         setMfaDisableModalOpen(false);
-        setMfaDisableCode('');
+        setMfaDisableCode("");
         showToast({
-          alertType: 'success',
-          title: t('account.mfa.disabled', 'Two-factor authentication disabled.'),
+          alertType: "success",
+          title: t(
+            "account.mfa.disabled",
+            "Two-factor authentication disabled.",
+          ),
         });
       } catch (err) {
         const axiosError = err as { response?: { data?: { error?: string } } };
         setMfaError(
           axiosError.response?.data?.error ||
-            t('account.mfa.disableFailed', 'Unable to disable two-factor authentication. Check the code and try again.')
+            t(
+              "account.mfa.disableFailed",
+              "Unable to disable two-factor authentication. Check the code and try again.",
+            ),
         );
       } finally {
         setMfaLoading(false);
       }
     },
-    [mfaDisableCode, t]
+    [mfaDisableCode, t],
   );
 
   const handleCloseMfaSetupModal = useCallback(async () => {
     setMfaSetupModalOpen(false);
     setMfaSetupData(null);
-    setMfaSetupCode('');
-    setMfaError('');
+    setMfaSetupCode("");
+    setMfaError("");
     try {
       await accountService.cancelMfaSetup();
     } catch {
-      console.warn('Failed to clear pending MFA setup');
+      console.warn("Failed to clear pending MFA setup");
     }
   }, []);
 
   const handleCloseMfaDisableModal = useCallback(() => {
     setMfaDisableModalOpen(false);
-    setMfaDisableCode('');
-    setMfaError('');
+    setMfaDisableCode("");
+    setMfaError("");
   }, []);
 
   const handleUsernameSubmit = async (event: React.FormEvent) => {
     event.preventDefault();
 
     if (isSsoUser) {
-      setUsernameError(t('changeCreds.ssoManaged', 'Your account is managed by your identity provider.'));
+      setUsernameError(
+        t(
+          "changeCreds.ssoManaged",
+          "Your account is managed by your identity provider.",
+        ),
+      );
       return;
     }
 
     if (!currentPasswordForUsername || !newUsername) {
-      setUsernameError(t('settings.security.password.required', 'All fields are required.'));
+      setUsernameError(
+        t("settings.security.password.required", "All fields are required."),
+      );
       return;
     }
 
     try {
       setUsernameSubmitting(true);
-      setUsernameError('');
+      setUsernameError("");
 
-      await accountService.changeUsername(newUsername, currentPasswordForUsername);
+      await accountService.changeUsername(
+        newUsername,
+        currentPasswordForUsername,
+      );
 
       showToast({
-        alertType: 'success',
-        title: t('changeCreds.credsUpdated', 'Account updated'),
-        body: t('changeCreds.description', 'Changes saved. Please log in again.'),
+        alertType: "success",
+        title: t("changeCreds.credsUpdated", "Account updated"),
+        body: t(
+          "changeCreds.description",
+          "Changes saved. Please log in again.",
+        ),
       });
 
-      setNewUsername('');
-      setCurrentPasswordForUsername('');
+      setNewUsername("");
+      setCurrentPasswordForUsername("");
       setUsernameModalOpen(false);
       await handleLogout();
     } catch (err) {
       const axiosError = err as { response?: { data?: { message?: string } } };
       setUsernameError(
         axiosError.response?.data?.message ||
-          t('changeCreds.error', 'Unable to update username. Please verify your password and try again.')
+          t(
+            "changeCreds.error",
+            "Unable to update username. Please verify your password and try again.",
+          ),
       );
     } finally {
       setUsernameSubmitting(false);
@@ -268,10 +350,10 @@ const AccountSection: React.FC = () => {
     <Stack gap="md">
       <div>
         <Text fw={600} size="lg">
-          {t('account.accountSettings', 'Account')}
+          {t("account.accountSettings", "Account")}
         </Text>
         <Text size="sm" c="dimmed">
-          {t('changeCreds.header', 'Update Your Account Details')}
+          {t("changeCreds.header", "Update Your Account Details")}
         </Text>
       </div>
 
@@ -279,21 +361,31 @@ const AccountSection: React.FC = () => {
         <Stack gap="sm">
           <Text size="sm" c="dimmed">
             {userIdentifier
-              ? t('settings.general.user', 'User') + ': ' + userIdentifier
-              : t('account.accountSettings', 'Account Settings')}
+              ? t("settings.general.user", "User") + ": " + userIdentifier
+              : t("account.accountSettings", "Account Settings")}
           </Text>
 
           <Stack gap="xs">
             {isSsoUser && (
-              <Alert icon={<LocalIcon icon="info" width="1rem" height="1rem" />} color="blue" variant="light">
-                {t('changeCreds.ssoManaged', 'Your account is managed by your identity provider.')}
+              <Alert
+                icon={<LocalIcon icon="info" width="1rem" height="1rem" />}
+                color="blue"
+                variant="light"
+              >
+                {t(
+                  "changeCreds.ssoManaged",
+                  "Your account is managed by your identity provider.",
+                )}
               </Alert>
             )}
 
             <Group gap="sm" wrap="wrap">
               {!isSsoUser && (
-                <Button leftSection={<LocalIcon icon="key-rounded" />} onClick={() => setPasswordModalOpen(true)}>
-                  {t('settings.security.password.update', 'Update password')}
+                <Button
+                  leftSection={<LocalIcon icon="key-rounded" />}
+                  onClick={() => setPasswordModalOpen(true)}
+                >
+                  {t("settings.security.password.update", "Update password")}
                 </Button>
               )}
 
@@ -303,12 +395,17 @@ const AccountSection: React.FC = () => {
                   leftSection={<LocalIcon icon="edit-rounded" />}
                   onClick={() => setUsernameModalOpen(true)}
                 >
-                  {t('account.changeUsername', 'Change username')}
+                  {t("account.changeUsername", "Change username")}
                 </Button>
               )}
 
-              <Button variant="outline" color="red" leftSection={<LocalIcon icon="logout-rounded" />} onClick={handleLogout}>
-                {t('settings.general.logout', 'Log out')}
+              <Button
+                variant="outline"
+                color="red"
+                leftSection={<LocalIcon icon="logout-rounded" />}
+                onClick={handleLogout}
+              >
+                {t("settings.general.logout", "Log out")}
               </Button>
             </Group>
           </Stack>
@@ -317,27 +414,41 @@ const AccountSection: React.FC = () => {
 
       <Paper withBorder p="md" radius="md">
         <Stack gap="sm">
-          <Text fw={600}>{t('account.mfa.title', 'Two-factor authentication')}</Text>
+          <Text fw={600}>
+            {t("account.mfa.title", "Two-factor authentication")}
+          </Text>
           <Text size="sm" c="dimmed">
-            {t('account.mfa.description', 'Add an extra layer of security to your account.')}
+            {t(
+              "account.mfa.description",
+              "Add an extra layer of security to your account.",
+            )}
           </Text>
           {isSsoUser ? (
-            <Alert icon={<LocalIcon icon="info" width="1rem" height="1rem" />} color="blue" variant="light">
+            <Alert
+              icon={<LocalIcon icon="info" width="1rem" height="1rem" />}
+              color="blue"
+              variant="light"
+            >
               {t(
-                'account.mfa.ssoManaged',
-                'Two-factor authentication for this account is managed by your identity provider.'
+                "account.mfa.ssoManaged",
+                "Two-factor authentication for this account is managed by your identity provider.",
               )}
             </Alert>
           ) : (
             <Group gap="sm" wrap="wrap">
               {!mfaEnabled ? (
                 <Button
-                  leftSection={<LocalIcon icon="check-circle-outline-rounded" />}
+                  leftSection={
+                    <LocalIcon icon="check-circle-outline-rounded" />
+                  }
                   onClick={handleStartMfaSetup}
                   loading={mfaLoading}
                   disabled={changeButtonDisabled}
                 >
-                  {t('account.mfa.enableButton', 'Enable two-factor authentication')}
+                  {t(
+                    "account.mfa.enableButton",
+                    "Enable two-factor authentication",
+                  )}
                 </Button>
               ) : (
                 <Button
@@ -345,13 +456,16 @@ const AccountSection: React.FC = () => {
                   color="red"
                   leftSection={<LocalIcon icon="close-rounded" />}
                   onClick={() => {
-                    setMfaError('');
-                    setMfaDisableCode('');
+                    setMfaError("");
+                    setMfaDisableCode("");
                     setMfaDisableModalOpen(true);
                   }}
                   disabled={changeButtonDisabled}
                 >
-                  {t('account.mfa.disableButton', 'Disable two-factor authentication')}
+                  {t(
+                    "account.mfa.disableButton",
+                    "Disable two-factor authentication",
+                  )}
                 </Button>
               )}
             </Group>
@@ -362,52 +476,87 @@ const AccountSection: React.FC = () => {
       <Modal
         opened={passwordModalOpen}
         onClose={() => setPasswordModalOpen(false)}
-        title={t('settings.security.title', 'Change password')}
+        title={t("settings.security.title", "Change password")}
         withinPortal
         zIndex={Z_INDEX_OVER_CONFIG_MODAL}
       >
         <form onSubmit={handlePasswordSubmit}>
           <Stack gap="md">
             <Text size="sm" c="dimmed">
-              {t('settings.security.password.subtitle', 'Change your password. You will be logged out after updating.')}
+              {t(
+                "settings.security.password.subtitle",
+                "Change your password. You will be logged out after updating.",
+              )}
             </Text>
 
             {passwordError && (
-              <Alert icon={<LocalIcon icon="error-rounded" width="1rem" height="1rem" />} color="red" variant="light">
+              <Alert
+                icon={
+                  <LocalIcon icon="error-rounded" width="1rem" height="1rem" />
+                }
+                color="red"
+                variant="light"
+              >
                 {passwordError}
               </Alert>
             )}
 
             <PasswordInput
-              label={t('settings.security.password.current', 'Current password')}
-              placeholder={t('settings.security.password.currentPlaceholder', 'Enter your current password')}
+              label={t(
+                "settings.security.password.current",
+                "Current password",
+              )}
+              placeholder={t(
+                "settings.security.password.currentPlaceholder",
+                "Enter your current password",
+              )}
               value={currentPassword}
-              onChange={(event) => setCurrentPassword(event.currentTarget.value)}
+              onChange={(event) =>
+                setCurrentPassword(event.currentTarget.value)
+              }
               required
             />
 
             <PasswordInput
-              label={t('settings.security.password.new', 'New password')}
-              placeholder={t('settings.security.password.newPlaceholder', 'Enter a new password')}
+              label={t("settings.security.password.new", "New password")}
+              placeholder={t(
+                "settings.security.password.newPlaceholder",
+                "Enter a new password",
+              )}
               value={newPassword}
               onChange={(event) => setNewPassword(event.currentTarget.value)}
               required
             />
 
             <PasswordInput
-              label={t('settings.security.password.confirm', 'Confirm new password')}
-              placeholder={t('settings.security.password.confirmPlaceholder', 'Re-enter your new password')}
+              label={t(
+                "settings.security.password.confirm",
+                "Confirm new password",
+              )}
+              placeholder={t(
+                "settings.security.password.confirmPlaceholder",
+                "Re-enter your new password",
+              )}
               value={confirmPassword}
-              onChange={(event) => setConfirmPassword(event.currentTarget.value)}
+              onChange={(event) =>
+                setConfirmPassword(event.currentTarget.value)
+              }
               required
             />
 
             <Group justify="flex-end" gap="sm">
-              <Button variant="default" onClick={() => setPasswordModalOpen(false)}>
-                {t('common.cancel', 'Cancel')}
+              <Button
+                variant="default"
+                onClick={() => setPasswordModalOpen(false)}
+              >
+                {t("common.cancel", "Cancel")}
               </Button>
-              <Button type="submit" loading={passwordSubmitting} leftSection={<LocalIcon icon="save-rounded" />}>
-                {t('settings.security.password.update', 'Update password')}
+              <Button
+                type="submit"
+                loading={passwordSubmitting}
+                leftSection={<LocalIcon icon="save-rounded" />}
+              >
+                {t("settings.security.password.update", "Update password")}
               </Button>
             </Group>
           </Stack>
@@ -417,7 +566,7 @@ const AccountSection: React.FC = () => {
       <Modal
         opened={mfaSetupModalOpen}
         onClose={handleCloseMfaSetupModal}
-        title={t('account.mfa.setupTitle', 'Set up two-factor authentication')}
+        title={t("account.mfa.setupTitle", "Set up two-factor authentication")}
         withinPortal
         zIndex={Z_INDEX_OVER_CONFIG_MODAL}
       >
@@ -425,22 +574,22 @@ const AccountSection: React.FC = () => {
           <Stack gap="md">
             <Text size="sm" c="dimmed">
               {t(
-                'account.mfa.setupDescription',
-                'Scan the QR code with your authenticator app, then enter the 6-digit code to confirm.'
+                "account.mfa.setupDescription",
+                "Scan the QR code with your authenticator app, then enter the 6-digit code to confirm.",
               )}
             </Text>
             {mfaSetupData && (
               <Stack gap="sm" align="center">
                 <Box
                   style={{
-                    padding: '1.5rem',
-                    background: 'white',
-                    borderRadius: '8px',
-                    boxShadow: '0 2px 8px rgba(0,0,0,0.1)',
+                    padding: "1.5rem",
+                    background: "white",
+                    borderRadius: "8px",
+                    boxShadow: "0 2px 8px rgba(0,0,0,0.1)",
                   }}
                 >
                   <QRCodeSVG
-                    value={mfaSetupData.otpauthUri || ''}
+                    value={mfaSetupData.otpauthUri || ""}
                     size={180}
                     level="H"
                     imageSettings={{
@@ -452,26 +601,38 @@ const AccountSection: React.FC = () => {
                   />
                 </Box>
                 <Text size="sm" c="dimmed">
-                  {t('account.mfa.manualKey', 'Manual setup key')}: <strong>{mfaSetupData.secret}</strong>
+                  {t("account.mfa.manualKey", "Manual setup key")}:{" "}
+                  <strong>{mfaSetupData.secret}</strong>
                 </Text>
                 <Text size="xs" c="orange">
                   {t(
-                    'account.mfa.secretWarning',
-                    'Keep this key private. Anyone with access can generate valid authentication codes.'
+                    "account.mfa.secretWarning",
+                    "Keep this key private. Anyone with access can generate valid authentication codes.",
                   )}
                 </Text>
               </Stack>
             )}
             {mfaError && (
-              <Alert icon={<LocalIcon icon="error-rounded" width="1rem" height="1rem" />} color="red" variant="light">
+              <Alert
+                icon={
+                  <LocalIcon icon="error-rounded" width="1rem" height="1rem" />
+                }
+                color="red"
+                variant="light"
+              >
                 {mfaError}
               </Alert>
             )}
             <TextInput
-              label={t('account.mfa.codeLabel', 'Authentication code')}
-              placeholder={t('account.mfa.codePlaceholder', 'Enter 6-digit code')}
+              label={t("account.mfa.codeLabel", "Authentication code")}
+              placeholder={t(
+                "account.mfa.codePlaceholder",
+                "Enter 6-digit code",
+              )}
               value={mfaSetupCode}
-              onChange={(event: React.ChangeEvent<HTMLInputElement>) => setMfaSetupCode(normalizeMfaCode(event.currentTarget.value))}
+              onChange={(event: React.ChangeEvent<HTMLInputElement>) =>
+                setMfaSetupCode(normalizeMfaCode(event.currentTarget.value))
+              }
               inputMode="numeric"
               pattern="[0-9]*"
               maxLength={6}
@@ -481,10 +642,10 @@ const AccountSection: React.FC = () => {
             />
             <Group justify="flex-end" gap="sm">
               <Button variant="default" onClick={handleCloseMfaSetupModal}>
-                {t('common.cancel', 'Cancel')}
+                {t("common.cancel", "Cancel")}
               </Button>
               <Button type="submit" loading={mfaLoading}>
-                {t('account.mfa.confirmEnable', 'Enable')}
+                {t("account.mfa.confirmEnable", "Enable")}
               </Button>
             </Group>
           </Stack>
@@ -494,25 +655,42 @@ const AccountSection: React.FC = () => {
       <Modal
         opened={mfaDisableModalOpen}
         onClose={handleCloseMfaDisableModal}
-        title={t('account.mfa.disableTitle', 'Disable two-factor authentication')}
+        title={t(
+          "account.mfa.disableTitle",
+          "Disable two-factor authentication",
+        )}
         withinPortal
         zIndex={Z_INDEX_OVER_CONFIG_MODAL}
       >
         <form onSubmit={handleDisableMfa}>
           <Stack gap="md">
             <Text size="sm" c="dimmed">
-              {t('account.mfa.disableDescription', 'Enter a valid authentication code to disable two-factor authentication.')}
+              {t(
+                "account.mfa.disableDescription",
+                "Enter a valid authentication code to disable two-factor authentication.",
+              )}
             </Text>
             {mfaError && (
-              <Alert icon={<LocalIcon icon="error-rounded" width="1rem" height="1rem" />} color="red" variant="light">
+              <Alert
+                icon={
+                  <LocalIcon icon="error-rounded" width="1rem" height="1rem" />
+                }
+                color="red"
+                variant="light"
+              >
                 {mfaError}
               </Alert>
             )}
             <TextInput
-              label={t('account.mfa.codeLabel', 'Authentication code')}
-              placeholder={t('account.mfa.codePlaceholder', 'Enter 6-digit code')}
+              label={t("account.mfa.codeLabel", "Authentication code")}
+              placeholder={t(
+                "account.mfa.codePlaceholder",
+                "Enter 6-digit code",
+              )}
               value={mfaDisableCode}
-              onChange={(event: React.ChangeEvent<HTMLInputElement>) => setMfaDisableCode(normalizeMfaCode(event.currentTarget.value))}
+              onChange={(event: React.ChangeEvent<HTMLInputElement>) =>
+                setMfaDisableCode(normalizeMfaCode(event.currentTarget.value))
+              }
               inputMode="numeric"
               pattern="[0-9]*"
               maxLength={6}
@@ -522,10 +700,10 @@ const AccountSection: React.FC = () => {
             />
             <Group justify="flex-end" gap="sm">
               <Button variant="default" onClick={handleCloseMfaDisableModal}>
-                {t('common.cancel', 'Cancel')}
+                {t("common.cancel", "Cancel")}
               </Button>
               <Button type="submit" color="red" loading={mfaLoading}>
-                {t('account.mfa.confirmDisable', 'Disable')}
+                {t("account.mfa.confirmDisable", "Disable")}
               </Button>
             </Group>
           </Stack>
@@ -535,44 +713,64 @@ const AccountSection: React.FC = () => {
       <Modal
         opened={usernameModalOpen}
         onClose={() => setUsernameModalOpen(false)}
-        title={t('account.changeUsername', 'Change username')}
+        title={t("account.changeUsername", "Change username")}
         withinPortal
         zIndex={Z_INDEX_OVER_CONFIG_MODAL}
       >
         <form onSubmit={handleUsernameSubmit}>
           <Stack gap="md">
             <Text size="sm" c="dimmed">
-              {t('changeCreds.changeUsername', 'Update your username. You will be logged out after updating.')}
+              {t(
+                "changeCreds.changeUsername",
+                "Update your username. You will be logged out after updating.",
+              )}
             </Text>
 
             {usernameError && (
-              <Alert icon={<LocalIcon icon="error-rounded" width="1rem" height="1rem" />} color="red" variant="light">
+              <Alert
+                icon={
+                  <LocalIcon icon="error-rounded" width="1rem" height="1rem" />
+                }
+                color="red"
+                variant="light"
+              >
                 {usernameError}
               </Alert>
             )}
 
             <TextInput
-              label={t('changeCreds.newUsername', 'New Username')}
-              placeholder={t('changeCreds.newUsername', 'New Username')}
+              label={t("changeCreds.newUsername", "New Username")}
+              placeholder={t("changeCreds.newUsername", "New Username")}
               value={newUsername}
-              onChange={(event: React.ChangeEvent<HTMLInputElement>) => setNewUsername(event.currentTarget.value)}
+              onChange={(event: React.ChangeEvent<HTMLInputElement>) =>
+                setNewUsername(event.currentTarget.value)
+              }
               required
             />
 
             <PasswordInput
-              label={t('changeCreds.oldPassword', 'Current Password')}
-              placeholder={t('changeCreds.oldPassword', 'Current Password')}
+              label={t("changeCreds.oldPassword", "Current Password")}
+              placeholder={t("changeCreds.oldPassword", "Current Password")}
               value={currentPasswordForUsername}
-              onChange={(event: React.ChangeEvent<HTMLInputElement>) => setCurrentPasswordForUsername(event.currentTarget.value)}
+              onChange={(event: React.ChangeEvent<HTMLInputElement>) =>
+                setCurrentPasswordForUsername(event.currentTarget.value)
+              }
               required
             />
 
             <Group justify="flex-end" gap="sm">
-              <Button variant="default" onClick={() => setUsernameModalOpen(false)}>
-                {t('common.cancel', 'Cancel')}
+              <Button
+                variant="default"
+                onClick={() => setUsernameModalOpen(false)}
+              >
+                {t("common.cancel", "Cancel")}
               </Button>
-              <Button type="submit" loading={usernameSubmitting} leftSection={<LocalIcon icon="save-rounded" />}>
-                {t('common.save', 'Save')}
+              <Button
+                type="submit"
+                loading={usernameSubmitting}
+                leftSection={<LocalIcon icon="save-rounded" />}
+              >
+                {t("common.save", "Save")}
               </Button>
             </Group>
           </Stack>
diff --git a/frontend/src/proprietary/components/shared/config/configSections/AdminAdvancedSection.tsx b/frontend/src/proprietary/components/shared/config/configSections/AdminAdvancedSection.tsx
index 033abd326a..5c48bf916c 100644
--- a/frontend/src/proprietary/components/shared/config/configSections/AdminAdvancedSection.tsx
+++ b/frontend/src/proprietary/components/shared/config/configSections/AdminAdvancedSection.tsx
@@ -1,17 +1,30 @@
-import { useCallback, useEffect, useMemo, useState } from 'react';
-import { useTranslation } from 'react-i18next';
-import { NumberInput, Switch, Button, Stack, Paper, Text, Loader, Group, Accordion, TextInput, MultiSelect } from '@mantine/core';
-import { alert } from '@app/components/toast';
-import RestartConfirmationModal from '@app/components/shared/config/RestartConfirmationModal';
-import { useRestartServer } from '@app/components/shared/config/useRestartServer';
-import { useAdminSettings } from '@app/hooks/useAdminSettings';
-import { useSettingsDirty } from '@app/hooks/useSettingsDirty';
-import PendingBadge from '@app/components/shared/config/PendingBadge';
-import { SettingsStickyFooter } from '@app/components/shared/config/SettingsStickyFooter';
-import apiClient from '@app/services/apiClient';
-import { useLoginRequired } from '@app/hooks/useLoginRequired';
-import LoginRequiredBanner from '@app/components/shared/config/LoginRequiredBanner';
-import { Z_INDEX_OVER_CONFIG_MODAL } from '@app/styles/zIndex';
+import { useCallback, useEffect, useMemo, useState } from "react";
+import { isAxiosError } from "axios";
+import { useTranslation } from "react-i18next";
+import {
+  NumberInput,
+  Switch,
+  Button,
+  Stack,
+  Paper,
+  Text,
+  Loader,
+  Group,
+  Accordion,
+  TextInput,
+  MultiSelect,
+} from "@mantine/core";
+import { alert } from "@app/components/toast";
+import RestartConfirmationModal from "@app/components/shared/config/RestartConfirmationModal";
+import { useRestartServer } from "@app/components/shared/config/useRestartServer";
+import { useAdminSettings } from "@app/hooks/useAdminSettings";
+import { useSettingsDirty } from "@app/hooks/useSettingsDirty";
+import PendingBadge from "@app/components/shared/config/PendingBadge";
+import { SettingsStickyFooter } from "@app/components/shared/config/SettingsStickyFooter";
+import apiClient from "@app/services/apiClient";
+import { useLoginRequired } from "@app/hooks/useLoginRequired";
+import LoginRequiredBanner from "@app/components/shared/config/LoginRequiredBanner";
+import { Z_INDEX_OVER_CONFIG_MODAL } from "@app/styles/zIndex";
 
 interface AdvancedSettingsData {
   enableAlphaFunctionality?: boolean;
@@ -59,8 +72,14 @@ interface AdvancedSettingsData {
 
 export default function AdminAdvancedSection() {
   const { t } = useTranslation();
-  const { restartModalOpened, showRestartModal, closeRestartModal, restartServer } = useRestartServer();
-  const { loginEnabled, validateLoginEnabled, getDisabledStyles } = useLoginRequired();
+  const {
+    restartModalOpened,
+    showRestartModal,
+    closeRestartModal,
+    restartServer,
+  } = useRestartServer();
+  const { loginEnabled, validateLoginEnabled, getDisabledStyles } =
+    useLoginRequired();
 
   const {
     settings,
@@ -71,39 +90,44 @@ export default function AdminAdvancedSection() {
     saveSettings,
     isFieldPending,
   } = useAdminSettings<AdvancedSettingsData>({
-    sectionName: 'advanced',
-    fetchTransformer: async (): Promise<AdvancedSettingsData & { _pending?: Record<string, any> }> => {
+    sectionName: "advanced",
+    fetchTransformer: async (): Promise<
+      AdvancedSettingsData & { _pending?: Record<string, unknown> }
+    > => {
       const [systemResponse, processExecutorResponse] = await Promise.all([
-        apiClient.get('/api/v1/admin/settings/section/system'),
-        apiClient.get('/api/v1/admin/settings/section/processExecutor')
+        apiClient.get("/api/v1/admin/settings/section/system"),
+        apiClient.get("/api/v1/admin/settings/section/processExecutor"),
       ]);
 
       const systemData = systemResponse.data || {};
       const processExecutorData = processExecutorResponse.data || {};
 
-      const result: AdvancedSettingsData & { _pending?: Record<string, any> } = {
+      const result: AdvancedSettingsData & {
+        _pending?: Record<string, unknown>;
+      } = {
         enableAlphaFunctionality: systemData.enableAlphaFunctionality || false,
         maxDPI: systemData.maxDPI || 0,
         enableUrlToPDF: systemData.enableUrlToPDF || false,
-        tessdataDir: systemData.tessdataDir || '',
+        tessdataDir: systemData.tessdataDir || "",
         disableSanitize: systemData.disableSanitize || false,
         tempFileManagement: systemData.tempFileManagement || {
-          baseTmpDir: '',
-          libreofficeDir: '',
-          systemTempDir: '',
-          prefix: 'stirling-pdf-',
+          baseTmpDir: "",
+          libreofficeDir: "",
+          systemTempDir: "",
+          prefix: "stirling-pdf-",
           maxAgeHours: 24,
           cleanupIntervalMinutes: 30,
           startupCleanup: true,
-          cleanupSystemTemp: false
+          cleanupSystemTemp: false,
         },
-        processExecutor: processExecutorData || {}
+        processExecutor: processExecutorData || {},
       };
 
       // Merge pending blocks from both endpoints
-      const pendingBlock: Record<string, any> = {};
+      const pendingBlock: Record<string, unknown> = {};
       if (systemData._pending?.enableAlphaFunctionality !== undefined) {
-        pendingBlock.enableAlphaFunctionality = systemData._pending.enableAlphaFunctionality;
+        pendingBlock.enableAlphaFunctionality =
+          systemData._pending.enableAlphaFunctionality;
       }
       if (systemData._pending?.maxDPI !== undefined) {
         pendingBlock.maxDPI = systemData._pending.maxDPI;
@@ -118,7 +142,8 @@ export default function AdminAdvancedSection() {
         pendingBlock.disableSanitize = systemData._pending.disableSanitize;
       }
       if (systemData._pending?.tempFileManagement) {
-        pendingBlock.tempFileManagement = systemData._pending.tempFileManagement;
+        pendingBlock.tempFileManagement =
+          systemData._pending.tempFileManagement;
       }
       if (processExecutorData._pending) {
         pendingBlock.processExecutor = processExecutorData._pending;
@@ -131,43 +156,55 @@ export default function AdminAdvancedSection() {
       return result;
     },
     saveTransformer: (settings) => {
-      const deltaSettings: Record<string, any> = {
-        'system.enableAlphaFunctionality': settings.enableAlphaFunctionality,
-        'system.maxDPI': settings.maxDPI,
-        'system.enableUrlToPDF': settings.enableUrlToPDF,
-        'system.tessdataDir': settings.tessdataDir,
-        'system.disableSanitize': settings.disableSanitize
+      const deltaSettings: Record<string, unknown> = {
+        "system.enableAlphaFunctionality": settings.enableAlphaFunctionality,
+        "system.maxDPI": settings.maxDPI,
+        "system.enableUrlToPDF": settings.enableUrlToPDF,
+        "system.tessdataDir": settings.tessdataDir,
+        "system.disableSanitize": settings.disableSanitize,
       };
 
       // Add temp file management settings
       if (settings.tempFileManagement) {
-        deltaSettings['system.tempFileManagement.baseTmpDir'] = settings.tempFileManagement.baseTmpDir;
-        deltaSettings['system.tempFileManagement.libreofficeDir'] = settings.tempFileManagement.libreofficeDir;
-        deltaSettings['system.tempFileManagement.systemTempDir'] = settings.tempFileManagement.systemTempDir;
-        deltaSettings['system.tempFileManagement.prefix'] = settings.tempFileManagement.prefix;
-        deltaSettings['system.tempFileManagement.maxAgeHours'] = settings.tempFileManagement.maxAgeHours;
-        deltaSettings['system.tempFileManagement.cleanupIntervalMinutes'] = settings.tempFileManagement.cleanupIntervalMinutes;
-        deltaSettings['system.tempFileManagement.startupCleanup'] = settings.tempFileManagement.startupCleanup;
-        deltaSettings['system.tempFileManagement.cleanupSystemTemp'] = settings.tempFileManagement.cleanupSystemTemp;
+        deltaSettings["system.tempFileManagement.baseTmpDir"] =
+          settings.tempFileManagement.baseTmpDir;
+        deltaSettings["system.tempFileManagement.libreofficeDir"] =
+          settings.tempFileManagement.libreofficeDir;
+        deltaSettings["system.tempFileManagement.systemTempDir"] =
+          settings.tempFileManagement.systemTempDir;
+        deltaSettings["system.tempFileManagement.prefix"] =
+          settings.tempFileManagement.prefix;
+        deltaSettings["system.tempFileManagement.maxAgeHours"] =
+          settings.tempFileManagement.maxAgeHours;
+        deltaSettings["system.tempFileManagement.cleanupIntervalMinutes"] =
+          settings.tempFileManagement.cleanupIntervalMinutes;
+        deltaSettings["system.tempFileManagement.startupCleanup"] =
+          settings.tempFileManagement.startupCleanup;
+        deltaSettings["system.tempFileManagement.cleanupSystemTemp"] =
+          settings.tempFileManagement.cleanupSystemTemp;
       }
 
       // Add process executor settings
       if (settings.processExecutor?.sessionLimit) {
-        Object.entries(settings.processExecutor.sessionLimit).forEach(([key, value]) => {
-          deltaSettings[`processExecutor.sessionLimit.${key}`] = value;
-        });
+        Object.entries(settings.processExecutor.sessionLimit).forEach(
+          ([key, value]) => {
+            deltaSettings[`processExecutor.sessionLimit.${key}`] = value;
+          },
+        );
       }
       if (settings.processExecutor?.timeoutMinutes) {
-        Object.entries(settings.processExecutor.timeoutMinutes).forEach(([key, value]) => {
-          deltaSettings[`processExecutor.timeoutMinutes.${key}`] = value;
-        });
+        Object.entries(settings.processExecutor.timeoutMinutes).forEach(
+          ([key, value]) => {
+            deltaSettings[`processExecutor.timeoutMinutes.${key}`] = value;
+          },
+        );
       }
 
       return {
         sectionData: {},
-        deltaSettings
+        deltaSettings,
       };
-    }
+    },
   });
 
   useEffect(() => {
@@ -177,12 +214,18 @@ export default function AdminAdvancedSection() {
   }, [loginEnabled]);
 
   const [tessdataLanguages, setTessdataLanguages] = useState<string[]>([]);
-  const [remoteTessdataLanguages, setRemoteTessdataLanguages] = useState<string[]>([]);
+  const [remoteTessdataLanguages, setRemoteTessdataLanguages] = useState<
+    string[]
+  >([]);
   const [tessdataDirWritable, setTessdataDirWritable] = useState<boolean>(true);
   const [manualDownloadLinks, setManualDownloadLinks] = useState<string[]>([]);
-  const [tessdataLanguagesLoading, setTessdataLanguagesLoading] = useState(false);
-  const [downloadLanguagesLoading, setDownloadLanguagesLoading] = useState(false);
-  const [selectedDownloadLanguages, setSelectedDownloadLanguages] = useState<string[]>([]);
+  const [tessdataLanguagesLoading, setTessdataLanguagesLoading] =
+    useState(false);
+  const [downloadLanguagesLoading, setDownloadLanguagesLoading] =
+    useState(false);
+  const [selectedDownloadLanguages, setSelectedDownloadLanguages] = useState<
+    string[]
+  >([]);
 
   useEffect(() => {
     if (!loginEnabled) return;
@@ -190,17 +233,26 @@ export default function AdminAdvancedSection() {
     const fetchTessdataLanguages = async () => {
       setTessdataLanguagesLoading(true);
       try {
-        const { data } = await apiClient.get<{ installed: string[]; available: string[]; writable?: boolean }>('/api/v1/ui-data/tessdata-languages', {
-          suppressErrorToast: true
+        const { data } = await apiClient.get<{
+          installed: string[];
+          available: string[];
+          writable?: boolean;
+        }>("/api/v1/ui-data/tessdata-languages", {
+          suppressErrorToast: true,
         });
         const installed = data.installed || [];
         const available = data.available || [];
         setTessdataLanguages(installed);
-        setRemoteTessdataLanguages(available.filter((lang) => !installed.includes(lang)));
+        setRemoteTessdataLanguages(
+          available.filter((lang) => !installed.includes(lang)),
+        );
         setTessdataDirWritable(data.writable !== false);
         setManualDownloadLinks([]);
       } catch (error) {
-        console.error('[AdminAdvancedSection] Failed to load tessdata languages', error);
+        console.error(
+          "[AdminAdvancedSection] Failed to load tessdata languages",
+          error,
+        );
         setTessdataLanguages([]);
         setRemoteTessdataLanguages([]);
         setTessdataDirWritable(true);
@@ -216,20 +268,26 @@ export default function AdminAdvancedSection() {
   const refreshTessdataWithRetry = async (retries = 3, delayMs = 400) => {
     for (let attempt = 0; attempt < retries; attempt++) {
       try {
-        const { data } = await apiClient.get<{ installed: string[]; available: string[]; writable?: boolean }>(
-          '/api/v1/ui-data/tessdata-languages',
-          { suppressErrorToast: true }
-        );
+        const { data } = await apiClient.get<{
+          installed: string[];
+          available: string[];
+          writable?: boolean;
+        }>("/api/v1/ui-data/tessdata-languages", { suppressErrorToast: true });
         const installed = data.installed || [];
         const available = data.available || [];
         setTessdataLanguages(installed);
-        setRemoteTessdataLanguages(available.filter((lang) => !installed.includes(lang)));
+        setRemoteTessdataLanguages(
+          available.filter((lang) => !installed.includes(lang)),
+        );
         setTessdataDirWritable(data.writable !== false);
         setManualDownloadLinks([]);
         return;
       } catch (err) {
         if (attempt === retries - 1) {
-          console.error('[AdminAdvancedSection] Retry refresh tessdata failed', err);
+          console.error(
+            "[AdminAdvancedSection] Retry refresh tessdata failed",
+            err,
+          );
           return;
         }
         await new Promise((resolve) => setTimeout(resolve, delayMs));
@@ -237,29 +295,40 @@ export default function AdminAdvancedSection() {
     }
   };
 
-  const safeLangRegex = useMemo(() => new RegExp('[^A-Za-z0-9_+\\-]', 'g'), []);
+  const safeLangRegex = useMemo(() => new RegExp("[^A-Za-z0-9_+\\-]", "g"), []);
 
   const handleDownloadTessdataLanguages = async () => {
     if (!loginEnabled) return;
     if (selectedDownloadLanguages.length === 0) {
       alert({
-        alertType: 'warning',
-        title: t('admin.settings.advanced.tessdataDir.downloadMissingTitle', 'No language selected'),
-        body: t('admin.settings.advanced.tessdataDir.downloadMissingBody', 'Please select at least one language to download.'),
+        alertType: "warning",
+        title: t(
+          "admin.settings.advanced.tessdataDir.downloadMissingTitle",
+          "No language selected",
+        ),
+        body: t(
+          "admin.settings.advanced.tessdataDir.downloadMissingBody",
+          "Please select at least one language to download.",
+        ),
         expandable: false,
       });
       return;
     }
     // Ensure selection is a subset of remote languages to prevent invalid requests
     const remoteSet = new Set(remoteTessdataLanguages);
-    const invalidSelection = selectedDownloadLanguages.filter((lang) => !remoteSet.has(lang));
+    const invalidSelection = selectedDownloadLanguages.filter(
+      (lang) => !remoteSet.has(lang),
+    );
     if (invalidSelection.length > 0) {
       alert({
-        alertType: 'warning',
-        title: t('admin.settings.advanced.tessdataDir.downloadInvalidTitle', 'Invalid selection'),
+        alertType: "warning",
+        title: t(
+          "admin.settings.advanced.tessdataDir.downloadInvalidTitle",
+          "Invalid selection",
+        ),
         body: t(
-          'admin.settings.advanced.tessdataDir.downloadInvalidBody',
-          'Some selected languages are not available to download. Please refresh and choose from the list.'
+          "admin.settings.advanced.tessdataDir.downloadInvalidBody",
+          "Some selected languages are not available to download. Please refresh and choose from the list.",
         ),
         expandable: false,
       });
@@ -267,41 +336,65 @@ export default function AdminAdvancedSection() {
     }
     setDownloadLanguagesLoading(true);
     try {
-      await apiClient.post('/api/v1/ui-data/tessdata/download', { languages: selectedDownloadLanguages }, {
-        suppressErrorToast: true
-      });
+      await apiClient.post(
+        "/api/v1/ui-data/tessdata/download",
+        { languages: selectedDownloadLanguages },
+        {
+          suppressErrorToast: true,
+        },
+      );
       alert({
-        alertType: 'success',
-        title: t('admin.settings.advanced.tessdataDir.downloadSuccessTitle', 'Languages downloaded'),
-        body: t('admin.settings.advanced.tessdataDir.downloadSuccessBody', 'The selected tessdata languages have been saved.'),
+        alertType: "success",
+        title: t(
+          "admin.settings.advanced.tessdataDir.downloadSuccessTitle",
+          "Languages downloaded",
+        ),
+        body: t(
+          "admin.settings.advanced.tessdataDir.downloadSuccessBody",
+          "The selected tessdata languages have been saved.",
+        ),
       });
       // Refresh installed list with retry in case filesystem sync is delayed
       await refreshTessdataWithRetry();
       setSelectedDownloadLanguages([]);
       setManualDownloadLinks([]);
     } catch (error) {
-      console.error('[AdminAdvancedSection] Download tessdata languages failed', error);
-      const response = (error as any)?.response;
-      const status = response?.status;
-      const serverMessage = response?.data?.message;
+      console.error(
+        "[AdminAdvancedSection] Download tessdata languages failed",
+        error,
+      );
+      const status = isAxiosError(error) ? error.response?.status : undefined;
+      const serverMessage = isAxiosError(error)
+        ? error.response?.data?.message
+        : undefined;
 
       if (status === 403) {
-        console.warn('[AdminAdvancedSection] Tessdata directory not writable, falling back to manual download:', serverMessage);
+        console.warn(
+          "[AdminAdvancedSection] Tessdata directory not writable, falling back to manual download:",
+          serverMessage,
+        );
         setTessdataDirWritable(false);
         setManualDownloadLinks(
           selectedDownloadLanguages.map((lang) => {
-            const safeLang = lang.replace(safeLangRegex, '');
+            const safeLang = lang.replace(safeLangRegex, "");
             return `https://raw.githubusercontent.com/tesseract-ocr/tessdata/main/${safeLang}.traineddata`;
-          })
+          }),
+        );
+        const message = t(
+          "admin.settings.advanced.tessdataDir.downloadErrorPermission",
+          {
+            defaultValue:
+              "Tessdata directory is not writable: {{message}}. Please choose a writable directory (e.g. under the application data folder) or adjust permissions.",
+            message:
+              serverMessage ?? settings.tessdataDir ?? "unknown location",
+          },
         );
-        const message = t('admin.settings.advanced.tessdataDir.downloadErrorPermission', {
-          defaultValue:
-            'Tessdata directory is not writable: {{message}}. Please choose a writable directory (e.g. under the application data folder) or adjust permissions.',
-          message: serverMessage ?? settings.tessdataDir ?? 'unknown location',
-        });
         alert({
-          alertType: 'error',
-          title: t('admin.settings.advanced.tessdataDir.downloadErrorTitle', 'Download Failed'),
+          alertType: "error",
+          title: t(
+            "admin.settings.advanced.tessdataDir.downloadErrorTitle",
+            "Download Failed",
+          ),
           body: message,
           expandable: false,
         });
@@ -309,25 +402,33 @@ export default function AdminAdvancedSection() {
       }
 
       let message: string;
-      if (!response) {
+      if (!isAxiosError(error) || !error.response) {
         message = t(
-          'admin.settings.advanced.tessdataDir.downloadErrorNetwork',
-          'Download failed due to a network error. Please check your connection and try again.'
+          "admin.settings.advanced.tessdataDir.downloadErrorNetwork",
+          "Download failed due to a network error. Please check your connection and try again.",
         );
-      } else if (status >= 500) {
+      } else if (status !== undefined && status >= 500) {
         message = t(
-          'admin.settings.advanced.tessdataDir.downloadErrorServer',
-          'The server encountered an error while downloading tessdata languages. Please try again later.'
+          "admin.settings.advanced.tessdataDir.downloadErrorServer",
+          "The server encountered an error while downloading tessdata languages. Please try again later.",
         );
       } else {
-        message = t('admin.settings.advanced.tessdataDir.downloadErrorGeneric', {
-          defaultValue: 'Download failed: {{message}}. Please try again later.',
-          message: serverMessage ?? settings.tessdataDir ?? 'unknown location',
-        });
+        message = t(
+          "admin.settings.advanced.tessdataDir.downloadErrorGeneric",
+          {
+            defaultValue:
+              "Download failed: {{message}}. Please try again later.",
+            message:
+              serverMessage ?? settings.tessdataDir ?? "unknown location",
+          },
+        );
       }
       alert({
-        alertType: 'error',
-        title: t('admin.settings.advanced.tessdataDir.downloadErrorTitle', 'Download Failed'),
+        alertType: "error",
+        title: t(
+          "admin.settings.advanced.tessdataDir.downloadErrorTitle",
+          "Download Failed",
+        ),
         body: message,
         expandable: false,
       });
@@ -336,8 +437,10 @@ export default function AdminAdvancedSection() {
     }
   };
 
-
-  const { isDirty, resetToSnapshot, markSaved } = useSettingsDirty(settings, loading);
+  const { isDirty, resetToSnapshot, markSaved } = useSettingsDirty(
+    settings,
+    loading,
+  );
   const handleSave = async () => {
     if (!validateLoginEnabled()) {
       return;
@@ -348,9 +451,9 @@ export default function AdminAdvancedSection() {
       showRestartModal();
     } catch (_error) {
       alert({
-        alertType: 'error',
-        title: t('admin.error', 'Error'),
-        body: t('admin.settings.saveError', 'Failed to save settings'),
+        alertType: "error",
+        title: t("admin.error", "Error"),
+        body: t("admin.settings.saveError", "Failed to save settings"),
       });
     }
   };
@@ -374,735 +477,1298 @@ export default function AdminAdvancedSection() {
     <div className="settings-section-container">
       <Stack gap="lg" className="settings-section-content">
         <LoginRequiredBanner show={!loginEnabled} />
-      <div>
-        <Text fw={600} size="lg">{t('admin.settings.advanced.title', 'Advanced')}</Text>
-        <Text size="sm" c="dimmed">
-          {t('admin.settings.advanced.description', 'Configure advanced features and experimental functionality.')}
-        </Text>
-      </div>
-
-      {/* Feature Flags */}
-      <Paper withBorder p="md" radius="md">
-        <Stack gap="md">
-          <Text fw={600} size="sm" mb="xs">{t('admin.settings.advanced.features', 'Feature Flags')}</Text>
-
-          <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}>
-            <div>
-              <Text fw={500} size="sm">{t('admin.settings.advanced.enableAlphaFunctionality.label', 'Enable Alpha Features')}</Text>
-              <Text size="xs" c="dimmed" mt={4}>
-                {t('admin.settings.advanced.enableAlphaFunctionality.description', 'Enable experimental and alpha-stage features (may be unstable)')}
-              </Text>
-            </div>
-            <Group gap="xs">
-              <Switch
-                checked={settings.enableAlphaFunctionality || false}
-                onChange={(e) => {
-                  if (!loginEnabled) return;
-                  setSettings({ ...settings, enableAlphaFunctionality: e.target.checked });
-                }}
-                disabled={!loginEnabled}
-                styles={getDisabledStyles()}
-              />
-              <PendingBadge show={isFieldPending('enableAlphaFunctionality')} />
-            </Group>
-          </div>
-
-          <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}>
-            <div>
-              <Text fw={500} size="sm">{t('admin.settings.advanced.enableUrlToPDF.label', 'Enable URL to PDF')}</Text>
-              <Text size="xs" c="dimmed" mt={4}>
-                {t('admin.settings.advanced.enableUrlToPDF.description', 'Allow conversion of web pages to PDF documents (internal use only)')}
-              </Text>
-            </div>
-            <Group gap="xs">
-              <Switch
-                checked={settings.enableUrlToPDF || false}
-                onChange={(e) => {
-                  if (!loginEnabled) return;
-                  setSettings({ ...settings, enableUrlToPDF: e.target.checked });
-                }}
-                disabled={!loginEnabled}
-                styles={getDisabledStyles()}
-              />
-              <PendingBadge show={isFieldPending('enableUrlToPDF')} />
-            </Group>
-          </div>
-
-          <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}>
-            <div>
-              <Text fw={500} size="sm">{t('admin.settings.advanced.disableSanitize.label', 'Disable HTML Sanitization')}</Text>
-              <Text size="xs" c="dimmed" mt={4}>
-                {t('admin.settings.advanced.disableSanitize.description', 'Disable HTML sanitization (WARNING: Security risk - can lead to XSS injections)')}
-              </Text>
-            </div>
-            <Group gap="xs">
-              <Switch
-                checked={settings.disableSanitize || false}
-                onChange={(e) => {
-                  if (!loginEnabled) return;
-                  setSettings({ ...settings, disableSanitize: e.target.checked });
-                }}
-                disabled={!loginEnabled}
-                styles={getDisabledStyles()}
-              />
-              <PendingBadge show={isFieldPending('disableSanitize')} />
-            </Group>
-          </div>
-        </Stack>
-      </Paper>
-
-      {/* Processing Settings */}
-      <Paper withBorder p="md" radius="md">
-        <Stack gap="md">
-          <Text fw={600} size="sm" mb="xs">{t('admin.settings.advanced.processing', 'Processing')}</Text>
-
-          <div>
-            <NumberInput
-              label={
-                <Group gap="xs">
-                  <span>{t('admin.settings.advanced.maxDPI.label', 'Maximum DPI')}</span>
-                  <PendingBadge show={isFieldPending('maxDPI')} />
-                </Group>
-              }
-              description={t('admin.settings.advanced.maxDPI.description', 'Maximum DPI for image processing (0 = unlimited)')}
-              value={settings.maxDPI || 0}
-              onChange={(value) => setSettings({ ...settings, maxDPI: Number(value) })}
-              min={0}
-              max={3000}
-              disabled={!loginEnabled}
-            />
-          </div>
-
-          {/* Tessdata Directory */}
-          <div>
-            <TextInput
-              label={
-                <Group gap="xs">
-                  <span>{t('admin.settings.advanced.tessdataDir.label', 'Tessdata Directory')}</span>
-                  <PendingBadge show={isFieldPending('tessdataDir')} />
-                </Group>
-              }
-              description={t('admin.settings.advanced.tessdataDir.description', 'Path to the directory containing Tessdata files for OCR')}
-              value={settings.tessdataDir || ''}
-              onChange={(e) => setSettings({ ...settings, tessdataDir: e.target.value })}
-              placeholder="/usr/share/tessdata"
-              disabled={!loginEnabled}
-            />
-            {tessdataLanguagesLoading ? (
-              <Group gap="xs" mt={6}>
-                <Loader size="xs" />
-                <Text size="xs">
-                  {t('admin.settings.advanced.tessdataDir.loadingLanguages', 'Loading installed tessdata languages...')}
-                </Text>
-              </Group>
-            ) : (
-              <Text size="xs" c="dimmed" mt={6}>
-                {tessdataLanguages.length > 0
-                  ? `${t('admin.settings.advanced.tessdataDir.installedLanguages', 'Installed tessdata languages')}: ${tessdataLanguages.join(', ')}`
-                  : t('admin.settings.advanced.tessdataDir.noLanguages', 'No tessdata languages found in the configured directory')}
-              </Text>
+        <div>
+          <Text fw={600} size="lg">
+            {t("admin.settings.advanced.title", "Advanced")}
+          </Text>
+          <Text size="sm" c="dimmed">
+            {t(
+              "admin.settings.advanced.description",
+              "Configure advanced features and experimental functionality.",
             )}
-            <Stack gap="xs" mt="sm">
-              <MultiSelect
-                label={t('admin.settings.advanced.tessdataDir.downloadLabel', 'Download additional tessdata languages')}
-                placeholder={t('admin.settings.advanced.tessdataDir.downloadPlaceholder', 'Select languages')}
-                data={remoteTessdataLanguages.map((lang) => ({ value: lang, label: lang }))}
-                searchable
-                disabled={!loginEnabled || remoteTessdataLanguages.length === 0}
-                value={selectedDownloadLanguages}
-                onChange={setSelectedDownloadLanguages}
-                comboboxProps={{ withinPortal: true, zIndex: Z_INDEX_OVER_CONFIG_MODAL }}
-                nothingFoundMessage={t('admin.settings.advanced.tessdataDir.downloadNothingFound', 'No additional languages found')}
-              />
-              {!tessdataDirWritable && (
-                <Text size="xs" c="yellow.4">
+          </Text>
+        </div>
+
+        {/* Feature Flags */}
+        <Paper withBorder p="md" radius="md">
+          <Stack gap="md">
+            <Text fw={600} size="sm" mb="xs">
+              {t("admin.settings.advanced.features", "Feature Flags")}
+            </Text>
+
+            <div
+              style={{
+                display: "flex",
+                alignItems: "center",
+                justifyContent: "space-between",
+              }}
+            >
+              <div>
+                <Text fw={500} size="sm">
                   {t(
-                    'admin.settings.advanced.tessdataDir.permissionNotice',
-                    'The tessdata path is not writable. Downloads will be opened in the browser; please save the .traineddata files manually into the tessdata folder.'
+                    "admin.settings.advanced.enableAlphaFunctionality.label",
+                    "Enable Alpha Features",
                   )}
                 </Text>
-              )}
-              {!tessdataDirWritable && manualDownloadLinks.length > 0 && (
-                <Stack gap="xs">
-                  <Text size="xs" c="dimmed">
+                <Text size="xs" c="dimmed" mt={4}>
+                  {t(
+                    "admin.settings.advanced.enableAlphaFunctionality.description",
+                    "Enable experimental and alpha-stage features (may be unstable)",
+                  )}
+                </Text>
+              </div>
+              <Group gap="xs">
+                <Switch
+                  checked={settings.enableAlphaFunctionality || false}
+                  onChange={(e) => {
+                    if (!loginEnabled) return;
+                    setSettings({
+                      ...settings,
+                      enableAlphaFunctionality: e.target.checked,
+                    });
+                  }}
+                  disabled={!loginEnabled}
+                  styles={getDisabledStyles()}
+                />
+                <PendingBadge
+                  show={isFieldPending("enableAlphaFunctionality")}
+                />
+              </Group>
+            </div>
+
+            <div
+              style={{
+                display: "flex",
+                alignItems: "center",
+                justifyContent: "space-between",
+              }}
+            >
+              <div>
+                <Text fw={500} size="sm">
+                  {t(
+                    "admin.settings.advanced.enableUrlToPDF.label",
+                    "Enable URL to PDF",
+                  )}
+                </Text>
+                <Text size="xs" c="dimmed" mt={4}>
+                  {t(
+                    "admin.settings.advanced.enableUrlToPDF.description",
+                    "Allow conversion of web pages to PDF documents (internal use only)",
+                  )}
+                </Text>
+              </div>
+              <Group gap="xs">
+                <Switch
+                  checked={settings.enableUrlToPDF || false}
+                  onChange={(e) => {
+                    if (!loginEnabled) return;
+                    setSettings({
+                      ...settings,
+                      enableUrlToPDF: e.target.checked,
+                    });
+                  }}
+                  disabled={!loginEnabled}
+                  styles={getDisabledStyles()}
+                />
+                <PendingBadge show={isFieldPending("enableUrlToPDF")} />
+              </Group>
+            </div>
+
+            <div
+              style={{
+                display: "flex",
+                alignItems: "center",
+                justifyContent: "space-between",
+              }}
+            >
+              <div>
+                <Text fw={500} size="sm">
+                  {t(
+                    "admin.settings.advanced.disableSanitize.label",
+                    "Disable HTML Sanitization",
+                  )}
+                </Text>
+                <Text size="xs" c="dimmed" mt={4}>
+                  {t(
+                    "admin.settings.advanced.disableSanitize.description",
+                    "Disable HTML sanitization (WARNING: Security risk - can lead to XSS injections)",
+                  )}
+                </Text>
+              </div>
+              <Group gap="xs">
+                <Switch
+                  checked={settings.disableSanitize || false}
+                  onChange={(e) => {
+                    if (!loginEnabled) return;
+                    setSettings({
+                      ...settings,
+                      disableSanitize: e.target.checked,
+                    });
+                  }}
+                  disabled={!loginEnabled}
+                  styles={getDisabledStyles()}
+                />
+                <PendingBadge show={isFieldPending("disableSanitize")} />
+              </Group>
+            </div>
+          </Stack>
+        </Paper>
+
+        {/* Processing Settings */}
+        <Paper withBorder p="md" radius="md">
+          <Stack gap="md">
+            <Text fw={600} size="sm" mb="xs">
+              {t("admin.settings.advanced.processing", "Processing")}
+            </Text>
+
+            <div>
+              <NumberInput
+                label={
+                  <Group gap="xs">
+                    <span>
+                      {t("admin.settings.advanced.maxDPI.label", "Maximum DPI")}
+                    </span>
+                    <PendingBadge show={isFieldPending("maxDPI")} />
+                  </Group>
+                }
+                description={t(
+                  "admin.settings.advanced.maxDPI.description",
+                  "Maximum DPI for image processing (0 = unlimited)",
+                )}
+                value={settings.maxDPI || 0}
+                onChange={(value) =>
+                  setSettings({ ...settings, maxDPI: Number(value) })
+                }
+                min={0}
+                max={3000}
+                disabled={!loginEnabled}
+              />
+            </div>
+
+            {/* Tessdata Directory */}
+            <div>
+              <TextInput
+                label={
+                  <Group gap="xs">
+                    <span>
+                      {t(
+                        "admin.settings.advanced.tessdataDir.label",
+                        "Tessdata Directory",
+                      )}
+                    </span>
+                    <PendingBadge show={isFieldPending("tessdataDir")} />
+                  </Group>
+                }
+                description={t(
+                  "admin.settings.advanced.tessdataDir.description",
+                  "Path to the directory containing Tessdata files for OCR",
+                )}
+                value={settings.tessdataDir || ""}
+                onChange={(e) =>
+                  setSettings({ ...settings, tessdataDir: e.target.value })
+                }
+                placeholder="/usr/share/tessdata"
+                disabled={!loginEnabled}
+              />
+              {tessdataLanguagesLoading ? (
+                <Group gap="xs" mt={6}>
+                  <Loader size="xs" />
+                  <Text size="xs">
                     {t(
-                      'admin.settings.advanced.tessdataDir.manualLinks',
-                      'Manual downloads: click the links and place the files into the tessdata folder.'
+                      "admin.settings.advanced.tessdataDir.loadingLanguages",
+                      "Loading installed tessdata languages...",
                     )}
                   </Text>
-                  <Stack gap={4}>
-                    {manualDownloadLinks.map((link) => (
-                      <a key={link} href={link} target="_blank" rel="noreferrer" style={{ fontSize: '12px' }}>
-                        {link}
-                      </a>
-                    ))}
-                  </Stack>
-                </Stack>
+                </Group>
+              ) : (
+                <Text size="xs" c="dimmed" mt={6}>
+                  {tessdataLanguages.length > 0
+                    ? `${t("admin.settings.advanced.tessdataDir.installedLanguages", "Installed tessdata languages")}: ${tessdataLanguages.join(", ")}`
+                    : t(
+                        "admin.settings.advanced.tessdataDir.noLanguages",
+                        "No tessdata languages found in the configured directory",
+                      )}
+                </Text>
               )}
-              <Group justify="flex-end">
-                <Button
-                  size="xs"
-                  variant="light"
-                  onClick={handleDownloadTessdataLanguages}
-                  loading={downloadLanguagesLoading}
-                  disabled={!loginEnabled || remoteTessdataLanguages.length === 0}
-                >
-                  {t('admin.settings.advanced.tessdataDir.downloadButton', 'Download selected languages')}
-                </Button>
+              <Stack gap="xs" mt="sm">
+                <MultiSelect
+                  label={t(
+                    "admin.settings.advanced.tessdataDir.downloadLabel",
+                    "Download additional tessdata languages",
+                  )}
+                  placeholder={t(
+                    "admin.settings.advanced.tessdataDir.downloadPlaceholder",
+                    "Select languages",
+                  )}
+                  data={remoteTessdataLanguages.map((lang) => ({
+                    value: lang,
+                    label: lang,
+                  }))}
+                  searchable
+                  disabled={
+                    !loginEnabled || remoteTessdataLanguages.length === 0
+                  }
+                  value={selectedDownloadLanguages}
+                  onChange={setSelectedDownloadLanguages}
+                  comboboxProps={{
+                    withinPortal: true,
+                    zIndex: Z_INDEX_OVER_CONFIG_MODAL,
+                  }}
+                  nothingFoundMessage={t(
+                    "admin.settings.advanced.tessdataDir.downloadNothingFound",
+                    "No additional languages found",
+                  )}
+                />
+                {!tessdataDirWritable && (
+                  <Text size="xs" c="yellow.4">
+                    {t(
+                      "admin.settings.advanced.tessdataDir.permissionNotice",
+                      "The tessdata path is not writable. Downloads will be opened in the browser; please save the .traineddata files manually into the tessdata folder.",
+                    )}
+                  </Text>
+                )}
+                {!tessdataDirWritable && manualDownloadLinks.length > 0 && (
+                  <Stack gap="xs">
+                    <Text size="xs" c="dimmed">
+                      {t(
+                        "admin.settings.advanced.tessdataDir.manualLinks",
+                        "Manual downloads: click the links and place the files into the tessdata folder.",
+                      )}
+                    </Text>
+                    <Stack gap={4}>
+                      {manualDownloadLinks.map((link) => (
+                        <a
+                          key={link}
+                          href={link}
+                          target="_blank"
+                          rel="noreferrer"
+                          style={{ fontSize: "12px" }}
+                        >
+                          {link}
+                        </a>
+                      ))}
+                    </Stack>
+                  </Stack>
+                )}
+                <Group justify="flex-end">
+                  <Button
+                    size="xs"
+                    variant="light"
+                    onClick={handleDownloadTessdataLanguages}
+                    loading={downloadLanguagesLoading}
+                    disabled={
+                      !loginEnabled || remoteTessdataLanguages.length === 0
+                    }
+                  >
+                    {t(
+                      "admin.settings.advanced.tessdataDir.downloadButton",
+                      "Download selected languages",
+                    )}
+                  </Button>
+                </Group>
+              </Stack>
+            </div>
+          </Stack>
+        </Paper>
+
+        {/* Temp File Management */}
+        <Paper withBorder p="md" radius="md">
+          <Stack gap="md">
+            <div>
+              <Text fw={600} size="sm" mb="xs">
+                {t(
+                  "admin.settings.advanced.tempFileManagement.label",
+                  "Temp File Management",
+                )}
+              </Text>
+              <Text size="xs" c="dimmed">
+                {t(
+                  "admin.settings.advanced.tempFileManagement.description",
+                  "Configure temporary file storage and cleanup behavior",
+                )}
+              </Text>
+            </div>
+
+            <div>
+              <TextInput
+                label={t(
+                  "admin.settings.advanced.tempFileManagement.baseTmpDir.label",
+                  "Base Temp Directory",
+                )}
+                description={t(
+                  "admin.settings.advanced.tempFileManagement.baseTmpDir.description",
+                  "Base directory for temporary files (leave empty for default: java.io.tmpdir/stirling-pdf)",
+                )}
+                value={settings.tempFileManagement?.baseTmpDir || ""}
+                onChange={(e) =>
+                  setSettings({
+                    ...settings,
+                    tempFileManagement: {
+                      ...settings.tempFileManagement,
+                      baseTmpDir: e.target.value,
+                    },
+                  })
+                }
+                placeholder="Default: java.io.tmpdir/stirling-pdf"
+                disabled={!loginEnabled}
+              />
+            </div>
+
+            <div>
+              <TextInput
+                label={t(
+                  "admin.settings.advanced.tempFileManagement.libreofficeDir.label",
+                  "LibreOffice Temp Directory",
+                )}
+                description={t(
+                  "admin.settings.advanced.tempFileManagement.libreofficeDir.description",
+                  "Directory for LibreOffice temp files (leave empty for default: baseTmpDir/libreoffice)",
+                )}
+                value={settings.tempFileManagement?.libreofficeDir || ""}
+                onChange={(e) =>
+                  setSettings({
+                    ...settings,
+                    tempFileManagement: {
+                      ...settings.tempFileManagement,
+                      libreofficeDir: e.target.value,
+                    },
+                  })
+                }
+                placeholder="Default: baseTmpDir/libreoffice"
+                disabled={!loginEnabled}
+              />
+            </div>
+
+            <div>
+              <TextInput
+                label={t(
+                  "admin.settings.advanced.tempFileManagement.systemTempDir.label",
+                  "System Temp Directory",
+                )}
+                description={t(
+                  "admin.settings.advanced.tempFileManagement.systemTempDir.description",
+                  "System temp directory to clean (only used if cleanupSystemTemp is enabled)",
+                )}
+                value={settings.tempFileManagement?.systemTempDir || ""}
+                onChange={(e) =>
+                  setSettings({
+                    ...settings,
+                    tempFileManagement: {
+                      ...settings.tempFileManagement,
+                      systemTempDir: e.target.value,
+                    },
+                  })
+                }
+                placeholder="System temp directory path"
+                disabled={!loginEnabled}
+              />
+            </div>
+
+            <div>
+              <TextInput
+                label={t(
+                  "admin.settings.advanced.tempFileManagement.prefix.label",
+                  "Temp File Prefix",
+                )}
+                description={t(
+                  "admin.settings.advanced.tempFileManagement.prefix.description",
+                  "Prefix for temp file names",
+                )}
+                value={settings.tempFileManagement?.prefix || "stirling-pdf-"}
+                onChange={(e) =>
+                  setSettings({
+                    ...settings,
+                    tempFileManagement: {
+                      ...settings.tempFileManagement,
+                      prefix: e.target.value,
+                    },
+                  })
+                }
+                placeholder="stirling-pdf-"
+                disabled={!loginEnabled}
+              />
+            </div>
+
+            <div>
+              <NumberInput
+                label={t(
+                  "admin.settings.advanced.tempFileManagement.maxAgeHours.label",
+                  "Max Age (hours)",
+                )}
+                description={t(
+                  "admin.settings.advanced.tempFileManagement.maxAgeHours.description",
+                  "Maximum age in hours before temp files are cleaned up",
+                )}
+                value={settings.tempFileManagement?.maxAgeHours ?? 24}
+                onChange={(value) =>
+                  setSettings({
+                    ...settings,
+                    tempFileManagement: {
+                      ...settings.tempFileManagement,
+                      maxAgeHours: Number(value),
+                    },
+                  })
+                }
+                min={1}
+                max={720}
+                disabled={!loginEnabled}
+              />
+            </div>
+
+            <div>
+              <NumberInput
+                label={t(
+                  "admin.settings.advanced.tempFileManagement.cleanupIntervalMinutes.label",
+                  "Cleanup Interval (minutes)",
+                )}
+                description={t(
+                  "admin.settings.advanced.tempFileManagement.cleanupIntervalMinutes.description",
+                  "How often to run cleanup (in minutes)",
+                )}
+                value={
+                  settings.tempFileManagement?.cleanupIntervalMinutes ?? 30
+                }
+                onChange={(value) =>
+                  setSettings({
+                    ...settings,
+                    tempFileManagement: {
+                      ...settings.tempFileManagement,
+                      cleanupIntervalMinutes: Number(value),
+                    },
+                  })
+                }
+                min={1}
+                max={1440}
+                disabled={!loginEnabled}
+              />
+            </div>
+
+            <div
+              style={{
+                display: "flex",
+                alignItems: "center",
+                justifyContent: "space-between",
+              }}
+            >
+              <div>
+                <Text fw={500} size="sm">
+                  {t(
+                    "admin.settings.advanced.tempFileManagement.startupCleanup.label",
+                    "Startup Cleanup",
+                  )}
+                </Text>
+                <Text size="xs" c="dimmed" mt={4}>
+                  {t(
+                    "admin.settings.advanced.tempFileManagement.startupCleanup.description",
+                    "Clean up old temp files on application startup",
+                  )}
+                </Text>
+              </div>
+              <Group gap="xs">
+                <Switch
+                  checked={settings.tempFileManagement?.startupCleanup ?? true}
+                  onChange={(e) => {
+                    if (!loginEnabled) return;
+                    setSettings({
+                      ...settings,
+                      tempFileManagement: {
+                        ...settings.tempFileManagement,
+                        startupCleanup: e.target.checked,
+                      },
+                    });
+                  }}
+                  disabled={!loginEnabled}
+                  styles={getDisabledStyles()}
+                />
+                <PendingBadge
+                  show={isFieldPending("tempFileManagement.startupCleanup")}
+                />
               </Group>
-            </Stack>
-          </div>
-        </Stack>
-      </Paper>
+            </div>
 
-      {/* Temp File Management */}
-      <Paper withBorder p="md" radius="md">
-        <Stack gap="md">
-          <div>
-            <Text fw={600} size="sm" mb="xs">{t('admin.settings.advanced.tempFileManagement.label', 'Temp File Management')}</Text>
-            <Text size="xs" c="dimmed">
-              {t('admin.settings.advanced.tempFileManagement.description', 'Configure temporary file storage and cleanup behavior')}
+            <div
+              style={{
+                display: "flex",
+                alignItems: "center",
+                justifyContent: "space-between",
+              }}
+            >
+              <div>
+                <Text fw={500} size="sm">
+                  {t(
+                    "admin.settings.advanced.tempFileManagement.cleanupSystemTemp.label",
+                    "Cleanup System Temp",
+                  )}
+                </Text>
+                <Text size="xs" c="dimmed" mt={4}>
+                  {t(
+                    "admin.settings.advanced.tempFileManagement.cleanupSystemTemp.description",
+                    "Whether to clean broader system temp directory (use with caution)",
+                  )}
+                </Text>
+              </div>
+              <Group gap="xs">
+                <Switch
+                  checked={
+                    settings.tempFileManagement?.cleanupSystemTemp ?? false
+                  }
+                  onChange={(e) => {
+                    if (!loginEnabled) return;
+                    setSettings({
+                      ...settings,
+                      tempFileManagement: {
+                        ...settings.tempFileManagement,
+                        cleanupSystemTemp: e.target.checked,
+                      },
+                    });
+                  }}
+                  disabled={!loginEnabled}
+                  styles={getDisabledStyles()}
+                />
+                <PendingBadge
+                  show={isFieldPending("tempFileManagement.cleanupSystemTemp")}
+                />
+              </Group>
+            </div>
+          </Stack>
+        </Paper>
+
+        {/* Process Executor Limits */}
+        <Paper withBorder p="md" radius="md">
+          <Stack gap="md">
+            <Text fw={600} size="sm">
+              {t(
+                "admin.settings.advanced.processExecutor.label",
+                "Process Executor Limits",
+              )}
+            </Text>
+            <Text size="xs" c="dimmed">
+              {t(
+                "admin.settings.advanced.processExecutor.description",
+                "Configure session limits and timeouts for each process executor",
+              )}
             </Text>
-          </div>
 
-          <div>
-            <TextInput
-              label={t('admin.settings.advanced.tempFileManagement.baseTmpDir.label', 'Base Temp Directory')}
-              description={t('admin.settings.advanced.tempFileManagement.baseTmpDir.description', 'Base directory for temporary files (leave empty for default: java.io.tmpdir/stirling-pdf)')}
-              value={settings.tempFileManagement?.baseTmpDir || ''}
-              onChange={(e) => setSettings({
-                ...settings,
-                tempFileManagement: { ...settings.tempFileManagement, baseTmpDir: e.target.value }
-              })}
-              placeholder="Default: java.io.tmpdir/stirling-pdf"
-              disabled={!loginEnabled}
-            />
-          </div>
+            <Accordion variant="separated">
+              {/* LibreOffice */}
+              <Accordion.Item value="libreOffice">
+                <Accordion.Control>
+                  {t(
+                    "admin.settings.advanced.processExecutor.libreOffice",
+                    "LibreOffice",
+                  )}
+                </Accordion.Control>
+                <Accordion.Panel>
+                  <Stack gap="sm">
+                    <NumberInput
+                      label={t(
+                        "admin.settings.advanced.processExecutor.sessionLimit.label",
+                        "Session Limit",
+                      )}
+                      description={t(
+                        "admin.settings.advanced.processExecutor.sessionLimit.description",
+                        "Maximum concurrent instances",
+                      )}
+                      value={
+                        settings.processExecutor?.sessionLimit
+                          ?.libreOfficeSessionLimit ?? 1
+                      }
+                      onChange={(value) =>
+                        setSettings({
+                          ...settings,
+                          processExecutor: {
+                            ...settings.processExecutor,
+                            sessionLimit: {
+                              ...settings.processExecutor?.sessionLimit,
+                              libreOfficeSessionLimit: Number(value),
+                            },
+                          },
+                        })
+                      }
+                      min={1}
+                      max={100}
+                      disabled={!loginEnabled}
+                    />
+                    <NumberInput
+                      label={t(
+                        "admin.settings.advanced.processExecutor.timeout.label",
+                        "Timeout (minutes)",
+                      )}
+                      description={t(
+                        "admin.settings.advanced.processExecutor.timeout.description",
+                        "Maximum execution time",
+                      )}
+                      value={
+                        settings.processExecutor?.timeoutMinutes
+                          ?.libreOfficetimeoutMinutes ?? 30
+                      }
+                      onChange={(value) =>
+                        setSettings({
+                          ...settings,
+                          processExecutor: {
+                            ...settings.processExecutor,
+                            timeoutMinutes: {
+                              ...settings.processExecutor?.timeoutMinutes,
+                              libreOfficetimeoutMinutes: Number(value),
+                            },
+                          },
+                        })
+                      }
+                      min={1}
+                      max={240}
+                      disabled={!loginEnabled}
+                    />
+                  </Stack>
+                </Accordion.Panel>
+              </Accordion.Item>
 
-          <div>
-            <TextInput
-              label={t('admin.settings.advanced.tempFileManagement.libreofficeDir.label', 'LibreOffice Temp Directory')}
-              description={t('admin.settings.advanced.tempFileManagement.libreofficeDir.description', 'Directory for LibreOffice temp files (leave empty for default: baseTmpDir/libreoffice)')}
-              value={settings.tempFileManagement?.libreofficeDir || ''}
-              onChange={(e) => setSettings({
-                ...settings,
-                tempFileManagement: { ...settings.tempFileManagement, libreofficeDir: e.target.value }
-              })}
-              placeholder="Default: baseTmpDir/libreoffice"
-              disabled={!loginEnabled}
-            />
-          </div>
+              {/* PDF to HTML */}
+              <Accordion.Item value="pdfToHtml">
+                <Accordion.Control>
+                  {t(
+                    "admin.settings.advanced.processExecutor.pdfToHtml",
+                    "PDF to HTML",
+                  )}
+                </Accordion.Control>
+                <Accordion.Panel>
+                  <Stack gap="sm">
+                    <NumberInput
+                      label={t(
+                        "admin.settings.advanced.processExecutor.sessionLimit.label",
+                        "Session Limit",
+                      )}
+                      description={t(
+                        "admin.settings.advanced.processExecutor.sessionLimit.description",
+                        "Maximum concurrent instances",
+                      )}
+                      value={
+                        settings.processExecutor?.sessionLimit
+                          ?.pdfToHtmlSessionLimit ?? 1
+                      }
+                      onChange={(value) =>
+                        setSettings({
+                          ...settings,
+                          processExecutor: {
+                            ...settings.processExecutor,
+                            sessionLimit: {
+                              ...settings.processExecutor?.sessionLimit,
+                              pdfToHtmlSessionLimit: Number(value),
+                            },
+                          },
+                        })
+                      }
+                      min={1}
+                      max={100}
+                      disabled={!loginEnabled}
+                    />
+                    <NumberInput
+                      label={t(
+                        "admin.settings.advanced.processExecutor.timeout.label",
+                        "Timeout (minutes)",
+                      )}
+                      description={t(
+                        "admin.settings.advanced.processExecutor.timeout.description",
+                        "Maximum execution time",
+                      )}
+                      value={
+                        settings.processExecutor?.timeoutMinutes
+                          ?.pdfToHtmltimeoutMinutes ?? 20
+                      }
+                      onChange={(value) =>
+                        setSettings({
+                          ...settings,
+                          processExecutor: {
+                            ...settings.processExecutor,
+                            timeoutMinutes: {
+                              ...settings.processExecutor?.timeoutMinutes,
+                              pdfToHtmltimeoutMinutes: Number(value),
+                            },
+                          },
+                        })
+                      }
+                      min={1}
+                      max={240}
+                      disabled={!loginEnabled}
+                    />
+                  </Stack>
+                </Accordion.Panel>
+              </Accordion.Item>
 
-          <div>
-            <TextInput
-              label={t('admin.settings.advanced.tempFileManagement.systemTempDir.label', 'System Temp Directory')}
-              description={t('admin.settings.advanced.tempFileManagement.systemTempDir.description', 'System temp directory to clean (only used if cleanupSystemTemp is enabled)')}
-              value={settings.tempFileManagement?.systemTempDir || ''}
-              onChange={(e) => setSettings({
-                ...settings,
-                tempFileManagement: { ...settings.tempFileManagement, systemTempDir: e.target.value }
-              })}
-              placeholder="System temp directory path"
-              disabled={!loginEnabled}
-            />
-          </div>
+              {/* QPDF */}
+              <Accordion.Item value="qpdf">
+                <Accordion.Control>
+                  {t("admin.settings.advanced.processExecutor.qpdf", "QPDF")}
+                </Accordion.Control>
+                <Accordion.Panel>
+                  <Stack gap="sm">
+                    <NumberInput
+                      label={t(
+                        "admin.settings.advanced.processExecutor.sessionLimit.label",
+                        "Session Limit",
+                      )}
+                      description={t(
+                        "admin.settings.advanced.processExecutor.sessionLimit.description",
+                        "Maximum concurrent instances",
+                      )}
+                      value={
+                        settings.processExecutor?.sessionLimit
+                          ?.qpdfSessionLimit ?? 4
+                      }
+                      onChange={(value) =>
+                        setSettings({
+                          ...settings,
+                          processExecutor: {
+                            ...settings.processExecutor,
+                            sessionLimit: {
+                              ...settings.processExecutor?.sessionLimit,
+                              qpdfSessionLimit: Number(value),
+                            },
+                          },
+                        })
+                      }
+                      min={1}
+                      max={100}
+                      disabled={!loginEnabled}
+                    />
+                    <NumberInput
+                      label={t(
+                        "admin.settings.advanced.processExecutor.timeout.label",
+                        "Timeout (minutes)",
+                      )}
+                      description={t(
+                        "admin.settings.advanced.processExecutor.timeout.description",
+                        "Maximum execution time",
+                      )}
+                      value={
+                        settings.processExecutor?.timeoutMinutes
+                          ?.qpdfTimeoutMinutes ?? 30
+                      }
+                      onChange={(value) =>
+                        setSettings({
+                          ...settings,
+                          processExecutor: {
+                            ...settings.processExecutor,
+                            timeoutMinutes: {
+                              ...settings.processExecutor?.timeoutMinutes,
+                              qpdfTimeoutMinutes: Number(value),
+                            },
+                          },
+                        })
+                      }
+                      min={1}
+                      max={240}
+                      disabled={!loginEnabled}
+                    />
+                  </Stack>
+                </Accordion.Panel>
+              </Accordion.Item>
 
-          <div>
-            <TextInput
-              label={t('admin.settings.advanced.tempFileManagement.prefix.label', 'Temp File Prefix')}
-              description={t('admin.settings.advanced.tempFileManagement.prefix.description', 'Prefix for temp file names')}
-              value={settings.tempFileManagement?.prefix || 'stirling-pdf-'}
-              onChange={(e) => setSettings({
-                ...settings,
-                tempFileManagement: { ...settings.tempFileManagement, prefix: e.target.value }
-              })}
-              placeholder="stirling-pdf-"
-              disabled={!loginEnabled}
-            />
-          </div>
+              {/* Tesseract OCR */}
+              <Accordion.Item value="tesseract">
+                <Accordion.Control>
+                  {t(
+                    "admin.settings.advanced.processExecutor.tesseract",
+                    "Tesseract OCR",
+                  )}
+                </Accordion.Control>
+                <Accordion.Panel>
+                  <Stack gap="sm">
+                    <NumberInput
+                      label={t(
+                        "admin.settings.advanced.processExecutor.sessionLimit.label",
+                        "Session Limit",
+                      )}
+                      description={t(
+                        "admin.settings.advanced.processExecutor.sessionLimit.description",
+                        "Maximum concurrent instances",
+                      )}
+                      value={
+                        settings.processExecutor?.sessionLimit
+                          ?.tesseractSessionLimit ?? 1
+                      }
+                      onChange={(value) =>
+                        setSettings({
+                          ...settings,
+                          processExecutor: {
+                            ...settings.processExecutor,
+                            sessionLimit: {
+                              ...settings.processExecutor?.sessionLimit,
+                              tesseractSessionLimit: Number(value),
+                            },
+                          },
+                        })
+                      }
+                      min={1}
+                      max={100}
+                      disabled={!loginEnabled}
+                    />
+                    <NumberInput
+                      label={t(
+                        "admin.settings.advanced.processExecutor.timeout.label",
+                        "Timeout (minutes)",
+                      )}
+                      description={t(
+                        "admin.settings.advanced.processExecutor.timeout.description",
+                        "Maximum execution time",
+                      )}
+                      value={
+                        settings.processExecutor?.timeoutMinutes
+                          ?.tesseractTimeoutMinutes ?? 30
+                      }
+                      onChange={(value) =>
+                        setSettings({
+                          ...settings,
+                          processExecutor: {
+                            ...settings.processExecutor,
+                            timeoutMinutes: {
+                              ...settings.processExecutor?.timeoutMinutes,
+                              tesseractTimeoutMinutes: Number(value),
+                            },
+                          },
+                        })
+                      }
+                      min={1}
+                      max={240}
+                      disabled={!loginEnabled}
+                    />
+                  </Stack>
+                </Accordion.Panel>
+              </Accordion.Item>
 
-          <div>
-            <NumberInput
-              label={t('admin.settings.advanced.tempFileManagement.maxAgeHours.label', 'Max Age (hours)')}
-              description={t('admin.settings.advanced.tempFileManagement.maxAgeHours.description', 'Maximum age in hours before temp files are cleaned up')}
-              value={settings.tempFileManagement?.maxAgeHours ?? 24}
-              onChange={(value) => setSettings({
-                ...settings,
-                tempFileManagement: { ...settings.tempFileManagement, maxAgeHours: Number(value) }
-              })}
-              min={1}
-              max={720}
-              disabled={!loginEnabled}
-            />
-          </div>
+              {/* Python OpenCV */}
+              <Accordion.Item value="pythonOpenCv">
+                <Accordion.Control>
+                  {t(
+                    "admin.settings.advanced.processExecutor.pythonOpenCv",
+                    "Python OpenCV",
+                  )}
+                </Accordion.Control>
+                <Accordion.Panel>
+                  <Stack gap="sm">
+                    <NumberInput
+                      label={t(
+                        "admin.settings.advanced.processExecutor.sessionLimit.label",
+                        "Session Limit",
+                      )}
+                      description={t(
+                        "admin.settings.advanced.processExecutor.sessionLimit.description",
+                        "Maximum concurrent instances",
+                      )}
+                      value={
+                        settings.processExecutor?.sessionLimit
+                          ?.pythonOpenCvSessionLimit ?? 8
+                      }
+                      onChange={(value) =>
+                        setSettings({
+                          ...settings,
+                          processExecutor: {
+                            ...settings.processExecutor,
+                            sessionLimit: {
+                              ...settings.processExecutor?.sessionLimit,
+                              pythonOpenCvSessionLimit: Number(value),
+                            },
+                          },
+                        })
+                      }
+                      min={1}
+                      max={100}
+                      disabled={!loginEnabled}
+                    />
+                    <NumberInput
+                      label={t(
+                        "admin.settings.advanced.processExecutor.timeout.label",
+                        "Timeout (minutes)",
+                      )}
+                      description={t(
+                        "admin.settings.advanced.processExecutor.timeout.description",
+                        "Maximum execution time",
+                      )}
+                      value={
+                        settings.processExecutor?.timeoutMinutes
+                          ?.pythonOpenCvtimeoutMinutes ?? 30
+                      }
+                      onChange={(value) =>
+                        setSettings({
+                          ...settings,
+                          processExecutor: {
+                            ...settings.processExecutor,
+                            timeoutMinutes: {
+                              ...settings.processExecutor?.timeoutMinutes,
+                              pythonOpenCvtimeoutMinutes: Number(value),
+                            },
+                          },
+                        })
+                      }
+                      min={1}
+                      max={240}
+                      disabled={!loginEnabled}
+                    />
+                  </Stack>
+                </Accordion.Panel>
+              </Accordion.Item>
 
-          <div>
-            <NumberInput
-              label={t('admin.settings.advanced.tempFileManagement.cleanupIntervalMinutes.label', 'Cleanup Interval (minutes)')}
-              description={t('admin.settings.advanced.tempFileManagement.cleanupIntervalMinutes.description', 'How often to run cleanup (in minutes)')}
-              value={settings.tempFileManagement?.cleanupIntervalMinutes ?? 30}
-              onChange={(value) => setSettings({
-                ...settings,
-                tempFileManagement: { ...settings.tempFileManagement, cleanupIntervalMinutes: Number(value) }
-              })}
-              min={1}
-              max={1440}
-              disabled={!loginEnabled}
-            />
-          </div>
+              {/* WeasyPrint */}
+              <Accordion.Item value="weasyPrint">
+                <Accordion.Control>
+                  {t(
+                    "admin.settings.advanced.processExecutor.weasyPrint",
+                    "WeasyPrint",
+                  )}
+                </Accordion.Control>
+                <Accordion.Panel>
+                  <Stack gap="sm">
+                    <NumberInput
+                      label={t(
+                        "admin.settings.advanced.processExecutor.sessionLimit.label",
+                        "Session Limit",
+                      )}
+                      description={t(
+                        "admin.settings.advanced.processExecutor.sessionLimit.description",
+                        "Maximum concurrent instances",
+                      )}
+                      value={
+                        settings.processExecutor?.sessionLimit
+                          ?.weasyPrintSessionLimit ?? 16
+                      }
+                      onChange={(value) =>
+                        setSettings({
+                          ...settings,
+                          processExecutor: {
+                            ...settings.processExecutor,
+                            sessionLimit: {
+                              ...settings.processExecutor?.sessionLimit,
+                              weasyPrintSessionLimit: Number(value),
+                            },
+                          },
+                        })
+                      }
+                      min={1}
+                      max={100}
+                      disabled={!loginEnabled}
+                    />
+                    <NumberInput
+                      label={t(
+                        "admin.settings.advanced.processExecutor.timeout.label",
+                        "Timeout (minutes)",
+                      )}
+                      description={t(
+                        "admin.settings.advanced.processExecutor.timeout.description",
+                        "Maximum execution time",
+                      )}
+                      value={
+                        settings.processExecutor?.timeoutMinutes
+                          ?.weasyPrinttimeoutMinutes ?? 30
+                      }
+                      onChange={(value) =>
+                        setSettings({
+                          ...settings,
+                          processExecutor: {
+                            ...settings.processExecutor,
+                            timeoutMinutes: {
+                              ...settings.processExecutor?.timeoutMinutes,
+                              weasyPrinttimeoutMinutes: Number(value),
+                            },
+                          },
+                        })
+                      }
+                      min={1}
+                      max={240}
+                      disabled={!loginEnabled}
+                    />
+                  </Stack>
+                </Accordion.Panel>
+              </Accordion.Item>
 
-          <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}>
-            <div>
-              <Text fw={500} size="sm">{t('admin.settings.advanced.tempFileManagement.startupCleanup.label', 'Startup Cleanup')}</Text>
-              <Text size="xs" c="dimmed" mt={4}>
-                {t('admin.settings.advanced.tempFileManagement.startupCleanup.description', 'Clean up old temp files on application startup')}
-              </Text>
-            </div>
-            <Group gap="xs">
-              <Switch
-                checked={settings.tempFileManagement?.startupCleanup ?? true}
-                onChange={(e) => {
-                  if (!loginEnabled) return;
-                  setSettings({
-                    ...settings,
-                    tempFileManagement: { ...settings.tempFileManagement, startupCleanup: e.target.checked }
-                  });
-                }}
-                disabled={!loginEnabled}
-                styles={getDisabledStyles()}
-              />
-              <PendingBadge show={isFieldPending('tempFileManagement.startupCleanup')} />
-            </Group>
-          </div>
+              {/* Install App */}
+              <Accordion.Item value="installApp">
+                <Accordion.Control>
+                  {t(
+                    "admin.settings.advanced.processExecutor.installApp",
+                    "Install App",
+                  )}
+                </Accordion.Control>
+                <Accordion.Panel>
+                  <Stack gap="sm">
+                    <NumberInput
+                      label={t(
+                        "admin.settings.advanced.processExecutor.sessionLimit.label",
+                        "Session Limit",
+                      )}
+                      description={t(
+                        "admin.settings.advanced.processExecutor.sessionLimit.description",
+                        "Maximum concurrent instances",
+                      )}
+                      value={
+                        settings.processExecutor?.sessionLimit
+                          ?.installAppSessionLimit ?? 1
+                      }
+                      onChange={(value) =>
+                        setSettings({
+                          ...settings,
+                          processExecutor: {
+                            ...settings.processExecutor,
+                            sessionLimit: {
+                              ...settings.processExecutor?.sessionLimit,
+                              installAppSessionLimit: Number(value),
+                            },
+                          },
+                        })
+                      }
+                      min={1}
+                      max={100}
+                      disabled={!loginEnabled}
+                    />
+                    <NumberInput
+                      label={t(
+                        "admin.settings.advanced.processExecutor.timeout.label",
+                        "Timeout (minutes)",
+                      )}
+                      description={t(
+                        "admin.settings.advanced.processExecutor.timeout.description",
+                        "Maximum execution time",
+                      )}
+                      value={
+                        settings.processExecutor?.timeoutMinutes
+                          ?.installApptimeoutMinutes ?? 60
+                      }
+                      onChange={(value) =>
+                        setSettings({
+                          ...settings,
+                          processExecutor: {
+                            ...settings.processExecutor,
+                            timeoutMinutes: {
+                              ...settings.processExecutor?.timeoutMinutes,
+                              installApptimeoutMinutes: Number(value),
+                            },
+                          },
+                        })
+                      }
+                      min={1}
+                      max={240}
+                      disabled={!loginEnabled}
+                    />
+                  </Stack>
+                </Accordion.Panel>
+              </Accordion.Item>
 
-          <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}>
-            <div>
-              <Text fw={500} size="sm">{t('admin.settings.advanced.tempFileManagement.cleanupSystemTemp.label', 'Cleanup System Temp')}</Text>
-              <Text size="xs" c="dimmed" mt={4}>
-                {t('admin.settings.advanced.tempFileManagement.cleanupSystemTemp.description', 'Whether to clean broader system temp directory (use with caution)')}
-              </Text>
-            </div>
-            <Group gap="xs">
-              <Switch
-                checked={settings.tempFileManagement?.cleanupSystemTemp ?? false}
-                onChange={(e) => {
-                  if (!loginEnabled) return;
-                  setSettings({
-                    ...settings,
-                    tempFileManagement: { ...settings.tempFileManagement, cleanupSystemTemp: e.target.checked }
-                  });
-                }}
-                disabled={!loginEnabled}
-                styles={getDisabledStyles()}
-              />
-              <PendingBadge show={isFieldPending('tempFileManagement.cleanupSystemTemp')} />
-            </Group>
-          </div>
-        </Stack>
-      </Paper>
+              {/* Calibre */}
+              <Accordion.Item value="calibre">
+                <Accordion.Control>
+                  {t(
+                    "admin.settings.advanced.processExecutor.calibre",
+                    "Calibre",
+                  )}
+                </Accordion.Control>
+                <Accordion.Panel>
+                  <Stack gap="sm">
+                    <NumberInput
+                      label={t(
+                        "admin.settings.advanced.processExecutor.sessionLimit.label",
+                        "Session Limit",
+                      )}
+                      description={t(
+                        "admin.settings.advanced.processExecutor.sessionLimit.description",
+                        "Maximum concurrent instances",
+                      )}
+                      value={
+                        settings.processExecutor?.sessionLimit
+                          ?.calibreSessionLimit ?? 1
+                      }
+                      onChange={(value) =>
+                        setSettings({
+                          ...settings,
+                          processExecutor: {
+                            ...settings.processExecutor,
+                            sessionLimit: {
+                              ...settings.processExecutor?.sessionLimit,
+                              calibreSessionLimit: Number(value),
+                            },
+                          },
+                        })
+                      }
+                      min={1}
+                      max={100}
+                      disabled={!loginEnabled}
+                    />
+                    <NumberInput
+                      label={t(
+                        "admin.settings.advanced.processExecutor.timeout.label",
+                        "Timeout (minutes)",
+                      )}
+                      description={t(
+                        "admin.settings.advanced.processExecutor.timeout.description",
+                        "Maximum execution time",
+                      )}
+                      value={
+                        settings.processExecutor?.timeoutMinutes
+                          ?.calibretimeoutMinutes ?? 30
+                      }
+                      onChange={(value) =>
+                        setSettings({
+                          ...settings,
+                          processExecutor: {
+                            ...settings.processExecutor,
+                            timeoutMinutes: {
+                              ...settings.processExecutor?.timeoutMinutes,
+                              calibretimeoutMinutes: Number(value),
+                            },
+                          },
+                        })
+                      }
+                      min={1}
+                      max={240}
+                      disabled={!loginEnabled}
+                    />
+                  </Stack>
+                </Accordion.Panel>
+              </Accordion.Item>
 
-      {/* Process Executor Limits */}
-      <Paper withBorder p="md" radius="md">
-        <Stack gap="md">
-          <Text fw={600} size="sm">{t('admin.settings.advanced.processExecutor.label', 'Process Executor Limits')}</Text>
-          <Text size="xs" c="dimmed">
-            {t('admin.settings.advanced.processExecutor.description', 'Configure session limits and timeouts for each process executor')}
-          </Text>
+              {/* Ghostscript */}
+              <Accordion.Item value="ghostscript">
+                <Accordion.Control>
+                  {t(
+                    "admin.settings.advanced.processExecutor.ghostscript",
+                    "Ghostscript",
+                  )}
+                </Accordion.Control>
+                <Accordion.Panel>
+                  <Stack gap="sm">
+                    <NumberInput
+                      label={t(
+                        "admin.settings.advanced.processExecutor.sessionLimit.label",
+                        "Session Limit",
+                      )}
+                      description={t(
+                        "admin.settings.advanced.processExecutor.sessionLimit.description",
+                        "Maximum concurrent instances",
+                      )}
+                      value={
+                        settings.processExecutor?.sessionLimit
+                          ?.ghostscriptSessionLimit ?? 8
+                      }
+                      onChange={(value) =>
+                        setSettings({
+                          ...settings,
+                          processExecutor: {
+                            ...settings.processExecutor,
+                            sessionLimit: {
+                              ...settings.processExecutor?.sessionLimit,
+                              ghostscriptSessionLimit: Number(value),
+                            },
+                          },
+                        })
+                      }
+                      min={1}
+                      max={100}
+                      disabled={!loginEnabled}
+                    />
+                    <NumberInput
+                      label={t(
+                        "admin.settings.advanced.processExecutor.timeout.label",
+                        "Timeout (minutes)",
+                      )}
+                      description={t(
+                        "admin.settings.advanced.processExecutor.timeout.description",
+                        "Maximum execution time",
+                      )}
+                      value={
+                        settings.processExecutor?.timeoutMinutes
+                          ?.ghostscriptTimeoutMinutes ?? 30
+                      }
+                      onChange={(value) =>
+                        setSettings({
+                          ...settings,
+                          processExecutor: {
+                            ...settings.processExecutor,
+                            timeoutMinutes: {
+                              ...settings.processExecutor?.timeoutMinutes,
+                              ghostscriptTimeoutMinutes: Number(value),
+                            },
+                          },
+                        })
+                      }
+                      min={1}
+                      max={240}
+                      disabled={!loginEnabled}
+                    />
+                  </Stack>
+                </Accordion.Panel>
+              </Accordion.Item>
 
-          <Accordion variant="separated">
-            {/* LibreOffice */}
-            <Accordion.Item value="libreOffice">
-              <Accordion.Control>{t('admin.settings.advanced.processExecutor.libreOffice', 'LibreOffice')}</Accordion.Control>
-              <Accordion.Panel>
-                <Stack gap="sm">
-                  <NumberInput
-                    label={t('admin.settings.advanced.processExecutor.sessionLimit.label', 'Session Limit')}
-                    description={t('admin.settings.advanced.processExecutor.sessionLimit.description', 'Maximum concurrent instances')}
-                    value={settings.processExecutor?.sessionLimit?.libreOfficeSessionLimit ?? 1}
-                    onChange={(value) => setSettings({
-                      ...settings,
-                      processExecutor: {
-                        ...settings.processExecutor,
-                        sessionLimit: { ...settings.processExecutor?.sessionLimit, libreOfficeSessionLimit: Number(value) }
+              {/* OCRmyPDF */}
+              <Accordion.Item value="ocrMyPdf">
+                <Accordion.Control>
+                  {t(
+                    "admin.settings.advanced.processExecutor.ocrMyPdf",
+                    "OCRmyPDF",
+                  )}
+                </Accordion.Control>
+                <Accordion.Panel>
+                  <Stack gap="sm">
+                    <NumberInput
+                      label={t(
+                        "admin.settings.advanced.processExecutor.sessionLimit.label",
+                        "Session Limit",
+                      )}
+                      description={t(
+                        "admin.settings.advanced.processExecutor.sessionLimit.description",
+                        "Maximum concurrent instances",
+                      )}
+                      value={
+                        settings.processExecutor?.sessionLimit
+                          ?.ocrMyPdfSessionLimit ?? 2
                       }
-                    })}
-                    min={1}
-                    max={100}
-                    disabled={!loginEnabled}
-                  />
-                  <NumberInput
-                    label={t('admin.settings.advanced.processExecutor.timeout.label', 'Timeout (minutes)')}
-                    description={t('admin.settings.advanced.processExecutor.timeout.description', 'Maximum execution time')}
-                    value={settings.processExecutor?.timeoutMinutes?.libreOfficetimeoutMinutes ?? 30}
-                    onChange={(value) => setSettings({
-                      ...settings,
-                      processExecutor: {
-                        ...settings.processExecutor,
-                        timeoutMinutes: { ...settings.processExecutor?.timeoutMinutes, libreOfficetimeoutMinutes: Number(value) }
+                      onChange={(value) =>
+                        setSettings({
+                          ...settings,
+                          processExecutor: {
+                            ...settings.processExecutor,
+                            sessionLimit: {
+                              ...settings.processExecutor?.sessionLimit,
+                              ocrMyPdfSessionLimit: Number(value),
+                            },
+                          },
+                        })
                       }
-                    })}
-                    min={1}
-                    max={240}
-                    disabled={!loginEnabled}
-                  />
-                </Stack>
-              </Accordion.Panel>
-            </Accordion.Item>
-
-            {/* PDF to HTML */}
-            <Accordion.Item value="pdfToHtml">
-              <Accordion.Control>{t('admin.settings.advanced.processExecutor.pdfToHtml', 'PDF to HTML')}</Accordion.Control>
-              <Accordion.Panel>
-                <Stack gap="sm">
-                  <NumberInput
-                    label={t('admin.settings.advanced.processExecutor.sessionLimit.label', 'Session Limit')}
-                    description={t('admin.settings.advanced.processExecutor.sessionLimit.description', 'Maximum concurrent instances')}
-                    value={settings.processExecutor?.sessionLimit?.pdfToHtmlSessionLimit ?? 1}
-                    onChange={(value) => setSettings({
-                      ...settings,
-                      processExecutor: {
-                        ...settings.processExecutor,
-                        sessionLimit: { ...settings.processExecutor?.sessionLimit, pdfToHtmlSessionLimit: Number(value) }
+                      min={1}
+                      max={100}
+                      disabled={!loginEnabled}
+                    />
+                    <NumberInput
+                      label={t(
+                        "admin.settings.advanced.processExecutor.timeout.label",
+                        "Timeout (minutes)",
+                      )}
+                      description={t(
+                        "admin.settings.advanced.processExecutor.timeout.description",
+                        "Maximum execution time",
+                      )}
+                      value={
+                        settings.processExecutor?.timeoutMinutes
+                          ?.ocrMyPdfTimeoutMinutes ?? 30
                       }
-                    })}
-                    min={1}
-                    max={100}
-                    disabled={!loginEnabled}
-                  />
-                  <NumberInput
-                    label={t('admin.settings.advanced.processExecutor.timeout.label', 'Timeout (minutes)')}
-                    description={t('admin.settings.advanced.processExecutor.timeout.description', 'Maximum execution time')}
-                    value={settings.processExecutor?.timeoutMinutes?.pdfToHtmltimeoutMinutes ?? 20}
-                    onChange={(value) => setSettings({
-                      ...settings,
-                      processExecutor: {
-                        ...settings.processExecutor,
-                        timeoutMinutes: { ...settings.processExecutor?.timeoutMinutes, pdfToHtmltimeoutMinutes: Number(value) }
+                      onChange={(value) =>
+                        setSettings({
+                          ...settings,
+                          processExecutor: {
+                            ...settings.processExecutor,
+                            timeoutMinutes: {
+                              ...settings.processExecutor?.timeoutMinutes,
+                              ocrMyPdfTimeoutMinutes: Number(value),
+                            },
+                          },
+                        })
                       }
-                    })}
-                    min={1}
-                    max={240}
-                    disabled={!loginEnabled}
-                  />
-                </Stack>
-              </Accordion.Panel>
-            </Accordion.Item>
-
-            {/* QPDF */}
-            <Accordion.Item value="qpdf">
-              <Accordion.Control>{t('admin.settings.advanced.processExecutor.qpdf', 'QPDF')}</Accordion.Control>
-              <Accordion.Panel>
-                <Stack gap="sm">
-                  <NumberInput
-                    label={t('admin.settings.advanced.processExecutor.sessionLimit.label', 'Session Limit')}
-                    description={t('admin.settings.advanced.processExecutor.sessionLimit.description', 'Maximum concurrent instances')}
-                    value={settings.processExecutor?.sessionLimit?.qpdfSessionLimit ?? 4}
-                    onChange={(value) => setSettings({
-                      ...settings,
-                      processExecutor: {
-                        ...settings.processExecutor,
-                        sessionLimit: { ...settings.processExecutor?.sessionLimit, qpdfSessionLimit: Number(value) }
-                      }
-                    })}
-                    min={1}
-                    max={100}
-                    disabled={!loginEnabled}
-                  />
-                  <NumberInput
-                    label={t('admin.settings.advanced.processExecutor.timeout.label', 'Timeout (minutes)')}
-                    description={t('admin.settings.advanced.processExecutor.timeout.description', 'Maximum execution time')}
-                    value={settings.processExecutor?.timeoutMinutes?.qpdfTimeoutMinutes ?? 30}
-                    onChange={(value) => setSettings({
-                      ...settings,
-                      processExecutor: {
-                        ...settings.processExecutor,
-                        timeoutMinutes: { ...settings.processExecutor?.timeoutMinutes, qpdfTimeoutMinutes: Number(value) }
-                      }
-                    })}
-                    min={1}
-                    max={240}
-                    disabled={!loginEnabled}
-                  />
-                </Stack>
-              </Accordion.Panel>
-            </Accordion.Item>
-
-            {/* Tesseract OCR */}
-            <Accordion.Item value="tesseract">
-              <Accordion.Control>{t('admin.settings.advanced.processExecutor.tesseract', 'Tesseract OCR')}</Accordion.Control>
-              <Accordion.Panel>
-                <Stack gap="sm">
-                  <NumberInput
-                    label={t('admin.settings.advanced.processExecutor.sessionLimit.label', 'Session Limit')}
-                    description={t('admin.settings.advanced.processExecutor.sessionLimit.description', 'Maximum concurrent instances')}
-                    value={settings.processExecutor?.sessionLimit?.tesseractSessionLimit ?? 1}
-                    onChange={(value) => setSettings({
-                      ...settings,
-                      processExecutor: {
-                        ...settings.processExecutor,
-                        sessionLimit: { ...settings.processExecutor?.sessionLimit, tesseractSessionLimit: Number(value) }
-                      }
-                    })}
-                    min={1}
-                    max={100}
-                    disabled={!loginEnabled}
-                  />
-                  <NumberInput
-                    label={t('admin.settings.advanced.processExecutor.timeout.label', 'Timeout (minutes)')}
-                    description={t('admin.settings.advanced.processExecutor.timeout.description', 'Maximum execution time')}
-                    value={settings.processExecutor?.timeoutMinutes?.tesseractTimeoutMinutes ?? 30}
-                    onChange={(value) => setSettings({
-                      ...settings,
-                      processExecutor: {
-                        ...settings.processExecutor,
-                        timeoutMinutes: { ...settings.processExecutor?.timeoutMinutes, tesseractTimeoutMinutes: Number(value) }
-                      }
-                    })}
-                    min={1}
-                    max={240}
-                    disabled={!loginEnabled}
-                  />
-                </Stack>
-              </Accordion.Panel>
-            </Accordion.Item>
-
-            {/* Python OpenCV */}
-            <Accordion.Item value="pythonOpenCv">
-              <Accordion.Control>{t('admin.settings.advanced.processExecutor.pythonOpenCv', 'Python OpenCV')}</Accordion.Control>
-              <Accordion.Panel>
-                <Stack gap="sm">
-                  <NumberInput
-                    label={t('admin.settings.advanced.processExecutor.sessionLimit.label', 'Session Limit')}
-                    description={t('admin.settings.advanced.processExecutor.sessionLimit.description', 'Maximum concurrent instances')}
-                    value={settings.processExecutor?.sessionLimit?.pythonOpenCvSessionLimit ?? 8}
-                    onChange={(value) => setSettings({
-                      ...settings,
-                      processExecutor: {
-                        ...settings.processExecutor,
-                        sessionLimit: { ...settings.processExecutor?.sessionLimit, pythonOpenCvSessionLimit: Number(value) }
-                      }
-                    })}
-                    min={1}
-                    max={100}
-                    disabled={!loginEnabled}
-                  />
-                  <NumberInput
-                    label={t('admin.settings.advanced.processExecutor.timeout.label', 'Timeout (minutes)')}
-                    description={t('admin.settings.advanced.processExecutor.timeout.description', 'Maximum execution time')}
-                    value={settings.processExecutor?.timeoutMinutes?.pythonOpenCvtimeoutMinutes ?? 30}
-                    onChange={(value) => setSettings({
-                      ...settings,
-                      processExecutor: {
-                        ...settings.processExecutor,
-                        timeoutMinutes: { ...settings.processExecutor?.timeoutMinutes, pythonOpenCvtimeoutMinutes: Number(value) }
-                      }
-                    })}
-                    min={1}
-                    max={240}
-                    disabled={!loginEnabled}
-                  />
-                </Stack>
-              </Accordion.Panel>
-            </Accordion.Item>
-
-            {/* WeasyPrint */}
-            <Accordion.Item value="weasyPrint">
-              <Accordion.Control>{t('admin.settings.advanced.processExecutor.weasyPrint', 'WeasyPrint')}</Accordion.Control>
-              <Accordion.Panel>
-                <Stack gap="sm">
-                  <NumberInput
-                    label={t('admin.settings.advanced.processExecutor.sessionLimit.label', 'Session Limit')}
-                    description={t('admin.settings.advanced.processExecutor.sessionLimit.description', 'Maximum concurrent instances')}
-                    value={settings.processExecutor?.sessionLimit?.weasyPrintSessionLimit ?? 16}
-                    onChange={(value) => setSettings({
-                      ...settings,
-                      processExecutor: {
-                        ...settings.processExecutor,
-                        sessionLimit: { ...settings.processExecutor?.sessionLimit, weasyPrintSessionLimit: Number(value) }
-                      }
-                    })}
-                    min={1}
-                    max={100}
-                    disabled={!loginEnabled}
-                  />
-                  <NumberInput
-                    label={t('admin.settings.advanced.processExecutor.timeout.label', 'Timeout (minutes)')}
-                    description={t('admin.settings.advanced.processExecutor.timeout.description', 'Maximum execution time')}
-                    value={settings.processExecutor?.timeoutMinutes?.weasyPrinttimeoutMinutes ?? 30}
-                    onChange={(value) => setSettings({
-                      ...settings,
-                      processExecutor: {
-                        ...settings.processExecutor,
-                        timeoutMinutes: { ...settings.processExecutor?.timeoutMinutes, weasyPrinttimeoutMinutes: Number(value) }
-                      }
-                    })}
-                    min={1}
-                    max={240}
-                    disabled={!loginEnabled}
-                  />
-                </Stack>
-              </Accordion.Panel>
-            </Accordion.Item>
-
-            {/* Install App */}
-            <Accordion.Item value="installApp">
-              <Accordion.Control>{t('admin.settings.advanced.processExecutor.installApp', 'Install App')}</Accordion.Control>
-              <Accordion.Panel>
-                <Stack gap="sm">
-                  <NumberInput
-                    label={t('admin.settings.advanced.processExecutor.sessionLimit.label', 'Session Limit')}
-                    description={t('admin.settings.advanced.processExecutor.sessionLimit.description', 'Maximum concurrent instances')}
-                    value={settings.processExecutor?.sessionLimit?.installAppSessionLimit ?? 1}
-                    onChange={(value) => setSettings({
-                      ...settings,
-                      processExecutor: {
-                        ...settings.processExecutor,
-                        sessionLimit: { ...settings.processExecutor?.sessionLimit, installAppSessionLimit: Number(value) }
-                      }
-                    })}
-                    min={1}
-                    max={100}
-                    disabled={!loginEnabled}
-                  />
-                  <NumberInput
-                    label={t('admin.settings.advanced.processExecutor.timeout.label', 'Timeout (minutes)')}
-                    description={t('admin.settings.advanced.processExecutor.timeout.description', 'Maximum execution time')}
-                    value={settings.processExecutor?.timeoutMinutes?.installApptimeoutMinutes ?? 60}
-                    onChange={(value) => setSettings({
-                      ...settings,
-                      processExecutor: {
-                        ...settings.processExecutor,
-                        timeoutMinutes: { ...settings.processExecutor?.timeoutMinutes, installApptimeoutMinutes: Number(value) }
-                      }
-                    })}
-                    min={1}
-                    max={240}
-                    disabled={!loginEnabled}
-                  />
-                </Stack>
-              </Accordion.Panel>
-            </Accordion.Item>
-
-            {/* Calibre */}
-            <Accordion.Item value="calibre">
-              <Accordion.Control>{t('admin.settings.advanced.processExecutor.calibre', 'Calibre')}</Accordion.Control>
-              <Accordion.Panel>
-                <Stack gap="sm">
-                  <NumberInput
-                    label={t('admin.settings.advanced.processExecutor.sessionLimit.label', 'Session Limit')}
-                    description={t('admin.settings.advanced.processExecutor.sessionLimit.description', 'Maximum concurrent instances')}
-                    value={settings.processExecutor?.sessionLimit?.calibreSessionLimit ?? 1}
-                    onChange={(value) => setSettings({
-                      ...settings,
-                      processExecutor: {
-                        ...settings.processExecutor,
-                        sessionLimit: { ...settings.processExecutor?.sessionLimit, calibreSessionLimit: Number(value) }
-                      }
-                    })}
-                    min={1}
-                    max={100}
-                    disabled={!loginEnabled}
-                  />
-                  <NumberInput
-                    label={t('admin.settings.advanced.processExecutor.timeout.label', 'Timeout (minutes)')}
-                    description={t('admin.settings.advanced.processExecutor.timeout.description', 'Maximum execution time')}
-                    value={settings.processExecutor?.timeoutMinutes?.calibretimeoutMinutes ?? 30}
-                    onChange={(value) => setSettings({
-                      ...settings,
-                      processExecutor: {
-                        ...settings.processExecutor,
-                        timeoutMinutes: { ...settings.processExecutor?.timeoutMinutes, calibretimeoutMinutes: Number(value) }
-                      }
-                    })}
-                    min={1}
-                    max={240}
-                    disabled={!loginEnabled}
-                  />
-                </Stack>
-              </Accordion.Panel>
-            </Accordion.Item>
-
-            {/* Ghostscript */}
-            <Accordion.Item value="ghostscript">
-              <Accordion.Control>{t('admin.settings.advanced.processExecutor.ghostscript', 'Ghostscript')}</Accordion.Control>
-              <Accordion.Panel>
-                <Stack gap="sm">
-                  <NumberInput
-                    label={t('admin.settings.advanced.processExecutor.sessionLimit.label', 'Session Limit')}
-                    description={t('admin.settings.advanced.processExecutor.sessionLimit.description', 'Maximum concurrent instances')}
-                    value={settings.processExecutor?.sessionLimit?.ghostscriptSessionLimit ?? 8}
-                    onChange={(value) => setSettings({
-                      ...settings,
-                      processExecutor: {
-                        ...settings.processExecutor,
-                        sessionLimit: { ...settings.processExecutor?.sessionLimit, ghostscriptSessionLimit: Number(value) }
-                      }
-                    })}
-                    min={1}
-                    max={100}
-                    disabled={!loginEnabled}
-                  />
-                  <NumberInput
-                    label={t('admin.settings.advanced.processExecutor.timeout.label', 'Timeout (minutes)')}
-                    description={t('admin.settings.advanced.processExecutor.timeout.description', 'Maximum execution time')}
-                    value={settings.processExecutor?.timeoutMinutes?.ghostscriptTimeoutMinutes ?? 30}
-                    onChange={(value) => setSettings({
-                      ...settings,
-                      processExecutor: {
-                        ...settings.processExecutor,
-                        timeoutMinutes: { ...settings.processExecutor?.timeoutMinutes, ghostscriptTimeoutMinutes: Number(value) }
-                      }
-                    })}
-                    min={1}
-                    max={240}
-                    disabled={!loginEnabled}
-                  />
-                </Stack>
-              </Accordion.Panel>
-            </Accordion.Item>
-
-            {/* OCRmyPDF */}
-            <Accordion.Item value="ocrMyPdf">
-              <Accordion.Control>{t('admin.settings.advanced.processExecutor.ocrMyPdf', 'OCRmyPDF')}</Accordion.Control>
-              <Accordion.Panel>
-                <Stack gap="sm">
-                  <NumberInput
-                    label={t('admin.settings.advanced.processExecutor.sessionLimit.label', 'Session Limit')}
-                    description={t('admin.settings.advanced.processExecutor.sessionLimit.description', 'Maximum concurrent instances')}
-                    value={settings.processExecutor?.sessionLimit?.ocrMyPdfSessionLimit ?? 2}
-                    onChange={(value) => setSettings({
-                      ...settings,
-                      processExecutor: {
-                        ...settings.processExecutor,
-                        sessionLimit: { ...settings.processExecutor?.sessionLimit, ocrMyPdfSessionLimit: Number(value) }
-                      }
-                    })}
-                    min={1}
-                    max={100}
-                    disabled={!loginEnabled}
-                  />
-                  <NumberInput
-                    label={t('admin.settings.advanced.processExecutor.timeout.label', 'Timeout (minutes)')}
-                    description={t('admin.settings.advanced.processExecutor.timeout.description', 'Maximum execution time')}
-                    value={settings.processExecutor?.timeoutMinutes?.ocrMyPdfTimeoutMinutes ?? 30}
-                    onChange={(value) => setSettings({
-                      ...settings,
-                      processExecutor: {
-                        ...settings.processExecutor,
-                        timeoutMinutes: { ...settings.processExecutor?.timeoutMinutes, ocrMyPdfTimeoutMinutes: Number(value) }
-                      }
-                    })}
-                    min={1}
-                    max={240}
-                    disabled={!loginEnabled}
-                  />
-                </Stack>
-              </Accordion.Panel>
-            </Accordion.Item>
-          </Accordion>
-        </Stack>
-      </Paper>
-
+                      min={1}
+                      max={240}
+                      disabled={!loginEnabled}
+                    />
+                  </Stack>
+                </Accordion.Panel>
+              </Accordion.Item>
+            </Accordion>
+          </Stack>
+        </Paper>
       </Stack>
 
       <SettingsStickyFooter
diff --git a/frontend/src/proprietary/components/shared/config/configSections/AdminAuditSection.tsx b/frontend/src/proprietary/components/shared/config/configSections/AdminAuditSection.tsx
index 53939a45cb..9558a35570 100644
--- a/frontend/src/proprietary/components/shared/config/configSections/AdminAuditSection.tsx
+++ b/frontend/src/proprietary/components/shared/config/configSections/AdminAuditSection.tsx
@@ -1,32 +1,45 @@
-import React, { useState, useEffect } from 'react';
-import { Tabs, Loader, Alert, Stack, Text, Button, Accordion } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { useNavigate } from 'react-router-dom';
-import auditService, { AuditSystemStatus as AuditStatus } from '@app/services/auditService';
-import AuditSystemStatus from '@app/components/shared/config/configSections/audit/AuditSystemStatus';
-import AuditStatsCards from '@app/components/shared/config/configSections/audit/AuditStatsCards';
-import AuditChartsSection from '@app/components/shared/config/configSections/audit/AuditChartsSection';
-import AuditEventsTable from '@app/components/shared/config/configSections/audit/AuditEventsTable';
-import AuditExportSection from '@app/components/shared/config/configSections/audit/AuditExportSection';
-import AuditClearDataSection from '@app/components/shared/config/configSections/audit/AuditClearDataSection';
-import { useLoginRequired } from '@app/hooks/useLoginRequired';
-import LoginRequiredBanner from '@app/components/shared/config/LoginRequiredBanner';
-import { useAppConfig } from '@app/contexts/AppConfigContext';
-import EnterpriseRequiredBanner from '@app/components/shared/config/EnterpriseRequiredBanner';
-import LocalIcon from '@app/components/shared/LocalIcon';
+import React, { useState, useEffect } from "react";
+import { isAxiosError } from "axios";
+import {
+  Tabs,
+  Loader,
+  Alert,
+  Stack,
+  Text,
+  Button,
+  Accordion,
+} from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import { useNavigate } from "react-router-dom";
+import auditService, {
+  AuditSystemStatus as AuditStatus,
+} from "@app/services/auditService";
+import AuditSystemStatus from "@app/components/shared/config/configSections/audit/AuditSystemStatus";
+import AuditStatsCards from "@app/components/shared/config/configSections/audit/AuditStatsCards";
+import AuditChartsSection from "@app/components/shared/config/configSections/audit/AuditChartsSection";
+import AuditEventsTable from "@app/components/shared/config/configSections/audit/AuditEventsTable";
+import AuditExportSection from "@app/components/shared/config/configSections/audit/AuditExportSection";
+import AuditClearDataSection from "@app/components/shared/config/configSections/audit/AuditClearDataSection";
+import { useLoginRequired } from "@app/hooks/useLoginRequired";
+import LoginRequiredBanner from "@app/components/shared/config/LoginRequiredBanner";
+import { useAppConfig } from "@app/contexts/AppConfigContext";
+import EnterpriseRequiredBanner from "@app/components/shared/config/EnterpriseRequiredBanner";
+import LocalIcon from "@app/components/shared/LocalIcon";
 
 const AdminAuditSection: React.FC = () => {
   const { t } = useTranslation();
   const navigate = useNavigate();
   const { loginEnabled } = useLoginRequired();
   const { config } = useAppConfig();
-  const licenseType = config?.license ?? 'NORMAL';
-  const hasEnterpriseLicense = licenseType === 'ENTERPRISE';
+  const licenseType = config?.license ?? "NORMAL";
+  const hasEnterpriseLicense = licenseType === "ENTERPRISE";
   const showDemoData = !loginEnabled || !hasEnterpriseLicense;
   const [systemStatus, setSystemStatus] = useState<AuditStatus | null>(null);
   const [loading, setLoading] = useState(true);
   const [error, setError] = useState<string | null>(null);
-  const [timePeriod, setTimePeriod] = useState<'day' | 'week' | 'month'>('week');
+  const [timePeriod, setTimePeriod] = useState<"day" | "week" | "month">(
+    "week",
+  );
 
   useEffect(() => {
     const fetchSystemStatus = async () => {
@@ -35,13 +48,17 @@ const AdminAuditSection: React.FC = () => {
         setError(null);
         const status = await auditService.getSystemStatus();
         setSystemStatus(status);
-      } catch (err: any) {
+      } catch (err: unknown) {
         // Check if this is a permission/license error (403/404)
-        const status = err?.response?.status;
+        const status = isAxiosError(err) ? err.response?.status : undefined;
         if (status === 403 || status === 404) {
-          setError('enterprise-license-required');
+          setError("enterprise-license-required");
         } else {
-          setError(err instanceof Error ? err.message : 'Failed to load audit system status');
+          setError(
+            err instanceof Error
+              ? err.message
+              : "Failed to load audit system status",
+          );
         }
       } finally {
         setLoading(false);
@@ -55,7 +72,7 @@ const AdminAuditSection: React.FC = () => {
       setError(null);
       setSystemStatus({
         enabled: true,
-        level: 'INFO',
+        level: "INFO",
         retentionDays: 90,
         totalEvents: 1234,
         pdfMetadataEnabled: true,
@@ -72,25 +89,38 @@ const AdminAuditSection: React.FC = () => {
 
   if (actualLoading) {
     return (
-      <div style={{ display: 'flex', justifyContent: 'center', alignItems: 'center', padding: '2rem 0' }}>
+      <div
+        style={{
+          display: "flex",
+          justifyContent: "center",
+          alignItems: "center",
+          padding: "2rem 0",
+        }}
+      >
         <Loader size="lg" />
       </div>
     );
   }
 
   if (error) {
-    if (error === 'enterprise-license-required') {
+    if (error === "enterprise-license-required") {
       return (
-        <Alert color="blue" title={t('audit.enterpriseRequired', 'Enterprise License Required')}>
+        <Alert
+          color="blue"
+          title={t("audit.enterpriseRequired", "Enterprise License Required")}
+        >
           {t(
-            'audit.enterpriseRequiredMessage',
-            'The audit logging system is an enterprise feature. Please upgrade to an enterprise license to access audit logs and analytics.'
+            "audit.enterpriseRequiredMessage",
+            "The audit logging system is an enterprise feature. Please upgrade to an enterprise license to access audit logs and analytics.",
           )}
         </Alert>
       );
     }
     return (
-      <Alert color="red" title={t('audit.error.title', 'Error loading audit system')}>
+      <Alert
+        color="red"
+        title={t("audit.error.title", "Error loading audit system")}
+      >
         {error}
       </Alert>
     );
@@ -98,8 +128,14 @@ const AdminAuditSection: React.FC = () => {
 
   if (!systemStatus) {
     return (
-      <Alert color="yellow" title={t('audit.notAvailable', 'Audit system not available')}>
-        {t('audit.notAvailableMessage', 'The audit system is not configured or not available.')}
+      <Alert
+        color="yellow"
+        title={t("audit.notAvailable", "Audit system not available")}
+      >
+        {t(
+          "audit.notAvailableMessage",
+          "The audit system is not configured or not available.",
+        )}
       </Alert>
     );
   }
@@ -111,31 +147,37 @@ const AdminAuditSection: React.FC = () => {
       <LoginRequiredBanner show={!loginEnabled} />
       <EnterpriseRequiredBanner
         show={!hasEnterpriseLicense}
-        featureName={t('settings.licensingAnalytics.audit', 'Audit')}
+        featureName={t("settings.licensingAnalytics.audit", "Audit")}
       />
 
       {/* Info banner about audit settings */}
       {isEnabled && (
         <Alert
           icon={<LocalIcon icon="info" width="1.2rem" height="1.2rem" />}
-          title={t('audit.configureAudit', 'Configure Audit Logging')}
+          title={t("audit.configureAudit", "Configure Audit Logging")}
           color="blue"
           variant="light"
         >
           <Stack gap="xs">
             <Text size="sm">
               {t(
-                'audit.configureAuditMessage',
-                'Adjust audit logging level, retention period, and other settings in the Security & Authentication section.'
+                "audit.configureAuditMessage",
+                "Adjust audit logging level, retention period, and other settings in the Security & Authentication section.",
               )}
             </Text>
             <Button
               variant="light"
               size="xs"
-              onClick={() => navigate('/settings/adminSecurity#auditLogging')}
-              rightSection={<LocalIcon icon="arrow-forward" width="0.9rem" height="0.9rem" />}
+              onClick={() => navigate("/settings/adminSecurity#auditLogging")}
+              rightSection={
+                <LocalIcon
+                  icon="arrow-forward"
+                  width="0.9rem"
+                  height="0.9rem"
+                />
+              }
             >
-              {t('audit.goToSettings', 'Go to Audit Settings')}
+              {t("audit.goToSettings", "Go to Audit Settings")}
             </Button>
           </Stack>
         </Alert>
@@ -147,29 +189,32 @@ const AdminAuditSection: React.FC = () => {
         <Tabs defaultValue="dashboard">
           <Tabs.List>
             <Tabs.Tab value="dashboard" disabled={!isEnabled}>
-              {t('audit.tabs.dashboard', 'Dashboard')}
+              {t("audit.tabs.dashboard", "Dashboard")}
             </Tabs.Tab>
             <Tabs.Tab value="events" disabled={!isEnabled}>
-              {t('audit.tabs.events', 'Audit Events')}
+              {t("audit.tabs.events", "Audit Events")}
             </Tabs.Tab>
             <Tabs.Tab value="export" disabled={!isEnabled}>
-              {t('audit.tabs.export', 'Export')}
+              {t("audit.tabs.export", "Export")}
             </Tabs.Tab>
             <Tabs.Tab value="clearData" disabled={!isEnabled}>
-              {t('audit.tabs.clearData', 'Clear Data')}
+              {t("audit.tabs.clearData", "Clear Data")}
             </Tabs.Tab>
           </Tabs.List>
 
           <Tabs.Panel value="dashboard" pt="md">
             <Stack gap="lg">
               {/* Stats Cards - Always Visible */}
-              <AuditStatsCards loginEnabled={isEnabled} timePeriod={timePeriod} />
+              <AuditStatsCards
+                loginEnabled={isEnabled}
+                timePeriod={timePeriod}
+              />
 
               {/* Charts in Accordion - Collapsible */}
               <Accordion defaultValue={["events-over-time"]} multiple>
                 <Accordion.Item value="events-over-time">
                   <Accordion.Control>
-                    {t('audit.charts.overTime', 'Events Over Time')}
+                    {t("audit.charts.overTime", "Events Over Time")}
                   </Accordion.Control>
                   <Accordion.Panel>
                     <AuditChartsSection
@@ -205,10 +250,13 @@ const AdminAuditSection: React.FC = () => {
           </Tabs.Panel>
         </Tabs>
       ) : (
-        <Alert color="blue" title={t('audit.disabled', 'Audit logging is disabled')}>
+        <Alert
+          color="blue"
+          title={t("audit.disabled", "Audit logging is disabled")}
+        >
           {t(
-            'audit.disabledMessage',
-            'Enable audit logging in your application configuration to track system events.'
+            "audit.disabledMessage",
+            "Enable audit logging in your application configuration to track system events.",
           )}
         </Alert>
       )}
diff --git a/frontend/src/proprietary/components/shared/config/configSections/AdminConnectionsSection.tsx b/frontend/src/proprietary/components/shared/config/configSections/AdminConnectionsSection.tsx
index f3cec6a1c7..671a7c0a8f 100644
--- a/frontend/src/proprietary/components/shared/config/configSections/AdminConnectionsSection.tsx
+++ b/frontend/src/proprietary/components/shared/config/configSections/AdminConnectionsSection.tsx
@@ -1,21 +1,36 @@
-import { useCallback, useEffect } from 'react';
-import { useTranslation } from 'react-i18next';
-import { useNavigate } from 'react-router-dom';
-import { Stack, Text, Loader, Group, Divider, Paper, Switch, Badge, Anchor, Select, Collapse } from '@mantine/core';
-import { alert } from '@app/components/toast';
-import LocalIcon from '@app/components/shared/LocalIcon';
-import RestartConfirmationModal from '@app/components/shared/config/RestartConfirmationModal';
-import { useRestartServer } from '@app/components/shared/config/useRestartServer';
-import { useAdminSettings } from '@app/hooks/useAdminSettings';
-import { useSettingsDirty } from '@app/hooks/useSettingsDirty';
-import PendingBadge from '@app/components/shared/config/PendingBadge';
-import { SettingsStickyFooter } from '@app/components/shared/config/SettingsStickyFooter';
-import { Z_INDEX_CONFIG_MODAL } from '@app/styles/zIndex';
-import ProviderCard from '@app/components/shared/config/configSections/ProviderCard';
-import { Provider, useAllProviders } from '@app/components/shared/config/configSections/providerDefinitions';
-import apiClient from '@app/services/apiClient';
-import { useLoginRequired } from '@app/hooks/useLoginRequired';
-import LoginRequiredBanner from '@app/components/shared/config/LoginRequiredBanner';
+import { useCallback, useEffect } from "react";
+import { useTranslation } from "react-i18next";
+import { useNavigate } from "react-router-dom";
+import {
+  Stack,
+  Text,
+  Loader,
+  Group,
+  Divider,
+  Paper,
+  Switch,
+  Badge,
+  Anchor,
+  Select,
+  Collapse,
+} from "@mantine/core";
+import { alert } from "@app/components/toast";
+import LocalIcon from "@app/components/shared/LocalIcon";
+import RestartConfirmationModal from "@app/components/shared/config/RestartConfirmationModal";
+import { useRestartServer } from "@app/components/shared/config/useRestartServer";
+import { useAdminSettings } from "@app/hooks/useAdminSettings";
+import { useSettingsDirty } from "@app/hooks/useSettingsDirty";
+import PendingBadge from "@app/components/shared/config/PendingBadge";
+import { SettingsStickyFooter } from "@app/components/shared/config/SettingsStickyFooter";
+import { Z_INDEX_CONFIG_MODAL } from "@app/styles/zIndex";
+import ProviderCard from "@app/components/shared/config/configSections/ProviderCard";
+import {
+  Provider,
+  useAllProviders,
+} from "@app/components/shared/config/configSections/providerDefinitions";
+import apiClient from "@app/services/apiClient";
+import { useLoginRequired } from "@app/hooks/useLoginRequired";
+import LoginRequiredBanner from "@app/components/shared/config/LoginRequiredBanner";
 
 interface FeedbackFlags {
   noValidDocument?: boolean;
@@ -44,6 +59,66 @@ interface TelegramSettingsData {
   feedback?: FeedbackSettings;
 }
 
+interface MailSettings {
+  enabled?: boolean;
+  enableInvites?: boolean;
+  host?: string;
+  port?: number;
+  username?: string;
+  password?: string;
+  from?: string;
+}
+
+interface GoogleDriveSettings {
+  enabled?: boolean;
+  clientId?: string;
+  apiKey?: string;
+  appId?: string;
+}
+
+interface OAuth2GenericSettings {
+  enabled?: boolean;
+  provider?: string;
+  issuer?: string;
+  clientId?: string;
+  clientSecret?: string;
+  scopes?: string;
+  useAsUsername?: string;
+  autoCreateUser?: boolean;
+  blockRegistration?: boolean;
+}
+
+interface Saml2Settings {
+  enabled?: boolean;
+  provider?: string;
+  registrationId?: string;
+  idpMetadataUri?: string;
+  idpSingleLoginUrl?: string;
+  idpSingleLogoutUrl?: string;
+  idpIssuer?: string;
+  idpCert?: string;
+  privateKey?: string;
+  spCert?: string;
+  autoCreateUser?: boolean;
+  blockRegistration?: boolean;
+}
+
+interface OAuth2ClientSettings {
+  clientId?: string;
+  clientSecret?: string;
+  scopes?: string;
+  useAsUsername?: string;
+  issuer?: string;
+}
+
+type ProviderSettings =
+  | MailSettings
+  | TelegramSettingsData
+  | GoogleDriveSettings
+  | OAuth2GenericSettings
+  | Saml2Settings
+  | OAuth2ClientSettings;
+
 interface ConnectionsSettingsData {
   oauth2?: {
     enabled?: boolean;
@@ -55,22 +130,10 @@ interface ConnectionsSettingsData {
     blockRegistration?: boolean;
     useAsUsername?: string;
     scopes?: string;
-    client?: {
-      [key: string]: any;
-    };
-  };
-  saml2?: {
-    [key: string]: any;
-  };
-  mail?: {
-    enabled?: boolean;
-    enableInvites?: boolean;
-    host?: string;
-    port?: number;
-    username?: string;
-    password?: string;
-    from?: string;
+    client?: Record<string, OAuth2ClientSettings>;
   };
+  saml2?: Saml2Settings;
+  mail?: MailSettings;
   telegram?: TelegramSettingsData;
   ssoAutoLogin?: boolean;
   enableMobileScanner?: boolean;
@@ -88,51 +151,72 @@ export default function AdminConnectionsSection() {
   const { t } = useTranslation();
   const navigate = useNavigate();
   const { loginEnabled, getDisabledStyles } = useLoginRequired();
-  const { restartModalOpened, closeRestartModal, restartServer } = useRestartServer();
+  const { restartModalOpened, closeRestartModal, restartServer } =
+    useRestartServer();
   const allProviders = useAllProviders();
 
   const adminSettings = useAdminSettings<ConnectionsSettingsData>({
-    sectionName: 'connections',
-    fetchTransformer: async (): Promise<ConnectionsSettingsData & { _pending?: Record<string, any> }> => {
+    sectionName: "connections",
+    fetchTransformer: async (): Promise<
+      ConnectionsSettingsData & { _pending?: Record<string, unknown> }
+    > => {
       // Fetch security settings (oauth2, saml2)
-      const securityResponse = await apiClient.get('/api/v1/admin/settings/section/security');
+      const securityResponse = await apiClient.get(
+        "/api/v1/admin/settings/section/security",
+      );
       const securityData = securityResponse.data || {};
 
       // Fetch mail settings
-      const mailResponse = await apiClient.get('/api/v1/admin/settings/section/mail');
+      const mailResponse = await apiClient.get(
+        "/api/v1/admin/settings/section/mail",
+      );
       const mailData = mailResponse.data || {};
 
       // Fetch premium settings for SSO Auto Login
-      const premiumResponse = await apiClient.get('/api/v1/admin/settings/section/premium');
+      const premiumResponse = await apiClient.get(
+        "/api/v1/admin/settings/section/premium",
+      );
       const premiumData = premiumResponse.data || {};
 
       // Fetch Telegram settings
-      const telegramResponse = await apiClient.get('/api/v1/admin/settings/section/telegram');
+      const telegramResponse = await apiClient.get(
+        "/api/v1/admin/settings/section/telegram",
+      );
       const telegramData = telegramResponse.data || {};
 
       // Fetch system settings for enableMobileScanner
-      const systemResponse = await apiClient.get('/api/v1/admin/settings/section/system');
+      const systemResponse = await apiClient.get(
+        "/api/v1/admin/settings/section/system",
+      );
       const systemData = systemResponse.data || {};
 
-      const result: ConnectionsSettingsData & { _pending?: Record<string, any> } = {
+      const result: ConnectionsSettingsData & {
+        _pending?: Record<string, unknown>;
+      } = {
         oauth2: securityData.oauth2 || {},
         saml2: securityData.saml2 || {},
         mail: mailData || {},
         telegram: telegramData || {},
         ssoAutoLogin: premiumData.proFeatures?.ssoAutoLogin || false,
         enableMobileScanner: systemData.enableMobileScanner || false,
-        mobileScannerConvertToPdf: systemData.mobileScannerSettings?.convertToPdf !== false,
-        mobileScannerImageResolution: systemData.mobileScannerSettings?.imageResolution || 'full',
-        mobileScannerPageFormat: systemData.mobileScannerSettings?.pageFormat || 'A4',
-        mobileScannerStretchToFit: systemData.mobileScannerSettings?.stretchToFit || false,
-        googleDriveEnabled: premiumData.proFeatures?.googleDrive?.enabled || false,
-        googleDriveClientId: premiumData.proFeatures?.googleDrive?.clientId || '',
-        googleDriveApiKey: premiumData.proFeatures?.googleDrive?.apiKey || '',
-        googleDriveAppId: premiumData.proFeatures?.googleDrive?.appId || ''
+        mobileScannerConvertToPdf:
+          systemData.mobileScannerSettings?.convertToPdf !== false,
+        mobileScannerImageResolution:
+          systemData.mobileScannerSettings?.imageResolution || "full",
+        mobileScannerPageFormat:
+          systemData.mobileScannerSettings?.pageFormat || "A4",
+        mobileScannerStretchToFit:
+          systemData.mobileScannerSettings?.stretchToFit || false,
+        googleDriveEnabled:
+          premiumData.proFeatures?.googleDrive?.enabled || false,
+        googleDriveClientId:
+          premiumData.proFeatures?.googleDrive?.clientId || "",
+        googleDriveApiKey: premiumData.proFeatures?.googleDrive?.apiKey || "",
+        googleDriveAppId: premiumData.proFeatures?.googleDrive?.appId || "",
       };
 
       // Merge pending blocks from all endpoints
-      const pendingBlock: Record<string, any> = {};
+      const pendingBlock: Record<string, unknown> = {};
       if (securityData._pending?.oauth2) {
         pendingBlock.oauth2 = securityData._pending.oauth2;
       }
@@ -146,34 +230,59 @@ export default function AdminConnectionsSection() {
         pendingBlock.telegram = telegramData._pending;
       }
       if (premiumData._pending?.proFeatures?.ssoAutoLogin !== undefined) {
-        pendingBlock.ssoAutoLogin = premiumData._pending.proFeatures.ssoAutoLogin;
+        pendingBlock.ssoAutoLogin =
+          premiumData._pending.proFeatures.ssoAutoLogin;
       }
       if (systemData._pending?.enableMobileScanner !== undefined) {
-        pendingBlock.enableMobileScanner = systemData._pending.enableMobileScanner;
+        pendingBlock.enableMobileScanner =
+          systemData._pending.enableMobileScanner;
       }
-      if (systemData._pending?.mobileScannerSettings?.convertToPdf !== undefined) {
-        pendingBlock.mobileScannerConvertToPdf = systemData._pending.mobileScannerSettings.convertToPdf;
+      if (
+        systemData._pending?.mobileScannerSettings?.convertToPdf !== undefined
+      ) {
+        pendingBlock.mobileScannerConvertToPdf =
+          systemData._pending.mobileScannerSettings.convertToPdf;
       }
-      if (systemData._pending?.mobileScannerSettings?.imageResolution !== undefined) {
-        pendingBlock.mobileScannerImageResolution = systemData._pending.mobileScannerSettings.imageResolution;
+      if (
+        systemData._pending?.mobileScannerSettings?.imageResolution !==
+        undefined
+      ) {
+        pendingBlock.mobileScannerImageResolution =
+          systemData._pending.mobileScannerSettings.imageResolution;
       }
-      if (systemData._pending?.mobileScannerSettings?.pageFormat !== undefined) {
-        pendingBlock.mobileScannerPageFormat = systemData._pending.mobileScannerSettings.pageFormat;
+      if (
+        systemData._pending?.mobileScannerSettings?.pageFormat !== undefined
+      ) {
+        pendingBlock.mobileScannerPageFormat =
+          systemData._pending.mobileScannerSettings.pageFormat;
       }
-      if (systemData._pending?.mobileScannerSettings?.stretchToFit !== undefined) {
-        pendingBlock.mobileScannerStretchToFit = systemData._pending.mobileScannerSettings.stretchToFit;
+      if (
+        systemData._pending?.mobileScannerSettings?.stretchToFit !== undefined
+      ) {
+        pendingBlock.mobileScannerStretchToFit =
+          systemData._pending.mobileScannerSettings.stretchToFit;
       }
-      if (premiumData._pending?.proFeatures?.googleDrive?.enabled !== undefined) {
-        pendingBlock.googleDriveEnabled = premiumData._pending.proFeatures.googleDrive.enabled;
+      if (
+        premiumData._pending?.proFeatures?.googleDrive?.enabled !== undefined
+      ) {
+        pendingBlock.googleDriveEnabled =
+          premiumData._pending.proFeatures.googleDrive.enabled;
       }
-      if (premiumData._pending?.proFeatures?.googleDrive?.clientId !== undefined) {
-        pendingBlock.googleDriveClientId = premiumData._pending.proFeatures.googleDrive.clientId;
+      if (
+        premiumData._pending?.proFeatures?.googleDrive?.clientId !== undefined
+      ) {
+        pendingBlock.googleDriveClientId =
+          premiumData._pending.proFeatures.googleDrive.clientId;
       }
-      if (premiumData._pending?.proFeatures?.googleDrive?.apiKey !== undefined) {
-        pendingBlock.googleDriveApiKey = premiumData._pending.proFeatures.googleDrive.apiKey;
+      if (
+        premiumData._pending?.proFeatures?.googleDrive?.apiKey !== undefined
+      ) {
+        pendingBlock.googleDriveApiKey =
+          premiumData._pending.proFeatures.googleDrive.apiKey;
       }
       if (premiumData._pending?.proFeatures?.googleDrive?.appId !== undefined) {
-        pendingBlock.googleDriveAppId = premiumData._pending.proFeatures.googleDrive.appId;
+        pendingBlock.googleDriveAppId =
+          premiumData._pending.proFeatures.googleDrive.appId;
       }
 
       if (Object.keys(pendingBlock).length > 0) {
@@ -183,13 +292,15 @@ export default function AdminConnectionsSection() {
       return result;
     },
     saveTransformer: (currentSettings: ConnectionsSettingsData) => {
-      const deltaSettings: Record<string, any> = {};
+      const deltaSettings: Record<string, unknown> = {};
 
       // Build delta for oauth2 settings
       if (currentSettings.oauth2) {
         Object.keys(currentSettings.oauth2).forEach((key) => {
-          if (key !== 'client') {
-            deltaSettings[`security.oauth2.${key}`] = (currentSettings.oauth2 as Record<string, any>)[key];
+          if (key !== "client") {
+            deltaSettings[`security.oauth2.${key}`] = (
+              currentSettings.oauth2 as Record<string, unknown>
+            )[key];
           }
         });
 
@@ -197,9 +308,13 @@ export default function AdminConnectionsSection() {
         const oauth2Client = currentSettings.oauth2.client;
         if (oauth2Client) {
           Object.keys(oauth2Client).forEach((providerId) => {
-            const providerSettings = oauth2Client[providerId];
+            const providerSettings = oauth2Client[providerId] as Record<
+              string,
+              unknown
+            >;
             Object.keys(providerSettings).forEach((key) => {
-              deltaSettings[`security.oauth2.client.${providerId}.${key}`] = providerSettings[key];
+              deltaSettings[`security.oauth2.client.${providerId}.${key}`] =
+                providerSettings[key];
             });
           });
         }
@@ -207,75 +322,83 @@ export default function AdminConnectionsSection() {
 
       // Build delta for saml2 settings
       if (currentSettings.saml2) {
-        Object.keys(currentSettings.saml2).forEach((key) => {
-          deltaSettings[`security.saml2.${key}`] = (currentSettings.saml2 as Record<string, any>)[key];
+        const saml2 = currentSettings.saml2 as Record<string, unknown>;
+        Object.keys(saml2).forEach((key) => {
+          deltaSettings[`security.saml2.${key}`] = saml2[key];
         });
       }
 
       // Mail settings
       if (currentSettings.mail) {
-        Object.keys(currentSettings.mail).forEach((key) => {
-          deltaSettings[`mail.${key}`] = (currentSettings.mail as Record<string, any>)[key];
+        const mail = currentSettings.mail as Record<string, unknown>;
+        Object.keys(mail).forEach((key) => {
+          deltaSettings[`mail.${key}`] = mail[key];
         });
       }
 
       // Telegram settings
       if (currentSettings.telegram) {
-        Object.keys(currentSettings.telegram).forEach((key) => {
-          deltaSettings[`telegram.${key}`] = (currentSettings.telegram as Record<string, any>)[key];
+        const telegram = currentSettings.telegram as Record<string, unknown>;
+        Object.keys(telegram).forEach((key) => {
+          deltaSettings[`telegram.${key}`] = telegram[key];
         });
       }
 
       // SSO Auto Login
       if (currentSettings?.ssoAutoLogin !== undefined) {
-        deltaSettings['premium.proFeatures.ssoAutoLogin'] = currentSettings.ssoAutoLogin;
+        deltaSettings["premium.proFeatures.ssoAutoLogin"] =
+          currentSettings.ssoAutoLogin;
       }
 
       // Mobile Scanner settings
       if (currentSettings?.enableMobileScanner !== undefined) {
-        deltaSettings['system.enableMobileScanner'] = currentSettings.enableMobileScanner;
+        deltaSettings["system.enableMobileScanner"] =
+          currentSettings.enableMobileScanner;
       }
       if (currentSettings?.mobileScannerConvertToPdf !== undefined) {
-        deltaSettings['system.mobileScannerSettings.convertToPdf'] = currentSettings.mobileScannerConvertToPdf;
+        deltaSettings["system.mobileScannerSettings.convertToPdf"] =
+          currentSettings.mobileScannerConvertToPdf;
       }
       if (currentSettings?.mobileScannerImageResolution !== undefined) {
-        deltaSettings['system.mobileScannerSettings.imageResolution'] = currentSettings.mobileScannerImageResolution;
+        deltaSettings["system.mobileScannerSettings.imageResolution"] =
+          currentSettings.mobileScannerImageResolution;
       }
       if (currentSettings?.mobileScannerPageFormat !== undefined) {
-        deltaSettings['system.mobileScannerSettings.pageFormat'] = currentSettings.mobileScannerPageFormat;
+        deltaSettings["system.mobileScannerSettings.pageFormat"] =
+          currentSettings.mobileScannerPageFormat;
       }
       if (currentSettings?.mobileScannerStretchToFit !== undefined) {
-        deltaSettings['system.mobileScannerSettings.stretchToFit'] = currentSettings.mobileScannerStretchToFit;
+        deltaSettings["system.mobileScannerSettings.stretchToFit"] =
+          currentSettings.mobileScannerStretchToFit;
       }
 
       // Google Drive settings
       if (currentSettings?.googleDriveEnabled !== undefined) {
-        deltaSettings['premium.proFeatures.googleDrive.enabled'] = currentSettings.googleDriveEnabled;
+        deltaSettings["premium.proFeatures.googleDrive.enabled"] =
+          currentSettings.googleDriveEnabled;
       }
       if (currentSettings?.googleDriveClientId !== undefined) {
-        deltaSettings['premium.proFeatures.googleDrive.clientId'] = currentSettings.googleDriveClientId;
+        deltaSettings["premium.proFeatures.googleDrive.clientId"] =
+          currentSettings.googleDriveClientId;
       }
       if (currentSettings?.googleDriveApiKey !== undefined) {
-        deltaSettings['premium.proFeatures.googleDrive.apiKey'] = currentSettings.googleDriveApiKey;
+        deltaSettings["premium.proFeatures.googleDrive.apiKey"] =
+          currentSettings.googleDriveApiKey;
       }
       if (currentSettings?.googleDriveAppId !== undefined) {
-        deltaSettings['premium.proFeatures.googleDrive.appId'] = currentSettings.googleDriveAppId;
+        deltaSettings["premium.proFeatures.googleDrive.appId"] =
+          currentSettings.googleDriveAppId;
       }
 
       return {
         sectionData: {},
-        deltaSettings
+        deltaSettings,
       };
-    }
+    },
   });
 
-  const {
-    settings,
-    setSettings,
-    loading,
-    fetchSettings,
-    isFieldPending,
-  } = adminSettings;
+  const { settings, setSettings, loading, fetchSettings, isFieldPending } =
+    adminSettings;
 
   useEffect(() => {
     if (loginEnabled) {
@@ -283,7 +406,10 @@ export default function AdminConnectionsSection() {
     }
   }, [loginEnabled, fetchSettings]);
 
-  const { isDirty, resetToSnapshot, markSaved } = useSettingsDirty(settings, loading);
+  const { isDirty, resetToSnapshot, markSaved } = useSettingsDirty(
+    settings,
+    loading,
+  );
 
   const handleDiscard = useCallback(() => {
     const original = resetToSnapshot();
@@ -296,9 +422,9 @@ export default function AdminConnectionsSection() {
       await adminSettings.saveSettings();
     } catch (_error) {
       alert({
-        alertType: 'error',
-        title: t('admin.error', 'Error'),
-        body: t('admin.settings.saveError', 'Failed to save settings'),
+        alertType: "error",
+        title: t("admin.error", "Error"),
+        body: t("admin.settings.saveError", "Failed to save settings"),
       });
     }
   };
@@ -307,56 +433,56 @@ export default function AdminConnectionsSection() {
   const actualLoading = loginEnabled ? loading : false;
 
   const isProviderConfigured = (provider: Provider): boolean => {
-    if (provider.id === 'saml2') {
+    if (provider.id === "saml2") {
       return settings?.saml2?.enabled === true;
     }
 
-    if (provider.id === 'smtp') {
+    if (provider.id === "smtp") {
       return settings?.mail?.enabled === true;
     }
 
-    if (provider.id === 'telegram') {
+    if (provider.id === "telegram") {
       return settings?.telegram?.enabled === true;
     }
 
-    if (provider.id === 'googledrive') {
+    if (provider.id === "googledrive") {
       return settings?.googleDriveEnabled === true;
     }
 
-    if (provider.id === 'oauth2-generic') {
+    if (provider.id === "oauth2-generic") {
       return settings?.oauth2?.enabled === true;
     }
 
     // Check if specific OAuth2 provider is configured (has clientId)
     const providerSettings = settings?.oauth2?.client?.[provider.id];
-    return !!(providerSettings?.clientId);
+    return !!providerSettings?.clientId;
   };
 
-  const getProviderSettings = (provider: Provider): Record<string, any> => {
-    if (provider.id === 'saml2') {
+  const getProviderSettings = (provider: Provider): ProviderSettings => {
+    if (provider.id === "saml2") {
       return settings?.saml2 || {};
     }
 
-    if (provider.id === 'smtp') {
+    if (provider.id === "smtp") {
       return settings?.mail || {};
     }
 
-    if (provider.id === 'telegram') {
+    if (provider.id === "telegram") {
       return settings?.telegram || {};
     }
 
-    if (provider.id === 'googledrive') {
-      return {
+    if (provider.id === "googledrive") {
+      const gd: GoogleDriveSettings = {
         enabled: settings?.googleDriveEnabled,
         clientId: settings?.googleDriveClientId,
         apiKey: settings?.googleDriveApiKey,
         appId: settings?.googleDriveAppId,
       };
+      return gd;
     }
 
-    if (provider.id === 'oauth2-generic') {
-      // Generic OAuth2 settings are at the root oauth2 level
-      return {
+    if (provider.id === "oauth2-generic") {
+      const generic: OAuth2GenericSettings = {
         enabled: settings?.oauth2?.enabled,
         provider: settings?.oauth2?.provider,
         issuer: settings?.oauth2?.issuer,
@@ -367,13 +493,13 @@ export default function AdminConnectionsSection() {
         autoCreateUser: settings?.oauth2?.autoCreateUser,
         blockRegistration: settings?.oauth2?.blockRegistration,
       };
+      return generic;
     }
 
     // Specific OAuth2 provider settings
     return settings?.oauth2?.client?.[provider.id] || {};
   };
 
-
   if (actualLoading) {
     return (
       <Stack align="center" justify="center" h={200}>
@@ -382,38 +508,48 @@ export default function AdminConnectionsSection() {
     );
   }
 
-
   const linkedProviders = allProviders.filter((p) => isProviderConfigured(p));
-  const availableProviders = allProviders.filter((p) => !isProviderConfigured(p));
+  const availableProviders = allProviders.filter(
+    (p) => !isProviderConfigured(p),
+  );
 
-  const updateProviderSettings = (provider: Provider, updatedSettings: Record<string, any>) => {
-    if (provider.id === 'smtp') {
-      setSettings({ ...settings, mail: updatedSettings });
-    } else if (provider.id === 'telegram') {
-      setSettings({ ...settings, telegram: updatedSettings });
-    } else if (provider.id === 'googledrive') {
+  const updateProviderSettings = (
+    provider: Provider,
+    updatedSettings: Record<string, unknown>,
+  ) => {
+    if (provider.id === "smtp") {
+      setSettings({ ...settings, mail: updatedSettings as MailSettings });
+    } else if (provider.id === "telegram") {
       setSettings({
         ...settings,
-        googleDriveEnabled: updatedSettings.enabled,
-        googleDriveClientId: updatedSettings.clientId,
-        googleDriveApiKey: updatedSettings.apiKey,
-        googleDriveAppId: updatedSettings.appId,
+        telegram: updatedSettings as TelegramSettingsData,
       });
-    } else if (provider.id === 'saml2') {
-      setSettings({ ...settings, saml2: updatedSettings });
-    } else if (provider.id === 'oauth2-generic') {
-      setSettings({ ...settings, oauth2: updatedSettings });
+    } else if (provider.id === "googledrive") {
+      const gd = updatedSettings as GoogleDriveSettings;
+      setSettings({
+        ...settings,
+        googleDriveEnabled: gd.enabled,
+        googleDriveClientId: gd.clientId,
+        googleDriveApiKey: gd.apiKey,
+        googleDriveAppId: gd.appId,
+      });
+    } else if (provider.id === "saml2") {
+      setSettings({ ...settings, saml2: updatedSettings as Saml2Settings });
+    } else if (provider.id === "oauth2-generic") {
+      const generic = updatedSettings as OAuth2GenericSettings;
+      setSettings({ ...settings, oauth2: { ...settings.oauth2, ...generic } });
     } else {
       // Specific OAuth2 provider
+      const clientSettings = updatedSettings as OAuth2ClientSettings;
       setSettings({
         ...settings,
         oauth2: {
           ...settings.oauth2,
           client: {
             ...settings.oauth2?.client,
-            [provider.id]: updatedSettings
-          }
-        }
+            [provider.id]: clientSettings,
+          },
+        },
       });
     }
   };
@@ -423,265 +559,428 @@ export default function AdminConnectionsSection() {
       <Stack gap="xl" className="settings-section-content">
         <LoginRequiredBanner show={!loginEnabled} />
 
-      {/* Header */}
-      <div>
-        <Text fw={600} size="lg">
-          {t('admin.settings.connections.title', 'Connections')}
-        </Text>
-        <Text size="sm" c="dimmed">
-          {t(
-            'admin.settings.connections.description',
-            'Configure external authentication providers like OAuth2 and SAML.'
-          )}
-        </Text>
-      </div>
+        {/* Header */}
+        <div>
+          <Text fw={600} size="lg">
+            {t("admin.settings.connections.title", "Connections")}
+          </Text>
+          <Text size="sm" c="dimmed">
+            {t(
+              "admin.settings.connections.description",
+              "Configure external authentication providers like OAuth2 and SAML.",
+            )}
+          </Text>
+        </div>
 
-      {/* SSO Auto Login - Premium Feature */}
-      <Paper withBorder p="md" radius="md">
-        <Stack gap="md">
-          <Group justify="space-between" align="center">
-            <Text fw={600} size="sm">{t('admin.settings.connections.ssoAutoLogin.label', 'SSO Auto Login')}</Text>
-            <Badge
-              color="grape"
-              size="sm"
-              style={{ cursor: 'pointer' }}
-              onClick={() => navigate('/settings/adminPlan')}
-              title={t('admin.settings.badge.clickToUpgrade', 'Click to view plan details')}
+        {/* SSO Auto Login - Premium Feature */}
+        <Paper withBorder p="md" radius="md">
+          <Stack gap="md">
+            <Group justify="space-between" align="center">
+              <Text fw={600} size="sm">
+                {t(
+                  "admin.settings.connections.ssoAutoLogin.label",
+                  "SSO Auto Login",
+                )}
+              </Text>
+              <Badge
+                color="grape"
+                size="sm"
+                style={{ cursor: "pointer" }}
+                onClick={() => navigate("/settings/adminPlan")}
+                title={t(
+                  "admin.settings.badge.clickToUpgrade",
+                  "Click to view plan details",
+                )}
+              >
+                PRO
+              </Badge>
+            </Group>
+
+            <div
+              style={{
+                display: "flex",
+                alignItems: "center",
+                justifyContent: "space-between",
+              }}
             >
-              PRO
-            </Badge>
-          </Group>
-
-          <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}>
-            <div>
-              <Text fw={500} size="sm">{t('admin.settings.connections.ssoAutoLogin.enable', 'Enable SSO Auto Login')}</Text>
-              <Text size="xs" c="dimmed" mt={4}>
-                {t('admin.settings.connections.ssoAutoLogin.description', 'Automatically redirect to SSO login when authentication is required')}
-              </Text>
-            </div>
-            <Group gap="xs">
-              <Switch
-                checked={settings?.ssoAutoLogin || false}
-                onChange={(e) => {
-                  if (!loginEnabled) return; // Block change when login disabled
-                  setSettings({ ...settings, ssoAutoLogin: e.target.checked });
-                }}
-                disabled={!loginEnabled}
-                styles={getDisabledStyles()}
-              />
-              <PendingBadge show={isFieldPending('ssoAutoLogin')} />
-            </Group>
-          </div>
-        </Stack>
-      </Paper>
-
-      {/* Mobile Scanner (QR Code) Upload */}
-      <Paper withBorder p="md" radius="md">
-        <Stack gap="md">
-          <Group gap="xs" align="center">
-            <LocalIcon icon="qr-code-rounded" width="1.25rem" height="1.25rem" />
-            <Text fw={600} size="sm">{t('admin.settings.connections.mobileScanner.label', 'Mobile Phone Upload')}</Text>
-          </Group>
-
-          {/* Documentation Link */}
-          <Anchor
-            href="https://docs.stirlingpdf.com/Functionality/Mobile-Scanner"
-            target="_blank"
-            size="xs"
-            c="blue"
-          >
-            {t('admin.settings.connections.documentation', 'View documentation')} ↗
-          </Anchor>
-
-          <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}>
-            <div>
-              <Text fw={500} size="sm">{t('admin.settings.connections.mobileScanner.enable', 'Enable QR Code Upload')}</Text>
-              <Text size="xs" c="dimmed" mt={4}>
-                {t('admin.settings.connections.mobileScanner.description', 'Allow users to upload files from mobile devices by scanning a QR code')}
-              </Text>
-              <Text size="xs" c="orange" mt={8} fw={500}>
-                {t('admin.settings.connections.mobileScanner.note', 'Note: Requires Frontend URL to be configured. ')}
-                <Anchor href="#" onClick={(e) => { e.preventDefault(); navigate('/settings/adminGeneral#frontendUrl'); }} c="orange" td="underline">
-                  {t('admin.settings.connections.mobileScanner.link', 'Configure in System Settings')}
-                </Anchor>
-              </Text>
-            </div>
-            <Group gap="xs">
-              <Switch
-                checked={settings?.enableMobileScanner || false}
-                onChange={(e) => {
-                  if (!loginEnabled) return; // Block change when login disabled
-                  setSettings({ ...settings, enableMobileScanner: e.target.checked });
-                }}
-                disabled={!loginEnabled}
-                styles={getDisabledStyles()}
-              />
-              <PendingBadge show={isFieldPending('enableMobileScanner')} />
-            </Group>
-          </div>
-
-          {/* Mobile Scanner Settings - Only show when enabled */}
-          <Collapse in={settings?.enableMobileScanner || false}>
-            <Stack gap="md" mt="md" ml="lg" style={{ borderLeft: '2px solid var(--mantine-color-gray-3)', paddingLeft: '1rem' }}>
-              {/* Convert to PDF */}
               <div>
-                <Text size="sm" fw={500} mb="xs">
-                  {t('admin.settings.connections.mobileScannerConvertToPdf', 'Convert Images to PDF')}
+                <Text fw={500} size="sm">
+                  {t(
+                    "admin.settings.connections.ssoAutoLogin.enable",
+                    "Enable SSO Auto Login",
+                  )}
                 </Text>
-                <Text size="xs" c="dimmed" mb="sm">
-                  {t('admin.settings.connections.mobileScannerConvertToPdfDesc', 'Automatically convert uploaded images to PDF format. If disabled, images will be kept as-is.')}
+                <Text size="xs" c="dimmed" mt={4}>
+                  {t(
+                    "admin.settings.connections.ssoAutoLogin.description",
+                    "Automatically redirect to SSO login when authentication is required",
+                  )}
                 </Text>
-                <Group gap="xs">
-                  <Switch
-                    checked={settings?.mobileScannerConvertToPdf !== false}
-                    onChange={(e) => {
-                      if (!loginEnabled) return;
-                      setSettings({ ...settings, mobileScannerConvertToPdf: e.target.checked });
+              </div>
+              <Group gap="xs">
+                <Switch
+                  checked={settings?.ssoAutoLogin || false}
+                  onChange={(e) => {
+                    if (!loginEnabled) return; // Block change when login disabled
+                    setSettings({
+                      ...settings,
+                      ssoAutoLogin: e.target.checked,
+                    });
+                  }}
+                  disabled={!loginEnabled}
+                  styles={getDisabledStyles()}
+                />
+                <PendingBadge show={isFieldPending("ssoAutoLogin")} />
+              </Group>
+            </div>
+          </Stack>
+        </Paper>
+
+        {/* Mobile Scanner (QR Code) Upload */}
+        <Paper withBorder p="md" radius="md">
+          <Stack gap="md">
+            <Group gap="xs" align="center">
+              <LocalIcon
+                icon="qr-code-rounded"
+                width="1.25rem"
+                height="1.25rem"
+              />
+              <Text fw={600} size="sm">
+                {t(
+                  "admin.settings.connections.mobileScanner.label",
+                  "Mobile Phone Upload",
+                )}
+              </Text>
+            </Group>
+
+            {/* Documentation Link */}
+            <Anchor
+              href="https://docs.stirlingpdf.com/Functionality/Mobile-Scanner"
+              target="_blank"
+              size="xs"
+              c="blue"
+            >
+              {t(
+                "admin.settings.connections.documentation",
+                "View documentation",
+              )}{" "}
+              ↗
+            </Anchor>
+
+            <div
+              style={{
+                display: "flex",
+                alignItems: "center",
+                justifyContent: "space-between",
+              }}
+            >
+              <div>
+                <Text fw={500} size="sm">
+                  {t(
+                    "admin.settings.connections.mobileScanner.enable",
+                    "Enable QR Code Upload",
+                  )}
+                </Text>
+                <Text size="xs" c="dimmed" mt={4}>
+                  {t(
+                    "admin.settings.connections.mobileScanner.description",
+                    "Allow users to upload files from mobile devices by scanning a QR code",
+                  )}
+                </Text>
+                <Text size="xs" c="orange" mt={8} fw={500}>
+                  {t(
+                    "admin.settings.connections.mobileScanner.note",
+                    "Note: Requires Frontend URL to be configured. ",
+                  )}
+                  <Anchor
+                    href="#"
+                    onClick={(e) => {
+                      e.preventDefault();
+                      navigate("/settings/adminGeneral#frontendUrl");
                     }}
+                    c="orange"
+                    td="underline"
+                  >
+                    {t(
+                      "admin.settings.connections.mobileScanner.link",
+                      "Configure in System Settings",
+                    )}
+                  </Anchor>
+                </Text>
+              </div>
+              <Group gap="xs">
+                <Switch
+                  checked={settings?.enableMobileScanner || false}
+                  onChange={(e) => {
+                    if (!loginEnabled) return; // Block change when login disabled
+                    setSettings({
+                      ...settings,
+                      enableMobileScanner: e.target.checked,
+                    });
+                  }}
+                  disabled={!loginEnabled}
+                  styles={getDisabledStyles()}
+                />
+                <PendingBadge show={isFieldPending("enableMobileScanner")} />
+              </Group>
+            </div>
+
+            {/* Mobile Scanner Settings - Only show when enabled */}
+            <Collapse in={settings?.enableMobileScanner || false}>
+              <Stack
+                gap="md"
+                mt="md"
+                ml="lg"
+                style={{
+                  borderLeft: "2px solid var(--mantine-color-gray-3)",
+                  paddingLeft: "1rem",
+                }}
+              >
+                {/* Convert to PDF */}
+                <div>
+                  <Text size="sm" fw={500} mb="xs">
+                    {t(
+                      "admin.settings.connections.mobileScannerConvertToPdf",
+                      "Convert Images to PDF",
+                    )}
+                  </Text>
+                  <Text size="xs" c="dimmed" mb="sm">
+                    {t(
+                      "admin.settings.connections.mobileScannerConvertToPdfDesc",
+                      "Automatically convert uploaded images to PDF format. If disabled, images will be kept as-is.",
+                    )}
+                  </Text>
+                  <Group gap="xs">
+                    <Switch
+                      checked={settings?.mobileScannerConvertToPdf !== false}
+                      onChange={(e) => {
+                        if (!loginEnabled) return;
+                        setSettings({
+                          ...settings,
+                          mobileScannerConvertToPdf: e.target.checked,
+                        });
+                      }}
+                      disabled={!loginEnabled}
+                    />
+                    <PendingBadge
+                      show={isFieldPending("mobileScannerConvertToPdf")}
+                    />
+                  </Group>
+                </div>
+
+                {/* PDF Conversion Settings - Only show when convertToPdf is enabled */}
+                {settings?.mobileScannerConvertToPdf !== false && (
+                  <>
+                    {/* Image Resolution */}
+                    <div>
+                      <Text size="sm" fw={500} mb="xs">
+                        {t(
+                          "admin.settings.connections.mobileScannerImageResolution",
+                          "Image Resolution",
+                        )}
+                      </Text>
+                      <Text size="xs" c="dimmed" mb="sm">
+                        {t(
+                          "admin.settings.connections.mobileScannerImageResolutionDesc",
+                          'Resolution of uploaded images. "Reduced" scales images to max 1200px to reduce file size.',
+                        )}
+                      </Text>
+                      <Group gap="xs">
+                        <Select
+                          value={
+                            settings?.mobileScannerImageResolution || "full"
+                          }
+                          onChange={(value) => {
+                            if (!loginEnabled) return;
+                            setSettings({
+                              ...settings,
+                              mobileScannerImageResolution: value || "full",
+                            });
+                          }}
+                          data={[
+                            {
+                              value: "full",
+                              label: t(
+                                "admin.settings.connections.imageResolutionFull",
+                                "Full (Original Size)",
+                              ),
+                            },
+                            {
+                              value: "reduced",
+                              label: t(
+                                "admin.settings.connections.imageResolutionReduced",
+                                "Reduced (Max 1200px)",
+                              ),
+                            },
+                          ]}
+                          disabled={!loginEnabled}
+                          style={{ width: "250px" }}
+                          comboboxProps={{ zIndex: Z_INDEX_CONFIG_MODAL }}
+                        />
+                        <PendingBadge
+                          show={isFieldPending("mobileScannerImageResolution")}
+                        />
+                      </Group>
+                    </div>
+
+                    {/* Page Format */}
+                    <div>
+                      <Text size="sm" fw={500} mb="xs">
+                        {t(
+                          "admin.settings.connections.mobileScannerPageFormat",
+                          "Page Format",
+                        )}
+                      </Text>
+                      <Text size="xs" c="dimmed" mb="sm">
+                        {t(
+                          "admin.settings.connections.mobileScannerPageFormatDesc",
+                          'PDF page size for converted images. "Keep" uses original image dimensions.',
+                        )}
+                      </Text>
+                      <Group gap="xs">
+                        <Select
+                          value={settings?.mobileScannerPageFormat || "A4"}
+                          onChange={(value) => {
+                            if (!loginEnabled) return;
+                            setSettings({
+                              ...settings,
+                              mobileScannerPageFormat: value || "A4",
+                            });
+                          }}
+                          data={[
+                            {
+                              value: "keep",
+                              label: t(
+                                "admin.settings.connections.pageFormatKeep",
+                                "Keep (Original Dimensions)",
+                              ),
+                            },
+                            {
+                              value: "A4",
+                              label: t(
+                                "admin.settings.connections.pageFormatA4",
+                                "A4 (210×297mm)",
+                              ),
+                            },
+                            {
+                              value: "letter",
+                              label: t(
+                                "admin.settings.connections.pageFormatLetter",
+                                "Letter (8.5×11in)",
+                              ),
+                            },
+                          ]}
+                          disabled={!loginEnabled}
+                          style={{ width: "250px" }}
+                          comboboxProps={{ zIndex: Z_INDEX_CONFIG_MODAL }}
+                        />
+                        <PendingBadge
+                          show={isFieldPending("mobileScannerPageFormat")}
+                        />
+                      </Group>
+                    </div>
+
+                    {/* Stretch to Fit */}
+                    <div>
+                      <Text size="sm" fw={500} mb="xs">
+                        {t(
+                          "admin.settings.connections.mobileScannerStretchToFit",
+                          "Stretch to Fit",
+                        )}
+                      </Text>
+                      <Text size="xs" c="dimmed" mb="sm">
+                        {t(
+                          "admin.settings.connections.mobileScannerStretchToFitDesc",
+                          "Stretch images to fill the entire page. If disabled, images are centered with preserved aspect ratio.",
+                        )}
+                      </Text>
+                      <Group gap="xs">
+                        <Switch
+                          checked={settings?.mobileScannerStretchToFit || false}
+                          onChange={(e) => {
+                            if (!loginEnabled) return;
+                            setSettings({
+                              ...settings,
+                              mobileScannerStretchToFit: e.target.checked,
+                            });
+                          }}
+                          disabled={!loginEnabled}
+                        />
+                        <PendingBadge
+                          show={isFieldPending("mobileScannerStretchToFit")}
+                        />
+                      </Group>
+                    </div>
+                  </>
+                )}
+              </Stack>
+            </Collapse>
+          </Stack>
+        </Paper>
+
+        {/* Linked Services Section - Only show if there are linked providers */}
+        {linkedProviders.length > 0 && (
+          <>
+            <div>
+              <Text fw={600} size="md" mb="md">
+                {t(
+                  "admin.settings.connections.linkedServices",
+                  "Linked Services",
+                )}
+              </Text>
+              <Stack gap="sm">
+                {linkedProviders.map((provider) => (
+                  <ProviderCard
+                    key={provider.id}
+                    provider={provider}
+                    isConfigured={true}
+                    settings={getProviderSettings(provider)}
+                    onChange={(updatedSettings) =>
+                      updateProviderSettings(provider, updatedSettings)
+                    }
                     disabled={!loginEnabled}
                   />
-                  <PendingBadge show={isFieldPending('mobileScannerConvertToPdf')} />
-                </Group>
-              </div>
+                ))}
+              </Stack>
+            </div>
 
-              {/* PDF Conversion Settings - Only show when convertToPdf is enabled */}
-              {settings?.mobileScannerConvertToPdf !== false && (
-                <>
-                  {/* Image Resolution */}
-                  <div>
-                    <Text size="sm" fw={500} mb="xs">
-                      {t('admin.settings.connections.mobileScannerImageResolution', 'Image Resolution')}
-                    </Text>
-                    <Text size="xs" c="dimmed" mb="sm">
-                      {t('admin.settings.connections.mobileScannerImageResolutionDesc', 'Resolution of uploaded images. "Reduced" scales images to max 1200px to reduce file size.')}
-                    </Text>
-                    <Group gap="xs">
-                      <Select
-                        value={settings?.mobileScannerImageResolution || 'full'}
-                        onChange={(value) => {
-                          if (!loginEnabled) return;
-                          setSettings({ ...settings, mobileScannerImageResolution: value || 'full' });
-                        }}
-                        data={[
-                          { value: 'full', label: t('admin.settings.connections.imageResolutionFull', 'Full (Original Size)') },
-                          { value: 'reduced', label: t('admin.settings.connections.imageResolutionReduced', 'Reduced (Max 1200px)') }
-                        ]}
-                        disabled={!loginEnabled}
-                        style={{ width: '250px' }}
-                        comboboxProps={{ zIndex: Z_INDEX_CONFIG_MODAL }}
-                      />
-                      <PendingBadge show={isFieldPending('mobileScannerImageResolution')} />
-                    </Group>
-                  </div>
+            {/* Divider between sections */}
+            {availableProviders.length > 0 && <Divider />}
+          </>
+        )}
 
-                  {/* Page Format */}
-                  <div>
-                    <Text size="sm" fw={500} mb="xs">
-                      {t('admin.settings.connections.mobileScannerPageFormat', 'Page Format')}
-                    </Text>
-                    <Text size="xs" c="dimmed" mb="sm">
-                      {t('admin.settings.connections.mobileScannerPageFormatDesc', 'PDF page size for converted images. "Keep" uses original image dimensions.')}
-                    </Text>
-                    <Group gap="xs">
-                      <Select
-                        value={settings?.mobileScannerPageFormat || 'A4'}
-                        onChange={(value) => {
-                          if (!loginEnabled) return;
-                          setSettings({ ...settings, mobileScannerPageFormat: value || 'A4' });
-                        }}
-                        data={[
-                          { value: 'keep', label: t('admin.settings.connections.pageFormatKeep', 'Keep (Original Dimensions)') },
-                          { value: 'A4', label: t('admin.settings.connections.pageFormatA4', 'A4 (210×297mm)') },
-                          { value: 'letter', label: t('admin.settings.connections.pageFormatLetter', 'Letter (8.5×11in)') }
-                        ]}
-                        disabled={!loginEnabled}
-                        style={{ width: '250px' }}
-                        comboboxProps={{ zIndex: Z_INDEX_CONFIG_MODAL }}
-                      />
-                      <PendingBadge show={isFieldPending('mobileScannerPageFormat')} />
-                    </Group>
-                  </div>
-
-                  {/* Stretch to Fit */}
-                  <div>
-                    <Text size="sm" fw={500} mb="xs">
-                      {t('admin.settings.connections.mobileScannerStretchToFit', 'Stretch to Fit')}
-                    </Text>
-                    <Text size="xs" c="dimmed" mb="sm">
-                      {t('admin.settings.connections.mobileScannerStretchToFitDesc', 'Stretch images to fill the entire page. If disabled, images are centered with preserved aspect ratio.')}
-                    </Text>
-                    <Group gap="xs">
-                      <Switch
-                        checked={settings?.mobileScannerStretchToFit || false}
-                        onChange={(e) => {
-                          if (!loginEnabled) return;
-                          setSettings({ ...settings, mobileScannerStretchToFit: e.target.checked });
-                        }}
-                        disabled={!loginEnabled}
-                      />
-                      <PendingBadge show={isFieldPending('mobileScannerStretchToFit')} />
-                    </Group>
-                  </div>
-                </>
-              )}
-            </Stack>
-          </Collapse>
-        </Stack>
-      </Paper>
-
-      {/* Linked Services Section - Only show if there are linked providers */}
-      {linkedProviders.length > 0 && (
-        <>
+        {/* Unlinked Services Section */}
+        {availableProviders.length > 0 && (
           <div>
             <Text fw={600} size="md" mb="md">
-              {t('admin.settings.connections.linkedServices', 'Linked Services')}
+              {t(
+                "admin.settings.connections.unlinkedServices",
+                "Unlinked Services",
+              )}
             </Text>
             <Stack gap="sm">
-              {linkedProviders.map((provider) => (
+              {availableProviders.map((provider) => (
                 <ProviderCard
                   key={provider.id}
                   provider={provider}
-                  isConfigured={true}
+                  isConfigured={false}
                   settings={getProviderSettings(provider)}
-                  onChange={(updatedSettings) => updateProviderSettings(provider, updatedSettings)}
+                  onChange={(updatedSettings) =>
+                    updateProviderSettings(provider, updatedSettings)
+                  }
                   disabled={!loginEnabled}
                 />
               ))}
             </Stack>
           </div>
+        )}
 
-          {/* Divider between sections */}
-          {availableProviders.length > 0 && <Divider />}
-        </>
-      )}
-
-      {/* Unlinked Services Section */}
-      {availableProviders.length > 0 && (
-        <div>
-          <Text fw={600} size="md" mb="md">
-            {t('admin.settings.connections.unlinkedServices', 'Unlinked Services')}
-          </Text>
-          <Stack gap="sm">
-            {availableProviders.map((provider) => (
-              <ProviderCard
-                key={provider.id}
-                provider={provider}
-                isConfigured={false}
-                settings={getProviderSettings(provider)}
-                onChange={(updatedSettings) => updateProviderSettings(provider, updatedSettings)}
-                disabled={!loginEnabled}
-              />
-            ))}
-          </Stack>
-        </div>
-      )}
-
-      {/* Restart Confirmation Modal */}
-      <RestartConfirmationModal
-        opened={restartModalOpened}
-        onClose={closeRestartModal}
-        onRestart={restartServer}
-      />
+        {/* Restart Confirmation Modal */}
+        <RestartConfirmationModal
+          opened={restartModalOpened}
+          onClose={closeRestartModal}
+          onRestart={restartServer}
+        />
       </Stack>
 
       <SettingsStickyFooter
diff --git a/frontend/src/proprietary/components/shared/config/configSections/AdminDatabaseSection.tsx b/frontend/src/proprietary/components/shared/config/configSections/AdminDatabaseSection.tsx
index a654f5abd3..0d1444c845 100644
--- a/frontend/src/proprietary/components/shared/config/configSections/AdminDatabaseSection.tsx
+++ b/frontend/src/proprietary/components/shared/config/configSections/AdminDatabaseSection.tsx
@@ -1,4 +1,5 @@
 import { useCallback, useEffect, useMemo, useState } from "react";
+import { isAxiosError } from "axios";
 import { useTranslation } from "react-i18next";
 import {
   NumberInput,
@@ -33,7 +34,9 @@ import LoginRequiredBanner from "@app/components/shared/config/LoginRequiredBann
 import EditableSecretField from "@app/components/shared/EditableSecretField";
 import apiClient from "@app/services/apiClient";
 import LocalIcon from "@app/components/shared/LocalIcon";
-import databaseManagementService, { DatabaseBackupFile } from "@app/services/databaseManagementService";
+import databaseManagementService, {
+  DatabaseBackupFile,
+} from "@app/services/databaseManagementService";
 import { Z_INDEX_OVER_CONFIG_MODAL } from "@app/styles/zIndex";
 
 interface DatabaseSettingsData {
@@ -49,68 +52,91 @@ interface DatabaseSettingsData {
 
 export default function AdminDatabaseSection() {
   const { t } = useTranslation();
-  const { loginEnabled, validateLoginEnabled, getDisabledStyles } = useLoginRequired();
-  const { restartModalOpened, showRestartModal, closeRestartModal, restartServer } = useRestartServer();
+  const { loginEnabled, validateLoginEnabled, getDisabledStyles } =
+    useLoginRequired();
+  const {
+    restartModalOpened,
+    showRestartModal,
+    closeRestartModal,
+    restartServer,
+  } = useRestartServer();
   const [backupFiles, setBackupFiles] = useState<DatabaseBackupFile[]>([]);
   const [databaseVersion, setDatabaseVersion] = useState<string | null>(null);
   const [backupsLoading, setBackupsLoading] = useState(false);
   const [creatingBackup, setCreatingBackup] = useState(false);
   const [importingUpload, setImportingUpload] = useState(false);
-  const [importingBackupFile, setImportingBackupFile] = useState<string | null>(null);
+  const [importingBackupFile, setImportingBackupFile] = useState<string | null>(
+    null,
+  );
   const [deletingFile, setDeletingFile] = useState<string | null>(null);
   const [downloadingFile, setDownloadingFile] = useState<string | null>(null);
   const [uploadFile, setUploadFile] = useState<File | null>(null);
   const [confirmImportOpen, setConfirmImportOpen] = useState(false);
-  const [deleteConfirmFile, setDeleteConfirmFile] = useState<string | null>(null);
+  const [deleteConfirmFile, setDeleteConfirmFile] = useState<string | null>(
+    null,
+  );
   const [confirmCode, setConfirmCode] = useState("");
   const [confirmInput, setConfirmInput] = useState("");
 
-  const { settings, setSettings, loading, saving, fetchSettings, saveSettings, isFieldPending } =
-    useAdminSettings<DatabaseSettingsData>({
-      sectionName: "database",
-      fetchTransformer: async (): Promise<DatabaseSettingsData & { _pending?: Record<string, any> }> => {
-        const response = await apiClient.get("/api/v1/admin/settings/section/system");
-        const systemData = response.data || {};
+  const {
+    settings,
+    setSettings,
+    loading,
+    saving,
+    fetchSettings,
+    saveSettings,
+    isFieldPending,
+  } = useAdminSettings<DatabaseSettingsData>({
+    sectionName: "database",
+    fetchTransformer: async (): Promise<
+      DatabaseSettingsData & { _pending?: Record<string, unknown> }
+    > => {
+      const response = await apiClient.get(
+        "/api/v1/admin/settings/section/system",
+      );
+      const systemData = response.data || {};
 
-        // Extract datasource from system response and handle pending
-        const datasource = systemData.datasource || {
-          enableCustomDatabase: false,
-          customDatabaseUrl: "",
-          username: "",
-          password: "",
-          type: "postgresql",
-          hostName: "localhost",
-          port: 5432,
-          name: "postgres",
-        };
+      // Extract datasource from system response and handle pending
+      const datasource = systemData.datasource || {
+        enableCustomDatabase: false,
+        customDatabaseUrl: "",
+        username: "",
+        password: "",
+        type: "postgresql",
+        hostName: "localhost",
+        port: 5432,
+        name: "postgres",
+      };
 
-        // Map pending changes from system._pending.datasource to root level
-        const result: DatabaseSettingsData & { _pending?: Record<string, any> } = { ...datasource };
-        if (systemData._pending?.datasource) {
-          result._pending = systemData._pending.datasource;
-        }
+      // Map pending changes from system._pending.datasource to root level
+      const result: DatabaseSettingsData & {
+        _pending?: Record<string, unknown>;
+      } = { ...datasource };
+      if (systemData._pending?.datasource) {
+        result._pending = systemData._pending.datasource;
+      }
 
-        return result;
-      },
-      saveTransformer: (settings: DatabaseSettingsData) => {
-        // Convert flat settings to dot-notation for delta endpoint
-        const deltaSettings: Record<string, any> = {
-          "system.datasource.enableCustomDatabase": settings.enableCustomDatabase,
-          "system.datasource.customDatabaseUrl": settings.customDatabaseUrl,
-          "system.datasource.username": settings.username,
-          "system.datasource.password": settings.password,
-          "system.datasource.type": settings.type,
-          "system.datasource.hostName": settings.hostName,
-          "system.datasource.port": settings.port,
-          "system.datasource.name": settings.name,
-        };
+      return result;
+    },
+    saveTransformer: (settings: DatabaseSettingsData) => {
+      // Convert flat settings to dot-notation for delta endpoint
+      const deltaSettings: Record<string, unknown> = {
+        "system.datasource.enableCustomDatabase": settings.enableCustomDatabase,
+        "system.datasource.customDatabaseUrl": settings.customDatabaseUrl,
+        "system.datasource.username": settings.username,
+        "system.datasource.password": settings.password,
+        "system.datasource.type": settings.type,
+        "system.datasource.hostName": settings.hostName,
+        "system.datasource.port": settings.port,
+        "system.datasource.name": settings.name,
+      };
 
-        return {
-          sectionData: {},
-          deltaSettings,
-        };
-      },
-    });
+      return {
+        sectionData: {},
+        deltaSettings,
+      };
+    },
+  });
 
   useEffect(() => {
     if (loginEnabled) {
@@ -141,11 +167,16 @@ export default function AdminDatabaseSection() {
       const data = await databaseManagementService.getDatabaseData();
       setBackupFiles(data.backupFiles || []);
       setDatabaseVersion(data.databaseVersion || null);
-    } catch (error: any) {
-      const message = error?.response?.data?.message || error?.message;
+    } catch (error: unknown) {
+      const message = isAxiosError(error)
+        ? error.response?.data?.message || error.message
+        : undefined;
       alert({
         alertType: "error",
-        title: t("admin.settings.database.loadError", "Failed to load database backups"),
+        title: t(
+          "admin.settings.database.loadError",
+          "Failed to load database backups",
+        ),
         body: message,
       });
     } finally {
@@ -157,7 +188,10 @@ export default function AdminDatabaseSection() {
     loadBackupData();
   }, [loginEnabled, isEmbeddedH2, isCustomDatabase, datasourceType]);
 
-  const { isDirty, resetToSnapshot, markSaved } = useSettingsDirty(settings, loading);
+  const { isDirty, resetToSnapshot, markSaved } = useSettingsDirty(
+    settings,
+    loading,
+  );
 
   const handleSave = async () => {
     if (!validateLoginEnabled()) {
@@ -187,13 +221,24 @@ export default function AdminDatabaseSection() {
     setCreatingBackup(true);
     try {
       await databaseManagementService.createBackup();
-      alert({ alertType: "success", title: t("admin.settings.database.backupCreated", "Backup created successfully") });
+      alert({
+        alertType: "success",
+        title: t(
+          "admin.settings.database.backupCreated",
+          "Backup created successfully",
+        ),
+      });
       await loadBackupData();
-    } catch (error: any) {
-      const message = error?.response?.data?.message || error?.message;
+    } catch (error: unknown) {
+      const message = isAxiosError(error)
+        ? error.response?.data?.message || error.message
+        : undefined;
       alert({
         alertType: "error",
-        title: t("admin.settings.database.backupFailed", "Failed to create backup"),
+        title: t(
+          "admin.settings.database.backupFailed",
+          "Failed to create backup",
+        ),
         body: message,
       });
     } finally {
@@ -206,14 +251,25 @@ export default function AdminDatabaseSection() {
     setImportingUpload(true);
     try {
       await databaseManagementService.uploadAndImport(uploadFile);
-      alert({ alertType: "success", title: t("admin.settings.database.importSuccess", "Backup imported successfully") });
+      alert({
+        alertType: "success",
+        title: t(
+          "admin.settings.database.importSuccess",
+          "Backup imported successfully",
+        ),
+      });
       setUploadFile(null);
       await loadBackupData();
-    } catch (error: any) {
-      const message = error?.response?.data?.message || error?.message;
+    } catch (error: unknown) {
+      const message = isAxiosError(error)
+        ? error.response?.data?.message || error.message
+        : undefined;
       alert({
         alertType: "error",
-        title: t("admin.settings.database.importFailed", "Failed to import backup"),
+        title: t(
+          "admin.settings.database.importFailed",
+          "Failed to import backup",
+        ),
         body: message,
       });
     } finally {
@@ -222,7 +278,10 @@ export default function AdminDatabaseSection() {
   };
 
   const generateConfirmationCode = () => {
-    if (typeof crypto !== "undefined" && typeof crypto.getRandomValues === "function") {
+    if (
+      typeof crypto !== "undefined" &&
+      typeof crypto.getRandomValues === "function"
+    ) {
       const array = new Uint32Array(1);
       crypto.getRandomValues(array);
       const randomNumber = array[0] % 10000; // 0-9999
@@ -236,7 +295,13 @@ export default function AdminDatabaseSection() {
   const handleUploadImport = () => {
     if (!validateLoginEnabled()) return;
     if (!uploadFile) {
-      alert({ alertType: "warning", title: t("admin.settings.database.selectFile", "Please select a .sql file to import") });
+      alert({
+        alertType: "warning",
+        title: t(
+          "admin.settings.database.selectFile",
+          "Please select a .sql file to import",
+        ),
+      });
       return;
     }
     const code = generateConfirmationCode();
@@ -254,8 +319,14 @@ export default function AdminDatabaseSection() {
     if (confirmInput !== confirmCode) {
       alert({
         alertType: "warning",
-        title: t("admin.settings.database.codeMismatch", "Confirmation code does not match"),
-        body: t("admin.settings.database.codeMismatchBody", "Please enter the code exactly as shown to proceed."),
+        title: t(
+          "admin.settings.database.codeMismatch",
+          "Confirmation code does not match",
+        ),
+        body: t(
+          "admin.settings.database.codeMismatchBody",
+          "Please enter the code exactly as shown to proceed.",
+        ),
       });
       return;
     }
@@ -268,13 +339,24 @@ export default function AdminDatabaseSection() {
     setImportingBackupFile(fileName);
     try {
       await databaseManagementService.importFromFileName(fileName);
-      alert({ alertType: "success", title: t("admin.settings.database.importSuccess", "Backup imported successfully") });
+      alert({
+        alertType: "success",
+        title: t(
+          "admin.settings.database.importSuccess",
+          "Backup imported successfully",
+        ),
+      });
       await loadBackupData();
-    } catch (error: any) {
-      const message = error?.response?.data?.message || error?.message;
+    } catch (error: unknown) {
+      const message = isAxiosError(error)
+        ? error.response?.data?.message || error.message
+        : undefined;
       alert({
         alertType: "error",
-        title: t("admin.settings.database.importFailed", "Failed to import backup"),
+        title: t(
+          "admin.settings.database.importFailed",
+          "Failed to import backup",
+        ),
         body: message,
       });
     } finally {
@@ -287,13 +369,21 @@ export default function AdminDatabaseSection() {
     setDeletingFile(fileName);
     try {
       await databaseManagementService.deleteBackup(fileName);
-      alert({ alertType: "success", title: t("admin.settings.database.deleteSuccess", "Backup deleted") });
+      alert({
+        alertType: "success",
+        title: t("admin.settings.database.deleteSuccess", "Backup deleted"),
+      });
       await loadBackupData();
-    } catch (error: any) {
-      const message = error?.response?.data?.message || error?.message;
+    } catch (error: unknown) {
+      const message = isAxiosError(error)
+        ? error.response?.data?.message || error.message
+        : undefined;
       alert({
         alertType: "error",
-        title: t("admin.settings.database.deleteFailed", "Failed to delete backup"),
+        title: t(
+          "admin.settings.database.deleteFailed",
+          "Failed to delete backup",
+        ),
         body: message,
       });
     } finally {
@@ -320,11 +410,16 @@ export default function AdminDatabaseSection() {
       link.download = fileName;
       document.body.appendChild(link);
       link.click();
-    } catch (error: any) {
-      const message = error?.response?.data?.message || error?.message;
+    } catch (error: unknown) {
+      const message = isAxiosError(error)
+        ? error.response?.data?.message || error.message
+        : undefined;
       alert({
         alertType: "error",
-        title: t("admin.settings.database.downloadFailed", "Failed to download backup"),
+        title: t(
+          "admin.settings.database.downloadFailed",
+          "Failed to download backup",
+        ),
         body: message,
       });
     } finally {
@@ -354,195 +449,263 @@ export default function AdminDatabaseSection() {
       <Stack gap="lg" className="settings-section-content">
         <LoginRequiredBanner show={!loginEnabled} />
 
-      <div>
-        <Group justify="space-between" align="center">
-          <div>
-            <Text fw={600} size="lg">
-              {t("admin.settings.database.title", "Database")}
-            </Text>
-            <Text size="sm" c="dimmed">
-              {t(
-                "admin.settings.database.description",
-                "Configure custom database connection settings for enterprise deployments.",
-              )}
-            </Text>
-          </div>
-          <Badge color="grape" size="lg">
-            ENTERPRISE
-          </Badge>
-        </Group>
-      </div>
-
-      {/* Database Configuration */}
-      <Paper withBorder p="md" radius="md">
-        <Stack gap="md">
-          <Text fw={600} size="sm" mb="xs">
-            {t("admin.settings.database.configuration", "Database Configuration")}
-          </Text>
-
-          <div style={{ display: "flex", alignItems: "center", justifyContent: "space-between" }}>
+        <div>
+          <Group justify="space-between" align="center">
             <div>
-              <Text fw={500} size="sm">
-                {t("admin.settings.database.enableCustom.label", "Enable Custom Database")}
+              <Text fw={600} size="lg">
+                {t("admin.settings.database.title", "Database")}
               </Text>
-              <Text size="xs" c="dimmed" mt={4}>
+              <Text size="sm" c="dimmed">
                 {t(
-                  "admin.settings.database.enableCustom.description",
-                  "Use your own custom database configuration instead of the default embedded database",
+                  "admin.settings.database.description",
+                  "Configure custom database connection settings for enterprise deployments.",
                 )}
               </Text>
             </div>
-            <Group gap="xs">
-              <Switch
-                checked={settings?.enableCustomDatabase || false}
-                onChange={(e) => {
-                  if (!loginEnabled) return;
-                  setSettings({ ...settings, enableCustomDatabase: e.target.checked });
-                }}
-                disabled={!loginEnabled}
-                styles={getDisabledStyles()}
-              />
-              <PendingBadge show={isFieldPending("enableCustomDatabase")} />
-            </Group>
-          </div>
+            <Badge color="grape" size="lg">
+              ENTERPRISE
+            </Badge>
+          </Group>
+        </div>
 
-          {settings?.enableCustomDatabase && (
-            <>
+        {/* Database Configuration */}
+        <Paper withBorder p="md" radius="md">
+          <Stack gap="md">
+            <Text fw={600} size="sm" mb="xs">
+              {t(
+                "admin.settings.database.configuration",
+                "Database Configuration",
+              )}
+            </Text>
+
+            <div
+              style={{
+                display: "flex",
+                alignItems: "center",
+                justifyContent: "space-between",
+              }}
+            >
               <div>
-                <TextInput
-                  label={
-                    <Group gap="xs">
-                      <span>{t("admin.settings.database.customUrl.label", "Custom Database URL")}</span>
-                      <PendingBadge show={isFieldPending("customDatabaseUrl")} />
-                    </Group>
-                  }
-                  description={t(
-                    "admin.settings.database.customUrl.description",
-                    "Full JDBC connection string (e.g., jdbc:postgresql://localhost:5432/postgres). If provided, individual connection settings below are not used.",
+                <Text fw={500} size="sm">
+                  {t(
+                    "admin.settings.database.enableCustom.label",
+                    "Enable Custom Database",
                   )}
-                  value={settings?.customDatabaseUrl || ""}
-                  onChange={(e) => setSettings({ ...settings, customDatabaseUrl: e.target.value })}
-                  placeholder="jdbc:postgresql://localhost:5432/postgres"
-                  disabled={!loginEnabled}
-                />
-              </div>
-
-              <div>
-                <Select
-                  label={
-                    <Group gap="xs">
-                      <span>{t("admin.settings.database.type.label", "Database Type")}</span>
-                      <PendingBadge show={isFieldPending("type")} />
-                    </Group>
-                  }
-                  description={t(
-                    "admin.settings.database.type.description",
-                    "Type of database (not used if custom URL is provided)",
+                </Text>
+                <Text size="xs" c="dimmed" mt={4}>
+                  {t(
+                    "admin.settings.database.enableCustom.description",
+                    "Use your own custom database configuration instead of the default embedded database",
                   )}
-                  value={settings?.type || "postgresql"}
-                  onChange={(value) => setSettings({ ...settings, type: value || "postgresql" })}
-                  data={[
-                    { value: "postgresql", label: "PostgreSQL" },
-                    { value: "h2", label: "H2" },
-                    { value: "mysql", label: "MySQL" },
-                    { value: "mariadb", label: "MariaDB" },
-                  ]}
-                  disabled={!loginEnabled}
-                />
+                </Text>
               </div>
-
-              <div>
-                <TextInput
-                  label={
-                    <Group gap="xs">
-                      <span>{t("admin.settings.database.hostName.label", "Host Name")}</span>
-                      <PendingBadge show={isFieldPending("hostName")} />
-                    </Group>
-                  }
-                  description={t(
-                    "admin.settings.database.hostName.description",
-                    "Database server hostname (not used if custom URL is provided)",
-                  )}
-                  value={settings?.hostName || ""}
-                  onChange={(e) => setSettings({ ...settings, hostName: e.target.value })}
-                  placeholder="localhost"
+              <Group gap="xs">
+                <Switch
+                  checked={settings?.enableCustomDatabase || false}
+                  onChange={(e) => {
+                    if (!loginEnabled) return;
+                    setSettings({
+                      ...settings,
+                      enableCustomDatabase: e.target.checked,
+                    });
+                  }}
                   disabled={!loginEnabled}
+                  styles={getDisabledStyles()}
                 />
-              </div>
+                <PendingBadge show={isFieldPending("enableCustomDatabase")} />
+              </Group>
+            </div>
 
-              <div>
-                <NumberInput
-                  label={
-                    <Group gap="xs">
-                      <span>{t("admin.settings.database.port.label", "Port")}</span>
-                      <PendingBadge show={isFieldPending("port")} />
-                    </Group>
-                  }
-                  description={t(
-                    "admin.settings.database.port.description",
-                    "Database server port (not used if custom URL is provided)",
-                  )}
-                  value={settings?.port || 5432}
-                  onChange={(value) => setSettings({ ...settings, port: Number(value) })}
-                  min={1}
-                  max={65535}
-                  disabled={!loginEnabled}
-                />
-              </div>
+            {settings?.enableCustomDatabase && (
+              <>
+                <div>
+                  <TextInput
+                    label={
+                      <Group gap="xs">
+                        <span>
+                          {t(
+                            "admin.settings.database.customUrl.label",
+                            "Custom Database URL",
+                          )}
+                        </span>
+                        <PendingBadge
+                          show={isFieldPending("customDatabaseUrl")}
+                        />
+                      </Group>
+                    }
+                    description={t(
+                      "admin.settings.database.customUrl.description",
+                      "Full JDBC connection string (e.g., jdbc:postgresql://localhost:5432/postgres). If provided, individual connection settings below are not used.",
+                    )}
+                    value={settings?.customDatabaseUrl || ""}
+                    onChange={(e) =>
+                      setSettings({
+                        ...settings,
+                        customDatabaseUrl: e.target.value,
+                      })
+                    }
+                    placeholder="jdbc:postgresql://localhost:5432/postgres"
+                    disabled={!loginEnabled}
+                  />
+                </div>
 
-              <div>
-                <TextInput
-                  label={
-                    <Group gap="xs">
-                      <span>{t("admin.settings.database.name.label", "Database Name")}</span>
-                      <PendingBadge show={isFieldPending("name")} />
-                    </Group>
-                  }
-                  description={t(
-                    "admin.settings.database.name.description",
-                    "Name of the database (not used if custom URL is provided)",
-                  )}
-                  value={settings?.name || ""}
-                  onChange={(e) => setSettings({ ...settings, name: e.target.value })}
-                  placeholder="postgres"
-                  disabled={!loginEnabled}
-                />
-              </div>
+                <div>
+                  <Select
+                    label={
+                      <Group gap="xs">
+                        <span>
+                          {t(
+                            "admin.settings.database.type.label",
+                            "Database Type",
+                          )}
+                        </span>
+                        <PendingBadge show={isFieldPending("type")} />
+                      </Group>
+                    }
+                    description={t(
+                      "admin.settings.database.type.description",
+                      "Type of database (not used if custom URL is provided)",
+                    )}
+                    value={settings?.type || "postgresql"}
+                    onChange={(value) =>
+                      setSettings({ ...settings, type: value || "postgresql" })
+                    }
+                    data={[
+                      { value: "postgresql", label: "PostgreSQL" },
+                      { value: "h2", label: "H2" },
+                      { value: "mysql", label: "MySQL" },
+                      { value: "mariadb", label: "MariaDB" },
+                    ]}
+                    disabled={!loginEnabled}
+                  />
+                </div>
 
-              <div>
-                <TextInput
-                  label={
-                    <Group gap="xs">
-                      <span>{t("admin.settings.database.username.label", "Username")}</span>
-                      <PendingBadge show={isFieldPending("username")} />
-                    </Group>
-                  }
-                  description={t("admin.settings.database.username.description", "Database authentication username")}
-                  value={settings?.username || ""}
-                  onChange={(e) => setSettings({ ...settings, username: e.target.value })}
-                  placeholder="postgres"
-                  disabled={!loginEnabled}
-                />
-              </div>
+                <div>
+                  <TextInput
+                    label={
+                      <Group gap="xs">
+                        <span>
+                          {t(
+                            "admin.settings.database.hostName.label",
+                            "Host Name",
+                          )}
+                        </span>
+                        <PendingBadge show={isFieldPending("hostName")} />
+                      </Group>
+                    }
+                    description={t(
+                      "admin.settings.database.hostName.description",
+                      "Database server hostname (not used if custom URL is provided)",
+                    )}
+                    value={settings?.hostName || ""}
+                    onChange={(e) =>
+                      setSettings({ ...settings, hostName: e.target.value })
+                    }
+                    placeholder="localhost"
+                    disabled={!loginEnabled}
+                  />
+                </div>
 
-              <div>
-                <Group gap="xs" align="center" mb={4}>
-                  <span style={{ fontWeight: 500, fontSize: "0.875rem" }}>{t("admin.settings.database.password.label", "Password")}</span>
-                  <PendingBadge show={isFieldPending("password")} />
-                </Group>
-                <EditableSecretField
-                  description={t("admin.settings.database.password.description", "Database authentication password")}
-                  value={settings?.password || ""}
-                  onChange={(value) => setSettings({ ...settings, password: value })}
-                  placeholder="Enter database password"
-                  disabled={!loginEnabled}
-                />
-              </div>
-            </>
-          )}
-        </Stack>
-      </Paper>
+                <div>
+                  <NumberInput
+                    label={
+                      <Group gap="xs">
+                        <span>
+                          {t("admin.settings.database.port.label", "Port")}
+                        </span>
+                        <PendingBadge show={isFieldPending("port")} />
+                      </Group>
+                    }
+                    description={t(
+                      "admin.settings.database.port.description",
+                      "Database server port (not used if custom URL is provided)",
+                    )}
+                    value={settings?.port || 5432}
+                    onChange={(value) =>
+                      setSettings({ ...settings, port: Number(value) })
+                    }
+                    min={1}
+                    max={65535}
+                    disabled={!loginEnabled}
+                  />
+                </div>
 
+                <div>
+                  <TextInput
+                    label={
+                      <Group gap="xs">
+                        <span>
+                          {t(
+                            "admin.settings.database.name.label",
+                            "Database Name",
+                          )}
+                        </span>
+                        <PendingBadge show={isFieldPending("name")} />
+                      </Group>
+                    }
+                    description={t(
+                      "admin.settings.database.name.description",
+                      "Name of the database (not used if custom URL is provided)",
+                    )}
+                    value={settings?.name || ""}
+                    onChange={(e) =>
+                      setSettings({ ...settings, name: e.target.value })
+                    }
+                    placeholder="postgres"
+                    disabled={!loginEnabled}
+                  />
+                </div>
+
+                <div>
+                  <TextInput
+                    label={
+                      <Group gap="xs">
+                        <span>
+                          {t(
+                            "admin.settings.database.username.label",
+                            "Username",
+                          )}
+                        </span>
+                        <PendingBadge show={isFieldPending("username")} />
+                      </Group>
+                    }
+                    description={t(
+                      "admin.settings.database.username.description",
+                      "Database authentication username",
+                    )}
+                    value={settings?.username || ""}
+                    onChange={(e) =>
+                      setSettings({ ...settings, username: e.target.value })
+                    }
+                    placeholder="postgres"
+                    disabled={!loginEnabled}
+                  />
+                </div>
+
+                <div>
+                  <Group gap="xs" align="center" mb={4}>
+                    <span style={{ fontWeight: 500, fontSize: "0.875rem" }}>
+                      {t("admin.settings.database.password.label", "Password")}
+                    </span>
+                    <PendingBadge show={isFieldPending("password")} />
+                  </Group>
+                  <EditableSecretField
+                    description={t(
+                      "admin.settings.database.password.description",
+                      "Database authentication password",
+                    )}
+                    value={settings?.password || ""}
+                    onChange={(value) =>
+                      setSettings({ ...settings, password: value })
+                    }
+                    placeholder="Enter database password"
+                    disabled={!loginEnabled}
+                  />
+                </div>
+              </>
+            )}
+          </Stack>
+        </Paper>
       </Stack>
 
       <SettingsStickyFooter
@@ -553,263 +716,409 @@ export default function AdminDatabaseSection() {
         onDiscard={handleDiscard}
       />
 
-      <Stack gap="lg" className="settings-section-content" style={{ marginTop: 0 }}>
-      <Divider my="md" />
+      <Stack
+        gap="lg"
+        className="settings-section-content"
+        style={{ marginTop: 0 }}
+      >
+        <Divider my="md" />
 
-      <Stack gap="md">
-        <Group justify="space-between" align="center">
-          <div>
-            <Text fw={600} size="lg">
-              {t("admin.settings.database.backupTitle", "Backups & Restore")}
-            </Text>
-            <Text size="sm" c="dimmed">
-              {t("admin.settings.database.backupDescription", "Manage H2 backups directly from the admin console.")}
-            </Text>
-          </div>
-          <Group gap="xs">
-            {databaseVersion && (
-              <Badge color="blue" variant="light">
-                {t("admin.settings.database.version", "H2 Version")}: {databaseVersion}
+        <Stack gap="md">
+          <Group justify="space-between" align="center">
+            <div>
+              <Text fw={600} size="lg">
+                {t("admin.settings.database.backupTitle", "Backups & Restore")}
+              </Text>
+              <Text size="sm" c="dimmed">
+                {t(
+                  "admin.settings.database.backupDescription",
+                  "Manage H2 backups directly from the admin console.",
+                )}
+              </Text>
+            </div>
+            <Group gap="xs">
+              {databaseVersion && (
+                <Badge color="blue" variant="light">
+                  {t("admin.settings.database.version", "H2 Version")}:{" "}
+                  {databaseVersion}
+                </Badge>
+              )}
+              <Badge color={isEmbeddedH2 ? "green" : "red"} variant="light">
+                {isEmbeddedH2
+                  ? t("admin.settings.database.embedded", "Embedded H2")
+                  : t("admin.settings.database.external", "External DB")}
               </Badge>
-            )}
-            <Badge color={isEmbeddedH2 ? "green" : "red"} variant="light">
-              {isEmbeddedH2
-                ? t("admin.settings.database.embedded", "Embedded H2")
-                : t("admin.settings.database.external", "External DB")}
-            </Badge>
+            </Group>
           </Group>
-        </Group>
 
-        {!isEmbeddedH2 && (
-          <Alert icon={<LocalIcon icon="info" width="1.2rem" height="1.2rem" />} color="yellow" radius="md">
-            <Text fw={600} size="sm">
-              {t("admin.settings.database.h2Only", "Backups are available only for the embedded H2 database.")}
-            </Text>
-            <Text size="sm" c="dimmed">
-              {t(
-                "admin.settings.database.h2Hint",
-                "Set the database type to H2 and disable custom database to enable backup and restore.",
-              )}
-            </Text>
-          </Alert>
-        )}
-        {isEmbeddedH2 && (
-          <Paper withBorder p="md" radius="md">
-            <Stack gap="md">
-              <Group justify="space-between" align="center">
-                <Group gap="xs">
-                  <LocalIcon icon="backup" width="1.4rem" height="1.4rem" />
-                  <Text fw={600}>{t("admin.settings.database.manageBackups", "Manage backups")}</Text>
-                </Group>
-                <Group gap="xs">
-                  <Button
-                    variant="light"
-                    leftSection={<LocalIcon icon="refresh" width="1rem" height="1rem" />}
-                    onClick={loadBackupData}
-                    disabled={!loginEnabled || !isEmbeddedH2}
-                  >
-                    {t("admin.settings.database.refresh", "Refresh")}
-                  </Button>
-                  <Button
-                    leftSection={<LocalIcon icon="cloud-upload" width="1rem" height="1rem" />}
-                    onClick={handleCreateBackup}
-                    loading={creatingBackup}
-                    disabled={!loginEnabled || !isEmbeddedH2}
-                  >
-                    {t("admin.settings.database.createBackup", "Create backup")}
-                  </Button>
-                </Group>
-              </Group>
-
-              <Box>
-                <Text fw={500} size="sm" mb={6}>
-                  {t("admin.settings.database.uploadTitle", "Upload & import")}
-                </Text>
-                <Group gap="sm" align="flex-end" wrap="wrap">
-                  <FileInput
-                    value={uploadFile}
-                    onChange={setUploadFile}
-                    placeholder={t("admin.settings.database.chooseFile", "Choose a .sql backup file")}
-                    accept=".sql"
-                    disabled={!loginEnabled || !isEmbeddedH2}
-                    styles={{ input: { minWidth: 280 } }}
-                  />
-                  <Button
-                    variant="outline"
-                    onClick={handleUploadImport}
-                    loading={importingUpload}
-                    disabled={!loginEnabled || !isEmbeddedH2}
-                    leftSection={<LocalIcon icon="play-circle" width="1rem" height="1rem" />}
-                  >
-                    {t("admin.settings.database.importFromUpload", "Import upload")}
-                  </Button>
-                </Group>
-              </Box>
-
-              {backupsLoading ? (
-                <Group justify="center" py="md">
-                  <Loader size="sm" />
-                </Group>
-              ) : backupFiles.length === 0 ? (
-                <Text size="sm" c="dimmed">
-                  {isEmbeddedH2
-                    ? t("admin.settings.database.noBackups", "No backups found yet.")
-                    : t(
-                        "admin.settings.database.unavailable",
-                        "Backup list unavailable for the current database configuration.",
-                      )}
-                </Text>
-              ) : (
-                <Table highlightOnHover withColumnBorders verticalSpacing="sm">
-                  <Table.Thead>
-                    <Table.Tr>
-                      <Table.Th>{t("admin.settings.database.fileName", "File")}</Table.Th>
-                      <Table.Th>{t("admin.settings.database.created", "Created")}</Table.Th>
-                      <Table.Th>{t("admin.settings.database.size", "Size")}</Table.Th>
-                      <Table.Th w={150}>{t("admin.settings.database.actions", "Actions")}</Table.Th>
-                    </Table.Tr>
-                  </Table.Thead>
-                  <Table.Tbody>
-                    {backupFiles.map((backup) => (
-                      <Table.Tr key={backup.fileName}>
-                        <Table.Td>{backup.fileName}</Table.Td>
-                        <Table.Td>{backup.formattedCreationDate || backup.creationDate || "-"}</Table.Td>
-                        <Table.Td>{backup.formattedFileSize || "-"}</Table.Td>
-                        <Table.Td>
-                          <Group gap="xs" justify="flex-start">
-                            <Tooltip label={t("admin.settings.database.download", "Download")} withArrow>
-                              <ActionIcon
-                                variant="subtle"
-                                onClick={() => handleDownload(backup.fileName)}
-                                disabled={!loginEnabled || !isEmbeddedH2}
-                              >
-                                {downloadingFile === backup.fileName ? (
-                                  <Loader size="xs" />
-                                ) : (
-                                  <LocalIcon icon="download" width="1rem" height="1rem" />
-                                )}
-                              </ActionIcon>
-                            </Tooltip>
-                            <Tooltip label={t("admin.settings.database.import", "Import")} withArrow>
-                              <ActionIcon
-                                variant="subtle"
-                                onClick={() => handleImportExisting(backup.fileName)}
-                                disabled={!loginEnabled || !isEmbeddedH2}
-                              >
-                                {importingBackupFile === backup.fileName ? (
-                                  <Loader size="xs" />
-                                ) : (
-                                  <LocalIcon icon="backup" width="1rem" height="1rem" />
-                                )}
-                              </ActionIcon>
-                            </Tooltip>
-                            <Tooltip label={t("admin.settings.database.delete", "Delete")} withArrow>
-                              <ActionIcon
-                                variant="subtle"
-                                color="red"
-                                onClick={() => handleDeleteClick(backup.fileName)}
-                                disabled={!loginEnabled || !isEmbeddedH2}
-                              >
-                                {deletingFile === backup.fileName ? (
-                                  <Loader size="xs" />
-                                ) : (
-                                  <LocalIcon icon="delete" width="1rem" height="1rem" />
-                                )}
-                              </ActionIcon>
-                            </Tooltip>
-                          </Group>
-                        </Table.Td>
-                      </Table.Tr>
-                    ))}
-                  </Table.Tbody>
-                </Table>
-              )}
-            </Stack>
-          </Paper>
-        )}
-      </Stack>
-
-      {/* Restart Confirmation Modal */}
-      <RestartConfirmationModal opened={restartModalOpened} onClose={closeRestartModal} onRestart={restartServer} />
-
-      <Modal
-        opened={confirmImportOpen}
-        onClose={closeConfirmImportModal}
-        title={t("admin.settings.database.confirmImportTitle", "Confirm database import")}
-        centered
-        withinPortal
-        zIndex={Z_INDEX_OVER_CONFIG_MODAL}
-      >
-        <Stack gap="md">
-          <Alert color="red" variant="light" icon={<LocalIcon icon="warning" width="1.2rem" height="1.2rem" />}>
-            <Text fw={600}>
-              {t("admin.settings.database.overwriteWarning", "Warning: This will overwrite the current database.")}
-            </Text>
-            <Text size="sm" c="dimmed">
-              {t(
-                "admin.settings.database.overwriteWarningBody",
-                "All existing data will be replaced by the uploaded backup. This action cannot be undone.",
-              )}
-            </Text>
-          </Alert>
-          <Stack gap={6}>
-            <Text size="sm" fw={600}>
-              {t("admin.settings.database.confirmCodeLabel", "Enter the confirmation code to proceed")}
-            </Text>
-            <Text size="lg" fw={700}>
-              {confirmCode}
-            </Text>
-            <TextInput
-              value={confirmInput}
-              onChange={(e) => setConfirmInput(e.currentTarget.value)}
-              placeholder={t("admin.settings.database.enterCode", "Enter the code shown above")}
-              minLength={4}
-              maxLength={4}
-              disabled={importingUpload}
-            />
-          </Stack>
-          <Group justify="flex-end" gap="sm">
-            <Button variant="default" onClick={closeConfirmImportModal} disabled={importingUpload}>
-              {t("cancel", "Cancel")}
-            </Button>
-            <Button color="red" onClick={handleConfirmImport} loading={importingUpload} disabled={confirmInput.length === 0}>
-              {t("admin.settings.database.confirmImport", "Confirm import")}
-            </Button>
-          </Group>
-        </Stack>
-      </Modal>
-
-      <Modal
-        opened={deleteConfirmFile !== null}
-        onClose={() => setDeleteConfirmFile(null)}
-        title={t("admin.settings.database.deleteTitle", "Delete backup")}
-        centered
-        withinPortal
-        zIndex={Z_INDEX_OVER_CONFIG_MODAL}
-      >
-        <Stack gap="md">
-          <Alert color="red" variant="light" icon={<LocalIcon icon="warning" width="1.2rem" height="1.2rem" />}>
-            <Text fw={600}>
-              {t("admin.settings.database.deleteConfirm", "Delete this backup? This cannot be undone.")}
-            </Text>
-            <Text size="sm" c="dimmed">
-              {deleteConfirmFile}
-            </Text>
-          </Alert>
-          <Group justify="flex-end" gap="sm">
-            <Button variant="default" onClick={() => setDeleteConfirmFile(null)} disabled={deletingFile !== null}>
-              {t("cancel", "Cancel")}
-            </Button>
-            <Button
-              color="red"
-              onClick={() => deleteConfirmFile && handleDelete(deleteConfirmFile)}
-              loading={deletingFile === deleteConfirmFile}
+          {!isEmbeddedH2 && (
+            <Alert
+              icon={<LocalIcon icon="info" width="1.2rem" height="1.2rem" />}
+              color="yellow"
+              radius="md"
             >
-              {t("admin.settings.database.deleteConfirmAction", "Delete backup")}
-            </Button>
-          </Group>
+              <Text fw={600} size="sm">
+                {t(
+                  "admin.settings.database.h2Only",
+                  "Backups are available only for the embedded H2 database.",
+                )}
+              </Text>
+              <Text size="sm" c="dimmed">
+                {t(
+                  "admin.settings.database.h2Hint",
+                  "Set the database type to H2 and disable custom database to enable backup and restore.",
+                )}
+              </Text>
+            </Alert>
+          )}
+          {isEmbeddedH2 && (
+            <Paper withBorder p="md" radius="md">
+              <Stack gap="md">
+                <Group justify="space-between" align="center">
+                  <Group gap="xs">
+                    <LocalIcon icon="backup" width="1.4rem" height="1.4rem" />
+                    <Text fw={600}>
+                      {t(
+                        "admin.settings.database.manageBackups",
+                        "Manage backups",
+                      )}
+                    </Text>
+                  </Group>
+                  <Group gap="xs">
+                    <Button
+                      variant="light"
+                      leftSection={
+                        <LocalIcon icon="refresh" width="1rem" height="1rem" />
+                      }
+                      onClick={loadBackupData}
+                      disabled={!loginEnabled || !isEmbeddedH2}
+                    >
+                      {t("admin.settings.database.refresh", "Refresh")}
+                    </Button>
+                    <Button
+                      leftSection={
+                        <LocalIcon
+                          icon="cloud-upload"
+                          width="1rem"
+                          height="1rem"
+                        />
+                      }
+                      onClick={handleCreateBackup}
+                      loading={creatingBackup}
+                      disabled={!loginEnabled || !isEmbeddedH2}
+                    >
+                      {t(
+                        "admin.settings.database.createBackup",
+                        "Create backup",
+                      )}
+                    </Button>
+                  </Group>
+                </Group>
+
+                <Box>
+                  <Text fw={500} size="sm" mb={6}>
+                    {t(
+                      "admin.settings.database.uploadTitle",
+                      "Upload & import",
+                    )}
+                  </Text>
+                  <Group gap="sm" align="flex-end" wrap="wrap">
+                    <FileInput
+                      value={uploadFile}
+                      onChange={setUploadFile}
+                      placeholder={t(
+                        "admin.settings.database.chooseFile",
+                        "Choose a .sql backup file",
+                      )}
+                      accept=".sql"
+                      disabled={!loginEnabled || !isEmbeddedH2}
+                      styles={{ input: { minWidth: 280 } }}
+                    />
+                    <Button
+                      variant="outline"
+                      onClick={handleUploadImport}
+                      loading={importingUpload}
+                      disabled={!loginEnabled || !isEmbeddedH2}
+                      leftSection={
+                        <LocalIcon
+                          icon="play-circle"
+                          width="1rem"
+                          height="1rem"
+                        />
+                      }
+                    >
+                      {t(
+                        "admin.settings.database.importFromUpload",
+                        "Import upload",
+                      )}
+                    </Button>
+                  </Group>
+                </Box>
+
+                {backupsLoading ? (
+                  <Group justify="center" py="md">
+                    <Loader size="sm" />
+                  </Group>
+                ) : backupFiles.length === 0 ? (
+                  <Text size="sm" c="dimmed">
+                    {isEmbeddedH2
+                      ? t(
+                          "admin.settings.database.noBackups",
+                          "No backups found yet.",
+                        )
+                      : t(
+                          "admin.settings.database.unavailable",
+                          "Backup list unavailable for the current database configuration.",
+                        )}
+                  </Text>
+                ) : (
+                  <Table
+                    highlightOnHover
+                    withColumnBorders
+                    verticalSpacing="sm"
+                  >
+                    <Table.Thead>
+                      <Table.Tr>
+                        <Table.Th>
+                          {t("admin.settings.database.fileName", "File")}
+                        </Table.Th>
+                        <Table.Th>
+                          {t("admin.settings.database.created", "Created")}
+                        </Table.Th>
+                        <Table.Th>
+                          {t("admin.settings.database.size", "Size")}
+                        </Table.Th>
+                        <Table.Th w={150}>
+                          {t("admin.settings.database.actions", "Actions")}
+                        </Table.Th>
+                      </Table.Tr>
+                    </Table.Thead>
+                    <Table.Tbody>
+                      {backupFiles.map((backup) => (
+                        <Table.Tr key={backup.fileName}>
+                          <Table.Td>{backup.fileName}</Table.Td>
+                          <Table.Td>
+                            {backup.formattedCreationDate ||
+                              backup.creationDate ||
+                              "-"}
+                          </Table.Td>
+                          <Table.Td>{backup.formattedFileSize || "-"}</Table.Td>
+                          <Table.Td>
+                            <Group gap="xs" justify="flex-start">
+                              <Tooltip
+                                label={t(
+                                  "admin.settings.database.download",
+                                  "Download",
+                                )}
+                                withArrow
+                              >
+                                <ActionIcon
+                                  variant="subtle"
+                                  onClick={() =>
+                                    handleDownload(backup.fileName)
+                                  }
+                                  disabled={!loginEnabled || !isEmbeddedH2}
+                                >
+                                  {downloadingFile === backup.fileName ? (
+                                    <Loader size="xs" />
+                                  ) : (
+                                    <LocalIcon
+                                      icon="download"
+                                      width="1rem"
+                                      height="1rem"
+                                    />
+                                  )}
+                                </ActionIcon>
+                              </Tooltip>
+                              <Tooltip
+                                label={t(
+                                  "admin.settings.database.import",
+                                  "Import",
+                                )}
+                                withArrow
+                              >
+                                <ActionIcon
+                                  variant="subtle"
+                                  onClick={() =>
+                                    handleImportExisting(backup.fileName)
+                                  }
+                                  disabled={!loginEnabled || !isEmbeddedH2}
+                                >
+                                  {importingBackupFile === backup.fileName ? (
+                                    <Loader size="xs" />
+                                  ) : (
+                                    <LocalIcon
+                                      icon="backup"
+                                      width="1rem"
+                                      height="1rem"
+                                    />
+                                  )}
+                                </ActionIcon>
+                              </Tooltip>
+                              <Tooltip
+                                label={t(
+                                  "admin.settings.database.delete",
+                                  "Delete",
+                                )}
+                                withArrow
+                              >
+                                <ActionIcon
+                                  variant="subtle"
+                                  color="red"
+                                  onClick={() =>
+                                    handleDeleteClick(backup.fileName)
+                                  }
+                                  disabled={!loginEnabled || !isEmbeddedH2}
+                                >
+                                  {deletingFile === backup.fileName ? (
+                                    <Loader size="xs" />
+                                  ) : (
+                                    <LocalIcon
+                                      icon="delete"
+                                      width="1rem"
+                                      height="1rem"
+                                    />
+                                  )}
+                                </ActionIcon>
+                              </Tooltip>
+                            </Group>
+                          </Table.Td>
+                        </Table.Tr>
+                      ))}
+                    </Table.Tbody>
+                  </Table>
+                )}
+              </Stack>
+            </Paper>
+          )}
         </Stack>
-      </Modal>
+
+        {/* Restart Confirmation Modal */}
+        <RestartConfirmationModal
+          opened={restartModalOpened}
+          onClose={closeRestartModal}
+          onRestart={restartServer}
+        />
+
+        <Modal
+          opened={confirmImportOpen}
+          onClose={closeConfirmImportModal}
+          title={t(
+            "admin.settings.database.confirmImportTitle",
+            "Confirm database import",
+          )}
+          centered
+          withinPortal
+          zIndex={Z_INDEX_OVER_CONFIG_MODAL}
+        >
+          <Stack gap="md">
+            <Alert
+              color="red"
+              variant="light"
+              icon={<LocalIcon icon="warning" width="1.2rem" height="1.2rem" />}
+            >
+              <Text fw={600}>
+                {t(
+                  "admin.settings.database.overwriteWarning",
+                  "Warning: This will overwrite the current database.",
+                )}
+              </Text>
+              <Text size="sm" c="dimmed">
+                {t(
+                  "admin.settings.database.overwriteWarningBody",
+                  "All existing data will be replaced by the uploaded backup. This action cannot be undone.",
+                )}
+              </Text>
+            </Alert>
+            <Stack gap={6}>
+              <Text size="sm" fw={600}>
+                {t(
+                  "admin.settings.database.confirmCodeLabel",
+                  "Enter the confirmation code to proceed",
+                )}
+              </Text>
+              <Text size="lg" fw={700}>
+                {confirmCode}
+              </Text>
+              <TextInput
+                value={confirmInput}
+                onChange={(e) => setConfirmInput(e.currentTarget.value)}
+                placeholder={t(
+                  "admin.settings.database.enterCode",
+                  "Enter the code shown above",
+                )}
+                minLength={4}
+                maxLength={4}
+                disabled={importingUpload}
+              />
+            </Stack>
+            <Group justify="flex-end" gap="sm">
+              <Button
+                variant="default"
+                onClick={closeConfirmImportModal}
+                disabled={importingUpload}
+              >
+                {t("cancel", "Cancel")}
+              </Button>
+              <Button
+                color="red"
+                onClick={handleConfirmImport}
+                loading={importingUpload}
+                disabled={confirmInput.length === 0}
+              >
+                {t("admin.settings.database.confirmImport", "Confirm import")}
+              </Button>
+            </Group>
+          </Stack>
+        </Modal>
+
+        <Modal
+          opened={deleteConfirmFile !== null}
+          onClose={() => setDeleteConfirmFile(null)}
+          title={t("admin.settings.database.deleteTitle", "Delete backup")}
+          centered
+          withinPortal
+          zIndex={Z_INDEX_OVER_CONFIG_MODAL}
+        >
+          <Stack gap="md">
+            <Alert
+              color="red"
+              variant="light"
+              icon={<LocalIcon icon="warning" width="1.2rem" height="1.2rem" />}
+            >
+              <Text fw={600}>
+                {t(
+                  "admin.settings.database.deleteConfirm",
+                  "Delete this backup? This cannot be undone.",
+                )}
+              </Text>
+              <Text size="sm" c="dimmed">
+                {deleteConfirmFile}
+              </Text>
+            </Alert>
+            <Group justify="flex-end" gap="sm">
+              <Button
+                variant="default"
+                onClick={() => setDeleteConfirmFile(null)}
+                disabled={deletingFile !== null}
+              >
+                {t("cancel", "Cancel")}
+              </Button>
+              <Button
+                color="red"
+                onClick={() =>
+                  deleteConfirmFile && handleDelete(deleteConfirmFile)
+                }
+                loading={deletingFile === deleteConfirmFile}
+              >
+                {t(
+                  "admin.settings.database.deleteConfirmAction",
+                  "Delete backup",
+                )}
+              </Button>
+            </Group>
+          </Stack>
+        </Modal>
       </Stack>
     </div>
   );
diff --git a/frontend/src/proprietary/components/shared/config/configSections/AdminEndpointsSection.tsx b/frontend/src/proprietary/components/shared/config/configSections/AdminEndpointsSection.tsx
index 61a760192e..07f8c1e775 100644
--- a/frontend/src/proprietary/components/shared/config/configSections/AdminEndpointsSection.tsx
+++ b/frontend/src/proprietary/components/shared/config/configSections/AdminEndpointsSection.tsx
@@ -1,15 +1,23 @@
-import { useCallback, useEffect } from 'react';
-import { useTranslation } from 'react-i18next';
-import { Stack, Paper, Text, Loader, Group, MultiSelect, Switch } from '@mantine/core';
-import { alert } from '@app/components/toast';
-import RestartConfirmationModal from '@app/components/shared/config/RestartConfirmationModal';
-import { useRestartServer } from '@app/components/shared/config/useRestartServer';
-import { useAdminSettings } from '@app/hooks/useAdminSettings';
-import { useSettingsDirty } from '@app/hooks/useSettingsDirty';
-import PendingBadge from '@app/components/shared/config/PendingBadge';
-import { SettingsStickyFooter } from '@app/components/shared/config/SettingsStickyFooter';
-import { useLoginRequired } from '@app/hooks/useLoginRequired';
-import LoginRequiredBanner from '@app/components/shared/config/LoginRequiredBanner';
+import { useCallback, useEffect } from "react";
+import { useTranslation } from "react-i18next";
+import {
+  Stack,
+  Paper,
+  Text,
+  Loader,
+  Group,
+  MultiSelect,
+  Switch,
+} from "@mantine/core";
+import { alert } from "@app/components/toast";
+import RestartConfirmationModal from "@app/components/shared/config/RestartConfirmationModal";
+import { useRestartServer } from "@app/components/shared/config/useRestartServer";
+import { useAdminSettings } from "@app/hooks/useAdminSettings";
+import { useSettingsDirty } from "@app/hooks/useSettingsDirty";
+import PendingBadge from "@app/components/shared/config/PendingBadge";
+import { SettingsStickyFooter } from "@app/components/shared/config/SettingsStickyFooter";
+import { useLoginRequired } from "@app/hooks/useLoginRequired";
+import LoginRequiredBanner from "@app/components/shared/config/LoginRequiredBanner";
 
 interface UISettingsData {
   defaultHideUnavailableTools?: boolean;
@@ -24,7 +32,12 @@ interface EndpointsSettingsData {
 export default function AdminEndpointsSection() {
   const { t } = useTranslation();
   const { loginEnabled, validateLoginEnabled } = useLoginRequired();
-  const { restartModalOpened, showRestartModal, closeRestartModal, restartServer } = useRestartServer();
+  const {
+    restartModalOpened,
+    showRestartModal,
+    closeRestartModal,
+    restartServer,
+  } = useRestartServer();
 
   const {
     settings,
@@ -35,7 +48,7 @@ export default function AdminEndpointsSection() {
     saveSettings,
     isFieldPending,
   } = useAdminSettings<EndpointsSettingsData>({
-    sectionName: 'endpoints',
+    sectionName: "endpoints",
   });
 
   const {
@@ -47,7 +60,7 @@ export default function AdminEndpointsSection() {
     saveSettings: saveUiSettings,
     isFieldPending: isUiFieldPending,
   } = useAdminSettings<UISettingsData>({
-    sectionName: 'ui',
+    sectionName: "ui",
   });
 
   useEffect(() => {
@@ -57,8 +70,16 @@ export default function AdminEndpointsSection() {
     }
   }, [loginEnabled, fetchSettings, fetchUiSettings]);
 
-  const { isDirty: isEndpointsDirty, resetToSnapshot: resetEndpointsSnapshot, markSaved: markEndpointsSaved } = useSettingsDirty(settings, loading);
-  const { isDirty: isUiDirty, resetToSnapshot: resetUiSnapshot, markSaved: markUiSaved } = useSettingsDirty(uiSettings, uiLoading);
+  const {
+    isDirty: isEndpointsDirty,
+    resetToSnapshot: resetEndpointsSnapshot,
+    markSaved: markEndpointsSaved,
+  } = useSettingsDirty(settings, loading);
+  const {
+    isDirty: isUiDirty,
+    resetToSnapshot: resetUiSnapshot,
+    markSaved: markUiSaved,
+  } = useSettingsDirty(uiSettings, uiLoading);
 
   const isDirty = isEndpointsDirty || isUiDirty;
 
@@ -79,9 +100,9 @@ export default function AdminEndpointsSection() {
       showRestartModal();
     } catch (_error) {
       alert({
-        alertType: 'error',
-        title: t('admin.error', 'Error'),
-        body: t('admin.settings.saveError', 'Failed to save settings'),
+        alertType: "error",
+        title: t("admin.error", "Error"),
+        body: t("admin.settings.saveError", "Failed to save settings"),
       });
     }
   };
@@ -95,10 +116,17 @@ export default function AdminEndpointsSection() {
       const original = resetUiSnapshot();
       setUiSettings(original);
     }
-  }, [isEndpointsDirty, isUiDirty, resetEndpointsSnapshot, resetUiSnapshot, setSettings, setUiSettings]);
+  }, [
+    isEndpointsDirty,
+    isUiDirty,
+    resetEndpointsSnapshot,
+    resetUiSnapshot,
+    setSettings,
+    setUiSettings,
+  ]);
 
   // Override loading state when login is disabled
-  const actualLoading = loginEnabled ? (loading || uiLoading) : false;
+  const actualLoading = loginEnabled ? loading || uiLoading : false;
 
   if (actualLoading) {
     return (
@@ -110,111 +138,111 @@ export default function AdminEndpointsSection() {
 
   // Complete list of all endpoints from frontend tool registry (alphabetical)
   const commonEndpoints = [
-    'add-attachments',
-    'add-image',
-    'add-page-numbers',
-    'add-password',
-    'add-stamp',
-    'add-watermark',
-    'adjust-contrast',
-    'auto-redact',
-    'auto-rename',
-    'auto-split-pdf',
-    'automate',
-    'booklet-imposition',
-    'cert-sign',
-    'compare',
-    'compress-pdf',
-    'crop',
-    'dev-airgapped-docs',
-    'dev-api-docs',
-    'dev-folder-scanning-docs',
-    'dev-sso-guide-docs',
-    'edit-table-of-contents',
-    'eml-to-pdf',
-    'extract-image-scans',
-    'extract-images',
-    'file-to-pdf',
-    'flatten',
-    'get-info-on-pdf',
-    'handleData',
-    'html-to-pdf',
-    'img-to-pdf',
-    'markdown-to-pdf',
-    'merge-pdfs',
-    'multi-page-layout',
-    'multi-tool',
-    'ocr-pdf',
-    'overlay-pdf',
-    'pdf-to-csv',
-    'pdf-to-xlsx',
-    'pdf-to-epub',
-    'pdf-to-html',
-    'pdf-to-img',
-    'pdf-to-markdown',
-    'pdf-to-pdfa',
-    'pdf-to-presentation',
-    'pdf-to-single-page',
-    'pdf-to-text',
-    'pdf-to-word',
-    'pdf-to-xml',
-    'pipeline',
-    'rearrange-pages',
-    'remove-annotations',
-    'remove-blanks',
-    'remove-cert-sign',
-    'remove-image-pdf',
-    'remove-pages',
-    'remove-password',
-    'repair',
-    'replace-invert-pdf',
-    'rotate-pdf',
-    'sanitize-pdf',
-    'scale-pages',
-    'scanner-effect',
-    'show-javascript',
-    'sign',
-    'split-by-size-or-count',
-    'split-pages',
-    'split-pdf-by-chapters',
-    'split-pdf-by-sections',
-    'text-editor-pdf',
-    'unlock-pdf-forms',
-    'update-metadata',
-    'validate-signature',
-    'view-pdf',
+    "add-attachments",
+    "add-image",
+    "add-page-numbers",
+    "add-password",
+    "add-stamp",
+    "add-watermark",
+    "adjust-contrast",
+    "auto-redact",
+    "auto-rename",
+    "auto-split-pdf",
+    "automate",
+    "booklet-imposition",
+    "cert-sign",
+    "compare",
+    "compress-pdf",
+    "crop",
+    "dev-airgapped-docs",
+    "dev-api-docs",
+    "dev-folder-scanning-docs",
+    "dev-sso-guide-docs",
+    "edit-table-of-contents",
+    "eml-to-pdf",
+    "extract-image-scans",
+    "extract-images",
+    "file-to-pdf",
+    "flatten",
+    "get-info-on-pdf",
+    "handleData",
+    "html-to-pdf",
+    "img-to-pdf",
+    "markdown-to-pdf",
+    "merge-pdfs",
+    "multi-page-layout",
+    "multi-tool",
+    "ocr-pdf",
+    "overlay-pdf",
+    "pdf-to-csv",
+    "pdf-to-xlsx",
+    "pdf-to-epub",
+    "pdf-to-html",
+    "pdf-to-img",
+    "pdf-to-markdown",
+    "pdf-to-pdfa",
+    "pdf-to-presentation",
+    "pdf-to-single-page",
+    "pdf-to-text",
+    "pdf-to-word",
+    "pdf-to-xml",
+    "pipeline",
+    "rearrange-pages",
+    "remove-annotations",
+    "remove-blanks",
+    "remove-cert-sign",
+    "remove-image-pdf",
+    "remove-pages",
+    "remove-password",
+    "repair",
+    "replace-invert-pdf",
+    "rotate-pdf",
+    "sanitize-pdf",
+    "scale-pages",
+    "scanner-effect",
+    "show-javascript",
+    "sign",
+    "split-by-size-or-count",
+    "split-pages",
+    "split-pdf-by-chapters",
+    "split-pdf-by-sections",
+    "text-editor-pdf",
+    "unlock-pdf-forms",
+    "update-metadata",
+    "validate-signature",
+    "view-pdf",
   ];
 
   // Complete list of functional and tool groups from EndpointConfiguration.java
   const commonGroups = [
     // Functional Groups
-    'PageOps',
-    'Convert',
-    'Security',
-    'Other',
-    'Advance',
-    'Automation',
-    'DeveloperTools',
-    'DeveloperDocs',
+    "PageOps",
+    "Convert",
+    "Security",
+    "Other",
+    "Advance",
+    "Automation",
+    "DeveloperTools",
+    "DeveloperDocs",
     // Tool Groups
-    'CLI',
-    'Python',
-    'OpenCV',
-    'LibreOffice',
-    'Unoconvert',
-    'Java',
-    'Javascript',
-    'qpdf',
-    'Ghostscript',
-    'ImageMagick',
-    'tesseract',
-    'OCRmyPDF',
-    'Weasyprint',
-    'Pdftohtml',
-    'Calibre',
-    'FFmpeg',
-    'veraPDF',
-    'rar',
+    "CLI",
+    "Python",
+    "OpenCV",
+    "LibreOffice",
+    "Unoconvert",
+    "Java",
+    "Javascript",
+    "qpdf",
+    "Ghostscript",
+    "ImageMagick",
+    "tesseract",
+    "OCRmyPDF",
+    "Weasyprint",
+    "Pdftohtml",
+    "Calibre",
+    "FFmpeg",
+    "veraPDF",
+    "rar",
   ];
 
   return (
@@ -222,107 +250,170 @@ export default function AdminEndpointsSection() {
       <Stack gap="lg" className="settings-section-content">
         <LoginRequiredBanner show={!loginEnabled} />
 
-      <div>
-        <Text fw={600} size="lg">{t('admin.settings.endpoints.title', 'API Endpoints')}</Text>
-        <Text size="sm" c="dimmed">
-          {t('admin.settings.endpoints.description', 'Control which API endpoints and endpoint groups are available.')}
-        </Text>
-      </div>
+        <div>
+          <Text fw={600} size="lg">
+            {t("admin.settings.endpoints.title", "API Endpoints")}
+          </Text>
+          <Text size="sm" c="dimmed">
+            {t(
+              "admin.settings.endpoints.description",
+              "Control which API endpoints and endpoint groups are available.",
+            )}
+          </Text>
+        </div>
 
-      <Paper withBorder p="md" radius="md">
-        <Stack gap="md">
-          <Text fw={600} size="sm" mb="xs">{t('admin.settings.endpoints.management', 'Endpoint Management')}</Text>
-
-          <div>
-            <MultiSelect
-              label={
-                <Group gap="xs">
-                  <span>{t('admin.settings.endpoints.toRemove.label', 'Disabled Endpoints')}</span>
-                  <PendingBadge show={isFieldPending('toRemove')} />
-                </Group>
-              }
-              description={t('admin.settings.endpoints.toRemove.description', 'Select individual endpoints to disable')}
-              value={settings.toRemove || []}
-              onChange={(value) => {
-                if (!loginEnabled) return;
-                setSettings({ ...settings, toRemove: value });
-              }}
-              data={commonEndpoints.map(endpoint => ({ value: endpoint, label: endpoint }))}
-              searchable
-              clearable
-              placeholder="Select endpoints to disable"
-              comboboxProps={{ zIndex: 1400 }}
-              disabled={!loginEnabled}
-            />
-          </div>
-
-          <div>
-            <MultiSelect
-              label={
-                <Group gap="xs">
-                  <span>{t('admin.settings.endpoints.groupsToRemove.label', 'Disabled Endpoint Groups')}</span>
-                  <PendingBadge show={isFieldPending('groupsToRemove')} />
-                </Group>
-              }
-              description={t('admin.settings.endpoints.groupsToRemove.description', 'Select endpoint groups to disable')}
-              value={settings.groupsToRemove || []}
-              onChange={(value) => {
-                if (!loginEnabled) return;
-                setSettings({ ...settings, groupsToRemove: value });
-              }}
-              data={commonGroups.map(group => ({ value: group, label: group }))}
-              searchable
-              clearable
-              placeholder="Select groups to disable"
-              comboboxProps={{ zIndex: 1400 }}
-              disabled={!loginEnabled}
-            />
-          </div>
-        </Stack>
-      </Paper>
-
-      <Paper withBorder p="md" radius="md">
-        <Stack gap="md">
-          <div>
-            <Text fw={600} size="sm" mb="xs">{t('admin.settings.endpoints.userDefaults', 'User Preference Defaults')}</Text>
-            <Text size="xs" c="dimmed">
-              {t('admin.settings.endpoints.userDefaultsDescription', 'Set default values for user preferences. Users can override these in their personal settings.')}
+        <Paper withBorder p="md" radius="md">
+          <Stack gap="md">
+            <Text fw={600} size="sm" mb="xs">
+              {t("admin.settings.endpoints.management", "Endpoint Management")}
             </Text>
-          </div>
 
-          <Switch
-            label={
-              <Group gap="xs">
-                <span>{t('admin.settings.endpoints.defaultHideUnavailableTools.label', 'Hide unavailable tools by default')}</span>
-                <PendingBadge show={isUiFieldPending('defaultHideUnavailableTools')} />
-              </Group>
-            }
-            description={t('admin.settings.endpoints.defaultHideUnavailableTools.description', 'Remove disabled tools instead of showing them greyed out')}
-            checked={uiSettings.defaultHideUnavailableTools || false}
-            onChange={(e) => {
-              if (!loginEnabled) return;
-              setUiSettings({ ...uiSettings, defaultHideUnavailableTools: e.currentTarget.checked });
-            }}
-            disabled={!loginEnabled}
-          />
+            <div>
+              <MultiSelect
+                label={
+                  <Group gap="xs">
+                    <span>
+                      {t(
+                        "admin.settings.endpoints.toRemove.label",
+                        "Disabled Endpoints",
+                      )}
+                    </span>
+                    <PendingBadge show={isFieldPending("toRemove")} />
+                  </Group>
+                }
+                description={t(
+                  "admin.settings.endpoints.toRemove.description",
+                  "Select individual endpoints to disable",
+                )}
+                value={settings.toRemove || []}
+                onChange={(value) => {
+                  if (!loginEnabled) return;
+                  setSettings({ ...settings, toRemove: value });
+                }}
+                data={commonEndpoints.map((endpoint) => ({
+                  value: endpoint,
+                  label: endpoint,
+                }))}
+                searchable
+                clearable
+                placeholder="Select endpoints to disable"
+                comboboxProps={{ zIndex: 1400 }}
+                disabled={!loginEnabled}
+              />
+            </div>
 
-          <Switch
-            label={
-              <Group gap="xs">
-                <span>{t('admin.settings.endpoints.defaultHideUnavailableConversions.label', 'Hide unavailable conversions by default')}</span>
-                <PendingBadge show={isUiFieldPending('defaultHideUnavailableConversions')} />
-              </Group>
-            }
-            description={t('admin.settings.endpoints.defaultHideUnavailableConversions.description', 'Remove disabled conversion options instead of showing them greyed out')}
-            checked={uiSettings.defaultHideUnavailableConversions || false}
-            onChange={(e) => {
-              if (!loginEnabled) return;
-              setUiSettings({ ...uiSettings, defaultHideUnavailableConversions: e.currentTarget.checked });
-            }}
-            disabled={!loginEnabled}
-          />
-        </Stack>
-      </Paper>
+            <div>
+              <MultiSelect
+                label={
+                  <Group gap="xs">
+                    <span>
+                      {t(
+                        "admin.settings.endpoints.groupsToRemove.label",
+                        "Disabled Endpoint Groups",
+                      )}
+                    </span>
+                    <PendingBadge show={isFieldPending("groupsToRemove")} />
+                  </Group>
+                }
+                description={t(
+                  "admin.settings.endpoints.groupsToRemove.description",
+                  "Select endpoint groups to disable",
+                )}
+                value={settings.groupsToRemove || []}
+                onChange={(value) => {
+                  if (!loginEnabled) return;
+                  setSettings({ ...settings, groupsToRemove: value });
+                }}
+                data={commonGroups.map((group) => ({
+                  value: group,
+                  label: group,
+                }))}
+                searchable
+                clearable
+                placeholder="Select groups to disable"
+                comboboxProps={{ zIndex: 1400 }}
+                disabled={!loginEnabled}
+              />
+            </div>
+          </Stack>
+        </Paper>
+
+        <Paper withBorder p="md" radius="md">
+          <Stack gap="md">
+            <div>
+              <Text fw={600} size="sm" mb="xs">
+                {t(
+                  "admin.settings.endpoints.userDefaults",
+                  "User Preference Defaults",
+                )}
+              </Text>
+              <Text size="xs" c="dimmed">
+                {t(
+                  "admin.settings.endpoints.userDefaultsDescription",
+                  "Set default values for user preferences. Users can override these in their personal settings.",
+                )}
+              </Text>
+            </div>
+
+            <Switch
+              label={
+                <Group gap="xs">
+                  <span>
+                    {t(
+                      "admin.settings.endpoints.defaultHideUnavailableTools.label",
+                      "Hide unavailable tools by default",
+                    )}
+                  </span>
+                  <PendingBadge
+                    show={isUiFieldPending("defaultHideUnavailableTools")}
+                  />
+                </Group>
+              }
+              description={t(
+                "admin.settings.endpoints.defaultHideUnavailableTools.description",
+                "Remove disabled tools instead of showing them greyed out",
+              )}
+              checked={uiSettings.defaultHideUnavailableTools || false}
+              onChange={(e) => {
+                if (!loginEnabled) return;
+                setUiSettings({
+                  ...uiSettings,
+                  defaultHideUnavailableTools: e.currentTarget.checked,
+                });
+              }}
+              disabled={!loginEnabled}
+            />
+
+            <Switch
+              label={
+                <Group gap="xs">
+                  <span>
+                    {t(
+                      "admin.settings.endpoints.defaultHideUnavailableConversions.label",
+                      "Hide unavailable conversions by default",
+                    )}
+                  </span>
+                  <PendingBadge
+                    show={isUiFieldPending("defaultHideUnavailableConversions")}
+                  />
+                </Group>
+              }
+              description={t(
+                "admin.settings.endpoints.defaultHideUnavailableConversions.description",
+                "Remove disabled conversion options instead of showing them greyed out",
+              )}
+              checked={uiSettings.defaultHideUnavailableConversions || false}
+              onChange={(e) => {
+                if (!loginEnabled) return;
+                setUiSettings({
+                  ...uiSettings,
+                  defaultHideUnavailableConversions: e.currentTarget.checked,
+                });
+              }}
+              disabled={!loginEnabled}
+            />
+          </Stack>
+        </Paper>
       </Stack>
 
       <SettingsStickyFooter
diff --git a/frontend/src/proprietary/components/shared/config/configSections/AdminFeaturesSection.tsx b/frontend/src/proprietary/components/shared/config/configSections/AdminFeaturesSection.tsx
index ed9b6a1300..0e85990c6e 100644
--- a/frontend/src/proprietary/components/shared/config/configSections/AdminFeaturesSection.tsx
+++ b/frontend/src/proprietary/components/shared/config/configSections/AdminFeaturesSection.tsx
@@ -1,17 +1,27 @@
-import { useCallback, useEffect } from 'react';
-import { useTranslation } from 'react-i18next';
-import { useNavigate } from 'react-router-dom';
-import { TextInput, NumberInput, Switch, Stack, Paper, Text, Loader, Group, Badge } from '@mantine/core';
-import { alert } from '@app/components/toast';
-import RestartConfirmationModal from '@app/components/shared/config/RestartConfirmationModal';
-import { useRestartServer } from '@app/components/shared/config/useRestartServer';
-import { useAdminSettings } from '@app/hooks/useAdminSettings';
-import { useSettingsDirty } from '@app/hooks/useSettingsDirty';
-import PendingBadge from '@app/components/shared/config/PendingBadge';
-import { SettingsStickyFooter } from '@app/components/shared/config/SettingsStickyFooter';
-import apiClient from '@app/services/apiClient';
-import { useLoginRequired } from '@app/hooks/useLoginRequired';
-import LoginRequiredBanner from '@app/components/shared/config/LoginRequiredBanner';
+import { useCallback, useEffect } from "react";
+import { useTranslation } from "react-i18next";
+import { useNavigate } from "react-router-dom";
+import {
+  TextInput,
+  NumberInput,
+  Switch,
+  Stack,
+  Paper,
+  Text,
+  Loader,
+  Group,
+  Badge,
+} from "@mantine/core";
+import { alert } from "@app/components/toast";
+import RestartConfirmationModal from "@app/components/shared/config/RestartConfirmationModal";
+import { useRestartServer } from "@app/components/shared/config/useRestartServer";
+import { useAdminSettings } from "@app/hooks/useAdminSettings";
+import { useSettingsDirty } from "@app/hooks/useSettingsDirty";
+import PendingBadge from "@app/components/shared/config/PendingBadge";
+import { SettingsStickyFooter } from "@app/components/shared/config/SettingsStickyFooter";
+import apiClient from "@app/services/apiClient";
+import { useLoginRequired } from "@app/hooks/useLoginRequired";
+import LoginRequiredBanner from "@app/components/shared/config/LoginRequiredBanner";
 
 interface FeaturesSettingsData {
   serverCertificate?: {
@@ -25,8 +35,14 @@ interface FeaturesSettingsData {
 export default function AdminFeaturesSection() {
   const { t } = useTranslation();
   const navigate = useNavigate();
-  const { loginEnabled, validateLoginEnabled, getDisabledStyles } = useLoginRequired();
-  const { restartModalOpened, showRestartModal, closeRestartModal, restartServer } = useRestartServer();
+  const { loginEnabled, validateLoginEnabled, getDisabledStyles } =
+    useLoginRequired();
+  const {
+    restartModalOpened,
+    showRestartModal,
+    closeRestartModal,
+    restartServer,
+  } = useRestartServer();
 
   const {
     settings,
@@ -37,42 +53,54 @@ export default function AdminFeaturesSection() {
     saveSettings,
     isFieldPending,
   } = useAdminSettings<FeaturesSettingsData>({
-    sectionName: 'features',
-    fetchTransformer: async (): Promise<FeaturesSettingsData & { _pending?: Record<string, any> }> => {
-      const systemResponse = await apiClient.get('/api/v1/admin/settings/section/system');
+    sectionName: "features",
+    fetchTransformer: async (): Promise<
+      FeaturesSettingsData & { _pending?: Record<string, unknown> }
+    > => {
+      const systemResponse = await apiClient.get(
+        "/api/v1/admin/settings/section/system",
+      );
       const systemData = systemResponse.data || {};
 
-      const result: FeaturesSettingsData & { _pending?: Record<string, any> } = {
+      const result: FeaturesSettingsData & {
+        _pending?: Record<string, unknown>;
+      } = {
         serverCertificate: systemData.serverCertificate || {
           enabled: true,
-          organizationName: 'Stirling-PDF',
+          organizationName: "Stirling-PDF",
           validity: 365,
-          regenerateOnStartup: false
-        }
+          regenerateOnStartup: false,
+        },
       };
 
       // Map pending changes from system._pending.serverCertificate
       if (systemData._pending?.serverCertificate) {
-        result._pending = { serverCertificate: systemData._pending.serverCertificate };
+        result._pending = {
+          serverCertificate: systemData._pending.serverCertificate,
+        };
       }
 
       return result;
     },
     saveTransformer: (settings: FeaturesSettingsData) => {
-      const deltaSettings: Record<string, any> = {};
+      const deltaSettings: Record<string, unknown> = {};
 
       if (settings.serverCertificate) {
-        deltaSettings['system.serverCertificate.enabled'] = settings.serverCertificate.enabled;
-        deltaSettings['system.serverCertificate.organizationName'] = settings.serverCertificate.organizationName;
-        deltaSettings['system.serverCertificate.validity'] = settings.serverCertificate.validity;
-        deltaSettings['system.serverCertificate.regenerateOnStartup'] = settings.serverCertificate.regenerateOnStartup;
+        deltaSettings["system.serverCertificate.enabled"] =
+          settings.serverCertificate.enabled;
+        deltaSettings["system.serverCertificate.organizationName"] =
+          settings.serverCertificate.organizationName;
+        deltaSettings["system.serverCertificate.validity"] =
+          settings.serverCertificate.validity;
+        deltaSettings["system.serverCertificate.regenerateOnStartup"] =
+          settings.serverCertificate.regenerateOnStartup;
       }
 
       return {
         sectionData: {},
-        deltaSettings
+        deltaSettings,
       };
-    }
+    },
   });
 
   useEffect(() => {
@@ -81,7 +109,10 @@ export default function AdminFeaturesSection() {
     }
   }, [loginEnabled]);
 
-  const { isDirty, resetToSnapshot, markSaved } = useSettingsDirty(settings, loading);
+  const { isDirty, resetToSnapshot, markSaved } = useSettingsDirty(
+    settings,
+    loading,
+  );
 
   const handleSave = async () => {
     if (!validateLoginEnabled()) {
@@ -93,9 +124,9 @@ export default function AdminFeaturesSection() {
       showRestartModal();
     } catch (_error) {
       alert({
-        alertType: 'error',
-        title: t('admin.error', 'Error'),
-        body: t('admin.settings.saveError', 'Failed to save settings'),
+        alertType: "error",
+        title: t("admin.error", "Error"),
+        body: t("admin.settings.saveError", "Failed to save settings"),
       });
     }
   };
@@ -119,121 +150,211 @@ export default function AdminFeaturesSection() {
     <div className="settings-section-container">
       <Stack gap="lg" className="settings-section-content">
         <LoginRequiredBanner show={!loginEnabled} />
-      <div>
-        <Text fw={600} size="lg">{t('admin.settings.features.title', 'Features')}</Text>
-        <Text size="sm" c="dimmed">
-          {t('admin.settings.features.description', 'Configure optional features and functionality.')}
-        </Text>
-      </div>
-
-      {/* Server Certificate - Pro Feature */}
-      <Paper withBorder p="md" radius="md">
-        <Stack gap="md">
-          <Group justify="space-between" align="center">
-            <Text fw={600} size="sm">{t('admin.settings.features.serverCertificate.label', 'Server Certificate')}</Text>
-            <Badge
-              color="grape"
-              size="sm"
-              style={{ cursor: 'pointer' }}
-              onClick={() => navigate('/settings/adminPlan')}
-              title={t('admin.settings.badge.clickToUpgrade', 'Click to view plan details')}
-            >
-              PRO
-            </Badge>
-          </Group>
-
-          <Text size="xs" c="dimmed">
-            {t('admin.settings.features.serverCertificate.description', 'Configure server-side certificate generation for "Sign with Stirling-PDF" functionality')}
+        <div>
+          <Text fw={600} size="lg">
+            {t("admin.settings.features.title", "Features")}
           </Text>
+          <Text size="sm" c="dimmed">
+            {t(
+              "admin.settings.features.description",
+              "Configure optional features and functionality.",
+            )}
+          </Text>
+        </div>
 
-          <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}>
-            <div>
-              <Text fw={500} size="sm">{t('admin.settings.features.serverCertificate.enabled.label', 'Enable Server Certificate')}</Text>
-              <Text size="xs" c="dimmed" mt={4}>
-                {t('admin.settings.features.serverCertificate.enabled.description', 'Enable server-side certificate for "Sign with Stirling-PDF" option')}
+        {/* Server Certificate - Pro Feature */}
+        <Paper withBorder p="md" radius="md">
+          <Stack gap="md">
+            <Group justify="space-between" align="center">
+              <Text fw={600} size="sm">
+                {t(
+                  "admin.settings.features.serverCertificate.label",
+                  "Server Certificate",
+                )}
               </Text>
+              <Badge
+                color="grape"
+                size="sm"
+                style={{ cursor: "pointer" }}
+                onClick={() => navigate("/settings/adminPlan")}
+                title={t(
+                  "admin.settings.badge.clickToUpgrade",
+                  "Click to view plan details",
+                )}
+              >
+                PRO
+              </Badge>
+            </Group>
+
+            <Text size="xs" c="dimmed">
+              {t(
+                "admin.settings.features.serverCertificate.description",
+                'Configure server-side certificate generation for "Sign with Stirling-PDF" functionality',
+              )}
+            </Text>
+
+            <div
+              style={{
+                display: "flex",
+                alignItems: "center",
+                justifyContent: "space-between",
+              }}
+            >
+              <div>
+                <Text fw={500} size="sm">
+                  {t(
+                    "admin.settings.features.serverCertificate.enabled.label",
+                    "Enable Server Certificate",
+                  )}
+                </Text>
+                <Text size="xs" c="dimmed" mt={4}>
+                  {t(
+                    "admin.settings.features.serverCertificate.enabled.description",
+                    'Enable server-side certificate for "Sign with Stirling-PDF" option',
+                  )}
+                </Text>
+              </div>
+              <Group gap="xs">
+                <Switch
+                  checked={settings.serverCertificate?.enabled ?? true}
+                  onChange={(e) => {
+                    if (!loginEnabled) return;
+                    setSettings({
+                      ...settings,
+                      serverCertificate: {
+                        ...settings.serverCertificate,
+                        enabled: e.target.checked,
+                      },
+                    });
+                  }}
+                  disabled={!loginEnabled}
+                  styles={getDisabledStyles()}
+                />
+                <PendingBadge
+                  show={isFieldPending("serverCertificate.enabled")}
+                />
+              </Group>
             </div>
-            <Group gap="xs">
-              <Switch
-                checked={settings.serverCertificate?.enabled ?? true}
-                onChange={(e) => {
-                  if (!loginEnabled) return;
+
+            <div>
+              <TextInput
+                label={
+                  <Group gap="xs">
+                    <span>
+                      {t(
+                        "admin.settings.features.serverCertificate.organizationName.label",
+                        "Organization Name",
+                      )}
+                    </span>
+                    <PendingBadge
+                      show={isFieldPending(
+                        "serverCertificate.organizationName",
+                      )}
+                    />
+                  </Group>
+                }
+                description={t(
+                  "admin.settings.features.serverCertificate.organizationName.description",
+                  "Organization name for generated certificates",
+                )}
+                value={
+                  settings.serverCertificate?.organizationName || "Stirling-PDF"
+                }
+                onChange={(e) =>
                   setSettings({
                     ...settings,
-                    serverCertificate: { ...settings.serverCertificate, enabled: e.target.checked }
-                  });
-                }}
+                    serverCertificate: {
+                      ...settings.serverCertificate,
+                      organizationName: e.target.value,
+                    },
+                  })
+                }
+                placeholder="Stirling-PDF"
                 disabled={!loginEnabled}
-                styles={getDisabledStyles()}
               />
-              <PendingBadge show={isFieldPending('serverCertificate.enabled')} />
-            </Group>
-          </div>
-
-          <div>
-            <TextInput
-              label={
-                <Group gap="xs">
-                  <span>{t('admin.settings.features.serverCertificate.organizationName.label', 'Organization Name')}</span>
-                  <PendingBadge show={isFieldPending('serverCertificate.organizationName')} />
-                </Group>
-              }
-              description={t('admin.settings.features.serverCertificate.organizationName.description', 'Organization name for generated certificates')}
-              value={settings.serverCertificate?.organizationName || 'Stirling-PDF'}
-              onChange={(e) => setSettings({
-                ...settings,
-                serverCertificate: { ...settings.serverCertificate, organizationName: e.target.value }
-              })}
-              placeholder="Stirling-PDF"
-              disabled={!loginEnabled}
-            />
-          </div>
-
-          <div>
-            <NumberInput
-              label={
-                <Group gap="xs">
-                  <span>{t('admin.settings.features.serverCertificate.validity.label', 'Certificate Validity (days)')}</span>
-                  <PendingBadge show={isFieldPending('serverCertificate.validity')} />
-                </Group>
-              }
-              description={t('admin.settings.features.serverCertificate.validity.description', 'Number of days the certificate will be valid')}
-              value={settings.serverCertificate?.validity ?? 365}
-              onChange={(value) => setSettings({
-                ...settings,
-                serverCertificate: { ...settings.serverCertificate, validity: Number(value) }
-              })}
-              min={1}
-              max={3650}
-              disabled={!loginEnabled}
-            />
-          </div>
-
-          <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}>
-            <div>
-              <Text fw={500} size="sm">{t('admin.settings.features.serverCertificate.regenerateOnStartup.label', 'Regenerate on Startup')}</Text>
-              <Text size="xs" c="dimmed" mt={4}>
-                {t('admin.settings.features.serverCertificate.regenerateOnStartup.description', 'Generate new certificate on each application startup')}
-              </Text>
             </div>
-            <Group gap="xs">
-              <Switch
-                checked={settings.serverCertificate?.regenerateOnStartup ?? false}
-                onChange={(e) => {
-                  if (!loginEnabled) return;
+
+            <div>
+              <NumberInput
+                label={
+                  <Group gap="xs">
+                    <span>
+                      {t(
+                        "admin.settings.features.serverCertificate.validity.label",
+                        "Certificate Validity (days)",
+                      )}
+                    </span>
+                    <PendingBadge
+                      show={isFieldPending("serverCertificate.validity")}
+                    />
+                  </Group>
+                }
+                description={t(
+                  "admin.settings.features.serverCertificate.validity.description",
+                  "Number of days the certificate will be valid",
+                )}
+                value={settings.serverCertificate?.validity ?? 365}
+                onChange={(value) =>
                   setSettings({
                     ...settings,
-                    serverCertificate: { ...settings.serverCertificate, regenerateOnStartup: e.target.checked }
-                  });
-                }}
+                    serverCertificate: {
+                      ...settings.serverCertificate,
+                      validity: Number(value),
+                    },
+                  })
+                }
+                min={1}
+                max={3650}
                 disabled={!loginEnabled}
-                styles={getDisabledStyles()}
               />
-              <PendingBadge show={isFieldPending('serverCertificate.regenerateOnStartup')} />
-            </Group>
-          </div>
-        </Stack>
-      </Paper>
+            </div>
+
+            <div
+              style={{
+                display: "flex",
+                alignItems: "center",
+                justifyContent: "space-between",
+              }}
+            >
+              <div>
+                <Text fw={500} size="sm">
+                  {t(
+                    "admin.settings.features.serverCertificate.regenerateOnStartup.label",
+                    "Regenerate on Startup",
+                  )}
+                </Text>
+                <Text size="xs" c="dimmed" mt={4}>
+                  {t(
+                    "admin.settings.features.serverCertificate.regenerateOnStartup.description",
+                    "Generate new certificate on each application startup",
+                  )}
+                </Text>
+              </div>
+              <Group gap="xs">
+                <Switch
+                  checked={
+                    settings.serverCertificate?.regenerateOnStartup ?? false
+                  }
+                  onChange={(e) => {
+                    if (!loginEnabled) return;
+                    setSettings({
+                      ...settings,
+                      serverCertificate: {
+                        ...settings.serverCertificate,
+                        regenerateOnStartup: e.target.checked,
+                      },
+                    });
+                  }}
+                  disabled={!loginEnabled}
+                  styles={getDisabledStyles()}
+                />
+                <PendingBadge
+                  show={isFieldPending("serverCertificate.regenerateOnStartup")}
+                />
+              </Group>
+            </div>
+          </Stack>
+        </Paper>
       </Stack>
 
       <SettingsStickyFooter
diff --git a/frontend/src/proprietary/components/shared/config/configSections/AdminGeneralSection.tsx b/frontend/src/proprietary/components/shared/config/configSections/AdminGeneralSection.tsx
index 9ca8a60303..709c3565f3 100644
--- a/frontend/src/proprietary/components/shared/config/configSections/AdminGeneralSection.tsx
+++ b/frontend/src/proprietary/components/shared/config/configSections/AdminGeneralSection.tsx
@@ -1,27 +1,44 @@
-import { useEffect, useCallback, useMemo } from 'react';
-import { useTranslation } from 'react-i18next';
-import { useLocation, useNavigate } from 'react-router-dom';
-import { TextInput, Textarea, Switch, Stack, Paper, Text, Loader, Group, MultiSelect, Badge, SegmentedControl, Select } from '@mantine/core';
-import { alert } from '@app/components/toast';
-import RestartConfirmationModal from '@app/components/shared/config/RestartConfirmationModal';
-import { useRestartServer } from '@app/components/shared/config/useRestartServer';
-import { useAdminSettings } from '@app/hooks/useAdminSettings';
-import { useSettingsDirty } from '@app/hooks/useSettingsDirty';
-import PendingBadge from '@app/components/shared/config/PendingBadge';
-import { SettingsStickyFooter } from '@app/components/shared/config/SettingsStickyFooter';
-import apiClient from '@app/services/apiClient';
-import { useLoginRequired } from '@app/hooks/useLoginRequired';
-import LoginRequiredBanner from '@app/components/shared/config/LoginRequiredBanner';
-import { usePreferences } from '@app/contexts/PreferencesContext';
-import { useUnsavedChanges } from '@app/contexts/UnsavedChangesContext';
-import { supportedLanguages, toUnderscoreFormat, toUnderscoreLanguages } from '@app/i18n';
-import { Z_INDEX_CONFIG_MODAL } from '@app/styles/zIndex';
+import { useEffect, useCallback, useMemo } from "react";
+import { useTranslation } from "react-i18next";
+import { useLocation, useNavigate } from "react-router-dom";
+import {
+  TextInput,
+  Textarea,
+  Switch,
+  Stack,
+  Paper,
+  Text,
+  Loader,
+  Group,
+  MultiSelect,
+  Badge,
+  SegmentedControl,
+  Select,
+} from "@mantine/core";
+import { alert } from "@app/components/toast";
+import RestartConfirmationModal from "@app/components/shared/config/RestartConfirmationModal";
+import { useRestartServer } from "@app/components/shared/config/useRestartServer";
+import { useAdminSettings } from "@app/hooks/useAdminSettings";
+import { useSettingsDirty } from "@app/hooks/useSettingsDirty";
+import PendingBadge from "@app/components/shared/config/PendingBadge";
+import { SettingsStickyFooter } from "@app/components/shared/config/SettingsStickyFooter";
+import apiClient from "@app/services/apiClient";
+import { useLoginRequired } from "@app/hooks/useLoginRequired";
+import LoginRequiredBanner from "@app/components/shared/config/LoginRequiredBanner";
+import { usePreferences } from "@app/contexts/PreferencesContext";
+import { useUnsavedChanges } from "@app/contexts/UnsavedChangesContext";
+import {
+  supportedLanguages,
+  toUnderscoreFormat,
+  toUnderscoreLanguages,
+} from "@app/i18n";
+import { Z_INDEX_CONFIG_MODAL } from "@app/styles/zIndex";
 
 interface GeneralSettingsData {
   ui: {
     appNameNavbar?: string;
     languages?: string[];
-    logoStyle?: 'modern' | 'classic';
+    logoStyle?: "modern" | "classic";
     hideDisabledTools?: {
       googleDrive?: boolean;
       mobileQRScanner?: boolean;
@@ -60,14 +77,23 @@ export default function AdminGeneralSection() {
   const location = useLocation();
   const navigate = useNavigate();
   const { loginEnabled, validateLoginEnabled } = useLoginRequired();
-  const { restartModalOpened, showRestartModal, closeRestartModal, restartServer } = useRestartServer();
+  const {
+    restartModalOpened,
+    showRestartModal,
+    closeRestartModal,
+    restartServer,
+  } = useRestartServer();
   const { preferences, updatePreference } = usePreferences();
   const { markClean } = useUnsavedChanges();
   const languageOptions = useMemo(
-    () => Object.entries(supportedLanguages)
-      .map(([code, label]) => ({ value: toUnderscoreFormat(code), label: `${label} (${code})` }))
-      .sort((a, b) => a.label.localeCompare(b.label)),
-    []
+    () =>
+      Object.entries(supportedLanguages)
+        .map(([code, label]) => ({
+          value: toUnderscoreFormat(code),
+          label: `${label} (${code})`,
+        }))
+        .sort((a, b) => a.label.localeCompare(b.label)),
+    [],
   );
   const parseWatchedFoldersInput = useCallback((value: string) => {
     const paths = value
@@ -80,7 +106,7 @@ export default function AdminGeneralSection() {
 
     return uniquePaths;
   }, []);
-  
+
   const {
     settings,
     setSettings,
@@ -90,19 +116,23 @@ export default function AdminGeneralSection() {
     saveSettings,
     isFieldPending,
   } = useAdminSettings<GeneralSettingsData>({
-    sectionName: 'general',
-    fetchTransformer: async (): Promise<GeneralSettingsData & { _pending?: Record<string, any> }> => {
+    sectionName: "general",
+    fetchTransformer: async (): Promise<
+      GeneralSettingsData & { _pending?: Record<string, unknown> }
+    > => {
       const [uiResponse, systemResponse, premiumResponse] = await Promise.all([
-        apiClient.get('/api/v1/admin/settings/section/ui'),
-        apiClient.get('/api/v1/admin/settings/section/system'),
-        apiClient.get('/api/v1/admin/settings/section/premium')
+        apiClient.get("/api/v1/admin/settings/section/ui"),
+        apiClient.get("/api/v1/admin/settings/section/system"),
+        apiClient.get("/api/v1/admin/settings/section/premium"),
       ]);
 
       const ui = { ...(uiResponse.data || {}) };
       const system = { ...(systemResponse.data || {}) };
       const premium = { ...(premiumResponse.data || {}) };
 
-      ui.languages = Array.isArray(ui.languages) ? toUnderscoreLanguages(ui.languages) : [];
+      ui.languages = Array.isArray(ui.languages)
+        ? toUnderscoreLanguages(ui.languages)
+        : [];
 
       const pipelinePaths = system.customPaths?.pipeline || {};
       const watchedFoldersDirs = Array.isArray(pipelinePaths.watchedFoldersDirs)
@@ -111,36 +141,40 @@ export default function AdminGeneralSection() {
       const normalizedWatchedFoldersDirs =
         watchedFoldersDirs.length > 0
           ? watchedFoldersDirs
-          : (pipelinePaths.watchedFoldersDir ? [pipelinePaths.watchedFoldersDir] : []);
+          : pipelinePaths.watchedFoldersDir
+            ? [pipelinePaths.watchedFoldersDir]
+            : [];
 
-      const result: GeneralSettingsData & { _pending?: Record<string, any> } = {
+      const result: GeneralSettingsData & {
+        _pending?: Record<string, unknown>;
+      } = {
         ui,
         system,
         customPaths: {
           ...(system.customPaths || {}),
           pipeline: {
             ...pipelinePaths,
-            pipelineDir: pipelinePaths.pipelineDir || '',
-            watchedFoldersDir: pipelinePaths.watchedFoldersDir || '',
+            pipelineDir: pipelinePaths.pipelineDir || "",
+            watchedFoldersDir: pipelinePaths.watchedFoldersDir || "",
             watchedFoldersDirs: normalizedWatchedFoldersDirs,
-            finishedFoldersDir: pipelinePaths.finishedFoldersDir || ''
+            finishedFoldersDir: pipelinePaths.finishedFoldersDir || "",
           },
           operations: {
             ...(system.customPaths?.operations || {}),
-            weasyprint: system.customPaths?.operations?.weasyprint || '',
-            unoconvert: system.customPaths?.operations?.unoconvert || ''
-          }
+            weasyprint: system.customPaths?.operations?.weasyprint || "",
+            unoconvert: system.customPaths?.operations?.unoconvert || "",
+          },
         },
         customMetadata: premium.proFeatures?.customMetadata || {
           autoUpdateMetadata: false,
-          author: '',
-          creator: '',
-          producer: ''
-        }
+          author: "",
+          creator: "",
+          producer: "",
+        },
       };
 
       // Merge pending blocks from all three endpoints
-      const pendingBlock: Record<string, any> = {};
+      const pendingBlock: Record<string, unknown> = {};
       if (ui._pending) {
         pendingBlock.ui = ui._pending;
       }
@@ -151,7 +185,8 @@ export default function AdminGeneralSection() {
         pendingBlock.customPaths = system._pending.customPaths;
       }
       if (premium._pending?.proFeatures?.customMetadata) {
-        pendingBlock.customMetadata = premium._pending.proFeatures.customMetadata;
+        pendingBlock.customMetadata =
+          premium._pending.proFeatures.customMetadata;
       }
 
       if (Object.keys(pendingBlock).length > 0) {
@@ -161,60 +196,78 @@ export default function AdminGeneralSection() {
       return result;
     },
     saveTransformer: (settings: GeneralSettingsData) => {
-      const deltaSettings: Record<string, any> = {
+      const deltaSettings: Record<string, unknown> = {
         // UI settings
-        'ui.appNameNavbar': settings.ui?.appNameNavbar,
-        'ui.languages': settings.ui?.languages,
-        'ui.logoStyle': settings.ui?.logoStyle,
-        'ui.hideDisabledTools.googleDrive': settings.ui?.hideDisabledTools?.googleDrive,
-        'ui.hideDisabledTools.mobileQRScanner': settings.ui?.hideDisabledTools?.mobileQRScanner,
+        "ui.appNameNavbar": settings.ui?.appNameNavbar,
+        "ui.languages": settings.ui?.languages,
+        "ui.logoStyle": settings.ui?.logoStyle,
+        "ui.hideDisabledTools.googleDrive":
+          settings.ui?.hideDisabledTools?.googleDrive,
+        "ui.hideDisabledTools.mobileQRScanner":
+          settings.ui?.hideDisabledTools?.mobileQRScanner,
         // System settings
-        'system.defaultLocale': settings.system?.defaultLocale,
-        'system.showUpdate': settings.system?.showUpdate,
-        'system.showUpdateOnlyAdmin': settings.system?.showUpdateOnlyAdmin,
-        'system.customHTMLFiles': settings.system?.customHTMLFiles,
-        'system.fileUploadLimit': settings.system?.fileUploadLimit,
-        'system.frontendUrl': settings.system?.frontendUrl,
+        "system.defaultLocale": settings.system?.defaultLocale,
+        "system.showUpdate": settings.system?.showUpdate,
+        "system.showUpdateOnlyAdmin": settings.system?.showUpdateOnlyAdmin,
+        "system.customHTMLFiles": settings.system?.customHTMLFiles,
+        "system.fileUploadLimit": settings.system?.fileUploadLimit,
+        "system.frontendUrl": settings.system?.frontendUrl,
         // Premium custom metadata
-        'premium.proFeatures.customMetadata.autoUpdateMetadata': settings.customMetadata?.autoUpdateMetadata,
-        'premium.proFeatures.customMetadata.author': settings.customMetadata?.author,
-        'premium.proFeatures.customMetadata.creator': settings.customMetadata?.creator,
-        'premium.proFeatures.customMetadata.producer': settings.customMetadata?.producer
+        "premium.proFeatures.customMetadata.autoUpdateMetadata":
+          settings.customMetadata?.autoUpdateMetadata,
+        "premium.proFeatures.customMetadata.author":
+          settings.customMetadata?.author,
+        "premium.proFeatures.customMetadata.creator":
+          settings.customMetadata?.creator,
+        "premium.proFeatures.customMetadata.producer":
+          settings.customMetadata?.producer,
       };
 
       if (settings.customPaths) {
-        deltaSettings['system.customPaths.pipeline.pipelineDir'] = settings.customPaths?.pipeline?.pipelineDir;
-        deltaSettings['system.customPaths.pipeline.watchedFoldersDir'] = settings.customPaths?.pipeline?.watchedFoldersDir;
-        deltaSettings['system.customPaths.pipeline.watchedFoldersDirs'] = settings.customPaths?.pipeline?.watchedFoldersDirs;
-        deltaSettings['system.customPaths.pipeline.finishedFoldersDir'] = settings.customPaths?.pipeline?.finishedFoldersDir;
-        deltaSettings['system.customPaths.operations.weasyprint'] = settings.customPaths?.operations?.weasyprint;
-        deltaSettings['system.customPaths.operations.unoconvert'] = settings.customPaths?.operations?.unoconvert;
+        deltaSettings["system.customPaths.pipeline.pipelineDir"] =
+          settings.customPaths?.pipeline?.pipelineDir;
+        deltaSettings["system.customPaths.pipeline.watchedFoldersDir"] =
+          settings.customPaths?.pipeline?.watchedFoldersDir;
+        deltaSettings["system.customPaths.pipeline.watchedFoldersDirs"] =
+          settings.customPaths?.pipeline?.watchedFoldersDirs;
+        deltaSettings["system.customPaths.pipeline.finishedFoldersDir"] =
+          settings.customPaths?.pipeline?.finishedFoldersDir;
+        deltaSettings["system.customPaths.operations.weasyprint"] =
+          settings.customPaths?.operations?.weasyprint;
+        deltaSettings["system.customPaths.operations.unoconvert"] =
+          settings.customPaths?.operations?.unoconvert;
       }
 
       return {
         sectionData: {},
-        deltaSettings
+        deltaSettings,
       };
-    }
+    },
   });
 
-  const { isDirty, resetToSnapshot, markSaved } = useSettingsDirty(settings, loading);
+  const { isDirty, resetToSnapshot, markSaved } = useSettingsDirty(
+    settings,
+    loading,
+  );
 
   const selectedLanguages = useMemo(
     () => toUnderscoreLanguages(settings.ui?.languages || []),
-    [settings.ui?.languages]
+    [settings.ui?.languages],
+  );
+  const watchedFoldersInput = useMemo(
+    () => (settings.customPaths?.pipeline?.watchedFoldersDirs || []).join("\n"),
+    [settings.customPaths?.pipeline?.watchedFoldersDirs],
   );
-  const watchedFoldersInput = useMemo(() => (
-    (settings.customPaths?.pipeline?.watchedFoldersDirs || []).join('\n')
-  ), [settings.customPaths?.pipeline?.watchedFoldersDirs]);
 
   const watchedFoldersValidation = useMemo(() => {
     const paths = settings.customPaths?.pipeline?.watchedFoldersDirs || [];
-    const finishedPath = settings.customPaths?.pipeline?.finishedFoldersDir || '';
+    const finishedPath =
+      settings.customPaths?.pipeline?.finishedFoldersDir || "";
     const warnings: string[] = [];
 
     // Normalize paths for comparison (handle both Windows and Unix paths)
-    const normalizePath = (p: string) => p.replace(/\\/g, '/').replace(/\/+$/, '');
+    const normalizePath = (p: string) =>
+      p.replace(/\\/g, "/").replace(/\/+$/, "");
 
     // Check for overlapping watched folders
     if (paths.length >= 2) {
@@ -225,10 +278,14 @@ export default function AdminGeneralSection() {
 
           if (path1 === path2) {
             warnings.push(`Duplicate path detected: '${paths[i]}'`);
-          } else if (path1.startsWith(path2 + '/')) {
-            warnings.push(`'${paths[i]}' is nested inside '${paths[j]}' - may cause duplicate processing`);
-          } else if (path2.startsWith(path1 + '/')) {
-            warnings.push(`'${paths[j]}' is nested inside '${paths[i]}' - may cause duplicate processing`);
+          } else if (path1.startsWith(path2 + "/")) {
+            warnings.push(
+              `'${paths[i]}' is nested inside '${paths[j]}' - may cause duplicate processing`,
+            );
+          } else if (path2.startsWith(path1 + "/")) {
+            warnings.push(
+              `'${paths[j]}' is nested inside '${paths[i]}' - may cause duplicate processing`,
+            );
           }
         }
       }
@@ -241,17 +298,26 @@ export default function AdminGeneralSection() {
         const normalizedWatched = normalizePath(watchedPath);
 
         if (normalizedWatched === normalizedFinished) {
-          warnings.push(`CRITICAL: Watched folder '${watchedPath}' is the same as finished folder - will cause processing loops!`);
-        } else if (normalizedFinished.startsWith(normalizedWatched + '/')) {
-          warnings.push(`Finished folder is nested inside watched folder '${watchedPath}' - may cause issues`);
-        } else if (normalizedWatched.startsWith(normalizedFinished + '/')) {
-          warnings.push(`CRITICAL: Watched folder '${watchedPath}' is nested inside finished folder - will cause processing loops!`);
+          warnings.push(
+            `CRITICAL: Watched folder '${watchedPath}' is the same as finished folder - will cause processing loops!`,
+          );
+        } else if (normalizedFinished.startsWith(normalizedWatched + "/")) {
+          warnings.push(
+            `Finished folder is nested inside watched folder '${watchedPath}' - may cause issues`,
+          );
+        } else if (normalizedWatched.startsWith(normalizedFinished + "/")) {
+          warnings.push(
+            `CRITICAL: Watched folder '${watchedPath}' is nested inside finished folder - will cause processing loops!`,
+          );
         }
       }
     }
 
     return warnings.length > 0 ? warnings : null;
-  }, [settings.customPaths?.pipeline?.watchedFoldersDirs, settings.customPaths?.pipeline?.finishedFoldersDir]);
+  }, [
+    settings.customPaths?.pipeline?.watchedFoldersDirs,
+    settings.customPaths?.pipeline?.finishedFoldersDir,
+  ]);
 
   // Filter default locale options based on available languages setting
   const defaultLocaleOptions = useMemo(() => {
@@ -260,7 +326,9 @@ export default function AdminGeneralSection() {
       return languageOptions;
     }
     // Otherwise, only show languages that are in the selected list
-    return languageOptions.filter(option => selectedLanguages.includes(option.value));
+    return languageOptions.filter((option) =>
+      selectedLanguages.includes(option.value),
+    );
   }, [selectedLanguages, languageOptions]);
 
   useEffect(() => {
@@ -275,7 +343,7 @@ export default function AdminGeneralSection() {
     if (loading || !loginEnabled || !settings.ui?.logoStyle) return;
 
     // This ensures localStorage always reflects the server's authoritative value
-    updatePreference('logoVariant', settings.ui.logoStyle);
+    updatePreference("logoVariant", settings.ui.logoStyle);
   }, [loading, loginEnabled, settings.ui?.logoStyle, updatePreference]);
 
   // Handle hash navigation for deep linking to specific fields
@@ -285,7 +353,7 @@ export default function AdminGeneralSection() {
       const element = document.getElementById(elementId);
       if (element) {
         setTimeout(() => {
-          element.scrollIntoView({ behavior: 'smooth', block: 'start' });
+          element.scrollIntoView({ behavior: "smooth", block: "start" });
         }, 100);
       }
     }
@@ -301,17 +369,17 @@ export default function AdminGeneralSection() {
 
   // Show the server setting when loaded (for admin config), otherwise show user's preference
   // Note: User's preference in localStorage is separate and takes precedence in the app via useLogoVariant hook
-  const logoStyleValue = loginEnabled 
-    ? (settings.ui?.logoStyle ?? preferences.logoVariant ?? 'classic')
-    : (preferences.logoVariant ?? 'classic');
+  const logoStyleValue = loginEnabled
+    ? (settings.ui?.logoStyle ?? preferences.logoVariant ?? "classic")
+    : (preferences.logoVariant ?? "classic");
 
   const handleLogoStyleChange = (value: string) => {
-    const nextValue = value === 'modern' ? 'modern' : 'classic';
-    
+    const nextValue = value === "modern" ? "modern" : "classic";
+
     // Only update local settings state - don't update the actual preference until save
     // When login is disabled, update preference immediately since there's no server to save to
     if (!loginEnabled) {
-      updatePreference('logoVariant', nextValue);
+      updatePreference("logoVariant", nextValue);
       return;
     }
 
@@ -320,7 +388,7 @@ export default function AdminGeneralSection() {
       ui: {
         ...settings.ui,
         logoStyle: nextValue,
-      }
+      },
     });
   };
 
@@ -338,16 +406,16 @@ export default function AdminGeneralSection() {
 
       // Update local preference after successful save so the app reflects the saved logo style
       if (settings.ui?.logoStyle) {
-        updatePreference('logoVariant', settings.ui.logoStyle);
+        updatePreference("logoVariant", settings.ui.logoStyle);
       }
 
       markClean();
       showRestartModal();
     } catch (_error) {
       alert({
-        alertType: 'error',
-        title: t('admin.error', 'Error'),
-        body: t('admin.settings.saveError', 'Failed to save settings'),
+        alertType: "error",
+        title: t("admin.error", "Error"),
+        body: t("admin.settings.saveError", "Failed to save settings"),
       });
     }
   };
@@ -365,508 +433,888 @@ export default function AdminGeneralSection() {
       <Stack gap="lg" className="settings-section-content">
         <LoginRequiredBanner show={!loginEnabled} />
 
-      <div>
-        <Text fw={600} size="lg">{t('admin.settings.general.title', 'System Settings')}</Text>
-        <Text size="sm" c="dimmed">
-          {t('admin.settings.general.description', 'Configure system-wide application settings including branding and default behaviour.')}
-        </Text>
-      </div>
+        <div>
+          <Text fw={600} size="lg">
+            {t("admin.settings.general.title", "System Settings")}
+          </Text>
+          <Text size="sm" c="dimmed">
+            {t(
+              "admin.settings.general.description",
+              "Configure system-wide application settings including branding and default behaviour.",
+            )}
+          </Text>
+        </div>
 
-      {/* System Settings */}
-      <Paper withBorder p="md" radius="md">
-        <Stack gap="md">
-          <Text fw={600} size="sm" mb="xs">{t('admin.settings.general.system', 'System')}</Text>
-
-          <div>
-            <TextInput
-              label={
-                <Group gap="xs">
-                  <span>{t('admin.settings.general.appNameNavbar.label', 'Navbar Brand')}</span>
-                  <PendingBadge show={isFieldPending('ui.appNameNavbar')} />
-                </Group>
-              }
-              description={t('admin.settings.general.appNameNavbar.description', 'The name displayed in the navigation bar')}
-              value={settings.ui?.appNameNavbar || ''}
-              onChange={(e) => setSettings({ ...settings, ui: { ...settings.ui, appNameNavbar: e.target.value } })}
-              placeholder="Stirling PDF"
-              disabled={!loginEnabled}
-            />
-          </div>
-
-          <div>
-            <Text size="sm" fw={500} mb={4}>
-              <Group gap="xs">
-                <span>{t('admin.settings.general.logoStyle.label', 'Logo Style')}</span>
-                <PendingBadge show={isFieldPending('ui.logoStyle')} />
-              </Group>
+        {/* System Settings */}
+        <Paper withBorder p="md" radius="md">
+          <Stack gap="md">
+            <Text fw={600} size="sm" mb="xs">
+              {t("admin.settings.general.system", "System")}
             </Text>
-            <Text size="xs" c="dimmed" mb="xs">
-              {t('admin.settings.general.logoStyle.description', 'Choose between the modern minimalist logo or the classic S icon')}
-            </Text>
-            <SegmentedControl
-              value={logoStyleValue}
-              onChange={handleLogoStyleChange}
-              data={[
-                {
-                  value: 'classic',
-                  label: (
-                    <div style={{ display: 'flex', alignItems: 'center', gap: '0.5rem', padding: '0.25rem 0' }}>
-                      <img
-                        src="classic-logo/favicon.ico"
-                        alt={t('admin.settings.general.logoStyle.classicAlt', 'Classic logo')}
-                        style={{ width: '24px', height: '24px' }}
-                      />
-                      <span>{t('admin.settings.general.logoStyle.classic', 'Classic')}</span>
-                    </div>
-                  )
-                },
-                {
-                  value: 'modern',
-                  label: (
-                    <div style={{ display: 'flex', alignItems: 'center', gap: '0.5rem', padding: '0.25rem 0' }}>
-                      <img
-                        src="modern-logo/StirlingPDFLogoNoTextLight.svg"
-                        alt={t('admin.settings.general.logoStyle.modernAlt', 'Modern logo')}
-                        style={{ width: '24px', height: '24px' }}
-                      />
-                      <span>{t('admin.settings.general.logoStyle.modern', 'Modern')}</span>
-                    </div>
-                  )
-                },
-              ]}
-            />
-          </div>
 
-          <div>
-            <MultiSelect
-              label={
+            <div>
+              <TextInput
+                label={
+                  <Group gap="xs">
+                    <span>
+                      {t(
+                        "admin.settings.general.appNameNavbar.label",
+                        "Navbar Brand",
+                      )}
+                    </span>
+                    <PendingBadge show={isFieldPending("ui.appNameNavbar")} />
+                  </Group>
+                }
+                description={t(
+                  "admin.settings.general.appNameNavbar.description",
+                  "The name displayed in the navigation bar",
+                )}
+                value={settings.ui?.appNameNavbar || ""}
+                onChange={(e) =>
+                  setSettings({
+                    ...settings,
+                    ui: { ...settings.ui, appNameNavbar: e.target.value },
+                  })
+                }
+                placeholder="Stirling PDF"
+                disabled={!loginEnabled}
+              />
+            </div>
+
+            <div>
+              <Text size="sm" fw={500} mb={4}>
                 <Group gap="xs">
-                  <span>{t('admin.settings.general.languages.label', 'Available Languages')}</span>
-                  <PendingBadge show={isFieldPending('ui.languages')} />
+                  <span>
+                    {t("admin.settings.general.logoStyle.label", "Logo Style")}
+                  </span>
+                  <PendingBadge show={isFieldPending("ui.logoStyle")} />
                 </Group>
-              }
-              description={t('admin.settings.general.languages.description', 'Limit which languages are available (empty = all languages)')}
-              value={selectedLanguages}
-              onChange={(value) => setSettings({ ...settings, ui: { ...settings.ui, languages: value } })}
-              data={languageOptions}
-              searchable
-              clearable
-              placeholder={t('admin.settings.general.languages.placeholder', 'Select languages')}
-              comboboxProps={{ zIndex: Z_INDEX_CONFIG_MODAL }}
-              disabled={!loginEnabled}
-            />
-          </div>
+              </Text>
+              <Text size="xs" c="dimmed" mb="xs">
+                {t(
+                  "admin.settings.general.logoStyle.description",
+                  "Choose between the modern minimalist logo or the classic S icon",
+                )}
+              </Text>
+              <SegmentedControl
+                value={logoStyleValue}
+                onChange={handleLogoStyleChange}
+                data={[
+                  {
+                    value: "classic",
+                    label: (
+                      <div
+                        style={{
+                          display: "flex",
+                          alignItems: "center",
+                          gap: "0.5rem",
+                          padding: "0.25rem 0",
+                        }}
+                      >
+                        <img
+                          src="classic-logo/favicon.ico"
+                          alt={t(
+                            "admin.settings.general.logoStyle.classicAlt",
+                            "Classic logo",
+                          )}
+                          style={{ width: "24px", height: "24px" }}
+                        />
+                        <span>
+                          {t(
+                            "admin.settings.general.logoStyle.classic",
+                            "Classic",
+                          )}
+                        </span>
+                      </div>
+                    ),
+                  },
+                  {
+                    value: "modern",
+                    label: (
+                      <div
+                        style={{
+                          display: "flex",
+                          alignItems: "center",
+                          gap: "0.5rem",
+                          padding: "0.25rem 0",
+                        }}
+                      >
+                        <img
+                          src="modern-logo/StirlingPDFLogoNoTextLight.svg"
+                          alt={t(
+                            "admin.settings.general.logoStyle.modernAlt",
+                            "Modern logo",
+                          )}
+                          style={{ width: "24px", height: "24px" }}
+                        />
+                        <span>
+                          {t(
+                            "admin.settings.general.logoStyle.modern",
+                            "Modern",
+                          )}
+                        </span>
+                      </div>
+                    ),
+                  },
+                ]}
+              />
+            </div>
 
-          <div>
-            <Select
-              label={
-                <Group gap="xs">
-                  <span>{t('admin.settings.general.defaultLocale.label', 'Default Locale')}</span>
-                  <PendingBadge show={isFieldPending('system.defaultLocale')} />
-                </Group>
-              }
-              description={t('admin.settings.general.defaultLocale.description', 'The default language for new users (e.g., en_US, es_ES)')}
-              value={settings.system?.defaultLocale || ''}
-              onChange={(value) => setSettings({ ...settings, system: { ...settings.system, defaultLocale: value || '' } })}
-              data={defaultLocaleOptions}
-              searchable
-              clearable
-              placeholder="en_GB"
-              comboboxProps={{ zIndex: Z_INDEX_CONFIG_MODAL }}
-              disabled={!loginEnabled}
-            />
-          </div>
+            <div>
+              <MultiSelect
+                label={
+                  <Group gap="xs">
+                    <span>
+                      {t(
+                        "admin.settings.general.languages.label",
+                        "Available Languages",
+                      )}
+                    </span>
+                    <PendingBadge show={isFieldPending("ui.languages")} />
+                  </Group>
+                }
+                description={t(
+                  "admin.settings.general.languages.description",
+                  "Limit which languages are available (empty = all languages)",
+                )}
+                value={selectedLanguages}
+                onChange={(value) =>
+                  setSettings({
+                    ...settings,
+                    ui: { ...settings.ui, languages: value },
+                  })
+                }
+                data={languageOptions}
+                searchable
+                clearable
+                placeholder={t(
+                  "admin.settings.general.languages.placeholder",
+                  "Select languages",
+                )}
+                comboboxProps={{ zIndex: Z_INDEX_CONFIG_MODAL }}
+                disabled={!loginEnabled}
+              />
+            </div>
 
-          <div>
-            <TextInput
-              label={
-                <Group gap="xs">
-                  <span>{t('admin.settings.general.fileUploadLimit.label', 'File Upload Limit')}</span>
-                  <PendingBadge show={isFieldPending('system.fileUploadLimit')} />
-                </Group>
-              }
-              description={t('admin.settings.general.fileUploadLimit.description', 'Maximum file upload size (e.g., 100MB, 1GB)')}
-              value={ settings.system?.fileUploadLimit || ''}
-              onChange={(e) => setSettings({ ...settings, system: { ...settings.system, fileUploadLimit: e.target.value } })}
-              placeholder="100MB"
-              disabled={!loginEnabled}
-            />
-          </div>
+            <div>
+              <Select
+                label={
+                  <Group gap="xs">
+                    <span>
+                      {t(
+                        "admin.settings.general.defaultLocale.label",
+                        "Default Locale",
+                      )}
+                    </span>
+                    <PendingBadge
+                      show={isFieldPending("system.defaultLocale")}
+                    />
+                  </Group>
+                }
+                description={t(
+                  "admin.settings.general.defaultLocale.description",
+                  "The default language for new users (e.g., en_US, es_ES)",
+                )}
+                value={settings.system?.defaultLocale || ""}
+                onChange={(value) =>
+                  setSettings({
+                    ...settings,
+                    system: { ...settings.system, defaultLocale: value || "" },
+                  })
+                }
+                data={defaultLocaleOptions}
+                searchable
+                clearable
+                placeholder="en_GB"
+                comboboxProps={{ zIndex: Z_INDEX_CONFIG_MODAL }}
+                disabled={!loginEnabled}
+              />
+            </div>
 
-          <div id="frontendUrl">
-            <TextInput
-              label={
-                <Group gap="xs">
-                  <span>{t('admin.settings.general.frontendUrl.label', 'Frontend URL')}</span>
-                  <PendingBadge show={isFieldPending('system.frontendUrl')} />
-                </Group>
-              }
-              description={t('admin.settings.general.frontendUrl.description', 'Base URL for frontend (e.g., https://pdf.example.com). Used for email invite links and mobile QR code uploads. Leave empty to use backend URL.')}
-              value={settings.system?.frontendUrl || ''}
-              onChange={(e) => setSettings({ ...settings, system: { ...settings.system, frontendUrl: e.target.value } })}
-              placeholder="https://pdf.example.com"
-              disabled={!loginEnabled}
-            />
-          </div>
+            <div>
+              <TextInput
+                label={
+                  <Group gap="xs">
+                    <span>
+                      {t(
+                        "admin.settings.general.fileUploadLimit.label",
+                        "File Upload Limit",
+                      )}
+                    </span>
+                    <PendingBadge
+                      show={isFieldPending("system.fileUploadLimit")}
+                    />
+                  </Group>
+                }
+                description={t(
+                  "admin.settings.general.fileUploadLimit.description",
+                  "Maximum file upload size (e.g., 100MB, 1GB)",
+                )}
+                value={settings.system?.fileUploadLimit || ""}
+                onChange={(e) =>
+                  setSettings({
+                    ...settings,
+                    system: {
+                      ...settings.system,
+                      fileUploadLimit: e.target.value,
+                    },
+                  })
+                }
+                placeholder="100MB"
+                disabled={!loginEnabled}
+              />
+            </div>
 
-          {/* Hide Disabled Tools Settings */}
-          <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between', marginBottom: '1rem' }}>
+            <div id="frontendUrl">
+              <TextInput
+                label={
+                  <Group gap="xs">
+                    <span>
+                      {t(
+                        "admin.settings.general.frontendUrl.label",
+                        "Frontend URL",
+                      )}
+                    </span>
+                    <PendingBadge show={isFieldPending("system.frontendUrl")} />
+                  </Group>
+                }
+                description={t(
+                  "admin.settings.general.frontendUrl.description",
+                  "Base URL for frontend (e.g., https://pdf.example.com). Used for email invite links and mobile QR code uploads. Leave empty to use backend URL.",
+                )}
+                value={settings.system?.frontendUrl || ""}
+                onChange={(e) =>
+                  setSettings({
+                    ...settings,
+                    system: { ...settings.system, frontendUrl: e.target.value },
+                  })
+                }
+                placeholder="https://pdf.example.com"
+                disabled={!loginEnabled}
+              />
+            </div>
+
+            {/* Hide Disabled Tools Settings */}
+            <div
+              style={{
+                display: "flex",
+                alignItems: "center",
+                justifyContent: "space-between",
+                marginBottom: "1rem",
+              }}
+            >
               <div>
-                <Text fw={500} size="sm">{t('admin.settings.general.hideDisabledTools.googleDrive.label', 'Hide Google Drive')}</Text>
+                <Text fw={500} size="sm">
+                  {t(
+                    "admin.settings.general.hideDisabledTools.googleDrive.label",
+                    "Hide Google Drive",
+                  )}
+                </Text>
                 <Text size="xs" c="dimmed" mt={4}>
-                  {t('admin.settings.general.hideDisabledTools.googleDrive.description', 'Hide Google Drive button when not enabled')}
+                  {t(
+                    "admin.settings.general.hideDisabledTools.googleDrive.description",
+                    "Hide Google Drive button when not enabled",
+                  )}
                 </Text>
               </div>
               <Group gap="xs">
                 <Switch
                   checked={settings.ui?.hideDisabledTools?.googleDrive || false}
-                  onChange={(e) => setSettings({ ...settings, ui: { ...settings.ui, hideDisabledTools: { ...settings.ui?.hideDisabledTools, googleDrive: e.target.checked } } })}
+                  onChange={(e) =>
+                    setSettings({
+                      ...settings,
+                      ui: {
+                        ...settings.ui,
+                        hideDisabledTools: {
+                          ...settings.ui?.hideDisabledTools,
+                          googleDrive: e.target.checked,
+                        },
+                      },
+                    })
+                  }
                   disabled={!loginEnabled}
                 />
-                <PendingBadge show={isFieldPending('ui.hideDisabledTools.googleDrive')} />
+                <PendingBadge
+                  show={isFieldPending("ui.hideDisabledTools.googleDrive")}
+                />
               </Group>
             </div>
 
-          <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}>
-            <div>
-              <Text fw={500} size="sm">{t('admin.settings.general.hideDisabledTools.mobileScanner.label', 'Hide Mobile Scanner')}</Text>
-              <Text size="xs" c="dimmed" mt={4}>
-                {t('admin.settings.general.hideDisabledTools.mobileScanner.description', 'Hide mobile QR scanner button when not enabled')}
-              </Text>
-            </div>
-            <Group gap="xs">
-              <Switch
-                checked={settings.ui?.hideDisabledTools?.mobileQRScanner || false}
-                onChange={(e) => setSettings({ ...settings, ui: { ...settings.ui, hideDisabledTools: { ...settings.ui?.hideDisabledTools, mobileQRScanner: e.target.checked } } })}
-                disabled={!loginEnabled}
-              />
-              <PendingBadge show={isFieldPending('ui.hideDisabledTools.mobileQRScanner')} />
-            </Group>
-          </div>
-
-          <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}>
-            <div>
-              <Text fw={500} size="sm">{t('admin.settings.general.showUpdate.label', 'Show Update Notifications')}</Text>
-              <Text size="xs" c="dimmed" mt={4}>
-                {t('admin.settings.general.showUpdate.description', 'Display notifications when a new version is available')}
-              </Text>
-            </div>
-            <Group gap="xs">
-              <Switch
-                checked={ settings.system?.showUpdate || false}
-                onChange={(e) => setSettings({ ...settings, system: { ...settings.system, showUpdate: e.target.checked } })}
-                disabled={!loginEnabled}
-              />
-              <PendingBadge show={isFieldPending('system.showUpdate')} />
-            </Group>
-          </div>
-
-          <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}>
-            <div>
-              <Text fw={500} size="sm">{t('admin.settings.general.showUpdateOnlyAdmin.label', 'Show Updates to Admins Only')}</Text>
-              <Text size="xs" c="dimmed" mt={4}>
-                {t('admin.settings.general.showUpdateOnlyAdmin.description', 'Restrict update notifications to admin users only')}
-              </Text>
-            </div>
-            <Group gap="xs">
-              <Switch
-                checked={ settings.system?.showUpdateOnlyAdmin || false}
-                onChange={(e) => setSettings({ ...settings, system: { ...settings.system, showUpdateOnlyAdmin: e.target.checked } })}
-                disabled={!loginEnabled}
-              />
-              <PendingBadge show={isFieldPending('system.showUpdateOnlyAdmin')} />
-            </Group>
-          </div>
-
-          <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}>
-            <div>
-              <Text fw={500} size="sm">{t('admin.settings.general.customHTMLFiles.label', 'Custom HTML Files')}</Text>
-              <Text size="xs" c="dimmed" mt={4}>
-                {t('admin.settings.general.customHTMLFiles.description', 'Allow serving custom HTML files from the customFiles directory')}
-              </Text>
-            </div>
-            <Group gap="xs">
-              <Switch
-                checked={settings.system?.customHTMLFiles || false}
-                onChange={(e) => setSettings({ ...settings, system: { ...settings.system, customHTMLFiles: e.target.checked } })}
-                disabled={!loginEnabled}
-              />
-              <PendingBadge show={isFieldPending('system.customHTMLFiles')} />
-            </Group>
-          </div>
-        </Stack>
-      </Paper>
-
-      {/* Custom Metadata - Premium Feature */}
-      <Paper withBorder p="md" radius="md">
-        <Stack gap="md">
-          <Group justify="space-between" align="center">
-            <Text fw={600} size="sm">{t('admin.settings.general.customMetadata.label', 'Custom Metadata')}</Text>
-            <Badge
-              color="grape"
-              size="sm"
-              style={{ cursor: 'pointer' }}
-              onClick={() => navigate('/settings/adminPlan')}
-              title={t('admin.settings.badge.clickToUpgrade', 'Click to view plan details')}
-            >
-              PRO
-            </Badge>
-          </Group>
-
-          <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}>
-            <div>
-              <Text fw={500} size="sm">{t('admin.settings.general.customMetadata.autoUpdate.label', 'Auto Update Metadata')}</Text>
-              <Text size="xs" c="dimmed" mt={4}>
-                {t('admin.settings.general.customMetadata.autoUpdate.description', 'Automatically update PDF metadata on all processed documents')}
-              </Text>
-            </div>
-            <Group gap="xs">
-              <Switch
-                checked={settings.customMetadata?.autoUpdateMetadata || false}
-                onChange={(e) => setSettings({
-                  ...settings,
-                  customMetadata: {
-                    ...settings.customMetadata,
-                    autoUpdateMetadata: e.target.checked
-                  }
-                })}
-                disabled={!loginEnabled}
-              />
-              <PendingBadge show={isFieldPending('customMetadata.autoUpdateMetadata')} />
-            </Group>
-          </div>
-
-          <div>
-            <TextInput
-              label={
-                <Group gap="xs">
-                  <span>{t('admin.settings.general.customMetadata.author.label', 'Default Author')}</span>
-                  <PendingBadge show={isFieldPending('customMetadata.author')} />
-                </Group>
-              }
-              description={t('admin.settings.general.customMetadata.author.description', 'Default author for PDF metadata (e.g., username)')}
-              value={settings.customMetadata?.author || ''}
-              onChange={(e) => setSettings({
-                ...settings,
-                customMetadata: {
-                  ...settings.customMetadata,
-                  author: e.target.value
-                }
-              })}
-              placeholder="username"
-              disabled={!loginEnabled}
-            />
-          </div>
-
-          <div>
-            <TextInput
-              label={
-                <Group gap="xs">
-                  <span>{t('admin.settings.general.customMetadata.creator.label', 'Default Creator')}</span>
-                  <PendingBadge show={isFieldPending('customMetadata.creator')} />
-                </Group>
-              }
-              description={t('admin.settings.general.customMetadata.creator.description', 'Default creator for PDF metadata')}
-              value={settings.customMetadata?.creator || ''}
-              onChange={(e) => setSettings({
-                ...settings,
-                customMetadata: {
-                  ...settings.customMetadata,
-                  creator: e.target.value
-                }
-              })}
-              placeholder="Stirling-PDF"
-              disabled={!loginEnabled}
-            />
-          </div>
-
-          <div>
-            <TextInput
-              label={
-                <Group gap="xs">
-                  <span>{t('admin.settings.general.customMetadata.producer.label', 'Default Producer')}</span>
-                  <PendingBadge show={isFieldPending('customMetadata.producer')} />
-                </Group>
-              }
-              description={t('admin.settings.general.customMetadata.producer.description', 'Default producer for PDF metadata')}
-              value={settings.customMetadata?.producer || ''}
-              onChange={(e) => setSettings({
-                ...settings,
-                customMetadata: {
-                  ...settings.customMetadata,
-                  producer: e.target.value
-                }
-              })}
-              placeholder="Stirling-PDF"
-              disabled={!loginEnabled}
-            />
-          </div>
-        </Stack>
-      </Paper>
-
-      {/* Custom Paths */}
-      <Paper withBorder p="md" radius="md">
-        <Stack gap="md">
-          <div>
-            <Text fw={600} size="sm" mb="xs">{t('admin.settings.general.customPaths.label', 'Custom Paths')}</Text>
-            <Text size="xs" c="dimmed">
-              {t('admin.settings.general.customPaths.description', 'Configure custom file system paths for pipeline processing and external tools')}
-            </Text>
-          </div>
-
-          <Text fw={500} size="sm" mt="xs">{t('admin.settings.general.customPaths.pipeline.label', 'Pipeline Directories')}</Text>
-
-          <div>
-            <TextInput
-              label={
-                <Group gap="xs">
-                  <span>{t('admin.settings.general.customPaths.pipeline.pipelineDir.label', 'Pipeline Directory')}</span>
-                  <PendingBadge show={isFieldPending('customPaths.pipeline.pipelineDir')} />
-                </Group>
-              }
-              description={t('admin.settings.general.customPaths.pipeline.pipelineDir.description', 'Base directory for pipeline resources (leave empty for default: /pipeline)')}
-              value={settings.customPaths?.pipeline?.pipelineDir || ''}
-              onChange={(e) => setSettings({
-                ...settings,
-                customPaths: {
-                  ...settings.customPaths,
-                  pipeline: {
-                    ...settings.customPaths?.pipeline,
-                    pipelineDir: e.target.value
-                  }
-                }
-              })}
-              placeholder="/pipeline"
-              disabled={!loginEnabled}
-            />
-          </div>
-
-          <div>
-            <Textarea
-              label={
-                <Group gap="xs">
-                  <span>{t('admin.settings.general.customPaths.pipeline.watchedFoldersDirs.label', 'Watched Folders Directories')}</span>
-                  <PendingBadge show={
-                    isFieldPending('customPaths.pipeline.watchedFoldersDirs')
-                    || isFieldPending('customPaths.pipeline.watchedFoldersDir')
-                  } />
-                </Group>
-              }
-              description={t('admin.settings.general.customPaths.pipeline.watchedFoldersDirs.description', 'Directories where pipeline monitors for incoming PDFs (one per line or comma-separated; leave empty for default: /pipeline/watchedFolders)')}
-              value={watchedFoldersInput}
-              onChange={(e) => {
-                const parsedDirs = parseWatchedFoldersInput(e.target.value);
-                setSettings({
-                  ...settings,
-                  customPaths: {
-                    ...settings.customPaths,
-                    pipeline: {
-                      ...settings.customPaths?.pipeline,
-                      watchedFoldersDir: parsedDirs[0] || '',
-                      watchedFoldersDirs: parsedDirs
-                    }
-                  }
-                });
+            <div
+              style={{
+                display: "flex",
+                alignItems: "center",
+                justifyContent: "space-between",
               }}
-              placeholder="/pipeline/watchedFolders"
-              minRows={3}
-              autosize
-              disabled={!loginEnabled}
-            />
-            {watchedFoldersValidation && (
-              <Stack gap="xs" mt="xs">
-                {watchedFoldersValidation.map((warning, idx) => (
-                  <Text
-                    key={idx}
-                    size="sm"
-                    c={warning.includes('CRITICAL') ? 'red' : 'yellow'}
-                  >
-                    {warning}
-                  </Text>
-                ))}
-              </Stack>
-            )}
-          </div>
-
-          <div>
-            <TextInput
-              label={
-                <Group gap="xs">
-                  <span>{t('admin.settings.general.customPaths.pipeline.finishedFoldersDir.label', 'Finished Folders Directory')}</span>
-                  <PendingBadge show={isFieldPending('customPaths.pipeline.finishedFoldersDir')} />
-                </Group>
-              }
-              description={t('admin.settings.general.customPaths.pipeline.finishedFoldersDir.description', 'Directory where processed PDFs are outputted (leave empty for default: /pipeline/finishedFolders)')}
-              value={settings.customPaths?.pipeline?.finishedFoldersDir || ''}
-              onChange={(e) => setSettings({
-                ...settings,
-                customPaths: {
-                  ...settings.customPaths,
-                  pipeline: {
-                    ...settings.customPaths?.pipeline,
-                    finishedFoldersDir: e.target.value
+            >
+              <div>
+                <Text fw={500} size="sm">
+                  {t(
+                    "admin.settings.general.hideDisabledTools.mobileScanner.label",
+                    "Hide Mobile Scanner",
+                  )}
+                </Text>
+                <Text size="xs" c="dimmed" mt={4}>
+                  {t(
+                    "admin.settings.general.hideDisabledTools.mobileScanner.description",
+                    "Hide mobile QR scanner button when not enabled",
+                  )}
+                </Text>
+              </div>
+              <Group gap="xs">
+                <Switch
+                  checked={
+                    settings.ui?.hideDisabledTools?.mobileQRScanner || false
                   }
-                }
-              })}
-              placeholder="/pipeline/finishedFolders"
-              disabled={!loginEnabled}
-            />
-          </div>
-
-          <Text fw={500} size="sm" mt="md">{t('admin.settings.general.customPaths.operations.label', 'External Tool Paths')}</Text>
-
-          <div>
-            <TextInput
-              label={
-                <Group gap="xs">
-                  <span>{t('admin.settings.general.customPaths.operations.weasyprint.label', 'WeasyPrint Executable')}</span>
-                  <PendingBadge show={isFieldPending('customPaths.operations.weasyprint')} />
-                </Group>
-              }
-              description={t('admin.settings.general.customPaths.operations.weasyprint.description', 'Path to WeasyPrint executable for HTML to PDF conversion (leave empty for default: /opt/venv/bin/weasyprint)')}
-              value={settings.customPaths?.operations?.weasyprint || ''}
-              onChange={(e) => setSettings({
-                ...settings,
-                customPaths: {
-                  ...settings.customPaths,
-                  operations: {
-                    ...settings.customPaths?.operations,
-                    weasyprint: e.target.value
+                  onChange={(e) =>
+                    setSettings({
+                      ...settings,
+                      ui: {
+                        ...settings.ui,
+                        hideDisabledTools: {
+                          ...settings.ui?.hideDisabledTools,
+                          mobileQRScanner: e.target.checked,
+                        },
+                      },
+                    })
                   }
-                }
-              })}
-              placeholder="/opt/venv/bin/weasyprint"
-              disabled={!loginEnabled}
-            />
-          </div>
+                  disabled={!loginEnabled}
+                />
+                <PendingBadge
+                  show={isFieldPending("ui.hideDisabledTools.mobileQRScanner")}
+                />
+              </Group>
+            </div>
 
-          <div>
-            <TextInput
-              label={
-                <Group gap="xs">
-                  <span>{t('admin.settings.general.customPaths.operations.unoconvert.label', 'Unoconvert Executable')}</span>
-                  <PendingBadge show={isFieldPending('customPaths.operations.unoconvert')} />
-                </Group>
-              }
-              description={t('admin.settings.general.customPaths.operations.unoconvert.description', 'Path to LibreOffice unoconvert for document conversions (leave empty for default: /opt/venv/bin/unoconvert)')}
-              value={settings.customPaths?.operations?.unoconvert || ''}
-              onChange={(e) => setSettings({
-                ...settings,
-                customPaths: {
-                  ...settings.customPaths,
-                  operations: {
-                    ...settings.customPaths?.operations,
-                    unoconvert: e.target.value
+            <div
+              style={{
+                display: "flex",
+                alignItems: "center",
+                justifyContent: "space-between",
+              }}
+            >
+              <div>
+                <Text fw={500} size="sm">
+                  {t(
+                    "admin.settings.general.showUpdate.label",
+                    "Show Update Notifications",
+                  )}
+                </Text>
+                <Text size="xs" c="dimmed" mt={4}>
+                  {t(
+                    "admin.settings.general.showUpdate.description",
+                    "Display notifications when a new version is available",
+                  )}
+                </Text>
+              </div>
+              <Group gap="xs">
+                <Switch
+                  checked={settings.system?.showUpdate || false}
+                  onChange={(e) =>
+                    setSettings({
+                      ...settings,
+                      system: {
+                        ...settings.system,
+                        showUpdate: e.target.checked,
+                      },
+                    })
                   }
-                }
-              })}
-              placeholder="/opt/venv/bin/unoconvert"
-              disabled={!loginEnabled}
-            />
-          </div>
-        </Stack>
-      </Paper>
+                  disabled={!loginEnabled}
+                />
+                <PendingBadge show={isFieldPending("system.showUpdate")} />
+              </Group>
+            </div>
 
+            <div
+              style={{
+                display: "flex",
+                alignItems: "center",
+                justifyContent: "space-between",
+              }}
+            >
+              <div>
+                <Text fw={500} size="sm">
+                  {t(
+                    "admin.settings.general.showUpdateOnlyAdmin.label",
+                    "Show Updates to Admins Only",
+                  )}
+                </Text>
+                <Text size="xs" c="dimmed" mt={4}>
+                  {t(
+                    "admin.settings.general.showUpdateOnlyAdmin.description",
+                    "Restrict update notifications to admin users only",
+                  )}
+                </Text>
+              </div>
+              <Group gap="xs">
+                <Switch
+                  checked={settings.system?.showUpdateOnlyAdmin || false}
+                  onChange={(e) =>
+                    setSettings({
+                      ...settings,
+                      system: {
+                        ...settings.system,
+                        showUpdateOnlyAdmin: e.target.checked,
+                      },
+                    })
+                  }
+                  disabled={!loginEnabled}
+                />
+                <PendingBadge
+                  show={isFieldPending("system.showUpdateOnlyAdmin")}
+                />
+              </Group>
+            </div>
+
+            <div
+              style={{
+                display: "flex",
+                alignItems: "center",
+                justifyContent: "space-between",
+              }}
+            >
+              <div>
+                <Text fw={500} size="sm">
+                  {t(
+                    "admin.settings.general.customHTMLFiles.label",
+                    "Custom HTML Files",
+                  )}
+                </Text>
+                <Text size="xs" c="dimmed" mt={4}>
+                  {t(
+                    "admin.settings.general.customHTMLFiles.description",
+                    "Allow serving custom HTML files from the customFiles directory",
+                  )}
+                </Text>
+              </div>
+              <Group gap="xs">
+                <Switch
+                  checked={settings.system?.customHTMLFiles || false}
+                  onChange={(e) =>
+                    setSettings({
+                      ...settings,
+                      system: {
+                        ...settings.system,
+                        customHTMLFiles: e.target.checked,
+                      },
+                    })
+                  }
+                  disabled={!loginEnabled}
+                />
+                <PendingBadge show={isFieldPending("system.customHTMLFiles")} />
+              </Group>
+            </div>
+          </Stack>
+        </Paper>
+
+        {/* Custom Metadata - Premium Feature */}
+        <Paper withBorder p="md" radius="md">
+          <Stack gap="md">
+            <Group justify="space-between" align="center">
+              <Text fw={600} size="sm">
+                {t(
+                  "admin.settings.general.customMetadata.label",
+                  "Custom Metadata",
+                )}
+              </Text>
+              <Badge
+                color="grape"
+                size="sm"
+                style={{ cursor: "pointer" }}
+                onClick={() => navigate("/settings/adminPlan")}
+                title={t(
+                  "admin.settings.badge.clickToUpgrade",
+                  "Click to view plan details",
+                )}
+              >
+                PRO
+              </Badge>
+            </Group>
+
+            <div
+              style={{
+                display: "flex",
+                alignItems: "center",
+                justifyContent: "space-between",
+              }}
+            >
+              <div>
+                <Text fw={500} size="sm">
+                  {t(
+                    "admin.settings.general.customMetadata.autoUpdate.label",
+                    "Auto Update Metadata",
+                  )}
+                </Text>
+                <Text size="xs" c="dimmed" mt={4}>
+                  {t(
+                    "admin.settings.general.customMetadata.autoUpdate.description",
+                    "Automatically update PDF metadata on all processed documents",
+                  )}
+                </Text>
+              </div>
+              <Group gap="xs">
+                <Switch
+                  checked={settings.customMetadata?.autoUpdateMetadata || false}
+                  onChange={(e) =>
+                    setSettings({
+                      ...settings,
+                      customMetadata: {
+                        ...settings.customMetadata,
+                        autoUpdateMetadata: e.target.checked,
+                      },
+                    })
+                  }
+                  disabled={!loginEnabled}
+                />
+                <PendingBadge
+                  show={isFieldPending("customMetadata.autoUpdateMetadata")}
+                />
+              </Group>
+            </div>
+
+            <div>
+              <TextInput
+                label={
+                  <Group gap="xs">
+                    <span>
+                      {t(
+                        "admin.settings.general.customMetadata.author.label",
+                        "Default Author",
+                      )}
+                    </span>
+                    <PendingBadge
+                      show={isFieldPending("customMetadata.author")}
+                    />
+                  </Group>
+                }
+                description={t(
+                  "admin.settings.general.customMetadata.author.description",
+                  "Default author for PDF metadata (e.g., username)",
+                )}
+                value={settings.customMetadata?.author || ""}
+                onChange={(e) =>
+                  setSettings({
+                    ...settings,
+                    customMetadata: {
+                      ...settings.customMetadata,
+                      author: e.target.value,
+                    },
+                  })
+                }
+                placeholder="username"
+                disabled={!loginEnabled}
+              />
+            </div>
+
+            <div>
+              <TextInput
+                label={
+                  <Group gap="xs">
+                    <span>
+                      {t(
+                        "admin.settings.general.customMetadata.creator.label",
+                        "Default Creator",
+                      )}
+                    </span>
+                    <PendingBadge
+                      show={isFieldPending("customMetadata.creator")}
+                    />
+                  </Group>
+                }
+                description={t(
+                  "admin.settings.general.customMetadata.creator.description",
+                  "Default creator for PDF metadata",
+                )}
+                value={settings.customMetadata?.creator || ""}
+                onChange={(e) =>
+                  setSettings({
+                    ...settings,
+                    customMetadata: {
+                      ...settings.customMetadata,
+                      creator: e.target.value,
+                    },
+                  })
+                }
+                placeholder="Stirling-PDF"
+                disabled={!loginEnabled}
+              />
+            </div>
+
+            <div>
+              <TextInput
+                label={
+                  <Group gap="xs">
+                    <span>
+                      {t(
+                        "admin.settings.general.customMetadata.producer.label",
+                        "Default Producer",
+                      )}
+                    </span>
+                    <PendingBadge
+                      show={isFieldPending("customMetadata.producer")}
+                    />
+                  </Group>
+                }
+                description={t(
+                  "admin.settings.general.customMetadata.producer.description",
+                  "Default producer for PDF metadata",
+                )}
+                value={settings.customMetadata?.producer || ""}
+                onChange={(e) =>
+                  setSettings({
+                    ...settings,
+                    customMetadata: {
+                      ...settings.customMetadata,
+                      producer: e.target.value,
+                    },
+                  })
+                }
+                placeholder="Stirling-PDF"
+                disabled={!loginEnabled}
+              />
+            </div>
+          </Stack>
+        </Paper>
+
+        {/* Custom Paths */}
+        <Paper withBorder p="md" radius="md">
+          <Stack gap="md">
+            <div>
+              <Text fw={600} size="sm" mb="xs">
+                {t("admin.settings.general.customPaths.label", "Custom Paths")}
+              </Text>
+              <Text size="xs" c="dimmed">
+                {t(
+                  "admin.settings.general.customPaths.description",
+                  "Configure custom file system paths for pipeline processing and external tools",
+                )}
+              </Text>
+            </div>
+
+            <Text fw={500} size="sm" mt="xs">
+              {t(
+                "admin.settings.general.customPaths.pipeline.label",
+                "Pipeline Directories",
+              )}
+            </Text>
+
+            <div>
+              <TextInput
+                label={
+                  <Group gap="xs">
+                    <span>
+                      {t(
+                        "admin.settings.general.customPaths.pipeline.pipelineDir.label",
+                        "Pipeline Directory",
+                      )}
+                    </span>
+                    <PendingBadge
+                      show={isFieldPending("customPaths.pipeline.pipelineDir")}
+                    />
+                  </Group>
+                }
+                description={t(
+                  "admin.settings.general.customPaths.pipeline.pipelineDir.description",
+                  "Base directory for pipeline resources (leave empty for default: /pipeline)",
+                )}
+                value={settings.customPaths?.pipeline?.pipelineDir || ""}
+                onChange={(e) =>
+                  setSettings({
+                    ...settings,
+                    customPaths: {
+                      ...settings.customPaths,
+                      pipeline: {
+                        ...settings.customPaths?.pipeline,
+                        pipelineDir: e.target.value,
+                      },
+                    },
+                  })
+                }
+                placeholder="/pipeline"
+                disabled={!loginEnabled}
+              />
+            </div>
+
+            <div>
+              <Textarea
+                label={
+                  <Group gap="xs">
+                    <span>
+                      {t(
+                        "admin.settings.general.customPaths.pipeline.watchedFoldersDirs.label",
+                        "Watched Folders Directories",
+                      )}
+                    </span>
+                    <PendingBadge
+                      show={
+                        isFieldPending(
+                          "customPaths.pipeline.watchedFoldersDirs",
+                        ) ||
+                        isFieldPending("customPaths.pipeline.watchedFoldersDir")
+                      }
+                    />
+                  </Group>
+                }
+                description={t(
+                  "admin.settings.general.customPaths.pipeline.watchedFoldersDirs.description",
+                  "Directories where pipeline monitors for incoming PDFs (one per line or comma-separated; leave empty for default: /pipeline/watchedFolders)",
+                )}
+                value={watchedFoldersInput}
+                onChange={(e) => {
+                  const parsedDirs = parseWatchedFoldersInput(e.target.value);
+                  setSettings({
+                    ...settings,
+                    customPaths: {
+                      ...settings.customPaths,
+                      pipeline: {
+                        ...settings.customPaths?.pipeline,
+                        watchedFoldersDir: parsedDirs[0] || "",
+                        watchedFoldersDirs: parsedDirs,
+                      },
+                    },
+                  });
+                }}
+                placeholder="/pipeline/watchedFolders"
+                minRows={3}
+                autosize
+                disabled={!loginEnabled}
+              />
+              {watchedFoldersValidation && (
+                <Stack gap="xs" mt="xs">
+                  {watchedFoldersValidation.map((warning, idx) => (
+                    <Text
+                      key={idx}
+                      size="sm"
+                      c={warning.includes("CRITICAL") ? "red" : "yellow"}
+                    >
+                      {warning}
+                    </Text>
+                  ))}
+                </Stack>
+              )}
+            </div>
+
+            <div>
+              <TextInput
+                label={
+                  <Group gap="xs">
+                    <span>
+                      {t(
+                        "admin.settings.general.customPaths.pipeline.finishedFoldersDir.label",
+                        "Finished Folders Directory",
+                      )}
+                    </span>
+                    <PendingBadge
+                      show={isFieldPending(
+                        "customPaths.pipeline.finishedFoldersDir",
+                      )}
+                    />
+                  </Group>
+                }
+                description={t(
+                  "admin.settings.general.customPaths.pipeline.finishedFoldersDir.description",
+                  "Directory where processed PDFs are outputted (leave empty for default: /pipeline/finishedFolders)",
+                )}
+                value={settings.customPaths?.pipeline?.finishedFoldersDir || ""}
+                onChange={(e) =>
+                  setSettings({
+                    ...settings,
+                    customPaths: {
+                      ...settings.customPaths,
+                      pipeline: {
+                        ...settings.customPaths?.pipeline,
+                        finishedFoldersDir: e.target.value,
+                      },
+                    },
+                  })
+                }
+                placeholder="/pipeline/finishedFolders"
+                disabled={!loginEnabled}
+              />
+            </div>
+
+            <Text fw={500} size="sm" mt="md">
+              {t(
+                "admin.settings.general.customPaths.operations.label",
+                "External Tool Paths",
+              )}
+            </Text>
+
+            <div>
+              <TextInput
+                label={
+                  <Group gap="xs">
+                    <span>
+                      {t(
+                        "admin.settings.general.customPaths.operations.weasyprint.label",
+                        "WeasyPrint Executable",
+                      )}
+                    </span>
+                    <PendingBadge
+                      show={isFieldPending("customPaths.operations.weasyprint")}
+                    />
+                  </Group>
+                }
+                description={t(
+                  "admin.settings.general.customPaths.operations.weasyprint.description",
+                  "Path to WeasyPrint executable for HTML to PDF conversion (leave empty for default: /opt/venv/bin/weasyprint)",
+                )}
+                value={settings.customPaths?.operations?.weasyprint || ""}
+                onChange={(e) =>
+                  setSettings({
+                    ...settings,
+                    customPaths: {
+                      ...settings.customPaths,
+                      operations: {
+                        ...settings.customPaths?.operations,
+                        weasyprint: e.target.value,
+                      },
+                    },
+                  })
+                }
+                placeholder="/opt/venv/bin/weasyprint"
+                disabled={!loginEnabled}
+              />
+            </div>
+
+            <div>
+              <TextInput
+                label={
+                  <Group gap="xs">
+                    <span>
+                      {t(
+                        "admin.settings.general.customPaths.operations.unoconvert.label",
+                        "Unoconvert Executable",
+                      )}
+                    </span>
+                    <PendingBadge
+                      show={isFieldPending("customPaths.operations.unoconvert")}
+                    />
+                  </Group>
+                }
+                description={t(
+                  "admin.settings.general.customPaths.operations.unoconvert.description",
+                  "Path to LibreOffice unoconvert for document conversions (leave empty for default: /opt/venv/bin/unoconvert)",
+                )}
+                value={settings.customPaths?.operations?.unoconvert || ""}
+                onChange={(e) =>
+                  setSettings({
+                    ...settings,
+                    customPaths: {
+                      ...settings.customPaths,
+                      operations: {
+                        ...settings.customPaths?.operations,
+                        unoconvert: e.target.value,
+                      },
+                    },
+                  })
+                }
+                placeholder="/opt/venv/bin/unoconvert"
+                disabled={!loginEnabled}
+              />
+            </div>
+          </Stack>
+        </Paper>
       </Stack>
 
       <SettingsStickyFooter
diff --git a/frontend/src/proprietary/components/shared/config/configSections/AdminLegalSection.tsx b/frontend/src/proprietary/components/shared/config/configSections/AdminLegalSection.tsx
index 551118f7c1..b86d554014 100644
--- a/frontend/src/proprietary/components/shared/config/configSections/AdminLegalSection.tsx
+++ b/frontend/src/proprietary/components/shared/config/configSections/AdminLegalSection.tsx
@@ -1,16 +1,24 @@
-import { useCallback, useEffect } from 'react';
-import { useTranslation } from 'react-i18next';
-import { TextInput, Stack, Paper, Text, Loader, Group, Alert } from '@mantine/core';
-import WarningIcon from '@mui/icons-material/Warning';
-import { alert } from '@app/components/toast';
-import RestartConfirmationModal from '@app/components/shared/config/RestartConfirmationModal';
-import { useRestartServer } from '@app/components/shared/config/useRestartServer';
-import { useAdminSettings } from '@app/hooks/useAdminSettings';
-import { useSettingsDirty } from '@app/hooks/useSettingsDirty';
-import PendingBadge from '@app/components/shared/config/PendingBadge';
-import { SettingsStickyFooter } from '@app/components/shared/config/SettingsStickyFooter';
-import { useLoginRequired } from '@app/hooks/useLoginRequired';
-import LoginRequiredBanner from '@app/components/shared/config/LoginRequiredBanner';
+import { useCallback, useEffect } from "react";
+import { useTranslation } from "react-i18next";
+import {
+  TextInput,
+  Stack,
+  Paper,
+  Text,
+  Loader,
+  Group,
+  Alert,
+} from "@mantine/core";
+import WarningIcon from "@mui/icons-material/Warning";
+import { alert } from "@app/components/toast";
+import RestartConfirmationModal from "@app/components/shared/config/RestartConfirmationModal";
+import { useRestartServer } from "@app/components/shared/config/useRestartServer";
+import { useAdminSettings } from "@app/hooks/useAdminSettings";
+import { useSettingsDirty } from "@app/hooks/useSettingsDirty";
+import PendingBadge from "@app/components/shared/config/PendingBadge";
+import { SettingsStickyFooter } from "@app/components/shared/config/SettingsStickyFooter";
+import { useLoginRequired } from "@app/hooks/useLoginRequired";
+import LoginRequiredBanner from "@app/components/shared/config/LoginRequiredBanner";
 
 interface LegalSettingsData {
   termsAndConditions?: string;
@@ -23,7 +31,12 @@ interface LegalSettingsData {
 export default function AdminLegalSection() {
   const { t } = useTranslation();
   const { loginEnabled, validateLoginEnabled } = useLoginRequired();
-  const { restartModalOpened, showRestartModal, closeRestartModal, restartServer } = useRestartServer();
+  const {
+    restartModalOpened,
+    showRestartModal,
+    closeRestartModal,
+    restartServer,
+  } = useRestartServer();
 
   const {
     settings,
@@ -34,7 +47,7 @@ export default function AdminLegalSection() {
     saveSettings,
     isFieldPending,
   } = useAdminSettings<LegalSettingsData>({
-    sectionName: 'legal',
+    sectionName: "legal",
   });
 
   useEffect(() => {
@@ -43,8 +56,10 @@ export default function AdminLegalSection() {
     }
   }, [loginEnabled]);
 
-
-  const { isDirty, resetToSnapshot, markSaved } = useSettingsDirty(settings, loading);
+  const { isDirty, resetToSnapshot, markSaved } = useSettingsDirty(
+    settings,
+    loading,
+  );
   const handleSave = async () => {
     if (!validateLoginEnabled()) {
       return;
@@ -55,9 +70,9 @@ export default function AdminLegalSection() {
       showRestartModal();
     } catch (_error) {
       alert({
-        alertType: 'error',
-        title: t('admin.error', 'Error'),
-        body: t('admin.settings.saveError', 'Failed to save settings'),
+        alertType: "error",
+        title: t("admin.error", "Error"),
+        body: t("admin.settings.saveError", "Failed to save settings"),
       });
     }
   };
@@ -80,112 +95,175 @@ export default function AdminLegalSection() {
   return (
     <div className="settings-section-container">
       <Stack gap="lg" className="settings-section-content">
-      <LoginRequiredBanner show={!loginEnabled} />
-      <div>
-        <Text fw={600} size="lg">{t('admin.settings.legal.title', 'Legal Documents')}</Text>
-        <Text size="sm" c="dimmed">
-          {t('admin.settings.legal.description', 'Configure links to legal documents and policies.')}
-        </Text>
-      </div>
+        <LoginRequiredBanner show={!loginEnabled} />
+        <div>
+          <Text fw={600} size="lg">
+            {t("admin.settings.legal.title", "Legal Documents")}
+          </Text>
+          <Text size="sm" c="dimmed">
+            {t(
+              "admin.settings.legal.description",
+              "Configure links to legal documents and policies.",
+            )}
+          </Text>
+        </div>
 
-      {/* Legal Disclaimer */}
-      <Alert
-        icon={<WarningIcon style={{ fontSize: 18 }} />}
-        title={t('admin.settings.legal.disclaimer.title', 'Legal Responsibility Warning')}
-        color="yellow"
-        variant="light"
-      >
-        <Text size="sm">
-          {t(
-            'admin.settings.legal.disclaimer.message',
-            'By customizing these legal documents, you assume full responsibility for ensuring compliance with all applicable laws and regulations, including but not limited to GDPR and other EU data protection requirements. Only modify these settings if: (1) you are operating a personal/private instance, (2) you are outside EU jurisdiction and understand your local legal obligations, or (3) you have obtained proper legal counsel and accept sole responsibility for all user data and legal compliance. Stirling-PDF and its developers assume no liability for your legal obligations.'
+        {/* Legal Disclaimer */}
+        <Alert
+          icon={<WarningIcon style={{ fontSize: 18 }} />}
+          title={t(
+            "admin.settings.legal.disclaimer.title",
+            "Legal Responsibility Warning",
           )}
-        </Text>
-      </Alert>
+          color="yellow"
+          variant="light"
+        >
+          <Text size="sm">
+            {t(
+              "admin.settings.legal.disclaimer.message",
+              "By customizing these legal documents, you assume full responsibility for ensuring compliance with all applicable laws and regulations, including but not limited to GDPR and other EU data protection requirements. Only modify these settings if: (1) you are operating a personal/private instance, (2) you are outside EU jurisdiction and understand your local legal obligations, or (3) you have obtained proper legal counsel and accept sole responsibility for all user data and legal compliance. Stirling-PDF and its developers assume no liability for your legal obligations.",
+            )}
+          </Text>
+        </Alert>
 
-      <Paper withBorder p="md" radius="md">
-        <Stack gap="md">
-          <div>
-            <TextInput
-              label={
-                <Group gap="xs">
-                  <span>{t('admin.settings.legal.termsAndConditions.label', 'Terms and Conditions')}</span>
-                  <PendingBadge show={isFieldPending('termsAndConditions')} />
-                </Group>
-              }
-              description={t('admin.settings.legal.termsAndConditions.description', 'URL or filename to terms and conditions')}
-              value={settings.termsAndConditions || ''}
-              onChange={(e) => setSettings({ ...settings, termsAndConditions: e.target.value })}
-              placeholder="https://example.com/terms"
-              disabled={!loginEnabled}
-            />
-          </div>
+        <Paper withBorder p="md" radius="md">
+          <Stack gap="md">
+            <div>
+              <TextInput
+                label={
+                  <Group gap="xs">
+                    <span>
+                      {t(
+                        "admin.settings.legal.termsAndConditions.label",
+                        "Terms and Conditions",
+                      )}
+                    </span>
+                    <PendingBadge show={isFieldPending("termsAndConditions")} />
+                  </Group>
+                }
+                description={t(
+                  "admin.settings.legal.termsAndConditions.description",
+                  "URL or filename to terms and conditions",
+                )}
+                value={settings.termsAndConditions || ""}
+                onChange={(e) =>
+                  setSettings({
+                    ...settings,
+                    termsAndConditions: e.target.value,
+                  })
+                }
+                placeholder="https://example.com/terms"
+                disabled={!loginEnabled}
+              />
+            </div>
 
-          <div>
-            <TextInput
-              label={
-                <Group gap="xs">
-                  <span>{t('admin.settings.legal.privacyPolicy.label', 'Privacy Policy')}</span>
-                  <PendingBadge show={isFieldPending('privacyPolicy')} />
-                </Group>
-              }
-              description={t('admin.settings.legal.privacyPolicy.description', 'URL or filename to privacy policy')}
-              value={settings.privacyPolicy || ''}
-              onChange={(e) => setSettings({ ...settings, privacyPolicy: e.target.value })}
-              placeholder="https://example.com/privacy"
-              disabled={!loginEnabled}
-            />
-          </div>
+            <div>
+              <TextInput
+                label={
+                  <Group gap="xs">
+                    <span>
+                      {t(
+                        "admin.settings.legal.privacyPolicy.label",
+                        "Privacy Policy",
+                      )}
+                    </span>
+                    <PendingBadge show={isFieldPending("privacyPolicy")} />
+                  </Group>
+                }
+                description={t(
+                  "admin.settings.legal.privacyPolicy.description",
+                  "URL or filename to privacy policy",
+                )}
+                value={settings.privacyPolicy || ""}
+                onChange={(e) =>
+                  setSettings({ ...settings, privacyPolicy: e.target.value })
+                }
+                placeholder="https://example.com/privacy"
+                disabled={!loginEnabled}
+              />
+            </div>
 
-          <div>
-            <TextInput
-              label={
-                <Group gap="xs">
-                  <span>{t('admin.settings.legal.accessibilityStatement.label', 'Accessibility Statement')}</span>
-                  <PendingBadge show={isFieldPending('accessibilityStatement')} />
-                </Group>
-              }
-              description={t('admin.settings.legal.accessibilityStatement.description', 'URL or filename to accessibility statement')}
-              value={settings.accessibilityStatement || ''}
-              onChange={(e) => setSettings({ ...settings, accessibilityStatement: e.target.value })}
-              placeholder="https://example.com/accessibility"
-              disabled={!loginEnabled}
-            />
-          </div>
+            <div>
+              <TextInput
+                label={
+                  <Group gap="xs">
+                    <span>
+                      {t(
+                        "admin.settings.legal.accessibilityStatement.label",
+                        "Accessibility Statement",
+                      )}
+                    </span>
+                    <PendingBadge
+                      show={isFieldPending("accessibilityStatement")}
+                    />
+                  </Group>
+                }
+                description={t(
+                  "admin.settings.legal.accessibilityStatement.description",
+                  "URL or filename to accessibility statement",
+                )}
+                value={settings.accessibilityStatement || ""}
+                onChange={(e) =>
+                  setSettings({
+                    ...settings,
+                    accessibilityStatement: e.target.value,
+                  })
+                }
+                placeholder="https://example.com/accessibility"
+                disabled={!loginEnabled}
+              />
+            </div>
 
-          <div>
-            <TextInput
-              label={
-                <Group gap="xs">
-                  <span>{t('admin.settings.legal.cookiePolicy.label', 'Cookie Policy')}</span>
-                  <PendingBadge show={isFieldPending('cookiePolicy')} />
-                </Group>
-              }
-              description={t('admin.settings.legal.cookiePolicy.description', 'URL or filename to cookie policy')}
-              value={settings.cookiePolicy || ''}
-              onChange={(e) => setSettings({ ...settings, cookiePolicy: e.target.value })}
-              placeholder="https://example.com/cookies"
-              disabled={!loginEnabled}
-            />
-          </div>
+            <div>
+              <TextInput
+                label={
+                  <Group gap="xs">
+                    <span>
+                      {t(
+                        "admin.settings.legal.cookiePolicy.label",
+                        "Cookie Policy",
+                      )}
+                    </span>
+                    <PendingBadge show={isFieldPending("cookiePolicy")} />
+                  </Group>
+                }
+                description={t(
+                  "admin.settings.legal.cookiePolicy.description",
+                  "URL or filename to cookie policy",
+                )}
+                value={settings.cookiePolicy || ""}
+                onChange={(e) =>
+                  setSettings({ ...settings, cookiePolicy: e.target.value })
+                }
+                placeholder="https://example.com/cookies"
+                disabled={!loginEnabled}
+              />
+            </div>
 
-          <div>
-            <TextInput
-              label={
-                <Group gap="xs">
-                  <span>{t('admin.settings.legal.impressum.label', 'Impressum')}</span>
-                  <PendingBadge show={isFieldPending('impressum')} />
-                </Group>
-              }
-              description={t('admin.settings.legal.impressum.description', 'URL or filename to impressum (required in some jurisdictions)')}
-              value={settings.impressum || ''}
-              onChange={(e) => setSettings({ ...settings, impressum: e.target.value })}
-              placeholder="https://example.com/impressum"
-              disabled={!loginEnabled}
-            />
-          </div>
-        </Stack>
-      </Paper>
+            <div>
+              <TextInput
+                label={
+                  <Group gap="xs">
+                    <span>
+                      {t("admin.settings.legal.impressum.label", "Impressum")}
+                    </span>
+                    <PendingBadge show={isFieldPending("impressum")} />
+                  </Group>
+                }
+                description={t(
+                  "admin.settings.legal.impressum.description",
+                  "URL or filename to impressum (required in some jurisdictions)",
+                )}
+                value={settings.impressum || ""}
+                onChange={(e) =>
+                  setSettings({ ...settings, impressum: e.target.value })
+                }
+                placeholder="https://example.com/impressum"
+                disabled={!loginEnabled}
+              />
+            </div>
+          </Stack>
+        </Paper>
       </Stack>
 
       <SettingsStickyFooter
diff --git a/frontend/src/proprietary/components/shared/config/configSections/AdminMailSection.tsx b/frontend/src/proprietary/components/shared/config/configSections/AdminMailSection.tsx
index bf19cbc987..402707bf7e 100644
--- a/frontend/src/proprietary/components/shared/config/configSections/AdminMailSection.tsx
+++ b/frontend/src/proprietary/components/shared/config/configSections/AdminMailSection.tsx
@@ -1,17 +1,27 @@
-import { useCallback, useEffect } from 'react';
-import { useTranslation } from 'react-i18next';
-import { useNavigate } from 'react-router-dom';
-import { TextInput, NumberInput, Switch, Stack, Paper, Text, Loader, Group, Anchor } from '@mantine/core';
-import { alert } from '@app/components/toast';
-import RestartConfirmationModal from '@app/components/shared/config/RestartConfirmationModal';
-import { useRestartServer } from '@app/components/shared/config/useRestartServer';
-import { useAdminSettings } from '@app/hooks/useAdminSettings';
-import { useSettingsDirty } from '@app/hooks/useSettingsDirty';
-import PendingBadge from '@app/components/shared/config/PendingBadge';
-import { SettingsStickyFooter } from '@app/components/shared/config/SettingsStickyFooter';
-import EditableSecretField from '@app/components/shared/EditableSecretField';
-import apiClient from '@app/services/apiClient';
-import { useLoginRequired } from '@app/hooks/useLoginRequired';
+import { useCallback, useEffect } from "react";
+import { useTranslation } from "react-i18next";
+import { useNavigate } from "react-router-dom";
+import {
+  TextInput,
+  NumberInput,
+  Switch,
+  Stack,
+  Paper,
+  Text,
+  Loader,
+  Group,
+  Anchor,
+} from "@mantine/core";
+import { alert } from "@app/components/toast";
+import RestartConfirmationModal from "@app/components/shared/config/RestartConfirmationModal";
+import { useRestartServer } from "@app/components/shared/config/useRestartServer";
+import { useAdminSettings } from "@app/hooks/useAdminSettings";
+import { useSettingsDirty } from "@app/hooks/useSettingsDirty";
+import PendingBadge from "@app/components/shared/config/PendingBadge";
+import { SettingsStickyFooter } from "@app/components/shared/config/SettingsStickyFooter";
+import EditableSecretField from "@app/components/shared/EditableSecretField";
+import apiClient from "@app/services/apiClient";
+import { useLoginRequired } from "@app/hooks/useLoginRequired";
 
 interface MailSettingsData {
   enabled?: boolean;
@@ -28,13 +38,19 @@ interface ApiResponseWithPending<T> {
   _pending?: Partial<T>;
 }
 
-type MailApiResponse = MailSettingsData & ApiResponseWithPending<MailSettingsData>;
+type MailApiResponse = MailSettingsData &
+  ApiResponseWithPending<MailSettingsData>;
 
 export default function AdminMailSection() {
   const { t } = useTranslation();
   const navigate = useNavigate();
   const { loginEnabled } = useLoginRequired();
-  const { restartModalOpened, showRestartModal, closeRestartModal, restartServer } = useRestartServer();
+  const {
+    restartModalOpened,
+    showRestartModal,
+    closeRestartModal,
+    restartServer,
+  } = useRestartServer();
 
   const {
     settings,
@@ -45,24 +61,31 @@ export default function AdminMailSection() {
     saveSettings,
     isFieldPending,
   } = useAdminSettings<MailSettingsData>({
-    sectionName: 'mail',
-    fetchTransformer: async (): Promise<MailSettingsData & { _pending?: Partial<MailSettingsData> }> => {
-      const mailResponse = await apiClient.get<MailApiResponse>('/api/v1/admin/settings/section/mail');
+    sectionName: "mail",
+    fetchTransformer: async (): Promise<
+      MailSettingsData & { _pending?: Partial<MailSettingsData> }
+    > => {
+      const mailResponse = await apiClient.get<MailApiResponse>(
+        "/api/v1/admin/settings/section/mail",
+      );
       return mailResponse.data || {};
     },
     saveTransformer: (settings: MailSettingsData) => {
       return {
         sectionData: settings,
-        deltaSettings: {}
+        deltaSettings: {},
       };
-    }
+    },
   });
 
   useEffect(() => {
     fetchSettings();
   }, []);
 
-  const { isDirty, resetToSnapshot, markSaved } = useSettingsDirty(settings, loading);
+  const { isDirty, resetToSnapshot, markSaved } = useSettingsDirty(
+    settings,
+    loading,
+  );
 
   const handleSave = async () => {
     try {
@@ -71,9 +94,9 @@ export default function AdminMailSection() {
       showRestartModal();
     } catch (_error) {
       alert({
-        alertType: 'error',
-        title: t('admin.error', 'Error'),
-        body: t('admin.settings.saveError', 'Failed to save settings'),
+        alertType: "error",
+        title: t("admin.error", "Error"),
+        body: t("admin.settings.saveError", "Failed to save settings"),
       });
     }
   };
@@ -95,127 +118,201 @@ export default function AdminMailSection() {
     <div className="settings-section-container">
       <Stack gap="lg" className="settings-section-content">
         <div>
-        <Text fw={600} size="lg">{t('admin.settings.mail.title', 'Mail Configuration')}</Text>
-        <Text size="sm" c="dimmed">
-          {t('admin.settings.mail.description', 'Configure SMTP settings for email notifications.')}
-        </Text>
-      </div>
+          <Text fw={600} size="lg">
+            {t("admin.settings.mail.title", "Mail Configuration")}
+          </Text>
+          <Text size="sm" c="dimmed">
+            {t(
+              "admin.settings.mail.description",
+              "Configure SMTP settings for email notifications.",
+            )}
+          </Text>
+        </div>
+
+        <Paper withBorder p="md" radius="md">
+          <Stack gap="md">
+            <Group justify="space-between" align="flex-start" wrap="nowrap">
+              <div>
+                <Text fw={500} size="sm">
+                  {t("admin.settings.mail.enabled.label", "Enable Mail")}
+                </Text>
+                <Text size="xs" c="dimmed" mt={4}>
+                  {t(
+                    "admin.settings.mail.enabled.description",
+                    "Enable email notifications and SMTP functionality",
+                  )}
+                </Text>
+              </div>
+              <Group gap="xs">
+                <Switch
+                  checked={settings.enabled || false}
+                  onChange={(e) =>
+                    setSettings({ ...settings, enabled: e.target.checked })
+                  }
+                />
+                <PendingBadge show={isFieldPending("enabled")} />
+              </Group>
+            </Group>
+
+            <Group justify="space-between" align="flex-start" wrap="nowrap">
+              <div>
+                <Text fw={500} size="sm">
+                  {t(
+                    "admin.settings.mail.enableInvites.label",
+                    "Enable Email Invites",
+                  )}
+                </Text>
+                <Text size="xs" c="dimmed" mt={4}>
+                  {t(
+                    "admin.settings.mail.enableInvites.description",
+                    "Allow admins to invite users via email with auto-generated passwords",
+                  )}
+                </Text>
+                <Text size="xs" c="orange" mt={8} fw={500}>
+                  {t(
+                    "admin.settings.mail.frontendUrlNote.note",
+                    "Note: Requires Frontend URL to be configured. ",
+                  )}
+                  <Anchor
+                    href="#"
+                    onClick={(e) => {
+                      e.preventDefault();
+                      navigate("/settings/adminGeneral#frontendUrl");
+                    }}
+                    c="orange"
+                    td="underline"
+                  >
+                    {t(
+                      "admin.settings.mail.frontendUrlNote.link",
+                      "Configure in System Settings",
+                    )}
+                  </Anchor>
+                </Text>
+              </div>
+              <Group gap="xs">
+                <Switch
+                  checked={settings.enableInvites || false}
+                  onChange={(e) =>
+                    setSettings({
+                      ...settings,
+                      enableInvites: e.target.checked,
+                    })
+                  }
+                  disabled={!settings.enabled}
+                />
+                <PendingBadge show={isFieldPending("enableInvites")} />
+              </Group>
+            </Group>
 
-      <Paper withBorder p="md" radius="md">
-        <Stack gap="md">
-          <Group justify="space-between" align="flex-start" wrap="nowrap">
             <div>
-              <Text fw={500} size="sm">{t('admin.settings.mail.enabled.label', 'Enable Mail')}</Text>
-              <Text size="xs" c="dimmed" mt={4}>
-                {t('admin.settings.mail.enabled.description', 'Enable email notifications and SMTP functionality')}
-              </Text>
-            </div>
-            <Group gap="xs">
-              <Switch
-                checked={settings.enabled || false}
-                onChange={(e) => setSettings({ ...settings, enabled: e.target.checked })}
+              <TextInput
+                label={
+                  <Group gap="xs">
+                    <span>
+                      {t("admin.settings.mail.host.label", "SMTP Host")}
+                    </span>
+                    <PendingBadge show={isFieldPending("host")} />
+                  </Group>
+                }
+                description={t(
+                  "admin.settings.mail.host.description",
+                  "SMTP server hostname",
+                )}
+                value={settings.host || ""}
+                onChange={(e) =>
+                  setSettings({ ...settings, host: e.target.value })
+                }
+                placeholder="smtp.example.com"
               />
-              <PendingBadge show={isFieldPending('enabled')} />
-            </Group>
-          </Group>
+            </div>
 
-          <Group justify="space-between" align="flex-start" wrap="nowrap">
             <div>
-              <Text fw={500} size="sm">{t('admin.settings.mail.enableInvites.label', 'Enable Email Invites')}</Text>
-              <Text size="xs" c="dimmed" mt={4}>
-                {t('admin.settings.mail.enableInvites.description', 'Allow admins to invite users via email with auto-generated passwords')}
-              </Text>
-              <Text size="xs" c="orange" mt={8} fw={500}>
-                {t('admin.settings.mail.frontendUrlNote.note', 'Note: Requires Frontend URL to be configured. ')}
-                <Anchor href="#" onClick={(e) => { e.preventDefault(); navigate('/settings/adminGeneral#frontendUrl'); }} c="orange" td="underline">
-                  {t('admin.settings.mail.frontendUrlNote.link', 'Configure in System Settings')}
-                </Anchor>
-              </Text>
-            </div>
-            <Group gap="xs">
-              <Switch
-                checked={settings.enableInvites || false}
-                onChange={(e) => setSettings({ ...settings, enableInvites: e.target.checked })}
-                disabled={!settings.enabled}
+              <NumberInput
+                label={
+                  <Group gap="xs">
+                    <span>
+                      {t("admin.settings.mail.port.label", "SMTP Port")}
+                    </span>
+                    <PendingBadge show={isFieldPending("port")} />
+                  </Group>
+                }
+                description={t(
+                  "admin.settings.mail.port.description",
+                  "SMTP server port (typically 587 for TLS, 465 for SSL)",
+                )}
+                value={settings.port || 587}
+                onChange={(value) =>
+                  setSettings({ ...settings, port: Number(value) })
+                }
+                min={1}
+                max={65535}
               />
-              <PendingBadge show={isFieldPending('enableInvites')} />
-            </Group>
-          </Group>
+            </div>
 
-          <div>
-            <TextInput
-              label={
-                <Group gap="xs">
-                  <span>{t('admin.settings.mail.host.label', 'SMTP Host')}</span>
-                  <PendingBadge show={isFieldPending('host')} />
-                </Group>
-              }
-              description={t('admin.settings.mail.host.description', 'SMTP server hostname')}
-              value={settings.host || ''}
-              onChange={(e) => setSettings({ ...settings, host: e.target.value })}
-              placeholder="smtp.example.com"
-            />
-          </div>
+            <div>
+              <TextInput
+                label={
+                  <Group gap="xs">
+                    <span>
+                      {t("admin.settings.mail.username.label", "SMTP Username")}
+                    </span>
+                    <PendingBadge show={isFieldPending("username")} />
+                  </Group>
+                }
+                description={t(
+                  "admin.settings.mail.username.description",
+                  "SMTP authentication username",
+                )}
+                value={settings.username || ""}
+                onChange={(e) =>
+                  setSettings({ ...settings, username: e.target.value })
+                }
+              />
+            </div>
 
-          <div>
-            <NumberInput
-              label={
-                <Group gap="xs">
-                  <span>{t('admin.settings.mail.port.label', 'SMTP Port')}</span>
-                  <PendingBadge show={isFieldPending('port')} />
-                </Group>
-              }
-              description={t('admin.settings.mail.port.description', 'SMTP server port (typically 587 for TLS, 465 for SSL)')}
-              value={settings.port || 587}
-              onChange={(value) => setSettings({ ...settings, port: Number(value) })}
-              min={1}
-              max={65535}
-            />
-          </div>
+            <div>
+              <Group gap="xs" align="center" mb={4}>
+                <span style={{ fontWeight: 500, fontSize: "0.875rem" }}>
+                  {t("admin.settings.mail.password.label", "SMTP Password")}
+                </span>
+                <PendingBadge show={isFieldPending("password")} />
+              </Group>
+              <EditableSecretField
+                description={t(
+                  "admin.settings.mail.password.description",
+                  "SMTP authentication password",
+                )}
+                value={settings.password || ""}
+                onChange={(value) =>
+                  setSettings({ ...settings, password: value })
+                }
+                placeholder="Enter SMTP password"
+              />
+            </div>
 
-          <div>
-            <TextInput
-              label={
-                <Group gap="xs">
-                  <span>{t('admin.settings.mail.username.label', 'SMTP Username')}</span>
-                  <PendingBadge show={isFieldPending('username')} />
-                </Group>
-              }
-              description={t('admin.settings.mail.username.description', 'SMTP authentication username')}
-              value={settings.username || ''}
-              onChange={(e) => setSettings({ ...settings, username: e.target.value })}
-            />
-          </div>
-
-          <div>
-            <Group gap="xs" align="center" mb={4}>
-              <span style={{ fontWeight: 500, fontSize: '0.875rem' }}>{t('admin.settings.mail.password.label', 'SMTP Password')}</span>
-              <PendingBadge show={isFieldPending('password')} />
-            </Group>
-            <EditableSecretField
-              description={t('admin.settings.mail.password.description', 'SMTP authentication password')}
-              value={settings.password || ''}
-              onChange={(value) => setSettings({ ...settings, password: value })}
-              placeholder="Enter SMTP password"
-            />
-          </div>
-
-          <div>
-            <TextInput
-              label={
-                <Group gap="xs">
-                  <span>{t('admin.settings.mail.from.label', 'From Address')}</span>
-                  <PendingBadge show={isFieldPending('from')} />
-                </Group>
-              }
-              description={t('admin.settings.mail.from.description', 'Email address to use as sender')}
-              value={settings.from || ''}
-              onChange={(e) => setSettings({ ...settings, from: e.target.value })}
-              placeholder="noreply@example.com"
-            />
-          </div>
-        </Stack>
-      </Paper>
+            <div>
+              <TextInput
+                label={
+                  <Group gap="xs">
+                    <span>
+                      {t("admin.settings.mail.from.label", "From Address")}
+                    </span>
+                    <PendingBadge show={isFieldPending("from")} />
+                  </Group>
+                }
+                description={t(
+                  "admin.settings.mail.from.description",
+                  "Email address to use as sender",
+                )}
+                value={settings.from || ""}
+                onChange={(e) =>
+                  setSettings({ ...settings, from: e.target.value })
+                }
+                placeholder="noreply@example.com"
+              />
+            </div>
+          </Stack>
+        </Paper>
       </Stack>
 
       <SettingsStickyFooter
diff --git a/frontend/src/proprietary/components/shared/config/configSections/AdminPlanSection.tsx b/frontend/src/proprietary/components/shared/config/configSections/AdminPlanSection.tsx
index 0b47cf1481..aa5f542b02 100644
--- a/frontend/src/proprietary/components/shared/config/configSections/AdminPlanSection.tsx
+++ b/frontend/src/proprietary/components/shared/config/configSections/AdminPlanSection.tsx
@@ -1,20 +1,26 @@
-import React, { useState, useCallback, useEffect, useMemo } from 'react';
-import { Divider, Loader, Alert } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { usePlans } from '@app/hooks/usePlans';
-import licenseService, { PlanTierGroup, mapLicenseToTier } from '@app/services/licenseService';
-import { useCheckout } from '@app/contexts/CheckoutContext';
-import { useLicense } from '@app/contexts/LicenseContext';
-import AvailablePlansSection from '@app/components/shared/config/configSections/plan/AvailablePlansSection';
-import StaticPlanSection from '@app/components/shared/config/configSections/plan/StaticPlanSection';
-import LicenseKeySection from '@app/components/shared/config/configSections/plan/LicenseKeySection';
-import { alert } from '@app/components/toast';
-import { InfoBanner } from '@app/components/shared/InfoBanner';
-import { useLicenseAlert } from '@app/hooks/useLicenseAlert';
-import { getPreferredCurrency, setCachedCurrency } from '@app/utils/currencyDetection';
-import { useLoginRequired } from '@app/hooks/useLoginRequired';
-import LoginRequiredBanner from '@core/components/shared/config/LoginRequiredBanner';
-import { isSupabaseConfigured } from '@app/services/supabaseClient';
+import React, { useState, useCallback, useEffect, useMemo } from "react";
+import { Divider, Loader, Alert } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import { usePlans } from "@app/hooks/usePlans";
+import licenseService, {
+  PlanTierGroup,
+  mapLicenseToTier,
+} from "@app/services/licenseService";
+import { useCheckout } from "@app/contexts/CheckoutContext";
+import { useLicense } from "@app/contexts/LicenseContext";
+import AvailablePlansSection from "@app/components/shared/config/configSections/plan/AvailablePlansSection";
+import StaticPlanSection from "@app/components/shared/config/configSections/plan/StaticPlanSection";
+import LicenseKeySection from "@app/components/shared/config/configSections/plan/LicenseKeySection";
+import { alert } from "@app/components/toast";
+import { InfoBanner } from "@app/components/shared/InfoBanner";
+import { useLicenseAlert } from "@app/hooks/useLicenseAlert";
+import {
+  getPreferredCurrency,
+  setCachedCurrency,
+} from "@app/utils/currencyDetection";
+import { useLoginRequired } from "@app/hooks/useLoginRequired";
+import LoginRequiredBanner from "@core/components/shared/config/LoginRequiredBanner";
+import { isSupabaseConfigured } from "@app/services/supabaseClient";
 
 const AdminPlanSection: React.FC = () => {
   const { t, i18n } = useTranslation();
@@ -39,13 +45,13 @@ const AdminPlanSection: React.FC = () => {
   }, [error]);
 
   const currencyOptions = [
-    { value: 'gbp', label: 'British pound (GBP, £)' },
-    { value: 'usd', label: 'US dollar (USD, $)' },
-    { value: 'eur', label: 'Euro (EUR, €)' },
-    { value: 'cny', label: 'Chinese yuan (CNY, ¥)' },
-    { value: 'inr', label: 'Indian rupee (INR, ₹)' },
-    { value: 'brl', label: 'Brazilian real (BRL, R$)' },
-    { value: 'idr', label: 'Indonesian rupiah (IDR, Rp)' },
+    { value: "gbp", label: "British pound (GBP, £)" },
+    { value: "usd", label: "US dollar (USD, $)" },
+    { value: "eur", label: "Euro (EUR, €)" },
+    { value: "cny", label: "Chinese yuan (CNY, ¥)" },
+    { value: "inr", label: "Indian rupee (INR, ₹)" },
+    { value: "brl", label: "Brazilian real (BRL, R$)" },
+    { value: "idr", label: "Indonesian rupiah (IDR, Rp)" },
   ];
 
   const handleManageClick = useCallback(async () => {
@@ -56,28 +62,32 @@ const AdminPlanSection: React.FC = () => {
 
     try {
       // Only allow PRO or ENTERPRISE licenses to access billing portal
-      if (!licenseInfo?.licenseType || licenseInfo.licenseType === 'NORMAL') {
-        throw new Error('No valid license found. Please purchase a license before accessing the billing portal.');
+      if (!licenseInfo?.licenseType || licenseInfo.licenseType === "NORMAL") {
+        throw new Error(
+          "No valid license found. Please purchase a license before accessing the billing portal.",
+        );
       }
 
       if (!licenseInfo?.licenseKey) {
-        throw new Error('License key missing. Please contact support.');
+        throw new Error("License key missing. Please contact support.");
       }
 
       // Create billing portal session with license key
       const response = await licenseService.createBillingPortalSession(
         window.location.href,
-        licenseInfo.licenseKey
+        licenseInfo.licenseKey,
       );
 
       // Open billing portal in new tab
-      window.open(response.url, '_blank');
-    } catch (error: any) {
-      console.error('Failed to open billing portal:', error);
+      window.open(response.url, "_blank");
+    } catch (error: unknown) {
+      console.error("Failed to open billing portal:", error);
       alert({
-        alertType: 'error',
-        title: t('billing.portal.error', 'Failed to open billing portal'),
-        body: error.message || 'Please try again or contact support.',
+        alertType: "error",
+        title: t("billing.portal.error", "Failed to open billing portal"),
+        body:
+          (error instanceof Error ? error.message : undefined) ||
+          "Please try again or contact support.",
       });
     }
   }, [licenseInfo, t, validateLoginEnabled]);
@@ -96,19 +106,19 @@ const AdminPlanSection: React.FC = () => {
       }
 
       // Only allow upgrades for server and enterprise tiers
-      if (planGroup.tier === 'free') {
+      if (planGroup.tier === "free") {
         return;
       }
 
       // Prevent free tier users from directly accessing enterprise (must have server first)
       const currentTier = mapLicenseToTier(licenseInfo);
-      if (currentTier === 'free' && planGroup.tier === 'enterprise') {
+      if (currentTier === "free" && planGroup.tier === "enterprise") {
         alert({
-          alertType: 'warning',
-          title: t('plan.enterprise.requiresServer', 'Server Plan Required'),
+          alertType: "warning",
+          title: t("plan.enterprise.requiresServer", "Server Plan Required"),
           body: t(
-            'plan.enterprise.requiresServerMessage',
-            'Please upgrade to the Server plan first before upgrading to Enterprise.'
+            "plan.enterprise.requiresServerMessage",
+            "Please upgrade to the Server plan first before upgrading to Enterprise.",
           ),
         });
         return;
@@ -124,13 +134,14 @@ const AdminPlanSection: React.FC = () => {
         },
       });
     },
-    [openCheckout, currency, refetch, licenseInfo, t, validateLoginEnabled]
+    [openCheckout, currency, refetch, licenseInfo, t, validateLoginEnabled],
   );
 
-  const shouldShowLicenseWarning = licenseAlert.active && licenseAlert.audience === 'admin';
+  const shouldShowLicenseWarning =
+    licenseAlert.active && licenseAlert.audience === "admin";
   const formattedUserCount = useMemo(() => {
     if (licenseAlert.totalUsers == null) {
-      return t('plan.licenseWarning.overLimit', 'more than {{limit}}', {
+      return t("plan.licenseWarning.overLimit", "more than {{limit}}", {
         limit: licenseAlert.freeTierLimit,
       });
     }
@@ -138,9 +149,9 @@ const AdminPlanSection: React.FC = () => {
   }, [licenseAlert.totalUsers, licenseAlert.freeTierLimit, t]);
 
   const scrollToPlans = useCallback(() => {
-    const el = document.getElementById('available-plans-section');
+    const el = document.getElementById("available-plans-section");
     if (el) {
-      el.scrollIntoView({ behavior: 'smooth', block: 'start' });
+      el.scrollIntoView({ behavior: "smooth", block: "start" });
     }
   }, []);
 
@@ -152,7 +163,14 @@ const AdminPlanSection: React.FC = () => {
   // Early returns after all hooks are called
   if (loading) {
     return (
-      <div style={{ display: 'flex', justifyContent: 'center', alignItems: 'center', padding: '2rem 0' }}>
+      <div
+        style={{
+          display: "flex",
+          justifyContent: "center",
+          alignItems: "center",
+          padding: "2rem 0",
+        }}
+      >
         <Loader size="lg" />
       </div>
     );
@@ -172,19 +190,22 @@ const AdminPlanSection: React.FC = () => {
   }
 
   return (
-    <div style={{ display: 'flex', flexDirection: 'column', gap: '2rem' }}>
+    <div style={{ display: "flex", flexDirection: "column", gap: "2rem" }}>
       <LoginRequiredBanner show={!loginEnabled} />
 
       {shouldShowLicenseWarning && (
         <InfoBanner
           icon="warning-rounded"
           tone="warning"
-          title={t('plan.licenseWarning.title', 'Free self-hosted limit reached')}
-          message={t('plan.licenseWarning.body', {
+          title={t(
+            "plan.licenseWarning.title",
+            "Free self-hosted limit reached",
+          )}
+          message={t("plan.licenseWarning.body", {
             total: formattedUserCount,
             limit: licenseAlert.freeTierLimit,
           })}
-          buttonText={t('plan.licenseWarning.cta', 'See plans')}
+          buttonText={t("plan.licenseWarning.cta", "See plans")}
           buttonIcon="upgrade-rounded"
           onButtonClick={scrollToPlans}
           dismissible={false}
diff --git a/frontend/src/proprietary/components/shared/config/configSections/AdminPremiumSection.tsx b/frontend/src/proprietary/components/shared/config/configSections/AdminPremiumSection.tsx
index 217b6d335b..8e49247a94 100644
--- a/frontend/src/proprietary/components/shared/config/configSections/AdminPremiumSection.tsx
+++ b/frontend/src/proprietary/components/shared/config/configSections/AdminPremiumSection.tsx
@@ -1,16 +1,26 @@
-import { useCallback, useEffect } from 'react';
-import { useTranslation } from 'react-i18next';
-import { TextInput, Switch, Stack, Paper, Text, Loader, Group, Alert, List } from '@mantine/core';
-import { alert } from '@app/components/toast';
-import LocalIcon from '@app/components/shared/LocalIcon';
-import RestartConfirmationModal from '@app/components/shared/config/RestartConfirmationModal';
-import { useRestartServer } from '@app/components/shared/config/useRestartServer';
-import { useAdminSettings } from '@app/hooks/useAdminSettings';
-import { useSettingsDirty } from '@app/hooks/useSettingsDirty';
-import PendingBadge from '@app/components/shared/config/PendingBadge';
-import { SettingsStickyFooter } from '@app/components/shared/config/SettingsStickyFooter';
-import { useLoginRequired } from '@app/hooks/useLoginRequired';
-import LoginRequiredBanner from '@app/components/shared/config/LoginRequiredBanner';
+import { useCallback, useEffect } from "react";
+import { useTranslation } from "react-i18next";
+import {
+  TextInput,
+  Switch,
+  Stack,
+  Paper,
+  Text,
+  Loader,
+  Group,
+  Alert,
+  List,
+} from "@mantine/core";
+import { alert } from "@app/components/toast";
+import LocalIcon from "@app/components/shared/LocalIcon";
+import RestartConfirmationModal from "@app/components/shared/config/RestartConfirmationModal";
+import { useRestartServer } from "@app/components/shared/config/useRestartServer";
+import { useAdminSettings } from "@app/hooks/useAdminSettings";
+import { useSettingsDirty } from "@app/hooks/useSettingsDirty";
+import PendingBadge from "@app/components/shared/config/PendingBadge";
+import { SettingsStickyFooter } from "@app/components/shared/config/SettingsStickyFooter";
+import { useLoginRequired } from "@app/hooks/useLoginRequired";
+import LoginRequiredBanner from "@app/components/shared/config/LoginRequiredBanner";
 
 interface PremiumSettingsData {
   key?: string;
@@ -19,8 +29,14 @@ interface PremiumSettingsData {
 
 export default function AdminPremiumSection() {
   const { t } = useTranslation();
-  const { loginEnabled, validateLoginEnabled, getDisabledStyles } = useLoginRequired();
-  const { restartModalOpened, showRestartModal, closeRestartModal, restartServer } = useRestartServer();
+  const { loginEnabled, validateLoginEnabled, getDisabledStyles } =
+    useLoginRequired();
+  const {
+    restartModalOpened,
+    showRestartModal,
+    closeRestartModal,
+    restartServer,
+  } = useRestartServer();
 
   const {
     settings,
@@ -31,7 +47,7 @@ export default function AdminPremiumSection() {
     saveSettings,
     isFieldPending,
   } = useAdminSettings<PremiumSettingsData>({
-    sectionName: 'premium',
+    sectionName: "premium",
   });
 
   useEffect(() => {
@@ -40,8 +56,10 @@ export default function AdminPremiumSection() {
     }
   }, [loginEnabled]);
 
-
-  const { isDirty, resetToSnapshot, markSaved } = useSettingsDirty(settings, loading);
+  const { isDirty, resetToSnapshot, markSaved } = useSettingsDirty(
+    settings,
+    loading,
+  );
   const handleSave = async () => {
     if (!validateLoginEnabled()) {
       return;
@@ -52,9 +70,9 @@ export default function AdminPremiumSection() {
       showRestartModal();
     } catch (_error) {
       alert({
-        alertType: 'error',
-        title: t('admin.error', 'Error'),
-        body: t('admin.settings.saveError', 'Failed to save settings'),
+        alertType: "error",
+        title: t("admin.error", "Error"),
+        body: t("admin.settings.saveError", "Failed to save settings"),
       });
     }
   };
@@ -77,75 +95,125 @@ export default function AdminPremiumSection() {
   return (
     <div className="settings-section-container">
       <Stack gap="lg" className="settings-section-content">
-      <LoginRequiredBanner show={!loginEnabled} />
-      <div>
-        <Text fw={600} size="lg">{t('admin.settings.premium.title', 'Premium & Enterprise')}</Text>
-        <Text size="sm" c="dimmed">
-          {t('admin.settings.premium.description', 'Configure your premium or enterprise license key.')}
-        </Text>
-      </div>
+        <LoginRequiredBanner show={!loginEnabled} />
+        <div>
+          <Text fw={600} size="lg">
+            {t("admin.settings.premium.title", "Premium & Enterprise")}
+          </Text>
+          <Text size="sm" c="dimmed">
+            {t(
+              "admin.settings.premium.description",
+              "Configure your premium or enterprise license key.",
+            )}
+          </Text>
+        </div>
 
-      {/* Notice about moved features */}
-      <Alert
-        variant="light"
-        color="blue"
-        title={t('admin.settings.premium.movedFeatures.title', 'Premium Features Distributed')}
-        icon={<LocalIcon icon="info-rounded" width="1rem" height="1rem" />}
-      >
-        <Text size="sm">
-          {t('admin.settings.premium.movedFeatures.message', 'Premium and Enterprise features are now organized in their respective sections:')}
-        </Text>
-        <List mt="xs" size="sm">
-          <List.Item><Text size="sm" component="span"><strong>SSO Auto Login</strong> (PRO) - Connections</Text></List.Item>
-          <List.Item><Text size="sm" component="span"><strong>Custom Metadata</strong> (PRO) - General</Text></List.Item>
-          <List.Item><Text size="sm" component="span"><strong>Audit Logging</strong> (ENTERPRISE) - Security</Text></List.Item>
-          <List.Item><Text size="sm" component="span"><strong>Database Configuration</strong> (ENTERPRISE) - Database</Text></List.Item>
-        </List>
-      </Alert>
-
-      {/* License Configuration */}
-      <Paper withBorder p="md" radius="md">
-        <Stack gap="md">
-          <Text fw={600} size="sm" mb="xs">{t('admin.settings.premium.license', 'License Configuration')}</Text>
-
-          <div>
-            <TextInput
-              label={
-                <Group gap="xs">
-                  <span>{t('admin.settings.premium.key.label', 'License Key')}</span>
-                  <PendingBadge show={isFieldPending('key')} />
-                </Group>
-              }
-              description={t('admin.settings.premium.key.description', 'Enter your premium or enterprise license key')}
-              value={settings.key || ''}
-              onChange={(e) => setSettings({ ...settings, key: e.target.value })}
-              placeholder="00000000-0000-0000-0000-000000000000"
-              disabled={!loginEnabled}
-            />
-          </div>
-
-          <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}>
-            <div>
-              <Text fw={500} size="sm">{t('admin.settings.premium.enabled.label', 'Enable Premium Features')}</Text>
-              <Text size="xs" c="dimmed" mt={4}>
-                {t('admin.settings.premium.enabled.description', 'Enable license key checks for pro/enterprise features')}
+        {/* Notice about moved features */}
+        <Alert
+          variant="light"
+          color="blue"
+          title={t(
+            "admin.settings.premium.movedFeatures.title",
+            "Premium Features Distributed",
+          )}
+          icon={<LocalIcon icon="info-rounded" width="1rem" height="1rem" />}
+        >
+          <Text size="sm">
+            {t(
+              "admin.settings.premium.movedFeatures.message",
+              "Premium and Enterprise features are now organized in their respective sections:",
+            )}
+          </Text>
+          <List mt="xs" size="sm">
+            <List.Item>
+              <Text size="sm" component="span">
+                <strong>SSO Auto Login</strong> (PRO) - Connections
               </Text>
-            </div>
-            <Group gap="xs">
-              <Switch
-                checked={settings.enabled || false}
-                onChange={(e) => {
-                  if (!loginEnabled) return;
-                  setSettings({ ...settings, enabled: e.target.checked });
-                }}
+            </List.Item>
+            <List.Item>
+              <Text size="sm" component="span">
+                <strong>Custom Metadata</strong> (PRO) - General
+              </Text>
+            </List.Item>
+            <List.Item>
+              <Text size="sm" component="span">
+                <strong>Audit Logging</strong> (ENTERPRISE) - Security
+              </Text>
+            </List.Item>
+            <List.Item>
+              <Text size="sm" component="span">
+                <strong>Database Configuration</strong> (ENTERPRISE) - Database
+              </Text>
+            </List.Item>
+          </List>
+        </Alert>
+
+        {/* License Configuration */}
+        <Paper withBorder p="md" radius="md">
+          <Stack gap="md">
+            <Text fw={600} size="sm" mb="xs">
+              {t("admin.settings.premium.license", "License Configuration")}
+            </Text>
+
+            <div>
+              <TextInput
+                label={
+                  <Group gap="xs">
+                    <span>
+                      {t("admin.settings.premium.key.label", "License Key")}
+                    </span>
+                    <PendingBadge show={isFieldPending("key")} />
+                  </Group>
+                }
+                description={t(
+                  "admin.settings.premium.key.description",
+                  "Enter your premium or enterprise license key",
+                )}
+                value={settings.key || ""}
+                onChange={(e) =>
+                  setSettings({ ...settings, key: e.target.value })
+                }
+                placeholder="00000000-0000-0000-0000-000000000000"
                 disabled={!loginEnabled}
-                styles={getDisabledStyles()}
               />
-              <PendingBadge show={isFieldPending('enabled')} />
-            </Group>
-          </div>
-        </Stack>
-      </Paper>
+            </div>
+
+            <div
+              style={{
+                display: "flex",
+                alignItems: "center",
+                justifyContent: "space-between",
+              }}
+            >
+              <div>
+                <Text fw={500} size="sm">
+                  {t(
+                    "admin.settings.premium.enabled.label",
+                    "Enable Premium Features",
+                  )}
+                </Text>
+                <Text size="xs" c="dimmed" mt={4}>
+                  {t(
+                    "admin.settings.premium.enabled.description",
+                    "Enable license key checks for pro/enterprise features",
+                  )}
+                </Text>
+              </div>
+              <Group gap="xs">
+                <Switch
+                  checked={settings.enabled || false}
+                  onChange={(e) => {
+                    if (!loginEnabled) return;
+                    setSettings({ ...settings, enabled: e.target.checked });
+                  }}
+                  disabled={!loginEnabled}
+                  styles={getDisabledStyles()}
+                />
+                <PendingBadge show={isFieldPending("enabled")} />
+              </Group>
+            </div>
+          </Stack>
+        </Paper>
       </Stack>
 
       <SettingsStickyFooter
diff --git a/frontend/src/proprietary/components/shared/config/configSections/AdminPrivacySection.tsx b/frontend/src/proprietary/components/shared/config/configSections/AdminPrivacySection.tsx
index aea2593bfe..7a2b8b5de0 100644
--- a/frontend/src/proprietary/components/shared/config/configSections/AdminPrivacySection.tsx
+++ b/frontend/src/proprietary/components/shared/config/configSections/AdminPrivacySection.tsx
@@ -1,16 +1,16 @@
-import { useCallback, useEffect } from 'react';
-import { useTranslation } from 'react-i18next';
-import { Switch, Stack, Paper, Text, Loader, Group } from '@mantine/core';
-import { alert } from '@app/components/toast';
-import RestartConfirmationModal from '@app/components/shared/config/RestartConfirmationModal';
-import { useRestartServer } from '@app/components/shared/config/useRestartServer';
-import { useAdminSettings } from '@app/hooks/useAdminSettings';
-import { useSettingsDirty } from '@app/hooks/useSettingsDirty';
-import PendingBadge from '@app/components/shared/config/PendingBadge';
-import { SettingsStickyFooter } from '@app/components/shared/config/SettingsStickyFooter';
-import { useLoginRequired } from '@app/hooks/useLoginRequired';
-import LoginRequiredBanner from '@app/components/shared/config/LoginRequiredBanner';
-import apiClient from '@app/services/apiClient';
+import { useCallback, useEffect } from "react";
+import { useTranslation } from "react-i18next";
+import { Switch, Stack, Paper, Text, Loader, Group } from "@mantine/core";
+import { alert } from "@app/components/toast";
+import RestartConfirmationModal from "@app/components/shared/config/RestartConfirmationModal";
+import { useRestartServer } from "@app/components/shared/config/useRestartServer";
+import { useAdminSettings } from "@app/hooks/useAdminSettings";
+import { useSettingsDirty } from "@app/hooks/useSettingsDirty";
+import PendingBadge from "@app/components/shared/config/PendingBadge";
+import { SettingsStickyFooter } from "@app/components/shared/config/SettingsStickyFooter";
+import { useLoginRequired } from "@app/hooks/useLoginRequired";
+import LoginRequiredBanner from "@app/components/shared/config/LoginRequiredBanner";
+import apiClient from "@app/services/apiClient";
 
 interface PrivacySettingsData {
   enableAnalytics?: boolean;
@@ -20,8 +20,14 @@ interface PrivacySettingsData {
 
 export default function AdminPrivacySection() {
   const { t } = useTranslation();
-  const { loginEnabled, validateLoginEnabled, getDisabledStyles } = useLoginRequired();
-  const { restartModalOpened, showRestartModal, closeRestartModal, restartServer } = useRestartServer();
+  const { loginEnabled, validateLoginEnabled, getDisabledStyles } =
+    useLoginRequired();
+  const {
+    restartModalOpened,
+    showRestartModal,
+    closeRestartModal,
+    restartServer,
+  } = useRestartServer();
 
   const {
     settings,
@@ -32,24 +38,28 @@ export default function AdminPrivacySection() {
     saveSettings,
     isFieldPending,
   } = useAdminSettings<PrivacySettingsData>({
-    sectionName: 'privacy',
-    fetchTransformer: async (): Promise<PrivacySettingsData & { _pending?: Record<string, any> }> => {
+    sectionName: "privacy",
+    fetchTransformer: async (): Promise<
+      PrivacySettingsData & { _pending?: Record<string, unknown> }
+    > => {
       const [metricsResponse, systemResponse] = await Promise.all([
-        apiClient.get('/api/v1/admin/settings/section/metrics'),
-        apiClient.get('/api/v1/admin/settings/section/system')
+        apiClient.get("/api/v1/admin/settings/section/metrics"),
+        apiClient.get("/api/v1/admin/settings/section/system"),
       ]);
 
       const metrics = metricsResponse.data;
       const system = systemResponse.data;
 
-      const result: PrivacySettingsData & { _pending?: Record<string, any> } = {
+      const result: PrivacySettingsData & {
+        _pending?: Record<string, unknown>;
+      } = {
         enableAnalytics: system.enableAnalytics || false,
         googleVisibility: system.googlevisibility || false,
-        metricsEnabled: metrics.enabled || false
+        metricsEnabled: metrics.enabled || false,
       };
 
       // Merge pending blocks from both endpoints
-      const pendingBlock: Record<string, any> = {};
+      const pendingBlock: Record<string, unknown> = {};
       if (system._pending?.enableAnalytics !== undefined) {
         pendingBlock.enableAnalytics = system._pending.enableAnalytics;
       }
@@ -68,16 +78,16 @@ export default function AdminPrivacySection() {
     },
     saveTransformer: (settings: PrivacySettingsData) => {
       const deltaSettings = {
-        'system.enableAnalytics': settings.enableAnalytics,
-        'system.googlevisibility': settings.googleVisibility,
-        'metrics.enabled': settings.metricsEnabled
+        "system.enableAnalytics": settings.enableAnalytics,
+        "system.googlevisibility": settings.googleVisibility,
+        "metrics.enabled": settings.metricsEnabled,
       };
 
       return {
         sectionData: {},
-        deltaSettings
+        deltaSettings,
       };
-    }
+    },
   });
 
   useEffect(() => {
@@ -86,7 +96,10 @@ export default function AdminPrivacySection() {
     }
   }, [loginEnabled, fetchSettings]);
 
-  const { isDirty, resetToSnapshot, markSaved } = useSettingsDirty(settings, loading);
+  const { isDirty, resetToSnapshot, markSaved } = useSettingsDirty(
+    settings,
+    loading,
+  );
 
   const handleDiscard = useCallback(() => {
     const original = resetToSnapshot();
@@ -103,9 +116,9 @@ export default function AdminPrivacySection() {
       showRestartModal();
     } catch (_error) {
       alert({
-        alertType: 'error',
-        title: t('admin.error', 'Error'),
-        body: t('admin.settings.saveError', 'Failed to save settings'),
+        alertType: "error",
+        title: t("admin.error", "Error"),
+        body: t("admin.settings.saveError", "Failed to save settings"),
       });
     }
   };
@@ -124,92 +137,154 @@ export default function AdminPrivacySection() {
   return (
     <div className="settings-section-container">
       <Stack gap="lg" className="settings-section-content">
-      <LoginRequiredBanner show={!loginEnabled} />
+        <LoginRequiredBanner show={!loginEnabled} />
 
-      <div>
-        <Text fw={600} size="lg">{t('admin.settings.privacy.title', 'Privacy')}</Text>
-        <Text size="sm" c="dimmed">
-          {t('admin.settings.privacy.description', 'Configure privacy and data collection settings.')}
-        </Text>
-      </div>
+        <div>
+          <Text fw={600} size="lg">
+            {t("admin.settings.privacy.title", "Privacy")}
+          </Text>
+          <Text size="sm" c="dimmed">
+            {t(
+              "admin.settings.privacy.description",
+              "Configure privacy and data collection settings.",
+            )}
+          </Text>
+        </div>
 
-      {/* Analytics & Tracking */}
-      <Paper withBorder p="md" radius="md">
-        <Stack gap="md">
-          <Text fw={600} size="sm" mb="xs">{t('admin.settings.privacy.analytics', 'Analytics & Tracking')}</Text>
+        {/* Analytics & Tracking */}
+        <Paper withBorder p="md" radius="md">
+          <Stack gap="md">
+            <Text fw={600} size="sm" mb="xs">
+              {t("admin.settings.privacy.analytics", "Analytics & Tracking")}
+            </Text>
 
-          <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}>
-            <div>
-              <Text fw={500} size="sm">{t('admin.settings.privacy.enableAnalytics.label', 'Enable Analytics')}</Text>
-              <Text size="xs" c="dimmed" mt={4}>
-                {t('admin.settings.privacy.enableAnalytics.description', 'Collect anonymous usage analytics to help improve the application')}
-              </Text>
+            <div
+              style={{
+                display: "flex",
+                alignItems: "center",
+                justifyContent: "space-between",
+              }}
+            >
+              <div>
+                <Text fw={500} size="sm">
+                  {t(
+                    "admin.settings.privacy.enableAnalytics.label",
+                    "Enable Analytics",
+                  )}
+                </Text>
+                <Text size="xs" c="dimmed" mt={4}>
+                  {t(
+                    "admin.settings.privacy.enableAnalytics.description",
+                    "Collect anonymous usage analytics to help improve the application",
+                  )}
+                </Text>
+              </div>
+              <Group gap="xs">
+                <Switch
+                  checked={settings?.enableAnalytics || false}
+                  onChange={(e) => {
+                    if (!loginEnabled) return;
+                    setSettings({
+                      ...settings,
+                      enableAnalytics: e.target.checked,
+                    });
+                  }}
+                  disabled={!loginEnabled}
+                  styles={getDisabledStyles()}
+                />
+                <PendingBadge show={isFieldPending("enableAnalytics")} />
+              </Group>
             </div>
-            <Group gap="xs">
-              <Switch
-                checked={settings?.enableAnalytics || false}
-                onChange={(e) => {
-                  if (!loginEnabled) return;
-                  setSettings({ ...settings, enableAnalytics: e.target.checked });
-                }}
-                disabled={!loginEnabled}
-                styles={getDisabledStyles()}
-              />
-              <PendingBadge show={isFieldPending('enableAnalytics')} />
-            </Group>
-          </div>
 
-          <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}>
-            <div>
-              <Text fw={500} size="sm">{t('admin.settings.privacy.metricsEnabled.label', 'Enable Metrics')}</Text>
-              <Text size="xs" c="dimmed" mt={4}>
-                {t('admin.settings.privacy.metricsEnabled.description', 'Enable collection of performance and usage metrics')}
-              </Text>
+            <div
+              style={{
+                display: "flex",
+                alignItems: "center",
+                justifyContent: "space-between",
+              }}
+            >
+              <div>
+                <Text fw={500} size="sm">
+                  {t(
+                    "admin.settings.privacy.metricsEnabled.label",
+                    "Enable Metrics",
+                  )}
+                </Text>
+                <Text size="xs" c="dimmed" mt={4}>
+                  {t(
+                    "admin.settings.privacy.metricsEnabled.description",
+                    "Enable collection of performance and usage metrics",
+                  )}
+                </Text>
+              </div>
+              <Group gap="xs">
+                <Switch
+                  checked={settings?.metricsEnabled || false}
+                  onChange={(e) => {
+                    if (!loginEnabled) return;
+                    setSettings({
+                      ...settings,
+                      metricsEnabled: e.target.checked,
+                    });
+                  }}
+                  disabled={!loginEnabled}
+                  styles={getDisabledStyles()}
+                />
+                <PendingBadge show={isFieldPending("metricsEnabled")} />
+              </Group>
             </div>
-            <Group gap="xs">
-              <Switch
-                checked={settings?.metricsEnabled || false}
-                onChange={(e) => {
-                  if (!loginEnabled) return;
-                  setSettings({ ...settings, metricsEnabled: e.target.checked });
-                }}
-                disabled={!loginEnabled}
-                styles={getDisabledStyles()}
-              />
-              <PendingBadge show={isFieldPending('metricsEnabled')} />
-            </Group>
-          </div>
-        </Stack>
-      </Paper>
+          </Stack>
+        </Paper>
 
-      {/* Search Engine Visibility */}
-      <Paper withBorder p="md" radius="md">
-        <Stack gap="md">
-          <Text fw={600} size="sm" mb="xs">{t('admin.settings.privacy.searchEngine', 'Search Engine Visibility')}</Text>
+        {/* Search Engine Visibility */}
+        <Paper withBorder p="md" radius="md">
+          <Stack gap="md">
+            <Text fw={600} size="sm" mb="xs">
+              {t(
+                "admin.settings.privacy.searchEngine",
+                "Search Engine Visibility",
+              )}
+            </Text>
 
-          <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}>
-            <div>
-              <Text fw={500} size="sm">{t('admin.settings.privacy.googleVisibility.label', 'Google Visibility')}</Text>
-              <Text size="xs" c="dimmed" mt={4}>
-                {t('admin.settings.privacy.googleVisibility.description', 'Allow search engines to index this application')}
-              </Text>
+            <div
+              style={{
+                display: "flex",
+                alignItems: "center",
+                justifyContent: "space-between",
+              }}
+            >
+              <div>
+                <Text fw={500} size="sm">
+                  {t(
+                    "admin.settings.privacy.googleVisibility.label",
+                    "Google Visibility",
+                  )}
+                </Text>
+                <Text size="xs" c="dimmed" mt={4}>
+                  {t(
+                    "admin.settings.privacy.googleVisibility.description",
+                    "Allow search engines to index this application",
+                  )}
+                </Text>
+              </div>
+              <Group gap="xs">
+                <Switch
+                  checked={settings?.googleVisibility || false}
+                  onChange={(e) => {
+                    if (!loginEnabled) return;
+                    setSettings({
+                      ...settings,
+                      googleVisibility: e.target.checked,
+                    });
+                  }}
+                  disabled={!loginEnabled}
+                  styles={getDisabledStyles()}
+                />
+                <PendingBadge show={isFieldPending("googleVisibility")} />
+              </Group>
             </div>
-            <Group gap="xs">
-              <Switch
-                checked={settings?.googleVisibility || false}
-                onChange={(e) => {
-                  if (!loginEnabled) return;
-                  setSettings({ ...settings, googleVisibility: e.target.checked });
-                }}
-                disabled={!loginEnabled}
-                styles={getDisabledStyles()}
-              />
-              <PendingBadge show={isFieldPending('googleVisibility')} />
-            </Group>
-          </div>
-        </Stack>
-      </Paper>
-
+          </Stack>
+        </Paper>
       </Stack>
 
       <SettingsStickyFooter
diff --git a/frontend/src/proprietary/components/shared/config/configSections/AdminSecuritySection.tsx b/frontend/src/proprietary/components/shared/config/configSections/AdminSecuritySection.tsx
index 29dc0c211f..6c701833fe 100644
--- a/frontend/src/proprietary/components/shared/config/configSections/AdminSecuritySection.tsx
+++ b/frontend/src/proprietary/components/shared/config/configSections/AdminSecuritySection.tsx
@@ -1,17 +1,30 @@
-import { useCallback, useEffect } from 'react';
-import { useTranslation } from 'react-i18next';
-import { NumberInput, Switch, Stack, Paper, Text, Loader, Group, Select, Alert, Badge, Accordion, Textarea } from '@mantine/core';
-import { alert } from '@app/components/toast';
-import LocalIcon from '@app/components/shared/LocalIcon';
-import RestartConfirmationModal from '@app/components/shared/config/RestartConfirmationModal';
-import { useRestartServer } from '@app/components/shared/config/useRestartServer';
-import { useAdminSettings } from '@app/hooks/useAdminSettings';
-import { useSettingsDirty } from '@app/hooks/useSettingsDirty';
-import PendingBadge from '@app/components/shared/config/PendingBadge';
-import { SettingsStickyFooter } from '@app/components/shared/config/SettingsStickyFooter';
-import apiClient from '@app/services/apiClient';
-import { useLoginRequired } from '@app/hooks/useLoginRequired';
-import LoginRequiredBanner from '@app/components/shared/config/LoginRequiredBanner';
+import { useCallback, useEffect } from "react";
+import { useTranslation } from "react-i18next";
+import {
+  NumberInput,
+  Switch,
+  Stack,
+  Paper,
+  Text,
+  Loader,
+  Group,
+  Select,
+  Alert,
+  Badge,
+  Accordion,
+  Textarea,
+} from "@mantine/core";
+import { alert } from "@app/components/toast";
+import LocalIcon from "@app/components/shared/LocalIcon";
+import RestartConfirmationModal from "@app/components/shared/config/RestartConfirmationModal";
+import { useRestartServer } from "@app/components/shared/config/useRestartServer";
+import { useAdminSettings } from "@app/hooks/useAdminSettings";
+import { useSettingsDirty } from "@app/hooks/useSettingsDirty";
+import PendingBadge from "@app/components/shared/config/PendingBadge";
+import { SettingsStickyFooter } from "@app/components/shared/config/SettingsStickyFooter";
+import apiClient from "@app/services/apiClient";
+import { useLoginRequired } from "@app/hooks/useLoginRequired";
+import LoginRequiredBanner from "@app/components/shared/config/LoginRequiredBanner";
 
 interface SecuritySettingsData {
   enableLogin?: boolean;
@@ -55,7 +68,12 @@ interface SecuritySettingsData {
 export default function AdminSecuritySection() {
   const { t } = useTranslation();
   const { loginEnabled, validateLoginEnabled } = useLoginRequired();
-  const { restartModalOpened, showRestartModal, closeRestartModal, restartServer } = useRestartServer();
+  const {
+    restartModalOpened,
+    showRestartModal,
+    closeRestartModal,
+    restartServer,
+  } = useRestartServer();
 
   const {
     settings,
@@ -66,35 +84,40 @@ export default function AdminSecuritySection() {
     saveSettings,
     isFieldPending,
   } = useAdminSettings<SecuritySettingsData>({
-    sectionName: 'security',
-    fetchTransformer: async (): Promise<SecuritySettingsData & { _pending?: Record<string, any> }> => {
-      const [securityResponse, premiumResponse, systemResponse] = await Promise.all([
-        apiClient.get('/api/v1/admin/settings/section/security'),
-        apiClient.get('/api/v1/admin/settings/section/premium'),
-        apiClient.get('/api/v1/admin/settings/section/system')
-      ]);
+    sectionName: "security",
+    fetchTransformer: async (): Promise<
+      SecuritySettingsData & { _pending?: Record<string, unknown> }
+    > => {
+      const [securityResponse, premiumResponse, systemResponse] =
+        await Promise.all([
+          apiClient.get("/api/v1/admin/settings/section/security"),
+          apiClient.get("/api/v1/admin/settings/section/premium"),
+          apiClient.get("/api/v1/admin/settings/section/system"),
+        ]);
 
       const securityData = securityResponse.data || {};
       const premiumData = premiumResponse.data || {};
       const systemData = systemResponse.data || {};
 
-      console.log('[AdminSecuritySection] Raw backend data:');
-      console.log('Security:', JSON.parse(JSON.stringify(securityData)));
-      console.log('Premium:', JSON.parse(JSON.stringify(premiumData)));
-      console.log('System:', JSON.parse(JSON.stringify(systemData)));
+      console.log("[AdminSecuritySection] Raw backend data:");
+      console.log("Security:", JSON.parse(JSON.stringify(securityData)));
+      console.log("Premium:", JSON.parse(JSON.stringify(premiumData)));
+      console.log("System:", JSON.parse(JSON.stringify(systemData)));
 
       const { _pending: securityPending, ...securityActive } = securityData;
       const { _pending: premiumPending, ...premiumActive } = premiumData;
       const { _pending: systemPending, ...systemActive } = systemData;
 
-      console.log('[AdminSecuritySection] Extracted pending blocks:', {
+      console.log("[AdminSecuritySection] Extracted pending blocks:", {
         securityPending: JSON.parse(JSON.stringify(securityPending || {})),
         premiumPending: JSON.parse(JSON.stringify(premiumPending || {})),
-        systemPending: JSON.parse(JSON.stringify(systemPending || {}))
+        systemPending: JSON.parse(JSON.stringify(systemPending || {})),
       });
 
-      const combined: SecuritySettingsData & { _pending?: Record<string, any> } = {
-        ...securityActive
+      const combined: SecuritySettingsData & {
+        _pending?: Record<string, unknown>;
+      } = {
+        ...securityActive,
       };
 
       // Only add audit if it exists (don't create defaults)
@@ -108,7 +131,7 @@ export default function AdminSecuritySection() {
       }
 
       // Merge all _pending blocks
-      const mergedPending: Record<string, any> = {};
+      const mergedPending: Record<string, unknown> = {};
       if (securityPending) {
         Object.assign(mergedPending, securityPending);
       }
@@ -128,52 +151,72 @@ export default function AdminSecuritySection() {
     saveTransformer: (settings: SecuritySettingsData) => {
       const { audit, html, ...securitySettings } = settings;
 
-      const deltaSettings: Record<string, any> = {
+      const deltaSettings: Record<string, unknown> = {
         // Security settings
-        'security.enableLogin': securitySettings.enableLogin,
-        'security.loginMethod': securitySettings.loginMethod,
-        'security.loginAttemptCount': securitySettings.loginAttemptCount,
-        'security.loginResetTimeMinutes': securitySettings.loginResetTimeMinutes,
-        'security.xFrameOptions': securitySettings.xFrameOptions,
+        "security.enableLogin": securitySettings.enableLogin,
+        "security.loginMethod": securitySettings.loginMethod,
+        "security.loginAttemptCount": securitySettings.loginAttemptCount,
+        "security.loginResetTimeMinutes":
+          securitySettings.loginResetTimeMinutes,
+        "security.xFrameOptions": securitySettings.xFrameOptions,
         // JWT settings
-        'security.jwt.persistence': securitySettings.jwt?.persistence,
-        'security.jwt.enableKeyRotation': securitySettings.jwt?.enableKeyRotation,
-        'security.jwt.enableKeyCleanup': securitySettings.jwt?.enableKeyCleanup,
-        'security.jwt.tokenExpiryMinutes': securitySettings.jwt?.tokenExpiryMinutes,
-        'security.jwt.desktopTokenExpiryMinutes': securitySettings.jwt?.desktopTokenExpiryMinutes,
-        'security.jwt.allowedClockSkewSeconds': securitySettings.jwt?.allowedClockSkewSeconds,
-        'security.jwt.refreshGraceMinutes': securitySettings.jwt?.refreshGraceMinutes,
-        'security.jwt.secureCookie': securitySettings.jwt?.secureCookie,
+        "security.jwt.persistence": securitySettings.jwt?.persistence,
+        "security.jwt.enableKeyRotation":
+          securitySettings.jwt?.enableKeyRotation,
+        "security.jwt.enableKeyCleanup": securitySettings.jwt?.enableKeyCleanup,
+        "security.jwt.tokenExpiryMinutes":
+          securitySettings.jwt?.tokenExpiryMinutes,
+        "security.jwt.desktopTokenExpiryMinutes":
+          securitySettings.jwt?.desktopTokenExpiryMinutes,
+        "security.jwt.allowedClockSkewSeconds":
+          securitySettings.jwt?.allowedClockSkewSeconds,
+        "security.jwt.refreshGraceMinutes":
+          securitySettings.jwt?.refreshGraceMinutes,
+        "security.jwt.secureCookie": securitySettings.jwt?.secureCookie,
         // Premium audit settings
-        'premium.enterpriseFeatures.audit.enabled': audit?.enabled,
-        'premium.enterpriseFeatures.audit.level': audit?.level,
-        'premium.enterpriseFeatures.audit.retentionDays': audit?.retentionDays,
-        'premium.enterpriseFeatures.audit.captureFileHash': audit?.captureFileHash,
-        'premium.enterpriseFeatures.audit.capturePdfAuthor': audit?.capturePdfAuthor,
-        'premium.enterpriseFeatures.audit.captureOperationResults': audit?.captureOperationResults
+        "premium.enterpriseFeatures.audit.enabled": audit?.enabled,
+        "premium.enterpriseFeatures.audit.level": audit?.level,
+        "premium.enterpriseFeatures.audit.retentionDays": audit?.retentionDays,
+        "premium.enterpriseFeatures.audit.captureFileHash":
+          audit?.captureFileHash,
+        "premium.enterpriseFeatures.audit.capturePdfAuthor":
+          audit?.capturePdfAuthor,
+        "premium.enterpriseFeatures.audit.captureOperationResults":
+          audit?.captureOperationResults,
       };
 
       // System HTML settings
       if (html?.urlSecurity) {
-        deltaSettings['system.html.urlSecurity.enabled'] = html.urlSecurity.enabled;
-        deltaSettings['system.html.urlSecurity.level'] = html.urlSecurity.level;
-        deltaSettings['system.html.urlSecurity.allowedDomains'] = html.urlSecurity.allowedDomains;
-        deltaSettings['system.html.urlSecurity.blockedDomains'] = html.urlSecurity.blockedDomains;
-        deltaSettings['system.html.urlSecurity.internalTlds'] = html.urlSecurity.internalTlds;
-        deltaSettings['system.html.urlSecurity.blockPrivateNetworks'] = html.urlSecurity.blockPrivateNetworks;
-        deltaSettings['system.html.urlSecurity.blockLocalhost'] = html.urlSecurity.blockLocalhost;
-        deltaSettings['system.html.urlSecurity.blockLinkLocal'] = html.urlSecurity.blockLinkLocal;
-        deltaSettings['system.html.urlSecurity.blockCloudMetadata'] = html.urlSecurity.blockCloudMetadata;
+        deltaSettings["system.html.urlSecurity.enabled"] =
+          html.urlSecurity.enabled;
+        deltaSettings["system.html.urlSecurity.level"] = html.urlSecurity.level;
+        deltaSettings["system.html.urlSecurity.allowedDomains"] =
+          html.urlSecurity.allowedDomains;
+        deltaSettings["system.html.urlSecurity.blockedDomains"] =
+          html.urlSecurity.blockedDomains;
+        deltaSettings["system.html.urlSecurity.internalTlds"] =
+          html.urlSecurity.internalTlds;
+        deltaSettings["system.html.urlSecurity.blockPrivateNetworks"] =
+          html.urlSecurity.blockPrivateNetworks;
+        deltaSettings["system.html.urlSecurity.blockLocalhost"] =
+          html.urlSecurity.blockLocalhost;
+        deltaSettings["system.html.urlSecurity.blockLinkLocal"] =
+          html.urlSecurity.blockLinkLocal;
+        deltaSettings["system.html.urlSecurity.blockCloudMetadata"] =
+          html.urlSecurity.blockCloudMetadata;
       }
 
       return {
         sectionData: {},
-        deltaSettings
+        deltaSettings,
       };
-    }
+    },
   });
 
-  const { isDirty, resetToSnapshot, markSaved } = useSettingsDirty(settings, loading);
+  const { isDirty, resetToSnapshot, markSaved } = useSettingsDirty(
+    settings,
+    loading,
+  );
 
   useEffect(() => {
     if (loginEnabled) {
@@ -196,9 +239,9 @@ export default function AdminSecuritySection() {
       showRestartModal();
     } catch (_error) {
       alert({
-        alertType: 'error',
-        title: t('admin.error', 'Error'),
-        body: t('admin.settings.saveError', 'Failed to save settings'),
+        alertType: "error",
+        title: t("admin.error", "Error"),
+        body: t("admin.settings.saveError", "Failed to save settings"),
       });
     }
   };
@@ -221,663 +264,1301 @@ export default function AdminSecuritySection() {
       <Stack gap="lg" className="settings-section-content">
         <LoginRequiredBanner show={!loginEnabled} />
 
-      <div>
-        <Text fw={600} size="lg">{t('admin.settings.security.title', 'Security')}</Text>
-        <Text size="sm" c="dimmed">
-          {t('admin.settings.security.description', 'Configure authentication, login behaviour, and security policies.')}
-        </Text>
-      </div>
-
-      {/* Authentication Settings */}
-      <Paper withBorder p="md" radius="md">
-        <Stack gap="md">
-          <Text fw={600} size="sm" mb="xs">{t('admin.settings.security.authentication', 'Authentication')}</Text>
-
-          <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}>
-            <div>
-              <Text fw={500} size="sm">{t('admin.settings.security.enableLogin.label', 'Enable Login')}</Text>
-              <Text size="xs" c="dimmed" mt={4}>
-                {t('admin.settings.security.enableLogin.description', 'Require users to log in before accessing the application')}
-              </Text>
-            </div>
-            <Group gap="xs">
-              <Switch
-                name="enableLogin"
-                checked={settings?.enableLogin || false}
-                onChange={(e) => setSettings({ ...settings, enableLogin: e.target.checked })}
-                disabled={!loginEnabled}
-              />
-              <PendingBadge show={isFieldPending('enableLogin')} />
-            </Group>
-          </div>
-
-          <div>
-            <Select
-              name="loginMethod"
-              label={t('admin.settings.security.loginMethod.label', 'Login Method')}
-              description={t('admin.settings.security.loginMethod.description', 'The authentication method to use for user login')}
-              value={settings?.loginMethod || 'all'}
-              onChange={(value) => setSettings({ ...settings, loginMethod: value || 'all' })}
-              data={[
-                { value: 'all', label: t('admin.settings.security.loginMethod.all', 'All Methods') },
-                { value: 'normal', label: t('admin.settings.security.loginMethod.normal', 'Username/Password Only') },
-                { value: 'oauth2', label: t('admin.settings.security.loginMethod.oauth2', 'OAuth2 Only') },
-                { value: 'saml2', label: t('admin.settings.security.loginMethod.saml2', 'SAML2 Only') },
-              ]}
-              comboboxProps={{ zIndex: 1400 }}
-              disabled={!loginEnabled}
-            />
-            {isFieldPending('loginMethod') && (
-              <Group mt="xs">
-                <PendingBadge show={true} />
-              </Group>
+        <div>
+          <Text fw={600} size="lg">
+            {t("admin.settings.security.title", "Security")}
+          </Text>
+          <Text size="sm" c="dimmed">
+            {t(
+              "admin.settings.security.description",
+              "Configure authentication, login behaviour, and security policies.",
             )}
-          </div>
+          </Text>
+        </div>
 
-          <div>
-            <NumberInput
-              name="loginAttemptCount"
-              label={
-                <Group component="span" gap="xs">
-                  <span>{t('admin.settings.security.loginAttemptCount.label', 'Login Attempt Limit')}</span>
-                  <PendingBadge show={isFieldPending('loginAttemptCount')} />
-                </Group>
-              }
-              description={t('admin.settings.security.loginAttemptCount.description', 'Maximum number of failed login attempts before account lockout')}
-              value={settings?.loginAttemptCount || 0}
-              onChange={(value) => setSettings({ ...settings, loginAttemptCount: Number(value) })}
-              min={0}
-              max={100}
-              disabled={!loginEnabled}
-            />
-          </div>
-
-          <div>
-            <NumberInput
-              name="loginResetTimeMinutes"
-              label={
-                <Group component="span" gap="xs">
-                  <span>{t('admin.settings.security.loginResetTimeMinutes.label', 'Login Reset Time (minutes)')}</span>
-                  <PendingBadge show={isFieldPending('loginResetTimeMinutes')} />
-                </Group>
-              }
-              description={t('admin.settings.security.loginResetTimeMinutes.description', 'Time before failed login attempts are reset')}
-              value={settings?.loginResetTimeMinutes || 0}
-              onChange={(value) => setSettings({ ...settings, loginResetTimeMinutes: Number(value) })}
-              min={0}
-              max={1440}
-              disabled={!loginEnabled}
-            />
-          </div>
-
-          <div>
-            <Select
-              name="xFrameOptions"
-              label={
-                <Group component="span" gap="xs">
-                  <span>{t('admin.settings.security.xFrameOptions.label', 'X-Frame-Options')}</span>
-                  <PendingBadge show={isFieldPending('xFrameOptions')} />
-                </Group>
-              }
-              description={t('admin.settings.security.xFrameOptions.description', 'Controls whether the application can be embedded in iframes')}
-              value={settings?.xFrameOptions || 'DENY'}
-              onChange={(value) => setSettings({ ...settings, xFrameOptions: value || 'DENY' })}
-              data={[
-                { value: 'DENY', label: t('admin.settings.security.xFrameOptions.deny', 'Deny (Prevents all framing)') },
-                { value: 'SAMEORIGIN', label: t('admin.settings.security.xFrameOptions.sameorigin', 'Same Origin (Allow framing from same domain)') },
-                { value: 'DISABLED', label: t('admin.settings.security.xFrameOptions.disabled', 'Disabled (No X-Frame-Options header)') },
-              ]}
-              comboboxProps={{ zIndex: 1400 }}
-              disabled={!loginEnabled}
-            />
-          </div>
-        </Stack>
-      </Paper>
-
-      {/* SSO/SAML Notice */}
-      <Alert
-        variant="light"
-        color="blue"
-        title={t('admin.settings.security.ssoNotice.title', 'Looking for SSO/SAML settings?')}
-        icon={<LocalIcon icon="info-rounded" width="1rem" height="1rem" />}
-      >
-        <Text size="sm">
-          {t('admin.settings.security.ssoNotice.message', 'OAuth2 and SAML2 authentication providers have been moved to the Connections menu for easier management.')}
-        </Text>
-      </Alert>
-
-      {/* JWT Settings */}
-      <Paper withBorder p="md" radius="md">
-        <Stack gap="md">
-          <Text fw={600} size="sm" mb="xs">{t('admin.settings.security.jwt.label', 'JWT Configuration')}</Text>
-
-          <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}>
-            <div>
-              <Text fw={500} size="sm">{t('admin.settings.security.jwt.persistence.label', 'Enable Key Persistence')}</Text>
-              <Text size="xs" c="dimmed" mt={4}>
-                {t('admin.settings.security.jwt.persistence.description', 'Store JWT keys persistently (required for multi-instance deployments)')}
-              </Text>
-            </div>
-            <Group gap="xs">
-              <Switch
-                name="jwt_persistence"
-                checked={settings?.jwt?.persistence || false}
-                onChange={(e) => setSettings({ ...settings, jwt: { ...settings?.jwt, persistence: e.target.checked } })}
-                disabled={!loginEnabled}
-              />
-              <PendingBadge show={isFieldPending('jwt.persistence')} />
-            </Group>
-          </div>
-
-          <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}>
-            <div>
-              <Text fw={500} size="sm">{t('admin.settings.security.jwt.enableKeyRotation.label', 'Enable Key Rotation')}</Text>
-              <Text size="xs" c="dimmed" mt={4}>
-                {t('admin.settings.security.jwt.enableKeyRotation.description', 'Automatically rotate JWT signing keys for improved security')}
-              </Text>
-            </div>
-            <Group gap="xs">
-              <Switch
-                name="jwt_enableKeyRotation"
-                checked={settings?.jwt?.enableKeyRotation || false}
-                onChange={(e) => setSettings({ ...settings, jwt: { ...settings?.jwt, enableKeyRotation: e.target.checked } })}
-                disabled={!loginEnabled}
-              />
-              <PendingBadge show={isFieldPending('jwt.enableKeyRotation')} />
-            </Group>
-          </div>
-
-          <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}>
-            <div>
-              <Text fw={500} size="sm">{t('admin.settings.security.jwt.enableKeyCleanup.label', 'Enable Key Cleanup')}</Text>
-              <Text size="xs" c="dimmed" mt={4}>
-                {t('admin.settings.security.jwt.enableKeyCleanup.description', 'Automatically remove old JWT keys after retention period')}
-              </Text>
-            </div>
-            <Group gap="xs">
-              <Switch
-                name="jwt_enableKeyCleanup"
-                checked={settings?.jwt?.enableKeyCleanup || false}
-                onChange={(e) => setSettings({ ...settings, jwt: { ...settings?.jwt, enableKeyCleanup: e.target.checked } })}
-                disabled={!loginEnabled}
-              />
-              <PendingBadge show={isFieldPending('jwt.enableKeyCleanup')} />
-            </Group>
-          </div>
-
-
-          <div>
-            <NumberInput
-              name="jwt_tokenExpiryMinutes"
-              label={
-                <Group component="span" gap="xs">
-                  <span>{t('admin.settings.security.jwt.tokenExpiryMinutes.label', 'Web Token Expiry (minutes)')}</span>
-                  <PendingBadge show={isFieldPending('jwt.tokenExpiryMinutes')} />
-                </Group>
-              }
-              description={t('admin.settings.security.jwt.tokenExpiryMinutes.description', 'Access token lifetime in minutes for web clients (default: 1440 = 24 hours)')}
-              value={settings?.jwt?.tokenExpiryMinutes || 1440}
-              onChange={(value) => setSettings({ ...settings, jwt: { ...settings?.jwt, tokenExpiryMinutes: Number(value) } })}
-              min={1}
-              max={43200}
-              disabled={!loginEnabled}
-            />
-          </div>
-
-          <div>
-            <NumberInput
-              name="jwt_desktopTokenExpiryMinutes"
-              label={
-                <Group component="span" gap="xs">
-                  <span>{t('admin.settings.security.jwt.desktopTokenExpiryMinutes.label', 'Desktop Token Expiry (minutes)')}</span>
-                  <PendingBadge show={isFieldPending('jwt.desktopTokenExpiryMinutes')} />
-                </Group>
-              }
-              description={t('admin.settings.security.jwt.desktopTokenExpiryMinutes.description', 'Access token lifetime in minutes for desktop clients. Desktop apps automatically detected via User-Agent and receive longer sessions for better UX (default: 43200 = 30 days)')}
-              value={settings?.jwt?.desktopTokenExpiryMinutes || 43200}
-              onChange={(value) => setSettings({ ...settings, jwt: { ...settings?.jwt, desktopTokenExpiryMinutes: Number(value) } })}
-              min={1}
-              max={525600}
-              disabled={!loginEnabled}
-            />
-          </div>
-
-          <div>
-            <NumberInput
-              name="jwt_allowedClockSkewSeconds"
-              label={
-                <Group component="span" gap="xs">
-                  <span>{t('admin.settings.security.jwt.allowedClockSkewSeconds.label', 'Clock Skew Tolerance (seconds)')}</span>
-                  <PendingBadge show={isFieldPending('jwt.allowedClockSkewSeconds')} />
-                </Group>
-              }
-              description={t('admin.settings.security.jwt.allowedClockSkewSeconds.description', 'Tolerance for client/server time drift during token validation (default: 60 seconds)')}
-              value={settings?.jwt?.allowedClockSkewSeconds ?? 60}
-              onChange={(value) => setSettings({ ...settings, jwt: { ...settings?.jwt, allowedClockSkewSeconds: Number(value) } })}
-              min={0}
-              max={300}
-              disabled={!loginEnabled}
-            />
-          </div>
-
-          <div>
-            <NumberInput
-              name="jwt_refreshGraceMinutes"
-              label={
-                <Group component="span" gap="xs">
-                  <span>{t('admin.settings.security.jwt.refreshGraceMinutes.label', 'Refresh Grace Period (minutes)')}</span>
-                  <PendingBadge show={isFieldPending('jwt.refreshGraceMinutes')} />
-                </Group>
-              }
-              description={t('admin.settings.security.jwt.refreshGraceMinutes.description', 'Allow token refresh within this many minutes after expiry (default: 15 minutes, max 3 attempts)')}
-              value={settings?.jwt?.refreshGraceMinutes ?? 15}
-              onChange={(value) => setSettings({ ...settings, jwt: { ...settings?.jwt, refreshGraceMinutes: Number(value) } })}
-              min={0}
-              max={120}
-              disabled={!loginEnabled}
-            />
-          </div>
-
-          <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}>
-            <div>
-              <Text fw={500} size="sm">{t('admin.settings.security.jwt.secureCookie.label', 'Secure Cookie')}</Text>
-              <Text size="xs" c="dimmed" mt={4}>
-                {t('admin.settings.security.jwt.secureCookie.description', 'Require HTTPS for JWT cookies (recommended for production)')}
-              </Text>
-            </div>
-            <Group gap="xs">
-              <Switch
-                name="jwt_secureCookie"
-                checked={settings?.jwt?.secureCookie || false}
-                onChange={(e) => setSettings({ ...settings, jwt: { ...settings?.jwt, secureCookie: e.target.checked } })}
-                disabled={!loginEnabled}
-              />
-              <PendingBadge show={isFieldPending('jwt.secureCookie')} />
-            </Group>
-          </div>
-        </Stack>
-      </Paper>
-
-      {/* Audit Logging - Enterprise Feature */}
-      <Paper withBorder p="md" radius="md">
-        <Stack gap="md">
-          <Group justify="space-between" align="center">
-            <Text fw={600} size="sm">{t('admin.settings.security.audit.label', 'Audit Logging')}</Text>
-            <Badge color="grape" size="sm">ENTERPRISE</Badge>
-          </Group>
-
-          <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}>
-            <div>
-              <Text fw={500} size="sm">{t('admin.settings.security.audit.enabled.label', 'Enable Audit Logging')}</Text>
-              <Text size="xs" c="dimmed" mt={4}>
-                {t('admin.settings.security.audit.enabled.description', 'Track user actions and system events for compliance and security monitoring')}
-              </Text>
-            </div>
-            <Group gap="xs">
-              <Switch
-                name="audit_enabled"
-                checked={settings?.audit?.enabled || false}
-                onChange={(e) => setSettings({ ...settings, audit: { ...settings?.audit, enabled: e.target.checked } })}
-                disabled={!loginEnabled}
-              />
-              <PendingBadge show={isFieldPending('audit.enabled')} />
-            </Group>
-          </div>
-
-          <div>
-            <NumberInput
-              name="audit_level"
-              label={
-                <Group component="span" gap="xs">
-                  <span>{t('admin.settings.security.audit.level.label', 'Audit Level')}</span>
-                  <PendingBadge show={isFieldPending('audit.level')} />
-                </Group>
-              }
-              description={t('admin.settings.security.audit.level.description', '0=OFF, 1=BASIC, 2=STANDARD, 3=VERBOSE')}
-              value={settings?.audit?.level || 2}
-              onChange={(value) => setSettings({ ...settings, audit: { ...settings?.audit, level: Number(value) } })}
-              min={0}
-              max={3}
-              disabled={!loginEnabled}
-            />
-          </div>
-
-          <div>
-            <NumberInput
-              name="audit_retentionDays"
-              label={
-                <Group component="span" gap="xs">
-                  <span>{t('admin.settings.security.audit.retentionDays.label', 'Audit Retention (days)')}</span>
-                  <PendingBadge show={isFieldPending('audit.retentionDays')} />
-                </Group>
-              }
-              description={t('admin.settings.security.audit.retentionDays.description', 'Number of days to retain audit logs')}
-              value={settings?.audit?.retentionDays || 90}
-              onChange={(value) => setSettings({ ...settings, audit: { ...settings?.audit, retentionDays: Number(value) } })}
-              min={1}
-              max={3650}
-              disabled={!loginEnabled}
-            />
-          </div>
-
-          <Alert color="yellow" icon={<LocalIcon icon="info" />} title={t('admin.settings.security.audit.advancedOptions.title', 'Advanced Options')}>
-            {t('admin.settings.security.audit.advancedOptions.description', 'The following options increase processing time and memory usage. Enable only if truly needed.')}
-          </Alert>
-
-          <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}>
-            <div>
-              <Text fw={500} size="sm">{t('admin.settings.security.audit.captureFileHash.label', 'Capture File Hash')}</Text>
-              <Text size="xs" c="dimmed" mt={4}>
-                {t('admin.settings.security.audit.captureFileHash.description', 'Store MD5 hash of processed files for audit trail verification')}
-              </Text>
-            </div>
-            <Group gap="xs">
-              <Switch
-                name="audit_captureFileHash"
-                checked={settings?.audit?.captureFileHash || false}
-                onChange={(e) => setSettings({ ...settings, audit: { ...settings?.audit, captureFileHash: e.target.checked } })}
-                disabled={!loginEnabled}
-              />
-              <PendingBadge show={isFieldPending('audit.captureFileHash')} />
-            </Group>
-          </div>
-
-          <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}>
-            <div>
-              <Text fw={500} size="sm">{t('admin.settings.security.audit.capturePdfAuthor.label', 'Capture PDF Author')}</Text>
-              <Text size="xs" c="dimmed" mt={4}>
-                {t('admin.settings.security.audit.capturePdfAuthor.description', 'Extract author field from PDF documents during processing')}
-              </Text>
-            </div>
-            <Group gap="xs">
-              <Switch
-                name="audit_capturePdfAuthor"
-                checked={settings?.audit?.capturePdfAuthor || false}
-                onChange={(e) => setSettings({ ...settings, audit: { ...settings?.audit, capturePdfAuthor: e.target.checked } })}
-                disabled={!loginEnabled}
-              />
-              <PendingBadge show={isFieldPending('audit.capturePdfAuthor')} />
-            </Group>
-          </div>
-
-          <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}>
-            <div>
-              <Text fw={500} size="sm">{t('admin.settings.security.audit.captureOperationResults.label', 'Capture Operation Results')}</Text>
-              <Text size="xs" c="dimmed" mt={4}>
-                {t('admin.settings.security.audit.captureOperationResults.description', 'Store output file information and processing results in audit logs')}
-              </Text>
-            </div>
-            <Group gap="xs">
-              <Switch
-                name="audit_captureOperationResults"
-                checked={settings?.audit?.captureOperationResults || false}
-                onChange={(e) => setSettings({ ...settings, audit: { ...settings?.audit, captureOperationResults: e.target.checked } })}
-                disabled={!loginEnabled}
-              />
-              <PendingBadge show={isFieldPending('audit.captureOperationResults')} />
-            </Group>
-          </div>
-        </Stack>
-      </Paper>
-
-      {/* HTML URL Security */}
-      <Paper withBorder p="md" radius="md">
-        <Stack gap="md">
-          <div>
-            <Text fw={600} size="sm" mb="xs">{t('admin.settings.security.htmlUrlSecurity.label', 'HTML URL Security')}</Text>
-            <Text size="xs" c="dimmed">
-              {t('admin.settings.security.htmlUrlSecurity.description', 'Configure URL access restrictions for HTML processing to prevent SSRF attacks')}
+        {/* Authentication Settings */}
+        <Paper withBorder p="md" radius="md">
+          <Stack gap="md">
+            <Text fw={600} size="sm" mb="xs">
+              {t("admin.settings.security.authentication", "Authentication")}
             </Text>
-          </div>
 
-          <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}>
-            <div>
-              <Text fw={500} size="sm">{t('admin.settings.security.htmlUrlSecurity.enabled.label', 'Enable URL Security')}</Text>
-              <Text size="xs" c="dimmed" mt={4}>
-                {t('admin.settings.security.htmlUrlSecurity.enabled.description', 'Enable URL security restrictions for HTML to PDF conversions')}
-              </Text>
-            </div>
-            <Group gap="xs">
-              <Switch
-                name="html_urlSecurity_enabled"
-                checked={settings?.html?.urlSecurity?.enabled || false}
-                onChange={(e) => setSettings({
-                  ...settings,
-                  html: {
-                    ...settings?.html,
-                    urlSecurity: { ...settings?.html?.urlSecurity, enabled: e.target.checked }
+            <div
+              style={{
+                display: "flex",
+                alignItems: "center",
+                justifyContent: "space-between",
+              }}
+            >
+              <div>
+                <Text fw={500} size="sm">
+                  {t(
+                    "admin.settings.security.enableLogin.label",
+                    "Enable Login",
+                  )}
+                </Text>
+                <Text size="xs" c="dimmed" mt={4}>
+                  {t(
+                    "admin.settings.security.enableLogin.description",
+                    "Require users to log in before accessing the application",
+                  )}
+                </Text>
+              </div>
+              <Group gap="xs">
+                <Switch
+                  name="enableLogin"
+                  checked={settings?.enableLogin || false}
+                  onChange={(e) =>
+                    setSettings({ ...settings, enableLogin: e.target.checked })
                   }
-                })}
+                  disabled={!loginEnabled}
+                />
+                <PendingBadge show={isFieldPending("enableLogin")} />
+              </Group>
+            </div>
+
+            <div>
+              <Select
+                name="loginMethod"
+                label={t(
+                  "admin.settings.security.loginMethod.label",
+                  "Login Method",
+                )}
+                description={t(
+                  "admin.settings.security.loginMethod.description",
+                  "The authentication method to use for user login",
+                )}
+                value={settings?.loginMethod || "all"}
+                onChange={(value) =>
+                  setSettings({ ...settings, loginMethod: value || "all" })
+                }
+                data={[
+                  {
+                    value: "all",
+                    label: t(
+                      "admin.settings.security.loginMethod.all",
+                      "All Methods",
+                    ),
+                  },
+                  {
+                    value: "normal",
+                    label: t(
+                      "admin.settings.security.loginMethod.normal",
+                      "Username/Password Only",
+                    ),
+                  },
+                  {
+                    value: "oauth2",
+                    label: t(
+                      "admin.settings.security.loginMethod.oauth2",
+                      "OAuth2 Only",
+                    ),
+                  },
+                  {
+                    value: "saml2",
+                    label: t(
+                      "admin.settings.security.loginMethod.saml2",
+                      "SAML2 Only",
+                    ),
+                  },
+                ]}
+                comboboxProps={{ zIndex: 1400 }}
                 disabled={!loginEnabled}
               />
-              <PendingBadge show={isFieldPending('html.urlSecurity.enabled')} />
-            </Group>
-          </div>
-
-          <div>
-            <Select
-              name="html_urlSecurity_level"
-              label={
-                <Group component="span" gap="xs">
-                  <span>{t('admin.settings.security.htmlUrlSecurity.level.label', 'Security Level')}</span>
-                  <PendingBadge show={isFieldPending('html.urlSecurity.level')} />
+              {isFieldPending("loginMethod") && (
+                <Group mt="xs">
+                  <PendingBadge show={true} />
                 </Group>
-              }
-              description={t('admin.settings.security.htmlUrlSecurity.level.description', 'MAX: whitelist only, MEDIUM: block internal networks, OFF: no restrictions')}
-              value={settings?.html?.urlSecurity?.level || 'MEDIUM'}
-              onChange={(value) => setSettings({
-                ...settings,
-                html: {
-                  ...settings?.html,
-                  urlSecurity: { ...settings?.html?.urlSecurity, level: value || 'MEDIUM' }
+              )}
+            </div>
+
+            <div>
+              <NumberInput
+                name="loginAttemptCount"
+                label={
+                  <Group component="span" gap="xs">
+                    <span>
+                      {t(
+                        "admin.settings.security.loginAttemptCount.label",
+                        "Login Attempt Limit",
+                      )}
+                    </span>
+                    <PendingBadge show={isFieldPending("loginAttemptCount")} />
+                  </Group>
                 }
-              })}
-              data={[
-                { value: 'MAX', label: t('admin.settings.security.htmlUrlSecurity.level.max', 'Maximum (Whitelist Only)') },
-                { value: 'MEDIUM', label: t('admin.settings.security.htmlUrlSecurity.level.medium', 'Medium (Block Internal)') },
-                { value: 'OFF', label: t('admin.settings.security.htmlUrlSecurity.level.off', 'Off (No Restrictions)') },
-              ]}
-              comboboxProps={{ zIndex: 1400 }}
-              disabled={!loginEnabled}
-            />
-          </div>
+                description={t(
+                  "admin.settings.security.loginAttemptCount.description",
+                  "Maximum number of failed login attempts before account lockout",
+                )}
+                value={settings?.loginAttemptCount || 0}
+                onChange={(value) =>
+                  setSettings({ ...settings, loginAttemptCount: Number(value) })
+                }
+                min={0}
+                max={100}
+                disabled={!loginEnabled}
+              />
+            </div>
 
-          <Accordion variant="separated">
-            <Accordion.Item value="advanced">
-              <Accordion.Control>{t('admin.settings.security.htmlUrlSecurity.advanced', 'Advanced Settings')}</Accordion.Control>
-              <Accordion.Panel>
-                <Stack gap="md">
-                  {/* Allowed Domains */}
-                  <div>
-                    <Textarea
-                      name="html_urlSecurity_allowedDomains"
-                      label={
-                        <Group component="span" gap="xs">
-                          <span>{t('admin.settings.security.htmlUrlSecurity.allowedDomains.label', 'Allowed Domains (Whitelist)')}</span>
-                          <PendingBadge show={isFieldPending('html.urlSecurity.allowedDomains')} />
-                        </Group>
-                      }
-                      description={t('admin.settings.security.htmlUrlSecurity.allowedDomains.description', 'One domain per line (e.g., cdn.example.com). Only these domains allowed when level is MAX')}
-                      value={settings?.html?.urlSecurity?.allowedDomains?.join('\n') || ''}
-                      onChange={(e) => setSettings({
-                        ...settings,
-                        html: {
-                          ...settings?.html,
-                          urlSecurity: {
-                            ...settings?.html?.urlSecurity,
-                            allowedDomains: e.target.value ? e.target.value.split('\n').filter(d => d.trim()) : []
-                          }
-                        }
-                      })}
-                      placeholder="cdn.example.com&#10;images.google.com"
-                      minRows={3}
-                      autosize
-                      disabled={!loginEnabled}
+            <div>
+              <NumberInput
+                name="loginResetTimeMinutes"
+                label={
+                  <Group component="span" gap="xs">
+                    <span>
+                      {t(
+                        "admin.settings.security.loginResetTimeMinutes.label",
+                        "Login Reset Time (minutes)",
+                      )}
+                    </span>
+                    <PendingBadge
+                      show={isFieldPending("loginResetTimeMinutes")}
                     />
-                  </div>
+                  </Group>
+                }
+                description={t(
+                  "admin.settings.security.loginResetTimeMinutes.description",
+                  "Time before failed login attempts are reset",
+                )}
+                value={settings?.loginResetTimeMinutes || 0}
+                onChange={(value) =>
+                  setSettings({
+                    ...settings,
+                    loginResetTimeMinutes: Number(value),
+                  })
+                }
+                min={0}
+                max={1440}
+                disabled={!loginEnabled}
+              />
+            </div>
 
-                  {/* Blocked Domains */}
-                  <div>
-                    <Textarea
-                      name="html_urlSecurity_blockedDomains"
-                      label={
-                        <Group component="span" gap="xs">
-                          <span>{t('admin.settings.security.htmlUrlSecurity.blockedDomains.label', 'Blocked Domains (Blacklist)')}</span>
-                          <PendingBadge show={isFieldPending('html.urlSecurity.blockedDomains')} />
-                        </Group>
-                      }
-                      description={t('admin.settings.security.htmlUrlSecurity.blockedDomains.description', 'One domain per line (e.g., malicious.com). Additional domains to block')}
-                      value={settings?.html?.urlSecurity?.blockedDomains?.join('\n') || ''}
-                      onChange={(e) => setSettings({
-                        ...settings,
-                        html: {
-                          ...settings?.html,
-                          urlSecurity: {
-                            ...settings?.html?.urlSecurity,
-                            blockedDomains: e.target.value ? e.target.value.split('\n').filter(d => d.trim()) : []
-                          }
-                        }
-                      })}
-                      placeholder="malicious.com&#10;evil.org"
-                      minRows={3}
-                      autosize
-                      disabled={!loginEnabled}
+            <div>
+              <Select
+                name="xFrameOptions"
+                label={
+                  <Group component="span" gap="xs">
+                    <span>
+                      {t(
+                        "admin.settings.security.xFrameOptions.label",
+                        "X-Frame-Options",
+                      )}
+                    </span>
+                    <PendingBadge show={isFieldPending("xFrameOptions")} />
+                  </Group>
+                }
+                description={t(
+                  "admin.settings.security.xFrameOptions.description",
+                  "Controls whether the application can be embedded in iframes",
+                )}
+                value={settings?.xFrameOptions || "DENY"}
+                onChange={(value) =>
+                  setSettings({ ...settings, xFrameOptions: value || "DENY" })
+                }
+                data={[
+                  {
+                    value: "DENY",
+                    label: t(
+                      "admin.settings.security.xFrameOptions.deny",
+                      "Deny (Prevents all framing)",
+                    ),
+                  },
+                  {
+                    value: "SAMEORIGIN",
+                    label: t(
+                      "admin.settings.security.xFrameOptions.sameorigin",
+                      "Same Origin (Allow framing from same domain)",
+                    ),
+                  },
+                  {
+                    value: "DISABLED",
+                    label: t(
+                      "admin.settings.security.xFrameOptions.disabled",
+                      "Disabled (No X-Frame-Options header)",
+                    ),
+                  },
+                ]}
+                comboboxProps={{ zIndex: 1400 }}
+                disabled={!loginEnabled}
+              />
+            </div>
+          </Stack>
+        </Paper>
+
+        {/* SSO/SAML Notice */}
+        <Alert
+          variant="light"
+          color="blue"
+          title={t(
+            "admin.settings.security.ssoNotice.title",
+            "Looking for SSO/SAML settings?",
+          )}
+          icon={<LocalIcon icon="info-rounded" width="1rem" height="1rem" />}
+        >
+          <Text size="sm">
+            {t(
+              "admin.settings.security.ssoNotice.message",
+              "OAuth2 and SAML2 authentication providers have been moved to the Connections menu for easier management.",
+            )}
+          </Text>
+        </Alert>
+
+        {/* JWT Settings */}
+        <Paper withBorder p="md" radius="md">
+          <Stack gap="md">
+            <Text fw={600} size="sm" mb="xs">
+              {t("admin.settings.security.jwt.label", "JWT Configuration")}
+            </Text>
+
+            <div
+              style={{
+                display: "flex",
+                alignItems: "center",
+                justifyContent: "space-between",
+              }}
+            >
+              <div>
+                <Text fw={500} size="sm">
+                  {t(
+                    "admin.settings.security.jwt.persistence.label",
+                    "Enable Key Persistence",
+                  )}
+                </Text>
+                <Text size="xs" c="dimmed" mt={4}>
+                  {t(
+                    "admin.settings.security.jwt.persistence.description",
+                    "Store JWT keys persistently (required for multi-instance deployments)",
+                  )}
+                </Text>
+              </div>
+              <Group gap="xs">
+                <Switch
+                  name="jwt_persistence"
+                  checked={settings?.jwt?.persistence || false}
+                  onChange={(e) =>
+                    setSettings({
+                      ...settings,
+                      jwt: { ...settings?.jwt, persistence: e.target.checked },
+                    })
+                  }
+                  disabled={!loginEnabled}
+                />
+                <PendingBadge show={isFieldPending("jwt.persistence")} />
+              </Group>
+            </div>
+
+            <div
+              style={{
+                display: "flex",
+                alignItems: "center",
+                justifyContent: "space-between",
+              }}
+            >
+              <div>
+                <Text fw={500} size="sm">
+                  {t(
+                    "admin.settings.security.jwt.enableKeyRotation.label",
+                    "Enable Key Rotation",
+                  )}
+                </Text>
+                <Text size="xs" c="dimmed" mt={4}>
+                  {t(
+                    "admin.settings.security.jwt.enableKeyRotation.description",
+                    "Automatically rotate JWT signing keys for improved security",
+                  )}
+                </Text>
+              </div>
+              <Group gap="xs">
+                <Switch
+                  name="jwt_enableKeyRotation"
+                  checked={settings?.jwt?.enableKeyRotation || false}
+                  onChange={(e) =>
+                    setSettings({
+                      ...settings,
+                      jwt: {
+                        ...settings?.jwt,
+                        enableKeyRotation: e.target.checked,
+                      },
+                    })
+                  }
+                  disabled={!loginEnabled}
+                />
+                <PendingBadge show={isFieldPending("jwt.enableKeyRotation")} />
+              </Group>
+            </div>
+
+            <div
+              style={{
+                display: "flex",
+                alignItems: "center",
+                justifyContent: "space-between",
+              }}
+            >
+              <div>
+                <Text fw={500} size="sm">
+                  {t(
+                    "admin.settings.security.jwt.enableKeyCleanup.label",
+                    "Enable Key Cleanup",
+                  )}
+                </Text>
+                <Text size="xs" c="dimmed" mt={4}>
+                  {t(
+                    "admin.settings.security.jwt.enableKeyCleanup.description",
+                    "Automatically remove old JWT keys after retention period",
+                  )}
+                </Text>
+              </div>
+              <Group gap="xs">
+                <Switch
+                  name="jwt_enableKeyCleanup"
+                  checked={settings?.jwt?.enableKeyCleanup || false}
+                  onChange={(e) =>
+                    setSettings({
+                      ...settings,
+                      jwt: {
+                        ...settings?.jwt,
+                        enableKeyCleanup: e.target.checked,
+                      },
+                    })
+                  }
+                  disabled={!loginEnabled}
+                />
+                <PendingBadge show={isFieldPending("jwt.enableKeyCleanup")} />
+              </Group>
+            </div>
+
+            <div>
+              <NumberInput
+                name="jwt_tokenExpiryMinutes"
+                label={
+                  <Group component="span" gap="xs">
+                    <span>
+                      {t(
+                        "admin.settings.security.jwt.tokenExpiryMinutes.label",
+                        "Web Token Expiry (minutes)",
+                      )}
+                    </span>
+                    <PendingBadge
+                      show={isFieldPending("jwt.tokenExpiryMinutes")}
                     />
-                  </div>
+                  </Group>
+                }
+                description={t(
+                  "admin.settings.security.jwt.tokenExpiryMinutes.description",
+                  "Access token lifetime in minutes for web clients (default: 1440 = 24 hours)",
+                )}
+                value={settings?.jwt?.tokenExpiryMinutes || 1440}
+                onChange={(value) =>
+                  setSettings({
+                    ...settings,
+                    jwt: {
+                      ...settings?.jwt,
+                      tokenExpiryMinutes: Number(value),
+                    },
+                  })
+                }
+                min={1}
+                max={43200}
+                disabled={!loginEnabled}
+              />
+            </div>
 
-                  {/* Internal TLDs */}
-                  <div>
-                    <Textarea
-                      name="html_urlSecurity_internalTlds"
-                      label={
-                        <Group component="span" gap="xs">
-                          <span>{t('admin.settings.security.htmlUrlSecurity.internalTlds.label', 'Internal TLDs')}</span>
-                          <PendingBadge show={isFieldPending('html.urlSecurity.internalTlds')} />
-                        </Group>
-                      }
-                      description={t('admin.settings.security.htmlUrlSecurity.internalTlds.description', 'One TLD per line (e.g., .local, .internal). Block domains with these TLD patterns')}
-                      value={settings?.html?.urlSecurity?.internalTlds?.join('\n') || ''}
-                      onChange={(e) => setSettings({
-                        ...settings,
-                        html: {
-                          ...settings?.html,
-                          urlSecurity: {
-                            ...settings?.html?.urlSecurity,
-                            internalTlds: e.target.value ? e.target.value.split('\n').filter(d => d.trim()) : []
-                          }
-                        }
-                      })}
-                      placeholder=".local&#10;.internal&#10;.corp&#10;.home"
-                      minRows={3}
-                      autosize
-                      disabled={!loginEnabled}
+            <div>
+              <NumberInput
+                name="jwt_desktopTokenExpiryMinutes"
+                label={
+                  <Group component="span" gap="xs">
+                    <span>
+                      {t(
+                        "admin.settings.security.jwt.desktopTokenExpiryMinutes.label",
+                        "Desktop Token Expiry (minutes)",
+                      )}
+                    </span>
+                    <PendingBadge
+                      show={isFieldPending("jwt.desktopTokenExpiryMinutes")}
                     />
-                  </div>
+                  </Group>
+                }
+                description={t(
+                  "admin.settings.security.jwt.desktopTokenExpiryMinutes.description",
+                  "Access token lifetime in minutes for desktop clients. Desktop apps automatically detected via User-Agent and receive longer sessions for better UX (default: 43200 = 30 days)",
+                )}
+                value={settings?.jwt?.desktopTokenExpiryMinutes || 43200}
+                onChange={(value) =>
+                  setSettings({
+                    ...settings,
+                    jwt: {
+                      ...settings?.jwt,
+                      desktopTokenExpiryMinutes: Number(value),
+                    },
+                  })
+                }
+                min={1}
+                max={525600}
+                disabled={!loginEnabled}
+              />
+            </div>
 
-                  {/* Network Blocking Options */}
-                  <Text fw={600} size="sm" mt="md">{t('admin.settings.security.htmlUrlSecurity.networkBlocking', 'Network Blocking')}</Text>
+            <div>
+              <NumberInput
+                name="jwt_allowedClockSkewSeconds"
+                label={
+                  <Group component="span" gap="xs">
+                    <span>
+                      {t(
+                        "admin.settings.security.jwt.allowedClockSkewSeconds.label",
+                        "Clock Skew Tolerance (seconds)",
+                      )}
+                    </span>
+                    <PendingBadge
+                      show={isFieldPending("jwt.allowedClockSkewSeconds")}
+                    />
+                  </Group>
+                }
+                description={t(
+                  "admin.settings.security.jwt.allowedClockSkewSeconds.description",
+                  "Tolerance for client/server time drift during token validation (default: 60 seconds)",
+                )}
+                value={settings?.jwt?.allowedClockSkewSeconds ?? 60}
+                onChange={(value) =>
+                  setSettings({
+                    ...settings,
+                    jwt: {
+                      ...settings?.jwt,
+                      allowedClockSkewSeconds: Number(value),
+                    },
+                  })
+                }
+                min={0}
+                max={300}
+                disabled={!loginEnabled}
+              />
+            </div>
 
-                  <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}>
+            <div>
+              <NumberInput
+                name="jwt_refreshGraceMinutes"
+                label={
+                  <Group component="span" gap="xs">
+                    <span>
+                      {t(
+                        "admin.settings.security.jwt.refreshGraceMinutes.label",
+                        "Refresh Grace Period (minutes)",
+                      )}
+                    </span>
+                    <PendingBadge
+                      show={isFieldPending("jwt.refreshGraceMinutes")}
+                    />
+                  </Group>
+                }
+                description={t(
+                  "admin.settings.security.jwt.refreshGraceMinutes.description",
+                  "Allow token refresh within this many minutes after expiry (default: 15 minutes, max 3 attempts)",
+                )}
+                value={settings?.jwt?.refreshGraceMinutes ?? 15}
+                onChange={(value) =>
+                  setSettings({
+                    ...settings,
+                    jwt: {
+                      ...settings?.jwt,
+                      refreshGraceMinutes: Number(value),
+                    },
+                  })
+                }
+                min={0}
+                max={120}
+                disabled={!loginEnabled}
+              />
+            </div>
+
+            <div
+              style={{
+                display: "flex",
+                alignItems: "center",
+                justifyContent: "space-between",
+              }}
+            >
+              <div>
+                <Text fw={500} size="sm">
+                  {t(
+                    "admin.settings.security.jwt.secureCookie.label",
+                    "Secure Cookie",
+                  )}
+                </Text>
+                <Text size="xs" c="dimmed" mt={4}>
+                  {t(
+                    "admin.settings.security.jwt.secureCookie.description",
+                    "Require HTTPS for JWT cookies (recommended for production)",
+                  )}
+                </Text>
+              </div>
+              <Group gap="xs">
+                <Switch
+                  name="jwt_secureCookie"
+                  checked={settings?.jwt?.secureCookie || false}
+                  onChange={(e) =>
+                    setSettings({
+                      ...settings,
+                      jwt: { ...settings?.jwt, secureCookie: e.target.checked },
+                    })
+                  }
+                  disabled={!loginEnabled}
+                />
+                <PendingBadge show={isFieldPending("jwt.secureCookie")} />
+              </Group>
+            </div>
+          </Stack>
+        </Paper>
+
+        {/* Audit Logging - Enterprise Feature */}
+        <Paper withBorder p="md" radius="md">
+          <Stack gap="md">
+            <Group justify="space-between" align="center">
+              <Text fw={600} size="sm">
+                {t("admin.settings.security.audit.label", "Audit Logging")}
+              </Text>
+              <Badge color="grape" size="sm">
+                ENTERPRISE
+              </Badge>
+            </Group>
+
+            <div
+              style={{
+                display: "flex",
+                alignItems: "center",
+                justifyContent: "space-between",
+              }}
+            >
+              <div>
+                <Text fw={500} size="sm">
+                  {t(
+                    "admin.settings.security.audit.enabled.label",
+                    "Enable Audit Logging",
+                  )}
+                </Text>
+                <Text size="xs" c="dimmed" mt={4}>
+                  {t(
+                    "admin.settings.security.audit.enabled.description",
+                    "Track user actions and system events for compliance and security monitoring",
+                  )}
+                </Text>
+              </div>
+              <Group gap="xs">
+                <Switch
+                  name="audit_enabled"
+                  checked={settings?.audit?.enabled || false}
+                  onChange={(e) =>
+                    setSettings({
+                      ...settings,
+                      audit: { ...settings?.audit, enabled: e.target.checked },
+                    })
+                  }
+                  disabled={!loginEnabled}
+                />
+                <PendingBadge show={isFieldPending("audit.enabled")} />
+              </Group>
+            </div>
+
+            <div>
+              <NumberInput
+                name="audit_level"
+                label={
+                  <Group component="span" gap="xs">
+                    <span>
+                      {t(
+                        "admin.settings.security.audit.level.label",
+                        "Audit Level",
+                      )}
+                    </span>
+                    <PendingBadge show={isFieldPending("audit.level")} />
+                  </Group>
+                }
+                description={t(
+                  "admin.settings.security.audit.level.description",
+                  "0=OFF, 1=BASIC, 2=STANDARD, 3=VERBOSE",
+                )}
+                value={settings?.audit?.level || 2}
+                onChange={(value) =>
+                  setSettings({
+                    ...settings,
+                    audit: { ...settings?.audit, level: Number(value) },
+                  })
+                }
+                min={0}
+                max={3}
+                disabled={!loginEnabled}
+              />
+            </div>
+
+            <div>
+              <NumberInput
+                name="audit_retentionDays"
+                label={
+                  <Group component="span" gap="xs">
+                    <span>
+                      {t(
+                        "admin.settings.security.audit.retentionDays.label",
+                        "Audit Retention (days)",
+                      )}
+                    </span>
+                    <PendingBadge
+                      show={isFieldPending("audit.retentionDays")}
+                    />
+                  </Group>
+                }
+                description={t(
+                  "admin.settings.security.audit.retentionDays.description",
+                  "Number of days to retain audit logs",
+                )}
+                value={settings?.audit?.retentionDays || 90}
+                onChange={(value) =>
+                  setSettings({
+                    ...settings,
+                    audit: { ...settings?.audit, retentionDays: Number(value) },
+                  })
+                }
+                min={1}
+                max={3650}
+                disabled={!loginEnabled}
+              />
+            </div>
+
+            <Alert
+              color="yellow"
+              icon={<LocalIcon icon="info" />}
+              title={t(
+                "admin.settings.security.audit.advancedOptions.title",
+                "Advanced Options",
+              )}
+            >
+              {t(
+                "admin.settings.security.audit.advancedOptions.description",
+                "The following options increase processing time and memory usage. Enable only if truly needed.",
+              )}
+            </Alert>
+
+            <div
+              style={{
+                display: "flex",
+                alignItems: "center",
+                justifyContent: "space-between",
+              }}
+            >
+              <div>
+                <Text fw={500} size="sm">
+                  {t(
+                    "admin.settings.security.audit.captureFileHash.label",
+                    "Capture File Hash",
+                  )}
+                </Text>
+                <Text size="xs" c="dimmed" mt={4}>
+                  {t(
+                    "admin.settings.security.audit.captureFileHash.description",
+                    "Store MD5 hash of processed files for audit trail verification",
+                  )}
+                </Text>
+              </div>
+              <Group gap="xs">
+                <Switch
+                  name="audit_captureFileHash"
+                  checked={settings?.audit?.captureFileHash || false}
+                  onChange={(e) =>
+                    setSettings({
+                      ...settings,
+                      audit: {
+                        ...settings?.audit,
+                        captureFileHash: e.target.checked,
+                      },
+                    })
+                  }
+                  disabled={!loginEnabled}
+                />
+                <PendingBadge show={isFieldPending("audit.captureFileHash")} />
+              </Group>
+            </div>
+
+            <div
+              style={{
+                display: "flex",
+                alignItems: "center",
+                justifyContent: "space-between",
+              }}
+            >
+              <div>
+                <Text fw={500} size="sm">
+                  {t(
+                    "admin.settings.security.audit.capturePdfAuthor.label",
+                    "Capture PDF Author",
+                  )}
+                </Text>
+                <Text size="xs" c="dimmed" mt={4}>
+                  {t(
+                    "admin.settings.security.audit.capturePdfAuthor.description",
+                    "Extract author field from PDF documents during processing",
+                  )}
+                </Text>
+              </div>
+              <Group gap="xs">
+                <Switch
+                  name="audit_capturePdfAuthor"
+                  checked={settings?.audit?.capturePdfAuthor || false}
+                  onChange={(e) =>
+                    setSettings({
+                      ...settings,
+                      audit: {
+                        ...settings?.audit,
+                        capturePdfAuthor: e.target.checked,
+                      },
+                    })
+                  }
+                  disabled={!loginEnabled}
+                />
+                <PendingBadge show={isFieldPending("audit.capturePdfAuthor")} />
+              </Group>
+            </div>
+
+            <div
+              style={{
+                display: "flex",
+                alignItems: "center",
+                justifyContent: "space-between",
+              }}
+            >
+              <div>
+                <Text fw={500} size="sm">
+                  {t(
+                    "admin.settings.security.audit.captureOperationResults.label",
+                    "Capture Operation Results",
+                  )}
+                </Text>
+                <Text size="xs" c="dimmed" mt={4}>
+                  {t(
+                    "admin.settings.security.audit.captureOperationResults.description",
+                    "Store output file information and processing results in audit logs",
+                  )}
+                </Text>
+              </div>
+              <Group gap="xs">
+                <Switch
+                  name="audit_captureOperationResults"
+                  checked={settings?.audit?.captureOperationResults || false}
+                  onChange={(e) =>
+                    setSettings({
+                      ...settings,
+                      audit: {
+                        ...settings?.audit,
+                        captureOperationResults: e.target.checked,
+                      },
+                    })
+                  }
+                  disabled={!loginEnabled}
+                />
+                <PendingBadge
+                  show={isFieldPending("audit.captureOperationResults")}
+                />
+              </Group>
+            </div>
+          </Stack>
+        </Paper>
+
+        {/* HTML URL Security */}
+        <Paper withBorder p="md" radius="md">
+          <Stack gap="md">
+            <div>
+              <Text fw={600} size="sm" mb="xs">
+                {t(
+                  "admin.settings.security.htmlUrlSecurity.label",
+                  "HTML URL Security",
+                )}
+              </Text>
+              <Text size="xs" c="dimmed">
+                {t(
+                  "admin.settings.security.htmlUrlSecurity.description",
+                  "Configure URL access restrictions for HTML processing to prevent SSRF attacks",
+                )}
+              </Text>
+            </div>
+
+            <div
+              style={{
+                display: "flex",
+                alignItems: "center",
+                justifyContent: "space-between",
+              }}
+            >
+              <div>
+                <Text fw={500} size="sm">
+                  {t(
+                    "admin.settings.security.htmlUrlSecurity.enabled.label",
+                    "Enable URL Security",
+                  )}
+                </Text>
+                <Text size="xs" c="dimmed" mt={4}>
+                  {t(
+                    "admin.settings.security.htmlUrlSecurity.enabled.description",
+                    "Enable URL security restrictions for HTML to PDF conversions",
+                  )}
+                </Text>
+              </div>
+              <Group gap="xs">
+                <Switch
+                  name="html_urlSecurity_enabled"
+                  checked={settings?.html?.urlSecurity?.enabled || false}
+                  onChange={(e) =>
+                    setSettings({
+                      ...settings,
+                      html: {
+                        ...settings?.html,
+                        urlSecurity: {
+                          ...settings?.html?.urlSecurity,
+                          enabled: e.target.checked,
+                        },
+                      },
+                    })
+                  }
+                  disabled={!loginEnabled}
+                />
+                <PendingBadge
+                  show={isFieldPending("html.urlSecurity.enabled")}
+                />
+              </Group>
+            </div>
+
+            <div>
+              <Select
+                name="html_urlSecurity_level"
+                label={
+                  <Group component="span" gap="xs">
+                    <span>
+                      {t(
+                        "admin.settings.security.htmlUrlSecurity.level.label",
+                        "Security Level",
+                      )}
+                    </span>
+                    <PendingBadge
+                      show={isFieldPending("html.urlSecurity.level")}
+                    />
+                  </Group>
+                }
+                description={t(
+                  "admin.settings.security.htmlUrlSecurity.level.description",
+                  "MAX: whitelist only, MEDIUM: block internal networks, OFF: no restrictions",
+                )}
+                value={settings?.html?.urlSecurity?.level || "MEDIUM"}
+                onChange={(value) =>
+                  setSettings({
+                    ...settings,
+                    html: {
+                      ...settings?.html,
+                      urlSecurity: {
+                        ...settings?.html?.urlSecurity,
+                        level: value || "MEDIUM",
+                      },
+                    },
+                  })
+                }
+                data={[
+                  {
+                    value: "MAX",
+                    label: t(
+                      "admin.settings.security.htmlUrlSecurity.level.max",
+                      "Maximum (Whitelist Only)",
+                    ),
+                  },
+                  {
+                    value: "MEDIUM",
+                    label: t(
+                      "admin.settings.security.htmlUrlSecurity.level.medium",
+                      "Medium (Block Internal)",
+                    ),
+                  },
+                  {
+                    value: "OFF",
+                    label: t(
+                      "admin.settings.security.htmlUrlSecurity.level.off",
+                      "Off (No Restrictions)",
+                    ),
+                  },
+                ]}
+                comboboxProps={{ zIndex: 1400 }}
+                disabled={!loginEnabled}
+              />
+            </div>
+
+            <Accordion variant="separated">
+              <Accordion.Item value="advanced">
+                <Accordion.Control>
+                  {t(
+                    "admin.settings.security.htmlUrlSecurity.advanced",
+                    "Advanced Settings",
+                  )}
+                </Accordion.Control>
+                <Accordion.Panel>
+                  <Stack gap="md">
+                    {/* Allowed Domains */}
                     <div>
-                      <Text fw={500} size="sm">{t('admin.settings.security.htmlUrlSecurity.blockPrivateNetworks.label', 'Block Private Networks')}</Text>
-                      <Text size="xs" c="dimmed" mt={4}>
-                        {t('admin.settings.security.htmlUrlSecurity.blockPrivateNetworks.description', 'Block RFC 1918 private networks (10.x.x.x, 192.168.x.x, 172.16-31.x.x)')}
-                      </Text>
-                    </div>
-                    <Group gap="xs">
-                      <Switch
-                        name="html_urlSecurity_blockPrivateNetworks"
-                        checked={settings?.html?.urlSecurity?.blockPrivateNetworks || false}
-                        onChange={(e) => setSettings({
-                          ...settings,
-                          html: {
-                            ...settings?.html,
-                            urlSecurity: { ...settings?.html?.urlSecurity, blockPrivateNetworks: e.target.checked }
-                          }
-                        })}
+                      <Textarea
+                        name="html_urlSecurity_allowedDomains"
+                        label={
+                          <Group component="span" gap="xs">
+                            <span>
+                              {t(
+                                "admin.settings.security.htmlUrlSecurity.allowedDomains.label",
+                                "Allowed Domains (Whitelist)",
+                              )}
+                            </span>
+                            <PendingBadge
+                              show={isFieldPending(
+                                "html.urlSecurity.allowedDomains",
+                              )}
+                            />
+                          </Group>
+                        }
+                        description={t(
+                          "admin.settings.security.htmlUrlSecurity.allowedDomains.description",
+                          "One domain per line (e.g., cdn.example.com). Only these domains allowed when level is MAX",
+                        )}
+                        value={
+                          settings?.html?.urlSecurity?.allowedDomains?.join(
+                            "\n",
+                          ) || ""
+                        }
+                        onChange={(e) =>
+                          setSettings({
+                            ...settings,
+                            html: {
+                              ...settings?.html,
+                              urlSecurity: {
+                                ...settings?.html?.urlSecurity,
+                                allowedDomains: e.target.value
+                                  ? e.target.value
+                                      .split("\n")
+                                      .filter((d) => d.trim())
+                                  : [],
+                              },
+                            },
+                          })
+                        }
+                        placeholder="cdn.example.com&#10;images.google.com"
+                        minRows={3}
+                        autosize
                         disabled={!loginEnabled}
                       />
-                      <PendingBadge show={isFieldPending('html.urlSecurity.blockPrivateNetworks')} />
-                    </Group>
-                  </div>
-
-                  <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}>
-                    <div>
-                      <Text fw={500} size="sm">{t('admin.settings.security.htmlUrlSecurity.blockLocalhost.label', 'Block Localhost')}</Text>
-                      <Text size="xs" c="dimmed" mt={4}>
-                        {t('admin.settings.security.htmlUrlSecurity.blockLocalhost.description', 'Block localhost and loopback addresses (127.x.x.x, ::1)')}
-                      </Text>
                     </div>
-                    <Group gap="xs">
-                      <Switch
-                        name="html_urlSecurity_blockLocalhost"
-                        checked={settings?.html?.urlSecurity?.blockLocalhost || false}
-                        onChange={(e) => setSettings({
-                          ...settings,
-                          html: {
-                            ...settings?.html,
-                            urlSecurity: { ...settings?.html?.urlSecurity, blockLocalhost: e.target.checked }
-                          }
-                        })}
+
+                    {/* Blocked Domains */}
+                    <div>
+                      <Textarea
+                        name="html_urlSecurity_blockedDomains"
+                        label={
+                          <Group component="span" gap="xs">
+                            <span>
+                              {t(
+                                "admin.settings.security.htmlUrlSecurity.blockedDomains.label",
+                                "Blocked Domains (Blacklist)",
+                              )}
+                            </span>
+                            <PendingBadge
+                              show={isFieldPending(
+                                "html.urlSecurity.blockedDomains",
+                              )}
+                            />
+                          </Group>
+                        }
+                        description={t(
+                          "admin.settings.security.htmlUrlSecurity.blockedDomains.description",
+                          "One domain per line (e.g., malicious.com). Additional domains to block",
+                        )}
+                        value={
+                          settings?.html?.urlSecurity?.blockedDomains?.join(
+                            "\n",
+                          ) || ""
+                        }
+                        onChange={(e) =>
+                          setSettings({
+                            ...settings,
+                            html: {
+                              ...settings?.html,
+                              urlSecurity: {
+                                ...settings?.html?.urlSecurity,
+                                blockedDomains: e.target.value
+                                  ? e.target.value
+                                      .split("\n")
+                                      .filter((d) => d.trim())
+                                  : [],
+                              },
+                            },
+                          })
+                        }
+                        placeholder="malicious.com&#10;evil.org"
+                        minRows={3}
+                        autosize
                         disabled={!loginEnabled}
                       />
-                      <PendingBadge show={isFieldPending('html.urlSecurity.blockLocalhost')} />
-                    </Group>
-                  </div>
-
-                  <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}>
-                    <div>
-                      <Text fw={500} size="sm">{t('admin.settings.security.htmlUrlSecurity.blockLinkLocal.label', 'Block Link-Local Addresses')}</Text>
-                      <Text size="xs" c="dimmed" mt={4}>
-                        {t('admin.settings.security.htmlUrlSecurity.blockLinkLocal.description', 'Block link-local addresses (169.254.x.x, fe80::/10)')}
-                      </Text>
                     </div>
-                    <Group gap="xs">
-                      <Switch
-                        name="html_urlSecurity_blockLinkLocal"
-                        checked={settings?.html?.urlSecurity?.blockLinkLocal || false}
-                        onChange={(e) => setSettings({
-                          ...settings,
-                          html: {
-                            ...settings?.html,
-                            urlSecurity: { ...settings?.html?.urlSecurity, blockLinkLocal: e.target.checked }
-                          }
-                        })}
+
+                    {/* Internal TLDs */}
+                    <div>
+                      <Textarea
+                        name="html_urlSecurity_internalTlds"
+                        label={
+                          <Group component="span" gap="xs">
+                            <span>
+                              {t(
+                                "admin.settings.security.htmlUrlSecurity.internalTlds.label",
+                                "Internal TLDs",
+                              )}
+                            </span>
+                            <PendingBadge
+                              show={isFieldPending(
+                                "html.urlSecurity.internalTlds",
+                              )}
+                            />
+                          </Group>
+                        }
+                        description={t(
+                          "admin.settings.security.htmlUrlSecurity.internalTlds.description",
+                          "One TLD per line (e.g., .local, .internal). Block domains with these TLD patterns",
+                        )}
+                        value={
+                          settings?.html?.urlSecurity?.internalTlds?.join(
+                            "\n",
+                          ) || ""
+                        }
+                        onChange={(e) =>
+                          setSettings({
+                            ...settings,
+                            html: {
+                              ...settings?.html,
+                              urlSecurity: {
+                                ...settings?.html?.urlSecurity,
+                                internalTlds: e.target.value
+                                  ? e.target.value
+                                      .split("\n")
+                                      .filter((d) => d.trim())
+                                  : [],
+                              },
+                            },
+                          })
+                        }
+                        placeholder=".local&#10;.internal&#10;.corp&#10;.home"
+                        minRows={3}
+                        autosize
                         disabled={!loginEnabled}
                       />
-                      <PendingBadge show={isFieldPending('html.urlSecurity.blockLinkLocal')} />
-                    </Group>
-                  </div>
-
-                  <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}>
-                    <div>
-                      <Text fw={500} size="sm">{t('admin.settings.security.htmlUrlSecurity.blockCloudMetadata.label', 'Block Cloud Metadata Endpoints')}</Text>
-                      <Text size="xs" c="dimmed" mt={4}>
-                        {t('admin.settings.security.htmlUrlSecurity.blockCloudMetadata.description', 'Block cloud provider metadata endpoints (169.254.169.254)')}
-                      </Text>
                     </div>
-                    <Group gap="xs">
-                      <Switch
-                        name="html_urlSecurity_blockCloudMetadata"
-                        checked={settings?.html?.urlSecurity?.blockCloudMetadata || false}
-                        onChange={(e) => setSettings({
-                          ...settings,
-                          html: {
-                            ...settings?.html,
-                            urlSecurity: { ...settings?.html?.urlSecurity, blockCloudMetadata: e.target.checked }
+
+                    {/* Network Blocking Options */}
+                    <Text fw={600} size="sm" mt="md">
+                      {t(
+                        "admin.settings.security.htmlUrlSecurity.networkBlocking",
+                        "Network Blocking",
+                      )}
+                    </Text>
+
+                    <div
+                      style={{
+                        display: "flex",
+                        alignItems: "center",
+                        justifyContent: "space-between",
+                      }}
+                    >
+                      <div>
+                        <Text fw={500} size="sm">
+                          {t(
+                            "admin.settings.security.htmlUrlSecurity.blockPrivateNetworks.label",
+                            "Block Private Networks",
+                          )}
+                        </Text>
+                        <Text size="xs" c="dimmed" mt={4}>
+                          {t(
+                            "admin.settings.security.htmlUrlSecurity.blockPrivateNetworks.description",
+                            "Block RFC 1918 private networks (10.x.x.x, 192.168.x.x, 172.16-31.x.x)",
+                          )}
+                        </Text>
+                      </div>
+                      <Group gap="xs">
+                        <Switch
+                          name="html_urlSecurity_blockPrivateNetworks"
+                          checked={
+                            settings?.html?.urlSecurity?.blockPrivateNetworks ||
+                            false
                           }
-                        })}
-                        disabled={!loginEnabled}
-                      />
-                      <PendingBadge show={isFieldPending('html.urlSecurity.blockCloudMetadata')} />
-                    </Group>
-                  </div>
-                </Stack>
-              </Accordion.Panel>
-            </Accordion.Item>
-          </Accordion>
-        </Stack>
-      </Paper>
+                          onChange={(e) =>
+                            setSettings({
+                              ...settings,
+                              html: {
+                                ...settings?.html,
+                                urlSecurity: {
+                                  ...settings?.html?.urlSecurity,
+                                  blockPrivateNetworks: e.target.checked,
+                                },
+                              },
+                            })
+                          }
+                          disabled={!loginEnabled}
+                        />
+                        <PendingBadge
+                          show={isFieldPending(
+                            "html.urlSecurity.blockPrivateNetworks",
+                          )}
+                        />
+                      </Group>
+                    </div>
+
+                    <div
+                      style={{
+                        display: "flex",
+                        alignItems: "center",
+                        justifyContent: "space-between",
+                      }}
+                    >
+                      <div>
+                        <Text fw={500} size="sm">
+                          {t(
+                            "admin.settings.security.htmlUrlSecurity.blockLocalhost.label",
+                            "Block Localhost",
+                          )}
+                        </Text>
+                        <Text size="xs" c="dimmed" mt={4}>
+                          {t(
+                            "admin.settings.security.htmlUrlSecurity.blockLocalhost.description",
+                            "Block localhost and loopback addresses (127.x.x.x, ::1)",
+                          )}
+                        </Text>
+                      </div>
+                      <Group gap="xs">
+                        <Switch
+                          name="html_urlSecurity_blockLocalhost"
+                          checked={
+                            settings?.html?.urlSecurity?.blockLocalhost || false
+                          }
+                          onChange={(e) =>
+                            setSettings({
+                              ...settings,
+                              html: {
+                                ...settings?.html,
+                                urlSecurity: {
+                                  ...settings?.html?.urlSecurity,
+                                  blockLocalhost: e.target.checked,
+                                },
+                              },
+                            })
+                          }
+                          disabled={!loginEnabled}
+                        />
+                        <PendingBadge
+                          show={isFieldPending(
+                            "html.urlSecurity.blockLocalhost",
+                          )}
+                        />
+                      </Group>
+                    </div>
+
+                    <div
+                      style={{
+                        display: "flex",
+                        alignItems: "center",
+                        justifyContent: "space-between",
+                      }}
+                    >
+                      <div>
+                        <Text fw={500} size="sm">
+                          {t(
+                            "admin.settings.security.htmlUrlSecurity.blockLinkLocal.label",
+                            "Block Link-Local Addresses",
+                          )}
+                        </Text>
+                        <Text size="xs" c="dimmed" mt={4}>
+                          {t(
+                            "admin.settings.security.htmlUrlSecurity.blockLinkLocal.description",
+                            "Block link-local addresses (169.254.x.x, fe80::/10)",
+                          )}
+                        </Text>
+                      </div>
+                      <Group gap="xs">
+                        <Switch
+                          name="html_urlSecurity_blockLinkLocal"
+                          checked={
+                            settings?.html?.urlSecurity?.blockLinkLocal || false
+                          }
+                          onChange={(e) =>
+                            setSettings({
+                              ...settings,
+                              html: {
+                                ...settings?.html,
+                                urlSecurity: {
+                                  ...settings?.html?.urlSecurity,
+                                  blockLinkLocal: e.target.checked,
+                                },
+                              },
+                            })
+                          }
+                          disabled={!loginEnabled}
+                        />
+                        <PendingBadge
+                          show={isFieldPending(
+                            "html.urlSecurity.blockLinkLocal",
+                          )}
+                        />
+                      </Group>
+                    </div>
+
+                    <div
+                      style={{
+                        display: "flex",
+                        alignItems: "center",
+                        justifyContent: "space-between",
+                      }}
+                    >
+                      <div>
+                        <Text fw={500} size="sm">
+                          {t(
+                            "admin.settings.security.htmlUrlSecurity.blockCloudMetadata.label",
+                            "Block Cloud Metadata Endpoints",
+                          )}
+                        </Text>
+                        <Text size="xs" c="dimmed" mt={4}>
+                          {t(
+                            "admin.settings.security.htmlUrlSecurity.blockCloudMetadata.description",
+                            "Block cloud provider metadata endpoints (169.254.169.254)",
+                          )}
+                        </Text>
+                      </div>
+                      <Group gap="xs">
+                        <Switch
+                          name="html_urlSecurity_blockCloudMetadata"
+                          checked={
+                            settings?.html?.urlSecurity?.blockCloudMetadata ||
+                            false
+                          }
+                          onChange={(e) =>
+                            setSettings({
+                              ...settings,
+                              html: {
+                                ...settings?.html,
+                                urlSecurity: {
+                                  ...settings?.html?.urlSecurity,
+                                  blockCloudMetadata: e.target.checked,
+                                },
+                              },
+                            })
+                          }
+                          disabled={!loginEnabled}
+                        />
+                        <PendingBadge
+                          show={isFieldPending(
+                            "html.urlSecurity.blockCloudMetadata",
+                          )}
+                        />
+                      </Group>
+                    </div>
+                  </Stack>
+                </Accordion.Panel>
+              </Accordion.Item>
+            </Accordion>
+          </Stack>
+        </Paper>
       </Stack>
 
       <SettingsStickyFooter
diff --git a/frontend/src/proprietary/components/shared/config/configSections/AdminStorageSharingSection.tsx b/frontend/src/proprietary/components/shared/config/configSections/AdminStorageSharingSection.tsx
index b7ee40e621..49f5064eb7 100644
--- a/frontend/src/proprietary/components/shared/config/configSections/AdminStorageSharingSection.tsx
+++ b/frontend/src/proprietary/components/shared/config/configSections/AdminStorageSharingSection.tsx
@@ -1,17 +1,26 @@
-import { useCallback, useEffect } from 'react';
-import { useTranslation } from 'react-i18next';
-import { Anchor, Group, Loader, Paper, Stack, Switch, Text } from '@mantine/core';
-import { useNavigate } from 'react-router-dom';
-import { alert } from '@app/components/toast';
-import RestartConfirmationModal from '@app/components/shared/config/RestartConfirmationModal';
-import { useRestartServer } from '@app/components/shared/config/useRestartServer';
-import { useAdminSettings } from '@app/hooks/useAdminSettings';
-import PendingBadge from '@app/components/shared/config/PendingBadge';
-import apiClient from '@app/services/apiClient';
-import { useLoginRequired } from '@app/hooks/useLoginRequired';
-import LoginRequiredBanner from '@app/components/shared/config/LoginRequiredBanner';
-import { SettingsStickyFooter } from '@app/components/shared/config/SettingsStickyFooter';
-import { useSettingsDirty } from '@app/hooks/useSettingsDirty';
+import { useCallback, useEffect } from "react";
+import { useTranslation } from "react-i18next";
+import {
+  Anchor,
+  Badge,
+  Group,
+  Loader,
+  Paper,
+  Stack,
+  Switch,
+  Text,
+} from "@mantine/core";
+import { useNavigate } from "react-router-dom";
+import { alert } from "@app/components/toast";
+import RestartConfirmationModal from "@app/components/shared/config/RestartConfirmationModal";
+import { useRestartServer } from "@app/components/shared/config/useRestartServer";
+import { useAdminSettings } from "@app/hooks/useAdminSettings";
+import PendingBadge from "@app/components/shared/config/PendingBadge";
+import apiClient from "@app/services/apiClient";
+import { useLoginRequired } from "@app/hooks/useLoginRequired";
+import LoginRequiredBanner from "@app/components/shared/config/LoginRequiredBanner";
+import { SettingsStickyFooter } from "@app/components/shared/config/SettingsStickyFooter";
+import { useSettingsDirty } from "@app/hooks/useSettingsDirty";
 
 interface StorageSharingSettingsData {
   enabled?: boolean;
@@ -34,8 +43,14 @@ interface StorageSharingSettingsData {
 export default function AdminStorageSharingSection() {
   const { t } = useTranslation();
   const navigate = useNavigate();
-  const { loginEnabled, validateLoginEnabled, getDisabledStyles } = useLoginRequired();
-  const { restartModalOpened, showRestartModal, closeRestartModal, restartServer } = useRestartServer();
+  const { loginEnabled, validateLoginEnabled, getDisabledStyles } =
+    useLoginRequired();
+  const {
+    restartModalOpened,
+    showRestartModal,
+    closeRestartModal,
+    restartServer,
+  } = useRestartServer();
 
   const {
     settings,
@@ -46,13 +61,15 @@ export default function AdminStorageSharingSection() {
     saveSettings,
     isFieldPending,
   } = useAdminSettings<StorageSharingSettingsData>({
-    sectionName: 'storage',
+    sectionName: "storage",
     fetchTransformer: async () => {
-      const [storageResponse, systemResponse, mailResponse] = await Promise.all([
-        apiClient.get('/api/v1/admin/settings/section/storage'),
-        apiClient.get('/api/v1/admin/settings/section/system'),
-        apiClient.get('/api/v1/admin/settings/section/mail'),
-      ]);
+      const [storageResponse, systemResponse, mailResponse] = await Promise.all(
+        [
+          apiClient.get("/api/v1/admin/settings/section/storage"),
+          apiClient.get("/api/v1/admin/settings/section/system"),
+          apiClient.get("/api/v1/admin/settings/section/mail"),
+        ],
+      );
 
       const storageData = storageResponse.data || {};
       const systemData = systemResponse.data || {};
@@ -60,7 +77,7 @@ export default function AdminStorageSharingSection() {
 
       return {
         ...storageData,
-        system: { frontendUrl: systemData.frontendUrl || '' },
+        system: { frontendUrl: systemData.frontendUrl || "" },
         mail: { enabled: mailData.enabled || false },
       };
     },
@@ -90,7 +107,10 @@ export default function AdminStorageSharingSection() {
   const frontendUrlConfigured = Boolean(settings.system?.frontendUrl?.trim());
   const mailEnabled = Boolean(settings.mail?.enabled);
 
-  const { isDirty, resetToSnapshot, markSaved } = useSettingsDirty(settings, loading);
+  const { isDirty, resetToSnapshot, markSaved } = useSettingsDirty(
+    settings,
+    loading,
+  );
 
   const handleDiscard = useCallback(() => {
     setSettings(resetToSnapshot());
@@ -106,9 +126,9 @@ export default function AdminStorageSharingSection() {
       showRestartModal();
     } catch (_error) {
       alert({
-        alertType: 'error',
-        title: t('admin.error', 'Error'),
-        body: t('admin.settings.saveError', 'Failed to save settings'),
+        alertType: "error",
+        title: t("admin.error", "Error"),
+        body: t("admin.settings.saveError", "Failed to save settings"),
       });
     }
   };
@@ -123,172 +143,273 @@ export default function AdminStorageSharingSection() {
 
   return (
     <div className="settings-section-container">
-    <div className="settings-section-content">
-    <Stack gap="lg">
-      <LoginRequiredBanner show={!loginEnabled} />
-      <div>
-        <Text fw={600} size="lg">{t('admin.settings.storage.title', 'File Storage & Sharing')}</Text>
-        <Text size="sm" c="dimmed">
-          {t('admin.settings.storage.description', 'Control server storage and sharing options.')}
-        </Text>
+      <div className="settings-section-content">
+        <Stack gap="sm">
+          <LoginRequiredBanner show={!loginEnabled} />
+          <div>
+            <Group gap="xs" align="center">
+              <Text fw={600} size="lg">
+                {t("admin.settings.storage.title", "File Storage & Sharing")}
+              </Text>
+              <Badge size="sm" variant="light" color="orange">
+                {t("toolPanel.alpha", "Alpha")}
+              </Badge>
+            </Group>
+            <Text size="sm" c="dimmed">
+              {t(
+                "admin.settings.storage.description",
+                "Control server storage and sharing options.",
+              )}
+            </Text>
+          </div>
+
+          <Paper withBorder p="sm" radius="md">
+            <Group justify="space-between" align="flex-start" wrap="nowrap">
+              <div>
+                <Group gap="xs" align="center">
+                  <Text fw={600} size="sm">
+                    {t(
+                      "admin.settings.storage.enabled.label",
+                      "Enable Server File Storage",
+                    )}
+                  </Text>
+                  {isFieldPending("enabled") && <PendingBadge show={true} />}
+                </Group>
+                <Text size="xs" c="dimmed">
+                  {t(
+                    "admin.settings.storage.enabled.description",
+                    "Allow users to store files on the server.",
+                  )}
+                </Text>
+              </div>
+              <Switch
+                checked={storageEnabled}
+                onChange={(e) =>
+                  setSettings({ ...settings, enabled: e.currentTarget.checked })
+                }
+                disabled={!loginEnabled}
+                styles={getDisabledStyles()}
+                style={{ flexShrink: 0 }}
+              />
+            </Group>
+          </Paper>
+
+          <Paper withBorder p="sm" radius="md">
+            <Group justify="space-between" align="flex-start" wrap="nowrap">
+              <div>
+                <Group gap="xs" align="center">
+                  <Text fw={600} size="sm">
+                    {t(
+                      "admin.settings.storage.sharing.enabled.label",
+                      "Enable Sharing",
+                    )}
+                  </Text>
+                  {isFieldPending("sharing.enabled") && (
+                    <PendingBadge show={true} />
+                  )}
+                </Group>
+                <Text size="xs" c="dimmed">
+                  {t(
+                    "admin.settings.storage.sharing.enabled.description",
+                    "Allow users to share stored files.",
+                  )}
+                </Text>
+              </div>
+              <Switch
+                checked={settings.sharing?.enabled ?? false}
+                onChange={(e) =>
+                  setSettings({
+                    ...settings,
+                    sharing: {
+                      ...settings.sharing,
+                      enabled: e.currentTarget.checked,
+                    },
+                  })
+                }
+                disabled={!loginEnabled || !storageEnabled}
+                styles={getDisabledStyles()}
+                style={{ flexShrink: 0 }}
+              />
+            </Group>
+          </Paper>
+
+          <Paper withBorder p="sm" radius="md">
+            <Group justify="space-between" align="flex-start" wrap="nowrap">
+              <div>
+                <Group gap="xs" align="center">
+                  <Text fw={600} size="sm">
+                    {t(
+                      "admin.settings.storage.sharing.links.label",
+                      "Enable Share Links",
+                    )}
+                  </Text>
+                  {isFieldPending("sharing.linkEnabled") && (
+                    <PendingBadge show={true} />
+                  )}
+                </Group>
+                <Text size="xs" c="dimmed">
+                  {t(
+                    "admin.settings.storage.sharing.links.description",
+                    "Allow sharing via signed-in links.",
+                  )}
+                </Text>
+                {!frontendUrlConfigured && (
+                  <Text size="xs" c="orange">
+                    {t(
+                      "admin.settings.storage.sharing.links.frontendUrlNote",
+                      "Requires a Frontend URL. ",
+                    )}
+                    <Anchor
+                      href="#"
+                      onClick={(e) => {
+                        e.preventDefault();
+                        navigate("/settings/adminGeneral#frontendUrl");
+                      }}
+                      c="orange"
+                      td="underline"
+                    >
+                      {t(
+                        "admin.settings.storage.sharing.links.frontendUrlLink",
+                        "Configure in System Settings",
+                      )}
+                    </Anchor>
+                  </Text>
+                )}
+              </div>
+              <Switch
+                checked={settings.sharing?.linkEnabled ?? false}
+                onChange={(e) =>
+                  setSettings({
+                    ...settings,
+                    sharing: {
+                      ...settings.sharing,
+                      linkEnabled: e.currentTarget.checked,
+                    },
+                  })
+                }
+                disabled={
+                  !loginEnabled || !sharingEnabled || !frontendUrlConfigured
+                }
+                styles={getDisabledStyles()}
+                style={{ flexShrink: 0 }}
+              />
+            </Group>
+          </Paper>
+
+          <Paper withBorder p="sm" radius="md">
+            <Group justify="space-between" align="flex-start" wrap="nowrap">
+              <div>
+                <Group gap="xs" align="center">
+                  <Text fw={600} size="sm">
+                    {t(
+                      "admin.settings.storage.sharing.email.label",
+                      "Enable Email Sharing",
+                    )}
+                  </Text>
+                  {isFieldPending("sharing.emailEnabled") && (
+                    <PendingBadge show={true} />
+                  )}
+                </Group>
+                <Text size="xs" c="dimmed">
+                  {t(
+                    "admin.settings.storage.sharing.email.description",
+                    "Allow sharing with email addresses.",
+                  )}
+                </Text>
+                {!mailEnabled && (
+                  <Text size="xs" c="orange">
+                    {t(
+                      "admin.settings.storage.sharing.email.mailNote",
+                      "Requires mail configuration. ",
+                    )}
+                    <Anchor
+                      href="#"
+                      onClick={(e) => {
+                        e.preventDefault();
+                        navigate("/settings/adminConnections");
+                      }}
+                      c="orange"
+                      td="underline"
+                    >
+                      {t(
+                        "admin.settings.storage.sharing.email.mailLink",
+                        "Configure Mail Settings",
+                      )}
+                    </Anchor>
+                  </Text>
+                )}
+              </div>
+              <Switch
+                checked={settings.sharing?.emailEnabled ?? false}
+                onChange={(e) =>
+                  setSettings({
+                    ...settings,
+                    sharing: {
+                      ...settings.sharing,
+                      emailEnabled: e.currentTarget.checked,
+                    },
+                  })
+                }
+                disabled={!loginEnabled || !sharingEnabled || !mailEnabled}
+                styles={getDisabledStyles()}
+                style={{ flexShrink: 0 }}
+              />
+            </Group>
+          </Paper>
+
+          <Paper withBorder p="sm" radius="md">
+            <Group justify="space-between" align="flex-start" wrap="nowrap">
+              <div>
+                <Group gap="xs" align="center">
+                  <Text fw={600} size="sm">
+                    {t(
+                      "admin.settings.storage.signing.enabled.label",
+                      "Enable Group Signing",
+                    )}
+                  </Text>
+                  {isFieldPending("signing.enabled") && (
+                    <PendingBadge show={true} />
+                  )}
+                </Group>
+                <Text size="xs" c="dimmed">
+                  {t(
+                    "admin.settings.storage.signing.enabled.description",
+                    "Allow users to create multi-participant document signing sessions. Requires server file storage to be enabled.",
+                  )}
+                </Text>
+              </div>
+              <Switch
+                checked={settings.signing?.enabled ?? false}
+                onChange={(e) =>
+                  setSettings({
+                    ...settings,
+                    signing: {
+                      ...settings.signing,
+                      enabled: e.currentTarget.checked,
+                    },
+                  })
+                }
+                disabled={!loginEnabled || !storageEnabled}
+                styles={getDisabledStyles()}
+                style={{ flexShrink: 0 }}
+              />
+            </Group>
+          </Paper>
+
+          <RestartConfirmationModal
+            opened={restartModalOpened}
+            onClose={closeRestartModal}
+            onRestart={restartServer}
+          />
+        </Stack>
       </div>
-
-      <Paper withBorder p="md" radius="md">
-        <Stack gap="md">
-          <Group justify="space-between" align="center">
-            <Text fw={600} size="sm">{t('admin.settings.storage.enabled.label', 'Enable Server File Storage')}</Text>
-            {isFieldPending('enabled') && <PendingBadge show={true} />}
-          </Group>
-          <Text size="xs" c="dimmed">
-            {t('admin.settings.storage.enabled.description', 'Allow users to store files on the server.')}
-          </Text>
-          <Switch
-            checked={storageEnabled}
-            onChange={(e) => setSettings({ ...settings, enabled: e.currentTarget.checked })}
-            disabled={!loginEnabled}
-            styles={getDisabledStyles()}
-          />
-        </Stack>
-      </Paper>
-
-      <Paper withBorder p="md" radius="md">
-        <Stack gap="md">
-          <Group justify="space-between" align="center">
-            <Text fw={600} size="sm">{t('admin.settings.storage.sharing.enabled.label', 'Enable Sharing')}</Text>
-            {isFieldPending('sharing.enabled') && <PendingBadge show={true} />}
-          </Group>
-          <Text size="xs" c="dimmed">
-            {t('admin.settings.storage.sharing.enabled.description', 'Allow users to share stored files.')}
-          </Text>
-          <Switch
-            checked={settings.sharing?.enabled ?? false}
-            onChange={(e) =>
-              setSettings({
-                ...settings,
-                sharing: { ...settings.sharing, enabled: e.currentTarget.checked },
-              })
-            }
-            disabled={!loginEnabled || !storageEnabled}
-            styles={getDisabledStyles()}
-          />
-        </Stack>
-      </Paper>
-
-      <Paper withBorder p="md" radius="md">
-        <Stack gap="md">
-          <Group justify="space-between" align="center">
-            <Text fw={600} size="sm">{t('admin.settings.storage.sharing.links.label', 'Enable Share Links')}</Text>
-            {isFieldPending('sharing.linkEnabled') && <PendingBadge show={true} />}
-          </Group>
-          <Text size="xs" c="dimmed">
-            {t('admin.settings.storage.sharing.links.description', 'Allow sharing via signed-in links.')}
-          </Text>
-          {!frontendUrlConfigured && (
-            <Text size="xs" c="orange">
-              {t('admin.settings.storage.sharing.links.frontendUrlNote', 'Requires a Frontend URL. ')}
-              <Anchor
-                href="#"
-                onClick={(e) => {
-                  e.preventDefault();
-                  navigate('/settings/adminGeneral#frontendUrl');
-                }}
-                c="orange"
-                td="underline"
-              >
-                {t('admin.settings.storage.sharing.links.frontendUrlLink', 'Configure in System Settings')}
-              </Anchor>
-            </Text>
-          )}
-          <Switch
-            checked={settings.sharing?.linkEnabled ?? false}
-            onChange={(e) =>
-              setSettings({
-                ...settings,
-                sharing: { ...settings.sharing, linkEnabled: e.currentTarget.checked },
-              })
-            }
-            disabled={!loginEnabled || !sharingEnabled || !frontendUrlConfigured}
-            styles={getDisabledStyles()}
-          />
-        </Stack>
-      </Paper>
-
-      <Paper withBorder p="md" radius="md">
-        <Stack gap="md">
-          <Group justify="space-between" align="center">
-            <Text fw={600} size="sm">{t('admin.settings.storage.sharing.email.label', 'Enable Email Sharing')}</Text>
-            {isFieldPending('sharing.emailEnabled') && <PendingBadge show={true} />}
-          </Group>
-          <Text size="xs" c="dimmed">
-            {t('admin.settings.storage.sharing.email.description', 'Allow sharing with email addresses.')}
-          </Text>
-          {!mailEnabled && (
-            <Text size="xs" c="orange">
-              {t('admin.settings.storage.sharing.email.mailNote', 'Requires mail configuration. ')}
-              <Anchor
-                href="#"
-                onClick={(e) => {
-                  e.preventDefault();
-                  navigate('/settings/adminConnections');
-                }}
-                c="orange"
-                td="underline"
-              >
-                {t('admin.settings.storage.sharing.email.mailLink', 'Configure Mail Settings')}
-              </Anchor>
-            </Text>
-          )}
-          <Switch
-            checked={settings.sharing?.emailEnabled ?? false}
-            onChange={(e) =>
-              setSettings({
-                ...settings,
-                sharing: { ...settings.sharing, emailEnabled: e.currentTarget.checked },
-              })
-            }
-            disabled={!loginEnabled || !sharingEnabled || !mailEnabled}
-            styles={getDisabledStyles()}
-          />
-        </Stack>
-      </Paper>
-
-      <Paper withBorder p="md" radius="md">
-        <Stack gap="md">
-          <Group justify="space-between" align="center">
-            <Text fw={600} size="sm">{t('admin.settings.storage.signing.enabled.label', 'Enable Group Signing (Alpha)')}</Text>
-            {isFieldPending('signing.enabled') && <PendingBadge show={true} />}
-          </Group>
-          <Text size="xs" c="dimmed">
-            {t('admin.settings.storage.signing.enabled.description', 'Allow users to create multi-participant document signing sessions. Requires server file storage to be enabled.')}
-          </Text>
-          <Switch
-            checked={settings.signing?.enabled ?? false}
-            onChange={(e) =>
-              setSettings({
-                ...settings,
-                signing: { ...settings.signing, enabled: e.currentTarget.checked },
-              })
-            }
-            disabled={!loginEnabled || !storageEnabled}
-            styles={getDisabledStyles()}
-          />
-        </Stack>
-      </Paper>
-
-      <RestartConfirmationModal
-        opened={restartModalOpened}
-        onClose={closeRestartModal}
-        onRestart={restartServer}
+      <SettingsStickyFooter
+        isDirty={isDirty}
+        saving={saving}
+        loginEnabled={loginEnabled}
+        onSave={handleSave}
+        onDiscard={handleDiscard}
       />
-    </Stack>
-    </div>
-    <SettingsStickyFooter
-      isDirty={isDirty}
-      saving={saving}
-      loginEnabled={loginEnabled}
-      onSave={handleSave}
-      onDiscard={handleDiscard}
-    />
     </div>
   );
 }
diff --git a/frontend/src/proprietary/components/shared/config/configSections/AdminUsageSection.tsx b/frontend/src/proprietary/components/shared/config/configSections/AdminUsageSection.tsx
index fe551c8bc8..e077fe36fd 100644
--- a/frontend/src/proprietary/components/shared/config/configSections/AdminUsageSection.tsx
+++ b/frontend/src/proprietary/components/shared/config/configSections/AdminUsageSection.tsx
@@ -1,59 +1,148 @@
-import React, { useState, useEffect, useCallback } from 'react';
-import { Stack, Group, Text, Button, SegmentedControl, Loader, Alert, Card } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { useNavigate } from 'react-router-dom';
-import usageAnalyticsService, { EndpointStatisticsResponse } from '@app/services/usageAnalyticsService';
-import UsageAnalyticsChart from '@app/components/shared/config/configSections/usage/UsageAnalyticsChart';
-import UsageAnalyticsTable from '@app/components/shared/config/configSections/usage/UsageAnalyticsTable';
-import LocalIcon from '@app/components/shared/LocalIcon';
-import { useLoginRequired } from '@app/hooks/useLoginRequired';
-import LoginRequiredBanner from '@app/components/shared/config/LoginRequiredBanner';
-import { useAppConfig } from '@app/contexts/AppConfigContext';
-import EnterpriseRequiredBanner from '@app/components/shared/config/EnterpriseRequiredBanner';
+import React, { useState, useEffect, useCallback } from "react";
+import {
+  Stack,
+  Group,
+  Text,
+  Button,
+  SegmentedControl,
+  Loader,
+  Alert,
+  Card,
+} from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import { useNavigate } from "react-router-dom";
+import usageAnalyticsService, {
+  EndpointStatisticsResponse,
+} from "@app/services/usageAnalyticsService";
+import UsageAnalyticsChart from "@app/components/shared/config/configSections/usage/UsageAnalyticsChart";
+import UsageAnalyticsTable from "@app/components/shared/config/configSections/usage/UsageAnalyticsTable";
+import LocalIcon from "@app/components/shared/LocalIcon";
+import { useLoginRequired } from "@app/hooks/useLoginRequired";
+import LoginRequiredBanner from "@app/components/shared/config/LoginRequiredBanner";
+import { useAppConfig } from "@app/contexts/AppConfigContext";
+import EnterpriseRequiredBanner from "@app/components/shared/config/EnterpriseRequiredBanner";
 
 const AdminUsageSection: React.FC = () => {
   const { t } = useTranslation();
   const navigate = useNavigate();
   const { loginEnabled } = useLoginRequired();
   const { config } = useAppConfig();
-  const licenseType = config?.license ?? 'NORMAL';
-  const hasEnterpriseLicense = licenseType === 'ENTERPRISE';
+  const licenseType = config?.license ?? "NORMAL";
+  const hasEnterpriseLicense = licenseType === "ENTERPRISE";
   const showDemoData = !loginEnabled || !hasEnterpriseLicense;
   const [data, setData] = useState<EndpointStatisticsResponse | null>(null);
   const [loading, setLoading] = useState(true);
   const [error, setError] = useState<string | null>(null);
-  const [displayMode, setDisplayMode] = useState<'top10' | 'top20' | 'all'>('top10');
-  const [dataType, setDataType] = useState<'all' | 'api' | 'ui'>('api');
+  const [displayMode, setDisplayMode] = useState<"top10" | "top20" | "all">(
+    "top10",
+  );
+  const [dataType, setDataType] = useState<"all" | "api" | "ui">("api");
 
   const buildDemoUsageData = useCallback((): EndpointStatisticsResponse => {
     const totalVisits = 15847;
     const allEndpoints = [
-      { endpoint: 'merge-pdfs', visits: 3245, percentage: (3245 / totalVisits) * 100 },
-      { endpoint: 'compress-pdf', visits: 2891, percentage: (2891 / totalVisits) * 100 },
-      { endpoint: 'pdf-to-img', visits: 2156, percentage: (2156 / totalVisits) * 100 },
-      { endpoint: 'split-pdf', visits: 1834, percentage: (1834 / totalVisits) * 100 },
-      { endpoint: 'rotate-pdf', visits: 1523, percentage: (1523 / totalVisits) * 100 },
-      { endpoint: 'ocr-pdf', visits: 1287, percentage: (1287 / totalVisits) * 100 },
-      { endpoint: 'add-watermark', visits: 945, percentage: (945 / totalVisits) * 100 },
-      { endpoint: 'extract-images', visits: 782, percentage: (782 / totalVisits) * 100 },
-      { endpoint: 'add-password', visits: 621, percentage: (621 / totalVisits) * 100 },
-      { endpoint: 'html-to-pdf', visits: 563, percentage: (563 / totalVisits) * 100 },
-      { endpoint: 'remove-password', visits: 487, percentage: (487 / totalVisits) * 100 },
-      { endpoint: 'pdf-to-pdfa', visits: 423, percentage: (423 / totalVisits) * 100 },
-      { endpoint: 'extract-pdf-metadata', visits: 356, percentage: (356 / totalVisits) * 100 },
-      { endpoint: 'add-page-numbers', visits: 298, percentage: (298 / totalVisits) * 100 },
-      { endpoint: 'crop', visits: 245, percentage: (245 / totalVisits) * 100 },
-      { endpoint: 'flatten', visits: 187, percentage: (187 / totalVisits) * 100 },
-      { endpoint: 'sanitize-pdf', visits: 134, percentage: (134 / totalVisits) * 100 },
-      { endpoint: 'auto-split-pdf', visits: 98, percentage: (98 / totalVisits) * 100 },
-      { endpoint: 'scale-pages', visits: 76, percentage: (76 / totalVisits) * 100 },
-      { endpoint: 'compare-pdfs', visits: 42, percentage: (42 / totalVisits) * 100 },
+      {
+        endpoint: "merge-pdfs",
+        visits: 3245,
+        percentage: (3245 / totalVisits) * 100,
+      },
+      {
+        endpoint: "compress-pdf",
+        visits: 2891,
+        percentage: (2891 / totalVisits) * 100,
+      },
+      {
+        endpoint: "pdf-to-img",
+        visits: 2156,
+        percentage: (2156 / totalVisits) * 100,
+      },
+      {
+        endpoint: "split-pdf",
+        visits: 1834,
+        percentage: (1834 / totalVisits) * 100,
+      },
+      {
+        endpoint: "rotate-pdf",
+        visits: 1523,
+        percentage: (1523 / totalVisits) * 100,
+      },
+      {
+        endpoint: "ocr-pdf",
+        visits: 1287,
+        percentage: (1287 / totalVisits) * 100,
+      },
+      {
+        endpoint: "add-watermark",
+        visits: 945,
+        percentage: (945 / totalVisits) * 100,
+      },
+      {
+        endpoint: "extract-images",
+        visits: 782,
+        percentage: (782 / totalVisits) * 100,
+      },
+      {
+        endpoint: "add-password",
+        visits: 621,
+        percentage: (621 / totalVisits) * 100,
+      },
+      {
+        endpoint: "html-to-pdf",
+        visits: 563,
+        percentage: (563 / totalVisits) * 100,
+      },
+      {
+        endpoint: "remove-password",
+        visits: 487,
+        percentage: (487 / totalVisits) * 100,
+      },
+      {
+        endpoint: "pdf-to-pdfa",
+        visits: 423,
+        percentage: (423 / totalVisits) * 100,
+      },
+      {
+        endpoint: "extract-pdf-metadata",
+        visits: 356,
+        percentage: (356 / totalVisits) * 100,
+      },
+      {
+        endpoint: "add-page-numbers",
+        visits: 298,
+        percentage: (298 / totalVisits) * 100,
+      },
+      { endpoint: "crop", visits: 245, percentage: (245 / totalVisits) * 100 },
+      {
+        endpoint: "flatten",
+        visits: 187,
+        percentage: (187 / totalVisits) * 100,
+      },
+      {
+        endpoint: "sanitize-pdf",
+        visits: 134,
+        percentage: (134 / totalVisits) * 100,
+      },
+      {
+        endpoint: "auto-split-pdf",
+        visits: 98,
+        percentage: (98 / totalVisits) * 100,
+      },
+      {
+        endpoint: "scale-pages",
+        visits: 76,
+        percentage: (76 / totalVisits) * 100,
+      },
+      {
+        endpoint: "compare-pdfs",
+        visits: 42,
+        percentage: (42 / totalVisits) * 100,
+      },
     ];
 
     let filteredEndpoints = allEndpoints;
-    if (displayMode === 'top10') {
+    if (displayMode === "top10") {
       filteredEndpoints = allEndpoints.slice(0, 10);
-    } else if (displayMode === 'top20') {
+    } else if (displayMode === "top20") {
       filteredEndpoints = allEndpoints.slice(0, 20);
     }
 
@@ -69,12 +158,18 @@ const AdminUsageSection: React.FC = () => {
       setLoading(true);
       setError(null);
 
-      const limit = displayMode === 'all' ? undefined : displayMode === 'top10' ? 10 : 20;
-      const response = await usageAnalyticsService.getEndpointStatistics(limit, dataType);
+      const limit =
+        displayMode === "all" ? undefined : displayMode === "top10" ? 10 : 20;
+      const response = await usageAnalyticsService.getEndpointStatistics(
+        limit,
+        dataType,
+      );
 
       setData(response);
     } catch (err) {
-      setError(err instanceof Error ? err.message : 'Failed to load usage statistics');
+      setError(
+        err instanceof Error ? err.message : "Failed to load usage statistics",
+      );
     } finally {
       setLoading(false);
     }
@@ -103,14 +198,14 @@ const AdminUsageSection: React.FC = () => {
 
   const getDisplayModeLabel = () => {
     switch (displayMode) {
-      case 'top10':
-        return t('usage.showing.top10', 'Top 10');
-      case 'top20':
-        return t('usage.showing.top20', 'Top 20');
-      case 'all':
-        return t('usage.showing.all', 'All');
+      case "top10":
+        return t("usage.showing.top10", "Top 10");
+      case "top20":
+        return t("usage.showing.top20", "Top 20");
+      case "all":
+        return t("usage.showing.all", "All");
       default:
-        return '';
+        return "";
     }
   };
 
@@ -120,7 +215,9 @@ const AdminUsageSection: React.FC = () => {
   // Early returns for loading/error states
   if (actualLoading) {
     return (
-      <div style={{ display: 'flex', justifyContent: 'center', padding: '2rem' }}>
+      <div
+        style={{ display: "flex", justifyContent: "center", padding: "2rem" }}
+      >
         <Loader size="lg" />
       </div>
     );
@@ -128,7 +225,10 @@ const AdminUsageSection: React.FC = () => {
 
   if (error) {
     return (
-      <Alert color="red" title={t('usage.error', 'Error loading usage statistics')}>
+      <Alert
+        color="red"
+        title={t("usage.error", "Error loading usage statistics")}
+      >
         {error}
       </Alert>
     );
@@ -136,16 +236,22 @@ const AdminUsageSection: React.FC = () => {
 
   if (!data) {
     return (
-      <Alert color="yellow" title={t('usage.noData', 'No data available')}>
-        {t('usage.noDataMessage', 'No usage statistics are currently available.')}
+      <Alert color="yellow" title={t("usage.noData", "No data available")}>
+        {t(
+          "usage.noDataMessage",
+          "No usage statistics are currently available.",
+        )}
       </Alert>
     );
   }
 
   const endpoints = (data?.endpoints ?? []).map((endpoint) => ({
-    endpoint: endpoint.endpoint ?? t('usage.table.unknownEndpoint', 'Unknown endpoint'),
+    endpoint:
+      endpoint.endpoint ?? t("usage.table.unknownEndpoint", "Unknown endpoint"),
     visits: Number.isFinite(endpoint.visits) ? Math.max(0, endpoint.visits) : 0,
-    percentage: Number.isFinite(endpoint.percentage) ? Math.max(0, endpoint.percentage) : 0,
+    percentage: Number.isFinite(endpoint.percentage)
+      ? Math.max(0, endpoint.percentage)
+      : 0,
   }));
 
   const chartData = endpoints.map((e) => ({
@@ -155,55 +261,71 @@ const AdminUsageSection: React.FC = () => {
 
   const displayedVisits = endpoints.reduce((sum, e) => sum + e.visits, 0);
   const totalVisits = Number.isFinite(data?.totalVisits)
-    ? Math.max(0, data?.totalVisits as number)
+    ? Math.max(0, data?.totalVisits ?? 0)
     : displayedVisits;
   const totalEndpoints = Number.isFinite(data?.totalEndpoints)
-    ? Math.max(0, data?.totalEndpoints as number)
+    ? Math.max(0, data?.totalEndpoints ?? 0)
     : endpoints.length;
 
-  const displayedPercentage = totalVisits > 0
-    ? ((displayedVisits / (totalVisits || 1)) * 100).toFixed(1)
-    : '0';
+  const displayedPercentage =
+    totalVisits > 0
+      ? ((displayedVisits / (totalVisits || 1)) * 100).toFixed(1)
+      : "0";
 
   return (
     <Stack gap="lg">
       <LoginRequiredBanner show={!loginEnabled} />
       <EnterpriseRequiredBanner
         show={!hasEnterpriseLicense}
-        featureName={t('settings.licensingAnalytics.usageAnalytics', 'Usage Analytics')}
+        featureName={t(
+          "settings.licensingAnalytics.usageAnalytics",
+          "Usage Analytics",
+        )}
       />
 
       {/* Info banner about usage analytics and audit relationship */}
       {loginEnabled && hasEnterpriseLicense && (
         <Alert
           icon={<LocalIcon icon="info" width="1.2rem" height="1.2rem" />}
-          title={t('usage.aboutUsageAnalytics', 'About Usage Analytics')}
+          title={t("usage.aboutUsageAnalytics", "About Usage Analytics")}
           color="cyan"
           variant="light"
         >
           <Stack gap="xs">
             <Text size="sm">
               {t(
-                'usage.usageAnalyticsExplanation',
-                'Usage analytics track endpoint requests and tool usage patterns. Combined with the Audit Logging dashboard, you get complete visibility into system activity, performance, and security events.'
+                "usage.usageAnalyticsExplanation",
+                "Usage analytics track endpoint requests and tool usage patterns. Combined with the Audit Logging dashboard, you get complete visibility into system activity, performance, and security events.",
               )}
             </Text>
             <Group gap="sm">
               <Button
                 variant="light"
                 size="xs"
-                onClick={() => navigate('/settings/adminSecurity')}
-                rightSection={<LocalIcon icon="arrow-forward" width="0.9rem" height="0.9rem" />}
+                onClick={() => navigate("/settings/adminSecurity")}
+                rightSection={
+                  <LocalIcon
+                    icon="arrow-forward"
+                    width="0.9rem"
+                    height="0.9rem"
+                  />
+                }
               >
-                {t('usage.configureSettings', 'Configure Analytics Settings')}
+                {t("usage.configureSettings", "Configure Analytics Settings")}
               </Button>
               <Button
                 variant="light"
                 size="xs"
-                onClick={() => navigate('/settings/adminSecurity#auditLogging')}
-                rightSection={<LocalIcon icon="arrow-forward" width="0.9rem" height="0.9rem" />}
+                onClick={() => navigate("/settings/adminSecurity#auditLogging")}
+                rightSection={
+                  <LocalIcon
+                    icon="arrow-forward"
+                    width="0.9rem"
+                    height="0.9rem"
+                  />
+                }
               >
-                {t('usage.viewAuditLogs', 'View Audit Logs')}
+                {t("usage.viewAuditLogs", "View Audit Logs")}
               </Button>
             </Group>
           </Stack>
@@ -217,65 +339,69 @@ const AdminUsageSection: React.FC = () => {
             <Group>
               <SegmentedControl
                 value={displayMode}
-                onChange={(value) => setDisplayMode(value as 'top10' | 'top20' | 'all')}
+                onChange={(value) =>
+                  setDisplayMode(value as "top10" | "top20" | "all")
+                }
                 disabled={showDemoData}
                 data={[
                   {
-                    value: 'top10',
-                    label: t('usage.controls.top10', 'Top 10'),
+                    value: "top10",
+                    label: t("usage.controls.top10", "Top 10"),
                   },
                   {
-                    value: 'top20',
-                    label: t('usage.controls.top20', 'Top 20'),
+                    value: "top20",
+                    label: t("usage.controls.top20", "Top 20"),
                   },
                   {
-                    value: 'all',
-                    label: t('usage.controls.all', 'All'),
+                    value: "all",
+                    label: t("usage.controls.all", "All"),
                   },
                 ]}
               />
               <Button
                 variant="outline"
-                leftSection={<LocalIcon icon="refresh" width="1rem" height="1rem" />}
+                leftSection={
+                  <LocalIcon icon="refresh" width="1rem" height="1rem" />
+                }
                 onClick={handleRefresh}
                 loading={loading}
                 disabled={showDemoData}
               >
-                {t('usage.controls.refresh', 'Refresh')}
+                {t("usage.controls.refresh", "Refresh")}
               </Button>
             </Group>
           </Group>
 
           <Group>
             <Text size="sm" fw={500}>
-              {t('usage.controls.dataTypeLabel', 'Data Type:')}
+              {t("usage.controls.dataTypeLabel", "Data Type:")}
             </Text>
             <SegmentedControl
               value={dataType}
-              onChange={(value) => setDataType(value as 'all' | 'api' | 'ui')}
+              onChange={(value) => setDataType(value as "all" | "api" | "ui")}
               disabled={showDemoData}
               data={[
                 {
-                  value: 'all',
-                  label: t('usage.controls.dataType.all', 'All'),
+                  value: "all",
+                  label: t("usage.controls.dataType.all", "All"),
                 },
                 {
-                  value: 'api',
-                  label: t('usage.controls.dataType.api', 'API'),
+                  value: "api",
+                  label: t("usage.controls.dataType.api", "API"),
                 },
                 {
-                  value: 'ui',
-                  label: t('usage.controls.dataType.ui', 'UI'),
+                  value: "ui",
+                  label: t("usage.controls.dataType.ui", "UI"),
                 },
               ]}
             />
           </Group>
 
           {/* Statistics Summary */}
-          <Group gap="xl" style={{ flexWrap: 'wrap' }}>
+          <Group gap="xl" style={{ flexWrap: "wrap" }}>
             <div>
               <Text size="sm" c="dimmed">
-                {t('usage.stats.totalEndpoints', 'Total Endpoints')}
+                {t("usage.stats.totalEndpoints", "Total Endpoints")}
               </Text>
               <Text size="lg" fw={600}>
                 {totalEndpoints}
@@ -283,7 +409,7 @@ const AdminUsageSection: React.FC = () => {
             </div>
             <div>
               <Text size="sm" c="dimmed">
-                {t('usage.stats.totalVisits', 'Total Visits')}
+                {t("usage.stats.totalVisits", "Total Visits")}
               </Text>
               <Text size="lg" fw={600}>
                 {totalVisits.toLocaleString()}
@@ -291,7 +417,7 @@ const AdminUsageSection: React.FC = () => {
             </div>
             <div>
               <Text size="sm" c="dimmed">
-                {t('usage.stats.showing', 'Showing')}
+                {t("usage.stats.showing", "Showing")}
               </Text>
               <Text size="lg" fw={600}>
                 {getDisplayModeLabel()}
@@ -299,7 +425,7 @@ const AdminUsageSection: React.FC = () => {
             </div>
             <div>
               <Text size="sm" c="dimmed">
-                {t('usage.stats.selectedVisits', 'Selected Visits')}
+                {t("usage.stats.selectedVisits", "Selected Visits")}
               </Text>
               <Text size="lg" fw={600}>
                 {displayedVisits.toLocaleString()} ({displayedPercentage}%)
diff --git a/frontend/src/proprietary/components/shared/config/configSections/ApiKeys.tsx b/frontend/src/proprietary/components/shared/config/configSections/ApiKeys.tsx
index e1b1a53530..038cb9a69e 100644
--- a/frontend/src/proprietary/components/shared/config/configSections/ApiKeys.tsx
+++ b/frontend/src/proprietary/components/shared/config/configSections/ApiKeys.tsx
@@ -14,7 +14,14 @@ export default function ApiKeys() {
   const [showRefreshModal, setShowRefreshModal] = useState(false);
   const { t } = useTranslation();
 
-  const { apiKey, isLoading: apiKeyLoading, refresh, isRefreshing, error: apiKeyError, refetch } = useApiKey();
+  const {
+    apiKey,
+    isLoading: apiKeyLoading,
+    refresh,
+    isRefreshing,
+    error: apiKeyError,
+    refetch,
+  } = useApiKey();
 
   const copy = async (text: string, tag: string) => {
     try {
@@ -25,14 +32,14 @@ export default function ApiKeys() {
         setTimeout(() => setCopied(null), 1600);
       } else {
         // Fallback for HTTP: use old execCommand method
-        const textarea = document.createElement('textarea');
+        const textarea = document.createElement("textarea");
         textarea.value = text;
-        textarea.style.position = 'fixed';
-        textarea.style.opacity = '0';
+        textarea.style.position = "fixed";
+        textarea.style.opacity = "0";
         document.body.appendChild(textarea);
         textarea.select();
 
-        if (document.execCommand('copy')) {
+        if (document.execCommand("copy")) {
           setCopied(tag);
           setTimeout(() => setCopied(null), 1600);
         }
@@ -40,7 +47,7 @@ export default function ApiKeys() {
         document.body.removeChild(textarea);
       }
     } catch (e) {
-      console.error('Failed to copy:', e);
+      console.error("Failed to copy:", e);
     }
   };
 
@@ -55,7 +62,10 @@ export default function ApiKeys() {
   return (
     <Stack gap={20} p={0}>
       <Text size="sm" c="dimmed">
-        {t('config.apiKeys.intro', 'Use your API key to programmatically access Stirling PDF\'s processing capabilities.')}
+        {t(
+          "config.apiKeys.intro",
+          "Use your API key to programmatically access Stirling PDF's processing capabilities.",
+        )}
       </Text>
 
       <Paper
@@ -63,17 +73,25 @@ export default function ApiKeys() {
         radius="md"
         style={{
           background: "var(--bg-muted)",
-          border: "1px solid var(--border-subtle)"
+          border: "1px solid var(--border-subtle)",
         }}
       >
         <Group gap="xs" wrap="nowrap" align="flex-start">
-          <LocalIcon icon="info-rounded" width={18} height={18} style={{ marginTop: 2, flexShrink: 0, opacity: 0.7 }} />
+          <LocalIcon
+            icon="info-rounded"
+            width={18}
+            height={18}
+            style={{ marginTop: 2, flexShrink: 0, opacity: 0.7 }}
+          />
           <Stack gap={8} style={{ flex: 1 }}>
             <Text size="sm" fw={500}>
-              {t('config.apiKeys.docsTitle', 'API Documentation')}
+              {t("config.apiKeys.docsTitle", "API Documentation")}
             </Text>
             <Text size="sm" c="dimmed">
-              {t('config.apiKeys.docsDescription', 'Learn more about integrating with Stirling PDF:')}
+              {t(
+                "config.apiKeys.docsDescription",
+                "Learn more about integrating with Stirling PDF:",
+              )}
             </Text>
             <Stack gap={4}>
               <Text size="sm">
@@ -81,10 +99,18 @@ export default function ApiKeys() {
                   href="https://docs.stirlingpdf.com/API"
                   target="_blank"
                   rel="noopener noreferrer"
-                  style={{ display: 'inline-flex', alignItems: 'center', gap: 4 }}
+                  style={{
+                    display: "inline-flex",
+                    alignItems: "center",
+                    gap: 4,
+                  }}
                 >
-                  {t('config.apiKeys.docsLink', 'API Documentation')}
-                  <LocalIcon icon="open-in-new-rounded" width={14} height={14} />
+                  {t("config.apiKeys.docsLink", "API Documentation")}
+                  <LocalIcon
+                    icon="open-in-new-rounded"
+                    width={14}
+                    height={14}
+                  />
                 </Anchor>
               </Text>
               <Text size="sm">
@@ -92,10 +118,18 @@ export default function ApiKeys() {
                   href="https://registry.scalar.com/@stirlingpdf/apis/stirling-pdf-processing-api/"
                   target="_blank"
                   rel="noopener noreferrer"
-                  style={{ display: 'inline-flex', alignItems: 'center', gap: 4 }}
+                  style={{
+                    display: "inline-flex",
+                    alignItems: "center",
+                    gap: 4,
+                  }}
                 >
-                  {t('config.apiKeys.schemaLink', 'API Schema Reference')}
-                  <LocalIcon icon="open-in-new-rounded" width={14} height={14} />
+                  {t("config.apiKeys.schemaLink", "API Schema Reference")}
+                  <LocalIcon
+                    icon="open-in-new-rounded"
+                    width={14}
+                    height={14}
+                  />
                 </Anchor>
               </Text>
             </Stack>
@@ -105,15 +139,31 @@ export default function ApiKeys() {
 
       {apiKeyError && (
         <Text size="sm" c="red.5">
-          {t('config.apiKeys.generateError', "We couldn't generate your API key.")} {" "}
-          <Anchor component="button" underline="always" onClick={refetch} c="red.4">
-            {t('common.retry', 'Retry')}
+          {t(
+            "config.apiKeys.generateError",
+            "We couldn't generate your API key.",
+          )}{" "}
+          <Anchor
+            component="button"
+            underline="always"
+            onClick={refetch}
+            c="red.4"
+          >
+            {t("common.retry", "Retry")}
           </Anchor>
         </Text>
       )}
 
       {apiKeyLoading ? (
-        <div style={{ padding: 18, borderRadius: 12, background: "var(--api-keys-card-bg)", border: "1px solid var(--api-keys-card-border)", boxShadow: "0 2px 8px var(--api-keys-card-shadow)" }}>
+        <div
+          style={{
+            padding: 18,
+            borderRadius: 12,
+            background: "var(--api-keys-card-bg)",
+            border: "1px solid var(--api-keys-card-border)",
+            boxShadow: "0 2px 8px var(--api-keys-card-shadow)",
+          }}
+        >
           <Group align="center" gap={12} wrap="nowrap">
             <Skeleton height={36} style={{ flex: 1 }} />
             <Skeleton height={32} width={76} />
@@ -131,7 +181,10 @@ export default function ApiKeys() {
       )}
 
       <Text size="sm" c="dimmed" style={{ marginTop: -8 }}>
-        {t('config.apiKeys.usage', 'Include this key in the X-API-KEY header with all API requests.')}
+        {t(
+          "config.apiKeys.usage",
+          "Include this key in the X-API-KEY header with all API requests.",
+        )}
       </Text>
 
       <RefreshModal
diff --git a/frontend/src/proprietary/components/shared/config/configSections/PeopleSection.tsx b/frontend/src/proprietary/components/shared/config/configSections/PeopleSection.tsx
index 2b784511c7..f9ca9eab42 100644
--- a/frontend/src/proprietary/components/shared/config/configSections/PeopleSection.tsx
+++ b/frontend/src/proprietary/components/shared/config/configSections/PeopleSection.tsx
@@ -1,5 +1,6 @@
-import { useState, useEffect } from 'react';
-import { useTranslation } from 'react-i18next';
+import { useState, useEffect } from "react";
+import { isAxiosError } from "axios";
+import { useTranslation } from "react-i18next";
 import {
   Stack,
   Text,
@@ -17,21 +18,25 @@ import {
   CloseButton,
   Avatar,
   Box,
-} from '@mantine/core';
-import LocalIcon from '@app/components/shared/LocalIcon';
-import { alert } from '@app/components/toast';
-import { userManagementService, User } from '@app/services/userManagementService';
-import { teamService, Team } from '@app/services/teamService';
-import { Z_INDEX_OVER_CONFIG_MODAL } from '@app/styles/zIndex';
-import { useAppConfig } from '@app/contexts/AppConfigContext';
-import InviteMembersModal from '@app/components/shared/InviteMembersModal';
-import { useLoginRequired } from '@app/hooks/useLoginRequired';
-import LoginRequiredBanner from '@app/components/shared/config/LoginRequiredBanner';
-import { useNavigate } from 'react-router-dom';
-import UpdateSeatsButton from '@app/components/shared/UpdateSeatsButton';
-import { useLicense } from '@app/contexts/LicenseContext';
-import ChangeUserPasswordModal from '@app/components/shared/ChangeUserPasswordModal';
-import { useAuth } from '@app/auth/UseSession';
+  type ComboboxItem,
+} from "@mantine/core";
+import LocalIcon from "@app/components/shared/LocalIcon";
+import { alert } from "@app/components/toast";
+import {
+  userManagementService,
+  User,
+} from "@app/services/userManagementService";
+import { teamService, Team } from "@app/services/teamService";
+import { Z_INDEX_OVER_CONFIG_MODAL } from "@app/styles/zIndex";
+import { useAppConfig } from "@app/contexts/AppConfigContext";
+import InviteMembersModal from "@app/components/shared/InviteMembersModal";
+import { useLoginRequired } from "@app/hooks/useLoginRequired";
+import LoginRequiredBanner from "@app/components/shared/config/LoginRequiredBanner";
+import { useNavigate } from "react-router-dom";
+import UpdateSeatsButton from "@app/components/shared/UpdateSeatsButton";
+import { useLicense } from "@app/contexts/LicenseContext";
+import ChangeUserPasswordModal from "@app/components/shared/ChangeUserPasswordModal";
+import { useAuth } from "@app/auth/UseSession";
 
 export default function PeopleSection() {
   const { t } = useTranslation();
@@ -43,10 +48,11 @@ export default function PeopleSection() {
   const [users, setUsers] = useState<User[]>([]);
   const [teams, setTeams] = useState<Team[]>([]);
   const [loading, setLoading] = useState(true);
-  const [searchQuery, setSearchQuery] = useState('');
+  const [searchQuery, setSearchQuery] = useState("");
   const [inviteModalOpened, setInviteModalOpened] = useState(false);
   const [editUserModalOpened, setEditUserModalOpened] = useState(false);
-  const [changePasswordModalOpened, setChangePasswordModalOpened] = useState(false);
+  const [changePasswordModalOpened, setChangePasswordModalOpened] =
+    useState(false);
   const [passwordUser, setPasswordUser] = useState<User | null>(null);
   const [selectedUser, setSelectedUser] = useState<User | null>(null);
   const [processing, setProcessing] = useState(false);
@@ -68,16 +74,19 @@ export default function PeopleSection() {
       return;
     }
     if (hasNoSlots) {
-      navigate('/settings/adminPlan');
+      navigate("/settings/adminPlan");
       return;
     }
     setInviteModalOpened(true);
   };
 
   const addMemberTooltip = !loginEnabled
-    ? t('workspace.people.loginRequired', 'Enable login mode first')
+    ? t("workspace.people.loginRequired", "Enable login mode first")
     : hasNoSlots
-      ? t('workspace.people.license.noSlotsAvailable', 'No user slots available')
+      ? t(
+          "workspace.people.license.noSlotsAvailable",
+          "No user slots available",
+        )
       : null;
 
   const isCurrentUser = (user: User) => currentUser?.username === user.username;
@@ -85,7 +94,7 @@ export default function PeopleSection() {
 
   // Form state for edit user modal
   const [editForm, setEditForm] = useState({
-    role: 'ROLE_USER',
+    role: "ROLE_USER",
     teamId: undefined as number | undefined,
   });
 
@@ -95,7 +104,10 @@ export default function PeopleSection() {
 
   useEffect(() => {
     if (config) {
-      console.log('[PeopleSection] Email invites enabled:', config.enableEmailInvites);
+      console.log(
+        "[PeopleSection] Email invites enabled:",
+        config.enableEmailInvites,
+      );
     }
   }, [config]);
 
@@ -110,11 +122,16 @@ export default function PeopleSection() {
         ]);
 
         // Enrich users with session data
-        const enrichedUsers = adminData.users.map(user => ({
+        const enrichedUsers = adminData.users.map((user) => ({
           ...user,
           isActive: adminData.userSessions[user.username] || false,
           lastRequest: adminData.userLastRequest[user.username] || undefined,
-          mfaEnabled: adminData.userSettings?.[user.username]?.mfaEnabled === 'true',
+          mfaEnabled:
+            (
+              adminData.userSettings?.[user.username] as
+                | Record<string, unknown>
+                | undefined
+            )?.mfaEnabled === "true",
         }));
 
         setUsers(enrichedUsers);
@@ -136,57 +153,57 @@ export default function PeopleSection() {
         const exampleUsers: User[] = [
           {
             id: 1,
-            username: 'admin',
-            email: 'admin@example.com',
+            username: "admin",
+            email: "admin@example.com",
             enabled: true,
-            roleName: 'ROLE_ADMIN',
-            rolesAsString: 'ROLE_ADMIN',
-            authenticationType: 'password',
+            roleName: "ROLE_ADMIN",
+            rolesAsString: "ROLE_ADMIN",
+            authenticationType: "password",
             isActive: true,
             lastRequest: Date.now(),
-            team: { id: 1, name: 'Engineering' }
+            team: { id: 1, name: "Engineering" },
           },
           {
             id: 2,
-            username: 'john.doe',
-            email: 'john.doe@example.com',
+            username: "john.doe",
+            email: "john.doe@example.com",
             enabled: true,
-            roleName: 'ROLE_USER',
-            rolesAsString: 'ROLE_USER',
-            authenticationType: 'password',
+            roleName: "ROLE_USER",
+            rolesAsString: "ROLE_USER",
+            authenticationType: "password",
             isActive: false,
             lastRequest: Date.now() - 86400000,
-            team: { id: 1, name: 'Engineering' }
+            team: { id: 1, name: "Engineering" },
           },
           {
             id: 3,
-            username: 'jane.smith',
-            email: 'jane.smith@example.com',
+            username: "jane.smith",
+            email: "jane.smith@example.com",
             enabled: true,
-            roleName: 'ROLE_USER',
-            rolesAsString: 'ROLE_USER',
-            authenticationType: 'oauth',
+            roleName: "ROLE_USER",
+            rolesAsString: "ROLE_USER",
+            authenticationType: "oauth",
             isActive: true,
             lastRequest: Date.now(),
-            team: { id: 2, name: 'Marketing' }
+            team: { id: 2, name: "Marketing" },
           },
           {
             id: 4,
-            username: 'bob.wilson',
-            email: 'bob.wilson@example.com',
+            username: "bob.wilson",
+            email: "bob.wilson@example.com",
             enabled: false,
-            roleName: 'ROLE_USER',
-            rolesAsString: 'ROLE_USER',
-            authenticationType: 'password',
+            roleName: "ROLE_USER",
+            rolesAsString: "ROLE_USER",
+            authenticationType: "password",
             isActive: false,
             lastRequest: Date.now() - 604800000,
-            team: undefined
-          }
+            team: undefined,
+          },
         ];
 
         const exampleTeams: Team[] = [
-          { id: 1, name: 'Engineering', userCount: 3 },
-          { id: 2, name: 'Marketing', userCount: 2 }
+          { id: 1, name: "Engineering", userCount: 3 },
+          { id: 2, name: "Marketing", userCount: 2 },
         ];
 
         setUsers(exampleUsers);
@@ -205,8 +222,8 @@ export default function PeopleSection() {
         });
       }
     } catch (error) {
-      console.error('[PeopleSection] Failed to fetch people data:', error);
-      alert({ alertType: 'error', title: 'Failed to load people data' });
+      console.error("[PeopleSection] Failed to fetch people data:", error);
+      alert({ alertType: "error", title: "Failed to load people data" });
     } finally {
       setLoading(false);
     }
@@ -222,16 +239,21 @@ export default function PeopleSection() {
         role: editForm.role,
         teamId: editForm.teamId,
       });
-      alert({ alertType: 'success', title: t('workspace.people.editMember.success') });
+      alert({
+        alertType: "success",
+        title: t("workspace.people.editMember.success"),
+      });
       closeEditModal();
       fetchData();
-    } catch (error: any) {
-      console.error('[PeopleSection] Failed to update user:', error);
-      const errorMessage = error.response?.data?.message ||
-                          error.response?.data?.error ||
-                          error.message ||
-                          t('workspace.people.editMember.error');
-      alert({ alertType: 'error', title: errorMessage });
+    } catch (error: unknown) {
+      console.error("[PeopleSection] Failed to update user:", error);
+      const errorMessage = isAxiosError(error)
+        ? error.response?.data?.message ||
+          error.response?.data?.error ||
+          error.message
+        : (error instanceof Error ? error.message : undefined) ||
+          t("workspace.people.editMember.error");
+      alert({ alertType: "error", title: errorMessage });
     } finally {
       setProcessing(false);
     }
@@ -239,56 +261,89 @@ export default function PeopleSection() {
 
   const handleToggleEnabled = async (user: User) => {
     try {
-      await userManagementService.toggleUserEnabled(user.username, !user.enabled);
-      alert({ alertType: 'success', title: t('workspace.people.toggleEnabled.success') });
+      await userManagementService.toggleUserEnabled(
+        user.username,
+        !user.enabled,
+      );
+      alert({
+        alertType: "success",
+        title: t("workspace.people.toggleEnabled.success"),
+      });
       fetchData();
-    } catch (error: any) {
-      console.error('[PeopleSection] Failed to toggle user status:', error);
-      const errorMessage = error.response?.data?.message ||
-                          error.response?.data?.error ||
-                          error.message ||
-                          t('workspace.people.toggleEnabled.error');
-      alert({ alertType: 'error', title: errorMessage });
+    } catch (error: unknown) {
+      console.error("[PeopleSection] Failed to toggle user status:", error);
+      const errorMessage = isAxiosError(error)
+        ? error.response?.data?.message ||
+          error.response?.data?.error ||
+          error.message
+        : (error instanceof Error ? error.message : undefined) ||
+          t("workspace.people.toggleEnabled.error");
+      alert({ alertType: "error", title: errorMessage });
     }
   };
 
   const handleDeleteUser = async (user: User) => {
-    const confirmMessage = t('workspace.people.confirmDelete', 'Are you sure you want to delete this user? This action cannot be undone.');
+    const confirmMessage = t(
+      "workspace.people.confirmDelete",
+      "Are you sure you want to delete this user? This action cannot be undone.",
+    );
     if (!window.confirm(`${confirmMessage}\n\nUser: ${user.username}`)) {
       return;
     }
 
     try {
       await userManagementService.deleteUser(user.username);
-      alert({ alertType: 'success', title: t('workspace.people.deleteUserSuccess', 'User deleted successfully') });
+      alert({
+        alertType: "success",
+        title: t(
+          "workspace.people.deleteUserSuccess",
+          "User deleted successfully",
+        ),
+      });
       fetchData();
-    } catch (error: any) {
-      console.error('[PeopleSection] Failed to delete user:', error);
-      const errorMessage = error.response?.data?.message ||
-                          error.response?.data?.error ||
-                          error.message ||
-                          t('workspace.people.deleteUserError', 'Failed to delete user');
-      alert({ alertType: 'error', title: errorMessage });
+    } catch (error: unknown) {
+      console.error("[PeopleSection] Failed to delete user:", error);
+      const errorMessage = isAxiosError(error)
+        ? error.response?.data?.message ||
+          error.response?.data?.error ||
+          error.message
+        : (error instanceof Error ? error.message : undefined) ||
+          t("workspace.people.deleteUserError", "Failed to delete user");
+      alert({ alertType: "error", title: errorMessage });
     }
   };
 
   const handleUnlockUser = async (user: User) => {
-    const confirmMessage = t('workspace.people.confirmUnlock', 'Are you sure you want to unlock this user account?');
+    const confirmMessage = t(
+      "workspace.people.confirmUnlock",
+      "Are you sure you want to unlock this user account?",
+    );
     if (!window.confirm(`${confirmMessage}\n\nUser: ${user.username}`)) {
       return;
     }
 
     try {
       await userManagementService.unlockUser(user.username);
-      alert({ alertType: 'success', title: t('workspace.people.unlockUserSuccess', 'User account unlocked successfully') });
+      alert({
+        alertType: "success",
+        title: t(
+          "workspace.people.unlockUserSuccess",
+          "User account unlocked successfully",
+        ),
+      });
       fetchData();
-    } catch (error: any) {
-      console.error('[PeopleSection] Failed to unlock user:', error);
-      const errorMessage = error.response?.data?.message ||
-                          error.response?.data?.error ||
-                          error.message ||
-                          t('workspace.people.unlockUserError', 'Failed to unlock user account');
-      alert({ alertType: 'error', title: errorMessage });
+    } catch (error: unknown) {
+      console.error("[PeopleSection] Failed to unlock user:", error);
+      const errorMessage = isAxiosError(error)
+        ? error.response?.data?.message ||
+          error.response?.data?.error ||
+          error.message
+        : (error instanceof Error ? error.message : undefined) ||
+          t(
+            "workspace.people.unlockUserError",
+            "Failed to unlock user account",
+          );
+      alert({ alertType: "error", title: errorMessage });
     }
   };
 
@@ -315,36 +370,57 @@ export default function PeopleSection() {
     setEditUserModalOpened(false);
     setSelectedUser(null);
     setEditForm({
-      role: 'ROLE_USER',
+      role: "ROLE_USER",
       teamId: undefined,
     });
   };
 
   const filteredUsers = users.filter((user) =>
-    user.username.toLowerCase().includes(searchQuery.toLowerCase())
+    user.username.toLowerCase().includes(searchQuery.toLowerCase()),
   );
 
   const roleOptions = [
     {
-      value: 'ROLE_ADMIN',
-      label: t('workspace.people.admin'),
-      description: t('workspace.people.roleDescriptions.admin', 'Can manage settings and invite members, with full administrative access.'),
-      icon: 'admin-panel-settings'
+      value: "ROLE_ADMIN",
+      label: t("workspace.people.admin"),
+      description: t(
+        "workspace.people.roleDescriptions.admin",
+        "Can manage settings and invite members, with full administrative access.",
+      ),
+      icon: "admin-panel-settings",
     },
     {
-      value: 'ROLE_USER',
-      label: t('workspace.people.member'),
-      description: t('workspace.people.roleDescriptions.member', 'Can view and edit shared files, but cannot manage workspace settings or members.'),
-      icon: 'person'
+      value: "ROLE_USER",
+      label: t("workspace.people.member"),
+      description: t(
+        "workspace.people.roleDescriptions.member",
+        "Can view and edit shared files, but cannot manage workspace settings or members.",
+      ),
+      icon: "person",
     },
   ];
 
-  const renderRoleOption = ({ option }: { option: any }) => (
+  const renderRoleOption = ({
+    option,
+  }: {
+    option: ComboboxItem & { icon?: string; description?: string };
+  }) => (
     <Group gap="sm" wrap="nowrap">
-      <LocalIcon icon={option.icon} width="1.25rem" height="1.25rem" style={{ flexShrink: 0 }} />
+      <LocalIcon
+        icon={option.icon ?? ""}
+        width="1.25rem"
+        height="1.25rem"
+        style={{ flexShrink: 0 }}
+      />
       <Box style={{ flex: 1 }}>
-        <Text size="sm" fw={500}>{option.label}</Text>
-        <Text size="xs" c="dimmed" style={{ whiteSpace: 'normal', lineHeight: 1.4 }}>
+        <Text size="sm" fw={500}>
+          {option.label}
+        </Text>
+        <Text
+          size="xs"
+          c="dimmed"
+          style={{ whiteSpace: "normal", lineHeight: 1.4 }}
+        >
           {option.description}
         </Text>
       </Box>
@@ -361,7 +437,7 @@ export default function PeopleSection() {
       <Stack align="center" py="md">
         <Loader size="sm" />
         <Text size="sm" c="dimmed">
-          {t('workspace.people.loading', 'Loading people...')}
+          {t("workspace.people.loading", "Loading people...")}
         </Text>
       </Stack>
     );
@@ -372,34 +448,47 @@ export default function PeopleSection() {
       <LoginRequiredBanner show={!loginEnabled} />
       <div>
         <Text fw={600} size="lg">
-          {t('workspace.people.title')}
+          {t("workspace.people.title")}
         </Text>
         <Text size="sm" c="dimmed">
-          {t('workspace.people.description')}
+          {t("workspace.people.description")}
         </Text>
       </div>
 
       {/* License Information - Compact */}
       {licenseInfo && (
-        <Group gap="md" style={{ fontSize: '0.875rem' }}>
+        <Group gap="md" style={{ fontSize: "0.875rem" }}>
           <Text size="sm" span c="dimmed">
-            <Text component="span" fw={600} c="inherit">{licenseInfo.totalUsers}</Text>
-            <Text component="span" c="dimmed"> / </Text>
-            <Text component="span" fw={600} c="inherit">{licenseInfo.maxAllowedUsers}</Text>
-            <Text component="span" c="dimmed"> {t('workspace.people.license.users', 'users')}</Text>
+            <Text component="span" fw={600} c="inherit">
+              {licenseInfo.totalUsers}
+            </Text>
+            <Text component="span" c="dimmed">
+              {" "}
+              /{" "}
+            </Text>
+            <Text component="span" fw={600} c="inherit">
+              {licenseInfo.maxAllowedUsers}
+            </Text>
+            <Text component="span" c="dimmed">
+              {" "}
+              {t("workspace.people.license.users", "users")}
+            </Text>
           </Text>
 
           {licenseInfo.availableSlots === 0 && (
             <Group gap="xs" wrap="nowrap" align="center">
               <Badge color="red" variant="light" size="sm">
-                {t('workspace.people.license.noSlotsAvailable', 'No slots available')}
+                {t(
+                  "workspace.people.license.noSlotsAvailable",
+                  "No slots available",
+                )}
               </Badge>
               <Button
                 size="compact-sm"
                 variant="outline"
-                onClick={() => navigate('/settings/adminPlan')}
+                onClick={() => navigate("/settings/adminPlan")}
               >
-                {t('workspace.people.actions.upgrade', 'Upgrade')}
+                {t("workspace.people.actions.upgrade", "Upgrade")}
               </Button>
             </Group>
           )}
@@ -408,31 +497,37 @@ export default function PeopleSection() {
             <Text size="sm" c="dimmed" span>
               •
               <Text component="span" ml={4}>
-                {t('workspace.people.license.grandfatheredShort', '{{count}} grandfathered', { count: licenseInfo.grandfatheredUserCount })}
+                {t(
+                  "workspace.people.license.grandfatheredShort",
+                  "{{count}} grandfathered",
+                  {
+                    count: licenseInfo.grandfatheredUserCount,
+                  },
+                )}
               </Text>
             </Text>
           )}
 
           {lockedUsers.length > 0 && (
             <Badge color="orange" variant="light" size="sm">
-              {lockedUsers.length} {t('workspace.people.locked', 'locked')}
+              {lockedUsers.length} {t("workspace.people.locked", "locked")}
             </Badge>
           )}
 
           {licenseInfo.premiumEnabled && licenseInfo.licenseMaxUsers > 0 && (
             <Badge color="blue" variant="light" size="sm">
-              +{licenseInfo.licenseMaxUsers} {t('workspace.people.license.fromLicense', 'from license')}
+              +{licenseInfo.licenseMaxUsers}{" "}
+              {t("workspace.people.license.fromLicense", "from license")}
             </Badge>
           )}
 
           {/* Enterprise Seat Management Button */}
-          {globalLicenseInfo?.licenseType === 'ENTERPRISE' && (
+          {globalLicenseInfo?.licenseType === "ENTERPRISE" && (
             <>
-              <Text size="sm" c="dimmed" span>•</Text>
-              <UpdateSeatsButton
-                size="xs"
-                onSuccess={fetchData}
-              />
+              <Text size="sm" c="dimmed" span>
+                •
+              </Text>
+              <UpdateSeatsButton size="xs" onSuccess={fetchData} />
             </>
           )}
         </Group>
@@ -441,7 +536,7 @@ export default function PeopleSection() {
       {/* Header Actions */}
       <Group justify="space-between">
         <TextInput
-          placeholder={t('workspace.people.searchMembers')}
+          placeholder={t("workspace.people.searchMembers")}
           leftSection={<LocalIcon icon="search" width="1rem" height="1rem" />}
           value={searchQuery}
           onChange={(e) => setSearchQuery(e.currentTarget.value)}
@@ -449,16 +544,23 @@ export default function PeopleSection() {
         />
         <Tooltip
           label={addMemberTooltip || undefined}
-          disabled={loginEnabled && (!licenseInfo || licenseInfo.availableSlots > 0)}
+          disabled={
+            loginEnabled && (!licenseInfo || licenseInfo.availableSlots > 0)
+          }
           position="bottom"
           withArrow
         >
           <Button
-            leftSection={<LocalIcon icon="person-add" width="1rem" height="1rem" />}
+            leftSection={
+              <LocalIcon icon="person-add" width="1rem" height="1rem" />
+            }
             onClick={handleAddMembersClick}
-            disabled={!loginEnabled || (licenseInfo ? licenseInfo.availableSlots === 0 : false)}
+            disabled={
+              !loginEnabled ||
+              (licenseInfo ? licenseInfo.availableSlots === 0 : false)
+            }
           >
-            {t('workspace.people.addMembers')}
+            {t("workspace.people.addMembers")}
           </Button>
         </Tooltip>
       </Group>
@@ -468,20 +570,32 @@ export default function PeopleSection() {
         horizontalSpacing="md"
         verticalSpacing="sm"
         withRowBorders
-        style={{
-          '--table-border-color': 'var(--mantine-color-gray-3)',
-        } as React.CSSProperties}
+        style={
+          {
+            "--table-border-color": "var(--mantine-color-gray-3)",
+          } as React.CSSProperties
+        }
       >
         <Table.Thead>
-          <Table.Tr style={{ backgroundColor: 'var(--mantine-color-gray-0)' }}>
-            <Table.Th style={{ fontWeight: 600, color: 'var(--mantine-color-gray-7)' }} fz="sm">
-              {t('workspace.people.user')}
+          <Table.Tr style={{ backgroundColor: "var(--mantine-color-gray-0)" }}>
+            <Table.Th
+              style={{ fontWeight: 600, color: "var(--mantine-color-gray-7)" }}
+              fz="sm"
+            >
+              {t("workspace.people.user")}
             </Table.Th>
-            <Table.Th style={{ fontWeight: 600, color: 'var(--mantine-color-gray-7)' }} fz="sm" w={100}>
-              {t('workspace.people.role')}
+            <Table.Th
+              style={{ fontWeight: 600, color: "var(--mantine-color-gray-7)" }}
+              fz="sm"
+              w={100}
+            >
+              {t("workspace.people.role")}
             </Table.Th>
-            <Table.Th style={{ fontWeight: 600, color: 'var(--mantine-color-gray-7)' }} fz="sm">
-              {t('workspace.people.team')}
+            <Table.Th
+              style={{ fontWeight: 600, color: "var(--mantine-color-gray-7)" }}
+              fz="sm"
+            >
+              {t("workspace.people.team")}
             </Table.Th>
             <Table.Th w={50}></Table.Th>
           </Table.Tr>
@@ -491,7 +605,7 @@ export default function PeopleSection() {
             <Table.Tr>
               <Table.Td colSpan={4}>
                 <Text ta="center" c="dimmed" py="xl">
-                  {t('workspace.people.noMembersFound')}
+                  {t("workspace.people.noMembersFound")}
                 </Text>
               </Table.Td>
             </Table.Tr>
@@ -499,28 +613,37 @@ export default function PeopleSection() {
             filteredUsers.map((user) => (
               <Table.Tr
                 key={user.id}
-                style={isCurrentUser(user) ? { backgroundColor: 'rgba(34, 139, 230, 0.08)' } : undefined}
+                style={
+                  isCurrentUser(user)
+                    ? { backgroundColor: "rgba(34, 139, 230, 0.08)" }
+                    : undefined
+                }
               >
                 <Table.Td>
                   <Group gap="xs" wrap="nowrap">
                     <Tooltip
                       label={
                         !user.enabled
-                          ? t('workspace.people.disabled', 'Disabled')
+                          ? t("workspace.people.disabled", "Disabled")
                           : user.isActive
-                            ? t('workspace.people.activeSession', 'Active session')
-                            : t('workspace.people.active', 'Active')
+                            ? t(
+                                "workspace.people.activeSession",
+                                "Active session",
+                              )
+                            : t("workspace.people.active", "Active")
                       }
                       zIndex={Z_INDEX_OVER_CONFIG_MODAL}
                     >
                       <Avatar
                         size={32}
-                        color={user.enabled ? 'blue' : 'gray'}
+                        color={user.enabled ? "blue" : "gray"}
                         styles={{
                           root: {
-                            border: user.isActive ? '2px solid var(--mantine-color-green-6)' : 'none',
+                            border: user.isActive
+                              ? "2px solid var(--mantine-color-green-6)"
+                              : "none",
                             opacity: user.enabled ? 1 : 0.5,
-                          }
+                          },
                         }}
                       >
                         {user.username.charAt(0).toUpperCase()}
@@ -528,7 +651,11 @@ export default function PeopleSection() {
                     </Tooltip>
                     <Box style={{ minWidth: 0, flex: 1 }}>
                       <Group gap={6} wrap="nowrap" align="center">
-                        <Tooltip label={user.username} disabled={user.username.length <= 20} zIndex={Z_INDEX_OVER_CONFIG_MODAL}>
+                        <Tooltip
+                          label={user.username}
+                          disabled={user.username.length <= 20}
+                          zIndex={Z_INDEX_OVER_CONFIG_MODAL}
+                        >
                           <Text
                             size="sm"
                             fw={500}
@@ -536,9 +663,9 @@ export default function PeopleSection() {
                             style={{
                               lineHeight: 1.3,
                               opacity: user.enabled ? 1 : 0.6,
-                              overflow: 'hidden',
-                              textOverflow: 'ellipsis',
-                              whiteSpace: 'nowrap',
+                              overflow: "hidden",
+                              textOverflow: "ellipsis",
+                              whiteSpace: "nowrap",
                             }}
                           >
                             {user.username}
@@ -546,12 +673,17 @@ export default function PeopleSection() {
                         </Tooltip>
                         {isLockedUser(user) && (
                           <Badge color="orange" variant="light" size="xs">
-                            {t('workspace.people.lockedBadge', 'Locked')}
+                            {t("workspace.people.lockedBadge", "Locked")}
                           </Badge>
                         )}
                       </Group>
                       {user.email && (
-                        <Text size="xs" c="dimmed" truncate style={{ lineHeight: 1.3 }}>
+                        <Text
+                          size="xs"
+                          c="dimmed"
+                          truncate
+                          style={{ lineHeight: 1.3 }}
+                        >
                           {user.email}
                         </Text>
                       )}
@@ -562,23 +694,31 @@ export default function PeopleSection() {
                   <Badge
                     size="sm"
                     variant="light"
-                    color={(user.rolesAsString || '').includes('ROLE_ADMIN') ? 'blue' : 'cyan'}
+                    color={
+                      (user.rolesAsString || "").includes("ROLE_ADMIN")
+                        ? "blue"
+                        : "cyan"
+                    }
                   >
-                    {(user.rolesAsString || '').includes('ROLE_ADMIN')
-                      ? t('workspace.people.admin', 'Admin')
-                      : t('workspace.people.member', 'Member')}
+                    {(user.rolesAsString || "").includes("ROLE_ADMIN")
+                      ? t("workspace.people.admin", "Admin")
+                      : t("workspace.people.member", "Member")}
                   </Badge>
                 </Table.Td>
                 <Table.Td>
                   {user.team?.name ? (
-                    <Tooltip label={user.team.name} disabled={user.team.name.length <= 20} zIndex={Z_INDEX_OVER_CONFIG_MODAL}>
+                    <Tooltip
+                      label={user.team.name}
+                      disabled={user.team.name.length <= 20}
+                      zIndex={Z_INDEX_OVER_CONFIG_MODAL}
+                    >
                       <Text
                         size="sm"
                         maw={150}
                         style={{
-                          overflow: 'hidden',
-                          textOverflow: 'ellipsis',
-                          whiteSpace: 'nowrap',
+                          overflow: "hidden",
+                          textOverflow: "ellipsis",
+                          whiteSpace: "nowrap",
                         }}
                       >
                         {user.team.name}
@@ -588,74 +728,128 @@ export default function PeopleSection() {
                     <Text size="sm">—</Text>
                   )}
                 </Table.Td>
-                  <Table.Td>
-                    <Group gap="xs" wrap="nowrap">
-                      {/* Info icon with tooltip */}
-                      <Tooltip
-                        label={
-                          <div>
-                            <Text size="xs" fw={500}>Authentication: {user.authenticationType || 'Unknown'}</Text>
-                            <Text size="xs">
-                              Last Activity: {user.lastRequest && new Date(user.lastRequest).getFullYear() >= 1980
-                                ? new Date(user.lastRequest).toLocaleString()
-                                :t('never', 'Never')}
-                            </Text>
-                          </div>
-                        }
-                        multiline
-                        w={220}
-                        position="left"
-                        withArrow
-                        zIndex={Z_INDEX_OVER_CONFIG_MODAL + 10}
-                      >
-                        <ActionIcon variant="subtle"size="sm">
-                          <LocalIcon icon="info" width="1rem" height="1rem" />
-                        </ActionIcon>
-                      </Tooltip>
+                <Table.Td>
+                  <Group gap="xs" wrap="nowrap">
+                    {/* Info icon with tooltip */}
+                    <Tooltip
+                      label={
+                        <div>
+                          <Text size="xs" fw={500}>
+                            Authentication:{" "}
+                            {user.authenticationType || "Unknown"}
+                          </Text>
+                          <Text size="xs">
+                            Last Activity:{" "}
+                            {user.lastRequest &&
+                            new Date(user.lastRequest).getFullYear() >= 1980
+                              ? new Date(user.lastRequest).toLocaleString()
+                              : t("never", "Never")}
+                          </Text>
+                        </div>
+                      }
+                      multiline
+                      w={220}
+                      position="left"
+                      withArrow
+                      zIndex={Z_INDEX_OVER_CONFIG_MODAL + 10}
+                    >
+                      <ActionIcon variant="subtle" size="sm">
+                        <LocalIcon icon="info" width="1rem" height="1rem" />
+                      </ActionIcon>
+                    </Tooltip>
 
-                      {/* Actions menu */}
-                      {!isCurrentUser(user) && (
+                    {/* Actions menu */}
+                    {!isCurrentUser(user) && (
                       <Menu position="bottom-end" withinPortal>
                         <Menu.Target>
-                          <ActionIcon variant="subtle"  disabled={!loginEnabled}>
-                            <LocalIcon icon="more-vert" width="1rem" height="1rem" />
+                          <ActionIcon variant="subtle" disabled={!loginEnabled}>
+                            <LocalIcon
+                              icon="more-vert"
+                              width="1rem"
+                              height="1rem"
+                            />
                           </ActionIcon>
                         </Menu.Target>
-                        <Menu.Dropdown style={{ zIndex: Z_INDEX_OVER_CONFIG_MODAL }}>
+                        <Menu.Dropdown
+                          style={{ zIndex: Z_INDEX_OVER_CONFIG_MODAL }}
+                        >
                           {!isCurrentUser(user) && (
                             <Menu.Item
-                              leftSection={<LocalIcon icon="edit" width="1rem" height="1rem" />}
+                              leftSection={
+                                <LocalIcon
+                                  icon="edit"
+                                  width="1rem"
+                                  height="1rem"
+                                />
+                              }
                               onClick={() => openEditModal(user)}
                               disabled={!loginEnabled}
                             >
-                              {t('workspace.people.editRole', 'Edit Role & Team')}
+                              {t(
+                                "workspace.people.editRole",
+                                "Edit Role & Team",
+                              )}
                             </Menu.Item>
                           )}
                           {!isCurrentUser(user) && (
-                          <Menu.Item
-                            leftSection={<LocalIcon icon="lock" width="1rem" height="1rem" />}
-                            onClick={() => openChangePasswordModal(user)}
-                            disabled={!loginEnabled}
-                          >
-                            {t('workspace.people.changePassword.action', 'Change password')}
-                          </Menu.Item>
+                            <Menu.Item
+                              leftSection={
+                                <LocalIcon
+                                  icon="lock"
+                                  width="1rem"
+                                  height="1rem"
+                                />
+                              }
+                              onClick={() => openChangePasswordModal(user)}
+                              disabled={!loginEnabled}
+                            >
+                              {t(
+                                "workspace.people.changePassword.action",
+                                "Change password",
+                              )}
+                            </Menu.Item>
                           )}
                           {!isCurrentUser(user) && (
                             <Menu.Item
-                              leftSection={user.enabled ? <LocalIcon icon="person-off" width="1rem" height="1rem" /> : <LocalIcon icon="person-check" width="1rem" height="1rem" />}
+                              leftSection={
+                                user.enabled ? (
+                                  <LocalIcon
+                                    icon="person-off"
+                                    width="1rem"
+                                    height="1rem"
+                                  />
+                                ) : (
+                                  <LocalIcon
+                                    icon="person-check"
+                                    width="1rem"
+                                    height="1rem"
+                                  />
+                                )
+                              }
                               onClick={() => handleToggleEnabled(user)}
                               disabled={!loginEnabled}
                             >
-                              {user.enabled ? t('workspace.people.disable') : t('workspace.people.enable')}
+                              {user.enabled
+                                ? t("workspace.people.disable")
+                                : t("workspace.people.enable")}
                             </Menu.Item>
                           )}
                           {!isCurrentUser(user) && isLockedUser(user) && (
                             <Menu.Item
-                              leftSection={<LocalIcon icon="lock-open" width="1rem" height="1rem" />}
+                              leftSection={
+                                <LocalIcon
+                                  icon="lock-open"
+                                  width="1rem"
+                                  height="1rem"
+                                />
+                              }
                               onClick={() => handleUnlockUser(user)}
                               disabled={!loginEnabled}
                             >
-                              {t('workspace.people.unlockAccount', 'Unlock Account')}
+                              {t(
+                                "workspace.people.unlockAccount",
+                                "Unlock Account",
+                              )}
                             </Menu.Item>
                           )}
                           {!isCurrentUser(user) && user.mfaEnabled && (
@@ -663,42 +857,83 @@ export default function PeopleSection() {
                               <Menu.Divider />
                               <Menu.Item
                                 color="red"
-                                leftSection={<LocalIcon icon="key" width="1rem" height="1rem" />}
+                                leftSection={
+                                  <LocalIcon
+                                    icon="key"
+                                    width="1rem"
+                                    height="1rem"
+                                  />
+                                }
                                 onClick={async () => {
                                   try {
-                                    await userManagementService.disableMfaByAdmin(user.username);
-                                    alert({ alertType: 'success', title: t('workspace.people.mfa.adminDisableSuccess', 'MFA disabled successfully for user') });
-                                  } catch (error: any) {
-                                    console.error('[PeopleSection] Failed to disable MFA for user:', error);
-                                    const errorMessage = error.response?.data?.message ||
-                                                        error.response?.data?.error ||
-                                                        error.message ||
-                                                        t('workspace.people.mfa.adminDisableError', 'Failed to disable MFA for user');
-                                    alert({ alertType: 'error', title: errorMessage });
+                                    await userManagementService.disableMfaByAdmin(
+                                      user.username,
+                                    );
+                                    alert({
+                                      alertType: "success",
+                                      title: t(
+                                        "workspace.people.mfa.adminDisableSuccess",
+                                        "MFA disabled successfully for user",
+                                      ),
+                                    });
+                                  } catch (error: unknown) {
+                                    console.error(
+                                      "[PeopleSection] Failed to disable MFA for user:",
+                                      error,
+                                    );
+                                    const errorMessage = isAxiosError(error)
+                                      ? error.response?.data?.message ||
+                                        error.response?.data?.error ||
+                                        error.message
+                                      : (error instanceof Error
+                                          ? error.message
+                                          : undefined) ||
+                                        t(
+                                          "workspace.people.mfa.adminDisableError",
+                                          "Failed to disable MFA for user",
+                                        );
+                                    alert({
+                                      alertType: "error",
+                                      title: errorMessage,
+                                    });
                                   }
                                 }}
                                 disabled={!loginEnabled}
                               >
-                                {t('workspace.people.mfa.disableByAdmin', 'Disable MFA')}
+                                {t(
+                                  "workspace.people.mfa.disableByAdmin",
+                                  "Disable MFA",
+                                )}
                               </Menu.Item>
                             </>
                           )}
                           {!isCurrentUser(user) && (
                             <>
                               <Menu.Divider />
-                              <Menu.Item color="red" leftSection={<LocalIcon icon="delete" width="1rem" height="1rem" />} onClick={() => handleDeleteUser(user)} disabled={!loginEnabled}>
-                                {t('workspace.people.deleteUser')}
+                              <Menu.Item
+                                color="red"
+                                leftSection={
+                                  <LocalIcon
+                                    icon="delete"
+                                    width="1rem"
+                                    height="1rem"
+                                  />
+                                }
+                                onClick={() => handleDeleteUser(user)}
+                                disabled={!loginEnabled}
+                              >
+                                {t("workspace.people.deleteUser")}
                               </Menu.Item>
                             </>
                           )}
                         </Menu.Dropdown>
                       </Menu>
-                      )}
-                    </Group>
-                  </Table.Td>
-                </Table.Tr>
-              ))
-            )}
+                    )}
+                  </Group>
+                </Table.Td>
+              </Table.Tr>
+            ))
+          )}
         </Table.Tbody>
       </Table>
 
@@ -732,42 +967,67 @@ export default function PeopleSection() {
             onClick={closeEditModal}
             size="lg"
             style={{
-              position: 'absolute',
+              position: "absolute",
               top: -8,
               right: -8,
-              zIndex: 1
+              zIndex: 1,
             }}
           />
           <Stack gap="lg" pt="md">
             {/* Header with Icon */}
             <Stack gap="md" align="center">
-              <LocalIcon icon="edit" width="3rem" height="3rem" style={{ color: 'var(--mantine-color-gray-6)' }} />
+              <LocalIcon
+                icon="edit"
+                width="3rem"
+                height="3rem"
+                style={{ color: "var(--mantine-color-gray-6)" }}
+              />
               <Text size="xl" fw={600} ta="center">
-                {t('workspace.people.editMember.title')}
+                {t("workspace.people.editMember.title")}
               </Text>
               <Text size="sm" c="dimmed" ta="center">
-                {t('workspace.people.editMember.editing')} <strong>{selectedUser?.username}</strong>
+                {t("workspace.people.editMember.editing")}{" "}
+                <strong>{selectedUser?.username}</strong>
               </Text>
             </Stack>
             <Select
-              label={t('workspace.people.editMember.role')}
+              label={t("workspace.people.editMember.role")}
               data={roleOptions}
               value={editForm.role}
-              onChange={(value) => setEditForm({ ...editForm, role: value || 'ROLE_USER' })}
+              onChange={(value) =>
+                setEditForm({ ...editForm, role: value || "ROLE_USER" })
+              }
               renderOption={renderRoleOption}
-              comboboxProps={{ withinPortal: true, zIndex: Z_INDEX_OVER_CONFIG_MODAL }}
+              comboboxProps={{
+                withinPortal: true,
+                zIndex: Z_INDEX_OVER_CONFIG_MODAL,
+              }}
             />
             <Select
-              label={t('workspace.people.editMember.team')}
-              placeholder={t('workspace.people.editMember.teamPlaceholder')}
+              label={t("workspace.people.editMember.team")}
+              placeholder={t("workspace.people.editMember.teamPlaceholder")}
               data={teamOptions}
               value={editForm.teamId?.toString()}
-              onChange={(value) => setEditForm({ ...editForm, teamId: value ? parseInt(value) : undefined })}
+              onChange={(value) =>
+                setEditForm({
+                  ...editForm,
+                  teamId: value ? parseInt(value) : undefined,
+                })
+              }
               clearable
-              comboboxProps={{ withinPortal: true, zIndex: Z_INDEX_OVER_CONFIG_MODAL }}
+              comboboxProps={{
+                withinPortal: true,
+                zIndex: Z_INDEX_OVER_CONFIG_MODAL,
+              }}
             />
-            <Button onClick={handleUpdateUserRole} loading={processing} fullWidth size="md" mt="md">
-              {t('workspace.people.editMember.submit')}
+            <Button
+              onClick={handleUpdateUserRole}
+              loading={processing}
+              fullWidth
+              size="md"
+              mt="md"
+            >
+              {t("workspace.people.editMember.submit")}
             </Button>
           </Stack>
         </Box>
diff --git a/frontend/src/proprietary/components/shared/config/configSections/TeamDetailsSection.tsx b/frontend/src/proprietary/components/shared/config/configSections/TeamDetailsSection.tsx
index dd1f493a43..93f2ffb284 100644
--- a/frontend/src/proprietary/components/shared/config/configSections/TeamDetailsSection.tsx
+++ b/frontend/src/proprietary/components/shared/config/configSections/TeamDetailsSection.tsx
@@ -1,5 +1,6 @@
-import { useState, useEffect } from 'react';
-import { useTranslation } from 'react-i18next';
+import { useState, useEffect } from "react";
+import { isAxiosError } from "axios";
+import { useTranslation } from "react-i18next";
 import {
   Stack,
   Text,
@@ -16,34 +17,43 @@ import {
   Menu,
   Avatar,
   Box,
-} from '@mantine/core';
-import LocalIcon from '@app/components/shared/LocalIcon';
-import { alert } from '@app/components/toast';
-import { teamService, Team } from '@app/services/teamService';
-import { User, userManagementService } from '@app/services/userManagementService';
-import { Z_INDEX_OVER_CONFIG_MODAL } from '@app/styles/zIndex';
-import ChangeUserPasswordModal from '@app/components/shared/ChangeUserPasswordModal';
+} from "@mantine/core";
+import LocalIcon from "@app/components/shared/LocalIcon";
+import { alert } from "@app/components/toast";
+import { teamService, Team } from "@app/services/teamService";
+import {
+  User,
+  userManagementService,
+} from "@app/services/userManagementService";
+import { Z_INDEX_OVER_CONFIG_MODAL } from "@app/styles/zIndex";
+import ChangeUserPasswordModal from "@app/components/shared/ChangeUserPasswordModal";
 
 interface TeamDetailsSectionProps {
   teamId: number;
   onBack: () => void;
 }
 
-export default function TeamDetailsSection({ teamId, onBack }: TeamDetailsSectionProps) {
+export default function TeamDetailsSection({
+  teamId,
+  onBack,
+}: TeamDetailsSectionProps) {
   const { t } = useTranslation();
   const [loading, setLoading] = useState(true);
   const [team, setTeam] = useState<Team | null>(null);
   const [teamUsers, setTeamUsers] = useState<User[]>([]);
   const [availableUsers, setAvailableUsers] = useState<User[]>([]);
   const [allTeams, setAllTeams] = useState<Team[]>([]);
-  const [userLastRequest, setUserLastRequest] = useState<Record<string, number>>({});
+  const [userLastRequest, setUserLastRequest] = useState<
+    Record<string, number>
+  >({});
   const [addMemberModalOpened, setAddMemberModalOpened] = useState(false);
   const [changeTeamModalOpened, setChangeTeamModalOpened] = useState(false);
-  const [changePasswordModalOpened, setChangePasswordModalOpened] = useState(false);
+  const [changePasswordModalOpened, setChangePasswordModalOpened] =
+    useState(false);
   const [passwordUser, setPasswordUser] = useState<User | null>(null);
   const [selectedUser, setSelectedUser] = useState<User | null>(null);
-  const [selectedUserId, setSelectedUserId] = useState<string>('');
-  const [selectedTeamId, setSelectedTeamId] = useState<string>('');
+  const [selectedUserId, setSelectedUserId] = useState<string>("");
+  const [selectedTeamId, setSelectedTeamId] = useState<string>("");
   const [processing, setProcessing] = useState(false);
 
   // License information
@@ -67,10 +77,12 @@ export default function TeamDetailsSection({ teamId, onBack }: TeamDetailsSectio
         teamService.getTeamDetails(teamId),
         userManagementService.getUsers(),
       ]);
-      console.log('[TeamDetailsSection] Raw data:', data);
+      console.log("[TeamDetailsSection] Raw data:", data);
       setTeam(data.team);
       setTeamUsers(Array.isArray(data.teamUsers) ? data.teamUsers : []);
-      setAvailableUsers(Array.isArray(data.availableUsers) ? data.availableUsers : []);
+      setAvailableUsers(
+        Array.isArray(data.availableUsers) ? data.availableUsers : [],
+      );
       setUserLastRequest(data.userLastRequest || {});
 
       // Store license information
@@ -80,8 +92,11 @@ export default function TeamDetailsSection({ teamId, onBack }: TeamDetailsSectio
       setMailEnabled(adminData.mailEnabled);
       setLockedUsers(adminData.lockedUsers || []);
     } catch (error) {
-      console.error('Failed to fetch team details:', error);
-      alert({ alertType: 'error', title: t('workspace.teams.loadError', 'Failed to load team details') });
+      console.error("Failed to fetch team details:", error);
+      alert({
+        alertType: "error",
+        title: t("workspace.teams.loadError", "Failed to load team details"),
+      });
       onBack();
     } finally {
       setLoading(false);
@@ -93,67 +108,109 @@ export default function TeamDetailsSection({ teamId, onBack }: TeamDetailsSectio
       const teams = await teamService.getTeams();
       setAllTeams(teams);
     } catch (error) {
-      console.error('Failed to fetch teams:', error);
+      console.error("Failed to fetch teams:", error);
     }
   };
 
   const handleAddMember = async () => {
     if (!selectedUserId) {
-      alert({ alertType: 'error', title: t('workspace.teams.addMemberToTeam.selectUserRequired', 'Please select a user') });
+      alert({
+        alertType: "error",
+        title: t(
+          "workspace.teams.addMemberToTeam.selectUserRequired",
+          "Please select a user",
+        ),
+      });
       return;
     }
 
     try {
       setProcessing(true);
       await teamService.addUserToTeam(teamId, parseInt(selectedUserId));
-      alert({ alertType: 'success', title: t('workspace.teams.addMemberToTeam.success', 'User added to team successfully') });
+      alert({
+        alertType: "success",
+        title: t(
+          "workspace.teams.addMemberToTeam.success",
+          "User added to team successfully",
+        ),
+      });
       setAddMemberModalOpened(false);
-      setSelectedUserId('');
+      setSelectedUserId("");
       fetchTeamDetails();
-    } catch (error: any) {
-      console.error('Failed to add member:', error);
-      const errorMessage = error.response?.data?.message ||
-                          error.response?.data?.error ||
-                          error.message ||
-                          t('workspace.teams.addMemberToTeam.error', 'Failed to add user to team');
-      alert({ alertType: 'error', title: errorMessage });
+    } catch (error: unknown) {
+      console.error("Failed to add member:", error);
+      const errorMessage = isAxiosError(error)
+        ? error.response?.data?.message ||
+          error.response?.data?.error ||
+          error.message
+        : (error instanceof Error ? error.message : undefined) ||
+          t(
+            "workspace.teams.addMemberToTeam.error",
+            "Failed to add user to team",
+          );
+      alert({ alertType: "error", title: errorMessage });
     } finally {
       setProcessing(false);
     }
   };
 
   const handleRemoveMember = async (user: User) => {
-    if (!window.confirm(t('workspace.teams.confirmRemove', `Remove ${user.username} from this team?`))) {
+    if (
+      !window.confirm(
+        t(
+          "workspace.teams.confirmRemove",
+          `Remove ${user.username} from this team?`,
+        ),
+      )
+    ) {
       return;
     }
 
     try {
       setProcessing(true);
       // Find the Default team ID
-      const defaultTeam = allTeams.find(t => t.name === 'Default');
+      const defaultTeam = allTeams.find((t) => t.name === "Default");
 
       if (!defaultTeam) {
-        throw new Error('Default team not found');
+        throw new Error("Default team not found");
       }
 
       // Move user to Default team by updating their role with the Default team ID
-      await teamService.moveUserToTeam(user.username, user.rolesAsString || 'ROLE_USER', defaultTeam.id);
-      alert({ alertType: 'success', title: t('workspace.teams.removeMemberSuccess', 'User removed from team') });
+      await teamService.moveUserToTeam(
+        user.username,
+        user.rolesAsString || "ROLE_USER",
+        defaultTeam.id,
+      );
+      alert({
+        alertType: "success",
+        title: t(
+          "workspace.teams.removeMemberSuccess",
+          "User removed from team",
+        ),
+      });
       fetchTeamDetails();
-    } catch (error: any) {
-      console.error('Failed to remove member:', error);
-      const errorMessage = error.response?.data?.message ||
-                          error.response?.data?.error ||
-                          error.message ||
-                          t('workspace.teams.removeMemberError', 'Failed to remove user from team');
-      alert({ alertType: 'error', title: errorMessage });
+    } catch (error: unknown) {
+      console.error("Failed to remove member:", error);
+      const errorMessage = isAxiosError(error)
+        ? error.response?.data?.message ||
+          error.response?.data?.error ||
+          error.message
+        : (error instanceof Error ? error.message : undefined) ||
+          t(
+            "workspace.teams.removeMemberError",
+            "Failed to remove user from team",
+          );
+      alert({ alertType: "error", title: errorMessage });
     } finally {
       setProcessing(false);
     }
   };
 
   const handleDeleteUser = async (user: User) => {
-    const confirmMessage = t('workspace.people.confirmDelete', 'Are you sure you want to delete this user? This action cannot be undone.');
+    const confirmMessage = t(
+      "workspace.people.confirmDelete",
+      "Are you sure you want to delete this user? This action cannot be undone.",
+    );
     if (!window.confirm(`${confirmMessage}\n\nUser: ${user.username}`)) {
       return;
     }
@@ -161,43 +218,65 @@ export default function TeamDetailsSection({ teamId, onBack }: TeamDetailsSectio
     try {
       setProcessing(true);
       await userManagementService.deleteUser(user.username);
-      alert({ alertType: 'success', title: t('workspace.people.deleteUserSuccess', 'User deleted successfully') });
+      alert({
+        alertType: "success",
+        title: t(
+          "workspace.people.deleteUserSuccess",
+          "User deleted successfully",
+        ),
+      });
       fetchTeamDetails();
-    } catch (error: any) {
-      console.error('Failed to delete user:', error);
-      const errorMessage = error.response?.data?.message ||
-                          error.response?.data?.error ||
-                          error.message ||
-                          t('workspace.people.deleteUserError', 'Failed to delete user');
-      alert({ alertType: 'error', title: errorMessage });
+    } catch (error: unknown) {
+      console.error("Failed to delete user:", error);
+      const errorMessage = isAxiosError(error)
+        ? error.response?.data?.message ||
+          error.response?.data?.error ||
+          error.message
+        : (error instanceof Error ? error.message : undefined) ||
+          t("workspace.people.deleteUserError", "Failed to delete user");
+      alert({ alertType: "error", title: errorMessage });
     } finally {
       setProcessing(false);
     }
   };
 
   const handleUnlockUser = async (user: User) => {
-    const confirmMessage = t('workspace.people.confirmUnlock', 'Are you sure you want to unlock this user account?');
+    const confirmMessage = t(
+      "workspace.people.confirmUnlock",
+      "Are you sure you want to unlock this user account?",
+    );
     if (!window.confirm(`${confirmMessage}\n\nUser: ${user.username}`)) {
       return;
     }
 
     try {
       await userManagementService.unlockUser(user.username);
-      alert({ alertType: 'success', title: t('workspace.people.unlockUserSuccess', 'User account unlocked successfully') });
+      alert({
+        alertType: "success",
+        title: t(
+          "workspace.people.unlockUserSuccess",
+          "User account unlocked successfully",
+        ),
+      });
       fetchTeamDetails();
-    } catch (error: any) {
-      console.error('[TeamDetailsSection] Failed to unlock user:', error);
-      const errorMessage = error.response?.data?.message ||
-                          error.response?.data?.error ||
-                          error.message ||
-                          t('workspace.people.unlockUserError', 'Failed to unlock user account');
-      alert({ alertType: 'error', title: errorMessage });
+    } catch (error: unknown) {
+      console.error("[TeamDetailsSection] Failed to unlock user:", error);
+      const errorMessage = isAxiosError(error)
+        ? error.response?.data?.message ||
+          error.response?.data?.error ||
+          error.message
+        : (error instanceof Error ? error.message : undefined) ||
+          t(
+            "workspace.people.unlockUserError",
+            "Failed to unlock user account",
+          );
+      alert({ alertType: "error", title: errorMessage });
     }
   };
 
   const openChangeTeamModal = (user: User) => {
     setSelectedUser(user);
-    setSelectedTeamId(user.team?.id?.toString() || '');
+    setSelectedTeamId(user.team?.id?.toString() || "");
     setChangeTeamModalOpened(true);
   };
 
@@ -213,25 +292,43 @@ export default function TeamDetailsSection({ teamId, onBack }: TeamDetailsSectio
 
   const handleChangeTeam = async () => {
     if (!selectedUser || !selectedTeamId) {
-      alert({ alertType: 'error', title: t('workspace.teams.changeTeam.selectTeamRequired', 'Please select a team') });
+      alert({
+        alertType: "error",
+        title: t(
+          "workspace.teams.changeTeam.selectTeamRequired",
+          "Please select a team",
+        ),
+      });
       return;
     }
 
     try {
       setProcessing(true);
-      await teamService.moveUserToTeam(selectedUser.username, selectedUser.rolesAsString || 'ROLE_USER', parseInt(selectedTeamId));
-      alert({ alertType: 'success', title: t('workspace.teams.changeTeam.success', 'Team changed successfully') });
+      await teamService.moveUserToTeam(
+        selectedUser.username,
+        selectedUser.rolesAsString || "ROLE_USER",
+        parseInt(selectedTeamId),
+      );
+      alert({
+        alertType: "success",
+        title: t(
+          "workspace.teams.changeTeam.success",
+          "Team changed successfully",
+        ),
+      });
       setChangeTeamModalOpened(false);
       setSelectedUser(null);
-      setSelectedTeamId('');
+      setSelectedTeamId("");
       fetchTeamDetails();
-    } catch (error: any) {
-      console.error('Failed to change team:', error);
-      const errorMessage = error.response?.data?.message ||
-                          error.response?.data?.error ||
-                          error.message ||
-                          t('workspace.teams.changeTeam.error', 'Failed to change team');
-      alert({ alertType: 'error', title: errorMessage });
+    } catch (error: unknown) {
+      console.error("Failed to change team:", error);
+      const errorMessage = isAxiosError(error)
+        ? error.response?.data?.message ||
+          error.response?.data?.error ||
+          error.message
+        : (error instanceof Error ? error.message : undefined) ||
+          t("workspace.teams.changeTeam.error", "Failed to change team");
+      alert({ alertType: "error", title: errorMessage });
     } finally {
       setProcessing(false);
     }
@@ -242,7 +339,7 @@ export default function TeamDetailsSection({ teamId, onBack }: TeamDetailsSectio
       <Stack align="center" py="xl">
         <Loader size="sm" />
         <Text size="sm" c="dimmed">
-          {t('workspace.teams.loadingDetails', 'Loading team details...')}
+          {t("workspace.teams.loadingDetails", "Loading team details...")}
         </Text>
       </Stack>
     );
@@ -252,10 +349,10 @@ export default function TeamDetailsSection({ teamId, onBack }: TeamDetailsSectio
     return (
       <Stack align="center" py="xl">
         <Text size="sm" c="red">
-          {t('workspace.teams.teamNotFound', 'Team not found')}
+          {t("workspace.teams.teamNotFound", "Team not found")}
         </Text>
         <Button variant="light" onClick={onBack}>
-          {t('workspace.teams.backToTeams', 'Back to Teams')}
+          {t("workspace.teams.backToTeams", "Back to Teams")}
         </Button>
       </Stack>
     );
@@ -273,7 +370,8 @@ export default function TeamDetailsSection({ teamId, onBack }: TeamDetailsSectio
             {team.name}
           </Text>
           <Text size="sm" c="dimmed">
-            {t('workspace.teams.memberCount', { count: teamUsers.length })} {teamUsers.length === 1 ? 'member' : 'members'}
+            {t("workspace.teams.memberCount", { count: teamUsers.length })}{" "}
+            {teamUsers.length === 1 ? "member" : "members"}
           </Text>
         </div>
       </Group>
@@ -281,18 +379,26 @@ export default function TeamDetailsSection({ teamId, onBack }: TeamDetailsSectio
       {/* Add Member Button */}
       <Group justify="flex-end">
         <Tooltip
-          label={t('workspace.people.license.noSlotsAvailable', 'No user slots available')}
+          label={t(
+            "workspace.people.license.noSlotsAvailable",
+            "No user slots available",
+          )}
           disabled={!licenseInfo || licenseInfo.availableSlots > 0}
           position="bottom"
           withArrow
           zIndex={Z_INDEX_OVER_CONFIG_MODAL}
         >
           <Button
-            leftSection={<LocalIcon icon="person-add" width="1rem" height="1rem" />}
+            leftSection={
+              <LocalIcon icon="person-add" width="1rem" height="1rem" />
+            }
             onClick={() => setAddMemberModalOpened(true)}
-            disabled={team.name === 'Internal' || (licenseInfo ? licenseInfo.availableSlots === 0 : false)}
+            disabled={
+              team.name === "Internal" ||
+              (licenseInfo ? licenseInfo.availableSlots === 0 : false)
+            }
           >
-            {t('workspace.teams.addMember')}
+            {t("workspace.teams.addMember")}
           </Button>
         </Tooltip>
       </Group>
@@ -302,105 +408,133 @@ export default function TeamDetailsSection({ teamId, onBack }: TeamDetailsSectio
         horizontalSpacing="md"
         verticalSpacing="sm"
         withRowBorders
-        style={{
-          '--table-border-color': 'var(--mantine-color-gray-3)',
-        } as React.CSSProperties}
+        style={
+          {
+            "--table-border-color": "var(--mantine-color-gray-3)",
+          } as React.CSSProperties
+        }
       >
         <Table.Thead>
-          <Table.Tr style={{ backgroundColor: 'var(--mantine-color-gray-0)' }}>
-            <Table.Th style={{ fontWeight: 600, color: 'var(--mantine-color-gray-7)' }} fz="sm">
-              {t('workspace.people.user')}
+          <Table.Tr style={{ backgroundColor: "var(--mantine-color-gray-0)" }}>
+            <Table.Th
+              style={{ fontWeight: 600, color: "var(--mantine-color-gray-7)" }}
+              fz="sm"
+            >
+              {t("workspace.people.user")}
             </Table.Th>
-            <Table.Th style={{ fontWeight: 600, color: 'var(--mantine-color-gray-7)' }} fz="sm" w={100}>
-              {t('workspace.people.role')}
+            <Table.Th
+              style={{ fontWeight: 600, color: "var(--mantine-color-gray-7)" }}
+              fz="sm"
+              w={100}
+            >
+              {t("workspace.people.role")}
             </Table.Th>
             <Table.Th w={50}></Table.Th>
           </Table.Tr>
         </Table.Thead>
-          <Table.Tbody>
-            {teamUsers.length === 0 ? (
-              <Table.Tr>
-                <Table.Td colSpan={3}>
-                  <Text ta="center" c="dimmed" py="xl">
-                    {t('workspace.teams.noMembers', 'No members in this team')}
-                  </Text>
-                </Table.Td>
-              </Table.Tr>
-            ) : (
-              teamUsers.map((user) => {
-                const isActive = userLastRequest[user.username] &&
-                  (Date.now() - userLastRequest[user.username]) < 5 * 60 * 1000; // Active within last 5 minutes
+        <Table.Tbody>
+          {teamUsers.length === 0 ? (
+            <Table.Tr>
+              <Table.Td colSpan={3}>
+                <Text ta="center" c="dimmed" py="xl">
+                  {t("workspace.teams.noMembers", "No members in this team")}
+                </Text>
+              </Table.Td>
+            </Table.Tr>
+          ) : (
+            teamUsers.map((user) => {
+              const isActive =
+                userLastRequest[user.username] &&
+                Date.now() - userLastRequest[user.username] < 5 * 60 * 1000; // Active within last 5 minutes
 
-                return (
-                  <Table.Tr key={user.id}>
-                    <Table.Td>
-                      <Group gap="xs" wrap="nowrap">
-                        <Tooltip
-                          label={
-                            !user.enabled
-                              ? t('workspace.people.disabled', 'Disabled')
-                              : isActive
-                                ? t('workspace.people.activeSession', 'Active session')
-                                : t('workspace.people.active', 'Active')
-                          }
-                          zIndex={Z_INDEX_OVER_CONFIG_MODAL}
-                        >
-                          <Avatar
-                            size={32}
-                            color={user.enabled ? 'blue' : 'gray'}
-                            styles={{
-                              root: {
-                                border: isActive ? '2px solid var(--mantine-color-green-6)' : 'none',
-                                opacity: user.enabled ? 1 : 0.5,
-                              }
-                            }}
-                          >
-                            {user.username.charAt(0).toUpperCase()}
-                          </Avatar>
-                        </Tooltip>
-                        <Box style={{ minWidth: 0, flex: 1 }}>
-                          <Group gap={6} wrap="nowrap" align="center">
-                            <Tooltip label={user.username} disabled={user.username.length <= 20} zIndex={Z_INDEX_OVER_CONFIG_MODAL}>
-                              <Text
-                                size="sm"
-                                fw={500}
-                                maw={200}
-                                style={{
-                                  lineHeight: 1.3,
-                                  opacity: user.enabled ? 1 : 0.6,
-                                  overflow: 'hidden',
-                                  textOverflow: 'ellipsis',
-                                  whiteSpace: 'nowrap',
-                                }}
-                              >
-                                {user.username}
-                              </Text>
-                            </Tooltip>
-                            {isLockedUser(user) && (
-                              <Badge color="orange" variant="light" size="xs">
-                                {t('workspace.people.lockedBadge', 'Locked')}
-                              </Badge>
-                            )}
-                          </Group>
-                          {user.email && (
-                            <Text size="xs" c="dimmed" truncate style={{ lineHeight: 1.3 }}>
-                              {user.email}
-                            </Text>
-                          )}
-                        </Box>
-                      </Group>
-                    </Table.Td>
-                    <Table.Td w={100}>
-                      <Badge
-                        size="sm"
-                        color={(user.rolesAsString || '').includes('ROLE_ADMIN') ? 'blue' : 'cyan'}
-                        variant="light"
+              return (
+                <Table.Tr key={user.id}>
+                  <Table.Td>
+                    <Group gap="xs" wrap="nowrap">
+                      <Tooltip
+                        label={
+                          !user.enabled
+                            ? t("workspace.people.disabled", "Disabled")
+                            : isActive
+                              ? t(
+                                  "workspace.people.activeSession",
+                                  "Active session",
+                                )
+                              : t("workspace.people.active", "Active")
+                        }
+                        zIndex={Z_INDEX_OVER_CONFIG_MODAL}
                       >
-                        {(user.rolesAsString || '').includes('ROLE_ADMIN')
-                          ? t('workspace.people.admin')
-                          : t('workspace.people.member')}
-                      </Badge>
-                    </Table.Td>
+                        <Avatar
+                          size={32}
+                          color={user.enabled ? "blue" : "gray"}
+                          styles={{
+                            root: {
+                              border: isActive
+                                ? "2px solid var(--mantine-color-green-6)"
+                                : "none",
+                              opacity: user.enabled ? 1 : 0.5,
+                            },
+                          }}
+                        >
+                          {user.username.charAt(0).toUpperCase()}
+                        </Avatar>
+                      </Tooltip>
+                      <Box style={{ minWidth: 0, flex: 1 }}>
+                        <Group gap={6} wrap="nowrap" align="center">
+                          <Tooltip
+                            label={user.username}
+                            disabled={user.username.length <= 20}
+                            zIndex={Z_INDEX_OVER_CONFIG_MODAL}
+                          >
+                            <Text
+                              size="sm"
+                              fw={500}
+                              maw={200}
+                              style={{
+                                lineHeight: 1.3,
+                                opacity: user.enabled ? 1 : 0.6,
+                                overflow: "hidden",
+                                textOverflow: "ellipsis",
+                                whiteSpace: "nowrap",
+                              }}
+                            >
+                              {user.username}
+                            </Text>
+                          </Tooltip>
+                          {isLockedUser(user) && (
+                            <Badge color="orange" variant="light" size="xs">
+                              {t("workspace.people.lockedBadge", "Locked")}
+                            </Badge>
+                          )}
+                        </Group>
+                        {user.email && (
+                          <Text
+                            size="xs"
+                            c="dimmed"
+                            truncate
+                            style={{ lineHeight: 1.3 }}
+                          >
+                            {user.email}
+                          </Text>
+                        )}
+                      </Box>
+                    </Group>
+                  </Table.Td>
+                  <Table.Td w={100}>
+                    <Badge
+                      size="sm"
+                      color={
+                        (user.rolesAsString || "").includes("ROLE_ADMIN")
+                          ? "blue"
+                          : "cyan"
+                      }
+                      variant="light"
+                    >
+                      {(user.rolesAsString || "").includes("ROLE_ADMIN")
+                        ? t("workspace.people.admin")
+                        : t("workspace.people.member")}
+                    </Badge>
+                  </Table.Td>
                   <Table.Td>
                     <Group gap="xs" wrap="nowrap">
                       {/* Info icon with tooltip */}
@@ -408,13 +542,16 @@ export default function TeamDetailsSection({ teamId, onBack }: TeamDetailsSectio
                         label={
                           <div>
                             <Text size="xs" fw={500}>
-                              Authentication: {user.authenticationType || 'Unknown'}
+                              Authentication:{" "}
+                              {user.authenticationType || "Unknown"}
                             </Text>
                             <Text size="xs">
-                              Last Activity:{' '}
+                              Last Activity:{" "}
                               {userLastRequest[user.username]
-                                ? new Date(userLastRequest[user.username]).toLocaleString()
-                                : 'Never'}
+                                ? new Date(
+                                    userLastRequest[user.username],
+                                  ).toLocaleString()
+                                : "Never"}
                             </Text>
                           </div>
                         }
@@ -433,60 +570,109 @@ export default function TeamDetailsSection({ teamId, onBack }: TeamDetailsSectio
                       <Menu position="bottom-end" withinPortal>
                         <Menu.Target>
                           <ActionIcon variant="subtle" color="gray">
-                            <LocalIcon icon="more-vert" width="1rem" height="1rem" />
+                            <LocalIcon
+                              icon="more-vert"
+                              width="1rem"
+                              height="1rem"
+                            />
                           </ActionIcon>
                         </Menu.Target>
-                        <Menu.Dropdown style={{ zIndex: Z_INDEX_OVER_CONFIG_MODAL }}>
+                        <Menu.Dropdown
+                          style={{ zIndex: Z_INDEX_OVER_CONFIG_MODAL }}
+                        >
                           <Menu.Item
-                            leftSection={<LocalIcon icon="swap-horiz" width="1rem" height="1rem" />}
+                            leftSection={
+                              <LocalIcon
+                                icon="swap-horiz"
+                                width="1rem"
+                                height="1rem"
+                              />
+                            }
                             onClick={() => openChangeTeamModal(user)}
-                            disabled={processing || team.name === 'Internal'}
+                            disabled={processing || team.name === "Internal"}
                           >
-                            {t('workspace.teams.changeTeam.label', 'Change Team')}
+                            {t(
+                              "workspace.teams.changeTeam.label",
+                              "Change Team",
+                            )}
                           </Menu.Item>
                           <Menu.Item
-                            leftSection={<LocalIcon icon="lock" width="1rem" height="1rem" />}
+                            leftSection={
+                              <LocalIcon
+                                icon="lock"
+                                width="1rem"
+                                height="1rem"
+                              />
+                            }
                             onClick={() => openChangePasswordModal(user)}
                             disabled={processing}
                           >
-                            {t('workspace.people.changePassword.action', 'Change password')}
+                            {t(
+                              "workspace.people.changePassword.action",
+                              "Change password",
+                            )}
                           </Menu.Item>
                           {isLockedUser(user) && (
                             <Menu.Item
-                              leftSection={<LocalIcon icon="lock-open" width="1rem" height="1rem" />}
+                              leftSection={
+                                <LocalIcon
+                                  icon="lock-open"
+                                  width="1rem"
+                                  height="1rem"
+                                />
+                              }
                               onClick={() => handleUnlockUser(user)}
                               disabled={processing}
                             >
-                              {t('workspace.people.unlockAccount', 'Unlock Account')}
-                            </Menu.Item>
-                          )}
-                          {team.name !== 'Internal' && team.name !== 'Default' && (
-                            <Menu.Item
-                              leftSection={<LocalIcon icon="person-remove" width="1rem" height="1rem" />}
-                              onClick={() => handleRemoveMember(user)}
-                              disabled={processing}
-                            >
-                              {t('workspace.teams.removeMember', 'Remove from team')}
+                              {t(
+                                "workspace.people.unlockAccount",
+                                "Unlock Account",
+                              )}
                             </Menu.Item>
                           )}
+                          {team.name !== "Internal" &&
+                            team.name !== "Default" && (
+                              <Menu.Item
+                                leftSection={
+                                  <LocalIcon
+                                    icon="person-remove"
+                                    width="1rem"
+                                    height="1rem"
+                                  />
+                                }
+                                onClick={() => handleRemoveMember(user)}
+                                disabled={processing}
+                              >
+                                {t(
+                                  "workspace.teams.removeMember",
+                                  "Remove from team",
+                                )}
+                              </Menu.Item>
+                            )}
                           <Menu.Divider />
                           <Menu.Item
                             color="red"
-                            leftSection={<LocalIcon icon="delete" width="1rem" height="1rem" />}
+                            leftSection={
+                              <LocalIcon
+                                icon="delete"
+                                width="1rem"
+                                height="1rem"
+                              />
+                            }
                             onClick={() => handleDeleteUser(user)}
-                            disabled={processing || team.name === 'Internal'}
+                            disabled={processing || team.name === "Internal"}
                           >
-                            {t('workspace.people.deleteUser', 'Delete User')}
+                            {t("workspace.people.deleteUser", "Delete User")}
                           </Menu.Item>
                         </Menu.Dropdown>
                       </Menu>
                     </Group>
                   </Table.Td>
                 </Table.Tr>
-                );
-              })
-            )}
-          </Table.Tbody>
+              );
+            })
+          )}
+        </Table.Tbody>
       </Table>
 
       <ChangeUserPasswordModal
@@ -507,12 +693,12 @@ export default function TeamDetailsSection({ teamId, onBack }: TeamDetailsSectio
         padding="xl"
         withCloseButton={false}
       >
-        <div style={{ position: 'relative' }}>
+        <div style={{ position: "relative" }}>
           <CloseButton
             onClick={() => setAddMemberModalOpened(false)}
             size="lg"
             style={{
-              position: 'absolute',
+              position: "absolute",
               top: -8,
               right: -8,
               zIndex: 1,
@@ -521,36 +707,55 @@ export default function TeamDetailsSection({ teamId, onBack }: TeamDetailsSectio
           <Stack gap="lg" pt="md">
             {/* Header with Icon */}
             <Stack gap="md" align="center">
-              <LocalIcon icon="person-add" width="3rem" height="3rem" style={{ color: 'var(--mantine-color-gray-6)' }} />
+              <LocalIcon
+                icon="person-add"
+                width="3rem"
+                height="3rem"
+                style={{ color: "var(--mantine-color-gray-6)" }}
+              />
               <Text size="xl" fw={600} ta="center">
-                {t('workspace.teams.addMemberToTeam.title')}
+                {t("workspace.teams.addMemberToTeam.title")}
               </Text>
               <Text size="sm" c="dimmed" ta="center">
-                {t('workspace.teams.addMemberToTeam.addingTo')} <strong>{team.name}</strong>
+                {t("workspace.teams.addMemberToTeam.addingTo")}{" "}
+                <strong>{team.name}</strong>
               </Text>
             </Stack>
 
             <Select
-              label={t('workspace.teams.addMemberToTeam.selectUser')}
-              placeholder={t('workspace.teams.addMemberToTeam.selectUserPlaceholder')}
+              label={t("workspace.teams.addMemberToTeam.selectUser")}
+              placeholder={t(
+                "workspace.teams.addMemberToTeam.selectUserPlaceholder",
+              )}
               data={availableUsers.map((user) => ({
                 value: user.id.toString(),
-                label: `${user.username}${user.team ? ` (${t('workspace.teams.addMemberToTeam.currentlyIn')} ${user.team.name})` : ''}`,
+                label: `${user.username}${user.team ? ` (${t("workspace.teams.addMemberToTeam.currentlyIn")} ${user.team.name})` : ""}`,
               }))}
               value={selectedUserId}
-              onChange={(value) => setSelectedUserId(value || '')}
+              onChange={(value) => setSelectedUserId(value || "")}
               searchable
-              comboboxProps={{ withinPortal: true, zIndex: Z_INDEX_OVER_CONFIG_MODAL }}
+              comboboxProps={{
+                withinPortal: true,
+                zIndex: Z_INDEX_OVER_CONFIG_MODAL,
+              }}
             />
 
-            {selectedUserId && availableUsers.find((u) => u.id.toString() === selectedUserId)?.team && (
-              <Text size="xs" c="orange">
-                {t('workspace.teams.addMemberToTeam.willBeMoved')}
-              </Text>
-            )}
+            {selectedUserId &&
+              availableUsers.find((u) => u.id.toString() === selectedUserId)
+                ?.team && (
+                <Text size="xs" c="orange">
+                  {t("workspace.teams.addMemberToTeam.willBeMoved")}
+                </Text>
+              )}
 
-            <Button onClick={handleAddMember} loading={processing} fullWidth size="md" mt="md">
-              {t('workspace.teams.addMemberToTeam.submit')}
+            <Button
+              onClick={handleAddMember}
+              loading={processing}
+              fullWidth
+              size="md"
+              mt="md"
+            >
+              {t("workspace.teams.addMemberToTeam.submit")}
             </Button>
           </Stack>
         </div>
@@ -566,12 +771,12 @@ export default function TeamDetailsSection({ teamId, onBack }: TeamDetailsSectio
         padding="xl"
         withCloseButton={false}
       >
-        <div style={{ position: 'relative' }}>
+        <div style={{ position: "relative" }}>
           <CloseButton
             onClick={() => setChangeTeamModalOpened(false)}
             size="lg"
             style={{
-              position: 'absolute',
+              position: "absolute",
               top: -8,
               right: -8,
               zIndex: 1,
@@ -580,32 +785,50 @@ export default function TeamDetailsSection({ teamId, onBack }: TeamDetailsSectio
           <Stack gap="lg" pt="md">
             {/* Header with Icon */}
             <Stack gap="md" align="center">
-              <LocalIcon icon="swap-horiz" width="3rem" height="3rem" style={{ color: 'var(--mantine-color-gray-6)' }} />
+              <LocalIcon
+                icon="swap-horiz"
+                width="3rem"
+                height="3rem"
+                style={{ color: "var(--mantine-color-gray-6)" }}
+              />
               <Text size="xl" fw={600} ta="center">
-                {t('workspace.teams.changeTeam.title', 'Change Team')}
+                {t("workspace.teams.changeTeam.title", "Change Team")}
               </Text>
               <Text size="sm" c="dimmed" ta="center">
-                {t('workspace.teams.changeTeam.changing', 'Moving')} <strong>{selectedUser?.username}</strong>
+                {t("workspace.teams.changeTeam.changing", "Moving")}{" "}
+                <strong>{selectedUser?.username}</strong>
               </Text>
             </Stack>
 
             <Select
-              label={t('workspace.teams.changeTeam.selectTeam', 'Select Team')}
-              placeholder={t('workspace.teams.changeTeam.selectTeamPlaceholder', 'Choose a team')}
+              label={t("workspace.teams.changeTeam.selectTeam", "Select Team")}
+              placeholder={t(
+                "workspace.teams.changeTeam.selectTeamPlaceholder",
+                "Choose a team",
+              )}
               data={allTeams
-                .filter((t) => t.name !== 'Internal')
+                .filter((t) => t.name !== "Internal")
                 .map((team) => ({
                   value: team.id.toString(),
                   label: team.name,
                 }))}
               value={selectedTeamId}
-              onChange={(value) => setSelectedTeamId(value || '')}
+              onChange={(value) => setSelectedTeamId(value || "")}
               searchable
-              comboboxProps={{ withinPortal: true, zIndex: Z_INDEX_OVER_CONFIG_MODAL }}
+              comboboxProps={{
+                withinPortal: true,
+                zIndex: Z_INDEX_OVER_CONFIG_MODAL,
+              }}
             />
 
-            <Button onClick={handleChangeTeam} loading={processing} fullWidth size="md" mt="md">
-              {t('workspace.teams.changeTeam.submit', 'Change Team')}
+            <Button
+              onClick={handleChangeTeam}
+              loading={processing}
+              fullWidth
+              size="md"
+              mt="md"
+            >
+              {t("workspace.teams.changeTeam.submit", "Change Team")}
             </Button>
           </Stack>
         </div>
diff --git a/frontend/src/proprietary/components/shared/config/configSections/TeamsSection.tsx b/frontend/src/proprietary/components/shared/config/configSections/TeamsSection.tsx
index b2b9b986ae..9904e32755 100644
--- a/frontend/src/proprietary/components/shared/config/configSections/TeamsSection.tsx
+++ b/frontend/src/proprietary/components/shared/config/configSections/TeamsSection.tsx
@@ -1,5 +1,6 @@
-import { useState, useEffect } from 'react';
-import { useTranslation } from 'react-i18next';
+import { useState, useEffect } from "react";
+import { isAxiosError } from "axios";
+import { useTranslation } from "react-i18next";
 import {
   Stack,
   Text,
@@ -15,15 +16,18 @@ import {
   Select,
   CloseButton,
   Tooltip,
-} from '@mantine/core';
-import LocalIcon from '@app/components/shared/LocalIcon';
-import { alert } from '@app/components/toast';
-import { teamService, Team } from '@app/services/teamService';
-import { userManagementService, User } from '@app/services/userManagementService';
-import { Z_INDEX_OVER_CONFIG_MODAL } from '@app/styles/zIndex';
-import TeamDetailsSection from '@app/components/shared/config/configSections/TeamDetailsSection';
-import { useLoginRequired } from '@app/hooks/useLoginRequired';
-import LoginRequiredBanner from '@app/components/shared/config/LoginRequiredBanner';
+} from "@mantine/core";
+import LocalIcon from "@app/components/shared/LocalIcon";
+import { alert } from "@app/components/toast";
+import { teamService, Team } from "@app/services/teamService";
+import {
+  userManagementService,
+  User,
+} from "@app/services/userManagementService";
+import { Z_INDEX_OVER_CONFIG_MODAL } from "@app/styles/zIndex";
+import TeamDetailsSection from "@app/components/shared/config/configSections/TeamDetailsSection";
+import { useLoginRequired } from "@app/hooks/useLoginRequired";
+import LoginRequiredBanner from "@app/components/shared/config/LoginRequiredBanner";
 
 export default function TeamsSection() {
   const { t } = useTranslation();
@@ -39,9 +43,9 @@ export default function TeamsSection() {
   const [viewingTeamId, setViewingTeamId] = useState<number | null>(null);
 
   // Form states
-  const [newTeamName, setNewTeamName] = useState('');
-  const [renameTeamName, setRenameTeamName] = useState('');
-  const [selectedUserId, setSelectedUserId] = useState<string>('');
+  const [newTeamName, setNewTeamName] = useState("");
+  const [renameTeamName, setRenameTeamName] = useState("");
+  const [selectedUserId, setSelectedUserId] = useState<string>("");
 
   useEffect(() => {
     fetchTeams();
@@ -56,15 +60,15 @@ export default function TeamsSection() {
       } else {
         // Provide example data when login is disabled
         const exampleTeams: Team[] = [
-          { id: 1, name: 'Engineering', userCount: 3 },
-          { id: 2, name: 'Marketing', userCount: 2 },
-          { id: 3, name: 'Internal', userCount: 1 },
+          { id: 1, name: "Engineering", userCount: 3 },
+          { id: 2, name: "Marketing", userCount: 2 },
+          { id: 3, name: "Internal", userCount: 1 },
         ];
         setTeams(exampleTeams);
       }
     } catch (error) {
-      console.error('Failed to fetch teams:', error);
-      alert({ alertType: 'error', title: 'Failed to load teams' });
+      console.error("Failed to fetch teams:", error);
+      alert({ alertType: "error", title: "Failed to load teams" });
     } finally {
       setLoading(false);
     }
@@ -72,24 +76,32 @@ export default function TeamsSection() {
 
   const handleCreateTeam = async () => {
     if (!newTeamName.trim()) {
-      alert({ alertType: 'error', title: t('workspace.teams.createTeam.nameRequired') });
+      alert({
+        alertType: "error",
+        title: t("workspace.teams.createTeam.nameRequired"),
+      });
       return;
     }
 
     try {
       setProcessing(true);
       await teamService.createTeam(newTeamName);
-      alert({ alertType: 'success', title: t('workspace.teams.createTeam.success') });
-      setNewTeamName('');
+      alert({
+        alertType: "success",
+        title: t("workspace.teams.createTeam.success"),
+      });
+      setNewTeamName("");
       setCreateModalOpened(false);
       await fetchTeams();
-    } catch (error: any) {
-      console.error('Failed to create team:', error);
-      const errorMessage = error.response?.data?.message ||
-                          error.response?.data?.error ||
-                          error.message ||
-                          t('workspace.teams.createTeam.error');
-      alert({ alertType: 'error', title: errorMessage });
+    } catch (error: unknown) {
+      console.error("Failed to create team:", error);
+      const errorMessage = isAxiosError(error)
+        ? error.response?.data?.message ||
+          error.response?.data?.error ||
+          error.message
+        : (error instanceof Error ? error.message : undefined) ||
+          t("workspace.teams.createTeam.error");
+      alert({ alertType: "error", title: errorMessage });
     } finally {
       setProcessing(false);
     }
@@ -97,57 +109,76 @@ export default function TeamsSection() {
 
   const handleRenameTeam = async () => {
     if (!selectedTeam || !renameTeamName.trim()) {
-      alert({ alertType: 'error', title: t('workspace.teams.renameTeam.nameRequired') });
+      alert({
+        alertType: "error",
+        title: t("workspace.teams.renameTeam.nameRequired"),
+      });
       return;
     }
 
     try {
       setProcessing(true);
       await teamService.renameTeam(selectedTeam.id, renameTeamName);
-      alert({ alertType: 'success', title: t('workspace.teams.renameTeam.success') });
-      setRenameTeamName('');
+      alert({
+        alertType: "success",
+        title: t("workspace.teams.renameTeam.success"),
+      });
+      setRenameTeamName("");
       setSelectedTeam(null);
       setRenameModalOpened(false);
       await fetchTeams();
-    } catch (error: any) {
-      console.error('Failed to rename team:', error);
-      const errorMessage = error.response?.data?.message ||
-                          error.response?.data?.error ||
-                          error.message ||
-                          t('workspace.teams.renameTeam.error');
-      alert({ alertType: 'error', title: errorMessage });
+    } catch (error: unknown) {
+      console.error("Failed to rename team:", error);
+      const errorMessage = isAxiosError(error)
+        ? error.response?.data?.message ||
+          error.response?.data?.error ||
+          error.message
+        : (error instanceof Error ? error.message : undefined) ||
+          t("workspace.teams.renameTeam.error");
+      alert({ alertType: "error", title: errorMessage });
     } finally {
       setProcessing(false);
     }
   };
 
   const handleDeleteTeam = async (team: Team) => {
-    if (team.name === 'Internal') {
-      alert({ alertType: 'error', title: t('workspace.teams.cannotDeleteInternal') });
+    if (team.name === "Internal") {
+      alert({
+        alertType: "error",
+        title: t("workspace.teams.cannotDeleteInternal"),
+      });
       return;
     }
 
-    if (!confirm(t('workspace.teams.confirmDelete'))) {
+    if (!confirm(t("workspace.teams.confirmDelete"))) {
       return;
     }
 
     try {
       await teamService.deleteTeam(team.id);
-      alert({ alertType: 'success', title: t('workspace.teams.deleteTeam.success') });
+      alert({
+        alertType: "success",
+        title: t("workspace.teams.deleteTeam.success"),
+      });
       await fetchTeams();
-    } catch (error: any) {
-      console.error('Failed to delete team:', error);
-      const errorMessage = error.response?.data?.message ||
-                          error.response?.data?.error ||
-                          error.message ||
-                          t('workspace.teams.deleteTeam.error');
-      alert({ alertType: 'error', title: errorMessage });
+    } catch (error: unknown) {
+      console.error("Failed to delete team:", error);
+      const errorMessage = isAxiosError(error)
+        ? error.response?.data?.message ||
+          error.response?.data?.error ||
+          error.message
+        : (error instanceof Error ? error.message : undefined) ||
+          t("workspace.teams.deleteTeam.error");
+      alert({ alertType: "error", title: errorMessage });
     }
   };
 
   const openRenameModal = (team: Team) => {
-    if (team.name === 'Internal') {
-      alert({ alertType: 'error', title: t('workspace.teams.cannotRenameInternal') });
+    if (team.name === "Internal") {
+      alert({
+        alertType: "error",
+        title: t("workspace.teams.cannotRenameInternal"),
+      });
       return;
     }
     setSelectedTeam(team);
@@ -156,8 +187,11 @@ export default function TeamsSection() {
   };
 
   const openAddMemberModal = async (team: Team) => {
-    if (team.name === 'Internal') {
-      alert({ alertType: 'error', title: t('workspace.teams.cannotAddToInternal') });
+    if (team.name === "Internal") {
+      alert({
+        alertType: "error",
+        title: t("workspace.teams.cannotAddToInternal"),
+      });
       return;
     }
     setSelectedTeam(team);
@@ -167,28 +201,43 @@ export default function TeamsSection() {
       setAvailableUsers(adminData.users);
       setAddMemberModalOpened(true);
     } catch (error) {
-      console.error('Failed to fetch users:', error);
-      alert({ alertType: 'error', title: t('workspace.teams.addMemberToTeam.error') });
+      console.error("Failed to fetch users:", error);
+      alert({
+        alertType: "error",
+        title: t("workspace.teams.addMemberToTeam.error"),
+      });
     }
   };
 
   const handleAddMember = async () => {
     if (!selectedTeam || !selectedUserId) {
-      alert({ alertType: 'error', title: t('workspace.teams.addMemberToTeam.userRequired') });
+      alert({
+        alertType: "error",
+        title: t("workspace.teams.addMemberToTeam.userRequired"),
+      });
       return;
     }
 
     try {
       setProcessing(true);
-      await teamService.addUserToTeam(selectedTeam.id, parseInt(selectedUserId));
-      alert({ alertType: 'success', title: t('workspace.teams.addMemberToTeam.success') });
-      setSelectedUserId('');
+      await teamService.addUserToTeam(
+        selectedTeam.id,
+        parseInt(selectedUserId),
+      );
+      alert({
+        alertType: "success",
+        title: t("workspace.teams.addMemberToTeam.success"),
+      });
+      setSelectedUserId("");
       setSelectedTeam(null);
       setAddMemberModalOpened(false);
       await fetchTeams();
     } catch (error) {
-      console.error('Failed to add member to team:', error);
-      alert({ alertType: 'error', title: t('workspace.teams.addMemberToTeam.error') });
+      console.error("Failed to add member to team:", error);
+      alert({
+        alertType: "error",
+        title: t("workspace.teams.addMemberToTeam.error"),
+      });
     } finally {
       setProcessing(false);
     }
@@ -212,7 +261,7 @@ export default function TeamsSection() {
       <Stack align="center" py="md">
         <Loader size="sm" />
         <Text size="sm" c="dimmed">
-          {t('workspace.teams.loading', 'Loading teams...')}
+          {t("workspace.teams.loading", "Loading teams...")}
         </Text>
       </Stack>
     );
@@ -223,17 +272,21 @@ export default function TeamsSection() {
       <LoginRequiredBanner show={!loginEnabled} />
       <div>
         <Text fw={600} size="lg">
-          {t('workspace.teams.title')}
+          {t("workspace.teams.title")}
         </Text>
         <Text size="sm" c="dimmed">
-          {t('workspace.teams.description')}
+          {t("workspace.teams.description")}
         </Text>
       </div>
 
       {/* Header Actions */}
       <Group justify="flex-end">
-        <Button leftSection={<LocalIcon icon="add" width="1rem" height="1rem" />} onClick={() => setCreateModalOpened(true)} disabled={!loginEnabled}>
-          {t('workspace.teams.createNewTeam')}
+        <Button
+          leftSection={<LocalIcon icon="add" width="1rem" height="1rem" />}
+          onClick={() => setCreateModalOpened(true)}
+          disabled={!loginEnabled}
+        >
+          {t("workspace.teams.createNewTeam")}
         </Button>
       </Group>
 
@@ -243,96 +296,150 @@ export default function TeamsSection() {
         verticalSpacing="sm"
         withRowBorders
         highlightOnHover
-        style={{
-          '--table-border-color': 'var(--mantine-color-gray-3)',
-        } as React.CSSProperties}
+        style={
+          {
+            "--table-border-color": "var(--mantine-color-gray-3)",
+          } as React.CSSProperties
+        }
       >
         <Table.Thead>
-          <Table.Tr style={{ backgroundColor: 'var(--mantine-color-gray-0)' }}>
-            <Table.Th style={{ fontWeight: 600, fontSize: '0.875rem', color: 'var(--mantine-color-gray-7)' }}>
-              {t('workspace.teams.teamName')}
+          <Table.Tr style={{ backgroundColor: "var(--mantine-color-gray-0)" }}>
+            <Table.Th
+              style={{
+                fontWeight: 600,
+                fontSize: "0.875rem",
+                color: "var(--mantine-color-gray-7)",
+              }}
+            >
+              {t("workspace.teams.teamName")}
             </Table.Th>
-            <Table.Th style={{ fontWeight: 600, fontSize: '0.875rem', color: 'var(--mantine-color-gray-7)' }}>
-              {t('workspace.teams.totalMembers')}
+            <Table.Th
+              style={{
+                fontWeight: 600,
+                fontSize: "0.875rem",
+                color: "var(--mantine-color-gray-7)",
+              }}
+            >
+              {t("workspace.teams.totalMembers")}
             </Table.Th>
             <Table.Th style={{ width: 50 }}></Table.Th>
           </Table.Tr>
         </Table.Thead>
-          <Table.Tbody>
-            {teams.length === 0 ? (
-              <Table.Tr>
-                <Table.Td colSpan={3}>
-                  <Text ta="center" c="dimmed" py="xl">
-                    {t('workspace.teams.noTeamsFound')}
+        <Table.Tbody>
+          {teams.length === 0 ? (
+            <Table.Tr>
+              <Table.Td colSpan={3}>
+                <Text ta="center" c="dimmed" py="xl">
+                  {t("workspace.teams.noTeamsFound")}
+                </Text>
+              </Table.Td>
+            </Table.Tr>
+          ) : (
+            teams.map((team) => (
+              <Table.Tr
+                key={team.id}
+                style={{ cursor: loginEnabled ? "pointer" : "default" }}
+                onClick={() => loginEnabled && setViewingTeamId(team.id)}
+              >
+                <Table.Td>
+                  <Group gap="xs">
+                    <Tooltip
+                      label={team.name}
+                      disabled={team.name.length <= 20}
+                      zIndex={Z_INDEX_OVER_CONFIG_MODAL}
+                    >
+                      <Text
+                        size="sm"
+                        fw={500}
+                        maw={200}
+                        style={{
+                          overflow: "hidden",
+                          textOverflow: "ellipsis",
+                          whiteSpace: "nowrap",
+                        }}
+                      >
+                        {team.name}
+                      </Text>
+                    </Tooltip>
+                    {team.name === "Internal" && (
+                      <Badge size="xs" color="gray" variant="light">
+                        {t("workspace.teams.system")}
+                      </Badge>
+                    )}
+                  </Group>
+                </Table.Td>
+                <Table.Td>
+                  <Text size="sm" c="dimmed">
+                    {team.userCount || 0}
                   </Text>
                 </Table.Td>
+                <Table.Td onClick={(e) => e.stopPropagation()}>
+                  <Menu position="bottom-end" withinPortal>
+                    <Menu.Target>
+                      <ActionIcon
+                        variant="subtle"
+                        color="gray"
+                        disabled={!loginEnabled}
+                      >
+                        <LocalIcon
+                          icon="more-vert"
+                          width="1rem"
+                          height="1rem"
+                        />
+                      </ActionIcon>
+                    </Menu.Target>
+                    <Menu.Dropdown
+                      style={{ zIndex: Z_INDEX_OVER_CONFIG_MODAL }}
+                    >
+                      <Menu.Item
+                        leftSection={
+                          <LocalIcon
+                            icon="visibility"
+                            width="1rem"
+                            height="1rem"
+                          />
+                        }
+                        onClick={() => setViewingTeamId(team.id)}
+                        disabled={!loginEnabled}
+                      >
+                        {t("workspace.teams.viewTeam", "View Team")}
+                      </Menu.Item>
+                      <Menu.Item
+                        leftSection={
+                          <LocalIcon icon="group" width="1rem" height="1rem" />
+                        }
+                        onClick={() => openAddMemberModal(team)}
+                        disabled={!loginEnabled}
+                      >
+                        {t("workspace.teams.addMember")}
+                      </Menu.Item>
+                      <Menu.Item
+                        leftSection={
+                          <LocalIcon icon="edit" width="1rem" height="1rem" />
+                        }
+                        onClick={() => openRenameModal(team)}
+                        disabled={!loginEnabled}
+                      >
+                        {t("workspace.teams.renameTeamLabel")}
+                      </Menu.Item>
+                      <Menu.Divider />
+                      <Menu.Item
+                        color="red"
+                        leftSection={
+                          <LocalIcon icon="delete" width="1rem" height="1rem" />
+                        }
+                        onClick={() => handleDeleteTeam(team)}
+                        disabled={!loginEnabled || team.name === "Internal"}
+                      >
+                        {t("workspace.teams.deleteTeamLabel")}
+                      </Menu.Item>
+                    </Menu.Dropdown>
+                  </Menu>
+                </Table.Td>
               </Table.Tr>
-            ) : (
-              teams.map((team) => (
-                <Table.Tr
-                  key={team.id}
-                  style={{ cursor: loginEnabled ? 'pointer' : 'default' }}
-                  onClick={() => loginEnabled && setViewingTeamId(team.id)}
-                >
-                  <Table.Td>
-                    <Group gap="xs">
-                      <Tooltip label={team.name} disabled={team.name.length <= 20} zIndex={Z_INDEX_OVER_CONFIG_MODAL}>
-                        <Text
-                          size="sm"
-                          fw={500}
-                          maw={200}
-                          style={{
-                            overflow: 'hidden',
-                            textOverflow: 'ellipsis',
-                            whiteSpace: 'nowrap',
-                          }}
-                        >
-                          {team.name}
-                        </Text>
-                      </Tooltip>
-                      {team.name === 'Internal' && (
-                        <Badge size="xs" color="gray" variant="light">
-                          {t('workspace.teams.system')}
-                        </Badge>
-                      )}
-                    </Group>
-                  </Table.Td>
-                  <Table.Td>
-                    <Text size="sm" c="dimmed">{team.userCount || 0}</Text>
-                  </Table.Td>
-                  <Table.Td onClick={(e) => e.stopPropagation()}>
-                    <Menu position="bottom-end" withinPortal>
-                      <Menu.Target>
-                        <ActionIcon variant="subtle" color="gray" disabled={!loginEnabled}>
-                          <LocalIcon icon="more-vert" width="1rem" height="1rem" />
-                        </ActionIcon>
-                      </Menu.Target>
-                      <Menu.Dropdown style={{ zIndex: Z_INDEX_OVER_CONFIG_MODAL }}>
-                        <Menu.Item leftSection={<LocalIcon icon="visibility" width="1rem" height="1rem" />} onClick={() => setViewingTeamId(team.id)} disabled={!loginEnabled}>
-                          {t('workspace.teams.viewTeam', 'View Team')}
-                        </Menu.Item>
-                        <Menu.Item leftSection={<LocalIcon icon="group" width="1rem" height="1rem" />} onClick={() => openAddMemberModal(team)} disabled={!loginEnabled}>
-                          {t('workspace.teams.addMember')}
-                        </Menu.Item>
-                        <Menu.Item leftSection={<LocalIcon icon="edit" width="1rem" height="1rem" />} onClick={() => openRenameModal(team)} disabled={!loginEnabled}>
-                          {t('workspace.teams.renameTeamLabel')}
-                        </Menu.Item>
-                        <Menu.Divider />
-                        <Menu.Item
-                          color="red"
-                          leftSection={<LocalIcon icon="delete" width="1rem" height="1rem" />}
-                          onClick={() => handleDeleteTeam(team)}
-                          disabled={!loginEnabled || team.name === 'Internal'}
-                        >
-                          {t('workspace.teams.deleteTeamLabel')}
-                        </Menu.Item>
-                      </Menu.Dropdown>
-                    </Menu>
-                  </Table.Td>
-                </Table.Tr>
-              ))
-            )}
-          </Table.Tbody>
+            ))
+          )}
+        </Table.Tbody>
       </Table>
 
       {/* Create Team Modal */}
@@ -345,36 +452,47 @@ export default function TeamsSection() {
         padding="xl"
         withCloseButton={false}
       >
-        <div style={{ position: 'relative' }}>
+        <div style={{ position: "relative" }}>
           <CloseButton
             onClick={() => setCreateModalOpened(false)}
             size="lg"
             style={{
-              position: 'absolute',
+              position: "absolute",
               top: -8,
               right: -8,
-              zIndex: 1
+              zIndex: 1,
             }}
           />
           <Stack gap="lg" pt="md">
             {/* Header with Icon */}
             <Stack gap="md" align="center">
-              <LocalIcon icon="group-add" width="3rem" height="3rem" style={{ color: 'var(--mantine-color-gray-6)' }} />
+              <LocalIcon
+                icon="group-add"
+                width="3rem"
+                height="3rem"
+                style={{ color: "var(--mantine-color-gray-6)" }}
+              />
               <Text size="xl" fw={600} ta="center">
-                {t('workspace.teams.createTeam.title')}
+                {t("workspace.teams.createTeam.title")}
               </Text>
             </Stack>
 
             <TextInput
-              label={t('workspace.teams.createTeam.teamName')}
-              placeholder={t('workspace.teams.createTeam.teamNamePlaceholder')}
+              label={t("workspace.teams.createTeam.teamName")}
+              placeholder={t("workspace.teams.createTeam.teamNamePlaceholder")}
               value={newTeamName}
               onChange={(e) => setNewTeamName(e.currentTarget.value)}
               required
             />
 
-            <Button onClick={handleCreateTeam} loading={processing} fullWidth size="md" mt="md">
-              {t('workspace.teams.createTeam.submit')}
+            <Button
+              onClick={handleCreateTeam}
+              loading={processing}
+              fullWidth
+              size="md"
+              mt="md"
+            >
+              {t("workspace.teams.createTeam.submit")}
             </Button>
           </Stack>
         </div>
@@ -390,39 +508,53 @@ export default function TeamsSection() {
         padding="xl"
         withCloseButton={false}
       >
-        <div style={{ position: 'relative' }}>
+        <div style={{ position: "relative" }}>
           <CloseButton
             onClick={() => setRenameModalOpened(false)}
             size="lg"
             style={{
-              position: 'absolute',
+              position: "absolute",
               top: -8,
               right: -8,
-              zIndex: 1
+              zIndex: 1,
             }}
           />
           <Stack gap="lg" pt="md">
             {/* Header with Icon */}
             <Stack gap="md" align="center">
-              <LocalIcon icon="edit" width="3rem" height="3rem" style={{ color: 'var(--mantine-color-gray-6)' }} />
+              <LocalIcon
+                icon="edit"
+                width="3rem"
+                height="3rem"
+                style={{ color: "var(--mantine-color-gray-6)" }}
+              />
               <Text size="xl" fw={600} ta="center">
-                {t('workspace.teams.renameTeam.title')}
+                {t("workspace.teams.renameTeam.title")}
               </Text>
               <Text size="sm" c="dimmed" ta="center">
-                {t('workspace.teams.renameTeam.renaming')} <strong>{selectedTeam?.name}</strong>
+                {t("workspace.teams.renameTeam.renaming")}{" "}
+                <strong>{selectedTeam?.name}</strong>
               </Text>
             </Stack>
 
             <TextInput
-              label={t('workspace.teams.renameTeam.newTeamName')}
-              placeholder={t('workspace.teams.renameTeam.newTeamNamePlaceholder')}
+              label={t("workspace.teams.renameTeam.newTeamName")}
+              placeholder={t(
+                "workspace.teams.renameTeam.newTeamNamePlaceholder",
+              )}
               value={renameTeamName}
               onChange={(e) => setRenameTeamName(e.currentTarget.value)}
               required
             />
 
-            <Button onClick={handleRenameTeam} loading={processing} fullWidth size="md" mt="md">
-              {t('workspace.teams.renameTeam.submit')}
+            <Button
+              onClick={handleRenameTeam}
+              loading={processing}
+              fullWidth
+              size="md"
+              mt="md"
+            >
+              {t("workspace.teams.renameTeam.submit")}
             </Button>
           </Stack>
         </div>
@@ -438,50 +570,69 @@ export default function TeamsSection() {
         padding="xl"
         withCloseButton={false}
       >
-        <div style={{ position: 'relative' }}>
+        <div style={{ position: "relative" }}>
           <CloseButton
             onClick={() => setAddMemberModalOpened(false)}
             size="lg"
             style={{
-              position: 'absolute',
+              position: "absolute",
               top: -8,
               right: -8,
-              zIndex: 1
+              zIndex: 1,
             }}
           />
           <Stack gap="lg" pt="md">
             {/* Header with Icon */}
             <Stack gap="md" align="center">
-              <LocalIcon icon="person-add" width="3rem" height="3rem" style={{ color: 'var(--mantine-color-gray-6)' }} />
+              <LocalIcon
+                icon="person-add"
+                width="3rem"
+                height="3rem"
+                style={{ color: "var(--mantine-color-gray-6)" }}
+              />
               <Text size="xl" fw={600} ta="center">
-                {t('workspace.teams.addMemberToTeam.title')}
+                {t("workspace.teams.addMemberToTeam.title")}
               </Text>
               <Text size="sm" c="dimmed" ta="center">
-                {t('workspace.teams.addMemberToTeam.addingTo')} <strong>{selectedTeam?.name}</strong>
+                {t("workspace.teams.addMemberToTeam.addingTo")}{" "}
+                <strong>{selectedTeam?.name}</strong>
               </Text>
             </Stack>
 
             <Select
-              label={t('workspace.teams.addMemberToTeam.selectUser')}
-              placeholder={t('workspace.teams.addMemberToTeam.selectUserPlaceholder')}
+              label={t("workspace.teams.addMemberToTeam.selectUser")}
+              placeholder={t(
+                "workspace.teams.addMemberToTeam.selectUserPlaceholder",
+              )}
               data={availableUsers.map((user) => ({
                 value: user.id.toString(),
-                label: `${user.username}${user.team ? ` (${t('workspace.teams.addMemberToTeam.currentlyIn')} ${user.team.name})` : ''}`,
+                label: `${user.username}${user.team ? ` (${t("workspace.teams.addMemberToTeam.currentlyIn")} ${user.team.name})` : ""}`,
               }))}
               value={selectedUserId}
-              onChange={(value) => setSelectedUserId(value || '')}
+              onChange={(value) => setSelectedUserId(value || "")}
               searchable
-              comboboxProps={{ withinPortal: true, zIndex: Z_INDEX_OVER_CONFIG_MODAL }}
+              comboboxProps={{
+                withinPortal: true,
+                zIndex: Z_INDEX_OVER_CONFIG_MODAL,
+              }}
             />
 
-            {selectedUserId && availableUsers.find((u) => u.id.toString() === selectedUserId)?.team && (
-              <Text size="xs" c="orange">
-                {t('workspace.teams.addMemberToTeam.willBeMoved')}
-              </Text>
-            )}
+            {selectedUserId &&
+              availableUsers.find((u) => u.id.toString() === selectedUserId)
+                ?.team && (
+                <Text size="xs" c="orange">
+                  {t("workspace.teams.addMemberToTeam.willBeMoved")}
+                </Text>
+              )}
 
-            <Button onClick={handleAddMember} loading={processing} fullWidth size="md" mt="md">
-              {t('workspace.teams.addMemberToTeam.submit')}
+            <Button
+              onClick={handleAddMember}
+              loading={processing}
+              fullWidth
+              size="md"
+              mt="md"
+            >
+              {t("workspace.teams.addMemberToTeam.submit")}
             </Button>
           </Stack>
         </div>
diff --git a/frontend/src/proprietary/components/shared/config/configSections/apiKeys/ApiKeySection.tsx b/frontend/src/proprietary/components/shared/config/configSections/apiKeys/ApiKeySection.tsx
index e258dc6dca..8fc8b6cdd4 100644
--- a/frontend/src/proprietary/components/shared/config/configSections/apiKeys/ApiKeySection.tsx
+++ b/frontend/src/proprietary/components/shared/config/configSections/apiKeys/ApiKeySection.tsx
@@ -1,10 +1,5 @@
 import React from "react";
-import {
-  Box,
-  Button,
-  Group,
-  Paper,
-} from "@mantine/core";
+import { Box, Button, Group, Paper } from "@mantine/core";
 import LocalIcon from "@app/components/shared/LocalIcon";
 import FitText from "@app/components/shared/FitText";
 import { useTranslation } from "react-i18next";
@@ -27,7 +22,15 @@ export default function ApiKeySection({
   const { t } = useTranslation();
   return (
     <>
-      <Paper radius="md" p={18} style={{ background: "var(--api-keys-card-bg)", border: "1px solid var(--api-keys-card-border)", boxShadow: "0 2px 8px var(--api-keys-card-shadow)" }}>
+      <Paper
+        radius="md"
+        p={18}
+        style={{
+          background: "var(--api-keys-card-bg)",
+          border: "1px solid var(--api-keys-card-border)",
+          boxShadow: "0 2px 8px var(--api-keys-card-shadow)",
+        }}
+      >
         <Group align="flex-end" wrap="nowrap">
           <Box style={{ flex: 1 }}>
             <Box
@@ -36,13 +39,17 @@ export default function ApiKeySection({
                 border: "1px solid var(--api-keys-input-border)",
                 borderRadius: 8,
                 padding: "8px 12px",
-                fontFamily: 'ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace',
+                fontFamily:
+                  'ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace',
                 fontSize: 14,
                 minHeight: 36,
                 display: "flex",
                 alignItems: "center",
               }}
-              aria-label={t('config.apiKeys.publicKeyAriaLabel', 'Public API key')}
+              aria-label={t(
+                "config.apiKeys.publicKeyAriaLabel",
+                "Public API key",
+              )}
             >
               <FitText text={publicKey} />
             </Box>
@@ -51,22 +58,42 @@ export default function ApiKeySection({
             size="sm"
             variant="light"
             onClick={() => onCopy(publicKey, "public")}
-            leftSection={<LocalIcon icon="content-copy-rounded" width={14} height={14} />}
-            styles={{ root: { background: "var(--api-keys-button-bg)", color: "var(--api-keys-button-color)", border: "none", marginLeft: 12 } }}
-            aria-label={t('config.apiKeys.copyKeyAriaLabel', 'Copy API key')}
+            leftSection={
+              <LocalIcon icon="content-copy-rounded" width={14} height={14} />
+            }
+            styles={{
+              root: {
+                background: "var(--api-keys-button-bg)",
+                color: "var(--api-keys-button-color)",
+                border: "none",
+                marginLeft: 12,
+              },
+            }}
+            aria-label={t("config.apiKeys.copyKeyAriaLabel", "Copy API key")}
           >
-            {copied === "public" ? t('common.copied', 'Copied!') : t('common.copy', 'Copy')}
+            {copied === "public"
+              ? t("common.copied", "Copied!")
+              : t("common.copy", "Copy")}
           </Button>
           <Button
             size="sm"
             variant="light"
             onClick={onRefresh}
-            leftSection={<LocalIcon icon="refresh-rounded" width={14} height={14} />}
-            styles={{ root: { background: "var(--api-keys-button-bg)", color: "var(--api-keys-button-color)", border: "none", marginLeft: 8 } }}
+            leftSection={
+              <LocalIcon icon="refresh-rounded" width={14} height={14} />
+            }
+            styles={{
+              root: {
+                background: "var(--api-keys-button-bg)",
+                color: "var(--api-keys-button-color)",
+                border: "none",
+                marginLeft: 8,
+              },
+            }}
             disabled={disabled}
-            aria-label={t('config.apiKeys.refreshAriaLabel', 'Refresh API key')}
+            aria-label={t("config.apiKeys.refreshAriaLabel", "Refresh API key")}
           >
-            {t('common.refresh', 'Refresh')}
+            {t("common.refresh", "Refresh")}
           </Button>
         </Group>
       </Paper>
diff --git a/frontend/src/proprietary/components/shared/config/configSections/apiKeys/RefreshModal.tsx b/frontend/src/proprietary/components/shared/config/configSections/apiKeys/RefreshModal.tsx
index faa6e60b49..ea3539d95a 100644
--- a/frontend/src/proprietary/components/shared/config/configSections/apiKeys/RefreshModal.tsx
+++ b/frontend/src/proprietary/components/shared/config/configSections/apiKeys/RefreshModal.tsx
@@ -1,11 +1,5 @@
 import React from "react";
-import {
-  Modal,
-  Stack,
-  Text,
-  Group,
-  Button,
-} from "@mantine/core";
+import { Modal, Stack, Text, Group, Button } from "@mantine/core";
 import { useTranslation } from "react-i18next";
 import { Z_INDEX_OVER_CONFIG_MODAL } from "@app/styles/zIndex";
 
@@ -15,33 +9,46 @@ interface RefreshModalProps {
   onConfirm: () => void;
 }
 
-export default function RefreshModal({ opened, onClose, onConfirm }: RefreshModalProps) {
+export default function RefreshModal({
+  opened,
+  onClose,
+  onConfirm,
+}: RefreshModalProps) {
   const { t } = useTranslation();
   return (
     <Modal
       opened={opened}
       onClose={onClose}
-      title={t('config.apiKeys.refreshModal.title', 'Refresh API Keys')}
+      title={t("config.apiKeys.refreshModal.title", "Refresh API Keys")}
       centered
       size="sm"
       zIndex={Z_INDEX_OVER_CONFIG_MODAL}
     >
       <Stack gap="md">
         <Text size="sm" c="red">
-          {t('config.apiKeys.refreshModal.warning', '⚠� Warning: This action will generate new API keys and make your previous keys invalid.')}
+          {t(
+            "config.apiKeys.refreshModal.warning",
+            "⚠� Warning: This action will generate new API keys and make your previous keys invalid.",
+          )}
         </Text>
         <Text size="sm">
-          {t('config.apiKeys.refreshModal.impact', 'Any applications or services currently using these keys will stop working until you update them with the new keys.')}
+          {t(
+            "config.apiKeys.refreshModal.impact",
+            "Any applications or services currently using these keys will stop working until you update them with the new keys.",
+          )}
         </Text>
         <Text size="sm" fw={500}>
-          {t('config.apiKeys.refreshModal.confirmPrompt', 'Are you sure you want to continue?')}
+          {t(
+            "config.apiKeys.refreshModal.confirmPrompt",
+            "Are you sure you want to continue?",
+          )}
         </Text>
         <Group justify="flex-end" gap="sm">
           <Button variant="default" onClick={onClose}>
-            {t('common.cancel', 'Cancel')}
+            {t("common.cancel", "Cancel")}
           </Button>
           <Button color="red" onClick={onConfirm}>
-            {t('config.apiKeys.refreshModal.confirmCta', 'Refresh Keys')}
+            {t("config.apiKeys.refreshModal.confirmCta", "Refresh Keys")}
           </Button>
         </Group>
       </Stack>
diff --git a/frontend/src/proprietary/components/shared/config/configSections/apiKeys/hooks/useApiKey.ts b/frontend/src/proprietary/components/shared/config/configSections/apiKeys/hooks/useApiKey.ts
index 3115eb12f2..249d7af45b 100644
--- a/frontend/src/proprietary/components/shared/config/configSections/apiKeys/hooks/useApiKey.ts
+++ b/frontend/src/proprietary/components/shared/config/configSections/apiKeys/hooks/useApiKey.ts
@@ -15,7 +15,10 @@ export function useApiKey() {
     alert({
       alertType: "error",
       title: t("config.apiKeys.alert.apiKeyErrorTitle", "API Key Error"),
-      body: t("config.apiKeys.alert.failedToCreateApiKey", "Failed to create API key."),
+      body: t(
+        "config.apiKeys.alert.failedToCreateApiKey",
+        "Failed to create API key.",
+      ),
       isPersistentPopup: false,
     });
   }
@@ -37,7 +40,10 @@ export function useApiKey() {
           alert({
             alertType: "error",
             title: t("config.apiKeys.alert.apiKeyErrorTitle", "API Key Error"),
-            body: t("config.apiKeys.alert.failedToRetrieveApiKey", "Failed to retrieve API key from response."),
+            body: t(
+              "config.apiKeys.alert.failedToRetrieveApiKey",
+              "Failed to retrieve API key from response.",
+            ),
             isPersistentPopup: false,
           });
         }
@@ -48,7 +54,10 @@ export function useApiKey() {
           await apiClient
             .post("/api/v1/user/update-api-key")
             .then((createRes) => {
-              const created = typeof createRes.data === "string" ? createRes.data : createRes.data?.apiKey;
+              const created =
+                typeof createRes.data === "string"
+                  ? createRes.data
+                  : createRes.data?.apiKey;
               if (typeof created === "string") {
                 setApiKey(created);
               } else {
@@ -63,7 +72,10 @@ export function useApiKey() {
           alert({
             alertType: "error",
             title: t("config.apiKeys.alert.apiKeyErrorTitle", "API Key Error"),
-            body: t("config.apiKeys.alert.failedToFetchApiKey", "Failed to fetch API key."),
+            body: t(
+              "config.apiKeys.alert.failedToFetchApiKey",
+              "Failed to fetch API key.",
+            ),
             isPersistentPopup: false,
           });
           setError(e);
@@ -78,38 +90,55 @@ export function useApiKey() {
   const refresh = useCallback(async () => {
     setIsRefreshing(true);
     setError(null);
-    await apiClient.post("/api/v1/user/update-api-key", undefined, {
-      responseType: "json",
-      suppressErrorToast: true,
-    }).then((res) => {
-      const value = typeof res.data === "string" ? res.data : res.data?.apiKey;
-      if (typeof value === "string") {
-        alert({
-          alertType: "success",
-          title: t("config.apiKeys.alert.apiKeyRefreshed", "API Key Refreshed"),
-          body: t("config.apiKeys.alert.apiKeyRefreshedBody", "Your API key has been successfully refreshed."),
-          isPersistentPopup: false,
-        });
-        setApiKey(value);
-      } else {
+    await apiClient
+      .post("/api/v1/user/update-api-key", undefined, {
+        responseType: "json",
+        suppressErrorToast: true,
+      })
+      .then((res) => {
+        const value =
+          typeof res.data === "string" ? res.data : res.data?.apiKey;
+        if (typeof value === "string") {
+          alert({
+            alertType: "success",
+            title: t(
+              "config.apiKeys.alert.apiKeyRefreshed",
+              "API Key Refreshed",
+            ),
+            body: t(
+              "config.apiKeys.alert.apiKeyRefreshedBody",
+              "Your API key has been successfully refreshed.",
+            ),
+            isPersistentPopup: false,
+          });
+          setApiKey(value);
+        } else {
+          alert({
+            alertType: "error",
+            title: t("config.apiKeys.alert.apiKeyErrorTitle", "API Key Error"),
+            body: t(
+              "config.apiKeys.alert.failedToRefreshApiKey",
+              "Failed to refresh API key.",
+            ),
+            isPersistentPopup: false,
+          });
+        }
+      })
+      .catch((e) => {
         alert({
           alertType: "error",
           title: t("config.apiKeys.alert.apiKeyErrorTitle", "API Key Error"),
-          body: t("config.apiKeys.alert.failedToRefreshApiKey", "Failed to refresh API key."),
+          body: t(
+            "config.apiKeys.alert.failedToRefreshApiKey",
+            "Failed to refresh API key.",
+          ),
           isPersistentPopup: false,
         });
-      }
-    }).catch((e) => {
-      alert({
-        alertType: "error",
-        title: t("config.apiKeys.alert.apiKeyErrorTitle", "API Key Error"),
-        body: t("config.apiKeys.alert.failedToRefreshApiKey", "Failed to refresh API key."),
-          isPersistentPopup: false,
+        setError(e);
+      })
+      .finally(() => {
+        setIsRefreshing(false);
       });
-      setError(e);
-    }).finally(() => {
-      setIsRefreshing(false);
-    });
   }, []);
 
   useEffect(() => {
@@ -118,7 +147,15 @@ export function useApiKey() {
     }
   }, [hasAttempted, fetchKey]);
 
-  return { apiKey, isLoading, isRefreshing, error, refetch: fetchKey, refresh, hasAttempted } as const;
+  return {
+    apiKey,
+    isLoading,
+    isRefreshing,
+    error,
+    refetch: fetchKey,
+    refresh,
+    hasAttempted,
+  } as const;
 }
 
 export default useApiKey;
diff --git a/frontend/src/proprietary/components/shared/config/configSections/audit/AuditChartsSection.tsx b/frontend/src/proprietary/components/shared/config/configSections/audit/AuditChartsSection.tsx
index 2edb6ce448..742c0ceb21 100644
--- a/frontend/src/proprietary/components/shared/config/configSections/audit/AuditChartsSection.tsx
+++ b/frontend/src/proprietary/components/shared/config/configSections/audit/AuditChartsSection.tsx
@@ -1,4 +1,4 @@
-import React, { useState, useEffect } from 'react';
+import React, { useState, useEffect } from "react";
 import {
   Card,
   Text,
@@ -9,7 +9,7 @@ import {
   Alert,
   Box,
   SimpleGrid,
-} from '@mantine/core';
+} from "@mantine/core";
 import {
   AreaChart,
   Area,
@@ -21,36 +21,36 @@ import {
   CartesianGrid,
   Tooltip,
   ResponsiveContainer,
-} from 'recharts';
-import { useTranslation } from 'react-i18next';
-import auditService, { AuditChartsData } from '@app/services/auditService';
+} from "recharts";
+import { useTranslation } from "react-i18next";
+import auditService, { AuditChartsData } from "@app/services/auditService";
 
 // Event type color mapping
 const EVENT_TYPE_COLORS: Record<string, string> = {
-  USER_LOGIN: 'var(--mantine-color-green-6)',
-  USER_LOGOUT: 'var(--mantine-color-gray-5)',
-  USER_FAILED_LOGIN: 'var(--mantine-color-red-6)',
-  USER_PROFILE_UPDATE: 'var(--mantine-color-blue-6)',
-  SETTINGS_CHANGED: 'var(--mantine-color-orange-6)',
-  FILE_OPERATION: 'var(--mantine-color-cyan-6)',
-  PDF_PROCESS: 'var(--mantine-color-violet-6)',
-  UI_DATA: 'var(--mantine-color-teal-6)',
-  HTTP_REQUEST: 'var(--mantine-color-indigo-6)',
+  USER_LOGIN: "var(--mantine-color-green-6)",
+  USER_LOGOUT: "var(--mantine-color-gray-5)",
+  USER_FAILED_LOGIN: "var(--mantine-color-red-6)",
+  USER_PROFILE_UPDATE: "var(--mantine-color-blue-6)",
+  SETTINGS_CHANGED: "var(--mantine-color-orange-6)",
+  FILE_OPERATION: "var(--mantine-color-cyan-6)",
+  PDF_PROCESS: "var(--mantine-color-violet-6)",
+  UI_DATA: "var(--mantine-color-teal-6)",
+  HTTP_REQUEST: "var(--mantine-color-indigo-6)",
 };
 
 const getEventTypeColor = (type: string): string => {
-  return EVENT_TYPE_COLORS[type] || 'var(--mantine-color-blue-6)';
+  return EVENT_TYPE_COLORS[type] || "var(--mantine-color-blue-6)";
 };
 
 interface AuditChartsSectionProps {
   loginEnabled?: boolean;
-  timePeriod?: 'day' | 'week' | 'month';
-  onTimePeriodChange?: (period: 'day' | 'week' | 'month') => void;
+  timePeriod?: "day" | "week" | "month";
+  onTimePeriodChange?: (period: "day" | "week" | "month") => void;
 }
 
 const AuditChartsSection: React.FC<AuditChartsSectionProps> = ({
   loginEnabled = true,
-  timePeriod = 'week',
+  timePeriod = "week",
   onTimePeriodChange,
 }) => {
   const { t } = useTranslation();
@@ -66,7 +66,11 @@ const AuditChartsSection: React.FC<AuditChartsSectionProps> = ({
         const data = await auditService.getChartsData(timePeriod);
         setChartsData(data);
       } catch (err) {
-        setError(err instanceof Error ? err.message : t('audit.charts.error', 'Failed to load charts'));
+        setError(
+          err instanceof Error
+            ? err.message
+            : t("audit.charts.error", "Failed to load charts"),
+        );
       } finally {
         setLoading(false);
       }
@@ -78,15 +82,21 @@ const AuditChartsSection: React.FC<AuditChartsSectionProps> = ({
       // Demo data when login disabled
       setChartsData({
         eventsByType: {
-          labels: ['LOGIN', 'LOGOUT', 'SETTINGS_CHANGE', 'FILE_UPLOAD', 'FILE_DOWNLOAD'],
+          labels: [
+            "LOGIN",
+            "LOGOUT",
+            "SETTINGS_CHANGE",
+            "FILE_UPLOAD",
+            "FILE_DOWNLOAD",
+          ],
           values: [342, 289, 145, 678, 523],
         },
         eventsByUser: {
-          labels: ['admin', 'user1', 'user2', 'user3', 'user4'],
+          labels: ["admin", "user1", "user2", "user3", "user4"],
           values: [456, 321, 287, 198, 165],
         },
         eventsOverTime: {
-          labels: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
+          labels: ["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"],
           values: [123, 145, 167, 189, 201, 87, 65],
         },
       });
@@ -106,7 +116,10 @@ const AuditChartsSection: React.FC<AuditChartsSectionProps> = ({
 
   if (error) {
     return (
-      <Alert color="red" title={t('audit.charts.error', 'Error loading charts')}>
+      <Alert
+        color="red"
+        title={t("audit.charts.error", "Error loading charts")}
+      >
         {error}
       </Alert>
     );
@@ -117,38 +130,44 @@ const AuditChartsSection: React.FC<AuditChartsSectionProps> = ({
   }
 
   // Transform data for Recharts
-  const eventsOverTimeData = chartsData.eventsOverTime.labels.map((label, index) => ({
-    name: label,
-    value: chartsData.eventsOverTime.values[index],
-  }));
+  const eventsOverTimeData = chartsData.eventsOverTime.labels.map(
+    (label, index) => ({
+      name: label,
+      value: chartsData.eventsOverTime.values[index],
+    }),
+  );
 
-  const eventsByTypeData = chartsData.eventsByType.labels.map((label, index) => ({
-    type: label,
-    value: chartsData.eventsByType.values[index],
-  }));
+  const eventsByTypeData = chartsData.eventsByType.labels.map(
+    (label, index) => ({
+      type: label,
+      value: chartsData.eventsByType.values[index],
+    }),
+  );
 
-  const eventsByUserData = chartsData.eventsByUser.labels.map((label, index) => ({
-    user: label,
-    value: chartsData.eventsByUser.values[index],
-  }));
+  const eventsByUserData = chartsData.eventsByUser.labels.map(
+    (label, index) => ({
+      user: label,
+      value: chartsData.eventsByUser.values[index],
+    }),
+  );
 
   return (
     <Stack gap="lg">
       {/* Header with time period selector */}
       <Group justify="space-between" align="center">
         <Text size="lg" fw={600}>
-          {t('audit.charts.title', 'Audit Dashboard')}
+          {t("audit.charts.title", "Audit Dashboard")}
         </Text>
         <SegmentedControl
           value={timePeriod}
           onChange={(value) => {
-            onTimePeriodChange?.(value as 'day' | 'week' | 'month');
+            onTimePeriodChange?.(value as "day" | "week" | "month");
           }}
           disabled={!loginEnabled}
           data={[
-            { label: t('audit.charts.day', 'Day'), value: 'day' },
-            { label: t('audit.charts.week', 'Week'), value: 'week' },
-            { label: t('audit.charts.month', 'Month'), value: 'month' },
+            { label: t("audit.charts.day", "Day"), value: "day" },
+            { label: t("audit.charts.week", "Week"), value: "week" },
+            { label: t("audit.charts.month", "Month"), value: "month" },
           ]}
         />
       </Group>
@@ -157,27 +176,38 @@ const AuditChartsSection: React.FC<AuditChartsSectionProps> = ({
       <Card padding="lg" radius="md" withBorder>
         <Stack gap="md">
           <Text size="md" fw={600}>
-            {t('audit.charts.overTime', 'Events Over Time')}
+            {t("audit.charts.overTime", "Events Over Time")}
           </Text>
-          <Box style={{ width: '100%', height: 280 }}>
+          <Box style={{ width: "100%", height: 280 }}>
             {eventsOverTimeData.length > 0 ? (
               <ResponsiveContainer width="100%" height="100%">
                 <AreaChart data={eventsOverTimeData}>
                   <defs>
                     <linearGradient id="colorValue" x1="0" y1="0" x2="0" y2="1">
-                      <stop offset="5%" stopColor="var(--mantine-color-blue-6)" stopOpacity={0.3} />
-                      <stop offset="95%" stopColor="var(--mantine-color-blue-6)" stopOpacity={0} />
+                      <stop
+                        offset="5%"
+                        stopColor="var(--mantine-color-blue-6)"
+                        stopOpacity={0.3}
+                      />
+                      <stop
+                        offset="95%"
+                        stopColor="var(--mantine-color-blue-6)"
+                        stopOpacity={0}
+                      />
                     </linearGradient>
                   </defs>
-                  <CartesianGrid strokeDasharray="3 3" stroke="var(--mantine-color-gray-2)" />
+                  <CartesianGrid
+                    strokeDasharray="3 3"
+                    stroke="var(--mantine-color-gray-2)"
+                  />
                   <XAxis dataKey="name" stroke="var(--mantine-color-gray-6)" />
                   <YAxis stroke="var(--mantine-color-gray-6)" />
                   <Tooltip
                     contentStyle={{
-                      backgroundColor: 'var(--mantine-color-gray-8)',
-                      border: 'none',
-                      borderRadius: 'var(--mantine-radius-md)',
-                      color: 'var(--mantine-color-gray-0)',
+                      backgroundColor: "var(--mantine-color-gray-8)",
+                      border: "none",
+                      borderRadius: "var(--mantine-radius-md)",
+                      color: "var(--mantine-color-gray-0)",
                     }}
                   />
                   <Area
@@ -191,7 +221,9 @@ const AuditChartsSection: React.FC<AuditChartsSectionProps> = ({
               </ResponsiveContainer>
             ) : (
               <Group justify="center">
-                <Text c="dimmed">{t('audit.charts.noData', 'No data for this period')}</Text>
+                <Text c="dimmed">
+                  {t("audit.charts.noData", "No data for this period")}
+                </Text>
               </Group>
             )}
           </Box>
@@ -204,33 +236,45 @@ const AuditChartsSection: React.FC<AuditChartsSectionProps> = ({
         <Card padding="lg" radius="md" withBorder>
           <Stack gap="md">
             <Text size="md" fw={600}>
-              {t('audit.charts.byType', 'Events by Type')}
+              {t("audit.charts.byType", "Events by Type")}
             </Text>
-            <Box style={{ width: '100%', height: 280 }}>
+            <Box style={{ width: "100%", height: 280 }}>
               {eventsByTypeData.length > 0 ? (
                 <ResponsiveContainer width="100%" height="100%">
                   <BarChart data={eventsByTypeData}>
-                    <CartesianGrid strokeDasharray="3 3" stroke="var(--mantine-color-gray-2)" />
-                    <XAxis dataKey="type" stroke="var(--mantine-color-gray-6)" angle={-45} textAnchor="end" height={80} />
+                    <CartesianGrid
+                      strokeDasharray="3 3"
+                      stroke="var(--mantine-color-gray-2)"
+                    />
+                    <XAxis
+                      dataKey="type"
+                      stroke="var(--mantine-color-gray-6)"
+                      angle={-45}
+                      textAnchor="end"
+                      height={80}
+                    />
                     <YAxis stroke="var(--mantine-color-gray-6)" />
                     <Tooltip
                       contentStyle={{
-                        backgroundColor: 'var(--mantine-color-gray-8)',
-                        border: 'none',
-                        borderRadius: 'var(--mantine-radius-md)',
-                        color: 'var(--mantine-color-gray-0)',
+                        backgroundColor: "var(--mantine-color-gray-8)",
+                        border: "none",
+                        borderRadius: "var(--mantine-radius-md)",
+                        color: "var(--mantine-color-gray-0)",
                       }}
                     />
                     <Bar dataKey="value" fill="var(--mantine-color-blue-6)">
                       {eventsByTypeData.map((entry, index) => (
-                        <Cell key={`cell-${index}`} fill={getEventTypeColor(entry.type)} />
+                        <Cell
+                          key={`cell-${index}`}
+                          fill={getEventTypeColor(entry.type)}
+                        />
                       ))}
                     </Bar>
                   </BarChart>
                 </ResponsiveContainer>
               ) : (
                 <Group justify="center">
-                  <Text c="dimmed">{t('audit.charts.noData', 'No data')}</Text>
+                  <Text c="dimmed">{t("audit.charts.noData", "No data")}</Text>
                 </Group>
               )}
             </Box>
@@ -241,21 +285,29 @@ const AuditChartsSection: React.FC<AuditChartsSectionProps> = ({
         <Card padding="lg" radius="md" withBorder>
           <Stack gap="md">
             <Text size="md" fw={600}>
-              {t('audit.charts.byUser', 'Top Users')}
+              {t("audit.charts.byUser", "Top Users")}
             </Text>
-            <Box style={{ width: '100%', height: 280 }}>
+            <Box style={{ width: "100%", height: 280 }}>
               {eventsByUserData.length > 0 ? (
                 <ResponsiveContainer width="100%" height="100%">
                   <BarChart data={eventsByUserData} layout="vertical">
-                    <CartesianGrid strokeDasharray="3 3" stroke="var(--mantine-color-gray-2)" />
+                    <CartesianGrid
+                      strokeDasharray="3 3"
+                      stroke="var(--mantine-color-gray-2)"
+                    />
                     <XAxis type="number" stroke="var(--mantine-color-gray-6)" />
-                    <YAxis type="category" dataKey="user" stroke="var(--mantine-color-gray-6)" width={100} />
+                    <YAxis
+                      type="category"
+                      dataKey="user"
+                      stroke="var(--mantine-color-gray-6)"
+                      width={100}
+                    />
                     <Tooltip
                       contentStyle={{
-                        backgroundColor: 'var(--mantine-color-gray-8)',
-                        border: 'none',
-                        borderRadius: 'var(--mantine-radius-md)',
-                        color: 'var(--mantine-color-gray-0)',
+                        backgroundColor: "var(--mantine-color-gray-8)",
+                        border: "none",
+                        borderRadius: "var(--mantine-radius-md)",
+                        color: "var(--mantine-color-gray-0)",
                       }}
                     />
                     <Bar dataKey="value" fill="var(--mantine-color-green-6)" />
@@ -263,7 +315,7 @@ const AuditChartsSection: React.FC<AuditChartsSectionProps> = ({
                 </ResponsiveContainer>
               ) : (
                 <Group justify="center">
-                  <Text c="dimmed">{t('audit.charts.noData', 'No data')}</Text>
+                  <Text c="dimmed">{t("audit.charts.noData", "No data")}</Text>
                 </Group>
               )}
             </Box>
diff --git a/frontend/src/proprietary/components/shared/config/configSections/audit/AuditClearDataSection.tsx b/frontend/src/proprietary/components/shared/config/configSections/audit/AuditClearDataSection.tsx
index 85837306fa..a2d26aecf0 100644
--- a/frontend/src/proprietary/components/shared/config/configSections/audit/AuditClearDataSection.tsx
+++ b/frontend/src/proprietary/components/shared/config/configSections/audit/AuditClearDataSection.tsx
@@ -1,17 +1,29 @@
-import React, { useState } from 'react';
-import { Card, Stack, Text, PasswordInput, Button, Group, Alert, Code, Badge } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import auditService from '@app/services/auditService';
-import LocalIcon from '@app/components/shared/LocalIcon';
+import React, { useState } from "react";
+import {
+  Card,
+  Stack,
+  Text,
+  PasswordInput,
+  Button,
+  Group,
+  Alert,
+  Code,
+  Badge,
+} from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import auditService from "@app/services/auditService";
+import LocalIcon from "@app/components/shared/LocalIcon";
 
 interface AuditClearDataSectionProps {
   loginEnabled?: boolean;
 }
 
-const AuditClearDataSection: React.FC<AuditClearDataSectionProps> = ({ loginEnabled = true }) => {
+const AuditClearDataSection: React.FC<AuditClearDataSectionProps> = ({
+  loginEnabled = true,
+}) => {
   const { t } = useTranslation();
-  const [confirmationCode, setConfirmationCode] = useState('');
-  const [generatedCode, setGeneratedCode] = useState('');
+  const [confirmationCode, setConfirmationCode] = useState("");
+  const [generatedCode, setGeneratedCode] = useState("");
   const [showConfirmation, setShowConfirmation] = useState(false);
   const [clearing, setClearing] = useState(false);
   const [error, setError] = useState<string | null>(null);
@@ -20,21 +32,21 @@ const AuditClearDataSection: React.FC<AuditClearDataSectionProps> = ({ loginEnab
   const handleInitiateDeletion = () => {
     const code = Math.random().toString(36).substring(2, 10).toUpperCase();
     setGeneratedCode(code);
-    setConfirmationCode('');
+    setConfirmationCode("");
     setShowConfirmation(true);
     setError(null);
   };
 
   const resetForm = () => {
-    setConfirmationCode('');
-    setGeneratedCode('');
+    setConfirmationCode("");
+    setGeneratedCode("");
     setShowConfirmation(false);
     setError(null);
   };
 
   const handleClearData = async () => {
     if (confirmationCode !== generatedCode) {
-      setError(t('audit.clearData.codeDoesNotMatch', 'Code does not match'));
+      setError(t("audit.clearData.codeDoesNotMatch", "Code does not match"));
       return;
     }
 
@@ -47,7 +59,9 @@ const AuditClearDataSection: React.FC<AuditClearDataSectionProps> = ({ loginEnab
       // Auto-dismiss success message after 5 seconds
       setTimeout(() => setSuccess(false), 5000);
     } catch (err) {
-      setError(err instanceof Error ? err.message : 'Failed to clear audit data');
+      setError(
+        err instanceof Error ? err.message : "Failed to clear audit data",
+      );
     } finally {
       setClearing(false);
     }
@@ -58,13 +72,18 @@ const AuditClearDataSection: React.FC<AuditClearDataSectionProps> = ({ loginEnab
       <Stack gap="lg">
         <Alert
           color="green"
-          icon={<LocalIcon icon="check-circle" width="1.2rem" height="1.2rem" />}
-          title={t('audit.clearData.success', 'Success')}
+          icon={
+            <LocalIcon icon="check-circle" width="1.2rem" height="1.2rem" />
+          }
+          title={t("audit.clearData.success", "Success")}
           onClose={() => setSuccess(false)}
           closeButtonLabel="Close alert"
           withCloseButton
         >
-          {t('audit.clearData.successMessage', 'All audit data has been cleared successfully')}
+          {t(
+            "audit.clearData.successMessage",
+            "All audit data has been cleared successfully",
+          )}
         </Alert>
       </Stack>
     );
@@ -76,73 +95,97 @@ const AuditClearDataSection: React.FC<AuditClearDataSectionProps> = ({ loginEnab
         <Alert
           color="orange"
           icon={<LocalIcon icon="warning" width="1.2rem" height="1.2rem" />}
-          title={t('audit.clearData.confirmTitle', 'Please confirm you want to delete')}
+          title={t(
+            "audit.clearData.confirmTitle",
+            "Please confirm you want to delete",
+          )}
         >
           <Text size="sm">
-            {t('audit.clearData.confirmMessage', 'This will permanently remove all audit logs. Enter the confirmation code below to proceed.')}
+            {t(
+              "audit.clearData.confirmMessage",
+              "This will permanently remove all audit logs. Enter the confirmation code below to proceed.",
+            )}
           </Text>
         </Alert>
 
-        <Card padding="lg" radius="md" withBorder style={{ borderColor: 'var(--mantine-color-red-4)' }}>
+        <Card
+          padding="lg"
+          radius="md"
+          withBorder
+          style={{ borderColor: "var(--mantine-color-red-4)" }}
+        >
           <Stack gap="md">
             <div
               style={{
-                backgroundColor: 'var(--mantine-color-gray-0)',
-                padding: '1rem',
-                borderRadius: '0.375rem',
-                border: '1px solid var(--mantine-color-gray-2)',
+                backgroundColor: "var(--mantine-color-gray-0)",
+                padding: "1rem",
+                borderRadius: "0.375rem",
+                border: "1px solid var(--mantine-color-gray-2)",
               }}
             >
               <Text size="xs" fw={600} c="dimmed" mb="xs">
-                {t('audit.clearData.confirmationCode', 'Confirmation Code')}
+                {t("audit.clearData.confirmationCode", "Confirmation Code")}
               </Text>
               <Code
                 style={{
-                  fontSize: '1.5rem',
-                  letterSpacing: '0.15em',
+                  fontSize: "1.5rem",
+                  letterSpacing: "0.15em",
                   fontWeight: 600,
-                  display: 'block',
-                  textAlign: 'center',
-                  padding: '0.75rem',
+                  display: "block",
+                  textAlign: "center",
+                  padding: "0.75rem",
                 }}
               >
                 {generatedCode}
               </Code>
               <Text size="xs" c="dimmed" mt="xs">
-                {t('audit.clearData.enterCodeBelow', 'Enter the code exactly as shown above (case-sensitive)')}
+                {t(
+                  "audit.clearData.enterCodeBelow",
+                  "Enter the code exactly as shown above (case-sensitive)",
+                )}
               </Text>
             </div>
 
             <PasswordInput
-              label={t('audit.clearData.enterCode', 'Confirmation Code')}
-              placeholder={t('audit.clearData.codePlaceholder', 'Type the code here')}
+              label={t("audit.clearData.enterCode", "Confirmation Code")}
+              placeholder={t(
+                "audit.clearData.codePlaceholder",
+                "Type the code here",
+              )}
               value={confirmationCode}
               onChange={(e) => setConfirmationCode(e.currentTarget.value)}
               disabled={!loginEnabled}
               error={
                 confirmationCode && confirmationCode !== generatedCode
-                  ? t('audit.clearData.codeDoesNotMatch', 'Code does not match')
+                  ? t("audit.clearData.codeDoesNotMatch", "Code does not match")
                   : false
               }
             />
 
             {error && (
-              <Alert color="red" icon={<LocalIcon icon="error" width="1.2rem" height="1.2rem" />}>
+              <Alert
+                color="red"
+                icon={<LocalIcon icon="error" width="1.2rem" height="1.2rem" />}
+              >
                 {error}
               </Alert>
             )}
 
             <Group justify="space-between">
               <Button variant="default" onClick={resetForm} disabled={clearing}>
-                {t('audit.clearData.cancel', 'Cancel')}
+                {t("audit.clearData.cancel", "Cancel")}
               </Button>
               <Button
                 color="red"
                 onClick={handleClearData}
                 loading={clearing}
-                disabled={!loginEnabled || !generatedCode || confirmationCode !== generatedCode}
+                disabled={
+                  !loginEnabled ||
+                  !generatedCode ||
+                  confirmationCode !== generatedCode
+                }
               >
-                {t('audit.clearData.deleteButton', 'Delete')}
+                {t("audit.clearData.deleteButton", "Delete")}
               </Button>
             </Group>
           </Stack>
@@ -156,21 +199,32 @@ const AuditClearDataSection: React.FC<AuditClearDataSectionProps> = ({ loginEnab
       <Alert
         color="red"
         icon={<LocalIcon icon="warning" width="1.2rem" height="1.2rem" />}
-        title={t('audit.clearData.warning1', 'This action cannot be undone')}
+        title={t("audit.clearData.warning1", "This action cannot be undone")}
       >
         <Text size="sm">
-          {t('audit.clearData.warning2', 'Deleting audit data will permanently remove all historical audit logs, including security events, user activities, and file operations from the database.')}
+          {t(
+            "audit.clearData.warning2",
+            "Deleting audit data will permanently remove all historical audit logs, including security events, user activities, and file operations from the database.",
+          )}
         </Text>
       </Alert>
 
-      <Card padding="lg" radius="md" withBorder style={{ borderColor: 'var(--mantine-color-red-4)' }}>
+      <Card
+        padding="lg"
+        radius="md"
+        withBorder
+        style={{ borderColor: "var(--mantine-color-red-4)" }}
+      >
         <Stack gap="md">
           <Group>
             <Text fw={600}>
-              {t('audit.clearData.confirmationRequired', 'Delete All Audit Data')}
+              {t(
+                "audit.clearData.confirmationRequired",
+                "Delete All Audit Data",
+              )}
             </Text>
             <Badge color="red">
-              {t('audit.clearData.irreversible', 'IRREVERSIBLE')}
+              {t("audit.clearData.irreversible", "IRREVERSIBLE")}
             </Badge>
           </Group>
 
@@ -180,7 +234,7 @@ const AuditClearDataSection: React.FC<AuditClearDataSectionProps> = ({ loginEnab
             disabled={!loginEnabled}
             fullWidth
           >
-            {t('audit.clearData.initiateDelete', 'Delete All Data')}
+            {t("audit.clearData.initiateDelete", "Delete All Data")}
           </Button>
         </Stack>
       </Card>
diff --git a/frontend/src/proprietary/components/shared/config/configSections/audit/AuditEventsTable.tsx b/frontend/src/proprietary/components/shared/config/configSections/audit/AuditEventsTable.tsx
index ba22d37221..756117214a 100644
--- a/frontend/src/proprietary/components/shared/config/configSections/audit/AuditEventsTable.tsx
+++ b/frontend/src/proprietary/components/shared/config/configSections/audit/AuditEventsTable.tsx
@@ -1,4 +1,4 @@
-import React, { useState, useEffect } from 'react';
+import React, { useState, useEffect } from "react";
 import {
   Card,
   Text,
@@ -13,13 +13,16 @@ import {
   Table,
   Badge,
   UnstyledButton,
-} from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import auditService, { AuditEvent } from '@app/services/auditService';
-import { Z_INDEX_OVER_CONFIG_MODAL } from '@app/styles/zIndex';
-import { useAuditFilters } from '@app/hooks/useAuditFilters';
-import AuditFiltersForm from '@app/components/shared/config/configSections/audit/AuditFiltersForm';
-import LocalIcon from '@app/components/shared/LocalIcon';
+} from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import auditService, {
+  AuditEvent,
+  AuditFilters,
+} from "@app/services/auditService";
+import { Z_INDEX_OVER_CONFIG_MODAL } from "@app/styles/zIndex";
+import { useAuditFilters } from "@app/hooks/useAuditFilters";
+import AuditFiltersForm from "@app/components/shared/config/configSections/audit/AuditFiltersForm";
+import LocalIcon from "@app/components/shared/LocalIcon";
 
 interface AuditEventsTableProps {
   loginEnabled?: boolean;
@@ -39,17 +42,23 @@ const AuditEventsTable: React.FC<AuditEventsTableProps> = ({
   const [loading, setLoading] = useState(true);
   const [error, setError] = useState<string | null>(null);
   const [selectedEvent, setSelectedEvent] = useState<AuditEvent | null>(null);
-  const [sortKey, setSortKey] = useState<'timestamp' | 'eventType' | 'username' | 'ipAddress' | null>('timestamp');
-  const [sortDir, setSortDir] = useState<'asc' | 'desc'>('desc');
+  const [sortKey, setSortKey] = useState<
+    "timestamp" | "eventType" | "username" | "ipAddress" | null
+  >("timestamp");
+  const [sortDir, setSortDir] = useState<"asc" | "desc">("desc");
   const showAuthor = capturePdfAuthor;
   const showFileHash = captureFileHash;
   const totalColumns = 5 + (showAuthor ? 1 : 0) + (showFileHash ? 1 : 0);
 
   // Use shared filters hook
-  const { filters, eventTypes, users, handleFilterChange, handleClearFilters } = useAuditFilters({
-    page: 0,
-    pageSize: 20,
-  }, loginEnabled);
+  const { filters, eventTypes, users, handleFilterChange, handleClearFilters } =
+    useAuditFilters(
+      {
+        page: 0,
+        pageSize: 20,
+      },
+      loginEnabled,
+    );
 
   useEffect(() => {
     const fetchEvents = async () => {
@@ -63,7 +72,7 @@ const AuditEventsTable: React.FC<AuditEventsTableProps> = ({
         setEvents(response.events);
         setTotalPages(response.totalPages);
       } catch (err) {
-        setError(err instanceof Error ? err.message : 'Failed to load events');
+        setError(err instanceof Error ? err.message : "Failed to load events");
       } finally {
         setLoading(false);
       }
@@ -76,44 +85,44 @@ const AuditEventsTable: React.FC<AuditEventsTableProps> = ({
       const now = new Date();
       setEvents([
         {
-          id: '1',
+          id: "1",
           timestamp: new Date(now.getTime() - 1000 * 60 * 15).toISOString(),
-          eventType: 'LOGIN',
-          username: 'admin',
-          ipAddress: '192.168.1.100',
-          details: { message: 'User logged in successfully' },
+          eventType: "LOGIN",
+          username: "admin",
+          ipAddress: "192.168.1.100",
+          details: { message: "User logged in successfully" },
         },
         {
-          id: '2',
+          id: "2",
           timestamp: new Date(now.getTime() - 1000 * 60 * 30).toISOString(),
-          eventType: 'FILE_UPLOAD',
-          username: 'user1',
-          ipAddress: '192.168.1.101',
-          details: { message: 'Uploaded document.pdf' },
+          eventType: "FILE_UPLOAD",
+          username: "user1",
+          ipAddress: "192.168.1.101",
+          details: { message: "Uploaded document.pdf" },
         },
         {
-          id: '3',
+          id: "3",
           timestamp: new Date(now.getTime() - 1000 * 60 * 45).toISOString(),
-          eventType: 'SETTINGS_CHANGE',
-          username: 'admin',
-          ipAddress: '192.168.1.100',
-          details: { message: 'Modified system settings' },
+          eventType: "SETTINGS_CHANGE",
+          username: "admin",
+          ipAddress: "192.168.1.100",
+          details: { message: "Modified system settings" },
         },
         {
-          id: '4',
+          id: "4",
           timestamp: new Date(now.getTime() - 1000 * 60 * 60).toISOString(),
-          eventType: 'FILE_DOWNLOAD',
-          username: 'user2',
-          ipAddress: '192.168.1.102',
-          details: { message: 'Downloaded report.pdf' },
+          eventType: "FILE_DOWNLOAD",
+          username: "user2",
+          ipAddress: "192.168.1.102",
+          details: { message: "Downloaded report.pdf" },
         },
         {
-          id: '5',
+          id: "5",
           timestamp: new Date(now.getTime() - 1000 * 60 * 90).toISOString(),
-          eventType: 'LOGOUT',
-          username: 'user1',
-          ipAddress: '192.168.1.101',
-          details: { message: 'User logged out' },
+          eventType: "LOGOUT",
+          username: "user1",
+          ipAddress: "192.168.1.101",
+          details: { message: "User logged out" },
         },
       ]);
       setTotalPages(1);
@@ -122,7 +131,10 @@ const AuditEventsTable: React.FC<AuditEventsTableProps> = ({
   }, [filters, currentPage, loginEnabled]);
 
   // Wrap filter handlers to reset pagination
-  const handleFilterChangeWithReset = (key: keyof typeof filters, value: any) => {
+  const handleFilterChangeWithReset = (
+    key: keyof AuditFilters,
+    value: AuditFilters[keyof AuditFilters],
+  ) => {
     handleFilterChange(key, value);
     setCurrentPage(1);
   };
@@ -137,56 +149,60 @@ const AuditEventsTable: React.FC<AuditEventsTableProps> = ({
   };
 
   // Sort handling
-  const toggleSort = (key: 'timestamp' | 'eventType' | 'username' | 'ipAddress') => {
+  const toggleSort = (
+    key: "timestamp" | "eventType" | "username" | "ipAddress",
+  ) => {
     if (sortKey === key) {
-      setSortDir(sortDir === 'asc' ? 'desc' : 'asc');
+      setSortDir(sortDir === "asc" ? "desc" : "asc");
     } else {
       setSortKey(key);
-      setSortDir('asc');
+      setSortDir("asc");
     }
   };
 
-  const getSortIcon = (key: 'timestamp' | 'eventType' | 'username' | 'ipAddress') => {
-    if (sortKey !== key) return 'unfold-more';
-    return sortDir === 'asc' ? 'expand-less' : 'expand-more';
+  const getSortIcon = (
+    key: "timestamp" | "eventType" | "username" | "ipAddress",
+  ) => {
+    if (sortKey !== key) return "unfold-more";
+    return sortDir === "asc" ? "expand-less" : "expand-more";
   };
 
   // Event type colors
   const EVENT_TYPE_COLORS: Record<string, string> = {
-    USER_LOGIN: 'green',
-    USER_LOGOUT: 'gray',
-    USER_FAILED_LOGIN: 'red',
-    USER_PROFILE_UPDATE: 'blue',
-    SETTINGS_CHANGED: 'orange',
-    FILE_OPERATION: 'cyan',
-    PDF_PROCESS: 'violet',
-    UI_DATA: 'gray',
-    HTTP_REQUEST: 'indigo',
+    USER_LOGIN: "green",
+    USER_LOGOUT: "gray",
+    USER_FAILED_LOGIN: "red",
+    USER_PROFILE_UPDATE: "blue",
+    SETTINGS_CHANGED: "orange",
+    FILE_OPERATION: "cyan",
+    PDF_PROCESS: "violet",
+    UI_DATA: "gray",
+    HTTP_REQUEST: "indigo",
   };
 
   const getEventTypeColor = (type: string): string => {
-    return EVENT_TYPE_COLORS[type] || 'blue';
+    return EVENT_TYPE_COLORS[type] || "blue";
   };
 
   // Apply sorting to current events
   const sortedEvents = [...events].sort((a, b) => {
-    let aVal: any;
-    let bVal: any;
+    let aVal: string | number | undefined;
+    let bVal: string | number | undefined;
 
     switch (sortKey) {
-      case 'timestamp':
+      case "timestamp":
         aVal = new Date(a.timestamp).getTime();
         bVal = new Date(b.timestamp).getTime();
         break;
-      case 'eventType':
+      case "eventType":
         aVal = a.eventType;
         bVal = b.eventType;
         break;
-      case 'username':
+      case "username":
         aVal = a.username;
         bVal = b.username;
         break;
-      case 'ipAddress':
+      case "ipAddress":
         aVal = a.ipAddress;
         bVal = b.ipAddress;
         break;
@@ -194,8 +210,8 @@ const AuditEventsTable: React.FC<AuditEventsTableProps> = ({
         return 0;
     }
 
-    if (aVal < bVal) return sortDir === 'asc' ? -1 : 1;
-    if (aVal > bVal) return sortDir === 'asc' ? 1 : -1;
+    if (aVal < bVal) return sortDir === "asc" ? -1 : 1;
+    if (aVal > bVal) return sortDir === "asc" ? 1 : -1;
     return 0;
   });
 
@@ -203,7 +219,7 @@ const AuditEventsTable: React.FC<AuditEventsTableProps> = ({
     <Card padding="lg" radius="md" withBorder>
       <Stack gap="md">
         <Text size="lg" fw={600}>
-          {t('audit.events.title', 'Audit Events')}
+          {t("audit.events.title", "Audit Events")}
         </Text>
 
         {/* Filters */}
@@ -218,153 +234,279 @@ const AuditEventsTable: React.FC<AuditEventsTableProps> = ({
 
         {/* Table */}
         {loading ? (
-          <div style={{ display: 'flex', justifyContent: 'center' }}>
+          <div style={{ display: "flex", justifyContent: "center" }}>
             <Loader size="lg" my="xl" />
           </div>
         ) : error ? (
-          <Alert color="red" title={t('audit.events.error', 'Error loading events')}>
+          <Alert
+            color="red"
+            title={t("audit.events.error", "Error loading events")}
+          >
             {error}
           </Alert>
         ) : (
           <>
-            <div style={{ overflowX: 'auto', overflowY: 'hidden', marginBottom: '1rem' }}>
-            <Table
-              horizontalSpacing="md"
-              verticalSpacing="sm"
-              withRowBorders
-              highlightOnHover
+            <div
               style={{
-                '--table-border-color': 'var(--mantine-color-gray-3)',
-              } as React.CSSProperties}
+                overflowX: "auto",
+                overflowY: "hidden",
+                marginBottom: "1rem",
+              }}
             >
-              <Table.Thead>
-                <Table.Tr style={{ backgroundColor: 'var(--mantine-color-gray-0)' }}>
-                  <Table.Th style={{ fontWeight: 600, color: 'var(--mantine-color-gray-7)', padding: '0.5rem' }} fz="sm">
-                    <UnstyledButton onClick={() => toggleSort('timestamp')} style={{ display: 'flex', alignItems: 'center', gap: '0.5rem', cursor: 'pointer', userSelect: 'none' }}>
-                      {t('audit.events.timestamp', 'Timestamp')}
-                      <LocalIcon icon={getSortIcon('timestamp')} width="0.9rem" height="0.9rem" />
-                    </UnstyledButton>
-                  </Table.Th>
-                  <Table.Th style={{ fontWeight: 600, color: 'var(--mantine-color-gray-7)', padding: '0.5rem' }} fz="sm">
-                    <UnstyledButton onClick={() => toggleSort('eventType')} style={{ display: 'flex', alignItems: 'center', gap: '0.5rem', cursor: 'pointer', userSelect: 'none' }}>
-                      {t('audit.events.type', 'Type')}
-                      <LocalIcon icon={getSortIcon('eventType')} width="0.9rem" height="0.9rem" />
-                    </UnstyledButton>
-                  </Table.Th>
-                  <Table.Th style={{ fontWeight: 600, color: 'var(--mantine-color-gray-7)', padding: '0.5rem' }} fz="sm">
-                    <UnstyledButton onClick={() => toggleSort('username')} style={{ display: 'flex', alignItems: 'center', gap: '0.5rem', cursor: 'pointer', userSelect: 'none' }}>
-                      {t('audit.events.user', 'User')}
-                      <LocalIcon icon={getSortIcon('username')} width="0.9rem" height="0.9rem" />
-                    </UnstyledButton>
-                  </Table.Th>
-                  <Table.Th style={{ fontWeight: 600, color: 'var(--mantine-color-gray-7)' }} fz="sm">
-                    {t('audit.events.documentName', 'Document Name')}
-                  </Table.Th>
-                  {showAuthor && (
-                    <Table.Th style={{ fontWeight: 600, color: 'var(--mantine-color-gray-7)' }} fz="sm">
-                      {t('audit.events.author', 'Author')}
+              <Table
+                horizontalSpacing="md"
+                verticalSpacing="sm"
+                withRowBorders
+                highlightOnHover
+                style={
+                  {
+                    "--table-border-color": "var(--mantine-color-gray-3)",
+                  } as React.CSSProperties
+                }
+              >
+                <Table.Thead>
+                  <Table.Tr
+                    style={{ backgroundColor: "var(--mantine-color-gray-0)" }}
+                  >
+                    <Table.Th
+                      style={{
+                        fontWeight: 600,
+                        color: "var(--mantine-color-gray-7)",
+                        padding: "0.5rem",
+                      }}
+                      fz="sm"
+                    >
+                      <UnstyledButton
+                        onClick={() => toggleSort("timestamp")}
+                        style={{
+                          display: "flex",
+                          alignItems: "center",
+                          gap: "0.5rem",
+                          cursor: "pointer",
+                          userSelect: "none",
+                        }}
+                      >
+                        {t("audit.events.timestamp", "Timestamp")}
+                        <LocalIcon
+                          icon={getSortIcon("timestamp")}
+                          width="0.9rem"
+                          height="0.9rem"
+                        />
+                      </UnstyledButton>
                     </Table.Th>
-                  )}
-                  {showFileHash && (
-                    <Table.Th style={{ fontWeight: 600, color: 'var(--mantine-color-gray-7)' }} fz="sm">
-                      {t('audit.events.fileHash', 'File Hash')}
+                    <Table.Th
+                      style={{
+                        fontWeight: 600,
+                        color: "var(--mantine-color-gray-7)",
+                        padding: "0.5rem",
+                      }}
+                      fz="sm"
+                    >
+                      <UnstyledButton
+                        onClick={() => toggleSort("eventType")}
+                        style={{
+                          display: "flex",
+                          alignItems: "center",
+                          gap: "0.5rem",
+                          cursor: "pointer",
+                          userSelect: "none",
+                        }}
+                      >
+                        {t("audit.events.type", "Type")}
+                        <LocalIcon
+                          icon={getSortIcon("eventType")}
+                          width="0.9rem"
+                          height="0.9rem"
+                        />
+                      </UnstyledButton>
+                    </Table.Th>
+                    <Table.Th
+                      style={{
+                        fontWeight: 600,
+                        color: "var(--mantine-color-gray-7)",
+                        padding: "0.5rem",
+                      }}
+                      fz="sm"
+                    >
+                      <UnstyledButton
+                        onClick={() => toggleSort("username")}
+                        style={{
+                          display: "flex",
+                          alignItems: "center",
+                          gap: "0.5rem",
+                          cursor: "pointer",
+                          userSelect: "none",
+                        }}
+                      >
+                        {t("audit.events.user", "User")}
+                        <LocalIcon
+                          icon={getSortIcon("username")}
+                          width="0.9rem"
+                          height="0.9rem"
+                        />
+                      </UnstyledButton>
+                    </Table.Th>
+                    <Table.Th
+                      style={{
+                        fontWeight: 600,
+                        color: "var(--mantine-color-gray-7)",
+                      }}
+                      fz="sm"
+                    >
+                      {t("audit.events.documentName", "Document Name")}
+                    </Table.Th>
+                    {showAuthor && (
+                      <Table.Th
+                        style={{
+                          fontWeight: 600,
+                          color: "var(--mantine-color-gray-7)",
+                        }}
+                        fz="sm"
+                      >
+                        {t("audit.events.author", "Author")}
+                      </Table.Th>
+                    )}
+                    {showFileHash && (
+                      <Table.Th
+                        style={{
+                          fontWeight: 600,
+                          color: "var(--mantine-color-gray-7)",
+                        }}
+                        fz="sm"
+                      >
+                        {t("audit.events.fileHash", "File Hash")}
+                      </Table.Th>
+                    )}
+                    <Table.Th
+                      style={{
+                        fontWeight: 600,
+                        color: "var(--mantine-color-gray-7)",
+                      }}
+                      fz="sm"
+                      ta="center"
+                    >
+                      {t("audit.events.actions", "Actions")}
                     </Table.Th>
-                  )}
-                  <Table.Th style={{ fontWeight: 600, color: 'var(--mantine-color-gray-7)' }} fz="sm" ta="center">
-                    {t('audit.events.actions', 'Actions')}
-                  </Table.Th>
-                </Table.Tr>
-              </Table.Thead>
-              <Table.Tbody>
-                {sortedEvents.length === 0 ? (
-                  <Table.Tr>
-                    <Table.Td colSpan={totalColumns}>
-                      <Group justify="center" py="xl">
-                        <Stack align="center" gap={0}>
-                          <LocalIcon icon="search" width="2rem" height="2rem" style={{ opacity: 0.4 }} />
-                          <Text ta="center" c="dimmed" size="sm">
-                            {t('audit.events.noEvents', 'No events found')}
-                          </Text>
-                        </Stack>
-                      </Group>
-                    </Table.Td>
                   </Table.Tr>
-                ) : (
-                  sortedEvents.map((event) => {
-                    // Extract document name, author, hash from details.files if available
-                    let documentName = '';
-                    let author = '';
-                    let fileHash = '';
-                    if (event.details && typeof event.details === 'object') {
-                      const details = event.details as Record<string, any>;
-                      const files = details.files;
-                      if (Array.isArray(files) && files.length > 0) {
-                        const firstFile = files[0] as Record<string, any>;
-                        documentName = firstFile.name || '';
-                        if (showAuthor || showFileHash) {
-                          author = firstFile.pdfAuthor || '';
-                          fileHash = firstFile.fileHash ? firstFile.fileHash.substring(0, 16) + '...' : '';
+                </Table.Thead>
+                <Table.Tbody>
+                  {sortedEvents.length === 0 ? (
+                    <Table.Tr>
+                      <Table.Td colSpan={totalColumns}>
+                        <Group justify="center" py="xl">
+                          <Stack align="center" gap={0}>
+                            <LocalIcon
+                              icon="search"
+                              width="2rem"
+                              height="2rem"
+                              style={{ opacity: 0.4 }}
+                            />
+                            <Text ta="center" c="dimmed" size="sm">
+                              {t("audit.events.noEvents", "No events found")}
+                            </Text>
+                          </Stack>
+                        </Group>
+                      </Table.Td>
+                    </Table.Tr>
+                  ) : (
+                    sortedEvents.map((event) => {
+                      // Extract document name, author, hash from details.files if available
+                      let documentName = "";
+                      let author = "";
+                      let fileHash = "";
+                      if (event.details && typeof event.details === "object") {
+                        const details = event.details as Record<
+                          string,
+                          unknown
+                        >;
+                        const files = details.files;
+                        if (Array.isArray(files) && files.length > 0) {
+                          const firstFile = files[0] as Record<string, unknown>;
+                          documentName =
+                            typeof firstFile.name === "string"
+                              ? firstFile.name
+                              : "";
+                          if (showAuthor || showFileHash) {
+                            author =
+                              typeof firstFile.pdfAuthor === "string"
+                                ? firstFile.pdfAuthor
+                                : "";
+                            fileHash =
+                              typeof firstFile.fileHash === "string"
+                                ? firstFile.fileHash.substring(0, 16) + "..."
+                                : "";
+                          }
                         }
                       }
-                    }
 
-                    return (
-                      <Table.Tr key={event.id}>
-                        <Table.Td>
-                          <Text size="sm">{formatDate(event.timestamp)}</Text>
-                        </Table.Td>
-                        <Table.Td>
-                          <Badge variant="light" size="sm" color={getEventTypeColor(event.eventType)}>
-                            {event.eventType}
-                          </Badge>
-                        </Table.Td>
-                        <Table.Td>
-                          <Text size="sm">{event.username}</Text>
-                        </Table.Td>
-                        <Table.Td>
-                          <Text size="sm" title={documentName}>
-                            {documentName || '—'}
-                          </Text>
-                        </Table.Td>
-                        {showAuthor && (
+                      return (
+                        <Table.Tr key={event.id}>
                           <Table.Td>
-                            <Text size="sm">{author}</Text>
+                            <Text size="sm">{formatDate(event.timestamp)}</Text>
                           </Table.Td>
-                        )}
-                        {showFileHash && (
                           <Table.Td>
-                            <Text size="sm" title={fileHash} style={{ fontFamily: 'monospace', fontSize: '0.75rem' }}>
-                              {fileHash}
+                            <Badge
+                              variant="light"
+                              size="sm"
+                              color={getEventTypeColor(event.eventType)}
+                            >
+                              {event.eventType}
+                            </Badge>
+                          </Table.Td>
+                          <Table.Td>
+                            <Text size="sm">{event.username}</Text>
+                          </Table.Td>
+                          <Table.Td>
+                            <Text size="sm" title={documentName}>
+                              {documentName || "—"}
                             </Text>
                           </Table.Td>
-                        )}
-                        <Table.Td ta="center">
-                          <Button
-                            variant="subtle"
-                            size="xs"
-                            onClick={() => setSelectedEvent(event)}
-                            disabled={!loginEnabled}
-                          >
-                            {t('audit.events.viewDetails', 'View Details')}
-                          </Button>
-                        </Table.Td>
-                      </Table.Tr>
-                    );
-                  })
-                )}
-              </Table.Tbody>
-            </Table>
+                          {showAuthor && (
+                            <Table.Td>
+                              <Text size="sm">{author}</Text>
+                            </Table.Td>
+                          )}
+                          {showFileHash && (
+                            <Table.Td>
+                              <Text
+                                size="sm"
+                                title={fileHash}
+                                style={{
+                                  fontFamily: "monospace",
+                                  fontSize: "0.75rem",
+                                }}
+                              >
+                                {fileHash}
+                              </Text>
+                            </Table.Td>
+                          )}
+                          <Table.Td ta="center">
+                            <Button
+                              variant="subtle"
+                              size="xs"
+                              onClick={() => setSelectedEvent(event)}
+                              disabled={!loginEnabled}
+                            >
+                              {t("audit.events.viewDetails", "View Details")}
+                            </Button>
+                          </Table.Td>
+                        </Table.Tr>
+                      );
+                    })
+                  )}
+                </Table.Tbody>
+              </Table>
 
-            {/* Pagination */}
-            {totalPages > 1 && (
-              <Group justify="center" mt="md">
-                <Pagination
-                  value={currentPage}
-                  onChange={setCurrentPage}
-                  total={totalPages}
-                />
-              </Group>
-            )}
+              {/* Pagination */}
+              {totalPages > 1 && (
+                <Group justify="center" mt="md">
+                  <Pagination
+                    value={currentPage}
+                    onChange={setCurrentPage}
+                    total={totalPages}
+                  />
+                </Group>
+              )}
             </div>
           </>
         )}
@@ -374,7 +516,7 @@ const AuditEventsTable: React.FC<AuditEventsTableProps> = ({
       <Modal
         opened={selectedEvent !== null}
         onClose={() => setSelectedEvent(null)}
-        title={t('audit.events.eventDetails', 'Event Details')}
+        title={t("audit.events.eventDetails", "Event Details")}
         size="lg"
         zIndex={Z_INDEX_OVER_CONFIG_MODAL}
       >
@@ -382,33 +524,33 @@ const AuditEventsTable: React.FC<AuditEventsTableProps> = ({
           <Stack gap="md">
             <div>
               <Text size="sm" fw={600} c="dimmed">
-                {t('audit.events.timestamp', 'Timestamp')}
+                {t("audit.events.timestamp", "Timestamp")}
               </Text>
               <Text size="sm">{formatDate(selectedEvent.timestamp)}</Text>
             </div>
             <div>
               <Text size="sm" fw={600} c="dimmed">
-                {t('audit.events.type', 'Type')}
+                {t("audit.events.type", "Type")}
               </Text>
               <Text size="sm">{selectedEvent.eventType}</Text>
             </div>
             <div>
               <Text size="sm" fw={600} c="dimmed">
-                {t('audit.events.user', 'User')}
+                {t("audit.events.user", "User")}
               </Text>
               <Text size="sm">{selectedEvent.username}</Text>
             </div>
             <div>
               <Text size="sm" fw={600} c="dimmed">
-                {t('audit.events.ipAddress', 'IP Address')}
+                {t("audit.events.ipAddress", "IP Address")}
               </Text>
               <Text size="sm">{selectedEvent.ipAddress}</Text>
             </div>
             <div>
               <Text size="sm" fw={600} c="dimmed">
-                {t('audit.events.details', 'Details')}
+                {t("audit.events.details", "Details")}
               </Text>
-              <Code block mah={300} style={{ overflow: 'auto' }}>
+              <Code block mah={300} style={{ overflow: "auto" }}>
                 {JSON.stringify(selectedEvent.details, null, 2)}
               </Code>
             </div>
diff --git a/frontend/src/proprietary/components/shared/config/configSections/audit/AuditExportSection.tsx b/frontend/src/proprietary/components/shared/config/configSections/audit/AuditExportSection.tsx
index 53f6c53b59..a0ad482779 100644
--- a/frontend/src/proprietary/components/shared/config/configSections/audit/AuditExportSection.tsx
+++ b/frontend/src/proprietary/components/shared/config/configSections/audit/AuditExportSection.tsx
@@ -1,4 +1,4 @@
-import React, { useState } from 'react';
+import React, { useState } from "react";
 import {
   Card,
   Text,
@@ -7,12 +7,12 @@ import {
   Button,
   SegmentedControl,
   Checkbox,
-} from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import auditService from '@app/services/auditService';
-import LocalIcon from '@app/components/shared/LocalIcon';
-import { useAuditFilters } from '@app/hooks/useAuditFilters';
-import AuditFiltersForm from '@app/components/shared/config/configSections/audit/AuditFiltersForm';
+} from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import auditService from "@app/services/auditService";
+import LocalIcon from "@app/components/shared/LocalIcon";
+import { useAuditFilters } from "@app/hooks/useAuditFilters";
+import AuditFiltersForm from "@app/components/shared/config/configSections/audit/AuditFiltersForm";
 
 interface AuditExportSectionProps {
   loginEnabled?: boolean;
@@ -28,22 +28,25 @@ const AuditExportSection: React.FC<AuditExportSectionProps> = ({
   captureOperationResults = false,
 }) => {
   const { t } = useTranslation();
-  const [exportFormat, setExportFormat] = useState<'csv' | 'json'>('csv');
+  const [exportFormat, setExportFormat] = useState<"csv" | "json">("csv");
   const [exporting, setExporting] = useState(false);
-  const [selectedFields, setSelectedFields] = useState<Record<string, boolean>>({
-    date: true,
-    username: true,
-    ipaddress: false,
-    tool: true,
-    documentName: true,
-    outcome: true,
-    author: capturePdfAuthor,
-    fileHash: captureFileHash,
-    operationResults: captureOperationResults,
-  });
+  const [selectedFields, setSelectedFields] = useState<Record<string, boolean>>(
+    {
+      date: true,
+      username: true,
+      ipaddress: false,
+      tool: true,
+      documentName: true,
+      outcome: true,
+      author: capturePdfAuthor,
+      fileHash: captureFileHash,
+      operationResults: captureOperationResults,
+    },
+  );
 
   // Use shared filters hook
-  const { filters, eventTypes, users, handleFilterChange, handleClearFilters } = useAuditFilters({}, loginEnabled);
+  const { filters, eventTypes, users, handleFilterChange, handleClearFilters } =
+    useAuditFilters({}, loginEnabled);
 
   const handleExport = async () => {
     if (!loginEnabled) return;
@@ -51,13 +54,18 @@ const AuditExportSection: React.FC<AuditExportSectionProps> = ({
     try {
       setExporting(true);
 
-      const fieldsParam = Object.keys(selectedFields).filter(k => selectedFields[k as keyof typeof selectedFields]).join(',');
+      const fieldsParam = Object.keys(selectedFields)
+        .filter((k) => selectedFields[k])
+        .join(",");
 
-      const blob = await auditService.exportData(exportFormat, { ...filters, fields: fieldsParam });
+      const blob = await auditService.exportData(exportFormat, {
+        ...filters,
+        fields: fieldsParam,
+      });
 
       // Create download link
       const url = window.URL.createObjectURL(blob);
-      const link = document.createElement('a');
+      const link = document.createElement("a");
       link.href = url;
       link.download = `audit-export-${new Date().toISOString()}.${exportFormat}`;
       document.body.appendChild(link);
@@ -65,8 +73,8 @@ const AuditExportSection: React.FC<AuditExportSectionProps> = ({
       document.body.removeChild(link);
       window.URL.revokeObjectURL(url);
     } catch (err) {
-      console.error('Export failed:', err);
-      alert(t('audit.export.error', 'Failed to export data'));
+      console.error("Export failed:", err);
+      alert(t("audit.export.error", "Failed to export data"));
     } finally {
       setExporting(false);
     }
@@ -76,108 +84,159 @@ const AuditExportSection: React.FC<AuditExportSectionProps> = ({
     <Card padding="lg" radius="md" withBorder>
       <Stack gap="md">
         <Text size="lg" fw={600}>
-          {t('audit.export.title', 'Export Audit Data')}
+          {t("audit.export.title", "Export Audit Data")}
         </Text>
 
         <Text size="sm" c="dimmed">
           {t(
-            'audit.export.description',
-            'Export audit events to CSV or JSON format. Use filters to limit the exported data.'
+            "audit.export.description",
+            "Export audit events to CSV or JSON format. Use filters to limit the exported data.",
           )}
         </Text>
 
         {/* Format Selection */}
         <div>
           <Text size="sm" fw={600} mb="xs">
-            {t('audit.export.format', 'Export Format')}
+            {t("audit.export.format", "Export Format")}
           </Text>
           <SegmentedControl
             value={exportFormat}
             onChange={(value) => {
               if (!loginEnabled) return;
-              setExportFormat(value as 'csv' | 'json');
+              setExportFormat(value as "csv" | "json");
             }}
             disabled={!loginEnabled}
             data={[
-              { label: 'CSV', value: 'csv' },
-              { label: 'JSON', value: 'json' },
+              { label: "CSV", value: "csv" },
+              { label: "JSON", value: "json" },
             ]}
           />
         </div>
 
         {/* Field Selection */}
         <div>
-            <Text size="sm" fw={600} mb="xs">
-              {t('audit.export.selectFields', 'Select Fields to Include')}
-            </Text>
-            <Stack gap="xs">
-              <Checkbox
-                label={t('audit.export.fieldDate', 'Date')}
-                checked={selectedFields.date}
-                onChange={(e) => setSelectedFields({ ...selectedFields, date: e.currentTarget.checked })}
-                disabled={!loginEnabled}
-              />
-              <Checkbox
-                label={t('audit.export.fieldUsername', 'Username')}
-                checked={selectedFields.username}
-                onChange={(e) => setSelectedFields({ ...selectedFields, username: e.currentTarget.checked })}
-                disabled={!loginEnabled}
-              />
-              <Checkbox
-                label={t('audit.export.fieldIpAddress', 'IP Address')}
-                checked={selectedFields.ipaddress}
-                onChange={(e) => setSelectedFields({ ...selectedFields, ipaddress: e.currentTarget.checked })}
-                disabled={!loginEnabled}
-              />
-              <Checkbox
-                label={t('audit.export.fieldTool', 'Tool')}
-                checked={selectedFields.tool}
-                onChange={(e) => setSelectedFields({ ...selectedFields, tool: e.currentTarget.checked })}
-                disabled={!loginEnabled}
-              />
-              <Checkbox
-                label={t('audit.export.fieldDocumentName', 'Document Name')}
-                checked={selectedFields.documentName}
-                onChange={(e) => setSelectedFields({ ...selectedFields, documentName: e.currentTarget.checked })}
-                disabled={!loginEnabled}
-              />
-              <Checkbox
-                label={t('audit.export.fieldOutcome', 'Outcome (Success/Failure)')}
-                checked={selectedFields.outcome}
-                onChange={(e) => setSelectedFields({ ...selectedFields, outcome: e.currentTarget.checked })}
-                disabled={!loginEnabled}
-              />
-              {capturePdfAuthor && (
-                <Checkbox
-                  label={t('audit.export.fieldAuthor', 'Author (from PDF)')}
-                  checked={selectedFields.author}
-                  onChange={(e) => setSelectedFields({ ...selectedFields, author: e.currentTarget.checked })}
-                  disabled={!loginEnabled}
-                />
+          <Text size="sm" fw={600} mb="xs">
+            {t("audit.export.selectFields", "Select Fields to Include")}
+          </Text>
+          <Stack gap="xs">
+            <Checkbox
+              label={t("audit.export.fieldDate", "Date")}
+              checked={selectedFields.date}
+              onChange={(e) =>
+                setSelectedFields({
+                  ...selectedFields,
+                  date: e.currentTarget.checked,
+                })
+              }
+              disabled={!loginEnabled}
+            />
+            <Checkbox
+              label={t("audit.export.fieldUsername", "Username")}
+              checked={selectedFields.username}
+              onChange={(e) =>
+                setSelectedFields({
+                  ...selectedFields,
+                  username: e.currentTarget.checked,
+                })
+              }
+              disabled={!loginEnabled}
+            />
+            <Checkbox
+              label={t("audit.export.fieldIpAddress", "IP Address")}
+              checked={selectedFields.ipaddress}
+              onChange={(e) =>
+                setSelectedFields({
+                  ...selectedFields,
+                  ipaddress: e.currentTarget.checked,
+                })
+              }
+              disabled={!loginEnabled}
+            />
+            <Checkbox
+              label={t("audit.export.fieldTool", "Tool")}
+              checked={selectedFields.tool}
+              onChange={(e) =>
+                setSelectedFields({
+                  ...selectedFields,
+                  tool: e.currentTarget.checked,
+                })
+              }
+              disabled={!loginEnabled}
+            />
+            <Checkbox
+              label={t("audit.export.fieldDocumentName", "Document Name")}
+              checked={selectedFields.documentName}
+              onChange={(e) =>
+                setSelectedFields({
+                  ...selectedFields,
+                  documentName: e.currentTarget.checked,
+                })
+              }
+              disabled={!loginEnabled}
+            />
+            <Checkbox
+              label={t(
+                "audit.export.fieldOutcome",
+                "Outcome (Success/Failure)",
               )}
-              {captureFileHash && (
-                <Checkbox
-                  label={t('audit.export.fieldFileHash', 'File Hash (SHA-256)')}
-                  checked={selectedFields.fileHash}
-                  onChange={(e) => setSelectedFields({ ...selectedFields, fileHash: e.currentTarget.checked })}
-                  disabled={!loginEnabled}
-                />
-              )}
-              {captureOperationResults && (
-                <Checkbox
-                  label={t('audit.export.fieldOperationResults', 'Operation Results')}
-                  checked={selectedFields.operationResults}
-                  onChange={(e) => setSelectedFields({ ...selectedFields, operationResults: e.currentTarget.checked })}
-                  disabled={!loginEnabled}
-                />
-              )}
-            </Stack>
+              checked={selectedFields.outcome}
+              onChange={(e) =>
+                setSelectedFields({
+                  ...selectedFields,
+                  outcome: e.currentTarget.checked,
+                })
+              }
+              disabled={!loginEnabled}
+            />
+            {capturePdfAuthor && (
+              <Checkbox
+                label={t("audit.export.fieldAuthor", "Author (from PDF)")}
+                checked={selectedFields.author}
+                onChange={(e) =>
+                  setSelectedFields({
+                    ...selectedFields,
+                    author: e.currentTarget.checked,
+                  })
+                }
+                disabled={!loginEnabled}
+              />
+            )}
+            {captureFileHash && (
+              <Checkbox
+                label={t("audit.export.fieldFileHash", "File Hash (SHA-256)")}
+                checked={selectedFields.fileHash}
+                onChange={(e) =>
+                  setSelectedFields({
+                    ...selectedFields,
+                    fileHash: e.currentTarget.checked,
+                  })
+                }
+                disabled={!loginEnabled}
+              />
+            )}
+            {captureOperationResults && (
+              <Checkbox
+                label={t(
+                  "audit.export.fieldOperationResults",
+                  "Operation Results",
+                )}
+                checked={selectedFields.operationResults}
+                onChange={(e) =>
+                  setSelectedFields({
+                    ...selectedFields,
+                    operationResults: e.currentTarget.checked,
+                  })
+                }
+                disabled={!loginEnabled}
+              />
+            )}
+          </Stack>
         </div>
 
         {/* Filters */}
         <div>
           <Text size="sm" fw={600} mb="xs">
-            {t('audit.export.filters', 'Filters (Optional)')}
+            {t("audit.export.filters", "Filters (Optional)")}
           </Text>
           <AuditFiltersForm
             filters={filters}
@@ -192,12 +251,14 @@ const AuditExportSection: React.FC<AuditExportSectionProps> = ({
         {/* Export Button */}
         <Group justify="flex-end">
           <Button
-            leftSection={<LocalIcon icon="download" width="1rem" height="1rem" />}
+            leftSection={
+              <LocalIcon icon="download" width="1rem" height="1rem" />
+            }
             onClick={handleExport}
             loading={exporting}
             disabled={!loginEnabled || exporting}
           >
-            {t('audit.export.exportButton', 'Export Data')}
+            {t("audit.export.exportButton", "Export Data")}
           </Button>
         </Group>
       </Stack>
diff --git a/frontend/src/proprietary/components/shared/config/configSections/audit/AuditFiltersForm.tsx b/frontend/src/proprietary/components/shared/config/configSections/audit/AuditFiltersForm.tsx
index 13c02081b2..da7c46ec59 100644
--- a/frontend/src/proprietary/components/shared/config/configSections/audit/AuditFiltersForm.tsx
+++ b/frontend/src/proprietary/components/shared/config/configSections/audit/AuditFiltersForm.tsx
@@ -1,15 +1,22 @@
-import React from 'react';
-import { Group, MultiSelect, Button, Stack, SimpleGrid, Text } from '@mantine/core';
-import { DateInput } from '@mantine/dates';
-import { useTranslation } from 'react-i18next';
-import { AuditFilters } from '@app/services/auditService';
-import { Z_INDEX_OVER_CONFIG_MODAL } from '@app/styles/zIndex';
+import React from "react";
+import {
+  Group,
+  MultiSelect,
+  Button,
+  Stack,
+  SimpleGrid,
+  Text,
+} from "@mantine/core";
+import { DateInput } from "@mantine/dates";
+import { useTranslation } from "react-i18next";
+import { AuditFilters } from "@app/services/auditService";
+import { Z_INDEX_OVER_CONFIG_MODAL } from "@app/styles/zIndex";
 
 // Helper to format date as YYYY-MM-DD in local time (avoids DST/UTC issues)
 const formatDateToYMD = (date: Date): string => {
   const year = date.getFullYear();
-  const month = String(date.getMonth() + 1).padStart(2, '0');
-  const day = String(date.getDate()).padStart(2, '0');
+  const month = String(date.getMonth() + 1).padStart(2, "0");
+  const day = String(date.getDate()).padStart(2, "0");
   return `${year}-${month}-${day}`;
 };
 
@@ -19,17 +26,17 @@ const getDateRange = (preset: string): [Date, Date] | null => {
   const start = new Date();
 
   switch (preset) {
-    case 'today':
+    case "today":
       start.setHours(0, 0, 0, 0);
       end.setHours(23, 59, 59, 999);
       return [start, end];
-    case 'last7':
+    case "last7":
       start.setDate(start.getDate() - 6);
       return [start, end];
-    case 'last30':
+    case "last30":
       start.setDate(start.getDate() - 29);
       return [start, end];
-    case 'thisMonth':
+    case "thisMonth":
       start.setDate(1);
       start.setHours(0, 0, 0, 0);
       end.setHours(23, 59, 59, 999);
@@ -43,7 +50,10 @@ interface AuditFiltersFormProps {
   filters: AuditFilters;
   eventTypes: string[];
   users: string[];
-  onFilterChange: (key: keyof AuditFilters, value: any) => void;
+  onFilterChange: (
+    key: keyof AuditFilters,
+    value: AuditFilters[keyof AuditFilters],
+  ) => void;
   onClearFilters: () => void;
   disabled?: boolean;
 }
@@ -65,8 +75,8 @@ const AuditFiltersForm: React.FC<AuditFiltersFormProps> = ({
     const range = getDateRange(preset);
     if (range) {
       const [start, end] = range;
-      onFilterChange('startDate', formatDateToYMD(start));
-      onFilterChange('endDate', formatDateToYMD(end));
+      onFilterChange("startDate", formatDateToYMD(start));
+      onFilterChange("endDate", formatDateToYMD(end));
     }
   };
 
@@ -77,7 +87,10 @@ const AuditFiltersForm: React.FC<AuditFiltersFormProps> = ({
     const [expectedStart, expectedEnd] = range;
     const expectedStartStr = formatDateToYMD(expectedStart);
     const expectedEndStr = formatDateToYMD(expectedEnd);
-    return filters.startDate === expectedStartStr && filters.endDate === expectedEndStr;
+    return (
+      filters.startDate === expectedStartStr &&
+      filters.endDate === expectedEndStr
+    );
   };
 
   return (
@@ -85,40 +98,40 @@ const AuditFiltersForm: React.FC<AuditFiltersFormProps> = ({
       {/* Quick Preset Buttons */}
       <div>
         <Text size="xs" fw={600} mb="xs" c="dimmed">
-          {t('audit.filters.quickPresets', 'Quick filters')}
+          {t("audit.filters.quickPresets", "Quick filters")}
         </Text>
         <Group gap="xs">
           <Button
-            variant={isPresetActive('today') ? 'filled' : 'light'}
+            variant={isPresetActive("today") ? "filled" : "light"}
             size="xs"
-            onClick={() => handleQuickPreset('today')}
+            onClick={() => handleQuickPreset("today")}
             disabled={disabled}
           >
-            {t('audit.filters.today', 'Today')}
+            {t("audit.filters.today", "Today")}
           </Button>
           <Button
-            variant={isPresetActive('last7') ? 'filled' : 'light'}
+            variant={isPresetActive("last7") ? "filled" : "light"}
             size="xs"
-            onClick={() => handleQuickPreset('last7')}
+            onClick={() => handleQuickPreset("last7")}
             disabled={disabled}
           >
-            {t('audit.filters.last7Days', 'Last 7 days')}
+            {t("audit.filters.last7Days", "Last 7 days")}
           </Button>
           <Button
-            variant={isPresetActive('last30') ? 'filled' : 'light'}
+            variant={isPresetActive("last30") ? "filled" : "light"}
             size="xs"
-            onClick={() => handleQuickPreset('last30')}
+            onClick={() => handleQuickPreset("last30")}
             disabled={disabled}
           >
-            {t('audit.filters.last30Days', 'Last 30 days')}
+            {t("audit.filters.last30Days", "Last 30 days")}
           </Button>
           <Button
-            variant={isPresetActive('thisMonth') ? 'filled' : 'light'}
+            variant={isPresetActive("thisMonth") ? "filled" : "light"}
             size="xs"
-            onClick={() => handleQuickPreset('thisMonth')}
+            onClick={() => handleQuickPreset("thisMonth")}
             disabled={disabled}
           >
-            {t('audit.filters.thisMonth', 'This month')}
+            {t("audit.filters.thisMonth", "This month")}
           </Button>
         </Group>
       </div>
@@ -126,50 +139,89 @@ const AuditFiltersForm: React.FC<AuditFiltersFormProps> = ({
       {/* Filter Inputs */}
       <SimpleGrid cols={{ base: 1, sm: 2, md: 4 }} spacing="sm">
         <MultiSelect
-          placeholder={t('audit.events.filterByType', 'Filter by type')}
+          placeholder={t("audit.events.filterByType", "Filter by type")}
           data={eventTypes.map((type) => ({ value: type, label: type }))}
-          value={Array.isArray(filters.eventType) ? filters.eventType : (filters.eventType ? [filters.eventType] : [])}
-          onChange={(value) => onFilterChange('eventType', value.length > 0 ? value : undefined)}
+          value={
+            Array.isArray(filters.eventType)
+              ? filters.eventType
+              : filters.eventType
+                ? [filters.eventType]
+                : []
+          }
+          onChange={(value) =>
+            onFilterChange("eventType", value.length > 0 ? value : undefined)
+          }
           clearable
           disabled={disabled}
-          comboboxProps={{ withinPortal: true, zIndex: Z_INDEX_OVER_CONFIG_MODAL }}
+          comboboxProps={{
+            withinPortal: true,
+            zIndex: Z_INDEX_OVER_CONFIG_MODAL,
+          }}
         />
         <MultiSelect
-          placeholder={t('audit.events.filterByUser', 'Filter by user')}
+          placeholder={t("audit.events.filterByUser", "Filter by user")}
           data={users.map((user) => ({ value: user, label: user }))}
-          value={Array.isArray(filters.username) ? filters.username : (filters.username ? [filters.username] : [])}
-          onChange={(value) => onFilterChange('username', value.length > 0 ? value : undefined)}
+          value={
+            Array.isArray(filters.username)
+              ? filters.username
+              : filters.username
+                ? [filters.username]
+                : []
+          }
+          onChange={(value) =>
+            onFilterChange("username", value.length > 0 ? value : undefined)
+          }
           clearable
           searchable
           disabled={disabled}
-          comboboxProps={{ withinPortal: true, zIndex: Z_INDEX_OVER_CONFIG_MODAL }}
+          comboboxProps={{
+            withinPortal: true,
+            zIndex: Z_INDEX_OVER_CONFIG_MODAL,
+          }}
         />
         <DateInput
-          placeholder={t('audit.events.startDate', 'Start date')}
+          placeholder={t("audit.events.startDate", "Start date")}
           value={filters.startDate ? new Date(filters.startDate) : null}
-          onChange={(value: any) => {
-            onFilterChange('startDate', value ? formatDateToYMD(value as Date) : undefined);
+          onChange={(value) => {
+            onFilterChange(
+              "startDate",
+              value ? formatDateToYMD(new Date(value)) : undefined,
+            );
           }}
           clearable
           disabled={disabled}
-          popoverProps={{ withinPortal: true, zIndex: Z_INDEX_OVER_CONFIG_MODAL }}
+          popoverProps={{
+            withinPortal: true,
+            zIndex: Z_INDEX_OVER_CONFIG_MODAL,
+          }}
         />
         <DateInput
-          placeholder={t('audit.events.endDate', 'End date')}
+          placeholder={t("audit.events.endDate", "End date")}
           value={filters.endDate ? new Date(filters.endDate) : null}
-          onChange={(value: any) => {
-            onFilterChange('endDate', value ? formatDateToYMD(value as Date) : undefined);
+          onChange={(value) => {
+            onFilterChange(
+              "endDate",
+              value ? formatDateToYMD(new Date(value)) : undefined,
+            );
           }}
           clearable
           disabled={disabled}
-          popoverProps={{ withinPortal: true, zIndex: Z_INDEX_OVER_CONFIG_MODAL }}
+          popoverProps={{
+            withinPortal: true,
+            zIndex: Z_INDEX_OVER_CONFIG_MODAL,
+          }}
         />
       </SimpleGrid>
 
       {/* Clear Button */}
       <Group justify="flex-end">
-        <Button variant="outline" size="sm" onClick={onClearFilters} disabled={disabled}>
-          {t('audit.events.clearFilters', 'Clear')}
+        <Button
+          variant="outline"
+          size="sm"
+          onClick={onClearFilters}
+          disabled={disabled}
+        >
+          {t("audit.events.clearFilters", "Clear")}
         </Button>
       </Group>
     </Stack>
diff --git a/frontend/src/proprietary/components/shared/config/configSections/audit/AuditStatsCards.tsx b/frontend/src/proprietary/components/shared/config/configSections/audit/AuditStatsCards.tsx
index 1b232d02a4..270fcf9847 100644
--- a/frontend/src/proprietary/components/shared/config/configSections/audit/AuditStatsCards.tsx
+++ b/frontend/src/proprietary/components/shared/config/configSections/audit/AuditStatsCards.tsx
@@ -1,15 +1,27 @@
-import React, { useState, useEffect } from 'react';
-import { Card, Group, Stack, Text, Badge, SimpleGrid, Loader, Alert } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import auditService, { AuditStats } from '@app/services/auditService';
-import LocalIcon from '@app/components/shared/LocalIcon';
+import React, { useState, useEffect } from "react";
+import {
+  Card,
+  Group,
+  Stack,
+  Text,
+  Badge,
+  SimpleGrid,
+  Loader,
+  Alert,
+} from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import auditService, { AuditStats } from "@app/services/auditService";
+import LocalIcon from "@app/components/shared/LocalIcon";
 
 interface AuditStatsCardsProps {
   loginEnabled?: boolean;
-  timePeriod: 'day' | 'week' | 'month';
+  timePeriod: "day" | "week" | "month";
 }
 
-const AuditStatsCards: React.FC<AuditStatsCardsProps> = ({ loginEnabled = true, timePeriod = 'week' }) => {
+const AuditStatsCards: React.FC<AuditStatsCardsProps> = ({
+  loginEnabled = true,
+  timePeriod = "week",
+}) => {
   const { t } = useTranslation();
   const [stats, setStats] = useState<AuditStats | null>(null);
   const [loading, setLoading] = useState(true);
@@ -23,7 +35,9 @@ const AuditStatsCards: React.FC<AuditStatsCardsProps> = ({ loginEnabled = true,
         const data = await auditService.getStats(timePeriod);
         setStats(data);
       } catch (err) {
-        setError(err instanceof Error ? err.message : 'Failed to load statistics');
+        setError(
+          err instanceof Error ? err.message : "Failed to load statistics",
+        );
       } finally {
         setLoading(false);
       }
@@ -43,8 +57,8 @@ const AuditStatsCards: React.FC<AuditStatsCardsProps> = ({ loginEnabled = true,
         avgLatencyMs: 342,
         prevAvgLatencyMs: 385,
         errorCount: 148,
-        topEventType: 'PDF_PROCESS',
-        topUser: 'admin',
+        topEventType: "PDF_PROCESS",
+        topUser: "admin",
         eventsByType: {},
         eventsByUser: {},
         topTools: {},
@@ -57,7 +71,14 @@ const AuditStatsCards: React.FC<AuditStatsCardsProps> = ({ loginEnabled = true,
   if (loading) {
     return (
       <Card padding="lg" radius="md" withBorder>
-        <div style={{ display: 'flex', justifyContent: 'center', alignItems: 'center', padding: '2rem 0' }}>
+        <div
+          style={{
+            display: "flex",
+            justifyContent: "center",
+            alignItems: "center",
+            padding: "2rem 0",
+          }}
+        >
           <Loader size="lg" />
         </div>
       </Card>
@@ -66,7 +87,10 @@ const AuditStatsCards: React.FC<AuditStatsCardsProps> = ({ loginEnabled = true,
 
   if (error) {
     return (
-      <Alert color="red" title={t('audit.stats.error', 'Error loading statistics')}>
+      <Alert
+        color="red"
+        title={t("audit.stats.error", "Error loading statistics")}
+      >
         {error}
       </Alert>
     );
@@ -76,27 +100,41 @@ const AuditStatsCards: React.FC<AuditStatsCardsProps> = ({ loginEnabled = true,
     return null;
   }
 
-  const trendPercent = stats.prevTotalEvents > 0 ? ((stats.totalEvents - stats.prevTotalEvents) / stats.prevTotalEvents) * 100 : 0;
-  const userTrend = stats.prevUniqueUsers > 0 ? ((stats.uniqueUsers - stats.prevUniqueUsers) / stats.prevUniqueUsers) * 100 : 0;
-  const latencyTrend = stats.prevAvgLatencyMs > 0 ? ((stats.avgLatencyMs - stats.prevAvgLatencyMs) / stats.prevAvgLatencyMs) * 100 : 0;
-  const successTrend = stats.prevSuccessRate > 0 ? stats.successRate - stats.prevSuccessRate : 0;
+  const trendPercent =
+    stats.prevTotalEvents > 0
+      ? ((stats.totalEvents - stats.prevTotalEvents) / stats.prevTotalEvents) *
+        100
+      : 0;
+  const userTrend =
+    stats.prevUniqueUsers > 0
+      ? ((stats.uniqueUsers - stats.prevUniqueUsers) / stats.prevUniqueUsers) *
+        100
+      : 0;
+  const latencyTrend =
+    stats.prevAvgLatencyMs > 0
+      ? ((stats.avgLatencyMs - stats.prevAvgLatencyMs) /
+          stats.prevAvgLatencyMs) *
+        100
+      : 0;
+  const successTrend =
+    stats.prevSuccessRate > 0 ? stats.successRate - stats.prevSuccessRate : 0;
 
   const getSuccessRateColor = (rate: number) => {
-    if (rate >= 95) return 'green';
-    if (rate >= 80) return 'yellow';
-    return 'red';
+    if (rate >= 95) return "green";
+    if (rate >= 80) return "yellow";
+    return "red";
   };
 
   const getTrendColor = (trend: number, lowerIsBetter: boolean = false) => {
     if (lowerIsBetter) {
-      return trend <= 0 ? 'green' : 'red';
+      return trend <= 0 ? "green" : "red";
     }
-    return trend >= 0 ? 'green' : 'red';
+    return trend >= 0 ? "green" : "red";
   };
 
   const getTrendIcon = (trend: number, lowerIsBetter: boolean = false) => {
     const isPositive = lowerIsBetter ? trend <= 0 : trend >= 0;
-    return isPositive ? 'trending-up' : 'trending-down';
+    return isPositive ? "trending-up" : "trending-down";
   };
 
   return (
@@ -106,7 +144,7 @@ const AuditStatsCards: React.FC<AuditStatsCardsProps> = ({ loginEnabled = true,
         <Stack gap="md">
           <Group justify="space-between">
             <Text size="sm" c="dimmed">
-              {t('audit.stats.totalEvents', 'Total Events')}
+              {t("audit.stats.totalEvents", "Total Events")}
             </Text>
             <LocalIcon icon="analytics" width="1.2rem" height="1.2rem" />
           </Group>
@@ -123,11 +161,12 @@ const AuditStatsCards: React.FC<AuditStatsCardsProps> = ({ loginEnabled = true,
                   icon={getTrendIcon(trendPercent)}
                   width="0.8rem"
                   height="0.8rem"
-                  style={{ marginRight: '0.25rem' }}
+                  style={{ marginRight: "0.25rem" }}
                 />
               }
             >
-              {Math.abs(trendPercent).toFixed(1)}% {t('audit.stats.vsLastPeriod', 'vs last period')}
+              {Math.abs(trendPercent).toFixed(1)}%{" "}
+              {t("audit.stats.vsLastPeriod", "vs last period")}
             </Badge>
           )}
         </Stack>
@@ -138,24 +177,37 @@ const AuditStatsCards: React.FC<AuditStatsCardsProps> = ({ loginEnabled = true,
         <Stack gap="md">
           <Group justify="space-between">
             <Text size="sm" c="dimmed">
-              {t('audit.stats.successRate', 'Success Rate')}
+              {t("audit.stats.successRate", "Success Rate")}
             </Text>
-            <LocalIcon icon="check-circle-rounded" width="1.2rem" height="1.2rem" />
+            <LocalIcon
+              icon="check-circle-rounded"
+              width="1.2rem"
+              height="1.2rem"
+            />
           </Group>
           <Text size="xl" fw={700}>
             {stats.successRate.toFixed(1)}%
           </Text>
           <Group gap="xs">
-            <Badge color={getSuccessRateColor(stats.successRate)} variant="light" size="sm">
+            <Badge
+              color={getSuccessRateColor(stats.successRate)}
+              variant="light"
+              size="sm"
+            >
               {stats.successRate >= 95
-                ? t('audit.stats.excellent', 'Excellent')
+                ? t("audit.stats.excellent", "Excellent")
                 : stats.successRate >= 80
-                  ? t('audit.stats.good', 'Good')
-                  : t('audit.stats.attention', 'Attention needed')}
+                  ? t("audit.stats.good", "Good")
+                  : t("audit.stats.attention", "Attention needed")}
             </Badge>
             {successTrend !== 0 && (
-              <Badge color={getTrendColor(successTrend)} variant="light" size="xs">
-                {successTrend > 0 ? '+' : ''}{successTrend.toFixed(1)}%
+              <Badge
+                color={getTrendColor(successTrend)}
+                variant="light"
+                size="xs"
+              >
+                {successTrend > 0 ? "+" : ""}
+                {successTrend.toFixed(1)}%
               </Badge>
             )}
           </Group>
@@ -167,7 +219,7 @@ const AuditStatsCards: React.FC<AuditStatsCardsProps> = ({ loginEnabled = true,
         <Stack gap="md">
           <Group justify="space-between">
             <Text size="sm" c="dimmed">
-              {t('audit.stats.activeUsers', 'Active Users')}
+              {t("audit.stats.activeUsers", "Active Users")}
             </Text>
             <LocalIcon icon="group" width="1.2rem" height="1.2rem" />
           </Group>
@@ -184,7 +236,7 @@ const AuditStatsCards: React.FC<AuditStatsCardsProps> = ({ loginEnabled = true,
                   icon={getTrendIcon(userTrend)}
                   width="0.8rem"
                   height="0.8rem"
-                  style={{ marginRight: '0.25rem' }}
+                  style={{ marginRight: "0.25rem" }}
                 />
               }
             >
@@ -199,12 +251,14 @@ const AuditStatsCards: React.FC<AuditStatsCardsProps> = ({ loginEnabled = true,
         <Stack gap="md">
           <Group justify="space-between">
             <Text size="sm" c="dimmed">
-              {t('audit.stats.avgLatency', 'Avg Latency')}
+              {t("audit.stats.avgLatency", "Avg Latency")}
             </Text>
             <LocalIcon icon="speed" width="1.2rem" height="1.2rem" />
           </Group>
           <Text size="xl" fw={700}>
-            {stats.avgLatencyMs > 0 ? `${stats.avgLatencyMs.toFixed(0)}ms` : t('audit.stats.noData', 'N/A')}
+            {stats.avgLatencyMs > 0
+              ? `${stats.avgLatencyMs.toFixed(0)}ms`
+              : t("audit.stats.noData", "N/A")}
           </Text>
           {latencyTrend !== 0 && stats.avgLatencyMs > 0 && (
             <Badge
@@ -216,7 +270,7 @@ const AuditStatsCards: React.FC<AuditStatsCardsProps> = ({ loginEnabled = true,
                   icon={getTrendIcon(latencyTrend, true)}
                   width="0.8rem"
                   height="0.8rem"
-                  style={{ marginRight: '0.25rem' }}
+                  style={{ marginRight: "0.25rem" }}
                 />
               }
             >
diff --git a/frontend/src/proprietary/components/shared/config/configSections/audit/AuditSystemStatus.tsx b/frontend/src/proprietary/components/shared/config/configSections/audit/AuditSystemStatus.tsx
index 8063fe9f68..03ba06b7ce 100644
--- a/frontend/src/proprietary/components/shared/config/configSections/audit/AuditSystemStatus.tsx
+++ b/frontend/src/proprietary/components/shared/config/configSections/audit/AuditSystemStatus.tsx
@@ -1,7 +1,7 @@
-import React from 'react';
-import { Card, Group, Stack, Badge, Text, Divider } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { AuditSystemStatus as AuditStatus } from '@app/services/auditService';
+import React from "react";
+import { Card, Group, Stack, Badge, Text, Divider } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import { AuditSystemStatus as AuditStatus } from "@app/services/auditService";
 
 interface AuditSystemStatusProps {
   status: AuditStatus;
@@ -14,24 +14,29 @@ const AuditSystemStatus: React.FC<AuditSystemStatusProps> = ({ status }) => {
     <Card padding="lg" radius="md" withBorder>
       <Stack gap="md">
         <Text size="lg" fw={600}>
-          {t('audit.systemStatus.title', 'System Status')}
+          {t("audit.systemStatus.title", "System Status")}
         </Text>
 
         <Group justify="space-between">
           <div>
             <Text size="sm" c="dimmed">
-              {t('audit.systemStatus.status', 'Audit Logging')}
+              {t("audit.systemStatus.status", "Audit Logging")}
             </Text>
-            <Badge color={status.enabled ? 'green' : 'red'} variant="light" size="lg" mt="xs">
+            <Badge
+              color={status.enabled ? "green" : "red"}
+              variant="light"
+              size="lg"
+              mt="xs"
+            >
               {status.enabled
-                ? t('audit.systemStatus.enabled', 'Enabled')
-                : t('audit.systemStatus.disabled', 'Disabled')}
+                ? t("audit.systemStatus.enabled", "Enabled")
+                : t("audit.systemStatus.disabled", "Disabled")}
             </Badge>
           </div>
 
           <div>
             <Text size="sm" c="dimmed">
-              {t('audit.systemStatus.level', 'Audit Level')}
+              {t("audit.systemStatus.level", "Audit Level")}
             </Text>
             <Text size="lg" fw={600} mt="xs">
               {status.level}
@@ -40,16 +45,16 @@ const AuditSystemStatus: React.FC<AuditSystemStatusProps> = ({ status }) => {
 
           <div>
             <Text size="sm" c="dimmed">
-              {t('audit.systemStatus.retention', 'Retention Period')}
+              {t("audit.systemStatus.retention", "Retention Period")}
             </Text>
             <Text size="lg" fw={600} mt="xs">
-              {status.retentionDays} {t('audit.systemStatus.days', 'days')}
+              {status.retentionDays} {t("audit.systemStatus.days", "days")}
             </Text>
           </div>
 
           <div>
             <Text size="sm" c="dimmed">
-              {t('audit.systemStatus.totalEvents', 'Total Events')}
+              {t("audit.systemStatus.totalEvents", "Total Events")}
             </Text>
             <Text size="lg" fw={600} mt="xs">
               {status.totalEvents.toLocaleString()}
@@ -61,34 +66,64 @@ const AuditSystemStatus: React.FC<AuditSystemStatusProps> = ({ status }) => {
 
         <div>
           <Text size="sm" fw={600} mb="xs">
-            {t('audit.systemStatus.capturedFields', 'Captured Fields')}
+            {t("audit.systemStatus.capturedFields", "Captured Fields")}
           </Text>
           <Group gap="xs">
             <Badge color="green" variant="light" size="sm">
-              {t('audit.systemStatus.username', 'Username')}
+              {t("audit.systemStatus.username", "Username")}
             </Badge>
             <Badge color="green" variant="light" size="sm">
-              {t('audit.systemStatus.documentName', 'Document Name')}
+              {t("audit.systemStatus.documentName", "Document Name")}
             </Badge>
             <Badge color="green" variant="light" size="sm">
-              {t('audit.systemStatus.tool', 'Tool')}
+              {t("audit.systemStatus.tool", "Tool")}
             </Badge>
             <Badge color="green" variant="light" size="sm">
-              {t('audit.systemStatus.date', 'Date')}
+              {t("audit.systemStatus.date", "Date")}
             </Badge>
-            <Badge color={status.capturePdfAuthor ? 'green' : 'gray'} variant="light" size="sm">
-              {t('audit.systemStatus.pdfAuthor', 'PDF Author')}
+            <Badge
+              color={status.capturePdfAuthor ? "green" : "gray"}
+              variant="light"
+              size="sm"
+            >
+              {t("audit.systemStatus.pdfAuthor", "PDF Author")}
               {!status.capturePdfAuthor && (
-                <span style={{ marginLeft: '0.5rem', fontSize: '0.75rem', opacity: 0.7 }}>
-                  ({t('audit.systemStatus.captureBySettings', 'Enable in settings')})
+                <span
+                  style={{
+                    marginLeft: "0.5rem",
+                    fontSize: "0.75rem",
+                    opacity: 0.7,
+                  }}
+                >
+                  (
+                  {t(
+                    "audit.systemStatus.captureBySettings",
+                    "Enable in settings",
+                  )}
+                  )
                 </span>
               )}
             </Badge>
-            <Badge color={status.captureFileHash ? 'green' : 'gray'} variant="light" size="sm">
-              {t('audit.systemStatus.fileHash', 'File Hash')}
+            <Badge
+              color={status.captureFileHash ? "green" : "gray"}
+              variant="light"
+              size="sm"
+            >
+              {t("audit.systemStatus.fileHash", "File Hash")}
               {!status.captureFileHash && (
-                <span style={{ marginLeft: '0.5rem', fontSize: '0.75rem', opacity: 0.7 }}>
-                  ({t('audit.systemStatus.captureBySettings', 'Enable in settings')})
+                <span
+                  style={{
+                    marginLeft: "0.5rem",
+                    fontSize: "0.75rem",
+                    opacity: 0.7,
+                  }}
+                >
+                  (
+                  {t(
+                    "audit.systemStatus.captureBySettings",
+                    "Enable in settings",
+                  )}
+                  )
                 </span>
               )}
             </Badge>
diff --git a/frontend/src/proprietary/components/shared/config/configSections/plan/AvailablePlansSection.tsx b/frontend/src/proprietary/components/shared/config/configSections/plan/AvailablePlansSection.tsx
index 9aed2ff7d5..6ac4feb2e2 100644
--- a/frontend/src/proprietary/components/shared/config/configSections/plan/AvailablePlansSection.tsx
+++ b/frontend/src/proprietary/components/shared/config/configSections/plan/AvailablePlansSection.tsx
@@ -1,11 +1,19 @@
-import React, { useState, useMemo } from 'react';
-import { Button, Collapse, Select, Group } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import licenseService, { PlanTier, PlanTierGroup, LicenseInfo, mapLicenseToTier } from '@app/services/licenseService';
-import PlanCard from '@app/components/shared/config/configSections/plan/PlanCard';
-import FeatureComparisonTable from '@app/components/shared/config/configSections/plan/FeatureComparisonTable';
-import { Z_INDEX_OVER_CONFIG_MODAL } from '@app/styles/zIndex';
-import { isCurrentTier as checkIsCurrentTier, isDowngrade as checkIsDowngrade } from '@app/utils/planTierUtils';
+import React, { useState, useMemo } from "react";
+import { Button, Collapse, Select, Group } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import licenseService, {
+  PlanTier,
+  PlanTierGroup,
+  LicenseInfo,
+  mapLicenseToTier,
+} from "@app/services/licenseService";
+import PlanCard from "@app/components/shared/config/configSections/plan/PlanCard";
+import FeatureComparisonTable from "@app/components/shared/config/configSections/plan/FeatureComparisonTable";
+import { Z_INDEX_OVER_CONFIG_MODAL } from "@app/styles/zIndex";
+import {
+  isCurrentTier as checkIsCurrentTier,
+  isDowngrade as checkIsDowngrade,
+} from "@app/utils/planTierUtils";
 
 interface AvailablePlansSectionProps {
   plans: PlanTier[];
@@ -56,28 +64,40 @@ const AvailablePlansSection: React.FC<AvailablePlansSectionProps> = ({
     <div>
       <Group justify="space-between" align="flex-start" mb="xs">
         <div>
-          <h3 style={{ margin: 0, color: 'var(--mantine-color-text)', fontSize: '1rem' }}>
-            {t('plan.availablePlans.title', 'Available Plans')}
+          <h3
+            style={{
+              margin: 0,
+              color: "var(--mantine-color-text)",
+              fontSize: "1rem",
+            }}
+          >
+            {t("plan.availablePlans.title", "Available Plans")}
           </h3>
           <p
             style={{
-              margin: '0.25rem 0 0 0',
-              color: 'var(--mantine-color-dimmed)',
-              fontSize: '0.875rem',
+              margin: "0.25rem 0 0 0",
+              color: "var(--mantine-color-dimmed)",
+              fontSize: "0.875rem",
             }}
           >
-            {t('plan.availablePlans.subtitle', 'Choose the plan that fits your needs')}
+            {t(
+              "plan.availablePlans.subtitle",
+              "Choose the plan that fits your needs",
+            )}
           </p>
         </div>
         {currency && onCurrencyChange && currencyOptions && (
           <Select
             value={currency}
-            onChange={(value) => onCurrencyChange(value || 'usd')}
+            onChange={(value) => onCurrencyChange(value || "usd")}
             data={currencyOptions}
             searchable
             clearable={false}
             w={300}
-            comboboxProps={{ withinPortal: true, zIndex: Z_INDEX_OVER_CONFIG_MODAL }}
+            comboboxProps={{
+              withinPortal: true,
+              zIndex: Z_INDEX_OVER_CONFIG_MODAL,
+            }}
             disabled={!loginEnabled}
           />
         )}
@@ -85,10 +105,10 @@ const AvailablePlansSection: React.FC<AvailablePlansSectionProps> = ({
 
       <div
         style={{
-          display: 'grid',
-          gridTemplateColumns: 'repeat(3, 1fr)',
-          gap: '1rem',
-          marginBottom: '0.1rem',
+          display: "grid",
+          gridTemplateColumns: "repeat(3, 1fr)",
+          gap: "1rem",
+          marginBottom: "0.1rem",
         }}
       >
         {groupedPlans.map((group) => (
@@ -106,16 +126,22 @@ const AvailablePlansSection: React.FC<AvailablePlansSectionProps> = ({
         ))}
       </div>
 
-      <div style={{ textAlign: 'center' }}>
-        <Button variant="subtle" onClick={() => setShowComparison(!showComparison)}>
+      <div style={{ textAlign: "center" }}>
+        <Button
+          variant="subtle"
+          onClick={() => setShowComparison(!showComparison)}
+        >
           {showComparison
-            ? t('plan.hideComparison', 'Hide Feature Comparison')
-            : t('plan.showComparison', 'Compare All Features')}
+            ? t("plan.hideComparison", "Hide Feature Comparison")
+            : t("plan.showComparison", "Compare All Features")}
         </Button>
       </div>
 
       <Collapse in={showComparison}>
-        <FeatureComparisonTable plans={groupedPlans} currentTier={currentTier} />
+        <FeatureComparisonTable
+          plans={groupedPlans}
+          currentTier={currentTier}
+        />
       </Collapse>
     </div>
   );
diff --git a/frontend/src/proprietary/components/shared/config/configSections/plan/FeatureComparisonTable.tsx b/frontend/src/proprietary/components/shared/config/configSections/plan/FeatureComparisonTable.tsx
index d297853f06..7d520f3644 100644
--- a/frontend/src/proprietary/components/shared/config/configSections/plan/FeatureComparisonTable.tsx
+++ b/frontend/src/proprietary/components/shared/config/configSections/plan/FeatureComparisonTable.tsx
@@ -1,7 +1,7 @@
-import React from 'react';
-import { Card, Badge, Text } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { PlanFeature } from '@app/services/licenseService';
+import React from "react";
+import { Card, Badge, Text } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import { PlanFeature } from "@app/services/licenseService";
 
 interface PlanWithFeatures {
   name: string;
@@ -12,50 +12,58 @@ interface PlanWithFeatures {
 
 interface FeatureComparisonTableProps {
   plans: PlanWithFeatures[];
-  currentTier?: 'free' | 'server' | 'enterprise' | null;
+  currentTier?: "free" | "server" | "enterprise" | null;
 }
 
-const FeatureComparisonTable: React.FC<FeatureComparisonTableProps> = ({ plans, currentTier }) => {
+const FeatureComparisonTable: React.FC<FeatureComparisonTableProps> = ({
+  plans,
+  currentTier,
+}) => {
   const { t } = useTranslation();
 
   return (
-    <Card padding="lg" radius="md" withBorder style={{ marginTop: '1rem' }}>
+    <Card padding="lg" radius="md" withBorder style={{ marginTop: "1rem" }}>
       <Text size="lg" fw={600} mb="md">
-        {t('plan.featureComparison', 'Feature Comparison')}
+        {t("plan.featureComparison", "Feature Comparison")}
       </Text>
 
-      <div style={{ overflowX: 'auto' }}>
-        <table style={{ width: '100%', borderCollapse: 'collapse' }}>
+      <div style={{ overflowX: "auto" }}>
+        <table style={{ width: "100%", borderCollapse: "collapse" }}>
           <thead>
-            <tr style={{ borderBottom: '2px solid var(--mantine-color-gray-3)' }}>
-              <th style={{ textAlign: 'left', padding: '0.75rem' }}>
-                {t('plan.feature.title', 'Feature')}
+            <tr
+              style={{ borderBottom: "2px solid var(--mantine-color-gray-3)" }}
+            >
+              <th style={{ textAlign: "left", padding: "0.75rem" }}>
+                {t("plan.feature.title", "Feature")}
               </th>
               {plans.map((plan, index) => (
                 <th
                   key={plan.tier || plan.name || index}
                   style={{
-                    textAlign: 'center',
-                    padding: '0.75rem',
-                    minWidth: '8rem',
-                    position: 'relative'
+                    textAlign: "center",
+                    padding: "0.75rem",
+                    minWidth: "8rem",
+                    position: "relative",
                   }}
                 >
                   {plan.name}
-                  {plan.popular && !(plan.tier === 'server' && currentTier === 'enterprise') && (
-                    <Badge
-                      color="blue"
-                      variant="filled"
-                      size="xs"
-                      style={{
-                        position: 'absolute',
-                        top: '0.5rem',
-                        right: '0.5rem',
-                      }}
-                    >
-                      {t('plan.popular', 'Popular')}
-                    </Badge>
-                  )}
+                  {plan.popular &&
+                    !(
+                      plan.tier === "server" && currentTier === "enterprise"
+                    ) && (
+                      <Badge
+                        color="blue"
+                        variant="filled"
+                        size="xs"
+                        style={{
+                          position: "absolute",
+                          top: "0.5rem",
+                          right: "0.5rem",
+                        }}
+                      >
+                        {t("plan.popular", "Popular")}
+                      </Badge>
+                    )}
                 </th>
               ))}
             </tr>
@@ -64,13 +72,18 @@ const FeatureComparisonTable: React.FC<FeatureComparisonTableProps> = ({ plans,
             {plans[0]?.features.map((_, featureIndex) => (
               <tr
                 key={featureIndex}
-                style={{ borderBottom: '1px solid var(--mantine-color-gray-3)' }}
+                style={{
+                  borderBottom: "1px solid var(--mantine-color-gray-3)",
+                }}
               >
-                <td style={{ padding: '0.75rem' }}>
+                <td style={{ padding: "0.75rem" }}>
                   {plans[0].features[featureIndex].name}
                 </td>
                 {plans.map((plan, planIndex) => (
-                  <td key={planIndex} style={{ textAlign: 'center', padding: '0.75rem' }}>
+                  <td
+                    key={planIndex}
+                    style={{ textAlign: "center", padding: "0.75rem" }}
+                  >
                     {plan.features[featureIndex]?.included ? (
                       <Text c="green" fw={600} size="lg">
                         ✓
diff --git a/frontend/src/proprietary/components/shared/config/configSections/plan/LicenseKeySection.tsx b/frontend/src/proprietary/components/shared/config/configSections/plan/LicenseKeySection.tsx
index e5e90d0489..ffd89ec7b0 100644
--- a/frontend/src/proprietary/components/shared/config/configSections/plan/LicenseKeySection.tsx
+++ b/frontend/src/proprietary/components/shared/config/configSections/plan/LicenseKeySection.tsx
@@ -1,25 +1,38 @@
-import React, { useState } from 'react';
-import { Button, Collapse, Alert, TextInput, Paper, Stack, Group, Text, SegmentedControl, FileButton } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import LocalIcon from '@app/components/shared/LocalIcon';
-import { alert } from '@app/components/toast';
-import { LicenseInfo } from '@app/services/licenseService';
-import licenseService from '@app/services/licenseService';
-import { useLicense } from '@app/contexts/LicenseContext';
-import { useLoginRequired } from '@app/hooks/useLoginRequired';
+import React, { useState } from "react";
+import {
+  Button,
+  Collapse,
+  Alert,
+  TextInput,
+  Paper,
+  Stack,
+  Group,
+  Text,
+  SegmentedControl,
+  FileButton,
+} from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import LocalIcon from "@app/components/shared/LocalIcon";
+import { alert } from "@app/components/toast";
+import { LicenseInfo } from "@app/services/licenseService";
+import licenseService from "@app/services/licenseService";
+import { useLicense } from "@app/contexts/LicenseContext";
+import { useLoginRequired } from "@app/hooks/useLoginRequired";
 
 interface LicenseKeySectionProps {
   currentLicenseInfo?: LicenseInfo;
 }
 
-const LicenseKeySection: React.FC<LicenseKeySectionProps> = ({ currentLicenseInfo }) => {
+const LicenseKeySection: React.FC<LicenseKeySectionProps> = ({
+  currentLicenseInfo,
+}) => {
   const { t } = useTranslation();
   const { refetchLicense } = useLicense();
   const { loginEnabled, validateLoginEnabled } = useLoginRequired();
   const [showLicenseKey, setShowLicenseKey] = useState(false);
-  const [licenseKeyInput, setLicenseKeyInput] = useState<string>('');
+  const [licenseKeyInput, setLicenseKeyInput] = useState<string>("");
   const [savingLicense, setSavingLicense] = useState(false);
-  const [inputMethod, setInputMethod] = useState<'text' | 'file'>('text');
+  const [inputMethod, setInputMethod] = useState<"text" | "file">("text");
   const [licenseFile, setLicenseFile] = useState<File | null>(null);
 
   const handleSaveLicense = async () => {
@@ -33,17 +46,20 @@ const LicenseKeySection: React.FC<LicenseKeySectionProps> = ({ currentLicenseInf
 
       let response;
 
-      if (inputMethod === 'file' && licenseFile) {
+      if (inputMethod === "file" && licenseFile) {
         // Upload file
         response = await licenseService.saveLicenseFile(licenseFile);
-      } else if (inputMethod === 'text' && licenseKeyInput.trim()) {
+      } else if (inputMethod === "text" && licenseKeyInput.trim()) {
         // Save key string
         response = await licenseService.saveLicenseKey(licenseKeyInput.trim());
       } else {
         alert({
-          alertType: 'error',
-          title: t('admin.error', 'Error'),
-          body: t('admin.settings.premium.noInput', 'Please provide a license key or file'),
+          alertType: "error",
+          title: t("admin.error", "Error"),
+          body: t(
+            "admin.settings.premium.noInput",
+            "Please provide a license key or file",
+          ),
         });
         return;
       }
@@ -53,33 +69,41 @@ const LicenseKeySection: React.FC<LicenseKeySectionProps> = ({ currentLicenseInf
         await refetchLicense();
 
         const successMessage =
-          inputMethod === 'file'
-            ? t('admin.settings.premium.file.successMessage', 'License file uploaded and activated successfully')
-            : t('admin.settings.premium.key.successMessage', 'License key activated successfully');
+          inputMethod === "file"
+            ? t(
+                "admin.settings.premium.file.successMessage",
+                "License file uploaded and activated successfully",
+              )
+            : t(
+                "admin.settings.premium.key.successMessage",
+                "License key activated successfully",
+              );
 
         alert({
-          alertType: 'success',
-          title: t('success', 'Success'),
+          alertType: "success",
+          title: t("success", "Success"),
           body: successMessage,
         });
 
         // Clear inputs
-        setLicenseKeyInput('');
+        setLicenseKeyInput("");
         setLicenseFile(null);
-        setInputMethod('text'); // Reset to default
+        setInputMethod("text"); // Reset to default
       } else {
         alert({
-          alertType: 'error',
-          title: t('admin.error', 'Error'),
-          body: response.error || t('admin.settings.saveError', 'Failed to save license'),
+          alertType: "error",
+          title: t("admin.error", "Error"),
+          body:
+            response.error ||
+            t("admin.settings.saveError", "Failed to save license"),
         });
       }
     } catch (error) {
-      console.error('Failed to save license:', error);
+      console.error("Failed to save license:", error);
       alert({
-        alertType: 'error',
-        title: t('admin.error', 'Error'),
-        body: t('admin.settings.saveError', 'Failed to save license'),
+        alertType: "error",
+        title: t("admin.error", "Error"),
+        body: t("admin.settings.saveError", "Failed to save license"),
       });
     } finally {
       setSavingLicense(false);
@@ -92,23 +116,32 @@ const LicenseKeySection: React.FC<LicenseKeySectionProps> = ({ currentLicenseInf
         variant="subtle"
         leftSection={
           <LocalIcon
-            icon={showLicenseKey ? 'expand-less-rounded' : 'expand-more-rounded'}
+            icon={
+              showLicenseKey ? "expand-less-rounded" : "expand-more-rounded"
+            }
             width="1.25rem"
             height="1.25rem"
           />
         }
         onClick={() => setShowLicenseKey(!showLicenseKey)}
       >
-        {t('admin.settings.premium.licenseKey.toggle', 'Got a license key or certificate file?')}
+        {t(
+          "admin.settings.premium.licenseKey.toggle",
+          "Got a license key or certificate file?",
+        )}
       </Button>
 
       <Collapse in={showLicenseKey} mt="md">
         <Stack gap="md">
-          <Alert variant="light" color="blue" icon={<LocalIcon icon="info-rounded" width="1rem" height="1rem" />}>
+          <Alert
+            variant="light"
+            color="blue"
+            icon={<LocalIcon icon="info-rounded" width="1rem" height="1rem" />}
+          >
             <Text size="sm">
               {t(
-                'admin.settings.premium.licenseKey.info',
-                'If you have a license key or certificate file from a direct purchase, you can enter it here to activate premium or enterprise features.'
+                "admin.settings.premium.licenseKey.info",
+                "If you have a license key or certificate file from a direct purchase, you can enter it here to activate premium or enterprise features.",
               )}
             </Text>
           </Alert>
@@ -118,26 +151,31 @@ const LicenseKeySection: React.FC<LicenseKeySectionProps> = ({ currentLicenseInf
             <Alert
               variant="light"
               color="red"
-              icon={<LocalIcon icon="warning-rounded" width="1rem" height="1rem" />}
-              title={t('admin.settings.premium.key.overwriteWarning.title', '⚠� Warning: Existing License Detected')}
+              icon={
+                <LocalIcon icon="warning-rounded" width="1rem" height="1rem" />
+              }
+              title={t(
+                "admin.settings.premium.key.overwriteWarning.title",
+                "⚠� Warning: Existing License Detected",
+              )}
             >
               <Stack gap="xs">
                 <Text size="sm" fw={600}>
                   {t(
-                    'admin.settings.premium.key.overwriteWarning.line1',
-                    'Overwriting your current license key cannot be undone.'
+                    "admin.settings.premium.key.overwriteWarning.line1",
+                    "Overwriting your current license key cannot be undone.",
                   )}
                 </Text>
                 <Text size="sm">
                   {t(
-                    'admin.settings.premium.key.overwriteWarning.line2',
-                    'Your previous license will be permanently lost unless you have backed it up elsewhere.'
+                    "admin.settings.premium.key.overwriteWarning.line2",
+                    "Your previous license will be permanently lost unless you have backed it up elsewhere.",
                   )}
                 </Text>
                 <Text size="sm" fw={500}>
                   {t(
-                    'admin.settings.premium.key.overwriteWarning.line3',
-                    'Important: Keep license keys private and secure. Never share them publicly.'
+                    "admin.settings.premium.key.overwriteWarning.line3",
+                    "Important: Keep license keys private and secure. Never share them publicly.",
                   )}
                 </Text>
               </Stack>
@@ -149,23 +187,43 @@ const LicenseKeySection: React.FC<LicenseKeySectionProps> = ({ currentLicenseInf
             <Alert
               variant="light"
               color="green"
-              icon={<LocalIcon icon="check-circle-rounded" width="1rem" height="1rem" />}
+              icon={
+                <LocalIcon
+                  icon="check-circle-rounded"
+                  width="1rem"
+                  height="1rem"
+                />
+              }
             >
               <Stack gap="xs">
                 <Text size="sm" fw={500}>
-                  {t('admin.settings.premium.currentLicense.title', 'Active License')}
+                  {t(
+                    "admin.settings.premium.currentLicense.title",
+                    "Active License",
+                  )}
                 </Text>
                 <Text size="xs">
-                  {currentLicenseInfo.licenseKey.startsWith('file:')
-                    ? t('admin.settings.premium.currentLicense.file', 'Source: License file ({{path}})', {
-                        path: currentLicenseInfo.licenseKey.substring(5),
-                      })
-                    : t('admin.settings.premium.currentLicense.key', 'Source: License key')}
+                  {currentLicenseInfo.licenseKey.startsWith("file:")
+                    ? t(
+                        "admin.settings.premium.currentLicense.file",
+                        "Source: License file ({{path}})",
+                        {
+                          path: currentLicenseInfo.licenseKey.substring(5),
+                        },
+                      )
+                    : t(
+                        "admin.settings.premium.currentLicense.key",
+                        "Source: License key",
+                      )}
                 </Text>
                 <Text size="xs">
-                  {t('admin.settings.premium.currentLicense.type', 'Type: {{type}}', {
-                    type: currentLicenseInfo.licenseType,
-                  })}
+                  {t(
+                    "admin.settings.premium.currentLicense.type",
+                    "Type: {{type}}",
+                    {
+                      type: currentLicenseInfo.licenseType,
+                    },
+                  )}
                 </Text>
               </Stack>
             </Alert>
@@ -175,19 +233,25 @@ const LicenseKeySection: React.FC<LicenseKeySectionProps> = ({ currentLicenseInf
           <SegmentedControl
             value={inputMethod}
             onChange={(value) => {
-              setInputMethod(value as 'text' | 'file');
+              setInputMethod(value as "text" | "file");
               // Clear opposite input when switching
-              if (value === 'text') setLicenseFile(null);
-              if (value === 'file') setLicenseKeyInput('');
+              if (value === "text") setLicenseFile(null);
+              if (value === "file") setLicenseKeyInput("");
             }}
             data={[
               {
-                label: t('admin.settings.premium.inputMethod.text', 'License Key'),
-                value: 'text',
+                label: t(
+                  "admin.settings.premium.inputMethod.text",
+                  "License Key",
+                ),
+                value: "text",
               },
               {
-                label: t('admin.settings.premium.inputMethod.file', 'Certificate File'),
-                value: 'file',
+                label: t(
+                  "admin.settings.premium.inputMethod.file",
+                  "Certificate File",
+                ),
+                value: "file",
               },
             ]}
             disabled={!loginEnabled || savingLicense}
@@ -196,17 +260,20 @@ const LicenseKeySection: React.FC<LicenseKeySectionProps> = ({ currentLicenseInf
           {/* Input area */}
           <Paper withBorder p="md" radius="md">
             <Stack gap="md">
-              {inputMethod === 'text' ? (
+              {inputMethod === "text" ? (
                 /* Text input */
                 <TextInput
-                  label={t('admin.settings.premium.key.label', 'License Key')}
+                  label={t("admin.settings.premium.key.label", "License Key")}
                   description={t(
-                    'admin.settings.premium.key.description',
-                    'Enter your premium or enterprise license key. Premium features will be automatically enabled when a key is provided.'
+                    "admin.settings.premium.key.description",
+                    "Enter your premium or enterprise license key. Premium features will be automatically enabled when a key is provided.",
                   )}
                   value={licenseKeyInput}
                   onChange={(e) => setLicenseKeyInput(e.target.value)}
-                  placeholder={currentLicenseInfo?.licenseKey || '00000000-0000-0000-0000-000000000000'}
+                  placeholder={
+                    currentLicenseInfo?.licenseKey ||
+                    "00000000-0000-0000-0000-000000000000"
+                  }
                   type="password"
                   disabled={!loginEnabled || savingLicense}
                 />
@@ -214,10 +281,16 @@ const LicenseKeySection: React.FC<LicenseKeySectionProps> = ({ currentLicenseInf
                 /* File upload */
                 <div>
                   <Text size="sm" fw={500} mb="xs">
-                    {t('admin.settings.premium.file.label', 'License Certificate File')}
+                    {t(
+                      "admin.settings.premium.file.label",
+                      "License Certificate File",
+                    )}
                   </Text>
                   <Text size="xs" c="dimmed" mb="md">
-                    {t('admin.settings.premium.file.description', 'Upload your .lic or .cert license file')}
+                    {t(
+                      "admin.settings.premium.file.description",
+                      "Upload your .lic or .cert license file",
+                    )}
                   </Text>
                   <FileButton
                     onChange={setLicenseFile}
@@ -228,21 +301,34 @@ const LicenseKeySection: React.FC<LicenseKeySectionProps> = ({ currentLicenseInf
                       <Button
                         {...props}
                         variant="outline"
-                        leftSection={<LocalIcon icon="upload-file-rounded" width="1rem" height="1rem" />}
+                        leftSection={
+                          <LocalIcon
+                            icon="upload-file-rounded"
+                            width="1rem"
+                            height="1rem"
+                          />
+                        }
                         disabled={!loginEnabled || savingLicense}
                       >
                         {licenseFile
                           ? licenseFile.name
-                          : t('admin.settings.premium.file.choose', 'Choose License File')}
+                          : t(
+                              "admin.settings.premium.file.choose",
+                              "Choose License File",
+                            )}
                       </Button>
                     )}
                   </FileButton>
                   {licenseFile && (
                     <Text size="xs" c="dimmed" mt="xs">
-                      {t('admin.settings.premium.file.selected', 'Selected: {{filename}} ({{size}})', {
-                        filename: licenseFile.name,
-                        size: (licenseFile.size / 1024).toFixed(2) + ' KB',
-                      })}
+                      {t(
+                        "admin.settings.premium.file.selected",
+                        "Selected: {{filename}} ({{size}})",
+                        {
+                          filename: licenseFile.name,
+                          size: (licenseFile.size / 1024).toFixed(2) + " KB",
+                        },
+                      )}
                     </Text>
                   )}
                 </div>
@@ -255,11 +341,11 @@ const LicenseKeySection: React.FC<LicenseKeySectionProps> = ({ currentLicenseInf
                   size="sm"
                   disabled={
                     !loginEnabled ||
-                    (inputMethod === 'text' && !licenseKeyInput.trim()) ||
-                    (inputMethod === 'file' && !licenseFile)
+                    (inputMethod === "text" && !licenseKeyInput.trim()) ||
+                    (inputMethod === "file" && !licenseFile)
                   }
                 >
-                  {t('admin.settings.save', 'Save Changes')}
+                  {t("admin.settings.save", "Save Changes")}
                 </Button>
               </Group>
             </Stack>
diff --git a/frontend/src/proprietary/components/shared/config/configSections/plan/PlanCard.tsx b/frontend/src/proprietary/components/shared/config/configSections/plan/PlanCard.tsx
index b2dce9c658..84a8abe5e5 100644
--- a/frontend/src/proprietary/components/shared/config/configSections/plan/PlanCard.tsx
+++ b/frontend/src/proprietary/components/shared/config/configSections/plan/PlanCard.tsx
@@ -1,31 +1,40 @@
-import React from 'react';
-import { Button, Card, Text, Stack, Divider, Tooltip } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { PlanTierGroup, LicenseInfo } from '@app/services/licenseService';
-import { PricingBadge } from '@app/components/shared/stripeCheckout/components/PricingBadge';
-import { PriceDisplay } from '@app/components/shared/stripeCheckout/components/PriceDisplay';
-import { calculateDisplayPricing } from '@app/components/shared/stripeCheckout/utils/pricingUtils';
-import { getBaseCardStyle } from '@app/components/shared/stripeCheckout/utils/cardStyles';
-import { isEnterpriseBlockedForFree as checkIsEnterpriseBlockedForFree } from '@app/utils/planTierUtils';
+import React from "react";
+import { Button, Card, Text, Stack, Divider, Tooltip } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import { PlanTierGroup, LicenseInfo } from "@app/services/licenseService";
+import { PricingBadge } from "@app/components/shared/stripeCheckout/components/PricingBadge";
+import { PriceDisplay } from "@app/components/shared/stripeCheckout/components/PriceDisplay";
+import { calculateDisplayPricing } from "@app/components/shared/stripeCheckout/utils/pricingUtils";
+import { getBaseCardStyle } from "@app/components/shared/stripeCheckout/utils/cardStyles";
+import { isEnterpriseBlockedForFree as checkIsEnterpriseBlockedForFree } from "@app/utils/planTierUtils";
 
 interface PlanCardProps {
   planGroup: PlanTierGroup;
   isCurrentTier: boolean;
   isDowngrade: boolean;
   currentLicenseInfo?: LicenseInfo | null;
-  currentTier?: 'free' | 'server' | 'enterprise' | null;
+  currentTier?: "free" | "server" | "enterprise" | null;
   onUpgradeClick: (planGroup: PlanTierGroup) => void;
   onManageClick?: () => void;
   loginEnabled?: boolean;
 }
 
-const PlanCard: React.FC<PlanCardProps> = ({ planGroup, isCurrentTier, isDowngrade, currentLicenseInfo, currentTier, onUpgradeClick, onManageClick, loginEnabled = true }) => {
+const PlanCard: React.FC<PlanCardProps> = ({
+  planGroup,
+  isCurrentTier,
+  isDowngrade,
+  currentLicenseInfo,
+  currentTier,
+  onUpgradeClick,
+  onManageClick,
+  loginEnabled = true,
+}) => {
   const { t } = useTranslation();
 
   // Render Free plan
-  if (planGroup.tier === 'free') {
+  if (planGroup.tier === "free") {
     // Get currency from the free plan
-    const freeCurrency = planGroup.monthly?.currency || '$';
+    const freeCurrency = planGroup.monthly?.currency || "$";
 
     return (
       <Card
@@ -38,22 +47,22 @@ const PlanCard: React.FC<PlanCardProps> = ({ planGroup, isCurrentTier, isDowngra
         {isCurrentTier && (
           <PricingBadge
             type="current"
-            label={t('plan.current', 'Current Plan')}
+            label={t("plan.current", "Current Plan")}
           />
         )}
-        <Stack gap="md" style={{ height: '100%' }}>
+        <Stack gap="md" style={{ height: "100%" }}>
           <div>
             <Text size="xl" fw={700} mb="xs">
               {planGroup.name}
             </Text>
             <Text size="xs" c="dimmed" mb="xs" style={{ opacity: 0 }}>
-              {t('plan.from', 'From')}
+              {t("plan.from", "From")}
             </Text>
             <PriceDisplay
               mode="simple"
               price={0}
               currency={freeCurrency}
-              period={t('plan.free.forever', 'Forever free')}
+              period={t("plan.free.forever", "Forever free")}
             />
           </div>
 
@@ -71,8 +80,8 @@ const PlanCard: React.FC<PlanCardProps> = ({ planGroup, isCurrentTier, isDowngra
 
           <Button variant="filled" disabled fullWidth className="plan-button">
             {isCurrentTier
-              ? t('plan.current', 'Current Plan')
-              : t('plan.free.included', 'Included')}
+              ? t("plan.current", "Current Plan")
+              : t("plan.free.included", "Included")}
           </Button>
         </Stack>
       </Card>
@@ -81,16 +90,17 @@ const PlanCard: React.FC<PlanCardProps> = ({ planGroup, isCurrentTier, isDowngra
 
   // Render Server or Enterprise plans
   const { monthly, yearly } = planGroup;
-  const isEnterprise = planGroup.tier === 'enterprise';
+  const isEnterprise = planGroup.tier === "enterprise";
 
   // Block enterprise for free tier users (must have server first)
-  const isEnterpriseBlockedForFree = checkIsEnterpriseBlockedForFree(currentTier, planGroup.tier);
+  const isEnterpriseBlockedForFree = checkIsEnterpriseBlockedForFree(
+    currentTier,
+    planGroup.tier,
+  );
 
   // Calculate "From" pricing - show yearly price divided by 12 for lowest monthly equivalent
-  const { displayPrice, displaySeatPrice, displayCurrency } = calculateDisplayPricing(
-    monthly || undefined,
-    yearly || undefined
-  );
+  const { displayPrice, displaySeatPrice, displayCurrency } =
+    calculateDisplayPricing(monthly || undefined, yearly || undefined);
 
   return (
     <Card
@@ -103,16 +113,14 @@ const PlanCard: React.FC<PlanCardProps> = ({ planGroup, isCurrentTier, isDowngra
       {isCurrentTier ? (
         <PricingBadge
           type="current"
-          label={t('plan.current', 'Current Plan')}
-        />
-      ) : planGroup.popular && !(planGroup.tier === 'server' && currentTier === 'enterprise') ? (
-        <PricingBadge
-          type="popular"
-          label={t('plan.popular', 'Popular')}
+          label={t("plan.current", "Current Plan")}
         />
+      ) : planGroup.popular &&
+        !(planGroup.tier === "server" && currentTier === "enterprise") ? (
+        <PricingBadge type="popular" label={t("plan.popular", "Popular")} />
       ) : null}
 
-      <Stack gap="md" style={{ height: '100%' }}>
+      <Stack gap="md" style={{ height: "100%" }}>
         {/* Tier Name */}
         <div>
           <Text size="xl" fw={700} mb="xs">
@@ -120,20 +128,22 @@ const PlanCard: React.FC<PlanCardProps> = ({ planGroup, isCurrentTier, isDowngra
           </Text>
 
           <Text size="xs" c="dimmed" mb="xs">
-            {t('plan.from', 'From')}
+            {t("plan.from", "From")}
           </Text>
 
           {/* Price */}
           {isEnterprise && displaySeatPrice !== undefined ? (
             <>
               <Text span size="2.25rem" fw={600} style={{ lineHeight: 1 }}>
-                {displayCurrency}{displaySeatPrice.toFixed(2)}
+                {displayCurrency}
+                {displaySeatPrice.toFixed(2)}
               </Text>
               <Text span size="1.5rem" c="dimmed" mt="xs">
-                {t('plan.perSeat', '/seat')}
+                {t("plan.perSeat", "/seat")}
               </Text>
               <Text size="sm" c="dimmed" mt="xs">
-                {t('plan.perMonth', '/month')} {t('plan.withServer', '+ Server Plan')}
+                {t("plan.perMonth", "/month")}{" "}
+                {t("plan.withServer", "+ Server Plan")}
               </Text>
             </>
           ) : (
@@ -141,7 +151,7 @@ const PlanCard: React.FC<PlanCardProps> = ({ planGroup, isCurrentTier, isDowngra
               mode="simple"
               price={displayPrice}
               currency={displayCurrency}
-              period={t('plan.perMonth', '/month')}
+              period={t("plan.perMonth", "/month")}
             />
           )}
         </div>
@@ -159,40 +169,50 @@ const PlanCard: React.FC<PlanCardProps> = ({ planGroup, isCurrentTier, isDowngra
 
         <div style={{ flexGrow: 1 }} />
 
-      <Stack gap="xs">
-        {/* Show seat count for enterprise plans when current */}
-        {isEnterprise && isCurrentTier && currentLicenseInfo && currentLicenseInfo.maxUsers > 0 && (
-          <Text size="sm" c="green" fw={500} ta="center">
-            {t('plan.licensedSeats', 'Licensed: {{count}} seats', { count: currentLicenseInfo.maxUsers })}
-          </Text>
-        )}
+        <Stack gap="xs">
+          {/* Show seat count for enterprise plans when current */}
+          {isEnterprise &&
+            isCurrentTier &&
+            currentLicenseInfo &&
+            currentLicenseInfo.maxUsers > 0 && (
+              <Text size="sm" c="green" fw={500} ta="center">
+                {t("plan.licensedSeats", "Licensed: {{count}} seats", {
+                  count: currentLicenseInfo.maxUsers,
+                })}
+              </Text>
+            )}
 
-        {/* Single Upgrade Button */}
-        <Tooltip
-          label={t('plan.enterprise.requiresServer', 'Requires Server plan')}
-          disabled={!isEnterpriseBlockedForFree}
-          position="top"
-          withArrow
-        >
-          <Button
-            variant="filled"
-            fullWidth
-            onClick={() => isCurrentTier && onManageClick ? onManageClick() : onUpgradeClick(planGroup)}
-            disabled={!loginEnabled || isDowngrade || isEnterpriseBlockedForFree}
-            className="plan-button"
+          {/* Single Upgrade Button */}
+          <Tooltip
+            label={t("plan.enterprise.requiresServer", "Requires Server plan")}
+            disabled={!isEnterpriseBlockedForFree}
+            position="top"
+            withArrow
           >
-            {isCurrentTier
-              ? t('plan.manage', 'Manage')
-              : isDowngrade
-                ? t('plan.free.included', 'Included')
-                : isEnterpriseBlockedForFree
-                  ? t('plan.enterprise.requiresServer', 'Requires Server')
-                  : isEnterprise
-                    ? t('plan.selectPlan', 'Select Plan')
-                    : t('plan.upgrade', 'Upgrade')}
-          </Button>
-        </Tooltip>
-
+            <Button
+              variant="filled"
+              fullWidth
+              onClick={() =>
+                isCurrentTier && onManageClick
+                  ? onManageClick()
+                  : onUpgradeClick(planGroup)
+              }
+              disabled={
+                !loginEnabled || isDowngrade || isEnterpriseBlockedForFree
+              }
+              className="plan-button"
+            >
+              {isCurrentTier
+                ? t("plan.manage", "Manage")
+                : isDowngrade
+                  ? t("plan.free.included", "Included")
+                  : isEnterpriseBlockedForFree
+                    ? t("plan.enterprise.requiresServer", "Requires Server")
+                    : isEnterprise
+                      ? t("plan.selectPlan", "Select Plan")
+                      : t("plan.upgrade", "Upgrade")}
+            </Button>
+          </Tooltip>
         </Stack>
       </Stack>
     </Card>
diff --git a/frontend/src/proprietary/components/shared/config/configSections/plan/StaticCheckoutModal.tsx b/frontend/src/proprietary/components/shared/config/configSections/plan/StaticCheckoutModal.tsx
index b9f46bc7c6..dbac0833ce 100644
--- a/frontend/src/proprietary/components/shared/config/configSections/plan/StaticCheckoutModal.tsx
+++ b/frontend/src/proprietary/components/shared/config/configSections/plan/StaticCheckoutModal.tsx
@@ -1,25 +1,39 @@
-import React, { useState } from 'react';
-import { Modal, Text, Group, ActionIcon, Stack, Paper, Grid, TextInput, Button, Alert } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import LocalIcon from '@app/components/shared/LocalIcon';
-import { EmailStage } from '@app/components/shared/stripeCheckout/stages/EmailStage';
-import { validateEmail } from '@app/components/shared/stripeCheckout/utils/checkoutUtils';
-import { getClickablePaperStyle } from '@app/components/shared/stripeCheckout/utils/cardStyles';
-import { STATIC_STRIPE_LINKS, buildStripeUrlWithEmail } from '@app/constants/staticStripeLinks';
-import { alert } from '@app/components/toast';
-import { Z_INDEX_OVER_CONFIG_MODAL } from '@app/styles/zIndex';
-import { useIsMobile } from '@app/hooks/useIsMobile';
-import licenseService from '@app/services/licenseService';
-import { useLicense } from '@app/contexts/LicenseContext';
+import React, { useState } from "react";
+import {
+  Modal,
+  Text,
+  Group,
+  ActionIcon,
+  Stack,
+  Paper,
+  Grid,
+  TextInput,
+  Button,
+  Alert,
+} from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import LocalIcon from "@app/components/shared/LocalIcon";
+import { EmailStage } from "@app/components/shared/stripeCheckout/stages/EmailStage";
+import { validateEmail } from "@app/components/shared/stripeCheckout/utils/checkoutUtils";
+import { getClickablePaperStyle } from "@app/components/shared/stripeCheckout/utils/cardStyles";
+import {
+  STATIC_STRIPE_LINKS,
+  buildStripeUrlWithEmail,
+} from "@app/constants/staticStripeLinks";
+import { alert } from "@app/components/toast";
+import { Z_INDEX_OVER_CONFIG_MODAL } from "@app/styles/zIndex";
+import { useIsMobile } from "@app/hooks/useIsMobile";
+import licenseService from "@app/services/licenseService";
+import { useLicense } from "@app/contexts/LicenseContext";
 
 interface StaticCheckoutModalProps {
   opened: boolean;
   onClose: () => void;
-  planName: 'server' | 'enterprise';
+  planName: "server" | "enterprise";
   isUpgrade?: boolean;
 }
 
-type Stage = 'email' | 'period-selection' | 'license-activation';
+type Stage = "email" | "period-selection" | "license-activation";
 
 const StaticCheckoutModal: React.FC<StaticCheckoutModalProps> = ({
   opened,
@@ -31,45 +45,48 @@ const StaticCheckoutModal: React.FC<StaticCheckoutModalProps> = ({
   const isMobile = useIsMobile();
   const { refetchLicense } = useLicense();
 
-  const [stage, setStage] = useState<Stage>('email');
-  const [email, setEmail] = useState('');
-  const [emailError, setEmailError] = useState('');
+  const [stage, setStage] = useState<Stage>("email");
+  const [email, setEmail] = useState("");
+  const [emailError, setEmailError] = useState("");
   const [stageHistory, setStageHistory] = useState<Stage[]>([]);
 
   // License activation state
-  const [licenseKey, setLicenseKey] = useState('');
+  const [licenseKey, setLicenseKey] = useState("");
   const [savingLicense, setSavingLicense] = useState(false);
   const [licenseActivated, setLicenseActivated] = useState(false);
 
   const handleEmailSubmit = () => {
     const validation = validateEmail(email);
     if (validation.valid) {
-      setEmailError('');
-      setStageHistory([...stageHistory, 'email']);
-      setStage('period-selection');
+      setEmailError("");
+      setStageHistory([...stageHistory, "email"]);
+      setStage("period-selection");
     } else {
       setEmailError(validation.error);
     }
   };
 
-  const handlePeriodSelect = (period: 'monthly' | 'yearly') => {
+  const handlePeriodSelect = (period: "monthly" | "yearly") => {
     const baseUrl = STATIC_STRIPE_LINKS[planName][period];
     const urlWithEmail = buildStripeUrlWithEmail(baseUrl, email);
 
     // Open Stripe checkout in new tab
-    window.open(urlWithEmail, '_blank');
+    window.open(urlWithEmail, "_blank");
 
     // Transition to license activation stage
-    setStageHistory([...stageHistory, 'period-selection']);
-    setStage('license-activation');
+    setStageHistory([...stageHistory, "period-selection"]);
+    setStage("license-activation");
   };
 
   const handleActivateLicense = async () => {
     if (!licenseKey.trim()) {
       alert({
-        alertType: 'error',
-        title: t('admin.error', 'Error'),
-        body: t('admin.settings.premium.noInput', 'Please provide a license key'),
+        alertType: "error",
+        title: t("admin.error", "Error"),
+        body: t(
+          "admin.settings.premium.noInput",
+          "Please provide a license key",
+        ),
       });
       return;
     }
@@ -85,26 +102,28 @@ const StaticCheckoutModal: React.FC<StaticCheckoutModalProps> = ({
         setLicenseActivated(true);
 
         alert({
-          alertType: 'success',
-          title: t('success', 'Success'),
+          alertType: "success",
+          title: t("success", "Success"),
           body: t(
-            'admin.settings.premium.key.successMessage',
-            'License key activated successfully'
+            "admin.settings.premium.key.successMessage",
+            "License key activated successfully",
           ),
         });
       } else {
         alert({
-          alertType: 'error',
-          title: t('admin.error', 'Error'),
-          body: response.error || t('admin.settings.saveError', 'Failed to save license'),
+          alertType: "error",
+          title: t("admin.error", "Error"),
+          body:
+            response.error ||
+            t("admin.settings.saveError", "Failed to save license"),
         });
       }
     } catch (error) {
-      console.error('Failed to save license:', error);
+      console.error("Failed to save license:", error);
       alert({
-        alertType: 'error',
-        title: t('admin.error', 'Error'),
-        body: t('admin.settings.saveError', 'Failed to save license'),
+        alertType: "error",
+        title: t("admin.error", "Error"),
+        body: t("admin.settings.saveError", "Failed to save license"),
       });
     } finally {
       setSavingLicense(false);
@@ -124,37 +143,37 @@ const StaticCheckoutModal: React.FC<StaticCheckoutModalProps> = ({
 
   const handleClose = () => {
     // Reset state when closing
-    setStage('email');
-    setEmail('');
-    setEmailError('');
+    setStage("email");
+    setEmail("");
+    setEmailError("");
     setStageHistory([]);
-    setLicenseKey('');
+    setLicenseKey("");
     setSavingLicense(false);
     setLicenseActivated(false);
     onClose();
   };
 
   const getModalTitle = () => {
-    if (stage === 'email') {
+    if (stage === "email") {
       if (isUpgrade) {
-        return t('plan.static.upgradeToEnterprise', 'Upgrade to Enterprise');
+        return t("plan.static.upgradeToEnterprise", "Upgrade to Enterprise");
       }
-      return planName === 'server'
-        ? t('plan.static.getLicense', 'Get Server License')
-        : t('plan.static.upgradeToEnterprise', 'Upgrade to Enterprise');
+      return planName === "server"
+        ? t("plan.static.getLicense", "Get Server License")
+        : t("plan.static.upgradeToEnterprise", "Upgrade to Enterprise");
     }
-    if (stage === 'period-selection') {
-      return t('plan.static.selectPeriod', 'Select Billing Period');
+    if (stage === "period-selection") {
+      return t("plan.static.selectPeriod", "Select Billing Period");
     }
-    if (stage === 'license-activation') {
-      return t('plan.static.activateLicense', 'Activate Your License');
+    if (stage === "license-activation") {
+      return t("plan.static.activateLicense", "Activate Your License");
     }
-    return '';
+    return "";
   };
 
   const renderContent = () => {
     switch (stage) {
-      case 'email':
+      case "email":
         return (
           <EmailStage
             emailInput={email}
@@ -164,10 +183,10 @@ const StaticCheckoutModal: React.FC<StaticCheckoutModalProps> = ({
           />
         );
 
-      case 'period-selection':
+      case "period-selection":
         return (
-          <Stack gap="lg" style={{ padding: '1rem 2rem' }}>
-            <Grid gutter="xl" style={{ marginTop: '1rem' }}>
+          <Stack gap="lg" style={{ padding: "1rem 2rem" }}>
+            <Grid gutter="xl" style={{ marginTop: "1rem" }}>
               {/* Monthly Option */}
               <Grid.Col span={6}>
                 <Paper
@@ -175,14 +194,18 @@ const StaticCheckoutModal: React.FC<StaticCheckoutModalProps> = ({
                   p="xl"
                   radius="md"
                   style={getClickablePaperStyle()}
-                  onClick={() => handlePeriodSelect('monthly')}
+                  onClick={() => handlePeriodSelect("monthly")}
                 >
-                  <Stack gap="md" style={{ height: '100%', minHeight: '120px' }} justify="space-between">
+                  <Stack
+                    gap="md"
+                    style={{ height: "100%", minHeight: "120px" }}
+                    justify="space-between"
+                  >
                     <Text size="lg" fw={600}>
-                      {t('payment.monthly', 'Monthly')}
+                      {t("payment.monthly", "Monthly")}
                     </Text>
                     <Text size="sm" c="dimmed">
-                      {t('plan.static.monthlyBilling', 'Monthly Billing')}
+                      {t("plan.static.monthlyBilling", "Monthly Billing")}
                     </Text>
                   </Stack>
                 </Paper>
@@ -195,14 +218,18 @@ const StaticCheckoutModal: React.FC<StaticCheckoutModalProps> = ({
                   p="xl"
                   radius="md"
                   style={getClickablePaperStyle()}
-                  onClick={() => handlePeriodSelect('yearly')}
+                  onClick={() => handlePeriodSelect("yearly")}
                 >
-                  <Stack gap="md" style={{ height: '100%', minHeight: '120px' }} justify="space-between">
+                  <Stack
+                    gap="md"
+                    style={{ height: "100%", minHeight: "120px" }}
+                    justify="space-between"
+                  >
                     <Text size="lg" fw={600}>
-                      {t('payment.yearly', 'Yearly')}
+                      {t("payment.yearly", "Yearly")}
                     </Text>
                     <Text size="sm" c="dimmed">
-                      {t('plan.static.yearlyBilling', 'Yearly Billing')}
+                      {t("plan.static.yearlyBilling", "Yearly Billing")}
                     </Text>
                   </Stack>
                 </Paper>
@@ -211,22 +238,30 @@ const StaticCheckoutModal: React.FC<StaticCheckoutModalProps> = ({
           </Stack>
         );
 
-      case 'license-activation':
+      case "license-activation":
         return (
-          <Stack gap="lg" style={{ padding: '2rem', maxWidth: '600px', margin: '0 auto' }}>
+          <Stack
+            gap="lg"
+            style={{ padding: "2rem", maxWidth: "600px", margin: "0 auto" }}
+          >
             <Alert
               variant="light"
               color="blue"
-              icon={<LocalIcon icon="info-rounded" width="1rem" height="1rem" />}
+              icon={
+                <LocalIcon icon="info-rounded" width="1rem" height="1rem" />
+              }
             >
               <Stack gap="sm">
                 <Text size="sm" fw={600}>
-                  {t('plan.static.licenseActivation.checkoutOpened', 'Checkout Opened in New Tab')}
+                  {t(
+                    "plan.static.licenseActivation.checkoutOpened",
+                    "Checkout Opened in New Tab",
+                  )}
                 </Text>
                 <Text size="sm">
                   {t(
-                    'plan.static.licenseActivation.instructions',
-                    'Complete your purchase in the Stripe tab. Once your payment is complete, you will receive an email with your license key.'
+                    "plan.static.licenseActivation.instructions",
+                    "Complete your purchase in the Stripe tab. Once your payment is complete, you will receive an email with your license key.",
                   )}
                 </Text>
               </Stack>
@@ -236,13 +271,22 @@ const StaticCheckoutModal: React.FC<StaticCheckoutModalProps> = ({
               <Alert
                 variant="light"
                 color="green"
-                icon={<LocalIcon icon="check-circle-rounded" width="1rem" height="1rem" />}
-                title={t('plan.static.licenseActivation.success', 'License Activated!')}
+                icon={
+                  <LocalIcon
+                    icon="check-circle-rounded"
+                    width="1rem"
+                    height="1rem"
+                  />
+                }
+                title={t(
+                  "plan.static.licenseActivation.success",
+                  "License Activated!",
+                )}
               >
                 <Text size="sm">
                   {t(
-                    'plan.static.licenseActivation.successMessage',
-                    'Your license has been successfully activated. You can now close this window.'
+                    "plan.static.licenseActivation.successMessage",
+                    "Your license has been successfully activated. You can now close this window.",
                   )}
                 </Text>
               </Alert>
@@ -250,16 +294,16 @@ const StaticCheckoutModal: React.FC<StaticCheckoutModalProps> = ({
               <Stack gap="md">
                 <Text size="sm" fw={500}>
                   {t(
-                    'plan.static.licenseActivation.enterKey',
-                    'Enter your license key below to activate your plan:'
+                    "plan.static.licenseActivation.enterKey",
+                    "Enter your license key below to activate your plan:",
                   )}
                 </Text>
 
                 <TextInput
-                  label={t('admin.settings.premium.key.label', 'License Key')}
+                  label={t("admin.settings.premium.key.label", "License Key")}
                   description={t(
-                    'plan.static.licenseActivation.keyDescription',
-                    'Paste the license key from your email'
+                    "plan.static.licenseActivation.keyDescription",
+                    "Paste the license key from your email",
                   )}
                   value={licenseKey}
                   onChange={(e) => setLicenseKey(e.target.value)}
@@ -269,15 +313,25 @@ const StaticCheckoutModal: React.FC<StaticCheckoutModalProps> = ({
                 />
 
                 <Group justify="space-between">
-                  <Button variant="subtle" onClick={handleClose} disabled={savingLicense}>
-                    {t('plan.static.licenseActivation.doLater', "I'll do this later")}
+                  <Button
+                    variant="subtle"
+                    onClick={handleClose}
+                    disabled={savingLicense}
+                  >
+                    {t(
+                      "plan.static.licenseActivation.doLater",
+                      "I'll do this later",
+                    )}
                   </Button>
                   <Button
                     onClick={handleActivateLicense}
                     loading={savingLicense}
                     disabled={!licenseKey.trim()}
                   >
-                    {t('plan.static.licenseActivation.activate', 'Activate License')}
+                    {t(
+                      "plan.static.licenseActivation.activate",
+                      "Activate License",
+                    )}
                   </Button>
                 </Group>
               </Stack>
@@ -286,7 +340,7 @@ const StaticCheckoutModal: React.FC<StaticCheckoutModalProps> = ({
             {licenseActivated && (
               <Group justify="flex-end">
                 <Button onClick={handleClose}>
-                  {t('common.close', 'Close')}
+                  {t("common.close", "Close")}
                 </Button>
               </Group>
             )}
@@ -298,7 +352,7 @@ const StaticCheckoutModal: React.FC<StaticCheckoutModalProps> = ({
     }
   };
 
-  const canGoBack = stageHistory.length > 0 && stage !== 'license-activation';
+  const canGoBack = stageHistory.length > 0 && stage !== "license-activation";
 
   return (
     <Modal
@@ -311,7 +365,7 @@ const StaticCheckoutModal: React.FC<StaticCheckoutModalProps> = ({
               variant="subtle"
               size="lg"
               onClick={handleGoBack}
-              aria-label={t('common.back', 'Back')}
+              aria-label={t("common.back", "Back")}
             >
               <LocalIcon icon="arrow-back" width={20} height={20} />
             </ActionIcon>
@@ -321,7 +375,7 @@ const StaticCheckoutModal: React.FC<StaticCheckoutModalProps> = ({
           </Text>
         </Group>
       }
-      size={isMobile ? '100%' : 600}
+      size={isMobile ? "100%" : 600}
       centered
       radius="lg"
       withCloseButton={true}
diff --git a/frontend/src/proprietary/components/shared/config/configSections/plan/StaticPlanSection.tsx b/frontend/src/proprietary/components/shared/config/configSections/plan/StaticPlanSection.tsx
index 2847ef94e8..7a249144b5 100644
--- a/frontend/src/proprietary/components/shared/config/configSections/plan/StaticPlanSection.tsx
+++ b/frontend/src/proprietary/components/shared/config/configSections/plan/StaticPlanSection.tsx
@@ -1,40 +1,59 @@
-import React, { useState } from 'react';
-import { Card, Text, Stack, Button, Collapse, Divider, Tooltip } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { alert } from '@app/components/toast';
-import { LicenseInfo, mapLicenseToTier } from '@app/services/licenseService';
-import { PLAN_FEATURES, PLAN_HIGHLIGHTS } from '@app/constants/planConstants';
-import FeatureComparisonTable from '@app/components/shared/config/configSections/plan/FeatureComparisonTable';
-import StaticCheckoutModal from '@app/components/shared/config/configSections/plan/StaticCheckoutModal';
-import LicenseKeySection from '@app/components/shared/config/configSections/plan/LicenseKeySection';
-import { STATIC_STRIPE_LINKS } from '@app/constants/staticStripeLinks';
-import { PricingBadge } from '@app/components/shared/stripeCheckout/components/PricingBadge';
-import { getBaseCardStyle } from '@app/components/shared/stripeCheckout/utils/cardStyles';
-import { isCurrentTier as checkIsCurrentTier, isDowngrade as checkIsDowngrade, isEnterpriseBlockedForFree } from '@app/utils/planTierUtils';
+import React, { useState } from "react";
+import {
+  Card,
+  Text,
+  Stack,
+  Button,
+  Collapse,
+  Divider,
+  Tooltip,
+} from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import { alert } from "@app/components/toast";
+import { LicenseInfo, mapLicenseToTier } from "@app/services/licenseService";
+import { PLAN_FEATURES, PLAN_HIGHLIGHTS } from "@app/constants/planConstants";
+import FeatureComparisonTable from "@app/components/shared/config/configSections/plan/FeatureComparisonTable";
+import StaticCheckoutModal from "@app/components/shared/config/configSections/plan/StaticCheckoutModal";
+import LicenseKeySection from "@app/components/shared/config/configSections/plan/LicenseKeySection";
+import { STATIC_STRIPE_LINKS } from "@app/constants/staticStripeLinks";
+import { PricingBadge } from "@app/components/shared/stripeCheckout/components/PricingBadge";
+import { getBaseCardStyle } from "@app/components/shared/stripeCheckout/utils/cardStyles";
+import {
+  isCurrentTier as checkIsCurrentTier,
+  isDowngrade as checkIsDowngrade,
+  isEnterpriseBlockedForFree,
+} from "@app/utils/planTierUtils";
 
 interface StaticPlanSectionProps {
   currentLicenseInfo?: LicenseInfo;
 }
 
-const StaticPlanSection: React.FC<StaticPlanSectionProps> = ({ currentLicenseInfo }) => {
+const StaticPlanSection: React.FC<StaticPlanSectionProps> = ({
+  currentLicenseInfo,
+}) => {
   const { t } = useTranslation();
   const [showComparison, setShowComparison] = useState(false);
 
   // Static checkout modal state
   const [checkoutModalOpened, setCheckoutModalOpened] = useState(false);
-  const [selectedPlan, setSelectedPlan] = useState<'server' | 'enterprise'>('server');
+  const [selectedPlan, setSelectedPlan] = useState<"server" | "enterprise">(
+    "server",
+  );
   const [isUpgrade, setIsUpgrade] = useState(false);
 
-  const handleOpenCheckout = (plan: 'server' | 'enterprise', upgrade: boolean) => {
+  const handleOpenCheckout = (
+    plan: "server" | "enterprise",
+    upgrade: boolean,
+  ) => {
     // Prevent Free → Enterprise (must have Server first)
     const currentTier = mapLicenseToTier(currentLicenseInfo || null);
-    if (currentTier === 'free' && plan === 'enterprise') {
+    if (currentTier === "free" && plan === "enterprise") {
       alert({
-        alertType: 'warning',
-        title: t('plan.enterprise.requiresServer', 'Server Plan Required'),
+        alertType: "warning",
+        title: t("plan.enterprise.requiresServer", "Server Plan Required"),
         body: t(
-          'plan.enterprise.requiresServerMessage',
-          'Please upgrade to the Server plan first before upgrading to Enterprise.'
+          "plan.enterprise.requiresServerMessage",
+          "Please upgrade to the Server plan first before upgrading to Enterprise.",
         ),
       });
       return;
@@ -48,84 +67,95 @@ const StaticPlanSection: React.FC<StaticPlanSectionProps> = ({ currentLicenseInf
   const handleManageBilling = () => {
     // Show warning about email verification
     alert({
-      alertType: 'warning',
-      title: t('plan.static.billingPortal.title', 'Email Verification Required'),
+      alertType: "warning",
+      title: t(
+        "plan.static.billingPortal.title",
+        "Email Verification Required",
+      ),
       body: t(
-        'plan.static.billingPortal.message',
-        'You will need to verify your email address in the Stripe billing portal. Check your email for a login link.'
+        "plan.static.billingPortal.message",
+        "You will need to verify your email address in the Stripe billing portal. Check your email for a login link.",
       ),
     });
 
-    window.open(STATIC_STRIPE_LINKS.billingPortal, '_blank');
+    window.open(STATIC_STRIPE_LINKS.billingPortal, "_blank");
   };
 
   const staticPlans = [
     {
-      id: 'free',
-      name: t('plan.free.name', 'Free'),
+      id: "free",
+      name: t("plan.free.name", "Free"),
       price: 0,
-      currency: '£',
-      period: '',
+      currency: "£",
+      period: "",
       highlights: PLAN_HIGHLIGHTS.FREE,
       features: PLAN_FEATURES.FREE,
       maxUsers: 5,
     },
     {
-      id: 'server',
-      name: 'Server',
+      id: "server",
+      name: "Server",
       price: 0,
-      currency: '',
-      period: '',
+      currency: "",
+      period: "",
       popular: false,
       highlights: PLAN_HIGHLIGHTS.SERVER_MONTHLY,
       features: PLAN_FEATURES.SERVER,
-      maxUsers: 'Unlimited users',
+      maxUsers: "Unlimited users",
     },
     {
-      id: 'enterprise',
-      name: t('plan.enterprise.name', 'Enterprise'),
+      id: "enterprise",
+      name: t("plan.enterprise.name", "Enterprise"),
       price: 0,
-      currency: '',
-      period: '',
+      currency: "",
+      period: "",
       highlights: PLAN_HIGHLIGHTS.ENTERPRISE_MONTHLY,
       features: PLAN_FEATURES.ENTERPRISE,
-      maxUsers: 'Custom',
+      maxUsers: "Custom",
     },
   ];
 
   const getCurrentPlan = () => {
     const tier = mapLicenseToTier(currentLicenseInfo || null);
-    if (tier === 'enterprise') return staticPlans[2];
-    if (tier === 'server') return staticPlans[1];
+    if (tier === "enterprise") return staticPlans[2];
+    if (tier === "server") return staticPlans[1];
     return staticPlans[0]; // free
   };
 
   const currentPlan = getCurrentPlan();
 
   return (
-    <div style={{ display: 'flex', flexDirection: 'column', gap: '2rem' }}>
-
+    <div style={{ display: "flex", flexDirection: "column", gap: "2rem" }}>
       {/* Available Plans */}
       <div>
-        <h3 style={{ margin: 0, color: 'var(--mantine-color-text)', fontSize: '1rem' }}>
-          {t('plan.availablePlans.title', 'Available Plans')}
+        <h3
+          style={{
+            margin: 0,
+            color: "var(--mantine-color-text)",
+            fontSize: "1rem",
+          }}
+        >
+          {t("plan.availablePlans.title", "Available Plans")}
         </h3>
         <p
           style={{
-            margin: '0.25rem 0 1rem 0',
-            color: 'var(--mantine-color-dimmed)',
-            fontSize: '0.875rem',
+            margin: "0.25rem 0 1rem 0",
+            color: "var(--mantine-color-dimmed)",
+            fontSize: "0.875rem",
           }}
         >
-          {t('plan.static.contactToUpgrade', 'Contact us to upgrade or customize your plan')}
+          {t(
+            "plan.static.contactToUpgrade",
+            "Contact us to upgrade or customize your plan",
+          )}
         </p>
 
         <div
           style={{
-            display: 'grid',
-            gridTemplateColumns: 'repeat(3, 1fr)',
-            gap: '1rem',
-            paddingBottom: '0.1rem',
+            display: "grid",
+            gridTemplateColumns: "repeat(3, 1fr)",
+            gap: "1rem",
+            paddingBottom: "0.1rem",
           }}
         >
           {staticPlans.map((plan) => (
@@ -140,25 +170,25 @@ const StaticPlanSection: React.FC<StaticPlanSectionProps> = ({ currentLicenseInf
               {plan.id === currentPlan.id && (
                 <PricingBadge
                   type="current"
-                  label={t('plan.current', 'Current Plan')}
+                  label={t("plan.current", "Current Plan")}
                 />
               )}
               {plan.popular && plan.id !== currentPlan.id && (
                 <PricingBadge
                   type="popular"
-                  label={t('plan.popular', 'Popular')}
+                  label={t("plan.popular", "Popular")}
                 />
               )}
 
-              <Stack gap="md" style={{ height: '100%' }}>
+              <Stack gap="md" style={{ height: "100%" }}>
                 <div>
-                  <Text size="xl" fw={700} style={{ fontSize: '2rem' }}>
+                  <Text size="xl" fw={700} style={{ fontSize: "2rem" }}>
                     {plan.name}
                   </Text>
                   <Text size="xs" c="dimmed" mt="xs">
-                    {typeof plan.maxUsers === 'string'
+                    {typeof plan.maxUsers === "string"
                       ? plan.maxUsers
-                      : `${t('plan.static.upTo', 'Up to')} ${plan.maxUsers} ${t('workspace.people.license.users', 'users')}`}
+                      : `${t("plan.static.upTo", "Up to")} ${plan.maxUsers} ${t("workspace.people.license.users", "users")}`}
                   </Text>
                 </div>
 
@@ -174,12 +204,17 @@ const StaticPlanSection: React.FC<StaticPlanSectionProps> = ({ currentLicenseInf
 
                 {/* Tier-based button logic */}
                 {(() => {
-                  const currentTier = mapLicenseToTier(currentLicenseInfo || null);
+                  const currentTier = mapLicenseToTier(
+                    currentLicenseInfo || null,
+                  );
                   const isCurrent = checkIsCurrentTier(currentTier, plan.id);
-                  const isDowngradePlan = checkIsDowngrade(currentTier, plan.id);
+                  const isDowngradePlan = checkIsDowngrade(
+                    currentTier,
+                    plan.id,
+                  );
 
                   // Free Plan
-                  if (plan.id === 'free') {
+                  if (plan.id === "free") {
                     return (
                       <Button
                         variant="filled"
@@ -188,23 +223,23 @@ const StaticPlanSection: React.FC<StaticPlanSectionProps> = ({ currentLicenseInf
                         className="plan-button"
                       >
                         {isCurrent
-                          ? t('plan.current', 'Current Plan')
-                          : t('plan.free.included', 'Included')}
+                          ? t("plan.current", "Current Plan")
+                          : t("plan.free.included", "Included")}
                       </Button>
                     );
                   }
 
                   // Server Plan
-                  if (plan.id === 'server') {
-                    if (currentTier === 'free') {
+                  if (plan.id === "server") {
+                    if (currentTier === "free") {
                       return (
                         <Button
                           variant="filled"
                           fullWidth
-                          onClick={() => handleOpenCheckout('server', false)}
+                          onClick={() => handleOpenCheckout("server", false)}
                           className="plan-button"
                         >
-                          {t('plan.upgrade', 'Upgrade')}
+                          {t("plan.upgrade", "Upgrade")}
                         </Button>
                       );
                     }
@@ -216,7 +251,7 @@ const StaticPlanSection: React.FC<StaticPlanSectionProps> = ({ currentLicenseInf
                           onClick={handleManageBilling}
                           className="plan-button"
                         >
-                          {t('plan.manage', 'Manage')}
+                          {t("plan.manage", "Manage")}
                         </Button>
                       );
                     }
@@ -228,29 +263,39 @@ const StaticPlanSection: React.FC<StaticPlanSectionProps> = ({ currentLicenseInf
                           fullWidth
                           className="plan-button"
                         >
-                          {t('plan.free.included', 'Included')}
+                          {t("plan.free.included", "Included")}
                         </Button>
                       );
                     }
                   }
 
                   // Enterprise Plan
-                  if (plan.id === 'enterprise') {
+                  if (plan.id === "enterprise") {
                     if (isEnterpriseBlockedForFree(currentTier, plan.id)) {
                       return (
-                        <Tooltip label={t('plan.enterprise.requiresServer', 'Requires Server plan')} position="top" withArrow>
+                        <Tooltip
+                          label={t(
+                            "plan.enterprise.requiresServer",
+                            "Requires Server plan",
+                          )}
+                          position="top"
+                          withArrow
+                        >
                           <Button
                             variant="filled"
                             disabled
                             fullWidth
                             className="plan-button"
                           >
-                            {t('plan.enterprise.requiresServer', 'Requires Server')}
+                            {t(
+                              "plan.enterprise.requiresServer",
+                              "Requires Server",
+                            )}
                           </Button>
                         </Tooltip>
                       );
                     }
-                    if (currentTier === 'server') {
+                    if (currentTier === "server") {
                       // TODO: Re-enable checkout flow when account syncing is ready
                       // return (
                       //   <Button
@@ -269,7 +314,7 @@ const StaticPlanSection: React.FC<StaticPlanSectionProps> = ({ currentLicenseInf
                           disabled
                           className="plan-button"
                         >
-                          {t('plan.contact', 'Contact Us')}
+                          {t("plan.contact", "Contact Us")}
                         </Button>
                       );
                     }
@@ -281,7 +326,7 @@ const StaticPlanSection: React.FC<StaticPlanSectionProps> = ({ currentLicenseInf
                           onClick={handleManageBilling}
                           className="plan-button"
                         >
-                          {t('plan.manage', 'Manage')}
+                          {t("plan.manage", "Manage")}
                         </Button>
                       );
                     }
@@ -295,11 +340,14 @@ const StaticPlanSection: React.FC<StaticPlanSectionProps> = ({ currentLicenseInf
         </div>
 
         {/* Feature Comparison Toggle */}
-        <div style={{ textAlign: 'center', marginTop: '1rem' }}>
-          <Button variant="subtle" onClick={() => setShowComparison(!showComparison)}>
+        <div style={{ textAlign: "center", marginTop: "1rem" }}>
+          <Button
+            variant="subtle"
+            onClick={() => setShowComparison(!showComparison)}
+          >
             {showComparison
-              ? t('plan.hideComparison', 'Hide Feature Comparison')
-              : t('plan.showComparison', 'Compare All Features')}
+              ? t("plan.hideComparison", "Hide Feature Comparison")
+              : t("plan.showComparison", "Compare All Features")}
           </Button>
         </div>
 
diff --git a/frontend/src/proprietary/components/shared/config/configSections/usage/UsageAnalyticsChart.tsx b/frontend/src/proprietary/components/shared/config/configSections/usage/UsageAnalyticsChart.tsx
index 9e65494c45..16a34f602b 100644
--- a/frontend/src/proprietary/components/shared/config/configSections/usage/UsageAnalyticsChart.tsx
+++ b/frontend/src/proprietary/components/shared/config/configSections/usage/UsageAnalyticsChart.tsx
@@ -1,6 +1,6 @@
-import React from 'react';
-import { Card, Text, Stack, Group, Box } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
+import React from "react";
+import { Card, Text, Stack, Group, Box } from "@mantine/core";
+import { useTranslation } from "react-i18next";
 
 interface SimpleBarChartProps {
   data: { label: string; value: number }[];
@@ -14,7 +14,7 @@ const SimpleBarChart: React.FC<SimpleBarChartProps> = ({ data, maxValue }) => {
     <Stack gap="sm">
       {data.length === 0 ? (
         <Text c="dimmed" ta="center" py="xl">
-          {t('usage.noData', 'No data available')}
+          {t("usage.noData", "No data available")}
         </Text>
       ) : (
         data.map((item, index) => (
@@ -25,9 +25,9 @@ const SimpleBarChart: React.FC<SimpleBarChartProps> = ({ data, maxValue }) => {
                 c="dimmed"
                 maw="60%"
                 style={{
-                  overflow: 'hidden',
-                  textOverflow: 'ellipsis',
-                  whiteSpace: 'nowrap',
+                  overflow: "hidden",
+                  textOverflow: "ellipsis",
+                  whiteSpace: "nowrap",
                 }}
               >
                 {item.label}
@@ -43,19 +43,19 @@ const SimpleBarChart: React.FC<SimpleBarChartProps> = ({ data, maxValue }) => {
             </Group>
             <Box
               style={{
-                width: '100%',
-                height: '0.5rem',
-                backgroundColor: 'var(--mantine-color-gray-2)',
-                borderRadius: 'var(--mantine-radius-sm)',
-                overflow: 'hidden',
+                width: "100%",
+                height: "0.5rem",
+                backgroundColor: "var(--mantine-color-gray-2)",
+                borderRadius: "var(--mantine-radius-sm)",
+                overflow: "hidden",
               }}
             >
               <Box
                 style={{
                   width: `${(item.value / maxValue) * 100}%`,
-                  height: '100%',
-                  backgroundColor: 'var(--mantine-color-blue-6)',
-                  transition: 'width 0.3s ease',
+                  height: "100%",
+                  backgroundColor: "var(--mantine-color-blue-6)",
+                  transition: "width 0.3s ease",
                 }}
               />
             </Box>
@@ -73,7 +73,10 @@ interface UsageAnalyticsChartProps {
 const UsageAnalyticsChart: React.FC<UsageAnalyticsChartProps> = ({ data }) => {
   const { t } = useTranslation();
 
-  const safeMaxValue = Math.max(...data.map((d) => d.value).filter((value) => Number.isFinite(value)), 1);
+  const safeMaxValue = Math.max(
+    ...data.map((d) => d.value).filter((value) => Number.isFinite(value)),
+    1,
+  );
   const safeData = data.map((item) => ({
     label: item.label,
     value: Number.isFinite(item.value) ? Math.max(0, item.value) : 0,
@@ -83,7 +86,7 @@ const UsageAnalyticsChart: React.FC<UsageAnalyticsChartProps> = ({ data }) => {
     <Card padding="lg" radius="md" withBorder>
       <Stack gap="md">
         <Text size="lg" fw={600}>
-          {t('usage.chart.title', 'Endpoint Usage Chart')}
+          {t("usage.chart.title", "Endpoint Usage Chart")}
         </Text>
         <SimpleBarChart data={safeData} maxValue={safeMaxValue} />
       </Stack>
diff --git a/frontend/src/proprietary/components/shared/config/configSections/usage/UsageAnalyticsTable.tsx b/frontend/src/proprietary/components/shared/config/configSections/usage/UsageAnalyticsTable.tsx
index b12c025748..f27d5d09a3 100644
--- a/frontend/src/proprietary/components/shared/config/configSections/usage/UsageAnalyticsTable.tsx
+++ b/frontend/src/proprietary/components/shared/config/configSections/usage/UsageAnalyticsTable.tsx
@@ -1,4 +1,4 @@
-import React from 'react';
+import React from "react";
 import {
   Card,
   Text,
@@ -9,9 +9,9 @@ import {
   TableTr,
   TableTh,
   TableTd,
-} from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { EndpointStatistic } from '@app/services/usageAnalyticsService';
+} from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import { EndpointStatistic } from "@app/services/usageAnalyticsService";
 
 interface UsageAnalyticsTableProps {
   data: EndpointStatistic[];
@@ -24,7 +24,7 @@ const UsageAnalyticsTable: React.FC<UsageAnalyticsTableProps> = ({ data }) => {
     <Card padding="lg" radius="md" withBorder>
       <Stack gap="md">
         <Text size="lg" fw={600}>
-          {t('usage.table.title', 'Detailed Statistics')}
+          {t("usage.table.title", "Detailed Statistics")}
         </Text>
 
         <Table
@@ -32,23 +32,55 @@ const UsageAnalyticsTable: React.FC<UsageAnalyticsTableProps> = ({ data }) => {
           verticalSpacing="sm"
           withRowBorders
           highlightOnHover
-          style={{
-            '--table-border-color': 'var(--mantine-color-gray-3)',
-          } as React.CSSProperties}
+          style={
+            {
+              "--table-border-color": "var(--mantine-color-gray-3)",
+            } as React.CSSProperties
+          }
         >
           <TableThead>
-            <TableTr style={{ backgroundColor: 'var(--mantine-color-gray-0)' }}>
-              <TableTh style={{ fontWeight: 600, color: 'var(--mantine-color-gray-7)' }} fz="sm" w="5%">
+            <TableTr style={{ backgroundColor: "var(--mantine-color-gray-0)" }}>
+              <TableTh
+                style={{
+                  fontWeight: 600,
+                  color: "var(--mantine-color-gray-7)",
+                }}
+                fz="sm"
+                w="5%"
+              >
                 #
               </TableTh>
-              <TableTh style={{ fontWeight: 600, color: 'var(--mantine-color-gray-7)' }} fz="sm" w="55%">
-                {t('usage.table.endpoint', 'Endpoint')}
+              <TableTh
+                style={{
+                  fontWeight: 600,
+                  color: "var(--mantine-color-gray-7)",
+                }}
+                fz="sm"
+                w="55%"
+              >
+                {t("usage.table.endpoint", "Endpoint")}
               </TableTh>
-              <TableTh style={{ fontWeight: 600, color: 'var(--mantine-color-gray-7)' }} fz="sm" w="20%" ta="right">
-                {t('usage.table.visits', 'Visits')}
+              <TableTh
+                style={{
+                  fontWeight: 600,
+                  color: "var(--mantine-color-gray-7)",
+                }}
+                fz="sm"
+                w="20%"
+                ta="right"
+              >
+                {t("usage.table.visits", "Visits")}
               </TableTh>
-              <TableTh style={{ fontWeight: 600, color: 'var(--mantine-color-gray-7)' }} fz="sm" w="20%" ta="right">
-                {t('usage.table.percentage', 'Percentage')}
+              <TableTh
+                style={{
+                  fontWeight: 600,
+                  color: "var(--mantine-color-gray-7)",
+                }}
+                fz="sm"
+                w="20%"
+                ta="right"
+              >
+                {t("usage.table.percentage", "Percentage")}
               </TableTh>
             </TableTr>
           </TableThead>
@@ -57,7 +89,7 @@ const UsageAnalyticsTable: React.FC<UsageAnalyticsTableProps> = ({ data }) => {
               <TableTr>
                 <TableTd colSpan={4}>
                   <Text ta="center" c="dimmed" py="xl">
-                    {t('usage.table.noData', 'No data available')}
+                    {t("usage.table.noData", "No data available")}
                   </Text>
                 </TableTd>
               </TableTr>
diff --git a/frontend/src/proprietary/components/shared/dividerWithText/DividerWithText.css b/frontend/src/proprietary/components/shared/dividerWithText/DividerWithText.css
index ce26b4546b..fef222ddd1 100644
--- a/frontend/src/proprietary/components/shared/dividerWithText/DividerWithText.css
+++ b/frontend/src/proprietary/components/shared/dividerWithText/DividerWithText.css
@@ -1,4 +1,3 @@
-
 .text-divider {
   display: flex;
   align-items: center;
@@ -10,11 +9,17 @@
 .text-divider .text-divider__rule {
   height: 0.0625rem; /* 1px */
   flex: 1 1 0%;
-  background-color: rgb(var(--text-divider-rule-rgb, var(--gray-200)) / var(--text-divider-opacity, 1));
+  background-color: rgb(
+    var(--text-divider-rule-rgb, var(--gray-200)) /
+      var(--text-divider-opacity, 1)
+  );
 }
 
 .text-divider .text-divider__label {
-  color: rgb(var(--text-divider-label-rgb, var(--gray-400)) / var(--text-divider-opacity, 1));
+  color: rgb(
+    var(--text-divider-label-rgb, var(--gray-400)) /
+      var(--text-divider-opacity, 1)
+  );
   font-size: 0.75rem; /* 12px */
   white-space: nowrap;
 }
@@ -36,11 +41,17 @@
 
 /* Force light theme colors regardless of dark mode */
 .text-divider.force-light .text-divider__rule {
-  background-color: rgb(var(--text-divider-rule-rgb-light, var(--gray-200)) / var(--text-divider-opacity, 1));
+  background-color: rgb(
+    var(--text-divider-rule-rgb-light, var(--gray-200)) /
+      var(--text-divider-opacity, 1)
+  );
 }
 
 .text-divider.force-light .text-divider__label {
-  color: rgb(var(--text-divider-label-rgb-light, var(--gray-400)) / var(--text-divider-opacity, 1));
+  color: rgb(
+    var(--text-divider-label-rgb-light, var(--gray-400)) /
+      var(--text-divider-opacity, 1)
+  );
 }
 
 .text-divider.subcategory.force-light .text-divider__rule {
diff --git a/frontend/src/proprietary/components/shared/loginSlides.ts b/frontend/src/proprietary/components/shared/loginSlides.ts
index 51c5072371..da333eff10 100644
--- a/frontend/src/proprietary/components/shared/loginSlides.ts
+++ b/frontend/src/proprietary/components/shared/loginSlides.ts
@@ -1,7 +1,7 @@
-import { BASE_PATH } from '@app/constants/app';
-import { getLogoFolder } from '@app/constants/logo';
-import type { LogoVariant } from '@app/services/preferencesService';
-import type { TFunction } from 'i18next';
+import { BASE_PATH } from "@app/constants/app";
+import { getLogoFolder } from "@app/constants/logo";
+import type { LogoVariant } from "@app/services/preferencesService";
+import type { TFunction } from "i18next";
 
 export type LoginCarouselSlide = {
   src: string;
@@ -15,7 +15,7 @@ export type LoginCarouselSlide = {
 
 export const buildLoginSlides = (
   variant: LogoVariant | null | undefined,
-  t: TFunction
+  t: TFunction,
 ): LoginCarouselSlide[] => {
   const folder = getLogoFolder(variant);
   const heroImage = `${BASE_PATH}/${folder}/Firstpage.png`;
@@ -23,33 +23,42 @@ export const buildLoginSlides = (
   return [
     {
       src: heroImage,
-      alt: t('login.slides.overview.alt', 'Stirling PDF overview'),
-      title: t('login.slides.overview.title', 'Your one-stop-shop for all your PDF needs.'),
+      alt: t("login.slides.overview.alt", "Stirling PDF overview"),
+      title: t(
+        "login.slides.overview.title",
+        "Your one-stop-shop for all your PDF needs.",
+      ),
       subtitle: t(
-        'login.slides.overview.subtitle',
-        'A privacy-first cloud suite for PDFs that lets you convert, sign, redact, and manage documents, along with 50+ other powerful tools.'
+        "login.slides.overview.subtitle",
+        "A privacy-first cloud suite for PDFs that lets you convert, sign, redact, and manage documents, along with 50+ other powerful tools.",
       ),
       followMouseTilt: true,
       tiltMaxDeg: 5,
     },
     {
       src: `${BASE_PATH}/Login/AddToPDF.png`,
-      alt: t('login.slides.edit.alt', 'Edit PDFs'),
-      title: t('login.slides.edit.title', 'Edit PDFs to display/secure the information you want'),
+      alt: t("login.slides.edit.alt", "Edit PDFs"),
+      title: t(
+        "login.slides.edit.title",
+        "Edit PDFs to display/secure the information you want",
+      ),
       subtitle: t(
-        'login.slides.edit.subtitle',
-        'With over a dozen tools to help you redact, sign, read and manipulate PDFs, you will be sure to find what you are looking for.'
+        "login.slides.edit.subtitle",
+        "With over a dozen tools to help you redact, sign, read and manipulate PDFs, you will be sure to find what you are looking for.",
       ),
       followMouseTilt: true,
       tiltMaxDeg: 5,
     },
     {
       src: `${BASE_PATH}/Login/SecurePDF.png`,
-      alt: t('login.slides.secure.alt', 'Secure PDFs'),
-      title: t('login.slides.secure.title', 'Protect sensitive information in your PDFs'),
+      alt: t("login.slides.secure.alt", "Secure PDFs"),
+      title: t(
+        "login.slides.secure.title",
+        "Protect sensitive information in your PDFs",
+      ),
       subtitle: t(
-        'login.slides.secure.subtitle',
-        'Add passwords, redact content, and manage certificates with ease.'
+        "login.slides.secure.subtitle",
+        "Add passwords, redact content, and manage certificates with ease.",
       ),
       followMouseTilt: true,
       tiltMaxDeg: 5,
diff --git a/frontend/src/proprietary/components/shared/stripeCheckout/StripeCheckout.tsx b/frontend/src/proprietary/components/shared/stripeCheckout/StripeCheckout.tsx
index 2743a49061..80772c8c97 100644
--- a/frontend/src/proprietary/components/shared/stripeCheckout/StripeCheckout.tsx
+++ b/frontend/src/proprietary/components/shared/stripeCheckout/StripeCheckout.tsx
@@ -1,38 +1,41 @@
-import React, { useEffect } from 'react';
-import { Modal, Text, Group, ActionIcon } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import LocalIcon from '@app/components/shared/LocalIcon';
-import licenseService from '@app/services/licenseService';
-import { useIsMobile } from '@app/hooks/useIsMobile';
-import { Z_INDEX_OVER_CONFIG_MODAL } from '@app/styles/zIndex';
-import { StripeCheckoutProps } from '@app/components/shared/stripeCheckout/types/checkout';
-import { validateEmail, getModalTitle } from '@app/components/shared/stripeCheckout/utils/checkoutUtils';
-import { calculateSavings } from '@app/components/shared/stripeCheckout/utils/savingsCalculator';
-import { useCheckoutState } from '@app/components/shared/stripeCheckout/hooks/useCheckoutState';
-import { useCheckoutNavigation } from '@app/components/shared/stripeCheckout/hooks/useCheckoutNavigation';
-import { useLicensePolling } from '@app/components/shared/stripeCheckout/hooks/useLicensePolling';
-import { useCheckoutSession } from '@app/components/shared/stripeCheckout/hooks/useCheckoutSession';
-import { EmailStage } from '@app/components/shared/stripeCheckout/stages/EmailStage';
-import { PlanSelectionStage } from '@app/components/shared/stripeCheckout/stages/PlanSelectionStage';
-import { PaymentStage } from '@app/components/shared/stripeCheckout/stages/PaymentStage';
-import { SuccessStage } from '@app/components/shared/stripeCheckout/stages/SuccessStage';
-import { ErrorStage } from '@app/components/shared/stripeCheckout/stages/ErrorStage';
+import React, { useEffect } from "react";
+import { Modal, Text, Group, ActionIcon } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import LocalIcon from "@app/components/shared/LocalIcon";
+import licenseService from "@app/services/licenseService";
+import { useIsMobile } from "@app/hooks/useIsMobile";
+import { Z_INDEX_OVER_CONFIG_MODAL } from "@app/styles/zIndex";
+import { StripeCheckoutProps } from "@app/components/shared/stripeCheckout/types/checkout";
+import {
+  validateEmail,
+  getModalTitle,
+} from "@app/components/shared/stripeCheckout/utils/checkoutUtils";
+import { calculateSavings } from "@app/components/shared/stripeCheckout/utils/savingsCalculator";
+import { useCheckoutState } from "@app/components/shared/stripeCheckout/hooks/useCheckoutState";
+import { useCheckoutNavigation } from "@app/components/shared/stripeCheckout/hooks/useCheckoutNavigation";
+import { useLicensePolling } from "@app/components/shared/stripeCheckout/hooks/useLicensePolling";
+import { useCheckoutSession } from "@app/components/shared/stripeCheckout/hooks/useCheckoutSession";
+import { EmailStage } from "@app/components/shared/stripeCheckout/stages/EmailStage";
+import { PlanSelectionStage } from "@app/components/shared/stripeCheckout/stages/PlanSelectionStage";
+import { PaymentStage } from "@app/components/shared/stripeCheckout/stages/PaymentStage";
+import { SuccessStage } from "@app/components/shared/stripeCheckout/stages/SuccessStage";
+import { ErrorStage } from "@app/components/shared/stripeCheckout/stages/ErrorStage";
 
 // Validate Stripe key (static validation, no dynamic imports)
 const STRIPE_KEY = import.meta.env.VITE_STRIPE_PUBLISHABLE_KEY;
 
 if (!STRIPE_KEY) {
   console.error(
-    'VITE_STRIPE_PUBLISHABLE_KEY environment variable is required. ' +
-    'Please add it to your .env file. ' +
-    'Get your key from https://dashboard.stripe.com/apikeys'
+    "VITE_STRIPE_PUBLISHABLE_KEY environment variable is required. " +
+      "Please add it to your .env file. " +
+      "Get your key from https://dashboard.stripe.com/apikeys",
   );
 }
 
-if (STRIPE_KEY && !STRIPE_KEY.startsWith('pk_')) {
+if (STRIPE_KEY && !STRIPE_KEY.startsWith("pk_")) {
   console.error(
     `Invalid Stripe publishable key format. ` +
-    `Expected key starting with 'pk_', got: ${STRIPE_KEY.substring(0, 10)}...`
+      `Expected key starting with 'pk_', got: ${STRIPE_KEY.substring(0, 10)}...`,
   );
 }
 
@@ -57,7 +60,7 @@ const StripeCheckout: React.FC<StripeCheckoutProps> = ({
     checkoutState.state,
     checkoutState.setState,
     checkoutState.stageHistory,
-    checkoutState.setStageHistory
+    checkoutState.setStageHistory,
   );
 
   // Initialize license polling hook
@@ -65,7 +68,7 @@ const StripeCheckout: React.FC<StripeCheckoutProps> = ({
     checkoutState.isMountedRef,
     checkoutState.setPollingStatus,
     checkoutState.setLicenseKey,
-    onLicenseActivated
+    onLicenseActivated,
   );
 
   // Initialize checkout session hook
@@ -82,7 +85,7 @@ const StripeCheckout: React.FC<StripeCheckoutProps> = ({
     polling.pollForLicenseKey,
     onSuccess,
     onError,
-    onLicenseActivated
+    onLicenseActivated,
   );
 
   // Calculate savings
@@ -92,17 +95,20 @@ const StripeCheckout: React.FC<StripeCheckoutProps> = ({
   const handleEmailSubmit = () => {
     const validation = validateEmail(checkoutState.emailInput);
     if (validation.valid) {
-      checkoutState.setState(prev => ({ ...prev, email: checkoutState.emailInput }));
-      navigation.goToStage('plan-selection');
+      checkoutState.setState((prev) => ({
+        ...prev,
+        email: checkoutState.emailInput,
+      }));
+      navigation.goToStage("plan-selection");
     } else {
       checkoutState.setEmailError(validation.error);
     }
   };
 
   // Plan selection handler
-  const handlePlanSelect = (period: 'monthly' | 'yearly') => {
+  const handlePlanSelect = (period: "monthly" | "yearly") => {
     checkoutState.setSelectedPeriod(period);
-    navigation.goToStage('payment');
+    navigation.goToStage("payment");
   };
 
   // Close handler
@@ -136,19 +142,19 @@ const StripeCheckout: React.FC<StripeCheckoutProps> = ({
 
     // Handle hosted checkout success - open directly to success state
     if (hostedCheckoutSuccess) {
-      console.log('Opening modal to success state for hosted checkout return');
+      console.log("Opening modal to success state for hosted checkout return");
 
       // Set appropriate state based on upgrade vs new subscription
       if (hostedCheckoutSuccess.isUpgrade) {
-        checkoutState.setCurrentLicenseKey('existing'); // Flag to indicate upgrade
-        checkoutState.setPollingStatus('ready');
+        checkoutState.setCurrentLicenseKey("existing"); // Flag to indicate upgrade
+        checkoutState.setPollingStatus("ready");
       } else if (hostedCheckoutSuccess.licenseKey) {
         checkoutState.setLicenseKey(hostedCheckoutSuccess.licenseKey);
-        checkoutState.setPollingStatus('ready');
+        checkoutState.setPollingStatus("ready");
       }
 
       // Set to success state to show success UI
-      checkoutState.setState({ currentStage: 'success', loading: false });
+      checkoutState.setState({ currentStage: "success", loading: false });
       return;
     }
 
@@ -157,42 +163,57 @@ const StripeCheckout: React.FC<StripeCheckoutProps> = ({
       try {
         const licenseInfo = await licenseService.getLicenseInfo();
         // Only skip email if license is PRO or ENTERPRISE (not NORMAL/free tier)
-        if (licenseInfo?.licenseType && licenseInfo.licenseType !== 'NORMAL') {
+        if (licenseInfo?.licenseType && licenseInfo.licenseType !== "NORMAL") {
           // Has valid premium license - skip email stage
-          console.log('Valid premium license detected - skipping email stage');
+          console.log("Valid premium license detected - skipping email stage");
           checkoutState.setCurrentLicenseKey(licenseInfo.licenseKey || null);
-          checkoutState.setState({ currentStage: 'plan-selection', loading: false });
+          checkoutState.setState({
+            currentStage: "plan-selection",
+            loading: false,
+          });
         } else {
           // No valid premium license - start at email stage
-          checkoutState.setState({ currentStage: 'email', loading: false });
+          checkoutState.setState({ currentStage: "email", loading: false });
         }
       } catch (error) {
-        console.warn('Could not check for existing license:', error);
+        console.warn("Could not check for existing license:", error);
         // Default to email stage if check fails
-        checkoutState.setState({ currentStage: 'email', loading: false });
+        checkoutState.setState({ currentStage: "email", loading: false });
       }
     };
 
     checkExistingLicense();
-  }, [opened, hostedCheckoutSuccess, checkoutState.setCurrentLicenseKey, checkoutState.setPollingStatus, checkoutState.setLicenseKey, checkoutState.setState]);
+  }, [
+    opened,
+    hostedCheckoutSuccess,
+    checkoutState.setCurrentLicenseKey,
+    checkoutState.setPollingStatus,
+    checkoutState.setLicenseKey,
+    checkoutState.setState,
+  ]);
 
   // Trigger checkout session creation when entering payment stage
   useEffect(() => {
     if (
-      checkoutState.state.currentStage === 'payment' &&
+      checkoutState.state.currentStage === "payment" &&
       !checkoutState.state.clientSecret &&
       !checkoutState.state.loading
     ) {
       session.createCheckoutSession();
     }
-  }, [checkoutState.state.currentStage, checkoutState.state.clientSecret, checkoutState.state.loading, session]);
+  }, [
+    checkoutState.state.currentStage,
+    checkoutState.state.clientSecret,
+    checkoutState.state.loading,
+    session,
+  ]);
 
   // Render stage content
   const renderContent = () => {
     // Don't block checkout - hosted mode works without publishable key
     // The checkout will automatically redirect to Stripe hosted page if key is missing
     switch (checkoutState.state.currentStage) {
-      case 'email':
+      case "email":
         return (
           <EmailStage
             emailInput={checkoutState.emailInput}
@@ -202,7 +223,7 @@ const StripeCheckout: React.FC<StripeCheckoutProps> = ({
           />
         );
 
-      case 'plan-selection':
+      case "plan-selection":
         return (
           <PlanSelectionStage
             planGroup={planGroup}
@@ -212,7 +233,7 @@ const StripeCheckout: React.FC<StripeCheckoutProps> = ({
           />
         );
 
-      case 'payment':
+      case "payment":
         return (
           <PaymentStage
             clientSecret={checkoutState.state.clientSecret || null}
@@ -221,7 +242,7 @@ const StripeCheckout: React.FC<StripeCheckoutProps> = ({
           />
         );
 
-      case 'success':
+      case "success":
         return (
           <SuccessStage
             pollingStatus={checkoutState.pollingStatus}
@@ -231,10 +252,10 @@ const StripeCheckout: React.FC<StripeCheckoutProps> = ({
           />
         );
 
-      case 'error':
+      case "error":
         return (
           <ErrorStage
-            error={checkoutState.state.error || 'An unknown error occurred'}
+            error={checkoutState.state.error || "An unknown error occurred"}
             onClose={handleClose}
           />
         );
@@ -257,7 +278,7 @@ const StripeCheckout: React.FC<StripeCheckoutProps> = ({
               variant="subtle"
               size="lg"
               onClick={navigation.goBack}
-              aria-label={t('common.back', 'Back')}
+              aria-label={t("common.back", "Back")}
             >
               <LocalIcon icon="arrow-back" width={20} height={20} />
             </ActionIcon>
@@ -278,7 +299,7 @@ const StripeCheckout: React.FC<StripeCheckoutProps> = ({
       styles={{
         body: {},
         content: {
-          maxHeight: '95vh',
+          maxHeight: "95vh",
         },
       }}
     >
diff --git a/frontend/src/proprietary/components/shared/stripeCheckout/components/PriceDisplay.tsx b/frontend/src/proprietary/components/shared/stripeCheckout/components/PriceDisplay.tsx
index b0e3ff9279..d2cd569cd2 100644
--- a/frontend/src/proprietary/components/shared/stripeCheckout/components/PriceDisplay.tsx
+++ b/frontend/src/proprietary/components/shared/stripeCheckout/components/PriceDisplay.tsx
@@ -1,10 +1,10 @@
-import React from 'react';
-import { Text, Stack } from '@mantine/core';
-import { formatPrice } from '@app/components/shared/stripeCheckout/utils/pricingUtils';
-import { PRICE_FONT_WEIGHT } from '@app/components/shared/stripeCheckout/utils/cardStyles';
+import React from "react";
+import { Text, Stack } from "@mantine/core";
+import { formatPrice } from "@app/components/shared/stripeCheckout/utils/pricingUtils";
+import { PRICE_FONT_WEIGHT } from "@app/components/shared/stripeCheckout/utils/cardStyles";
 
 interface SimplePriceProps {
-  mode: 'simple';
+  mode: "simple";
   price: number;
   currency: string;
   period: string;
@@ -12,21 +12,21 @@ interface SimplePriceProps {
 }
 
 interface EnterprisePriceProps {
-  mode: 'enterprise';
+  mode: "enterprise";
   basePrice: number;
   seatPrice: number;
   totalPrice?: number;
   currency: string;
-  period: 'month' | 'year';
+  period: "month" | "year";
   seatCount?: number;
-  size?: 'sm' | 'md' | 'lg';
+  size?: "sm" | "md" | "lg";
 }
 
 type PriceDisplayProps = SimplePriceProps | EnterprisePriceProps;
 
 export const PriceDisplay: React.FC<PriceDisplayProps> = (props) => {
-  if (props.mode === 'simple') {
-    const fontSize = props.size || '2.25rem';
+  if (props.mode === "simple") {
+    const fontSize = props.size || "2.25rem";
     return (
       <>
         <Text size={fontSize} fw={PRICE_FONT_WEIGHT} style={{ lineHeight: 1 }}>
@@ -40,9 +40,17 @@ export const PriceDisplay: React.FC<PriceDisplayProps> = (props) => {
   }
 
   // Enterprise mode
-  const { basePrice, seatPrice, totalPrice, currency, period, seatCount, size = 'md' } = props;
-  const fontSize = size === 'lg' ? '2rem' : size === 'sm' ? 'md' : 'xl';
-  const totalFontSize = size === 'lg' ? '2rem' : '2rem';
+  const {
+    basePrice,
+    seatPrice,
+    totalPrice,
+    currency,
+    period,
+    seatCount,
+    size = "md",
+  } = props;
+  const fontSize = size === "lg" ? "2rem" : size === "sm" ? "md" : "xl";
+  const totalFontSize = size === "lg" ? "2rem" : "2rem";
 
   return (
     <Stack gap="sm">
@@ -53,7 +61,7 @@ export const PriceDisplay: React.FC<PriceDisplayProps> = (props) => {
         <Text size={fontSize} fw={PRICE_FONT_WEIGHT}>
           {formatPrice(basePrice, currency)}
           <Text component="span" size="sm" c="dimmed" fw={400}>
-            {' '}
+            {" "}
             /{period}
           </Text>
         </Text>
@@ -65,7 +73,7 @@ export const PriceDisplay: React.FC<PriceDisplayProps> = (props) => {
         <Text size={fontSize} fw={PRICE_FONT_WEIGHT}>
           {formatPrice(seatPrice, currency)}
           <Text component="span" size="sm" c="dimmed" fw={400}>
-            {' '}
+            {" "}
             /seat/{period}
           </Text>
         </Text>
@@ -75,11 +83,15 @@ export const PriceDisplay: React.FC<PriceDisplayProps> = (props) => {
           <Text size="sm" c="dimmed" mb="xs">
             Total ({seatCount} seats)
           </Text>
-          <Text size={totalFontSize} fw={PRICE_FONT_WEIGHT} style={{ lineHeight: 1 }}>
+          <Text
+            size={totalFontSize}
+            fw={PRICE_FONT_WEIGHT}
+            style={{ lineHeight: 1 }}
+          >
             {formatPrice(totalPrice, currency)}
             <Text component="span" size="sm" c="dimmed" fw={400}>
-              {' '}
-              /{period === 'year' ? 'month' : period}
+              {" "}
+              /{period === "year" ? "month" : period}
             </Text>
           </Text>
         </div>
diff --git a/frontend/src/proprietary/components/shared/stripeCheckout/components/PricingBadge.tsx b/frontend/src/proprietary/components/shared/stripeCheckout/components/PricingBadge.tsx
index 80a289914b..b725f2f621 100644
--- a/frontend/src/proprietary/components/shared/stripeCheckout/components/PricingBadge.tsx
+++ b/frontend/src/proprietary/components/shared/stripeCheckout/components/PricingBadge.tsx
@@ -1,23 +1,23 @@
-import React from 'react';
-import { Badge } from '@mantine/core';
+import React from "react";
+import { Badge } from "@mantine/core";
 
 interface PricingBadgeProps {
-  type: 'current' | 'popular' | 'savings';
+  type: "current" | "popular" | "savings";
   label: string;
   savingsPercent?: number;
 }
 
 export const PricingBadge: React.FC<PricingBadgeProps> = ({ type, label }) => {
-  const color = type === 'current' || type === 'savings' ? 'green' : 'blue';
-  const size = type === 'savings' ? 'lg' : 'sm';
+  const color = type === "current" || type === "savings" ? "green" : "blue";
+  const size = type === "savings" ? "lg" : "sm";
 
   return (
     <Badge
       color={color}
       variant="filled"
       size={size}
-      style={{ position: 'absolute', top: '0.5rem', right: '0.5rem' }}
-      className={type === 'current' ? 'current-plan-badge' : undefined}
+      style={{ position: "absolute", top: "0.5rem", right: "0.5rem" }}
+      className={type === "current" ? "current-plan-badge" : undefined}
     >
       {label}
     </Badge>
diff --git a/frontend/src/proprietary/components/shared/stripeCheckout/hooks/useCheckoutNavigation.ts b/frontend/src/proprietary/components/shared/stripeCheckout/hooks/useCheckoutNavigation.ts
index 8ee39b4e9c..99f91db394 100644
--- a/frontend/src/proprietary/components/shared/stripeCheckout/hooks/useCheckoutNavigation.ts
+++ b/frontend/src/proprietary/components/shared/stripeCheckout/hooks/useCheckoutNavigation.ts
@@ -1,5 +1,8 @@
-import { useCallback } from 'react';
-import { CheckoutState, CheckoutStage } from '@app/components/shared/stripeCheckout/types/checkout';
+import { useCallback } from "react";
+import {
+  CheckoutState,
+  CheckoutStage,
+} from "@app/components/shared/stripeCheckout/types/checkout";
 
 /**
  * Stage navigation and history management hook
@@ -8,28 +11,31 @@ export const useCheckoutNavigation = (
   state: CheckoutState,
   setState: React.Dispatch<React.SetStateAction<CheckoutState>>,
   stageHistory: CheckoutStage[],
-  setStageHistory: React.Dispatch<React.SetStateAction<CheckoutStage[]>>
+  setStageHistory: React.Dispatch<React.SetStateAction<CheckoutStage[]>>,
 ) => {
-  const goToStage = useCallback((nextStage: CheckoutStage) => {
-    setStageHistory(prev => [...prev, state.currentStage]);
-    setState(prev => ({ ...prev, currentStage: nextStage }));
-  }, [state.currentStage, setState, setStageHistory]);
+  const goToStage = useCallback(
+    (nextStage: CheckoutStage) => {
+      setStageHistory((prev) => [...prev, state.currentStage]);
+      setState((prev) => ({ ...prev, currentStage: nextStage }));
+    },
+    [state.currentStage, setState, setStageHistory],
+  );
 
   const goBack = useCallback(() => {
     if (stageHistory.length > 0) {
       const previousStage = stageHistory[stageHistory.length - 1];
-      setStageHistory(prev => prev.slice(0, -1));
+      setStageHistory((prev) => prev.slice(0, -1));
 
       // Reset payment state when going back from payment stage
-      if (state.currentStage === 'payment') {
-        setState(prev => ({
+      if (state.currentStage === "payment") {
+        setState((prev) => ({
           ...prev,
           currentStage: previousStage,
           clientSecret: undefined,
-          loading: false
+          loading: false,
         }));
       } else {
-        setState(prev => ({ ...prev, currentStage: previousStage }));
+        setState((prev) => ({ ...prev, currentStage: previousStage }));
       }
     }
   }, [stageHistory, state.currentStage, setState, setStageHistory]);
diff --git a/frontend/src/proprietary/components/shared/stripeCheckout/hooks/useCheckoutSession.ts b/frontend/src/proprietary/components/shared/stripeCheckout/hooks/useCheckoutSession.ts
index 7f7cf08ddf..4a83aa9d50 100644
--- a/frontend/src/proprietary/components/shared/stripeCheckout/hooks/useCheckoutSession.ts
+++ b/frontend/src/proprietary/components/shared/stripeCheckout/hooks/useCheckoutSession.ts
@@ -1,7 +1,10 @@
-import { useCallback } from 'react';
-import licenseService, { PlanTier } from '@app/services/licenseService';
-import { resyncExistingLicense } from '@app/utils/licenseCheckoutUtils';
-import { CheckoutState, PollingStatus } from '@app/components/shared/stripeCheckout/types/checkout';
+import { useCallback } from "react";
+import licenseService, { PlanTier } from "@app/services/licenseService";
+import { resyncExistingLicense } from "@app/utils/licenseCheckoutUtils";
+import {
+  CheckoutState,
+  PollingStatus,
+} from "@app/components/shared/stripeCheckout/types/checkout";
 
 /**
  * Checkout session creation and payment handling hook
@@ -19,20 +22,25 @@ export const useCheckoutSession = (
   pollForLicenseKey: (installId: string) => Promise<void>,
   onSuccess?: (sessionId: string) => void,
   onError?: (error: string) => void,
-  onLicenseActivated?: (licenseInfo: {licenseType: string; enabled: boolean; maxUsers: number; hasKey: boolean}) => void
+  onLicenseActivated?: (licenseInfo: {
+    licenseType: string;
+    enabled: boolean;
+    maxUsers: number;
+    hasKey: boolean;
+  }) => void,
 ) => {
   const createCheckoutSession = useCallback(async () => {
     if (!selectedPlan) {
       setState({
-        currentStage: 'error',
-        error: 'Selected plan period is not available',
+        currentStage: "error",
+        error: "Selected plan period is not available",
         loading: false,
       });
       return;
     }
 
     try {
-      setState(prev => ({ ...prev, loading: true }));
+      setState((prev) => ({ ...prev, loading: true }));
 
       // Fetch installation ID from backend
       let fetchedInstallationId = installationId;
@@ -46,13 +54,20 @@ export const useCheckoutSession = (
       let existingLicenseKey: string | undefined;
       try {
         const licenseInfo = await licenseService.getLicenseInfo();
-        if (licenseInfo?.licenseType && licenseInfo.licenseType !== 'NORMAL' && licenseInfo.licenseKey) {
+        if (
+          licenseInfo?.licenseType &&
+          licenseInfo.licenseType !== "NORMAL" &&
+          licenseInfo.licenseKey
+        ) {
           existingLicenseKey = licenseInfo.licenseKey;
           setCurrentLicenseKey(existingLicenseKey);
-          console.log('Found existing valid license for upgrade');
+          console.log("Found existing valid license for upgrade");
         }
       } catch (error) {
-        console.warn('Could not fetch license info, proceeding as new license:', error);
+        console.warn(
+          "Could not fetch license info, proceeding as new license:",
+          error,
+        );
       }
 
       const response = await licenseService.createCheckoutSession({
@@ -66,14 +81,14 @@ export const useCheckoutSession = (
 
       // Check if we got a redirect URL (hosted checkout for HTTP)
       if (response.url) {
-        console.log('Redirecting to Stripe hosted checkout:', response.url);
+        console.log("Redirecting to Stripe hosted checkout:", response.url);
         // Redirect to Stripe's hosted checkout page
         window.location.href = response.url;
         return;
       }
 
       // Otherwise, use embedded checkout (HTTPS)
-      setState(prev => ({
+      setState((prev) => ({
         ...prev,
         clientSecret: response.clientSecret,
         sessionId: response.sessionId,
@@ -81,9 +96,11 @@ export const useCheckoutSession = (
       }));
     } catch (err) {
       const errorMessage =
-        err instanceof Error ? err.message : 'Failed to create checkout session';
+        err instanceof Error
+          ? err.message
+          : "Failed to create checkout session";
       setState({
-        currentStage: 'error',
+        currentStage: "error",
         error: errorMessage,
         loading: false,
       });
@@ -97,18 +114,18 @@ export const useCheckoutSession = (
     setState,
     setInstallationId,
     setCurrentLicenseKey,
-    onError
+    onError,
   ]);
 
   const handlePaymentComplete = useCallback(async () => {
     // Preserve state when changing stage
-    setState(prev => ({ ...prev, currentStage: 'success' }));
+    setState((prev) => ({ ...prev, currentStage: "success" }));
 
     // Check if this is an upgrade (existing license key) or new plan
     if (currentLicenseKey) {
       // UPGRADE FLOW: Resync existing license with Keygen
-      console.log('Upgrade detected - resyncing existing license with Keygen');
-      setPollingStatus('polling');
+      console.log("Upgrade detected - resyncing existing license with Keygen");
+      setPollingStatus("polling");
 
       const activation = await resyncExistingLicense({
         isMounted: () => true, // Modal is open, no need to check
@@ -117,26 +134,26 @@ export const useCheckoutSession = (
 
       if (activation.success) {
         console.log(`License upgraded successfully: ${activation.licenseType}`);
-        setPollingStatus('ready');
+        setPollingStatus("ready");
       } else {
-        console.error('Failed to sync upgraded license:', activation.error);
-        setPollingStatus('timeout');
+        console.error("Failed to sync upgraded license:", activation.error);
+        setPollingStatus("timeout");
       }
 
       // Notify parent (don't wait - upgrade is complete)
-      onSuccess?.(state.sessionId || '');
+      onSuccess?.(state.sessionId || "");
     } else {
       // NEW PLAN FLOW: Poll for new license key
-      console.log('New subscription - polling for license key');
+      console.log("New subscription - polling for license key");
 
       if (installationId) {
         pollForLicenseKey(installationId).finally(() => {
           // Only notify parent after polling completes or times out
-          onSuccess?.(state.sessionId || '');
+          onSuccess?.(state.sessionId || "");
         });
       } else {
         // No installation ID, notify immediately
-        onSuccess?.(state.sessionId || '');
+        onSuccess?.(state.sessionId || "");
       }
     }
   }, [
@@ -147,7 +164,7 @@ export const useCheckoutSession = (
     setPollingStatus,
     pollForLicenseKey,
     onSuccess,
-    onLicenseActivated
+    onLicenseActivated,
   ]);
 
   return {
diff --git a/frontend/src/proprietary/components/shared/stripeCheckout/hooks/useCheckoutState.ts b/frontend/src/proprietary/components/shared/stripeCheckout/hooks/useCheckoutState.ts
index 5c90491e50..00320b6b9c 100644
--- a/frontend/src/proprietary/components/shared/stripeCheckout/hooks/useCheckoutState.ts
+++ b/frontend/src/proprietary/components/shared/stripeCheckout/hooks/useCheckoutState.ts
@@ -1,50 +1,55 @@
-import { useState, useCallback, useRef } from 'react';
-import { PlanTierGroup } from '@app/services/licenseService';
-import { CheckoutState, PollingStatus, CheckoutStage } from '@app/components/shared/stripeCheckout/types/checkout';
+import { useState, useCallback, useRef } from "react";
+import { PlanTierGroup } from "@app/services/licenseService";
+import {
+  CheckoutState,
+  PollingStatus,
+  CheckoutStage,
+} from "@app/components/shared/stripeCheckout/types/checkout";
 
 /**
  * Centralized state management hook for checkout flow
  */
 export const useCheckoutState = (planGroup: PlanTierGroup) => {
   const [state, setState] = useState<CheckoutState>({
-    currentStage: 'email',
-    loading: false
+    currentStage: "email",
+    loading: false,
   });
   const [stageHistory, setStageHistory] = useState<CheckoutStage[]>([]);
-  const [emailInput, setEmailInput] = useState<string>('');
-  const [emailError, setEmailError] = useState<string>('');
-  const [selectedPeriod, setSelectedPeriod] = useState<'monthly' | 'yearly'>(
-    planGroup.yearly ? 'yearly' : 'monthly'
+  const [emailInput, setEmailInput] = useState<string>("");
+  const [emailError, setEmailError] = useState<string>("");
+  const [selectedPeriod, setSelectedPeriod] = useState<"monthly" | "yearly">(
+    planGroup.yearly ? "yearly" : "monthly",
   );
   const [installationId, setInstallationId] = useState<string | null>(null);
-  const [currentLicenseKey, setCurrentLicenseKey] = useState<string | null>(null);
+  const [currentLicenseKey, setCurrentLicenseKey] = useState<string | null>(
+    null,
+  );
   const [licenseKey, setLicenseKey] = useState<string | null>(null);
-  const [pollingStatus, setPollingStatus] = useState<PollingStatus>('idle');
+  const [pollingStatus, setPollingStatus] = useState<PollingStatus>("idle");
 
   // Refs for polling cleanup
   const isMountedRef = useRef(true);
   const pollingTimeoutRef = useRef<NodeJS.Timeout | null>(null);
 
   // Get the selected plan based on period
-  const selectedPlan = selectedPeriod === 'yearly'
-    ? planGroup.yearly
-    : planGroup.monthly;
+  const selectedPlan =
+    selectedPeriod === "yearly" ? planGroup.yearly : planGroup.monthly;
 
   const resetState = useCallback(() => {
     setState({
-      currentStage: 'email',
+      currentStage: "email",
       loading: false,
       clientSecret: undefined,
       sessionId: undefined,
-      error: undefined
+      error: undefined,
     });
     setStageHistory([]);
-    setEmailInput('');
-    setEmailError('');
-    setPollingStatus('idle');
+    setEmailInput("");
+    setEmailError("");
+    setPollingStatus("idle");
     setCurrentLicenseKey(null);
     setLicenseKey(null);
-    setSelectedPeriod(planGroup.yearly ? 'yearly' : 'monthly');
+    setSelectedPeriod(planGroup.yearly ? "yearly" : "monthly");
   }, [planGroup]);
 
   return {
diff --git a/frontend/src/proprietary/components/shared/stripeCheckout/hooks/useLicensePolling.ts b/frontend/src/proprietary/components/shared/stripeCheckout/hooks/useLicensePolling.ts
index 0978683f3a..dda6c36009 100644
--- a/frontend/src/proprietary/components/shared/stripeCheckout/hooks/useLicensePolling.ts
+++ b/frontend/src/proprietary/components/shared/stripeCheckout/hooks/useLicensePolling.ts
@@ -1,6 +1,9 @@
-import { useCallback } from 'react';
-import { pollLicenseKeyWithBackoff, activateLicenseKey } from '@app/utils/licenseCheckoutUtils';
-import { PollingStatus } from '@app/components/shared/stripeCheckout/types/checkout';
+import { useCallback } from "react";
+import {
+  pollLicenseKeyWithBackoff,
+  activateLicenseKey,
+} from "@app/utils/licenseCheckoutUtils";
+import { PollingStatus } from "@app/components/shared/stripeCheckout/types/checkout";
 
 /**
  * License key polling and activation logic hook
@@ -9,33 +12,41 @@ export const useLicensePolling = (
   isMountedRef: React.RefObject<boolean>,
   setPollingStatus: React.Dispatch<React.SetStateAction<PollingStatus>>,
   setLicenseKey: React.Dispatch<React.SetStateAction<string | null>>,
-  onLicenseActivated?: (licenseInfo: {licenseType: string; enabled: boolean; maxUsers: number; hasKey: boolean}) => void
+  onLicenseActivated?: (licenseInfo: {
+    licenseType: string;
+    enabled: boolean;
+    maxUsers: number;
+    hasKey: boolean;
+  }) => void,
 ) => {
-  const pollForLicenseKey = useCallback(async (installId: string) => {
-    // Use shared polling utility
-    const result = await pollLicenseKeyWithBackoff(installId, {
-      isMounted: () => isMountedRef.current!,
-      onStatusChange: setPollingStatus,
-    });
-
-    if (result.success && result.licenseKey) {
-      setLicenseKey(result.licenseKey);
-
-      // Activate the license key
-      const activation = await activateLicenseKey(result.licenseKey, {
-        isMounted: () => isMountedRef.current!,
-        onActivated: onLicenseActivated,
+  const pollForLicenseKey = useCallback(
+    async (installId: string) => {
+      // Use shared polling utility
+      const result = await pollLicenseKeyWithBackoff(installId, {
+        isMounted: () => isMountedRef.current ?? false,
+        onStatusChange: setPollingStatus,
       });
 
-      if (!activation.success) {
-        console.error('Failed to activate license key:', activation.error);
+      if (result.success && result.licenseKey) {
+        setLicenseKey(result.licenseKey);
+
+        // Activate the license key
+        const activation = await activateLicenseKey(result.licenseKey, {
+          isMounted: () => isMountedRef.current ?? false,
+          onActivated: onLicenseActivated,
+        });
+
+        if (!activation.success) {
+          console.error("Failed to activate license key:", activation.error);
+        }
+      } else if (result.timedOut) {
+        console.warn("License key polling timed out");
+      } else if (result.error) {
+        console.error("License key polling failed:", result.error);
       }
-    } else if (result.timedOut) {
-      console.warn('License key polling timed out');
-    } else if (result.error) {
-      console.error('License key polling failed:', result.error);
-    }
-  }, [isMountedRef, setPollingStatus, setLicenseKey, onLicenseActivated]);
+    },
+    [isMountedRef, setPollingStatus, setLicenseKey, onLicenseActivated],
+  );
 
   return { pollForLicenseKey };
 };
diff --git a/frontend/src/proprietary/components/shared/stripeCheckout/index.ts b/frontend/src/proprietary/components/shared/stripeCheckout/index.ts
index bb53480b5e..fb7de4d9a1 100644
--- a/frontend/src/proprietary/components/shared/stripeCheckout/index.ts
+++ b/frontend/src/proprietary/components/shared/stripeCheckout/index.ts
@@ -1,8 +1,8 @@
-export { default as StripeCheckout } from '@app/components/shared/stripeCheckout/StripeCheckout';
+export { default as StripeCheckout } from "@app/components/shared/stripeCheckout/StripeCheckout";
 export type {
   StripeCheckoutProps,
   CheckoutStage,
   CheckoutState,
   PollingStatus,
-  SavingsCalculation
-} from '@app/components/shared/stripeCheckout/types/checkout';
+  SavingsCalculation,
+} from "@app/components/shared/stripeCheckout/types/checkout";
diff --git a/frontend/src/proprietary/components/shared/stripeCheckout/stages/EmailStage.tsx b/frontend/src/proprietary/components/shared/stripeCheckout/stages/EmailStage.tsx
index c8ff4e4159..4758d5d4d1 100644
--- a/frontend/src/proprietary/components/shared/stripeCheckout/stages/EmailStage.tsx
+++ b/frontend/src/proprietary/components/shared/stripeCheckout/stages/EmailStage.tsx
@@ -1,6 +1,6 @@
-import React from 'react';
-import { Stack, Text, TextInput, Button } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
+import React from "react";
+import { Stack, Text, TextInput, Button } from "@mantine/core";
+import { useTranslation } from "react-i18next";
 
 interface EmailStageProps {
   emailInput: string;
@@ -18,32 +18,34 @@ export const EmailStage: React.FC<EmailStageProps> = ({
   const { t } = useTranslation();
 
   return (
-    <Stack gap="lg" style={{ maxWidth: '500px', margin: '0 auto', padding: '2rem 0' }}>
+    <Stack
+      gap="lg"
+      style={{ maxWidth: "500px", margin: "0 auto", padding: "2rem 0" }}
+    >
       <Text size="sm" c="dimmed">
-        {t('payment.emailStage.description', "We'll use this to send your license key and receipts.")}
+        {t(
+          "payment.emailStage.description",
+          "We'll use this to send your license key and receipts.",
+        )}
       </Text>
 
       <TextInput
-        label={t('payment.emailStage.emailLabel', 'Email Address')}
-        placeholder={t('payment.emailStage.emailPlaceholder', 'your@email.com')}
+        label={t("payment.emailStage.emailLabel", "Email Address")}
+        placeholder={t("payment.emailStage.emailPlaceholder", "your@email.com")}
         value={emailInput}
         onChange={(e) => setEmailInput(e.currentTarget.value)}
         error={emailError}
         size="lg"
         required
         onKeyDown={(e) => {
-          if (e.key === 'Enter') {
+          if (e.key === "Enter") {
             onSubmit();
           }
         }}
       />
 
-      <Button
-        size="lg"
-        onClick={onSubmit}
-        disabled={!emailInput.trim()}
-      >
-        {t('payment.emailStage.continue', 'Continue')}
+      <Button size="lg" onClick={onSubmit} disabled={!emailInput.trim()}>
+        {t("payment.emailStage.continue", "Continue")}
       </Button>
     </Stack>
   );
diff --git a/frontend/src/proprietary/components/shared/stripeCheckout/stages/ErrorStage.tsx b/frontend/src/proprietary/components/shared/stripeCheckout/stages/ErrorStage.tsx
index 934e75d77b..3881ab25fa 100644
--- a/frontend/src/proprietary/components/shared/stripeCheckout/stages/ErrorStage.tsx
+++ b/frontend/src/proprietary/components/shared/stripeCheckout/stages/ErrorStage.tsx
@@ -1,6 +1,6 @@
-import React from 'react';
-import { Alert, Stack, Text, Button } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
+import React from "react";
+import { Alert, Stack, Text, Button } from "@mantine/core";
+import { useTranslation } from "react-i18next";
 
 interface ErrorStageProps {
   error: string;
@@ -11,11 +11,11 @@ export const ErrorStage: React.FC<ErrorStageProps> = ({ error, onClose }) => {
   const { t } = useTranslation();
 
   return (
-    <Alert color="red" title={t('payment.error', 'Payment Error')}>
+    <Alert color="red" title={t("payment.error", "Payment Error")}>
       <Stack gap="md">
         <Text size="sm">{error}</Text>
         <Button variant="outline" onClick={onClose}>
-          {t('common.close', 'Close')}
+          {t("common.close", "Close")}
         </Button>
       </Stack>
     </Alert>
diff --git a/frontend/src/proprietary/components/shared/stripeCheckout/stages/PaymentStage.tsx b/frontend/src/proprietary/components/shared/stripeCheckout/stages/PaymentStage.tsx
index 84664f873f..a84db823ae 100644
--- a/frontend/src/proprietary/components/shared/stripeCheckout/stages/PaymentStage.tsx
+++ b/frontend/src/proprietary/components/shared/stripeCheckout/stages/PaymentStage.tsx
@@ -1,9 +1,12 @@
-import React from 'react';
-import { Stack, Text, Loader } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { loadStripe } from '@stripe/stripe-js';
-import { EmbeddedCheckoutProvider, EmbeddedCheckout } from '@stripe/react-stripe-js';
-import { PlanTier } from '@app/services/licenseService';
+import React from "react";
+import { Stack, Text, Loader } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import { loadStripe } from "@stripe/stripe-js";
+import {
+  EmbeddedCheckoutProvider,
+  EmbeddedCheckout,
+} from "@stripe/react-stripe-js";
+import { PlanTier } from "@app/services/licenseService";
 
 // Load Stripe once
 const STRIPE_KEY = import.meta.env.VITE_STRIPE_PUBLISHABLE_KEY;
@@ -25,10 +28,10 @@ export const PaymentStage: React.FC<PaymentStageProps> = ({
   // Show loading while creating checkout session
   if (!clientSecret || !selectedPlan) {
     return (
-      <Stack align="center" justify="center" style={{ padding: '2rem 0' }}>
+      <Stack align="center" justify="center" style={{ padding: "2rem 0" }}>
         <Loader size="lg" />
         <Text size="sm" c="dimmed" mt="md">
-          {t('payment.preparing', 'Preparing your checkout...')}
+          {t("payment.preparing", "Preparing your checkout...")}
         </Text>
       </Stack>
     );
@@ -38,10 +41,10 @@ export const PaymentStage: React.FC<PaymentStageProps> = ({
     // This should only happen if embedded mode was attempted without key
     // Hosted checkout should have redirected before reaching this component
     return (
-      <Stack align="center" gap="md" style={{ padding: '2rem 0' }}>
+      <Stack align="center" gap="md" style={{ padding: "2rem 0" }}>
         <Loader size="lg" />
         <Text size="sm" c="dimmed" mt="md">
-          {t('payment.redirecting', 'Redirecting to secure checkout...')}
+          {t("payment.redirecting", "Redirecting to secure checkout...")}
         </Text>
       </Stack>
     );
@@ -49,7 +52,6 @@ export const PaymentStage: React.FC<PaymentStageProps> = ({
 
   return (
     <Stack gap="md">
-
       {/* Stripe Embedded Checkout */}
       <EmbeddedCheckoutProvider
         key={clientSecret}
diff --git a/frontend/src/proprietary/components/shared/stripeCheckout/stages/PlanSelectionStage.tsx b/frontend/src/proprietary/components/shared/stripeCheckout/stages/PlanSelectionStage.tsx
index f7a6fdb34b..4928ee4fa8 100644
--- a/frontend/src/proprietary/components/shared/stripeCheckout/stages/PlanSelectionStage.tsx
+++ b/frontend/src/proprietary/components/shared/stripeCheckout/stages/PlanSelectionStage.tsx
@@ -1,18 +1,30 @@
-import React from 'react';
-import { Stack, Button, Text, Grid, Paper, Alert, Divider } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { PlanTierGroup } from '@app/services/licenseService';
-import { SavingsCalculation } from '@app/components/shared/stripeCheckout/types/checkout';
-import { PricingBadge } from '@app/components/shared/stripeCheckout/components/PricingBadge';
-import { PriceDisplay } from '@app/components/shared/stripeCheckout/components/PriceDisplay';
-import { formatPrice, calculateMonthlyEquivalent, calculateTotalWithSeats } from '@app/components/shared/stripeCheckout/utils/pricingUtils';
-import { getClickablePaperStyle } from '@app/components/shared/stripeCheckout/utils/cardStyles';
+import React from "react";
+import {
+  Stack,
+  Button,
+  Text,
+  Grid,
+  Paper,
+  Alert,
+  Divider,
+} from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import { PlanTierGroup } from "@app/services/licenseService";
+import { SavingsCalculation } from "@app/components/shared/stripeCheckout/types/checkout";
+import { PricingBadge } from "@app/components/shared/stripeCheckout/components/PricingBadge";
+import { PriceDisplay } from "@app/components/shared/stripeCheckout/components/PriceDisplay";
+import {
+  formatPrice,
+  calculateMonthlyEquivalent,
+  calculateTotalWithSeats,
+} from "@app/components/shared/stripeCheckout/utils/pricingUtils";
+import { getClickablePaperStyle } from "@app/components/shared/stripeCheckout/utils/cardStyles";
 
 interface PlanSelectionStageProps {
   planGroup: PlanTierGroup;
   minimumSeats: number;
   savings: SavingsCalculation | null;
-  onSelectPlan: (period: 'monthly' | 'yearly') => void;
+  onSelectPlan: (period: "monthly" | "yearly") => void;
 }
 
 export const PlanSelectionStage: React.FC<PlanSelectionStageProps> = ({
@@ -22,13 +34,12 @@ export const PlanSelectionStage: React.FC<PlanSelectionStageProps> = ({
   onSelectPlan,
 }) => {
   const { t } = useTranslation();
-  const isEnterprise = planGroup.tier === 'enterprise';
+  const isEnterprise = planGroup.tier === "enterprise";
   const seatCount = minimumSeats || 1;
 
   return (
-    <Stack gap="lg" style={{ padding: '1rem 2rem' }}>
-
-        <Grid gutter="xl" style={{ marginTop: '1rem' }}>
+    <Stack gap="lg" style={{ padding: "1rem 2rem" }}>
+      <Grid gutter="xl" style={{ marginTop: "1rem" }}>
         {/* Monthly Option */}
         {planGroup.monthly && (
           <Grid.Col span={6}>
@@ -37,11 +48,15 @@ export const PlanSelectionStage: React.FC<PlanSelectionStageProps> = ({
               p="xl"
               radius="md"
               style={getClickablePaperStyle()}
-              onClick={() => onSelectPlan('monthly')}
+              onClick={() => onSelectPlan("monthly")}
             >
-              <Stack gap="md" style={{ height: '100%' }} justify="space-between">
+              <Stack
+                gap="md"
+                style={{ height: "100%" }}
+                justify="space-between"
+              >
                 <Text size="lg" fw={600}>
-                  {t('payment.monthly', 'Monthly')}
+                  {t("payment.monthly", "Monthly")}
                 </Text>
 
                 <Divider />
@@ -51,7 +66,11 @@ export const PlanSelectionStage: React.FC<PlanSelectionStageProps> = ({
                     mode="enterprise"
                     basePrice={planGroup.monthly.price}
                     seatPrice={planGroup.monthly.seatPrice}
-                    totalPrice={calculateTotalWithSeats(planGroup.monthly.price, planGroup.monthly.seatPrice, seatCount)}
+                    totalPrice={calculateTotalWithSeats(
+                      planGroup.monthly.price,
+                      planGroup.monthly.seatPrice,
+                      seatCount,
+                    )}
                     currency={planGroup.monthly.currency}
                     period="month"
                     seatCount={seatCount}
@@ -61,15 +80,15 @@ export const PlanSelectionStage: React.FC<PlanSelectionStageProps> = ({
                   <PriceDisplay
                     mode="simple"
                     price={planGroup.monthly?.price || 0}
-                    currency={planGroup.monthly?.currency || '£'}
-                    period={t('payment.perMonth', '/month')}
+                    currency={planGroup.monthly?.currency || "£"}
+                    period={t("payment.perMonth", "/month")}
                     size="2.5rem"
                   />
                 )}
 
-                <div style={{ marginTop: 'auto', paddingTop: '1rem' }}>
+                <div style={{ marginTop: "auto", paddingTop: "1rem" }}>
                   <Button variant="light" fullWidth size="lg">
-                    {t('payment.planStage.selectMonthly', 'Select Monthly')}
+                    {t("payment.planStage.selectMonthly", "Select Monthly")}
                   </Button>
                 </div>
               </Stack>
@@ -85,18 +104,26 @@ export const PlanSelectionStage: React.FC<PlanSelectionStageProps> = ({
               p="xl"
               radius="md"
               style={getClickablePaperStyle(!!savings)}
-              onClick={() => onSelectPlan('yearly')}
+              onClick={() => onSelectPlan("yearly")}
             >
               {savings && (
                 <PricingBadge
                   type="savings"
-                  label={t('payment.planStage.savePercent', 'Save {{percent}}%', { percent: savings.percent })}
+                  label={t(
+                    "payment.planStage.savePercent",
+                    "Save {{percent}}%",
+                    { percent: savings.percent },
+                  )}
                 />
               )}
 
-              <Stack gap="md" style={{ height: '100%' }} justify="space-between">
+              <Stack
+                gap="md"
+                style={{ height: "100%" }}
+                justify="space-between"
+              >
                 <Text size="lg" fw={600}>
-                  {t('payment.yearly', 'Yearly')}
+                  {t("payment.yearly", "Yearly")}
                 </Text>
 
                 <Divider />
@@ -108,7 +135,11 @@ export const PlanSelectionStage: React.FC<PlanSelectionStageProps> = ({
                       basePrice={planGroup.yearly.price}
                       seatPrice={planGroup.yearly.seatPrice}
                       totalPrice={calculateMonthlyEquivalent(
-                        calculateTotalWithSeats(planGroup.yearly.price, planGroup.yearly.seatPrice, seatCount)
+                        calculateTotalWithSeats(
+                          planGroup.yearly.price,
+                          planGroup.yearly.seatPrice,
+                          seatCount,
+                        ),
                       )}
                       currency={planGroup.yearly.currency}
                       period="year"
@@ -116,26 +147,40 @@ export const PlanSelectionStage: React.FC<PlanSelectionStageProps> = ({
                       size="sm"
                     />
                     <Text size="sm" c="dimmed">
-                      {t('payment.planStage.billedYearly', 'Billed yearly at {{currency}}{{amount}}', {
-                        currency: planGroup.yearly.currency,
-                        amount: calculateTotalWithSeats(planGroup.yearly.price, planGroup.yearly.seatPrice, seatCount).toFixed(2)
-                      })}
+                      {t(
+                        "payment.planStage.billedYearly",
+                        "Billed yearly at {{currency}}{{amount}}",
+                        {
+                          currency: planGroup.yearly.currency,
+                          amount: calculateTotalWithSeats(
+                            planGroup.yearly.price,
+                            planGroup.yearly.seatPrice,
+                            seatCount,
+                          ).toFixed(2),
+                        },
+                      )}
                     </Text>
                   </Stack>
                 ) : (
                   <Stack gap={0}>
                     <PriceDisplay
                       mode="simple"
-                      price={calculateMonthlyEquivalent(planGroup.yearly?.price || 0)}
-                      currency={planGroup.yearly?.currency || '£'}
-                      period={t('payment.perMonth', '/month')}
+                      price={calculateMonthlyEquivalent(
+                        planGroup.yearly?.price || 0,
+                      )}
+                      currency={planGroup.yearly?.currency || "£"}
+                      period={t("payment.perMonth", "/month")}
                       size="2.5rem"
                     />
                     <Text size="sm" c="dimmed" mt="xs">
-                      {t('payment.planStage.billedYearly', 'Billed yearly at {{currency}}{{amount}}', {
-                        currency: planGroup.yearly?.currency,
-                        amount: planGroup.yearly?.price.toFixed(2)
-                      })}
+                      {t(
+                        "payment.planStage.billedYearly",
+                        "Billed yearly at {{currency}}{{amount}}",
+                        {
+                          currency: planGroup.yearly?.currency,
+                          amount: planGroup.yearly?.price.toFixed(2),
+                        },
+                      )}
                     </Text>
                   </Stack>
                 )}
@@ -143,16 +188,20 @@ export const PlanSelectionStage: React.FC<PlanSelectionStageProps> = ({
                 {savings && (
                   <Alert color="green" variant="light" p="sm">
                     <Text size="sm" fw={600}>
-                      {t('payment.planStage.savingsAmount', 'You save {{amount}}', {
-                        amount: formatPrice(savings.amount, savings.currency)
-                      })}
+                      {t(
+                        "payment.planStage.savingsAmount",
+                        "You save {{amount}}",
+                        {
+                          amount: formatPrice(savings.amount, savings.currency),
+                        },
+                      )}
                     </Text>
                   </Alert>
                 )}
 
-                <div style={{ marginTop: 'auto', paddingTop: '1rem' }}>
+                <div style={{ marginTop: "auto", paddingTop: "1rem" }}>
                   <Button variant="filled" fullWidth size="lg">
-                    {t('payment.planStage.selectYearly', 'Select Yearly')}
+                    {t("payment.planStage.selectYearly", "Select Yearly")}
                   </Button>
                 </div>
               </Stack>
diff --git a/frontend/src/proprietary/components/shared/stripeCheckout/stages/SuccessStage.tsx b/frontend/src/proprietary/components/shared/stripeCheckout/stages/SuccessStage.tsx
index 0d75db3c65..9f0bff06df 100644
--- a/frontend/src/proprietary/components/shared/stripeCheckout/stages/SuccessStage.tsx
+++ b/frontend/src/proprietary/components/shared/stripeCheckout/stages/SuccessStage.tsx
@@ -1,7 +1,16 @@
-import React from 'react';
-import { Alert, Stack, Text, Paper, Code, Button, Group, Loader } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { PollingStatus } from '@app/components/shared/stripeCheckout/types/checkout';
+import React from "react";
+import {
+  Alert,
+  Stack,
+  Text,
+  Paper,
+  Code,
+  Button,
+  Group,
+  Loader,
+} from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import { PollingStatus } from "@app/components/shared/stripeCheckout/types/checkout";
 
 interface SuccessStageProps {
   pollingStatus: PollingStatus;
@@ -19,32 +28,38 @@ export const SuccessStage: React.FC<SuccessStageProps> = ({
   const { t } = useTranslation();
 
   return (
-    <Alert color="green" title={t('payment.success', 'Payment Successful!')}>
+    <Alert color="green" title={t("payment.success", "Payment Successful!")}>
       <Stack gap="md">
         <Text size="sm">
           {t(
-            'payment.successMessage',
-            'Your subscription has been activated successfully.'
+            "payment.successMessage",
+            "Your subscription has been activated successfully.",
           )}
         </Text>
 
         {/* License Key Polling Status */}
-        {pollingStatus === 'polling' && (
+        {pollingStatus === "polling" && (
           <Group gap="xs">
             <Loader size="sm" />
             <Text size="sm" c="dimmed">
               {currentLicenseKey
-                ? t('payment.syncingLicense', 'Syncing your upgraded license...')
-                : t('payment.generatingLicense', 'Generating your license key...')}
+                ? t(
+                    "payment.syncingLicense",
+                    "Syncing your upgraded license...",
+                  )
+                : t(
+                    "payment.generatingLicense",
+                    "Generating your license key...",
+                  )}
             </Text>
           </Group>
         )}
 
-        {pollingStatus === 'ready' && !currentLicenseKey && licenseKey && (
+        {pollingStatus === "ready" && !currentLicenseKey && licenseKey && (
           <Paper withBorder p="md" radius="md" bg="gray.1">
             <Stack gap="sm">
               <Text size="sm" fw={600}>
-                {t('payment.licenseKey', 'Your License Key')}
+                {t("payment.licenseKey", "Your License Key")}
               </Text>
               <Code block>{licenseKey}</Code>
               <Button
@@ -52,48 +67,54 @@ export const SuccessStage: React.FC<SuccessStageProps> = ({
                 size="sm"
                 onClick={() => navigator.clipboard.writeText(licenseKey)}
               >
-                {t('common.copy', 'Copy to Clipboard')}
+                {t("common.copy", "Copy to Clipboard")}
               </Button>
               <Text size="xs" c="dimmed">
                 {t(
-                  'payment.licenseInstructions',
-                  'This has been added to your installation. You will receive a copy in your email as well.'
+                  "payment.licenseInstructions",
+                  "This has been added to your installation. You will receive a copy in your email as well.",
                 )}
               </Text>
             </Stack>
           </Paper>
         )}
 
-        {pollingStatus === 'ready' && currentLicenseKey && (
-          <Alert color="green" title={t('payment.upgradeComplete', 'Upgrade Complete')}>
+        {pollingStatus === "ready" && currentLicenseKey && (
+          <Alert
+            color="green"
+            title={t("payment.upgradeComplete", "Upgrade Complete")}
+          >
             <Text size="sm">
               {t(
-                'payment.upgradeCompleteMessage',
-                'Your subscription has been upgraded successfully. Your existing license key has been updated.'
+                "payment.upgradeCompleteMessage",
+                "Your subscription has been upgraded successfully. Your existing license key has been updated.",
               )}
             </Text>
           </Alert>
         )}
 
-        {pollingStatus === 'timeout' && (
-          <Alert color="yellow" title={t('payment.licenseDelayed', 'License Key Processing')}>
+        {pollingStatus === "timeout" && (
+          <Alert
+            color="yellow"
+            title={t("payment.licenseDelayed", "License Key Processing")}
+          >
             <Text size="sm">
               {t(
-                'payment.licenseDelayedMessage',
-                'Your license key is being generated. Please check your email shortly or contact support.'
+                "payment.licenseDelayedMessage",
+                "Your license key is being generated. Please check your email shortly or contact support.",
               )}
             </Text>
           </Alert>
         )}
 
-        {pollingStatus === 'ready' && (
+        {pollingStatus === "ready" && (
           <Text size="xs" c="dimmed">
-            {t('payment.canCloseWindow', 'You can now close this window.')}
+            {t("payment.canCloseWindow", "You can now close this window.")}
           </Text>
         )}
 
         <Button onClick={onClose} mt="md">
-          {t('common.close', 'Close')}
+          {t("common.close", "Close")}
         </Button>
       </Stack>
     </Alert>
diff --git a/frontend/src/proprietary/components/shared/stripeCheckout/types/checkout.ts b/frontend/src/proprietary/components/shared/stripeCheckout/types/checkout.ts
index 94d94e24ea..9c5d10faab 100644
--- a/frontend/src/proprietary/components/shared/stripeCheckout/types/checkout.ts
+++ b/frontend/src/proprietary/components/shared/stripeCheckout/types/checkout.ts
@@ -1,4 +1,4 @@
-import { PlanTierGroup } from '@app/services/licenseService';
+import { PlanTierGroup } from "@app/services/licenseService";
 
 export interface StripeCheckoutProps {
   opened: boolean;
@@ -7,14 +7,24 @@ export interface StripeCheckoutProps {
   minimumSeats?: number;
   onSuccess?: (sessionId: string) => void;
   onError?: (error: string) => void;
-  onLicenseActivated?: (licenseInfo: {licenseType: string; enabled: boolean; maxUsers: number; hasKey: boolean}) => void;
+  onLicenseActivated?: (licenseInfo: {
+    licenseType: string;
+    enabled: boolean;
+    maxUsers: number;
+    hasKey: boolean;
+  }) => void;
   hostedCheckoutSuccess?: {
     isUpgrade: boolean;
     licenseKey?: string;
   } | null;
 }
 
-export type CheckoutStage = 'email' | 'plan-selection' | 'payment' | 'success' | 'error';
+export type CheckoutStage =
+  | "email"
+  | "plan-selection"
+  | "payment"
+  | "success"
+  | "error";
 
 export type CheckoutState = {
   currentStage: CheckoutStage;
@@ -25,7 +35,7 @@ export type CheckoutState = {
   loading?: boolean;
 };
 
-export type PollingStatus = 'idle' | 'polling' | 'ready' | 'timeout';
+export type PollingStatus = "idle" | "polling" | "ready" | "timeout";
 
 export interface SavingsCalculation {
   amount: number;
diff --git a/frontend/src/proprietary/components/shared/stripeCheckout/utils/cardStyles.ts b/frontend/src/proprietary/components/shared/stripeCheckout/utils/cardStyles.ts
index ac49614364..99e61324aa 100644
--- a/frontend/src/proprietary/components/shared/stripeCheckout/utils/cardStyles.ts
+++ b/frontend/src/proprietary/components/shared/stripeCheckout/utils/cardStyles.ts
@@ -1,10 +1,10 @@
-import { CSSProperties } from 'react';
+import { CSSProperties } from "react";
 
 /**
  * Shared styling utilities for plan cards
  */
 
-export const CARD_MIN_HEIGHT = '400px';
+export const CARD_MIN_HEIGHT = "400px";
 export const PRICE_FONT_WEIGHT = 600;
 
 /**
@@ -12,19 +12,21 @@ export const PRICE_FONT_WEIGHT = 600;
  */
 export function getCardBorderStyle(isHighlighted: boolean): CSSProperties {
   return {
-    borderColor: isHighlighted ? 'var(--mantine-color-green-6)' : undefined,
-    borderWidth: isHighlighted ? '2px' : undefined,
+    borderColor: isHighlighted ? "var(--mantine-color-green-6)" : undefined,
+    borderWidth: isHighlighted ? "2px" : undefined,
   };
 }
 
 /**
  * Get base card style
  */
-export function getBaseCardStyle(isHighlighted: boolean = false): CSSProperties {
+export function getBaseCardStyle(
+  isHighlighted: boolean = false,
+): CSSProperties {
   return {
-    position: 'relative',
-    display: 'flex',
-    flexDirection: 'column',
+    position: "relative",
+    display: "flex",
+    flexDirection: "column",
     minHeight: CARD_MIN_HEIGHT,
     ...getCardBorderStyle(isHighlighted),
   };
@@ -33,12 +35,14 @@ export function getBaseCardStyle(isHighlighted: boolean = false): CSSProperties
 /**
  * Get clickable paper style
  */
-export function getClickablePaperStyle(isHighlighted: boolean = false): CSSProperties {
+export function getClickablePaperStyle(
+  isHighlighted: boolean = false,
+): CSSProperties {
   return {
-    cursor: 'pointer',
-    transition: 'all 0.2s',
-    height: '100%',
-    position: 'relative',
+    cursor: "pointer",
+    transition: "all 0.2s",
+    height: "100%",
+    position: "relative",
     ...getCardBorderStyle(isHighlighted),
   };
 }
diff --git a/frontend/src/proprietary/components/shared/stripeCheckout/utils/checkoutUtils.ts b/frontend/src/proprietary/components/shared/stripeCheckout/utils/checkoutUtils.ts
index 3be3fa5556..72b755c9b8 100644
--- a/frontend/src/proprietary/components/shared/stripeCheckout/utils/checkoutUtils.ts
+++ b/frontend/src/proprietary/components/shared/stripeCheckout/utils/checkoutUtils.ts
@@ -1,18 +1,20 @@
-import { TFunction } from 'i18next';
-import { CheckoutStage } from '@app/components/shared/stripeCheckout/types/checkout';
+import { TFunction } from "i18next";
+import { CheckoutStage } from "@app/components/shared/stripeCheckout/types/checkout";
 
 /**
  * Validate email address format
  */
-export const validateEmail = (email: string): { valid: boolean; error: string } => {
+export const validateEmail = (
+  email: string,
+): { valid: boolean; error: string } => {
   const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
   if (!emailRegex.test(email)) {
     return {
       valid: false,
-      error: 'Please enter a valid email address'
+      error: "Please enter a valid email address",
     };
   }
-  return { valid: true, error: '' };
+  return { valid: true, error: "" };
 };
 
 /**
@@ -21,20 +23,30 @@ export const validateEmail = (email: string): { valid: boolean; error: string }
 export const getModalTitle = (
   stage: CheckoutStage,
   planName: string,
-  t: TFunction
+  t: TFunction,
 ): string => {
   switch (stage) {
-    case 'email':
-      return t('payment.emailStage.modalTitle', 'Get Started - {{planName}}', { planName });
-    case 'plan-selection':
-      return t('payment.planStage.modalTitle', 'Select Billing Period - {{planName}}', { planName });
-    case 'payment':
-      return t('payment.paymentStage.modalTitle', 'Complete Payment - {{planName}}', { planName });
-    case 'success':
-      return t('payment.success', 'Payment Successful!');
-    case 'error':
-      return t('payment.error', 'Payment Error');
+    case "email":
+      return t("payment.emailStage.modalTitle", "Get Started - {{planName}}", {
+        planName,
+      });
+    case "plan-selection":
+      return t(
+        "payment.planStage.modalTitle",
+        "Select Billing Period - {{planName}}",
+        { planName },
+      );
+    case "payment":
+      return t(
+        "payment.paymentStage.modalTitle",
+        "Complete Payment - {{planName}}",
+        { planName },
+      );
+    case "success":
+      return t("payment.success", "Payment Successful!");
+    case "error":
+      return t("payment.error", "Payment Error");
     default:
-      return t('payment.upgradeTitle', 'Upgrade to {{planName}}', { planName });
+      return t("payment.upgradeTitle", "Upgrade to {{planName}}", { planName });
   }
 };
diff --git a/frontend/src/proprietary/components/shared/stripeCheckout/utils/pricingUtils.ts b/frontend/src/proprietary/components/shared/stripeCheckout/utils/pricingUtils.ts
index 9fc5c8416f..b6be83b5d7 100644
--- a/frontend/src/proprietary/components/shared/stripeCheckout/utils/pricingUtils.ts
+++ b/frontend/src/proprietary/components/shared/stripeCheckout/utils/pricingUtils.ts
@@ -21,7 +21,7 @@ export function calculateMonthlyEquivalent(yearlyPrice: number): number {
 export function calculateTotalWithSeats(
   basePrice: number,
   seatPrice: number | undefined,
-  seatCount: number
+  seatCount: number,
 ): number {
   if (seatPrice === undefined) return basePrice;
   return basePrice + seatPrice * seatCount;
@@ -30,7 +30,11 @@ export function calculateTotalWithSeats(
 /**
  * Format price with currency symbol
  */
-export function formatPrice(amount: number, currency: string, decimals: number = 2): string {
+export function formatPrice(
+  amount: number,
+  currency: string,
+  decimals: number = 2,
+): string {
   return `${currency}${amount.toFixed(decimals)}`;
 }
 
@@ -40,21 +44,23 @@ export function formatPrice(amount: number, currency: string, decimals: number =
  */
 export function calculateDisplayPricing(
   monthly?: { price: number; seatPrice?: number; currency: string },
-  yearly?: { price: number; seatPrice?: number; currency: string }
+  yearly?: { price: number; seatPrice?: number; currency: string },
 ): PriceCalculation {
   // Default to monthly if no yearly exists
   if (!yearly) {
     return {
       displayPrice: monthly?.price || 0,
       displaySeatPrice: monthly?.seatPrice,
-      displayCurrency: monthly?.currency || '£',
+      displayCurrency: monthly?.currency || "£",
     };
   }
 
   // Use yearly price divided by 12 for best value display
   return {
     displayPrice: calculateMonthlyEquivalent(yearly.price),
-    displaySeatPrice: yearly.seatPrice ? calculateMonthlyEquivalent(yearly.seatPrice) : undefined,
+    displaySeatPrice: yearly.seatPrice
+      ? calculateMonthlyEquivalent(yearly.seatPrice)
+      : undefined,
     displayCurrency: yearly.currency,
   };
 }
diff --git a/frontend/src/proprietary/components/shared/stripeCheckout/utils/savingsCalculator.ts b/frontend/src/proprietary/components/shared/stripeCheckout/utils/savingsCalculator.ts
index 3a0b4d6c88..b508e1507e 100644
--- a/frontend/src/proprietary/components/shared/stripeCheckout/utils/savingsCalculator.ts
+++ b/frontend/src/proprietary/components/shared/stripeCheckout/utils/savingsCalculator.ts
@@ -1,5 +1,5 @@
-import { PlanTierGroup } from '@app/services/licenseService';
-import { SavingsCalculation } from '@app/components/shared/stripeCheckout/types/checkout';
+import { PlanTierGroup } from "@app/services/licenseService";
+import { SavingsCalculation } from "@app/components/shared/stripeCheckout/types/checkout";
 
 /**
  * Calculate savings for yearly vs monthly plans
@@ -7,20 +7,26 @@ import { SavingsCalculation } from '@app/components/shared/stripeCheckout/types/
  */
 export const calculateSavings = (
   planGroup: PlanTierGroup,
-  minimumSeats: number
+  minimumSeats: number,
 ): SavingsCalculation | null => {
   if (!planGroup.yearly || !planGroup.monthly) return null;
 
-  const isEnterprise = planGroup.tier === 'enterprise';
+  const isEnterprise = planGroup.tier === "enterprise";
   const seatCount = minimumSeats || 1;
 
   let monthlyAnnual: number;
   let yearlyTotal: number;
 
-  if (isEnterprise && planGroup.monthly.seatPrice && planGroup.yearly.seatPrice) {
+  if (
+    isEnterprise &&
+    planGroup.monthly.seatPrice &&
+    planGroup.yearly.seatPrice
+  ) {
     // Enterprise: (base + seats) * 12 vs (base + seats) yearly
-    monthlyAnnual = (planGroup.monthly.price + (planGroup.monthly.seatPrice * seatCount)) * 12;
-    yearlyTotal = planGroup.yearly.price + (planGroup.yearly.seatPrice * seatCount);
+    monthlyAnnual =
+      (planGroup.monthly.price + planGroup.monthly.seatPrice * seatCount) * 12;
+    yearlyTotal =
+      planGroup.yearly.price + planGroup.yearly.seatPrice * seatCount;
   } else {
     // Server: price * 12 vs yearly price
     monthlyAnnual = planGroup.monthly.price * 12;
@@ -33,6 +39,6 @@ export const calculateSavings = (
   return {
     amount: savings,
     percent: savingsPercent,
-    currency: planGroup.yearly.currency
+    currency: planGroup.yearly.currency,
   };
 };
diff --git a/frontend/src/proprietary/components/workflow/ParticipantView.tsx b/frontend/src/proprietary/components/workflow/ParticipantView.tsx
index 6717b88203..cd2c362791 100644
--- a/frontend/src/proprietary/components/workflow/ParticipantView.tsx
+++ b/frontend/src/proprietary/components/workflow/ParticipantView.tsx
@@ -1,5 +1,5 @@
-import React, { useState, useEffect, useRef } from 'react';
-import { useTranslation } from 'react-i18next';
+import React, { useState, useEffect, useRef } from "react";
+import { useTranslation } from "react-i18next";
 import {
   Stack,
   Card,
@@ -12,12 +12,12 @@ import {
   TextInput,
   FileInput,
   Select,
-} from '@mantine/core';
-import { useParticipantSession } from '@app/hooks/workflow/useParticipantSession';
-import InfoIcon from '@mui/icons-material/Info';
-import DownloadIcon from '@mui/icons-material/Download';
-import CheckCircleIcon from '@mui/icons-material/CheckCircle';
-import CancelIcon from '@mui/icons-material/Cancel';
+} from "@mantine/core";
+import { useParticipantSession } from "@app/hooks/workflow/useParticipantSession";
+import InfoIcon from "@mui/icons-material/Info";
+import DownloadIcon from "@mui/icons-material/Download";
+import CheckCircleIcon from "@mui/icons-material/CheckCircle";
+import CancelIcon from "@mui/icons-material/Cancel";
 
 interface ParticipantViewProps {
   token: string;
@@ -25,63 +25,96 @@ interface ParticipantViewProps {
 
 const ParticipantView: React.FC<ParticipantViewProps> = ({ token }) => {
   const { t } = useTranslation();
-  const { session, participant, loading, error, submitSignature, decline, downloadDocument } =
-    useParticipantSession(token);
+  const {
+    session,
+    participant,
+    loading,
+    error,
+    submitSignature,
+    decline,
+    downloadDocument,
+  } = useParticipantSession(token);
 
-  const [certType, setCertType] = useState<string>('P12');
-  const [password, setPassword] = useState<string>('');
+  const [certType, setCertType] = useState<string>("P12");
+  const [password, setPassword] = useState<string>("");
   const [certFile, setCertFile] = useState<File | null>(null);
-  const [location, setLocation] = useState<string>('');
-  const [reason, setReason] = useState<string>('Document Signing');
+  const [location, setLocation] = useState<string>("");
+  const [reason, setReason] = useState<string>("Document Signing");
   const [showSignature, _setShowSignature] = useState<boolean>(true);
   const [pageNumber, setPageNumber] = useState<number>(1);
-  const [declineReason, _setDeclineReason] = useState<string>('');
+  const [declineReason, _setDeclineReason] = useState<string>("");
   const [isSubmitting, setIsSubmitting] = useState<boolean>(false);
-  const [notification, setNotification] = useState<{ type: 'success' | 'error'; message: string } | null>(null);
+  const [notification, setNotification] = useState<{
+    type: "success" | "error";
+    message: string;
+  } | null>(null);
 
   type CertValidationState =
-    | { status: 'idle' }
-    | { status: 'validating' }
-    | { status: 'valid'; notAfter: string | null; subjectName: string | null }
-    | { status: 'error'; message: string };
+    | { status: "idle" }
+    | { status: "validating" }
+    | { status: "valid"; notAfter: string | null; subjectName: string | null }
+    | { status: "error"; message: string };
 
-  const [certValidation, setCertValidation] = useState<CertValidationState>({ status: 'idle' });
+  const [certValidation, setCertValidation] = useState<CertValidationState>({
+    status: "idle",
+  });
   const validationTimerRef = useRef<ReturnType<typeof setTimeout> | null>(null);
 
   useEffect(() => {
-    if (certType === 'SERVER' || !certFile) {
-      setCertValidation({ status: 'idle' });
+    if (certType === "SERVER" || !certFile) {
+      setCertValidation({ status: "idle" });
       return;
     }
 
     if (validationTimerRef.current) clearTimeout(validationTimerRef.current);
-    setCertValidation({ status: 'validating' });
+    setCertValidation({ status: "validating" });
 
     validationTimerRef.current = setTimeout(async () => {
       try {
         const formData = new FormData();
-        formData.append('participantToken', token);
-        formData.append('certType', certType);
-        formData.append('password', password);
-        if (certType === 'JKS') {
-          formData.append('jksFile', certFile);
+        formData.append("participantToken", token);
+        formData.append("certType", certType);
+        formData.append("password", password);
+        if (certType === "JKS") {
+          formData.append("jksFile", certFile);
         } else {
-          formData.append('p12File', certFile);
+          formData.append("p12File", certFile);
         }
 
-        const res = await fetch('/api/v1/workflow/participant/validate-certificate', {
-          method: 'POST',
-          body: formData,
-        });
+        const res = await fetch(
+          "/api/v1/workflow/participant/validate-certificate",
+          {
+            method: "POST",
+            body: formData,
+          },
+        );
         const data = await res.json();
 
         if (data.valid) {
-          setCertValidation({ status: 'valid', notAfter: data.notAfter, subjectName: data.subjectName });
+          setCertValidation({
+            status: "valid",
+            notAfter: data.notAfter,
+            subjectName: data.subjectName,
+          });
         } else {
-          setCertValidation({ status: 'error', message: data.error ?? t('certSign.collab.participant.certInvalidFallback', 'Invalid certificate') });
+          setCertValidation({
+            status: "error",
+            message:
+              data.error ??
+              t(
+                "certSign.collab.participant.certInvalidFallback",
+                "Invalid certificate",
+              ),
+          });
         }
       } catch {
-        setCertValidation({ status: 'error', message: t('certSign.collab.participant.certNetworkError', 'Could not validate certificate') });
+        setCertValidation({
+          status: "error",
+          message: t(
+            "certSign.collab.participant.certNetworkError",
+            "Could not validate certificate",
+          ),
+        });
       }
     }, 600);
 
@@ -91,8 +124,11 @@ const ParticipantView: React.FC<ParticipantViewProps> = ({ token }) => {
   }, [certFile, password, certType, token]);
 
   const handleSubmitSignature = async () => {
-    if (!certFile && certType !== 'SERVER') {
-      setNotification({ type: 'error', message: 'Please select a certificate file' });
+    if (!certFile && certType !== "SERVER") {
+      setNotification({
+        type: "error",
+        message: "Please select a certificate file",
+      });
       return;
     }
 
@@ -103,30 +139,44 @@ const ParticipantView: React.FC<ParticipantViewProps> = ({ token }) => {
         participantToken: token,
         certType,
         password,
-        p12File: certType === 'P12' ? certFile || undefined : undefined,
-        jksFile: certType === 'JKS' ? certFile || undefined : undefined,
+        p12File: certType === "P12" ? certFile || undefined : undefined,
+        jksFile: certType === "JKS" ? certFile || undefined : undefined,
         showSignature,
         pageNumber,
         location,
         reason,
         showLogo: true,
       });
-      setNotification({ type: 'success', message: 'Signature submitted successfully!' });
-    } catch (err: any) {
-      setNotification({ type: 'error', message: `Failed to submit signature: ${err.message}` });
+      setNotification({
+        type: "success",
+        message: "Signature submitted successfully!",
+      });
+    } catch (err: unknown) {
+      setNotification({
+        type: "error",
+        message: `Failed to submit signature: ${err instanceof Error ? err.message : String(err)}`,
+      });
     } finally {
       setIsSubmitting(false);
     }
   };
 
   const handleDecline = async () => {
-    if (window.confirm('Are you sure you want to decline signing this document?')) {
+    if (
+      window.confirm("Are you sure you want to decline signing this document?")
+    ) {
       setNotification(null);
       try {
-        await decline(token, declineReason || 'Declined by participant');
-        setNotification({ type: 'success', message: 'You have declined this signing request.' });
-      } catch (err: any) {
-        setNotification({ type: 'error', message: `Failed to decline: ${err.message}` });
+        await decline(token, declineReason || "Declined by participant");
+        setNotification({
+          type: "success",
+          message: "You have declined this signing request.",
+        });
+      } catch (err: unknown) {
+        setNotification({
+          type: "error",
+          message: `Failed to decline: ${err instanceof Error ? err.message : String(err)}`,
+        });
       }
     }
   };
@@ -158,29 +208,38 @@ const ParticipantView: React.FC<ParticipantViewProps> = ({ token }) => {
 
   const getStatusBadge = (status: string) => {
     switch (status) {
-      case 'SIGNED':
+      case "SIGNED":
         return <Badge color="green">Signed</Badge>;
-      case 'DECLINED':
+      case "DECLINED":
         return <Badge color="red">Declined</Badge>;
-      case 'VIEWED':
+      case "VIEWED":
         return <Badge color="blue">Viewed</Badge>;
-      case 'NOTIFIED':
+      case "NOTIFIED":
         return <Badge color="yellow">Notified</Badge>;
-      case 'PENDING':
+      case "PENDING":
         return <Badge color="gray">Pending</Badge>;
       default:
         return <Badge>{status}</Badge>;
     }
   };
 
-  const canSign = !participant.hasCompleted && !participant.isExpired && session.status === 'IN_PROGRESS';
+  const canSign =
+    !participant.hasCompleted &&
+    !participant.isExpired &&
+    session.status === "IN_PROGRESS";
 
   return (
     <Stack gap="md">
       {notification && (
         <Alert
-          icon={notification.type === 'success' ? <CheckCircleIcon fontSize="small" /> : <InfoIcon fontSize="small" />}
-          color={notification.type === 'success' ? 'green' : 'red'}
+          icon={
+            notification.type === "success" ? (
+              <CheckCircleIcon fontSize="small" />
+            ) : (
+              <InfoIcon fontSize="small" />
+            )
+          }
+          color={notification.type === "success" ? "green" : "red"}
           withCloseButton
           onClose={() => setNotification(null)}
         >
@@ -202,7 +261,11 @@ const ParticipantView: React.FC<ParticipantViewProps> = ({ token }) => {
           </Group>
 
           {session.message && (
-            <Alert icon={<InfoIcon fontSize="small" />} color="blue" variant="light">
+            <Alert
+              icon={<InfoIcon fontSize="small" />}
+              color="blue"
+              variant="light"
+            >
               <Text size="sm">{session.message}</Text>
             </Alert>
           )}
@@ -236,17 +299,17 @@ const ParticipantView: React.FC<ParticipantViewProps> = ({ token }) => {
             <Select
               label="Certificate Type"
               value={certType}
-              onChange={(value) => setCertType(value || 'P12')}
+              onChange={(value) => setCertType(value || "P12")}
               data={[
-                { value: 'P12', label: 'P12/PKCS12 Certificate' },
-                { value: 'JKS', label: 'JKS Keystore' },
-                { value: 'SERVER', label: 'Server Certificate (if available)' },
+                { value: "P12", label: "P12/PKCS12 Certificate" },
+                { value: "JKS", label: "JKS Keystore" },
+                { value: "SERVER", label: "Server Certificate (if available)" },
               ]}
               size="sm"
               data-testid="cert-type-select"
             />
 
-            {certType !== 'SERVER' && (
+            {certType !== "SERVER" && (
               <>
                 <FileInput
                   label="Certificate File"
@@ -268,25 +331,55 @@ const ParticipantView: React.FC<ParticipantViewProps> = ({ token }) => {
                 />
 
                 {/* Certificate validation feedback */}
-                {certValidation.status === 'validating' && (
-                  <Text size="sm" c="dimmed" data-testid="cert-validation-feedback">
-                    {t('certSign.collab.participant.certValidating', 'Validating certificate...')}
+                {certValidation.status === "validating" && (
+                  <Text
+                    size="sm"
+                    c="dimmed"
+                    data-testid="cert-validation-feedback"
+                  >
+                    {t(
+                      "certSign.collab.participant.certValidating",
+                      "Validating certificate...",
+                    )}
                   </Text>
                 )}
-                {certValidation.status === 'valid' && (
-                  <Text size="sm" c="green" data-testid="cert-validation-feedback">
-                    {t('certSign.collab.participant.certValid', '✓ Certificate valid')}
+                {certValidation.status === "valid" && (
+                  <Text
+                    size="sm"
+                    c="green"
+                    data-testid="cert-validation-feedback"
+                  >
+                    {t(
+                      "certSign.collab.participant.certValid",
+                      "✓ Certificate valid",
+                    )}
                     {certValidation.notAfter
-                      ? t('certSign.collab.participant.certValidUntil', ' until {{date}}', {
-                          date: new Date(certValidation.notAfter).toLocaleDateString(),
-                        })
-                      : ''}
-                    {certValidation.subjectName ? ` · ${certValidation.subjectName}` : ''}
+                      ? t(
+                          "certSign.collab.participant.certValidUntil",
+                          " until {{date}}",
+                          {
+                            date: new Date(
+                              certValidation.notAfter,
+                            ).toLocaleDateString(),
+                          },
+                        )
+                      : ""}
+                    {certValidation.subjectName
+                      ? ` · ${certValidation.subjectName}`
+                      : ""}
                   </Text>
                 )}
-                {certValidation.status === 'error' && (
-                  <Text size="sm" c="red" data-testid="cert-validation-feedback">
-                    {t('certSign.collab.participant.certInvalid', '✗ {{error}}', { error: certValidation.message })}
+                {certValidation.status === "error" && (
+                  <Text
+                    size="sm"
+                    c="red"
+                    data-testid="cert-validation-feedback"
+                  >
+                    {t(
+                      "certSign.collab.participant.certInvalid",
+                      "✗ {{error}}",
+                      { error: certValidation.message },
+                    )}
                   </Text>
                 )}
               </>
@@ -312,7 +405,9 @@ const ParticipantView: React.FC<ParticipantViewProps> = ({ token }) => {
               label="Page Number (optional)"
               type="number"
               value={pageNumber}
-              onChange={(e) => setPageNumber(parseInt(e.currentTarget.value) || 1)}
+              onChange={(e) =>
+                setPageNumber(parseInt(e.currentTarget.value) || 1)
+              }
               size="sm"
               min={1}
             />
@@ -322,7 +417,9 @@ const ParticipantView: React.FC<ParticipantViewProps> = ({ token }) => {
                 leftSection={<CheckCircleIcon fontSize="small" />}
                 onClick={handleSubmitSignature}
                 loading={isSubmitting}
-                disabled={isSubmitting || certValidation.status === 'validating'}
+                disabled={
+                  isSubmitting || certValidation.status === "validating"
+                }
                 color="green"
                 data-testid="submit-signature-button"
               >
@@ -345,7 +442,8 @@ const ParticipantView: React.FC<ParticipantViewProps> = ({ token }) => {
 
       {participant.hasCompleted && (
         <Alert icon={<CheckCircleIcon fontSize="small" />} color="green">
-          You have {participant.status === 'SIGNED' ? 'signed' : 'declined'} this document.
+          You have {participant.status === "SIGNED" ? "signed" : "declined"}{" "}
+          this document.
         </Alert>
       )}
 
diff --git a/frontend/src/proprietary/constants/planConstants.ts b/frontend/src/proprietary/constants/planConstants.ts
index 9c997f17d4..6a03a72b7e 100644
--- a/frontend/src/proprietary/constants/planConstants.ts
+++ b/frontend/src/proprietary/constants/planConstants.ts
@@ -1,4 +1,4 @@
-import type { PlanFeature } from '@app/types/license';
+import type { PlanFeature } from "@app/types/license";
 
 /**
  * Shared plan feature definitions for Stirling PDF Self-Hosted
@@ -7,98 +7,94 @@ import type { PlanFeature } from '@app/types/license';
 
 export const PLAN_FEATURES = {
   FREE: [
-    { name: 'Self-hosted deployment', included: true },
-    { name: 'All PDF operations', included: true },
-    { name: 'Secure Login Support', included: true },
-    { name: 'Community support', included: true },
-    { name: 'Regular updates', included: true },
-    { name: 'up to 5 users', included: true },
-    { name: 'Unlimited users', included: false },
-    { name: 'Google drive integration', included: false },
-    { name: 'External Database', included: false },
-    { name: 'Editing text in pdfs', included: false },
-    { name: 'Users limited to seats', included: false },
-    { name: 'SSO', included: false },
-    { name: 'SAML', included: false },
-    { name: 'Auditing', included: false },
-    { name: 'Usage tracking', included: false },
-    { name: 'Prometheus Support', included: false },
-    { name: 'Custom PDF metadata', included: false },
+    { name: "Self-hosted deployment", included: true },
+    { name: "All PDF operations", included: true },
+    { name: "Secure Login Support", included: true },
+    { name: "Community support", included: true },
+    { name: "Regular updates", included: true },
+    { name: "up to 5 users", included: true },
+    { name: "Unlimited users", included: false },
+    { name: "Google drive integration", included: false },
+    { name: "External Database", included: false },
+    { name: "Editing text in pdfs", included: false },
+    { name: "Users limited to seats", included: false },
+    { name: "SSO", included: false },
+    { name: "SAML", included: false },
+    { name: "Auditing", included: false },
+    { name: "Usage tracking", included: false },
+    { name: "Prometheus Support", included: false },
+    { name: "Custom PDF metadata", included: false },
   ] as PlanFeature[],
 
   SERVER: [
-    { name: 'Self-hosted deployment', included: true },
-    { name: 'All PDF operations', included: true },
-    { name: 'Secure Login Support', included: true },
-    { name: 'Community support', included: true },
-    { name: 'Regular updates', included: true },
-    { name: 'Up to 5 users', included: false },
-    { name: 'Unlimited users', included: true },
-    { name: 'Google drive integration', included: true },
-    { name: 'External Database', included: true },
-    { name: 'Editing text in pdfs', included: true },
-    { name: 'Users limited to seats', included: false },
-    { name: 'SSO', included: true },
-    { name: 'SAML', included: false },
-    { name: 'Auditing', included: false },
-    { name: 'Usage tracking', included: false },
-    { name: 'Prometheus Support', included: false },
-    { name: 'Custom PDF metadata', included: false },
+    { name: "Self-hosted deployment", included: true },
+    { name: "All PDF operations", included: true },
+    { name: "Secure Login Support", included: true },
+    { name: "Community support", included: true },
+    { name: "Regular updates", included: true },
+    { name: "Up to 5 users", included: false },
+    { name: "Unlimited users", included: true },
+    { name: "Google drive integration", included: true },
+    { name: "External Database", included: true },
+    { name: "Editing text in pdfs", included: true },
+    { name: "Users limited to seats", included: false },
+    { name: "SSO", included: true },
+    { name: "SAML", included: false },
+    { name: "Auditing", included: false },
+    { name: "Usage tracking", included: false },
+    { name: "Prometheus Support", included: false },
+    { name: "Custom PDF metadata", included: false },
   ] as PlanFeature[],
 
   ENTERPRISE: [
-    { name: 'Self-hosted deployment', included: true },
-    { name: 'All PDF operations', included: true },
-    { name: 'Secure Login Support', included: true },
-    { name: 'Community support', included: true },
-    { name: 'Regular updates', included: true },
-    { name: 'up to 5 users', included: false },
-    { name: 'Unlimited users', included: false },
-    { name: 'Google drive integration', included: true },
-    { name: 'External Database', included: true },
-    { name: 'Editing text in pdfs', included: true },
-    { name: 'Users limited to seats', included: true },
-    { name: 'SSO', included: true },
-    { name: 'SAML', included: true },
-    { name: 'Auditing', included: true },
-    { name: 'Usage tracking', included: true },
-    { name: 'Prometheus Support', included: true },
-    { name: 'Custom PDF metadata', included: true },
+    { name: "Self-hosted deployment", included: true },
+    { name: "All PDF operations", included: true },
+    { name: "Secure Login Support", included: true },
+    { name: "Community support", included: true },
+    { name: "Regular updates", included: true },
+    { name: "up to 5 users", included: false },
+    { name: "Unlimited users", included: false },
+    { name: "Google drive integration", included: true },
+    { name: "External Database", included: true },
+    { name: "Editing text in pdfs", included: true },
+    { name: "Users limited to seats", included: true },
+    { name: "SSO", included: true },
+    { name: "SAML", included: true },
+    { name: "Auditing", included: true },
+    { name: "Usage tracking", included: true },
+    { name: "Prometheus Support", included: true },
+    { name: "Custom PDF metadata", included: true },
   ] as PlanFeature[],
 } as const;
 
 export const PLAN_HIGHLIGHTS = {
-  FREE: [
-    'Up to 5 users',
-    'Self-hosted',
-    'All basic features'
-  ],
+  FREE: ["Up to 5 users", "Self-hosted", "All basic features"],
   SERVER_MONTHLY: [
-    'Self-hosted on your infrastructure',
-    'Unlimited users',
-    'Advanced integrations',
-    'SSO (OAuth2/OIDC)',
-    'Editing text in PDFs',
-    'Cancel anytime'
+    "Self-hosted on your infrastructure",
+    "Unlimited users",
+    "Advanced integrations",
+    "SSO (OAuth2/OIDC)",
+    "Editing text in PDFs",
+    "Cancel anytime",
   ],
   SERVER_YEARLY: [
-    'Self-hosted on your infrastructure',
-    'Unlimited users',
-    'Advanced integrations',
-    'SSO (OAuth2/OIDC)',
-    'Editing text in PDFs',
-    'Save with annual billing'
+    "Self-hosted on your infrastructure",
+    "Unlimited users",
+    "Advanced integrations",
+    "SSO (OAuth2/OIDC)",
+    "Editing text in PDFs",
+    "Save with annual billing",
   ],
   ENTERPRISE_MONTHLY: [
-    'Enterprise features (SAML, Auditing)',
-    'Usage tracking & Prometheus',
-    'Custom PDF metadata',
-    'Per-seat licensing'
+    "Enterprise features (SAML, Auditing)",
+    "Usage tracking & Prometheus",
+    "Custom PDF metadata",
+    "Per-seat licensing",
   ],
   ENTERPRISE_YEARLY: [
-    'Enterprise features (SAML, Auditing)',
-    'Usage tracking & Prometheus',
-    'Custom PDF metadata',
-    'Save with annual billing'
-  ]
+    "Enterprise features (SAML, Auditing)",
+    "Usage tracking & Prometheus",
+    "Custom PDF metadata",
+    "Save with annual billing",
+  ],
 } as const;
diff --git a/frontend/src/proprietary/constants/staticStripeLinks.ts b/frontend/src/proprietary/constants/staticStripeLinks.ts
index 249a64c9e7..6b78a09fd5 100644
--- a/frontend/src/proprietary/constants/staticStripeLinks.ts
+++ b/frontend/src/proprietary/constants/staticStripeLinks.ts
@@ -20,14 +20,14 @@ export interface StaticStripeLinks {
 // PRODCUTION LINKS FOR LIVE SERVER
 export const STATIC_STRIPE_LINKS: StaticStripeLinks = {
   server: {
-    monthly: 'https://buy.stripe.com/fZu4gB8Nv6ysfAj0ts8Zq03',
-    yearly: 'https://buy.stripe.com/9B68wR6Fn0a40Fpcca8Zq02',
+    monthly: "https://buy.stripe.com/fZu4gB8Nv6ysfAj0ts8Zq03",
+    yearly: "https://buy.stripe.com/9B68wR6Fn0a40Fpcca8Zq02",
   },
   enterprise: {
-    monthly: '',
-    yearly: '',
+    monthly: "",
+    yearly: "",
   },
-  billingPortal: 'https://billing.stripe.com/p/login/5kA6pT6Xa7z59HO4gg',
+  billingPortal: "https://billing.stripe.com/p/login/5kA6pT6Xa7z59HO4gg",
 };
 
 // LINKS FOR TEST SERVER:
@@ -49,7 +49,10 @@ export const STATIC_STRIPE_LINKS: StaticStripeLinks = {
  * @param email - The email address to prefill
  * @returns The complete URL with encoded email parameter
  */
-export function buildStripeUrlWithEmail(baseUrl: string, email: string): string {
+export function buildStripeUrlWithEmail(
+  baseUrl: string,
+  email: string,
+): string {
   const encodedEmail = encodeURIComponent(email);
   return `${baseUrl}?locked_prefilled_email=${encodedEmail}`;
 }
diff --git a/frontend/src/proprietary/contexts/CheckoutContext.tsx b/frontend/src/proprietary/contexts/CheckoutContext.tsx
index d6c6db86ca..5c6406639a 100644
--- a/frontend/src/proprietary/contexts/CheckoutContext.tsx
+++ b/frontend/src/proprietary/contexts/CheckoutContext.tsx
@@ -1,32 +1,50 @@
-import React, { createContext, useContext, useState, useCallback, useEffect, ReactNode } from 'react';
-import { useTranslation } from 'react-i18next';
-import licenseService, { PlanTierGroup, LicenseInfo, mapLicenseToTier, PlanTier } from '@app/services/licenseService';
-import { StripeCheckout } from '@app/components/shared/stripeCheckout';
-import { userManagementService } from '@app/services/userManagementService';
-import { alert } from '@app/components/toast';
-import { pollLicenseKeyWithBackoff, activateLicenseKey, resyncExistingLicense } from '@app/utils/licenseCheckoutUtils';
-import { useLicense } from '@app/contexts/LicenseContext';
-import { isSupabaseConfigured } from '@app/services/supabaseClient';
-import { getPreferredCurrency } from '@app/utils/currencyDetection';
+import React, {
+  createContext,
+  useContext,
+  useState,
+  useCallback,
+  useEffect,
+  ReactNode,
+} from "react";
+import { useTranslation } from "react-i18next";
+import licenseService, {
+  PlanTierGroup,
+  LicenseInfo,
+  mapLicenseToTier,
+  PlanTier,
+} from "@app/services/licenseService";
+import { StripeCheckout } from "@app/components/shared/stripeCheckout";
+import { userManagementService } from "@app/services/userManagementService";
+import { alert } from "@app/components/toast";
+import {
+  pollLicenseKeyWithBackoff,
+  activateLicenseKey,
+  resyncExistingLicense,
+} from "@app/utils/licenseCheckoutUtils";
+import { useLicense } from "@app/contexts/LicenseContext";
+import { isSupabaseConfigured } from "@app/services/supabaseClient";
+import { getPreferredCurrency } from "@app/utils/currencyDetection";
 
 export interface CheckoutOptions {
-  minimumSeats?: number;      // Override calculated seats for enterprise
-  currency?: string;          // Optional currency override (auto-detected from locale)
-  onSuccess?: (sessionId: string) => void;  // Callback after successful payment
-  onError?: (error: string) => void;  // Callback on error
+  minimumSeats?: number; // Override calculated seats for enterprise
+  currency?: string; // Optional currency override (auto-detected from locale)
+  onSuccess?: (sessionId: string) => void; // Callback after successful payment
+  onError?: (error: string) => void; // Callback on error
 }
 
 interface CheckoutContextValue {
   openCheckout: (
-    tier: 'server' | 'enterprise',
-    options?: CheckoutOptions
+    tier: "server" | "enterprise",
+    options?: CheckoutOptions,
   ) => Promise<void>;
   closeCheckout: () => void;
   isOpen: boolean;
   isLoading: boolean;
 }
 
-const CheckoutContext = createContext<CheckoutContextValue | undefined>(undefined);
+const CheckoutContext = createContext<CheckoutContextValue | undefined>(
+  undefined,
+);
 
 interface CheckoutProviderProps {
   children: ReactNode;
@@ -35,13 +53,14 @@ interface CheckoutProviderProps {
 
 export const CheckoutProvider: React.FC<CheckoutProviderProps> = ({
   children,
-  defaultCurrency
+  defaultCurrency,
 }) => {
   const { t, i18n } = useTranslation();
   const { refetchLicense } = useLicense();
   const [isOpen, setIsOpen] = useState(false);
   const [isLoading, setIsLoading] = useState(false);
-  const [selectedPlanGroup, setSelectedPlanGroup] = useState<PlanTierGroup | null>(null);
+  const [selectedPlanGroup, setSelectedPlanGroup] =
+    useState<PlanTierGroup | null>(null);
   const [minimumSeats, setMinimumSeats] = useState<number>(1);
   const [currentCurrency, setCurrentCurrency] = useState(() => {
     // Use provided default or auto-detect from locale
@@ -59,22 +78,25 @@ export const CheckoutProvider: React.FC<CheckoutProviderProps> = ({
   const [plansLoading, setPlansLoading] = useState(false);
 
   // Lazy fetch plans only when needed
-  const fetchPlansIfNeeded = useCallback(async (currency: string) => {
-    // Don't fetch if already loading
-    if (plansLoading) return;
+  const fetchPlansIfNeeded = useCallback(
+    async (currency: string) => {
+      // Don't fetch if already loading
+      if (plansLoading) return;
 
-    try {
-      setPlansLoading(true);
-      const response = await licenseService.getPlans(currency);
-      setPlans(response.plans);
-      setPlansLoaded(true);
-    } catch (error) {
-      console.error('Failed to fetch plans:', error);
-      // Don't block - let components handle the error
-    } finally {
-      setPlansLoading(false);
-    }
-  }, [plansLoading]);
+      try {
+        setPlansLoading(true);
+        const response = await licenseService.getPlans(currency);
+        setPlans(response.plans);
+        setPlansLoaded(true);
+      } catch (error) {
+        console.error("Failed to fetch plans:", error);
+        // Don't block - let components handle the error
+      } finally {
+        setPlansLoading(false);
+      }
+    },
+    [plansLoading],
+  );
 
   const refetchPlans = useCallback(() => {
     setPlansLoaded(false); // Force refetch
@@ -85,33 +107,35 @@ export const CheckoutProvider: React.FC<CheckoutProviderProps> = ({
   useEffect(() => {
     const handleCheckoutReturn = async () => {
       const urlParams = new URLSearchParams(window.location.search);
-      const paymentStatus = urlParams.get('payment_status');
-      const sessionId = urlParams.get('session_id');
+      const paymentStatus = urlParams.get("payment_status");
+      const sessionId = urlParams.get("session_id");
 
-      if (paymentStatus === 'success' && sessionId) {
-        console.log('Payment successful via hosted checkout:', sessionId);
+      if (paymentStatus === "success" && sessionId) {
+        console.log("Payment successful via hosted checkout:", sessionId);
 
         // Clear URL parameters
-        window.history.replaceState({}, '', window.location.pathname);
+        window.history.replaceState({}, "", window.location.pathname);
 
         // Fetch current license info to determine upgrade vs new
         let licenseInfo: LicenseInfo | null = null;
         try {
           licenseInfo = await licenseService.getLicenseInfo();
         } catch (err) {
-          console.warn('Could not fetch license info:', err);
+          console.warn("Could not fetch license info:", err);
         }
 
         // Check if this is an upgrade or new subscription
         // Only treat as upgrade if there's a valid PRO/ENTERPRISE license (not NORMAL/free tier)
-        if (licenseInfo?.licenseType && licenseInfo.licenseType !== 'NORMAL') {
+        if (licenseInfo?.licenseType && licenseInfo.licenseType !== "NORMAL") {
           // UPGRADE: Resync existing license with Keygen
-          console.log('Upgrade detected - resyncing existing license');
+          console.log("Upgrade detected - resyncing existing license");
 
           const activation = await resyncExistingLicense();
 
           if (activation.success) {
-            console.log('License synced successfully, refreshing license context');
+            console.log(
+              "License synced successfully, refreshing license context",
+            );
 
             // Ensure plans are loaded before using them
             if (!plansLoaded) {
@@ -123,9 +147,10 @@ export const CheckoutProvider: React.FC<CheckoutProviderProps> = ({
             await refetchPlans();
 
             // Determine tier from license type
-            const tier = activation.licenseType === 'ENTERPRISE' ? 'enterprise' : 'server';
+            const tier =
+              activation.licenseType === "ENTERPRISE" ? "enterprise" : "server";
             const planGroups = licenseService.groupPlansByTier(plans);
-            const planGroup = planGroups.find(pg => pg.tier === tier);
+            const planGroup = planGroups.find((pg) => pg.tier === tier);
 
             if (planGroup) {
               // Reopen modal to show success
@@ -135,24 +160,30 @@ export const CheckoutProvider: React.FC<CheckoutProviderProps> = ({
             } else {
               // Fallback to toast if plan group not found
               alert({
-                alertType: 'success',
-                title: t('payment.upgradeSuccess'),
+                alertType: "success",
+                title: t("payment.upgradeSuccess"),
               });
             }
           } else {
-            console.error('Failed to sync license after upgrade:', activation.error);
+            console.error(
+              "Failed to sync license after upgrade:",
+              activation.error,
+            );
             alert({
-              alertType: 'error',
-              title: t('payment.syncError'),
+              alertType: "error",
+              title: t("payment.syncError"),
             });
           }
         } else {
           // NEW SUBSCRIPTION: Poll for license key
-          console.log('New subscription - polling for license key');
+          console.log("New subscription - polling for license key");
 
           try {
             const installationId = await licenseService.getInstallationId();
-            console.log('Polling for license key with installation ID:', installationId);
+            console.log(
+              "Polling for license key with installation ID:",
+              installationId,
+            );
 
             // Use shared polling utility
             const result = await pollLicenseKeyWithBackoff(installationId);
@@ -174,77 +205,90 @@ export const CheckoutProvider: React.FC<CheckoutProviderProps> = ({
                 await refetchPlans();
 
                 // Determine tier from license type
-                const tier = activation.licenseType === 'ENTERPRISE' ? 'enterprise' : 'server';
+                const tier =
+                  activation.licenseType === "ENTERPRISE"
+                    ? "enterprise"
+                    : "server";
                 const planGroups = licenseService.groupPlansByTier(plans);
-                const planGroup = planGroups.find(pg => pg.tier === tier);
+                const planGroup = planGroups.find((pg) => pg.tier === tier);
 
                 if (planGroup) {
                   // Reopen modal to show success with license key
                   setSelectedPlanGroup(planGroup);
                   setHostedCheckoutSuccess({
                     isUpgrade: false,
-                    licenseKey: result.licenseKey
+                    licenseKey: result.licenseKey,
                   });
                   setIsOpen(true);
                 } else {
                   // Fallback to toast if plan group not found
                   alert({
-                    alertType: 'success',
-                    title: t('payment.licenseActivated'),
+                    alertType: "success",
+                    title: t("payment.licenseActivated"),
                   });
                 }
               } else {
-                console.error('Failed to save license key:', activation.error);
+                console.error("Failed to save license key:", activation.error);
                 alert({
-                  alertType: 'error',
-                  title: t('payment.licenseSaveError'),
+                  alertType: "error",
+                  title: t("payment.licenseSaveError"),
                 });
               }
             } else if (result.timedOut) {
-              console.warn('License key polling timed out');
+              console.warn("License key polling timed out");
               alert({
-                alertType: 'warning',
-                title: t('payment.licenseDelayed'),
+                alertType: "warning",
+                title: t("payment.licenseDelayed"),
               });
             } else {
-              console.error('License key polling failed:', result.error);
+              console.error("License key polling failed:", result.error);
               alert({
-                alertType: 'error',
-                title: t('payment.licensePollingError'),
+                alertType: "error",
+                title: t("payment.licensePollingError"),
               });
             }
           } catch (error) {
-            console.error('Failed to poll for license key:', error);
+            console.error("Failed to poll for license key:", error);
             alert({
-              alertType: 'error',
-              title: t('payment.licenseRetrievalError'),
+              alertType: "error",
+              title: t("payment.licenseRetrievalError"),
             });
           }
         }
-      } else if (paymentStatus === 'canceled') {
-        console.log('Payment canceled by user');
+      } else if (paymentStatus === "canceled") {
+        console.log("Payment canceled by user");
 
         // Clear URL parameters
-        window.history.replaceState({}, '', window.location.pathname);
+        window.history.replaceState({}, "", window.location.pathname);
 
         alert({
-          alertType: 'warning',
-          title: t('payment.paymentCanceled'),
+          alertType: "warning",
+          title: t("payment.paymentCanceled"),
         });
       }
     };
 
     handleCheckoutReturn();
-  }, [t, refetchPlans, refetchLicense, plans, fetchPlansIfNeeded, plansLoaded, currentCurrency]);
+  }, [
+    t,
+    refetchPlans,
+    refetchLicense,
+    plans,
+    fetchPlansIfNeeded,
+    plansLoaded,
+    currentCurrency,
+  ]);
 
   const openCheckout = useCallback(
-    async (tier: 'server' | 'enterprise', options: CheckoutOptions = {}) => {
+    async (tier: "server" | "enterprise", options: CheckoutOptions = {}) => {
       try {
         setIsLoading(true);
 
         // Check if Supabase is configured
         if (!isSupabaseConfigured) {
-          throw new Error('Checkout is not available. Supabase is not configured.');
+          throw new Error(
+            "Checkout is not available. Supabase is not configured.",
+          );
         }
 
         // Update currency if provided
@@ -265,37 +309,44 @@ export const CheckoutProvider: React.FC<CheckoutProviderProps> = ({
         try {
           const [licenseData, userData] = await Promise.all([
             licenseService.getLicenseInfo(),
-            userManagementService.getUsers()
+            userManagementService.getUsers(),
           ]);
 
           licenseInfo = licenseData;
           totalUsers = userData.totalUsers || 0;
         } catch (err) {
-          console.warn('Could not fetch license/user info, proceeding with defaults:', err);
+          console.warn(
+            "Could not fetch license/user info, proceeding with defaults:",
+            err,
+          );
         }
 
         // Calculate minimum seats for enterprise upgrades
         let calculatedMinSeats = options.minimumSeats || 1;
 
-        if (tier === 'enterprise' && !options.minimumSeats) {
+        if (tier === "enterprise" && !options.minimumSeats) {
           const currentTier = mapLicenseToTier(licenseInfo);
 
-          if (currentTier === 'server' || currentTier === 'free') {
+          if (currentTier === "server" || currentTier === "free") {
             // Upgrading from Server (unlimited) to Enterprise (per-seat)
             // Use current total user count as minimum
             calculatedMinSeats = Math.max(totalUsers, 1);
-            console.log(`Setting minimum seats from server user count: ${calculatedMinSeats}`);
-          } else if (currentTier === 'enterprise') {
+            console.log(
+              `Setting minimum seats from server user count: ${calculatedMinSeats}`,
+            );
+          } else if (currentTier === "enterprise") {
             // Upgrading within Enterprise (e.g., monthly to yearly)
             // Use current licensed seat count as minimum
             calculatedMinSeats = Math.max(licenseInfo?.maxUsers || 1, 1);
-            console.log(`Setting minimum seats from current license: ${calculatedMinSeats}`);
+            console.log(
+              `Setting minimum seats from current license: ${calculatedMinSeats}`,
+            );
           }
         }
 
         // Find the plan group for the requested tier
         const planGroups = licenseService.groupPlansByTier(plans);
-        const planGroup = planGroups.find(pg => pg.tier === tier);
+        const planGroup = planGroups.find((pg) => pg.tier === tier);
 
         if (!planGroup) {
           throw new Error(`No ${tier} plan available`);
@@ -306,16 +357,16 @@ export const CheckoutProvider: React.FC<CheckoutProviderProps> = ({
         setMinimumSeats(calculatedMinSeats);
         setSelectedPlanGroup(planGroup);
         setIsOpen(true);
-
       } catch (err) {
-        const errorMessage = err instanceof Error ? err.message : 'Failed to open checkout';
-        console.error('Error opening checkout:', errorMessage);
+        const errorMessage =
+          err instanceof Error ? err.message : "Failed to open checkout";
+        console.error("Error opening checkout:", errorMessage);
         options.onError?.(errorMessage);
       } finally {
         setIsLoading(false);
       }
     },
-    [currentCurrency, plans, plansLoaded, fetchPlansIfNeeded]
+    [currentCurrency, plans, plansLoaded, fetchPlansIfNeeded],
   );
 
   const closeCheckout = useCallback(() => {
@@ -331,30 +382,33 @@ export const CheckoutProvider: React.FC<CheckoutProviderProps> = ({
 
   const handlePaymentSuccess = useCallback(
     (sessionId: string) => {
-      console.log('Payment successful, session:', sessionId);
+      console.log("Payment successful, session:", sessionId);
       currentOptions.onSuccess?.(sessionId);
       // Don't close modal - let user view license key and close manually
     },
-    [currentOptions]
+    [currentOptions],
   );
 
   const handlePaymentError = useCallback(
     (error: string) => {
-      console.error('Payment error:', error);
+      console.error("Payment error:", error);
       currentOptions.onError?.(error);
     },
-    [currentOptions]
+    [currentOptions],
   );
 
-  const handleLicenseActivated = useCallback((licenseInfo: {
-    licenseType: string;
-    enabled: boolean;
-    maxUsers: number;
-    hasKey: boolean;
-  }) => {
-    console.log('License activated:', licenseInfo);
-    // Could expose this via context if needed
-  }, []);
+  const handleLicenseActivated = useCallback(
+    (licenseInfo: {
+      licenseType: string;
+      enabled: boolean;
+      maxUsers: number;
+      hasKey: boolean;
+    }) => {
+      console.log("License activated:", licenseInfo);
+      // Could expose this via context if needed
+    },
+    [],
+  );
 
   const contextValue: CheckoutContextValue = {
     openCheckout,
@@ -387,7 +441,7 @@ export const CheckoutProvider: React.FC<CheckoutProviderProps> = ({
 export const useCheckout = (): CheckoutContextValue => {
   const context = useContext(CheckoutContext);
   if (!context) {
-    throw new Error('useCheckout must be used within CheckoutProvider');
+    throw new Error("useCheckout must be used within CheckoutProvider");
   }
   return context;
 };
diff --git a/frontend/src/proprietary/contexts/LicenseContext.tsx b/frontend/src/proprietary/contexts/LicenseContext.tsx
index 5c0f7947e2..50feea580a 100644
--- a/frontend/src/proprietary/contexts/LicenseContext.tsx
+++ b/frontend/src/proprietary/contexts/LicenseContext.tsx
@@ -1,8 +1,17 @@
-import React, { createContext, useContext, useState, useCallback, useEffect, useMemo, useRef, ReactNode } from 'react';
-import { useLocation } from 'react-router-dom';
-import licenseService, { LicenseInfo } from '@app/services/licenseService';
-import { useAppConfig } from '@app/contexts/AppConfigContext';
-import { getSimulatedLicenseInfo } from '@app/testing/serverExperienceSimulations';
+import React, {
+  createContext,
+  useContext,
+  useState,
+  useCallback,
+  useEffect,
+  useMemo,
+  useRef,
+  ReactNode,
+} from "react";
+import { useLocation } from "react-router-dom";
+import licenseService, { LicenseInfo } from "@app/services/licenseService";
+import { useAppConfig } from "@app/contexts/AppConfigContext";
+import { getSimulatedLicenseInfo } from "@app/testing/serverExperienceSimulations";
 
 interface LicenseContextValue {
   licenseInfo: LicenseInfo | null;
@@ -11,13 +20,17 @@ interface LicenseContextValue {
   refetchLicense: () => Promise<void>;
 }
 
-const LicenseContext = createContext<LicenseContextValue | undefined>(undefined);
+const LicenseContext = createContext<LicenseContextValue | undefined>(
+  undefined,
+);
 
 interface LicenseProviderProps {
   children: ReactNode;
 }
 
-export const LicenseProvider: React.FC<LicenseProviderProps> = ({ children }) => {
+export const LicenseProvider: React.FC<LicenseProviderProps> = ({
+  children,
+}) => {
   const { config } = useAppConfig();
   const location = useLocation();
   const configRef = useRef(config);
@@ -34,17 +47,17 @@ export const LicenseProvider: React.FC<LicenseProviderProps> = ({ children }) =>
     // Wait for config to load if it's not available yet
     let currentConfig = configRef.current;
     if (!currentConfig) {
-      console.log('[LicenseContext] Config not loaded yet, waiting...');
+      console.log("[LicenseContext] Config not loaded yet, waiting...");
       // OPTIMIZATION: Reduced from 5s to 1s - config should load quickly
       const maxWait = 1000;
       const startTime = Date.now();
       while (!configRef.current && Date.now() - startTime < maxWait) {
-        await new Promise(resolve => setTimeout(resolve, 100));
+        await new Promise((resolve) => setTimeout(resolve, 100));
         currentConfig = configRef.current;
       }
 
       if (!currentConfig) {
-        console.error('[LicenseContext] Config failed to load after waiting');
+        console.error("[LicenseContext] Config failed to load after waiting");
         setLoading(false);
         return;
       }
@@ -52,12 +65,14 @@ export const LicenseProvider: React.FC<LicenseProviderProps> = ({ children }) =>
 
     // Only fetch license info if user is an admin
     if (!currentConfig.isAdmin) {
-      console.log('[LicenseContext] User is not an admin, skipping license fetch');
+      console.log(
+        "[LicenseContext] User is not an admin, skipping license fetch",
+      );
       setLoading(false);
       return;
     }
 
-    console.log('[LicenseContext] Fetching license info');
+    console.log("[LicenseContext] Fetching license info");
 
     try {
       const testInfo = getSimulatedLicenseInfo();
@@ -73,8 +88,9 @@ export const LicenseProvider: React.FC<LicenseProviderProps> = ({ children }) =>
       const info = await licenseService.getLicenseInfo();
       setLicenseInfo(info);
     } catch (err) {
-      const errorMessage = err instanceof Error ? err.message : 'Failed to fetch license info';
-      console.error('Error fetching license info:', errorMessage);
+      const errorMessage =
+        err instanceof Error ? err.message : "Failed to fetch license info";
+      console.error("Error fetching license info:", errorMessage);
       setError(errorMessage);
       setLicenseInfo(null);
     } finally {
@@ -88,13 +104,13 @@ export const LicenseProvider: React.FC<LicenseProviderProps> = ({ children }) =>
     // during SAML/OAuth callback processing. License isn't needed until user
     // is authenticated and navigates to main app.
     const isAuthRoute =
-      location.pathname === '/login' ||
-      location.pathname === '/signup' ||
-      location.pathname === '/auth/callback' ||
-      location.pathname.startsWith('/invite/');
+      location.pathname === "/login" ||
+      location.pathname === "/signup" ||
+      location.pathname === "/auth/callback" ||
+      location.pathname.startsWith("/invite/");
 
     if (isAuthRoute) {
-      console.log('[LicenseContext] On auth route, skipping license fetch');
+      console.log("[LicenseContext] On auth route, skipping license fetch");
       setLoading(false);
       return;
     }
@@ -111,7 +127,7 @@ export const LicenseProvider: React.FC<LicenseProviderProps> = ({ children }) =>
       error,
       refetchLicense,
     }),
-    [licenseInfo, loading, error, refetchLicense]
+    [licenseInfo, loading, error, refetchLicense],
   );
 
   return (
@@ -128,7 +144,7 @@ export const useOptionalLicense = (): LicenseContextValue | undefined => {
 export const useLicense = (): LicenseContextValue => {
   const context = useContext(LicenseContext);
   if (!context) {
-    throw new Error('useLicense must be used within LicenseProvider');
+    throw new Error("useLicense must be used within LicenseProvider");
   }
   return context;
 };
diff --git a/frontend/src/proprietary/contexts/ServerExperienceContext.tsx b/frontend/src/proprietary/contexts/ServerExperienceContext.tsx
index edbf900773..863e6f8676 100644
--- a/frontend/src/proprietary/contexts/ServerExperienceContext.tsx
+++ b/frontend/src/proprietary/contexts/ServerExperienceContext.tsx
@@ -6,20 +6,21 @@ import {
   useMemo,
   useState,
   type ReactNode,
-} from 'react';
-import apiClient from '@app/services/apiClient';
-import { useAppConfig } from '@app/contexts/AppConfigContext';
-import { useAuth } from '@app/auth/UseSession';
-import { useLicense } from '@app/contexts/LicenseContext';
+} from "react";
+import apiClient from "@app/services/apiClient";
+import { isAxiosError } from "axios";
+import { useAppConfig } from "@app/contexts/AppConfigContext";
+import { useAuth } from "@app/auth/UseSession";
+import { useLicense } from "@app/contexts/LicenseContext";
 import {
   getSimulatedAdminUsage,
   getSimulatedWauResponse,
-} from '@app/testing/serverExperienceSimulations';
+} from "@app/testing/serverExperienceSimulations";
 
-const SELF_REPORTED_ADMIN_KEY = 'stirling-self-reported-admin';
+const SELF_REPORTED_ADMIN_KEY = "stirling-self-reported-admin";
 const FREE_TIER_LIMIT = 5;
 
-type UserCountSource = 'admin' | 'estimate' | 'unknown';
+type UserCountSource = "admin" | "estimate" | "unknown";
 
 interface WeeklyActiveUsersResponse {
   trackingSince: string;
@@ -38,16 +39,16 @@ interface UserCountState {
 }
 
 export type ServerScenarioKey =
-  | 'unknown'
-  | 'licensed'
-  | 'no-login-user-under-limit-no-license'
-  | 'no-login-admin-under-limit-no-license'
-  | 'no-login-user-over-limit-no-license'
-  | 'no-login-admin-over-limit-no-license'
-  | 'login-user-under-limit-no-license'
-  | 'login-admin-under-limit-no-license'
-  | 'login-user-over-limit-no-license'
-  | 'login-admin-over-limit-no-license';
+  | "unknown"
+  | "licensed"
+  | "no-login-user-under-limit-no-license"
+  | "no-login-admin-under-limit-no-license"
+  | "no-login-user-over-limit-no-license"
+  | "no-login-admin-over-limit-no-license"
+  | "login-user-under-limit-no-license"
+  | "login-admin-under-limit-no-license"
+  | "login-user-over-limit-no-license"
+  | "login-admin-over-limit-no-license";
 
 export interface ServerExperienceValue {
   loginEnabled: boolean;
@@ -78,65 +79,72 @@ export interface ServerExperienceValue {
   scenarioKey: ServerScenarioKey;
 }
 
-const ServerExperienceContext = createContext<ServerExperienceValue | undefined>(undefined);
+const ServerExperienceContext = createContext<
+  ServerExperienceValue | undefined
+>(undefined);
 
 function getStoredSelfReportedAdmin(): boolean {
-  if (typeof window === 'undefined') {
+  if (typeof window === "undefined") {
     return false;
   }
   try {
-    return window.localStorage.getItem(SELF_REPORTED_ADMIN_KEY) === 'true';
+    return window.localStorage.getItem(SELF_REPORTED_ADMIN_KEY) === "true";
   } catch {
     return false;
   }
 }
 
 function getErrorMessage(error: unknown): string {
-  if (typeof error === 'string') {
+  if (typeof error === "string") {
     return error;
   }
   if (
-    typeof error === 'object' &&
-    error !== null &&
-    'response' in error &&
-    typeof (error as any).response?.data?.message === 'string'
+    isAxiosError(error) &&
+    typeof error.response?.data?.message === "string"
   ) {
-    return (error as any).response.data.message;
+    return error.response.data.message;
   }
   if (error instanceof Error) {
     return error.message;
   }
-  return 'Unable to load server usage';
+  return "Unable to load server usage";
 }
 
-export function ServerExperienceProvider({ children }: { children: ReactNode }) {
+export function ServerExperienceProvider({
+  children,
+}: {
+  children: ReactNode;
+}) {
   const { config } = useAppConfig();
   const { user } = useAuth();
   const { licenseInfo, loading: licenseLoading } = useLicense();
 
-  const [selfReportedAdmin, setSelfReportedAdminState] = useState<boolean>(getStoredSelfReportedAdmin);
+  const [selfReportedAdmin, setSelfReportedAdminState] = useState<boolean>(
+    getStoredSelfReportedAdmin,
+  );
   const [userCountState, setUserCountState] = useState<UserCountState>({
     totalUsers: null,
     weeklyActiveUsers: null,
     loading: false,
-    source: 'unknown',
+    source: "unknown",
     lastUpdated: null,
     error: null,
   });
 
   const loginEnabled = config?.enableLogin !== false;
   const configIsAdmin = Boolean(config?.isAdmin);
-  const effectiveIsAdmin = configIsAdmin || (!loginEnabled && selfReportedAdmin);
+  const effectiveIsAdmin =
+    configIsAdmin || (!loginEnabled && selfReportedAdmin);
   const isAuthenticated = Boolean(user);
 
   const setSelfReportedAdmin = useCallback((value: boolean) => {
     setSelfReportedAdminState(value);
-    if (typeof window === 'undefined') {
+    if (typeof window === "undefined") {
       return;
     }
     try {
       if (value) {
-        window.localStorage.setItem(SELF_REPORTED_ADMIN_KEY, 'true');
+        window.localStorage.setItem(SELF_REPORTED_ADMIN_KEY, "true");
       } else {
         window.localStorage.removeItem(SELF_REPORTED_ADMIN_KEY);
       }
@@ -146,16 +154,16 @@ export function ServerExperienceProvider({ children }: { children: ReactNode })
   }, []);
 
   useEffect(() => {
-    if (typeof window === 'undefined') {
+    if (typeof window === "undefined") {
       return;
     }
     const handleStorage = (event: StorageEvent) => {
       if (event.key === SELF_REPORTED_ADMIN_KEY) {
-        setSelfReportedAdminState(event.newValue === 'true');
+        setSelfReportedAdminState(event.newValue === "true");
       }
     };
-    window.addEventListener('storage', handleStorage);
-    return () => window.removeEventListener('storage', handleStorage);
+    window.addEventListener("storage", handleStorage);
+    return () => window.removeEventListener("storage", handleStorage);
   }, []);
 
   useEffect(() => {
@@ -195,17 +203,21 @@ export function ServerExperienceProvider({ children }: { children: ReactNode })
           testResponse ??
           (
             await apiClient.get<{ totalUsers?: number }>(
-              '/api/v1/proprietary/ui-data/admin-settings',
-              { suppressErrorToast: true } as any,
+              "/api/v1/proprietary/ui-data/admin-settings",
+              {
+                suppressErrorToast: true,
+              },
             )
           ).data;
         const totalUsers =
-          typeof responseData?.totalUsers === 'number' ? responseData.totalUsers : null;
+          typeof responseData?.totalUsers === "number"
+            ? responseData.totalUsers
+            : null;
         setUserCountState({
           totalUsers,
           weeklyActiveUsers: null,
           loading: false,
-          source: 'admin',
+          source: "admin",
           lastUpdated: Date.now(),
           error: null,
         });
@@ -217,19 +229,19 @@ export function ServerExperienceProvider({ children }: { children: ReactNode })
         const responseData =
           testResponse ??
           (
-            await apiClient.get<WeeklyActiveUsersResponse>('/api/v1/info/wau', {
+            await apiClient.get<WeeklyActiveUsersResponse>("/api/v1/info/wau", {
               suppressErrorToast: true,
-            } as any)
+            })
           ).data;
         const weeklyActiveUsers =
-          typeof responseData?.weeklyActiveUsers === 'number'
+          typeof responseData?.weeklyActiveUsers === "number"
             ? responseData.weeklyActiveUsers
             : null;
         setUserCountState({
           totalUsers: weeklyActiveUsers,
           weeklyActiveUsers,
           loading: false,
-          source: 'estimate',
+          source: "estimate",
           lastUpdated: Date.now(),
           error: null,
         });
@@ -239,7 +251,7 @@ export function ServerExperienceProvider({ children }: { children: ReactNode })
         totalUsers: null,
         weeklyActiveUsers: null,
         loading: false,
-        source: 'unknown',
+        source: "unknown",
         lastUpdated: null,
         error: getErrorMessage(error),
       });
@@ -255,7 +267,11 @@ export function ServerExperienceProvider({ children }: { children: ReactNode })
   }, [fetchUserCounts]);
 
   const hasPaidLicense = useMemo(() => {
-    return config?.license === 'SERVER' || config?.license === 'PRO' || config?.license === 'ENTERPRISE';
+    return (
+      config?.license === "SERVER" ||
+      config?.license === "PRO" ||
+      config?.license === "ENTERPRISE"
+    );
   }, [config?.license]);
 
   const licenseKeyValid = useMemo(() => {
@@ -269,44 +285,46 @@ export function ServerExperienceProvider({ children }: { children: ReactNode })
   }, [config?.premiumEnabled, licenseInfo]);
 
   const overFreeTierLimit = useMemo(() => {
-    if (typeof userCountState.totalUsers !== 'number') {
+    if (typeof userCountState.totalUsers !== "number") {
       return null;
     }
     return userCountState.totalUsers > FREE_TIER_LIMIT;
   }, [userCountState.totalUsers]);
 
   const userCountResolved =
-    !userCountState.loading && userCountState.source !== 'unknown' && userCountState.totalUsers !== null;
+    !userCountState.loading &&
+    userCountState.source !== "unknown" &&
+    userCountState.totalUsers !== null;
 
   const scenarioKey = useMemo<ServerScenarioKey>(() => {
     if (hasPaidLicense) {
-      return 'licensed';
+      return "licensed";
     }
-    if (!userCountResolved || typeof userCountState.totalUsers !== 'number') {
-      return 'unknown';
+    if (!userCountResolved || typeof userCountState.totalUsers !== "number") {
+      return "unknown";
     }
     const overLimit = userCountState.totalUsers > FREE_TIER_LIMIT;
 
     if (!loginEnabled) {
       if (selfReportedAdmin) {
         return overLimit
-          ? 'no-login-admin-over-limit-no-license'
-          : 'no-login-admin-under-limit-no-license';
+          ? "no-login-admin-over-limit-no-license"
+          : "no-login-admin-under-limit-no-license";
       }
       return overLimit
-        ? 'no-login-user-over-limit-no-license'
-        : 'no-login-user-under-limit-no-license';
+        ? "no-login-user-over-limit-no-license"
+        : "no-login-user-under-limit-no-license";
     }
 
     if (configIsAdmin) {
       return overLimit
-        ? 'login-admin-over-limit-no-license'
-        : 'login-admin-under-limit-no-license';
+        ? "login-admin-over-limit-no-license"
+        : "login-admin-under-limit-no-license";
     }
 
     return overLimit
-      ? 'login-user-over-limit-no-license'
-      : 'login-user-under-limit-no-license';
+      ? "login-user-over-limit-no-license"
+      : "login-user-under-limit-no-license";
   }, [
     hasPaidLicense,
     userCountResolved,
@@ -355,7 +373,9 @@ export function ServerExperienceProvider({ children }: { children: ReactNode })
 export function useServerExperienceContext() {
   const context = useContext(ServerExperienceContext);
   if (!context) {
-    throw new Error('useServerExperience must be used within ServerExperienceProvider');
+    throw new Error(
+      "useServerExperience must be used within ServerExperienceProvider",
+    );
   }
   return context;
 }
diff --git a/frontend/src/proprietary/contexts/UpdateSeatsContext.tsx b/frontend/src/proprietary/contexts/UpdateSeatsContext.tsx
index fdc3f4ca76..14b229336a 100644
--- a/frontend/src/proprietary/contexts/UpdateSeatsContext.tsx
+++ b/frontend/src/proprietary/contexts/UpdateSeatsContext.tsx
@@ -1,12 +1,19 @@
-import React, { createContext, useContext, useState, useCallback, useEffect, ReactNode } from 'react';
-import { useLocation } from 'react-router-dom';
-import { useTranslation } from 'react-i18next';
-import licenseService, {} from '@app/services/licenseService';
-import UpdateSeatsModal from '@app/components/shared/UpdateSeatsModal';
-import { userManagementService } from '@app/services/userManagementService';
-import { alert } from '@app/components/toast';
-import { useOptionalLicense } from '@app/contexts/LicenseContext';
-import { resyncExistingLicense } from '@app/utils/licenseCheckoutUtils';
+import React, {
+  createContext,
+  useContext,
+  useState,
+  useCallback,
+  useEffect,
+  ReactNode,
+} from "react";
+import { useLocation } from "react-router-dom";
+import { useTranslation } from "react-i18next";
+import licenseService from "@app/services/licenseService";
+import UpdateSeatsModal from "@app/components/shared/UpdateSeatsModal";
+import { userManagementService } from "@app/services/userManagementService";
+import { alert } from "@app/components/toast";
+import { useOptionalLicense } from "@app/contexts/LicenseContext";
+import { resyncExistingLicense } from "@app/utils/licenseCheckoutUtils";
 
 export interface UpdateSeatsOptions {
   onSuccess?: () => void;
@@ -20,13 +27,17 @@ interface UpdateSeatsContextValue {
   isLoading: boolean;
 }
 
-const UpdateSeatsContext = createContext<UpdateSeatsContextValue | undefined>(undefined);
+const UpdateSeatsContext = createContext<UpdateSeatsContextValue | undefined>(
+  undefined,
+);
 
 interface UpdateSeatsProviderProps {
   children: ReactNode;
 }
 
-export const UpdateSeatsProvider: React.FC<UpdateSeatsProviderProps> = ({ children }) => {
+export const UpdateSeatsProvider: React.FC<UpdateSeatsProviderProps> = ({
+  children,
+}) => {
   const { t } = useTranslation();
   const location = useLocation();
   // Use optional hook - won't throw during setup wizard when license provider isn't needed
@@ -43,36 +54,38 @@ export const UpdateSeatsProvider: React.FC<UpdateSeatsProviderProps> = ({ childr
     // during SAML/OAuth callback. This check only matters after successful billing
     // portal redirects, which never happen on auth routes.
     const isAuthRoute =
-      location.pathname === '/login' ||
-      location.pathname === '/signup' ||
-      location.pathname === '/auth/callback' ||
-      location.pathname.startsWith('/invite/');
+      location.pathname === "/login" ||
+      location.pathname === "/signup" ||
+      location.pathname === "/auth/callback" ||
+      location.pathname.startsWith("/invite/");
 
     if (isAuthRoute) {
-      console.log('[UpdateSeatsContext] On auth route, skipping billing return check');
+      console.log(
+        "[UpdateSeatsContext] On auth route, skipping billing return check",
+      );
       return;
     }
 
     const handleBillingReturn = async () => {
       const urlParams = new URLSearchParams(window.location.search);
-      const seatsUpdated = urlParams.get('seats_updated');
+      const seatsUpdated = urlParams.get("seats_updated");
 
-      if (seatsUpdated === 'true') {
-        console.log('Seats updated successfully, syncing license with Keygen');
+      if (seatsUpdated === "true") {
+        console.log("Seats updated successfully, syncing license with Keygen");
 
         // Clear URL parameters
-        window.history.replaceState({}, '', window.location.pathname);
+        window.history.replaceState({}, "", window.location.pathname);
 
         try {
           // Wait a moment for Stripe webhook to process
-          await new Promise(resolve => setTimeout(resolve, 2000));
+          await new Promise((resolve) => setTimeout(resolve, 2000));
 
           // Resync license with Keygen (not just local fetch)
-          console.log('Seat update detected - resyncing license with Keygen');
+          console.log("Seat update detected - resyncing license with Keygen");
           const activation = await resyncExistingLicense();
 
           if (activation.success) {
-            console.log('License synced successfully after seat update');
+            console.log("License synced successfully after seat update");
 
             // Refresh global license context
             await license?.refetchLicense();
@@ -81,25 +94,27 @@ export const UpdateSeatsProvider: React.FC<UpdateSeatsProviderProps> = ({ childr
             const updatedLicense = await licenseService.getLicenseInfo();
 
             alert({
-              alertType: 'success',
-              title: t('billing.seatsUpdated', 'Seats Updated'),
+              alertType: "success",
+              title: t("billing.seatsUpdated", "Seats Updated"),
               body: t(
-                'billing.seatsUpdatedMessage',
-                'Your enterprise seats have been updated to {{seats}}',
-                { seats: updatedLicense.maxUsers }
+                "billing.seatsUpdatedMessage",
+                "Your enterprise seats have been updated to {{seats}}",
+                {
+                  seats: updatedLicense.maxUsers,
+                },
               ),
             });
           } else {
-            throw new Error(activation.error || 'Failed to sync license');
+            throw new Error(activation.error || "Failed to sync license");
           }
         } catch (error) {
-          console.error('Failed to sync license after seat update:', error);
+          console.error("Failed to sync license after seat update:", error);
           alert({
-            alertType: 'warning',
-            title: t('billing.updateProcessing', 'Update Processing'),
+            alertType: "warning",
+            title: t("billing.updateProcessing", "Update Processing"),
             body: t(
-              'billing.updateProcessingMessage',
-              'Your seat update is being processed. Please refresh in a few moments.'
+              "billing.updateProcessingMessage",
+              "Your seat update is being processed. Please refresh in a few moments.",
             ),
           });
         }
@@ -108,56 +123,65 @@ export const UpdateSeatsProvider: React.FC<UpdateSeatsProviderProps> = ({ childr
 
     // CRITICAL FIX: Properly handle async function and catch errors
     handleBillingReturn().catch((error) => {
-      console.error('[UpdateSeatsContext] Error in billing return handler:', error);
+      console.error(
+        "[UpdateSeatsContext] Error in billing return handler:",
+        error,
+      );
       // Don't throw - this is initialization, should not block rendering
     });
   }, [t, location.pathname, license]);
 
-  const openUpdateSeats = useCallback(async (options: UpdateSeatsOptions = {}) => {
-    try {
-      setIsLoading(true);
+  const openUpdateSeats = useCallback(
+    async (options: UpdateSeatsOptions = {}) => {
+      try {
+        setIsLoading(true);
 
-      // Fetch current license info and user count
-      const [licenseInfo, userData] = await Promise.all([
-        licenseService.getLicenseInfo(),
-        userManagementService.getUsers(),
-      ]);
+        // Fetch current license info and user count
+        const [licenseInfo, userData] = await Promise.all([
+          licenseService.getLicenseInfo(),
+          userManagementService.getUsers(),
+        ]);
 
-      // Validate this is an enterprise license
-      if (!licenseInfo || licenseInfo.licenseType !== 'ENTERPRISE') {
-        throw new Error(
-          t('billing.notEnterprise', 'Seat management is only available for enterprise licenses')
+        // Validate this is an enterprise license
+        if (!licenseInfo || licenseInfo.licenseType !== "ENTERPRISE") {
+          throw new Error(
+            t(
+              "billing.notEnterprise",
+              "Seat management is only available for enterprise licenses",
+            ),
+          );
+        }
+
+        const currentLicenseSeats = licenseInfo.maxUsers || 1;
+        const currentUserCount = userData.totalUsers || 0;
+
+        // Minimum seats must be at least the current number of users
+        const calculatedMinSeats = Math.max(currentUserCount, 1);
+
+        console.log(
+          `Opening seat update: current seats=${currentLicenseSeats}, current users=${currentUserCount}, minimum=${calculatedMinSeats}`,
         );
+
+        setCurrentSeats(currentLicenseSeats);
+        setMinimumSeats(calculatedMinSeats);
+        setCurrentOptions(options);
+        setIsOpen(true);
+      } catch (err) {
+        const errorMessage =
+          err instanceof Error ? err.message : "Failed to open seat update";
+        console.error("Error opening seat update:", errorMessage);
+        alert({
+          alertType: "error",
+          title: t("common.error", "Error"),
+          body: errorMessage,
+        });
+        options.onError?.(errorMessage);
+      } finally {
+        setIsLoading(false);
       }
-
-      const currentLicenseSeats = licenseInfo.maxUsers || 1;
-      const currentUserCount = userData.totalUsers || 0;
-
-      // Minimum seats must be at least the current number of users
-      const calculatedMinSeats = Math.max(currentUserCount, 1);
-
-      console.log(
-        `Opening seat update: current seats=${currentLicenseSeats}, current users=${currentUserCount}, minimum=${calculatedMinSeats}`
-      );
-
-      setCurrentSeats(currentLicenseSeats);
-      setMinimumSeats(calculatedMinSeats);
-      setCurrentOptions(options);
-      setIsOpen(true);
-    } catch (err) {
-      const errorMessage =
-        err instanceof Error ? err.message : 'Failed to open seat update';
-      console.error('Error opening seat update:', errorMessage);
-      alert({
-        alertType: 'error',
-        title: t('common.error', 'Error'),
-        body: errorMessage,
-      });
-      options.onError?.(errorMessage);
-    } finally {
-      setIsLoading(false);
-    }
-  }, [t]);
+    },
+    [t],
+  );
 
   const closeUpdateSeats = useCallback(() => {
     setIsOpen(false);
@@ -173,7 +197,7 @@ export const UpdateSeatsProvider: React.FC<UpdateSeatsProviderProps> = ({ childr
         // Get current license key
         const licenseInfo = await licenseService.getLicenseInfo();
         if (!licenseInfo?.licenseKey) {
-          throw new Error('No license key found');
+          throw new Error("No license key found");
         }
 
         console.log(`Updating seats from ${currentSeats} to ${newSeatCount}`);
@@ -181,32 +205,32 @@ export const UpdateSeatsProvider: React.FC<UpdateSeatsProviderProps> = ({ childr
         // Call manage-billing function with new seat count
         const portalUrl = await licenseService.updateEnterpriseSeats(
           newSeatCount,
-          licenseInfo.licenseKey
+          licenseInfo.licenseKey,
         );
 
         return portalUrl;
       } catch (err) {
         const errorMessage =
-          err instanceof Error ? err.message : 'Failed to update seats';
-        console.error('Error updating seats:', errorMessage);
+          err instanceof Error ? err.message : "Failed to update seats";
+        console.error("Error updating seats:", errorMessage);
         currentOptions.onError?.(errorMessage);
         throw err;
       }
     },
-    [currentSeats, currentOptions]
+    [currentSeats, currentOptions],
   );
 
   const handleSuccess = useCallback(() => {
-    console.log('Seat update initiated successfully');
+    console.log("Seat update initiated successfully");
     currentOptions.onSuccess?.();
   }, [currentOptions]);
 
   const handleError = useCallback(
     (error: string) => {
-      console.error('Seat update error:', error);
+      console.error("Seat update error:", error);
       currentOptions.onError?.(error);
     },
-    [currentOptions]
+    [currentOptions],
   );
 
   return (
@@ -235,7 +259,9 @@ export const UpdateSeatsProvider: React.FC<UpdateSeatsProviderProps> = ({ childr
 export const useUpdateSeats = (): UpdateSeatsContextValue => {
   const context = useContext(UpdateSeatsContext);
   if (!context) {
-    throw new Error('useUpdateSeats must be used within an UpdateSeatsProvider');
+    throw new Error(
+      "useUpdateSeats must be used within an UpdateSeatsProvider",
+    );
   }
   return context;
 };
diff --git a/frontend/src/proprietary/extensions/accountLogout.ts b/frontend/src/proprietary/extensions/accountLogout.ts
index 237f609b5a..6ae83b8e26 100644
--- a/frontend/src/proprietary/extensions/accountLogout.ts
+++ b/frontend/src/proprietary/extensions/accountLogout.ts
@@ -10,10 +10,16 @@ interface AccountLogoutDeps {
  * Desktop builds override this file via path resolution.
  */
 export function useAccountLogout() {
-  return async ({ signOut, redirectToLogin }: AccountLogoutDeps): Promise<void> => {
+  return async ({
+    signOut,
+    redirectToLogin,
+  }: AccountLogoutDeps): Promise<void> => {
     try {
-      if (typeof window !== 'undefined') {
-        window.sessionStorage.setItem('stirling_sso_auto_login_logged_out', '1');
+      if (typeof window !== "undefined") {
+        window.sessionStorage.setItem(
+          "stirling_sso_auto_login_logged_out",
+          "1",
+        );
       }
       await signOut();
     } finally {
diff --git a/frontend/src/proprietary/extensions/oauthNavigation.ts b/frontend/src/proprietary/extensions/oauthNavigation.ts
index 65dc612f29..df1e83e82b 100644
--- a/frontend/src/proprietary/extensions/oauthNavigation.ts
+++ b/frontend/src/proprietary/extensions/oauthNavigation.ts
@@ -2,6 +2,8 @@
  * Extension hook for platform-specific OAuth navigation.
  * Proprietary/web builds default to in-window navigation.
  */
-export async function startOAuthNavigation(_redirectUrl: string): Promise<boolean> {
+export async function startOAuthNavigation(
+  _redirectUrl: string,
+): Promise<boolean> {
   return false;
 }
diff --git a/frontend/src/proprietary/hooks/usePlans.ts b/frontend/src/proprietary/hooks/usePlans.ts
index 33cb198dee..8a9d0c13f2 100644
--- a/frontend/src/proprietary/hooks/usePlans.ts
+++ b/frontend/src/proprietary/hooks/usePlans.ts
@@ -1,8 +1,8 @@
-import { useState, useEffect } from 'react';
+import { useState, useEffect } from "react";
 import licenseService, {
   PlanTier,
   PlansResponse,
-} from '@app/services/licenseService';
+} from "@app/services/licenseService";
 
 export interface UsePlansReturn {
   plans: PlanTier[];
@@ -11,7 +11,7 @@ export interface UsePlansReturn {
   refetch: () => Promise<void>;
 }
 
-export const usePlans = (currency: string = 'gbp'): UsePlansReturn => {
+export const usePlans = (currency: string = "gbp"): UsePlansReturn => {
   const [plans, setPlans] = useState<PlanTier[]>([]);
   const [loading, setLoading] = useState(true);
   const [error, setError] = useState<string | null>(null);
@@ -24,8 +24,8 @@ export const usePlans = (currency: string = 'gbp'): UsePlansReturn => {
       const data: PlansResponse = await licenseService.getPlans(currency);
       setPlans(data.plans);
     } catch (err) {
-      console.error('Error fetching plans:', err);
-      setError(err instanceof Error ? err.message : 'Failed to fetch plans');
+      console.error("Error fetching plans:", err);
+      setError(err instanceof Error ? err.message : "Failed to fetch plans");
     } finally {
       setLoading(false);
     }
diff --git a/frontend/src/proprietary/hooks/useRequestHeaders.ts b/frontend/src/proprietary/hooks/useRequestHeaders.ts
index 79795a9206..6c6bd6543b 100644
--- a/frontend/src/proprietary/hooks/useRequestHeaders.ts
+++ b/frontend/src/proprietary/hooks/useRequestHeaders.ts
@@ -1,4 +1,4 @@
 export function useRequestHeaders(): HeadersInit {
-  const token = localStorage.getItem('stirling_jwt');
-  return token ? { 'Authorization': `Bearer ${token}` } : {};
+  const token = localStorage.getItem("stirling_jwt");
+  return token ? { Authorization: `Bearer ${token}` } : {};
 }
diff --git a/frontend/src/proprietary/hooks/useServerExperience.ts b/frontend/src/proprietary/hooks/useServerExperience.ts
index 6a9862275e..be2c4b77c6 100644
--- a/frontend/src/proprietary/hooks/useServerExperience.ts
+++ b/frontend/src/proprietary/hooks/useServerExperience.ts
@@ -1,6 +1,5 @@
-import { useServerExperienceContext } from '@app/contexts/ServerExperienceContext';
+import { useServerExperienceContext } from "@app/contexts/ServerExperienceContext";
 
 export function useServerExperience() {
   return useServerExperienceContext();
 }
-
diff --git a/frontend/src/proprietary/hooks/useShouldShowWelcomeModal.ts b/frontend/src/proprietary/hooks/useShouldShowWelcomeModal.ts
index da03a72158..9b0de5e446 100644
--- a/frontend/src/proprietary/hooks/useShouldShowWelcomeModal.ts
+++ b/frontend/src/proprietary/hooks/useShouldShowWelcomeModal.ts
@@ -1,6 +1,6 @@
-import { usePreferences } from '@app/contexts/PreferencesContext';
-import { useAuth } from '@app/auth/UseSession';
-import { useIsMobile } from '@app/hooks/useIsMobile';
+import { usePreferences } from "@app/contexts/PreferencesContext";
+import { useAuth } from "@app/auth/UseSession";
+import { useIsMobile } from "@app/hooks/useIsMobile";
 
 export function useShouldShowWelcomeModal(): boolean {
   const { preferences } = usePreferences();
@@ -9,9 +9,11 @@ export function useShouldShowWelcomeModal(): boolean {
 
   // Only show welcome modal if user is authenticated (session exists)
   // This prevents the modal from showing on login screens when security is enabled
-  return !loading
-    && !preferences.hasCompletedOnboarding
-    && preferences.toolPanelModePromptSeen
-    && !isMobile
-    && !!session;
+  return (
+    !loading &&
+    !preferences.hasCompletedOnboarding &&
+    preferences.toolPanelModePromptSeen &&
+    !isMobile &&
+    !!session
+  );
 }
diff --git a/frontend/src/proprietary/hooks/workflow/useParticipantSession.ts b/frontend/src/proprietary/hooks/workflow/useParticipantSession.ts
index e150fc2332..3a0cf38a2a 100644
--- a/frontend/src/proprietary/hooks/workflow/useParticipantSession.ts
+++ b/frontend/src/proprietary/hooks/workflow/useParticipantSession.ts
@@ -1,9 +1,10 @@
-import { useState, useCallback, useEffect } from 'react';
+import { useState, useCallback, useEffect } from "react";
+import { isAxiosError } from "axios";
 import workflowService, {
   WorkflowSessionResponse,
   ParticipantResponse,
   SignatureSubmissionRequest,
-} from '@app/services/workflowService';
+} from "@app/services/workflowService";
 
 export interface UseParticipantSessionResult {
   session: WorkflowSessionResponse | null;
@@ -19,9 +20,13 @@ export interface UseParticipantSessionResult {
 /**
  * Hook for managing workflow session from participant perspective
  */
-export const useParticipantSession = (token?: string): UseParticipantSessionResult => {
+export const useParticipantSession = (
+  token?: string,
+): UseParticipantSessionResult => {
   const [session, setSession] = useState<WorkflowSessionResponse | null>(null);
-  const [participant, setParticipant] = useState<ParticipantResponse | null>(null);
+  const [participant, setParticipant] = useState<ParticipantResponse | null>(
+    null,
+  );
   const [loading, setLoading] = useState(false);
   const [error, setError] = useState<string | null>(null);
 
@@ -35,9 +40,11 @@ export const useParticipantSession = (token?: string): UseParticipantSessionResu
       ]);
       setSession(sessionData);
       setParticipant(participantData);
-    } catch (err: any) {
-      const errorMsg =
-        err.response?.data?.message || err.message || 'Failed to load session';
+    } catch (err: unknown) {
+      const errorMsg = isAxiosError(err)
+        ? err.response?.data?.message || err.message
+        : (err instanceof Error ? err.message : undefined) ||
+          "Failed to load session";
       setError(errorMsg);
     } finally {
       setLoading(false);
@@ -49,22 +56,25 @@ export const useParticipantSession = (token?: string): UseParticipantSessionResu
       setLoading(true);
       setError(null);
       try {
-        const updatedParticipant = await workflowService.submitSignature(request);
+        const updatedParticipant =
+          await workflowService.submitSignature(request);
         setParticipant(updatedParticipant);
         // Reload session to get updated status
         if (request.participantToken) {
           await loadSession(request.participantToken);
         }
-      } catch (err: any) {
-        const errorMsg =
-          err.response?.data?.message || err.message || 'Failed to submit signature';
+      } catch (err: unknown) {
+        const errorMsg = isAxiosError(err)
+          ? err.response?.data?.message || err.message
+          : (err instanceof Error ? err.message : undefined) ||
+            "Failed to submit signature";
         setError(errorMsg);
         throw new Error(errorMsg, { cause: err });
       } finally {
         setLoading(false);
       }
     },
-    [loadSession]
+    [loadSession],
   );
 
   const decline = useCallback(
@@ -74,44 +84,51 @@ export const useParticipantSession = (token?: string): UseParticipantSessionResu
       try {
         const updatedParticipant = await workflowService.declineParticipation(
           token,
-          reason
+          reason,
         );
         setParticipant(updatedParticipant);
         // Reload session
         await loadSession(token);
-      } catch (err: any) {
-        const errorMsg =
-          err.response?.data?.message || err.message || 'Failed to decline';
+      } catch (err: unknown) {
+        const errorMsg = isAxiosError(err)
+          ? err.response?.data?.message || err.message
+          : (err instanceof Error ? err.message : undefined) ||
+            "Failed to decline";
         setError(errorMsg);
         throw new Error(errorMsg, { cause: err });
       } finally {
         setLoading(false);
       }
     },
-    [loadSession]
+    [loadSession],
   );
 
-  const downloadDocument = useCallback(async (token: string) => {
-    setLoading(true);
-    setError(null);
-    try {
-      const pdfBlob = await workflowService.getParticipantDocument(token);
-      const url = window.URL.createObjectURL(pdfBlob);
-      const a = document.createElement('a');
-      a.href = url;
-      a.download = session?.documentName || 'document.pdf';
-      document.body.appendChild(a);
-      a.click();
-      window.URL.revokeObjectURL(url);
-      document.body.removeChild(a);
-    } catch (err: any) {
-      const errorMsg =
-        err.response?.data?.message || err.message || 'Failed to download document';
-      setError(errorMsg);
-    } finally {
-      setLoading(false);
-    }
-  }, [session]);
+  const downloadDocument = useCallback(
+    async (token: string) => {
+      setLoading(true);
+      setError(null);
+      try {
+        const pdfBlob = await workflowService.getParticipantDocument(token);
+        const url = window.URL.createObjectURL(pdfBlob);
+        const a = document.createElement("a");
+        a.href = url;
+        a.download = session?.documentName || "document.pdf";
+        document.body.appendChild(a);
+        a.click();
+        window.URL.revokeObjectURL(url);
+        document.body.removeChild(a);
+      } catch (err: unknown) {
+        const errorMsg = isAxiosError(err)
+          ? err.response?.data?.message || err.message
+          : (err instanceof Error ? err.message : undefined) ||
+            "Failed to download document";
+        setError(errorMsg);
+      } finally {
+        setLoading(false);
+      }
+    },
+    [session],
+  );
 
   // Auto-load session if token is provided
   useEffect(() => {
diff --git a/frontend/src/proprietary/routes/AuthCallback.module.css b/frontend/src/proprietary/routes/AuthCallback.module.css
index 71d2e5d6d3..f3bc4e7ecf 100644
--- a/frontend/src/proprietary/routes/AuthCallback.module.css
+++ b/frontend/src/proprietary/routes/AuthCallback.module.css
@@ -5,7 +5,9 @@
   justify-content: center;
   padding: 50px 20px;
   background: #f5f5f5;
-  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
+  font-family:
+    -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue",
+    Arial, sans-serif;
 }
 
 .card {
diff --git a/frontend/src/proprietary/routes/AuthCallback.test.tsx b/frontend/src/proprietary/routes/AuthCallback.test.tsx
index ef540d36b0..d0797374d8 100644
--- a/frontend/src/proprietary/routes/AuthCallback.test.tsx
+++ b/frontend/src/proprietary/routes/AuthCallback.test.tsx
@@ -1,11 +1,11 @@
-import { describe, it, expect, beforeEach, vi } from 'vitest';
-import { render, waitFor } from '@testing-library/react';
-import { BrowserRouter } from 'react-router-dom';
-import AuthCallback from '@app/routes/AuthCallback';
-import { springAuth } from '@app/auth/springAuthClient';
+import { describe, it, expect, beforeEach, vi } from "vitest";
+import { render, waitFor } from "@testing-library/react";
+import { BrowserRouter } from "react-router-dom";
+import AuthCallback from "@app/routes/AuthCallback";
+import { springAuth } from "@app/auth/springAuthClient";
 
 // Mock springAuth
-vi.mock('@app/auth/springAuthClient', () => ({
+vi.mock("@app/auth/springAuthClient", () => ({
   springAuth: {
     getSession: vi.fn(),
   },
@@ -13,29 +13,29 @@ vi.mock('@app/auth/springAuthClient', () => ({
 
 // Mock useNavigate
 const mockNavigate = vi.fn();
-vi.mock('react-router-dom', async () => {
-  const actual = await vi.importActual('react-router-dom');
+vi.mock("react-router-dom", async () => {
+  const actual = await vi.importActual("react-router-dom");
   return {
     ...actual,
     useNavigate: () => mockNavigate,
   };
 });
 
-describe('AuthCallback', () => {
+describe("AuthCallback", () => {
   beforeEach(() => {
     localStorage.clear();
     vi.clearAllMocks();
     // Reset window.location.hash
-    window.location.hash = '';
+    window.location.hash = "";
   });
 
-  it('should extract JWT from URL hash and validate it', async () => {
-    const mockToken = 'oauth-jwt-token';
+  it("should extract JWT from URL hash and validate it", async () => {
+    const mockToken = "oauth-jwt-token";
     const mockUser = {
-      id: '123',
-      email: 'oauth@example.com',
-      username: 'oauthuser',
-      role: 'USER',
+      id: "123",
+      email: "oauth@example.com",
+      username: "oauthuser",
+      role: "USER",
     };
 
     // Set URL hash with access token
@@ -54,103 +54,103 @@ describe('AuthCallback', () => {
       error: null,
     });
 
-    const dispatchEventSpy = vi.spyOn(window, 'dispatchEvent');
+    const dispatchEventSpy = vi.spyOn(window, "dispatchEvent");
 
     render(
       <BrowserRouter>
         <AuthCallback />
-      </BrowserRouter>
+      </BrowserRouter>,
     );
 
     await waitFor(() => {
       // Verify JWT was stored
-      expect(localStorage.getItem('stirling_jwt')).toBe(mockToken);
+      expect(localStorage.getItem("stirling_jwt")).toBe(mockToken);
 
       // Verify jwt-available event was dispatched
       expect(dispatchEventSpy).toHaveBeenCalledWith(
-        expect.objectContaining({ type: 'jwt-available' })
+        expect.objectContaining({ type: "jwt-available" }),
       );
 
       // Verify getSession was called to validate token
       expect(springAuth.getSession).toHaveBeenCalled();
 
       // Verify navigation to home
-      expect(mockNavigate).toHaveBeenCalledWith('/', { replace: true });
+      expect(mockNavigate).toHaveBeenCalledWith("/", { replace: true });
     });
   });
 
-  it('should redirect to login when no access token in hash', async () => {
+  it("should redirect to login when no access token in hash", async () => {
     // No hash or empty hash
-    window.location.hash = '';
+    window.location.hash = "";
 
     render(
       <BrowserRouter>
         <AuthCallback />
-      </BrowserRouter>
+      </BrowserRouter>,
     );
 
     await waitFor(() => {
-      expect(mockNavigate).toHaveBeenCalledWith('/login', {
+      expect(mockNavigate).toHaveBeenCalledWith("/login", {
         replace: true,
-        state: { error: 'OAuth login failed - no token received.' },
+        state: { error: "OAuth login failed - no token received." },
       });
-      expect(localStorage.getItem('stirling_jwt')).toBeNull();
+      expect(localStorage.getItem("stirling_jwt")).toBeNull();
     });
   });
 
-  it('should redirect to login when token validation fails', async () => {
-    const invalidToken = 'invalid-oauth-token';
+  it("should redirect to login when token validation fails", async () => {
+    const invalidToken = "invalid-oauth-token";
     window.location.hash = `#access_token=${invalidToken}`;
 
     // Mock failed session validation
     vi.mocked(springAuth.getSession).mockResolvedValueOnce({
       data: { session: null },
-      error: { message: 'Invalid token' },
+      error: { message: "Invalid token" },
     });
 
     render(
       <BrowserRouter>
         <AuthCallback />
-      </BrowserRouter>
+      </BrowserRouter>,
     );
 
     await waitFor(() => {
       // JWT should be stored initially
-      expect(localStorage.getItem('stirling_jwt')).toBeNull(); // Cleared after validation failure
+      expect(localStorage.getItem("stirling_jwt")).toBeNull(); // Cleared after validation failure
 
       // Verify redirect to login
-      expect(mockNavigate).toHaveBeenCalledWith('/login', {
+      expect(mockNavigate).toHaveBeenCalledWith("/login", {
         replace: true,
-        state: { error: 'OAuth login failed - invalid token.' },
+        state: { error: "OAuth login failed - invalid token." },
       });
     });
   });
 
-  it('should handle errors gracefully', async () => {
-    const mockToken = 'error-token';
+  it("should handle errors gracefully", async () => {
+    const mockToken = "error-token";
     window.location.hash = `#access_token=${mockToken}`;
 
     // Mock getSession throwing error
     vi.mocked(springAuth.getSession).mockRejectedValueOnce(
-      new Error('Network error')
+      new Error("Network error"),
     );
 
     render(
       <BrowserRouter>
         <AuthCallback />
-      </BrowserRouter>
+      </BrowserRouter>,
     );
 
     await waitFor(() => {
-      expect(mockNavigate).toHaveBeenCalledWith('/login', {
+      expect(mockNavigate).toHaveBeenCalledWith("/login", {
         replace: true,
-        state: { error: 'OAuth login failed. Please try again.' },
+        state: { error: "OAuth login failed. Please try again." },
       });
     });
   });
 
-  it('should display loading state while processing', () => {
-    window.location.hash = '#access_token=processing-token';
+  it("should display loading state while processing", () => {
+    window.location.hash = "#access_token=processing-token";
 
     vi.mocked(springAuth.getSession).mockImplementationOnce(
       () =>
@@ -159,19 +159,19 @@ describe('AuthCallback', () => {
             () =>
               resolve({
                 data: { session: null },
-                error: { message: 'Token expired' },
+                error: { message: "Token expired" },
               }),
-            100
-          )
-        )
+            100,
+          ),
+        ),
     );
 
     const { getByText } = render(
       <BrowserRouter>
         <AuthCallback />
-      </BrowserRouter>
+      </BrowserRouter>,
     );
 
-    expect(getByText('Completing authentication')).toBeInTheDocument();
+    expect(getByText("Completing authentication")).toBeInTheDocument();
   });
 });
diff --git a/frontend/src/proprietary/routes/AuthCallback.tsx b/frontend/src/proprietary/routes/AuthCallback.tsx
index f7c8fa5a11..f900e44556 100644
--- a/frontend/src/proprietary/routes/AuthCallback.tsx
+++ b/frontend/src/proprietary/routes/AuthCallback.tsx
@@ -1,8 +1,8 @@
-import { useEffect, useRef } from 'react';
-import { useNavigate } from 'react-router-dom';
-import { springAuth } from '@app/auth/springAuthClient';
-import { handleAuthCallbackSuccess } from '@app/extensions/authCallback';
-import styles from '@app/routes/AuthCallback.module.css';
+import { useEffect, useRef } from "react";
+import { useNavigate } from "react-router-dom";
+import { springAuth } from "@app/auth/springAuthClient";
+import { handleAuthCallbackSuccess } from "@app/extensions/authCallback";
+import styles from "@app/routes/AuthCallback.module.css";
 
 /**
  * OAuth Callback Handler
@@ -29,108 +29,178 @@ export default function AuthCallback() {
       const startTime = performance.now();
       const executionId = Math.random().toString(36).substring(7);
 
-      console.log(`[AuthCallback:${executionId}] ������������������������������������`);
-      console.log(`[AuthCallback:${executionId}] Starting authentication callback`);
+      console.log(
+        `[AuthCallback:${executionId}] ������������������������������������`,
+      );
+      console.log(
+        `[AuthCallback:${executionId}] Starting authentication callback`,
+      );
       console.log(`[AuthCallback:${executionId}] URL: ${window.location.href}`);
-      console.log(`[AuthCallback:${executionId}] Hash: ${window.location.hash}`);
-      console.log(`[AuthCallback:${executionId}] Document readyState: ${document.readyState}`);
+      console.log(
+        `[AuthCallback:${executionId}] Hash: ${window.location.hash}`,
+      );
+      console.log(
+        `[AuthCallback:${executionId}] Document readyState: ${document.readyState}`,
+      );
 
-      if (typeof window !== 'undefined' && window.sessionStorage.getItem('stirling_sso_auto_login_logged_out') === '1') {
-        console.warn(`[AuthCallback:${executionId}] ⚠�  Logout block active, skipping token processing`);
-        navigate('/login', {
+      if (
+        typeof window !== "undefined" &&
+        window.sessionStorage.getItem("stirling_sso_auto_login_logged_out") ===
+          "1"
+      ) {
+        console.warn(
+          `[AuthCallback:${executionId}] ⚠�  Logout block active, skipping token processing`,
+        );
+        navigate("/login", {
           replace: true,
-          state: { error: 'You have been signed out. Please sign in again.' }
+          state: { error: "You have been signed out. Please sign in again." },
         });
         return;
       }
 
       // Prevent double execution (React 18 Strict Mode + navigate dependency)
       if (processingRef.current) {
-        console.warn(`[AuthCallback:${executionId}] ⚠�  Already processing, skipping duplicate execution`);
-        console.warn(`[AuthCallback:${executionId}] This is expected in React Strict Mode (development)`);
+        console.warn(
+          `[AuthCallback:${executionId}] ⚠�  Already processing, skipping duplicate execution`,
+        );
+        console.warn(
+          `[AuthCallback:${executionId}] This is expected in React Strict Mode (development)`,
+        );
         return;
       }
       processingRef.current = true;
 
       try {
-        console.log(`[AuthCallback:${executionId}] Step 1: Extracting token from URL fragment`);
+        console.log(
+          `[AuthCallback:${executionId}] Step 1: Extracting token from URL fragment`,
+        );
 
         // Extract JWT from URL fragment (#access_token=...)
         const hash = window.location.hash.substring(1); // Remove '#'
         const params = new URLSearchParams(hash);
-        const token = params.get('access_token');
+        const token = params.get("access_token");
 
         if (!token) {
-          console.error(`[AuthCallback:${executionId}] � No access_token in URL fragment`);
-          navigate('/login', {
+          console.error(
+            `[AuthCallback:${executionId}] � No access_token in URL fragment`,
+          );
+          navigate("/login", {
             replace: true,
-            state: { error: 'OAuth login failed - no token received.' }
+            state: { error: "OAuth login failed - no token received." },
           });
           return;
         }
 
-        console.log(`[AuthCallback:${executionId}] ✓ Token extracted (length: ${token.length})`);
-        console.log(`[AuthCallback:${executionId}] Step 2: Storing JWT in localStorage`);
+        console.log(
+          `[AuthCallback:${executionId}] ✓ Token extracted (length: ${token.length})`,
+        );
+        console.log(
+          `[AuthCallback:${executionId}] Step 2: Storing JWT in localStorage`,
+        );
 
         // Store JWT in localStorage
-        localStorage.setItem('stirling_jwt', token);
-        console.log(`[AuthCallback:${executionId}] ✓ JWT stored in localStorage`);
+        localStorage.setItem("stirling_jwt", token);
+        console.log(
+          `[AuthCallback:${executionId}] ✓ JWT stored in localStorage`,
+        );
 
-        console.log(`[AuthCallback:${executionId}] Step 3: Dispatching 'jwt-available' event`);
+        console.log(
+          `[AuthCallback:${executionId}] Step 3: Dispatching 'jwt-available' event`,
+        );
         // Dispatch custom event for other components to react to JWT availability
-        window.dispatchEvent(new CustomEvent('jwt-available'));
+        window.dispatchEvent(new CustomEvent("jwt-available"));
         console.log(`[AuthCallback:${executionId}] ✓ Event dispatched`);
-        console.log(`[AuthCallback:${executionId}] Elapsed after jwt-available: ${(performance.now() - startTime).toFixed(2)}ms`);
+        console.log(
+          `[AuthCallback:${executionId}] Elapsed after jwt-available: ${(performance.now() - startTime).toFixed(2)}ms`,
+        );
 
-        console.log(`[AuthCallback:${executionId}] Step 4: Validating token with backend`);
+        console.log(
+          `[AuthCallback:${executionId}] Step 4: Validating token with backend`,
+        );
         // Validate the token and load user info
         // This calls /api/v1/auth/me with the JWT to get user details
         const { data, error } = await springAuth.getSession();
 
         if (error || !data.session) {
-          console.error(`[AuthCallback:${executionId}] � Failed to validate token:`, error);
-          localStorage.removeItem('stirling_jwt');
-          navigate('/login', {
+          console.error(
+            `[AuthCallback:${executionId}] � Failed to validate token:`,
+            error,
+          );
+          localStorage.removeItem("stirling_jwt");
+          navigate("/login", {
             replace: true,
-            state: { error: 'OAuth login failed - invalid token.' }
+            state: { error: "OAuth login failed - invalid token." },
           });
           return;
         }
 
-        console.log(`[AuthCallback:${executionId}] ✓ Token validated, user: ${data.session.user.username}`);
-        console.log(`[AuthCallback:${executionId}] Step 5: Running platform-specific callback handlers`);
+        console.log(
+          `[AuthCallback:${executionId}] ✓ Token validated, user: ${data.session.user.username}`,
+        );
+        console.log(
+          `[AuthCallback:${executionId}] Step 5: Running platform-specific callback handlers`,
+        );
 
         await handleAuthCallbackSuccess(token);
 
-        console.log(`[AuthCallback:${executionId}] ✓ Callback handlers complete`);
-        console.log(`[AuthCallback:${executionId}] Step 6: Waiting for context stabilization`);
+        console.log(
+          `[AuthCallback:${executionId}] ✓ Callback handlers complete`,
+        );
+        console.log(
+          `[AuthCallback:${executionId}] Step 6: Waiting for context stabilization`,
+        );
 
         // Wait for all context providers to process jwt-available event
         // This prevents infinite render loop when coming from cross-domain SAML redirect
-        await new Promise(resolve => setTimeout(resolve, 100));
-        console.log(`[AuthCallback:${executionId}] Elapsed after stabilization wait: ${(performance.now() - startTime).toFixed(2)}ms`);
+        await new Promise((resolve) => setTimeout(resolve, 100));
+        console.log(
+          `[AuthCallback:${executionId}] Elapsed after stabilization wait: ${(performance.now() - startTime).toFixed(2)}ms`,
+        );
 
-        console.log(`[AuthCallback:${executionId}] Step 7: Navigating to home page`);
+        console.log(
+          `[AuthCallback:${executionId}] Step 7: Navigating to home page`,
+        );
 
         // Clear the hash from URL and redirect to home page
-        navigate('/', { replace: true });
+        navigate("/", { replace: true });
 
         const duration = performance.now() - startTime;
-        console.log(`[AuthCallback:${executionId}] ✓ Authentication complete (${duration.toFixed(2)}ms)`);
-        console.log(`[AuthCallback:${executionId}] ������������������������������������`);
+        console.log(
+          `[AuthCallback:${executionId}] ✓ Authentication complete (${duration.toFixed(2)}ms)`,
+        );
+        console.log(
+          `[AuthCallback:${executionId}] ������������������������������������`,
+        );
       } catch (error) {
         const duration = performance.now() - startTime;
-        console.error(`[AuthCallback:${executionId}] ������������������������������������`);
-        console.error(`[AuthCallback:${executionId}] � FATAL ERROR during authentication`);
+        console.error(
+          `[AuthCallback:${executionId}] ������������������������������������`,
+        );
+        console.error(
+          `[AuthCallback:${executionId}] � FATAL ERROR during authentication`,
+        );
         console.error(`[AuthCallback:${executionId}] Error:`, error);
-        console.error(`[AuthCallback:${executionId}] Error name:`, (error as Error)?.name);
-        console.error(`[AuthCallback:${executionId}] Error message:`, (error as Error)?.message);
-        console.error(`[AuthCallback:${executionId}] Error stack:`, (error as Error)?.stack);
-        console.error(`[AuthCallback:${executionId}] Duration before failure: ${duration.toFixed(2)}ms`);
-        console.error(`[AuthCallback:${executionId}] ������������������������������������`);
-        navigate('/login', {
+        console.error(
+          `[AuthCallback:${executionId}] Error name:`,
+          (error as Error)?.name,
+        );
+        console.error(
+          `[AuthCallback:${executionId}] Error message:`,
+          (error as Error)?.message,
+        );
+        console.error(
+          `[AuthCallback:${executionId}] Error stack:`,
+          (error as Error)?.stack,
+        );
+        console.error(
+          `[AuthCallback:${executionId}] Duration before failure: ${duration.toFixed(2)}ms`,
+        );
+        console.error(
+          `[AuthCallback:${executionId}] ������������������������������������`,
+        );
+        navigate("/login", {
           replace: true,
-          state: { error: 'OAuth login failed. Please try again.' }
+          state: { error: "OAuth login failed. Please try again." },
         });
       }
     };
@@ -143,8 +213,12 @@ export default function AuthCallback() {
       <div className={styles.card}>
         <div className={`${styles.icon} ${styles.iconNeutral}`}>...</div>
         <div className={styles.title}>Completing authentication</div>
-        <div className={styles.message}>Please wait while we finish signing you in.</div>
-        <div className={styles.loadingExtra}>You can close this window once it completes.</div>
+        <div className={styles.message}>
+          Please wait while we finish signing you in.
+        </div>
+        <div className={styles.loadingExtra}>
+          You can close this window once it completes.
+        </div>
       </div>
     </div>
   );
diff --git a/frontend/src/proprietary/routes/InviteAccept.tsx b/frontend/src/proprietary/routes/InviteAccept.tsx
index c145309cab..a5a0af9c14 100644
--- a/frontend/src/proprietary/routes/InviteAccept.tsx
+++ b/frontend/src/proprietary/routes/InviteAccept.tsx
@@ -1,13 +1,23 @@
-import { useState, useEffect } from 'react';
-import { useParams, useNavigate } from 'react-router-dom';
-import { useTranslation } from 'react-i18next';
-import { Stack, Text, Paper, Center, Loader, TextInput, PasswordInput, Anchor } from '@mantine/core';
-import { useDocumentMeta } from '@app/hooks/useDocumentMeta';
-import AuthLayout from '@app/routes/authShared/AuthLayout';
-import LoginHeader from '@app/routes/login/LoginHeader';
-import ErrorMessage from '@app/routes/login/ErrorMessage';
-import { BASE_PATH } from '@app/constants/app';
-import apiClient from '@app/services/apiClient';
+import { useState, useEffect } from "react";
+import { isAxiosError } from "axios";
+import { useParams, useNavigate } from "react-router-dom";
+import { useTranslation } from "react-i18next";
+import {
+  Stack,
+  Text,
+  Paper,
+  Center,
+  Loader,
+  TextInput,
+  PasswordInput,
+  Anchor,
+} from "@mantine/core";
+import { useDocumentMeta } from "@app/hooks/useDocumentMeta";
+import AuthLayout from "@app/routes/authShared/AuthLayout";
+import LoginHeader from "@app/routes/login/LoginHeader";
+import ErrorMessage from "@app/routes/login/ErrorMessage";
+import { BASE_PATH } from "@app/constants/app";
+import apiClient from "@app/services/apiClient";
 
 interface InviteData {
   email: string | null;
@@ -25,25 +35,31 @@ export default function InviteAccept() {
   const [submitting, setSubmitting] = useState(false);
   const [inviteData, setInviteData] = useState<InviteData | null>(null);
   const [error, setError] = useState<string | null>(null);
-  const [email, setEmail] = useState('');
-  const [password, setPassword] = useState('');
-  const [confirmPassword, setConfirmPassword] = useState('');
+  const [email, setEmail] = useState("");
+  const [password, setPassword] = useState("");
+  const [confirmPassword, setConfirmPassword] = useState("");
 
   const baseUrl = window.location.origin + BASE_PATH;
 
   // Set document meta
   useDocumentMeta({
-    title: `${t('invite.welcome', 'Welcome to Stirling PDF')} - Stirling PDF`,
-    description: t('app.description', 'The Free Adobe Acrobat alternative (10M+ Downloads)'),
-    ogTitle: `${t('invite.welcome', 'Welcome to Stirling PDF')} - Stirling PDF`,
-    ogDescription: t('app.description', 'The Free Adobe Acrobat alternative (10M+ Downloads)'),
+    title: `${t("invite.welcome", "Welcome to Stirling PDF")} - Stirling PDF`,
+    description: t(
+      "app.description",
+      "The Free Adobe Acrobat alternative (10M+ Downloads)",
+    ),
+    ogTitle: `${t("invite.welcome", "Welcome to Stirling PDF")} - Stirling PDF`,
+    ogDescription: t(
+      "app.description",
+      "The Free Adobe Acrobat alternative (10M+ Downloads)",
+    ),
     ogImage: `${baseUrl}/og_images/home.png`,
-    ogUrl: `${window.location.origin}${window.location.pathname}`
+    ogUrl: `${window.location.origin}${window.location.pathname}`,
   });
 
   useEffect(() => {
     if (!token) {
-      setError(t('invite.invalidToken', 'Invalid invitation link'));
+      setError(t("invite.invalidToken", "Invalid invitation link"));
       setLoading(false);
       return;
     }
@@ -54,16 +70,19 @@ export default function InviteAccept() {
   const validateToken = async () => {
     try {
       setLoading(true);
-      const response = await apiClient.get<InviteData>(`/api/v1/invite/validate/${token}`, {
-        suppressErrorToast: true,
-      } as any);
+      const response = await apiClient.get<InviteData>(
+        `/api/v1/invite/validate/${token}`,
+        {
+          suppressErrorToast: true,
+        },
+      );
       setInviteData(response.data);
       setError(null);
-    } catch (err: any) {
-      const errorMessage =
-        err.response?.data?.error ||
-        err.message ||
-        t('invite.validationError', 'Failed to validate invitation link');
+    } catch (err: unknown) {
+      const errorMessage = isAxiosError(err)
+        ? err.response?.data?.error || err.message
+        : (err instanceof Error ? err.message : undefined) ||
+          t("invite.validationError", "Failed to validate invitation link");
       setError(errorMessage);
     } finally {
       setLoading(false);
@@ -76,23 +95,23 @@ export default function InviteAccept() {
     // Validate email if required
     if (inviteData?.emailRequired) {
       if (!email || email.trim().length === 0) {
-        setError(t('invite.emailRequired', 'Email address is required'));
+        setError(t("invite.emailRequired", "Email address is required"));
         return;
       }
-      if (!email.includes('@')) {
-        setError(t('invite.invalidEmail', 'Invalid email address'));
+      if (!email.includes("@")) {
+        setError(t("invite.invalidEmail", "Invalid email address"));
         return;
       }
     }
 
     // Validate passwords
     if (!password) {
-      setError(t('invite.passwordRequired', 'Password is required'));
+      setError(t("invite.passwordRequired", "Password is required"));
       return;
     }
 
     if (password !== confirmPassword) {
-      setError(t('invite.passwordMismatch', 'Passwords do not match'));
+      setError(t("invite.passwordMismatch", "Passwords do not match"));
       return;
     }
 
@@ -102,21 +121,21 @@ export default function InviteAccept() {
 
       const formData = new FormData();
       if (inviteData?.emailRequired) {
-        formData.append('email', email.trim().toLowerCase());
+        formData.append("email", email.trim().toLowerCase());
       }
-      formData.append('password', password);
+      formData.append("password", password);
 
       await apiClient.post(`/api/v1/invite/accept/${token}`, formData, {
         suppressErrorToast: true,
-      } as any);
+      });
 
       // Success - redirect to login
-      navigate('/login?messageType=accountCreated');
-    } catch (err: any) {
-      const errorMessage =
-        err.response?.data?.error ||
-        err.message ||
-        t('invite.acceptError', 'Failed to create account');
+      navigate("/login?messageType=accountCreated");
+    } catch (err: unknown) {
+      const errorMessage = isAxiosError(err)
+        ? err.response?.data?.error || err.message
+        : (err instanceof Error ? err.message : undefined) ||
+          t("invite.acceptError", "Failed to create account");
       setError(errorMessage);
     } finally {
       setSubmitting(false);
@@ -126,7 +145,9 @@ export default function InviteAccept() {
   if (loading) {
     return (
       <AuthLayout>
-        <LoginHeader title={t('invite.validating', 'Validating invitation...')} />
+        <LoginHeader
+          title={t("invite.validating", "Validating invitation...")}
+        />
         <Center py="xl">
           <Loader size="md" />
         </Center>
@@ -137,15 +158,17 @@ export default function InviteAccept() {
   if (error && !inviteData) {
     return (
       <AuthLayout>
-        <LoginHeader title={t('invite.invalidInvitation', 'Invalid Invitation')} />
+        <LoginHeader
+          title={t("invite.invalidInvitation", "Invalid Invitation")}
+        />
         <ErrorMessage error={error} />
         <div className="auth-section">
           <button
             type="button"
-            onClick={() => navigate('/login')}
+            onClick={() => navigate("/login")}
             className="w-full px-4 py-[0.75rem] rounded-[0.625rem] text-base font-semibold cursor-pointer border-0 auth-cta-button"
           >
-            {t('invite.goToLogin', 'Go to Login')}
+            {t("invite.goToLogin", "Go to Login")}
           </button>
         </div>
       </AuthLayout>
@@ -155,21 +178,38 @@ export default function InviteAccept() {
   return (
     <AuthLayout>
       <LoginHeader
-        title={t('invite.welcomeTitle', "You've been invited!")}
-        subtitle={t('invite.welcomeSubtitle', 'Complete your account setup to get started')}
+        title={t("invite.welcomeTitle", "You've been invited!")}
+        subtitle={t(
+          "invite.welcomeSubtitle",
+          "Complete your account setup to get started",
+        )}
       />
 
       {inviteData && !inviteData.emailRequired && (
-        <Paper withBorder p="md" mb="lg" bg="blue.0" style={{ borderColor: 'var(--mantine-color-blue-3)' }}>
+        <Paper
+          withBorder
+          p="md"
+          mb="lg"
+          bg="blue.0"
+          style={{ borderColor: "var(--mantine-color-blue-3)" }}
+        >
           <Stack gap="xs" align="center">
-            <Text size="xs" tt="uppercase" c="dimmed" fw={500} style={{ letterSpacing: '0.05em' }}>
-              {t('invite.accountFor', 'Creating account for')}
+            <Text
+              size="xs"
+              tt="uppercase"
+              c="dimmed"
+              fw={500}
+              style={{ letterSpacing: "0.05em" }}
+            >
+              {t("invite.accountFor", "Creating account for")}
             </Text>
             <Text size="lg" fw={600}>
               {inviteData.email}
             </Text>
             <Text size="xs" c="dimmed">
-              {t('invite.linkExpires', 'Link expires')}: {new Date(inviteData.expiresAt).toLocaleDateString()} at {new Date(inviteData.expiresAt).toLocaleTimeString()}
+              {t("invite.linkExpires", "Link expires")}:{" "}
+              {new Date(inviteData.expiresAt).toLocaleDateString()} at{" "}
+              {new Date(inviteData.expiresAt).toLocaleTimeString()}
             </Text>
           </Stack>
         </Paper>
@@ -181,11 +221,14 @@ export default function InviteAccept() {
         <Stack gap="md">
           {inviteData?.emailRequired && (
             <TextInput
-              label={t('invite.email', 'Email address')}
+              label={t("invite.email", "Email address")}
               type="email"
               value={email}
               onChange={(e) => setEmail(e.target.value)}
-              placeholder={t('invite.emailPlaceholder', 'Enter your email address')}
+              placeholder={t(
+                "invite.emailPlaceholder",
+                "Enter your email address",
+              )}
               disabled={submitting}
               required
               autoComplete="email"
@@ -193,20 +236,23 @@ export default function InviteAccept() {
           )}
 
           <PasswordInput
-            label={t('invite.choosePassword', 'Choose a password')}
+            label={t("invite.choosePassword", "Choose a password")}
             value={password}
             onChange={(e) => setPassword(e.target.value)}
-            placeholder={t('invite.passwordPlaceholder', 'Enter your password')}
+            placeholder={t("invite.passwordPlaceholder", "Enter your password")}
             disabled={submitting}
             required
             autoComplete="new-password"
           />
 
           <PasswordInput
-            label={t('invite.confirmPassword', 'Confirm password')}
+            label={t("invite.confirmPassword", "Confirm password")}
             value={confirmPassword}
             onChange={(e) => setConfirmPassword(e.target.value)}
-            placeholder={t('invite.confirmPasswordPlaceholder', 'Re-enter your password')}
+            placeholder={t(
+              "invite.confirmPasswordPlaceholder",
+              "Re-enter your password",
+            )}
             disabled={submitting}
             required
             autoComplete="new-password"
@@ -218,7 +264,9 @@ export default function InviteAccept() {
               disabled={submitting}
               className="w-full px-4 py-[0.75rem] rounded-[0.625rem] text-base font-semibold cursor-pointer border-0 disabled:opacity-50 disabled:cursor-not-allowed auth-cta-button"
             >
-              {submitting ? t('invite.creating', 'Creating Account...') : t('invite.createAccount', 'Create Account')}
+              {submitting
+                ? t("invite.creating", "Creating Account...")
+                : t("invite.createAccount", "Create Account")}
             </button>
           </div>
         </Stack>
@@ -226,9 +274,14 @@ export default function InviteAccept() {
 
       <Center mt="md">
         <Text size="sm" c="dimmed">
-          {t('invite.alreadyHaveAccount', 'Already have an account?')}{' '}
-          <Anchor component="button" type="button" onClick={() => navigate('/login')} c="dark">
-            {t('invite.signIn', 'Sign in')}
+          {t("invite.alreadyHaveAccount", "Already have an account?")}{" "}
+          <Anchor
+            component="button"
+            type="button"
+            onClick={() => navigate("/login")}
+            c="dark"
+          >
+            {t("invite.signIn", "Sign in")}
           </Anchor>
         </Text>
       </Center>
diff --git a/frontend/src/proprietary/routes/Landing.tsx b/frontend/src/proprietary/routes/Landing.tsx
index 0fe9c1b33b..da23926a44 100644
--- a/frontend/src/proprietary/routes/Landing.tsx
+++ b/frontend/src/proprietary/routes/Landing.tsx
@@ -1,12 +1,12 @@
-import { useEffect } from 'react'
-import { Navigate, useLocation, useNavigate } from 'react-router-dom'
-import { useAuth } from '@app/auth/UseSession'
-import { useAppConfig } from '@app/contexts/AppConfigContext'
-import HomePage from '@app/pages/HomePage'
-import { useBackendProbe } from '@app/hooks/useBackendProbe'
-import AuthLayout from '@app/routes/authShared/AuthLayout'
-import LoginHeader from '@app/routes/login/LoginHeader'
-import { useTranslation } from 'react-i18next'
+import { useEffect } from "react";
+import { Navigate, useLocation, useNavigate } from "react-router-dom";
+import { useAuth } from "@app/auth/UseSession";
+import { useAppConfig } from "@app/contexts/AppConfigContext";
+import HomePage from "@app/pages/HomePage";
+import { useBackendProbe } from "@app/hooks/useBackendProbe";
+import AuthLayout from "@app/routes/authShared/AuthLayout";
+import LoginHeader from "@app/routes/login/LoginHeader";
+import { useTranslation } from "react-i18next";
 
 /**
  * Landing component - Smart router based on authentication status
@@ -28,7 +28,9 @@ export default function Landing() {
   // Debug: Track Landing component lifecycle
   useEffect(() => {
     const mountId = Math.random().toString(36).substring(7);
-    console.log(`[Landing:${mountId}] 🔵 Component mounted at ${location.pathname}`);
+    console.log(
+      `[Landing:${mountId}] 🔵 Component mounted at ${location.pathname}`,
+    );
     console.log(`[Landing:${mountId}] Mount state:`, {
       authLoading,
       configLoading,
@@ -38,19 +40,25 @@ export default function Landing() {
     return () => {
       console.log(`[Landing:${mountId}] 🔴 Component unmounting`);
     };
-  }, [location.pathname, authLoading, configLoading, backendProbe.loading, session]);
+  }, [
+    location.pathname,
+    authLoading,
+    configLoading,
+    backendProbe.loading,
+    session,
+  ]);
 
   // Periodically probe while backend isn't up so the screen can auto-advance when it comes online
   useEffect(() => {
-    if (backendProbe.status === 'up' || backendProbe.loginDisabled) {
+    if (backendProbe.status === "up" || backendProbe.loginDisabled) {
       return;
     }
     const tick = async () => {
       const result = await backendProbe.probe();
-      if (result.status === 'up') {
+      if (result.status === "up") {
         await refetch();
         if (result.loginDisabled) {
-          navigate('/', { replace: true });
+          navigate("/", { replace: true });
         }
       }
     };
@@ -58,16 +66,22 @@ export default function Landing() {
       void tick();
     }, 5000);
     return () => window.clearInterval(intervalId);
-  }, [backendProbe.status, backendProbe.loginDisabled, backendProbe.probe, navigate, refetch]);
+  }, [
+    backendProbe.status,
+    backendProbe.loginDisabled,
+    backendProbe.probe,
+    navigate,
+    refetch,
+  ]);
 
   useEffect(() => {
-    if (backendProbe.status === 'up') {
+    if (backendProbe.status === "up") {
       void refetch();
     }
   }, [backendProbe.status, refetch]);
 
-  console.log('[Landing] ������������������������������������');
-  console.log('[Landing] Render state:', {
+  console.log("[Landing] ������������������������������������");
+  console.log("[Landing] Render state:", {
     pathname: location.pathname,
     loading,
     authLoading,
@@ -79,17 +93,22 @@ export default function Landing() {
     backendStatus: backendProbe.status,
     timestamp: new Date().toISOString(),
   });
-  console.log('[Landing] ������������������������������������');
+  console.log("[Landing] ������������������������������������");
 
   // Show loading while checking auth and config
   if (loading) {
     return (
-      <div style={{ minHeight: '100vh', display: 'flex', alignItems: 'center', justifyContent: 'center' }}>
+      <div
+        style={{
+          minHeight: "100vh",
+          display: "flex",
+          alignItems: "center",
+          justifyContent: "center",
+        }}
+      >
         <div className="text-center">
           <div className="animate-spin rounded-full h-8 w-8 border-b-2 border-blue-600 mx-auto mb-3"></div>
-          <div className="text-gray-600">
-            Loading...
-          </div>
+          <div className="text-gray-600">Loading...</div>
         </div>
       </div>
     );
@@ -97,20 +116,18 @@ export default function Landing() {
 
   // If login is disabled, show app directly (anonymous mode)
   if (config?.enableLogin === false || backendProbe.loginDisabled) {
-    console.debug('[Landing] Login disabled - showing app in anonymous mode');
-    return (
-      <HomePage />
-    );
+    console.debug("[Landing] Login disabled - showing app in anonymous mode");
+    return <HomePage />;
   }
 
   // If backend is not up yet and user is not authenticated, show a branded status screen
-  if (!session && backendProbe.status !== 'up') {
-    const backendTitle = t('backendStartup.notFoundTitle', 'Backend not found');
+  if (!session && backendProbe.status !== "up") {
+    const backendTitle = t("backendStartup.notFoundTitle", "Backend not found");
     const handleRetry = async () => {
       const result = await backendProbe.probe();
-      if (result.status === 'up') {
+      if (result.status === "up") {
         await refetch();
-        navigate('/', { replace: true });
+        navigate("/", { replace: true });
       }
     };
     return (
@@ -119,23 +136,25 @@ export default function Landing() {
         <div
           className="auth-section"
           style={{
-            padding: '1.5rem',
-            marginTop: '1rem',
-            borderRadius: '0.75rem',
-            backgroundColor: 'rgba(37, 99, 235, 0.08)',
-            border: '1px solid rgba(37, 99, 235, 0.2)',
+            padding: "1.5rem",
+            marginTop: "1rem",
+            borderRadius: "0.75rem",
+            backgroundColor: "rgba(37, 99, 235, 0.08)",
+            border: "1px solid rgba(37, 99, 235, 0.2)",
           }}
         >
-          <p style={{ margin: '0 0 0.75rem 0', color: 'rgba(15, 23, 42, 0.8)' }}>
-            {t('backendStartup.unreachable')}
+          <p
+            style={{ margin: "0 0 0.75rem 0", color: "rgba(15, 23, 42, 0.8)" }}
+          >
+            {t("backendStartup.unreachable")}
           </p>
           <button
             type="button"
             onClick={handleRetry}
             className="auth-cta-button px-4 py-[0.75rem] rounded-[0.625rem] text-base font-semibold mt-5 border-0 cursor-pointer"
-            style={{ width: 'fit-content' }}
+            style={{ width: "fit-content" }}
           >
-            {t('backendStartup.retry', 'Retry')}
+            {t("backendStartup.retry", "Retry")}
           </button>
         </div>
       </AuthLayout>
@@ -145,14 +164,14 @@ export default function Landing() {
   // If we have a session, show the main app
   // Note: First login password change is now handled by the onboarding flow
   if (session) {
-    return (
-      <HomePage />
-    );
+    return <HomePage />;
   }
 
   // No session - redirect to login page
   // This ensures the URL always shows /login when not authenticated
-  return (config?.enableLogin === true && !backendProbe.loginDisabled)
-    ? <Navigate to="/login" replace state={{ from: location }} />
-    : <HomePage />;
+  return config?.enableLogin === true && !backendProbe.loginDisabled ? (
+    <Navigate to="/login" replace state={{ from: location }} />
+  ) : (
+    <HomePage />
+  );
 }
diff --git a/frontend/src/proprietary/routes/Login.test.tsx b/frontend/src/proprietary/routes/Login.test.tsx
index dc4e76419a..4353f668cc 100644
--- a/frontend/src/proprietary/routes/Login.test.tsx
+++ b/frontend/src/proprietary/routes/Login.test.tsx
@@ -1,47 +1,47 @@
-import { describe, it, expect, beforeEach, vi } from 'vitest';
-import { render, screen, waitFor } from '@testing-library/react';
-import userEvent from '@testing-library/user-event';
-import { BrowserRouter, MemoryRouter } from 'react-router-dom';
-import { MantineProvider } from '@mantine/core';
-import Login from '@app/routes/Login';
-import { useAuth } from '@app/auth/UseSession';
-import { springAuth } from '@app/auth/springAuthClient';
-import { PreferencesProvider } from '@app/contexts/PreferencesContext';
-import apiClient from '@app/services/apiClient';
+import { describe, it, expect, beforeEach, vi } from "vitest";
+import { render, screen, waitFor } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+import { BrowserRouter, MemoryRouter } from "react-router-dom";
+import { MantineProvider } from "@mantine/core";
+import Login from "@app/routes/Login";
+import { useAuth } from "@app/auth/UseSession";
+import { springAuth } from "@app/auth/springAuthClient";
+import { PreferencesProvider } from "@app/contexts/PreferencesContext";
+import apiClient from "@app/services/apiClient";
 
 // Mock i18n to return fallback text
-vi.mock('react-i18next', () => ({
+vi.mock("react-i18next", () => ({
   useTranslation: () => ({
     t: (key: string, fallback?: string | Record<string, unknown>) => {
-      if (typeof fallback === 'string') return fallback;
+      if (typeof fallback === "string") return fallback;
       return key;
     },
   }),
   initReactI18next: {
-    type: '3rdParty',
+    type: "3rdParty",
     init: vi.fn(),
   },
 }));
 
 // Mock i18n module to avoid initialization
-vi.mock('@app/i18n', () => ({
+vi.mock("@app/i18n", () => ({
   updateSupportedLanguages: vi.fn(),
-  supportedLanguages: { 'en-GB': 'English' },
+  supportedLanguages: { "en-GB": "English" },
   rtlLanguages: [],
   default: {
-    language: 'en-GB',
+    language: "en-GB",
     changeLanguage: vi.fn(),
     options: {},
   },
 }));
 
 // Mock useAuth hook
-vi.mock('@app/auth/UseSession', () => ({
+vi.mock("@app/auth/UseSession", () => ({
   useAuth: vi.fn(),
 }));
 
 // Mock springAuth
-vi.mock('@app/auth/springAuthClient', () => ({
+vi.mock("@app/auth/springAuthClient", () => ({
   springAuth: {
     signInWithPassword: vi.fn(),
     signInWithOAuth: vi.fn(),
@@ -49,12 +49,12 @@ vi.mock('@app/auth/springAuthClient', () => ({
 }));
 
 // Mock useDocumentMeta
-vi.mock('@app/hooks/useDocumentMeta', () => ({
+vi.mock("@app/hooks/useDocumentMeta", () => ({
   useDocumentMeta: vi.fn(),
 }));
 
 // Mock apiClient for provider list
-vi.mock('@app/services/apiClient', () => ({
+vi.mock("@app/services/apiClient", () => ({
   default: {
     get: vi.fn(),
     post: vi.fn(),
@@ -63,21 +63,21 @@ vi.mock('@app/services/apiClient', () => ({
 
 const mockNavigate = vi.fn();
 const mockBackendProbeState = {
-  status: 'up' as const,
+  status: "up" as const,
   loginDisabled: false,
   loading: false,
 };
 const mockProbe = vi.fn().mockResolvedValue(mockBackendProbeState);
 
-vi.mock('@app/hooks/useBackendProbe', () => ({
+vi.mock("@app/hooks/useBackendProbe", () => ({
   useBackendProbe: () => ({
     ...mockBackendProbeState,
     probe: mockProbe,
   }),
 }));
 
-vi.mock('react-router-dom', async () => {
-  const actual = await vi.importActual('react-router-dom');
+vi.mock("react-router-dom", async () => {
+  const actual = await vi.importActual("react-router-dom");
   return {
     ...actual,
     useNavigate: () => mockNavigate,
@@ -87,16 +87,14 @@ vi.mock('react-router-dom', async () => {
 // Test wrapper with MantineProvider
 const TestWrapper = ({ children }: { children: React.ReactNode }) => (
   <MantineProvider>
-    <PreferencesProvider>
-      {children}
-    </PreferencesProvider>
+    <PreferencesProvider>{children}</PreferencesProvider>
   </MantineProvider>
 );
 
-describe('Login', () => {
+describe("Login", () => {
   beforeEach(() => {
     vi.clearAllMocks();
-    mockBackendProbeState.status = 'up';
+    mockBackendProbeState.status = "up";
     mockBackendProbeState.loginDisabled = false;
     mockBackendProbeState.loading = false;
     mockProbe.mockResolvedValue(mockBackendProbeState);
@@ -120,31 +118,31 @@ describe('Login', () => {
     });
   });
 
-  it('should render login form', async () => {
+  it("should render login form", async () => {
     render(
       <TestWrapper>
         <BrowserRouter>
           <Login />
         </BrowserRouter>
-      </TestWrapper>
+      </TestWrapper>,
     );
 
     await waitFor(() => {
       // Check for login form elements - use id since it's more reliable
-      const emailInput = document.getElementById('email');
+      const emailInput = document.getElementById("email");
       expect(emailInput).toBeTruthy();
     });
   });
 
-  it('should redirect authenticated user to home', async () => {
+  it("should redirect authenticated user to home", async () => {
     const mockSession = {
       user: {
-        id: '123',
-        email: 'test@example.com',
-        username: 'testuser',
-        role: 'USER',
+        id: "123",
+        email: "test@example.com",
+        username: "testuser",
+        role: "USER",
       },
-      access_token: 'mock-token',
+      access_token: "mock-token",
       expires_in: 3600,
     };
 
@@ -162,15 +160,15 @@ describe('Login', () => {
         <BrowserRouter>
           <Login />
         </BrowserRouter>
-      </TestWrapper>
+      </TestWrapper>,
     );
 
     await waitFor(() => {
-      expect(mockNavigate).toHaveBeenCalledWith('/', { replace: true });
+      expect(mockNavigate).toHaveBeenCalledWith("/", { replace: true });
     });
   });
 
-  it('should show loading state while auth is loading', () => {
+  it("should show loading state while auth is loading", () => {
     vi.mocked(useAuth).mockReturnValue({
       session: null,
       user: null,
@@ -185,25 +183,25 @@ describe('Login', () => {
         <BrowserRouter>
           <Login />
         </BrowserRouter>
-      </TestWrapper>
+      </TestWrapper>,
     );
 
     // Component shouldn't redirect or show form while loading
     expect(mockNavigate).not.toHaveBeenCalled();
   });
 
-  it('should handle email/password login', async () => {
+  it("should handle email/password login", async () => {
     const user = userEvent.setup();
     const mockUser = {
-      id: '123',
-      email: 'test@example.com',
-      username: 'test@example.com',
-      role: 'USER',
+      id: "123",
+      email: "test@example.com",
+      username: "test@example.com",
+      role: "USER",
     };
 
     const mockSession = {
       user: mockUser,
-      access_token: 'new-token',
+      access_token: "new-token",
       expires_in: 3600,
     };
 
@@ -218,49 +216,59 @@ describe('Login', () => {
         <BrowserRouter>
           <Login />
         </BrowserRouter>
-      </TestWrapper>
+      </TestWrapper>,
     );
 
     // Wait for form to load
-    await waitFor(() => {
-      const emailInput = document.getElementById('email');
-      expect(emailInput).toBeTruthy();
-      const passwordInput = document.getElementById('password');
-      expect(passwordInput).toBeTruthy();
-    }, { timeout: 3000 });
+    await waitFor(
+      () => {
+        const emailInput = document.getElementById("email");
+        expect(emailInput).toBeTruthy();
+        const passwordInput = document.getElementById("password");
+        expect(passwordInput).toBeTruthy();
+      },
+      { timeout: 3000 },
+    );
 
     // Fill in form using getElementById
-    const emailInput = document.getElementById('email') as HTMLInputElement;
-    const passwordInput = document.getElementById('password') as HTMLInputElement;
+    const emailInput = document.getElementById("email") as HTMLInputElement;
+    const passwordInput = document.getElementById(
+      "password",
+    ) as HTMLInputElement;
 
     if (!emailInput || !passwordInput) {
-      throw new Error('Form inputs not found');
+      throw new Error("Form inputs not found");
     }
 
-    await user.type(emailInput, 'test@example.com');
-    await user.type(passwordInput, 'password123');
+    await user.type(emailInput, "test@example.com");
+    await user.type(passwordInput, "password123");
 
     // Submit form - use a more flexible query
     // Look for button with type="submit" in the form
-    const submitButton = await waitFor(() => {
-      const buttons = screen.queryAllByRole('button');
-      const submitBtn = buttons.find(btn => btn.getAttribute('type') === 'submit');
-      if (!submitBtn) {
-        throw new Error('Submit button not found');
-      }
-      return submitBtn;
-    }, { timeout: 5000 });
+    const submitButton = await waitFor(
+      () => {
+        const buttons = screen.queryAllByRole("button");
+        const submitBtn = buttons.find(
+          (btn) => btn.getAttribute("type") === "submit",
+        );
+        if (!submitBtn) {
+          throw new Error("Submit button not found");
+        }
+        return submitBtn;
+      },
+      { timeout: 5000 },
+    );
     await user.click(submitButton);
 
     await waitFor(() => {
       expect(springAuth.signInWithPassword).toHaveBeenCalledWith({
-        email: 'test@example.com',
-        password: 'password123',
+        email: "test@example.com",
+        password: "password123",
       });
     });
   });
 
-  it('should use actual provider ID for OAuth login (authentik)', async () => {
+  it("should use actual provider ID for OAuth login (authentik)", async () => {
     const user = userEvent.setup();
 
     // Mock provider list with authentik
@@ -268,7 +276,7 @@ describe('Login', () => {
       data: {
         enableLogin: true,
         providerList: {
-          '/oauth2/authorization/authentik': 'Authentik',
+          "/oauth2/authorization/authentik": "Authentik",
         },
       },
     });
@@ -282,28 +290,31 @@ describe('Login', () => {
         <BrowserRouter>
           <Login />
         </BrowserRouter>
-      </TestWrapper>
+      </TestWrapper>,
     );
 
     // Wait for OAuth button to appear
-    await waitFor(() => {
-      const button = screen.queryByText('Authentik');
-      expect(button).toBeTruthy();
-    }, { timeout: 3000 });
+    await waitFor(
+      () => {
+        const button = screen.queryByText("Authentik");
+        expect(button).toBeTruthy();
+      },
+      { timeout: 3000 },
+    );
 
-    const oauthButton = screen.getByText('Authentik');
+    const oauthButton = screen.getByText("Authentik");
     await user.click(oauthButton);
 
     await waitFor(() => {
       // Should use full path directly, NOT map to 'oidc'
       expect(springAuth.signInWithOAuth).toHaveBeenCalledWith({
-        provider: '/oauth2/authorization/authentik',
-        options: { redirectTo: '/auth/callback' }
+        provider: "/oauth2/authorization/authentik",
+        options: { redirectTo: "/auth/callback" },
       });
     });
   });
 
-  it('should use actual provider ID for OAuth login (custom provider)', async () => {
+  it("should use actual provider ID for OAuth login (custom provider)", async () => {
     const user = userEvent.setup();
 
     // Mock provider list with custom provider 'mycompany'
@@ -311,7 +322,7 @@ describe('Login', () => {
       data: {
         enableLogin: true,
         providerList: {
-          '/oauth2/authorization/mycompany': 'My Company SSO',
+          "/oauth2/authorization/mycompany": "My Company SSO",
         },
       },
     });
@@ -325,29 +336,32 @@ describe('Login', () => {
         <BrowserRouter>
           <Login />
         </BrowserRouter>
-      </TestWrapper>
+      </TestWrapper>,
     );
 
     // Wait for OAuth button to appear (will show 'Mycompany' as label)
-    await waitFor(() => {
-      const button = screen.queryByText('Mycompany');
-      expect(button).toBeTruthy();
-    }, { timeout: 3000 });
+    await waitFor(
+      () => {
+        const button = screen.queryByText("Mycompany");
+        expect(button).toBeTruthy();
+      },
+      { timeout: 3000 },
+    );
 
-    const oauthButton = screen.getByText('Mycompany');
+    const oauthButton = screen.getByText("Mycompany");
     await user.click(oauthButton);
 
     await waitFor(() => {
       // Should use full path directly - this is the critical fix
       // Previously it would map unknown providers to 'oidc'
       expect(springAuth.signInWithOAuth).toHaveBeenCalledWith({
-        provider: '/oauth2/authorization/mycompany',
-        options: { redirectTo: '/auth/callback' }
+        provider: "/oauth2/authorization/mycompany",
+        options: { redirectTo: "/auth/callback" },
       });
     });
   });
 
-  it('should use oidc provider ID when explicitly configured', async () => {
+  it("should use oidc provider ID when explicitly configured", async () => {
     const user = userEvent.setup();
 
     // Mock provider list with 'oidc'
@@ -355,7 +369,7 @@ describe('Login', () => {
       data: {
         enableLogin: true,
         providerList: {
-          '/oauth2/authorization/oidc': 'OIDC',
+          "/oauth2/authorization/oidc": "OIDC",
         },
       },
     });
@@ -369,30 +383,33 @@ describe('Login', () => {
         <BrowserRouter>
           <Login />
         </BrowserRouter>
-      </TestWrapper>
+      </TestWrapper>,
     );
 
     // Wait for OAuth button to appear
-    await waitFor(() => {
-      const button = screen.queryByText('OIDC');
-      expect(button).toBeTruthy();
-    }, { timeout: 3000 });
+    await waitFor(
+      () => {
+        const button = screen.queryByText("OIDC");
+        expect(button).toBeTruthy();
+      },
+      { timeout: 3000 },
+    );
 
-    const oauthButton = screen.getByText('OIDC');
+    const oauthButton = screen.getByText("OIDC");
     await user.click(oauthButton);
 
     await waitFor(() => {
       // Should use full path when explicitly configured
       expect(springAuth.signInWithOAuth).toHaveBeenCalledWith({
-        provider: '/oauth2/authorization/oidc',
-        options: { redirectTo: '/auth/callback' }
+        provider: "/oauth2/authorization/oidc",
+        options: { redirectTo: "/auth/callback" },
       });
     });
   });
 
-  it('should show error on failed login', async () => {
+  it("should show error on failed login", async () => {
     const user = userEvent.setup();
-    const errorMessage = 'Invalid credentials';
+    const errorMessage = "Invalid credentials";
 
     vi.mocked(springAuth.signInWithPassword).mockResolvedValueOnce({
       user: null,
@@ -405,30 +422,40 @@ describe('Login', () => {
         <BrowserRouter>
           <Login />
         </BrowserRouter>
-      </TestWrapper>
+      </TestWrapper>,
     );
 
-    await waitFor(() => {
-      const emailInput = document.getElementById('email');
-      const passwordInput = document.getElementById('password');
-      expect(emailInput).toBeTruthy();
-      expect(passwordInput).toBeTruthy();
-    }, { timeout: 3000 });
+    await waitFor(
+      () => {
+        const emailInput = document.getElementById("email");
+        const passwordInput = document.getElementById("password");
+        expect(emailInput).toBeTruthy();
+        expect(passwordInput).toBeTruthy();
+      },
+      { timeout: 3000 },
+    );
 
-    const emailInput = document.getElementById('email') as HTMLInputElement;
-    const passwordInput = document.getElementById('password') as HTMLInputElement;
+    const emailInput = document.getElementById("email") as HTMLInputElement;
+    const passwordInput = document.getElementById(
+      "password",
+    ) as HTMLInputElement;
 
-    await user.type(emailInput, 'wrong@example.com');
-    await user.type(passwordInput, 'wrongpassword');
+    await user.type(emailInput, "wrong@example.com");
+    await user.type(passwordInput, "wrongpassword");
 
-    const submitButton = await waitFor(() => {
-      const buttons = screen.queryAllByRole('button');
-      const submitBtn = buttons.find(btn => btn.getAttribute('type') === 'submit');
-      if (!submitBtn) {
-        throw new Error('Submit button not found');
-      }
-      return submitBtn;
-    }, { timeout: 5000 });
+    const submitButton = await waitFor(
+      () => {
+        const buttons = screen.queryAllByRole("button");
+        const submitBtn = buttons.find(
+          (btn) => btn.getAttribute("type") === "submit",
+        );
+        if (!submitBtn) {
+          throw new Error("Submit button not found");
+        }
+        return submitBtn;
+      },
+      { timeout: 5000 },
+    );
     await user.click(submitButton);
 
     await waitFor(() => {
@@ -436,28 +463,36 @@ describe('Login', () => {
     });
   });
 
-  it('should validate empty email and password', async () => {
+  it("should validate empty email and password", async () => {
     render(
       <TestWrapper>
         <BrowserRouter>
           <Login />
         </BrowserRouter>
-      </TestWrapper>
+      </TestWrapper>,
     );
 
-    await waitFor(() => {
-      expect(document.getElementById('email')).toBeTruthy();
-    }, { timeout: 3000 });
+    await waitFor(
+      () => {
+        expect(document.getElementById("email")).toBeTruthy();
+      },
+      { timeout: 3000 },
+    );
 
     // Find the submit button
-    const submitButton = await waitFor(() => {
-      const buttons = screen.queryAllByRole('button');
-      const submitBtn = buttons.find(btn => btn.getAttribute('type') === 'submit');
-      if (!submitBtn) {
-        throw new Error('Submit button not found');
-      }
-      return submitBtn;
-    }, { timeout: 5000 });
+    const submitButton = await waitFor(
+      () => {
+        const buttons = screen.queryAllByRole("button");
+        const submitBtn = buttons.find(
+          (btn) => btn.getAttribute("type") === "submit",
+        );
+        if (!submitBtn) {
+          throw new Error("Submit button not found");
+        }
+        return submitBtn;
+      },
+      { timeout: 5000 },
+    );
 
     // Button should be disabled when email/password are empty
     expect(submitButton).toBeDisabled();
@@ -466,50 +501,54 @@ describe('Login', () => {
     expect(springAuth.signInWithPassword).not.toHaveBeenCalled();
   });
 
-  it('should display session expired message from URL param', () => {
+  it("should display session expired message from URL param", () => {
     render(
       <TestWrapper>
-        <MemoryRouter initialEntries={['/login?expired=true']}>
+        <MemoryRouter initialEntries={["/login?expired=true"]}>
           <Login />
         </MemoryRouter>
-      </TestWrapper>
+      </TestWrapper>,
     );
 
     expect(screen.getByText(/session.*expired/i)).toBeInTheDocument();
   });
 
-  it('should display account created success message', () => {
+  it("should display account created success message", () => {
     render(
       <TestWrapper>
-        <MemoryRouter initialEntries={['/login?messageType=accountCreated']}>
+        <MemoryRouter initialEntries={["/login?messageType=accountCreated"]}>
           <Login />
         </MemoryRouter>
-      </TestWrapper>
+      </TestWrapper>,
     );
 
     expect(screen.getByText(/account created/i)).toBeInTheDocument();
   });
 
-  it('should prefill email from query param', () => {
-    const email = 'prefilled@example.com';
+  it("should prefill email from query param", () => {
+    const email = "prefilled@example.com";
 
     render(
       <TestWrapper>
         <MemoryRouter initialEntries={[`/login?email=${email}`]}>
           <Login />
         </MemoryRouter>
-      </TestWrapper>
+      </TestWrapper>,
     );
 
     return waitFor(() => {
-      const emailInput = document.getElementById('email') as HTMLInputElement;
+      const emailInput = document.getElementById("email") as HTMLInputElement;
       expect(emailInput.value).toBe(email);
     });
   });
 
-  it('should redirect to home when login disabled', async () => {
+  it("should redirect to home when login disabled", async () => {
     mockBackendProbeState.loginDisabled = true;
-    mockProbe.mockResolvedValueOnce({ status: 'up', loginDisabled: true, loading: false });
+    mockProbe.mockResolvedValueOnce({
+      status: "up",
+      loginDisabled: true,
+      loading: false,
+    });
     vi.mocked(apiClient.get).mockResolvedValueOnce({
       data: {
         enableLogin: false,
@@ -522,20 +561,20 @@ describe('Login', () => {
         <BrowserRouter>
           <Login />
         </BrowserRouter>
-      </TestWrapper>
+      </TestWrapper>,
     );
 
     await waitFor(() => {
-      expect(mockNavigate).toHaveBeenCalledWith('/', { replace: true });
+      expect(mockNavigate).toHaveBeenCalledWith("/", { replace: true });
     });
   });
 
-  it('should handle OAuth provider click', async () => {
+  it("should handle OAuth provider click", async () => {
     vi.mocked(apiClient.get).mockResolvedValueOnce({
       data: {
         enableLogin: true,
         providerList: {
-          '/oauth2/authorization/github': 'GitHub',
+          "/oauth2/authorization/github": "GitHub",
         },
       },
     });
@@ -549,7 +588,7 @@ describe('Login', () => {
         <BrowserRouter>
           <Login />
         </BrowserRouter>
-      </TestWrapper>
+      </TestWrapper>,
     );
 
     await waitFor(() => {
@@ -564,7 +603,7 @@ describe('Login', () => {
     expect(springAuth.signInWithOAuth).toBeDefined();
   });
 
-  it('should show email form by default when no SSO providers', async () => {
+  it("should show email form by default when no SSO providers", async () => {
     vi.mocked(apiClient.get).mockResolvedValueOnce({
       data: {
         enableLogin: true,
@@ -577,16 +616,16 @@ describe('Login', () => {
         <BrowserRouter>
           <Login />
         </BrowserRouter>
-      </TestWrapper>
+      </TestWrapper>,
     );
 
     await waitFor(() => {
-      expect(document.getElementById('email')).toBeInTheDocument();
-      expect(document.getElementById('password')).toBeInTheDocument();
+      expect(document.getElementById("email")).toBeInTheDocument();
+      expect(document.getElementById("password")).toBeInTheDocument();
     });
   });
 
-  it('should disable submit button while signing in', async () => {
+  it("should disable submit button while signing in", async () => {
     const user = userEvent.setup();
 
     vi.mocked(springAuth.signInWithPassword).mockImplementationOnce(
@@ -597,11 +636,11 @@ describe('Login', () => {
               resolve({
                 user: null,
                 session: null,
-                error: { message: 'Error' },
+                error: { message: "Error" },
               }),
-            100
-          )
-        )
+            100,
+          ),
+        ),
     );
 
     render(
@@ -609,30 +648,40 @@ describe('Login', () => {
         <BrowserRouter>
           <Login />
         </BrowserRouter>
-      </TestWrapper>
+      </TestWrapper>,
     );
 
-    await waitFor(() => {
-      const emailInput = document.getElementById('email');
-      const passwordInput = document.getElementById('password');
-      expect(emailInput).toBeTruthy();
-      expect(passwordInput).toBeTruthy();
-    }, { timeout: 3000 });
+    await waitFor(
+      () => {
+        const emailInput = document.getElementById("email");
+        const passwordInput = document.getElementById("password");
+        expect(emailInput).toBeTruthy();
+        expect(passwordInput).toBeTruthy();
+      },
+      { timeout: 3000 },
+    );
 
-    const emailInput = document.getElementById('email') as HTMLInputElement;
-    const passwordInput = document.getElementById('password') as HTMLInputElement;
+    const emailInput = document.getElementById("email") as HTMLInputElement;
+    const passwordInput = document.getElementById(
+      "password",
+    ) as HTMLInputElement;
 
-    await user.type(emailInput, 'test@example.com');
-    await user.type(passwordInput, 'password123');
+    await user.type(emailInput, "test@example.com");
+    await user.type(passwordInput, "password123");
 
-    const submitButton = await waitFor(() => {
-      const buttons = screen.queryAllByRole('button');
-      const submitBtn = buttons.find(btn => btn.getAttribute('type') === 'submit');
-      if (!submitBtn) {
-        throw new Error('Submit button not found');
-      }
-      return submitBtn;
-    }, { timeout: 5000 });
+    const submitButton = await waitFor(
+      () => {
+        const buttons = screen.queryAllByRole("button");
+        const submitBtn = buttons.find(
+          (btn) => btn.getAttribute("type") === "submit",
+        );
+        if (!submitBtn) {
+          throw new Error("Submit button not found");
+        }
+        return submitBtn;
+      },
+      { timeout: 5000 },
+    );
     await user.click(submitButton);
 
     // Button should be disabled while signing in
diff --git a/frontend/src/proprietary/routes/Login.tsx b/frontend/src/proprietary/routes/Login.tsx
index cd0461d1f1..c49016212d 100644
--- a/frontend/src/proprietary/routes/Login.tsx
+++ b/frontend/src/proprietary/routes/Login.tsx
@@ -1,25 +1,33 @@
-import { useEffect, useMemo, useRef, useState } from 'react';
-import { Navigate, useLocation, useNavigate, useSearchParams } from 'react-router-dom';
-import { Text, Stack, Alert } from '@mantine/core';
-import { springAuth } from '@app/auth/springAuthClient';
-import { useAuth } from '@app/auth/UseSession';
-import { useAppConfig } from '@app/contexts/AppConfigContext';
-import { useTranslation } from 'react-i18next';
-import { useDocumentMeta } from '@app/hooks/useDocumentMeta';
-import AuthLayout from '@app/routes/authShared/AuthLayout';
-import { useBackendProbe } from '@app/hooks/useBackendProbe';
-import apiClient from '@app/services/apiClient';
-import { BASE_PATH } from '@app/constants/app';
-import { type OAuthProvider } from '@app/auth/oauthTypes';
-import { updateSupportedLanguages } from '@app/i18n';
+import { useEffect, useMemo, useRef, useState } from "react";
+import {
+  Navigate,
+  useLocation,
+  useNavigate,
+  useSearchParams,
+} from "react-router-dom";
+import { Text, Stack, Alert } from "@mantine/core";
+import { springAuth } from "@app/auth/springAuthClient";
+import { useAuth } from "@app/auth/UseSession";
+import { useAppConfig } from "@app/contexts/AppConfigContext";
+import { useTranslation } from "react-i18next";
+import { useDocumentMeta } from "@app/hooks/useDocumentMeta";
+import AuthLayout from "@app/routes/authShared/AuthLayout";
+import { useBackendProbe } from "@app/hooks/useBackendProbe";
+import apiClient from "@app/services/apiClient";
+import { BASE_PATH } from "@app/constants/app";
+import { type OAuthProvider } from "@app/auth/oauthTypes";
+import { updateSupportedLanguages } from "@app/i18n";
 
 // Import login components
-import LoginHeader from '@app/routes/login/LoginHeader';
-import ErrorMessage from '@app/routes/login/ErrorMessage';
-import EmailPasswordForm from '@app/routes/login/EmailPasswordForm';
-import OAuthButtons, { DEBUG_SHOW_ALL_PROVIDERS, oauthProviderConfig } from '@app/routes/login/OAuthButtons';
-import DividerWithText from '@app/components/shared/DividerWithText';
-import LoggedInState from '@app/routes/login/LoggedInState';
+import LoginHeader from "@app/routes/login/LoginHeader";
+import ErrorMessage from "@app/routes/login/ErrorMessage";
+import EmailPasswordForm from "@app/routes/login/EmailPasswordForm";
+import OAuthButtons, {
+  DEBUG_SHOW_ALL_PROVIDERS,
+  oauthProviderConfig,
+} from "@app/routes/login/OAuthButtons";
+import DividerWithText from "@app/components/shared/DividerWithText";
+import LoggedInState from "@app/routes/login/LoggedInState";
 
 export default function Login() {
   const navigate = useNavigate();
@@ -32,33 +40,34 @@ export default function Login() {
   const [error, setError] = useState<string | null>(null);
   const [successMessage, setSuccessMessage] = useState<string | null>(null);
   const [showEmailForm, setShowEmailForm] = useState(false);
-  const [email, setEmail] = useState(() => searchParams.get('email') ?? '');
-  const [password, setPassword] = useState('');
-  const [mfaCode, setMfaCode] = useState('');
+  const [email, setEmail] = useState(() => searchParams.get("email") ?? "");
+  const [password, setPassword] = useState("");
+  const [mfaCode, setMfaCode] = useState("");
   const [requiresMfa, setRequiresMfa] = useState(false);
   const [enabledProviders, setEnabledProviders] = useState<OAuthProvider[]>([]);
   const [hasSSOProviders, setHasSSOProviders] = useState(false);
   const [_enableLogin, setEnableLogin] = useState<boolean | null>(null);
-  const [loginMethod, setLoginMethod] = useState<string>('all');
+  const [loginMethod, setLoginMethod] = useState<string>("all");
   const [ssoAutoLogin, setSsoAutoLogin] = useState(false);
   const backendProbe = useBackendProbe();
   const [isFirstTimeSetup, setIsFirstTimeSetup] = useState(false);
   const [showDefaultCredentials, setShowDefaultCredentials] = useState(false);
-  const loginDisabled = backendProbe.loginDisabled === true || _enableLogin === false;
+  const loginDisabled =
+    backendProbe.loginDisabled === true || _enableLogin === false;
   const autoLoginAttempted = useRef(false);
   const autoLoginErrorRecorded = useRef(false);
-  const isUserPassAllowed = loginMethod === 'all' || loginMethod === 'normal';
-  const isSsoOnlyMode = loginMethod !== 'all' && loginMethod !== 'normal';
+  const isUserPassAllowed = loginMethod === "all" || loginMethod === "normal";
+  const isSsoOnlyMode = loginMethod !== "all" && loginMethod !== "normal";
   const isSingleSsoOnly = !isUserPassAllowed && enabledProviders.length === 1;
 
-  const AUTO_LOGIN_ATTEMPTS_KEY = 'stirling_sso_auto_login_attempts';
-  const AUTO_LOGIN_ERRORS_KEY = 'stirling_sso_auto_login_errors';
-  const AUTO_LOGIN_LOGOUT_KEY = 'stirling_sso_auto_login_logged_out';
+  const AUTO_LOGIN_ATTEMPTS_KEY = "stirling_sso_auto_login_attempts";
+  const AUTO_LOGIN_ERRORS_KEY = "stirling_sso_auto_login_errors";
+  const AUTO_LOGIN_LOGOUT_KEY = "stirling_sso_auto_login_logged_out";
   const MAX_AUTO_LOGIN_ATTEMPTS = 2;
   const MAX_AUTO_LOGIN_ERRORS = 1;
 
   const readSessionNumber = (key: string) => {
-    if (typeof window === 'undefined') {
+    if (typeof window === "undefined") {
       return 0;
     }
     const raw = window.sessionStorage.getItem(key);
@@ -67,21 +76,21 @@ export default function Login() {
   };
 
   const writeSessionNumber = (key: string, value: number) => {
-    if (typeof window === 'undefined') {
+    if (typeof window === "undefined") {
       return;
     }
     window.sessionStorage.setItem(key, String(value));
   };
 
   const hasLogoutBlock = () => {
-    if (typeof window === 'undefined') {
+    if (typeof window === "undefined") {
       return false;
     }
-    return window.sessionStorage.getItem(AUTO_LOGIN_LOGOUT_KEY) === '1';
+    return window.sessionStorage.getItem(AUTO_LOGIN_LOGOUT_KEY) === "1";
   };
 
   const clearLogoutBlock = () => {
-    if (typeof window === 'undefined') {
+    if (typeof window === "undefined") {
       return;
     }
     window.sessionStorage.removeItem(AUTO_LOGIN_LOGOUT_KEY);
@@ -102,7 +111,15 @@ export default function Login() {
     if (!searchParams) {
       return null;
     }
-    const errorParamKeys = ['error', 'error_description', 'error_code', 'sso_error', 'oauth_error', 'saml_error', 'login_error'];
+    const errorParamKeys = [
+      "error",
+      "error_description",
+      "error_code",
+      "sso_error",
+      "oauth_error",
+      "saml_error",
+      "login_error",
+    ];
     for (const key of errorParamKeys) {
       const value = searchParams.get(key);
       if (value) {
@@ -110,8 +127,8 @@ export default function Login() {
       }
     }
     for (const [key, value] of searchParams.entries()) {
-      if (key.toLowerCase().includes('error')) {
-        return value || 'Single sign-on failed. Please try again.';
+      if (key.toLowerCase().includes("error")) {
+        return value || "Single sign-on failed. Please try again.";
       }
     }
     return null;
@@ -121,15 +138,15 @@ export default function Login() {
 
   // Periodically probe while backend isn't up so the screen can auto-advance when it comes online
   useEffect(() => {
-    if (backendProbe.status === 'up' || backendProbe.loginDisabled) {
+    if (backendProbe.status === "up" || backendProbe.loginDisabled) {
       return;
     }
     const tick = async () => {
       const result = await backendProbe.probe();
-      if (result.status === 'up') {
+      if (result.status === "up") {
         await refetch();
         if (loginDisabled) {
-          navigate('/', { replace: true });
+          navigate("/", { replace: true });
         }
       }
     };
@@ -137,14 +154,25 @@ export default function Login() {
       void tick();
     }, 5000);
     return () => window.clearInterval(intervalId);
-  }, [backendProbe.status, backendProbe.loginDisabled, backendProbe.probe, refetch, navigate, loginDisabled]);
+  }, [
+    backendProbe.status,
+    backendProbe.loginDisabled,
+    backendProbe.probe,
+    refetch,
+    navigate,
+    loginDisabled,
+  ]);
 
   // Redirect immediately if user has valid session (JWT already validated by AuthProvider)
   useEffect(() => {
     if (!loading && session) {
-      const returnPath = (location.state as { from?: { pathname?: string } } | null)?.from?.pathname;
-      console.debug('[Login] User already authenticated, redirecting to home', { returnPath });
-      navigate(returnPath || '/', { replace: true });
+      const returnPath = (
+        location.state as { from?: { pathname?: string } } | null
+      )?.from?.pathname;
+      console.debug("[Login] User already authenticated, redirecting to home", {
+        returnPath,
+      });
+      navigate(returnPath || "/", { replace: true });
     }
   }, [session, loading, navigate, location.state]);
 
@@ -152,13 +180,13 @@ export default function Login() {
   useEffect(() => {
     if (backendProbe.loginDisabled) {
       // Slight delay to allow state updates before redirecting
-      const id = setTimeout(() => navigate('/', { replace: true }), 0);
+      const id = setTimeout(() => navigate("/", { replace: true }), 0);
       return () => clearTimeout(id);
     }
   }, [backendProbe.loginDisabled, navigate]);
 
   useEffect(() => {
-    if (backendProbe.status === 'up') {
+    if (backendProbe.status === "up") {
       void refetch();
     }
   }, [backendProbe.status, refetch]);
@@ -167,13 +195,15 @@ export default function Login() {
   useEffect(() => {
     const fetchProviders = async () => {
       try {
-        const response = await apiClient.get('/api/v1/proprietary/ui-data/login');
+        const response = await apiClient.get(
+          "/api/v1/proprietary/ui-data/login",
+        );
         const data = response.data;
 
         // Check if login is disabled - if so, redirect to home
         if (data.enableLogin === false) {
-          console.debug('[Login] Login disabled, redirecting to home');
-          navigate('/');
+          console.debug("[Login] Login disabled, redirecting to home");
+          navigate("/");
           return;
         }
 
@@ -195,18 +225,18 @@ export default function Login() {
         const providerPaths = Object.keys(data.providerList || {});
 
         setEnabledProviders(providerPaths);
-        setLoginMethod(data.loginMethod || 'all');
+        setLoginMethod(data.loginMethod || "all");
       } catch (err) {
-        console.error('[Login] Failed to fetch enabled providers:', err);
+        console.error("[Login] Failed to fetch enabled providers:", err);
         // Set default values on error to ensure UI remains functional
         // Login method defaults to 'all' to show both SSO and email/password options
         setEnableLogin(true);
-        setLoginMethod('all');
+        setLoginMethod("all");
         setEnabledProviders([]);
       }
     };
 
-    if (backendProbe.status === 'up' || backendProbe.loginDisabled) {
+    if (backendProbe.status === "up" || backendProbe.loginDisabled) {
       fetchProviders();
     }
   }, [navigate, backendProbe.status, backendProbe.loginDisabled]);
@@ -220,7 +250,7 @@ export default function Login() {
     setHasSSOProviders(hasProviders);
 
     // Check if username/password authentication is allowed
-    const isUserPassAllowed = loginMethod === 'all' || loginMethod === 'normal';
+    const isUserPassAllowed = loginMethod === "all" || loginMethod === "normal";
 
     // Show email form if no SSO providers exist AND username/password is allowed
     if (!hasProviders && isUserPassAllowed) {
@@ -243,16 +273,23 @@ export default function Login() {
       // The backend returns the correct registration ID (e.g., 'authentik', 'oidc', 'keycloak')
       const { error } = await springAuth.signInWithOAuth({
         provider: provider,
-        options: { redirectTo: `${BASE_PATH}/auth/callback` }
+        options: { redirectTo: `${BASE_PATH}/auth/callback` },
       });
 
       if (error) {
         console.error(`[Login] ${provider} error:`, error);
-        setError(t('login.failedToSignIn', { provider, message: error.message }) || `Failed to sign in with ${provider}`);
+        setError(
+          t("login.failedToSignIn", { provider, message: error.message }) ||
+            `Failed to sign in with ${provider}`,
+        );
       }
     } catch (err) {
       console.error(`[Login] Unexpected error:`, err);
-      setError(t('login.unexpectedError', { message: err instanceof Error ? err.message : 'Unknown error' }) || 'An unexpected error occurred');
+      setError(
+        t("login.unexpectedError", {
+          message: err instanceof Error ? err.message : "Unknown error",
+        }) || "An unexpected error occurred",
+      );
     } finally {
       setIsSigningIn(false);
     }
@@ -270,11 +307,22 @@ export default function Login() {
     const blockedByAttempts = attempts >= MAX_AUTO_LOGIN_ATTEMPTS;
     const blockedByLogout = hasLogoutBlock();
 
-    if (!ssoAutoLogin || loginDisabled || loading || session || backendProbe.status !== 'up') {
+    if (
+      !ssoAutoLogin ||
+      loginDisabled ||
+      loading ||
+      session ||
+      backendProbe.status !== "up"
+    ) {
       return;
     }
 
-    if (hasSsoLoginError || blockedByErrors || blockedByAttempts || blockedByLogout) {
+    if (
+      hasSsoLoginError ||
+      blockedByErrors ||
+      blockedByAttempts ||
+      blockedByLogout
+    ) {
       return;
     }
 
@@ -304,29 +352,49 @@ export default function Login() {
   // Handle query params (email prefill, success messages, and session expiry)
   useEffect(() => {
     try {
-      const emailFromQuery = searchParams.get('email');
+      const emailFromQuery = searchParams.get("email");
       if (emailFromQuery) {
         setEmail(emailFromQuery);
       }
 
       // Check if session expired (401 redirect)
-      const expired = searchParams.get('expired');
-      if (expired === 'true') {
-        setError(t('login.sessionExpired', 'Your session has expired. Please sign in again.'));
+      const expired = searchParams.get("expired");
+      if (expired === "true") {
+        setError(
+          t(
+            "login.sessionExpired",
+            "Your session has expired. Please sign in again.",
+          ),
+        );
       }
 
-      const messageType = searchParams.get('messageType')
+      const messageType = searchParams.get("messageType");
       if (messageType) {
         switch (messageType) {
-          case 'accountCreated':
-            setSuccessMessage(t('login.accountCreatedSuccess', 'Account created successfully! You can now sign in.'))
-            break
-          case 'passwordChanged':
-            setSuccessMessage(t('login.passwordChangedSuccess', 'Password changed successfully! Please sign in with your new password.'))
-            break
-          case 'credsUpdated':
-            setSuccessMessage(t('login.credentialsUpdated', 'Your credentials have been updated. Please sign in again.'))
-            break
+          case "accountCreated":
+            setSuccessMessage(
+              t(
+                "login.accountCreatedSuccess",
+                "Account created successfully! You can now sign in.",
+              ),
+            );
+            break;
+          case "passwordChanged":
+            setSuccessMessage(
+              t(
+                "login.passwordChangedSuccess",
+                "Password changed successfully! Please sign in with your new password.",
+              ),
+            );
+            break;
+          case "credsUpdated":
+            setSuccessMessage(
+              t(
+                "login.credentialsUpdated",
+                "Your credentials have been updated. Please sign in again.",
+              ),
+            );
+            break;
         }
       }
 
@@ -349,12 +417,18 @@ export default function Login() {
 
   // Set document meta
   useDocumentMeta({
-    title: `${t('login.title', 'Sign in')} - Stirling PDF`,
-    description: t('app.description', 'The Free Adobe Acrobat alternative (10M+ Downloads)'),
-    ogTitle: `${t('login.title', 'Sign in')} - Stirling PDF`,
-    ogDescription: t('app.description', 'The Free Adobe Acrobat alternative (10M+ Downloads)'),
+    title: `${t("login.title", "Sign in")} - Stirling PDF`,
+    description: t(
+      "app.description",
+      "The Free Adobe Acrobat alternative (10M+ Downloads)",
+    ),
+    ogTitle: `${t("login.title", "Sign in")} - Stirling PDF`,
+    ogDescription: t(
+      "app.description",
+      "The Free Adobe Acrobat alternative (10M+ Downloads)",
+    ),
     ogImage: `${baseUrl}/og_images/home.png`,
-    ogUrl: `${window.location.origin}${window.location.pathname}`
+    ogUrl: `${window.location.origin}${window.location.pathname}`,
   });
 
   // If login is disabled, short-circuit to home (avoids rendering the form after retry)
@@ -368,13 +442,13 @@ export default function Login() {
   }
 
   // If backend isn't ready yet, show a lightweight status screen instead of the form
-  if (backendProbe.status !== 'up' && !loginDisabled) {
-    const backendTitle = t('backendStartup.notFoundTitle', 'Backend not found');
+  if (backendProbe.status !== "up" && !loginDisabled) {
+    const backendTitle = t("backendStartup.notFoundTitle", "Backend not found");
     const handleRetry = async () => {
       const result = await backendProbe.probe();
-      if (result.status === 'up') {
+      if (result.status === "up") {
         await refetch();
-        navigate('/', { replace: true });
+        navigate("/", { replace: true });
       }
     };
     return (
@@ -383,23 +457,25 @@ export default function Login() {
         <div
           className="auth-section"
           style={{
-            padding: '1.5rem',
-            marginTop: '1rem',
-            borderRadius: '0.75rem',
-            backgroundColor: 'rgba(37, 99, 235, 0.08)',
-            border: '1px solid rgba(37, 99, 235, 0.2)',
+            padding: "1.5rem",
+            marginTop: "1rem",
+            borderRadius: "0.75rem",
+            backgroundColor: "rgba(37, 99, 235, 0.08)",
+            border: "1px solid rgba(37, 99, 235, 0.2)",
           }}
         >
-          <p style={{ margin: '0 0 0.75rem 0', color: 'rgba(15, 23, 42, 0.8)' }}>
-            {t('backendStartup.unreachable')}
+          <p
+            style={{ margin: "0 0 0.75rem 0", color: "rgba(15, 23, 42, 0.8)" }}
+          >
+            {t("backendStartup.unreachable")}
           </p>
           <button
             type="button"
             onClick={handleRetry}
             className="auth-cta-button px-4 py-[0.75rem] rounded-[0.625rem] text-base font-semibold mt-5 border-0 cursor-pointer"
-            style={{ width: 'fit-content' }}
+            style={{ width: "fit-content" }}
           >
-            {t('backendStartup.retry', 'Retry')}
+            {t("backendStartup.retry", "Retry")}
           </button>
         </div>
       </AuthLayout>
@@ -408,12 +484,14 @@ export default function Login() {
 
   const signInWithEmail = async () => {
     if (!email || !password) {
-      setError(t('login.pleaseEnterBoth') || 'Please enter both email and password');
+      setError(
+        t("login.pleaseEnterBoth") || "Please enter both email and password",
+      );
       return;
     }
 
     if (requiresMfa && !mfaCode.trim()) {
-      setError(t('login.mfaRequired', 'Two-factor code required'));
+      setError(t("login.mfaRequired", "Two-factor code required"));
       return;
     }
 
@@ -422,7 +500,7 @@ export default function Login() {
       setError(null);
       clearLogoutBlock();
 
-      console.log('[Login] Signing in with email:', email);
+      console.log("[Login] Signing in with email:", email);
 
       const { user, session, error } = await springAuth.signInWithPassword({
         email: email.trim(),
@@ -431,22 +509,26 @@ export default function Login() {
       });
 
       if (error) {
-        console.error('[Login] Email sign in error:', error);
+        console.error("[Login] Email sign in error:", error);
         setError(error.message);
-        if (error.mfaRequired || error.code === 'invalid_mfa_code') {
+        if (error.mfaRequired || error.code === "invalid_mfa_code") {
           setRequiresMfa(true);
         }
       } else if (user && session) {
-        console.log('[Login] Email sign in successful');
+        console.log("[Login] Email sign in successful");
         clearLogoutBlock();
         setRequiresMfa(false);
-        setMfaCode('');
+        setMfaCode("");
         // Auth state will update automatically and Landing will redirect to home
         // No need to navigate manually here
       }
     } catch (err) {
-      console.error('[Login] Unexpected error:', err);
-      setError(t('login.unexpectedError', { message: err instanceof Error ? err.message : 'Unknown error' }) || 'An unexpected error occurred');
+      console.error("[Login] Unexpected error:", err);
+      setError(
+        t("login.unexpectedError", {
+          message: err instanceof Error ? err.message : "Unknown error",
+        }) || "An unexpected error occurred",
+      );
     } finally {
       setIsSigningIn(false);
     }
@@ -460,21 +542,23 @@ export default function Login() {
   return (
     <AuthLayout>
       <LoginHeader
-        title={isSingleSsoOnly ? '' : (t('login.login') || 'Sign in')}
+        title={isSingleSsoOnly ? "" : t("login.login") || "Sign in"}
         centerOnly={isSingleSsoOnly}
       />
 
       {/* Success message */}
       {successMessage && (
-        <div style={{
-          padding: '1rem',
-          marginBottom: '1rem',
-          backgroundColor: 'rgba(34, 197, 94, 0.1)',
-          border: '1px solid rgba(34, 197, 94, 0.3)',
-          borderRadius: '0.5rem',
-          color: '#16a34a'
-        }}>
-          <p style={{ margin: 0, fontSize: '0.875rem', textAlign: 'center' }}>
+        <div
+          style={{
+            padding: "1rem",
+            marginBottom: "1rem",
+            backgroundColor: "rgba(34, 197, 94, 0.1)",
+            border: "1px solid rgba(34, 197, 94, 0.3)",
+            borderRadius: "0.5rem",
+            color: "#16a34a",
+          }}
+        >
+          <p style={{ margin: 0, fontSize: "0.875rem", textAlign: "center" }}>
             {successMessage}
           </p>
         </div>
@@ -488,14 +572,20 @@ export default function Login() {
         isSubmitting={isSigningIn}
         layout="vertical"
         enabledProviders={enabledProviders}
-        ctaPrefix={isSsoOnlyMode ? t('login.signInWith', 'Sign in with') : undefined}
+        ctaPrefix={
+          isSsoOnlyMode ? t("login.signInWith", "Sign in with") : undefined
+        }
         styleVariant="light"
         useNewStyle={isSsoOnlyMode}
       />
 
       {/* Divider between OAuth and Email - only show if SSO is available and username/password is allowed */}
       {hasSSOProviders && isUserPassAllowed && (
-        <DividerWithText text={t('signup.or', 'or')} respondsToDarkMode={false} opacity={0.4} />
+        <DividerWithText
+          text={t("signup.or", "or")}
+          respondsToDarkMode={false}
+          opacity={0.4}
+        />
       )}
 
       {/* Sign in with email button - only show if SSO providers exist and username/password is allowed */}
@@ -507,14 +597,14 @@ export default function Login() {
             disabled={isSigningIn}
             className="w-full px-4 py-[0.75rem] rounded-[0.625rem] text-base font-semibold mb-2 cursor-pointer border-0 disabled:opacity-50 disabled:cursor-not-allowed auth-cta-button"
           >
-            {t('login.useEmailInstead', 'Login with email')}
+            {t("login.useEmailInstead", "Login with email")}
           </button>
         </div>
       )}
 
       {/* Email form - show by default if no SSO, or when button clicked, but ONLY if username/password is allowed */}
       {showEmailForm && isUserPassAllowed && (
-        <div style={{ marginTop: hasSSOProviders ? '1rem' : '0' }}>
+        <div style={{ marginTop: hasSSOProviders ? "1rem" : "0" }}>
           <EmailPasswordForm
             email={email}
             password={password}
@@ -526,36 +616,69 @@ export default function Login() {
             requiresMfa={requiresMfa}
             onSubmit={signInWithEmail}
             isSubmitting={isSigningIn}
-            submitButtonText={isSigningIn ? (t('login.loggingIn') || 'Signing in...') : (t('login.login') || 'Sign in')}
+            submitButtonText={
+              isSigningIn
+                ? t("login.loggingIn") || "Signing in..."
+                : t("login.login") || "Sign in"
+            }
           />
         </div>
       )}
 
       {/* Help section - only show on first-time setup with default credentials and username/password auth allowed */}
       {isFirstTimeSetup && showDefaultCredentials && isUserPassAllowed && (
-        <Alert
-          color="blue"
-          variant="light"
-          radius="md"
-          mt="xl"
-        >
+        <Alert color="blue" variant="light" radius="md" mt="xl">
           <Stack gap="xs" align="center">
-            <Text size="sm" fw={600} ta="center" style={{ color: 'var(--text-always-dark)' }}>
-              {t('login.defaultCredentials', 'Default Login Credentials')}
+            <Text
+              size="sm"
+              fw={600}
+              ta="center"
+              style={{ color: "var(--text-always-dark)" }}
+            >
+              {t("login.defaultCredentials", "Default Login Credentials")}
             </Text>
-            <Text size="sm" ta="center" style={{ color: 'var(--text-always-dark)' }}>
-              <Text component="span" fw={600} style={{ color: 'var(--text-always-dark)' }}>{t('login.username', 'Username')}:</Text> admin
+            <Text
+              size="sm"
+              ta="center"
+              style={{ color: "var(--text-always-dark)" }}
+            >
+              <Text
+                component="span"
+                fw={600}
+                style={{ color: "var(--text-always-dark)" }}
+              >
+                {t("login.username", "Username")}:
+              </Text>{" "}
+              admin
             </Text>
-            <Text size="sm" ta="center" style={{ color: 'var(--text-always-dark)' }}>
-              <Text component="span" fw={600} style={{ color: 'var(--text-always-dark)' }}>{t('login.password', 'Password')}:</Text> stirling
+            <Text
+              size="sm"
+              ta="center"
+              style={{ color: "var(--text-always-dark)" }}
+            >
+              <Text
+                component="span"
+                fw={600}
+                style={{ color: "var(--text-always-dark)" }}
+              >
+                {t("login.password", "Password")}:
+              </Text>{" "}
+              stirling
             </Text>
-            <Text size="xs" ta="center" mt="xs" style={{ color: 'var(--text-always-dark-muted)' }}>
-              {t('login.changePasswordWarning', 'Please change your password after logging in for the first time')}
+            <Text
+              size="xs"
+              ta="center"
+              mt="xs"
+              style={{ color: "var(--text-always-dark-muted)" }}
+            >
+              {t(
+                "login.changePasswordWarning",
+                "Please change your password after logging in for the first time",
+              )}
             </Text>
           </Stack>
         </Alert>
       )}
-
     </AuthLayout>
   );
 }
diff --git a/frontend/src/proprietary/routes/ShareLinkLoader.tsx b/frontend/src/proprietary/routes/ShareLinkLoader.tsx
index 54bfbd812f..827161d00c 100644
--- a/frontend/src/proprietary/routes/ShareLinkLoader.tsx
+++ b/frontend/src/proprietary/routes/ShareLinkLoader.tsx
@@ -1,20 +1,21 @@
-import { useEffect, useMemo, useRef } from 'react';
-import { useNavigate } from 'react-router-dom';
-import { useTranslation } from 'react-i18next';
-import apiClient from '@app/services/apiClient';
-import { useAuth } from '@app/auth/UseSession';
-import { useFileActions } from '@app/contexts/FileContext';
-import { useNavigationActions } from '@app/contexts/NavigationContext';
-import { alert } from '@app/components/toast';
-import type { StirlingFile } from '@app/types/fileContext';
-import type { FileId } from '@app/types/file';
-import { fileStorage } from '@app/services/fileStorage';
+import { useEffect, useMemo, useRef } from "react";
+import { isAxiosError } from "axios";
+import { useNavigate } from "react-router-dom";
+import { useTranslation } from "react-i18next";
+import apiClient from "@app/services/apiClient";
+import { useAuth } from "@app/auth/UseSession";
+import { useFileActions } from "@app/contexts/FileContext";
+import { useNavigationActions } from "@app/contexts/NavigationContext";
+import { alert } from "@app/components/toast";
+import type { StirlingFile } from "@app/types/fileContext";
+import type { FileId } from "@app/types/file";
+import { fileStorage } from "@app/services/fileStorage";
 import {
   getShareBundleEntryRootId,
   isZipBundle,
   loadShareBundleEntries,
   parseContentDispositionFilename,
-} from '@app/services/shareBundleUtils';
+} from "@app/services/shareBundleUtils";
 
 interface ShareLinkLoaderProps {
   token: string;
@@ -59,29 +60,36 @@ export default function ShareLinkLoader({ token }: ShareLinkLoaderProps) {
         try {
           const metadataResponse = await apiClient.get<ShareLinkMetadata>(
             `/api/v1/storage/share-links/${normalizedToken}/metadata`,
-            { suppressErrorToast: true, skipAuthRedirect: true, signal }
+            { suppressErrorToast: true, skipAuthRedirect: true, signal },
           );
           shareMetadata = metadataResponse.data;
         } catch {
           shareMetadata = null;
         }
 
-        const response = await apiClient.get(`/api/v1/storage/share-links/${normalizedToken}`, {
-          responseType: 'blob',
-          suppressErrorToast: true,
-          skipAuthRedirect: true,
-          signal,
-        });
+        const response = await apiClient.get(
+          `/api/v1/storage/share-links/${normalizedToken}`,
+          {
+            responseType: "blob",
+            suppressErrorToast: true,
+            skipAuthRedirect: true,
+            signal,
+          },
+        );
         if (signal.aborted) return;
 
         const contentType =
-          (response.headers && (response.headers['content-type'] || response.headers['Content-Type'])) ||
-          '';
+          (response.headers &&
+            (response.headers["content-type"] ||
+              response.headers["Content-Type"])) ||
+          "";
         const disposition =
           (response.headers &&
-            (response.headers['content-disposition'] || response.headers['Content-Disposition'])) ||
-          '';
-        const filename = parseContentDispositionFilename(disposition) || 'shared-file';
+            (response.headers["content-disposition"] ||
+              response.headers["Content-Disposition"])) ||
+          "";
+        const filename =
+          parseContentDispositionFilename(disposition) || "shared-file";
         const blob = response.data as Blob;
         const contentTypeValue = contentType || blob.type;
 
@@ -99,7 +107,7 @@ export default function ShareLinkLoader({ token }: ShareLinkLoaderProps) {
 
             const idMap = new Map<string, FileId>();
             for (let i = 0; i < stirlingFiles.length; i += 1) {
-              idMap.set(sortedEntries[i].logicalId, stirlingFiles[i].fileId as FileId);
+              idMap.set(sortedEntries[i].logicalId, stirlingFiles[i].fileId);
             }
 
             const rootIdMap = new Map<string, FileId>();
@@ -150,7 +158,8 @@ export default function ShareLinkLoader({ token }: ShareLinkLoaderProps) {
             const selectedIds: FileId[] = [];
             for (const rootId of rootOrder) {
               const rootEntries = sortedEntries.filter(
-                (entry) => getShareBundleEntryRootId(manifest, entry) === rootId
+                (entry) =>
+                  getShareBundleEntryRootId(manifest, entry) === rootId,
               );
               const latestEntry = rootEntries[rootEntries.length - 1];
               if (!latestEntry) {
@@ -165,13 +174,15 @@ export default function ShareLinkLoader({ token }: ShareLinkLoaderProps) {
               actions.setSelectedFiles(selectedIds);
             }
 
-            navActions.setWorkbench('viewer');
-            navigate('/', { replace: true });
+            navActions.setWorkbench("viewer");
+            navigate("/", { replace: true });
             return;
           }
         }
 
-        const file = new File([blob], filename, { type: contentTypeValue || blob.type });
+        const file = new File([blob], filename, {
+          type: contentTypeValue || blob.type,
+        });
         const stirlingFiles = await actions.addFilesWithOptions([file], {
           selectFiles: true,
           autoUnzip: false,
@@ -180,64 +191,69 @@ export default function ShareLinkLoader({ token }: ShareLinkLoaderProps) {
         if (signal.aborted) return;
 
         if (stirlingFiles.length > 0) {
-          const ids = stirlingFiles.map((stirlingFile: StirlingFile) => stirlingFile.fileId);
+          const ids = stirlingFiles.map(
+            (stirlingFile: StirlingFile) => stirlingFile.fileId,
+          );
           actions.setSelectedFiles(ids);
-        const sharedUpdates = {
-          remoteStorageId: shareMetadata?.fileId,
-          remoteOwnerUsername: shareMetadata?.owner ?? undefined,
-          remoteOwnedByCurrentUser: false,
-          remoteAccessRole: shareMetadata?.accessRole ?? undefined,
-          remoteSharedViaLink: true,
-          remoteHasShareLinks: false,
-          remoteShareToken: shareMetadata?.shareToken || normalizedToken,
-        };
+          const sharedUpdates = {
+            remoteStorageId: shareMetadata?.fileId,
+            remoteOwnerUsername: shareMetadata?.owner ?? undefined,
+            remoteOwnedByCurrentUser: false,
+            remoteAccessRole: shareMetadata?.accessRole ?? undefined,
+            remoteSharedViaLink: true,
+            remoteHasShareLinks: false,
+            remoteShareToken: shareMetadata?.shareToken || normalizedToken,
+          };
           for (const fileId of ids) {
             actions.updateStirlingFileStub(fileId, sharedUpdates);
             await fileStorage.updateFileMetadata(fileId, sharedUpdates);
           }
         }
 
-        navActions.setWorkbench('viewer');
-        navigate('/', { replace: true });
-      } catch (error: any) {
+        navActions.setWorkbench("viewer");
+        navigate("/", { replace: true });
+      } catch (error: unknown) {
         if (signal.aborted) return;
-        const status = error?.response?.status;
+        const status = isAxiosError(error) ? error.response?.status : undefined;
         if (status === 401 || status === 403) {
           if (!isAuthenticated && !authLoading) {
             alert({
-              alertType: 'warning',
-              title: t('storageShare.requiresLogin', 'This shared file requires login.'),
+              alertType: "warning",
+              title: t(
+                "storageShare.requiresLogin",
+                "This shared file requires login.",
+              ),
               expandable: false,
               durationMs: 4000,
             });
-            navigate('/login', {
+            navigate("/login", {
               replace: true,
               state: { from: { pathname: `/share/${normalizedToken}` } },
             });
             return;
           }
           alert({
-            alertType: 'warning',
+            alertType: "warning",
             title: t(
-              'storageShare.accessDenied',
-              'You do not have access to this shared file. Ask the owner to share it with you.'
+              "storageShare.accessDenied",
+              "You do not have access to this shared file. Ask the owner to share it with you.",
             ),
             expandable: false,
             durationMs: 4500,
           });
-          navigate('/', { replace: true });
+          navigate("/", { replace: true });
         } else if (status === 404 || status === 410) {
           alert({
-            alertType: 'error',
-            title: t('storageShare.expiredTitle', 'Link expired'),
+            alertType: "error",
+            title: t("storageShare.expiredTitle", "Link expired"),
             expandable: false,
             durationMs: 4000,
           });
-          navigate('/', { replace: true });
+          navigate("/", { replace: true });
         } else {
           alert({
-            alertType: 'error',
-            title: t('storageShare.loadFailed', 'Unable to open shared file.'),
+            alertType: "error",
+            title: t("storageShare.loadFailed", "Unable to open shared file."),
             expandable: false,
             durationMs: 4000,
           });
@@ -250,7 +266,15 @@ export default function ShareLinkLoader({ token }: ShareLinkLoaderProps) {
     return () => {
       abortController.abort();
     };
-  }, [normalizedToken, actions, navActions, navigate, t, isAuthenticated, authLoading]);
+  }, [
+    normalizedToken,
+    actions,
+    navActions,
+    navigate,
+    t,
+    isAuthenticated,
+    authLoading,
+  ]);
 
   return null;
 }
diff --git a/frontend/src/proprietary/routes/ShareLinkPage.tsx b/frontend/src/proprietary/routes/ShareLinkPage.tsx
index 04f1060aeb..915ec3c07d 100644
--- a/frontend/src/proprietary/routes/ShareLinkPage.tsx
+++ b/frontend/src/proprietary/routes/ShareLinkPage.tsx
@@ -1,22 +1,39 @@
-import { useCallback, useEffect, useMemo, useState } from 'react';
-import { useNavigate, useParams } from 'react-router-dom';
-import { Alert, Badge, Button, Group, Loader, Paper, Stack, Text, Title } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import DownloadIcon from '@mui/icons-material/Download';
-import LoginIcon from '@mui/icons-material/Login';
-import OpenInNewIcon from '@mui/icons-material/OpenInNew';
+import { useCallback, useEffect, useMemo, useState } from "react";
+import { isAxiosError } from "axios";
+import { useNavigate, useParams } from "react-router-dom";
+import {
+  Alert,
+  Badge,
+  Button,
+  Group,
+  Loader,
+  Paper,
+  Stack,
+  Text,
+  Title,
+} from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import DownloadIcon from "@mui/icons-material/Download";
+import LoginIcon from "@mui/icons-material/Login";
+import OpenInNewIcon from "@mui/icons-material/OpenInNew";
 
-import { useFileActions } from '@app/contexts/FileContext';
-import { useNavigationActions } from '@app/contexts/NavigationContext';
-import { alert } from '@app/components/toast';
+import { useFileActions } from "@app/contexts/FileContext";
+import { useNavigationActions } from "@app/contexts/NavigationContext";
+import { alert } from "@app/components/toast";
 import {
   downloadShareLink,
   fetchShareLinkMetadata,
   importShareLinkToWorkbench,
   ShareLinkMetadata,
-} from '@app/services/shareLinkImport';
+} from "@app/services/shareLinkImport";
 
-type ShareLinkStatus = 'loading' | 'ready' | 'login' | 'forbidden' | 'notfound' | 'error';
+type ShareLinkStatus =
+  | "loading"
+  | "ready"
+  | "login"
+  | "forbidden"
+  | "notfound"
+  | "error";
 
 export default function ShareLinkPage() {
   const { token } = useParams<{ token: string }>();
@@ -24,37 +41,41 @@ export default function ShareLinkPage() {
   const { actions: navActions } = useNavigationActions();
   const navigate = useNavigate();
   const { t } = useTranslation();
-  const [status, setStatus] = useState<ShareLinkStatus>('loading');
+  const [status, setStatus] = useState<ShareLinkStatus>("loading");
   const [metadata, setMetadata] = useState<ShareLinkMetadata | null>(null);
   const [isWorking, setIsWorking] = useState(false);
 
-  const normalizedToken = useMemo(() => (token || '').trim(), [token]);
-  const shareRole = (metadata?.accessRole ?? 'viewer').toLowerCase();
+  const normalizedToken = useMemo(() => (token || "").trim(), [token]);
+  const shareRole = (metadata?.accessRole ?? "viewer").toLowerCase();
   const hasReadAccess =
-    shareRole === 'editor' || shareRole === 'commenter' || shareRole === 'viewer';
+    shareRole === "editor" ||
+    shareRole === "commenter" ||
+    shareRole === "viewer";
   const canDownload = hasReadAccess;
   const canOpen = hasReadAccess;
 
   const loadMetadata = useCallback(async () => {
     if (!normalizedToken) {
-      setStatus('notfound');
+      setStatus("notfound");
       return;
     }
-    setStatus('loading');
+    setStatus("loading");
     try {
       const data = await fetchShareLinkMetadata(normalizedToken);
       setMetadata(data);
-      setStatus('ready');
-    } catch (error: any) {
-      const statusCode = error?.response?.status as number | undefined;
+      setStatus("ready");
+    } catch (error: unknown) {
+      const statusCode = isAxiosError(error)
+        ? error.response?.status
+        : undefined;
       if (statusCode === 401) {
-        setStatus('login');
+        setStatus("login");
       } else if (statusCode === 403) {
-        setStatus('forbidden');
+        setStatus("forbidden");
       } else if (statusCode === 404 || statusCode === 410) {
-        setStatus('notfound');
+        setStatus("notfound");
       } else {
-        setStatus('error');
+        setStatus("error");
       }
     }
   }, [normalizedToken]);
@@ -64,7 +85,7 @@ export default function ShareLinkPage() {
   }, [loadMetadata]);
 
   const handleLogin = useCallback(() => {
-    navigate('/login', {
+    navigate("/login", {
       replace: true,
       state: { from: { pathname: `/share/${normalizedToken}` } },
     });
@@ -76,25 +97,30 @@ export default function ShareLinkPage() {
     try {
       const { blob, filename } = await downloadShareLink(normalizedToken);
       const url = URL.createObjectURL(blob);
-      const link = document.createElement('a');
+      const link = document.createElement("a");
       link.href = url;
-      link.download = filename || 'shared-file';
+      link.download = filename || "shared-file";
       document.body.appendChild(link);
       link.click();
       link.remove();
       URL.revokeObjectURL(url);
-    } catch (error: any) {
-      const statusCode = error?.response?.status as number | undefined;
+    } catch (error: unknown) {
+      const statusCode = isAxiosError(error)
+        ? error.response?.status
+        : undefined;
       if (statusCode === 401) {
-        setStatus('login');
+        setStatus("login");
       } else if (statusCode === 403) {
-        setStatus('forbidden');
+        setStatus("forbidden");
       } else if (statusCode === 404 || statusCode === 410) {
-        setStatus('notfound');
+        setStatus("notfound");
       } else {
         alert({
-          alertType: 'error',
-          title: t('storageShare.downloadFailed', 'Unable to download this file.'),
+          alertType: "error",
+          title: t(
+            "storageShare.downloadFailed",
+            "Unable to download this file.",
+          ),
           expandable: false,
           durationMs: 3500,
         });
@@ -111,25 +137,27 @@ export default function ShareLinkPage() {
       const selectedIds = await importShareLinkToWorkbench(
         normalizedToken,
         actions,
-        metadata
+        metadata,
       );
       if (selectedIds.length > 0) {
         actions.setSelectedFiles(selectedIds);
       }
-      navActions.setWorkbench('viewer');
-      navigate('/', { replace: true });
-    } catch (error: any) {
-      const statusCode = error?.response?.status as number | undefined;
+      navActions.setWorkbench("viewer");
+      navigate("/", { replace: true });
+    } catch (error: unknown) {
+      const statusCode = isAxiosError(error)
+        ? error.response?.status
+        : undefined;
       if (statusCode === 401) {
-        setStatus('login');
+        setStatus("login");
       } else if (statusCode === 403) {
-        setStatus('forbidden');
+        setStatus("forbidden");
       } else if (statusCode === 404 || statusCode === 410) {
-        setStatus('notfound');
+        setStatus("notfound");
       } else {
         alert({
-          alertType: 'error',
-          title: t('storageShare.loadFailed', 'Unable to open shared file.'),
+          alertType: "error",
+          title: t("storageShare.loadFailed", "Unable to open shared file."),
           expandable: false,
           durationMs: 3500,
         });
@@ -139,48 +167,59 @@ export default function ShareLinkPage() {
     }
   }, [actions, canOpen, metadata, navActions, navigate, normalizedToken, t]);
 
-  const title = metadata?.fileName || t('storageShare.titleDefault', 'Shared file');
-  const ownerLabel = metadata?.owner || t('storageShare.ownerUnknown', 'Unknown');
+  const title =
+    metadata?.fileName || t("storageShare.titleDefault", "Shared file");
+  const ownerLabel =
+    metadata?.owner || t("storageShare.ownerUnknown", "Unknown");
 
   return (
-    <div style={{ minHeight: '100%', padding: '2.5rem 1.5rem' }}>
-      <Paper radius="lg" p="xl" withBorder shadow="sm" style={{ maxWidth: 720, margin: '0 auto' }}>
+    <div style={{ minHeight: "100%", padding: "2.5rem 1.5rem" }}>
+      <Paper
+        radius="lg"
+        p="xl"
+        withBorder
+        shadow="sm"
+        style={{ maxWidth: 720, margin: "0 auto" }}
+      >
         <Stack gap="md">
           <Group justify="space-between" align="center">
-            <Title order={3}>{t('storageShare.shareHeading', 'Shared file')}</Title>
+            <Title order={3}>
+              {t("storageShare.shareHeading", "Shared file")}
+            </Title>
             <Group gap="xs">
               {metadata?.accessRole && (
                 <Badge variant="light" color="gray">
-                  {shareRole === 'editor'
-                    ? t('storageShare.roleEditor', 'Editor')
-                    : shareRole === 'commenter'
-                      ? t('storageShare.roleCommenter', 'Commenter')
-                      : t('storageShare.roleViewer', 'Viewer')}
+                  {shareRole === "editor"
+                    ? t("storageShare.roleEditor", "Editor")
+                    : shareRole === "commenter"
+                      ? t("storageShare.roleCommenter", "Commenter")
+                      : t("storageShare.roleViewer", "Viewer")}
                 </Badge>
               )}
             </Group>
           </Group>
 
-          {status === 'loading' && (
+          {status === "loading" && (
             <Group justify="center" py="xl">
               <Loader size="sm" />
               <Text size="sm" c="dimmed">
-                {t('storageShare.loading', 'Loading share link...')}
+                {t("storageShare.loading", "Loading share link...")}
               </Text>
             </Group>
           )}
 
-          {status === 'ready' && (
+          {status === "ready" && (
             <>
               <Text size="lg" fw={600}>
                 {title}
               </Text>
               <Text size="sm" c="dimmed">
-                {t('storageShare.ownerLabel', 'Owner')}: {ownerLabel}
+                {t("storageShare.ownerLabel", "Owner")}: {ownerLabel}
               </Text>
               {metadata?.createdAt && (
                 <Text size="sm" c="dimmed">
-                  {t('storageShare.createdAt', 'Created')} {new Date(metadata.createdAt).toLocaleString()}
+                  {t("storageShare.createdAt", "Created")}{" "}
+                  {new Date(metadata.createdAt).toLocaleString()}
                 </Text>
               )}
               <Group justify="flex-start" gap="sm" pt="sm">
@@ -190,7 +229,7 @@ export default function ShareLinkPage() {
                   loading={isWorking}
                   disabled={!canOpen}
                 >
-                  {t('storageShare.openInApp', 'Open in Stirling PDF')}
+                  {t("storageShare.openInApp", "Open in Stirling PDF")}
                 </Button>
                 <Button
                   variant="light"
@@ -199,59 +238,84 @@ export default function ShareLinkPage() {
                   loading={isWorking}
                   disabled={!canDownload}
                 >
-                  {t('storageShare.download', 'Download')}
+                  {t("storageShare.download", "Download")}
                 </Button>
               </Group>
               {!canDownload && (
-                <Alert mt="md" color="yellow" title={t('storageShare.accessLimitedTitle', 'Limited access')}>
-                  {shareRole === 'commenter'
+                <Alert
+                  mt="md"
+                  color="yellow"
+                  title={t("storageShare.accessLimitedTitle", "Limited access")}
+                >
+                  {shareRole === "commenter"
                     ? t(
-                        'storageShare.accessLimitedCommenter',
-                        'Comment access is coming soon. Ask the owner for editor access if you need to download.'
+                        "storageShare.accessLimitedCommenter",
+                        "Comment access is coming soon. Ask the owner for editor access if you need to download.",
                       )
                     : t(
-                        'storageShare.accessLimitedViewer',
-                        'This link is view-only. Ask the owner for editor access if you need to download.'
+                        "storageShare.accessLimitedViewer",
+                        "This link is view-only. Ask the owner for editor access if you need to download.",
                       )}
                 </Alert>
               )}
             </>
           )}
 
-          {status === 'login' && (
-            <Alert color="blue" title={t('storageShare.loginRequired', 'Login required')}>
+          {status === "login" && (
+            <Alert
+              color="blue"
+              title={t("storageShare.loginRequired", "Login required")}
+            >
               <Text size="sm">
-                {t('storageShare.loginPrompt', 'Sign in to access this shared file.')}
+                {t(
+                  "storageShare.loginPrompt",
+                  "Sign in to access this shared file.",
+                )}
               </Text>
               <Group mt="md">
                 <Button
                   leftSection={<LoginIcon style={{ fontSize: 18 }} />}
                   onClick={handleLogin}
                 >
-                  {t('storageShare.goToLogin', 'Go to login')}
+                  {t("storageShare.goToLogin", "Go to login")}
                 </Button>
               </Group>
             </Alert>
           )}
 
-          {status === 'forbidden' && (
-            <Alert color="red" title={t('storageShare.accessDeniedTitle', 'No access')}>
+          {status === "forbidden" && (
+            <Alert
+              color="red"
+              title={t("storageShare.accessDeniedTitle", "No access")}
+            >
               {t(
-                'storageShare.accessDeniedBody',
-                'You do not have access to this file. Ask the owner to share it with you.'
+                "storageShare.accessDeniedBody",
+                "You do not have access to this file. Ask the owner to share it with you.",
               )}
             </Alert>
           )}
 
-          {status === 'notfound' && (
-            <Alert color="red" title={t('storageShare.expiredTitle', 'Link expired')}>
-              {t('storageShare.expiredBody', 'This share link is invalid or has expired.')}
+          {status === "notfound" && (
+            <Alert
+              color="red"
+              title={t("storageShare.expiredTitle", "Link expired")}
+            >
+              {t(
+                "storageShare.expiredBody",
+                "This share link is invalid or has expired.",
+              )}
             </Alert>
           )}
 
-          {status === 'error' && (
-            <Alert color="red" title={t('storageShare.loadFailed', 'Unable to open shared file.')}>
-              {t('storageShare.tryAgain', 'Please try again later.')}
+          {status === "error" && (
+            <Alert
+              color="red"
+              title={t(
+                "storageShare.loadFailed",
+                "Unable to open shared file.",
+              )}
+            >
+              {t("storageShare.tryAgain", "Please try again later.")}
             </Alert>
           )}
         </Stack>
diff --git a/frontend/src/proprietary/routes/Signup.tsx b/frontend/src/proprietary/routes/Signup.tsx
index ad1b7dc009..28676a0858 100644
--- a/frontend/src/proprietary/routes/Signup.tsx
+++ b/frontend/src/proprietary/routes/Signup.tsx
@@ -1,19 +1,22 @@
-import { useState, useEffect } from 'react';
-import { useNavigate } from 'react-router-dom';
-import { useTranslation } from 'react-i18next';
-import { useDocumentMeta } from '@app/hooks/useDocumentMeta';
-import { useAuth } from '@app/auth/UseSession';
-import AuthLayout from '@app/routes/authShared/AuthLayout';
-import '@app/routes/authShared/auth.css';
-import { BASE_PATH } from '@app/constants/app';
+import { useState, useEffect } from "react";
+import { useNavigate } from "react-router-dom";
+import { useTranslation } from "react-i18next";
+import { useDocumentMeta } from "@app/hooks/useDocumentMeta";
+import { useAuth } from "@app/auth/UseSession";
+import AuthLayout from "@app/routes/authShared/AuthLayout";
+import "@app/routes/authShared/auth.css";
+import { BASE_PATH } from "@app/constants/app";
 
 // Import signup components
-import LoginHeader from '@app/routes/login/LoginHeader';
-import ErrorMessage from '@app/routes/login/ErrorMessage';
-import DividerWithText from '@app/components/shared/DividerWithText';
-import SignupForm from '@app/routes/signup/SignupForm';
-import { useSignupFormValidation, SignupFieldErrors } from '@app/routes/signup/SignupFormValidation';
-import { useAuthService } from '@app/routes/signup/AuthService';
+import LoginHeader from "@app/routes/login/LoginHeader";
+import ErrorMessage from "@app/routes/login/ErrorMessage";
+import DividerWithText from "@app/components/shared/DividerWithText";
+import SignupForm from "@app/routes/signup/SignupForm";
+import {
+  useSignupFormValidation,
+  SignupFieldErrors,
+} from "@app/routes/signup/SignupFormValidation";
+import { useAuthService } from "@app/routes/signup/AuthService";
 
 export default function Signup() {
   const navigate = useNavigate();
@@ -21,16 +24,16 @@ export default function Signup() {
   const { session, loading } = useAuth();
   const [isSigningUp, setIsSigningUp] = useState(false);
   const [error, setError] = useState<string | null>(null);
-  const [email, setEmail] = useState('');
-  const [password, setPassword] = useState('');
-  const [confirmPassword, setConfirmPassword] = useState('');
+  const [email, setEmail] = useState("");
+  const [password, setPassword] = useState("");
+  const [confirmPassword, setConfirmPassword] = useState("");
   const [fieldErrors, setFieldErrors] = useState<SignupFieldErrors>({});
 
   // Redirect immediately if user has valid session (JWT already validated by AuthProvider)
   useEffect(() => {
     if (!loading && session) {
-      console.debug('[Signup] User already authenticated, redirecting to home');
-      navigate('/', { replace: true });
+      console.debug("[Signup] User already authenticated, redirecting to home");
+      navigate("/", { replace: true });
     }
   }, [session, loading, navigate]);
 
@@ -38,12 +41,18 @@ export default function Signup() {
 
   // Set document meta
   useDocumentMeta({
-    title: `${t('signup.title', 'Create an account')} - Stirling PDF`,
-    description: t('app.description', 'The Free Adobe Acrobat alternative (10M+ Downloads)'),
-    ogTitle: `${t('signup.title', 'Create an account')} - Stirling PDF`,
-    ogDescription: t('app.description', 'The Free Adobe Acrobat alternative (10M+ Downloads)'),
+    title: `${t("signup.title", "Create an account")} - Stirling PDF`,
+    description: t(
+      "app.description",
+      "The Free Adobe Acrobat alternative (10M+ Downloads)",
+    ),
+    ogTitle: `${t("signup.title", "Create an account")} - Stirling PDF`,
+    ogDescription: t(
+      "app.description",
+      "The Free Adobe Acrobat alternative (10M+ Downloads)",
+    ),
     ogImage: `${baseUrl}/og_images/home.png`,
-    ogUrl: `${window.location.origin}${window.location.pathname}`
+    ogUrl: `${window.location.origin}${window.location.pathname}`,
   });
 
   const { validateSignupForm } = useSignupFormValidation();
@@ -62,16 +71,20 @@ export default function Signup() {
       setError(null);
       setFieldErrors({});
 
-      const result = await signUp(email, password, '');
+      const result = await signUp(email, password, "");
 
       if (result.user) {
         // Show success message and redirect to login
         setError(null);
-        setTimeout(() => navigate('/login'), 2000);
+        setTimeout(() => navigate("/login"), 2000);
       }
     } catch (err) {
-      console.error('[Signup] Unexpected error:', err);
-      setError(err instanceof Error ? err.message : t('signup.unexpectedError', { message: 'Unknown error' }));
+      console.error("[Signup] Unexpected error:", err);
+      setError(
+        err instanceof Error
+          ? err.message
+          : t("signup.unexpectedError", { message: "Unknown error" }),
+      );
     } finally {
       setIsSigningUp(false);
     }
@@ -79,7 +92,10 @@ export default function Signup() {
 
   return (
     <AuthLayout>
-      <LoginHeader title={t('signup.title', 'Create an account')} subtitle={t('signup.subtitle', 'Join Stirling PDF')} />
+      <LoginHeader
+        title={t("signup.title", "Create an account")}
+        subtitle={t("signup.subtitle", "Join Stirling PDF")}
+      />
 
       <ErrorMessage error={error} />
 
@@ -98,16 +114,20 @@ export default function Signup() {
         showTerms={false}
       />
 
-      <DividerWithText text={t('signup.or', 'or')} respondsToDarkMode={false} opacity={0.4} />
+      <DividerWithText
+        text={t("signup.or", "or")}
+        respondsToDarkMode={false}
+        opacity={0.4}
+      />
 
       {/* Bottom row - centered */}
-      <div style={{ textAlign: 'center', margin: '0.5rem 0 0.25rem' }}>
+      <div style={{ textAlign: "center", margin: "0.5rem 0 0.25rem" }}>
         <button
           type="button"
-          onClick={() => navigate('/login')}
+          onClick={() => navigate("/login")}
           className="auth-link-black"
         >
-          {t('login.logIn', 'Log In')}
+          {t("login.logIn", "Log In")}
         </button>
       </div>
     </AuthLayout>
diff --git a/frontend/src/proprietary/routes/authShared/AuthLayout.module.css b/frontend/src/proprietary/routes/authShared/AuthLayout.module.css
index 0e597bee0b..3e5e5247ea 100644
--- a/frontend/src/proprietary/routes/authShared/AuthLayout.module.css
+++ b/frontend/src/proprietary/routes/authShared/AuthLayout.module.css
@@ -7,7 +7,8 @@
   justify-content: center;
   background-color: var(--auth-bg-color-light-only);
   padding: 1.5rem 1.5rem 0;
-  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
+  font-family:
+    -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
   overflow: auto;
 }
 
diff --git a/frontend/src/proprietary/routes/authShared/AuthLayout.tsx b/frontend/src/proprietary/routes/authShared/AuthLayout.tsx
index 9f30d5995b..2b52d66941 100644
--- a/frontend/src/proprietary/routes/authShared/AuthLayout.tsx
+++ b/frontend/src/proprietary/routes/authShared/AuthLayout.tsx
@@ -1,13 +1,13 @@
-import React, { useEffect, useMemo, useRef, useState } from 'react';
-import { useTranslation } from 'react-i18next';
-import LoginRightCarousel from '@app/components/shared/LoginRightCarousel';
-import buildLoginSlides from '@app/components/shared/loginSlides';
-import styles from '@app/routes/authShared/AuthLayout.module.css';
-import { useLogoVariant } from '@app/hooks/useLogoVariant';
-import Footer from '@app/components/shared/Footer';
+import React, { useEffect, useMemo, useRef, useState } from "react";
+import { useTranslation } from "react-i18next";
+import LoginRightCarousel from "@app/components/shared/LoginRightCarousel";
+import buildLoginSlides from "@app/components/shared/loginSlides";
+import styles from "@app/routes/authShared/AuthLayout.module.css";
+import { useLogoVariant } from "@app/hooks/useLogoVariant";
+import Footer from "@app/components/shared/Footer";
 
 interface AuthLayoutProps {
-  children: React.ReactNode
+  children: React.ReactNode;
 }
 
 export default function AuthLayout({ children }: AuthLayoutProps) {
@@ -15,20 +15,28 @@ export default function AuthLayout({ children }: AuthLayoutProps) {
   const cardRef = useRef<HTMLDivElement | null>(null);
   const [hideRightPanel, setHideRightPanel] = useState(false);
   const logoVariant = useLogoVariant();
-  const imageSlides = useMemo(() => buildLoginSlides(logoVariant, t), [logoVariant, t]);
+  const imageSlides = useMemo(
+    () => buildLoginSlides(logoVariant, t),
+    [logoVariant, t],
+  );
 
   // Force light mode on auth pages
   useEffect(() => {
     const htmlElement = document.documentElement;
-    const previousColorScheme = htmlElement.getAttribute('data-mantine-color-scheme');
+    const previousColorScheme = htmlElement.getAttribute(
+      "data-mantine-color-scheme",
+    );
 
     // Set light mode
-    htmlElement.setAttribute('data-mantine-color-scheme', 'light');
+    htmlElement.setAttribute("data-mantine-color-scheme", "light");
 
     // Cleanup: restore previous theme when leaving auth pages
     return () => {
       if (previousColorScheme) {
-        htmlElement.setAttribute('data-mantine-color-scheme', previousColorScheme);
+        htmlElement.setAttribute(
+          "data-mantine-color-scheme",
+          previousColorScheme,
+        );
       }
     };
   }, []);
@@ -45,11 +53,11 @@ export default function AuthLayout({ children }: AuthLayoutProps) {
       setHideRightPanel(tooNarrow || tooShort);
     };
     update();
-    window.addEventListener('resize', update);
-    window.addEventListener('orientationchange', update);
+    window.addEventListener("resize", update);
+    window.addEventListener("orientationchange", update);
     return () => {
-      window.removeEventListener('resize', update);
-      window.removeEventListener('orientationchange', update);
+      window.removeEventListener("resize", update);
+      window.removeEventListener("orientationchange", update);
     };
   }, []);
 
@@ -57,18 +65,29 @@ export default function AuthLayout({ children }: AuthLayoutProps) {
     <div className={styles.authContainer}>
       <div
         ref={cardRef}
-        className={`${styles.authCard} ${!hideRightPanel ? styles.authCardTwoColumns : ''}`}
+        className={`${styles.authCard} ${!hideRightPanel ? styles.authCardTwoColumns : ""}`}
       >
         <div className={styles.authLeftPanel}>
-          <div className={styles.authContent}>
-            {children}
-          </div>
+          <div className={styles.authContent}>{children}</div>
         </div>
         {!hideRightPanel && (
-          <LoginRightCarousel imageSlides={imageSlides} initialSeconds={5} slideSeconds={8} />
+          <LoginRightCarousel
+            imageSlides={imageSlides}
+            initialSeconds={5}
+            slideSeconds={8}
+          />
         )}
       </div>
-      <div style={{ position: 'fixed', bottom: 0, left: 0, right: 0, width: '100%', zIndex: 10 }}>
+      <div
+        style={{
+          position: "fixed",
+          bottom: 0,
+          left: 0,
+          right: 0,
+          width: "100%",
+          zIndex: 10,
+        }}
+      >
         <Footer forceLightMode={true} />
       </div>
     </div>
diff --git a/frontend/src/proprietary/routes/authShared/auth.css b/frontend/src/proprietary/routes/authShared/auth.css
index b5b5b882b1..e0abf4e7a5 100644
--- a/frontend/src/proprietary/routes/authShared/auth.css
+++ b/frontend/src/proprietary/routes/authShared/auth.css
@@ -107,7 +107,7 @@
 .auth-checkbox {
   width: 1rem; /* 16px */
   height: 1rem; /* 16px */
-  accent-color: #AF3434;
+  accent-color: #af3434;
 }
 
 .auth-terms-label {
@@ -122,7 +122,9 @@
 
 .auth-confirm {
   overflow: hidden;
-  transition: max-height 240ms ease, opacity 200ms ease;
+  transition:
+    max-height 240ms ease,
+    opacity 200ms ease;
 }
 
 /* OAuth Button Styles */
@@ -203,7 +205,11 @@
   gap: 1rem; /* 16px */
   font-family: inherit;
   box-shadow: 0 0.125rem 0.5rem rgba(0, 0, 0, 0.08);
-  transition: background-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease, border-color 0.2s ease;
+  transition:
+    background-color 0.2s ease,
+    box-shadow 0.2s ease,
+    transform 0.2s ease,
+    border-color 0.2s ease;
 }
 
 .oauth-button-vertical:hover:not(:disabled) {
@@ -214,11 +220,19 @@
 }
 
 .oauth-button-vertical-tinted {
-  background: linear-gradient(90deg, color-mix(in srgb, var(--oauth-accent) 65%, #0f172a) 0 6px, #0f172a 6px 100%);
+  background: linear-gradient(
+    90deg,
+    color-mix(in srgb, var(--oauth-accent) 65%, #0f172a) 0 6px,
+    #0f172a 6px 100%
+  );
 }
 
 .oauth-button-vertical-tinted:hover:not(:disabled) {
-  background: linear-gradient(90deg, color-mix(in srgb, var(--oauth-accent) 75%, #111827) 0 6px, #111827 6px 100%);
+  background: linear-gradient(
+    90deg,
+    color-mix(in srgb, var(--oauth-accent) 75%, #111827) 0 6px,
+    #111827 6px 100%
+  );
 }
 
 .oauth-button-vertical-legacy {
@@ -372,8 +386,16 @@
 }
 
 .oauth-button-vertical-tinted .oauth-icon-wrapper {
-  background: color-mix(in srgb, var(--oauth-accent) 20%, rgba(255, 255, 255, 0.08));
-  border-color: color-mix(in srgb, var(--oauth-accent) 35%, rgba(255, 255, 255, 0.2));
+  background: color-mix(
+    in srgb,
+    var(--oauth-accent) 20%,
+    rgba(255, 255, 255, 0.08)
+  );
+  border-color: color-mix(
+    in srgb,
+    var(--oauth-accent) 35%,
+    rgba(255, 255, 255, 0.2)
+  );
 }
 
 .oauth-button-vertical-outline .oauth-icon-wrapper,
@@ -579,7 +601,7 @@
 
 /* Email login button - red CTA style matching SaaS version */
 .auth-cta-button {
-  background-color: #AF3434 !important;
+  background-color: #af3434 !important;
   color: white !important;
   border: none !important;
   font-weight: 600 !important;
@@ -590,6 +612,6 @@
 }
 
 .auth-cta-button:disabled {
-  background-color: #AF3434 !important;
+  background-color: #af3434 !important;
   opacity: 0.6 !important;
 }
diff --git a/frontend/src/proprietary/routes/login/EmailPasswordForm.tsx b/frontend/src/proprietary/routes/login/EmailPasswordForm.tsx
index d7338e18e6..2cb6750ab3 100644
--- a/frontend/src/proprietary/routes/login/EmailPasswordForm.tsx
+++ b/frontend/src/proprietary/routes/login/EmailPasswordForm.tsx
@@ -1,40 +1,40 @@
-import { useTranslation } from 'react-i18next';
-import '@app/routes/authShared/auth.css';
-import { TextInput, PasswordInput, Button } from '@mantine/core';
+import { useTranslation } from "react-i18next";
+import "@app/routes/authShared/auth.css";
+import { TextInput, PasswordInput, Button } from "@mantine/core";
 
 // Force light mode styles for auth inputs
 const authInputStyles = {
   input: {
-    backgroundColor: 'var(--auth-input-bg-light-only)',
-    color: 'var(--auth-input-text-light-only)',
-    borderColor: 'var(--auth-input-border-light-only)',
-    '&:focus': {
-      borderColor: 'var(--auth-border-focus-light-only)',
+    backgroundColor: "var(--auth-input-bg-light-only)",
+    color: "var(--auth-input-text-light-only)",
+    borderColor: "var(--auth-input-border-light-only)",
+    "&:focus": {
+      borderColor: "var(--auth-border-focus-light-only)",
     },
   },
   label: {
-    color: 'var(--auth-label-text-light-only)',
+    color: "var(--auth-label-text-light-only)",
   },
 };
 
 interface EmailPasswordFormProps {
-  email: string
-  password: string
-  setEmail: (email: string) => void
-  setPassword: (password: string) => void
-  mfaCode?: string
-  setMfaCode?: (code: string) => void
-  showMfaField?: boolean
-  requiresMfa?: boolean
-  onSubmit: () => void
-  isSubmitting: boolean
-  submitButtonText: string
-  showPasswordField?: boolean
+  email: string;
+  password: string;
+  setEmail: (email: string) => void;
+  setPassword: (password: string) => void;
+  mfaCode?: string;
+  setMfaCode?: (code: string) => void;
+  showMfaField?: boolean;
+  requiresMfa?: boolean;
+  onSubmit: () => void;
+  isSubmitting: boolean;
+  submitButtonText: string;
+  showPasswordField?: boolean;
   fieldErrors?: {
-    email?: string
-    password?: string
-    mfaCode?: string
-  }
+    email?: string;
+    password?: string;
+    mfaCode?: string;
+  };
 }
 
 export default function EmailPasswordForm({
@@ -42,7 +42,7 @@ export default function EmailPasswordForm({
   password,
   setEmail,
   setPassword,
-  mfaCode = '',
+  mfaCode = "",
   setMfaCode,
   showMfaField = false,
   requiresMfa = false,
@@ -50,7 +50,7 @@ export default function EmailPasswordForm({
   isSubmitting,
   submitButtonText,
   showPasswordField = true,
-  fieldErrors = {}
+  fieldErrors = {},
 }: EmailPasswordFormProps) {
   const { t } = useTranslation();
 
@@ -65,15 +65,15 @@ export default function EmailPasswordForm({
         <div className="auth-field">
           <TextInput
             id="email"
-            label={t('login.username', 'Username')}
+            label={t("login.username", "Username")}
             type="text"
             name="username"
             autoComplete="username"
-            placeholder={t('login.enterUsername', 'Enter username')}
+            placeholder={t("login.enterUsername", "Enter username")}
             value={email}
             onChange={(e) => setEmail(e.target.value)}
             error={fieldErrors.email}
-            classNames={{ label: 'auth-label' }}
+            classNames={{ label: "auth-label" }}
             styles={authInputStyles}
             autoFocus
           />
@@ -83,14 +83,14 @@ export default function EmailPasswordForm({
           <div className="auth-field">
             <PasswordInput
               id="password"
-              label={t('login.password')}
+              label={t("login.password")}
               name="current-password"
               autoComplete="current-password"
-              placeholder={t('login.enterPassword')}
+              placeholder={t("login.enterPassword")}
               value={password}
               onChange={(e) => setPassword(e.target.value)}
               error={fieldErrors.password}
-              classNames={{ label: 'auth-label' }}
+              classNames={{ label: "auth-label" }}
               styles={authInputStyles}
             />
           </div>
@@ -99,19 +99,21 @@ export default function EmailPasswordForm({
           <div className="auth-field">
             <TextInput
               id="mfaCode"
-              label={t('login.mfaCode', 'Authentication code')}
+              label={t("login.mfaCode", "Authentication code")}
               type="text"
               name="mfaCode"
               autoComplete="one-time-code"
-              placeholder={t('login.enterMfaCode', 'Enter 6-digit code')}
+              placeholder={t("login.enterMfaCode", "Enter 6-digit code")}
               value={mfaCode}
               inputMode="numeric"
-              onChange={(e: React.ChangeEvent<HTMLInputElement>) => setMfaCode?.(e.target.value.replace(/\D/g, '').slice(0, 6))}
+              onChange={(e: React.ChangeEvent<HTMLInputElement>) =>
+                setMfaCode?.(e.target.value.replace(/\D/g, "").slice(0, 6))
+              }
               pattern="[0-9]*"
               maxLength={6}
               minLength={6}
               error={fieldErrors.mfaCode}
-              classNames={{ label: 'auth-label' }}
+              classNames={{ label: "auth-label" }}
               styles={authInputStyles}
             />
           </div>
@@ -120,7 +122,12 @@ export default function EmailPasswordForm({
 
       <Button
         type="submit"
-        disabled={isSubmitting || !email || (showPasswordField && !password) || (requiresMfa && !mfaCode.trim())}
+        disabled={
+          isSubmitting ||
+          !email ||
+          (showPasswordField && !password) ||
+          (requiresMfa && !mfaCode.trim())
+        }
         className="auth-button"
         fullWidth
         loading={isSubmitting}
diff --git a/frontend/src/proprietary/routes/login/ErrorMessage.tsx b/frontend/src/proprietary/routes/login/ErrorMessage.tsx
index 4563a24505..064db69a13 100644
--- a/frontend/src/proprietary/routes/login/ErrorMessage.tsx
+++ b/frontend/src/proprietary/routes/login/ErrorMessage.tsx
@@ -1,5 +1,5 @@
 interface ErrorMessageProps {
-  error: string | null
+  error: string | null;
 }
 
 export default function ErrorMessage({ error }: ErrorMessageProps) {
diff --git a/frontend/src/proprietary/routes/login/LoggedInState.tsx b/frontend/src/proprietary/routes/login/LoggedInState.tsx
index f8b8f3a1e4..a8c2d5c7cd 100644
--- a/frontend/src/proprietary/routes/login/LoggedInState.tsx
+++ b/frontend/src/proprietary/routes/login/LoggedInState.tsx
@@ -1,58 +1,73 @@
-import { useEffect } from 'react';
-import { useNavigate } from 'react-router-dom';
-import { useAuth } from '@app/auth/UseSession';
-import { useTranslation } from 'react-i18next';
-import { useLogoPath } from '@app/hooks/useLogoPath';
+import { useEffect } from "react";
+import { useNavigate } from "react-router-dom";
+import { useAuth } from "@app/auth/UseSession";
+import { useTranslation } from "react-i18next";
+import { LogoIcon } from "@app/components/shared/LogoIcon";
 
 export default function LoggedInState() {
   const navigate = useNavigate();
   const { user } = useAuth();
   const { t } = useTranslation();
-  const logoPath = useLogoPath();
 
   useEffect(() => {
     const timer = setTimeout(() => {
-      navigate('/');
+      navigate("/");
     }, 2000);
 
     return () => clearTimeout(timer);
   }, [navigate]);
 
   return (
-    <div style={{
-      minHeight: '100vh',
-      display: 'flex',
-      alignItems: 'center',
-      justifyContent: 'center',
-      backgroundColor: '#f3f4f6',
-      padding: '16px'
-    }}>
-      <div style={{
-        maxWidth: '400px',
-        width: '100%',
-        backgroundColor: '#ffffff',
-        borderRadius: '16px',
-        boxShadow: '0 10px 25px rgba(0, 0, 0, 0.1)',
-        padding: '32px'
-      }}>
-        <div style={{ textAlign: 'center', marginBottom: '24px' }}>
-          <div style={{ marginBottom: '16px', display: 'flex', justifyContent: 'center' }}>
-            <img
-              src={logoPath}
+    <div
+      style={{
+        minHeight: "100vh",
+        display: "flex",
+        alignItems: "center",
+        justifyContent: "center",
+        backgroundColor: "#f3f4f6",
+        padding: "16px",
+      }}
+    >
+      <div
+        style={{
+          maxWidth: "400px",
+          width: "100%",
+          backgroundColor: "#ffffff",
+          borderRadius: "16px",
+          boxShadow: "0 10px 25px rgba(0, 0, 0, 0.1)",
+          padding: "32px",
+        }}
+      >
+        <div style={{ textAlign: "center", marginBottom: "24px" }}>
+          <div
+            style={{
+              marginBottom: "16px",
+              display: "flex",
+              justifyContent: "center",
+            }}
+          >
+            <LogoIcon
               alt="Stirling PDF Logo"
-              style={{ width: '64px', height: '64px', objectFit: 'contain' }}
+              style={{ width: "64px", height: "64px", objectFit: "contain" }}
             />
           </div>
-          <h1 style={{ fontSize: '24px', fontWeight: 'bold', color: '#059669', marginBottom: '8px' }}>
-            {t('login.youAreLoggedIn')}
+          <h1
+            style={{
+              fontSize: "24px",
+              fontWeight: "bold",
+              color: "#059669",
+              marginBottom: "8px",
+            }}
+          >
+            {t("login.youAreLoggedIn")}
           </h1>
-          <p style={{ color: '#6b7280', fontSize: '14px' }}>
-            {t('login.email')}: {user?.email}
+          <p style={{ color: "#6b7280", fontSize: "14px" }}>
+            {t("login.email")}: {user?.email}
           </p>
         </div>
 
-        <div style={{ textAlign: 'center', marginTop: '16px' }}>
-          <p style={{ color: '#6b7280', fontSize: '14px' }}>
+        <div style={{ textAlign: "center", marginTop: "16px" }}>
+          <p style={{ color: "#6b7280", fontSize: "14px" }}>
             Redirecting to home...
           </p>
         </div>
diff --git a/frontend/src/proprietary/routes/login/LoginHeader.tsx b/frontend/src/proprietary/routes/login/LoginHeader.tsx
index 10304949e2..9d6f4d66d0 100644
--- a/frontend/src/proprietary/routes/login/LoginHeader.tsx
+++ b/frontend/src/proprietary/routes/login/LoginHeader.tsx
@@ -1,24 +1,25 @@
-
-import { useLogoAssets } from '@app/hooks/useLogoAssets';
+import { Wordmark } from "@app/components/shared/Wordmark";
 
 interface LoginHeaderProps {
-  title: string
-  subtitle?: string
-  centerOnly?: boolean
+  title: string;
+  subtitle?: string;
+  centerOnly?: boolean;
 }
 
-export default function LoginHeader({ title, subtitle, centerOnly = false }: LoginHeaderProps) {
-  const { wordmark } = useLogoAssets();
-
+export default function LoginHeader({
+  title,
+  subtitle,
+  centerOnly = false,
+}: LoginHeaderProps) {
   return (
-    <div className={`login-header${centerOnly ? ' login-header-centered' : ''}`}>
+    <div
+      className={`login-header${centerOnly ? " login-header-centered" : ""}`}
+    >
       <div className="login-header-logos">
-        <img src={wordmark.black} alt="Stirling PDF" className="login-logo-text" />
+        <Wordmark alt="Stirling PDF" className="login-logo-text" />
       </div>
       {title && <h1 className="login-title">{title}</h1>}
-      {subtitle && (
-        <p className="login-subtitle">{subtitle}</p>
-      )}
+      {subtitle && <p className="login-subtitle">{subtitle}</p>}
     </div>
   );
 }
diff --git a/frontend/src/proprietary/routes/login/NavigationLink.tsx b/frontend/src/proprietary/routes/login/NavigationLink.tsx
index af08094ce5..dcb5bd9380 100644
--- a/frontend/src/proprietary/routes/login/NavigationLink.tsx
+++ b/frontend/src/proprietary/routes/login/NavigationLink.tsx
@@ -1,12 +1,16 @@
-import { Button } from '@mantine/core';
+import { Button } from "@mantine/core";
 
 interface NavigationLinkProps {
-  onClick: () => void
-  text: string
-  isDisabled?: boolean
+  onClick: () => void;
+  text: string;
+  isDisabled?: boolean;
 }
 
-export default function NavigationLink({ onClick, text, isDisabled = false }: NavigationLinkProps) {
+export default function NavigationLink({
+  onClick,
+  text,
+  isDisabled = false,
+}: NavigationLinkProps) {
   return (
     <div className="navigation-link-container">
       <Button
diff --git a/frontend/src/proprietary/routes/login/OAuthButtons.test.tsx b/frontend/src/proprietary/routes/login/OAuthButtons.test.tsx
index 62f121d68c..1c49552c3f 100644
--- a/frontend/src/proprietary/routes/login/OAuthButtons.test.tsx
+++ b/frontend/src/proprietary/routes/login/OAuthButtons.test.tsx
@@ -1,11 +1,11 @@
-import { describe, it, expect, vi, beforeEach } from 'vitest';
-import { render, screen } from '@testing-library/react';
-import userEvent from '@testing-library/user-event';
-import { MantineProvider } from '@mantine/core';
-import OAuthButtons from '@app/routes/login/OAuthButtons';
+import { describe, it, expect, vi, beforeEach } from "vitest";
+import { render, screen } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+import { MantineProvider } from "@mantine/core";
+import OAuthButtons from "@app/routes/login/OAuthButtons";
 
 // Mock i18n
-vi.mock('react-i18next', () => ({
+vi.mock("react-i18next", () => ({
   useTranslation: () => ({
     t: (key: string, fallback?: string) => fallback || key,
   }),
@@ -15,15 +15,15 @@ const TestWrapper = ({ children }: { children: React.ReactNode }) => (
   <MantineProvider>{children}</MantineProvider>
 );
 
-describe('OAuthButtons', () => {
+describe("OAuthButtons", () => {
   const mockOnProviderClick = vi.fn();
 
   beforeEach(() => {
     vi.clearAllMocks();
   });
 
-  it('should render known providers with correct labels', () => {
-    const enabledProviders = ['google', 'github', 'authentik'];
+  it("should render known providers with correct labels", () => {
+    const enabledProviders = ["google", "github", "authentik"];
 
     render(
       <TestWrapper>
@@ -32,17 +32,17 @@ describe('OAuthButtons', () => {
           isSubmitting={false}
           enabledProviders={enabledProviders}
         />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
     // Check that known providers are rendered with their labels
-    expect(screen.getByText('Google')).toBeTruthy();
-    expect(screen.getByText('GitHub')).toBeTruthy();
-    expect(screen.getByText('Authentik')).toBeTruthy();
+    expect(screen.getByText("Google")).toBeTruthy();
+    expect(screen.getByText("GitHub")).toBeTruthy();
+    expect(screen.getByText("Authentik")).toBeTruthy();
   });
 
-  it('should render unknown provider with capitalized label and generic icon', () => {
-    const enabledProviders = ['mycompany'];
+  it("should render unknown provider with capitalized label and generic icon", () => {
+    const enabledProviders = ["mycompany"];
 
     render(
       <TestWrapper>
@@ -51,22 +51,22 @@ describe('OAuthButtons', () => {
           isSubmitting={false}
           enabledProviders={enabledProviders}
         />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
     // Unknown provider should be capitalized
-    expect(screen.getByText('Mycompany')).toBeTruthy();
+    expect(screen.getByText("Mycompany")).toBeTruthy();
 
     // Check that button has generic OIDC icon
-    const button = screen.getByText('Mycompany').closest('button');
+    const button = screen.getByText("Mycompany").closest("button");
     expect(button).toBeTruthy();
-    const img = button?.querySelector('img');
-    expect(img?.src).toContain('oidc.svg');
+    const img = button?.querySelector("img");
+    expect(img?.src).toContain("oidc.svg");
   });
 
   it('should call onProviderClick with actual provider ID (not "oidc")', async () => {
     const user = userEvent.setup();
-    const enabledProviders = ['mycompany'];
+    const enabledProviders = ["mycompany"];
 
     render(
       <TestWrapper>
@@ -75,19 +75,19 @@ describe('OAuthButtons', () => {
           isSubmitting={false}
           enabledProviders={enabledProviders}
         />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
-    const button = screen.getByText('Mycompany');
+    const button = screen.getByText("Mycompany");
     await user.click(button);
 
     // Should use actual provider ID 'mycompany', NOT 'oidc'
-    expect(mockOnProviderClick).toHaveBeenCalledWith('mycompany');
+    expect(mockOnProviderClick).toHaveBeenCalledWith("mycompany");
   });
 
   it('should call onProviderClick with "authentik" when authentik is clicked', async () => {
     const user = userEvent.setup();
-    const enabledProviders = ['authentik'];
+    const enabledProviders = ["authentik"];
 
     render(
       <TestWrapper>
@@ -96,18 +96,18 @@ describe('OAuthButtons', () => {
           isSubmitting={false}
           enabledProviders={enabledProviders}
         />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
-    const button = screen.getByText('Authentik');
+    const button = screen.getByText("Authentik");
     await user.click(button);
 
-    expect(mockOnProviderClick).toHaveBeenCalledWith('authentik');
+    expect(mockOnProviderClick).toHaveBeenCalledWith("authentik");
   });
 
   it('should call onProviderClick with "oidc" when OIDC is explicitly configured', async () => {
     const user = userEvent.setup();
-    const enabledProviders = ['oidc'];
+    const enabledProviders = ["oidc"];
 
     render(
       <TestWrapper>
@@ -116,17 +116,17 @@ describe('OAuthButtons', () => {
           isSubmitting={false}
           enabledProviders={enabledProviders}
         />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
-    const button = screen.getByText('OIDC');
+    const button = screen.getByText("OIDC");
     await user.click(button);
 
-    expect(mockOnProviderClick).toHaveBeenCalledWith('oidc');
+    expect(mockOnProviderClick).toHaveBeenCalledWith("oidc");
   });
 
-  it('should disable buttons when isSubmitting is true', () => {
-    const enabledProviders = ['google', 'github'];
+  it("should disable buttons when isSubmitting is true", () => {
+    const enabledProviders = ["google", "github"];
 
     render(
       <TestWrapper>
@@ -135,17 +135,21 @@ describe('OAuthButtons', () => {
           isSubmitting={true}
           enabledProviders={enabledProviders}
         />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
-    const googleButton = screen.getByText('Google').closest('button') as HTMLButtonElement;
-    const githubButton = screen.getByText('GitHub').closest('button') as HTMLButtonElement;
+    const googleButton = screen
+      .getByText("Google")
+      .closest("button") as HTMLButtonElement;
+    const githubButton = screen
+      .getByText("GitHub")
+      .closest("button") as HTMLButtonElement;
 
     expect(googleButton.disabled).toBe(true);
     expect(githubButton.disabled).toBe(true);
   });
 
-  it('should render nothing when no providers are enabled', () => {
+  it("should render nothing when no providers are enabled", () => {
     const { container } = render(
       <TestWrapper>
         <OAuthButtons
@@ -153,19 +157,19 @@ describe('OAuthButtons', () => {
           isSubmitting={false}
           enabledProviders={[]}
         />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
     // Should render null/nothing (excluding Mantine's style tags)
     const hasContent = Array.from(container.children).some(
-      child => child.tagName.toLowerCase() !== 'style'
+      (child) => child.tagName.toLowerCase() !== "style",
     );
     expect(hasContent).toBe(false);
   });
 
-  it('should render multiple unknown providers with correct IDs', async () => {
+  it("should render multiple unknown providers with correct IDs", async () => {
     const user = userEvent.setup();
-    const enabledProviders = ['company1', 'company2', 'company3'];
+    const enabledProviders = ["company1", "company2", "company3"];
 
     render(
       <TestWrapper>
@@ -174,27 +178,27 @@ describe('OAuthButtons', () => {
           isSubmitting={false}
           enabledProviders={enabledProviders}
         />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
     // All should be capitalized
-    expect(screen.getByText('Company1')).toBeTruthy();
-    expect(screen.getByText('Company2')).toBeTruthy();
-    expect(screen.getByText('Company3')).toBeTruthy();
+    expect(screen.getByText("Company1")).toBeTruthy();
+    expect(screen.getByText("Company2")).toBeTruthy();
+    expect(screen.getByText("Company3")).toBeTruthy();
 
     // Click each and verify correct ID is passed
-    await user.click(screen.getByText('Company1'));
-    expect(mockOnProviderClick).toHaveBeenCalledWith('company1');
+    await user.click(screen.getByText("Company1"));
+    expect(mockOnProviderClick).toHaveBeenCalledWith("company1");
 
-    await user.click(screen.getByText('Company2'));
-    expect(mockOnProviderClick).toHaveBeenCalledWith('company2');
+    await user.click(screen.getByText("Company2"));
+    expect(mockOnProviderClick).toHaveBeenCalledWith("company2");
 
-    await user.click(screen.getByText('Company3'));
-    expect(mockOnProviderClick).toHaveBeenCalledWith('company3');
+    await user.click(screen.getByText("Company3"));
+    expect(mockOnProviderClick).toHaveBeenCalledWith("company3");
   });
 
-  it('should use correct icon for known providers', () => {
-    const enabledProviders = ['google', 'github', 'authentik', 'keycloak'];
+  it("should use correct icon for known providers", () => {
+    const enabledProviders = ["google", "github", "authentik", "keycloak"];
 
     render(
       <TestWrapper>
@@ -203,26 +207,28 @@ describe('OAuthButtons', () => {
           isSubmitting={false}
           enabledProviders={enabledProviders}
         />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
     // Check that each known provider has its specific icon
-    const googleButton = screen.getByText('Google').closest('button');
-    expect(googleButton?.querySelector('img')?.src).toContain('google.svg');
+    const googleButton = screen.getByText("Google").closest("button");
+    expect(googleButton?.querySelector("img")?.src).toContain("google.svg");
 
-    const githubButton = screen.getByText('GitHub').closest('button');
-    expect(githubButton?.querySelector('img')?.src).toContain('github.svg');
+    const githubButton = screen.getByText("GitHub").closest("button");
+    expect(githubButton?.querySelector("img")?.src).toContain("github.svg");
 
-    const authentikButton = screen.getByText('Authentik').closest('button');
-    expect(authentikButton?.querySelector('img')?.src).toContain('authentik.svg');
+    const authentikButton = screen.getByText("Authentik").closest("button");
+    expect(authentikButton?.querySelector("img")?.src).toContain(
+      "authentik.svg",
+    );
 
-    const keycloakButton = screen.getByText('Keycloak').closest('button');
-    expect(keycloakButton?.querySelector('img')?.src).toContain('keycloak.svg');
+    const keycloakButton = screen.getByText("Keycloak").closest("button");
+    expect(keycloakButton?.querySelector("img")?.src).toContain("keycloak.svg");
   });
 
-  it('should handle mixed known and unknown providers', async () => {
+  it("should handle mixed known and unknown providers", async () => {
     const user = userEvent.setup();
-    const enabledProviders = ['google', 'mycompany', 'authentik', 'custom'];
+    const enabledProviders = ["google", "mycompany", "authentik", "custom"];
 
     render(
       <TestWrapper>
@@ -231,39 +237,39 @@ describe('OAuthButtons', () => {
           isSubmitting={false}
           enabledProviders={enabledProviders}
         />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
     // Known providers with correct labels
-    expect(screen.getByText('Google')).toBeTruthy();
-    expect(screen.getByText('Authentik')).toBeTruthy();
+    expect(screen.getByText("Google")).toBeTruthy();
+    expect(screen.getByText("Authentik")).toBeTruthy();
 
     // Unknown providers with capitalized labels
-    expect(screen.getByText('Mycompany')).toBeTruthy();
-    expect(screen.getByText('Custom')).toBeTruthy();
+    expect(screen.getByText("Mycompany")).toBeTruthy();
+    expect(screen.getByText("Custom")).toBeTruthy();
 
     // Click each and verify IDs are preserved
-    await user.click(screen.getByText('Google'));
-    expect(mockOnProviderClick).toHaveBeenCalledWith('google');
+    await user.click(screen.getByText("Google"));
+    expect(mockOnProviderClick).toHaveBeenCalledWith("google");
 
-    await user.click(screen.getByText('Mycompany'));
-    expect(mockOnProviderClick).toHaveBeenCalledWith('mycompany');
+    await user.click(screen.getByText("Mycompany"));
+    expect(mockOnProviderClick).toHaveBeenCalledWith("mycompany");
 
-    await user.click(screen.getByText('Authentik'));
-    expect(mockOnProviderClick).toHaveBeenCalledWith('authentik');
+    await user.click(screen.getByText("Authentik"));
+    expect(mockOnProviderClick).toHaveBeenCalledWith("authentik");
 
-    await user.click(screen.getByText('Custom'));
-    expect(mockOnProviderClick).toHaveBeenCalledWith('custom');
+    await user.click(screen.getByText("Custom"));
+    expect(mockOnProviderClick).toHaveBeenCalledWith("custom");
   });
 
-  it('should maintain provider ID consistency - critical for OAuth redirect', async () => {
+  it("should maintain provider ID consistency - critical for OAuth redirect", async () => {
     const user = userEvent.setup();
 
     // This test ensures the fix for GitHub issue #5141
     // The provider ID used in the button click MUST match the backend registration ID
     // Previously, unknown providers were mapped to 'oidc', breaking the OAuth flow
 
-    const enabledProviders = ['authentik', 'okta', 'auth0'];
+    const enabledProviders = ["authentik", "okta", "auth0"];
 
     render(
       <TestWrapper>
@@ -272,20 +278,20 @@ describe('OAuthButtons', () => {
           isSubmitting={false}
           enabledProviders={enabledProviders}
         />
-      </TestWrapper>
+      </TestWrapper>,
     );
 
     // Each provider should use its actual ID, not 'oidc'
-    await user.click(screen.getByText('Authentik'));
-    expect(mockOnProviderClick).toHaveBeenLastCalledWith('authentik');
+    await user.click(screen.getByText("Authentik"));
+    expect(mockOnProviderClick).toHaveBeenLastCalledWith("authentik");
 
-    await user.click(screen.getByText('Okta'));
-    expect(mockOnProviderClick).toHaveBeenLastCalledWith('okta');
+    await user.click(screen.getByText("Okta"));
+    expect(mockOnProviderClick).toHaveBeenLastCalledWith("okta");
 
-    await user.click(screen.getByText('Auth0'));
-    expect(mockOnProviderClick).toHaveBeenLastCalledWith('auth0');
+    await user.click(screen.getByText("Auth0"));
+    expect(mockOnProviderClick).toHaveBeenLastCalledWith("auth0");
 
     // Verify none were called with 'oidc' instead of their actual ID
-    expect(mockOnProviderClick).not.toHaveBeenCalledWith('oidc');
+    expect(mockOnProviderClick).not.toHaveBeenCalledWith("oidc");
   });
 });
diff --git a/frontend/src/proprietary/routes/login/OAuthButtons.tsx b/frontend/src/proprietary/routes/login/OAuthButtons.tsx
index b6886bbc47..c063690376 100644
--- a/frontend/src/proprietary/routes/login/OAuthButtons.tsx
+++ b/frontend/src/proprietary/routes/login/OAuthButtons.tsx
@@ -1,7 +1,7 @@
-import { useTranslation } from 'react-i18next';
-import { BASE_PATH } from '@app/constants/app';
-import { type OAuthProvider } from '@app/auth/oauthTypes';
-import { Button } from '@mantine/core';
+import { useTranslation } from "react-i18next";
+import { BASE_PATH } from "@app/constants/app";
+import { type OAuthProvider } from "@app/auth/oauthTypes";
+import { Button } from "@mantine/core";
 
 // Debug flag to show all providers for UI testing
 // Set to true to see all SSO options regardless of backend configuration
@@ -9,38 +9,41 @@ export const DEBUG_SHOW_ALL_PROVIDERS = false;
 
 // OAuth provider configuration - maps provider ID to display info
 // Known providers get custom icons; unknown providers use generic SSO icon
-export const oauthProviderConfig: Record<string, { label: string; file: string }> = {
-  google: { label: 'Google', file: 'google.svg' },
-  github: { label: 'GitHub', file: 'github.svg' },
-  apple: { label: 'Apple', file: 'apple.svg' },
-  azure: { label: 'Microsoft', file: 'microsoft.svg' },
-  keycloak: { label: 'Keycloak', file: 'keycloak.svg' },
-  cloudron: { label: 'Cloudron', file: 'cloudron.svg' },
-  authentik: { label: 'Authentik', file: 'authentik.svg' },
-  oidc: { label: 'OIDC', file: 'oidc.svg' }
+export const oauthProviderConfig: Record<
+  string,
+  { label: string; file: string }
+> = {
+  google: { label: "Google", file: "google.svg" },
+  github: { label: "GitHub", file: "github.svg" },
+  apple: { label: "Apple", file: "apple.svg" },
+  azure: { label: "Microsoft", file: "microsoft.svg" },
+  keycloak: { label: "Keycloak", file: "keycloak.svg" },
+  cloudron: { label: "Cloudron", file: "cloudron.svg" },
+  authentik: { label: "Authentik", file: "authentik.svg" },
+  oidc: { label: "OIDC", file: "oidc.svg" },
 };
 
 // Generic fallback for unknown providers
-const GENERIC_PROVIDER_ICON = 'oidc.svg';
+const GENERIC_PROVIDER_ICON = "oidc.svg";
 
 interface OAuthButtonsProps {
-  onProviderClick: (provider: OAuthProvider) => void
-  isSubmitting: boolean
-  layout?: 'vertical' | 'grid' | 'icons'
-  enabledProviders?: OAuthProvider[]  // List of full auth paths from backend (e.g., '/oauth2/authorization/google', '/saml2/authenticate/stirling')
-  ctaPrefix?: string
-  styleVariant?: 'neutral' | 'tinted' | 'outline' | 'light'
-  demoMode?: boolean
-  useNewStyle?: boolean
+  onProviderClick: (provider: OAuthProvider) => void;
+  isSubmitting: boolean;
+  layout?: "vertical" | "grid" | "icons";
+  enabledProviders?: OAuthProvider[]; // List of full auth paths from backend (e.g., '/oauth2/authorization/google', '/saml2/authenticate/stirling')
+  ctaPrefix?: string;
+  styleVariant?: "neutral" | "tinted" | "outline" | "light";
+  demoMode?: boolean;
+  useNewStyle?: boolean;
 }
 
 export default function OAuthButtons({
   onProviderClick,
   isSubmitting,
-  layout = 'vertical',
+  layout = "vertical",
   enabledProviders = [],
   ctaPrefix,
-  styleVariant = 'neutral',
+  styleVariant = "neutral",
   demoMode = false,
   useNewStyle = false,
 }: OAuthButtonsProps) {
@@ -52,24 +55,24 @@ export default function OAuthButtons({
     : enabledProviders;
 
   // Build provider list - extract provider ID from full path for display
-  const providers = providersToShow.map(pathOrId => {
+  const providers = providersToShow.map((pathOrId) => {
     // Extract provider ID from full path (e.g., '/saml2/authenticate/stirling' -> 'stirling')
-    const providerId = pathOrId.split('/').pop() || pathOrId;
+    const providerId = pathOrId.split("/").pop() || pathOrId;
 
     if (providerId in oauthProviderConfig) {
       // Known provider - use predefined icon and label
       return {
-        id: pathOrId,  // Keep full path for redirect
-        providerId,    // Store extracted ID for display lookup
-        ...oauthProviderConfig[providerId]
+        id: pathOrId, // Keep full path for redirect
+        providerId, // Store extracted ID for display lookup
+        ...oauthProviderConfig[providerId],
       };
     }
     // Unknown provider - use generic icon and capitalize ID for label
     return {
-      id: pathOrId,  // Keep full path for redirect
-      providerId,    // Store extracted ID for display lookup
+      id: pathOrId, // Keep full path for redirect
+      providerId, // Store extracted ID for display lookup
       label: providerId.charAt(0).toUpperCase() + providerId.slice(1),
-      file: GENERIC_PROVIDER_ICON
+      file: GENERIC_PROVIDER_ICON,
     };
   });
 
@@ -79,33 +82,40 @@ export default function OAuthButtons({
   }
 
   const isSingleProvider = providers.length === 1;
-  const isTinted = styleVariant === 'tinted';
-  const isOutline = styleVariant === 'outline';
-  const isLight = styleVariant === 'light';
+  const isTinted = styleVariant === "tinted";
+  const isOutline = styleVariant === "outline";
+  const isLight = styleVariant === "light";
   const accentMap: Record<string, string> = {
-    google: '#4285F4',
-    github: '#111827',
-    apple: '#111827',
-    azure: '#0078D4',
-    keycloak: '#2C2C2C',
-    cloudron: '#3B82F6',
-    authentik: '#FA7B17',
-    oidc: '#334155',
+    google: "#4285F4",
+    github: "#111827",
+    apple: "#111827",
+    azure: "#0078D4",
+    keycloak: "#2C2C2C",
+    cloudron: "#3B82F6",
+    authentik: "#FA7B17",
+    oidc: "#334155",
   };
 
-  if (layout === 'icons') {
+  if (layout === "icons") {
     return (
       <div className="oauth-container-icons">
         {providers.map((p) => (
-          <div key={p.id} title={`${t('login.signInWith', 'Sign in with')} ${p.label}`}>
+          <div
+            key={p.id}
+            title={`${t("login.signInWith", "Sign in with")} ${p.label}`}
+          >
             <Button
               onClick={() => onProviderClick(p.id)}
               disabled={isSubmitting}
               className="oauth-button-icon"
-              aria-label={`${t('login.signInWith', 'Sign in with')} ${p.label}`}
+              aria-label={`${t("login.signInWith", "Sign in with")} ${p.label}`}
               variant="default"
             >
-              <img src={`${BASE_PATH}/Login/${p.file}`} alt={p.label} className="oauth-icon-small"/>
+              <img
+                src={`${BASE_PATH}/Login/${p.file}`}
+                alt={p.label}
+                className="oauth-icon-small"
+              />
             </Button>
           </div>
         ))}
@@ -113,19 +123,26 @@ export default function OAuthButtons({
     );
   }
 
-  if (layout === 'grid') {
+  if (layout === "grid") {
     return (
       <div className="oauth-container-grid">
         {providers.map((p) => (
-          <div key={p.id} title={`${t('login.signInWith', 'Sign in with')} ${p.label}`}>
+          <div
+            key={p.id}
+            title={`${t("login.signInWith", "Sign in with")} ${p.label}`}
+          >
             <Button
               onClick={() => onProviderClick(p.id)}
               disabled={isSubmitting}
               className="oauth-button-grid"
-              aria-label={`${t('login.signInWith', 'Sign in with')} ${p.label}`}
+              aria-label={`${t("login.signInWith", "Sign in with")} ${p.label}`}
               variant="default"
             >
-              <img src={`${BASE_PATH}/Login/${p.file}`} alt={p.label} className="oauth-icon-medium"/>
+              <img
+                src={`${BASE_PATH}/Login/${p.file}`}
+                alt={p.label}
+                className="oauth-icon-medium"
+              />
             </Button>
           </div>
         ))}
@@ -134,27 +151,54 @@ export default function OAuthButtons({
   }
 
   return (
-    <div className={`oauth-container-vertical${useNewStyle && isSingleProvider ? ' oauth-container-single' : ''}`}>
+    <div
+      className={`oauth-container-vertical${useNewStyle && isSingleProvider ? " oauth-container-single" : ""}`}
+    >
       {providers.map((p) => (
-        <div key={p.id} title={`${t('login.signInWith', 'Sign in with')} ${p.label}`}>
+        <div
+          key={p.id}
+          title={`${t("login.signInWith", "Sign in with")} ${p.label}`}
+        >
           <Button
             onClick={() => onProviderClick(p.id)}
             disabled={!demoMode && isSubmitting}
-            className={`oauth-button-vertical${useNewStyle && isSingleProvider ? ' oauth-button-vertical-single' : ''}${!useNewStyle ? ' oauth-button-vertical-legacy' : ''}${isTinted ? ' oauth-button-vertical-tinted' : ''}${isOutline ? ' oauth-button-vertical-outline' : ''}${isLight ? ' oauth-button-vertical-light' : ''}`}
-            aria-label={`${t('login.signInWith', 'Sign in with')} ${p.label}`}
+            className={`oauth-button-vertical${useNewStyle && isSingleProvider ? " oauth-button-vertical-single" : ""}${!useNewStyle ? " oauth-button-vertical-legacy" : ""}${isTinted ? " oauth-button-vertical-tinted" : ""}${isOutline ? " oauth-button-vertical-outline" : ""}${isLight ? " oauth-button-vertical-light" : ""}`}
+            aria-label={`${t("login.signInWith", "Sign in with")} ${p.label}`}
             variant="default"
-            style={isTinted ? { '--oauth-accent': accentMap[p.providerId] || '#334155' } as React.CSSProperties : undefined}
+            style={
+              isTinted
+                ? ({
+                    "--oauth-accent": accentMap[p.providerId] || "#334155",
+                  } as React.CSSProperties)
+                : undefined
+            }
           >
             <span className="oauth-button-left">
               <span className="oauth-icon-wrapper">
-                <img src={`${BASE_PATH}/Login/${p.file}`} alt={p.label} className="oauth-icon-tiny" />
+                <img
+                  src={`${BASE_PATH}/Login/${p.file}`}
+                  alt={p.label}
+                  className="oauth-icon-tiny"
+                />
+              </span>
+              <span className="oauth-button-text">
+                {ctaPrefix ? `${ctaPrefix} ${p.label}` : p.label}
               </span>
-              <span className="oauth-button-text">{ctaPrefix ? `${ctaPrefix} ${p.label}` : p.label}</span>
             </span>
             {useNewStyle && isSingleProvider && (
               <span className="oauth-button-right" aria-hidden="true">
-                <svg className="oauth-arrow-icon" viewBox="0 0 24 24" fill="none">
-                  <path d="M5 12h12m0 0-5-5m5 5-5 5" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" />
+                <svg
+                  className="oauth-arrow-icon"
+                  viewBox="0 0 24 24"
+                  fill="none"
+                >
+                  <path
+                    d="M5 12h12m0 0-5-5m5 5-5 5"
+                    stroke="currentColor"
+                    strokeWidth="2"
+                    strokeLinecap="round"
+                    strokeLinejoin="round"
+                  />
                 </svg>
               </span>
             )}
diff --git a/frontend/src/proprietary/routes/signup/AuthService.ts b/frontend/src/proprietary/routes/signup/AuthService.ts
index d21bbc062d..17158b4084 100644
--- a/frontend/src/proprietary/routes/signup/AuthService.ts
+++ b/frontend/src/proprietary/routes/signup/AuthService.ts
@@ -1,45 +1,42 @@
-import { springAuth } from '@app/auth/springAuthClient';
-import { BASE_PATH } from '@app/constants/app';
+import { springAuth } from "@app/auth/springAuthClient";
+import { BASE_PATH } from "@app/constants/app";
 
 export const useAuthService = () => {
-
-  const signUp = async (
-    email: string,
-    password: string,
-    name: string
-  ) => {
-    console.log('[Signup] Creating account for:', email);
+  const signUp = async (email: string, password: string, name: string) => {
+    console.log("[Signup] Creating account for:", email);
 
     const { user, session, error } = await springAuth.signUp({
       email: email.trim(),
       password: password,
       options: {
         data: { full_name: name },
-        emailRedirectTo: `${BASE_PATH}/auth/callback`
-      }
+        emailRedirectTo: `${BASE_PATH}/auth/callback`,
+      },
     });
 
     if (error) {
-      console.error('[Signup] Sign up error:', error);
+      console.error("[Signup] Sign up error:", error);
       throw new Error(error.message);
     }
 
     if (user) {
-      console.log('[Signup] Sign up successful:', user);
+      console.log("[Signup] Sign up successful:", user);
       return {
         user: user,
         session: session,
-        requiresEmailConfirmation: user && !session
+        requiresEmailConfirmation: user && !session,
       };
     }
 
-    throw new Error('Unknown error occurred during signup');
+    throw new Error("Unknown error occurred during signup");
   };
 
-  const signInWithProvider = async (provider: 'github' | 'google' | 'apple' | 'azure') => {
+  const signInWithProvider = async (
+    provider: "github" | "google" | "apple" | "azure",
+  ) => {
     const { error } = await springAuth.signInWithOAuth({
       provider,
-      options: { redirectTo: `${BASE_PATH}/auth/callback` }
+      options: { redirectTo: `${BASE_PATH}/auth/callback` },
     });
 
     if (error) {
@@ -49,7 +46,6 @@ export const useAuthService = () => {
 
   return {
     signUp,
-    signInWithProvider
+    signInWithProvider,
   };
-}
-;
+};
diff --git a/frontend/src/proprietary/routes/signup/SignupForm.tsx b/frontend/src/proprietary/routes/signup/SignupForm.tsx
index 92c06c319f..d12c54be53 100644
--- a/frontend/src/proprietary/routes/signup/SignupForm.tsx
+++ b/frontend/src/proprietary/routes/signup/SignupForm.tsx
@@ -1,29 +1,29 @@
-import { useEffect } from 'react';
-import '@app/routes/authShared/auth.css';
-import { useTranslation } from 'react-i18next';
-import { Checkbox, TextInput, PasswordInput, Button } from '@mantine/core';
-import { SignupFieldErrors } from '@app/routes/signup/SignupFormValidation';
+import { useEffect } from "react";
+import "@app/routes/authShared/auth.css";
+import { useTranslation } from "react-i18next";
+import { Checkbox, TextInput, PasswordInput, Button } from "@mantine/core";
+import { SignupFieldErrors } from "@app/routes/signup/SignupFormValidation";
 
 interface SignupFormProps {
-  name?: string
-  email: string
-  password: string
-  confirmPassword: string
-  agree?: boolean
-  setName?: (name: string) => void
-  setEmail: (email: string) => void
-  setPassword: (password: string) => void
-  setConfirmPassword: (password: string) => void
-  setAgree?: (agree: boolean) => void
-  onSubmit: () => void
-  isSubmitting: boolean
-  fieldErrors?: SignupFieldErrors
-  showName?: boolean
-  showTerms?: boolean
+  name?: string;
+  email: string;
+  password: string;
+  confirmPassword: string;
+  agree?: boolean;
+  setName?: (name: string) => void;
+  setEmail: (email: string) => void;
+  setPassword: (password: string) => void;
+  setConfirmPassword: (password: string) => void;
+  setAgree?: (agree: boolean) => void;
+  onSubmit: () => void;
+  isSubmitting: boolean;
+  fieldErrors?: SignupFieldErrors;
+  showName?: boolean;
+  showTerms?: boolean;
 }
 
 export default function SignupForm({
-  name = '',
+  name = "",
   email,
   password,
   confirmPassword,
@@ -37,14 +37,14 @@ export default function SignupForm({
   isSubmitting,
   fieldErrors = {},
   showName = false,
-  showTerms = false
+  showTerms = false,
 }: SignupFormProps) {
   const { t } = useTranslation();
   const showConfirm = password.length >= 4;
 
   useEffect(() => {
     if (!showConfirm && confirmPassword) {
-      setConfirmPassword('');
+      setConfirmPassword("");
     }
   }, [showConfirm, confirmPassword, setConfirmPassword]);
 
@@ -55,14 +55,14 @@ export default function SignupForm({
           <div className="auth-field">
             <TextInput
               id="name"
-              label={t('signup.name')}
+              label={t("signup.name")}
               name="name"
               autoComplete="name"
-              placeholder={t('signup.enterName')}
+              placeholder={t("signup.enterName")}
               value={name}
               onChange={(e) => setName?.(e.target.value)}
               error={fieldErrors.name}
-              classNames={{ label: 'auth-label' }}
+              classNames={{ label: "auth-label" }}
             />
           </div>
         )}
@@ -70,51 +70,56 @@ export default function SignupForm({
         <div className="auth-field">
           <TextInput
             id="email"
-            label={t('signup.email')}
+            label={t("signup.email")}
             type="email"
             name="email"
             autoComplete="email"
-            placeholder={t('signup.enterEmail')}
+            placeholder={t("signup.enterEmail")}
             value={email}
             onChange={(e) => setEmail(e.target.value)}
-            onKeyDown={(e) => e.key === 'Enter' && !isSubmitting && onSubmit()}
+            onKeyDown={(e) => e.key === "Enter" && !isSubmitting && onSubmit()}
             error={fieldErrors.email}
-            classNames={{ label: 'auth-label' }}
+            classNames={{ label: "auth-label" }}
           />
         </div>
 
         <div className="auth-field">
           <PasswordInput
             id="password"
-            label={t('signup.password')}
+            label={t("signup.password")}
             name="new-password"
             autoComplete="new-password"
-            placeholder={t('signup.enterPassword')}
+            placeholder={t("signup.enterPassword")}
             value={password}
             onChange={(e) => setPassword(e.target.value)}
-            onKeyDown={(e) => e.key === 'Enter' && !isSubmitting && onSubmit()}
+            onKeyDown={(e) => e.key === "Enter" && !isSubmitting && onSubmit()}
             error={fieldErrors.password}
-            classNames={{ label: 'auth-label' }}
+            classNames={{ label: "auth-label" }}
           />
         </div>
 
         <div
           aria-hidden={!showConfirm}
           className="auth-confirm"
-          style={{ maxHeight: showConfirm ? 96 : 0, opacity: showConfirm ? 1 : 0 }}
+          style={{
+            maxHeight: showConfirm ? 96 : 0,
+            opacity: showConfirm ? 1 : 0,
+          }}
         >
           <div className="auth-field">
             <PasswordInput
               id="confirmPassword"
-              label={t('signup.confirmPassword')}
+              label={t("signup.confirmPassword")}
               name="new-password"
               autoComplete="new-password"
-              placeholder={t('signup.confirmPasswordPlaceholder')}
+              placeholder={t("signup.confirmPasswordPlaceholder")}
               value={confirmPassword}
               onChange={(e) => setConfirmPassword(e.target.value)}
-              onKeyDown={(e) => e.key === 'Enter' && !isSubmitting && onSubmit()}
+              onKeyDown={(e) =>
+                e.key === "Enter" && !isSubmitting && onSubmit()
+              }
               error={fieldErrors.confirmPassword}
-              classNames={{ label: 'auth-label' }}
+              classNames={{ label: "auth-label" }}
             />
           </div>
         </div>
@@ -130,9 +135,13 @@ export default function SignupForm({
             className="auth-checkbox"
             label={
               <span className="auth-terms-label">
-                {t("legal.iAgreeToThe", 'I agree to all of the')}{' '}
-                <a href="https://www.stirlingpdf.com/terms" target="_blank" rel="noopener noreferrer">
-                  {t('legal.terms', 'Terms and Conditions')}
+                {t("legal.iAgreeToThe", "I agree to all of the")}{" "}
+                <a
+                  href="https://www.stirlingpdf.com/terms"
+                  target="_blank"
+                  rel="noopener noreferrer"
+                >
+                  {t("legal.terms", "Terms and Conditions")}
                 </a>
               </span>
             }
@@ -143,12 +152,18 @@ export default function SignupForm({
       {/* Sign Up Button */}
       <Button
         onClick={onSubmit}
-        disabled={isSubmitting || !email || !password || !confirmPassword || (showTerms && !agree)}
+        disabled={
+          isSubmitting ||
+          !email ||
+          !password ||
+          !confirmPassword ||
+          (showTerms && !agree)
+        }
         className="auth-button"
         fullWidth
         loading={isSubmitting}
       >
-        {isSubmitting ? t('signup.creatingAccount') : t('signup.signUp')}
+        {isSubmitting ? t("signup.creatingAccount") : t("signup.signUp")}
       </Button>
     </>
   );
diff --git a/frontend/src/proprietary/routes/signup/SignupFormValidation.ts b/frontend/src/proprietary/routes/signup/SignupFormValidation.ts
index 40c1ad7e7e..2dd11a02b3 100644
--- a/frontend/src/proprietary/routes/signup/SignupFormValidation.ts
+++ b/frontend/src/proprietary/routes/signup/SignupFormValidation.ts
@@ -1,16 +1,16 @@
-import { useTranslation } from 'react-i18next';
+import { useTranslation } from "react-i18next";
 
 export interface SignupFieldErrors {
-  name?: string
-  email?: string
-  password?: string
-  confirmPassword?: string
+  name?: string;
+  email?: string;
+  password?: string;
+  confirmPassword?: string;
 }
 
 export interface SignupValidationResult {
-  isValid: boolean
-  error: string | null
-  fieldErrors?: SignupFieldErrors
+  isValid: boolean;
+  error: string | null;
+  fieldErrors?: SignupFieldErrors;
 }
 
 export const useSignupFormValidation = () => {
@@ -20,35 +20,41 @@ export const useSignupFormValidation = () => {
     email: string,
     password: string,
     confirmPassword: string,
-    name?: string
+    name?: string,
   ): SignupValidationResult => {
     const fieldErrors: SignupFieldErrors = {};
 
     // Validate name
     if (name !== undefined && name !== null && !name.trim()) {
-      fieldErrors.name = t('signup.nameRequired', 'Name is required');
+      fieldErrors.name = t("signup.nameRequired", "Name is required");
     }
 
     // Validate email
     const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
     if (!email) {
-      fieldErrors.email = t('signup.emailRequired', 'Email is required');
+      fieldErrors.email = t("signup.emailRequired", "Email is required");
     } else if (!emailRegex.test(email)) {
-      fieldErrors.email = t('signup.invalidEmail');
+      fieldErrors.email = t("signup.invalidEmail");
     }
 
     // Validate password
     if (!password) {
-      fieldErrors.password = t('signup.passwordRequired', 'Password is required');
+      fieldErrors.password = t(
+        "signup.passwordRequired",
+        "Password is required",
+      );
     } else if (password.length < 6) {
-      fieldErrors.password = t('signup.passwordTooShort');
+      fieldErrors.password = t("signup.passwordTooShort");
     }
 
     // Validate confirm password
     if (!confirmPassword) {
-      fieldErrors.confirmPassword = t('signup.confirmPasswordRequired', 'Please confirm your password');
+      fieldErrors.confirmPassword = t(
+        "signup.confirmPasswordRequired",
+        "Please confirm your password",
+      );
     } else if (password !== confirmPassword) {
-      fieldErrors.confirmPassword = t('signup.passwordsDoNotMatch');
+      fieldErrors.confirmPassword = t("signup.passwordsDoNotMatch");
     }
 
     const hasErrors = Object.keys(fieldErrors).length > 0;
@@ -56,11 +62,11 @@ export const useSignupFormValidation = () => {
     return {
       isValid: !hasErrors,
       error: null, // Don't show generic error, field errors are more specific
-      fieldErrors: hasErrors ? fieldErrors : undefined
+      fieldErrors: hasErrors ? fieldErrors : undefined,
     };
   };
 
   return {
-    validateSignupForm
+    validateSignupForm,
   };
-};
\ No newline at end of file
+};
diff --git a/frontend/src/proprietary/services/apiClientSetup.ts b/frontend/src/proprietary/services/apiClientSetup.ts
index 91c354999c..66a8132e83 100644
--- a/frontend/src/proprietary/services/apiClientSetup.ts
+++ b/frontend/src/proprietary/services/apiClientSetup.ts
@@ -1,4 +1,4 @@
-import { AxiosInstance, AxiosError, InternalAxiosRequestConfig } from 'axios';
+import { AxiosInstance, AxiosError, InternalAxiosRequestConfig } from "axios";
 
 let isRefreshing = false;
 let failedQueue: Array<{
@@ -8,43 +8,46 @@ let failedQueue: Array<{
 
 function getJwtTokenFromStorage(): string | null {
   try {
-    return localStorage.getItem('stirling_jwt');
+    return localStorage.getItem("stirling_jwt");
   } catch (error) {
-    console.error('[API Client] Failed to read JWT from localStorage:', error);
+    console.error("[API Client] Failed to read JWT from localStorage:", error);
     return null;
   }
 }
 
 function setJwtTokenInStorage(token: string): void {
   try {
-    localStorage.setItem('stirling_jwt', token);
-    console.debug('[API Client] Stored new JWT token in localStorage');
+    localStorage.setItem("stirling_jwt", token);
+    console.debug("[API Client] Stored new JWT token in localStorage");
   } catch (error) {
-    console.error('[API Client] Failed to store JWT in localStorage:', error);
+    console.error("[API Client] Failed to store JWT in localStorage:", error);
   }
 }
 
 function clearJwtTokenFromStorage(): void {
   try {
-    localStorage.removeItem('stirling_jwt');
-    console.debug('[API Client] Cleared JWT token from localStorage');
+    localStorage.removeItem("stirling_jwt");
+    console.debug("[API Client] Cleared JWT token from localStorage");
   } catch (error) {
-    console.error('[API Client] Failed to clear JWT from localStorage:', error);
+    console.error("[API Client] Failed to clear JWT from localStorage:", error);
   }
 }
 
 function getXsrfToken(): string | null {
   try {
-    const cookies = document.cookie.split(';');
+    const cookies = document.cookie.split(";");
     for (const cookie of cookies) {
-      const [name, value] = cookie.trim().split('=');
-      if (name === 'XSRF-TOKEN') {
+      const [name, value] = cookie.trim().split("=");
+      if (name === "XSRF-TOKEN") {
         return decodeURIComponent(value);
       }
     }
     return null;
   } catch (error) {
-    console.error('[API Client] Failed to read XSRF token from cookies:', error);
+    console.error(
+      "[API Client] Failed to read XSRF token from cookies:",
+      error,
+    );
     return null;
   }
 }
@@ -61,71 +64,87 @@ function processQueue(error: Error | null, token: string | null = null): void {
 }
 
 async function refreshAuthToken(client: AxiosInstance): Promise<string> {
-  console.log('[API Client] Refreshing expired JWT token...');
+  console.log("[API Client] Refreshing expired JWT token...");
 
   try {
-    const response = await client.post('/api/v1/auth/refresh', {}, {
-      // Don't retry refresh requests to avoid infinite loops
-      headers: { 'X-Skip-Auth-Refresh': 'true' }
-    });
+    const response = await client.post(
+      "/api/v1/auth/refresh",
+      {},
+      {
+        // Don't retry refresh requests to avoid infinite loops
+        headers: { "X-Skip-Auth-Refresh": "true" },
+      },
+    );
 
     const newToken = response.data?.session?.access_token;
     if (!newToken) {
-      throw new Error('No access token in refresh response');
+      throw new Error("No access token in refresh response");
     }
 
     setJwtTokenInStorage(newToken);
-    console.log('[API Client] ✅ Token refreshed successfully');
+    console.log("[API Client] ✅ Token refreshed successfully");
     return newToken;
   } catch (error) {
-    console.error('[API Client] � Token refresh failed:', error);
+    console.error("[API Client] � Token refresh failed:", error);
     clearJwtTokenFromStorage();
 
     // Redirect to login
-    if (window.location.pathname !== '/login') {
-      console.log('[API Client] Redirecting to login page...');
-      window.location.href = '/login';
+    if (window.location.pathname !== "/login") {
+      console.log("[API Client] Redirecting to login page...");
+      window.location.href = "/login";
     }
 
     throw error;
   }
 }
 
+/** Auth headers for raw fetch() calls (SSE streams, etc.). */
+export function getAuthHeaders(): Record<string, string> {
+  const headers: Record<string, string> = {};
+  const jwt = getJwtTokenFromStorage();
+  if (jwt) {
+    headers["Authorization"] = `Bearer ${jwt}`;
+  }
+  const xsrf = getXsrfToken();
+  if (xsrf) {
+    headers["X-XSRF-TOKEN"] = xsrf;
+  }
+  return headers;
+}
+
 export function setupApiInterceptors(client: AxiosInstance): void {
   // Install request interceptor to add JWT token
   client.interceptors.request.use(
     (config) => {
-      const jwtToken = getJwtTokenFromStorage();
-      const xsrfToken = getXsrfToken();
-
-      if (jwtToken && !config.headers.Authorization) {
-        config.headers.Authorization = `Bearer ${jwtToken}`;
-        console.debug('[API Client] Added JWT token from localStorage to Authorization header');
-      }
-
-      if (xsrfToken && !config.headers['X-XSRF-TOKEN']) {
-        config.headers['X-XSRF-TOKEN'] = xsrfToken;
+      const authHeaders = getAuthHeaders();
+      for (const [key, value] of Object.entries(authHeaders)) {
+        if (!config.headers[key]) {
+          config.headers[key] = value;
+        }
       }
 
       return config;
     },
     (error) => {
       return Promise.reject(error);
-    }
+    },
   );
 
   // Install response interceptor to handle 401 and auto-refresh token
   client.interceptors.response.use(
     (response) => response,
     async (error: AxiosError) => {
-      const originalRequest = error.config as InternalAxiosRequestConfig & { _retry?: boolean };
+      const originalRequest = error.config as InternalAxiosRequestConfig & {
+        _retry?: boolean;
+      };
 
       // Skip refresh for auth endpoints or if explicitly disabled
       // Exception: /auth/me should trigger refresh (used by getSession)
       if (
         !originalRequest ||
-        (originalRequest.url?.includes('/api/v1/auth/') && !originalRequest.url?.includes('/api/v1/auth/me')) ||
-        originalRequest.headers?.['X-Skip-Auth-Refresh'] ||
+        (originalRequest.url?.includes("/api/v1/auth/") &&
+          !originalRequest.url?.includes("/api/v1/auth/me")) ||
+        originalRequest.headers?.["X-Skip-Auth-Refresh"] ||
         originalRequest._retry
       ) {
         return Promise.reject(error);
@@ -133,7 +152,9 @@ export function setupApiInterceptors(client: AxiosInstance): void {
 
       // Handle 401 errors by attempting token refresh
       if (error.response?.status === 401 && getJwtTokenFromStorage()) {
-        console.warn('[API Client] Received 401 error, attempting token refresh...');
+        console.warn(
+          "[API Client] Received 401 error, attempting token refresh...",
+        );
 
         if (isRefreshing) {
           // Already refreshing - queue this request
@@ -168,6 +189,6 @@ export function setupApiInterceptors(client: AxiosInstance): void {
       }
 
       return Promise.reject(error);
-    }
+    },
   );
 }
diff --git a/frontend/src/proprietary/services/databaseManagementService.ts b/frontend/src/proprietary/services/databaseManagementService.ts
index 9755c366f1..fc7208e142 100644
--- a/frontend/src/proprietary/services/databaseManagementService.ts
+++ b/frontend/src/proprietary/services/databaseManagementService.ts
@@ -17,9 +17,12 @@ export interface DatabaseData {
 
 const databaseManagementService = {
   async getDatabaseData(): Promise<DatabaseData> {
-    const response = await apiClient.get<DatabaseData>("/api/v1/proprietary/ui-data/database", {
-      suppressErrorToast: true,
-    });
+    const response = await apiClient.get<DatabaseData>(
+      "/api/v1/proprietary/ui-data/database",
+      {
+        suppressErrorToast: true,
+      },
+    );
     return response.data;
   },
 
@@ -28,7 +31,9 @@ const databaseManagementService = {
   },
 
   async importFromFileName(fileName: string): Promise<void> {
-    await apiClient.get(`/api/v1/database/import-database-file/${encodeURIComponent(fileName)}`);
+    await apiClient.get(
+      `/api/v1/database/import-database-file/${encodeURIComponent(fileName)}`,
+    );
   },
 
   async uploadAndImport(file: File): Promise<void> {
@@ -39,13 +44,18 @@ const databaseManagementService = {
   },
 
   async deleteBackup(fileName: string): Promise<void> {
-    await apiClient.get(`/api/v1/database/delete/${encodeURIComponent(fileName)}`);
+    await apiClient.get(
+      `/api/v1/database/delete/${encodeURIComponent(fileName)}`,
+    );
   },
 
   async downloadBackup(fileName: string): Promise<Blob> {
-    const response = await apiClient.get(`/api/v1/database/download/${encodeURIComponent(fileName)}`, {
-      responseType: "blob",
-    });
+    const response = await apiClient.get(
+      `/api/v1/database/download/${encodeURIComponent(fileName)}`,
+      {
+        responseType: "blob",
+      },
+    );
     return response.data;
   },
 };
diff --git a/frontend/src/proprietary/services/licenseService.ts b/frontend/src/proprietary/services/licenseService.ts
index 9767d5820f..e6dfc0a8f3 100644
--- a/frontend/src/proprietary/services/licenseService.ts
+++ b/frontend/src/proprietary/services/licenseService.ts
@@ -1,8 +1,8 @@
-import apiClient from '@app/services/apiClient';
-import { supabase, isSupabaseConfigured } from '@app/services/supabaseClient';
-import { getCheckoutMode } from '@app/utils/protocolDetection';
-import { PLAN_FEATURES, PLAN_HIGHLIGHTS } from '@app/constants/planConstants';
-import type { LicenseInfo, PlanFeature } from '@app/types/license';
+import apiClient from "@app/services/apiClient";
+import { supabase, isSupabaseConfigured } from "@app/services/supabaseClient";
+import { getCheckoutMode } from "@app/utils/protocolDetection";
+import { PLAN_FEATURES, PLAN_HIGHLIGHTS } from "@app/constants/planConstants";
+import type { LicenseInfo, PlanFeature } from "@app/types/license";
 
 export interface PlanTier {
   id: string;
@@ -14,13 +14,13 @@ export interface PlanTier {
   features: PlanFeature[];
   highlights: readonly string[];
   isContactOnly?: boolean;
-  seatPrice?: number;        // Per-seat price for enterprise plans
-  requiresSeats?: boolean;   // Flag indicating seat selection is needed
-  lookupKey: string;         // Stripe lookup key for this plan
+  seatPrice?: number; // Per-seat price for enterprise plans
+  requiresSeats?: boolean; // Flag indicating seat selection is needed
+  lookupKey: string; // Stripe lookup key for this plan
 }
 
 export interface PlanTierGroup {
-  tier: 'free' | 'server' | 'enterprise';
+  tier: "free" | "server" | "enterprise";
   name: string;
   monthly: PlanTier | null;
   yearly: PlanTier | null;
@@ -34,12 +34,12 @@ export interface PlansResponse {
 }
 
 export interface CheckoutSessionRequest {
-  lookup_key: string;       // Stripe lookup key (e.g., 'selfhosted:server:monthly')
+  lookup_key: string; // Stripe lookup key (e.g., 'selfhosted:server:monthly')
   installation_id?: string; // Installation ID from backend (MAC-based fingerprint)
   current_license_key?: string; // Current license key for upgrades
   requires_seats?: boolean; // Whether to add adjustable seat pricing
-  seat_count?: number;      // Initial number of seats for enterprise plans (user can adjust in Stripe UI)
-  email?: string;           // Customer email for checkout pre-fill
+  seat_count?: number; // Initial number of seats for enterprise plans (user can adjust in Stripe UI)
+  email?: string; // Customer email for checkout pre-fill
   successUrl?: string;
   cancelUrl?: string;
 }
@@ -47,7 +47,7 @@ export interface CheckoutSessionRequest {
 export interface CheckoutSessionResponse {
   clientSecret: string;
   sessionId: string;
-  url?: string;  // URL for hosted checkout (when not using HTTPS)
+  url?: string; // URL for hosted checkout (when not using HTTPS)
 }
 
 export interface BillingPortalResponse {
@@ -59,7 +59,7 @@ export interface InstallationIdResponse {
 }
 
 export interface LicenseKeyResponse {
-  status: 'ready' | 'pending';
+  status: "ready" | "pending";
   license_key?: string;
   email?: string;
   plan?: string;
@@ -81,48 +81,53 @@ export interface LicenseSaveResponse {
 // Currency symbol mapping
 const getCurrencySymbol = (currency: string): string => {
   const currencySymbols: { [key: string]: string } = {
-    'gbp': '£',
-    'usd': '$',
-    'eur': '€',
-    'cny': 'Â¥',
-    'inr': '₹',
-    'brl': 'R$',
-    'idr': 'Rp'
+    gbp: "£",
+    usd: "$",
+    eur: "€",
+    cny: "Â¥",
+    inr: "₹",
+    brl: "R$",
+    idr: "Rp",
   };
   return currencySymbols[currency.toLowerCase()] || currency.toUpperCase();
 };
 
 // Self-hosted plan lookup keys
 const SELF_HOSTED_LOOKUP_KEYS = [
-  'selfhosted:server:monthly',
-  'selfhosted:server:yearly',
-  'selfhosted:enterpriseseat:monthly',
-  'selfhosted:enterpriseseat:yearly',
+  "selfhosted:server:monthly",
+  "selfhosted:server:yearly",
+  "selfhosted:enterpriseseat:monthly",
+  "selfhosted:enterpriseseat:yearly",
 ];
 
 const licenseService = {
   /**
    * Get available plans with pricing for the specified currency
    */
-  async getPlans(currency: string = 'usd'): Promise<PlansResponse> {
+  async getPlans(currency: string = "usd"): Promise<PlansResponse> {
     try {
       // Check if Supabase is configured
       if (!isSupabaseConfigured || !supabase) {
-        throw new Error('Supabase is not configured. Please use static plans instead.');
+        throw new Error(
+          "Supabase is not configured. Please use static plans instead.",
+        );
       }
 
       // Fetch all self-hosted prices from Stripe
       const { data, error } = await supabase.functions.invoke<{
-        prices: Record<string, {
-          unit_amount: number;
-          currency: string;
-          lookup_key: string;
-        }>;
+        prices: Record<
+          string,
+          {
+            unit_amount: number;
+            currency: string;
+            lookup_key: string;
+          }
+        >;
         missing: string[];
-      }>('stripe-price-lookup', {
+      }>("stripe-price-lookup", {
         body: {
           lookup_keys: SELF_HOSTED_LOOKUP_KEYS,
-          currency
+          currency,
         },
       });
 
@@ -131,20 +136,28 @@ const licenseService = {
       }
 
       if (!data || !data.prices) {
-        throw new Error('No pricing data returned');
+        throw new Error("No pricing data returned");
       }
 
       // Log missing prices for debugging
       if (data.missing && data.missing.length > 0) {
-        console.warn('Missing Stripe prices for lookup keys:', data.missing, 'in currency:', currency);
+        console.warn(
+          "Missing Stripe prices for lookup keys:",
+          data.missing,
+          "in currency:",
+          currency,
+        );
       }
 
       // Build price map for easy access
-      const priceMap = new Map<string, { unit_amount: number; currency: string }>();
+      const priceMap = new Map<
+        string,
+        { unit_amount: number; currency: string }
+      >();
       for (const [lookupKey, priceData] of Object.entries(data.prices)) {
         priceMap.set(lookupKey, {
           unit_amount: priceData.unit_amount,
-          currency: priceData.currency
+          currency: priceData.currency,
         });
       }
 
@@ -159,83 +172,85 @@ const licenseService = {
       // Build plan tiers
       const plans: PlanTier[] = [
         {
-          id: 'selfhosted:server:monthly',
-          lookupKey: 'selfhosted:server:monthly',
-          name: 'Server - Monthly',
-          price: getPriceInfo('selfhosted:server:monthly'),
+          id: "selfhosted:server:monthly",
+          lookupKey: "selfhosted:server:monthly",
+          name: "Server - Monthly",
+          price: getPriceInfo("selfhosted:server:monthly"),
           currency: currencySymbol,
-          period: '/month',
+          period: "/month",
           popular: false,
           features: PLAN_FEATURES.SERVER,
-          highlights: PLAN_HIGHLIGHTS.SERVER_MONTHLY
+          highlights: PLAN_HIGHLIGHTS.SERVER_MONTHLY,
         },
         {
-          id: 'selfhosted:server:yearly',
-          lookupKey: 'selfhosted:server:yearly',
-          name: 'Server - Yearly',
-          price: getPriceInfo('selfhosted:server:yearly'),
+          id: "selfhosted:server:yearly",
+          lookupKey: "selfhosted:server:yearly",
+          name: "Server - Yearly",
+          price: getPriceInfo("selfhosted:server:yearly"),
           currency: currencySymbol,
-          period: '/year',
+          period: "/year",
           popular: true,
           features: PLAN_FEATURES.SERVER,
-          highlights: PLAN_HIGHLIGHTS.SERVER_YEARLY
+          highlights: PLAN_HIGHLIGHTS.SERVER_YEARLY,
         },
         {
-          id: 'selfhosted:enterprise:monthly',
-          lookupKey: 'selfhosted:server:monthly',
-          name: 'Enterprise - Monthly',
-          price: getPriceInfo('selfhosted:server:monthly'),
-          seatPrice: getPriceInfo('selfhosted:enterpriseseat:monthly'),
+          id: "selfhosted:enterprise:monthly",
+          lookupKey: "selfhosted:server:monthly",
+          name: "Enterprise - Monthly",
+          price: getPriceInfo("selfhosted:server:monthly"),
+          seatPrice: getPriceInfo("selfhosted:enterpriseseat:monthly"),
           currency: currencySymbol,
-          period: '/month',
+          period: "/month",
           popular: false,
           requiresSeats: true,
           features: PLAN_FEATURES.ENTERPRISE,
-          highlights: PLAN_HIGHLIGHTS.ENTERPRISE_MONTHLY
+          highlights: PLAN_HIGHLIGHTS.ENTERPRISE_MONTHLY,
         },
         {
-          id: 'selfhosted:enterprise:yearly',
-          lookupKey: 'selfhosted:server:yearly',
-          name: 'Enterprise - Yearly',
-          price: getPriceInfo('selfhosted:server:yearly'),
-          seatPrice: getPriceInfo('selfhosted:enterpriseseat:yearly'),
+          id: "selfhosted:enterprise:yearly",
+          lookupKey: "selfhosted:server:yearly",
+          name: "Enterprise - Yearly",
+          price: getPriceInfo("selfhosted:server:yearly"),
+          seatPrice: getPriceInfo("selfhosted:enterpriseseat:yearly"),
           currency: currencySymbol,
-          period: '/year',
+          period: "/year",
           popular: false,
           requiresSeats: true,
           features: PLAN_FEATURES.ENTERPRISE,
-          highlights: PLAN_HIGHLIGHTS.ENTERPRISE_YEARLY
+          highlights: PLAN_HIGHLIGHTS.ENTERPRISE_YEARLY,
         },
       ];
 
       // Filter out plans with missing prices (price === 0 means Stripe price not found)
-      const validPlans = plans.filter(plan => plan.price > 0);
+      const validPlans = plans.filter((plan) => plan.price > 0);
 
       if (validPlans.length < plans.length) {
-        const missingPlans = plans.filter(plan => plan.price === 0).map(p => p.id);
-        console.warn('Filtered out plans with missing prices:', missingPlans);
+        const missingPlans = plans
+          .filter((plan) => plan.price === 0)
+          .map((p) => p.id);
+        console.warn("Filtered out plans with missing prices:", missingPlans);
       }
 
       // Add Free plan (static definition)
       const freePlan: PlanTier = {
-        id: 'free',
-        lookupKey: 'free',
-        name: 'Free',
+        id: "free",
+        lookupKey: "free",
+        name: "Free",
         price: 0,
         currency: currencySymbol,
-        period: '',
+        period: "",
         popular: false,
         features: PLAN_FEATURES.FREE,
-        highlights: PLAN_HIGHLIGHTS.FREE
+        highlights: PLAN_HIGHLIGHTS.FREE,
       };
 
       const allPlans = [freePlan, ...validPlans];
 
       return {
-        plans: allPlans
+        plans: allPlans,
       };
     } catch (error) {
-      console.error('Error fetching plans:', error);
+      console.error("Error fetching plans:", error);
       throw error;
     }
   },
@@ -247,11 +262,11 @@ const licenseService = {
     const groups: PlanTierGroup[] = [];
 
     // Free tier
-    const freePlan = plans.find(p => p.id === 'free');
+    const freePlan = plans.find((p) => p.id === "free");
     if (freePlan) {
       groups.push({
-        tier: 'free',
-        name: 'Free',
+        tier: "free",
+        name: "Free",
         monthly: freePlan,
         yearly: null,
         features: freePlan.features,
@@ -261,12 +276,16 @@ const licenseService = {
     }
 
     // Server tier
-    const serverMonthly = plans.find(p => p.lookupKey === 'selfhosted:server:monthly');
-    const serverYearly = plans.find(p => p.lookupKey === 'selfhosted:server:yearly');
+    const serverMonthly = plans.find(
+      (p) => p.lookupKey === "selfhosted:server:monthly",
+    );
+    const serverYearly = plans.find(
+      (p) => p.lookupKey === "selfhosted:server:yearly",
+    );
     if (serverMonthly || serverYearly) {
       groups.push({
-        tier: 'server',
-        name: 'Server',
+        tier: "server",
+        name: "Server",
         monthly: serverMonthly || null,
         yearly: serverYearly || null,
         features: (serverMonthly || serverYearly)!.features,
@@ -276,12 +295,16 @@ const licenseService = {
     }
 
     // Enterprise tier (uses server pricing + seats)
-    const enterpriseMonthly = plans.find(p => p.id === 'selfhosted:enterprise:monthly');
-    const enterpriseYearly = plans.find(p => p.id === 'selfhosted:enterprise:yearly');
+    const enterpriseMonthly = plans.find(
+      (p) => p.id === "selfhosted:enterprise:monthly",
+    );
+    const enterpriseYearly = plans.find(
+      (p) => p.id === "selfhosted:enterprise:yearly",
+    );
     if (enterpriseMonthly || enterpriseYearly) {
       groups.push({
-        tier: 'enterprise',
-        name: 'Enterprise',
+        tier: "enterprise",
+        name: "Enterprise",
         monthly: enterpriseMonthly || null,
         yearly: enterpriseYearly || null,
         features: (enterpriseMonthly || enterpriseYearly)!.features,
@@ -296,10 +319,12 @@ const licenseService = {
   /**
    * Create a Stripe checkout session for upgrading
    */
-  async createCheckoutSession(request: CheckoutSessionRequest): Promise<CheckoutSessionResponse> {
+  async createCheckoutSession(
+    request: CheckoutSessionRequest,
+  ): Promise<CheckoutSessionResponse> {
     // Check if Supabase is configured
     if (!isSupabaseConfigured || !supabase) {
-      throw new Error('Supabase is not configured. Checkout is not available.');
+      throw new Error("Supabase is not configured. Checkout is not available.");
     }
 
     // Detect if HTTPS is available to determine checkout mode
@@ -307,7 +332,7 @@ const licenseService = {
     const baseUrl = window.location.origin;
     const settingsUrl = `${baseUrl}/settings/adminPlan`;
 
-    const { data, error } = await supabase.functions.invoke('create-checkout', {
+    const { data, error } = await supabase.functions.invoke("create-checkout", {
       body: {
         self_hosted: true,
         lookup_key: request.lookup_key,
@@ -319,12 +344,14 @@ const licenseService = {
         callback_base_url: baseUrl,
         ui_mode: checkoutMode,
         // For hosted checkout, provide success/cancel URLs
-        success_url: checkoutMode === 'hosted'
-          ? `${settingsUrl}?session_id={CHECKOUT_SESSION_ID}&payment_status=success`
-          : undefined,
-        cancel_url: checkoutMode === 'hosted'
-          ? `${settingsUrl}?payment_status=canceled`
-          : undefined,
+        success_url:
+          checkoutMode === "hosted"
+            ? `${settingsUrl}?session_id={CHECKOUT_SESSION_ID}&payment_status=success`
+            : undefined,
+        cancel_url:
+          checkoutMode === "hosted"
+            ? `${settingsUrl}?payment_status=canceled`
+            : undefined,
       },
     });
 
@@ -339,22 +366,29 @@ const licenseService = {
    * Create a Stripe billing portal session for managing subscription
    * Uses license key for self-hosted authentication
    */
-  async createBillingPortalSession(returnUrl: string, licenseKey: string): Promise<BillingPortalResponse> {
+  async createBillingPortalSession(
+    returnUrl: string,
+    licenseKey: string,
+  ): Promise<BillingPortalResponse> {
     // Check if Supabase is configured
     if (!isSupabaseConfigured || !supabase) {
-      throw new Error('Supabase is not configured. Billing portal is not available.');
+      throw new Error(
+        "Supabase is not configured. Billing portal is not available.",
+      );
     }
 
-    const { data, error} = await supabase.functions.invoke('manage-billing', {
+    const { data, error } = await supabase.functions.invoke("manage-billing", {
       body: {
         return_url: returnUrl,
         license_key: licenseKey,
-        self_hosted: true  // Explicitly indicate self-hosted mode
+        self_hosted: true, // Explicitly indicate self-hosted mode
       },
     });
 
     if (error) {
-      throw new Error(`Failed to create billing portal session: ${error.message}`);
+      throw new Error(
+        `Failed to create billing portal session: ${error.message}`,
+      );
     }
 
     return data as BillingPortalResponse;
@@ -365,12 +399,12 @@ const licenseService = {
    */
   async getInstallationId(): Promise<string> {
     try {
-      const response = await apiClient.get('/api/v1/admin/installation-id');
+      const response = await apiClient.get("/api/v1/admin/installation-id");
 
       const data: InstallationIdResponse = await response.data;
       return data.installationId;
     } catch (error) {
-      console.error('Error fetching installation ID:', error);
+      console.error("Error fetching installation ID:", error);
       throw error;
     }
   },
@@ -381,10 +415,12 @@ const licenseService = {
   async checkLicenseKey(installationId: string): Promise<LicenseKeyResponse> {
     // Check if Supabase is configured
     if (!isSupabaseConfigured || !supabase) {
-      throw new Error('Supabase is not configured. License key lookup is not available.');
+      throw new Error(
+        "Supabase is not configured. License key lookup is not available.",
+      );
     }
 
-    const { data, error } = await supabase.functions.invoke('get-license-key', {
+    const { data, error } = await supabase.functions.invoke("get-license-key", {
       body: {
         installation_id: installationId,
       },
@@ -402,13 +438,13 @@ const licenseService = {
    */
   async saveLicenseKey(licenseKey: string): Promise<LicenseSaveResponse> {
     try {
-      const response = await apiClient.post('/api/v1/admin/license-key', {
+      const response = await apiClient.post("/api/v1/admin/license-key", {
         licenseKey: licenseKey,
       });
 
       return response.data;
     } catch (error) {
-      console.error('Error saving license key:', error);
+      console.error("Error saving license key:", error);
       throw error;
     }
   },
@@ -421,17 +457,21 @@ const licenseService = {
   async saveLicenseFile(file: File): Promise<LicenseSaveResponse> {
     try {
       const formData = new FormData();
-      formData.append('file', file);
+      formData.append("file", file);
 
-      const response = await apiClient.post('/api/v1/admin/license-file', formData, {
-        headers: {
-          'Content-Type': 'multipart/form-data',
+      const response = await apiClient.post(
+        "/api/v1/admin/license-file",
+        formData,
+        {
+          headers: {
+            "Content-Type": "multipart/form-data",
+          },
         },
-      });
+      );
 
       return response.data;
     } catch (error) {
-      console.error('Error uploading license file:', error);
+      console.error("Error uploading license file:", error);
       throw error;
     }
   },
@@ -441,10 +481,12 @@ const licenseService = {
    */
   async getLicenseInfo(): Promise<LicenseInfo> {
     try {
-      const response = await apiClient.get('/api/v1/admin/license-info');
+      const response = await apiClient.get("/api/v1/admin/license-info", {
+        suppressErrorToast: true,
+      });
       return response.data;
     } catch (error) {
-      console.error('Error fetching license info:', error);
+      console.error("Error fetching license info:", error);
       throw error;
     }
   },
@@ -455,10 +497,10 @@ const licenseService = {
    */
   async resyncLicense(): Promise<LicenseSaveResponse> {
     try {
-      const response = await apiClient.post('/api/v1/admin/license/resync');
+      const response = await apiClient.post("/api/v1/admin/license/resync");
       return response.data;
     } catch (error) {
-      console.error('Error resyncing license:', error);
+      console.error("Error resyncing license:", error);
       throw error;
     }
   },
@@ -470,16 +512,21 @@ const licenseService = {
    * @param licenseKey - Current license key for authentication
    * @returns Billing portal URL for confirming the change
    */
-  async updateEnterpriseSeats(newSeatCount: number, licenseKey: string): Promise<string> {
+  async updateEnterpriseSeats(
+    newSeatCount: number,
+    licenseKey: string,
+  ): Promise<string> {
     // Check if Supabase is configured
     if (!isSupabaseConfigured || !supabase) {
-      throw new Error('Supabase is not configured. Seat updates are not available.');
+      throw new Error(
+        "Supabase is not configured. Seat updates are not available.",
+      );
     }
 
     const baseUrl = window.location.origin;
     const returnUrl = `${baseUrl}/settings/adminPlan?seats_updated=true`;
 
-    const { data, error } = await supabase.functions.invoke('manage-billing', {
+    const { data, error } = await supabase.functions.invoke("manage-billing", {
       body: {
         return_url: returnUrl,
         license_key: licenseKey,
@@ -493,7 +540,7 @@ const licenseService = {
     }
 
     if (!data || !data.url) {
-      throw new Error('No billing portal URL returned');
+      throw new Error("No billing portal URL returned");
     }
 
     return data.url;
@@ -505,26 +552,28 @@ const licenseService = {
  * @param licenseInfo - Current license information
  * @returns Plan tier: 'free' | 'server' | 'enterprise'
  */
-export const mapLicenseToTier = (licenseInfo: LicenseInfo | null): 'free' | 'server' | 'enterprise' | null => {
+export const mapLicenseToTier = (
+  licenseInfo: LicenseInfo | null,
+): "free" | "server" | "enterprise" | null => {
   if (!licenseInfo) return null;
 
   // No license or NORMAL type = Free tier
-  if (licenseInfo.licenseType === 'NORMAL' || !licenseInfo.enabled) {
-    return 'free';
+  if (licenseInfo.licenseType === "NORMAL" || !licenseInfo.enabled) {
+    return "free";
   }
 
   // SERVER type (unlimited users) = Server tier
-  if (licenseInfo.licenseType === 'SERVER') {
-    return 'server';
+  if (licenseInfo.licenseType === "SERVER") {
+    return "server";
   }
 
   // ENTERPRISE type (with seats) = Enterprise tier
-  if (licenseInfo.licenseType === 'ENTERPRISE' && licenseInfo.maxUsers > 0) {
-    return 'enterprise';
+  if (licenseInfo.licenseType === "ENTERPRISE" && licenseInfo.maxUsers > 0) {
+    return "enterprise";
   }
 
   // Default fallback
-  return 'free';
+  return "free";
 };
 
 export default licenseService;
diff --git a/frontend/src/proprietary/services/shareLinkImport.ts b/frontend/src/proprietary/services/shareLinkImport.ts
index 6212ed72ec..54860b1807 100644
--- a/frontend/src/proprietary/services/shareLinkImport.ts
+++ b/frontend/src/proprietary/services/shareLinkImport.ts
@@ -1,14 +1,14 @@
-import apiClient from '@app/services/apiClient';
-import { fileStorage } from '@app/services/fileStorage';
-import type { FileId } from '@app/types/file';
-import type { StirlingFile } from '@app/types/fileContext';
-import type { FileContextActions } from '@app/types/fileContext';
+import apiClient from "@app/services/apiClient";
+import { fileStorage } from "@app/services/fileStorage";
+import type { FileId } from "@app/types/file";
+import type { StirlingFile } from "@app/types/fileContext";
+import type { FileContextActions } from "@app/types/fileContext";
 import {
   getShareBundleEntryRootId,
   isZipBundle,
   loadShareBundleEntries,
   parseContentDispositionFilename,
-} from '@app/services/shareBundleUtils';
+} from "@app/services/shareBundleUtils";
 
 export interface ShareLinkMetadata {
   shareToken?: string;
@@ -21,10 +21,15 @@ export interface ShareLinkMetadata {
   expiresAt?: string;
 }
 
-export async function fetchShareLinkMetadata(token: string): Promise<ShareLinkMetadata> {
+export async function fetchShareLinkMetadata(
+  token: string,
+): Promise<ShareLinkMetadata> {
   const response = await apiClient.get<ShareLinkMetadata>(
     `/api/v1/storage/share-links/${token}/metadata`,
-    { suppressErrorToast: true, skipAuthRedirect: true } as any
+    {
+      suppressErrorToast: true,
+      skipAuthRedirect: true,
+    },
   );
   return response.data || {};
 }
@@ -35,18 +40,21 @@ export async function downloadShareLink(token: string): Promise<{
   contentType: string;
 }> {
   const response = await apiClient.get(`/api/v1/storage/share-links/${token}`, {
-    responseType: 'blob',
+    responseType: "blob",
     suppressErrorToast: true,
     skipAuthRedirect: true,
-  } as any);
+  });
   const contentType =
-    (response.headers && (response.headers['content-type'] || response.headers['Content-Type'])) ||
-    '';
+    (response.headers &&
+      (response.headers["content-type"] || response.headers["Content-Type"])) ||
+    "";
   const disposition =
     (response.headers &&
-      (response.headers['content-disposition'] || response.headers['Content-Disposition'])) ||
-    '';
-  const filename = parseContentDispositionFilename(disposition) || 'shared-file';
+      (response.headers["content-disposition"] ||
+        response.headers["Content-Disposition"])) ||
+    "";
+  const filename =
+    parseContentDispositionFilename(disposition) || "shared-file";
   const blob = response.data as Blob;
   const contentTypeValue = contentType || blob.type;
   return { blob, filename, contentType: contentTypeValue };
@@ -55,7 +63,7 @@ export async function downloadShareLink(token: string): Promise<{
 export async function importShareLinkToWorkbench(
   token: string,
   actions: FileContextActions,
-  shareMetadata?: ShareLinkMetadata | null
+  shareMetadata?: ShareLinkMetadata | null,
 ): Promise<FileId[]> {
   const { blob, filename, contentType } = await downloadShareLink(token);
   const contentTypeValue = contentType || blob.type;
@@ -73,7 +81,7 @@ export async function importShareLinkToWorkbench(
 
       const idMap = new Map<string, FileId>();
       for (let i = 0; i < stirlingFiles.length; i += 1) {
-        idMap.set(sortedEntries[i].logicalId, stirlingFiles[i].fileId as FileId);
+        idMap.set(sortedEntries[i].logicalId, stirlingFiles[i].fileId);
       }
 
       const rootIdMap = new Map<string, FileId>();
@@ -119,7 +127,7 @@ export async function importShareLinkToWorkbench(
       const selectedIds: FileId[] = [];
       for (const rootId of rootOrder) {
         const rootEntries = sortedEntries.filter(
-          (entry) => getShareBundleEntryRootId(manifest, entry) === rootId
+          (entry) => getShareBundleEntryRootId(manifest, entry) === rootId,
         );
         const latestEntry = rootEntries[rootEntries.length - 1];
         if (!latestEntry) {
@@ -135,13 +143,17 @@ export async function importShareLinkToWorkbench(
     }
   }
 
-  const file = new File([blob], filename, { type: contentTypeValue || blob.type });
+  const file = new File([blob], filename, {
+    type: contentTypeValue || blob.type,
+  });
   const stirlingFiles = await actions.addFilesWithOptions([file], {
     selectFiles: true,
     autoUnzip: false,
     skipAutoUnzip: false,
   });
-  const ids = stirlingFiles.map((stirlingFile: StirlingFile) => stirlingFile.fileId as FileId);
+  const ids = stirlingFiles.map(
+    (stirlingFile: StirlingFile) => stirlingFile.fileId,
+  );
   if (ids.length > 0) {
     const sharedUpdates = {
       remoteStorageId: shareMetadata?.fileId,
diff --git a/frontend/src/proprietary/services/teamService.ts b/frontend/src/proprietary/services/teamService.ts
index 36434a2931..29457ddf5e 100644
--- a/frontend/src/proprietary/services/teamService.ts
+++ b/frontend/src/proprietary/services/teamService.ts
@@ -1,4 +1,5 @@
-import apiClient from '@app/services/apiClient';
+import apiClient from "@app/services/apiClient";
+import type { User } from "@app/services/userManagementService";
 
 export interface Team {
   id: number;
@@ -25,6 +26,13 @@ export interface TeamDetailsResponse {
   availableUsers: TeamMember[];
 }
 
+export interface TeamDetailsUIResponse {
+  team: Team;
+  teamUsers: User[];
+  availableUsers: User[];
+  userLastRequest?: Record<string, number>;
+}
+
 /**
  * Team Management Service
  * Provides functions to interact with team-related backend APIs
@@ -34,15 +42,19 @@ export const teamService = {
    * Get all teams with user counts
    */
   async getTeams(): Promise<Team[]> {
-    const response = await apiClient.get<{ teamsWithCounts: Team[] }>('/api/v1/proprietary/ui-data/teams');
+    const response = await apiClient.get<{ teamsWithCounts: Team[] }>(
+      "/api/v1/proprietary/ui-data/teams",
+    );
     return response.data.teamsWithCounts;
   },
 
   /**
    * Get team details including members
    */
-  async getTeamDetails(teamId: number): Promise<any> {
-    const response = await apiClient.get(`/api/v1/proprietary/ui-data/teams/${teamId}`);
+  async getTeamDetails(teamId: number): Promise<TeamDetailsUIResponse> {
+    const response = await apiClient.get<TeamDetailsUIResponse>(
+      `/api/v1/proprietary/ui-data/teams/${teamId}`,
+    );
     return response.data;
   },
 
@@ -51,10 +63,10 @@ export const teamService = {
    */
   async createTeam(name: string): Promise<void> {
     const formData = new FormData();
-    formData.append('name', name);
-    await apiClient.post('/api/v1/team/create', formData, {
+    formData.append("name", name);
+    await apiClient.post("/api/v1/team/create", formData, {
       suppressErrorToast: true,
-    } as any);
+    });
   },
 
   /**
@@ -62,11 +74,11 @@ export const teamService = {
    */
   async renameTeam(teamId: number, newName: string): Promise<void> {
     const formData = new FormData();
-    formData.append('teamId', teamId.toString());
-    formData.append('newName', newName);
-    await apiClient.post('/api/v1/team/rename', formData, {
+    formData.append("teamId", teamId.toString());
+    formData.append("newName", newName);
+    await apiClient.post("/api/v1/team/rename", formData, {
       suppressErrorToast: true,
-    } as any);
+    });
   },
 
   /**
@@ -74,10 +86,10 @@ export const teamService = {
    */
   async deleteTeam(teamId: number): Promise<void> {
     const formData = new FormData();
-    formData.append('teamId', teamId.toString());
-    await apiClient.post('/api/v1/team/delete', formData, {
+    formData.append("teamId", teamId.toString());
+    await apiClient.post("/api/v1/team/delete", formData, {
       suppressErrorToast: true,
-    } as any);
+    });
   },
 
   /**
@@ -85,23 +97,27 @@ export const teamService = {
    */
   async addUserToTeam(teamId: number, userId: number): Promise<void> {
     const formData = new FormData();
-    formData.append('teamId', teamId.toString());
-    formData.append('userId', userId.toString());
-    await apiClient.post('/api/v1/team/addUser', formData, {
+    formData.append("teamId", teamId.toString());
+    formData.append("userId", userId.toString());
+    await apiClient.post("/api/v1/team/addUser", formData, {
       suppressErrorToast: true,
-    } as any);
+    });
   },
 
   /**
    * Move a user to a specific team (used when "removing" from a team - moves to Default)
    */
-  async moveUserToTeam(username: string, currentRole: string, teamId: number): Promise<void> {
+  async moveUserToTeam(
+    username: string,
+    currentRole: string,
+    teamId: number,
+  ): Promise<void> {
     const formData = new FormData();
-    formData.append('username', username);
-    formData.append('role', currentRole);
-    formData.append('teamId', teamId.toString());
-    await apiClient.post('/api/v1/user/admin/changeRole', formData, {
+    formData.append("username", username);
+    formData.append("role", currentRole);
+    formData.append("teamId", teamId.toString());
+    await apiClient.post("/api/v1/user/admin/changeRole", formData, {
       suppressErrorToast: true,
-    } as any);
+    });
   },
 };
diff --git a/frontend/src/proprietary/services/userManagementService.ts b/frontend/src/proprietary/services/userManagementService.ts
index 0dafb670dd..90f739deb3 100644
--- a/frontend/src/proprietary/services/userManagementService.ts
+++ b/frontend/src/proprietary/services/userManagementService.ts
@@ -1,4 +1,4 @@
-import apiClient from '@app/services/apiClient';
+import apiClient from "@app/services/apiClient";
 
 export interface User {
   id: number;
@@ -30,7 +30,7 @@ export interface AdminSettingsData {
   disabledUsers: number;
   currentUsername?: string;
   roleDetails?: Record<string, string>;
-  teams?: any[];
+  teams?: unknown[];
   maxPaidUsers?: number;
   // License information
   maxAllowedUsers: number;
@@ -39,7 +39,7 @@ export interface AdminSettingsData {
   licenseMaxUsers: number;
   premiumEnabled: boolean;
   mailEnabled: boolean;
-  userSettings?: Record<string, any>;
+  userSettings?: Record<string, unknown>;
   lockedUsers?: string[];
 }
 
@@ -48,7 +48,7 @@ export interface CreateUserRequest {
   password?: string;
   role: string;
   teamId?: number;
-  authType: 'WEB' | 'OAUTH2' | 'SAML2';
+  authType: "WEB" | "OAUTH2" | "SAML2";
   forceChange?: boolean;
   forceMFA?: boolean;
 }
@@ -121,7 +121,9 @@ export const userManagementService = {
    * Get all users with session data (admin only)
    */
   async getUsers(): Promise<AdminSettingsData> {
-    const response = await apiClient.get<AdminSettingsData>('/api/v1/proprietary/ui-data/admin-settings');
+    const response = await apiClient.get<AdminSettingsData>(
+      "/api/v1/proprietary/ui-data/admin-settings",
+    );
     return response.data;
   },
 
@@ -129,7 +131,7 @@ export const userManagementService = {
    * Get users without a team
    */
   async getUsersWithoutTeam(): Promise<User[]> {
-    const response = await apiClient.get<User[]>('/api/v1/users/without-team');
+    const response = await apiClient.get<User[]>("/api/v1/users/without-team");
     return response.data;
   },
 
@@ -138,24 +140,24 @@ export const userManagementService = {
    */
   async createUser(data: CreateUserRequest): Promise<void> {
     const formData = new FormData();
-    formData.append('username', data.username);
+    formData.append("username", data.username);
     if (data.password) {
-      formData.append('password', data.password);
+      formData.append("password", data.password);
     }
-    formData.append('role', data.role);
+    formData.append("role", data.role);
     if (data.teamId) {
-      formData.append('teamId', data.teamId.toString());
+      formData.append("teamId", data.teamId.toString());
     }
-    formData.append('authType', data.authType);
+    formData.append("authType", data.authType);
     if (data.forceChange !== undefined) {
-      formData.append('forceChange', data.forceChange.toString());
+      formData.append("forceChange", data.forceChange.toString());
     }
     if (data.forceMFA !== undefined) {
-      formData.append('forceMFA', data.forceMFA.toString());
+      formData.append("forceMFA", data.forceMFA.toString());
     }
-    await apiClient.post('/api/v1/user/admin/saveUser', formData, {
+    await apiClient.post("/api/v1/user/admin/saveUser", formData, {
       suppressErrorToast: true, // Component will handle error display
-    } as any);
+    });
   },
 
   /**
@@ -163,14 +165,14 @@ export const userManagementService = {
    */
   async updateUserRole(data: UpdateUserRoleRequest): Promise<void> {
     const formData = new FormData();
-    formData.append('username', data.username);
-    formData.append('role', data.role);
+    formData.append("username", data.username);
+    formData.append("role", data.role);
     if (data.teamId) {
-      formData.append('teamId', data.teamId.toString());
+      formData.append("teamId", data.teamId.toString());
     }
-    await apiClient.post('/api/v1/user/admin/changeRole', formData, {
+    await apiClient.post("/api/v1/user/admin/changeRole", formData, {
       suppressErrorToast: true,
-    } as any);
+    });
   },
 
   /**
@@ -178,10 +180,14 @@ export const userManagementService = {
    */
   async toggleUserEnabled(username: string, enabled: boolean): Promise<void> {
     const formData = new FormData();
-    formData.append('enabled', enabled.toString());
-    await apiClient.post(`/api/v1/user/admin/changeUserEnabled/${username}`, formData, {
-      suppressErrorToast: true,
-    } as any);
+    formData.append("enabled", enabled.toString());
+    await apiClient.post(
+      `/api/v1/user/admin/changeUserEnabled/${username}`,
+      formData,
+      {
+        suppressErrorToast: true,
+      },
+    );
   },
 
   /**
@@ -190,7 +196,7 @@ export const userManagementService = {
   async deleteUser(username: string): Promise<void> {
     await apiClient.post(`/api/v1/user/admin/deleteUser/${username}`, null, {
       suppressErrorToast: true,
-    } as any);
+    });
   },
 
   /**
@@ -200,18 +206,18 @@ export const userManagementService = {
    */
   async inviteUsers(data: InviteUsersRequest): Promise<InviteUsersResponse> {
     const formData = new FormData();
-    formData.append('emails', data.emails);
-    formData.append('role', data.role);
+    formData.append("emails", data.emails);
+    formData.append("role", data.role);
     if (data.teamId) {
-      formData.append('teamId', data.teamId.toString());
+      formData.append("teamId", data.teamId.toString());
     }
 
     const response = await apiClient.post<InviteUsersResponse>(
-      '/api/v1/user/admin/inviteUsers',
+      "/api/v1/user/admin/inviteUsers",
       formData,
       {
         suppressErrorToast: true, // Component will handle error display
-      } as any
+      },
     );
 
     return response.data;
@@ -220,32 +226,34 @@ export const userManagementService = {
   /**
    * Generate an invite link (admin only)
    */
-  async generateInviteLink(data: InviteLinkRequest): Promise<InviteLinkResponse> {
+  async generateInviteLink(
+    data: InviteLinkRequest,
+  ): Promise<InviteLinkResponse> {
     const formData = new FormData();
     // Only append email if it's provided and not empty
     if (data.email && data.email.trim()) {
-      formData.append('email', data.email);
+      formData.append("email", data.email);
     }
-    formData.append('role', data.role);
+    formData.append("role", data.role);
     if (data.teamId) {
-      formData.append('teamId', data.teamId.toString());
+      formData.append("teamId", data.teamId.toString());
     }
     if (data.expiryHours) {
-      formData.append('expiryHours', data.expiryHours.toString());
+      formData.append("expiryHours", data.expiryHours.toString());
     }
     if (data.sendEmail !== undefined) {
-      formData.append('sendEmail', data.sendEmail.toString());
+      formData.append("sendEmail", data.sendEmail.toString());
     }
     if (data.frontendBaseUrl) {
-      formData.append('frontendBaseUrl', data.frontendBaseUrl);
+      formData.append("frontendBaseUrl", data.frontendBaseUrl);
     }
 
     const response = await apiClient.post<InviteLinkResponse>(
-      '/api/v1/invite/generate',
+      "/api/v1/invite/generate",
       formData,
       {
         suppressErrorToast: true,
-      } as any
+      },
     );
 
     return response.data;
@@ -255,7 +263,9 @@ export const userManagementService = {
    * Get list of active invite links (admin only)
    */
   async getInviteLinks(): Promise<InviteToken[]> {
-    const response = await apiClient.get<{ invites: InviteToken[] }>('/api/v1/invite/list');
+    const response = await apiClient.get<{ invites: InviteToken[] }>(
+      "/api/v1/invite/list",
+    );
     return response.data.invites;
   },
 
@@ -265,14 +275,16 @@ export const userManagementService = {
   async revokeInviteLink(inviteId: number): Promise<void> {
     await apiClient.delete(`/api/v1/invite/revoke/${inviteId}`, {
       suppressErrorToast: true,
-    } as any);
+    });
   },
 
   /**
    * Clean up expired invite links (admin only)
    */
   async cleanupExpiredInvites(): Promise<{ deletedCount: number }> {
-    const response = await apiClient.post<{ deletedCount: number }>('/api/v1/invite/cleanup');
+    const response = await apiClient.post<{ deletedCount: number }>(
+      "/api/v1/invite/cleanup",
+    );
     return response.data;
   },
 
@@ -281,26 +293,29 @@ export const userManagementService = {
    */
   async changeUserPassword(data: ChangeUserPasswordRequest): Promise<void> {
     const formData = new FormData();
-    formData.append('username', data.username);
+    formData.append("username", data.username);
     if (data.newPassword) {
-      formData.append('newPassword', data.newPassword);
+      formData.append("newPassword", data.newPassword);
     }
     if (data.generateRandom !== undefined) {
-      formData.append('generateRandom', data.generateRandom.toString());
+      formData.append("generateRandom", data.generateRandom.toString());
     }
     if (data.sendEmail !== undefined) {
-      formData.append('sendEmail', data.sendEmail.toString());
+      formData.append("sendEmail", data.sendEmail.toString());
     }
     if (data.includePassword !== undefined) {
-      formData.append('includePassword', data.includePassword.toString());
+      formData.append("includePassword", data.includePassword.toString());
     }
     if (data.forcePasswordChange !== undefined) {
-      formData.append('forcePasswordChange', data.forcePasswordChange.toString());
+      formData.append(
+        "forcePasswordChange",
+        data.forcePasswordChange.toString(),
+      );
     }
 
-    await apiClient.post('/api/v1/user/admin/changePasswordForUser', formData, {
+    await apiClient.post("/api/v1/user/admin/changePasswordForUser", formData, {
       suppressErrorToast: true, // Component will handle error display
-    } as any);
+    });
   },
 
   /**
@@ -309,14 +324,16 @@ export const userManagementService = {
   async unlockUser(username: string): Promise<void> {
     await apiClient.post(`/api/v1/user/admin/unlockUser/${username}`, null, {
       suppressErrorToast: true,
-    } as any);
+    });
   },
 
   /**
    * Disable MFA for a user (admin only)
    */
   async disableMfaByAdmin(username: string): Promise<void> {
-    await apiClient.post(`/api/v1/auth/mfa/disable/admin/${encodeURIComponent(username)}`, undefined);
+    await apiClient.post(
+      `/api/v1/auth/mfa/disable/admin/${encodeURIComponent(username)}`,
+      undefined,
+    );
   },
-
 };
diff --git a/frontend/src/proprietary/services/workflowService.ts b/frontend/src/proprietary/services/workflowService.ts
index 2dc84eb7f8..3c8e842e25 100644
--- a/frontend/src/proprietary/services/workflowService.ts
+++ b/frontend/src/proprietary/services/workflowService.ts
@@ -1,13 +1,13 @@
-import api from '@app/services/apiClient';
+import api from "@app/services/apiClient";
 
 export interface ParticipantResponse {
   id: number;
   userId?: number;
   email: string;
   name: string;
-  status: 'PENDING' | 'NOTIFIED' | 'VIEWED' | 'SIGNED' | 'DECLINED';
+  status: "PENDING" | "NOTIFIED" | "VIEWED" | "SIGNED" | "DECLINED";
   shareToken: string;
-  accessRole: 'EDITOR' | 'COMMENTER' | 'VIEWER';
+  accessRole: "EDITOR" | "COMMENTER" | "VIEWER";
   expiresAt?: string;
   lastUpdated: string;
   hasCompleted: boolean;
@@ -18,12 +18,12 @@ export interface WorkflowSessionResponse {
   sessionId: string;
   ownerId: number;
   ownerUsername: string;
-  workflowType: 'SIGNING' | 'REVIEW' | 'APPROVAL';
+  workflowType: "SIGNING" | "REVIEW" | "APPROVAL";
   documentName: string;
   ownerEmail?: string;
   message?: string;
   dueDate?: string;
-  status: 'IN_PROGRESS' | 'COMPLETED' | 'CANCELLED';
+  status: "IN_PROGRESS" | "COMPLETED" | "CANCELLED";
   finalized: boolean;
   createdAt: string;
   updatedAt: string;
@@ -55,7 +55,7 @@ class WorkflowService {
    * Get session details by participant token (no authentication required)
    */
   async getSessionByToken(token: string): Promise<WorkflowSessionResponse> {
-    const response = await api.get('/api/v1/workflow/participant/session', {
+    const response = await api.get("/api/v1/workflow/participant/session", {
       params: { token },
     });
     return response.data;
@@ -65,7 +65,7 @@ class WorkflowService {
    * Get participant details by token
    */
   async getParticipantDetails(token: string): Promise<ParticipantResponse> {
-    const response = await api.get('/api/v1/workflow/participant/details', {
+    const response = await api.get("/api/v1/workflow/participant/details", {
       params: { token },
     });
     return response.data;
@@ -74,36 +74,53 @@ class WorkflowService {
   /**
    * Submit signature as a participant
    */
-  async submitSignature(request: SignatureSubmissionRequest): Promise<ParticipantResponse> {
+  async submitSignature(
+    request: SignatureSubmissionRequest,
+  ): Promise<ParticipantResponse> {
     const formData = new FormData();
-    formData.append('participantToken', request.participantToken);
+    formData.append("participantToken", request.participantToken);
 
-    if (request.certType) formData.append('certType', request.certType);
-    if (request.password) formData.append('password', request.password);
-    if (request.p12File) formData.append('p12File', request.p12File);
-    if (request.jksFile) formData.append('jksFile', request.jksFile);
-    if (request.showSignature !== undefined) formData.append('showSignature', request.showSignature.toString());
-    if (request.pageNumber) formData.append('pageNumber', request.pageNumber.toString());
-    if (request.location) formData.append('location', request.location);
-    if (request.reason) formData.append('reason', request.reason);
-    if (request.showLogo !== undefined) formData.append('showLogo', request.showLogo.toString());
-    if (request.wetSignatureData) formData.append('wetSignatureData', request.wetSignatureData);
+    if (request.certType) formData.append("certType", request.certType);
+    if (request.password) formData.append("password", request.password);
+    if (request.p12File) formData.append("p12File", request.p12File);
+    if (request.jksFile) formData.append("jksFile", request.jksFile);
+    if (request.showSignature !== undefined)
+      formData.append("showSignature", request.showSignature.toString());
+    if (request.pageNumber)
+      formData.append("pageNumber", request.pageNumber.toString());
+    if (request.location) formData.append("location", request.location);
+    if (request.reason) formData.append("reason", request.reason);
+    if (request.showLogo !== undefined)
+      formData.append("showLogo", request.showLogo.toString());
+    if (request.wetSignatureData)
+      formData.append("wetSignatureData", request.wetSignatureData);
 
-    const response = await api.post('/api/v1/workflow/participant/submit-signature', formData, {
-      headers: {
-        'Content-Type': 'multipart/form-data',
+    const response = await api.post(
+      "/api/v1/workflow/participant/submit-signature",
+      formData,
+      {
+        headers: {
+          "Content-Type": "multipart/form-data",
+        },
       },
-    });
+    );
     return response.data;
   }
 
   /**
    * Decline participation
    */
-  async declineParticipation(token: string, reason?: string): Promise<ParticipantResponse> {
-    const response = await api.post('/api/v1/workflow/participant/decline', null, {
-      params: { token, reason },
-    });
+  async declineParticipation(
+    token: string,
+    reason?: string,
+  ): Promise<ParticipantResponse> {
+    const response = await api.post(
+      "/api/v1/workflow/participant/decline",
+      null,
+      {
+        params: { token, reason },
+      },
+    );
     return response.data;
   }
 
@@ -111,9 +128,9 @@ class WorkflowService {
    * Download document as participant
    */
   async getParticipantDocument(token: string): Promise<Blob> {
-    const response = await api.get('/api/v1/workflow/participant/document', {
+    const response = await api.get("/api/v1/workflow/participant/document", {
       params: { token },
-      responseType: 'blob',
+      responseType: "blob",
     });
     return response.data;
   }
diff --git a/frontend/src/proprietary/styles/auth-theme.css b/frontend/src/proprietary/styles/auth-theme.css
index 9e3112eb54..21c2397f1c 100644
--- a/frontend/src/proprietary/styles/auth-theme.css
+++ b/frontend/src/proprietary/styles/auth-theme.css
@@ -11,7 +11,7 @@
   --auth-input-text-light-only: #111827;
   --auth-border-focus-light-only: #3b82f6;
   --auth-focus-ring-light-only: rgba(59, 130, 246, 0.1);
-  --auth-button-bg-light-only: #AF3434;
+  --auth-button-bg-light-only: #af3434;
   --auth-button-text-light-only: #ffffff;
   --auth-magic-button-bg-light-only: #e5e7eb;
   --auth-magic-button-text-light-only: #374151;
@@ -33,7 +33,7 @@
   --auth-input-text-light-only: var(--text-primary);
   --auth-border-focus-light-only: #3b82f6;
   --auth-focus-ring-light-only: rgba(59, 130, 246, 0.2);
-  --auth-button-bg-light-only: #AF3434;
+  --auth-button-bg-light-only: #af3434;
   --auth-button-text-light-only: #ffffff;
   --auth-magic-button-bg-light-only: var(--bg-raised);
   --auth-magic-button-text-light-only: var(--text-primary);
diff --git a/frontend/src/proprietary/testing/serverExperienceSimulations.ts b/frontend/src/proprietary/testing/serverExperienceSimulations.ts
index 4177f296ee..7c7d46db43 100644
--- a/frontend/src/proprietary/testing/serverExperienceSimulations.ts
+++ b/frontend/src/proprietary/testing/serverExperienceSimulations.ts
@@ -1,5 +1,5 @@
-import type { AppConfig } from '@app/types/appConfig';
-import type { LicenseInfo } from '@app/types/license';
+import type { AppConfig } from "@app/types/appConfig";
+import type { LicenseInfo } from "@app/types/license";
 
 interface WauResponse {
   trackingSince: string;
@@ -40,7 +40,7 @@ const DEV_TESTING_MODE = false;
 const SIMULATION_INDEX = 0;
 
 const FREE_LICENSE_INFO: LicenseInfo = {
-  licenseType: 'NORMAL',
+  licenseType: "NORMAL",
   enabled: false,
   maxUsers: 5,
   hasKey: false,
@@ -48,7 +48,7 @@ const FREE_LICENSE_INFO: LicenseInfo = {
 
 const BASE_NO_LOGIN_CONFIG: AppConfig = {
   enableAnalytics: true,
-  appVersion: '2.8.0',
+  appVersion: "2.9.2",
   serverCertificateEnabled: false,
   enableAlphaFunctionality: false,
   enableDesktopInstallSlide: true,
@@ -59,9 +59,9 @@ const BASE_NO_LOGIN_CONFIG: AppConfig = {
   enableLogin: false,
   activeSecurity: false,
   languages: [],
-  contextPath: '/',
-  license: 'NORMAL',
-  baseUrl: 'http://localhost',
+  contextPath: "/",
+  license: "NORMAL",
+  baseUrl: "http://localhost",
   enableEmailInvites: true,
 };
 
@@ -73,12 +73,12 @@ const BASE_LOGIN_CONFIG: AppConfig = {
 
 const SIMULATION_SCENARIOS: SimulationScenario[] = [
   {
-    label: 'no-login-user-under-limit (no-license)',
+    label: "no-login-user-under-limit (no-license)",
     appConfig: {
       ...BASE_NO_LOGIN_CONFIG,
     },
     wau: {
-      trackingSince: '2025-11-18T23:20:12.520884200Z',
+      trackingSince: "2025-11-18T23:20:12.520884200Z",
       daysOnline: 0,
       totalUniqueBrowsers: 3,
       weeklyActiveUsers: 3,
@@ -86,12 +86,12 @@ const SIMULATION_SCENARIOS: SimulationScenario[] = [
     licenseInfo: { ...FREE_LICENSE_INFO },
   },
   {
-    label: 'no-login-admin-under-limit (no-license)',
+    label: "no-login-admin-under-limit (no-license)",
     appConfig: {
       ...BASE_NO_LOGIN_CONFIG,
     },
     wau: {
-      trackingSince: '2025-10-01T00:00:00Z',
+      trackingSince: "2025-10-01T00:00:00Z",
       daysOnline: 14,
       totalUniqueBrowsers: 4,
       weeklyActiveUsers: 4,
@@ -99,12 +99,12 @@ const SIMULATION_SCENARIOS: SimulationScenario[] = [
     licenseInfo: { ...FREE_LICENSE_INFO },
   },
   {
-    label: 'no-login-user-over-limit (no-license)',
+    label: "no-login-user-over-limit (no-license)",
     appConfig: {
       ...BASE_NO_LOGIN_CONFIG,
     },
     wau: {
-      trackingSince: '2025-09-01T00:00:00Z',
+      trackingSince: "2025-09-01T00:00:00Z",
       daysOnline: 30,
       totalUniqueBrowsers: 12,
       weeklyActiveUsers: 9,
@@ -112,12 +112,12 @@ const SIMULATION_SCENARIOS: SimulationScenario[] = [
     licenseInfo: { ...FREE_LICENSE_INFO },
   },
   {
-    label: 'no-login-admin-over-limit (no-license)',
+    label: "no-login-admin-over-limit (no-license)",
     appConfig: {
       ...BASE_NO_LOGIN_CONFIG,
     },
     wau: {
-      trackingSince: '2025-08-15T00:00:00Z',
+      trackingSince: "2025-08-15T00:00:00Z",
       daysOnline: 45,
       totalUniqueBrowsers: 18,
       weeklyActiveUsers: 12,
@@ -125,14 +125,14 @@ const SIMULATION_SCENARIOS: SimulationScenario[] = [
     licenseInfo: { ...FREE_LICENSE_INFO },
   },
   {
-    label: 'login-user-under-limit (no-license)',
+    label: "login-user-under-limit (no-license)",
     appConfig: {
       ...BASE_LOGIN_CONFIG,
       isAdmin: false,
     },
     // Non-admin users use WAU estimate (not adminUsage)
     wau: {
-      trackingSince: '2025-11-18T23:20:12.520884200Z',
+      trackingSince: "2025-11-18T23:20:12.520884200Z",
       daysOnline: 0,
       totalUniqueBrowsers: 3,
       weeklyActiveUsers: 3,
@@ -140,7 +140,7 @@ const SIMULATION_SCENARIOS: SimulationScenario[] = [
     licenseInfo: { ...FREE_LICENSE_INFO },
   },
   {
-    label: 'login-admin-under-limit (no-license)',
+    label: "login-admin-under-limit (no-license)",
     appConfig: {
       ...BASE_LOGIN_CONFIG,
       isAdmin: true,
@@ -151,14 +151,14 @@ const SIMULATION_SCENARIOS: SimulationScenario[] = [
     licenseInfo: { ...FREE_LICENSE_INFO },
   },
   {
-    label: 'login-user-over-limit (no-license)',
+    label: "login-user-over-limit (no-license)",
     appConfig: {
       ...BASE_LOGIN_CONFIG,
       isAdmin: false,
     },
     // Non-admin users use WAU estimate (not adminUsage)
     wau: {
-      trackingSince: '2025-09-01T00:00:00Z',
+      trackingSince: "2025-09-01T00:00:00Z",
       daysOnline: 30,
       totalUniqueBrowsers: 12,
       weeklyActiveUsers: 9,
@@ -166,7 +166,7 @@ const SIMULATION_SCENARIOS: SimulationScenario[] = [
     licenseInfo: { ...FREE_LICENSE_INFO },
   },
   {
-    label: 'login-admin-over-limit (no-license)',
+    label: "login-admin-over-limit (no-license)",
     appConfig: {
       ...BASE_LOGIN_CONFIG,
       isAdmin: true,
@@ -184,10 +184,14 @@ function getActiveScenario(): SimulationScenario | null {
   }
   const scenario = SIMULATION_SCENARIOS[SIMULATION_INDEX];
   if (!scenario) {
-    console.warn('[Simulation] SIMULATION_INDEX out of range, using live backend.');
+    console.warn(
+      "[Simulation] SIMULATION_INDEX out of range, using live backend.",
+    );
     return null;
   }
-  console.warn(`[Simulation] Using scenario #${SIMULATION_INDEX} (${scenario.label}).`);
+  console.warn(
+    `[Simulation] Using scenario #${SIMULATION_INDEX} (${scenario.label}).`,
+  );
   return scenario;
 }
 
diff --git a/frontend/src/proprietary/tsconfig.json b/frontend/src/proprietary/tsconfig.json
index 3bba3e8bc2..14644446d5 100644
--- a/frontend/src/proprietary/tsconfig.json
+++ b/frontend/src/proprietary/tsconfig.json
@@ -3,13 +3,8 @@
   "compilerOptions": {
     "baseUrl": "../../",
     "paths": {
-      "@app/*": [
-        "src/proprietary/*",
-        "src/core/*"
-      ],
-      "@core/*": [
-        "src/core/*"
-      ]
+      "@app/*": ["src/proprietary/*", "src/core/*"],
+      "@core/*": ["src/core/*"]
     }
   },
   "include": [
diff --git a/frontend/src/proprietary/types/license.ts b/frontend/src/proprietary/types/license.ts
index 5f4fe9fe7c..e2755646aa 100644
--- a/frontend/src/proprietary/types/license.ts
+++ b/frontend/src/proprietary/types/license.ts
@@ -4,7 +4,7 @@ export interface PlanFeature {
 }
 
 export interface LicenseInfo {
-  licenseType: 'NORMAL' | 'SERVER' | 'ENTERPRISE';
+  licenseType: "NORMAL" | "SERVER" | "ENTERPRISE";
   enabled: boolean;
   maxUsers: number;
   hasKey: boolean;
diff --git a/frontend/src/proprietary/types/proprietaryToolId.ts b/frontend/src/proprietary/types/proprietaryToolId.ts
index 084cffa29e..67c5890308 100644
--- a/frontend/src/proprietary/types/proprietaryToolId.ts
+++ b/frontend/src/proprietary/types/proprietaryToolId.ts
@@ -4,16 +4,18 @@
  * to add proprietary-specific tool IDs.
  */
 
-export const PROPRIETARY_REGULAR_TOOL_IDS = [
-] as const;
+export const PROPRIETARY_REGULAR_TOOL_IDS = [] as const;
 
-export const PROPRIETARY_SUPER_TOOL_IDS = [
-] as const;
+export const PROPRIETARY_SUPER_TOOL_IDS = [] as const;
 
-export const PROPRIETARY_LINK_TOOL_IDS = [
-] as const;
+export const PROPRIETARY_LINK_TOOL_IDS = [] as const;
 
-export type ProprietaryRegularToolId = typeof PROPRIETARY_REGULAR_TOOL_IDS[number];
-export type ProprietarySuperToolId = typeof PROPRIETARY_SUPER_TOOL_IDS[number];
-export type ProprietaryLinkToolId = typeof PROPRIETARY_LINK_TOOL_IDS[number];
-export type ProprietaryToolId = ProprietaryRegularToolId | ProprietarySuperToolId | ProprietaryLinkToolId;
+export type ProprietaryRegularToolId =
+  (typeof PROPRIETARY_REGULAR_TOOL_IDS)[number];
+export type ProprietarySuperToolId =
+  (typeof PROPRIETARY_SUPER_TOOL_IDS)[number];
+export type ProprietaryLinkToolId = (typeof PROPRIETARY_LINK_TOOL_IDS)[number];
+export type ProprietaryToolId =
+  | ProprietaryRegularToolId
+  | ProprietarySuperToolId
+  | ProprietaryLinkToolId;
diff --git a/frontend/src/proprietary/utils/creditCosts.ts b/frontend/src/proprietary/utils/creditCosts.ts
index 513b6fbccc..573010edc4 100644
--- a/frontend/src/proprietary/utils/creditCosts.ts
+++ b/frontend/src/proprietary/utils/creditCosts.ts
@@ -1,4 +1,4 @@
-import { ToolId } from '@app/types/toolId';
+import { ToolId } from "@app/types/toolId";
 
 // Credit costs based on ResourceWeight enum from backend
 export const CREDIT_COSTS = {
diff --git a/frontend/src/proprietary/utils/currencyDetection.ts b/frontend/src/proprietary/utils/currencyDetection.ts
index 408002a931..e5a059b790 100644
--- a/frontend/src/proprietary/utils/currencyDetection.ts
+++ b/frontend/src/proprietary/utils/currencyDetection.ts
@@ -3,7 +3,7 @@
  * Auto-detects user's preferred currency from browser locale
  */
 
-const STORAGE_KEY = 'preferredCurrency';
+const STORAGE_KEY = "preferredCurrency";
 
 /**
  * Map of locale codes to currency codes
@@ -11,62 +11,62 @@ const STORAGE_KEY = 'preferredCurrency';
  */
 const LOCALE_TO_CURRENCY_MAP: Record<string, string> = {
   // English variants
-  'en-US': 'usd',
-  'en-CA': 'usd',
-  'en-AU': 'usd',
-  'en-NZ': 'usd',
-  'en-GB': 'gbp',
-  'en-IE': 'eur',
+  "en-US": "usd",
+  "en-CA": "usd",
+  "en-AU": "usd",
+  "en-NZ": "usd",
+  "en-GB": "gbp",
+  "en-IE": "eur",
 
   // European locales - Euro
-  'de-DE': 'eur',
-  'de-AT': 'eur',
-  'de-CH': 'eur',
-  'fr-FR': 'eur',
-  'fr-BE': 'eur',
-  'fr-CH': 'eur',
-  'it-IT': 'eur',
-  'es-ES': 'eur',
-  'pt-PT': 'eur',
-  'nl-NL': 'eur',
-  'nl-BE': 'eur',
-  'pl-PL': 'eur',
-  'ro-RO': 'eur',
-  'el-GR': 'eur',
-  'fi-FI': 'eur',
-  'sv-SE': 'eur',
-  'da-DK': 'eur',
-  'no-NO': 'eur',
+  "de-DE": "eur",
+  "de-AT": "eur",
+  "de-CH": "eur",
+  "fr-FR": "eur",
+  "fr-BE": "eur",
+  "fr-CH": "eur",
+  "it-IT": "eur",
+  "es-ES": "eur",
+  "pt-PT": "eur",
+  "nl-NL": "eur",
+  "nl-BE": "eur",
+  "pl-PL": "eur",
+  "ro-RO": "eur",
+  "el-GR": "eur",
+  "fi-FI": "eur",
+  "sv-SE": "eur",
+  "da-DK": "eur",
+  "no-NO": "eur",
 
   // Chinese variants
-  'zh-CN': 'cny',
-  'zh-TW': 'cny',
-  'zh-HK': 'cny',
-  'zh-SG': 'cny',
+  "zh-CN": "cny",
+  "zh-TW": "cny",
+  "zh-HK": "cny",
+  "zh-SG": "cny",
 
   // Indian locales
-  'hi-IN': 'inr',
-  'en-IN': 'inr',
-  'bn-IN': 'inr',
-  'te-IN': 'inr',
-  'ta-IN': 'inr',
-  'mr-IN': 'inr',
+  "hi-IN": "inr",
+  "en-IN": "inr",
+  "bn-IN": "inr",
+  "te-IN": "inr",
+  "ta-IN": "inr",
+  "mr-IN": "inr",
 
   // Brazilian Portuguese
-  'pt-BR': 'brl',
+  "pt-BR": "brl",
 
   // Indonesian
-  'id-ID': 'idr',
-  'jv-ID': 'idr',
+  "id-ID": "idr",
+  "jv-ID": "idr",
 
   // Other major locales defaulting to USD
-  'ja-JP': 'usd',
-  'ko-KR': 'usd',
-  'ru-RU': 'usd',
-  'ar-SA': 'usd',
-  'th-TH': 'usd',
-  'vi-VN': 'usd',
-  'tr-TR': 'usd',
+  "ja-JP": "usd",
+  "ko-KR": "usd",
+  "ru-RU": "usd",
+  "ar-SA": "usd",
+  "th-TH": "usd",
+  "vi-VN": "usd",
+  "tr-TR": "usd",
 };
 
 /**
@@ -81,9 +81,9 @@ export function detectCurrencyFromLocale(locale: string): string {
   }
 
   // Try matching just the language code (e.g., 'en' from 'en-US')
-  const languageCode = locale.split('-')[0];
-  const matchingLocale = Object.keys(LOCALE_TO_CURRENCY_MAP).find(
-    key => key.startsWith(languageCode)
+  const languageCode = locale.split("-")[0];
+  const matchingLocale = Object.keys(LOCALE_TO_CURRENCY_MAP).find((key) =>
+    key.startsWith(languageCode),
   );
 
   if (matchingLocale) {
@@ -91,7 +91,7 @@ export function detectCurrencyFromLocale(locale: string): string {
   }
 
   // Default fallback to USD
-  return 'usd';
+  return "usd";
 }
 
 /**
@@ -102,7 +102,7 @@ export function getCachedCurrency(): string | null {
   try {
     return localStorage.getItem(STORAGE_KEY);
   } catch (error) {
-    console.warn('Failed to read currency from localStorage:', error);
+    console.warn("Failed to read currency from localStorage:", error);
     return null;
   }
 }
@@ -115,7 +115,7 @@ export function setCachedCurrency(currency: string): void {
   try {
     localStorage.setItem(STORAGE_KEY, currency);
   } catch (error) {
-    console.warn('Failed to save currency to localStorage:', error);
+    console.warn("Failed to save currency to localStorage:", error);
   }
 }
 
diff --git a/frontend/src/proprietary/utils/licenseCheckoutUtils.ts b/frontend/src/proprietary/utils/licenseCheckoutUtils.ts
index 6235bbfe97..cfa590d548 100644
--- a/frontend/src/proprietary/utils/licenseCheckoutUtils.ts
+++ b/frontend/src/proprietary/utils/licenseCheckoutUtils.ts
@@ -3,7 +3,7 @@
  * Used by both embedded and hosted checkout flows
  */
 
-import licenseService, { LicenseInfo } from '@app/services/licenseService';
+import licenseService, { LicenseInfo } from "@app/services/licenseService";
 
 /**
  * Result of license key polling
@@ -22,7 +22,7 @@ export interface PollConfig {
   /** Check if component is still mounted (prevents state updates after unmount) */
   isMounted?: () => boolean;
   /** Callback for status changes during polling */
-  onStatusChange?: (status: 'polling' | 'ready' | 'timeout') => void;
+  onStatusChange?: (status: "polling" | "ready" | "timeout") => void;
   /** Custom backoff intervals in milliseconds (default: [1000, 2000, 4000, 8000, 16000]) */
   backoffMs?: number[];
 }
@@ -33,7 +33,7 @@ export interface PollConfig {
  */
 export async function pollLicenseKeyWithBackoff(
   installationId: string,
-  config: PollConfig = {}
+  config: PollConfig = {},
 ): Promise<LicenseKeyPollResult> {
   const {
     isMounted = () => true,
@@ -43,14 +43,16 @@ export async function pollLicenseKeyWithBackoff(
 
   let attemptIndex = 0;
 
-  onStatusChange?.('polling');
-  console.log(`Starting license key polling for installation: ${installationId}`);
+  onStatusChange?.("polling");
+  console.log(
+    `Starting license key polling for installation: ${installationId}`,
+  );
 
   const poll = async (): Promise<LicenseKeyPollResult> => {
     // Check if component is still mounted
     if (!isMounted()) {
-      console.log('Polling cancelled: component unmounted');
-      return { success: false, error: 'Component unmounted' };
+      console.log("Polling cancelled: component unmounted");
+      return { success: false, error: "Component unmounted" };
     }
 
     const attemptNumber = attemptIndex + 1;
@@ -61,12 +63,12 @@ export async function pollLicenseKeyWithBackoff(
 
       // Check mounted after async operation
       if (!isMounted()) {
-        return { success: false, error: 'Component unmounted' };
+        return { success: false, error: "Component unmounted" };
       }
 
-      if (response.status === 'ready' && response.license_key) {
-        console.log('✅ License key ready!');
-        onStatusChange?.('ready');
+      if (response.status === "ready" && response.license_key) {
+        console.log("✅ License key ready!");
+        onStatusChange?.("ready");
         return {
           success: true,
           licenseKey: response.license_key,
@@ -77,43 +79,43 @@ export async function pollLicenseKeyWithBackoff(
       attemptIndex++;
 
       if (attemptIndex >= backoffMs.length) {
-        console.warn('�� License polling timeout after all attempts');
-        onStatusChange?.('timeout');
+        console.warn("�� License polling timeout after all attempts");
+        onStatusChange?.("timeout");
         return {
           success: false,
           timedOut: true,
-          error: 'Polling timeout - license key not ready',
+          error: "Polling timeout - license key not ready",
         };
       }
 
       // Wait before next attempt
       const nextDelay = backoffMs[attemptIndex];
       console.log(`Retrying in ${nextDelay}ms...`);
-      await new Promise(resolve => setTimeout(resolve, nextDelay));
+      await new Promise((resolve) => setTimeout(resolve, nextDelay));
 
       return poll();
     } catch (error) {
       console.error(`Polling attempt ${attemptNumber} failed:`, error);
 
       if (!isMounted()) {
-        return { success: false, error: 'Component unmounted' };
+        return { success: false, error: "Component unmounted" };
       }
 
       attemptIndex++;
 
       if (attemptIndex >= backoffMs.length) {
-        console.error('Polling failed after all attempts');
-        onStatusChange?.('timeout');
+        console.error("Polling failed after all attempts");
+        onStatusChange?.("timeout");
         return {
           success: false,
-          error: error instanceof Error ? error.message : 'Polling failed',
+          error: error instanceof Error ? error.message : "Polling failed",
         };
       }
 
       // Retry with exponential backoff even on error
       const nextDelay = backoffMs[attemptIndex];
       console.log(`Retrying after error in ${nextDelay}ms...`);
-      await new Promise(resolve => setTimeout(resolve, nextDelay));
+      await new Promise((resolve) => setTimeout(resolve, nextDelay));
 
       return poll();
     }
@@ -143,16 +145,16 @@ export async function activateLicenseKey(
     isMounted?: () => boolean;
     /** Callback when license is activated with updated info */
     onActivated?: (licenseInfo: LicenseInfo) => void;
-  } = {}
+  } = {},
 ): Promise<LicenseActivationResult> {
   const { isMounted = () => true, onActivated } = options;
 
   try {
-    console.log('Activating license key...');
+    console.log("Activating license key...");
     const saveResponse = await licenseService.saveLicenseKey(licenseKey);
 
     if (!isMounted()) {
-      return { success: false, error: 'Component unmounted' };
+      return { success: false, error: "Component unmounted" };
     }
 
     if (saveResponse.success) {
@@ -163,7 +165,7 @@ export async function activateLicenseKey(
         const licenseInfo = await licenseService.getLicenseInfo();
 
         if (!isMounted()) {
-          return { success: false, error: 'Component unmounted' };
+          return { success: false, error: "Component unmounted" };
         }
 
         onActivated?.(licenseInfo);
@@ -174,26 +176,29 @@ export async function activateLicenseKey(
           licenseInfo,
         };
       } catch (infoError) {
-        console.error('Error fetching license info after activation:', infoError);
+        console.error(
+          "Error fetching license info after activation:",
+          infoError,
+        );
         // Still return success since save succeeded
         return {
           success: true,
           licenseType: saveResponse.licenseType,
-          error: 'Failed to fetch updated license info',
+          error: "Failed to fetch updated license info",
         };
       }
     } else {
-      console.error('Failed to save license key:', saveResponse.error);
+      console.error("Failed to save license key:", saveResponse.error);
       return {
         success: false,
-        error: saveResponse.error || 'Failed to save license key',
+        error: saveResponse.error || "Failed to save license key",
       };
     }
   } catch (error) {
-    console.error('Error activating license key:', error);
+    console.error("Error activating license key:", error);
     return {
       success: false,
-      error: error instanceof Error ? error.message : 'Activation failed',
+      error: error instanceof Error ? error.message : "Activation failed",
     };
   }
 }
@@ -209,16 +214,16 @@ export async function resyncExistingLicense(
     isMounted?: () => boolean;
     /** Callback when license is resynced with updated info */
     onActivated?: (licenseInfo: LicenseInfo) => void;
-  } = {}
+  } = {},
 ): Promise<LicenseActivationResult> {
   const { isMounted = () => true, onActivated } = options;
 
   try {
-    console.log('Resyncing existing license with Keygen...');
+    console.log("Resyncing existing license with Keygen...");
     const resyncResponse = await licenseService.resyncLicense();
 
     if (!isMounted()) {
-      return { success: false, error: 'Component unmounted' };
+      return { success: false, error: "Component unmounted" };
     }
 
     if (resyncResponse.success) {
@@ -229,7 +234,7 @@ export async function resyncExistingLicense(
         const licenseInfo = await licenseService.getLicenseInfo();
 
         if (!isMounted()) {
-          return { success: false, error: 'Component unmounted' };
+          return { success: false, error: "Component unmounted" };
         }
 
         onActivated?.(licenseInfo);
@@ -240,26 +245,26 @@ export async function resyncExistingLicense(
           licenseInfo,
         };
       } catch (infoError) {
-        console.error('Error fetching license info after resync:', infoError);
+        console.error("Error fetching license info after resync:", infoError);
         // Still return success since resync succeeded
         return {
           success: true,
           licenseType: resyncResponse.licenseType,
-          error: 'Failed to fetch updated license info',
+          error: "Failed to fetch updated license info",
         };
       }
     } else {
-      console.error('Failed to resync license:', resyncResponse.error);
+      console.error("Failed to resync license:", resyncResponse.error);
       return {
         success: false,
-        error: resyncResponse.error || 'Failed to resync license',
+        error: resyncResponse.error || "Failed to resync license",
       };
     }
   } catch (error) {
-    console.error('Error resyncing license:', error);
+    console.error("Error resyncing license:", error);
     return {
       success: false,
-      error: error instanceof Error ? error.message : 'Resync failed',
+      error: error instanceof Error ? error.message : "Resync failed",
     };
   }
 }
diff --git a/frontend/src/proprietary/utils/planTierUtils.ts b/frontend/src/proprietary/utils/planTierUtils.ts
index e4fa12f625..07b22f159b 100644
--- a/frontend/src/proprietary/utils/planTierUtils.ts
+++ b/frontend/src/proprietary/utils/planTierUtils.ts
@@ -2,18 +2,20 @@
  * Shared utilities for plan tier comparisons and button logic
  */
 
-export type PlanTier = 'free' | 'server' | 'enterprise';
+export type PlanTier = "free" | "server" | "enterprise";
 
 const TIER_HIERARCHY: Record<PlanTier, number> = {
-  'free': 1,
-  'server': 2,
-  'enterprise': 3,
+  free: 1,
+  server: 2,
+  enterprise: 3,
 };
 
 /**
  * Get numeric level for a tier
  */
-export function getTierLevel(tier: PlanTier | string | null | undefined): number {
+export function getTierLevel(
+  tier: PlanTier | string | null | undefined,
+): number {
   if (!tier) return 1;
   return TIER_HIERARCHY[tier as PlanTier] || 1;
 }
@@ -21,20 +23,29 @@ export function getTierLevel(tier: PlanTier | string | null | undefined): number
 /**
  * Check if target tier is the current tier
  */
-export function isCurrentTier(currentTier: PlanTier | string | null | undefined, targetTier: PlanTier | string): boolean {
+export function isCurrentTier(
+  currentTier: PlanTier | string | null | undefined,
+  targetTier: PlanTier | string,
+): boolean {
   return getTierLevel(currentTier) === getTierLevel(targetTier);
 }
 
 /**
  * Check if target tier is a downgrade from current tier
  */
-export function isDowngrade(currentTier: PlanTier | string | null | undefined, targetTier: PlanTier | string): boolean {
+export function isDowngrade(
+  currentTier: PlanTier | string | null | undefined,
+  targetTier: PlanTier | string,
+): boolean {
   return getTierLevel(currentTier) > getTierLevel(targetTier);
 }
 
 /**
  * Check if enterprise is blocked for free tier users
  */
-export function isEnterpriseBlockedForFree(currentTier: PlanTier | string | null | undefined, targetTier: PlanTier | string): boolean {
-  return currentTier === 'free' && targetTier === 'enterprise';
+export function isEnterpriseBlockedForFree(
+  currentTier: PlanTier | string | null | undefined,
+  targetTier: PlanTier | string,
+): boolean {
+  return currentTier === "free" && targetTier === "enterprise";
 }
diff --git a/frontend/src/proprietary/utils/protocolDetection.ts b/frontend/src/proprietary/utils/protocolDetection.ts
index 4f7e328c55..5c33f68f51 100644
--- a/frontend/src/proprietary/utils/protocolDetection.ts
+++ b/frontend/src/proprietary/utils/protocolDetection.ts
@@ -10,7 +10,7 @@
  */
 export function isStripeConfigured(): boolean {
   const stripeKey = import.meta.env.VITE_STRIPE_PUBLISHABLE_KEY;
-  return !!stripeKey && stripeKey.startsWith('pk_');
+  return !!stripeKey && stripeKey.startsWith("pk_");
 }
 
 /**
@@ -19,7 +19,7 @@ export function isStripeConfigured(): boolean {
  */
 export function isSecureContext(): boolean {
   // Allow localhost for development (works with both HTTP and HTTPS)
-  if (typeof window !== 'undefined') {
+  if (typeof window !== "undefined") {
     const protocol = window.location.protocol;
 
     // Localhost is considered secure for development
@@ -29,7 +29,7 @@ export function isSecureContext(): boolean {
     // }
 
     // Check if HTTPS
-    return protocol === 'https:';
+    return protocol === "https:";
   }
 
   // Default to false if window is not available (SSR context)
@@ -40,15 +40,15 @@ export function isSecureContext(): boolean {
  * Get the appropriate Stripe checkout UI mode based on current context
  * @returns 'embedded' for HTTPS with key, 'hosted' for HTTP or missing key
  */
-export function getCheckoutMode(): 'embedded' | 'hosted' {
+export function getCheckoutMode(): "embedded" | "hosted" {
   // Force hosted checkout if no publishable key (regardless of protocol)
   // Hosted checkout works without the key - it just redirects to Stripe
   if (!isStripeConfigured()) {
-    return 'hosted';
+    return "hosted";
   }
 
   // Normal protocol-based detection if key is available
-  return isSecureContext() ? 'embedded' : 'hosted';
+  return isSecureContext() ? "embedded" : "hosted";
 }
 
 /**
diff --git a/frontend/src/proprietary/utils/urlMapping.ts b/frontend/src/proprietary/utils/urlMapping.ts
index 969686ef5a..7e158af20b 100644
--- a/frontend/src/proprietary/utils/urlMapping.ts
+++ b/frontend/src/proprietary/utils/urlMapping.ts
@@ -4,8 +4,8 @@
  * to add proprietary-specific URL mappings.
  */
 
-import { ToolId } from '@app/types/toolId';
-import { URL_TO_TOOL_MAP as CORE_URL_TO_TOOL_MAP } from '@core/utils/urlMapping';
+import { ToolId } from "@app/types/toolId";
+import { URL_TO_TOOL_MAP as CORE_URL_TO_TOOL_MAP } from "@core/utils/urlMapping";
 
 // Proprietary URL mappings
 const PROPRIETARY_URL_MAPPINGS: Record<string, ToolId> = {};
diff --git a/frontend/src/prototypes/App.tsx b/frontend/src/prototypes/App.tsx
new file mode 100644
index 0000000000..18800fd6a7
--- /dev/null
+++ b/frontend/src/prototypes/App.tsx
@@ -0,0 +1,79 @@
+import { Suspense } from "react";
+import { Routes, Route, useParams } from "react-router-dom";
+import { AppProviders } from "@app/components/AppProviders";
+import { AppLayout } from "@app/components/AppLayout";
+import { LoadingFallback } from "@app/components/shared/LoadingFallback";
+import { PreferencesProvider } from "@app/contexts/PreferencesContext";
+import { RainbowThemeProvider } from "@app/components/shared/RainbowThemeProvider";
+import Landing from "@app/routes/Landing";
+import Login from "@app/routes/Login";
+import Signup from "@app/routes/Signup";
+import AuthCallback from "@app/routes/AuthCallback";
+import InviteAccept from "@app/routes/InviteAccept";
+import ShareLinkPage from "@app/routes/ShareLinkPage";
+import ParticipantView from "@app/components/workflow/ParticipantView";
+import Onboarding from "@app/components/onboarding/Onboarding";
+
+// Import global styles
+import "@app/styles/tailwind.css";
+import "@app/styles/cookieconsent.css";
+import "@app/styles/index.css";
+import "@app/styles/auth-theme.css";
+
+// Import file ID debugging helpers (development only)
+import "@app/utils/fileIdSafety";
+
+// Minimal providers for public routes - no API calls, no authentication
+function MinimalProviders({ children }: { children: React.ReactNode }) {
+  return (
+    <PreferencesProvider>
+      <RainbowThemeProvider>{children}</RainbowThemeProvider>
+    </PreferencesProvider>
+  );
+}
+
+// Participant signing page — token-gated, no login required
+function ParticipantViewPage() {
+  const { token } = useParams<{ token: string }>();
+  if (!token) return null;
+  return <ParticipantView token={token} />;
+}
+
+export default function App() {
+  return (
+    <Suspense fallback={<LoadingFallback />}>
+      <Routes>
+        {/* Participant signing — public, token-gated, no auth required */}
+        <Route
+          path="/workflow/sign/:token"
+          element={
+            <MinimalProviders>
+              <ParticipantViewPage />
+            </MinimalProviders>
+          }
+        />
+
+        {/* All other routes need AppProviders for backend integration */}
+        <Route
+          path="*"
+          element={
+            <AppProviders>
+              <AppLayout>
+                <Routes>
+                  <Route path="/login" element={<Login />} />
+                  <Route path="/signup" element={<Signup />} />
+                  <Route path="/auth/callback" element={<AuthCallback />} />
+                  <Route path="/invite/:token" element={<InviteAccept />} />
+                  <Route path="/share/:token" element={<ShareLinkPage />} />
+                  {/* Main app routes - Landing handles auth logic */}
+                  <Route path="/*" element={<Landing />} />
+                </Routes>
+                <Onboarding />
+              </AppLayout>
+            </AppProviders>
+          }
+        />
+      </Routes>
+    </Suspense>
+  );
+}
diff --git a/frontend/src/prototypes/LICENSE b/frontend/src/prototypes/LICENSE
new file mode 100644
index 0000000000..d268556808
--- /dev/null
+++ b/frontend/src/prototypes/LICENSE
@@ -0,0 +1,51 @@
+Stirling PDF User License
+
+Copyright (c) 2025 Stirling PDF Inc.
+
+License Scope & Usage Rights
+
+Production use of the Stirling PDF Software is only permitted with a valid Stirling PDF User License.
+
+For purposes of this license, “the Software� refers to the Stirling PDF application and any associated documentation files
+provided by Stirling PDF Inc. You or your organization may not use the Software in production, at scale, or for business-critical
+processes unless you have agreed to, and remain in compliance with, the Stirling PDF Subscription Terms of Service
+(https://www.stirlingpdf.com/terms) or another valid agreement with Stirling PDF, and hold an active User License subscription
+covering the appropriate number of licensed users.
+
+Trial and Minimal Use
+
+You may use the Software without a paid subscription for the sole purposes of internal trial, evaluation, or minimal use, provided that:
+* Use is limited to the capabilities and restrictions defined by the Software itself;
+* You do not copy, distribute, sublicense, reverse-engineer, or use the Software in client-facing or commercial contexts.
+
+Continued use beyond this scope requires a valid Stirling PDF User License.
+
+Modifications and Derivative Works
+
+You may modify the Software only for development or internal testing purposes. Any such modifications or derivative works:
+
+* May not be deployed in production environments without a valid User License;
+* May not be distributed or sublicensed;
+* Remain the intellectual property of Stirling PDF and/or its licensors;
+* May only be used, copied, or exploited in accordance with the terms of a valid Stirling PDF User License subscription.
+
+Prohibited Actions
+
+Unless explicitly permitted by a paid license or separate agreement, you may not:
+
+* Use the Software in production environments;
+* Copy, merge, distribute, sublicense, or sell the Software;
+* Remove or alter any licensing or copyright notices;
+* Circumvent access restrictions or licensing requirements.
+
+Third-Party Components
+
+The Stirling PDF Software may include components subject to separate open source licenses. Such components remain governed by
+their original license terms as provided by their respective owners.
+
+Disclaimer
+
+THE SOFTWARE IS PROVIDED “AS IS,� WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO WARRANTIES OF
+MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE, OR NON-INFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
+LIABLE FOR ANY CLAIM, DAMAGES, OR OTHER LIABILITY, WHETHER IN CONTRACT, TORT, OR OTHERWISE, ARISING FROM, OUT OF, OR IN
+CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
diff --git a/frontend/src/prototypes/components/AppProviders.tsx b/frontend/src/prototypes/components/AppProviders.tsx
new file mode 100644
index 0000000000..f43b96c646
--- /dev/null
+++ b/frontend/src/prototypes/components/AppProviders.tsx
@@ -0,0 +1,20 @@
+import { AppProviders as ProprietaryAppProviders } from "@proprietary/components/AppProviders";
+import { type AppProvidersProps } from "@core/components/AppProviders";
+import { ChatProvider } from "@app/components/chat/ChatContext";
+
+export type { AppProvidersProps };
+
+export function AppProviders({
+  children,
+  appConfigRetryOptions,
+  appConfigProviderProps,
+}: AppProvidersProps) {
+  return (
+    <ProprietaryAppProviders
+      appConfigRetryOptions={appConfigRetryOptions}
+      appConfigProviderProps={appConfigProviderProps}
+    >
+      <ChatProvider>{children}</ChatProvider>
+    </ProprietaryAppProviders>
+  );
+}
diff --git a/frontend/src/prototypes/components/chat/ChatContext.tsx b/frontend/src/prototypes/components/chat/ChatContext.tsx
new file mode 100644
index 0000000000..027bd56959
--- /dev/null
+++ b/frontend/src/prototypes/components/chat/ChatContext.tsx
@@ -0,0 +1,478 @@
+import {
+  createContext,
+  useContext,
+  useReducer,
+  useCallback,
+  useRef,
+  type ReactNode,
+} from "react";
+import { useAllFiles, useFileActions } from "@app/contexts/FileContext";
+import apiClient from "@app/services/apiClient";
+import { getAuthHeaders } from "@app/services/apiClientSetup";
+import { createChildStub } from "@app/contexts/file/fileActions";
+import {
+  createNewStirlingFileStub,
+  createStirlingFile,
+  type StirlingFileStub,
+} from "@app/types/fileContext";
+import type { ToolOperation } from "@app/types/file";
+
+export interface ChatMessage {
+  id: string;
+  role: "user" | "assistant";
+  content: string;
+  timestamp: number;
+  /**
+   * Tool endpoint paths executed during this assistant turn (e.g.
+   * {@code /api/v1/general/rotate-pdf}). Populated for assistant messages when the workflow
+   * ran one or more tools, in execution order. Undefined for user messages and for assistant
+   * turns that answered without running any tool.
+   */
+  toolsUsed?: string[];
+}
+
+export enum AiWorkflowPhase {
+  ANALYZING = "analyzing",
+  CALLING_ENGINE = "calling_engine",
+  EXTRACTING_CONTENT = "extracting_content",
+  EXECUTING_TOOL = "executing_tool",
+  PROCESSING = "processing",
+}
+
+export interface AiWorkflowProgress {
+  phase: AiWorkflowPhase;
+  /** Tool endpoint path currently executing, for EXECUTING_TOOL events. */
+  tool?: string;
+  /** 1-based step index, for EXECUTING_TOOL events. */
+  stepIndex?: number;
+  /** Total number of plan steps, for EXECUTING_TOOL events. */
+  stepCount?: number;
+}
+
+type AiWorkflowOutcome =
+  | "answer"
+  | "not_found"
+  | "need_content"
+  | "plan"
+  | "need_clarification"
+  | "cannot_do"
+  | "tool_call"
+  | "completed"
+  | "unsupported_capability"
+  | "cannot_continue";
+
+interface AiWorkflowResultFile {
+  /** Stirling file ID — download with /api/v1/general/files/{fileId}. */
+  fileId: string;
+  fileName: string;
+  contentType: string;
+}
+
+interface AiWorkflowResponse {
+  outcome: AiWorkflowOutcome;
+  answer?: string;
+  summary?: string;
+  rationale?: string;
+  reason?: string;
+  question?: string;
+  capability?: string;
+  message?: string;
+  evidence?: Array<{ pageNumber: number; text: string }>;
+  steps?: Array<Record<string, unknown>>;
+  /** Every file produced by the workflow (empty if the outcome has no files). */
+  resultFiles?: AiWorkflowResultFile[];
+  // Legacy single-file fields — mirror the first entry of resultFiles.
+  fileId?: string;
+  fileName?: string;
+  contentType?: string;
+}
+
+interface ChatState {
+  messages: ChatMessage[];
+  isOpen: boolean;
+  isLoading: boolean;
+  progress: AiWorkflowProgress | null;
+}
+
+type ChatAction =
+  | { type: "ADD_MESSAGE"; message: ChatMessage }
+  | { type: "SET_LOADING"; loading: boolean }
+  | { type: "SET_PROGRESS"; progress: AiWorkflowProgress | null }
+  | { type: "TOGGLE_OPEN" }
+  | { type: "SET_OPEN"; open: boolean };
+
+function chatReducer(state: ChatState, action: ChatAction): ChatState {
+  switch (action.type) {
+    case "ADD_MESSAGE":
+      return { ...state, messages: [...state.messages, action.message] };
+    case "SET_LOADING":
+      return { ...state, isLoading: action.loading };
+    case "SET_PROGRESS":
+      return { ...state, progress: action.progress };
+    case "TOGGLE_OPEN":
+      return { ...state, isOpen: !state.isOpen };
+    case "SET_OPEN":
+      return { ...state, isOpen: action.open };
+  }
+}
+
+function formatWorkflowResponse(data: AiWorkflowResponse): string {
+  switch (data.outcome) {
+    case "answer":
+    case "completed":
+      return data.answer ?? data.summary ?? "Done.";
+    case "need_clarification":
+      return data.question ?? "Could you clarify your request?";
+    case "cannot_do":
+      return data.reason ?? "I'm unable to do that.";
+    case "not_found":
+      return data.reason ?? "I couldn't find the requested information.";
+    case "unsupported_capability":
+      return (
+        data.message ??
+        `Unsupported capability: ${data.capability ?? "unknown"}`
+      );
+    case "cannot_continue":
+      return data.reason ?? "Something went wrong and I can't continue.";
+    case "plan":
+      return data.rationale
+        ? `${data.rationale}\n\n${(data.steps ?? []).map((s, i) => `${i + 1}. ${JSON.stringify(s)}`).join("\n")}`
+        : JSON.stringify(data.steps, null, 2);
+    case "need_content":
+    case "tool_call":
+      return (
+        data.rationale ?? data.summary ?? `Processing (${data.outcome})...`
+      );
+    default:
+      return (
+        data.answer ?? data.summary ?? data.message ?? JSON.stringify(data)
+      );
+  }
+}
+
+/**
+ * Parses an SSE text stream and invokes callbacks for each named event.
+ */
+interface ProgressEvent {
+  phase: string;
+  timestamp: number;
+  tool?: string;
+  stepIndex?: number;
+  stepCount?: number;
+}
+
+async function consumeSSEStream(
+  response: Response,
+  handlers: {
+    onProgress: (data: ProgressEvent) => void;
+    onResult: (data: AiWorkflowResponse) => void;
+    onError: (data: { message: string }) => void;
+  },
+) {
+  const reader = response.body!.getReader();
+  const decoder = new TextDecoder();
+  let buffer = "";
+  let currentEvent = "";
+
+  for (;;) {
+    const { done, value } = await reader.read();
+    if (done) break;
+    buffer += decoder.decode(value, { stream: true });
+
+    // SSE frames are separated by double newlines
+    let boundary = buffer.indexOf("\n\n");
+    while (boundary !== -1) {
+      const frame = buffer.slice(0, boundary);
+      buffer = buffer.slice(boundary + 2);
+
+      let dataPayload = "";
+      for (const line of frame.split("\n")) {
+        if (line.startsWith("event:")) {
+          currentEvent = line.slice(6).trim();
+        } else if (line.startsWith("data:")) {
+          dataPayload += line.slice(5);
+        }
+      }
+
+      if (dataPayload) {
+        try {
+          const parsed = JSON.parse(dataPayload);
+          if (currentEvent === "progress") {
+            handlers.onProgress(parsed);
+          } else if (currentEvent === "result") {
+            handlers.onResult(parsed);
+          } else if (currentEvent === "error") {
+            handlers.onError(parsed);
+          }
+        } catch {
+          // Skip malformed JSON frames
+        }
+      }
+      currentEvent = "";
+      boundary = buffer.indexOf("\n\n");
+    }
+  }
+}
+
+interface ChatContextValue {
+  messages: ChatMessage[];
+  isOpen: boolean;
+  isLoading: boolean;
+  progress: AiWorkflowProgress | null;
+  toggleOpen: () => void;
+  setOpen: (open: boolean) => void;
+  sendMessage: (content: string) => Promise<void>;
+}
+
+const ChatContext = createContext<ChatContextValue | null>(null);
+
+const initialState: ChatState = {
+  messages: [],
+  isOpen: false,
+  isLoading: false,
+  progress: null,
+};
+
+export function ChatProvider({ children }: { children: ReactNode }) {
+  const [state, dispatch] = useReducer(chatReducer, initialState);
+  const { files: activeFiles, fileStubs: activeFileStubs } = useAllFiles();
+  const { actions: fileActions } = useFileActions();
+  const abortRef = useRef<AbortController | null>(null);
+  const messagesRef = useRef<ChatMessage[]>(state.messages);
+  messagesRef.current = state.messages;
+
+  // Download a File from the Stirling files endpoint.
+  const downloadFile = useCallback(
+    async (descriptor: AiWorkflowResultFile): Promise<File> => {
+      const response = await apiClient.get<Blob>(
+        `/api/v1/general/files/${descriptor.fileId}`,
+        { responseType: "blob" },
+      );
+      return new File([response.data], descriptor.fileName, {
+        type: descriptor.contentType ?? response.data.type,
+      });
+    },
+    [],
+  );
+
+  // Import the files produced by an AI workflow result into FileContext.
+  //
+  // If the workflow produced the same number of outputs as inputs, map each output to its
+  // corresponding input as a new version in the same chain. Otherwise (merge, split, etc.)
+  // add the outputs as new root files.
+  const importResultFile = useCallback(
+    async (
+      result: AiWorkflowResponse,
+      sourceStubs: StirlingFileStub[],
+    ): Promise<void> => {
+      const descriptors = result.resultFiles?.length
+        ? result.resultFiles
+        : result.fileId && result.fileName && result.contentType
+          ? [
+              {
+                fileId: result.fileId,
+                fileName: result.fileName,
+                contentType: result.contentType,
+              } satisfies AiWorkflowResultFile,
+            ]
+          : [];
+      if (descriptors.length === 0) return;
+
+      const files = await Promise.all(descriptors.map(downloadFile));
+
+      const operation: ToolOperation = {
+        toolId: "ai-workflow",
+        timestamp: Date.now(),
+      };
+      const isVersionMapping =
+        sourceStubs.length > 0 && files.length === sourceStubs.length;
+      const stubs = files.map((file, i) =>
+        isVersionMapping
+          ? createChildStub(sourceStubs[i], operation, file)
+          : createNewStirlingFileStub(file),
+      );
+      const stirlingFiles = files.map((file, i) =>
+        createStirlingFile(file, stubs[i].id),
+      );
+
+      if (sourceStubs.length > 0) {
+        // Always consume the inputs so merge/split inputs are removed from the workbench.
+        // For 1:1 operations (rotate, compress) the outputs carry the version chain; for
+        // merge/split they're fresh roots.
+        await fileActions.consumeFiles(
+          sourceStubs.map((s) => s.id),
+          stirlingFiles,
+          stubs,
+        );
+      } else {
+        // No inputs were provided (unlikely for completed workflows, but handle it safely).
+        await fileActions.addFiles(files, { selectFiles: true });
+      }
+    },
+    [fileActions, downloadFile],
+  );
+
+  const toggleOpen = useCallback(() => dispatch({ type: "TOGGLE_OPEN" }), []);
+  const setOpen = useCallback(
+    (open: boolean) => dispatch({ type: "SET_OPEN", open }),
+    [],
+  );
+
+  const sendMessage = useCallback(
+    async (content: string) => {
+      // Abort any in-flight request
+      abortRef.current?.abort();
+      const controller = new AbortController();
+      abortRef.current = controller;
+
+      const priorMessages = messagesRef.current;
+
+      const userMessage: ChatMessage = {
+        id: crypto.randomUUID(),
+        role: "user",
+        content,
+        timestamp: Date.now(),
+      };
+      dispatch({ type: "ADD_MESSAGE", message: userMessage });
+      dispatch({ type: "SET_LOADING", loading: true });
+      dispatch({ type: "SET_PROGRESS", progress: null });
+
+      try {
+        const formData = new FormData();
+        formData.append("userMessage", content);
+        activeFiles.forEach((file, i) => {
+          formData.append(`fileInputs[${i}].fileInput`, file);
+        });
+        priorMessages.forEach((message, i) => {
+          formData.append(`conversationHistory[${i}].role`, message.role);
+          formData.append(`conversationHistory[${i}].content`, message.content);
+        });
+
+        const response = await fetch("/api/v1/ai/orchestrate/stream", {
+          method: "POST",
+          body: formData,
+          headers: getAuthHeaders(),
+          credentials: "include",
+          signal: controller.signal,
+        });
+
+        if (!response.ok) {
+          throw new Error(`AI engine request failed: ${response.status}`);
+        }
+
+        let receivedResult = false;
+        const toolsUsed: string[] = [];
+
+        await consumeSSEStream(response, {
+          onProgress: (data) => {
+            if (
+              data.phase === AiWorkflowPhase.EXECUTING_TOOL &&
+              typeof data.tool === "string"
+            ) {
+              toolsUsed.push(data.tool);
+            }
+            dispatch({
+              type: "SET_PROGRESS",
+              progress: {
+                phase: data.phase as AiWorkflowPhase,
+                tool: data.tool,
+                stepIndex: data.stepIndex,
+                stepCount: data.stepCount,
+              },
+            });
+          },
+          onResult: (data) => {
+            receivedResult = true;
+            dispatch({ type: "SET_PROGRESS", progress: null });
+            const replyContent = formatWorkflowResponse(data);
+            dispatch({
+              type: "ADD_MESSAGE",
+              message: {
+                id: crypto.randomUUID(),
+                role: "assistant",
+                content: replyContent,
+                timestamp: Date.now(),
+                toolsUsed: toolsUsed.length > 0 ? toolsUsed : undefined,
+              },
+            });
+            if (data.fileId || data.resultFiles?.length) {
+              importResultFile(data, activeFileStubs).catch((err) => {
+                console.error("Failed to import AI result file", err);
+                dispatch({
+                  type: "ADD_MESSAGE",
+                  message: {
+                    id: crypto.randomUUID(),
+                    role: "assistant",
+                    content:
+                      "The file was processed but I couldn't download it.",
+                    timestamp: Date.now(),
+                  },
+                });
+              });
+            }
+          },
+          onError: (data) => {
+            receivedResult = true;
+            dispatch({ type: "SET_PROGRESS", progress: null });
+            dispatch({
+              type: "ADD_MESSAGE",
+              message: {
+                id: crypto.randomUUID(),
+                role: "assistant",
+                content: data.message || "Something went wrong.",
+                timestamp: Date.now(),
+              },
+            });
+          },
+        });
+
+        if (!receivedResult) {
+          throw new Error("Stream ended without a result");
+        }
+      } catch (e) {
+        if ((e as Error).name === "AbortError") return;
+        dispatch({ type: "SET_PROGRESS", progress: null });
+        dispatch({
+          type: "ADD_MESSAGE",
+          message: {
+            id: crypto.randomUUID(),
+            role: "assistant",
+            content:
+              "Failed to get a response. The AI engine may not be available yet.",
+            timestamp: Date.now(),
+          },
+        });
+      } finally {
+        dispatch({ type: "SET_LOADING", loading: false });
+        if (abortRef.current === controller) {
+          abortRef.current = null;
+        }
+      }
+    },
+    [activeFiles, activeFileStubs, importResultFile],
+  );
+
+  return (
+    <ChatContext.Provider
+      value={{
+        messages: state.messages,
+        isOpen: state.isOpen,
+        isLoading: state.isLoading,
+        progress: state.progress,
+        toggleOpen,
+        setOpen,
+        sendMessage,
+      }}
+    >
+      {children}
+    </ChatContext.Provider>
+  );
+}
+
+export function useChat(): ChatContextValue {
+  const context = useContext(ChatContext);
+  if (!context) {
+    throw new Error("useChat must be used within a ChatProvider");
+  }
+  return context;
+}
diff --git a/frontend/src/prototypes/components/chat/ChatPanel.css b/frontend/src/prototypes/components/chat/ChatPanel.css
new file mode 100644
index 0000000000..8139d08126
--- /dev/null
+++ b/frontend/src/prototypes/components/chat/ChatPanel.css
@@ -0,0 +1,77 @@
+.chat-toggle-button {
+  position: fixed;
+  bottom: 1.5rem;
+  right: 1.5rem;
+  z-index: 1000;
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
+}
+
+.chat-panel {
+  position: fixed;
+  top: 0;
+  right: 0;
+  width: 380px;
+  height: 100vh;
+  display: flex;
+  flex-direction: column;
+  background: var(--mantine-color-body);
+  border-left: 1px solid
+    var(--border-subtle, var(--mantine-color-default-border));
+  z-index: 999;
+  box-shadow: -2px 0 8px rgba(0, 0, 0, 0.1);
+}
+
+.chat-panel-header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 0.75rem 1rem;
+  border-bottom: 1px solid
+    var(--border-subtle, var(--mantine-color-default-border));
+  flex-shrink: 0;
+}
+
+.chat-panel-messages {
+  flex: 1;
+  min-height: 0;
+}
+
+.chat-panel-input {
+  display: flex;
+  gap: 0.5rem;
+  padding: 0.75rem;
+  border-top: 1px solid
+    var(--border-subtle, var(--mantine-color-default-border));
+  flex-shrink: 0;
+}
+
+/* Message layout */
+.chat-message {
+  display: flex;
+}
+
+.chat-message-user {
+  justify-content: flex-end;
+}
+
+.chat-message-assistant {
+  justify-content: flex-start;
+}
+
+/* Bubble styling */
+.chat-bubble {
+  max-width: 85%;
+}
+
+.chat-bubble-user {
+  background: var(--mantine-color-blue-filled) !important;
+  color: white !important;
+}
+
+.chat-bubble-user * {
+  color: white !important;
+}
+
+.chat-bubble-assistant {
+  background: var(--mantine-color-default-hover) !important;
+}
diff --git a/frontend/src/prototypes/components/chat/ChatPanel.tsx b/frontend/src/prototypes/components/chat/ChatPanel.tsx
new file mode 100644
index 0000000000..4428c824d6
--- /dev/null
+++ b/frontend/src/prototypes/components/chat/ChatPanel.tsx
@@ -0,0 +1,319 @@
+import {
+  useMemo,
+  useRef,
+  useEffect,
+  useState,
+  type KeyboardEvent,
+} from "react";
+import { useTranslation } from "react-i18next";
+import {
+  ActionIcon,
+  ScrollArea,
+  TextInput,
+  Stack,
+  Text,
+  Paper,
+  Box,
+  Transition,
+  Loader,
+  Group,
+  Collapse,
+  UnstyledButton,
+  List,
+} from "@mantine/core";
+import SendIcon from "@mui/icons-material/Send";
+import ChatBubbleOutlineIcon from "@mui/icons-material/ChatBubbleOutline";
+import CloseIcon from "@mui/icons-material/Close";
+import ExpandMoreIcon from "@mui/icons-material/ExpandMore";
+import ExpandLessIcon from "@mui/icons-material/ExpandLess";
+import {
+  useChat,
+  AiWorkflowPhase,
+  type AiWorkflowProgress,
+} from "@app/components/chat/ChatContext";
+import { useTranslatedToolCatalog } from "@app/data/useTranslatedToolRegistry";
+import "@app/components/chat/ChatPanel.css";
+
+type TranslateFn = (key: string, options?: Record<string, unknown>) => string;
+
+/** Resolver mapping a tool endpoint path to its translated display name. */
+type ToolNameResolver = (endpoint: string) => string | null;
+
+/**
+ * Look up a tool's translated name from the tool catalog. The catalog's {@code operationConfig}
+ * exposes the full API endpoint path for each tool, so we key the lookup on the exact path that
+ * arrives in SSE progress events — no string parsing.
+ */
+function useToolNameResolver(): ToolNameResolver {
+  const { allTools } = useTranslatedToolCatalog();
+  return useMemo(() => {
+    const nameByEndpoint = new Map<string, string>();
+    Object.values(allTools).forEach((tool) => {
+      const endpoint = tool.operationConfig?.endpoint;
+      // Only register tools with a static endpoint. Tools whose endpoint is a function
+      // (dynamic routing, e.g. Convert / Split) need runtime params to resolve, so they fall
+      // through to the generic progress message rather than mis-matching.
+      if (typeof endpoint === "string") {
+        nameByEndpoint.set(endpoint, tool.name);
+      }
+    });
+    return (endpoint: string) => nameByEndpoint.get(endpoint) ?? null;
+  }, [allTools]);
+}
+
+function formatProgress(
+  progress: AiWorkflowProgress,
+  t: TranslateFn,
+  resolveToolName: ToolNameResolver,
+): string {
+  if (progress.phase === AiWorkflowPhase.EXECUTING_TOOL && progress.tool) {
+    const tool = resolveToolName(progress.tool);
+    const hasSteps =
+      progress.stepIndex != null &&
+      progress.stepCount != null &&
+      progress.stepCount > 1;
+    if (tool) {
+      return hasSteps
+        ? t("chat.progress.executing_tool_step", {
+            tool,
+            step: progress.stepIndex,
+            total: progress.stepCount,
+          })
+        : t("chat.progress.executing_tool_single", { tool });
+    }
+    // Unknown tool — fall back to a generic translated message rather than
+    // prettifying the endpoint path by hand.
+    return hasSteps
+      ? t("chat.progress.executing_tool_generic_step", {
+          step: progress.stepIndex,
+          total: progress.stepCount,
+        })
+      : t("chat.progress.executing_tool_generic");
+  }
+  return t(`chat.progress.${progress.phase}`);
+}
+
+function ToolsUsedBlock({
+  tools,
+  resolveToolName,
+  t,
+}: {
+  tools: string[];
+  resolveToolName: ToolNameResolver;
+  t: TranslateFn;
+}) {
+  const [expanded, setExpanded] = useState(false);
+  const names = tools.map(
+    (endpoint) => resolveToolName(endpoint) ?? t("chat.toolsUsed.unknownTool"),
+  );
+  const label = t("chat.toolsUsed.summary", { count: tools.length });
+  return (
+    <Box mt={6}>
+      <UnstyledButton
+        onClick={() => setExpanded((v) => !v)}
+        aria-expanded={expanded}
+      >
+        <Group gap={4} wrap="nowrap">
+          {expanded ? (
+            <ExpandLessIcon sx={{ fontSize: 14 }} />
+          ) : (
+            <ExpandMoreIcon sx={{ fontSize: 14 }} />
+          )}
+          <Text size="xs" c="dimmed">
+            {label}
+          </Text>
+        </Group>
+      </UnstyledButton>
+      <Collapse in={expanded}>
+        <List
+          type="ordered"
+          size="xs"
+          mt={4}
+          pl="lg"
+          styles={{ itemWrapper: { lineHeight: 1.4 } }}
+        >
+          {names.map((name, i) => (
+            <List.Item key={i}>{name}</List.Item>
+          ))}
+        </List>
+      </Collapse>
+    </Box>
+  );
+}
+
+function ChatMessageBubble({
+  role,
+  content,
+  toolsUsed,
+  resolveToolName,
+  t,
+}: {
+  role: "user" | "assistant";
+  content: string;
+  toolsUsed?: string[];
+  resolveToolName: ToolNameResolver;
+  t: TranslateFn;
+}) {
+  return (
+    <div className={`chat-message chat-message-${role}`}>
+      <Paper className={`chat-bubble chat-bubble-${role}`} p="xs" radius="md">
+        <Text size="sm" style={{ whiteSpace: "pre-wrap" }}>
+          {content}
+        </Text>
+        {toolsUsed && toolsUsed.length > 0 && (
+          <ToolsUsedBlock
+            tools={toolsUsed}
+            resolveToolName={resolveToolName}
+            t={t}
+          />
+        )}
+      </Paper>
+    </div>
+  );
+}
+
+export function ChatPanel() {
+  const { t } = useTranslation();
+  const { messages, isOpen, isLoading, progress, toggleOpen, sendMessage } =
+    useChat();
+  const resolveToolName = useToolNameResolver();
+  const [input, setInput] = useState("");
+  const scrollRef = useRef<HTMLDivElement>(null);
+  const inputRef = useRef<HTMLInputElement>(null);
+
+  useEffect(() => {
+    if (scrollRef.current) {
+      scrollRef.current.scrollTo({
+        top: scrollRef.current.scrollHeight,
+        behavior: "smooth",
+      });
+    }
+  }, [messages]);
+
+  useEffect(() => {
+    if (isOpen) {
+      inputRef.current?.focus();
+    }
+  }, [isOpen]);
+
+  const handleSend = () => {
+    const trimmed = input.trim();
+    if (!trimmed || isLoading) return;
+    setInput("");
+    sendMessage(trimmed);
+  };
+
+  const handleKeyDown = (e: KeyboardEvent<HTMLInputElement>) => {
+    if (e.key === "Enter" && !e.shiftKey) {
+      e.preventDefault();
+      handleSend();
+    }
+  };
+
+  return (
+    <>
+      {/* Toggle button - always visible */}
+      {!isOpen && (
+        <ActionIcon
+          className="chat-toggle-button"
+          variant="filled"
+          color="blue"
+          size="xl"
+          radius="xl"
+          onClick={toggleOpen}
+          aria-label="Open chat"
+        >
+          <ChatBubbleOutlineIcon sx={{ fontSize: 24 }} />
+        </ActionIcon>
+      )}
+
+      {/* Chat panel */}
+      <Transition mounted={isOpen} transition="slide-left" duration={200}>
+        {(styles) => (
+          <Box className="chat-panel" style={styles}>
+            {/* Header */}
+            <div className="chat-panel-header">
+              <Text fw={600} size="sm">
+                AI Assistant
+              </Text>
+              <ActionIcon
+                variant="subtle"
+                size="sm"
+                onClick={toggleOpen}
+                aria-label="Close chat"
+              >
+                <CloseIcon sx={{ fontSize: 16 }} />
+              </ActionIcon>
+            </div>
+
+            {/* Messages */}
+            <ScrollArea className="chat-panel-messages" viewportRef={scrollRef}>
+              <Stack gap="sm" p="sm">
+                {messages.length === 0 && (
+                  <Text size="sm" c="dimmed" ta="center" py="xl">
+                    Ask a question about your documents or get help with PDF
+                    tools.
+                  </Text>
+                )}
+                {messages.map((msg) => (
+                  <ChatMessageBubble
+                    key={msg.id}
+                    role={msg.role}
+                    content={msg.content}
+                    toolsUsed={msg.toolsUsed}
+                    resolveToolName={resolveToolName}
+                    t={t}
+                  />
+                ))}
+                {isLoading && (
+                  <div className="chat-message chat-message-assistant">
+                    <Paper
+                      className="chat-bubble chat-bubble-assistant"
+                      p="xs"
+                      radius="md"
+                    >
+                      <Group gap="xs" wrap="nowrap">
+                        <Loader size="xs" type="dots" />
+                        <Text size="sm" c="dimmed">
+                          {progress
+                            ? formatProgress(progress, t, resolveToolName)
+                            : t("chat.progress.thinking")}
+                        </Text>
+                      </Group>
+                    </Paper>
+                  </div>
+                )}
+              </Stack>
+            </ScrollArea>
+
+            {/* Input */}
+            <div className="chat-panel-input">
+              <TextInput
+                ref={inputRef}
+                placeholder="Type a message..."
+                value={input}
+                onChange={(e) => setInput(e.currentTarget.value)}
+                onKeyDown={handleKeyDown}
+                disabled={isLoading}
+                rightSection={
+                  <ActionIcon
+                    variant="filled"
+                    color="blue"
+                    size="sm"
+                    onClick={handleSend}
+                    disabled={!input.trim() || isLoading}
+                    aria-label="Send message"
+                  >
+                    <SendIcon sx={{ fontSize: 14 }} />
+                  </ActionIcon>
+                }
+                rightSectionWidth={36}
+                style={{ flex: 1 }}
+              />
+            </div>
+          </Box>
+        )}
+      </Transition>
+    </>
+  );
+}
diff --git a/frontend/src/prototypes/components/home/HomePageExtensions.tsx b/frontend/src/prototypes/components/home/HomePageExtensions.tsx
new file mode 100644
index 0000000000..1e44646ce2
--- /dev/null
+++ b/frontend/src/prototypes/components/home/HomePageExtensions.tsx
@@ -0,0 +1,5 @@
+import { ChatPanel } from "@app/components/chat/ChatPanel";
+
+export function HomePageExtensions() {
+  return <ChatPanel />;
+}
diff --git a/frontend/src/prototypes/tsconfig.json b/frontend/src/prototypes/tsconfig.json
new file mode 100644
index 0000000000..44e477e984
--- /dev/null
+++ b/frontend/src/prototypes/tsconfig.json
@@ -0,0 +1,19 @@
+{
+  "extends": "../../tsconfig.json",
+  "compilerOptions": {
+    "baseUrl": "../../",
+    "paths": {
+      "@app/*": ["src/prototypes/*", "src/proprietary/*", "src/core/*"],
+      "@proprietary/*": ["src/proprietary/*"],
+      "@core/*": ["src/core/*"]
+    }
+  },
+  "include": [
+    "../global.d.ts",
+    "../*.js",
+    "../*.ts",
+    "../*.tsx",
+    "../core/setupTests.ts",
+    "."
+  ]
+}
diff --git a/frontend/src/reportWebVitals.js b/frontend/src/reportWebVitals.js
index 5253d3ad9e..9ecd33f9ca 100644
--- a/frontend/src/reportWebVitals.js
+++ b/frontend/src/reportWebVitals.js
@@ -1,6 +1,6 @@
-const reportWebVitals = onPerfEntry => {
+const reportWebVitals = (onPerfEntry) => {
   if (onPerfEntry && onPerfEntry instanceof Function) {
-    import('web-vitals').then(({ getCLS, getFID, getFCP, getLCP, getTTFB }) => {
+    import("web-vitals").then(({ getCLS, getFID, getFCP, getLCP, getTTFB }) => {
       getCLS(onPerfEntry);
       getFID(onPerfEntry);
       getFCP(onPerfEntry);
diff --git a/frontend/src/saas/App.tsx b/frontend/src/saas/App.tsx
index 4a8c5f9b17..02d4688fb9 100644
--- a/frontend/src/saas/App.tsx
+++ b/frontend/src/saas/App.tsx
@@ -1,27 +1,27 @@
-import { Suspense } from 'react';
-import { Routes, Route } from 'react-router-dom';
-import { AppProviders } from '@app/components/AppProviders';
-import { setBaseUrl } from '@app/constants/app';
-import type { AppConfig } from '@app/contexts/AppConfigContext';
-import { AppLayout } from '@app/components/AppLayout';
-import { LoadingFallback } from '@app/components/shared/LoadingFallback';
-import OnboardingTour from '@app/components/onboarding/OnboardingTour';
-import Landing from '@app/routes/Landing';
-import Login from '@app/routes/Login';
-import Signup from '@app/routes/Signup';
-import AuthCallback from '@app/routes/AuthCallback';
-import ResetPassword from '@app/routes/ResetPassword';
-import OnboardingBootstrap from '@app/components/OnboardingBootstrap';
-import TrialExpiredBootstrap from '@app/components/TrialExpiredBootstrap';
+import { Suspense } from "react";
+import { Routes, Route } from "react-router-dom";
+import { AppProviders } from "@app/components/AppProviders";
+import { setBaseUrl } from "@app/constants/app";
+import type { AppConfig } from "@app/contexts/AppConfigContext";
+import { AppLayout } from "@app/components/AppLayout";
+import { LoadingFallback } from "@app/components/shared/LoadingFallback";
+import OnboardingTour from "@app/components/onboarding/OnboardingTour";
+import Landing from "@app/routes/Landing";
+import Login from "@app/routes/Login";
+import Signup from "@app/routes/Signup";
+import AuthCallback from "@app/routes/AuthCallback";
+import ResetPassword from "@app/routes/ResetPassword";
+import OnboardingBootstrap from "@app/components/OnboardingBootstrap";
+import TrialExpiredBootstrap from "@app/components/TrialExpiredBootstrap";
 
 // Import global styles
-import '@app/styles/tailwind.css';
-import '@app/styles/saas-theme.css';
-import '@app/styles/cookieconsent.css';
-import '@app/styles/index.css';
+import "@app/styles/tailwind.css";
+import "@app/styles/saas-theme.css";
+import "@app/styles/cookieconsent.css";
+import "@app/styles/index.css";
 
 // Import file ID debugging helpers (development only)
-import '@app/utils/fileIdSafety';
+import "@app/utils/fileIdSafety";
 
 function handleConfigLoaded(config: AppConfig) {
   if (config.baseUrl) setBaseUrl(config.baseUrl);
@@ -30,7 +30,9 @@ function handleConfigLoaded(config: AppConfig) {
 export default function App() {
   return (
     <Suspense fallback={<LoadingFallback />}>
-      <AppProviders appConfigProviderProps={{ onConfigLoaded: handleConfigLoaded }}>
+      <AppProviders
+        appConfigProviderProps={{ onConfigLoaded: handleConfigLoaded }}
+      >
         <AppLayout>
           <OnboardingBootstrap />
           <TrialExpiredBootstrap />
diff --git a/frontend/src/saas/auth/UseSession.tsx b/frontend/src/saas/auth/UseSession.tsx
index fd46263694..e6d59d045d 100644
--- a/frontend/src/saas/auth/UseSession.tsx
+++ b/frontend/src/saas/auth/UseSession.tsx
@@ -1,44 +1,66 @@
-import { createContext, useContext, useEffect, useState, ReactNode, useCallback } from 'react'
-import { supabase } from '@app/auth/supabase'
-import type { Session, User as SupabaseUser, AuthError } from '@supabase/supabase-js'
-import { CreditSummary, SubscriptionInfo, CreditCheckResult, ApiCredits } from '@app/types/credits'
-import apiClient, { setGlobalCreditUpdateCallback } from '@app/services/apiClient'
-import { synchronizeUserUpgrade } from '@app/services/userService'
-import { syncOAuthAvatar, getProfilePictureMetadata, type ProfilePictureMetadata } from '@app/services/avatarSyncService'
+import {
+  createContext,
+  useContext,
+  useEffect,
+  useState,
+  ReactNode,
+  useCallback,
+} from "react";
+import { supabase } from "@app/auth/supabase";
+import type {
+  Session,
+  User as SupabaseUser,
+  AuthError,
+} from "@supabase/supabase-js";
+import {
+  CreditSummary,
+  SubscriptionInfo,
+  CreditCheckResult,
+  ApiCredits,
+} from "@app/types/credits";
+import apiClient, {
+  setGlobalCreditUpdateCallback,
+} from "@app/services/apiClient";
+import { synchronizeUserUpgrade } from "@app/services/userService";
+import {
+  syncOAuthAvatar,
+  getProfilePictureMetadata,
+  type ProfilePictureMetadata,
+} from "@app/services/avatarSyncService";
 
 // Extend Supabase User to include optional username for compatibility
 export type User = SupabaseUser & { username?: string };
 
 export interface TrialStatus {
-  isTrialing: boolean
-  trialEnd: string
-  daysRemaining: number
-  hasPaymentMethod: boolean
-  hasScheduledSub: boolean
-  status: string
+  isTrialing: boolean;
+  trialEnd: string;
+  daysRemaining: number;
+  hasPaymentMethod: boolean;
+  hasScheduledSub: boolean;
+  status: string;
 }
 
 interface AuthContextType {
-  session: Session | null
-  user: User | null
-  loading: boolean
-  error: AuthError | null
-  creditBalance: number | null
-  subscription: SubscriptionInfo | null
-  creditSummary: CreditSummary | null
-  isPro: boolean | null
-  trialStatus: TrialStatus | null
-  profilePictureUrl: string | null
-  profilePictureMetadata: ProfilePictureMetadata | null
-  signOut: () => Promise<void>
-  refreshSession: () => Promise<void>
-  hasSufficientCredits: (requiredCredits: number) => CreditCheckResult
-  updateCredits: (newBalance: number) => void
-  refreshCredits: () => Promise<void>
-  refreshProStatus: () => Promise<void>
-  refreshTrialStatus: () => Promise<void>
-  refreshProfilePicture: () => Promise<void>
-  refreshProfilePictureMetadata: () => Promise<void>
+  session: Session | null;
+  user: User | null;
+  loading: boolean;
+  error: AuthError | null;
+  creditBalance: number | null;
+  subscription: SubscriptionInfo | null;
+  creditSummary: CreditSummary | null;
+  isPro: boolean | null;
+  trialStatus: TrialStatus | null;
+  profilePictureUrl: string | null;
+  profilePictureMetadata: ProfilePictureMetadata | null;
+  signOut: () => Promise<void>;
+  refreshSession: () => Promise<void>;
+  hasSufficientCredits: (requiredCredits: number) => CreditCheckResult;
+  updateCredits: (newBalance: number) => void;
+  refreshCredits: () => Promise<void>;
+  refreshProStatus: () => Promise<void>;
+  refreshTrialStatus: () => Promise<void>;
+  refreshProfilePicture: () => Promise<void>;
+  refreshProfilePictureMetadata: () => Promise<void>;
 }
 
 const AuthContext = createContext<AuthContextType>({
@@ -55,473 +77,582 @@ const AuthContext = createContext<AuthContextType>({
   profilePictureMetadata: null,
   signOut: async () => {},
   refreshSession: async () => {},
-  hasSufficientCredits: () => ({ hasSufficientCredits: false, currentBalance: 0, requiredCredits: 0 }),
+  hasSufficientCredits: () => ({
+    hasSufficientCredits: false,
+    currentBalance: 0,
+    requiredCredits: 0,
+  }),
   updateCredits: () => {},
   refreshCredits: async () => {},
   refreshProStatus: async () => {},
   refreshTrialStatus: async () => {},
   refreshProfilePicture: async () => {},
-  refreshProfilePictureMetadata: async () => {}
-})
+  refreshProfilePictureMetadata: async () => {},
+});
 
 export function AuthProvider({ children }: { children: ReactNode }) {
-  const [session, setSession] = useState<Session | null>(null)
-  const [loading, setLoading] = useState(true)
-  const [error, setError] = useState<AuthError | null>(null)
-  const [creditBalance, setCreditBalance] = useState<number | null>(null)
-  const [subscription, setSubscription] = useState<SubscriptionInfo | null>(null)
-  const [creditSummary, setCreditSummary] = useState<CreditSummary | null>(null)
-  const [isPro, setIsPro] = useState<boolean | null>(null)
-  const [trialStatus, setTrialStatus] = useState<TrialStatus | null>(null)
-  const [profilePictureUrl, setProfilePictureUrl] = useState<string | null>(null)
-  const [profilePictureMetadata, setProfilePictureMetadata] = useState<ProfilePictureMetadata | null>(null)
+  const [session, setSession] = useState<Session | null>(null);
+  const [loading, setLoading] = useState(true);
+  const [error, setError] = useState<AuthError | null>(null);
+  const [creditBalance, setCreditBalance] = useState<number | null>(null);
+  const [subscription, setSubscription] = useState<SubscriptionInfo | null>(
+    null,
+  );
+  const [creditSummary, setCreditSummary] = useState<CreditSummary | null>(
+    null,
+  );
+  const [isPro, setIsPro] = useState<boolean | null>(null);
+  const [trialStatus, setTrialStatus] = useState<TrialStatus | null>(null);
+  const [profilePictureUrl, setProfilePictureUrl] = useState<string | null>(
+    null,
+  );
+  const [profilePictureMetadata, setProfilePictureMetadata] =
+    useState<ProfilePictureMetadata | null>(null);
 
-  const fetchCredits = useCallback(async (sessionToUse?: Session | null) => {
-    const currentSession = sessionToUse ?? session
+  const fetchCredits = useCallback(
+    async (sessionToUse?: Session | null) => {
+      const currentSession = sessionToUse ?? session;
 
-    if (!currentSession?.user) {
-      console.debug('[Auth Debug] No user session, skipping credit fetch')
-      setCreditBalance(null)
-      setCreditSummary(null)
-      setSubscription(null)
-      return
-    }
-
-    try {
-      console.debug('[Auth Debug] Fetching credits for user:', currentSession.user.id)
-      const response = await apiClient.get<ApiCredits>('/api/v1/credits')
-      const apiCredits = response.data
-
-      // Map server payload to app CreditSummary
-      const credits: CreditSummary = {
-        currentCredits: apiCredits.totalAvailableCredits,
-        maxCredits: apiCredits.weeklyCreditsAllocated + apiCredits.totalBoughtCredits,
-        creditsUsed: (apiCredits.weeklyCreditsAllocated - apiCredits.weeklyCreditsRemaining) + (apiCredits.totalBoughtCredits - apiCredits.boughtCreditsRemaining),
-        creditsRemaining: apiCredits.totalAvailableCredits,
-        resetDate: apiCredits.weeklyResetDate,
-        weeklyAllowance: apiCredits.weeklyCreditsAllocated
+      if (!currentSession?.user) {
+        console.debug("[Auth Debug] No user session, skipping credit fetch");
+        setCreditBalance(null);
+        setCreditSummary(null);
+        setSubscription(null);
+        return;
       }
 
-      setCreditSummary(credits)
-      setCreditBalance(credits.creditsRemaining)
+      try {
+        console.debug(
+          "[Auth Debug] Fetching credits for user:",
+          currentSession.user.id,
+        );
+        const response = await apiClient.get<ApiCredits>("/api/v1/credits");
+        const apiCredits = response.data;
 
-      const subscriptionInfo: SubscriptionInfo = {
-        status: 'active',
-        tier: (credits.weeklyAllowance || 0) > 100 ? 'premium' : 'free',
-        creditsPerWeek: credits.weeklyAllowance,
-        maxCredits: credits.maxCredits
+        // Map server payload to app CreditSummary
+        const credits: CreditSummary = {
+          currentCredits: apiCredits.totalAvailableCredits,
+          maxCredits:
+            apiCredits.weeklyCreditsAllocated + apiCredits.totalBoughtCredits,
+          creditsUsed:
+            apiCredits.weeklyCreditsAllocated -
+            apiCredits.weeklyCreditsRemaining +
+            (apiCredits.totalBoughtCredits - apiCredits.boughtCreditsRemaining),
+          creditsRemaining: apiCredits.totalAvailableCredits,
+          resetDate: apiCredits.weeklyResetDate,
+          weeklyAllowance: apiCredits.weeklyCreditsAllocated,
+        };
+
+        setCreditSummary(credits);
+        setCreditBalance(credits.creditsRemaining);
+
+        const subscriptionInfo: SubscriptionInfo = {
+          status: "active",
+          tier: (credits.weeklyAllowance || 0) > 100 ? "premium" : "free",
+          creditsPerWeek: credits.weeklyAllowance,
+          maxCredits: credits.maxCredits,
+        };
+        setSubscription(subscriptionInfo);
+
+        console.debug("[Auth Debug] Credits fetched successfully:", credits);
+      } catch (error: unknown) {
+        console.debug("[Auth Debug] Failed to fetch credits:", error);
+        // Don't set error state for credit fetching failures to avoid disrupting auth flow
+        // Credits might not be available in all deployments
+        setCreditBalance(null);
+        setCreditSummary(null);
+        setSubscription(null);
       }
-      setSubscription(subscriptionInfo)
-
-      console.debug('[Auth Debug] Credits fetched successfully:', credits)
-    } catch (error: unknown) {
-      console.debug('[Auth Debug] Failed to fetch credits:', error)
-      // Don't set error state for credit fetching failures to avoid disrupting auth flow
-      // Credits might not be available in all deployments
-      setCreditBalance(null)
-      setCreditSummary(null)
-      setSubscription(null)
-    }
-  }, [session])
+    },
+    [session],
+  );
 
   const refreshCredits = useCallback(async () => {
-    await fetchCredits()
-  }, [fetchCredits])
+    await fetchCredits();
+  }, [fetchCredits]);
 
-  const fetchProStatus = useCallback(async (sessionToUse?: Session | null) => {
-    const currentSession = sessionToUse ?? session
+  const fetchProStatus = useCallback(
+    async (sessionToUse?: Session | null) => {
+      const currentSession = sessionToUse ?? session;
 
-    if (!currentSession?.user) {
-      console.debug('[Auth Debug] No user session, skipping pro status fetch')
-      setIsPro(null)
-      return
-    }
-
-    try {
-      console.debug('[Auth Debug] Fetching pro status for user:', currentSession.user.id)
-      const { data: proStatus, error } = await supabase.rpc('is_pro')
-
-      if (error) {
-        console.error('[Auth Debug] Error checking Pro status:', error)
-        setIsPro(false) // Default to false if there's an error
-      } else {
-        const isProUser = Boolean(proStatus)
-        setIsPro(isProUser)
-        console.debug('[Auth Debug] Pro status fetched:', isProUser)
+      if (!currentSession?.user) {
+        console.debug(
+          "[Auth Debug] No user session, skipping pro status fetch",
+        );
+        setIsPro(null);
+        return;
       }
-    } catch (error: unknown) {
-      console.debug('[Auth Debug] Failed to fetch pro status:', error)
-      setIsPro(false) // Default to false if there's an error
-    }
-  }, [session])
+
+      try {
+        console.debug(
+          "[Auth Debug] Fetching pro status for user:",
+          currentSession.user.id,
+        );
+        const { data: proStatus, error } = await supabase.rpc("is_pro");
+
+        if (error) {
+          console.error("[Auth Debug] Error checking Pro status:", error);
+          setIsPro(false); // Default to false if there's an error
+        } else {
+          const isProUser = Boolean(proStatus);
+          setIsPro(isProUser);
+          console.debug("[Auth Debug] Pro status fetched:", isProUser);
+        }
+      } catch (error: unknown) {
+        console.debug("[Auth Debug] Failed to fetch pro status:", error);
+        setIsPro(false); // Default to false if there's an error
+      }
+    },
+    [session],
+  );
 
   const refreshProStatus = useCallback(async () => {
-    await fetchProStatus()
-  }, [fetchProStatus])
+    await fetchProStatus();
+  }, [fetchProStatus]);
 
-  const fetchTrialStatus = useCallback(async (sessionToUse?: Session | null) => {
-    const currentSession = sessionToUse ?? session
+  const fetchTrialStatus = useCallback(
+    async (sessionToUse?: Session | null) => {
+      const currentSession = sessionToUse ?? session;
 
-    if (!currentSession?.user) {
-      console.debug('[Auth Debug] No user session, skipping trial status fetch')
-      setTrialStatus(null)
-      return
-    }
-
-    try {
-      console.debug('[Auth Debug] Fetching trial status for user:', currentSession.user.id)
-      const { data, error } = await supabase
-        .from('billing_subscriptions')
-        .select('status, trial_end, has_payment_method, scheduled_subscription_id')
-        .in('status', ['trialing', 'incomplete_expired', 'canceled'])
-        .order('created_at', { ascending: false })
-        .limit(1)
-        .maybeSingle()
-
-      if (error) {
-        console.error('[Auth Debug] Error fetching trial status:', error)
-        setTrialStatus(null)
-        return
+      if (!currentSession?.user) {
+        console.debug(
+          "[Auth Debug] No user session, skipping trial status fetch",
+        );
+        setTrialStatus(null);
+        return;
       }
 
-      if (data?.trial_end) {
-        const trialEnd = new Date(data.trial_end)
-        const now = new Date()
-        const daysRemaining = Math.ceil((trialEnd.getTime() - now.getTime()) / (1000 * 60 * 60 * 24))
+      try {
+        console.debug(
+          "[Auth Debug] Fetching trial status for user:",
+          currentSession.user.id,
+        );
+        const { data, error } = await supabase
+          .from("billing_subscriptions")
+          .select(
+            "status, trial_end, has_payment_method, scheduled_subscription_id",
+          )
+          .in("status", ["trialing", "incomplete_expired", "canceled"])
+          .order("created_at", { ascending: false })
+          .limit(1)
+          .maybeSingle();
 
-        setTrialStatus({
-          isTrialing: data.status === 'trialing' && daysRemaining > 0,
-          trialEnd: data.trial_end,
-          daysRemaining: Math.max(0, daysRemaining),
-          hasPaymentMethod: data.has_payment_method || false,
-          hasScheduledSub: !!data.scheduled_subscription_id,
-          status: data.status
-        })
-        console.debug('[Auth Debug] Trial status fetched:', {
-          status: data.status,
-          daysRemaining: Math.max(0, daysRemaining),
-          hasPaymentMethod: data.has_payment_method,
-          isTrialing: data.status === 'trialing' && daysRemaining > 0
-        })
-      } else {
-        setTrialStatus(null)
+        if (error) {
+          console.error("[Auth Debug] Error fetching trial status:", error);
+          setTrialStatus(null);
+          return;
+        }
+
+        if (data?.trial_end) {
+          const trialEnd = new Date(data.trial_end);
+          const now = new Date();
+          const daysRemaining = Math.ceil(
+            (trialEnd.getTime() - now.getTime()) / (1000 * 60 * 60 * 24),
+          );
+
+          setTrialStatus({
+            isTrialing: data.status === "trialing" && daysRemaining > 0,
+            trialEnd: data.trial_end,
+            daysRemaining: Math.max(0, daysRemaining),
+            hasPaymentMethod: data.has_payment_method || false,
+            hasScheduledSub: !!data.scheduled_subscription_id,
+            status: data.status,
+          });
+          console.debug("[Auth Debug] Trial status fetched:", {
+            status: data.status,
+            daysRemaining: Math.max(0, daysRemaining),
+            hasPaymentMethod: data.has_payment_method,
+            isTrialing: data.status === "trialing" && daysRemaining > 0,
+          });
+        } else {
+          setTrialStatus(null);
+        }
+      } catch (error: unknown) {
+        console.debug("[Auth Debug] Failed to fetch trial status:", error);
+        setTrialStatus(null);
       }
-    } catch (error: unknown) {
-      console.debug('[Auth Debug] Failed to fetch trial status:', error)
-      setTrialStatus(null)
-    }
-  }, [session])
+    },
+    [session],
+  );
 
   const refreshTrialStatus = useCallback(async () => {
-    await fetchTrialStatus()
-  }, [fetchTrialStatus])
+    await fetchTrialStatus();
+  }, [fetchTrialStatus]);
 
-  const fetchProfilePicture = useCallback(async (sessionToUse?: Session | null) => {
-    const currentSession = sessionToUse ?? session
+  const fetchProfilePicture = useCallback(
+    async (sessionToUse?: Session | null) => {
+      const currentSession = sessionToUse ?? session;
 
-    if (!currentSession?.user) {
-      console.debug('[Auth Debug] No user session, skipping profile picture fetch')
-      setProfilePictureUrl(null)
-      return
-    }
-
-    try {
-      const PROFILE_BUCKET = 'profile-pictures'
-      const profilePath = `${currentSession.user.id}/avatar`
-
-      console.debug('[Auth Debug] Fetching profile picture for user:', currentSession.user.id)
-      const { data, error } = await supabase
-        .storage
-        .from(PROFILE_BUCKET)
-        .createSignedUrl(profilePath, 60 * 60)
-
-      if (error) {
-        // Profile picture not found is expected for users without uploads
-        console.debug('[Auth Debug] Profile picture not available:', error.message)
-        setProfilePictureUrl(null)
-      } else {
-        setProfilePictureUrl(data.signedUrl)
-        console.debug('[Auth Debug] Profile picture URL fetched successfully')
+      if (!currentSession?.user) {
+        console.debug(
+          "[Auth Debug] No user session, skipping profile picture fetch",
+        );
+        setProfilePictureUrl(null);
+        return;
       }
-    } catch (error: unknown) {
-      console.debug('[Auth Debug] Failed to fetch profile picture:', error)
-      setProfilePictureUrl(null)
-    }
-  }, [session])
+
+      try {
+        const PROFILE_BUCKET = "profile-pictures";
+        const profilePath = `${currentSession.user.id}/avatar`;
+
+        console.debug(
+          "[Auth Debug] Fetching profile picture for user:",
+          currentSession.user.id,
+        );
+        const { data, error } = await supabase.storage
+          .from(PROFILE_BUCKET)
+          .createSignedUrl(profilePath, 60 * 60);
+
+        if (error) {
+          // Profile picture not found is expected for users without uploads
+          console.debug(
+            "[Auth Debug] Profile picture not available:",
+            error.message,
+          );
+          setProfilePictureUrl(null);
+        } else {
+          setProfilePictureUrl(data.signedUrl);
+          console.debug(
+            "[Auth Debug] Profile picture URL fetched successfully",
+          );
+        }
+      } catch (error: unknown) {
+        console.debug("[Auth Debug] Failed to fetch profile picture:", error);
+        setProfilePictureUrl(null);
+      }
+    },
+    [session],
+  );
 
   const refreshProfilePicture = useCallback(async () => {
-    await fetchProfilePicture()
-  }, [fetchProfilePicture])
+    await fetchProfilePicture();
+  }, [fetchProfilePicture]);
 
-  const fetchProfilePictureMetadata = useCallback(async (sessionToUse?: Session | null) => {
-    const currentSession = sessionToUse ?? session
+  const fetchProfilePictureMetadata = useCallback(
+    async (sessionToUse?: Session | null) => {
+      const currentSession = sessionToUse ?? session;
 
-    if (!currentSession?.user) {
-      console.debug('[Auth Debug] No user session, skipping profile picture metadata fetch')
-      setProfilePictureMetadata(null)
-      return
-    }
+      if (!currentSession?.user) {
+        console.debug(
+          "[Auth Debug] No user session, skipping profile picture metadata fetch",
+        );
+        setProfilePictureMetadata(null);
+        return;
+      }
 
-    try {
-      console.debug('[Auth Debug] Fetching profile picture metadata for user:', currentSession.user.id)
-      const metadata = await getProfilePictureMetadata(currentSession.user.id)
-      setProfilePictureMetadata(metadata)
-      console.debug('[Auth Debug] Profile picture metadata fetched:', metadata)
-    } catch (error: unknown) {
-      console.debug('[Auth Debug] Failed to fetch profile picture metadata:', error)
-      setProfilePictureMetadata(null)
-    }
-  }, [session])
+      try {
+        console.debug(
+          "[Auth Debug] Fetching profile picture metadata for user:",
+          currentSession.user.id,
+        );
+        const metadata = await getProfilePictureMetadata(
+          currentSession.user.id,
+        );
+        setProfilePictureMetadata(metadata);
+        console.debug(
+          "[Auth Debug] Profile picture metadata fetched:",
+          metadata,
+        );
+      } catch (error: unknown) {
+        console.debug(
+          "[Auth Debug] Failed to fetch profile picture metadata:",
+          error,
+        );
+        setProfilePictureMetadata(null);
+      }
+    },
+    [session],
+  );
 
   const refreshProfilePictureMetadata = useCallback(async () => {
-    await fetchProfilePictureMetadata()
-  }, [fetchProfilePictureMetadata])
+    await fetchProfilePictureMetadata();
+  }, [fetchProfilePictureMetadata]);
 
-  const updateCredits = useCallback((newBalance: number) => {
-    console.debug('[Auth Debug] Updating credit balance:', { from: creditBalance, to: newBalance })
-    setCreditBalance(newBalance)
-    // Also update the creditSummary if it exists
-    if (creditSummary) {
-      const updatedSummary: CreditSummary = {
-        ...creditSummary,
-        creditsRemaining: newBalance,
-        currentCredits: newBalance
+  const updateCredits = useCallback(
+    (newBalance: number) => {
+      console.debug("[Auth Debug] Updating credit balance:", {
+        from: creditBalance,
+        to: newBalance,
+      });
+      setCreditBalance(newBalance);
+      // Also update the creditSummary if it exists
+      if (creditSummary) {
+        const updatedSummary: CreditSummary = {
+          ...creditSummary,
+          creditsRemaining: newBalance,
+          currentCredits: newBalance,
+        };
+        setCreditSummary(updatedSummary);
       }
-      setCreditSummary(updatedSummary)
-    }
-  }, [creditSummary])
+    },
+    [creditSummary],
+  );
 
-  const hasSufficientCredits = useCallback((requiredCredits: number): CreditCheckResult => {
-    const currentBalance = creditBalance ?? 0
-    const hasSufficient = currentBalance >= requiredCredits
-    console.debug('[Auth Debug] Credit check:', { requiredCredits, currentBalance, hasSufficient })
+  const hasSufficientCredits = useCallback(
+    (requiredCredits: number): CreditCheckResult => {
+      const currentBalance = creditBalance ?? 0;
+      const hasSufficient = currentBalance >= requiredCredits;
+      console.debug("[Auth Debug] Credit check:", {
+        requiredCredits,
+        currentBalance,
+        hasSufficient,
+      });
 
-    return {
-      hasSufficientCredits: hasSufficient,
-      currentBalance,
-      requiredCredits,
-      shortfall: hasSufficient ? undefined : requiredCredits - currentBalance
-    }
-  }, [creditBalance])
+      return {
+        hasSufficientCredits: hasSufficient,
+        currentBalance,
+        requiredCredits,
+        shortfall: hasSufficient ? undefined : requiredCredits - currentBalance,
+      };
+    },
+    [creditBalance],
+  );
 
   const refreshSession = async () => {
     try {
-      setLoading(true)
-      setError(null)
-      const { data, error } = await supabase.auth.refreshSession()
+      setLoading(true);
+      setError(null);
+      const { data, error } = await supabase.auth.refreshSession();
 
       if (error) {
-        console.error('[Auth Debug] Session refresh error:', error)
-        setError(error)
-        setSession(null)
+        console.error("[Auth Debug] Session refresh error:", error);
+        setError(error);
+        setSession(null);
       } else {
-        console.debug('[Auth Debug] Session refreshed successfully')
-        setSession(data.session)
+        console.debug("[Auth Debug] Session refreshed successfully");
+        setSession(data.session);
       }
     } catch (err) {
-      console.error('[Auth Debug] Unexpected error during session refresh:', err)
-      setError(err as AuthError)
+      console.error(
+        "[Auth Debug] Unexpected error during session refresh:",
+        err,
+      );
+      setError(err as AuthError);
     } finally {
-      setLoading(false)
+      setLoading(false);
     }
-  }
+  };
 
   const signOut = async () => {
     try {
-      setError(null)
-      const { error } = await supabase.auth.signOut()
+      setError(null);
+      const { error } = await supabase.auth.signOut();
 
       if (error) {
-        console.error('[Auth Debug] Sign out error:', error)
-        setError(error)
+        console.error("[Auth Debug] Sign out error:", error);
+        setError(error);
       } else {
-        console.debug('[Auth Debug] Signed out successfully')
-        setSession(null)
+        console.debug("[Auth Debug] Signed out successfully");
+        setSession(null);
       }
     } catch (err) {
-      console.error('[Auth Debug] Unexpected error during sign out:', err)
-      setError(err as AuthError)
+      console.error("[Auth Debug] Unexpected error during sign out:", err);
+      setError(err as AuthError);
     }
-  }
+  };
 
   // Set up global credit update callback
   useEffect(() => {
-    setGlobalCreditUpdateCallback(updateCredits)
-  }, [updateCredits])
+    setGlobalCreditUpdateCallback(updateCredits);
+  }, [updateCredits]);
 
   useEffect(() => {
-    let mounted = true
+    let mounted = true;
 
     // Load current session on first mount
     const initializeAuth = async () => {
       try {
-        console.debug('[Auth Debug] Initializing auth...')
-        const { data, error } = await supabase.auth.getSession()
+        console.debug("[Auth Debug] Initializing auth...");
+        const { data, error } = await supabase.auth.getSession();
 
-        if (!mounted) return
+        if (!mounted) return;
 
         if (error) {
-          console.error('[Auth Debug] Initial session error:', error)
-          setError(error)
+          console.error("[Auth Debug] Initial session error:", error);
+          setError(error);
         } else {
-          console.debug('[Auth Debug] Initial session loaded:', {
+          console.debug("[Auth Debug] Initial session loaded:", {
             hasSession: !!data.session,
             userId: data.session?.user?.id,
-            email: data.session?.user?.email
-          })
-          setSession(data.session)
+            email: data.session?.user?.email,
+          });
+          setSession(data.session);
 
           // Fetch credits, pro status, trial status, profile picture metadata, and profile picture using the session from the response
           if (data.session?.user) {
             // Sync OAuth avatar in background
             syncOAuthAvatar(data.session.user).catch((err) => {
-              console.debug('[Auth Debug] Failed to sync OAuth avatar on init:', err)
-            })
+              console.debug(
+                "[Auth Debug] Failed to sync OAuth avatar on init:",
+                err,
+              );
+            });
 
-            await fetchCredits(data.session)
-            await fetchProStatus(data.session)
-            await fetchTrialStatus(data.session)
-            await fetchProfilePictureMetadata(data.session)
+            await fetchCredits(data.session);
+            await fetchProStatus(data.session);
+            await fetchTrialStatus(data.session);
+            await fetchProfilePictureMetadata(data.session);
 
             // Small delay to allow avatar sync to complete if quick
             setTimeout(() => {
-              fetchProfilePicture(data.session)
-            }, 500)
+              fetchProfilePicture(data.session);
+            }, 500);
           }
         }
       } catch (err) {
-        console.error('[Auth Debug] Unexpected error during auth initialization:', err)
+        console.error(
+          "[Auth Debug] Unexpected error during auth initialization:",
+          err,
+        );
         if (mounted) {
-          setError(err as AuthError)
+          setError(err as AuthError);
         }
       } finally {
         if (mounted) {
-          setLoading(false)
+          setLoading(false);
         }
       }
-    }
+    };
 
-    initializeAuth()
+    initializeAuth();
 
     // Subscribe to auth state changes
-    const { data: { subscription } } = supabase.auth.onAuthStateChange(
-      async (event, newSession) => {
-        if (!mounted) return
+    const {
+      data: { subscription },
+    } = supabase.auth.onAuthStateChange(async (event, newSession) => {
+      if (!mounted) return;
 
-        console.debug('[Auth Debug] Auth state change:', {
-          event,
-          hasSession: !!newSession,
-          userId: newSession?.user?.id,
-          email: newSession?.user?.email,
-          timestamp: new Date().toISOString()
-        })
+      console.debug("[Auth Debug] Auth state change:", {
+        event,
+        hasSession: !!newSession,
+        userId: newSession?.user?.id,
+        email: newSession?.user?.email,
+        timestamp: new Date().toISOString(),
+      });
 
-        // Don't run supabase calls inside this callback; schedule them
-        setTimeout(() => {
-          if (mounted) {
-            setSession(newSession)
-            setError(null)
+      // Don't run supabase calls inside this callback; schedule them
+      setTimeout(() => {
+        if (mounted) {
+          setSession(newSession);
+          setError(null);
 
-            // Additional handling for specific events
-            if (event === 'SIGNED_OUT') {
-              console.debug('[Auth Debug] User signed out, clearing session')
-              // Clear credit data, pro status, trial status, profile picture, and metadata on sign out
-              setCreditBalance(null)
-              setCreditSummary(null)
-              setSubscription(null)
-              setIsPro(null)
-              setTrialStatus(null)
-              setProfilePictureUrl(null)
-              setProfilePictureMetadata(null)
-            } else if (event === 'SIGNED_IN') {
-              console.debug('[Auth Debug] User signed in successfully')
-              if (newSession?.user) {
-                setLoading(true)
+          // Additional handling for specific events
+          if (event === "SIGNED_OUT") {
+            console.debug("[Auth Debug] User signed out, clearing session");
+            // Clear credit data, pro status, trial status, profile picture, and metadata on sign out
+            setCreditBalance(null);
+            setCreditSummary(null);
+            setSubscription(null);
+            setIsPro(null);
+            setTrialStatus(null);
+            setProfilePictureUrl(null);
+            setProfilePictureMetadata(null);
+          } else if (event === "SIGNED_IN") {
+            console.debug("[Auth Debug] User signed in successfully");
+            if (newSession?.user) {
+              setLoading(true);
 
-                // Sync OAuth avatar in background (don't block other fetches)
-                syncOAuthAvatar(newSession.user).catch((err) => {
-                  console.debug('[Auth Debug] Failed to sync OAuth avatar:', err)
+              // Sync OAuth avatar in background (don't block other fetches)
+              syncOAuthAvatar(newSession.user).catch((err) => {
+                console.debug("[Auth Debug] Failed to sync OAuth avatar:", err);
+              });
+
+              // Fetch user data in parallel
+              Promise.all([
+                fetchCredits(newSession),
+                fetchProStatus(newSession),
+                fetchTrialStatus(newSession),
+                fetchProfilePictureMetadata(newSession),
+              ]).then(() => {
+                // Fetch profile picture AFTER sync has had time to complete
+                // Use a small delay to allow avatar sync to finish if it's quick
+                setTimeout(() => {
+                  fetchProfilePicture(newSession).finally(() => {
+                    setLoading(false);
+                    console.debug(
+                      "[Auth Debug] User data fully loaded after sign in",
+                    );
+                  });
+                }, 500);
+              });
+            }
+          } else if (event === "TOKEN_REFRESHED") {
+            console.debug("[Auth Debug] Token refreshed");
+            // Optionally refresh credits, pro status, trial status, profile picture metadata, and profile picture on token refresh
+            if (newSession?.user) {
+              Promise.all([
+                fetchCredits(newSession),
+                fetchProStatus(newSession),
+                fetchTrialStatus(newSession),
+                fetchProfilePictureMetadata(newSession),
+                fetchProfilePicture(newSession),
+              ]).then(() => {
+                console.debug(
+                  "[Auth Debug] User data refreshed after token refresh",
+                );
+              });
+            }
+          } else if (event === "USER_UPDATED") {
+            console.debug("[Auth Debug] User updated");
+
+            // Check if this is a pending OAuth upgrade completion
+            const pendingUpgrade = sessionStorage.getItem("pendingUpgrade");
+            const upgradeProvider = sessionStorage.getItem("upgradeProvider");
+
+            if (
+              pendingUpgrade &&
+              newSession?.user &&
+              newSession.user.is_anonymous === false
+            ) {
+              console.debug(
+                "[Auth Debug] Processing pending OAuth upgrade:",
+                upgradeProvider,
+              );
+
+              // Clear the flags first to prevent loops
+              sessionStorage.removeItem("pendingUpgrade");
+              sessionStorage.removeItem("upgradeProvider");
+
+              // Synchronize with backend
+              synchronizeUserUpgrade(upgradeProvider || undefined)
+                .then(() => {
+                  console.debug(
+                    "[Auth Debug] User upgrade synchronized successfully",
+                  );
+
+                  // Refresh credits, pro status, trial status, profile picture metadata, and profile picture after upgrade
+                  if (newSession?.user) {
+                    return Promise.all([
+                      fetchCredits(newSession),
+                      fetchProStatus(newSession),
+                      fetchTrialStatus(newSession),
+                      fetchProfilePictureMetadata(newSession),
+                      fetchProfilePicture(newSession),
+                    ]);
+                  }
                 })
-
-                // Fetch user data in parallel
-                Promise.all([
-                  fetchCredits(newSession),
-                  fetchProStatus(newSession),
-                  fetchTrialStatus(newSession),
-                  fetchProfilePictureMetadata(newSession),
-                ]).then(() => {
-                  // Fetch profile picture AFTER sync has had time to complete
-                  // Use a small delay to allow avatar sync to finish if it's quick
-                  setTimeout(() => {
-                    fetchProfilePicture(newSession).finally(() => {
-                      setLoading(false)
-                      console.debug('[Auth Debug] User data fully loaded after sign in')
-                    })
-                  }, 500)
+                .then(() => {
+                  console.debug(
+                    "[Auth Debug] User data refreshed after upgrade",
+                  );
                 })
-              }
-            } else if (event === 'TOKEN_REFRESHED') {
-              console.debug('[Auth Debug] Token refreshed')
-              // Optionally refresh credits, pro status, trial status, profile picture metadata, and profile picture on token refresh
-              if (newSession?.user) {
-                Promise.all([
-                  fetchCredits(newSession),
-                  fetchProStatus(newSession),
-                  fetchTrialStatus(newSession),
-                  fetchProfilePictureMetadata(newSession),
-                  fetchProfilePicture(newSession)
-                ]).then(() => {
-                  console.debug('[Auth Debug] User data refreshed after token refresh')
-                })
-              }
-            } else if (event === 'USER_UPDATED') {
-              console.debug('[Auth Debug] User updated')
-
-              // Check if this is a pending OAuth upgrade completion
-              const pendingUpgrade = sessionStorage.getItem('pendingUpgrade')
-              const upgradeProvider = sessionStorage.getItem('upgradeProvider')
-
-              if (pendingUpgrade && newSession?.user && newSession.user.is_anonymous === false) {
-                console.debug('[Auth Debug] Processing pending OAuth upgrade:', upgradeProvider)
-
-                // Clear the flags first to prevent loops
-                sessionStorage.removeItem('pendingUpgrade')
-                sessionStorage.removeItem('upgradeProvider')
-
-                // Synchronize with backend
-                synchronizeUserUpgrade(upgradeProvider || undefined)
-                  .then(() => {
-                    console.debug('[Auth Debug] User upgrade synchronized successfully')
-
-                    // Refresh credits, pro status, trial status, profile picture metadata, and profile picture after upgrade
-                    if (newSession?.user) {
-                      return Promise.all([
-                        fetchCredits(newSession),
-                        fetchProStatus(newSession),
-                        fetchTrialStatus(newSession),
-                        fetchProfilePictureMetadata(newSession),
-                        fetchProfilePicture(newSession)
-                      ])
-                    }
-                  })
-                  .then(() => {
-                    console.debug('[Auth Debug] User data refreshed after upgrade')
-                  })
-                  .catch((err) => {
-                    console.error('[Auth Debug] Failed to synchronize user upgrade:', err)
-                  })
-              }
+                .catch((err) => {
+                  console.error(
+                    "[Auth Debug] Failed to synchronize user upgrade:",
+                    err,
+                  );
+                });
             }
           }
-        }, 0)
-      }
-    )
+        }
+      }, 0);
+    });
 
     return () => {
-      mounted = false
-      subscription.unsubscribe()
-    }
-  }, [])
+      mounted = false;
+      subscription.unsubscribe();
+    };
+  }, []);
 
   const value: AuthContextType = {
     session,
@@ -543,41 +674,37 @@ export function AuthProvider({ children }: { children: ReactNode }) {
     refreshProStatus,
     refreshTrialStatus,
     refreshProfilePicture,
-    refreshProfilePictureMetadata
-  }
+    refreshProfilePictureMetadata,
+  };
 
-  return (
-    <AuthContext.Provider value={value}>
-      {children}
-    </AuthContext.Provider>
-  )
+  return <AuthContext.Provider value={value}>{children}</AuthContext.Provider>;
 }
 
 export function useAuth() {
-  const context = useContext(AuthContext)
+  const context = useContext(AuthContext);
 
   if (context === undefined) {
-    throw new Error('useAuth must be used within an AuthProvider')
+    throw new Error("useAuth must be used within an AuthProvider");
   }
 
-  return context
+  return context;
 }
 
 // Debug hook to expose auth state for debugging
 export function useAuthDebug() {
-  const auth = useAuth()
+  const auth = useAuth();
 
   useEffect(() => {
-    console.debug('[Auth Debug] Current auth state:', {
+    console.debug("[Auth Debug] Current auth state:", {
       hasSession: !!auth.session,
       hasUser: !!auth.user,
       loading: auth.loading,
       hasError: !!auth.error,
       userId: auth.user?.id,
       email: auth.user?.email,
-      provider: auth.user?.app_metadata?.provider
-    })
-  }, [auth.session, auth.user, auth.loading, auth.error])
+      provider: auth.user?.app_metadata?.provider,
+    });
+  }, [auth.session, auth.user, auth.loading, auth.error]);
 
-  return auth
+  return auth;
 }
diff --git a/frontend/src/saas/auth/supabase.ts b/frontend/src/saas/auth/supabase.ts
index 338c5c8adc..ad32cfa58d 100644
--- a/frontend/src/saas/auth/supabase.ts
+++ b/frontend/src/saas/auth/supabase.ts
@@ -1,56 +1,54 @@
-import { createClient } from '@supabase/supabase-js'
+import { createClient } from "@supabase/supabase-js";
 
 // Debug helper to log Supabase configuration
 const debugConfig = () => {
-  const url = import.meta.env.VITE_SUPABASE_URL
-  const key = import.meta.env.VITE_SUPABASE_PUBLISHABLE_DEFAULT_KEY
+  const url = import.meta.env.VITE_SUPABASE_URL;
+  const key = import.meta.env.VITE_SUPABASE_PUBLISHABLE_DEFAULT_KEY;
 
-  console.log('[Supabase Debug] Configuration:', {
-    url: url ? '✓ URL configured' : '✗ URL missing',
-    key: key ? '✓ Key configured' : '✗ Key missing',
-    urlValue: url || 'undefined',
-    keyValue: key ? `${key.substring(0, 20)}...` : 'undefined'
-  })
+  console.log("[Supabase Debug] Configuration:", {
+    url: url ? "✓ URL configured" : "✗ URL missing",
+    key: key ? "✓ Key configured" : "✗ Key missing",
+    urlValue: url || "undefined",
+    keyValue: key ? `${key.substring(0, 20)}...` : "undefined",
+  });
 
-  return { url, key }
-}
+  return { url, key };
+};
 
-const config = debugConfig()
+const config = debugConfig();
 
 if (!config.url) {
-  throw new Error('Missing VITE_SUPABASE_URL environment variable')
+  throw new Error("Missing VITE_SUPABASE_URL environment variable");
 }
 
 if (!config.key) {
-  throw new Error('Missing VITE_SUPABASE_PUBLISHABLE_DEFAULT_KEY environment variable')
+  throw new Error(
+    "Missing VITE_SUPABASE_PUBLISHABLE_DEFAULT_KEY environment variable",
+  );
 }
 
-export const supabase = createClient(
-  config.url,
-  config.key,
-  {
-    auth: {
-      persistSession: true, // keep session in localStorage
-      autoRefreshToken: true,
-      detectSessionInUrl: true, // helpful on first load after redirect
-      // debug: import.meta.env.DEV, // Enable debug logs in development
-    },
-  }
-)
+export const supabase = createClient(config.url, config.key, {
+  auth: {
+    persistSession: true, // keep session in localStorage
+    autoRefreshToken: true,
+    detectSessionInUrl: true, // helpful on first load after redirect
+    // debug: import.meta.env.DEV, // Enable debug logs in development
+  },
+});
 
 // Debug helper for auth events
 export const debugAuthEvents = () => {
   supabase.auth.onAuthStateChange((event, session) => {
-    console.log('[Supabase Debug] Auth state change:', {
+    console.log("[Supabase Debug] Auth state change:", {
       event,
       hasSession: !!session,
       userId: session?.user?.id,
       email: session?.user?.email,
       provider: session?.user?.app_metadata?.provider,
-      timestamp: new Date().toISOString()
-    })
-  })
-}
+      timestamp: new Date().toISOString(),
+    });
+  });
+};
 
 // Debug auth events can be manually enabled by calling debugAuthEvents()
 // Commented out to prevent excessive logging on every page load
@@ -61,105 +59,114 @@ export const debugAuthEvents = () => {
 // Anonymous authentication functions
 export const signInAnonymously = async () => {
   try {
-    const { data, error } = await supabase.auth.signInAnonymously()
+    const { data, error } = await supabase.auth.signInAnonymously();
 
     if (error) {
-      console.error('[Supabase] Anonymous sign-in error:', error)
-      throw error
+      console.error("[Supabase] Anonymous sign-in error:", error);
+      throw error;
     }
 
-    console.log('[Supabase] Anonymous sign-in successful:', {
+    console.log("[Supabase] Anonymous sign-in successful:", {
       userId: data.user?.id,
-      isAnonymous: data.user?.is_anonymous
-    })
+      isAnonymous: data.user?.is_anonymous,
+    });
 
-    return { data, error }
+    return { data, error };
   } catch (error) {
-    console.error('[Supabase] Anonymous sign-in failed:', error)
-    throw error
+    console.error("[Supabase] Anonymous sign-in failed:", error);
+    throw error;
   }
-}
+};
 
 // Account linking functions
 export const linkEmailIdentity = async (email: string, password?: string) => {
   try {
-    const updateData: { email: string; password?: string } = { email }
+    const updateData: { email: string; password?: string } = { email };
     if (password) {
-      updateData.password = password
+      updateData.password = password;
     }
 
-    const { data, error } = await supabase.auth.updateUser(updateData)
+    const { data, error } = await supabase.auth.updateUser(updateData);
 
     if (error) {
-      console.error('[Supabase] Email linking error:', error)
-      throw error
+      console.error("[Supabase] Email linking error:", error);
+      throw error;
     }
 
     // Refresh session to get updated token with new user metadata
-    const { error: refreshError } = await supabase.auth.refreshSession()
+    const { error: refreshError } = await supabase.auth.refreshSession();
 
     if (refreshError) {
-      console.warn('[Supabase] Session refresh after email linking failed:', refreshError)
+      console.warn(
+        "[Supabase] Session refresh after email linking failed:",
+        refreshError,
+      );
       // Don't throw - linking was successful, refresh is just for consistency
     } else {
-      console.log('[Supabase] Session refreshed after email linking')
+      console.log("[Supabase] Session refreshed after email linking");
     }
 
-    console.log('[Supabase] Email linked successfully:', {
+    console.log("[Supabase] Email linked successfully:", {
       email,
-      userId: data.user?.id
-    })
+      userId: data.user?.id,
+    });
 
-    return { data, error }
+    return { data, error };
   } catch (error) {
-    console.error('[Supabase] Email linking failed:', error)
-    throw error
+    console.error("[Supabase] Email linking failed:", error);
+    throw error;
   }
-}
+};
 
-export const linkOAuthIdentity = async (provider: 'google' | 'github' | 'apple' | 'azure', redirectTo?: string) => {
+export const linkOAuthIdentity = async (
+  provider: "google" | "github" | "apple" | "azure",
+  redirectTo?: string,
+) => {
   try {
     const { data, error } = await supabase.auth.linkIdentity({
       provider: provider,
-      options: redirectTo ? { redirectTo } : undefined
-    })
+      options: redirectTo ? { redirectTo } : undefined,
+    });
 
     if (error) {
-      console.error('[Supabase] OAuth linking error:', error)
-      throw error
+      console.error("[Supabase] OAuth linking error:", error);
+      throw error;
     }
 
-    console.log('[Supabase] OAuth identity linked successfully:', {
+    console.log("[Supabase] OAuth identity linked successfully:", {
       provider,
       redirectTo,
-      url: data.url
-    })
+      url: data.url,
+    });
 
-    return { data, error }
+    return { data, error };
   } catch (error) {
-    console.error('[Supabase] OAuth linking failed:', error)
-    throw error
+    console.error("[Supabase] OAuth linking failed:", error);
+    throw error;
   }
-}
+};
 
 // Helper function to check if user is anonymous
 export const isUserAnonymous = (user: { is_anonymous?: boolean }) => {
-  return user?.is_anonymous === true
-}
+  return user?.is_anonymous === true;
+};
 
 // Get current user session
 export const getCurrentUser = async () => {
   try {
-    const { data: { user }, error } = await supabase.auth.getUser()
+    const {
+      data: { user },
+      error,
+    } = await supabase.auth.getUser();
 
     if (error) {
-      console.error('[Supabase] Get user error:', error)
-      throw error
+      console.error("[Supabase] Get user error:", error);
+      throw error;
     }
 
-    return user
+    return user;
   } catch (error) {
-    console.error('[Supabase] Get user failed:', error)
-    throw error
+    console.error("[Supabase] Get user failed:", error);
+    throw error;
   }
-}
+};
diff --git a/frontend/src/saas/components/OnboardingBootstrap.tsx b/frontend/src/saas/components/OnboardingBootstrap.tsx
index 3533f429c5..89dffddf43 100644
--- a/frontend/src/saas/components/OnboardingBootstrap.tsx
+++ b/frontend/src/saas/components/OnboardingBootstrap.tsx
@@ -1,11 +1,11 @@
-import { useEffect, useState } from 'react';
-import { usePreferences } from '@app/contexts/PreferencesContext';
-import { useOnboarding } from '@app/contexts/OnboardingContext';
-import { useAuth } from '@app/auth/UseSession';
-import SaasOnboardingModal from '@app/components/onboarding/SaasOnboardingModal';
+import { useEffect, useState } from "react";
+import { usePreferences } from "@app/contexts/PreferencesContext";
+import { useOnboarding } from "@app/contexts/OnboardingContext";
+import { useAuth } from "@app/auth/UseSession";
+import SaasOnboardingModal from "@app/components/onboarding/SaasOnboardingModal";
 
-const STORAGE_KEY = 'saas_onboarding_seen';
-const ONBOARDING_SESSION_BLOCK_KEY = 'stirling-onboarding-session-active';
+const STORAGE_KEY = "saas_onboarding_seen";
+const ONBOARDING_SESSION_BLOCK_KEY = "stirling-onboarding-session-active";
 
 /**
  * SaaS-only bootstrap to clear deferred tour requests, mark tool panel prompt as completed,
@@ -13,7 +13,8 @@ const ONBOARDING_SESSION_BLOCK_KEY = 'stirling-onboarding-session-active';
  */
 export default function OnboardingBootstrap() {
   const { preferences, updatePreference } = usePreferences();
-  const { clearPendingTourRequest, setStartAfterToolModeSelection } = useOnboarding();
+  const { clearPendingTourRequest, setStartAfterToolModeSelection } =
+    useOnboarding();
   const { user, loading, trialStatus, isPro, refreshTrialStatus } = useAuth();
   const [showModal, setShowModal] = useState(false);
   const [isPolling, setIsPolling] = useState(false);
@@ -21,10 +22,10 @@ export default function OnboardingBootstrap() {
 
   // Start polling when user logs in
   useEffect(() => {
-    const hasSeenOnboarding = localStorage.getItem(STORAGE_KEY) === 'true';
+    const hasSeenOnboarding = localStorage.getItem(STORAGE_KEY) === "true";
 
     if (user && !hasSeenOnboarding && !loading && !isPolling && !showModal) {
-      console.debug('[Onboarding] Starting poll for trial data');
+      console.debug("[Onboarding] Starting poll for trial data");
       setIsPolling(true);
       setPollAttempts(0);
     }
@@ -38,7 +39,10 @@ export default function OnboardingBootstrap() {
 
     const timer = setTimeout(async () => {
       const newAttempts = pollAttempts + 1;
-      console.debug('[Onboarding] Polling for trial data, attempt:', newAttempts);
+      console.debug(
+        "[Onboarding] Polling for trial data, attempt:",
+        newAttempts,
+      );
 
       await refreshTrialStatus();
       setPollAttempts(newAttempts);
@@ -58,12 +62,12 @@ export default function OnboardingBootstrap() {
     const maxAttempts = 10;
 
     if (hasData || pollAttempts >= maxAttempts) {
-      console.debug('[Onboarding] Trial data ready or timeout, showing modal', {
+      console.debug("[Onboarding] Trial data ready or timeout, showing modal", {
         hasData,
         hasProStatus,
         attempts: pollAttempts,
         trialStatus,
-        isPro
+        isPro,
       });
       setIsPolling(false);
       setShowModal(true);
@@ -71,16 +75,19 @@ export default function OnboardingBootstrap() {
   }, [isPolling, trialStatus, isPro, pollAttempts]);
 
   const handleClose = () => {
-    localStorage.setItem(STORAGE_KEY, 'true');
+    localStorage.setItem(STORAGE_KEY, "true");
     setShowModal(false);
   };
 
   // Keep existing logic to disable core onboarding flags
   useEffect(() => {
     // Ensure tool panel preference is set so tours are never deferred.
-    if (!preferences.toolPanelModePromptSeen || !preferences.hasSelectedToolPanelMode) {
-      updatePreference('toolPanelModePromptSeen', true);
-      updatePreference('hasSelectedToolPanelMode', true);
+    if (
+      !preferences.toolPanelModePromptSeen ||
+      !preferences.hasSelectedToolPanelMode
+    ) {
+      updatePreference("toolPanelModePromptSeen", true);
+      updatePreference("hasSelectedToolPanelMode", true);
     }
 
     // Clear any lingering deferred tour requests.
@@ -89,15 +96,15 @@ export default function OnboardingBootstrap() {
 
     // In SaaS, skip the core intro onboarding entirely.
     if (!preferences.hasSeenIntroOnboarding) {
-      updatePreference('hasSeenIntroOnboarding', true);
+      updatePreference("hasSeenIntroOnboarding", true);
     }
     // Also mark completed to avoid follow-up banners/modals.
     if (!preferences.hasCompletedOnboarding) {
-      updatePreference('hasCompletedOnboarding', true);
+      updatePreference("hasCompletedOnboarding", true);
     }
 
     // Also clear any session flag that might mark onboarding as active.
-    if (typeof window !== 'undefined') {
+    if (typeof window !== "undefined") {
       window.sessionStorage.removeItem(ONBOARDING_SESSION_BLOCK_KEY);
     }
   }, [
@@ -111,5 +118,7 @@ export default function OnboardingBootstrap() {
   ]);
 
   // Only render modal when it should be shown to avoid running hooks unnecessarily
-  return showModal ? <SaasOnboardingModal opened={showModal} onClose={handleClose} /> : null;
+  return showModal ? (
+    <SaasOnboardingModal opened={showModal} onClose={handleClose} />
+  ) : null;
 }
diff --git a/frontend/src/saas/components/TrialExpiredBootstrap.tsx b/frontend/src/saas/components/TrialExpiredBootstrap.tsx
index 8ccd575852..1b185684cb 100644
--- a/frontend/src/saas/components/TrialExpiredBootstrap.tsx
+++ b/frontend/src/saas/components/TrialExpiredBootstrap.tsx
@@ -1,7 +1,7 @@
-import { useEffect, useState } from 'react';
-import { useAuth } from '@app/auth/UseSession';
-import { TrialExpiredModal } from '@app/components/shared/TrialExpiredModal';
-import StripeCheckout from '@app/components/shared/StripeCheckoutSaas';
+import { useEffect, useState } from "react";
+import { useAuth } from "@app/auth/UseSession";
+import { TrialExpiredModal } from "@app/components/shared/TrialExpiredModal";
+import StripeCheckout from "@app/components/shared/StripeCheckoutSaas";
 
 /**
  * Bootstrap component that shows the trial expired modal when a user's trial has ended
@@ -16,7 +16,7 @@ export default function TrialExpiredBootstrap() {
     // Close modal if user logs out or session expires
     if (!user) {
       if (showModal) {
-        console.debug('[TrialExpired] User logged out, closing modal');
+        console.debug("[TrialExpired] User logged out, closing modal");
         setShowModal(false);
       }
       if (checkoutOpened) {
@@ -32,13 +32,13 @@ export default function TrialExpiredBootstrap() {
 
     // Build localStorage key unique to this user
     const storageKey = `trialExpiredModalShown_${user.id}`;
-    const hasSeenModal = localStorage.getItem(storageKey) === 'true';
+    const hasSeenModal = localStorage.getItem(storageKey) === "true";
 
     // If user is currently trialing, clear any previous "seen" flag
     // This handles the edge case where a user might re-enter a trial
     if (trialStatus.isTrialing) {
       if (hasSeenModal) {
-        console.debug('[TrialExpired] User is trialing, clearing seen flag');
+        console.debug("[TrialExpired] User is trialing, clearing seen flag");
         localStorage.removeItem(storageKey);
       }
       return;
@@ -46,16 +46,22 @@ export default function TrialExpiredBootstrap() {
 
     // Check if all conditions are met to show the modal
     const isExpired =
-      trialStatus.status === 'incomplete_expired' || trialStatus.status === 'canceled';
-    const hasNoPayment = !trialStatus.hasPaymentMethod && !trialStatus.hasScheduledSub;
+      trialStatus.status === "incomplete_expired" ||
+      trialStatus.status === "canceled";
+    const hasNoPayment =
+      !trialStatus.hasPaymentMethod && !trialStatus.hasScheduledSub;
     const wasDowngraded = !isPro;
     const trialEndedRecently = trialStatus.daysRemaining === 0;
 
     const shouldShowModal =
-      isExpired && hasNoPayment && wasDowngraded && trialEndedRecently && !hasSeenModal;
+      isExpired &&
+      hasNoPayment &&
+      wasDowngraded &&
+      trialEndedRecently &&
+      !hasSeenModal;
 
     if (shouldShowModal) {
-      console.debug('[TrialExpired] Showing trial expired modal', {
+      console.debug("[TrialExpired] Showing trial expired modal", {
         status: trialStatus.status,
         daysRemaining: trialStatus.daysRemaining,
         hasPaymentMethod: trialStatus.hasPaymentMethod,
@@ -69,26 +75,26 @@ export default function TrialExpiredBootstrap() {
   const handleClose = () => {
     if (user) {
       const storageKey = `trialExpiredModalShown_${user.id}`;
-      localStorage.setItem(storageKey, 'true');
-      console.debug('[TrialExpired] Modal dismissed, marking as seen');
+      localStorage.setItem(storageKey, "true");
+      console.debug("[TrialExpired] Modal dismissed, marking as seen");
     }
     setShowModal(false);
   };
 
   const handleSubscribe = () => {
-    console.debug('[TrialExpired] User clicked Subscribe to Pro');
+    console.debug("[TrialExpired] User clicked Subscribe to Pro");
     setCheckoutOpened(true);
   };
 
   const handleCheckoutSuccess = () => {
-    console.debug('[TrialExpired] Subscription successful, refreshing page');
+    console.debug("[TrialExpired] Subscription successful, refreshing page");
     // Close modal and refresh to update subscription status
     handleClose();
     window.location.reload();
   };
 
   const handleCheckoutClose = () => {
-    console.debug('[TrialExpired] Checkout closed');
+    console.debug("[TrialExpired] Checkout closed");
     setCheckoutOpened(false);
   };
 
@@ -109,7 +115,9 @@ export default function TrialExpiredBootstrap() {
           creditsPack={null}
           planName="Pro"
           onSuccess={handleCheckoutSuccess}
-          onError={(error) => console.error('[TrialExpired] Checkout error:', error)}
+          onError={(error) =>
+            console.error("[TrialExpired] Checkout error:", error)
+          }
           isTrialConversion={false} // Trial already ended, so this is not a conversion
         />
       )}
diff --git a/frontend/src/saas/components/auth/GuestUserBanner.css b/frontend/src/saas/components/auth/GuestUserBanner.css
index d1d6937024..d714bd858f 100644
--- a/frontend/src/saas/components/auth/GuestUserBanner.css
+++ b/frontend/src/saas/components/auth/GuestUserBanner.css
@@ -4,9 +4,9 @@
   right: 4.5rem;
   z-index: 1000;
   background: var(--modal-content-bg, #111418);
-  border: 1px solid var(--api-keys-card-border, rgba(255,255,255,0.08));
+  border: 1px solid var(--api-keys-card-border, rgba(255, 255, 255, 0.08));
   border-radius: 12px;
-  box-shadow: 0 6px 24px rgba(0,0,0,0.35);
+  box-shadow: 0 6px 24px rgba(0, 0, 0, 0.35);
   padding: 12px 16px;
   max-width: 30rem;
   width: 30rem;
@@ -57,7 +57,7 @@
 }
 
 .guest-banner-dismiss:hover {
-  background: var(--mantine-color-gray-1, rgba(255,255,255,0.05));
+  background: var(--mantine-color-gray-1, rgba(255, 255, 255, 0.05));
 }
 
 .guest-banner-signup {
diff --git a/frontend/src/saas/components/auth/GuestUserBanner.tsx b/frontend/src/saas/components/auth/GuestUserBanner.tsx
index 8c5f786aa0..c40586c554 100644
--- a/frontend/src/saas/components/auth/GuestUserBanner.tsx
+++ b/frontend/src/saas/components/auth/GuestUserBanner.tsx
@@ -1,88 +1,88 @@
-import React, { useEffect, useState } from 'react'
-import { useTranslation } from 'react-i18next'
-import CloseIcon from '@mui/icons-material/Close'
-import PersonAddIcon from '@mui/icons-material/PersonAdd'
-import { useAuth } from '@app/auth/UseSession'
-import { isUserAnonymous } from '@app/auth/supabase'
-import { withBasePath } from '@app/constants/app'
-import '@app/components/auth/GuestUserBanner.css'
+import React, { useEffect, useState } from "react";
+import { useTranslation } from "react-i18next";
+import CloseIcon from "@mui/icons-material/Close";
+import PersonAddIcon from "@mui/icons-material/PersonAdd";
+import { useAuth } from "@app/auth/UseSession";
+import { isUserAnonymous } from "@app/auth/supabase";
+import { withBasePath } from "@app/constants/app";
+import "@app/components/auth/GuestUserBanner.css";
 
 interface GuestUserBannerProps {
-  className?: string
+  className?: string;
 }
 
 // Ensure the toast only appears once per full page load, not on re-hydration
-let hasShownThisLoad = false
+let hasShownThisLoad = false;
 
 /**
  * Guest user toast encouraging account creation.
  * Appears 2s after load, top-right of the viewport, offset by right rail.
  */
-export function GuestUserBanner({ className = '' }: GuestUserBannerProps) {
-  const { t } = useTranslation()
-  const { session } = useAuth()
-  const [isDismissed, setIsDismissed] = useState(false)
-  const [visible, setVisible] = useState(false)
+export function GuestUserBanner({ className = "" }: GuestUserBannerProps) {
+  const { t } = useTranslation();
+  const { session } = useAuth();
+  const [isDismissed, setIsDismissed] = useState(false);
+  const [visible, setVisible] = useState(false);
 
-  const isAnon = Boolean(session?.user && isUserAnonymous(session.user))
+  const isAnon = Boolean(session?.user && isUserAnonymous(session.user));
 
   useEffect(() => {
-    if (!isAnon || hasShownThisLoad) return
+    if (!isAnon || hasShownThisLoad) return;
 
     const timer = setTimeout(() => {
-      setVisible(true)
-      hasShownThisLoad = true
-    }, 2000)
+      setVisible(true);
+      hasShownThisLoad = true;
+    }, 2000);
 
-    return () => clearTimeout(timer)
-  }, [isAnon])
+    return () => clearTimeout(timer);
+  }, [isAnon]);
 
   if (!isAnon || isDismissed || !visible) {
-    return null
+    return null;
   }
 
   const handleSignUp = () => {
-    window.location.href = withBasePath('/signup')
-  }
+    window.location.href = withBasePath("/signup");
+  };
 
   const handleDismiss = () => {
-    setIsDismissed(true)
-  }
+    setIsDismissed(true);
+  };
 
   return (
     <div
-      className={`guest-banner ${className || ''}`}
+      className={`guest-banner ${className || ""}`}
       role="status"
       aria-live="polite"
     >
       <div className="guest-banner-content">
         <div className="guest-banner-text">
           <div className="guest-banner-title">
-            {t('guestBanner.title', "You're using Stirling PDF as a guest!")}
+            {t("guestBanner.title", "You're using Stirling PDF as a guest!")}
           </div>
           <div className="guest-banner-message">
-            {t('guestBanner.message', 'Create a free account to save your work, access more features, and support the project.')}
+            {t(
+              "guestBanner.message",
+              "Create a free account to save your work, access more features, and support the project.",
+            )}
           </div>
         </div>
         <div className="guest-banner-actions">
           <button
             onClick={handleDismiss}
-            aria-label={t('guestBanner.dismiss', 'Dismiss banner')}
+            aria-label={t("guestBanner.dismiss", "Dismiss banner")}
             className="guest-banner-dismiss"
           >
             <CloseIcon className="guest-banner-icon" />
           </button>
-          <button
-            onClick={handleSignUp}
-            className="guest-banner-signup"
-          >
+          <button onClick={handleSignUp} className="guest-banner-signup">
             <PersonAddIcon className="guest-banner-signup-icon" />
-            {t('guestBanner.signUp', 'Sign Up Free')}
+            {t("guestBanner.signUp", "Sign Up Free")}
           </button>
         </div>
       </div>
     </div>
-  )
+  );
 }
 
-export default GuestUserBanner
\ No newline at end of file
+export default GuestUserBanner;
diff --git a/frontend/src/saas/components/auth/RequireAuth.tsx b/frontend/src/saas/components/auth/RequireAuth.tsx
index fb6b550ba2..3ce0fd8d14 100644
--- a/frontend/src/saas/components/auth/RequireAuth.tsx
+++ b/frontend/src/saas/components/auth/RequireAuth.tsx
@@ -1,23 +1,31 @@
-import { Navigate, Outlet, useLocation } from 'react-router-dom'
-import { useAuth } from '@app/auth/UseSession'
-import { useAutoAnonymousAuth } from '@app/hooks/useAutoAnonymousAuth'
+import { Navigate, Outlet, useLocation } from "react-router-dom";
+import { useAuth } from "@app/auth/UseSession";
+import { useAutoAnonymousAuth } from "@app/hooks/useAutoAnonymousAuth";
 
 interface RequireAuthProps {
-  fallbackPath?: string
+  fallbackPath?: string;
 }
 
-export function RequireAuth({ fallbackPath = '/login' }: RequireAuthProps) {
-  const { session, loading } = useAuth()
-  const location = useLocation()
-  const { isAutoAuthenticating } = useAutoAnonymousAuth()
+export function RequireAuth({ fallbackPath = "/login" }: RequireAuthProps) {
+  const { session, loading } = useAuth();
+  const location = useLocation();
+  const { isAutoAuthenticating } = useAutoAnonymousAuth();
 
   // Safe development-only auth bypass
-  const isLocalhost = typeof window !== 'undefined' && /^(localhost|127\.0\.0\.1)$/i.test(window.location.hostname)
-  const devBypassEnabled = Boolean(import.meta.env.DEV && isLocalhost && import.meta.env.VITE_DEV_BYPASS_AUTH === 'true')
+  const isLocalhost =
+    typeof window !== "undefined" &&
+    /^(localhost|127\.0\.0\.1)$/i.test(window.location.hostname);
+  const devBypassEnabled = Boolean(
+    import.meta.env.DEV &&
+    isLocalhost &&
+    import.meta.env.VITE_DEV_BYPASS_AUTH === "true",
+  );
 
   if (devBypassEnabled) {
-    console.warn('[RequireAuth] DEV BYPASS ACTIVE — allowing access without session on localhost')
-    return <Outlet />
+    console.warn(
+      "[RequireAuth] DEV BYPASS ACTIVE — allowing access without session on localhost",
+    );
+    return <Outlet />;
   }
 
   // Wait for both auth bootstrap and auto-anon to finish
@@ -29,16 +37,16 @@ export function RequireAuth({ fallbackPath = '/login' }: RequireAuthProps) {
           <p className="text-gray-600">Preparing your session…</p>
         </div>
       </div>
-    )
+    );
   }
 
   if (!session) {
     // Change the URL to /login
-    return <Navigate to={fallbackPath} replace state={{ from: location }} />
+    return <Navigate to={fallbackPath} replace state={{ from: location }} />;
   }
 
   // Render protected routes
-  return <Outlet />
+  return <Outlet />;
 }
 
-export default RequireAuth
+export default RequireAuth;
diff --git a/frontend/src/saas/components/feedback/UserbackWidget.tsx b/frontend/src/saas/components/feedback/UserbackWidget.tsx
index e664cce535..53717c1038 100644
--- a/frontend/src/saas/components/feedback/UserbackWidget.tsx
+++ b/frontend/src/saas/components/feedback/UserbackWidget.tsx
@@ -1,6 +1,6 @@
-import { useEffect, useRef } from 'react';
-import Userback from '@userback/widget';
-import { useAuth } from '@app/auth/UseSession';
+import { useEffect, useRef } from "react";
+import Userback from "@userback/widget";
+import { useAuth } from "@app/auth/UseSession";
 
 interface UserbackWidgetProps {
   token: string;
@@ -24,20 +24,20 @@ export default function UserbackWidget({ token }: UserbackWidgetProps) {
       try {
         // Prepare user data options
         const userInfo: { name?: string; email?: string } = {};
-        if (user.user_metadata?.full_name) userInfo.name = user.user_metadata.full_name;
+        if (user.user_metadata?.full_name)
+          userInfo.name = user.user_metadata.full_name;
         if (user.email) userInfo.email = user.email;
 
         const options = {
           user_data: {
             id: user.id,
-            info: userInfo
-          }
+            info: userInfo,
+          },
         };
 
         // Initialize Userback
         userbackRef.current = await Userback(token, options);
-      }
-     finally {
+      } finally {
         initializingRef.current = false;
       }
     };
@@ -46,7 +46,10 @@ export default function UserbackWidget({ token }: UserbackWidgetProps) {
 
     // Cleanup function
     return () => {
-      if (userbackRef.current && typeof userbackRef.current.destroy === 'function') {
+      if (
+        userbackRef.current &&
+        typeof userbackRef.current.destroy === "function"
+      ) {
         userbackRef.current.destroy();
       }
       initializingRef.current = false;
diff --git a/frontend/src/saas/components/home/HomePageExtensions.tsx b/frontend/src/saas/components/home/HomePageExtensions.tsx
index 3557c976c1..2a8375af55 100644
--- a/frontend/src/saas/components/home/HomePageExtensions.tsx
+++ b/frontend/src/saas/components/home/HomePageExtensions.tsx
@@ -1,4 +1,4 @@
-import UserbackWidget from '@app/components/feedback/UserbackWidget';
+import UserbackWidget from "@app/components/feedback/UserbackWidget";
 
 export function HomePageExtensions() {
   const userbackToken = import.meta.env.VITE_USERBACK_TOKEN;
diff --git a/frontend/src/saas/components/onboarding/SaasOnboardingModal.tsx b/frontend/src/saas/components/onboarding/SaasOnboardingModal.tsx
index b2f7c2711e..4af91fd020 100644
--- a/frontend/src/saas/components/onboarding/SaasOnboardingModal.tsx
+++ b/frontend/src/saas/components/onboarding/SaasOnboardingModal.tsx
@@ -1,15 +1,15 @@
-import React from 'react';
-import { Modal, Stack } from '@mantine/core';
-import DiamondOutlinedIcon from '@mui/icons-material/DiamondOutlined';
-import { useTranslation } from 'react-i18next';
-import LocalIcon from '@app/components/shared/LocalIcon';
-import AnimatedSlideBackground from '@app/components/onboarding/slides/AnimatedSlideBackground';
-import OnboardingStepper from '@app/components/onboarding/OnboardingStepper';
-import { renderButtons } from '@app/components/onboarding/renderButtons';
-import styles from '@app/components/onboarding/InitialOnboardingModal/InitialOnboardingModal.module.css';
-import { useSaasOnboardingState } from '@app/components/onboarding/useSaasOnboardingState';
-import { BASE_PATH } from '@app/constants/app';
-import { Z_INDEX_OVER_FULLSCREEN_SURFACE } from '@app/styles/zIndex';
+import React from "react";
+import { Modal, Stack } from "@mantine/core";
+import DiamondOutlinedIcon from "@mui/icons-material/DiamondOutlined";
+import { useTranslation } from "react-i18next";
+import LocalIcon from "@app/components/shared/LocalIcon";
+import AnimatedSlideBackground from "@app/components/onboarding/slides/AnimatedSlideBackground";
+import OnboardingStepper from "@app/components/onboarding/OnboardingStepper";
+import { renderButtons } from "@app/components/onboarding/renderButtons";
+import styles from "@app/components/onboarding/InitialOnboardingModal/InitialOnboardingModal.module.css";
+import { useSaasOnboardingState } from "@app/components/onboarding/useSaasOnboardingState";
+import { BASE_PATH } from "@app/constants/app";
+import { Z_INDEX_OVER_FULLSCREEN_SURFACE } from "@app/styles/zIndex";
 
 interface SaasOnboardingModalProps {
   opened: boolean;
@@ -34,11 +34,15 @@ export default function SaasOnboardingModal(props: SaasOnboardingModalProps) {
   } = flow;
 
   const renderHero = () => {
-    if (slideDefinition.hero.type === 'dual-icon') {
+    if (slideDefinition.hero.type === "dual-icon") {
       return (
         <div className={styles.heroIconsContainer}>
           <div className={styles.iconWrapper}>
-            <img src={`${BASE_PATH}/modern-logo/logo512.png`} alt="Stirling icon" className={styles.downloadIcon} />
+            <img
+              src={`${BASE_PATH}/modern-logo/logo512.png`}
+              alt="Stirling icon"
+              className={styles.downloadIcon}
+            />
           </div>
         </div>
       );
@@ -46,10 +50,17 @@ export default function SaasOnboardingModal(props: SaasOnboardingModalProps) {
 
     return (
       <div className={styles.heroLogoCircle}>
-        {slideDefinition.hero.type === 'rocket' && (
-          <LocalIcon icon="rocket-launch" width={64} height={64} className={styles.heroIcon} />
+        {slideDefinition.hero.type === "rocket" && (
+          <LocalIcon
+            icon="rocket-launch"
+            width={64}
+            height={64}
+            className={styles.heroIcon}
+          />
+        )}
+        {slideDefinition.hero.type === "diamond" && (
+          <DiamondOutlinedIcon sx={{ fontSize: 64, color: "#000000" }} />
         )}
-        {slideDefinition.hero.type === 'diamond' && <DiamondOutlinedIcon sx={{ fontSize: 64, color: '#000000' }} />}
       </div>
     );
   };
@@ -66,17 +77,26 @@ export default function SaasOnboardingModal(props: SaasOnboardingModalProps) {
       zIndex={Z_INDEX_OVER_FULLSCREEN_SURFACE}
       styles={{
         body: { padding: 0 },
-        content: { 
-          overflow: 'hidden', 
-          border: 'none', 
-          background: 'var(--bg-surface)',
-          maxHeight: '90vh',
-          display: 'flex',
-          flexDirection: 'column',
+        content: {
+          overflow: "hidden",
+          border: "none",
+          background: "var(--bg-surface)",
+          maxHeight: "90vh",
+          display: "flex",
+          flexDirection: "column",
         },
       }}
     >
-      <Stack gap={0} className={styles.modalContent} style={{ height: '100%', maxHeight: '90vh', display: 'flex', flexDirection: 'column' }}>
+      <Stack
+        gap={0}
+        className={styles.modalContent}
+        style={{
+          height: "100%",
+          maxHeight: "90vh",
+          display: "flex",
+          flexDirection: "column",
+        }}
+      >
         <div className={styles.heroWrapper} style={{ flexShrink: 0 }}>
           <AnimatedSlideBackground
             gradientStops={currentSlide.background.gradientStops}
@@ -89,13 +109,13 @@ export default function SaasOnboardingModal(props: SaasOnboardingModalProps) {
           </div>
         </div>
 
-        <div 
+        <div
           className={styles.modalBody}
-          style={{ 
+          style={{
             flex: 1,
-            overflowY: 'auto',
-            overflowX: 'hidden',
-            WebkitOverflowScrolling: 'touch',
+            overflowY: "auto",
+            overflowX: "hidden",
+            WebkitOverflowScrolling: "touch",
           }}
         >
           <Stack gap={16}>
@@ -107,13 +127,19 @@ export default function SaasOnboardingModal(props: SaasOnboardingModalProps) {
             </div>
 
             <div className={styles.bodyText}>
-              <div key={`body-${currentSlide.key}`} className={`${styles.bodyCopy} ${styles.bodyCopyInner}`}>
+              <div
+                key={`body-${currentSlide.key}`}
+                className={`${styles.bodyCopy} ${styles.bodyCopyInner}`}
+              >
                 {currentSlide.body}
               </div>
               <style>{`div strong{color: var(--onboarding-title); font-weight: 600;}`}</style>
             </div>
 
-            <OnboardingStepper totalSteps={totalSteps} activeStep={currentStep} />
+            <OnboardingStepper
+              totalSteps={totalSteps}
+              activeStep={currentStep}
+            />
 
             <div className={styles.buttonContainer}>
               {renderButtons({
diff --git a/frontend/src/saas/components/onboarding/renderButtons.tsx b/frontend/src/saas/components/onboarding/renderButtons.tsx
index f1f8c7dfcd..f2857af460 100644
--- a/frontend/src/saas/components/onboarding/renderButtons.tsx
+++ b/frontend/src/saas/components/onboarding/renderButtons.tsx
@@ -1,8 +1,12 @@
-import React from 'react';
-import { Button, Group, ActionIcon } from '@mantine/core';
-import ChevronLeftIcon from '@mui/icons-material/ChevronLeft';
-import { TFunction } from 'i18next';
-import { ButtonDefinition, type FlowState, type ButtonAction } from '@app/components/onboarding/saasOnboardingFlowConfig';
+import React from "react";
+import { Button, Group, ActionIcon } from "@mantine/core";
+import ChevronLeftIcon from "@mui/icons-material/ChevronLeft";
+import { TFunction } from "i18next";
+import {
+  ButtonDefinition,
+  type FlowState,
+  type ButtonAction,
+} from "@app/components/onboarding/saasOnboardingFlowConfig";
 
 interface RenderButtonsProps {
   slideDefinition: {
@@ -14,40 +18,49 @@ interface RenderButtonsProps {
   t: TFunction;
 }
 
-export function renderButtons({ slideDefinition, flowState, onAction, t }: RenderButtonsProps) {
-  const leftButtons = slideDefinition.buttons.filter((btn) => btn.group === 'left');
-  const rightButtons = slideDefinition.buttons.filter((btn) => btn.group === 'right');
+export function renderButtons({
+  slideDefinition,
+  flowState,
+  onAction,
+  t,
+}: RenderButtonsProps) {
+  const leftButtons = slideDefinition.buttons.filter(
+    (btn) => btn.group === "left",
+  );
+  const rightButtons = slideDefinition.buttons.filter(
+    (btn) => btn.group === "right",
+  );
 
-  const buttonStyles = (variant: ButtonDefinition['variant']) =>
-    variant === 'primary'
+  const buttonStyles = (variant: ButtonDefinition["variant"]) =>
+    variant === "primary"
       ? {
           root: {
-            background: 'var(--onboarding-primary-button-bg)',
-            color: 'var(--onboarding-primary-button-text)',
+            background: "var(--onboarding-primary-button-bg)",
+            color: "var(--onboarding-primary-button-text)",
           },
         }
       : {
           root: {
-            background: 'var(--onboarding-secondary-button-bg)',
-            border: '1px solid var(--onboarding-secondary-button-border)',
-            color: 'var(--onboarding-secondary-button-text)',
+            background: "var(--onboarding-secondary-button-bg)",
+            border: "1px solid var(--onboarding-secondary-button-border)",
+            color: "var(--onboarding-secondary-button-text)",
           },
         };
 
   const resolveButtonLabel = (button: ButtonDefinition) => {
     // Translate the label (it's a translation key)
-    const label = button.label ?? '';
-    if (!label) return '';
+    const label = button.label ?? "";
+    if (!label) return "";
 
     // Extract fallback text from translation key (e.g., 'onboarding.buttons.next' -> 'Next')
-    const fallback = label.split('.').pop() || label;
+    const fallback = label.split(".").pop() || label;
     return t(label, fallback);
   };
 
   const renderButton = (button: ButtonDefinition) => {
     const disabled = button.disabledWhen?.(flowState) ?? false;
 
-    if (button.type === 'icon') {
+    if (button.type === "icon") {
       return (
         <ActionIcon
           key={button.key}
@@ -57,22 +70,29 @@ export function renderButtons({ slideDefinition, flowState, onAction, t }: Rende
           disabled={disabled}
           styles={{
             root: {
-              background: 'var(--onboarding-secondary-button-bg)',
-              border: '1px solid var(--onboarding-secondary-button-border)',
-              color: 'var(--onboarding-secondary-button-text)',
+              background: "var(--onboarding-secondary-button-bg)",
+              border: "1px solid var(--onboarding-secondary-button-border)",
+              color: "var(--onboarding-secondary-button-text)",
             },
           }}
         >
-          {button.icon === 'chevron-left' && <ChevronLeftIcon fontSize="small" />}
+          {button.icon === "chevron-left" && (
+            <ChevronLeftIcon fontSize="small" />
+          )}
         </ActionIcon>
       );
     }
 
-    const variant = button.variant ?? 'secondary';
+    const variant = button.variant ?? "secondary";
     const label = resolveButtonLabel(button);
 
     return (
-      <Button key={button.key} onClick={() => onAction(button.action)} disabled={disabled} styles={buttonStyles(variant)}>
+      <Button
+        key={button.key}
+        onClick={() => onAction(button.action)}
+        disabled={disabled}
+        styles={buttonStyles(variant)}
+      >
         {label}
       </Button>
     );
diff --git a/frontend/src/saas/components/onboarding/saasFlowResolver.ts b/frontend/src/saas/components/onboarding/saasFlowResolver.ts
index 87348f9389..539418a0ca 100644
--- a/frontend/src/saas/components/onboarding/saasFlowResolver.ts
+++ b/frontend/src/saas/components/onboarding/saasFlowResolver.ts
@@ -1,8 +1,11 @@
-import { TrialStatus } from '@app/auth/UseSession';
-import { FLOW_SEQUENCES, SlideId } from '@app/components/onboarding/saasOnboardingFlowConfig';
+import { TrialStatus } from "@app/auth/UseSession";
+import {
+  FLOW_SEQUENCES,
+  SlideId,
+} from "@app/components/onboarding/saasOnboardingFlowConfig";
 
 export interface FlowConfig {
-  type: 'saas-trial' | 'saas-paid';
+  type: "saas-trial" | "saas-paid";
   ids: SlideId[];
 }
 
@@ -15,26 +18,25 @@ export interface FlowConfig {
  */
 export function resolveSaasFlow(
   trialStatus: TrialStatus | null,
-  _isPro: boolean | null
+  _isPro: boolean | null,
 ): FlowConfig {
   // Show free trial card if:
   // 1. User has active trial (isTrialing = true)
   // 2. Trial has not expired (daysRemaining > 0)
   // 3. User is not paid Pro (or Pro is from trial)
   const hasActiveTrial =
-    trialStatus?.isTrialing === true &&
-    trialStatus.daysRemaining > 0;
+    trialStatus?.isTrialing === true && trialStatus.daysRemaining > 0;
 
   if (hasActiveTrial) {
     return {
-      type: 'saas-trial',
+      type: "saas-trial",
       ids: FLOW_SEQUENCES.saasTrialUser,
     };
   }
 
   // For paid users, expired trials, or no trial info
   return {
-    type: 'saas-paid',
+    type: "saas-paid",
     ids: FLOW_SEQUENCES.saasPaidUser,
   };
 }
diff --git a/frontend/src/saas/components/onboarding/saasOnboardingFlowConfig.ts b/frontend/src/saas/components/onboarding/saasOnboardingFlowConfig.ts
index 6987cad279..342e1fe87f 100644
--- a/frontend/src/saas/components/onboarding/saasOnboardingFlowConfig.ts
+++ b/frontend/src/saas/components/onboarding/saasOnboardingFlowConfig.ts
@@ -1,18 +1,14 @@
-import WelcomeSlide from '@app/components/onboarding/slides/WelcomeSlide';
-import DesktopInstallSlide from '@app/components/onboarding/slides/DesktopInstallSlide';
-import FreeTrialSlide from '@app/components/onboarding/slides/FreeTrialSlide';
-import { SlideConfig } from '@app/types/types';
-import { TrialStatus } from '@app/auth/UseSession';
+import WelcomeSlide from "@app/components/onboarding/slides/WelcomeSlide";
+import DesktopInstallSlide from "@app/components/onboarding/slides/DesktopInstallSlide";
+import FreeTrialSlide from "@app/components/onboarding/slides/FreeTrialSlide";
+import { SlideConfig } from "@app/types/types";
+import { TrialStatus } from "@app/auth/UseSession";
 
-export type SlideId = 'welcome' | 'free-trial' | 'desktop-install';
+export type SlideId = "welcome" | "free-trial" | "desktop-install";
 
-export type HeroType = 'rocket' | 'dual-icon' | 'diamond';
+export type HeroType = "rocket" | "dual-icon" | "diamond";
 
-export type ButtonAction =
-  | 'next'
-  | 'prev'
-  | 'close'
-  | 'download-selected';
+export type ButtonAction = "next" | "prev" | "close" | "download-selected";
 
 export type FlowState = Record<string, never>;
 
@@ -36,11 +32,11 @@ export interface HeroDefinition {
 
 export interface ButtonDefinition {
   key: string;
-  type: 'button' | 'icon';
+  type: "button" | "icon";
   label?: string;
-  icon?: 'chevron-left';
-  variant?: 'primary' | 'secondary' | 'default';
-  group: 'left' | 'right';
+  icon?: "chevron-left";
+  variant?: "primary" | "secondary" | "default";
+  group: "left" | "right";
   action: ButtonAction;
   disabledWhen?: (state: FlowState) => boolean;
 }
@@ -53,82 +49,82 @@ export interface SlideDefinition {
 }
 
 export const SLIDE_DEFINITIONS: Record<SlideId, SlideDefinition> = {
-  'welcome': {
-    id: 'welcome',
+  welcome: {
+    id: "welcome",
     createSlide: () => WelcomeSlide(),
-    hero: { type: 'rocket' },
+    hero: { type: "rocket" },
     buttons: [
       {
-        key: 'welcome-next',
-        type: 'button',
-        label: 'onboarding.buttons.next',
-        variant: 'primary',
-        group: 'right',
-        action: 'next',
+        key: "welcome-next",
+        type: "button",
+        label: "onboarding.buttons.next",
+        variant: "primary",
+        group: "right",
+        action: "next",
       },
     ],
   },
-  'free-trial': {
-    id: 'free-trial',
+  "free-trial": {
+    id: "free-trial",
     createSlide: ({ trialStatus }) => {
       if (!trialStatus) {
-        throw new Error('Trial status is required for free-trial slide');
+        throw new Error("Trial status is required for free-trial slide");
       }
       return FreeTrialSlide({ trialStatus });
     },
-    hero: { type: 'diamond' },
+    hero: { type: "diamond" },
     buttons: [
       {
-        key: 'trial-back',
-        type: 'icon',
-        icon: 'chevron-left',
-        group: 'left',
-        action: 'prev',
+        key: "trial-back",
+        type: "icon",
+        icon: "chevron-left",
+        group: "left",
+        action: "prev",
       },
       {
-        key: 'trial-next',
-        type: 'button',
-        label: 'onboarding.buttons.next',
-        variant: 'primary',
-        group: 'right',
-        action: 'next',
+        key: "trial-next",
+        type: "button",
+        label: "onboarding.buttons.next",
+        variant: "primary",
+        group: "right",
+        action: "next",
       },
     ],
   },
-  'desktop-install': {
-    id: 'desktop-install',
+  "desktop-install": {
+    id: "desktop-install",
     createSlide: ({ osLabel, osUrl, osOptions, onDownloadUrlChange }) =>
       DesktopInstallSlide({ osLabel, osUrl, osOptions, onDownloadUrlChange }),
-    hero: { type: 'dual-icon' },
+    hero: { type: "dual-icon" },
     buttons: [
       {
-        key: 'desktop-back',
-        type: 'icon',
-        icon: 'chevron-left',
-        group: 'left',
-        action: 'prev',
+        key: "desktop-back",
+        type: "icon",
+        icon: "chevron-left",
+        group: "left",
+        action: "prev",
       },
       {
-        key: 'desktop-skip',
-        type: 'button',
-        label: 'onboarding.buttons.skipForNow',
-        variant: 'secondary',
-        group: 'left',
-        action: 'close',
+        key: "desktop-skip",
+        type: "button",
+        label: "onboarding.buttons.skipForNow",
+        variant: "secondary",
+        group: "left",
+        action: "close",
       },
       {
-        key: 'desktop-download',
-        type: 'button',
-        label: 'onboarding.buttons.download',
-        variant: 'primary',
-        group: 'right',
-        action: 'download-selected',
+        key: "desktop-download",
+        type: "button",
+        label: "onboarding.buttons.download",
+        variant: "primary",
+        group: "right",
+        action: "download-selected",
       },
     ],
   },
 };
 
 export const FLOW_SEQUENCES = {
-  saasTrialUser: ['welcome', 'free-trial', 'desktop-install'] as SlideId[],
-  saasPaidUser: ['welcome', 'desktop-install'] as SlideId[],
+  saasTrialUser: ["welcome", "free-trial", "desktop-install"] as SlideId[],
+  saasPaidUser: ["welcome", "desktop-install"] as SlideId[],
 };
diff --git a/frontend/src/saas/components/onboarding/slides/FreeTrialSlide.tsx b/frontend/src/saas/components/onboarding/slides/FreeTrialSlide.tsx
index 6594e0a29b..70ad08c986 100644
--- a/frontend/src/saas/components/onboarding/slides/FreeTrialSlide.tsx
+++ b/frontend/src/saas/components/onboarding/slides/FreeTrialSlide.tsx
@@ -1,8 +1,8 @@
-import React from 'react';
-import { useTranslation } from 'react-i18next';
-import { SlideConfig } from '@app/types/types';
-import { UNIFIED_CIRCLE_CONFIG } from '@app/components/onboarding/slides/unifiedBackgroundConfig';
-import { TrialStatus } from '@app/auth/UseSession';
+import React from "react";
+import { useTranslation } from "react-i18next";
+import { SlideConfig } from "@app/types/types";
+import { UNIFIED_CIRCLE_CONFIG } from "@app/components/onboarding/slides/unifiedBackgroundConfig";
+import { TrialStatus } from "@app/auth/UseSession";
 
 interface FreeTrialSlideProps {
   trialStatus: TrialStatus;
@@ -12,9 +12,7 @@ function FreeTrialSlideTitle() {
   const { t } = useTranslation();
 
   return (
-    <span>
-      {t('onboarding.freeTrial.title', 'Your 30-Day Pro Trial')}
-    </span>
+    <span>{t("onboarding.freeTrial.title", "Your 30-Day Pro Trial")}</span>
   );
 }
 
@@ -22,59 +20,88 @@ const FreeTrialSlideBody = ({ trialStatus }: { trialStatus: TrialStatus }) => {
   const { t } = useTranslation();
 
   // Format the trial end date
-  const trialEndDate = new Date(trialStatus.trialEnd).toLocaleDateString(undefined, {
-    year: 'numeric',
-    month: 'long',
-    day: 'numeric',
-  });
+  const trialEndDate = new Date(trialStatus.trialEnd).toLocaleDateString(
+    undefined,
+    {
+      year: "numeric",
+      month: "long",
+      day: "numeric",
+    },
+  );
 
   // Determine which message to show based on payment method
   const afterTrialMessage = trialStatus.hasScheduledSub
-    ? t('onboarding.freeTrial.afterTrialWithPayment', 'Your Pro subscription will start automatically when the trial ends.')
+    ? t(
+        "onboarding.freeTrial.afterTrialWithPayment",
+        "Your Pro subscription will start automatically when the trial ends.",
+      )
     : trialStatus.hasPaymentMethod
-    ? t('onboarding.freeTrial.afterTrialWithPayment', 'Your Pro subscription will start automatically when the trial ends.')
-    : t('onboarding.freeTrial.afterTrialWithoutPayment', 'After your trial ends, you\'ll continue with our free tier. Add a payment method to keep Pro access.');
+      ? t(
+          "onboarding.freeTrial.afterTrialWithPayment",
+          "Your Pro subscription will start automatically when the trial ends.",
+        )
+      : t(
+          "onboarding.freeTrial.afterTrialWithoutPayment",
+          "After your trial ends, you'll continue with our free tier. Add a payment method to keep Pro access.",
+        );
 
   // Pluralize days remaining
-  const daysText = trialStatus.daysRemaining === 1
-    ? t('onboarding.freeTrial.daysRemainingSingular', '{{days}} day remaining', { days: trialStatus.daysRemaining })
-    : t('onboarding.freeTrial.daysRemaining', '{{days}} days remaining', { days: trialStatus.daysRemaining });
+  const daysText =
+    trialStatus.daysRemaining === 1
+      ? t(
+          "onboarding.freeTrial.daysRemainingSingular",
+          "{{days}} day remaining",
+          { days: trialStatus.daysRemaining },
+        )
+      : t("onboarding.freeTrial.daysRemaining", "{{days}} days remaining", {
+          days: trialStatus.daysRemaining,
+        });
 
   return (
-    <div style={{ display: 'flex', flexDirection: 'column', gap: '1rem' }}>
+    <div style={{ display: "flex", flexDirection: "column", gap: "1rem" }}>
       <p>
         {t(
-          'onboarding.freeTrial.body',
-          'You have full access to Stirling PDF Pro features during your trial. Enjoy unlimited conversions, larger file sizes, and priority processing.'
+          "onboarding.freeTrial.body",
+          "You have full access to Stirling PDF Pro features during your trial. Enjoy unlimited conversions, larger file sizes, and priority processing.",
         )}
       </p>
-      <div style={{
-        background: 'rgba(255, 255, 255, 0.1)',
-        borderRadius: '8px',
-        padding: '1rem',
-        textAlign: 'center'
-      }}>
-        <div style={{ fontSize: '1.25rem', fontWeight: 'bold', marginBottom: '0.5rem' }}>
+      <div
+        style={{
+          background: "rgba(255, 255, 255, 0.1)",
+          borderRadius: "8px",
+          padding: "1rem",
+          textAlign: "center",
+        }}
+      >
+        <div
+          style={{
+            fontSize: "1.25rem",
+            fontWeight: "bold",
+            marginBottom: "0.5rem",
+          }}
+        >
           {daysText}
         </div>
-        <div style={{ fontSize: '0.9rem', opacity: 0.9 }}>
-          {t('onboarding.freeTrial.trialEnds', 'Trial ends {{date}}', { date: trialEndDate })}
+        <div style={{ fontSize: "0.9rem", opacity: 0.9 }}>
+          {t("onboarding.freeTrial.trialEnds", "Trial ends {{date}}", {
+            date: trialEndDate,
+          })}
         </div>
       </div>
-      <p style={{ fontSize: '0.9rem', opacity: 0.9 }}>
-        {afterTrialMessage}
-      </p>
+      <p style={{ fontSize: "0.9rem", opacity: 0.9 }}>{afterTrialMessage}</p>
     </div>
   );
 };
 
-export default function FreeTrialSlide({ trialStatus }: FreeTrialSlideProps): SlideConfig {
+export default function FreeTrialSlide({
+  trialStatus,
+}: FreeTrialSlideProps): SlideConfig {
   return {
-    key: 'free-trial',
+    key: "free-trial",
     title: <FreeTrialSlideTitle />,
     body: <FreeTrialSlideBody trialStatus={trialStatus} />,
     background: {
-      gradientStops: ['#10B981', '#06B6D4'],
+      gradientStops: ["#10B981", "#06B6D4"],
       circles: UNIFIED_CIRCLE_CONFIG,
     },
   };
diff --git a/frontend/src/saas/components/onboarding/useSaasOnboardingState.ts b/frontend/src/saas/components/onboarding/useSaasOnboardingState.ts
index 70f8528f62..ecba61bf2f 100644
--- a/frontend/src/saas/components/onboarding/useSaasOnboardingState.ts
+++ b/frontend/src/saas/components/onboarding/useSaasOnboardingState.ts
@@ -1,20 +1,20 @@
-import { useCallback, useEffect, useMemo, useState, useRef } from 'react';
-import { useAuth } from '@app/auth/UseSession';
-import { useOs } from '@app/hooks/useOs';
+import { useCallback, useEffect, useMemo, useState, useRef } from "react";
+import { useAuth } from "@app/auth/UseSession";
+import { useOs } from "@app/hooks/useOs";
 import {
   SLIDE_DEFINITIONS,
   type ButtonAction,
   type FlowState,
   type SlideId,
-} from '@app/components/onboarding/saasOnboardingFlowConfig';
-import { resolveSaasFlow } from '@app/components/onboarding/saasFlowResolver';
-import { DOWNLOAD_URLS } from '@app/constants/downloads';
+} from "@app/components/onboarding/saasOnboardingFlowConfig";
+import { resolveSaasFlow } from "@app/components/onboarding/saasFlowResolver";
+import { DOWNLOAD_URLS } from "@app/constants/downloads";
 
 interface UseSaasOnboardingStateResult {
   currentStep: number;
   totalSteps: number;
   slideDefinition: (typeof SLIDE_DEFINITIONS)[SlideId];
-  currentSlide: ReturnType<(typeof SLIDE_DEFINITIONS)[SlideId]['createSlide']>;
+  currentSlide: ReturnType<(typeof SLIDE_DEFINITIONS)[SlideId]["createSlide"]>;
   flowState: FlowState;
   handleButtonAction: (action: ButtonAction) => void;
 }
@@ -30,7 +30,7 @@ export function useSaasOnboardingState({
 }: UseSaasOnboardingStateProps): UseSaasOnboardingStateResult | null {
   const { trialStatus, isPro, loading } = useAuth();
   const osType = useOs();
-  const selectedDownloadUrlRef = useRef<string>('');
+  const selectedDownloadUrlRef = useRef<string>("");
 
   const [currentStep, setCurrentStep] = useState<number>(0);
 
@@ -44,28 +44,39 @@ export function useSaasOnboardingState({
   // Determine OS details for desktop download
   const os = useMemo(() => {
     switch (osType) {
-      case 'windows':
-        return { label: 'Windows', url: DOWNLOAD_URLS.WINDOWS };
-      case 'mac-apple':
-        return { label: 'Mac (Apple Silicon)', url: DOWNLOAD_URLS.MAC_APPLE_SILICON };
-      case 'mac-intel':
-        return { label: 'Mac (Intel)', url: DOWNLOAD_URLS.MAC_INTEL };
-      case 'linux-x64':
-      case 'linux-arm64':
-        return { label: 'Linux', url: DOWNLOAD_URLS.LINUX_DOCS };
+      case "windows":
+        return { label: "Windows", url: DOWNLOAD_URLS.WINDOWS };
+      case "mac-apple":
+        return {
+          label: "Mac (Apple Silicon)",
+          url: DOWNLOAD_URLS.MAC_APPLE_SILICON,
+        };
+      case "mac-intel":
+        return { label: "Mac (Intel)", url: DOWNLOAD_URLS.MAC_INTEL };
+      case "linux-x64":
+      case "linux-arm64":
+        return { label: "Linux", url: DOWNLOAD_URLS.LINUX_DOCS };
       default:
-        return { label: '', url: '' };
+        return { label: "", url: "" };
     }
   }, [osType]);
 
   const osOptions = useMemo(() => {
     const options = [
-      { label: 'Windows', url: DOWNLOAD_URLS.WINDOWS, value: 'windows' },
-      { label: 'Mac (Apple Silicon)', url: DOWNLOAD_URLS.MAC_APPLE_SILICON, value: 'mac-apple' },
-      { label: 'Mac (Intel)', url: DOWNLOAD_URLS.MAC_INTEL, value: 'mac-intel' },
-      { label: 'Linux', url: DOWNLOAD_URLS.LINUX_DOCS, value: 'linux' },
+      { label: "Windows", url: DOWNLOAD_URLS.WINDOWS, value: "windows" },
+      {
+        label: "Mac (Apple Silicon)",
+        url: DOWNLOAD_URLS.MAC_APPLE_SILICON,
+        value: "mac-apple",
+      },
+      {
+        label: "Mac (Intel)",
+        url: DOWNLOAD_URLS.MAC_INTEL,
+        value: "mac-intel",
+      },
+      { label: "Linux", url: DOWNLOAD_URLS.LINUX_DOCS, value: "linux" },
     ];
-    return options.filter(opt => opt.url);
+    return options.filter((opt) => opt.url);
   }, []);
 
   // Store selected download URL
@@ -76,7 +87,7 @@ export function useSaasOnboardingState({
   // Resolve flow based on trial status
   const resolvedFlow = useMemo(
     () => resolveSaasFlow(trialStatus, isPro),
-    [trialStatus, isPro]
+    [trialStatus, isPro],
   );
 
   const flowSlideIds = resolvedFlow.ids;
@@ -90,7 +101,8 @@ export function useSaasOnboardingState({
     }
   }, [flowSlideIds.length, currentStep]);
 
-  const currentSlideId = flowSlideIds[currentStep] ?? flowSlideIds[flowSlideIds.length - 1];
+  const currentSlideId =
+    flowSlideIds[currentStep] ?? flowSlideIds[flowSlideIds.length - 1];
   const slideDefinition = SLIDE_DEFINITIONS[currentSlideId];
 
   // Create slide with appropriate params - must be called before any early returns
@@ -103,7 +115,14 @@ export function useSaasOnboardingState({
       onDownloadUrlChange: handleDownloadUrlChange,
       trialStatus: trialStatus ?? undefined,
     });
-  }, [slideDefinition, os.label, os.url, osOptions, handleDownloadUrlChange, trialStatus]);
+  }, [
+    slideDefinition,
+    os.label,
+    os.url,
+    osOptions,
+    handleDownloadUrlChange,
+    trialStatus,
+  ]);
 
   // Navigation functions
   const goNext = useCallback(() => {
@@ -118,7 +137,7 @@ export function useSaasOnboardingState({
   const handleButtonAction = useCallback(
     (action: ButtonAction) => {
       switch (action) {
-        case 'next':
+        case "next":
           // If on last slide, close modal
           if (currentStep === maxIndex) {
             onClose();
@@ -126,17 +145,17 @@ export function useSaasOnboardingState({
             goNext();
           }
           return;
-        case 'prev':
+        case "prev":
           goPrev();
           return;
-        case 'close':
+        case "close":
           onClose();
           return;
-        case 'download-selected': {
+        case "download-selected": {
           // Open download URL in new tab
           const downloadUrl = selectedDownloadUrlRef.current || os.url;
           if (downloadUrl) {
-            window.open(downloadUrl, '_blank', 'noopener,noreferrer');
+            window.open(downloadUrl, "_blank", "noopener,noreferrer");
           }
           // Then advance to next slide or close if last
           if (currentStep === maxIndex) {
@@ -151,7 +170,7 @@ export function useSaasOnboardingState({
           return;
       }
     },
-    [currentStep, maxIndex, goNext, goPrev, onClose, os.url]
+    [currentStep, maxIndex, goNext, goPrev, onClose, os.url],
   );
 
   const flowState: FlowState = {};
diff --git a/frontend/src/saas/components/shared/AppConfigModal.tsx b/frontend/src/saas/components/shared/AppConfigModal.tsx
index 680ceeae7b..550da1dce8 100644
--- a/frontend/src/saas/components/shared/AppConfigModal.tsx
+++ b/frontend/src/saas/components/shared/AppConfigModal.tsx
@@ -1,16 +1,19 @@
-import React, { useCallback, useMemo, useState, useEffect } from 'react';
-import { Modal, Button, Text, ActionIcon } from '@mantine/core';
-import { useMediaQuery } from '@mantine/hooks';
-import { useAuth } from '@app/auth/UseSession';
-import { isUserAnonymous } from '@app/auth/supabase';
-import { useTranslation } from 'react-i18next';
-import LocalIcon from '@app/components/shared/LocalIcon';
-import Overview from '@app/components/shared/config/configSections/Overview';
-import { createSaasConfigNavSections } from '@app/components/shared/config/saasConfigNavSections';
-import { NavKey } from '@app/components/shared/config/types';
-import { withBasePath } from '@app/constants/app';
-import '@app/components/shared/AppConfigModal.css';
-import { Z_INDEX_OVER_FULLSCREEN_SURFACE, Z_INDEX_OVER_SETTINGS_MODAL } from '@app/styles/zIndex';
+import React, { useCallback, useMemo, useState, useEffect } from "react";
+import { Modal, Button, Text, ActionIcon } from "@mantine/core";
+import { useMediaQuery } from "@mantine/hooks";
+import { useAuth } from "@app/auth/UseSession";
+import { isUserAnonymous } from "@app/auth/supabase";
+import { useTranslation } from "react-i18next";
+import LocalIcon from "@app/components/shared/LocalIcon";
+import Overview from "@app/components/shared/config/configSections/Overview";
+import { createSaasConfigNavSections } from "@app/components/shared/config/saasConfigNavSections";
+import { NavKey } from "@app/components/shared/config/types";
+import { withBasePath } from "@app/constants/app";
+import "@app/components/shared/AppConfigModal.css";
+import {
+  Z_INDEX_OVER_FULLSCREEN_SURFACE,
+  Z_INDEX_OVER_SETTINGS_MODAL,
+} from "@app/styles/zIndex";
 
 interface AppConfigModalProps {
   opened: boolean;
@@ -23,7 +26,7 @@ const AppConfigModal: React.FC<AppConfigModalProps> = ({ opened, onClose }) => {
   const { signOut, user, creditBalance, refreshCredits } = useAuth();
   const { t } = useTranslation();
   const [confirmOpen, setConfirmOpen] = useState(false);
-  const [active, setActive] = useState<NavKey>('overview');
+  const [active, setActive] = useState<NavKey>("overview");
   const [notice, setNotice] = useState<string | null>(null);
 
   // Check if user can access billing features (non-anonymous users only)
@@ -35,52 +38,71 @@ const AppConfigModal: React.FC<AppConfigModalProps> = ({ opened, onClose }) => {
         setActive(detail.key);
       }
     };
-    window.addEventListener('appConfig:navigate', handler as EventListener);
-    return () => window.removeEventListener('appConfig:navigate', handler as EventListener);
+    window.addEventListener("appConfig:navigate", handler as EventListener);
+    return () =>
+      window.removeEventListener(
+        "appConfig:navigate",
+        handler as EventListener,
+      );
   }, []);
 
   // Listen for notice updates (e.g., "Not enough credits..." next to Plan title)
   useEffect(() => {
     const handler = (ev: Event) => {
-      const detail = (ev as CustomEvent).detail as { key?: NavKey; notice?: string } | undefined;
-      if (detail?.notice && (detail?.key ? detail.key === 'plan' : true)) {
+      const detail = (ev as CustomEvent).detail as
+        | { key?: NavKey; notice?: string }
+        | undefined;
+      if (detail?.notice && (detail?.key ? detail.key === "plan" : true)) {
         setNotice(detail.notice);
       }
     };
-    window.addEventListener('appConfig:notice', handler as EventListener);
-    return () => window.removeEventListener('appConfig:notice', handler as EventListener);
+    window.addEventListener("appConfig:notice", handler as EventListener);
+    return () =>
+      window.removeEventListener("appConfig:notice", handler as EventListener);
   }, []);
 
   // When the modal opens to Plan, proactively refresh credits and log values
   useEffect(() => {
     if (!opened) return;
-    if (active !== 'plan') return;
-    console.log('[AppConfigModal] Opening Plan section. Current creditBalance:', creditBalance);
+    if (active !== "plan") return;
+    console.log(
+      "[AppConfigModal] Opening Plan section. Current creditBalance:",
+      creditBalance,
+    );
     (async () => {
       try {
         await refreshCredits();
       } catch (e) {
-        console.warn('[AppConfigModal] Failed to refresh credits on Plan open:', e);
+        console.warn(
+          "[AppConfigModal] Failed to refresh credits on Plan open:",
+          e,
+        );
       }
     })();
   }, [opened, active]);
 
   useEffect(() => {
     if (!opened) return;
-    if (active !== 'plan') return;
-    console.log('[AppConfigModal] Credit balance updated while viewing Plan:', creditBalance);
+    if (active !== "plan") return;
+    console.log(
+      "[AppConfigModal] Credit balance updated while viewing Plan:",
+      creditBalance,
+    );
   }, [opened, active, creditBalance]);
 
-  const colors = useMemo(() => ({
-    navBg: 'var(--modal-nav-bg)',
-    sectionTitle: 'var(--modal-nav-section-title)',
-    navItem: 'var(--modal-nav-item)',
-    navItemActive: 'var(--modal-nav-item-active)',
-    navItemActiveBg: 'var(--modal-nav-item-active-bg)',
-    contentBg: 'var(--modal-content-bg)',
-    headerBorder: 'var(--modal-header-border)',
-  }), []);
-  const isDev = process.env.NODE_ENV === 'development';
+  const colors = useMemo(
+    () => ({
+      navBg: "var(--modal-nav-bg)",
+      sectionTitle: "var(--modal-nav-section-title)",
+      navItem: "var(--modal-nav-item)",
+      navItemActive: "var(--modal-nav-item-active)",
+      navItemActiveBg: "var(--modal-nav-item-active-bg)",
+      contentBg: "var(--modal-content-bg)",
+      headerBorder: "var(--modal-header-border)",
+    }),
+    [],
+  );
+  const isDev = process.env.NODE_ENV === "development";
 
   const openLogoutConfirm = useCallback(() => setConfirmOpen(true), []);
 
@@ -97,15 +119,15 @@ const AppConfigModal: React.FC<AppConfigModalProps> = ({ opened, onClose }) => {
 
   const activeLabel = useMemo(() => {
     for (const section of configNavSections) {
-      const found = section.items.find(i => i.key === active);
+      const found = section.items.find((i) => i.key === active);
       if (found) return found.label;
     }
-    return '';
+    return "";
   }, [configNavSections, active]);
 
   const activeComponent = useMemo(() => {
     for (const section of configNavSections) {
-      const found = section.items.find(i => i.key === active);
+      const found = section.items.find((i) => i.key === active);
       if (found) return found.component;
     }
     return null;
@@ -114,95 +136,117 @@ const AppConfigModal: React.FC<AppConfigModalProps> = ({ opened, onClose }) => {
   return (
     <>
       <Modal
-      opened={opened}
-      onClose={onClose}
-      title={null}
-      size={isMobile ? "100%" : 980}
-      centered
-      radius="lg"
-      withCloseButton={false}
-      zIndex={Z_INDEX_OVER_FULLSCREEN_SURFACE}
-      overlayProps={{ opacity: 0.35, blur: 2 }}
-      padding={0}
-      fullScreen={isMobile}
-    >
-      <div className="modal-container">
-        {/* Left navigation */}
-        <div
-          className={`modal-nav ${isMobile ? 'mobile' : ''}`}
-          style={{
-            background: colors.navBg,
-            borderRight: `1px solid ${colors.headerBorder}`,
-          }}
-        >
-          <div className="modal-nav-scroll">
-            {configNavSections.map(section => (
-              <div key={section.title} className="modal-nav-section">
-                {!isMobile && (
-                  <Text size="xs" fw={600} c={colors.sectionTitle} style={{ textTransform: 'uppercase', letterSpacing: 0.4 }}>
-                    {section.title}
-                  </Text>
-                )}
-                <div className="modal-nav-section-items">
-                  {section.items.map(item => {
-                    const isActive = active === item.key;
-                    const color = isActive ? colors.navItemActive : colors.navItem;
-                    const iconSize = isMobile ? 28 : 18;
-                    return (
-                      <div
-                        key={item.key}
-                        onClick={() => setActive(item.key)}
-                        className={`modal-nav-item ${isMobile ? 'mobile' : ''}`}
-                        style={{
-                          background: isActive ? colors.navItemActiveBg : 'transparent',
-                        }}
-                      >
-                        <LocalIcon icon={item.icon} width={iconSize} height={iconSize} style={{ color }} />
-                        {!isMobile && (
-                          <Text size="sm" fw={500} style={{ color }}>
-                            {item.label}
-                          </Text>
-                        )}
-                      </div>
-                    );
-                  })}
+        opened={opened}
+        onClose={onClose}
+        title={null}
+        size={isMobile ? "100%" : 980}
+        centered
+        radius="lg"
+        withCloseButton={false}
+        zIndex={Z_INDEX_OVER_FULLSCREEN_SURFACE}
+        overlayProps={{ opacity: 0.35, blur: 2 }}
+        padding={0}
+        fullScreen={isMobile}
+      >
+        <div className="modal-container">
+          {/* Left navigation */}
+          <div
+            className={`modal-nav ${isMobile ? "mobile" : ""}`}
+            style={{
+              background: colors.navBg,
+              borderRight: `1px solid ${colors.headerBorder}`,
+            }}
+          >
+            <div className="modal-nav-scroll">
+              {configNavSections.map((section) => (
+                <div key={section.title} className="modal-nav-section">
+                  {!isMobile && (
+                    <Text
+                      size="xs"
+                      fw={600}
+                      c={colors.sectionTitle}
+                      style={{ textTransform: "uppercase", letterSpacing: 0.4 }}
+                    >
+                      {section.title}
+                    </Text>
+                  )}
+                  <div className="modal-nav-section-items">
+                    {section.items.map((item) => {
+                      const isActive = active === item.key;
+                      const color = isActive
+                        ? colors.navItemActive
+                        : colors.navItem;
+                      const iconSize = isMobile ? 28 : 18;
+                      return (
+                        <div
+                          key={item.key}
+                          onClick={() => setActive(item.key)}
+                          className={`modal-nav-item ${isMobile ? "mobile" : ""}`}
+                          style={{
+                            background: isActive
+                              ? colors.navItemActiveBg
+                              : "transparent",
+                          }}
+                        >
+                          <LocalIcon
+                            icon={item.icon}
+                            width={iconSize}
+                            height={iconSize}
+                            style={{ color }}
+                          />
+                          {!isMobile && (
+                            <Text size="sm" fw={500} style={{ color }}>
+                              {item.label}
+                            </Text>
+                          )}
+                        </div>
+                      );
+                    })}
+                  </div>
                 </div>
-              </div>
-            ))}
+              ))}
+            </div>
           </div>
-        </div>
 
-        {/* Right content */}
-        <div className="modal-content">
-          <div className="modal-content-scroll">
-            {/* Sticky header with section title and small close button */}
-            <div
-              className="modal-header"
-              style={{
-                background: colors.contentBg,
-                borderBottom: `1px solid ${colors.headerBorder}`,
-              }}
-            >
-              <Text fw={700} size="lg">
-                {activeLabel}
-                {active === 'plan' && notice ? (
-                  <span style={{ marginLeft: 8, fontWeight: 600, color: 'var(--mantine-color-yellow-7)' }}>
-                    – {notice}
-                  </span>
-                ) : null}
-              </Text>
-              <ActionIcon variant="subtle" onClick={onClose} aria-label="Close">
-                <LocalIcon icon="close-rounded" width={18} height={18} />
-              </ActionIcon>
-            </div>
-            <div className="modal-body">
-              {activeComponent}
+          {/* Right content */}
+          <div className="modal-content">
+            <div className="modal-content-scroll">
+              {/* Sticky header with section title and small close button */}
+              <div
+                className="modal-header"
+                style={{
+                  background: colors.contentBg,
+                  borderBottom: `1px solid ${colors.headerBorder}`,
+                }}
+              >
+                <Text fw={700} size="lg">
+                  {activeLabel}
+                  {active === "plan" && notice ? (
+                    <span
+                      style={{
+                        marginLeft: 8,
+                        fontWeight: 600,
+                        color: "var(--mantine-color-yellow-7)",
+                      }}
+                    >
+                      – {notice}
+                    </span>
+                  ) : null}
+                </Text>
+                <ActionIcon
+                  variant="subtle"
+                  onClick={onClose}
+                  aria-label="Close"
+                >
+                  <LocalIcon icon="close-rounded" width={18} height={18} />
+                </ActionIcon>
+              </div>
+              <div className="modal-body">{activeComponent}</div>
             </div>
           </div>
         </div>
-      </div>
       </Modal>
-            {/* Confirm logout modal */}
+      {/* Confirm logout modal */}
       <Modal
         opened={confirmOpen}
         onClose={() => setConfirmOpen(false)}
@@ -213,7 +257,9 @@ const AppConfigModal: React.FC<AppConfigModalProps> = ({ opened, onClose }) => {
         <div className="confirm-modal-content">
           <Text>Are you sure you want to sign out?</Text>
           <div className="confirm-modal-buttons">
-            <Button variant="default" onClick={() => setConfirmOpen(false)}>Cancel</Button>
+            <Button variant="default" onClick={() => setConfirmOpen(false)}>
+              Cancel
+            </Button>
             <Button
               color="red"
               onClick={async () => {
@@ -222,7 +268,7 @@ const AppConfigModal: React.FC<AppConfigModalProps> = ({ opened, onClose }) => {
                 } finally {
                   setConfirmOpen(false);
                   onClose();
-                  window.location.href = withBasePath('/login');
+                  window.location.href = withBasePath("/login");
                 }
               }}
             >
diff --git a/frontend/src/saas/components/shared/InfoBanner.tsx b/frontend/src/saas/components/shared/InfoBanner.tsx
index 1e5a2b712e..7b2cfde0e7 100644
--- a/frontend/src/saas/components/shared/InfoBanner.tsx
+++ b/frontend/src/saas/components/shared/InfoBanner.tsx
@@ -1,8 +1,8 @@
-import React, { ReactNode } from 'react';
-import { Paper, Group, Text, Button, ActionIcon, Stack } from '@mantine/core';
-import LocalIcon from '@app/components/shared/LocalIcon';
+import React, { ReactNode } from "react";
+import { Paper, Group, Text, Button, ActionIcon, Stack } from "@mantine/core";
+import LocalIcon from "@app/components/shared/LocalIcon";
 
-type InfoBannerTone = 'info' | 'warning';
+type InfoBannerTone = "info" | "warning";
 
 const toneStyles: Record<
   InfoBannerTone,
@@ -15,18 +15,18 @@ const toneStyles: Record<
   }
 > = {
   info: {
-    background: 'var(--mantine-color-blue-0)',
-    border: 'var(--mantine-color-blue-2)',
-    text: 'var(--mantine-color-blue-9)',
-    icon: 'var(--mantine-color-blue-6)',
-    buttonColor: 'blue',
+    background: "var(--mantine-color-blue-0)",
+    border: "var(--mantine-color-blue-2)",
+    text: "var(--mantine-color-blue-9)",
+    icon: "var(--mantine-color-blue-6)",
+    buttonColor: "blue",
   },
   warning: {
-    background: 'var(--mantine-color-orange-0)',
-    border: 'var(--mantine-color-orange-3)',
-    text: 'var(--mantine-color-orange-9)',
-    icon: 'var(--mantine-color-orange-7)',
-    buttonColor: 'orange',
+    background: "var(--mantine-color-orange-0)",
+    border: "var(--mantine-color-orange-3)",
+    text: "var(--mantine-color-orange-9)",
+    icon: "var(--mantine-color-orange-7)",
+    buttonColor: "orange",
   },
 };
 
@@ -47,7 +47,7 @@ interface InfoBannerProps {
   textColor?: string;
   iconColor?: string;
   buttonColor?: string;
-  buttonVariant?: 'light' | 'filled' | 'white' | 'outline' | 'subtle';
+  buttonVariant?: "light" | "filled" | "white" | "outline" | "subtle";
   buttonTextColor?: string; // SaaS-specific for dark theme buttons
   minHeight?: number | string;
   closeIconColor?: string; // SaaS-specific for dark theme
@@ -62,19 +62,19 @@ export const InfoBanner: React.FC<InfoBannerProps> = ({
   title,
   message,
   buttonText,
-  buttonIcon = 'check-circle-rounded',
+  buttonIcon = "check-circle-rounded",
   onButtonClick,
   onDismiss,
   dismissible = true,
   loading = false,
   show = true,
-  tone = 'info',
+  tone = "info",
   background,
   borderColor,
   textColor,
   iconColor,
   buttonColor,
-  buttonVariant = 'light',
+  buttonVariant = "light",
   buttonTextColor,
   minHeight = 56,
   closeIconColor,
@@ -96,14 +96,25 @@ export const InfoBanner: React.FC<InfoBannerProps> = ({
         background: background ?? toneStyle.background,
         borderBottom: `1px solid ${borderColor ?? toneStyle.border}`,
         minHeight,
-        display: 'flex',
-        alignItems: 'center',
+        display: "flex",
+        alignItems: "center",
       }}
     >
-      <Group gap="sm" align="center" wrap="nowrap" justify="space-between" style={{ width: '100%' }}>
-        <Group gap="sm" align="center" wrap="nowrap" style={{ flex: 1, minWidth: 0 }}>
-          {icon && (
-            typeof icon === 'string' ? (
+      <Group
+        gap="sm"
+        align="center"
+        wrap="nowrap"
+        justify="space-between"
+        style={{ width: "100%" }}
+      >
+        <Group
+          gap="sm"
+          align="center"
+          wrap="nowrap"
+          style={{ flex: 1, minWidth: 0 }}
+        >
+          {icon &&
+            (typeof icon === "string" ? (
               <LocalIcon
                 icon={icon}
                 width="1.2rem"
@@ -111,14 +122,19 @@ export const InfoBanner: React.FC<InfoBannerProps> = ({
                 style={{ color: iconColor ?? toneStyle.icon, flexShrink: 0 }}
               />
             ) : (
-              <div style={{ flexShrink: 0, display: 'flex', alignItems: 'center' }}>
+              <div
+                style={{ flexShrink: 0, display: "flex", alignItems: "center" }}
+              >
                 {icon}
               </div>
-            )
-          )}
+            ))}
           <Stack gap={2} style={{ flex: 1, minWidth: 0 }}>
             {title && (
-              <Text fw={600} size="sm" style={{ color: textColor ?? toneStyle.text }}>
+              <Text
+                fw={600}
+                size="sm"
+                style={{ color: textColor ?? toneStyle.text }}
+              >
                 {title}
               </Text>
             )}
@@ -140,7 +156,9 @@ export const InfoBanner: React.FC<InfoBannerProps> = ({
               size="xs"
               onClick={onButtonClick}
               loading={loading}
-              leftSection={<LocalIcon icon={buttonIcon} width="0.9rem" height="0.9rem" />}
+              leftSection={
+                <LocalIcon icon={buttonIcon} width="0.9rem" height="0.9rem" />
+              }
               styles={
                 buttonTextColor
                   ? {
@@ -148,13 +166,13 @@ export const InfoBanner: React.FC<InfoBannerProps> = ({
                         color: buttonTextColor,
                       },
                     }
-                  : buttonVariant !== 'white' && buttonVariant !== 'filled'
-                  ? {
-                      label: {
-                        color: textColor ?? toneStyle.text,
-                      },
-                    }
-                  : undefined
+                  : buttonVariant !== "white" && buttonVariant !== "filled"
+                    ? {
+                        label: {
+                          color: textColor ?? toneStyle.text,
+                        },
+                      }
+                    : undefined
               }
             >
               {buttonText}
@@ -163,7 +181,7 @@ export const InfoBanner: React.FC<InfoBannerProps> = ({
           {dismissible && (
             <ActionIcon
               variant="subtle"
-              color={closeIconColor ? undefined : 'gray'}
+              color={closeIconColor ? undefined : "gray"}
               size="sm"
               onClick={handleDismiss}
               aria-label="Dismiss"
diff --git a/frontend/src/saas/components/shared/ManageBillingButton.tsx b/frontend/src/saas/components/shared/ManageBillingButton.tsx
index 3f9558bbf3..2ac6318bbb 100644
--- a/frontend/src/saas/components/shared/ManageBillingButton.tsx
+++ b/frontend/src/saas/components/shared/ManageBillingButton.tsx
@@ -1,7 +1,7 @@
-import { useState } from 'react';
-import { supabase } from '@app/auth/supabase';
-import { Button } from '@mantine/core';
-import { usePlans } from '@app/hooks/usePlans';
+import { useState } from "react";
+import { supabase } from "@app/auth/supabase";
+import { Button } from "@mantine/core";
+import { usePlans } from "@app/hooks/usePlans";
 
 interface TrialStatus {
   isTrialing: boolean;
@@ -12,8 +12,8 @@ interface TrialStatus {
 }
 
 export function ManageBillingButton({
-  returnUrl = typeof window !== 'undefined' ? window.location.href : '/',
-  children = 'Manage billing',
+  returnUrl = typeof window !== "undefined" ? window.location.href : "/",
+  children = "Manage billing",
   trialStatus,
 }: {
   returnUrl?: string;
@@ -25,7 +25,7 @@ export function ManageBillingButton({
   const { data } = usePlans();
 
   // Hide for free plan users
-  if (!data || data.currentPlan.id === 'free') {
+  if (!data || data.currentPlan.id === "free") {
     return null;
   }
 
@@ -38,16 +38,21 @@ export function ManageBillingButton({
     setLoading(true);
     setErr(null);
     try {
-      const { data, error } = await supabase.functions.invoke<{ url: string; error?: string }>('manage-billing', {
+      const { data, error } = await supabase.functions.invoke<{
+        url: string;
+        error?: string;
+      }>("manage-billing", {
         body: {
-        name: 'Functions',
-        return_url: returnUrl},
-      })
+          name: "Functions",
+          return_url: returnUrl,
+        },
+      });
       if (error) throw error;
-      if (!data || 'error' in data) throw new Error(data?.error ?? 'No portal URL');
+      if (!data || "error" in data)
+        throw new Error(data?.error ?? "No portal URL");
       window.location.href = data.url;
     } catch (e: unknown) {
-      setErr(e instanceof Error ? e.message : 'Could not open billing portal');
+      setErr(e instanceof Error ? e.message : "Could not open billing portal");
     } finally {
       setLoading(false);
     }
@@ -55,8 +60,12 @@ export function ManageBillingButton({
 
   return (
     <div>
-      <Button onClick={onClick} disabled={loading} className="px-4 py-2 rounded bg-black text-white">
-        {loading ? 'Opening…' : children}
+      <Button
+        onClick={onClick}
+        disabled={loading}
+        className="px-4 py-2 rounded bg-black text-white"
+      >
+        {loading ? "Opening…" : children}
       </Button>
       {err && <div className="mt-2 text-red-600">{err}</div>}
     </div>
diff --git a/frontend/src/saas/components/shared/PrivateContent.tsx b/frontend/src/saas/components/shared/PrivateContent.tsx
index e75a4d7ef5..5fb8fc0d66 100644
--- a/frontend/src/saas/components/shared/PrivateContent.tsx
+++ b/frontend/src/saas/components/shared/PrivateContent.tsx
@@ -1,4 +1,4 @@
-import React from 'react';
+import React from "react";
 
 interface PrivateContentProps extends React.HTMLAttributes<HTMLSpanElement> {
   children: React.ReactNode;
@@ -11,14 +11,14 @@ interface PrivateContentProps extends React.HTMLAttributes<HTMLSpanElement> {
  */
 export const PrivateContent: React.FC<PrivateContentProps> = ({
   children,
-  className = '',
+  className = "",
   style,
   ...props
 }) => {
-  const baseClass = 'ph-no-capture userback-block';
+  const baseClass = "ph-no-capture userback-block";
   const combinedClassName = className ? `${baseClass} ${className}` : baseClass;
   const combinedStyle = {
-    display: 'contents' as const,
+    display: "contents" as const,
     ...style,
   };
 
diff --git a/frontend/src/saas/components/shared/StripeCheckoutSaas.tsx b/frontend/src/saas/components/shared/StripeCheckoutSaas.tsx
index 27f1f1abc3..fffefc91dd 100644
--- a/frontend/src/saas/components/shared/StripeCheckoutSaas.tsx
+++ b/frontend/src/saas/components/shared/StripeCheckoutSaas.tsx
@@ -1,16 +1,19 @@
-import React, { useState, useEffect } from 'react';
-import { Modal, Button, Text, Alert, Loader, Stack } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { loadStripe } from '@stripe/stripe-js';
-import { EmbeddedCheckoutProvider, EmbeddedCheckout } from '@stripe/react-stripe-js';
-import { supabase } from '@app/auth/supabase';
-import { Z_INDEX_OVER_SETTINGS_MODAL } from '@app/styles/zIndex';
+import React, { useState, useEffect } from "react";
+import { Modal, Button, Text, Alert, Loader, Stack } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import { loadStripe } from "@stripe/stripe-js";
+import {
+  EmbeddedCheckoutProvider,
+  EmbeddedCheckout,
+} from "@stripe/react-stripe-js";
+import { supabase } from "@app/auth/supabase";
+import { Z_INDEX_OVER_SETTINGS_MODAL } from "@app/styles/zIndex";
 
 const stripePromise = loadStripe(import.meta.env.VITE_STRIPE_PUBLISHABLE_KEY);
 
-export type PurchaseType = 'subscription' | 'credits';
-export type CreditsPack = 'xsmall' | 'small' | 'medium' | 'large' | null;
-export type PlanID =  'pro' | null;
+export type PurchaseType = "subscription" | "credits";
+export type CreditsPack = "xsmall" | "small" | "medium" | "large" | null;
+export type PlanID = "pro" | null;
 
 interface StripeCheckoutProps {
   opened: boolean;
@@ -26,7 +29,12 @@ interface StripeCheckoutProps {
   // Proprietary-specific props (for compatibility)
   planGroup?: unknown;
   minimumSeats?: number;
-  onLicenseActivated?: (licenseInfo: {licenseType: string; enabled: boolean; maxUsers: number; hasKey: boolean}) => void;
+  onLicenseActivated?: (licenseInfo: {
+    licenseType: string;
+    enabled: boolean;
+    maxUsers: number;
+    hasKey: boolean;
+  }) => void;
   hostedCheckoutSuccess?: {
     isUpgrade: boolean;
     licenseKey?: string;
@@ -37,7 +45,7 @@ interface StripeCheckoutProps {
 }
 
 type CheckoutState = {
-  status: 'idle' | 'loading' | 'ready' | 'success' | 'error';
+  status: "idle" | "loading" | "ready" | "success" | "error";
   clientSecret?: string;
   error?: string;
   sessionParams?: {
@@ -56,71 +64,82 @@ const StripeCheckout: React.FC<StripeCheckoutProps> = ({
   planName,
   isTrialConversion,
   onSuccess,
-  onError
+  onError,
 }) => {
   const { t } = useTranslation();
-  const [state, setState] = useState<CheckoutState>({ status: 'idle' });
+  const [state, setState] = useState<CheckoutState>({ status: "idle" });
 
   const createCheckoutSession = async () => {
     try {
-      setState({ status: 'loading' });
+      setState({ status: "loading" });
 
-      const { data, error } = await supabase.functions.invoke('create-checkout', {
-        body: {
-          purchase_type: purchaseType,
-          ui_mode: 'embedded',
-          plan: planId,
-          credits_pack: creditsPack,
-          callback_base_url: window.location.origin,
-          trial_conversion: isTrialConversion || false
-        }
-      });
+      const { data, error } = await supabase.functions.invoke(
+        "create-checkout",
+        {
+          body: {
+            purchase_type: purchaseType,
+            ui_mode: "embedded",
+            plan: planId,
+            credits_pack: creditsPack,
+            callback_base_url: window.location.origin,
+            trial_conversion: isTrialConversion || false,
+          },
+        },
+      );
 
       if (error) {
-        throw new Error(error.message || 'Failed to create checkout session');
+        throw new Error(error.message || "Failed to create checkout session");
       }
 
       if (!data) {
-        throw new Error('No data received from server');
+        throw new Error("No data received from server");
       }
 
-      const jsonData = typeof data === 'string' ? JSON.parse(data) : data;
+      const jsonData = typeof data === "string" ? JSON.parse(data) : data;
 
       if (!jsonData?.clientSecret) {
-        throw new Error('No client secret received from server');
+        throw new Error("No client secret received from server");
       }
 
       setState({
-        status: 'ready',
+        status: "ready",
         clientSecret: jsonData.clientSecret,
         sessionParams: {
           purchaseType: purchaseType!,
           planId: planId!,
-          creditsPack: creditsPack!
-        }
+          creditsPack: creditsPack!,
+        },
       });
     } catch (err) {
-      const errorMessage = err instanceof Error ? err.message : 'Failed to create checkout session';
+      const errorMessage =
+        err instanceof Error
+          ? err.message
+          : "Failed to create checkout session";
       setState({
-        status: 'error',
-        error: errorMessage
+        status: "error",
+        error: errorMessage,
       });
       onError?.(errorMessage);
     }
   };
 
   const handlePaymentComplete = () => {
-    setState({ status: 'success' });
+    setState({ status: "success" });
 
     // Call success callback immediately - parent will handle timing
-    onSuccess?.('');
+    onSuccess?.("");
 
     // Note: Parent (Plan.tsx) now handles the delay and modal closing
   };
 
   const handleClose = () => {
     // Reset state to idle to clean up the session
-    setState({ status: 'idle', clientSecret: undefined, error: undefined, sessionParams: undefined });
+    setState({
+      status: "idle",
+      clientSecret: undefined,
+      error: undefined,
+      sessionParams: undefined,
+    });
     onClose();
   };
 
@@ -129,35 +148,44 @@ const StripeCheckout: React.FC<StripeCheckoutProps> = ({
     if (opened) {
       // Check if we need a new session (first time or parameters changed)
       const needsNewSession =
-        state.status === 'idle' ||
+        state.status === "idle" ||
         !state.sessionParams ||
         state.sessionParams.purchaseType !== purchaseType ||
         state.sessionParams.planId !== planId ||
         state.sessionParams.creditsPack !== creditsPack;
 
       if (needsNewSession) {
-        console.log('Creating new checkout session:', { purchaseType, planId, creditsPack });
+        console.log("Creating new checkout session:", {
+          purchaseType,
+          planId,
+          creditsPack,
+        });
         createCheckoutSession();
       }
     } else if (!opened) {
       // Clean up state when modal closes
-      setState({ status: 'idle', clientSecret: undefined, error: undefined, sessionParams: undefined });
+      setState({
+        status: "idle",
+        clientSecret: undefined,
+        error: undefined,
+        sessionParams: undefined,
+      });
     }
   }, [opened, purchaseType, planId, creditsPack]);
 
   const renderContent = () => {
     switch (state.status) {
-      case 'loading':
+      case "loading":
         return (
           <div className="flex flex-col items-center justify-center py-8">
             <Loader size="lg" />
             <Text size="sm" c="dimmed" mt="md">
-              {t('payment.preparing', 'Preparing your checkout...')}
+              {t("payment.preparing", "Preparing your checkout...")}
             </Text>
           </div>
         );
 
-      case 'ready':
+      case "ready":
         if (!state.clientSecret) return null;
 
         return (
@@ -166,34 +194,43 @@ const StripeCheckout: React.FC<StripeCheckoutProps> = ({
             stripe={stripePromise}
             options={{
               clientSecret: state.clientSecret,
-              onComplete: handlePaymentComplete
+              onComplete: handlePaymentComplete,
             }}
           >
             <EmbeddedCheckout />
           </EmbeddedCheckoutProvider>
         );
 
-      case 'success':
+      case "success":
         return (
-          <Alert color="green" title={t('payment.success', 'Payment Successful!')}>
+          <Alert
+            color="green"
+            title={t("payment.success", "Payment Successful!")}
+          >
             <Stack gap="md">
               <Text size="sm">
-                {t('payment.successMessage', 'Your plan has been upgraded successfully. You will receive a confirmation email shortly.')}
+                {t(
+                  "payment.successMessage",
+                  "Your plan has been upgraded successfully. You will receive a confirmation email shortly.",
+                )}
               </Text>
               <Text size="xs" c="dimmed">
-                {t('payment.autoClose', 'This window will close automatically...')}
+                {t(
+                  "payment.autoClose",
+                  "This window will close automatically...",
+                )}
               </Text>
             </Stack>
           </Alert>
         );
 
-      case 'error':
+      case "error":
         return (
-          <Alert color="red" title={t('payment.error', 'Payment Error')}>
+          <Alert color="red" title={t("payment.error", "Payment Error")}>
             <Stack gap="md">
               <Text size="sm">{state.error}</Text>
               <Button variant="outline" onClick={handleClose}>
-                {t('common.close', 'Close')}
+                {t("common.close", "Close")}
               </Button>
             </Stack>
           </Alert>
@@ -211,7 +248,7 @@ const StripeCheckout: React.FC<StripeCheckoutProps> = ({
       title={
         <div>
           <Text fw={600} size="lg">
-            {t('payment.upgradeTitle', 'Upgrade to {{planName}}', { planName })}
+            {t("payment.upgradeTitle", "Upgrade to {{planName}}", { planName })}
           </Text>
         </div>
       }
diff --git a/frontend/src/saas/components/shared/TrialExpiredModal.tsx b/frontend/src/saas/components/shared/TrialExpiredModal.tsx
index 578d321c73..4f80a696b1 100644
--- a/frontend/src/saas/components/shared/TrialExpiredModal.tsx
+++ b/frontend/src/saas/components/shared/TrialExpiredModal.tsx
@@ -1,9 +1,9 @@
-import { Modal, Stack, Button } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import DiamondOutlinedIcon from '@mui/icons-material/DiamondOutlined';
-import AnimatedSlideBackground from '@app/components/onboarding/slides/AnimatedSlideBackground';
-import styles from '@app/components/onboarding/InitialOnboardingModal/InitialOnboardingModal.module.css';
-import { Z_INDEX_OVER_FULLSCREEN_SURFACE } from '@app/styles/zIndex';
+import { Modal, Stack, Button } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import DiamondOutlinedIcon from "@mui/icons-material/DiamondOutlined";
+import AnimatedSlideBackground from "@app/components/onboarding/slides/AnimatedSlideBackground";
+import styles from "@app/components/onboarding/InitialOnboardingModal/InitialOnboardingModal.module.css";
+import { Z_INDEX_OVER_FULLSCREEN_SURFACE } from "@app/styles/zIndex";
 
 interface TrialExpiredModalProps {
   opened: boolean;
@@ -11,19 +11,29 @@ interface TrialExpiredModalProps {
   onSubscribe: () => void;
 }
 
-export function TrialExpiredModal({ opened, onClose, onSubscribe }: TrialExpiredModalProps) {
+export function TrialExpiredModal({
+  opened,
+  onClose,
+  onSubscribe,
+}: TrialExpiredModalProps) {
   const { t } = useTranslation();
 
   // Use CSS variables for theme colors
-  const amberColor = getComputedStyle(document.documentElement).getPropertyValue('--color-amber-500').trim() || '#f59e0b';
-  const redColor = getComputedStyle(document.documentElement).getPropertyValue('--color-red-500').trim() || '#ef4444';
+  const amberColor =
+    getComputedStyle(document.documentElement)
+      .getPropertyValue("--color-amber-500")
+      .trim() || "#f59e0b";
+  const redColor =
+    getComputedStyle(document.documentElement)
+      .getPropertyValue("--color-red-500")
+      .trim() || "#ef4444";
   const gradientStops: [string, string] = [amberColor, redColor];
 
   const circles = [
     {
-      position: 'bottom-left' as const,
+      position: "bottom-left" as const,
       size: 270, // 16.875rem
-      color: 'rgba(255, 255, 255, 0.25)',
+      color: "rgba(255, 255, 255, 0.25)",
       opacity: 0.9,
       amplitude: 24, // 1.5rem
       duration: 4.5,
@@ -31,9 +41,9 @@ export function TrialExpiredModal({ opened, onClose, onSubscribe }: TrialExpired
       offsetY: 14, // 0.875rem
     },
     {
-      position: 'top-right' as const,
+      position: "top-right" as const,
       size: 300, // 18.75rem
-      color: 'rgba(255, 255, 255, 0.2)',
+      color: "rgba(255, 255, 255, 0.2)",
       opacity: 0.9,
       amplitude: 28, // 1.75rem
       duration: 4.5,
@@ -57,16 +67,25 @@ export function TrialExpiredModal({ opened, onClose, onSubscribe }: TrialExpired
       styles={{
         body: { padding: 0 },
         content: {
-          overflow: 'hidden',
-          border: 'none',
-          background: 'var(--bg-surface)',
-          maxHeight: '90vh',
-          display: 'flex',
-          flexDirection: 'column',
+          overflow: "hidden",
+          border: "none",
+          background: "var(--bg-surface)",
+          maxHeight: "90vh",
+          display: "flex",
+          flexDirection: "column",
         },
       }}
     >
-      <Stack gap={0} className={styles.modalContent} style={{ height: '100%', maxHeight: '90vh', display: 'flex', flexDirection: 'column' }}>
+      <Stack
+        gap={0}
+        className={styles.modalContent}
+        style={{
+          height: "100%",
+          maxHeight: "90vh",
+          display: "flex",
+          flexDirection: "column",
+        }}
+      >
         <div className={styles.heroWrapper} style={{ flexShrink: 0 }}>
           <AnimatedSlideBackground
             gradientStops={gradientStops}
@@ -76,7 +95,7 @@ export function TrialExpiredModal({ opened, onClose, onSubscribe }: TrialExpired
           />
           <div className={styles.heroLogo}>
             <div className={styles.heroLogoCircle}>
-              <DiamondOutlinedIcon sx={{ fontSize: 64, color: '#000000' }} />
+              <DiamondOutlinedIcon sx={{ fontSize: 64, color: "#000000" }} />
             </div>
           </div>
         </div>
@@ -85,28 +104,31 @@ export function TrialExpiredModal({ opened, onClose, onSubscribe }: TrialExpired
           className={styles.modalBody}
           style={{
             flex: 1,
-            overflowY: 'auto',
-            overflowX: 'hidden',
-            WebkitOverflowScrolling: 'touch',
+            overflowY: "auto",
+            overflowX: "hidden",
+            WebkitOverflowScrolling: "touch",
           }}
         >
           <Stack gap={16}>
             <div className={`${styles.title} ${styles.titleText}`}>
-              {t('plan.trial.expired', 'Your Trial Has Ended')}
+              {t("plan.trial.expired", "Your Trial Has Ended")}
             </div>
 
             <div className={styles.bodyText}>
               <div className={`${styles.bodyCopy} ${styles.bodyCopyInner}`}>
                 {t(
-                  'plan.trial.expiredMessage',
-                  'Your 30-day Pro trial has expired. Subscribe to Pro to continue accessing premium features, or continue with our free tier.'
+                  "plan.trial.expiredMessage",
+                  "Your 30-day Pro trial has expired. Subscribe to Pro to continue accessing premium features, or continue with our free tier.",
                 )}
               </div>
             </div>
 
             <div className={styles.bodyText}>
               <div className={`${styles.bodyCopy} ${styles.bodyCopyInner}`}>
-                {t('plan.trial.freeTierLimitations', 'Free tier includes basic PDF tools with usage limits.')}
+                {t(
+                  "plan.trial.freeTierLimitations",
+                  "Free tier includes basic PDF tools with usage limits.",
+                )}
               </div>
             </div>
 
@@ -127,10 +149,10 @@ export function TrialExpiredModal({ opened, onClose, onSubscribe }: TrialExpired
               <div
                 className="trial-button-container"
                 style={{
-                  display: 'flex',
-                  flexWrap: 'wrap',
-                  gap: '0.75rem',
-                  justifyContent: 'space-between',
+                  display: "flex",
+                  flexWrap: "wrap",
+                  gap: "0.75rem",
+                  justifyContent: "space-between",
                 }}
               >
                 <Button
@@ -139,15 +161,15 @@ export function TrialExpiredModal({ opened, onClose, onSubscribe }: TrialExpired
                   size="sm"
                   className="trial-modal-button"
                   style={{
-                    fontSize: '0.8125rem',
-                    padding: '0.5rem 1rem',
-                    height: 'auto',
-                    minWidth: '8.125rem',
-                    flex: '0 1 auto',
-                    border: '0'
+                    fontSize: "0.8125rem",
+                    padding: "0.5rem 1rem",
+                    height: "auto",
+                    minWidth: "8.125rem",
+                    flex: "0 1 auto",
+                    border: "0",
                   }}
                 >
-                  {t('plan.trial.continueWithFree', 'Continue with Free')}
+                  {t("plan.trial.continueWithFree", "Continue with Free")}
                 </Button>
 
                 <Button
@@ -155,18 +177,19 @@ export function TrialExpiredModal({ opened, onClose, onSubscribe }: TrialExpired
                   size="md"
                   className="trial-modal-button trial-modal-button-primary"
                   style={{
-                    background: 'linear-gradient(135deg, var(--color-amber-500), var(--color-red-500))',
-                    color: '#FFFFFF',
-                    fontSize: '0.9375rem',
+                    background:
+                      "linear-gradient(135deg, var(--color-amber-500), var(--color-red-500))",
+                    color: "#FFFFFF",
+                    fontSize: "0.9375rem",
                     fontWeight: 600,
-                    padding: '0.75rem 1.5rem',
-                    height: 'auto',
-                    border: 'none',
-                    minWidth: '10.625rem',
-                    flex: '0 1 auto',
+                    padding: "0.75rem 1.5rem",
+                    height: "auto",
+                    border: "none",
+                    minWidth: "10.625rem",
+                    flex: "0 1 auto",
                   }}
                 >
-                  {t('plan.trial.subscribeToPro', 'Subscribe to Pro')}
+                  {t("plan.trial.subscribeToPro", "Subscribe to Pro")}
                 </Button>
               </div>
             </div>
diff --git a/frontend/src/saas/components/shared/TrialStatusBanner.tsx b/frontend/src/saas/components/shared/TrialStatusBanner.tsx
index cb0f1951d6..e6e7322ec2 100644
--- a/frontend/src/saas/components/shared/TrialStatusBanner.tsx
+++ b/frontend/src/saas/components/shared/TrialStatusBanner.tsx
@@ -1,19 +1,19 @@
-import { useEffect, useState, useCallback } from 'react';
-import { useBanner } from '@app/contexts/BannerContext';
-import { useAuth } from '@app/auth/UseSession';
-import { useTranslation } from 'react-i18next';
-import { InfoBanner } from '@app/components/shared/InfoBanner';
-import StripeCheckout from '@app/components/shared/StripeCheckoutSaas';
-import { BASE_PATH } from '@app/constants/app';
+import { useEffect, useState, useCallback } from "react";
+import { useBanner } from "@app/contexts/BannerContext";
+import { useAuth } from "@app/auth/UseSession";
+import { useTranslation } from "react-i18next";
+import { InfoBanner } from "@app/components/shared/InfoBanner";
+import StripeCheckout from "@app/components/shared/StripeCheckoutSaas";
+import { BASE_PATH } from "@app/constants/app";
 
-const SESSION_STORAGE_KEY = 'trialBannerDismissed';
+const SESSION_STORAGE_KEY = "trialBannerDismissed";
 
 export function TrialStatusBanner() {
   const { setBanner } = useBanner();
   const { t } = useTranslation();
   const { trialStatus } = useAuth();
   const [dismissed, setDismissed] = useState(() => {
-    return sessionStorage.getItem(SESSION_STORAGE_KEY) === 'true';
+    return sessionStorage.getItem(SESSION_STORAGE_KEY) === "true";
   });
   const [checkoutOpen, setCheckoutOpen] = useState(false);
 
@@ -28,7 +28,7 @@ export function TrialStatusBanner() {
     !dismissed;
 
   if (trialStatus?.hasPaymentMethod || trialStatus?.hasScheduledSub) {
-    console.log('Subscription scheduled - hiding trial banner');
+    console.log("Subscription scheduled - hiding trial banner");
   }
 
   const handleOpenCheckout = useCallback(() => {
@@ -37,7 +37,7 @@ export function TrialStatusBanner() {
 
   const handleDismiss = useCallback(() => {
     setDismissed(true);
-    sessionStorage.setItem(SESSION_STORAGE_KEY, 'true');
+    sessionStorage.setItem(SESSION_STORAGE_KEY, "true");
   }, []);
 
   useEffect(() => {
@@ -46,15 +46,18 @@ export function TrialStatusBanner() {
       return;
     }
 
-    const trialEndDate = new Date(trialStatus.trialEnd).toLocaleDateString('en-GB', {
-      month: 'short',
-      day: 'numeric'
-    });
+    const trialEndDate = new Date(trialStatus.trialEnd).toLocaleDateString(
+      "en-GB",
+      {
+        month: "short",
+        day: "numeric",
+      },
+    );
 
     const message = t(
-      'plan.trial.message',
-      `Your trial ends in ${trialStatus.daysRemaining} day${trialStatus.daysRemaining !== 1 ? 's' : ''} (${trialEndDate}). Subscribe to continue Pro access.`,
-      { days: trialStatus.daysRemaining, date: trialEndDate }
+      "plan.trial.message",
+      `Your trial ends in ${trialStatus.daysRemaining} day${trialStatus.daysRemaining !== 1 ? "s" : ""} (${trialEndDate}). Subscribe to continue Pro access.`,
+      { days: trialStatus.daysRemaining, date: trialEndDate },
     );
 
     const logoIcon = (
@@ -62,9 +65,9 @@ export function TrialStatusBanner() {
         src={`${BASE_PATH}/modern-logo/logo512.png`}
         alt="Stirling PDF"
         style={{
-          width: '1.5rem',
-          height: '1.5rem',
-          objectFit: 'contain'
+          width: "1.5rem",
+          height: "1.5rem",
+          objectFit: "contain",
         }}
       />
     );
@@ -74,7 +77,7 @@ export function TrialStatusBanner() {
         icon={logoIcon}
         tone="info"
         message={message}
-        buttonText={t('plan.trial.subscribe', 'Subscribe to Pro')}
+        buttonText={t("plan.trial.subscribe", "Subscribe to Pro")}
         buttonIcon="credit-card-rounded"
         onButtonClick={handleOpenCheckout}
         onDismiss={handleDismiss}
@@ -88,13 +91,20 @@ export function TrialStatusBanner() {
         buttonVariant="white"
         buttonTextColor="var(--mantine-color-dark-9)"
         closeIconColor="rgba(255, 255, 255, 0.7)"
-      />
+      />,
     );
 
     return () => {
       setBanner(null);
     };
-  }, [shouldShowBanner, trialStatus, setBanner, t, handleOpenCheckout, handleDismiss]);
+  }, [
+    shouldShowBanner,
+    trialStatus,
+    setBanner,
+    t,
+    handleOpenCheckout,
+    handleDismiss,
+  ]);
 
   const handleCheckoutSuccess = () => {
     // Refresh to hide banner and show updated plan
@@ -112,7 +122,7 @@ export function TrialStatusBanner() {
           creditsPack={null}
           planName="Pro"
           onSuccess={handleCheckoutSuccess}
-          onError={(error) => console.error('Checkout error:', error)}
+          onError={(error) => console.error("Checkout error:", error)}
           isTrialConversion={true}
         />
       )}
diff --git a/frontend/src/saas/components/shared/charts/StackedBarChart.tsx b/frontend/src/saas/components/shared/charts/StackedBarChart.tsx
index 207f01f184..126cd921d3 100644
--- a/frontend/src/saas/components/shared/charts/StackedBarChart.tsx
+++ b/frontend/src/saas/components/shared/charts/StackedBarChart.tsx
@@ -1,19 +1,29 @@
-import React, { useEffect, useMemo, useRef, useCallback, useId } from 'react';
-import { Group, Loader, Text } from '@mantine/core';
-import * as d3 from 'd3';
-import { StackedBarChartProps, TooltipData, FractionData } from '@app/types/charts';
-import { generateTooltipHTML } from '@app/components/shared/charts/stackedBarChart/StackedBarTooltip';
-import { detectTheme, getChartThemeVars } from '@app/components/shared/charts/utils/themeUtils';
-import { createTooltipPositioner } from '@app/components/shared/charts/utils/tooltipUtils';
-import { createRoundedRectPath, createScale } from '@app/components/shared/charts/utils/d3Utils';
+import React, { useEffect, useMemo, useRef, useCallback, useId } from "react";
+import { Group, Loader, Text } from "@mantine/core";
+import * as d3 from "d3";
+import {
+  StackedBarChartProps,
+  TooltipData,
+  FractionData,
+} from "@app/types/charts";
+import { generateTooltipHTML } from "@app/components/shared/charts/stackedBarChart/StackedBarTooltip";
+import {
+  detectTheme,
+  getChartThemeVars,
+} from "@app/components/shared/charts/utils/themeUtils";
+import { createTooltipPositioner } from "@app/components/shared/charts/utils/tooltipUtils";
+import {
+  createRoundedRectPath,
+  createScale,
+} from "@app/components/shared/charts/utils/d3Utils";
 
-export default function StackedBarChart({ 
-  fractions, 
-  width = 640, 
-  height = 22, 
+export default function StackedBarChart({
+  fractions,
+  width = 640,
+  height = 22,
   showLegend = true,
-  className = '',
-  tooltipPosition = 'top',
+  className = "",
+  tooltipPosition = "top",
   loading = false,
   animate = true,
   animationDurationMs = 900,
@@ -27,101 +37,116 @@ export default function StackedBarChart({
 
   // Memoize theme detection to avoid recalculation
   const theme = useMemo(() => detectTheme(), []);
-  const themeVars = useMemo(() => getChartThemeVars(theme.isDark), [theme.isDark]);
+  const themeVars = useMemo(
+    () => getChartThemeVars(theme.isDark),
+    [theme.isDark],
+  );
 
   // Memoize tooltip positioner
-  const tooltipPositioner = useMemo(() => createTooltipPositioner(tooltipPosition), [tooltipPosition]);
+  const tooltipPositioner = useMemo(
+    () => createTooltipPositioner(tooltipPosition),
+    [tooltipPosition],
+  );
 
-  const positionTooltip = useCallback((event: MouseEvent) => {
-    const tooltip = tooltipRef.current;
-    if (!tooltip) return;
-    tooltipPositioner.positionTooltip(event, tooltip, containerRef.current!);
-  }, [tooltipPositioner]);
+  const positionTooltip = useCallback(
+    (event: MouseEvent) => {
+      const tooltip = tooltipRef.current;
+      if (!tooltip) return;
+      tooltipPositioner.positionTooltip(event, tooltip, containerRef.current!);
+    },
+    [tooltipPositioner],
+  );
 
-  const setTooltipContent = useCallback((labelHtml: string) => {
-    const tooltip = tooltipRef.current;
-    if (!tooltip) return;
-    tooltip.innerHTML = labelHtml;
-    tooltip.style.background = themeVars.background;
-    tooltip.style.color = themeVars.textPrimary;
-    tooltip.style.border = themeVars.border;
-    tooltip.style.boxShadow = themeVars.boxShadow;
-    tooltip.style.padding = '8px 10px';
-    tooltip.style.fontSize = '12px';
-    tooltip.style.lineHeight = '1.25';
-    tooltip.style.borderRadius = '8px';
-  }, [themeVars]);
+  const setTooltipContent = useCallback(
+    (labelHtml: string) => {
+      const tooltip = tooltipRef.current;
+      if (!tooltip) return;
+      tooltip.innerHTML = labelHtml;
+      tooltip.style.background = themeVars.background;
+      tooltip.style.color = themeVars.textPrimary;
+      tooltip.style.border = themeVars.border;
+      tooltip.style.boxShadow = themeVars.boxShadow;
+      tooltip.style.padding = "8px 10px";
+      tooltip.style.fontSize = "12px";
+      tooltip.style.lineHeight = "1.25";
+      tooltip.style.borderRadius = "8px";
+    },
+    [themeVars],
+  );
 
   const hideTooltip = useCallback(() => {
     const tooltip = tooltipRef.current;
     if (!tooltip) return;
-    tooltip.style.opacity = '0';
+    tooltip.style.opacity = "0";
   }, []);
 
   useEffect(() => {
     const container = containerRef.current;
     if (!container) return;
-    container.innerHTML = '';
+    container.innerHTML = "";
 
     // Calculate total capacity (sum of all denominators)
-    const totalCapacity = fractions.reduce((sum: number, fraction: FractionData) => sum + fraction.denominator, 0);
-    
+    const totalCapacity = fractions.reduce(
+      (sum: number, fraction: FractionData) => sum + fraction.denominator,
+      0,
+    );
+
     if (totalCapacity === 0 && !loading) return;
 
     // Create data for the bar segments
     const data = fractions.map((fraction: FractionData) => ({
       ...fraction,
       value: fraction.numerator,
-      remaining: fraction.denominator - fraction.numerator
+      remaining: fraction.denominator - fraction.numerator,
     }));
 
     const radius = 8;
 
     const svg = d3
       .select(container)
-      .append('svg')
-      .attr('width', '100%')
-      .attr('height', height)
-      .attr('viewBox', `0 0 ${width} ${height}`)
-      .attr('role', ariaLabel ? 'img' : null)
-      .attr('aria-label', ariaLabel || null);
+      .append("svg")
+      .attr("width", "100%")
+      .attr("height", height)
+      .attr("viewBox", `0 0 ${width} ${height}`)
+      .attr("role", ariaLabel ? "img" : null)
+      .attr("aria-label", ariaLabel || null);
 
     const x = createScale([0, totalCapacity], [0, width]);
     let cursor = 0;
-    const g = svg.append('g');
+    const g = svg.append("g");
 
     // Skip drawing the bar visuals entirely when loading to avoid gray bar under spinner
     if (!loading) {
       // Create a single rounded rectangle for the entire bar background
       const totalBarWidth = x(totalCapacity);
-      g.append('rect')
-        .attr('x', 0)
-        .attr('y', 0)
-        .attr('width', totalBarWidth)
-        .attr('height', height)
-        .attr('rx', radius)
-        .attr('ry', radius)
-        .attr('fill', themeVars.inactive)
-        .attr('stroke', themeVars.cardBorder);
+      g.append("rect")
+        .attr("x", 0)
+        .attr("y", 0)
+        .attr("width", totalBarWidth)
+        .attr("height", height)
+        .attr("rx", radius)
+        .attr("ry", radius)
+        .attr("fill", themeVars.inactive)
+        .attr("stroke", themeVars.cardBorder);
 
       // Define a clipPath that will reveal the used portion from left to right
-      const defs = svg.append('defs');
+      const defs = svg.append("defs");
       const clipRect = defs
-        .append('clipPath')
-        .attr('id', clipId)
-        .append('rect')
-        .attr('x', 0)
-        .attr('y', 0)
-        .attr('width', 0)
-        .attr('height', height)
-        .attr('rx', radius)
-        .attr('ry', radius);
+        .append("clipPath")
+        .attr("id", clipId)
+        .append("rect")
+        .attr("x", 0)
+        .attr("y", 0)
+        .attr("width", 0)
+        .attr("height", height)
+        .attr("rx", radius)
+        .attr("ry", radius);
 
       // Group to hold the used segments and apply clip-path
-      const usedGroup = svg.append('g').attr('clip-path', `url(#${clipId})`);
+      const usedGroup = svg.append("g").attr("clip-path", `url(#${clipId})`);
 
       // Render used segments on top of the background
-      data.forEach((fraction: typeof data[number], index: number) => {
+      data.forEach((fraction: (typeof data)[number], index: number) => {
         if (fraction.value <= 0) return;
 
         const segWidth = x(fraction.value);
@@ -133,131 +158,178 @@ export default function StackedBarChart({
 
         if (isFirst && isLast) {
           // Single segment: fully rounded
-          usedGroup.append('rect')
-            .attr('x', xPos)
-            .attr('y', 0)
-            .attr('width', segWidth)
-            .attr('height', height)
-            .attr('rx', radius)
-            .attr('ry', radius)
-            .attr('fill', fraction.color);
+          usedGroup
+            .append("rect")
+            .attr("x", xPos)
+            .attr("y", 0)
+            .attr("width", segWidth)
+            .attr("height", height)
+            .attr("rx", radius)
+            .attr("ry", radius)
+            .attr("fill", fraction.color);
         } else if (isFirst) {
           // First segment: rounded on left side only
-          const path = createRoundedRectPath(xPos, 0, segWidth, height, radius, {
-            topLeft: true,
-            topRight: false,
-            bottomLeft: true,
-            bottomRight: false
-          });
-          usedGroup.append('path')
-            .attr('d', path)
-            .attr('fill', fraction.color);
+          const path = createRoundedRectPath(
+            xPos,
+            0,
+            segWidth,
+            height,
+            radius,
+            {
+              topLeft: true,
+              topRight: false,
+              bottomLeft: true,
+              bottomRight: false,
+            },
+          );
+          usedGroup.append("path").attr("d", path).attr("fill", fraction.color);
         } else if (isLast) {
           // Last segment: rounded on right side only
-          const path = createRoundedRectPath(xPos, 0, segWidth, height, radius, {
-            topLeft: false,
-            topRight: true,
-            bottomLeft: false,
-            bottomRight: true
-          });
-          usedGroup.append('path')
-            .attr('d', path)
-            .attr('fill', fraction.color);
+          const path = createRoundedRectPath(
+            xPos,
+            0,
+            segWidth,
+            height,
+            radius,
+            {
+              topLeft: false,
+              topRight: true,
+              bottomLeft: false,
+              bottomRight: true,
+            },
+          );
+          usedGroup.append("path").attr("d", path).attr("fill", fraction.color);
         } else {
           // Middle segments: no rounded edges
-          usedGroup.append('rect')
-            .attr('x', xPos)
-            .attr('y', 0)
-            .attr('width', segWidth)
-            .attr('height', height)
-            .attr('fill', fraction.color);
+          usedGroup
+            .append("rect")
+            .attr("x", xPos)
+            .attr("y", 0)
+            .attr("width", segWidth)
+            .attr("height", height)
+            .attr("fill", fraction.color);
         }
       });
 
       // Add a transparent overlay for hover events on the entire bar (outside clip path)
-      svg.append('rect')
-        .attr('x', 0)
-        .attr('y', 0)
-        .attr('width', totalBarWidth)
-        .attr('height', height)
-        .attr('rx', radius)
-        .attr('ry', radius)
-        .attr('fill', 'transparent')
-        .style('pointer-events', 'all')
-        .on('mouseenter', (event: MouseEvent) => {
-          const tooltipData: TooltipData = { fractions: data, isDark: theme.isDark };
+      svg
+        .append("rect")
+        .attr("x", 0)
+        .attr("y", 0)
+        .attr("width", totalBarWidth)
+        .attr("height", height)
+        .attr("rx", radius)
+        .attr("ry", radius)
+        .attr("fill", "transparent")
+        .style("pointer-events", "all")
+        .on("mouseenter", (event: MouseEvent) => {
+          const tooltipData: TooltipData = {
+            fractions: data,
+            isDark: theme.isDark,
+          };
           const html = generateTooltipHTML(tooltipData);
           setTooltipContent(html);
           const tooltip = tooltipRef.current;
-          if (tooltip) tooltip.style.opacity = '1';
+          if (tooltip) tooltip.style.opacity = "1";
           positionTooltip(event as unknown as MouseEvent);
         })
-        .on('mousemove', (event: MouseEvent) => positionTooltip(event as unknown as MouseEvent))
-        .on('mouseleave', hideTooltip);
+        .on("mousemove", (event: MouseEvent) =>
+          positionTooltip(event as unknown as MouseEvent),
+        )
+        .on("mouseleave", hideTooltip);
 
       // Animate reveal of used segments (only on first load, not on re-renders)
-      const totalUsed = data.reduce((sum: number, f: typeof data[number]) => sum + f.value, 0);
+      const totalUsed = data.reduce(
+        (sum: number, f: (typeof data)[number]) => sum + f.value,
+        0,
+      );
       const revealTo = x(totalUsed);
       if (animate && !hasAnimatedRef.current) {
-        clipRect.transition().duration(animationDurationMs).attr('width', revealTo);
+        clipRect
+          .transition()
+          .duration(animationDurationMs)
+          .attr("width", revealTo);
         hasAnimatedRef.current = true;
       } else {
-        clipRect.attr('width', revealTo);
+        clipRect.attr("width", revealTo);
       }
     }
 
-    return () => { container.innerHTML = ''; };
-  }, [fractions, width, height, tooltipPosition, loading, animate, animationDurationMs, clipId, themeVars, setTooltipContent, hideTooltip, positionTooltip]);
+    return () => {
+      container.innerHTML = "";
+    };
+  }, [
+    fractions,
+    width,
+    height,
+    tooltipPosition,
+    loading,
+    animate,
+    animationDurationMs,
+    clipId,
+    themeVars,
+    setTooltipContent,
+    hideTooltip,
+    positionTooltip,
+  ]);
 
   return (
     <div className={className}>
-      <div style={{ position: 'relative' }}>
+      <div style={{ position: "relative" }}>
         <div ref={containerRef} />
         <div
           ref={tooltipRef}
-          style={{ 
-            position: 'absolute', 
-            left: 0, 
-            top: 0, 
-            pointerEvents: 'none', 
-            opacity: 0, 
-            transition: 'opacity 120ms ease',
-            zIndex: 1000
+          style={{
+            position: "absolute",
+            left: 0,
+            top: 0,
+            pointerEvents: "none",
+            opacity: 0,
+            transition: "opacity 120ms ease",
+            zIndex: 1000,
           }}
         />
         {loading && (
-          <div style={{ position: 'absolute', inset: 0, display: 'flex', alignItems: 'center', justifyContent: 'center' }}>
+          <div
+            style={{
+              position: "absolute",
+              inset: 0,
+              display: "flex",
+              alignItems: "center",
+              justifyContent: "center",
+            }}
+          >
             <Loader size="sm" color="blue" />
           </div>
         )}
       </div>
-      
+
       {showLegend && (
         <Group gap="lg" mt="sm">
           {fractions.map((fraction: FractionData, index: number) => (
             <Group key={index} gap={6}>
-              <span 
-                style={{ 
-                  width: 10, 
-                  height: 10, 
-                  background: fraction.color, 
-                  display: 'inline-block', 
-                  borderRadius: 2 
-                }} 
+              <span
+                style={{
+                  width: 10,
+                  height: 10,
+                  background: fraction.color,
+                  display: "inline-block",
+                  borderRadius: 2,
+                }}
               />
               <Text size="sm">{fraction.name}</Text>
             </Group>
           ))}
           <Group gap={6}>
-            <span 
-              style={{ 
-                width: 10, 
-                height: 10, 
-                background: themeVars.inactive, 
-                display: 'inline-block', 
-                borderRadius: 2, 
-                outline: `1px solid ${themeVars.cardBorder}` 
-              }} 
+            <span
+              style={{
+                width: 10,
+                height: 10,
+                background: themeVars.inactive,
+                display: "inline-block",
+                borderRadius: 2,
+                outline: `1px solid ${themeVars.cardBorder}`,
+              }}
             />
             <Text size="sm">Remaining</Text>
           </Group>
diff --git a/frontend/src/saas/components/shared/charts/stackedBarChart/StackedBarTooltip.tsx b/frontend/src/saas/components/shared/charts/stackedBarChart/StackedBarTooltip.tsx
index 4f4ada2ce4..4ba6dc30e3 100644
--- a/frontend/src/saas/components/shared/charts/stackedBarChart/StackedBarTooltip.tsx
+++ b/frontend/src/saas/components/shared/charts/stackedBarChart/StackedBarTooltip.tsx
@@ -1,5 +1,5 @@
-import React from 'react';
-import { TooltipData } from '@app/types/charts';
+import React from "react";
+import { TooltipData } from "@app/types/charts";
 
 interface StackedBarTooltipProps {
   data: TooltipData;
@@ -9,18 +9,31 @@ export default function StackedBarTooltip({ data }: StackedBarTooltipProps) {
   const { fractions } = data;
 
   return (
-    <div style={{ display: 'flex', flexDirection: 'column', gap: '6px', whiteSpace: 'nowrap' }}>
+    <div
+      style={{
+        display: "flex",
+        flexDirection: "column",
+        gap: "6px",
+        whiteSpace: "nowrap",
+      }}
+    >
       {fractions.map((f, index) => (
-        <div key={index} style={{ display: 'flex', gap: '8px', alignItems: 'center' }}>
-          <span style={{ 
-            display: 'inline-block', 
-            width: '10px', 
-            height: '10px', 
-            background: f.color, 
-            borderRadius: '2px' 
-          }}></span>
+        <div
+          key={index}
+          style={{ display: "flex", gap: "8px", alignItems: "center" }}
+        >
+          <span
+            style={{
+              display: "inline-block",
+              width: "10px",
+              height: "10px",
+              background: f.color,
+              borderRadius: "2px",
+            }}
+          ></span>
           <span>
-            <strong>{f.name}</strong> — {f.numeratorLabel}: {f.numerator} · {f.denominatorLabel}: {f.denominator - f.numerator}
+            <strong>{f.name}</strong> — {f.numeratorLabel}: {f.numerator} ·{" "}
+            {f.denominatorLabel}: {f.denominator - f.numerator}
           </span>
         </div>
       ))}
@@ -30,14 +43,18 @@ export default function StackedBarTooltip({ data }: StackedBarTooltipProps) {
 
 export function generateTooltipHTML(data: TooltipData): string {
   const { fractions } = data;
-  
+
   return `
     <div style="display:flex;flex-direction:column;gap:6px;white-space:nowrap;">
-      ${fractions.map(f => `
+      ${fractions
+        .map(
+          (f) => `
         <div style="display:flex;gap:8px;align-items:center;">
           <span style="display:inline-block;width:10px;height:10px;background:${f.color};border-radius:2px"></span>
           <span><strong>${f.name}</strong> — ${f.numeratorLabel}: ${f.numerator} · ${f.denominatorLabel}: ${Math.max(0, f.denominator - f.numerator)}</span>
         </div>
-      `).join('')}
+      `,
+        )
+        .join("")}
     </div>`;
 }
diff --git a/frontend/src/saas/components/shared/charts/utils/d3Utils.ts b/frontend/src/saas/components/shared/charts/utils/d3Utils.ts
index ddeed92197..aaf1cb02d5 100644
--- a/frontend/src/saas/components/shared/charts/utils/d3Utils.ts
+++ b/frontend/src/saas/components/shared/charts/utils/d3Utils.ts
@@ -2,7 +2,7 @@
  * Reusable D3 utility functions for chart creation
  */
 
-import * as d3 from 'd3';
+import * as d3 from "d3";
 
 export interface ChartDimensions {
   width: number;
@@ -28,17 +28,17 @@ export interface AnimationConfig {
  * @returns The created SVG selection
  */
 export function createSVG(
-  container: HTMLElement, 
+  container: HTMLElement,
   dimensions: ChartDimensions,
-  className?: string
+  className?: string,
 ): d3.Selection<SVGSVGElement, unknown, null, undefined> {
   const svg = d3
     .select(container)
-    .append('svg')
-    .attr('width', '100%')
-    .attr('height', dimensions.height)
-    .attr('viewBox', `0 0 ${dimensions.width} ${dimensions.height}`)
-    .attr('class', className || '');
+    .append("svg")
+    .attr("width", "100%")
+    .attr("height", dimensions.height)
+    .attr("viewBox", `0 0 ${dimensions.width} ${dimensions.height}`)
+    .attr("class", className || "");
 
   return svg;
 }
@@ -53,17 +53,17 @@ export function createSVG(
 export function createClipPath(
   svg: d3.Selection<SVGSVGElement, unknown, null, undefined>,
   clipId: string,
-  dimensions: ChartDimensions
+  dimensions: ChartDimensions,
 ): d3.Selection<SVGRectElement, unknown, null, undefined> {
-  const defs = svg.append('defs');
+  const defs = svg.append("defs");
   const clipRect = defs
-    .append('clipPath')
-    .attr('id', clipId)
-    .append('rect')
-    .attr('x', 0)
-    .attr('y', 0)
-    .attr('width', 0)
-    .attr('height', dimensions.height);
+    .append("clipPath")
+    .attr("id", clipId)
+    .append("rect")
+    .attr("x", 0)
+    .attr("y", 0)
+    .attr("width", 0)
+    .attr("height", dimensions.height);
 
   return clipRect;
 }
@@ -77,13 +77,13 @@ export function createClipPath(
 export function animateClipReveal(
   clipRect: d3.Selection<SVGRectElement, unknown, null, undefined>,
   targetWidth: number,
-  config: AnimationConfig
+  config: AnimationConfig,
 ): void {
   clipRect
     .transition()
     .duration(config.duration)
     .ease(config.easing || d3.easeCubicInOut)
-    .attr('width', targetWidth);
+    .attr("width", targetWidth);
 }
 
 /**
@@ -102,48 +102,58 @@ export function createRoundedRectPath(
   width: number,
   height: number,
   radius: number,
-  corners: { topLeft?: boolean; topRight?: boolean; bottomLeft?: boolean; bottomRight?: boolean } = {}
+  corners: {
+    topLeft?: boolean;
+    topRight?: boolean;
+    bottomLeft?: boolean;
+    bottomRight?: boolean;
+  } = {},
 ): string {
-  const { topLeft = true, topRight = true, bottomLeft = true, bottomRight = true } = corners;
-  
-  if (width <= 0 || height <= 0) return '';
-  
+  const {
+    topLeft = true,
+    topRight = true,
+    bottomLeft = true,
+    bottomRight = true,
+  } = corners;
+
+  if (width <= 0 || height <= 0) return "";
+
   const topLeftRadius = topLeft ? radius : 0;
   const topRightRadius = topRight ? radius : 0;
   const bottomRightRadius = bottomRight ? radius : 0;
   const bottomLeftRadius = bottomLeft ? radius : 0;
-  
+
   let path = `M ${x + topLeftRadius} ${y}`;
-  
+
   if (topRight) {
     path += ` L ${x + width - topRightRadius} ${y}`;
     path += ` A ${topRightRadius} ${topRightRadius} 0 0 1 ${x + width} ${y + topRightRadius}`;
   } else {
     path += ` L ${x + width} ${y}`;
   }
-  
+
   if (bottomRight) {
     path += ` L ${x + width} ${y + height - bottomRightRadius}`;
     path += ` A ${bottomRightRadius} ${bottomRightRadius} 0 0 1 ${x + width - bottomRightRadius} ${y + height}`;
   } else {
     path += ` L ${x + width} ${y + height}`;
   }
-  
+
   if (bottomLeft) {
     path += ` L ${x + bottomLeftRadius} ${y + height}`;
     path += ` A ${bottomLeftRadius} ${bottomLeftRadius} 0 0 1 ${x} ${y + height - bottomLeftRadius}`;
   } else {
     path += ` L ${x} ${y + height}`;
   }
-  
+
   if (topLeft) {
     path += ` L ${x} ${y + topLeftRadius}`;
     path += ` A ${topLeftRadius} ${topLeftRadius} 0 0 1 ${x + topLeftRadius} ${y}`;
   } else {
     path += ` L ${x} ${y}`;
   }
-  
-  return path + ' Z';
+
+  return path + " Z";
 }
 
 /**
@@ -164,7 +174,7 @@ export function createScale(domain: [number, number], range: [number, number]) {
  */
 export function debounce<T extends (...args: unknown[]) => unknown>(
   func: T,
-  wait: number
+  wait: number,
 ): (...args: Parameters<T>) => void {
   let timeout: NodeJS.Timeout;
   return (...args: Parameters<T>) => {
diff --git a/frontend/src/saas/components/shared/charts/utils/themeUtils.ts b/frontend/src/saas/components/shared/charts/utils/themeUtils.ts
index 581185ef19..8034edec26 100644
--- a/frontend/src/saas/components/shared/charts/utils/themeUtils.ts
+++ b/frontend/src/saas/components/shared/charts/utils/themeUtils.ts
@@ -13,18 +13,20 @@ export interface ThemeInfo {
  * @returns ThemeInfo object with theme detection results
  */
 export function detectTheme(): ThemeInfo {
-  const rootEl = typeof document !== 'undefined' ? document.documentElement : null;
-  const schemeAttr = rootEl?.getAttribute('data-mantine-color-scheme');
-  const prefersDark = typeof window !== 'undefined' && 
-    window.matchMedia && 
-    window.matchMedia('(prefers-color-scheme: dark)').matches;
-  
-  const isDark = schemeAttr ? schemeAttr === 'dark' : prefersDark;
-  
+  const rootEl =
+    typeof document !== "undefined" ? document.documentElement : null;
+  const schemeAttr = rootEl?.getAttribute("data-mantine-color-scheme");
+  const prefersDark =
+    typeof window !== "undefined" &&
+    window.matchMedia &&
+    window.matchMedia("(prefers-color-scheme: dark)").matches;
+
+  const isDark = schemeAttr ? schemeAttr === "dark" : prefersDark;
+
   return {
     isDark,
     schemeAttr,
-    prefersDark
+    prefersDark,
   };
 }
 
@@ -35,12 +37,12 @@ export function detectTheme(): ThemeInfo {
  */
 export function getChartThemeVars(isDark: boolean) {
   return {
-    background: 'var(--bg-surface)',
-    textPrimary: 'var(--text-primary)',
-    border: isDark ? '1px solid var(--border-subtle)' : '1px solid transparent',
-    boxShadow: isDark ? 'none' : 'var(--shadow-md)',
-    inactive: 'var(--usage-inactive)',
-    cardBorder: 'var(--api-keys-card-border)'
+    background: "var(--bg-surface)",
+    textPrimary: "var(--text-primary)",
+    border: isDark ? "1px solid var(--border-subtle)" : "1px solid transparent",
+    boxShadow: isDark ? "none" : "var(--shadow-md)",
+    inactive: "var(--usage-inactive)",
+    cardBorder: "var(--api-keys-card-border)",
   };
 }
 
@@ -49,15 +51,18 @@ export function getChartThemeVars(isDark: boolean) {
  * @param tooltipElement The tooltip DOM element
  * @param isDark Whether the theme is dark
  */
-export function applyTooltipStyles(tooltipElement: HTMLElement, isDark: boolean) {
+export function applyTooltipStyles(
+  tooltipElement: HTMLElement,
+  isDark: boolean,
+) {
   const themeVars = getChartThemeVars(isDark);
-  
+
   tooltipElement.style.background = themeVars.background;
   tooltipElement.style.color = themeVars.textPrimary;
   tooltipElement.style.border = themeVars.border;
   tooltipElement.style.boxShadow = themeVars.boxShadow;
-  tooltipElement.style.padding = '8px 10px';
-  tooltipElement.style.fontSize = '12px';
-  tooltipElement.style.lineHeight = '1.25';
-  tooltipElement.style.borderRadius = '8px';
+  tooltipElement.style.padding = "8px 10px";
+  tooltipElement.style.fontSize = "12px";
+  tooltipElement.style.lineHeight = "1.25";
+  tooltipElement.style.borderRadius = "8px";
 }
diff --git a/frontend/src/saas/components/shared/charts/utils/tooltipUtils.ts b/frontend/src/saas/components/shared/charts/utils/tooltipUtils.ts
index d50f376ca2..127a8e18d9 100644
--- a/frontend/src/saas/components/shared/charts/utils/tooltipUtils.ts
+++ b/frontend/src/saas/components/shared/charts/utils/tooltipUtils.ts
@@ -2,10 +2,14 @@
  * Utility functions for tooltip positioning and management in D3 charts
  */
 
-export type TooltipPosition = 'top' | 'bottom' | 'left' | 'right';
+export type TooltipPosition = "top" | "bottom" | "left" | "right";
 
 export interface TooltipPositioner {
-  positionTooltip: (event: MouseEvent, tooltip: HTMLElement, container: HTMLElement) => void;
+  positionTooltip: (
+    event: MouseEvent,
+    tooltip: HTMLElement,
+    container: HTMLElement,
+  ) => void;
   hideTooltip: (tooltip: HTMLElement) => void;
 }
 
@@ -14,41 +18,46 @@ export interface TooltipPositioner {
  * @param position The tooltip position preference
  * @returns TooltipPositioner object with positioning functions
  */
-export function createTooltipPositioner(position: TooltipPosition): TooltipPositioner {
-  const positionTooltip = (event: MouseEvent, tooltip: HTMLElement, container: HTMLElement) => {
+export function createTooltipPositioner(
+  position: TooltipPosition,
+): TooltipPositioner {
+  const positionTooltip = (
+    event: MouseEvent,
+    tooltip: HTMLElement,
+    container: HTMLElement,
+  ) => {
     const bounds = container.getBoundingClientRect();
     const offsetX = event.clientX - bounds.left;
     const offsetY = event.clientY - bounds.top;
-    
+
     // Get tooltip dimensions after content is set
     const tooltipHeight = tooltip.offsetHeight;
     const tooltipWidth = tooltip.offsetWidth;
     const gap = 16; // 1rem gap
-    
+
     // Position tooltip based on the specified position
     switch (position) {
-      case 'top':
+      case "top":
         tooltip.style.left = `${Math.min(bounds.width - tooltipWidth - 10, Math.max(10, offsetX - tooltipWidth / 2))}px`;
         tooltip.style.top = `${offsetY - tooltipHeight - gap}px`;
         break;
-      case 'bottom':
+      case "bottom":
         tooltip.style.left = `${Math.min(bounds.width - tooltipWidth - 10, Math.max(10, offsetX - tooltipWidth / 2))}px`;
         tooltip.style.top = `${offsetY + gap}px`;
         break;
-      case 'left':
+      case "left":
         tooltip.style.left = `${Math.max(10, offsetX - tooltipWidth - gap)}px`;
         tooltip.style.top = `${offsetY - tooltipHeight / 2}px`;
         break;
-      case 'right':
+      case "right":
         tooltip.style.left = `${Math.min(bounds.width - tooltipWidth - 10, offsetX + gap)}px`;
         tooltip.style.top = `${offsetY - tooltipHeight / 2}px`;
         break;
     }
-    
   };
 
   const hideTooltip = (tooltip: HTMLElement) => {
-    tooltip.style.opacity = '0';
+    tooltip.style.opacity = "0";
   };
 
   return { positionTooltip, hideTooltip };
@@ -60,15 +69,15 @@ export function createTooltipPositioner(position: TooltipPosition): TooltipPosit
  * @returns The created tooltip element
  */
 export function createTooltipElement(container: HTMLElement): HTMLElement {
-  const tooltip = document.createElement('div');
-  tooltip.style.position = 'absolute';
-  tooltip.style.left = '0';
-  tooltip.style.top = '0';
-  tooltip.style.pointerEvents = 'none';
-  tooltip.style.opacity = '0';
-  tooltip.style.transition = 'opacity 120ms ease';
-  tooltip.style.zIndex = '1000';
-  
+  const tooltip = document.createElement("div");
+  tooltip.style.position = "absolute";
+  tooltip.style.left = "0";
+  tooltip.style.top = "0";
+  tooltip.style.pointerEvents = "none";
+  tooltip.style.opacity = "0";
+  tooltip.style.transition = "opacity 120ms ease";
+  tooltip.style.zIndex = "1000";
+
   container.appendChild(tooltip);
   return tooltip;
 }
diff --git a/frontend/src/saas/components/shared/config/ProfilePictureCropper.tsx b/frontend/src/saas/components/shared/config/ProfilePictureCropper.tsx
index 1fbbd461b0..0148da621b 100644
--- a/frontend/src/saas/components/shared/config/ProfilePictureCropper.tsx
+++ b/frontend/src/saas/components/shared/config/ProfilePictureCropper.tsx
@@ -1,9 +1,9 @@
-import React, { useState, useCallback, useEffect } from 'react';
-import { Modal, Button, Stack, Slider, Alert, Text, Box } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import Cropper from 'react-easy-crop';
-import { getCroppedImage, type Area } from '@app/utils/cropImage';
-import { Z_INDEX_OVER_CONFIG_MODAL } from '@app/styles/zIndex';
+import React, { useState, useCallback, useEffect } from "react";
+import { Modal, Button, Stack, Slider, Alert, Text, Box } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import Cropper from "react-easy-crop";
+import { getCroppedImage, type Area } from "@app/utils/cropImage";
+import { Z_INDEX_OVER_CONFIG_MODAL } from "@app/styles/zIndex";
 
 interface ProfilePictureCropperProps {
   file: File | null;
@@ -41,7 +41,12 @@ export const ProfilePictureCropper: React.FC<ProfilePictureCropperProps> = ({
       setError(null);
     };
     reader.onerror = () => {
-      setError(t('config.account.profilePicture.cropper.invalidImage', 'Invalid image file. Please select a valid PNG, JPG, or WebP file.'));
+      setError(
+        t(
+          "config.account.profilePicture.cropper.invalidImage",
+          "Invalid image file. Please select a valid PNG, JPG, or WebP file.",
+        ),
+      );
     };
     reader.readAsDataURL(file);
 
@@ -79,7 +84,7 @@ export const ProfilePictureCropper: React.FC<ProfilePictureCropperProps> = ({
     (_croppedArea: Area, croppedAreaPixels: Area) => {
       setCroppedAreaPixels(croppedAreaPixels);
     },
-    []
+    [],
   );
 
   // Process and save the cropped image
@@ -100,9 +105,9 @@ export const ProfilePictureCropper: React.FC<ProfilePictureCropperProps> = ({
       if (croppedBlob.size > maxSize) {
         setError(
           t(
-            'config.account.profilePicture.cropper.sizeErrorAfterCrop',
-            'Cropped image is too large. Please zoom out or crop a smaller area.'
-          )
+            "config.account.profilePicture.cropper.sizeErrorAfterCrop",
+            "Cropped image is too large. Please zoom out or crop a smaller area.",
+          ),
         );
         setProcessing(false);
         return;
@@ -112,12 +117,12 @@ export const ProfilePictureCropper: React.FC<ProfilePictureCropperProps> = ({
       onCropComplete(croppedBlob);
       onClose();
     } catch (err) {
-      console.error('Error cropping image:', err);
+      console.error("Error cropping image:", err);
       setError(
         t(
-          'config.account.profilePicture.cropper.cropError',
-          'Failed to crop image. Please try again.'
-        )
+          "config.account.profilePicture.cropper.cropError",
+          "Failed to crop image. Please try again.",
+        ),
       );
     } finally {
       setProcessing(false);
@@ -128,7 +133,10 @@ export const ProfilePictureCropper: React.FC<ProfilePictureCropperProps> = ({
     <Modal
       opened={opened}
       onClose={onClose}
-      title={t('config.account.profilePicture.cropper.title', 'Crop Profile Picture')}
+      title={t(
+        "config.account.profilePicture.cropper.title",
+        "Crop Profile Picture",
+      )}
       size="lg"
       centered
       zIndex={Z_INDEX_OVER_CONFIG_MODAL}
@@ -141,7 +149,7 @@ export const ProfilePictureCropper: React.FC<ProfilePictureCropperProps> = ({
         )}
 
         {/* Cropper area */}
-        <Box style={{ position: 'relative', width: '100%', height: 400 }}>
+        <Box style={{ position: "relative", width: "100%", height: 400 }}>
           {imageSrc && (
             <Cropper
               image={imageSrc}
@@ -158,7 +166,7 @@ export const ProfilePictureCropper: React.FC<ProfilePictureCropperProps> = ({
         {/* Zoom slider */}
         <Stack gap={4}>
           <Text size="sm" fw={500}>
-            {t('config.account.profilePicture.cropper.zoom', 'Zoom')}
+            {t("config.account.profilePicture.cropper.zoom", "Zoom")}
           </Text>
           <Slider
             value={zoom}
@@ -171,14 +179,22 @@ export const ProfilePictureCropper: React.FC<ProfilePictureCropperProps> = ({
         </Stack>
 
         {/* Action buttons */}
-        <div style={{ display: 'flex', justifyContent: 'flex-end', gap: '8px' }}>
+        <div
+          style={{ display: "flex", justifyContent: "flex-end", gap: "8px" }}
+        >
           <Button variant="subtle" onClick={onClose} disabled={processing}>
-            {t('common.cancel', 'Cancel')}
+            {t("common.cancel", "Cancel")}
           </Button>
           <Button onClick={handleSave} loading={processing}>
             {processing
-              ? t('config.account.profilePicture.cropper.processing', 'Processing crop...')
-              : t('config.account.profilePicture.cropper.save', 'Save Cropped Image')}
+              ? t(
+                  "config.account.profilePicture.cropper.processing",
+                  "Processing crop...",
+                )
+              : t(
+                  "config.account.profilePicture.cropper.save",
+                  "Save Cropped Image",
+                )}
           </Button>
         </div>
       </Stack>
diff --git a/frontend/src/saas/components/shared/config/configSections/ApiKeys.tsx b/frontend/src/saas/components/shared/config/configSections/ApiKeys.tsx
index 595ea38914..0caf6d9bd3 100644
--- a/frontend/src/saas/components/shared/config/configSections/ApiKeys.tsx
+++ b/frontend/src/saas/components/shared/config/configSections/ApiKeys.tsx
@@ -18,7 +18,15 @@ export default function ApiKeys() {
   const isAnonymous = Boolean(user && isUserAnonymous(user));
 
   const { data: credits, isLoading: creditsLoading } = useCredits();
-  const { apiKey, isLoading: apiKeyLoading, refresh, isRefreshing, error: apiKeyError, refetch, hasAttempted } = useApiKey();
+  const {
+    apiKey,
+    isLoading: apiKeyLoading,
+    refresh,
+    isRefreshing,
+    error: apiKeyError,
+    refetch,
+    hasAttempted,
+  } = useApiKey();
 
   const copy = async (text: string, tag: string) => {
     try {
@@ -40,7 +48,9 @@ export default function ApiKeys() {
   };
 
   const goToAccount = () => {
-    window.dispatchEvent(new CustomEvent('appConfig:navigate', { detail: { key: 'overview' } }));
+    window.dispatchEvent(
+      new CustomEvent("appConfig:navigate", { detail: { key: "overview" } }),
+    );
   };
 
   const showUsage = Boolean(credits);
@@ -48,60 +58,96 @@ export default function ApiKeys() {
   return (
     <Stack gap={20} p={0}>
       {showUsage && (
-        <UsageSection 
+        <UsageSection
           apiUsage={credits!}
           obscured={Boolean(!apiKey && hasAttempted && !isAnonymous)}
-          overlayMessage={t('config.apiKeys.overlayMessage', 'Generate a key to see credits and available credits')}
+          overlayMessage={t(
+            "config.apiKeys.overlayMessage",
+            "Generate a key to see credits and available credits",
+          )}
           loading={creditsLoading}
         />
       )}
-      
+
       {!isAnonymous && apiKeyError && (
         <Text size="sm" c="red.5">
-          {t('config.apiKeys.generateError', "We couldn't generate your API key.")} {" "}
-          <Anchor component="button" underline="always" onClick={refetch} c="red.4">
-            {t('common.retry', 'Retry')}
+          {t(
+            "config.apiKeys.generateError",
+            "We couldn't generate your API key.",
+          )}{" "}
+          <Anchor
+            component="button"
+            underline="always"
+            onClick={refetch}
+            c="red.4"
+          >
+            {t("common.retry", "Retry")}
           </Anchor>
         </Text>
       )}
 
       {isAnonymous ? (
-        <Paper radius="md" p={18} style={{ background: "var(--api-keys-card-bg)", border: "1px solid var(--api-keys-card-border)", boxShadow: "0 2px 8px var(--api-keys-card-shadow)" }}>
+        <Paper
+          radius="md"
+          p={18}
+          style={{
+            background: "var(--api-keys-card-bg)",
+            border: "1px solid var(--api-keys-card-border)",
+            boxShadow: "0 2px 8px var(--api-keys-card-shadow)",
+          }}
+        >
           <Stack gap={10}>
-            <Text fw={500}>{t('config.apiKeys.label', 'API Key')}</Text>
-            <Group justify="space-between" wrap="nowrap" align="center" style={{ gap: '1rem' }}>
+            <Text fw={500}>{t("config.apiKeys.label", "API Key")}</Text>
+            <Group
+              justify="space-between"
+              wrap="nowrap"
+              align="center"
+              style={{ gap: "1rem" }}
+            >
               <Text size="sm" c="dimmed" style={{ flex: 1 }}>
-                {t('config.apiKeys.guestInfo', 'Guest users do not receive API keys. Create an account to get an API key you can use in your applications.')}
+                {t(
+                  "config.apiKeys.guestInfo",
+                  "Guest users do not receive API keys. Create an account to get an API key you can use in your applications.",
+                )}
               </Text>
               <Button size="sm" onClick={goToAccount}>
-                {t('config.apiKeys.goToAccount', 'Go to Account')}
+                {t("config.apiKeys.goToAccount", "Go to Account")}
               </Button>
             </Group>
           </Stack>
         </Paper>
+      ) : apiKeyLoading ? (
+        <>
+          <Text size="sm" c="dimmed" style={{ marginBottom: 8 }}>
+            {t(
+              "config.apiKeys.description",
+              "Your API key for accessing Stirling's suite of PDF tools. Copy it to your project or refresh to generate a new one.",
+            )}
+          </Text>
+          <div
+            style={{
+              padding: 18,
+              borderRadius: 12,
+              background: "var(--api-keys-card-bg)",
+              border: "1px solid var(--api-keys-card-border)",
+              boxShadow: "0 2px 8px var(--api-keys-card-shadow)",
+            }}
+          >
+            <Group align="center" gap={12} wrap="nowrap">
+              <SkeletonLoader type="block" width="100%" height={36} />
+              <SkeletonLoader type="block" width={76} height={32} />
+              <SkeletonLoader type="block" width={92} height={32} />
+            </Group>
+          </div>
+        </>
       ) : (
-        apiKeyLoading ? (
-          <>
-            <Text size="sm" c="dimmed" style={{ marginBottom: 8 }}>
-              {t('config.apiKeys.description', "Your API key for accessing Stirling's suite of PDF tools. Copy it to your project or refresh to generate a new one.")}
-            </Text>
-            <div style={{ padding: 18, borderRadius: 12, background: "var(--api-keys-card-bg)", border: "1px solid var(--api-keys-card-border)", boxShadow: "0 2px 8px var(--api-keys-card-shadow)" }}>
-              <Group align="center" gap={12} wrap="nowrap">
-                <SkeletonLoader type="block" width="100%" height={36} />
-                <SkeletonLoader type="block" width={76} height={32} />
-                <SkeletonLoader type="block" width={92} height={32} />
-              </Group>
-            </div>
-          </>
-        ) : (
-          <ApiKeySection 
-            publicKey={apiKey ?? ""}
-            copied={copied}
-            onCopy={copy}
-            onRefresh={() => setShowRefreshModal(true)}
-            disabled={isRefreshing}
-          />
-        )
+        <ApiKeySection
+          publicKey={apiKey ?? ""}
+          copied={copied}
+          onCopy={copy}
+          onRefresh={() => setShowRefreshModal(true)}
+          disabled={isRefreshing}
+        />
       )}
 
       <RefreshModal
diff --git a/frontend/src/saas/components/shared/config/configSections/Overview.tsx b/frontend/src/saas/components/shared/config/configSections/Overview.tsx
index d535fdc2a7..f169c890a7 100644
--- a/frontend/src/saas/components/shared/config/configSections/Overview.tsx
+++ b/frontend/src/saas/components/shared/config/configSections/Overview.tsx
@@ -1,17 +1,35 @@
-import React, { useState } from 'react';
-import { Alert, Avatar, Button, Divider, FileButton, Group, Image, LoadingOverlay, PasswordInput, Text, TextInput, Modal } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { useAuth } from '@app/auth/UseSession';
-import { isUserAnonymous, linkEmailIdentity, linkOAuthIdentity, supabase } from '@app/auth/supabase';
-import { BASE_PATH } from '@app/constants/app';
-import { oauthProviders } from '@app/constants/authProviders';
-import { Tooltip } from '@app/components/shared/Tooltip';
-import { absoluteWithBasePath } from '@app/constants/app';
-import { synchronizeUserUpgrade } from '@app/services/userService';
-import { ProfilePictureCropper } from '@app/components/shared/config/ProfilePictureCropper';
-import { updateProfilePictureMetadata } from '@app/services/avatarSyncService';
-import { deleteCurrentAccount } from '@app/services/accountDeletion';
-import { alert as showToast } from '@app/components/toast';
+import React, { useState } from "react";
+import {
+  Alert,
+  Avatar,
+  Button,
+  Divider,
+  FileButton,
+  Group,
+  Image,
+  LoadingOverlay,
+  PasswordInput,
+  Text,
+  TextInput,
+  Modal,
+} from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import { useAuth } from "@app/auth/UseSession";
+import {
+  isUserAnonymous,
+  linkEmailIdentity,
+  linkOAuthIdentity,
+  supabase,
+} from "@app/auth/supabase";
+import { BASE_PATH } from "@app/constants/app";
+import { oauthProviders } from "@app/constants/authProviders";
+import { Tooltip } from "@app/components/shared/Tooltip";
+import { absoluteWithBasePath } from "@app/constants/app";
+import { synchronizeUserUpgrade } from "@app/services/userService";
+import { ProfilePictureCropper } from "@app/components/shared/config/ProfilePictureCropper";
+import { updateProfilePictureMetadata } from "@app/services/avatarSyncService";
+import { deleteCurrentAccount } from "@app/services/accountDeletion";
+import { alert as showToast } from "@app/components/toast";
 
 interface OverviewProps {
   onLogoutClick: () => void;
@@ -19,12 +37,20 @@ interface OverviewProps {
 
 const Overview: React.FC<OverviewProps> = ({ onLogoutClick }) => {
   const { t } = useTranslation();
-  const { user, refreshSession, signOut, profilePictureUrl, profilePictureMetadata, refreshProfilePicture, refreshProfilePictureMetadata } = useAuth();
+  const {
+    user,
+    refreshSession,
+    signOut,
+    profilePictureUrl,
+    profilePictureMetadata,
+    refreshProfilePicture,
+    refreshProfilePictureMetadata,
+  } = useAuth();
 
-  const PROFILE_BUCKET = 'profile-pictures';
+  const PROFILE_BUCKET = "profile-pictures";
 
-  const [email, setEmail] = useState('');
-  const [password, setPassword] = useState('');
+  const [email, setEmail] = useState("");
+  const [password, setPassword] = useState("");
   const [upgradeError, setUpgradeError] = useState<string | null>(null);
   const [success, setSuccess] = useState<string | null>(null);
   const [isLoading, setIsLoading] = useState(false);
@@ -34,14 +60,14 @@ const Overview: React.FC<OverviewProps> = ({ onLogoutClick }) => {
   const [cropperOpen, setCropperOpen] = useState(false);
   const [isDeletingAccount, setIsDeletingAccount] = useState(false);
   const [deleteModalOpen, setDeleteModalOpen] = useState(false);
-  const [confirmEmail, setConfirmEmail] = useState('');
+  const [confirmEmail, setConfirmEmail] = useState("");
 
   const isAnonymous = Boolean(user && isUserAnonymous(user));
-  const isOAuthPicture = profilePictureMetadata?.source === 'oauth';
+  const isOAuthPicture = profilePictureMetadata?.source === "oauth";
   const provider = profilePictureMetadata?.provider;
 
   const profilePath = user ? `${user.id}/avatar` : null;
-  const profileInitial = user?.email?.trim()?.charAt(0)?.toUpperCase() || 'U';
+  const profileInitial = user?.email?.trim()?.charAt(0)?.toUpperCase() || "U";
 
   const handleProfileUpload = async (file: File | null) => {
     if (!file || !user || !profilePath) {
@@ -49,7 +75,12 @@ const Overview: React.FC<OverviewProps> = ({ onLogoutClick }) => {
     }
 
     if (file.size > 2 * 1024 * 1024) {
-      setProfileError(t('config.account.profilePicture.sizeError', 'Please select an image smaller than 2MB.'));
+      setProfileError(
+        t(
+          "config.account.profilePicture.sizeError",
+          "Please select an image smaller than 2MB.",
+        ),
+      );
       return;
     }
 
@@ -66,7 +97,12 @@ const Overview: React.FC<OverviewProps> = ({ onLogoutClick }) => {
 
     // Validate cropped size (2MB limit)
     if (croppedBlob.size > 2 * 1024 * 1024) {
-      setProfileError(t('config.account.profilePicture.sizeError', 'Please select an image smaller than 2MB.'));
+      setProfileError(
+        t(
+          "config.account.profilePicture.sizeError",
+          "Please select an image smaller than 2MB.",
+        ),
+      );
       setCropperOpen(false);
       setCropperFile(null);
       return;
@@ -75,21 +111,20 @@ const Overview: React.FC<OverviewProps> = ({ onLogoutClick }) => {
     setProfileUploading(true);
     setProfileError(null);
 
-    const { error } = await supabase
-      .storage
+    const { error } = await supabase.storage
       .from(PROFILE_BUCKET)
       .upload(profilePath, croppedBlob, {
         upsert: true,
-        cacheControl: '3600',
-        contentType: 'image/png'
+        cacheControl: "3600",
+        contentType: "image/png",
       });
 
     if (error) {
-      setProfileError(error.message || 'Failed to upload profile picture');
+      setProfileError(error.message || "Failed to upload profile picture");
     } else {
       // Mark as manual upload in metadata
       await updateProfilePictureMetadata(user.id, {
-        source: 'upload',
+        source: "upload",
         provider: null,
       });
       await refreshProfilePictureMetadata();
@@ -109,17 +144,16 @@ const Overview: React.FC<OverviewProps> = ({ onLogoutClick }) => {
     setProfileUploading(true);
     setProfileError(null);
 
-    const { error } = await supabase
-      .storage
+    const { error } = await supabase.storage
       .from(PROFILE_BUCKET)
       .remove([profilePath]);
 
     if (error) {
-      setProfileError(error.message || 'Failed to remove profile picture');
+      setProfileError(error.message || "Failed to remove profile picture");
     } else {
       // Clear metadata when removing picture
       await updateProfilePictureMetadata(user.id, {
-        source: 'upload',
+        source: "upload",
         provider: null,
       });
       await refreshProfilePictureMetadata();
@@ -140,17 +174,26 @@ const Overview: React.FC<OverviewProps> = ({ onLogoutClick }) => {
     try {
       // Update metadata to allow manual uploads
       await updateProfilePictureMetadata(user.id, {
-        source: 'upload',
+        source: "upload",
         provider: null,
       });
 
       await refreshProfilePictureMetadata();
-      setSuccess(t('config.account.profilePicture.switchedToCustom', 'Switched to custom picture. You can now upload your own.'));
+      setSuccess(
+        t(
+          "config.account.profilePicture.switchedToCustom",
+          "Switched to custom picture. You can now upload your own.",
+        ),
+      );
 
       // Clear success message after 3 seconds
       setTimeout(() => setSuccess(null), 3000);
     } catch (error: unknown) {
-      setProfileError(error instanceof Error ? error.message : 'Failed to switch to custom picture');
+      setProfileError(
+        error instanceof Error
+          ? error.message
+          : "Failed to switch to custom picture",
+      );
     } finally {
       setProfileUploading(false);
     }
@@ -160,7 +203,7 @@ const Overview: React.FC<OverviewProps> = ({ onLogoutClick }) => {
     e.preventDefault();
 
     if (!email.trim()) {
-      setUpgradeError('Email is required');
+      setUpgradeError("Email is required");
       return;
     }
 
@@ -173,69 +216,83 @@ const Overview: React.FC<OverviewProps> = ({ onLogoutClick }) => {
       await linkEmailIdentity(email.trim(), password || undefined);
 
       // Synchronize with backend database (using "email" as auth method for email/password)
-      await synchronizeUserUpgrade('email');
+      await synchronizeUserUpgrade("email");
 
       // Refresh the session to reflect changes
       await refreshSession();
 
-      setSuccess('Account upgraded successfully! You can now sign in with your email.');
-      setEmail('');
-      setPassword('');
+      setSuccess(
+        "Account upgraded successfully! You can now sign in with your email.",
+      );
+      setEmail("");
+      setPassword("");
     } catch (err: unknown) {
-      setUpgradeError(err instanceof Error ? err.message : 'Failed to upgrade account');
+      setUpgradeError(
+        err instanceof Error ? err.message : "Failed to upgrade account",
+      );
     } finally {
       setIsLoading(false);
     }
   };
 
-  const handleOAuthUpgrade = async (provider: 'github' | 'google' | 'apple' | 'azure') => {
+  const handleOAuthUpgrade = async (
+    provider: "github" | "google" | "apple" | "azure",
+  ) => {
     try {
       setIsLoading(true);
       setUpgradeError(null);
       setSuccess(null);
 
       // Store provider info for post-redirect handling
-      sessionStorage.setItem('pendingUpgrade', 'true');
-      sessionStorage.setItem('upgradeProvider', provider);
+      sessionStorage.setItem("pendingUpgrade", "true");
+      sessionStorage.setItem("upgradeProvider", provider);
 
       // Redirect back to homepage after OAuth completes
       // The UseSession hook will handle the pendingUpgrade synchronization
-      const redirectUrl = absoluteWithBasePath('/auth/callback?next=/');
+      const redirectUrl = absoluteWithBasePath("/auth/callback?next=/");
       const result = await linkOAuthIdentity(provider, redirectUrl);
 
       if (result.data?.url) {
         window.location.href = result.data.url;
       }
     } catch (err: unknown) {
-      const errorMessage = err instanceof Error ? err.message : `Failed to upgrade account with ${provider}`;
+      const errorMessage =
+        err instanceof Error
+          ? err.message
+          : `Failed to upgrade account with ${provider}`;
       setUpgradeError(errorMessage);
       setIsLoading(false);
-      sessionStorage.removeItem('pendingUpgrade');
-      sessionStorage.removeItem('upgradeProvider');
+      sessionStorage.removeItem("pendingUpgrade");
+      sessionStorage.removeItem("upgradeProvider");
     }
   };
 
-
   const handleDeleteAccount = async () => {
     if (isAnonymous) return;
     try {
       setIsDeletingAccount(true);
       await deleteCurrentAccount();
       setDeleteModalOpen(false);
-      setConfirmEmail('');
+      setConfirmEmail("");
       await signOut();
-      window.location.href = absoluteWithBasePath('/login');
+      window.location.href = absoluteWithBasePath("/login");
     } catch (err) {
-      const fallbackMessage = t('config.account.overview.deleteFailed', 'Failed to delete account.');
+      const fallbackMessage = t(
+        "config.account.overview.deleteFailed",
+        "Failed to delete account.",
+      );
       const message = err instanceof Error ? err.message : fallbackMessage;
-      console.error('[Overview] Delete account failed:', err);
+      console.error("[Overview] Delete account failed:", err);
       showToast({
-        alertType: 'error',
-        title: t('config.account.overview.deleteFailedTitle', 'Unable to delete account'),
+        alertType: "error",
+        title: t(
+          "config.account.overview.deleteFailedTitle",
+          "Unable to delete account",
+        ),
         body: message,
         expandable: true,
-        location: 'top-right',
-        durationMs: 7000
+        location: "top-right",
+        durationMs: 7000,
       });
     } finally {
       setIsDeletingAccount(false);
@@ -244,33 +301,70 @@ const Overview: React.FC<OverviewProps> = ({ onLogoutClick }) => {
 
   const closeDeleteModal = () => {
     setDeleteModalOpen(false);
-    setConfirmEmail('');
+    setConfirmEmail("");
   };
 
   return (
-    <div style={{ display: 'flex', flexDirection: 'column', gap: '1.5rem', position: 'relative' }}>
+    <div
+      style={{
+        display: "flex",
+        flexDirection: "column",
+        gap: "1.5rem",
+        position: "relative",
+      }}
+    >
       <LoadingOverlay visible={isLoading || isDeletingAccount} />
 
       <div>
-        <div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'flex-start' }}>
+        <div
+          style={{
+            display: "flex",
+            justifyContent: "space-between",
+            alignItems: "flex-start",
+          }}
+        >
           <div>
-            <h3 style={{ margin: 0, color: 'var(--mantine-color-text)', fontSize: '1rem' }}>
-              {t('config.account.overview.title', 'Account Settings')}
+            <h3
+              style={{
+                margin: 0,
+                color: "var(--mantine-color-text)",
+                fontSize: "1rem",
+              }}
+            >
+              {t("config.account.overview.title", "Account Settings")}
             </h3>
-            <p style={{ margin: '0.25rem 0 0 0', color: 'var(--mantine-color-dimmed)', fontSize: '0.875rem' }}>
+            <p
+              style={{
+                margin: "0.25rem 0 0 0",
+                color: "var(--mantine-color-dimmed)",
+                fontSize: "0.875rem",
+              }}
+            >
               {isAnonymous
-                ? t('config.account.overview.guestDescription', 'You are signed in as a guest. Consider upgrading your account below.')
-                : t('config.account.overview.manageAccountPreferences', 'Manage your account preferences')
-              }
+                ? t(
+                    "config.account.overview.guestDescription",
+                    "You are signed in as a guest. Consider upgrading your account below.",
+                  )
+                : t(
+                    "config.account.overview.manageAccountPreferences",
+                    "Manage your account preferences",
+                  )}
             </p>
             {user?.email && (
-              <p style={{ margin: '0.25rem 0 0 0', color: 'var(--mantine-color-dimmed)', fontSize: '0.75rem' }}>
-                {t('config.account.overview.signedInAs', 'Signed in as')}: {user.email}
+              <p
+                style={{
+                  margin: "0.25rem 0 0 0",
+                  color: "var(--mantine-color-dimmed)",
+                  fontSize: "0.75rem",
+                }}
+              >
+                {t("config.account.overview.signedInAs", "Signed in as")}:{" "}
+                {user.email}
               </p>
             )}
           </div>
           <Button color="red" variant="filled" onClick={onLogoutClick}>
-            {t('logOut', 'Log out')}
+            {t("logOut", "Log out")}
           </Button>
         </div>
       </div>
@@ -278,11 +372,26 @@ const Overview: React.FC<OverviewProps> = ({ onLogoutClick }) => {
       <Divider />
 
       <div>
-        <h3 style={{ margin: 0, color: 'var(--mantine-color-text)', fontSize: '1rem' }}>
-          {t('config.account.profilePicture.title', 'Profile picture')}
+        <h3
+          style={{
+            margin: 0,
+            color: "var(--mantine-color-text)",
+            fontSize: "1rem",
+          }}
+        >
+          {t("config.account.profilePicture.title", "Profile picture")}
         </h3>
-        <p style={{ margin: '0.25rem 0 1rem 0', color: 'var(--mantine-color-dimmed)', fontSize: '0.875rem' }}>
-          {t('config.account.profilePicture.description', 'Upload an image to personalize your account.')}
+        <p
+          style={{
+            margin: "0.25rem 0 1rem 0",
+            color: "var(--mantine-color-dimmed)",
+            fontSize: "0.875rem",
+          }}
+        >
+          {t(
+            "config.account.profilePicture.description",
+            "Upload an image to personalize your account.",
+          )}
         </p>
 
         {profileError && (
@@ -299,26 +408,61 @@ const Overview: React.FC<OverviewProps> = ({ onLogoutClick }) => {
 
         {isOAuthPicture ? (
           <Group align="center" gap="md">
-            <Avatar src={profilePictureUrl || undefined} radius="xl" size={72} color="blue">
+            <Avatar
+              src={profilePictureUrl || undefined}
+              radius="xl"
+              size={72}
+              color="blue"
+            >
               {profileInitial}
             </Avatar>
-            <div style={{ display: 'flex', flexDirection: 'column', gap: '0.5rem' }}>
+            <div
+              style={{
+                display: "flex",
+                flexDirection: "column",
+                gap: "0.5rem",
+              }}
+            >
               <Text size="sm" c="dimmed">
-                {t('config.account.profilePicture.usingProvider', 'Using {{provider}} profile picture', {
-                  provider: provider ? provider.charAt(0).toUpperCase() + provider.slice(1) : 'OAuth'
-                })}
+                {t(
+                  "config.account.profilePicture.usingProvider",
+                  "Using {{provider}} profile picture",
+                  {
+                    provider: provider
+                      ? provider.charAt(0).toUpperCase() + provider.slice(1)
+                      : "OAuth",
+                  },
+                )}
               </Text>
-              <Button variant="outline" onClick={handleUseCustomPicture} disabled={profileUploading}>
-                {t('config.account.profilePicture.useCustom', 'Use custom picture')}
+              <Button
+                variant="outline"
+                onClick={handleUseCustomPicture}
+                disabled={profileUploading}
+              >
+                {t(
+                  "config.account.profilePicture.useCustom",
+                  "Use custom picture",
+                )}
               </Button>
             </div>
           </Group>
         ) : (
           <Group align="center" gap="md">
-            <Avatar src={profilePictureUrl || undefined} radius="xl" size={72} color="blue">
+            <Avatar
+              src={profilePictureUrl || undefined}
+              radius="xl"
+              size={72}
+              color="blue"
+            >
               {profileInitial}
             </Avatar>
-            <div style={{ display: 'flex', flexDirection: 'column', gap: '0.5rem' }}>
+            <div
+              style={{
+                display: "flex",
+                flexDirection: "column",
+                gap: "0.5rem",
+              }}
+            >
               <Group gap="sm">
                 <FileButton
                   onChange={handleProfileUpload}
@@ -327,7 +471,7 @@ const Overview: React.FC<OverviewProps> = ({ onLogoutClick }) => {
                 >
                   {(props) => (
                     <Button {...props} loading={profileUploading}>
-                      {t('config.account.profilePicture.upload', 'Upload')}
+                      {t("config.account.profilePicture.upload", "Upload")}
                     </Button>
                   )}
                 </FileButton>
@@ -336,11 +480,14 @@ const Overview: React.FC<OverviewProps> = ({ onLogoutClick }) => {
                   onClick={handleProfileRemove}
                   disabled={!profilePictureUrl || profileUploading}
                 >
-                  {t('config.account.profilePicture.remove', 'Remove')}
+                  {t("config.account.profilePicture.remove", "Remove")}
                 </Button>
               </Group>
               <Text size="xs" c="var(--mantine-color-dimmed)">
-                {t('config.account.profilePicture.help', 'PNG, JPG, or WebP up to 2MB.')}
+                {t(
+                  "config.account.profilePicture.help",
+                  "PNG, JPG, or WebP up to 2MB.",
+                )}
               </Text>
             </div>
           </Group>
@@ -362,11 +509,26 @@ const Overview: React.FC<OverviewProps> = ({ onLogoutClick }) => {
       {isAnonymous && (
         <div>
           <div>
-            <h3 style={{ margin: 0, color: 'var(--mantine-color-text)', fontSize: '1rem' }}>
-              {t('config.account.upgrade.title', 'Upgrade Guest Account')}
+            <h3
+              style={{
+                margin: 0,
+                color: "var(--mantine-color-text)",
+                fontSize: "1rem",
+              }}
+            >
+              {t("config.account.upgrade.title", "Upgrade Guest Account")}
             </h3>
-            <p style={{ margin: '0.25rem 0 1rem 0', color: 'var(--mantine-color-dimmed)', fontSize: '0.875rem' }}>
-              {t('config.account.upgrade.description', 'Link your account to preserve your history and access more features!')}
+            <p
+              style={{
+                margin: "0.25rem 0 1rem 0",
+                color: "var(--mantine-color-dimmed)",
+                fontSize: "0.875rem",
+              }}
+            >
+              {t(
+                "config.account.upgrade.description",
+                "Link your account to preserve your history and access more features!",
+              )}
             </p>
           </div>
 
@@ -382,17 +544,20 @@ const Overview: React.FC<OverviewProps> = ({ onLogoutClick }) => {
             </Alert>
           )}
 
-          <div style={{ marginBottom: '1rem' }}>
+          <div style={{ marginBottom: "1rem" }}>
             <Text size="sm" fw={500} mb="xs" c="var(--mantine-color-dimmed)">
-              {t('config.account.upgrade.socialLogin', 'Upgrade with Social Account')}
+              {t(
+                "config.account.upgrade.socialLogin",
+                "Upgrade with Social Account",
+              )}
             </Text>
-            <div style={{ display: 'flex', gap: '0.5rem', flexWrap: 'wrap' }}>
+            <div style={{ display: "flex", gap: "0.5rem", flexWrap: "wrap" }}>
               {oauthProviders
-                .filter(provider => !provider.isDisabled)
+                .filter((provider) => !provider.isDisabled)
                 .map((provider) => (
                   <Tooltip
                     key={provider.id}
-                    content={`${t('config.account.upgrade.linkWith', 'Link with')} ${provider.label}`}
+                    content={`${t("config.account.upgrade.linkWith", "Link with")} ${provider.label}`}
                   >
                     <Button
                       variant="outline"
@@ -404,7 +569,15 @@ const Overview: React.FC<OverviewProps> = ({ onLogoutClick }) => {
                           style={{ width: 16, height: 16 }}
                         />
                       }
-                      onClick={() => handleOAuthUpgrade(provider.id as 'github' | 'google' | 'apple' | 'azure')}
+                      onClick={() =>
+                        handleOAuthUpgrade(
+                          provider.id as
+                            | "github"
+                            | "google"
+                            | "apple"
+                            | "azure",
+                        )
+                      }
                       disabled={isLoading}
                     >
                       {provider.label}
@@ -416,28 +589,43 @@ const Overview: React.FC<OverviewProps> = ({ onLogoutClick }) => {
 
           <div>
             <Text size="sm" fw={500} mb="xs" c="var(--mantine-color-dimmed)">
-              {t('config.account.upgrade.emailPassword', 'or enter your email & password')}
+              {t(
+                "config.account.upgrade.emailPassword",
+                "or enter your email & password",
+              )}
             </Text>
             <form onSubmit={handleEmailUpgrade}>
               <Group align="end" gap="sm">
                 <TextInput
-                  label={t('config.account.upgrade.email', 'Email')}
-                  placeholder={t('config.account.upgrade.emailPlaceholder', 'Enter your email')}
+                  label={t("config.account.upgrade.email", "Email")}
+                  placeholder={t(
+                    "config.account.upgrade.emailPlaceholder",
+                    "Enter your email",
+                  )}
                   value={email}
                   onChange={(e) => setEmail(e.target.value)}
                   required
                   style={{ flex: 1 }}
                 />
                 <PasswordInput
-                  label={t('config.account.upgrade.password', 'Password (optional)')}
-                  placeholder={t('config.account.upgrade.passwordPlaceholder', 'Set a password')}
+                  label={t(
+                    "config.account.upgrade.password",
+                    "Password (optional)",
+                  )}
+                  placeholder={t(
+                    "config.account.upgrade.passwordPlaceholder",
+                    "Set a password",
+                  )}
                   value={password}
                   onChange={(e) => setPassword(e.target.value)}
-                  description={t('config.account.upgrade.passwordNote', 'Leave empty to use email verification only')}
+                  description={t(
+                    "config.account.upgrade.passwordNote",
+                    "Leave empty to use email verification only",
+                  )}
                   style={{ flex: 1 }}
                 />
                 <Button type="submit" disabled={isLoading}>
-                  {t('config.account.upgrade.upgradeButton', 'Upgrade Account')}
+                  {t("config.account.upgrade.upgradeButton", "Upgrade Account")}
                 </Button>
               </Group>
             </form>
@@ -447,19 +635,21 @@ const Overview: React.FC<OverviewProps> = ({ onLogoutClick }) => {
 
       {/* Delete Account Section */}
       {!isAnonymous && (
-        <div style={{
-          marginTop: 'auto',
-          paddingTop: '1.5rem',
-          display: 'flex',
-          justifyContent: 'flex-end',
-          borderTop: '1px solid var(--mantine-color-default-border)'
-        }}>
+        <div
+          style={{
+            marginTop: "auto",
+            paddingTop: "1.5rem",
+            display: "flex",
+            justifyContent: "flex-end",
+            borderTop: "1px solid var(--mantine-color-default-border)",
+          }}
+        >
           <Button
             color="red"
             variant="outline"
             onClick={() => setDeleteModalOpen(true)}
           >
-            {t('config.account.overview.deleteAccount', 'Delete Account')}
+            {t("config.account.overview.deleteAccount", "Delete Account")}
           </Button>
         </div>
       )}
@@ -468,42 +658,53 @@ const Overview: React.FC<OverviewProps> = ({ onLogoutClick }) => {
       <Modal
         opened={deleteModalOpen}
         onClose={closeDeleteModal}
-        title={t('config.account.overview.deleteAccountTitle', 'Delete Account')}
+        title={t(
+          "config.account.overview.deleteAccountTitle",
+          "Delete Account",
+        )}
         centered
         zIndex={10000}
       >
-        <form onSubmit={(e) => {
-          e.preventDefault();
-          if (confirmEmail.toLowerCase() === user?.email?.toLowerCase()) {
-            handleDeleteAccount();
-          }
-        }}>
+        <form
+          onSubmit={(e) => {
+            e.preventDefault();
+            if (confirmEmail.toLowerCase() === user?.email?.toLowerCase()) {
+              handleDeleteAccount();
+            }
+          }}
+        >
           <Text size="sm" mb="md">
-            {t('config.account.overview.deleteWarning',
-              'This action is permanent and cannot be undone. All your data will be deleted.')}
+            {t(
+              "config.account.overview.deleteWarning",
+              "This action is permanent and cannot be undone. All your data will be deleted.",
+            )}
           </Text>
           <Text size="sm" fw={500} mb="xs">
-            {t('config.account.overview.enterEmailConfirm',
-              'To confirm deletion, please type your email address ({{email}}) below:',
-              { email: user?.email })}
+            {t(
+              "config.account.overview.enterEmailConfirm",
+              "To confirm deletion, please type your email address ({{email}}) below:",
+              { email: user?.email },
+            )}
           </Text>
           <TextInput
-            placeholder={user?.email || ''}
+            placeholder={user?.email || ""}
             value={confirmEmail}
             onChange={(e) => setConfirmEmail(e.target.value)}
             mb="md"
           />
           <Group justify="flex-end" gap="sm">
             <Button variant="default" onClick={closeDeleteModal} type="button">
-              {t('cancel', 'Cancel')}
+              {t("cancel", "Cancel")}
             </Button>
             <Button
               color="red"
-              disabled={confirmEmail.toLowerCase() !== user?.email?.toLowerCase()}
+              disabled={
+                confirmEmail.toLowerCase() !== user?.email?.toLowerCase()
+              }
               type="submit"
               loading={isDeletingAccount}
             >
-              {t('config.account.overview.confirmDelete', 'Delete My Account')}
+              {t("config.account.overview.confirmDelete", "Delete My Account")}
             </Button>
           </Group>
         </form>
diff --git a/frontend/src/saas/components/shared/config/configSections/PasswordSecurity.tsx b/frontend/src/saas/components/shared/config/configSections/PasswordSecurity.tsx
index 55ab3cdc2b..8010b5482a 100644
--- a/frontend/src/saas/components/shared/config/configSections/PasswordSecurity.tsx
+++ b/frontend/src/saas/components/shared/config/configSections/PasswordSecurity.tsx
@@ -1,9 +1,17 @@
-import React, { useState } from 'react';
-import { Button, PasswordInput, Group, Alert, LoadingOverlay, Modal, Divider } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { useAuth } from '@app/auth/UseSession';
-import { supabase } from '@app/auth/supabase';
-import { Z_INDEX_OVER_SETTINGS_MODAL } from '@app/styles/zIndex';
+import React, { useState } from "react";
+import {
+  Button,
+  PasswordInput,
+  Group,
+  Alert,
+  LoadingOverlay,
+  Modal,
+  Divider,
+} from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import { useAuth } from "@app/auth/UseSession";
+import { supabase } from "@app/auth/supabase";
+import { Z_INDEX_OVER_SETTINGS_MODAL } from "@app/styles/zIndex";
 
 const PasswordSecurity: React.FC = () => {
   const { t } = useTranslation();
@@ -11,23 +19,28 @@ const PasswordSecurity: React.FC = () => {
 
   const [opened, setOpened] = useState(false);
   const [isLoading, setIsLoading] = useState(false);
-  const [newPassword, setNewPassword] = useState('');
-  const [confirmPassword, setConfirmPassword] = useState('');
+  const [newPassword, setNewPassword] = useState("");
+  const [confirmPassword, setConfirmPassword] = useState("");
   const [error, setError] = useState<string | null>(null);
   const [success, setSuccess] = useState<string | null>(null);
   const [didUpdate, setDidUpdate] = useState(false);
 
   const handleChangePassword = async () => {
     if (!newPassword || !confirmPassword) {
-      setError(t('signup.pleaseFillAllFields', 'Please fill in all fields'));
+      setError(t("signup.pleaseFillAllFields", "Please fill in all fields"));
       return;
     }
     if (newPassword.length < 6) {
-      setError(t('signup.passwordTooShort', 'Password must be at least 6 characters long'));
+      setError(
+        t(
+          "signup.passwordTooShort",
+          "Password must be at least 6 characters long",
+        ),
+      );
       return;
     }
     if (newPassword !== confirmPassword) {
-      setError(t('signup.passwordsDoNotMatch', 'Passwords do not match'));
+      setError(t("signup.passwordsDoNotMatch", "Passwords do not match"));
       return;
     }
 
@@ -37,15 +50,22 @@ const PasswordSecurity: React.FC = () => {
       setSuccess(null);
 
       // Update to the new password directly
-      const { error: updateError } = await supabase.auth.updateUser({ password: newPassword });
+      const { error: updateError } = await supabase.auth.updateUser({
+        password: newPassword,
+      });
       if (updateError) {
         setError(updateError.message);
         return;
       }
 
-      setSuccess(t('login.passwordUpdatedSuccess', 'Your password has been updated successfully.'));
-      setNewPassword('');
-      setConfirmPassword('');
+      setSuccess(
+        t(
+          "login.passwordUpdatedSuccess",
+          "Your password has been updated successfully.",
+        ),
+      );
+      setNewPassword("");
+      setConfirmPassword("");
       setDidUpdate(true);
 
       // Replace form with success text, then close after 2s
@@ -56,59 +76,107 @@ const PasswordSecurity: React.FC = () => {
         setDidUpdate(false);
       }, 2000);
     } catch (e: unknown) {
-      setError(e instanceof Error ? e.message : 'Failed to change password');
+      setError(e instanceof Error ? e.message : "Failed to change password");
     } finally {
       setIsLoading(false);
     }
   };
 
   return (
-    <div style={{ position: 'relative' }}>
+    <div style={{ position: "relative" }}>
       <LoadingOverlay visible={isLoading} />
 
-      <div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center' }}>
+      <div
+        style={{
+          display: "flex",
+          justifyContent: "space-between",
+          alignItems: "center",
+        }}
+      >
         <div>
-        <h3 style={{ margin: 0, color: 'var(--mantine-color-text)', fontSize: '1rem' }}>
-          {t('config.account.security.title', 'Passwords & Security')}
-        </h3>
-        <p style={{ margin: '0.25rem 0 1rem 0', color: 'var(--mantine-color-dimmed)', fontSize: '0.875rem' }}>
-          {t('config.account.security.description', 'Manage your password and security settings.')}
-        </p>
+          <h3
+            style={{
+              margin: 0,
+              color: "var(--mantine-color-text)",
+              fontSize: "1rem",
+            }}
+          >
+            {t("config.account.security.title", "Passwords & Security")}
+          </h3>
+          <p
+            style={{
+              margin: "0.25rem 0 1rem 0",
+              color: "var(--mantine-color-dimmed)",
+              fontSize: "0.875rem",
+            }}
+          >
+            {t(
+              "config.account.security.description",
+              "Manage your password and security settings.",
+            )}
+          </p>
         </div>
         <Button type="button" onClick={() => setOpened(true)} variant="filled">
-          {t('config.account.security.changePassword', 'Change password')}
+          {t("config.account.security.changePassword", "Change password")}
         </Button>
       </div>
 
-      <Modal opened={opened} onClose={() => setOpened(false)} centered title={t('config.account.security.changePassword', 'Change password')} zIndex={Z_INDEX_OVER_SETTINGS_MODAL}>
+      <Modal
+        opened={opened}
+        onClose={() => setOpened(false)}
+        centered
+        title={t("config.account.security.changePassword", "Change password")}
+        zIndex={Z_INDEX_OVER_SETTINGS_MODAL}
+      >
         {error && (
-          <Alert color="red" mb="md">{error}</Alert>
+          <Alert color="red" mb="md">
+            {error}
+          </Alert>
         )}
 
         {didUpdate ? (
-          <Alert color="green" mb="md">{success || t('login.passwordUpdatedSuccess', 'Your password has been updated successfully.')}</Alert>
+          <Alert color="green" mb="md">
+            {success ||
+              t(
+                "login.passwordUpdatedSuccess",
+                "Your password has been updated successfully.",
+              )}
+          </Alert>
         ) : (
-          <div style={{ display: 'flex', flexDirection: 'column', gap: '0.75rem' }}>
+          <div
+            style={{ display: "flex", flexDirection: "column", gap: "0.75rem" }}
+          >
             <PasswordInput
-              label={t('account.newPassword', 'New Password')}
-              placeholder={t('account.newPassword', 'New Password')}
+              label={t("account.newPassword", "New Password")}
+              placeholder={t("account.newPassword", "New Password")}
               value={newPassword}
               onChange={(e) => setNewPassword(e.currentTarget.value)}
             />
             <PasswordInput
-              label={t('account.confirmNewPassword', 'Confirm New Password')}
-              placeholder={t('account.confirmNewPassword', 'Confirm New Password')}
+              label={t("account.confirmNewPassword", "Confirm New Password")}
+              placeholder={t(
+                "account.confirmNewPassword",
+                "Confirm New Password",
+              )}
               value={confirmPassword}
               onChange={(e) => setConfirmPassword(e.currentTarget.value)}
             />
 
             <Divider my="sm" />
             <Group justify="flex-end">
-              <Button type="button" variant="default" onClick={() => setOpened(false)}>
-                {t('common.cancel', 'Cancel')}
+              <Button
+                type="button"
+                variant="default"
+                onClick={() => setOpened(false)}
+              >
+                {t("common.cancel", "Cancel")}
               </Button>
-              <Button type="button" onClick={handleChangePassword} loading={isLoading}>
-                {t('config.account.security.update', 'Update password')}
+              <Button
+                type="button"
+                onClick={handleChangePassword}
+                loading={isLoading}
+              >
+                {t("config.account.security.update", "Update password")}
               </Button>
             </Group>
           </div>
@@ -119,5 +187,3 @@ const PasswordSecurity: React.FC = () => {
 };
 
 export default PasswordSecurity;
-
-
diff --git a/frontend/src/saas/components/shared/config/configSections/Plan.tsx b/frontend/src/saas/components/shared/config/configSections/Plan.tsx
index e5704e6293..af7dcb2f83 100644
--- a/frontend/src/saas/components/shared/config/configSections/Plan.tsx
+++ b/frontend/src/saas/components/shared/config/configSections/Plan.tsx
@@ -1,76 +1,94 @@
-import React, { useState, useCallback, useEffect } from 'react';
-import { Divider, Loader, Alert, Select, Group, Text } from '@mantine/core';
-import { usePlans, PlanTier } from '@app/hooks/usePlans';
-import StripeCheckout, { PurchaseType, CreditsPack, PlanID } from '@app/components/shared/StripeCheckoutSaas';
-import AvailablePlansSection from '@app/components/shared/config/configSections/plan/AvailablePlansSection';
-import ApiPackagesSection from '@app/components/shared/config/configSections/plan/ApiPackagesSection';
-import ActivePlanSection from '@app/components/shared/config/configSections/plan/ActivePlanSection';
-import { useAuth } from '@app/auth/UseSession';
+import React, { useState, useCallback, useEffect } from "react";
+import { Divider, Loader, Alert, Select, Group, Text } from "@mantine/core";
+import { usePlans, PlanTier } from "@app/hooks/usePlans";
+import StripeCheckout, {
+  PurchaseType,
+  CreditsPack,
+  PlanID,
+} from "@app/components/shared/StripeCheckoutSaas";
+import AvailablePlansSection from "@app/components/shared/config/configSections/plan/AvailablePlansSection";
+import ApiPackagesSection from "@app/components/shared/config/configSections/plan/ApiPackagesSection";
+import ActivePlanSection from "@app/components/shared/config/configSections/plan/ActivePlanSection";
+import { useAuth } from "@app/auth/UseSession";
 
 const Plan: React.FC = () => {
   const [checkoutOpen, setCheckoutOpen] = useState(false);
   const [selectedPlan, setSelectedPlan] = useState<PlanTier | null>(null);
   const [selectedCredits, setSelectedCredits] = useState(0); // Index of selected credit package
-  const [purchaseType, setPurchaseType] = useState<PurchaseType>('subscription');
-  const [selectedCreditsPack, setSelectedCreditsPack] = useState<CreditsPack>(null);
-  const [currency, setCurrency] = useState<string>('gbp');
+  const [purchaseType, setPurchaseType] =
+    useState<PurchaseType>("subscription");
+  const [selectedCreditsPack, setSelectedCreditsPack] =
+    useState<CreditsPack>(null);
+  const [currency, setCurrency] = useState<string>("gbp");
   const { trialStatus } = useAuth();
   const { data, loading, error, updateCurrentPlan } = usePlans(currency);
 
   const currencyOptions = [
-    { value: 'cny', label: 'Chinese yuan (CNY, ¥)' },
-    { value: 'usd', label: 'US dollar (USD, $)' },
-    { value: 'inr', label: 'Indian rupee (INR, ₹)' },
-    { value: 'brl', label: 'Brazilian real (BRL, R$)' },
-    { value: 'eur', label: 'Euro (EUR, €)' },
-    { value: 'idr', label: 'Indonesian rupiah (IDR, Rp)' },
-    { value: 'gbp', label: 'British pound (GBP, £)' }
+    { value: "cny", label: "Chinese yuan (CNY, ¥)" },
+    { value: "usd", label: "US dollar (USD, $)" },
+    { value: "inr", label: "Indian rupee (INR, ₹)" },
+    { value: "brl", label: "Brazilian real (BRL, R$)" },
+    { value: "eur", label: "Euro (EUR, €)" },
+    { value: "idr", label: "Indonesian rupiah (IDR, Rp)" },
+    { value: "gbp", label: "British pound (GBP, £)" },
   ];
 
-  const handleUpgradeClick = useCallback((plan: PlanTier) => {
-    if (!data) return;
+  const handleUpgradeClick = useCallback(
+    (plan: PlanTier) => {
+      if (!data) return;
 
-    if (plan.isContactOnly) {
-      // Open contact form or redirect to contact page
-      window.open('mailto:contact@stirlingpdf.com?subject=Enterprise Plan Inquiry', '_blank');
-      return;
-    }
+      if (plan.isContactOnly) {
+        // Open contact form or redirect to contact page
+        window.open(
+          "mailto:contact@stirlingpdf.com?subject=Enterprise Plan Inquiry",
+          "_blank",
+        );
+        return;
+      }
 
-    if (plan.id !== data.currentPlan.id) {
-      setSelectedPlan(plan);
-      setPurchaseType('subscription');
-      setSelectedCreditsPack(null);
-      setCheckoutOpen(true);
-    }
-  }, [data]);
+      if (plan.id !== data.currentPlan.id) {
+        setSelectedPlan(plan);
+        setPurchaseType("subscription");
+        setSelectedCreditsPack(null);
+        setCheckoutOpen(true);
+      }
+    },
+    [data],
+  );
 
-  const handleCreditPurchaseClick = useCallback((creditsPack: CreditsPack) => {
-    if (!data) return;
+  const handleCreditPurchaseClick = useCallback(
+    (creditsPack: CreditsPack) => {
+      if (!data) return;
 
-    setSelectedCreditsPack(creditsPack);
-    setPurchaseType('credits');
-    setSelectedPlan(null);
-    setCheckoutOpen(true);
-  }, [data]);
-
-  const handlePaymentSuccess = useCallback((sessionId: string) => {
-    console.log('Payment successful, session:', sessionId);
-
-    // Update local state immediately - no page reload needed
-    if (selectedPlan && purchaseType === 'subscription') {
-      updateCurrentPlan(selectedPlan.id);
-    }
-
-    // Close modal after brief delay to show success message
-    setTimeout(() => {
-      setCheckoutOpen(false);
+      setSelectedCreditsPack(creditsPack);
+      setPurchaseType("credits");
       setSelectedPlan(null);
-      setSelectedCreditsPack(null);
-    }, 2000);
-  }, [selectedPlan, purchaseType, updateCurrentPlan]);
+      setCheckoutOpen(true);
+    },
+    [data],
+  );
+
+  const handlePaymentSuccess = useCallback(
+    (sessionId: string) => {
+      console.log("Payment successful, session:", sessionId);
+
+      // Update local state immediately - no page reload needed
+      if (selectedPlan && purchaseType === "subscription") {
+        updateCurrentPlan(selectedPlan.id);
+      }
+
+      // Close modal after brief delay to show success message
+      setTimeout(() => {
+        setCheckoutOpen(false);
+        setSelectedPlan(null);
+        setSelectedCreditsPack(null);
+      }, 2000);
+    },
+    [selectedPlan, purchaseType, updateCurrentPlan],
+  );
 
   const handlePaymentError = useCallback((error: string) => {
-    console.error('Payment error:', error);
+    console.error("Payment error:", error);
     // Error is already displayed in the StripeCheckout component
   }, []);
 
@@ -84,11 +102,13 @@ const Plan: React.FC = () => {
     if (!data) return;
 
     // Find Pro plan from available plans
-    const proPlan = Array.from(data.plans.values()).find(plan => plan.id === 'pro');
+    const proPlan = Array.from(data.plans.values()).find(
+      (plan) => plan.id === "pro",
+    );
 
     if (proPlan) {
       setSelectedPlan(proPlan);
-      setPurchaseType('subscription');
+      setPurchaseType("subscription");
       setSelectedCreditsPack(null);
       setCheckoutOpen(true);
     }
@@ -99,12 +119,14 @@ const Plan: React.FC = () => {
     if (!data) return;
 
     const params = new URLSearchParams(window.location.search);
-    if (params.get('action') === 'add-payment') {
+    if (params.get("action") === "add-payment") {
       handleAddPaymentClick();
       // Clean up URL
-      params.delete('action');
-      const newUrl = params.toString() ? `${window.location.pathname}?${params.toString()}` : window.location.pathname;
-      window.history.replaceState({}, '', newUrl);
+      params.delete("action");
+      const newUrl = params.toString()
+        ? `${window.location.pathname}?${params.toString()}`
+        : window.location.pathname;
+      window.history.replaceState({}, "", newUrl);
     }
   }, [data, handleAddPaymentClick]);
 
@@ -133,18 +155,21 @@ const Plan: React.FC = () => {
     );
   }
 
-  const { plans, apiPackages, currentPlan, nextBillingDate, activeSince } = data;
+  const { plans, apiPackages, currentPlan, nextBillingDate, activeSince } =
+    data;
   const plansArray = Array.from(plans.values());
 
   return (
-    <div style={{ display: 'flex', flexDirection: 'column', gap: '2rem' }}>
+    <div style={{ display: "flex", flexDirection: "column", gap: "2rem" }}>
       {/* Currency Selector */}
       <div>
         <Group justify="space-between" align="center" mb="md">
-          <Text size="lg" fw={600}>Currency</Text>
+          <Text size="lg" fw={600}>
+            Currency
+          </Text>
           <Select
             value={currency}
-            onChange={(value) => setCurrency(value || 'gbp')}
+            onChange={(value) => setCurrency(value || "gbp")}
             data={currencyOptions}
             searchable
             clearable={true}
@@ -180,19 +205,27 @@ const Plan: React.FC = () => {
 
       {/* Stripe Checkout Modal */}
       <StripeCheckout
-        opened={checkoutOpen && (selectedPlan !== null || selectedCreditsPack !== null)}
+        opened={
+          checkoutOpen &&
+          (selectedPlan !== null || selectedCreditsPack !== null)
+        }
         onClose={handleCheckoutClose}
         purchaseType={purchaseType}
-        planId={purchaseType === 'subscription' ? (selectedPlan?.id as PlanID) : null}
-        creditsPack={purchaseType === 'credits' ? selectedCreditsPack : null}
+        planId={
+          purchaseType === "subscription" ? (selectedPlan?.id as PlanID) : null
+        }
+        creditsPack={purchaseType === "credits" ? selectedCreditsPack : null}
         planName={
-          purchaseType === 'subscription'
-            ? selectedPlan?.name || ''
-            : data?.apiPackages.find(pkg => pkg.id === selectedCreditsPack)?.name || ''
+          purchaseType === "subscription"
+            ? selectedPlan?.name || ""
+            : data?.apiPackages.find((pkg) => pkg.id === selectedCreditsPack)
+                ?.name || ""
         }
         onSuccess={handlePaymentSuccess}
         onError={handlePaymentError}
-        isTrialConversion={trialStatus?.isTrialing && purchaseType === 'subscription'}
+        isTrialConversion={
+          trialStatus?.isTrialing && purchaseType === "subscription"
+        }
       />
     </div>
   );
diff --git a/frontend/src/saas/components/shared/config/configSections/apiKeys/UsageSection.tsx b/frontend/src/saas/components/shared/config/configSections/apiKeys/UsageSection.tsx
index 8a79fd3510..f7f4e5468a 100644
--- a/frontend/src/saas/components/shared/config/configSections/apiKeys/UsageSection.tsx
+++ b/frontend/src/saas/components/shared/config/configSections/apiKeys/UsageSection.tsx
@@ -1,13 +1,7 @@
 import React from "react";
-import {
-  Paper,
-  Stack,
-  Group,
-  Text,
-  Divider,
-} from "@mantine/core";
+import { Paper, Stack, Group, Text, Divider } from "@mantine/core";
 import StackedBarChart from "@app/components/shared/charts/StackedBarChart";
-import { FractionData } from '@app/types/charts';
+import { FractionData } from "@app/types/charts";
 import { ApiCredits as ApiUsage } from "@app/types/credits";
 import SkeletonLoader from "@app/components/shared/SkeletonLoader";
 import { formatUTC } from "@app/components/shared/utils/date";
@@ -22,55 +16,74 @@ interface UsageSectionProps {
   loading?: boolean;
 }
 
-export default function UsageSection({ apiUsage, obscured, overlayMessage, loading }: UsageSectionProps) {
+export default function UsageSection({
+  apiUsage,
+  obscured,
+  overlayMessage,
+  loading,
+}: UsageSectionProps) {
   const { t } = useTranslation();
-  const weeklyUsed = apiUsage.weeklyCreditsAllocated - apiUsage.weeklyCreditsRemaining;
-  const boughtUsed = apiUsage.totalBoughtCredits - apiUsage.boughtCreditsRemaining;
-  
+  const weeklyUsed =
+    apiUsage.weeklyCreditsAllocated - apiUsage.weeklyCreditsRemaining;
+  const boughtUsed =
+    apiUsage.totalBoughtCredits - apiUsage.boughtCreditsRemaining;
+
   // Totals for overall usage visualization
   const totalRemaining = Math.max(apiUsage.totalAvailableCredits, 0);
 
-  const formatDate = (iso: string, withTime: boolean) => formatUTC(iso, withTime);
+  const formatDate = (iso: string, withTime: boolean) =>
+    formatUTC(iso, withTime);
 
   // Prepare data for the stacked bar chart
   const fractions: FractionData[] = [
     {
-      name: t('config.apiKeys.includedCredits', 'Included credits'),
+      name: t("config.apiKeys.includedCredits", "Included credits"),
       numerator: Math.max(0, weeklyUsed),
       denominator: Math.max(0, apiUsage.weeklyCreditsAllocated),
-      numeratorLabel: t('common.used', 'used'),
-      denominatorLabel: t('common.available', 'available'),
-      color: "var(--usage-weekly-active)"
+      numeratorLabel: t("common.used", "used"),
+      denominatorLabel: t("common.available", "available"),
+      color: "var(--usage-weekly-active)",
     },
     {
-      name: t('config.apiKeys.purchasedCredits', 'Purchased credits'), 
+      name: t("config.apiKeys.purchasedCredits", "Purchased credits"),
       numerator: Math.max(0, boughtUsed),
       denominator: Math.max(0, apiUsage.totalBoughtCredits),
-      numeratorLabel: t('common.used', 'used'),
-      denominatorLabel: t('common.available', 'available'), 
-      color: "var(--usage-bought-active)"
+      numeratorLabel: t("common.used", "used"),
+      denominatorLabel: t("common.available", "available"),
+      color: "var(--usage-bought-active)",
     },
   ];
 
   return (
     <div style={{ position: "relative" }}>
-      <Paper radius="md" p={18} style={{ background: "var(--api-keys-card-bg)", border: "1px solid var(--api-keys-card-border)", boxShadow: "0 2px 8px var(--api-keys-card-shadow)" }}>
-        <Stack gap={12}
+      <Paper
+        radius="md"
+        p={18}
+        style={{
+          background: "var(--api-keys-card-bg)",
+          border: "1px solid var(--api-keys-card-border)",
+          boxShadow: "0 2px 8px var(--api-keys-card-shadow)",
+        }}
+      >
+        <Stack
+          gap={12}
           style={{
-            fontFamily: 'ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji", "Segoe UI Emoji"',
+            fontFamily:
+              'ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji", "Segoe UI Emoji"',
           }}
         >
           <Group justify="space-between">
             <Text fw={500}>
-              {t('config.apiKeys.creditsRemaining', 'Credits Remaining')}: {loading ? (
+              {t("config.apiKeys.creditsRemaining", "Credits Remaining")}:{" "}
+              {loading ? (
                 <SkeletonLoader type="block" width={40} height={14} />
               ) : (
                 totalRemaining
               )}
             </Text>
           </Group>
-          
-          <StackedBarChart 
+
+          <StackedBarChart
             fractions={fractions}
             width={640}
             height={22}
@@ -79,12 +92,13 @@ export default function UsageSection({ apiUsage, obscured, overlayMessage, loadi
             loading={Boolean(loading)}
             animate={!loading}
             animationDurationMs={900}
-            ariaLabel={t('config.apiKeys.chartAriaLabel', {
+            ariaLabel={t("config.apiKeys.chartAriaLabel", {
               includedUsed: Math.max(0, weeklyUsed),
               includedTotal: Math.max(0, apiUsage.weeklyCreditsAllocated),
               purchasedUsed: Math.max(0, boughtUsed),
               purchasedTotal: Math.max(0, apiUsage.totalBoughtCredits),
-              defaultValue: 'Credits usage: included {{includedUsed}} of {{includedTotal}}, purchased {{purchasedUsed}} of {{purchasedTotal}}'
+              defaultValue:
+                "Credits usage: included {{includedUsed}} of {{includedTotal}}, purchased {{purchasedUsed}} of {{purchasedTotal}}",
             })}
           />
 
@@ -93,14 +107,16 @@ export default function UsageSection({ apiUsage, obscured, overlayMessage, loadi
           <Group justify="space-between" wrap="wrap">
             <Group gap="lg">
               <Text size="sm" c="dimmed">
-                {t('config.apiKeys.nextReset', 'Next Reset')}: {loading ? (
+                {t("config.apiKeys.nextReset", "Next Reset")}:{" "}
+                {loading ? (
                   <SkeletonLoader type="block" width={120} height={12} />
                 ) : (
                   formatDate(apiUsage.weeklyResetDate, false)
                 )}
               </Text>
               <Text size="sm" c="dimmed">
-                {t('config.apiKeys.lastApiUse', 'Last API Use')}: {loading ? (
+                {t("config.apiKeys.lastApiUse", "Last API Use")}:{" "}
+                {loading ? (
                   <SkeletonLoader type="block" width={160} height={12} />
                 ) : (
                   formatDate(apiUsage.lastApiUsage, true)
@@ -130,10 +146,14 @@ export default function UsageSection({ apiUsage, obscured, overlayMessage, loadi
           }}
         >
           <Text size="sm" c="dimmed">
-            {overlayMessage || t('config.apiKeys.overlayMessage', 'Generate a key to see credits and available credits')}
+            {overlayMessage ||
+              t(
+                "config.apiKeys.overlayMessage",
+                "Generate a key to see credits and available credits",
+              )}
           </Text>
         </div>
       )}
     </div>
   );
-}
\ No newline at end of file
+}
diff --git a/frontend/src/saas/components/shared/config/configSections/apiKeys/hooks/useApiKey.ts b/frontend/src/saas/components/shared/config/configSections/apiKeys/hooks/useApiKey.ts
index 870700eb26..d1934232d5 100644
--- a/frontend/src/saas/components/shared/config/configSections/apiKeys/hooks/useApiKey.ts
+++ b/frontend/src/saas/components/shared/config/configSections/apiKeys/hooks/useApiKey.ts
@@ -20,18 +20,29 @@ export function useApiKey() {
     setError(null);
     try {
       // Backend is POST for get and update
-      const res = await apiClient.post<ApiKeyResponse>("/api/v1/user/get-api-key");
+      const res = await apiClient.post<ApiKeyResponse>(
+        "/api/v1/user/get-api-key",
+      );
       const value = typeof res.data === "string" ? res.data : res.data.apiKey;
       if (typeof value === "string") setApiKey(value);
     } catch (e: unknown) {
       // If not found, try to create one by calling update endpoint
       if (isAxiosError(e) && e.response?.status === 404) {
         try {
-          const createRes = await apiClient.post<ApiKeyResponse>("/api/v1/user/update-api-key");
-          const created = typeof createRes.data === "string" ? createRes.data : createRes.data.apiKey;
+          const createRes = await apiClient.post<ApiKeyResponse>(
+            "/api/v1/user/update-api-key",
+          );
+          const created =
+            typeof createRes.data === "string"
+              ? createRes.data
+              : createRes.data.apiKey;
           if (typeof created === "string") setApiKey(created);
         } catch (createErr: unknown) {
-          setError(createErr instanceof Error ? createErr : new Error(String(createErr)));
+          setError(
+            createErr instanceof Error
+              ? createErr
+              : new Error(String(createErr)),
+          );
         }
       } else {
         setError(e instanceof Error ? e : new Error(String(e)));
@@ -46,7 +57,9 @@ export function useApiKey() {
     setIsRefreshing(true);
     setError(null);
     try {
-      const res = await apiClient.post<ApiKeyResponse>("/api/v1/user/update-api-key");
+      const res = await apiClient.post<ApiKeyResponse>(
+        "/api/v1/user/update-api-key",
+      );
       const value = typeof res.data === "string" ? res.data : res.data.apiKey;
       if (typeof value === "string") setApiKey(value);
     } catch (e: unknown) {
@@ -62,9 +75,15 @@ export function useApiKey() {
     }
   }, [loading, session, hasAttempted, isAnonymous, fetchKey]);
 
-  return { apiKey, isLoading, isRefreshing, error, refetch: fetchKey, refresh, hasAttempted } as const;
+  return {
+    apiKey,
+    isLoading,
+    isRefreshing,
+    error,
+    refetch: fetchKey,
+    refresh,
+    hasAttempted,
+  } as const;
 }
 
 export default useApiKey;
-
-
diff --git a/frontend/src/saas/components/shared/config/configSections/apiKeys/hooks/useCredits.ts b/frontend/src/saas/components/shared/config/configSections/apiKeys/hooks/useCredits.ts
index 20c0a93866..5de25063f4 100644
--- a/frontend/src/saas/components/shared/config/configSections/apiKeys/hooks/useCredits.ts
+++ b/frontend/src/saas/components/shared/config/configSections/apiKeys/hooks/useCredits.ts
@@ -13,24 +13,26 @@ function normalizeCredits(raw: Record<string, unknown>): ApiCredits {
   // Accept a variety of possible backend keys to be resilient
   return {
     weeklyCreditsRemaining: coerceNumber(
-      raw?.weeklyCreditsRemaining ?? raw?.weeklyRemaining ?? raw?.weekly_left
+      raw?.weeklyCreditsRemaining ?? raw?.weeklyRemaining ?? raw?.weekly_left,
     ),
     weeklyCreditsAllocated: coerceNumber(
-      raw?.weeklyCreditsAllocated ?? raw?.weeklyAllocated ?? raw?.weekly_total
+      raw?.weeklyCreditsAllocated ?? raw?.weeklyAllocated ?? raw?.weekly_total,
     ),
     boughtCreditsRemaining: coerceNumber(
-      raw?.boughtCreditsRemaining ?? raw?.boughtRemaining ?? raw?.bought_left
+      raw?.boughtCreditsRemaining ?? raw?.boughtRemaining ?? raw?.bought_left,
     ),
     totalBoughtCredits: coerceNumber(
-      raw?.totalBoughtCredits ?? raw?.boughtTotal ?? raw?.bought_total
+      raw?.totalBoughtCredits ?? raw?.boughtTotal ?? raw?.bought_total,
     ),
     totalAvailableCredits: coerceNumber(
-      raw?.totalAvailableCredits ?? raw?.totalRemaining ?? raw?.available_total
+      raw?.totalAvailableCredits ?? raw?.totalRemaining ?? raw?.available_total,
+    ),
+    weeklyResetDate: String(
+      raw?.weeklyResetDate ?? raw?.weeklyReset ?? raw?.reset_date ?? "",
+    ),
+    lastApiUsage: String(
+      raw?.lastApiUsage ?? raw?.lastApiUse ?? raw?.last_used_at ?? "",
     ),
-    weeklyResetDate:
-      String(raw?.weeklyResetDate ?? raw?.weeklyReset ?? raw?.reset_date ?? ""),
-    lastApiUsage:
-      String(raw?.lastApiUsage ?? raw?.lastApiUse ?? raw?.last_used_at ?? ""),
   };
 }
 
@@ -46,16 +48,18 @@ export function useCredits() {
     setIsLoading(true);
     setError(null);
     try {
-      const res = await apiClient.get<Record<string, unknown>>("/api/v1/credits");
+      const res =
+        await apiClient.get<Record<string, unknown>>("/api/v1/credits");
       const normalized = normalizeCredits(res.data);
       // If backend returns an "empty" payload, keep data null so the UI stays in loading/skeleton
-      const isEmpty = !normalized.weeklyCreditsAllocated &&
-                      !normalized.weeklyCreditsRemaining &&
-                      !normalized.totalBoughtCredits &&
-                      !normalized.boughtCreditsRemaining &&
-                      !normalized.totalAvailableCredits &&
-                      !normalized.weeklyResetDate &&
-                      !normalized.lastApiUsage;
+      const isEmpty =
+        !normalized.weeklyCreditsAllocated &&
+        !normalized.weeklyCreditsRemaining &&
+        !normalized.totalBoughtCredits &&
+        !normalized.boughtCreditsRemaining &&
+        !normalized.totalAvailableCredits &&
+        !normalized.weeklyResetDate &&
+        !normalized.lastApiUsage;
       setData(isEmpty ? null : normalized);
     } catch (e: unknown) {
       setError(e instanceof Error ? e : new Error(String(e)));
@@ -71,9 +75,13 @@ export function useCredits() {
     }
   }, [loading, session, hasAttempted, isAnonymous, fetchCredits]);
 
-  return { data, isLoading, error, refetch: fetchCredits, hasAttempted } as const;
+  return {
+    data,
+    isLoading,
+    error,
+    refetch: fetchCredits,
+    hasAttempted,
+  } as const;
 }
 
 export default useCredits;
-
-
diff --git a/frontend/src/saas/components/shared/config/configSections/plan/ActivePlanSection.tsx b/frontend/src/saas/components/shared/config/configSections/plan/ActivePlanSection.tsx
index 078baab1be..c3c18ecaab 100644
--- a/frontend/src/saas/components/shared/config/configSections/plan/ActivePlanSection.tsx
+++ b/frontend/src/saas/components/shared/config/configSections/plan/ActivePlanSection.tsx
@@ -1,10 +1,10 @@
-import React from 'react';
-import { Card, Text, Group, Flex, Alert, Button, Badge } from '@mantine/core';
-import AccessTimeIcon from '@mui/icons-material/AccessTime';
-import CreditCardIcon from '@mui/icons-material/CreditCard';
-import { useTranslation } from 'react-i18next';
-import { PlanTier } from '@app/hooks/usePlans';
-import { ManageBillingButton } from '@app/components/shared/ManageBillingButton';
+import React from "react";
+import { Card, Text, Group, Flex, Alert, Button, Badge } from "@mantine/core";
+import AccessTimeIcon from "@mui/icons-material/AccessTime";
+import CreditCardIcon from "@mui/icons-material/CreditCard";
+import { useTranslation } from "react-i18next";
+import { PlanTier } from "@app/hooks/usePlans";
+import { ManageBillingButton } from "@app/components/shared/ManageBillingButton";
 
 interface TrialStatus {
   isTrialing: boolean;
@@ -27,23 +27,35 @@ const ActivePlanSection: React.FC<ActivePlanSectionProps> = ({
   _activeSince,
   _nextBillingDate,
   trialStatus,
-  onAddPaymentClick
+  onAddPaymentClick,
 }) => {
   const { t } = useTranslation();
 
   return (
     <div>
       <Flex justify="space-between" align="center">
-        <h3 style={{ margin: 0, color: 'var(--mantine-color-text)', fontSize: '1rem' }}>
-          {t('plan.activePlan.title', 'Active Plan')}
+        <h3
+          style={{
+            margin: 0,
+            color: "var(--mantine-color-text)",
+            fontSize: "1rem",
+          }}
+        >
+          {t("plan.activePlan.title", "Active Plan")}
         </h3>
         <ManageBillingButton
           returnUrl={`${window.location.origin}/account`}
           trialStatus={trialStatus}
         />
       </Flex>
-      <p style={{ margin: '0.25rem 0 1rem 0', color: 'var(--mantine-color-dimmed)', fontSize: '0.875rem' }}>
-        {t('plan.activePlan.subtitle', 'Your current subscription details')}
+      <p
+        style={{
+          margin: "0.25rem 0 1rem 0",
+          color: "var(--mantine-color-dimmed)",
+          fontSize: "0.875rem",
+        }}
+      >
+        {t("plan.activePlan.subtitle", "Your current subscription details")}
       </p>
 
       {/* Trial Status Alert */}
@@ -53,23 +65,28 @@ const ActivePlanSection: React.FC<ActivePlanSectionProps> = ({
           icon={<AccessTimeIcon sx={{ fontSize: 16 }} />}
           mt="md"
           mb="md"
-          title={t('plan.trial.title', 'Free Trial Active')}
+          title={t("plan.trial.title", "Free Trial Active")}
         >
           <Text size="sm">
-            {t('plan.trial.daysRemaining', 'Your trial ends in {{days}} days', {
-              days: trialStatus.daysRemaining
+            {t("plan.trial.daysRemaining", "Your trial ends in {{days}} days", {
+              days: trialStatus.daysRemaining,
             })}
           </Text>
           <Text size="xs" c="dimmed">
-            {t('plan.trial.endDate', 'Expires: {{date}}', {
-              date: new Date(trialStatus.trialEnd).toLocaleDateString()
+            {t("plan.trial.endDate", "Expires: {{date}}", {
+              date: new Date(trialStatus.trialEnd).toLocaleDateString(),
             })}
           </Text>
           {trialStatus.hasScheduledSub ? (
             <Text size="xs" c="green" fw={500} mt="sm">
-              ✓ {t('plan.trial.subscriptionScheduled', 'Subscription scheduled - starts {{date}}', {
-                date: new Date(trialStatus.trialEnd).toLocaleDateString()
-              })}
+              ✓{" "}
+              {t(
+                "plan.trial.subscriptionScheduled",
+                "Subscription scheduled - starts {{date}}",
+                {
+                  date: new Date(trialStatus.trialEnd).toLocaleDateString(),
+                },
+              )}
             </Text>
           ) : (
             onAddPaymentClick && (
@@ -80,7 +97,7 @@ const ActivePlanSection: React.FC<ActivePlanSectionProps> = ({
                 onClick={onAddPaymentClick}
                 leftSection={<CreditCardIcon sx={{ fontSize: 14 }} />}
               >
-                {t('plan.trial.subscribeToPro', 'Subscribe to Pro')}
+                {t("plan.trial.subscribeToPro", "Subscribe to Pro")}
               </Button>
             )
           )}
@@ -96,7 +113,7 @@ const ActivePlanSection: React.FC<ActivePlanSectionProps> = ({
               </Text>
               {trialStatus?.isTrialing && (
                 <Badge color="blue" variant="light">
-                  {t('plan.trial.badge', 'Trial')}
+                  {t("plan.trial.badge", "Trial")}
                 </Badge>
               )}
             </Group>
@@ -108,7 +125,8 @@ const ActivePlanSection: React.FC<ActivePlanSectionProps> = ({
           </div>
           <div className="text-right">
             <Text size="xl" fw={700}>
-              {currentPlan.currency}{currentPlan.price}/month
+              {currentPlan.currency}
+              {currentPlan.price}/month
             </Text>
             {/* {nextBillingDate && (
               <Text size="sm" c="dimmed">
diff --git a/frontend/src/saas/components/shared/config/configSections/plan/ApiPackagesSection.tsx b/frontend/src/saas/components/shared/config/configSections/plan/ApiPackagesSection.tsx
index 678354afee..09e238be04 100644
--- a/frontend/src/saas/components/shared/config/configSections/plan/ApiPackagesSection.tsx
+++ b/frontend/src/saas/components/shared/config/configSections/plan/ApiPackagesSection.tsx
@@ -1,7 +1,7 @@
-import React from 'react';
-import { Button, Card, Text, Stack, Flex, Slider } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { CreditsPack } from '@app/components/shared/StripeCheckoutSaas';
+import React from "react";
+import { Button, Card, Text, Stack, Flex, Slider } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import { CreditsPack } from "@app/components/shared/StripeCheckoutSaas";
 
 interface ApiPackage {
   id: string;
@@ -23,17 +23,32 @@ const ApiPackagesSection: React.FC<ApiPackagesSectionProps> = ({
   apiPackages,
   selectedCredits,
   onSelectedCreditsChange,
-  onCreditPurchaseClick
+  onCreditPurchaseClick,
 }) => {
   const { t } = useTranslation();
 
   return (
     <div>
-      <h3 style={{ margin: 0, color: 'var(--mantine-color-text)', fontSize: '1rem' }}>
-        {t('plan.apiPackages.title', 'API Credit Packages')}
+      <h3
+        style={{
+          margin: 0,
+          color: "var(--mantine-color-text)",
+          fontSize: "1rem",
+        }}
+      >
+        {t("plan.apiPackages.title", "API Credit Packages")}
       </h3>
-      <p style={{ margin: '0.25rem 0 1rem 0', color: 'var(--mantine-color-dimmed)', fontSize: '0.875rem' }}>
-        {t('plan.apiPackages.subtitle', 'Purchase API credits for your applications')}
+      <p
+        style={{
+          margin: "0.25rem 0 1rem 0",
+          color: "var(--mantine-color-dimmed)",
+          fontSize: "0.875rem",
+        }}
+      >
+        {t(
+          "plan.apiPackages.subtitle",
+          "Purchase API credits for your applications",
+        )}
       </p>
 
       <Card padding="xl" radius="md" className="mb-4">
@@ -41,22 +56,24 @@ const ApiPackagesSection: React.FC<ApiPackagesSectionProps> = ({
           {/* Credits Selection */}
           <div>
             <Text size="lg" fw={600} mb="md">
-              {t('plan.selectCredits', 'Select Credit Amount')}
+              {t("plan.selectCredits", "Select Credit Amount")}
             </Text>
 
             <div className="px-4">
               <Slider
                 value={selectedCredits}
                 onChange={onSelectedCreditsChange}
-                onChangeEnd={(value) => onSelectedCreditsChange(Math.round(value))}
+                onChangeEnd={(value) =>
+                  onSelectedCreditsChange(Math.round(value))
+                }
                 min={0}
                 max={3}
                 step={0.01}
                 marks={[
-                  { value: 0, label: '100' },
-                  { value: 1, label: '500' },
-                  { value: 2, label: '1K' },
-                  { value: 3, label: '5K' }
+                  { value: 0, label: "100" },
+                  { value: 1, label: "500" },
+                  { value: 2, label: "1K" },
+                  { value: 3, label: "5K" },
                 ]}
                 size="lg"
                 className="mb-6"
@@ -69,7 +86,10 @@ const ApiPackagesSection: React.FC<ApiPackagesSectionProps> = ({
           <Flex gap={"xl"} justify="space-between" align="center">
             <div>
               <Text size="xl" fw={700}>
-                {apiPackages[Math.round(selectedCredits)].credits.toLocaleString()} Credits
+                {apiPackages[
+                  Math.round(selectedCredits)
+                ].credits.toLocaleString()}{" "}
+                Credits
               </Text>
               <Text size="sm" c="dimmed">
                 {apiPackages[Math.round(selectedCredits)].description}
@@ -78,18 +98,23 @@ const ApiPackagesSection: React.FC<ApiPackagesSectionProps> = ({
 
             <div className="">
               <Text size="xl" fw={700}>
-                {apiPackages[Math.round(selectedCredits)].currency}{apiPackages[Math.round(selectedCredits)].price}
+                {apiPackages[Math.round(selectedCredits)].currency}
+                {apiPackages[Math.round(selectedCredits)].price}
               </Text>
               <Text size="sm" c="dimmed">
-                {t('plan.totalCost', 'Total Cost')}
+                {t("plan.totalCost", "Total Cost")}
               </Text>
             </div>
 
             <Button
               size="lg"
-              onClick={() => onCreditPurchaseClick(apiPackages[Math.round(selectedCredits)].id as CreditsPack)}
+              onClick={() =>
+                onCreditPurchaseClick(
+                  apiPackages[Math.round(selectedCredits)].id as CreditsPack,
+                )
+              }
             >
-              {t('plan.purchase', 'Purchase')}
+              {t("plan.purchase", "Purchase")}
             </Button>
           </Flex>
         </Stack>
@@ -98,4 +123,4 @@ const ApiPackagesSection: React.FC<ApiPackagesSectionProps> = ({
   );
 };
 
-export default ApiPackagesSection;
\ No newline at end of file
+export default ApiPackagesSection;
diff --git a/frontend/src/saas/components/shared/config/configSections/plan/AvailablePlansSection.tsx b/frontend/src/saas/components/shared/config/configSections/plan/AvailablePlansSection.tsx
index c8fd19321a..3942636bd2 100644
--- a/frontend/src/saas/components/shared/config/configSections/plan/AvailablePlansSection.tsx
+++ b/frontend/src/saas/components/shared/config/configSections/plan/AvailablePlansSection.tsx
@@ -1,8 +1,8 @@
-import React, { useState } from 'react';
-import { Button, Card, Badge, Text, Collapse } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { PlanTier } from '@app/hooks/usePlans';
-import PlanCard from '@app/components/shared/config/configSections/plan/PlanCard';
+import React, { useState } from "react";
+import { Button, Card, Badge, Text, Collapse } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import { PlanTier } from "@app/hooks/usePlans";
+import PlanCard from "@app/components/shared/config/configSections/plan/PlanCard";
 
 interface AvailablePlansSectionProps {
   plans: PlanTier[];
@@ -19,24 +19,43 @@ interface AvailablePlansSectionProps {
 const AvailablePlansSection: React.FC<AvailablePlansSectionProps> = ({
   plans,
   currentPlan,
-  onUpgradeClick
+  onUpgradeClick,
 }) => {
   const { t } = useTranslation();
   const [showComparison, setShowComparison] = useState(false);
 
-  const isUserProOrAbove = currentPlan?.id === 'pro' || currentPlan?.id === 'enterprise';
+  const isUserProOrAbove =
+    currentPlan?.id === "pro" || currentPlan?.id === "enterprise";
 
   return (
     <div>
-      <h3 style={{ margin: 0, color: 'var(--mantine-color-text)', fontSize: '1rem' }}>
-        {t('plan.availablePlans.title', 'Available Plans')}
+      <h3
+        style={{
+          margin: 0,
+          color: "var(--mantine-color-text)",
+          fontSize: "1rem",
+        }}
+      >
+        {t("plan.availablePlans.title", "Available Plans")}
       </h3>
-      <p style={{ margin: '0.25rem 0 1rem 0', color: 'var(--mantine-color-dimmed)', fontSize: '0.875rem' }}>
-        {t('plan.availablePlans.subtitle', 'Choose the plan that fits your needs')}
+      <p
+        style={{
+          margin: "0.25rem 0 1rem 0",
+          color: "var(--mantine-color-dimmed)",
+          fontSize: "0.875rem",
+        }}
+      >
+        {t(
+          "plan.availablePlans.subtitle",
+          "Choose the plan that fits your needs",
+        )}
       </p>
 
-      <div className="flex h-[20rem] mb-4 " style={{ gap: '1rem', overflowX: 'auto' }}>
-        {plans.map(plan => (
+      <div
+        className="flex h-[20rem] mb-4 "
+        style={{ gap: "1rem", overflowX: "auto" }}
+      >
+        {plans.map((plan) => (
           <PlanCard
             key={plan.id}
             plan={plan}
@@ -53,41 +72,45 @@ const AvailablePlansSection: React.FC<AvailablePlansSectionProps> = ({
           onClick={() => setShowComparison(!showComparison)}
         >
           {showComparison
-            ? t('plan.hideComparison', 'Hide Feature Comparison')
-            : t('plan.showComparison', 'Compare All Features')
-          }
+            ? t("plan.hideComparison", "Hide Feature Comparison")
+            : t("plan.showComparison", "Compare All Features")}
         </Button>
       </div>
 
       <Collapse in={showComparison}>
         <Card padding="lg" radius="md" withBorder className="mt-4">
           <Text size="lg" fw={600} mb="md">
-            {t('plan.featureComparison', 'Feature Comparison')}
+            {t("plan.featureComparison", "Feature Comparison")}
           </Text>
 
           <div className="overflow-x-auto">
             <table className="w-full">
               <thead>
                 <tr className="border-b">
-                  <th className="text-left p-2">{t('plan.feature.title', 'Feature')}</th>
-                  {plans.map(plan => (
-                    <th key={plan.id} className="text-center p-2 min-w-24 relative">
+                  <th className="text-left p-2">
+                    {t("plan.feature.title", "Feature")}
+                  </th>
+                  {plans.map((plan) => (
+                    <th
+                      key={plan.id}
+                      className="text-center p-2 min-w-24 relative"
+                    >
                       {plan.name}
                       {plan.popular && (
                         <Badge
                           color="blue"
                           variant="filled"
                           style={{
-                            position: 'absolute',
-                            top: '0rem',
-                            right: '-2rem',
-                            fontSize: '0.5rem',
-                            fontWeight: '500',
-                            height: '1rem',
-                            padding: '0 0.1rem'
+                            position: "absolute",
+                            top: "0rem",
+                            right: "-2rem",
+                            fontSize: "0.5rem",
+                            fontWeight: "500",
+                            height: "1rem",
+                            padding: "0 0.1rem",
                           }}
                         >
-                          {t('plan.popular', 'Popular')}
+                          {t("plan.popular", "Popular")}
                         </Badge>
                       )}
                     </th>
@@ -100,10 +123,12 @@ const AvailablePlansSection: React.FC<AvailablePlansSectionProps> = ({
                     <td className="p-2">
                       {plans[0].features[featureIndex].name}
                     </td>
-                    {plans.map(plan => (
+                    {plans.map((plan) => (
                       <td key={plan.id} className="text-center p-2">
                         {plan.features[featureIndex].included ? (
-                          <Text c="green" fw={600}>✓</Text>
+                          <Text c="green" fw={600}>
+                            ✓
+                          </Text>
                         ) : (
                           <Text c="gray">-</Text>
                         )}
diff --git a/frontend/src/saas/components/shared/config/configSections/plan/PlanCard.tsx b/frontend/src/saas/components/shared/config/configSections/plan/PlanCard.tsx
index de02c959ab..6fde6ee497 100644
--- a/frontend/src/saas/components/shared/config/configSections/plan/PlanCard.tsx
+++ b/frontend/src/saas/components/shared/config/configSections/plan/PlanCard.tsx
@@ -1,17 +1,17 @@
-import React from 'react';
-import { Button, Card, Badge, Text, Group, Stack } from '@mantine/core';
-import { useTranslation } from 'react-i18next';
-import { PlanTier } from '@app/hooks/usePlans';
+import React from "react";
+import { Button, Card, Badge, Text, Group, Stack } from "@mantine/core";
+import { useTranslation } from "react-i18next";
+import { PlanTier } from "@app/hooks/usePlans";
 
 interface PlanCardProps {
   plan?: PlanTier;
-  planGroup?: { monthly?: PlanTier; yearly?: PlanTier };  // For proprietary PlanTierGroup compatibility
+  planGroup?: { monthly?: PlanTier; yearly?: PlanTier }; // For proprietary PlanTierGroup compatibility
   isCurrentPlan?: boolean;
   isCurrentTier?: boolean;
   isDowngrade?: boolean;
   isUserProOrAbove?: boolean;
   currentLicenseInfo?: unknown;
-  currentTier?: string | null;  // Accept null for proprietary compatibility
+  currentTier?: string | null; // Accept null for proprietary compatibility
   onUpgradeClick?: (plan: PlanTier) => void;
   onManageClick?: (plan: PlanTier) => void;
   loginEnabled?: boolean;
@@ -28,7 +28,7 @@ const PlanCard: React.FC<PlanCardProps> = ({
   currentTier: _currentTier,
   onUpgradeClick,
   onManageClick: _onManageClick,
-  loginEnabled: _loginEnabled
+  loginEnabled: _loginEnabled,
 }) => {
   // Use plan from props, or extract from planGroup if proprietary is using it
   const plan = propPlan || planGroup?.monthly || planGroup?.yearly;
@@ -36,26 +36,36 @@ const PlanCard: React.FC<PlanCardProps> = ({
 
   if (!plan) return null; // Safety check
 
-  const shouldHideUpgrade = plan.id === 'free' && isUserProOrAbove;
+  const shouldHideUpgrade = plan.id === "free" && isUserProOrAbove;
 
   return (
-    <Card key={plan.id} padding="lg" radius="sm" withBorder className="h-full w-[33%] relative">
+    <Card
+      key={plan.id}
+      padding="lg"
+      radius="sm"
+      withBorder
+      className="h-full w-[33%] relative"
+    >
       {plan.popular && (
         <Badge
           variant="filled"
-          size='xs'
-          style={{ position: 'absolute', top: '0.5rem', right: '0.5rem' }}
+          size="xs"
+          style={{ position: "absolute", top: "0.5rem", right: "0.5rem" }}
         >
-          {t('plan.popular', 'Popular')}
+          {t("plan.popular", "Popular")}
         </Badge>
       )}
 
       <Stack gap="md" className="h-full">
         <div>
-          <Text size="lg" fw={600}>{plan.name}</Text>
+          <Text size="lg" fw={600}>
+            {plan.name}
+          </Text>
           <Group gap="xs" align="baseline">
             <Text size="2xl" fw={700}>
-              {plan.isContactOnly ? t('plan.customPricing', 'Custom') : `${plan.currency}${plan.price}`}
+              {plan.isContactOnly
+                ? t("plan.customPricing", "Custom")
+                : `${plan.currency}${plan.price}`}
             </Text>
             {!plan.isContactOnly && (
               <Text size="sm" c="dimmed">
@@ -77,17 +87,22 @@ const PlanCard: React.FC<PlanCardProps> = ({
 
         {!shouldHideUpgrade && (
           <Button
-            variant={isCurrentPlan ? "filled" : plan.isContactOnly ? "outline" : "filled"}
+            variant={
+              isCurrentPlan
+                ? "filled"
+                : plan.isContactOnly
+                  ? "outline"
+                  : "filled"
+            }
             disabled={isCurrentPlan}
             fullWidth
             onClick={() => onUpgradeClick?.(plan)}
           >
             {isCurrentPlan
-              ? t('plan.current', 'Current Plan')
+              ? t("plan.current", "Current Plan")
               : plan.isContactOnly
-              ? t('plan.contact', 'Get in Touch')
-              : t('plan.upgrade', 'Upgrade')
-            }
+                ? t("plan.contact", "Get in Touch")
+                : t("plan.upgrade", "Upgrade")}
           </Button>
         )}
       </Stack>
diff --git a/frontend/src/saas/components/shared/config/saasConfigNavSections.tsx b/frontend/src/saas/components/shared/config/saasConfigNavSections.tsx
index 9a0db25aa0..5dd293451b 100644
--- a/frontend/src/saas/components/shared/config/saasConfigNavSections.tsx
+++ b/frontend/src/saas/components/shared/config/saasConfigNavSections.tsx
@@ -1,42 +1,46 @@
-import React from 'react';
-import { type TFunction } from 'i18next';
+import React from "react";
+import { type TFunction } from "i18next";
 import {
   createConfigNavSections as createCoreConfigNavSections,
   type ConfigNavSection,
-} from '@core/components/shared/config/configNavSections';
-import HotkeysSection from '@app/components/shared/config/configSections/HotkeysSection';
-import GeneralSection from '@app/components/shared/config/configSections/GeneralSection';
-import PasswordSecurity from '@app/components/shared/config/configSections/PasswordSecurity';
-import ApiKeys from '@app/components/shared/config/configSections/ApiKeys';
-import Plan from '@app/components/shared/config/configSections/Plan';
+} from "@core/components/shared/config/configNavSections";
+import HotkeysSection from "@app/components/shared/config/configSections/HotkeysSection";
+import GeneralSection from "@app/components/shared/config/configSections/GeneralSection";
+import PasswordSecurity from "@app/components/shared/config/configSections/PasswordSecurity";
+import ApiKeys from "@app/components/shared/config/configSections/ApiKeys";
+import Plan from "@app/components/shared/config/configSections/Plan";
 
 type OverviewComponent = React.ComponentType<{ onLogoutClick: () => void }>;
 
 interface CreateSaasConfigNavSectionsOptions {
   isDev?: boolean;
   isAnonymous?: boolean;
-  t: TFunction<'translation', undefined>;
+  t: TFunction<"translation", undefined>;
 }
 
-function ensurePreferencesSection(sections: ConfigNavSection[]): ConfigNavSection[] {
-  const preferencesIndex = sections.findIndex(section => section.title === 'Preferences');
+function ensurePreferencesSection(
+  sections: ConfigNavSection[],
+): ConfigNavSection[] {
+  const preferencesIndex = sections.findIndex(
+    (section) => section.title === "Preferences",
+  );
 
   if (preferencesIndex === -1) {
     return [
       ...sections,
       {
-        title: 'Preferences',
+        title: "Preferences",
         items: [
           {
-            key: 'general',
-            label: 'General',
-            icon: 'settings-rounded',
+            key: "general",
+            label: "General",
+            icon: "settings-rounded",
             component: <GeneralSection />,
           },
           {
-            key: 'hotkeys',
-            label: 'Keyboard Shortcuts',
-            icon: 'keyboard-rounded',
+            key: "hotkeys",
+            label: "Keyboard Shortcuts",
+            icon: "keyboard-rounded",
             component: <HotkeysSection />,
           },
         ],
@@ -47,9 +51,13 @@ function ensurePreferencesSection(sections: ConfigNavSection[]): ConfigNavSectio
   return sections;
 }
 
-function appendDeveloperSection(sections: ConfigNavSection[]): ConfigNavSection[] {
-  const hasDeveloper = sections.some(section =>
-    section.items.some(item => item.key === 'developer' || item.key === 'api-keys'),
+function appendDeveloperSection(
+  sections: ConfigNavSection[],
+): ConfigNavSection[] {
+  const hasDeveloper = sections.some((section) =>
+    section.items.some(
+      (item) => item.key === "developer" || item.key === "api-keys",
+    ),
   );
 
   if (hasDeveloper) {
@@ -59,12 +67,12 @@ function appendDeveloperSection(sections: ConfigNavSection[]): ConfigNavSection[
   return [
     ...sections,
     {
-      title: 'Developer',
+      title: "Developer",
       items: [
         {
-          key: 'api-keys',
-          label: 'API Keys',
-          icon: 'key-rounded',
+          key: "api-keys",
+          label: "API Keys",
+          icon: "key-rounded",
           component: <ApiKeys />,
         },
       ],
@@ -74,10 +82,10 @@ function appendDeveloperSection(sections: ConfigNavSection[]): ConfigNavSection[
 
 function appendBillingSection(
   sections: ConfigNavSection[],
-  t: TFunction<'translation', undefined>,
+  t: TFunction<"translation", undefined>,
 ): ConfigNavSection[] {
-  const hasPlan = sections.some(section =>
-    section.items.some(item => item.key === 'plan'),
+  const hasPlan = sections.some((section) =>
+    section.items.some((item) => item.key === "plan"),
   );
 
   if (hasPlan) {
@@ -87,12 +95,12 @@ function appendBillingSection(
   return [
     ...sections,
     {
-      title: 'Billing',
+      title: "Billing",
       items: [
         {
-          key: 'plan',
-          label: t('config.plan', 'Plan'),
-          icon: 'credit-card',
+          key: "plan",
+          label: t("config.plan", "Plan"),
+          icon: "credit-card",
           component: <Plan />,
         },
       ],
@@ -109,18 +117,18 @@ export function createSaasConfigNavSections(
 
   // Create Account section as the first section with Overview and Passwords & Security
   const accountSection: ConfigNavSection = {
-    title: t('config.account.overview.title', 'Account Settings'),
+    title: t("config.account.overview.title", "Account Settings"),
     items: [
       {
-        key: 'overview',
-        label: t('config.account.overview.label', 'Overview'),
-        icon: 'account-circle',
+        key: "overview",
+        label: t("config.account.overview.label", "Overview"),
+        icon: "account-circle",
         component: <Overview onLogoutClick={onLogoutClick} />,
       },
       {
-        key: 'security',
-        label: 'Passwords & Security',
-        icon: 'lock',
+        key: "security",
+        label: "Passwords & Security",
+        icon: "lock",
         component: <PasswordSecurity />,
       },
     ],
@@ -129,12 +137,15 @@ export function createSaasConfigNavSections(
   let sections = [accountSection, ...baseSections];
 
   // Suppress OSS-only sections (update checker, login config banner) not relevant in SaaS
-  sections = sections.map(section => ({
+  sections = sections.map((section) => ({
     ...section,
-    items: section.items.map(item =>
-      item.key === 'general'
-        ? { ...item, component: <GeneralSection hideUpdateSection hideAdminBanner /> }
-        : item
+    items: section.items.map((item) =>
+      item.key === "general"
+        ? {
+            ...item,
+            component: <GeneralSection hideUpdateSection hideAdminBanner />,
+          }
+        : item,
     ),
   }));
 
@@ -146,7 +157,7 @@ export function createSaasConfigNavSections(
   }
 
   if (isDev) {
-    console.debug('[AppConfigModal] SaaS navigation sections', sections);
+    console.debug("[AppConfigModal] SaaS navigation sections", sections);
   }
 
   return sections;
diff --git a/frontend/src/saas/components/shared/config/types.ts b/frontend/src/saas/components/shared/config/types.ts
index dded2ce227..51a309fc45 100644
--- a/frontend/src/saas/components/shared/config/types.ts
+++ b/frontend/src/saas/components/shared/config/types.ts
@@ -1,67 +1,67 @@
 // Re-export from core for compatibility
 // Override VALID_NAV_KEYS to include saas-specific keys
 export const VALID_NAV_KEYS = [
-  'overview',
-  'password-security',
-  'preferences',
-  'notifications',
-  'connections',
-  'general',
-  'people',
-  'teams',
-  'security',
-  'identity',
-  'plan',
-  'payments',
-  'requests',
-  'developer',
-  'api-keys',
-  'hotkeys',
-  'adminGeneral',
-  'adminSecurity',
-  'adminConnections',
-  'adminPrivacy',
-  'adminDatabase',
-  'adminAdvanced',
-  'adminLegal',
-  'adminPremium',
-  'adminFeatures',
-  'adminPlan',
-  'adminAudit',
-  'adminUsage',
-  'adminEndpoints'
+  "overview",
+  "password-security",
+  "preferences",
+  "notifications",
+  "connections",
+  "general",
+  "people",
+  "teams",
+  "security",
+  "identity",
+  "plan",
+  "payments",
+  "requests",
+  "developer",
+  "api-keys",
+  "hotkeys",
+  "adminGeneral",
+  "adminSecurity",
+  "adminConnections",
+  "adminPrivacy",
+  "adminDatabase",
+  "adminAdvanced",
+  "adminLegal",
+  "adminPremium",
+  "adminFeatures",
+  "adminPlan",
+  "adminAudit",
+  "adminUsage",
+  "adminEndpoints",
 ] as const;
 
 // Extend NavKey to include saas-specific keys
 export type NavKey =
-  | 'overview'
-  | 'password-security'
-  | 'preferences'
-  | 'notifications'
-  | 'connections'
-  | 'general'
-  | 'people'
-  | 'teams'
-  | 'security'
-  | 'identity'
-  | 'plan'
-  | 'payments'
-  | 'requests'
-  | 'developer'
-  | 'api-keys'
-  | 'hotkeys'
-  | 'adminGeneral'
-  | 'adminSecurity'
-  | 'adminConnections'
-  | 'adminPrivacy'
-  | 'adminDatabase'
-  | 'adminAdvanced'
-  | 'adminLegal'
-  | 'adminPremium'
-  | 'adminFeatures'
-  | 'adminPlan'
-  | 'adminAudit'
-  | 'adminUsage'
-  | 'adminEndpoints';
+  | "overview"
+  | "password-security"
+  | "preferences"
+  | "notifications"
+  | "connections"
+  | "general"
+  | "people"
+  | "teams"
+  | "security"
+  | "identity"
+  | "plan"
+  | "payments"
+  | "requests"
+  | "developer"
+  | "api-keys"
+  | "hotkeys"
+  | "adminGeneral"
+  | "adminSecurity"
+  | "adminConnections"
+  | "adminPrivacy"
+  | "adminDatabase"
+  | "adminAdvanced"
+  | "adminLegal"
+  | "adminPremium"
+  | "adminFeatures"
+  | "adminPlan"
+  | "adminAudit"
+  | "adminUsage"
+  | "adminEndpoints";
 
-// some of these are not used yet, but appear in figma designs
\ No newline at end of file
+// some of these are not used yet, but appear in figma designs
diff --git a/frontend/src/saas/components/shared/utils/date.ts b/frontend/src/saas/components/shared/utils/date.ts
index c3926f1add..dd44c902ff 100644
--- a/frontend/src/saas/components/shared/utils/date.ts
+++ b/frontend/src/saas/components/shared/utils/date.ts
@@ -10,5 +10,3 @@ export function formatUTC(iso: string, withTime: boolean): string {
   }).format(date);
   return withTime ? `${formatted} UTC` : formatted;
 }
-
-
diff --git a/frontend/src/saas/components/tools/sign/SignSettings.tsx b/frontend/src/saas/components/tools/sign/SignSettings.tsx
index 1603728aa2..c2508aac9d 100644
--- a/frontend/src/saas/components/tools/sign/SignSettings.tsx
+++ b/frontend/src/saas/components/tools/sign/SignSettings.tsx
@@ -1,11 +1,25 @@
-import { useState, useEffect, useMemo, useRef, useCallback } from 'react';
+import { useState, useEffect, useMemo, useRef, useCallback } from "react";
 import { useTranslation } from "react-i18next";
-import { Stack, Button, Text, Alert, SegmentedControl, Divider, ActionIcon, Tooltip, Group, Box } from '@mantine/core';
+import {
+  Stack,
+  Button,
+  Text,
+  Alert,
+  SegmentedControl,
+  Divider,
+  ActionIcon,
+  Tooltip,
+  Group,
+  Box,
+} from "@mantine/core";
 import { SignParameters } from "@app/hooks/tools/sign/useSignParameters";
 import { SuggestedToolsSection } from "@app/components/tools/shared/SuggestedToolsSection";
 import { useSignature } from "@app/contexts/SignatureContext";
 import { useViewer } from "@app/contexts/ViewerContext";
-import { PLACEMENT_ACTIVATION_DELAY, FILE_SWITCH_ACTIVATION_DELAY } from '@app/constants/signConstants';
+import {
+  PLACEMENT_ACTIVATION_DELAY,
+  FILE_SWITCH_ACTIVATION_DELAY,
+} from "@app/constants/signConstants";
 
 // Import the new reusable components
 import { DrawingCanvas } from "@app/components/annotation/shared/DrawingCanvas";
@@ -14,9 +28,15 @@ import { ImageUploader } from "@app/components/annotation/shared/ImageUploader";
 import { TextInputWithFont } from "@app/components/annotation/shared/TextInputWithFont";
 import { ColorPicker } from "@app/components/annotation/shared/ColorPicker";
 import { LocalIcon } from "@app/components/shared/LocalIcon";
-import { useSavedSignatures, SavedSignature, SavedSignaturePayload, SavedSignatureType, AddSignatureResult } from '@app/hooks/tools/sign/useSavedSignatures';
-import { SavedSignaturesSection } from '@app/components/tools/sign/SavedSignaturesSection';
-import { buildSignaturePreview } from '@app/utils/signaturePreview';
+import {
+  useSavedSignatures,
+  SavedSignature,
+  SavedSignaturePayload,
+  SavedSignatureType,
+  AddSignatureResult,
+} from "@app/hooks/tools/sign/useSavedSignatures";
+import { SavedSignaturesSection } from "@app/components/tools/sign/SavedSignaturesSection";
+import { buildSignaturePreview } from "@app/utils/signaturePreview";
 
 type SignatureDrafts = {
   canvas?: string;
@@ -31,7 +51,10 @@ type SignatureDrafts = {
 
 interface SignSettingsProps {
   parameters: SignParameters;
-  onParameterChange: <K extends keyof SignParameters>(key: K, value: SignParameters[K]) => void;
+  onParameterChange: <K extends keyof SignParameters>(
+    key: K,
+    value: SignParameters[K],
+  ) => void;
   disabled?: boolean;
   onActivateDrawMode?: () => void;
   onActivateSignaturePlacement?: () => void;
@@ -45,9 +68,14 @@ interface SignSettingsProps {
   defaultSignatureSource?: SignatureSource;
 }
 
-export type SignatureSource = 'canvas' | 'image' | 'text' | 'saved';
+export type SignatureSource = "canvas" | "image" | "text" | "saved";
 
-const DEFAULT_SIGNATURE_SOURCES: SignatureSource[] = ['canvas', 'image', 'text', 'saved'];
+const DEFAULT_SIGNATURE_SOURCES: SignatureSource[] = [
+  "canvas",
+  "image",
+  "text",
+  "saved",
+];
 
 const SignSettings = ({
   parameters,
@@ -59,38 +87,47 @@ const SignSettings = ({
   onUndo,
   onRedo,
   onSave,
-  translationScope = 'sign',
+  translationScope = "sign",
   allowedSignatureSources = DEFAULT_SIGNATURE_SOURCES,
   defaultSignatureSource,
 }: SignSettingsProps) => {
   const { t } = useTranslation();
   const { isPlacementMode, signaturesApplied, historyApiRef } = useSignature();
   const { activeFileIndex } = useViewer();
-  const [historyAvailability, setHistoryAvailability] = useState({ canUndo: false, canRedo: false });
+  const [historyAvailability, setHistoryAvailability] = useState({
+    canUndo: false,
+    canRedo: false,
+  });
   const historyApiInstance = historyApiRef.current;
   const translate = useCallback(
     (key: string, defaultValue: string, options?: Record<string, unknown>) =>
       t(`${translationScope}.${key}`, { defaultValue, ...options }),
-    [t, translationScope]
+    [t, translationScope],
   );
   const effectiveDefaultSource =
-    (defaultSignatureSource && allowedSignatureSources.includes(defaultSignatureSource)
+    (defaultSignatureSource &&
+    allowedSignatureSources.includes(defaultSignatureSource)
       ? defaultSignatureSource
-      : allowedSignatureSources[0]) ?? 'text';
-  const canUseSavedLibrary = allowedSignatureSources.includes('saved');
+      : allowedSignatureSources[0]) ?? "text";
+  const canUseSavedLibrary = allowedSignatureSources.includes("saved");
 
   // State for drawing
-  const [selectedColor, setSelectedColor] = useState('#000000');
+  const [selectedColor, setSelectedColor] = useState("#000000");
   const [penSize, setPenSize] = useState(2);
-  const [penSizeInput, setPenSizeInput] = useState('2');
+  const [penSizeInput, setPenSizeInput] = useState("2");
   const [isColorPickerOpen, setIsColorPickerOpen] = useState(false);
-  const [isPlacementManuallyPaused, setPlacementManuallyPaused] = useState(false);
+  const [isPlacementManuallyPaused, setPlacementManuallyPaused] =
+    useState(false);
 
   // State for different signature types
-  const [canvasSignatureData, setCanvasSignatureData] = useState<string | undefined>();
-  const [imageSignatureData, setImageSignatureData] = useState<string | undefined>();
+  const [canvasSignatureData, setCanvasSignatureData] = useState<
+    string | undefined
+  >();
+  const [imageSignatureData, setImageSignatureData] = useState<
+    string | undefined
+  >();
   const [signatureDrafts, setSignatureDrafts] = useState<SignatureDrafts>({});
-  const lastSyncedTextDraft = useRef<SignatureDrafts['text'] | null>(null);
+  const lastSyncedTextDraft = useRef<SignatureDrafts["text"] | null>(null);
   const lastAppliedPlacementKey = useRef<string | null>(null);
   const previousFileIndexRef = useRef(activeFileIndex);
   const {
@@ -103,178 +140,224 @@ const SignSettings = ({
     byTypeCounts,
     storageType,
   } = useSavedSignatures();
-  const [signatureSource, setSignatureSource] = useState<SignatureSource>(() => {
-    const paramSource = parameters.signatureType as SignatureSource;
-    if (allowedSignatureSources.includes(paramSource)) {
-      return paramSource;
-    }
-    return effectiveDefaultSource;
-  });
-  const [lastSavedSignatureKeys, setLastSavedSignatureKeys] = useState<Record<SavedSignatureType, string | null>>({
+  const [signatureSource, setSignatureSource] = useState<SignatureSource>(
+    () => {
+      const paramSource = parameters.signatureType as SignatureSource;
+      if (allowedSignatureSources.includes(paramSource)) {
+        return paramSource;
+      }
+      return effectiveDefaultSource;
+    },
+  );
+  const [lastSavedSignatureKeys, setLastSavedSignatureKeys] = useState<
+    Record<SavedSignatureType, string | null>
+  >({
     canvas: null,
     image: null,
     text: null,
   });
 
   const buildTextSignatureKey = useCallback(
-    (signerName: string, fontSize: number, fontFamily: string, textColor: string) =>
+    (
+      signerName: string,
+      fontSize: number,
+      fontFamily: string,
+      textColor: string,
+    ) =>
       JSON.stringify({
         signerName: signerName.trim(),
         fontSize,
         fontFamily,
         textColor,
       }),
-    []
+    [],
   );
 
   const getDefaultSavedLabel = useCallback(
     (type: SavedSignatureType) => {
       const nextIndex = (byTypeCounts[type] ?? 0) + 1;
-      let baseLabel = translate('saved.defaultLabel', 'Signature');
-      if (type === 'canvas') {
-        baseLabel = translate('saved.defaultCanvasLabel', 'Drawing signature');
-      } else if (type === 'image') {
-        baseLabel = translate('saved.defaultImageLabel', 'Uploaded signature');
-      } else if (type === 'text') {
-        baseLabel = translate('saved.defaultTextLabel', 'Typed signature');
+      let baseLabel = translate("saved.defaultLabel", "Signature");
+      if (type === "canvas") {
+        baseLabel = translate("saved.defaultCanvasLabel", "Drawing signature");
+      } else if (type === "image") {
+        baseLabel = translate("saved.defaultImageLabel", "Uploaded signature");
+      } else if (type === "text") {
+        baseLabel = translate("saved.defaultTextLabel", "Typed signature");
       }
       return `${baseLabel} ${nextIndex}`;
     },
-    [byTypeCounts, t, translate]
+    [byTypeCounts, t, translate],
   );
 
   const signatureKeysByType = useMemo(() => {
     const canvasKey = canvasSignatureData ?? null;
     const imageKey = imageSignatureData ?? null;
     const textKey = buildTextSignatureKey(
-      parameters.signerName ?? '',
+      parameters.signerName ?? "",
       parameters.fontSize ?? 16,
-      parameters.fontFamily ?? 'Helvetica',
-      parameters.textColor ?? '#000000'
+      parameters.fontFamily ?? "Helvetica",
+      parameters.textColor ?? "#000000",
     );
     return {
       canvas: canvasKey,
       image: imageKey,
       text: textKey,
     };
-  }, [canvasSignatureData, imageSignatureData, buildTextSignatureKey, parameters.signerName, parameters.fontSize, parameters.fontFamily, parameters.textColor]);
+  }, [
+    canvasSignatureData,
+    imageSignatureData,
+    buildTextSignatureKey,
+    parameters.signerName,
+    parameters.fontSize,
+    parameters.fontFamily,
+    parameters.textColor,
+  ]);
 
   const saveSignatureToLibrary = useCallback(
-    async (payload: SavedSignaturePayload, type: SavedSignatureType, scope: 'personal' | 'shared'): Promise<AddSignatureResult> => {
+    async (
+      payload: SavedSignaturePayload,
+      type: SavedSignatureType,
+      scope: "personal" | "shared",
+    ): Promise<AddSignatureResult> => {
       if (isSavedSignatureLimitReached) {
-        return { success: false, reason: 'limit' };
+        return { success: false, reason: "limit" };
       }
       return await addSignature(payload, getDefaultSavedLabel(type), scope);
     },
-    [addSignature, getDefaultSavedLabel, isSavedSignatureLimitReached]
+    [addSignature, getDefaultSavedLabel, isSavedSignatureLimitReached],
   );
 
   const setLastSavedKeyForType = useCallback(
     (type: SavedSignatureType, explicitKey?: string | null) => {
-      setLastSavedSignatureKeys(prev => ({
+      setLastSavedSignatureKeys((prev) => ({
         ...prev,
-        [type]: explicitKey !== undefined ? explicitKey : signatureKeysByType[type] ?? null,
+        [type]:
+          explicitKey !== undefined
+            ? explicitKey
+            : (signatureKeysByType[type] ?? null),
       }));
     },
-    [signatureKeysByType]
+    [signatureKeysByType],
   );
 
-  const handleSaveCanvasSignature = useCallback(async (scope: 'personal' | 'shared') => {
-    if (!canvasSignatureData) {
-      return;
-    }
-    const result = await saveSignatureToLibrary({ type: 'canvas', dataUrl: canvasSignatureData }, 'canvas', scope);
-    if (result.success) {
-      setLastSavedKeyForType('canvas');
-    }
-  }, [canvasSignatureData, saveSignatureToLibrary, setLastSavedKeyForType]);
+  const handleSaveCanvasSignature = useCallback(
+    async (scope: "personal" | "shared") => {
+      if (!canvasSignatureData) {
+        return;
+      }
+      const result = await saveSignatureToLibrary(
+        { type: "canvas", dataUrl: canvasSignatureData },
+        "canvas",
+        scope,
+      );
+      if (result.success) {
+        setLastSavedKeyForType("canvas");
+      }
+    },
+    [canvasSignatureData, saveSignatureToLibrary, setLastSavedKeyForType],
+  );
 
-  const handleSaveImageSignature = useCallback(async (scope: 'personal' | 'shared') => {
-    if (!imageSignatureData) {
-      return;
-    }
-    const result = await saveSignatureToLibrary({ type: 'image', dataUrl: imageSignatureData }, 'image', scope);
-    if (result.success) {
-      setLastSavedKeyForType('image');
-    }
-  }, [imageSignatureData, saveSignatureToLibrary, setLastSavedKeyForType]);
+  const handleSaveImageSignature = useCallback(
+    async (scope: "personal" | "shared") => {
+      if (!imageSignatureData) {
+        return;
+      }
+      const result = await saveSignatureToLibrary(
+        { type: "image", dataUrl: imageSignatureData },
+        "image",
+        scope,
+      );
+      if (result.success) {
+        setLastSavedKeyForType("image");
+      }
+    },
+    [imageSignatureData, saveSignatureToLibrary, setLastSavedKeyForType],
+  );
 
-  const handleSaveTextSignature = useCallback(async (scope: 'personal' | 'shared') => {
-    const signerName = (parameters.signerName ?? '').trim();
-    if (!signerName) {
-      return;
-    }
+  const handleSaveTextSignature = useCallback(
+    async (scope: "personal" | "shared") => {
+      const signerName = (parameters.signerName ?? "").trim();
+      if (!signerName) {
+        return;
+      }
 
-    // Generate image from text signature
-    const preview = await buildSignaturePreview({
-      signatureType: 'text',
-      signerName,
-      fontFamily: parameters.fontFamily ?? 'Helvetica',
-      fontSize: parameters.fontSize ?? 16,
-      textColor: parameters.textColor ?? '#000000',
-    });
-
-    if (!preview?.dataUrl) {
-      console.error('Failed to generate text signature preview');
-      return;
-    }
-
-    const result = await saveSignatureToLibrary(
-      {
-        type: 'text',
-        dataUrl: preview.dataUrl,
+      // Generate image from text signature
+      const preview = await buildSignaturePreview({
+        signatureType: "text",
         signerName,
-        fontFamily: parameters.fontFamily ?? 'Helvetica',
+        fontFamily: parameters.fontFamily ?? "Helvetica",
         fontSize: parameters.fontSize ?? 16,
-        textColor: parameters.textColor ?? '#000000',
-      },
-      'text',
-      scope
-    );
-    if (result.success) {
-      setLastSavedKeyForType('text');
-    }
-  }, [
-    parameters.fontFamily,
-    parameters.fontSize,
-    parameters.signerName,
-    parameters.textColor,
-    saveSignatureToLibrary,
-    setLastSavedKeyForType,
-  ]);
+        textColor: parameters.textColor ?? "#000000",
+      });
+
+      if (!preview?.dataUrl) {
+        console.error("Failed to generate text signature preview");
+        return;
+      }
+
+      const result = await saveSignatureToLibrary(
+        {
+          type: "text",
+          dataUrl: preview.dataUrl,
+          signerName,
+          fontFamily: parameters.fontFamily ?? "Helvetica",
+          fontSize: parameters.fontSize ?? 16,
+          textColor: parameters.textColor ?? "#000000",
+        },
+        "text",
+        scope,
+      );
+      if (result.success) {
+        setLastSavedKeyForType("text");
+      }
+    },
+    [
+      parameters.fontFamily,
+      parameters.fontSize,
+      parameters.signerName,
+      parameters.textColor,
+      saveSignatureToLibrary,
+      setLastSavedKeyForType,
+    ],
+  );
 
   const handleUseSavedSignature = useCallback(
     (signature: SavedSignature) => {
       setPlacementManuallyPaused(false);
 
-      if (signature.type === 'canvas') {
-        if (parameters.signatureType !== 'canvas') {
-          onParameterChange('signatureType', 'canvas');
+      if (signature.type === "canvas") {
+        if (parameters.signatureType !== "canvas") {
+          onParameterChange("signatureType", "canvas");
         }
         setCanvasSignatureData(signature.dataUrl);
-      } else if (signature.type === 'image') {
-        if (parameters.signatureType !== 'image') {
-          onParameterChange('signatureType', 'image');
+      } else if (signature.type === "image") {
+        if (parameters.signatureType !== "image") {
+          onParameterChange("signatureType", "image");
         }
         setImageSignatureData(signature.dataUrl);
-      } else if (signature.type === 'text') {
-        if (parameters.signatureType !== 'text') {
-          onParameterChange('signatureType', 'text');
+      } else if (signature.type === "text") {
+        if (parameters.signatureType !== "text") {
+          onParameterChange("signatureType", "text");
         }
-        onParameterChange('signerName', signature.signerName);
-        onParameterChange('fontFamily', signature.fontFamily);
-        onParameterChange('fontSize', signature.fontSize);
-        onParameterChange('textColor', signature.textColor);
+        onParameterChange("signerName", signature.signerName);
+        onParameterChange("fontFamily", signature.fontFamily);
+        onParameterChange("fontSize", signature.fontSize);
+        onParameterChange("textColor", signature.textColor);
       }
 
       const savedKey =
-        signature.type === 'text'
-          ? buildTextSignatureKey(signature.signerName, signature.fontSize, signature.fontFamily, signature.textColor)
+        signature.type === "text"
+          ? buildTextSignatureKey(
+              signature.signerName,
+              signature.fontSize,
+              signature.fontFamily,
+              signature.textColor,
+            )
           : signature.dataUrl;
       setLastSavedKeyForType(signature.type, savedKey);
 
       const activate = () => onActivateSignaturePlacement?.();
-      if (typeof window !== 'undefined') {
+      if (typeof window !== "undefined") {
         window.setTimeout(activate, PLACEMENT_ACTIVATION_DELAY);
       } else {
         activate();
@@ -289,24 +372,32 @@ const SignSettings = ({
       setImageSignatureData,
       setPlacementManuallyPaused,
       setLastSavedKeyForType,
-    ]
+    ],
   );
 
   const handleDeleteSavedSignature = useCallback(
     (signature: SavedSignature) => {
       removeSignature(signature.id);
     },
-    [removeSignature]
+    [removeSignature],
   );
 
   const handleRenameSavedSignature = useCallback(
     (id: string, label: string) => {
       updateSignatureLabel(id, label);
     },
-    [updateSignatureLabel]
+    [updateSignatureLabel],
   );
 
-  const renderSaveButton = (type: SavedSignatureType, isReady: boolean, onClick: (scope: 'personal' | 'shared') => void, scope: 'personal' | 'shared', icon: string, label: string, fullWidth: boolean = false) => {
+  const renderSaveButton = (
+    type: SavedSignatureType,
+    isReady: boolean,
+    onClick: (scope: "personal" | "shared") => void,
+    scope: "personal" | "shared",
+    icon: string,
+    label: string,
+    fullWidth: boolean = false,
+  ) => {
     if (!canUseSavedLibrary) {
       return null;
     }
@@ -317,33 +408,46 @@ const SignSettings = ({
 
     // SaaS-specific: For localStorage, only show personal button (no shared storage)
     // Hide shared button when using localStorage
-    if (storageType === 'localStorage' && scope === 'shared') {
+    if (storageType === "localStorage" && scope === "shared") {
       return null;
     }
 
     let tooltipMessage: string | undefined;
     if (!isReady) {
-      tooltipMessage = translate('saved.saveUnavailable', 'Create a signature first to save it.');
+      tooltipMessage = translate(
+        "saved.saveUnavailable",
+        "Create a signature first to save it.",
+      );
     } else if (isSaved) {
-      tooltipMessage = translate('saved.noChanges', 'Current signature is already saved.');
+      tooltipMessage = translate(
+        "saved.noChanges",
+        "Current signature is already saved.",
+      );
     } else if (isSavedSignatureLimitReached) {
-      tooltipMessage = translate('saved.limitDescription', 'Remove a saved signature before adding new ones (max {{max}}).', {
-        max: maxLimit,
-      });
+      tooltipMessage = translate(
+        "saved.limitDescription",
+        "Remove a saved signature before adding new ones (max {{max}}).",
+        {
+          max: maxLimit,
+        },
+      );
     }
 
     // SaaS-specific: Use simple "Save" label for localStorage mode
-    const buttonLabel = storageType === 'localStorage' && scope === 'personal'
-      ? translate('saved.save', 'Save')
-      : label;
+    const buttonLabel =
+      storageType === "localStorage" && scope === "personal"
+        ? translate("saved.save", "Save")
+        : label;
 
     const button = (
       <Button
         size="xs"
         variant="outline"
-        color={isSaved ? 'green' : undefined}
+        color={isSaved ? "green" : undefined}
         onClick={() => onClick(scope)}
-        disabled={!isReady || disabled || isSavedSignatureLimitReached || !hasChanges}
+        disabled={
+          !isReady || disabled || isSavedSignatureLimitReached || !hasChanges
+        }
         leftSection={<LocalIcon icon={icon} width={16} height={16} />}
         fullWidth={fullWidth}
       >
@@ -354,7 +458,14 @@ const SignSettings = ({
     if (tooltipMessage) {
       return (
         <Tooltip label={tooltipMessage}>
-          <Box style={{ display: fullWidth ? 'block' : 'inline-block', width: fullWidth ? '100%' : undefined }}>{button}</Box>
+          <Box
+            style={{
+              display: fullWidth ? "block" : "inline-block",
+              width: fullWidth ? "100%" : undefined,
+            }}
+          >
+            {button}
+          </Box>
         </Tooltip>
       );
     }
@@ -362,32 +473,36 @@ const SignSettings = ({
     return button;
   };
 
-  const renderSaveButtonRow = (type: SavedSignatureType, isReady: boolean, onClick: (scope: 'personal' | 'shared') => void) => {
+  const renderSaveButtonRow = (
+    type: SavedSignatureType,
+    isReady: boolean,
+    onClick: (scope: "personal" | "shared") => void,
+  ) => {
     if (!canUseSavedLibrary) {
       return null;
     }
 
     // SaaS-specific: Check if we need full-width buttons (localStorage mode = single button)
-    const isLocalStorageMode = storageType === 'localStorage';
+    const isLocalStorageMode = storageType === "localStorage";
 
     const personalButton = renderSaveButton(
       type,
       isReady,
       onClick,
-      'personal',
-      'material-symbols:person-rounded',
-      translate('saved.savePersonal', 'Save Personal'),
-      isLocalStorageMode
+      "personal",
+      "material-symbols:person-rounded",
+      translate("saved.savePersonal", "Save Personal"),
+      isLocalStorageMode,
     );
 
     const sharedButton = renderSaveButton(
       type,
       isReady,
       onClick,
-      'shared',
-      'material-symbols:groups-rounded',
-      translate('saved.saveShared', 'Save Shared'),
-      false
+      "shared",
+      "material-symbols:groups-rounded",
+      translate("saved.saveShared", "Save Shared"),
+      false,
     );
 
     if (!personalButton && !sharedButton) {
@@ -400,14 +515,14 @@ const SignSettings = ({
 
     if (!hasBothButtons) {
       return (
-        <Box style={{ width: '100%', marginTop: '0.4rem' }}>
+        <Box style={{ width: "100%", marginTop: "0.4rem" }}>
           {personalButton || sharedButton}
         </Box>
       );
     }
 
     return (
-      <Group gap="xs" style={{ alignSelf: 'flex-start', marginTop: '0.4rem' }}>
+      <Group gap="xs" style={{ alignSelf: "flex-start", marginTop: "0.4rem" }}>
         {personalButton}
         {sharedButton}
       </Group>
@@ -415,20 +530,28 @@ const SignSettings = ({
   };
 
   useEffect(() => {
-    if (signatureSource === 'saved' && !canUseSavedLibrary) {
+    if (signatureSource === "saved" && !canUseSavedLibrary) {
       setSignatureSource(effectiveDefaultSource);
       return;
     }
-    if (signatureSource === 'saved') {
+    if (signatureSource === "saved") {
       return;
     }
-    const nextSource = allowedSignatureSources.includes(parameters.signatureType as SignatureSource)
+    const nextSource = allowedSignatureSources.includes(
+      parameters.signatureType as SignatureSource,
+    )
       ? (parameters.signatureType as SignatureSource)
       : effectiveDefaultSource;
     if (signatureSource !== nextSource) {
       setSignatureSource(nextSource);
     }
-  }, [parameters.signatureType, signatureSource, allowedSignatureSources, effectiveDefaultSource, canUseSavedLibrary]);
+  }, [
+    parameters.signatureType,
+    signatureSource,
+    allowedSignatureSources,
+    effectiveDefaultSource,
+    canUseSavedLibrary,
+  ]);
 
   useEffect(() => {
     if (!disabled) {
@@ -439,14 +562,14 @@ const SignSettings = ({
   const handleSignatureSourceChange = useCallback(
     (value: SignatureSource) => {
       setSignatureSource(value);
-      if (value === 'saved') {
+      if (value === "saved") {
         return;
       }
       if (parameters.signatureType !== value) {
-        onParameterChange('signatureType', value);
+        onParameterChange("signatureType", value);
       }
     },
-    [onParameterChange, parameters.signatureType]
+    [onParameterChange, parameters.signatureType],
   );
 
   useEffect(() => {
@@ -486,7 +609,7 @@ const SignSettings = ({
             if (e.target?.result) {
               resolve(e.target.result as string);
             } else {
-              reject(new Error('Failed to read file'));
+              reject(new Error("Failed to read file"));
             }
           };
           reader.onerror = () => reject(reader.error);
@@ -499,13 +622,16 @@ const SignSettings = ({
         setImageSignatureData(result);
 
         // Directly activate placement on image upload
-        if (typeof window !== 'undefined') {
-          window.setTimeout(() => onActivateSignaturePlacement?.(), PLACEMENT_ACTIVATION_DELAY);
+        if (typeof window !== "undefined") {
+          window.setTimeout(
+            () => onActivateSignaturePlacement?.(),
+            PLACEMENT_ACTIVATION_DELAY,
+          );
         } else {
           onActivateSignaturePlacement?.();
         }
       } catch (error) {
-        console.error('Error reading file:', error);
+        console.error("Error reading file:", error);
       }
     } else if (!file) {
       setImageSignatureData(undefined);
@@ -516,46 +642,64 @@ const SignSettings = ({
   };
 
   // Handle signature data changes
-  const handleCanvasSignatureChange = useCallback((data: string | null) => {
-    const nextValue = data ?? undefined;
-    setCanvasSignatureData(prevData => {
-      // Reset pause state and trigger placement for signature changes
-      // (onDrawingComplete handles initial activation)
-      if (prevData && prevData !== nextValue && nextValue) {
-        setPlacementManuallyPaused(false);
-        lastAppliedPlacementKey.current = null;
-        // Directly activate placement on signature change
-        if (typeof window !== 'undefined') {
-          window.setTimeout(() => onActivateSignaturePlacement?.(), PLACEMENT_ACTIVATION_DELAY);
-        } else {
-          onActivateSignaturePlacement?.();
+  const handleCanvasSignatureChange = useCallback(
+    (data: string | null) => {
+      const nextValue = data ?? undefined;
+      setCanvasSignatureData((prevData) => {
+        // Reset pause state and trigger placement for signature changes
+        // (onDrawingComplete handles initial activation)
+        if (prevData && prevData !== nextValue && nextValue) {
+          setPlacementManuallyPaused(false);
+          lastAppliedPlacementKey.current = null;
+          // Directly activate placement on signature change
+          if (typeof window !== "undefined") {
+            window.setTimeout(
+              () => onActivateSignaturePlacement?.(),
+              PLACEMENT_ACTIVATION_DELAY,
+            );
+          } else {
+            onActivateSignaturePlacement?.();
+          }
         }
-      }
-      return nextValue;
-    });
-  }, [onActivateSignaturePlacement]);
-
-  const hasCanvasSignature = useMemo(() => Boolean(canvasSignatureData), [canvasSignatureData]);
-  const hasImageSignature = useMemo(() => Boolean(imageSignatureData), [imageSignatureData]);
-  const hasTextSignature = useMemo(
-    () => Boolean(parameters.signerName && parameters.signerName.trim() !== ''),
-    [parameters.signerName]
+        return nextValue;
+      });
+    },
+    [onActivateSignaturePlacement],
   );
 
-  const hasAnySignature = hasCanvasSignature || hasImageSignature || hasTextSignature;
+  const hasCanvasSignature = useMemo(
+    () => Boolean(canvasSignatureData),
+    [canvasSignatureData],
+  );
+  const hasImageSignature = useMemo(
+    () => Boolean(imageSignatureData),
+    [imageSignatureData],
+  );
+  const hasTextSignature = useMemo(
+    () => Boolean(parameters.signerName && parameters.signerName.trim() !== ""),
+    [parameters.signerName],
+  );
+
+  const hasAnySignature =
+    hasCanvasSignature || hasImageSignature || hasTextSignature;
 
   const isCurrentTypeReady = useMemo(() => {
     switch (parameters.signatureType) {
-      case 'canvas':
+      case "canvas":
         return hasCanvasSignature;
-      case 'image':
+      case "image":
         return hasImageSignature;
-      case 'text':
+      case "text":
         return hasTextSignature;
       default:
         return false;
     }
-  }, [parameters.signatureType, hasCanvasSignature, hasImageSignature, hasTextSignature]);
+  }, [
+    parameters.signatureType,
+    hasCanvasSignature,
+    hasImageSignature,
+    hasTextSignature,
+  ]);
 
   const placementSignatureKey = useMemo(() => {
     if (!isCurrentTypeReady) {
@@ -569,10 +713,11 @@ const SignSettings = ({
     return isCurrentTypeReady;
   }, [disabled, isCurrentTypeReady]);
 
-  const shouldAutoActivate = shouldEnablePlacement && !isPlacementManuallyPaused && !signaturesApplied;
+  const shouldAutoActivate =
+    shouldEnablePlacement && !isPlacementManuallyPaused && !signaturesApplied;
 
   useEffect(() => {
-    setSignatureDrafts(prev => {
+    setSignatureDrafts((prev) => {
       if (canvasSignatureData) {
         if (prev.canvas === canvasSignatureData) {
           return prev;
@@ -591,7 +736,7 @@ const SignSettings = ({
   }, [canvasSignatureData]);
 
   useEffect(() => {
-    setSignatureDrafts(prev => {
+    setSignatureDrafts((prev) => {
       if (imageSignatureData) {
         if (prev.image === imageSignatureData) {
           return prev;
@@ -611,13 +756,13 @@ const SignSettings = ({
 
   useEffect(() => {
     const nextDraft = {
-      signerName: parameters.signerName || '',
+      signerName: parameters.signerName || "",
       fontSize: parameters.fontSize || 16,
-      fontFamily: parameters.fontFamily || 'Helvetica',
-      textColor: parameters.textColor || '#000000',
+      fontFamily: parameters.fontFamily || "Helvetica",
+      textColor: parameters.textColor || "#000000",
     };
 
-    setSignatureDrafts(prev => {
+    setSignatureDrafts((prev) => {
       const prevDraft = prev.text;
       if (
         prevDraft &&
@@ -631,20 +776,25 @@ const SignSettings = ({
 
       return { ...prev, text: nextDraft };
     });
-  }, [parameters.signerName, parameters.fontSize, parameters.fontFamily, parameters.textColor]);
+  }, [
+    parameters.signerName,
+    parameters.fontSize,
+    parameters.fontFamily,
+    parameters.textColor,
+  ]);
 
   useEffect(() => {
-    if (parameters.signatureType === 'text') {
+    if (parameters.signatureType === "text") {
       const draft = signatureDrafts.text;
       if (!draft) {
         lastSyncedTextDraft.current = null;
         return;
       }
 
-      const currentSignerName = parameters.signerName ?? '';
+      const currentSignerName = parameters.signerName ?? "";
       const currentFontSize = parameters.fontSize ?? 16;
-      const currentFontFamily = parameters.fontFamily ?? 'Helvetica';
-      const currentTextColor = parameters.textColor ?? '#000000';
+      const currentFontFamily = parameters.fontFamily ?? "Helvetica";
+      const currentTextColor = parameters.textColor ?? "#000000";
 
       const isSynced =
         draft.signerName === currentSignerName &&
@@ -668,16 +818,16 @@ const SignSettings = ({
       if (!alreadyAttempted) {
         lastSyncedTextDraft.current = draft;
         if (draft.signerName !== currentSignerName) {
-          onParameterChange('signerName', draft.signerName);
+          onParameterChange("signerName", draft.signerName);
         }
         if (draft.fontSize !== currentFontSize) {
-          onParameterChange('fontSize', draft.fontSize);
+          onParameterChange("fontSize", draft.fontSize);
         }
         if (draft.fontFamily !== currentFontFamily) {
-          onParameterChange('fontFamily', draft.fontFamily);
+          onParameterChange("fontFamily", draft.fontFamily);
         }
         if (draft.textColor !== currentTextColor) {
-          onParameterChange('textColor', draft.textColor);
+          onParameterChange("textColor", draft.textColor);
         }
       }
     } else {
@@ -696,16 +846,22 @@ const SignSettings = ({
   useEffect(() => {
     let newSignatureData: string | undefined = undefined;
 
-    if (parameters.signatureType === 'image' && imageSignatureData) {
+    if (parameters.signatureType === "image" && imageSignatureData) {
       newSignatureData = imageSignatureData;
-    } else if (parameters.signatureType === 'canvas' && canvasSignatureData) {
+    } else if (parameters.signatureType === "canvas" && canvasSignatureData) {
       newSignatureData = canvasSignatureData;
     }
 
     if (parameters.signatureData !== newSignatureData) {
-      onParameterChange('signatureData', newSignatureData);
+      onParameterChange("signatureData", newSignatureData);
     }
-  }, [parameters.signatureType, parameters.signatureData, canvasSignatureData, imageSignatureData, onParameterChange]);
+  }, [
+    parameters.signatureType,
+    parameters.signatureData,
+    canvasSignatureData,
+    imageSignatureData,
+    onParameterChange,
+  ]);
 
   useEffect(() => {
     if (!shouldEnablePlacement) {
@@ -722,7 +878,7 @@ const SignSettings = ({
       return;
     }
 
-    if (typeof window !== 'undefined') {
+    if (typeof window !== "undefined") {
       const timer = window.setTimeout(() => {
         onActivateSignaturePlacement?.();
       }, PLACEMENT_ACTIVATION_DELAY);
@@ -762,13 +918,19 @@ const SignSettings = ({
       lastAppliedPlacementKey.current = placementSignatureKey;
     };
 
-    if (typeof window !== 'undefined') {
+    if (typeof window !== "undefined") {
       const timer = window.setTimeout(trigger, PLACEMENT_ACTIVATION_DELAY);
       return () => window.clearTimeout(timer);
     }
 
     trigger();
-  }, [placementSignatureKey, shouldAutoActivate, shouldEnablePlacement, isPlacementMode, onActivateSignaturePlacement]);
+  }, [
+    placementSignatureKey,
+    shouldAutoActivate,
+    shouldEnablePlacement,
+    isPlacementMode,
+    onActivateSignaturePlacement,
+  ]);
   useEffect(() => {
     if (activeFileIndex === previousFileIndexRef.current) {
       return;
@@ -783,7 +945,7 @@ const SignSettings = ({
     setPlacementManuallyPaused(false);
     lastAppliedPlacementKey.current = null;
 
-    if (typeof window !== 'undefined') {
+    if (typeof window !== "undefined") {
       const timer = window.setTimeout(() => {
         onActivateSignaturePlacement?.();
       }, FILE_SWITCH_ACTIVATION_DELAY);
@@ -791,22 +953,27 @@ const SignSettings = ({
     }
 
     onActivateSignaturePlacement?.();
-  }, [activeFileIndex, shouldEnablePlacement, signaturesApplied, onActivateSignaturePlacement]);
+  }, [
+    activeFileIndex,
+    shouldEnablePlacement,
+    signaturesApplied,
+    onActivateSignaturePlacement,
+  ]);
 
   const sourceLabels: Record<SignatureSource, string> = {
-    canvas: translate('type.canvas', 'Draw'),
-    image: translate('type.image', 'Upload'),
-    text: translate('type.text', 'Type'),
-    saved: translate('type.saved', 'Saved'),
+    canvas: translate("type.canvas", "Draw"),
+    image: translate("type.image", "Upload"),
+    text: translate("type.text", "Type"),
+    saved: translate("type.saved", "Saved"),
   };
 
-  const sourceOptions = allowedSignatureSources.map(source => ({
+  const sourceOptions = allowedSignatureSources.map((source) => ({
     label: sourceLabels[source],
     value: source,
   }));
 
   const renderSignatureBuilder = () => {
-    if (signatureSource === 'saved') {
+    if (signatureSource === "saved") {
       if (!canUseSavedLibrary) {
         return null;
       }
@@ -825,7 +992,7 @@ const SignSettings = ({
       );
     }
 
-    if (signatureSource === 'canvas') {
+    if (signatureSource === "canvas") {
       return (
         <Stack gap="xs">
           <DrawingCanvas
@@ -842,19 +1009,27 @@ const SignSettings = ({
             disabled={disabled}
             initialSignatureData={canvasSignatureData}
           />
-          {renderSaveButtonRow('canvas', hasCanvasSignature, handleSaveCanvasSignature)}
+          {renderSaveButtonRow(
+            "canvas",
+            hasCanvasSignature,
+            handleSaveCanvasSignature,
+          )}
         </Stack>
       );
     }
 
-    if (signatureSource === 'image') {
+    if (signatureSource === "image") {
       return (
         <Stack gap="xs">
           <ImageUploader
             onImageChange={handleImageChange}
             disabled={disabled}
           />
-          {renderSaveButtonRow('image', hasImageSignature, handleSaveImageSignature)}
+          {renderSaveButtonRow(
+            "image",
+            hasImageSignature,
+            handleSaveImageSignature,
+          )}
         </Stack>
       );
     }
@@ -862,75 +1037,89 @@ const SignSettings = ({
     return (
       <Stack gap="xs">
         <TextInputWithFont
-          text={parameters.signerName || ''}
-          onTextChange={(text) => onParameterChange('signerName', text)}
+          text={parameters.signerName || ""}
+          onTextChange={(text) => onParameterChange("signerName", text)}
           fontSize={parameters.fontSize || 16}
-          onFontSizeChange={(size) => onParameterChange('fontSize', size)}
-          fontFamily={parameters.fontFamily || 'Helvetica'}
-          onFontFamilyChange={(family) => onParameterChange('fontFamily', family)}
-          textColor={parameters.textColor || '#000000'}
-          onTextColorChange={(color) => onParameterChange('textColor', color)}
+          onFontSizeChange={(size) => onParameterChange("fontSize", size)}
+          fontFamily={parameters.fontFamily || "Helvetica"}
+          onFontFamilyChange={(family) =>
+            onParameterChange("fontFamily", family)
+          }
+          textColor={parameters.textColor || "#000000"}
+          onTextColorChange={(color) => onParameterChange("textColor", color)}
           disabled={disabled}
-          label={translate('text.name', 'Text')}
-          placeholder={translate('text.placeholder', 'Enter text')}
-          fontLabel={translate('text.fontLabel', 'Font')}
-          fontSizeLabel={translate('text.fontSizeLabel', 'Font size')}
-          fontSizePlaceholder={translate('text.fontSizePlaceholder', 'Type or select font size (8-200)')}
+          label={translate("text.name", "Text")}
+          placeholder={translate("text.placeholder", "Enter text")}
+          fontLabel={translate("text.fontLabel", "Font")}
+          fontSizeLabel={translate("text.fontSizeLabel", "Font size")}
+          fontSizePlaceholder={translate(
+            "text.fontSizePlaceholder",
+            "Type or select font size (8-200)",
+          )}
           onAnyChange={() => {
             setPlacementManuallyPaused(false);
             lastAppliedPlacementKey.current = null;
             // Directly activate placement on text changes
-            if (typeof window !== 'undefined') {
-              window.setTimeout(() => onActivateSignaturePlacement?.(), PLACEMENT_ACTIVATION_DELAY);
+            if (typeof window !== "undefined") {
+              window.setTimeout(
+                () => onActivateSignaturePlacement?.(),
+                PLACEMENT_ACTIVATION_DELAY,
+              );
             } else {
               onActivateSignaturePlacement?.();
             }
           }}
         />
-        {renderSaveButtonRow('text', hasTextSignature, handleSaveTextSignature)}
+        {renderSaveButtonRow("text", hasTextSignature, handleSaveTextSignature)}
       </Stack>
     );
   };
 
   const placementInstructions = () => {
-    if (signatureSource === 'saved') {
+    if (signatureSource === "saved") {
       return translate(
-        'instructions.saved',
-        'Select a saved signature above, then click anywhere on the PDF to place it.'
+        "instructions.saved",
+        "Select a saved signature above, then click anywhere on the PDF to place it.",
       );
     }
-    if (parameters.signatureType === 'canvas') {
+    if (parameters.signatureType === "canvas") {
       return translate(
-        'instructions.canvas',
-        'After drawing your signature and closing the canvas, click anywhere on the PDF to place it.'
+        "instructions.canvas",
+        "After drawing your signature and closing the canvas, click anywhere on the PDF to place it.",
       );
     }
-    if (parameters.signatureType === 'image') {
+    if (parameters.signatureType === "image") {
       return translate(
-        'instructions.image',
-        'After uploading your signature image, click anywhere on the PDF to place it.'
+        "instructions.image",
+        "After uploading your signature image, click anywhere on the PDF to place it.",
       );
     }
     return translate(
-      'instructions.text',
-      'After entering your name above, click anywhere on the PDF to place your signature.'
+      "instructions.text",
+      "After entering your name above, click anywhere on the PDF to place your signature.",
     );
   };
 
   const placementAlert = isCurrentTypeReady
     ? {
-        color: isPlacementMode ? 'blue' : 'teal',
+        color: isPlacementMode ? "blue" : "teal",
         title: isPlacementMode
-          ? translate('instructions.title', 'How to add your signature')
-          : translate('instructions.paused', 'Placement paused'),
+          ? translate("instructions.title", "How to add your signature")
+          : translate("instructions.paused", "Placement paused"),
         message: isPlacementMode
           ? placementInstructions()
-          : translate('instructions.resumeHint', 'Resume placement to click and add your signature.'),
+          : translate(
+              "instructions.resumeHint",
+              "Resume placement to click and add your signature.",
+            ),
       }
     : {
-        color: 'yellow',
-        title: translate('instructions.title', 'How to add your signature'),
-        message: translate('instructions.noSignature', 'Create a signature above to enable placement tools.'),
+        color: "yellow",
+        title: translate("instructions.title", "How to add your signature"),
+        message: translate(
+          "instructions.noSignature",
+          "Create a signature above to enable placement tools.",
+        ),
       };
 
   const handlePausePlacement = () => {
@@ -948,7 +1137,7 @@ const SignSettings = ({
     if (!isCurrentTypeReady) return;
 
     const handleKeyDown = (e: KeyboardEvent) => {
-      if (e.key === 'Escape') {
+      if (e.key === "Escape") {
         e.preventDefault();
         if (isPlacementMode) {
           handlePausePlacement();
@@ -958,72 +1147,85 @@ const SignSettings = ({
       }
     };
 
-    window.addEventListener('keydown', handleKeyDown);
-    return () => window.removeEventListener('keydown', handleKeyDown);
+    window.addEventListener("keydown", handleKeyDown);
+    return () => window.removeEventListener("keydown", handleKeyDown);
   }, [isCurrentTypeReady, isPlacementMode, isPlacementManuallyPaused]);
 
   const placementToggleControl =
-    onActivateSignaturePlacement || onDeactivateSignature
-      ? isPlacementMode
-        ? (
-            <Tooltip label={translate('mode.pause', 'Pause placement')}>
-              <ActionIcon
-                variant="default"
-                size="lg"
-                aria-label={translate('mode.pause', 'Pause placement')}
-                onClick={handlePausePlacement}
-                disabled={disabled || !onDeactivateSignature}
-                style={{
-                  width: 'auto',
-                  paddingInline: '0.75rem',
-                  display: 'inline-flex',
-                  alignItems: 'center',
-                  gap: '0.4rem',
-                }}
-              >
-                <LocalIcon icon="material-symbols:pause-rounded" width={20} height={20} />
-                <Text component="span" size="sm" fw={500}>
-                  {translate('mode.pause', 'Pause placement')}
-                </Text>
-              </ActionIcon>
-            </Tooltip>
-          )
-        : (
-            <Tooltip label={translate('mode.resume', 'Resume placement')}>
-              <ActionIcon
-                variant="default"
-                size="lg"
-                aria-label={translate('mode.resume', 'Resume placement')}
-                onClick={handleResumePlacement}
-                disabled={disabled || !isCurrentTypeReady || !onActivateSignaturePlacement}
-                style={{
-                  width: 'auto',
-                  paddingInline: '0.75rem',
-                  display: 'inline-flex',
-                  alignItems: 'center',
-                  gap: '0.4rem',
-                }}
-              >
-                <LocalIcon icon="material-symbols:play-arrow-rounded" width={20} height={20} />
-                <Text component="span" size="sm" fw={500}>
-                  {translate('mode.resume', 'Resume placement')}
-                </Text>
-              </ActionIcon>
-            </Tooltip>
-          )
-      : null;
+    onActivateSignaturePlacement || onDeactivateSignature ? (
+      isPlacementMode ? (
+        <Tooltip label={translate("mode.pause", "Pause placement")}>
+          <ActionIcon
+            variant="default"
+            size="lg"
+            aria-label={translate("mode.pause", "Pause placement")}
+            onClick={handlePausePlacement}
+            disabled={disabled || !onDeactivateSignature}
+            style={{
+              width: "auto",
+              paddingInline: "0.75rem",
+              display: "inline-flex",
+              alignItems: "center",
+              gap: "0.4rem",
+            }}
+          >
+            <LocalIcon
+              icon="material-symbols:pause-rounded"
+              width={20}
+              height={20}
+            />
+            <Text component="span" size="sm" fw={500}>
+              {translate("mode.pause", "Pause placement")}
+            </Text>
+          </ActionIcon>
+        </Tooltip>
+      ) : (
+        <Tooltip label={translate("mode.resume", "Resume placement")}>
+          <ActionIcon
+            variant="default"
+            size="lg"
+            aria-label={translate("mode.resume", "Resume placement")}
+            onClick={handleResumePlacement}
+            disabled={
+              disabled || !isCurrentTypeReady || !onActivateSignaturePlacement
+            }
+            style={{
+              width: "auto",
+              paddingInline: "0.75rem",
+              display: "inline-flex",
+              alignItems: "center",
+              gap: "0.4rem",
+            }}
+          >
+            <LocalIcon
+              icon="material-symbols:play-arrow-rounded"
+              width={20}
+              height={20}
+            />
+            <Text component="span" size="sm" fw={500}>
+              {translate("mode.resume", "Resume placement")}
+            </Text>
+          </ActionIcon>
+        </Tooltip>
+      )
+    ) : null;
 
   return (
     <Stack>
       <Stack gap="sm">
         <Text size="sm" c="dimmed">
-          {translate('step.createDesc', 'Choose how you want to create the signature')}
+          {translate(
+            "step.createDesc",
+            "Choose how you want to create the signature",
+          )}
         </Text>
         {sourceOptions.length > 1 && (
           <SegmentedControl
             value={signatureSource}
             fullWidth
-            onChange={(value) => handleSignatureSourceChange(value as SignatureSource)}
+            onChange={(value) =>
+              handleSignatureSourceChange(value as SignatureSource)
+            }
             data={sourceOptions}
           />
         )}
@@ -1034,10 +1236,10 @@ const SignSettings = ({
 
       <Stack gap="sm">
         <Text fw={600} size="md">
-          {translate('step.place', 'Place & save')}
+          {translate("step.place", "Place & save")}
         </Text>
         <Text size="sm" c="dimmed">
-          {translate('step.placeDesc', 'Position the signature on your PDF')}
+          {translate("step.placeDesc", "Position the signature on your PDF")}
         </Text>
 
         <Group gap="xs" wrap="nowrap" align="center">
@@ -1050,17 +1252,12 @@ const SignSettings = ({
             disabled={disabled}
             showPlaceButton={false}
           />
-          <Box style={{ marginLeft: 'auto' }}>
-            {placementToggleControl}
-          </Box>
+          <Box style={{ marginLeft: "auto" }}>{placementToggleControl}</Box>
         </Group>
 
         <Alert color={placementAlert.color} title={placementAlert.title}>
-          <Text size="sm">
-            {placementAlert.message}
-          </Text>
+          <Text size="sm">{placementAlert.message}</Text>
         </Alert>
-
       </Stack>
 
       <ColorPicker
@@ -1068,17 +1265,12 @@ const SignSettings = ({
         onClose={() => setIsColorPickerOpen(false)}
         selectedColor={selectedColor}
         onColorChange={setSelectedColor}
-        title={translate('canvas.colorPickerTitle', 'Choose stroke colour')}
+        title={translate("canvas.colorPickerTitle", "Choose stroke colour")}
       />
 
       {onSave && (
-        <Button
-          onClick={onSave}
-          color="blue"
-          variant="filled"
-          fullWidth
-        >
-          {translate('applySignatures', 'Apply Signatures')}
+        <Button onClick={onSave} color="blue" variant="filled" fullWidth>
+          {translate("applySignatures", "Apply Signatures")}
         </Button>
       )}
 
diff --git a/frontend/src/saas/constants/app.ts b/frontend/src/saas/constants/app.ts
index 90a130c76c..2df0ba0f15 100644
--- a/frontend/src/saas/constants/app.ts
+++ b/frontend/src/saas/constants/app.ts
@@ -1,5 +1,5 @@
 // Re-export all constants from core
-export * from '@core/constants/app';
+export * from "@core/constants/app";
 
 // SaaS-specific overrides
 // Get base URL with fallback (for use outside React components)
diff --git a/frontend/src/saas/constants/authProviders.ts b/frontend/src/saas/constants/authProviders.ts
index 58e6db63b0..502e23b4f6 100644
--- a/frontend/src/saas/constants/authProviders.ts
+++ b/frontend/src/saas/constants/authProviders.ts
@@ -1,13 +1,13 @@
-export type OAuthProviderId = 'google' | 'apple' | 'github' | 'azure'
+export type OAuthProviderId = "google" | "apple" | "github" | "azure";
 
 export type OAuthProviderMeta = {
-  id: OAuthProviderId
-  label: string
-  file: string
-  isDisabled: boolean
-}
+  id: OAuthProviderId;
+  label: string;
+  file: string;
+  isDisabled: boolean;
+};
 
 export const oauthProviders: readonly OAuthProviderMeta[] = [
-  { id: 'google', label: 'Google', file: 'google.svg', isDisabled: false },
-  { id: 'github', label: 'GitHub', file: 'github.svg', isDisabled: false },
-] as const
+  { id: "google", label: "Google", file: "google.svg", isDisabled: false },
+  { id: "github", label: "GitHub", file: "github.svg", isDisabled: false },
+] as const;
diff --git a/frontend/src/saas/constants/links.ts b/frontend/src/saas/constants/links.ts
index c48ea04ab3..ff71f70d55 100644
--- a/frontend/src/saas/constants/links.ts
+++ b/frontend/src/saas/constants/links.ts
@@ -1 +1,2 @@
-export const devApiLink = "https://registry.scalar.com/@stirlingpdf/apis/stirling-pdf-processing-api/";
+export const devApiLink =
+  "https://registry.scalar.com/@stirlingpdf/apis/stirling-pdf-processing-api/";
diff --git a/frontend/src/saas/hooks/useAutoAnonymousAuth.ts b/frontend/src/saas/hooks/useAutoAnonymousAuth.ts
index 27a0e9abe5..066945b62f 100644
--- a/frontend/src/saas/hooks/useAutoAnonymousAuth.ts
+++ b/frontend/src/saas/hooks/useAutoAnonymousAuth.ts
@@ -1,129 +1,153 @@
-import { useState, useEffect, useCallback } from 'react'
-import { useLocation } from 'react-router-dom'
-import { useAuth } from '@app/auth/UseSession'
-import { signInAnonymously, supabase } from '@app/auth/supabase'
-import { isAuthRoute, isHomeRoute, isToolRoute } from '@app/utils/pathUtils'
+import { useState, useEffect, useCallback } from "react";
+import { useLocation } from "react-router-dom";
+import { useAuth } from "@app/auth/UseSession";
+import { signInAnonymously, supabase } from "@app/auth/supabase";
+import { isAuthRoute, isHomeRoute, isToolRoute } from "@app/utils/pathUtils";
 
 interface AutoAnonymousAuthState {
-  isAutoAuthenticating: boolean
-  autoAuthError: string | null
-  shouldTriggerAutoAuth: boolean
+  isAutoAuthenticating: boolean;
+  autoAuthError: string | null;
+  shouldTriggerAutoAuth: boolean;
 }
 
 /**
  * Automatically signs in users anonymously on direct tool access when not authenticated.
  */
 export function useAutoAnonymousAuth() {
-  const { session, loading } = useAuth()
-  const location = useLocation()
+  const { session, loading } = useAuth();
+  const location = useLocation();
   const [state, setState] = useState<AutoAnonymousAuthState>({
     isAutoAuthenticating: false,
     autoAuthError: null,
-    shouldTriggerAutoAuth: false
-  })
+    shouldTriggerAutoAuth: false,
+  });
 
   const shouldAutoAuthenticate = useCallback((): boolean => {
-    const currentPath = location.pathname
-    if (isAuthRoute(currentPath)) return false
-    if (isHomeRoute(currentPath)) return false
-    return isToolRoute(currentPath)
-  }, [location.pathname])
+    const currentPath = location.pathname;
+    if (isAuthRoute(currentPath)) return false;
+    if (isHomeRoute(currentPath)) return false;
+    return isToolRoute(currentPath);
+  }, [location.pathname]);
 
   const waitForToken = useCallback(async (timeoutMs = 7000) => {
     // Prefer event-driven approach; fallback to polling if needed
-    let resolved = false
+    let resolved = false;
     const done = (ok: boolean) => {
-      resolved = true
-      return ok
-    }
+      resolved = true;
+      return ok;
+    };
 
     const hasToken = async () => {
-      const { data: { session } } = await supabase.auth.getSession()
-      return !!session?.access_token
-    }
+      const {
+        data: { session },
+      } = await supabase.auth.getSession();
+      return !!session?.access_token;
+    };
 
-    if (await hasToken()) return true
+    if (await hasToken()) return true;
 
     const unsub = supabase.auth.onAuthStateChange(async (_evt, _session) => {
       if (!resolved && (await hasToken())) {
-        unsub.data.subscription.unsubscribe()
-        done(true)
+        unsub.data.subscription.unsubscribe();
+        done(true);
       }
-    })
+    });
 
-    const started = Date.now()
+    const started = Date.now();
     while (!resolved && Date.now() - started < timeoutMs) {
       if (await hasToken()) {
-        unsub.data.subscription.unsubscribe()
-        return done(true)
+        unsub.data.subscription.unsubscribe();
+        return done(true);
       }
       // gentle backoff
-      await new Promise(r => setTimeout(r, 120))
+      await new Promise((r) => setTimeout(r, 120));
     }
 
-    try { unsub.data.subscription.unsubscribe() } catch (err) {
+    try {
+      unsub.data.subscription.unsubscribe();
+    } catch (err) {
       // Ignore unsubscribe errors during cleanup
-      console.debug('[useAutoAnonymousAuth] Unsubscribe cleanup error:', err)
+      console.debug("[useAutoAnonymousAuth] Unsubscribe cleanup error:", err);
     }
-    return done(false)
-  }, [])
+    return done(false);
+  }, []);
 
   const triggerAnonymousAuth = useCallback(async () => {
-    if (state.isAutoAuthenticating) return
+    if (state.isAutoAuthenticating) return;
 
-    setState(prev => ({ ...prev, isAutoAuthenticating: true, autoAuthError: null }))
+    setState((prev) => ({
+      ...prev,
+      isAutoAuthenticating: true,
+      autoAuthError: null,
+    }));
     try {
-      console.log('[useAutoAnonymousAuth] anonymous auth starting')
+      console.log("[useAutoAnonymousAuth] anonymous auth starting");
 
-      const { error } = await signInAnonymously()
-      if (error) throw error
+      const { error } = await signInAnonymously();
+      if (error) throw error;
 
       // Wait for a usable token so first API calls won't 401/redirect
-      const ok = await waitForToken(7000)
+      const ok = await waitForToken(7000);
       if (!ok) {
-        throw new Error('Timed out waiting for anonymous session token')
+        throw new Error("Timed out waiting for anonymous session token");
       }
 
-      console.log('[useAutoAnonymousAuth] anonymous auth complete')
-      setState(prev => ({ ...prev, isAutoAuthenticating: false, shouldTriggerAutoAuth: false }))
-    } catch (e) {
-      console.error('[useAutoAnonymousAuth] anonymous auth failed', e)
-      setState(prev => ({
+      console.log("[useAutoAnonymousAuth] anonymous auth complete");
+      setState((prev) => ({
         ...prev,
         isAutoAuthenticating: false,
-        autoAuthError: e instanceof Error ? e.message : 'Anonymous authentication failed'
-      }))
+        shouldTriggerAutoAuth: false,
+      }));
+    } catch (e) {
+      console.error("[useAutoAnonymousAuth] anonymous auth failed", e);
+      setState((prev) => ({
+        ...prev,
+        isAutoAuthenticating: false,
+        autoAuthError:
+          e instanceof Error ? e.message : "Anonymous authentication failed",
+      }));
     }
-  }, [state.isAutoAuthenticating, waitForToken])
+  }, [state.isAutoAuthenticating, waitForToken]);
 
   // Decide whether to auto-auth on mount & whenever location/auth changes
   useEffect(() => {
-    if (loading) return
-    if (session) return
-    if (state.isAutoAuthenticating) return
+    if (loading) return;
+    if (session) return;
+    if (state.isAutoAuthenticating) return;
 
-    const shouldAuth = shouldAutoAuthenticate()
+    const shouldAuth = shouldAutoAuthenticate();
     if (state.shouldTriggerAutoAuth !== shouldAuth) {
-      setState(prev => ({ ...prev, shouldTriggerAutoAuth: shouldAuth }))
+      setState((prev) => ({ ...prev, shouldTriggerAutoAuth: shouldAuth }));
     }
 
     if (shouldAuth) {
-      console.log('[useAutoAnonymousAuth] tool route detected, auto-auth')
-      triggerAnonymousAuth()
+      console.log("[useAutoAnonymousAuth] tool route detected, auto-auth");
+      triggerAnonymousAuth();
     }
-  }, [loading, session, state.isAutoAuthenticating, state.shouldTriggerAutoAuth, shouldAutoAuthenticate, triggerAnonymousAuth])
+  }, [
+    loading,
+    session,
+    state.isAutoAuthenticating,
+    state.shouldTriggerAutoAuth,
+    shouldAutoAuthenticate,
+    triggerAnonymousAuth,
+  ]);
 
   // Clear error if route is no longer a tool route, or once authenticated
   useEffect(() => {
     if (session || !shouldAutoAuthenticate()) {
-      setState(prev => ({ ...prev, autoAuthError: null, shouldTriggerAutoAuth: false }))
+      setState((prev) => ({
+        ...prev,
+        autoAuthError: null,
+        shouldTriggerAutoAuth: false,
+      }));
     }
-  }, [session, shouldAutoAuthenticate])
+  }, [session, shouldAutoAuthenticate]);
 
   return {
     isAutoAuthenticating: state.isAutoAuthenticating,
     autoAuthError: state.autoAuthError,
     shouldTriggerAutoAuth: state.shouldTriggerAutoAuth,
-    triggerAnonymousAuth
-  }
-}
\ No newline at end of file
+    triggerAnonymousAuth,
+  };
+}
diff --git a/frontend/src/saas/hooks/useConfigButtonIcon.tsx b/frontend/src/saas/hooks/useConfigButtonIcon.tsx
index 5b07deea7d..904eeb0884 100644
--- a/frontend/src/saas/hooks/useConfigButtonIcon.tsx
+++ b/frontend/src/saas/hooks/useConfigButtonIcon.tsx
@@ -1,7 +1,9 @@
-import { Avatar } from '@mantine/core';
-import { useAuth } from '@app/auth/UseSession';
+import { Avatar } from "@mantine/core";
+import { useAuth } from "@app/auth/UseSession";
 
 export function useConfigButtonIcon(): React.ReactNode {
   const { profilePictureUrl } = useAuth();
-  return profilePictureUrl ? <Avatar src={profilePictureUrl} radius="xl" size={24} /> : null;
+  return profilePictureUrl ? (
+    <Avatar src={profilePictureUrl} radius="xl" size={24} />
+  ) : null;
 }
diff --git a/frontend/src/saas/hooks/useCreditCheck.ts b/frontend/src/saas/hooks/useCreditCheck.ts
index c9aac57f4a..54ad36d7c1 100644
--- a/frontend/src/saas/hooks/useCreditCheck.ts
+++ b/frontend/src/saas/hooks/useCreditCheck.ts
@@ -1,41 +1,63 @@
-import { useCallback } from 'react';
-import { useTranslation } from 'react-i18next';
-import { useCredits } from '@app/hooks/useCredits';
-import { getToolCreditCost } from '@app/utils/creditCosts';
-import { openPlanSettings } from '@app/utils/appSettings';
-import type { ToolId } from '@app/types/toolId';
+import { useCallback } from "react";
+import { useTranslation } from "react-i18next";
+import { useCredits } from "@app/hooks/useCredits";
+import { getToolCreditCost } from "@app/utils/creditCosts";
+import { openPlanSettings } from "@app/utils/appSettings";
+import type { ToolId } from "@app/types/toolId";
 
 export function useCreditCheck(operationType?: string, _endpoint?: string) {
-  const { hasSufficientCredits, isPro, creditBalance, refreshCredits } = useCredits();
+  const { hasSufficientCredits, isPro, creditBalance, refreshCredits } =
+    useCredits();
   const { t } = useTranslation();
 
-  const checkCredits = useCallback(async (_runtimeEndpoint?: string): Promise<string | null> => {
-    const requiredCredits = getToolCreditCost(operationType as ToolId);
-    const creditCheck = hasSufficientCredits(requiredCredits);
+  const checkCredits = useCallback(
+    async (_runtimeEndpoint?: string): Promise<string | null> => {
+      const requiredCredits = getToolCreditCost(operationType as ToolId);
+      const creditCheck = hasSufficientCredits(requiredCredits);
 
-    if (creditBalance === null) {
-      try { await refreshCredits(); } catch (_e) { void _e; }
-      return t('loadingCredits', 'Checking credits...');
-    }
+      if (creditBalance === null) {
+        try {
+          await refreshCredits();
+        } catch (_e) {
+          void _e;
+        }
+        return t("loadingCredits", "Checking credits...");
+      }
 
-    if (isPro === null) {
-      return t('loadingProStatus', 'Checking subscription status...');
-    }
+      if (isPro === null) {
+        return t("loadingProStatus", "Checking subscription status...");
+      }
 
-    if (!isPro && !creditCheck.hasSufficientCredits) {
-      const shortfall = creditCheck.shortfall || 0;
-      const error = t(
-        'insufficientCredits',
-        'Insufficient credits. Required: {{requiredCredits}}, Available: {{currentBalance}}, Shortfall: {{shortfall}}',
-        { requiredCredits, currentBalance: creditCheck.currentBalance, shortfall },
-      );
-      const notice = t('noticeTopUpOrPlan', 'Not enough credits, please top up or upgrade to a plan');
-      openPlanSettings(notice);
-      return error;
-    }
+      if (!isPro && !creditCheck.hasSufficientCredits) {
+        const shortfall = creditCheck.shortfall || 0;
+        const error = t(
+          "insufficientCredits",
+          "Insufficient credits. Required: {{requiredCredits}}, Available: {{currentBalance}}, Shortfall: {{shortfall}}",
+          {
+            requiredCredits,
+            currentBalance: creditCheck.currentBalance,
+            shortfall,
+          },
+        );
+        const notice = t(
+          "noticeTopUpOrPlan",
+          "Not enough credits, please top up or upgrade to a plan",
+        );
+        openPlanSettings(notice);
+        return error;
+      }
 
-    return null;
-  }, [hasSufficientCredits, isPro, creditBalance, refreshCredits, operationType, t]);
+      return null;
+    },
+    [
+      hasSufficientCredits,
+      isPro,
+      creditBalance,
+      refreshCredits,
+      operationType,
+      t,
+    ],
+  );
 
   return { checkCredits };
 }
diff --git a/frontend/src/saas/hooks/useCredits.ts b/frontend/src/saas/hooks/useCredits.ts
index 1af732346f..2af0718509 100644
--- a/frontend/src/saas/hooks/useCredits.ts
+++ b/frontend/src/saas/hooks/useCredits.ts
@@ -1,4 +1,4 @@
-import { useAuth } from '@app/auth/UseSession'
+import { useAuth } from "@app/auth/UseSession";
 
 /**
  * Hook for credit management and checking in tools.
@@ -12,22 +12,21 @@ export const useCredits = () => {
     isPro,
     hasSufficientCredits,
     updateCredits,
-    refreshCredits
-  } = useAuth()
-
+    refreshCredits,
+  } = useAuth();
 
   /**
    * Get user-friendly credit status message
    */
   const getCreditStatusMessage = (): string => {
     if (creditBalance === 0) {
-      return 'No credits remaining'
+      return "No credits remaining";
     }
     if (creditBalance === null) {
-      return 'Credits loading...'
+      return "Credits loading...";
     }
-    return `${creditBalance} credits available`
-  }
+    return `${creditBalance} credits available`;
+  };
 
   return {
     // State
@@ -42,6 +41,6 @@ export const useCredits = () => {
 
     // Utilities
     getCreditStatusMessage,
-    hasSufficientCredits
-  }
-}
+    hasSufficientCredits,
+  };
+};
diff --git a/frontend/src/saas/hooks/useEndpointConfig.ts b/frontend/src/saas/hooks/useEndpointConfig.ts
index c98dec5966..590cb49cfe 100644
--- a/frontend/src/saas/hooks/useEndpointConfig.ts
+++ b/frontend/src/saas/hooks/useEndpointConfig.ts
@@ -1,7 +1,7 @@
-import { useState, useEffect } from 'react';
-import { isAxiosError } from 'axios';
-import apiClient from '@app/services/apiClient';
-import type { EndpointAvailabilityDetails } from '@app/types/endpointAvailability';
+import { useState, useEffect } from "react";
+import { isAxiosError } from "axios";
+import apiClient from "@app/services/apiClient";
+import type { EndpointAvailabilityDetails } from "@app/types/endpointAvailability";
 
 // Track globally fetched endpoint sets to prevent duplicate fetches across components
 const globalFetchedSets = new Set<string>();
@@ -31,12 +31,15 @@ export function useEndpointEnabled(endpoint: string): {
       setLoading(true);
       setError(null);
 
-      const response = await apiClient.get<boolean>(`/api/v1/config/endpoint-enabled?endpoint=${encodeURIComponent(endpoint)}`);
+      const response = await apiClient.get<boolean>(
+        `/api/v1/config/endpoint-enabled?endpoint=${encodeURIComponent(endpoint)}`,
+      );
 
       const isEnabled = response.data;
       setEnabled(isEnabled);
     } catch (err) {
-      const errorMessage = err instanceof Error ? err.message : 'Unknown error occurred';
+      const errorMessage =
+        err instanceof Error ? err.message : "Unknown error occurred";
       setError(errorMessage);
     } finally {
       setLoading(false);
@@ -66,16 +69,22 @@ export function useMultipleEndpointsEnabled(endpoints: string[]): {
   error: string | null;
   refetch: () => Promise<void>;
 } {
-  const [endpointStatus, setEndpointStatus] = useState<Record<string, boolean>>({});
-  const [endpointDetails, setEndpointDetails] = useState<Record<string, EndpointAvailabilityDetails>>({});
+  const [endpointStatus, setEndpointStatus] = useState<Record<string, boolean>>(
+    {},
+  );
+  const [endpointDetails, setEndpointDetails] = useState<
+    Record<string, EndpointAvailabilityDetails>
+  >({});
   const [loading, setLoading] = useState(true);
   const [error, setError] = useState<string | null>(null);
   const fetchAllEndpointStatuses = async (force = false) => {
-    const endpointsKey = [...endpoints].sort().join(',');
+    const endpointsKey = [...endpoints].sort().join(",");
 
     // Skip if we already fetched these exact endpoints globally
     if (!force && globalFetchedSets.has(endpointsKey)) {
-      console.debug('[useEndpointConfig] Already fetched these endpoints globally, using cache');
+      console.debug(
+        "[useEndpointConfig] Already fetched these endpoints globally, using cache",
+      );
       const cached = endpoints.reduce(
         (acc, endpoint) => {
           const cachedDetails = globalEndpointCache[endpoint];
@@ -85,10 +94,13 @@ export function useMultipleEndpointsEnabled(endpoints: string[]): {
           }
           return acc;
         },
-        { status: {} as Record<string, boolean>, details: {} as Record<string, EndpointAvailabilityDetails> }
+        {
+          status: {} as Record<string, boolean>,
+          details: {} as Record<string, EndpointAvailabilityDetails>,
+        },
       );
       setEndpointStatus(cached.status);
-      setEndpointDetails(prev => ({ ...prev, ...cached.details }));
+      setEndpointDetails((prev) => ({ ...prev, ...cached.details }));
       setLoading(false);
       return;
     }
@@ -104,9 +116,13 @@ export function useMultipleEndpointsEnabled(endpoints: string[]): {
       setError(null);
 
       // Check which endpoints we haven't fetched yet
-      const newEndpoints = endpoints.filter(ep => !(ep in globalEndpointCache));
+      const newEndpoints = endpoints.filter(
+        (ep) => !(ep in globalEndpointCache),
+      );
       if (newEndpoints.length === 0) {
-        console.debug('[useEndpointConfig] All endpoints already in global cache');
+        console.debug(
+          "[useEndpointConfig] All endpoints already in global cache",
+        );
         const cached = endpoints.reduce(
           (acc, endpoint) => {
             const cachedDetails = globalEndpointCache[endpoint];
@@ -116,18 +132,25 @@ export function useMultipleEndpointsEnabled(endpoints: string[]): {
             }
             return acc;
           },
-          { status: {} as Record<string, boolean>, details: {} as Record<string, EndpointAvailabilityDetails> }
+          {
+            status: {} as Record<string, boolean>,
+            details: {} as Record<string, EndpointAvailabilityDetails>,
+          },
         );
         setEndpointStatus(cached.status);
-        setEndpointDetails(prev => ({ ...prev, ...cached.details }));
+        setEndpointDetails((prev) => ({ ...prev, ...cached.details }));
         globalFetchedSets.add(endpointsKey);
         setLoading(false);
         return;
       }
       // Use batch API for efficiency - only fetch new endpoints
-      const endpointsParam = newEndpoints.join(',');
+      const endpointsParam = newEndpoints.join(",");
 
-      const response = await apiClient.get<Record<string, EndpointAvailabilityDetails>>(`/api/v1/config/endpoints-availability?endpoints=${encodeURIComponent(endpointsParam)}`);
+      const response = await apiClient.get<
+        Record<string, EndpointAvailabilityDetails>
+      >(
+        `/api/v1/config/endpoints-availability?endpoints=${encodeURIComponent(endpointsParam)}`,
+      );
       const statusMap = response.data;
 
       // Update global cache with new results
@@ -149,46 +172,70 @@ export function useMultipleEndpointsEnabled(endpoints: string[]): {
           }
           return acc;
         },
-        { status: {} as Record<string, boolean>, details: {} as Record<string, EndpointAvailabilityDetails> }
+        {
+          status: {} as Record<string, boolean>,
+          details: {} as Record<string, EndpointAvailabilityDetails>,
+        },
       );
       setEndpointStatus(fullStatus.status);
-      setEndpointDetails(prev => ({ ...prev, ...fullStatus.details }));
+      setEndpointDetails((prev) => ({ ...prev, ...fullStatus.details }));
       globalFetchedSets.add(endpointsKey);
     } catch (err: unknown) {
       // On 401 (auth error), use optimistic fallback instead of disabling
       if (isAxiosError(err) && err.response?.status === 401) {
-        console.warn('[useEndpointConfig] 401 error - using optimistic fallback');
+        console.warn(
+          "[useEndpointConfig] 401 error - using optimistic fallback",
+        );
         const optimisticStatus = endpoints.reduce(
           (acc, endpoint) => {
-            const optimisticDetails: EndpointAvailabilityDetails = { enabled: true, reason: null };
+            const optimisticDetails: EndpointAvailabilityDetails = {
+              enabled: true,
+              reason: null,
+            };
             acc.status[endpoint] = true;
             acc.details[endpoint] = optimisticDetails;
             globalEndpointCache[endpoint] = optimisticDetails;
             return acc;
           },
-          { status: {} as Record<string, boolean>, details: {} as Record<string, EndpointAvailabilityDetails> }
+          {
+            status: {} as Record<string, boolean>,
+            details: {} as Record<string, EndpointAvailabilityDetails>,
+          },
         );
         setEndpointStatus(optimisticStatus.status);
-        setEndpointDetails(prev => ({ ...prev, ...optimisticStatus.details }));
+        setEndpointDetails((prev) => ({
+          ...prev,
+          ...optimisticStatus.details,
+        }));
         setLoading(false);
         return;
       }
-      const errorMessage = err instanceof Error ? err.message : 'Unknown error occurred';
+      const errorMessage =
+        err instanceof Error ? err.message : "Unknown error occurred";
       setError(errorMessage);
-      console.error('[EndpointConfig] Failed to check multiple endpoints:', err);
+      console.error(
+        "[EndpointConfig] Failed to check multiple endpoints:",
+        err,
+      );
 
       // Fallback: assume all endpoints are enabled on error (optimistic)
       const optimisticStatus = endpoints.reduce(
         (acc, endpoint) => {
-          const optimisticDetails: EndpointAvailabilityDetails = { enabled: true, reason: null };
+          const optimisticDetails: EndpointAvailabilityDetails = {
+            enabled: true,
+            reason: null,
+          };
           acc.status[endpoint] = true;
           acc.details[endpoint] = optimisticDetails;
-        return acc;
+          return acc;
+        },
+        {
+          status: {} as Record<string, boolean>,
+          details: {} as Record<string, EndpointAvailabilityDetails>,
         },
-        { status: {} as Record<string, boolean>, details: {} as Record<string, EndpointAvailabilityDetails> }
       );
       setEndpointStatus(optimisticStatus.status);
-      setEndpointDetails(prev => ({ ...prev, ...optimisticStatus.details }));
+      setEndpointDetails((prev) => ({ ...prev, ...optimisticStatus.details }));
     } finally {
       setLoading(false);
     }
@@ -196,7 +243,7 @@ export function useMultipleEndpointsEnabled(endpoints: string[]): {
 
   useEffect(() => {
     fetchAllEndpointStatuses();
-  }, [endpoints.join(',')]); // Re-run when endpoints array changes
+  }, [endpoints.join(",")]); // Re-run when endpoints array changes
 
   return {
     endpointStatus,
diff --git a/frontend/src/saas/hooks/useJwtConfigSync.ts b/frontend/src/saas/hooks/useJwtConfigSync.ts
index fffb73bb8e..db49306b17 100644
--- a/frontend/src/saas/hooks/useJwtConfigSync.ts
+++ b/frontend/src/saas/hooks/useJwtConfigSync.ts
@@ -2,6 +2,8 @@
  * SaaS no-op: Supabase handles auth, no JWT event listener needed,
  * and config is fetched on all pages (401 handling covers unauthenticated state).
  */
-export function useJwtConfigSync(_fetchConfig: (force?: boolean) => void): { isAuthPage: boolean } {
+export function useJwtConfigSync(_fetchConfig: (force?: boolean) => void): {
+  isAuthPage: boolean;
+} {
   return { isAuthPage: false };
 }
diff --git a/frontend/src/saas/hooks/usePlans.ts b/frontend/src/saas/hooks/usePlans.ts
index 7f26b1e527..62dd64bf90 100644
--- a/frontend/src/saas/hooks/usePlans.ts
+++ b/frontend/src/saas/hooks/usePlans.ts
@@ -1,18 +1,18 @@
-import { useState, useEffect, useMemo } from 'react';
-import { useTranslation } from 'react-i18next';
-import { supabase } from '@app/auth/supabase';
-import { useAuth } from '@app/auth/UseSession';
+import { useState, useEffect, useMemo } from "react";
+import { useTranslation } from "react-i18next";
+import { supabase } from "@app/auth/supabase";
+import { useAuth } from "@app/auth/UseSession";
 
 // Currency mapping
 const getCurrencySymbol = (currency: string): string => {
   const currencySymbols: { [key: string]: string } = {
-    'gbp': '£',
-    'usd': '$',
-    'eur': '€',
-    'cny': 'Â¥',
-    'inr': '₹',
-    'brl': 'R$',
-    'idr': 'Rp'
+    gbp: "£",
+    usd: "$",
+    eur: "€",
+    cny: "Â¥",
+    inr: "₹",
+    brl: "R$",
+    idr: "Rp",
   };
   return currencySymbols[currency.toLowerCase()] || currency.toUpperCase();
 };
@@ -51,146 +51,210 @@ export interface PlansData {
   activeSince?: string;
 }
 
-export const usePlans = (currency: string = 'gbp') => {
+export const usePlans = (currency: string = "gbp") => {
   const { t } = useTranslation();
   const { isPro, refreshProStatus } = useAuth();
   const [loading, setLoading] = useState(false);
   const [error, setError] = useState<string | null>(null);
-  const [currentPlanId, setCurrentPlanId] = useState<string>('free');
-  const [dynamicPrices, setDynamicPrices] = useState<Map<string, { unit_amount: number; currency: string }>>(new Map());
+  const [currentPlanId, setCurrentPlanId] = useState<string>("free");
+  const [dynamicPrices, setDynamicPrices] = useState<
+    Map<string, { unit_amount: number; currency: string }>
+  >(new Map());
 
-const fetchPricing = async () => {
-  try {
-    setLoading(true);
-    setError(null);
+  const fetchPricing = async () => {
+    try {
+      setLoading(true);
+      setError(null);
 
-    const lookupKeys = ['plan:pro', 'api:xsmall', 'api:small', 'api:medium', 'api:large'];
+      const lookupKeys = [
+        "plan:pro",
+        "api:xsmall",
+        "api:small",
+        "api:medium",
+        "api:large",
+      ];
 
-    const { data, error } = await supabase.functions.invoke<{
-      prices: Record<string, { unit_amount: number; currency: string }>;
-      missing: string[];
-    }>('stripe-price-lookup', {
-      body: { lookup_keys: lookupKeys, currency }
-    });
-    if (error) throw error;
-    if (!data || !data.prices || !data.missing) throw new Error('No pricing data returned');
-    console.log('Fetched pricing data:', data);
+      const { data, error } = await supabase.functions.invoke<{
+        prices: Record<string, { unit_amount: number; currency: string }>;
+        missing: string[];
+      }>("stripe-price-lookup", {
+        body: { lookup_keys: lookupKeys, currency },
+      });
+      if (error) throw error;
+      if (!data || !data.prices || !data.missing)
+        throw new Error("No pricing data returned");
+      console.log("Fetched pricing data:", data);
 
-    const priceMap = new Map<string, { unit_amount: number; currency: string }>();
-    // map your UI keys to lookup keys (if names differ)
-    const keyMap: Record<string, string> = {
-      pro: 'plan:pro',
-      xsmall: 'api:xsmall',
-      small: 'api:small',
-      medium: 'api:medium',
-      large: 'api:large',
-    };
+      const priceMap = new Map<
+        string,
+        { unit_amount: number; currency: string }
+      >();
+      // map your UI keys to lookup keys (if names differ)
+      const keyMap: Record<string, string> = {
+        pro: "plan:pro",
+        xsmall: "api:xsmall",
+        small: "api:small",
+        medium: "api:medium",
+        large: "api:large",
+      };
 
-    for (const [uiKey, lookupKey] of Object.entries(keyMap)) {
-      const p = data?.prices?.[lookupKey];
-      if (p) {
-        priceMap.set(uiKey, {
-          unit_amount: p.unit_amount ?? 0,
-          currency: p.currency
-        });
+      for (const [uiKey, lookupKey] of Object.entries(keyMap)) {
+        const p = data?.prices?.[lookupKey];
+        if (p) {
+          priceMap.set(uiKey, {
+            unit_amount: p.unit_amount ?? 0,
+            currency: p.currency,
+          });
+        }
       }
+
+      if (data.missing.length) {
+        console.warn("Missing prices for", data.missing, "in", currency);
+        // Optionally re-request with a fallback currency (e.g., 'usd')
+      }
+
+      setDynamicPrices(priceMap);
+    } catch (err) {
+      console.error("Error fetching pricing:", err);
+      setError(
+        err instanceof Error ? err.message : "Failed to fetch pricing data",
+      );
+      // continue with static prices if needed
+    } finally {
+      setLoading(false);
     }
-
-    if (data.missing.length) {
-      console.warn('Missing prices for', data.missing, 'in', currency);
-      // Optionally re-request with a fallback currency (e.g., 'usd')
-    }
-
-    setDynamicPrices(priceMap);
-  } catch (err) {
-    console.error('Error fetching pricing:', err);
-    setError(err instanceof Error ? err.message : 'Failed to fetch pricing data');
-    // continue with static prices if needed
-  } finally {
-    setLoading(false);
-  }
-};
-
+  };
 
   // Memoize static plan and package data to prevent recreation on every render
   const staticPlansData = useMemo(() => {
     const plans: PlanTier[] = [
       {
-        id: 'free',
-        name: t('plan.free.name', 'Free'),
+        id: "free",
+        name: t("plan.free.name", "Free"),
         price: 0,
         currency: getCurrencySymbol(currency),
-        period: t('plan.period.month', '/month'),
+        period: t("plan.period.month", "/month"),
         highlights: [
-          t('plan.free.highlight1', "Limited Tool Usage Per week"),
-          t('plan.free.highlight2',  "Access to all tools"),
-          t('plan.free.highlight3', 'Community support')
+          t("plan.free.highlight1", "Limited Tool Usage Per week"),
+          t("plan.free.highlight2", "Access to all tools"),
+          t("plan.free.highlight3", "Community support"),
         ],
         features: [
-          { name: t('plan.feature.pdfTools', 'Basic PDF Tools'), included: true },
-          { name: t('plan.feature.fileSize', 'File Size Limit'), included: false },
-          { name: t('plan.feature.automation', 'automate tool workflows'), included: false },
-          { name: t('plan.feature.api', 'API Access'), included: false },
-          { name: t('plan.feature.priority', 'Priority Support'), included: false },
-          { name: t('plan.feature.customPricing', 'Custom Pricing'), included: false },
-        ]
+          {
+            name: t("plan.feature.pdfTools", "Basic PDF Tools"),
+            included: true,
+          },
+          {
+            name: t("plan.feature.fileSize", "File Size Limit"),
+            included: false,
+          },
+          {
+            name: t("plan.feature.automation", "automate tool workflows"),
+            included: false,
+          },
+          { name: t("plan.feature.api", "API Access"), included: false },
+          {
+            name: t("plan.feature.priority", "Priority Support"),
+            included: false,
+          },
+          {
+            name: t("plan.feature.customPricing", "Custom Pricing"),
+            included: false,
+          },
+        ],
       },
       {
-        id: 'pro',
-        name: t('plan.pro.name', 'Pro'),
-        price: dynamicPrices.get('pro') ? dynamicPrices.get('pro')!.unit_amount / 100 : 8,
-        currency: dynamicPrices.get('pro') ? getCurrencySymbol(dynamicPrices.get('pro')!.currency) : getCurrencySymbol(currency),
-        period: t('plan.period.month', '/month'),
+        id: "pro",
+        name: t("plan.pro.name", "Pro"),
+        price: dynamicPrices.get("pro")
+          ? dynamicPrices.get("pro")!.unit_amount / 100
+          : 8,
+        currency: dynamicPrices.get("pro")
+          ? getCurrencySymbol(dynamicPrices.get("pro")!.currency)
+          : getCurrencySymbol(currency),
+        period: t("plan.period.month", "/month"),
         popular: true,
         highlights: [
-          t('plan.pro.highlight1', 'Unlimited Tool Usage'),
-          t('plan.pro.highlight2', 'Advanced PDF tools'),
-          t('plan.pro.highlight3', 'No watermarks')
+          t("plan.pro.highlight1", "Unlimited Tool Usage"),
+          t("plan.pro.highlight2", "Advanced PDF tools"),
+          t("plan.pro.highlight3", "No watermarks"),
         ],
         features: [
-          { name: t('plan.feature.pdfTools', 'Basic PDF Tools'), included: true },
-          { name: t('plan.feature.fileSize', 'File Size Limit'), included: true },
-          { name: t('plan.feature.automation', 'automate tool workflows'), included: true },
-          { name: t('plan.feature.api', 'Weekly API Credits'), included: true },
-          { name: t('plan.feature.priority', 'Priority Support'), included: false },
-          { name: t('plan.feature.customPricing', 'Custom Pricing'), included: false },
-        ]
+          {
+            name: t("plan.feature.pdfTools", "Basic PDF Tools"),
+            included: true,
+          },
+          {
+            name: t("plan.feature.fileSize", "File Size Limit"),
+            included: true,
+          },
+          {
+            name: t("plan.feature.automation", "automate tool workflows"),
+            included: true,
+          },
+          { name: t("plan.feature.api", "Weekly API Credits"), included: true },
+          {
+            name: t("plan.feature.priority", "Priority Support"),
+            included: false,
+          },
+          {
+            name: t("plan.feature.customPricing", "Custom Pricing"),
+            included: false,
+          },
+        ],
       },
       {
-        id: 'enterprise',
-        name: t('plan.enterprise.name', 'Enterprise'),
+        id: "enterprise",
+        name: t("plan.enterprise.name", "Enterprise"),
         price: 0,
         currency: getCurrencySymbol(currency),
-        period: '',
+        period: "",
         isContactOnly: true,
         highlights: [
-          t('plan.enterprise.highlight1', 'Custom pricing'),
-          t('plan.enterprise.highlight2', 'Dedicated support'),
-          t('plan.enterprise.highlight3', 'Latest features')
+          t("plan.enterprise.highlight1", "Custom pricing"),
+          t("plan.enterprise.highlight2", "Dedicated support"),
+          t("plan.enterprise.highlight3", "Latest features"),
         ],
         features: [
-          { name: t('plan.feature.pdfTools', 'Basic PDF Tools'), included: true },
-          { name: t('plan.feature.fileSize', 'File Size Limit'), included: true },
-          { name: t('plan.feature.automation', 'automate tool workflows'), included: true },
-          { name: t('plan.feature.api', 'Weekly API Credits'), included: true },
-          { name: t('plan.feature.priority', 'Priority Support'), included: true },
-          { name: t('plan.feature.customPricing', 'Custom Pricing'), included: true },
-        ]
-      }
+          {
+            name: t("plan.feature.pdfTools", "Basic PDF Tools"),
+            included: true,
+          },
+          {
+            name: t("plan.feature.fileSize", "File Size Limit"),
+            included: true,
+          },
+          {
+            name: t("plan.feature.automation", "automate tool workflows"),
+            included: true,
+          },
+          { name: t("plan.feature.api", "Weekly API Credits"), included: true },
+          {
+            name: t("plan.feature.priority", "Priority Support"),
+            included: true,
+          },
+          {
+            name: t("plan.feature.customPricing", "Custom Pricing"),
+            included: true,
+          },
+        ],
+      },
     ];
 
     // Helper function to get price info
     const getPriceInfo = (key: string, fallbackPrice: number) => {
       const priceObj = dynamicPrices.get(key);
       const price = priceObj ? priceObj.unit_amount / 100 : fallbackPrice;
-      const currencySymbol = priceObj ? getCurrencySymbol(priceObj.currency) : getCurrencySymbol(currency);
+      const currencySymbol = priceObj
+        ? getCurrencySymbol(priceObj.currency)
+        : getCurrencySymbol(currency);
       return { price, currencySymbol };
     };
 
-    const xsmallPrice = getPriceInfo('xsmall', 4);
-    const smallPrice = getPriceInfo('small', 15);
-    const mediumPrice = getPriceInfo('medium', 25);
-    const largePrice = getPriceInfo('large', 90);
+    const xsmallPrice = getPriceInfo("xsmall", 4);
+    const smallPrice = getPriceInfo("small", 15);
+    const mediumPrice = getPriceInfo("medium", 25);
+    const largePrice = getPriceInfo("large", 90);
 
     // Calculate dynamic discounts based on per-credit cost (using xsmall as baseline)
     const xsmallPerCredit = xsmallPrice.price / 100;
@@ -198,46 +262,52 @@ const fetchPricing = async () => {
     const mediumPerCredit = mediumPrice.price / 1000;
     const largePerCredit = largePrice.price / 5000;
 
-    const smallDiscount = Math.round((1 - smallPerCredit / xsmallPerCredit) * 100);
-    const mediumDiscount = Math.round((1 - mediumPerCredit / xsmallPerCredit) * 100);
-    const largeDiscount = Math.round((1 - largePerCredit / xsmallPerCredit) * 100);
+    const smallDiscount = Math.round(
+      (1 - smallPerCredit / xsmallPerCredit) * 100,
+    );
+    const mediumDiscount = Math.round(
+      (1 - mediumPerCredit / xsmallPerCredit) * 100,
+    );
+    const largeDiscount = Math.round(
+      (1 - largePerCredit / xsmallPerCredit) * 100,
+    );
 
     const apiPackages: ApiPackage[] = [
       {
-        id: 'xsmall',
-        name: t('plan.api.xsmall', '100 Credits'),
+        id: "xsmall",
+        name: t("plan.api.xsmall", "100 Credits"),
         price: xsmallPrice.price,
         currency: xsmallPrice.currencySymbol,
         credits: 100,
-        description: `${xsmallPrice.currencySymbol}${(xsmallPrice.price / 100).toFixed(3)} per credit`
+        description: `${xsmallPrice.currencySymbol}${(xsmallPrice.price / 100).toFixed(3)} per credit`,
       },
       {
-        id: 'small',
-        name: t('plan.api.small', '500 Credits'),
+        id: "small",
+        name: t("plan.api.small", "500 Credits"),
         price: smallPrice.price,
         currency: smallPrice.currencySymbol,
         credits: 500,
-        description: `${smallPrice.currencySymbol}${(smallPrice.price / 500).toFixed(3)} per credit${smallDiscount > 0 ? ` • ${smallDiscount}% discount` : ''}`
+        description: `${smallPrice.currencySymbol}${(smallPrice.price / 500).toFixed(3)} per credit${smallDiscount > 0 ? ` • ${smallDiscount}% discount` : ""}`,
       },
       {
-        id: 'medium',
-        name: t('plan.api.medium', '1,000 Credits'),
+        id: "medium",
+        name: t("plan.api.medium", "1,000 Credits"),
         price: mediumPrice.price,
         currency: mediumPrice.currencySymbol,
         credits: 1000,
-        description: `${mediumPrice.currencySymbol}${(mediumPrice.price / 1000).toFixed(3)} per credit${mediumDiscount > 0 ? ` • ${mediumDiscount}% discount` : ''}`
+        description: `${mediumPrice.currencySymbol}${(mediumPrice.price / 1000).toFixed(3)} per credit${mediumDiscount > 0 ? ` • ${mediumDiscount}% discount` : ""}`,
       },
       {
-        id: 'large',
-        name: t('plan.api.large', '5,000 Credits'),
+        id: "large",
+        name: t("plan.api.large", "5,000 Credits"),
         price: largePrice.price,
         currency: largePrice.currencySymbol,
         credits: 5000,
-        description: `${largePrice.currencySymbol}${(largePrice.price / 5000).toFixed(3)} per credit${largeDiscount > 0 ? ` • ${largeDiscount}% discount` : ''}`
-      }
+        description: `${largePrice.currencySymbol}${(largePrice.price / 5000).toFixed(3)} per credit${largeDiscount > 0 ? ` • ${largeDiscount}% discount` : ""}`,
+      },
     ];
 
-    const plansMap = new Map(plans.map(plan => [plan.id, plan]));
+    const plansMap = new Map(plans.map((plan) => [plan.id, plan]));
     return { plans: plansMap, apiPackages };
   }, [t, dynamicPrices]);
 
@@ -252,16 +322,15 @@ const fetchPricing = async () => {
       plans: staticPlansData.plans,
       apiPackages: staticPlansData.apiPackages,
       currentPlan,
-      nextBillingDate: 'Feb 15, 2025',
-      activeSince: 'January 2025'
+      nextBillingDate: "Feb 15, 2025",
+      activeSince: "January 2025",
     };
   }, [staticPlansData, currentPlanId]);
 
-
   // Update currentPlanId when isPro changes
   useEffect(() => {
     if (isPro !== null) {
-      setCurrentPlanId(isPro ? 'pro' : 'free');
+      setCurrentPlanId(isPro ? "pro" : "free");
     }
   }, [isPro]);
 
@@ -280,6 +349,6 @@ const fetchPricing = async () => {
     loading,
     error,
     refetch: refreshProStatus, // Refetch pro status from auth context
-    updateCurrentPlan // Add local plan update function
+    updateCurrentPlan, // Add local plan update function
   };
 };
diff --git a/frontend/src/saas/routes/AuthCallback.tsx b/frontend/src/saas/routes/AuthCallback.tsx
index 7b596d7858..1701163f9d 100644
--- a/frontend/src/saas/routes/AuthCallback.tsx
+++ b/frontend/src/saas/routes/AuthCallback.tsx
@@ -1,157 +1,173 @@
-import { useEffect, useState } from 'react'
-import { useNavigate } from 'react-router-dom'
-import { supabase } from '@app/auth/supabase'
-import { Button } from '@mantine/core'
-import { withBasePath } from '@app/constants/app'
+import { useEffect, useState } from "react";
+import { useNavigate } from "react-router-dom";
+import { supabase } from "@app/auth/supabase";
+import { Button } from "@mantine/core";
+import { withBasePath } from "@app/constants/app";
 
 interface CallbackState {
-  status: 'processing' | 'success' | 'error'
-  message: string
-  details?: Record<string, unknown>
+  status: "processing" | "success" | "error";
+  message: string;
+  details?: Record<string, unknown>;
 }
 
 export default function AuthCallback() {
-  const navigate = useNavigate()
+  const navigate = useNavigate();
   const [state, setState] = useState<CallbackState>({
-    status: 'processing',
-    message: 'Processing authentication...'
-  })
+    status: "processing",
+    message: "Processing authentication...",
+  });
 
   useEffect(() => {
     const handleCallback = async () => {
       try {
-        const url = new URL(window.location.href)
-        const code = url.searchParams.get('code')
-        const error = url.searchParams.get('error')
-        const errorDescription = url.searchParams.get('error_description')
-        const next = url.searchParams.get('next') || '/'
+        const url = new URL(window.location.href);
+        const code = url.searchParams.get("code");
+        const error = url.searchParams.get("error");
+        const errorDescription = url.searchParams.get("error_description");
+        const next = url.searchParams.get("next") || "/";
 
-        console.log('[Auth Callback Debug] URL parameters:', {
+        console.log("[Auth Callback Debug] URL parameters:", {
           hasCode: !!code,
           hasError: !!error,
           error,
           errorDescription,
           next,
-          fullUrl: window.location.href
-        })
+          fullUrl: window.location.href,
+        });
 
         // Handle OAuth errors
         if (error) {
-          const errorMsg = errorDescription || error
-          console.error('[Auth Callback Debug] OAuth error:', { error, errorDescription })
+          const errorMsg = errorDescription || error;
+          console.error("[Auth Callback Debug] OAuth error:", {
+            error,
+            errorDescription,
+          });
 
           setState({
-            status: 'error',
+            status: "error",
             message: `Authentication failed: ${errorMsg}`,
-            details: { error, errorDescription }
-          })
+            details: { error, errorDescription },
+          });
 
           // Redirect to login page after 3 seconds
-          setTimeout(() => navigate('/login', { replace: true }), 3000)
-          return
+          setTimeout(() => navigate("/login", { replace: true }), 3000);
+          return;
         }
 
         // If PKCE/SSR-style code is present, exchange it for a session
         if (code) {
-          console.log('[Auth Callback Debug] Exchanging code for session...')
+          console.log("[Auth Callback Debug] Exchanging code for session...");
 
           setState({
-            status: 'processing',
-            message: 'Exchanging authorization code...'
-          })
+            status: "processing",
+            message: "Exchanging authorization code...",
+          });
 
-          const { data, error: exchangeError } = await supabase.auth.exchangeCodeForSession(code)
+          const { data, error: exchangeError } =
+            await supabase.auth.exchangeCodeForSession(code);
 
           if (exchangeError) {
-            console.error('[Auth Callback Debug] Code exchange error:', exchangeError)
+            console.error(
+              "[Auth Callback Debug] Code exchange error:",
+              exchangeError,
+            );
 
             setState({
-              status: 'error',
+              status: "error",
               message: `Failed to complete sign in: ${exchangeError.message}`,
-              details: { exchangeError }
-            })
+              details: { exchangeError },
+            });
 
-            setTimeout(() => navigate('/login', { replace: true }), 3000)
-            return
+            setTimeout(() => navigate("/login", { replace: true }), 3000);
+            return;
           }
 
-          console.log('[Auth Callback Debug] Code exchange successful:', {
+          console.log("[Auth Callback Debug] Code exchange successful:", {
             hasSession: !!data.session,
             userId: data.session?.user?.id,
-            email: data.session?.user?.email
-          })
+            email: data.session?.user?.email,
+          });
 
           setState({
-            status: 'success',
-            message: 'Sign in successful! Redirecting...',
+            status: "success",
+            message: "Sign in successful! Redirecting...",
             details: {
               userId: data.session?.user?.id,
               email: data.session?.user?.email,
-              provider: data.session?.user?.app_metadata?.provider
-            }
-          })
+              provider: data.session?.user?.app_metadata?.provider,
+            },
+          });
         } else {
           // No code present - might already be authenticated
-          console.log('[Auth Callback Debug] No code present, checking existing session...')
+          console.log(
+            "[Auth Callback Debug] No code present, checking existing session...",
+          );
 
-          const { data: sessionData } = await supabase.auth.getSession()
+          const { data: sessionData } = await supabase.auth.getSession();
 
           if (sessionData.session) {
-            console.log('[Auth Callback Debug] Existing session found')
+            console.log("[Auth Callback Debug] Existing session found");
             setState({
-              status: 'success',
-              message: 'Already signed in! Redirecting...'
-            })
+              status: "success",
+              message: "Already signed in! Redirecting...",
+            });
           } else {
-            console.log('[Auth Callback Debug] No session found')
+            console.log("[Auth Callback Debug] No session found");
             setState({
-              status: 'error',
-              message: 'No authentication data found'
-            })
-            setTimeout(() => navigate('/login', { replace: true }), 2000)
-            return
+              status: "error",
+              message: "No authentication data found",
+            });
+            setTimeout(() => navigate("/login", { replace: true }), 2000);
+            return;
           }
         }
 
         // Redirect to the intended destination
-        const destination = next.startsWith('/') ? next : '/'
-        console.log('[Auth Callback Debug] Redirecting to:', destination)
-
-        setTimeout(() => navigate(destination, { replace: true }), 1500)
+        const destination = next.startsWith("/") ? next : "/";
+        console.log("[Auth Callback Debug] Redirecting to:", destination);
 
+        setTimeout(() => navigate(destination, { replace: true }), 1500);
       } catch (err) {
-        console.error('[Auth Callback Debug] Unexpected error:', err)
+        console.error("[Auth Callback Debug] Unexpected error:", err);
 
         setState({
-          status: 'error',
-          message: `Unexpected error: ${err instanceof Error ? err.message : 'Unknown error'}`,
-          details: { error: err }
-        })
+          status: "error",
+          message: `Unexpected error: ${err instanceof Error ? err.message : "Unknown error"}`,
+          details: { error: err },
+        });
 
-        setTimeout(() => navigate('/login', { replace: true }), 3000)
+        setTimeout(() => navigate("/login", { replace: true }), 3000);
       }
-    }
+    };
 
-    handleCallback()
-  }, [navigate])
+    handleCallback();
+  }, [navigate]);
 
   const getStatusColor = () => {
     switch (state.status) {
-      case 'processing': return 'text-blue-600'
-      case 'success': return 'text-green-600'
-      case 'error': return 'text-red-600'
-      default: return 'text-gray-600'
+      case "processing":
+        return "text-blue-600";
+      case "success":
+        return "text-green-600";
+      case "error":
+        return "text-red-600";
+      default:
+        return "text-gray-600";
     }
-  }
+  };
 
   const getTitle = () => {
     switch (state.status) {
-      case 'processing': return 'Signing you in'
-      case 'success': return 'You\'re all set!'
-      case 'error': return 'Authentication failed'
-      default: return 'Authentication'
+      case "processing":
+        return "Signing you in";
+      case "success":
+        return "You're all set!";
+      case "error":
+        return "Authentication failed";
+      default:
+        return "Authentication";
     }
-  }
+  };
 
   return (
     <div className="relative min-h-screen flex items-center justify-center overflow-hidden bg-gradient-to-br from-slate-50 via-white to-slate-100">
@@ -160,10 +176,12 @@ export default function AuthCallback() {
         <div className="absolute -bottom-32 -right-32 h-96 w-96 rounded-full bg-emerald-200/40 blur-3xl"></div>
       </div>
 
-      <div className={`w-full max-w-md rounded-2xl bg-white/80 backdrop-blur shadow-xl p-8`}>
+      <div
+        className={`w-full max-w-md rounded-2xl bg-white/80 backdrop-blur shadow-xl p-8`}
+      >
         <div className="text-center">
           <img
-            src={withBasePath("/branding/StirlingPDFLogoNoTextDark.svg")}
+            src={withBasePath("/modern-logo/StirlingPDFLogoNoTextDark.svg")}
             alt="Stirling PDF"
             className="mx-auto mb-5 h-8 opacity-80"
           />
@@ -171,11 +189,9 @@ export default function AuthCallback() {
           <h1 className="text-2xl font-bold text-gray-900 mb-2">
             {getTitle()}
           </h1>
-          <p className={`text-base ${getStatusColor()}`}>
-            {state.message}
-          </p>
+          <p className={`text-base ${getStatusColor()}`}>{state.message}</p>
 
-          {state.status === 'processing' && (
+          {state.status === "processing" && (
             <div className="mt-6">
               <div className="animate-spin rounded-full h-8 w-8 border-b-2 border-blue-600 mx-auto"></div>
               <div className="mt-3 h-1 overflow-hidden rounded-full bg-slate-200">
@@ -187,15 +203,15 @@ export default function AuthCallback() {
           {/* Action button - only show if error */}
           <div className="mt-6 flex items-center justify-center gap-3">
             {(() => {
-              if (state.status === 'error') {
+              if (state.status === "error") {
                 return (
                   <Button
-                    onClick={() => navigate('/login', { replace: true })}
+                    onClick={() => navigate("/login", { replace: true })}
                     className="inline-flex items-center rounded-md bg-rose-600 px-4 py-2 text-sm font-medium text-white shadow hover:bg-rose-700 focus:outline-none focus:ring-2 focus:ring-rose-500"
                   >
                     Back to login
                   </Button>
-                )
+                );
               }
             })()}
           </div>
@@ -213,5 +229,5 @@ export default function AuthCallback() {
         </div>
       </div>
     </div>
-  )
+  );
 }
diff --git a/frontend/src/saas/routes/Landing.tsx b/frontend/src/saas/routes/Landing.tsx
index 6204b86a49..f82df010b5 100644
--- a/frontend/src/saas/routes/Landing.tsx
+++ b/frontend/src/saas/routes/Landing.tsx
@@ -1,48 +1,69 @@
-import React, { useMemo } from 'react'
-import { Navigate, useLocation } from 'react-router-dom'
-import { useAuth } from '@app/auth/UseSession'
-import { useAutoAnonymousAuth } from '@app/hooks/useAutoAnonymousAuth'
-import { isToolRoute } from '@app/utils/pathUtils'
-import HomePage from '@app/pages/HomePage'
-import Login from '@app/routes/Login'
-import GuestUserBanner from '@app/components/auth/GuestUserBanner'
-import { TrialStatusBanner } from '@app/components/shared/TrialStatusBanner'
+import React, { useMemo } from "react";
+import { Navigate, useLocation } from "react-router-dom";
+import { useAuth } from "@app/auth/UseSession";
+import { useAutoAnonymousAuth } from "@app/hooks/useAutoAnonymousAuth";
+import { isToolRoute } from "@app/utils/pathUtils";
+import HomePage from "@app/pages/HomePage";
+import Login from "@app/routes/Login";
+import GuestUserBanner from "@app/components/auth/GuestUserBanner";
+import { TrialStatusBanner } from "@app/components/shared/TrialStatusBanner";
 
 export default function Landing() {
-  const { session, loading } = useAuth()
-  const { isAutoAuthenticating, autoAuthError, shouldTriggerAutoAuth } = useAutoAnonymousAuth()
-  const location = useLocation()
+  const { session, loading } = useAuth();
+  const { isAutoAuthenticating, autoAuthError, shouldTriggerAutoAuth } =
+    useAutoAnonymousAuth();
+  const location = useLocation();
 
   // Check if current path is a tool (prevents premature navigation on first render)
-  const isCurrentPathTool = useMemo(() => isToolRoute(location.pathname), [location.pathname])
+  const isCurrentPathTool = useMemo(
+    () => isToolRoute(location.pathname),
+    [location.pathname],
+  );
 
   // Match the same guarded bypass used in RequireAuth
-  const isLocalhost = typeof window !== 'undefined' && /^(localhost|127\.0\.0\.1)$/i.test(window.location.hostname)
-  const devBypassEnabled = Boolean(import.meta.env.DEV && isLocalhost && import.meta.env.VITE_DEV_BYPASS_AUTH === 'true')
+  const isLocalhost =
+    typeof window !== "undefined" &&
+    /^(localhost|127\.0\.0\.1)$/i.test(window.location.hostname);
+  const devBypassEnabled = Boolean(
+    import.meta.env.DEV &&
+    isLocalhost &&
+    import.meta.env.VITE_DEV_BYPASS_AUTH === "true",
+  );
 
-  console.log('[Landing] State:', {
+  console.log("[Landing] State:", {
     pathname: location.pathname,
     loading,
     hasSession: !!session,
     isAutoAuthenticating,
     shouldTriggerAutoAuth,
     isCurrentPathTool,
-    autoAuthError
-  })
+    autoAuthError,
+  });
 
   // Show loading while checking auth, while auto-authenticating, OR while preparing to auto-authenticate
   // CRITICAL: Also wait if shouldTriggerAutoAuth is true OR if we're on a tool route (prevents navigation before hook evaluates)
-  if (loading || isAutoAuthenticating || (!session && (shouldTriggerAutoAuth || isCurrentPathTool) && !autoAuthError)) {
+  if (
+    loading ||
+    isAutoAuthenticating ||
+    (!session && (shouldTriggerAutoAuth || isCurrentPathTool) && !autoAuthError)
+  ) {
     return (
-      <div style={{ minHeight: '100vh', display: 'flex', alignItems: 'center', justifyContent: 'center' }}>
+      <div
+        style={{
+          minHeight: "100vh",
+          display: "flex",
+          alignItems: "center",
+          justifyContent: "center",
+        }}
+      >
         <div className="text-center">
           <div className="animate-spin rounded-full h-8 w-8 border-b-2 border-blue-600 mx-auto mb-3"></div>
           <div className="text-gray-600">
-            {isAutoAuthenticating ? 'Setting up your session...' : 'Loading...'}
+            {isAutoAuthenticating ? "Setting up your session..." : "Loading..."}
           </div>
         </div>
       </div>
-    )
+    );
   }
 
   // If we have a session or dev bypass is enabled, show the main app
@@ -53,22 +74,23 @@ export default function Landing() {
         <TrialStatusBanner />
         <HomePage />
       </>
-    )
+    );
   }
 
   // If auto-authentication failed, navigate to login with error state
   if (autoAuthError && shouldTriggerAutoAuth) {
-    return <Navigate to="/login" replace state={{ autoAuthError, from: location }} />
+    return (
+      <Navigate to="/login" replace state={{ autoAuthError, from: location }} />
+    );
   }
 
   // If we're at home route ("/"), show login directly (marketing/landing page)
   // Otherwise navigate to login (fixes URL mismatch for tool routes)
-  const isHome = location.pathname === '/' || location.pathname === ''
+  const isHome = location.pathname === "/" || location.pathname === "";
   if (isHome) {
-    return <Login />
+    return <Login />;
   }
 
   // For non-home routes without auth, navigate to login (preserves from location)
-  return <Navigate to="/login" replace state={{ from: location }} />
+  return <Navigate to="/login" replace state={{ from: location }} />;
 }
-
diff --git a/frontend/src/saas/routes/Login.tsx b/frontend/src/saas/routes/Login.tsx
index 6a0109d583..8487921478 100644
--- a/frontend/src/saas/routes/Login.tsx
+++ b/frontend/src/saas/routes/Login.tsx
@@ -1,202 +1,238 @@
-import { useEffect, useState } from 'react'
-import { useNavigate } from 'react-router-dom'
-import { supabase, signInAnonymously } from '@app/auth/supabase'
-import { useAuth } from '@app/auth/UseSession'
-import { useTranslation } from '@app/hooks/useTranslation'
-import { useDocumentMeta } from '@app/hooks/useDocumentMeta'
-import AuthLayout from '@app/routes/authShared/AuthLayout'
-import '@app/routes/authShared/auth.css'
-import '@app/routes/authShared/saas-auth.css'
-import GuestSignInButton from '@app/routes/authShared/GuestSignInButton'
+import { useEffect, useState } from "react";
+import { useNavigate } from "react-router-dom";
+import { supabase, signInAnonymously } from "@app/auth/supabase";
+import { useAuth } from "@app/auth/UseSession";
+import { useTranslation } from "@app/hooks/useTranslation";
+import { useDocumentMeta } from "@app/hooks/useDocumentMeta";
+import AuthLayout from "@app/routes/authShared/AuthLayout";
+import "@app/routes/authShared/auth.css";
+import "@app/routes/authShared/saas-auth.css";
+import GuestSignInButton from "@app/routes/authShared/GuestSignInButton";
 
 // Import login components
-import LoginHeader from '@app/routes/login/LoginHeader'
-import ErrorMessage from '@app/routes/login/ErrorMessage'
-import EmailPasswordForm from '@app/routes/login/EmailPasswordForm'
-import MagicLinkForm from '@app/routes/login/MagicLinkForm'
-import OAuthButtons from '@app/routes/login/OAuthButtons'
-import DividerWithText from '@app/components/shared/DividerWithText'
-import LoggedInState from '@app/routes/login/LoggedInState'
-import { absoluteWithBasePath, getBaseUrl } from '@app/constants/app'
+import LoginHeader from "@app/routes/login/LoginHeader";
+import ErrorMessage from "@app/routes/login/ErrorMessage";
+import EmailPasswordForm from "@app/routes/login/EmailPasswordForm";
+import MagicLinkForm from "@app/routes/login/MagicLinkForm";
+import OAuthButtons from "@app/routes/login/OAuthButtons";
+import DividerWithText from "@app/components/shared/DividerWithText";
+import LoggedInState from "@app/routes/login/LoggedInState";
+import { absoluteWithBasePath, getBaseUrl } from "@app/constants/app";
 
 export default function Login() {
-  const navigate = useNavigate()
-  const { session, loading, refreshSession } = useAuth()
-  const { t } = useTranslation()
-  const [isSigningIn, setIsSigningIn] = useState(false)
-  const [error, setError] = useState<string | null>(null)
-  const [showMagicLink, setShowMagicLink] = useState(false)
-  const [showEmailForm, setShowEmailForm] = useState(false)
-  const [email, setEmail] = useState('')
-  const [password, setPassword] = useState('')
-  const [magicLinkEmail, setMagicLinkEmail] = useState('')
+  const navigate = useNavigate();
+  const { session, loading, refreshSession } = useAuth();
+  const { t } = useTranslation();
+  const [isSigningIn, setIsSigningIn] = useState(false);
+  const [error, setError] = useState<string | null>(null);
+  const [showMagicLink, setShowMagicLink] = useState(false);
+  const [showEmailForm, setShowEmailForm] = useState(false);
+  const [email, setEmail] = useState("");
+  const [password, setPassword] = useState("");
+  const [magicLinkEmail, setMagicLinkEmail] = useState("");
   // Prefill email from query param (e.g. after password reset)
   useEffect(() => {
     try {
-      const url = new URL(window.location.href)
-      const emailFromQuery = url.searchParams.get('email')
+      const url = new URL(window.location.href);
+      const emailFromQuery = url.searchParams.get("email");
       if (emailFromQuery) {
-        setEmail(emailFromQuery)
+        setEmail(emailFromQuery);
       }
     } catch (_) {
       // ignore
     }
-  }, [])
+  }, []);
 
   const baseUrl = getBaseUrl();
 
   // Set document meta
   useDocumentMeta({
-    title: `${t('login.title', 'Sign in')} - Stirling PDF`,
-    description: t('app.description', 'The Free Adobe Acrobat alternative (10M+ Downloads)'),
-    ogTitle: `${t('login.title', 'Sign in')} - Stirling PDF`,
-    ogDescription: t('app.description', 'The Free Adobe Acrobat alternative (10M+ Downloads)'),
+    title: `${t("login.title", "Sign in")} - Stirling PDF`,
+    description: t(
+      "app.description",
+      "The Free Adobe Acrobat alternative (10M+ Downloads)",
+    ),
+    ogTitle: `${t("login.title", "Sign in")} - Stirling PDF`,
+    ogDescription: t(
+      "app.description",
+      "The Free Adobe Acrobat alternative (10M+ Downloads)",
+    ),
     ogImage: `${baseUrl}/og_images/home.png`,
-    ogUrl: `${window.location.origin}${window.location.pathname}`
-  })
+    ogUrl: `${window.location.origin}${window.location.pathname}`,
+  });
 
   // Show logged in state if authenticated
   if (session && !loading) {
-    return <LoggedInState />
+    return <LoggedInState />;
   }
 
-  const signInWithProvider = async (provider: 'github' | 'google' | 'apple' | 'azure') => {
+  const signInWithProvider = async (
+    provider: "github" | "google" | "apple" | "azure",
+  ) => {
     try {
-      setIsSigningIn(true)
-      setError(null)
+      setIsSigningIn(true);
+      setError(null);
 
-      const redirectTo = absoluteWithBasePath('/auth/callback')
-      console.log(`[Login] Signing in with ${provider}`)
+      const redirectTo = absoluteWithBasePath("/auth/callback");
+      console.log(`[Login] Signing in with ${provider}`);
 
-      const oauthOptions: { redirectTo: string; queryParams?: Record<string, string> } = { redirectTo }
-      if (provider === 'apple') {
-        oauthOptions.queryParams = { scope: 'email name' }
-      } else if (provider === 'azure') {
-        oauthOptions.queryParams = { scope: 'openid profile email' }
+      const oauthOptions: {
+        redirectTo: string;
+        queryParams?: Record<string, string>;
+      } = { redirectTo };
+      if (provider === "apple") {
+        oauthOptions.queryParams = { scope: "email name" };
+      } else if (provider === "azure") {
+        oauthOptions.queryParams = { scope: "openid profile email" };
       } else {
         oauthOptions.queryParams = {
-          access_type: 'offline',
-          prompt: 'consent',
-        }
+          access_type: "offline",
+          prompt: "consent",
+        };
       }
 
       const { error } = await supabase.auth.signInWithOAuth({
         provider,
-        options: oauthOptions
-      })
+        options: oauthOptions,
+      });
 
       if (error) {
-        console.error(`[Login] ${provider} error:`, error)
-        setError(t('login.failedToSignIn', { provider, message: error.message }))
+        console.error(`[Login] ${provider} error:`, error);
+        setError(
+          t("login.failedToSignIn", { provider, message: error.message }),
+        );
       }
     } catch (err) {
-      console.error(`[Login] Unexpected error:`, err)
-      setError(t('login.unexpectedError', { message: err instanceof Error ? err.message : 'Unknown error' }))
+      console.error(`[Login] Unexpected error:`, err);
+      setError(
+        t("login.unexpectedError", {
+          message: err instanceof Error ? err.message : "Unknown error",
+        }),
+      );
     } finally {
-      setIsSigningIn(false)
+      setIsSigningIn(false);
     }
-  }
+  };
 
   const signInWithEmail = async () => {
     if (!email || !password) {
-      setError(t('login.pleaseEnterBoth'))
-      return
+      setError(t("login.pleaseEnterBoth"));
+      return;
     }
 
     try {
-      setIsSigningIn(true)
-      setError(null)
+      setIsSigningIn(true);
+      setError(null);
 
-      console.log('[Login] Signing in with email:', email)
+      console.log("[Login] Signing in with email:", email);
 
       const { data, error } = await supabase.auth.signInWithPassword({
         email: email.trim(),
-        password: password
-      })
+        password: password,
+      });
 
       if (error) {
-        console.error('[Login] Email sign in error:', error)
-        setError(error.message)
+        console.error("[Login] Email sign in error:", error);
+        setError(error.message);
       } else if (data.user) {
-        console.log('[Login] Email sign in successful')
+        console.log("[Login] Email sign in successful");
         // User will be redirected by the auth state change
       }
     } catch (err) {
-      console.error('[Login] Unexpected error]:', err)
-      setError(t('login.unexpectedError', { message: err instanceof Error ? err.message : 'Unknown error' }))
+      console.error("[Login] Unexpected error]:", err);
+      setError(
+        t("login.unexpectedError", {
+          message: err instanceof Error ? err.message : "Unknown error",
+        }),
+      );
     } finally {
-      setIsSigningIn(false)
+      setIsSigningIn(false);
     }
-  }
+  };
 
   const signInWithMagicLink = async () => {
     if (!magicLinkEmail) {
-      setError(t('login.pleaseEnterEmail'))
-      return
+      setError(t("login.pleaseEnterEmail"));
+      return;
     }
 
     try {
-      setIsSigningIn(true)
-      setError(null)
+      setIsSigningIn(true);
+      setError(null);
 
-      console.log('[Login] Sending magic link to:', magicLinkEmail)
+      console.log("[Login] Sending magic link to:", magicLinkEmail);
 
       const { error } = await supabase.auth.signInWithOtp({
         email: magicLinkEmail.trim(),
         options: {
-          emailRedirectTo: absoluteWithBasePath('/auth/callback')
-        }
-      })
+          emailRedirectTo: absoluteWithBasePath("/auth/callback"),
+        },
+      });
 
       if (error) {
-        console.error('[Login] Magic link error:', error)
-        setError(error.message)
+        console.error("[Login] Magic link error:", error);
+        setError(error.message);
       } else {
-        setError(null)
-        alert(t('login.magicLinkSent', { email: magicLinkEmail }))
-        setMagicLinkEmail('')
-        setShowMagicLink(false)
+        setError(null);
+        alert(t("login.magicLinkSent", { email: magicLinkEmail }));
+        setMagicLinkEmail("");
+        setShowMagicLink(false);
       }
     } catch (err) {
-      console.error('[Login] Unexpected error:', err)
-      setError(t('login.unexpectedError', { message: err instanceof Error ? err.message : 'Unknown error' }))
+      console.error("[Login] Unexpected error:", err);
+      setError(
+        t("login.unexpectedError", {
+          message: err instanceof Error ? err.message : "Unknown error",
+        }),
+      );
     } finally {
-      setIsSigningIn(false)
+      setIsSigningIn(false);
     }
-  }
+  };
 
   const handleForgotPassword = () => {
-    navigate('/auth/reset')
-  }
+    navigate("/auth/reset");
+  };
 
   const handleAnonymousSignIn = async () => {
     try {
-      setIsSigningIn(true)
-      setError(null)
-      console.log('[Login] Signing in anonymously')
+      setIsSigningIn(true);
+      setError(null);
+      console.log("[Login] Signing in anonymously");
 
-      const { data } = await signInAnonymously()
+      const { data } = await signInAnonymously();
 
       if (data.user) {
-        console.log('[Login] Anonymous sign in successful, refreshing session...')
+        console.log(
+          "[Login] Anonymous sign in successful, refreshing session...",
+        );
 
         // Refresh session to ensure backend endpoints are properly synchronized
-        await refreshSession()
+        await refreshSession();
 
-        console.log('[Login] Session refreshed, user will be redirected by auth state change')
+        console.log(
+          "[Login] Session refreshed, user will be redirected by auth state change",
+        );
         // User will be redirected by the auth state change after session refresh
       }
     } catch (err) {
-      console.error('[Login] Unexpected error:', err)
-      setError(t('login.unexpectedError', { message: err instanceof Error ? err.message : 'Unknown error' }))
+      console.error("[Login] Unexpected error:", err);
+      setError(
+        t("login.unexpectedError", {
+          message: err instanceof Error ? err.message : "Unknown error",
+        }),
+      );
     } finally {
-      setIsSigningIn(false)
+      setIsSigningIn(false);
     }
-  }
+  };
 
   return (
     <AuthLayout isEmailFormExpanded={showEmailForm}>
-      <LoginHeader title={t('login.login')} subtitle={t('login.subtitle', 'Sign back in to Stirling PDF')} />
+      <LoginHeader
+        title={t("login.login")}
+        subtitle={t("login.subtitle", "Sign back in to Stirling PDF")}
+      />
 
       <ErrorMessage error={error} />
 
@@ -208,7 +244,11 @@ export default function Login() {
       />
 
       {/* Divider between OAuth and Email */}
-      <DividerWithText text={t('signup.or', 'or')} respondsToDarkMode={false} opacity={0.4} />
+      <DividerWithText
+        text={t("signup.or", "or")}
+        respondsToDarkMode={false}
+        opacity={0.4}
+      />
 
       {/* Sign in with email button (primary color to match signup CTA) */}
       <div className="auth-section">
@@ -218,7 +258,7 @@ export default function Login() {
           disabled={isSigningIn}
           className="w-full px-4 py-[0.75rem] rounded-[0.625rem] text-base font-semibold mb-2 cursor-pointer border-0 disabled:opacity-50 disabled:cursor-not-allowed auth-cta-button"
         >
-          {t('login.useEmailInstead', 'Sign in with email')}
+          {t("login.useEmailInstead", "Sign in with email")}
         </button>
       </div>
 
@@ -230,7 +270,9 @@ export default function Login() {
           setPassword={setPassword}
           onSubmit={signInWithEmail}
           isSubmitting={isSigningIn}
-          submitButtonText={isSigningIn ? t('login.loggingIn') : t('login.login')}
+          submitButtonText={
+            isSigningIn ? t("login.loggingIn") : t("login.login")
+          }
         />
       )}
 
@@ -241,18 +283,26 @@ export default function Login() {
             onClick={handleForgotPassword}
             className="auth-link-black"
           >
-            {t('login.forgotPassword', 'Forgot your password?')}
+            {t("login.forgotPassword", "Forgot your password?")}
           </button>
         </div>
       )}
 
       {/* Divider then Guest */}
-      <DividerWithText text={t('signup.or', 'or')} respondsToDarkMode={false} opacity={0.4} />
+      <DividerWithText
+        text={t("signup.or", "or")}
+        respondsToDarkMode={false}
+        opacity={0.4}
+      />
 
       <GuestSignInButton
         onClick={handleAnonymousSignIn}
         disabled={isSigningIn}
-        label={isSigningIn ? t('login.signingIn', 'Signing in...') : t('login.signInAnonymously', 'Sign in as a Guest')}
+        label={
+          isSigningIn
+            ? t("login.signingIn", "Signing in...")
+            : t("login.signInAnonymously", "Sign in as a Guest")
+        }
       />
 
       <div className="auth-bottom-row">
@@ -261,21 +311,21 @@ export default function Login() {
           onClick={() => setShowMagicLink(true)}
           className="auth-link-black"
         >
-          {t('login.useMagicLink', 'Sign in with magic link')}
+          {t("login.useMagicLink", "Sign in with magic link")}
         </button>
 
         <button
           type="button"
-          onClick={() => navigate('/signup')}
+          onClick={() => navigate("/signup")}
           className="auth-link-black"
         >
-          {t('signup.signUp', 'Sign up')}
+          {t("signup.signUp", "Sign up")}
         </button>
       </div>
 
       {/* Magic link form renders on demand */}
       {showMagicLink && (
-        <div style={{ marginTop: '0.5rem' }}>
+        <div style={{ marginTop: "0.5rem" }}>
           <MagicLinkForm
             showMagicLink={showMagicLink}
             magicLinkEmail={magicLinkEmail}
@@ -287,5 +337,5 @@ export default function Login() {
         </div>
       )}
     </AuthLayout>
-  )
+  );
 }
diff --git a/frontend/src/saas/routes/ResetPassword.tsx b/frontend/src/saas/routes/ResetPassword.tsx
index bd5eef29ea..93a5eb4a29 100644
--- a/frontend/src/saas/routes/ResetPassword.tsx
+++ b/frontend/src/saas/routes/ResetPassword.tsx
@@ -1,170 +1,201 @@
-import { useEffect, useState } from 'react'
-import { useNavigate } from 'react-router-dom'
-import AuthLayout from '@app/routes/authShared/AuthLayout'
-import LoginHeader from '@app/routes/login/LoginHeader'
-import ErrorMessage from '@app/routes/login/ErrorMessage'
-import SuccessMessage from '@app/routes/login/SuccessMessage'
-import EmailPasswordForm from '@app/routes/login/EmailPasswordForm'
-import NavigationLink from '@app/routes/login/NavigationLink'
-import { supabase } from '@app/auth/supabase'
-import { absoluteWithBasePath } from '@app/constants/app'
-import { useTranslation } from '@app/hooks/useTranslation'
+import { useEffect, useState } from "react";
+import { useNavigate } from "react-router-dom";
+import AuthLayout from "@app/routes/authShared/AuthLayout";
+import LoginHeader from "@app/routes/login/LoginHeader";
+import ErrorMessage from "@app/routes/login/ErrorMessage";
+import SuccessMessage from "@app/routes/login/SuccessMessage";
+import EmailPasswordForm from "@app/routes/login/EmailPasswordForm";
+import NavigationLink from "@app/routes/login/NavigationLink";
+import { supabase } from "@app/auth/supabase";
+import { absoluteWithBasePath } from "@app/constants/app";
+import { useTranslation } from "@app/hooks/useTranslation";
 
 export default function ResetPassword() {
-  const { t } = useTranslation()
-  const navigate = useNavigate()
-  const [isSubmitting, setIsSubmitting] = useState(false)
-  const [email, setEmail] = useState('')
-  const [password, setPassword] = useState('')
-  const [confirmPassword, setConfirmPassword] = useState('')
-  const [error, setError] = useState<string | null>(null)
-  const [success, setSuccess] = useState<string | null>(null)
-  const [isRecovery, setIsRecovery] = useState(false)
-  const [didUpdate, setDidUpdate] = useState(false)
+  const { t } = useTranslation();
+  const navigate = useNavigate();
+  const [isSubmitting, setIsSubmitting] = useState(false);
+  const [email, setEmail] = useState("");
+  const [password, setPassword] = useState("");
+  const [confirmPassword, setConfirmPassword] = useState("");
+  const [error, setError] = useState<string | null>(null);
+  const [success, setSuccess] = useState<string | null>(null);
+  const [isRecovery, setIsRecovery] = useState(false);
+  const [didUpdate, setDidUpdate] = useState(false);
 
   useEffect(() => {
-    const url = new URL(window.location.href)
-    const type = url.searchParams.get('type')
-    const code = url.searchParams.get('code')
+    const url = new URL(window.location.href);
+    const type = url.searchParams.get("type");
+    const code = url.searchParams.get("code");
 
     // Also parse hash params (Supabase puts tokens & type in the hash)
-    const hash = url.hash || ''
-    const hashParams = new URLSearchParams(hash.startsWith('#') ? hash.substring(1) : hash)
-    const hashType = hashParams.get('type')
-    const hashError = hashParams.get('error')
-    const hashErrorDescription = hashParams.get('error_description')
+    const hash = url.hash || "";
+    const hashParams = new URLSearchParams(
+      hash.startsWith("#") ? hash.substring(1) : hash,
+    );
+    const hashType = hashParams.get("type");
+    const hashError = hashParams.get("error");
+    const hashErrorDescription = hashParams.get("error_description");
 
     if (hashError) {
       // Show a human-readable error and fall back to email-entry form
-      setError(hashErrorDescription || hashError)
-      setIsRecovery(false)
+      setError(hashErrorDescription || hashError);
+      setIsRecovery(false);
     }
 
     // Consider either source (query or hash) to decide if we're in recovery mode
-    const inRecovery = type === 'recovery' || hashType === 'recovery'
-    setIsRecovery(inRecovery)
+    const inRecovery = type === "recovery" || hashType === "recovery";
+    setIsRecovery(inRecovery);
 
     // If a PKCE-style code is present, exchange it for a session immediately
     const tryExchange = async () => {
       if (code) {
         try {
-          const { data, error } = await supabase.auth.exchangeCodeForSession(code)
+          const { data, error } =
+            await supabase.auth.exchangeCodeForSession(code);
           if (error) {
-            setError(error.message)
-            setIsRecovery(false)
+            setError(error.message);
+            setIsRecovery(false);
           } else if (data.session) {
-            setIsRecovery(true)
+            setIsRecovery(true);
           }
         } catch (e) {
-          setError(e instanceof Error ? e.message : String(e))
-          setIsRecovery(false)
+          setError(e instanceof Error ? e.message : String(e));
+          setIsRecovery(false);
         }
       } else {
         // If no code, see if Supabase already set the session from hash
-        const { data } = await supabase.auth.getSession()
+        const { data } = await supabase.auth.getSession();
         if (data.session && inRecovery) {
-          setIsRecovery(true)
+          setIsRecovery(true);
         }
       }
-    }
-    void tryExchange()
+    };
+    void tryExchange();
 
     // Clear sensitive tokens from the URL hash
-    if (hash.includes('access_token') || hashError) {
-      window.history.replaceState({}, document.title, window.location.pathname + (inRecovery ? '?type=recovery' : ''))
+    if (hash.includes("access_token") || hashError) {
+      window.history.replaceState(
+        {},
+        document.title,
+        window.location.pathname + (inRecovery ? "?type=recovery" : ""),
+      );
     }
 
     // Listen for Supabase auth state changes to confirm recovery state
     const { data: sub } = supabase.auth.onAuthStateChange((event) => {
-      if (event === 'PASSWORD_RECOVERY') {
-        setIsRecovery(true)
+      if (event === "PASSWORD_RECOVERY") {
+        setIsRecovery(true);
       }
-    })
+    });
 
     return () => {
-      sub.subscription.unsubscribe()
-    }
-  }, [])
+      sub.subscription.unsubscribe();
+    };
+  }, []);
 
   const handleSendEmail = async () => {
     if (!email) {
-      setError(t('login.pleaseEnterEmail'))
-      return
+      setError(t("login.pleaseEnterEmail"));
+      return;
     }
     try {
-      setIsSubmitting(true)
-      setError(null)
-      const redirectTo = absoluteWithBasePath('/auth/reset?type=recovery')
-      const { error } = await supabase.auth.resetPasswordForEmail(email.trim(), {
-        redirectTo
-      })
+      setIsSubmitting(true);
+      setError(null);
+      const redirectTo = absoluteWithBasePath("/auth/reset?type=recovery");
+      const { error } = await supabase.auth.resetPasswordForEmail(
+        email.trim(),
+        {
+          redirectTo,
+        },
+      );
       if (error) {
-        setError(error.message)
+        setError(error.message);
       } else {
-        setSuccess(t('login.passwordResetSent', { email }))
+        setSuccess(t("login.passwordResetSent", { email }));
       }
     } finally {
-      setIsSubmitting(false)
+      setIsSubmitting(false);
     }
-  }
+  };
 
   const handleUpdatePassword = async () => {
     if (!password || !confirmPassword) {
-      setError(t('signup.pleaseFillAllFields'))
-      return
+      setError(t("signup.pleaseFillAllFields"));
+      return;
     }
     if (password.length < 6) {
-      setError(t('signup.passwordTooShort'))
-      return
+      setError(t("signup.passwordTooShort"));
+      return;
     }
     if (password !== confirmPassword) {
-      setError(t('signup.passwordsDoNotMatch'))
-      return
+      setError(t("signup.passwordsDoNotMatch"));
+      return;
     }
     try {
-      setIsSubmitting(true)
-      setError(null)
-      const { data, error } = await supabase.auth.updateUser({ password })
+      setIsSubmitting(true);
+      setError(null);
+      const { data, error } = await supabase.auth.updateUser({ password });
       if (error) {
-        setError(error.message)
-        return
+        setError(error.message);
+        return;
       }
       if (data.user) {
-        setSuccess(t('login.passwordUpdatedSuccess', 'Your password has been updated successfully.'))
+        setSuccess(
+          t(
+            "login.passwordUpdatedSuccess",
+            "Your password has been updated successfully.",
+          ),
+        );
         // Clear the form fields
-        setPassword('')
-        setConfirmPassword('')
+        setPassword("");
+        setConfirmPassword("");
         // Show success-only state and then redirect after a short delay
-        setDidUpdate(true)
+        setDidUpdate(true);
         setTimeout(async () => {
-          const { data: sessionData } = await supabase.auth.getSession()
-          const { data: userData } = await supabase.auth.getUser()
-          const derivedEmail = userData.user?.email || email
+          const { data: sessionData } = await supabase.auth.getSession();
+          const { data: userData } = await supabase.auth.getUser();
+          const derivedEmail = userData.user?.email || email;
           if (sessionData.session) {
-            navigate('/')
+            navigate("/");
           } else {
-            const query = derivedEmail ? `?email=${encodeURIComponent(derivedEmail)}` : ''
-            navigate(`/login${query}`)
+            const query = derivedEmail
+              ? `?email=${encodeURIComponent(derivedEmail)}`
+              : "";
+            navigate(`/login${query}`);
           }
-        }, 2000)
+        }, 2000);
       }
     } finally {
-      setIsSubmitting(false)
+      setIsSubmitting(false);
     }
-  }
+  };
 
   return (
     <AuthLayout>
-      <LoginHeader title={isRecovery ? t('login.resetYourPassword', 'Reset your password') : t('login.forgotPassword', 'Forgot your password?')} />
+      <LoginHeader
+        title={
+          isRecovery
+            ? t("login.resetYourPassword", "Reset your password")
+            : t("login.forgotPassword", "Forgot your password?")
+        }
+      />
       {!didUpdate && <SuccessMessage success={success} />}
       <ErrorMessage error={error} />
 
       {didUpdate ? (
         <>
-          <SuccessMessage success={success || t('login.passwordUpdatedSuccess', 'Your password has been updated successfully.')} />
+          <SuccessMessage
+            success={
+              success ||
+              t(
+                "login.passwordUpdatedSuccess",
+                "Your password has been updated successfully.",
+              )
+            }
+          />
           <NavigationLink
-            onClick={() => navigate('/login')}
-            text={t('login.backToSignIn', 'Back to sign in')}
+            onClick={() => navigate("/login")}
+            text={t("login.backToSignIn", "Back to sign in")}
             isDisabled={isSubmitting}
           />
         </>
@@ -172,26 +203,30 @@ export default function ResetPassword() {
         <>
           <div className="auth-fields">
             <div className="auth-field">
-              <label htmlFor="password" className="auth-label">{t('signup.password')}</label>
+              <label htmlFor="password" className="auth-label">
+                {t("signup.password")}
+              </label>
               <input
                 id="password"
                 type="password"
                 name="new-password"
                 autoComplete="new-password"
-                placeholder={t('signup.enterPassword')}
+                placeholder={t("signup.enterPassword")}
                 value={password}
                 onChange={(e) => setPassword(e.target.value)}
                 className="auth-input"
               />
             </div>
             <div className="auth-field">
-              <label htmlFor="confirmPassword" className="auth-label">{t('signup.confirmPassword')}</label>
+              <label htmlFor="confirmPassword" className="auth-label">
+                {t("signup.confirmPassword")}
+              </label>
               <input
                 id="confirmPassword"
                 type="password"
                 name="new-password"
                 autoComplete="new-password"
-                placeholder={t('signup.confirmPasswordPlaceholder')}
+                placeholder={t("signup.confirmPasswordPlaceholder")}
                 value={confirmPassword}
                 onChange={(e) => setConfirmPassword(e.target.value)}
                 className="auth-input"
@@ -203,11 +238,13 @@ export default function ResetPassword() {
             disabled={isSubmitting || !password || !confirmPassword}
             className="auth-button"
           >
-            {isSubmitting ? t('login.sending', 'Sending…') : t('login.updatePassword', 'Update password')}
+            {isSubmitting
+              ? t("login.sending", "Sending…")
+              : t("login.updatePassword", "Update password")}
           </button>
           <NavigationLink
-            onClick={() => navigate('/login')}
-            text={t('login.backToSignIn', 'Back to sign in')}
+            onClick={() => navigate("/login")}
+            text={t("login.backToSignIn", "Back to sign in")}
             isDisabled={isSubmitting}
           />
         </>
@@ -215,26 +252,27 @@ export default function ResetPassword() {
         <>
           <EmailPasswordForm
             email={email}
-            password={''}
+            password={""}
             setEmail={setEmail}
             setPassword={() => {}}
             onSubmit={handleSendEmail}
             isSubmitting={isSubmitting}
-            submitButtonText={t('login.sendResetLink', 'Send reset link')}
+            submitButtonText={t("login.sendResetLink", "Send reset link")}
             showPasswordField={false}
           />
           <p className="text-sm text-gray-500 mt-3">
-            {t('login.resetHelp', 'Enter your email to receive a secure link to reset your password. If the link has expired, please request a new one.')}
+            {t(
+              "login.resetHelp",
+              "Enter your email to receive a secure link to reset your password. If the link has expired, please request a new one.",
+            )}
           </p>
           <NavigationLink
-            onClick={() => navigate('/login')}
-            text={t('login.backToSignIn', 'Back to sign in')}
+            onClick={() => navigate("/login")}
+            text={t("login.backToSignIn", "Back to sign in")}
             isDisabled={isSubmitting}
           />
         </>
       )}
     </AuthLayout>
-  )
+  );
 }
-
-
diff --git a/frontend/src/saas/routes/Signup.tsx b/frontend/src/saas/routes/Signup.tsx
index 24a83c0c5f..d772cbe378 100644
--- a/frontend/src/saas/routes/Signup.tsx
+++ b/frontend/src/saas/routes/Signup.tsx
@@ -1,161 +1,195 @@
-import { useState, useEffect } from 'react'
-import { useNavigate, useLocation } from 'react-router-dom'
-import { signInAnonymously } from '@app/auth/supabase'
-import { useAuth } from '@app/auth/UseSession'
-import { useTranslation } from '@app/hooks/useTranslation'
-import { useDocumentMeta } from '@app/hooks/useDocumentMeta'
-import { getBaseUrl } from '@app/constants/app'
-import AuthLayout from '@app/routes/authShared/AuthLayout'
-import '@app/routes/authShared/auth.css'
-import '@app/routes/authShared/saas-auth.css'
-import GuestSignInButton from '@app/routes/authShared/GuestSignInButton'
-import { alert } from '@app/components/toast'
+import { useState, useEffect } from "react";
+import { useNavigate, useLocation } from "react-router-dom";
+import { signInAnonymously } from "@app/auth/supabase";
+import { useAuth } from "@app/auth/UseSession";
+import { useTranslation } from "@app/hooks/useTranslation";
+import { useDocumentMeta } from "@app/hooks/useDocumentMeta";
+import { getBaseUrl } from "@app/constants/app";
+import AuthLayout from "@app/routes/authShared/AuthLayout";
+import "@app/routes/authShared/auth.css";
+import "@app/routes/authShared/saas-auth.css";
+import GuestSignInButton from "@app/routes/authShared/GuestSignInButton";
+import { alert } from "@app/components/toast";
 
 // Import signup components
-import LoginHeader from '@app/routes/login/LoginHeader'
-import ErrorMessage from '@app/routes/login/ErrorMessage'
-import OAuthButtons from '@app/routes/login/OAuthButtons'
-import DividerWithText from '@app/components/shared/DividerWithText'
-import SignupForm from '@app/routes/signup/SignupForm'
-import { useSignupFormValidation, SignupFieldErrors } from '@app/routes/signup/SignupFormValidation'
-import { useAuthService } from '@app/routes/signup/AuthService'
+import LoginHeader from "@app/routes/login/LoginHeader";
+import ErrorMessage from "@app/routes/login/ErrorMessage";
+import OAuthButtons from "@app/routes/login/OAuthButtons";
+import DividerWithText from "@app/components/shared/DividerWithText";
+import SignupForm from "@app/routes/signup/SignupForm";
+import {
+  useSignupFormValidation,
+  SignupFieldErrors,
+} from "@app/routes/signup/SignupFormValidation";
+import { useAuthService } from "@app/routes/signup/AuthService";
 
 export default function Signup() {
-  const navigate = useNavigate()
-  const location = useLocation()
-  const { session, loading, refreshSession } = useAuth()
-  const { t } = useTranslation()
-  const [isSigningUp, setIsSigningUp] = useState(false)
-  const [error, setError] = useState<string | null>(null)
-  const [showEmailForm, setShowEmailForm] = useState(false)
-  const [name, setName] = useState(undefined as string | undefined)
-  const [email, setEmail] = useState('')
-  const [password, setPassword] = useState('')
-  const [confirmPassword, setConfirmPassword] = useState('')
-  const [agree, setAgree] = useState(true)
-  const [fieldErrors, setFieldErrors] = useState<SignupFieldErrors>({})
+  const navigate = useNavigate();
+  const location = useLocation();
+  const { session, loading, refreshSession } = useAuth();
+  const { t } = useTranslation();
+  const [isSigningUp, setIsSigningUp] = useState(false);
+  const [error, setError] = useState<string | null>(null);
+  const [showEmailForm, setShowEmailForm] = useState(false);
+  const [name, setName] = useState(undefined as string | undefined);
+  const [email, setEmail] = useState("");
+  const [password, setPassword] = useState("");
+  const [confirmPassword, setConfirmPassword] = useState("");
+  const [agree, setAgree] = useState(true);
+  const [fieldErrors, setFieldErrors] = useState<SignupFieldErrors>({});
 
   // Check if we were redirected here with an auto-auth error
   useEffect(() => {
-    const state = location.state as { autoAuthError?: string } | null
+    const state = location.state as { autoAuthError?: string } | null;
     if (state?.autoAuthError) {
-      setError(`Unable to access tool: ${state.autoAuthError}`)
+      setError(`Unable to access tool: ${state.autoAuthError}`);
     }
-  }, [location.state])
+  }, [location.state]);
 
   // Redirect back to original tool URL once session appears (after auto-anon completes)
   useEffect(() => {
     if (!loading && session) {
-      const state = location.state as { from?: { pathname?: string; search?: string; hash?: string } } | null
-      const from = state?.from
-      if (from?.pathname && from.pathname !== '/signup' && from.pathname !== '/login') {
-        const target = `${from.pathname}${from.search ?? ''}${from.hash ?? ''}`
-        console.log('[Signup] Session detected, redirecting back to:', target)
-        navigate(target, { replace: true })
+      const state = location.state as {
+        from?: { pathname?: string; search?: string; hash?: string };
+      } | null;
+      const from = state?.from;
+      if (
+        from?.pathname &&
+        from.pathname !== "/signup" &&
+        from.pathname !== "/login"
+      ) {
+        const target = `${from.pathname}${from.search ?? ""}${from.hash ?? ""}`;
+        console.log("[Signup] Session detected, redirecting back to:", target);
+        navigate(target, { replace: true });
       }
     }
-  }, [loading, session, location.state, navigate])
+  }, [loading, session, location.state, navigate]);
 
   const handleAnonymousSignIn = async () => {
     try {
-      setIsSigningUp(true)
-      setError(null)
+      setIsSigningUp(true);
+      setError(null);
 
-      console.log('[Signup] Initiating anonymous sign-in...')
-      const { data } = await signInAnonymously()
+      console.log("[Signup] Initiating anonymous sign-in...");
+      const { data } = await signInAnonymously();
 
       if (data.user) {
-        console.log('[Signup] Anonymous sign-in successful, refreshing session...')
+        console.log(
+          "[Signup] Anonymous sign-in successful, refreshing session...",
+        );
 
         // Refresh session to ensure backend endpoints are properly synchronized
-        await refreshSession()
+        await refreshSession();
 
-        console.log('[Signup] Session refreshed, redirecting to home page')
+        console.log("[Signup] Session refreshed, redirecting to home page");
         // Redirect to home page after successful anonymous login and session refresh
-        navigate('/')
+        navigate("/");
       }
     } catch (err) {
-      console.error('[Signup] Anonymous sign-in unexpected error:', err)
-      setError(`Unexpected error: ${err instanceof Error ? err.message : 'Unknown error'}`)
+      console.error("[Signup] Anonymous sign-in unexpected error:", err);
+      setError(
+        `Unexpected error: ${err instanceof Error ? err.message : "Unknown error"}`,
+      );
     } finally {
-      setIsSigningUp(false)
+      setIsSigningUp(false);
     }
-  }
+  };
 
   const baseUrl = getBaseUrl();
 
   // Set document meta
   useDocumentMeta({
-    title: `${t('signup.title', 'Create an account')} - Stirling PDF`,
-    description: t('app.description', 'The Free Adobe Acrobat alternative (10M+ Downloads)'),
-    ogTitle: `${t('signup.title', 'Create an account')} - Stirling PDF`,
-    ogDescription: t('app.description', 'The Free Adobe Acrobat alternative (10M+ Downloads)'),
+    title: `${t("signup.title", "Create an account")} - Stirling PDF`,
+    description: t(
+      "app.description",
+      "The Free Adobe Acrobat alternative (10M+ Downloads)",
+    ),
+    ogTitle: `${t("signup.title", "Create an account")} - Stirling PDF`,
+    ogDescription: t(
+      "app.description",
+      "The Free Adobe Acrobat alternative (10M+ Downloads)",
+    ),
     ogImage: `${baseUrl}/og_images/home.png`,
-    ogUrl: `${window.location.origin}${window.location.pathname}`
-  })
+    ogUrl: `${window.location.origin}${window.location.pathname}`,
+  });
 
-  const { validateSignupForm } = useSignupFormValidation()
-  const { signUp, signInWithProvider } = useAuthService()
+  const { validateSignupForm } = useSignupFormValidation();
+  const { signUp, signInWithProvider } = useAuthService();
 
   const handleSignUp = async () => {
-    const validation = validateSignupForm(email, password, confirmPassword, name)
+    const validation = validateSignupForm(
+      email,
+      password,
+      confirmPassword,
+      name,
+    );
     if (!validation.isValid) {
-      setError(validation.error)
-      setFieldErrors(validation.fieldErrors || {})
-      return
+      setError(validation.error);
+      setFieldErrors(validation.fieldErrors || {});
+      return;
     }
 
     try {
-      setIsSigningUp(true)
-      setError(null)
-      setFieldErrors({})
+      setIsSigningUp(true);
+      setError(null);
+      setFieldErrors({});
 
-      const result = await signUp(email, password, name)
+      const result = await signUp(email, password, name);
 
       if (result.requiresEmailConfirmation) {
         alert({
-          alertType: 'success',
-          title: t('signup.checkEmailConfirmation'),
-          location: 'top-right',
-          isPersistentPopup: true
-        })
+          alertType: "success",
+          title: t("signup.checkEmailConfirmation"),
+          location: "top-right",
+          isPersistentPopup: true,
+        });
       } else {
         alert({
-          alertType: 'success',
-          title: t('signup.accountCreatedSuccessfully'),
-          location: 'top-right',
-          durationMs: 3000
-        })
-        setTimeout(() => navigate('/login'), 2000)
+          alertType: "success",
+          title: t("signup.accountCreatedSuccessfully"),
+          location: "top-right",
+          durationMs: 3000,
+        });
+        setTimeout(() => navigate("/login"), 2000);
       }
     } catch (err) {
-      console.error('[Signup] Unexpected error:', err)
-      setError(err instanceof Error ? err.message : t('signup.unexpectedError', { message: 'Unknown error' }))
+      console.error("[Signup] Unexpected error:", err);
+      setError(
+        err instanceof Error
+          ? err.message
+          : t("signup.unexpectedError", { message: "Unknown error" }),
+      );
     } finally {
-      setIsSigningUp(false)
+      setIsSigningUp(false);
     }
-  }
+  };
 
-  const handleProviderSignIn = async (provider: 'github' | 'google' | 'apple' | 'azure') => {
+  const handleProviderSignIn = async (
+    provider: "github" | "google" | "apple" | "azure",
+  ) => {
     try {
-      setIsSigningUp(true)
-      setError(null)
-      await signInWithProvider(provider)
+      setIsSigningUp(true);
+      setError(null);
+      await signInWithProvider(provider);
     } catch (err) {
-      setError(err instanceof Error ? err.message : t('signup.unexpectedError', { message: 'Unknown error' }))
+      setError(
+        err instanceof Error
+          ? err.message
+          : t("signup.unexpectedError", { message: "Unknown error" }),
+      );
     } finally {
-      setIsSigningUp(false)
+      setIsSigningUp(false);
     }
-  }
+  };
 
   return (
     <AuthLayout isEmailFormExpanded={showEmailForm}>
-      <LoginHeader title={t('signup.title')} subtitle={t('signup.subtitle')} />
+      <LoginHeader title={t("signup.title")} subtitle={t("signup.subtitle")} />
 
       <ErrorMessage error={error} />
 
       {/* OAuth first */}
-      <div style={{ marginBottom: '0.5rem' }}>
+      <div style={{ marginBottom: "0.5rem" }}>
         <OAuthButtons
           onProviderClick={handleProviderSignIn}
           isSubmitting={isSigningUp}
@@ -164,8 +198,12 @@ export default function Signup() {
       </div>
 
       {/* Divider between OAuth and Email */}
-      <div style={{ margin: '0.5rem 0' }}>
-        <DividerWithText text={t('signup.or', 'or')} respondsToDarkMode={false} opacity={0.4} />
+      <div style={{ margin: "0.5rem 0" }}>
+        <DividerWithText
+          text={t("signup.or", "or")}
+          respondsToDarkMode={false}
+          opacity={0.4}
+        />
       </div>
 
       {/* Use Email Instead button (toggles email form) */}
@@ -176,7 +214,7 @@ export default function Signup() {
           onClick={() => setShowEmailForm((v) => !v)}
           className="w-full px-4 py-[0.75rem] rounded-[0.625rem] text-base font-semibold mb-2 cursor-pointer border-0 disabled:opacity-50 disabled:cursor-not-allowed auth-cta-button"
         >
-          {t('signup.useEmailInstead', 'Use Email Instead')}
+          {t("signup.useEmailInstead", "Use Email Instead")}
         </button>
       </div>
 
@@ -199,25 +237,33 @@ export default function Signup() {
       )}
 
       <div className="auth-section-sm">
-        <DividerWithText text={t('signup.or', 'or')} respondsToDarkMode={false} opacity={0.4} />
+        <DividerWithText
+          text={t("signup.or", "or")}
+          respondsToDarkMode={false}
+          opacity={0.4}
+        />
       </div>
 
       <GuestSignInButton
         onClick={handleAnonymousSignIn}
         disabled={isSigningUp}
-        label={isSigningUp ? t('login.signingIn', 'Signing in...') : t('login.signInAnonymously', 'Sign in as a Guest')}
+        label={
+          isSigningUp
+            ? t("login.signingIn", "Signing in...")
+            : t("login.signInAnonymously", "Sign in as a Guest")
+        }
       />
 
       {/* Bottom row */}
       <div className="auth-bottom-right">
         <button
           type="button"
-          onClick={() => navigate('/login')}
+          onClick={() => navigate("/login")}
           className="auth-link-black"
         >
-          {t('login.logIn', 'Log In')}
+          {t("login.logIn", "Log In")}
         </button>
       </div>
     </AuthLayout>
-  )
+  );
 }
diff --git a/frontend/src/saas/routes/authShared/AuthLayout.module.css b/frontend/src/saas/routes/authShared/AuthLayout.module.css
index 7784f5b1d2..bf06dbfd22 100644
--- a/frontend/src/saas/routes/authShared/AuthLayout.module.css
+++ b/frontend/src/saas/routes/authShared/AuthLayout.module.css
@@ -7,7 +7,8 @@
   justify-content: center;
   background-color: var(--auth-bg-color-light-only);
   padding: 1.5rem 1.5rem 0;
-  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
+  font-family:
+    -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
   overflow: auto;
 }
 
diff --git a/frontend/src/saas/routes/authShared/AuthLayout.tsx b/frontend/src/saas/routes/authShared/AuthLayout.tsx
index 58244bf55f..0fe344db75 100644
--- a/frontend/src/saas/routes/authShared/AuthLayout.tsx
+++ b/frontend/src/saas/routes/authShared/AuthLayout.tsx
@@ -1,24 +1,30 @@
-import React, { useEffect, useMemo, useRef, useState } from 'react';
-import { useTranslation } from 'react-i18next';
-import LoginRightCarousel from '@app/components/shared/LoginRightCarousel';
-import buildLoginSlides from '@app/components/shared/loginSlides';
-import styles from '@app/routes/authShared/AuthLayout.module.css';
-import { useLogoVariant } from '@app/hooks/useLogoVariant';
-import { useIsOverflowing } from '@app/hooks/useIsOverflowing';
-import Footer from '@app/components/shared/Footer';
+import React, { useEffect, useMemo, useRef, useState } from "react";
+import { useTranslation } from "react-i18next";
+import LoginRightCarousel from "@app/components/shared/LoginRightCarousel";
+import buildLoginSlides from "@app/components/shared/loginSlides";
+import styles from "@app/routes/authShared/AuthLayout.module.css";
+import { useLogoVariant } from "@app/hooks/useLogoVariant";
+import { useIsOverflowing } from "@app/hooks/useIsOverflowing";
+import Footer from "@app/components/shared/Footer";
 
 interface AuthLayoutProps {
-  children: React.ReactNode
-  isEmailFormExpanded?: boolean
+  children: React.ReactNode;
+  isEmailFormExpanded?: boolean;
 }
 
-export default function AuthLayout({ children, isEmailFormExpanded = false }: AuthLayoutProps) {
+export default function AuthLayout({
+  children,
+  isEmailFormExpanded = false,
+}: AuthLayoutProps) {
   const { t } = useTranslation();
   const cardRef = useRef<HTMLDivElement | null>(null);
   const leftPanelRef = useRef<HTMLDivElement | null>(null);
   const [hideRightPanel, setHideRightPanel] = useState(false);
   const logoVariant = useLogoVariant();
-  const imageSlides = useMemo(() => buildLoginSlides(logoVariant, t), [logoVariant, t]);
+  const imageSlides = useMemo(
+    () => buildLoginSlides(logoVariant, t),
+    [logoVariant, t],
+  );
   const isOverflowing = useIsOverflowing(leftPanelRef);
 
   // Use either overflow detection or email form expansion to determine scrollable state
@@ -27,15 +33,20 @@ export default function AuthLayout({ children, isEmailFormExpanded = false }: Au
   // Force light mode on auth pages
   useEffect(() => {
     const htmlElement = document.documentElement;
-    const previousColorScheme = htmlElement.getAttribute('data-mantine-color-scheme');
+    const previousColorScheme = htmlElement.getAttribute(
+      "data-mantine-color-scheme",
+    );
 
     // Set light mode
-    htmlElement.setAttribute('data-mantine-color-scheme', 'light');
+    htmlElement.setAttribute("data-mantine-color-scheme", "light");
 
     // Cleanup: restore previous theme when leaving auth pages
     return () => {
       if (previousColorScheme) {
-        htmlElement.setAttribute('data-mantine-color-scheme', previousColorScheme);
+        htmlElement.setAttribute(
+          "data-mantine-color-scheme",
+          previousColorScheme,
+        );
       }
     };
   }, []);
@@ -52,11 +63,11 @@ export default function AuthLayout({ children, isEmailFormExpanded = false }: Au
       setHideRightPanel(tooNarrow || tooShort);
     };
     update();
-    window.addEventListener('resize', update);
-    window.addEventListener('orientationchange', update);
+    window.addEventListener("resize", update);
+    window.addEventListener("orientationchange", update);
     return () => {
-      window.removeEventListener('resize', update);
-      window.removeEventListener('orientationchange', update);
+      window.removeEventListener("resize", update);
+      window.removeEventListener("orientationchange", update);
     };
   }, []);
 
@@ -65,24 +76,33 @@ export default function AuthLayout({ children, isEmailFormExpanded = false }: Au
       <div className={styles.authMain}>
         <div
           ref={cardRef}
-          className={`${styles.authCard} ${!hideRightPanel ? styles.authCardTwoColumns : ''}`}
+          className={`${styles.authCard} ${!hideRightPanel ? styles.authCardTwoColumns : ""}`}
         >
           <div
             ref={leftPanelRef}
             className={`${styles.authLeftPanel} ${shouldBeScrollable ? styles.authLeftPanelScrollable : styles.authLeftPanelCentered}`}
           >
-            <div className={styles.authContent}>
-              {children}
-            </div>
+            <div className={styles.authContent}>{children}</div>
           </div>
           {!hideRightPanel && (
-            <LoginRightCarousel imageSlides={imageSlides} initialSeconds={5} slideSeconds={8} />
+            <LoginRightCarousel
+              imageSlides={imageSlides}
+              initialSeconds={5}
+              slideSeconds={8}
+            />
           )}
         </div>
       </div>
-      <div style={{ width: '100vw', marginTop: 'auto', marginLeft: '-1.5rem', marginRight: '-1.5rem' }}>
+      <div
+        style={{
+          width: "100vw",
+          marginTop: "auto",
+          marginLeft: "-1.5rem",
+          marginRight: "-1.5rem",
+        }}
+      >
         <Footer forceLightMode={true} analyticsEnabled />
       </div>
     </div>
-  )
+  );
 }
diff --git a/frontend/src/saas/routes/authShared/GuestSignInButton.tsx b/frontend/src/saas/routes/authShared/GuestSignInButton.tsx
index 7d4ec1b476..34493116c7 100644
--- a/frontend/src/saas/routes/authShared/GuestSignInButton.tsx
+++ b/frontend/src/saas/routes/authShared/GuestSignInButton.tsx
@@ -1,14 +1,18 @@
-import React from 'react'
-import '@app/routes/authShared/auth.css'
-import '@app/routes/authShared/saas-auth.css'
+import React from "react";
+import "@app/routes/authShared/auth.css";
+import "@app/routes/authShared/saas-auth.css";
 
 interface GuestSignInButtonProps {
-  label: string
-  onClick: () => void
-  disabled?: boolean
+  label: string;
+  onClick: () => void;
+  disabled?: boolean;
 }
 
-export default function GuestSignInButton({ label, onClick, disabled }: GuestSignInButtonProps) {
+export default function GuestSignInButton({
+  label,
+  onClick,
+  disabled,
+}: GuestSignInButtonProps) {
   return (
     <button
       type="button"
@@ -18,7 +22,5 @@ export default function GuestSignInButton({ label, onClick, disabled }: GuestSig
     >
       {label}
     </button>
-  )
+  );
 }
-
-
diff --git a/frontend/src/saas/routes/authShared/saas-auth.css b/frontend/src/saas/routes/authShared/saas-auth.css
index 601c64360a..5073a24c91 100644
--- a/frontend/src/saas/routes/authShared/saas-auth.css
+++ b/frontend/src/saas/routes/authShared/saas-auth.css
@@ -49,7 +49,9 @@
   color: #000000;
   border: 1px solid #e5e7eb;
   border-radius: 0.5rem;
-  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1);
+  box-shadow:
+    0 10px 15px -3px rgba(0, 0, 0, 0.1),
+    0 4px 6px -4px rgba(0, 0, 0, 0.1);
   padding: 0.25rem;
 }
 
diff --git a/frontend/src/saas/routes/login/EmailPasswordForm.tsx b/frontend/src/saas/routes/login/EmailPasswordForm.tsx
index 828b033e47..c14a2d5178 100644
--- a/frontend/src/saas/routes/login/EmailPasswordForm.tsx
+++ b/frontend/src/saas/routes/login/EmailPasswordForm.tsx
@@ -1,20 +1,20 @@
-import { useTranslation } from 'react-i18next';
-import '@app/routes/authShared/auth.css';
-import '@app/routes/authShared/saas-auth.css';
+import { useTranslation } from "react-i18next";
+import "@app/routes/authShared/auth.css";
+import "@app/routes/authShared/saas-auth.css";
 
 interface EmailPasswordFormProps {
-  email: string
-  password: string
-  setEmail: (email: string) => void
-  setPassword: (password: string) => void
-  onSubmit: () => void
-  isSubmitting: boolean
-  submitButtonText: string
-  showPasswordField?: boolean
+  email: string;
+  password: string;
+  setEmail: (email: string) => void;
+  setPassword: (password: string) => void;
+  onSubmit: () => void;
+  isSubmitting: boolean;
+  submitButtonText: string;
+  showPasswordField?: boolean;
   fieldErrors?: {
-    email?: string
-    password?: string
-  }
+    email?: string;
+    password?: string;
+  };
 }
 
 export default function EmailPasswordForm({
@@ -26,7 +26,7 @@ export default function EmailPasswordForm({
   isSubmitting,
   submitButtonText,
   showPasswordField = true,
-  fieldErrors = {}
+  fieldErrors = {},
 }: EmailPasswordFormProps) {
   const { t } = useTranslation();
 
@@ -38,16 +38,18 @@ export default function EmailPasswordForm({
     <form onSubmit={handleSubmit}>
       <div className="auth-fields">
         <div className="auth-field">
-          <label htmlFor="email" className="auth-label">{t('login.email', 'Email')}</label>
+          <label htmlFor="email" className="auth-label">
+            {t("login.email", "Email")}
+          </label>
           <input
             id="email"
             type="email"
             name="email"
             autoComplete="username email"
-            placeholder={t('login.enterEmail', 'Enter email')}
+            placeholder={t("login.enterEmail", "Enter email")}
             value={email}
             onChange={(e) => setEmail(e.target.value)}
-            className={`auth-input ${fieldErrors.email ? 'auth-input-error' : ''}`}
+            className={`auth-input ${fieldErrors.email ? "auth-input-error" : ""}`}
           />
           {fieldErrors.email && (
             <div className="auth-field-error">{fieldErrors.email}</div>
@@ -56,16 +58,18 @@ export default function EmailPasswordForm({
 
         {showPasswordField && (
           <div className="auth-field">
-            <label htmlFor="password" className="auth-label">{t('login.password')}</label>
+            <label htmlFor="password" className="auth-label">
+              {t("login.password")}
+            </label>
             <input
               id="password"
               type="password"
               name="current-password"
               autoComplete="current-password"
-              placeholder={t('login.enterPassword')}
+              placeholder={t("login.enterPassword")}
               value={password}
               onChange={(e) => setPassword(e.target.value)}
-              className={`auth-input ${fieldErrors.password ? 'auth-input-error' : ''}`}
+              className={`auth-input ${fieldErrors.password ? "auth-input-error" : ""}`}
             />
             {fieldErrors.password && (
               <div className="auth-field-error">{fieldErrors.password}</div>
diff --git a/frontend/src/saas/routes/login/LoadingState.tsx b/frontend/src/saas/routes/login/LoadingState.tsx
index 659ca9389d..c419fe696b 100644
--- a/frontend/src/saas/routes/login/LoadingState.tsx
+++ b/frontend/src/saas/routes/login/LoadingState.tsx
@@ -1,20 +1,22 @@
-import { useTranslation } from '@app/hooks/useTranslation'
+import { useTranslation } from "@app/hooks/useTranslation";
 
 export default function LoadingState() {
-  const { t } = useTranslation()
+  const { t } = useTranslation();
 
   return (
-    <div style={{
-      minHeight: '100vh',
-      display: 'flex',
-      alignItems: 'center',
-      justifyContent: 'center',
-      backgroundColor: '#f3f4f6'
-    }}>
-      <div style={{ textAlign: 'center' }}>
-        <div style={{ fontSize: '32px', marginBottom: '16px' }}>�</div>
-        <p style={{ color: '#6b7280' }}>{t('loading')}</p>
+    <div
+      style={{
+        minHeight: "100vh",
+        display: "flex",
+        alignItems: "center",
+        justifyContent: "center",
+        backgroundColor: "#f3f4f6",
+      }}
+    >
+      <div style={{ textAlign: "center" }}>
+        <div style={{ fontSize: "32px", marginBottom: "16px" }}>�</div>
+        <p style={{ color: "#6b7280" }}>{t("loading")}</p>
       </div>
     </div>
-  )
+  );
 }
diff --git a/frontend/src/saas/routes/login/MagicLinkForm.tsx b/frontend/src/saas/routes/login/MagicLinkForm.tsx
index 54666f35ae..0ed0e913a2 100644
--- a/frontend/src/saas/routes/login/MagicLinkForm.tsx
+++ b/frontend/src/saas/routes/login/MagicLinkForm.tsx
@@ -1,14 +1,14 @@
-import { useTranslation } from '@app/hooks/useTranslation'
-import '@app/routes/authShared/auth.css'
-import '@app/routes/authShared/saas-auth.css'
+import { useTranslation } from "@app/hooks/useTranslation";
+import "@app/routes/authShared/auth.css";
+import "@app/routes/authShared/saas-auth.css";
 
 interface MagicLinkFormProps {
-  showMagicLink: boolean
-  magicLinkEmail: string
-  setMagicLinkEmail: (email: string) => void
-  setShowMagicLink: (show: boolean) => void
-  onSubmit: () => void
-  isSubmitting: boolean
+  showMagicLink: boolean;
+  magicLinkEmail: string;
+  setMagicLinkEmail: (email: string) => void;
+  setShowMagicLink: (show: boolean) => void;
+  onSubmit: () => void;
+  isSubmitting: boolean;
 }
 
 export default function MagicLinkForm({
@@ -17,32 +17,34 @@ export default function MagicLinkForm({
   setMagicLinkEmail,
   setShowMagicLink,
   onSubmit,
-  isSubmitting
+  isSubmitting,
 }: MagicLinkFormProps) {
-  const { t } = useTranslation()
+  const { t } = useTranslation();
 
   if (!showMagicLink) {
     return (
       <div className="auth-toggle-wrapper">
         <button
-          onClick={() => { setShowMagicLink(true) }}
+          onClick={() => {
+            setShowMagicLink(true);
+          }}
           disabled={isSubmitting}
           className="auth-toggle-link"
         >
-          {t('login.useMagicLink')}
+          {t("login.useMagicLink")}
         </button>
       </div>
-    )
+    );
   }
 
   return (
     <div className="auth-magic-row">
       <input
         type="email"
-        placeholder={t('login.enterEmailForMagicLink')}
+        placeholder={t("login.enterEmailForMagicLink")}
         value={magicLinkEmail}
         onChange={(e) => setMagicLinkEmail(e.target.value)}
-        onKeyPress={(e) => e.key === 'Enter' && !isSubmitting && onSubmit()}
+        onKeyPress={(e) => e.key === "Enter" && !isSubmitting && onSubmit()}
         className="auth-input"
       />
       <button
@@ -50,8 +52,8 @@ export default function MagicLinkForm({
         disabled={isSubmitting || !magicLinkEmail}
         className="auth-magic-button"
       >
-        {isSubmitting ? t('login.sending') : t('login.sendMagicLink')}
+        {isSubmitting ? t("login.sending") : t("login.sendMagicLink")}
       </button>
     </div>
-  )
+  );
 }
diff --git a/frontend/src/saas/routes/login/OAuthButtons.tsx b/frontend/src/saas/routes/login/OAuthButtons.tsx
index e53bd3cf06..e016c125ec 100644
--- a/frontend/src/saas/routes/login/OAuthButtons.tsx
+++ b/frontend/src/saas/routes/login/OAuthButtons.tsx
@@ -1,90 +1,107 @@
-import { oauthProviders } from '@app/constants/authProviders'
-import { useTranslation } from '@app/hooks/useTranslation'
-import { Tooltip } from '@app/components/shared/Tooltip'
-import { withBasePath } from '@app/constants/app'
+import { oauthProviders } from "@app/constants/authProviders";
+import { useTranslation } from "@app/hooks/useTranslation";
+import { Tooltip } from "@app/components/shared/Tooltip";
+import { withBasePath } from "@app/constants/app";
 
 // Exports for compatibility with proprietary code
 export const DEBUG_SHOW_ALL_PROVIDERS = false;
 export const oauthProviderConfig = {
-  google: { label: 'Google', file: 'google.svg' },
-  github: { label: 'GitHub', file: 'github.svg' },
-  apple: { label: 'Apple', file: 'apple.svg' },
-  azure: { label: 'Microsoft', file: 'microsoft.svg' },
+  google: { label: "Google", file: "google.svg" },
+  github: { label: "GitHub", file: "github.svg" },
+  apple: { label: "Apple", file: "apple.svg" },
+  azure: { label: "Microsoft", file: "microsoft.svg" },
 };
 
 interface OAuthButtonsProps {
-  onProviderClick: (provider: 'github' | 'google') => void
-  isSubmitting: boolean
-  layout?: 'vertical' | 'grid' | 'icons' | 'fullwidth'
-  enabledProviders?: string[]  // List of enabled provider IDs from backend
+  onProviderClick: (provider: "github" | "google") => void;
+  isSubmitting: boolean;
+  layout?: "vertical" | "grid" | "icons" | "fullwidth";
+  enabledProviders?: string[]; // List of enabled provider IDs from backend
 }
 
-export default function OAuthButtons({ onProviderClick, isSubmitting, layout = 'vertical', enabledProviders: _enabledProviders = [] }: OAuthButtonsProps) {
-  const { t } = useTranslation()
+export default function OAuthButtons({
+  onProviderClick,
+  isSubmitting,
+  layout = "vertical",
+  enabledProviders: _enabledProviders = [],
+}: OAuthButtonsProps) {
+  const { t } = useTranslation();
 
-  if (layout === 'icons') {
+  if (layout === "icons") {
     return (
       <div className="oauth-container-icons">
         {oauthProviders.map((p) => (
           <Tooltip
             key={p.id}
-            content={`${t('login.signInWith', 'Sign in with')} ${p.label}`}
+            content={`${t("login.signInWith", "Sign in with")} ${p.label}`}
             position="top"
           >
             <button
-              onClick={() => onProviderClick(p.id as 'github' | 'google')}
+              onClick={() => onProviderClick(p.id as "github" | "google")}
               disabled={isSubmitting || p.isDisabled}
               className="oauth-button-icon"
-              aria-label={`${t('login.signInWith', 'Sign in with')} ${p.label}`}
+              aria-label={`${t("login.signInWith", "Sign in with")} ${p.label}`}
             >
-              <img src={withBasePath(`/Login/${p.file}`)} alt={p.label} className={`oauth-icon-small ${p.isDisabled ? 'opacity-20' : ''}`}/>
+              <img
+                src={withBasePath(`/Login/${p.file}`)}
+                alt={p.label}
+                className={`oauth-icon-small ${p.isDisabled ? "opacity-20" : ""}`}
+              />
             </button>
           </Tooltip>
         ))}
       </div>
-    )
+    );
   }
 
-  if (layout === 'grid') {
+  if (layout === "grid") {
     return (
       <div className="oauth-container-grid">
         {oauthProviders.map((p) => (
           <Tooltip
             key={p.id}
-            content={`${t('login.signInWith', 'Sign in with')} ${p.label}`}
+            content={`${t("login.signInWith", "Sign in with")} ${p.label}`}
             position="top"
           >
             <button
-              onClick={() => onProviderClick(p.id as 'github' | 'google')}
+              onClick={() => onProviderClick(p.id as "github" | "google")}
               disabled={isSubmitting || p.isDisabled}
               className="oauth-button-grid"
-              aria-label={`${t('login.signInWith', 'Sign in with')} ${p.label}`}
+              aria-label={`${t("login.signInWith", "Sign in with")} ${p.label}`}
             >
-              <img src={withBasePath(`/Login/${p.file}`)} alt={p.label} className={`oauth-icon-medium ${p.isDisabled ? 'opacity-20' : ''}`}/>
+              <img
+                src={withBasePath(`/Login/${p.file}`)}
+                alt={p.label}
+                className={`oauth-icon-medium ${p.isDisabled ? "opacity-20" : ""}`}
+              />
             </button>
           </Tooltip>
         ))}
       </div>
-    )
+    );
   }
 
-  if (layout === 'fullwidth') {
+  if (layout === "fullwidth") {
     return (
       <div className="oauth-container-fullwidth">
         {oauthProviders.map((p) => (
           <button
             key={p.id}
-            onClick={() => onProviderClick(p.id as 'github' | 'google')}
+            onClick={() => onProviderClick(p.id as "github" | "google")}
             disabled={isSubmitting || p.isDisabled}
             className="oauth-button-fullwidth"
             title={p.label}
           >
-            <img src={withBasePath(`/Login/${p.file}`)} alt={p.label} className={`oauth-icon-medium ${p.isDisabled ? 'opacity-20' : ''}`} />
+            <img
+              src={withBasePath(`/Login/${p.file}`)}
+              alt={p.label}
+              className={`oauth-icon-medium ${p.isDisabled ? "opacity-20" : ""}`}
+            />
             {p.label}
           </button>
         ))}
       </div>
-    )
+    );
   }
 
   return (
@@ -92,15 +109,19 @@ export default function OAuthButtons({ onProviderClick, isSubmitting, layout = '
       {oauthProviders.map((p) => (
         <button
           key={p.id}
-          onClick={() => onProviderClick(p.id as 'github' | 'google')}
+          onClick={() => onProviderClick(p.id as "github" | "google")}
           disabled={isSubmitting || p.isDisabled}
           className="oauth-button-vertical"
           title={p.label}
         >
-          <img src={withBasePath(`/Login/${p.file}`)} alt={p.label} className={`oauth-icon-tiny ${p.isDisabled ? 'opacity-20' : ''}`} />
+          <img
+            src={withBasePath(`/Login/${p.file}`)}
+            alt={p.label}
+            className={`oauth-icon-tiny ${p.isDisabled ? "opacity-20" : ""}`}
+          />
           {p.label}
         </button>
       ))}
     </div>
-  )
+  );
 }
diff --git a/frontend/src/saas/routes/login/SuccessMessage.tsx b/frontend/src/saas/routes/login/SuccessMessage.tsx
index a0cd4f2629..d2760aa242 100644
--- a/frontend/src/saas/routes/login/SuccessMessage.tsx
+++ b/frontend/src/saas/routes/login/SuccessMessage.tsx
@@ -1,13 +1,13 @@
 interface SuccessMessageProps {
-  success: string | null
+  success: string | null;
 }
 
 export default function SuccessMessage({ success }: SuccessMessageProps) {
-  if (!success) return null
+  if (!success) return null;
 
   return (
     <div className="success-message">
       <p className="success-message-text">{success}</p>
     </div>
-  )
+  );
 }
diff --git a/frontend/src/saas/routes/signup/AuthService.ts b/frontend/src/saas/routes/signup/AuthService.ts
index 45e0926e07..ae5c49eeab 100644
--- a/frontend/src/saas/routes/signup/AuthService.ts
+++ b/frontend/src/saas/routes/signup/AuthService.ts
@@ -1,54 +1,51 @@
-import { supabase } from '@app/auth/supabase'
-import { absoluteWithBasePath } from '@app/constants/app'
+import { supabase } from "@app/auth/supabase";
+import { absoluteWithBasePath } from "@app/constants/app";
 
 export const useAuthService = () => {
-
-  const signUp = async (
-    email: string,
-    password: string,
-    name?: string
-  ) => {
-    console.log('[Signup] Creating account for:', email)
+  const signUp = async (email: string, password: string, name?: string) => {
+    console.log("[Signup] Creating account for:", email);
 
     const { data, error } = await supabase.auth.signUp({
       email: email.trim(),
       password: password,
       options: {
-        emailRedirectTo: absoluteWithBasePath('/auth/callback'),
-        data: { full_name: name }
-      }
-    })
+        emailRedirectTo: absoluteWithBasePath("/auth/callback"),
+        data: { full_name: name },
+      },
+    });
 
     if (error) {
-      console.error('[Signup] Sign up error:', error)
-      throw new Error(error.message)
+      console.error("[Signup] Sign up error:", error);
+      throw new Error(error.message);
     }
 
     if (data.user) {
-      console.log('[Signup] Sign up successful:', data.user)
+      console.log("[Signup] Sign up successful:", data.user);
       return {
         user: data.user,
         session: data.session,
-        requiresEmailConfirmation: data.user && !data.session
-      }
+        requiresEmailConfirmation: data.user && !data.session,
+      };
     }
 
-    throw new Error('Unknown error occurred during signup')
-  }
+    throw new Error("Unknown error occurred during signup");
+  };
 
-  const signInWithProvider = async (provider: 'github' | 'google' | 'apple' | 'azure') => {
+  const signInWithProvider = async (
+    provider: "github" | "google" | "apple" | "azure",
+  ) => {
     const { error } = await supabase.auth.signInWithOAuth({
       provider,
-      options: { redirectTo: absoluteWithBasePath('/auth/callback') }
-    })
+      options: { redirectTo: absoluteWithBasePath("/auth/callback") },
+    });
 
     if (error) {
-      throw new Error(error.message)
+      throw new Error(error.message);
     }
-  }
+  };
 
   return {
     signUp,
-    signInWithProvider
-  }
-}
+    signInWithProvider,
+  };
+};
diff --git a/frontend/src/saas/services/accountDeletion.ts b/frontend/src/saas/services/accountDeletion.ts
index 5311036f33..4cfdddbdd0 100644
--- a/frontend/src/saas/services/accountDeletion.ts
+++ b/frontend/src/saas/services/accountDeletion.ts
@@ -1,4 +1,4 @@
-import { supabase } from '@app/auth/supabase';
+import { supabase } from "@app/auth/supabase";
 
 interface DeleteAccountOptions {
   notifyUser?: boolean;
@@ -11,16 +11,22 @@ interface DeleteUserResponse {
   stripe_redaction_job_id?: string | null;
 }
 
-export async function deleteCurrentAccount(options?: DeleteAccountOptions): Promise<void> {
-  const { data, error } = await supabase.functions.invoke<DeleteUserResponse>('delete-user', {
-    body: {
-      notify_user: options?.notifyUser ?? true,
+export async function deleteCurrentAccount(
+  options?: DeleteAccountOptions,
+): Promise<void> {
+  const { data, error } = await supabase.functions.invoke<DeleteUserResponse>(
+    "delete-user",
+    {
+      body: {
+        notify_user: options?.notifyUser ?? true,
+      },
     },
-  });
+  );
 
   if (error || !data?.success) {
     const serverMessage = data?.error;
-    const errorMessage = serverMessage || error?.message || 'Failed to delete account';
+    const errorMessage =
+      serverMessage || error?.message || "Failed to delete account";
     throw new Error(errorMessage);
   }
 }
diff --git a/frontend/src/saas/services/apiClient.test.ts b/frontend/src/saas/services/apiClient.test.ts
index 1e481bf022..01a9649387 100644
--- a/frontend/src/saas/services/apiClient.test.ts
+++ b/frontend/src/saas/services/apiClient.test.ts
@@ -1,9 +1,9 @@
-import { describe, it, expect, vi, beforeEach } from 'vitest';
-import type { Session, AuthError } from '@supabase/supabase-js';
-import { supabase } from '@app/auth/supabase';
+import { describe, it, expect, vi, beforeEach } from "vitest";
+import type { Session, AuthError } from "@supabase/supabase-js";
+import { supabase } from "@app/auth/supabase";
 
 // Mock supabase
-vi.mock('@app/auth/supabase', () => ({
+vi.mock("@app/auth/supabase", () => ({
   supabase: {
     auth: {
       getSession: vi.fn(),
@@ -12,21 +12,21 @@ vi.mock('@app/auth/supabase', () => ({
   },
 }));
 
-describe('apiClient', () => {
+describe("apiClient", () => {
   beforeEach(() => {
     vi.clearAllMocks();
     // Reset modules to get fresh instance of apiClient
     vi.resetModules();
   });
 
-  it('should add JWT token to request headers when session exists', async () => {
-    const mockToken = 'test-jwt-token-12345';
+  it("should add JWT token to request headers when session exists", async () => {
+    const mockToken = "test-jwt-token-12345";
     const mockSession = {
       access_token: mockToken,
-      refresh_token: 'refresh-token',
+      refresh_token: "refresh-token",
       expires_in: 3600,
-      token_type: 'bearer',
-      user: { id: 'user-123' },
+      token_type: "bearer",
+      user: { id: "user-123" },
     } as unknown as Session;
 
     // Mock getSession to return a session with token
@@ -36,7 +36,7 @@ describe('apiClient', () => {
     });
 
     // Import apiClient after mocking
-    const { default: apiClient } = await import('@app/services/apiClient');
+    const { default: apiClient } = await import("@app/services/apiClient");
 
     // Create a mock adapter to intercept the request
     const mockAdapter = vi.fn((config) => {
@@ -45,7 +45,7 @@ describe('apiClient', () => {
       return Promise.resolve({
         data: { success: true },
         status: 200,
-        statusText: 'OK',
+        statusText: "OK",
         headers: {},
         config,
       });
@@ -55,14 +55,14 @@ describe('apiClient', () => {
     apiClient.defaults.adapter = mockAdapter;
 
     // Make a test request
-    await apiClient.get('/api/v1/test');
+    await apiClient.get("/api/v1/test");
 
     // Verify the request was made with the token
     expect(mockAdapter).toHaveBeenCalled();
     expect(supabase.auth.getSession).toHaveBeenCalled();
   });
 
-  it('should handle requests when no session exists', async () => {
+  it("should handle requests when no session exists", async () => {
     // Mock getSession to return no session
     vi.mocked(supabase.auth.getSession).mockResolvedValue({
       data: { session: null },
@@ -70,7 +70,7 @@ describe('apiClient', () => {
     });
 
     // Import apiClient after mocking
-    const { default: apiClient } = await import('@app/services/apiClient');
+    const { default: apiClient } = await import("@app/services/apiClient");
 
     // Create a mock adapter to intercept the request
     const mockAdapter = vi.fn((config) => {
@@ -79,7 +79,7 @@ describe('apiClient', () => {
       return Promise.resolve({
         data: { success: true },
         status: 200,
-        statusText: 'OK',
+        statusText: "OK",
         headers: {},
         config,
       });
@@ -89,31 +89,31 @@ describe('apiClient', () => {
     apiClient.defaults.adapter = mockAdapter;
 
     // Make a test request
-    await apiClient.get('/api/v1/test');
+    await apiClient.get("/api/v1/test");
 
     // Verify the request was made without a token
     expect(mockAdapter).toHaveBeenCalled();
     expect(supabase.auth.getSession).toHaveBeenCalled();
   });
 
-  it('should refresh token on 401 response', async () => {
-    const oldToken = 'old-token';
-    const newToken = 'new-refreshed-token';
+  it("should refresh token on 401 response", async () => {
+    const oldToken = "old-token";
+    const newToken = "new-refreshed-token";
 
     const oldSession = {
       access_token: oldToken,
-      refresh_token: 'refresh-token',
+      refresh_token: "refresh-token",
       expires_in: 3600,
-      token_type: 'bearer',
-      user: { id: 'user-123' },
+      token_type: "bearer",
+      user: { id: "user-123" },
     } as unknown as Session;
 
     const newSession = {
       access_token: newToken,
-      refresh_token: 'new-refresh-token',
+      refresh_token: "new-refresh-token",
       expires_in: 3600,
-      token_type: 'bearer',
-      user: { id: 'user-123' },
+      token_type: "bearer",
+      user: { id: "user-123" },
     } as unknown as Session;
 
     // Mock initial session for first request
@@ -134,7 +134,7 @@ describe('apiClient', () => {
     });
 
     // Import apiClient after mocking
-    const { default: apiClient } = await import('@app/services/apiClient');
+    const { default: apiClient } = await import("@app/services/apiClient");
 
     let requestCount = 0;
     const mockAdapter = vi.fn((config) => {
@@ -144,8 +144,8 @@ describe('apiClient', () => {
       if (requestCount === 1) {
         // Verify first request has old token
         expect(config.headers.Authorization).toBe(`Bearer ${oldToken}`);
-        const error = Object.assign(new Error('Unauthorized'), {
-          response: { status: 401, data: { error: 'Unauthorized' } },
+        const error = Object.assign(new Error("Unauthorized"), {
+          response: { status: 401, data: { error: "Unauthorized" } },
           config,
         });
         return Promise.reject(error);
@@ -157,7 +157,7 @@ describe('apiClient', () => {
       return Promise.resolve({
         data: { success: true },
         status: 200,
-        statusText: 'OK',
+        statusText: "OK",
         headers: {},
         config,
       });
@@ -167,7 +167,7 @@ describe('apiClient', () => {
     apiClient.defaults.adapter = mockAdapter;
 
     // Make a test request that will trigger 401 and retry
-    const response = await apiClient.get('/api/v1/test');
+    const response = await apiClient.get("/api/v1/test");
 
     // Verify the token was refreshed and request retried
     expect(response.data).toEqual({ success: true });
@@ -176,12 +176,12 @@ describe('apiClient', () => {
     expect(getSessionCallCount).toBe(3); // Called for initial request, for checking if refresh is possible, and for retry
   });
 
-  it('should handle refresh token failure', async () => {
-    const oldToken = 'old-token';
+  it("should handle refresh token failure", async () => {
+    const oldToken = "old-token";
 
     const oldSession = {
       access_token: oldToken,
-      user: { id: 'user-123' },
+      user: { id: "user-123" },
     };
 
     // Mock initial session
@@ -197,19 +197,27 @@ describe('apiClient', () => {
     // Mock refresh to fail
     vi.mocked(supabase.auth.refreshSession).mockResolvedValue({
       data: { user: null, session: null },
-      error: { name: 'AuthError', message: 'Refresh failed', status: 400, code: 'auth_error' } as unknown as AuthError,
+      error: {
+        name: "AuthError",
+        message: "Refresh failed",
+        status: 400,
+        code: "auth_error",
+      } as unknown as AuthError,
     });
 
     // Import apiClient after mocking
-    const { default: apiClient } = await import('@app/services/apiClient');
+    const { default: apiClient } = await import("@app/services/apiClient");
 
     // Mock window.location for redirect test
-    Object.defineProperty(window, 'location', { writable: true, value: { href: '' } });
+    Object.defineProperty(window, "location", {
+      writable: true,
+      value: { href: "" },
+    });
 
     const mockAdapter = vi.fn((config) => {
       // Always return 401 to trigger refresh
-      const error = Object.assign(new Error('Unauthorized'), {
-        response: { status: 401, data: { error: 'Unauthorized' } },
+      const error = Object.assign(new Error("Unauthorized"), {
+        response: { status: 401, data: { error: "Unauthorized" } },
         config,
       });
       return Promise.reject(error);
@@ -220,14 +228,14 @@ describe('apiClient', () => {
 
     // Make a test request that will trigger 401
     try {
-      await apiClient.get('/api/v1/test');
+      await apiClient.get("/api/v1/test");
       // Should not reach here
       expect(true).toBe(false);
     } catch (_) {
       // Verify refresh was attempted
       expect(supabase.auth.refreshSession).toHaveBeenCalled();
       // Verify redirect to login
-      expect(window.location.href).toBe('/login');
+      expect(window.location.href).toBe("/login");
     }
   });
 });
diff --git a/frontend/src/saas/services/apiClient.ts b/frontend/src/saas/services/apiClient.ts
index 242823e6c4..4fc8407d05 100644
--- a/frontend/src/saas/services/apiClient.ts
+++ b/frontend/src/saas/services/apiClient.ts
@@ -1,30 +1,36 @@
-import axios from 'axios';
-import { supabase } from '@app/auth/supabase';
-import { handleHttpError } from '@app/services/httpErrorHandler';
-import { alert } from '@app/components/toast';
-import { openPlanSettings } from '@app/utils/appSettings';
+import axios from "axios";
+import { supabase } from "@app/auth/supabase";
+import { handleHttpError } from "@app/services/httpErrorHandler";
+import { alert } from "@app/components/toast";
+import { openPlanSettings } from "@app/utils/appSettings";
 
 // Global credit update callback - will be set by the AuthProvider
 let globalCreditUpdateCallback: ((credits: number) => void) | null = null;
 
 // Function to set the global credit update callback
-export const setGlobalCreditUpdateCallback = (callback: (credits: number) => void) => {
+export const setGlobalCreditUpdateCallback = (
+  callback: (credits: number) => void,
+) => {
   globalCreditUpdateCallback = callback;
 };
 
 // Helper: decode base64url JWT payload safely
 function decodeJwtPayload(token: string): Record<string, unknown> | null {
   try {
-    const parts = token.split('.');
+    const parts = token.split(".");
     if (parts.length < 2) return null;
-    const base64 = parts[1].replace(/-/g, '+').replace(/_/g, '/');
-    const padded = base64.padEnd(base64.length + (4 - (base64.length % 4)) % 4, '=');
-    const json = typeof atob !== 'undefined'
-      ? atob(padded)
-      : Buffer.from(padded, 'base64').toString('binary');
+    const base64 = parts[1].replace(/-/g, "+").replace(/_/g, "/");
+    const padded = base64.padEnd(
+      base64.length + ((4 - (base64.length % 4)) % 4),
+      "=",
+    );
+    const json =
+      typeof atob !== "undefined"
+        ? atob(padded)
+        : Buffer.from(padded, "base64").toString("binary");
     return JSON.parse(json);
   } catch (e) {
-    console.warn('[API Client] Failed to decode JWT payload:', e);
+    console.warn("[API Client] Failed to decode JWT payload:", e);
     return null;
   }
 }
@@ -32,21 +38,21 @@ function decodeJwtPayload(token: string): Record<string, unknown> | null {
 // Create axios instance with default config
 const apiClient = axios.create({
   baseURL: import.meta.env.VITE_API_BASE_URL,
-  responseType: 'json',
+  responseType: "json",
 });
 
 const LOW_CREDIT_THRESHOLD = 10;
 function notifyLowCredits(credits: number) {
-  const title = 'Credit balance low';
+  const title = "Credit balance low";
   const body = `You have ${credits} credits remaining.`;
   alert({
-    alertType: 'warning',
+    alertType: "warning",
     title,
     body,
-    buttonText: 'Top up',
+    buttonText: "Top up",
     buttonCallback: () => openPlanSettings(),
     isPersistentPopup: true,
-    location: 'bottom-right'
+    location: "bottom-right",
   });
 }
 // Request interceptor to add JWT token to all requests
@@ -54,144 +60,186 @@ apiClient.interceptors.request.use(
   async (config) => {
     try {
       // Get the current session from Supabase
-      const { data: { session }, error } = await supabase.auth.getSession();
+      const {
+        data: { session },
+        error,
+      } = await supabase.auth.getSession();
 
       if (error) {
-        console.error('[API Client] Error getting session:', error);
+        console.error("[API Client] Error getting session:", error);
       }
 
       // If we have a session with an access token, add it to the Authorization header
       if (session?.access_token) {
         config.headers.Authorization = `Bearer ${session.access_token}`;
         const payload = decodeJwtPayload(session.access_token);
-        const role = (payload?.['role'] as string) || (payload?.['user_role'] as string) || undefined;
-        const aud = payload?.['aud'] as string | undefined;
-        const isAnon = role === 'anon' || aud === 'anon';
+        const role =
+          (payload?.["role"] as string) ||
+          (payload?.["user_role"] as string) ||
+          undefined;
+        const aud = payload?.["aud"] as string | undefined;
+        const isAnon = role === "anon" || aud === "anon";
 
         // Debug logs for visibility during integration
         if (import.meta.env.DEV) {
-          console.debug('[API Client] Added JWT token to request:', config.url);
-          console.debug('[API Client] JWT payload:', payload);
-          console.debug('[API Client] Token role:', role, '| aud:', aud, '| isAnon:', isAnon);
+          console.debug("[API Client] Added JWT token to request:", config.url);
+          console.debug("[API Client] JWT payload:", payload);
+          console.debug(
+            "[API Client] Token role:",
+            role,
+            "| aud:",
+            aud,
+            "| isAnon:",
+            isAnon,
+          );
         }
       } else {
-        console.debug('[API Client] No JWT token available for request:', config.url);
+        console.debug(
+          "[API Client] No JWT token available for request:",
+          config.url,
+        );
       }
     } catch (error) {
-      console.error('[API Client] Error in request interceptor:', error);
+      console.error("[API Client] Error in request interceptor:", error);
     }
 
     return config;
   },
   (error) => {
     return Promise.reject(error);
-  }
+  },
 );
 
 // List of endpoints that don't require authentication
 const publicEndpoints = [
-  '/api/v1/config/app-config',
-  '/api/v1/info/status',
-  '/api/v1/config/public-config',
-  '/api/v1/config/endpoints-enabled',
+  "/api/v1/config/app-config",
+  "/api/v1/info/status",
+  "/api/v1/config/public-config",
+  "/api/v1/config/endpoints-enabled",
 ];
 
 // Response interceptor for handling token refresh and credit updates
 apiClient.interceptors.response.use(
   (response) => {
     // Check for X-Credits-Remaining header and update credits automatically
-    const creditsRemaining = response.headers['x-credits-remaining'];
+    const creditsRemaining = response.headers["x-credits-remaining"];
     if (creditsRemaining && globalCreditUpdateCallback) {
       const credits = parseInt(creditsRemaining, 10);
       if (!isNaN(credits) && credits >= 0) {
-        console.debug('[API Client] Updating credits from response header:', credits, 'for URL:', response.config?.url);
+        console.debug(
+          "[API Client] Updating credits from response header:",
+          credits,
+          "for URL:",
+          response.config?.url,
+        );
         globalCreditUpdateCallback(credits);
         // Show low-credit toast with top-up button when below threshold
         if (credits < LOW_CREDIT_THRESHOLD) {
           notifyLowCredits(credits);
         }
       } else {
-        console.warn('[API Client] Invalid credits value in response header:', creditsRemaining);
+        console.warn(
+          "[API Client] Invalid credits value in response header:",
+          creditsRemaining,
+        );
       }
     }
-    if (response.config?.url?.includes('/api/v1/credits')) {
-      console.debug('[API Client] Credits endpoint response headers:', response.headers);
+    if (response.config?.url?.includes("/api/v1/credits")) {
+      console.debug(
+        "[API Client] Credits endpoint response headers:",
+        response.headers,
+      );
     }
     return response;
   },
   async (error) => {
     const originalRequest = error.config;
-    const isPublicEndpoint = publicEndpoints.some(endpoint =>
-      originalRequest.url?.includes(endpoint)
+    const isPublicEndpoint = publicEndpoints.some((endpoint) =>
+      originalRequest.url?.includes(endpoint),
     );
 
     // If we get a 401 and haven't already tried to refresh, and it's not a public endpoint
-    if (error.response?.status === 401 && !originalRequest._retry && !isPublicEndpoint) {
+    if (
+      error.response?.status === 401 &&
+      !originalRequest._retry &&
+      !isPublicEndpoint
+    ) {
       originalRequest._retry = true;
 
       try {
         // Check if we have a session to refresh
-        const { data: { session } } = await supabase.auth.getSession();
+        const {
+          data: { session },
+        } = await supabase.auth.getSession();
 
         // Only try to refresh if we actually have a session
         if (session) {
-          const { data: { session: refreshedSession }, error: refreshError } = await supabase.auth.refreshSession();
+          const {
+            data: { session: refreshedSession },
+            error: refreshError,
+          } = await supabase.auth.refreshSession();
 
-        if (refreshError) {
-          console.error('[API Client] Token refresh failed:', refreshError);
+          if (refreshError) {
+            console.error("[API Client] Token refresh failed:", refreshError);
 
-          // Only redirect to login for protected endpoints, not public ones
-          const isPublicEndpoint = originalRequest.url?.includes('/api/v1/config/') ||
-                                  originalRequest.url?.includes('/api/v1/info/');
+            // Only redirect to login for protected endpoints, not public ones
+            const isPublicEndpoint =
+              originalRequest.url?.includes("/api/v1/config/") ||
+              originalRequest.url?.includes("/api/v1/info/");
 
-          if (!isPublicEndpoint) {
-            // Redirect to login only for protected endpoints
-            window.location.href = '/login';
+            if (!isPublicEndpoint) {
+              // Redirect to login only for protected endpoints
+              window.location.href = "/login";
+            }
+
+            return Promise.reject(error);
           }
 
-          return Promise.reject(error);
-        }
-
           if (refreshedSession?.access_token) {
             // Update the Authorization header with the new token
             originalRequest.headers = originalRequest.headers || {};
             originalRequest.headers.Authorization = `Bearer ${refreshedSession.access_token}`;
-            console.debug('[API Client] Retrying request with refreshed token');
+            console.debug("[API Client] Retrying request with refreshed token");
 
             // Retry the original request with the new token
             return apiClient(originalRequest);
           }
         } else {
           // No session exists, only redirect if not already on login page
-          console.debug('[API Client] No session to refresh, 401 on protected endpoint');
-          if (window.location.pathname !== '/login') {
-            window.location.href = '/login';
+          console.debug(
+            "[API Client] No session to refresh, 401 on protected endpoint",
+          );
+          if (window.location.pathname !== "/login") {
+            window.location.href = "/login";
           }
         }
       } catch (refreshError) {
-        console.error('[API Client] Error during token refresh:', refreshError);
+        console.error("[API Client] Error during token refresh:", refreshError);
       }
     }
 
     // For public endpoints with 401, just log and continue (don't redirect)
     if (isPublicEndpoint && error.response?.status === 401) {
-      console.debug('[API Client] 401 on public endpoint, continuing without auth:', originalRequest.url);
+      console.debug(
+        "[API Client] 401 on public endpoint, continuing without auth:",
+        originalRequest.url,
+      );
     }
-      const status = error.response?.status;
-      const url = error.config?.url;
-      const method = error.config?.method?.toUpperCase();
+    const status = error.response?.status;
+    const url = error.config?.url;
+    const method = error.config?.method?.toUpperCase();
 
-      console.error('[API Client] HTTP Error', {
-        status,
-        method,
-        url,
-        error: error.message,
-        data: error.response?.data
-      });
+    console.error("[API Client] HTTP Error", {
+      status,
+      method,
+      url,
+      error: error.message,
+      data: error.response?.data,
+    });
     await handleHttpError(error); // Handle error (shows toast unless suppressed)
 
     return Promise.reject(error);
-  }
+  },
 );
 
 export default apiClient;
diff --git a/frontend/src/saas/services/avatarSyncService.ts b/frontend/src/saas/services/avatarSyncService.ts
index 3ca58a245f..af041447ec 100644
--- a/frontend/src/saas/services/avatarSyncService.ts
+++ b/frontend/src/saas/services/avatarSyncService.ts
@@ -3,24 +3,27 @@
  * Downloads, optimizes, and syncs profile pictures from OAuth providers
  */
 
-import { supabase } from '@app/auth/supabase'
-import type { User } from '@supabase/supabase-js'
+import { supabase } from "@app/auth/supabase";
+import type { User } from "@supabase/supabase-js";
 
-const PROFILE_BUCKET = 'profile-pictures'
-const AVATAR_SIZE = 256 // 256x256 pixels
-const MAX_AVATAR_SIZE = 500 * 1024 // 500KB max file size after optimization
-const SYNC_INTERVAL_DAYS = 7 // Resync every 7 days
+const PROFILE_BUCKET = "profile-pictures";
+const AVATAR_SIZE = 256; // 256x256 pixels
+const MAX_AVATAR_SIZE = 500 * 1024; // 500KB max file size after optimization
+const SYNC_INTERVAL_DAYS = 7; // Resync every 7 days
 
 // Client-side cache to prevent repeated sync attempts in same browser session
-const sessionSyncCache = new Map<string, { timestamp: number; success: boolean }>()
+const sessionSyncCache = new Map<
+  string,
+  { timestamp: number; success: boolean }
+>();
 
 export interface ProfilePictureMetadata {
-  user_id: string
-  source: 'oauth' | 'upload'
-  provider: 'google' | 'github' | 'apple' | 'azure' | null
-  last_synced_at: string | null
-  created_at: string
-  updated_at: string
+  user_id: string;
+  source: "oauth" | "upload";
+  provider: "google" | "github" | "apple" | "azure" | null;
+  last_synced_at: string | null;
+  created_at: string;
+  updated_at: string;
 }
 
 /**
@@ -29,26 +32,26 @@ export interface ProfilePictureMetadata {
  * @returns Avatar URL or null if not available
  */
 export function getProviderAvatarUrl(user: User): string | null {
-  const provider = user.app_metadata?.provider
-  const metadata = user.user_metadata
+  const provider = user.app_metadata?.provider;
+  const metadata = user.user_metadata;
 
   if (!provider || !metadata) {
-    return null
+    return null;
   }
 
   switch (provider) {
-    case 'google':
-    case 'azure':
+    case "google":
+    case "azure":
       // Google and Azure use 'picture' field
-      return metadata.picture || null
-    case 'github':
+      return metadata.picture || null;
+    case "github":
       // GitHub uses 'avatar_url' field
-      return metadata.avatar_url || null
-    case 'apple':
+      return metadata.avatar_url || null;
+    case "apple":
       // Apple doesn't provide profile pictures via OAuth
-      return null
+      return null;
     default:
-      return null
+      return null;
   }
 }
 
@@ -62,70 +65,78 @@ export async function downloadAndOptimizeAvatar(url: string): Promise<Blob> {
   try {
     // 1. Fetch image from provider URL
     const response = await fetch(url, {
-      mode: 'cors',
-      credentials: 'omit',
-    })
+      mode: "cors",
+      credentials: "omit",
+    });
 
     if (!response.ok) {
-      throw new Error(`Failed to download avatar: ${response.status} ${response.statusText}`)
+      throw new Error(
+        `Failed to download avatar: ${response.status} ${response.statusText}`,
+      );
     }
 
-    const blob = await response.blob()
+    const blob = await response.blob();
 
     // 2. Create image bitmap
-    const img = await createImageBitmap(blob)
+    const img = await createImageBitmap(blob);
 
     // 3. Create canvas and draw scaled image
-    const canvas = document.createElement('canvas')
-    canvas.width = AVATAR_SIZE
-    canvas.height = AVATAR_SIZE
-    const ctx = canvas.getContext('2d')
+    const canvas = document.createElement("canvas");
+    canvas.width = AVATAR_SIZE;
+    canvas.height = AVATAR_SIZE;
+    const ctx = canvas.getContext("2d");
 
     if (!ctx) {
-      throw new Error('Failed to get canvas context')
+      throw new Error("Failed to get canvas context");
     }
 
     // Draw image scaled to fit (maintains aspect ratio, centered)
-    const scale = Math.min(AVATAR_SIZE / img.width, AVATAR_SIZE / img.height)
-    const x = (AVATAR_SIZE - img.width * scale) / 2
-    const y = (AVATAR_SIZE - img.height * scale) / 2
-    ctx.drawImage(img, x, y, img.width * scale, img.height * scale)
+    const scale = Math.min(AVATAR_SIZE / img.width, AVATAR_SIZE / img.height);
+    const x = (AVATAR_SIZE - img.width * scale) / 2;
+    const y = (AVATAR_SIZE - img.height * scale) / 2;
+    ctx.drawImage(img, x, y, img.width * scale, img.height * scale);
 
     // 4. Convert to PNG blob with quality optimization
     return new Promise((resolve, reject) => {
       canvas.toBlob(
         (optimizedBlob) => {
           if (!optimizedBlob) {
-            reject(new Error('Failed to create optimized blob'))
-            return
+            reject(new Error("Failed to create optimized blob"));
+            return;
           }
 
           // Check file size
           if (optimizedBlob.size > MAX_AVATAR_SIZE) {
-            console.warn('[Avatar Sync] Optimized avatar exceeds max size:', optimizedBlob.size)
+            console.warn(
+              "[Avatar Sync] Optimized avatar exceeds max size:",
+              optimizedBlob.size,
+            );
             // Try with lower quality
             canvas.toBlob(
               (lowerQualityBlob) => {
                 if (lowerQualityBlob) {
-                  resolve(lowerQualityBlob)
+                  resolve(lowerQualityBlob);
                 } else {
-                  reject(new Error('Failed to create lower quality blob'))
+                  reject(new Error("Failed to create lower quality blob"));
                 }
               },
-              'image/png',
-              0.7
-            )
+              "image/png",
+              0.7,
+            );
           } else {
-            resolve(optimizedBlob)
+            resolve(optimizedBlob);
           }
         },
-        'image/png',
-        0.9
-      )
-    })
+        "image/png",
+        0.9,
+      );
+    });
   } catch (error) {
-    console.error('[Avatar Sync] Failed to download and optimize avatar:', error)
-    throw error
+    console.error(
+      "[Avatar Sync] Failed to download and optimize avatar:",
+      error,
+    );
+    throw error;
   }
 }
 
@@ -134,29 +145,32 @@ export async function downloadAndOptimizeAvatar(url: string): Promise<Blob> {
  * @param userId User ID
  * @param blob Optimized avatar blob
  */
-export async function uploadAvatarToStorage(userId: string, blob: Blob): Promise<void> {
+export async function uploadAvatarToStorage(
+  userId: string,
+  blob: Blob,
+): Promise<void> {
   try {
-    const profilePath = `${userId}/avatar`
+    const profilePath = `${userId}/avatar`;
 
-    console.debug('[Avatar Sync] Uploading avatar to storage:', profilePath)
+    console.debug("[Avatar Sync] Uploading avatar to storage:", profilePath);
 
     // Upload to Supabase Storage (overwrites existing file)
     const { error: uploadError } = await supabase.storage
       .from(PROFILE_BUCKET)
       .upload(profilePath, blob, {
         upsert: true, // Overwrite existing file
-        contentType: 'image/png',
-        cacheControl: '3600', // Cache for 1 hour
-      })
+        contentType: "image/png",
+        cacheControl: "3600", // Cache for 1 hour
+      });
 
     if (uploadError) {
-      throw uploadError
+      throw uploadError;
     }
 
-    console.debug('[Avatar Sync] Avatar uploaded successfully')
+    console.debug("[Avatar Sync] Avatar uploaded successfully");
   } catch (error) {
-    console.error('[Avatar Sync] Failed to upload avatar to storage:', error)
-    throw error
+    console.error("[Avatar Sync] Failed to upload avatar to storage:", error);
+    throw error;
   }
 }
 
@@ -166,29 +180,37 @@ export async function uploadAvatarToStorage(userId: string, blob: Blob): Promise
  * @returns Metadata or null if not found
  */
 export async function getProfilePictureMetadata(
-  userId: string
+  userId: string,
 ): Promise<ProfilePictureMetadata | null> {
   try {
     const { data, error } = await supabase
-      .from('profile_picture_metadata')
-      .select('*')
-      .eq('user_id', userId)
-      .maybeSingle()
+      .from("profile_picture_metadata")
+      .select("*")
+      .eq("user_id", userId)
+      .maybeSingle();
 
     if (error) {
       // If table doesn't exist, that's expected before migration runs
-      if (error.code === 'PGRST116' || error.message?.includes('does not exist')) {
-        console.debug('[Avatar Sync] Metadata table not found - migration may not be applied yet')
-        return null
+      if (
+        error.code === "PGRST116" ||
+        error.message?.includes("does not exist")
+      ) {
+        console.debug(
+          "[Avatar Sync] Metadata table not found - migration may not be applied yet",
+        );
+        return null;
       }
-      console.error('[Avatar Sync] Failed to fetch profile picture metadata:', error)
-      return null
+      console.error(
+        "[Avatar Sync] Failed to fetch profile picture metadata:",
+        error,
+      );
+      return null;
     }
 
-    return data
+    return data;
   } catch (error) {
-    console.error('[Avatar Sync] Unexpected error fetching metadata:', error)
-    return null
+    console.error("[Avatar Sync] Unexpected error fetching metadata:", error);
+    return null;
   }
 }
 
@@ -199,32 +221,39 @@ export async function getProfilePictureMetadata(
  */
 export async function updateProfilePictureMetadata(
   userId: string,
-  data: Partial<Omit<ProfilePictureMetadata, 'user_id' | 'created_at' | 'updated_at'>>
+  data: Partial<
+    Omit<ProfilePictureMetadata, "user_id" | "created_at" | "updated_at">
+  >,
 ): Promise<void> {
   try {
-    const { error } = await supabase.from('profile_picture_metadata').upsert(
+    const { error } = await supabase.from("profile_picture_metadata").upsert(
       {
         user_id: userId,
         ...data,
       },
       {
-        onConflict: 'user_id',
-      }
-    )
+        onConflict: "user_id",
+      },
+    );
 
     if (error) {
       // If table doesn't exist, log but don't crash
-      if (error.code === 'PGRST116' || error.message?.includes('does not exist')) {
-        console.warn('[Avatar Sync] Cannot update metadata - table does not exist. Run migration first.')
-        return // Don't throw, allow feature to work without metadata tracking
+      if (
+        error.code === "PGRST116" ||
+        error.message?.includes("does not exist")
+      ) {
+        console.warn(
+          "[Avatar Sync] Cannot update metadata - table does not exist. Run migration first.",
+        );
+        return; // Don't throw, allow feature to work without metadata tracking
       }
-      throw error
+      throw error;
     }
 
-    console.debug('[Avatar Sync] Metadata updated successfully')
+    console.debug("[Avatar Sync] Metadata updated successfully");
   } catch (error) {
-    console.error('[Avatar Sync] Failed to update metadata:', error)
-    throw error
+    console.error("[Avatar Sync] Failed to update metadata:", error);
+    throw error;
   }
 }
 
@@ -240,99 +269,116 @@ export async function updateProfilePictureMetadata(
  * @returns true if sync was performed, false if skipped
  */
 export async function syncOAuthAvatar(user: User): Promise<boolean> {
-  const cacheKey = user.id
+  const cacheKey = user.id;
 
   try {
     // 0. Check client-side session cache first (prevent repeated attempts)
-    const cached = sessionSyncCache.get(cacheKey)
+    const cached = sessionSyncCache.get(cacheKey);
     if (cached) {
-      const minutesSinceLastAttempt = (Date.now() - cached.timestamp) / (1000 * 60)
+      const minutesSinceLastAttempt =
+        (Date.now() - cached.timestamp) / (1000 * 60);
       if (minutesSinceLastAttempt < 60) {
-        console.debug('[Avatar Sync] Skipping sync - already attempted in this session:', {
-          minutesAgo: minutesSinceLastAttempt.toFixed(1),
-          lastSuccess: cached.success
-        })
-        return cached.success
+        console.debug(
+          "[Avatar Sync] Skipping sync - already attempted in this session:",
+          {
+            minutesAgo: minutesSinceLastAttempt.toFixed(1),
+            lastSuccess: cached.success,
+          },
+        );
+        return cached.success;
       }
     }
 
     // 1. Check if user is OAuth authenticated
-    const provider = user.app_metadata?.provider
-    console.debug('[Avatar Sync] Checking user for sync:', {
+    const provider = user.app_metadata?.provider;
+    console.debug("[Avatar Sync] Checking user for sync:", {
       provider,
       userId: user.id,
       email: user.email,
       hasUserMetadata: !!user.user_metadata,
-      userMetadataKeys: user.user_metadata ? Object.keys(user.user_metadata) : []
-    })
+      userMetadataKeys: user.user_metadata
+        ? Object.keys(user.user_metadata)
+        : [],
+    });
 
-    if (!provider || !['google', 'github', 'azure'].includes(provider)) {
-      console.debug('[Avatar Sync] Skipping sync - not an OAuth provider with avatar support')
-      sessionSyncCache.set(cacheKey, { timestamp: Date.now(), success: false })
-      return false
+    if (!provider || !["google", "github", "azure"].includes(provider)) {
+      console.debug(
+        "[Avatar Sync] Skipping sync - not an OAuth provider with avatar support",
+      );
+      sessionSyncCache.set(cacheKey, { timestamp: Date.now(), success: false });
+      return false;
     }
 
     // 2. Get metadata to check if sync is needed
-    const metadata = await getProfilePictureMetadata(user.id)
+    const metadata = await getProfilePictureMetadata(user.id);
 
     // Skip if user has manually uploaded a picture
-    if (metadata?.source === 'upload') {
-      console.debug('[Avatar Sync] Skipping sync - user has manual upload')
-      sessionSyncCache.set(cacheKey, { timestamp: Date.now(), success: false })
-      return false
+    if (metadata?.source === "upload") {
+      console.debug("[Avatar Sync] Skipping sync - user has manual upload");
+      sessionSyncCache.set(cacheKey, { timestamp: Date.now(), success: false });
+      return false;
     }
 
     // Skip if synced recently (within SYNC_INTERVAL_DAYS)
     if (metadata?.last_synced_at) {
-      const lastSync = new Date(metadata.last_synced_at)
-      const daysSinceSync = (Date.now() - lastSync.getTime()) / (1000 * 60 * 60 * 24)
+      const lastSync = new Date(metadata.last_synced_at);
+      const daysSinceSync =
+        (Date.now() - lastSync.getTime()) / (1000 * 60 * 60 * 24);
       if (daysSinceSync < SYNC_INTERVAL_DAYS) {
-        console.debug('[Avatar Sync] Skipping sync - synced recently:', {
+        console.debug("[Avatar Sync] Skipping sync - synced recently:", {
           daysSinceSync: daysSinceSync.toFixed(1),
           threshold: SYNC_INTERVAL_DAYS,
-        })
-        sessionSyncCache.set(cacheKey, { timestamp: Date.now(), success: true })
-        return false
+        });
+        sessionSyncCache.set(cacheKey, {
+          timestamp: Date.now(),
+          success: true,
+        });
+        return false;
       }
     }
 
     // 3. Extract provider avatar URL
-    const avatarUrl = getProviderAvatarUrl(user)
-    console.debug('[Avatar Sync] Avatar URL extraction:', {
+    const avatarUrl = getProviderAvatarUrl(user);
+    console.debug("[Avatar Sync] Avatar URL extraction:", {
       provider,
       avatarUrl,
-      hasAvatarUrl: !!avatarUrl
-    })
+      hasAvatarUrl: !!avatarUrl,
+    });
 
     if (!avatarUrl) {
-      console.debug('[Avatar Sync] No avatar URL available from provider')
-      sessionSyncCache.set(cacheKey, { timestamp: Date.now(), success: false })
-      return false
+      console.debug("[Avatar Sync] No avatar URL available from provider");
+      sessionSyncCache.set(cacheKey, { timestamp: Date.now(), success: false });
+      return false;
     }
 
-    console.debug('[Avatar Sync] Starting sync for provider:', provider, 'with URL:', avatarUrl)
+    console.debug(
+      "[Avatar Sync] Starting sync for provider:",
+      provider,
+      "with URL:",
+      avatarUrl,
+    );
 
     // 4. Download and optimize avatar
-    const optimizedBlob = await downloadAndOptimizeAvatar(avatarUrl)
+    const optimizedBlob = await downloadAndOptimizeAvatar(avatarUrl);
 
     // 5. Upload to Supabase Storage
-    await uploadAvatarToStorage(user.id, optimizedBlob)
+    await uploadAvatarToStorage(user.id, optimizedBlob);
 
     // 6. Update metadata
     await updateProfilePictureMetadata(user.id, {
-      source: 'oauth',
-      provider: provider as ProfilePictureMetadata['provider'],
+      source: "oauth",
+      provider: provider as ProfilePictureMetadata["provider"],
       last_synced_at: new Date().toISOString(),
-    })
+    });
 
-    console.debug('[Avatar Sync] Sync completed successfully')
-    sessionSyncCache.set(cacheKey, { timestamp: Date.now(), success: true })
-    return true
+    console.debug("[Avatar Sync] Sync completed successfully");
+    sessionSyncCache.set(cacheKey, { timestamp: Date.now(), success: true });
+    return true;
   } catch (error) {
-    console.error('[Avatar Sync] Failed to sync OAuth avatar:', error)
+    console.error("[Avatar Sync] Failed to sync OAuth avatar:", error);
     // Cache the failure to prevent repeated attempts
-    sessionSyncCache.set(cacheKey, { timestamp: Date.now(), success: false })
+    sessionSyncCache.set(cacheKey, { timestamp: Date.now(), success: false });
     // Don't throw - gracefully degrade to existing picture or initials
-    return false
+    return false;
   }
 }
diff --git a/frontend/src/saas/services/signatureStorageService.ts b/frontend/src/saas/services/signatureStorageService.ts
index 2019994585..84d39f01dc 100644
--- a/frontend/src/saas/services/signatureStorageService.ts
+++ b/frontend/src/saas/services/signatureStorageService.ts
@@ -1,6 +1,6 @@
-import type { SavedSignature } from '@app/hooks/tools/sign/useSavedSignatures';
+import type { SavedSignature } from "@app/hooks/tools/sign/useSavedSignatures";
 
-export type StorageType = 'backend' | 'localStorage';
+export type StorageType = "backend" | "localStorage";
 
 interface SignatureStorageCapabilities {
   supportsBackend: boolean;
@@ -17,7 +17,7 @@ interface SignatureStorageCapabilities {
 class SignatureStorageService {
   private capabilities: SignatureStorageCapabilities | null = null;
   private blobUrls: Set<string> = new Set();
-  private readonly STORAGE_KEY = 'stirling:saved-signatures:v1';
+  private readonly STORAGE_KEY = "stirling:saved-signatures:v1";
 
   /**
    * Detect capabilities - in SaaS mode, always returns localStorage
@@ -28,10 +28,12 @@ class SignatureStorageService {
     }
 
     // SaaS mode always uses localStorage (no backend signature API available)
-    console.log('[SignatureStorage] SaaS mode - using localStorage (backend not available)');
+    console.log(
+      "[SignatureStorage] SaaS mode - using localStorage (backend not available)",
+    );
     this.capabilities = {
       supportsBackend: false,
-      storageType: 'localStorage',
+      storageType: "localStorage",
     };
 
     return this.capabilities;
@@ -61,7 +63,7 @@ class SignatureStorageService {
    */
   async saveSignature(signature: SavedSignature): Promise<void> {
     // Force scope to localStorage for SaaS mode
-    signature.scope = 'localStorage';
+    signature.scope = "localStorage";
     this._saveToLocalStorage(signature);
   }
 
@@ -88,7 +90,7 @@ class SignatureStorageService {
       // Ensure all localStorage signatures have the correct scope
       return signatures.map((sig: SavedSignature) => ({
         ...sig,
-        scope: 'localStorage' as const,
+        scope: "localStorage" as const,
       }));
     } catch {
       return [];
@@ -97,7 +99,7 @@ class SignatureStorageService {
 
   private _saveToLocalStorage(signature: SavedSignature): void {
     const signatures = this._loadFromLocalStorage();
-    const index = signatures.findIndex(s => s.id === signature.id);
+    const index = signatures.findIndex((s) => s.id === signature.id);
 
     if (index >= 0) {
       signatures[index] = signature;
@@ -110,13 +112,13 @@ class SignatureStorageService {
 
   private _deleteFromLocalStorage(id: string): void {
     const signatures = this._loadFromLocalStorage();
-    const filtered = signatures.filter(s => s.id !== id);
+    const filtered = signatures.filter((s) => s.id !== id);
     localStorage.setItem(this.STORAGE_KEY, JSON.stringify(filtered));
   }
 
   private _updateLabelInLocalStorage(id: string, label: string): void {
     const signatures = this._loadFromLocalStorage();
-    const signature = signatures.find(s => s.id === id);
+    const signature = signatures.find((s) => s.id === id);
     if (signature) {
       signature.label = label;
       signature.updatedAt = Date.now();
@@ -129,7 +131,7 @@ class SignatureStorageService {
    * In SaaS mode, this is a no-op since we don't support backend storage
    */
   async migrateToBackend(): Promise<{ migrated: number; failed: number }> {
-    console.log('[SignatureStorage] Migration not supported in SaaS mode');
+    console.log("[SignatureStorage] Migration not supported in SaaS mode");
     return { migrated: 0, failed: 0 };
   }
 
@@ -137,7 +139,7 @@ class SignatureStorageService {
    * Clean up blob URLs to prevent memory leaks
    */
   cleanup(): void {
-    this.blobUrls.forEach(url => {
+    this.blobUrls.forEach((url) => {
       URL.revokeObjectURL(url);
     });
     this.blobUrls.clear();
diff --git a/frontend/src/saas/services/userManagementService.ts b/frontend/src/saas/services/userManagementService.ts
index 3c94ecb31d..6efac042f6 100644
--- a/frontend/src/saas/services/userManagementService.ts
+++ b/frontend/src/saas/services/userManagementService.ts
@@ -1,5 +1,5 @@
-import apiClient from '@app/services/apiClient';
-import { supabase, isSupabaseConfigured } from '@app/services/supabaseClient';
+import apiClient from "@app/services/apiClient";
+import { supabase, isSupabaseConfigured } from "@app/services/supabaseClient";
 
 export interface User {
   id: number;
@@ -45,7 +45,7 @@ export interface CreateUserRequest {
   password?: string;
   role: string;
   teamId?: number;
-  authType: 'password' | 'SSO';
+  authType: "password" | "SSO";
   forceChange?: boolean;
 }
 
@@ -107,7 +107,9 @@ export const userManagementService = {
    * Get all users with session data (admin only)
    */
   async getUsers(): Promise<AdminSettingsData> {
-    const response = await apiClient.get<AdminSettingsData>('/api/v1/proprietary/ui-data/admin-settings');
+    const response = await apiClient.get<AdminSettingsData>(
+      "/api/v1/proprietary/ui-data/admin-settings",
+    );
     return response.data;
   },
 
@@ -115,7 +117,7 @@ export const userManagementService = {
    * Get users without a team
    */
   async getUsersWithoutTeam(): Promise<User[]> {
-    const response = await apiClient.get<User[]>('/api/v1/users/without-team');
+    const response = await apiClient.get<User[]>("/api/v1/users/without-team");
     return response.data;
   },
 
@@ -124,19 +126,19 @@ export const userManagementService = {
    */
   async createUser(data: CreateUserRequest): Promise<void> {
     const formData = new FormData();
-    formData.append('username', data.username);
+    formData.append("username", data.username);
     if (data.password) {
-      formData.append('password', data.password);
+      formData.append("password", data.password);
     }
-    formData.append('role', data.role);
+    formData.append("role", data.role);
     if (data.teamId) {
-      formData.append('teamId', data.teamId.toString());
+      formData.append("teamId", data.teamId.toString());
     }
-    formData.append('authType', data.authType);
+    formData.append("authType", data.authType);
     if (data.forceChange !== undefined) {
-      formData.append('forceChange', data.forceChange.toString());
+      formData.append("forceChange", data.forceChange.toString());
     }
-    await apiClient.post('/api/v1/user/admin/saveUser', formData, {
+    await apiClient.post("/api/v1/user/admin/saveUser", formData, {
       suppressErrorToast: true, // Component will handle error display
     });
   },
@@ -146,12 +148,12 @@ export const userManagementService = {
    */
   async updateUserRole(data: UpdateUserRoleRequest): Promise<void> {
     const formData = new FormData();
-    formData.append('username', data.username);
-    formData.append('role', data.role);
+    formData.append("username", data.username);
+    formData.append("role", data.role);
     if (data.teamId) {
-      formData.append('teamId', data.teamId.toString());
+      formData.append("teamId", data.teamId.toString());
     }
-    await apiClient.post('/api/v1/user/admin/changeRole', formData, {
+    await apiClient.post("/api/v1/user/admin/changeRole", formData, {
       suppressErrorToast: true,
     });
   },
@@ -161,22 +163,31 @@ export const userManagementService = {
    */
   async toggleUserEnabled(username: string, enabled: boolean): Promise<void> {
     const formData = new FormData();
-    formData.append('enabled', enabled.toString());
-    await apiClient.post(`/api/v1/user/admin/changeUserEnabled/${username}`, formData, {
-      suppressErrorToast: true,
-    });
+    formData.append("enabled", enabled.toString());
+    await apiClient.post(
+      `/api/v1/user/admin/changeUserEnabled/${username}`,
+      formData,
+      {
+        suppressErrorToast: true,
+      },
+    );
   },
 
   /**
    * Delete a user (admin only)
    */
-  async deleteUser(user: User, options?: { notifyUser?: boolean }): Promise<void> {
+  async deleteUser(
+    user: User,
+    options?: { notifyUser?: boolean },
+  ): Promise<void> {
     if (isSupabaseConfigured && supabase) {
       if (!user.email) {
-        throw new Error('Email missing for this user. Please contact support for manual removal.');
+        throw new Error(
+          "Email missing for this user. Please contact support for manual removal.",
+        );
       }
 
-      const { error } = await supabase.functions.invoke('delete-user', {
+      const { error } = await supabase.functions.invoke("delete-user", {
         body: {
           target_email: user.email,
           notify_user: options?.notifyUser ?? true,
@@ -184,7 +195,7 @@ export const userManagementService = {
       });
 
       if (error) {
-        throw new Error(error.message || 'Supabase deletion failed');
+        throw new Error(error.message || "Supabase deletion failed");
       }
       return;
     }
@@ -197,18 +208,18 @@ export const userManagementService = {
    */
   async inviteUsers(data: InviteUsersRequest): Promise<InviteUsersResponse> {
     const formData = new FormData();
-    formData.append('emails', data.emails);
-    formData.append('role', data.role);
+    formData.append("emails", data.emails);
+    formData.append("role", data.role);
     if (data.teamId) {
-      formData.append('teamId', data.teamId.toString());
+      formData.append("teamId", data.teamId.toString());
     }
 
     const response = await apiClient.post<InviteUsersResponse>(
-      '/api/v1/user/admin/inviteUsers',
+      "/api/v1/user/admin/inviteUsers",
       formData,
       {
         suppressErrorToast: true, // Component will handle error display
-      }
+      },
     );
 
     return response.data;
@@ -217,29 +228,31 @@ export const userManagementService = {
   /**
    * Generate an invite link (admin only)
    */
-  async generateInviteLink(data: InviteLinkRequest): Promise<InviteLinkResponse> {
+  async generateInviteLink(
+    data: InviteLinkRequest,
+  ): Promise<InviteLinkResponse> {
     const formData = new FormData();
     // Only append email if it's provided and not empty
     if (data.email && data.email.trim()) {
-      formData.append('email', data.email);
+      formData.append("email", data.email);
     }
-    formData.append('role', data.role);
+    formData.append("role", data.role);
     if (data.teamId) {
-      formData.append('teamId', data.teamId.toString());
+      formData.append("teamId", data.teamId.toString());
     }
     if (data.expiryHours) {
-      formData.append('expiryHours', data.expiryHours.toString());
+      formData.append("expiryHours", data.expiryHours.toString());
     }
     if (data.sendEmail !== undefined) {
-      formData.append('sendEmail', data.sendEmail.toString());
+      formData.append("sendEmail", data.sendEmail.toString());
     }
 
     const response = await apiClient.post<InviteLinkResponse>(
-      '/api/v1/invite/generate',
+      "/api/v1/invite/generate",
       formData,
       {
         suppressErrorToast: true,
-      }
+      },
     );
 
     return response.data;
@@ -249,7 +262,9 @@ export const userManagementService = {
    * Get list of active invite links (admin only)
    */
   async getInviteLinks(): Promise<InviteToken[]> {
-    const response = await apiClient.get<{ invites: InviteToken[] }>('/api/v1/invite/list');
+    const response = await apiClient.get<{ invites: InviteToken[] }>(
+      "/api/v1/invite/list",
+    );
     return response.data.invites;
   },
 
@@ -266,7 +281,9 @@ export const userManagementService = {
    * Clean up expired invite links (admin only)
    */
   async cleanupExpiredInvites(): Promise<{ deletedCount: number }> {
-    const response = await apiClient.post<{ deletedCount: number }>('/api/v1/invite/cleanup');
+    const response = await apiClient.post<{ deletedCount: number }>(
+      "/api/v1/invite/cleanup",
+    );
     return response.data;
   },
 };
diff --git a/frontend/src/saas/services/userService.ts b/frontend/src/saas/services/userService.ts
index 6d75312a43..fdd57b45d4 100644
--- a/frontend/src/saas/services/userService.ts
+++ b/frontend/src/saas/services/userService.ts
@@ -2,7 +2,7 @@
  * User service for handling user-related API calls
  */
 
-const API_BASE = '/api/v1';
+const API_BASE = "/api/v1";
 
 /**
  * Synchronizes user upgrade from anonymous to authenticated status with the backend.
@@ -14,7 +14,7 @@ const API_BASE = '/api/v1';
  * @returns Promise with the synchronization result
  */
 export const synchronizeUserUpgrade = async (
-  authMethod?: string
+  authMethod?: string,
 ): Promise<{
   message: string;
   userId: string;
@@ -22,22 +22,24 @@ export const synchronizeUserUpgrade = async (
 }> => {
   const formData = new URLSearchParams();
   if (authMethod) {
-    formData.append('authMethod', authMethod);
+    formData.append("authMethod", authMethod);
   }
 
   const response = await fetch(`${API_BASE}/user-role/promptToAuthUser`, {
-    method: 'POST',
+    method: "POST",
     headers: {
-      'Content-Type': 'application/x-www-form-urlencoded',
+      "Content-Type": "application/x-www-form-urlencoded",
     },
-    credentials: 'include', // Include cookies for authentication
+    credentials: "include", // Include cookies for authentication
     body: formData.toString(),
   });
 
   if (!response.ok) {
-    const errorData = await response.json().catch(() => ({ error: 'Failed to synchronize user upgrade' }));
-    throw new Error(errorData.error || 'Failed to synchronize user upgrade');
+    const errorData = await response
+      .json()
+      .catch(() => ({ error: "Failed to synchronize user upgrade" }));
+    throw new Error(errorData.error || "Failed to synchronize user upgrade");
   }
 
   return response.json();
-};
\ No newline at end of file
+};
diff --git a/frontend/src/saas/setupTests.ts b/frontend/src/saas/setupTests.ts
index f2ecbb7ca6..c461557ffa 100644
--- a/frontend/src/saas/setupTests.ts
+++ b/frontend/src/saas/setupTests.ts
@@ -1,34 +1,48 @@
-import '@testing-library/jest-dom';
-import { vi } from 'vitest';
+import "@testing-library/jest-dom";
+import { vi } from "vitest";
 
 // Mock localStorage for tests
 const localStorageMock = (() => {
   let store: Record<string, string> = {};
   return {
     getItem: vi.fn((key: string) => store[key] || null),
-    setItem: vi.fn((key: string, value: string) => { store[key] = value; }),
-    removeItem: vi.fn((key: string) => { delete store[key]; }),
-    clear: vi.fn(() => { store = {}; }),
-    get length() { return Object.keys(store).length; },
+    setItem: vi.fn((key: string, value: string) => {
+      store[key] = value;
+    }),
+    removeItem: vi.fn((key: string) => {
+      delete store[key];
+    }),
+    clear: vi.fn(() => {
+      store = {};
+    }),
+    get length() {
+      return Object.keys(store).length;
+    },
     key: vi.fn((index: number) => Object.keys(store)[index] || null),
   };
 })();
-Object.defineProperty(global, 'localStorage', { value: localStorageMock });
+Object.defineProperty(global, "localStorage", { value: localStorageMock });
 
 // Mock Supabase for tests
-vi.mock('@app/auth/supabase', () => ({
+vi.mock("@app/auth/supabase", () => ({
   supabase: {
     auth: {
-      getSession: vi.fn().mockResolvedValue({ data: { session: null }, error: null }),
-      refreshSession: vi.fn().mockResolvedValue({ data: { session: null }, error: null }),
-      onAuthStateChange: vi.fn().mockReturnValue({ data: { subscription: { unsubscribe: vi.fn() } } })
-    }
+      getSession: vi
+        .fn()
+        .mockResolvedValue({ data: { session: null }, error: null }),
+      refreshSession: vi
+        .fn()
+        .mockResolvedValue({ data: { session: null }, error: null }),
+      onAuthStateChange: vi
+        .fn()
+        .mockReturnValue({ data: { subscription: { unsubscribe: vi.fn() } } }),
+    },
   },
-  debugAuthEvents: vi.fn()
-}))
+  debugAuthEvents: vi.fn(),
+}));
 
 // Mock i18next for tests
-vi.mock('react-i18next', () => ({
+vi.mock("react-i18next", () => ({
   useTranslation: () => ({
     t: (key: string) => key,
     i18n: {
@@ -36,16 +50,16 @@ vi.mock('react-i18next', () => ({
     },
   }),
   initReactI18next: {
-    type: '3rdParty',
+    type: "3rdParty",
     init: vi.fn(),
   },
   I18nextProvider: ({ children }: { children: React.ReactNode }) => children,
 }));
 
 // Mock i18next-http-backend
-vi.mock('i18next-http-backend', () => ({
+vi.mock("i18next-http-backend", () => ({
   default: {
-    type: 'backend',
+    type: "backend",
     init: vi.fn(),
     read: vi.fn(),
     save: vi.fn(),
@@ -53,12 +67,12 @@ vi.mock('i18next-http-backend', () => ({
 }));
 
 // Mock window.URL.createObjectURL and revokeObjectURL for tests
-global.URL.createObjectURL = vi.fn(() => 'mocked-url');
+global.URL.createObjectURL = vi.fn(() => "mocked-url");
 global.URL.revokeObjectURL = vi.fn();
 
 // Mock File and Blob API methods that aren't available in jsdom
 if (!globalThis.File.prototype.arrayBuffer) {
-  globalThis.File.prototype.arrayBuffer = function() {
+  globalThis.File.prototype.arrayBuffer = function () {
     // Return a simple ArrayBuffer with some mock data
     const buffer = new ArrayBuffer(8);
     const view = new Uint8Array(buffer);
@@ -68,7 +82,7 @@ if (!globalThis.File.prototype.arrayBuffer) {
 }
 
 if (!globalThis.Blob.prototype.arrayBuffer) {
-  globalThis.Blob.prototype.arrayBuffer = function() {
+  globalThis.Blob.prototype.arrayBuffer = function () {
     // Return a simple ArrayBuffer with some mock data
     const buffer = new ArrayBuffer(8);
     const view = new Uint8Array(buffer);
@@ -86,22 +100,30 @@ for (let i = 0; i < 32; i++) {
 }
 
 // Force override crypto.subtle to avoid Node.js native implementation
-Object.defineProperty(globalThis, 'crypto', {
+Object.defineProperty(globalThis, "crypto", {
   value: {
     subtle: {
-      digest: vi.fn().mockImplementation(async (_algorithm: string, _data: BufferSource) => {
-        // Always return the mock hash buffer regardless of input
-        return mockHashBuffer.slice();
-      }),
+      digest: vi
+        .fn()
+        .mockImplementation(async (_algorithm: string, _data: BufferSource) => {
+          // Always return the mock hash buffer regardless of input
+          return mockHashBuffer.slice();
+        }),
     },
-    getRandomValues: vi.fn().mockImplementation(<T extends ArrayBufferView>(array: T): T => {
-      // Mock getRandomValues if needed
-      const view = new Uint8Array(array.buffer, array.byteOffset, array.byteLength);
-      for (let i = 0; i < view.length; i++) {
-        view[i] = Math.floor(Math.random() * 256);
-      }
-      return array;
-    }),
+    getRandomValues: vi
+      .fn()
+      .mockImplementation(<T extends ArrayBufferView>(array: T): T => {
+        // Mock getRandomValues if needed
+        const view = new Uint8Array(
+          array.buffer,
+          array.byteOffset,
+          array.byteLength,
+        );
+        for (let i = 0; i < view.length; i++) {
+          view[i] = Math.floor(Math.random() * 256);
+        }
+        return array;
+      }),
   } as unknown as Crypto,
   writable: true,
   configurable: true,
@@ -132,9 +154,9 @@ global.IntersectionObserver = vi.fn().mockImplementation(() => ({
 }));
 
 // Mock matchMedia for responsive components
-Object.defineProperty(window, 'matchMedia', {
+Object.defineProperty(window, "matchMedia", {
   writable: true,
-  value: vi.fn().mockImplementation(query => ({
+  value: vi.fn().mockImplementation((query) => ({
     matches: false,
     media: query,
     onchange: null,
@@ -147,30 +169,65 @@ Object.defineProperty(window, 'matchMedia', {
 });
 
 // Mock DOMMatrix for PDF.js tests
-Object.defineProperty(global, 'DOMMatrix', {
+Object.defineProperty(global, "DOMMatrix", {
   value: class MockDOMMatrix {
-    a = 1; b = 0; c = 0; d = 1; e = 0; f = 0;
-    m11 = 1; m12 = 0; m13 = 0; m14 = 0;
-    m21 = 0; m22 = 1; m23 = 0; m24 = 0;
-    m31 = 0; m32 = 0; m33 = 1; m34 = 0;
-    m41 = 0; m42 = 0; m43 = 0; m44 = 1;
+    a = 1;
+    b = 0;
+    c = 0;
+    d = 1;
+    e = 0;
+    f = 0;
+    m11 = 1;
+    m12 = 0;
+    m13 = 0;
+    m14 = 0;
+    m21 = 0;
+    m22 = 1;
+    m23 = 0;
+    m24 = 0;
+    m31 = 0;
+    m32 = 0;
+    m33 = 1;
+    m34 = 0;
+    m41 = 0;
+    m42 = 0;
+    m43 = 0;
+    m44 = 1;
     is2D = true;
     isIdentity = true;
 
-    toString() { return 'matrix(1, 0, 0, 1, 0, 0)'; }
-    scale() { return this; }
-    translate() { return this; }
-    rotate() { return this; }
-    inverse() { return this; }
-    multiply() { return this; }
+    toString() {
+      return "matrix(1, 0, 0, 1, 0, 0)";
+    }
+    scale() {
+      return this;
+    }
+    translate() {
+      return this;
+    }
+    rotate() {
+      return this;
+    }
+    inverse() {
+      return this;
+    }
+    multiply() {
+      return this;
+    }
 
-    static fromFloat32Array() { return new MockDOMMatrix(); }
-    static fromFloat64Array() { return new MockDOMMatrix(); }
-    static fromMatrix() { return new MockDOMMatrix(); }
+    static fromFloat32Array() {
+      return new MockDOMMatrix();
+    }
+    static fromFloat64Array() {
+      return new MockDOMMatrix();
+    }
+    static fromMatrix() {
+      return new MockDOMMatrix();
+    }
   },
   writable: true,
   configurable: true,
-})
+});
 
 // Set global test timeout to prevent hangs
 vi.setConfig({ testTimeout: 5000, hookTimeout: 5000 });
diff --git a/frontend/src/saas/styles/saas-theme.css b/frontend/src/saas/styles/saas-theme.css
index 0f29bc77f7..9d670c98d9 100644
--- a/frontend/src/saas/styles/saas-theme.css
+++ b/frontend/src/saas/styles/saas-theme.css
@@ -2,11 +2,11 @@
 
 :root {
   /* Orange scale (used for warning toasts) */
-  --color-orange-50: #FFF4ED;
-  --color-orange-100: #FFE1CC;
-  --color-orange-200: #FFB089;
-  --color-orange-300: #FF7A45;
-  --color-orange-400: #D84A1B;
+  --color-orange-50: #fff4ed;
+  --color-orange-100: #ffe1cc;
+  --color-orange-200: #ffb089;
+  --color-orange-300: #ff7a45;
+  --color-orange-400: #d84a1b;
 
   /* Amber scale (trial/warning emphasis) */
   --color-amber-50: #fffbeb;
@@ -21,8 +21,8 @@
   --color-amber-900: #78350f;
 
   /* Subcategory / divider vars (light) */
-  --tool-subcategory-text-color-light: #9CA3AF;
-  --tool-subcategory-rule-color-light: #E5E7EB;
+  --tool-subcategory-text-color-light: #9ca3af;
+  --tool-subcategory-rule-color-light: #e5e7eb;
   --text-divider-rule-color: var(--color-gray-200);
   --text-divider-label-color: var(--color-gray-400);
   --text-divider-rule-color-light: var(--color-gray-200);
@@ -32,8 +32,8 @@
   --auth-input-bg: #f9fafb;
   --auth-input-border: #e5e7eb;
   --auth-input-text: #1f2937;
-  --auth-label-text: #2B3230;
-  --auth-button-bg: #AF3434;
+  --auth-label-text: #2b3230;
+  --auth-button-bg: #af3434;
   --auth-button-text: #ffffff;
   --auth-magic-button-bg: #8b5cf6;
   --auth-magic-button-text: #ffffff;
@@ -42,33 +42,33 @@
   --auth-input-bg-light-only: #f9fafb;
   --auth-input-border-light-only: #e5e7eb;
   --auth-input-text-light-only: #1f2937;
-  --auth-label-text-light-only: #2B3230;
-  --auth-button-bg-light-only: #AF3434;
+  --auth-label-text-light-only: #2b3230;
+  --auth-button-bg-light-only: #af3434;
   --auth-button-text-light-only: #ffffff;
   --auth-magic-button-bg-light-only: #8b5cf6;
   --auth-magic-button-text-light-only: #ffffff;
   --auth-bg-color-light-only: #ffffff;
   --auth-card-bg-light-only: #ffffff;
-  --auth-text-primary-light-only: #2B3230;
+  --auth-text-primary-light-only: #2b3230;
   --auth-text-secondary-light-only: #1f2937;
   --auth-border-color-light-only: #e5e7eb;
   --auth-border-focus-light-only: #cbd5e1;
   --auth-focus-ring-light-only: rgba(59, 130, 246, 0.15);
 
   /* App Config Modal colors (light mode) */
-  --modal-nav-bg: #F5F6F8;
-  --modal-nav-section-title: #6B7280;
+  --modal-nav-bg: #f5f6f8;
+  --modal-nav-section-title: #6b7280;
   --modal-nav-item: #374151;
-  --modal-nav-item-active: #0A8BFF;
+  --modal-nav-item-active: #0a8bff;
   --modal-nav-item-active-bg: rgba(10, 139, 255, 0.08);
   --modal-content-bg: #ffffff;
   --modal-header-border: rgba(0, 0, 0, 0.06);
 
   /* API usage progress bar colors (light mode) */
-  --usage-weekly-active: #3B82F6;
-  --usage-bought-active: #14B8A6;
-  --usage-total-used: #3B82F6;
-  --usage-inactive: #E5E7EB;
+  --usage-weekly-active: #3b82f6;
+  --usage-bought-active: #14b8a6;
+  --usage-total-used: #3b82f6;
+  --usage-inactive: #e5e7eb;
 
   /* API Keys section colors (light mode) */
   --api-keys-card-bg: #ffffff;
@@ -90,15 +90,15 @@
   --spdf-compare-added-badge-fg: var(--color-green-500);
   --spdf-compare-inline-removed-bg: rgba(255, 59, 48, 0.25);
   --spdf-compare-inline-added-bg: rgba(52, 199, 89, 0.25);
-  --compare-page-label-bg: #2A2F36;
-  --compare-page-label-fg: #D0D6DC;
+  --compare-page-label-bg: #2a2f36;
+  --compare-page-label-fg: #d0d6dc;
 
   /* Orange scale (dark mode mirrors light values to match UI) */
-  --color-orange-50: #FFF4ED;
-  --color-orange-100: #FFE1CC;
-  --color-orange-200: #FFB089;
-  --color-orange-300: #FF7A45;
-  --color-orange-400: #D84A1B;
+  --color-orange-50: #fff4ed;
+  --color-orange-100: #ffe1cc;
+  --color-orange-200: #ffb089;
+  --color-orange-300: #ff7a45;
+  --color-orange-400: #d84a1b;
 
   /* Auth page colors (light mode only - auth pages force light mode) */
   --auth-bg-color-light-only: #f3f4f6;
@@ -110,7 +110,7 @@
   --auth-input-text-light-only: #111827;
   --auth-border-focus-light-only: #3b82f6;
   --auth-focus-ring-light-only: rgba(59, 130, 246, 0.1);
-  --auth-button-bg-light-only: #AF3434;
+  --auth-button-bg-light-only: #af3434;
   --auth-button-text-light-only: #ffffff;
   --auth-magic-button-bg-light-only: #e5e7eb;
   --auth-magic-button-text-light-only: #374151;
@@ -122,29 +122,29 @@
   --tool-subcategory-text-color-light: #9ca3af;
 
   /* API usage progress bar colors (dark mode) */
-  --usage-weekly-active: #60A5FA;
-  --usage-bought-active: #34D399;
-  --usage-total-used: #FFFFFF;
-  --usage-inactive: #43464B;
+  --usage-weekly-active: #60a5fa;
+  --usage-bought-active: #34d399;
+  --usage-total-used: #ffffff;
+  --usage-inactive: #43464b;
 
   /* API Keys section colors (dark mode) */
-  --api-keys-card-bg: #2A2F36;
-  --api-keys-card-border: #3A4047;
+  --api-keys-card-bg: #2a2f36;
+  --api-keys-card-border: #3a4047;
   --api-keys-card-shadow: none;
-  --api-keys-input-bg: #1F2329;
-  --api-keys-input-border: #3A4047;
-  --api-keys-button-bg: #3A4047;
-  --api-keys-button-color: #D0D6DC;
+  --api-keys-input-bg: #1f2329;
+  --api-keys-input-border: #3a4047;
+  --api-keys-button-bg: #3a4047;
+  --api-keys-button-color: #d0d6dc;
 
   --text-divider-rule-color: var(--tool-subcategory-rule-color);
   --text-divider-label-color: var(--text-muted);
 
   /* App Config Modal colors (dark mode) */
-  --modal-nav-bg: #1F2329;
-  --modal-nav-section-title: #9CA3AF;
-  --modal-nav-item: #D0D6DC;
-  --modal-nav-item-active: #0A8BFF;
+  --modal-nav-bg: #1f2329;
+  --modal-nav-section-title: #9ca3af;
+  --modal-nav-item: #d0d6dc;
+  --modal-nav-item-active: #0a8bff;
   --modal-nav-item-active-bg: rgba(10, 139, 255, 0.15);
-  --modal-content-bg: #2A2F36;
+  --modal-content-bg: #2a2f36;
   --modal-header-border: rgba(255, 255, 255, 0.08);
 }
diff --git a/frontend/src/saas/styles/zIndex.ts b/frontend/src/saas/styles/zIndex.ts
index 69f464d951..58ec70ca08 100644
--- a/frontend/src/saas/styles/zIndex.ts
+++ b/frontend/src/saas/styles/zIndex.ts
@@ -2,11 +2,8 @@
 // Keep values identical to their original inline usages.
 
 // Re-export all core z-index constants
-export * from '@core/styles/zIndex';
+export * from "@core/styles/zIndex";
 
 // SaaS-specific z-index constants
 export const Z_ANALYTICS_MODAL = 1301;
 export const Z_INDEX_OVER_SETTINGS_MODAL = 1400;
-
-
-
diff --git a/frontend/src/saas/tsconfig.json b/frontend/src/saas/tsconfig.json
index a18cc0e492..e64e8b0997 100644
--- a/frontend/src/saas/tsconfig.json
+++ b/frontend/src/saas/tsconfig.json
@@ -3,24 +3,10 @@
   "compilerOptions": {
     "baseUrl": "../../",
     "paths": {
-      "@app/*": [
-        "src/saas/*",
-        "src/proprietary/*",
-        "src/core/*"
-      ],
-      "@proprietary/*": [
-        "src/proprietary/*"
-      ],
-      "@core/*": [
-        "src/core/*"
-      ]
+      "@app/*": ["src/saas/*", "src/proprietary/*", "src/core/*"],
+      "@proprietary/*": ["src/proprietary/*"],
+      "@core/*": ["src/core/*"]
     }
   },
-  "include": [
-    "../global.d.ts",
-    "../*.js",
-    "../*.ts",
-    "../*.tsx",
-    "."
-  ]
+  "include": ["../global.d.ts", "../*.js", "../*.ts", "../*.tsx", "."]
 }
diff --git a/frontend/src/saas/types/charts.ts b/frontend/src/saas/types/charts.ts
index fae648f39c..d3831467b4 100644
--- a/frontend/src/saas/types/charts.ts
+++ b/frontend/src/saas/types/charts.ts
@@ -7,7 +7,7 @@ export interface FractionData {
   color: string;
 }
 
-export type TooltipPosition = 'top' | 'bottom' | 'left' | 'right';
+export type TooltipPosition = "top" | "bottom" | "left" | "right";
 
 export interface StackedBarChartProps {
   fractions: FractionData[];
@@ -26,5 +26,3 @@ export interface TooltipData {
   fractions: FractionData[];
   isDark: boolean;
 }
-
-
diff --git a/frontend/src/saas/types/credits.ts b/frontend/src/saas/types/credits.ts
index 7c6b77ccda..f3bc8732a7 100644
--- a/frontend/src/saas/types/credits.ts
+++ b/frontend/src/saas/types/credits.ts
@@ -19,8 +19,8 @@ export interface CreditSummary {
 
 export interface SubscriptionInfo {
   id?: string;
-  status: 'active' | 'inactive' | 'cancelled' | 'expired';
-  tier: 'free' | 'basic' | 'premium' | 'enterprise';
+  status: "active" | "inactive" | "cancelled" | "expired";
+  tier: "free" | "basic" | "premium" | "enterprise";
   startDate?: string; // ISO date string
   endDate?: string; // ISO date string
   creditsPerWeek?: number;
@@ -33,5 +33,3 @@ export interface CreditCheckResult {
   requiredCredits: number;
   shortfall?: number;
 }
-
-
diff --git a/frontend/src/saas/types/stripe.ts b/frontend/src/saas/types/stripe.ts
index 8c7a81f5e0..3cdae09e80 100644
--- a/frontend/src/saas/types/stripe.ts
+++ b/frontend/src/saas/types/stripe.ts
@@ -20,7 +20,7 @@ export interface StripeWebhookEvent {
   data: {
     object: {
       id: string;
-      payment_status: 'paid' | 'unpaid';
+      payment_status: "paid" | "unpaid";
       customer_details?: {
         email: string;
         name?: string;
@@ -58,10 +58,10 @@ export interface StripeApiError {
 
 // Webhook event types that the backend should handle
 export type StripeWebhookEventType =
-  | 'checkout.session.completed'
-  | 'checkout.session.expired'
-  | 'payment_intent.succeeded'
-  | 'payment_intent.payment_failed'
-  | 'customer.subscription.created'
-  | 'customer.subscription.updated'
-  | 'customer.subscription.deleted';
\ No newline at end of file
+  | "checkout.session.completed"
+  | "checkout.session.expired"
+  | "payment_intent.succeeded"
+  | "payment_intent.payment_failed"
+  | "customer.subscription.created"
+  | "customer.subscription.updated"
+  | "customer.subscription.deleted";
diff --git a/frontend/src/saas/utils/appSettings.ts b/frontend/src/saas/utils/appSettings.ts
index d06b7a72f4..83f41940a4 100644
--- a/frontend/src/saas/utils/appSettings.ts
+++ b/frontend/src/saas/utils/appSettings.ts
@@ -1,7 +1,7 @@
 // Utility helpers to open the settings/config modal programmatically
 // and optionally navigate to a specific section (e.g., 'plan').
 
-import type { NavKey } from '@app/components/shared/config/types';
+import type { NavKey } from "@app/components/shared/config/types";
 
 export function openAppSettings(targetKey?: NavKey, notice?: string) {
   try {
@@ -9,10 +9,12 @@ export function openAppSettings(targetKey?: NavKey, notice?: string) {
     if (targetKey) detail.key = targetKey;
     if (notice) detail.notice = notice;
     // Ask the UI to open the App Config modal
-    window.dispatchEvent(new CustomEvent('appConfig:open', { detail }));
+    window.dispatchEvent(new CustomEvent("appConfig:open", { detail }));
     // If a specific section is requested, navigate there once modal mounts
     if (targetKey) {
-      window.dispatchEvent(new CustomEvent('appConfig:navigate', { detail: { key: targetKey } }));
+      window.dispatchEvent(
+        new CustomEvent("appConfig:navigate", { detail: { key: targetKey } }),
+      );
     }
   } catch (_e) {
     // no-op on SSR or test environments
@@ -20,7 +22,5 @@ export function openAppSettings(targetKey?: NavKey, notice?: string) {
 }
 
 export function openPlanSettings(notice?: string) {
-  openAppSettings('plan', notice);
+  openAppSettings("plan", notice);
 }
-
-
diff --git a/frontend/src/saas/utils/cropImage.ts b/frontend/src/saas/utils/cropImage.ts
index 2b6957916b..5e1aa80277 100644
--- a/frontend/src/saas/utils/cropImage.ts
+++ b/frontend/src/saas/utils/cropImage.ts
@@ -19,7 +19,7 @@ export interface Area {
  */
 export async function getCroppedImage(
   imageSrc: string,
-  pixelCrop: Area
+  pixelCrop: Area,
 ): Promise<Blob> {
   return new Promise((resolve, reject) => {
     const image = new Image();
@@ -27,11 +27,11 @@ export async function getCroppedImage(
     image.onload = () => {
       try {
         // Create canvas with crop dimensions
-        const canvas = document.createElement('canvas');
-        const ctx = canvas.getContext('2d');
+        const canvas = document.createElement("canvas");
+        const ctx = canvas.getContext("2d");
 
         if (!ctx) {
-          reject(new Error('Failed to get canvas context'));
+          reject(new Error("Failed to get canvas context"));
           return;
         }
 
@@ -54,20 +54,20 @@ export async function getCroppedImage(
           0,
           0,
           pixelCrop.width,
-          pixelCrop.height
+          pixelCrop.height,
         );
 
         // Convert canvas to PNG blob
         canvas.toBlob(
           (blob) => {
             if (!blob) {
-              reject(new Error('Failed to create blob from canvas'));
+              reject(new Error("Failed to create blob from canvas"));
               return;
             }
             resolve(blob);
           },
-          'image/png',
-          1.0 // Maximum quality
+          "image/png",
+          1.0, // Maximum quality
         );
       } catch (error) {
         reject(error);
@@ -75,7 +75,7 @@ export async function getCroppedImage(
     };
 
     image.onerror = () => {
-      reject(new Error('Failed to load image'));
+      reject(new Error("Failed to load image"));
     };
 
     // Start loading the image
diff --git a/frontend/src/saas/utils/pathUtils.ts b/frontend/src/saas/utils/pathUtils.ts
index 59dca0bd84..d2fa188e26 100644
--- a/frontend/src/saas/utils/pathUtils.ts
+++ b/frontend/src/saas/utils/pathUtils.ts
@@ -1,47 +1,48 @@
-import { URL_TO_TOOL_MAP } from '@app/utils/urlMapping'
+import { URL_TO_TOOL_MAP } from "@app/utils/urlMapping";
 
-const SUBPATH = import.meta.env.VITE_RUN_SUBPATH.replace(/^\/|\/$/g, '') // "app" or ""
+const SUBPATH = import.meta.env.VITE_RUN_SUBPATH.replace(/^\/|\/$/g, ""); // "app" or ""
 
 /**
  * Normalize pathname by stripping subpath prefix and trailing slashes
  */
 export function normalizePath(pathname: string): string {
   // Ensure leading slash, strip subpath prefix if configured
-  let p = pathname.startsWith('/') ? pathname : `/${pathname}`
+  let p = pathname.startsWith("/") ? pathname : `/${pathname}`;
   if (SUBPATH && p.startsWith(`/${SUBPATH}/`)) {
-    p = p.slice(SUBPATH.length + 1) // remove "/app"
+    p = p.slice(SUBPATH.length + 1); // remove "/app"
   } else if (SUBPATH && p === `/${SUBPATH}`) {
-    p = '/'
+    p = "/";
   }
   // Strip trailing slash except root
-  if (p.length > 1 && p.endsWith('/')) p = p.slice(0, -1)
-  return p
+  if (p.length > 1 && p.endsWith("/")) p = p.slice(0, -1);
+  return p;
 }
 
 /**
  * Check if pathname is an auth route
  */
 export function isAuthRoute(pathname: string): boolean {
-  const p = normalizePath(pathname)
-  return p === '/login' || p === '/signup' || p === '/auth/callback'
+  const p = normalizePath(pathname);
+  return p === "/login" || p === "/signup" || p === "/auth/callback";
 }
 
 /**
  * Check if pathname is home route
  */
 export function isHomeRoute(pathname: string): boolean {
-  return normalizePath(pathname) === '/'
+  return normalizePath(pathname) === "/";
 }
 
 /**
  * Check if pathname is a tool route
  */
 export function isToolRoute(pathname: string): boolean {
-  const p = normalizePath(pathname)
+  const p = normalizePath(pathname);
   // direct match or try without trailing slash variants if your map uses them
-  if (URL_TO_TOOL_MAP[p] !== undefined) return true
+  if (URL_TO_TOOL_MAP[p] !== undefined) return true;
   // Fallback: try adding/removing trailing slash
-  if (URL_TO_TOOL_MAP[`${p}/`] !== undefined) return true
-  if (p.endsWith('/') && URL_TO_TOOL_MAP[p.slice(0, -1)] !== undefined) return true
-  return false
-}
\ No newline at end of file
+  if (URL_TO_TOOL_MAP[`${p}/`] !== undefined) return true;
+  if (p.endsWith("/") && URL_TO_TOOL_MAP[p.slice(0, -1)] !== undefined)
+    return true;
+  return false;
+}
diff --git a/frontend/tailwind.config.js b/frontend/tailwind.config.js
index 327bb64a0b..b38eea76ee 100644
--- a/frontend/tailwind.config.js
+++ b/frontend/tailwind.config.js
@@ -1,78 +1,75 @@
 /** @type {import('tailwindcss').Config} */
 module.exports = {
-  content: [
-    "./index.html",
-    "./src/**/*.{js,ts,jsx,tsx}",
-  ],
-  darkMode: ['class', '[data-mantine-color-scheme="dark"]'],
+  content: ["./index.html", "./src/**/*.{js,ts,jsx,tsx}"],
+  darkMode: ["class", '[data-mantine-color-scheme="dark"]'],
   theme: {
     extend: {
       // Use standard Tailwind color system with CSS variables for theme switching
       colors: {
         // Override gray to work with both themes
         gray: {
-          50: 'rgb(var(--gray-50) / <alpha-value>)',
-          100: 'rgb(var(--gray-100) / <alpha-value>)',
-          200: 'rgb(var(--gray-200) / <alpha-value>)',
-          300: 'rgb(var(--gray-300) / <alpha-value>)',
-          400: 'rgb(var(--gray-400) / <alpha-value>)',
-          500: 'rgb(var(--gray-500) / <alpha-value>)',
-          600: 'rgb(var(--gray-600) / <alpha-value>)',
-          700: 'rgb(var(--gray-700) / <alpha-value>)',
-          800: 'rgb(var(--gray-800) / <alpha-value>)',
-          900: 'rgb(var(--gray-900) / <alpha-value>)',
+          50: "rgb(var(--gray-50) / <alpha-value>)",
+          100: "rgb(var(--gray-100) / <alpha-value>)",
+          200: "rgb(var(--gray-200) / <alpha-value>)",
+          300: "rgb(var(--gray-300) / <alpha-value>)",
+          400: "rgb(var(--gray-400) / <alpha-value>)",
+          500: "rgb(var(--gray-500) / <alpha-value>)",
+          600: "rgb(var(--gray-600) / <alpha-value>)",
+          700: "rgb(var(--gray-700) / <alpha-value>)",
+          800: "rgb(var(--gray-800) / <alpha-value>)",
+          900: "rgb(var(--gray-900) / <alpha-value>)",
         },
         green: {
-          50: 'var(--color-green-50)',
-          100: 'var(--color-green-100)',
-          200: 'var(--color-green-200)',
-          300: 'var(--color-green-300)',
-          400: 'var(--color-green-400)',
-          500: 'var(--color-green-500)',
-          600: 'var(--color-green-600)',
-          700: 'var(--color-green-700)',
-          800: 'var(--color-green-800)',
-          900: 'var(--color-green-900)',
+          50: "var(--color-green-50)",
+          100: "var(--color-green-100)",
+          200: "var(--color-green-200)",
+          300: "var(--color-green-300)",
+          400: "var(--color-green-400)",
+          500: "var(--color-green-500)",
+          600: "var(--color-green-600)",
+          700: "var(--color-green-700)",
+          800: "var(--color-green-800)",
+          900: "var(--color-green-900)",
         },
         yellow: {
-          50: 'var(--color-yellow-50)',
-          100: 'var(--color-yellow-100)',
-          200: 'var(--color-yellow-200)',
-          300: 'var(--color-yellow-300)',
-          400: 'var(--color-yellow-400)',
-          500: 'var(--color-yellow-500)',
-          600: 'var(--color-yellow-600)',
-          700: 'var(--color-yellow-700)',
-          800: 'var(--color-yellow-800)',
-          900: 'var(--color-yellow-900)',
+          50: "var(--color-yellow-50)",
+          100: "var(--color-yellow-100)",
+          200: "var(--color-yellow-200)",
+          300: "var(--color-yellow-300)",
+          400: "var(--color-yellow-400)",
+          500: "var(--color-yellow-500)",
+          600: "var(--color-yellow-600)",
+          700: "var(--color-yellow-700)",
+          800: "var(--color-yellow-800)",
+          900: "var(--color-yellow-900)",
         },
         red: {
-          50: 'var(--color-red-50)',
-          100: 'var(--color-red-100)',
-          200: 'var(--color-red-200)',
-          300: 'var(--color-red-300)',
-          400: 'var(--color-red-400)',
-          500: 'var(--color-red-500)',
-          600: 'var(--color-red-600)',
-          700: 'var(--color-red-700)',
-          800: 'var(--color-red-800)',
-          900: 'var(--color-red-900)',
+          50: "var(--color-red-50)",
+          100: "var(--color-red-100)",
+          200: "var(--color-red-200)",
+          300: "var(--color-red-300)",
+          400: "var(--color-red-400)",
+          500: "var(--color-red-500)",
+          600: "var(--color-red-600)",
+          700: "var(--color-red-700)",
+          800: "var(--color-red-800)",
+          900: "var(--color-red-900)",
         },
         // Custom semantic colors for app-specific usage
-        surface: 'rgb(var(--surface) / <alpha-value>)',
-        background: 'rgb(var(--background) / <alpha-value>)',
-        border: 'rgb(var(--border) / <alpha-value>)',
+        surface: "rgb(var(--surface) / <alpha-value>)",
+        background: "rgb(var(--background) / <alpha-value>)",
+        border: "rgb(var(--border) / <alpha-value>)",
       },
 
       // Z-index scale
       zIndex: {
-        'dropdown': '1000',
-        'sticky': '1020',
-        'fixed': '1030',
-        'modal-backdrop': '1040',
-        'modal': '1050',
-        'popover': '1060',
-        'tooltip': '1070',
+        dropdown: "1000",
+        sticky: "1020",
+        fixed: "1030",
+        "modal-backdrop": "1040",
+        modal: "1050",
+        popover: "1060",
+        tooltip: "1070",
       },
     },
   },
diff --git a/frontend/tsconfig.core.vite.json b/frontend/tsconfig.core.vite.json
index a06e67c0f9..daa02a7f05 100644
--- a/frontend/tsconfig.core.vite.json
+++ b/frontend/tsconfig.core.vite.json
@@ -2,14 +2,8 @@
   "extends": "./tsconfig.json",
   "compilerOptions": {
     "paths": {
-      "@app/*": [
-        "src/core/*"
-      ]
+      "@app/*": ["src/core/*"]
     }
   },
-  "exclude": [
-    "src/proprietary",
-    "src/desktop",
-    "node_modules"
-  ]
+  "exclude": ["src/proprietary", "src/desktop", "node_modules"]
 }
diff --git a/frontend/tsconfig.desktop.vite.json b/frontend/tsconfig.desktop.vite.json
index 8d586f5bee..abdd28a859 100644
--- a/frontend/tsconfig.desktop.vite.json
+++ b/frontend/tsconfig.desktop.vite.json
@@ -2,11 +2,7 @@
   "extends": "./tsconfig.proprietary.vite.json",
   "compilerOptions": {
     "paths": {
-      "@app/*": [
-        "src/desktop/*",
-        "src/proprietary/*",
-        "src/core/*"
-      ],
+      "@app/*": ["src/desktop/*", "src/proprietary/*", "src/core/*"],
       "@proprietary/*": ["src/proprietary/*"],
       "@core/*": ["src/core/*"]
     }
diff --git a/frontend/tsconfig.json b/frontend/tsconfig.json
index 242f518f6b..37fc14efd0 100644
--- a/frontend/tsconfig.json
+++ b/frontend/tsconfig.json
@@ -11,9 +11,9 @@
     // "disableReferencedProjectLoad": true,             /* Reduce the number of projects loaded automatically by TypeScript. */
 
     /* Language and Environment */
-    "target": "es2022",                                  /* Set the JavaScript language version for emitted JavaScript and include compatible library declarations. */
+    "target": "es2022" /* Set the JavaScript language version for emitted JavaScript and include compatible library declarations. */,
     // "lib": [],                                        /* Specify a set of bundled library declaration files that describe the target runtime environment. */
-    "jsx": "react-jsx",                                /* Specify what JSX code is generated. */
+    "jsx": "react-jsx" /* Specify what JSX code is generated. */,
     // "libReplacement": true,                           /* Enable lib replacement. */
     // "experimentalDecorators": true,                   /* Enable experimental support for legacy experimental decorators. */
     // "emitDecoratorMetadata": true,                    /* Emit design-type metadata for decorated declarations in source files. */
@@ -26,16 +26,13 @@
     // "moduleDetection": "auto",                        /* Control what method is used to detect module-format JS files. */
 
     /* Modules */
-    "module": "esnext",                                /* Specify what module code is generated. */
+    "module": "esnext" /* Specify what module code is generated. */,
     // "rootDir": "./",                                  /* Specify the root folder within your source files. */
-    "moduleResolution": "bundler",                     /* Specify how TypeScript looks up a file from a given module specifier. */
-    "baseUrl": "./",                                  /* Specify the base directory to resolve non-relative module names. */
-    "paths": {                                       /* Specify a set of entries that re-map imports to additional lookup locations. */
-      "@app/*": [
-        "src/desktop/*",
-        "src/proprietary/*",
-        "src/core/*"
-      ],
+    "moduleResolution": "bundler" /* Specify how TypeScript looks up a file from a given module specifier. */,
+    "baseUrl": "./" /* Specify the base directory to resolve non-relative module names. */,
+    "paths": {
+      /* Specify a set of entries that re-map imports to additional lookup locations. */
+      "@app/*": ["src/desktop/*", "src/proprietary/*", "src/core/*"],
       "@proprietary/*": ["src/proprietary/*"],
       "@core/*": ["src/core/*"]
     },
@@ -50,7 +47,7 @@
     // "resolvePackageJsonImports": true,                /* Use the package.json 'imports' field when resolving imports. */
     // "customConditions": [],                           /* Conditions to set in addition to the resolver-specific defaults when resolving imports. */
     // "noUncheckedSideEffectImports": true,             /* Check side effect imports. */
-    "resolveJsonModule": true,                        /* Enable importing .json files. */
+    "resolveJsonModule": true /* Enable importing .json files. */,
     // "allowArbitraryExtensions": true,                 /* Enable importing files with any extension, provided a declaration file is present. */
     // "noResolve": true,                                /* Disallow 'import's, 'require's or '<reference>'s from expanding the number of files TypeScript should add to a project. */
 
@@ -88,12 +85,12 @@
     // "isolatedDeclarations": true,                     /* Require sufficient annotation on exports so other tools can trivially generate declaration files. */
     // "erasableSyntaxOnly": true,                       /* Do not allow runtime constructs that are not part of ECMAScript. */
     // "allowSyntheticDefaultImports": true,             /* Allow 'import x from y' when a module doesn't have a default export. */
-    "esModuleInterop": true,                             /* Emit additional JavaScript to ease support for importing CommonJS modules. This enables 'allowSyntheticDefaultImports' for type compatibility. */
+    "esModuleInterop": true /* Emit additional JavaScript to ease support for importing CommonJS modules. This enables 'allowSyntheticDefaultImports' for type compatibility. */,
     // "preserveSymlinks": true,                         /* Disable resolving symlinks to their realpath. This correlates to the same flag in node. */
-    "forceConsistentCasingInFileNames": true,            /* Ensure that casing is correct in imports. */
+    "forceConsistentCasingInFileNames": true /* Ensure that casing is correct in imports. */,
 
     /* Type Checking */
-    "strict": true,                                      /* Enable all strict type-checking options. */
+    "strict": true /* Enable all strict type-checking options. */,
     // "noImplicitAny": true,                            /* Enable error reporting for expressions and declarations with an implied 'any' type. */
     // "strictNullChecks": true,                         /* When type checking, take into account 'null' and 'undefined'. */
     // "strictFunctionTypes": true,                      /* When assigning functions, check to ensure parameters and the return values are subtype-compatible. */
@@ -116,10 +113,7 @@
 
     /* Completeness */
     // "skipDefaultLibCheck": true,                      /* Skip type checking .d.ts files that are included with TypeScript. */
-    "skipLibCheck": true                                 /* Skip type checking all .d.ts files. */
+    "skipLibCheck": true /* Skip type checking all .d.ts files. */
   },
-  "include": [
-    "src",
-    "src/global.d.ts"
-, "vite.config.ts"  ]
+  "include": ["src", "src/global.d.ts", "vite.config.ts"]
 }
diff --git a/frontend/tsconfig.proprietary.vite.json b/frontend/tsconfig.proprietary.vite.json
index af9c80a6cd..2cde30d2bf 100644
--- a/frontend/tsconfig.proprietary.vite.json
+++ b/frontend/tsconfig.proprietary.vite.json
@@ -2,10 +2,7 @@
   "extends": "./tsconfig.json",
   "compilerOptions": {
     "paths": {
-      "@app/*": [
-        "src/proprietary/*",
-        "src/core/*"
-      ],
+      "@app/*": ["src/proprietary/*", "src/core/*"],
       "@proprietary/*": ["src/proprietary/*"],
       "@core/*": ["src/core/*"]
     }
diff --git a/frontend/tsconfig.prototypes.vite.json b/frontend/tsconfig.prototypes.vite.json
new file mode 100644
index 0000000000..eae017ee6b
--- /dev/null
+++ b/frontend/tsconfig.prototypes.vite.json
@@ -0,0 +1,19 @@
+{
+  "extends": "./tsconfig.proprietary.vite.json",
+  "compilerOptions": {
+    "paths": {
+      "@app/*": ["src/prototypes/*", "src/proprietary/*", "src/core/*"],
+      "@proprietary/*": ["src/proprietary/*"],
+      "@core/*": ["src/core/*"]
+    }
+  },
+  "exclude": [
+    "src/core/**/*.test.ts*",
+    "src/core/**/*.spec.ts*",
+    "src/proprietary/**/*.test.ts*",
+    "src/proprietary/**/*.spec.ts*",
+    "src/desktop",
+    "src/saas",
+    "node_modules"
+  ]
+}
diff --git a/frontend/tsconfig.saas.vite.json b/frontend/tsconfig.saas.vite.json
index 843368ca75..c0cced8c04 100644
--- a/frontend/tsconfig.saas.vite.json
+++ b/frontend/tsconfig.saas.vite.json
@@ -2,11 +2,7 @@
   "extends": "./tsconfig.json",
   "compilerOptions": {
     "paths": {
-      "@app/*": [
-        "src/saas/*",
-        "src/proprietary/*",
-        "src/core/*"
-      ],
+      "@app/*": ["src/saas/*", "src/proprietary/*", "src/core/*"],
       "@proprietary/*": ["src/proprietary/*"],
       "@core/*": ["src/core/*"]
     }
diff --git a/frontend/vite.config.ts b/frontend/vite.config.ts
index a2fcf79395..77c48a22e7 100644
--- a/frontend/vite.config.ts
+++ b/frontend/vite.config.ts
@@ -1,31 +1,41 @@
-import { defineConfig, loadEnv } from 'vite';
-import react from '@vitejs/plugin-react-swc';
-import tsconfigPaths from 'vite-tsconfig-paths';
-import { viteStaticCopy } from 'vite-plugin-static-copy';
+import { defineConfig, loadEnv } from "vite";
+import react from "@vitejs/plugin-react-swc";
+import tsconfigPaths from "vite-tsconfig-paths";
+import { viteStaticCopy } from "vite-plugin-static-copy";
 
-const VALID_MODES = ['core', 'proprietary', 'saas', 'desktop'] as const;
-type BuildMode = typeof VALID_MODES[number];
+const VALID_MODES = [
+  "core",
+  "proprietary",
+  "saas",
+  "desktop",
+  "prototypes",
+] as const;
+type BuildMode = (typeof VALID_MODES)[number];
 
 const TSCONFIG_MAP: Record<BuildMode, string> = {
-  core: './tsconfig.core.vite.json',
-  proprietary: './tsconfig.proprietary.vite.json',
-  saas: './tsconfig.saas.vite.json',
-  desktop: './tsconfig.desktop.vite.json',
+  core: "./tsconfig.core.vite.json",
+  proprietary: "./tsconfig.proprietary.vite.json",
+  saas: "./tsconfig.saas.vite.json",
+  desktop: "./tsconfig.desktop.vite.json",
+  prototypes: "./tsconfig.prototypes.vite.json",
 };
 
 export default defineConfig(({ mode }) => {
-
   // Load env file based on `mode` in the current working directory.
   // Set the third parameter to '' to load all env regardless of the
   // `VITE_` prefix.
-  const env = loadEnv(mode, process.cwd(), '')
+  const env = loadEnv(mode, process.cwd(), "");
 
   // Resolve the effective build mode.
   // Explicit --mode flags take precedence; otherwise default to proprietary
   // unless DISABLE_ADDITIONAL_FEATURES=true, in which case default to core.
-  const effectiveMode: BuildMode = (VALID_MODES as readonly string[]).includes(mode)
+  const effectiveMode: BuildMode = (VALID_MODES as readonly string[]).includes(
+    mode,
+  )
     ? (mode as BuildMode)
-    : process.env.DISABLE_ADDITIONAL_FEATURES === 'true' ? 'core' : 'proprietary';
+    : process.env.DISABLE_ADDITIONAL_FEATURES === "true"
+      ? "core"
+      : "proprietary";
 
   const tsconfigProject = TSCONFIG_MAP[effectiveMode];
 
@@ -42,16 +52,29 @@ export default defineConfig(({ mode }) => {
         targets: [
           {
             //provides static pdfium so embedpdf can run without cdn
-            src: 'node_modules/@embedpdf/pdfium/dist/pdfium.wasm',
-            dest: 'pdfium'
+            src: "node_modules/@embedpdf/pdfium/dist/pdfium.wasm",
+            dest: "pdfium",
           },
           {
             // Copy jscanify vendor files to dist
-            src: 'public/vendor/jscanify/*',
-            dest: 'vendor/jscanify'
-          }
-        ]
-      })
+            src: "public/vendor/jscanify/*",
+            dest: "vendor/jscanify",
+          },
+          {
+            // pdfjs-dist CMap data for CJK / non-latin glyph mapping — required
+            // when rendering PDFs inside workers where the default DOM fetch paths
+            // aren't available.
+            src: "node_modules/pdfjs-dist/cmaps/*",
+            dest: "pdfjs/cmaps",
+          },
+          {
+            // pdfjs-dist standard font data (Helvetica/Times/etc.) — needed so
+            // workers can substitute non-embedded base 14 fonts without DOM access.
+            src: "node_modules/pdfjs-dist/standard_fonts/*",
+            dest: "pdfjs/standard_fonts",
+          },
+        ],
+      }),
     ],
     server: {
       host: true,
@@ -61,60 +84,57 @@ export default defineConfig(({ mode }) => {
       strictPort: true,
       watch: {
         // tell vite to ignore watching `src-tauri`
-        ignored: ['**/src-tauri/**'],
+        ignored: ["**/src-tauri/**"],
       },
       // Only use proxy in web mode - Tauri handles backend connections directly
-      proxy: effectiveMode === 'desktop' ? undefined : {
-        '/api': {
-          target: backendTarget,
-          changeOrigin: true,
-          secure: false,
-          xfwd: true,
-        },
-        '/oauth2': {
-          target: backendTarget,
-          changeOrigin: true,
-          secure: false,
-          xfwd: true,
-        },
-        '/saml2': {
-          target: backendTarget,
-          changeOrigin: true,
-          secure: false,
-          xfwd: true,
-        },
-        '/login/oauth2': {
-          target: backendTarget,
-          changeOrigin: true,
-          secure: false,
-          xfwd: true,
-        },
-        '/login/saml2': {
-          target: backendTarget,
-          changeOrigin: true,
-          secure: false,
-          xfwd: true,
-        },
-        '/swagger-ui': {
-          target: backendTarget,
-          changeOrigin: true,
-          secure: false,
-          xfwd: true,
-        },
-        '/v1/api-docs': {
-          target: backendTarget,
-          changeOrigin: true,
-          secure: false,
-          xfwd: true,
-        },
-        '/engine-api': {
-          target: aiEngineTarget,
-          changeOrigin: true,
-          secure: false,
-          rewrite: (path: string) => path.replace(/^\/engine-api/, ''),
-        },
-      },
+      proxy:
+        effectiveMode === "desktop"
+          ? undefined
+          : {
+              "/api": {
+                target: "http://localhost:8080",
+                changeOrigin: true,
+                secure: false,
+                xfwd: true,
+              },
+              "/oauth2": {
+                target: "http://localhost:8080",
+                changeOrigin: true,
+                secure: false,
+                xfwd: true,
+              },
+              "/saml2": {
+                target: "http://localhost:8080",
+                changeOrigin: true,
+                secure: false,
+                xfwd: true,
+              },
+              "/login/oauth2": {
+                target: "http://localhost:8080",
+                changeOrigin: true,
+                secure: false,
+                xfwd: true,
+              },
+              "/login/saml2": {
+                target: "http://localhost:8080",
+                changeOrigin: true,
+                secure: false,
+                xfwd: true,
+              },
+              "/swagger-ui": {
+                target: "http://localhost:8080",
+                changeOrigin: true,
+                secure: false,
+                xfwd: true,
+              },
+              "/v1/api-docs": {
+                target: "http://localhost:8080",
+                changeOrigin: true,
+                secure: false,
+                xfwd: true,
+              },
+            },
     },
-    base: env.RUN_SUBPATH ? `/${env.RUN_SUBPATH}` : './',
+    base: env.RUN_SUBPATH ? `/${env.RUN_SUBPATH}` : "./",
   };
 });
diff --git a/frontend/vitest.config.ts b/frontend/vitest.config.ts
index 63fef12cfb..3343f02426 100644
--- a/frontend/vitest.config.ts
+++ b/frontend/vitest.config.ts
@@ -1,108 +1,126 @@
-import { defineConfig } from 'vitest/config';
-import react from '@vitejs/plugin-react-swc';
-import tsconfigPaths from 'vite-tsconfig-paths';
+import { defineConfig } from "vitest/config";
+import react from "@vitejs/plugin-react-swc";
+import tsconfigPaths from "vite-tsconfig-paths";
 
 export default defineConfig({
   test: {
     globals: true,
-    environment: 'jsdom',
-    setupFiles: ['./src/core/setupTests.ts'],
+    environment: "jsdom",
+    setupFiles: ["./src/core/setupTests.ts"],
     css: false,
     exclude: [
-      'node_modules/',
-      'src/**/*.spec.ts', // Exclude Playwright E2E tests
-      'src/tests/test-fixtures/**'
+      "node_modules/",
+      "src/**/*.spec.ts", // Exclude Playwright E2E tests
+      "src/tests/test-fixtures/**",
     ],
     testTimeout: 10000,
     hookTimeout: 10000,
     coverage: {
-      reporter: ['text', 'json', 'html'],
+      reporter: ["text", "json", "html"],
       exclude: [
-        'node_modules/',
-        'src/core/setupTests.ts',
-        'src/proprietary/setupTests.ts',
-        'src/saas/setupTests.ts',
-        '**/*.d.ts',
-        'src/tests/test-fixtures/**',
-        'src/**/*.spec.ts'
-      ]
+        "node_modules/",
+        "src/core/setupTests.ts",
+        "src/proprietary/setupTests.ts",
+        "src/saas/setupTests.ts",
+        "**/*.d.ts",
+        "src/tests/test-fixtures/**",
+        "src/**/*.spec.ts",
+      ],
     },
     projects: [
       {
         test: {
-          name: 'core',
-          include: ['src/core/**/*.test.{ts,tsx}'],
-          environment: 'jsdom',
+          name: "core",
+          include: ["src/core/**/*.test.{ts,tsx}"],
+          environment: "jsdom",
           globals: true,
-          setupFiles: ['./src/core/setupTests.ts'],
+          setupFiles: ["./src/core/setupTests.ts"],
         },
         plugins: [
           react(),
           tsconfigPaths({
-            projects: ['./tsconfig.core.vite.json'],
+            projects: ["./tsconfig.core.vite.json"],
           }),
         ],
         esbuild: {
-          target: 'es2020'
-        }
+          target: "es2020",
+        },
       },
       {
         test: {
-          name: 'proprietary',
-          include: ['src/proprietary/**/*.test.{ts,tsx}'],
-          environment: 'jsdom',
+          name: "proprietary",
+          include: ["src/proprietary/**/*.test.{ts,tsx}"],
+          environment: "jsdom",
           globals: true,
-          setupFiles: ['./src/core/setupTests.ts'],
+          setupFiles: ["./src/core/setupTests.ts"],
         },
         plugins: [
           react(),
           tsconfigPaths({
-            projects: ['./tsconfig.proprietary.vite.json'],
+            projects: ["./tsconfig.proprietary.vite.json"],
           }),
         ],
         esbuild: {
-          target: 'es2020'
-        }
+          target: "es2020",
+        },
       },
       {
         test: {
-          name: 'desktop',
-          include: ['src/desktop/**/*.test.{ts,tsx}'],
-          environment: 'jsdom',
+          name: "desktop",
+          include: ["src/desktop/**/*.test.{ts,tsx}"],
+          environment: "jsdom",
           globals: true,
-          setupFiles: ['./src/core/setupTests.ts'],
+          setupFiles: ["./src/core/setupTests.ts"],
         },
         plugins: [
           react(),
           tsconfigPaths({
-            projects: ['./tsconfig.desktop.vite.json'],
+            projects: ["./tsconfig.desktop.vite.json"],
           }),
         ],
         esbuild: {
-          target: 'es2020'
-        }
+          target: "es2020",
+        },
       },
       {
         test: {
-          name: 'saas',
-          include: ['src/saas/**/*.test.{ts,tsx}'],
-          environment: 'jsdom',
+          name: "saas",
+          include: ["src/saas/**/*.test.{ts,tsx}"],
+          environment: "jsdom",
           globals: true,
-          setupFiles: ['./src/saas/setupTests.ts'],
+          setupFiles: ["./src/saas/setupTests.ts"],
         },
         plugins: [
           react(),
           tsconfigPaths({
-            projects: ['./tsconfig.saas.vite.json'],
+            projects: ["./tsconfig.saas.vite.json"],
           }),
         ],
         esbuild: {
-          target: 'es2020'
-        }
+          target: "es2020",
+        },
+      },
+      {
+        test: {
+          name: "prototypes",
+          include: ["src/prototypes/**/*.test.{ts,tsx}"],
+          environment: "jsdom",
+          globals: true,
+          setupFiles: ["./src/core/setupTests.ts"],
+        },
+        plugins: [
+          react(),
+          tsconfigPaths({
+            projects: ["./tsconfig.prototypes.vite.json"],
+          }),
+        ],
+        esbuild: {
+          target: "es2020",
+        },
       },
     ],
   },
   esbuild: {
-    target: 'es2020'
-  }
+    target: "es2020",
+  },
 });
diff --git a/scripts/build-tauri-jlink.bat b/scripts/build-tauri-jlink.bat
deleted file mode 100644
index be9cd00d72..0000000000
--- a/scripts/build-tauri-jlink.bat
+++ /dev/null
@@ -1,176 +0,0 @@
-@echo off
-REM Build script for Tauri with JLink runtime bundling
-REM This script creates a self-contained Java runtime for Stirling-PDF
-
-echo 🔧 Building Stirling-PDF with JLink runtime for Tauri...
-
-echo â–¶ Checking Java environment...
-java -version >nul 2>&1
-if errorlevel 1 (
-    echo � Java is not installed or not in PATH
-    exit /b 1
-)
-
-jlink --version >nul 2>&1
-if errorlevel 1 (
-    echo � jlink is not available. Please ensure you have a JDK ^(not just JRE^) installed.
-    exit /b 1
-)
-
-echo â–¶ Checking Java version...
-set "JAVA_VERSION_STRING="
-for /f "tokens=3" %%g in ('java -version 2^>^&1 ^| findstr /i "version"') do (
-    set "JAVA_VERSION_STRING=%%g"
-)
-if not defined JAVA_VERSION_STRING (
-    echo � Unable to capture Java version string from "java -version"
-    exit /b 1
-)
-set "JAVA_VERSION_STRING=%JAVA_VERSION_STRING:"=%"
-set "JAVA_MAJOR_VERSION="
-set "JAVA_MINOR_VERSION=0"
-set "JAVA_EFFECTIVE_MAJOR="
-for /f "tokens=1,2 delims=." %%a in ("%JAVA_VERSION_STRING%") do (
-    set "JAVA_MAJOR_VERSION=%%a"
-    set "JAVA_MINOR_VERSION=%%b"
-    if "%%a"=="1" (
-        set "JAVA_EFFECTIVE_MAJOR=%%b"
-    ) else (
-        set "JAVA_EFFECTIVE_MAJOR=%%a"
-    )
-)
-if not defined JAVA_MAJOR_VERSION (
-    echo � Unable to determine Java major version from "%JAVA_VERSION_STRING%"
-    exit /b 1
-)
-if not defined JAVA_EFFECTIVE_MAJOR (
-    echo � Unable to determine an effective Java major version from "%JAVA_VERSION_STRING%"
-    exit /b 1
-)
-for /f "tokens=1 delims=.-" %%c in ("%JAVA_EFFECTIVE_MAJOR%") do set "JAVA_EFFECTIVE_MAJOR=%%c"
-set /a "JAVA_EFFECTIVE_MAJOR_NUM=%JAVA_EFFECTIVE_MAJOR%" >nul 2>&1
-if errorlevel 1 (
-    echo � Java major version "%JAVA_EFFECTIVE_MAJOR%" could not be parsed as an integer. Detected string: "%JAVA_VERSION_STRING%"
-    exit /b 1
-)
-set "JAVA_EFFECTIVE_MAJOR=%JAVA_EFFECTIVE_MAJOR_NUM%"
-if %JAVA_EFFECTIVE_MAJOR% LSS 21 (
-    echo � Java 21 or higher is required. Found Java %JAVA_EFFECTIVE_MAJOR%
-    exit /b 1
-)
-echo ✅ Java %JAVA_EFFECTIVE_MAJOR% and jlink detected
-
-echo â–¶ Building Stirling-PDF JAR...
-
-set DISABLE_ADDITIONAL_FEATURES=true
-call gradlew.bat clean bootJar --no-daemon
-if errorlevel 1 (
-    echo � Failed to build Stirling-PDF JAR
-    exit /b 1
-)
-
-REM Find the built JAR(s)
-echo â–¶ Listing all built JAR files in app\core\build\libs:
-dir /b app\core\build\libs\stirling-pdf-*.jar
-for %%f in (app\core\build\libs\stirling-pdf-*.jar) do set STIRLING_JAR=%%f
-if not exist "%STIRLING_JAR%" (
-    echo � No Stirling-PDF JAR found in build/libs/
-    exit /b 1
-)
-
-echo ✅ Built JAR: %STIRLING_JAR%
-
-echo â–¶ Creating Tauri directories...
-if not exist "frontend\src-tauri\libs" mkdir "frontend\src-tauri\libs"
-if not exist "frontend\src-tauri\runtime" mkdir "frontend\src-tauri\runtime"
-
-echo â–¶ Copying JAR to Tauri libs directory...
-copy "%STIRLING_JAR%" "frontend\src-tauri\libs\"
-echo ✅ JAR copied to frontend\src-tauri\libs\
-
-REM Log out all JAR files now in the Tauri libs directory
-echo â–¶ Listing all JAR files in frontend\src-tauri\libs after copy:
-dir /b frontend\src-tauri\libs\stirling-pdf-*.jar
-
-echo â–¶ Creating custom JRE with jlink...
-if exist "frontend\src-tauri\runtime\jre" rmdir /s /q "frontend\src-tauri\runtime\jre"
-
-REM Use predefined module list for Windows (jdeps may not be available)
-set MODULES=java.base,java.compiler,java.desktop,java.instrument,java.logging,java.management,java.naming,java.net.http,java.prefs,java.rmi,java.scripting,java.security.jgss,java.security.sasl,java.sql,java.transaction.xa,java.xml,java.xml.crypto,jdk.crypto.ec,jdk.crypto.cryptoki,jdk.unsupported
-
-echo â–¶ Creating JLink runtime with modules: %MODULES%
-
-jlink ^
-    --add-modules %MODULES% ^
-    --strip-debug ^
-    --compress=2 ^
-    --no-header-files ^
-    --no-man-pages ^
-    --output "frontend\src-tauri\runtime\jre"
-
-if not exist "frontend\src-tauri\runtime\jre" (
-    echo � Failed to create JLink runtime
-    exit /b 1
-)
-
-echo ✅ JLink runtime created at frontend\src-tauri\runtime\jre
-
-echo â–¶ Creating launcher scripts for testing...
-
-REM Create Windows launcher script
-echo @echo off > "frontend\src-tauri\runtime\launch-stirling.bat"
-echo REM Launcher script for Stirling-PDF with bundled JRE >> "frontend\src-tauri\runtime\launch-stirling.bat"
-echo. >> "frontend\src-tauri\runtime\launch-stirling.bat"
-echo set SCRIPT_DIR=%%~dp0 >> "frontend\src-tauri\runtime\launch-stirling.bat"
-echo set JRE_DIR=%%SCRIPT_DIR%%jre >> "frontend\src-tauri\runtime\launch-stirling.bat"
-echo set LIBS_DIR=%%SCRIPT_DIR%%..\libs >> "frontend\src-tauri\runtime\launch-stirling.bat"
-echo. >> "frontend\src-tauri\runtime\launch-stirling.bat"
-echo REM Find the Stirling-PDF JAR >> "frontend\src-tauri\runtime\launch-stirling.bat"
-echo for %%%%f in ("%%LIBS_DIR%%\Stirling-PDF-*.jar") do set STIRLING_JAR=%%%%f >> "frontend\src-tauri\runtime\launch-stirling.bat"
-echo. >> "frontend\src-tauri\runtime\launch-stirling.bat"
-echo if not exist "%%STIRLING_JAR%%" ^( >> "frontend\src-tauri\runtime\launch-stirling.bat"
-echo     echo � Stirling-PDF JAR not found in %%LIBS_DIR%% >> "frontend\src-tauri\runtime\launch-stirling.bat"
-echo     exit /b 1 >> "frontend\src-tauri\runtime\launch-stirling.bat"
-echo ^) >> "frontend\src-tauri\runtime\launch-stirling.bat"
-echo. >> "frontend\src-tauri\runtime\launch-stirling.bat"
-echo REM Launch with bundled JRE >> "frontend\src-tauri\runtime\launch-stirling.bat"
-echo "%%JRE_DIR%%\bin\java.exe" ^^ >> "frontend\src-tauri\runtime\launch-stirling.bat"
-echo     -Xmx2g ^^ >> "frontend\src-tauri\runtime\launch-stirling.bat"
-echo     -DBROWSER_OPEN=true ^^ >> "frontend\src-tauri\runtime\launch-stirling.bat"
-echo     -jar "%%STIRLING_JAR%%" ^^ >> "frontend\src-tauri\runtime\launch-stirling.bat"
-echo     %%* >> "frontend\src-tauri\runtime\launch-stirling.bat"
-
-echo ✅ Created launcher scripts for testing
-
-echo â–¶ Testing bundled JRE...
-"frontend\src-tauri\runtime\jre\bin\java.exe" --version >nul 2>&1
-if errorlevel 1 (
-    echo � Bundled JRE test failed
-    exit /b 1
-) else (
-    echo ✅ Bundled JRE works correctly
-)
-
-echo.
-echo ✅ 🎉 JLink build setup completed successfully!
-echo.
-echo 📊 Summary:
-echo    • JAR: %STIRLING_JAR%
-echo    • Runtime: frontend\src-tauri\runtime\jre
-echo    • Modules: %MODULES%
-echo.
-echo 📋 Next steps:
-echo    1. cd frontend
-echo    2. npm run tauri-build
-echo.
-echo 💡 Testing:
-echo    • Test bundled runtime: frontend\src-tauri\runtime\launch-stirling.bat
-echo    • Tauri configuration already updated to include bundled JRE
-echo.
-echo 💡 Benefits:
-echo    • No external JRE dependency
-echo    • Smaller distribution size with custom runtime
-echo    • Better security with minimal required modules
-echo    • Consistent Java version across all deployments
-echo.
-echo ✅ The application will now run without requiring users to install Java!
diff --git a/scripts/build-tauri-jlink.sh b/scripts/build-tauri-jlink.sh
deleted file mode 100755
index 9aee738e0c..0000000000
--- a/scripts/build-tauri-jlink.sh
+++ /dev/null
@@ -1,229 +0,0 @@
-#!/bin/bash
-
-# Build script for Tauri with JLink runtime bundling
-# This script creates a self-contained Java runtime for Stirling-PDF
-
-set -e
-
-echo "🔧 Building Stirling-PDF with JLink runtime for Tauri..."
-
-# Colors for output
-RED='\033[0;31m'
-GREEN='\033[0;32m'
-YELLOW='\033[1;33m'
-BLUE='\033[0;34m'
-NC='\033[0m' # No Color
-
-# Function to print colored output
-print_step() {
-    echo -e "${BLUE}â–¶ $1${NC}"
-}
-
-print_success() {
-    echo -e "${GREEN}✅ $1${NC}"
-}
-
-print_warning() {
-    echo -e "${YELLOW}⚠� $1${NC}"
-}
-
-print_error() {
-    echo -e "${RED}� $1${NC}"
-}
-
-# Check if Java is installed and version
-print_step "Checking Java environment..."
-if ! command -v java &> /dev/null; then
-    print_error "Java is not installed or not in PATH"
-    exit 1
-fi
-
-if ! command -v jlink &> /dev/null; then
-    print_error "jlink is not available. Please ensure you have a JDK (not just JRE) installed."
-    exit 1
-fi
-
-JAVA_VERSION=$(java -version 2>&1 | head -n 1 | cut -d'"' -f2 | cut -d'.' -f1)
-if [ "$JAVA_VERSION" -lt 21 ]; then
-    print_error "Java 21 or higher is required. Found Java $JAVA_VERSION"
-    exit 1
-fi
-
-print_success "Java $JAVA_VERSION detected with jlink support"
-
-# Check if jpackage is available (Java 14+)
-if command -v jpackage &> /dev/null; then
-    print_success "jpackage is available for native packaging"
-else
-    print_warning "jpackage is not available - using jlink only"
-fi
-
-# Clean and build the Stirling-PDF JAR
-print_step "Building Stirling-PDF JAR..."
-export DISABLE_ADDITIONAL_FEATURES=true
-./gradlew clean bootJar --no-daemon
-
-if [ ! -f compgen -G "app/core/build/libs/stirling-pdf-*.jar" ]; then
-    print_error "Failed to build stirling-pdf JAR"
-    exit 1
-fi
-
-# Find the built JAR
-STIRLING_JAR=$(ls app/core/build/libs/stirling-pdf-*.jar | head -n 1)
-print_success "Built JAR: $STIRLING_JAR"
-
-# Create directories for Tauri
-TAURI_SRC_DIR="frontend/src-tauri"
-TAURI_LIBS_DIR="$TAURI_SRC_DIR/libs"
-TAURI_RUNTIME_DIR="$TAURI_SRC_DIR/runtime"
-
-print_step "Creating Tauri directories..."
-mkdir -p "$TAURI_LIBS_DIR"
-mkdir -p "$TAURI_RUNTIME_DIR"
-
-# Copy the JAR to Tauri libs directory
-print_step "Copying JAR to Tauri libs directory..."
-cp "$STIRLING_JAR" "$TAURI_LIBS_DIR/"
-print_success "JAR copied to $TAURI_LIBS_DIR/"
-
-# Create a custom JRE using jlink
-print_step "Creating custom JRE with jlink..."
-
-# Determine modules needed by analyzing the JAR
-print_step "Analyzing JAR dependencies..."
-
-# Use jdeps to analyze module dependencies if available
-if command -v jdeps &> /dev/null; then
-    print_step "Running jdeps analysis..."
-    REQUIRED_MODULES=$(jdeps --print-module-deps --ignore-missing-deps "$STIRLING_JAR" 2>/dev/null || echo "")
-    if [ -n "$REQUIRED_MODULES" ]; then
-        print_success "jdeps detected modules: $REQUIRED_MODULES"
-        # Add additional modules we know Stirling-PDF needs
-        MODULES="$REQUIRED_MODULES,java.compiler,java.instrument,java.management,java.naming,java.net.http,java.prefs,java.rmi,java.scripting,java.security.jgss,java.security.sasl,java.sql,java.transaction.xa,java.xml.crypto,jdk.crypto.ec,jdk.crypto.cryptoki,jdk.unsupported"
-    else
-        print_warning "jdeps analysis failed, using predefined module list"
-        MODULES="java.base,java.compiler,java.desktop,java.instrument,java.logging,java.management,java.naming,java.net.http,java.prefs,java.rmi,java.scripting,java.security.jgss,java.security.sasl,java.sql,java.transaction.xa,java.xml,java.xml.crypto,jdk.crypto.ec,jdk.crypto.cryptoki,jdk.unsupported"
-    fi
-else
-    print_warning "jdeps not available, using predefined module list"
-    MODULES="java.base,java.compiler,java.desktop,java.instrument,java.logging,java.management,java.naming,java.net.http,java.prefs,java.rmi,java.scripting,java.security.jgss,java.security.sasl,java.sql,java.transaction.xa,java.xml,java.xml.crypto,jdk.crypto.ec,jdk.crypto.cryptoki,jdk.unsupported"
-fi
-
-print_step "Creating JLink runtime with modules: $MODULES"
-
-# Remove existing runtime if present
-rm -rf "$TAURI_RUNTIME_DIR/jre"
-
-# Create the custom JRE
-jlink \
-    --add-modules "$MODULES" \
-    --strip-debug \
-    --compress=2 \
-    --no-header-files \
-    --no-man-pages \
-    --output "$TAURI_RUNTIME_DIR/jre"
-
-if [ ! -d "$TAURI_RUNTIME_DIR/jre" ]; then
-    print_error "Failed to create JLink runtime"
-    exit 1
-fi
-
-print_success "JLink runtime created at $TAURI_RUNTIME_DIR/jre"
-
-# Calculate runtime size
-RUNTIME_SIZE=$(du -sh "$TAURI_RUNTIME_DIR/jre" | cut -f1)
-print_success "Runtime size: $RUNTIME_SIZE"
-
-# Create launcher scripts for testing
-print_step "Creating launcher scripts for testing..."
-
-LAUNCHER_SCRIPT="$TAURI_RUNTIME_DIR/launch-stirling.sh"
-cat > "$LAUNCHER_SCRIPT" << 'EOF'
-#!/bin/bash
-# Launcher script for Stirling-PDF with bundled JRE
-
-# Get the directory of this script
-SCRIPT_DIR="$(cd "$(dirname "${BASH_SOURCE[0]}")" && pwd)"
-JRE_DIR="$SCRIPT_DIR/jre"
-LIBS_DIR="$(dirname "$SCRIPT_DIR")/libs"
-
-# Find the Stirling-PDF JAR
-STIRLING_JAR=$(compgen -G "app/core/build/libs/stirling-pdf-*.jar")
-
-if [ ! -f "$STIRLING_JAR" ]; then
-    echo "� Stirling-PDF JAR not found in $LIBS_DIR"
-    exit 1
-fi
-
-# Launch with bundled JRE
-"$JRE_DIR/bin/java" \
-    -Xmx2g \
-    -DBROWSER_OPEN=true \
-    -jar "$STIRLING_JAR" \
-    "$@"
-EOF
-
-chmod +x "$LAUNCHER_SCRIPT"
-
-# Create Windows launcher
-LAUNCHER_BAT="$TAURI_RUNTIME_DIR/launch-stirling.bat"
-cat > "$LAUNCHER_BAT" << 'EOF'
-@echo off
-REM Launcher script for Stirling-PDF with bundled JRE
-
-set SCRIPT_DIR=%~dp0
-set JRE_DIR=%SCRIPT_DIR%jre
-set LIBS_DIR=%SCRIPT_DIR%..\libs
-
-REM Find the Stirling-PDF JAR
-for %%f in ("%LIBS_DIR%\Stirling-PDF-*.jar") do set STIRLING_JAR=%%f
-
-if not exist "%STIRLING_JAR%" (
-    echo � Stirling-PDF JAR not found in %LIBS_DIR%
-    exit /b 1
-)
-
-REM Launch with bundled JRE
-"%JRE_DIR%\bin\java.exe" ^
-    -Xmx2g ^
-    -DBROWSER_OPEN=true ^
-    -jar "%STIRLING_JAR%" ^
-    %*
-EOF
-
-print_success "Created launcher scripts for testing"
-
-# Test the bundled runtime
-print_step "Testing bundled JRE..."
-if [ -f "$TAURI_RUNTIME_DIR/jre/bin/java" ]; then
-    JAVA_VERSION_OUTPUT=$("$TAURI_RUNTIME_DIR/jre/bin/java" --version 2>&1 | head -n 1)
-    print_success "Bundled JRE works: $JAVA_VERSION_OUTPUT"
-else
-    print_error "Bundled JRE executable not found"
-    exit 1
-fi
-
-# Display summary
-echo ""
-print_success "🎉 JLink build setup completed successfully!"
-echo ""
-echo -e "${BLUE}📊 Summary:${NC}"
-echo "   • JAR: $STIRLING_JAR"
-echo "   • Runtime: $TAURI_RUNTIME_DIR/jre ($RUNTIME_SIZE)"
-echo "   • Modules: $MODULES"
-echo ""
-echo -e "${BLUE}📋 Next steps:${NC}"
-echo "   1. cd frontend"
-echo "   2. npm run tauri-build"
-echo ""
-echo -e "${BLUE}💡 Testing:${NC}"
-echo "   • Test bundled runtime: $LAUNCHER_SCRIPT"
-echo "   • Tauri configuration already updated to include bundled JRE"
-echo ""
-echo -e "${BLUE}💡 Benefits:${NC}"
-echo "   • No external JRE dependency"
-echo "   • Smaller distribution size with custom runtime"
-echo "   • Better security with minimal required modules"
-echo "   • Consistent Java version across all deployments"
-echo ""
-print_success "The application will now run without requiring users to install Java!"
diff --git a/scripts/init-without-ocr.sh b/scripts/init-without-ocr.sh
index 26e98c598c..0a406e9a58 100755
--- a/scripts/init-without-ocr.sh
+++ b/scripts/init-without-ocr.sh
@@ -41,7 +41,8 @@ print_versions() {
   command_exists unoserver && unoserver --version 2>&1 | head -n 1 | log
   command_exists tesseract && tesseract --version | head -n 1 | log
   command_exists gs && gs --version | printf "Ghostscript %s\n" "$(cat)" | log
-  command_exists ffmpeg && ffmpeg -version | head -n 1 | log
+  # ffmpeg disabled due to raised CVEs
+  # command_exists ffmpeg && ffmpeg -version | head -n 1 | log
   command_exists pdfinfo && pdfinfo -v 2>&1 | head -n 1 | log
   command_exists fontforge && fontforge --version 2>&1 | head -n 1 | log
   command_exists unpaper && unpaper --version 2>&1 | head -n 1 | log
@@ -176,13 +177,6 @@ UNOSERVER_PIDS=()
 UNOSERVER_PORTS=()
 UNOSERVER_UNO_PORTS=()
 
-SU_EXEC_BIN=""
-if command_exists su-exec; then
-  SU_EXEC_BIN="su-exec"
-elif command_exists gosu; then
-  SU_EXEC_BIN="gosu"
-fi
-
 CURRENT_USER="$(id -un)"
 CURRENT_UID="$(id -u)"
 SWITCH_USER_WARNING_EMITTED=false
@@ -197,8 +191,12 @@ warn_switch_user_once() {
 run_as_runtime_user() {
   if [ "$CURRENT_USER" = "$RUNTIME_USER" ]; then
     "$@"
-  elif [ "$CURRENT_UID" -eq 0 ] && [ -n "$SU_EXEC_BIN" ]; then
-    "$SU_EXEC_BIN" "$RUNTIME_USER" "$@"
+  elif [ "$CURRENT_UID" -eq 0 ] && command_exists setpriv; then
+    # Set HOME/USER/LOGNAME to match gosu behavior (setpriv does not touch env vars)
+    env HOME="$(getent passwd "$RUNTIME_USER" | cut -d: -f6)" \
+        USER="$RUNTIME_USER" \
+        LOGNAME="$RUNTIME_USER" \
+      setpriv --reuid="$RUNTIME_USER" --regid="$(id -gn "$RUNTIME_USER")" --init-groups -- "$@"
   else
     warn_switch_user_once
     "$@"
@@ -294,10 +292,20 @@ start_unoserver_watchdog() {
 
         if [ "$needs_restart" = true ]; then
           log "Restarting unoserver on 127.0.0.1:${port} (uno-port ${uno_port})"
-          # Kill the old process if it exists
+          # Kill the old process and its children (soffice) if it exists.
+          # Capture child PIDs first, then send TERM to children before parent
+          # so the PPID relationship is still visible. After sleep, use the
+          # saved PIDs for SIGKILL since the parent may have already exited
+          # and children would be reparented to init.
           if [ -n "$pid" ] && kill -0 "$pid" 2>/dev/null; then
+            local child_pids
+            child_pids=$(pgrep -P "$pid" 2>/dev/null || true)
+            pkill -TERM -P "$pid" 2>/dev/null || true
             kill -TERM "$pid" 2>/dev/null || true
-            sleep 1
+            sleep 3
+            if [ -n "$child_pids" ]; then
+              kill -KILL $child_pids 2>/dev/null || true
+            fi
             kill -KILL "$pid" 2>/dev/null || true
           fi
           start_unoserver_instance "$port" "$uno_port"
@@ -864,6 +872,21 @@ for p in "${CHOWN_PATHS[@]}"; do
   fi
 done
 
+# Verify write access to critical directories; repair if chown failed on bind mounts
+CRITICAL_DIRS=("/configs" "/logs" "/customFiles" "/pipeline")
+for dir in "${CRITICAL_DIRS[@]}"; do
+  if [ -d "$dir" ]; then
+    # Test write access as the runtime user
+    if ! run_as_runtime_user test -w "$dir" 2>/dev/null; then
+      log "WARNING: ${RUNTIME_USER} cannot write to $dir — attempting to fix permissions"
+      # Try adding group-write and world-write as fallbacks
+      chmod -R o+rwX "$dir" 2>/dev/null \
+        || chmod -R a+rwX "$dir" 2>/dev/null \
+        || log "ERROR: Could not grant ${RUNTIME_USER} write access to $dir. Check your volume mount permissions (e.g. set PUID/PGID or fix host directory ownership)."
+    fi
+  fi
+done
+
 # ---------- Xvfb ----------
 # Start a virtual framebuffer for GUI-based LibreOffice interactions.
 if command_exists Xvfb; then
@@ -915,8 +938,12 @@ fi
 
 if [ "$CURRENT_USER" = "$RUNTIME_USER" ]; then
   "${JAVA_CMD[@]}" &
-elif [ "$CURRENT_UID" -eq 0 ] && [ -n "$SU_EXEC_BIN" ]; then
-  "$SU_EXEC_BIN" "$RUNTIME_USER" "${JAVA_CMD[@]}" &
+elif [ "$CURRENT_UID" -eq 0 ] && command_exists setpriv; then
+  # Set HOME/USER/LOGNAME to match gosu behavior (setpriv does not touch env vars)
+  env HOME="$(getent passwd "$RUNTIME_USER" | cut -d: -f6)" \
+      USER="$RUNTIME_USER" \
+      LOGNAME="$RUNTIME_USER" \
+    setpriv --reuid="$RUNTIME_USER" --regid="$(id -gn "$RUNTIME_USER")" --init-groups -- "${JAVA_CMD[@]}" &
 else
   warn_switch_user_once
   "${JAVA_CMD[@]}" &
diff --git a/testing/allEndpointsRemovedSettings.yml b/testing/allEndpointsRemovedSettings.yml
index 54b330e5c1..eec19ecb23 100644
--- a/testing/allEndpointsRemovedSettings.yml
+++ b/testing/allEndpointsRemovedSettings.yml
@@ -65,7 +65,7 @@ security:
     enableKeyRotation: true # Set to 'true' to enable key pair rotation
     enableKeyCleanup: true # Set to 'true' to enable key pair cleanup
     tokenExpiryMinutes: 1440 # JWT access token lifetime in minutes for web clients (1 day).
-    desktopTokenExpiryMinutes: 43200 # JWT access token lifetime in minutes for desktop clients (30 days). 
+    desktopTokenExpiryMinutes: 43200 # JWT access token lifetime in minutes for desktop clients (30 days).
     allowedClockSkewSeconds: 60 # Allowed JWT validation clock skew in seconds to tolerate small client/server time drift.
     refreshGraceMinutes: 15 # Allow refresh using an expired access token only within this many minutes after expiry.
   validation: # PDF signature validation settings
@@ -84,6 +84,9 @@ security:
     revocation:
       mode: none # Revocation checking mode: 'none' (disabled), 'ocsp' (OCSP only), 'crl' (CRL only), 'ocsp+crl' (OCSP with CRL fallback)
       hardFail: false # Fail validation if revocation status cannot be determined (true=strict, false=soft-fail)
+  timestamp:
+    defaultTsaUrl: http://timestamp.digicert.com # Default TSA server for RFC 3161 document timestamps
+    customTsaUrls: [] # Admin-configured additional TSA URLs (e.g. ['https://internal-tsa.corp.com/timestamp']). Users can only select from built-in presets and these URLs.
   xFrameOptions: DENY # X-Frame-Options header value. Options: 'DENY' (default, prevents all framing), 'SAMEORIGIN' (allows framing from same domain), 'DISABLED' (no X-Frame-Options header sent). Note: automatically set to DISABLED when login is disabled
 
 premium:
@@ -237,6 +240,30 @@ system:
   databaseBackup:
     cron: "0 0 0 * * ?" # Cron expression for automatic database backups "0 0 0 * * ?" daily at midnight
 
+storage:
+  enabled: false # set to 'true' to allow users to store files on the server (requires security.enableLogin) [ALPHA]
+  provider: local # storage provider: 'local' for filesystem storage, 'database' for DB-backed storage
+  local:
+    basePath: './storage' # base directory for stored files
+  quotas:
+    maxStorageMbPerUser: -1 # Max storage per user in MB; -1 disables per-user cap
+    maxStorageMbTotal: -1 # Max storage across all users in MB; -1 disables total cap
+    maxFileMb: -1 # Max size per stored file (including history/audit) in MB; -1 disables limit
+  sharing:
+    enabled: false # set to 'true' to enable file sharing features [ALPHA]
+    linkEnabled: true # set to 'false' to disable share links (requires system.frontendUrl)
+    emailEnabled: false # set to 'true' to allow sharing by email (requires mail.enabled)
+    linkExpirationDays: 3 # Number of days before share links expire
+  signing:
+    enabled: false # set to 'true' to enable group signing workflow (requires storage.enabled) [ALPHA]
+autoPipeline:
+  outputFolder: "" # Output folder for processed pipeline files (leave empty for default)
+  fileReadiness:
+    enabled: true # Set to 'false' to skip all readiness checks and process files immediately (legacy behaviour)
+    settleTimeMillis: 5000 # How long (ms) a file must be unmodified before it is considered fully written and stable. Default: 5000 (5 seconds)
+    sizeCheckDelayMillis: 500 # Pause (ms) between two file-size reads used to detect active writes (Linux/macOS mid-copy detection). Default: 500
+    allowedExtensions: [] # Optional extension allow-list (case-insensitive, without the leading dot). Empty list = accept all extensions. Example: ["pdf", "tiff"]
+
 ui:
   appNameNavbar: "" # name displayed on the navigation bar
   logoStyle: classic # Options: 'classic' (default - classic S icon) or 'modern' (minimalist logo)
@@ -258,7 +285,7 @@ metrics:
 AutomaticallyGenerated:
   key: cbb81c0f-50b1-450c-a2b5-89ae527776eb
   UUID: 10dd4fba-01fa-4717-9b78-3dc4f54e398a
-  appVersion: 2.7.2
+  appVersion: 2.9.2
 
 processExecutor:
   autoUnoServer: true # true: use local pool based on libreOfficeSessionLimit; false: use unoServerEndpoints
@@ -298,6 +325,11 @@ processExecutor:
     ghostscriptTimeoutMinutes: 30
     ocrMyPdfTimeoutMinutes: 30
 
+aiEngine:
+  enabled: false # Set to 'true' to enable the AI engine integration
+  url: http://localhost:5001 # URL of the Python AI engine
+  timeoutSeconds: 120 # Timeout in seconds for AI engine requests
+
 pdfEditor:
   fallback-font: classpath:/static/fonts/NotoSans-Regular.ttf # Override to point at a custom fallback font
   cache:
diff --git a/testing/compose/docker-compose-keycloak-oauth.yml b/testing/compose/docker-compose-keycloak-oauth.yml
index dd5c096658..345dac2175 100644
--- a/testing/compose/docker-compose-keycloak-oauth.yml
+++ b/testing/compose/docker-compose-keycloak-oauth.yml
@@ -58,7 +58,7 @@ services:
       - "localhost:host-gateway"
       - "${KEYCLOAK_HOST:-kubernetes.docker.internal}:host-gateway"
     healthcheck:
-      test: ["CMD-SHELL", "curl -f http://localhost:8080/api/v1/info/status | grep -q 'UP'"]
+      test: ["CMD-SHELL", "curl -f http://localhost:8080$${SYSTEM_ROOTURIPATH:-''}/api/v1/info/status | grep -q 'UP'"]
       interval: 5s
       timeout: 10s
       retries: 30
diff --git a/testing/compose/docker-compose-keycloak-saml.yml b/testing/compose/docker-compose-keycloak-saml.yml
index c5192122ca..db5ec53a26 100644
--- a/testing/compose/docker-compose-keycloak-saml.yml
+++ b/testing/compose/docker-compose-keycloak-saml.yml
@@ -56,7 +56,7 @@ services:
       context: ../..
       dockerfile: docker/embedded/Dockerfile
     healthcheck:
-      test: ["CMD-SHELL", "curl -f http://localhost:8080/api/v1/info/status | grep -q 'UP'"]
+      test: ["CMD-SHELL", "curl -f http://localhost:8080$${SYSTEM_ROOTURIPATH:-''}/api/v1/info/status | grep -q 'UP'"]
       interval: 5s
       timeout: 10s
       retries: 30
diff --git a/testing/compose/docker-compose-security-with-login.yml b/testing/compose/docker-compose-security-with-login.yml
index ca35fd1c9f..7199d09171 100644
--- a/testing/compose/docker-compose-security-with-login.yml
+++ b/testing/compose/docker-compose-security-with-login.yml
@@ -10,7 +10,7 @@ services:
         limits:
           memory: 4G
     healthcheck:
-      test: ["CMD-SHELL", "curl -f http://localhost:8080/api/v1/info/status | grep -q 'UP'"]
+      test: ["CMD-SHELL", "curl -f http://localhost:8080$${SYSTEM_ROOTURIPATH:-''}/api/v1/info/status | grep -q 'UP'"]
       interval: 5s
       timeout: 10s
       retries: 16
diff --git a/testing/compose/docker-compose-security.yml b/testing/compose/docker-compose-security.yml
index deedc001fe..4454cb275f 100644
--- a/testing/compose/docker-compose-security.yml
+++ b/testing/compose/docker-compose-security.yml
@@ -10,7 +10,7 @@ services:
         limits:
           memory: 4G
     healthcheck:
-      test: ["CMD-SHELL", "curl -f http://localhost:8080/api/v1/info/status | grep -q 'UP'"]
+      test: ["CMD-SHELL", "curl -f http://localhost:8080$${SYSTEM_ROOTURIPATH:-''}/api/v1/info/status | grep -q 'UP'"]
       interval: 5s
       timeout: 10s
       retries: 16
diff --git a/testing/compose/docker-compose-ultra-lite.yml b/testing/compose/docker-compose-ultra-lite.yml
index fcb9554792..ab3a942809 100644
--- a/testing/compose/docker-compose-ultra-lite.yml
+++ b/testing/compose/docker-compose-ultra-lite.yml
@@ -10,7 +10,7 @@ services:
         limits:
           memory: 2G
     healthcheck:
-      test: ["CMD-SHELL", "curl -f http://localhost:8080/api/v1/info/status | grep -q 'UP'"]
+      test: ["CMD-SHELL", "curl -f http://localhost:8080$${SYSTEM_ROOTURIPATH:-''}/api/v1/info/status | grep -q 'UP'"]
       interval: 5s
       timeout: 10s
       retries: 16
diff --git a/testing/cucumber/features/external.feature b/testing/cucumber/features/external.feature
index ba3834eded..bf392d7206 100644
--- a/testing/cucumber/features/external.feature
+++ b/testing/cucumber/features/external.feature
@@ -251,34 +251,6 @@ Feature: API Validation
         And the response ZIP should contain 3 files
 
 
-    @ffmpeg @positive @pdftovideo
-    Scenario: Convert PDF to video (MP4)
-        Given I generate a PDF file as "fileInput"
-        And the pdf contains 3 pages with random text
-        And the request data includes
-            | parameter   | value |
-            | videoFormat | mp4   |
-            | fps         | 1     |
-        When I send the API request to the endpoint "/api/v1/convert/pdf/video"
-        Then the response status code should be 200
-        And the response file should have size greater than 1000
-        And the response file should have extension ".mp4"
-
-
-    @ffmpeg @positive @pdftovideo
-    Scenario: Convert PDF to video (WebM)
-        Given I generate a PDF file as "fileInput"
-        And the pdf contains 2 pages with random text
-        And the request data includes
-            | parameter   | value |
-            | videoFormat | webm  |
-            | fps         | 2     |
-        When I send the API request to the endpoint "/api/v1/convert/pdf/video"
-        Then the response status code should be 200
-        And the response file should have size greater than 1000
-        And the response file should have extension ".webm"
-
-
     @positive @pdftojson
     Scenario: Convert PDF to JSON (text editor format)
         Given I generate a PDF file as "fileInput"
diff --git a/testing/ledger/arithmetic_error.pdf b/testing/ledger/arithmetic_error.pdf
new file mode 100644
index 0000000000..36d73ebcaf
Binary files /dev/null and b/testing/ledger/arithmetic_error.pdf differ
diff --git a/testing/ledger/clean_invoice.pdf b/testing/ledger/clean_invoice.pdf
new file mode 100644
index 0000000000..c54d7d45be
--- /dev/null
+++ b/testing/ledger/clean_invoice.pdf
@@ -0,0 +1,86 @@
+%PDF-1.3
+%éëñ¿
+1 0 obj
+<<
+/Count 1
+/Kids [3 0 R]
+/MediaBox [0 0 595.28 841.89]
+/Type /Pages
+>>
+endobj
+2 0 obj
+<<
+/OpenAction [3 0 R /FitH null]
+/PageLayout /OneColumn
+/Pages 1 0 R
+/Type /Catalog
+>>
+endobj
+3 0 obj
+<<
+/Contents 4 0 R
+/Parent 1 0 R
+/Resources 7 0 R
+/Type /Page
+>>
+endobj
+4 0 obj
+<<
+/Filter /FlateDecode
+/Length 562
+>>
+stream
+xœ…”MoÚ@†ïù#•J‰
+›ÝÙo¤
+%-UÔÅm/¹¸Á‰Ü;2&¤ÿ¾»ccÌödËž÷Ù™wfáÓ%RÃælÁ妥ÝÃ,òŸ8#Ì€¶Œh
ÑÎçŸ|™OgðŠQÊ`ïî˜æÅÓD¿w¢Ë+Æú8ÒÄ-ç}\&c@ŠjDùˆÉ–|Ë‘Õ™“t¹„(ÃÏtñ�”0ÏëUY¤ÉêàP—<mEC¸ÍáDI!e HàœÄHÂ-(k‰µUqeòX#™Bÿ9@dÄš6á[ù· ÕD‰0€F¶
ß³´„¯Ez—ÔÁ‘àzÛ¶ç:ÍçY/»�9òH¹î:d?YjÂ]‚zûðàiž­ÖË2Íàc¾.V¿‚0DA´jÓíØÔs¡ˆ±mý€I_OÇ« Dxµ>€¨!¥mÌÎe|wƒ¾Há“ö�›ü¾ÜÄî÷µë]¶Jº¾„`ˆÚÏz‹&»¶„äµ-�|€´Ï–¤¶¥aý¶¸Ó8=e‹!‚ƒr+lÕñs²„ÙË“7åhZB¬Ú•ƺ®„äµ+�| z‡%†urè@vž ÷{|ÌØz2 ïêÚUwJSU'|FŠºÕT¸þU¶÷½./D©›ÞPzxXàþB–}o·M�_àöœÑ×·ch!{ã…õËîã?q¶¨n#o†Ìö+˜!²JcR$ñŸE¾É\|½�ðö#éß«<á-åü–%‚G
+endstream
+endobj
+5 0 obj
+<<
+/BaseFont /Helvetica-Bold
+/Encoding /WinAnsiEncoding
+/Subtype /Type1
+/Type /Font
+>>
+endobj
+6 0 obj
+<<
+/BaseFont /Helvetica
+/Encoding /WinAnsiEncoding
+/Subtype /Type1
+/Type /Font
+>>
+endobj
+7 0 obj
+<<
+/Font <</F1 5 0 R
+/F2 6 0 R>>
+/ProcSet [/PDF /Text /ImageB /ImageC /ImageI]
+>>
+endobj
+8 0 obj
+<<
+/CreationDate (D:20260402165856Z)
+>>
+endobj
+xref
+0 9
+0000000000 65535 f 
+0000000015 00000 n 
+0000000102 00000 n 
+0000000205 00000 n 
+0000000285 00000 n 
+0000000919 00000 n 
+0000001021 00000 n 
+0000001118 00000 n 
+0000001215 00000 n 
+trailer
+<<
+/Size 9
+/Root 2 0 R
+/Info 8 0 R
+/ID [<126348ECB4E9AAB0626EE0EA6D52254A><126348ECB4E9AAB0626EE0EA6D52254A>]
+>>
+startxref
+1270
+%%EOF
diff --git a/testing/ledger/consistency_error.pdf b/testing/ledger/consistency_error.pdf
new file mode 100644
index 0000000000..0526e86e39
Binary files /dev/null and b/testing/ledger/consistency_error.pdf differ
diff --git a/testing/ledger/generate_test_pdfs.py b/testing/ledger/generate_test_pdfs.py
new file mode 100644
index 0000000000..8712f5d4dd
--- /dev/null
+++ b/testing/ledger/generate_test_pdfs.py
@@ -0,0 +1,285 @@
+"""
+Generate test PDFs for the Ledger Auditor math validation agent.
+
+Run:  uv run python testing/ledger/generate_test_pdfs.py
+Outputs PDFs into testing/ledger/
+"""
+
+from fpdf import FPDF
+
+
+def _new_pdf() -> FPDF:
+    pdf = FPDF()
+    pdf.set_auto_page_break(auto=True, margin=15)
+    return pdf
+
+
+def _heading(pdf: FPDF, text: str) -> None:
+    pdf.set_font("Helvetica", "B", 16)
+    pdf.cell(0, 12, text, new_x="LMARGIN", new_y="NEXT")
+    pdf.ln(2)
+
+
+def _body(pdf: FPDF) -> None:
+    pdf.set_font("Helvetica", "", 11)
+
+
+def _table_row(pdf: FPDF, cells: list[str], bold: bool = False) -> None:
+    style = "B" if bold else ""
+    pdf.set_font("Helvetica", style, 10)
+    col_w = (pdf.w - 2 * pdf.l_margin) / len(cells)
+    for c in cells:
+        pdf.cell(col_w, 8, c, border=1, align="C")
+    pdf.ln()
+
+
+# ─────────────────────────────────────────────────────────────────────────────
+# 1. Clean invoice — all math is correct
+# ─────────────────────────────────────────────────────────────────────────────
+def create_clean_invoice():
+    pdf = _new_pdf()
+    pdf.add_page()
+
+    _heading(pdf, "INVOICE #1001 - Acme Corp")
+    _body(pdf)
+    pdf.cell(0, 8, "Date: 2026-03-15", new_x="LMARGIN", new_y="NEXT")
+    pdf.cell(0, 8, "Bill To: Widget Industries", new_x="LMARGIN", new_y="NEXT")
+    pdf.ln(5)
+
+    _table_row(pdf, ["Item", "Qty", "Unit Price", "Line Total"], bold=True)
+    _table_row(pdf, ["Consulting Hours", "40", "$150.00", "$6,000.00"])
+    _table_row(pdf, ["Software License", "5", "$200.00", "$1,000.00"])
+    _table_row(pdf, ["Travel Expenses", "1", "$450.00", "$450.00"])
+    _table_row(pdf, ["", "", "Subtotal", "$7,450.00"], bold=True)
+
+    pdf.ln(5)
+    pdf.cell(0, 8, "Tax (10%): $745.00", new_x="LMARGIN", new_y="NEXT")
+    pdf.cell(0, 8, "Grand Total: $8,195.00", new_x="LMARGIN", new_y="NEXT")
+    pdf.ln(3)
+    pdf.cell(
+        0, 8,
+        "Breakdown: $6,000.00 + $1,000.00 + $450.00 = $7,450.00",
+        new_x="LMARGIN", new_y="NEXT",
+    )
+
+    pdf.output("testing/ledger/clean_invoice.pdf")
+    print("  clean_invoice.pdf")
+
+
+# ─────────────────────────────────────────────────────────────────────────────
+# 2. Tally error — column total is wrong
+# ─────────────────────────────────────────────────────────────────────────────
+def create_tally_error():
+    pdf = _new_pdf()
+    pdf.add_page()
+
+    _heading(pdf, "Q1 2026 Expense Report")
+    _body(pdf)
+    pdf.cell(0, 8, "Department: Engineering", new_x="LMARGIN", new_y="NEXT")
+    pdf.ln(5)
+
+    _table_row(pdf, ["Category", "Jan", "Feb", "Mar", "Total"], bold=True)
+    _table_row(pdf, ["Salaries", "$50,000", "$50,000", "$52,000", "$152,000"])
+    _table_row(pdf, ["Cloud Infra", "$12,000", "$13,500", "$14,200", "$39,700"])
+    _table_row(pdf, ["Equipment", "$8,000", "$2,500", "$5,000", "$15,500"])
+    # BUG: column totals are wrong — Jan should be 70,000, Grand should be 207,200
+    _table_row(pdf, ["Total", "$68,000", "$66,000", "$71,200", "$205,200"], bold=True)
+
+    pdf.ln(5)
+    pdf.cell(
+        0, 8,
+        "Total Q1 spend: $68,000 + $66,000 + $71,200 = $205,200",
+        new_x="LMARGIN", new_y="NEXT",
+    )
+
+    pdf.output("testing/ledger/tally_error.pdf")
+    print("  tally_error.pdf")
+
+
+# ─────────────────────────────────────────────────────────────────────────────
+# 3. Arithmetic error — inline expression is wrong
+# ─────────────────────────────────────────────────────────────────────────────
+def create_arithmetic_error():
+    pdf = _new_pdf()
+    pdf.add_page()
+
+    _heading(pdf, "Project Budget Summary")
+    _body(pdf)
+
+    lines = [
+        "Phase 1 (Design):       $45,000",
+        "Phase 2 (Development):  $120,000",
+        "Phase 3 (Testing):      $35,000",
+        "Phase 4 (Deployment):   $18,000",
+        "",
+        # BUG: 45000 + 120000 + 35000 + 18000 = 218,000, NOT 215,000
+        "Total project cost: $45,000 + $120,000 + $35,000 + $18,000 = $215,000",
+        "",
+        "Contingency (15%): $32,250",
+        # This one is also wrong: 215000 + 32250 = 247250, but the real total
+        # should be 218000 + 32700 = 250700. Either way 247,250 is stated.
+        "Grand total with contingency: $215,000 + $32,250 = $247,250",
+    ]
+    for line in lines:
+        pdf.cell(0, 8, line, new_x="LMARGIN", new_y="NEXT")
+
+    pdf.output("testing/ledger/arithmetic_error.pdf")
+    print("  arithmetic_error.pdf")
+
+
+# ─────────────────────────────────────────────────────────────────────────────
+# 4. Cross-page consistency error — same figure, different values
+# ─────────────────────────────────────────────────────────────────────────────
+def create_consistency_error():
+    pdf = _new_pdf()
+
+    # Page 1: Executive Summary
+    pdf.add_page()
+    _heading(pdf, "Annual Report 2025 - Executive Summary")
+    _body(pdf)
+    lines_p1 = [
+        "FY2025 was a strong year for GlobalTech Inc.",
+        "",
+        "Total Revenue: $24,500,000",
+        "Total Expenses: $18,200,000",
+        "Net Profit: $6,300,000",
+        "",
+        "Headcount grew from 142 to 187 employees.",
+        "Customer acquisition cost fell to $1,250 per customer.",
+    ]
+    for line in lines_p1:
+        pdf.cell(0, 8, line, new_x="LMARGIN", new_y="NEXT")
+
+    # Page 2: Financial Detail
+    pdf.add_page()
+    _heading(pdf, "Financial Detail")
+    _body(pdf)
+
+    _table_row(pdf, ["Metric", "Q1", "Q2", "Q3", "Q4", "FY2025"], bold=True)
+    _table_row(pdf, ["Revenue", "$5,100,000", "$5,800,000", "$6,200,000",
+                      "$7,200,000", "$24,300,000"])
+    _table_row(pdf, ["Expenses", "$4,300,000", "$4,400,000", "$4,600,000",
+                      "$4,900,000", "$18,200,000"])
+    _table_row(pdf, ["Profit", "$800,000", "$1,400,000", "$1,600,000",
+                      "$2,300,000", "$6,100,000"])
+
+    pdf.ln(5)
+    # BUG: Page 1 says Total Revenue = $24,500,000
+    #      Page 2 table says Revenue FY2025 = $24,300,000
+    #      Page 1 says Net Profit = $6,300,000
+    #      Page 2 table says Profit FY2025 = $6,100,000
+    pdf.cell(
+        0, 8,
+        "Full-year revenue of $24,300,000 exceeded targets by 8%.",
+        new_x="LMARGIN", new_y="NEXT",
+    )
+
+    pdf.output("testing/ledger/consistency_error.pdf")
+    print("  consistency_error.pdf")
+
+
+# ─────────────────────────────────────────────────────────────────────────────
+# 5. Mixed errors — has both tally and arithmetic problems
+# ─────────────────────────────────────────────────────────────────────────────
+def create_mixed_errors():
+    pdf = _new_pdf()
+    pdf.add_page()
+
+    _heading(pdf, "Monthly Sales Report - March 2026")
+    _body(pdf)
+
+    _table_row(pdf, ["Region", "Units Sold", "Revenue", "Commission"], bold=True)
+    _table_row(pdf, ["North", "340", "$51,000", "$5,100"])
+    _table_row(pdf, ["South", "280", "$42,000", "$4,200"])
+    _table_row(pdf, ["East", "195", "$29,250", "$2,925"])
+    _table_row(pdf, ["West", "410", "$61,500", "$6,150"])
+    # BUG: Units should be 1225 not 1220, Revenue should be $183,750 not $182,750
+    _table_row(pdf, ["Total", "1,220", "$182,750", "$18,375"], bold=True)
+
+    pdf.ln(5)
+    # BUG: 51000 + 42000 + 29250 + 61500 = 183,750, NOT 182,750
+    pdf.cell(
+        0, 8,
+        "Total revenue: $51,000 + $42,000 + $29,250 + $61,500 = $182,750",
+        new_x="LMARGIN", new_y="NEXT",
+    )
+    pdf.ln(3)
+    pdf.cell(
+        0, 8,
+        "Commission rate: 10% across all regions.",
+        new_x="LMARGIN", new_y="NEXT",
+    )
+
+    pdf.output("testing/ledger/mixed_errors.pdf")
+    print("  mixed_errors.pdf")
+
+
+# ─────────────────────────────────────────────────────────────────────────────
+# 6. Statement errors — prose claims that contradict the numbers
+# ─────────────────────────────────────────────────────────────────────────────
+def create_statement_errors():
+    pdf = _new_pdf()
+    pdf.add_page()
+
+    _heading(pdf, "FY2025 Annual Review - Statement Errors")
+    _body(pdf)
+
+    # Table with correct numbers
+    _table_row(pdf, ["Metric", "FY2024", "FY2025"], bold=True)
+    _table_row(pdf, ["Revenue", "$10,000,000", "$11,200,000"])
+    _table_row(pdf, ["Expenses", "$7,500,000", "$8,100,000"])
+    _table_row(pdf, ["Profit", "$2,500,000", "$3,100,000"])
+    _table_row(pdf, ["Headcount", "142", "187"])
+
+    pdf.ln(5)
+
+    # Correct claim: profit grew from 2.5M to 3.1M = 24% growth
+    pdf.cell(
+        0, 8,
+        "Profit grew 24% year-over-year, from $2,500,000 to $3,100,000.",
+        new_x="LMARGIN", new_y="NEXT",
+    )
+
+    # BUG: Revenue grew from 10M to 11.2M = 12% growth, NOT 15%
+    pdf.cell(
+        0, 8,
+        "Revenue increased 15% compared to the prior year.",
+        new_x="LMARGIN", new_y="NEXT",
+    )
+
+    # BUG: Expenses went UP from 7.5M to 8.1M, NOT decreased
+    pdf.cell(
+        0, 8,
+        "Operating expenses decreased year-over-year.",
+        new_x="LMARGIN", new_y="NEXT",
+    )
+
+    # BUG: Headcount grew from 142 to 187 = 31.7%, NOT 25%
+    pdf.cell(
+        0, 8,
+        "The team expanded by 25%, growing from 142 to 187 employees.",
+        new_x="LMARGIN", new_y="NEXT",
+    )
+
+    # Correct claim: profit margin = 3.1M / 11.2M = 27.68%
+    pdf.cell(
+        0, 8,
+        "Net profit margin reached approximately 28%.",
+        new_x="LMARGIN", new_y="NEXT",
+    )
+
+    pdf.output("testing/ledger/statement_errors.pdf")
+    print("  statement_errors.pdf")
+
+
+if __name__ == "__main__":
+    import os
+    os.makedirs("testing/ledger", exist_ok=True)
+    print("Generating test PDFs:")
+    create_clean_invoice()
+    create_tally_error()
+    create_arithmetic_error()
+    create_consistency_error()
+    create_mixed_errors()
+    create_statement_errors()
+    print("Done!")
diff --git a/testing/ledger/mixed_errors.pdf b/testing/ledger/mixed_errors.pdf
new file mode 100644
index 0000000000..0d5e44ed57
Binary files /dev/null and b/testing/ledger/mixed_errors.pdf differ
diff --git a/testing/ledger/statement_errors.pdf b/testing/ledger/statement_errors.pdf
new file mode 100644
index 0000000000..6d6d9e13e2
--- /dev/null
+++ b/testing/ledger/statement_errors.pdf
@@ -0,0 +1,86 @@
+%PDF-1.3
+%éëñ¿
+1 0 obj
+<<
+/Count 1
+/Kids [3 0 R]
+/MediaBox [0 0 595.28 841.89]
+/Type /Pages
+>>
+endobj
+2 0 obj
+<<
+/OpenAction [3 0 R /FitH null]
+/PageLayout /OneColumn
+/Pages 1 0 R
+/Type /Catalog
+>>
+endobj
+3 0 obj
+<<
+/Contents 4 0 R
+/Parent 1 0 R
+/Resources 7 0 R
+/Type /Page
+>>
+endobj
+4 0 obj
+<<
+/Filter /FlateDecode
+/Length 552
+>>
+stream
+xœ}ÔK�Ú0ðû~Š9,R+…©ßvŽ­ÄªªÔ‡º¹ô˜‚aS‘‡LX–oßI€%	!ðoü;ðí�¡¶pxø’À§'Ü c�¬a‘4�$GîÀÆ­‚džþ&4|.Š}º…ßþ5ó˜Ãs�Ö>÷E
‹Ê°ûÉ¿3Ѫìª
+‡Rƒµ�
ncÔæB q<<
áL¢ŒÁjúQ´e¿û:dË‹*˜Eç¦
árÙ5Ú©«‹!�EŦ
Eƒ�¹1t/�K§Û¾�«±CN…¥Awê)uÑ{?L7e7£;È#gcígq
+R*Fiû�D:‡¢‹f÷BäÔ)®�Û–Y¼U¾ØùÝ0Õ",ÝŠ®òh#=jÊQZ ×=ÇE|4ÓèäÝmhP)0´ûUÜ2¿B¹Îêa¤)ã©c<Š{‘¦œs¤®#Ç#'›ÞY&‰±c:Þ*_}ºZ–ûbjRŽ6
ë2\‰AšI@5#{óàÎvÞªÓ±cè›Nãaè´jGŸ†yùêüùÁ:”9\;u	×þà­Ìb®ûòAV,ƒOw~\Ï`YæU膠úÅC²2´Uo1íšSŠŸ•i�ðçí+qûsqL»8�“PÉÚ§yäŊÿ=‚гˆ:P¿
L]o&H½ŸWÛòèýnÄUéÈnܾ¦(m+ó4l²‚V$]¾�ŸVôü-ËéßR)7{wþºgtN
+endstream
+endobj
+5 0 obj
+<<
+/BaseFont /Helvetica-Bold
+/Encoding /WinAnsiEncoding
+/Subtype /Type1
+/Type /Font
+>>
+endobj
+6 0 obj
+<<
+/BaseFont /Helvetica
+/Encoding /WinAnsiEncoding
+/Subtype /Type1
+/Type /Font
+>>
+endobj
+7 0 obj
+<<
+/Font <</F1 5 0 R
+/F2 6 0 R>>
+/ProcSet [/PDF /Text /ImageB /ImageC /ImageI]
+>>
+endobj
+8 0 obj
+<<
+/CreationDate (D:20260402165856Z)
+>>
+endobj
+xref
+0 9
+0000000000 65535 f 
+0000000015 00000 n 
+0000000102 00000 n 
+0000000205 00000 n 
+0000000285 00000 n 
+0000000909 00000 n 
+0000001011 00000 n 
+0000001108 00000 n 
+0000001205 00000 n 
+trailer
+<<
+/Size 9
+/Root 2 0 R
+/Info 8 0 R
+/ID [<E64894B962A9DEEAE989502D0C51B85F><E64894B962A9DEEAE989502D0C51B85F>]
+>>
+startxref
+1260
+%%EOF
diff --git a/testing/ledger/tally_error.pdf b/testing/ledger/tally_error.pdf
new file mode 100644
index 0000000000..507f4f5ced
Binary files /dev/null and b/testing/ledger/tally_error.pdf differ
diff --git a/testing/test.sh b/testing/test.sh
index 9308cd71d3..1df9eb9800 100644
--- a/testing/test.sh
+++ b/testing/test.sh
@@ -88,6 +88,7 @@ capture_failure_logs() {
 capture_build_failure() {
     local build_name=$1
     local log_file="$REPORT_DIR/${build_name//[^a-zA-Z0-9_-]/_}.failure.log"
+    local build_log="$REPORT_DIR/${build_name//[^a-zA-Z0-9_-]/_}.build.log"
     local gradle_report_dirs=(
         "$PROJECT_ROOT/app/core/build/reports/tests"
         "$PROJECT_ROOT/app/common/build/reports/tests"
@@ -99,6 +100,13 @@ capture_build_failure() {
         echo "Timestamp: $(date -u +%Y-%m-%dT%H:%M:%SZ)"
         echo "---"
 
+        # Include Docker/command build output if captured
+        if [ -f "$build_log" ]; then
+            echo "--- Build output (last 100 lines) ---"
+            tail -100 "$build_log"
+            echo ""
+        fi
+
         for report_dir in "${gradle_report_dirs[@]}"; do
             if [ -d "$report_dir" ]; then
                 local txt_index="$report_dir/test/index.html"
@@ -332,6 +340,8 @@ capture_file_list() {
         -not -path '*/tmp/hsperfdata_stirlingpdfuser/*' \
         -not -path '*/tmp/hsperfdata_root/*' \
         -not -path '*/tmp/stirling-pdf/jetty-*/*' \
+        -not -path '*/tmp/stirling-pdf/lu*' \
+        -not -path '*/tmp/stirling-pdf/tmp*' \
         -not -path '/tmp/lu*' \
         -not -path '*/tmp/*/user/registrymodifications.xcu' \
         -not -path '/app/stirling.aot' \
@@ -361,8 +371,10 @@ capture_file_list() {
             -not -path '*/tmp/hsperfdata_root/*' \
             -not -path '*/tmp/stirling-pdf/hsperfdata_stirlingpdfuser/*' \
             -not -path '*/tmp/stirling-pdf/jetty-*/*' \
-            -not -path '/tmp/lu*' \
-            -not -path '/tmp/tmp*' \
+            -not -path '*/tmp/stirling-pdf/lu*' \
+            -not -path '*/tmp/stirling-pdf/tmp*' \
+            -not -path '*/tmp/lu*' \
+            -not -path '*/tmp/tmp*' \
             -not -path '/app/stirling.aot' \
             -not -path '*/tmp/stirling.aotconf' \
             -not -path '*/tmp/aot-*.log' \
@@ -699,12 +711,14 @@ main() {
         else
             DOCKER_CACHE_ARGS_ULTRA_LITE=""
         fi
+        local ultra_lite_build_log="$REPORT_DIR/Build-Ultra-Lite-Docker.build.log"
         if ! docker buildx build --build-arg VERSION_TAG=alpha \
             -t docker.stirlingpdf.com/stirlingtools/stirling-pdf:ultra-lite \
             -f ./docker/embedded/Dockerfile.ultra-lite \
             --load \
-            ${DOCKER_CACHE_ARGS_ULTRA_LITE} .; then
+            ${DOCKER_CACHE_ARGS_ULTRA_LITE} . 2>&1 | tee "$ultra_lite_build_log"; then
             failed_tests+=("Build-Ultra-Lite-Docker")
+            capture_build_failure "Build-Ultra-Lite-Docker"
             gha_endgroup
             exit 1
         fi
@@ -783,13 +797,15 @@ main() {
         else
             DOCKER_CACHE_ARGS_FAT=""
         fi
+        local fat_build_log="$REPORT_DIR/Build-Fat-Docker.build.log"
         if ! docker buildx build --build-arg VERSION_TAG=alpha \
             ${BASE_IMAGE_ARG} \
             -t docker.stirlingpdf.com/stirlingtools/stirling-pdf:fat \
             -f ./docker/embedded/Dockerfile.fat \
             --load \
-            ${DOCKER_CACHE_ARGS_FAT} .; then
+            ${DOCKER_CACHE_ARGS_FAT} . 2>&1 | tee "$fat_build_log"; then
             failed_tests+=("Build-Fat-Docker")
+            capture_build_failure "Build-Fat-Docker"
             gha_endgroup
             exit 1
         fi
@@ -875,6 +891,25 @@ main() {
             # Save docker logs produced during the behave run
             docker logs "$CONTAINER_NAME" 2>&1 | tail -n +"$((DOCKER_LOG_BEFORE + 1))" > "$REPORT_DIR/cucumber-docker-context.log" 2>/dev/null || true
 
+            # Check for "response is already committed" errors in docker logs.
+            # These indicate Spring Security re-running on async dispatches
+            # (e.g. StreamingResponseBody completion) which can corrupt responses.
+            local committed_errors
+            committed_errors=$(grep -c "response is already committed" "$REPORT_DIR/cucumber-docker-context.log" 2>/dev/null) || committed_errors=0
+            if [ "$committed_errors" -gt 0 ]; then
+                echo "ERROR: Found $committed_errors 'response is already committed' errors in docker logs."
+                echo "This usually means a StreamingResponseBody endpoint is triggering a Spring Security"
+                echo "re-authorization on the async dispatch. Check spring.security.filter.dispatcher-types"
+                echo "in application.properties."
+                grep -B2 "response is already committed" "$REPORT_DIR/cucumber-docker-context.log" | head -30
+                local committed_log="$REPORT_DIR/response-committed-errors.log"
+                grep -B5 "response is already committed" "$REPORT_DIR/cucumber-docker-context.log" > "$committed_log"
+                test_failure_logs["Response-Already-Committed"]="$committed_log"
+                failed_tests+=("Response-Already-Committed")
+            else
+                echo "No 'response is already committed' errors found in docker logs."
+            fi
+
             echo "Waiting 5 seconds for any file operations to complete..."
             sleep 5
 
@@ -886,6 +921,36 @@ main() {
                 passed_tests+=("Stirling-PDF-Regression $CONTAINER_NAME")
             else
                 echo "WARNING: Unexpected temporary files detected after behave tests!"
+
+                # Save temp file failure details to a log for the test report
+                local tempfile_log="$REPORT_DIR/temp-files-failure.log"
+                {
+                    echo "=== Temp File Regression Failure ==="
+                    echo "Container: $CONTAINER_NAME"
+                    echo ""
+                    echo "=== Before snapshot ==="
+                    cat "$BEFORE_FILE" 2>/dev/null || echo "(empty)"
+                    echo ""
+                    echo "=== After snapshot ==="
+                    cat "$AFTER_FILE" 2>/dev/null || echo "(empty)"
+                    echo ""
+                    echo "=== Diff (new/changed files) ==="
+                    cat "$DIFF_FILE" 2>/dev/null || echo "(empty)"
+                    echo ""
+                    echo "=== Leftover temp files ==="
+                    cat "${DIFF_FILE}.tmp" 2>/dev/null || echo "(none found)"
+                    echo ""
+                    echo "=== Docker logs ==="
+                    docker logs "$CONTAINER_NAME" 2>&1 | tail -200
+                } > "$tempfile_log" 2>/dev/null || true
+
+                # Copy snapshots to report dir for artifact upload
+                cp "$BEFORE_FILE" "$REPORT_DIR/" 2>/dev/null || true
+                cp "$AFTER_FILE" "$REPORT_DIR/" 2>/dev/null || true
+                cp "$DIFF_FILE" "$REPORT_DIR/" 2>/dev/null || true
+                cp "${DIFF_FILE}.tmp" "$REPORT_DIR/files_diff_tmp_matches.txt" 2>/dev/null || true
+
+                test_failure_logs["Stirling-PDF-Regression-Temp-Files"]="$tempfile_log"
                 failed_tests+=("Stirling-PDF-Regression-Temp-Files")
             fi
             passed_tests+=("Stirling-PDF-Regression $CONTAINER_NAME")